@sberbusiness/triplex-next 1.34.0 → 1.35.0

package/components/FormField/FormField.js

@@ -1,82 +1,100 @@
-import { jsx as n } from "react/jsx-runtime";
-import I, { useState as t, useMemo as L } from "react";
-import { c as h } from "../../chunks/vendor-D5cfSbgz.js";
-import { FormFieldContext as v } from "./FormFieldContext.js";
-import { TARGET_PADDING_X_DEFAULT as _ } from "./consts.js";
-import { EFormFieldStatus as o } from "./enums.js";
-import { EComponentSize as w } from "../../enums/EComponentSize.js";
-import { createSizeToClassNameMap as C } from "../../utils/classNameMaps.js";
-const S = "formField__c96b5160", W = "sm__2079d6a4", G = "md__7fe9c68e", M = "lg__aac0ac1a", P = "active__701240be", y = "disabled__c53733d4", U = "error__4c616467", j = "warning__fd5245fb", z = "filled__821e9e87", e = {
-  formField: S,
-  sm: W,
-  md: G,
-  lg: M,
-  default: "default__0af22212",
-  active: P,
-  disabled: y,
-  error: U,
-  warning: j,
-  filled: z
-}, B = {
-  [o.DEFAULT]: e.default,
-  [o.DISABLED]: e.disabled,
-  [o.ERROR]: e.error,
-  [o.WARNING]: e.warning
-}, O = C(e), V = I.forwardRef(
+import { jsx } from "react/jsx-runtime";
+import React__default, { useState, useMemo } from "react";
+import { c as clsx } from "../../chunks/vendor-Bco_z_Yi.js";
+import { FormFieldContext } from "./FormFieldContext.js";
+import { TARGET_PADDING_X_DEFAULT } from "./consts.js";
+import { EFormFieldStatus } from "./enums.js";
+import { EComponentSize } from "../../enums/EComponentSize.js";
+import { createSizeToClassNameMap } from "../../utils/classNameMaps.js";
+const formField = "formField__9d9e353d";
+const sm = "sm__7997b366";
+const md = "md__0be98a76";
+const lg = "lg__a6b32fdb";
+const active = "active__893490f0";
+const disabled = "disabled__f92e2696";
+const error = "error__e4450753";
+const warning = "warning__2456142d";
+const filled = "filled__9a96b56d";
+const styles = {
+  formField,
+  sm,
+  md,
+  lg,
+  "default": "default__6de224a1",
+  active,
+  disabled,
+  error,
+  warning,
+  filled
+};
+const statusToClassNameMap = {
+  [EFormFieldStatus.DEFAULT]: styles.default,
+  [EFormFieldStatus.DISABLED]: styles.disabled,
+  [EFormFieldStatus.ERROR]: styles.error,
+  [EFormFieldStatus.WARNING]: styles.warning
+};
+const sizeToClassNameMap = createSizeToClassNameMap(styles);
+const FormField = React__default.forwardRef(
   ({
-    children: p,
-    className: F,
-    style: g,
-    size: r = w.LG,
-    status: a = o.DEFAULT,
-    active: d = !1,
-    ...u
-  }, x) => {
-    const [m, b] = t(), [f, T] = t(), [i, E] = t(_), [l, N] = t(_), [c, R] = t(!1), [s, A] = t(!1), D = L(
+    children,
+    className,
+    style,
+    size = EComponentSize.LG,
+    status = EFormFieldStatus.DEFAULT,
+    active: active2 = false,
+    ...htmlDivAttributes
+  }, ref) => {
+    const [targetId, setTargetId] = useState();
+    const [labelId, setLabelId] = useState();
+    const [postfixWidth, setPostfixWidth] = useState(TARGET_PADDING_X_DEFAULT);
+    const [prefixWidth, setPrefixWidth] = useState(TARGET_PADDING_X_DEFAULT);
+    const [filled2, setFilled] = useState(false);
+    const [focused, setFocused] = useState(false);
+    const contextValue = useMemo(
       () => ({
-        size: r,
-        status: a,
-        targetId: m,
-        labelId: f,
-        postfixWidth: i,
-        prefixWidth: l,
-        filled: c,
-        focused: s,
-        active: d || s,
-        setTargetId: b,
-        setLabelId: T,
-        setPostfixWidth: E,
-        setPrefixWidth: N,
-        setFilled: R,
-        setFocused: A
+        size,
+        status,
+        targetId,
+        labelId,
+        postfixWidth,
+        prefixWidth,
+        filled: filled2,
+        focused,
+        active: active2 || focused,
+        setTargetId,
+        setLabelId,
+        setPostfixWidth,
+        setPrefixWidth,
+        setFilled,
+        setFocused
       }),
-      [r, a, m, f, i, l, c, s, d]
+      [size, status, targetId, labelId, postfixWidth, prefixWidth, filled2, focused, active2]
     );
-    return /* @__PURE__ */ n(v.Provider, { value: D, children: /* @__PURE__ */ n(
+    return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
       "div",
       {
-        className: h(
-          e.formField,
-          O[r],
-          B[a],
+        className: clsx(
+          styles.formField,
+          sizeToClassNameMap[size],
+          statusToClassNameMap[status],
           {
-            [e.filled]: c,
-            [e.active]: d || s
+            [styles.filled]: filled2,
+            [styles.active]: active2 || focused
           },
-          F
+          className
         ),
-        "data-tx": "1.34.0",
-        style: { paddingLeft: l, paddingRight: i, ...g },
-        ...u,
-        ref: x,
-        children: p
+        "data-tx": "1.35.0",
+        style: { paddingLeft: prefixWidth, paddingRight: postfixWidth, ...style },
+        ...htmlDivAttributes,
+        ref,
+        children
       }
     ) });
   }
 );
-V.displayName = "FormField";
+FormField.displayName = "FormField";
 export {
-  V as FormField,
-  B as statusToClassNameMap
+  FormField,
+  statusToClassNameMap
 };
 //# sourceMappingURL=FormField.js.map

package/components/FormField/FormField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.js","sources":["../../../src/components/FormField/FormField.tsx"],"sourcesContent":["import React, { useState, useMemo } from \"react\";\nimport clsx from \"clsx\";\nimport { FormFieldContext } from \"./FormFieldContext\";\nimport { TARGET_PADDING_X_DEFAULT } from \"./consts\";\nimport { EFormFieldStatus } from \"./enums\";\nimport { EComponentSize } from \"../../enums/EComponentSize\";\nimport { DataAttributes } from \"../../types/CoreTypes\";\nimport { createSizeToClassNameMap } from \"../../utils/classNameMaps\";\nimport styles from \"./styles/FormField.module.less\";\n\n/** Свойства компонента FormField. */\nexport interface IFormFieldProps extends React.HTMLAttributes<HTMLDivElement>, DataAttributes {\n    /** Визуальное состояние. */\n    status?: EFormFieldStatus;\n    /** Размер. */\n    size?: EComponentSize;\n    /** Активное состояние. */\n    active?: boolean;\n}\n\nexport const statusToClassNameMap = {\n    [EFormFieldStatus.DEFAULT]: styles.default,\n    [EFormFieldStatus.DISABLED]: styles.disabled,\n    [EFormFieldStatus.ERROR]: styles.error,\n    [EFormFieldStatus.WARNING]: styles.warning,\n};\n\nconst sizeToClassNameMap = createSizeToClassNameMap(styles);\n\n/** Элемент, отображающий input/select/textarea + label. */\nexport const FormField = React.forwardRef<HTMLDivElement, IFormFieldProps>(\n    (\n        {\n            children,\n            className,\n            style,\n            size = EComponentSize.LG,\n            status = EFormFieldStatus.DEFAULT,\n            active = false,\n            ...htmlDivAttributes\n        },\n        ref,\n    ) => {\n        const [targetId, setTargetId] = useState<string>();\n        const [labelId, setLabelId] = useState<string>();\n        const [postfixWidth, setPostfixWidth] = useState(TARGET_PADDING_X_DEFAULT);\n        const [prefixWidth, setPrefixWidth] = useState(TARGET_PADDING_X_DEFAULT);\n        const [filled, setFilled] = useState(false);\n        const [focused, setFocused] = useState(false);\n\n        const contextValue = useMemo(\n            () => ({\n                size,\n                status,\n                targetId,\n                labelId,\n                postfixWidth,\n                prefixWidth,\n                filled,\n                focused,\n                active: active || focused,\n                setTargetId,\n                setLabelId,\n                setPostfixWidth,\n                setPrefixWidth,\n                setFilled,\n                setFocused,\n            }),\n            [size, status, targetId, labelId, postfixWidth, prefixWidth, filled, focused, active],\n        );\n\n        return (\n            <FormFieldContext.Provider value={contextValue}>\n                <div\n                    className={clsx(\n                        styles.formField,\n                        sizeToClassNameMap[size],\n                        statusToClassNameMap[status],\n                        {\n                            [styles.filled]: filled,\n                            [styles.active]: active || focused,\n                        },\n                        className,\n                    )}\n                    data-tx={process.env.npm_package_version}\n                    style={{ paddingLeft: prefixWidth, paddingRight: postfixWidth, ...style }}\n                    {...htmlDivAttributes}\n                    ref={ref}\n                >\n                    {children}\n                </div>\n            </FormFieldContext.Provider>\n        );\n    },\n);\n\nFormField.displayName = \"FormField\";\n"],"names":["React","active","filled"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBO,MAAM,uBAAuB;AAAA,EAChC,CAAC,iBAAiB,OAAO,GAAG,OAAO;AAAA,EACnC,CAAC,iBAAiB,QAAQ,GAAG,OAAO;AAAA,EACpC,CAAC,iBAAiB,KAAK,GAAG,OAAO;AAAA,EACjC,CAAC,iBAAiB,OAAO,GAAG,OAAO;AACvC;AAEA,MAAM,qBAAqB,yBAAyB,MAAM;AAGnD,MAAM,YAAYA,eAAM;AAAA,EAC3B,CACI;AAAA,IACI;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,eAAe;AAAA,IACtB,SAAS,iBAAiB;AAAA,IAC1B,QAAAC,UAAS;AAAA,IACT,GAAG;AAAA,EAAA,GAEP,QACC;AACD,UAAM,CAAC,UAAU,WAAW,IAAI,SAAA;AAChC,UAAM,CAAC,SAAS,UAAU,IAAI,SAAA;AAC9B,UAAM,CAAC,cAAc,eAAe,IAAI,SAAS,wBAAwB;AACzE,UAAM,CAAC,aAAa,cAAc,IAAI,SAAS,wBAAwB;AACvE,UAAM,CAACC,SAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,UAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAE5C,UAAM,eAAe;AAAA,MACjB,OAAO;AAAA,QACH;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,QAAAA;AAAA,QACA;AAAA,QACA,QAAQD,WAAU;AAAA,QAClB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,MAEJ,CAAC,MAAM,QAAQ,UAAU,SAAS,cAAc,aAAaC,SAAQ,SAASD,OAAM;AAAA,IAAA;AAGxF,+BACK,iBAAiB,UAAjB,EAA0B,OAAO,cAC9B,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW;AAAA,UACP,OAAO;AAAA,UACP,mBAAmB,IAAI;AAAA,UACvB,qBAAqB,MAAM;AAAA,UAC3B;AAAA,YACI,CAAC,OAAO,MAAM,GAAGC;AAAA,YACjB,CAAC,OAAO,MAAM,GAAGD,WAAU;AAAA,UAAA;AAAA,UAE/B;AAAA,QAAA;AAAA,QAEJ,WAAS;AAAA,QACT,OAAO,EAAE,aAAa,aAAa,cAAc,cAAc,GAAG,MAAA;AAAA,QACjE,GAAG;AAAA,QACJ;AAAA,QAEC;AAAA,MAAA;AAAA,IAAA,GAET;AAAA,EAER;AACJ;AAEA,UAAU,cAAc;"}

package/components/FormField/FormFieldContext.js

@@ -1,16 +1,16 @@
-import t from "react";
-import { EComponentSize as e } from "../../enums/EComponentSize.js";
-import { EFormFieldStatus as i } from "./enums.js";
-const o = {
-  size: e.LG,
-  status: i.DEFAULT,
+import React__default from "react";
+import { EComponentSize } from "../../enums/EComponentSize.js";
+import { EFormFieldStatus } from "./enums.js";
+const initialFormFieldContext = {
+  size: EComponentSize.LG,
+  status: EFormFieldStatus.DEFAULT,
   targetId: void 0,
   labelId: void 0,
   postfixWidth: 0,
   prefixWidth: 0,
-  filled: !1,
-  focused: !1,
-  active: !1,
+  filled: false,
+  focused: false,
+  active: false,
   setTargetId: () => {
   },
   setLabelId: () => {
@@ -23,9 +23,10 @@ const o = {
   },
   setFocused: () => {
   }
-}, r = t.createContext(o);
+};
+const FormFieldContext = React__default.createContext(initialFormFieldContext);
 export {
-  r as FormFieldContext,
-  o as initialFormFieldContext
+  FormFieldContext,
+  initialFormFieldContext
 };
 //# sourceMappingURL=FormFieldContext.js.map

package/components/FormField/FormFieldContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormFieldContext.js","sources":["../../../src/components/FormField/FormFieldContext.ts"],"sourcesContent":["import React from \"react\";\nimport { EComponentSize } from \"../../enums/EComponentSize\";\nimport { EFormFieldStatus } from \"./enums\";\n\nexport interface IFormFieldContext {\n    /** Размер поля. */\n    size: EComponentSize;\n    /** Статус поля. */\n    status: EFormFieldStatus;\n    /** Идентификатор элемента ввода. */\n    targetId: string | undefined;\n    /** Идентификатор лейбла. */\n    labelId: string | undefined;\n    /** Ширина элемента FormFieldPrefix. */\n    prefixWidth: number;\n    /** Ширина элемента FormFieldPostfix. */\n    postfixWidth: number;\n    /** Поле заполнено. */\n    filled: boolean;\n    /** Поле в фокусе. */\n    focused: boolean;\n    /** Поле активно. */\n    active: boolean;\n    /** Установка значения targetId. */\n    setTargetId: React.Dispatch<React.SetStateAction<string | undefined>>;\n    /** Установка значения labelId. */\n    setLabelId: React.Dispatch<React.SetStateAction<string | undefined>>;\n    /** Установка значения postfixWidth. */\n    setPostfixWidth: React.Dispatch<React.SetStateAction<number>>;\n    /** Установка значения prefixWidth. */\n    setPrefixWidth: React.Dispatch<React.SetStateAction<number>>;\n    /** Установка значения filled. */\n    setFilled: React.Dispatch<React.SetStateAction<boolean>>;\n    /** Установка значения focused. */\n    setFocused: React.Dispatch<React.SetStateAction<boolean>>;\n}\n\nexport const initialFormFieldContext: IFormFieldContext = {\n    size: EComponentSize.LG,\n    status: EFormFieldStatus.DEFAULT,\n    targetId: undefined,\n    labelId: undefined,\n    postfixWidth: 0,\n    prefixWidth: 0,\n    filled: false,\n    focused: false,\n    active: false,\n    setTargetId: () => {},\n    setLabelId: () => {},\n    setPostfixWidth: () => {},\n    setPrefixWidth: () => {},\n    setFilled: () => {},\n    setFocused: () => {},\n};\n\n/**\n * Контекст поля ввода.\n */\nexport const FormFieldContext = React.createContext<IFormFieldContext>(initialFormFieldContext);\n"],"names":["React"],"mappings":";;;AAqCO,MAAM,0BAA6C;AAAA,EACtD,MAAM,eAAe;AAAA,EACrB,QAAQ,iBAAiB;AAAA,EACzB,UAAU;AAAA,EACV,SAAS;AAAA,EACT,cAAc;AAAA,EACd,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,aAAa,MAAM;AAAA,EAAC;AAAA,EACpB,YAAY,MAAM;AAAA,EAAC;AAAA,EACnB,iBAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB,YAAY,MAAM;AAAA,EAAC;AACvB;AAKO,MAAM,mBAAmBA,eAAM,cAAiC,uBAAuB;"}

package/components/FormField/FormFieldDescriptionContext.js

@@ -1,13 +1,14 @@
-import t from "react";
-const e = {
-  withCounter: !1,
+import React__default from "react";
+const initialFormFieldDescriptionContext = {
+  withCounter: false,
   setWithCounter: () => {
   }
-}, i = t.createContext(
-  e
+};
+const FormFieldDescriptionContext = React__default.createContext(
+  initialFormFieldDescriptionContext
 );
 export {
-  i as FormFieldDescriptionContext,
-  e as initialFormFieldDescriptionContext
+  FormFieldDescriptionContext,
+  initialFormFieldDescriptionContext
 };
 //# sourceMappingURL=FormFieldDescriptionContext.js.map

package/components/FormField/FormFieldDescriptionContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormFieldDescriptionContext.js","sources":["../../../src/components/FormField/FormFieldDescriptionContext.ts"],"sourcesContent":["import React from \"react\";\n\nexport interface IFormFieldDescriptionContext {\n    // Поле имеет счетчик символов.\n    withCounter: boolean;\n    // Установка значения withCounter.\n    setWithCounter: (withCounter: boolean) => void;\n}\n\nexport const initialFormFieldDescriptionContext: IFormFieldDescriptionContext = {\n    withCounter: false,\n    setWithCounter: () => {},\n};\n\n/**\n * Контекст описания поля ввода.\n */\nexport const FormFieldDescriptionContext = React.createContext<IFormFieldDescriptionContext>(\n    initialFormFieldDescriptionContext,\n);\n"],"names":["React"],"mappings":";AASO,MAAM,qCAAmE;AAAA,EAC5E,aAAa;AAAA,EACb,gBAAgB,MAAM;AAAA,EAAC;AAC3B;AAKO,MAAM,8BAA8BA,eAAM;AAAA,EAC7C;AACJ;"}

