hys-ui 0.1.0 → 0.2.0

package/dist/components/HysBadge/HysBadge2.vue.js

@@ -1,43 +1,171 @@
-import { defineComponent as y, openBlock as t, createElementBlock as o, mergeProps as c, unref as l, createElementVNode as f, normalizeStyle as b, normalizeClass as n, renderSlot as v, withModifiers as g, createVNode as h, createCommentVNode as s, toDisplayString as B } from "vue";
-import { useHysRootAttrs as x } from "../../config.js";
-import { X as z } from "lucide-vue-next";
-const S = /* @__PURE__ */ y({
+import { defineComponent as E, ref as H, computed as d, onDeactivated as L, onBeforeUnmount as R, onActivated as Z, openBlock as l, createElementBlock as o, mergeProps as q, unref as h, Fragment as x, createElementVNode as M, normalizeStyle as y, normalizeClass as g, renderSlot as i, createTextVNode as S, toDisplayString as v, createCommentVNode as b, withModifiers as w, createBlock as P, nextTick as U } from "vue";
+import { X } from "lucide-vue-next";
+import { useHysRootAttrs as j } from "../../config.js";
+const G = {
+  key: 0,
+  class: "hys-ui-badge-status-text"
+}, I = ["aria-pressed", "disabled"], J = ["disabled", "aria-label"], K = { key: 0 }, O = ["title"], p = /* @__PURE__ */ E({
   __name: "HysBadge",
   props: {
     tone: { default: "blue" },
     size: { default: "md" },
     round: { type: Boolean },
     closable: { type: Boolean },
+    closeText: {},
+    closeLabel: { default: "关闭标签" },
     dot: { type: Boolean },
     value: {},
     max: { default: 99 },
-    showZero: { type: Boolean }
+    showZero: { type: Boolean },
+    hidden: { type: Boolean },
+    color: {},
+    offset: {},
+    placement: { default: "top-right" },
+    badgeStyle: {},
+    badgeClass: {},
+    status: {},
+    text: {},
+    title: {},
+    effect: { default: "light" },
+    checkable: { type: Boolean },
+    checked: { type: Boolean, default: void 0 },
+    defaultChecked: { type: Boolean, default: !1 },
+    disabled: { type: Boolean }
   },
-  emits: ["close"],
-  setup(e, { emit: u }) {
-    const d = x(), i = u;
-    return (r, a) => (t(), o("span", c(l(d), { class: "hys-ui-badge-wrap" }), [
-      f("span", {
-        class: n(["hys-ui-badge", "hys-ui-badge-" + e.tone]),
-        style: b({ borderRadius: e.round ? "99px" : void 0, fontSize: e.size === "sm" ? "10px" : void 0 })
-      }, [
-        v(r.$slots, "default", {}, void 0, !0),
-        e.closable ? (t(), o("button", {
+  emits: ["close", "update:checked", "change"],
+  setup(t, { emit: z }) {
+    const e = t, f = z, m = j(), k = H(e.defaultChecked), u = d(() => e.checked ?? k.value), B = d(
+      () => typeof e.value == "number" && Number.isFinite(e.value) && e.value > e.max ? e.max + "+" : e.value
+    ), N = d(
+      () => !e.hidden && (e.dot || e.value !== void 0 && e.value !== "" && (typeof e.value != "number" || Number.isFinite(e.value)) && (e.value !== 0 || e.showZero))
+    ), T = d(
+      () => e.color ?? {
+        blue: "#2563eb",
+        green: "#06966c",
+        orange: "#b85f06",
+        red: "#d92d44",
+        purple: "#7945d5",
+        gray: "#68778e"
+      }[e.tone]
+    ), V = d(() => ({
+      "--hys-ui-badge-tag-color": T.value,
+      borderRadius: e.round ? "99px" : void 0,
+      background: e.color && e.effect === "light" && (!e.checkable || u.value) ? `color-mix(in srgb, ${e.color} 12%, transparent)` : void 0,
+      color: e.color && e.effect === "light" && (!e.checkable || u.value) ? e.color : void 0
+    })), F = d(() => {
+      var a, s, r, $;
+      return {
+        background: e.color,
+        "--hys-ui-badge-offset-x": typeof ((a = e.offset) == null ? void 0 : a[0]) == "number" ? e.offset[0] + "px" : (s = e.offset) == null ? void 0 : s[0],
+        "--hys-ui-badge-offset-y": typeof ((r = e.offset) == null ? void 0 : r[1]) == "number" ? e.offset[1] + "px" : ($ = e.offset) == null ? void 0 : $[1],
+        ...e.badgeStyle
+      };
+    }), C = d(
+      () => e.color ?? {
+        success: "#06966c",
+        processing: "var(--hys-ui-primary,var(--hys-ui-theme-primary,#2563eb))",
+        default: "#8794a8",
+        error: "#d92d44",
+        warning: "#d9860c"
+      }[e.status ?? "default"]
+    );
+    let c = !0, n = 0;
+    async function A(a) {
+      if (!c || e.disabled || !e.checkable) return;
+      const s = !u.value, r = ++n;
+      k.value = s, f("update:checked", s), await U(), c && r === n && u.value === s && f("change", s, a);
+    }
+    function D(a) {
+      e.disabled || f("close", a);
+    }
+    return L(() => {
+      c = !1, n++;
+    }), R(() => {
+      c = !1, n++;
+    }), Z(() => c = !0), (a, s) => (l(), o("span", q(h(m), {
+      class: ["hys-ui-badge-wrap", [
+        "hys-ui-badge-size-" + t.size,
+        { "hys-ui-badge-disabled": t.disabled }
+      ]]
+    }), [
+      t.status ? (l(), o(x, { key: 0 }, [
+        M("span", {
+          class: g(["hys-ui-badge-status-dot", {
+            "hys-ui-badge-processing": t.status === "processing" && h(m)["data-hys-motion"] !== "off"
+          }]),
+          style: y({ background: C.value, color: C.value }),
+          "aria-hidden": "true"
+        }, null, 6),
+        t.text || a.$slots.default ? (l(), o("span", G, [
+          i(a.$slots, "default", {}, () => [
+            S(v(t.text), 1)
+          ], !0)
+        ])) : b("", !0)
+      ], 64)) : (l(), o(x, { key: 1 }, [
+        a.$slots.default || t.closable || t.checkable ? (l(), o("span", {
           key: 0,
-          type: "button",
-          "aria-label": "关闭标签",
-          onClick: a[0] || (a[0] = g((m) => i("close", m), ["stop"]))
+          class: g(["hys-ui-badge", [
+            "hys-ui-badge-" + t.tone,
+            "hys-ui-badge-" + t.effect,
+            {
+              "hys-ui-badge-content": t.dot || t.value !== void 0 || !!a.$slots.content,
+              "hys-ui-badge-checkable": t.checkable,
+              "hys-ui-badge-checked": t.checkable && u.value
+            }
+          ]]),
+          style: y(V.value)
         }, [
-          h(l(z), { size: 12 })
-        ])) : s("", !0)
-      ], 6),
-      e.dot || e.value !== void 0 && (e.value !== 0 || e.showZero) ? (t(), o("sup", {
-        key: 0,
-        class: n(["hys-ui-badge-counter", { "hys-ui-badge-dot": e.dot }])
-      }, B(e.dot ? "" : typeof e.value == "number" && e.value > e.max ? e.max + "+" : e.value), 3)) : s("", !0)
+          t.checkable ? (l(), o("button", {
+            key: 0,
+            type: "button",
+            class: "hys-ui-badge-check",
+            "aria-pressed": u.value,
+            disabled: t.disabled,
+            onClick: w(A, ["stop"])
+          }, [
+            i(a.$slots, "default", {}, void 0, !0)
+          ], 8, I)) : i(a.$slots, "default", {}, void 0, !0, 1),
+          t.closable ? (l(), o("button", {
+            key: 2,
+            type: "button",
+            class: "hys-ui-badge-close",
+            disabled: t.disabled,
+            "aria-label": t.closeLabel,
+            onClick: w(D, ["stop"])
+          }, [
+            i(a.$slots, "close-icon", {}, () => [
+              t.closeText ? (l(), o("span", K, v(t.closeText), 1)) : (l(), P(h(X), {
+                key: 1,
+                size: 12,
+                "aria-hidden": "true"
+              }))
+            ], !0)
+          ], 8, J)) : b("", !0)
+        ], 6)) : b("", !0),
+        !t.hidden && (N.value || a.$slots.content) ? (l(), o("sup", {
+          key: 1,
+          class: g(["hys-ui-badge-counter", [
+            t.badgeClass,
+            "hys-ui-badge-" + t.placement,
+            {
+              "hys-ui-badge-dot": t.dot,
+              "hys-ui-badge-standalone": !a.$slots.default && !t.closable && !t.checkable
+            }
+          ]]),
+          style: y(F.value),
+          title: t.title ?? (t.value === void 0 ? void 0 : String(t.value))
+        }, [
+          i(a.$slots, "content", {
+            value: t.value,
+            displayValue: B.value
+          }, () => [
+            S(v(t.dot ? "" : B.value), 1)
+          ], !0)
+        ], 14, O)) : b("", !0)
+      ], 64))
     ], 16));
   }
 });
 export {
-  S as default
+  p as default
 };

package/dist/components/HysBreadcrumb/HysBreadcrumb.vue.js

@@ -1,40 +1,7 @@
-import { defineComponent as u, openBlock as t, createElementBlock as o, mergeProps as m, unref as h, createElementVNode as l, Fragment as d, renderList as f, renderSlot as c, createTextVNode as p, toDisplayString as s, createCommentVNode as y } from "vue";
-import { useHysRootAttrs as b } from "../../config.js";
-const g = { class: "hys-ui-ex-breadcrumb" }, k = {
-  key: 0,
-  "aria-hidden": "true"
-}, _ = ["href"], v = ["aria-current"], A = /* @__PURE__ */ u({
-  __name: "HysBreadcrumb",
-  props: {
-    separator: {},
-    items: {}
-  },
-  setup(a) {
-    const i = b();
-    return (n, B) => (t(), o("nav", m(h(i), { "aria-label": "面包屑" }), [
-      l("ol", g, [
-        (t(!0), o(d, null, f(a.items, (e, r) => (t(), o("li", { key: r }, [
-          r ? (t(), o("span", k, [
-            c(n.$slots, "separator", {}, () => [
-              p(s(a.separator || "/"), 1)
-            ])
-          ])) : y("", !0),
-          e.href && r !== a.items.length - 1 ? c(n.$slots, "link", {
-            item: e,
-            index: r
-          }, () => [
-            l("a", {
-              href: e.href
-            }, s(e.label), 9, _)
-          ], void 0, 1) : (t(), o("span", {
-            key: 2,
-            "aria-current": r === a.items.length - 1 ? "page" : void 0
-          }, s(e.label), 9, v))
-        ]))), 128))
-      ])
-    ], 16));
-  }
-});
+import o from "./HysBreadcrumb2.vue.js";
+/* empty css                   */
+import r from "../../_virtual/_plugin-vue_export-helper.js";
+const c = /* @__PURE__ */ r(o, [["__scopeId", "data-v-fb612ec6"]]);
 export {
-  A as default
+  c as default
 };

package/dist/components/HysBreadcrumb/HysBreadcrumb2.vue.js

@@ -1,4 +1,76 @@
-import f from "./HysBreadcrumb.vue.js";
+import { defineComponent as y, openBlock as s, createElementBlock as o, mergeProps as k, unref as g, createElementVNode as u, Fragment as i, renderList as p, renderSlot as l, createBlock as B, resolveDynamicComponent as C, createTextVNode as n, toDisplayString as c, createCommentVNode as v } from "vue";
+import { useHysRootAttrs as S } from "../../config.js";
+const $ = ["aria-label"], I = { class: "hys-ui-ex-breadcrumb" }, L = {
+  key: 0,
+  class: "hys-ui-breadcrumb-separator",
+  "aria-hidden": "true"
+}, N = ["href", "target", "rel", "onClick"], R = ["aria-disabled", "aria-current"], D = /* @__PURE__ */ y({
+  __name: "HysBreadcrumb",
+  props: {
+    separator: { default: "/" },
+    separatorIcon: {},
+    items: {},
+    ariaLabel: { default: "面包屑" }
+  },
+  emits: ["select"],
+  setup(a, { emit: d }) {
+    const h = d, b = S();
+    function f(t) {
+      return t.target === "_blank" ? [...new Set((t.rel || "").split(/\s+/).filter(Boolean).concat("noopener", "noreferrer"))].join(" ") : t.rel;
+    }
+    return (t, V) => (s(), o("nav", k(g(b), { "aria-label": a.ariaLabel }), [
+      u("ol", I, [
+        (s(!0), o(i, null, p(a.items, (e, r) => (s(), o("li", { key: r }, [
+          r && e.showSeparator !== !1 ? (s(), o("span", L, [
+            l(t.$slots, "separator", {
+              item: e,
+              index: r
+            }, () => [
+              a.separatorIcon ? (s(), B(C(a.separatorIcon), {
+                key: 0,
+                size: 14
+              })) : (s(), o(i, { key: 1 }, [
+                n(c(e.separator ?? a.separator), 1)
+              ], 64))
+            ], !0)
+          ])) : v("", !0),
+          e.href && !e.disabled && r !== a.items.length - 1 ? l(t.$slots, "link", {
+            item: e,
+            index: r
+          }, () => [
+            u("a", {
+              href: e.href,
+              target: e.target,
+              rel: f(e),
+              onClick: (m) => h("select", e, r, m)
+            }, [
+              l(t.$slots, "item", {
+                item: e,
+                index: r,
+                current: !1
+              }, () => [
+                n(c(e.label), 1)
+              ], !0)
+            ], 8, N)
+          ], !0, 1) : (s(), o("span", {
+            key: 2,
+            class: "hys-ui-breadcrumb-item",
+            "aria-disabled": e.disabled || void 0,
+            "aria-current": r === a.items.length - 1 ? "page" : void 0
+          }, [
+            l(t.$slots, "item", {
+              item: e,
+              index: r,
+              current: r === a.items.length - 1
+            }, () => [
+              n(c(e.label), 1)
+            ], !0)
+          ], 8, R))
+        ]))), 128))
+      ])
+    ], 16, $));
+  }
+});
 export {
-  f as default
+  D as default
 };

package/dist/components/HysButton/HysButton.vue.js

@@ -1,7 +1,7 @@
 import o from "./HysButton2.vue.js";
 /* empty css               */
 import t from "../../_virtual/_plugin-vue_export-helper.js";
-const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-b6f996fc"]]);
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-646a4efb"]]);
 export {
-  p as default
+  m as default
 };

package/dist/components/HysButton/HysButton2.vue.js

@@ -1,20 +1,21 @@
-import { defineComponent as B, ref as $, computed as c, openBlock as a, createBlock as u, resolveDynamicComponent as r, mergeProps as C, unref as d, withCtx as z, createElementBlock as s, renderSlot as i, createVNode as P, createCommentVNode as y } from "vue";
-import { LoaderCircle as L } from "lucide-vue-next";
+import { defineComponent as $, ref as z, computed as d, openBlock as i, createBlock as u, resolveDynamicComponent as r, mergeProps as P, unref as s, withCtx as D, createElementBlock as c, renderSlot as a, createVNode as H, createCommentVNode as y } from "vue";
+import { useHysControlState as L } from "../../composables/formContext.js";
+import { LoaderCircle as S } from "lucide-vue-next";
 import { useHysRootAttrs as w } from "../../config.js";
 const A = {
   key: 0,
   class: "hys-ui-button-icon"
-}, D = {
+}, N = {
   key: 1,
   class: "hys-ui-button-icon"
-}, H = {
+}, R = {
   key: 2,
   class: "hys-ui-button-icon"
-}, E = /* @__PURE__ */ B({
+}, q = /* @__PURE__ */ $({
   __name: "HysButton",
   props: {
     variant: { default: "primary" },
-    size: { default: "md" },
+    size: {},
     disabled: { type: Boolean },
     loading: { type: Boolean },
     plain: { type: Boolean },
@@ -35,14 +36,14 @@ const A = {
     ariaLabel: {}
   },
   emits: ["click"],
-  setup(e, { expose: f, emit: h }) {
-    const n = e, b = h, m = w(), l = $(), o = c(() => n.disabled || n.loading), v = { danger: "#ed4556", success: "#16a46e", warning: "#d9860c", info: "#697b97" }, k = c(() => n.color || v[n.variant] || "var(--hys-ui-primary,var(--hys-ui-theme-primary))");
-    function g(t) {
+  setup(e, { expose: f, emit: b }) {
+    const n = e, { disabled: h, size: m } = L(n), v = b, k = w(), l = z(), o = d(() => h.value || n.loading), g = { danger: "#ed4556", success: "#16a46e", warning: "#d9860c", info: "#697b97" }, B = d(() => n.color || g[n.variant] || "var(--hys-ui-primary,var(--hys-ui-theme-primary))");
+    function C(t) {
       if (o.value) {
         t.preventDefault(), t.stopImmediatePropagation();
         return;
       }
-      b("click", t);
+      v("click", t);
     }
     return f({ element: l, focus: () => {
       var t;
@@ -50,12 +51,12 @@ const A = {
     }, blur: () => {
       var t;
       return (t = l.value) == null ? void 0 : t.blur();
-    } }), (t, N) => (a(), u(r(e.href ? "a" : "button"), C({
+    } }), (t, T) => (i(), u(r(e.href ? "a" : "button"), P({
       ref_key: "element",
       ref: l
-    }, d(m), {
-      class: ["hys-ui-btn", ["hys-ui-btn-" + e.size, "hys-ui-button-" + e.variant, { "hys-ui-button-plain": e.plain, "hys-ui-button-round": e.round, "hys-ui-button-circle": e.circle, "hys-ui-button-block": e.block, "hys-ui-button-dashed": e.dashed, "hys-ui-button-locked": o.value }]],
-      style: { "--hys-ui-button-color": k.value },
+    }, s(k), {
+      class: ["hys-ui-btn", ["hys-ui-btn-" + s(m), "hys-ui-button-" + e.variant, { "hys-ui-button-plain": e.plain, "hys-ui-button-round": e.round, "hys-ui-button-circle": e.circle, "hys-ui-button-block": e.block, "hys-ui-button-dashed": e.dashed, "hys-ui-button-locked": o.value }]],
+      style: { "--hys-ui-button-color": B.value },
       type: e.href ? void 0 : e.nativeType || e.type,
       href: o.value ? void 0 : e.href,
       role: e.href ? "link" : void 0,
@@ -67,40 +68,40 @@ const A = {
       "aria-label": e.ariaLabel,
       tabindex: o.value || !e.focusable ? -1 : void 0,
       autofocus: e.autofocus,
-      onClick: g
+      onClick: C
     }), {
-      default: z(() => [
-        e.loading ? (a(), s("span", A, [
-          i(t.$slots, "loading", {}, () => [
-            P(d(L), {
+      default: D(() => [
+        e.loading ? (i(), c("span", A, [
+          a(t.$slots, "loading", {}, () => [
+            H(s(S), {
               class: "hys-ui-button-spinner",
               size: 16,
               "aria-hidden": "true"
             })
           ], !0)
-        ])) : (e.icon || t.$slots.icon) && e.iconPosition === "left" ? (a(), s("span", D, [
-          i(t.$slots, "icon", {}, () => [
-            (a(), u(r(e.icon), {
+        ])) : (e.icon || t.$slots.icon) && e.iconPosition === "left" ? (i(), c("span", N, [
+          a(t.$slots, "icon", {}, () => [
+            (i(), u(r(e.icon), {
               size: 16,
               "aria-hidden": "true"
             }))
           ], !0)
         ])) : y("", !0),
-        i(t.$slots, "default", {}, void 0, !0),
-        !e.loading && (e.icon || t.$slots.icon) && e.iconPosition === "right" ? (a(), s("span", H, [
-          i(t.$slots, "icon", {}, () => [
-            (a(), u(r(e.icon), {
+        a(t.$slots, "default", {}, void 0, !0),
+        !e.loading && (e.icon || t.$slots.icon) && e.iconPosition === "right" ? (i(), c("span", R, [
+          a(t.$slots, "icon", {}, () => [
+            (i(), u(r(e.icon), {
               size: 16,
               "aria-hidden": "true"
             }))
           ], !0)
         ])) : y("", !0),
-        i(t.$slots, "suffix", {}, void 0, !0)
+        a(t.$slots, "suffix", {}, void 0, !0)
       ]),
       _: 3
     }, 16, ["class", "style", "type", "href", "role", "target", "rel", "disabled", "aria-disabled", "aria-busy", "aria-label", "tabindex", "autofocus"]));
   }
 });
 export {
-  E as default
+  q as default
 };

package/dist/components/HysCalendar/HysCalendar.vue.js

@@ -1,86 +1,7 @@
-import { defineComponent as A, ref as p, computed as C, openBlock as a, createElementBlock as l, mergeProps as F, unref as y, createElementVNode as i, createVNode as $, toDisplayString as c, Fragment as h, renderList as b, renderSlot as N, createTextVNode as R, createCommentVNode as x } from "vue";
-import { useHysRootAttrs as z } from "../../config.js";
-import { ChevronLeft as B, ChevronRight as E } from "lucide-vue-next";
-const H = { class: "hys-ui-ent-toolbar" }, L = { class: "hys-ui-ent-calendar" }, M = ["disabled", "aria-pressed", "onClick"], Y = ["onClick"], G = /* @__PURE__ */ A({
-  __name: "HysCalendar",
-  props: {
-    modelValue: {},
-    events: {},
-    disabledDate: { type: Function }
-  },
-  emits: ["update:modelValue", "select", "event"],
-  setup(d, { emit: D }) {
-    const V = z(), m = D, f = /* @__PURE__ */ new Date(), o = p(f.getFullYear()), r = p(f.getMonth()), S = C(() => `${o.value}年${r.value + 1}月`), w = C(() => {
-      const n = (new Date(o.value, r.value, 1).getDay() + 6) % 7, t = new Date(o.value, r.value + 1, 0).getDate();
-      return [...Array(n).fill(null), ...Array.from({ length: t }, (e, v) => v + 1)];
-    });
-    function g(n) {
-      const t = new Date(o.value, r.value + n, 1);
-      o.value = t.getFullYear(), r.value = t.getMonth();
-    }
-    function s(n) {
-      return `${o.value}-${String(r.value + 1).padStart(2, "0")}-${String(n).padStart(2, "0")}`;
-    }
-    return (n, t) => (a(), l("section", F(y(V), { class: "hys-ui-ent-panel" }), [
-      i("header", H, [
-        i("button", {
-          type: "button",
-          "aria-label": "上个月",
-          onClick: t[0] || (t[0] = (e) => g(-1))
-        }, [
-          $(y(B), {
-            size: 16,
-            "aria-hidden": "true"
-          })
-        ]),
-        i("strong", null, c(S.value), 1),
-        i("button", {
-          type: "button",
-          "aria-label": "下个月",
-          onClick: t[1] || (t[1] = (e) => g(1))
-        }, [
-          $(y(E), {
-            size: 16,
-            "aria-hidden": "true"
-          })
-        ])
-      ]),
-      i("div", L, [
-        (a(), l(h, null, b(["一", "二", "三", "四", "五", "六", "日"], (e) => i("strong", { key: e }, c(e), 1)), 64)),
-        (a(!0), l(h, null, b(w.value, (e, v) => {
-          var k;
-          return a(), l("div", {
-            key: v,
-            class: "hys-ui-ent-calendar-day"
-          }, [
-            e ? (a(), l("button", {
-              key: 0,
-              type: "button",
-              disabled: (k = d.disabledDate) == null ? void 0 : k.call(d, s(e)),
-              "aria-pressed": d.modelValue === s(e),
-              onClick: (u) => {
-                m("select", s(e)), m("update:modelValue", s(e));
-              }
-            }, [
-              N(n.$slots, "date", {
-                date: s(e),
-                day: e
-              }, () => [
-                R(c(e), 1)
-              ])
-            ], 8, M)) : x("", !0),
-            (a(!0), l(h, null, b((d.events || []).filter((u) => e && u.date === s(e)), (u) => (a(), l("button", {
-              type: "button",
-              key: u.id,
-              class: "hys-ui-ent-event",
-              onClick: (P) => m("event", u.id)
-            }, c(u.title), 9, Y))), 128))
-          ]);
-        }), 128))
-      ])
-    ], 16));
-  }
-});
+import o from "./HysCalendar2.vue.js";
+/* empty css                 */
+import r from "../../_virtual/_plugin-vue_export-helper.js";
+const m = /* @__PURE__ */ r(o, [["__scopeId", "data-v-1f69497b"]]);
 export {
-  G as default
+  m as default
 };