@sberbusiness/triplex-next 0.14.1 → 0.16.0

package/components/Stepper/Stepper.js

@@ -8,9 +8,9 @@ import { ButtonIcon as R } from "../Button/ButtonIcon.js";
 import { CaretrightStrokeSrvIcon24 as q, CaretleftStrokeSrvIcon24 as F } from "@sberbusiness/icons-next";
 import { EScreenWidth as J } from "../../helpers/breakpoints.js";
 import { scrollSmoothHorizontally as S } from "../../utils/scroll.js";
-import { c as i } from "../../chunks/vendor-CalMVkfj.js";
+import { c as i } from "../../chunks/vendor-DE8Zvm0w.js";
 import { EStepperSize as a } from "./enums.js";
-const K = "stepper__aafca827", O = "sm__8b39e94d", Q = "md__cb8ceb66", T = "lg__b5a68f7d", U = "stepperCarousel__76e0ab4d", V = "buttonPrev__6fa988f1", Y = "buttonNext__40abc7b1", n = {
+const K = "stepper__684eeff0", O = "sm__c3d0cad5", Q = "md__bb23b389", T = "lg__5c74762b", U = "stepperCarousel__55fa6f6c", V = "buttonPrev__71f5ea51", Y = "buttonNext__148e2fb9", n = {
   stepper: K,
   sm: O,
   md: Q,
@@ -29,12 +29,12 @@ const K = "stepper__aafca827", O = "sm__8b39e94d", Q = "md__cb8ceb66", T = "lg__
   }
 }, P = ({
   className: m,
-  steps: b,
+  steps: h,
   size: c = a.SM,
   selectedStepId: l,
   ...E
 }) => {
-  const [h, w] = G({ stepNext: 0, stepPrev: 0 }), u = v(null), x = v({}), B = i(n.stepper, p(c), m), M = b.findIndex((e) => e.id === l), I = ({ hidden: e, ...t }) => e ? null : /* @__PURE__ */ s(
+  const [b, w] = G({ stepNext: 0, stepPrev: 0 }), u = v(null), x = v({}), B = i(n.stepper, p(c), m), M = h.findIndex((e) => e.id === l), I = ({ hidden: e, ...t }) => e ? null : /* @__PURE__ */ s(
     R,
     {
       className: i(n.buttonPrev, p(c)),
@@ -65,8 +65,8 @@ const K = "stepper__aafca827", O = "sm__8b39e94d", Q = "md__cb8ceb66", T = "lg__
   }, y = (e, t) => {
     t && S(e, t);
   }, A = (e, t) => {
-    const { left: r, right: o, width: j } = e.getBoundingClientRect(), { left: f, right: N, width: D } = t.getBoundingClientRect(), d = r + j / 2, g = f + D / 2;
-    window.matchMedia(`(max-width: ${J.SM_MAX})`).matches ? y(e, g - d) : d > g ? k(e, t, f - r - 32, f) : d < g && L(e, t, N - o + 32, N);
+    const { left: r, right: o, width: j } = e.getBoundingClientRect(), { left: f, right: N, width: D } = t.getBoundingClientRect(), g = r + j / 2, d = f + D / 2;
+    window.matchMedia(`(max-width: ${J.SM_MAX})`).matches ? y(e, d - g) : g > d ? k(e, t, f - r - 32, f) : g < d && L(e, t, N - o + 32, N);
   };
   return C(() => {
     if (l) {
@@ -79,10 +79,10 @@ const K = "stepper__aafca827", O = "sm__8b39e94d", Q = "md__cb8ceb66", T = "lg__
       className: i(n.stepperCarousel, p(c)),
       buttonPrev: I,
       buttonNext: W,
-      stepPrev: h.stepPrev,
-      stepNext: h.stepNext,
+      stepPrev: b.stepPrev,
+      stepNext: b.stepNext,
       ref: u,
-      children: /* @__PURE__ */ s(_, { className: B, selectedStepId: l, size: c, ...E, children: b.map(({ label: e, ...t }, r) => /* @__PURE__ */ s(
+      children: /* @__PURE__ */ s(_, { className: B, selectedStepId: l, size: c, ...E, children: h.map(({ label: e, ...t }, r) => /* @__PURE__ */ s(
         _.Step,
         {
           forwardedRef: (o) => x.current[t.id] = o,

package/components/Stepper/StepperExtended.js

@@ -3,8 +3,8 @@ 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-CalMVkfj.js";
-const h = "stepperExtended__880140e2", u = {
+import { c as E } from "../../chunks/vendor-DE8Zvm0w.js";
+const h = "stepperExtended__8e8a5e69", u = {
   stepperExtended: h
 }, t = ({
   children: r,

package/components/Stepper/StepperStep.js

@@ -4,8 +4,8 @@ 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-CalMVkfj.js";
-import { s as t, R as F } from "../../chunks/RightBorderArrow-BjcGiO4Y.js";
+import { c as C } from "../../chunks/vendor-DE8Zvm0w.js";
+import { s as t, R as F } from "../../chunks/RightBorderArrow-B47Am4iB.js";
 import { EStepperSize as h, EStepperStepType as j } from "./enums.js";
 const H = ({
   children: x,
@@ -72,7 +72,7 @@ const H = ({
       ...G,
       ref: P,
       children: [
-        /* @__PURE__ */ I("div", { className: t.content, "data-tx": "0.14.1", children: [
+        /* @__PURE__ */ I("div", { className: t.content, "data-tx": "0.16.0", children: [
           g && U(),
           x
         ] }),

package/components/Stepper/StepperWrapper.js

@@ -1,10 +1,10 @@
 import { jsx as t } from "react/jsx-runtime";
-import { c as a } from "../../chunks/vendor-CalMVkfj.js";
-const o = "stepperWrapper__2777bead", c = {
+import { c as a } from "../../chunks/vendor-DE8Zvm0w.js";
+const o = "stepperWrapper__27df1878", c = {
   stepperWrapper: o
 }, W = ({ children: p, className: r, ...e }) => {
   const s = a(c.stepperWrapper, r);
-  return /* @__PURE__ */ t("div", { className: s, ...e, "data-tx": "0.14.1", children: p });
+  return /* @__PURE__ */ t("div", { className: s, ...e, "data-tx": "0.16.0", children: p });
 };
 export {
   W as StepperWrapper

package/components/Suggest/Suggest.js

@@ -1,100 +1,63 @@
-import { SuggestContext as N } from "./SuggestContext.js";
-import { jsx as x } from "react/jsx-runtime";
-import Q, { useState as i, useRef as d, useCallback as r, useEffect as C } from "react";
-import { isKey as T } from "../../utils/keyboard.js";
-import { a as U } from "../../chunks/vendor-CalMVkfj.js";
-const W = ({
-  children: D,
-  value: n,
-  options: I,
-  size: X,
-  placeholder: L,
-  noOptionsText: O,
-  loading: l,
-  dropdownListLoading: A,
-  tooltipOpen: P,
-  clearInputOnFocus: j,
-  onKeyDown: s,
-  onSelect: g,
-  onFilter: R,
-  onScrollEnd: k,
-  ...q
-}, e) => {
-  const [f, p] = i((n == null ? void 0 : n.label) || ""), [z, B] = i(), [o, a] = i(!1), [F] = i(U()), u = d(null), S = d(null), m = d(() => {
-  }), c = d(() => {
-  }), M = r(
-    (t) => {
-      f !== t && p(t);
-    },
-    [f]
-  );
-  m.current = M, C(() => {
-    m.current((n == null ? void 0 : n.label) || "");
-  }, [n]);
-  const b = r(
-    (t = (n == null ? void 0 : n.label) || "") => {
-      m.current(t), B(void 0), a(!1);
-    },
-    [n]
-  );
-  c.current = b, C(() => {
-    const t = (h) => {
-      var w, E;
-      !((w = u.current) != null && w.contains(h.target)) && !((E = S.current) != null && E.contains(h.target)) && c.current();
+import { SuggestContext as K } from "./SuggestContext.js";
+import { jsx as p } from "react/jsx-runtime";
+import P, { useRef as g, useEffect as C, useCallback as F } from "react";
+import { useSuggest as b } from "./useSuggest.js";
+const j = (t, e) => {
+  const {
+    children: a,
+    value: f,
+    options: m,
+    size: k,
+    placeholder: w,
+    noOptionsText: v,
+    loading: R,
+    dropdownListLoading: S,
+    tooltipOpen: D,
+    clearInputOnFocus: O,
+    onKeyDown: z,
+    onSelect: B,
+    onFilter: I,
+    onScrollEnd: h,
+    ...x
+  } = t, r = b(t), { dropdownOpen: s, closeDropdown: u, onKeyDown: y } = r, n = g(null), c = g(null);
+  C(() => {
+    if (!s)
+      return;
+    const o = (L) => {
+      var i, l;
+      const d = L.target;
+      !((i = n.current) != null && i.contains(d)) && !((l = c.current) != null && l.contains(d)) && u();
     };
-    if (o)
-      return document.addEventListener("mousedown", t), () => {
-        document.removeEventListener("mousedown", t);
-      };
-  }, [o]);
-  const G = r(
-    (t) => {
-      o === !0 && T(t.code, "ESCAPE") && c.current(), s == null || s(t);
-    },
-    [o, s]
-  ), H = r(
-    (t) => {
-      c.current((t == null ? void 0 : t.label) || ""), g(t);
-    },
-    [g]
-  ), J = r(
-    (t) => {
-      p(t), R(t);
+    return document.addEventListener("mousedown", o), () => document.removeEventListener("mousedown", o);
+  }, [s, u]);
+  const E = F(
+    (o) => {
+      n.current = o, typeof e == "function" ? e(o) : e && (e.current = o);
     },
-    [R]
+    [e]
   );
-  return /* @__PURE__ */ x("div", { onKeyDown: G, ...q, ref: (t) => {
-    u.current = t, typeof e == "function" ? e(t) : e && (e.current = t);
-  }, children: /* @__PURE__ */ x(
-    N.Provider,
+  return /* @__PURE__ */ p("div", { ...x, onKeyDown: y, ref: E, children: /* @__PURE__ */ p(
+    K.Provider,
     {
       value: {
-        value: n,
-        options: I,
-        placeholder: L,
-        noOptionsText: O,
-        loading: l,
-        dropdownListLoading: A,
-        tooltipOpen: P,
-        clearInputOnFocus: j,
-        onSelect: H,
-        onFilter: J,
-        onScrollEnd: k,
-        inputValue: f,
-        setInputValue: p,
-        activeDescendant: z,
-        dropdownOpen: o,
-        setDropdownOpen: a,
-        closeDropdown: b,
-        dropdownListId: F,
-        suggestRef: u,
-        dropdownRef: S
+        value: f,
+        options: m,
+        placeholder: w,
+        noOptionsText: v,
+        loading: R,
+        dropdownListLoading: S,
+        tooltipOpen: D,
+        clearInputOnFocus: O,
+        onScrollEnd: h,
+        suggestRef: n,
+        dropdownRef: c,
+        ...r
       },
-      children: D
+      children: a
     }
   ) });
-}, V = Q.forwardRef(W);
+}, G = P.forwardRef(j);
 export {
-  V as Suggest
+  G as Suggest
 };
 //# sourceMappingURL=Suggest.js.map

package/components/Suggest/SuggestContext.js

@@ -1,5 +1,5 @@
 import e, { useContext as t } from "react";
-const n = e.createContext({
+const o = e.createContext({
   value: void 0,
   options: [],
   inputValue: "",
@@ -18,12 +18,9 @@ const n = e.createContext({
   dropdownListId: "",
   suggestRef: { current: null },
   dropdownRef: { current: null }
-});
-function u() {
-  return t(n);
-}
+}), s = () => t(o);
 export {
-  n as SuggestContext,
-  u as useSuggestContext
+  o as SuggestContext,
+  s as useSuggestContext
 };
 //# sourceMappingURL=SuggestContext.js.map

package/components/Suggest/SuggestMobileDropdownContent.js

@@ -1,11 +1,10 @@
 import { jsxs as c, Fragment as m, jsx as e } from "react/jsx-runtime";
 import { useRef as B, useCallback as r } from "react";
 import { useSuggestContext as F } from "./SuggestContext.js";
-import "../Dropdown/Dropdown.js";
 import "../Dropdown/DropdownListContext.js";
 import "../Dropdown/desktop/DropdownDesktop.js";
 import "../Dropdown/desktop/DropdownList.js";
-import "../../chunks/DropdownListItem-BByGOD7_.js";
+import "../../chunks/DropdownListItem-BdSacGyt.js";
 import "../Dropdown/mobile/DropdownMobile.js";
 import { DropdownMobileBody as I } from "../Dropdown/mobile/DropdownMobileBody.js";
 import { DropdownMobileClose as N } from "../Dropdown/mobile/DropdownMobileClose.js";
@@ -16,11 +15,12 @@ import { DropdownMobileInput as L } from "../Dropdown/mobile/DropdownMobileInput
 import { DropdownMobileList as R } from "../Dropdown/mobile/DropdownMobileList.js";
 import { DropdownMobileListItem as _ } from "../Dropdown/mobile/DropdownMobileListItem.js";
 import { DropdownMobileLoader as v } from "../Dropdown/mobile/DropdownMobileLoader.js";
-import "../Typography/Title.js";
-import { Text as E } from "../Typography/Text.js";
+import "../Dropdown/Dropdown.js";
+import { ETextSize as E, EFontType as H } from "../Typography/enums.js";
 import "../Typography/Caption.js";
-import { ETextSize as H, EFontType as j } from "../Typography/enums.js";
-const k = "suggestDropdownMobileBody__156bf637", z = "suggestDropdownMobileNoOptionsText__152ee94b", g = {
+import { Text as j } from "../Typography/Text.js";
+import "../Typography/Title.js";
+const k = "suggestDropdownMobileBody__b44ecb52", z = "suggestDropdownMobileNoOptionsText__f85e6a8b", g = {
   suggestDropdownMobileBody: k,
   suggestDropdownMobileNoOptionsText: z
 }, po = () => {
@@ -74,11 +74,11 @@ const k = "suggestDropdownMobileBody__156bf637", z = "suggestDropdownMobileNoOpt
       }
     ),
     /* @__PURE__ */ e(I, { className: g.suggestDropdownMobileBody, onScroll: D, children: s.length === 0 ? /* @__PURE__ */ e(
-      E,
+      j,
       {
         className: g.suggestDropdownMobileNoOptionsText,
-        type: j.PRIMARY,
-        size: H.B2,
+        type: H.PRIMARY,
+        size: E.B2,
         tag: "div",
         children: a
       }

package/components/Suggest/useSuggest.js

@@ -0,0 +1,64 @@
+import { useState as n, useRef as C, useLayoutEffect as L, useCallback as i, useMemo as O } from "react";
+import { u as R } from "../../chunks/vendor-DE8Zvm0w.js";
+import { isKey as q } from "../../utils/keyboard.js";
+const D = ({
+  value: o,
+  onSelect: d,
+  onFilter: f,
+  onKeyDown: r
+}) => {
+  const [e, c] = n((o == null ? void 0 : o.label) || ""), [m, a] = n(), [p, b] = n(!1), [k, A] = n(o), [S] = n(() => `dropdown-list-${R()}`);
+  o !== k && (A(o), c((o == null ? void 0 : o.label) || ""));
+  const g = C(o);
+  L(() => {
+    g.current = o;
+  });
+  const s = i((t) => {
+    var P;
+    c(t ?? (((P = g.current) == null ? void 0 : P.label) || "")), a(void 0), b(!1);
+  }, []), h = i(
+    (t) => {
+      s(t == null ? void 0 : t.label), d(t);
+    },
+    [s, d]
+  ), E = i(
+    (t) => {
+      c(t), f(t);
+    },
+    [f]
+  ), I = i(
+    (t) => {
+      p && q(t.key, "ESCAPE") && (t.stopPropagation(), s()), r == null || r(t);
+    },
+    [p, s, r]
+  );
+  return O(
+    () => ({
+      inputValue: e,
+      activeDescendant: m,
+      dropdownOpen: p,
+      dropdownListId: S,
+      setInputValue: c,
+      setDropdownOpen: b,
+      setActiveDescendant: a,
+      closeDropdown: s,
+      onSelect: h,
+      onFilter: E,
+      onKeyDown: I
+    }),
+    [
+      e,
+      m,
+      p,
+      S,
+      s,
+      h,
+      E,
+      I
+    ]
+  );
+};
+export {
+  D as useSuggest
+};
+//# sourceMappingURL=useSuggest.js.map

package/components/SuggestField/SuggestField.js

@@ -1,63 +1,60 @@
 import "./desktop/SuggestFieldDesktopDropdown.js";
-import { SuggestFieldDesktop as L } from "./desktop/SuggestFieldDesktop.js";
-import { SuggestFieldMobile as O } from "./mobile/SuggestFieldMobile.js";
+import { SuggestFieldDesktop as S } from "./desktop/SuggestFieldDesktop.js";
+import { SuggestFieldMobile as b } from "./mobile/SuggestFieldMobile.js";
 import "./mobile/SuggestFieldMobileDropdown.js";
-import "../../chunks/SuggestFieldMobileDropdownHint-BM9lOqXe.js";
-import "./mobile/SuggestFieldMobileTarget.js";
-import { jsx as e } from "react/jsx-runtime";
-import { MobileView as h } from "../MobileView/MobileView.js";
-import { SuggestFieldTarget as j } from "./SuggestFieldTarget.js";
-const k = (t) => {
+import "../../chunks/SuggestFieldMobileDropdownHint-C_9OyUAk.js";
+import { jsx as o } from "react/jsx-runtime";
+import { MobileView as I } from "../MobileView/MobileView.js";
+import "../FormField/FormField.js";
+import "../FormField/components/FormFieldDescription.js";
+import "../FormField/components/FormFieldCounter.js";
+import "../FormField/components/FormFieldLabel.js";
+import "../FormField/components/FormFieldClear.js";
+import "../FormField/components/FormFieldTarget.js";
+import { F as O } from "../../chunks/FormFieldInput-DDUEO0k6.js";
+import "../FormField/components/FormFieldMaskedInput.js";
+import "../FormField/components/FormFieldPostfix.js";
+import "../FormField/components/FormFieldPrefix.js";
+import "../FormField/components/FormFieldTextarea.js";
+const h = (t) => {
   const {
-    status: r,
-    size: o,
-    value: i,
-    label: n,
+    status: i,
+    size: r,
+    value: p,
+    label: e,
     loading: l,
-    options: g,
-    placeholder: a,
-    tooltipHint: p,
-    tooltipOpen: s,
+    options: m,
+    placeholder: n,
+    tooltipHint: s,
+    tooltipOpen: a,
     dropdownListLoading: d,
     clearInputOnFocus: u,
-    onSelect: m,
-    onFilter: c,
-    onScrollEnd: T,
-    onTargetInputFocus: f,
-    onTargetInputBlur: F,
-    renderTarget: S,
-    renderTargetInput: b,
-    renderTargetLabel: x,
-    renderTargetPostfix: I,
-    renderTargetPrefix: w
+    onSelect: c,
+    onFilter: g,
+    onScrollEnd: F,
+    inputProps: f
   } = t;
-  return /* @__PURE__ */ e(h, { fallback: /* @__PURE__ */ e(L, { ...t }), children: /* @__PURE__ */ e(
-    O,
+  return /* @__PURE__ */ o(I, { fallback: /* @__PURE__ */ o(S, { ...t }), children: /* @__PURE__ */ o(
+    b,
     {
-      status: r,
-      size: o,
-      value: i,
-      options: g,
-      label: n,
-      placeholder: a,
-      dropdownHint: s ? p : "",
+      status: i,
+      size: r,
+      value: p,
+      options: m,
+      label: e,
+      placeholder: n,
+      tooltipHint: a ? s : "",
       loading: l,
       dropdownListLoading: d,
       clearInputOnFocus: u,
-      onSelect: m,
-      onFilter: c,
-      onScrollEnd: T,
-      onTargetInputFocus: f,
-      onTargetInputBlur: F,
-      renderTarget: S,
-      renderTargetInput: b,
-      renderTargetLabel: x,
-      renderTargetPrefix: w,
-      renderTargetPostfix: I
+      onSelect: c,
+      onFilter: g,
+      onScrollEnd: F,
+      inputProps: f
     }
   ) });
-}, q = Object.assign(k, { Target: j });
+}, G = Object.assign(h, { Input: O });
 export {
-  q as SuggestField
+  G as SuggestField
 };
 //# sourceMappingURL=SuggestField.js.map