hys-ui 0.1.0 → 0.2.0

package/dist/components/HysCascader/HysCascaderColumn.vue.js

@@ -0,0 +1,7 @@
+import o from "./HysCascaderColumn2.vue.js";
+/* empty css                       */
+import r from "../../_virtual/_plugin-vue_export-helper.js";
+const s = /* @__PURE__ */ r(o, [["__scopeId", "data-v-b82f4528"]]);
+export {
+  s as default
+};

package/dist/components/HysCascader/HysCascaderColumn2.vue.js

@@ -0,0 +1,232 @@
+import { defineComponent as O, ref as B, computed as h, watch as Q, onBeforeUnmount as X, onDeactivated as Y, onActivated as Z, openBlock as u, createElementBlock as f, normalizeStyle as $, normalizeClass as W, createElementVNode as C, Fragment as p, renderList as _, createBlock as F, withModifiers as w, createCommentVNode as A, renderSlot as T, mergeProps as y, createTextVNode as E, toDisplayString as V, createVNode as K, unref as z, nextTick as ee } from "vue";
+import { RotateCw as ae, LoaderCircle as le, ChevronRight as ie, Check as te } from "lucide-vue-next";
+import de from "../HysCheckbox/HysCheckbox.vue.js";
+import oe from "../HysRadio/HysRadio.vue.js";
+const ce = ["data-size", "data-cascader-level", "role", "aria-label", "aria-multiselectable"], se = ["data-cascader-key", "role", "aria-checked", "aria-selected", "aria-disabled", "aria-expanded", "aria-haspopup", "aria-current", "tabindex", "onFocus", "onClick", "onPointerenter", "onKeydown"], ne = ["title"], ue = ["aria-label", "disabled", "onClick"], re = {
+  key: 3,
+  class: "hys-ui-cascader-expand"
+}, he = ["disabled", "aria-label", "onClick"], xe = /* @__PURE__ */ O({
+  __name: "HysCascaderColumn",
+  props: {
+    rows: {},
+    level: {},
+    label: {},
+    activeKey: {},
+    multiple: { type: Boolean },
+    strict: { type: Boolean },
+    showPrefix: { type: Boolean, default: !0 },
+    disabled: { type: Boolean },
+    search: { type: Boolean },
+    size: {},
+    virtual: { type: Boolean },
+    itemHeight: { default: 36 },
+    listHeight: { default: 256 },
+    overscan: { default: 4 },
+    columnWidth: { default: 180 },
+    context: {},
+    hasChildren: {},
+    error: {},
+    retryText: {},
+    expandLabel: {}
+  },
+  emits: ["choose", "expand", "hover", "keyboard", "scroll", "retry"],
+  setup(e, { expose: R, emit: D }) {
+    const l = e, s = D, v = B(), m = B(0), H = B(), g = /* @__PURE__ */ new Map(), n = h(
+      () => Number.isFinite(l.itemHeight) ? Math.max(24, Math.min(240, l.itemHeight)) : 36
+    ), b = h(
+      () => Number.isFinite(l.listHeight) ? Math.max(80, Math.min(1200, l.listHeight)) : 256
+    ), N = h(
+      () => Number.isFinite(l.overscan) ? Math.max(0, Math.min(30, Math.floor(l.overscan))) : 4
+    ), P = h(
+      () => l.virtual ? Math.max(0, Math.floor(m.value / n.value) - N.value) : 0
+    ), I = h(
+      () => l.virtual ? Math.min(
+        l.rows.length,
+        Math.ceil((m.value + b.value) / n.value) + N.value
+      ) : l.rows.length
+    ), q = h(() => l.rows.slice(P.value, I.value)), L = h(
+      () => {
+        var t, i;
+        return ((t = l.rows.find(
+          (a) => a.value === (H.value ?? l.activeKey) && !a.disabled
+        )) == null ? void 0 : t.value) ?? ((i = l.rows.find((a) => !a.disabled)) == null ? void 0 : i.value);
+      }
+    );
+    let x = 0, M = 0, k = !0;
+    function j(t, i) {
+      i instanceof HTMLElement ? g.set(t, i) : g.delete(t);
+    }
+    function G(t) {
+      k && (l.virtual && !x && (x = requestAnimationFrame(() => {
+        var i;
+        x = 0, m.value = ((i = v.value) == null ? void 0 : i.scrollTop) ?? 0;
+      })), s("scroll", t));
+    }
+    async function J(t) {
+      var U;
+      const i = t ?? L.value, a = l.rows.findIndex((c) => c.value === i && !c.disabled);
+      if (a < 0 || l.disabled || !k) return;
+      const d = ++M;
+      H.value = i;
+      const o = v.value;
+      if (!o) return;
+      if (l.virtual) {
+        const c = a * n.value;
+        c < o.scrollTop ? o.scrollTop = c : c + n.value > o.scrollTop + b.value && (o.scrollTop = c + n.value - b.value), m.value = o.scrollTop;
+      }
+      if ((U = g.get(i)) != null && U.isConnected || await ee(), !k || d !== M || l.disabled) return;
+      const r = g.get(i);
+      if (r && !l.virtual) {
+        const c = r.offsetTop;
+        c < o.scrollTop ? o.scrollTop = c : c + r.offsetHeight > o.scrollTop + o.clientHeight && (o.scrollTop = c + r.offsetHeight - o.clientHeight);
+      }
+      r == null || r.focus({ preventScroll: !0 });
+    }
+    Q(
+      () => l.rows,
+      () => {
+        if (v.value) {
+          const t = Math.max(0, l.rows.length * n.value - b.value);
+          m.value > t && (m.value = t, v.value.scrollTop = t);
+        }
+      }
+    );
+    function S() {
+      k = !1, M++, cancelAnimationFrame(x), x = 0;
+    }
+    return X(S), Y(S), Z(() => k = !0), R({ focus: J, element: v }), (t, i) => (u(), f("div", {
+      ref_key: "port",
+      ref: v,
+      class: W(["hys-ui-cascader-column hys-ui-v4-level", {
+        "hys-ui-cascader-column-virtual": e.virtual,
+        "hys-ui-cascader-results": e.search
+      }]),
+      "data-size": e.size,
+      "data-cascader-level": e.level,
+      role: e.search ? "listbox" : "menu",
+      "aria-label": e.label,
+      "aria-multiselectable": e.search && e.multiple || void 0,
+      style: $({
+        maxHeight: b.value + "px",
+        height: e.virtual ? b.value + "px" : void 0,
+        minWidth: e.search ? "0" : typeof e.columnWidth == "number" ? e.columnWidth + "px" : e.columnWidth,
+        "--hys-ui-cascader-item-height": n.value + "px"
+      }),
+      onScroll: G
+    }, [
+      C("div", {
+        class: "hys-ui-cascader-space",
+        style: $(e.virtual ? { height: e.rows.length * n.value + "px" } : void 0)
+      }, [
+        C("div", {
+          class: "hys-ui-cascader-rows",
+          style: $(
+            e.virtual ? {
+              position: "absolute",
+              top: P.value * n.value + "px",
+              insetInline: 0
+            } : void 0
+          )
+        }, [
+          (u(!0), f(p, null, _(q.value, (a) => (u(), f("div", {
+            key: a.value,
+            ref_for: !0,
+            ref: (d) => j(a.value, d),
+            "data-cascader-key": a.value,
+            role: e.search ? "option" : e.multiple ? "menuitemcheckbox" : e.strict ? "menuitemradio" : "menuitem",
+            "aria-checked": !e.search && (e.multiple || e.strict) ? e.context(a).indeterminate ? "mixed" : e.context(a).checked : void 0,
+            "aria-selected": e.search ? e.context(a).checked : void 0,
+            "aria-disabled": e.disabled || a.disabled || void 0,
+            "aria-expanded": !e.search && e.hasChildren(a) ? e.context(a).expanded : void 0,
+            "aria-haspopup": !e.search && e.hasChildren(a) ? "menu" : void 0,
+            "aria-current": !e.search && e.activeKey === a.value ? "true" : void 0,
+            tabindex: !e.disabled && !a.disabled && L.value === a.value ? 0 : -1,
+            class: W(["hys-ui-cascader-option", {
+              "hys-ui-cascader-option-active": e.activeKey === a.value,
+              "hys-ui-cascader-option-checked": e.context(a).checked,
+              "hys-ui-cascader-option-disabled": a.disabled,
+              "hys-ui-cascader-option-fixed": e.virtual
+            }]),
+            onFocus: (d) => H.value = a.value,
+            onClick: (d) => !e.disabled && !a.disabled && s("choose", a, d),
+            onPointerenter: (d) => !e.disabled && !a.disabled && s("hover", a),
+            onPointerleave: i[2] || (i[2] = (d) => s("hover", null)),
+            onKeydown: (d) => s("keyboard", d, a, e.level)
+          }, [
+            e.multiple && e.showPrefix ? (u(), F(de, {
+              key: 0,
+              "model-value": e.context(a).checked,
+              indeterminate: e.context(a).indeterminate,
+              disabled: e.disabled || a.disabled,
+              size: e.size,
+              tabindex: -1,
+              "aria-hidden": "true",
+              onClick: i[0] || (i[0] = w(() => {
+              }, ["stop"])),
+              "onUpdate:modelValue": (d) => s("choose", a, void 0, d === !0)
+            }, null, 8, ["model-value", "indeterminate", "disabled", "size", "onUpdate:modelValue"])) : e.strict && e.showPrefix ? (u(), F(oe, {
+              key: 1,
+              "model-value": e.context(a).checked ? a.value : null,
+              value: a.value,
+              disabled: e.disabled || a.disabled,
+              size: e.size,
+              tabindex: -1,
+              "aria-hidden": "true",
+              onClick: i[1] || (i[1] = w(() => {
+              }, ["stop"])),
+              "onUpdate:modelValue": (d) => s("choose", a, void 0, !0)
+            }, null, 8, ["model-value", "value", "disabled", "size", "onUpdate:modelValue"])) : A("", !0),
+            C("span", {
+              class: "hys-ui-cascader-option-label",
+              title: e.search ? e.context(a).label : a.label
+            }, [
+              e.search ? T(t.$slots, "suggestion", y({ ref_for: !0 }, e.context(a)), () => [
+                E(V(e.context(a).label), 1)
+              ], !0, 0) : T(t.$slots, "option", y({ ref_for: !0 }, e.context(a)), () => [
+                E(V(a.label), 1)
+              ], !0, 1)
+            ], 8, ne),
+            e.error(a) ? (u(), f("button", {
+              key: 2,
+              type: "button",
+              class: "hys-ui-cascader-expand hys-ui-cascader-retry",
+              "aria-label": e.retryText + " " + a.label,
+              disabled: e.disabled,
+              onClick: w((d) => s("retry", a), ["stop"])
+            }, [
+              K(z(ae), { size: 14 }),
+              C("span", null, V(e.retryText), 1)
+            ], 8, ue)) : e.context(a).loading ? (u(), f("span", re, [
+              T(t.$slots, "loading", y({ ref_for: !0 }, e.context(a)), () => [
+                K(z(le), {
+                  size: 15,
+                  class: "hys-ui-icon-spin"
+                })
+              ], !0)
+            ])) : !e.search && e.hasChildren(a) ? (u(), f("button", {
+              key: 4,
+              type: "button",
+              class: "hys-ui-cascader-expand",
+              tabindex: "-1",
+              disabled: e.disabled || a.disabled,
+              "aria-label": e.expandLabel(a),
+              onClick: w((d) => s("expand", a), ["stop"])
+            }, [
+              T(t.$slots, "expand-icon", y({ ref_for: !0 }, e.context(a)), () => [
+                K(z(ie), { size: 15 })
+              ], !0)
+            ], 8, he)) : !e.multiple && !e.strict && e.context(a).checked ? (u(), F(z(te), {
+              key: 5,
+              size: 15,
+              class: "hys-ui-cascader-selected-icon",
+              "aria-hidden": "true"
+            })) : A("", !0)
+          ], 42, se))), 128))
+        ], 4)
+      ], 4)
+    ], 46, ce));
+  }
+});
+export {
+  xe as default
+};

