@redneckz/wildless-cms-uni-blocks 0.14.688 → 0.14.689

package/mobile/bundle/bundle.umd.js

@@ -423,6 +423,17 @@
         handlerDecorator._impl = impl;
     };
 
+    function useEmitterWithActions(eventBus, type) {
+        const cache = useRef({});
+        return useMemo(() => new Proxy({}, {
+            get(_, actionType) {
+                cache.current ||= {};
+                cache.current[actionType] ||= action => eventBus.fire(type, { ...(action ?? {}), type: actionType });
+                return cache.current[actionType];
+            }
+        }), [eventBus, type]);
+    }
+
     class EventBus {
         watchers = new Set();
         subscribersMap = {};
@@ -474,11 +485,7 @@
 
     const defaultEventBus = new EventBus();
 
-    const useDialogManager = () => ({
-        open: (dialog, options = {}) => defaultEventBus.fire('dialog', { type: 'open', dialog, ...options }),
-        close: () => defaultEventBus.fire('dialog', { type: 'close' }),
-        closeAll: () => defaultEventBus.fire('dialog', { type: 'close', all: true }),
-    });
+    const useDialogManager = () => useEmitterWithActions(defaultEventBus.emitter, 'dialog');
 
     const adjustBase = (href, basePath = '') => href?.replace(basePath, '') || '/';
 
@@ -610,17 +617,18 @@
 
     const INITIAL_MOBILE_MODE = true;
 
+    const MOBILE_WIDTH = 1024;
+    const MOBILE_QUERY = `(max-width: ${MOBILE_WIDTH}px)`;
     const useMobileMode = () => {
-        const mq = `(max-width: 1024px)`;
-        const [isMobileMode, setIsMobileMode] = useState(INITIAL_MOBILE_MODE);
+        const [isMobileMode, setMobileMode] = useState(INITIAL_MOBILE_MODE);
         useEffect(() => {
-            const mqList = globalThis.matchMedia?.(mq);
+            const mqList = globalThis.matchMedia?.(MOBILE_QUERY);
             const mqHandler = () => {
-                setIsMobileMode(Boolean(mqList?.matches));
+                setMobileMode(Boolean(mqList?.matches));
             };
             mqList?.addEventListener('change', mqHandler);
             if (mqList?.matches) {
-                setIsMobileMode(Boolean(mqList.matches));
+                setMobileMode(true);
             }
             return () => {
                 mqList?.removeEventListener('change', mqHandler);
@@ -1209,6 +1217,18 @@
         return (jsx(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: jsxs("div", { className: "container max-w-[978px] space-y-lg", children: [title ? jsx(Heading, { headingType: "h3", title: title, className: "@xl:text-center" }) : null, children] }) }));
     });
 
+    function useDialog(Dialog, initialProps = {}) {
+        const { open, close, ...rest } = useDialogManager();
+        const openDialog = useCallback((props, options = {}) => open({
+            dialog: (jsx(Dialog, { ...initialProps, ...props, onClose: () => {
+                    close();
+                    props.onClose?.();
+                } })),
+            ...options,
+        }), [Dialog, open, close]);
+        return { open: openDialog, close, ...rest };
+    }
+
     const getConsentDataProcessing = (inputs) => inputs?.find((_) => _?.name === 'consentDataProcessing');
 
     function useBool(defaultValue = false) {
@@ -1380,11 +1400,7 @@
         return debouncedCallback;
     };
 
-    const usePopupManager = () => ({
-        open: (popup, options) => defaultEventBus.fire('popup', { type: 'open', popup, ...options }),
-        update: (popup, options) => defaultEventBus.fire('popup', { type: 'update', popup, ...options }),
-        close: () => defaultEventBus.fire('popup', { type: 'close' }),
-    });
+    const usePopupManager = () => useEmitterWithActions(defaultEventBus.emitter, 'popup');
 
     const InputPopup = JSX(({ options, onChange }) => (jsx("div", { className: "bg-white text-l max-h-64 overflow-y-auto overflow-x-hidden rounded-md shadow-2xl", role: "list", children: options?.map((item, key) => (jsx("div", { className: "flex px-m py-s cursor-pointer hover:bg-main-divider pr-5xl relative", role: "listitem", onMouseDown: () => onChange(item), children: jsx("span", { className: "min-h-6", children: item.processedValue }) }, key.toString()))) })));
 
@@ -1434,7 +1450,8 @@
                 debouncedGetHintsList(value);
                 prevInputValue.current = value;
             }
-            popup.update(jsx(InputPopup, { options: hintsList, value: value, onChange: handleChange }), {
+            popup.open({
+                popup: jsx(InputPopup, { options: hintsList, value: value, onChange: handleChange }),
                 top: top + globalThis.scrollY + height,
                 left,
                 width,
@@ -1502,7 +1519,8 @@
             }
             const inputElement = inputRef.current;
             const { top, left, width, height } = inputElement.getBoundingClientRect();
-            popup.update(jsx(SelectPopup, { popupRef: popupRef, options: options, value: value, query: query, onChange: handleChange, iconVersion: iconVersion }), {
+            popup.open({
+                popup: (jsx(SelectPopup, { popupRef: popupRef, options: options, value: value, query: query, onChange: handleChange, iconVersion: iconVersion })),
                 top: top + window.scrollY + height,
                 left,
                 width,
@@ -1890,8 +1908,21 @@
         }, []);
         const onChange = useCallback((value) => {
             field?.(fieldName)?.onChange?.({
-                ...field(fieldName).value,
+                apartment: '',
+                city: '',
+                district: '',
                 fullAddress: value,
+                fiasCode: '',
+                house: '',
+                locality: '',
+                okatoRegionCode: '',
+                postcode: '',
+                region: '',
+                regionCode: '',
+                street: '',
+                qc: '',
+                qcComplete: '',
+                qcHouse: '',
             });
         }, []);
         return (jsx(InputControl, { disabled: input?.filledByEsia && isEsiaAuthorize(field, fieldName), label: "\u0410\u0434\u0440\u0435\u0441", ...getValidation(field(fieldName), validatorObj[fieldName], input?.required), value: fieldValue.fullAddress, onChange: onChange, ...input, onDaDataChange: onDaDataChange }));
@@ -2935,11 +2966,15 @@
     };
 
     function useLocalStorage(key) {
-        const [storedValue, setStoredValue] = useState(JSON.parse(globalThis.localStorage?.getItem(key) || 'null'));
+        const initialValue = globalThis.localStorage?.getItem(key);
+        const [storedValue, setStoredValue] = useState(initialValue ? JSON.parse(initialValue) : null);
         const setValue = useCallback((value) => {
-            globalThis.localStorage?.setItem(key, JSON.stringify(value));
-            setStoredValue(value);
-        }, [key, globalThis.localStorage]);
+            setStoredValue((oldValue) => {
+                const newValue = value instanceof Function ? value(oldValue) : value;
+                globalThis.localStorage?.setItem(key, JSON.stringify(newValue));
+                return newValue;
+            });
+        }, [key]);
         return [storedValue, setValue];
     }
 
@@ -3007,6 +3042,11 @@
         },
     };
 
+    const feedbackById = async (id, convertToPng = false) => {
+        const response = await doRequest(`/feedback/file?id=${encodeURIComponent(id)}&convertToPngFlg=${convertToPng}`, 'GET');
+        return response ? await response.blob() : new Blob();
+    };
+
     function useButton() {
         return (props) => ({
             ...props,
@@ -3039,37 +3079,28 @@
                 : '', className), type: type, role: role, onClick: onClick, children: children }));
     });
 
