@sberbusiness/triplex-next 1.1.1 → 1.3.0

package/components/SegmentedControl/SegmentedControlSegment.js

@@ -1,10 +1,10 @@
 import { jsx as a } from "react/jsx-runtime";
-import { useContext as b } from "react";
-import { c as L } from "../../chunks/vendor-D-uL_icH.js";
+import { useContext as x } from "react";
+import { c as L } from "../../chunks/vendor-CehxOAkM.js";
 import { ButtonBase as N } from "../Button/ButtonBase.js";
 import { ESegmentedControlType as n } from "./enums.js";
 import { SegmentedControlContext as _ } from "./SegmentedControlContext.js";
-const y = "segmentedControlSegment__fcd51051", E = "selected__2866e81f", I = "content__198fa72c", r = {
+const y = "segmentedControlSegment__bc94b2dc", E = "selected__d069c239", I = "content__580184a7", r = {
   segmentedControlSegment: y,
   selected: E,
   content: I
@@ -22,25 +22,25 @@ const y = "segmentedControlSegment__fcd51051", E = "selected__2866e81f", I = "co
     value: d,
     disabled: p,
     onSegmentSelect: l
-  } = b(_), t = (() => {
+  } = x(_), t = (() => {
     switch (m) {
       case n.SINGLE:
         return e === d;
       case n.MULTIPLE:
         return d.includes(e);
     }
-  })(), f = L(
+  })(), C = L(
     r.segmentedControlSegment,
     { [r.selected]: t },
     "hoverable",
     { active: t },
     i
-  ), C = () => {
+  ), f = () => {
     if (c)
       return c;
     if (typeof s == "string")
       return s;
-  }, u = (x) => {
+  }, b = (u) => {
     switch (m) {
       case n.SINGLE:
         l({ value: e, selected: !0 });
@@ -49,16 +49,16 @@ const y = "segmentedControlSegment__fcd51051", E = "selected__2866e81f", I = "co
         l({ value: e, selected: !t });
         break;
     }
-    o == null || o(x);
+    o == null || o(u);
   };
   return /* @__PURE__ */ a(
     N,
     {
-      className: f,
-      title: C(),
+      className: C,
+      title: f(),
       disabled: g || p,
       "aria-pressed": t,
-      onClick: u,
+      onClick: b,
       ...S,
       children: /* @__PURE__ */ a("span", { className: r.content, children: s })
     }

package/components/SelectExtendedField/SelectExtendedField.js

@@ -2,10 +2,10 @@ import { jsx as y, jsxs as O } from "react/jsx-runtime";
 import { useState as T, useRef as u, useCallback as r, useEffect as x } from "react";
 import { isKey as K, EVENT_KEY_CODES as b } from "../../utils/keyboard.js";
 import { KeyDownListener as C } from "../KeyDownListener/KeyDownListener.js";
-import { c as _ } from "../../chunks/vendor-D-uL_icH.js";
+import { c as _ } from "../../chunks/vendor-CehxOAkM.js";
 import { SelectExtendedFieldTarget as j } from "./components/SelectExtendedFieldTarget.js";
 import { SelectExtendedFieldDropdown as k } from "./components/SelectExtendedFieldDropdown.js";
-const v = "SelectExtendedField__76902a04", A = {
+const v = "SelectExtendedField__4a90830d", A = {
   SelectExtendedField: v
 }, L = (S) => {
   const { className: w, onKeyDown: n, children: D, renderTarget: F, closeOnTab: m, onClose: o, onOpen: d, ...g } = S, [e, c] = T(!1), l = u(null), f = u(null), E = r((t) => {

package/components/SelectExtendedField/components/SelectExtendedFieldDropdown.js

@@ -1,8 +1,9 @@
 import { jsx as i } from "react/jsx-runtime";
 import { Dropdown as m } from "../../Dropdown/Dropdown.js";
-import { DropdownList as e } from "../../Dropdown/desktop/DropdownList.js";
+import "../../Dropdown/DropdownListContext.js";
 import "../../Dropdown/desktop/DropdownDesktop.js";
-import "../../../chunks/DropdownListItem-DIIAnvmw.js";
+import { DropdownList as e } from "../../Dropdown/desktop/DropdownList.js";
+import "../../../chunks/DropdownListItem-g0mYNHIW.js";
 import "../../Dropdown/mobile/DropdownMobile.js";
 import "../../Dropdown/mobile/DropdownMobileBody.js";
 import "../../Dropdown/mobile/DropdownMobileClose.js";
@@ -12,6 +13,8 @@ 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";
 const d = ({
   forwardedRef: o,
   children: r,

package/components/SelectExtendedField/components/SelectExtendedFieldDropdownDefault.js

@@ -1,18 +1,20 @@
-import { jsx as e, jsxs as a, Fragment as M } from "react/jsx-runtime";
+import { jsx as e, jsxs as M, Fragment as S } from "react/jsx-runtime";
 import { createElement as s } from "react";
 import { SelectExtendedField as m } from "../SelectExtendedField.js";
 import "../../Dropdown/mobile/DropdownMobile.js";
-import { DropdownMobileBody as S } from "../../Dropdown/mobile/DropdownMobileBody.js";
-import { DropdownMobileClose as y } from "../../Dropdown/mobile/DropdownMobileClose.js";
+import { DropdownMobileBody as y } from "../../Dropdown/mobile/DropdownMobileBody.js";
+import { DropdownMobileClose as E } from "../../Dropdown/mobile/DropdownMobileClose.js";
 import "../../Dropdown/mobile/DropdownMobileFooter.js";
-import { DropdownMobileHeader as E } from "../../Dropdown/mobile/DropdownMobileHeader.js";
+import { DropdownMobileHeader as k } from "../../Dropdown/mobile/DropdownMobileHeader.js";
 import "../../Dropdown/mobile/DropdownMobileInner.js";
 import "../../Dropdown/mobile/DropdownMobileInput.js";
-import { DropdownMobileList as k } from "../../Dropdown/mobile/DropdownMobileList.js";
-import { DropdownMobileListItem as B } from "../../Dropdown/mobile/DropdownMobileListItem.js";
-import { Text as F } from "../../Typography/Text.js";
-import { ETextSize as L } from "../../Typography/enums.js";
-const J = ({
+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: w,
   dropdownListItemClassName: l,
   fixedWidth: c,
@@ -21,9 +23,10 @@ const J = ({
   mobileTitle: h,
   onChange: n,
   opened: p,
+  size: x,
   options: f,
   setOpened: i,
-  targetRef: x,
+  targetRef: a,
   value: o
 }) => /* @__PURE__ */ e(
   m.Dropdown,
@@ -32,20 +35,21 @@ const J = ({
     forwardedRef: w,
     fixedWidth: typeof c > "u" ? !0 : c,
     setOpened: i,
-    targetRef: x,
+    targetRef: a,
+    size: x,
     mobileViewProps: {
-      children: /* @__PURE__ */ a(M, { children: [
+      children: /* @__PURE__ */ M(S, { children: [
         /* @__PURE__ */ e(
-          E,
+          k,
           {
-            closeButton: () => /* @__PURE__ */ e(y, { onClick: () => i(!1) }),
-            children: /* @__PURE__ */ e(F, { tag: "div", size: L.B1, children: h })
+            closeButton: () => /* @__PURE__ */ e(E, { onClick: () => i(!1) }),
+            children: /* @__PURE__ */ e(L, { tag: "div", size: j.B1, children: h })
           }
         ),
-        /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(k, { children: f.map((r) => {
+        /* @__PURE__ */ e(y, { children: /* @__PURE__ */ e(B, { children: f.map((r) => {
           const { label: d, ...t } = r;
           return /* @__PURE__ */ s(
-            B,
+            F,
             {
               ...t,
               className: l,
@@ -81,6 +85,6 @@ const J = ({
   }
 );
 export {
-  J as SelectExtendedFieldDropdownDefault
+  Q as SelectExtendedFieldDropdownDefault
 };
 //# sourceMappingURL=SelectExtendedFieldDropdownDefault.js.map

package/components/SelectExtendedField/components/SelectExtendedFieldTarget.js

@@ -1,31 +1,32 @@
-import { jsxs as L, jsx as l } from "react/jsx-runtime";
-import N, { useRef as O } from "react";
+import { jsxs as N, jsx as l } from "react/jsx-runtime";
+import L, { useRef as O } from "react";
 import { CaretdownStrokeSrvIcon24 as A } from "@sberbusiness/icons-next";
-import { EVENT_KEY_CODES as s } from "../../../utils/keyboard.js";
-import { LoaderSmall as y } from "../../Loader/LoaderSmall/LoaderSmall.js";
-import { ELoaderSmallTheme as B, ELoaderSmallSize as C } from "../../Loader/LoaderSmall/enum.js";
+import { EVENT_KEY_CODES as n } from "../../../utils/keyboard.js";
+import { LoaderSmall as C } from "../../Loader/LoaderSmall/LoaderSmall.js";
+import { ELoaderSmallTheme as y } from "../../Loader/LoaderSmall/enum.js";
 import "../../Loader/LoaderMiddle/LoaderMiddle.js";
-import { c as E } from "../../../chunks/vendor-D-uL_icH.js";
-import { FormField as P } from "../../FormField/FormField.js";
+import { c as E } from "../../../chunks/vendor-CehxOAkM.js";
+import { FormField as B } from "../../FormField/FormField.js";
 import "../../FormField/components/FormFieldDescription.js";
 import "../../FormField/components/FormFieldCounter.js";
-import { FormFieldLabel as k } from "../../FormField/components/FormFieldLabel.js";
+import { FormFieldLabel as P } from "../../FormField/components/FormFieldLabel.js";
 import "../../FormField/components/FormFieldClear.js";
-import { FormFieldTarget as w } from "../../FormField/components/FormFieldTarget.js";
-import "../../../chunks/FormFieldInput-rV5ZVe9k.js";
+import { FormFieldTarget as k } from "../../FormField/components/FormFieldTarget.js";
+import "../../../chunks/FormFieldInput-qaJqBTBV.js";
 import "../../FormField/components/FormFieldMaskedInput.js";
-import { FormFieldPostfix as z } from "../../FormField/components/FormFieldPostfix.js";
+import { FormFieldPostfix as w } from "../../FormField/components/FormFieldPostfix.js";
 import "../../FormField/components/FormFieldPrefix.js";
 import "../../FormField/components/FormFieldTextarea.js";
-import { EFormFieldStatus as n } from "../../FormField/enums.js";
-const W = "selectExtendedFieldTarget__a2b8cfd2", j = "caretIcon__afac0660", K = "selectOpened__359b8c14", G = "loading__04280e28", U = "disabled__17a439ef", t = {
+import { EFormFieldStatus as s } from "../../FormField/enums.js";
+import { EComponentSize as z } from "../../../enums/EComponentSize.js";
+const W = "selectExtendedFieldTarget__30d3014c", j = "caretIcon__1dbb320f", K = "selectOpened__b1c4c179", G = "loading__c7c0080d", U = "disabled__8a40366c", t = {
   selectExtendedFieldTarget: W,
   caretIcon: j,
   selectOpened: K,
   loading: G,
   disabled: U
-}, V = N.forwardRef(
-  (x, d) => {
+}, V = L.forwardRef(
+  (x, a) => {
     const {
       children: Y,
       className: g,
@@ -37,47 +38,47 @@ const W = "selectExtendedFieldTarget__a2b8cfd2", j = "caretIcon__afac0660", K =
       setOpened: f,
       loading: r,
       size: F,
-      status: a,
+      status: d,
       tabIndex: _,
-      fieldLabel: u,
-      ...S
-    } = x, b = O(null), D = E(
+      fieldLabel: b,
+      ...u
+    } = x, S = O(null), D = E(
       t.selectExtendedFieldTarget,
       {
         [t.selectOpened]: o,
         [t.loading]: r,
-        [t.disabled]: a === n.DISABLED
+        [t.disabled]: d === s.DISABLED
       },
       g
-    ), I = () => a === n.DISABLED || r ? -1 : _ || 0, h = (e) => {
-      r && a === n.DISABLED || (f(!o), p == null || p(e));
+    ), I = () => d === s.DISABLED || r ? -1 : _ || 0, h = (e) => {
+      r && d === s.DISABLED || (f(!o), p == null || p(e));
     }, R = (e) => {
-      r && a === n.DISABLED || (o || [
-        s.SPACE,
-        s.ENTER,
-        s.ARROW_DOWN,
-        s.ARROW_UP
+      r && d === s.DISABLED || (o || [
+        n.SPACE,
+        n.ENTER,
+        n.ARROW_DOWN,
+        n.ARROW_UP
       ].includes(e.keyCode) && (e.preventDefault(), e.stopPropagation(), f(!o)), m == null || m(e));
     }, T = (e) => {
-      b.current = e, typeof d == "function" ? d(e) : d && (d.current = e);
+      S.current = e, typeof a == "function" ? a(e) : a && (a.current = e);
     };
-    return /* @__PURE__ */ L(
-      P,
+    return /* @__PURE__ */ N(
+      B,
       {
         onClick: h,
         tabIndex: I(),
         onKeyDown: R,
-        status: a,
+        status: d,
         size: F,
         className: D,
         "aria-expanded": o,
         "aria-haspopup": "listbox",
-        "data-tx": "1.1.1",
-        ...S,
+        "data-tx": "1.3.0",
+        ...u,
         children: [
-          /* @__PURE__ */ l(k, { floating: !!i || !!c, children: u }),
+          /* @__PURE__ */ l(P, { floating: !!i || !!c, children: b }),
           /* @__PURE__ */ l(
-            w,
+            k,
             {
               ref: T,
               className: E(t.target, {
@@ -88,7 +89,7 @@ const W = "selectExtendedFieldTarget__a2b8cfd2", j = "caretIcon__afac0660", K =
               children: i
             }
           ),
-          /* @__PURE__ */ l(z, { children: r ? /* @__PURE__ */ l(y, { size: C.LG, theme: B.BRAND }) : /* @__PURE__ */ l(A, { paletteIndex: 5, className: t.caretIcon }) })
+          /* @__PURE__ */ l(w, { children: r ? /* @__PURE__ */ l(C, { size: z.LG, theme: y.BRAND }) : /* @__PURE__ */ l(A, { paletteIndex: 5, className: t.caretIcon }) })
         ]
       }
     );

package/components/SelectField/SelectField.js

@@ -0,0 +1,62 @@
+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 "../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 { a as I } from "../../chunks/vendor-CehxOAkM.js";
+const C = S.forwardRef((c, t) => {
+  const {
+    children: L,
+    className: m,
+    value: r,
+    size: a,
+    options: p,
+    onChange: f,
+    placeholder: u,
+    loading: n,
+    status: b,
+    "aria-labelledby": g,
+    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);
+  };
+  return /* @__PURE__ */ o(s, { className: m, renderTarget: (e) => /* @__PURE__ */ o(
+    s.Target,
+    {
+      label: r == null ? void 0 : r.label,
+      placeholder: u,
+      loading: n,
+      status: b,
+      role: "combobox",
+      "aria-controls": i.current,
+      "aria-activedescendant": l,
+      "aria-labelledby": g,
+      ref: R,
+      size: a,
+      ...w,
+      ...e
+    }
+  ), closeOnTab: !0, ...x, children: (e) => /* @__PURE__ */ o(F.Provider, { value: { activeDescendant: l, setActiveDescendant: h }, children: /* @__PURE__ */ o(
+    v,
+    {
+      ...e,
+      size: a,
+      loading: n,
+      listId: i.current,
+      mobileTitle: D,
+      onChange: f,
+      options: p,
+      value: r
+    }
+  ) }) });
+});
+C.displayName = "SelectField";
+export {
+  C as SelectField
+};
+//# sourceMappingURL=SelectField.js.map

package/components/SelectField/index.js

@@ -0,0 +1,5 @@
+import { SelectField as o } from "./SelectField.js";
+export {
+  o as SelectField
+};
+//# sourceMappingURL=index.js.map

package/components/Skeleton/Skeleton.js

@@ -1,11 +1,11 @@
 import { jsx as n } from "react/jsx-runtime";
-import { c as r } from "../../chunks/vendor-D-uL_icH.js";
+import { c as r } from "../../chunks/vendor-CehxOAkM.js";
 import { ESkeletonType as t } from "./enums.js";
-const a = "skeleton__cd4900b6", c = "light__47f61eb5", k = "dark__1eab2c8f", o = {
-  skeleton: a,
-  light: c,
-  dark: k
-}, _ = ({ className: s, type: e = t.DARK, ...l }) => /* @__PURE__ */ n(
+const k = "skeleton__0f956d39", a = "light__4113ef83", c = "dark__476f9bcd", o = {
+  skeleton: k,
+  light: a,
+  dark: c
+}, f = ({ className: s, type: e = t.DARK, ...l }) => /* @__PURE__ */ n(
   "div",
   {
     className: r(o.skeleton, s, {
@@ -13,10 +13,10 @@ const a = "skeleton__cd4900b6", c = "light__47f61eb5", k = "dark__1eab2c8f", o =
       [o.light]: e === t.LIGHT
     }),
     ...l,
-    "data-tx": "1.1.1"
+    "data-tx": "1.3.0"
   }
 );
 export {
-  _ as Skeleton
+  f as Skeleton
 };
 //# sourceMappingURL=Skeleton.js.map

package/components/Stepper/RightBorderArrow.js

@@ -0,0 +1,7 @@
+import "react/jsx-runtime";
+import { R as m } from "../../chunks/RightBorderArrow-D6ZllSTT.js";
+import "./enums.js";
+export {
+  m as RightBorderArrow
+};
+//# sourceMappingURL=RightBorderArrow.js.map

package/components/Stepper/Stepper.js

@@ -0,0 +1,103 @@
+import { jsx as s } from "react/jsx-runtime";
+import { useState as D, useRef as N, useEffect as v } from "react";
+import { StepperExtended as C } from "./StepperExtended.js";
+import { StepperWrapper as G } from "./StepperWrapper.js";
+import { StepperStep as H } from "./StepperStep.js";
+import { CarouselExtended as X } from "../CarouselExtended/CarouselExtended.js";
+import { ButtonIcon as _ } from "../Button/ButtonIcon.js";
+import { CaretrightStrokeSrvIcon24 as $, CaretleftStrokeSrvIcon24 as q } from "@sberbusiness/icons-next";
+import { EScreenWidth as F } from "../../helpers/breakpoints.js";
+import { scrollSmoothHorizontally as g } from "../../utils/scroll.js";
+import { c as i } from "../../chunks/vendor-CehxOAkM.js";
+import { EStepperSize as l } from "./enums.js";
+const J = "stepper__056733b3", K = "stepperCarousel__b6858248", O = "buttonPrev__7a042fce", Q = "buttonNext__27309b20", T = "sm__1cdb49d1", U = "md__10bbebd3", V = "lg__4f65836c", n = {
+  stepper: J,
+  stepperCarousel: K,
+  buttonPrev: O,
+  buttonNext: Q,
+  sm: T,
+  md: U,
+  lg: V
+}, R = (p) => {
+  switch (p) {
+    case l.LG:
+      return n.lg;
+    case l.MD:
+      return n.md;
+    case l.SM:
+      return n.sm;
+  }
+}, P = ({
+  className: p,
+  steps: S,
+  size: a = l.SM,
+  selectedStepId: c,
+  ...E
+}) => {
+  const [b, w] = D({ stepNext: 0, stepPrev: 0 }), m = N(null), h = N({}), B = i(n.stepper, p), M = S.findIndex((e) => e.id === c), I = ({ hidden: e, ...t }) => e ? null : /* @__PURE__ */ s(
+    _,
+    {
+      className: i(n.buttonPrev, R(a)),
+      ...t,
+      "aria-label": "Прокрутить назад",
+      children: /* @__PURE__ */ s(q, { className: i(n.buttonPrevIcon), paletteIndex: 5 })
+    }
+  ), W = ({ hidden: e, ...t }) => e ? null : /* @__PURE__ */ s(
+    _,
+    {
+      className: i(n.buttonNext, R(a)),
+      ...t,
+      "aria-label": "Прокрутить вперёд",
+      children: /* @__PURE__ */ s($, { className: i(n.buttonNextIcon), paletteIndex: 5 })
+    }
+  );
+  v(() => {
+    const { current: e } = m;
+    if (e) {
+      const t = e.getBoundingClientRect().width * 0.3;
+      w({ stepNext: t, stepPrev: t });
+    }
+  }, []);
+  const L = (e, t, r, o) => {
+    r > 0 && (t.nextElementSibling && (r -= o - t.nextElementSibling.getBoundingClientRect().right), g(e, Math.ceil(r)));
+  }, k = (e, t, r, o) => {
+    r < 0 && (t.previousElementSibling && (r -= o - t.previousElementSibling.getBoundingClientRect().left), g(e, Math.floor(r)));
+  }, y = (e, t) => {
+    t && g(e, t);
+  }, A = (e, t) => {
+    const { left: r, right: o, width: j } = e.getBoundingClientRect(), { left: u, right: x, width: z } = t.getBoundingClientRect(), f = r + j / 2, d = u + z / 2;
+    window.matchMedia(`(max-width: ${F.SM_MAX})`).matches ? y(e, d - f) : f > d ? k(e, t, u - r - 32, u) : f < d && L(e, t, x - o + 32, x);
+  };
+  return v(() => {
+    if (c) {
+      const { current: e } = m, t = h.current[c];
+      e && t && A(e, t);
+    }
+  }, [c]), /* @__PURE__ */ s(
+    X,
+    {
+      className: i(n.stepperCarousel),
+      buttonPrev: I,
+      buttonNext: W,
+      stepPrev: b.stepPrev,
+      stepNext: b.stepNext,
+      ref: m,
+      children: /* @__PURE__ */ s(C, { className: B, selectedStepId: c, size: a, ...E, children: S.map(({ label: e, ...t }, r) => /* @__PURE__ */ s(
+        C.Step,
+        {
+          forwardedRef: (o) => h.current[t.id] = o,
+          ...t,
+          isInActiveStep: r > M,
+          children: e
+        },
+        t.id
+      )) })
+    }
+  );
+};
+P.Wrapper = G;
+P.Step = H;
+export {
+  P as Stepper
+};
+//# sourceMappingURL=Stepper.js.map

package/components/Stepper/StepperExtended.js

@@ -0,0 +1,26 @@
+import { jsx as e } from "react/jsx-runtime";
+import { EStepperSize as a } from "./enums.js";
+import { StepperExtendedContext as i } from "./StepperExtendedContext.js";
+import { StepperWrapper as x } from "./StepperWrapper.js";
+import { StepperStep as f } from "./StepperStep.js";
+import { c as E } from "../../chunks/vendor-CehxOAkM.js";
+const b = "stepperExtended__3da3b556", h = {
+  stepperExtended: b
+}, t = ({
+  children: r,
+  className: p,
+  size: o = a.SM,
+  onSelectStep: s,
+  selectedStepId: d,
+  forwardedRef: n,
+  ...m
+}) => {
+  const c = E(h.stepperExtended, p), l = (S) => s(S);
+  return /* @__PURE__ */ e(i.Provider, { value: { onSelectStep: l, selectedId: d, size: o }, children: /* @__PURE__ */ e("ol", { className: c, role: "tablist", ...m, ref: n, children: r }) });
+};
+t.Step = f;
+t.Wrapper = x;
+export {
+  t as StepperExtended
+};
+//# sourceMappingURL=StepperExtended.js.map

package/components/Stepper/StepperExtendedContext.js

@@ -0,0 +1,12 @@
+import e from "react";
+import { EStepperSize as t } from "./enums.js";
+const r = e.createContext({
+  size: t.SM,
+  onSelectStep: () => {
+  },
+  selectedId: void 0
+});
+export {
+  r as StepperExtendedContext
+};
+//# sourceMappingURL=StepperExtendedContext.js.map

package/components/Stepper/StepperStep.js

@@ -0,0 +1,88 @@
+import { jsxs as I, jsx as y } from "react/jsx-runtime";
+import { useContext as V, useState as W, useRef as k } from "react";
+import { StepperStepIcon as q } from "./StepperStepIcon.js";
+import { isKey as A } from "../../utils/keyboard.js";
+import { StepperExtendedContext as D } from "./StepperExtendedContext.js";
+import { EFocusSource as s } from "../../enums/EFocusSource.js";
+import { c as C } from "../../chunks/vendor-CehxOAkM.js";
+import { s as t, R as F } from "../../chunks/RightBorderArrow-D6ZllSTT.js";
+import { EStepperSize as h, EStepperStepType as j } from "./enums.js";
+const H = ({
+  children: x,
+  className: z,
+  id: c,
+  isInActiveStep: R,
+  onFocus: m,
+  onBlur: a,
+  onKeyDown: i,
+  onMouseDown: f,
+  onClick: l,
+  disabled: r,
+  icon: g,
+  forwardedRef: o,
+  type: O,
+  ...G
+}) => {
+  const { selectedId: T, size: n, onSelectStep: S } = V(D), [u, E] = W(s.NONE), p = k(null), N = c === T, Y = C(
+    t.stepperStep,
+    {
+      [t.active]: N,
+      [t.inactive]: R,
+      [t.completed]: !N && !R,
+      [t.disabled]: !!r,
+      [t.nonempty]: !!x,
+      [t.error]: !r && O === j.ERROR,
+      [t.warning]: !r && O === j.WARNING,
+      [t.focusVisible]: u === s.KEYBOARD,
+      [t.sm]: n === h.SM,
+      [t.md]: n === h.MD,
+      [t.lg]: n === h.LG
+    },
+    z
+  ), v = (e) => {
+    !u && p.current === e.target && E(s.KEYBOARD), m == null || m(e);
+  }, B = (e) => {
+    p.current !== document.activeElement && p.current === e.target && E(s.NONE), a == null || a(e);
+  }, K = (e) => {
+    const d = e.code || e.keyCode;
+    A(d, "ENTER") ? r || S(c) : A(d, "SPACE") && (e.preventDefault(), r || S(c)), i == null || i(e);
+  }, L = (e) => {
+    u || E(s.MOUSE), f == null || f(e);
+  }, M = (e) => {
+    r || S(c), l == null || l(e);
+  }, P = (e) => {
+    p.current = e, typeof o == "function" ? o(e) : o && (o.current = e);
+  }, U = () => {
+    const e = C(t.icon, "hoverable", { disabled: !!r });
+    return /* @__PURE__ */ y("span", { className: e, children: g });
+  };
+  return /* @__PURE__ */ I(
+    "li",
+    {
+      className: Y,
+      onFocus: v,
+      onBlur: B,
+      onKeyDown: K,
+      onMouseDown: L,
+      onClick: M,
+      tabIndex: r ? -1 : 0,
+      "aria-disabled": r,
+      "aria-current": N || void 0,
+      role: "button",
+      ...G,
+      ref: P,
+      children: [
+        /* @__PURE__ */ I("div", { className: t.content, "data-tx": "1.3.0", children: [
+          g && U(),
+          x
+        ] }),
+        /* @__PURE__ */ y(F, { size: n })
+      ]
+    }
+  );
+};
+H.Icon = q;
+export {
+  H as StepperStep
+};
+//# sourceMappingURL=StepperStep.js.map