asma-ui-core 3.81.0 → 3.81.1

package/dist/components/inputs/slider/StyledSlider.js

@@ -1,106 +1,123 @@
-import { cn as i } from "../../../helpers/cn.js";
-import { HelperRow as et } from "../../../helpers/HelperRow.js";
-import { useHelperSlot as lt } from "../../../helpers/useHelperSlot.js";
-import g from "./StyledSlider.module.js";
-import { useId as at, useState as rt } from "react";
-import { jsx as p, jsxs as U } from "react/jsx-runtime";
-var H = (c, e, o) => o === e ? 0 : Math.min(100, Math.max(0, (c - e) / (o - e) * 100)), ot = (c) => Array.isArray(c) ? [c[0] ?? 0, c[1] ?? 0] : null, ft = ({ dataTest: c, min: e = 0, max: o = 100, step: b = 1, value: T, defaultValue: E, disabled: v, size: z = "medium", orientation: L = "horizontal", marks: M, name: G, className: J, classes: u, slotProps: S, error: y, errorText: O, helperText: _, reserveHelperText: Q, ariaLabel: w, ariaLabelledBy: W, onChange: j, onChangeCommitted: V }) => {
-  const B = at(), a = L === "vertical", d = z === "small" ? 6 : 8, [Z, k] = rt(E ?? e), A = T ?? Z, n = ot(A), f = n !== null, D = y ? O ?? _ : _, { show: F, role: C } = lt("StyledSlider", y, D, Q), $ = (M === !0 && Number.isFinite(b) && b > 0 && o > e ? Array.from({ length: Math.floor((o - e) / b) + 1 }, (t, l) => ({ value: e + b * l })) : Array.isArray(M) ? M : []).filter((t) => t.value >= e && t.value <= o), K = f ? Math.min(n[0], n[1]) : e, x = f ? Math.max(n[0], n[1]) : A, X = (t) => f ? t >= K && t <= x : t <= x, P = f ? H(K, e, o) : 0, Y = H(x, e, o) - P, I = a ? {
-    bottom: `${P}%`,
-    height: `${Y}%`
+import { cn as u } from "../../../helpers/cn.js";
+import { HelperRow as ft } from "../../../helpers/HelperRow.js";
+import { useHelperSlot as ht } from "../../../helpers/useHelperSlot.js";
+import y from "./StyledSlider.module.js";
+import { useId as pt, useRef as O, useState as Q } from "react";
+import { jsx as b, jsxs as H } from "react/jsx-runtime";
+var U = (i, l, o) => o === l ? 0 : Math.min(100, Math.max(0, (i - l) / (o - l) * 100)), mt = (i) => Array.isArray(i) ? [i[0] ?? 0, i[1] ?? 0] : null, wt = ({ dataTest: i, min: l = 0, max: o = 100, step: h = 1, value: w, defaultValue: W, disabled: p, size: z = "medium", orientation: C = "horizontal", marks: M, name: Z, className: k, classes: s, slotProps: x, error: v, errorText: tt, helperText: L, reserveHelperText: et, ariaLabel: S, ariaLabelledBy: rt, onChange: A, onChangeCommitted: _ }) => {
+  const j = pt(), n = C === "vertical", a = z === "small" ? 6 : 8, d = O(null), g = O(null), [lt, N] = Q(null), [nt, F] = Q(W ?? l), I = lt ?? w ?? nt, c = mt(I), f = c !== null, B = v ? tt ?? L : L, { show: K, role: ot } = ht("StyledSlider", v, B, et), V = (M === !0 && Number.isFinite(h) && h > 0 && o > l ? Array.from({ length: Math.floor((o - l) / h) + 1 }, (t, r) => ({ value: l + h * r })) : Array.isArray(M) ? M : []).filter((t) => t.value >= l && t.value <= o), X = f ? Math.min(c[0], c[1]) : l, R = f ? Math.max(c[0], c[1]) : I, Y = (t) => f ? t >= X && t <= R : t <= R, $ = f ? U(X, l, o) : 0, q = U(R, l, o) - $, at = n ? {
+    bottom: `${$}%`,
+    height: `${q}%`
   } : {
-    left: `${P}%`,
-    width: `${Y}%`
-  }, q = (t) => {
-    const l = H(t, e, o);
-    return a ? { bottom: `${l}%` } : { left: `${l}%` };
-  }, tt = (t) => {
-    if (v) return;
-    const l = t.currentTarget.getBoundingClientRect(), r = a ? 1 - (t.clientY - l.top) / l.height : (t.clientX - l.left) / l.width, m = e + Math.round(Math.min(1, Math.max(0, r)) * ((o - e) / b)) * b, h = Math.min(o, Math.max(e, m));
-    N(j, t, h, f && Math.abs((n?.[1] ?? e) - h) < Math.abs((n?.[0] ?? e) - h) ? 1 : 0);
-  }, N = (t, l, r, m) => {
-    let h = r;
-    if (!f) h = r;
-    else {
-      const s = [n?.[0] ?? 0, n?.[1] ?? 0];
-      s[m] = r, m === 0 && s[0] > s[1] && (s[0] = s[1]), m === 1 && s[1] < s[0] && (s[1] = s[0]), h = s;
-    }
-    T === void 0 && k(h), t && t(l, h, m);
-  }, R = (t, l) => /* @__PURE__ */ p("input", {
+    left: `${$}%`,
+    width: `${q}%`
+  }, E = (t) => {
+    const r = U(t, l, o);
+    return n ? { bottom: `${r}%` } : { left: `${r}%` };
+  }, T = (t) => {
+    const r = t.currentTarget.getBoundingClientRect(), e = n ? 1 - (t.clientY - (r.top + a)) / (r.height - a * 2) : (t.clientX - (r.left + a)) / (r.width - a * 2), m = l + Math.round(Math.min(1, Math.max(0, e)) * ((o - l) / h)) * h;
+    return Math.min(o, Math.max(l, m));
+  }, ct = (t) => f && Math.abs((c?.[1] ?? l) - t) < Math.abs((c?.[0] ?? l) - t) ? 1 : 0, ut = (t) => {
+    if (p) return;
+    const r = T(t), e = ct(r);
+    d.current = e, g.current = t.pointerId, t.currentTarget.setPointerCapture(t.pointerId);
+    const m = P(r, e);
+    N(m), A?.(t, m, e);
+  }, it = (t) => {
+    if (p || d.current === null || t.pointerId !== g.current) return;
+    const r = d.current, e = P(T(t), r);
+    N(e), A?.(t, e, r);
+  }, st = (t) => {
+    if (p || d.current === null || t.pointerId !== g.current) return;
+    const r = d.current, e = P(T(t), r);
+    w === void 0 && F(e), _?.(t, e), t.currentTarget.hasPointerCapture(t.pointerId) && t.currentTarget.releasePointerCapture(t.pointerId), N(null), d.current = null, g.current = null;
+  }, dt = (t) => {
+    d.current === null || t.pointerId !== g.current || (N(null), d.current = null, g.current = null);
+  }, P = (t, r) => {
+    if (!f) return t;
+    const e = [c?.[0] ?? 0, c?.[1] ?? 0];
+    return e[r] = t, r === 0 && e[0] > e[1] && (e[0] = e[1]), r === 1 && e[1] < e[0] && (e[1] = e[0]), e;
+  }, G = (t, r, e, m) => {
+    const J = P(e, m);
+    w === void 0 && F(J), t && t(r, J, m);
+  }, D = (t, r) => /* @__PURE__ */ b("input", {
     type: "range",
-    "data-testid": f ? `${c}-thumb-${t}` : c,
-    name: G,
-    min: e,
+    "data-testid": f ? `${i}-thumb-${t}` : i,
+    name: Z,
+    min: l,
     max: o,
-    step: b,
-    value: l,
-    disabled: v,
-    "aria-orientation": L,
-    "aria-label": typeof w == "function" ? w(t) : w,
-    "aria-labelledby": W,
-    "aria-invalid": y ? !0 : void 0,
-    "aria-describedby": F ? B : void 0,
-    className: i(g.SliderInput, a ? g.Vertical : g.Horizontal, !a && "z-0", z === "small" && g.Small, v && g.Disabled, u?.thumb, S?.thumb?.className),
-    onChange: (r) => N(j, r, Number(r.currentTarget.value), t),
-    onPointerUp: (r) => N(V, r, Number(r.currentTarget.value), t),
-    onKeyUp: (r) => N(V, r, Number(r.currentTarget.value), t)
+    step: h,
+    value: r,
+    disabled: p,
+    "aria-orientation": C,
+    "aria-label": typeof S == "function" ? S(t) : S,
+    "aria-labelledby": rt,
+    "aria-invalid": v ? !0 : void 0,
+    "aria-describedby": K ? j : void 0,
+    className: u(y.SliderInput, n ? y.Vertical : y.Horizontal, !n && "z-0", z === "small" && y.Small, p && y.Disabled, s?.thumb, x?.thumb?.className),
+    onChange: (e) => G(A, e, Number(e.currentTarget.value), t),
+    onKeyUp: (e) => G(_, e, Number(e.currentTarget.value), t)
   }, t);
-  return /* @__PURE__ */ U("div", {
-    className: i("relative flex", a ? "h-full w-8 flex-col items-center" : "mt-px w-full flex-col", u?.root, J),
+  return /* @__PURE__ */ H("div", {
+    className: u("relative flex", n ? "h-full w-8 flex-col items-center" : "mt-px w-full flex-col", s?.root, k),
     children: [
-      /* @__PURE__ */ U("div", {
-        className: i("relative", a ? "h-full w-8" : "h-4 w-full"),
-        children: [/* @__PURE__ */ U("div", {
-          onPointerUp: tt,
-          className: i("absolute", a ? "left-1/2 w-1 -translate-x-1/2" : "top-[calc(50%+6px)] h-1 -translate-y-1/2"),
-          style: a ? {
-            top: d,
-            bottom: d
+      /* @__PURE__ */ H("div", {
+        className: u("relative", n ? "h-full w-8" : "h-4 w-full"),
+        style: { touchAction: "none" },
+        onPointerDown: ut,
+        onPointerMove: it,
+        onPointerUp: st,
+        onPointerCancel: dt,
+        children: [/* @__PURE__ */ H("div", {
+          className: u("absolute", n ? "left-1/2 w-1 -translate-x-1/2" : "top-[calc(50%+6px)] h-1 -translate-y-1/2"),
+          style: n ? {
+            top: a,
+            bottom: a
           } : {
-            left: d,
-            right: d
+            left: a,
+            right: a
           },
           children: [
-            /* @__PURE__ */ p("div", { className: i("absolute inset-0 rounded-full bg-delta-100", u?.rail, S?.rail?.className) }),
-            /* @__PURE__ */ p("div", {
-              className: i("absolute rounded-full", a ? "left-0 w-full" : "top-0 h-full", v ? "bg-delta-200" : "bg-gama-500", u?.track),
-              style: I
+            /* @__PURE__ */ b("div", { className: u("absolute inset-0 rounded-full bg-delta-100", s?.rail, x?.rail?.className) }),
+            /* @__PURE__ */ b("div", {
+              className: u("absolute rounded-full", n ? "left-0 w-full" : "top-0 h-full", p ? "bg-delta-200" : "bg-gama-500", s?.track),
+              style: at
             }),
-            $.map((t) => {
-              const l = X(t.value);
-              return /* @__PURE__ */ p("span", {
-                className: i("absolute z-10 box-border h-2 w-2 -translate-x-1/2 rounded-full border border-solid", a ? "left-1/2 translate-y-1/2" : "top-1/2 -translate-y-1/2", l ? i(v ? "border-delta-200 bg-delta-200" : "border-gama-500 bg-gama-500", u?.markActive) : i("border-delta-300 bg-white", u?.mark)),
-                style: q(t.value)
+            V.map((t) => {
+              const r = Y(t.value);
+              return /* @__PURE__ */ b("span", {
+                className: u("absolute z-10 box-border h-2 w-2 -translate-x-1/2 rounded-full border border-solid", n ? "left-1/2 translate-y-1/2" : "top-1/2 -translate-y-1/2", r ? u(p ? "border-delta-200 bg-delta-200" : "border-gama-500 bg-gama-500", s?.markActive) : u("border-delta-300 bg-white", s?.mark)),
+                style: E(t.value)
               }, t.value);
             })
           ]
-        }), f ? [R(0, n[0]), R(1, n[1])] : R(0, A)]
+        }), f ? [D(0, c[0]), D(1, c[1])] : D(0, I)]
       }),
-      $.some((t) => t.label != null) && /* @__PURE__ */ p("div", {
-        className: i(a ? "pointer-events-none absolute inset-x-0" : "relative mt-[14px] h-6"),
-        style: a ? {
-          top: d,
-          bottom: d
+      V.some((t) => t.label != null) && /* @__PURE__ */ b("div", {
+        className: u(n ? "pointer-events-none absolute inset-x-0" : "relative mt-[14px] h-6"),
+        style: n ? {
+          top: a,
+          bottom: a
         } : {
-          marginLeft: d,
-          marginRight: d
+          marginLeft: a,
+          marginRight: a
         },
-        children: $.map((t) => t.label == null ? null : /* @__PURE__ */ p("span", {
-          className: i("absolute text-base font-semibold text-delta-700", a ? "left-[37px] translate-y-1/2" : "-translate-x-1/2", X(t.value) && u?.markLabelActive, u?.markLabel, S?.markLabel?.className),
-          style: q(t.value),
+        children: V.map((t) => t.label == null ? null : /* @__PURE__ */ b("span", {
+          className: u("absolute text-base font-semibold text-delta-700", n ? "left-[37px] translate-y-1/2" : "-translate-x-1/2", Y(t.value) && s?.markLabelActive, s?.markLabel, x?.markLabel?.className),
+          style: E(t.value),
           children: t.label
         }, t.value))
       }),
-      F && /* @__PURE__ */ p(et, {
-        id: B,
-        role: C,
-        error: y,
-        message: D,
+      K && /* @__PURE__ */ b(ft, {
+        id: j,
+        role: ot,
+        error: v,
+        message: B,
         className: "m-0 items-center"
       })
     ]
   });
 };
 export {
-  ft as StyledSlider
+  wt as StyledSlider
 };

package/dist/components/inputs/slider/StyledSlider.module.js

@@ -1,8 +1,8 @@
-var a = "_SliderInput_1f963_1", l = "_Horizontal_1f963_15", _ = "_Vertical_1f963_24", r = "_Small_1f963_83", e = "_Disabled_1f963_92", t = {
-  SliderInput: a,
-  Horizontal: l,
-  Vertical: _,
-  Small: r,
+var r = "_SliderInput_18nr0_1", a = "_Horizontal_18nr0_15", l = "_Vertical_18nr0_24", _ = "_Small_18nr0_83", e = "_Disabled_18nr0_92", t = {
+  SliderInput: r,
+  Horizontal: a,
+  Vertical: l,
+  Small: _,
   Disabled: e
 };
 export {

package/package.json

@@ -3,7 +3,7 @@
     "publishConfig": {
         "access": "public"
     },
-    "version": "3.81.0",
+    "version": "3.81.1",
     "type": "module",
     "sideEffects": [
         "**/*.css",