UNPKG

@tiaohsun/vue-datepicker

Version:

A Vue 3 datepicker with multi-calendar support, styled with Tailwind CSS

1,237 lines (1,213 loc) 42.9 kB
import { App } from 'vue'; import { ComponentOptionsMixin } from 'vue'; import { ComponentProvideOptions } from 'vue'; import { ComputedRef } from 'vue'; import { CreateComponentPublicInstanceWithMixins } from 'vue'; import { DateInputProps } from './components/inputs/DateInput.vue'; import { DefineComponent } from 'vue'; import { ErrorMessages } from './types/locale'; import { FieldError } from './types/internal'; import { GlobalComponents } from 'vue'; import { GlobalDirectives } from 'vue'; import { LocaleMessages } from './types/locale'; import { LocaleMessages as LocaleMessages_2 } from './locale'; import { LocaleMessages as LocaleMessages_3 } from '.'; import { OutputType as OutputType_2 } from '.'; import { PublicProps } from 'vue'; import { TailwindColor as TailwindColor_2 } from '.'; import { TimeInputProps } from './components/inputs/TimeInput.vue'; declare const __VLS_component: DefineComponent<DatePickerProps, { focus: () => void; reset: () => void; validate: () => Promise<boolean>; selectNow: () => Promise<void>; getDateTime: () => { year: number; month: number; day: number; hour?: number | undefined; minute?: number | undefined; second?: number | undefined; } | null; setDateTime: (dateTime: any) => void; setTheme: (color: TailwindColor_2 | string) => void; setDarkMode: () => void; setLightMode: () => void; setAutoMode: () => void; getCurrentMode: () => "light" | "dark"; isDarkMode: () => boolean; isLightMode: () => boolean; getErrors: () => { [x: string]: string; }; hasErrors: () => boolean; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { change: (date: DateTimeInput) => any; "update:modelValue": (date: DateTimeInput) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams?: Record<string, Record<string, any>> | undefined) => any; }, string, PublicProps, Readonly<DatePickerProps> & Readonly<{ onChange?: ((date: DateTimeInput) => any) | undefined; "onUpdate:modelValue"?: ((date: DateTimeInput) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams?: Record<string, Record<string, any>> | undefined) => any) | undefined; }>, { locale: string; calendar: string; modelValue: DateTimeInput; required: boolean; dateFormat: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; useI18n: boolean; disabled: boolean; weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6; showTime: boolean; autoFocusTimeAfterDate: boolean; outputType: OutputType_2; useStrictISO: boolean; placeholderOverrides: { selectDate?: string; year?: string; month?: string; day?: string; hour?: string; minute?: string; second?: string; }; mode: "light" | "dark" | "auto"; theme: TailwindColor_2 | string; customLocaleMessages: LocaleMessages_3; dateSeparator: string; inputEnabled: boolean; showClearButton: boolean; showErrorMessage: boolean; customErrorMessages: Record<string, string>; }, {}, {}, {}, string, ComponentProvideOptions, false, { containerRef: HTMLDivElement; dateInputRef: CreateComponentPublicInstanceWithMixins<Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (date: string) => any; }, PublicProps, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }> | null; timeInputRef: CreateComponentPublicInstanceWithMixins<Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (time: string) => any; "navigate-to-date": () => any; }, PublicProps, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, { hourRef: HTMLInputElement; minuteRef: HTMLInputElement; secondRef: HTMLInputElement; }, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }> | null; calendarRef: HTMLDivElement; }, any>; declare const __VLS_component_2: DefineComponent<DateRangeProps, { reset: () => void; validate: () => boolean; setRange: (range: { start: DateTimeInput; end: DateTimeInput; } | null) => void; focusStartDate: (event: MouseEvent) => void; focusEndDate: (event: MouseEvent) => void; setTheme: (color: TailwindColor_2 | string) => void; setDarkMode: () => void; setLightMode: () => void; setAutoMode: () => void; getErrors: () => { [x: string]: string; }; hasErrors: () => boolean; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { change: (range: { start: DateTimeInput; end: DateTimeInput; } | null) => any; "update:modelValue": (range: { start: DateTimeInput; end: DateTimeInput; } | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams?: Record<string, Record<string, any>> | undefined) => any; }, string, PublicProps, Readonly<DateRangeProps> & Readonly<{ onChange?: ((range: { start: DateTimeInput; end: DateTimeInput; } | null) => any) | undefined; "onUpdate:modelValue"?: ((range: { start: DateTimeInput; end: DateTimeInput; } | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams?: Record<string, Record<string, any>> | undefined) => any) | undefined; }>, { locale: string; calendar: string; modelValue: { start: DateTimeInput; end: DateTimeInput; } | null; minDate: DateTimeInput; maxDate: DateTimeInput; required: boolean; separator: string; dateFormat: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; useI18n: boolean; disabled: boolean; weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6; showTime: boolean; outputType: OutputType_2; useStrictISO: boolean; placeholderOverrides: { start?: string; end?: string; year?: string; month?: string; day?: string; hour?: string; minute?: string; second?: string; }; showShortcuts: boolean; incomplete: boolean; maxRange: number; minRange: number; mode: "light" | "dark" | "auto"; theme: TailwindColor_2 | string; dateSeparator: string; inputEnabled: boolean; showClearButton: boolean; showErrorMessage: boolean; customErrorMessages: Record<string, string>; }, {}, {}, {}, string, ComponentProvideOptions, false, { containerRef: HTMLDivElement; calendarRef: HTMLDivElement; startDateInputRef: CreateComponentPublicInstanceWithMixins<Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (date: string) => any; }, PublicProps, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }> | null; startTimeInputRef: CreateComponentPublicInstanceWithMixins<Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (time: string) => any; "navigate-to-date": () => any; }, PublicProps, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, { hourRef: HTMLInputElement; minuteRef: HTMLInputElement; secondRef: HTMLInputElement; }, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }> | null; endDateInputRef: CreateComponentPublicInstanceWithMixins<Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (date: string) => any; }, PublicProps, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }> | null; endTimeInputRef: CreateComponentPublicInstanceWithMixins<Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (time: string) => any; "navigate-to-date": () => any; }, PublicProps, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, { hourRef: HTMLInputElement; minuteRef: HTMLInputElement; secondRef: HTMLInputElement; }, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }> | null; }, any>; declare function __VLS_template(): { attrs: Partial<{}>; slots: Partial<Record<string, (_: any) => any>> & Partial<Record<number, (_: { error: { field: string; message: string; originalKey: string; params: {}; }; message: string; field: string; errorParams: {}; }) => any>> & { error?(_: { errors: { [x: string]: string; }; errorParams: {}; hasErrors: true; }): any; }; refs: { containerRef: HTMLDivElement; dateInputRef: CreateComponentPublicInstanceWithMixins<Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (date: string) => any; }, PublicProps, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }> | null; timeInputRef: CreateComponentPublicInstanceWithMixins<Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (time: string) => any; "navigate-to-date": () => any; }, PublicProps, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, { hourRef: HTMLInputElement; minuteRef: HTMLInputElement; secondRef: HTMLInputElement; }, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }> | null; calendarRef: HTMLDivElement; }; rootEl: any; }; declare function __VLS_template_2(): { attrs: Partial<{}>; slots: any; refs: { containerRef: HTMLDivElement; calendarRef: HTMLDivElement; startDateInputRef: CreateComponentPublicInstanceWithMixins<Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (date: string) => any; }, PublicProps, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }> | null; startTimeInputRef: CreateComponentPublicInstanceWithMixins<Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (time: string) => any; "navigate-to-date": () => any; }, PublicProps, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, { hourRef: HTMLInputElement; minuteRef: HTMLInputElement; secondRef: HTMLInputElement; }, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }> | null; endDateInputRef: CreateComponentPublicInstanceWithMixins<Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (date: string) => any; }, PublicProps, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<DateInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((date: string) => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => { [x: string]: FieldError; }; hasErrors: () => boolean; errorMessages: () => string[]; focus: () => void; focusLast: () => void; setDate: (dateStr: string) => void; resetCompletionState: () => void; }, {}, {}, {}, { modelValue: string | null; yearPlaceholder: string; monthPlaceholder: string; dayPlaceholder: string; minDate: string | null; maxDate: string | null; required: boolean; separator: string; dateFormat: string; }> | null; endTimeInputRef: CreateComponentPublicInstanceWithMixins<Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, { "update:modelValue": (value: string | null) => any; validation: (isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any; complete: (time: string) => any; "navigate-to-date": () => any; }, PublicProps, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }, false, {}, {}, GlobalComponents, GlobalDirectives, string, { hourRef: HTMLInputElement; minuteRef: HTMLInputElement; secondRef: HTMLInputElement; }, any, ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<TimeInputProps> & Readonly<{ "onUpdate:modelValue"?: ((value: string | null) => any) | undefined; onValidation?: ((isValid: boolean, errors: Record<string, string>, errorParams: Record<string, Record<string, any>>) => any) | undefined; onComplete?: ((time: string) => any) | undefined; "onNavigate-to-date"?: (() => any) | undefined; }>, { validate: () => void; reset: () => void; getErrors: () => Record<string, string>; hasErrors: ComputedRef<boolean>; setTime: (timeStr: string) => void; focus: () => void; focusLast: () => void; }, {}, {}, {}, { locale: string; modelValue: string | null; required: boolean; hourPlaceholder: string; minutePlaceholder: string; secondPlaceholder: string; enableSeconds: boolean; use24Hour: boolean; useLocalizedPeriod: boolean; minuteStep: number; }> | null; }; rootEl: any; }; declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>; declare type __VLS_TemplateResult_2 = ReturnType<typeof __VLS_template_2>; declare type __VLS_WithTemplateSlots<T, S> = T & { new (): { $slots: S; }; }; declare type __VLS_WithTemplateSlots_2<T, S> = T & { new (): { $slots: S; }; }; declare interface BaseDatePickerProps { mode?: 'light' | 'dark' | 'auto'; theme?: TailwindColor | string; calendar?: string; locale?: string; customLocaleMessages?: LocaleMessages_2; outputType?: OutputType; useStrictISO?: boolean; weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6; minDate?: DateTimeInput; maxDate?: DateTimeInput; dateSeparator?: string; dateFormat?: string; timeFormat?: string; showTime?: boolean; enableSeconds?: boolean; use24Hour?: boolean; useLocalizedPeriod?: boolean; disabled?: boolean; inputEnabled?: boolean; required?: boolean; showClearButton?: boolean; showErrorMessage?: boolean; useI18n?: boolean; customErrorMessages?: Record<string, string>; } /** * 簡化的日曆格式化插件介面 * 專注於提供 @internationalized/date 無法處理的自定義格式化功能 */ declare interface CalendarPlugin { /** 日曆識別碼 */ readonly id: string; /** 日曆顯示名稱(多語言) */ readonly displayName: Record<string, string>; /** 年份範圍 */ readonly yearRange: { min: number; max: number; }; /** * 自定義格式化 - 提供 @internationalized/date 無法處理的格式 * @param date 西元曆日期 * @param format 格式字串 (如 'ROC-YYYY年MM月DD日 A HH時mm分ss秒') * @param locale 語言設定 * @returns 格式化後的字串 */ format(date: SimpleDateValue, format: string, locale: string): string; /** * 檢查輸入字串是否可以被解析 * @param input 輸入字串 * @returns 是否可以解析 */ canParseInput(input: string): boolean; /** * 解析輸入字串為 SimpleDateValue * @param input 輸入字串 * @param locale 語言設定 * @returns 解析後的日期值(西元曆)或 null */ parseInput(input: string, locale: string): SimpleDateValue | null; /** * 檢查是否支援特定格式 * @param format 格式字串 * @returns 是否支援此格式 */ supportsFormat(format: string): boolean; } export declare const DatePicker: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>; export declare interface DatePickerProps extends BaseDatePickerProps { modelValue?: DateTimeInput; customDefaultTime?: string; autoFocusTimeAfterDate?: boolean; placeholderOverrides?: { selectDate?: string; year?: string; month?: string; day?: string; hour?: string; minute?: string; second?: string; }; } export declare const DateRange: __VLS_WithTemplateSlots_2<typeof __VLS_component_2, __VLS_TemplateResult_2["slots"]>; export declare interface DateRangeProps extends BaseDatePickerProps { modelValue?: { start: DateTimeInput; end: DateTimeInput; } | null; monthDisplayMode?: 'single' | 'dual'; placeholderOverrides?: { start?: string; end?: string; year?: string; month?: string; day?: string; hour?: string; minute?: string; second?: string; }; separator?: string; showShortcuts?: boolean; incomplete?: boolean; maxRange?: number; minRange?: number; } /** * 支持的日期時間格式 - 限縮 @internationalized/date 的使用 */ declare type DateTimeInput = string | Date | SimpleDateValue | null; export { ErrorMessages } export { LocaleMessages } /** * 輸出資料類型 * - 'iso': 標準 ISO 8601 字符串 2024-06-18T14:30:00 * - 'date': JavaScript Date 對象 new Date(...) * - 'object': 結構化日期對象 { year: 2024, month: 6, day: 18 } * - 'custom': 自定義格式字符串 (使用 dateFormat timeFormat) 2024年06月18日 下午2時30分 民國113年06月18日 */ export declare type OutputType = 'iso' | 'date' | 'object' | 'custom'; /** * 民國曆格式化插件 - 專注於自定義格式輸出 * 只處理 @internationalized/date 無法處理的特殊格式 */ export declare class RocFormatPlugin implements CalendarPlugin { readonly id = "roc"; readonly yearRange: { min: number; max: number; }; readonly displayName: { 'zh-TW': string; 'zh-CN': string; 'en-US': string; 'ja-JP': string; 'ko-KR': string; }; private readonly YEAR_OFFSET; parseInput(input: string, locale: string): SimpleDateValue | null; /** * 解析包含日期和時間的字串 */ private parseDateTime; /** * 解析日期部分 (如: "114年06月18日") * 統一轉換為公元曆 */ private parseDatePart; /** * 解析時間部分 (如: "上午 12時00分") */ private parseTimePart; canParseInput(input: string): boolean; /** * 使用指定分隔符解析 */ private tryParseWithSeparator; /** * 通用的 ROC 日期驗證和轉換方法 */ private validateAndConvertRocDate; /** * 檢查是否支援特定格式 */ supportsFormat(format: string): boolean; /** * 自定義格式化 - 專注於民國年的特殊格式 */ format(date: SimpleDateValue, format: string, locale: string): string; /** * 透過格式字串偵測時間制式 */ private detectTimeFormat; /** * 格式化日期部分 */ private formatDatePart; /** * 格式化 ROC 時間 */ private formatTimePart; /** * 統一的時間格式化處理 */ private getFormattedTime; /** * 基本時間格式化(24小時制) */ private formatBasicTime; /** * 中文時間格式化(24小時制) */ private formatChineseTime; /** * 12小時制時間格式化(統一處理) */ private format12HourTime; /** * 回退到 dayjs 處理 */ private fallbackToDateJs; } /** * 內部使用的簡單日期介面(西元曆),避免 @internationalized/date 的型別問題 */ declare interface SimpleDateValue { year: number; month: number; day: number; hour?: number; minute?: number; second?: number; } export declare type TailwindColor = 'slate' | 'gray' | 'zinc' | 'neutral' | 'stone' | 'red' | 'orange' | 'amber' | 'yellow' | 'lime' | 'green' | 'emerald' | 'teal' | 'cyan' | 'sky' | 'blue' | 'indigo' | 'violet' | 'purple' | 'fuchsia' | 'pink' | 'rose'; declare const VueDatepicker: { install(app: App): void; }; export { VueDatepicker } export default VueDatepicker; export { }