package/dist/components/HysCheckbox/HysCheckbox.vue.js

@@ -1,41 +1,7 @@
-import { defineComponent as m, openBlock as n, createElementBlock as d, mergeProps as c, unref as u, createElementVNode as s, toDisplayString as b, createCommentVNode as h, renderSlot as y } from "vue";
-import { useHysRootAttrs as k } from "../../config.js";
-const f = ["name", "value", "required", "aria-label", "indeterminate", "aria-checked", "checked", "disabled"], g = { key: 0 }, q = /* @__PURE__ */ m({
-  __name: "HysCheckbox",
-  props: {
-    modelValue: { type: Boolean },
-    label: {},
-    disabled: { type: Boolean },
-    ariaLabel: {},
-    readonly: { type: Boolean },
-    name: {},
-    value: {},
-    required: { type: Boolean },
-    indeterminate: { type: Boolean }
-  },
-  emits: ["update:modelValue", "change"],
-  setup(e, { emit: i }) {
-    const o = k(), a = i;
-    return (r, t) => (n(), d("label", c(u(o), { class: "hys-ui-check-label" }), [
-      s("input", {
-        type: "checkbox",
-        name: e.name,
-        value: e.value,
-        required: e.required,
-        "aria-label": e.ariaLabel,
-        indeterminate: e.indeterminate,
-        "aria-checked": e.indeterminate ? "mixed" : e.modelValue,
-        checked: e.modelValue,
-        disabled: e.disabled || e.readonly,
-        onChange: t[0] || (t[0] = (l) => {
-          a("update:modelValue", l.target.checked), a("change", l.target.checked);
-        })
-      }, null, 40, f),
-      e.label ? (n(), d("span", g, b(e.label), 1)) : h("", !0),
-      y(r.$slots, "default")
-    ], 16));
-  }
-});
+import o from "./HysCheckbox2.vue.js";
+/* empty css                 */
+import f from "../../_virtual/_plugin-vue_export-helper.js";
+const m = /* @__PURE__ */ f(o, [["__scopeId", "data-v-a00fdf5f"]]);
 export {
-  q as default
+  m as default
 };

