@sberbusiness/triplex-next 1.1.1 → 1.3.0

package/components/Dropdown/index.js

@@ -1,34 +1,38 @@
 import { Dropdown as e } from "./Dropdown.js";
-import { DropdownList as t } from "./desktop/DropdownList.js";
-import { DropdownDesktop as D } from "./desktop/DropdownDesktop.js";
-import { D as i } from "../../chunks/DropdownListItem-DIIAnvmw.js";
-import { DropdownMobile as w } from "./mobile/DropdownMobile.js";
-import { DropdownMobileBody as x } from "./mobile/DropdownMobileBody.js";
-import { DropdownMobileClose as b } from "./mobile/DropdownMobileClose.js";
-import { DropdownMobileFooter as s } from "./mobile/DropdownMobileFooter.js";
-import { DropdownMobileHeader as E } from "./mobile/DropdownMobileHeader.js";
-import { DropdownMobileInner as a } from "./mobile/DropdownMobileInner.js";
-import { DropdownMobileInput as S } from "./mobile/DropdownMobileInput.js";
-import { DropdownMobileList as g } from "./mobile/DropdownMobileList.js";
-import { DropdownMobileListItem as u } from "./mobile/DropdownMobileListItem.js";
-import { EDropdownAlignment as A, EDropdownDirection as B, EDropdownListSize as C, EDropdownSize as F } from "./enums.js";
+import { DropdownListContext as t } from "./DropdownListContext.js";
+import { DropdownDesktop as d } from "./desktop/DropdownDesktop.js";
+import { DropdownList as i } from "./desktop/DropdownList.js";
+import { D as w } from "../../chunks/DropdownListItem-g0mYNHIW.js";
+import { DropdownMobile as f } from "./mobile/DropdownMobile.js";
+import { DropdownMobileBody as b } from "./mobile/DropdownMobileBody.js";
+import { DropdownMobileClose as s } from "./mobile/DropdownMobileClose.js";
+import { DropdownMobileFooter as E } from "./mobile/DropdownMobileFooter.js";
+import { DropdownMobileHeader as a } from "./mobile/DropdownMobileHeader.js";
+import { DropdownMobileInner as C } from "./mobile/DropdownMobileInner.js";
+import { DropdownMobileInput as c } from "./mobile/DropdownMobileInput.js";
+import { DropdownMobileList as k } from "./mobile/DropdownMobileList.js";
+import { DropdownMobileListItem as y } from "./mobile/DropdownMobileListItem.js";
+import { DropdownMobileLoader as B } from "./mobile/DropdownMobileLoader.js";
+import { EDropdownAlignment as H, EDropdownDirection as h, EDropdownListSize as j, EDropdownSize as q } from "./enums.js";
 export {
   e as Dropdown,
-  D as DropdownDesktop,
-  t as DropdownList,
-  i as DropdownListItem,
-  w as DropdownMobile,
-  x as DropdownMobileBody,
-  b as DropdownMobileClose,
-  s as DropdownMobileFooter,
-  E as DropdownMobileHeader,
-  a as DropdownMobileInner,
-  S as DropdownMobileInput,
-  g as DropdownMobileList,
-  u as DropdownMobileListItem,
-  A as EDropdownAlignment,
-  B as EDropdownDirection,
-  C as EDropdownListSize,
-  F as EDropdownSize
+  d as DropdownDesktop,
+  i as DropdownList,
+  t as DropdownListContext,
+  w as DropdownListItem,
+  f as DropdownMobile,
+  b as DropdownMobileBody,
+  s as DropdownMobileClose,
+  E as DropdownMobileFooter,
+  a as DropdownMobileHeader,
+  C as DropdownMobileInner,
+  c as DropdownMobileInput,
+  k as DropdownMobileList,
+  y as DropdownMobileListItem,
+  B as DropdownMobileLoader,
+  H as EDropdownAlignment,
+  h as EDropdownDirection,
+  j as EDropdownListSize,
+  q as EDropdownSize
 };
 //# sourceMappingURL=index.js.map

package/components/Dropdown/mobile/DropdownMobile.js

@@ -2,7 +2,7 @@ import { jsx as e } from "react/jsx-runtime";
 import a, { useEffect as m } from "react";
 import { OverlayBase as n, EOverlayDirection as c } from "../../Overlay/OverlayBase.js";
 import { DropdownMobileInner as f } from "./DropdownMobileInner.js";
