@alphakits/ui 2.0.4 → 2.0.6

package/dist/checkbox/component.js

@@ -12,19 +12,19 @@ const P = y(
     label: o,
     hint: a,
     size: d = "m",
-    align: p = "center",
+    align: p = "start",
     addons: n,
     block: h,
-    onChange: m,
+    onChange: t,
     className: u,
     name: N,
-    disabled: t,
+    disabled: m,
     dataTestId: b,
     indeterminate: l = !1,
     ...k
   }, x) => {
     const i = C(null), [R] = I(i, "keyboard"), g = (f) => {
-      m && m(f, { checked: f.target.checked, name: N });
+      t && t(f, { checked: f.target.checked, name: N });
     };
     return (
       // eslint-disable-next-line jsx-a11y/label-has-associated-control
@@ -32,7 +32,7 @@ const P = y(
         "label",
         {
           className: F(e.component, e[d], e[p], u, {
-            [e.disabled]: t,
+            [e.disabled]: m,
             [e.checked]: r,
             [e.indeterminate]: l,
             [e.focused]: R,
@@ -46,7 +46,7 @@ const P = y(
                 {
                   type: "checkbox",
                   onChange: g,
-                  disabled: t,
+                  disabled: m,
                   checked: r,
                   "data-test-id": b,
                   ...k

package/dist/checkbox/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../src/checkbox/component.tsx"],"sourcesContent":["import React, {\n    ChangeEvent, forwardRef, InputHTMLAttributes, ReactNode, useRef,\n} from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport CheckmarkS from '@alphakits/icons/dist/CheckmarkS';\nimport MinusM from '@alphakits/icons/dist/MinusM';\nimport cn from 'classnames';\n\nimport { useFocus } from '../hooks/useFocus';\n\nimport styles from './index.module.css';\n\ntype NativeProps = InputHTMLAttributes<HTMLInputElement>;\ntype Align = 'start' | 'center';\n\nexport type CheckboxProps = Omit<NativeProps, 'size' | 'onChange'> & {\n    /**\n     * Управление состоянием вкл/выкл чекбокса (native prop)\n     */\n    checked?: boolean;\n\n    /**\n     * Обработчик переключения чекбокса\n     */\n    onChange: (\n        /* eslint-disable-next-line @typescript-eslint/no-unused-vars */\n        event: ChangeEvent<HTMLInputElement>,\n        /* eslint-disable-next-line @typescript-eslint/no-unused-vars */\n        payload: {\n            checked: boolean;\n            name?: string;\n        },\n    ) => void;\n\n    /**\n     * Текст подписи к чекбоксу\n     */\n    label?: ReactNode;\n\n    /**\n     * Текст подсказки снизу\n     */\n    hint?: ReactNode;\n\n    /**\n     * Размер компонента\n     */\n    size?: 's' | 'm';\n\n    /**\n     * Выравнивание\n     */\n    align?: Align;\n\n    /**\n     * Дополнительный слот\n     */\n    addons?: React.ReactNode;\n\n    /**\n     * Растягивать ли компонент на всю ширину\n     */\n    block?: boolean;\n\n    /**\n     * Идентификатор для систем автоматизированного тестирования\n     */\n    dataTestId?: string;\n\n    /**\n     * Управление неопределенным состоянием чекбокса\n     */\n    indeterminate?: boolean;\n};\n\nexport const Checkbox = forwardRef<HTMLLabelElement, CheckboxProps>(\n    (\n        {\n            checked,\n            label,\n            hint,\n            size = 'm',\n            align = 'center',\n            addons,\n            block,\n            onChange,\n            className,\n            name,\n            disabled,\n            dataTestId,\n            indeterminate = false,\n            ...restProps\n        },\n        ref,\n    ) => {\n        const labelRef = useRef<HTMLLabelElement>(null);\n\n        const [focused] = useFocus(labelRef, 'keyboard');\n\n        const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n            if (onChange) {\n                onChange(event, { checked: event.target.checked, name });\n            }\n        };\n\n        return (\n            // eslint-disable-next-line jsx-a11y/label-has-associated-control\n            <label\n                className={ cn(styles.component, styles[size], styles[align], className, {\n                    [styles.disabled]: disabled,\n                    [styles.checked]: checked,\n                    [styles.indeterminate]: indeterminate,\n                    [styles.focused]: focused,\n                    [styles.block]: block,\n                }) }\n                ref={ mergeRefs([labelRef, ref]) }\n            >\n                <span className={ styles.box }>\n                    <input\n                        type=\"checkbox\"\n                        onChange={ handleChange }\n                        disabled={ disabled }\n                        checked={ checked }\n                        data-test-id={ dataTestId }\n                        { ...restProps }\n                    />\n\n                    { checked && <CheckmarkS /> }\n\n                    { indeterminate && !checked && (\n                        <div className={ styles.indeterminateIcon }>\n                            <MinusM />\n                        </div>\n                    ) }\n                </span>\n\n                { (label || hint) && (\n                    <span className={ styles.content }>\n                        { label && <span className={ styles.label }>{ label }</span> }\n                        { hint && <span className={ styles.hint }>{ hint }</span> }\n                    </span>\n                ) }\n\n                { addons && <span className={ styles.addons }>{ addons }</span> }\n            </label>\n        );\n    },\n);\n\n/**\n * Для отображения в сторибуке\n */\nCheckbox.defaultProps = {\n    indeterminate: false,\n};\n"],"names":["Checkbox","forwardRef","checked","label","hint","size","align","addons","block","onChange","className","name","disabled","dataTestId","indeterminate","restProps","ref","labelRef","useRef","focused","useFocus","handleChange","event","jsxs","cn","styles","mergeRefs","jsx","CheckmarkS","MinusM"],"mappings":";;;;;;;;AA2EO,MAAMA,IAAWC;AAAA,EACpB,CACI;AAAA,IACI,SAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,OAAAC,IAAQ;AAAA,IACR,QAAAC;AAAA,IACA,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,MAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC,IAAgB;AAAA,IAChB,GAAGC;AAAA,EAAA,GAEPC,MACC;AACD,UAAMC,IAAWC,EAAyB,IAAI,GAExC,CAACC,CAAO,IAAIC,EAASH,GAAU,UAAU,GAEzCI,IAAe,CAACC,MAAyC;AAC3D,MAAIb,KACAA,EAASa,GAAO,EAAE,SAASA,EAAM,OAAO,SAAS,MAAAX,GAAM;AAAA,IAE/D;AAEA;AAAA;AAAA,MAEI,gBAAAY;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,WAAYC,EAAGC,EAAO,WAAWA,EAAOpB,CAAI,GAAGoB,EAAOnB,CAAK,GAAGI,GAAW;AAAA,YACrE,CAACe,EAAO,QAAQ,GAAGb;AAAA,YACnB,CAACa,EAAO,OAAO,GAAGvB;AAAA,YAClB,CAACuB,EAAO,aAAa,GAAGX;AAAA,YACxB,CAACW,EAAO,OAAO,GAAGN;AAAA,YAClB,CAACM,EAAO,KAAK,GAAGjB;AAAA,UAAA,CACnB;AAAA,UACD,KAAMkB,EAAU,CAACT,GAAUD,CAAG,CAAC;AAAA,UAE/B,UAAA;AAAA,YAAA,gBAAAO,EAAC,QAAA,EAAK,WAAYE,EAAO,KACrB,UAAA;AAAA,cAAA,gBAAAE;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,MAAK;AAAA,kBACL,UAAWN;AAAA,kBACX,UAAAT;AAAA,kBACA,SAAAV;AAAA,kBACA,gBAAeW;AAAA,kBACb,GAAGE;AAAA,gBAAA;AAAA,cAAA;AAAA,cAGPb,uBAAY0B,GAAA,EAAW;AAAA,cAEvBd,KAAiB,CAACZ,KAChB,gBAAAyB,EAAC,OAAA,EAAI,WAAYF,EAAO,mBACpB,UAAA,gBAAAE,EAACE,GAAA,CAAA,CAAO,EAAA,CACZ;AAAA,YAAA,GAER;AAAA,aAEG1B,KAASC,MACR,gBAAAmB,EAAC,QAAA,EAAK,WAAYE,EAAO,SACnB,UAAA;AAAA,cAAAtB,KAAS,gBAAAwB,EAAC,QAAA,EAAK,WAAYF,EAAO,OAAU,UAAAtB,GAAO;AAAA,cACnDC,KAAQ,gBAAAuB,EAAC,QAAA,EAAK,WAAYF,EAAO,MAAS,UAAArB,EAAA,CAAM;AAAA,YAAA,GACtD;AAAA,YAGFG,KAAU,gBAAAoB,EAAC,QAAA,EAAK,WAAYF,EAAO,QAAW,UAAAlB,EAAA,CAAQ;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA;AAAA,EAGpE;AACJ;AAKAP,EAAS,eAAe;AAAA,EACpB,eAAe;AACnB;"}
+{"version":3,"file":"component.js","sources":["../../src/checkbox/component.tsx"],"sourcesContent":["import React, {\n    ChangeEvent, forwardRef, InputHTMLAttributes, ReactNode, useRef,\n} from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport CheckmarkS from '@alphakits/icons/dist/CheckmarkS';\nimport MinusM from '@alphakits/icons/dist/MinusM';\nimport cn from 'classnames';\n\nimport { useFocus } from '../hooks/useFocus';\n\nimport styles from './index.module.css';\n\ntype NativeProps = InputHTMLAttributes<HTMLInputElement>;\ntype Align = 'start' | 'center';\n\nexport type CheckboxProps = Omit<NativeProps, 'size' | 'onChange'> & {\n    /**\n     * Управление состоянием вкл/выкл чекбокса (native prop)\n     */\n    checked?: boolean;\n\n    /**\n     * Обработчик переключения чекбокса\n     */\n    onChange: (\n        /* eslint-disable-next-line @typescript-eslint/no-unused-vars */\n        event: ChangeEvent<HTMLInputElement>,\n        /* eslint-disable-next-line @typescript-eslint/no-unused-vars */\n        payload: {\n            checked: boolean;\n            name?: string;\n        },\n    ) => void;\n\n    /**\n     * Текст подписи к чекбоксу\n     */\n    label?: ReactNode;\n\n    /**\n     * Текст подсказки снизу\n     */\n    hint?: ReactNode;\n\n    /**\n     * Размер компонента\n     */\n    size?: 's' | 'm';\n\n    /**\n     * Выравнивание\n     */\n    align?: Align;\n\n    /**\n     * Дополнительный слот\n     */\n    addons?: React.ReactNode;\n\n    /**\n     * Растягивать ли компонент на всю ширину\n     */\n    block?: boolean;\n\n    /**\n     * Идентификатор для систем автоматизированного тестирования\n     */\n    dataTestId?: string;\n\n    /**\n     * Управление неопределенным состоянием чекбокса\n     */\n    indeterminate?: boolean;\n};\n\nexport const Checkbox = forwardRef<HTMLLabelElement, CheckboxProps>(\n    (\n        {\n            checked,\n            label,\n            hint,\n            size = 'm',\n            align = 'start',\n            addons,\n            block,\n            onChange,\n            className,\n            name,\n            disabled,\n            dataTestId,\n            indeterminate = false,\n            ...restProps\n        },\n        ref,\n    ) => {\n        const labelRef = useRef<HTMLLabelElement>(null);\n\n        const [focused] = useFocus(labelRef, 'keyboard');\n\n        const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n            if (onChange) {\n                onChange(event, { checked: event.target.checked, name });\n            }\n        };\n\n        return (\n            // eslint-disable-next-line jsx-a11y/label-has-associated-control\n            <label\n                className={ cn(styles.component, styles[size], styles[align], className, {\n                    [styles.disabled]: disabled,\n                    [styles.checked]: checked,\n                    [styles.indeterminate]: indeterminate,\n                    [styles.focused]: focused,\n                    [styles.block]: block,\n                }) }\n                ref={ mergeRefs([labelRef, ref]) }\n            >\n                <span className={ styles.box }>\n                    <input\n                        type=\"checkbox\"\n                        onChange={ handleChange }\n                        disabled={ disabled }\n                        checked={ checked }\n                        data-test-id={ dataTestId }\n                        { ...restProps }\n                    />\n\n                    { checked && <CheckmarkS /> }\n\n                    { indeterminate && !checked && (\n                        <div className={ styles.indeterminateIcon }>\n                            <MinusM />\n                        </div>\n                    ) }\n                </span>\n\n                { (label || hint) && (\n                    <span className={ styles.content }>\n                        { label && <span className={ styles.label }>{ label }</span> }\n                        { hint && <span className={ styles.hint }>{ hint }</span> }\n                    </span>\n                ) }\n\n                { addons && <span className={ styles.addons }>{ addons }</span> }\n            </label>\n        );\n    },\n);\n\n/**\n * Для отображения в сторибуке\n */\nCheckbox.defaultProps = {\n    indeterminate: false,\n};\n"],"names":["Checkbox","forwardRef","checked","label","hint","size","align","addons","block","onChange","className","name","disabled","dataTestId","indeterminate","restProps","ref","labelRef","useRef","focused","useFocus","handleChange","event","jsxs","cn","styles","mergeRefs","jsx","CheckmarkS","MinusM"],"mappings":";;;;;;;;AA2EO,MAAMA,IAAWC;AAAA,EACpB,CACI;AAAA,IACI,SAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,OAAAC,IAAQ;AAAA,IACR,QAAAC;AAAA,IACA,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,MAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC,IAAgB;AAAA,IAChB,GAAGC;AAAA,EAAA,GAEPC,MACC;AACD,UAAMC,IAAWC,EAAyB,IAAI,GAExC,CAACC,CAAO,IAAIC,EAASH,GAAU,UAAU,GAEzCI,IAAe,CAACC,MAAyC;AAC3D,MAAIb,KACAA,EAASa,GAAO,EAAE,SAASA,EAAM,OAAO,SAAS,MAAAX,GAAM;AAAA,IAE/D;AAEA;AAAA;AAAA,MAEI,gBAAAY;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,WAAYC,EAAGC,EAAO,WAAWA,EAAOpB,CAAI,GAAGoB,EAAOnB,CAAK,GAAGI,GAAW;AAAA,YACrE,CAACe,EAAO,QAAQ,GAAGb;AAAA,YACnB,CAACa,EAAO,OAAO,GAAGvB;AAAA,YAClB,CAACuB,EAAO,aAAa,GAAGX;AAAA,YACxB,CAACW,EAAO,OAAO,GAAGN;AAAA,YAClB,CAACM,EAAO,KAAK,GAAGjB;AAAA,UAAA,CACnB;AAAA,UACD,KAAMkB,EAAU,CAACT,GAAUD,CAAG,CAAC;AAAA,UAE/B,UAAA;AAAA,YAAA,gBAAAO,EAAC,QAAA,EAAK,WAAYE,EAAO,KACrB,UAAA;AAAA,cAAA,gBAAAE;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,MAAK;AAAA,kBACL,UAAWN;AAAA,kBACX,UAAAT;AAAA,kBACA,SAAAV;AAAA,kBACA,gBAAeW;AAAA,kBACb,GAAGE;AAAA,gBAAA;AAAA,cAAA;AAAA,cAGPb,uBAAY0B,GAAA,EAAW;AAAA,cAEvBd,KAAiB,CAACZ,KAChB,gBAAAyB,EAAC,OAAA,EAAI,WAAYF,EAAO,mBACpB,UAAA,gBAAAE,EAACE,GAAA,CAAA,CAAO,EAAA,CACZ;AAAA,YAAA,GAER;AAAA,aAEG1B,KAASC,MACR,gBAAAmB,EAAC,QAAA,EAAK,WAAYE,EAAO,SACnB,UAAA;AAAA,cAAAtB,KAAS,gBAAAwB,EAAC,QAAA,EAAK,WAAYF,EAAO,OAAU,UAAAtB,GAAO;AAAA,cACnDC,KAAQ,gBAAAuB,EAAC,QAAA,EAAK,WAAYF,EAAO,MAAS,UAAArB,EAAA,CAAM;AAAA,YAAA,GACtD;AAAA,YAGFG,KAAU,gBAAAoB,EAAC,QAAA,EAAK,WAAYF,EAAO,QAAW,UAAAlB,EAAA,CAAQ;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA;AAAA,EAGpE;AACJ;AAKAP,EAAS,eAAe;AAAA,EACpB,eAAe;AACnB;"}

package/dist/modal/components/modals/index.module.css

@@ -1 +1 @@
-.container_WE0K{position:fixed;inset:0;display:flex;align-items:center;justify-content:center}.content_p1kc{background:var(--color-bg-primary);box-shadow:0 0 10px #0003}@media print{.content_p1kc{width:100%!important}}.button_js2W{position:absolute!important;top:36px;right:32px;z-index:999}.button_js2W.doubleModal_1ZTt{right:384px}.inner_Zsdb{height:100%;box-sizing:border-box;overflow:auto}.right_e065{position:fixed;top:0;right:0;bottom:0;transition:width .2s,opacity .2s,right .2s;transition-delay:width .1s;transition-timing-function:ease-in}.bg_8ZfP{transition:opacity .2s;background:#00000080;position:fixed;display:block;border:0;inset:0}@media screen and (max-width:823px){.right_e065,.center_nguy{max-width:100%!important;inset:0!important}.content_p1kc{width:100%!important;height:100%!important;max-height:100%!important;box-shadow:none!important;margin:0!important;border-radius:0!important}.button_js2W{top:24px!important;right:16px!important}}
+.container_WE0K{position:fixed;inset:0;display:flex;align-items:center;justify-content:center}.content_p1kc{background:var(--color-bg-primary);box-shadow:0 0 10px #0003}@media print{.content_p1kc{width:100%!important}}.button_js2W{position:absolute!important;top:36px;right:32px;z-index:999}.inner_Zsdb{height:100%;box-sizing:border-box;overflow:auto}.right_e065{position:fixed;top:0;right:0;bottom:0;transition:width .2s,opacity .2s,right .2s;transition-delay:width .1s;transition-timing-function:ease-in}.bg_8ZfP{transition:opacity .2s;background:#00000080;position:fixed;display:block;border:0;inset:0}@media screen and (max-width:823px){.right_e065,.center_nguy{max-width:100%!important;inset:0!important}.content_p1kc{width:100%!important;height:100%!important;max-height:100%!important;box-shadow:none!important;margin:0!important;border-radius:0!important}.button_js2W{top:24px!important;right:16px!important}}

package/dist/modal/components/modals/index.module.css.js

@@ -1,21 +1,19 @@
 import './index.module.css';
-const t = "container_WE0K", n = "content_p1kc", o = "button_js2W", e = "doubleModal_1ZTt", c = "inner_Zsdb", s = "right_e065", b = "bg_8ZfP", r = {
-  container: t,
-  content: n,
+const n = "container_WE0K", t = "content_p1kc", o = "button_js2W", c = "inner_Zsdb", e = "right_e065", s = "bg_8ZfP", r = {
+  container: n,
+  content: t,
   button: o,
-  doubleModal: e,
   inner: c,
-  right: s,
-  bg: b
+  right: e,
+  bg: s
 };
 export {
-  b as bg,
+  s as bg,
   o as button,
-  t as container,
-  n as content,
+  n as container,
+  t as content,
   r as default,
-  e as doubleModal,
   c as inner,
-  s as right
+  e as right
 };
 //# sourceMappingURL=index.module.css.js.map

package/dist/modal/components/modals/index.module.css.js.map

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

package/dist/modal/components/modals/modal.js

@@ -1,6 +1,6 @@
 import { jsx as n, jsxs as u } from "react/jsx-runtime";
-import w, { useState as C, useLayoutEffect as z, useCallback as b, useEffect as v } from "react";
-import d from "classnames";
+import y, { useState as C, useLayoutEffect as d, useCallback as h, useEffect as z } from "react";
+import v from "classnames";
 import { ButtonArrow as x } from "../../../button-arrow/component.js";
 import o from "./index.module.css.js";
 const k = {
@@ -9,36 +9,36 @@ const k = {
   full: "96%"
 }, F = ({
   modal: e,
-  t: h,
+  t: b,
   index: l,
   dirtyModals: p,
   closeModal: a,
   currentModalId: r
 }) => {
-  const c = -k[e.props.size] - 102, [y, m] = C(c);
-  z(() => {
-    setTimeout(() => m(0), 0);
+  const c = -k[e.props.size] - 102, [w, f] = C(c);
+  d(() => {
+    setTimeout(() => f(0), 0);
   }, []);
-  const f = b(
+  const m = h(
     (s) => (
       // eslint-disable-next-line no-restricted-globals
-      !p[s] || confirm(h("common:exitConfirm"))
+      !p[s] || confirm(b("common:exitConfirm"))
     ),
     [p]
-  ), t = b((s) => {
+  ), t = h((s) => {
     const { id: i } = e;
-    f(s || i) && (m(c), setTimeout(() => {
+    m(s || i) && (f(c), setTimeout(() => {
       e.props.closeCallback && e.props.closeCallback(), a(s || i);
     }, 250));
-  }, [a, f, e, c]);
-  return v(() => {
+  }, [a, m, e, c]);
+  return z(() => {
     const s = (i) => {
       (i.key === "27" || i.key === "Escape") && t(r);
     };
     return e.id === r && (window == null || window.addEventListener("keydown", s)), () => {
       window == null || window.removeEventListener("keydown", s);
     };
-  }, [t, r, e.id]), /* @__PURE__ */ n(w.Fragment, { children: /* @__PURE__ */ u(
+  }, [t, r, e.id]), /* @__PURE__ */ n(y.Fragment, { children: /* @__PURE__ */ u(
     "div",
     {
       className: o.container,
@@ -49,18 +49,18 @@ const k = {
         /* @__PURE__ */ n(
           "div",
           {
-            className: d(o.right, o.content),
+            className: v(o.right, o.content),
             style: {
               zIndex: 9999999 + l,
               width: k[e.props.size],
-              right: y
+              right: w
             },
             children: /* @__PURE__ */ u("div", { className: o.inner, children: [
               /* @__PURE__ */ n(e.modal, { ...e.props, close: () => t() }),
-              /* @__PURE__ */ n(
+              e.props.showCloser !== !1 && /* @__PURE__ */ n(
                 x,
                 {
-                  className: d(o.button, { [o.doubleModal]: e.props.isDouble }),
+                  className: o.button,
                   size: "s",
                   type: "close",
                   onClick: () => t()

package/dist/modal/components/modals/modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal.js","sources":["../../../../src/modal/components/modals/modal.tsx"],"sourcesContent":["import React, {\n    useCallback, useEffect, useLayoutEffect, useState,\n} from 'react';\nimport classNames from 'classnames';\n\nimport { ButtonArrow } from '../../../button-arrow';\nimport { ModalObject, TFunction } from '../../types';\n\nimport { ModalsProps } from '.';\n\nimport styles from './index.module.css';\n\nconst sizes = {\n    s: 488,\n    m: 888,\n    full: '96%',\n};\n\ntype ModalProps = {\n    modal: ModalObject;\n    index: number;\n    t: TFunction;\n} & Pick<ModalsProps, 'dirtyModals' | 'closeModal' | 'currentModalId'>;\n\nexport const Modal = ({\n    modal, t, index, dirtyModals, closeModal, currentModalId,\n}: ModalProps) => {\n    const modalFullWidth = -sizes[modal.props.size] - 102;\n    const [modalPosition, setModalPosition] = useState(modalFullWidth);\n\n    useLayoutEffect(() => {\n        setTimeout(() => setModalPosition(0), 0);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, []);\n\n    const confirmClose = useCallback((id: string) =>\n        // eslint-disable-next-line no-restricted-globals\n        !dirtyModals[id] || confirm(t('common:exitConfirm'))\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    , [dirtyModals]);\n\n    const handleClose = useCallback((latestId?: string) => {\n        const { id } = modal;\n\n        if (!confirmClose(latestId || id)) return;\n\n        setModalPosition(modalFullWidth);\n\n        setTimeout(() => {\n            if (modal.props.closeCallback) {\n                modal.props.closeCallback();\n            }\n            closeModal(latestId || id);\n        }, 250);\n    }, [closeModal, confirmClose, modal, modalFullWidth]);\n\n    useEffect(() => {\n        const escapeListener = (event: KeyboardEvent) => {\n            if (event.key === '27' || event.key === 'Escape') {\n                handleClose(currentModalId);\n            }\n        };\n\n        if (modal.id === currentModalId) {\n            window?.addEventListener('keydown', escapeListener);\n        }\n\n        return () => {\n            window?.removeEventListener('keydown', escapeListener);\n        };\n    }, [handleClose, currentModalId, modal.id]);\n\n    return (\n        <React.Fragment>\n            <div\n                className={ styles.container }\n                style={ {\n                    zIndex: 9999998 + index,\n                } }\n            >\n                <div\n                    className={ classNames(styles.right, styles.content) }\n                    style={ {\n                        zIndex: 9999999 + index,\n                        width: sizes[modal.props.size],\n                        right: modalPosition,\n                    } }\n                >\n                    <div className={ styles.inner }>\n                        <modal.modal { ...modal.props } close={ () => handleClose() } />\n\n                        <ButtonArrow\n                            className={ classNames(styles.button, { [styles.doubleModal]: modal.props.isDouble }) }\n                            size=\"s\"\n                            type=\"close\"\n                            onClick={ () => handleClose() }\n                        />\n                    </div>\n                </div>\n\n                <button\n                    className={ styles.bg }\n                    aria-label=\"close_backdrop\"\n                    type=\"button\"\n                    onClick={ () => handleClose() }\n                />\n            </div>\n\n        </React.Fragment>\n    );\n};\n"],"names":["sizes","Modal","modal","t","index","dirtyModals","closeModal","currentModalId","modalFullWidth","modalPosition","setModalPosition","useState","useLayoutEffect","confirmClose","useCallback","id","handleClose","latestId","useEffect","escapeListener","event","jsx","React","jsxs","styles","classNames","ButtonArrow"],"mappings":";;;;;AAYA,MAAMA,IAAQ;AAAA,EACV,GAAG;AAAA,EACH,GAAG;AAAA,EACH,MAAM;AACV,GAQaC,IAAQ,CAAC;AAAA,EAClB,OAAAC;AAAA,EAAO,GAAAC;AAAA,EAAG,OAAAC;AAAA,EAAO,aAAAC;AAAA,EAAa,YAAAC;AAAA,EAAY,gBAAAC;AAC9C,MAAkB;AACd,QAAMC,IAAiB,CAACR,EAAME,EAAM,MAAM,IAAI,IAAI,KAC5C,CAACO,GAAeC,CAAgB,IAAIC,EAASH,CAAc;AAEjE,EAAAI,EAAgB,MAAM;AAClB,eAAW,MAAMF,EAAiB,CAAC,GAAG,CAAC;AAAA,EAE3C,GAAG,CAAA,CAAE;AAEL,QAAMG,IAAeC;AAAA,IAAY,CAACC;AAAA;AAAA,MAE9B,CAACV,EAAYU,CAAE,KAAK,QAAQZ,EAAE,oBAAoB,CAAC;AAAA;AAAA,IAErD,CAACE,CAAW;AAAA,EAAA,GAERW,IAAcF,EAAY,CAACG,MAAsB;AACnD,UAAM,EAAE,IAAAF,MAAOb;AAEf,IAAKW,EAAaI,KAAYF,CAAE,MAEhCL,EAAiBF,CAAc,GAE/B,WAAW,MAAM;AACb,MAAIN,EAAM,MAAM,iBACZA,EAAM,MAAM,cAAA,GAEhBI,EAAWW,KAAYF,CAAE;AAAA,IAC7B,GAAG,GAAG;AAAA,EACV,GAAG,CAACT,GAAYO,GAAcX,GAAOM,CAAc,CAAC;AAEpD,SAAAU,EAAU,MAAM;AACZ,UAAMC,IAAiB,CAACC,MAAyB;AAC7C,OAAIA,EAAM,QAAQ,QAAQA,EAAM,QAAQ,aACpCJ,EAAYT,CAAc;AAAA,IAElC;AAEA,WAAIL,EAAM,OAAOK,MACb,yBAAQ,iBAAiB,WAAWY,KAGjC,MAAM;AACT,+BAAQ,oBAAoB,WAAWA;AAAA,IAC3C;AAAA,EACJ,GAAG,CAACH,GAAaT,GAAgBL,EAAM,EAAE,CAAC,GAGtC,gBAAAmB,EAACC,EAAM,UAAN,EACG,UAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAYC,EAAO;AAAA,MACnB,OAAQ;AAAA,QACJ,QAAQ,UAAUpB;AAAA,MAAA;AAAA,MAGtB,UAAA;AAAA,QAAA,gBAAAiB;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAYI,EAAWD,EAAO,OAAOA,EAAO,OAAO;AAAA,YACnD,OAAQ;AAAA,cACJ,QAAQ,UAAUpB;AAAA,cAClB,OAAOJ,EAAME,EAAM,MAAM,IAAI;AAAA,cAC7B,OAAOO;AAAA,YAAA;AAAA,YAGX,UAAA,gBAAAc,EAAC,OAAA,EAAI,WAAYC,EAAO,OACpB,UAAA;AAAA,cAAA,gBAAAH,EAACnB,EAAM,OAAN,EAAc,GAAGA,EAAM,OAAQ,OAAQ,MAAMc,EAAA,GAAgB;AAAA,cAE9D,gBAAAK;AAAA,gBAACK;AAAA,gBAAA;AAAA,kBACG,WAAYD,EAAWD,EAAO,QAAQ,EAAE,CAACA,EAAO,WAAW,GAAGtB,EAAM,MAAM,UAAU;AAAA,kBACpF,MAAK;AAAA,kBACL,MAAK;AAAA,kBACL,SAAU,MAAMc,EAAA;AAAA,gBAAY;AAAA,cAAA;AAAA,YAChC,EAAA,CACJ;AAAA,UAAA;AAAA,QAAA;AAAA,QAGJ,gBAAAK;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAYG,EAAO;AAAA,YACnB,cAAW;AAAA,YACX,MAAK;AAAA,YACL,SAAU,MAAMR,EAAA;AAAA,UAAY;AAAA,QAAA;AAAA,MAChC;AAAA,IAAA;AAAA,EAAA,GAGR;AAER;"}
+{"version":3,"file":"modal.js","sources":["../../../../src/modal/components/modals/modal.tsx"],"sourcesContent":["import React, {\n    useCallback, useEffect, useLayoutEffect, useState,\n} from 'react';\nimport classNames from 'classnames';\n\nimport { ButtonArrow } from '../../../button-arrow';\nimport { ModalObject, TFunction } from '../../types';\n\nimport { ModalsProps } from '.';\n\nimport styles from './index.module.css';\n\nconst sizes = {\n    s: 488,\n    m: 888,\n    full: '96%',\n};\n\ntype ModalProps = {\n    modal: ModalObject;\n    index: number;\n    t: TFunction;\n} & Pick<ModalsProps, 'dirtyModals' | 'closeModal' | 'currentModalId'>;\n\nexport const Modal = ({\n    modal, t, index, dirtyModals, closeModal, currentModalId,\n}: ModalProps) => {\n    const modalFullWidth = -sizes[modal.props.size] - 102;\n    const [modalPosition, setModalPosition] = useState(modalFullWidth);\n\n    useLayoutEffect(() => {\n        setTimeout(() => setModalPosition(0), 0);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, []);\n\n    const confirmClose = useCallback((id: string) =>\n        // eslint-disable-next-line no-restricted-globals\n        !dirtyModals[id] || confirm(t('common:exitConfirm'))\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    , [dirtyModals]);\n\n    const handleClose = useCallback((latestId?: string) => {\n        const { id } = modal;\n\n        if (!confirmClose(latestId || id)) return;\n\n        setModalPosition(modalFullWidth);\n\n        setTimeout(() => {\n            if (modal.props.closeCallback) {\n                modal.props.closeCallback();\n            }\n            closeModal(latestId || id);\n        }, 250);\n    }, [closeModal, confirmClose, modal, modalFullWidth]);\n\n    useEffect(() => {\n        const escapeListener = (event: KeyboardEvent) => {\n            if (event.key === '27' || event.key === 'Escape') {\n                handleClose(currentModalId);\n            }\n        };\n\n        if (modal.id === currentModalId) {\n            window?.addEventListener('keydown', escapeListener);\n        }\n\n        return () => {\n            window?.removeEventListener('keydown', escapeListener);\n        };\n    }, [handleClose, currentModalId, modal.id]);\n\n    return (\n        <React.Fragment>\n            <div\n                className={ styles.container }\n                style={ {\n                    zIndex: 9999998 + index,\n                } }\n            >\n                <div\n                    className={ classNames(styles.right, styles.content) }\n                    style={ {\n                        zIndex: 9999999 + index,\n                        width: sizes[modal.props.size],\n                        right: modalPosition,\n                    } }\n                >\n                    <div className={ styles.inner }>\n                        <modal.modal { ...modal.props } close={ () => handleClose() } />\n\n                        { modal.props.showCloser !== false && (\n                            <ButtonArrow\n                                className={ styles.button }\n                                size=\"s\"\n                                type=\"close\"\n                                onClick={ () => handleClose() }\n                            />\n                        ) }\n                    </div>\n                </div>\n\n                <button\n                    className={ styles.bg }\n                    aria-label=\"close_backdrop\"\n                    type=\"button\"\n                    onClick={ () => handleClose() }\n                />\n            </div>\n\n        </React.Fragment>\n    );\n};\n"],"names":["sizes","Modal","modal","t","index","dirtyModals","closeModal","currentModalId","modalFullWidth","modalPosition","setModalPosition","useState","useLayoutEffect","confirmClose","useCallback","id","handleClose","latestId","useEffect","escapeListener","event","jsx","React","jsxs","styles","classNames","ButtonArrow"],"mappings":";;;;;AAYA,MAAMA,IAAQ;AAAA,EACV,GAAG;AAAA,EACH,GAAG;AAAA,EACH,MAAM;AACV,GAQaC,IAAQ,CAAC;AAAA,EAClB,OAAAC;AAAA,EAAO,GAAAC;AAAA,EAAG,OAAAC;AAAA,EAAO,aAAAC;AAAA,EAAa,YAAAC;AAAA,EAAY,gBAAAC;AAC9C,MAAkB;AACd,QAAMC,IAAiB,CAACR,EAAME,EAAM,MAAM,IAAI,IAAI,KAC5C,CAACO,GAAeC,CAAgB,IAAIC,EAASH,CAAc;AAEjE,EAAAI,EAAgB,MAAM;AAClB,eAAW,MAAMF,EAAiB,CAAC,GAAG,CAAC;AAAA,EAE3C,GAAG,CAAA,CAAE;AAEL,QAAMG,IAAeC;AAAA,IAAY,CAACC;AAAA;AAAA,MAE9B,CAACV,EAAYU,CAAE,KAAK,QAAQZ,EAAE,oBAAoB,CAAC;AAAA;AAAA,IAErD,CAACE,CAAW;AAAA,EAAA,GAERW,IAAcF,EAAY,CAACG,MAAsB;AACnD,UAAM,EAAE,IAAAF,MAAOb;AAEf,IAAKW,EAAaI,KAAYF,CAAE,MAEhCL,EAAiBF,CAAc,GAE/B,WAAW,MAAM;AACb,MAAIN,EAAM,MAAM,iBACZA,EAAM,MAAM,cAAA,GAEhBI,EAAWW,KAAYF,CAAE;AAAA,IAC7B,GAAG,GAAG;AAAA,EACV,GAAG,CAACT,GAAYO,GAAcX,GAAOM,CAAc,CAAC;AAEpD,SAAAU,EAAU,MAAM;AACZ,UAAMC,IAAiB,CAACC,MAAyB;AAC7C,OAAIA,EAAM,QAAQ,QAAQA,EAAM,QAAQ,aACpCJ,EAAYT,CAAc;AAAA,IAElC;AAEA,WAAIL,EAAM,OAAOK,MACb,yBAAQ,iBAAiB,WAAWY,KAGjC,MAAM;AACT,+BAAQ,oBAAoB,WAAWA;AAAA,IAC3C;AAAA,EACJ,GAAG,CAACH,GAAaT,GAAgBL,EAAM,EAAE,CAAC,GAGtC,gBAAAmB,EAACC,EAAM,UAAN,EACG,UAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAYC,EAAO;AAAA,MACnB,OAAQ;AAAA,QACJ,QAAQ,UAAUpB;AAAA,MAAA;AAAA,MAGtB,UAAA;AAAA,QAAA,gBAAAiB;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAYI,EAAWD,EAAO,OAAOA,EAAO,OAAO;AAAA,YACnD,OAAQ;AAAA,cACJ,QAAQ,UAAUpB;AAAA,cAClB,OAAOJ,EAAME,EAAM,MAAM,IAAI;AAAA,cAC7B,OAAOO;AAAA,YAAA;AAAA,YAGX,UAAA,gBAAAc,EAAC,OAAA,EAAI,WAAYC,EAAO,OACpB,UAAA;AAAA,cAAA,gBAAAH,EAACnB,EAAM,OAAN,EAAc,GAAGA,EAAM,OAAQ,OAAQ,MAAMc,EAAA,GAAgB;AAAA,cAE5Dd,EAAM,MAAM,eAAe,MACzB,gBAAAmB;AAAA,gBAACK;AAAA,gBAAA;AAAA,kBACG,WAAYF,EAAO;AAAA,kBACnB,MAAK;AAAA,kBACL,MAAK;AAAA,kBACL,SAAU,MAAMR,EAAA;AAAA,gBAAY;AAAA,cAAA;AAAA,YAChC,EAAA,CAER;AAAA,UAAA;AAAA,QAAA;AAAA,QAGJ,gBAAAK;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAYG,EAAO;AAAA,YACnB,cAAW;AAAA,YACX,MAAK;AAAA,YACL,SAAU,MAAMR,EAAA;AAAA,UAAY;AAAA,QAAA;AAAA,MAChC;AAAA,IAAA;AAAA,EAAA,GAGR;AAER;"}

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

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
 import { ModalObject, ModalSize, OwnModalProps, TFunction } from '../types';
 export declare const useModal: (t: TFunction) => {
-    openModal: <T extends unknown>(modal: React.FC<T>, size?: ModalSize, isDouble?: boolean) => (props?: OwnModalProps<T>, closeCallback?: () => void) => void;
+    openModal: <T extends unknown>(modal: React.FC<T>, size?: ModalSize, showCloser?: boolean) => (props?: OwnModalProps<T>, closeCallback?: () => void) => void;
     modals: ModalObject[];
     setModalDirty: (id: string, isDirty: boolean) => void;
     currentModalId: string;

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

@@ -2,7 +2,7 @@ import n, { useEffect as I } from "react";
 import { v4 as S } from "uuid";
 import { deletePropertyById as g } from "../utils/delete-property-by-id.js";
 const x = (c) => {
-  const [s, l] = n.useState([]), [M, u] = n.useState(""), [i, a] = n.useState({}), p = (o) => {
+  const [s, l] = n.useState([]), [u, M] = n.useState(""), [i, a] = n.useState({}), p = (o) => {
     a((t) => g(t, o)), l((t) => t.filter((e) => e.id !== o));
   }, m = (o) => {
     l((t) => [...t, o]);
@@ -15,15 +15,15 @@ const x = (c) => {
   return I(() => {
     var t;
     const o = (t = [...s].pop()) == null ? void 0 : t.id;
-    u(o || ""), document.body.style.overflow = s.length ? "hidden" : "unset";
+    M(o || ""), document.body.style.overflow = s.length ? "hidden" : "unset";
   }, [s]), {
-    openModal: (o, t = "s", e) => {
+    openModal: (o, t = "s", e = !0) => {
       const y = (d, r) => ({
         id: S(),
         modal: o,
         props: {
           size: t,
-          isDouble: e,
+          showCloser: e,
           closeCallback: r,
           t: c,
           ...d
@@ -35,7 +35,7 @@ const x = (c) => {
     },
     modals: s,
     setModalDirty: f,
-    currentModalId: M,
+    currentModalId: u,
     dirtyModals: i,
     closeModal: p
   };

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

@@ -1 +1 @@
-{"version":3,"file":"use-modal.js","sources":["../../../src/modal/hooks/use-modal.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { v4 as uuid } from 'uuid';\n\nimport {\n    ModalObject, ModalSize, OwnModalProps, TFunction,\n} from '../types';\nimport { deletePropertyById } from '../utils/delete-property-by-id';\n\nexport const useModal = (t: TFunction) => {\n    const [modals, setModals] = React.useState<ModalObject[]>([]);\n    const [currentModalId, setCurrentModalId] = React.useState<string>('');\n    const [dirtyModals, setDirtyModals] = React.useState<Record<string, boolean>>({\n    });\n\n    const closeModal = (id: string) => {\n        setDirtyModals((oldDirtyModals) => deletePropertyById(oldDirtyModals, id));\n        setModals((oldModals) => oldModals.filter((modal) => modal.id !== id));\n    };\n\n    const addModal = (modal: ModalObject) => {\n        setModals((oldModals) => [...oldModals, modal]);\n    };\n\n    const setModalDirty = (id: string, isDirty: boolean) => {\n        setDirtyModals((rest) => ({\n            ...rest,\n            [id]: isDirty,\n        }));\n    };\n\n    useEffect(() => {\n        const latestModalId = [...modals].pop()?.id;\n\n        setCurrentModalId(latestModalId || '');\n        document.body.style.overflow = modals.length ? 'hidden' : 'unset';\n    }, [modals]);\n\n    const openModal = <T extends unknown>(modal: React.FC<T>, size: ModalSize = 's', isDouble?: boolean) => {\n        const getModal = (params?: OwnModalProps<T>, closeCallback?: () => void) => {\n            const id = uuid();\n\n            return {\n                id,\n                modal,\n                props: {\n                    size,\n                    isDouble,\n                    closeCallback,\n                    t,\n                    ...params,\n                },\n            } as unknown as ModalObject;\n        };\n\n        return (props?: OwnModalProps<T>, closeCallback?: () => void) => {\n            addModal(getModal(props, closeCallback));\n        };\n    };\n\n    return {\n        openModal, modals, setModalDirty, currentModalId, dirtyModals, closeModal,\n    };\n};\n"],"names":["useModal","t","modals","setModals","React","currentModalId","setCurrentModalId","dirtyModals","setDirtyModals","closeModal","id","oldDirtyModals","deletePropertyById","oldModals","modal","addModal","setModalDirty","isDirty","rest","useEffect","latestModalId","_a","size","isDouble","getModal","params","closeCallback","uuid","props"],"mappings":";;;AAQO,MAAMA,IAAW,CAACC,MAAiB;AACtC,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAwB,CAAA,CAAE,GACtD,CAACC,GAAgBC,CAAiB,IAAIF,EAAM,SAAiB,EAAE,GAC/D,CAACG,GAAaC,CAAc,IAAIJ,EAAM,SAAkC,CAAA,CAC7E,GAEKK,IAAa,CAACC,MAAe;AAC/B,IAAAF,EAAe,CAACG,MAAmBC,EAAmBD,GAAgBD,CAAE,CAAC,GACzEP,EAAU,CAACU,MAAcA,EAAU,OAAO,CAACC,MAAUA,EAAM,OAAOJ,CAAE,CAAC;AAAA,EACzE,GAEMK,IAAW,CAACD,MAAuB;AACrC,IAAAX,EAAU,CAACU,MAAc,CAAC,GAAGA,GAAWC,CAAK,CAAC;AAAA,EAClD,GAEME,IAAgB,CAACN,GAAYO,MAAqB;AACpD,IAAAT,EAAe,CAACU,OAAU;AAAA,MACtB,GAAGA;AAAA,MACH,CAACR,CAAE,GAAGO;AAAA,IAAA,EACR;AAAA,EACN;AAEA,SAAAE,EAAU,MAAM;;AACZ,UAAMC,KAAgBC,IAAA,CAAC,GAAGnB,CAAM,EAAE,UAAZ,gBAAAmB,EAAmB;AAEzC,IAAAf,EAAkBc,KAAiB,EAAE,GACrC,SAAS,KAAK,MAAM,WAAWlB,EAAO,SAAS,WAAW;AAAA,EAC9D,GAAG,CAACA,CAAM,CAAC,GAwBJ;AAAA,IACH,WAvBc,CAAoBY,GAAoBQ,IAAkB,KAAKC,MAAuB;AACpG,YAAMC,IAAW,CAACC,GAA2BC,OAGlC;AAAA,QACH,IAHOC,EAAA;AAAA,QAIP,OAAAb;AAAA,QACA,OAAO;AAAA,UACH,MAAAQ;AAAA,UACA,UAAAC;AAAA,UACA,eAAAG;AAAA,UACA,GAAAzB;AAAA,UACA,GAAGwB;AAAA,QAAA;AAAA,MACP;AAIR,aAAO,CAACG,GAA0BF,MAA+B;AAC7D,QAAAX,EAASS,EAASI,GAAOF,CAAa,CAAC;AAAA,MAC3C;AAAA,IACJ;AAAA,IAGe,QAAAxB;AAAA,IAAQ,eAAAc;AAAA,IAAe,gBAAAX;AAAA,IAAgB,aAAAE;AAAA,IAAa,YAAAE;AAAA,EAAA;AAEvE;"}
+{"version":3,"file":"use-modal.js","sources":["../../../src/modal/hooks/use-modal.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { v4 as uuid } from 'uuid';\n\nimport {\n    ModalObject, ModalSize, OwnModalProps, TFunction,\n} from '../types';\nimport { deletePropertyById } from '../utils/delete-property-by-id';\n\nexport const useModal = (t: TFunction) => {\n    const [modals, setModals] = React.useState<ModalObject[]>([]);\n    const [currentModalId, setCurrentModalId] = React.useState<string>('');\n    const [dirtyModals, setDirtyModals] = React.useState<Record<string, boolean>>({\n    });\n\n    const closeModal = (id: string) => {\n        setDirtyModals((oldDirtyModals) => deletePropertyById(oldDirtyModals, id));\n        setModals((oldModals) => oldModals.filter((modal) => modal.id !== id));\n    };\n\n    const addModal = (modal: ModalObject) => {\n        setModals((oldModals) => [...oldModals, modal]);\n    };\n\n    const setModalDirty = (id: string, isDirty: boolean) => {\n        setDirtyModals((rest) => ({\n            ...rest,\n            [id]: isDirty,\n        }));\n    };\n\n    useEffect(() => {\n        const latestModalId = [...modals].pop()?.id;\n\n        setCurrentModalId(latestModalId || '');\n        document.body.style.overflow = modals.length ? 'hidden' : 'unset';\n    }, [modals]);\n\n    const openModal = <T extends unknown>(modal: React.FC<T>, size: ModalSize = 's', showCloser = true) => {\n        const getModal = (params?: OwnModalProps<T>, closeCallback?: () => void) => {\n            const id = uuid();\n\n            return {\n                id,\n                modal,\n                props: {\n                    size,\n                    showCloser,\n                    closeCallback,\n                    t,\n                    ...params,\n                },\n            } as unknown as ModalObject;\n        };\n\n        return (props?: OwnModalProps<T>, closeCallback?: () => void) => {\n            addModal(getModal(props, closeCallback));\n        };\n    };\n\n    return {\n        openModal, modals, setModalDirty, currentModalId, dirtyModals, closeModal,\n    };\n};\n"],"names":["useModal","t","modals","setModals","React","currentModalId","setCurrentModalId","dirtyModals","setDirtyModals","closeModal","id","oldDirtyModals","deletePropertyById","oldModals","modal","addModal","setModalDirty","isDirty","rest","useEffect","latestModalId","_a","size","showCloser","getModal","params","closeCallback","uuid","props"],"mappings":";;;AAQO,MAAMA,IAAW,CAACC,MAAiB;AACtC,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAwB,CAAA,CAAE,GACtD,CAACC,GAAgBC,CAAiB,IAAIF,EAAM,SAAiB,EAAE,GAC/D,CAACG,GAAaC,CAAc,IAAIJ,EAAM,SAAkC,CAAA,CAC7E,GAEKK,IAAa,CAACC,MAAe;AAC/B,IAAAF,EAAe,CAACG,MAAmBC,EAAmBD,GAAgBD,CAAE,CAAC,GACzEP,EAAU,CAACU,MAAcA,EAAU,OAAO,CAACC,MAAUA,EAAM,OAAOJ,CAAE,CAAC;AAAA,EACzE,GAEMK,IAAW,CAACD,MAAuB;AACrC,IAAAX,EAAU,CAACU,MAAc,CAAC,GAAGA,GAAWC,CAAK,CAAC;AAAA,EAClD,GAEME,IAAgB,CAACN,GAAYO,MAAqB;AACpD,IAAAT,EAAe,CAACU,OAAU;AAAA,MACtB,GAAGA;AAAA,MACH,CAACR,CAAE,GAAGO;AAAA,IAAA,EACR;AAAA,EACN;AAEA,SAAAE,EAAU,MAAM;;AACZ,UAAMC,KAAgBC,IAAA,CAAC,GAAGnB,CAAM,EAAE,UAAZ,gBAAAmB,EAAmB;AAEzC,IAAAf,EAAkBc,KAAiB,EAAE,GACrC,SAAS,KAAK,MAAM,WAAWlB,EAAO,SAAS,WAAW;AAAA,EAC9D,GAAG,CAACA,CAAM,CAAC,GAwBJ;AAAA,IACH,WAvBc,CAAoBY,GAAoBQ,IAAkB,KAAKC,IAAa,OAAS;AACnG,YAAMC,IAAW,CAACC,GAA2BC,OAGlC;AAAA,QACH,IAHOC,EAAA;AAAA,QAIP,OAAAb;AAAA,QACA,OAAO;AAAA,UACH,MAAAQ;AAAA,UACA,YAAAC;AAAA,UACA,eAAAG;AAAA,UACA,GAAAzB;AAAA,UACA,GAAGwB;AAAA,QAAA;AAAA,MACP;AAIR,aAAO,CAACG,GAA0BF,MAA+B;AAC7D,QAAAX,EAASS,EAASI,GAAOF,CAAa,CAAC;AAAA,MAC3C;AAAA,IACJ;AAAA,IAGe,QAAAxB;AAAA,IAAQ,eAAAc;AAAA,IAAe,gBAAAX;AAAA,IAAgB,aAAAE;AAAA,IAAa,YAAAE;AAAA,EAAA;AAEvE;"}

package/dist/modal/types.d.ts

@@ -3,7 +3,7 @@ type ModalProps = {
     closeCallback: () => void;
     close: () => void;
     size: ModalSize;
-    isDouble?: boolean;
+    showCloser?: boolean;
     t: TFunction;
 } & unknown;
 export type TFunction = (field: string, options?: {
@@ -19,7 +19,7 @@ export type ModalObject = {
     props: ModalProps;
 };
 export type ContextProps = {
-    openModal: <T>(modal: React.FC<T>, size?: ModalSize, isDouble?: boolean) => (props?: OwnModalProps<T>, closeCallback?: () => void) => void;
+    openModal: <T>(modal: React.FC<T>, size?: ModalSize, showCloser?: boolean) => (props?: OwnModalProps<T>, closeCallback?: () => void) => void;
     modals: ModalObject[];
     currentModalId: ModalObject['id'];
     setModalDirty: (id: ModalObject['id'], isDirty: boolean) => void;

package/dist/popover/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{--popover-border-color: transparent;--popover-z-index: 2}.component_M4dA{background-color:var(--color-bg-primary);box-shadow:var(--shadow-s);border:1px solid var(--popover-border-color);z-index:var(--popover-z-index);transition-property:opacity;transition-timing-function:ease;box-sizing:border-box}.arrow_rhvi:after{content:"";display:block;position:absolute;width:10px;height:10px;background-color:var(--color-bg-primary);border:1px solid var(--popover-border-color);transform:rotate(45deg)}.component_M4dA[data-popper-placement=left] .arrow_rhvi,.component_M4dA[data-popper-placement=left-start] .arrow_rhvi,.component_M4dA[data-popper-placement=left-end] .arrow_rhvi{right:5px}:is(.component_M4dA[data-popper-placement=left] .arrow_rhvi,.component_M4dA[data-popper-placement=left-start] .arrow_rhvi,.component_M4dA[data-popper-placement=left-end] .arrow_rhvi):after{top:-4px;border-bottom:none;border-left:none}.component_M4dA[data-popper-placement=right] .arrow_rhvi,.component_M4dA[data-popper-placement=right-start] .arrow_rhvi,.component_M4dA[data-popper-placement=right-end] .arrow_rhvi{left:-6px}:is(.component_M4dA[data-popper-placement=right] .arrow_rhvi,.component_M4dA[data-popper-placement=right-start] .arrow_rhvi,.component_M4dA[data-popper-placement=right-end] .arrow_rhvi):after{top:-4px;border-top:none;border-right:none}.component_M4dA[data-popper-placement=top] .arrow_rhvi,.component_M4dA[data-popper-placement=top-start] .arrow_rhvi,.component_M4dA[data-popper-placement=top-end] .arrow_rhvi{bottom:5px}:is(.component_M4dA[data-popper-placement=top] .arrow_rhvi,.component_M4dA[data-popper-placement=top-start] .arrow_rhvi,.component_M4dA[data-popper-placement=top-end] .arrow_rhvi):after{left:-4px;border-top:none;border-left:none}.component_M4dA[data-popper-placement=bottom] .arrow_rhvi,.component_M4dA[data-popper-placement=bottom-start] .arrow_rhvi,.component_M4dA[data-popper-placement=bottom-end] .arrow_rhvi{top:-6px}:is(.component_M4dA[data-popper-placement=bottom] .arrow_rhvi,.component_M4dA[data-popper-placement=bottom-start] .arrow_rhvi,.component_M4dA[data-popper-placement=bottom-end] .arrow_rhvi):after{left:-4px;border-bottom:none;border-right:none}.enter_3MWR{opacity:0}.enterActive_pPMD,.exit_4hKA{opacity:1}.exitActive_vWe9{opacity:0}
+: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{--popover-border-color: transparent;--popover-z-index: 2}.component_M4dA{background-color:var(--color-bg-primary);box-shadow:var(--shadow-s);border:1px solid var(--popover-border-color);z-index:var(--popover-z-index);transition-property:opacity;transition-timing-function:ease;box-sizing:border-box}.arrow_rhvi{position:absolute;width:10px;height:10px;pointer-events:none}.arrow_rhvi:after{content:"";display:block;position:absolute;width:10px;height:10px;background-color:var(--color-bg-primary);border:1px solid var(--popover-border-color);transform:rotate(45deg)}.component_M4dA[data-popper-placement=left] .arrow_rhvi,.component_M4dA[data-popper-placement=left-start] .arrow_rhvi,.component_M4dA[data-popper-placement=left-end] .arrow_rhvi{right:5px}:is(.component_M4dA[data-popper-placement=left] .arrow_rhvi,.component_M4dA[data-popper-placement=left-start] .arrow_rhvi,.component_M4dA[data-popper-placement=left-end] .arrow_rhvi):after{top:-4px;border-bottom:none;border-left:none}.component_M4dA[data-popper-placement=right] .arrow_rhvi,.component_M4dA[data-popper-placement=right-start] .arrow_rhvi,.component_M4dA[data-popper-placement=right-end] .arrow_rhvi{left:-6px}:is(.component_M4dA[data-popper-placement=right] .arrow_rhvi,.component_M4dA[data-popper-placement=right-start] .arrow_rhvi,.component_M4dA[data-popper-placement=right-end] .arrow_rhvi):after{top:-4px;border-top:none;border-right:none}.component_M4dA[data-popper-placement=top] .arrow_rhvi,.component_M4dA[data-popper-placement=top-start] .arrow_rhvi,.component_M4dA[data-popper-placement=top-end] .arrow_rhvi{bottom:5px}:is(.component_M4dA[data-popper-placement=top] .arrow_rhvi,.component_M4dA[data-popper-placement=top-start] .arrow_rhvi,.component_M4dA[data-popper-placement=top-end] .arrow_rhvi):after{left:-4px;border-top:none;border-left:none}.component_M4dA[data-popper-placement=bottom] .arrow_rhvi,.component_M4dA[data-popper-placement=bottom-start] .arrow_rhvi,.component_M4dA[data-popper-placement=bottom-end] .arrow_rhvi{top:-6px}:is(.component_M4dA[data-popper-placement=bottom] .arrow_rhvi,.component_M4dA[data-popper-placement=bottom-start] .arrow_rhvi,.component_M4dA[data-popper-placement=bottom-end] .arrow_rhvi):after{left:-4px;border-bottom:none;border-right:none}.enter_3MWR{opacity:0}.enterActive_pPMD,.exit_4hKA{opacity:1}.exitActive_vWe9{opacity:0}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alphakits/ui",
-    "version": "2.0.4",
+    "version": "2.0.6",
     "files": [
         "dist"
     ],