x-next 1.0.1 → 1.2.0

package/dist/es/components/date-picker/DatePicker.vue2.js

@@ -0,0 +1,504 @@
+import { dayjs as $ } from "../../_utils/date.js";
+import { defineComponent as na, useAttrs as oa, toRefs as ra, computed as n, ref as V, watch as O, nextTick as ie } from "vue";
+import { Trigger as ia } from "../trigger/index.js";
+import ca from "../_components/picker/input.vue.js";
+import da from "../_components/picker/input-range.vue.js";
+import sa from "../time-picker/TimePanel.vue.js";
+import va from "../../icons/_ui/calendar.js";
+import { getClassNameMixin as fa } from "../../_utils/config.js";
+import { omit as ma } from "../../_utils/omit.js";
+import { isArray as i } from "../../_utils/is.js";
+import { useFormItem as ga } from "../../_hooks/use-form-item.js";
+import { usePickerFocus as Va } from "../../_hooks/use-picker-focus.js";
+import { useSize as ha } from "../../_hooks/use-size.js";
+import { useLocale as ya } from "../../locale/index.js";
+import Pa from "./DatePanel.vue.js";
+import { isRangeType as pa, getDatePickerMode as ba, getDefaultFormat as ka, parseDateModelValue as x, getSortedRange as j, getRangeViewDate as ce, formatPanelValue as D, normalizePanelValue as R, getShortcutValue as Da, parseInputValue as de, getDateValueFromPanel as G, isSameDateValue as Sa } from "./utils.js";
+const Ya = na({
+  name: "DatePicker",
+  components: {
+    Trigger: ia,
+    DateInput: ca,
+    DateRangeInput: da,
+    DatePanel: Pa,
+    TimePanel: sa,
+    IconCalendar: va
+  },
+  inheritAttrs: !1,
+  props: {
+    type: {
+      type: String,
+      default: "date",
+      validator: (t) => [
+        "date",
+        "month",
+        "year",
+        "quarter",
+        "week",
+        "date-range",
+        "month-range",
+        "year-range",
+        "quarter-range",
+        "week-range"
+      ].includes(t)
+    },
+    modelValue: {
+      type: [String, Number, Date, Array]
+    },
+    defaultValue: {
+      type: [String, Number, Date, Array]
+    },
+    pickerValue: {
+      type: [String, Number, Date, Array]
+    },
+    defaultPickerValue: {
+      type: [String, Number, Date, Array]
+    },
+    placeholder: {
+      type: [String, Array]
+    },
+    disabled: {
+      type: [Boolean, Array],
+      default: !1
+    },
+    readonly: {
+      type: Boolean,
+      default: !1
+    },
+    disabledInput: {
+      type: Boolean,
+      default: !1
+    },
+    inputReadOnly: {
+      type: Boolean,
+      default: !1
+    },
+    error: {
+      type: Boolean,
+      default: !1
+    },
+    allowClear: {
+      type: Boolean,
+      default: !0
+    },
+    format: {
+      type: String
+    },
+    valueFormat: {
+      type: String
+    },
+    size: {
+      type: String
+    },
+    dayStartOfWeek: {
+      type: Number,
+      default: 0
+    },
+    disabledDate: {
+      type: Function
+    },
+    hideNotInViewDates: {
+      type: Boolean,
+      default: !1
+    },
+    popupVisible: {
+      type: Boolean,
+      default: void 0
+    },
+    defaultPopupVisible: {
+      type: Boolean,
+      default: !1
+    },
+    position: {
+      type: String,
+      default: "bl"
+    },
+    popupContainer: {
+      type: [String, Object]
+    },
+    triggerProps: {
+      type: Object
+    },
+    unmountOnClose: {
+      type: Boolean,
+      default: !1
+    },
+    shortcuts: {
+      type: Array,
+      default: () => []
+    },
+    showToday: {
+      type: Boolean,
+      default: !0
+    },
+    showConfirmBtn: {
+      type: Boolean,
+      default: !1
+    },
+    showTime: {
+      type: Boolean,
+      default: !1
+    },
+    timePickerProps: {
+      type: Object
+    },
+    disabledTime: {
+      type: Function
+    },
+    showLunar: {
+      type: [Boolean, Object],
+      default: !1
+    }
+  },
+  emits: {
+    "update:modelValue": (t) => !0,
+    "update:popupVisible": (t) => !0,
+    "update:pickerValue": (t) => !0,
+    change: (t, c, S) => !0,
+    select: (t, c, S) => !0,
+    "calendar-change": (t, c, S, E) => !0,
+    clear: (t) => !0,
+    ok: (t, c, S) => !0,
+    "popup-visible-change": (t) => !0,
+    "picker-value-change": (t, c, S) => !0,
+    "select-shortcut": (t) => !0,
+    focus: (t) => !0,
+    blur: (t) => !0
+  },
+  setup(t, { emit: c }) {
+    const S = oa(), E = ra(t), se = fa("date-picker"), { t: h } = ya(), d = n(() => pa(t.type)), g = n(() => ba(t.type)), p = n(() => g.value === "date" && t.showTime), Y = n(() => t.timePickerProps || {}), L = n(() => Y.value.format || "HH:mm:ss"), q = n(() => t.showConfirmBtn || p.value), f = n(
+      () => t.format || ka(g.value, p.value)
+    ), A = n(
+      () => t.valueFormat && t.valueFormat !== "timestamp" && t.valueFormat !== "Date" ? t.valueFormat : f.value
+    ), ve = n(
+      () => i(t.disabled) ? t.disabled.every(Boolean) : t.disabled
+    ), {
+      mergedSize: fe,
+      mergedDisabled: me,
+      mergedError: ge,
+      eventHandlers: C
+    } = ga({
+      size: E.size,
+      disabled: ve,
+      error: E.error
+    }), { mergedSize: Ve } = ha(fe), J = V(
+      x(t.defaultValue, A.value, d.value)
+    ), m = n(() => {
+      const e = t.modelValue !== void 0 ? x(t.modelValue, A.value, d.value) : J.value;
+      return d.value && !i(e) ? [void 0, void 0] : e;
+    }), X = V(
+      x(t.defaultPickerValue, A.value, d.value)
+    ), H = n(() => t.pickerValue !== void 0 ? x(t.pickerValue, A.value, d.value) : X.value), B = V(), U = V(!1), s = V(0), Z = V(t.defaultPopupVisible), r = V(m.value), y = V(), v = V(), b = V(), F = V("date"), I = n(() => t.popupVisible ?? Z.value), z = n(() => !!me.value), he = n(
+      () => t.readonly || t.disabledInput || t.inputReadOnly
+    ), ye = n(() => z.value ? [!0, !0] : i(t.disabled) ? t.disabled : [!!t.disabled, !!t.disabled]), W = n(
+      () => i(r.value) ? void 0 : r.value
+    ), k = n(
+      () => i(r.value) ? r.value : [void 0, void 0]
+    ), Pe = n(() => {
+      if (!d.value || !y.value) return [];
+      const [e, a] = k.value;
+      return e && !a ? j([e, y.value]) : [];
+    }), pe = n(() => {
+      if (!d.value) return [b.value, void 0];
+      const e = b.value || k.value[0] || k.value[1], a = ce(e, g.value);
+      return [e, a];
+    }), be = n(
+      () => i(m.value) ? void 0 : m.value
+    ), ke = n(
+      () => i(m.value) ? m.value : []
+    ), De = n(
+      () => typeof v.value == "string" ? v.value : void 0
+    ), Se = n(
+      () => i(v.value) ? v.value : void 0
+    ), Fe = (e) => h(e === "month" ? "datePicker.placeholderMonth" : e === "year" ? "datePicker.placeholderYear" : e === "quarter" ? "datePicker.placeholderQuarter" : e === "week" ? "datePicker.placeholderWeek" : "datePicker.placeholderDate"), _e = n(() => i(t.placeholder) ? t.placeholder[0] : t.placeholder ?? Fe(g.value)), Be = n(() => {
+      if (i(t.placeholder)) return t.placeholder;
+      const e = t.placeholder ?? h("datePicker.dateLabel");
+      return [
+        h("datePicker.rangeStart", { type: e }),
+        h("datePicker.rangeEnd", { type: e })
+      ];
+    }), Ce = n(() => ma(S, ["class", "style"])), Ie = n(() => {
+      if (t.disabledDate)
+        return (e) => {
+          var l;
+          const a = d.value ? s.value === 0 ? "start" : "end" : void 0;
+          return ((l = t.disabledDate) == null ? void 0 : l.call(t, e, a, {
+            value: D(
+              r.value,
+              f.value,
+              t.valueFormat
+            ),
+            selecting: a
+          })) ?? !1;
+        };
+    }), we = (e = 0) => {
+      const a = Y.value.defaultValue, l = i(a) ? a[e] : a, u = x(l, L.value, !1);
+      return i(u) ? void 0 : u;
+    }, M = (e, a, l = 0) => {
+      const u = i(r.value) ? r.value[l] : r.value, o = a || u || we(l);
+      return o ? e.hour(o.hour()).minute(o.minute()).second(o.second()).millisecond(0) : e.millisecond(0);
+    }, Te = (e, a) => {
+      var l;
+      return ((l = t.disabledTime) == null ? void 0 : l.call(t, e == null ? void 0 : e.toDate(), a)) ?? {};
+    }, xe = (e) => (e == null ? void 0 : e.format("YYYY-MM-DD")) ?? h("datePicker.placeholderDate"), Re = (e) => (e == null ? void 0 : e.format(L.value)) ?? "--:--:--", ee = (e) => {
+      t.modelValue === void 0 && (J.value = i(e) ? [...e] : e);
+    }, K = (e) => {
+      t.pickerValue === void 0 && (X.value = i(e) ? [...e] : e);
+    }, w = (e) => {
+      var l;
+      (z.value || t.readonly) && (e = !1);
+      const a = !e && ((l = ue.value) == null ? void 0 : l.contains(document.activeElement));
+      Z.value = e, a && ie(() => {
+        var u, o;
+        I.value || (o = (u = B.value) == null ? void 0 : u.focus) == null || o.call(u, d.value ? s.value : void 0);
+      }), c("update:popupVisible", e), c("popup-visible-change", e);
+    }, N = (e) => i(e) ? e[0] || e[1] : e, ae = () => {
+      r.value = i(m.value) ? [...m.value] : m.value, b.value = N(H.value) || N(r.value);
+    }, P = (e, a) => {
+      const l = D(
+        a,
+        f.value,
+        t.valueFormat
+      ), u = G(a), o = D(a, f.value);
+      c(e === "change" ? "change" : e === "select" ? "select" : e === "ok" ? "ok" : "picker-value-change", l, u, o);
+    }, Q = (e, a) => {
+      const l = D(
+        e,
+        f.value,
+        t.valueFormat
+      ), u = G(e), o = D(e, f.value);
+      c("calendar-change", l, u, o, { range: a });
+    }, te = (e) => {
+      const a = D(
+        e,
+        f.value,
+        t.valueFormat
+      ), l = G(e), u = D(e, f.value);
+      c("update:pickerValue", a), c("picker-value-change", a, l, u);
+    }, le = (e) => {
+      if (!d.value) return e;
+      const a = H.value, l = i(a) ? [...a] : [void 0, void 0];
+      return l[s.value] = e, l;
+    }, _ = (e, a = !0) => {
+      var u, o;
+      const l = i(e) ? j(e) : e;
+      Sa(l, m.value, g.value, p.value) || (ee(l), c(
+        "update:modelValue",
+        D(
+          l,
+          f.value,
+          t.valueFormat
+        )
+      ), P("change", l), (o = (u = C.value) == null ? void 0 : u.onChange) == null || o.call(u)), a && w(!1);
+    }, Ae = (e) => {
+      const a = p.value ? M(R(e, g.value), void 0, s.value) : R(e, g.value);
+      if (d.value) {
+        const l = [...k.value];
+        if (!l[0] || l[1] || s.value === 0) {
+          l[0] = a, l[1] = void 0, s.value = 1, y.value = void 0, r.value = l, F.value = "date", P("select", l), Q(l, "start");
+          return;
+        } else {
+          l[1] = a;
+          const u = j(l);
+          y.value = void 0, r.value = u, F.value = "date", P("select", u), Q(u, "end"), q.value || _(u);
+          return;
+        }
+      }
+      r.value = a, P("select", a), q.value || _(a);
+    }, ze = (e, a) => {
+      if (d.value) {
+        const o = a ?? s.value, T = [...k.value], ua = T[o] || $();
+        T[o] = M(ua, e, o), r.value = T, s.value = o, P("select", T), Q(T, o === 0 ? "start" : "end");
+        return;
+      }
+      const l = W.value || $(), u = M(l, e);
+      r.value = u, P("select", u);
+    }, Me = () => {
+      const e = R($(), g.value), a = p.value ? M(e, W.value) : e;
+      r.value = a, b.value = e, K(e), P("select", a), p.value || _(a);
+    }, Ne = (e) => {
+      s.value = e, F.value = "time";
+    }, Oe = (e) => {
+      s.value = e, F.value = "date";
+    }, je = (e) => {
+      if (!d.value) return;
+      const [a, l] = k.value;
+      a && !l && (y.value = e);
+    }, Ee = () => {
+      y.value = void 0;
+    }, Ye = (e) => {
+      const a = Da(e, f.value, d.value);
+      r.value = a, c("select-shortcut", e), P("select", a), !p.value && _(a);
+    }, Le = () => {
+      _(r.value), P("ok", r.value);
+    }, qe = (e) => {
+      b.value = e;
+      const a = le(e);
+      K(a), te(a);
+    }, He = (e, a) => {
+      const l = a === 0 ? e : ce(e, g.value, -1);
+      b.value = l;
+      const u = le(l);
+      K(u), te(u);
+    }, Ue = (e) => {
+      w(e);
+    }, {
+      popupRef: ue,
+      panelId: We,
+      openPanel: Ke,
+      handlePanelKeydown: Qe,
+      isInternalFocus: $e,
+      handlePanelFocusout: Ge
+    } = Va({
+      visible: I,
+      canOpen: () => !z.value && !t.readonly,
+      setVisible: w,
+      focusInput: () => {
+        var e, a;
+        return (a = (e = B.value) == null ? void 0 : e.focus) == null ? void 0 : a.call(e, d.value ? s.value : void 0);
+      },
+      inputContains: (e) => {
+        var a, l;
+        return !!(e && ((l = (a = B.value) == null ? void 0 : a.$el) != null && l.contains(e)));
+      },
+      selector: '[role="gridcell"][tabindex="0"], [role="listbox"][tabindex="0"]'
+    }), Je = (e) => {
+      Ge(e, oe);
+    }, Xe = (e) => {
+      var a, l, u;
+      (a = e == null ? void 0 : e.stopPropagation) == null || a.call(e), v.value = void 0, r.value = d.value ? [void 0, void 0] : void 0, ee(r.value), y.value = void 0, c("update:modelValue", void 0), c("change", void 0, void 0, void 0), c("clear", e), (u = (l = C.value) == null ? void 0 : l.onChange) == null || u.call(l), w(!1);
+    }, Ze = (e) => {
+      var l, u;
+      const a = e.target;
+      if (d.value) {
+        const o = i(v.value) ? [...v.value] : ["", ""];
+        o[s.value] = a.value, v.value = o;
+      } else
+        v.value = a.value;
+      (u = (l = C.value) == null ? void 0 : l.onInput) == null || u.call(l);
+    }, ne = () => {
+      if (d.value) {
+        const e = i(v.value) ? v.value : [], a = [...k.value], l = de(e[s.value], f.value);
+        l && (a[s.value] = R(l, g.value), r.value = a, a[0] && a[1] && _(j(a)));
+      } else if (typeof v.value == "string") {
+        const e = de(v.value, f.value);
+        if (e) {
+          const a = R(e, g.value);
+          r.value = a, _(a);
+        }
+      }
+      v.value = void 0, y.value = void 0;
+    }, ea = (e) => {
+      var a, l;
+      U.value = !0, c("focus", e), (l = (a = C.value) == null ? void 0 : a.onFocus) == null || l.call(a, e);
+    }, oe = (e) => {
+      var a, l;
+      $e(e.relatedTarget) || (U.value = !1, ne(), c("blur", e), (l = (a = C.value) == null ? void 0 : a.onBlur) == null || l.call(a, e));
+    }, aa = () => {
+      v.value = void 0, w(!1), re();
+    }, ta = (e) => {
+      s.value = e;
+    }, re = () => {
+      ie(() => {
+        var e, a;
+        (a = (e = B.value) == null ? void 0 : e.focus) == null || a.call(e, d.value ? s.value : void 0);
+      });
+    }, la = () => {
+      var e, a;
+      (a = (e = B.value) == null ? void 0 : e.blur) == null || a.call(e);
+    };
+    return O(
+      () => I.value,
+      (e) => {
+        e && (ae(), v.value = void 0, y.value = void 0, F.value = "date");
+      }
+    ), O(
+      () => [t.modelValue, t.type, t.format, t.valueFormat],
+      () => {
+        r.value = i(m.value) ? [...m.value] : m.value, v.value = void 0, y.value = void 0, F.value = "date";
+      }
+    ), O(
+      () => [
+        t.pickerValue,
+        t.defaultPickerValue,
+        t.type,
+        t.format,
+        t.valueFormat
+      ],
+      () => {
+        b.value = N(H.value) || N(r.value);
+      }
+    ), O(
+      () => m.value,
+      () => {
+        I.value || ae();
+      }
+    ), {
+      t: h,
+      attrs: S,
+      className: se,
+      inputRef: B,
+      inputAttrs: Ce,
+      isRange: d,
+      mode: g,
+      isDateTime: p,
+      needConfirm: q,
+      timeFormat: L,
+      timePickerProps: Y,
+      focused: U,
+      focusedIndex: s,
+      mergedSize: Ve,
+      mergedError: ge,
+      allDisabled: z,
+      rangeDisabled: ye,
+      mergedInputReadonly: he,
+      mergedPopupVisible: I,
+      computedFormat: f,
+      singleInputValue: be,
+      rangeInputValue: ke,
+      singleInputText: De,
+      rangeInputText: Se,
+      singlePlaceholder: _e,
+      rangePlaceholder: Be,
+      singlePanelValue: W,
+      rangePanelValue: k,
+      previewRangeValue: Pe,
+      rangeViewDates: pe,
+      rangePanelMode: F,
+      viewDate: b,
+      mergedDisabledDate: Ie,
+      getDisabledTimeProps: Te,
+      formatTimeDate: xe,
+      formatTimeValue: Re,
+      handlePanelSelect: Ae,
+      handleTimeSelect: ze,
+      openRangeTimePanel: Ne,
+      openRangeDatePanel: Oe,
+      handlePanelCellMouseEnter: je,
+      handlePanelCellMouseLeave: Ee,
+      handleShortcut: Ye,
+      handleToday: Me,
+      handleConfirm: Le,
+      handleViewDateChange: qe,
+      handleRangeViewDateChange: He,
+      handlePopupVisibleChange: Ue,
+      handleClear: Xe,
+      handleInputChange: Ze,
+      handleInputSubmit: ne,
+      handleFocus: ea,
+      handleBlur: oe,
+      handleEsc: aa,
+      handleFocusedIndexChange: ta,
+      openPanel: Ke,
+      popupRef: ue,
+      panelId: We,
+      handlePanelKeydown: Qe,
+      handlePopupFocusout: Je,
+      focus: re,
+      blur: la
+    };
+  }
+});
+export {
+  Ya as default
+};

