hys-ui 0.4.0 → 0.6.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## 0.6.0
+
+- SortableList 增加垂直、水平和网格排序，支持跨列表和跨层级移动、克隆、批量排序、虚拟列表、撤销重做和异步保存回滚。拖拽结束后过渡到目标位置，临界区排序更稳定，列表文本仍可选中复制。
+- Toast 增加全局调用、优先级队列、分组去重、Promise 状态与进度、异步操作、关闭拦截、拖动关闭和主题定制。新增可悬停或点击展开的层叠布局，并补充交互示例与 API。
+- Tooltip 与 Popover 修复其他浮层打开时悬停退出或失焦后提示残留的问题，并调整尺寸控制示例布局。
+- Search 调整带按钮的搜索框焦点边框。Modal 和 Drawer 的关闭按钮在鼠标悬停时保持位置稳定。
+
+## 0.5.0
+
+- AnimatedNumber 增加逐位滚动、翻牌、进度跳转、可视区域触发和高频更新策略；支持地区格式、中文单位、精确金额、极小数值和倒计时。
+- AnimatedNumber 增加 220 种动效，支持效果组合、自定义预设、按数位配置、动效减弱，以及多个指标的编排。新增可搜索的动效演示，整理实时趋势、播放控制和图表联动等示例的窄屏布局。
+- Input 和 Textarea 补充提交时更新模型、原生输入属性、字符计数和表单校验集成；完善 Textarea 自动高度与示例。
+
 ## 0.4.0
 
 - 示例站点为新增能力补充交互示例，API 参考补全参数、事件、插槽和实例方法的具体说明。

package/dist/components/HysAnimatedNumber/HysAnimatedNumber.vue.js

@@ -1,7 +1,7 @@
 import o from "./HysAnimatedNumber2.vue.js";
-/* empty css                       */
+/* empty css                    */
 import t from "../../_virtual/_plugin-vue_export-helper.js";
-const a = /* @__PURE__ */ t(o, [["__scopeId", "data-v-11d35ec9"]]);
+const e = /* @__PURE__ */ t(o, [["__scopeId", "data-v-218a7172"]]);
 export {
-  a as default
+  e as default
 };

package/dist/components/HysAnimatedNumber/HysAnimatedNumber2.vue.js

