import { type ResponsiveProp } from "@salt-ds/core"; import type { DateFrameworkType, Timezone } from "@salt-ds/date-adapters"; import { type ComponentPropsWithoutRef, type ReactNode } from "react"; import { type UseCalendarMultiselectOffsetProps, type UseCalendarMultiselectRangeProps, type UseCalendarMultiselectSingleProps, type UseCalendarOffsetProps, type UseCalendarRangeProps, type UseCalendarSingleProps } from "./useCalendar"; /** * Base props for the Calendar component. */ export interface CalendarBaseProps extends ComponentPropsWithoutRef<"div"> { /** * The content to be rendered inside the Calendar. */ children: ReactNode; /** * If `true`, hides dates that are out of the selectable range. */ hideOutOfRangeDates?: boolean; /** * Ref to attach to the focused element,enabling focus to be controlled. */ focusedDateRef?: React.MutableRefObject; /** * Number of visible months, maximum 12, defaults to 1 */ numberOfVisibleMonths?: ResponsiveProp<1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12>; /** * Specifies the timezone behavior: * - If undefined, the timezone will be derived from the passed date, or from `defaultSelectedDate`/`selectedDate`. * - If set to "default", the default timezone of the date library will be used. * - If set to "system", the local system's timezone will be applied. * - If set to "UTC", the time will be returned in UTC. * - If set to a valid IANA timezone identifier, the time will be returned for that specific timezone. */ timezone?: Timezone; /** * If `true`, the calendar will be multiselect. */ multiselect?: boolean; } /** * Props for the Calendar component with single date selection. * @template TDate - The type of the date object. */ export interface CalendarSingleProps extends CalendarBaseProps, UseCalendarSingleProps { /** * The selection variant, set to "single". */ selectionVariant: "single"; } /** * Props for the Calendar component with multi-select, date selection. * @template TDate - The type of the date object. */ export interface CalendarMultiselectSingleProps extends CalendarBaseProps, UseCalendarMultiselectSingleProps { /** * The selection variant, set to "single". */ selectionVariant: "single"; /** * Multiple selection */ multiselect: true; } /** * Props for the Calendar component with date range selection. * @template TDate - The type of the date object. */ export interface CalendarRangeProps extends CalendarBaseProps, UseCalendarRangeProps { /** * The selection variant, set to "range". */ selectionVariant: "range"; } /** * Props for the Calendar component with multi-select, date range selection. * @template TDate - The type of the date object. */ export interface CalendarMultiselectRangeProps extends CalendarBaseProps, UseCalendarMultiselectRangeProps { /** * The selection variant, set to "single". */ selectionVariant: "range"; /** * Multiple selection */ multiselect: true; } /** * Props for the Calendar component with offset date selection. * @template TDate - The type of the date object. */ export interface CalendarOffsetProps extends CalendarBaseProps, UseCalendarOffsetProps { /** * The selection variant, set to "offset". */ selectionVariant: "offset"; } /** * Props for the Calendar component with multi-select, offset date selection. * @template TDate - The type of the date object. */ export interface CalendarMultiselectOffsetProps extends CalendarBaseProps, UseCalendarMultiselectOffsetProps { /** * The selection variant, set to "offset". */ selectionVariant: "offset"; /** * Multiple selection */ multiselect: true; } /** * Type representing the props for the Calendar component with various selection variants. * @template TDate - The type of the date object. */ export type CalendarProps = CalendarSingleProps | CalendarMultiselectSingleProps | CalendarRangeProps | CalendarMultiselectRangeProps | CalendarOffsetProps | CalendarMultiselectOffsetProps; export declare const Calendar: import("react").ForwardRefExoticComponent & import("react").RefAttributes>;