@koide-labs/ui 0.0.0 → 0.0.2

package/dist/components/slider/index.js

@@ -0,0 +1,902 @@
+import { jsx as be, jsxs as Je } from "react/jsx-runtime";
+import { c as Ct } from "../../clsx-OuTLNxxd.js";
+import { View as Pt } from "../view/index.js";
+import * as a from "react";
+import { o as Ne } from "../../owner-rKN292Q9.js";
+import { u as _t } from "../../useControlled-Du4sJyMj.js";
+import { u as z } from "../../useStableCallback-CkTrVkNX.js";
+import { u as Qe } from "../../useValueAsRef-HURLzret.js";
+import { u as ze } from "../../useIsoLayoutEffect-CIDbvm3Q.js";
+import { w as Nt } from "../../warn-CKtX8MLJ.js";
+import { c as we, h as Ze, n as wt, k as Et, p as Vt, r as At, u as Ye } from "../../createBaseUIEventDetails-D8M2Yl-a.js";
+import { u as Tt } from "../../useValueChanged-DL757-yD.js";
+import { u as We } from "../../useBaseUiId-B7WyxtIE.js";
+import { u as Ee, m as Mt, c as Ot } from "../../useRenderElement-DwToLA61.js";
+import { c as ue } from "../../clamp-D0KDAQIz.js";
+import { C as Ft, u as Bt } from "../../useCompositeListItem-OkcAim_1.js";
+import { c as Dt, a as et, u as Lt, b as kt } from "../../LabelableContext-BMvjVwor.js";
+import { f as $t } from "../../formatErrorMessage-BqPuTBN-.js";
+import { h as tt, f as Ht } from "../../element-CZEOj04G.js";
+import { a as Ue } from "../../floating-ui.utils.dom-C7FS5id0.js";
+import { u as Ut } from "../../useAnimationFrame-451ugS_6.js";
+import { u as nt } from "../../DirectionContext-C2o_MF_i.js";
+import { u as rt } from "../../useOnMount-VRW6CK2u.js";
+import { v as qe } from "../../valueToPercent-DaP9qN4u.js";
+import { v as Ge } from "../../visuallyHidden-CpJ-mhai.js";
+import { f as De } from "../../formatNumber-1UNwjeqf.js";
+import { C as zt, H as ot, E as it, d as st, b as at, c as ut, e as lt } from "../../composite-C9L5QmZL.js";
+import { u as Wt } from "../../useLabelableId-Ci_jDvmv.js";
+import '../../index32.css';function ct(e, t, r = (i, o) => i === o) {
+  return e.length === t.length && e.every((i, o) => r(i, t[o]));
+}
+function dt(e, t) {
+  return e - t;
+}
+function qt(e, t, r) {
+  const i = e.slice();
+  return i[t] = r, i.sort(dt);
+}
+function ft(e, t, r, i, o, l) {
+  let u = e;
+  return u = ue(u, r, i), o && (u = qt(
+    l,
+    t,
+    // Bound the new value to the thumb's neighbours.
+    ue(u, l[t - 1] || -1 / 0, l[t + 1] || 1 / 0)
+  )), u;
+}
+function mt(e, t, r) {
+  if (!Array.isArray(e))
+    return !0;
+  const i = e.reduce((o, l, u, g) => (u === g.length - 1 || o.push(Math.abs(l - g[u + 1])), o), []);
+  return Math.min(...i) >= t * r;
+}
+const Ve = {
+  activeThumbIndex: () => null,
+  max: () => null,
+  min: () => null,
+  minStepsBetweenValues: () => null,
+  step: () => null,
+  values: () => null
+}, Ke = /* @__PURE__ */ a.createContext(void 0);
+process.env.NODE_ENV !== "production" && (Ke.displayName = "SliderRootContext");
+function Le() {
+  const e = a.useContext(Ke);
+  if (e === void 0)
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: SliderRootContext is missing. Slider parts must be placed within <Slider.Root>." : $t(62));
+  return e;
+}
+function Kt(e) {
+  return "key" in e ? Et : Vt;
+}
+function jt(e, t) {
+  return typeof e == "number" && typeof t == "number" ? e === t : Array.isArray(e) && Array.isArray(t) ? ct(e, t) : !1;
+}
+const pt = /* @__PURE__ */ a.forwardRef(function(t, r) {
+  const {
+    "aria-labelledby": i,
+    className: o,
+    defaultValue: l,
+    disabled: u = !1,
+    id: g,
+    format: p,
+    largeStep: w = 10,
+    locale: h,
+    render: W,
+    max: E = 100,
+    min: m = 0,
+    minStepsBetweenValues: s = 0,
+    name: V,
+    onValueChange: x,
+    onValueCommitted: P,
+    orientation: y = "horizontal",
+    step: M = 1,
+    thumbCollisionBehavior: te = "push",
+    thumbAlignment: ne = "center",
+    value: re,
+    ...Re
+  } = t, le = We(g), q = z(x), ce = z(P), {
+    clearErrors: H
+  } = Dt(), {
+    state: U,
+    disabled: K,
+    name: S,
+    setTouched: j,
+    setDirty: A,
+    validityData: R,
+    shouldValidateOnChange: _,
+    validation: B
+  } = et(), {
+    labelId: oe
+  } = Lt(), X = i ?? oe, Y = K || u, de = S ?? V, [C, Ie] = _t({
+    controlled: re,
+    default: l ?? m,
+    name: "Slider"
+  }), ie = a.useRef(null), he = a.useRef(null), O = a.useRef([]), F = a.useRef(null), fe = a.useRef(null), ye = a.useRef(-1), D = a.useRef(null), L = a.useRef(null), se = a.useRef("none"), n = Qe(p), [f, c] = a.useState(-1), [b, d] = a.useState(-1), [$, me] = a.useState(!1), [J, ge] = a.useState(() => /* @__PURE__ */ new Map()), [Pe, Se] = a.useState([void 0, void 0]), I = z((v) => {
+    c(v), v !== -1 && d(v);
+  });
+  kt({
+    id: le,
+    commit: B.commit,
+    value: C,
+    controlRef: he,
+    name: de,
+    getValue: () => C
+  }), Tt(C, () => {
+    H(de), _() ? B.commit(C) : B.commit(C, !0);
+    const v = R.initialValue;
+    let pe;
+    Array.isArray(C) && Array.isArray(v) ? pe = !ct(C, v) : pe = C !== v, A(pe);
+  });
+  const xe = z((v) => {
+    v && (he.current = v);
+  }), Q = Array.isArray(C), Z = a.useMemo(() => Q ? C.slice().sort(dt) : [ue(C, m, E)], [E, m, Q, C]), G = z((v, pe) => {
+    if (Number.isNaN(v) || jt(v, C))
+      return;
+    const ae = pe ?? we(wt, void 0, void 0, {
+      activeThumbIndex: -1
+    });
+    se.current = ae.reason;
+    const ve = new event.constructor(event.type, event);
+    Object.defineProperty(ve, "target", {
+      writable: !0,
+      value: {
+        value: v,
+        name: de
+      }
+    }), ae.event = ve, L.current = v, q(v, ae), !ae.isCanceled && Ie(v);
+  }), Ce = z((v, pe, ae) => {
+    const ve = ft(v, pe, m, E, Q, Z);
+    if (mt(ve, M, s)) {
+      const Te = Kt(ae);
+      G(ve, we(Te, ae.nativeEvent, void 0, {
+        activeThumbIndex: pe
+      })), j(!0);
+      const je = L.current ?? ve;
+      ce(je, Ze(Te, ae.nativeEvent));
+    }
+  });
+  process.env.NODE_ENV !== "production" && m >= E && Nt("Slider `max` must be greater than `min`."), ze(() => {
+    const v = tt(Ne(ie.current));
+    Y && v && ie.current?.contains(v) && v.blur();
+  }, [Y]), Y && f !== -1 && I(-1);
+  const ee = a.useMemo(() => ({
+    ...U,
+    activeThumbIndex: f,
+    disabled: Y,
+    dragging: $,
+    orientation: y,
+    max: E,
+    min: m,
+    minStepsBetweenValues: s,
+    step: M,
+    values: Z
+  }), [U, f, Y, $, E, m, s, y, M, Z]), ke = a.useMemo(() => ({
+    active: f,
+    controlRef: he,
+    disabled: Y,
+    dragging: $,
+    validation: B,
+    formatOptionsRef: n,
+    handleInputChange: Ce,
+    indicatorPosition: Pe,
+    inset: ne !== "center",
+    labelId: X,
+    largeStep: w,
+    lastUsedThumbIndex: b,
+    lastChangedValueRef: L,
+    lastChangeReasonRef: se,
+    locale: h,
+    max: E,
+    min: m,
+    minStepsBetweenValues: s,
+    name: de,
+    onValueCommitted: ce,
+    orientation: y,
+    pressedInputRef: F,
+    pressedThumbCenterOffsetRef: fe,
+    pressedThumbIndexRef: ye,
+    pressedValuesRef: D,
+    registerFieldControlRef: xe,
+    renderBeforeHydration: ne === "edge",
+    setActive: I,
+    setDragging: me,
+    setIndicatorPosition: Se,
+    setValue: G,
+    state: ee,
+    step: M,
+    thumbCollisionBehavior: te,
+    thumbMap: J,
+    thumbRefs: O,
+    values: Z
+  }), [f, he, X, Y, $, B, n, Ce, Pe, w, b, L, se, h, E, m, s, de, ce, y, F, fe, ye, D, xe, I, me, Se, G, ee, M, te, ne, J, O, Z]), Ae = Ee("div", t, {
+    state: ee,
+    ref: [r, ie],
+    props: [{
+      "aria-labelledby": X,
+      id: le,
+      role: "group"
+    }, B.getValidationProps, Re],
+    stateAttributesMapping: Ve
+  });
+  return /* @__PURE__ */ be(Ke.Provider, {
+    value: ke,
+    children: /* @__PURE__ */ be(Ft, {
+      elementsRef: O,
+      onMapChange: ge,
+      children: Ae
+    })
+  });
+});
+process.env.NODE_ENV !== "production" && (pt.displayName = "SliderRoot");
+function ht(e) {
+  const t = e.getBoundingClientRect();
+  return {
+    x: (t.left + t.right) / 2,
+    y: (t.top + t.bottom) / 2
+  };
+}
+function Yt(e) {
+  if (Math.abs(e) < 1) {
+    const r = e.toExponential().split("e-"), i = r[0].split(".")[1];
+    return (i ? i.length : 0) + parseInt(r[1], 10);
+  }
+  const t = e.toString().split(".")[1];
+  return t ? t.length : 0;
+}
+function gt(e, t, r) {
+  const i = Math.round((e - r) / t) * t + r;
+  return Number(i.toFixed(Yt(t)));
+}
+function Xe({
+  values: e,
+  index: t,
+  nextValue: r,
+  min: i,
+  max: o,
+  step: l,
+  minStepsBetweenValues: u,
+  initialValues: g
+}) {
+  if (e.length === 0)
+    return [];
+  const p = e.slice(), w = l * u, h = p.length - 1, W = g ?? e, E = i + t * w, m = o - (h - t) * w;
+  p[t] = ue(r, E, m);
+  for (let s = t + 1; s <= h; s += 1) {
+    const V = p[s - 1] + w, x = o - (h - s) * w, P = W[s] ?? p[s];
+    let y = Math.max(p[s], V);
+    P < y && (y = Math.max(P, V)), p[s] = ue(y, V, x);
+  }
+  for (let s = t - 1; s >= 0; s -= 1) {
+    const V = p[s + 1] - w, x = i + s * w, P = W[s] ?? p[s];
+    let y = Math.min(p[s], V);
+    P > y && (y = Math.min(P, V)), p[s] = ue(y, x, V);
+  }
+  for (let s = 0; s <= h; s += 1)
+    p[s] = Number(p[s].toFixed(12));
+  return p;
+}
+function Gt({
+  behavior: e,
+  values: t,
+  currentValues: r,
+  initialValues: i,
+  pressedIndex: o,
+  nextValue: l,
+  min: u,
+  max: g,
+  step: p,
+  minStepsBetweenValues: w
+}) {
+  const h = r ?? t, W = i ?? t;
+  if (!(h.length > 1))
+    return {
+      value: l,
+      thumbIndex: 0,
+      didSwap: !1
+    };
+  const m = p * w;
+  switch (e) {
+    case "swap": {
+      const s = h[o], V = 1e-7, x = h.slice(), P = x[o - 1], y = x[o + 1], M = P != null ? P + m : u, te = y != null ? y - m : g, ne = ue(l, M, te), re = Number(ne.toFixed(12));
+      x[o] = re;
+      const Re = l > s, le = l < s, q = Re && y != null && l >= y - V, ce = le && P != null && l <= P + V;
+      if (!q && !ce)
+        return {
+          value: x,
+          thumbIndex: o,
+          didSwap: !1
+        };
+      const H = q ? o + 1 : o - 1, U = x.map((A, R) => {
+        if (R === o)
+          return re;
+        const _ = W[R];
+        return _ ?? h[R];
+      });
+      let K = l;
+      q ? K = Math.max(l, x[H]) : K = Math.min(l, x[H]);
+      const S = Xe({
+        values: x,
+        index: H,
+        nextValue: K,
+        min: u,
+        max: g,
+        step: p,
+        minStepsBetweenValues: w,
+        initialValues: U
+      }), j = q ? H - 1 : H + 1;
+      if (j >= 0 && j < S.length) {
+        const A = S[j - 1], R = S[j + 1];
+        let _ = A != null ? A + m : u;
+        _ = Math.max(_, u + j * m);
+        let B = R != null ? R - m : g;
+        B = Math.min(B, g - (S.length - 1 - j) * m);
+        const oe = ue(re, _, B);
+        S[j] = Number(oe.toFixed(12));
+      }
+      return {
+        value: S,
+        thumbIndex: H,
+        didSwap: !0
+      };
+    }
+    case "push":
+      return {
+        value: Xe({
+          values: h,
+          index: o,
+          nextValue: l,
+          min: u,
+          max: g,
+          step: p,
+          minStepsBetweenValues: w
+        }),
+        thumbIndex: o,
+        didSwap: !1
+      };
+    default: {
+      const s = h.slice(), V = s[o - 1], x = s[o + 1], P = V != null ? V + m : u, y = x != null ? x - m : g, M = ue(l, P, y);
+      return s[o] = Number(M.toFixed(12)), {
+        value: s,
+        thumbIndex: o,
+        didSwap: !1
+      };
+    }
+  }
+}
+const Xt = 2;
+function Jt(e, t) {
+  if (!e)
+    return {
+      start: 0,
+      end: 0
+    };
+  function r(l) {
+    const u = l != null ? parseFloat(l) : 0;
+    return Number.isNaN(u) ? 0 : u;
+  }
+  const i = t ? "Top" : "InlineStart", o = t ? "Bottom" : "InlineEnd";
+  return {
+    start: r(e[`border${i}Width`]) + r(e[`padding${i}`]),
+    end: r(e[`border${o}Width`]) + r(e[`padding${o}`])
+  };
+}
+function Fe(e, t) {
+  if (t.current != null && e.changedTouches) {
+    const r = e;
+    for (let i = 0; i < r.changedTouches.length; i += 1) {
+      const o = r.changedTouches[i];
+      if (o.identifier === t.current)
+        return {
+          x: o.clientX,
+          y: o.clientY
+        };
+    }
+    return null;
+  }
+  return {
+    x: e.clientX,
+    y: e.clientY
+  };
+}
+const bt = /* @__PURE__ */ a.forwardRef(function(t, r) {
+  const {
+    render: i,
+    className: o,
+    ...l
+  } = t, {
+    disabled: u,
+    dragging: g,
+    validation: p,
+    inset: w,
+    lastChangedValueRef: h,
+    lastChangeReasonRef: W,
+    max: E,
+    min: m,
+    minStepsBetweenValues: s,
+    onValueCommitted: V,
+    orientation: x,
+    pressedInputRef: P,
+    pressedThumbCenterOffsetRef: y,
+    pressedThumbIndexRef: M,
+    pressedValuesRef: te,
+    registerFieldControlRef: ne,
+    renderBeforeHydration: re,
+    setActive: Re,
+    setDragging: le,
+    setValue: q,
+    state: ce,
+    step: H,
+    thumbCollisionBehavior: U,
+    thumbRefs: K,
+    values: S
+  } = Le(), j = nt(), A = S.length > 1, R = x === "vertical", _ = a.useRef(null), B = a.useRef(null), oe = z((n) => {
+    n && B.current == null && B.current == null && (B.current = getComputedStyle(n));
+  }), X = a.useRef(null), Y = a.useRef(0), de = a.useRef(0), C = Qe(S), Ie = z((n) => {
+    M.current !== n && (M.current = n);
+    const f = K.current[n];
+    if (!f) {
+      y.current = null, P.current = null;
+      return;
+    }
+    P.current = f.querySelector('input[type="range"]');
+  }), ie = z((n) => {
+    const f = _.current;
+    if (!f)
+      return null;
+    const {
+      width: c,
+      height: b,
+      bottom: d,
+      left: $,
+      right: me
+    } = f.getBoundingClientRect(), J = Jt(B.current, R), ge = de.current, Pe = (R ? b : c) - J.start - J.end - ge * 2, Se = y.current ?? 0, I = n.x - Se, xe = n.y - Se, Q = R ? d - xe - J.end : (j === "rtl" ? me - I : I - $) - J.start, Z = ue((Q - ge) / Pe, 0, 1);
+    let G = (E - m) * Z + m;
+    if (G = gt(G, H, m), G = ue(G, m, E), !A)
+      return {
+        value: G,
+        thumbIndex: 0,
+        didSwap: !1
+      };
+    const Ce = M.current;
+    if (Ce < 0)
+      return null;
+    const ee = Gt({
+      behavior: U,
+      values: S,
+      currentValues: C.current ?? S,
+      initialValues: te.current,
+      pressedIndex: Ce,
+      nextValue: G,
+      min: m,
+      max: E,
+      step: H,
+      minStepsBetweenValues: s
+    });
+    return U === "swap" && ee.didSwap ? Ie(ee.thumbIndex) : M.current = ee.thumbIndex, ee;
+  }), he = z((n) => {
+    te.current = A ? S.slice() : null, C.current = S;
+    const f = M.current;
+    let c = f;
+    if (f > -1 && f < S.length) {
+      if (S[f] === E) {
+        let b = f;
+        for (; b > 0 && S[b - 1] === E; )
+          b -= 1;
+        c = b;
+      }
+    } else {
+      const b = R ? "y" : "x";
+      let d;
+      c = -1;
+      for (let $ = 0; $ < K.current.length; $ += 1) {
+        const me = K.current[$];
+        if (Ue(me)) {
+          const J = ht(me), ge = Math.abs(n[b] - J[b]);
+          (d === void 0 || ge <= d) && (c = $, d = ge);
+        }
+      }
+    }
+    if (c > -1 && c !== f && Ie(c), w) {
+      const b = K.current[c];
+      if (Ue(b)) {
+        const d = b.getBoundingClientRect(), $ = R ? "height" : "width";
+        de.current = d[$] / 2;
+      }
+    }
+  }), O = z((n) => {
+    K.current?.[n]?.querySelector('input[type="range"]')?.focus({
+      preventScroll: !0
+    });
+  }), F = z((n) => {
+    const f = Fe(n, X);
+    if (f == null)
+      return;
+    if (Y.current += 1, n.type === "pointermove" && n.buttons === 0) {
+      fe(n);
+      return;
+    }
+    const c = ie(f);
+    c != null && mt(c.value, H, s) && (!g && Y.current > Xt && le(!0), q(c.value, we(At, n, void 0, {
+      activeThumbIndex: c.thumbIndex
+    })), C.current = Array.isArray(c.value) ? c.value : [c.value], c.didSwap && O(c.thumbIndex));
+  });
+  function fe(n) {
+    Re(-1), le(!1), P.current = null, y.current = null, M.current = -1;
+    const f = Fe(n, X), c = f != null ? ie(f) : null;
+    if (c != null) {
+      const b = W.current;
+      p.commit(h.current ?? c.value), V(h.current ?? c.value, Ze(b, n));
+    }
+    "pointerType" in n && _.current?.hasPointerCapture(n.pointerId) && _.current?.releasePointerCapture(n.pointerId), X.current = null, te.current = null, D();
+  }
+  const ye = z((n) => {
+    if (u)
+      return;
+    const f = n.changedTouches[0];
+    f != null && (X.current = f.identifier);
+    const c = Fe(n, X);
+    if (c != null) {
+      he(c);
+      const d = ie(c);
+      if (d == null)
+        return;
+      O(d.thumbIndex), q(d.value, we(Ye, n, void 0, {
+        activeThumbIndex: d.thumbIndex
+      })), C.current = Array.isArray(d.value) ? d.value : [d.value], d.didSwap && O(d.thumbIndex);
+    }
+    Y.current = 0;
+    const b = Ne(_.current);
+    b.addEventListener("touchmove", F, {
+      passive: !0
+    }), b.addEventListener("touchend", fe, {
+      passive: !0
+    });
+  }), D = z(() => {
+    const n = Ne(_.current);
+    n.removeEventListener("pointermove", F), n.removeEventListener("pointerup", fe), n.removeEventListener("touchmove", F), n.removeEventListener("touchend", fe), te.current = null;
+  }), L = Ut();
+  return a.useEffect(() => {
+    const n = _.current;
+    return n ? (n.addEventListener("touchstart", ye, {
+      passive: !0
+    }), () => {
+      n.removeEventListener("touchstart", ye), L.cancel(), D();
+    }) : () => D();
+  }, [D, ye, _, L]), a.useEffect(() => {
+    u && D();
+  }, [u, D]), Ee("div", t, {
+    state: ce,
+    ref: [r, ne, _, oe],
+    props: [{
+      "data-base-ui-slider-control": re ? "" : void 0,
+      onPointerDown(n) {
+        const f = _.current;
+        if (!f || u || n.defaultPrevented || !Ue(n.target) || // Only handle left clicks
+        n.button !== 0)
+          return;
+        const c = Fe(n, X);
+        if (c != null) {
+          he(c);
+          const d = ie(c);
+          if (d == null)
+            return;
+          Ht(K.current[d.thumbIndex], tt(Ne(f))) ? n.preventDefault() : L.request(() => {
+            O(d.thumbIndex);
+          }), le(!0), y.current != null || (q(d.value, we(Ye, n.nativeEvent, void 0, {
+            activeThumbIndex: d.thumbIndex
+          })), C.current = Array.isArray(d.value) ? d.value : [d.value], d.didSwap && O(d.thumbIndex));
+        }
+        n.nativeEvent.pointerId && f.setPointerCapture(n.nativeEvent.pointerId), Y.current = 0;
+        const b = Ne(_.current);
+        b.addEventListener("pointermove", F, {
+          passive: !0
+        }), b.addEventListener("pointerup", fe, {
+          once: !0
+        });
+      },
+      tabIndex: -1
+    }, l],
+    stateAttributesMapping: Ve
+  });
+});
+process.env.NODE_ENV !== "production" && (bt.displayName = "SliderControl");
+const yt = /* @__PURE__ */ a.forwardRef(function(t, r) {
+  const {
+    render: i,
+    className: o,
+    ...l
+  } = t, {
+    state: u
+  } = Le();
+  return Ee("div", t, {
+    state: u,
+    ref: r,
+    props: [{
+      style: {
+        position: "relative"
+      }
+    }, l],
+    stateAttributesMapping: Ve
+  });
+});
+process.env.NODE_ENV !== "production" && (yt.displayName = "SliderTrack");
+let Qt = /* @__PURE__ */ (function(e) {
+  return e.index = "data-index", e.dragging = "data-dragging", e.orientation = "data-orientation", e.disabled = "data-disabled", e.readonly = "data-readonly", e.required = "data-required", e.valid = "data-valid", e.invalid = "data-invalid", e.touched = "data-touched", e.dirty = "data-dirty", e.focused = "data-focused", e;
+})({});
+const Zt = '!function(){const t=document.currentScript?.parentElement;if(!t)return;const e=t.closest("[data-base-ui-slider-control]");if(!e)return;const r=e.querySelector("[data-base-ui-slider-indicator]"),i=e.getBoundingClientRect(),n="vertical"===e.getAttribute("data-orientation")?"height":"width",o=e.querySelectorAll(\'input[type="range"]\'),l=o.length>1,s=o.length-1;let a=null,u=null;for(let t=0;t<o.length;t+=1){const e=o[t],y=parseFloat(e.getAttribute("value")??"");if(Number.isNaN(y))return;const c=e.parentElement;if(!c)return;const p=parseFloat(e.getAttribute("max")??"100"),g=parseFloat(e.getAttribute("min")??"0"),b=c?.getBoundingClientRect(),d=i[n]-b[n],m=100*(y-g)/(p-g),v=(b[n]/2+d*m/100)/i[n]*100;c.style.setProperty("--position",`${v}%`),Number.isFinite(v)&&(c.style.removeProperty("visibility"),r&&(0===t?(a=v,r.style.setProperty("--start-position",`${v}%`),l||r.style.removeProperty("visibility")):t===s&&(u=v-(a??0),r.style.setProperty("--end-position",`${v}%`),r.style.setProperty("--relative-size",`${u}%`),r.style.removeProperty("visibility"))))}}();', vt = "PageUp", Rt = "PageDown", en = /* @__PURE__ */ new Set([lt, at, st, ut, ot, it, vt, Rt]);
+function tn(e, t, r, i) {
+  if (!(t < 0))
+    return e.length === 2 ? t === 0 ? `${De(e[t], i, r)} start range` : `${De(e[t], i, r)} end range` : r ? De(e[t], i, r) : void 0;
+}
+function _e(e, t, r, i, o) {
+  return r === 1 ? Math.min(e + t, o) : Math.max(e - t, i);
+}
+const It = /* @__PURE__ */ a.forwardRef(function(t, r) {
+  const {
+    render: i,
+    children: o,
+    className: l,
+    "aria-describedby": u,
+    "aria-label": g,
+    "aria-labelledby": p,
+    disabled: w = !1,
+    getAriaLabel: h,
+    getAriaValueText: W,
+    id: E,
+    index: m,
+    inputRef: s,
+    onBlur: V,
+    onFocus: x,
+    onKeyDown: P,
+    tabIndex: y,
+    ...M
+  } = t, te = We(E), {
+    active: ne,
+    lastUsedThumbIndex: re,
+    controlRef: Re,
+    disabled: le,
+    validation: q,
+    formatOptionsRef: ce,
+    handleInputChange: H,
+    inset: U,
+    labelId: K,
+    largeStep: S,
+    locale: j,
+    max: A,
+    min: R,
+    minStepsBetweenValues: _,
+    name: B,
+    orientation: oe,
+    pressedInputRef: X,
+    pressedThumbCenterOffsetRef: Y,
+    pressedThumbIndexRef: de,
+    renderBeforeHydration: C,
+    setActive: Ie,
+    setIndicatorPosition: ie,
+    state: he,
+    step: O,
+    values: F
+  } = Le(), fe = nt(), ye = w || le, D = F.length > 1, L = oe === "vertical", se = fe === "rtl", {
+    setTouched: n,
+    setFocused: f,
+    validationMode: c
+  } = et(), b = a.useRef(null), d = a.useRef(null), $ = We(), me = Wt(), J = D ? $ : me, ge = a.useMemo(() => ({
+    inputId: J
+  }), [J]), {
+    ref: Pe,
+    index: Se
+  } = Bt({
+    metadata: ge
+  }), I = D ? m ?? Se : 0, xe = I === F.length - 1, Q = F[I], Z = qe(Q, R, A), [G, Ce] = a.useState(!1), [ee, ke] = a.useState();
+  rt(() => Ce(!0));
+  const Ae = re >= 0 && re < F.length ? re : -1, v = z(() => {
+    const N = Re.current, T = b.current;
+    if (!N || !T)
+      return;
+    const k = T.getBoundingClientRect(), Me = N.getBoundingClientRect(), Oe = L ? "height" : "width", xt = Me[Oe] - k[Oe], $e = (k[Oe] / 2 + xt * Z / 100) / Me[Oe] * 100;
+    ke($e), I === 0 ? ie((He) => [$e, He[1]]) : xe && ie((He) => [He[0], $e]);
+  });
+  ze(() => {
+    U && queueMicrotask(v);
+  }, [v, U]), ze(() => {
+    U && v();
+  }, [v, U, Z]);
+  const pe = a.useCallback(() => {
+    const N = L ? "bottom" : "insetInlineStart", T = L ? "left" : "top";
+    let k;
+    return D ? ne === I ? k = 2 : Ae === I && (k = 1) : ne === I && (k = 1), U ? {
+      "--position": `${ee}%`,
+      visibility: C && !G || ee === void 0 ? "hidden" : void 0,
+      position: "absolute",
+      [N]: "var(--position)",
+      [T]: "50%",
+      translate: `${(L || !se ? -1 : 1) * 50}% ${(L ? 1 : -1) * 50}%`,
+      zIndex: k
+    } : Number.isFinite(Z) ? {
+      position: "absolute",
+      [N]: `${Z}%`,
+      [T]: "50%",
+      translate: `${(L || !se ? -1 : 1) * 50}% ${(L ? 1 : -1) * 50}%`,
+      zIndex: k
+    } : Ge;
+  }, [ne, I, U, G, ee, D, C, se, Ae, Z, L]);
+  let ae;
+  oe === "vertical" && (ae = se ? "vertical-rl" : "vertical-lr");
+  const ve = Mt({
+    "aria-label": typeof h == "function" ? h(I) : g,
+    "aria-labelledby": p ?? K,
+    "aria-describedby": u,
+    "aria-orientation": oe,
+    "aria-valuenow": Q,
+    "aria-valuetext": typeof W == "function" ? W(De(Q, j, ce.current ?? void 0), Q, I) : tn(F, I, ce.current ?? void 0, j),
+    disabled: ye,
+    id: J,
+    max: A,
+    min: R,
+    name: B,
+    onChange(N) {
+      H(N.target.valueAsNumber, I, N);
+    },
+    onFocus() {
+      Ie(I), f(!0);
+    },
+    onBlur() {
+      b.current && (Ie(-1), n(!0), f(!1), c === "onBlur" && q.commit(ft(Q, I, R, A, D, F)));
+    },
+    onKeyDown(N) {
+      if (!en.has(N.key))
+        return;
+      zt.has(N.key) && N.stopPropagation();
+      let T = null;
+      const k = gt(Q, O, R);
+      switch (N.key) {
+        case lt:
+          T = _e(k, N.shiftKey ? S : O, 1, R, A);
+          break;
+        case ut:
+          T = _e(k, N.shiftKey ? S : O, se ? -1 : 1, R, A);
+          break;
+        case at:
+          T = _e(k, N.shiftKey ? S : O, -1, R, A);
+          break;
+        case st:
+          T = _e(k, N.shiftKey ? S : O, se ? 1 : -1, R, A);
+          break;
+        case vt:
+          T = _e(k, S, 1, R, A);
+          break;
+        case Rt:
+          T = _e(k, S, -1, R, A);
+          break;
+        case it:
+          T = A, D && (T = Number.isFinite(F[I + 1]) ? F[I + 1] - O * _ : A);
+          break;
+        case ot:
+          T = R, D && (T = Number.isFinite(F[I - 1]) ? F[I - 1] + O * _ : R);
+          break;
+      }
+      T !== null && (H(T, I, N), N.preventDefault());
+    },
+    step: O,
+    style: {
+      ...Ge,
+      // So that VoiceOver's focus indicator matches the thumb's dimensions
+      width: "100%",
+      height: "100%",
+      writingMode: ae
+    },
+    tabIndex: y ?? void 0,
+    type: "range",
+    value: Q ?? ""
+  }, q.getInputValidationProps), Te = Ot(d, q.inputRef, s);
+  return Ee("div", t, {
+    state: he,
+    ref: [r, Pe, b],
+    props: [{
+      [Qt.index]: I,
+      children: /* @__PURE__ */ Je(a.Fragment, {
+        children: [o, /* @__PURE__ */ be("input", {
+          ref: Te,
+          ...ve
+        }), U && !G && C && // this must be rendered with the last thumb to ensure all
+        // preceding thumbs are already rendered in the DOM
+        xe && /* @__PURE__ */ be("script", {
+          // eslint-disable-next-line react/no-danger
+          dangerouslySetInnerHTML: {
+            __html: Zt
+          },
+          suppressHydrationWarning: !0
+        })]
+      }),
+      id: te,
+      onBlur: V,
+      onFocus: x,
+      onPointerDown(N) {
+        if (de.current = I, b.current != null) {
+          const T = oe === "horizontal" ? "x" : "y", k = ht(b.current), Me = (oe === "horizontal" ? N.clientX : N.clientY) - k[T];
+          Y.current = Me;
+        }
+        d.current != null && X.current !== d.current && (X.current = d.current);
+      },
+      style: pe(),
+      suppressHydrationWarning: C || void 0,
+      tabIndex: -1
+    }, M],
+    stateAttributesMapping: Ve
+  });
+});
+process.env.NODE_ENV !== "production" && (It.displayName = "SliderThumb");
+function nn(e, t, r, i, o, l) {
+  const u = r === void 0 || t && i === void 0 ? "hidden" : void 0, g = e ? "bottom" : "insetInlineStart", p = e ? "height" : "width", h = {
+    visibility: o && !l ? "hidden" : u,
+    position: e ? "absolute" : "relative",
+    [e ? "width" : "height"]: "inherit"
+  };
+  return h["--start-position"] = `${r ?? 0}%`, t ? (h["--relative-size"] = `${(i ?? 0) - (r ?? 0)}%`, h[g] = "var(--start-position)", h[p] = "var(--relative-size)", h) : (h[g] = 0, h[p] = "var(--start-position)", h);
+}
+function rn(e, t, r, i) {
+  const o = e ? "bottom" : "insetInlineStart", l = e ? "height" : "width", g = {
+    position: e ? "absolute" : "relative",
+    [e ? "width" : "height"]: "inherit"
+  };
+  if (!t)
+    return g[o] = 0, g[l] = `${r}%`, g;
+  const p = i - r;
+  return g[o] = `${r}%`, g[l] = `${p}%`, g;
+}
+const St = /* @__PURE__ */ a.forwardRef(function(t, r) {
+  const {
+    render: i,
+    className: o,
+    ...l
+  } = t, {
+    indicatorPosition: u,
+    inset: g,
+    max: p,
+    min: w,
+    orientation: h,
+    renderBeforeHydration: W,
+    state: E,
+    values: m
+  } = Le(), [s, V] = a.useState(!1);
+  rt(() => V(!0));
+  const x = h === "vertical", P = m.length > 1, y = g ? nn(x, P, u[0], u[1], W, s) : rn(x, P, qe(m[0], w, p), qe(m[m.length - 1], w, p));
+  return Ee("div", t, {
+    state: E,
+    ref: r,
+    props: [{
+      "data-base-ui-slider-indicator": W ? "" : void 0,
+      style: y,
+      suppressHydrationWarning: W || void 0
+    }, l],
+    stateAttributesMapping: Ve
+  });
+});
+process.env.NODE_ENV !== "production" && (St.displayName = "SliderIndicator");
+const on = "_slider__control_15j4n_1", sn = "_slider__track_15j4n_8", an = "_slider__indicator_15j4n_16", un = "_slider__thumb_15j4n_27", Be = {
+  slider__control: on,
+  slider__track: sn,
+  slider__indicator: an,
+  slider__thumb: un
+};
+function Dn({
+  color: e = "primary",
+  ...t
+}) {
+  return /* @__PURE__ */ be(pt, { ...t, children: /* @__PURE__ */ be(bt, { className: Be.slider__control, children: /* @__PURE__ */ Je(
+    Pt,
+    {
+      render: /* @__PURE__ */ be(yt, {}),
+      color: e,
+      className: Be.slider__track,
+      children: [
+        /* @__PURE__ */ be(St, { className: Be.slider__indicator }),
+        /* @__PURE__ */ be(It, { className: Ct(Be.slider__thumb) })
+      ]
+    }
+  ) }) });
+}
+export {
+  Dn as Slider
+};