intelicoreact 2.0.18 → 2.0.20

package/dist/es/Atomic/UI/Hint/Hint.styles.css

@@ -0,0 +1,107 @@
+.hint {
+  position: relative;
+  display: inline-block;
+  font-size: 0;
+}
+.hint__container {
+  position: fixed;
+  z-index: 99999;
+  display: block;
+  box-sizing: border-box;
+}
+.hint__button {
+  display: flex;
+  cursor: pointer;
+}
+.hint__button svg {
+  width: 16px;
+  height: 16px;
+  margin-right: 5px;
+}
+.hint__button:hover, .hint__button_active {
+  color: #6b81dd;
+}
+.hint__button:hover svg, .hint__button_active svg {
+  color: #6b81dd;
+}
+.hint__text {
+  position: absolute;
+  z-index: 1;
+  min-width: 80px;
+  max-width: 250px;
+  padding: 8px;
+  font-size: 10px;
+  line-height: 16px;
+  color: #fff;
+  border-radius: 4px;
+  background-color: #6b81dd;
+}
+.hint__text a {
+  text-decoration: underline;
+  color: #fff;
+}
+.hint__text::before {
+  position: absolute;
+  width: 8.5px;
+  height: 8.5px;
+  content: "";
+  background-color: #6b81dd;
+  transform: rotate(45deg);
+}
+.hint__text_bottom {
+  top: 26px;
+  left: -4px;
+}
+.hint__text_bottom::before {
+  top: -4.25px;
+  left: 8px;
+}
+.hint__text_centeredBottom {
+  top: 26px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.hint__text_centeredBottom::before {
+  top: -4.25px;
+  left: calc(50% - 8px);
+}
+.hint__text_right {
+  top: -4px;
+  left: calc(100% + 8px);
+}
+.hint__text_right::before {
+  top: 8px;
+  left: -4.25px;
+}
+.hint__text_left {
+  top: -4px;
+  right: calc(100% + 8px);
+  left: unset;
+}
+.hint__text_left::before {
+  top: 8px;
+  right: -4.25px;
+}
+.hint__text_top {
+  bottom: 8px;
+  left: -4px;
+}
+.hint__text_top::before {
+  bottom: -4.25px;
+  left: 8px;
+}
+.hint__text_centeredTop {
+  bottom: 8px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.hint__text_centeredTop::before {
+  bottom: -4.25px;
+  left: calc(50% - 8px);
+}
+.hint__icon.outlined {
+  color: #9aa0b9;
+}
+.hint__icon.filled {
+  color: #fff;
+}

package/dist/es/Atomic/UI/Hint/index.js

@@ -0,0 +1,7 @@
+import Hint from "./Hint.js";
+//#region src/Atomic/UI/Hint/index.ts
+var Hint_default = Hint;
+//#endregion
+export { Hint_default as default };
+
+//# sourceMappingURL=index.js.map

package/dist/es/Atomic/UI/Hint/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/Atomic/UI/Hint/index.ts"],"sourcesContent":["import type { IHintProps } from './Hint.interface';\nimport Hint from './Hint';\n\nexport default Hint;\nexport type { IHintProps };\n"],"mappings":";;AAGA,IAAA,eAAe"}

package/dist/es/Atomic/UI/Hint/partials/_constants.js

@@ -0,0 +1,11 @@
+//#region src/Atomic/UI/Hint/partials/_constants.ts
+var I_AM_OPENED_EVENT_NAME = "hint:i-am-open";
+var I_AM_OPENED_EVENT_OPTIONS = {
+	bubbles: true,
+	cancelable: true,
+	composed: false
+};
+//#endregion
+export { I_AM_OPENED_EVENT_NAME, I_AM_OPENED_EVENT_OPTIONS };
+
+//# sourceMappingURL=_constants.js.map

package/dist/es/Atomic/UI/Hint/partials/_constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"_constants.js","names":[],"sources":["../../../../../../src/Atomic/UI/Hint/partials/_constants.ts"],"sourcesContent":["export const I_AM_OPENED_EVENT_NAME = 'hint:i-am-open';\nexport const I_AM_OPENED_EVENT_OPTIONS = {\n  bubbles: true,\n  cancelable: true,\n  composed: false,\n};\n"],"mappings":";AAAA,IAAa,yBAAyB;AACtC,IAAa,4BAA4B;CACvC,SAAS;CACT,YAAY;CACZ,UAAU;AACZ"}

package/dist/es/Atomic/UI/Hint/partials/_utils.js

@@ -0,0 +1,35 @@
+//#region src/Atomic/UI/Hint/partials/_utils.ts
+var getHintContainerId = (hintId) => `hint-container-for-hint--id-${hintId}`;
+function getHintContainer(hintId) {
+	return document.getElementById(getHintContainerId(hintId));
+}
+function getParentNode() {
+	return document.querySelector("div#root") ?? document.querySelector("div#app") ?? document.body;
+}
+function initHintContainer(hintId, hintContainerSettings) {
+	const { className } = hintContainerSettings;
+	const hintContainer = document.createElement("div");
+	hintContainer.setAttribute("id", getHintContainerId(hintId));
+	hintContainer.classList.add("hint__container");
+	if (className) hintContainer.classList.add(className);
+	getParentNode()?.append(hintContainer);
+}
+function HandleScrollObj(setIsOpen) {
+	this.setIsOpen = setIsOpen;
+	this.handleEvent = function() {
+		this.setIsOpen(false);
+	};
+}
+function HandleClickOutsideObj(id, setIsOpen) {
+	this.id = id;
+	this.setIsOpen = setIsOpen;
+	this.handleEvent = function(event) {
+		if (getHintContainer(this.id)) {
+			if (!getHintContainer(this.id).contains(event?.target)) this.setIsOpen(false);
+		}
+	};
+}
+//#endregion
+export { HandleClickOutsideObj, HandleScrollObj, getHintContainer, getHintContainerId, getParentNode, initHintContainer };
+
+//# sourceMappingURL=_utils.js.map

package/dist/es/Atomic/UI/Hint/partials/_utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"_utils.js","names":[],"sources":["../../../../../../src/Atomic/UI/Hint/partials/_utils.ts"],"sourcesContent":["export const getHintContainerId = (hintId: string | number): string => `hint-container-for-hint--id-${hintId}`;\n\nexport function getHintContainer(hintId: string | number): HTMLElement | null {\n  return document.getElementById(getHintContainerId(hintId));\n}\n\nexport function getParentNode(): HTMLElement | null {\n  return (\n    document.querySelector('div#root')\n    ?? document.querySelector('div#app')\n    ?? document.body\n  );\n}\n\nexport function initHintContainer(hintId: string | number, hintContainerSettings: any): void {\n  const { className } = hintContainerSettings;\n  const hintContainer = document.createElement('div');\n\n  hintContainer.setAttribute('id', getHintContainerId(hintId));\n  hintContainer.classList.add('hint__container');\n  if (className) hintContainer.classList.add(className);\n\n  getParentNode()?.append(hintContainer);\n}\n\n// ? addEventListener можно инициализировать двумя способами\n// ?   - передать прямой колбэк (ф-ю)\n// ?   - передать объект в котором есть метод handleEvent (помимо handleEvent можно записать в this прочие полезные значения)\n// ? Пользуемся вторым способом, чтобы записать входные данные (вообще можно не писать, работает и просто от замыкания, но делаем по \"дзену\")\n// ! Метод написан с расчетом на то, что будет вызываться ТОЛЬКО открытым тултипом\nexport function HandleScrollObj(this: any, setIsOpen: (isOpen: boolean) => void): void {\n  this.setIsOpen = setIsOpen;\n  this.handleEvent = function () {\n    this.setIsOpen(false);\n  };\n}\n\nexport function HandleClickOutsideObj(this: any, id: string | number, setIsOpen: (isOpen: boolean) => void): void {\n  this.id = id;\n  this.setIsOpen = setIsOpen;\n  this.handleEvent = function (event: Event) {\n    if (getHintContainer(this.id)) {\n      if (!(getHintContainer(this.id) as HTMLElement).contains(event?.target as Node)) {\n        this.setIsOpen(false);\n      }\n    }\n  };\n}\n"],"mappings":";AAAA,IAAa,sBAAsB,WAAoC,+BAA+B;AAEtG,SAAgB,iBAAiB,QAA6C;CAC5E,OAAO,SAAS,eAAe,mBAAmB,MAAM,CAAC;AAC3D;AAEA,SAAgB,gBAAoC;CAClD,OACE,SAAS,cAAc,UAAU,KAC9B,SAAS,cAAc,SAAS,KAChC,SAAS;AAEhB;AAEA,SAAgB,kBAAkB,QAAyB,uBAAkC;CAC3F,MAAM,EAAE,cAAc;CACtB,MAAM,gBAAgB,SAAS,cAAc,KAAK;CAElD,cAAc,aAAa,MAAM,mBAAmB,MAAM,CAAC;CAC3D,cAAc,UAAU,IAAI,iBAAiB;CAC7C,IAAI,WAAW,cAAc,UAAU,IAAI,SAAS;CAEpD,cAAc,CAAC,EAAE,OAAO,aAAa;AACvC;AAOA,SAAgB,gBAA2B,WAA4C;CACrF,KAAK,YAAY;CACjB,KAAK,cAAc,WAAY;EAC7B,KAAK,UAAU,KAAK;CACtB;AACF;AAEA,SAAgB,sBAAiC,IAAqB,WAA4C;CAChH,KAAK,KAAK;CACV,KAAK,YAAY;CACjB,KAAK,cAAc,SAAU,OAAc;EACzC,IAAI,iBAAiB,KAAK,EAAE;OACtB,CAAE,iBAAiB,KAAK,EAAE,CAAC,CAAiB,SAAS,OAAO,MAAc,GAC5E,KAAK,UAAU,KAAK;EAAA;CAG1B;AACF"}

