@sberbusiness/triplex-next 1.14.0 → 1.16.0

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-Dlne6Znf.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-CooicUNx.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-CaLnhNmM.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-TbDWEJtn.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

package/components/SuggestField/desktop/SuggestFieldDesktop.js

@@ -1,27 +1,29 @@
-import { SuggestFieldDesktopDropdown as gt } from "./SuggestFieldDesktopDropdown.js";
-import { jsxs as q, jsx as g } from "react/jsx-runtime";
-import { useState as f, useRef as k, useCallback as s, useEffect as P } from "react";
-import { a as ft, E as ht, c as Dt } from "../../../chunks/vendor-DucOfXwy.js";
-import { Tooltip as x } from "../../Tooltip/Tooltip.js";
-import { ETooltipSize as bt } from "../../Tooltip/enums.js";
-import { SuggestFieldTarget as ut } from "../SuggestFieldTarget.js";
+import { SuggestFieldDesktopDropdown as dt } from "./SuggestFieldDesktopDropdown.js";
+import { jsxs as w, jsx as n } from "react/jsx-runtime";
+import lt, { useState as u, useRef as b, useCallback as s, useEffect as x } from "react";
+import { EComponentSize as ct } from "../../../enums/EComponentSize.js";
+import { Tooltip as R } from "../../Tooltip/Tooltip.js";
+import { ETooltipSize as pt } from "../../Tooltip/enums.js";
+import { TextFieldBase as at } from "../../TextField/TextFieldBase.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 { FormFieldClear as ft } from "../../FormField/components/FormFieldClear.js";
 import "../../FormField/components/FormFieldTarget.js";
-import "../../../chunks/FormFieldInput-D2lqfg4n.js";
+import { F as gt } from "../../../chunks/FormFieldInput-TbDWEJtn.js";
 import "../../FormField/components/FormFieldMaskedInput.js";
 import "../../FormField/components/FormFieldPostfix.js";
 import "../../FormField/components/FormFieldPrefix.js";
 import "../../FormField/components/FormFieldTextarea.js";
-import { EFormFieldStatus as St } from "../../FormField/enums.js";
-import "../../Dropdown/Dropdown.js";
-import { DropdownListContext as kt } from "../../Dropdown/DropdownListContext.js";
+import { EFormFieldStatus as T } from "../../FormField/enums.js";
+import { LoaderSmall as ht } from "../../Loader/LoaderSmall/LoaderSmall.js";
+import { ELoaderSmallTheme as ut } from "../../Loader/LoaderSmall/enum.js";
+import "../../Loader/LoaderMiddle/LoaderMiddle.js";
+import { DropdownListContext as bt } from "../../Dropdown/DropdownListContext.js";
 import "../../Dropdown/desktop/DropdownDesktop.js";
 import "../../Dropdown/desktop/DropdownList.js";
-import "../../../chunks/DropdownListItem-C6I9gVRb.js";
+import "../../../chunks/DropdownListItem-DzngoNVf.js";
 import "../../Dropdown/mobile/DropdownMobile.js";
 import "../../Dropdown/mobile/DropdownMobileBody.js";
 import "../../Dropdown/mobile/DropdownMobileClose.js";
