x-next 1.0.0 → 1.1.0

package/dist/es/components/_components/feedback-icon/index.vue2.js

@@ -0,0 +1,29 @@
+import { defineComponent as e, computed as c } from "vue";
+import l from "../../../icons/animation/animation-loading.js";
+import t from "../../../icons/default/check-circle-fill.js";
+import n from "../../../icons/default/exclamation-circle-fill.js";
+import r from "../../../icons/default/close-circle-fill.js";
+import { getClassNameMixin as m } from "../../../_utils/config.js";
+const k = e({
+  name: "FeedbackIcon",
+  components: {
+    IconLoading: l,
+    IconCheckCircleFill: t,
+    IconExclamationCircleFill: n,
+    IconCloseCircleFill: r
+  },
+  props: {
+    type: {
+      type: String
+    }
+  },
+  setup(i) {
+    const o = m("feedback-icon");
+    return {
+      cls: c(() => [o.block, o.modifier(`status-${i.type}`)])
+    };
+  }
+});
+export {
+  k as default
+};

package/dist/es/components/_components/icon-hover/index.vue.js

@@ -0,0 +1,30 @@
+import o from "./index.vue2.js";
+import { openBlock as s, createBlock as a, resolveDynamicComponent as d, mergeProps as i, withCtx as n, renderSlot as r } from "vue";
+import l from "../../../_virtual/_plugin-vue_export-helper.js";
+function m(e, p, t, u, f, b) {
+  return s(), a(d(e.as), i(e.$attrs, {
+    type: e.as === "button" ? "button" : void 0,
+    disabled: e.as === "button" ? e.disabled : void 0,
+    "aria-disabled": e.as !== "button" && e.disabled ? "true" : void 0,
+    class: [
+      e.className.block,
+      {
+        [`${e.prefix}-icon-hover`]: e.prefix,
+        [e.className.modifier(`size-${e.size}`)]: e.size !== "medium",
+        [e.className.modifier("disabled")]: e.disabled
+      }
+    ],
+    onClick: e.handleClick,
+    onMousedown: e.handleMousedown,
+    onKeydown: e.handleKeydown
+  }), {
+    default: n(() => [
+      r(e.$slots, "default")
+    ]),
+    _: 3
+  }, 16, ["type", "disabled", "aria-disabled", "class", "onClick", "onMousedown", "onKeydown"]);
+}
+const k = /* @__PURE__ */ l(o, [["render", m]]);
+export {
+  k as default
+};

package/dist/es/components/_components/icon-hover/index.vue2.js