package/components/FormField/components/FormFieldClear.js

@@ -1,32 +1,35 @@
-import { jsx as l } from "react/jsx-runtime";
-import c, { useCallback as f } from "react";
-import { c as i } from "../../../chunks/vendor-D5cfSbgz.js";
-import { CrossStrokeSrvIcon16 as d } from "@sberbusiness/icons-next";
-import { ButtonIcon as s } from "../../Button/ButtonIcon.js";
-const p = "formFieldClear__5c8e3250", C = {
-  formFieldClear: p
-}, F = c.forwardRef(
-  ({ className: t, onMouseDown: r, ...a }, m) => {
-    const o = f(
-      (e) => {
-        e.preventDefault(), r == null || r(e);
+import { jsx } from "react/jsx-runtime";
+import React__default, { useCallback } from "react";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { CrossStrokeSrvIcon16 } from "@sberbusiness/icons-next";
+import { ButtonIcon } from "../../Button/ButtonIcon.js";
+const formFieldClear = "formFieldClear__a84e2922";
+const styles = {
+  formFieldClear
+};
+const FormFieldClear = React__default.forwardRef(
+  ({ className, onMouseDown, ...restProps }, ref) => {
+    const handleMouseDown = useCallback(
+      (event) => {
+        event.preventDefault();
+        onMouseDown == null ? void 0 : onMouseDown(event);
       },
-      [r]
+      [onMouseDown]
     );
-    return /* @__PURE__ */ l(
-      s,
+    return /* @__PURE__ */ jsx(
+      ButtonIcon,
       {
-        ...a,
-        className: i(C.formFieldClear, t),
-        onMouseDown: o,
-        ref: m,
-        children: /* @__PURE__ */ l(d, { paletteIndex: 5 })
+        ...restProps,
+        className: clsx(styles.formFieldClear, className),
+        onMouseDown: handleMouseDown,
+        ref,
+        children: /* @__PURE__ */ jsx(CrossStrokeSrvIcon16, { paletteIndex: 5 })
       }
     );
   }
 );
-F.displayName = "FormFieldClear";
+FormFieldClear.displayName = "FormFieldClear";
 export {
-  F as FormFieldClear
+  FormFieldClear
 };
 //# sourceMappingURL=FormFieldClear.js.map

package/components/FormField/components/FormFieldClear.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormFieldClear.js","sources":["../../../../src/components/FormField/components/FormFieldClear.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport clsx from \"clsx\";\nimport { CrossStrokeSrvIcon16 } from \"@sberbusiness/icons-next\";\nimport { ButtonIcon } from \"../../Button/ButtonIcon\";\nimport styles from \"../styles/FormFieldClear.module.less\";\n\n/** Свойства компонета FormFieldClear. */\nexport interface IFormFieldClearProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"children\"> {}\n\n/** Кнопка очищения введенного значения. */\nexport const FormFieldClear = React.forwardRef<HTMLButtonElement, IFormFieldClearProps>(\n    ({ className, onMouseDown, ...restProps }, ref) => {\n        const handleMouseDown = useCallback<React.MouseEventHandler<HTMLButtonElement>>(\n            (event) => {\n                // Предотвращаем получение фокуса.\n                event.preventDefault();\n                onMouseDown?.(event);\n            },\n            [onMouseDown],\n        );\n\n        return (\n            <ButtonIcon\n                {...restProps}\n                className={clsx(styles.formFieldClear, className)}\n                onMouseDown={handleMouseDown}\n                ref={ref}\n            >\n                <CrossStrokeSrvIcon16 paletteIndex={5} />\n            </ButtonIcon>\n        );\n    },\n);\n\nFormFieldClear.displayName = \"FormFieldClear\";\n"],"names":["React"],"mappings":";;;;;;;;;AAUO,MAAM,iBAAiBA,eAAM;AAAA,EAChC,CAAC,EAAE,WAAW,aAAa,GAAG,UAAA,GAAa,QAAQ;AAC/C,UAAM,kBAAkB;AAAA,MACpB,CAAC,UAAU;AAEP,cAAM,eAAA;AACN,mDAAc;AAAA,MAClB;AAAA,MACA,CAAC,WAAW;AAAA,IAAA;AAGhB,WACI;AAAA,MAAC;AAAA,MAAA;AAAA,QACI,GAAG;AAAA,QACJ,WAAW,KAAK,OAAO,gBAAgB,SAAS;AAAA,QAChD,aAAa;AAAA,QACb;AAAA,QAEA,UAAA,oBAAC,sBAAA,EAAqB,cAAc,EAAA,CAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGnD;AACJ;AAEA,eAAe,cAAc;"}

package/components/FormField/components/FormFieldCounter.js

@@ -1,14 +1,20 @@
-import { jsx as t } from "react/jsx-runtime";
-import { useContext as n, useEffect as i } from "react";
-import { FormFieldDescriptionContext as m } from "../FormFieldDescriptionContext.js";
-const s = "formFieldCounter__806ad52f", u = {
-  formFieldCounter: s
-}, f = ({ children: o, ...r }) => {
-  const { setWithCounter: e } = n(m);
-  return i(() => (e(!0), () => e(!1)), []), /* @__PURE__ */ t("div", { className: u.formFieldCounter, ...r, children: o });
+import { jsx } from "react/jsx-runtime";
+import { useContext, useEffect } from "react";
+import { FormFieldDescriptionContext } from "../FormFieldDescriptionContext.js";
+const formFieldCounter = "formFieldCounter__02c49403";
+const styles = {
+  formFieldCounter
 };
-f.displayName = "FormFieldCounter";
+const FormFieldCounter = ({ children, ...rest }) => {
+  const { setWithCounter } = useContext(FormFieldDescriptionContext);
+  useEffect(() => {
+    setWithCounter(true);
+    return () => setWithCounter(false);
+  }, []);
+  return /* @__PURE__ */ jsx("div", { className: styles.formFieldCounter, ...rest, children });
+};
+FormFieldCounter.displayName = "FormFieldCounter";
 export {
-  f as FormFieldCounter
+  FormFieldCounter
 };
 //# sourceMappingURL=FormFieldCounter.js.map

package/components/FormField/components/FormFieldCounter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormFieldCounter.js","sources":["../../../../src/components/FormField/components/FormFieldCounter.tsx"],"sourcesContent":["import React, { useEffect, useContext } from \"react\";\nimport { FormFieldDescriptionContext } from \"../FormFieldDescriptionContext\";\nimport styles from \"../styles/FormFieldCounter.module.less\";\n\n/** Свойства компонента FormFieldCounter. */\nexport interface IFormFieldCounterProps extends React.HTMLAttributes<HTMLDivElement> {}\n\n/** Отображает дополнительную информацию под полем ввода справа, счетчик символов. */\nexport const FormFieldCounter: React.FC<IFormFieldCounterProps> = ({ children, ...rest }) => {\n    const { setWithCounter } = useContext(FormFieldDescriptionContext);\n\n    useEffect(() => {\n        setWithCounter(true);\n        return () => setWithCounter(false);\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, []);\n\n    return (\n        <div className={styles.formFieldCounter} {...rest}>\n            {children}\n        </div>\n    );\n};\n\nFormFieldCounter.displayName = \"FormFieldCounter\";\n"],"names":[],"mappings":";;;;;;;AAQO,MAAM,mBAAqD,CAAC,EAAE,UAAU,GAAG,WAAW;AACzF,QAAM,EAAE,eAAA,IAAmB,WAAW,2BAA2B;AAEjE,YAAU,MAAM;AACZ,mBAAe,IAAI;AACnB,WAAO,MAAM,eAAe,KAAK;AAAA,EAErC,GAAG,CAAA,CAAE;AAEL,6BACK,OAAA,EAAI,WAAW,OAAO,kBAAmB,GAAG,MACxC,UACL;AAER;AAEA,iBAAiB,cAAc;"}

package/components/FormField/components/FormFieldDescription.js

@@ -1,16 +1,19 @@
-import { jsx as t } from "react/jsx-runtime";
-import { useState as n } from "react";
-import { c } from "../../../chunks/vendor-D5cfSbgz.js";
-import { FormFieldDescriptionContext as m } from "../FormFieldDescriptionContext.js";
-const d = "formFieldDescription__d84f0c5f", l = "withCounter__c0d6c84d", i = {
-  formFieldDescription: d,
-  withCounter: l
-}, p = ({ children: r, ...e }) => {
-  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 }) });
+import { jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { FormFieldDescriptionContext } from "../FormFieldDescriptionContext.js";
+const formFieldDescription = "formFieldDescription__c1a2fb7f";
+const withCounter = "withCounter__aacb427c";
+const styles = {
+  formFieldDescription,
+  withCounter
 };
-p.displayName = "FormFieldDescription";
+const FormFieldDescription = ({ children, ...rest }) => {
+  const [withCounter2, setWithCounter] = useState(false);
+  return /* @__PURE__ */ jsx(FormFieldDescriptionContext.Provider, { value: { withCounter: withCounter2, setWithCounter }, children: /* @__PURE__ */ jsx("div", { className: clsx(styles.formFieldDescription, { [styles.withCounter]: withCounter2 }), ...rest, children }) });
+};
+FormFieldDescription.displayName = "FormFieldDescription";
 export {
-  p as FormFieldDescription
+  FormFieldDescription
 };
 //# sourceMappingURL=FormFieldDescription.js.map

package/components/FormField/components/FormFieldDescription.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormFieldDescription.js","sources":["../../../../src/components/FormField/components/FormFieldDescription.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport styles from \"../styles/FormFieldDescription.module.less\";\nimport clsx from \"clsx\";\nimport { FormFieldDescriptionContext } from \"../FormFieldDescriptionContext\";\n\n/** Свойства компонента FormFieldDescription. */\nexport interface IFormFieldDescriptionProps extends React.HTMLAttributes<HTMLDivElement> {}\n\n/** Отображает дополнительную информацию под полем ввода. */\nexport const FormFieldDescription: React.FC<IFormFieldDescriptionProps> = ({ children, ...rest }) => {\n    const [withCounter, setWithCounter] = useState(false);\n\n    return (\n        <FormFieldDescriptionContext.Provider value={{ withCounter, setWithCounter }}>\n            <div className={clsx(styles.formFieldDescription, { [styles.withCounter]: withCounter })} {...rest}>\n                {children}\n            </div>\n        </FormFieldDescriptionContext.Provider>\n    );\n};\n\nFormFieldDescription.displayName = \"FormFieldDescription\";\n"],"names":["withCounter"],"mappings":";;;;;;;;;;AASO,MAAM,uBAA6D,CAAC,EAAE,UAAU,GAAG,WAAW;AACjG,QAAM,CAACA,cAAa,cAAc,IAAI,SAAS,KAAK;AAEpD,SACI,oBAAC,4BAA4B,UAA5B,EAAqC,OAAO,EAAE,aAAAA,cAAa,kBACxD,UAAA,oBAAC,OAAA,EAAI,WAAW,KAAK,OAAO,sBAAsB,EAAE,CAAC,OAAO,WAAW,GAAGA,aAAA,CAAa,GAAI,GAAG,MACzF,SAAA,CACL,EAAA,CACJ;AAER;AAEA,qBAAqB,cAAc;"}