@@ -31,167 +33,164 @@ 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 { DataTestId as wt } from "../../../consts/DataTestId.js";
-const Lt = "suggestFieldDesktop__54135468", Ct = {
-  suggestFieldDesktop: Lt
-}, Et = ({
-  className: z,
+import "../../Dropdown/Dropdown.js";
+import { DataTestId as j } from "../../../consts/DataTestId.js";
+import { u as St, A as Ft } from "../../../chunks/vendor-Dlne6Znf.js";
+const ie = ({
   value: e,
-  options: p,
-  size: y,
+  options: m,
+  size: S = ct.LG,
   status: F,
-  label: v,
-  placeholder: B,
-  loading: G,
-  dropdownListLoading: J,
-  tooltipHint: K,
-  tooltipOpen: Q,
-  clearInputOnFocus: R,
-  onSelect: d,
+  placeholder: _,
+  "data-test-id": d,
+  loading: q,
+  dropdownListLoading: z,
+  tooltipHint: G,
+  tooltipOpen: J,
+  clearInputOnFocus: k,
+  onSelect: g,
   onFilter: h,
   onScrollEnd: A,
-  onTargetInputFocus: D,
-  onTargetInputBlur: b,
-  renderTarget: N,
-  renderTargetInput: U,
-  renderTargetLabel: V,
-  renderTargetPrefix: W,
-  renderTargetPostfix: X,
-  renderDropdown: H,
-  renderDropdownList: Y,
-  renderDropdownListItem: Z,
-  "data-test-id": c,
-  ...T
+  onClear: p,
+  prefix: K,
+  postfix: Q,
+  renderInput: y,
+  renderDropdown: C,
+  renderDropdownList: U,
+  renderDropdownListItem: V,
+  inputProps: i,
+  ...W
 }) => {
-  const [m, l] = f((e == null ? void 0 : e.label) || ""), [u, w] = f(), [i, M] = f(!1), [o, n] = f(!1), [O, S] = f(!1), j = k(ft()), L = k(null), _ = k(null), C = k(A);
-  C.current = A;
-  const I = s(
+  const [a, l] = u((e == null ? void 0 : e.label) || ""), [H, D] = u(), [f, $] = u(!1), [r, c] = u(!1), M = b(St()), L = b(null), N = b(null), E = b(A);
+  E.current = A;
+  const X = s(
     (t) => {
-      l((t == null ? void 0 : t.label) || ""), w(void 0), n(!1), S(!0), d(t);
+      l((t == null ? void 0 : t.label) || ""), D(void 0), c(!1), g(t);
     },
-    [d]
-  ), tt = s(
+    [g]
+  ), Y = s(
     (t) => {
-      M(!0), n(!0), R && m.length !== 0 && l(""), D == null || D(t);
+      var o;
+      $(!0), k && a.length !== 0 && l(""), (o = i.onFocus) == null || o.call(i, t);
     },
-    [R, m, D]
-  ), et = s(
+    [k, a, i]
+  ), Z = s(
     (t) => {
-      w(void 0), M(!1), n(!1), S(!1), m.length !== 0 ? l((e == null ? void 0 : e.label) || "") : d(void 0), b == null || b(t);
+      var o;
+      D(void 0), $(!1), c(!1), a.length !== 0 ? l((e == null ? void 0 : e.label) || "") : g(void 0), (o = i.onBlur) == null || o.call(i, t);
     },
-    [e == null ? void 0 : e.label, m, d, b]
-  ), ot = s(() => {
-    i && !o && (n(!0), S(!1));
-  }, [i, o]), rt = s(
+    [e == null ? void 0 : e.label, a, g, i]
+  ), v = s(() => {
+    f && !r && c(!0);
+  }, [f, r]), P = s(
     (t) => {
-      const r = t.target.value;
-      l(r), S(!1), h(r);
+      const o = t.target.value;
+      r === !1 && m.length > 0 && c(!0), l(o), h(o);
     },
-    [h]
-  ), st = s(() => {
-    i ? (l(""), h("")) : d(void 0);
-  }, [i, h, d]), it = s(
+    [r, m.length, h]
+  ), tt = s(
     (t) => {
-      u !== t && w(t);
+      f && (l(""), h("")), p == null || p(t);
     },
-    [u]
-  ), E = s(
-    ht((t) => {
-      if (C.current === void 0)
+    [f, h, p]
+  ), I = s(
+    Ft((t) => {
+      if (E.current === void 0)
         return;
-      const r = t.target, a = r.parentElement;
-      if (a === null)
+      const o = t.target, B = o.parentElement;
+      if (B === null)
         return;
-      const dt = r.scrollHeight, lt = r.scrollTop, pt = a.scrollHeight, $ = window.getComputedStyle(a), ct = $.getPropertyValue("padding-top"), mt = $.getPropertyValue("padding-bottom"), at = Number.parseInt(mt) + Number.parseInt(ct);
-      Math.abs(lt + pt - at - dt) <= 1 && C.current();
+      const ot = o.scrollHeight, rt = o.scrollTop, it = B.scrollHeight, O = window.getComputedStyle(B), nt = O.getPropertyValue("padding-top"), st = O.getPropertyValue("padding-bottom"), mt = Number.parseInt(st) + Number.parseInt(nt);
+      Math.abs(rt + it - mt - ot) <= 1 && E.current();
     }, 100),
     []
   );
-  P(() => {
+  x(() => {
     l((e == null ? void 0 : e.label) || "");
-  }, [e]), P(() => {
-    i && (o && p.length === 0 ? n(!1) : !o && !O && p.length !== 0 && n(!0));
-  }, [i, o, O, p.length]), P(() => {
-    if (o) {
-      const t = _.current;
-      return t && t.addEventListener("scroll", E), () => {
-        t && t.removeEventListener("scroll", E);
+  }, [e]), x(() => {
+    r && m.length === 0 && c(!1);
+  }, [r, m.length]), x(() => {
+    if (r) {
+      const t = N.current;
+      return t && t.addEventListener("scroll", I), () => {
+        t && t.removeEventListener("scroll", I);
       };
     }
-  }, [o, E]);
-  const nt = () => {
-    const t = Dt(Ct.suggestFieldDesktop, "hoverable", z), r = N === void 0 ? ut : N, a = H === void 0 ? gt : H;
-    return /* @__PURE__ */ g("div", { className: t, "data-test-id": c, ...T, ref: L, children: /* @__PURE__ */ q(
-      kt.Provider,
+  }, [r, I]);
+  const et = () => {
+    const t = y === void 0 ? gt : y, o = C === void 0 ? dt : C;
+    return /* @__PURE__ */ w(
+      at,
       {
-        value: { activeDescendant: u, setActiveDescendant: it },
+        "data-test-id": d,
+        status: F,
+        size: S,
+        prefix: K,
+        postfix: /* @__PURE__ */ w(lt.Fragment, { children: [
+          p !== void 0 && /* @__PURE__ */ n(ft, { onClick: tt }),
+          q && /* @__PURE__ */ n(ht, { theme: ut.BRAND, size: S }),
+          Q
+        ] }),
+        ...W,
+        ref: L,
         children: [
-          /* @__PURE__ */ g(
-            r,
+          /* @__PURE__ */ n(
+            t,
             {
-              size: y,
-              status: F,
-              inputValue: m,
-              label: v,
-              placeholder: B,
-              "aria-controls": j.current,
-              "aria-activedescendant": u,
-              loading: G,
-              dropdownOpen: o,
-              onFocus: tt,
-              onBlur: et,
-              onClick: ot,
-              onChange: rt,
-              onClear: st,
-              renderInput: U,
-              renderLabel: V,
-              renderPrefix: W,
-              renderPostfix: X,
-              dataTestId: c
+              value: a,
+              placeholder: _,
+              "data-test-id": d && `${d}${j.Suggest.input}`,
+              ...i,
+              role: "combobox",
+              "aria-controls": M.current,
+              "aria-activedescendant": H,
+              "aria-expanded": r,
+              disabled: F === T.DISABLED,
+              onFocus: Y,
+              onBlur: Z,
+              onClick: v,
+              onChange: P
             }
           ),
-          /* @__PURE__ */ g(
-            a,
+          /* @__PURE__ */ n(bt.Provider, { value: { activeDescendant: H, setActiveDescendant: D }, children: /* @__PURE__ */ n(
+            o,
             {
               value: e,
-              options: p,
-              size: y,
-              listId: j.current,
-              opened: o && p.length > 0,
-              listLoading: J,
-              listRef: _,
-              onSelect: I,
-              renderList: Y,
-              renderListItem: Z,
-              setOpened: n,
+              options: m,
+              size: S,
+              listId: M.current,
+              opened: r && m.length > 0,
+              listLoading: z,
+              listRef: N,
+              onSelect: X,
+              renderList: U,
+              renderListItem: V,
+              setOpened: c,
               targetRef: L,
-              dataTestId: c
+              dataTestId: d
             }
-          )
+          ) })
         ]
       }
-    ) });
+    );
   };
-  return /* @__PURE__ */ q(
-    x,
+  return /* @__PURE__ */ w(
+    R,
     {
-      size: bt.SM,
-      isOpen: !!(Q && i) && F !== St.DISABLED,
+      size: pt.SM,
+      isOpen: !!(J && f) && F !== T.DISABLED,
       toggle: () => {
       },
       targetRef: L,
       disableAdaptiveMode: !0,
       children: [
-        /* @__PURE__ */ g(x.Body, { "data-test-id": c && `${c}${wt.Suggest.tooltip}`, children: K }),
-        /* @__PURE__ */ g(x.Target, { children: nt() })
+        /* @__PURE__ */ n(R.Body, { "data-test-id": d && `${d}${j.Suggest.tooltip}`, children: G }),
+        /* @__PURE__ */ n(R.Target, { children: et() })
       ]
     }
   );
 };
-Et.displayName = "SuggestFieldDesktop";
 export {
-  Et as SuggestFieldDesktop
+  ie as SuggestFieldDesktop
 };
 //# sourceMappingURL=SuggestFieldDesktop.js.map

package/components/SuggestField/desktop/SuggestFieldDesktopDropdown.js

@@ -1,9 +1,8 @@
 import { jsx as m } from "react/jsx-runtime";
-import { Dropdown as $ } from "../../Dropdown/Dropdown.js";
 import "../../Dropdown/DropdownListContext.js";
 import "../../Dropdown/desktop/DropdownDesktop.js";
-import { DropdownList as h } from "../../Dropdown/desktop/DropdownList.js";
-import { D as C } from "../../../chunks/DropdownListItem-C6I9gVRb.js";
+import { DropdownList as $ } from "../../Dropdown/desktop/DropdownList.js";
+import { D as h } from "../../../chunks/DropdownListItem-DzngoNVf.js";
 import "../../Dropdown/mobile/DropdownMobile.js";
 import "../../Dropdown/mobile/DropdownMobileBody.js";
 import "../../Dropdown/mobile/DropdownMobileClose.js";
@@ -15,6 +14,7 @@ import "../../Dropdown/mobile/DropdownMobileList.js";
 import "../../Dropdown/mobile/DropdownMobileListItem.js";
 import "../../Loader/LoaderSmall/LoaderSmall.js";
 import "../../Loader/LoaderMiddle/LoaderMiddle.js";
+import { Dropdown as C } from "../../Dropdown/Dropdown.js";
 import { EVENT_KEY_CODES as L } from "../../../utils/keyboard.js";
 import { DataTestId as d } from "../../../consts/DataTestId.js";
 const _ = [L.ENTER], G = ({
@@ -33,9 +33,9 @@ const _ = [L.ENTER], G = ({
   setOpened: l,
   ...w
 }) => {
-  const S = n === void 0 ? h : n, g = D === void 0 ? C : D;
+  const S = n === void 0 ? $ : n, g = D === void 0 ? h : D;
   return /* @__PURE__ */ m(
-    $,
+    C,
     {
       size: e,
       targetRef: s,

package/components/SuggestField/index.js

@@ -1,17 +1,15 @@
 import { SuggestFieldDesktopDropdown as r } from "./desktop/SuggestFieldDesktopDropdown.js";
 import { SuggestFieldDesktop as g } from "./desktop/SuggestFieldDesktop.js";
-import { SuggestFieldMobile as p } from "./mobile/SuggestFieldMobile.js";
-import { SuggestFieldMobileDropdown as d } from "./mobile/SuggestFieldMobileDropdown.js";
-import { S } from "../../chunks/SuggestFieldMobileDropdownHint-CooicUNx.js";
-import { SuggestFieldMobileTarget as m } from "./mobile/SuggestFieldMobileTarget.js";
-import { SuggestField as x } from "./SuggestField.js";
+import { SuggestFieldMobile as i } from "./mobile/SuggestFieldMobile.js";
+import { SuggestFieldMobileDropdown as l } from "./mobile/SuggestFieldMobileDropdown.js";
+import { S } from "../../chunks/SuggestFieldMobileDropdownHint-CaLnhNmM.js";
+import { SuggestField as m } from "./SuggestField.js";
 export {
-  x as SuggestField,
+  m as SuggestField,
   g as SuggestFieldDesktop,
   r as SuggestFieldDesktopDropdown,
-  p as SuggestFieldMobile,
-  d as SuggestFieldMobileDropdown,
-  S as SuggestFieldMobileDropdownHint,
-  m as SuggestFieldMobileTarget
+  i as SuggestFieldMobile,
+  l as SuggestFieldMobileDropdown,
+  S as SuggestFieldMobileDropdownHint
 };
 //# sourceMappingURL=index.js.map