@@ -0,0 +1,45 @@
+import { defineComponent as a } from "vue";
+import { getClassNameMixin as d } from "../../../_utils/config.js";
+const f = a({
+  name: "IconHover",
+  inheritAttrs: !1,
+  props: {
+    as: {
+      type: String,
+      default: "span"
+    },
+    prefix: {
+      type: String
+    },
+    size: {
+      type: String,
+      default: "medium"
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: {
+    click: (e) => !0,
+    mousedown: (e) => !0,
+    keydown: (e) => !0
+  },
+  setup(e, { emit: o }) {
+    return {
+      className: d("icon-hover"),
+      handleClick: (n) => {
+        e.disabled || o("click", n);
+      },
+      handleMousedown: (n) => {
+        e.disabled || o("mousedown", n);
+      },
+      handleKeydown: (n) => {
+        e.disabled || o("keydown", n);
+      }
+    };
+  }
+});
+export {
+  f as default
+};

package/dist/es/components/_components/input-label/input-label.js

@@ -0,0 +1,141 @@
+import { defineComponent as _, toRefs as D, computed as a, createVNode as l, mergeProps as b } from "vue";
+import { omit as K } from "../../../_utils/omit.js";
+import { INPUT_EVENTS as v } from "../../../_utils/constant.js";
+import O from "../../../_utils/pick.js";
+import { useInput as T } from "../../../_hooks/use-input.js";
+import { useFormItem as H } from "../../../_hooks/use-form-item.js";
+import { useSize as U } from "../../../_hooks/use-size.js";
+import { getClassNameMixin as V, getRemovePrefixComponentName as $ } from "../../../_utils/config.js";
+const ne = /* @__PURE__ */ _({
+  name: "InputLabel",
+  inheritAttrs: !1,
+  props: {
+    modelValue: Object,
+    inputValue: {
+      type: String,
+      default: ""
+    },
+    enabledInput: Boolean,
+    formatLabel: Function,
+    placeholder: String,
+    retainInputValue: Boolean,
+    disabled: Boolean,
+    baseCls: String,
+    size: String,
+    error: Boolean,
+    // used for outer focused
+    focused: Boolean,
+    uninjectFormItemContext: Boolean,
+    inputAttrs: Object
+  },
+  emits: {
+    "update:inputValue": (e) => !0,
+    inputValueChange: (e, o) => !0,
+    focus: (e) => !0,
+    blur: (e) => !0,
+    keydown: (e) => !0
+  },
+  setup(e, {
+    attrs: o,
+    emit: m,
+    slots: t
+  }) {
+    const {
+      size: h,
+      disabled: g,
+      error: I,
+      inputValue: C,
+      uninjectFormItemContext: r
+    } = D(e), n = e.baseCls ? V($(e.baseCls)) : V("input-label"), {
+      mergedSize: x,
+      mergedDisabled: s,
+      mergedError: S,
+      eventHandlers: w
+    } = H({
+      size: h,
+      disabled: g,
+      error: I,
+      uninject: r == null ? void 0 : r.value
+    }), {
+      mergedSize: B
+    } = U(x), {
+      inputRef: c,
+      _focused: f,
+      computedValue: N,
+      handleInput: z,
+      handleComposition: i,
+      handleFocus: y,
+      handleBlur: L,
+      handleMousedown: A
+    } = T({
+      modelValue: C,
+      emit: m,
+      eventName: "inputValueChange",
+      updateEventName: "update:inputValue",
+      eventHandlers: w
+    }), E = a(() => e.focused ?? f.value), p = a(() => e.enabledInput && f.value || !e.modelValue), d = () => {
+      var u;
+      return e.modelValue ? ((u = e.formatLabel) == null ? void 0 : u.call(e, e.modelValue)) ?? e.modelValue.label : "";
+    }, F = a(() => e.enabledInput && e.modelValue ? d() : e.placeholder), R = () => {
+      var u;
+      return e.modelValue ? ((u = t.default) == null ? void 0 : u.call(t, {
+        data: e.modelValue
+      })) ?? d() : null;
+    }, k = a(() => [n.block, n.modifier(`size-${B.value}`), {
+      [n.modifier("search")]: e.enabledInput,
+      [n.modifier("focus")]: E.value,
+      [n.modifier("disabled")]: s.value,
+      [n.modifier("error")]: S.value
+    }]), P = a(() => K(o, v)), j = a(() => O(o, v)), M = (u) => {
+      m("keydown", u);
+    };
+    return {
+      inputRef: c,
+      render: () => l("span", b(P.value, {
+        class: k.value,
+        title: d(),
+        onMousedown: A
+      }), [t.prefix && l("span", {
+        class: n.element("prefix")
+      }, [t.prefix()]), l("input", b(j.value, e.inputAttrs, {
+        ref: c,
+        class: [n.element("input"), {
+          [n.element("input-hidden")]: !p.value
+        }],
+        value: N.value,
+        readonly: !e.enabledInput,
+        placeholder: F.value,
+        disabled: s.value,
+        onInput: z,
+        onKeydown: M,
+        onFocus: y,
+        onBlur: L,
+        onCompositionstart: i,
+        onCompositionupdate: i,
+        onCompositionend: i
+      }), null), l("span", {
+        class: [n.element("value"), {
+          [n.element("value-hidden")]: p.value
+        }]
+      }, [R()]), t.suffix && l("span", {
+        class: n.element("suffix")
+      }, [t.suffix()])])
+    };
+  },
+  methods: {
+    focus() {
+      var e;
+      (e = this.inputRef) == null || e.focus();
+    },
+    blur() {
+      var e;
+      (e = this.inputRef) == null || e.blur();
+    }
+  },
+  render() {
+    return this.render();
+  }
+});
+export {
+  ne as default
+};

package/dist/es/components/_components/picker/input-range.vue.js

@@ -0,0 +1,92 @@
+import k from "./input-range.vue2.js";
+import { resolveComponent as d, openBlock as r, createElementBlock as i, normalizeClass as s, renderSlot as u, createCommentVNode as p, createElementVNode as l, mergeProps as t, withKeys as a, createTextVNode as y, createBlock as m, withCtx as I, createVNode as g } from "vue";
+import v from "../../../_virtual/_plugin-vue_export-helper.js";
+const N = ["disabled", "placeholder", "value"], F = ["disabled", "placeholder", "value"];
+function B(e, o, P, $, T, E) {
+  const f = d("IconClose"), b = d("IconHover"), C = d("FeedbackIcon");
+  return r(), i("div", {
+    class: s(e.classNames)
+  }, [
+    e.$slots.prefix ? (r(), i("div", {
+      key: 0,
+      class: s(e.className.element("prefix"))
+    }, [
+      u(e.$slots, "prefix")
+    ], 2)) : p("", !0),
+    l("div", {
+      class: s(e.getInputWrapClassName(0))
+    }, [
+      l("input", t({
+        ref: "refInput0",
+        disabled: e.disabled0,
+        placeholder: e.placeholder[0],
+        value: e.displayValue0
+      }, e.readonly ? { readonly: !0 } : {}, {
+        onInput: o[0] || (o[0] = (...n) => e.onChange && e.onChange(...n)),
+        onFocus: o[1] || (o[1] = (...n) => e.onFocus && e.onFocus(...n)),
+        onBlur: o[2] || (o[2] = (...n) => e.onBlur && e.onBlur(...n)),
+        onKeydown: [
+          o[3] || (o[3] = a((...n) => e.onPressEnter && e.onPressEnter(...n), ["enter"])),
+          o[4] || (o[4] = a((...n) => e.onPressTab && e.onPressTab(...n), ["tab"]))
+        ],
+        onClick: o[5] || (o[5] = () => e.changeFocusedInput(0))
+      }), null, 16, N)
+    ], 2),
+    l("span", {
+      class: s(e.className.element("separator"))
+    }, [
+      u(e.$slots, "separator", {}, () => [
+        o[12] || (o[12] = y(" - ", -1))
+      ])
+    ], 2),
+    l("div", {
+      class: s(e.getInputWrapClassName(1))
+    }, [
+      l("input", t({
+        ref: "refInput1",
+        disabled: e.disabled1,
+        placeholder: e.placeholder[1],
+        value: e.displayValue1
+      }, e.readonly ? { readonly: !0 } : {}, {
+        onInput: o[6] || (o[6] = (...n) => e.onChange && e.onChange(...n)),
+        onFocus: o[7] || (o[7] = (...n) => e.onFocus && e.onFocus(...n)),
+        onBlur: o[8] || (o[8] = (...n) => e.onBlur && e.onBlur(...n)),
+        onKeydown: [
+          o[9] || (o[9] = a((...n) => e.onPressEnter && e.onPressEnter(...n), ["enter"])),
+          o[10] || (o[10] = a((...n) => e.onPressTab && e.onPressTab(...n), ["tab"]))
+        ],
+        onClick: o[11] || (o[11] = () => e.changeFocusedInput(1))
+      }), null, 16, F)
+    ], 2),
+    l("div", {
+      class: s(e.className.element("suffix"))
+    }, [
+      e.allowClear && !e.mergedDisabled && (e.value[0] || e.value[1]) ? (r(), m(b, {
+        key: 0,
+        as: "button",
+        "aria-label": e.t("common.clearTarget", { target: e.t(e.clearTargetKey) }),
+        prefix: "picker",
+        class: s(e.className.element("clear-icon")),
+        onClick: e.onClear
+      }, {
+        default: I(() => [
+          g(f)
+        ]),
+        _: 1
+      }, 8, ["aria-label", "class", "onClick"])) : p("", !0),
+      l("span", {
+        class: s(e.className.element("suffix-icon"))
+      }, [
+        u(e.$slots, "suffix-icon")
+      ], 2),
+      e.feedback ? (r(), m(C, {
+        key: 1,
+        type: e.feedback
+      }, null, 8, ["type"])) : p("", !0)
+    ], 2)
+  ], 2);
+}
+const D = /* @__PURE__ */ v(k, [["render", B]]);
+export {
+  D as default
+};

package/dist/es/components/_components/picker/input-range.vue2.js

@@ -0,0 +1,163 @@
+import { defineComponent as K, toRefs as L, ref as I, computed as s } from "vue";
+import M from "../feedback-icon/index.vue.js";
+import { isNumber as U, isUndefined as W, isArray as $, isDayjs as G, isFunction as J } from "../../../_utils/is.js";
+import O from "../../../icons/default/close-circle-fill.js";
+import Q from "../icon-hover/index.vue.js";
+import { useFormItem as X } from "../../../_hooks/use-form-item.js";
+import { useLocale as Y } from "../../../locale/index.js";
+import { useSize as Z } from "../../../_hooks/use-size.js";
+import { getClassNameMixin as ee } from "../../../_utils/config.js";
+const ce = K({
+  name: "DateInputRange",
+  components: {
+    IconHover: Q,
+    IconClose: O,
+    FeedbackIcon: M
+  },
+  props: {
+    size: {
+      type: String
+    },
+    focused: {
+      type: Boolean
+    },
+    focusedIndex: {
+      type: Number
+    },
+    error: {
+      type: Boolean
+    },
+    disabled: {
+      type: [Boolean, Array],
+      default: !1
+    },
+    readonly: {
+      type: Boolean
+    },
+    allowClear: {
+      type: Boolean
+    },
+    placeholder: {
+      type: Array,
+      default: () => []
+    },
+    inputValue: {
+      type: Array
+    },
+    value: {
+      type: Array,
+      default: () => []
+    },
+    /**
+     * 清空按钮 aria 文案用的 locale key，由父组件按日期/时间语义传入
+     */
+    clearTargetKey: {
+      type: String,
+      default: "common.dateRange"
+    },
+    format: {
+      type: [String, Function],
+      required: !0
+    }
+  },
+  emits: [
+    "focused-index-change",
+    "update:focusedIndex",
+    "change",
+    "clear",
+    "press-enter",
+    "focus",
+    "blur"
+  ],
+  setup(t, { emit: r, slots: a }) {
+    const { t: h } = Y(), { error: C, focused: x, disabled: i, size: z, value: l, format: c, focusedIndex: f, inputValue: n } = L(t), {
+      mergedSize: D,
+      mergedDisabled: d,
+      mergedError: F,
+      feedback: S
+    } = X({ size: z, error: C }), { mergedSize: B } = Z(D), N = I(), A = I(), p = (e) => d.value ? d.value : $(i.value) ? i.value[e] : i.value, m = s(() => p(0)), g = s(() => p(1)), o = ee("picker"), k = s(() => [
+      o.block,
+      o.modifier("range"),
+      o.modifier(`size-${B.value}`),
+      {
+        [o.modifier("focused")]: x.value,
+        [o.modifier("disabled")]: m.value && g.value,
+        [o.modifier("error")]: F.value,
+        [o.modifier("has-prefix")]: a.prefix
+      }
+    ]);
+    function E(e) {
+      return [
+        o.element("input"),
+        {
+          [o.element("input-active")]: e === (f == null ? void 0 : f.value)
+        }
+      ];
+    }
+    function y(e) {
+      var v, b;
+      if (n != null && n.value)
+        return (v = n == null ? void 0 : n.value) == null ? void 0 : v[e];
+      const u = (b = l == null ? void 0 : l.value) == null ? void 0 : b[e];
+      if (u && G(u))
+        return J(c.value) ? c.value(u) : u.format(c.value);
+    }
+    const P = s(() => y(0)), R = s(() => y(1));
+    function _(e) {
+      r("focused-index-change", e), r("update:focusedIndex", e);
+    }
+    function T(e) {
+      e.stopPropagation(), r("change", e);
+    }
+    function V() {
+      r("press-enter");
+    }
+    function j(e) {
+      r("focus", e);
+    }
+    function q(e) {
+      r("blur", e);
+    }
+    function w(e) {
+      e.preventDefault();
+    }
+    function H(e) {
+      r("clear", e);
+    }
+    return {
+      t: h,
+      className: o,
+      classNames: k,
+      refInput0: N,
+      refInput1: A,
+      disabled0: m,
+      disabled1: g,
+      mergedDisabled: d,
+      getDisabled: p,
+      getInputWrapClassName: E,
+      displayValue0: P,
+      displayValue1: R,
+      changeFocusedInput: _,
+      onChange: T,
+      onFocus: j,
+      onBlur: q,
+      onPressEnter: V,
+      onPressTab: w,
+      onClear: H,
+      feedback: S
+    };
+  },
+  methods: {
+    focus(t) {
+      const r = U(t) ? t : this.focusedIndex, a = r === 0 ? this.refInput0 : this.refInput1;
+      !W(r) && !this.getDisabled(r) && a && a.focus && a.focus();
+    },
+    blur() {
+      const t = this.focusedIndex === 0 ? this.refInput0 : this.refInput1;
+      t && t.blur && t.blur();
+    }
+  }
+});
+export {
+  ce as default
+};

package/dist/es/components/_components/picker/input.vue.js

@@ -0,0 +1,63 @@
+import c from "./input.vue2.js";
+import { resolveComponent as r, openBlock as n, createElementBlock as t, normalizeClass as l, renderSlot as m, createCommentVNode as i, createElementVNode as a, mergeProps as k, withKeys as b, createBlock as d, withCtx as y, createVNode as C } from "vue";
+import N from "../../../_virtual/_plugin-vue_export-helper.js";
+const v = ["disabled", "placeholder", "value"];
+function I(e, o, g, $, B, F) {
+  const p = r("IconClose"), u = r("IconHover"), f = r("FeedbackIcon");
+  return n(), t("div", {
+    class: l(e.classNames)
+  }, [
+    e.$slots.prefix ? (n(), t("div", {
+      key: 0,
+      class: l(e.className.element("prefix"))
+    }, [
+      m(e.$slots, "prefix")
+    ], 2)) : i("", !0),
+    a("div", {
+      class: l(e.className.element("input"))
+    }, [
+      a("input", k({
+        ref: "refInput",
+        disabled: e.mergedDisabled,
+        placeholder: e.placeholder,
+        class: e.className.element("start-time"),
+        value: e.displayValue
+      }, e.readonly ? { readonly: !0 } : {}, {
+        onKeydown: o[0] || (o[0] = b((...s) => e.onPressEnter && e.onPressEnter(...s), ["enter"])),
+        onInput: o[1] || (o[1] = (...s) => e.onChange && e.onChange(...s)),
+        onFocus: o[2] || (o[2] = (...s) => e.onFocus && e.onFocus(...s)),
+        onBlur: o[3] || (o[3] = (...s) => e.onBlur && e.onBlur(...s))
+      }), null, 16, v)
+    ], 2),
+    a("div", {
+      class: l(e.className.element("suffix"))
+    }, [
+      e.allowClear && !e.mergedDisabled && e.displayValue ? (n(), d(u, {
+        key: 0,
+        as: "button",
+        "aria-label": e.t("common.clearTarget", { target: e.t(e.clearTargetKey) }),
+        prefix: e.className.block,
+        class: l(e.className.element("clear-icon")),
+        onClick: e.onClear
+      }, {
+        default: y(() => [
+          C(p)
+        ]),
+        _: 1
+      }, 8, ["aria-label", "prefix", "class", "onClick"])) : i("", !0),
+      a("span", {
+        class: l(e.className.element("suffix-icon"))
+      }, [
+        m(e.$slots, "suffix-icon")
+      ], 2),
+      e.feedback ? (n(), d(f, {
+        key: 1,
+        type: e.feedback
+      }, null, 8, ["type"])) : i("", !0)
+    ], 2)
+  ], 2);
+}
+const D = /* @__PURE__ */ N(c, [["render", I]]);
+export {
+  D as default
+};

package/dist/es/components/_components/picker/input.vue2.js

@@ -0,0 +1,114 @@
+import { defineComponent as C, toRefs as z, computed as i, ref as B } from "vue";
+import { isDayjs as F, isFunction as k } from "../../../_utils/is.js";
+import x from "../../../icons/default/close-circle-fill.js";
+import D from "../icon-hover/index.vue.js";
+import { useFormItem as N } from "../../../_hooks/use-form-item.js";
+import { useLocale as _ } from "../../../locale/index.js";
+import { useSize as j } from "../../../_hooks/use-size.js";
+import E from "../feedback-icon/index.vue.js";
+import { getClassNameMixin as q } from "../../../_utils/config.js";
+const $ = C({
+  name: "DateInput",
+  components: {
+    IconHover: D,
+    IconClose: x,
+    FeedbackIcon: E
+  },
+  props: {
+    size: {
+      type: String
+    },
+    focused: {
+      type: Boolean
+    },
+    disabled: {
+      type: Boolean
+    },
+    readonly: {
+      type: Boolean
+    },
+    error: {
+      type: Boolean
+    },
+    allowClear: {
+      type: Boolean
+    },
+    placeholder: {
+      type: String
+    },
+    inputValue: {
+      type: String
+    },
+    value: {
+      type: Object
+    },
+    /**
+     * 清空按钮 aria 文案用的 locale key，由父组件按日期/时间语义传入
+     */
+    clearTargetKey: {
+      type: String,
+      default: "common.date"
+    },
+    format: {
+      type: [String, Function],
+      required: !0
+    }
+  },
+  emits: ["clear", "press-enter", "change", "focus", "blur"],
+  setup(l, { emit: s, slots: u }) {
+    const { t: f } = _(), { error: c, focused: m, disabled: p, size: d, value: o, format: n, inputValue: t } = z(l), {
+      mergedSize: g,
+      mergedDisabled: a,
+      mergedError: v,
+      feedback: y
+    } = N({ size: d, disabled: p, error: c }), { mergedSize: b } = j(g), e = q("picker"), h = i(() => [
+      e.block,
+      e.modifier(`size-${b.value}`),
+      {
+        [e.modifier("focused")]: m.value,
+        [e.modifier("disabled")]: a.value,
+        [e.modifier("error")]: v.value,
+        [e.modifier("has-prefix")]: u.prefix
+      }
+    ]), I = i(() => {
+      if (t != null && t.value) return t == null ? void 0 : t.value;
+      if (o != null && o.value && F(o.value))
+        return k(n.value) ? n.value(o.value) : o.value.format(n.value);
+    }), S = B();
+    return {
+      t: f,
+      feedback: y,
+      className: e,
+      classNames: h,
+      displayValue: I,
+      mergedDisabled: a,
+      refInput: S,
+      onPressEnter() {
+        s("press-enter");
+      },
+      onChange(r) {
+        s("change", r);
+      },
+      onFocus(r) {
+        s("focus", r);
+      },
+      onClear(r) {
+        s("clear", r);
+      },
+      onBlur(r) {
+        s("blur", r);
+      }
+    };
+  },
+  methods: {
+    focus() {
+      this.refInput && this.refInput.focus && this.refInput.focus();
+    },
+    blur() {
+      this.refInput && this.refInput.blur && this.refInput.blur();
+    }
+  }
+});
+export {
+  $ as default
+};