@@ -1,148 +1,469 @@
-import { defineComponent as Z, useSlots as _, ref as G, watch as E, computed as c, onMounted as ee, onActivated as te, onDeactivated as ne, onBeforeUnmount as ae, openBlock as m, createElementBlock as v, mergeProps as ie, unref as b, renderSlot as x, createTextVNode as M, toDisplayString as N, createCommentVNode as V, createElementVNode as oe, normalizeStyle as re, normalizeProps as $, guardReactiveProps as C, createBlock as se, Fragment as ue } from "vue";
-import { useHysRootAttrs as le } from "../../config.js";
-import { useMotion as ce } from "../../motion/useMotion.js";
-import { decimal as me, decimalText as I, decimalRound as de } from "../../composables/numberInput.js";
-const fe = {
+import { defineComponent as Ke, useSlots as Ue, useTemplateRef as Ge, ref as j, computed as i, watch as M, onMounted as Ze, onActivated as Je, onDeactivated as Qe, onBeforeUnmount as Xe, openBlock as s, createElementBlock as r, mergeProps as Ye, unref as m, renderSlot as k, createTextVNode as W, toDisplayString as b, createCommentVNode as B, createElementVNode as z, normalizeStyle as ee, normalizeProps as O, guardReactiveProps as S, Fragment as $, createBlock as te, normalizeClass as be, createSlots as _e, withCtx as et, renderList as tt } from "vue";
+import { useHysRootAttrs as at } from "../../config.js";
+import { decimal as nt } from "../../composables/numberInput.js";
+import { numberValue as xe, createNumberPresentation as it, numberTrend as ae, bounded as ke } from "../../composables/animatedNumberFormat.js";
+import { useHysAnimatedNumber as lt } from "../../composables/useHysAnimatedNumber.js";
+import { resolveNumberAnimation as ne } from "../../composables/numberAnimation.js";
+import { useNumberCountdown as ot } from "./useNumberCountdown.js";
+import { useNumberVisuals as ut } from "./useNumberVisuals.js";
+import st from "./NumberDigits/NumberDigits.vue.js";
+import rt from "./NumberAnimationCanvas/NumberAnimationCanvas.vue.js";
+const dt = ["data-tone", "data-direction", "data-status", "data-appearance", "role", "tabindex"], ct = {
   key: 0,
   class: "hys-ui-motion-number-title"
-}, ve = ["role"], pe = {
+}, vt = ["role", "aria-label"], ft = {
   key: 0,
-  class: "hys-ui-motion-number-affix"
-}, he = {
-  key: 1,
-  class: "hys-ui-motion-number-affix"
-}, xe = /* @__PURE__ */ Z({
+  class: "hys-ui-motion-number-affix hys-ui-motion-number-prefix"
+}, mt = {
+  class: "hys-number-measure",
+  "aria-hidden": "true"
+}, pt = {
+  class: "hys-number-measure",
+  "aria-hidden": "true"
+}, yt = {
+  key: 3,
+  class: "hys-ui-motion-number-unit"
+}, gt = {
+  key: 5,
+  class: "hys-ui-motion-number-affix hys-ui-motion-number-suffix"
+}, ht = {
+  key: 2,
+  class: "hys-number-live",
+  role: "status",
+  "aria-live": "polite",
+  "aria-atomic": "true"
+}, Nt = /* @__PURE__ */ Ke({
   __name: "HysAnimatedNumber",
   props: {
-    value: { default: 0 },
-    duration: { default: 650 },
-    decimals: {},
-    precision: {},
-    groupSeparator: {},
-    decimalSeparator: { default: "." },
+    modelValue: {},
+    trigger: {},
+    canPlay: { type: [Boolean, Function], default: !0 },
+    visibleOnce: { type: Boolean, default: !0 },
+    pauseOutside: { type: Boolean },
+    visibilityThreshold: {},
+    effect: {},
+    animation: {},
+    animationPresets: {},
+    fallbackAnimation: {},
+    digitAnimations: {},
+    motionIntensity: {},
+    animationMotion: {},
+    thresholdEffect: {},
+    axis: {},
+    stagger: {},
+    digitDuration: {},
+    digitOrder: {},
+    animationStyle: {},
+    stableWidth: { type: Boolean },
+    appearance: { default: "plain" },
+    colorBySign: { type: Boolean },
+    colorByDirection: { type: Boolean },
+    changeThreshold: {},
     title: {},
     prefix: {},
     suffix: {},
     valueStyle: { type: [Boolean, null, String, Object, Array] },
     formatter: {},
+    announce: { type: Boolean },
     deadline: {},
-    format: { default: "HH:mm:ss" }
+    format: { default: "HH:mm:ss" },
+    value: {},
+    from: {},
+    duration: { default: 650 },
+    delay: {},
+    speed: {},
+    easing: {},
+    interpolate: {},
+    loop: { type: [Boolean, Number] },
+    alternate: { type: Boolean },
+    interrupt: {},
+    queueLimit: {},
+    updateInterval: {},
+    fps: {},
+    disabled: { type: Boolean },
+    pauseWhenHidden: { type: Boolean, default: !0 },
+    decimals: {},
+    precision: {},
+    trimZeros: { type: Boolean },
+    minimumIntegerDigits: {},
+    rounding: {},
+    groupSeparator: {},
+    decimalSeparator: {},
+    grouping: { type: Boolean, default: void 0 },
+    locale: {},
+    numberFormat: {},
+    percentInput: {},
+    currency: {},
+    currencySymbol: {},
+    currencyDisplay: {},
+    compact: {},
+    unit: {},
+    signDisplay: {},
+    positiveSign: {},
+    negativeSign: {}
   },
-  emits: ["change", "finish"],
-  setup(r, { expose: L, emit: U }) {
-    const t = r, j = U, A = _(), X = le(), { effectiveMotion: P } = ce(), F = (e) => typeof e == "number" && !Number.isFinite(e) ? 0 : e, s = G(F(t.value));
-    let p = 0, d = !1;
-    function q() {
-      if (cancelAnimationFrame(p), !d) return;
-      const e = F(t.value), n = s.value, u = t.duration;
-      if (typeof e != "number" || typeof n != "number" || n === e || t.deadline !== void 0 || P.value === "off" || !Number.isFinite(u) || u <= 0) {
-        s.value = e;
-        return;
+  emits: ["update:modelValue", "value-change", "threshold", "change", "finish", "start", "update", "progress", "pause", "resume", "end", "cancel", "loop"],
+  setup(l, { expose: Be, emit: Oe }) {
+    const e = l, T = Oe, u = Ue(), ie = at(), w = Ge("root"), le = j(0), p = i(
+      () => xe(e.modelValue ?? e.value ?? le.value)
+    ), o = i(() => e.deadline !== void 0), P = i(() => it(e)), R = j(""), y = lt(
+      () => ({
+        from: e.from,
+        value: p.value,
+        duration: e.duration,
+        delay: e.delay,
+        speed: e.speed,
+        easing: e.easing,
+        interpolate: e.interpolate,
+        loop: e.loop,
+        alternate: e.alternate,
+        interrupt: e.interrupt,
+        queueLimit: e.queueLimit,
+        updateInterval: e.updateInterval,
+        fps: e.fps,
+        disabled: e.disabled || e.animationMotion === "off",
+        pauseWhenHidden: e.pauseWhenHidden,
+        autoPlay: !1,
+        autoUpdate: !1
+      }),
+      (t, a) => {
+        T(t, a), t === "end" && e.announce && (R.value = _(
+          P.value.format(a.value).text
+        ));
+      }
+    ), {
+      frame: g,
+      motionEnabled: F,
+      play: Se,
+      pause: Te,
+      resume: Pe,
+      stop: oe,
+      reset: Ve,
+      restart: L,
+      reverse: Ae,
+      seek: Ne,
+      finishAnimation: Ce
+    } = y, d = j(
+      ae(e.from ?? p.value, p.value, e.changeThreshold)
+    ), {
+      remaining: q,
+      parts: ue,
+      milliseconds: De
+    } = ot(
+      () => e.deadline,
+      () => e.format,
+      () => e.pauseWhenHidden,
+      (t) => T("change", t),
+      () => {
+        T("finish"), e.announce && (R.value = _(f.value.text));
       }
-      const a = performance.now(), o = (l) => {
-        const R = Math.max(0, Math.min(1, (l - a) / u)), W = 1 - (1 - R) ** 3;
-        s.value = R === 1 ? e : n * (1 - W) + e * W, R < 1 && (p = requestAnimationFrame(o));
-      };
-      p = requestAnimationFrame(o);
+    ), K = i(
+      () => e.trigger === void 0 ? ["mount", "update"] : typeof e.trigger == "string" ? [e.trigger] : e.trigger
+    ), c = (t) => K.value.includes(t) && !K.value.includes("manual"), E = (t) => {
+      if (!c(t) || o.value) return !1;
+      try {
+        return typeof e.canPlay == "function" ? e.canPlay(t, p.value) : e.canPlay !== !1;
+      } catch {
+        return !1;
+      }
+    };
+    let v, V = !1, N = !1, C = !1, I = !1;
+    const D = j(!1);
+    function A(t) {
+      return E(t) ? (t === "activate" || t === "visible" || g.value.to === p.value ? L() : y.updateTarget(p.value), I = !1, !0) : !1;
+    }
+    function se() {
+      const t = !N || !e.visibleOnce, a = ["delayed", "paused", "playing"].includes(g.value.status);
+      I && E("update") ? (y.updateTarget(p.value), I = !1, c("visible") && (N = !0)) : t && !(e.pauseOutside && a) && A("visible") && (N = !0);
     }
-    E([() => t.value, () => t.duration, P], q);
-    const f = c(() => {
-      const e = t.deadline instanceof Date ? t.deadline.getTime() : t.deadline;
-      return e !== void 0 && Number.isFinite(e) ? e : void 0;
-    }), w = () => f.value === void 0 ? 0 : Math.max(
-      0,
-      Math.min(Number.MAX_SAFE_INTEGER, f.value - Date.now())
-    ), i = G(w()), D = c(
-      () => t.format.match(/\[[^\]]*\]|SSS|DD?|HH?|mm?|ss?|[\s\S]/g) ?? []
-    ), h = c(() => D.value.includes("SSS"));
-    let H, T, k;
-    function y() {
-      if (clearTimeout(H), !d || f.value === void 0) return;
-      const e = f.value;
-      if (i.value = w(), i.value !== k && (k = i.value, j("change", i.value)), i.value === 0) {
-        T !== e && (T = e, j("finish"));
+    function re() {
+      if (v == null || v.disconnect(), v = void 0, !V || o.value || !c("visible") && !e.pauseOutside) {
+        D.value = !1, y.hold(!1);
         return;
       }
-      const n = h.value ? 16 : 1e3;
-      H = setTimeout(
-        y,
-        h.value ? n : i.value % n || n
-      );
+      if (typeof IntersectionObserver > "u" || !w.value) {
+        D.value = !1, C = !0, y.hold(!1), se();
+        return;
+      }
+      C = !1, D.value = !0, y.hold(!!e.pauseOutside || c("visible"));
+      const t = ke(e.visibilityThreshold, 0.2, 0, 1);
+      v = new IntersectionObserver(
+        ([a]) => {
+          if (!V || !a) return;
+          const n = a.isIntersecting && a.intersectionRatio >= t, x = n && !C;
+          C = n, x && se(), y.hold(
+            !n && (!!e.pauseOutside || c("visible") && !N)
+          );
+        },
+        { threshold: t }
+      ), v.observe(w.value);
     }
-    E(f, () => {
-      T = void 0, k = void 0, i.value = w(), q(), y();
-    }), E(h, y);
-    function z() {
-      d || (d = !0, s.value = F(t.value), y());
+    M(p, (t, a) => {
+      d.value = ae(a, t, e.changeThreshold), T("value-change", d.value), d.value.significant && T("threshold", d.value), E("update") && (c("visible") && D.value && !C && (!N || e.pauseOutside) ? I = !0 : y.updateTarget(t));
+    }), M(
+      () => e.changeThreshold,
+      (t) => {
+        d.value = ae(d.value.previous, p.value, t);
+      }
+    ), M(o, (t) => {
+      t ? oe() : y.sync();
+    }), M(
+      [
+        K,
+        () => e.pauseOutside,
+        () => e.visibilityThreshold,
+        o
+      ],
+      re,
+      { flush: "post" }
+    );
+    function de() {
+      V || (V = !0, re());
     }
-    function O() {
-      d = !1, clearTimeout(H), cancelAnimationFrame(p);
+    function ce() {
+      V = !1, v == null || v.disconnect(), v = void 0, D.value = !1;
     }
-    ee(z), te(z), ne(O), ae(O);
-    const J = c(() => {
-      const e = t.precision ?? t.decimals;
-      return e === void 0 && typeof s.value == "string" ? void 0 : e !== void 0 && Number.isFinite(e) ? Math.max(0, Math.min(20, Math.floor(e))) : 0;
-    });
-    function K() {
-      const e = me(s.value);
-      if (!e) return String(s.value);
-      const n = J.value, u = n === void 0 ? I(e) : I(de(e, n), n), [a, o] = u.split("."), l = t.groupSeparator ? a.replace(/\B(?=(\d{3})+(?!\d))/g, () => t.groupSeparator) : a;
-      return o === void 0 ? l : l + t.decimalSeparator + o;
+    Ze(() => {
+      de(), e.from !== void 0 && E("mount") && !c("visible") && L();
+    }), Je(() => {
+      V || (de(), A("activate"));
+    }), Qe(ce), Xe(ce);
+    const f = i((t) => {
+      const a = o.value ? {
+        text: ue.value.map(({ text: n }) => n).join(""),
+        unit: "",
+        parts: ue.value.map(({ text: n, numeric: x }) => ({
+          type: x ? "integer" : "literal",
+          value: n
+        }))
+      } : P.value.format(g.value.value);
+      return (t == null ? void 0 : t.text) === a.text && t.unit === a.unit && t.parts.length === a.parts.length && t.parts.every(
+        (n, x) => n.type === a.parts[x].type && n.value === a.parts[x].value
+      ) ? t : a;
+    }), U = i(() => f.value.text), h = i(() => ({
+      ...g.value,
+      value: o.value ? q.value : g.value.value,
+      displayValue: U.value,
+      unit: f.value.unit,
+      remaining: o.value ? q.value : void 0,
+      trend: d.value
+    })), G = i(() => {
+      const t = ne(e.animation, e.animationPresets);
+      return t.length ? t : ne(e.fallbackAnimation, e.animationPresets);
+    }), ve = i(
+      () => Object.fromEntries(
+        Object.entries(e.digitAnimations ?? {}).flatMap(([t, a]) => {
+          const n = ne(a, e.animationPresets);
+          return n.length ? [[t, n]] : [];
+        })
+      )
+    ), fe = i(() => ke(e.motionIntensity, 1, 0, 2)), Z = i(
+      () => e.animationMotion !== "simplified" && e.animationMotion !== "off" && fe.value > 0
+    ), me = i(
+      () => !o.value && Z.value && !u.digit && (G.value.some(({ entry: t }) => t) || Object.keys(ve.value).length > 0)
+    ), $e = i(() => {
+      if (!Z.value) return [];
+      if (me.value) return [];
+      const t = G.value.flatMap(
+        ({ effect: a, entry: n }) => a ? [a] : o.value && (n == null ? void 0 : n.name) === "flip-clock" ? ["flip"] : []
+      );
+      return t.length ? t : typeof e.effect == "string" ? [e.effect] : e.effect ?? [];
+    }), {
+      from: we,
+      to: Ee,
+      status: Ie,
+      running: He,
+      digitEffect: J,
+      visualStyle: je,
+      outgoingStyle: pe,
+      sliding: Me
+    } = ut(
+      e,
+      g,
+      h,
+      F,
+      o,
+      $e,
+      Z
+    ), H = i(
+      () => o.value ? f.value : P.value.format(we.value)
+    ), Q = i(
+      () => o.value ? f.value : P.value.format(Ee.value)
+    ), X = i(
+      () => He.value || d.value.direction === "none" ? g.value.direction : d.value.direction
+    ), We = i(() => {
+      var t;
+      if (!o.value) {
+        if (e.colorByDirection && X.value !== "none")
+          return X.value;
+        if (e.colorBySign) {
+          const a = ((t = nt(g.value.value)) == null ? void 0 : t.units) ?? 0n;
+          return a > 0n ? "up" : a < 0n ? "down" : void 0;
+        }
+      }
+    }), ye = i(
+      () => !!J.value && F.value && !De.value
+    ), Y = i(() => {
+      if (!(!e.formatter || u.formatter || u.default))
+        try {
+          return { value: e.formatter(h.value) };
+        } catch {
+          return;
+        }
+    }), ge = i(
+      () => !!(u.formatter || u.default || Y.value || u.digit)
+    ), ze = i(
+      () => ye.value && !ge.value && !o.value
+    ), he = i(
+      () => !o.value && (c("click") || c("hover"))
+    );
+    function _(t) {
+      return [
+        e.title,
+        [e.prefix, t, e.suffix].filter(Boolean).join(" ")
+      ].filter(Boolean).join(" ");
     }
-    function Q() {
-      let e = h.value ? Math.floor(i.value) : Math.ceil(i.value / 1e3) * 1e3;
-      const n = { D: 864e5, H: 36e5, m: 6e4, s: 1e3, S: 1 }, u = /* @__PURE__ */ new Map();
-      for (const [a, o] of Object.entries(n))
-        D.value.some(
-          (l) => l[0] === a && /^(D{1,2}|H{1,2}|m{1,2}|s{1,2}|SSS)$/.test(l)
-        ) && (u.set(a, Math.floor(e / o)), e %= o);
-      return D.value.map((a) => {
-        if (a.startsWith("[") && a.endsWith("]"))
-          return a.slice(1, -1);
-        const o = u.get(a[0]);
-        return o === void 0 ? a : String(o).padStart(a.length, "0");
-      }).join("");
+    function Re(t) {
+      t.target !== w.value || t.repeat || !c("click") || !["Enter", " "].includes(t.key) || (t.preventDefault(), A("click"));
     }
-    const S = c(() => t.deadline !== void 0), B = c(
-      () => S.value ? Q() : K()
-    ), g = c(() => ({
-      value: S.value ? i.value : s.value,
-      displayValue: B.value,
-      remaining: S.value ? i.value : void 0
-    })), Y = ({ value: e }) => e;
-    return L({ displayValue: B, remaining: i }), (e, n) => (m(), v("span", ie(b(X), { class: "hys-ui-motion-number" }), [
-      r.title || b(A).title ? (m(), v("span", fe, [
-        x(e.$slots, "title", {}, () => [
-          M(N(r.title), 1)
+    function Fe(t) {
+      const a = xe(t);
+      e.modelValue === void 0 && e.value === void 0 && (le.value = a), T("update:modelValue", a);
+    }
+    const Le = ({ value: t }) => t;
+    return Be({
+      displayValue: U,
+      remaining: q,
+      frame: g,
+      trend: d,
+      setValue: Fe,
+      play: Se,
+      pause: Te,
+      resume: Pe,
+      stop: oe,
+      restart: L,
+      reset: Ve,
+      reverse: Ae,
+      seek: Ne,
+      finishAnimation: Ce
+    }), (t, a) => (s(), r("span", Ye({
+      ref_key: "root",
+      ref: w
+    }, m(ie), {
+      class: "hys-ui-motion-number",
+      "data-tone": We.value,
+      "data-direction": X.value,
+      "data-status": o.value ? void 0 : m(Ie),
+      "data-appearance": l.appearance,
+      role: he.value && c("click") ? "button" : void 0,
+      tabindex: he.value ? 0 : void 0,
+      onClick: a[0] || (a[0] = (n) => A("click")),
+      onPointerenter: a[1] || (a[1] = (n) => A("hover")),
+      onFocus: a[2] || (a[2] = (n) => A("hover")),
+      onKeydown: Re
+    }), [
+      l.title || u.title ? (s(), r("span", ct, [
+        k(t.$slots, "title", {}, () => [
+          W(b(l.title), 1)
         ], !0)
-      ])) : V("", !0),
-      oe("span", {
+      ])) : B("", !0),
+      z("span", {
         class: "hys-ui-motion-number-value",
-        style: re(r.valueStyle),
-        role: S.value ? "timer" : void 0
+        style: ee(l.valueStyle),
+        role: o.value ? "timer" : void 0,
+        "aria-label": o.value && !ge.value ? _(U.value) : void 0
       }, [
-        r.prefix || b(A).prefix ? (m(), v("span", pe, [
-          x(e.$slots, "prefix", $(C(g.value)), () => [
-            M(N(r.prefix), 1)
-          ], !0)
-        ])) : V("", !0),
-        x(e.$slots, "formatter", $(C(g.value)), () => [
-          r.formatter ? (m(), se(Y, {
-            key: 0,
-            value: r.formatter(g.value)
-          }, null, 8, ["value"])) : (m(), v(ue, { key: 1 }, [
-            M(N(B.value), 1)
+        l.prefix || u.prefix ? (s(), r("span", ft, [
+          u.prefix ? k(t.$slots, "prefix", O(S(h.value)), void 0, !0, 0) : (s(), r($, { key: 1 }, [
+            W(b(l.prefix), 1)
+          ], 64))
+        ])) : B("", !0),
+        u.formatter ? k(t.$slots, "formatter", O(S(h.value)), void 0, !0, 1) : u.default ? k(t.$slots, "default", O(S(h.value)), void 0, !0, 2) : Y.value ? (s(), te(Le, {
+          key: 3,
+          value: Y.value.value
+        }, null, 8, ["value"])) : (s(), r("span", {
+          key: 4,
+          class: be(["hys-ui-motion-number-layout", {
+            "hys-number-stable": l.stableWidth,
+            "hys-number-sliding": m(Me)
+          }])
+        }, [
+          l.stableWidth && !o.value ? (s(), r($, { key: 0 }, [
+            z("span", mt, b(H.value.text), 1),
+            z("span", pt, b(Q.value.text), 1)
+          ], 64)) : B("", !0),
+          m(pe) ? (s(), r("span", {
+            key: 1,
+            class: "hys-ui-motion-number-outgoing",
+            "aria-hidden": "true",
+            style: ee(m(pe))
+          }, b(H.value.text), 5)) : B("", !0),
+          z("span", {
+            class: "hys-ui-motion-number-content",
+            style: ee(m(je))
+          }, [
+            me.value ? (s(), te(rt, {
+              key: 0,
+              current: f.value,
+              start: H.value,
+              end: Q.value,
+              glyphs: P.value.localized,
+              context: h.value,
+              plans: G.value,
+              "digit-plans": ve.value,
+              intensity: fe.value,
+              motion: m(F),
+              axis: l.axis,
+              theme: m(ie)["data-hys-theme"]
+            }, null, 8, ["current", "start", "end", "glyphs", "context", "plans", "digit-plans", "intensity", "motion", "axis", "theme"])) : m(J) || u.digit || l.appearance !== "plain" ? (s(), te(st, {
+              key: 1,
+              current: f.value,
+              start: H.value,
+              end: Q.value,
+              glyphs: P.value.localized,
+              context: h.value,
+              effect: m(J),
+              axis: l.axis,
+              order: l.digitOrder,
+              stagger: l.stagger,
+              duration: l.duration,
+              "digit-duration": l.digitDuration,
+              motion: ye.value,
+              timer: o.value,
+              accessible: ze.value,
+              split: l.appearance !== "plain"
+            }, _e({ _: 2 }, [
+              u.digit ? {
+                name: "digit",
+                fn: et((n) => [
+                  k(t.$slots, "digit", O(S(n)), void 0, !0)
+                ]),
+                key: "0"
+              } : void 0
+            ]), 1032, ["current", "start", "end", "glyphs", "context", "effect", "axis", "order", "stagger", "duration", "digit-duration", "motion", "timer", "accessible", "split"])) : (s(!0), r($, { key: 2 }, tt(f.value.parts, ({ type: n, value: x }, qe) => (s(), r("span", {
+              key: qe,
+              class: be({
+                "hys-ui-motion-number-separator": n === "group" || n === "decimal"
+              })
+            }, b(x), 3))), 128)),
+            f.value.unit || u.unit ? (s(), r("span", yt, [
+              u.unit ? k(t.$slots, "unit", O(S(h.value)), void 0, !0, 0) : (s(), r($, { key: 1 }, [
+                W(b(f.value.unit), 1)
+              ], 64))
+            ])) : B("", !0)
+          ], 4)
+        ], 2)),
+        l.suffix || u.suffix ? (s(), r("span", gt, [
+          u.suffix ? k(t.$slots, "suffix", O(S(h.value)), void 0, !0, 0) : (s(), r($, { key: 1 }, [
+            W(b(l.suffix), 1)
           ], 64))
-        ], !0),
-        r.suffix || b(A).suffix ? (m(), v("span", he, [
-          x(e.$slots, "suffix", $(C(g.value)), () => [
-            M(N(r.suffix), 1)
-          ], !0)
-        ])) : V("", !0)
-      ], 12, ve)
-    ], 16));
+        ])) : B("", !0)
+      ], 12, vt),
+      u.trend ? k(t.$slots, "trend", O(S(d.value)), void 0, !0, 1) : B("", !0),
+      l.announce ? (s(), r("span", ht, b(R.value), 1)) : B("", !0)
+    ], 16, dt));
   }
 });
 export {
-  xe as default
+  Nt as default
 };

package/dist/components/HysAnimatedNumber/NumberAnimationCanvas/NumberAnimationCanvas.vue.js

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