@sberbusiness/triplex-next 0.1.8 → 0.10.0

package/components/Ellipsis/Ellipsis.js

@@ -0,0 +1,27 @@
+import { jsx as a } from "react/jsx-runtime";
+import t from "react";
+import { c as m } from "../../chunks/vendor-BlJo2ILB.js";
+const c = "ellipsisLineClamp__7c0259dd", r = "oneLine__dd3d53fd", i = {
+  ellipsisLineClamp: c,
+  oneLine: r
+}, d = t.forwardRef(
+  ({ children: e, maxLines: s, className: l, ...n }, o) => {
+    const p = m(i.ellipsisLineClamp, { [i.oneLine]: s === 1 }, l);
+    return /* @__PURE__ */ a(
+      "div",
+      {
+        className: p,
+        style: { "--ellipsis-line-clamp": s },
+        ...n,
+        "data-tx": "0.10.0",
+        ref: o,
+        children: e
+      }
+    );
+  }
+);
+d.displayName = "Ellipsis";
+export {
+  d 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 N, { useRef as A } from "react";
+import { A as U, c as j } from "../../chunks/vendor-BlJo2ILB.js";
+const F = "expandAnimation__fd23bbe7", I = {
+  expandAnimation: F
+}, L = 300, M = N.forwardRef(
+  ({
+    children: y,
+    className: E,
+    expanded: v,
+    animationTime: f = L,
+    style: R,
+    onStart: l,
+    onEnd: h,
+    transitionProps: e,
+    ...w
+  }, x) => {
+    const m = A({
+      entering: { height: void 0, overflow: "hidden" },
+      entered: {},
+      exiting: { height: 0, overflow: "hidden" },
+      exited: { height: 0, overflow: "hidden", visibility: "hidden" },
+      unmounted: {}
+    }), d = A(null), b = (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);
+    }, _ = () => {
+      var c;
+      h == null || h(), (c = e == null ? void 0 : e.onExited) == null || c.call(e);
+    }, D = (c) => {
+      d.current = c, typeof x == "function" ? x(c) : x && (x.current = c);
+    };
+    return /* @__PURE__ */ g(
+      U,
+      {
+        in: v,
+        timeout: f,
+        nodeRef: d,
+        ...e,
+        onEnter: b,
+        onEntered: H,
+        onExit: T,
+        onExited: _,
+        children: (c) => /* @__PURE__ */ g(
+          "div",
+          {
+            className: j(I.expandAnimation, E),
+            style: {
+              transitionDuration: f + "ms",
+              ...m.current[c],
+              ...R
+            },
+            ...w,
+            ref: D,
+            children: y
+          }
+        )
+      }
+    );
+  }
+);
+M.displayName = "ExpandAnimation";
+export {
+  M as ExpandAnimation
+};
+//# sourceMappingURL=ExpandAnimation.js.map

package/components/Footer/Footer.js

@@ -1,29 +1,18 @@
-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-CF2m175I.js";
-import { s as o } from "../../chunks/Footer.module-CqUuM-TN.js";
+import { jsx as i } from "react/jsx-runtime";
+import e from "react";
+import { FooterDescription as m } from "./components/FooterDescription.js";
 import "./components/FooterDescriptionControls.js";
 import "./components/FooterDescriptionContent.js";