-import { s as p } from "../../../chunks/DropdownMobile.module-BUeZuAYr.js";
+import { s as p } from "../../../chunks/DropdownMobile.module-BBY44sVr.js";
 const r = p.dropdownMobileBodyOverflow, y = a.forwardRef(
   ({ children: t, opened: o, setOpened: s, ...d }, i) => (m(() => (o ? document.body.classList.add(r) : document.body.classList.remove(r), () => document.body.classList.remove(r)), [o]), /* @__PURE__ */ e(n, { setOpened: s, opened: o, direction: c.BOTTOM, children: (l) => /* @__PURE__ */ e(
     f,
@@ -10,7 +10,7 @@ const r = p.dropdownMobileBodyOverflow, y = a.forwardRef(
       ...l,
       ...d,
       ref: i,
-      "data-tx": "1.1.1",
+      "data-tx": "1.3.0",
       children: t
     }
   ) }))

package/components/Dropdown/mobile/DropdownMobileBody.js

@@ -1,7 +1,7 @@
 import { jsx as t } from "react/jsx-runtime";
 import d from "react";
-import { c as m } from "../../../chunks/vendor-D-uL_icH.js";
-import { s as a } from "../../../chunks/DropdownMobile.module-BUeZuAYr.js";
+import { c as m } from "../../../chunks/vendor-CehxOAkM.js";
+import { s as a } from "../../../chunks/DropdownMobile.module-BBY44sVr.js";
 const i = d.forwardRef(
   ({ children: o, className: r, ...e }, s) => /* @__PURE__ */ t("div", { className: m(a.dropdownMobileContent, r), ref: s, ...e, children: o })
 );

package/components/Dropdown/mobile/DropdownMobileClose.js

@@ -2,8 +2,8 @@ import { jsx as o } from "react/jsx-runtime";
 import t from "react";
 import { ButtonIcon as m } from "../../Button/ButtonIcon.js";
 import { CrossStrokeSrvIcon16 as l } from "@sberbusiness/icons-next";
-import { c as p } from "../../../chunks/vendor-D-uL_icH.js";
-import { s as i } from "../../../chunks/DropdownMobile.module-BUeZuAYr.js";
+import { c as p } from "../../../chunks/vendor-CehxOAkM.js";
+import { s as i } from "../../../chunks/DropdownMobile.module-BBY44sVr.js";
 const a = t.forwardRef(
   ({ className: r, ...e }, s) => /* @__PURE__ */ o(m, { className: p(i.dropdownMobileClose, r), ref: s, ...e, children: /* @__PURE__ */ o(l, { paletteIndex: 5 }) })
 );

package/components/Dropdown/mobile/DropdownMobileFooter.js

@@ -1,7 +1,7 @@
 import { jsx as s } from "react/jsx-runtime";
 import m from "react";
-import { c as a } from "../../../chunks/vendor-D-uL_icH.js";
-import { s as i } from "../../../chunks/DropdownMobile.module-BUeZuAYr.js";
+import { c as a } from "../../../chunks/vendor-CehxOAkM.js";
+import { s as i } from "../../../chunks/DropdownMobile.module-BBY44sVr.js";
 const p = m.forwardRef(
   ({ children: o, className: r, ...e }, t) => /* @__PURE__ */ s("div", { className: a(i.dropdownMobileFooter, r), ref: t, ...e, children: o })
 );

package/components/Dropdown/mobile/DropdownMobileHeader.js

@@ -1,7 +1,7 @@
 import { jsxs as i } from "react/jsx-runtime";
 import m from "react";
-import { c as p } from "../../../chunks/vendor-D-uL_icH.js";
-import { s } from "../../../chunks/DropdownMobile.module-BUeZuAYr.js";
+import { c as p } from "../../../chunks/vendor-CehxOAkM.js";
+import { s } from "../../../chunks/DropdownMobile.module-BBY44sVr.js";
 const f = m.forwardRef(
   ({ children: e, className: a, closeButton: r, ...d }, o) => /* @__PURE__ */ i("div", { className: p(s.dropdownMobileHeader, a), ref: o, ...d, children: [
     e,

package/components/Dropdown/mobile/DropdownMobileInner.js

@@ -1,8 +1,8 @@
 import { jsxs as j, jsx as c } from "react/jsx-runtime";
 import y, { useState as l, useEffect as d } from "react";
-import { c as n } from "../../../chunks/vendor-D-uL_icH.js";
+import { c as n } from "../../../chunks/vendor-CehxOAkM.js";
 import { useToken as B } from "../../ThemeProvider/useToken.js";
-import { s as e } from "../../../chunks/DropdownMobile.module-BUeZuAYr.js";
+import { s as e } from "../../../chunks/DropdownMobile.module-BBY44sVr.js";
 const C = y.forwardRef(
   ({
     children: f,

package/components/Dropdown/mobile/DropdownMobileInput.js

@@ -1,12 +1,13 @@
-import { jsx as t } from "react/jsx-runtime";
-import s from "react";
-import { c as e } from "../../../chunks/vendor-D-uL_icH.js";
-import { s as m } from "../../../chunks/DropdownMobile.module-BUeZuAYr.js";
-const a = s.forwardRef(
-  ({ className: o, ...r }, p) => /* @__PURE__ */ t("input", { className: e(m.dropdownMobileInput, o), ...r, ref: p })
+import { jsx as n } from "react/jsx-runtime";
+import r from "react";
+import { c as e } from "../../../chunks/vendor-CehxOAkM.js";
+const d = "dropdownMobileInput__b294cce0", i = {
+  dropdownMobileInput: d
+}, l = r.forwardRef(
+  ({ className: o, ...p }, t) => /* @__PURE__ */ n("input", { className: e(i.dropdownMobileInput, o), ...p, ref: t })
 );
-a.displayName = "DropdownMobileInput";
+l.displayName = "DropdownMobileInput";
 export {
-  a as DropdownMobileInput
+  l as DropdownMobileInput
 };
 //# sourceMappingURL=DropdownMobileInput.js.map

package/components/Dropdown/mobile/DropdownMobileList.js

@@ -1,21 +1,30 @@
-import { jsx as t } from "react/jsx-runtime";
-import e from "react";
-import { c as l } from "../../../chunks/vendor-D-uL_icH.js";
-import { s as m } from "../../../chunks/DropdownMobile.module-BUeZuAYr.js";
-const a = e.forwardRef(
-  ({ children: o, className: r, ...s }, i) => /* @__PURE__ */ t(
-    "div",
-    {
-      className: l(m.dropdownMobileList, r),
-      ref: i,
-      role: "listbox",
-      ...s,
-      children: o
-    }
-  )
+import { jsxs as l, jsx as o } from "react/jsx-runtime";
+import a from "react";
+import { c as p } from "../../../chunks/vendor-CehxOAkM.js";
+import { DropdownMobileListItem as n } from "./DropdownMobileListItem.js";
+import { LoaderSmall as f } from "../../Loader/LoaderSmall/LoaderSmall.js";
+import { ELoaderSmallTheme as c } from "../../Loader/LoaderSmall/enum.js";
+import "../../Loader/LoaderMiddle/LoaderMiddle.js";
+import { EComponentSize as L } from "../../../enums/EComponentSize.js";
+import { s as r } from "../../../chunks/DropdownMobile.module-BBY44sVr.js";
+const b = a.forwardRef(
+  ({ children: e, className: i, loading: m, ...t }, s) => {
+    const d = () => /* @__PURE__ */ o(n, { id: "dropdown-mobile-list-loader-item", children: /* @__PURE__ */ o(
+      f,
+      {
+        className: r.dropdownMobileListLoader,
+        theme: c.BRAND,
+        size: L.MD
+      }
+    ) });
+    return /* @__PURE__ */ l("div", { className: p(r.dropdownMobileList, i), role: "listbox", ...t, ref: s, children: [
+      e,
+      m && d()
+    ] });
+  }
 );
-a.displayName = "DropdownMobileList";
+b.displayName = "DropdownMobileList";
 export {
-  a as DropdownMobileList
+  b as DropdownMobileList
 };
 //# sourceMappingURL=DropdownMobileList.js.map

package/components/Dropdown/mobile/DropdownMobileListItem.js

@@ -1,9 +1,9 @@
 import { jsx as f } from "react/jsx-runtime";
 import l from "react";
-import { c as x } from "../../../chunks/vendor-D-uL_icH.js";
+import { c as x } from "../../../chunks/vendor-CehxOAkM.js";
 import { Text as w } from "../../Typography/Text.js";
 import { ETextSize as b } from "../../Typography/enums.js";
-import { s } from "../../../chunks/DropdownMobile.module-BUeZuAYr.js";
+import { s } from "../../../chunks/DropdownMobile.module-BBY44sVr.js";
 const y = l.forwardRef(
   ({ children: o, className: e, id: B, onClick: t, onSelect: r, selected: i, ...m }, a) => {
     const p = (d) => {

package/components/Dropdown/mobile/DropdownMobileLoader.js

@@ -0,0 +1,20 @@
+import { jsx as m } from "react/jsx-runtime";
+import { c as e } from "../../../chunks/vendor-CehxOAkM.js";
+import { LoaderSmall as t } from "../../Loader/LoaderSmall/LoaderSmall.js";
+import { ELoaderSmallTheme as i } from "../../Loader/LoaderSmall/enum.js";
+import "../../Loader/LoaderMiddle/LoaderMiddle.js";
+import { EComponentSize as p } from "../../../enums/EComponentSize.js";
+import { s } from "../../../chunks/DropdownMobile.module-BBY44sVr.js";
+const x = ({ className: o, ...r }) => /* @__PURE__ */ m(
+  t,
+  {
+    className: e(s.dropdownMobileLoader, o),
+    theme: i.BRAND,
+    size: p.MD,
+    ...r
+  }
+);
+export {
+  x as DropdownMobileLoader
+};
+//# sourceMappingURL=DropdownMobileLoader.js.map

package/components/Dropdown/mobile/index.js

@@ -1,21 +1,23 @@
 import { DropdownMobile as e } from "./DropdownMobile.js";
 import { DropdownMobileBody as t } from "./DropdownMobileBody.js";
-import { DropdownMobileClose as d } from "./DropdownMobileClose.js";
+import { DropdownMobileClose as n } from "./DropdownMobileClose.js";
 import { DropdownMobileFooter as l } from "./DropdownMobileFooter.js";
 import { DropdownMobileHeader as b } from "./DropdownMobileHeader.js";
 import { DropdownMobileInner as w } from "./DropdownMobileInner.js";
 import { DropdownMobileInput as D } from "./DropdownMobileInput.js";
 import { DropdownMobileList as s } from "./DropdownMobileList.js";
 import { DropdownMobileListItem as L } from "./DropdownMobileListItem.js";
+import { DropdownMobileLoader as u } from "./DropdownMobileLoader.js";
 export {
   e as DropdownMobile,
   t as DropdownMobileBody,
-  d as DropdownMobileClose,
+  n as DropdownMobileClose,
   l as DropdownMobileFooter,
   b as DropdownMobileHeader,
   w as DropdownMobileInner,
   D as DropdownMobileInput,
   s as DropdownMobileList,
-  L as DropdownMobileListItem
+  L as DropdownMobileListItem,
+  u as DropdownMobileLoader
 };
 //# sourceMappingURL=index.js.map

package/components/Ellipsis/Ellipsis.js

@@ -0,0 +1,27 @@
+import { jsx as a } from "react/jsx-runtime";
+import t from "react";
+import { c } from "../../chunks/vendor-CehxOAkM.js";
+const m = "ellipsisLineClamp__686558cb", r = "oneLine__75487c73", e = {
+  ellipsisLineClamp: m,
+  oneLine: r
+}, L = t.forwardRef(
+  ({ children: i, maxLines: s, className: l, ...n }, o) => {
+    const p = c(e.ellipsisLineClamp, { [e.oneLine]: s === 1 }, l);
+    return /* @__PURE__ */ a(
+      "div",
+      {
+        className: p,
+        style: { "--ellipsis-line-clamp": s },
+        ...n,
+        "data-tx": "1.3.0",
+        ref: o,
+        children: i
+      }
+    );
+  }
+);
+L.displayName = "Ellipsis";
+export {
+  L as Ellipsis
+};
+//# sourceMappingURL=Ellipsis.js.map

package/components/Ellipsis/index.js

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

package/components/ExpandAnimation/ExpandAnimation.js

@@ -0,0 +1,72 @@
+import { jsx as g } from "react/jsx-runtime";
+import U, { useRef as y } from "react";
+import { w as b, c as j } from "../../chunks/vendor-CehxOAkM.js";
+const F = "expandAnimation__fa8dcc20", I = {
+  expandAnimation: F
+}, L = 300, M = U.forwardRef(
+  ({
+    children: A,
+    className: E,
+    expanded: v,
+    animationTime: x = L,
+    style: R,
+    onStart: l,
+    onEnd: h,
+    transitionProps: e,
+    ...w
+  }, f) => {
+    const m = y({
+      entering: { height: void 0, overflow: "hidden" },
+      entered: {},
+      exiting: { height: 0, overflow: "hidden" },
+      exited: { height: 0, overflow: "hidden", visibility: "hidden" },
+      unmounted: {}
+    }), d = y(null), _ = (c) => {
+      var u;
+      d.current && (m.current.entering.height = d.current.scrollHeight), l == null || l(), (u = e == null ? void 0 : e.onEnter) == null || u.call(e, c);
+    }, H = (c) => {
+      var u;
+      h == null || h(), (u = e == null ? void 0 : e.onEntered) == null || u.call(e, c);
+    }, T = () => {
+      var c;
+      d.current && (d.current.style.height = d.current.scrollHeight + "px", d.current.scrollHeight), l == null || l(), (c = e == null ? void 0 : e.onExit) == null || c.call(e);
+    }, D = () => {
+      var c;
+      h == null || h(), (c = e == null ? void 0 : e.onExited) == null || c.call(e);
+    }, N = (c) => {
+      d.current = c, typeof f == "function" ? f(c) : f && (f.current = c);
+    };
+    return /* @__PURE__ */ g(
+      b,
+      {
+        in: v,
+        timeout: x,
+        nodeRef: d,
+        ...e,
+        onEnter: _,
+        onEntered: H,
+        onExit: T,
+        onExited: D,
+        children: (c) => /* @__PURE__ */ g(
+          "div",
+          {
+            className: j(I.expandAnimation, E),
+            style: {
+              transitionDuration: x + "ms",
+              ...m.current[c],
+              ...R
+            },
+            ...w,
+            ref: N,
+            children: A
+          }
+        )
+      }
+    );
+  }
+);
+M.displayName = "ExpandAnimation";
+export {
+  M as ExpandAnimation
+};
+//# sourceMappingURL=ExpandAnimation.js.map

package/components/Footer/Footer.js

@@ -1,8 +1,8 @@
 import { jsx as m } from "react/jsx-runtime";
 import a from "react";
 import { FooterDescription as p } from "./components/FooterDescription.js";
-import { c } from "../../chunks/vendor-D-uL_icH.js";
-import { s as o } from "../../chunks/Footer.module-BFo05t5_.js";
+import { c } from "../../chunks/vendor-CehxOAkM.js";
+import { s as o } from "../../chunks/Footer.module-4a0n1yRR.js";
 import "./components/FooterDescriptionControls.js";
 import "./components/FooterDescriptionContent.js";
 const f = Object.assign(
@@ -12,7 +12,7 @@ const f = Object.assign(
       {
         className: c(o.footer, { [o.sticky]: !!e }, r),
         ...i,
-        "data-tx": "1.1.1",
+        "data-tx": "1.3.0",
         ref: s,
         children: t
       }

package/components/Footer/components/FooterDescription.js

@@ -2,8 +2,8 @@ import { jsx as i } from "react/jsx-runtime";
 import s from "react";
 import { FooterDescriptionContent as n } from "./FooterDescriptionContent.js";
 import { FooterDescriptionControls as m } from "./FooterDescriptionControls.js";
-import { c as p } from "../../../chunks/vendor-D-uL_icH.js";
-import { s as c } from "../../../chunks/Footer.module-BFo05t5_.js";
+import { c as p } from "../../../chunks/vendor-CehxOAkM.js";
+import { s as c } from "../../../chunks/Footer.module-4a0n1yRR.js";
 const f = Object.assign(
   s.forwardRef(function({ children: o, className: t, ...r }, e) {
     return /* @__PURE__ */ i("div", { className: p(c.footerDescription, t), ...r, ref: e, children: o });

package/components/Footer/components/FooterDescriptionContent.js

@@ -1,7 +1,7 @@
 import { jsx as s } from "react/jsx-runtime";
 import i from "react";
-import { c as m } from "../../../chunks/vendor-D-uL_icH.js";
-import { s as n } from "../../../chunks/Footer.module-BFo05t5_.js";
+import { c as m } from "../../../chunks/vendor-CehxOAkM.js";
+import { s as n } from "../../../chunks/Footer.module-4a0n1yRR.js";
 const a = i.forwardRef(
   ({ children: o, className: t, ...r }, e) => /* @__PURE__ */ s("div", { className: m(n.footerDescriptionContent, t), ...r, ref: e, children: o })
 );

package/components/Footer/components/FooterDescriptionControls.js

@@ -1,7 +1,7 @@
 import { jsx as e } from "react/jsx-runtime";
 import i from "react";
-import { c as m } from "../../../chunks/vendor-D-uL_icH.js";
-import { s as a } from "../../../chunks/Footer.module-BFo05t5_.js";
+import { c as m } from "../../../chunks/vendor-CehxOAkM.js";
+import { s as a } from "../../../chunks/Footer.module-4a0n1yRR.js";
 const p = i.forwardRef(
   ({ children: o, className: r, ...t }, s) => /* @__PURE__ */ e("div", { className: m(a.footerDescriptionControls, r), ...t, ref: s, children: o })
 );

package/components/FormField/FormField.js

@@ -2,76 +2,77 @@ import { jsx as n } from "react/jsx-runtime";
 import { useState as e } from "react";
 import { FormFieldContext as G } from "./FormFieldContext.js";
 import { TARGET_PADDING_X_DEFAULT as _ } from "./consts.js";
-import { c as I } from "../../chunks/vendor-D-uL_icH.js";
-import { EFormFieldSize as N, EFormFieldStatus as r } from "./enums.js";
-const P = "formField__f184f1b5", S = "disabled__ca621c01", T = "active__cd1330d0", L = "error__f645fb4b", u = "warning__7440000e", i = {
+import { c as I } from "../../chunks/vendor-CehxOAkM.js";
+import { EFormFieldStatus as r } from "./enums.js";
+import { EComponentSize as N } from "../../enums/EComponentSize.js";
+const P = "formField__7246a7cc", S = "disabled__6740a811", T = "active__85b7dacc", L = "error__e2fc7f0f", u = "warning__cea6790e", i = {
   formField: P,
   disabled: S,
   active: T,
   error: L,
   warning: u,
-  "size-sm": "size-sm__7fca3bb8",
-  "size-md": "size-md__fdf39150",
-  "size-lg": "size-lg__fed542e3"
-}, O = ({
-  children: F,
-  className: p,
+  "size-sm": "size-sm__9630bcf7",
+  "size-md": "size-md__8548c27f",
+  "size-lg": "size-lg__1b21a350"
+}, V = ({
+  children: p,
+  className: F,
   status: t = r.DEFAULT,
-  onMouseEnter: d,
-  onMouseLeave: s,
+  onMouseEnter: s,
+  onMouseLeave: o,
   style: x,
-  size: o = N.LG,
-  ...b
+  size: c = N.LG,
+  ...g
 }) => {
-  const [f, g] = e(!1), [h, l] = e(!1), [v, E] = e(""), [a, z] = e(_), [m, A] = e(_), [D, R] = e(!1), W = (c) => {
-    l(!0), d == null || d(c);
-  }, w = (c) => {
-    l(!1), s == null || s(c);
+  const [a, h] = e(!1), [v, l] = e(!1), [b, z] = e(""), [m, E] = e(_), [f, A] = e(_), [D, R] = e(!1), W = (d) => {
+    l(!0), s == null || s(d);
+  }, w = (d) => {
+    l(!1), o == null || o(d);
   };
   return /* @__PURE__ */ n(
     G.Provider,
     {
       value: {
         status: t,
-        focused: f,
-        hovered: h,
-        id: v,
-        postfixWidth: a,
-        prefixWidth: m,
-        setFocused: g,
-        setId: E,
-        setPostfixWidth: z,
+        focused: a,
+        hovered: v,
+        id: b,
+        postfixWidth: m,
+        prefixWidth: f,
+        setFocused: h,
+        setId: z,
+        setPostfixWidth: E,
         setPrefixWidth: A,
         setValueExist: R,
         valueExist: D,
-        size: o
+        size: c
       },
       children: /* @__PURE__ */ n(
         "div",
         {
           className: I(
             i.formField,
+            i[`size-${c}`],
             {
-              [i.active]: f,
+              [i.active]: a,
               [i.disabled]: t === r.DISABLED,
               [i.error]: t === r.ERROR,
-              [i.warning]: t === r.WARNING,
-              [i[`size-${o}`]]: o
+              [i.warning]: t === r.WARNING
             },
-            p
+            F
           ),
           onMouseEnter: W,
           onMouseLeave: w,
-          "data-tx": "1.1.1",
-          style: { paddingLeft: m, paddingRight: a, ...x },
-          ...b,
-          children: F
+          "data-tx": "1.3.0",
+          style: { paddingLeft: f, paddingRight: m, ...x },
+          ...g,
+          children: p
         }
       )
     }
   );
 };
 export {
-  O as FormField
+  V as FormField
 };
 //# sourceMappingURL=FormField.js.map

package/components/FormField/FormFieldContext.js

@@ -1,7 +1,8 @@
 import t from "react";
-import { EFormFieldSize as e, EFormFieldStatus as i } from "./enums.js";
-const s = {
-  status: i.DEFAULT,
+import { EFormFieldStatus as e } from "./enums.js";
+import { EComponentSize as i } from "../../enums/EComponentSize.js";
+const o = {
+  status: e.DEFAULT,
   focused: !1,
   hovered: !1,
   id: "",
@@ -18,10 +19,10 @@ const s = {
   setValueExist: () => {
   },
   valueExist: !1,
-  size: e.MD
-}, r = t.createContext(s);
+  size: i.MD
+}, f = t.createContext(o);
 export {
-  r as FormFieldContext,
-  s as initialFormFieldContext
+  f as FormFieldContext,
+  o as initialFormFieldContext
 };
 //# sourceMappingURL=FormFieldContext.js.map

package/components/FormField/components/FormFieldClear.js

@@ -1,30 +1,34 @@
-import { jsx as r } from "react/jsx-runtime";
-import u, { useContext as h } from "react";
-import { CrossStrokeSrvIcon16 as x } from "@sberbusiness/icons-next";
-import { FormFieldContext as C } from "../FormFieldContext.js";
-import { c as _ } from "../../../chunks/vendor-D-uL_icH.js";
-import { EFormFieldStatus as w } from "../enums.js";
-const S = "formFieldClear__9b77c9e7", v = "shown__7f437f57", t = {
-  formFieldClear: S,
-  shown: v
-}, y = u.forwardRef(
-  ({ className: s, onClick: e, ...l }, m) => {
-    const { status: a, focused: n, hovered: c, id: d, valueExist: f } = h(C), i = (p) => {
-      const o = document.querySelector(`#${d}`);
-      o && o.focus(), e == null || e(p);
-    }, F = _(
+import { jsx as o } from "react/jsx-runtime";
+import c, { useContext as p } from "react";
+import { CrossStrokeSrvIcon16 as F } from "@sberbusiness/icons-next";
+import { FormFieldContext as h } from "../FormFieldContext.js";
+import { EFormFieldStatus as C } from "../enums.js";
+import { c as u } from "../../../chunks/vendor-CehxOAkM.js";
+import "../../Button/Button.js";
+import "../../Button/ButtonBase.js";
+import { ButtonIcon as x } from "../../Button/ButtonIcon.js";
+import "../../Button/ButtonDropdown.js";
+import "../../Button/ButtonDropdownExtended.js";
+const _ = "formFieldClear__42386ff9", v = "hidden__a320fb9d", t = {
+  formFieldClear: _,
+  hidden: v
+}, I = c.forwardRef(
+  ({ className: m, onMouseDown: r, ...l }, d) => {
+    const { status: i, focused: a, hovered: s, valueExist: f } = p(h), n = u(
       t.formFieldClear,
       "hoverable",
       {
-        [t.shown]: f && a !== w.DISABLED && (n || c)
+        [t.hidden]: !f || i === C.DISABLED || !(a || s)
       },
-      s
+      m
     );
-    return /* @__PURE__ */ r("span", { className: F, ref: m, onClick: i, ...l, children: /* @__PURE__ */ r(x, { paletteIndex: 5 }) });
+    return /* @__PURE__ */ o(x, { className: n, onMouseDown: (e) => {
+      e.preventDefault(), r == null || r(e);
+    }, ...l, ref: d, children: /* @__PURE__ */ o(F, { paletteIndex: 5 }) });
   }
 );
-y.displayName = "FormFieldClear";
+I.displayName = "FormFieldClear";
 export {
-  y as FormFieldClear
+  I as FormFieldClear
 };
 //# sourceMappingURL=FormFieldClear.js.map