@ck-ui/component-library 2.0.3 → 2.0.4

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

@@ -1,1535 +1,38 @@
-import { jsxs as O, jsx as w } from "react/jsx-runtime";
-import * as h from "react";
-import { u as ke, a as rt, c as le, b as nt, d as at, o as ue, e as je, g as ot, f as st, P as t, h as it, i as lt, j as G, s as ae, k as Ue, l as Re, m as ct, n as de, p as Ge, q as Ke } from "../../../../useSlot-BAOpgsKZ.js";
-import { c as xe } from "../../../../clsx-OuTLNxxd.js";
-import { a as Ye, c as qe } from "../../../../createSimplePaletteValueFilter-BqxST_wX.js";
-import { i as _e } from "../../../../isFocusVisible-BzX3wEi7.js";
-const ut = {
-  border: 0,
-  clip: "rect(0 0 0 0)",
-  height: "1px",
-  margin: "-1px",
-  overflow: "hidden",
-  padding: 0,
-  position: "absolute",
-  whiteSpace: "nowrap",
-  width: "1px"
-};
-function dt(e, a, i = (c, p) => c === p) {
-  return e.length === a.length && e.every((c, p) => i(c, a[p]));
-}
-const pt = 2, ft = [], Me = {};
-function ce(e, a, i, c, p) {
-  return i === 1 ? Math.min(e + a, p) : Math.max(e - a, c);
-}
-function Je(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 Ne(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 mt(e, a, i) {
-  return (i - a) * e + a;
-}
-function bt(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 ht(e, a, i) {
-  const c = Math.round((e - i) / a) * a + i;
-  return Number(c.toFixed(bt(a)));
-}
-function We(e, a, i) {
-  const c = e.slice();
-  return c[i] = a, c.sort(Je);
-}
-function Ae(e, a, i, c) {
-  const p = ue(e.current), y = Ye(p);
-  if (!e.current?.contains(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" ? dt(e, a) : !1;
-}
-const gt = {
-  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}%`
-    })
-  }
-}, vt = (e) => e;
-function yt(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: D = "horizontal",
-    rootRef: z,
-    scale: v = vt,
-    step: b = 1,
-    shiftStep: k = 10,
-    tabIndex: T,
-    value: E
-  } = e, M = h.useRef(void 0), oe = h.useRef(null), [B, J] = 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] = rt({
-    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(Je);
-    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 : ft;
-  }, [S, b, u, f]), C = 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 = nt(z, 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 = C.indexOf(l);
-    let d = r;
-    if (U && b == null) {
-      const m = C[C.length - 1];
-      d >= m ? d = m : d <= C[0] ? d = C[0] : d = d < l ? C[s - 1] : C[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);
-  }, De = (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 = C[C.length - 1], m = C.indexOf(l), g = [y ? "ArrowRight" : "ArrowLeft", "ArrowDown", "PageDown", "Home"], q = [y ? "ArrowLeft" : "ArrowRight", "ArrowUp", "PageUp", "End"];
-        g.includes(r.key) ? m === 0 ? s = C[0] : s = C[m - 1] : q.includes(r.key) && (m === C.length - 1 ? s = d : s = C[m + 1]);
-      }
-      s != null && I(r, s);
-    }
-    n?.onKeyDown?.(r);
-  };
-  at(() => {
-    const n = Ye(ue(x.current));
-    c && x.current?.contains(n) && n != null && "blur" in n && n.blur();
-  }, [c]), c && B !== -1 && J(-1), c && fe !== -1 && Y(-1);
-  const ze = (n) => (r) => {
-    n.onChange?.(r), I(r, r.currentTarget.valueAsNumber);
-  }, te = h.useRef(void 0);
-  let N = D;
-  y && D === "horizontal" && (N += "-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;
-    N.startsWith("vertical") ? m = (s - n.y) / l : m = (n.x - d) / o, N.includes("-reverse") && (m = 1 - m);
-    let g;
-    if (g = mt(m, u, f), b)
-      g = ht(g, b, u);
-    else {
-      const Ce = Be(C, g);
-      g = C[Ce];
-    }
-    g = le(g, u, f);
-    let q = 0;
-    if (ee) {
-      const Ce = te.current !== -1;
-      q = Ce ? te.current : Be(A, g, ie.current), p && (g = le(g, A[q - 1] || -1 / 0, A[q + 1] || 1 / 0));
-      const tt = g;
-      g = We(A, g, q), p && Ce || (q = g.indexOf(tt), te.current = q);
-    }
-    return {
-      newValue: g,
-      activeIndex: q
-    };
-  }, re = ke((n) => {
-    if ("pointerId" in n && n.pointerId !== pe.current)
-      return;
-    const r = Ne(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, J, !1), ie.current = o.activeIndex, L(o.newValue), !Z && se.current > pt && 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 = Ne(n, M);
-    if (we(!1), !r)
-      return;
-    const o = R(r);
-    J(-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 = Ne(n, M);
-    if (o !== !1) {
-      te.current = -1;
-      const s = R(o);
-      s && (Ae(x, s.activeIndex, J, !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 = Ne(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);
-        J(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 D === "vertical" && (ye = y ? "vertical-rl" : "vertical-lr"), {
-    active: B,
-    axis: N,
-    axisProps: gt,
-    dragging: Z,
-    focusedThumbIndex: fe,
-    getHiddenInputProps: (n = Me) => {
-      const r = je(n), o = {
-        onChange: ze(r),
-        onFocus: Ve(r),
-        onBlur: be(r),
-        onKeyDown: De(r)
-      }, l = {
-        ...r,
-        ...o
-      };
-      return {
-        tabIndex: T,
-        "aria-labelledby": a,
-        "aria-orientation": D,
-        "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: {
-          ...ut,
-          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 kt(e) {
-  return st("MuiSlider", e);
-}
-const V = ot("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"]), xt = (e) => {
-  const {
-    open: a
-  } = e;
-  return {
-    offset: xe(a && V.valueLabelOpen),
-    circle: V.valueLabelCircle,
-    label: V.valueLabelLabel
-  };
-};
-function Qe(e) {
-  const {
-    children: a,
-    className: i,
-    value: c
-  } = e, p = xt(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" && (Qe.propTypes = {
-  children: t.element.isRequired,
-  className: t.string,
-  value: t.node
-});
-function Xe(e) {
-  return e;
-}
-const wt = 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
-    }
-  }]
-}))), St = ae("span", {
-  name: "MuiSlider",
-  slot: "Rail"
-})({
-  display: "block",
-  position: "absolute",
-  borderRadius: "inherit",
-  backgroundColor: "currentColor",
-  opacity: 0.38,
-  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
-    }
-  }]
-}), Tt = 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: {
-      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)
-        })
-      }
-    }
-  }))]
-}))), Lt = 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
-  }),
-  "&::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)}`
-      }
-    }
-  }))]
-}))), Ze = ae(Qe, {
-  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" && (Ze.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) => Ge(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
-    }
-  }]
-}))), Nt = ae("span", {
-  name: "MuiSlider",
-  slot: "MarkLabel",
-  shouldForwardProp: (e) => Ge(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
-    }
-  }]
-}))), At = (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 ct(K, kt, S);
-}, It = ({
-  children: e
-}) => e, et = /* @__PURE__ */ h.forwardRef(function(a, i) {
-  const c = it({
-    props: a,
-    name: "MuiSlider"
-  }), p = lt(), {
-    "aria-label": y,
-    "aria-valuetext": S,
-    "aria-labelledby": f,
-    color: u = "primary",
-    classes: K,
-    className: H,
-    disableSwap: _ = !1,
-    disabled: D = !1,
-    getAriaLabel: z,
-    getAriaValueText: v,
-    marks: b = !1,
-    max: k = 100,
-    min: T = 0,
-    name: E,
-    onChange: M,
-    onChangeCommitted: oe,
-    orientation: B = "horizontal",
-    shiftStep: J = 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: D,
-    disableSwap: _,
-    orientation: B,
-    marks: b,
-    color: u,
-    size: Oe,
-    step: Q,
-    shiftStep: J,
-    scale: Z,
-    track: W,
-    valueLabelDisplay: $,
-    valueLabelFormat: F
-  }, {
-    axisProps: j,
-    getRootProps: ee,
-    getHiddenInputProps: A,
-    getThumbProps: U,
-    open: C,
-    active: fe,
-    axis: Y,
-    focusedThumbIndex: x,
-    range: me,
-    dragging: Ve,
-    marks: be,
-    values: I,
-    trackOffset: De,
-    trackLeap: ze,
-    getThumbStyle: te
-  } = yt({
-    ...L,
-    rootRef: i
-  });
-  L.marked = be.length > 0 && be.some((o) => o.label), L.dragging = Ve, L.focusedThumbIndex = x;
-  const N = At(L), R = {
-    slots: se,
-    slotProps: we
-  }, [re, X] = G("root", {
-    elementType: wt,
-    getSlotProps: ee,
-    externalForwardedProps: {
-      ...R,
-      ...P
-    },
-    ownerState: L,
-    className: [N.root, H]
-  }), [he, ne] = G("rail", {
-    elementType: St,
-    externalForwardedProps: R,
-    ownerState: L,
-    className: N.rail
-  }), [Ee, Se] = G("track", {
-    elementType: Tt,
-    externalForwardedProps: R,
-    additionalProps: {
-      style: {
-        ...j[Y].offset(De),
-        ...j[Y].leap(ze)
-      }
-    },
-    ownerState: L,
-    className: N.track
-  }), [$e, ge] = G("thumb", {
-    elementType: Lt,
-    getSlotProps: U,
-    externalForwardedProps: R,
-    ownerState: L,
-    className: N.thumb
-  }), [He, Fe] = G("valueLabel", {
-    elementType: Ze,
-    externalForwardedProps: R,
-    ownerState: L,
-    className: N.valueLabel
-  }), [Te, ve] = G("mark", {
-    elementType: Ct,
-    externalForwardedProps: R,
-    ownerState: L,
-    className: N.mark
-  }), [ye, Le] = G("markLabel", {
-    elementType: Nt,
-    externalForwardedProps: R,
-    ownerState: L,
-    className: N.markLabel
-  }), [n, r] = G("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 && N.markActive)
-        }), o.label != null ? /* @__PURE__ */ w(ye, {
-          "aria-hidden": !0,
-          "data-index": l,
-          ...Le,
-          ...!Ue(ye) && {
-            markLabelActive: m
-          },
-          style: {
-            ...d,
-            ...Le.style
-          },
-          className: xe(N.markLabel, Le.className, m && N.markLabelActive),
-          children: o.label
-        }) : null]
-      }, l);
-    }), I.map((o, l) => {
-      const s = Pe(o, T, k), d = j[Y].offset(s), m = $ === "off" ? It : 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: C === l || fe === l || $ === "on",
-            disabled: D
-          },
-          ...Fe,
-          children: /* @__PURE__ */ w($e, {
-            "data-index": l,
-            ...ge,
-            className: xe(N.thumb, ge.className, fe === l && N.active, x === l && N.focusVisible),
-            style: {
-              ...d,
-              ...te(l),
-              ...ge.style
-            },
-            children: /* @__PURE__ */ w(n, {
-              "data-index": l,
-              "aria-label": z ? z(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" && (et.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
+import { jsxs as h, jsx as u } from "react/jsx-runtime";
+import { RangeSlider as M } from "../../../RangeSlider/index.js";
+function N({
+  selectedFilter: a,
+  currentVal: m,
+  setDraftColumnFilters: o,
+  error: t,
+  setError: c
 }) {
-  const S = (v) => {
-    i((b) => [
-      ...b.filter((k) => k.id !== e?.accessorKey),
-      { id: e?.accessorKey ?? "", value: v }
+  const l = a?.currencySymbol ?? "", i = a?.type === "range" ? a.values : { min: 0, max: 0 }, v = m || i, f = (n, r) => {
+    const e = a?.values?.min ?? 0, s = a?.values?.max ?? 0;
+    return Number.isNaN(n) ? "Minimum value is invalid." : n < e ? `Minimum value cannot be less than ${e}.` : n > r ? "Minimum value cannot be greater than maximum value." : Number.isNaN(r) ? "Maximum value is invalid." : r > s ? `Maximum value cannot be greater than ${s}.` : r < n ? "Maximum value cannot be less than minimum value." : "";
+  }, x = (n) => {
+    o((r) => [
+      ...r.filter((e) => e.id !== a?.accessorKey),
+      { id: a?.accessorKey ?? "", value: n }
     ]);
-  }, 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);
-  }, D = u(), z = a || D;
-  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: z.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: z.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(
-      et,
+  }, b = (n) => {
+    a && (c(f(n.min, n.max)), x(n));
+  };
+  return /* @__PURE__ */ h("div", { children: [
+    t && /* @__PURE__ */ u("div", { className: "ckds-filter-error", children: t }),
+    /* @__PURE__ */ u(
+      M,
       {
-        className: "slider",
-        min: D.min,
-        max: D.max,
-        value: [z.min, z.max],
-        onChange: _,
-        disableSwap: !0,
-        valueLabelDisplay: "auto"
-      }
-    ) }),
-    /* @__PURE__ */ O("div", { className: "ckds-slider-input-display", children: [
-      /* @__PURE__ */ O("span", { children: [
-        "$",
-        Number(z.min),
-        " "
-      ] }),
-      /* @__PURE__ */ O("span", { children: [
-        "$",
-        Number(z.max),
-        " "
-      ] })
-    ] })
+        min: i.min,
+        max: i.max,
+        value: v,
+        onChange: b,
+        showCurrency: !0,
+        currencySymbol: l
+      }
+    )
   ] });
 }
 export {
-  Dt as default
+  N as default
 };