package/dist/es/components/date-picker/index.js

@@ -0,0 +1,56 @@
+import n from "./DatePicker.vue.js";
+import { defineComponent as c, h as k } from "vue";
+import { generateComponent as e } from "../../_utils/vue-eco.js";
+import { getComponentPrefix as r } from "../../_utils/config.js";
+import { getRangePickerType as s } from "./utils.js";
+const l = e(r("DatePicker"), n), i = (t, o) => c({
+  name: t,
+  inheritAttrs: !1,
+  setup(a, { attrs: P, slots: m }) {
+    return () => k(n, { ...P, type: o }, m);
+  }
+}), y = e(
+  r("MonthPicker"),
+  i("MonthPicker", "month")
+), R = e(
+  r("YearPicker"),
+  i("YearPicker", "year")
+), C = e(
+  r("QuarterPicker"),
+  i("QuarterPicker", "quarter")
+), D = e(
+  r("WeekPicker"),
+  i("WeekPicker", "week")
+), p = c({
+  name: "RangePicker",
+  inheritAttrs: !1,
+  props: {
+    mode: {
+      type: String,
+      default: "date",
+      validator: (t) => ["date", "month", "year", "quarter", "week"].includes(t)
+    }
+  },
+  setup(t, { attrs: o, slots: a }) {
+    return () => k(
+      n,
+      {
+        ...o,
+        type: s(t.mode)
+      },
+      a
+    );
+  }
+}), M = e(
+  r("RangePicker"),
+  p
+);
+export {
+  l as DatePicker,
+  y as MonthPicker,
+  C as QuarterPicker,
+  M as RangePicker,
+  D as WeekPicker,
+  R as YearPicker,
+  l as default
+};