@aifuxi/semi-ui-vue 2.0.0 → 2.0.2

package/dist/_shared/02a8f447afb2.js

@@ -0,0 +1,1177 @@
+import { __webpack_require__ } from "../rslib-runtime.js";
+import "../_runtime/25ec6438a029.js";
+import { defineComponent, createCommentVNode, useSlots, markRaw, shallowReactive, toDisplayString, inject, onBeforeUnmount, unref, Fragment, onMounted, mergeProps, withModifiers, useAttrs, createElementBlock, createElementVNode, useTemplateRef, createVNode, getCurrentInstance, normalizeClass, openBlock, createBlock, renderSlot, createSlots, createTextVNode, watch, withCtx, computed } from "./bb8e729ed4ee.js";
+import "./a7e0eab4d4b0.js";
+import { IconClear, IconCalendarClock, IconCalendar } from "./d67f68a705f9.js";
+import { configContextKey } from "./650465d64194.js";
+import { semiGlobal as semi_global } from "./7d608cdc8674.js";
+import { en_US } from "./0b135951952f.js";
+import { zh_CN } from "./11c87b78a456.js";
+import { useRenderComputed } from "./b843d2864038.js";
+import { Popover } from "./013361e2e75c.js";
+import { DatePickerPanel } from "./6dc3e2f2bf86.js";
+import { DatePickerNodeRenderer } from "./40dd8e710421.js";
+import { Input } from "./116e4b06bf76.js";
+import { getDefaultFormatTokenByType } from "./e951aff0f4d5.js";
+import { DatePickerFoundation } from "./8c3fa8d25db0.js";
+const isEqual = __webpack_require__("98918");
+var isEqual_default = /*#__PURE__*/ __webpack_require__.n(isEqual);
+const _hoisted_1 = [
+    "aria-label",
+    "aria-disabled"
+];
+const _hoisted_2 = {
+    key: 0,
+    class: "semi-datepicker-range-input-prefix",
+    "x-semi-prop": "prefix,insetLabel"
+};
+const _hoisted_3 = {
+    class: "semi-datepicker-range-input-suffix"
+};
+const DatePickervue_type_script_setup_true_lang_ts = /*@__PURE__*/ defineComponent({
+    name: 'DatePicker',
+    inheritAttrs: false,
+    __name: 'DatePicker',
+    props: {
+        ariaDescribedby: {},
+        ariaErrormessage: {},
+        ariaInvalid: {
+            type: [
+                Boolean,
+                String
+            ]
+        },
+        ariaLabelledby: {},
+        ariaRequired: {
+            type: [
+                Boolean,
+                String
+            ]
+        },
+        autoAdjustOverflow: {
+            type: Boolean
+        },
+        autoFocus: {
+            type: Boolean
+        },
+        autoSwitchDate: {
+            type: Boolean
+        },
+        borderless: {
+            type: Boolean
+        },
+        bottomSlot: {
+            type: [
+                Object,
+                String,
+                Number,
+                Boolean,
+                null,
+                Array
+            ]
+        },
+        class: {
+            type: [
+                Boolean,
+                null,
+                String,
+                Object,
+                Array
+            ]
+        },
+        className: {
+            type: [
+                Boolean,
+                null,
+                String,
+                Object,
+                Array
+            ]
+        },
+        clearIcon: {
+            type: [
+                Object,
+                String,
+                Number,
+                Boolean,
+                null,
+                Array
+            ]
+        },
+        dateFnsLocale: {},
+        defaultOpen: {
+            type: Boolean
+        },
+        defaultPickerValue: {},
+        defaultValue: {},
+        density: {},
+        disabled: {
+            type: Boolean
+        },
+        disabledDate: {
+            type: Function
+        },
+        disabledTime: {
+            type: Function
+        },
+        disabledTimePicker: {
+            type: Boolean
+        },
+        dropdownClassName: {
+            type: [
+                Boolean,
+                null,
+                String,
+                Object,
+                Array
+            ]
+        },
+        dropdownMargin: {},
+        dropdownStyle: {
+            type: [
+                Boolean,
+                null,
+                String,
+                Object,
+                Array
+            ]
+        },
+        endDateOffset: {
+            type: Function
+        },
+        endYear: {},
+        format: {},
+        getPopupContainer: {
+            type: Function
+        },
+        hideDisabledOptions: {
+            type: Boolean
+        },
+        id: {},
+        insetInput: {
+            type: [
+                Boolean,
+                Object
+            ]
+        },
+        insetLabel: {
+            type: [
+                Object,
+                String,
+                Number,
+                Boolean,
+                null,
+                Array
+            ]
+        },
+        insetLabelId: {},
+        inputReadOnly: {
+            type: Boolean
+        },
+        inputStyle: {
+            type: [
+                Boolean,
+                null,
+                String,
+                Object,
+                Array
+            ]
+        },
+        leftSlot: {
+            type: [
+                Object,
+                String,
+                Number,
+                Boolean,
+                null,
+                Array
+            ]
+        },
+        locale: {},
+        localeCode: {},
+        max: {},
+        modelValue: {},
+        motion: {
+            type: Boolean
+        },
+        multiple: {
+            type: Boolean
+        },
+        needConfirm: {
+            type: Boolean
+        },
+        onChangeWithDateFirst: {
+            type: Boolean
+        },
+        open: {
+            type: Boolean
+        },
+        placeholder: {},
+        position: {},
+        prefix: {
+            type: [
+                Object,
+                String,
+                Number,
+                Boolean,
+                null,
+                Array
+            ]
+        },
+        presetPosition: {},
+        presets: {},
+        preventScroll: {
+            type: Boolean
+        },
+        rangeSeparator: {},
+        rangeSeparatorNode: {
+            type: [
+                Object,
+                String,
+                Number,
+                Boolean,
+                null,
+                Array
+            ]
+        },
+        renderDate: {
+            type: Function
+        },
+        renderFullDate: {
+            type: Function
+        },
+        rightSlot: {
+            type: [
+                Object,
+                String,
+                Number,
+                Boolean,
+                null,
+                Array
+            ]
+        },
+        showClear: {
+            type: Boolean
+        },
+        size: {},
+        spacing: {},
+        startDateOffset: {
+            type: Function
+        },
+        startYear: {},
+        stopPropagation: {
+            type: [
+                Boolean,
+                String
+            ]
+        },
+        style: {
+            type: [
+                Boolean,
+                null,
+                String,
+                Object,
+                Array
+            ]
+        },
+        syncSwitchMonth: {
+            type: Boolean
+        },
+        timePickerOpts: {},
+        timeZone: {},
+        topSlot: {
+            type: [
+                Object,
+                String,
+                Number,
+                Boolean,
+                null,
+                Array
+            ]
+        },
+        triggerRender: {
+            type: Function
+        },
+        type: {},
+        validateStatus: {},
+        value: {},
+        weekStartsOn: {},
+        yearAndMonthOpts: {},
+        zIndex: {}
+    },
+    emits: [
+        "blur",
+        "cancel",
+        "change",
+        "clear",
+        "clickOutside",
+        "confirm",
+        "focus",
+        "maxSelect",
+        "openChange",
+        "panelChange",
+        "presetClick",
+        "update:modelValue",
+        "update:open",
+        "update:value"
+    ],
+    setup (__props, { expose: __expose, emit: __emit }) {
+        const DEFAULT_ZH_CN_LOCALE = Object.freeze({
+            placeholder: {
+                date: '请选择日期',
+                dateTime: '请选择日期及时间',
+                dateRange: [
+                    '开始日期',
+                    '结束日期'
+                ],
+                dateTimeRange: [
+                    '开始日期',
+                    '结束日期'
+                ],
+                monthRange: [
+                    '开始月份',
+                    '结束月份'
+                ],
+                month: '请选择月份',
+                year: '请选择年份'
+            },
+            presets: '快捷选择',
+            footer: {
+                confirm: '确定',
+                cancel: '取消'
+            },
+            selectDate: '返回选择日期',
+            selectTime: '选择时间',
+            year: '年',
+            month: '月',
+            day: '日',
+            monthText: '${year}年 ${month}',
+            months: Object.fromEntries(Array.from({
+                length: 12
+            }, (_, index)=>[
+                    index + 1,
+                    `${index + 1}月`
+                ])),
+            fullMonths: Object.fromEntries(Array.from({
+                length: 12
+            }, (_, index)=>[
+                    index + 1,
+                    String(index + 1)
+                ])),
+            weeks: {
+                Mon: '一',
+                Tue: '二',
+                Wed: '三',
+                Thu: '四',
+                Fri: '五',
+                Sat: '六',
+                Sun: '日'
+            },
+            localeFormatToken: {
+                FORMAT_SWITCH_DATE: 'yyyy-MM-dd'
+            }
+        });
+        const DEFAULT_EN_US_LOCALE = Object.freeze({
+            placeholder: {
+                date: 'Select date',
+                dateTime: 'Select date and time',
+                dateRange: [
+                    'Start date',
+                    'End date'
+                ],
+                dateTimeRange: [
+                    'Start date',
+                    'End date'
+                ],
+                monthRange: [
+                    'Start month',
+                    'End month'
+                ],
+                month: 'Select month',
+                year: 'Select year'
+            },
+            presets: 'Presets',
+            footer: {
+                confirm: 'Confirm',
+                cancel: 'Cancel'
+            },
+            selectDate: 'Select Date',
+            selectTime: 'Select Time',
+            year: 'year',
+            month: 'month',
+            day: 'day',
+            monthText: '${month} ${year}',
+            months: {
+                1: 'Jan',
+                2: 'Feb',
+                3: 'Mar',
+                4: 'Apr',
+                5: 'May',
+                6: 'Jun',
+                7: 'Jul',
+                8: 'Aug',
+                9: 'Sep',
+                10: 'Oct',
+                11: 'Nov',
+                12: 'Dec'
+            },
+            fullMonths: {
+                1: 'January',
+                2: 'February',
+                3: 'March',
+                4: 'April',
+                5: 'May',
+                6: 'June',
+                7: 'July',
+                8: 'August',
+                9: 'September',
+                10: 'October',
+                11: 'November',
+                12: 'December'
+            },
+            weeks: {
+                Mon: 'Mon',
+                Tue: 'Tue',
+                Wed: 'Wed',
+                Thu: 'Thu',
+                Fri: 'Fri',
+                Sat: 'Sat',
+                Sun: 'Sun'
+            },
+            localeFormatToken: {
+                FORMAT_SWITCH_DATE: 'MM/dd/yyyy'
+            }
+        });
+        const props = __props;
+        const emit = __emit;
+        const attrs = useAttrs();
+        const slots = useSlots();
+        const instance = getCurrentInstance();
+        const inputComponent = useTemplateRef('inputComponent');
+        const rangeStartComponent = useTemplateRef('rangeStartComponent');
+        const rangeEndComponent = useTemplateRef('rangeEndComponent');
+        const injectedConfig = inject(configContextKey, void 0);
+        const config = computed(()=>injectedConfig ? injectedConfig.value : {
+                direction: 'ltr',
+                locale: {
+                    code: 'zh-CN'
+                }
+            });
+        function hasRawProp(name) {
+            const raw = instance?.vnode.props;
+            const kebab = name.replace(/[A-Z]/g, (letter)=>`-${letter.toLowerCase()}`);
+            return Boolean(raw && (Object.prototype.hasOwnProperty.call(raw, name) || Object.prototype.hasOwnProperty.call(raw, kebab)));
+        }
+        function resolveProp(key, fallback) {
+            if (hasRawProp(String(key)) && void 0 !== props[key]) return props[key];
+            const globalValue = semi_global.config.overrideDefaultProps?.DatePicker?.[key];
+            return void 0 === globalValue ? fallback : globalValue;
+        }
+        const modelControlled = computed(()=>hasRawProp('modelValue'));
+        const valueControlled = computed(()=>hasRawProp('value'));
+        const controlledValue = computed(()=>modelControlled.value || valueControlled.value);
+        const incomingValue = computed(()=>modelControlled.value ? props.modelValue : props.value);
+        const controlledOpen = computed(()=>hasRawProp('open'));
+        const type = computed(()=>props.type ?? 'date');
+        const isRange = computed(()=>type.value.includes('Range') && 'monthRange' !== type.value);
+        const localeCode = computed(()=>props.localeCode ?? config.value.locale.code ?? 'zh-CN');
+        const locale = computed(()=>{
+            const fallback = 'en-US' === localeCode.value ? DEFAULT_EN_US_LOCALE : DEFAULT_ZH_CN_LOCALE;
+            const provider = config.value.locale.DatePicker;
+            const explicit = props.locale;
+            const candidate = explicit ?? provider;
+            if (!candidate) return fallback;
+            return {
+                ...fallback,
+                ...candidate,
+                placeholder: {
+                    ...fallback.placeholder,
+                    ...candidate.placeholder
+                },
+                footer: {
+                    ...fallback.footer,
+                    ...candidate.footer
+                },
+                months: {
+                    ...fallback.months,
+                    ...candidate.months
+                },
+                fullMonths: {
+                    ...fallback.fullMonths,
+                    ...candidate.fullMonths
+                },
+                weeks: {
+                    ...fallback.weeks,
+                    ...candidate.weeks
+                },
+                localeFormatToken: {
+                    ...fallback.localeFormatToken,
+                    ...candidate.localeFormatToken
+                }
+            };
+        });
+        const placeholder = computed(()=>props.placeholder ?? locale.value.placeholder[type.value] ?? '');
+        const runtimeProps = computed(()=>({
+                ...props,
+                autoAdjustOverflow: resolveProp('autoAdjustOverflow', true),
+                autoFocus: resolveProp('autoFocus', false),
+                autoSwitchDate: resolveProp('autoSwitchDate', true),
+                borderless: resolveProp('borderless', false),
+                dateFnsLocale: props.dateFnsLocale ?? config.value.locale.dateFnsLocale ?? ('en-US' === localeCode.value ? en_US : zh_CN),
+                defaultOpen: props.defaultOpen ?? false,
+                density: props.density ?? 'default',
+                disabled: resolveProp('disabled', false),
+                disabledDate: props.disabledDate ?? (()=>false),
+                disabledTime: props.disabledTime ?? (()=>({})),
+                format: props.format ?? getDefaultFormatTokenByType(type.value),
+                getPopupContainer: props.getPopupContainer ?? config.value.getPopupContainer,
+                hideDisabledOptions: props.hideDisabledOptions ?? false,
+                inputReadOnly: resolveProp('inputReadOnly', false),
+                locale: locale.value,
+                localeCode: localeCode.value,
+                motion: resolveProp('motion', true),
+                multiple: resolveProp('multiple', false),
+                onChangeWithDateFirst: resolveProp('onChangeWithDateFirst', true),
+                position: props.position ?? ('rtl' === config.value.direction ? 'bottomRight' : 'bottomLeft'),
+                presetPosition: props.presetPosition ?? 'bottom',
+                presets: props.presets ?? [],
+                rangeSeparator: props.rangeSeparator ?? ' ~ ',
+                showClear: resolveProp('showClear', true),
+                size: props.size ?? 'default',
+                spacing: props.spacing ?? (props.insetInput ? 1 : 4),
+                stopPropagation: resolveProp('stopPropagation', true),
+                syncSwitchMonth: props.syncSwitchMonth ?? false,
+                timeZone: hasRawProp('timeZone') ? props.timeZone : config.value.timeZone,
+                type: type.value,
+                validateStatus: props.validateStatus ?? 'default',
+                weekStartsOn: props.weekStartsOn ?? 0,
+                zIndex: props.zIndex ?? 1030
+            }));
+        const state = shallowReactive({
+            panelShow: Boolean(props.open ?? props.defaultOpen),
+            isRange: isRange.value,
+            inputValue: null,
+            value: [],
+            cachedSelectedValue: [],
+            prevTimeZone: null,
+            rangeInputFocus: void 0,
+            autofocus: Boolean(props.autoFocus || isRange.value && (props.open || props.defaultOpen)),
+            insetInputValue: null,
+            triggerDisabled: void 0
+        });
+        const cache = new Map();
+        const focusRecords = {
+            rangeStart: false,
+            rangeEnd: false
+        };
+        function foundationProps() {
+            const output = {
+                ...runtimeProps.value
+            };
+            if (controlledValue.value && void 0 !== incomingValue.value) output.value = incomingValue.value;
+            else delete output.value;
+            if (controlledOpen.value) output.open = props.open;
+            else delete output.open;
+            return output;
+        }
+        function dateFromNotification(first, second) {
+            const candidate = runtimeProps.value.onChangeWithDateFirst ? first : second;
+            return candidate instanceof Date || Array.isArray(candidate) && candidate.every((item)=>item instanceof Date) ? candidate : void 0;
+        }
+        const adapter = {
+            getContext: ()=>void 0,
+            getContexts: ()=>void 0,
+            getProp: (key)=>foundationProps()[key],
+            getProps: foundationProps,
+            getState: (key)=>state[key],
+            getStates: ()=>state,
+            setState: (nextState, callback)=>{
+                Object.assign(state, nextState);
+                callback?.();
+            },
+            getCache: (key)=>cache.get(key),
+            getCaches: ()=>cache,
+            setCache: (key, value)=>cache.set(key, value),
+            stopPropagation: (event)=>event?.stopPropagation?.(),
+            persistEvent: ()=>void 0,
+            togglePanel: (show, callback)=>{
+                state.panelShow = show;
+                if (!show) {
+                    focusRecords.rangeStart = false;
+                    focusRecords.rangeEnd = false;
+                }
+                callback?.();
+            },
+            registerClickOutSide: ()=>void 0,
+            unregisterClickOutSide: ()=>void 0,
+            notifyBlur: (event)=>emit('blur', event),
+            notifyFocus: (event, range)=>emit('focus', event, range),
+            notifyClear: (event)=>emit('clear', event),
+            notifyChange: (first, second)=>{
+                emit('change', first, second);
+                const value = dateFromNotification(first, second);
+                emit('update:modelValue', value);
+                emit('update:value', value);
+            },
+            notifyCancel: (date, text)=>emit('cancel', date, text),
+            notifyConfirm: (date, text)=>emit('confirm', date, text),
+            notifyOpenChange: (open)=>{
+                emit('openChange', open);
+                emit('update:open', open);
+            },
+            notifyPresetsClick: (item, event)=>emit('presetClick', item, event),
+            updateValue: (value)=>{
+                state.value = [
+                    ...value
+                ];
+            },
+            updatePrevTimezone: (value)=>{
+                state.prevTimeZone = value;
+            },
+            updateCachedSelectedValue: (value)=>{
+                state.cachedSelectedValue = [
+                    ...value
+                ];
+            },
+            updateInputValue: (value)=>{
+                state.inputValue = value;
+            },
+            needConfirm: ()=>[
+                    'dateTime',
+                    'dateTimeRange'
+                ].includes(type.value) && true === props.needConfirm,
+            typeIsYearOrMonth: ()=>[
+                    'month',
+                    'year',
+                    'monthRange'
+                ].includes(type.value),
+            setRangeInputFocus: (focus)=>{
+                state.rangeInputFocus = focus;
+                if ('rangeStart' === focus) {
+                    rangeStartComponent.value?.focus();
+                    setTimeout(()=>{
+                        focusRecords.rangeStart = true;
+                    }, 0);
+                } else if ('rangeEnd' === focus) {
+                    rangeEndComponent.value?.focus();
+                    setTimeout(()=>{
+                        focusRecords.rangeEnd = true;
+                    }, 0);
+                }
+            },
+            couldPanelClosed: ()=>focusRecords.rangeStart && focusRecords.rangeEnd,
+            isEventTarget: (event)=>Boolean(event && event.target === event.currentTarget),
+            updateInsetInputValue: (value)=>{
+                state.insetInputValue = value;
+            },
+            setInsetInputFocus: ()=>'rangeEnd' === state.rangeInputFocus ? rangeEndComponent.value?.focus() : rangeStartComponent.value?.focus(),
+            setTriggerDisabled: (disabled)=>{
+                state.triggerDisabled = disabled;
+            },
+            setInputFocus: ()=>inputComponent.value?.focus(),
+            setInputBlur: ()=>inputComponent.value?.blur(),
+            setRangeInputBlur: ()=>{
+                rangeStartComponent.value?.blur();
+                rangeEndComponent.value?.blur();
+            }
+        };
+        const foundation = markRaw(new DatePickerFoundation(adapter));
+        const initialValue = controlledValue.value ? incomingValue.value : props.defaultValue;
+        if (void 0 !== initialValue) foundation.initFromProps({
+            value: initialValue,
+            ...void 0 === runtimeProps.value.timeZone ? {} : {
+                timeZone: runtimeProps.value.timeZone
+            }
+        });
+        const displayText = computed(()=>state.inputValue ?? (runtimeProps.value.multiple ? foundation.formatMultipleDates(state.value) : foundation.formatDates(state.value)));
+        const rangeText = computed(()=>{
+            const parts = displayText.value.split(runtimeProps.value.rangeSeparator ?? ' ~ ');
+            return [
+                parts[0] ?? '',
+                parts[1] ?? ''
+            ];
+        });
+        const inputDisabled = computed(()=>Boolean(runtimeProps.value.disabled || runtimeProps.value.insetInput && state.triggerDisabled));
+        const outerClasses = computed(()=>[
+                'semi-datepicker',
+                props.class,
+                props.className,
+                attrs.class
+            ]);
+        const inputClasses = computed(()=>[
+                'semi-datepicker-input',
+                isRange.value ? 'semi-datepicker-range-input' : void 0,
+                isRange.value ? `semi-datepicker-range-input-${runtimeProps.value.size}` : void 0,
+                isRange.value && state.rangeInputFocus && !inputDisabled.value ? 'semi-datepicker-range-input-active' : void 0,
+                isRange.value && inputDisabled.value ? 'semi-datepicker-range-input-disabled' : void 0,
+                isRange.value ? `semi-datepicker-range-input-${runtimeProps.value.validateStatus}` : void 0,
+                runtimeProps.value.borderless ? 'semi-datepicker-borderless' : void 0
+            ]);
+        function rangeInputProps(index) {
+            const value = {
+                borderless: Boolean(runtimeProps.value.borderless),
+                size: 'large' === runtimeProps.value.size ? 'default' : 'small',
+                disabled: inputDisabled.value,
+                readonly: Boolean(runtimeProps.value.inputReadOnly || runtimeProps.value.insetInput),
+                placeholder: Array.isArray(placeholder.value) ? placeholder.value[index] ?? '' : String(placeholder.value ?? '')
+            };
+            if (void 0 !== runtimeProps.value.inputStyle) value.inputStyle = runtimeProps.value.inputStyle;
+            return value;
+        }
+        const singleInputProps = computed(()=>{
+            const value = {
+                borderless: Boolean(runtimeProps.value.borderless),
+                size: runtimeProps.value.size ?? 'default',
+                validateStatus: runtimeProps.value.validateStatus ?? 'default'
+            };
+            const optional = {
+                ariaDescribedby: props.ariaDescribedby,
+                ariaErrormessage: props.ariaErrormessage,
+                ariaInvalid: props.ariaInvalid,
+                ariaLabelledby: props.ariaLabelledby,
+                ariaRequired: props.ariaRequired,
+                inputStyle: runtimeProps.value.inputStyle,
+                id: props.id
+            };
+            for (const [key, item] of Object.entries(optional))if (void 0 !== item) value[key] = item;
+            return value;
+        });
+        const popoverBindProps = computed(()=>{
+            const value = {
+                autoAdjustOverflow: runtimeProps.value.autoAdjustOverflow ?? true,
+                motion: runtimeProps.value.motion ?? true,
+                position: runtimeProps.value.position ?? 'bottomLeft',
+                spacing: runtimeProps.value.spacing ?? 4,
+                stopPropagation: false !== runtimeProps.value.stopPropagation,
+                visible: state.panelShow,
+                zIndex: runtimeProps.value.zIndex ?? 1030,
+                trigger: 'custom'
+            };
+            if (runtimeProps.value.getPopupContainer) value.getPopupContainer = runtimeProps.value.getPopupContainer;
+            if (void 0 !== runtimeProps.value.dropdownMargin) value.margin = runtimeProps.value.dropdownMargin;
+            return value;
+        });
+        const rootAttrs = computed(()=>Object.fromEntries(Object.entries(attrs).filter(([key])=>![
+                    'class',
+                    'style'
+                ].includes(key))));
+        const topContent = useRenderComputed(()=>slots.top?.() ?? props.topSlot);
+        const bottomContent = useRenderComputed(()=>slots.bottom?.() ?? props.bottomSlot);
+        const leftContent = useRenderComputed(()=>slots.left?.() ?? props.leftSlot);
+        const rightContent = useRenderComputed(()=>slots.right?.() ?? props.rightSlot);
+        const renderDate = useRenderComputed(()=>slots.date || props.renderDate ? (dayNumber, fullDate)=>slots.date?.({
+                    dayNumber: dayNumber ?? 0,
+                    fullDate: fullDate ?? ''
+                }) ?? props.renderDate?.(dayNumber, fullDate) : void 0);
+        const renderFullDate = useRenderComputed(()=>slots.fullDate || props.renderFullDate ? (dayNumber, fullDate, status)=>slots.fullDate?.({
+                    dayNumber: dayNumber ?? 0,
+                    fullDate: fullDate ?? '',
+                    status: status ?? {}
+                }) ?? props.renderFullDate?.(dayNumber, fullDate, status) : void 0);
+        const triggerSlotProps = computed(()=>({
+                value: state.value,
+                inputValue: displayText.value,
+                placeholder: placeholder.value,
+                autoFocus: state.autofocus,
+                size: runtimeProps.value.size ?? 'default',
+                disabled: inputDisabled.value,
+                inputReadOnly: Boolean(runtimeProps.value.inputReadOnly || runtimeProps.value.insetInput),
+                componentProps: props,
+                open: state.panelShow,
+                openPanel: ()=>foundation.openPanel(),
+                close: ()=>foundation.closePanel(),
+                clear: (event)=>clearValue(event)
+            }));
+        const customTrigger = useRenderComputed(()=>slots.trigger?.(triggerSlotProps.value) ?? props.triggerRender?.(triggerSlotProps.value));
+        function clearValue(event) {
+            if (isRange.value) foundation.handleRangeInputClear(event);
+            else {
+                foundation.handleInputChange('', event);
+                foundation.handleInputClear(event);
+            }
+        }
+        function handleSingleChange(value, event) {
+            foundation.handleInputChange(value, event);
+        }
+        function handleRangeChange(index, value, event) {
+            const next = [
+                ...rangeText.value
+            ];
+            next[index] = value;
+            foundation.handleInputChange(next.join(runtimeProps.value.rangeSeparator ?? ' ~ '), event);
+        }
+        function handleRangeStartChange(value, event) {
+            handleRangeChange(0, value, event);
+        }
+        function handleRangeEndChange(value, event) {
+            handleRangeChange(1, value, event);
+        }
+        function handleSelect(dates) {
+            foundation.handleSelectedChange(dates, {
+                needCheckFocusRecord: false
+            });
+            if (isRange.value && 1 === dates.length) foundation.handleSetRangeFocus('rangeEnd');
+        }
+        function handleOutside(event) {
+            emit('clickOutside', event);
+            if (!adapter.needConfirm()) foundation.closePanel();
+        }
+        function handlePanelVisibleChange(visible) {
+            foundation.handlePanelVisibleChange(visible);
+        }
+        function handleTriggerClick(event) {
+            foundation.handleTriggerWrapperClick(event);
+        }
+        function handleCancel() {
+            foundation.handleCancel();
+        }
+        function handleConfirm() {
+            foundation.handleConfirm();
+        }
+        function handleRangeStartFocus(event) {
+            foundation.handleInputFocus(event, 'rangeStart');
+        }
+        function handleRangeEndFocus(event) {
+            foundation.handleInputFocus(event, 'rangeEnd');
+        }
+        function handleRangeEndKeydown(event) {
+            foundation.handleRangeEndTabPress(event);
+        }
+        function handleSingleFocus(event) {
+            foundation.handleInputFocus(event);
+        }
+        function handleSingleClear(event) {
+            foundation.handleInputClear(event);
+        }
+        function handleVisibleUpdate(visible) {
+            if (!visible && state.panelShow) foundation.closePanel();
+            else if (visible && !state.panelShow) foundation.openPanel();
+        }
+        function handlePreset(preset, event) {
+            foundation.handlePresetClick(preset, event);
+        }
+        function handlePanelChange(date, text) {
+            emit('panelChange', date, text);
+        }
+        function open() {
+            foundation.open();
+        }
+        function close() {
+            foundation.close();
+        }
+        function focus(focusType) {
+            foundation.focus(focusType);
+        }
+        function blur() {
+            foundation.blur();
+        }
+        __expose({
+            get input () {
+                return inputComponent.value?.input ?? rangeStartComponent.value?.input ?? null;
+            },
+            open,
+            close,
+            focus,
+            blur
+        });
+        onMounted(()=>foundation.init());
+        onBeforeUnmount(()=>foundation.destroy());
+        watch(()=>[
+                controlledOpen.value,
+                props.open
+            ], ([controlled, open])=>{
+            if (controlled) state.panelShow = Boolean(open);
+        });
+        watch(()=>[
+                controlledValue.value,
+                incomingValue.value,
+                runtimeProps.value.timeZone
+            ], ([controlled, value, timeZone], previous)=>{
+            if (controlled && !isEqual_default()(value, previous?.[1])) foundation.initFromProps({
+                ...void 0 === value ? {} : {
+                    value
+                },
+                ...void 0 === timeZone ? {} : {
+                    timeZone
+                }
+            });
+            else if (timeZone !== previous?.[2]) foundation.initFromProps({
+                value: state.value,
+                ...void 0 === timeZone ? {} : {
+                    timeZone
+                },
+                ...previous?.[2] === void 0 ? {} : {
+                    prevTimeZone: previous[2]
+                }
+            });
+        }, {
+            deep: true
+        });
+        return (_ctx, _cache)=>(openBlock(), createElementBlock("div", mergeProps(rootAttrs.value, {
+                class: outerClasses.value,
+                style: [
+                    unref(attrs).style,
+                    props.style
+                ]
+            }), [
+                createVNode(unref(Popover), mergeProps(popoverBindProps.value, {
+                    onClickOutside: handleOutside,
+                    "onUpdate:visible": handleVisibleUpdate,
+                    onVisibleChange: handlePanelVisibleChange
+                }), {
+                    content: withCtx(()=>[
+                            createVNode(DatePickerPanel, {
+                                "bottom-content": unref(bottomContent),
+                                "cached-value": unref(state).cachedSelectedValue,
+                                "left-content": unref(leftContent),
+                                locale: locale.value,
+                                "locale-code": localeCode.value,
+                                props: runtimeProps.value,
+                                "range-focus": unref(state).rangeInputFocus,
+                                "render-date": unref(renderDate),
+                                "render-full-date": unref(renderFullDate),
+                                "right-content": unref(rightContent),
+                                "top-content": unref(topContent),
+                                value: unref(state).value,
+                                onCancel: handleCancel,
+                                onConfirm: handleConfirm,
+                                onMaxSelect: _cache[0] || (_cache[0] = ($event)=>emit('maxSelect', $event)),
+                                onPanelChange: handlePanelChange,
+                                onPresetClick: handlePreset,
+                                onSelect: handleSelect
+                            }, null, 8, [
+                                "bottom-content",
+                                "cached-value",
+                                "left-content",
+                                "locale",
+                                "locale-code",
+                                "props",
+                                "range-focus",
+                                "render-date",
+                                "render-full-date",
+                                "right-content",
+                                "top-content",
+                                "value"
+                            ])
+                        ]),
+                    default: withCtx(()=>[
+                            createElementVNode("div", {
+                                role: "combobox",
+                                "aria-label": unref(state).value.length ? 'Change date' : 'Choose date',
+                                "aria-disabled": runtimeProps.value.disabled,
+                                class: normalizeClass(inputClasses.value),
+                                onClick: handleTriggerClick
+                            }, [
+                                unref(customTrigger) ? (openBlock(), createBlock(unref(DatePickerNodeRenderer), {
+                                    key: 0,
+                                    content: unref(customTrigger)
+                                }, null, 8, [
+                                    "content"
+                                ])) : isRange.value ? (openBlock(), createElementBlock(Fragment, {
+                                    key: 1
+                                }, [
+                                    _ctx.$slots.prefix || props.prefix || _ctx.$slots.insetLabel || props.insetLabel ? (openBlock(), createElementBlock("div", _hoisted_2, [
+                                        _ctx.$slots.prefix || props.prefix ? renderSlot(_ctx.$slots, "prefix", {}, ()=>[
+                                                createVNode(unref(DatePickerNodeRenderer), {
+                                                    content: props.prefix
+                                                }, null, 8, [
+                                                    "content"
+                                                ])
+                                            ], void 0, 0) : renderSlot(_ctx.$slots, "insetLabel", {}, ()=>[
+                                                createVNode(unref(DatePickerNodeRenderer), {
+                                                    content: props.insetLabel
+                                                }, null, 8, [
+                                                    "content"
+                                                ])
+                                            ], void 0, 1)
+                                    ])) : createCommentVNode("", true),
+                                    createElementVNode("div", {
+                                        class: normalizeClass([
+                                            'semi-datepicker-range-input-wrapper-start',
+                                            'semi-datepicker-range-input-wrapper',
+                                            'rangeStart' === unref(state).rangeInputFocus && !inputDisabled.value && 'semi-datepicker-range-input-wrapper-active',
+                                            runtimeProps.value.borderless && 'semi-datepicker-borderless'
+                                        ]),
+                                        onClick: withModifiers(handleRangeStartFocus, [
+                                            "stop"
+                                        ])
+                                    }, [
+                                        createVNode(unref(Input), mergeProps(rangeInputProps(0), {
+                                            ref_key: "rangeStartComponent",
+                                            ref: rangeStartComponent,
+                                            value: rangeText.value[0],
+                                            "auto-focus": unref(state).autofocus,
+                                            onChange: handleRangeStartChange,
+                                            onEnterPress: _cache[1] || (_cache[1] = ($event)=>unref(foundation).handleInputComplete(displayText.value)),
+                                            onFocus: handleRangeStartFocus
+                                        }), null, 16, [
+                                            "value",
+                                            "auto-focus"
+                                        ])
+                                    ], 2),
+                                    createElementVNode("span", {
+                                        class: normalizeClass([
+                                            'semi-datepicker-range-input-separator',
+                                            (rangeText.value[0] || rangeText.value[1]) && !inputDisabled.value && 'semi-datepicker-range-input-separator-active'
+                                        ]),
+                                        onClick: withModifiers(handleRangeStartFocus, [
+                                            "stop"
+                                        ])
+                                    }, [
+                                        renderSlot(_ctx.$slots, "rangeSeparator", {}, ()=>[
+                                                props.rangeSeparatorNode ? (openBlock(), createBlock(unref(DatePickerNodeRenderer), {
+                                                    key: 0,
+                                                    content: props.rangeSeparatorNode
+                                                }, null, 8, [
+                                                    "content"
+                                                ])) : (openBlock(), createElementBlock(Fragment, {
+                                                    key: 1
+                                                }, [
+                                                    createTextVNode(toDisplayString(runtimeProps.value.rangeSeparator), 1)
+                                                ], 64))
+                                            ])
+                                    ], 2),
+                                    createElementVNode("div", {
+                                        class: normalizeClass([
+                                            'semi-datepicker-range-input-wrapper-end',
+                                            'semi-datepicker-range-input-wrapper',
+                                            'rangeEnd' === unref(state).rangeInputFocus && !inputDisabled.value && 'semi-datepicker-range-input-wrapper-active',
+                                            runtimeProps.value.borderless && 'semi-datepicker-borderless'
+                                        ]),
+                                        onClick: withModifiers(handleRangeEndFocus, [
+                                            "stop"
+                                        ])
+                                    }, [
+                                        createVNode(unref(Input), mergeProps(rangeInputProps(1), {
+                                            ref_key: "rangeEndComponent",
+                                            ref: rangeEndComponent,
+                                            value: rangeText.value[1],
+                                            onChange: handleRangeEndChange,
+                                            onEnterPress: _cache[2] || (_cache[2] = ($event)=>unref(foundation).handleInputComplete(displayText.value)),
+                                            onFocus: handleRangeEndFocus,
+                                            onKeydown: handleRangeEndKeydown
+                                        }), null, 16, [
+                                            "value"
+                                        ])
+                                    ], 2),
+                                    runtimeProps.value.showClear && (rangeText.value[0] || rangeText.value[1]) && !inputDisabled.value ? (openBlock(), createElementBlock("div", {
+                                        key: 1,
+                                        role: "button",
+                                        tabindex: "0",
+                                        "aria-label": "Clear range input value",
+                                        class: "semi-datepicker-range-input-clearbtn",
+                                        onMousedown: withModifiers(clearValue, [
+                                            "stop"
+                                        ])
+                                    }, [
+                                        renderSlot(_ctx.$slots, "clearIcon", {}, ()=>[
+                                                props.clearIcon ? (openBlock(), createBlock(unref(DatePickerNodeRenderer), {
+                                                    key: 0,
+                                                    content: props.clearIcon
+                                                }, null, 8, [
+                                                    "content"
+                                                ])) : (openBlock(), createBlock(unref(IconClear), {
+                                                    key: 1
+                                                }))
+                                            ])
+                                    ], 32)) : createCommentVNode("", true),
+                                    createElementVNode("div", _hoisted_3, [
+                                        type.value.includes('Time') ? (openBlock(), createBlock(unref(IconCalendarClock), {
+                                            key: 0,
+                                            "aria-hidden": "true"
+                                        })) : (openBlock(), createBlock(unref(IconCalendar), {
+                                            key: 1,
+                                            "aria-hidden": "true"
+                                        }))
+                                    ])
+                                ], 64)) : (openBlock(), createBlock(unref(Input), mergeProps({
+                                    key: 2
+                                }, singleInputProps.value, {
+                                    ref_key: "inputComponent",
+                                    ref: inputComponent,
+                                    "auto-focus": unref(state).autofocus,
+                                    "class-name": [
+                                        (runtimeProps.value.inputReadOnly || Boolean(runtimeProps.value.insetInput)) && 'semi-datepicker-input-readonly',
+                                        'monthRange' === type.value && 'semi-datepicker-monthRange-input'
+                                    ],
+                                    disabled: inputDisabled.value,
+                                    "hide-suffix": Boolean(runtimeProps.value.showClear),
+                                    placeholder: Array.isArray(placeholder.value) ? placeholder.value.join(runtimeProps.value.rangeSeparator) : placeholder.value,
+                                    readonly: runtimeProps.value.inputReadOnly || Boolean(runtimeProps.value.insetInput),
+                                    "show-clear": Boolean(runtimeProps.value.showClear),
+                                    "show-clear-ignore-disabled": Boolean(runtimeProps.value.insetInput),
+                                    value: displayText.value,
+                                    onBlur: _cache[3] || (_cache[3] = ($event)=>unref(foundation).handleInputBlur(displayText.value, $event)),
+                                    onChange: handleSingleChange,
+                                    onClear: handleSingleClear,
+                                    onEnterPress: _cache[4] || (_cache[4] = ($event)=>unref(foundation).handleInputComplete(displayText.value)),
+                                    onFocus: handleSingleFocus
+                                }), createSlots({
+                                    clearIcon: withCtx(()=>[
+                                            renderSlot(_ctx.$slots, "clearIcon", {}, ()=>[
+                                                    props.clearIcon ? (openBlock(), createBlock(unref(DatePickerNodeRenderer), {
+                                                        key: 0,
+                                                        content: props.clearIcon
+                                                    }, null, 8, [
+                                                        "content"
+                                                    ])) : (openBlock(), createBlock(unref(IconClear), {
+                                                        key: 1
+                                                    }))
+                                                ])
+                                        ]),
+                                    suffix: withCtx(()=>[
+                                            type.value.includes('Time') ? (openBlock(), createBlock(unref(IconCalendarClock), {
+                                                key: 0,
+                                                "aria-hidden": "true"
+                                            })) : (openBlock(), createBlock(unref(IconCalendar), {
+                                                key: 1,
+                                                "aria-hidden": "true"
+                                            }))
+                                        ]),
+                                    _: 2
+                                }, [
+                                    _ctx.$slots.prefix || props.prefix ? {
+                                        name: "prefix",
+                                        fn: withCtx(()=>[
+                                                renderSlot(_ctx.$slots, "prefix", {}, ()=>[
+                                                        createVNode(unref(DatePickerNodeRenderer), {
+                                                            content: props.prefix
+                                                        }, null, 8, [
+                                                            "content"
+                                                        ])
+                                                    ])
+                                            ]),
+                                        key: "0"
+                                    } : void 0,
+                                    _ctx.$slots.insetLabel || props.insetLabel ? {
+                                        name: "insetLabel",
+                                        fn: withCtx(()=>[
+                                                renderSlot(_ctx.$slots, "insetLabel", {}, ()=>[
+                                                        createVNode(unref(DatePickerNodeRenderer), {
+                                                            content: props.insetLabel
+                                                        }, null, 8, [
+                                                            "content"
+                                                        ])
+                                                    ])
+                                            ]),
+                                        key: "1"
+                                    } : void 0
+                                ]), 1040, [
+                                    "auto-focus",
+                                    "class-name",
+                                    "disabled",
+                                    "hide-suffix",
+                                    "placeholder",
+                                    "readonly",
+                                    "show-clear",
+                                    "show-clear-ignore-disabled",
+                                    "value"
+                                ]))
+                            ], 10, _hoisted_1)
+                        ]),
+                    _: 3
+                }, 16)
+            ], 16));
+    }
+});
+export { DatePickervue_type_script_setup_true_lang_ts };