hys-ui 0.2.0 → 0.3.0

package/dist/components/HysTagInput/HysTagInput.vue.js

@@ -1,84 +1,7 @@
-import { defineComponent as V, ref as g, openBlock as m, createElementBlock as f, mergeProps as h, unref as i, Fragment as B, renderList as x, renderSlot as k, createTextVNode as C, toDisplayString as A, createVNode as D, createCommentVNode as N, withDirectives as w, createElementVNode as E, withKeys as y, vModelText as H } from "vue";
-import { useHysControlState as S } from "../../composables/formContext.js";
-import { useHysRootAttrs as T } from "../../config.js";
-import { X as j } from "lucide-vue-next";
-const K = ["aria-disabled"], O = ["disabled", "aria-label", "onClick"], R = ["placeholder", "disabled", "readonly"], L = /* @__PURE__ */ V({
-  __name: "HysTagInput",
-  props: {
-    modelValue: {},
-    max: { default: 10 },
-    placeholder: { default: "输入后按 Enter" },
-    disabled: { type: Boolean },
-    readonly: { type: Boolean },
-    addOnBlur: { type: Boolean, default: !0 },
-    separator: {},
-    beforeAdd: {}
-  },
-  emits: ["update:modelValue", "change", "add", "remove", "reject"],
-  setup(a, { emit: b }) {
-    const v = T(), l = a, d = b, r = g(""), { disabled: u } = S(l);
-    function c() {
-      if (u.value || l.readonly) return;
-      const n = r.value.trim();
-      if (!n) return;
-      const t = l.separator ? n.split(l.separator) : [n], e = [...l.modelValue];
-      for (const o of t.map((s) => s.trim()).filter(Boolean)) {
-        if (e.includes(o) || e.length >= l.max || l.beforeAdd && l.beforeAdd(o) === !1) {
-          d("reject", o);
-          continue;
-        }
-        e.push(o), d("add", o);
-      }
-      d("update:modelValue", e), d("change", e), r.value = "";
-    }
-    function p(n) {
-      if (u.value || l.readonly) return;
-      const t = l.modelValue[n], e = l.modelValue.filter((o, s) => s !== n);
-      d("update:modelValue", e), d("change", e), d("remove", t);
-    }
-    return (n, t) => (m(), f("div", h(i(v), {
-      class: "hys-ui-ex-tags",
-      "aria-disabled": i(u)
-    }), [
-      (m(!0), f(B, null, x(a.modelValue, (e, o) => (m(), f("span", {
-        key: e,
-        class: "hys-ui-ex-tag"
-      }, [
-        k(n.$slots, "tag", {
-          value: e,
-          index: o
-        }, () => [
-          C(A(e), 1)
-        ]),
-        a.readonly ? N("", !0) : (m(), f("button", {
-          key: 0,
-          type: "button",
-          disabled: i(u),
-          "aria-label": "移除 " + e,
-          onClick: (s) => p(o)
-        }, [
-          D(i(j), { size: 14 })
-        ], 8, O))
-      ]))), 128)),
-      w(E("input", {
-        "onUpdate:modelValue": t[0] || (t[0] = (e) => r.value = e),
-        placeholder: a.placeholder,
-        "aria-label": "输入标签",
-        disabled: i(u) || a.modelValue.length >= a.max,
-        readonly: a.readonly,
-        onKeydown: [
-          t[1] || (t[1] = y((e) => {
-            e.isComposing || (e.preventDefault(), c());
-          }, ["enter"])),
-          t[2] || (t[2] = y((e) => !r.value && a.modelValue.length && !e.isComposing && p(a.modelValue.length - 1), ["backspace"]))
-        ],
-        onBlur: t[3] || (t[3] = (e) => a.addOnBlur && c())
-      }, null, 40, R), [
-        [H, r.value]
-      ])
-    ], 16, K));
-  }
-});
+import o from "./HysTagInput2.vue.js";
+/* empty css                 */
+import t from "../../_virtual/_plugin-vue_export-helper.js";
+const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-c030b4f1"]]);
 export {
-  L as default
+  f as default
 };

package/dist/components/HysTagInput/HysTagInput2.vue.js

