@varlet/ui 3.18.1 → 3.19.0

package/es/date-input/DateInput.mjs

@@ -0,0 +1,865 @@
+import { call, isArray, isDate, isEqual, isNumber, isTruthy, preventDefault } from "@varlet/shared";
+import { computed, defineComponent, nextTick, ref, watch } from "vue";
+import VarDatePicker from "../date-picker/index.mjs";
+import VarFormDetails from "../form-details/index.mjs";
+import { useForm } from "../form/provide.mjs";
+import VarIcon from "../icon/index.mjs";
+import VarInput from "../input/index.mjs";
+import VarMenu from "../menu/index.mjs";
+import { createNamespace, useValidation } from "../utils/components.mjs";
+import { createDayjs } from "../utils/shared.mjs";
+import {
+  props
+} from "./props.mjs";
+import TimeSelect from "./TimeSelect.mjs";
+const DateInputDefaultFormats = {
+  Year: "YYYY",
+  Month: "YYYY-MM",
+  Date: "YYYY-MM-DD",
+  Datetime: "YYYY-MM-DD HH:mm:ss",
+  DatetimeMinute: "YYYY-MM-DD HH:mm"
+};
+const dayjs = createDayjs();
+const { name, n, classes } = createNamespace("date-input");
+import { renderSlot as _renderSlot, resolveComponent as _resolveComponent, normalizeClass as _normalizeClass, createVNode as _createVNode, withModifiers as _withModifiers, createElementVNode as _createElementVNode, withCtx as _withCtx, createSlots as _createSlots, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
+function __render__(_ctx, _cache) {
+  const _component_var_icon = _resolveComponent("var-icon");
+  const _component_var_input = _resolveComponent("var-input");
+  const _component_time_select = _resolveComponent("time-select");
+  const _component_var_date_picker = _resolveComponent("var-date-picker");
+  const _component_var_menu = _resolveComponent("var-menu");
+  const _component_var_form_details = _resolveComponent("var-form-details");
+  return _openBlock(), _createElementBlock(
+    "div",
+    {
+      class: _normalizeClass(_ctx.classes(_ctx.n(), _ctx.n("$--box")))
+    },
+    [
+      _createVNode(_component_var_menu, {
+        show: _ctx.showMenu,
+        "onUpdate:show": _cache[5] || (_cache[5] = ($event) => _ctx.showMenu = $event),
+        "var-date-input-cover": "",
+        trigger: "manual",
+        placement: "bottom-start",
+        disabled: _ctx.disabled || _ctx.readonly || _ctx.formDisabled || _ctx.formReadonly,
+        "popover-class": _ctx.menuPopoverClass
+      }, {
+        menu: _withCtx(() => [
+          _createElementVNode(
+            "div",
+            {
+              onPointerdown: _cache[4] || (_cache[4] = _withModifiers(() => {
+              }, ["prevent"]))
+            },
+            [
+              _createVNode(_component_var_date_picker, {
+                ref: "picker",
+                class: _normalizeClass(_ctx.n("picker")),
+                "model-value": _ctx.pickerValue,
+                type: _ctx.pickerType,
+                multiple: _ctx.isMultiple,
+                range: _ctx.range,
+                "allowed-dates": _ctx.allowedDates,
+                min: _ctx.pickerMin,
+                max: _ctx.pickerMax,
+                "first-day-of-week": _ctx.firstDayOfWeek,
+                "show-title": false,
+                elevation: false,
+                onChange: _ctx.handlePickerChange
+              }, _createSlots({
+                _: 2
+                /* DYNAMIC */
+              }, [
+                _ctx.isDatetime ? {
+                  name: "actions",
+                  fn: _withCtx(() => [
+                    _createElementVNode(
+                      "div",
+                      {
+                        class: _normalizeClass(_ctx.n("datetime"))
+                      },
+                      [
+                        _ctx.range ? (_openBlock(), _createElementBlock(
+                          "div",
+                          {
+                            key: 0,
+                            class: _normalizeClass(_ctx.classes(_ctx.n("datetime-row"), _ctx.n("datetime-row--range")))
+                          },
+                          [
+                            _createVNode(_component_time_select, {
+                              hour: _ctx.rangeTimes[0].hour,
+                              minute: _ctx.rangeTimes[0].minute,
+                              second: _ctx.rangeTimes[0].second,
+                              "use-seconds": _ctx.useSeconds,
+                              readonly: _ctx.readonly || _ctx.formReadonly,
+                              disabled: _ctx.disabled || _ctx.formDisabled || _ctx.isRangeTimeSelectDisabled,
+                              "is-hour-allowed": _ctx.startAllowFns.isHourAllowed,
+                              "is-minute-allowed": _ctx.startAllowFns.isMinuteAllowed,
+                              "is-second-allowed": _ctx.startAllowFns.isSecondAllowed,
+                              onChange: _cache[2] || (_cache[2] = (time, unit) => _ctx.handleRangeTimeChange(0, time, unit))
+                            }, null, 8, ["hour", "minute", "second", "use-seconds", "readonly", "disabled", "is-hour-allowed", "is-minute-allowed", "is-second-allowed"]),
+                            _createVNode(_component_var_icon, {
+                              class: _normalizeClass(_ctx.n("datetime-arrow")),
+                              name: "arrow-right"
+                            }, null, 8, ["class"]),
+                            _createVNode(_component_time_select, {
+                              hour: _ctx.rangeTimes[1].hour,
+                              minute: _ctx.rangeTimes[1].minute,
+                              second: _ctx.rangeTimes[1].second,
+                              "use-seconds": _ctx.useSeconds,
+                              readonly: _ctx.readonly || _ctx.formReadonly,
+                              disabled: _ctx.disabled || _ctx.formDisabled || _ctx.isRangeTimeSelectDisabled,
+                              "is-hour-allowed": _ctx.endAllowFns.isHourAllowed,
+                              "is-minute-allowed": _ctx.endAllowFns.isMinuteAllowed,
+                              "is-second-allowed": _ctx.endAllowFns.isSecondAllowed,
+                              onChange: _cache[3] || (_cache[3] = (time, unit) => _ctx.handleRangeTimeChange(1, time, unit))
+                            }, null, 8, ["hour", "minute", "second", "use-seconds", "readonly", "disabled", "is-hour-allowed", "is-minute-allowed", "is-second-allowed"])
+                          ],
+                          2
+                          /* CLASS */
+                        )) : (_openBlock(), _createElementBlock(
+                          "div",
+                          {
+                            key: 1,
+                            class: _normalizeClass(_ctx.n("datetime-row"))
+                          },
+                          [
+                            _createVNode(_component_time_select, {
+                              hour: _ctx.singleTime.hour,
+                              minute: _ctx.singleTime.minute,
+                              second: _ctx.singleTime.second,
+                              "use-seconds": _ctx.useSeconds,
+                              readonly: _ctx.readonly || _ctx.formReadonly,
+                              disabled: _ctx.disabled || _ctx.formDisabled,
+                              "is-hour-allowed": _ctx.singleAllowFns.isHourAllowed,
+                              "is-minute-allowed": _ctx.singleAllowFns.isMinuteAllowed,
+                              "is-second-allowed": _ctx.singleAllowFns.isSecondAllowed,
+                              onChange: _ctx.handleTimeChange
+                            }, null, 8, ["hour", "minute", "second", "use-seconds", "readonly", "disabled", "is-hour-allowed", "is-minute-allowed", "is-second-allowed", "onChange"])
+                          ],
+                          2
+                          /* CLASS */
+                        ))
+                      ],
+                      2
+                      /* CLASS */
+                    )
+                  ]),
+                  key: "0"
+                } : void 0
+              ]), 1032, ["class", "model-value", "type", "multiple", "range", "allowed-dates", "min", "max", "first-day-of-week", "onChange"])
+            ],
+            32
+            /* NEED_HYDRATION */
+          )
+        ]),
+        default: _withCtx(() => [
+          _createVNode(_component_var_input, {
+            ref: "inputEl",
+            "model-value": _ctx.displayValue,
+            size: _ctx.size,
+            variant: _ctx.variant,
+            placeholder: _ctx.placeholder,
+            line: _ctx.line,
+            hint: _ctx.hint,
+            "text-color": _ctx.textColor,
+            "focus-color": _ctx.focusColor,
+            "blur-color": _ctx.blurColor,
+            tabindex: _ctx.tabindex,
+            disabled: _ctx.disabled || _ctx.formDisabled,
+            readonly: _ctx.readonly || _ctx.formReadonly,
+            clearable: _ctx.clearable,
+            "is-force-focusing-effect": _ctx.isFocusing,
+            "is-force-error-effect": !!_ctx.errorMessage,
+            "is-show-form-details": false,
+            onFocus: _ctx.handleFocus,
+            onBlur: _ctx.handleBlur,
+            onClick: _ctx.handleClick,
+            onKeydown: _ctx.handleKeydown,
+            onClear: _ctx.handleClear,
+            onChange: _ctx.handleChange,
+            "onUpdate:modelValue": _ctx.handleInput
+          }, _createSlots({
+            "clear-icon": _withCtx(({ clear }) => [
+              _createElementVNode(
+                "span",
+                {
+                  class: _normalizeClass(_ctx.n("clear-icon-container")),
+                  onMousedown: _cache[0] || (_cache[0] = _withModifiers(() => {
+                  }, ["stop"])),
+                  onClick: _cache[1] || (_cache[1] = _withModifiers(() => {
+                  }, ["stop"]))
+                },
+                [
+                  _renderSlot(_ctx.$slots, "clear-icon", { clear }, () => [
+                    _createVNode(_component_var_icon, {
+                      class: _normalizeClass(_ctx.n("clear-icon")),
+                      name: "close-circle",
+                      onClick: clear
+                    }, null, 8, ["class", "onClick"])
+                  ])
+                ],
+                34
+                /* CLASS, NEED_HYDRATION */
+              )
+            ]),
+            "append-icon": _withCtx(() => [
+              _renderSlot(_ctx.$slots, "append-icon", {}, () => [
+                _createElementVNode(
+                  "span",
+                  {
+                    class: _normalizeClass(_ctx.n("calendar-icon-container"))
+                  },
+                  [
+                    _createVNode(_component_var_icon, {
+                      class: _normalizeClass(_ctx.n("calendar-icon")),
+                      name: "calendar-month-outline"
+                    }, null, 8, ["class"])
+                  ],
+                  2
+                  /* CLASS */
+                )
+              ])
+            ]),
+            _: 2
+            /* DYNAMIC */
+          }, [
+            _ctx.$slots["prepend-icon"] ? {
+              name: "prepend-icon",
+              fn: _withCtx(() => [
+                _renderSlot(_ctx.$slots, "prepend-icon")
+              ]),
+              key: "0"
+            } : void 0,
+            _ctx.$slots["extra-message"] ? {
+              name: "extra-message",
+              fn: _withCtx(() => [
+                _renderSlot(_ctx.$slots, "extra-message")
+              ]),
+              key: "1"
+            } : void 0
+          ]), 1032, ["model-value", "size", "variant", "placeholder", "line", "hint", "text-color", "focus-color", "blur-color", "tabindex", "disabled", "readonly", "clearable", "is-force-focusing-effect", "is-force-error-effect", "onFocus", "onBlur", "onClick", "onKeydown", "onClear", "onChange", "onUpdate:modelValue"])
+        ]),
+        _: 3
+        /* FORWARDED */
+      }, 8, ["show", "disabled", "popover-class"]),
+      _createVNode(_component_var_form_details, { "error-message": _ctx.errorMessage }, _createSlots({
+        _: 2
+        /* DYNAMIC */
+      }, [
+        _ctx.$slots["extra-message"] ? {
+          name: "extra-message",
+          fn: _withCtx(() => [
+            _renderSlot(_ctx.$slots, "extra-message")
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1032, ["error-message"])
+    ],
+    2
+    /* CLASS */
+  );
+}
+const __sfc__ = defineComponent({
+  name,
+  components: {
+    VarIcon,
+    VarInput,
+    VarMenu,
+    VarFormDetails,
+    VarDatePicker,
+    TimeSelect
+  },
+  props,
+  setup(props2) {
+    const inputEl = ref(null);
+    const picker = ref(null);
+    const displayValue = ref("");
+    const pickerValue = ref();
+    const showMenu = ref(false);
+    const isFocusing = ref(false);
+    const { bindForm, form } = useForm();
+    const { errorMessage, validateWithTrigger: vt, validate: v, resetValidation } = useValidation();
+    const formDisabled = computed(() => {
+      var _a;
+      return (_a = form == null ? void 0 : form.disabled.value) != null ? _a : false;
+    });
+    const formReadonly = computed(() => {
+      var _a;
+      return (_a = form == null ? void 0 : form.readonly.value) != null ? _a : false;
+    });
+    const isDisabled = computed(() => props2.disabled || formDisabled.value);
+    const isReadonly = computed(() => props2.readonly || formReadonly.value);
+    const isDatetime = computed(() => props2.type === "datetime");
+    const isMultiple = computed(() => props2.multiple && !isDatetime.value);
+    const isMultipleOrRange = computed(() => isMultiple.value || props2.range);
+    const pickerType = computed(() => isDatetime.value ? "date" : props2.type);
+    const pickerMin = computed(() => getPickerBound(props2.min));
+    const pickerMax = computed(() => getPickerBound(props2.max));
+    const rangeSelecting = computed(() => {
+      var _a;
+      return Boolean((_a = picker.value) == null ? void 0 : _a.rangeSelecting);
+    });
+    const isRangeTimeSelectDisabled = computed(
+      () => isDatetime.value && props2.range && (rangeSelecting.value || getDayjsObjectsByModelValue().length < 2)
+    );
+    const minDayjsObject = computed(() => props2.min ? dayjs(props2.min) : void 0);
+    const maxDayjsObject = computed(() => props2.max ? dayjs(props2.max) : void 0);
+    const singleTime = computed(() => getTimeParts(getDayjsObjectsByModelValue()[0]));
+    const rangeTimes = computed(() => {
+      const dayjsObjects = getDayjsObjectsByModelValue();
+      return [getTimeParts(dayjsObjects[0]), getTimeParts(dayjsObjects[1])];
+    });
+    const menuPopoverClass = computed(() => {
+      const marginClass = props2.variant === "standard" ? n("--standard-menu-margin") : props2.variant === "filled" ? n("--filled-menu-margin") : "";
+      return [n("--menu"), marginClass].filter(isTruthy).join(" ");
+    });
+    const displayValues = computed(() => {
+      const separator = props2.range ? props2.rangeSeparator : props2.separator;
+      return displayValue.value.split(separator).map((item) => item.trim()).filter(isTruthy);
+    });
+    const dateInputProvider = {
+      reset,
+      validate,
+      resetValidation
+    };
+    watch(
+      () => [
+        props2.modelValue,
+        props2.format,
+        props2.valueFormat,
+        props2.type,
+        props2.useSeconds,
+        props2.multiple,
+        props2.range,
+        props2.separator,
+        props2.rangeSeparator
+      ],
+      () => updateStatesByModelValue(),
+      { immediate: true }
+    );
+    call(bindForm, dateInputProvider);
+    function getDefaultFormat(type = props2.type) {
+      if (type === "year") {
+        return DateInputDefaultFormats.Year;
+      }
+      if (type === "month") {
+        return DateInputDefaultFormats.Month;
+      }
+      if (type === "datetime") {
+        return props2.useSeconds ? DateInputDefaultFormats.Datetime : DateInputDefaultFormats.DatetimeMinute;
+      }
+      return DateInputDefaultFormats.Date;
+    }
+    function getPickerFormat() {
+      return isDatetime.value ? DateInputDefaultFormats.Date : getDefaultFormat();
+    }
+    function getDisplayFormat() {
+      return props2.format || getDefaultFormat();
+    }
+    function getPickerBound(value) {
+      if (!value || !isDatetime.value) {
+        return value;
+      }
+      return dayjs(value).format(DateInputDefaultFormats.Date);
+    }
+    function getTimeParts(dayjsObject) {
+      var _a, _b, _c;
+      return {
+        hour: (_a = dayjsObject == null ? void 0 : dayjsObject.hour()) != null ? _a : 0,
+        minute: (_b = dayjsObject == null ? void 0 : dayjsObject.minute()) != null ? _b : 0,
+        second: (_c = dayjsObject == null ? void 0 : dayjsObject.second()) != null ? _c : 0
+      };
+    }
+    function clampDatetime(dayjsObject) {
+      const min = minDayjsObject.value;
+      const max = maxDayjsObject.value;
+      if (min && dayjsObject.isBefore(min)) {
+        return min;
+      }
+      if (max && dayjsObject.isAfter(max)) {
+        return max;
+      }
+      return dayjsObject;
+    }
+    function createTimeSelectValidators(getDayjsObjectByModelValue, getTimeParts2, position) {
+      function getAllowedTimeValidators() {
+        var _a, _b;
+        const date = ((_a = getDayjsObjectByModelValue()) != null ? _a : dayjs()).format(DateInputDefaultFormats.Date);
+        return (_b = props2.allowedTimes) == null ? void 0 : _b.call(props2, date, position);
+      }
+      function isAllowed(unit, value) {
+        var _a;
+        const time = getTimeParts2();
+        const timeOptionDayjsObject = ((_a = getDayjsObjectByModelValue()) != null ? _a : dayjs()).hour(unit === "hour" ? value : time.hour).minute(unit === "minute" ? value : time.minute).second(unit === "second" ? value : time.second);
+        const min = minDayjsObject.value;
+        const max = maxDayjsObject.value;
+        if (min && timeOptionDayjsObject.endOf(unit).isBefore(min)) {
+          return false;
+        }
+        if (max && timeOptionDayjsObject.startOf(unit).isAfter(max)) {
+          return false;
+        }
+        const validators = getAllowedTimeValidators();
+        if (unit === "hour") {
+          return (validators == null ? void 0 : validators.hours) ? validators.hours(value) : true;
+        }
+        if (unit === "minute") {
+          return (validators == null ? void 0 : validators.minutes) ? validators.minutes(value, time.hour) : true;
+        }
+        return (validators == null ? void 0 : validators.seconds) ? validators.seconds(value, time.minute, time.hour) : true;
+      }
+      return {
+        isHourAllowed: (hour) => isAllowed("hour", hour),
+        isMinuteAllowed: (minute) => isAllowed("minute", minute),
+        isSecondAllowed: (second) => isAllowed("second", second)
+      };
+    }
+    const singleAllowFns = createTimeSelectValidators(
+      () => getDayjsObjectsByModelValue()[0],
+      () => singleTime.value
+    );
+    const startAllowFns = createTimeSelectValidators(
+      () => getDayjsObjectsByModelValue()[0],
+      () => rangeTimes.value[0],
+      "start"
+    );
+    const endAllowFns = createTimeSelectValidators(
+      () => getDayjsObjectsByModelValue()[1],
+      () => rangeTimes.value[1],
+      "end"
+    );
+    function applyTime(base, time) {
+      return clampDatetime(base.hour(time.hour).minute(time.minute).second(time.second).millisecond(0));
+    }
+    function getOrderedValues(preferred, count, fixed) {
+      if (fixed) {
+        return [preferred];
+      }
+      return [preferred, ...Array.from({ length: count }, (_, value) => value).filter((value) => value !== preferred)];
+    }
+    function isTimeCandidateAllowed(candidateDayjsObject, validators) {
+      const min = minDayjsObject.value;
+      const max = maxDayjsObject.value;
+      const hour = candidateDayjsObject.hour();
+      const minute = candidateDayjsObject.minute();
+      const second = candidateDayjsObject.second();
+      return (!min || !candidateDayjsObject.isBefore(min)) && (!max || !candidateDayjsObject.isAfter(max)) && (!validators.hours || validators.hours(hour)) && (!validators.minutes || validators.minutes(minute, hour)) && (!props2.useSeconds || !validators.seconds || validators.seconds(second, minute, hour)) && (!props2.allowedDates || props2.allowedDates(candidateDayjsObject.format(getPickerFormat())));
+    }
+    function resolveSelectableDateTime(base, time, position, changedUnit) {
+      var _a, _b;
+      const date = base.format(DateInputDefaultFormats.Date);
+      const validators = (_b = (_a = props2.allowedTimes) == null ? void 0 : _a.call(props2, date, position)) != null ? _b : {};
+      const hours = getOrderedValues(
+        time.hour,
+        24,
+        changedUnit === "hour" || changedUnit === "minute" || changedUnit === "second"
+      );
+      for (const hour of hours) {
+        if (validators.hours && !validators.hours(hour)) {
+          continue;
+        }
+        const minutes = getOrderedValues(time.minute, 60, changedUnit === "minute" || changedUnit === "second");
+        for (const minute of minutes) {
+          if (validators.minutes && !validators.minutes(minute, hour)) {
+            continue;
+          }
+          const seconds = props2.useSeconds ? getOrderedValues(time.second, 60, changedUnit === "second") : [0];
+          for (const second of seconds) {
+            const candidateDayjsObject = base.hour(hour).minute(minute).second(second).millisecond(0);
+            if (isTimeCandidateAllowed(candidateDayjsObject, validators)) {
+              return candidateDayjsObject;
+            }
+          }
+        }
+      }
+    }
+    function normalizeDateTimes(dayjsObjects) {
+      return props2.range ? [...dayjsObjects].sort((a, b) => a.valueOf() - b.valueOf()) : dayjsObjects;
+    }
+    function commitDateTimes(dayjsObjects) {
+      const nextDayjsObjects = normalizeDateTimes(dayjsObjects);
+      if (props2.range) {
+        if (!isDayjsObjectSelectable(nextDayjsObjects[0], "start") || !isDayjsObjectSelectable(nextDayjsObjects[1], "end")) {
+          return false;
+        }
+        pickerValue.value = nextDayjsObjects.map((dayjsObject2) => dayjsObject2.format(getPickerFormat()));
+        displayValue.value = nextDayjsObjects.map((dayjsObject2) => dayjsObject2.format(getDisplayFormat())).join(props2.rangeSeparator);
+        updateModelValue(nextDayjsObjects.map(dayjsObjectToModelValue));
+        return true;
+      }
+      const [dayjsObject] = nextDayjsObjects;
+      if (!isDayjsObjectSelectable(dayjsObject)) {
+        return false;
+      }
+      pickerValue.value = dayjsObject.format(getPickerFormat());
+      displayValue.value = dayjsObject.format(getDisplayFormat());
+      updateModelValue(dayjsObjectToModelValue(dayjsObject));
+      return true;
+    }
+    function handleTimeChange(time, changedUnit) {
+      if (isDisabled.value || isReadonly.value) {
+        return;
+      }
+      const [dayjsObject] = getDayjsObjectsByModelValue();
+      const base = dayjsObject != null ? dayjsObject : dayjs();
+      const resolved = changedUnit ? resolveSelectableDateTime(base, time, void 0, changedUnit) : applyTime(base, time);
+      if (resolved) {
+        commitDateTimes([resolved]);
+      }
+    }
+    function handleRangeTimeChange(index, time, changedUnit) {
+      if (isDisabled.value || isReadonly.value) {
+        return;
+      }
+      const dayjsObjects = getDayjsObjectsByModelValue();
+      if (dayjsObjects.length < 2) {
+        return;
+      }
+      const next = [...dayjsObjects];
+      const position = index === 0 ? "start" : "end";
+      const resolved = changedUnit ? resolveSelectableDateTime(dayjsObjects[index], time, position, changedUnit) : applyTime(dayjsObjects[index], time);
+      if (resolved) {
+        next[index] = resolved;
+        commitDateTimes(next);
+      }
+    }
+    function stringToDayjsObject(value, format) {
+      const dayjsObject = dayjs(value, format, true);
+      return dayjsObject.isValid() ? dayjsObject : void 0;
+    }
+    function isAllowedTime(dayjsObject, position) {
+      var _a;
+      if (!isDatetime.value || !props2.allowedTimes) {
+        return true;
+      }
+      const validators = (_a = props2.allowedTimes(dayjsObject.format(DateInputDefaultFormats.Date), position)) != null ? _a : {};
+      const hour = dayjsObject.hour();
+      const minute = dayjsObject.minute();
+      const second = dayjsObject.second();
+      return (!validators.hours || validators.hours(hour)) && (!validators.minutes || validators.minutes(minute, hour)) && (!props2.useSeconds || !validators.seconds || validators.seconds(second, minute, hour));
+    }
+    function isDayjsObjectSelectable(dayjsObject, position) {
+      const min = minDayjsObject.value;
+      const max = maxDayjsObject.value;
+      const unit = props2.type === "year" ? "year" : props2.type === "month" ? "month" : props2.type === "date" ? "day" : void 0;
+      if (min && (unit ? dayjsObject.isBefore(min, unit) : dayjsObject.isBefore(min))) {
+        return false;
+      }
+      if (max && (unit ? dayjsObject.isAfter(max, unit) : dayjsObject.isAfter(max))) {
+        return false;
+      }
+      if (props2.allowedDates && !props2.allowedDates(dayjsObject.format(getPickerFormat()))) {
+        return false;
+      }
+      if (!isAllowedTime(dayjsObject, position)) {
+        return false;
+      }
+      return true;
+    }
+    function modelValueToDayjsObject(value) {
+      var _a;
+      if (value == null || value === "") {
+        return;
+      }
+      if (isDate(value) || isNumber(value)) {
+        const dayjsObject = dayjs(value);
+        return dayjsObject.isValid() ? dayjsObject : void 0;
+      }
+      return stringToDayjsObject(value, (_a = props2.valueFormat) != null ? _a : getDisplayFormat());
+    }
+    function dayjsObjectToModelValue(dayjsObject) {
+      if (props2.valueFormat === "timestamp") {
+        return dayjsObject.valueOf();
+      }
+      if (props2.valueFormat === "date") {
+        return dayjsObject.toDate();
+      }
+      if (!props2.valueFormat) {
+        return dayjsObject.format(getDisplayFormat());
+      }
+      return dayjsObject.format(props2.valueFormat);
+    }
+    function getDayjsObjectsByModelValue() {
+      if (isMultipleOrRange.value) {
+        return (isArray(props2.modelValue) ? props2.modelValue : []).map(modelValueToDayjsObject).filter(isTruthy);
+      }
+      const dayjsObject = isArray(props2.modelValue) ? void 0 : modelValueToDayjsObject(props2.modelValue);
+      return dayjsObject ? [dayjsObject] : [];
+    }
+    function updateDisplayValueByDayjsObjects(dayjsObjects) {
+      displayValue.value = dayjsObjects.map((dayjsObject) => dayjsObject.format(getDisplayFormat())).join(props2.range ? props2.rangeSeparator : props2.separator);
+    }
+    function updateStatesByModelValue() {
+      const dayjsObjects = getDayjsObjectsByModelValue();
+      if (isMultipleOrRange.value) {
+        pickerValue.value = dayjsObjects.map((dayjsObject) => dayjsObject.format(getPickerFormat()));
+      } else {
+        const [dayjsObject] = dayjsObjects;
+        pickerValue.value = dayjsObject ? dayjsObject.format(getPickerFormat()) : void 0;
+      }
+      if (!isFocusing.value) {
+        updateDisplayValueByDayjsObjects(dayjsObjects);
+      }
+    }
+    function updateModelValue(value) {
+      if (isEqual(value, props2.modelValue)) {
+        return;
+      }
+      call(props2["onUpdate:modelValue"], value);
+      call(props2.onChange, value);
+      validateWithTrigger("onChange");
+    }
+    function validateWithTrigger(trigger) {
+      nextTick(() => {
+        const { validateTrigger, rules, modelValue } = props2;
+        vt(validateTrigger, trigger, rules, modelValue);
+      });
+    }
+    function handleFocus(e) {
+      isFocusing.value = true;
+      call(props2.onFocus, e);
+      validateWithTrigger("onFocus");
+    }
+    function handleBlur(e) {
+      isFocusing.value = false;
+      showMenu.value = false;
+      call(props2.onBlur, e);
+      validateWithTrigger("onBlur");
+    }
+    function handleClick() {
+      if (isDisabled.value || isReadonly.value) {
+        return;
+      }
+      showMenu.value = true;
+      nextTick(() => {
+        var _a;
+        return (_a = picker.value) == null ? void 0 : _a.syncModelValue();
+      });
+      validateWithTrigger("onClick");
+    }
+    function handleKeydown(e) {
+      if (isDisabled.value || isReadonly.value || e.key !== "Enter") {
+        return;
+      }
+      preventDefault(e);
+      showMenu.value = true;
+      nextTick(() => {
+        var _a;
+        return (_a = picker.value) == null ? void 0 : _a.syncModelValue();
+      });
+    }
+    function updateSingleStatesByDisplayValue(value) {
+      const dayjsObject = stringToDayjsObject(value, getDisplayFormat());
+      if (!dayjsObject || !isDayjsObjectSelectable(dayjsObject)) {
+        return;
+      }
+      pickerValue.value = dayjsObject.format(getPickerFormat());
+      updateModelValue(dayjsObjectToModelValue(dayjsObject));
+    }
+    function updateMultipleOrRangeStatesByDisplayValue() {
+      const isInvalidDisplayValueCount = props2.range ? displayValues.value.length !== 2 : !displayValues.value.length;
+      if (isInvalidDisplayValueCount) {
+        return;
+      }
+      const dayjsObjects = displayValues.value.map((item) => stringToDayjsObject(item, getDisplayFormat()));
+      if (dayjsObjects.some((dayjsObject) => !dayjsObject)) {
+        return;
+      }
+      const validDayjsObjects = dayjsObjects.filter(isTruthy);
+      if (props2.range && validDayjsObjects[0].isAfter(validDayjsObjects[1])) {
+        return;
+      }
+      if (validDayjsObjects.some((dayjsObject, index) => {
+        const position = props2.range ? index === 0 ? "start" : "end" : void 0;
+        return !isDayjsObjectSelectable(dayjsObject, position);
+      })) {
+        return;
+      }
+      const modelValue = validDayjsObjects.map(dayjsObjectToModelValue);
+      pickerValue.value = validDayjsObjects.map((dayjsObject) => dayjsObject.format(getPickerFormat()));
+      updateModelValue(modelValue);
+    }
+    function handleInput(value) {
+      if (isDisabled.value || isReadonly.value) {
+        return;
+      }
+      if (value === displayValue.value) {
+        return;
+      }
+      displayValue.value = value;
+      if (value === "") {
+        clearValue();
+        updateModelValue(getEmptyModelValue());
+        validateWithTrigger("onInput");
+        return;
+      }
+      if (isMultipleOrRange.value) {
+        updateMultipleOrRangeStatesByDisplayValue();
+      } else {
+        updateSingleStatesByDisplayValue(value);
+      }
+      validateWithTrigger("onInput");
+    }
+    function handleChange() {
+      if (isDisabled.value || isReadonly.value) {
+        return;
+      }
+      updateDisplayValueByDayjsObjects(getDayjsObjectsByModelValue());
+    }
+    function handleDatetimeRangePickerChange(dayjsObjects) {
+      if (dayjsObjects.length < 2) {
+        return;
+      }
+      const times = rangeTimes.value;
+      const resolved = dayjsObjects.map(
+        (dayjsObject, index) => {
+          var _a;
+          return resolveSelectableDateTime(dayjsObject, (_a = times[index]) != null ? _a : getTimeParts(), index === 0 ? "start" : "end");
+        }
+      );
+      if (resolved.every(isTruthy)) {
+        if (!commitDateTimes(resolved.filter(isTruthy))) {
+          updateStatesByModelValue();
+        }
+      } else {
+        updateStatesByModelValue();
+      }
+    }
+    function handlePickerArrayChange(value) {
+      const dayjsObjects = value.map((item) => dayjs(item, getPickerFormat(), true)).filter((dayjsObject) => dayjsObject.isValid());
+      if (isDatetime.value && props2.range) {
+        handleDatetimeRangePickerChange(dayjsObjects);
+        return;
+      }
+      const modelValue = dayjsObjects.map(dayjsObjectToModelValue);
+      displayValue.value = dayjsObjects.map((dayjsObject) => dayjsObject.format(getDisplayFormat())).join(props2.range ? props2.rangeSeparator : props2.separator);
+      updateModelValue(modelValue);
+    }
+    function handleDatetimePickerChange(dayjsObject) {
+      const resolved = resolveSelectableDateTime(dayjsObject, singleTime.value);
+      if (resolved) {
+        if (!commitDateTimes([resolved])) {
+          updateStatesByModelValue();
+        }
+      } else {
+        updateStatesByModelValue();
+      }
+    }
+    function handlePickerSingleChange(value) {
+      const dayjsObject = dayjs(value, getPickerFormat(), true);
+      if (!dayjsObject.isValid()) {
+        return;
+      }
+      if (isDatetime.value) {
+        handleDatetimePickerChange(dayjsObject);
+        return;
+      }
+      displayValue.value = dayjsObject.format(getDisplayFormat());
+      updateModelValue(dayjsObjectToModelValue(dayjsObject));
+      if (!isMultipleOrRange.value) {
+        showMenu.value = false;
+      }
+    }
+    function handlePickerChange(value) {
+      if (isDisabled.value || isReadonly.value) {
+        return;
+      }
+      pickerValue.value = value;
+      if (isArray(value)) {
+        handlePickerArrayChange(value);
+        return;
+      }
+      handlePickerSingleChange(value);
+    }
+    function getEmptyModelValue() {
+      return isMultipleOrRange.value ? [] : void 0;
+    }
+    function clearValue() {
+      displayValue.value = "";
+      pickerValue.value = isMultipleOrRange.value ? [] : void 0;
+    }
+    function handleClear() {
+      if (isDisabled.value || isReadonly.value || !props2.clearable) {
+        return;
+      }
+      clearValue();
+      showMenu.value = false;
+      const emptyModelValue = getEmptyModelValue();
+      call(props2["onUpdate:modelValue"], emptyModelValue);
+      call(props2.onClear, "");
+      call(props2.onChange, emptyModelValue);
+      validateWithTrigger("onChange");
+      validateWithTrigger("onClear");
+    }
+    function focus() {
+      var _a;
+      (_a = inputEl.value) == null ? void 0 : _a.focus();
+    }
+    function blur() {
+      var _a;
+      (_a = inputEl.value) == null ? void 0 : _a.blur();
+    }
+    function select() {
+      var _a;
+      (_a = inputEl.value) == null ? void 0 : _a.select();
+    }
+    function validate() {
+      return v(props2.rules, props2.modelValue);
+    }
+    function reset() {
+      const emptyModelValue = getEmptyModelValue();
+      clearValue();
+      showMenu.value = false;
+      !isEqual(props2.modelValue, emptyModelValue) && call(props2["onUpdate:modelValue"], emptyModelValue);
+      resetValidation();
+    }
+    return {
+      inputEl,
+      picker,
+      displayValue,
+      pickerValue,
+      showMenu,
+      isFocusing,
+      rangeSelecting,
+      isRangeTimeSelectDisabled,
+      formDisabled,
+      formReadonly,
+      errorMessage,
+      menuPopoverClass,
+      isDatetime,
+      isMultiple,
+      pickerType,
+      pickerMin,
+      pickerMax,
+      singleTime,
+      rangeTimes,
+      singleAllowFns,
+      startAllowFns,
+      endAllowFns,
+      n,
+      classes,
+      handleTimeChange,
+      handleRangeTimeChange,
+      handleFocus,
+      handleBlur,
+      handleClick,
+      handleKeydown,
+      handleInput,
+      handleChange,
+      handlePickerChange,
+      handleClear,
+      focus,
+      blur,
+      select,
+      validate,
+      resetValidation,
+      reset
+    };
+  }
+});
+__sfc__.render = __render__;
+var stdin_default = __sfc__;
+export {
+  stdin_default as default
+};