import { type Ref, type PropType } from 'vue'; import { createNativeLocaleFormatterUTC, type CalendarSystem, type DisabledDays, type Timestamp, type TimestampStyle } from '@timestamp-js/core'; export interface CommonProps { modelValue: string; calendarSystem: CalendarSystem; weekdays: number[]; dir: 'ltr' | 'rtl' | 'auto'; dateType: 'round' | 'rounded' | 'square'; weekdayAlign: 'left' | 'center' | 'right'; dateAlign: 'left' | 'center' | 'right'; bordered: boolean; dark: boolean; noAria: boolean; noActiveDate: boolean; noHeader: boolean; noScroll: boolean; shortWeekdayLabel: boolean; noDefaultHeaderText: boolean; noDefaultHeaderBtn: boolean; minWeekdayLabel: number | string; weekdayBreakpoints: number[]; locale: string; animated: boolean; transitionPrev: string; transitionNext: string; disabledDays?: DisabledDays; disabledBefore?: string; disabledAfter?: string; disabledWeekdays?: number[]; dragEnterFunc?: (_event: Event, _type: string, _scope: any) => boolean; dragOverFunc?: (_event: Event, _type: string, _scope: any) => boolean; dragLeaveFunc?: (_event: Event, _type: string, _scope: any) => boolean; dropFunc?: (_event: Event, _type: string, _scope: any) => boolean; selectedDates: string[] | Set; selectedStartEndDates: string[]; hoverable: boolean; focusable: boolean; focusType: ('day' | 'date' | 'weekday' | 'interval' | 'time' | 'resource' | 'task')[]; } export type FocusType = CommonProps['focusType'][number]; export declare function isFocusableType(props: Pick, type: FocusType, enabled?: boolean): boolean; export declare const isValidWeekdays: (v: unknown) => boolean; export interface CalendarDefaultProps { calendarSystem?: CalendarSystem; } export declare const useCommonProps: { /** * Date value used by `v-model`, formatted as `YYYY-MM-DD`. * * @category model */ modelValue: { type: StringConstructor; default: string; validator: (v: string) => boolean; }; /** * Calendar system used for calendar math and component date values. Defaults to Gregorian. * * When an adapter is provided, date-bearing values are native to that adapter, and the * `locale`, `dir`, and `weekdays` props default from the adapter unless the app passes them. * * @category behavior * @example :calendar-system="islamicCivilCalendar" */ calendarSystem: { type: PropType; default: () => CalendarSystem; }; /** * Weekday indexes shown by the calendar, where `0` is Sunday and `6` is Saturday. Defaults to * the active calendar system's recommended weekday order. * * Pass this prop explicitly to override the adapter default, such as rendering a five-day * work week. * * @category display * @example :weekdays="[1, 2, 3, 4, 5]" */ weekdays: { type: PropType; default: (props: CalendarDefaultProps) => number[]; validator: (v: unknown) => boolean; }; /** * Text direction used by the rendered calendar root. Defaults to the active calendar system's * recommended direction. * * Pass this prop explicitly to override the adapter default. * * @category display * @example dir="rtl" * @example dir="ltr" * @example dir="auto" */ dir: { type: PropType<"ltr" | "rtl" | "auto">; default: (props: CalendarDefaultProps) => "ltr" | "rtl"; validator: (v: string) => boolean; }; /** * Shape used for rendered date buttons. * * @category style */ dateType: { type: () => "round" | "rounded" | "square"; default: string; validator: (v: string) => boolean; }; /** * Horizontal alignment for weekday labels. * * @category style */ weekdayAlign: { type: () => "left" | "center" | "right"; default: string; validator: (v: string) => boolean; }; /** * Horizontal alignment for date labels. * * @category style */ dateAlign: { type: () => "left" | "center" | "right"; default: string; validator: (v: string) => boolean; }; /** * Adds borders around calendar sections and cells. * * @category style */ bordered: BooleanConstructor; /** * Forces dark mode styling. * * @category style */ dark: BooleanConstructor; /** * Disables generated ARIA attributes. * * @category behavior */ noAria: BooleanConstructor; /** * Hides the active date styling. * * @category behavior */ noActiveDate: BooleanConstructor; /** * Hides the calendar header. * * @category display */ noHeader: BooleanConstructor; /** * Disables internal scroll containers where supported. * * @category behavior */ noScroll: BooleanConstructor; /** * Uses shortened weekday labels. * * @category display */ shortWeekdayLabel: BooleanConstructor; /** * Hides the default header text. * * @category display */ noDefaultHeaderText: BooleanConstructor; /** * Hides the default header button. * * @category display */ noDefaultHeaderBtn: BooleanConstructor; /** * Minimum number of weekday label characters to display. * * @category display */ minWeekdayLabel: { type: PropType; default: number; }; /** * Cell width breakpoints used to shorten weekday labels. * * @category layout */ weekdayBreakpoints: { type: () => number[]; default: () => number[]; validator: (v: number[]) => boolean; }; /** * BCP 47 locale used for date and weekday formatting. Defaults to the active calendar system's * recommended locale. * * Pass this prop explicitly to override the adapter default. * * @category display * @example locale="en-US" * @example locale="ar" * @example locale="hi-IN" */ locale: { type: StringConstructor; default: (props: CalendarDefaultProps) => string; }; /** * Enables animated transitions between calendar ranges. * * @category behavior */ animated: BooleanConstructor; /** * Transition name used when moving to the previous range. * * @category behavior * @example transition-prev="slide-right" * @example transition-prev="fade" * @example transition-prev="jump-down" */ transitionPrev: { type: StringConstructor; default: string; }; /** * Transition name used when moving to the next range. * * @category behavior * @example transition-next="slide-left" * @example transition-next="fade" * @example transition-next="jump-up" */ transitionNext: { type: StringConstructor; default: string; }; /** * Explicit disabled day definitions. * * @category behavior */ disabledDays: PropType; /** * Disables dates before this `YYYY-MM-DD` value. * * @category behavior */ disabledBefore: StringConstructor; /** * Disables dates after this `YYYY-MM-DD` value. * * @category behavior */ disabledAfter: StringConstructor; /** * Weekday indexes that should be disabled. * * @category behavior */ disabledWeekdays: { type: () => number[]; default: () => string[] | Set; }; /** * Drag-enter guard called before a dragged item enters a calendar target. * * @category behavior */ dragEnterFunc: PropType<(_event: Event, _type: string, _scope: any) => boolean>; /** * Drag-over guard called while a dragged item is over a calendar target. * * @category behavior */ dragOverFunc: PropType<(_event: Event, _type: string, _scope: any) => boolean>; /** * Drag-leave guard called before a dragged item leaves a calendar target. * * @category behavior */ dragLeaveFunc: PropType<(_event: Event, _type: string, _scope: any) => boolean>; /** * Drop guard called before a dragged item is dropped on a calendar target. * * @category behavior */ dropFunc: PropType<(_event: Event, _type: string, _scope: any) => boolean>; /** * Selected date strings highlighted by the calendar. * * @category model */ selectedDates: { type: PropType>; default: () => string[] | Set; }; /** * Start and end date strings used to highlight a selected range. * * @category model */ selectedStartEndDates: { type: () => string[]; default: () => string[]; }; /** * Applies hover styling to interactive calendar cells. * * @category behavior */ hoverable: BooleanConstructor; /** * Makes supported calendar cells keyboard focusable. * * @category behavior */ focusable: BooleanConstructor; /** * Calendar target types that can receive keyboard focus. * * @category behavior */ focusType: { type: () => ("day" | "date" | "weekday" | "interval" | "time" | "resource" | "task")[]; default: () => ("day" | "date" | "weekday" | "interval" | "time" | "resource" | "task")[]; validator: (v: string[]) => boolean; }; }; export interface CommonReturn { parsedStart: Ref; parsedEnd: Ref; dayFormatter: Ref<(_timestamp: Timestamp, _short?: boolean) => string>; weekdayFormatter: Ref>; ariaDateFormatter: Ref>; arrayHasDate: (_arr: string[], _timestamp: Timestamp) => boolean; checkDays: (_arr: string[], _timestamp: Timestamp) => { firstDay: boolean; betweenDays: boolean; lastDay: boolean; }; getRelativeClasses: (_timestamp: Timestamp, _outside?: boolean, _selectedDays?: string[], _startEndDays?: string[], _hover?: boolean) => Record; startOfWeek: (_timestamp: Timestamp) => Timestamp; endOfWeek: (_timestamp: Timestamp) => Timestamp; dayStyleDefault: ({ scope }: { scope: any; }) => TimestampStyle; getDisabledStyle: (_timestamp: Timestamp) => TimestampStyle; } export default function useCommon(props: CommonProps, { startDate, endDate, times, }: { startDate: Ref; endDate: Ref; times: { today: Timestamp; }; }): CommonReturn;