@@ -1,4 +1,398 @@
-import f from "./HysTagInput.vue.js";
+import { defineComponent as ee, ref as N, computed as g, toRaw as ae, openBlock as n, createElementBlock as u, Fragment as h, createElementVNode as f, mergeProps as y, unref as a, renderSlot as p, normalizeProps as C, guardReactiveProps as D, createCommentVNode as m, renderList as I, withModifiers as x, normalizeClass as te, createBlock as c, createTextVNode as M, toDisplayString as b, createVNode as P, withCtx as R, normalizeStyle as $, resolveDynamicComponent as le } from "vue";
+import { GripVertical as oe, X as z, LoaderCircle as ie } from "lucide-vue-next";
+import ne from "../HysPopover/HysPopover.vue.js";
+import { useHysRootAttrs as re } from "../../config.js";
+import { useTagInput as se } from "../../composables/useTagInput.js";
+const ue = ["data-status", "aria-disabled", "aria-busy"], de = {
+  key: 0,
+  class: "hys-ui-tags-affix"
+}, ve = { class: "hys-ui-tags-items" }, ge = ["data-tag-index", "draggable", "onKeydown", "onDragstart", "onDragover"], fe = ["title"], me = ["disabled", "aria-label", "onClick", "onKeydown"], pe = ["disabled", "aria-label"], ye = ["title"], ce = ["aria-label", "disabled", "onClick"], be = ["aria-label"], he = ["id", "value", "placeholder", "disabled", "readonly", "maxlength", "minlength", "autocomplete", "tabindex", "aria-label", "aria-required", "aria-invalid", "aria-describedby"], xe = ["disabled"], Te = {
+  key: 3,
+  class: "hys-ui-tags-affix"
+}, ke = ["name", "form", "value"], we = ["id"], $e = /* @__PURE__ */ ee({
+  inheritAttrs: !1,
+  __name: "HysTagInput",
+  props: {
+    modelValue: { default: void 0 },
+    defaultValue: {},
+    max: { default: 10 },
+    placeholder: { default: "输入后按 Enter" },
+    disabled: { type: Boolean },
+    readonly: { type: Boolean },
+    size: {},
+    addOnBlur: { type: Boolean, default: !0 },
+    separator: {},
+    delimiters: {},
+    trigger: {},
+    beforeAdd: {},
+    allowDuplicates: { type: Boolean },
+    caseSensitive: { type: Boolean, default: !0 },
+    trim: { type: Boolean, default: !0 },
+    clearable: { type: Boolean },
+    clearIcon: {},
+    tagTone: { default: "primary" },
+    tagEffect: { default: "light" },
+    tagRound: { type: Boolean },
+    draggable: { type: Boolean },
+    collapseTags: { type: Boolean },
+    maxCollapseTags: { default: 1 },
+    collapseTagsTooltip: { type: Boolean, default: !0 },
+    overflowHeight: { default: 240 },
+    maxTagTextLength: {},
+    maxlength: {},
+    minlength: {},
+    ariaLabel: {},
+    label: {},
+    name: {},
+    form: {},
+    autocomplete: { default: "off" },
+    autofocus: { type: Boolean },
+    tabindex: {},
+    status: {},
+    error: {},
+    validateEvent: { type: Boolean, default: !0 },
+    inputProps: {},
+    popupTransition: {},
+    popupTransitionDuration: {}
+  },
+  emits: ["update:modelValue", "change", "acceptedChange", "add", "remove", "reject", "invalid", "clear", "input", "focus", "blur", "compositionend", "reorder"],
+  setup(o, { expose: q, emit: G }) {
+    const r = o, W = G, e = se(
+      r,
+      (i, ...l) => W(i, ...l)
+    ), E = re(), T = N(), k = N(0), X = g(
+      () => r.clearIcon && typeof r.clearIcon == "object" ? ae(r.clearIcon) : r.clearIcon
+    ), J = g(
+      () => r.collapseTags ? Math.max(
+        0,
+        Math.floor(
+          Number.isFinite(r.maxCollapseTags) ? r.maxCollapseTags : 1
+        )
+      ) : e.tags.value.length
+    ), H = g(() => e.tags.value.slice(0, J.value)), s = g(() => e.tags.value.slice(H.value.length)), w = g(
+      () => Math.max(
+        0,
+        Math.min(
+          Math.max(0, s.value.length - 1),
+          Math.floor(k.value / 36) - 3
+        )
+      )
+    ), B = g(
+      () => Math.max(
+        72,
+        Math.min(
+          480,
+          Number.isFinite(r.overflowHeight) ? r.overflowHeight : 240
+        )
+      )
+    ), Q = g(
+      () => s.value.slice(
+        w.value,
+        w.value + Math.ceil(B.value / 36) + 6
+      )
+    ), L = (i) => i === "id" || i.startsWith("aria-") || ["required", "title"].includes(i), U = g(
+      () => Object.fromEntries(
+        Object.entries(e.attrs).filter(([i]) => !L(i))
+      )
+    ), Y = g(
+      () => Object.fromEntries(
+        Object.entries(e.attrs).filter(([i]) => L(i))
+      )
+    );
+    function F(i, l) {
+      return {
+        value: i,
+        index: l,
+        disabled: e.control.disabled.value,
+        readonly: !!r.readonly,
+        remove: () => e.remove(l)
+      };
+    }
+    function Z(i) {
+      return r.maxTagTextLength !== void 0 && Number.isFinite(r.maxTagTextLength) && i.length > Math.max(0, r.maxTagTextLength) ? i.slice(0, Math.max(0, r.maxTagTextLength)) + "…" : i;
+    }
+    function _(i) {
+      i.target.closest("button,a,input,[data-tag-index]") || e.focus();
+    }
+    return q({
+      element: e.element,
+      input: e.input,
+      values: e.values,
+      draft: e.draft,
+      pending: e.pending,
+      focus: e.focus,
+      blur: () => {
+        var i;
+        return (i = e.input.value) == null ? void 0 : i.blur();
+      },
+      add: (i) => e.add(i),
+      remove: e.remove,
+      clear: e.clear,
+      move: e.move,
+      setDraft: e.setDraft
+    }), (i, l) => {
+      var K, O, S, V;
+      return n(), u(h, null, [
+        f("div", y({ ...a(E), ...U.value }, {
+          ref: (t) => a(e).element.value = t,
+          class: ["hys-ui-ex-tags hys-ui-tag-input", [
+            "hys-ui-tag-input-" + a(e).control.size.value,
+            "hys-ui-tags-" + o.tagTone,
+            "hys-ui-tags-" + o.tagEffect,
+            {
+              "hys-ui-tag-input-disabled": a(e).control.disabled.value,
+              "hys-ui-tag-input-readonly": o.readonly,
+              "hys-ui-tag-input-focused": a(e).focused.value,
+              "hys-ui-tags-round": o.tagRound
+            }
+          ]],
+          "data-status": a(e).status.value,
+          "aria-disabled": a(e).control.disabled.value || void 0,
+          "aria-busy": a(e).pending.value || void 0,
+          onClick: _,
+          onFocusin: l[14] || (l[14] = //@ts-ignore
+          (...t) => a(e).focusIn && a(e).focusIn(...t)),
+          onFocusout: l[15] || (l[15] = (t) => {
+            var v;
+            return a(e).focusOut(t, (v = T.value) == null ? void 0 : v.element);
+          })
+        }), [
+          i.$slots.prefix ? (n(), u("span", de, [
+            p(i.$slots, "prefix", C(D(a(e).context.value)), void 0, !0)
+          ])) : m("", !0),
+          f("div", ve, [
+            (n(!0), u(h, null, I(H.value, (t) => {
+              var v, j, A;
+              return n(), u("span", {
+                key: t.key,
+                class: te(["hys-ui-ex-tag hys-ui-tag-item", {
+                  "hys-ui-tag-dragging": ((v = a(e).drag.value) == null ? void 0 : v.index) === t.index,
+                  "hys-ui-tag-drop-before": ((j = a(e).drop.value) == null ? void 0 : j.index) === t.index && !a(e).drop.value.after,
+                  "hys-ui-tag-drop-after": ((A = a(e).drop.value) == null ? void 0 : A.index) === t.index && a(e).drop.value.after
+                }]),
+                "data-tag-index": t.index,
+                tabindex: "-1",
+                draggable: o.draggable && !a(e).control.disabled.value && !o.readonly && !a(e).pending.value,
+                onKeydown: x((d) => a(e).tagKey(d, t.index), ["self"]),
+                onDragstart: (d) => a(e).dragStart(d, t.index),
+                onDragover: (d) => a(e).dragOver(d, t.index),
+                onDrop: l[1] || (l[1] = //@ts-ignore
+                (...d) => a(e).dragDrop && a(e).dragDrop(...d)),
+                onDragend: l[2] || (l[2] = //@ts-ignore
+                (...d) => a(e).stopDrag && a(e).stopDrag(...d))
+              }, [
+                o.draggable ? (n(), c(a(oe), {
+                  key: 0,
+                  class: "hys-ui-tag-grip",
+                  size: 12,
+                  "aria-hidden": "true"
+                })) : m("", !0),
+                f("span", {
+                  class: "hys-ui-tag-label",
+                  title: t.value
+                }, [
+                  p(i.$slots, "tag", y({ ref_for: !0 }, F(t.value, t.index)), () => [
+                    M(b(Z(t.value)), 1)
+                  ], !0)
+                ], 8, fe),
+                o.readonly ? m("", !0) : (n(), u("button", {
+                  key: 1,
+                  type: "button",
+                  class: "hys-ui-tag-remove",
+                  disabled: a(e).control.disabled.value,
+                  "aria-label": "移除 " + t.value,
+                  onMousedown: l[0] || (l[0] = x(() => {
+                  }, ["prevent"])),
+                  onClick: x((d) => a(e).remove(t.index), ["stop"]),
+                  onKeydown: (d) => a(e).tagKey(d, t.index)
+                }, [
+                  p(i.$slots, "remove-icon", y({ ref_for: !0 }, F(t.value, t.index)), () => [
+                    P(a(z), {
+                      size: 12,
+                      "aria-hidden": "true"
+                    })
+                  ], !0)
+                ], 40, me))
+              ], 42, ge);
+            }), 128)),
+            s.value.length && o.collapseTagsTooltip ? (n(), c(ne, {
+              key: 0,
+              ref_key: "overflowApi",
+              ref: T,
+              trigger: "click",
+              placement: "bottom-start",
+              width: 280,
+              disabled: a(e).control.disabled.value,
+              "popup-transition": o.popupTransition,
+              "popup-transition-duration": o.popupTransitionDuration,
+              title: "更多标签",
+              onHide: l[6] || (l[6] = (t) => k.value = 0)
+            }, {
+              trigger: R(() => [
+                f("button", {
+                  type: "button",
+                  class: "hys-ui-tag-overflow-trigger",
+                  disabled: a(e).control.disabled.value,
+                  "aria-label": "查看其余 " + s.value.length + " 个标签"
+                }, [
+                  p(i.$slots, "collapse-tag", {
+                    count: s.value.length,
+                    values: s.value.map((t) => t.value)
+                  }, () => [
+                    M("+" + b(s.value.length), 1)
+                  ], !0)
+                ], 8, pe)
+              ]),
+              default: R(() => [
+                f("div", {
+                  class: "hys-ui-tag-overflow",
+                  style: $({
+                    maxHeight: B.value + "px",
+                    height: Math.min(s.value.length * 36, B.value) + "px"
+                  }),
+                  role: "group",
+                  "aria-label": "折叠标签",
+                  onScroll: l[3] || (l[3] = (t) => k.value = t.target.scrollTop),
+                  onFocusin: l[4] || (l[4] = //@ts-ignore
+                  (...t) => a(e).focusIn && a(e).focusIn(...t)),
+                  onFocusout: l[5] || (l[5] = (t) => {
+                    var v;
+                    return a(e).focusOut(t, (v = T.value) == null ? void 0 : v.element);
+                  })
+                }, [
+                  f("div", {
+                    style: $({
+                      height: s.value.length * 36 + "px",
+                      position: "relative"
+                    })
+                  }, [
+                    f("div", {
+                      style: $({
+                        position: "absolute",
+                        left: 0,
+                        right: 0,
+                        top: w.value * 36 + "px"
+                      })
+                    }, [
+                      (n(!0), u(h, null, I(Q.value, (t) => (n(), u("div", {
+                        key: t.key,
+                        class: "hys-ui-tag-overflow-row"
+                      }, [
+                        f("span", {
+                          title: t.value
+                        }, b(t.value), 9, ye),
+                        o.readonly ? m("", !0) : (n(), u("button", {
+                          key: 0,
+                          type: "button",
+                          "aria-label": "移除 " + t.value,
+                          disabled: a(e).control.disabled.value,
+                          onClick: (v) => a(e).remove(t.index)
+                        }, [
+                          P(a(z), {
+                            size: 14,
+                            "aria-hidden": "true"
+                          })
+                        ], 8, ce))
+                      ]))), 128))
+                    ], 4)
+                  ], 4)
+                ], 36)
+              ]),
+              _: 3
+            }, 8, ["disabled", "popup-transition", "popup-transition-duration"])) : s.value.length ? (n(), u("span", {
+              key: 1,
+              class: "hys-ui-tag-overflow-trigger",
+              "aria-label": "另有 " + s.value.length + " 个标签"
+            }, [
+              p(i.$slots, "collapse-tag", {
+                count: s.value.length,
+                values: s.value.map((t) => t.value)
+              }, () => [
+                M("+" + b(s.value.length), 1)
+              ], !0)
+            ], 8, be)) : m("", !0),
+            f("input", y({
+              ref: (t) => a(e).input.value = t
+            }, { ...o.inputProps, ...Y.value }, {
+              class: "hys-ui-tags-native",
+              type: "text",
+              id: a(e).attrs.id || ((K = a(e).field) == null ? void 0 : K.id.value),
+              "data-hys-ui-field-managed": "",
+              value: a(e).draft.value,
+              placeholder: o.readonly ? "" : o.placeholder,
+              disabled: a(e).control.disabled.value,
+              readonly: o.readonly,
+              maxlength: o.maxlength,
+              minlength: o.minlength,
+              autocomplete: o.autocomplete,
+              tabindex: o.tabindex,
+              "aria-label": o.ariaLabel || a(e).attrs["aria-label"] || o.label || ((O = a(e).field) == null ? void 0 : O.label.value) || "输入标签",
+              "aria-required": ((S = a(e).field) == null ? void 0 : S.required.value) || void 0,
+              "aria-invalid": a(e).status.value === "error" || void 0,
+              "aria-describedby": [
+                a(e).attrs["aria-describedby"],
+                (V = a(e).field) == null ? void 0 : V.describedBy.value,
+                o.error ? a(e).errorId : void 0
+              ].filter(Boolean).join(" ") || void 0,
+              onInput: l[7] || (l[7] = //@ts-ignore
+              (...t) => a(e).nativeInput && a(e).nativeInput(...t)),
+              onKeydown: l[8] || (l[8] = //@ts-ignore
+              (...t) => a(e).key && a(e).key(...t)),
+              onPaste: l[9] || (l[9] = //@ts-ignore
+              (...t) => a(e).pasted && a(e).pasted(...t)),
+              onCompositionstart: l[10] || (l[10] = (t) => a(e).composing.value = !0),
+              onCompositionend: l[11] || (l[11] = //@ts-ignore
+              (...t) => a(e).compositionEnd && a(e).compositionEnd(...t))
+            }), null, 16, he)
+          ]),
+          a(e).pending.value ? (n(), c(a(ie), {
+            key: 1,
+            class: "hys-ui-tag-spinner",
+            size: 16,
+            "aria-hidden": "true"
+          })) : o.clearable && !o.readonly && (a(e).values.value.length || a(e).draft.value) ? (n(), u("button", {
+            key: 2,
+            type: "button",
+            class: "hys-ui-tags-clear",
+            disabled: a(e).control.disabled.value,
+            "aria-label": "清空标签",
+            onMousedown: l[12] || (l[12] = x(() => {
+            }, ["prevent"])),
+            onClick: l[13] || (l[13] = //@ts-ignore
+            (...t) => a(e).clear && a(e).clear(...t))
+          }, [
+            p(i.$slots, "clear-icon", C(D(a(e).context.value)), () => [
+              o.clearIcon ? (n(), c(le(X.value), {
+                key: 0,
+                size: 14,
+                "aria-hidden": "true"
+              })) : (n(), c(a(z), {
+                key: 1,
+                size: 14,
+                "aria-hidden": "true"
+              }))
+            ], !0)
+          ], 40, xe)) : m("", !0),
+          i.$slots.suffix ? (n(), u("span", Te, [
+            p(i.$slots, "suffix", C(D(a(e).context.value)), void 0, !0)
+          ])) : m("", !0),
+          (n(!0), u(h, null, I(o.name && !a(e).control.disabled.value ? a(e).values.value : [], (t, v) => (n(), u("input", {
+            key: v,
+            type: "hidden",
+            name: o.name,
+            form: o.form,
+            value: t
+          }, null, 8, ke))), 128))
+        ], 16, ue),
+        o.error ? (n(), u("small", y({ key: 0 }, a(E), {
+          id: a(e).errorId,
+          class: "hys-ui-tags-error",
+          role: "alert"
+        }), b(o.error), 17, we)) : m("", !0)
+      ], 64);
+    };
+  }
+});
 export {
-  f as default
+  $e as default
 };

package/dist/components/HysTimeline/HysTimeline.vue.js

@@ -1,7 +1,7 @@
 import o from "./HysTimeline2.vue.js";
 /* empty css                 */
 import t from "../../_virtual/_plugin-vue_export-helper.js";
-const c = /* @__PURE__ */ t(o, [["__scopeId", "data-v-ff6c14c6"]]);
+const e = /* @__PURE__ */ t(o, [["__scopeId", "data-v-9c4b5dcf"]]);
 export {
-  c as default
+  e as default
 };