hys-ui 0.2.0 → 0.3.0

package/dist/components/HysSlider/HysSlider2.vue.js

@@ -1,19 +1,21 @@
-import { defineComponent as ma, inject as Ge, useAttrs as ha, useId as xe, ref as R, shallowRef as Ee, computed as g, watch as Le, onMounted as ya, onActivated as ba, nextTick as Se, onDeactivated as pa, onBeforeUnmount as ga, openBlock as f, createElementBlock as w, mergeProps as wa, unref as h, toDisplayString as re, createCommentVNode as j, createElementVNode as ie, normalizeStyle as ne, normalizeClass as ge, withModifiers as Je, Fragment as oe, renderList as se, renderSlot as Ne, createBlock as Qe, withCtx as ka, createTextVNode as Ze } from "vue";
-import Ma from "../HysNumberInput/HysNumberInput.vue.js";
-import Ba from "./SliderTooltip.vue.js";
-import { useHysControlState as xa, fieldKey as Ea, formKey as La } from "../../composables/formContext.js";
-import { decimalText as H, decimalAdd as U, decimal as y, normalizeDecimal as _e } from "../../composables/numberInput.js";
-import { useHysRootAttrs as Sa } from "../../config.js";
-const Na = ["id"], Ca = { class: "hys-ui-slider-layout" }, Va = ["id", "tabindex", "aria-label", "aria-labelledby", "aria-valuemin", "aria-valuemax", "aria-valuenow", "aria-valuetext", "aria-orientation", "aria-disabled", "aria-readonly", "aria-required", "aria-invalid", "aria-describedby", "onPointerdown", "onKeydown", "onMouseenter", "onFocus"], za = { class: "hys-ui-slider-handle" }, Aa = {
+import { defineComponent as fa, inject as Ge, useAttrs as ma, useId as xe, ref as A, shallowRef as Ee, computed as g, watch as Le, onMounted as ha, onActivated as pa, nextTick as Se, onDeactivated as ya, onBeforeUnmount as ba, openBlock as m, createElementBlock as w, mergeProps as ga, unref as h, toDisplayString as ie, createCommentVNode as K, createElementVNode as re, normalizeStyle as ne, normalizeClass as ge, withModifiers as Je, Fragment as oe, renderList as se, renderSlot as Ne, createVNode as wa, withCtx as ka, createTextVNode as Qe, createBlock as Ma } from "vue";
+import Ba from "../HysNumberInput/HysNumberInput.vue.js";
+import xa from "./SliderTooltip.vue.js";
+import { useHysControlState as Ea, fieldKey as La, formKey as Sa } from "../../composables/formContext.js";
+import { decimalText as j, decimalAdd as U, decimal as p, normalizeDecimal as Ze } from "../../composables/numberInput.js";
+import { useHysRootAttrs as Na } from "../../config.js";
+const Ta = ["id"], Va = { class: "hys-ui-slider-layout" }, Ca = ["id", "tabindex", "aria-label", "aria-labelledby", "aria-valuemin", "aria-valuemax", "aria-valuenow", "aria-valuetext", "aria-orientation", "aria-disabled", "aria-readonly", "aria-required", "aria-invalid", "aria-describedby", "onPointerdown", "onKeydown", "onMouseenter", "onFocus"], za = { class: "hys-ui-slider-handle" }, Aa = {
   key: 0,
   class: "hys-ui-slider-marks"
-}, Ra = ["disabled", "onClick"], Ta = {
+}, Ra = ["disabled", "onClick"], Pa = {
   key: 0,
   class: "hys-ui-slider-inputs"
-}, Pa = ["name", "value", "disabled"], Ia = ["id"], Xa = /* @__PURE__ */ ma({
+}, Ia = ["name", "value", "disabled"], Da = ["id"], Ya = /* @__PURE__ */ fa({
   inheritAttrs: !1,
   __name: "HysSlider",
   props: {
+    popupTransition: {},
+    popupTransitionDuration: {},
     modelValue: {},
     defaultValue: {},
     range: { type: Boolean, default: void 0 },
@@ -51,138 +53,138 @@ const Na = ["id"], Ca = { class: "hys-ui-slider-layout" }, Va = ["id", "tabindex
     error: {}
   },
   emits: ["update:modelValue", "input", "change", "dragStart", "dragEnd", "focus", "blur"],
-  setup(o, { expose: ea, emit: aa }) {
-    const l = o, T = aa, {
-      disabled: Ce,
+  setup(o, { expose: _e, emit: ea }) {
+    const l = o, R = ea, {
+      disabled: Te,
       size: Ve,
-      label: ze
-    } = xa(l), S = Ge(Ea, void 0), we = Ge(La, void 0), q = ha(), ta = Sa(), la = xe(), Ae = xe(), ke = xe(), ve = R(), m = R(), W = Ee({ width: 0, height: 0 }), de = R([]), Re = Ee(
+      label: Ce
+    } = Ea(l), S = Ge(La, void 0), we = Ge(Sa, void 0), q = ma(), aa = Na(), ta = xe(), ze = xe(), ke = xe(), ve = A(), f = A(), W = Ee({ width: 0, height: 0 }), de = A([]), Ae = Ee(
       l.defaultValue ?? (l.range ? [l.min, l.max] : l.min)
-    ), V = Ee(), Te = g(
-      () => l.modelValue === void 0 ? Re.value : l.modelValue
-    ), c = g(() => l.range ?? Array.isArray(Te.value)), i = g(() => Number.isFinite(l.min) ? l.min : 0), s = g(
-      () => Number.isFinite(l.max) ? Math.max(i.value, l.max) : Math.max(i.value, 100)
+    ), V = Ee(), Re = g(
+      () => l.modelValue === void 0 ? Ae.value : l.modelValue
+    ), c = g(() => l.range ?? Array.isArray(Re.value)), r = g(() => Number.isFinite(l.min) ? l.min : 0), s = g(
+      () => Number.isFinite(l.max) ? Math.max(r.value, l.max) : Math.max(r.value, 100)
     ), M = g(
       () => Object.entries(l.marks ?? {}).map(([e, a]) => ({
         value: Number(e),
         label: typeof a == "string" ? a : a.label,
         style: typeof a == "string" ? void 0 : a.style
       })).filter(
-        (e) => Number.isFinite(e.value) && e.value >= i.value && e.value <= s.value
+        (e) => Number.isFinite(e.value) && e.value >= r.value && e.value <= s.value
       ).sort((e, a) => e.value - a.value)
     ), x = g(() => l.step === "mark" || l.step === null), G = g(
       () => typeof l.step == "number" && Number.isFinite(l.step) && l.step > 0 ? l.step : 1
-    ), ua = g(
-      () => l.max < i.value || s.value <= i.value || x.value && !M.value.length
-    ), z = g(() => Ce.value || ua.value), P = g(() => !z.value && !l.readonly), ce = g(
+    ), la = g(
+      () => l.max < r.value || s.value <= r.value || x.value && !M.value.length
+    ), C = g(() => Te.value || la.value), P = g(() => !C.value && !l.readonly), ce = g(
       () => {
         var e, a;
         return l.error || l.status === "error" || (e = S == null ? void 0 : S.invalid) != null && e.value ? "error" : l.status ?? ((a = S == null ? void 0 : S.status) == null ? void 0 : a.value);
       }
     );
     function J(e) {
-      var r;
-      const a = Number.isFinite(e) ? Math.max(i.value, Math.min(s.value, e)) : i.value;
+      var i;
+      const a = Number.isFinite(e) ? Math.max(r.value, Math.min(s.value, e)) : r.value;
       if (x.value) {
-        let v = ((r = M.value[0]) == null ? void 0 : r.value) ?? i.value;
+        let v = ((i = M.value[0]) == null ? void 0 : i.value) ?? r.value;
         for (const d of M.value)
           Math.abs(d.value - a) < Math.abs(v - a) && (v = d.value);
         return v;
       }
       if (a === s.value) return a;
-      const t = _e(y(a), {
-        step: y(G.value),
-        base: y(i.value),
-        min: y(i.value),
-        max: y(s.value),
+      const t = Ze(p(a), {
+        step: p(G.value),
+        base: p(r.value),
+        min: p(r.value),
+        max: p(s.value),
         strict: !0
-      }), u = t ? Number(H(t)) : i.value;
+      }), u = t ? Number(j(t)) : r.value;
       return Math.abs(s.value - a) < Math.abs(u - a) ? s.value : u;
     }
     function Pe(e) {
       const a = Array.isArray(e) ? e : [e];
       return c.value ? [J(a[0]), J(a[1] ?? s.value)].sort(
-        (u, r) => u - r
+        (u, i) => u - i
       ) : [J(a[0])];
     }
-    const Q = g(() => Pe(Te.value)), n = g(() => V.value ?? Q.value), k = R(!1), I = R(), fe = R(), E = R(0), Z = R(!1);
-    let N = !0, A = 0, _ = 0, $, X, F, ee, C, ae, te = [], me = 0;
-    const he = (e, a) => e.length === a.length && e.every((t, u) => t === a[u]), Y = (e) => c.value ? [e[0], e[1]] : e[0], ra = () => Object.fromEntries(
+    const Q = g(() => Pe(Re.value)), n = g(() => V.value ?? Q.value), k = A(!1), I = A(), fe = A(), E = A(0), Z = A(!1);
+    let N = !0, z = 0, _ = 0, D, H, $, ee, T, ae, te = [], me = 0;
+    const he = (e, a) => e.length === a.length && e.every((t, u) => t === a[u]), X = (e) => c.value ? [e[0], e[1]] : e[0], ua = () => Object.fromEntries(
       Object.entries(q).filter(
         ([e]) => e !== "id" && !e.startsWith("aria-")
       )
     );
     function Ie(e) {
-      const a = l.ariaLabel || q["aria-label"] || l.label || ze.value || "数值";
+      const a = l.ariaLabel || q["aria-label"] || l.label || Ce.value || "数值";
       return c.value ? e === 0 ? l.rangeStartLabel || a + "下限" : l.rangeEndLabel || a + "上限" : a;
     }
-    function ye(e) {
+    function pe(e) {
       try {
         return l.formatTooltip ? l.formatTooltip(e) : String(e);
       } catch {
         return String(e);
       }
     }
-    function $e(e, a) {
-      return l.showTooltip && ye(a) !== null && (l.tooltipVisible ?? (I.value === e || fe.value === e || k.value && E.value === e));
+    function De(e, a) {
+      return l.showTooltip && pe(a) !== null && (l.tooltipVisible ?? (I.value === e || fe.value === e || k.value && E.value === e));
     }
     function ia(e) {
       var a;
       try {
-        return ((a = l.formatValueText) == null ? void 0 : a.call(l, e)) ?? String(ye(e) ?? e);
+        return ((a = l.formatValueText) == null ? void 0 : a.call(l, e)) ?? String(pe(e) ?? e);
       } catch {
         return String(e);
       }
     }
-    const Fe = (e) => s.value === i.value ? 0 : Math.max(
+    const $e = (e) => s.value === r.value ? 0 : Math.max(
       0,
-      Math.min(1, (e - i.value) / (s.value - i.value))
-    ), D = (e) => 100 * (l.reverse ? 1 - Fe(e) : Fe(e)), De = (e) => l.vertical ? { bottom: D(e) + "%" } : { left: D(e) + "%" }, na = (e) => ({
-      transform: l.vertical ? `translate3d(-50%, ${W.value.height * (1 - D(e) / 100)}px, 0) translateY(-50%)` : `translate3d(${W.value.width * D(e) / 100}px, -50%, 0) translateX(-50%)`
-    }), oa = g(() => {
-      const e = D(c.value ? n.value[0] : i.value), a = D(n.value[c.value ? 1 : 0]);
+      Math.min(1, (e - r.value) / (s.value - r.value))
+    ), F = (e) => 100 * (l.reverse ? 1 - $e(e) : $e(e)), Fe = (e) => l.vertical ? { bottom: F(e) + "%" } : { left: F(e) + "%" }, ra = (e) => ({
+      transform: l.vertical ? `translate3d(-50%, ${W.value.height * (1 - F(e) / 100)}px, 0) translateY(-50%)` : `translate3d(${W.value.width * F(e) / 100}px, -50%, 0) translateX(-50%)`
+    }), na = g(() => {
+      const e = F(c.value ? n.value[0] : r.value), a = F(n.value[c.value ? 1 : 0]);
       return l.vertical ? {
         transform: `translate3d(-50%, ${100 - Math.max(e, a)}%, 0) scaleY(${Math.abs(a - e) / 100})`
       } : {
         transform: `translate3d(${Math.min(e, a)}%, -50%, 0) scaleX(${Math.abs(a - e) / 100})`
       };
-    }), sa = g(() => {
+    }), oa = g(() => {
       if (!l.showStops) return [];
-      if (x.value) return M.value.map((r) => r.value);
-      const e = Math.floor((s.value - i.value) / G.value), a = Math.max(2, Math.min(1e3, Math.floor(l.maxStops || 200))), t = Math.max(1, Math.ceil(e / a)), u = [];
-      for (let r = 1; r < e && u.length < a; r += t)
+      if (x.value) return M.value.map((i) => i.value);
+      const e = Math.floor((s.value - r.value) / G.value), a = Math.max(2, Math.min(1e3, Math.floor(l.maxStops || 200))), t = Math.max(1, Math.ceil(e / a)), u = [];
+      for (let i = 1; i < e && u.length < a; i += t)
         u.push(
           Number(
-            H(
-              U(y(i.value), y(G.value), r)
+            j(
+              U(p(r.value), p(G.value), i)
             )
           )
         );
       return u;
     });
-    function be(e) {
+    function ye(e) {
       if (!N || !P.value || he(e, n.value)) return !1;
-      V.value = e, $ = e;
+      V.value = e, D = e;
       const a = ++_;
-      return l.modelValue === void 0 && (Re.value = Y(e)), T("update:modelValue", Y(e)), T("input", Y(e)), Se(() => {
-        !N || a !== _ || ((!he(Q.value, e) || !k.value) && (V.value = void 0), $ = void 0);
+      return l.modelValue === void 0 && (Ae.value = X(e)), R("update:modelValue", X(e)), R("input", X(e)), Se(() => {
+        !N || a !== _ || ((!he(Q.value, e) || !k.value) && (V.value = void 0), D = void 0);
       }), !0;
     }
     function le(e) {
-      const a = A;
+      const a = z;
       Se(() => {
-        N && a === A && P.value && !he(Q.value, e) && T("change", Y(Q.value));
+        N && a === z && P.value && !he(Q.value, e) && R("change", X(Q.value));
       });
     }
     function ue(e, a) {
       const t = [...n.value];
       return t[e] = Math.max(
-        e === 1 ? t[0] : i.value,
+        e === 1 ? t[0] : r.value,
         Math.min(
           c.value && e === 0 ? t[1] : s.value,
           J(a)
         )
-      ), be(t);
+      ), ye(t);
     }
     function Oe(e) {
       if (!c.value) return 0;
@@ -190,91 +192,91 @@ const Na = ["id"], Ca = { class: "hys-ui-slider-layout" }, Va = ["id", "tabindex
       return a === t ? I.value ?? (e < n.value[0] ? 0 : 1) : a < t ? 0 : 1;
     }
     function je(e, a) {
-      var r;
-      const t = ee ?? ((r = m.value) == null ? void 0 : r.getBoundingClientRect());
-      if (!t) return i.value;
+      var i;
+      const t = ee ?? ((i = f.value) == null ? void 0 : i.getBoundingClientRect());
+      if (!t) return r.value;
       let u = l.vertical ? (t.bottom - a) / (t.height || 1) : (e - t.left) / (t.width || 1);
-      return l.reverse && (u = 1 - u), i.value + Math.max(0, Math.min(1, u)) * (s.value - i.value);
+      return l.reverse && (u = 1 - u), r.value + Math.max(0, Math.min(1, u)) * (s.value - r.value);
     }
     function He() {
-      if (X = void 0, !k.value || !F || !N) return;
-      const e = je(F.x, F.y);
+      if (H = void 0, !k.value || !$ || !N) return;
+      const e = je($.x, $.y);
       if (Z.value) {
-        const a = e - me, t = U(y(te[1]), y(te[0]), -1), u = Number(
-          H(U(y(s.value), t, -1))
+        const a = e - me, t = U(p(te[1]), p(te[0]), -1), u = Number(
+          j(U(p(s.value), t, -1))
         );
-        let r = J(te[0] + a);
-        r = Math.max(i.value, Math.min(u, r)), be([r, Number(H(U(y(r), t)))]);
+        let i = J(te[0] + a);
+        i = Math.max(r.value, Math.min(u, i)), ye([i, Number(j(U(p(i), t)))]);
       } else ue(E.value, e);
     }
     function Me(e) {
-      return e.pointerId === void 0 || C === void 0 || e.pointerId === C;
+      return e.pointerId === void 0 || T === void 0 || e.pointerId === T;
     }
     function Xe(e) {
-      !k.value || !Me(e) || (F = { x: e.clientX, y: e.clientY }, e.cancelable && e.preventDefault(), X === void 0 && (X = requestAnimationFrame(He)));
+      !k.value || !Me(e) || ($ = { x: e.clientX, y: e.clientY }, e.cancelable && e.preventDefault(), H === void 0 && (H = requestAnimationFrame(He)));
     }
     function B(e = !1, a = !1) {
-      var r, v;
+      var i, v;
       if (!k.value) return;
-      X !== void 0 && cancelAnimationFrame(X), X = void 0, !e && F && He();
+      H !== void 0 && cancelAnimationFrame(H), H = void 0, !e && $ && He();
       const t = te.slice(), u = { index: E.value, track: Z.value, cancelled: e };
-      k.value = !1, F = void 0, ae == null || ae(), ae = void 0;
+      k.value = !1, $ = void 0, ae == null || ae(), ae = void 0;
       try {
-        C !== void 0 && ((v = (r = m.value) == null ? void 0 : r.hasPointerCapture) != null && v.call(r, C)) && m.value.releasePointerCapture(C);
+        T !== void 0 && ((v = (i = f.value) == null ? void 0 : i.hasPointerCapture) != null && v.call(i, T)) && f.value.releasePointerCapture(T);
       } catch {
       }
-      C = void 0, e ? (A++, a && P.value ? be(t) : V.value = void 0) : le(t), N && T("dragEnd", Y(n.value), u);
+      T = void 0, e ? (z++, a && P.value ? ye(t) : V.value = void 0) : le(t), N && R("dragEnd", X(n.value), u);
     }
     function Be(e, a, t = !1) {
-      var O, p, We;
-      if (!N || !P.value || e.button !== 0 && e.pointerType !== "touch" || !m.value || (B(!0), A++, ee = m.value.getBoundingClientRect(), l.vertical ? !ee.height : !ee.width)) return;
-      e.preventDefault(), C = e.pointerId, te = [...n.value], me = je(e.clientX, e.clientY), Z.value = t && c.value && !!l.draggableTrack && !x.value, E.value = a ?? Oe(me), k.value = !0, I.value = E.value, (O = de.value[E.value]) == null || O.focus({ preventScroll: !0 }), T("dragStart", Y(n.value), {
+      var O, b, We;
+      if (!N || !P.value || e.button !== 0 && e.pointerType !== "touch" || !f.value || (B(!0), z++, ee = f.value.getBoundingClientRect(), l.vertical ? !ee.height : !ee.width)) return;
+      e.preventDefault(), T = e.pointerId, te = [...n.value], me = je(e.clientX, e.clientY), Z.value = t && c.value && !!l.draggableTrack && !x.value, E.value = a ?? Oe(me), k.value = !0, I.value = E.value, (O = de.value[E.value]) == null || O.focus({ preventScroll: !0 }), R("dragStart", X(n.value), {
         index: E.value,
         track: Z.value,
         cancelled: !1
       }), a === void 0 && !Z.value && ue(E.value, me);
       const u = (L) => {
-        Me(L) && (Number.isFinite(L.clientX) && Number.isFinite(L.clientY) && (F = { x: L.clientX, y: L.clientY }), B());
-      }, r = (L) => {
+        Me(L) && (Number.isFinite(L.clientX) && Number.isFinite(L.clientY) && ($ = { x: L.clientX, y: L.clientY }), B());
+      }, i = (L) => {
         Me(L) && B(!0);
       }, v = () => B(!0), d = () => {
         var L;
-        ee = (L = m.value) == null ? void 0 : L.getBoundingClientRect();
+        ee = (L = f.value) == null ? void 0 : L.getBoundingClientRect();
       };
-      document.addEventListener("pointermove", Xe, { passive: !1 }), document.addEventListener("pointerup", u), document.addEventListener("pointercancel", r), document.addEventListener("scroll", d, !0), window.addEventListener("resize", d), window.addEventListener("blur", v);
-      const b = typeof ResizeObserver < "u" ? new ResizeObserver(d) : void 0;
-      b == null || b.observe(m.value), ae = () => {
-        document.removeEventListener("pointermove", Xe), document.removeEventListener("pointerup", u), document.removeEventListener("pointercancel", r), document.removeEventListener("scroll", d, !0), window.removeEventListener("resize", d), window.removeEventListener("blur", v), b == null || b.disconnect();
+      document.addEventListener("pointermove", Xe, { passive: !1 }), document.addEventListener("pointerup", u), document.addEventListener("pointercancel", i), document.addEventListener("scroll", d, !0), window.addEventListener("resize", d), window.addEventListener("blur", v);
+      const y = typeof ResizeObserver < "u" ? new ResizeObserver(d) : void 0;
+      y == null || y.observe(f.value), ae = () => {
+        document.removeEventListener("pointermove", Xe), document.removeEventListener("pointerup", u), document.removeEventListener("pointercancel", i), document.removeEventListener("scroll", d, !0), window.removeEventListener("resize", d), window.removeEventListener("blur", v), y == null || y.disconnect();
       };
       try {
-        C !== void 0 && ((We = (p = m.value).setPointerCapture) == null || We.call(p, C));
+        T !== void 0 && ((We = (b = f.value).setPointerCapture) == null || We.call(b, T));
       } catch {
       }
     }
-    function va(e, a, t) {
+    function sa(e, a, t) {
       if (x.value) {
-        const d = M.value.map((O) => O.value), b = d.indexOf(e);
+        const d = M.value.map((O) => O.value), y = d.indexOf(e);
         return d[Math.max(
           0,
           Math.min(
             d.length - 1,
-            (b < 0 ? 0 : b) + a * t
+            (y < 0 ? 0 : y) + a * t
           )
         )] ?? e;
       }
-      const u = y(G.value), r = y(i.value), v = _e(y(s.value), {
+      const u = p(G.value), i = p(r.value), v = Ze(p(s.value), {
         step: u,
-        base: r,
-        min: r,
-        max: y(s.value),
+        base: i,
+        min: i,
+        max: p(s.value),
         strict: !0
       });
-      return a < 0 && e === s.value && Number(H(v)) !== e ? Number(H(U(v, u, -(t - 1)))) : Number(
-        H(U(y(e), u, a * t))
+      return a < 0 && e === s.value && Number(j(v)) !== e ? Number(j(U(v, u, -(t - 1)))) : Number(
+        j(U(p(e), u, a * t))
       );
     }
-    function da(e, a) {
-      var d, b;
+    function va(e, a) {
+      var d, y;
       if (e.isComposing || e.keyCode === 229) return;
       if (e.key === "Escape" && k.value) {
         e.preventDefault(), B(!0, !0);
@@ -283,34 +285,34 @@ const Na = ["id"], Ca = { class: "hys-ui-slider-layout" }, Va = ["id", "tabindex
       const t = ["ArrowRight", "ArrowUp", "PageUp"], u = ["ArrowLeft", "ArrowDown", "PageDown"];
       if (![...t, ...u, "Home", "End"].includes(e.key) || !P.value || !l.keyboard) return;
       e.preventDefault(), k.value && B(!0);
-      const r = [...n.value];
+      const i = [...n.value];
       let v;
-      e.key === "Home" ? v = x.value ? ((d = M.value[0]) == null ? void 0 : d.value) ?? i.value : i.value : e.key === "End" ? v = x.value ? ((b = M.value.at(-1)) == null ? void 0 : b.value) ?? s.value : s.value : v = va(
+      e.key === "Home" ? v = x.value ? ((d = M.value[0]) == null ? void 0 : d.value) ?? r.value : r.value : e.key === "End" ? v = x.value ? ((y = M.value.at(-1)) == null ? void 0 : y.value) ?? s.value : s.value : v = sa(
         n.value[a],
         (t.includes(e.key) ? 1 : -1) * (l.reverse ? -1 : 1),
         e.key.startsWith("Page") || e.shiftKey ? 10 : 1
-      ), ue(a, v) && le(r);
+      ), ue(a, v) && le(i);
     }
-    function ca(e) {
+    function da(e) {
       const a = [...n.value];
-      be(Pe(e)) && le(a);
+      ye(Pe(e)) && le(a);
     }
-    function fa(e) {
+    function ca(e) {
       if (!P.value) return;
       const a = [...n.value];
       ue(Oe(e), e) && le(a);
     }
     function Ye(e = 0) {
       var a;
-      z.value || (a = de.value[Math.max(0, Math.min(n.value.length - 1, e))]) == null || a.focus();
+      C.value || (a = de.value[Math.max(0, Math.min(n.value.length - 1, e))]) == null || a.focus();
     }
     function Ke() {
-      Ue(), B(!0), N = !1, A++, _++, $ = void 0, V.value = void 0, I.value = void 0, fe.value = void 0;
+      Ue(), B(!0), N = !1, z++, _++, D = void 0, V.value = void 0, I.value = void 0, fe.value = void 0;
     }
     Le(
       () => l.modelValue,
       () => {
-        $ && he(Q.value, $) || (B(!0), A++, _++, V.value = void 0, $ = void 0);
+        D && he(Q.value, D) || (B(!0), z++, _++, V.value = void 0, D = void 0);
       },
       { deep: !0, flush: "sync" }
     ), Le(
@@ -321,39 +323,39 @@ const Na = ["id"], Ca = { class: "hys-ui-slider-layout" }, Va = ["id", "tabindex
         () => l.range,
         () => l.vertical,
         () => l.reverse,
-        () => Ce.value,
+        () => Te.value,
         () => l.readonly,
         // Inline marks objects may be recreated by every model update. Only a
         // changed set of available stops affects an active mark-only interaction.
         () => x.value ? M.value.map((e) => e.value).join(",") : ""
       ],
       () => {
-        B(!0), A++, V.value = void 0;
+        B(!0), z++, V.value = void 0;
       }
     ), Le(
       () => we == null ? void 0 : we.resetting.value,
       (e) => {
-        e && (B(!0), A++, _++, $ = void 0, V.value = void 0);
+        e && (B(!0), z++, _++, D = void 0, V.value = void 0);
       },
       { flush: "sync" }
     );
-    let K;
-    function pe() {
-      if (!N || !m.value) return;
-      const e = m.value.clientWidth || m.value.getBoundingClientRect().width, a = m.value.clientHeight || m.value.getBoundingClientRect().height;
+    let Y;
+    function be() {
+      if (!N || !f.value) return;
+      const e = f.value.clientWidth || f.value.getBoundingClientRect().width, a = f.value.clientHeight || f.value.getBoundingClientRect().height;
       (e !== W.value.width || a !== W.value.height) && (W.value = { width: e, height: a });
     }
     function Ue() {
-      K == null || K.disconnect(), K = void 0, window.removeEventListener("resize", pe);
+      Y == null || Y.disconnect(), Y = void 0, window.removeEventListener("resize", be);
     }
     function qe() {
-      Ue(), pe(), typeof ResizeObserver < "u" && m.value && (K = new ResizeObserver(pe), K.observe(m.value)), window.addEventListener("resize", pe);
+      Ue(), be(), typeof ResizeObserver < "u" && f.value && (Y = new ResizeObserver(be), Y.observe(f.value)), window.addEventListener("resize", be);
     }
-    return ya(() => {
+    return ha(() => {
       qe(), l.autofocus && Ye();
-    }), ba(() => {
+    }), pa(() => {
       N = !0, Se(qe);
-    }), pa(Ke), ga(Ke), ea({
+    }), ya(Ke), ba(Ke), _e({
       element: ve,
       dragging: k,
       values: n,
@@ -363,16 +365,16 @@ const Na = ["id"], Ca = { class: "hys-ui-slider-layout" }, Va = ["id", "tabindex
         const e = document.activeElement;
         e && ((a = ve.value) != null && a.contains(e)) && e.blur();
       },
-      setValue: ca,
+      setValue: da,
       cancel: () => B(!0, !0)
-    }), (e, a) => (f(), w("div", wa({ ...h(ta), ...ra() }, {
+    }), (e, a) => (m(), w("div", ga({ ...h(aa), ...ua() }, {
       ref_key: "root",
       ref: ve,
       class: ["hys-ui-slider-wrap hys-ui-ex-field", [
         "hys-ui-slider-" + h(Ve),
         {
           "hys-ui-slider-vertical": o.vertical,
-          "hys-ui-slider-disabled": z.value,
+          "hys-ui-slider-disabled": C.value,
           "hys-ui-slider-readonly": o.readonly,
           "hys-ui-slider-dragging": k.value,
           "hys-ui-slider-error": ce.value === "error",
@@ -381,170 +383,172 @@ const Na = ["id"], Ca = { class: "hys-ui-slider-layout" }, Va = ["id", "tabindex
         }
       ]]
     }), [
-      o.showValue ? (f(), w("span", {
+      o.showValue ? (m(), w("span", {
         key: 0,
-        id: h(la),
+        id: h(ta),
         class: "hys-ui-slider-value"
-      }, re(o.label || h(ze) || "数值") + "：" + re(n.value.map((t) => ye(t) ?? t).join(" ~ ")), 9, Na)) : j("", !0),
-      ie("div", Ca, [
-        ie("div", {
+      }, ie(o.label || h(Ce) || "数值") + "：" + ie(n.value.map((t) => pe(t) ?? t).join(" ~ ")), 9, Ta)) : K("", !0),
+      re("div", Va, [
+        re("div", {
           class: "hys-ui-slider-axis",
           style: ne(
             o.vertical ? { height: typeof o.height == "number" ? o.height + "px" : o.height } : void 0
           )
         }, [
-          ie("div", {
+          re("div", {
             ref_key: "rail",
-            ref: m,
+            ref: f,
             class: ge(["hys-ui-slider-rail", { "hys-ui-slider-range": c.value }]),
             onPointerdown: a[3] || (a[3] = (t) => Be(t)),
             onLostpointercapture: a[4] || (a[4] = (t) => k.value && B(!0))
           }, [
-            a[5] || (a[5] = ie("div", { class: "hys-ui-slider-background" }, null, -1)),
-            o.included ? (f(), w("div", {
+            a[5] || (a[5] = re("div", { class: "hys-ui-slider-background" }, null, -1)),
+            o.included ? (m(), w("div", {
               key: 0,
               class: ge(["hys-ui-slider-selection", {
                 "hys-ui-slider-selection-draggable": c.value && o.draggableTrack && !x.value && P.value
               }]),
-              style: ne(oa.value),
+              style: ne(na.value),
               onPointerdown: a[0] || (a[0] = Je((t) => Be(t, void 0, !0), ["stop"]))
-            }, null, 38)) : j("", !0),
-            (f(!0), w(oe, null, se(sa.value, (t) => (f(), w("span", {
+            }, null, 38)) : K("", !0),
+            (m(!0), w(oe, null, se(oa.value, (t) => (m(), w("span", {
               key: t,
               class: ge(["hys-ui-slider-stop", {
-                "hys-ui-slider-stop-active": t >= (c.value ? n.value[0] : i.value) && t <= n.value[c.value ? 1 : 0]
+                "hys-ui-slider-stop-active": t >= (c.value ? n.value[0] : r.value) && t <= n.value[c.value ? 1 : 0]
               }]),
-              style: ne(De(t))
+              style: ne(Fe(t))
             }, null, 6))), 128)),
-            (f(!0), w(oe, null, se(n.value, (t, u) => {
-              var r, v, d, b, O;
-              return f(), w("div", {
+            (m(!0), w(oe, null, se(n.value, (t, u) => {
+              var i, v, d, y, O;
+              return m(), w("div", {
                 key: u,
-                style: ne(na(t)),
+                style: ne(ra(t)),
                 ref_for: !0,
-                ref: (p) => {
-                  p && (de.value[u] = p);
+                ref: (b) => {
+                  b && (de.value[u] = b);
                 },
                 role: "slider",
                 "data-hys-ui-field-managed": "",
                 class: ge(["hys-ui-slider-thumb", {
                   "hys-ui-slider-thumb-active": I.value === u || k.value && E.value === u
                 }]),
-                id: u === 0 ? h(q).id || (c.value || (r = h(S)) == null ? void 0 : r.id.value) : void 0,
-                tabindex: z.value ? -1 : o.tabindex ?? 0,
+                id: u === 0 ? h(q).id || (c.value || (i = h(S)) == null ? void 0 : i.id.value) : void 0,
+                tabindex: C.value ? -1 : o.tabindex ?? 0,
                 "aria-label": Ie(u),
                 "aria-labelledby": h(q)["aria-labelledby"],
-                "aria-valuemin": u === 1 ? n.value[0] : x.value ? ((v = M.value[0]) == null ? void 0 : v.value) ?? i.value : i.value,
+                "aria-valuemin": u === 1 ? n.value[0] : x.value ? ((v = M.value[0]) == null ? void 0 : v.value) ?? r.value : r.value,
                 "aria-valuemax": c.value && u === 0 ? n.value[1] : x.value ? ((d = M.value.at(-1)) == null ? void 0 : d.value) ?? s.value : s.value,
                 "aria-valuenow": t,
                 "aria-valuetext": ia(t),
                 "aria-orientation": o.vertical ? "vertical" : "horizontal",
-                "aria-disabled": z.value || void 0,
+                "aria-disabled": C.value || void 0,
                 "aria-readonly": o.readonly || void 0,
-                "aria-required": ((b = h(S)) == null ? void 0 : b.required.value) || void 0,
+                "aria-required": ((y = h(S)) == null ? void 0 : y.required.value) || void 0,
                 "aria-invalid": ce.value === "error" || void 0,
                 "aria-describedby": [
-                  o.error ? h(Ae) : (O = h(S)) == null ? void 0 : O.describedBy.value,
+                  o.error ? h(ze) : (O = h(S)) == null ? void 0 : O.describedBy.value,
                   h(q)["aria-describedby"],
-                  $e(u, t) ? h(ke) + "-tooltip-" + u : void 0
+                  De(u, t) ? h(ke) + "-tooltip-" + u : void 0
                 ].filter(Boolean).join(" ") || void 0,
-                onPointerdown: Je((p) => Be(p, u), ["stop"]),
-                onKeydown: (p) => da(p, u),
-                onMouseenter: (p) => fe.value = u,
-                onMouseleave: a[1] || (a[1] = (p) => fe.value = void 0),
-                onFocus: (p) => {
-                  I.value = u, T("focus", p);
+                onPointerdown: Je((b) => Be(b, u), ["stop"]),
+                onKeydown: (b) => va(b, u),
+                onMouseenter: (b) => fe.value = u,
+                onMouseleave: a[1] || (a[1] = (b) => fe.value = void 0),
+                onFocus: (b) => {
+                  I.value = u, R("focus", b);
                 },
-                onBlur: a[2] || (a[2] = (p) => {
-                  I.value = void 0, T("blur", p);
+                onBlur: a[2] || (a[2] = (b) => {
+                  I.value = void 0, R("blur", b);
                 })
               }, [
-                ie("span", za, [
+                re("span", za, [
                   Ne(e.$slots, "thumb", {
                     value: t,
                     index: u,
                     dragging: k.value && E.value === u
                   }, void 0, !0)
                 ]),
-                $e(u, t) ? (f(), Qe(Ba, {
-                  key: 0,
+                wa(xa, {
+                  "popup-transition": l.popupTransition,
+                  "popup-transition-duration": l.popupTransitionDuration,
+                  visible: De(u, t),
                   id: h(ke) + "-tooltip-" + u,
                   anchor: de.value[u],
                   container: ve.value,
                   placement: o.tooltipPlacement,
-                  position: D(t)
+                  position: F(t)
                 }, {
                   default: ka(() => [
                     Ne(e.$slots, "tooltip", {
                       value: t,
                       index: u
                     }, () => [
-                      Ze(re(ye(t)), 1)
+                      Qe(ie(pe(t)), 1)
                     ], !0)
                   ]),
                   _: 2
-                }, 1032, ["id", "anchor", "container", "placement", "position"])) : j("", !0)
-              ], 46, Va);
+                }, 1032, ["popup-transition", "popup-transition-duration", "visible", "id", "anchor", "container", "placement", "position"])
+              ], 46, Ca);
             }), 128))
           ], 34),
-          M.value.length ? (f(), w("div", Aa, [
-            (f(!0), w(oe, null, se(M.value, (t) => (f(), w("button", {
+          M.value.length ? (m(), w("div", Aa, [
+            (m(!0), w(oe, null, se(M.value, (t) => (m(), w("button", {
               key: t.value,
               type: "button",
               tabindex: "-1",
               class: "hys-ui-slider-mark",
-              disabled: z.value || o.readonly,
-              style: ne({ ...De(t.value), ...t.style }),
-              onClick: (u) => fa(t.value)
+              disabled: C.value || o.readonly,
+              style: ne({ ...Fe(t.value), ...t.style }),
+              onClick: (u) => ca(t.value)
             }, [
               Ne(e.$slots, "mark", {
                 value: t.value,
                 label: t.label,
-                active: t.value >= (c.value ? n.value[0] : i.value) && t.value <= n.value[c.value ? 1 : 0]
+                active: t.value >= (c.value ? n.value[0] : r.value) && t.value <= n.value[c.value ? 1 : 0]
               }, () => [
-                Ze(re(t.label), 1)
+                Qe(ie(t.label), 1)
               ], !0)
             ], 12, Ra))), 128))
-          ])) : j("", !0)
+          ])) : K("", !0)
         ], 4),
-        o.showInput ? (f(), w("div", Ta, [
-          (f(!0), w(oe, null, se(n.value, (t, u) => (f(), Qe(Ma, {
+        o.showInput ? (m(), w("div", Pa, [
+          (m(!0), w(oe, null, se(n.value, (t, u) => (m(), Ma(Ba, {
             key: u,
             id: h(ke) + "-number-" + u,
             "model-value": t,
-            min: u === 1 ? n.value[0] : i.value,
+            min: u === 1 ? n.value[0] : r.value,
             max: c.value && u === 0 ? n.value[1] : s.value,
             step: G.value,
             "show-controls": o.showInputControls,
             size: h(Ve),
-            disabled: z.value,
+            disabled: C.value,
             readonly: o.readonly,
             "aria-label": Ie(u) + "输入",
-            "onUpdate:modelValue": (r) => {
-              if (r !== null) {
+            "onUpdate:modelValue": (i) => {
+              if (i !== null) {
                 const v = [...n.value];
-                ue(u, Number(r)) && le(v);
+                ue(u, Number(i)) && le(v);
               }
             }
           }, null, 8, ["id", "model-value", "min", "max", "step", "show-controls", "size", "disabled", "readonly", "aria-label", "onUpdate:modelValue"]))), 128))
-        ])) : j("", !0)
+        ])) : K("", !0)
       ]),
-      o.name ? (f(!0), w(oe, { key: 1 }, se(n.value, (t, u) => (f(), w("input", {
+      o.name ? (m(!0), w(oe, { key: 1 }, se(n.value, (t, u) => (m(), w("input", {
         key: u,
         type: "hidden",
         name: o.name,
         value: t,
-        disabled: z.value
-      }, null, 8, Pa))), 128)) : j("", !0),
-      o.error ? (f(), w("small", {
+        disabled: C.value
+      }, null, 8, Ia))), 128)) : K("", !0),
+      o.error ? (m(), w("small", {
         key: 2,
-        id: h(Ae),
+        id: h(ze),
         class: "hys-ui-slider-error-text",
         role: "alert"
-      }, re(o.error), 9, Ia)) : j("", !0)
+      }, ie(o.error), 9, Da)) : K("", !0)
     ], 16));
   }
 });
 export {
-  Xa as default
+  Ya as default
 };