package/dist/components/HysCheckbox/HysCheckbox2.vue.js

@@ -1,4 +1,202 @@
-import f from "./HysCheckbox.vue.js";
+import { defineComponent as Z, useAttrs as p, inject as M, ref as _, useId as ee, computed as n, watch as ae, onMounted as te, onActivated as le, onDeactivated as ie, onBeforeUnmount as re, openBlock as V, createElementBlock as g, mergeProps as O, unref as r, createElementVNode as H, normalizeClass as ue, renderSlot as K, createBlock as oe, resolveDynamicComponent as ne, createCommentVNode as z, toDisplayString as R } from "vue";
+import { Minus as de, Check as se } from "lucide-vue-next";
+import { fieldKey as ce, useHysControlState as ve } from "../../composables/formContext.js";
+import { checkboxGroupKey as fe, isChoice as be } from "../../composables/choice.js";
+import { useHysRootAttrs as me } from "../../config.js";
+import { useChoiceModel as ye, useChoiceNativeReset as he } from "../../composables/choiceModel.js";
+const ke = ["data-status", "data-indeterminate"], Ae = ["id", "name", "form", "value", "required", "aria-label", "aria-readonly", "aria-invalid", "aria-describedby", "indeterminate", "aria-checked", "checked", "disabled", "tabindex"], xe = {
+  key: 0,
+  class: "hys-ui-checkbox-label"
+}, Be = ["id"], qe = /* @__PURE__ */ Z({
+  inheritAttrs: !1,
+  __name: "HysCheckbox",
+  props: {
+    modelValue: { default: void 0 },
+    defaultValue: { default: void 0 },
+    label: {},
+    disabled: { type: Boolean },
+    ariaLabel: {},
+    readonly: { type: Boolean },
+    name: {},
+    form: {},
+    value: { type: [String, Number, Boolean], default: void 0 },
+    trueValue: { type: [String, Number, Boolean], default: void 0 },
+    falseValue: { type: [String, Number, Boolean], default: void 0 },
+    required: { type: Boolean },
+    indeterminate: { type: Boolean },
+    tabindex: {},
+    size: {},
+    border: { type: Boolean, default: void 0 },
+    button: { type: Boolean, default: void 0 },
+    buttonStyle: {},
+    autofocus: { type: Boolean },
+    focusable: { type: Boolean, default: !0 },
+    status: {},
+    error: {}
+  },
+  emits: ["update:modelValue", "change", "focus", "blur"],
+  setup(l, { expose: $, emit: I }) {
+    const a = l, h = I, k = p(), e = M(fe, void 0), d = M(ce, void 0), F = me(), s = _(), { disabled: G, size: P } = ve(a), x = ye(
+      a,
+      () => a.defaultValue ?? a.falseValue ?? !1,
+      (t, i) => Array.isArray(t) && Array.isArray(i) ? t.length === i.length && t.every((m, u) => m === i[u]) : t === i
+    ), c = x.current, j = ee(), o = n(
+      () => e && a.value !== void 0 ? e.values.value.includes(a.value) : Array.isArray(c.value) ? a.value !== void 0 && c.value.includes(a.value) : c.value === (a.trueValue ?? !0)
+    ), B = n(() => a.readonly || (e == null ? void 0 : e.readonly.value)), U = n(() => !!a.disabled || !!a.readonly), A = n(
+      () => G.value || (e == null ? void 0 : e.disabled.value) || !!(e && a.value !== void 0 && e.isLimited(a.value))
+    ), S = n(
+      () => a.size ?? (e == null ? void 0 : e.size.value) ?? P.value
+    ), W = n(() => a.button ?? (e == null ? void 0 : e.button.value) ?? !1), J = n(() => a.border ?? (e == null ? void 0 : e.border.value) ?? !1), Q = n(
+      () => a.buttonStyle ? a.buttonStyle === "solid" : (e == null ? void 0 : e.solid.value) ?? !1
+    ), C = n(
+      () => {
+        var t, i;
+        return a.error || a.status === "error" || !e && ((t = d == null ? void 0 : d.invalid) != null && t.value) ? "error" : a.status ?? (e == null ? void 0 : e.status.value) ?? ((i = d == null ? void 0 : d.status) == null ? void 0 : i.value);
+      }
+    ), q = (t) => t === "id" || t === "form" || t === "autofocus" || t.startsWith("aria-"), T = () => Object.fromEntries(Object.entries(k).filter(([t]) => !q(t))), X = () => Object.fromEntries(Object.entries(k).filter(([t]) => q(t)));
+    function v() {
+      s.value && (s.value.checked = o.value, s.value.indeterminate = !!a.indeterminate);
+    }
+    async function w(t) {
+      if (!x.isLive() || A.value || B.value)
+        return v(), !1;
+      if (e && a.value !== void 0) {
+        if (t === o.value)
+          return v(), !1;
+        const u = e.toggle(a.value, t);
+        h("change", t);
+        const y = await u;
+        return v(), y;
+      }
+      const i = Array.isArray(c.value) ? t ? [
+        .../* @__PURE__ */ new Set([
+          ...c.value,
+          ...a.value === void 0 ? [] : [a.value]
+        ])
+      ] : c.value.filter((u) => u !== a.value) : t ? a.trueValue ?? !0 : a.falseValue ?? !1;
+      if (Array.isArray(i) && Array.isArray(c.value) && i.length === c.value.length && i.every(
+        (u, y) => u === c.value[y]
+      ) || !Array.isArray(i) && i === c.value)
+        return v(), !1;
+      const m = await x.commit(
+        i,
+        (u) => h("update:modelValue", u),
+        (u) => h("change", u),
+        !0
+      );
+      return v(), m;
+    }
+    function Y(t) {
+      w(t.target.checked);
+    }
+    let b;
+    function D() {
+      e && !b && (b = e.register({
+        input: s,
+        value: n(() => be(a.value) ? a.value : void 0),
+        locked: U,
+        disabled: n(() => !!a.disabled)
+      }));
+    }
+    function N() {
+      b == null || b(), b = void 0;
+    }
+    return ae([o, () => a.indeterminate], v, { flush: "post" }), he(
+      s,
+      x.reset,
+      v,
+      () => a.form ?? (e == null ? void 0 : e.form.value)
+    ), te(() => {
+      var t;
+      v(), D(), a.autofocus && !A.value && ((t = s.value) == null || t.focus());
+    }), le(D), ie(N), re(N), $({
+      input: s,
+      checked: o,
+      focus: (t) => {
+        var i;
+        A.value || (i = s.value) == null || i.focus(t);
+      },
+      blur: () => {
+        var t;
+        return (t = s.value) == null ? void 0 : t.blur();
+      },
+      toggle: () => w(!o.value)
+    }), (t, i) => {
+      var m, u, y, E, L;
+      return V(), g("label", O({ ...r(F), ...T() }, {
+        class: ["hys-ui-check-label", [
+          "hys-ui-checkbox-" + S.value,
+          {
+            "hys-ui-checkbox-disabled": A.value,
+            "hys-ui-checkbox-readonly": B.value,
+            "hys-ui-checkbox-bordered": J.value,
+            "hys-ui-checkbox-button": W.value,
+            "hys-ui-checkbox-solid": Q.value,
+            "hys-ui-checkbox-selected": o.value || l.indeterminate,
+            "hys-ui-checkbox-error": C.value === "error"
+          }
+        ]],
+        "data-status": C.value,
+        "data-indeterminate": l.indeterminate || void 0,
+        onMousedown: i[3] || (i[3] = (f) => !l.focusable && f.preventDefault())
+      }), [
+        H("input", O({
+          ref_key: "input",
+          ref: s
+        }, X(), {
+          class: "hys-ui-checkbox-native",
+          type: "checkbox",
+          id: r(k).id || (r(e) || (m = r(d)) == null ? void 0 : m.id.value),
+          "data-hys-ui-field-managed": "",
+          name: r(e) ? void 0 : l.name,
+          form: l.form || ((u = r(e)) == null ? void 0 : u.form.value),
+          value: l.value === void 0 ? l.trueValue === void 0 ? "on" : String(l.trueValue) : String(l.value),
+          required: r(e) ? void 0 : l.required || ((y = r(d)) == null ? void 0 : y.required.value),
+          "aria-label": l.ariaLabel || r(k)["aria-label"] || l.label || (!l.label && !t.$slots.default && !r(e) ? (E = r(d)) == null ? void 0 : E.label.value : void 0),
+          "aria-readonly": B.value || void 0,
+          "aria-invalid": C.value === "error" || void 0,
+          "aria-describedby": [
+            r(k)["aria-describedby"],
+            l.error ? r(j) : void 0,
+            r(e) || (L = r(d)) == null ? void 0 : L.describedBy.value
+          ].filter(Boolean).join(" ") || void 0,
+          indeterminate: l.indeterminate,
+          "aria-checked": l.indeterminate ? "mixed" : o.value,
+          checked: o.value,
+          disabled: A.value,
+          tabindex: l.focusable ? l.tabindex : -1,
+          onClick: i[0] || (i[0] = (f) => B.value && f.preventDefault()),
+          onChange: Y,
+          onFocus: i[1] || (i[1] = (f) => h("focus", f)),
+          onBlur: i[2] || (i[2] = (f) => h("blur", f))
+        }), null, 16, Ae),
+        H("span", {
+          class: ue(["hys-ui-checkbox-box", { "hys-ui-checkbox-checked": o.value || l.indeterminate }]),
+          "aria-hidden": "true"
+        }, [
+          K(t.$slots, "icon", {
+            checked: o.value,
+            indeterminate: l.indeterminate
+          }, () => [
+            o.value || l.indeterminate ? (V(), oe(ne(l.indeterminate ? r(de) : r(se)), {
+              key: 0,
+              size: S.value === "sm" ? 11 : S.value === "lg" ? 15 : 13,
+              "stroke-width": 2.4
+            }, null, 8, ["size"])) : z("", !0)
+          ], !0)
+        ], 2),
+        l.label ? (V(), g("span", xe, R(l.label), 1)) : z("", !0),
+        K(t.$slots, "default", {}, void 0, !0),
+        l.error ? (V(), g("small", {
+          key: 1,
+          id: r(j),
+          class: "hys-ui-checkbox-error-text",
+          role: "alert"
+        }, R(l.error), 9, Be)) : z("", !0)
+      ], 16, ke);
+    };
+  }
+});
 export {
-  f as default
+  qe as default
 };

package/dist/components/HysCheckboxGroup/HysCheckboxGroup.vue.js

@@ -0,0 +1,7 @@
+import o from "./HysCheckboxGroup2.vue.js";
+/* empty css                      */
+import r from "../../_virtual/_plugin-vue_export-helper.js";
+const e = /* @__PURE__ */ r(o, [["__scopeId", "data-v-bad3f4e9"]]);
+export {
+  e as default
+};