@sberbusiness/triplex-next 1.20.0 → 1.22.0

package/components/SelectExtendedField/components/SelectExtendedFieldDropdownDefault.js

@@ -1,84 +1,91 @@
-import { jsx as e, jsxs as M, Fragment as S } from "react/jsx-runtime";
-import { createElement as w } from "react";
-import { SelectExtendedField as m } from "../SelectExtendedField.js";
+import { jsx as o, jsxs as M, Fragment as S } from "react/jsx-runtime";
+import { createElement as f } from "react";
+import { SelectExtendedField as d } from "../SelectExtendedField.js";
+import "../../Dropdown/DropdownListContext.js";
+import "../../Dropdown/desktop/DropdownDesktop.js";
+import "../../Dropdown/desktop/DropdownList.js";
+import "../../../chunks/DropdownListItem-Dl8gN2ar.js";
 import "../../Dropdown/mobile/DropdownMobile.js";
-import { DropdownMobileBody as y } from "../../Dropdown/mobile/DropdownMobileBody.js";
-import { DropdownMobileClose as E } from "../../Dropdown/mobile/DropdownMobileClose.js";
+import { DropdownMobileBody as E } from "../../Dropdown/mobile/DropdownMobileBody.js";
+import { DropdownMobileClose as k } from "../../Dropdown/mobile/DropdownMobileClose.js";
 import "../../Dropdown/mobile/DropdownMobileFooter.js";
-import { DropdownMobileHeader as k } from "../../Dropdown/mobile/DropdownMobileHeader.js";
+import { DropdownMobileHeader as y } from "../../Dropdown/mobile/DropdownMobileHeader.js";
 import "../../Dropdown/mobile/DropdownMobileInner.js";
 import "../../Dropdown/mobile/DropdownMobileInput.js";
 import { DropdownMobileList as B } from "../../Dropdown/mobile/DropdownMobileList.js";
 import { DropdownMobileListItem as F } from "../../Dropdown/mobile/DropdownMobileListItem.js";
 import "../../Loader/LoaderSmall/LoaderSmall.js";
 import "../../Loader/LoaderMiddle/LoaderMiddle.js";
