@stachelock/ui 0.2.13 → 0.3.0

package/dist/src/components/inputs/DatepickerInput.d.ts

@@ -0,0 +1,852 @@
+import { PropType, Ref, FunctionalComponent, HTMLAttributes, VNodeProps, Component } from 'vue';
+import { AnySchema } from 'yup';
+
+/** Valid flow steps for multi-step date selection */
+export type FlowStep = 'month' | 'year' | 'calendar' | 'time' | 'minutes' | 'hours' | 'seconds';
+export type FlowType = FlowStep[];
+export type HideNavigationType = FlowStep[];
+/** Model value types supported by the datepicker */
+export type DatepickerModelValue = Date | Date[] | string | string[] | {
+    month: number;
+    year: number;
+} | {
+    hours: number;
+    minutes: number;
+    seconds?: number;
+} | [Date | null, Date | null] | null;
+/** Marker configuration for highlighting specific dates */
+export interface DatepickerMarker {
+    date: Date | string;
+    type?: 'dot' | 'line';
+    tooltip?: string;
+    color?: string;
+}
+/** Highlight configuration */
+export interface DatepickerHighlight {
+    dates?: Date[];
+    months?: {
+        month: number;
+        year: number;
+    }[];
+    years?: number[];
+    quarters?: {
+        quarter: number;
+        year: number;
+    }[];
+    weekdays?: number[];
+    options?: {
+        highlightDisabled?: boolean;
+    };
+}
+/** Preset date configuration */
+export interface DatepickerPreset {
+    label: string;
+    value: Date | Date[] | [Date, Date];
+    slot?: string;
+}
+/** Time model */
+export interface TimeModel {
+    hours: number;
+    minutes: number;
+    seconds?: number;
+}
+/** Month/Year model */
+export interface MonthYearModel {
+    month: number;
+    year: number;
+}
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    name: {
+        type: StringConstructor;
+        required: true;
+    };
+    value: {
+        type: PropType<DatepickerModelValue>;
+        default: null;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    tertiaryLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    hint: {
+        type: StringConstructor;
+        default: string;
+    };
+    rules: {
+        type: PropType<AnySchema>;
+        default: undefined;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    validateOnMount: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showErrors: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showValidCheck: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    successMessage: {
+        type: StringConstructor;
+        default: string;
+    };
+    monthPicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    yearPicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    weekPicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    quarterPicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    timePicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enableTimePicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    range: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiDates: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiDatesLimit: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    is24: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    minutesIncrement: {
+        type: NumberConstructor;
+        default: number;
+    };
+    secondsIncrement: {
+        type: NumberConstructor;
+        default: number;
+    };
+    hoursIncrement: {
+        type: NumberConstructor;
+        default: number;
+    };
+    minDate: {
+        type: PropType<string | Date | undefined>;
+        default: undefined;
+    };
+    maxDate: {
+        type: PropType<string | Date | undefined>;
+        default: undefined;
+    };
+    disabledDates: {
+        type: PropType<Date[] | ((date: Date) => boolean)>;
+        default: undefined;
+    };
+    allowedDates: {
+        type: PropType<Date[]>;
+        default: undefined;
+    };
+    disabledWeekDays: {
+        type: PropType<number[]>;
+        default: undefined;
+    };
+    inputFlow: {
+        type: PropType<FlowType>;
+        default: undefined;
+    };
+    hideNavigation: {
+        type: PropType<HideNavigationType>;
+        default: undefined;
+    };
+    partialFlow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    icon: {
+        type: PropType<Component | FunctionalComponent<HTMLAttributes & VNodeProps, Record<string, never>, any, {
+            [x: string]: (...args: never) => any;
+        }>>;
+        default: undefined;
+    };
+    autoApply: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    teleport: {
+        type: PropType<string | boolean>;
+        default: boolean;
+    };
+    teleportCenter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    inline: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiCalendars: {
+        type: PropType<number | boolean | {
+            solo?: boolean | undefined;
+            static?: boolean | undefined;
+        }>;
+        default: undefined;
+    };
+    monthChangeOnScroll: {
+        type: PropType<boolean | "inverse">;
+        default: boolean;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabledMessage: {
+        type: StringConstructor;
+        default: string;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    textInput: {
+        type: PropType<boolean | {
+            enterSubmit?: boolean | undefined;
+            tabSubmit?: boolean | undefined;
+            openMenu?: boolean | undefined;
+            format?: string | undefined;
+        }>;
+        default: boolean;
+    };
+    displayFormat: {
+        type: PropType<string | ((date: Date | Date[]) => string)>;
+        default: undefined;
+    };
+    previewFormat: {
+        type: PropType<string | ((date: Date | Date[]) => string)>;
+        default: undefined;
+    };
+    modelType: {
+        type: PropType<"format" | "timestamp" | undefined>;
+        default: undefined;
+    };
+    locale: {
+        type: StringConstructor;
+        default: string;
+    };
+    weekStart: {
+        type: PropType<0 | 1 | 2 | 3 | 4 | 5 | 6 | "4" | "0" | "1" | "2" | "3" | "5" | "6">;
+        default: undefined;
+    };
+    weekNumbers: {
+        type: PropType<boolean | "iso" | "local">;
+        default: boolean;
+    };
+    utc: {
+        type: PropType<boolean | "preserve">;
+        default: string;
+    };
+    markers: {
+        type: PropType<DatepickerMarker[]>;
+        default: () => never[];
+    };
+    highlight: {
+        type: PropType<Date[] | DatepickerHighlight | ((date: Date) => boolean)>;
+        default: undefined;
+    };
+    highlightWeekDays: {
+        type: PropType<number[]>;
+        default: undefined;
+    };
+    highlightDisabledDays: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disableMonthYearSelect: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showNowButton: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    sixWeeks: {
+        type: PropType<boolean | "center" | "append" | "prepend" | "fair">;
+        default: boolean;
+    };
+    startDate: {
+        type: PropType<string | Date>;
+        default: undefined;
+    };
+    startTime: {
+        type: PropType<TimeModel | TimeModel[]>;
+        default: undefined;
+    };
+    noToday: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    noDisabledRange: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    ignoreTimeValidation: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    preventMinMaxNavigation: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    transitions: {
+        type: PropType<boolean | {
+            open?: string | undefined;
+            close?: string | undefined;
+            next?: string | undefined;
+            previous?: string | undefined;
+        }>;
+        default: boolean;
+    };
+    autoPosition: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    altPosition: {
+        type: PropType<boolean | ((el: HTMLElement | undefined) => {
+            top: string | number;
+            left: string | number;
+            transform?: string | undefined;
+        })>;
+        default: undefined;
+    };
+    dark: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    presetDates: {
+        type: PropType<DatepickerPreset[]>;
+        default: () => never[];
+    };
+    presetsLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    selectText: {
+        type: StringConstructor;
+        default: string;
+    };
+    cancelText: {
+        type: StringConstructor;
+        default: string;
+    };
+    clearAriaLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {
+    openMenu: () => void;
+    closeMenu: () => void;
+    selectDate: () => void;
+    clearValue: () => Promise<void>;
+    setMonthYear: (value: {
+        month?: number | undefined;
+        year?: number | undefined;
+    }) => void;
+    /** Current open state */
+    isOpen: Ref<boolean, boolean>;
+    /** Validation state */
+    meta: import('vee-validate').FieldMeta<string | string[] | Date | Date[] | {
+        month: number;
+        year: number;
+    } | {
+        hours: number;
+        minutes: number;
+        seconds?: number | undefined;
+    } | [Date | null, Date | null] | null>;
+    /** Error message if any */
+    errorMessage: Ref<string | undefined, string | undefined>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:value": (value: string | (string | null)[] | null) => void;
+    "update:modelValue": (value: DatepickerModelValue) => void;
+    open: () => void;
+    closed: () => void;
+    focus: () => void;
+    blur: () => void;
+    cleared: () => void;
+    "text-submit": (value: string) => void;
+    "internal-model-change": (value: DatepickerModelValue, isValid: boolean) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    name: {
+        type: StringConstructor;
+        required: true;
+    };
+    value: {
+        type: PropType<DatepickerModelValue>;
+        default: null;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    tertiaryLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    hint: {
+        type: StringConstructor;
+        default: string;
+    };
+    rules: {
+        type: PropType<AnySchema>;
+        default: undefined;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    validateOnMount: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showErrors: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showValidCheck: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    successMessage: {
+        type: StringConstructor;
+        default: string;
+    };
+    monthPicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    yearPicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    weekPicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    quarterPicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    timePicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enableTimePicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    range: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiDates: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiDatesLimit: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    is24: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    minutesIncrement: {
+        type: NumberConstructor;
+        default: number;
+    };
+    secondsIncrement: {
+        type: NumberConstructor;
+        default: number;
+    };
+    hoursIncrement: {
+        type: NumberConstructor;
+        default: number;
+    };
+    minDate: {
+        type: PropType<string | Date | undefined>;
+        default: undefined;
+    };
+    maxDate: {
+        type: PropType<string | Date | undefined>;
+        default: undefined;
+    };
+    disabledDates: {
+        type: PropType<Date[] | ((date: Date) => boolean)>;
+        default: undefined;
+    };
+    allowedDates: {
+        type: PropType<Date[]>;
+        default: undefined;
+    };
+    disabledWeekDays: {
+        type: PropType<number[]>;
+        default: undefined;
+    };
+    inputFlow: {
+        type: PropType<FlowType>;
+        default: undefined;
+    };
+    hideNavigation: {
+        type: PropType<HideNavigationType>;
+        default: undefined;
+    };
+    partialFlow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    icon: {
+        type: PropType<Component | FunctionalComponent<HTMLAttributes & VNodeProps, Record<string, never>, any, {
+            [x: string]: (...args: never) => any;
+        }>>;
+        default: undefined;
+    };
+    autoApply: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    teleport: {
+        type: PropType<string | boolean>;
+        default: boolean;
+    };
+    teleportCenter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    inline: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiCalendars: {
+        type: PropType<number | boolean | {
+            solo?: boolean | undefined;
+            static?: boolean | undefined;
+        }>;
+        default: undefined;
+    };
+    monthChangeOnScroll: {
+        type: PropType<boolean | "inverse">;
+        default: boolean;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabledMessage: {
+        type: StringConstructor;
+        default: string;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    textInput: {
+        type: PropType<boolean | {
+            enterSubmit?: boolean | undefined;
+            tabSubmit?: boolean | undefined;
+            openMenu?: boolean | undefined;
+            format?: string | undefined;
+        }>;
+        default: boolean;
+    };
+    displayFormat: {
+        type: PropType<string | ((date: Date | Date[]) => string)>;
+        default: undefined;
+    };
+    previewFormat: {
+        type: PropType<string | ((date: Date | Date[]) => string)>;
+        default: undefined;
+    };
+    modelType: {
+        type: PropType<"format" | "timestamp" | undefined>;
+        default: undefined;
+    };
+    locale: {
+        type: StringConstructor;
+        default: string;
+    };
+    weekStart: {
+        type: PropType<0 | 1 | 2 | 3 | 4 | 5 | 6 | "4" | "0" | "1" | "2" | "3" | "5" | "6">;
+        default: undefined;
+    };
+    weekNumbers: {
+        type: PropType<boolean | "iso" | "local">;
+        default: boolean;
+    };
+    utc: {
+        type: PropType<boolean | "preserve">;
+        default: string;
+    };
+    markers: {
+        type: PropType<DatepickerMarker[]>;
+        default: () => never[];
+    };
+    highlight: {
+        type: PropType<Date[] | DatepickerHighlight | ((date: Date) => boolean)>;
+        default: undefined;
+    };
+    highlightWeekDays: {
+        type: PropType<number[]>;
+        default: undefined;
+    };
+    highlightDisabledDays: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disableMonthYearSelect: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showNowButton: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    sixWeeks: {
+        type: PropType<boolean | "center" | "append" | "prepend" | "fair">;
+        default: boolean;
+    };
+    startDate: {
+        type: PropType<string | Date>;
+        default: undefined;
+    };
+    startTime: {
+        type: PropType<TimeModel | TimeModel[]>;
+        default: undefined;
+    };
+    noToday: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    noDisabledRange: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    ignoreTimeValidation: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    preventMinMaxNavigation: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    transitions: {
+        type: PropType<boolean | {
+            open?: string | undefined;
+            close?: string | undefined;
+            next?: string | undefined;
+            previous?: string | undefined;
+        }>;
+        default: boolean;
+    };
+    autoPosition: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    altPosition: {
+        type: PropType<boolean | ((el: HTMLElement | undefined) => {
+            top: string | number;
+            left: string | number;
+            transform?: string | undefined;
+        })>;
+        default: undefined;
+    };
+    dark: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    presetDates: {
+        type: PropType<DatepickerPreset[]>;
+        default: () => never[];
+    };
+    presetsLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    selectText: {
+        type: StringConstructor;
+        default: string;
+    };
+    cancelText: {
+        type: StringConstructor;
+        default: string;
+    };
+    clearAriaLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{
+    onBlur?: (() => any) | undefined;
+    onFocus?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: DatepickerModelValue) => any) | undefined;
+    onOpen?: (() => any) | undefined;
+    "onUpdate:value"?: ((value: string | (string | null)[] | null) => any) | undefined;
+    "onText-submit"?: ((value: string) => any) | undefined;
+    onClosed?: (() => any) | undefined;
+    onCleared?: (() => any) | undefined;
+    "onInternal-model-change"?: ((value: DatepickerModelValue, isValid: boolean) => any) | undefined;
+}>, {
+    dark: boolean;
+    label: string;
+    placeholder: string;
+    rules: AnySchema;
+    inline: boolean;
+    disabled: boolean;
+    cancelText: string;
+    required: boolean;
+    value: DatepickerModelValue;
+    icon: Component | FunctionalComponent<HTMLAttributes & VNodeProps, Record<string, never>, any, {
+        [x: string]: (...args: never) => any;
+    }>;
+    range: boolean;
+    tertiaryLabel: string;
+    successMessage: string;
+    showErrors: boolean;
+    showValidCheck: boolean;
+    disabledMessage: string;
+    validateOnMount: boolean;
+    locale: string;
+    startTime: TimeModel | TimeModel[];
+    markers: DatepickerMarker[];
+    is24: boolean;
+    enableTimePicker: boolean;
+    multiCalendars: number | boolean | {
+        solo?: boolean | undefined;
+        static?: boolean | undefined;
+    };
+    weekNumbers: boolean | "iso" | "local";
+    hoursIncrement: number;
+    minutesIncrement: number;
+    secondsIncrement: number;
+    minDate: string | Date | undefined;
+    maxDate: string | Date | undefined;
+    weekStart: 0 | 1 | 2 | 3 | 4 | 5 | 6 | "4" | "0" | "1" | "2" | "3" | "5" | "6";
+    readonly: boolean;
+    previewFormat: string | ((date: Date | Date[]) => string);
+    clearable: boolean;
+    autoApply: boolean;
+    disableMonthYearSelect: boolean;
+    disabledDates: Date[] | ((date: Date) => boolean);
+    selectText: string;
+    autoPosition: boolean;
+    monthPicker: boolean;
+    timePicker: boolean;
+    textInput: boolean | {
+        enterSubmit?: boolean | undefined;
+        tabSubmit?: boolean | undefined;
+        openMenu?: boolean | undefined;
+        format?: string | undefined;
+    };
+    startDate: string | Date;
+    noToday: boolean;
+    altPosition: boolean | ((el: HTMLElement | undefined) => {
+        top: string | number;
+        left: string | number;
+        transform?: string | undefined;
+    });
+    disabledWeekDays: number[];
+    allowedDates: Date[];
+    monthChangeOnScroll: boolean | "inverse";
+    transitions: boolean | {
+        open?: string | undefined;
+        close?: string | undefined;
+        next?: string | undefined;
+        previous?: string | undefined;
+    };
+    multiDates: boolean;
+    presetDates: DatepickerPreset[];
+    partialFlow: boolean;
+    preventMinMaxNavigation: boolean;
+    utc: boolean | "preserve";
+    multiDatesLimit: number;
+    weekPicker: boolean;
+    yearPicker: boolean;
+    modelType: "format" | "timestamp" | undefined;
+    highlight: Date[] | DatepickerHighlight | ((date: Date) => boolean);
+    highlightWeekDays: number[];
+    highlightDisabledDays: boolean;
+    teleportCenter: boolean;
+    teleport: string | boolean;
+    ignoreTimeValidation: boolean;
+    hideNavigation: HideNavigationType;
+    noDisabledRange: boolean;
+    sixWeeks: boolean | "center" | "append" | "prepend" | "fair";
+    quarterPicker: boolean;
+    hint: string;
+    inputFlow: FlowType;
+    displayFormat: string | ((date: Date | Date[]) => string);
+    showNowButton: boolean;
+    presetsLabel: string;
+    clearAriaLabel: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>, {
+    "action-buttons"?(_: {
+        selectDate: () => void;
+        closeMenu: () => void;
+    }): any;
+    "calendar-cell"?(_: {
+        day: any;
+        date: any;
+    }): any;
+    "month-year"?(_: {
+        month: any;
+        year: any;
+        months: any;
+        years: any;
+        updateMonthYear: any;
+        handleMonthYearChange: any;
+    }): any;
+    "time-picker"?(_: any): any;
+    "left-sidebar"?(_: {}): any;
+    "right-sidebar"?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=DatepickerInput.vue.d.ts.map