package/dist/es/Atomic/UI/Modal/Modal.js

@@ -0,0 +1,178 @@
+import '../../../styles/base.css';
+import Button from "../Button/Button.js";
+import { getIsOnlyAnObject } from "../../../Functions/utils.js";
+import useHandleKeyPress from "../../../Functions/useKeyPress/useHandleKeyPress.js";
+import { EVENTS } from "./partials/_constants.js";
+import { getOnKeyPress, getWithEventManagementStructure } from "./partials/_utils.js";
+import ModalFooter from "./partials/ModalFooter.js";
+import ModalTitle from "./partials/ModalTitle.js";
+import useMobileModal from "./partials/useMobileModal.js";
+import './ModalMobile.styles.css';import './Modal.styles.css';/* empty css           */
+/* empty css                 */
+import cn from "classnames";
+import { useEffect, useLayoutEffect, useMemo, useRef } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/Atomic/UI/Modal/Modal.tsx
+var attrsForModalBodyDefault = {};
+var KEY_CODE = Object.freeze({
+	ENTER: 13,
+	ESC: 27
+});
+function renderModalTitle({ mode, title, onlyTitle }) {
+	if (mode && mode !== "default" && !onlyTitle) return `${mode[0].toUpperCase()}${mode.slice(1)} ${title}`;
+	return title;
+}
+function Modal({ ref, id, testId = "modal", zIndex = 100, isOpen, onConfirm, onDecline, closeModal, className, variant = "primary", size, mode, title, onlyTitle, atributesForModalBody = attrsForModalBodyDefault, confirmBtnClassName, confirmBtnLabel, confirmBtnVariant = "primary", confirmBtnDisable, confirmBtnIcon, isConfirmBtnIconPositionRight, noConfirmBtn, forced, closeBtnClassName, closeBtnText, closeBtnVariant, closeBtnDisable, closeBtnIcon, btnClassNames, isCloseBtnIconPositionRight, noCloseBtn, noHeader, noHeaderCloseBtn, customHeader, declineBtnDisable, noFooter, customFooter, withFixedFooter, leftContentOfFooter, isSubmittingByEnter: isSubmittingByEnterOuter = true, isClosingByEsc: isClosingByEscOuter = true, withEventManagement = false, submitOnEnter, closeOnEsc, withMobileLogic, children }) {
+	const internalRef = useRef(null);
+	const modalRef = ref || internalRef;
+	const onConfirmRef = useRef(onConfirm);
+	const closeModalRef = useRef(closeModal);
+	const onDeclineRef = useRef(onDecline);
+	const isSubmittingByEnter = submitOnEnter === false ? false : isSubmittingByEnterOuter;
+	const isClosingByEsc = closeOnEsc === false ? false : isClosingByEscOuter;
+	const withEventManagementStructure = getWithEventManagementStructure(id, withEventManagement);
+	const isUseAutoBlockingForHandlers = withEventManagementStructure.isWithSubmitAndCloseManagement;
+	const isOnConfirmBlocked = typeof onConfirm === "function" && isUseAutoBlockingForHandlers && confirmBtnDisable;
+	const isCloseModalBlocked = typeof closeModal === "function" && isUseAutoBlockingForHandlers && closeBtnDisable;
+	const isOnDeclineBlocked = typeof onDecline === "function" && isUseAutoBlockingForHandlers && declineBtnDisable;
+	const { modalMobileHeaderRef, modalMobileBodyRef, modalMobileFooterRef, MODALS_LOGIC, renderModal, isMobile, scrollTop, scrollHeight } = useMobileModal({
+		withMobileLogic,
+		withFixedFooter,
+		isOpen
+	});
+	const handle = useMemo(() => ({
+		confirm: () => onConfirmRef.current?.(),
+		close: () => closeModalRef.current?.(),
+		decline: () => {
+			if (typeof onDeclineRef.current === "function") onDeclineRef.current();
+			else closeModalRef.current?.();
+		}
+	}), []);
+	const suspendProcessing = { Enter: (ev) => (ev?.target)?.nodeName === "TEXTAREA" };
+	useHandleKeyPress({
+		enterCallback: isSubmittingByEnter && typeof onConfirm === "function" && !confirmBtnDisable ? handle.confirm : void 0,
+		escCallback: isClosingByEsc && typeof closeModal === "function" ? handle.close : void 0,
+		withClamping: false,
+		withEventManagementStructure: { isWithSubmitAndCloseManagement: confirmBtnDisable || withEventManagementStructure.isWithSubmitAndCloseManagement },
+		suspendProcessing
+	});
+	useLayoutEffect(() => {
+		onConfirmRef.current = isOnConfirmBlocked ? void 0 : onConfirm;
+	}, [onConfirm, isOnConfirmBlocked]);
+	useLayoutEffect(() => {
+		closeModalRef.current = isCloseModalBlocked ? void 0 : closeModal;
+	}, [closeModal, isCloseModalBlocked]);
+	useLayoutEffect(() => {
+		onDeclineRef.current = isOnDeclineBlocked ? () => {} : onDecline;
+	}, [onDecline, isOnDeclineBlocked]);
+	useEffect(() => {
+		const target = (getIsOnlyAnObject(withEventManagement) ? withEventManagement.listenersTarget : void 0) ?? document;
+		const onKeyPress = getOnKeyPress({
+			id,
+			onSubmit: handle.confirm,
+			onClose: handle.close,
+			suspendProcessing
+		});
+		if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {
+			if (isSubmittingByEnter) target.addEventListener(EVENTS.iGotAnEnterKeyPress.name, onKeyPress);
+			if (isClosingByEsc) target.addEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);
+		}
+		return () => {
+			if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {
+				if (isSubmittingByEnter) target.removeEventListener(EVENTS.iGotAnEnterKeyPress.name, onKeyPress);
+				if (isClosingByEsc) target.removeEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);
+			}
+		};
+	}, []);
+	if (!isOpen) return null;
+	return /* @__PURE__ */ jsx("div", {
+		id: `${id}`,
+		style: { zIndex },
+		"data-testid": testId,
+		className: "modal-box j5",
+		role: "dialog",
+		"aria-modal": "true",
+		"aria-labelledby": `${testId}-title`,
+		children: renderModal(/* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+			"data-testid": `${testId}-overlay`,
+			className: isOpen ? "modal-overlay" : "hidden",
+			onClick: handle.close,
+			role: "presentation"
+		}), /* @__PURE__ */ jsxs("div", {
+			ref: modalRef,
+			style: { width: typeof size === "number" ? `${size}px` : `${size?.replace("px", "")}px` },
+			className: cn(className, {
+				"modal": isOpen,
+				"modal--no-header": isOpen && noHeader && !customHeader,
+				"modal-mobile": isOpen && isMobile,
+				"hidden": !isOpen
+			}),
+			children: [
+				customHeader || !noHeader && /* @__PURE__ */ jsx(ModalTitle, {
+					wrapperRef: modalMobileHeaderRef,
+					className: cn({
+						"modal__header--hidden": MODALS_LOGIC.IS_HEADER_HIDDEN,
+						"modal__header--sticky": !MODALS_LOGIC.IS_HEADER_HIDDEN && MODALS_LOGIC.IS_HEADER_STICKY
+					}),
+					variant,
+					isForced: forced,
+					onClose: handle.close,
+					noHeaderCloseBtn,
+					children: /* @__PURE__ */ jsx("span", {
+						id: `${testId}-title`,
+						children: renderModalTitle({
+							mode,
+							title,
+							onlyTitle
+						})
+					})
+				}),
+				/* @__PURE__ */ jsx("div", {
+					...atributesForModalBody,
+					ref: modalMobileBodyRef,
+					className: cn("modal__body", { "modal__body--no-footer": noFooter }),
+					role: "document",
+					children
+				}),
+				(!noFooter || customFooter) && /* @__PURE__ */ jsx(ModalFooter, {
+					wrapperRef: modalMobileFooterRef,
+					className: cn({
+						"modal__footer--hidden": MODALS_LOGIC.IS_FOOTER_HIDDEN,
+						"modal__footer--sticky": !MODALS_LOGIC.IS_FOOTER_HIDDEN && MODALS_LOGIC.IS_FOOTER_STICKY && scrollTop !== scrollHeight,
+						"modal__footer_with-left-content": leftContentOfFooter
+					}),
+					children: customFooter || /* @__PURE__ */ jsxs(Fragment, { children: [leftContentOfFooter, (!noCloseBtn || !noConfirmBtn) && /* @__PURE__ */ jsxs("div", {
+						className: "modal__buttons-block",
+						children: [!noCloseBtn && /* @__PURE__ */ jsx(Button, {
+							testId: "modal",
+							className: cn(closeBtnClassName, btnClassNames),
+							variant: closeBtnVariant || "dark-outline",
+							onClick: handle.decline,
+							label: closeBtnText || "Cancel",
+							disabled: typeof onDecline === "function" ? declineBtnDisable : closeBtnDisable,
+							icon: closeBtnIcon,
+							isIconRight: isCloseBtnIconPositionRight,
+							tabIndex: 1,
+							"aria-label": "Close modal"
+						}), !noConfirmBtn && /* @__PURE__ */ jsx(Button, {
+							testId: "modal",
+							onClick: handle.confirm,
+							label: confirmBtnLabel || mode && mode?.[0].toUpperCase() + mode?.slice(1) || "Apply",
+							className: cn("ml5", confirmBtnClassName, btnClassNames),
+							variant: confirmBtnVariant,
+							disabled: confirmBtnDisable,
+							icon: confirmBtnIcon,
+							isIconRight: isConfirmBtnIconPositionRight,
+							"aria-label": "Confirm modal"
+						})]
+					})] })
+				})
+			]
+		})] }))
+	});
+}
+Modal.displayName = "Modal";
+//#endregion
+export { KEY_CODE, Modal as default, renderModalTitle };
+
+//# sourceMappingURL=Modal.js.map