package/components/FormField/components/FormFieldInput.js

@@ -1,12 +1,12 @@
 import "react/jsx-runtime";
 import "react";
-import "../../../chunks/vendor-D5cfSbgz.js";
+import "../../../chunks/vendor-Bco_z_Yi.js";
 import "../FormFieldContext.js";
 import "../enums.js";
 import "../../../utils/classNameMaps.js";
 import "./utils.js";
-import { F as d } from "../../../chunks/FormFieldInput-DFQ9utC5.js";
+import { F } from "../../../chunks/FormFieldInput-oyG8nnC2.js";
 export {
-  d as FormFieldInput
+  F as FormFieldInput
 };
 //# sourceMappingURL=FormFieldInput.js.map

package/components/FormField/components/FormFieldInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormFieldInput.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/components/FormField/components/FormFieldLabel.js

@@ -1,42 +1,56 @@
-import { jsx as a } from "react/jsx-runtime";
-import A, { useContext as E, useMemo as N, useLayoutEffect as I } from "react";
-import { u as S, c as h } from "../../../chunks/vendor-D5cfSbgz.js";
-import { FormFieldContext as y } from "../FormFieldContext.js";
-import { createSizeToClassNameMap as D } from "../../../utils/classNameMaps.js";
-import { EFormFieldStatus as C } from "../enums.js";
-import { TARGET_PADDING_X_DEFAULT as s } from "../consts.js";
-const M = "formFieldLabel__32ca718a", R = "sm__2079d6a4", v = "md__7fe9c68e", z = "lg__aac0ac1a", G = "floating__51f68d10", W = "formFieldLabelText__fff15d0c", j = "disabled__c53733d4", e = {
-  formFieldLabel: M,
-  sm: R,
-  md: v,
-  lg: z,
-  floating: G,
-  formFieldLabelText: W,
-  disabled: j
-}, q = D(e), w = A.forwardRef(
-  ({ children: i, id: t, className: m, style: d, floating: f, ...r }, c) => {
-    const { targetId: n, size: _, status: b, filled: F, active: L, prefixWidth: g, postfixWidth: p, setLabelId: o } = E(y), l = N(() => t === void 0 ? S("label_") : t, [t]), u = f ?? (F || L), x = h(
-      e.formFieldLabel,
-      q[_],
+import { jsx } from "react/jsx-runtime";
+import React__default, { useContext, useMemo, useLayoutEffect } from "react";
+import { u as uniqueId, c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { FormFieldContext } from "../FormFieldContext.js";
+import { createSizeToClassNameMap } from "../../../utils/classNameMaps.js";
+import { EFormFieldStatus } from "../enums.js";
+import { TARGET_PADDING_X_DEFAULT } from "../consts.js";
+const formFieldLabel = "formFieldLabel__f64bd918";
+const sm = "sm__7997b366";
+const md = "md__0be98a76";
+const lg = "lg__a6b32fdb";
+const floating = "floating__629a6124";
+const formFieldLabelText = "formFieldLabelText__30b5da54";
+const disabled = "disabled__f92e2696";
+const styles = {
+  formFieldLabel,
+  sm,
+  md,
+  lg,
+  floating,
+  formFieldLabelText,
+  disabled
+};
+const SIZE_TO_CLASS_NAME_MAP = createSizeToClassNameMap(styles);
+const FormFieldLabel = React__default.forwardRef(
+  ({ children, id: idProp, className, style, floating: floatingProp, ...restProps }, ref) => {
+    const { targetId, size, status, filled, active, prefixWidth, postfixWidth, setLabelId } = useContext(FormFieldContext);
+    const id = useMemo(() => idProp === void 0 ? uniqueId("label_") : idProp, [idProp]);
+    const floating2 = floatingProp ?? (filled || active);
+    const classNames = clsx(
+      styles.formFieldLabel,
+      SIZE_TO_CLASS_NAME_MAP[size],
       {
-        [e.floating]: u,
-        [e.disabled]: b === C.DISABLED
+        [styles.floating]: floating2,
+        [styles.disabled]: status === EFormFieldStatus.DISABLED
       },
-      m
-    ), T = {
+      className
+    );
+    const stylesLabel = {
       // Левая позиция элемента. Когда label по-середине инпута, позиция учитывает иконки по краям, когда сверху, позиция на все ширину поля ввода.
-      left: g || s,
+      left: prefixWidth || TARGET_PADDING_X_DEFAULT,
       // Правая позиция элемента. Когда label по-середине инпута, позиция учитывает иконки по краям, когда сверху, позиция на все ширину поля ввода.
-      right: p || s,
-      ...d
+      right: postfixWidth || TARGET_PADDING_X_DEFAULT,
+      ...style
     };
-    return I(() => {
-      o(l);
-    }, [l, o]), /* @__PURE__ */ a("label", { ...r, id: l, className: x, htmlFor: n, style: T, ref: c, children: /* @__PURE__ */ a("span", { className: e.formFieldLabelText, children: i }) });
+    useLayoutEffect(() => {
+      setLabelId(id);
+    }, [id, setLabelId]);
+    return /* @__PURE__ */ jsx("label", { ...restProps, id, className: classNames, htmlFor: targetId, style: stylesLabel, ref, children: /* @__PURE__ */ jsx("span", { className: styles.formFieldLabelText, children }) });
   }
 );
-w.displayName = "FormFieldLabel";
+FormFieldLabel.displayName = "FormFieldLabel";
 export {
-  w as FormFieldLabel
+  FormFieldLabel
 };
 //# sourceMappingURL=FormFieldLabel.js.map

package/components/FormField/components/FormFieldLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormFieldLabel.js","sources":["../../../../src/components/FormField/components/FormFieldLabel.tsx"],"sourcesContent":["import React, { useContext, useMemo, useLayoutEffect } from \"react\";\nimport clsx from \"clsx\";\nimport { uniqueId } from \"lodash-es\";\nimport { FormFieldContext } from \"../FormFieldContext\";\nimport { createSizeToClassNameMap } from \"../../../utils/classNameMaps\";\nimport { EFormFieldStatus } from \"../enums\";\nimport { TARGET_PADDING_X_DEFAULT } from \"../consts\";\nimport styles from \"../styles/FormFieldLabel.module.less\";\n\n/** Свойства компонента FormFieldLabel. */\nexport interface IFormFieldLabelProps extends Omit<React.LabelHTMLAttributes<HTMLLabelElement>, \"htmlFor\"> {\n    /** Label отображается в уменьшенном виде над полем ввода/селектом. */\n    floating?: boolean;\n}\n\n// Соответствие размера имени класса.\nconst SIZE_TO_CLASS_NAME_MAP = createSizeToClassNameMap(styles);\n\n/** Лейбл поля ввода/селекта. Отображается по-середине поля ввода, когда инпут/селект имеет значение или фокус, перемещается в верхний левый угол. */\nexport const FormFieldLabel = React.forwardRef<HTMLLabelElement, IFormFieldLabelProps>(\n    ({ children, id: idProp, className, style, floating: floatingProp, ...restProps }, ref) => {\n        const { targetId, size, status, filled, active, prefixWidth, postfixWidth, setLabelId } =\n            useContext(FormFieldContext);\n        const id = useMemo(() => (idProp === undefined ? uniqueId(\"label_\") : idProp), [idProp]);\n        // Label отображается в уменьшенном виде над полем ввода/селектом.\n        const floating = floatingProp ?? (filled || active);\n\n        const classNames = clsx(\n            styles.formFieldLabel,\n            SIZE_TO_CLASS_NAME_MAP[size],\n            {\n                [styles.floating]: floating,\n                [styles.disabled]: status === EFormFieldStatus.DISABLED,\n            },\n            className,\n        );\n\n        const stylesLabel = {\n            // Левая позиция элемента. Когда label по-середине инпута, позиция учитывает иконки по краям, когда сверху, позиция на все ширину поля ввода.\n            left: prefixWidth || TARGET_PADDING_X_DEFAULT,\n            // Правая позиция элемента. Когда label по-середине инпута, позиция учитывает иконки по краям, когда сверху, позиция на все ширину поля ввода.\n            right: postfixWidth || TARGET_PADDING_X_DEFAULT,\n            ...style,\n        };\n\n        useLayoutEffect(() => {\n            setLabelId(id);\n        }, [id, setLabelId]);\n\n        return (\n            <label {...restProps} id={id} className={classNames} htmlFor={targetId} style={stylesLabel} ref={ref}>\n                <span className={styles.formFieldLabelText}>{children}</span>\n            </label>\n        );\n    },\n);\n\nFormFieldLabel.displayName = \"FormFieldLabel\";\n"],"names":["React","floating"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAgBA,MAAM,yBAAyB,yBAAyB,MAAM;AAGvD,MAAM,iBAAiBA,eAAM;AAAA,EAChC,CAAC,EAAE,UAAU,IAAI,QAAQ,WAAW,OAAO,UAAU,cAAc,GAAG,UAAA,GAAa,QAAQ;AACvF,UAAM,EAAE,UAAU,MAAM,QAAQ,QAAQ,QAAQ,aAAa,cAAc,eACvE,WAAW,gBAAgB;AAC/B,UAAM,KAAK,QAAQ,MAAO,WAAW,SAAY,SAAS,QAAQ,IAAI,QAAS,CAAC,MAAM,CAAC;AAEvF,UAAMC,YAAW,iBAAiB,UAAU;AAE5C,UAAM,aAAa;AAAA,MACf,OAAO;AAAA,MACP,uBAAuB,IAAI;AAAA,MAC3B;AAAA,QACI,CAAC,OAAO,QAAQ,GAAGA;AAAA,QACnB,CAAC,OAAO,QAAQ,GAAG,WAAW,iBAAiB;AAAA,MAAA;AAAA,MAEnD;AAAA,IAAA;AAGJ,UAAM,cAAc;AAAA;AAAA,MAEhB,MAAM,eAAe;AAAA;AAAA,MAErB,OAAO,gBAAgB;AAAA,MACvB,GAAG;AAAA,IAAA;AAGP,oBAAgB,MAAM;AAClB,iBAAW,EAAE;AAAA,IACjB,GAAG,CAAC,IAAI,UAAU,CAAC;AAEnB,+BACK,SAAA,EAAO,GAAG,WAAW,IAAQ,WAAW,YAAY,SAAS,UAAU,OAAO,aAAa,KACxF,UAAA,oBAAC,QAAA,EAAK,WAAW,OAAO,oBAAqB,UAAS,GAC1D;AAAA,EAER;AACJ;AAEA,eAAe,cAAc;"}