fui-material 2.7.16 → 2.7.17

package/dist/f-ui-kit.es.js

@@ -7,32 +7,32 @@ import { renderToStaticMarkup } from "react-dom/server";
 import { initializeModule as initializeModule$1, installFormatCode } from "allorion-exporting-html-to-xlsx";
 import axios from "axios";
 import { useQueryClient, useMutation, useQuery } from "@tanstack/react-query";
-import './index.css';const btn = "_btn_u1cjw_1";
-const disabled$4 = "_disabled_u1cjw_31";
-const stylesBtn = {
+import './index.css';const btn = "_btn_1s0n3_1";
+const disabled$4 = "_disabled_1s0n3_31";
+const styles$A = {
   btn,
   disabled: disabled$4,
-  "btn-xs": "_btn-xs_u1cjw_40",
-  "btn-sm": "_btn-sm_u1cjw_51",
-  "btn-lg": "_btn-lg_u1cjw_62",
-  "btn-primary": "_btn-primary_u1cjw_73",
-  "btn-outline-primary": "_btn-outline-primary_u1cjw_87",
-  "btn-secondary": "_btn-secondary_u1cjw_104",
-  "btn-outline-secondary": "_btn-outline-secondary_u1cjw_118",
-  "btn-success": "_btn-success_u1cjw_135",
-  "btn-outline-success": "_btn-outline-success_u1cjw_149",
-  "btn-danger": "_btn-danger_u1cjw_166",
-  "btn-outline-danger": "_btn-outline-danger_u1cjw_180",
-  "btn-warning": "_btn-warning_u1cjw_197",
-  "btn-outline-warning": "_btn-outline-warning_u1cjw_211",
-  "btn-info": "_btn-info_u1cjw_228",
-  "btn-outline-info": "_btn-outline-info_u1cjw_242",
-  "btn-light": "_btn-light_u1cjw_259",
-  "btn-outline-light": "_btn-outline-light_u1cjw_274",
-  "btn-dark": "_btn-dark_u1cjw_291",
-  "btn-outline-dark": "_btn-outline-dark_u1cjw_305",
-  "btn-link": "_btn-link_u1cjw_322",
-  "btn-outline-link": "_btn-outline-link_u1cjw_338"
+  "btn-xs": "_btn-xs_1s0n3_40",
+  "btn-sm": "_btn-sm_1s0n3_51",
+  "btn-lg": "_btn-lg_1s0n3_62",
+  "btn-primary": "_btn-primary_1s0n3_73",
+  "btn-outline-primary": "_btn-outline-primary_1s0n3_87",
+  "btn-secondary": "_btn-secondary_1s0n3_104",
+  "btn-outline-secondary": "_btn-outline-secondary_1s0n3_118",
+  "btn-success": "_btn-success_1s0n3_135",
+  "btn-outline-success": "_btn-outline-success_1s0n3_149",
+  "btn-danger": "_btn-danger_1s0n3_166",
+  "btn-outline-danger": "_btn-outline-danger_1s0n3_180",
+  "btn-warning": "_btn-warning_1s0n3_197",
+  "btn-outline-warning": "_btn-outline-warning_1s0n3_211",
+  "btn-info": "_btn-info_1s0n3_228",
+  "btn-outline-info": "_btn-outline-info_1s0n3_242",
+  "btn-light": "_btn-light_1s0n3_259",
+  "btn-outline-light": "_btn-outline-light_1s0n3_274",
+  "btn-dark": "_btn-dark_1s0n3_291",
+  "btn-outline-dark": "_btn-outline-dark_1s0n3_305",
+  "btn-link": "_btn-link_1s0n3_322",
+  "btn-outline-link": "_btn-outline-link_1s0n3_338"
 };
 const FButton = forwardRef(({
   children,
@@ -55,9 +55,9 @@ const FButton = forwardRef(({
   };
   const variantClass = variant === "contained" ? `btn-${color}` : `btn-outline-${color}`;
   const buttonClasses = [
-    stylesBtn["btn"],
-    stylesBtn[size],
-    stylesBtn[variantClass],
+    styles$A["btn"],
+    styles$A[size],
+    styles$A[variantClass],
     className
   ].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsx(
@@ -75,8 +75,8 @@ const FButton = forwardRef(({
 });
 FButton.displayName = "FButton";
 const defaultStyles = {
-  "f-button-file": "_f-button-file_i2hex_1",
-  "file-preview-list": "_file-preview-list_i2hex_1"
+  "f-button-file": "_f-button-file_7ljnt_1",
+  "file-preview-list": "_file-preview-list_7ljnt_1"
 };
 const FTrashIcon = React.forwardRef(({
   color = "primary",
@@ -120,15 +120,15 @@ const FTrashIcon = React.forwardRef(({
   );
 });
 FTrashIcon.displayName = "FTrashIcon";
-const progressBar = "_progressBar_1xp9s_48";
-const completed = "_completed_1xp9s_60";
-const progress = "_progress_1xp9s_48";
+const progressBar = "_progressBar_1iwax_48";
+const completed = "_completed_1iwax_60";
+const progress = "_progress_1iwax_48";
 const styles$z = {
-  "file-preview-card": "_file-preview-card_1xp9s_1",
-  "file-preview-info": "_file-preview-info_1xp9s_22",
-  "file-preview-name": "_file-preview-name_1xp9s_28",
-  "file-preview-size": "_file-preview-size_1xp9s_36",
-  "trash-icon": "_trash-icon_1xp9s_42",
+  "file-preview-card": "_file-preview-card_1iwax_1",
+  "file-preview-info": "_file-preview-info_1iwax_22",
+  "file-preview-name": "_file-preview-name_1iwax_28",
+  "file-preview-size": "_file-preview-size_1iwax_36",
+  "trash-icon": "_trash-icon_1iwax_42",
   progressBar,
   completed,
   progress
@@ -715,26 +715,26 @@ const FPaper = ({
     }
   );
 };
-const bordered = "_bordered_ld5gh_18";
-const left$1 = "_left_ld5gh_40";
-const center = "_center_ld5gh_43";
-const right = "_right_ld5gh_46";
+const bordered = "_bordered_1blpv_18";
+const left$1 = "_left_1blpv_40";
+const center = "_center_1blpv_43";
+const right = "_right_1blpv_46";
 const styles$t = {
-  "f-table-component": "_f-table-component_ld5gh_1",
-  "f-table-component__table": "_f-table-component__table_ld5gh_7",
+  "f-table-component": "_f-table-component_1blpv_1",
+  "f-table-component__table": "_f-table-component__table_1blpv_7",
   bordered,
-  "bordered-half": "_bordered-half_ld5gh_22",
-  "f-table-component__table_header": "_f-table-component__table_header_ld5gh_25",
-  "is-sticky": "_is-sticky_ld5gh_29",
-  "f-table-component__table_header-cell": "_f-table-component__table_header-cell_ld5gh_37",
+  "bordered-half": "_bordered-half_1blpv_22",
+  "f-table-component__table_header": "_f-table-component__table_header_1blpv_25",
+  "is-sticky": "_is-sticky_1blpv_29",
+  "f-table-component__table_header-cell": "_f-table-component__table_header-cell_1blpv_37",
   left: left$1,
   center,
   right,
-  "f-table-component__table_body": "_f-table-component__table_body_ld5gh_65",
-  "f-table-component__table_row": "_f-table-component__table_row_ld5gh_68",
-  "f-table-component__table_row_no-hover": "_f-table-component__table_row_no-hover_ld5gh_68",
-  "f-table-component__table_body-cell": "_f-table-component__table_body-cell_ld5gh_81",
-  "f-table-component__table_footer": "_f-table-component__table_footer_ld5gh_97"
+  "f-table-component__table_body": "_f-table-component__table_body_1blpv_65",
+  "f-table-component__table_row": "_f-table-component__table_row_1blpv_68",
+  "f-table-component__table_row_no-hover": "_f-table-component__table_row_no-hover_1blpv_68",
+  "f-table-component__table_body-cell": "_f-table-component__table_body-cell_1blpv_81",
+  "f-table-component__table_footer": "_f-table-component__table_footer_1blpv_97"
 };
 const FTableHead = ({
   st,
@@ -1021,20 +1021,20 @@ const FTableFooter = ({
     }
   );
 };
-const entering = "_entering_dwagt_17";
-const exiting = "_exiting_dwagt_23";
-const hide = "_hide_dwagt_45";
+const entering = "_entering_wcyn4_19";
+const exiting = "_exiting_wcyn4_25";
+const hide = "_hide_wcyn4_50";
 const styles$s = {
-  "f-dialog": "_f-dialog_dwagt_1",
+  "f-dialog": "_f-dialog_wcyn4_1",
   entering,
-  "f-dialog__content": "_f-dialog__content_dwagt_20",
+  "f-dialog__content": "_f-dialog__content_wcyn4_22",
   exiting,
   hide,
-  "f-dialog__header": "_f-dialog__header_dwagt_49",
-  "f-dialog__header_title": "_f-dialog__header_title_dwagt_61",
-  "f-dialog__header_close": "_f-dialog__header_close_dwagt_72",
-  "f-dialog__body": "_f-dialog__body_dwagt_87",
-  "f-dialog__footer": "_f-dialog__footer_dwagt_92"
+  "f-dialog__header": "_f-dialog__header_wcyn4_61",
+  "f-dialog__header_title": "_f-dialog__header_title_wcyn4_73",
+  "f-dialog__header_close": "_f-dialog__header_close_wcyn4_84",
+  "f-dialog__body": "_f-dialog__body_wcyn4_110",
+  "f-dialog__footer": "_f-dialog__footer_wcyn4_134"
 };
 let openDialogsCount = 0;
 const FDialog = ({
@@ -1164,14 +1164,22 @@ FCloseIcon.displayName = "FCloseIcon";
 const FDialogHeader = ({ title: title2, handleClose }) => {
   return /* @__PURE__ */ jsxs("div", { className: styles$s["f-dialog__header"], children: [
     /* @__PURE__ */ jsx("h3", { className: styles$s["f-dialog__header_title"], children: title2 }),
-    handleClose && /* @__PURE__ */ jsx("div", { className: styles$s["f-dialog__header_close"], children: /* @__PURE__ */ jsx(
-      FCloseIcon,
+    handleClose && /* @__PURE__ */ jsx(
+      "button",
       {
-        handleClose,
-        color: "primary",
-        size: 30
+        type: "button",
+        className: styles$s["f-dialog__header_close"],
+        onClick: handleClose,
+        "aria-label": "Закрыть диалог",
+        children: /* @__PURE__ */ jsx(
+          FCloseIcon,
+          {
+            color: "secondary",
+            size: 18
+          }
+        )
       }
-    ) })
+    )
   ] });
 };
 const FDialogBody = ({ st, children, scroll = true }) => {
@@ -1192,26 +1200,26 @@ const FDialogFooter = ({ children, className, st, id }) => {
     }
   );
 };
-const loader = "_loader_1lhk7_1";
-const primary = "_primary_1lhk7_42";
-const secondary = "_secondary_1lhk7_46";
-const success$1 = "_success_1lhk7_50";
-const danger = "_danger_1lhk7_54";
-const warning$4 = "_warning_1lhk7_58";
-const info$2 = "_info_1lhk7_62";
-const light = "_light_1lhk7_66";
-const dark = "_dark_1lhk7_70";
-const link = "_link_1lhk7_74";
+const loader = "_loader_1glrn_1";
+const primary = "_primary_1glrn_42";
+const secondary = "_secondary_1glrn_46";
+const success$2 = "_success_1glrn_50";
+const danger = "_danger_1glrn_54";
+const warning$5 = "_warning_1glrn_58";
+const info$3 = "_info_1glrn_62";
+const light = "_light_1glrn_66";
+const dark = "_dark_1glrn_70";
+const link = "_link_1glrn_74";
 const styles$r = {
-  "authorization-spinner": "_authorization-spinner_1lhk7_1",
-  "spinner-item": "_spinner-item_1lhk7_7",
+  "authorization-spinner": "_authorization-spinner_1glrn_1",
+  "spinner-item": "_spinner-item_1glrn_7",
   loader,
   primary,
   secondary,
-  success: success$1,
+  success: success$2,
   danger,
-  warning: warning$4,
-  info: info$2,
+  warning: warning$5,
+  info: info$3,
   light,
   dark,
   link
@@ -1261,7 +1269,7 @@ const FPreloader = ({
   );
 };
 const styles$p = {
-  "f-checkbox": "_f-checkbox_9rvqg_1"
+  "f-checkbox": "_f-checkbox_1j5ck_1"
 };
 const FCheckbox = forwardRef(
   ({
@@ -1284,7 +1292,7 @@ const FCheckbox = forwardRef(
   }
 );
 const styles$o = {
-  "f-radio": "_f-radio_cwhmx_1"
+  "f-radio": "_f-radio_1oidm_1"
 };
 const FRadioButton = forwardRef(
   ({
@@ -1353,14 +1361,14 @@ const usePagination = ({
   }, [totalCount, pageSize, siblingCount, currentPage]);
   return paginationRange;
 };
-const dots = "_dots_aham2_29";
-const selected$1 = "_selected_aham2_33";
-const disabled$3 = "_disabled_aham2_37";
-const arrow = "_arrow_aham2_43";
-const left = "_left_aham2_56";
+const dots = "_dots_uiqea_29";
+const selected$1 = "_selected_uiqea_33";
+const disabled$3 = "_disabled_uiqea_37";
+const arrow = "_arrow_uiqea_43";
+const left = "_left_uiqea_56";
 const styles$n = {
-  "pagination-container": "_pagination-container_aham2_1",
-  "pagination-item": "_pagination-item_aham2_9",
+  "pagination-container": "_pagination-container_uiqea_1",
+  "pagination-item": "_pagination-item_uiqea_9",
   dots,
   selected: selected$1,
   disabled: disabled$3,
@@ -1673,16 +1681,16 @@ const FOpenImgFull = ({
     }
   );
 };
-const card$2 = "_card_1pttw_1";
-const warning$3 = "_warning_1pttw_16";
-const info$1 = "_info_1pttw_24";
-const alert = "_alert_1pttw_32";
+const card$2 = "_card_1wjhl_1";
+const warning$4 = "_warning_1wjhl_16";
+const info$2 = "_info_1wjhl_24";
+const alert = "_alert_1wjhl_32";
 const styles$k = {
   card: card$2,
-  warning: warning$3,
-  info: info$1,
+  warning: warning$4,
+  info: info$2,
   alert,
-  "fv-accord-title": "_fv-accord-title_1pttw_57"
+  "fv-accord-title": "_fv-accord-title_1wjhl_57"
 };
 const FAccordion = ({
   variant = "info",
@@ -1722,14 +1730,14 @@ const FAccordion = ({
     }
   );
 };
-const container$1 = "_container_6r9j2_1";
+const container$1 = "_container_qk7bc_1";
 const styles$j = {
   container: container$1,
-  "custom-file": "_custom-file_6r9j2_6",
-  "custom-file-input": "_custom-file-input_6r9j2_9",
-  "custom-file-dropzone": "_custom-file-dropzone_6r9j2_24",
-  "custom-file-label": "_custom-file-label_6r9j2_24",
-  "custom-files-preview": "_custom-files-preview_6r9j2_71"
+  "custom-file": "_custom-file_qk7bc_6",
+  "custom-file-input": "_custom-file-input_qk7bc_9",
+  "custom-file-dropzone": "_custom-file-dropzone_qk7bc_24",
+  "custom-file-label": "_custom-file-label_qk7bc_24",
+  "custom-files-preview": "_custom-files-preview_qk7bc_71"
 };
 const FInputFileForm = ({
   id,
@@ -2068,15 +2076,15 @@ const FFullDateField = forwardRef(
     );
   }
 );
-const active$3 = "_active_yhck3_41";
+const active$3 = "_active_1h0yy_41";
 const styles$h = {
-  "f-select-search-db": "_f-select-search-db_yhck3_1",
-  "f-select-search-db__input": "_f-select-search-db__input_yhck3_7",
-  "f-select-search-db__input_field": "_f-select-search-db__input_field_yhck3_11",
-  "f-select-search-db__input_arrow": "_f-select-search-db__input_arrow_yhck3_14",
-  "f-select-search-db__dropdown": "_f-select-search-db__dropdown_yhck3_21",
+  "f-select-search-db": "_f-select-search-db_1h0yy_1",
+  "f-select-search-db__input": "_f-select-search-db__input_1h0yy_7",
+  "f-select-search-db__input_field": "_f-select-search-db__input_field_1h0yy_11",
+  "f-select-search-db__input_arrow": "_f-select-search-db__input_arrow_1h0yy_14",
+  "f-select-search-db__dropdown": "_f-select-search-db__dropdown_1h0yy_21",
   active: active$3,
-  "f-select-search-db__dropdown_content": "_f-select-search-db__dropdown_content_yhck3_45"
+  "f-select-search-db__dropdown_content": "_f-select-search-db__dropdown_content_1h0yy_45"
 };
 const FSelectSearchDb = ({
   fetchingFunc,
@@ -2427,8 +2435,8 @@ const FAlert = ({
   buttonClose = false,
   size
 }) => {
-  const visible = useRef();
-  const hidden = useRef();
+  const visible2 = useRef();
+  const hidden2 = useRef();
   const close = useRef();
   const [randomId] = useState(fGenerateUniqueId());
   let newTime = displayTime;
@@ -2446,7 +2454,7 @@ const FAlert = ({
         });
       }
     }
-    visible.current = setTimeout(() => {
+    visible2.current = setTimeout(() => {
       if (open) {
         const el = document.querySelector(`#f-block-alert-${randomId}`);
         if (el !== null) {
@@ -2461,7 +2469,7 @@ const FAlert = ({
         const el = document.querySelector(`#f-block-alert-${randomId}`);
         if (el !== null) {
           progress2.style.transition = `${newTime}s linear`;
-          hidden.current = setTimeout(() => {
+          hidden2.current = setTimeout(() => {
             el.classList.remove("f-alert-visible");
             el.classList.add("f-alert-hidden");
           }, (newTime - 1) * 1e3);
@@ -2616,8 +2624,8 @@ const FAlert = ({
                   onClose(false);
                   el.classList.remove("f-alert-visible");
                   el.classList.remove("f-alert-hidden");
-                  clearTimeout(visible.current);
-                  clearTimeout(hidden.current);
+                  clearTimeout(visible2.current);
+                  clearTimeout(hidden2.current);
                   clearTimeout(close.current);
                 }
               }
@@ -2707,14 +2715,14 @@ const FNative = ({
     )
   ] });
 };
-const horizontal = "_horizontal_zlvc7_1";
-const vertical = "_vertical_zlvc7_7";
-const active$2 = "_active_zlvc7_50";
+const horizontal = "_horizontal_hbjfv_1";
+const vertical = "_vertical_hbjfv_7";
+const active$2 = "_active_hbjfv_50";
 const styles$f = {
-  "f-tabs": "_f-tabs_zlvc7_1",
+  "f-tabs": "_f-tabs_hbjfv_1",
   horizontal,
   vertical,
-  "f-tabs__tab": "_f-tabs__tab_zlvc7_16",
+  "f-tabs__tab": "_f-tabs__tab_hbjfv_16",
   active: active$2
 };
 const FTabs = ({
@@ -3081,9 +3089,9 @@ const FCarouselItem = ({
 }) => {
   return /* @__PURE__ */ jsx("div", { className: `${styles$c["f-carousel-item"]} ${className || ""}`, id, children });
 };
-const skeleton = "_skeleton_1ojrt_1";
+const skeleton = "_skeleton_3ica6_1";
 const styles$b = {
-  "skeleton-block": "_skeleton-block_1ojrt_1",
+  "skeleton-block": "_skeleton-block_3ica6_1",
   skeleton
 };
 const FSkeleton = ({ children, enable, width, height }) => {
@@ -4571,161 +4579,301 @@ const FArrowDownCircleIcon = React.forwardRef(({
   );
 });
 FArrowDownCircleIcon.displayName = "FArrowDownCircleIcon";
+const visible$2 = "_visible_1ryqy_19";
+const hidden$2 = "_hidden_1ryqy_22";
+const info$1 = "_info_1ryqy_71";
+const success$1 = "_success_1ryqy_79";
+const warning$3 = "_warning_1ryqy_83";
+const error$1 = "_error_1ryqy_75";
 const styles$5 = {
-  "f-function-block-alert": "_f-function-block-alert_1jotv_1",
-  "f-function-alert": "_f-function-alert_1jotv_16",
-  "f-function-alert-ico": "_f-function-alert-ico_1jotv_24",
-  "info-alert": "_info-alert_1jotv_31",
-  "error-alert": "_error-alert_1jotv_36",
-  "success-alert": "_success-alert_1jotv_41",
-  "warning-alert": "_warning-alert_1jotv_46",
-  "f-function-alert-inside": "_f-function-alert-inside_1jotv_51",
-  "f-function-alert-header": "_f-function-alert-header_1jotv_58",
-  "f-function-alert-body": "_f-function-alert-body_1jotv_68",
-  "f-function-alert-footer": "_f-function-alert-footer_1jotv_83"
+  "f-function-block-alert": "_f-function-block-alert_1ryqy_1",
+  visible: visible$2,
+  hidden: hidden$2,
+  "f-function-alert": "_f-function-alert_1ryqy_27",
+  "f-function-alert-top": "_f-function-alert-top_1ryqy_51",
+  "f-function-alert-ico": "_f-function-alert-ico_1ryqy_57",
+  "info-alert": "_info-alert_1ryqy_71",
+  "error-alert": "_error-alert_1ryqy_75",
+  "success-alert": "_success-alert_1ryqy_79",
+  "warning-alert": "_warning-alert_1ryqy_83",
+  "f-function-alert-inside": "_f-function-alert-inside_1ryqy_87",
+  "f-function-alert-header": "_f-function-alert-header_1ryqy_94",
+  "f-function-alert-body": "_f-function-alert-body_1ryqy_112",
+  "f-function-alert-footer": "_f-function-alert-footer_1ryqy_128",
+  "btn-action": "_btn-action_1ryqy_135",
+  info: info$1,
+  success: success$1,
+  warning: warning$3,
+  error: error$1,
+  "close-btn": "_close-btn_1ryqy_197"
 };
 const fAlert = ({ title: title2, body, variant = "info" }) => {
-  let ico = "";
-  switch (variant) {
-    case "info":
-      ico = '<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/><path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/>';
-      break;
-    case "success":
-      ico = '<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/><path d="M10.97 4.97a.75.75 0 0 1 1.071 1.05l-3.992 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425a.235.235 0 0 1 .02-.022z"/>';
-      break;
-    case "error":
-      ico = '<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/><path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"/>';
-      break;
-    case "warning":
-      ico = '<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/><path d="M5.255 5.786a.237.237 0 0 0 .241.247h.825c.138 0 .248-.113.266-.25.09-.656.54-1.134 1.342-1.134.686 0 1.314.343 1.314 1.168 0 .635-.374.927-.965 1.371-.673.489-1.206 1.06-1.168 1.987l.003.217a.25.25 0 0 0 .25.246h.811a.25.25 0 0 0 .25-.25v-.105c0-.718.273-.927 1.01-1.486.609-.463 1.244-.977 1.244-2.056 0-1.511-1.276-2.241-2.673-2.241-1.267 0-2.655.59-2.75 2.286zm1.557 5.763c0 .533.425.927 1.01.927.609 0 1.028-.394 1.028-.927 0-.552-.42-.94-1.029-.94-.584 0-1.009.388-1.009.94z"/>';
-      break;
-  }
-  const arrBody = [];
-  body.split("\n").forEach((opt) => {
-    arrBody.push(`<span>${opt}</span>`);
-  });
-  window.document.body.insertAdjacentHTML(
-    "afterbegin",
-    `
-            <div class='${styles$5["f-function-block-alert"]}' id='f-function-block-alert'>
+  return new Promise((resolve) => {
+    let ico = "";
+    switch (variant) {
+      case "info":
+        ico = `<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                    <circle cx="12" cy="12" r="10"/>
+                    <line x1="12" y1="16" x2="12" y2="12"/>
+                    <line x1="12" y1="8" x2="12.01" y2="8"/>
+                </svg>`;
+        break;
+      case "success":
+        ico = `<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                    <circle cx="12" cy="12" r="10"/>
+                    <path d="m9 12 2 2 4-4"/>
+                </svg>`;
+        break;
+      case "error":
+        ico = `<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                    <circle cx="12" cy="12" r="10"/>
+                    <line x1="15" y1="9" x2="9" y2="15"/>
+                    <line x1="9" y1="9" x2="15" y2="15"/>
+                </svg>`;
+        break;
+      case "warning":
+        ico = `<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                    <path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"/>
+                    <line x1="12" y1="9" x2="12" y2="13"/>
+                    <line x1="12" y1="17" x2="12.01" y2="17"/>
+                </svg>`;
+        break;
+    }
+    const arrBody = body.split("\n").map((opt) => `<span>${opt}</span>`);
+    const blockId = "f-function-block-alert-" + fGenerateUniqueId();
+    const alertHtml = `
+            <div class='${styles$5["f-function-block-alert"]}' id='${blockId}'>
                 <div class='${styles$5["f-function-alert"]}'>
-                    <div class='${styles$5["f-function-alert-ico"]} ${styles$5[`${variant}-alert`]}' style='color: inherit; fill: inherit'>
-                        <svg width="28" height="28" viewBox="0 0 16 16">
+                    <div class='${styles$5["f-function-alert-top"]}'>
+                        <div class='${styles$5["f-function-alert-ico"]} ${styles$5[`${variant}-alert`]}'>
                             ${ico}
-                        </svg>
-                    </div>
-                    <div class='${styles$5["f-function-alert-inside"]}'>
+                        </div>
                         <div class='${styles$5["f-function-alert-header"]}'>
                             <h4>${title2 || ""}</h4>
                         </div>
-                        <div class='${styles$5["f-function-alert-body"]}'>
-                            ${arrBody.join("")}
-                        </div>
-                        <div class='${styles$5["f-function-alert-footer"]}'>
-                            <FButton
-                                class='${stylesBtn["btn"]} ${stylesBtn["btn-sm"]} ${stylesBtn["btn-primary"]}'
-                                onclick='document.querySelector("#f-function-block-alert").remove()'
-                            >
-                                Закрыть
-                            </FButton>
-                        </div>
+                        <button type="button" aria-label="Закрыть" class="${styles$5["close-btn"]}" id="${blockId}-close-x">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round">
+                                <line x1="18" y1="6" x2="6" y2="18"/>
+                                <line x1="6" y1="6" x2="18" y2="18"/>
+                            </svg>
+                        </button>
+                    </div>
+                    <div class='${styles$5["f-function-alert-body"]}'>
+                        ${arrBody.join("")}
+                    </div>
+                    <div class='${styles$5["f-function-alert-footer"]}'>
+                        <button
+                            type="button"
+                            class='${styles$5["btn-action"]} ${styles$5[variant]}'
+                            id='${blockId}-ok'
+                        >
+                            Закрыть
+                        </button>
                     </div>
                 </div>
             </div>
-        `
-  );
+        `;
+    window.document.body.insertAdjacentHTML("afterbegin", alertHtml);
+    const block = document.getElementById(blockId);
+    const okBtn = document.getElementById(`${blockId}-ok`);
+    const closeXBtn = document.getElementById(`${blockId}-close-x`);
+    if (!block) {
+      resolve();
+      return;
+    }
+    if (typeof requestAnimationFrame === "function") {
+      requestAnimationFrame(() => {
+        requestAnimationFrame(() => {
+          block.classList.add(styles$5["visible"]);
+        });
+      });
+    } else {
+      setTimeout(() => {
+        block.classList.add(styles$5["visible"]);
+      }, 20);
+    }
+    let isClosing = false;
+    const closeModal = () => {
+      if (isClosing) return;
+      isClosing = true;
+      window.removeEventListener("keydown", handleKeyDown);
+      block.classList.remove(styles$5["visible"]);
+      block.classList.add(styles$5["hidden"]);
+      let isCleanedUp = false;
+      const cleanup = () => {
+        if (isCleanedUp) return;
+        isCleanedUp = true;
+        block.remove();
+        resolve();
+      };
+      block.addEventListener("transitionend", (e) => {
+        if (e.target === block) {
+          cleanup();
+        }
+      });
+      setTimeout(cleanup, 280);
+    };
+    const handleKeyDown = (e) => {
+      if (e.key === "Escape" || e.key === "Enter") {
+        e.preventDefault();
+        closeModal();
+      }
+    };
+    block.addEventListener("click", (e) => {
+      if (e.target === block) {
+        closeModal();
+      }
+    });
+    okBtn == null ? void 0 : okBtn.addEventListener("click", closeModal);
+    closeXBtn == null ? void 0 : closeXBtn.addEventListener("click", closeModal);
+    window.addEventListener("keydown", handleKeyDown);
+  });
 };
-const warning$2 = "_warning_de5a5_31";
+const visible$1 = "_visible_1jeyg_19";
+const hidden$1 = "_hidden_1jeyg_22";
+const warning$2 = "_warning_1jeyg_73";
 const styles$4 = {
-  "f-function-block-confirm": "_f-function-block-confirm_de5a5_1",
-  "f-function-confirm": "_f-function-confirm_de5a5_16",
-  "f-function-confirm-ico": "_f-function-confirm-ico_de5a5_24",
+  "f-function-block-confirm": "_f-function-block-confirm_1jeyg_1",
+  visible: visible$1,
+  hidden: hidden$1,
+  "f-function-confirm": "_f-function-confirm_1jeyg_27",
+  "f-function-confirm-top": "_f-function-confirm-top_1jeyg_51",
+  "f-function-confirm-ico": "_f-function-confirm-ico_1jeyg_57",
   warning: warning$2,
-  "f-function-confirm-inside": "_f-function-confirm-inside_de5a5_36",
-  "f-function-confirm-header": "_f-function-confirm-header_de5a5_43",
-  "f-function-confirm-body": "_f-function-confirm-body_de5a5_51",
-  "f-function-confirm-footer": "_f-function-confirm-footer_de5a5_65"
+  "f-function-confirm-header": "_f-function-confirm-header_1jeyg_84",
+  "f-function-confirm-body": "_f-function-confirm-body_1jeyg_102",
+  "f-function-confirm-footer": "_f-function-confirm-footer_1jeyg_118",
+  "btn-cancel": "_btn-cancel_1jeyg_125",
+  "btn-ok": "_btn-ok_1jeyg_147",
+  "close-btn": "_close-btn_1jeyg_171"
 };
 const fConfirm = ({ title: title2, body }) => {
   return new Promise((resolve) => {
+    const blockId = "f-function-block-confirm-" + fGenerateUniqueId();
     window.document.body.insertAdjacentHTML(
       "afterbegin",
       `
-                <div class='${styles$4["f-function-block-confirm"]}' id='f-function-block-confirm'>
+                <div class='${styles$4["f-function-block-confirm"]}' id='${blockId}'>
                     <div class='${styles$4["f-function-confirm"]}'>
-                        <div class='${styles$4["f-function-confirm-ico"]} ${styles$4.warning}'>
-                            <svg width="28" height="28" viewBox="0 0 16 16">
-                                <path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/>
-                                <path d="M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 4.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 4.995z"/>
-                            </svg>
-                        </div>
-                        <div class='${styles$4["f-function-confirm-inside"]}'>
+                        <div class='${styles$4["f-function-confirm-top"]}'>
+                            <div class='${styles$4["f-function-confirm-ico"]} ${styles$4.warning}'>
+                                <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                    <path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"/>
+                                    <line x1="12" y1="9" x2="12" y2="13"/>
+                                    <line x1="12" y1="17" x2="12.01" y2="17"/>
+                                </svg>
+                            </div>
                             <div class='${styles$4["f-function-confirm-header"]}'>
                                 <h4>${title2 || ""}</h4>
                             </div>
-                            <div class='${styles$4["f-function-confirm-body"]}'>
-                                <span>${body}</span>
-                            </div>
-                            <div class='${styles$4["f-function-confirm-footer"]}'>
-                                <button
-                                    id="f-function-confirm-ok"
-                                    class='${stylesBtn["btn"]} ${stylesBtn["btn-sm"]} ${stylesBtn["btn-success"]}'
-                                >
-                                    Ок
-                                </button>
-                                <button
-                                    id="f-function-confirm-cancellation"
-                                    class='${stylesBtn["btn"]} ${stylesBtn["btn-sm"]} ${stylesBtn["btn-danger"]}'
-                                >
-                                    Отменить
-                                </button>
-                            </div>
+                            <button type="button" aria-label="Закрыть" class="${styles$4["close-btn"]}" id="${blockId}-close-x">
+                                <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round">
+                                    <line x1="18" y1="6" x2="6" y2="18"/>
+                                    <line x1="6" y1="6" x2="18" y2="18"/>
+                                </svg>
+                            </button>
+                        </div>
+                        <div class='${styles$4["f-function-confirm-body"]}'>
+                            <span>${body}</span>
+                        </div>
+                        <div class='${styles$4["f-function-confirm-footer"]}'>
+                            <button
+                                type="button"
+                                id="${blockId}-cancel"
+                                class='${styles$4["btn-cancel"]}'
+                            >
+                                Отменить
+                            </button>
+                            <button
+                                type="button"
+                                id="${blockId}-ok"
+                                class='${styles$4["btn-ok"]}'
+                            >
+                                Ок
+                            </button>
                         </div>
                     </div>
                 </div>
             `
     );
-    const modalBlock = document.getElementById("f-function-block-confirm");
-    const okBtn = document.getElementById("f-function-confirm-ok");
-    const cancelBtn = document.getElementById("f-function-confirm-cancellation");
-    const closeModal = () => {
-      window.removeEventListener("keydown", handleKeyDown);
-      okBtn == null ? void 0 : okBtn.removeEventListener("click", handleOk);
-      cancelBtn == null ? void 0 : cancelBtn.removeEventListener("click", handleCancel);
-      modalBlock == null ? void 0 : modalBlock.remove();
-    };
-    const handleOk = () => {
-      closeModal();
-      resolve(true);
-    };
-    const handleCancel = () => {
-      closeModal();
+    const block = document.getElementById(blockId);
+    const okBtn = document.getElementById(`${blockId}-ok`);
+    const cancelBtn = document.getElementById(`${blockId}-cancel`);
+    const closeXBtn = document.getElementById(`${blockId}-close-x`);
+    if (!block) {
       resolve(false);
+      return;
+    }
+    if (typeof requestAnimationFrame === "function") {
+      requestAnimationFrame(() => {
+        requestAnimationFrame(() => {
+          block.classList.add(styles$4["visible"]);
+        });
+      });
+    } else {
+      setTimeout(() => {
+        block.classList.add(styles$4["visible"]);
+      }, 20);
+    }
+    let isClosing = false;
+    const closeModal = (result) => {
+      if (isClosing) return;
+      isClosing = true;
+      window.removeEventListener("keydown", handleKeyDown);
+      block.classList.remove(styles$4["visible"]);
+      block.classList.add(styles$4["hidden"]);
+      let isCleanedUp = false;
+      const cleanup = () => {
+        if (isCleanedUp) return;
+        isCleanedUp = true;
+        block.remove();
+        resolve(result);
+      };
+      block.addEventListener("transitionend", (e) => {
+        if (e.target === block) {
+          cleanup();
+        }
+      });
+      setTimeout(cleanup, 280);
     };
     const handleKeyDown = (e) => {
       if (e.key === "Enter") {
         e.preventDefault();
-        handleOk();
-      }
-      if (e.key === "Escape") {
-        handleCancel();
+        closeModal(true);
+      } else if (e.key === "Escape") {
+        e.preventDefault();
+        closeModal(false);
       }
     };
-    okBtn == null ? void 0 : okBtn.addEventListener("click", handleOk);
-    cancelBtn == null ? void 0 : cancelBtn.addEventListener("click", handleCancel);
+    block.addEventListener("click", (e) => {
+      if (e.target === block) {
+        closeModal(false);
+      }
+    });
+    okBtn == null ? void 0 : okBtn.addEventListener("click", () => closeModal(true));
+    cancelBtn == null ? void 0 : cancelBtn.addEventListener("click", () => closeModal(false));
+    closeXBtn == null ? void 0 : closeXBtn.addEventListener("click", () => closeModal(false));
     window.addEventListener("keydown", handleKeyDown);
   });
 };
-const warning$1 = "_warning_1o5ku_31";
+const visible = "_visible_1nxa7_19";
+const hidden = "_hidden_1nxa7_22";
+const warning$1 = "_warning_1nxa7_73";
 const styles$3 = {
-  "f-function-block-prompt": "_f-function-block-prompt_1o5ku_1",
-  "f-function-prompt": "_f-function-prompt_1o5ku_16",
-  "f-function-prompt-ico": "_f-function-prompt-ico_1o5ku_24",
+  "f-function-block-prompt": "_f-function-block-prompt_1nxa7_1",
+  visible,
+  hidden,
+  "f-function-prompt": "_f-function-prompt_1nxa7_27",
+  "f-function-prompt-top": "_f-function-prompt-top_1nxa7_51",
+  "f-function-prompt-ico": "_f-function-prompt-ico_1nxa7_57",
   warning: warning$1,
-  "f-function-prompt-inside": "_f-function-prompt-inside_1o5ku_36",
-  "f-function-prompt-header": "_f-function-prompt-header_1o5ku_43",
-  "f-function-prompt-body": "_f-function-prompt-body_1o5ku_51",
-  "f-function-prompt-footer": "_f-function-prompt-footer_1o5ku_66"
+  "f-function-prompt-header": "_f-function-prompt-header_1nxa7_84",
+  "f-function-prompt-body": "_f-function-prompt-body_1nxa7_102",
+  "f-function-prompt-input": "_f-function-prompt-input_1nxa7_121",
+  "f-function-prompt-footer": "_f-function-prompt-footer_1nxa7_142",
+  "btn-cancel": "_btn-cancel_1nxa7_149",
+  "btn-ok": "_btn-ok_1nxa7_171",
+  "close-btn": "_close-btn_1nxa7_195"
 };
 function getValue(element) {
   if (element) {
@@ -4736,59 +4884,119 @@ function getValue(element) {
 }
 const fPrompt = ({ title: title2, body }) => {
   return new Promise((resolve) => {
+    const blockId = "f-function-block-prompt-" + fGenerateUniqueId();
     window.document.body.insertAdjacentHTML(
       "afterbegin",
       `
-            <div class='${styles$3["f-function-block-prompt"]}' id='f-function-block-prompt'>
+            <div class='${styles$3["f-function-block-prompt"]}' id='${blockId}'>
                 <div class='${styles$3["f-function-prompt"]}'>
-                   <div class='${styles$3["f-function-prompt-ico"]} ${styles$3.warning}'>
-                        <svg width="28" height="28" viewBox="0 0 16 16">
-                            <path d="M14 1a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1h-2.5a2 2 0 0 0-1.6.8L8 14.333 6.1 11.8a2 2 0 0 0-1.6-.8H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h2.5a1 1 0 0 1 .8.4l1.9 2.533a1 1 0 0 0 1.6 0l1.9-2.533a1 1 0 0 1 .8-.4H14a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/>
-                            <path d="M5 6a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm4 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm4 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/>
-                        </svg>
-                    </div>
-                   <div class='${styles$3["f-function-prompt-inside"]}'>
+                    <div class='${styles$3["f-function-prompt-top"]}'>
+                        <div class='${styles$3["f-function-prompt-ico"]} ${styles$3.warning}'>
+                            <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>
+                            </svg>
+                        </div>
                         <div class='${styles$3["f-function-prompt-header"]}'>
                             <h4>${title2 || ""}</h4>
                         </div>
-                        <div class='${styles$3["f-function-prompt-body"]}'>
-                            <span>${body || ""}</span>
-                            <input 
-                                type="text" 
-                                id="f-function-prompt-input"
-                                class="form-control ${styles$3["f-function-prompt-input"]}"
-                            />
-                        </div>
-                        <div class='${styles$3["f-function-prompt-footer"]}'>
-                            <button
-                                id="f-function-prompt-ok"
-                                class='${stylesBtn["btn"]} ${stylesBtn["btn-sm"]} ${stylesBtn["btn-success"]}'
-                                onclick='document.querySelector("#f-function-block-prompt").remove()'
-                            >
-                                Ок
-                            </button>
-                            <button
-                                id="f-function-prompt-cancellation"
-                                class='${stylesBtn["btn"]} ${stylesBtn["btn-sm"]} ${stylesBtn["btn-danger"]}'
-                                onclick='document.querySelector("#f-function-block-prompt").remove()'
-                            >
-                                Отменить
-                            </button>
-                        </div>
+                        <button type="button" aria-label="Закрыть" class="${styles$3["close-btn"]}" id="${blockId}-close-x">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round">
+                                <line x1="18" y1="6" x2="6" y2="18"/>
+                                <line x1="6" y1="6" x2="18" y2="18"/>
+                            </svg>
+                        </button>
+                    </div>
+                    <div class='${styles$3["f-function-prompt-body"]}'>
+                        ${body ? `<span>${body}</span>` : ""}
+                        <input 
+                            type="text" 
+                            id="${blockId}-input"
+                            class="${styles$3["f-function-prompt-input"]}"
+                            placeholder="Введите значение..."
+                            autocomplete="off"
+                        />
+                    </div>
+                    <div class='${styles$3["f-function-prompt-footer"]}'>
+                        <button
+                            type="button"
+                            id="${blockId}-cancel"
+                            class='${styles$3["btn-cancel"]}'
+                        >
+                            Отменить
+                        </button>
+                        <button
+                            type="button"
+                            id="${blockId}-ok"
+                            class='${styles$3["btn-ok"]}'
+                        >
+                            Ок
+                        </button>
                     </div>
                 </div>
             </div>
         `
     );
-    const ok = document.querySelector("#f-function-prompt-ok");
-    const cancellation = document.querySelector("#f-function-prompt-cancellation");
-    const submit = document.querySelector("#f-function-prompt-input");
-    ok.addEventListener("click", function() {
-      resolve(getValue(submit));
-    });
-    cancellation.addEventListener("click", function() {
+    const block = document.getElementById(blockId);
+    const okBtn = document.getElementById(`${blockId}-ok`);
+    const cancelBtn = document.getElementById(`${blockId}-cancel`);
+    const closeXBtn = document.getElementById(`${blockId}-close-x`);
+    const input = document.getElementById(`${blockId}-input`);
+    if (!block) {
       resolve(null);
+      return;
+    }
+    if (typeof requestAnimationFrame === "function") {
+      requestAnimationFrame(() => {
+        requestAnimationFrame(() => {
+          block.classList.add(styles$3["visible"]);
+          input == null ? void 0 : input.focus();
+        });
+      });
+    } else {
+      setTimeout(() => {
+        block.classList.add(styles$3["visible"]);
+        input == null ? void 0 : input.focus();
+      }, 20);
+    }
+    let isClosing = false;
+    const closeModal = (result) => {
+      if (isClosing) return;
+      isClosing = true;
+      window.removeEventListener("keydown", handleKeyDown);
+      block.classList.remove(styles$3["visible"]);
+      block.classList.add(styles$3["hidden"]);
+      let isCleanedUp = false;
+      const cleanup = () => {
+        if (isCleanedUp) return;
+        isCleanedUp = true;
+        block.remove();
+        resolve(result);
+      };
+      block.addEventListener("transitionend", (e) => {
+        if (e.target === block) {
+          cleanup();
+        }
+      });
+      setTimeout(cleanup, 280);
+    };
+    const handleKeyDown = (e) => {
+      if (e.key === "Enter") {
+        e.preventDefault();
+        closeModal(getValue(input));
+      } else if (e.key === "Escape") {
+        e.preventDefault();
+        closeModal(null);
+      }
+    };
+    block.addEventListener("click", (e) => {
+      if (e.target === block) {
+        closeModal(null);
+      }
     });
+    okBtn == null ? void 0 : okBtn.addEventListener("click", () => closeModal(getValue(input)));
+    cancelBtn == null ? void 0 : cancelBtn.addEventListener("click", () => closeModal(null));
+    closeXBtn == null ? void 0 : closeXBtn.addEventListener("click", () => closeModal(null));
+    window.addEventListener("keydown", handleKeyDown);
   });
 };
 class TSZip {
@@ -7786,34 +7994,61 @@ const fExportingHtmlToXlsx = async (data) => {
   }
 };
 const fInstallFormatCodeXlsx = (data) => installFormatCode(data);
-const info = "_info_1da8u_75";
-const error = "_error_1da8u_80";
-const success = "_success_1da8u_85";
-const warning = "_warning_1da8u_90";
+const info = "_info_1s6rj_93";
+const error = "_error_1s6rj_97";
+const success = "_success_1s6rj_101";
+const warning = "_warning_1s6rj_105";
 const styles$1 = {
-  "f-function-block-notification": "_f-function-block-notification_1da8u_51",
-  "f-function-notification": "_f-function-notification_1da8u_55",
-  "f-function-notification-ico": "_f-function-notification-ico_1da8u_67",
-  "info-notification": "_info-notification_1da8u_75",
-  "error-notification": "_error-notification_1da8u_80",
-  "success-notification": "_success-notification_1da8u_85",
-  "warning-notification": "_warning-notification_1da8u_90",
-  "f-function-notification-inside": "_f-function-notification-inside_1da8u_95",
-  "f-function-notification-header": "_f-function-notification-header_1da8u_101",
-  "f-function-notification-body": "_f-function-notification-body_1da8u_113",
-  "f-function-notification-visible": "_f-function-notification-visible_1da8u_127",
-  "notification-fade-in": "_notification-fade-in_1da8u_1",
-  "f-function-notification-hidden": "_f-function-notification-hidden_1da8u_133",
-  "notification-fade-out": "_notification-fade-out_1da8u_1",
-  "f-notification-progress": "_f-notification-progress_1da8u_169",
-  "f-notification-progress-bar": "_f-notification-progress-bar_1da8u_176",
-  "f-notification-progress-value": "_f-notification-progress-value_1da8u_183",
+  "f-function-block-notification": "_f-function-block-notification_1s6rj_35",
+  "f-function-notification-visible": "_f-function-notification-visible_1s6rj_45",
+  "f-function-notification-hidden": "_f-function-notification-hidden_1s6rj_50",
+  "f-function-notification": "_f-function-notification_1s6rj_45",
+  "f-function-notification-ico": "_f-function-notification-ico_1s6rj_79",
+  "info-notification": "_info-notification_1s6rj_93",
+  "error-notification": "_error-notification_1s6rj_97",
+  "success-notification": "_success-notification_1s6rj_101",
+  "warning-notification": "_warning-notification_1s6rj_105",
+  "f-function-notification-inside": "_f-function-notification-inside_1s6rj_109",
+  "f-function-notification-header": "_f-function-notification-header_1s6rj_117",
+  "f-function-notification-body": "_f-function-notification-body_1s6rj_136",
+  "close-not": "_close-not_1s6rj_153",
+  "f-notification-progress": "_f-notification-progress_1s6rj_179",
+  "f-notification-progress-bar": "_f-notification-progress-bar_1s6rj_188",
+  "f-notification-progress-value": "_f-notification-progress-value_1s6rj_193",
+  "notification-progress-shrink": "_notification-progress-shrink_1s6rj_1",
   info,
   error,
   success,
-  warning,
-  "close-not": "_close-not_1da8u_205",
-  "notification-progress-animated": "_notification-progress-animated_1da8u_1"
+  warning
+};
+const dismissNotificationElement = (el) => {
+  if (!el || el.dataset.closing === "true") return;
+  el.dataset.closing = "true";
+  const cancelTimer = el._cancelTimer;
+  if (typeof cancelTimer === "function") {
+    cancelTimer();
+  }
+  el.classList.remove(styles$1["f-function-notification-visible"]);
+  el.classList.add(styles$1["f-function-notification-hidden"]);
+  let isCleanedUp = false;
+  const cleanup = () => {
+    var _a;
+    if (isCleanedUp) return;
+    isCleanedUp = true;
+    if (el.parentNode) {
+      el.parentNode.removeChild(el);
+    }
+    const blockNotification = document.querySelector("#block-notification");
+    if (blockNotification && blockNotification.children.length === 0) {
+      (_a = blockNotification.parentNode) == null ? void 0 : _a.removeChild(blockNotification);
+    }
+  };
+  el.addEventListener("transitionend", (e) => {
+    if (e.target === el) {
+      cleanup();
+    }
+  });
+  setTimeout(cleanup, 360);
 };
 const fNotification = ({
   title: title2,
@@ -7827,54 +8062,61 @@ const fNotification = ({
     let ico = "";
     switch (variant) {
       case "info":
-        ico = '<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/><path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/>';
+        ico = `<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                    <circle cx="12" cy="12" r="10"/>
+                    <line x1="12" y1="16" x2="12" y2="12"/>
+                    <line x1="12" y1="8" x2="12.01" y2="8"/>
+                </svg>`;
         break;
       case "success":
-        ico = '<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/><path d="M10.97 4.97a.75.75 0 0 1 1.071 1.05l-3.992 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425a.235.235 0 0 1 .02-.022z"/>';
+        ico = `<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                    <circle cx="12" cy="12" r="10"/>
+                    <path d="m9 12 2 2 4-4"/>
+                </svg>`;
         break;
       case "error":
-        ico = '<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/><path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"/>';
+        ico = `<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                    <circle cx="12" cy="12" r="10"/>
+                    <line x1="15" y1="9" x2="9" y2="15"/>
+                    <line x1="9" y1="9" x2="15" y2="15"/>
+                </svg>`;
         break;
       case "warning":
-        ico = '<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/><path d="M5.255 5.786a.237.237 0 0 0 .241.247h.825c.138 0 .248-.113.266-.25.09-.656.54-1.134 1.342-1.134.686 0 1.314.343 1.314 1.168 0 .635-.374.927-.965 1.371-.673.489-1.206 1.06-1.168 1.987l.003.217a.25.25 0 0 0 .25.246h.811a.25.25 0 0 0 .25-.25v-.105c0-.718.273-.927 1.01-1.486.609-.463 1.244-.977 1.244-2.056 0-1.511-1.276-2.241-2.673-2.241-1.267 0-2.655.59-2.75 2.286zm1.557 5.763c0 .533.425.927 1.01.927.609 0 1.028-.394 1.028-.927 0-.552-.42-.94-1.029-.94-.584 0-1.009.388-1.009.94z"/>';
+        ico = `<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                    <path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"/>
+                    <line x1="12" y1="9" x2="12" y2="13"/>
+                    <line x1="12" y1="17" x2="12.01" y2="17"/>
+                </svg>`;
         break;
     }
-    const arrBody = [];
-    body.split("\n").map((opt) => {
-      arrBody.push(
-        `<span>${opt}</span>`
-      );
-    });
+    const arrBody = body.split("\n").map((opt) => `<span>${opt}</span>`);
     const randId = fGenerateUniqueId();
-    const idFuncBlockNot = "f-function-block-notification-" + randId;
+    const elementId = id !== void 0 ? id : "f-function-block-notification-" + randId;
     const not = `
-            <div class='${styles$1["f-function-block-notification"]}' id="${id === void 0 ? idFuncBlockNot : id}">
+            <div class='${styles$1["f-function-block-notification"]}' id="${elementId}">
                 <div class='${styles$1["f-function-notification"]}'>
                     <div class='${styles$1["f-function-notification-ico"]} ${styles$1[variant + "-notification"]}'>
-                        <svg width="28" height="28" viewBox="0 0 16 16">
-                            ${ico}
-                        </svg>
+                        ${ico}
                     </div>
                     <div class='${styles$1["f-function-notification-inside"]}'>
                         <div class='${styles$1["f-function-notification-header"]}'>
                             <h4>${title2 !== void 0 ? title2 : ""}</h4>
-                            ${buttonClose ? `<svg
-                                                    width="25"
-                                                    class="bi bi-x-lg primary ${styles$1["close-not"]}"
-                                                    viewBox="0 0 16 16"
-                                                >
-                                                    <path d="M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z"/>
-                                                </svg>` : ""}
+                            ${buttonClose ? `<button type="button" aria-label="Закрыть" class="${styles$1["close-not"]}">
+                                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round">
+                                    <line x1="18" y1="6" x2="6" y2="18"/>
+                                    <line x1="6" y1="6" x2="18" y2="18"/>
+                                </svg>
+                            </button>` : ""}
                         </div>
                         <div class='${styles$1["f-function-notification-body"]}'>
                              ${arrBody.join("")}
                         </div>
                     </div>
-                   ${timeSecClose ? `<div class="${styles$1["f-notification-progress"]}">
-                       <div class="${styles$1["f-notification-progress-bar"]}">
-                            <div class="${styles$1["f-notification-progress-value"]} ${styles$1[variant]}" id="f-notification-progress-value-${randId}" style="animation: notification-progress-animated ${timeSecClose}s linear;"/>
-                       </div>
-                   </div>` : ""}
+                    ${timeSecClose ? `<div class="${styles$1["f-notification-progress"]}">
+                        <div class="${styles$1["f-notification-progress-bar"]}">
+                            <div class="${styles$1["f-notification-progress-value"]} ${styles$1[variant]}" style="animation-duration: ${timeSecClose}s;"></div>
+                        </div>
+                    </div>` : ""}
                 </div>
             </div>
         `;
@@ -7887,70 +8129,82 @@ const fNotification = ({
       }
       return blockNotification2;
     };
-    const removeEmptyNotificationBlock = () => {
-      var _a;
-      const blockNotification2 = document.querySelector("#block-notification");
-      if (blockNotification2 && blockNotification2.children.length === 0) {
-        (_a = blockNotification2.parentNode) == null ? void 0 : _a.removeChild(blockNotification2);
-      }
-    };
     const blockNotification = getOrCreateNotificationBlock();
     blockNotification.insertAdjacentHTML("afterbegin", not);
     blockNotification.scrollTo({ top: 0, behavior: "smooth" });
-    if (buttonClose) {
-      const el = window.document.querySelector(`#${idFuncBlockNot}`);
-      if (el !== null) {
-        const svgElement = el.querySelector(`.${styles$1["close-not"]}`);
-        if (svgElement !== null) {
-          svgElement.addEventListener("click", () => {
-            el.classList.remove(styles$1["f-function-notification-visible"]);
-            el.classList.add(styles$1["f-function-notification-hidden"]);
-            setTimeout(() => {
-              if (el.parentNode) {
-                el.parentNode.removeChild(el);
-              }
-              removeEmptyNotificationBlock();
-            }, 1e3);
+    const el = window.document.querySelector(`#${elementId}`);
+    if (el !== null) {
+      el._dismiss = () => dismissNotificationElement(el);
+      if (typeof requestAnimationFrame === "function") {
+        requestAnimationFrame(() => {
+          requestAnimationFrame(() => {
+            el.classList.add(styles$1["f-function-notification-visible"]);
           });
-        }
+        });
+      } else {
+        setTimeout(() => {
+          el.classList.add(styles$1["f-function-notification-visible"]);
+        }, 20);
       }
-    }
-    setTimeout(() => {
-      const el = window.document.querySelector(`#${idFuncBlockNot}`);
-      if (el !== null && el !== void 0) {
-        el.className += " " + styles$1["f-function-notification-visible"];
+      if (buttonClose) {
+        const closeBtn = el.querySelector(`.${styles$1["close-not"]}`);
+        if (closeBtn !== null) {
+          closeBtn.addEventListener("click", (e) => {
+            e.stopPropagation();
+            dismissNotificationElement(el);
+          });
+        }
       }
-    });
-    if (timeSecClose !== void 0) {
-      const el = window.document.querySelector(`#${idFuncBlockNot}`);
-      if (el !== null) {
-        setTimeout(() => {
-          el.className = styles$1["f-function-notification-hidden"];
-        }, (timeSecClose - 1) * 1e3);
-        setTimeout(() => {
-          if (el.parentNode) {
-            el.parentNode.removeChild(el);
+      if (timeSecClose !== void 0 && timeSecClose > 0) {
+        let timer = null;
+        let startTime = Date.now();
+        let remaining = timeSecClose * 1e3;
+        const startTimer = () => {
+          startTime = Date.now();
+          timer = setTimeout(() => {
+            dismissNotificationElement(el);
+          }, remaining);
+        };
+        const pauseTimer = () => {
+          if (timer) {
+            clearTimeout(timer);
+            timer = null;
+            remaining -= Date.now() - startTime;
+          }
+        };
+        const resumeTimer = () => {
+          if (remaining > 0 && el.dataset.closing !== "true") {
+            startTimer();
+          }
+        };
+        el._cancelTimer = () => {
+          if (timer) {
+            clearTimeout(timer);
+            timer = null;
           }
-          removeEmptyNotificationBlock();
-        }, timeSecClose * 1e3);
+          el.removeEventListener("mouseenter", pauseTimer);
+          el.removeEventListener("mouseleave", resumeTimer);
+        };
+        el.addEventListener("mouseenter", pauseTimer);
+        el.addEventListener("mouseleave", resumeTimer);
+        startTimer();
       }
     }
-    resolve(`#${idFuncBlockNot}`);
+    resolve(`#${elementId}`);
   });
 };
 const fNotificationDelete = (id) => {
-  const el = window.document.querySelector(id);
+  if (!id) return;
+  const selector = id.startsWith("#") ? id : `#${id}`;
+  let el = window.document.querySelector(selector);
+  if (!el) {
+    try {
+      el = window.document.querySelector(id);
+    } catch {
+    }
+  }
   if (!el) return;
-  const container2 = document.getElementById("block-notification");
-  if (!container2) return;
-  el.className = styles$1["f-function-notification-hidden"];
-  setTimeout(() => {
-    el.classList.remove(styles$1["f-function-notification-visible"]);
-  }, 1e3);
-  setTimeout(() => {
-    if (el.parentNode) el.parentNode.removeChild(el);
-    if (container2.children.length === 0) container2.remove();
-  }, 2e3);
+  dismissNotificationElement(el);
 };
 const fConvertFileToBase64 = (file, deletePrefix = false) => {
   return new Promise((resolve, reject) => {