@alphakits/ui 2.0.12 → 2.1.0

package/dist/input/component.js

@@ -1,143 +1,139 @@
 import { jsx as a, jsxs as et } from "react/jsx-runtime";
-import st, { useRef as ot, useState as B, useCallback as f, Fragment as at } from "react";
-import rt from "react-merge-refs";
-import b from "classnames";
-import { Button as nt } from "../button/component.js";
+import st, { useRef as ot, useState as F, useCallback as l, Fragment as at } from "react";
+import nt from "react-merge-refs";
+import I from "classnames";
+import { Button as rt } from "../button/component.js";
 import { FormControl as it } from "../form-control/component.js";
 import { useFocus as ct } from "../hooks/useFocus/index.js";
 import s from "./index.module.css.js";
-const lt = st.forwardRef(
+const Vt = st.forwardRef(
   ({
-    size: F = "m",
+    size: k = "m",
     type: v = "text",
     block: C = !1,
     bottomAddons: j,
     dataTestId: w,
-    clear: y = !1,
-    disabled: r,
+    clear: S = !1,
+    disabled: n,
     error: u,
-    success: I,
-    required: S,
+    success: N,
+    required: y,
     hint: A,
     className: L,
-    fieldClassName: P,
-    inputClassName: q,
-    labelClassName: z,
-    addonsClassName: D,
-    focusedClassName: E,
-    filledClassName: G,
-    label: n,
-    maxLength: H = 100,
-    leftAddons: J,
+    fieldClassName: q,
+    inputClassName: z,
+    labelClassName: D,
+    addonsClassName: E,
+    focusedClassName: G,
+    filledClassName: H,
+    label: r,
+    maxLength: J = 100,
+    leftAddons: K,
     onFocus: m,
     onBlur: p,
     onChange: d,
     onClear: h,
-    onClick: K,
-    onMouseDown: M,
+    onClick: M,
+    onMouseDown: P,
     onMouseUp: Q,
-    rightAddons: N,
+    rightAddons: R,
     value: g,
     defaultValue: T,
     wrapperRef: U,
     readOnly: i,
     ...W
   }, X) => {
-    const e = g === void 0, c = ot(null), [Y] = ct(c, "keyboard"), [o, R] = B(!1), [x, k] = B(T || ""), V = !!(e ? x : g), l = y && V && !r && !i, Z = f(
+    const e = g === void 0, c = ot(null), [Y] = ct(c, "keyboard"), [o, b] = F(!1), [x, B] = F(T || ""), V = !!(e ? x : g), f = S && V && !n && !i, Z = l(
       (t) => {
-        i || R(!0), m && m(t);
+        i || b(!0), m && m(t);
       },
       [m, i]
-    ), _ = f(
+    ), _ = l(
       (t) => {
-        R(!1), p && p(t);
+        b(!1), p && p(t);
       },
       [p]
-    ), $ = f(
+    ), $ = l(
       (t) => {
-        d && d(t, { value: t.target.value }), e && k(t.target.value);
+        d && d(t, { value: t.target.value }), e && B(t.target.value);
       },
       [d, e]
-    ), O = f(
+    ), O = l(
       (t) => {
-        l && (e && k(""), h && h(t), c.current && !o && c.current.focus());
+        f && (e && B(""), h && h(t), c.current && !o && c.current.focus());
       },
-      [l, o, h, e]
-    ), tt = () => (l || N || I) && /* @__PURE__ */ et(at, { children: [
-      l && /* @__PURE__ */ a(
-        nt,
+      [f, o, h, e]
+    ), tt = () => (f || R || N) && /* @__PURE__ */ et(at, { children: [
+      f && /* @__PURE__ */ a(
+        rt,
         {
           type: "button",
           view: "ghost",
-          disabled: r,
+          disabled: n,
           "aria-label": "Очистить",
           className: s.clearButton,
           onClick: O,
           children: /* @__PURE__ */ a("span", { className: s.clearIcon })
         }
       ),
-      I && !u && /* @__PURE__ */ a("span", { className: s.successIcon }),
-      N
+      N && !u && /* @__PURE__ */ a("span", { className: s.successIcon }),
+      R
     ] });
     return /* @__PURE__ */ a(
       it,
       {
         ref: U,
-        className: b(L, o && E, V && G),
-        fieldClassName: b(P, {
+        className: I(L, o && G, V && H),
+        fieldClassName: I(q, {
           [s.focusVisible]: Y
         }),
-        labelClassName: z,
-        addonsClassName: D,
-        size: F,
+        labelClassName: D,
+        addonsClassName: E,
+        size: k,
         block: C,
-        required: S,
-        disabled: r,
+        required: y,
+        disabled: n,
         filled: V || o,
         focused: o,
         error: u,
-        label: n,
+        label: r,
         hint: A,
-        leftAddons: J,
+        leftAddons: K,
         rightAddons: tt(),
         bottomAddons: j,
-        onClick: K,
-        onMouseDown: M,
+        onClick: M,
+        onMouseDown: P,
         onMouseUp: Q,
         children: /* @__PURE__ */ a(
           "input",
           {
             ...W,
-            className: b(
+            className: I(
               s.input,
               {
-                [s.hasLabel]: n
+                [s.hasLabel]: r
               },
-              q
+              z
             ),
-            disabled: r,
+            disabled: n,
             onBlur: _,
             onFocus: Z,
             onChange: $,
-            maxLength: H,
-            ref: rt([X, c]),
+            maxLength: J,
+            ref: nt([X, c]),
             type: v,
             value: e ? x : g,
             readOnly: i,
             "data-test-id": w,
             "data-error": !!u,
-            "aria-label": typeof n == "string" ? n : void 0
+            "aria-label": typeof r == "string" ? r : void 0
           }
         )
       }
     );
   }
 );
-lt.defaultProps = {
-  type: "text",
-  block: !1
-};
 export {
-  lt as Input
+  Vt as Input
 };
 //# sourceMappingURL=component.js.map

package/dist/input/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../src/input/component.tsx"],"sourcesContent":["import React, {\n    ChangeEvent,\n    Fragment,\n    InputHTMLAttributes,\n    MouseEvent,\n    useCallback,\n    useRef,\n    useState,\n} from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { Button } from '../button';\nimport { FormControl } from '../form-control';\nimport { useFocus } from '../hooks/useFocus';\n\nimport styles from './index.module.css';\n\nexport type InputProps = Omit<\n    InputHTMLAttributes<HTMLInputElement>,\n    'size' | 'type' | 'value' | 'defaultValue' | 'onChange' | 'onClick' | 'onMouseDown'\n> & {\n    /**\n     * Значение поля ввода\n     */\n    value?: string;\n\n    /**\n     * Начальное значение поля\n     */\n    defaultValue?: string;\n\n    /**\n     * Растягивает компонент на ширину контейнера\n     */\n    block?: boolean;\n\n    /**\n     * required - индикатор * лейбла для обязательного заполнения поля\n     */\n    required?: boolean;\n\n    /**\n     * Крестик для очистки поля\n     */\n    clear?: boolean;\n\n    /**\n     * Размер компонента\n     */\n    size?: 's' | 'm' | 'l';\n\n    /**\n     * Отображение ошибки\n     */\n    error?: string | boolean;\n\n    /**\n     * Отображение иконки успеха\n     */\n    success?: boolean;\n\n    /**\n     * Текст подсказки\n     */\n    hint?: string;\n\n    /**\n     * Лейбл компонента\n     */\n    label?: React.ReactNode;\n\n    /**\n     * Атрибут type\n     */\n    type?: 'number' | 'card' | 'email' | 'money' | 'password' | 'tel' | 'text';\n\n    /**\n     * Ref для обертки input\n     */\n    wrapperRef?: React.Ref<HTMLDivElement>;\n\n    /**\n     * Слот слева\n     */\n    leftAddons?: React.ReactNode;\n\n    /**\n     * Слот справа\n     */\n    rightAddons?: React.ReactNode;\n\n    /**\n     * Слот под инпутом\n     */\n    bottomAddons?: React.ReactNode;\n\n    /**\n     * Дополнительный класс\n     */\n    className?: string;\n\n    /**\n     * Дополнительный класс для поля\n     */\n    fieldClassName?: string;\n\n    /**\n     * Дополнительный класс инпута\n     */\n    inputClassName?: string;\n\n    /**\n     * Дополнительный класс для лейбла\n     */\n    labelClassName?: string;\n\n    /**\n     * Дополнительный класс для аддонов\n     */\n    addonsClassName?: string;\n\n    /**\n     * Класс, который будет установлен при фокусе\n     */\n    focusedClassName?: string;\n\n    /**\n     * Класс, который будет установлен, если в поле есть значение\n     */\n    filledClassName?: string;\n\n    /**\n     * Обработчик поля ввода\n     */\n    onChange?: (event: ChangeEvent<HTMLInputElement>, payload: { value: string }) => void;\n\n    /**\n     * Обработчик нажатия на кнопку очистки\n     */\n    onClear?: (event: MouseEvent<HTMLButtonElement>) => void;\n\n    /**\n     * Обработчик клика по полю\n     */\n    onClick?: (event: MouseEvent<HTMLDivElement>) => void;\n\n    /**\n     * Обработчик MouseDown по полю\n     */\n    onMouseDown?: (event: MouseEvent<HTMLDivElement>) => void;\n\n    /**\n     * Обработчик MouseUp по полю\n     */\n    onMouseUp?: (event: MouseEvent<HTMLDivElement>) => void;\n\n    /**\n     * Идентификатор для систем автоматизированного тестирования\n     */\n    dataTestId?: string;\n};\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n    (\n        {\n            size = 'm',\n            type = 'text',\n            block = false,\n            bottomAddons,\n            dataTestId,\n            clear = false,\n            disabled,\n            error,\n            success,\n            required,\n            hint,\n            className,\n            fieldClassName,\n            inputClassName,\n            labelClassName,\n            addonsClassName,\n            focusedClassName,\n            filledClassName,\n            label,\n            maxLength = 100,\n            leftAddons,\n            onFocus,\n            onBlur,\n            onChange,\n            onClear,\n            onClick,\n            onMouseDown,\n            onMouseUp,\n            rightAddons,\n            value,\n            defaultValue,\n            wrapperRef,\n            readOnly,\n            ...restProps\n        },\n        ref,\n    ) => {\n        const uncontrolled = value === undefined;\n\n        const inputRef = useRef<HTMLInputElement>(null);\n\n        const [focusVisible] = useFocus(inputRef, 'keyboard');\n\n        const [focused, setFocused] = useState(false);\n        const [stateValue, setStateValue] = useState(defaultValue || '');\n\n        const filled = Boolean(uncontrolled ? stateValue : value);\n        // отображаем крестик только для заполненного и активного инпута\n        const clearButtonVisible = clear && filled && !disabled && !readOnly;\n\n        const handleInputFocus = useCallback(\n            (event: React.FocusEvent<HTMLInputElement>) => {\n                if (!readOnly) {\n                    setFocused(true);\n                }\n\n                if (onFocus) {\n                    onFocus(event);\n                }\n            },\n            [onFocus, readOnly],\n        );\n\n        const handleInputBlur = useCallback(\n            (event: React.FocusEvent<HTMLInputElement>) => {\n                setFocused(false);\n\n                if (onBlur) {\n                    onBlur(event);\n                }\n            },\n            [onBlur],\n        );\n\n        const handleInputChange = useCallback(\n            (event: React.ChangeEvent<HTMLInputElement>) => {\n                if (onChange) {\n                    onChange(event, { value: event.target.value });\n                }\n\n                if (uncontrolled) {\n                    setStateValue(event.target.value);\n                }\n            },\n            [onChange, uncontrolled],\n        );\n\n        const handleClear = useCallback(\n            (event: MouseEvent<HTMLButtonElement>) => {\n                if (!clearButtonVisible) return;\n\n                if (uncontrolled) {\n                    setStateValue('');\n                }\n\n                if (onClear) {\n                    onClear(event);\n                }\n\n                if (inputRef.current && !focused) {\n                    inputRef.current.focus();\n                }\n            },\n            [clearButtonVisible, focused, onClear, uncontrolled],\n        );\n\n        const renderRightAddons = () => {\n            const addonsVisible = clearButtonVisible || rightAddons || success;\n\n            return (\n                addonsVisible && (\n                    <Fragment>\n                        { clearButtonVisible && (\n                            <Button\n                                type=\"button\"\n                                view=\"ghost\"\n                                disabled={ disabled }\n                                aria-label=\"Очистить\"\n                                className={ styles.clearButton }\n                                onClick={ handleClear }\n                            >\n                                <span className={ styles.clearIcon } />\n                            </Button>\n                        ) }\n                        { success && !error && <span className={ styles.successIcon } /> }\n                        { rightAddons }\n                    </Fragment>\n                )\n            );\n        };\n\n        return (\n            <FormControl\n                ref={ wrapperRef }\n                className={ cn(className, focused && focusedClassName, filled && filledClassName) }\n                fieldClassName={ cn(fieldClassName, {\n                    [styles.focusVisible]: focusVisible,\n                }) }\n                labelClassName={ labelClassName }\n                addonsClassName={ addonsClassName }\n                size={ size }\n                block={ block }\n                required={ required }\n                disabled={ disabled }\n                filled={ filled || focused }\n                focused={ focused }\n                error={ error }\n                label={ label }\n                hint={ hint }\n                leftAddons={ leftAddons }\n                rightAddons={ renderRightAddons() }\n                bottomAddons={ bottomAddons }\n                onClick={ onClick }\n                onMouseDown={ onMouseDown }\n                onMouseUp={ onMouseUp }\n            >\n                <input\n                    { ...restProps }\n                    className={ cn(\n                        styles.input,\n                        {\n                            [styles.hasLabel]: label,\n                        },\n                        inputClassName,\n                    ) }\n                    disabled={ disabled }\n                    onBlur={ handleInputBlur }\n                    onFocus={ handleInputFocus }\n                    onChange={ handleInputChange }\n                    maxLength={ maxLength }\n                    ref={ mergeRefs([ref, inputRef]) }\n                    type={ type }\n                    value={ uncontrolled ? stateValue : value }\n                    readOnly={ readOnly }\n                    data-test-id={ dataTestId }\n                    data-error={ !!error }\n                    aria-label={ typeof label === 'string' ? label : undefined }\n                />\n            </FormControl>\n        );\n    },\n);\n\n/**\n * Для отображения в сторибуке\n */\nInput.defaultProps = {\n    type: 'text',\n    block: false,\n};\n"],"names":["Input","React","size","type","block","bottomAddons","dataTestId","clear","disabled","error","success","required","hint","className","fieldClassName","inputClassName","labelClassName","addonsClassName","focusedClassName","filledClassName","label","maxLength","leftAddons","onFocus","onBlur","onChange","onClear","onClick","onMouseDown","onMouseUp","rightAddons","value","defaultValue","wrapperRef","readOnly","restProps","ref","uncontrolled","inputRef","useRef","focusVisible","useFocus","focused","setFocused","useState","stateValue","setStateValue","filled","clearButtonVisible","handleInputFocus","useCallback","event","handleInputBlur","handleInputChange","handleClear","renderRightAddons","Fragment","jsx","Button","styles","FormControl","cn","mergeRefs"],"mappings":";;;;;;;;AAmKO,MAAMA,KAAQC,GAAM;AAAA,EACvB,CACI;AAAA,IACI,MAAAC,IAAO;AAAA,IACP,MAAAC,IAAO;AAAA,IACP,OAAAC,IAAQ;AAAA,IACR,cAAAC;AAAA,IACA,YAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,MAAAC;AAAA,IACA,WAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,YAAAC;AAAA,IACA,SAAAC;AAAA,IACA,QAAAC;AAAA,IACA,UAAAC;AAAA,IACA,SAAAC;AAAA,IACA,SAAAC;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,aAAAC;AAAA,IACA,OAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAEPC,MACC;AACD,UAAMC,IAAeN,MAAU,QAEzBO,IAAWC,GAAyB,IAAI,GAExC,CAACC,CAAY,IAAIC,GAASH,GAAU,UAAU,GAE9C,CAACI,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtC,CAACC,GAAYC,CAAa,IAAIF,EAASZ,KAAgB,EAAE,GAEzDe,IAAS,GAAQV,IAAeQ,IAAad,IAE7CiB,IAAqBzC,KAASwC,KAAU,CAACvC,KAAY,CAAC0B,GAEtDe,IAAmBC;AAAA,MACrB,CAACC,MAA8C;AAC3C,QAAKjB,KACDS,EAAW,EAAI,GAGfpB,KACAA,EAAQ4B,CAAK;AAAA,MAErB;AAAA,MACA,CAAC5B,GAASW,CAAQ;AAAA,IAAA,GAGhBkB,IAAkBF;AAAA,MACpB,CAACC,MAA8C;AAC3C,QAAAR,EAAW,EAAK,GAEZnB,KACAA,EAAO2B,CAAK;AAAA,MAEpB;AAAA,MACA,CAAC3B,CAAM;AAAA,IAAA,GAGL6B,IAAoBH;AAAA,MACtB,CAACC,MAA+C;AAC5C,QAAI1B,KACAA,EAAS0B,GAAO,EAAE,OAAOA,EAAM,OAAO,OAAO,GAG7Cd,KACAS,EAAcK,EAAM,OAAO,KAAK;AAAA,MAExC;AAAA,MACA,CAAC1B,GAAUY,CAAY;AAAA,IAAA,GAGrBiB,IAAcJ;AAAA,MAChB,CAACC,MAAyC;AACtC,QAAKH,MAEDX,KACAS,EAAc,EAAE,GAGhBpB,KACAA,EAAQyB,CAAK,GAGbb,EAAS,WAAW,CAACI,KACrBJ,EAAS,QAAQ,MAAA;AAAA,MAEzB;AAAA,MACA,CAACU,GAAoBN,GAAShB,GAASW,CAAY;AAAA,IAAA,GAGjDkB,KAAoB,OACAP,KAAsBlB,KAAepB,yBAIlD8C,IAAA,EACK,UAAA;AAAA,MAAAR,KACE,gBAAAS;AAAA,QAACC;AAAA,QAAA;AAAA,UACG,MAAK;AAAA,UACL,MAAK;AAAA,UACL,UAAAlD;AAAA,UACA,cAAW;AAAA,UACX,WAAYmD,EAAO;AAAA,UACnB,SAAUL;AAAA,UAEV,UAAA,gBAAAG,EAAC,QAAA,EAAK,WAAYE,EAAO,UAAA,CAAY;AAAA,QAAA;AAAA,MAAA;AAAA,MAG3CjD,KAAW,CAACD,uBAAU,QAAA,EAAK,WAAYkD,EAAO,aAAc;AAAA,MAC5D7B;AAAA,IAAA,GACN;AAKZ,WACI,gBAAA2B;AAAA,MAACG;AAAA,MAAA;AAAA,QACG,KAAM3B;AAAA,QACN,WAAY4B,EAAGhD,GAAW6B,KAAWxB,GAAkB6B,KAAU5B,CAAe;AAAA,QAChF,gBAAiB0C,EAAG/C,GAAgB;AAAA,UAChC,CAAC6C,EAAO,YAAY,GAAGnB;AAAA,QAAA,CAC1B;AAAA,QACD,gBAAAxB;AAAA,QACA,iBAAAC;AAAA,QACA,MAAAf;AAAA,QACA,OAAAE;AAAA,QACA,UAAAO;AAAA,QACA,UAAAH;AAAA,QACA,QAASuC,KAAUL;AAAA,QACnB,SAAAA;AAAA,QACA,OAAAjC;AAAA,QACA,OAAAW;AAAA,QACA,MAAAR;AAAA,QACA,YAAAU;AAAA,QACA,aAAciC,GAAA;AAAA,QACd,cAAAlD;AAAA,QACA,SAAAsB;AAAA,QACA,aAAAC;AAAA,QACA,WAAAC;AAAA,QAEA,UAAA,gBAAA4B;AAAA,UAAC;AAAA,UAAA;AAAA,YACK,GAAGtB;AAAA,YACL,WAAY0B;AAAA,cACRF,EAAO;AAAA,cACP;AAAA,gBACI,CAACA,EAAO,QAAQ,GAAGvC;AAAA,cAAA;AAAA,cAEvBL;AAAA,YAAA;AAAA,YAEJ,UAAAP;AAAA,YACA,QAAS4C;AAAA,YACT,SAAUH;AAAA,YACV,UAAWI;AAAA,YACX,WAAAhC;AAAA,YACA,KAAMyC,GAAU,CAAC1B,GAAKE,CAAQ,CAAC;AAAA,YAC/B,MAAAnC;AAAA,YACA,OAAQkC,IAAeQ,IAAad;AAAA,YACpC,UAAAG;AAAA,YACA,gBAAe5B;AAAA,YACf,cAAa,CAAC,CAACG;AAAA,YACf,cAAa,OAAOW,KAAU,WAAWA,IAAQ;AAAA,UAAA;AAAA,QAAA;AAAA,MACrD;AAAA,IAAA;AAAA,EAGZ;AACJ;AAKApB,GAAM,eAAe;AAAA,EACjB,MAAM;AAAA,EACN,OAAO;AACX;"}
+{"version":3,"file":"component.js","sources":["../../src/input/component.tsx"],"sourcesContent":["import React, {\n    ChangeEvent,\n    Fragment,\n    InputHTMLAttributes,\n    MouseEvent,\n    useCallback,\n    useRef,\n    useState,\n} from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { Button } from '../button';\nimport { FormControl } from '../form-control';\nimport { useFocus } from '../hooks/useFocus';\n\nimport styles from './index.module.css';\n\nexport type InputProps = Omit<\n    InputHTMLAttributes<HTMLInputElement>,\n    'size' | 'type' | 'value' | 'defaultValue' | 'onChange' | 'onClick' | 'onMouseDown'\n> & {\n    /**\n     * Значение поля ввода\n     */\n    value?: string;\n\n    /**\n     * Начальное значение поля\n     */\n    defaultValue?: string;\n\n    /**\n     * Растягивает компонент на ширину контейнера\n     */\n    block?: boolean;\n\n    /**\n     * required - индикатор * лейбла для обязательного заполнения поля\n     */\n    required?: boolean;\n\n    /**\n     * Крестик для очистки поля\n     */\n    clear?: boolean;\n\n    /**\n     * Размер компонента\n     */\n    size?: 's' | 'm' | 'l';\n\n    /**\n     * Отображение ошибки\n     */\n    error?: string | boolean;\n\n    /**\n     * Отображение иконки успеха\n     */\n    success?: boolean;\n\n    /**\n     * Текст подсказки\n     */\n    hint?: string;\n\n    /**\n     * Лейбл компонента\n     */\n    label?: React.ReactNode;\n\n    /**\n     * Атрибут type\n     */\n    type?: 'number' | 'card' | 'email' | 'money' | 'password' | 'tel' | 'text';\n\n    /**\n     * Ref для обертки input\n     */\n    wrapperRef?: React.Ref<HTMLDivElement>;\n\n    /**\n     * Слот слева\n     */\n    leftAddons?: React.ReactNode;\n\n    /**\n     * Слот справа\n     */\n    rightAddons?: React.ReactNode;\n\n    /**\n     * Слот под инпутом\n     */\n    bottomAddons?: React.ReactNode;\n\n    /**\n     * Дополнительный класс\n     */\n    className?: string;\n\n    /**\n     * Дополнительный класс для поля\n     */\n    fieldClassName?: string;\n\n    /**\n     * Дополнительный класс инпута\n     */\n    inputClassName?: string;\n\n    /**\n     * Дополнительный класс для лейбла\n     */\n    labelClassName?: string;\n\n    /**\n     * Дополнительный класс для аддонов\n     */\n    addonsClassName?: string;\n\n    /**\n     * Класс, который будет установлен при фокусе\n     */\n    focusedClassName?: string;\n\n    /**\n     * Класс, который будет установлен, если в поле есть значение\n     */\n    filledClassName?: string;\n\n    /**\n     * Обработчик поля ввода\n     */\n    onChange?: (event: ChangeEvent<HTMLInputElement>, payload: { value: string }) => void;\n\n    /**\n     * Обработчик нажатия на кнопку очистки\n     */\n    onClear?: (event: MouseEvent<HTMLButtonElement>) => void;\n\n    /**\n     * Обработчик клика по полю\n     */\n    onClick?: (event: MouseEvent<HTMLDivElement>) => void;\n\n    /**\n     * Обработчик MouseDown по полю\n     */\n    onMouseDown?: (event: MouseEvent<HTMLDivElement>) => void;\n\n    /**\n     * Обработчик MouseUp по полю\n     */\n    onMouseUp?: (event: MouseEvent<HTMLDivElement>) => void;\n\n    /**\n     * Идентификатор для систем автоматизированного тестирования\n     */\n    dataTestId?: string;\n};\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n    (\n        {\n            size = 'm',\n            type = 'text',\n            block = false,\n            bottomAddons,\n            dataTestId,\n            clear = false,\n            disabled,\n            error,\n            success,\n            required,\n            hint,\n            className,\n            fieldClassName,\n            inputClassName,\n            labelClassName,\n            addonsClassName,\n            focusedClassName,\n            filledClassName,\n            label,\n            maxLength = 100,\n            leftAddons,\n            onFocus,\n            onBlur,\n            onChange,\n            onClear,\n            onClick,\n            onMouseDown,\n            onMouseUp,\n            rightAddons,\n            value,\n            defaultValue,\n            wrapperRef,\n            readOnly,\n            ...restProps\n        },\n        ref,\n    ) => {\n        const uncontrolled = value === undefined;\n\n        const inputRef = useRef<HTMLInputElement>(null);\n\n        const [focusVisible] = useFocus(inputRef, 'keyboard');\n\n        const [focused, setFocused] = useState(false);\n        const [stateValue, setStateValue] = useState(defaultValue || '');\n\n        const filled = Boolean(uncontrolled ? stateValue : value);\n        // отображаем крестик только для заполненного и активного инпута\n        const clearButtonVisible = clear && filled && !disabled && !readOnly;\n\n        const handleInputFocus = useCallback(\n            (event: React.FocusEvent<HTMLInputElement>) => {\n                if (!readOnly) {\n                    setFocused(true);\n                }\n\n                if (onFocus) {\n                    onFocus(event);\n                }\n            },\n            [onFocus, readOnly],\n        );\n\n        const handleInputBlur = useCallback(\n            (event: React.FocusEvent<HTMLInputElement>) => {\n                setFocused(false);\n\n                if (onBlur) {\n                    onBlur(event);\n                }\n            },\n            [onBlur],\n        );\n\n        const handleInputChange = useCallback(\n            (event: React.ChangeEvent<HTMLInputElement>) => {\n                if (onChange) {\n                    onChange(event, { value: event.target.value });\n                }\n\n                if (uncontrolled) {\n                    setStateValue(event.target.value);\n                }\n            },\n            [onChange, uncontrolled],\n        );\n\n        const handleClear = useCallback(\n            (event: MouseEvent<HTMLButtonElement>) => {\n                if (!clearButtonVisible) return;\n\n                if (uncontrolled) {\n                    setStateValue('');\n                }\n\n                if (onClear) {\n                    onClear(event);\n                }\n\n                if (inputRef.current && !focused) {\n                    inputRef.current.focus();\n                }\n            },\n            [clearButtonVisible, focused, onClear, uncontrolled],\n        );\n\n        const renderRightAddons = () => {\n            const addonsVisible = clearButtonVisible || rightAddons || success;\n\n            return (\n                addonsVisible && (\n                    <Fragment>\n                        { clearButtonVisible && (\n                            <Button\n                                type=\"button\"\n                                view=\"ghost\"\n                                disabled={ disabled }\n                                aria-label=\"Очистить\"\n                                className={ styles.clearButton }\n                                onClick={ handleClear }\n                            >\n                                <span className={ styles.clearIcon } />\n                            </Button>\n                        ) }\n                        { success && !error && <span className={ styles.successIcon } /> }\n                        { rightAddons }\n                    </Fragment>\n                )\n            );\n        };\n\n        return (\n            <FormControl\n                ref={ wrapperRef }\n                className={ cn(className, focused && focusedClassName, filled && filledClassName) }\n                fieldClassName={ cn(fieldClassName, {\n                    [styles.focusVisible]: focusVisible,\n                }) }\n                labelClassName={ labelClassName }\n                addonsClassName={ addonsClassName }\n                size={ size }\n                block={ block }\n                required={ required }\n                disabled={ disabled }\n                filled={ filled || focused }\n                focused={ focused }\n                error={ error }\n                label={ label }\n                hint={ hint }\n                leftAddons={ leftAddons }\n                rightAddons={ renderRightAddons() }\n                bottomAddons={ bottomAddons }\n                onClick={ onClick }\n                onMouseDown={ onMouseDown }\n                onMouseUp={ onMouseUp }\n            >\n                <input\n                    { ...restProps }\n                    className={ cn(\n                        styles.input,\n                        {\n                            [styles.hasLabel]: label,\n                        },\n                        inputClassName,\n                    ) }\n                    disabled={ disabled }\n                    onBlur={ handleInputBlur }\n                    onFocus={ handleInputFocus }\n                    onChange={ handleInputChange }\n                    maxLength={ maxLength }\n                    ref={ mergeRefs([ref, inputRef]) }\n                    type={ type }\n                    value={ uncontrolled ? stateValue : value }\n                    readOnly={ readOnly }\n                    data-test-id={ dataTestId }\n                    data-error={ !!error }\n                    aria-label={ typeof label === 'string' ? label : undefined }\n                />\n            </FormControl>\n        );\n    },\n);\n\n"],"names":["Input","React","size","type","block","bottomAddons","dataTestId","clear","disabled","error","success","required","hint","className","fieldClassName","inputClassName","labelClassName","addonsClassName","focusedClassName","filledClassName","label","maxLength","leftAddons","onFocus","onBlur","onChange","onClear","onClick","onMouseDown","onMouseUp","rightAddons","value","defaultValue","wrapperRef","readOnly","restProps","ref","uncontrolled","inputRef","useRef","focusVisible","useFocus","focused","setFocused","useState","stateValue","setStateValue","filled","clearButtonVisible","handleInputFocus","useCallback","event","handleInputBlur","handleInputChange","handleClear","renderRightAddons","Fragment","jsx","Button","styles","FormControl","cn","mergeRefs"],"mappings":"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"}

package/dist/input/index.module.css

@@ -1 +1 @@
-:root{--text-primary-color: var(--color-text-primary);--text-secondary-color: var(--color-text-secondary);--text-tertiary-color: var(--color-text-tertiary);--border-radius: 4px;--focus-color: var(--color-border-link);--font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, sans-serif;--disabled-cursor: not-allowed;--arrow-transform: rotate(180deg)}:root{--input-clear-icon: url(https://alfabank.st/icons/glyph_cross-circle_m.svg);--input-color: var(--color-text-primary);--input-placeholder-color: var(--color-text-secondary);--input-focus-placeholder-color: var(--color-text-tertiary);--input-with-label-placeholder-color: var(--color-text-tertiary);--input-error-icon-display: flex;--input-success-icon-display: flex;--input-error-icon: url(https://alfabank.st/icons/icon_error_s_color.svg);--input-success-icon: url(https://alfabank.st/icons/icon_ok_s_color.svg);--input-disabled-color: var(--color-text-secondary);--input-read-only-color: var(--color-text-secondary)}.input_XkSq{font-size:16px!important;line-height:20px;font-weight:400;font-family:var(--font-family);position:relative;display:block;width:100%;height:100%;color:var(--input-color);background:none;border:none;margin:0;outline:none;text-overflow:ellipsis;box-sizing:border-box;-webkit-appearance:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.input_XkSq::placeholder{transition:opacity .2s ease,color .2s ease;color:var(--input-placeholder-color)}.hasLabel_3lW-::placeholder{opacity:0;color:var(--input-with-label-placeholder-color)}.block_Lq9-{width:100%}.clearIcon_951a{width:24px;height:24px;background-repeat:no-repeat;background-position:50% 50%;display:block;background-image:var(--input-clear-icon);opacity:.3;transition:opacity .2s ease}.clearIcon_951a:hover{opacity:.6}.clearIcon_951a:active{opacity:1}.errorIcon_Z4ac{width:24px;height:24px;background-repeat:no-repeat;background-position:50% 50%;display:var(--input-error-icon-display);background-image:url(https://alfabank.st/icons/icon_error_s_color.svg)}.successIcon_yfoM{width:24px;height:24px;background-repeat:no-repeat;background-position:50% 50%;display:var(--input-success-icon-display);background-image:url(https://alfabank.st/icons/icon_ok_s_color.svg)}.input_XkSq:disabled{cursor:var(--disabled-cursor);color:var(--input-disabled-color)}.input_XkSq:focus.hasLabel_3lW-::placeholder{opacity:1}.input_XkSq:focus::placeholder{color:var(--input-focus-placeholder-color)}.focusVisible_3hin{outline:2px solid var(--focus-color);outline-offset:2px}.input_XkSq:read-only{cursor:var(--disabled-cursor);color:var(--input-read-only-color)}.input_XkSq:read-only:focus::placeholder{color:var(--input-placeholder-color)}.hasLabel_3lW-:read-only:focus::placeholder{opacity:0}.input_XkSq::-ms-clear{display:none;width:0;height:0}.input_XkSq:-webkit-autofill,.input_XkSq:-webkit-autofill:hover,.input_XkSq:-webkit-autofill:focus,.input_XkSq:-webkit-autofill:active{-webkit-transition:background-color 999999s ease-in-out 0s;transition:background-color 999999s ease-in-out 0s;-webkit-box-shadow:0 0 0 30px #ffffff00 inset!important}
+:root{--text-primary-color: var(--color-text-primary);--text-secondary-color: var(--color-text-secondary);--text-tertiary-color: var(--color-text-tertiary);--border-radius: 4px;--focus-color: var(--color-border-link);--font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, sans-serif;--disabled-cursor: not-allowed;--arrow-transform: rotate(180deg)}:root{--input-clear-icon: url(https://alfabank.st/icons/glyph_cross-circle_m.svg);--input-color: var(--color-text-primary);--input-placeholder-color: color-mix(in srgb, var(--color-text-secondary) 35%, transparent);--input-focus-placeholder-color: color-mix(in srgb, var(--color-text-tertiary) 35%, transparent);--input-with-label-placeholder-color: color-mix(in srgb, var(--color-text-tertiary) 35%, transparent);--input-error-icon-display: flex;--input-success-icon-display: flex;--input-error-icon: url(https://alfabank.st/icons/icon_error_s_color.svg);--input-success-icon: url(https://alfabank.st/icons/icon_ok_s_color.svg);--input-disabled-color: var(--color-text-secondary);--input-read-only-color: var(--color-text-secondary)}.input_XkSq{font-size:16px!important;line-height:20px;font-weight:400;font-family:var(--font-family);position:relative;display:block;width:100%;height:100%;color:var(--input-color);background:none;border:none;margin:0;outline:none;text-overflow:ellipsis;box-sizing:border-box;-webkit-appearance:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.input_XkSq::placeholder{transition:opacity .2s ease,color .2s ease;color:var(--input-placeholder-color)}.hasLabel_3lW-::placeholder{opacity:0;color:var(--input-with-label-placeholder-color)}.block_Lq9-{width:100%}.clearIcon_951a{width:24px;height:24px;background-repeat:no-repeat;background-position:50% 50%;display:block;background-image:var(--input-clear-icon);opacity:.3;transition:opacity .2s ease}.clearIcon_951a:hover{opacity:.6}.clearIcon_951a:active{opacity:1}.errorIcon_Z4ac{width:24px;height:24px;background-repeat:no-repeat;background-position:50% 50%;display:var(--input-error-icon-display);background-image:url(https://alfabank.st/icons/icon_error_s_color.svg)}.successIcon_yfoM{width:24px;height:24px;background-repeat:no-repeat;background-position:50% 50%;display:var(--input-success-icon-display);background-image:url(https://alfabank.st/icons/icon_ok_s_color.svg)}.input_XkSq:disabled{cursor:var(--disabled-cursor);color:var(--input-disabled-color)}.input_XkSq:focus.hasLabel_3lW-::placeholder{opacity:1}.input_XkSq:focus::placeholder{color:var(--input-focus-placeholder-color)}.focusVisible_3hin{outline:2px solid var(--focus-color);outline-offset:2px}.input_XkSq:read-only{cursor:var(--disabled-cursor);color:var(--input-read-only-color)}.input_XkSq:read-only:focus::placeholder{color:var(--input-placeholder-color)}.hasLabel_3lW-:read-only:focus::placeholder{opacity:0}.input_XkSq::-ms-clear{display:none;width:0;height:0}.input_XkSq:-webkit-autofill,.input_XkSq:-webkit-autofill:hover,.input_XkSq:-webkit-autofill:focus,.input_XkSq:-webkit-autofill:active{-webkit-transition:background-color 999999s ease-in-out 0s;transition:background-color 999999s ease-in-out 0s;-webkit-box-shadow:0 0 0 30px #ffffff00 inset!important}

package/dist/input-autocomplete/autocomplete-field/index.d.ts

@@ -1,4 +1,5 @@
+import { default as React } from 'react';
 import { SelectFieldProps } from '../../select';
 import { InputAutocompleteProps } from '../component';
 export type AutocompleteFieldProps = SelectFieldProps & Pick<InputAutocompleteProps, 'Input' | 'inputProps' | 'value' | 'onInput' | 'readOnly'>;
-export declare const AutocompleteField: ({ label, placeholder, Arrow, Input, value, error, success, hint, disabled, readOnly, onInput, inputProps, innerProps, }: AutocompleteFieldProps) => JSX.Element;
+export declare const AutocompleteField: ({ label, placeholder, Arrow, Input, value, error, success, hint, disabled, readOnly, onInput, inputProps, innerProps, }: AutocompleteFieldProps) => React.JSX.Element;

package/dist/input-autocomplete/autocomplete-field/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/input-autocomplete/autocomplete-field/index.tsx"],"sourcesContent":["import React, { useCallback, useRef } from 'react';\nimport cn from 'classnames';\nimport { Input as DefaultInput } from '../../input';\nimport { SelectFieldProps } from '../../select';\nimport mergeRefs from 'react-merge-refs';\nimport { InputAutocompleteProps } from '../component';\n\nimport styles from './index.module.css';\n\nexport type AutocompleteFieldProps = SelectFieldProps &\n    Pick<InputAutocompleteProps, 'Input' | 'inputProps' | 'value' | 'onInput' | 'readOnly'>;\n\nexport const AutocompleteField = ({\n    label,\n    placeholder,\n    Arrow,\n    Input = DefaultInput,\n    value,\n    error,\n    success,\n    hint,\n    disabled,\n    readOnly,\n    onInput,\n    inputProps = {},\n    innerProps,\n}: AutocompleteFieldProps) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    const { onClick, onFocus } = innerProps;\n\n    const inputDisabled = disabled || readOnly;\n\n    const handleClick = useCallback(\n        event => {\n            if (onClick) onClick(event);\n\n            if (inputRef.current) {\n                inputRef.current.focus();\n            }\n        },\n        [onClick],\n    );\n    return (\n        <Input\n            {...inputProps}\n            {...innerProps}\n            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore\n            // @ts-ignore\n            wrapperRef={mergeRefs([innerProps.ref, inputProps.wrapperRef])}\n            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore\n            // @ts-ignore\n            ref={mergeRefs([inputRef, inputProps.ref])}\n            disabled={disabled}\n            readOnly={readOnly}\n            block={true}\n            label={label}\n            placeholder={placeholder}\n            error={error}\n            success={success}\n            hint={hint}\n            onChange={onInput}\n            onClick={inputDisabled ? undefined : handleClick}\n            onFocus={inputDisabled ? undefined : onFocus}\n            autoComplete='off'\n            value={value}\n            rightAddons={\n                (Arrow || inputProps.rightAddons) && (\n                    <React.Fragment>\n                        {inputProps.rightAddons}\n                        {Arrow && (\n                            <span\n                                className={cn(styles.arrow, {\n                                    [styles.error]: error,\n                                })}\n                            >\n                                {Arrow}\n                            </span>\n                        )}\n                    </React.Fragment>\n                )\n            }\n        />\n    );\n};\n"],"names":["AutocompleteField","label","placeholder","Arrow","Input","DefaultInput","value","error","success","hint","disabled","readOnly","onInput","inputProps","innerProps","inputRef","useRef","onClick","onFocus","inputDisabled","handleClick","useCallback","event","jsx","mergeRefs","jsxs","React","cn","styles"],"mappings":";;;;;;AAYO,MAAMA,IAAoB,CAAC;AAAA,EAC9B,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EAAA,OACAC,IAAQC;AAAAA,EACR,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,YAAAC,IAAa,CAAA;AAAA,EACb,YAAAC;AACJ,MAA8B;AAC1B,QAAMC,IAAWC,EAAyB,IAAI,GAExC,EAAE,SAAAC,GAAS,SAAAC,EAAA,IAAYJ,GAEvBK,IAAgBT,KAAYC,GAE5BS,IAAcC;AAAA,IAChB,CAAAC,MAAS;AACL,MAAIL,OAAiBK,CAAK,GAEtBP,EAAS,WACTA,EAAS,QAAQ,MAAA;AAAA,IAEzB;AAAA,IACA,CAACE,CAAO;AAAA,EAAA;AAEZ,SACI,gBAAAM;AAAA,IAACnB;AAAAA,IAAA;AAAA,MACI,GAAGS;AAAA,MACH,GAAGC;AAAA,MAGJ,YAAYU,EAAU,CAACV,EAAW,KAAKD,EAAW,UAAU,CAAC;AAAA,MAG7D,KAAKW,EAAU,CAACT,GAAUF,EAAW,GAAG,CAAC;AAAA,MACzC,UAAAH;AAAA,MACA,UAAAC;AAAA,MACA,OAAO;AAAA,MACP,OAAAV;AAAA,MACA,aAAAC;AAAA,MACA,OAAAK;AAAA,MACA,SAAAC;AAAA,MACA,MAAAC;AAAA,MACA,UAAUG;AAAA,MACV,SAASO,IAAgB,SAAYC;AAAA,MACrC,SAASD,IAAgB,SAAYD;AAAA,MACrC,cAAa;AAAA,MACb,OAAAZ;AAAA,MACA,cACKH,KAASU,EAAW,gBACjB,gBAAAY,EAACC,EAAM,UAAN,EACI,UAAA;AAAA,QAAAb,EAAW;AAAA,QACXV,KACG,gBAAAoB;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAWI,EAAGC,EAAO,OAAO;AAAA,cACxB,CAACA,EAAO,KAAK,GAAGrB;AAAA,YAAA,CACnB;AAAA,YAEA,UAAAJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACL,EAAA,CAER;AAAA,IAAA;AAAA,EAAA;AAKpB;"}
+{"version":3,"file":"index.js","sources":["../../../src/input-autocomplete/autocomplete-field/index.tsx"],"sourcesContent":["import React, { useCallback, useRef } from 'react';\nimport cn from 'classnames';\nimport { Input as DefaultInput } from '../../input';\nimport { SelectFieldProps } from '../../select';\nimport mergeRefs from 'react-merge-refs';\nimport { InputAutocompleteProps } from '../component';\n\nimport styles from './index.module.css';\n\nexport type AutocompleteFieldProps = SelectFieldProps &\n    Pick<InputAutocompleteProps, 'Input' | 'inputProps' | 'value' | 'onInput' | 'readOnly'>;\n\nexport const AutocompleteField = ({\n    label,\n    placeholder,\n    Arrow,\n    Input = DefaultInput,\n    value,\n    error,\n    success,\n    hint,\n    disabled,\n    readOnly,\n    onInput,\n    inputProps = {},\n    innerProps,\n}: AutocompleteFieldProps) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    const { onClick, onFocus } = innerProps;\n\n    const inputDisabled = disabled || readOnly;\n\n    const handleClick = useCallback(\n        (event: React.MouseEvent<HTMLDivElement>) => {\n            if (onClick) onClick(event);\n\n            if (inputRef.current) {\n                inputRef.current.focus();\n            }\n        },\n        [onClick],\n    );\n    return (\n        <Input\n            {...inputProps}\n            {...innerProps}\n            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore\n            // @ts-ignore\n            wrapperRef={mergeRefs([innerProps.ref, inputProps.wrapperRef])}\n            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore\n            // @ts-ignore\n            ref={mergeRefs([inputRef, inputProps.ref])}\n            disabled={disabled}\n            readOnly={readOnly}\n            block={true}\n            label={label}\n            placeholder={placeholder}\n            error={error}\n            success={success}\n            hint={hint}\n            onChange={onInput}\n            onClick={inputDisabled ? undefined : handleClick}\n            onFocus={inputDisabled ? undefined : onFocus}\n            autoComplete='off'\n            value={value}\n            rightAddons={\n                (Arrow || inputProps.rightAddons) && (\n                    <React.Fragment>\n                        {inputProps.rightAddons}\n                        {Arrow && (\n                            <span\n                                className={cn(styles.arrow, {\n                                    [styles.error]: error,\n                                })}\n                            >\n                                {Arrow}\n                            </span>\n                        )}\n                    </React.Fragment>\n                )\n            }\n        />\n    );\n};\n"],"names":["AutocompleteField","label","placeholder","Arrow","Input","DefaultInput","value","error","success","hint","disabled","readOnly","onInput","inputProps","innerProps","inputRef","useRef","onClick","onFocus","inputDisabled","handleClick","useCallback","event","jsx","mergeRefs","jsxs","React","cn","styles"],"mappings":";;;;;;AAYO,MAAMA,IAAoB,CAAC;AAAA,EAC9B,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EAAA,OACAC,IAAQC;AAAAA,EACR,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,YAAAC,IAAa,CAAA;AAAA,EACb,YAAAC;AACJ,MAA8B;AAC1B,QAAMC,IAAWC,EAAyB,IAAI,GAExC,EAAE,SAAAC,GAAS,SAAAC,EAAA,IAAYJ,GAEvBK,IAAgBT,KAAYC,GAE5BS,IAAcC;AAAA,IAChB,CAACC,MAA4C;AACzC,MAAIL,OAAiBK,CAAK,GAEtBP,EAAS,WACTA,EAAS,QAAQ,MAAA;AAAA,IAEzB;AAAA,IACA,CAACE,CAAO;AAAA,EAAA;AAEZ,SACI,gBAAAM;AAAA,IAACnB;AAAAA,IAAA;AAAA,MACI,GAAGS;AAAA,MACH,GAAGC;AAAA,MAGJ,YAAYU,EAAU,CAACV,EAAW,KAAKD,EAAW,UAAU,CAAC;AAAA,MAG7D,KAAKW,EAAU,CAACT,GAAUF,EAAW,GAAG,CAAC;AAAA,MACzC,UAAAH;AAAA,MACA,UAAAC;AAAA,MACA,OAAO;AAAA,MACP,OAAAV;AAAA,MACA,aAAAC;AAAA,MACA,OAAAK;AAAA,MACA,SAAAC;AAAA,MACA,MAAAC;AAAA,MACA,UAAUG;AAAA,MACV,SAASO,IAAgB,SAAYC;AAAA,MACrC,SAASD,IAAgB,SAAYD;AAAA,MACrC,cAAa;AAAA,MACb,OAAAZ;AAAA,MACA,cACKH,KAASU,EAAW,gBACjB,gBAAAY,EAACC,EAAM,UAAN,EACI,UAAA;AAAA,QAAAb,EAAW;AAAA,QACXV,KACG,gBAAAoB;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAWI,EAAGC,EAAO,OAAO;AAAA,cACxB,CAACA,EAAO,KAAK,GAAGrB;AAAA,YAAA,CACnB;AAAA,YAEA,UAAAJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACL,EAAA,CAER;AAAA,IAAA;AAAA,EAAA;AAKpB;"}

package/dist/input-autocomplete/component.d.ts

@@ -31,7 +31,7 @@ export type InputAutocompleteProps = Omit<BaseSelectProps, 'Field' | 'nativeSele
      */
     updatePopover?: BaseSelectProps['updatePopover'];
 };
-export declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "nativeSelect" | "Field"> & {
+export declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "Field" | "nativeSelect"> & {
     /**
      * Компонент ввода значения
      */
@@ -60,7 +60,7 @@ export declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<Bas
         addonsClassName?: string | undefined;
         focusedClassName?: string | undefined;
         filledClassName?: string | undefined;
-        onChange?: ((event: React.ChangeEvent<HTMLInputElement>, payload: {
+        onChange?: ((event: React.ChangeEvent<HTMLInputElement, Element>, payload: {
             value: string;
         }) => void) | undefined;
         onClear?: ((event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined;
@@ -97,7 +97,7 @@ export declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<Bas
         addonsClassName?: string | undefined;
         focusedClassName?: string | undefined;
         filledClassName?: string | undefined;
-        onChange?: ((event: React.ChangeEvent<HTMLInputElement>, payload: {
+        onChange?: ((event: React.ChangeEvent<HTMLInputElement, Element>, payload: {
             value: string;
         }) => void) | undefined;
         onClear?: ((event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined;

package/dist/input-ghost/component.d.ts

@@ -7,4 +7,4 @@ export interface InputGhostProps {
     block?: boolean;
     size?: 's' | 'm';
 }
-export declare const InputGhost: ({ value, onChange, placeholder, leftAddons, block, size, }: InputGhostProps) => JSX.Element;
+export declare const InputGhost: ({ value, onChange, placeholder, leftAddons, block, size, }: InputGhostProps) => React.JSX.Element;

package/dist/masked-input/component.d.ts

@@ -39,7 +39,7 @@ export declare const MaskedInput: React.ForwardRefExoticComponent<Omit<React.Inp
     addonsClassName?: string | undefined;
     focusedClassName?: string | undefined;
     filledClassName?: string | undefined;
-    onChange?: ((event: React.ChangeEvent<HTMLInputElement>, payload: {
+    onChange?: ((event: React.ChangeEvent<HTMLInputElement, Element>, payload: {
         value: string;
     }) => void) | undefined;
     onClear?: ((event: React.MouseEvent<HTMLButtonElement, globalThis.MouseEvent>) => void) | undefined;

package/dist/menu/component.d.ts

@@ -1,10 +1,10 @@
-import { default as React } from 'react';
+import { default as React, ReactElement, ReactNode } from 'react';
 import { TFunction } from '../modal';
 import { OptionShape } from '../select';
 export type MenuElement = {
     path: string;
     element: React.ReactNode;
-    icon?: JSX.Element;
+    icon?: ReactElement;
     title?: string;
 };
 export type MenuProps = {
@@ -20,5 +20,6 @@ export type MenuProps = {
     profileOnClick?: () => void;
     navigate: (path: string) => void;
     t: TFunction;
+    children?: ReactNode;
 };
 export declare const Menu: React.FC<MenuProps>;

package/dist/menu/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../src/menu/component.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { TFunction } from '../modal';\nimport { OptionShape } from '../select';\n\nimport { useMenu } from './hooks/use-menu';\nimport {\n    ContentHeader,\n    MenuAvatar,\n    MenuBackButton,\n    MenuButtonsList,\n    UserButton,\n} from './components';\n\nimport styles from './index.module.css';\n\nexport type MenuElement = {\n    path: string;\n    element: React.ReactNode;\n    icon?: JSX.Element;\n    title?: string;\n};\n\nexport type MenuProps = {\n    pathname: string;\n    routes: MenuElement[];\n    showBackButton?: boolean;\n\n    userName: string;\n    userImage: string;\n    userDialogOptions: OptionShape[];\n\n    profileTitle: string;\n    profileImage: string;\n    Link: unknown;\n    profileOnClick?: () => void;\n\n    navigate: (path: string) => void;\n    t: TFunction;\n};\n\nexport const Menu: React.FC<MenuProps> = ({\n    pathname,\n    children,\n    routes,\n    showBackButton,\n    userName,\n    userImage,\n    userDialogOptions,\n    profileTitle,\n    profileImage,\n    Link,\n    profileOnClick,\n    navigate,\n    t,\n}) => {\n    const {\n        staticMenu, setStaticMenu, showMenu, ref,\n    } = useMenu();\n\n    const showLabels = staticMenu || showMenu;\n\n    const currentPath = `/${pathname.split('/').slice(-1)[0]}`;\n\n    const onBackClick = () => navigate('/app/calendar');\n\n    const menuStyles = cn(styles.left_menu, {\n        [styles.menu_static]: staticMenu,\n        [styles.hidden_menu_opened]: showMenu,\n    });\n\n    const contentWrapperStyles = cn(styles.content_wrapper, {\n        [styles.content_offseted]: staticMenu,\n        [styles.calendar_view]: pathname.startsWith('/app/calendar'),\n    });\n\n    return (\n        <div className={ cn(styles.layout_wrapper) }>\n            <div ref={ ref } className={ menuStyles }>\n                <MenuAvatar\n                    title={ profileTitle }\n                    showTitle={ showLabels }\n                    image={ profileImage }\n                    onClick={ profileOnClick }\n                />\n\n                { showBackButton && <MenuBackButton showTitle={ showLabels } onClick={ onBackClick } /> }\n\n                <MenuButtonsList\n                    routes={ routes }\n                    showLabels={ showLabels }\n                    currentPath={ currentPath }\n                    Link={ Link }\n                    t={ t }\n                />\n            </div>\n\n            <div className={ contentWrapperStyles }>\n                <div className={ styles.content_header }>\n                    <ContentHeader\n                        onClick={ () => setStaticMenu(!staticMenu) }\n                        title={ t(`menu.${currentPath}`) }\n                    />\n\n                    <UserButton photo={ userImage } fullName={ userName } options={ userDialogOptions } />\n                </div>\n\n                { children }\n            </div>\n        </div>\n    );\n};\n"],"names":["Menu","pathname","children","routes","showBackButton","userName","userImage","userDialogOptions","profileTitle","profileImage","Link","profileOnClick","navigate","t","staticMenu","setStaticMenu","showMenu","ref","useMenu","showLabels","currentPath","onBackClick","menuStyles","cn","styles","contentWrapperStyles","jsxs","jsx","MenuAvatar","MenuBackButton","MenuButtonsList","ContentHeader","UserButton"],"mappings":";;;;;;;;;AA0CO,MAAMA,IAA4B,CAAC;AAAA,EACtC,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAAC;AACJ,MAAM;AACF,QAAM;AAAA,IACF,YAAAC;AAAA,IAAY,eAAAC;AAAA,IAAe,UAAAC;AAAA,IAAU,KAAAC;AAAA,EAAA,IACrCC,EAAA,GAEEC,IAAaL,KAAcE,GAE3BI,IAAc,IAAInB,EAAS,MAAM,GAAG,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC,IAElDoB,IAAc,MAAMT,EAAS,eAAe,GAE5CU,IAAaC,EAAGC,EAAO,WAAW;AAAA,IACpC,CAACA,EAAO,WAAW,GAAGV;AAAA,IACtB,CAACU,EAAO,kBAAkB,GAAGR;AAAA,EAAA,CAChC,GAEKS,IAAuBF,EAAGC,EAAO,iBAAiB;AAAA,IACpD,CAACA,EAAO,gBAAgB,GAAGV;AAAA,IAC3B,CAACU,EAAO,aAAa,GAAGvB,EAAS,WAAW,eAAe;AAAA,EAAA,CAC9D;AAED,2BACK,OAAA,EAAI,WAAYsB,EAAGC,EAAO,cAAc,GACrC,UAAA;AAAA,IAAA,gBAAAE,EAAC,OAAA,EAAI,KAAAT,GAAY,WAAYK,GACzB,UAAA;AAAA,MAAA,gBAAAK;AAAA,QAACC;AAAA,QAAA;AAAA,UACG,OAAQpB;AAAA,UACR,WAAYW;AAAA,UACZ,OAAQV;AAAA,UACR,SAAUE;AAAA,QAAA;AAAA,MAAA;AAAA,MAGZP,KAAkB,gBAAAuB,EAACE,GAAA,EAAe,WAAYV,GAAa,SAAUE,GAAc;AAAA,MAErF,gBAAAM;AAAA,QAACG;AAAA,QAAA;AAAA,UACG,QAAA3B;AAAA,UACA,YAAAgB;AAAA,UACA,aAAAC;AAAA,UACA,MAAAV;AAAA,UACA,GAAAG;AAAA,QAAA;AAAA,MAAA;AAAA,IACJ,GACJ;AAAA,IAEA,gBAAAa,EAAC,OAAA,EAAI,WAAYD,GACb,UAAA;AAAA,MAAA,gBAAAC,EAAC,OAAA,EAAI,WAAYF,EAAO,gBACpB,UAAA;AAAA,QAAA,gBAAAG;AAAA,UAACI;AAAA,UAAA;AAAA,YACG,SAAU,MAAMhB,EAAc,CAACD,CAAU;AAAA,YACzC,OAAQD,EAAE,QAAQO,CAAW,EAAE;AAAA,UAAA;AAAA,QAAA;AAAA,0BAGlCY,GAAA,EAAW,OAAQ1B,GAAY,UAAWD,GAAW,SAAUE,EAAA,CAAoB;AAAA,MAAA,GACxF;AAAA,MAEEL;AAAA,IAAA,EAAA,CACN;AAAA,EAAA,GACJ;AAER;"}
+{"version":3,"file":"component.js","sources":["../../src/menu/component.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode } from 'react';\nimport cn from 'classnames';\n\nimport { TFunction } from '../modal';\nimport { OptionShape } from '../select';\n\nimport { useMenu } from './hooks/use-menu';\nimport {\n    ContentHeader,\n    MenuAvatar,\n    MenuBackButton,\n    MenuButtonsList,\n    UserButton,\n} from './components';\n\nimport styles from './index.module.css';\n\nexport type MenuElement = {\n    path: string;\n    element: React.ReactNode;\n    icon?: ReactElement;\n    title?: string;\n};\n\nexport type MenuProps = {\n    pathname: string;\n    routes: MenuElement[];\n    showBackButton?: boolean;\n\n    userName: string;\n    userImage: string;\n    userDialogOptions: OptionShape[];\n\n    profileTitle: string;\n    profileImage: string;\n    Link: unknown;\n    profileOnClick?: () => void;\n\n    navigate: (path: string) => void;\n    t: TFunction;\n\n    children?: ReactNode;\n};\n\nexport const Menu: React.FC<MenuProps> = ({\n    pathname,\n    children,\n    routes,\n    showBackButton,\n    userName,\n    userImage,\n    userDialogOptions,\n    profileTitle,\n    profileImage,\n    Link,\n    profileOnClick,\n    navigate,\n    t,\n}) => {\n    const {\n        staticMenu, setStaticMenu, showMenu, ref,\n    } = useMenu();\n\n    const showLabels = staticMenu || showMenu;\n\n    const currentPath = `/${pathname.split('/').slice(-1)[0]}`;\n\n    const onBackClick = () => navigate('/app/calendar');\n\n    const menuStyles = cn(styles.left_menu, {\n        [styles.menu_static]: staticMenu,\n        [styles.hidden_menu_opened]: showMenu,\n    });\n\n    const contentWrapperStyles = cn(styles.content_wrapper, {\n        [styles.content_offseted]: staticMenu,\n        [styles.calendar_view]: pathname.startsWith('/app/calendar'),\n    });\n\n    return (\n        <div className={ cn(styles.layout_wrapper) }>\n            <div ref={ ref } className={ menuStyles }>\n                <MenuAvatar\n                    title={ profileTitle }\n                    showTitle={ showLabels }\n                    image={ profileImage }\n                    onClick={ profileOnClick }\n                />\n\n                { showBackButton && <MenuBackButton showTitle={ showLabels } onClick={ onBackClick } /> }\n\n                <MenuButtonsList\n                    routes={ routes }\n                    showLabels={ showLabels }\n                    currentPath={ currentPath }\n                    Link={ Link }\n                    t={ t }\n                />\n            </div>\n\n            <div className={ contentWrapperStyles }>\n                <div className={ styles.content_header }>\n                    <ContentHeader\n                        onClick={ () => setStaticMenu(!staticMenu) }\n                        title={ t(`menu.${currentPath}`) }\n                    />\n\n                    <UserButton photo={ userImage } fullName={ userName } options={ userDialogOptions } />\n                </div>\n\n                { children }\n            </div>\n        </div>\n    );\n};\n"],"names":["Menu","pathname","children","routes","showBackButton","userName","userImage","userDialogOptions","profileTitle","profileImage","Link","profileOnClick","navigate","t","staticMenu","setStaticMenu","showMenu","ref","useMenu","showLabels","currentPath","onBackClick","menuStyles","cn","styles","contentWrapperStyles","jsxs","jsx","MenuAvatar","MenuBackButton","MenuButtonsList","ContentHeader","UserButton"],"mappings":";;;;;;;;;AA4CO,MAAMA,IAA4B,CAAC;AAAA,EACtC,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAAC;AACJ,MAAM;AACF,QAAM;AAAA,IACF,YAAAC;AAAA,IAAY,eAAAC;AAAA,IAAe,UAAAC;AAAA,IAAU,KAAAC;AAAA,EAAA,IACrCC,EAAA,GAEEC,IAAaL,KAAcE,GAE3BI,IAAc,IAAInB,EAAS,MAAM,GAAG,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC,IAElDoB,IAAc,MAAMT,EAAS,eAAe,GAE5CU,IAAaC,EAAGC,EAAO,WAAW;AAAA,IACpC,CAACA,EAAO,WAAW,GAAGV;AAAA,IACtB,CAACU,EAAO,kBAAkB,GAAGR;AAAA,EAAA,CAChC,GAEKS,IAAuBF,EAAGC,EAAO,iBAAiB;AAAA,IACpD,CAACA,EAAO,gBAAgB,GAAGV;AAAA,IAC3B,CAACU,EAAO,aAAa,GAAGvB,EAAS,WAAW,eAAe;AAAA,EAAA,CAC9D;AAED,2BACK,OAAA,EAAI,WAAYsB,EAAGC,EAAO,cAAc,GACrC,UAAA;AAAA,IAAA,gBAAAE,EAAC,OAAA,EAAI,KAAAT,GAAY,WAAYK,GACzB,UAAA;AAAA,MAAA,gBAAAK;AAAA,QAACC;AAAA,QAAA;AAAA,UACG,OAAQpB;AAAA,UACR,WAAYW;AAAA,UACZ,OAAQV;AAAA,UACR,SAAUE;AAAA,QAAA;AAAA,MAAA;AAAA,MAGZP,KAAkB,gBAAAuB,EAACE,GAAA,EAAe,WAAYV,GAAa,SAAUE,GAAc;AAAA,MAErF,gBAAAM;AAAA,QAACG;AAAA,QAAA;AAAA,UACG,QAAA3B;AAAA,UACA,YAAAgB;AAAA,UACA,aAAAC;AAAA,UACA,MAAAV;AAAA,UACA,GAAAG;AAAA,QAAA;AAAA,MAAA;AAAA,IACJ,GACJ;AAAA,IAEA,gBAAAa,EAAC,OAAA,EAAI,WAAYD,GACb,UAAA;AAAA,MAAA,gBAAAC,EAAC,OAAA,EAAI,WAAYF,EAAO,gBACpB,UAAA;AAAA,QAAA,gBAAAG;AAAA,UAACI;AAAA,UAAA;AAAA,YACG,SAAU,MAAMhB,EAAc,CAACD,CAAU;AAAA,YACzC,OAAQD,EAAE,QAAQO,CAAW,EAAE;AAAA,UAAA;AAAA,QAAA;AAAA,0BAGlCY,GAAA,EAAW,OAAQ1B,GAAY,UAAWD,GAAW,SAAUE,EAAA,CAAoB;AAAA,MAAA,GACxF;AAAA,MAEEL;AAAA,IAAA,EAAA,CACN;AAAA,EAAA,GACJ;AAER;"}

package/dist/menu/hooks/use-menu.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 export declare const useMenu: () => {
-    ref: import('react').RefObject<HTMLDivElement>;
+    ref: import('react').RefObject<HTMLDivElement | null>;
     staticMenu: boolean;
     showMenu: boolean;
     setStaticMenu: import('react').Dispatch<import('react').SetStateAction<boolean>>;

package/dist/menu/hooks/use-menu.js

@@ -1,20 +1,20 @@
-import { useState as m, useRef as i, useCallback as a, useEffect as l } from "react";
+import { useState as i, useRef as m, useCallback as a, useEffect as l } from "react";
 const d = () => {
-  const [e, f] = m(!0), [n, s] = m(!1), t = i(), o = i(null), c = a(() => {
-    e || s(!0);
+  const [e, f] = i(!0), [n, o] = i(!1), t = m(void 0), s = m(null), c = a(() => {
+    e || o(!0);
   }, [e]), u = a(() => {
     t.current && clearTimeout(t.current), t.current = setTimeout(c, 600);
   }, [c]);
   return l(() => {
-    const r = o.current;
+    const r = s.current;
     if (!(e || !r))
       return r.addEventListener("mousemove", u), r.addEventListener("mouseleave", () => {
-        clearTimeout(t.current), s(!1);
+        clearTimeout(t.current), o(!1);
       }), () => {
         r.removeEventListener("mousemove", u), clearTimeout(t.current);
       };
   }, [e, n, u]), {
-    ref: o,
+    ref: s,
     staticMenu: e,
     showMenu: n,
     setStaticMenu: f

package/dist/menu/hooks/use-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-menu.js","sources":["../../../src/menu/hooks/use-menu.ts"],"sourcesContent":["import {\n    useCallback, useEffect, useRef, useState,\n} from 'react';\n\nexport const useMenu = () => {\n    const [staticMenu, setStaticMenu] = useState(true);\n    const [showMenu, setShowMenu] = useState(false);\n\n    const timer = useRef<any>();\n    const ref = useRef<HTMLDivElement>(null);\n\n    const mouseStopped = useCallback(() => {\n        if (!staticMenu) {\n            setShowMenu(true);\n        }\n    }, [staticMenu]);\n\n    const timeout = useCallback(() => {\n        if (timer.current) {\n            clearTimeout(timer.current);\n        }\n        timer.current = setTimeout(mouseStopped, 600);\n    }, [mouseStopped]);\n\n    useEffect(() => {\n        const menuRef = ref.current;\n\n        if (staticMenu || !menuRef) return;\n\n        menuRef.addEventListener('mousemove', timeout);\n        menuRef.addEventListener('mouseleave', () => {\n            clearTimeout(timer.current);\n            setShowMenu(false);\n        });\n\n        // eslint-disable-next-line consistent-return\n        return () => {\n            menuRef.removeEventListener('mousemove', timeout);\n            clearTimeout(timer.current);\n        };\n    }, [staticMenu, showMenu, timeout]);\n\n    return {\n        ref,\n        staticMenu,\n        showMenu,\n        setStaticMenu,\n    };\n};\n"],"names":["useMenu","staticMenu","setStaticMenu","useState","showMenu","setShowMenu","timer","useRef","ref","mouseStopped","useCallback","timeout","useEffect","menuRef"],"mappings":";AAIO,MAAMA,IAAU,MAAM;AACzB,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAS,EAAI,GAC3C,CAACC,GAAUC,CAAW,IAAIF,EAAS,EAAK,GAExCG,IAAQC,EAAA,GACRC,IAAMD,EAAuB,IAAI,GAEjCE,IAAeC,EAAY,MAAM;AACnC,IAAKT,KACDI,EAAY,EAAI;AAAA,EAExB,GAAG,CAACJ,CAAU,CAAC,GAETU,IAAUD,EAAY,MAAM;AAC9B,IAAIJ,EAAM,WACN,aAAaA,EAAM,OAAO,GAE9BA,EAAM,UAAU,WAAWG,GAAc,GAAG;AAAA,EAChD,GAAG,CAACA,CAAY,CAAC;AAEjB,SAAAG,EAAU,MAAM;AACZ,UAAMC,IAAUL,EAAI;AAEpB,QAAI,EAAAP,KAAc,CAACY;AAEnB,aAAAA,EAAQ,iBAAiB,aAAaF,CAAO,GAC7CE,EAAQ,iBAAiB,cAAc,MAAM;AACzC,qBAAaP,EAAM,OAAO,GAC1BD,EAAY,EAAK;AAAA,MACrB,CAAC,GAGM,MAAM;AACT,QAAAQ,EAAQ,oBAAoB,aAAaF,CAAO,GAChD,aAAaL,EAAM,OAAO;AAAA,MAC9B;AAAA,EACJ,GAAG,CAACL,GAAYG,GAAUO,CAAO,CAAC,GAE3B;AAAA,IACH,KAAAH;AAAA,IACA,YAAAP;AAAA,IACA,UAAAG;AAAA,IACA,eAAAF;AAAA,EAAA;AAER;"}
+{"version":3,"file":"use-menu.js","sources":["../../../src/menu/hooks/use-menu.ts"],"sourcesContent":["import {\n    useCallback, useEffect, useRef, useState,\n} from 'react';\n\nexport const useMenu = () => {\n    const [staticMenu, setStaticMenu] = useState(true);\n    const [showMenu, setShowMenu] = useState(false);\n\n    const timer = useRef<any>(undefined);\n    const ref = useRef<HTMLDivElement>(null);\n\n    const mouseStopped = useCallback(() => {\n        if (!staticMenu) {\n            setShowMenu(true);\n        }\n    }, [staticMenu]);\n\n    const timeout = useCallback(() => {\n        if (timer.current) {\n            clearTimeout(timer.current);\n        }\n        timer.current = setTimeout(mouseStopped, 600);\n    }, [mouseStopped]);\n\n    useEffect(() => {\n        const menuRef = ref.current;\n\n        if (staticMenu || !menuRef) return;\n\n        menuRef.addEventListener('mousemove', timeout);\n        menuRef.addEventListener('mouseleave', () => {\n            clearTimeout(timer.current);\n            setShowMenu(false);\n        });\n\n        // eslint-disable-next-line consistent-return\n        return () => {\n            menuRef.removeEventListener('mousemove', timeout);\n            clearTimeout(timer.current);\n        };\n    }, [staticMenu, showMenu, timeout]);\n\n    return {\n        ref,\n        staticMenu,\n        showMenu,\n        setStaticMenu,\n    };\n};\n"],"names":["useMenu","staticMenu","setStaticMenu","useState","showMenu","setShowMenu","timer","useRef","ref","mouseStopped","useCallback","timeout","useEffect","menuRef"],"mappings":";AAIO,MAAMA,IAAU,MAAM;AACzB,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAS,EAAI,GAC3C,CAACC,GAAUC,CAAW,IAAIF,EAAS,EAAK,GAExCG,IAAQC,EAAY,MAAS,GAC7BC,IAAMD,EAAuB,IAAI,GAEjCE,IAAeC,EAAY,MAAM;AACnC,IAAKT,KACDI,EAAY,EAAI;AAAA,EAExB,GAAG,CAACJ,CAAU,CAAC,GAETU,IAAUD,EAAY,MAAM;AAC9B,IAAIJ,EAAM,WACN,aAAaA,EAAM,OAAO,GAE9BA,EAAM,UAAU,WAAWG,GAAc,GAAG;AAAA,EAChD,GAAG,CAACA,CAAY,CAAC;AAEjB,SAAAG,EAAU,MAAM;AACZ,UAAMC,IAAUL,EAAI;AAEpB,QAAI,EAAAP,KAAc,CAACY;AAEnB,aAAAA,EAAQ,iBAAiB,aAAaF,CAAO,GAC7CE,EAAQ,iBAAiB,cAAc,MAAM;AACzC,qBAAaP,EAAM,OAAO,GAC1BD,EAAY,EAAK;AAAA,MACrB,CAAC,GAGM,MAAM;AACT,QAAAQ,EAAQ,oBAAoB,aAAaF,CAAO,GAChD,aAAaL,EAAM,OAAO;AAAA,MAC9B;AAAA,EACJ,GAAG,CAACL,GAAYG,GAAUO,CAAO,CAAC,GAE3B;AAAA,IACH,KAAAH;AAAA,IACA,YAAAP;AAAA,IACA,UAAAG;AAAA,IACA,eAAAF;AAAA,EAAA;AAER;"}

package/dist/modal/components/modals/modal.d.ts

@@ -1,3 +1,4 @@
+import { default as React } from 'react';
 import { ModalObject, TFunction } from '../../types';
 import { ModalsProps } from '.';
 type ModalProps = {
@@ -5,5 +6,5 @@ type ModalProps = {
     index: number;
     t: TFunction;
 } & Pick<ModalsProps, 'dirtyModals' | 'closeModal' | 'currentModalId'>;
-export declare const Modal: ({ modal, t, index, dirtyModals, closeModal, currentModalId, }: ModalProps) => JSX.Element;
+export declare const Modal: ({ modal, t, index, dirtyModals, closeModal, currentModalId, }: ModalProps) => React.JSX.Element;
 export {};

package/dist/notification/component.js

@@ -5,29 +5,29 @@ import { useSwipeable as M, LEFT as U, RIGHT as V, UP as $ } from "react-swipeab
 import q from "classnames";
 import { Portal as z } from "../portal/component.js";
 import { ToastPlate as B } from "../toast-plate/component.js";
-import { useClickOutside as D } from "./utils/index.js";
-import s from "./index.module.css.js";
-const J = `.${s.notificationComponent}`, K = F(
+import { useClickOutside as J } from "./utils/index.js";
+import i from "./index.module.css.js";
+const K = `.${i.notificationComponent}`, v = F(
   ({
     className: g,
     children: h,
     visible: e,
     offset: N = 108,
-    hasCloser: P = !0,
+    hasCloser: S = !0,
     autoCloseDelay: p = 5e3,
     onClose: n,
-    onCloseTimeout: a,
-    onMouseEnter: c,
+    onCloseTimeout: c,
+    onMouseEnter: a,
     onMouseLeave: f,
     onClickOutside: m,
-    style: S,
+    style: P,
     ...k
   }, x) => {
-    const d = u(null), T = u(0), w = u(0), [y, C] = G(!1), i = r(() => {
+    const d = u(null), T = u(0), w = u(0), [A, C] = G(!1), s = r(() => {
       T.current = window.setTimeout(() => {
-        a && a();
+        c && c();
       }, p);
-    }, [p, a]), o = r(() => {
+    }, [p, c]), o = r(() => {
       clearTimeout(T.current);
     }, []);
     R(
@@ -35,28 +35,28 @@ const J = `.${s.notificationComponent}`, K = F(
         clearTimeout(w.current);
       },
       []
-    ), R(() => (e && i(), () => {
+    ), R(() => (e && s(), () => {
       o();
-    }), [i, o, e]);
-    const A = r(
+    }), [s, o, e]);
+    const E = r(
       (t) => {
-        o(), c && c(t);
+        o(), a && a(t);
       },
-      [c, o]
-    ), E = r(
+      [a, o]
+    ), H = r(
       (t) => {
-        o(), i(), f && f(t);
+        o(), s(), f && f(t);
       },
-      [f, i, o]
-    ), H = r(
+      [f, s, o]
+    ), I = r(
       (t) => {
-        const j = !!t.target.closest(J);
-        m && e && !j && m(t);
+        const y = !!t.target.closest(K);
+        m && e && !y && m(t);
       },
       [m, e]
     );
-    D(d, H);
-    const I = M({
+    J(d, I);
+    const j = M({
       onSwiped: ({ dir: t }) => {
         n && [U, V, $].includes(t) && (C(!0), w.current = window.setTimeout(() => {
           C(!1), n();
@@ -65,27 +65,27 @@ const J = `.${s.notificationComponent}`, K = F(
       delta: 100,
       trackMouse: !0
     });
-    return /* @__PURE__ */ l(z, { children: /* @__PURE__ */ l("div", { ...I, children: /* @__PURE__ */ l(
+    return /* @__PURE__ */ l(z, { children: /* @__PURE__ */ l("div", { ...j, children: /* @__PURE__ */ l(
       B,
       {
         className: q(
-          s.notificationComponent,
+          i.notificationComponent,
           {
-            [s.isVisible]: e,
-            [s.isClosing]: y
+            [i.isVisible]: e,
+            [i.isClosing]: A
           },
           g
         ),
-        contentClassName: s.toastContent,
+        contentClassName: i.toastContent,
         style: {
           top: N,
-          ...S
+          ...P
         },
-        onMouseEnter: A,
-        onMouseLeave: E,
+        onMouseEnter: E,
+        onMouseLeave: H,
         ref: L([x, d]),
         role: e ? "alert" : void 0,
-        hasCloser: P,
+        hasCloser: S,
         onClose: n,
         ...k,
         children: h
@@ -93,11 +93,7 @@ const J = `.${s.notificationComponent}`, K = F(
     ) }) });
   }
 );
-K.defaultProps = {
-  autoCloseDelay: 5e3,
-  offset: 108
-};
 export {
-  K as Notification
+  v as Notification
 };
 //# sourceMappingURL=component.js.map