-const f = Object.assign(
-  a.forwardRef(function({ children: t, className: r, sticky: e, ...i }, s) {
-    return /* @__PURE__ */ m(
-      "div",
-      {
-        className: c(o.footer, { [o.sticky]: !!e }, r),
-        ...i,
-        "data-tx": "0.1.8",
-        ref: s,
-        children: t
-      }
-    );
+const p = Object.assign(
+  e.forwardRef(function({ children: o, ...r }, t) {
+    return /* @__PURE__ */ i("div", { ...r, "data-tx": "0.10.0", ref: t, children: o });
   }),
   {
-    Description: p
+    Description: m
   }
 );
-f.displayName = "Footer";
+p.displayName = "Footer";
 export {
-  f as Footer
+  p as Footer
 };
 //# sourceMappingURL=Footer.js.map

package/components/Footer/components/FooterDescription.js

@@ -2,11 +2,11 @@ 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-CF2m175I.js";
-import { s as c } from "../../../chunks/Footer.module-CqUuM-TN.js";
+import { c as p } from "../../../chunks/vendor-BlJo2ILB.js";
+import { s as c } from "../../../chunks/Footer.module-BZTAlpWH.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 });
+  s.forwardRef(function({ children: o, className: r, ...t }, e) {
+    return /* @__PURE__ */ i("div", { className: p(c.footerDescription, r), ...t, ref: e, children: o });
   }),
   {
     Content: n,

package/components/Footer/components/FooterDescriptionContent.js

@@ -1,12 +1,12 @@
 import { jsx as s } from "react/jsx-runtime";
 import i from "react";
-import { c as m } from "../../../chunks/vendor-CF2m175I.js";
-import { s as n } from "../../../chunks/Footer.module-CqUuM-TN.js";
-const a = i.forwardRef(
+import { c as m } from "../../../chunks/vendor-BlJo2ILB.js";
+import { s as n } from "../../../chunks/Footer.module-BZTAlpWH.js";
+const p = i.forwardRef(
   ({ children: o, className: t, ...r }, e) => /* @__PURE__ */ s("div", { className: m(n.footerDescriptionContent, t), ...r, ref: e, children: o })
 );
-a.displayName = "FooterDescriptionContent";
+p.displayName = "FooterDescriptionContent";
 export {
-  a as FooterDescriptionContent
+  p as FooterDescriptionContent
 };
 //# sourceMappingURL=FooterDescriptionContent.js.map

package/components/Footer/components/FooterDescriptionControls.js

@@ -1,12 +1,12 @@
 import { jsx as e } from "react/jsx-runtime";
 import i from "react";
-import { c as m } from "../../../chunks/vendor-CF2m175I.js";
-import { s as a } from "../../../chunks/Footer.module-CqUuM-TN.js";
-const p = i.forwardRef(
-  ({ children: o, className: r, ...t }, s) => /* @__PURE__ */ e("div", { className: m(a.footerDescriptionControls, r), ...t, ref: s, children: o })
+import { c as m } from "../../../chunks/vendor-BlJo2ILB.js";
+import { s as p } from "../../../chunks/Footer.module-BZTAlpWH.js";
+const a = i.forwardRef(
+  ({ children: o, className: r, ...s }, t) => /* @__PURE__ */ e("div", { className: m(p.footerDescriptionControls, r), ...s, ref: t, children: o })
 );
-p.displayName = "FooterDescriptionControls";
+a.displayName = "FooterDescriptionControls";
 export {
-  p as FooterDescriptionControls
+  a as FooterDescriptionControls
 };
 //# sourceMappingURL=FooterDescriptionControls.js.map

package/components/FormField/FormField.js

@@ -1,70 +1,72 @@
-import { jsx as m } from "react/jsx-runtime";
+import { jsx as n } from "react/jsx-runtime";
 import { useState as e } from "react";
-import { FormFieldContext as E } from "./FormFieldContext.js";
+import { c as G } from "../../chunks/vendor-BlJo2ILB.js";
+import { FormFieldContext as I } from "./FormFieldContext.js";
 import { TARGET_PADDING_X_DEFAULT as _ } from "./consts.js";
-import { c as G } from "../../chunks/vendor-CF2m175I.js";
-import { EFormFieldSize as T } from "./enums.js";
-const y = "formField__25be82ce", I = "disabled__326d875b", N = "active__98fdfa71", R = "error__2cc2ae2a", t = {
-  formField: y,
-  disabled: I,
-  active: N,
-  error: R,
-  "size-sm": "size-sm__a6edd3c2",
-  "size-md": "size-md__285f1472",
-  "size-lg": "size-lg__cfb64eea"
+import { EFormFieldStatus as r } from "./enums.js";
+import { EComponentSize as N } from "../../enums/EComponentSize.js";
+const P = "formField__5e9a8885", S = "disabled__44b08295", T = "active__d43d990b", L = "error__9f9ee550", u = "warning__fdbda0a3", i = {
+  formField: P,
+  disabled: S,
+  active: T,
+  error: L,
+  warning: u,
+  "size-sm": "size-sm__1d215670",
+  "size-md": "size-md__c30cf193",
+  "size-lg": "size-lg__459bdf9d"
 }, V = ({
-  children: n,
+  children: p,
   className: F,
-  disabled: r,
-  error: p,
-  onMouseEnter: s,
-  onMouseLeave: i,
+  status: t = r.DEFAULT,
+  onMouseEnter: d,
+  onMouseLeave: s,
   style: x,
-  size: o = T.LG,
-  ...h
+  size: a = N.LG,
+  ...g
 }) => {
-  const [a, v] = e(!1), [b, l] = e(!1), [z, g] = e(""), [c, u] = e(_), [f, P] = e(_), [W, A] = e(!1), B = (d) => {
-    l(!0), s == null || s(d);
-  }, D = (d) => {
-    l(!1), i == null || i(d);
+  const [c, h] = e(!1), [b, l] = e(!1), [v, z] = e(""), [m, E] = e(_), [f, A] = e(_), [D, R] = e(!1), W = (o) => {
+    l(!0), d == null || d(o);
+  }, w = (o) => {
+    l(!1), s == null || s(o);
   };
-  return /* @__PURE__ */ m(
-    E.Provider,
+  return /* @__PURE__ */ n(
+    I.Provider,
     {
       value: {
-        disabled: !!r,
-        focused: a,
+        status: t,
+        focused: c,
         hovered: b,
-        id: z,
-        postfixWidth: c,
+        id: v,
+        postfixWidth: m,
         prefixWidth: f,
-        setFocused: v,
-        setId: g,
-        setPostfixWidth: u,
-        setPrefixWidth: P,
-        setValueExist: A,
-        valueExist: W,
-        size: o
+        setFocused: h,
+        setId: z,
+        setPostfixWidth: E,
+        setPrefixWidth: A,
+        setValueExist: R,
+        valueExist: D,
+        size: a
       },
-      children: /* @__PURE__ */ m(
+      children: /* @__PURE__ */ n(
         "div",
         {
           className: G(
-            t.formField,
+            i.formField,
+            i[`size-${a}`],
             {
-              [t.active]: a,
-              [t.disabled]: !!r,
-              [t.error]: !!p,
-              [t[`size-${o}`]]: o
+              [i.active]: c,
+              [i.disabled]: t === r.DISABLED,
+              [i.error]: t === r.ERROR,
+              [i.warning]: t === r.WARNING
             },
             F
           ),
-          onMouseEnter: B,
-          onMouseLeave: D,
-          "data-tx": "0.1.8",
-          style: { paddingLeft: f, paddingRight: c, ...x },
-          ...h,
-          children: n
+          onMouseEnter: W,
+          onMouseLeave: w,
+          "data-tx": "0.10.0",
+          style: { paddingLeft: f, paddingRight: m, ...x },
+          ...g,
+          children: p
         }
       )
     }

package/components/FormField/FormFieldContext.js

@@ -1,7 +1,8 @@
-import e from "react";
-import { EFormFieldSize as t } from "./enums.js";
-const i = {
-  disabled: !1,
+import t from "react";
+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 i = {
   setValueExist: () => {
   },
   valueExist: !1,
-  size: t.MD
-}, d = e.createContext(i);
+  size: i.MD
+}, f = t.createContext(o);
 export {
-  d as FormFieldContext,
-  i as initialFormFieldContext
+  f as FormFieldContext,
+  o as initialFormFieldContext
 };
 //# sourceMappingURL=FormFieldContext.js.map

package/components/FormField/components/FormFieldClear.js

@@ -1,29 +1,30 @@
-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-CF2m175I.js";
-const w = "formFieldClear__99892b34", b = "shown__e1bf9934", s = {
-  formFieldClear: w,
-  shown: b
-}, v = u.forwardRef(
-  ({ className: t, onClick: e, ...l }, a) => {
-    const { disabled: m, focused: d, hovered: n, id: c, valueExist: i } = h(C), f = (F) => {
-      const o = document.querySelector(`#${c}`);
-      o && o.focus(), e == null || e(F);
-    }, p = _(
-      s.formFieldClear,
+import { jsx as o } from "react/jsx-runtime";
+import n, { useContext as c } from "react";
+import { c as f } from "../../../chunks/vendor-BlJo2ILB.js";
+import { CrossStrokeSrvIcon16 as F } from "@sberbusiness/icons-next";
+import { FormFieldContext as p } from "../FormFieldContext.js";
+import { EFormFieldStatus as C } from "../enums.js";
+import { ButtonIcon as h } from "../../Button/ButtonIcon.js";
+const x = "formFieldClear__19ba830b", u = "hidden__fc4a2b4e", t = {
+  formFieldClear: x,
+  hidden: u
+}, b = n.forwardRef(
+  ({ className: l, onMouseDown: e, ...a }, m) => {
+    const { status: s, valueExist: d } = c(p), i = f(
+      t.formFieldClear,
       "hoverable",
       {
-        [s.shown]: i && !m && (d || n)
+        [t.hidden]: !d || s === C.DISABLED
       },
-      t
+      l
     );
-    return /* @__PURE__ */ r("span", { className: p, ref: a, onClick: f, ...l, children: /* @__PURE__ */ r(x, { paletteIndex: 5 }) });
+    return /* @__PURE__ */ o(h, { className: i, onMouseDown: (r) => {
+      r.preventDefault(), e == null || e(r);
+    }, ...a, ref: m, children: /* @__PURE__ */ o(F, { paletteIndex: 5 }) });
   }
 );
-v.displayName = "FormFieldClear";
+b.displayName = "FormFieldClear";
 export {
-  v as FormFieldClear
+  b as FormFieldClear
 };
 //# sourceMappingURL=FormFieldClear.js.map

package/components/FormField/components/FormFieldCounter.js

@@ -1,13 +1,13 @@
 import { jsx as r } from "react/jsx-runtime";
 import { useContext as i, useEffect as m } from "react";
 import { FormFieldDescriptionContext as n } from "../FormFieldDescriptionContext.js";
-const s = "formFieldCounter__1581be28", u = {
+const s = "formFieldCounter__958c1b66", u = {
   formFieldCounter: s
-}, l = ({ children: e, ...o }) => {
+}, l = ({ children: o, ...e }) => {
   const { setWithCounter: t } = i(n);
   return m(() => {
     t(!0);
-  }, []), /* @__PURE__ */ r("div", { className: u.formFieldCounter, ...o, children: e });
+  }, []), /* @__PURE__ */ r("div", { className: u.formFieldCounter, ...e, children: o });
 };
 l.displayName = "FormFieldCounter";
 export {

package/components/FormField/components/FormFieldDescription.js

@@ -1,16 +1,16 @@
 import { jsx as t } from "react/jsx-runtime";
 import { useState as n } from "react";
-import { c } from "../../../chunks/vendor-CF2m175I.js";
+import { c } from "../../../chunks/vendor-BlJo2ILB.js";
 import { FormFieldDescriptionContext as m } from "../FormFieldDescriptionContext.js";
-const l = "formFieldDescription__9ff53f67", p = "withCounter__a4746c72", i = {
+const l = "formFieldDescription__ee783318", p = "withCounter__47c006f4", e = {
   formFieldDescription: l,
   withCounter: p
-}, f = ({ children: r, ...e }) => {
+}, d = ({ children: i, ...r }) => {
   const [o, s] = n(!1);
-  return /* @__PURE__ */ t(m.Provider, { value: { withCounter: o, setWithCounter: s }, children: /* @__PURE__ */ t("div", { className: c(i.formFieldDescription, { [i.withCounter]: o }), ...e, children: r }) });
+  return /* @__PURE__ */ t(m.Provider, { value: { withCounter: o, setWithCounter: s }, children: /* @__PURE__ */ t("div", { className: c(e.formFieldDescription, { [e.withCounter]: o }), ...r, children: i }) });
 };
-f.displayName = "FormFieldDescription";
+d.displayName = "FormFieldDescription";
 export {
-  f as FormFieldDescription
+  d as FormFieldDescription
 };
 //# sourceMappingURL=FormFieldDescription.js.map

package/components/FormField/components/FormFieldInput.js

@@ -1,9 +1,11 @@
 import "react/jsx-runtime";
 import "react";
 import "../FormFieldContext.js";
-import "../../../chunks/vendor-CF2m175I.js";
-import { F } from "../../../chunks/FormFieldInput-Ki1-hI2O.js";
+import "../../../chunks/vendor-BlJo2ILB.js";
+import { F as a } from "../../../chunks/FormFieldInput-BoG8X8Sc.js";
+import "../enums.js";
+import "../../../utils/classNameMaps.js";
 export {
-  F as FormFieldInput
+  a as FormFieldInput
 };
 //# sourceMappingURL=FormFieldInput.js.map

package/components/FormField/components/FormFieldLabel.js

@@ -1,42 +1,43 @@
-import { jsx as i } from "react/jsx-runtime";
-import g, { useContext as z, useState as u, useEffect as T } from "react";
+import { jsx as d } from "react/jsx-runtime";
+import p, { useContext as T, useState as g, useEffect as E } from "react";
 import { FormFieldContext as h } from "../FormFieldContext.js";
-import { TARGET_PADDING_X_DEFAULT as o } from "../consts.js";
-import { c as N } from "../../../chunks/vendor-CF2m175I.js";
-const y = "formFieldLabel__d8a3b702", E = "floating__f6962280", A = "formFieldLabelText__599f2151", D = "disabled__326d875b", e = {
-  formFieldLabel: y,
-  "size-sm": "size-sm__a6edd3c2",
-  "size-md": "size-md__285f1472",
-  "size-lg": "size-lg__cfb64eea",
-  floating: E,
-  formFieldLabelText: A,
-  disabled: D
-}, R = g.forwardRef(
-  ({ children: a, className: d, style: f, ...m }, r) => {
-    const { disabled: c, focused: l, id: n, prefixWidth: b, postfixWidth: _, size: s, valueExist: t } = z(h), [F, x] = u(!1);
-    T(() => {
-      x(l || t);
-    }, [l, t]);
-    const L = N(
-      e.formFieldLabel,
+import { TARGET_PADDING_X_DEFAULT as m } from "../consts.js";
+import { n as D, c as N } from "../../../chunks/vendor-BlJo2ILB.js";
+import { EFormFieldStatus as y } from "../enums.js";
+const A = "formFieldLabel__8bb37c5d", R = "floating__b4548b34", S = "formFieldLabelText__22bd81c8", C = "disabled__44b08295", s = {
+  formFieldLabel: A,
+  "size-sm": "size-sm__1d215670",
+  "size-md": "size-md__c30cf193",
+  "size-lg": "size-lg__459bdf9d",
+  floating: R,
+  formFieldLabelText: S,
+  disabled: C
+}, G = p.forwardRef(
+  ({ children: f, className: r, style: b, floating: e, ...c }, n) => {
+    const { status: F, focused: t, id: _, prefixWidth: L, postfixWidth: x, size: i, valueExist: o } = T(h), [l, a] = g(!1);
+    E(() => {
+      !D(e) && e !== l ? a(e) : e !== l && a(t || o);
+    }, [t, o, e, l]);
+    const u = N(
+      s.formFieldLabel,
       {
-        [e.disabled]: c,
-        [e.floating]: F,
-        [e[`size-${s}`]]: s
+        [s.disabled]: F === y.DISABLED,
+        [s.floating]: l,
+        [s[`size-${i}`]]: i
       },
-      d
-    ), p = {
+      r
+    ), z = {
       // Левая позиция элемента. Когда label по-середине инпута, позиция учитывает иконки по краям, когда сверху, позиция на все ширину поля ввода.
-      left: b || o,
+      left: L || m,
       // Правая позиция элемента. Когда label по-середине инпута, позиция учитывает иконки по краям, когда сверху, позиция на все ширину поля ввода.
-      right: _ || o,
-      ...f
+      right: x || m,
+      ...b
     };
-    return /* @__PURE__ */ i("label", { className: L, ref: r, htmlFor: n, ...m, style: p, children: /* @__PURE__ */ i("span", { className: e.formFieldLabelText, children: a }) });
+    return /* @__PURE__ */ d("label", { className: u, ref: n, htmlFor: _, ...c, style: z, children: /* @__PURE__ */ d("span", { className: s.formFieldLabelText, children: f }) });
   }
 );
-R.displayName = "FormFieldLabel";
+G.displayName = "FormFieldLabel";
 export {
-  R as FormFieldLabel
+  G as FormFieldLabel
 };
 //# sourceMappingURL=FormFieldLabel.js.map