package/dist/es/Atomic/UI/Modal/Modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.js","names":[],"sources":["../../../../../src/Atomic/UI/Modal/Modal.tsx"],"sourcesContent":["import type { ReactElement, RefObject } from 'react';\nimport type { ISuspendProcessing } from '../../../Functions/useKeyPress/useKeyPress';\nimport type TWithEventManagementAsObj from '../../../types/declaration/TWithEventManagementAsObj';\nimport type { IModalProps } from './Modal.interface';\n\nimport cn from 'classnames';\nimport { useEffect, useLayoutEffect, useMemo, useRef } from 'react';\n\nimport useHandleKeyPress from '../../../Functions/useKeyPress/useHandleKeyPress';\nimport { getIsOnlyAnObject } from '../../../Functions/utils';\nimport Button from '../Button/Button';\n\nimport { EVENTS } from './partials/_constants';\n\nimport { getOnKeyPress, getWithEventManagementStructure } from './partials/_utils';\nimport ModalFooter from './partials/ModalFooter';\nimport ModalTitle from './partials/ModalTitle';\n\nimport useMobileModal from './partials/useMobileModal';\nimport './Modal.scss';\nimport './ModalMobile.scss';\n\nconst attrsForModalBodyDefault = {}\nexport const KEY_CODE = Object.freeze({\n  ENTER: 13,\n  ESC: 27,\n} as const);\n\nexport function renderModalTitle({\n  mode,\n  title,\n  onlyTitle,\n}: {\n  mode?: string;\n  title: string;\n  onlyTitle?: boolean;\n}): string {\n  if (mode && mode !== 'default' && !onlyTitle) {\n    return `${mode[0].toUpperCase()}${mode.slice(1)} ${title}`;\n  }\n  return title;\n}\n\nfunction Modal({\n  ref,\n  id,\n  testId = 'modal',\n  zIndex = 100,\n  isOpen,\n  onConfirm,\n  onDecline,\n  closeModal,\n  className,\n  variant = 'primary',\n  size,\n  mode,\n  title,\n  onlyTitle,\n  atributesForModalBody = attrsForModalBodyDefault,\n  confirmBtnClassName,\n  confirmBtnLabel,\n  confirmBtnVariant = 'primary',\n  confirmBtnDisable,\n  confirmBtnIcon,\n  isConfirmBtnIconPositionRight,\n  noConfirmBtn,\n  forced,\n  closeBtnClassName,\n  closeBtnText,\n  closeBtnVariant,\n  closeBtnDisable,\n  closeBtnIcon,\n  btnClassNames,\n  isCloseBtnIconPositionRight,\n  noCloseBtn,\n  noHeader,\n  noHeaderCloseBtn,\n  customHeader,\n  declineBtnDisable,\n  noFooter,\n  customFooter,\n  withFixedFooter,\n  leftContentOfFooter,\n  isSubmittingByEnter: isSubmittingByEnterOuter = true,\n  isClosingByEsc: isClosingByEscOuter = true,\n  withEventManagement = false,\n  submitOnEnter,\n  closeOnEsc,\n  withMobileLogic,\n  children,\n}: IModalProps & { ref?: React.RefObject<HTMLDivElement | null> }): ReactElement | null {\n  const internalRef = useRef<HTMLDivElement | null>(null);\n  const modalRef = ref || internalRef;\n\n  // ? Пояснение разницы между isSubmittingByEnter и confirmBtnDisable (тоже самое для isClosingByEsc и closeBtnDisable)\n  // ?   - isSubmittingByEnter отключает установку листенера кастомных ивентов, это статика\n  // ?     (листенеры кастомных ивентов ставятся 1 раз, в useEffect по нулевой зависимости,\n  // ?     isSubmittingByEnter: false - пропускает его установку)\n  // ?   - confirmBtnDisable подменяет onConfirm на рефке, это динамика\n  // ?     (листенер установлен, сработки по кастомным ивентам идут, но НЕ запускается onConfirm)\n  const onConfirmRef = useRef(onConfirm);\n  const closeModalRef = useRef(closeModal);\n  const onDeclineRef = useRef(onDecline);\n\n  // todo(vl) - на старых пропах и раньше дефолт был true\n  // todo(vl) - поэтому для поддержки старья достаточно отслеживать запреты\n  const isSubmittingByEnter = submitOnEnter === false\n    ? false\n    : isSubmittingByEnterOuter;\n\n  const isClosingByEsc = closeOnEsc === false\n    ? false\n    : isClosingByEscOuter;\n\n  // !  Внимание: withEventManagement и withEventManagementStructure НЕ одно и тоже!\n  // !  withEventManagementStructure (смотри getWithEventManagementStructure и типизацию)\n  // !    - тут ГАРАНТИРОВАНО есть все варианты пропсов из соответствующей ветки InnerTypes (уже настроенные);\n  // !    - тут нет ничего из ICommon\n  const withEventManagementStructure = getWithEventManagementStructure(id, withEventManagement);\n  const isUseAutoBlockingForHandlers = withEventManagementStructure.isWithSubmitAndCloseManagement;\n\n  // ? Завязал автоблокировку на ивент-менеджмент для \"мягкого\" перехода, чтобы небыло сюрпризом по всем проектам\n  const isOnConfirmBlocked = typeof onConfirm === 'function' && isUseAutoBlockingForHandlers && confirmBtnDisable;\n  const isCloseModalBlocked = typeof closeModal === 'function' && isUseAutoBlockingForHandlers && closeBtnDisable;\n  const isOnDeclineBlocked = typeof onDecline === 'function' && isUseAutoBlockingForHandlers && declineBtnDisable;\n\n  const {\n    modalMobileHeaderRef,\n    modalMobileBodyRef,\n    modalMobileFooterRef,\n    MODALS_LOGIC,\n    renderModal,\n    isMobile,\n    scrollTop,\n    scrollHeight,\n  } = useMobileModal({\n    withMobileLogic,\n    withFixedFooter,\n    isOpen,\n  });\n\n  // ? Лучше чем useCallback, т.к.\n  // ?    - НЕ \"дёргает\" верстку (хотя по факту ре-рендер произойдет для useLayoutEffect-ов, но в шедоу-доме ничего не изменится)\n  // ?    - НЕ замыкает внешние состояния (обеспечивает useLayoutEffect)\n  // ?    - НЕ нужно переставлять листенеры\n  // ? Суть логики: \"иди по этой ссылке и попытайся запустить то что там есть\",\n  // ? ссылка - перманентная, содержание может меняться незаметно для оболочки\n  const handle = useMemo(() => ({\n    confirm: () => onConfirmRef.current?.(),\n    close: () => closeModalRef.current?.(),\n\n    decline: () => {\n      if (typeof onDeclineRef.current === 'function') onDeclineRef.current();\n      else closeModalRef.current?.();\n    },\n  }), []);\n\n  // ? Описываем колбеки, чекающие доп. условия приостановки обработки ивентов.\n  // ? Я предполагаю, что важно завести эту систему именно через колбеки, которые будут чекать некоторые состояния,\n  // ? которые НЕ спровоцируют ререндер для useCalbeck-логики, например активность элементов формы прямо из DOM\n  // ? (т.к. эта реализация модалки ничего не знает о состояниях своего внутреннего контента)\n  const suspendProcessing = {\n    // FIN-12482\n    // ? Чтобы НЕ замыкать рефку на модалку в логике, чтобы потом поискать в контенте все текстэриа,\n    // ? чтобы оценить есть ли среди них сфокусированная - делаем элеГАнтно:\n    // ? оцениваем ev.target, и если target это текстэриа, то вот сейчас то она и сфокусирована,\n    // ? т.е нужно приостановить процессы связанные с нажатием enter.\n    Enter: (ev: globalThis.KeyboardEvent) => (ev?.target as HTMLElement)?.nodeName === 'TEXTAREA',\n\n    // ? Колбеки опциональны, можно передавать только нужные\n    // Escape: (ev: globalThis.KeyboardEvent) => false,\n  } as ISuspendProcessing;\n\n  useHandleKeyPress({\n    enterCallback: isSubmittingByEnter && typeof onConfirm === 'function' && !confirmBtnDisable ? handle.confirm : undefined,\n    escCallback: isClosingByEsc && typeof closeModal === 'function' ? handle.close : undefined,\n    withClamping: false,\n    withEventManagementStructure: {\n      isWithSubmitAndCloseManagement: confirmBtnDisable || withEventManagementStructure.isWithSubmitAndCloseManagement,\n    },\n    suspendProcessing,\n  });\n\n  useLayoutEffect(() => {\n    onConfirmRef.current = isOnConfirmBlocked ? undefined : onConfirm;\n  }, [onConfirm, isOnConfirmBlocked]);\n\n  useLayoutEffect(() => {\n    closeModalRef.current = isCloseModalBlocked ? undefined : closeModal;\n  }, [closeModal, isCloseModalBlocked]);\n\n  useLayoutEffect(() => {\n    // ? Нельзя выставить undefined, т.к. в этом случае запустится closeModal (смотри handle.decline)\n    onDeclineRef.current = isOnDeclineBlocked ? () => {} : onDecline;\n  }, [onDecline, isOnDeclineBlocked]);\n\n  // ? Обработка нажатия enter и esc на кастомных ивентах\n  useEffect(() => {\n    const outerTarget = getIsOnlyAnObject(withEventManagement)\n      ? (withEventManagement as TWithEventManagementAsObj<'Modal'>).listenersTarget\n      : undefined;\n    const target = outerTarget ?? document;\n\n    // ? useEffect по нулевой зависимости вызывается 1 раз, а значит ссылка на колбек НЕ изменятся,\n    // ? а значит снятие слушателя пройдет корректно\n    const onKeyPress = getOnKeyPress({ id, onSubmit: handle.confirm, onClose: handle.close, suspendProcessing });\n\n    if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {\n      if (isSubmittingByEnter) target.addEventListener(EVENTS.iGotAnEnterKeyPress.name, onKeyPress);\n      if (isClosingByEsc) target.addEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);\n    }\n\n    return () => {\n      if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {\n        if (isSubmittingByEnter) target.removeEventListener(EVENTS.iGotAnEnterKeyPress.name, onKeyPress);\n        if (isClosingByEsc) target.removeEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);\n      }\n    }\n  }, []);\n\n  if (!isOpen) return null;\n\n  return (\n    <div\n      id={`${id}`}\n      style={{ zIndex }}\n      data-testid={testId}\n      className=\"modal-box j5\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-labelledby={`${testId}-title`}\n    >\n      {renderModal(\n        <>\n          <div\n            data-testid={`${testId}-overlay`}\n            className={isOpen ? 'modal-overlay' : 'hidden'}\n            onClick={handle.close}\n            role=\"presentation\"\n          />\n          <div\n            ref={modalRef as RefObject<HTMLDivElement>}\n            style={{ width: typeof size === 'number' ? `${size}px` : `${size?.replace('px', '')}px` }}\n            className={cn(className, {\n              'modal': isOpen,\n              'modal--no-header': isOpen && noHeader && !customHeader,\n              'modal-mobile': isOpen && isMobile,\n              'hidden': !isOpen,\n            })}\n          >\n            {customHeader || (!noHeader && (\n              <ModalTitle\n                wrapperRef={modalMobileHeaderRef}\n                className={cn({\n                  'modal__header--hidden': MODALS_LOGIC.IS_HEADER_HIDDEN,\n                  'modal__header--sticky': !MODALS_LOGIC.IS_HEADER_HIDDEN && MODALS_LOGIC.IS_HEADER_STICKY,\n                })}\n                variant={variant}\n                isForced={forced}\n                onClose={handle.close}\n                noHeaderCloseBtn={noHeaderCloseBtn}\n              >\n                <span id={`${testId}-title`}>{renderModalTitle({ mode, title, onlyTitle })}</span>\n              </ModalTitle>\n            ))}\n\n            <div\n              {...atributesForModalBody}\n              ref={modalMobileBodyRef}\n              className={cn('modal__body', {\n                'modal__body--no-footer': noFooter,\n              })}\n              role=\"document\"\n            >\n              {children}\n            </div>\n\n            {(!noFooter || customFooter) && (\n              <ModalFooter\n                wrapperRef={modalMobileFooterRef}\n                className={cn({\n                  'modal__footer--hidden': MODALS_LOGIC.IS_FOOTER_HIDDEN,\n                  'modal__footer--sticky':\n                      !MODALS_LOGIC.IS_FOOTER_HIDDEN\n                      && MODALS_LOGIC.IS_FOOTER_STICKY\n                      && scrollTop !== scrollHeight,\n                  'modal__footer_with-left-content': leftContentOfFooter,\n                })}\n              >\n                {customFooter || (\n                  <>\n                    {leftContentOfFooter}\n                    {(!noCloseBtn || !noConfirmBtn) && (\n                      <div className=\"modal__buttons-block\">\n                        {!noCloseBtn && (\n                          <Button\n                            testId=\"modal\"\n                            className={cn(closeBtnClassName, btnClassNames)}\n                            variant={closeBtnVariant || 'dark-outline'}\n                            onClick={handle.decline}\n                            label={closeBtnText || 'Cancel'}\n                            disabled={typeof onDecline === 'function' ? declineBtnDisable : closeBtnDisable}\n                            icon={closeBtnIcon}\n                            isIconRight={isCloseBtnIconPositionRight}\n                            tabIndex={1}\n                            aria-label=\"Close modal\"\n                          />\n                        )}\n                        {!noConfirmBtn && (\n                          <Button\n                            testId=\"modal\"\n                            onClick={handle.confirm}\n                            label={\n                              confirmBtnLabel\n                              || (mode && mode?.[0].toUpperCase() + mode?.slice(1))\n                              || 'Apply'\n                            }\n                            className={cn('ml5', confirmBtnClassName, btnClassNames)}\n                            variant={confirmBtnVariant}\n                            disabled={confirmBtnDisable}\n                            icon={confirmBtnIcon}\n                            isIconRight={isConfirmBtnIconPositionRight}\n                            aria-label=\"Confirm modal\"\n                          />\n                        )}\n                      </div>\n                    )}\n                  </>\n                )}\n              </ModalFooter>\n            )}\n          </div>\n        </>,\n      )}\n    </div>\n  );\n}\n\nModal.displayName = 'Modal';\n\nexport default Modal;\n"],"mappings":"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"}