hys-ui 0.1.0 → 0.1.1

package/dist/components/HysToast/HysToast2.vue.js

@@ -1,57 +1,140 @@
-import { defineComponent as v, ref as h, watch as g, onBeforeUnmount as C, onDeactivated as b, onActivated as k, openBlock as n, createBlock as c, Teleport as T, createVNode as m, Transition as B, withCtx as x, createElementBlock as d, mergeProps as A, unref as o, createElementVNode as N, resolveDynamicComponent as V, createTextVNode as D, toDisplayString as w, createCommentVNode as f } from "vue";
-import { useHysRootAttrs as z } from "../../config.js";
-import { CircleAlert as E, Info as H, CircleCheck as M, X as R } from "lucide-vue-next";
-const I = ["role"], j = /* @__PURE__ */ v({
+import { defineComponent as X, useAttrs as j, useSlots as q, ref as d, computed as h, watch as N, onDeactivated as G, onActivated as J, nextTick as K, onBeforeUnmount as Q, openBlock as i, createBlock as H, Teleport as Y, createVNode as O, Transition as Z, withCtx as _, createElementBlock as m, mergeProps as ee, unref as x, renderSlot as A, resolveDynamicComponent as te, normalizeClass as ae, createCommentVNode as v, createElementVNode as oe, createTextVNode as se, toDisplayString as V } from "vue";
+import { LoaderCircle as le, TriangleAlert as ne, Info as ie, CircleAlert as ue, CircleCheck as re, X as fe } from "lucide-vue-next";
+import { useHysRootAttrs as ce } from "../../config.js";
+import { registerToastEscape as de } from "../../composables/toastEscape.js";
+const me = ["role", "aria-live"], ve = {
+  key: 0,
+  class: "hys-ui-toast-icon",
+  "aria-hidden": "true"
+}, ye = { class: "hys-ui-toast-message" }, pe = ["aria-label"], he = {
+  key: 2,
+  class: "hys-ui-toast-action"
+}, ke = /* @__PURE__ */ X({
+  inheritAttrs: !1,
   __name: "HysToast",
   props: {
-    message: {},
+    message: { default: "" },
     type: { default: "success" },
-    duration: { default: 3e3 },
+    duration: {},
     closable: { type: Boolean, default: !0 },
-    position: { default: "bottom-right" }
+    position: { default: "top-center" },
+    offset: { default: 24 },
+    zIndex: { default: 2e3 },
+    showIcon: { type: Boolean, default: !0 },
+    pauseOnHover: { type: Boolean, default: !0 },
+    closeOnEscape: { type: Boolean },
+    repeat: { default: 1 },
+    plain: { type: Boolean },
+    teleport: { type: Boolean, default: !0 },
+    appendTo: { default: "body" }
   },
-  emits: ["close"],
-  setup(e, { emit: y }) {
-    const p = z(), t = e, r = y, a = h(!0);
-    let l;
-    function s() {
-      clearTimeout(l);
+  emits: ["close", "afterClose"],
+  setup(e, { expose: F, emit: S }) {
+    const a = e, w = S, E = j(), $ = q(), L = ce(), b = d(), u = d(!0), o = d(!1), C = d(!1), T = d(!1), R = h(() => a.position === "top" ? "top-center" : a.position === "bottom" ? "bottom-center" : a.position), g = h(() => Math.max(0, Number.isFinite(a.duration ?? 3e3) ? a.duration ?? (a.type === "loading" ? 0 : 3e3) : 0)), P = h(() => !!a.message || !!$.default), U = h(() => ({ success: re, error: ue, info: ie, warning: ne, loading: le })[a.type]);
+    let y, l, f = 0, z = 0, k = !1, I = !0;
+    function D() {
+      clearTimeout(y), y = void 0;
     }
-    function i() {
-      s(), a.value && t.message && t.duration > 0 && (l = setTimeout(() => r("close"), t.duration));
+    function r() {
+      y && (f = Math.max(0, f - (Date.now() - z))), D();
     }
-    return g(() => [t.message, t.duration], i, { immediate: !0 }), C(s), b(() => {
-      a.value = !1, s();
-    }), k(() => {
-      a.value = !0, i();
-    }), (P, u) => (n(), c(T, { to: "body" }, [
-      m(B, { name: "hys-ui-toast-motion" }, {
-        default: x(() => [
-          e.message && a.value ? (n(), d("div", A({ key: 0 }, o(p), {
-            class: ["hys-ui-toast", ["hys-ui-toast-" + e.type, "hys-ui-toast-position-" + e.position]],
+    function c() {
+      if (D(), !(!u.value || !o.value || C.value || T.value || g.value <= 0)) {
+        if (f <= 0) {
+          n();
+          return;
+        }
+        z = Date.now(), y = setTimeout(n, f);
+      }
+    }
+    function B() {
+      f = g.value, c();
+    }
+    function n() {
+      o.value && (r(), o.value = !1, k || (k = !0, w("close")));
+    }
+    function W() {
+      !o.value && u.value && w("afterClose");
+    }
+    return N(() => [a.message, g.value, a.repeat], (s, t) => {
+      s[0] || !t && $.default ? (o.value = !0, k = !1, B()) : !P.value || t != null && t[0] ? n() : o.value && B();
+    }, { immediate: !0 }), N(() => o.value && u.value && a.closeOnEscape, (s) => {
+      l == null || l(), l = s ? de(n) : void 0;
+    }, { immediate: !0 }), G(() => {
+      u.value = !1, r();
+    }), J(() => {
+      u.value = !0, K(() => I && c());
+    }), Q(() => {
+      I = !1, r(), l == null || l();
+    }), F({ close: n, pause: r, resume: c, restart: B, element: b }), (s, t) => (i(), H(Y, {
+      to: e.appendTo,
+      disabled: !e.teleport
+    }, [
+      O(Z, {
+        name: "hys-ui-toast-motion",
+        appear: "",
+        onAfterLeave: W
+      }, {
+        default: _(() => [
+          o.value && u.value ? (i(), m("div", ee({
+            key: 0,
+            ref_key: "element",
+            ref: b
+          }, { ...x(L), ...x(E) }, {
+            class: ["hys-ui-toast", ["hys-ui-toast-" + e.type, "hys-ui-toast-position-" + R.value, { "hys-ui-toast-inline": !e.teleport, "hys-ui-toast-plain": e.plain }]],
+            style: { "--hys-ui-toast-offset": Math.max(0, e.offset) + "px", zIndex: e.zIndex },
             role: e.type === "error" ? "alert" : "status",
-            onMouseenter: s,
-            onMouseleave: i
+            "aria-live": e.type === "error" ? "assertive" : "polite",
+            "aria-atomic": "true",
+            onMouseenter: t[0] || (t[0] = (p) => e.pauseOnHover && (C.value = !0, r())),
+            onMouseleave: t[1] || (t[1] = (p) => {
+              C.value = !1, c();
+            }),
+            onFocusin: t[2] || (t[2] = (p) => {
+              T.value = !0, r();
+            }),
+            onFocusout: t[3] || (t[3] = (p) => {
+              var M;
+              return !((M = b.value) != null && M.contains(p.relatedTarget)) && (T.value = !1, c());
+            })
           }), [
-            N("span", null, [
-              (n(), c(V(e.type === "error" ? o(E) : e.type === "info" ? o(H) : o(M)), { size: 18 }))
+            e.showIcon ? (i(), m("span", ve, [
+              A(s.$slots, "icon", {}, () => [
+                (i(), H(te(U.value), {
+                  size: 18,
+                  class: ae({ "hys-ui-toast-spinner": e.type === "loading" })
+                }, null, 8, ["class"]))
+              ], !0)
+            ])) : v("", !0),
+            oe("div", ye, [
+              A(s.$slots, "default", {}, () => [
+                se(V(e.message), 1)
+              ], !0)
             ]),
-            D(w(e.message), 1),
-            e.closable ? (n(), d("button", {
-              key: 0,
+            e.repeat > 1 ? (i(), m("span", {
+              key: 1,
+              class: "hys-ui-toast-repeat",
+              "aria-label": "重复 " + e.repeat + " 次"
+            }, "×" + V(e.repeat), 9, pe)) : v("", !0),
+            s.$slots.action ? (i(), m("span", he, [
+              A(s.$slots, "action", { close: n }, void 0, !0)
+            ])) : v("", !0),
+            e.closable ? (i(), m("button", {
+              key: 3,
+              class: "hys-ui-toast-close",
               type: "button",
               "aria-label": "关闭提示",
-              onClick: u[0] || (u[0] = (S) => r("close"))
+              onClick: n
             }, [
-              m(o(R), { size: 14 })
-            ])) : f("", !0)
-          ], 16, I)) : f("", !0)
+              O(x(fe), { size: 14 })
+            ])) : v("", !0)
+          ], 16, me)) : v("", !0)
         ]),
-        _: 1
+        _: 3
       })
-    ]));
+    ], 8, ["to", "disabled"]));
   }
 });
 export {
-  j as default
+  ke as default
 };

package/dist/components/HysTour/HysTour.vue.js

@@ -1,74 +1,79 @@
-import { defineComponent as C, useModel as M, ref as V, watch as g, openBlock as B, createBlock as E, withCtx as a, createElementVNode as h, toDisplayString as u, createVNode as d, createTextVNode as f, mergeModels as x } from "vue";
-import H from "../HysModal/HysModal.vue.js";
-import m from "../HysButton/HysButton.vue.js";
-const O = /* @__PURE__ */ C({
+import { defineComponent as C, useModel as V, ref as B, watch as f, openBlock as N, createBlock as b, withCtx as s, createElementVNode as x, toDisplayString as i, createVNode as m, createTextVNode as p, mergeModels as M } from "vue";
+import E from "../HysModal/HysModal.vue.js";
+import v from "../HysButton/HysButton.vue.js";
+const T = /* @__PURE__ */ C({
   __name: "HysTour",
-  props: /* @__PURE__ */ x({
+  props: /* @__PURE__ */ M({
     steps: {},
     current: {},
-    closeOnEscape: { type: Boolean }
+    closeOnEscape: { type: Boolean, default: !0 }
   }, {
     modelValue: { type: Boolean, default: !1 },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ x(["finish", "close", "change", "update:current"], ["update:modelValue"]),
-  setup(t, { emit: y }) {
-    const o = t, i = M(t, "modelValue"), s = y, e = V(o.current || 0);
-    g(() => o.current, (l) => {
-      l !== void 0 && (e.value = l);
-    }), g(i, (l) => {
-      l && (e.value = o.current || 0);
+  emits: /* @__PURE__ */ M(["finish", "close", "change", "update:current"], ["update:modelValue"]),
+  setup(l, { emit: y }) {
+    const n = l, r = V(l, "modelValue"), u = y, e = B(o(n.current ?? 0));
+    function o(t) {
+      return Math.max(0, Math.min(Math.max(0, n.steps.length - 1), Number.isFinite(t) ? Math.floor(t) : 0));
+    }
+    f(() => n.current, (t) => {
+      t !== void 0 && (e.value = o(t));
+    }), f(r, (t) => {
+      t && (e.value = o(n.current ?? 0));
+    }), f(() => n.steps.length, () => {
+      e.value = o(e.value);
     });
-    function p(l) {
-      e.value = Math.max(0, Math.min(o.steps.length - 1, l)), s("change", e.value), s("update:current", e.value);
+    function h(t) {
+      e.value = o(t), u("change", e.value), u("update:current", e.value);
     }
-    function r() {
-      i.value = !1, s("close");
+    function c() {
+      r.value = !1, u("close");
     }
     function k() {
-      e.value >= o.steps.length - 1 ? (s("finish"), r()) : p(e.value + 1);
+      e.value >= n.steps.length - 1 ? (u("finish"), c()) : h(e.value + 1);
     }
-    return (l, n) => {
-      var v;
-      return B(), E(H, {
-        open: i.value,
-        title: ((v = t.steps[e.value]) == null ? void 0 : v.title) || "引导",
-        "close-on-escape": t.closeOnEscape !== !1,
+    return (t, a) => {
+      var g;
+      return N(), b(E, {
+        open: r.value,
+        title: ((g = l.steps[e.value]) == null ? void 0 : g.title) || "引导",
+        "close-on-escape": l.closeOnEscape !== !1,
         "close-on-mask": !1,
-        onClose: r
+        onClose: c
       }, {
-        footer: a(() => [
-          h("span", null, u(t.steps.length ? e.value + 1 : 0) + " / " + u(t.steps.length), 1),
-          d(m, {
+        footer: s(() => [
+          x("span", null, i(l.steps.length ? e.value + 1 : 0) + " / " + i(l.steps.length), 1),
+          m(v, {
             variant: "ghost",
-            onClick: r
+            onClick: c
           }, {
-            default: a(() => [...n[1] || (n[1] = [
-              f("跳过", -1)
+            default: s(() => [...a[1] || (a[1] = [
+              p("跳过", -1)
             ])]),
             _: 1
           }),
-          d(m, {
+          m(v, {
             variant: "secondary",
             disabled: e.value === 0,
-            onClick: n[0] || (n[0] = (c) => p(e.value - 1))
+            onClick: a[0] || (a[0] = (d) => h(e.value - 1))
           }, {
-            default: a(() => [...n[2] || (n[2] = [
-              f("上一步", -1)
+            default: s(() => [...a[2] || (a[2] = [
+              p("上一步", -1)
             ])]),
             _: 1
           }, 8, ["disabled"]),
-          d(m, { onClick: k }, {
-            default: a(() => [
-              f(u(e.value >= t.steps.length - 1 ? "完成" : "下一步"), 1)
+          m(v, { onClick: k }, {
+            default: s(() => [
+              p(i(e.value >= l.steps.length - 1 ? "完成" : "下一步"), 1)
             ]),
             _: 1
           })
         ]),
-        default: a(() => {
-          var c;
+        default: s(() => {
+          var d;
           return [
-            h("p", null, u(((c = t.steps[e.value]) == null ? void 0 : c.description) || "暂无引导步骤"), 1)
+            x("p", null, i(((d = l.steps[e.value]) == null ? void 0 : d.description) || "暂无引导步骤"), 1)
           ];
         }),
         _: 1
@@ -77,5 +82,5 @@ const O = /* @__PURE__ */ C({
   }
 });
 export {
-  O as default
+  T as default
 };