@hh.ru/magritte-ui-modal-deprecated 1.0.39 → 1.0.41

package/useModalOrder.js

@@ -2,90 +2,83 @@ import './index.css';
 import { useState, useLayoutEffect, useEffect } from 'react';
 import { useDomStoredUniqueId, getValueFromDom, storeValueInDom } from '@hh.ru/magritte-common-dom-storage';
 
-const STORAGE_NAME = '_MAGRITTE_MODAL_COUNTER_';
+const STORAGE_NAME = "_MAGRITTE_MODAL_COUNTER_";
 const getState = () => {
-    const state = getValueFromDom(STORAGE_NAME);
-    if (state === undefined) {
-        return {
-            prevVisiblility: {},
-            positions: {},
-            subscribers: {},
-            count: 0,
-        };
-    }
-    return state;
+  const state = getValueFromDom(STORAGE_NAME);
+  if (state === void 0) {
+    return {
+      prevVisiblility: {},
+      positions: {},
+      subscribers: {},
+      count: 0
+    };
+  }
+  return state;
 };
 const storeState = (state) => {
-    storeValueInDom(STORAGE_NAME, state);
+  storeValueInDom(STORAGE_NAME, state);
 };
 const counterFactory = () => {
-    return {
-        updateVisiblility: (id, visible) => {
-            // eslint-disable-next-line prefer-const
-            const state = getState();
-            const prevVisible = !!state.prevVisiblility[id];
-            if (visible === prevVisible) {
-                return;
-            }
-            state.prevVisiblility[id] = visible;
-            if (visible) {
-                state.count += 1;
-                state.positions[id] = state.count;
-            }
-            else {
-                state.count -= 1;
-                const currentPosition = state.positions[id];
-                state.positions[id] = 0;
-                Object.entries(state.positions).forEach(([key, value]) => {
-                    state.positions[key] = value > currentPosition ? value - 1 : value;
-                });
-            }
-            storeState(state);
-        },
-        subscribe: (id, callback) => {
-            const state = getState();
-            state.subscribers[id] = callback;
-            storeState(state);
-        },
-        unsubscribe: (id) => {
-            const state = getState();
-            delete state.subscribers[id];
-            storeState(state);
-        },
-        notifyAll: () => {
-            const { subscribers, count, positions } = getState();
-            Object.entries(subscribers).forEach(([id, callback]) => callback({ position: positions[id], count }));
-        },
-    };
+  return {
+    updateVisiblility: (id, visible) => {
+      const state = getState();
+      const prevVisible = !!state.prevVisiblility[id];
+      if (visible === prevVisible) {
+        return;
+      }
+      state.prevVisiblility[id] = visible;
+      if (visible) {
+        state.count += 1;
+        state.positions[id] = state.count;
+      } else {
+        state.count -= 1;
+        const currentPosition = state.positions[id];
+        state.positions[id] = 0;
+        Object.entries(state.positions).forEach(([key, value]) => {
+          state.positions[key] = value > currentPosition ? value - 1 : value;
+        });
+      }
+      storeState(state);
+    },
+    subscribe: (id, callback) => {
+      const state = getState();
+      state.subscribers[id] = callback;
+      storeState(state);
+    },
+    unsubscribe: (id) => {
+      const state = getState();
+      delete state.subscribers[id];
+      storeState(state);
+    },
+    notifyAll: () => {
+      const { subscribers, count, positions } = getState();
+      Object.entries(subscribers).forEach(([id, callback]) => callback({ position: positions[id], count }));
+    }
+  };
 };
 const counter = counterFactory();
 const useModalOrder = (visible, modalRef) => {
-    const [position, setPosition] = useState({ position: 0, count: 0 });
-    const id = useDomStoredUniqueId();
-    useLayoutEffect(() => {
-        counter.updateVisiblility(id, visible);
-        counter.notifyAll();
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [visible]);
-    useEffect(() => {
-        counter.subscribe(id, setPosition);
-        counter.updateVisiblility(id, visible);
-        return () => {
-            counter.unsubscribe(id);
-            counter.updateVisiblility(id, false);
-            counter.notifyAll();
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [id]);
-    useLayoutEffect(() => {
-        // Если это самый "верхний" модал передаем туда фокус
-        if (position.position === position.count &&
-            position.count > 0 &&
-            !modalRef.current?.contains(document.activeElement)) {
-            modalRef.current?.focus();
-        }
-    }, [position, modalRef]);
-    return [position.position, position.count];
+  const [position, setPosition] = useState({ position: 0, count: 0 });
+  const id = useDomStoredUniqueId();
+  useLayoutEffect(() => {
+    counter.updateVisiblility(id, visible);
+    counter.notifyAll();
+  }, [visible]);
+  useEffect(() => {
+    counter.subscribe(id, setPosition);
+    counter.updateVisiblility(id, visible);
+    return () => {
+      counter.unsubscribe(id);
+      counter.updateVisiblility(id, false);
+      counter.notifyAll();
+    };
+  }, [id]);
+  useLayoutEffect(() => {
+    if (position.position === position.count && position.count > 0 && !modalRef.current?.contains(document.activeElement)) {
+      modalRef.current?.focus();
+    }
+  }, [position, modalRef]);
+  return [position.position, position.count];
 };
 
 export { useModalOrder };

package/useModalOrder.js.map

@@ -1 +1 @@
-{"version":3,"file":"useModalOrder.js","sources":["src/useModalOrder.ts"],"sourcesContent":["import { RefObject, useEffect, useLayoutEffect, useState } from 'react';\n\nimport { storeValueInDom, getValueFromDom, useDomStoredUniqueId } from '@hh.ru/magritte-common-dom-storage';\n\ntype NotifyCallbackArg = { position: number; count: number };\n\ntype Subscribers = Record<string, (position: NotifyCallbackArg) => void>;\ntype VisibilityMap = Record<string, boolean>;\ntype PositionMap = Record<string, number>;\n\ntype ModalCounterState = {\n    prevVisiblility: VisibilityMap;\n    positions: PositionMap;\n    subscribers: Subscribers;\n    count: number;\n};\n\nconst STORAGE_NAME = '_MAGRITTE_MODAL_COUNTER_';\n\nconst getState = (): ModalCounterState => {\n    const state = getValueFromDom<ModalCounterState>(STORAGE_NAME);\n    if (state === undefined) {\n        return {\n            prevVisiblility: {},\n            positions: {},\n            subscribers: {},\n            count: 0,\n        };\n    }\n    return state;\n};\n\nconst storeState = (state: ModalCounterState): void => {\n    storeValueInDom(STORAGE_NAME, state);\n};\n\nconst counterFactory = () => {\n    return {\n        updateVisiblility: (id: string, visible: boolean) => {\n            // eslint-disable-next-line prefer-const\n            const state = getState();\n            const prevVisible = !!state.prevVisiblility[id];\n            if (visible === prevVisible) {\n                return;\n            }\n            state.prevVisiblility[id] = visible;\n            if (visible) {\n                state.count += 1;\n                state.positions[id] = state.count;\n            } else {\n                state.count -= 1;\n                const currentPosition = state.positions[id];\n                state.positions[id] = 0;\n                Object.entries(state.positions).forEach(([key, value]) => {\n                    state.positions[key] = value > currentPosition ? value - 1 : value;\n                });\n            }\n            storeState(state);\n        },\n        subscribe: (id: string, callback: (position: NotifyCallbackArg) => void) => {\n            const state = getState();\n            state.subscribers[id] = callback;\n            storeState(state);\n        },\n        unsubscribe: (id: string) => {\n            const state = getState();\n            delete state.subscribers[id];\n            storeState(state);\n        },\n        notifyAll: () => {\n            const { subscribers, count, positions } = getState();\n            Object.entries(subscribers).forEach(([id, callback]) => callback({ position: positions[id], count }));\n        },\n    };\n};\n\nconst counter = counterFactory();\n\nexport const useModalOrder = (visible: boolean, modalRef: RefObject<HTMLDivElement>): [number, number] => {\n    const [position, setPosition] = useState<{ position: number; count: number }>({ position: 0, count: 0 });\n    const id = useDomStoredUniqueId();\n\n    useLayoutEffect(() => {\n        counter.updateVisiblility(id, visible);\n        counter.notifyAll();\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [visible]);\n\n    useEffect(() => {\n        counter.subscribe(id, setPosition);\n        counter.updateVisiblility(id, visible);\n        return () => {\n            counter.unsubscribe(id);\n            counter.updateVisiblility(id, false);\n            counter.notifyAll();\n        };\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [id]);\n\n    useLayoutEffect(() => {\n        // Если это самый \"верхний\" модал передаем туда фокус\n        if (\n            position.position === position.count &&\n            position.count > 0 &&\n            !modalRef.current?.contains(document.activeElement)\n        ) {\n            modalRef.current?.focus();\n        }\n    }, [position, modalRef]);\n\n    return [position.position, position.count];\n};\n"],"names":[],"mappings":";;;AAiBA,MAAM,YAAY,GAAG,0BAA0B,CAAC;AAEhD,MAAM,QAAQ,GAAG,MAAwB;AACrC,IAAA,MAAM,KAAK,GAAG,eAAe,CAAoB,YAAY,CAAC,CAAC;AAC/D,IAAA,IAAI,KAAK,KAAK,SAAS,EAAE;QACrB,OAAO;AACH,YAAA,eAAe,EAAE,EAAE;AACnB,YAAA,SAAS,EAAE,EAAE;AACb,YAAA,WAAW,EAAE,EAAE;AACf,YAAA,KAAK,EAAE,CAAC;SACX,CAAC;KACL;AACD,IAAA,OAAO,KAAK,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,KAAwB,KAAU;AAClD,IAAA,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC;AACzC,CAAC,CAAC;AAEF,MAAM,cAAc,GAAG,MAAK;IACxB,OAAO;AACH,QAAA,iBAAiB,EAAE,CAAC,EAAU,EAAE,OAAgB,KAAI;;AAEhD,YAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;YACzB,MAAM,WAAW,GAAG,CAAC,CAAC,KAAK,CAAC,eAAe,CAAC,EAAE,CAAC,CAAC;AAChD,YAAA,IAAI,OAAO,KAAK,WAAW,EAAE;gBACzB,OAAO;aACV;AACD,YAAA,KAAK,CAAC,eAAe,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC;YACpC,IAAI,OAAO,EAAE;AACT,gBAAA,KAAK,CAAC,KAAK,IAAI,CAAC,CAAC;gBACjB,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC;aACrC;iBAAM;AACH,gBAAA,KAAK,CAAC,KAAK,IAAI,CAAC,CAAC;gBACjB,MAAM,eAAe,GAAG,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC;AAC5C,gBAAA,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;AACxB,gBAAA,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,KAAI;AACrD,oBAAA,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,KAAK,GAAG,eAAe,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,CAAC;AACvE,iBAAC,CAAC,CAAC;aACN;YACD,UAAU,CAAC,KAAK,CAAC,CAAC;SACrB;AACD,QAAA,SAAS,EAAE,CAAC,EAAU,EAAE,QAA+C,KAAI;AACvE,YAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;AACzB,YAAA,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC;YACjC,UAAU,CAAC,KAAK,CAAC,CAAC;SACrB;AACD,QAAA,WAAW,EAAE,CAAC,EAAU,KAAI;AACxB,YAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;AACzB,YAAA,OAAO,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;YAC7B,UAAU,CAAC,KAAK,CAAC,CAAC;SACrB;QACD,SAAS,EAAE,MAAK;YACZ,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,QAAQ,EAAE,CAAC;AACrD,YAAA,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,QAAQ,CAAC,KAAK,QAAQ,CAAC,EAAE,QAAQ,EAAE,SAAS,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;SACzG;KACJ,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,OAAO,GAAG,cAAc,EAAE,CAAC;MAEpB,aAAa,GAAG,CAAC,OAAgB,EAAE,QAAmC,KAAsB;AACrG,IAAA,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAsC,EAAE,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;AACzG,IAAA,MAAM,EAAE,GAAG,oBAAoB,EAAE,CAAC;IAElC,eAAe,CAAC,MAAK;AACjB,QAAA,OAAO,CAAC,iBAAiB,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC;QACvC,OAAO,CAAC,SAAS,EAAE,CAAC;;AAExB,KAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,SAAS,CAAC,MAAK;AACX,QAAA,OAAO,CAAC,SAAS,CAAC,EAAE,EAAE,WAAW,CAAC,CAAC;AACnC,QAAA,OAAO,CAAC,iBAAiB,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC;AACvC,QAAA,OAAO,MAAK;AACR,YAAA,OAAO,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;AACxB,YAAA,OAAO,CAAC,iBAAiB,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;YACrC,OAAO,CAAC,SAAS,EAAE,CAAC;AACxB,SAAC,CAAC;;AAEN,KAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAET,eAAe,CAAC,MAAK;;AAEjB,QAAA,IACI,QAAQ,CAAC,QAAQ,KAAK,QAAQ,CAAC,KAAK;YACpC,QAAQ,CAAC,KAAK,GAAG,CAAC;YAClB,CAAC,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EACrD;AACE,YAAA,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;SAC7B;AACL,KAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEzB,OAAO,CAAC,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;AAC/C;;;;"}
+{"version":3,"file":"useModalOrder.js","sources":["src/useModalOrder.ts"],"sourcesContent":["import { RefObject, useEffect, useLayoutEffect, useState } from 'react';\n\nimport { storeValueInDom, getValueFromDom, useDomStoredUniqueId } from '@hh.ru/magritte-common-dom-storage';\n\ntype NotifyCallbackArg = { position: number; count: number };\n\ntype Subscribers = Record<string, (position: NotifyCallbackArg) => void>;\ntype VisibilityMap = Record<string, boolean>;\ntype PositionMap = Record<string, number>;\n\ntype ModalCounterState = {\n    prevVisiblility: VisibilityMap;\n    positions: PositionMap;\n    subscribers: Subscribers;\n    count: number;\n};\n\nconst STORAGE_NAME = '_MAGRITTE_MODAL_COUNTER_';\n\nconst getState = (): ModalCounterState => {\n    const state = getValueFromDom<ModalCounterState>(STORAGE_NAME);\n    if (state === undefined) {\n        return {\n            prevVisiblility: {},\n            positions: {},\n            subscribers: {},\n            count: 0,\n        };\n    }\n    return state;\n};\n\nconst storeState = (state: ModalCounterState): void => {\n    storeValueInDom(STORAGE_NAME, state);\n};\n\nconst counterFactory = () => {\n    return {\n        updateVisiblility: (id: string, visible: boolean) => {\n            // eslint-disable-next-line prefer-const\n            const state = getState();\n            const prevVisible = !!state.prevVisiblility[id];\n            if (visible === prevVisible) {\n                return;\n            }\n            state.prevVisiblility[id] = visible;\n            if (visible) {\n                state.count += 1;\n                state.positions[id] = state.count;\n            } else {\n                state.count -= 1;\n                const currentPosition = state.positions[id];\n                state.positions[id] = 0;\n                Object.entries(state.positions).forEach(([key, value]) => {\n                    state.positions[key] = value > currentPosition ? value - 1 : value;\n                });\n            }\n            storeState(state);\n        },\n        subscribe: (id: string, callback: (position: NotifyCallbackArg) => void) => {\n            const state = getState();\n            state.subscribers[id] = callback;\n            storeState(state);\n        },\n        unsubscribe: (id: string) => {\n            const state = getState();\n            delete state.subscribers[id];\n            storeState(state);\n        },\n        notifyAll: () => {\n            const { subscribers, count, positions } = getState();\n            Object.entries(subscribers).forEach(([id, callback]) => callback({ position: positions[id], count }));\n        },\n    };\n};\n\nconst counter = counterFactory();\n\nexport const useModalOrder = (visible: boolean, modalRef: RefObject<HTMLDivElement>): [number, number] => {\n    const [position, setPosition] = useState<{ position: number; count: number }>({ position: 0, count: 0 });\n    const id = useDomStoredUniqueId();\n\n    useLayoutEffect(() => {\n        counter.updateVisiblility(id, visible);\n        counter.notifyAll();\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [visible]);\n\n    useEffect(() => {\n        counter.subscribe(id, setPosition);\n        counter.updateVisiblility(id, visible);\n        return () => {\n            counter.unsubscribe(id);\n            counter.updateVisiblility(id, false);\n            counter.notifyAll();\n        };\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [id]);\n\n    useLayoutEffect(() => {\n        // Если это самый \"верхний\" модал передаем туда фокус\n        if (\n            position.position === position.count &&\n            position.count > 0 &&\n            !modalRef.current?.contains(document.activeElement)\n        ) {\n            modalRef.current?.focus();\n        }\n    }, [position, modalRef]);\n\n    return [position.position, position.count];\n};\n"],"names":[],"mappings":"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"}

package/ModalContentWithHeader-B7tpHFBW.js

@@ -1,150 +0,0 @@
-import './index.css';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { useRef, useState, useCallback, useLayoutEffect } from 'react';
-import classnames from 'classnames';
-import { requestAnimation } from '@hh.ru/magritte-common-func-utils';
-import { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';
-import { ContentOverlayRoot } from '@hh.ru/magritte-ui-content-overlay';
-import { Divider } from '@hh.ru/magritte-ui-divider';
-import { ModalHeader } from './ModalHeader.js';
-import { useScrollbar, Scrollbar } from '@hh.ru/magritte-ui-scrollbar';
-import { TextAreaGrowLimiter } from '@hh.ru/magritte-ui-textarea';
-
-var styles = {"modal-overlay":"magritte-modal-overlay___uurgp_1-0-39","modalOverlay":"magritte-modal-overlay___uurgp_1-0-39","modal-overlay-with-background":"magritte-modal-overlay-with-background___mR-T0_1-0-39","modalOverlayWithBackground":"magritte-modal-overlay-with-background___mR-T0_1-0-39","modal":"magritte-modal___2Wc4s_1-0-39","modal-overlay-left":"magritte-modal-overlay-left___qaiC9_1-0-39","modalOverlayLeft":"magritte-modal-overlay-left___qaiC9_1-0-39","modal-overlay-right":"magritte-modal-overlay-right___-HTKs_1-0-39","modalOverlayRight":"magritte-modal-overlay-right___-HTKs_1-0-39","size-small":"magritte-size-small___nSBwy_1-0-39","sizeSmall":"magritte-size-small___nSBwy_1-0-39","size-medium":"magritte-size-medium___Zuz-t_1-0-39","sizeMedium":"magritte-size-medium___Zuz-t_1-0-39","no-vertical-paddings":"magritte-no-vertical-paddings___XgMGS_1-0-39","noVerticalPaddings":"magritte-no-vertical-paddings___XgMGS_1-0-39","no-horizontal-paddings":"magritte-no-horizontal-paddings___MJDv4_1-0-39","noHorizontalPaddings":"magritte-no-horizontal-paddings___MJDv4_1-0-39","modal-full-height":"magritte-modal-full-height___UThtH_1-0-39","modalFullHeight":"magritte-modal-full-height___UThtH_1-0-39","modal-with-border":"magritte-modal-with-border___bqsql_1-0-39","modalWithBorder":"magritte-modal-with-border___bqsql_1-0-39","modal-content-wrapper":"magritte-modal-content-wrapper___-eFo3_1-0-39","modalContentWrapper":"magritte-modal-content-wrapper___-eFo3_1-0-39","modal-content":"magritte-modal-content___KY9ma_1-0-39","modalContent":"magritte-modal-content___KY9ma_1-0-39","modal-scroll-container":"magritte-modal-scroll-container___dg8jC_1-0-39","modalScrollContainer":"magritte-modal-scroll-container___dg8jC_1-0-39","modal-content-wrapper__one-line":"magritte-modal-content-wrapper__one-line___ZkEgT_1-0-39","modalContentWrapperOneLine":"magritte-modal-content-wrapper__one-line___ZkEgT_1-0-39","content-sticky-container":"magritte-content-sticky-container___VkZxO_1-0-39","contentStickyContainer":"magritte-content-sticky-container___VkZxO_1-0-39","divider-container":"magritte-divider-container___jKyxB_1-0-39","dividerContainer":"magritte-divider-container___jKyxB_1-0-39","divider-container-hidden":"magritte-divider-container-hidden___20nI5_1-0-39","dividerContainerHidden":"magritte-divider-container-hidden___20nI5_1-0-39","modal-footer":"magritte-modal-footer___TbH6x_1-0-39","modalFooter":"magritte-modal-footer___TbH6x_1-0-39","modal-buttons-container":"magritte-modal-buttons-container___9hXUo_1-0-39","modalButtonsContainer":"magritte-modal-buttons-container___9hXUo_1-0-39","animation-timeout":"magritte-animation-timeout___vK6nU_1-0-39","animationTimeout":"magritte-animation-timeout___vK6nU_1-0-39","animation-enter-center":"magritte-animation-enter-center___9zWOQ_1-0-39","animationEnterCenter":"magritte-animation-enter-center___9zWOQ_1-0-39","animation-enter-center-active":"magritte-animation-enter-center-active___dfICf_1-0-39","animationEnterCenterActive":"magritte-animation-enter-center-active___dfICf_1-0-39","animation-exit-center":"magritte-animation-exit-center___mrTCE_1-0-39","animationExitCenter":"magritte-animation-exit-center___mrTCE_1-0-39","animation-exit-center-active":"magritte-animation-exit-center-active___WZXYp_1-0-39","animationExitCenterActive":"magritte-animation-exit-center-active___WZXYp_1-0-39","animation-enter-left":"magritte-animation-enter-left___XiXzr_1-0-39","animationEnterLeft":"magritte-animation-enter-left___XiXzr_1-0-39","animation-enter-left-active":"magritte-animation-enter-left-active___4Uaz6_1-0-39","animationEnterLeftActive":"magritte-animation-enter-left-active___4Uaz6_1-0-39","animation-exit-left":"magritte-animation-exit-left___NHvvO_1-0-39","animationExitLeft":"magritte-animation-exit-left___NHvvO_1-0-39","animation-exit-left-active":"magritte-animation-exit-left-active___oDszE_1-0-39","animationExitLeftActive":"magritte-animation-exit-left-active___oDszE_1-0-39","animation-enter-right":"magritte-animation-enter-right___1bqPX_1-0-39","animationEnterRight":"magritte-animation-enter-right___1bqPX_1-0-39","animation-enter-right-active":"magritte-animation-enter-right-active___OR65U_1-0-39","animationEnterRightActive":"magritte-animation-enter-right-active___OR65U_1-0-39","animation-exit-right":"magritte-animation-exit-right___hyYBh_1-0-39","animationExitRight":"magritte-animation-exit-right___hyYBh_1-0-39","animation-exit-right-active":"magritte-animation-exit-right-active___ft6Lz_1-0-39","animationExitRightActive":"magritte-animation-exit-right-active___ft6Lz_1-0-39","space-preserver":"magritte-space-preserver___nz3Nw_1-0-39","spacePreserver":"magritte-space-preserver___nz3Nw_1-0-39","tree-selector-container":"magritte-tree-selector-container___XZh1C_1-0-39","treeSelectorContainer":"magritte-tree-selector-container___XZh1C_1-0-39","grow-limiter":"magritte-grow-limiter___SPuoT_1-0-39","growLimiter":"magritte-grow-limiter___SPuoT_1-0-39"};
-
-const checkIsScrolledToBottom = (el) => {
-    return Math.abs(el.scrollHeight - el.scrollTop - el.clientHeight) < 1;
-};
-const clamp = (value, min, max) => Math.min(Math.max(value, min), max);
-// Минимальная высота до которой может сжаться хедер
-const HEADER_SHRINK_MIN_HEIGHT = 148;
-// Минимальная высота отступа между хедером и контентом
-const HEADER_MARGIN_MIN_HEIGHT = 12;
-// Максимальная высота отступа между хедером и контентом
-const HEADER_MARGIN_MAX_HEIGHT = 24;
-const HEADER_MARGIN_HEIGHT_DELTA = HEADER_MARGIN_MAX_HEIGHT - HEADER_MARGIN_MIN_HEIGHT;
-// Вычисляет минимальную высоту до которой может сжаться хедер с учетом высоты контента, чтобы не спровоцировать
-// изменение размера модалки
-const calcHeaderShrinkLimit = (headerHeight, headerMaxHeight, contentHeight, contentScrollHeight, marginHeight) => {
-    // Высота контента скрытого под скроллом когда хедер и марджин под ним имеет максимальную допустимую высоту
-    const contentScrollDelta = contentScrollHeight - // Высота контента скрытого под скроллом в текущем состоянии
-        contentHeight + // Высота контейнера содержащего контент
-        (HEADER_MARGIN_MAX_HEIGHT - marginHeight) + // Дельта между текущей высотой марджина и максимальной допустимой
-        (headerMaxHeight - headerHeight); // Дельта между текущей высотой хедера и максимальной допустимой
-    const headerShrinkMinHeight = headerMaxHeight - (contentScrollDelta - HEADER_MARGIN_HEIGHT_DELTA);
-    return Math.max(headerShrinkMinHeight, HEADER_SHRINK_MIN_HEIGHT);
-};
-const shrinkByDelta = (headerImageContainer, headerWrapper, headerMinHeight, headerMaxHeight, scrollDeltaY) => {
-    if (!headerImageContainer || !headerWrapper) {
-        return;
-    }
-    const marginHeight = clamp(HEADER_MARGIN_MAX_HEIGHT - scrollDeltaY, HEADER_MARGIN_MIN_HEIGHT, HEADER_MARGIN_MAX_HEIGHT);
-    headerWrapper.style.marginBottom = `${marginHeight}px`;
-    const headerHeight = clamp(
-    // Тут прибаляем дельту марджина потому что сначала должен сжаться отступ
-    Math.floor(headerMaxHeight - scrollDeltaY + HEADER_MARGIN_HEIGHT_DELTA), headerMinHeight, headerMaxHeight);
-    headerImageContainer.style.height = `${headerHeight}px`;
-};
-const ModalContentWithHeader = ({ labelId, children, headerHeight: _headerHeight = 0, isTreeSelectorChild, height, showDivider = true, ...modalHeaderProps }) => {
-    const { title, headerImageUrl, headerImage, actions, actionLink, options } = modalHeaderProps;
-    const bottomDividerVisibleRef = useRef(false);
-    const contentContainerRef = useRef(null);
-    const headerImageContainerRef = useRef(null);
-    const headerWrapperRef = useRef(null);
-    const spacePreserverRef = useRef(null);
-    const stickyContainerRef = useRef(null);
-    const hasHeaderImageRef = useRef(!!headerImageUrl || !!headerImage);
-    hasHeaderImageRef.current = !!headerImageUrl || !!headerImage;
-    const headerHeightRef = useRef(0);
-    headerHeightRef.current = hasHeaderImageRef.current ? Math.max(_headerHeight, 200) : 0;
-    const minHeaderHeightRef = useRef(0);
-    const contentOverlayRef = useRef(null);
-    const bottomDividerContainerRef = useRef(null);
-    const topDividerContainerRef = useRef(null);
-    const withoutHeader = !title && !hasHeaderImageRef.current && !actions && !actionLink && !options;
-    const onlyActions = !title && !hasHeaderImageRef.current && !options && (actions || actionLink);
-    const [growLimiterContextValue, _] = useState(() => ({
-        containerRef: contentContainerRef,
-    }));
-    const isTopDividerVisible = () => {
-        if (!contentContainerRef.current) {
-            return false;
-        }
-        const topDividerVisible = hasHeaderImageRef.current
-            ? contentContainerRef.current.scrollTop >
-                headerHeightRef.current - minHeaderHeightRef.current + HEADER_MARGIN_HEIGHT_DELTA
-            : contentContainerRef.current.scrollTop !== 0;
-        return topDividerVisible && (options || !hasHeaderImageRef.current) && !onlyActions && !withoutHeader;
-    };
-    const recalcContentOverlayPosition = useCallback(() => {
-        if (contentOverlayRef.current !== null && contentContainerRef.current !== null) {
-            contentOverlayRef.current.style.height = `${contentContainerRef.current.clientHeight}px`;
-        }
-    }, []);
-    const updateHeaderDimensions = useCallback(() => {
-        if (!headerImageContainerRef.current ||
-            !headerWrapperRef.current ||
-            !stickyContainerRef.current ||
-            !spacePreserverRef.current ||
-            !contentContainerRef.current) {
-            return;
-        }
-        if (!hasHeaderImageRef.current) {
-            spacePreserverRef.current.style.height = '0';
-            return;
-        }
-        minHeaderHeightRef.current = calcHeaderShrinkLimit(headerImageContainerRef.current.clientHeight, headerHeightRef.current, contentContainerRef.current.clientHeight, stickyContainerRef.current.scrollHeight, parseInt(headerWrapperRef.current.style.marginBottom || '0', 10));
-        shrinkByDelta(headerImageContainerRef.current, headerWrapperRef.current, minHeaderHeightRef.current, headerHeightRef.current, contentContainerRef.current.scrollTop);
-        const preserverSize = headerHeightRef.current - minHeaderHeightRef.current + HEADER_MARGIN_HEIGHT_DELTA;
-        spacePreserverRef.current.style.height = `${preserverSize}px`;
-    }, []);
-    useLayoutEffect(() => {
-        if (contentContainerRef.current) {
-            const observer = new ResizeObserver(requestAnimation(() => {
-                if (!contentContainerRef.current) {
-                    return;
-                }
-                const isScrollable = contentContainerRef.current.scrollHeight > contentContainerRef.current.clientHeight;
-                const hasScroll = isScrollable && !checkIsScrolledToBottom(contentContainerRef.current);
-                bottomDividerVisibleRef.current = hasScroll;
-                bottomDividerContainerRef.current?.classList.toggle(styles.dividerContainerHidden, !bottomDividerVisibleRef.current);
-                updateHeaderDimensions();
-                recalcContentOverlayPosition();
-            }));
-            observer.observe(contentContainerRef.current);
-            return () => observer.disconnect();
-        }
-        return undefined;
-    }, [updateHeaderDimensions, recalcContentOverlayPosition]);
-    useLayoutEffect(() => {
-        updateHeaderDimensions();
-        recalcContentOverlayPosition();
-        if (!options && (headerImageUrl || headerImage)) {
-            topDividerContainerRef.current?.classList.toggle(styles.dividerContainerHidden, true);
-        }
-    }, [headerImageUrl, headerImage, updateHeaderDimensions, recalcContentOverlayPosition, options]);
-    const handleScroll = () => {
-        if (!contentContainerRef.current) {
-            return;
-        }
-        bottomDividerVisibleRef.current = !checkIsScrolledToBottom(contentContainerRef.current);
-        bottomDividerContainerRef.current?.classList.toggle(styles.dividerContainerHidden, !bottomDividerVisibleRef.current);
-        topDividerContainerRef.current?.classList.toggle(styles.dividerContainerHidden, !isTopDividerVisible());
-        if (hasHeaderImageRef.current) {
-            shrinkByDelta(headerImageContainerRef.current, headerWrapperRef.current, minHeaderHeightRef.current, headerHeightRef.current, contentContainerRef.current.scrollTop);
-        }
-    };
-    const { hasVerticalScroll, verticalScrollbarProps, ...scrollbar } = useScrollbar({ axis: 'vertical' });
-    const contentContainerRefCallback = useMultipleRefs(contentContainerRef, scrollbar.scrollContainerRef);
-    const stickyContainerRefCallback = useMultipleRefs(stickyContainerRef, scrollbar.contentWrapperRef);
-    return (jsxs(Fragment, { children: [jsxs("div", { className: classnames(styles.modalContentWrapper, {
-                    [styles.modalContentWrapperOneLine]: onlyActions,
-                }), children: [jsx(ModalHeader, { ...modalHeaderProps, headerHeight: headerHeightRef.current, labelId: labelId, wrapperRef: headerWrapperRef, ref: headerImageContainerRef }), jsx("div", { className: classnames(styles.dividerContainer, {
-                            [styles.dividerContainerHidden]: !isTopDividerVisible(),
-                        }), ref: topDividerContainerRef, children: jsx(Divider, {}) }), jsx("div", { className: classnames(styles.modalContent, scrollbar.hoverContainerCssClass), children: jsx(ContentOverlayRoot, { ref: contentOverlayRef, children: isTreeSelectorChild ? (jsx("div", { className: styles.treeSelectorContainer, children: children })) : (jsxs(Fragment, { children: [jsxs("div", { className: classnames(styles.modalScrollContainer), ref: contentContainerRefCallback, onScroll: handleScroll, "data-qa": "modal-content-scroll-container", children: [jsx("div", { className: classnames(styles.contentStickyContainer), ref: stickyContainerRefCallback, children: jsx(TextAreaGrowLimiter, { ...growLimiterContextValue, className: styles.growLimiter, children: children }) }), jsx("div", { className: styles.spacePreserver, ref: spacePreserverRef })] }), hasVerticalScroll && jsx(Scrollbar, { ...verticalScrollbarProps })] })) }) })] }), showDivider && (jsx("div", { className: classnames(styles.dividerContainer, {
-                    [styles.dividerContainerHidden]: !bottomDividerVisibleRef.current,
-                }), ref: bottomDividerContainerRef, children: jsx(Divider, {}) }))] }));
-};
-
-export { ModalContentWithHeader as M, styles as s };
-//# sourceMappingURL=ModalContentWithHeader-B7tpHFBW.js.map