-    const feedbackById = async (id, convertToPng = false) => {
-        const response = await doRequest(`/feedback/file?id=${encodeURIComponent(id)}&convertToPngFlg=${convertToPng}`, 'GET');
-        return response ? await response.blob() : new Blob();
-    };
-
-    const getDocument = async (id, convertToPng = false) => {
-        const response = await feedbackById(id, convertToPng);
-        return URL.createObjectURL(response);
-    };
-
     const CloseButton = JSX(({ className, onClose }) => (jsx("button", { className: style('flex justify-center items-center w-12 h-12 p-2xs bg-transparent border-none', className), onClick: onClose, title: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C", type: "button", children: jsx(Icon, { name: "CloseIcon", width: "20", height: "20", iconVersion: "gray" }) })));
 
-    const Dialog = JSX(({ className, head, children, onClose, onClick }) => {
-        const { close } = useDialogManager();
-        const handleClose = useCallback(() => {
-            close();
-            onClose && onClose();
-        }, [onClose]);
-        return (jsxs("div", { onClick: onClick, className: style('relative min-h-full bg-white pt-0 p-lg', className), role: "dialog", children: [jsxs("div", { className: "sticky py-xl top-0 bg-white z-10", children: [jsx(CloseButton, { className: "absolute top-0 right-0", onClose: handleClose }), jsx("div", { className: "container", children: head })] }), jsx("div", { className: "container pb-6xl", children: children })] }));
-    });
+    const Dialog = JSX(({ className, head, children, onClose, onClick }) => (jsxs("div", { className: style('relative min-h-full bg-white pt-0 p-lg', className), role: "dialog", onClick: onClick, children: [jsxs("div", { className: "sticky py-xl top-0 bg-white z-10", children: [jsx(CloseButton, { className: "absolute top-0 right-0", onClose: onClose }), jsx("div", { className: "container", children: head })] }), jsx("div", { className: "container pb-6xl", children: children })] })));
+
+    // TODO Перенесено как есть из openDocument. Требует рефакторинга
+    const DocumentDialog = JSX(({ src, convertToPng, onClose }) => (jsxs(Dialog, { className: "my-6xl max-w-4xl mx-auto px-0 min-h-0 pb-0", onClose: onClose, children: [convertToPng ? (jsx("img", { src: src })) : (jsx("iframe", { src: `${src}#toolbar=0`, className: "w-full h-[80vh]", id: "iframe-dialog" })), jsx(Button, { className: "mx-auto mt-m", type: "button", onClick: onClose, children: "\u041E\u0437\u043D\u0430\u043A\u043E\u043C\u0438\u0442\u044C\u0441\u044F" })] })));
 
-    const openDocument = async ({ open, close, id, convertToPng = false }) => {
-        const document = await getDocument(id, convertToPng);
-        open(jsxs(Dialog, { className: "my-6xl max-w-4xl mx-auto px-0 min-h-0 pb-0", children: [convertToPng ? (jsx("img", { src: document })) : (jsx("iframe", { src: `${document}#toolbar=0`, className: "w-full h-[80vh]", id: "iframe-dialog" })), jsx(Button, { className: "mx-auto mt-m", type: "button", onClick: close, children: "\u041E\u0437\u043D\u0430\u043A\u043E\u043C\u0438\u0442\u044C\u0441\u044F" })] }));
+    const useDocumentDialog = (docId) => {
+        const { open } = useDialog(DocumentDialog);
+        const isMobileMode = useMobileMode();
+        return useCallback(async () => {
+            if (docId) {
+                const src = URL.createObjectURL(await feedbackById(docId, isMobileMode));
+                open({ src });
+            }
+        }, [open, docId, isMobileMode]);
     };
 
     const OPEN_DOC_BUTTON_TEXT = 'Ознакомиться';
     const CheckboxWithDoc = JSX(({ className, error, docId, ...props }) => {
-        const { open, close } = useDialogManager();
-        const isMobile = useMobileMode();
-        return (jsxs("div", { className: className, children: [jsxs("div", { className: "flex flex-wrap gap-x-m", children: [jsx(Checkbox, { ...props }), docId ? (jsx(LinkButton, { className: "text-primary-main", onClick: () => openDocument({ open, close, id: docId, convertToPng: isMobile }), children: jsx(Text, { children: OPEN_DOC_BUTTON_TEXT }) })) : null] }), renderErrorText(error)] }));
+        const openDocument = useDocumentDialog(docId);
+        return (jsxs("div", { className: className, children: [jsxs("div", { className: "flex flex-wrap gap-x-m", children: [jsx(Checkbox, { ...props }), docId ? (jsx(LinkButton, { className: "text-primary-main", onClick: openDocument, children: jsx(Text, { children: OPEN_DOC_BUTTON_TEXT }) })) : null] }), renderErrorText(error)] }));
     });
 
     const ConsentField = JSX(({ field, input }) => input && input.name ? (jsx(CheckboxWithDoc, { text: CONSENTS[input.name]?.text, docId: CONSENTS[input.name]?.docId, ...getValidation(field(input.name), validatorObj[input.name], input?.required) })) : null);
@@ -3919,29 +3950,17 @@
 
     const renderTitle = (title) => title ? (jsx("div", { className: "@xl:text-center @xl:col-span-2 mb-m", children: jsx(Text, { size: "text-h6", children: title }) })) : null;
 
-    const ResponseTypeDialog = JSX(function ({ responseType, typeForm, }) {
+    const ResponseTypeDialog = JSX(({ responseType, typeForm, onClose }) => {
         const responseOK = responseType === 'OK';
         const statusIcon = responseOK ? 'ResponseOKIcon' : 'ResponseFailIcon';
-        const { close } = useDialogManager();
-        const handleClose = useCallback(() => {
-            close();
-        }, []);
         const responseOKDescription = typeForm === 'ANTIFRAUD'
             ? `Сообщение отправлено. Для уточнения информации с Вами могут связаться работники Банка либо Вы
   можете самостоятельно позвонить по номеру контакт-центра +78001000100. Будьте внимательны, работники Банка
    не звонят с использованием мессенджеров.`
             : 'Совсем скоро мы с вами свяжемся';
-        return (jsx(Dialog, { className: "my-6xl max-w-lg w-full min-h-fit mx-auto ", children: jsxs("div", { className: "flex flex-col gap-lg items-center rounded-md space-x-m", children: [jsx(Img, { image: { icon: statusIcon, iconVersion: 'normal' }, width: "136", height: "136" }), jsx(Headline, { className: "w-full", title: responseOK ? 'Ваша заявка отправлена' : 'Не удалось отправить заявку', description: responseOK ? responseOKDescription : 'Пожалуйста, повторите позднее', headlineVersion: "XS", isEmbedded: true }), jsx(Button, { type: "button", onClick: handleClose, children: "\u0425\u043E\u0440\u043E\u0448\u043E" })] }) }));
+        return (jsx(Dialog, { className: "my-6xl max-w-lg w-full min-h-fit mx-auto", onClose: onClose, children: jsxs("div", { className: "flex flex-col gap-lg items-center rounded-md space-x-m", children: [jsx(Img, { image: { icon: statusIcon, iconVersion: 'normal' }, width: "136", height: "136" }), jsx(Headline, { className: "w-full", title: responseOK ? 'Ваша заявка отправлена' : 'Не удалось отправить заявку', description: responseOK ? responseOKDescription : 'Пожалуйста, повторите позднее', headlineVersion: "XS", isEmbedded: true }), jsx(Button, { type: "button", onClick: onClose, children: "\u0425\u043E\u0440\u043E\u0448\u043E" })] }) }));
     });
 
-    const useResponseTypeDialog = (initialProps) => {
-        const { open, close } = useDialogManager();
-        return {
-            open: (props, options = {}) => open(jsx(ResponseTypeDialog, { ...initialProps, ...props }), options),
-            close,
-        };
-    };
-
     const objectValidator = (validatorsMap) => (o) => (o &&
         Object.entries(validatorsMap).flatMap(([key, validator]) => validator(o[key]))) ||
         [];
@@ -4032,7 +4051,7 @@
         const inputs = (sections?.flatMap((_) => _?.inputs) || []);
         const initialFormState = getInitialFormState$3(inputs, typeForm);
         const [responseType, setResponseType] = useState('');
-        const responseTypeDialog = useResponseTypeDialog({ typeForm });
+        const responseTypeDialog = useDialog(ResponseTypeDialog);
         const handleSubmit = useCallback(async (formData, ev) => {
             const inputsFiltered = getFilteredInputs(inputs, formData);
             const feedbackValidator = objectValidator(getObjectValidator(inputsFiltered));
@@ -4043,14 +4062,14 @@
             const status = (await API.send(formatData, endpoint === 'lead')) ? 'OK' : 'Fail';
             setResponseType(status);
             if (status) {
-                responseTypeDialog.open({ responseType: status });
+                responseTypeDialog.open({ typeForm, responseType: status });
             }
             if (status === 'OK' && data) {
                 const aspects = useAspects();
                 handleAspects({ aspectsAttributes: data, aspects, ev });
             }
             return status;
-        }, []);
+        }, [typeForm]);
         const [, { field, onSubmit, reset }] = useForm(initialFormState, { onSubmit: handleSubmit });
         const fieldName = getConsentDataProcessing(inputs)?.name;
         useEffect(() => {
@@ -4246,7 +4265,7 @@
                 ? children ?? (jsx("div", { className: "ml-s", children: jsx(Text, { font: "font-medium", color: TEXT_COLOR[bgColor], size: logoTitleSizeStyle, children: logo?.title ?? 'Россельхозбанк' }) }))
                 : null] })));
 
-    const CaptchaDialog = JSX(({ phoneNumber, close, sendCode, onClose }) => {
+    const CaptchaDialog = JSX(({ phoneNumber, sendCode, onClose }) => {
         const [captcha, setCaptcha] = useState('');
         const [code, setCode] = useState('');
         const [hasError, setHasError] = useState(false);
@@ -4254,28 +4273,19 @@
             const isValidCode = await checkCaptcha({ captchaText: code });
             if (isValidCode) {
                 sendCode?.();
-                close?.();
+                onClose?.();
             }
             else {
                 setHasError(isValidCode);
             }
-        }, [code]);
+        }, [code, sendCode]);
         const handleCreateCaptcha = useCallback(() => {
             (async () => setCaptcha(URL.createObjectURL(await createCaptcha(phoneNumber))))();
         }, []);
         useEffect(handleCreateCaptcha, []);
-        return (jsx(Dialog, { head: jsx(Logo, {}), onClose: onClose, className: "my-6xl max-w-lg w-full min-h-fit mx-auto rounded-lg", children: jsxs("div", { className: "flex flex-col gap-lg items-center rounded-md", children: [jsxs("div", { className: "flex h-36 w-72", children: [jsx("img", { className: "grow", src: captcha }), jsx("div", { onClick: handleCreateCaptcha, className: "flex w-8 items-center justify-center cursor-pointer", children: jsx(Icon, { iconVersion: "normal", name: "RefreshIcon" }) })] }), jsx(Input, { className: "w-[300px]", onChange: setCode, value: code, placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u043E\u0434 \u0441 \u043A\u0430\u0440\u0442\u0438\u043D\u043A\u0438" }), hasError ? jsx("div", { className: "text-error", children: "\u041D\u0435\u0432\u0435\u0440\u043D\u044B\u0439 \u043A\u043E\u0434" }) : null, jsxs("div", { className: "flex w-[310px] justify-between", children: [jsx(Button, { onClick: close, version: "secondary", children: "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F" }), jsx(Button, { type: "submit", disabled: !code, onClick: handleCheckCaptcha, version: "secondary", children: "\u041E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C" })] })] }) }));
+        return (jsx(Dialog, { className: "my-6xl max-w-lg w-full min-h-fit mx-auto rounded-lg", head: jsx(Logo, {}), onClose: onClose, children: jsxs("div", { className: "flex flex-col gap-lg items-center rounded-md", children: [jsxs("div", { className: "flex h-36 w-72", children: [jsx("img", { className: "grow", src: captcha }), jsx("div", { onClick: handleCreateCaptcha, className: "flex w-8 items-center justify-center cursor-pointer", children: jsx(Icon, { iconVersion: "normal", name: "RefreshIcon" }) })] }), jsx(Input, { className: "w-[300px]", onChange: setCode, value: code, placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u043E\u0434 \u0441 \u043A\u0430\u0440\u0442\u0438\u043D\u043A\u0438" }), hasError ? jsx("div", { className: "text-error", children: "\u041D\u0435\u0432\u0435\u0440\u043D\u044B\u0439 \u043A\u043E\u0434" }) : null, jsxs("div", { className: "flex w-[310px] justify-between", children: [jsx(Button, { onClick: close, version: "secondary", children: "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F" }), jsx(Button, { type: "submit", disabled: !code, onClick: handleCheckCaptcha, version: "secondary", children: "\u041E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C" })] })] }) }));
     });
 
-    const useCaptchaDialog = (initialProps, onClose) => {
-        const { open, close, closeAll } = useDialogManager();
-        return {
-            open: () => open(jsx(CaptchaDialog, { close: close, onClose: onClose, ...initialProps })),
-            close,
-            closeAll,
-        };
-    };
-
     const Timer = JSX(({ time, setTime, className }) => {
         useEffect(() => {
             const timer = setInterval(() => {
@@ -4348,94 +4358,77 @@
         }
     };
 
-    const useVerifyPhoneDialogSubmit = ({ close, values }) => {
-        const [hasError, setHasError] = useState(false);
+    const useVerifyPhoneDialogSubmit = ({ values, onSuccess, }) => {
         const [errorText, setErrorText] = useState('');
         const [isLoading, setIsLoading] = useState(false);
         const [timeNextReq, setTimeNextReq] = useState(0);
         const [isTimerStarted, setIsTimerStarted] = useState(false);
-        const [attemps, setAttemps] = useState(0);
-        const resetError = useCallback(() => {
-            setHasError(false);
-            setErrorText('');
-        }, []);
-        const isTimeExpired = useMemo(() => timeNextReq === 0 && isTimerStarted, [timeNextReq, isTimerStarted]);
-        const isSubmitButtonDisabled = useMemo(() => attemps > 2 || !values.every(Boolean) || isTimeExpired, [values]);
+        const [attempts, setAttempts] = useState(0);
+        const resetError = useCallback(() => setErrorText(''), []);
+        const isTimeExpired = Boolean(timeNextReq === 0 && isTimerStarted);
+        const isSubmitButtonDisabled = attempts > 2 || isTimeExpired || !values.every(Boolean);
         const handleSubmit = useCallback(async () => {
             try {
                 setIsTimerStarted(false);
                 setTimeNextReq(0);
-                setAttemps(attemps + 1);
+                setAttempts((_) => _ + 1);
                 setIsLoading(true);
                 await checkCode({
                     smsText: values.join(''),
                     smsCodesSetName: { key: 'AUTHENTICATION' },
                 });
                 resetError();
-                close && close(values.join(''));
+                onSuccess?.(values.join(''));
             }
             catch {
+                setErrorText(attempts > 1 ? 'Исчерпан лимит ввода смс-кода' : 'Неверный код');
+            }
+            finally {
                 setIsLoading(false);
-                attemps > 1 ? setErrorText('Исчерпан лимит ввода смс-кода') : setErrorText('Неверный код');
-                setHasError(true);
             }
-        }, [values, attemps]);
+        }, [values, attempts]);
         useEffect(() => {
-            if (isTimeExpired) {
-                setHasError(true);
-                setErrorText('Код просрочен');
-            }
-            else {
-                setHasError(false);
-            }
+            setErrorText(isTimeExpired ? 'Код просрочен' : '');
         }, [isTimeExpired]);
         return {
             handleSubmit,
-            hasError,
+            hasError: Boolean(errorText),
             errorText,
             isLoading,
             timeNextReq,
             isSubmitButtonDisabled,
             setTimeNextReq,
             setIsTimerStarted,
-            setAttemps,
+            setAttempts,
         };
     };
 
-    const VerifyPhoneDialog = JSX(({ close = noop, onClose = noop, title, description, __html, code = true, codeLength = 4, textButton = 'Далее', phoneNumber = '+79999999999', }) => {
+    const VerifyPhoneDialog = JSX(({ title, description, __html, code = true, codeLength = 4, textButton = 'Далее', phoneNumber = '+79999999999', onSuccess = noop, onClose = noop, }) => {
         const [values, setValues] = useState(Array(codeLength).fill(''));
-        const { handleSubmit, hasError, errorText, isLoading, timeNextReq, isSubmitButtonDisabled, setTimeNextReq, setIsTimerStarted, setAttemps, } = useVerifyPhoneDialogSubmit({ values, close });
+        const { handleSubmit, hasError, errorText, isLoading, timeNextReq, isSubmitButtonDisabled, setTimeNextReq, setIsTimerStarted, setAttempts, } = useVerifyPhoneDialogSubmit({ values, onSuccess });
+        const captchaDialog = useDialog(CaptchaDialog);
         const handleSendCode = useCallback(async () => {
             const isSuccessSendCode = await sendCode({
-                phoneNumber: phoneNumber,
+                phoneNumber,
                 smsCodesSetName: { key: 'AUTHENTICATION' },
             });
             if (isSuccessSendCode) {
-                setAttemps(0);
+                setAttempts(0);
                 setTimeNextReq(180);
                 setIsTimerStarted(true);
             }
             else {
-                captchaDialog.open();
+                captchaDialog.open({ phoneNumber, sendCode: handleSendCode, onClose });
             }
-        }, []);
-        const captchaDialog = useCaptchaDialog({ phoneNumber, sendCode: handleSendCode }, onClose);
+        }, [phoneNumber, onClose]);
         useEffect(() => {
             handleSendCode();
         }, []);
-        return (jsx(Dialog, { className: "my-6xl max-w-3xl w-full min-h-fit mx-auto rounded-xl px-5xl py-0", children: jsxs("div", { className: "flex flex-col gap-xl items-center rounded-md", children: [jsx(Headline, { className: "w-full", title: title, description: description, headlineVersion: "XS", isEmbedded: true, as: "h6" }), code ? (jsx(InputCode, { values: values, setValues: setValues, errorText: errorText, hasError: hasError })) : null, renderText$2(timeNextReq, setTimeNextReq, handleSendCode), jsx(RichText, { itemSize: "list-s", __html: __html }), renderTextButton(textButton, isSubmitButtonDisabled, handleSubmit), isLoading ? jsx(Loader, { blur: false }) : null] }) }));
+        return (jsx(Dialog, { className: "my-6xl max-w-3xl w-full min-h-fit mx-auto rounded-xl px-5xl py-0", onClose: onClose, children: jsxs("div", { className: "flex flex-col gap-xl items-center rounded-md", children: [jsx(Headline, { className: "w-full", title: title, description: description, headlineVersion: "XS", isEmbedded: true, as: "h6" }), code ? (jsx(InputCode, { values: values, setValues: setValues, errorText: errorText, hasError: hasError })) : null, renderText$2(timeNextReq, setTimeNextReq, handleSendCode), jsx(RichText, { itemSize: "list-s", __html: __html }), renderTextButton(textButton, isSubmitButtonDisabled, handleSubmit), isLoading ? jsx(Loader, { blur: false }) : null] }) }));
     });
     const renderTextButton = (textButton, isDisabled, handleSubmit) => textButton ? (jsx(SubmitButton, { isDisabled: isDisabled, onClick: handleSubmit, text: textButton })) : null;
     const renderText$2 = (timeNextReq, setTimeNextReq, handleSendCode) => timeNextReq ? (jsxs("div", { className: "flex flex-row text-l font-light text-base", children: ["\u041F\u043E\u043B\u0443\u0447\u0438\u0442\u044C \u043D\u043E\u0432\u044B\u0439 \u043A\u043E\u0434 \u043C\u043E\u0436\u043D\u043E \u0447\u0435\u0440\u0435\u0437", jsx(Timer, { className: "text-base ml-1", time: timeNextReq, setTime: setTimeNextReq })] })) : (jsx(LinkButton, { onClick: handleSendCode, className: "text-primary-main", children: "\u041F\u043E\u043B\u0443\u0447\u0438\u0442\u044C \u043D\u043E\u0432\u044B\u0439 \u043A\u043E\u0434" }));
 
-    const useVerifyPhoneDialog = () => {
-        const { open, close } = useDialogManager();
-        return {
-            open: (handleClose, props) => open(jsx(VerifyPhoneDialog, { onClose: close, close: handleClose, ...props })),
-            close,
-        };
-    };
-
     const defaultConsentText = {
         title: 'Подпишите согласие на запрос в БКИ',
         description: 'Согласие на запрос в Бюро кредитных историй (БКИ) ускорит решение по кредиту',
@@ -4444,33 +4437,32 @@
         title: 'Вы уверены, что хотите отказаться от запроса в БКИ',
         description: 'Согласие на запрос в Бюро кредитных историй (БКИ) повысит вероятность одобрения',
     };
-    const ConsentBkiDialog = JSX(function ({ handleSubmit = noop, onClose = noop, }) {
+    const ITEMS$1 = [
+        { id: 'SIGNED', text: 'Подписать' },
+        { id: 'REFUSE', text: 'Отказаться' },
+    ];
+    const CONSENT_BKI_ID = 2;
+    const ConsentBkiDialog = JSX(({ onSubmit = noop, onClose = noop }) => {
         const [confirmStatus, setConfirmStatus] = useState('');
-        const [showRefuceContent, setShowRefuceContent] = useState(false);
-        const { open, close } = useDialogManager();
-        const isMobile = useMobileMode();
-        const handleClose = useCallback(() => {
-            close();
-            handleSubmit(confirmStatus);
-        }, [confirmStatus]);
+        const [showRefuseContent, setShowRefuseContent] = useState(false);
+        const openDocument = useDocumentDialog(CONSENT_BKI_ID);
+        const handleSubmit = useCallback(() => {
+            onSubmit(confirmStatus);
+            onClose();
+        }, [onSubmit, confirmStatus]);
         const handleConfirmChange = useCallback((value) => {
             setConfirmStatus(value);
             if (value === 'REFUSE') {
-                setShowRefuceContent(true);
+                setShowRefuseContent(true);
             }
         }, []);
-        const consentText = showRefuceContent ? refuseConsentText : defaultConsentText;
-        return (jsx(Dialog, { className: "my-6xl max-w-3xl w-full min-h-fit mx-auto rounded-lg py-0 px-5xl", onClose: onClose, children: jsxs("div", { className: "flex flex-col gap-xl items-center", children: [jsx("div", { role: "button", onClick: () => openDocument({ open, close, id: CONSENT_BKI_ID, convertToPng: isMobile }), children: jsx(Heading, { className: "text-center text-balance", headingType: "h2", title: consentText.title }) }), jsx(Paragraph, { align: "text-center", children: consentText.description }), jsx(RadioButtonGroup, { className: "whitespace-normal", orientation: "horizontal", items: ITEMS$1, value: confirmStatus, onChange: handleConfirmChange }), jsx(Button, { disabled: !confirmStatus, type: "button", onClick: handleClose, children: "\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C" })] }) }));
+        const consentText = showRefuseContent ? refuseConsentText : defaultConsentText;
+        return (jsx(Dialog, { className: "my-6xl max-w-3xl w-full min-h-fit mx-auto rounded-lg py-0 px-5xl", onClose: onClose, children: jsxs("div", { className: "flex flex-col gap-xl items-center", children: [jsx("div", { role: "button", onClick: openDocument, children: jsx(Heading, { className: "text-center text-balance", headingType: "h2", title: consentText.title }) }), jsx(Paragraph, { align: "text-center", children: consentText.description }), jsx(RadioButtonGroup, { className: "whitespace-normal", orientation: "horizontal", items: ITEMS$1, value: confirmStatus, onChange: handleConfirmChange }), jsx(Button, { disabled: !confirmStatus, type: "button", onClick: handleSubmit, children: "\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C" })] }) }));
     });
-    const ITEMS$1 = [
-        { id: 'SIGNED', text: 'Подписать' },
-        { id: 'REFUSE', text: 'Отказаться' },
-    ];
-    const CONSENT_BKI_ID = 2;
 
     const useConsentBkiDialog = (onClose) => {
-        const { open, close } = useDialogManager();
-        const verifyPhoneDialog = useVerifyPhoneDialog();
+        const { open } = useDialog(ConsentBkiDialog);
+        const verifyPhoneDialog = useDialog(VerifyPhoneDialog);
         const handleSuccessVerify = (profileId) => async (smsCode) => {
             try {
                 if (profileId) {
@@ -4489,16 +4481,18 @@
             }
         };
         const handleSubmitBkiConstent = (phone, profileId) => async (confirmStatus) => {
-            close();
             if (confirmStatus === 'SIGNED' && phone) {
-                verifyPhoneDialog.open(handleSuccessVerify(profileId), verifyPhoneContent$1(phone));
+                verifyPhoneDialog.open({
+                    ...verifyPhoneContent$1(phone),
+                    onClose: handleSuccessVerify(profileId),
+                });
             }
             else {
                 onClose();
             }
         };
         return {
-            open: (phone, profileId) => open(jsx(ConsentBkiDialog, { handleSubmit: handleSubmitBkiConstent(phone, profileId), onClose: onClose })),
+            open: (phone, profileId) => open({ onSubmit: handleSubmitBkiConstent(phone, profileId), onClose }),
         };
     };
     const verifyPhoneContent$1 = (phone) => ({
@@ -4512,30 +4506,25 @@
 
     const getLink = (body) => fetchRetailJSON('/esia/getLink', 'POST', body);
 
-    const EsiaLoginDialog = JSX(function ({ handleClose }) {
+    const EsiaLoginDialog = JSX(({ onClose }) => {
         const navigator = locationNavigator();
         const handleAuth = useCallback(async () => {
             const resp = await getLink({
                 redirectUri: navigator.href,
             });
-            if (resp) {
+            if (resp?.link) {
                 navigator.assign(resp.link);
             }
         }, []);
-        return (jsx(Dialog, { className: "my-6xl max-w-lg w-full min-h-fit mx-auto rounded-lg", onClose: handleClose, children: jsxs("div", { className: "flex flex-col gap-lg items-center rounded-md", children: [jsxs("div", { className: "flex items-center justify-around w-full", children: [jsxs("ul", { className: "list-disc", children: [jsx("li", { children: "\u0412\u0435\u0440\u043E\u044F\u0442\u043D\u043E\u0441\u0442\u044C \u043E\u0434\u043E\u0431\u0440\u0435\u043D\u0438\u044F \u0432\u044B\u0448\u0435" }), jsx("li", { children: "\u0411\u0435\u0437 \u0441\u043F\u0440\u0430\u0432\u043E\u043A \u043E \u0434\u043E\u0445\u043E\u0434\u0430\u0445 \u0438 \u0442\u0440\u0443\u0434\u043E\u0443\u0441\u0442\u0440\u043E\u0439\u0441\u0442\u0432\u0435" }), jsx("li", { children: "\u0421 \u0437\u0430\u0449\u0438\u0442\u043E\u0439 \u0412\u0430\u0448\u0438\u0445 \u0434\u0430\u043D\u043D\u044B\u0445" })] }), jsx(Img, { image: { icon: 'GosUslugiIcon', iconVersion: 'normal' }, height: "70" })] }), jsxs("div", { className: "flex items-center justify-between w-full m-0", children: [jsx(Button, { type: "button", onClick: handleAuth, children: "\u0417\u0430\u043F\u043E\u043B\u043D\u0438\u0442\u044C \u0447\u0435\u0440\u0435\u0437 \u0413\u043E\u0441\u0443\u0441\u043B\u0443\u0433\u0438" }), jsx(Button, { type: "button", version: "secondary", onClick: handleClose, children: "\u041F\u0440\u043E\u043F\u0443\u0441\u0442\u0438\u0442\u044C" })] })] }) }));
+        return (jsx(Dialog, { className: "my-6xl max-w-lg w-full min-h-fit mx-auto rounded-lg", onClose: onClose, children: jsxs("div", { className: "flex flex-col gap-lg items-center rounded-md", children: [jsxs("div", { className: "flex items-center justify-around w-full", children: [jsxs("ul", { className: "list-disc", children: [jsx("li", { children: "\u0412\u0435\u0440\u043E\u044F\u0442\u043D\u043E\u0441\u0442\u044C \u043E\u0434\u043E\u0431\u0440\u0435\u043D\u0438\u044F \u0432\u044B\u0448\u0435" }), jsx("li", { children: "\u0411\u0435\u0437 \u0441\u043F\u0440\u0430\u0432\u043E\u043A \u043E \u0434\u043E\u0445\u043E\u0434\u0430\u0445 \u0438 \u0442\u0440\u0443\u0434\u043E\u0443\u0441\u0442\u0440\u043E\u0439\u0441\u0442\u0432\u0435" }), jsx("li", { children: "\u0421 \u0437\u0430\u0449\u0438\u0442\u043E\u0439 \u0412\u0430\u0448\u0438\u0445 \u0434\u0430\u043D\u043D\u044B\u0445" })] }), jsx(Img, { image: { icon: 'GosUslugiIcon', iconVersion: 'normal' }, height: "70" })] }), jsxs("div", { className: "flex items-center justify-between w-full m-0", children: [jsx(Button, { type: "button", onClick: handleAuth, children: "\u0417\u0430\u043F\u043E\u043B\u043D\u0438\u0442\u044C \u0447\u0435\u0440\u0435\u0437 \u0413\u043E\u0441\u0443\u0441\u043B\u0443\u0433\u0438" }), jsx(Button, { type: "button", version: "secondary", onClick: onClose, children: "\u041F\u0440\u043E\u043F\u0443\u0441\u0442\u0438\u0442\u044C" })] })] }) }));
     });
 
     const useEsiaLoginDialog = (nextStepLink) => {
-        const { open, close } = useDialogManager();
+        const { open } = useDialog(EsiaLoginDialog);
         const navigator = locationNavigator();
-        const handleClose = useCallback(() => {
-            close();
-            navigator.assign(nextStepLink);
-        }, []);
-        return {
-            open: (options = {}) => open(jsx(EsiaLoginDialog, { handleClose: handleClose }), options),
-            close,
-        };
+        return useCallback(() => {
+            open({ onClose: () => navigator.assign(nextStepLink) });
+        }, [open, nextStepLink]);
     };
 
     const fieldsNamesToContactKeysMap = {
@@ -4643,9 +4632,9 @@
         const [, setProfileId] = useLocalStorage('profileId');
         const [, setParticipantId] = useLocalStorage('participantId');
         const [, setProgramId] = useLocalStorage('programId');
-        const esiaLoginDialog = useEsiaLoginDialog(nextStepLink);
-        const consentBkiDialog = useConsentBkiDialog(esiaLoginDialog.open);
-        const verifyPhoneDialog = useVerifyPhoneDialog();
+        const openEsiaLoginDialog = useEsiaLoginDialog(nextStepLink);
+        const consentBkiDialog = useConsentBkiDialog(openEsiaLoginDialog);
+        const verifyPhoneDialog = useDialog(VerifyPhoneDialog);
         const saveUserData = useCallback(({ participantId, taskId, profileId, programId: programNumber }) => {
             setParticipantId(participantId);
             setTaskId(taskId);
@@ -4656,7 +4645,7 @@
         const handleSubmit = useCallback(async (formData) => {
             const feedbackValidator = objectValidator(getObjectValidator(inputs));
             if (!isValidationSuccess(feedbackValidator(formData))) {
-                return console.warn('validation fail');
+                return;
             }
             try {
                 const profileId = await createUserProfile({
@@ -4682,7 +4671,10 @@
                     const acceptedConsents = Object.keys(CONSENTS)
                         .filter((_) => formData[_])
                         .map((_) => CONSENTS[_]?.text);
-                    verifyPhoneDialog.open(handleSuccessVerify, verifyPhoneContent(formData?.phone, acceptedConsents));
+                    verifyPhoneDialog.open({
+                        ...verifyPhoneContent(formData?.phone, acceptedConsents),
+                        onSuccess: handleSuccessVerify,
+                    });
                 }
             }
             catch {
@@ -4786,32 +4778,36 @@
 
     const useInitApplicationLead = (nextStepLink) => {
         const navigator = locationNavigator();
-        const [isLoading, setIsLoading] = useState(false);
-        const [profileId] = useLocalStorage('profileId');
-        const [leadForm, setLeadForm] = useLocalStorage('leadForm');
-        const params = new URLSearchParams(decodeURIComponent(globalThis.location?.search));
-        const code = params.get('code');
-        const state = params.get('state');
-        const updateEsiaProfile = useCallback(async () => {
-            if (profileId && code && state) {
+        const [isLoading, { setTrue: startLoading, setFalse: endLoading }] = useBool(false);
+        const [, setLeadForm] = useLocalStorage('leadForm');
+        const updateEsiaProfile = useCallback(async (profileId, code, state) => {
+            startLoading();
+            try {
                 const data = await updateProfileEsia({
-                    profileId: profileId,
+                    profileId,
                     code,
                     state,
-                    redirectUri: navigator.href,
+                    redirectUri: globalThis.location?.href,
                 });
-                data &&
-                    setLeadForm({
-                        ...leadForm,
+                if (data) {
+                    setLeadForm((_) => ({
+                        ..._,
                         ...parseEsiaProfile(data),
-                    });
+                    }));
+                }
                 navigator.assign(nextStepLink);
             }
-        }, []);
+            finally {
+                endLoading();
+            }
+        }, [nextStepLink]);
         useEffect(() => {
-            if (code) {
-                setIsLoading(true);
-                updateEsiaProfile();
+            const profileId = JSON.parse(globalThis.localStorage?.getItem('profileId') ?? 'null');
+            const params = new URLSearchParams(decodeURIComponent(globalThis.location?.search));
+            const code = params.get('code');
+            const state = params.get('state');
+            if (profileId && code && state) {
+                updateEsiaProfile(profileId, code, state);
             }
             else {
                 sessionStorage.removeItem('accessToken');
@@ -4825,7 +4821,6 @@
 
     const ApplicationLeadForm = JSX(({ className, title, programId = '', nextStepLink = '/credit-lead', button, ...rest }) => {
         const inputs = (applicationFormData?.flatMap((_) => _?.inputs) || []);
-        const [responseType, setResponseType] = useState('');
         const { isLoading } = useInitApplicationLead(nextStepLink);
         const [leadForm, setLeadForm] = useLocalStorage('leadForm');
         const initialFormState = getInitialFormState$2(inputs, leadForm);
@@ -4835,17 +4830,13 @@
             nextStepLink,
             saveForm: setLeadForm,
         });
-        if (responseStatus) {
-            const responseTypeDialog = useResponseTypeDialog({ responseType: responseStatus });
-            responseTypeDialog.open();
-        }
-        const [, { field, onSubmit, reset }] = useForm(initialFormState, { onSubmit: handleSubmit });
+        const [, { field, onSubmit }] = useForm(initialFormState, { onSubmit: handleSubmit });
+        const responseTypeDialog = useDialog(ResponseTypeDialog);
         useEffect(() => {
-            if (responseType === 'OK') {
-                setResponseType('');
-                reset();
+            if (responseStatus) {
+                responseTypeDialog.open({ responseType: responseStatus });
             }
-        }, [responseType]);
+        }, [responseStatus]);
         return (jsx(ApplicationFormLayout, { className: style('container space-y-m', className), title: title, ...rest, children: jsxs("form", { onSubmit: onSubmit, className: "space-y-m relative", children: [isLoading ? jsx(Loader, { blur: false }) : null, applicationFormData.map((_, i) => (jsxs("div", { className: style(inputColumnStyles(_.columns), 'grid gap-x-m'), children: [renderTitle(_.title), renderInputs$2({ field, inputs: _?.inputs })] }, `section-${i}`))), renderSubmitButton(button)] }) }));
     });
 
@@ -8653,31 +8644,16 @@
         return docFormat.includes('/') ? docFormat.replace(regexp, '') : docFormat;
     };
 
-    const ReportDialog = JSX(({ href, __html, target }) => {
-        const { close } = useDialogManager();
+    const ReportDialog = JSX(({ href, __html, target, onClose }) => {
         const router = useRouter();
         const adjustedHref = adjustHref(router)(href);
-        const handleClose = useCallback(() => {
-            close();
-        }, []);
-        return (jsxs(Dialog, { className: "my-6xl min-h-fit w-fit mx-auto", children: [__html ? jsx(RichText, { __html: __html }) : null, jsxs("div", { className: "flex flex-row mx-auto w-fit gap-lg py-lg", children: [jsx(LinkButton, { text: "\u042F \u0441\u043E\u0433\u043B\u0430\u0441\u0435\u043D", version: "primary", target: target, href: adjustedHref, onClick: handleClose }), jsx(Button, { type: "button", version: "secondary", onClick: handleClose, children: "\u042F \u043D\u0435 \u0441\u043E\u0433\u043B\u0430\u0441\u0435\u043D" })] }), jsx("div", { children: "\u041D\u0430\u0436\u0438\u043C\u0430\u044F \u043A\u043D\u043E\u043F\u043A\u0443 \u00AB\u042F \u0421\u041E\u0413\u041B\u0410\u0421\u0415\u041D\u00BB \u043D\u0438\u0436\u0435 \u0412\u044B \u043F\u0440\u0438\u043D\u0438\u043C\u0430\u0435\u0442\u0435 \u0434\u0430\u043D\u043D\u044B\u0435 \u0443\u0441\u043B\u043E\u0432\u0438\u044F. \u0420\u0430\u0441\u043F\u0440\u043E\u0441\u0442\u0440\u0430\u043D\u0435\u043D\u0438\u0435 \u0438\u043B\u0438 \u0440\u0430\u0441\u043A\u0440\u044B\u0442\u0438\u0435 \u043B\u044E\u0431\u043E\u0439 \u0447\u0430\u0441\u0442\u0438 \u0434\u0430\u043D\u043D\u043E\u0433\u043E \u0417\u0430\u043A\u043B\u044E\u0447\u0435\u043D\u0438\u044F \u0438\u043B\u0438 \u043B\u044E\u0431\u043E\u0439 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0438, \u0438\u043B\u0438 \u0440\u0435\u043A\u043E\u043C\u0435\u043D\u0434\u0430\u0446\u0438\u0438 \u0432 \u043D\u0435\u043C \u0437\u0430\u043F\u0440\u0435\u0449\u0435\u043D\u043E.\u00BB" })] }));
+        return (jsxs(Dialog, { className: "my-6xl min-h-fit w-fit mx-auto", onClose: onClose, children: [__html ? jsx(RichText, { __html: __html }) : null, jsxs("div", { className: "flex flex-row mx-auto w-fit gap-lg py-lg", children: [jsx(LinkButton, { text: "\u042F \u0441\u043E\u0433\u043B\u0430\u0441\u0435\u043D", version: "primary", target: target, href: adjustedHref, onClick: onClose }), jsx(Button, { type: "button", version: "secondary", onClick: onClose, children: "\u042F \u043D\u0435 \u0441\u043E\u0433\u043B\u0430\u0441\u0435\u043D" })] }), jsx("div", { children: "\u041D\u0430\u0436\u0438\u043C\u0430\u044F \u043A\u043D\u043E\u043F\u043A\u0443 \u00AB\u042F \u0421\u041E\u0413\u041B\u0410\u0421\u0415\u041D\u00BB \u043D\u0438\u0436\u0435 \u0412\u044B \u043F\u0440\u0438\u043D\u0438\u043C\u0430\u0435\u0442\u0435 \u0434\u0430\u043D\u043D\u044B\u0435 \u0443\u0441\u043B\u043E\u0432\u0438\u044F. \u0420\u0430\u0441\u043F\u0440\u043E\u0441\u0442\u0440\u0430\u043D\u0435\u043D\u0438\u0435 \u0438\u043B\u0438 \u0440\u0430\u0441\u043A\u0440\u044B\u0442\u0438\u0435 \u043B\u044E\u0431\u043E\u0439 \u0447\u0430\u0441\u0442\u0438 \u0434\u0430\u043D\u043D\u043E\u0433\u043E \u0417\u0430\u043A\u043B\u044E\u0447\u0435\u043D\u0438\u044F \u0438\u043B\u0438 \u043B\u044E\u0431\u043E\u0439 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0438, \u0438\u043B\u0438 \u0440\u0435\u043A\u043E\u043C\u0435\u043D\u0434\u0430\u0446\u0438\u0438 \u0432 \u043D\u0435\u043C \u0437\u0430\u043F\u0440\u0435\u0449\u0435\u043D\u043E.\u00BB" })] }));
     });
 
-    const useReportDialog = (props) => {
-        const { open, close } = useDialogManager();
-        return {
-            open: (options = {}) => open(jsx(ReportDialog, { ...props }), options),
-            close,
-        };
-    };
-
     const ReportDialogButton = JSX(({ text, href, target, __html, icon }) => {
-        if (!text && !__html) {
-            return null;
-        }
-        const reportDialog = useReportDialog({ __html, href, target });
-        const openReportDialog = useCallback(() => reportDialog.open(), [reportDialog]);
-        return (jsxs("button", { className: "flex gap-s text-primary-text no-underline hover:text-primary-main", onClick: openReportDialog, children: [renderImg(icon), jsx(Text, { font: "font-light", children: text })] }));
+        const { open } = useDialog(ReportDialog);
+        const openReportDialog = useCallback(() => open({ __html, href, target }), [__html, href, target]);
+        return text ? (jsxs("button", { className: "flex gap-s text-primary-text no-underline hover:text-primary-main", onClick: openReportDialog, children: [renderImg(icon), jsx(Text, { font: "font-light", children: text })] })) : null;
     });
 
     const linkColumnsModeStyleMap = {
@@ -9231,30 +9207,39 @@
 
     const StickyBottomMenuItem = JSX(({ isActive, item, onClick }) => (jsxs("div", { className: style(isActive ? 'text-primary-main' : 'text-primary-text', `w-10 m-4 flex justify-center items-center flex-col text-xs cursor-pointer`), title: item?.title || '', onClick: onClick, children: [jsx(Icon, { className: "w-6 h-6", name: item?.icon?.icon, iconVersion: isActive ? 'color' : 'black' }), item?.title || ''] })));
 
-    const StickyBottomMenuDialog = JSX(({ className, head, children, onClose, onClick }) => {
-        const { close } = useDialogManager();
-        const handleClose = useCallback(() => {
-            close();
-            onClose && onClose();
-        }, [onClose]);
-        return (jsxs("div", { onClick: onClick, className: style('relative min-h-full bg-white p-0 rounded-xl top-32', className), role: "dialog", children: [jsxs("div", { className: "sticky py-xl top-0 rounded-xl bg-white z-10", children: [jsx(CloseButton, { className: "absolute top-1.5 right-0", onClose: handleClose }), jsx("div", { className: "container", children: head })] }), jsx("div", { className: "container pb-6xl", children: children })] }));
-    });
+    const StickyBottomMenuDialog = JSX(({ className, head, children, onClose, onClick }) => (jsxs("div", { onClick: onClick, className: style('relative min-h-full bg-white p-0 rounded-xl top-32', className), role: "dialog", children: [jsxs("div", { className: "sticky py-xl top-0 rounded-xl bg-white z-10", children: [jsx(CloseButton, { className: "absolute top-1.5 right-0", onClose: onClose }), jsx("div", { className: "container", children: head })] }), jsx("div", { className: "container pb-6xl", children: children })] })));
 
-    const useBottomMenuItemDialog = ({ menuRef, dialogRef, closeDialog, openDialog, leftItems, rightItems, }) => {
-        const openBottomMenuItemDialog = (index, itemsPosition) => {
+    const useBottomMenuItemDialog = ({ menuRef, dialogRef, leftItems, rightItems, onClose, }) => {
+        const { open, close } = useDialogManager();
+        const handleIframeLoad = useCallback(() => {
+            const ifDoc = document.getElementsByTagName('iframe')['iframe-dialog'];
+            ifDoc.style.height = `${ifDoc?.contentWindow?.document.body.offsetHeight}px`;
+        }, []);
+        return useCallback((index, itemsPosition) => {
             const requiredArray = itemsPosition === 'left' ? leftItems : rightItems;
             const menuDimensions = menuRef?.current?.getBoundingClientRect();
-            const handleIframeLoad = () => {
-                const ifDoc = document.getElementsByTagName('iframe')['iframe-dialog'];
-                ifDoc.style.height = String(ifDoc?.contentWindow?.document.body.offsetHeight) + 'px';
-            };
-            openDialog(jsx(StickyBottomMenuDialog, { onClick: (e) => e.stopPropagation(), onClose: closeDialog, className: "mt-[20%] border-t border-current", head: jsx("div", { className: "flex items-center justify-center px-xl", children: jsx(Heading, { as: "h4", title: requiredArray[index].description || requiredArray[index].title }) }), children: jsx("div", { className: "bg-white pb-20 pt-1 text-l", ref: dialogRef, children: jsx("iframe", { id: "iframe-dialog", onLoad: () => handleIframeLoad(), src: requiredArray[index]?.src, width: menuDimensions?.width || 0 }) }) }), { id: itemsPosition === 'left' ? leftItems[index].title : rightItems[index].title });
-        };
-        return [{ openBottomMenuItemDialog }];
+            open({
+                id: itemsPosition === 'left' ? leftItems[index].title : rightItems[index].title,
+                dialog: (jsx(StickyBottomMenuDialog, { className: "mt-[20%] border-t border-current", head: jsx("div", { className: "flex items-center justify-center px-xl", children: jsx(Heading, { as: "h4", title: requiredArray[index].description || requiredArray[index].title }) }), onClick: (e) => e.stopPropagation(), onClose: () => {
+                        close();
+                        onClose?.();
+                    }, children: jsx("div", { className: "bg-white pb-20 pt-1 text-l", ref: dialogRef, children: jsx("iframe", { id: "iframe-dialog", src: requiredArray[index]?.src, width: menuDimensions?.width ?? 0, onLoad: handleIframeLoad }) }) })),
+            });
+        }, [handleIframeLoad, leftItems, rightItems, onClose]);
     };
 
     const isDialogOpen = (id, dialogs) => Boolean(dialogs.find((item) => item.id === id, id));
 
+    function useObservableWithActions(eventBus, type, handlersMap) {
+        useEffect(() => eventBus.subscribe(type, action => {
+            const actionType = action?.type;
+            if (actionType && typeof actionType === 'string') {
+                const handler = handlersMap[actionType];
+                handler && handler(action);
+            }
+        }), [eventBus, type, ...Object.values(handlersMap)]);
+    }
+
     function useList(initialList = []) {
         const [list, setList] = useState(initialList);
         const push = useCallback((item) => setList(_ => [..._, item]), []);
@@ -9264,41 +9249,14 @@
         return [list, { setList, push, pop, remove, clear }];
     }
 
-    function assertUnreachable(x) {
-        throw new Error(x);
-    }
-
-    const useDialogsList = ({ onCloseAll, onClose, } = {}) => {
+    const useDialogsList = () => {
         const [dialogs, { push, pop, clear }] = useList();
-        const closeAll = useCallback(() => {
-            onCloseAll && onCloseAll(dialogs);
-            clear();
-        }, [dialogs, onCloseAll]);
-        const close = useCallback(() => {
-            onClose && onClose(dialogs[dialogs.length - 1]);
-            pop();
-        }, [dialogs, onClose]);
-        useEffect(() => defaultEventBus.subscribe('dialog', (action) => {
-            if (!action) {
-                return;
-            }
-            switch (action.type) {
-                case 'open':
-                    push(action);
-                    break;
-                case 'close':
-                    if (action.all) {
-                        closeAll();
-                    }
-                    else {
-                        close();
-                    }
-                    break;
-                default:
-                    assertUnreachable(action);
-            }
-        }), [closeAll, close]);
-        return dialogs;
+        useObservableWithActions(defaultEventBus.observable, 'dialog', {
+            open: push,
+            close: pop,
+            closeAll: clear,
+        });
+        return [dialogs, { close: pop, closeAll: clear }];
     };
 
     const groupBy = (list, keyGetter) => {
@@ -9398,18 +9356,17 @@
     });
 
     const SEARCH_TERM_MIN_LENGTH = 3;
-    const LocationDialog = JSX(({ foreignOffices, branches }) => {
+    const LocationDialog = JSX(({ foreignOffices, branches, onClose }) => {
         const locationStore = useDefaultLocation(branches?.default);
         const [query, setQuery] = useState('');
         const rawRegions = useRegions();
         const regions = useMemo(() => cleanUpRegions(rawRegions).sort((a, b) => a.name.localeCompare(b.name)), [rawRegions]);
         const regionsGroupByLetter = useMemo(() => groupBy(regions, regionFirstLetter), [regions]);
-        const { close } = useDialogManager();
         const handleChangeLocation = useCallback((_) => {
             locationStore.location = _;
-            close();
-        }, [locationStore]);
-        return (jsxs(Dialog, { className: "pb-20", head: jsxs("div", { children: [jsx(Text, { size: "text-h4", color: "text-primary-text", children: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0444\u0438\u043B\u0438\u0430\u043B" }), jsx(SelectedLocation, { defaultLocation: branches?.default }), jsx(SearchBar, { onSearch: setQuery, searchTerm: query })] }), children: [query && query.length >= SEARCH_TERM_MIN_LENGTH ? (jsx("div", { children: regions
+            onClose?.();
+        }, [locationStore, onClose]);
+        return (jsxs(Dialog, { className: "pb-20", head: jsxs("div", { children: [jsx(Text, { size: "text-h4", color: "text-primary-text", children: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0444\u0438\u043B\u0438\u0430\u043B" }), jsx(SelectedLocation, { defaultLocation: branches?.default }), jsx(SearchBar, { onSearch: setQuery, searchTerm: query })] }), onClose: onClose, children: [query && query.length >= SEARCH_TERM_MIN_LENGTH ? (jsx("div", { children: regions
                         .filter(({ name }) => name && jaroWinklerDistance(name.toLowerCase())(query.toLowerCase()) >= 0.8)
                         .map(renderRegion(branches?.dataSelect, handleChangeLocation)) })) : (jsx("div", { className: "columns-1 sm:columns-3 md:columns-4 lg:columns-5", children: Array.from(regionsGroupByLetter.entries()).map(renderRegionGroup(handleChangeLocation, branches?.dataSelect)) })), renderForeignOffices(foreignOffices)] }));
     });
@@ -9419,16 +9376,8 @@
         name: region.name?.replace(/республика|область|край'/gi, '').trim() ?? '',
     }));
 
-    const useLocationDialog = (props) => {
-        const { open, close } = useDialogManager();
-        return {
-            open: (options = {}) => open(jsx(LocationDialog, { ...props }), options),
-            close,
-        };
-    };
-
-    const BurgerMenuDialog = JSX(({ menuRef, menuItem, locationDialogProps, closeAll }) => {
-        const locationDialog = useLocationDialog(locationDialogProps || {});
+    const BurgerMenuDialog = JSX(({ menuRef, menuItem, locationDialogProps, onClose }) => {
+        const locationDialog = useDialog(LocationDialog, locationDialogProps);
         const { name: location } = useLocation();
         const menuDimensions = menuRef?.current?.getBoundingClientRect();
         const basePath = getBasePath(env.SITE_URL);
@@ -9446,10 +9395,10 @@
         useEffect(() => {
             const onMessage = (e) => {
                 if (e.data.type === 'location') {
-                    locationDialog.open();
+                    locationDialog.open({});
                 }
                 if (e.data.type === 'reload') {
-                    closeAll();
+                    onClose?.();
                 }
                 if (e.data.type === 'resize') {
                     const ifDoc = document.getElementsByTagName('iframe')['iframe-dialog'];
@@ -9462,26 +9411,17 @@
             return () => {
                 globalThis.removeEventListener('message', onMessage);
             };
-        }, []);
-        return (jsx(StickyBottomMenuDialog, { onClick: (e) => e.stopPropagation(), head: jsx("div", { className: "flex items-center justify-center px-xl", children: jsx(Heading, { as: "h4", title: menuItem?.title, className: "font-medium" }) }), children: jsx("div", { className: "bg-white pb-20 pt-1 text-l", children: jsx("iframe", { id: "iframe-dialog", name: "burger-menu-iframe", onLoad: () => handleIframeLoad(), src: menuItem?.src, width: menuDimensions?.width || 0 }) }) }));
+        }, [onClose]);
+        return (jsx(StickyBottomMenuDialog, { head: jsx("div", { className: "flex items-center justify-center px-xl", children: jsx(Heading, { as: "h4", title: menuItem?.title, className: "font-medium" }) }), onClick: (e) => e.stopPropagation(), onClose: onClose, children: jsx("div", { className: "bg-white pb-20 pt-1 text-l", children: jsx("iframe", { id: "iframe-dialog", name: "burger-menu-iframe", onLoad: () => handleIframeLoad(), src: menuItem?.src, width: menuDimensions?.width || 0 }) }) }));
     });
 
     const BURGER_MENU_DIALOG_ID = 'burgerMenuDialog';
-    const useBurgerMenuDialog = ({ menuRef, centralMenuItem, closeAll, openDialog, locationDialogProps, }) => {
-        const dialogs = useDialogsList();
+    const useBurgerMenuDialog = ({ menuRef, centralMenuItem, locationDialogProps, onClose = noop, }) => {
+        const { open } = useDialog(BurgerMenuDialog);
+        const [dialogs] = useDialogsList(); // TODO Рефакторинг
         const isBurgerMenuOpen = isDialogOpen(BURGER_MENU_DIALOG_ID, dialogs);
-        const open = () => openDialog(jsx(BurgerMenuDialog, { locationDialogProps: locationDialogProps, menuRef: menuRef, menuItem: centralMenuItem, closeAll: closeAll }), {
-            id: BURGER_MENU_DIALOG_ID,
-        });
-        const toggle = () => {
-            if (isBurgerMenuOpen) {
-                closeAll();
-            }
-            else {
-                open();
-            }
-        };
-        return [isBurgerMenuOpen, { toggle }];
+        const openDialog = useCallback(() => open({ menuRef, locationDialogProps, menuItem: centralMenuItem, onClose }, { id: BURGER_MENU_DIALOG_ID }), [menuRef, locationDialogProps, centralMenuItem, onClose]);
+        return [isBurgerMenuOpen, { toggle: isBurgerMenuOpen ? onClose : openDialog }];
     };
 
     const EMPTY_MENU = [];
@@ -9494,34 +9434,32 @@
         const rightItems = lateralMenuItems.slice(middleIdx);
         const [activeIndex, setActiveIndex] = useState(-1);
         const [currentItemPosition, setCurrentItemPosition] = useState('');
-        const { open: openDialog, closeAll } = useDialogManager();
-        const closeDialog = useCallback(() => {
+        const { closeAll } = useDialogManager();
+        const handleClose = useCallback(() => {
             setActiveIndex(-1);
             setCurrentItemPosition('');
             closeAll();
         }, [closeAll]);
-        const dialogRef = useOutsideClick(closeDialog);
+        const dialogRef = useOutsideClick(handleClose);
         const menuRef = useRef(null);
         const [isBurgerMenuDialogOpen, { toggle }] = useBurgerMenuDialog({
             menuRef,
             centralMenuItem,
-            closeAll,
-            openDialog,
             locationDialogProps: rest.header,
+            onClose: handleClose,
         });
-        const [{ openBottomMenuItemDialog }] = useBottomMenuItemDialog({
+        const openBottomMenuItemDialog = useBottomMenuItemDialog({
             menuRef,
             dialogRef,
-            closeDialog,
-            openDialog,
             leftItems,
             rightItems,
+            onClose: handleClose,
         });
         const handleMenuBurgerClick = useCallback((e) => {
-            closeDialog();
             e.stopPropagation();
+            handleClose();
             toggle();
-        }, [closeDialog, toggle]);
+        }, [handleClose, toggle]);
         const handleMenuItemClick = useCallback((index, itemsPosition) => {
             setCurrentItemPosition(itemsPosition);
             setActiveIndex(index);
@@ -9954,35 +9892,29 @@
         return opened && __html ? (jsx("div", { className: "container fixed left-0 right-0 bottom-0 z-50", role: "dialog", children: jsxs("div", { className: "bg-white m-xl p-xl rounded-md flex sm:items-center shadow-main-black", children: [jsx("div", { className: "sm:flex-1", children: jsx(RichText, { __html: __html }) }), jsx("div", { className: "ml-s sm:ml-0 w-36 flex justify-end", children: jsx(CloseButton, { className: "bg-main-gray rounded-md w-11 h-11", onClose: handleClose }) })] }) })) : null;
     });
 
-    const DialogManager = JSX(() => {
-        const handleCloseAll = useCallback((dialogActions) => {
-            for (const _ of dialogActions) {
-                _?.onClose && _.onClose();
-            }
-        }, []);
-        const handleClose = useCallback((_) => {
-            _?.onClose && _.onClose();
-        }, []);
-        const dialogs = useDialogsList({ onCloseAll: handleCloseAll, onClose: handleClose });
-        const { close } = useDialogManager();
+    function useOnEscape(handler) {
         const escapeHandler = useCallback(({ key }) => {
             if (key === 'Escape') {
-                close();
+                handler();
             }
-        }, []);
+        }, [handler]);
         useEventListener(globalThis.document, 'keydown', escapeHandler);
+    }
+
+    const DialogManager = JSX(() => {
+        const [dialogs, { close }] = useDialogsList();
+        const hasDialogs = Boolean(dialogs.length);
+        useOnEscape(close);
         useEffect(() => {
-            if (dialogs.length) {
-                globalThis.document?.body.classList.add('no-scrollbar');
-                globalThis.document?.body.classList.add('overflow-hidden');
+            if (hasDialogs) {
+                globalThis.document?.body.classList.add('no-scrollbar', 'overflow-hidden');
             }
             else {
-                globalThis.document?.body.classList.remove('no-scrollbar');
-                globalThis.document?.body.classList.remove('overflow-hidden');
+                globalThis.document?.body.classList.remove('no-scrollbar', 'overflow-hidden');
             }
-        }, [dialogs]);
-        return dialogs.length ? (jsx("div", { className: "fixed inset-0 z-50", role: "dialog", children: dialogs.map(({ dialog, id }, i) => (jsx("div", { className: style('absolute inset-0 overflow-x-hidden overflow-y-scroll no-scrollbar bg-black/50', {
-                    hidden: i !== dialogs.length - 1,
+        }, [hasDialogs]);
+        return hasDialogs ? (jsx("div", { className: "fixed inset-0 z-50", role: "dialog", children: dialogs.map(({ dialog, id }, i) => (jsx("div", { className: style('absolute inset-0 overflow-x-hidden overflow-y-scroll no-scrollbar bg-black/50', {
+                    hidden: i !== dialogs.length - 1, // TODO Чего?)
                 }), children: dialog }, String(id || i)))) })) : null;
     });
 
@@ -9991,28 +9923,11 @@
         const close = useCallback(() => {
             setPopup(null);
         }, []);
-        useEffect(() => defaultEventBus.subscribe('popup', (action) => {
-            if (!action) {
-                return;
-            }
-            switch (action.type) {
-                case 'open':
-                case 'update':
-                    setPopup(action);
-                    break;
-                case 'close':
-                    close();
-                    break;
-                default:
-                    assertUnreachable(action);
-            }
-        }), []);
-        const escapeHandler = useCallback(({ key }) => {
-            if (key === 'Escape') {
-                close();
-            }
-        }, [close]);
-        useEventListener(globalThis.document, 'keydown', escapeHandler);
+        useObservableWithActions(defaultEventBus.observable, 'popup', {
+            open: setPopup,
+            close,
+        });
+        useOnEscape(close);
         return popup ? (jsx("div", { className: style('z-50', popup.fixed ? 'fixed' : 'absolute'), style: {
                 left: `${popup.left}px`,
                 top: `${popup.top}px`,
@@ -10050,7 +9965,7 @@
         slots: () => [HEADER_SLOT, FOOTER_SLOT, STICKY_FOOTER_SLOT],
     });
 
-    const packageVersion = "0.14.687";
+    const packageVersion = "0.14.688";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;