@ck-ui/component-library 0.1.5 → 0.3.0

package/dist/components/Table/_helpers/TableFilterModal/RangeSelector.js

@@ -0,0 +1,1544 @@
+import { jsxs as O, jsx as w } from "react/jsx-runtime";
+import * as h from "react";
+import { S as ke, N as nt, f as le, U as at, Q as ot, A as ue, o as je, q as st, r as it, P as t, O as lt, W as ct, X as J, x as Ue, d as Re, g as ut, L as ae, y as de, J as Je, e as Ke } from "../../../../useSlot-ylt7_lTY.js";
+import { c as xe } from "../../../../clsx-OuTLNxxd.js";
+import { a as Ye, c as Ge, b as qe } from "../../../../contains-kLLEGdNH.js";
+import { i as _e } from "../../../../isFocusVisible-BzX3wEi7.js";
+const dt = {
+  border: 0,
+  clip: "rect(0 0 0 0)",
+  height: "1px",
+  margin: "-1px",
+  overflow: "hidden",
+  padding: 0,
+  position: "absolute",
+  whiteSpace: "nowrap",
+  width: "1px"
+};
+function pt(e, a, i = (c, p) => c === p) {
+  return e.length === a.length && e.every((c, p) => i(c, a[p]));
+}
+const ft = 2, mt = [], Me = {};
+function ce(e, a, i, c, p) {
+  return i === 1 ? Math.min(e + a, p) : Math.max(e - a, c);
+}
+function Qe(e, a) {
+  return e - a;
+}
+function Be(e, a, i = -1) {
+  const c = e.reduce((y, S, f) => {
+    const u = Math.abs(a - S);
+    return y == null || u <= y.distance ? {
+      distance: u,
+      index: f
+    } : y;
+  }, null) ?? Me, {
+    index: p
+  } = c;
+  return p == null ? p : i >= 0 && e[i] === e[p] ? i : p;
+}
+function Ce(e, a) {
+  if (a.current != null && e.changedTouches) {
+    const i = e;
+    for (let c = 0; c < i.changedTouches.length; c += 1) {
+      const p = i.changedTouches[c];
+      if (p.identifier === a.current)
+        return {
+          x: p.clientX,
+          y: p.clientY
+        };
+    }
+    return !1;
+  }
+  return {
+    x: e.clientX,
+    y: e.clientY
+  };
+}
+function Pe(e, a, i) {
+  return (e - a) * 100 / (i - a);
+}
+function bt(e, a, i) {
+  return (i - a) * e + a;
+}
+function ht(e) {
+  if (Math.abs(e) < 1) {
+    const i = e.toExponential().split("e-"), c = i[0].split(".")[1];
+    return (c ? c.length : 0) + parseInt(i[1], 10);
+  }
+  const a = e.toString().split(".")[1];
+  return a ? a.length : 0;
+}
+function gt(e, a, i) {
+  const c = Math.round((e - i) / a) * a + i;
+  return Number(c.toFixed(ht(a)));
+}
+function We(e, a, i) {
+  const c = e.slice();
+  return c[i] = a, c.sort(Qe);
+}
+function Ae(e, a, i, c) {
+  const p = ue(e.current), y = Ye(p);
+  if (!Ge(e.current, y) || Number(y?.getAttribute("data-index")) !== a) {
+    const S = e.current?.querySelector(`[type="range"][data-index="${a}"]`);
+    S != null && (c == null ? S.focus({
+      preventScroll: !0
+    }) : S.focus({
+      preventScroll: !0,
+      // Prevent pointer-driven focus rings in browsers that support this option.
+      // Chrome 144+ supports `focusVisible` in `HTMLElement.focus()` options.
+      // @ts-expect-error `focusVisible` is not yet in TypeScript's lib.dom FocusOptions.
+      focusVisible: c
+    }));
+  }
+  i && i(a);
+}
+function Ie(e, a) {
+  return typeof e == "number" && typeof a == "number" ? e === a : typeof e == "object" && typeof a == "object" ? pt(e, a) : !1;
+}
+const vt = {
+  horizontal: {
+    offset: (e) => ({
+      left: `${e}%`
+    }),
+    leap: (e) => ({
+      width: `${e}%`
+    })
+  },
+  "horizontal-reverse": {
+    offset: (e) => ({
+      right: `${e}%`
+    }),
+    leap: (e) => ({
+      width: `${e}%`
+    })
+  },
+  vertical: {
+    offset: (e) => ({
+      bottom: `${e}%`
+    }),
+    leap: (e) => ({
+      height: `${e}%`
+    })
+  }
+}, yt = (e) => e;
+function kt(e) {
+  const {
+    "aria-labelledby": a,
+    defaultValue: i,
+    disabled: c = !1,
+    disableSwap: p = !1,
+    isRtl: y = !1,
+    marks: S = !1,
+    max: f = 100,
+    min: u = 0,
+    name: K,
+    onChange: H,
+    onChangeCommitted: _,
+    orientation: z = "horizontal",
+    rootRef: D,
+    scale: v = yt,
+    step: b = 1,
+    shiftStep: k = 10,
+    tabIndex: T,
+    value: E
+  } = e, M = h.useRef(void 0), oe = h.useRef(null), [B, G] = h.useState(-1), [Oe, Q] = h.useState(-1), [Z, we] = h.useState(!1), se = h.useRef(0), ie = h.useRef(-1), W = h.useRef(!1), pe = h.useRef(-1), $ = ke(() => {
+    oe.current != null && (cancelAnimationFrame(oe.current), oe.current = null);
+  }), F = h.useRef(null), [P, L] = nt({
+    controlled: E,
+    default: i ?? u,
+    name: "Slider"
+  }), j = ke((n, r, o) => {
+    const l = "nativeEvent" in n ? n.nativeEvent : n, s = new l.constructor(l.type, l);
+    Object.defineProperty(s, "target", {
+      writable: !0,
+      value: {
+        value: r,
+        name: K
+      }
+    }), F.current = r, H?.(s, r, o);
+  }), ee = Array.isArray(P), A = h.useMemo(() => {
+    if (typeof P == "number")
+      return [le(P, u, f)];
+    if (P == null)
+      return [u];
+    const n = P.slice().sort(Qe);
+    for (let r = 0; r < n.length; r += 1) {
+      const o = n[r];
+      n[r] = o == null ? u : le(o, u, f);
+    }
+    return n;
+  }, [P, u, f]), U = h.useMemo(() => {
+    if (S === !0 && b != null) {
+      const n = new Array(Math.floor((f - u) / b) + 1);
+      for (let r = 0; r < n.length; r += 1)
+        n[r] = {
+          value: u + b * r
+        };
+      return n;
+    }
+    return Array.isArray(S) ? S : mt;
+  }, [S, b, u, f]), N = h.useMemo(() => {
+    const n = new Array(U.length);
+    for (let r = 0; r < U.length; r += 1)
+      n[r] = U[r].value;
+    return n;
+  }, [U]), [fe, Y] = h.useState(-1), x = h.useRef(null), me = at(D, x), Ve = (n) => (r) => {
+    const o = Number(r.currentTarget.getAttribute("data-index"));
+    _e(r.target) && Y(o), Q(o), n?.onFocus?.(r);
+  }, be = (n) => (r) => {
+    _e(r.target) || Y(-1), Q(-1), n?.onBlur?.(r);
+  }, I = (n, r) => {
+    const o = Number(n.currentTarget.getAttribute("data-index")), l = A[o], s = N.indexOf(l);
+    let d = r;
+    if (U && b == null) {
+      const m = N[N.length - 1];
+      d >= m ? d = m : d <= N[0] ? d = N[0] : d = d < l ? N[s - 1] : N[s + 1];
+    }
+    if (d = le(d, u, f), ee) {
+      p && (d = le(d, A[o - 1] || -1 / 0, A[o + 1] || 1 / 0));
+      const m = d;
+      d = We(A, d, o);
+      let g = o;
+      p || (g = d.indexOf(m)), Ae(x, g);
+    }
+    L(d), Y(o), H && !Ie(d, P) && j(n, d, o), _ && _(n, F.current ?? d);
+  }, ze = (n) => (r) => {
+    if (["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", "PageUp", "PageDown", "Home", "End"].includes(r.key)) {
+      r.preventDefault();
+      const o = Number(r.currentTarget.getAttribute("data-index")), l = A[o];
+      let s = null;
+      if (b != null) {
+        const d = r.shiftKey ? k : b;
+        switch (r.key) {
+          case "ArrowUp":
+            s = ce(l, d, 1, u, f);
+            break;
+          case "ArrowRight":
+            s = ce(l, d, y ? -1 : 1, u, f);
+            break;
+          case "ArrowDown":
+            s = ce(l, d, -1, u, f);
+            break;
+          case "ArrowLeft":
+            s = ce(l, d, y ? 1 : -1, u, f);
+            break;
+          case "PageUp":
+            s = ce(l, k, 1, u, f);
+            break;
+          case "PageDown":
+            s = ce(l, k, -1, u, f);
+            break;
+          case "Home":
+            s = u;
+            break;
+          case "End":
+            s = f;
+            break;
+        }
+      } else if (U) {
+        const d = N[N.length - 1], m = N.indexOf(l), g = [y ? "ArrowRight" : "ArrowLeft", "ArrowDown", "PageDown", "Home"], q = [y ? "ArrowLeft" : "ArrowRight", "ArrowUp", "PageUp", "End"];
+        g.includes(r.key) ? m === 0 ? s = N[0] : s = N[m - 1] : q.includes(r.key) && (m === N.length - 1 ? s = d : s = N[m + 1]);
+      }
+      s != null && I(r, s);
+    }
+    n?.onKeyDown?.(r);
+  };
+  ot(() => {
+    const n = Ye(ue(x.current));
+    c && Ge(x.current, n) && n != null && "blur" in n && n.blur();
+  }, [c]), c && B !== -1 && G(-1), c && fe !== -1 && Y(-1);
+  const De = (n) => (r) => {
+    n.onChange?.(r), I(r, r.currentTarget.valueAsNumber);
+  }, te = h.useRef(void 0);
+  let C = z;
+  y && z === "horizontal" && (C += "-reverse");
+  const R = (n) => {
+    const {
+      current: r
+    } = x;
+    if (!r)
+      return null;
+    const {
+      width: o,
+      height: l,
+      bottom: s,
+      left: d
+    } = r.getBoundingClientRect();
+    let m;
+    C.startsWith("vertical") ? m = (s - n.y) / l : m = (n.x - d) / o, C.includes("-reverse") && (m = 1 - m);
+    let g;
+    if (g = bt(m, u, f), b)
+      g = gt(g, b, u);
+    else {
+      const Ne = Be(N, g);
+      g = N[Ne];
+    }
+    g = le(g, u, f);
+    let q = 0;
+    if (ee) {
+      const Ne = te.current !== -1;
+      q = Ne ? te.current : Be(A, g, ie.current), p && (g = le(g, A[q - 1] || -1 / 0, A[q + 1] || 1 / 0));
+      const rt = g;
+      g = We(A, g, q), p && Ne || (q = g.indexOf(rt), te.current = q);
+    }
+    return {
+      newValue: g,
+      activeIndex: q
+    };
+  }, re = ke((n) => {
+    if ("pointerId" in n && n.pointerId !== pe.current)
+      return;
+    const r = Ce(n, M);
+    if (!r)
+      return;
+    if (se.current += 1, n.type === "pointermove" && n.buttons === 0) {
+      X(n);
+      return;
+    }
+    const o = R(r);
+    o && (Ae(x, o.activeIndex, G, !1), ie.current = o.activeIndex, L(o.newValue), !Z && se.current > ft && we(!0), H && !Ie(o.newValue, P) && j(n, o.newValue, o.activeIndex));
+  }), X = ke((n) => {
+    if ("pointerId" in n && n.pointerId !== pe.current)
+      return;
+    const r = Ce(n, M);
+    if (we(!1), !r)
+      return;
+    const o = R(r);
+    G(-1), n.type === "touchend" && Q(-1), o && _ && _(n, F.current ?? o.newValue), "pointerType" in n && x.current?.hasPointerCapture(n.pointerId) && x.current.releasePointerCapture(n.pointerId), M.current = void 0, pe.current = -1, ne();
+  }), he = ke((n) => {
+    if (c)
+      return;
+    if (W.current) {
+      W.current = !1;
+      const s = n.changedTouches[0];
+      s != null && (M.current = s.identifier);
+      return;
+    }
+    const r = n.changedTouches[0];
+    r != null && (M.current = r.identifier);
+    const o = Ce(n, M);
+    if (o !== !1) {
+      te.current = -1;
+      const s = R(o);
+      s && (Ae(x, s.activeIndex, G, !1), ie.current = s.activeIndex, L(s.newValue), H && !Ie(s.newValue, P) && j(n, s.newValue, s.activeIndex));
+    }
+    se.current = 0;
+    const l = ue(x.current);
+    l.addEventListener("touchmove", re, {
+      passive: !0
+    }), l.addEventListener("touchend", X, {
+      passive: !0
+    });
+  }), ne = h.useCallback(() => {
+    const n = ue(x.current);
+    n.removeEventListener("pointermove", re), n.removeEventListener("pointerup", X), n.removeEventListener("touchmove", re), n.removeEventListener("touchend", X);
+  }, [X, re]);
+  h.useEffect(() => {
+    const n = x.current;
+    if (n)
+      return n.addEventListener("touchstart", he, {
+        passive: !0
+      }), () => {
+        n.removeEventListener("touchstart", he), $(), ne();
+      };
+  }, [ne, he, $]), h.useEffect(() => {
+    c && (ne(), $());
+  }, [c, ne, $]);
+  const Ee = (n) => (r) => {
+    if (n.onPointerDown?.(r), r.pointerType === "touch" && (W.current = !0), c || r.defaultPrevented || r.button !== 0)
+      return;
+    const o = Ce(r, M);
+    if (o !== !1) {
+      te.current = -1;
+      const s = R(o);
+      if (s) {
+        const d = x.current?.querySelector(`input[type="range"][data-index="${s.activeIndex}"]`), m = ue(x.current), g = d != null && d === Ye(m);
+        G(s.activeIndex), ie.current = s.activeIndex, g ? r.preventDefault() : ($(), oe.current = requestAnimationFrame(() => {
+          oe.current = null, Ae(x, s.activeIndex, void 0, !1);
+        })), L(s.newValue), H && !Ie(s.newValue, P) && j(r, s.newValue, s.activeIndex);
+      }
+    }
+    se.current = 0, pe.current = r.pointerId;
+    const l = ue(x.current);
+    try {
+      r.currentTarget.setPointerCapture(r.pointerId);
+    } catch {
+    }
+    l.addEventListener("pointermove", re, {
+      passive: !0
+    }), l.addEventListener("pointerup", X);
+  }, Se = Pe(ee ? A[0] : u, u, f), $e = Pe(A[A.length - 1], u, f) - Se, ge = (n = Me) => {
+    const r = je(n), o = {
+      onPointerDown: Ee(r)
+    }, l = {
+      ...r,
+      ...o
+    };
+    return {
+      ...n,
+      ref: me,
+      ...l
+    };
+  }, He = (n) => (r) => {
+    n.onMouseOver?.(r);
+    const o = Number(r.currentTarget.getAttribute("data-index"));
+    Q(o);
+  }, Fe = (n) => (r) => {
+    n.onMouseLeave?.(r), Q(-1);
+  }, Te = (n = Me) => {
+    const r = je(n), o = {
+      onMouseOver: He(r),
+      onMouseLeave: Fe(r)
+    };
+    return {
+      ...n,
+      ...r,
+      ...o
+    };
+  }, ve = (n) => {
+    let r;
+    return ee ? B === n ? r = 2 : ie.current === n && (r = 1) : B === n && (r = 1), {
+      // So the non active thumb doesn't show its label on hover.
+      pointerEvents: B !== -1 && B !== n ? "none" : void 0,
+      zIndex: r
+    };
+  };
+  let ye;
+  return z === "vertical" && (ye = y ? "vertical-rl" : "vertical-lr"), {
+    active: B,
+    axis: C,
+    axisProps: vt,
+    dragging: Z,
+    focusedThumbIndex: fe,
+    getHiddenInputProps: (n = Me) => {
+      const r = je(n), o = {
+        onChange: De(r),
+        onFocus: Ve(r),
+        onBlur: be(r),
+        onKeyDown: ze(r)
+      }, l = {
+        ...r,
+        ...o
+      };
+      return {
+        tabIndex: T,
+        "aria-labelledby": a,
+        "aria-orientation": z,
+        "aria-valuemax": v(f),
+        "aria-valuemin": v(u),
+        name: K,
+        type: "range",
+        min: e.min,
+        max: e.max,
+        step: e.step === null && e.marks ? "any" : e.step ?? void 0,
+        disabled: c,
+        ...n,
+        ...l,
+        style: {
+          ...dt,
+          direction: y ? "rtl" : "ltr",
+          // So that VoiceOver's focus indicator matches the thumb's dimensions
+          width: "100%",
+          height: "100%",
+          writingMode: ye
+        }
+      };
+    },
+    getRootProps: ge,
+    getThumbProps: Te,
+    marks: U,
+    open: Oe,
+    range: ee,
+    rootRef: me,
+    trackLeap: $e,
+    trackOffset: Se,
+    values: A,
+    getThumbStyle: ve
+  };
+}
+function xt(e) {
+  return st("MuiSlider", e);
+}
+const V = it("MuiSlider", ["root", "active", "colorPrimary", "colorSecondary", "colorError", "colorInfo", "colorSuccess", "colorWarning", "disabled", "dragging", "focusVisible", "mark", "markActive", "marked", "markLabel", "markLabelActive", "rail", "sizeSmall", "thumb", "track", "trackInverted", "trackFalse", "valueLabel", "valueLabelOpen", "valueLabelCircle", "valueLabelLabel", "vertical"]), wt = (e) => {
+  const {
+    open: a
+  } = e;
+  return {
+    offset: xe(a && V.valueLabelOpen),
+    circle: V.valueLabelCircle,
+    label: V.valueLabelLabel
+  };
+};
+function Ze(e) {
+  const {
+    children: a,
+    className: i,
+    value: c
+  } = e, p = wt(e);
+  return a ? /* @__PURE__ */ h.cloneElement(a, {
+    className: a.props.className
+  }, /* @__PURE__ */ O(h.Fragment, {
+    children: [a.props.children, /* @__PURE__ */ w("span", {
+      className: xe(p.offset, i),
+      "aria-hidden": !0,
+      children: /* @__PURE__ */ w("span", {
+        className: p.circle,
+        children: /* @__PURE__ */ w("span", {
+          className: p.label,
+          children: c
+        })
+      })
+    })]
+  })) : null;
+}
+process.env.NODE_ENV !== "production" && (Ze.propTypes = {
+  children: t.element.isRequired,
+  className: t.string,
+  value: t.node
+});
+function Xe(e) {
+  return e;
+}
+const St = ae("span", {
+  name: "MuiSlider",
+  slot: "Root",
+  overridesResolver: (e, a) => {
+    const {
+      ownerState: i
+    } = e;
+    return [a.root, a[`color${Re(i.color)}`], i.size !== "medium" && a[`size${Re(i.size)}`], i.marked && a.marked, i.orientation === "vertical" && a.vertical, i.track === "inverted" && a.trackInverted, i.track === !1 && a.trackFalse];
+  }
+})(de(({
+  theme: e
+}) => ({
+  borderRadius: 12,
+  boxSizing: "content-box",
+  display: "inline-block",
+  position: "relative",
+  cursor: "pointer",
+  touchAction: "none",
+  WebkitTapHighlightColor: "transparent",
+  "@media print": {
+    colorAdjust: "exact"
+  },
+  [`&.${V.disabled}`]: {
+    pointerEvents: "none",
+    cursor: "default",
+    color: (e.vars || e).palette.grey[400]
+  },
+  [`&.${V.dragging}`]: {
+    [`& .${V.thumb}, & .${V.track}`]: {
+      transition: "none"
+    }
+  },
+  variants: [...Object.entries(e.palette).filter(qe()).map(([a]) => ({
+    props: {
+      color: a
+    },
+    style: {
+      color: (e.vars || e).palette[a].main
+    }
+  })), {
+    props: {
+      orientation: "horizontal"
+    },
+    style: {
+      height: 4,
+      width: "100%",
+      padding: "13px 0",
+      // The primary input mechanism of the device includes a pointing device of limited accuracy.
+      "@media (pointer: coarse)": {
+        // Reach 42px touch target, about ~8mm on screen.
+        padding: "20px 0"
+      }
+    }
+  }, {
+    props: {
+      orientation: "horizontal",
+      size: "small"
+    },
+    style: {
+      height: 2
+    }
+  }, {
+    props: {
+      orientation: "horizontal",
+      marked: !0
+    },
+    style: {
+      marginBottom: 20
+    }
+  }, {
+    props: {
+      orientation: "vertical"
+    },
+    style: {
+      height: "100%",
+      width: 4,
+      padding: "0 13px",
+      // The primary input mechanism of the device includes a pointing device of limited accuracy.
+      "@media (pointer: coarse)": {
+        // Reach 42px touch target, about ~8mm on screen.
+        padding: "0 20px"
+      }
+    }
+  }, {
+    props: {
+      orientation: "vertical",
+      size: "small"
+    },
+    style: {
+      width: 2
+    }
+  }, {
+    props: {
+      orientation: "vertical",
+      marked: !0
+    },
+    style: {
+      marginRight: 44
+    }
+  }]
+}))), Tt = ae("span", {
+  name: "MuiSlider",
+  slot: "Rail"
+})({
+  display: "block",
+  position: "absolute",
+  borderRadius: "inherit",
+  backgroundColor: "currentColor",
+  opacity: 0.38,
+  "@media (forced-colors: active)": {
+    border: "1px solid transparent",
+    boxSizing: "border-box"
+  },
+  variants: [{
+    props: {
+      orientation: "horizontal"
+    },
+    style: {
+      width: "100%",
+      height: "inherit",
+      top: "50%",
+      transform: "translateY(-50%)"
+    }
+  }, {
+    props: {
+      orientation: "vertical"
+    },
+    style: {
+      height: "100%",
+      width: "inherit",
+      left: "50%",
+      transform: "translateX(-50%)"
+    }
+  }, {
+    props: {
+      track: "inverted"
+    },
+    style: {
+      opacity: 1
+    }
+  }]
+}), Lt = ae("span", {
+  name: "MuiSlider",
+  slot: "Track"
+})(de(({
+  theme: e
+}) => ({
+  display: "block",
+  position: "absolute",
+  borderRadius: "inherit",
+  border: "1px solid currentColor",
+  backgroundColor: "currentColor",
+  transition: e.transitions.create(["left", "width", "bottom", "height"], {
+    duration: e.transitions.duration.shortest
+  }),
+  variants: [{
+    props: {
+      size: "small"
+    },
+    style: {
+      "@media (forced-colors: none)": {
+        border: "none"
+      }
+    }
+  }, {
+    props: {
+      orientation: "horizontal"
+    },
+    style: {
+      height: "inherit",
+      top: "50%",
+      transform: "translateY(-50%)"
+    }
+  }, {
+    props: {
+      orientation: "vertical"
+    },
+    style: {
+      width: "inherit",
+      left: "50%",
+      transform: "translateX(-50%)"
+    }
+  }, {
+    props: {
+      track: !1
+    },
+    style: {
+      display: "none"
+    }
+  }, ...Object.entries(e.palette).filter(qe()).map(([a]) => ({
+    props: {
+      color: a,
+      track: "inverted"
+    },
+    style: {
+      ...e.vars ? {
+        backgroundColor: e.vars.palette.Slider[`${a}Track`],
+        borderColor: e.vars.palette.Slider[`${a}Track`]
+      } : {
+        backgroundColor: e.lighten(e.palette[a].main, 0.62),
+        borderColor: e.lighten(e.palette[a].main, 0.62),
+        ...e.applyStyles("dark", {
+          backgroundColor: e.darken(e.palette[a].main, 0.5)
+        }),
+        ...e.applyStyles("dark", {
+          borderColor: e.darken(e.palette[a].main, 0.5)
+        })
+      }
+    }
+  }))]
+}))), Nt = ae("span", {
+  name: "MuiSlider",
+  slot: "Thumb"
+})(de(({
+  theme: e
+}) => ({
+  position: "absolute",
+  width: 20,
+  height: 20,
+  boxSizing: "border-box",
+  borderRadius: "50%",
+  outline: 0,
+  backgroundColor: "currentColor",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  transition: e.transitions.create(["box-shadow", "left", "bottom"], {
+    duration: e.transitions.duration.shortest
+  }),
+  "@media (forced-colors: active)": {
+    border: "1px solid ButtonBorder"
+  },
+  "&::before": {
+    position: "absolute",
+    content: '""',
+    borderRadius: "inherit",
+    width: "100%",
+    height: "100%",
+    boxShadow: (e.vars || e).shadows[2]
+  },
+  "&::after": {
+    position: "absolute",
+    content: '""',
+    borderRadius: "50%",
+    // 42px is the hit target
+    width: 42,
+    height: 42,
+    top: "50%",
+    left: "50%",
+    transform: "translate(-50%, -50%)"
+  },
+  [`&.${V.disabled}`]: {
+    "&:hover": {
+      boxShadow: "none"
+    }
+  },
+  variants: [{
+    props: {
+      size: "small"
+    },
+    style: {
+      width: 12,
+      height: 12,
+      "&::before": {
+        boxShadow: "none"
+      }
+    }
+  }, {
+    props: {
+      orientation: "horizontal"
+    },
+    style: {
+      top: "50%",
+      transform: "translate(-50%, -50%)"
+    }
+  }, {
+    props: {
+      orientation: "vertical"
+    },
+    style: {
+      left: "50%",
+      transform: "translate(-50%, 50%)"
+    }
+  }, ...Object.entries(e.palette).filter(qe()).map(([a]) => ({
+    props: {
+      color: a
+    },
+    style: {
+      [`&:hover, &.${V.focusVisible}`]: {
+        boxShadow: `0px 0px 0px 8px ${e.alpha((e.vars || e).palette[a].main, 0.16)}`,
+        "@media (hover: none)": {
+          boxShadow: "none"
+        }
+      },
+      [`&.${V.active}`]: {
+        boxShadow: `0px 0px 0px 14px ${e.alpha((e.vars || e).palette[a].main, 0.16)}`
+      }
+    }
+  }))]
+}))), et = ae(Ze, {
+  name: "MuiSlider",
+  slot: "ValueLabel"
+})(de(({
+  theme: e
+}) => ({
+  zIndex: 1,
+  whiteSpace: "nowrap",
+  ...e.typography.body2,
+  fontWeight: 500,
+  transition: e.transitions.create(["transform"], {
+    duration: e.transitions.duration.shortest
+  }),
+  position: "absolute",
+  backgroundColor: (e.vars || e).palette.grey[600],
+  borderRadius: 2,
+  color: (e.vars || e).palette.common.white,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  padding: "0.25rem 0.75rem",
+  variants: [{
+    props: {
+      orientation: "horizontal"
+    },
+    style: {
+      transform: "translateY(-100%) scale(0)",
+      top: "-10px",
+      transformOrigin: "bottom center",
+      "&::before": {
+        position: "absolute",
+        content: '""',
+        width: 8,
+        height: 8,
+        transform: "translate(-50%, 50%) rotate(45deg)",
+        backgroundColor: "inherit",
+        bottom: 0,
+        left: "50%"
+      },
+      [`&.${V.valueLabelOpen}`]: {
+        transform: "translateY(-100%) scale(1)"
+      }
+    }
+  }, {
+    props: {
+      orientation: "vertical"
+    },
+    style: {
+      transform: "translateY(-50%) scale(0)",
+      right: "30px",
+      top: "50%",
+      transformOrigin: "right center",
+      "&::before": {
+        position: "absolute",
+        content: '""',
+        width: 8,
+        height: 8,
+        transform: "translate(-50%, -50%) rotate(45deg)",
+        backgroundColor: "inherit",
+        right: -8,
+        top: "50%"
+      },
+      [`&.${V.valueLabelOpen}`]: {
+        transform: "translateY(-50%) scale(1)"
+      }
+    }
+  }, {
+    props: {
+      size: "small"
+    },
+    style: {
+      fontSize: e.typography.pxToRem(12),
+      padding: "0.25rem 0.5rem"
+    }
+  }, {
+    props: {
+      orientation: "vertical",
+      size: "small"
+    },
+    style: {
+      right: "20px"
+    }
+  }]
+})));
+process.env.NODE_ENV !== "production" && (et.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  children: t.element.isRequired,
+  /**
+   * @ignore
+   */
+  index: t.number.isRequired,
+  /**
+   * @ignore
+   */
+  open: t.bool.isRequired,
+  /**
+   * @ignore
+   */
+  value: t.node
+});
+const Ct = ae("span", {
+  name: "MuiSlider",
+  slot: "Mark",
+  shouldForwardProp: (e) => Je(e) && e !== "markActive",
+  overridesResolver: (e, a) => {
+    const {
+      markActive: i
+    } = e;
+    return [a.mark, i && a.markActive];
+  }
+})(de(({
+  theme: e
+}) => ({
+  position: "absolute",
+  width: 2,
+  height: 2,
+  borderRadius: 1,
+  backgroundColor: "currentColor",
+  variants: [{
+    props: {
+      orientation: "horizontal"
+    },
+    style: {
+      top: "50%",
+      transform: "translate(-1px, -50%)"
+    }
+  }, {
+    props: {
+      orientation: "vertical"
+    },
+    style: {
+      left: "50%",
+      transform: "translate(-50%, 1px)"
+    }
+  }, {
+    props: {
+      markActive: !0
+    },
+    style: {
+      backgroundColor: (e.vars || e).palette.background.paper,
+      opacity: 0.8
+    }
+  }]
+}))), At = ae("span", {
+  name: "MuiSlider",
+  slot: "MarkLabel",
+  shouldForwardProp: (e) => Je(e) && e !== "markLabelActive"
+})(de(({
+  theme: e
+}) => ({
+  ...e.typography.body2,
+  color: (e.vars || e).palette.text.secondary,
+  position: "absolute",
+  whiteSpace: "nowrap",
+  variants: [{
+    props: {
+      orientation: "horizontal"
+    },
+    style: {
+      top: 30,
+      transform: "translateX(-50%)",
+      "@media (pointer: coarse)": {
+        top: 40
+      }
+    }
+  }, {
+    props: {
+      orientation: "vertical"
+    },
+    style: {
+      left: 36,
+      transform: "translateY(50%)",
+      "@media (pointer: coarse)": {
+        left: 44
+      }
+    }
+  }, {
+    props: {
+      markLabelActive: !0
+    },
+    style: {
+      color: (e.vars || e).palette.text.primary
+    }
+  }]
+}))), It = (e) => {
+  const {
+    disabled: a,
+    dragging: i,
+    marked: c,
+    orientation: p,
+    track: y,
+    classes: S,
+    color: f,
+    size: u
+  } = e, K = {
+    root: ["root", a && "disabled", i && "dragging", c && "marked", p === "vertical" && "vertical", y === "inverted" && "trackInverted", y === !1 && "trackFalse", f && `color${Re(f)}`, u && `size${Re(u)}`],
+    rail: ["rail"],
+    track: ["track"],
+    mark: ["mark"],
+    markActive: ["markActive"],
+    markLabel: ["markLabel"],
+    markLabelActive: ["markLabelActive"],
+    valueLabel: ["valueLabel"],
+    thumb: ["thumb", a && "disabled"],
+    active: ["active"],
+    disabled: ["disabled"],
+    focusVisible: ["focusVisible"]
+  };
+  return ut(K, xt, S);
+}, Mt = ({
+  children: e
+}) => e, tt = /* @__PURE__ */ h.forwardRef(function(a, i) {
+  const c = lt({
+    props: a,
+    name: "MuiSlider"
+  }), p = ct(), {
+    "aria-label": y,
+    "aria-valuetext": S,
+    "aria-labelledby": f,
+    color: u = "primary",
+    classes: K,
+    className: H,
+    disableSwap: _ = !1,
+    disabled: z = !1,
+    getAriaLabel: D,
+    getAriaValueText: v,
+    marks: b = !1,
+    max: k = 100,
+    min: T = 0,
+    name: E,
+    onChange: M,
+    onChangeCommitted: oe,
+    orientation: B = "horizontal",
+    shiftStep: G = 10,
+    size: Oe = "medium",
+    step: Q = 1,
+    scale: Z = Xe,
+    slotProps: we = {},
+    slots: se = {},
+    tabIndex: ie,
+    track: W = "normal",
+    value: pe,
+    valueLabelDisplay: $ = "off",
+    valueLabelFormat: F = Xe,
+    ...P
+  } = c, L = {
+    ...c,
+    isRtl: p,
+    max: k,
+    min: T,
+    classes: K,
+    disabled: z,
+    disableSwap: _,
+    orientation: B,
+    marks: b,
+    color: u,
+    size: Oe,
+    step: Q,
+    shiftStep: G,
+    scale: Z,
+    track: W,
+    valueLabelDisplay: $,
+    valueLabelFormat: F
+  }, {
+    axisProps: j,
+    getRootProps: ee,
+    getHiddenInputProps: A,
+    getThumbProps: U,
+    open: N,
+    active: fe,
+    axis: Y,
+    focusedThumbIndex: x,
+    range: me,
+    dragging: Ve,
+    marks: be,
+    values: I,
+    trackOffset: ze,
+    trackLeap: De,
+    getThumbStyle: te
+  } = kt({
+    ...L,
+    rootRef: i
+  });
+  L.marked = be.length > 0 && be.some((o) => o.label), L.dragging = Ve, L.focusedThumbIndex = x;
+  const C = It(L), R = {
+    slots: se,
+    slotProps: we
+  }, [re, X] = J("root", {
+    elementType: St,
+    getSlotProps: ee,
+    externalForwardedProps: {
+      ...R,
+      ...P
+    },
+    ownerState: L,
+    className: [C.root, H]
+  }), [he, ne] = J("rail", {
+    elementType: Tt,
+    externalForwardedProps: R,
+    ownerState: L,
+    className: C.rail
+  }), [Ee, Se] = J("track", {
+    elementType: Lt,
+    externalForwardedProps: R,
+    additionalProps: {
+      style: {
+        ...j[Y].offset(ze),
+        ...j[Y].leap(De)
+      }
+    },
+    ownerState: L,
+    className: C.track
+  }), [$e, ge] = J("thumb", {
+    elementType: Nt,
+    getSlotProps: U,
+    externalForwardedProps: R,
+    ownerState: L,
+    className: C.thumb
+  }), [He, Fe] = J("valueLabel", {
+    elementType: et,
+    externalForwardedProps: R,
+    ownerState: L,
+    className: C.valueLabel
+  }), [Te, ve] = J("mark", {
+    elementType: Ct,
+    externalForwardedProps: R,
+    ownerState: L,
+    className: C.mark
+  }), [ye, Le] = J("markLabel", {
+    elementType: At,
+    externalForwardedProps: R,
+    ownerState: L,
+    className: C.markLabel
+  }), [n, r] = J("input", {
+    elementType: "input",
+    getSlotProps: A,
+    externalForwardedProps: R,
+    ownerState: L
+  });
+  return /* @__PURE__ */ O(re, {
+    ...X,
+    children: [/* @__PURE__ */ w(he, {
+      ...ne
+    }), /* @__PURE__ */ w(Ee, {
+      ...Se
+    }), be.filter((o) => o.value >= T && o.value <= k).map((o, l) => {
+      const s = Pe(o.value, T, k), d = j[Y].offset(s);
+      let m;
+      return W === !1 ? m = I.includes(o.value) : m = W === "normal" && (me ? o.value >= I[0] && o.value <= I[I.length - 1] : o.value <= I[0]) || W === "inverted" && (me ? o.value <= I[0] || o.value >= I[I.length - 1] : o.value >= I[0]), /* @__PURE__ */ O(h.Fragment, {
+        children: [/* @__PURE__ */ w(Te, {
+          "data-index": l,
+          ...ve,
+          ...!Ue(Te) && {
+            markActive: m
+          },
+          style: {
+            ...d,
+            ...ve.style
+          },
+          className: xe(ve.className, m && C.markActive)
+        }), o.label != null ? /* @__PURE__ */ w(ye, {
+          "aria-hidden": !0,
+          "data-index": l,
+          ...Le,
+          ...!Ue(ye) && {
+            markLabelActive: m
+          },
+          style: {
+            ...d,
+            ...Le.style
+          },
+          className: xe(C.markLabel, Le.className, m && C.markLabelActive),
+          children: o.label
+        }) : null]
+      }, l);
+    }), I.map((o, l) => {
+      const s = Pe(o, T, k), d = j[Y].offset(s), m = $ === "off" ? Mt : He;
+      return (
+        /* TODO v6: Change component structure. It will help in avoiding the complicated React.cloneElement API added in SliderValueLabel component. Should be: Thumb -> Input, ValueLabel. Follow Joy UI's Slider structure. */
+        /* @__PURE__ */ w(m, {
+          ...!Ue(m) && {
+            valueLabelFormat: F,
+            valueLabelDisplay: $,
+            value: typeof F == "function" ? F(Z(o), l) : F,
+            index: l,
+            open: N === l || fe === l || $ === "on",
+            disabled: z
+          },
+          ...Fe,
+          children: /* @__PURE__ */ w($e, {
+            "data-index": l,
+            ...ge,
+            className: xe(C.thumb, ge.className, fe === l && C.active, x === l && C.focusVisible),
+            style: {
+              ...d,
+              ...te(l),
+              ...ge.style
+            },
+            children: /* @__PURE__ */ w(n, {
+              "data-index": l,
+              "aria-label": D ? D(l) : y,
+              "aria-valuenow": Z(o),
+              "aria-labelledby": f,
+              "aria-valuetext": v ? v(Z(o), l) : S,
+              value: I[l],
+              ...r
+            })
+          })
+        }, l)
+      );
+    })]
+  });
+});
+process.env.NODE_ENV !== "production" && (tt.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The label of the slider.
+   */
+  "aria-label": Ke(t.string, (e) => Array.isArray(e.value || e.defaultValue) && e["aria-label"] != null ? new Error("MUI: You need to use the `getAriaLabel` prop instead of `aria-label` when using a range slider.") : null),
+  /**
+   * The id of the element containing a label for the slider.
+   */
+  "aria-labelledby": t.string,
+  /**
+   * A string value that provides a user-friendly name for the current value of the slider.
+   */
+  "aria-valuetext": Ke(t.string, (e) => Array.isArray(e.value || e.defaultValue) && e["aria-valuetext"] != null ? new Error("MUI: You need to use the `getAriaValueText` prop instead of `aria-valuetext` when using a range slider.") : null),
+  /**
+   * @ignore
+   */
+  children: t.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: t.object,
+  /**
+   * @ignore
+   */
+  className: t.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'primary'
+   */
+  color: t.oneOfType([t.oneOf(["primary", "secondary", "error", "info", "success", "warning"]), t.string]),
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue: t.oneOfType([t.arrayOf(t.number), t.number]),
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: t.bool,
+  /**
+   * If `true`, the active thumb doesn't swap when moving pointer over a thumb while dragging another thumb.
+   * @default false
+   */
+  disableSwap: t.bool,
+  /**
+   * Accepts a function which returns a string value that provides a user-friendly name for the thumb labels of the slider.
+   * This is important for screen reader users.
+   * @param {number} index The thumb label's index to format.
+   * @returns {string}
+   */
+  getAriaLabel: t.func,
+  /**
+   * Accepts a function which returns a string value that provides a user-friendly name for the current value of the slider.
+   * This is important for screen reader users.
+   * @param {number} value The thumb label's value to format.
+   * @param {number} index The thumb label's index to format.
+   * @returns {string}
+   */
+  getAriaValueText: t.func,
+  /**
+   * Marks indicate predetermined values to which the user can move the slider.
+   * If `true` the marks are spaced according the value of the `step` prop.
+   * If an array, it should contain objects with `value` and an optional `label` keys.
+   * @default false
+   */
+  marks: t.oneOfType([t.arrayOf(t.shape({
+    label: t.node,
+    value: t.number.isRequired
+  })), t.bool]),
+  /**
+   * The maximum allowed value of the slider.
+   * Should not be equal to min.
+   * @default 100
+   */
+  max: t.number,
+  /**
+   * The minimum allowed value of the slider.
+   * Should not be equal to max.
+   * @default 0
+   */
+  min: t.number,
+  /**
+   * Name attribute of the hidden `input` element.
+   */
+  name: t.string,
+  /**
+   * Callback function that is fired when the slider's value changed.
+   *
+   * @param {Event} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (any).
+   * **Warning**: This is a generic event not a change event.
+   * @param {Value} value The new value.
+   * @param {number} activeThumb Index of the currently moved thumb.
+   */
+  onChange: t.func,
+  /**
+   * Callback function that is fired when the pointer or touch interaction ends.
+   *
+   * @param {React.SyntheticEvent | Event} event The event source of the callback. **Warning**: This is a generic event not a change event.
+   * @param {Value} value The new value.
+   */
+  onChangeCommitted: t.func,
+  /**
+   * The component orientation.
+   * @default 'horizontal'
+   */
+  orientation: t.oneOf(["horizontal", "vertical"]),
+  /**
+   * A transformation function, to change the scale of the slider.
+   * @param {any} x
+   * @returns {any}
+   * @default function Identity(x) {
+   *   return x;
+   * }
+   */
+  scale: t.func,
+  /**
+   * The granularity with which the slider can step through values when using Page Up/Page Down or Shift + Arrow Up/Arrow Down.
+   * @default 10
+   */
+  shiftStep: t.number,
+  /**
+   * The size of the slider.
+   * @default 'medium'
+   */
+  size: t.oneOfType([t.oneOf(["small", "medium"]), t.string]),
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: t.shape({
+    input: t.oneOfType([t.func, t.object]),
+    mark: t.oneOfType([t.func, t.object]),
+    markLabel: t.oneOfType([t.func, t.object]),
+    rail: t.oneOfType([t.func, t.object]),
+    root: t.oneOfType([t.func, t.object]),
+    thumb: t.oneOfType([t.func, t.object]),
+    track: t.oneOfType([t.func, t.object]),
+    valueLabel: t.oneOfType([t.func, t.shape({
+      children: t.element,
+      className: t.string,
+      open: t.bool,
+      style: t.object,
+      value: t.node,
+      valueLabelDisplay: t.oneOf(["auto", "off", "on"])
+    })])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: t.shape({
+    input: t.elementType,
+    mark: t.elementType,
+    markLabel: t.elementType,
+    rail: t.elementType,
+    root: t.elementType,
+    thumb: t.elementType,
+    track: t.elementType,
+    valueLabel: t.elementType
+  }),
+  /**
+   * The granularity with which the slider can step through values. (A "discrete" slider.)
+   * The `min` prop serves as the origin for the valid values.
+   * We recommend (max - min) to be evenly divisible by the step.
+   *
+   * When step is `null`, the thumb can only be slid onto marks provided with the `marks` prop.
+   * @default 1
+   */
+  step: t.number,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object]),
+  /**
+   * Tab index attribute of the hidden `input` element.
+   */
+  tabIndex: t.number,
+  /**
+   * The track presentation:
+   *
+   * - `normal` the track will render a bar representing the slider value.
+   * - `inverted` the track will render a bar representing the remaining slider value.
+   * - `false` the track will render without a bar.
+   * @default 'normal'
+   */
+  track: t.oneOf(["inverted", "normal", !1]),
+  /**
+   * The value of the slider.
+   * For ranged sliders, provide an array with two values.
+   */
+  value: t.oneOfType([t.arrayOf(t.number), t.number]),
+  /**
+   * Controls when the value label is displayed:
+   *
+   * - `auto` the value label will display when the thumb is hovered or focused.
+   * - `on` will display persistently.
+   * - `off` will never display.
+   * @default 'off'
+   */
+  valueLabelDisplay: t.oneOf(["auto", "off", "on"]),
+  /**
+   * The format function the value label's value.
+   *
+   * When a function is provided, it should have the following signature:
+   *
+   * - {number} value The value label's value to format
+   * - {number} index The value label's index to format
+   * @param {any} x
+   * @returns {any}
+   * @default function Identity(x) {
+   *   return x;
+   * }
+   */
+  valueLabelFormat: t.oneOfType([t.func, t.string])
+});
+function Dt({
+  selectedFilter: e,
+  currentVal: a,
+  setDraftColumnFilters: i,
+  error: c,
+  setError: p
+}) {
+  const S = (v) => {
+    i((b) => [
+      ...b.filter((k) => k.id !== e?.accessorKey),
+      { id: e?.accessorKey ?? "", value: v }
+    ]);
+  }, f = (v, b) => {
+    const k = e?.values?.min ?? 0, T = e?.values?.max ?? 0, E = Number(v), M = Number(b);
+    return String(v) === "" || Number.isNaN(E) ? "Minimum value is invalid." : E < k ? `Minimum value cannot be less than ${k}.` : E > M ? "Minimum value cannot be greater than maximum value." : String(b) === "" || Number.isNaN(M) ? "Maximum value is invalid." : M > T ? `Maximum value cannot be greater than ${T}.` : M < E ? "Maximum value cannot be less than minimum value." : "";
+  }, u = () => e?.type === "range" ? e.values : { min: 0, max: 0 }, K = (v) => {
+    if (!e) return;
+    const b = v.target.value, k = a?.max;
+    p(f(b, k ?? 0));
+    const T = a || u();
+    S({ ...T, min: Number(b) });
+  }, H = (v) => {
+    if (!e) return;
+    const b = v.target.value, k = a?.min;
+    p(f(k ?? 0, b));
+    const T = a || u();
+    S({ ...T, max: Number(b) });
+  }, _ = (v, b, k) => {
+    if (!e || !Array.isArray(b)) return;
+    const T = a || u();
+    let E;
+    k === 0 ? E = { ...T, min: Math.min(b[0], T.max - 0) } : E = { ...T, max: Math.max(b[1], T.min + 0) }, S(E);
+  }, z = u(), D = a || z;
+  return /* @__PURE__ */ O("div", { children: [
+    /* @__PURE__ */ O("div", { className: `ckds-filter-detail ${c ? "" : "mb-6"}`, children: [
+      /* @__PURE__ */ O("div", { className: "ckds-filter-slider-values", children: [
+        /* @__PURE__ */ w("p", { children: "Minimum Value" }),
+        /* @__PURE__ */ O("div", { className: "ckds-slider-input", children: [
+          /* @__PURE__ */ w("span", { className: "ckds-currency-prefix", children: "$" }),
+          /* @__PURE__ */ w(
+            "input",
+            {
+              type: "number",
+              name: "min",
+              value: D.min,
+              onChange: K,
+              className: "ckds-currency-input-field",
+              placeholder: "0",
+              onKeyDown: (v) => ["e", "E", "+", "-", "."].includes(v.key) && v.preventDefault()
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ O("div", { className: "ckds-filter-slider-values", children: [
+        /* @__PURE__ */ w("p", { children: "Maximum Value" }),
+        /* @__PURE__ */ O("div", { className: "ckds-slider-input", children: [
+          /* @__PURE__ */ w("span", { className: "ckds-currency-prefix", children: "$" }),
+          /* @__PURE__ */ w(
+            "input",
+            {
+              type: "number",
+              name: "max",
+              value: D.max,
+              onChange: H,
+              className: "ckds-currency-input-field",
+              placeholder: "0",
+              onKeyDown: (v) => ["e", "E", "+", "-", "."].includes(v.key) && v.preventDefault()
+            }
+          )
+        ] })
+      ] })
+    ] }),
+    c && /* @__PURE__ */ w("div", { className: "ckds-filter-error", children: c }),
+    /* @__PURE__ */ w("div", { style: { width: "100%", paddingInline: 14, boxSizing: "border-box" }, children: /* @__PURE__ */ w(
+      tt,
+      {
+        className: "slider",
+        min: z.min,
+        max: z.max,
+        value: [D.min, D.max],
+        onChange: _,
+        disableSwap: !0,
+        valueLabelDisplay: "auto"
+      }
+    ) }),
+    /* @__PURE__ */ O("div", { className: "ckds-slider-input-display", children: [
+      /* @__PURE__ */ O("span", { children: [
+        "$",
+        Number(D.min),
+        " "
+      ] }),
+      /* @__PURE__ */ O("span", { children: [
+        "$",
+        Number(D.max),
+        " "
+      ] })
+    ] })
+  ] });
+}
+export {
+  Dt as default
+};