@ck-ui/component-library 2.0.3 → 2.0.5

package/dist/components/ProfileDropdown/index.js

@@ -1,56 +1,56 @@
 import { jsxs as l, jsx as r } from "react/jsx-runtime";
-import { useState as N, useRef as E } from "react";
+import { useState as E, useRef as y } from "react";
 import { mergeClasses as n } from "../../utils/mergeClasses.js";
 import { Avatar as p } from "../Avatar/index.js";
 import { AvatarSizes as t } from "../Avatar/_types/avatar.types.js";
-import { Tabs as y } from "../Tab/index.js";
-import { CKButton as D } from "../CKButton/index.js";
-import { DEFAULT_VIEWS as x, PROFILE_VIEW as C } from "./_types/profileDropdown.types.js";
+import { Tabs as D } from "../Tab/index.js";
+import { CKButton as x } from "../CKButton/index.js";
+import { DEFAULT_VIEWS as z, PROFILE_VIEW as C } from "./_types/profileDropdown.types.js";
 import { VIEW_LABELS as I } from "./constants.js";
 import { S as M } from "../../chevron-down-Cm9R64Fe.js";
-import '../../assets/index-C4-S_v9y.css';const e = {
-  "ckds-profile-dropdown": "_ckds-profile-dropdown_1mtwz_1",
-  "ckds-profile-trigger": "_ckds-profile-trigger_1mtwz_12",
-  "ckds-profile-trigger-text": "_ckds-profile-trigger-text_1mtwz_29",
-  "ckds-profile-welcome-label": "_ckds-profile-welcome-label_1mtwz_36",
-  "ckds-profile-user-name": "_ckds-profile-user-name_1mtwz_44",
-  "ckds-profile-chevron": "_ckds-profile-chevron_1mtwz_52",
-  "ckds-profile-chevron--open": "_ckds-profile-chevron--open_1mtwz_66",
-  "ckds-profile-dropdown-panel": "_ckds-profile-dropdown-panel_1mtwz_70",
-  "ckds-profile-panel-row": "_ckds-profile-panel-row_1mtwz_82",
-  "ckds-profile-divider": "_ckds-profile-divider_1mtwz_89",
-  "ckds-profile-role-info": "_ckds-profile-role-info_1mtwz_94",
-  "ckds-profile-role-label": "_ckds-profile-role-label_1mtwz_102",
-  "ckds-profile-role-value": "_ckds-profile-role-value_1mtwz_109",
-  "ckds-profile-org-info": "_ckds-profile-org-info_1mtwz_159",
-  "ckds-profile-org-label": "_ckds-profile-org-label_1mtwz_167",
-  "ckds-profile-org-value": "_ckds-profile-org-value_1mtwz_174",
-  "ckds-profile-change-org-btn": "_ckds-profile-change-org-btn_1mtwz_184"
+import '../../assets/index-F_VkoiK8.css';const e = {
+  "ckds-profile-dropdown": "_ckds-profile-dropdown_1vtwk_1",
+  "ckds-profile-trigger": "_ckds-profile-trigger_1vtwk_12",
+  "ckds-profile-trigger-text": "_ckds-profile-trigger-text_1vtwk_28",
+  "ckds-profile-welcome-label": "_ckds-profile-welcome-label_1vtwk_35",
+  "ckds-profile-user-name": "_ckds-profile-user-name_1vtwk_43",
+  "ckds-profile-chevron": "_ckds-profile-chevron_1vtwk_51",
+  "ckds-profile-chevron--open": "_ckds-profile-chevron--open_1vtwk_65",
+  "ckds-profile-dropdown-panel": "_ckds-profile-dropdown-panel_1vtwk_69",
+  "ckds-profile-panel-row": "_ckds-profile-panel-row_1vtwk_81",
+  "ckds-profile-divider": "_ckds-profile-divider_1vtwk_88",
+  "ckds-profile-role-info": "_ckds-profile-role-info_1vtwk_93",
+  "ckds-profile-role-label": "_ckds-profile-role-label_1vtwk_101",
+  "ckds-profile-role-value": "_ckds-profile-role-value_1vtwk_108",
+  "ckds-profile-org-info": "_ckds-profile-org-info_1vtwk_158",
+  "ckds-profile-org-label": "_ckds-profile-org-label_1vtwk_166",
+  "ckds-profile-org-value": "_ckds-profile-org-value_1vtwk_173",
+  "ckds-profile-change-org-btn": "_ckds-profile-change-org-btn_1vtwk_183"
 };
 function P({
   userName: i,
   welcomeLabel: d = "Welcome",
   role: f,
-  organization: m,
-  activeView: k = C.PARTNER,
-  views: _ = x,
-  onViewChange: g,
-  onChangeOrganization: u,
-  className: w
+  organization: k,
+  activeView: m = C.PARTNER,
+  views: _ = z,
+  onViewChange: v,
+  onChangeOrganization: g,
+  className: u
 }) {
-  const [s, a] = N(!1), c = E(null), h = () => {
+  const [s, a] = E(!1), c = y(null), w = () => {
     c.current && clearTimeout(c.current), a(!0);
-  }, v = () => {
+  }, h = () => {
     c.current = setTimeout(() => a(!1), 120);
-  }, z = (o) => {
-    (o.key === "Enter" || o.key === " ") && (o.preventDefault(), a((b) => !b)), o.key === "Escape" && a(!1);
+  }, b = (o) => {
+    (o.key === "Enter" || o.key === " ") && (o.preventDefault(), a((N) => !N)), o.key === "Escape" && a(!1);
   };
   return /* @__PURE__ */ l(
     "div",
     {
-      className: n(e["ckds-profile-dropdown"], w),
-      onMouseEnter: h,
-      onMouseLeave: v,
+      className: n(e["ckds-profile-dropdown"], u),
+      onMouseEnter: w,
+      onMouseLeave: h,
       children: [
         /* @__PURE__ */ l(
           "button",
@@ -60,7 +60,7 @@ function P({
               e["ckds-profile-trigger"],
               s && e["ckds-profile-trigger--open"]
             ),
-            onKeyDown: z,
+            onKeyDown: b,
             "aria-haspopup": "true",
             "aria-expanded": s,
             "aria-label": `${d} ${i}, open profile menu`,
@@ -98,14 +98,14 @@ function P({
                   /* @__PURE__ */ r("span", { className: e["ckds-profile-role-value"], children: f })
                 ] }),
                 /* @__PURE__ */ r(
-                  y,
+                  D,
                   {
-                    value: k,
+                    value: m,
                     items: _.map((o) => ({
                       value: o,
                       label: I[o]
                     })),
-                    onChange: (o) => g?.(o),
+                    onChange: (o) => v?.(o),
                     buttonView: !0,
                     size: "small"
                   }
@@ -115,15 +115,15 @@ function P({
               /* @__PURE__ */ l("div", { className: e["ckds-profile-panel-row"], children: [
                 /* @__PURE__ */ l("div", { className: e["ckds-profile-org-info"], children: [
                   /* @__PURE__ */ r("span", { className: e["ckds-profile-org-label"], children: "Organization" }),
-                  /* @__PURE__ */ r("span", { className: e["ckds-profile-org-value"], children: m })
+                  /* @__PURE__ */ r("span", { className: e["ckds-profile-org-value"], children: k })
                 ] }),
                 /* @__PURE__ */ r(
-                  D,
+                  x,
                   {
                     variant: "primary",
                     size: "medium",
                     label: "Change Organization",
-                    onClick: u,
+                    onClick: g,
                     className: e["ckds-profile-change-org-btn"]
                   }
                 )

package/dist/components/ProgressBar/index.js

@@ -1,48 +1,48 @@
-import { jsxs as v, jsx as e } from "react/jsx-runtime";
-import '../../assets/index-BLz-9Nuk.css';const w = "_track_wv8zc_23", u = "_sm_wv8zc_31", m = "_md_wv8zc_35", b = "_lg_wv8zc_39", f = "_bar_wv8zc_43", z = "_success_wv8zc_49", $ = "_warning_wv8zc_53", k = "_danger_wv8zc_57", p = "_info_wv8zc_61", N = "_neutral_wv8zc_65", M = "_label_wv8zc_69", s = {
-  "ckds-progress-bar": "_ckds-progress-bar_wv8zc_1",
-  track: w,
-  sm: u,
-  md: m,
-  lg: b,
-  bar: f,
-  success: z,
+import { jsxs as g, jsx as e } from "react/jsx-runtime";
+import '../../assets/index-BcfUGu_y.css';const u = "_track_1t5pp_23", m = "_sm_1t5pp_31", b = "_md_1t5pp_35", f = "_lg_1t5pp_39", v = "_bar_1t5pp_43", w = "_success_1t5pp_49", $ = "_warning_1t5pp_53", k = "_danger_1t5pp_57", N = "_info_1t5pp_61", M = "_neutral_1t5pp_65", j = "_label_1t5pp_69", s = {
+  "ckds-progress-bar": "_ckds-progress-bar_1t5pp_1",
+  track: u,
+  sm: m,
+  md: b,
+  lg: f,
+  bar: v,
+  success: w,
   warning: $,
   danger: k,
-  info: p,
-  neutral: N,
-  label: M
+  info: N,
+  neutral: M,
+  label: j
 };
-function j(a, r, n) {
+function x(a, r, n) {
   return r || (n ? n.danger !== void 0 && a <= n.danger ? "danger" : n.warning !== void 0 && a <= n.warning ? "warning" : "success" : "info");
 }
-function y({
+function C({
   value: a,
   max: r = 100,
   color: n,
   thresholds: o,
   size: i = "md",
-  showLabel: l = !0,
-  label: t,
-  className: d = ""
+  showLabel: p = !0,
+  label: c,
+  className: l = ""
 }) {
-  const c = r > 0 ? Math.min(Math.max(a / r * 100, 0), 100) : 0, g = j(c, n, o), _ = `${a}/${r} (${Math.round(c)}%)`;
-  return /* @__PURE__ */ v(
+  const t = r > 0 ? Math.min(Math.max(a / r * 100, 0), 100) : 0, d = x(t, n, o), _ = `${a}/${r} (${Math.round(t)}%)`;
+  return /* @__PURE__ */ g(
     "div",
     {
-      className: `${s["ckds-progress-bar"]} ${s[i]} ${s[g]} ${d}`,
+      className: `${s["ckds-progress-bar"]} ${s[i]} ${s[d]} ${l}`,
       role: "progressbar",
       "aria-valuenow": a,
       "aria-valuemin": 0,
       "aria-valuemax": r,
-      "aria-label": t ?? _,
+      "aria-label": c ?? _,
       children: [
-        /* @__PURE__ */ e("div", { className: s.track, children: /* @__PURE__ */ e("div", { className: s.bar, style: { width: `${c}%` } }) }),
-        l && /* @__PURE__ */ e("span", { className: s.label, children: t ?? _ })
+        /* @__PURE__ */ e("div", { className: s.track, children: /* @__PURE__ */ e("div", { className: s.bar, style: { width: `${t}%` } }) }),
+        p && /* @__PURE__ */ e("span", { className: s.label, children: c ?? _ })
       ]
     }
   );
 }
 export {
-  y as ProgressBar
+  C as ProgressBar
 };

package/dist/components/RadioButton/index.js

@@ -1,53 +1,53 @@
 import { jsxs as m, jsx as i } from "react/jsx-runtime";
 import "react";
-import '../../assets/index-BXwGxK7I.css';const k = "_checked_1oe2b_54", u = "_disabled_1oe2b_69", b = "_small_1oe2b_84", f = "_medium_1oe2b_93", h = "_large_1oe2b_102", e = {
-  "ckds-radio": "_ckds-radio_1oe2b_4",
-  "ckds-radio-custom": "_ckds-radio-custom_1oe2b_27",
+import '../../assets/index-CmfUag81.css';const k = "_checked_1y52c_54", y = "_disabled_1y52c_69", u = "_small_1y52c_84", f = "_medium_1y52c_93", h = "_large_1y52c_102", c = {
+  "ckds-radio": "_ckds-radio_1y52c_4",
+  "ckds-radio-custom": "_ckds-radio-custom_1y52c_27",
   checked: k,
-  disabled: u,
-  "ckds-radio-label": "_ckds-radio-label_1oe2b_75",
-  small: b,
+  disabled: y,
+  "ckds-radio-label": "_ckds-radio-label_1y52c_75",
+  small: u,
   medium: f,
   large: h
 };
-function $({
-  label: c,
-  color: d,
+function b({
+  label: d,
+  color: o,
   radioSize: l = "small",
   className: n = "",
-  disabled: o = !1,
-  selected: a = !1,
+  disabled: a = !1,
+  selected: s = !1,
   onChange: t
 }) {
   const r = () => {
-    o || a || t?.(!0);
-  }, _ = (s) => {
-    o || (s.key === " " || s.key === "Enter") && (s.preventDefault(), r());
+    a || s || t?.(!0);
+  }, _ = (e) => {
+    a || (e.key === " " || e.key === "Enter") && (e.preventDefault(), r());
   };
   return /* @__PURE__ */ m(
     "div",
     {
       role: "radio",
-      "aria-checked": a,
-      "aria-disabled": o,
-      tabIndex: o ? -1 : 0,
+      "aria-checked": s,
+      "aria-disabled": a,
+      tabIndex: a ? -1 : 0,
       className: `
-        ${e["ckds-radio"]}
-        ${e[l]}
-        ${a ? e.checked : ""}
-        ${o ? e.disabled : ""}
+        ${c["ckds-radio"]}
+        ${c[l]}
+        ${s ? c.checked : ""}
+        ${a ? c.disabled : ""}
         ${n}
       `,
-      style: d ? { "--ckds-radio-color": d } : void 0,
+      style: o ? { "--ckds-radio-color": o } : void 0,
       onClick: r,
       onKeyDown: _,
       children: [
-        /* @__PURE__ */ i("span", { className: e["ckds-radio-custom"] }),
-        c && /* @__PURE__ */ i("span", { className: e["ckds-radio-label"], children: c })
+        /* @__PURE__ */ i("span", { className: c["ckds-radio-custom"] }),
+        d && /* @__PURE__ */ i("span", { className: c["ckds-radio-label"], children: d })
       ]
     }
   );
 }
 export {
-  $ as RadioButton
+  b as RadioButton
 };

package/dist/components/RangeSlider/_types/rangeSlider.types.d.ts

@@ -0,0 +1,31 @@
+export interface RangeSliderValue {
+    min: number;
+    max: number;
+}
+export interface RangeSliderProps {
+    /** The absolute minimum value of the slider range */
+    min: number;
+    /** The absolute maximum value of the slider range */
+    max: number;
+    /** Current selected range value */
+    value: RangeSliderValue;
+    /** Callback fired when the range value changes */
+    onChange: (value: RangeSliderValue) => void;
+    /** Step increment for the slider. Supports decimals (e.g. 0.1). Defaults to 1 */
+    step?: number;
+    /** Whether to show a currency prefix in the input fields */
+    showCurrency?: boolean;
+    /** Currency symbol to display (defaults to "$") */
+    currencySymbol?: string;
+    /** Whether to allow decimal/float values in the inputs. Defaults to false */
+    allowDecimals?: boolean;
+    /** Number of decimal places allowed when allowDecimals is true. Defaults to 2 */
+    decimalPlaces?: number;
+    /** Whether the slider is disabled */
+    disabled?: boolean;
+    /** Whether to show the value label tooltip on hover/drag */
+    showValueLabel?: boolean;
+    /** Custom class name */
+    className?: string;
+}
+//# sourceMappingURL=rangeSlider.types.d.ts.map

package/dist/components/RangeSlider/_types/rangeSlider.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rangeSlider.types.d.ts","sourceRoot":"","sources":["../../../../lib/components/RangeSlider/_types/rangeSlider.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;CACb;AAED,MAAM,WAAW,gBAAgB;IAC/B,qDAAqD;IACrD,GAAG,EAAE,MAAM,CAAC;IACZ,qDAAqD;IACrD,GAAG,EAAE,MAAM,CAAC;IACZ,mCAAmC;IACnC,KAAK,EAAE,gBAAgB,CAAC;IACxB,kDAAkD;IAClD,QAAQ,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC5C,iFAAiF;IACjF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,mDAAmD;IACnD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,6EAA6E;IAC7E,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,iFAAiF;IACjF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4DAA4D;IAC5D,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB"}

package/dist/components/RangeSlider/_types/rangeSlider.types.js

@@ -0,0 +1 @@
+

package/dist/components/RangeSlider/index.d.ts

@@ -0,0 +1,3 @@
+import { RangeSliderProps } from './_types/rangeSlider.types';
+export declare function RangeSlider({ min, max, value, onChange, step, showCurrency, currencySymbol, allowDecimals, decimalPlaces, disabled, showValueLabel, className, }: RangeSliderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/RangeSlider/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/RangeSlider/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,eAAe,CAAC;AAEvB,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,GAAG,EACH,KAAK,EACL,QAAQ,EACR,IAAQ,EACR,YAAoB,EACpB,cAAoB,EACpB,aAAqB,EACrB,aAAiB,EACjB,QAAgB,EAChB,cAAqB,EACrB,SAAc,GACf,EAAE,gBAAgB,2CAyRlB"}

package/dist/components/RangeSlider/index.js

@@ -0,0 +1,190 @@
+import { jsxs as d, jsx as a } from "react/jsx-runtime";
+import { useRef as U, useState as S, useCallback as q } from "react";
+import '../../assets/styles-DGuBVeco.css';/* empty css                    */
+function O({
+  min: i,
+  max: l,
+  value: n,
+  onChange: m,
+  step: p = 1,
+  showCurrency: N = !1,
+  currencySymbol: v = "$",
+  allowDecimals: u = !1,
+  decimalPlaces: _ = 2,
+  disabled: o = !1,
+  showValueLabel: $ = !0,
+  className: X = ""
+}) {
+  const b = U(null), [h, F] = S(null), [E, x] = S(null), f = l - i, T = (e) => f === 0 ? 0 : (e - i) / f * 100, K = (e) => {
+    const t = Math.round((e - i) / p) * p + i, r = Math.min(Math.max(t, i), l);
+    return u ? parseFloat(r.toFixed(_)) : Math.round(r);
+  }, y = q(
+    (e) => {
+      if (!b.current) return i;
+      const t = b.current.getBoundingClientRect(), r = (e - t.left) / t.width, c = i + r * f;
+      return K(c);
+    },
+    [i, f, p, u, _]
+  ), M = (e, t) => {
+    if (o) return;
+    t.preventDefault(), t.stopPropagation(), F(e);
+    const r = (s) => {
+      const g = "touches" in s ? s.touches[0].clientX : s.clientX, R = y(g);
+      if (e === "min") {
+        const w = Math.min(R, n.max);
+        m({ ...n, min: w });
+      } else {
+        const w = Math.max(R, n.min);
+        m({ ...n, max: w });
+      }
+    }, c = () => {
+      F(null), document.removeEventListener("mousemove", r), document.removeEventListener("mouseup", c), document.removeEventListener("touchmove", r), document.removeEventListener("touchend", c);
+    };
+    document.addEventListener("mousemove", r), document.addEventListener("mouseup", c), document.addEventListener("touchmove", r), document.addEventListener("touchend", c);
+  }, j = (e) => {
+    if (o) return;
+    const t = y(e.clientX), r = Math.abs(t - n.min), c = Math.abs(t - n.max);
+    if (r <= c) {
+      const s = Math.min(t, n.max);
+      m({ ...n, min: s });
+    } else {
+      const s = Math.max(t, n.min);
+      m({ ...n, max: s });
+    }
+  }, A = (e) => u ? e.toFixed(_) : String(e), k = (e) => {
+    const t = A(e);
+    return N ? `${v}${t}` : t;
+  }, B = (e) => {
+    const t = e.target.value;
+    if (t === "" || t === "-") return;
+    const r = parseFloat(t);
+    if (Number.isNaN(r)) return;
+    const c = Math.min(r, n.max), s = Math.max(c, i), g = u ? parseFloat(s.toFixed(_)) : Math.round(s);
+    m({ ...n, min: g });
+  }, C = (e) => {
+    const t = e.target.value;
+    if (t === "" || t === "-") return;
+    const r = parseFloat(t);
+    if (Number.isNaN(r)) return;
+    const c = Math.max(r, n.min), s = Math.min(c, l), g = u ? parseFloat(s.toFixed(_)) : Math.round(s);
+    m({ ...n, max: g });
+  }, V = (e) => {
+    ["e", "E"].includes(e.key) && e.preventDefault(), !u && e.key === "." && e.preventDefault();
+  }, D = (e, t) => t === "min" ? `${e}%` : `${e}%`, L = T(n.min), I = T(n.max), H = $ && (h === "min" || E === "min"), P = $ && (h === "max" || E === "max");
+  return /* @__PURE__ */ d(
+    "div",
+    {
+      className: `ckds-range-slider ${o ? "ckds-range-slider--disabled" : ""} ${X}`,
+      children: [
+        /* @__PURE__ */ d("div", { className: "ckds-range-slider__inputs", children: [
+          /* @__PURE__ */ d("div", { className: "ckds-range-slider__input-group", children: [
+            /* @__PURE__ */ a("p", { className: "ckds-range-slider__input-label", children: "Minimum Value" }),
+            /* @__PURE__ */ d("div", { className: "ckds-range-slider__input-wrapper", children: [
+              N && /* @__PURE__ */ a("span", { className: "ckds-range-slider__currency-prefix", children: v }),
+              /* @__PURE__ */ a(
+                "input",
+                {
+                  type: "number",
+                  className: "ckds-range-slider__input-field",
+                  value: n.min,
+                  onChange: B,
+                  onKeyDown: V,
+                  step: p,
+                  min: i,
+                  max: n.max,
+                  disabled: o,
+                  placeholder: "0"
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ d("div", { className: "ckds-range-slider__input-group", children: [
+            /* @__PURE__ */ a("p", { className: "ckds-range-slider__input-label", children: "Maximum Value" }),
+            /* @__PURE__ */ d("div", { className: "ckds-range-slider__input-wrapper", children: [
+              N && /* @__PURE__ */ a("span", { className: "ckds-range-slider__currency-prefix", children: v }),
+              /* @__PURE__ */ a(
+                "input",
+                {
+                  type: "number",
+                  className: "ckds-range-slider__input-field",
+                  value: n.max,
+                  onChange: C,
+                  onKeyDown: V,
+                  step: p,
+                  min: n.min,
+                  max: l,
+                  disabled: o,
+                  placeholder: "0"
+                }
+              )
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ d(
+          "div",
+          {
+            className: "ckds-range-slider__track-container",
+            ref: b,
+            onClick: j,
+            children: [
+              /* @__PURE__ */ a("div", { className: "ckds-range-slider__rail" }),
+              /* @__PURE__ */ a(
+                "div",
+                {
+                  className: "ckds-range-slider__track",
+                  style: {
+                    left: `${L}%`,
+                    width: `${I - L}%`
+                  }
+                }
+              ),
+              /* @__PURE__ */ a(
+                "div",
+                {
+                  className: `ckds-range-slider__thumb ckds-range-slider__thumb--min ${h === "min" ? "ckds-range-slider__thumb--active" : ""}`,
+                  style: { left: D(L, "min") },
+                  onMouseDown: (e) => M("min", e),
+                  onTouchStart: (e) => M("min", e),
+                  onMouseEnter: () => x("min"),
+                  onMouseLeave: () => !h && x(null),
+                  role: "slider",
+                  "aria-valuemin": i,
+                  "aria-valuemax": n.max,
+                  "aria-valuenow": n.min,
+                  "aria-label": "Minimum value",
+                  tabIndex: o ? -1 : 0,
+                  children: H && /* @__PURE__ */ a("div", { className: "ckds-range-slider__value-label", children: k(n.min) })
+                }
+              ),
+              /* @__PURE__ */ a(
+                "div",
+                {
+                  className: `ckds-range-slider__thumb ckds-range-slider__thumb--max ${h === "max" ? "ckds-range-slider__thumb--active" : ""}`,
+                  style: { left: D(I, "max") },
+                  onMouseDown: (e) => M("max", e),
+                  onTouchStart: (e) => M("max", e),
+                  onMouseEnter: () => x("max"),
+                  onMouseLeave: () => !h && x(null),
+                  role: "slider",
+                  "aria-valuemin": n.min,
+                  "aria-valuemax": l,
+                  "aria-valuenow": n.max,
+                  "aria-label": "Maximum value",
+                  tabIndex: o ? -1 : 0,
+                  children: P && /* @__PURE__ */ a("div", { className: "ckds-range-slider__value-label", children: k(n.max) })
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ d("div", { className: "ckds-range-slider__bounds", children: [
+          /* @__PURE__ */ a("span", { children: k(i) }),
+          /* @__PURE__ */ a("span", { children: k(l) })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  O as RangeSlider
+};

package/dist/components/Search/index.js

@@ -1,43 +1,43 @@
 import { jsxs as R, jsx as n } from "react/jsx-runtime";
 import * as f from "react";
-import { useState as S, useRef as d, useEffect as l, useMemo as K } from "react";
+import { useState as k, useRef as m, useEffect as l, useMemo as K } from "react";
 import { S as V } from "../../cancel-BAgTEOGD.js";
 import { SMALL as A, MEDIUM as P } from "../../constants.js";
-import { mergeClasses as v } from "../../utils/mergeClasses.js";
-import '../../assets/index-BoQKDmZt.css';const U = (a) => /* @__PURE__ */ f.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 14, height: 14, viewBox: "0 0 14 14", fill: "none", ...a }, /* @__PURE__ */ f.createElement("path", { d: "M9.91699 9.9165L12.2503 12.2498", stroke: "#737373", strokeWidth: 0.875, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ f.createElement("path", { d: "M11.0833 6.41667C11.0833 3.83934 8.99401 1.75 6.41667 1.75C3.83934 1.75 1.75 3.83934 1.75 6.41667C1.75 8.99401 3.83934 11.0833 6.41667 11.0833C8.99401 11.0833 11.0833 8.99401 11.0833 6.41667Z", stroke: "#737373", strokeLinecap: "round", strokeLinejoin: "round" })), t = {
-  "ckds-search-wrapper": "_ckds-search-wrapper_mt85e_1",
-  "search-wrapper-small": "_search-wrapper-small_mt85e_35",
-  "search-wrapper-medium": "_search-wrapper-medium_mt85e_38",
-  "search-wrapper-large": "_search-wrapper-large_mt85e_41",
-  "search-wrapper--disabled": "_search-wrapper--disabled_mt85e_47",
-  "search-icon": "_search-icon_mt85e_60",
-  "search-input": "_search-input_mt85e_66",
-  "search-clear": "_search-clear_mt85e_85"
+import { mergeClasses as C } from "../../utils/mergeClasses.js";
+import '../../assets/index-050F7Cq1.css';const U = (a) => /* @__PURE__ */ f.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 14, height: 14, viewBox: "0 0 14 14", fill: "none", ...a }, /* @__PURE__ */ f.createElement("path", { d: "M9.91699 9.9165L12.2503 12.2498", stroke: "#737373", strokeWidth: 0.875, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ f.createElement("path", { d: "M11.0833 6.41667C11.0833 3.83934 8.99401 1.75 6.41667 1.75C3.83934 1.75 1.75 3.83934 1.75 6.41667C1.75 8.99401 3.83934 11.0833 6.41667 11.0833C8.99401 11.0833 11.0833 8.99401 11.0833 6.41667Z", stroke: "#737373", strokeLinecap: "round", strokeLinejoin: "round" })), t = {
+  "ckds-search-wrapper": "_ckds-search-wrapper_dgdby_1",
+  "search-wrapper-small": "_search-wrapper-small_dgdby_35",
+  "search-wrapper-medium": "_search-wrapper-medium_dgdby_38",
+  "search-wrapper-large": "_search-wrapper-large_dgdby_41",
+  "search-wrapper--disabled": "_search-wrapper--disabled_dgdby_47",
+  "search-icon": "_search-icon_dgdby_60",
+  "search-input": "_search-input_dgdby_66",
+  "search-clear": "_search-clear_dgdby_85"
 };
 function H({
   value: a = "",
-  placeholder: x = "Search",
+  placeholder: S = "Search",
   onChange: p,
-  onClear: y,
-  onSearch: D,
+  onClear: v,
+  onSearch: x,
   disabled: s = !1,
-  showClearBtn: L = !0,
-  wrapperClassName: E = "",
-  inputClassName: M = "",
+  showClearBtn: D = !0,
+  wrapperClassName: L = "",
+  inputClassName: E = "",
   autoFocus: w = !1,
-  maxLength: b,
+  maxLength: M,
   id: T,
   name: j,
   size: o = "medium",
   debounceMs: _ = 0
 }) {
-  const [g, k] = S(!1), [c, h] = S(a), u = d(null), r = d(null), m = d(!1);
+  const [g, y] = k(!1), [c, h] = k(a), u = m(null), r = m(null), d = m(!1);
   l(() => {
     h(a);
   }, [a]), l(() => {
     w && u.current?.focus();
   }, [w]), l(() => {
-    s ? m.current = g : m.current && c && (u.current?.focus(), m.current = !1);
+    s ? d.current = g : d.current && c && (u.current?.focus(), d.current = !1);
   }, [s]);
   const i = K(() => o === A ? "10" : o === P ? "14" : "18", [o]), I = (e) => {
     _ > 0 ? (r.current && clearTimeout(r.current), r.current = setTimeout(() => p?.(e), _)) : p?.(e);
@@ -46,21 +46,21 @@ function H({
     r.current && clearTimeout(r.current);
   }, []);
   const N = (e) => {
-    const C = e.target.value;
-    h(C), I(C);
+    const b = e.target.value;
+    h(b), I(b);
   }, B = (e) => {
-    e.preventDefault(), r.current && clearTimeout(r.current), h(""), p?.(""), y?.(), u.current?.focus();
+    e.preventDefault(), r.current && clearTimeout(r.current), h(""), p?.(""), v?.(), u.current?.focus();
   }, F = (e) => {
-    e.stopPropagation(), e.key === "Enter" && D?.(c);
+    e.stopPropagation(), e.key === "Enter" && x?.(c);
   };
   return /* @__PURE__ */ R(
     "div",
     {
-      className: v(
+      className: C(
         t["ckds-search-wrapper"],
         t[`search-wrapper-${o}`],
         s ? t["search-wrapper--disabled"] : "",
-        E
+        L
       ),
       children: [
         !g && !c && /* @__PURE__ */ n("span", { className: t["search-icon"], children: /* @__PURE__ */ n(U, { width: i, height: i }) }),
@@ -71,22 +71,22 @@ function H({
             id: T,
             name: j,
             type: "text",
-            className: v(
+            className: C(
               "ckds-body-sm-reg",
               t["search-input"],
-              M
+              E
             ),
             value: c,
-            placeholder: x,
+            placeholder: S,
             disabled: s,
-            maxLength: b,
+            maxLength: M,
             onChange: N,
             onKeyDown: F,
-            onFocus: () => k(!0),
-            onBlur: () => k(!1)
+            onFocus: () => y(!0),
+            onBlur: () => y(!1)
           }
         ),
-        L && c && !s && /* @__PURE__ */ n(
+        D && c && !s && /* @__PURE__ */ n(
           "button",
           {
             type: "button",