-import { Text as L } from "../../Typography/Text.js";
-import { ETextSize as j } from "../../Typography/enums.js";
-const Q = ({
-  dropdownRef: D,
-  dropdownListItemClassName: l,
-  fixedWidth: n,
+import "../../Dropdown/Dropdown.js";
+import { ETextSize as L } from "../../Typography/enums.js";
+import "../../Typography/Caption.js";
+import { Text as j } from "../../Typography/Text.js";
+import "../../Typography/Title.js";
+const $ = ({
+  dropdownRef: w,
+  dropdownListItemClassName: p,
+  width: D,
   loading: b,
   listId: h,
   mobileTitle: x,
-  onChange: c,
-  opened: p,
-  size: f,
+  onChange: l,
+  opened: c,
+  size: n,
   options: s,
-  setOpened: i,
+  setOpened: e,
   targetRef: a,
-  value: o
-}) => /* @__PURE__ */ e(
-  m.Dropdown,
+  value: i
+}) => /* @__PURE__ */ o(
+  d.Dropdown,
   {
-    opened: p && !b,
-    forwardedRef: D,
-    fixedWidth: typeof n > "u" ? !0 : n,
-    setOpened: i,
+    opened: c && !b,
+    forwardedRef: w,
+    width: D,
+    setOpened: e,
     targetRef: a,
-    size: f,
+    size: n,
     mobileViewProps: {
       children: /* @__PURE__ */ M(S, { children: [
-        /* @__PURE__ */ e(k, { controlButtons: /* @__PURE__ */ e(E, { onClick: () => i(!1) }), children: /* @__PURE__ */ e(L, { tag: "div", size: j.B3, children: x }) }),
-        /* @__PURE__ */ e(y, { children: /* @__PURE__ */ e(B, { children: s.map((r) => {
-          const { label: d, ...t } = r;
-          return /* @__PURE__ */ w(
+        /* @__PURE__ */ o(y, { controlButtons: /* @__PURE__ */ o(k, { onClick: () => e(!1) }), children: /* @__PURE__ */ o(j, { tag: "div", size: L.B3, children: x }) }),
+        /* @__PURE__ */ o(E, { children: /* @__PURE__ */ o(B, { children: s.map((r) => {
+          const { label: t, ...m } = r;
+          return /* @__PURE__ */ f(
             F,
             {
-              ...t,
-              className: l,
+              ...m,
+              className: p,
               id: r.id,
               key: r.id,
-              selected: r.id === (o == null ? void 0 : o.id),
+              selected: r.id === (i == null ? void 0 : i.id),
               onSelect: () => {
-                c(r), i(!1);
+                l(r), e(!1);
               }
             },
-            d
+            t
           );
         }) }) })
       ] })
     },
-    children: /* @__PURE__ */ e(m.Dropdown.List, { id: h, dropdownOpened: p, size: f, children: s.map((r) => {
-      const { label: d, ...t } = r;
-      return /* @__PURE__ */ w(
-        m.Dropdown.List.Item,
+    children: /* @__PURE__ */ o(d.Dropdown.List, { id: h, dropdownOpened: c, size: n, children: s.map((r) => {
+      const { label: t, ...m } = r;
+      return /* @__PURE__ */ f(
+        d.Dropdown.List.Item,
         {
-          ...t,
-          className: l,
+          ...m,
+          className: p,
           id: r.id,
           key: r.id,
-          selected: r.id === (o == null ? void 0 : o.id),
+          selected: r.id === (i == null ? void 0 : i.id),
           onSelect: () => {
-            c(r), i(!1);
+            l(r), e(!1);
           }
         },
-        d
+        t
       );
     }) })
   }
 );
 export {
-  Q as SelectExtendedFieldDropdownDefault
+  $ as SelectExtendedFieldDropdownDefault
 };
 //# sourceMappingURL=SelectExtendedFieldDropdownDefault.js.map

package/components/SelectExtendedField/components/SelectExtendedFieldTarget.js

@@ -1,96 +1,99 @@
-import { jsx as o, jsxs as F } from "react/jsx-runtime";
-import M, { useRef as O } from "react";
-import { CaretdownStrokeSrvIcon24 as z, CaretdownStrokeSrvIcon20 as B, CaretdownStrokeSrvIcon16 as W } from "@sberbusiness/icons-next";
-import { EVENT_KEY_CODES as c } from "../../../utils/keyboard.js";
+import { jsx as t, jsxs as b } from "react/jsx-runtime";
+import O, { useRef as z } from "react";
+import { CaretdownStrokeSrvIcon24 as B, CaretdownStrokeSrvIcon20 as W, CaretdownStrokeSrvIcon16 as k } from "@sberbusiness/icons-next";
+import { EVENT_KEY_CODES as s } from "../../../utils/keyboard.js";
 import { LoaderSmall as x } from "../../Loader/LoaderSmall/LoaderSmall.js";
 import { ELoaderSmallTheme as D } from "../../Loader/LoaderSmall/enum.js";
 import "../../Loader/LoaderMiddle/LoaderMiddle.js";
-import { c as n } from "../../../chunks/vendor-BIl4KTrD.js";
-import { FormField as k } from "../../FormField/FormField.js";
-import "../../FormField/components/FormFieldDescription.js";
+import { c as n } from "../../../chunks/vendor-BiObpx9E.js";
+import { EFormFieldStatus as i } from "../../FormField/enums.js";
+import { FormFieldClear as v } from "../../FormField/components/FormFieldClear.js";
 import "../../FormField/components/FormFieldCounter.js";
-import { FormFieldLabel as v } from "../../FormField/components/FormFieldLabel.js";
-import "../../FormField/components/FormFieldClear.js";
-import { FormFieldTarget as w } from "../../FormField/components/FormFieldTarget.js";
-import "../../../chunks/FormFieldInput-C4pLJsXx.js";
+import "../../FormField/components/FormFieldDescription.js";
+import "../../../chunks/FormFieldInput--W9kjf4s.js";
+import { FormFieldLabel as w } from "../../FormField/components/FormFieldLabel.js";
 import "../../FormField/components/FormFieldMaskedInput.js";
 import { FormFieldPostfix as y } from "../../FormField/components/FormFieldPostfix.js";
 import { FormFieldPrefix as P } from "../../FormField/components/FormFieldPrefix.js";
+import { FormFieldTarget as G } from "../../FormField/components/FormFieldTarget.js";
 import "../../FormField/components/FormFieldTextarea.js";
-import { EFormFieldStatus as d } from "../../FormField/enums.js";
-import { EComponentSize as r } from "../../../enums/EComponentSize.js";
-const G = "selectExtendedFieldTarget__5668a58c", j = "caretWrapper__34bb1663", K = "caretIcon__daf5fe71", U = "selectOpened__3a4edb95", V = "disabled__bc6d3f18", e = {
-  selectExtendedFieldTarget: G,
-  caretWrapper: j,
-  caretIcon: K,
-  selectOpened: U,
-  disabled: V
-}, Y = {
-  [r.SM]: /* @__PURE__ */ o(W, { paletteIndex: 5, className: e.caretIcon }),
-  [r.MD]: /* @__PURE__ */ o(B, { paletteIndex: 5, className: e.caretIcon }),
-  [r.LG]: /* @__PURE__ */ o(z, { paletteIndex: 5, className: e.caretIcon })
-}, q = {
-  [r.SM]: /* @__PURE__ */ o(x, { size: r.SM, theme: D.BRAND }),
-  [r.MD]: /* @__PURE__ */ o(x, { size: r.MD, theme: D.BRAND }),
-  [r.LG]: /* @__PURE__ */ o(x, { size: r.LG, theme: D.BRAND })
-}, H = M.forwardRef(
-  (u, i) => {
+import { FormField as j } from "../../FormField/FormField.js";
+import { EComponentSize as a } from "../../../enums/EComponentSize.js";
+const K = "selectExtendedFieldTarget__4503e70b", U = "caretWrapper__e6f7aa98", V = "caretIcon__3089ce20", Y = "selectOpened__27a4a4a6", q = "disabled__b0196ec3", H = "target__7a2427ef", e = {
+  selectExtendedFieldTarget: K,
+  caretWrapper: U,
+  caretIcon: V,
+  selectOpened: Y,
+  disabled: q,
+  target: H
+}, J = {
+  [a.SM]: /* @__PURE__ */ t(k, { paletteIndex: 5, className: e.caretIcon }),
+  [a.MD]: /* @__PURE__ */ t(W, { paletteIndex: 5, className: e.caretIcon }),
+  [a.LG]: /* @__PURE__ */ t(B, { paletteIndex: 5, className: e.caretIcon })
+}, Q = {
+  [a.SM]: /* @__PURE__ */ t(x, { size: a.SM, theme: D.BRAND }),
+  [a.MD]: /* @__PURE__ */ t(x, { size: a.MD, theme: D.BRAND }),
+  [a.LG]: /* @__PURE__ */ t(x, { size: a.LG, theme: D.BRAND })
+}, X = O.forwardRef(
+  (u, d) => {
     const {
-      children: J,
+      children: Z,
       className: N,
       label: m,
       placeholder: E,
       onKeyDown: p,
       onClick: f,
-      opened: a,
+      onClear: F,
+      opened: o,
       postfix: I,
-      prefix: b,
-      setOpened: h,
-      loading: s,
-      size: S = r.MD,
+      prefix: h,
+      setOpened: _,
+      loading: c,
+      size: S = a.MD,
       status: l,
-      tabIndex: Q,
-      fieldLabel: _,
+      tabIndex: $,
+      fieldLabel: g,
       ...L
-    } = u, R = O(null), g = n(
+    } = u, R = z(null), C = n(
       e.selectExtendedFieldTarget,
       {
-        [e.selectOpened]: a,
-        [e.loading]: s,
-        [e.disabled]: l === d.DISABLED
+        [e.selectOpened]: o,
+        [e.loading]: c,
+        [e.disabled]: l === i.DISABLED
       },
       N
-    ), T = (t) => {
-      s && l === d.DISABLED || (h(!a), f == null || f(t));
-    }, A = (t) => {
-      s && l === d.DISABLED || (a || [
-        c.SPACE,
-        c.ENTER,
-        c.ARROW_DOWN,
-        c.ARROW_UP
-      ].includes(t.keyCode) && (t.preventDefault(), t.stopPropagation(), h(!a)), p == null || p(t));
-    }, C = (t) => {
-      R.current = t, typeof i == "function" ? i(t) : i && (i.current = t);
+    ), T = (r) => {
+      c || l === i.DISABLED || (_(!o), f == null || f(r));
+    }, A = (r) => {
+      c && l === i.DISABLED || (o || [
+        s.SPACE,
+        s.ENTER,
+        s.ARROW_DOWN,
+        s.ARROW_UP
+      ].includes(r.keyCode) && (r.preventDefault(), r.stopPropagation(), _(!o)), p == null || p(r));
+    }, M = (r) => {
+      R.current = r, typeof d == "function" ? d(r) : d && (d.current = r);
     };
-    return /* @__PURE__ */ F(
-      k,
+    return /* @__PURE__ */ b(
+      j,
       {
         onClick: T,
         onKeyDown: A,
         status: l,
         size: S,
-        className: g,
-        "aria-expanded": a,
+        className: C,
+        "aria-expanded": o,
         "aria-haspopup": "listbox",
-        "data-tx": "1.20.0",
+        "data-tx": "1.22.0",
+        active: o,
         ...L,
         children: [
-          b ? /* @__PURE__ */ o(P, { className: n("hoverable", { disabled: l === d.DISABLED }), children: b }) : null,
-          /* @__PURE__ */ o(v, { children: _ }),
-          /* @__PURE__ */ o(
-            w,
+          h ? /* @__PURE__ */ t(P, { className: n("hoverable", { disabled: l === i.DISABLED }), children: h }) : null,
+          /* @__PURE__ */ t(w, { children: g }),
+          /* @__PURE__ */ t(
+            G,
             {
-              ref: C,
+              ref: M,
               className: n(e.target, {
                 [e.placeholder]: !!E && !m,
                 [e.label]: !!m
@@ -99,15 +102,16 @@ const G = "selectExtendedFieldTarget__5668a58c", j = "caretWrapper__34bb1663", K
               children: m
             }
           ),
-          /* @__PURE__ */ F(y, { children: [
-            /* @__PURE__ */ o(
+          /* @__PURE__ */ b(y, { children: [
+            F && /* @__PURE__ */ t(v, { onClick: F }),
+            c ? Q[S] : /* @__PURE__ */ t(
               "div",
               {
                 className: n(e.caretWrapper, "hoverable", {
-                  active: a,
-                  disabled: l === d.DISABLED
+                  active: o,
+                  disabled: l === i.DISABLED
                 }),
-                children: s ? q[S] : Y[S]
+                children: J[S]
               }
             ),
             I || null
@@ -117,8 +121,8 @@ const G = "selectExtendedFieldTarget__5668a58c", j = "caretWrapper__34bb1663", K
     );
   }
 );
-H.displayName = "SelectExtendedFieldTarget";
+X.displayName = "SelectExtendedFieldTarget";
 export {
-  H as SelectExtendedFieldTarget
+  X as SelectExtendedFieldTarget
 };
 //# sourceMappingURL=SelectExtendedFieldTarget.js.map

package/components/SelectField/SelectField.js

@@ -1,62 +1,80 @@
 import { jsx as o } from "react/jsx-runtime";
-import S, { useState as T, useRef as d } from "react";
-import { SelectExtendedField as s } from "../SelectExtendedField/SelectExtendedField.js";
+import v, { useState as y, useRef as d } from "react";
+import { SelectExtendedField as m } from "../SelectExtendedField/SelectExtendedField.js";
 import "../SelectExtendedField/components/SelectExtendedFieldDropdown.js";
 import "../SelectExtendedField/components/SelectExtendedFieldTarget.js";
-import { SelectExtendedFieldDropdownDefault as v } from "../SelectExtendedField/components/SelectExtendedFieldDropdownDefault.js";
-import { DropdownListContext as F } from "../Dropdown/DropdownListContext.js";
-import { u as I } from "../../chunks/vendor-BIl4KTrD.js";
-const C = S.forwardRef((c, t) => {
+import { SelectExtendedFieldDropdownDefault as S } from "../SelectExtendedField/components/SelectExtendedFieldDropdownDefault.js";
+import { DropdownListContext as E } from "../Dropdown/DropdownListContext.js";
+import "../Dropdown/desktop/DropdownDesktop.js";
+import "../Dropdown/desktop/DropdownList.js";
+import "../../chunks/DropdownListItem-Dl8gN2ar.js";
+import { EDropdownWidth as F } from "../Dropdown/desktop/enums.js";
+import "../Dropdown/mobile/DropdownMobile.js";
+import "../Dropdown/mobile/DropdownMobileBody.js";
+import "../Dropdown/mobile/DropdownMobileClose.js";
+import "../Dropdown/mobile/DropdownMobileFooter.js";
+import "../Dropdown/mobile/DropdownMobileHeader.js";
+import "../Dropdown/mobile/DropdownMobileInner.js";
+import "../Dropdown/mobile/DropdownMobileInput.js";
+import "../Dropdown/mobile/DropdownMobileList.js";
+import "../Dropdown/mobile/DropdownMobileListItem.js";
+import "../Loader/LoaderSmall/LoaderSmall.js";
+import "../Loader/LoaderMiddle/LoaderMiddle.js";
+import "../Dropdown/Dropdown.js";
+import { u as I } from "../../chunks/vendor-BiObpx9E.js";
+const L = v.forwardRef((p, t) => {
   const {
-    children: L,
-    className: m,
+    children: C,
+    className: s,
     value: r,
-    size: n,
-    options: p,
-    onChange: u,
-    placeholder: f,
-    loading: a,
+    size: i,
+    options: c,
+    onChange: f,
+    placeholder: u,
+    loading: n,
     status: b,
-    "aria-labelledby": g,
+    "aria-labelledby": w,
     dropdownListItemClassName: N,
     mobileTitle: D,
-    targetProps: w,
-    ...x
-  } = c, [l, h] = T(), y = d(null), i = d(I()), R = (e) => {
-    y.current = e, typeof t == "function" ? t(e) : t && (t.current = e);
+    targetProps: g,
+    ...h
+  } = p, [a, T] = y(), x = d(null), l = d(I()), R = (e) => {
+    x.current = e, typeof t == "function" ? t(e) : t && (t.current = e);
   };
-  return /* @__PURE__ */ o(s, { className: m, renderTarget: (e) => /* @__PURE__ */ o(
-    s.Target,
+  return /* @__PURE__ */ o(m, { className: s, renderTarget: (e) => /* @__PURE__ */ o(
+    m.Target,
     {
       label: r == null ? void 0 : r.label,
-      placeholder: f,
-      loading: a,
+      placeholder: u,
+      loading: n,
       status: b,
       role: "combobox",
-      "aria-controls": i.current,
-      "aria-activedescendant": l,
-      "aria-labelledby": g,
+      "aria-controls": l.current,
+      "aria-activedescendant": a,
+      "aria-labelledby": w,
       ref: R,
-      size: n,
-      ...w,
+      size: i,
+      fieldLabel: void 0,
+      ...g,
       ...e
     }
-  ), closeOnTab: !0, ...x, children: (e) => /* @__PURE__ */ o(F.Provider, { value: { activeDescendant: l, setActiveDescendant: h }, children: /* @__PURE__ */ o(
-    v,
+  ), closeOnTab: !0, ...h, children: (e) => /* @__PURE__ */ o(E.Provider, { value: { activeDescendant: a, setActiveDescendant: T }, children: /* @__PURE__ */ o(
+    S,
     {
       ...e,
-      size: n,
-      loading: a,
-      listId: i.current,
+      size: i,
+      width: F.TARGET,
+      loading: n,
+      listId: l.current,
       mobileTitle: D,
-      onChange: u,
-      options: p,
+      onChange: f,
+      options: c,
       value: r
     }
   ) }) });
 });
-C.displayName = "SelectField";
+L.displayName = "SelectField";
 export {
-  C as SelectField
+  L as SelectField
 };
 //# sourceMappingURL=SelectField.js.map

package/components/Skeleton/Skeleton.js

@@ -1,19 +1,19 @@
-import { jsx as a } from "react/jsx-runtime";
-import { c as n } from "../../chunks/vendor-BIl4KTrD.js";
+import { jsx as d } from "react/jsx-runtime";
+import { c as n } from "../../chunks/vendor-BiObpx9E.js";
 import { ESkeletonType as t } from "./enums.js";
-const r = "skeleton__d47fa771", k = "light__ef17660a", c = "dark__9663cfb8", o = {
+const r = "skeleton__cdf0d949", a = "light__b76d2529", k = "dark__df15fdad", o = {
   skeleton: r,
-  light: k,
-  dark: c
-}, f = ({ className: s, type: e = t.DARK, ...l }) => /* @__PURE__ */ a(
+  light: a,
+  dark: k
+}, f = ({ className: e, type: s = t.DARK, ...l }) => /* @__PURE__ */ d(
   "div",
   {
-    className: n(o.skeleton, s, {
-      [o.dark]: e === t.DARK,
-      [o.light]: e === t.LIGHT
+    className: n(o.skeleton, e, {
+      [o.dark]: s === t.DARK,
+      [o.light]: s === t.LIGHT
     }),
     ...l,
-    "data-tx": "1.20.0"
+    "data-tx": "1.22.0"
   }
 );
 export {

package/components/SliderExtended/SliderExtended.js

@@ -1,10 +1,10 @@
 import { jsx as S } from "react/jsx-runtime";
 import { useState as a, useLayoutEffect as b } from "react";
-import { c as C, l as O } from "../../chunks/vendor-BIl4KTrD.js";
+import { c as C, l as O } from "../../chunks/vendor-BiObpx9E.js";
 import { SliderExtendedDot as R } from "./components/SliderExtendedDot/SliderExtendedDot.js";
 import { SliderExtendedMarks as j } from "./components/SliderExtendedMarks/SliderExtendedMarks.js";
 import { SliderExtendedMark as H } from "./components/SliderExtendedMarks/SliderExtendedMark.js";
-import { s as c, S as F } from "../../chunks/SliderExtendedRail-Alw2vXQr.js";
+import { s as c, S as F } from "../../chunks/SliderExtendedRail-Dld8UNeR.js";
 import { SliderExtendedTrack as I } from "./components/SliderExtendedTrack/SliderExtendedTrack.js";
 import { SliderExtendedContext as L } from "./SliderExtendedContext.js";
 import { SliderExtendedUtils as x } from "./SliderExtendedUtils.js";
@@ -82,7 +82,7 @@ const q = U(c), w = ({
             [c.disabled]: !!m
           }),
           ...g,
-          "data-tx": "1.20.0",
+          "data-tx": "1.22.0",
           children: E
         }
       )

package/components/SliderExtended/components/SliderExtendedDot/SliderExtendedDot.js

@@ -1,21 +1,21 @@
-import { jsxs as I, Fragment as B, jsx as m } from "react/jsx-runtime";
+import { jsxs as I, Fragment as B, jsx as f } from "react/jsx-runtime";
 import { useState as a, useContext as re, useRef as le, useLayoutEffect as L, useEffect as ae } from "react";
-import { u as ie, c as ne, l as k } from "../../../../chunks/vendor-BIl4KTrD.js";
+import { u as ie, c as ne, l as k } from "../../../../chunks/vendor-BiObpx9E.js";
 import { SliderExtendedUtils as o } from "../../SliderExtendedUtils.js";
 import { SliderExtendedContext as ce } from "../../SliderExtendedContext.js";
 import { SliderExtendedMoveHandler as ue } from "../SliderExtendedMoveHandler.js";
 import { SliderExtendedDotActions as O } from "./SliderExtendedDotActions.js";
-import { useSliderExtendedDotTabIndex as fe } from "./useSliderExtendedDotTabIndex.js";
+import { useSliderExtendedDotTabIndex as me } from "./useSliderExtendedDotTabIndex.js";
 import { KeyDownListener as F } from "../../../KeyDownListener/KeyDownListener.js";
 import { EVENT_KEY_CODES as p } from "../../../../utils/keyboard.js";
-import { createSizeToClassNameMap as me } from "../../../../utils/classNameMaps.js";
-const pe = "sliderExtendedDot__61b3397d", xe = "focusedByClick__b93f4cf7", he = "disabled__86e6c0f6", ge = "dragByMouse__5e1aafae", De = "lg__55fd54cc", i = {
+import { createSizeToClassNameMap as fe } from "../../../../utils/classNameMaps.js";
+const pe = "sliderExtendedDot__f4b6e7c6", xe = "focusedByClick__0ceb4c97", he = "disabled__d788a637", ge = "dragByMouse__28b5b9f4", De = "lg__210749f0", i = {
   sliderExtendedDot: pe,
   focusedByClick: xe,
   disabled: he,
   dragByMouse: ge,
   lg: De
-}, Ee = me(i), ye = ({
+}, Ee = fe(i), ye = ({
   children: K,
   className: P,
   onBlur: x,
@@ -34,14 +34,14 @@ const pe = "sliderExtendedDot__61b3397d", xe = "focusedByClick__b93f4cf7", he =
     isHoverOrDragTrack: w,
     max: c,
     min: u,
-    railNode: f,
+    railNode: m,
     removeDot: q,
     reverse: v,
     setFocused: V,
     steps: s,
     updateDot: G,
     size: Y
-  } = re(ce), $ = fe(_, l, z, y), C = le(null);
+  } = re(ce), $ = me(_, l, z, y), b = le(null);
   L(() => () => q(l), []), ae(() => {
     const e = o.getNormalizedValue({ max: c, min: u, value: d });
     j({
@@ -65,37 +65,37 @@ const pe = "sliderExtendedDot__61b3397d", xe = "focusedByClick__b93f4cf7", he =
     });
   }, [r, d, c, u, s]);
   const J = (e) => (t) => {
-    E(!0), n(!0), document.addEventListener("mouseup", R), e(t), g == null || g(t);
+    E(!0), n(!0), document.addEventListener("mouseup", C), e(t), g == null || g(t);
   }, Q = (e) => {
-    if (f) {
+    if (m) {
       let t = o.getNormalizedCursorValue({
         cursorXPosition: e.clientX,
-        railNode: f
+        railNode: m
       });
       v && (t = 100 - t);
       const S = o.getNearestStep({ normalizedValue: t, steps: s });
       r(S.value);
     }
-  }, R = () => {
-    n(!1), document.removeEventListener("mouseup", R);
+  }, C = () => {
+    n(!1), document.removeEventListener("mouseup", C);
   }, Z = (e) => (t) => {
-    t.touches.length == 1 && (E(!0), n(!0), document.addEventListener("touchend", T), e(t), D == null || D(t));
+    t.touches.length == 1 && (E(!0), n(!0), document.addEventListener("touchend", R), e(t), D == null || D(t));
   }, ee = (e) => {
-    if (e.touches.length == 1 && (e.cancelable && e.preventDefault(), f)) {
+    if (e.touches.length == 1 && (e.cancelable && e.preventDefault(), m)) {
       let t = o.getNormalizedCursorValue({
         cursorXPosition: e.touches[0].clientX,
-        railNode: f
+        railNode: m
       });
       v && (t = 100 - t);
       const S = o.getNearestStep({ normalizedValue: t, steps: s });
       r(S.value);
     }
-  }, T = (e) => {
-    e.cancelable && e.preventDefault(), n(!1), document.removeEventListener("touchend", T);
-  }, b = () => z.filter((e) => e.id === l)[0], te = (e) => {
-    e.preventDefault(), O.moveToPrevStep(b(), s);
+  }, R = (e) => {
+    e.cancelable && e.preventDefault(), n(!1), document.removeEventListener("touchend", R);
+  }, T = () => z.filter((e) => e.id === l)[0], te = (e) => {
+    e.preventDefault(), O.moveToPrevStep(T(), s);
   }, oe = (e) => {
-    e.preventDefault(), O.moveToNextStep(b(), s);
+    e.preventDefault(), O.moveToNextStep(T(), s);
   }, se = (e) => {
     y || V(!0), N(!0), h == null || h(e);
   }, de = (e) => {
@@ -103,14 +103,14 @@ const pe = "sliderExtendedDot__61b3397d", xe = "focusedByClick__b93f4cf7", he =
   };
   return /* @__PURE__ */ I(B, { children: [
     W && /* @__PURE__ */ I(B, { children: [
-      /* @__PURE__ */ m(
+      /* @__PURE__ */ f(
         F,
         {
           onMatch: te,
           eventKeyCode: [p.ARROW_LEFT, p.ARROW_DOWN]
         }
       ),
-      /* @__PURE__ */ m(
+      /* @__PURE__ */ f(
         F,
         {
           onMatch: oe,
@@ -118,13 +118,13 @@ const pe = "sliderExtendedDot__61b3397d", xe = "focusedByClick__b93f4cf7", he =
         }
       )
     ] }),
-    /* @__PURE__ */ m(
+    /* @__PURE__ */ f(
       ue,
       {
         onMouseMove: k.throttle(Q, 50),
         onTouchMove: k.throttle(ee),
-        targetRef: C,
-        children: ({ onTargetMouseDown: e, onTargetTouchStart: t }) => /* @__PURE__ */ m(
+        targetRef: b,
+        children: ({ onTargetMouseDown: e, onTargetTouchStart: t }) => /* @__PURE__ */ f(
           "span",
           {
             tabIndex: $,
@@ -143,7 +143,7 @@ const pe = "sliderExtendedDot__61b3397d", xe = "focusedByClick__b93f4cf7", he =
             onMouseDown: J(e),
             onTouchStart: Z(t),
             style: { left: `${U}%` },
-            ref: C,
+            ref: b,
             children: K
           }
         )