hys-ui 0.1.0 → 0.2.0

package/dist/components/HysRichTextEditor/HysRichTextEditor2.vue.js

@@ -1,16 +1,17 @@
-import { defineComponent as w, useModel as R, ref as s, onMounted as B, watch as A, openBlock as b, createElementBlock as p, mergeProps as N, unref as E, Fragment as S, renderList as F, createElementVNode as h, withModifiers as I, toDisplayString as O, createCommentVNode as U, createVNode as k, withCtx as g, createTextVNode as $, mergeModels as L, nextTick as D } from "vue";
-import { useHysRootAttrs as P } from "../../config.js";
-import j from "../HysModal/HysModal.vue.js";
-import q from "../HysInput/HysInput.vue.js";
-import z from "../HysButton/HysButton.vue.js";
-const G = {
+import { defineComponent as D, useModel as E, ref as m, watch as H, onActivated as U, onDeactivated as F, onBeforeUnmount as I, onMounted as O, openBlock as h, createElementBlock as L, mergeProps as $, unref as v, Fragment as P, renderList as j, createElementVNode as w, withModifiers as q, toDisplayString as z, createCommentVNode as G, createVNode as M, withCtx as x, createTextVNode as J, mergeModels as R, nextTick as K } from "vue";
+import { useHysControlState as Q } from "../../composables/formContext.js";
+import { useHysRootAttrs as W } from "../../config.js";
+import X from "../HysModal/HysModal.vue.js";
+import Y from "../HysInput/HysInput.vue.js";
+import Z from "../HysButton/HysButton.vue.js";
+const _ = {
   key: 0,
   class: "hys-ui-ent-toolbar",
   role: "toolbar",
   "aria-label": "文本格式"
-}, J = ["disabled", "onClick"], K = ["contenteditable", "data-placeholder", "aria-readonly", "aria-disabled"], _ = /* @__PURE__ */ w({
+}, ee = ["disabled", "onClick"], te = ["contenteditable", "data-placeholder", "aria-readonly", "aria-disabled"], ue = /* @__PURE__ */ D({
   __name: "HysRichTextEditor",
-  props: /* @__PURE__ */ L({
+  props: /* @__PURE__ */ R({
     disabled: { type: Boolean },
     readonly: { type: Boolean },
     placeholder: {},
@@ -19,96 +20,115 @@ const G = {
     modelValue: { default: "" },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ L(["change", "focus", "blur"], ["update:modelValue"]),
-  setup(n, { expose: M, emit: x }) {
-    const i = n, d = R(n, "modelValue"), m = x, C = P(), l = s(), u = s(!1), r = s(""), c = s(""), H = [["bold", "粗体"], ["italic", "斜体"], ["insertUnorderedList", "列表"], ["insertOrderedList", "编号"], ["createLink", "链接"], ["undo", "撤销"], ["redo", "重做"]];
-    let f = !1, v;
-    B(() => {
-      l.value && (l.value.innerHTML = d.value);
-    }), A(d, (t) => {
-      !f && l.value && l.value.innerHTML !== t && (l.value.innerHTML = t), f = !1;
+  emits: /* @__PURE__ */ R(["change", "focus", "blur"], ["update:modelValue"]),
+  setup(r, { expose: T, emit: V }) {
+    const i = r, f = E(r, "modelValue"), y = V, A = W(), n = m(), d = m(!1), s = m(""), p = m(""), { disabled: a } = Q(i), B = [["bold", "粗体"], ["italic", "斜体"], ["insertUnorderedList", "列表"], ["insertOrderedList", "编号"], ["createLink", "链接"], ["undo", "撤销"], ["redo", "重做"]];
+    let b = !1, c, u = !0, g = 0;
+    function k() {
+      g++, d.value = !1, c = void 0;
+    }
+    H(() => [a.value, i.readonly], k), U(() => {
+      u = !0;
+    }), F(() => {
+      u = !1, k();
+    }), I(() => {
+      u = !1, k();
+    }), O(() => {
+      n.value && (n.value.innerHTML = f.value);
+    }), H(f, (t) => {
+      !b && n.value && n.value.innerHTML !== t && (n.value.innerHTML = t), b = !1;
     });
-    function y() {
+    function C() {
       var t;
-      i.disabled || i.readonly || (f = !0, d.value = ((t = l.value) == null ? void 0 : t.innerHTML) || "", m("change", d.value));
+      a.value || i.readonly || (b = !0, f.value = ((t = n.value) == null ? void 0 : t.innerHTML) || "", y("change", f.value));
     }
-    function T(t) {
-      var e, o;
-      if (!(i.disabled || i.readonly)) {
+    function N(t) {
+      var o, e;
+      if (!(!u || a.value || i.readonly)) {
         if (t === "createLink") {
-          const a = window.getSelection();
-          v = a != null && a.rangeCount && ((e = l.value) != null && e.contains(a.getRangeAt(0).commonAncestorContainer)) ? a.getRangeAt(0).cloneRange() : void 0, r.value = "", c.value = "", u.value = !0;
+          const l = window.getSelection();
+          c = l != null && l.rangeCount && ((o = n.value) != null && o.contains(l.getRangeAt(0).commonAncestorContainer)) ? l.getRangeAt(0).cloneRange() : void 0, s.value = "", p.value = "", d.value = !0;
           return;
         }
-        (o = l.value) == null || o.focus(), document.execCommand(t, !1), y();
+        (e = n.value) == null || e.focus(), document.execCommand(t, !1), C();
       }
     }
-    async function V() {
-      var t;
-      if (!/^https?:\/\//i.test(r.value)) {
-        c.value = "请输入 http:// 或 https:// 链接";
+    async function S() {
+      var o;
+      if (!u || a.value || i.readonly) return;
+      if (!/^https?:\/\//i.test(s.value)) {
+        p.value = "请输入 http:// 或 https:// 链接";
         return;
       }
-      if (u.value = !1, await D(), (t = l.value) == null || t.focus(), v) {
-        const e = window.getSelection();
-        e == null || e.removeAllRanges(), e == null || e.addRange(v);
+      const t = ++g;
+      if (d.value = !1, await K(), !(!u || a.value || i.readonly || t !== g || !((o = n.value) != null && o.isConnected))) {
+        if (n.value.focus(), c && n.value.contains(c.commonAncestorContainer)) {
+          const e = window.getSelection();
+          e == null || e.removeAllRanges(), e == null || e.addRange(c);
+        } else {
+          const e = window.getSelection();
+          if (e && !n.value.contains(e.anchorNode)) {
+            const l = document.createRange();
+            l.selectNodeContents(n.value), l.collapse(!1), e.removeAllRanges(), e.addRange(l);
+          }
+        }
+        document.execCommand("createLink", !1, s.value), C();
       }
-      document.execCommand("createLink", !1, r.value), y();
     }
-    return M({ focus: () => {
+    return T({ focus: () => {
       var t;
-      return (t = l.value) == null ? void 0 : t.focus();
+      return (t = n.value) == null ? void 0 : t.focus();
     }, blur: () => {
       var t;
-      return (t = l.value) == null ? void 0 : t.blur();
+      return (t = n.value) == null ? void 0 : t.blur();
     }, getHTML: () => {
       var t;
-      return ((t = l.value) == null ? void 0 : t.innerHTML) || "";
-    } }), (t, e) => (b(), p("div", N(E(C), { class: "hys-ui-ent-panel" }), [
-      n.hideToolbar ? U("", !0) : (b(), p("div", G, [
-        (b(), p(S, null, F(H, (o) => h("button", {
-          key: o[0],
+      return ((t = n.value) == null ? void 0 : t.innerHTML) || "";
+    } }), (t, o) => (h(), L("div", $(v(A), { class: "hys-ui-ent-panel" }), [
+      r.hideToolbar ? G("", !0) : (h(), L("div", _, [
+        (h(), L(P, null, j(B, (e) => w("button", {
+          key: e[0],
           type: "button",
-          disabled: n.disabled || n.readonly,
-          onMousedown: e[0] || (e[0] = I(() => {
+          disabled: v(a) || r.readonly,
+          onMousedown: o[0] || (o[0] = q(() => {
           }, ["prevent"])),
-          onClick: (a) => T(o[0])
-        }, O(o[1]), 41, J)), 64))
+          onClick: (l) => N(e[0])
+        }, z(e[1]), 41, ee)), 64))
       ])),
-      h("div", {
+      w("div", {
         ref_key: "editor",
-        ref: l,
+        ref: n,
         class: "hys-ui-ent-editor",
-        contenteditable: !n.disabled && !n.readonly,
-        "data-placeholder": n.placeholder,
+        contenteditable: !v(a) && !r.readonly,
+        "data-placeholder": r.placeholder,
         role: "textbox",
-        "aria-readonly": n.readonly,
-        "aria-disabled": n.disabled,
+        "aria-readonly": r.readonly,
+        "aria-disabled": v(a),
         "aria-label": "富文本编辑器",
         "aria-multiline": "true",
-        onInput: y,
-        onFocus: e[1] || (e[1] = (o) => m("focus", o)),
-        onBlur: e[2] || (e[2] = (o) => m("blur", o))
-      }, null, 40, K),
-      k(j, {
-        open: u.value,
+        onInput: C,
+        onFocus: o[1] || (o[1] = (e) => y("focus", e)),
+        onBlur: o[2] || (o[2] = (e) => y("blur", e))
+      }, null, 40, te),
+      M(X, {
+        open: d.value,
         title: "插入链接",
-        onClose: e[4] || (e[4] = (o) => u.value = !1)
+        onClose: o[4] || (o[4] = (e) => d.value = !1)
       }, {
-        footer: g(() => [
-          k(z, { onClick: V }, {
-            default: g(() => [...e[5] || (e[5] = [
-              $("插入", -1)
+        footer: x(() => [
+          M(Z, { onClick: S }, {
+            default: x(() => [...o[5] || (o[5] = [
+              J("插入", -1)
             ])]),
             _: 1
           })
         ]),
-        default: g(() => [
-          k(q, {
-            modelValue: r.value,
-            "onUpdate:modelValue": e[3] || (e[3] = (o) => r.value = o),
+        default: x(() => [
+          M(Y, {
+            modelValue: s.value,
+            "onUpdate:modelValue": o[3] || (o[3] = (e) => s.value = e),
             placeholder: "https://example.com",
-            error: c.value
+            error: p.value
           }, null, 8, ["modelValue", "error"])
         ]),
         _: 1
@@ -117,5 +137,5 @@ const G = {
   }
 });
 export {
-  _ as default
+  ue as default
 };

package/dist/components/HysSearch/HysSearch.vue.js

@@ -1,7 +1,8 @@
-import { defineComponent as B, ref as V, onBeforeUnmount as k, onDeactivated as v, openBlock as i, createElementBlock as y, mergeProps as g, unref as d, createBlock as f, createElementVNode as C, withKeys as T, createVNode as x, createCommentVNode as z } from "vue";
-import { useHysRootAttrs as L } from "../../config.js";
-import { LoaderCircle as N, Search as w, X as A } from "lucide-vue-next";
-const E = ["value", "placeholder", "disabled", "readonly", "aria-label"], S = /* @__PURE__ */ B({
+import { defineComponent as L, ref as v, watch as V, onBeforeUnmount as N, onDeactivated as w, openBlock as f, createElementBlock as g, mergeProps as z, unref as n, createBlock as k, createElementVNode as H, withKeys as S, createVNode as A, createCommentVNode as D } from "vue";
+import { useHysControlState as E } from "../../composables/formContext.js";
+import { LoaderCircle as F, Search as K, X as R } from "lucide-vue-next";
+import { useHysRootAttrs as T } from "../../config.js";
+const I = ["value", "placeholder", "disabled", "readonly", "aria-label"], $ = /* @__PURE__ */ L({
   __name: "HysSearch",
   props: {
     modelValue: {},
@@ -14,59 +15,70 @@ const E = ["value", "placeholder", "disabled", "readonly", "aria-label"], S = /*
     ariaLabel: {}
   },
   emits: ["update:modelValue", "search", "clear", "focus", "blur"],
-  setup(e, { expose: b, emit: h }) {
-    const p = L(), n = e, t = h, u = V();
-    let r;
-    function s(l) {
-      clearTimeout(r), n.disabled || t("search", l);
+  setup(a, { expose: B, emit: C }) {
+    const r = a, { disabled: u, label: h } = E(r), i = C, x = T(), d = v(), s = v(!1);
+    let y, m;
+    function t() {
+      clearTimeout(y), y = void 0, m = void 0;
     }
-    function m(l) {
-      n.disabled || n.readonly || (t("update:modelValue", l), clearTimeout(r), r = setTimeout(() => s(l), n.delay));
+    function b(e) {
+      t(), u.value || i("search", e);
     }
-    return k(() => clearTimeout(r)), v(() => clearTimeout(r)), b({ focus: () => {
-      var l;
-      return (l = u.value) == null ? void 0 : l.focus();
+    function c(e) {
+      u.value || r.readonly || s.value || (t(), m = e, i("update:modelValue", e), y = setTimeout(() => b(e), Number.isFinite(r.delay) ? Math.max(0, r.delay) : 300));
+    }
+    return V(() => [u.value, r.readonly], t, { flush: "sync" }), V(() => r.modelValue, (e) => {
+      m !== void 0 && e !== m && t();
+    }), N(t), w(t), B({ focus: () => {
+      var e;
+      return (e = d.value) == null ? void 0 : e.focus();
     }, blur: () => {
-      var l;
-      return (l = u.value) == null ? void 0 : l.blur();
-    } }), (l, a) => (i(), y("div", g(d(p), { class: "hys-ui-ex-search" }), [
-      e.loading ? (i(), f(d(N), {
+      var e;
+      return (e = d.value) == null ? void 0 : e.blur();
+    } }), (e, l) => (f(), g("div", z(n(x), { class: "hys-ui-ex-search" }), [
+      a.loading ? (f(), k(n(F), {
         key: 0,
         class: "hys-ui-icon-spin",
         size: 16
-      })) : (i(), f(d(w), {
+      })) : (f(), k(n(K), {
         key: 1,
         size: 16,
         "aria-hidden": "true"
       })),
-      C("input", {
+      H("input", {
         ref_key: "input",
-        ref: u,
+        ref: d,
         type: "search",
-        value: e.modelValue,
-        placeholder: e.placeholder,
-        disabled: e.disabled,
-        readonly: e.readonly,
-        "aria-label": e.ariaLabel || "搜索",
-        onInput: a[0] || (a[0] = (o) => m(o.target.value)),
-        onKeydown: a[1] || (a[1] = T((o) => !o.isComposing && s(e.modelValue), ["enter"])),
-        onFocus: a[2] || (a[2] = (o) => t("focus", o)),
-        onBlur: a[3] || (a[3] = (o) => t("blur", o))
-      }, null, 40, E),
-      e.clearable && e.modelValue && !e.disabled && !e.readonly ? (i(), y("button", {
+        value: a.modelValue,
+        placeholder: a.placeholder,
+        disabled: n(u),
+        readonly: a.readonly,
+        "aria-label": a.ariaLabel || n(h) || "搜索",
+        onInput: l[0] || (l[0] = (o) => c(o.target.value)),
+        onCompositionstart: l[1] || (l[1] = (o) => {
+          s.value = !0, t();
+        }),
+        onCompositionend: l[2] || (l[2] = (o) => {
+          s.value = !1, c(o.target.value);
+        }),
+        onKeydown: l[3] || (l[3] = S((o) => !o.isComposing && o.keyCode !== 229 && !s.value && b(a.modelValue), ["enter"])),
+        onFocus: l[4] || (l[4] = (o) => i("focus", o)),
+        onBlur: l[5] || (l[5] = (o) => i("blur", o))
+      }, null, 40, I),
+      a.clearable && a.modelValue && !n(u) && !a.readonly ? (f(), g("button", {
         key: 2,
         type: "button",
         "aria-label": "清空搜索",
-        onClick: a[4] || (a[4] = (o) => {
-          var c;
-          m(""), t("clear"), (c = u.value) == null || c.focus();
+        onClick: l[6] || (l[6] = (o) => {
+          var p;
+          c(""), i("clear"), (p = d.value) == null || p.focus();
         })
       }, [
-        x(d(A), { size: 14 })
-      ])) : z("", !0)
+        A(n(R), { size: 14 })
+      ])) : D("", !0)
     ], 16));
   }
 });
 export {
-  S as default
+  $ as default
 };

package/dist/components/HysSegmented/HysSegmented.vue.js

@@ -1,60 +1,7 @@
-import { defineComponent as g, ref as h, openBlock as n, createElementBlock as r, mergeProps as v, unref as x, Fragment as V, renderList as A, normalizeStyle as z, normalizeClass as L, renderSlot as S, createTextVNode as w, toDisplayString as B } from "vue";
-import { useHysRootAttrs as C } from "../../config.js";
-const H = ["aria-label"], E = ["data-value", "disabled", "aria-checked", "tabindex", "onClick"], D = /* @__PURE__ */ g({
-  __name: "HysSegmented",
-  props: {
-    modelValue: {},
-    options: {},
-    disabled: { type: Boolean },
-    block: { type: Boolean },
-    size: {},
-    ariaLabel: {}
-  },
-  emits: ["update:modelValue", "change"],
-  setup(l, { emit: b }) {
-    const y = C(), d = l, s = b, u = h();
-    function c(a) {
-      var t;
-      d.disabled || (t = d.options.find((e) => e.value === a)) != null && t.disabled || (s("update:modelValue", a), s("change", a));
-    }
-    function k(a) {
-      var m, f;
-      if (!["ArrowLeft", "ArrowRight", "Home", "End"].includes(a.key) || d.disabled) return;
-      const t = d.options.filter((o) => !o.disabled);
-      if (!t.length) return;
-      a.preventDefault();
-      const e = t.findIndex((o) => o.value === d.modelValue), i = t[a.key === "Home" ? 0 : a.key === "End" ? t.length - 1 : (e + (a.key === "ArrowLeft" ? -1 : 1) + t.length) % t.length];
-      c(i.value), (f = Array.from(((m = u.value) == null ? void 0 : m.querySelectorAll("button")) || []).find((o) => o.dataset.value === i.value)) == null || f.focus();
-    }
-    return (a, t) => (n(), r("div", v({
-      ref_key: "root",
-      ref: u
-    }, x(y), {
-      class: "hys-ui-ex-segment",
-      role: "radiogroup",
-      "aria-label": l.ariaLabel || "分段选择",
-      style: { display: l.block ? "flex" : void 0 },
-      onKeydown: k
-    }), [
-      (n(!0), r(V, null, A(l.options, (e) => (n(), r("button", {
-        key: e.value,
-        "data-value": e.value,
-        type: "button",
-        role: "radio",
-        disabled: l.disabled || e.disabled,
-        "aria-checked": l.modelValue === e.value,
-        tabindex: l.modelValue === e.value ? 0 : -1,
-        class: L({ "hys-ui-active": l.modelValue === e.value }),
-        style: z({ flex: l.block ? 1 : void 0, padding: l.size === "sm" ? "5px 10px" : l.size === "lg" ? "12px 20px" : void 0 }),
-        onClick: (i) => c(e.value)
-      }, [
-        S(a.$slots, "label", { option: e }, () => [
-          w(B(e.label), 1)
-        ])
-      ], 14, E))), 128))
-    ], 16, H));
-  }
-});
+import e from "./HysSegmented2.vue.js";
+/* empty css                  */
+import o from "../../_virtual/_plugin-vue_export-helper.js";
+const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-ce15ba8e"]]);
 export {
-  D as default
+  a as default
 };