@consta/uikit 5.26.0 → 5.27.0

package/__internal__/src/components/Banner/Banner.d.ts

@@ -3,16 +3,28 @@ import { IconComponent } from '@consta/icons/Icon';
 import React from 'react';
 import { MixSpaceProps, Space } from '../../mixs/MixSpace';
 import { PropsWithJsxAttributes } from '../../utils/types/PropsWithJsxAttributes';
+export declare const bannerPropSize: readonly ["xs", "s", "m", "l"];
+export type BannerPropSize = typeof bannerPropSize[number];
+export declare const bannerPropSizeDefault: BannerPropSize;
+export declare const bannerPropView: readonly ["filled", "ghost", "transparent"];
+export type BannerPropView = typeof bannerPropView[number];
+export declare const bannerPropViewDefault: BannerPropView;
+export declare const bannerPropStatus: readonly ["normal", "warning", "alert", "success", "system"];
+export type BannerPropStatus = typeof bannerPropStatus[number];
+export declare const bannerPropStatusDefault: BannerPropStatus;
+export declare const bannerPropForm: readonly ["default", "round", "brick"];
+export type BannerPropForm = typeof bannerPropForm[number];
+export declare const bannerPropFormDefault: BannerPropForm;
 export type BannerProps = PropsWithJsxAttributes<{
     leftSide?: React.ReactNode;
     rightSide?: React.ReactNode;
     icon?: IconComponent;
-    size?: 'xs' | 's' | 'm' | 'l';
-    view?: 'filled' | 'ghost' | 'transparent';
+    size?: BannerPropSize;
+    view?: BannerPropView;
     space?: MixSpaceProps;
     itemsGap?: Space | [Space, Space];
-    status?: 'normal' | 'warning' | 'alert' | 'success' | 'system';
-    form?: 'default' | 'round' | 'brick';
+    status?: BannerPropStatus;
+    form?: BannerPropForm;
 }>;
 export declare const cnBanner: import("@bem-react/classname").ClassNameFormatter;
 /**
@@ -22,11 +34,11 @@ export declare const cnBanner: import("@bem-react/classname").ClassNameFormatter
  * @property {React.ReactNode} [leftSide] - Содержимое на левой стороне.
  * @property {React.ReactNode} [rightSide] - Содержимое на правой стороне.
  * @property {IconComponent} [icon] - Иконка.
- * @property {'xs' | 's' | 'm' | 'l'} [size] - Размер компонента.
- * @property {'filled' | 'ghost' | 'transparent'} [view] - Визуальный стиль.
+ * @property {BannerPropSize} [size] - Размер компонента.
+ * @property {BannerPropView} [view] - Визуальный стиль.
  * @property {MixSpaceProps} [space] - Параметры отступов.
  * @property {Space | [Space, Space]} [itemsGap] - Отступы между элементами.
- * @property {'normal' | 'warning' | 'alert' | 'success' | 'system'} [status] - Статус (цветовая схема).
- * @property {'default' | 'round' | 'brick'} [form] - Форма компонента.
+ * @property {BannerPropStatus} [status] - Статус (цветовая схема).
+ * @property {BannerPropForm} [form] - Форма компонента.
  */
 export declare const Banner: React.ForwardRefExoticComponent<Omit<BannerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/__internal__/src/components/Banner/Banner.js

@@ -1,2 +1,2 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"./Banner.css";import React,{forwardRef}from"react";import{cnText,Text}from"../Text";import{useTheme}from"../Theme/Theme";import{cnMixFlex}from"../../mixs/MixFlex";import{cnMixSpace}from"../../mixs/MixSpace";import{cn}from"../../utils/bem";import{isNotNil,isString}from"../../utils/type-guards";export var cnBanner=cn("Banner");var SlotWrapper=function(a){var b=a.children;return React.createElement("div",{className:cnBanner("Slot")},b)},renderSlot=function(a,b,c){return isString(a)?React.createElement(SlotWrapper,{key:cnBanner("Slot",{index:b,position:c})},React.createElement(Text,{className:cnBanner("Text"),view:"primary",weight:0===b&&0===c?"bold":void 0,lineHeight:"m"},a)):React.createElement(SlotWrapper,{key:cnBanner("Slot",{index:b,position:c})},a)},renderSlots=function(a,b){return Array.isArray(a)?a.filter(isNotNil).map(function(a,c){return renderSlot(a,c,b)}):renderSlots([a],b)},getGap=function(a,b){return Array.isArray(a)?a[b]:a},textSizeMap={xs:"s",s:"s",m:"m",l:"l"},controlSizeMap={xs:"xs",s:"s",m:"s",l:"m"};export var Banner=forwardRef(function(a,b){var c,d=a.leftSide,e=a.rightSide,f=a.icon,g=a.size,h=void 0===g?"m":g,i=a.view,j=void 0===i?"filled":i,k=a.className,l=a.space,m=a.itemsGap,n=void 0===m?"s":m,o=a.status,p=void 0===o?"normal":o,q=a.style,r=a.form,s=void 0===r?"default":r,t=useTheme(),u=t.themeClassNames,v=[f?React.createElement(SlotWrapper,null,React.createElement(f,{className:cnBanner("Icon")})):null].concat(_toConsumableArray(renderSlots(d,0))).filter(isNotNil),w=renderSlots(e,1);return React.createElement("div",{className:cnBanner({view:j,form:s},[cnMixFlex({justify:w.length&&!v.length?"flex-end":"space-between",align:"center",gap:"m"}),cnMixSpace(l||{pH:h,pV:"xs"}),cnText({size:textSizeMap[h]}),"system"!==p&&"filled"===j?u.color.accent:void 0,k]),style:_objectSpread(_objectSpread({},q),{},(c={},_defineProperty(c,"--banner-bg-color","var(--color-bg-".concat(p,")")),_defineProperty(c,"--banner-inner-height","var(--control-height-".concat(controlSizeMap[h],")")),c)),ref:b},v.length?React.createElement("div",{className:cnMixFlex({gap:getGap(n,0),align:"center"})},v):void 0,w.length?React.createElement("div",{className:cnMixFlex({gap:getGap(n,1),align:"center"})},w):void 0)});
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["leftSide","rightSide","icon","size","view","className","space","itemsGap","status","style","form"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"./Banner.css";import React,{forwardRef}from"react";import{cnText,Text}from"../Text";import{useTheme}from"../Theme/Theme";import{cnMixFlex}from"../../mixs/MixFlex";import{cnMixSpace}from"../../mixs/MixSpace";import{cn}from"../../utils/bem";import{isNotNil,isString}from"../../utils/type-guards";export var bannerPropSize=["xs","s","m","l"];export var bannerPropSizeDefault=bannerPropSize[2];export var bannerPropView=["filled","ghost","transparent"];export var bannerPropViewDefault=bannerPropView[0];export var bannerPropStatus=["normal","warning","alert","success","system"];export var bannerPropStatusDefault=bannerPropStatus[0];export var bannerPropForm=["default","round","brick"];export var bannerPropFormDefault=bannerPropForm[0];export var cnBanner=cn("Banner");var SlotWrapper=function(a){var b=a.children;return React.createElement("div",{className:cnBanner("Slot")},b)},renderSlot=function(a,b,c){return isString(a)?React.createElement(SlotWrapper,{key:cnBanner("Slot",{index:b,position:c})},React.createElement(Text,{className:cnBanner("Text"),view:"primary",weight:0===b&&0===c?"bold":void 0,lineHeight:"m"},a)):React.createElement(SlotWrapper,{key:cnBanner("Slot",{index:b,position:c})},a)},renderSlots=function(a,b){return Array.isArray(a)?a.filter(isNotNil).map(function(a,c){return renderSlot(a,c,b)}):renderSlots([a],b)},getGap=function(a,b){return Array.isArray(a)?a[b]:a},textSizeMap={xs:"s",s:"s",m:"m",l:"l"},controlSizeMap={xs:"xs",s:"s",m:"s",l:"m"};export var Banner=forwardRef(function(a,b){var c,d=a.leftSide,e=a.rightSide,f=a.icon,g=a.size,h=void 0===g?bannerPropSizeDefault:g,i=a.view,j=void 0===i?bannerPropViewDefault:i,k=a.className,l=a.space,m=a.itemsGap,n=void 0===m?"s":m,o=a.status,p=void 0===o?bannerPropStatusDefault:o,q=a.style,r=a.form,s=void 0===r?bannerPropFormDefault:r,t=_objectWithoutProperties(a,_excluded),u=useTheme(),v=u.themeClassNames,w=renderSlots([f?React.createElement(f,{className:cnBanner("Icon")}):null].concat(_toConsumableArray(Array.isArray(d)?d:[d])),0),x=renderSlots(e,1);return React.createElement("div",Object.assign({},t,{className:cnBanner({view:j,form:s,size:h},[cnMixFlex({justify:x.length&&!w.length?"flex-end":"space-between",align:"center",gap:"m"}),cnMixSpace(l||{pH:h,pV:"xs"}),cnText({size:textSizeMap[h]}),"system"!==p&&"filled"===j?v.color.accent:void 0,k]),style:_objectSpread(_objectSpread({},q),{},(c={},_defineProperty(c,"--banner-bg-color","var(--color-bg-".concat(p,")")),_defineProperty(c,"--banner-inner-height","var(--control-height-".concat(controlSizeMap[h],")")),c)),ref:b}),w.length?React.createElement("div",{className:cnMixFlex({gap:getGap(n,0),align:"center"})},w):void 0,x.length?React.createElement("div",{className:cnMixFlex({gap:getGap(n,1),align:"center"})},x):void 0)});
 //# sourceMappingURL=Banner.js.map

package/__internal__/src/components/Banner/Banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.js","names":["React","forwardRef","cnText","Text","useTheme","cnMixFlex","cnMixSpace","cn","isNotNil","isString","cnBanner","SlotWrapper","children","renderSlot","slot","index","position","renderSlots","Array","isArray","filter","map","item","getGap","gap","textSizeMap","xs","s","m","l","controlSizeMap","Banner","props","ref","leftSide","rightSide","Icon","icon","size","view","className","space","itemsGap","status","style","form","themeClassNames","leftSlots","rightSlots","justify","length","align","pH","pV","color","accent"],"sources":["../../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import './Banner.css';\n\nimport { IconComponent } from '@consta/icons/Icon';\nimport React, { forwardRef } from 'react';\n\nimport { cnText, Text } from '##/components/Text';\nimport { useTheme } from '##/components/Theme/Theme';\nimport { cnMixFlex } from '##/mixs/MixFlex';\nimport { cnMixSpace, MixSpaceProps, Space } from '##/mixs/MixSpace';\nimport { cn } from '##/utils/bem';\nimport { isNotNil, isString } from '##/utils/type-guards';\nimport { PropsWithJsxAttributes } from '##/utils/types/PropsWithJsxAttributes';\n\nexport type BannerProps = PropsWithJsxAttributes<{\n  leftSide?: React.ReactNode;\n  rightSide?: React.ReactNode;\n  icon?: IconComponent;\n  size?: 'xs' | 's' | 'm' | 'l';\n  view?: 'filled' | 'ghost' | 'transparent';\n  space?: MixSpaceProps;\n  itemsGap?: Space | [Space, Space];\n  status?: 'normal' | 'warning' | 'alert' | 'success' | 'system';\n  form?: 'default' | 'round' | 'brick';\n}>;\n\nexport const cnBanner = cn('Banner');\n\nconst SlotWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => (\n  <div className={cnBanner('Slot')}>{children}</div>\n);\n\nconst renderSlot = (slot: React.ReactNode, index: number, position: number) => {\n  if (isString(slot)) {\n    return (\n      <SlotWrapper key={cnBanner('Slot', { index, position })}>\n        <Text\n          className={cnBanner('Text')}\n          view=\"primary\"\n          weight={index === 0 && position === 0 ? 'bold' : undefined}\n          lineHeight=\"m\"\n        >\n          {slot}\n        </Text>\n      </SlotWrapper>\n    );\n  }\n\n  return (\n    <SlotWrapper key={cnBanner('Slot', { index, position })}>\n      {slot}\n    </SlotWrapper>\n  );\n};\n\nconst renderSlots = (slot: React.ReactNode, position: number) => {\n  if (Array.isArray(slot)) {\n    return slot\n      .filter(isNotNil)\n      .map((item, index) => renderSlot(item, index, position));\n  }\n  return renderSlots([slot], position);\n};\n\nconst getGap = (gap: Space | [Space, Space], index: number) => {\n  if (Array.isArray(gap)) {\n    return gap[index];\n  }\n  return gap;\n};\n\nconst textSizeMap = {\n  xs: 's',\n  s: 's',\n  m: 'm',\n  l: 'l',\n} as const;\n\nconst controlSizeMap = {\n  xs: 'xs',\n  s: 's',\n  m: 's',\n  l: 'm',\n} as const;\n\n/**\n * Компонент Banner, отображающий содержимое слева и справа.\n * Поддерживает иконки, размеры, виды, статусы и формы.\n *\n * @property {React.ReactNode} [leftSide] - Содержимое на левой стороне.\n * @property {React.ReactNode} [rightSide] - Содержимое на правой стороне.\n * @property {IconComponent} [icon] - Иконка.\n * @property {'xs' | 's' | 'm' | 'l'} [size] - Размер компонента.\n * @property {'filled' | 'ghost' | 'transparent'} [view] - Визуальный стиль.\n * @property {MixSpaceProps} [space] - Параметры отступов.\n * @property {Space | [Space, Space]} [itemsGap] - Отступы между элементами.\n * @property {'normal' | 'warning' | 'alert' | 'success' | 'system'} [status] - Статус (цветовая схема).\n * @property {'default' | 'round' | 'brick'} [form] - Форма компонента.\n */\n\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>((props, ref) => {\n  const {\n    leftSide,\n    rightSide,\n    icon: Icon,\n    size = 'm',\n    view = 'filled',\n    className,\n    space,\n    itemsGap = 's',\n    status = 'normal',\n    style,\n    form = 'default',\n  } = props;\n\n  const { themeClassNames } = useTheme();\n\n  const leftSlots = [\n    Icon ? (\n      <SlotWrapper>\n        <Icon className={cnBanner('Icon')} />\n      </SlotWrapper>\n    ) : null,\n    ...renderSlots(leftSide, 0),\n  ].filter(isNotNil);\n\n  const rightSlots = renderSlots(rightSide, 1);\n\n  return (\n    <div\n      className={cnBanner({ view, form }, [\n        cnMixFlex({\n          justify:\n            rightSlots.length && !leftSlots.length\n              ? 'flex-end'\n              : 'space-between',\n          align: 'center',\n          gap: 'm',\n        }),\n        cnMixSpace(space || { pH: size, pV: 'xs' }),\n        cnText({ size: textSizeMap[size] }),\n        status !== 'system' && view === 'filled'\n          ? themeClassNames.color.accent\n          : undefined,\n        className,\n      ])}\n      style={{\n        ...style,\n        ['--banner-bg-color' as string]: `var(--color-bg-${status})`,\n        ['--banner-inner-height' as string]: `var(--control-height-${controlSizeMap[size]})`,\n      }}\n      ref={ref}\n    >\n      {leftSlots.length ? (\n        <div\n          className={cnMixFlex({ gap: getGap(itemsGap, 0), align: 'center' })}\n        >\n          {leftSlots}\n        </div>\n      ) : undefined}\n      {rightSlots.length ? (\n        <div\n          className={cnMixFlex({ gap: getGap(itemsGap, 1), align: 'center' })}\n        >\n          {rightSlots}\n        </div>\n      ) : undefined}\n    </div>\n  );\n});\n"],"mappings":"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"}
+{"version":3,"file":"Banner.js","names":["React","forwardRef","cnText","Text","useTheme","cnMixFlex","cnMixSpace","cn","isNotNil","isString","bannerPropSize","bannerPropSizeDefault","bannerPropView","bannerPropViewDefault","bannerPropStatus","bannerPropStatusDefault","bannerPropForm","bannerPropFormDefault","cnBanner","SlotWrapper","children","renderSlot","slot","index","position","renderSlots","Array","isArray","filter","map","item","getGap","gap","textSizeMap","xs","s","m","l","controlSizeMap","Banner","props","ref","leftSide","rightSide","Icon","icon","size","view","className","space","itemsGap","status","style","form","otherProps","themeClassNames","leftSlots","rightSlots","justify","length","align","pH","pV","color","accent"],"sources":["../../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import './Banner.css';\n\nimport { IconComponent } from '@consta/icons/Icon';\nimport React, { forwardRef } from 'react';\n\nimport { cnText, Text } from '##/components/Text';\nimport { useTheme } from '##/components/Theme/Theme';\nimport { cnMixFlex } from '##/mixs/MixFlex';\nimport { cnMixSpace, MixSpaceProps, Space } from '##/mixs/MixSpace';\nimport { cn } from '##/utils/bem';\nimport { isNotNil, isString } from '##/utils/type-guards';\nimport { PropsWithJsxAttributes } from '##/utils/types/PropsWithJsxAttributes';\n\nexport const bannerPropSize = ['xs', 's', 'm', 'l'] as const;\nexport type BannerPropSize = typeof bannerPropSize[number];\nexport const bannerPropSizeDefault: BannerPropSize = bannerPropSize[2]; // 'm'\n\nexport const bannerPropView = ['filled', 'ghost', 'transparent'] as const;\nexport type BannerPropView = typeof bannerPropView[number];\nexport const bannerPropViewDefault: BannerPropView = bannerPropView[0]; // 'filled'\n\nexport const bannerPropStatus = [\n  'normal',\n  'warning',\n  'alert',\n  'success',\n  'system',\n] as const;\nexport type BannerPropStatus = typeof bannerPropStatus[number];\nexport const bannerPropStatusDefault: BannerPropStatus = bannerPropStatus[0]; // 'normal'\n\nexport const bannerPropForm = ['default', 'round', 'brick'] as const;\nexport type BannerPropForm = typeof bannerPropForm[number];\nexport const bannerPropFormDefault: BannerPropForm = bannerPropForm[0]; // 'default'\n\nexport type BannerProps = PropsWithJsxAttributes<{\n  leftSide?: React.ReactNode;\n  rightSide?: React.ReactNode;\n  icon?: IconComponent;\n  size?: BannerPropSize;\n  view?: BannerPropView;\n  space?: MixSpaceProps;\n  itemsGap?: Space | [Space, Space];\n  status?: BannerPropStatus;\n  form?: BannerPropForm;\n}>;\n\nexport const cnBanner = cn('Banner');\n\nconst SlotWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => (\n  <div className={cnBanner('Slot')}>{children}</div>\n);\n\nconst renderSlot = (slot: React.ReactNode, index: number, position: number) => {\n  if (isString(slot)) {\n    return (\n      <SlotWrapper key={cnBanner('Slot', { index, position })}>\n        <Text\n          className={cnBanner('Text')}\n          view=\"primary\"\n          weight={index === 0 && position === 0 ? 'bold' : undefined}\n          lineHeight=\"m\"\n        >\n          {slot}\n        </Text>\n      </SlotWrapper>\n    );\n  }\n\n  return (\n    <SlotWrapper key={cnBanner('Slot', { index, position })}>\n      {slot}\n    </SlotWrapper>\n  );\n};\n\nconst renderSlots = (slot: React.ReactNode, position: number) => {\n  if (Array.isArray(slot)) {\n    return slot\n      .filter(isNotNil)\n      .map((item, index) => renderSlot(item, index, position));\n  }\n  return renderSlots([slot], position);\n};\n\nconst getGap = (gap: Space | [Space, Space], index: number) => {\n  if (Array.isArray(gap)) {\n    return gap[index];\n  }\n  return gap;\n};\n\nconst textSizeMap: Record<BannerPropSize, 'xs' | 's' | 'm' | 'l'> = {\n  xs: 's',\n  s: 's',\n  m: 'm',\n  l: 'l',\n};\n\nconst controlSizeMap: Record<BannerPropSize, 'xs' | 's' | 'm'> = {\n  xs: 'xs',\n  s: 's',\n  m: 's',\n  l: 'm',\n};\n\n/**\n * Компонент Banner, отображающий содержимое слева и справа.\n * Поддерживает иконки, размеры, виды, статусы и формы.\n *\n * @property {React.ReactNode} [leftSide] - Содержимое на левой стороне.\n * @property {React.ReactNode} [rightSide] - Содержимое на правой стороне.\n * @property {IconComponent} [icon] - Иконка.\n * @property {BannerPropSize} [size] - Размер компонента.\n * @property {BannerPropView} [view] - Визуальный стиль.\n * @property {MixSpaceProps} [space] - Параметры отступов.\n * @property {Space | [Space, Space]} [itemsGap] - Отступы между элементами.\n * @property {BannerPropStatus} [status] - Статус (цветовая схема).\n * @property {BannerPropForm} [form] - Форма компонента.\n */\n\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>((props, ref) => {\n  const {\n    leftSide,\n    rightSide,\n    icon: Icon,\n    size = bannerPropSizeDefault,\n    view = bannerPropViewDefault,\n    className,\n    space,\n    itemsGap = 's',\n    status = bannerPropStatusDefault,\n    style,\n    form = bannerPropFormDefault,\n    ...otherProps\n  } = props;\n\n  const { themeClassNames } = useTheme();\n\n  const leftSlots = renderSlots(\n    [\n      Icon ? <Icon className={cnBanner('Icon')} /> : null,\n      ...(Array.isArray(leftSide) ? leftSide : [leftSide]),\n    ],\n    0,\n  );\n\n  const rightSlots = renderSlots(rightSide, 1);\n\n  return (\n    <div\n      {...otherProps}\n      className={cnBanner({ view, form, size }, [\n        cnMixFlex({\n          justify:\n            rightSlots.length && !leftSlots.length\n              ? 'flex-end'\n              : 'space-between',\n          align: 'center',\n          gap: 'm',\n        }),\n        cnMixSpace(space || { pH: size, pV: 'xs' }),\n        cnText({ size: textSizeMap[size] }),\n        status !== 'system' && view === 'filled'\n          ? themeClassNames.color.accent\n          : undefined,\n        className,\n      ])}\n      style={{\n        ...style,\n        ['--banner-bg-color' as string]: `var(--color-bg-${status})`,\n        ['--banner-inner-height' as string]: `var(--control-height-${controlSizeMap[size]})`,\n      }}\n      ref={ref}\n    >\n      {leftSlots.length ? (\n        <div\n          className={cnMixFlex({ gap: getGap(itemsGap, 0), align: 'center' })}\n        >\n          {leftSlots}\n        </div>\n      ) : undefined}\n      {rightSlots.length ? (\n        <div\n          className={cnMixFlex({ gap: getGap(itemsGap, 1), align: 'center' })}\n        >\n          {rightSlots}\n        </div>\n      ) : undefined}\n    </div>\n  );\n});\n"],"mappings":"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"}

package/__internal__/src/components/FieldComponents/FieldWrapper/FieldWrapper.js

@@ -1,2 +1,2 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className","children","label","size","labelIcon","caption","required","status","side","counter","labelPosition","labelIconRef","as","labelHtmlFor"];import React from"react";import{Text}from"../../Text";import{cnMixFlex}from"../../../mixs/MixFlex";import{isString}from"../../../utils/type-guards";import{forwardRefWithAs}from"../../../utils/types/PropsWithAsAttributes";import{FieldCaption}from"../FieldCaption";import{FieldLabel}from"../FieldLabel";import{cnFieldWrapper}from"./cnFieldWrapper";import{directionMap,spaceMap}from"./helpers";var renderCounter=function(a){return React.createElement(Text,{className:cnFieldWrapper("Counter"),view:"ghost",size:"xs",lineHeight:"m"},Array.isArray(a)?a.join("/"):a)},renderSide=function(a){return isString(a)?React.createElement("span",{className:cnFieldWrapper("SideText")},a):a};export var FieldWrapper=forwardRefWithAs(function(a,b){var c,d=a.className,e=a.children,f=a.label,g=a.size,h=void 0===g?"m":g,i=a.labelIcon,j=a.caption,k=a.required,l=a.status,m=a.side,n=a.counter,o=a.labelPosition,p=void 0===o?"top":o,q=a.labelIconRef,r=a.as,s=void 0===r?"div":r,t=a.labelHtmlFor,u=_objectWithoutProperties(a,_excluded),v=spaceMap[h];return React.createElement(s,Object.assign({},u,{ref:b,className:cnFieldWrapper(null,[cnMixFlex({direction:directionMap[p],gap:"top"===p?v:"s"}),d])}),f&&React.createElement(FieldLabel,Object.assign({size:h,required:k,icon:i,iconRef:q},t?{htmlFor:t,as:"label"}:{}),f),React.createElement("div",{className:cnFieldWrapper("ControlAndCaptionWrapper",[cnMixFlex({gap:v,direction:"column"})])},React.createElement("div",{className:cnFieldWrapper("ControlWrapper",[cnMixFlex({gap:v,direction:"row"})])},React.createElement("div",{className:cnFieldWrapper("Control")},e),m&&React.createElement("div",{className:cnFieldWrapper("Side",[cnMixFlex({align:"center",justify:"center"})]),style:(c={},_defineProperty(c,"--field-wrapper-side-text-size","var(--control-text-size-".concat(h,")")),_defineProperty(c,"--field-wrapper-side-height","var(--control-height-".concat(h,")")),c)},renderSide(m))),(j||n)&&React.createElement("div",{className:cnMixFlex({direction:"row",gap:v,justify:"space-between"})},j&&React.createElement(FieldCaption,{className:cnFieldWrapper("Caption"),status:l},j),n&&renderCounter(n))))});
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className","children","label","size","labelIcon","caption","required","status","side","counter","counterStatus","labelPosition","labelIconRef","as","labelHtmlFor"];import React from"react";import{Text}from"../../Text";import{cnMixFlex}from"../../../mixs/MixFlex";import{isString}from"../../../utils/type-guards";import{forwardRefWithAs}from"../../../utils/types/PropsWithAsAttributes";import{FieldCaption}from"../FieldCaption";import{FieldLabel}from"../FieldLabel";import{cnFieldWrapper}from"./cnFieldWrapper";import{directionMap,spaceMap}from"./helpers";var Counter=function(a){var b=a.counter,c=a.status;return React.createElement(Text,{className:cnFieldWrapper("Counter"),view:c||"ghost",size:"xs",lineHeight:"m"},Array.isArray(b)?b.join("/"):b)},renderSide=function(a){return isString(a)?React.createElement("span",{className:cnFieldWrapper("SideText")},a):a};export var FieldWrapper=forwardRefWithAs(function(a,b){var c,d=a.className,e=a.children,f=a.label,g=a.size,h=void 0===g?"m":g,i=a.labelIcon,j=a.caption,k=a.required,l=a.status,m=a.side,n=a.counter,o=a.counterStatus,p=a.labelPosition,q=void 0===p?"top":p,r=a.labelIconRef,s=a.as,t=void 0===s?"div":s,u=a.labelHtmlFor,v=_objectWithoutProperties(a,_excluded),w=spaceMap[h];return React.createElement(t,Object.assign({},v,{ref:b,className:cnFieldWrapper(null,[cnMixFlex({direction:directionMap[q],gap:"top"===q?w:"s"}),d])}),f&&React.createElement(FieldLabel,Object.assign({size:h,required:k,icon:i,iconRef:r},u?{htmlFor:u,as:"label"}:{}),f),React.createElement("div",{className:cnFieldWrapper("ControlAndCaptionWrapper",[cnMixFlex({gap:w,direction:"column"})])},React.createElement("div",{className:cnFieldWrapper("ControlWrapper",[cnMixFlex({gap:w,direction:"row"})])},React.createElement("div",{className:cnFieldWrapper("Control")},e),m&&React.createElement("div",{className:cnFieldWrapper("Side",[cnMixFlex({align:"center",justify:"center"})]),style:(c={},_defineProperty(c,"--field-wrapper-side-text-size","var(--control-text-size-".concat(h,")")),_defineProperty(c,"--field-wrapper-side-height","var(--control-height-".concat(h,")")),c)},renderSide(m))),(j||n)&&React.createElement("div",{className:cnMixFlex({direction:"row",gap:w,justify:j?"space-between":"flex-end"})},j&&React.createElement(FieldCaption,{className:cnFieldWrapper("Caption"),status:l},j),n&&React.createElement(Counter,{counter:n,status:o}))))});
 //# sourceMappingURL=FieldWrapper.js.map

package/__internal__/src/components/FieldComponents/FieldWrapper/FieldWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldWrapper.js","names":["React","Text","cnMixFlex","isString","forwardRefWithAs","FieldCaption","FieldLabel","cnFieldWrapper","directionMap","spaceMap","renderCounter","counter","Array","isArray","join","renderSide","side","FieldWrapper","props","ref","className","children","label","size","labelIcon","caption","required","status","labelPosition","labelIconRef","as","labelHtmlFor","otherProps","gap","direction","htmlFor","align","justify"],"sources":["../../../../../../src/components/FieldComponents/FieldWrapper/FieldWrapper.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Text } from '##/components/Text';\nimport { cnMixFlex } from '##/mixs/MixFlex';\nimport { isString } from '##/utils/type-guards';\nimport { forwardRefWithAs } from '##/utils/types/PropsWithAsAttributes';\n\nimport { FieldCaption } from '../FieldCaption';\nimport { FieldLabel } from '../FieldLabel';\nimport { cnFieldWrapper } from './cnFieldWrapper';\nimport { directionMap, spaceMap } from './helpers';\nimport { FieldWrapperProps } from './types';\n\ntype Counter = string | number | [string | number, string | number];\n\nconst renderCounter = (counter: Counter) => {\n  return (\n    <Text\n      className={cnFieldWrapper('Counter')}\n      view=\"ghost\"\n      size=\"xs\"\n      lineHeight=\"m\"\n    >\n      {Array.isArray(counter) ? counter.join('/') : counter}\n    </Text>\n  );\n};\n\nconst renderSide = (side: React.ReactNode) => {\n  if (isString(side)) {\n    return <span className={cnFieldWrapper('SideText')}>{side}</span>;\n  }\n  return side;\n};\n\nexport const FieldWrapper = forwardRefWithAs<FieldWrapperProps>(\n  (props, ref) => {\n    const {\n      className,\n      children,\n      label,\n      size = 'm',\n      labelIcon,\n      caption,\n      required,\n      status,\n      side,\n      counter,\n      labelPosition = 'top',\n      labelIconRef,\n      as = 'div',\n      labelHtmlFor,\n      ...otherProps\n    } = props;\n\n    const Tag = as as string;\n    const gap = spaceMap[size];\n\n    return (\n      <Tag\n        {...otherProps}\n        ref={ref}\n        className={cnFieldWrapper(null, [\n          cnMixFlex({\n            direction: directionMap[labelPosition],\n            gap: labelPosition === 'top' ? gap : 's',\n          }),\n          className,\n        ])}\n      >\n        {label && (\n          <FieldLabel\n            size={size}\n            required={required}\n            icon={labelIcon}\n            iconRef={labelIconRef}\n            {...(labelHtmlFor\n              ? {\n                  htmlFor: labelHtmlFor,\n                  as: 'label',\n                }\n              : {})}\n          >\n            {label}\n          </FieldLabel>\n        )}\n        <div\n          className={cnFieldWrapper('ControlAndCaptionWrapper', [\n            cnMixFlex({ gap, direction: 'column' }),\n          ])}\n        >\n          <div\n            className={cnFieldWrapper('ControlWrapper', [\n              cnMixFlex({ gap, direction: 'row' }),\n            ])}\n          >\n            <div className={cnFieldWrapper('Control')}>{children}</div>\n            {side && (\n              <div\n                className={cnFieldWrapper('Side', [\n                  cnMixFlex({ align: 'center', justify: 'center' }),\n                ])}\n                style={{\n                  ['--field-wrapper-side-text-size' as string]: `var(--control-text-size-${size})`,\n                  ['--field-wrapper-side-height' as string]: `var(--control-height-${size})`,\n                }}\n              >\n                {renderSide(side)}\n              </div>\n            )}\n          </div>\n          {(caption || counter) && (\n            <div\n              className={cnMixFlex({\n                direction: 'row',\n                gap,\n                justify: 'space-between',\n              })}\n            >\n              {caption && (\n                <FieldCaption\n                  className={cnFieldWrapper('Caption')}\n                  status={status}\n                >\n                  {caption}\n                </FieldCaption>\n              )}\n              {counter && renderCounter(counter)}\n            </div>\n          )}\n        </div>\n      </Tag>\n    );\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"FieldWrapper.js","names":["React","Text","cnMixFlex","isString","forwardRefWithAs","FieldCaption","FieldLabel","cnFieldWrapper","directionMap","spaceMap","Counter","counter","status","Array","isArray","join","renderSide","side","FieldWrapper","props","ref","className","children","label","size","labelIcon","caption","required","counterStatus","labelPosition","labelIconRef","as","labelHtmlFor","otherProps","gap","direction","htmlFor","align","justify"],"sources":["../../../../../../src/components/FieldComponents/FieldWrapper/FieldWrapper.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Text } from '##/components/Text';\nimport { cnMixFlex } from '##/mixs/MixFlex';\nimport { isString } from '##/utils/type-guards';\nimport { forwardRefWithAs } from '##/utils/types/PropsWithAsAttributes';\n\nimport { FieldCaption } from '../FieldCaption';\nimport { FieldLabel } from '../FieldLabel';\nimport { cnFieldWrapper } from './cnFieldWrapper';\nimport { directionMap, spaceMap } from './helpers';\nimport { FieldWrapperProps } from './types';\n\ntype Counter = string | number | [string | number, string | number];\n\nconst Counter: React.FC<{ counter: Counter; status?: 'alert' }> = ({\n  counter,\n  status,\n}) => {\n  return (\n    <Text\n      className={cnFieldWrapper('Counter')}\n      view={status || 'ghost'}\n      size=\"xs\"\n      lineHeight=\"m\"\n    >\n      {Array.isArray(counter) ? counter.join('/') : counter}\n    </Text>\n  );\n};\n\nconst renderSide = (side: React.ReactNode) => {\n  if (isString(side)) {\n    return <span className={cnFieldWrapper('SideText')}>{side}</span>;\n  }\n  return side;\n};\n\nexport const FieldWrapper = forwardRefWithAs<FieldWrapperProps>(\n  (props, ref) => {\n    const {\n      className,\n      children,\n      label,\n      size = 'm',\n      labelIcon,\n      caption,\n      required,\n      status,\n      side,\n      counter,\n      counterStatus,\n      labelPosition = 'top',\n      labelIconRef,\n      as = 'div',\n      labelHtmlFor,\n      ...otherProps\n    } = props;\n\n    const Tag = as as string;\n    const gap = spaceMap[size];\n\n    return (\n      <Tag\n        {...otherProps}\n        ref={ref}\n        className={cnFieldWrapper(null, [\n          cnMixFlex({\n            direction: directionMap[labelPosition],\n            gap: labelPosition === 'top' ? gap : 's',\n          }),\n          className,\n        ])}\n      >\n        {label && (\n          <FieldLabel\n            size={size}\n            required={required}\n            icon={labelIcon}\n            iconRef={labelIconRef}\n            {...(labelHtmlFor\n              ? {\n                  htmlFor: labelHtmlFor,\n                  as: 'label',\n                }\n              : {})}\n          >\n            {label}\n          </FieldLabel>\n        )}\n        <div\n          className={cnFieldWrapper('ControlAndCaptionWrapper', [\n            cnMixFlex({ gap, direction: 'column' }),\n          ])}\n        >\n          <div\n            className={cnFieldWrapper('ControlWrapper', [\n              cnMixFlex({ gap, direction: 'row' }),\n            ])}\n          >\n            <div className={cnFieldWrapper('Control')}>{children}</div>\n            {side && (\n              <div\n                className={cnFieldWrapper('Side', [\n                  cnMixFlex({ align: 'center', justify: 'center' }),\n                ])}\n                style={{\n                  ['--field-wrapper-side-text-size' as string]: `var(--control-text-size-${size})`,\n                  ['--field-wrapper-side-height' as string]: `var(--control-height-${size})`,\n                }}\n              >\n                {renderSide(side)}\n              </div>\n            )}\n          </div>\n          {(caption || counter) && (\n            <div\n              className={cnMixFlex({\n                direction: 'row',\n                gap,\n                justify: !caption ? 'flex-end' : 'space-between',\n              })}\n            >\n              {caption && (\n                <FieldCaption\n                  className={cnFieldWrapper('Caption')}\n                  status={status}\n                >\n                  {caption}\n                </FieldCaption>\n              )}\n              {counter && <Counter counter={counter} status={counterStatus} />}\n            </div>\n          )}\n        </div>\n      </Tag>\n    );\n  },\n);\n"],"mappings":"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"}

package/__internal__/src/components/FieldComponents/FieldWrapper/types.d.ts

@@ -15,5 +15,6 @@ export type FieldWrapperProps = {
     status?: FieldPropStatus;
     side?: React.ReactNode;
     counter?: Counter;
+    counterStatus?: 'alert';
 };
 export {};

package/__internal__/src/components/FieldComponents/FieldWrapper/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../../../src/components/FieldComponents/FieldWrapper/types.ts"],"sourcesContent":["import { IconComponent } from '@consta/icons/Icon';\nimport React from 'react';\n\nimport { FieldPropSize, FieldPropStatus } from '../types';\n\ntype Counter = string | number | [string | number, string | number];\n\nexport type FieldWrapperProps = {\n  children: React.ReactNode;\n  size?: FieldPropSize;\n  label?: string;\n  labelIcon?: IconComponent;\n  labelIconRef?: React.Ref<HTMLSpanElement>;\n  labelPosition?: 'top' | 'left';\n  labelHtmlFor?: string;\n  caption?: string;\n  required?: boolean;\n  status?: FieldPropStatus;\n  side?: React.ReactNode;\n  counter?: Counter;\n};\n"],"mappings":""}
+{"version":3,"file":"types.js","names":[],"sources":["../../../../../../src/components/FieldComponents/FieldWrapper/types.ts"],"sourcesContent":["import { IconComponent } from '@consta/icons/Icon';\nimport React from 'react';\n\nimport { FieldPropSize, FieldPropStatus } from '../types';\n\ntype Counter = string | number | [string | number, string | number];\n\nexport type FieldWrapperProps = {\n  children: React.ReactNode;\n  size?: FieldPropSize;\n  label?: string;\n  labelIcon?: IconComponent;\n  labelIconRef?: React.Ref<HTMLSpanElement>;\n  labelPosition?: 'top' | 'left';\n  labelHtmlFor?: string;\n  caption?: string;\n  required?: boolean;\n  status?: FieldPropStatus;\n  side?: React.ReactNode;\n  counter?: Counter;\n  counterStatus?: 'alert';\n};\n"],"mappings":""}

package/__internal__/src/components/Modal/Modal.css

@@ -1 +1 @@
-.Modal{--modal-window-animate-space:var(--space-xl);bottom:0;display:flex;justify-content:center;left:0;padding:var(--space-5xl);position:fixed;right:0;top:0}.Modal:not(.Modal_hasOverlay){pointer-events:none}.Modal-Window{background-color:var(--color-bg-default);border-radius:var(--control-radius);box-shadow:var(--shadow-modal);max-height:90%;max-width:90%;min-height:200px;overflow:auto;pointer-events:auto;position:absolute}.Modal-Window_position_center{align-self:safe center}.Modal-Window_position_top{align-self:safe flex-start}.Modal-Overlay{background:var(--color-bg-tone);border:none;height:100%;left:0;padding:0;position:absolute;top:0;transition:.2s;width:100%}.Modal-Overlay_animate_exited,.Modal-Overlay_animate_exiting{opacity:0}.Modal-Overlay_animate_entered,.Modal-Overlay_animate_entering{opacity:1}.Modal-Overlay_animate_entered,.Modal-Overlay_animate_entering,.Modal-Overlay_animate_exiting{transition:opacity .2s}
+.Modal{--modal-window-animate-space:var(--space-xl);--modal-shadow-transparent:0 0 0 transparent,0 0 0 transparent;bottom:0;display:flex;justify-content:center;left:0;padding-bottom:var(--modal-window-offset-prop,5vh);padding-left:var(--modal-window-offset-prop,5vw);padding-right:var(--modal-window-offset-prop,5vw);padding-top:var(--modal-window-offset-prop,5vh);position:fixed;right:0;top:0}.Modal-Window{background-color:var(--color-bg-default);box-shadow:var(--shadow-modal);max-height:calc(100% - var(--modal-window-offset-prop, 5vh)*2);max-width:calc(100% - var(--modal-window-offset-prop, 5vw)*2);overflow:hidden;position:absolute}.Modal-Window_position_center{align-self:safe center}.Modal-Window_position_top{align-self:safe flex-start}.Modal-Window_form_default{border-radius:var(--control-radius)}.Modal-Window_border{border:1px solid var(--color-bg-border)}.Modal-Window_scrollable{height:100%}.Modal-Content,.Modal-Scroll{display:flex;flex:1;flex-direction:column}.Modal-Scroll{height:100%;overflow:auto}.Modal-Overlay{background:var(--color-bg-tone);border:none;height:100%;left:0;padding:0;position:absolute;top:0;transition:.2s;width:100%}.Modal-Overlay_animate_exited,.Modal-Overlay_animate_exiting{opacity:0}.Modal-Overlay_animate_entered,.Modal-Overlay_animate_entering{opacity:1}.Modal-Overlay_animate_entered,.Modal-Overlay_animate_entering,.Modal-Overlay_animate_exiting{transition:opacity .2s}

package/__internal__/src/components/Modal/Modal.d.ts

@@ -1,26 +1,21 @@
 import './Modal.css';
 import React from 'react';
-import { PropsWithHTMLAttributes } from '../../utils/types/PropsWithHTMLAttributes';
-declare const modalPropWidth: readonly ["auto"];
-type ModalPropWidth = typeof modalPropWidth[number];
-declare const modalPropPosition: readonly ["center", "top"];
-type ModalPropPosition = typeof modalPropPosition[number];
-type ModalProps = PropsWithHTMLAttributes<{
+export declare const Modal: React.ForwardRefExoticComponent<{
     isOpen?: boolean;
     onClose?: () => void;
     onOpen?: () => void;
     hasOverlay?: boolean;
-    /** @deprecated use onClickOutside */
     onOverlayClick?: (event: MouseEvent) => void;
     onClickOutside?: (event: MouseEvent) => void;
     onEsc?: (event: KeyboardEvent) => void;
     rootClassName?: string;
-    width?: ModalPropWidth;
-    position?: ModalPropPosition;
+    width?: "auto";
+    position?: "center" | "top";
+    form?: "brick" | "default";
+    border?: boolean;
     children?: React.ReactNode;
-    container?: HTMLDivElement | undefined;
+    container?: HTMLElement | React.RefObject<HTMLElement>;
     afterClose?: () => void;
     refsForExcludeClickOutside?: React.RefObject<HTMLElement>[];
-}, HTMLDivElement>;
-export declare const Modal: React.FC<ModalProps>;
-export {};
+    ignoreOutsideClicksRefs?: React.RefObject<HTMLElement>[];
+} & Omit<React.HTMLAttributes<HTMLDivElement>, "css" | "children" | "form" | "width" | "onClose" | "border" | "position" | "container" | "onClickOutside" | "ignoreOutsideClicksRefs" | "isOpen" | "onEsc" | "onOpen" | "hasOverlay" | "onOverlayClick" | "rootClassName" | "afterClose" | "refsForExcludeClickOutside"> & React.RefAttributes<HTMLDivElement>>;

package/__internal__/src/components/Modal/Modal.js

@@ -1,2 +1,2 @@
-import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["isOpen","onClose","onOpen","hasOverlay","onOverlayClick","onClickOutside","onEsc","className","width","position","children","container","refsForExcludeClickOutside","rootClassName","afterClose","style"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"./Modal.css";import React,{useEffect,useRef}from"react";import{Transition}from"react-transition-group";import{PortalWithTheme,PortalWithThemeConsumer}from"../PortalWithTheme";import{useTheme}from"../Theme/Theme";import{useGlobalKeys}from"../../hooks/useGlobalKeys";import{animateTimeout,cnMixPopoverAnimate}from"../../mixs/MixPopoverAnimate";import{cnMixScrollBar}from"../../mixs/MixScrollBar";import{cn}from"../../utils/bem";var modalPropWidth=["auto"],modalPropWidthDefault=modalPropWidth[0],modalPropPosition=["center","top"],modalPropPositionDefault=modalPropPosition[0],cnModal=cn("Modal");export var Modal=function(a){var b=a.isOpen,c=a.onClose,d=a.onOpen,e=a.hasOverlay,f=void 0===e||e,g=a.onOverlayClick,h=a.onClickOutside,i=a.onEsc,j=a.className,k=a.width,l=void 0===k?modalPropWidthDefault:k,m=a.position,n=void 0===m?modalPropPositionDefault:m,o=a.children,p=a.container,q=void 0===p?window.document.body:p,r=a.refsForExcludeClickOutside,s=a.rootClassName,t=a.afterClose,u=a.style,v=_objectWithoutProperties(a,_excluded),w=useRef(null),x=useRef(null),y=useTheme(),z=y.theme;return useEffect(function(){b?null===d||void 0===d?void 0:d():null===c||void 0===c?void 0:c()},[b]),useGlobalKeys({Escape:function Escape(a){return b&&i&&i(a)}}),React.createElement(Transition,{in:b,unmountOnExit:!0,nodeRef:x,timeout:animateTimeout,onExited:t},function(a){return React.createElement(PortalWithTheme,{preset:z,container:q,className:cnModal({hasOverlay:f},[s]),ref:x,style:"number"==typeof(null===u||void 0===u?void 0:u.zIndex)?{zIndex:u.zIndex}:void 0},f&&React.createElement("div",{className:cnModal("Overlay",{animate:a}),"aria-label":"Overlay"}),React.createElement("div",Object.assign({},v,{style:_objectSpread(_objectSpread({},u),{},{zIndex:void 0}),className:cnModal("Window",{width:l,position:n},[cnMixPopoverAnimate({animate:a}),j,cnMixScrollBar()]),ref:w}),React.createElement(PortalWithThemeConsumer,{onClickOutside:h||g,ignoreClicksInsideRefs:[].concat(_toConsumableArray(r||[]),[w])},o)))})};
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["isOpen","onClose","onOpen","hasOverlay","onOverlayClick","onClickOutside","onEsc","className","width","form","border","position","children","container","refsForExcludeClickOutside","ignoreOutsideClicksRefs","rootClassName","afterClose","style"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"./Modal.css";import React,{forwardRef}from"react";import{Transition}from"react-transition-group";import{PortalWithTheme,PortalWithThemeConsumer}from"../PortalWithTheme";import{animateTimeout,cnMixPopoverAnimate}from"../../mixs/MixPopoverAnimate";import{cnMixScrollBar}from"../../mixs/MixScrollBar";import{cn}from"../../utils/bem";import{withCtx}from"../../utils/state";import{useModal}from"./useModal";var cnModal=cn("Modal");export var Modal=withCtx(forwardRef(function(a,b){var c=a.isOpen,d=a.onClose,e=a.onOpen,f=a.hasOverlay,g=!(void 0!==f)||f,h=a.onOverlayClick,i=a.onClickOutside,j=a.onEsc,k=a.className,l=a.width,m=a.form,n=void 0===m?"default":m,o=a.border,p=a.position,q=void 0===p?"center":p,r=a.children,s=a.container,t=void 0===s?window.document.body:s,u=a.refsForExcludeClickOutside,v=a.ignoreOutsideClicksRefs,w=a.rootClassName,x=a.afterClose,y=a.style,z=_objectWithoutProperties(a,_excluded),A=useModal({ref:b,isOpen:c,onEsc:j,onOpen:e,onClose:d,ignoreOutsideClicksRefs:v||u}),B=A.shadowHeader,C=A.shadowFooter,D=A.scrollable,E=A.theme,F=A.portalRef,G=A.windowRef,H=A.contentRef,I=A.scrollRef,J=A.ignoreOutsideClicksRefs;return React.createElement(Transition,{in:c,unmountOnExit:!0,nodeRef:F,timeout:animateTimeout,onExited:x},function(a){return React.createElement(PortalWithTheme,{preset:E,container:t,className:cnModal({hasOverlay:g},[w]),ref:F,style:_objectSpread(_objectSpread(_objectSpread(_objectSpread({},"number"===(null===y||void 0===y?void 0:y.zIndex)&&{zIndex:y.zIndex}),B&&_defineProperty({},"--modal-layout-header-color-shadow","var(--color-shadow-group-2)")),C&&_defineProperty({},"--modal-layout-footer-color-shadow","var(--color-shadow-group-2)")),(null===y||void 0===y?void 0:y.zIndex)&&_defineProperty({},"--modal-layout-z-index-for-fixed-slot",y.zIndex))},g&&React.createElement("div",{className:cnModal("Overlay",{animate:a}),"aria-label":"Overlay"}),React.createElement("div",Object.assign({},z,{style:_objectSpread(_objectSpread({},y),{},{zIndex:void 0}),className:cnModal("Window",{position:q,form:n,border:o,scrollable:D},[cnMixPopoverAnimate({animate:a}),k]),ref:G}),React.createElement("div",{className:cnModal("Scroll",cnMixScrollBar({size:"s"})),ref:I},React.createElement("div",{className:cnModal("Content"),ref:H},React.createElement(PortalWithThemeConsumer,{onClickOutside:i||h,ignoreClicksInsideRefs:J},r)))))})}));
 //# sourceMappingURL=Modal.js.map

package/__internal__/src/components/Modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","names":["React","useEffect","useRef","Transition","PortalWithTheme","PortalWithThemeConsumer","useTheme","useGlobalKeys","animateTimeout","cnMixPopoverAnimate","cnMixScrollBar","cn","modalPropWidth","modalPropWidthDefault","modalPropPosition","modalPropPositionDefault","cnModal","Modal","props","isOpen","onClose","onOpen","hasOverlay","onOverlayClick","onClickOutside","onEsc","className","width","position","children","container","window","document","body","refsForExcludeClickOutside","rootClassName","afterClose","style","otherProps","ref","portalRef","theme","Escape","e","animate","zIndex"],"sources":["../../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import './Modal.css';\n\nimport React, { useEffect, useRef } from 'react';\nimport { Transition } from 'react-transition-group';\n\nimport {\n  PortalWithTheme,\n  PortalWithThemeConsumer,\n} from '##/components/PortalWithTheme';\nimport { useTheme } from '##/components/Theme/Theme';\nimport { useGlobalKeys } from '##/hooks/useGlobalKeys';\nimport { animateTimeout, cnMixPopoverAnimate } from '##/mixs/MixPopoverAnimate';\nimport { cnMixScrollBar } from '##/mixs/MixScrollBar';\nimport { cn } from '##/utils/bem';\nimport { PropsWithHTMLAttributes } from '##/utils/types/PropsWithHTMLAttributes';\n\nconst modalPropWidth = ['auto'] as const;\ntype ModalPropWidth = typeof modalPropWidth[number];\nconst modalPropWidthDefault: ModalPropWidth = modalPropWidth[0];\n\nconst modalPropPosition = ['center', 'top'] as const;\ntype ModalPropPosition = typeof modalPropPosition[number];\nconst modalPropPositionDefault: ModalPropPosition = modalPropPosition[0];\n\ntype ModalProps = PropsWithHTMLAttributes<\n  {\n    isOpen?: boolean;\n    onClose?: () => void;\n    onOpen?: () => void;\n    hasOverlay?: boolean;\n    /** @deprecated use onClickOutside */\n    onOverlayClick?: (event: MouseEvent) => void;\n    onClickOutside?: (event: MouseEvent) => void;\n    onEsc?: (event: KeyboardEvent) => void;\n    rootClassName?: string;\n    width?: ModalPropWidth;\n    position?: ModalPropPosition;\n    children?: React.ReactNode;\n    container?: HTMLDivElement | undefined;\n    afterClose?: () => void;\n    refsForExcludeClickOutside?: React.RefObject<HTMLElement>[];\n  },\n  HTMLDivElement\n>;\n\nconst cnModal = cn('Modal');\n\nexport const Modal: React.FC<ModalProps> = (props) => {\n  const {\n    isOpen,\n    onClose,\n    onOpen,\n    hasOverlay = true,\n    onOverlayClick,\n    onClickOutside,\n    onEsc,\n    className,\n    width = modalPropWidthDefault,\n    position = modalPropPositionDefault,\n    children,\n    container = window.document.body,\n    refsForExcludeClickOutside,\n    rootClassName,\n    afterClose,\n    style,\n    ...otherProps\n  } = props;\n\n  const ref = useRef<HTMLDivElement | null>(null);\n  const portalRef = useRef<HTMLDivElement | null>(null);\n  const { theme } = useTheme();\n\n  useEffect(() => {\n    if (isOpen) {\n      onOpen?.();\n    } else {\n      onClose?.();\n    }\n  }, [isOpen]);\n\n  useGlobalKeys({\n    Escape: (e: KeyboardEvent) => isOpen && onEsc && onEsc(e),\n  });\n\n  return (\n    <Transition\n      in={isOpen}\n      unmountOnExit\n      nodeRef={portalRef}\n      timeout={animateTimeout}\n      onExited={afterClose}\n    >\n      {(animate) => (\n        <PortalWithTheme\n          preset={theme}\n          container={container}\n          className={cnModal({ hasOverlay }, [rootClassName])}\n          ref={portalRef}\n          style={\n            typeof style?.zIndex === 'number'\n              ? { zIndex: style.zIndex }\n              : undefined\n          }\n        >\n          {hasOverlay && (\n            <div\n              className={cnModal('Overlay', { animate })}\n              aria-label=\"Overlay\"\n            />\n          )}\n          <div\n            {...otherProps}\n            style={{\n              ...style,\n              zIndex: undefined,\n            }}\n            className={cnModal('Window', { width, position }, [\n              cnMixPopoverAnimate({ animate }),\n              className,\n              cnMixScrollBar(),\n            ])}\n            ref={ref}\n          >\n            <PortalWithThemeConsumer\n              onClickOutside={onClickOutside || onOverlayClick}\n              ignoreClicksInsideRefs={[\n                ...(refsForExcludeClickOutside || []),\n                ref,\n              ]}\n            >\n              {children}\n            </PortalWithThemeConsumer>\n          </div>\n        </PortalWithTheme>\n      )}\n    </Transition>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Modal.js","names":["React","forwardRef","Transition","PortalWithTheme","PortalWithThemeConsumer","animateTimeout","cnMixPopoverAnimate","cnMixScrollBar","cn","withCtx","useModal","cnModal","Modal","props","ref","isOpen","onClose","onOpen","hasOverlay","onOverlayClick","onClickOutside","onEsc","className","width","form","border","position","children","container","window","document","body","refsForExcludeClickOutside","ignoreOutsideClicksRefsProp","ignoreOutsideClicksRefs","rootClassName","afterClose","style","otherProps","shadowHeader","shadowFooter","scrollable","theme","portalRef","windowRef","contentRef","scrollRef","animate","zIndex","size"],"sources":["../../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import './Modal.css';\n\nimport React, { forwardRef } from 'react';\nimport { Transition } from 'react-transition-group';\n\nimport {\n  PortalWithTheme,\n  PortalWithThemeConsumer,\n} from '##/components/PortalWithTheme';\nimport { animateTimeout, cnMixPopoverAnimate } from '##/mixs/MixPopoverAnimate';\nimport { cnMixScrollBar } from '##/mixs/MixScrollBar';\nimport { cn } from '##/utils/bem';\nimport { withCtx } from '##/utils/state';\n\nimport { ModalProps } from './types';\nimport { useModal } from './useModal';\n\nconst cnModal = cn('Modal');\n\nexport const Modal = withCtx(\n  forwardRef<HTMLDivElement, ModalProps>((props, ref) => {\n    const {\n      isOpen,\n      onClose,\n      onOpen,\n      hasOverlay = true,\n      onOverlayClick,\n      onClickOutside,\n      onEsc,\n      className,\n      width,\n      form = 'default',\n      border,\n      position = 'center',\n      children,\n      container = window.document.body,\n      refsForExcludeClickOutside,\n      ignoreOutsideClicksRefs: ignoreOutsideClicksRefsProp,\n      rootClassName,\n      afterClose,\n      style,\n      ...otherProps\n    } = props;\n\n    const {\n      shadowHeader,\n      shadowFooter,\n      scrollable,\n      theme,\n      portalRef,\n      windowRef,\n      contentRef,\n      scrollRef,\n      ignoreOutsideClicksRefs,\n    } = useModal({\n      ref,\n      isOpen,\n      onEsc,\n      onOpen,\n      onClose,\n      ignoreOutsideClicksRefs:\n        ignoreOutsideClicksRefsProp || refsForExcludeClickOutside,\n    });\n\n    return (\n      <Transition\n        in={isOpen}\n        unmountOnExit\n        nodeRef={portalRef}\n        timeout={animateTimeout}\n        onExited={afterClose}\n      >\n        {(animate) => (\n          <PortalWithTheme\n            preset={theme}\n            container={container}\n            className={cnModal({ hasOverlay }, [rootClassName])}\n            ref={portalRef}\n            style={{\n              ...(style?.zIndex === 'number' && {\n                zIndex: style.zIndex,\n              }),\n              ...(shadowHeader && {\n                ['--modal-layout-header-color-shadow' as string]:\n                  'var(--color-shadow-group-2)',\n              }),\n              ...(shadowFooter && {\n                ['--modal-layout-footer-color-shadow' as string]:\n                  'var(--color-shadow-group-2)',\n              }),\n              ...(style?.zIndex && {\n                ['--modal-layout-z-index-for-fixed-slot' as string]:\n                  style.zIndex,\n              }),\n            }}\n          >\n            {hasOverlay && (\n              <div\n                className={cnModal('Overlay', { animate })}\n                aria-label=\"Overlay\"\n              />\n            )}\n            <div\n              {...otherProps}\n              style={{\n                ...style,\n                zIndex: undefined,\n              }}\n              className={cnModal(\n                'Window',\n                { position, form, border, scrollable },\n                [cnMixPopoverAnimate({ animate }), className],\n              )}\n              ref={windowRef}\n            >\n              <div\n                className={cnModal('Scroll', cnMixScrollBar({ size: 's' }))}\n                ref={scrollRef}\n              >\n                <div className={cnModal('Content')} ref={contentRef}>\n                  <PortalWithThemeConsumer\n                    onClickOutside={onClickOutside || onOverlayClick}\n                    ignoreClicksInsideRefs={ignoreOutsideClicksRefs}\n                  >\n                    {children}\n                  </PortalWithThemeConsumer>\n                </div>\n              </div>\n            </div>\n          </PortalWithTheme>\n        )}\n      </Transition>\n    );\n  }),\n);\n"],"mappings":"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"}

package/__internal__/src/components/Modal/ModalHeader/ModalHeader.css

@@ -0,0 +1 @@
+.ModalHeader{position:relative}.ModalHeader_gap{padding-left:calc(var(--space-2xl) + var(--space-xs));padding-right:calc(var(--space-2xl) + var(--space-xs))}.Button.ModalHeader-ButtonClose,.ModalHeader-Icon{flex:none}.Button.ModalHeader-ButtonClose_fixed{position:absolute;right:0;top:0}.ModalHeader-Title{flex:1}.ModalHeader-Title_minHeight{min-height:var(--space-2xl)}.ModalHeader-StatusIcon{background:color-mix(in srgb,var(--modal-status-icon-bg) var(--modal-status-icon-degree-mixing),var(--color-bg-default));border-radius:50%;flex:none;height:var(--modal-header-status-icon-size);width:var(--modal-header-status-icon-size)}.ModalHeader-StatusIcon_size_m{--modal-header-status-icon-size:var(--space-2xl)}.ModalHeader-StatusIcon_size_l{--modal-header-status-icon-size:calc(var(--space-2xl)*2)}

package/__internal__/src/components/Modal/ModalHeader/ModalHeader.d.ts

@@ -0,0 +1,14 @@
+import './ModalHeader.css';
+import { IconComponent } from '@consta/icons/Icon';
+import React from 'react';
+export declare const cnModalHeader: import("@bem-react/classname").ClassNameFormatter;
+type ModalHeaderPropDirection = 'vertical' | 'horizontal';
+export type ModalHeaderPropStatus = 'success' | 'system' | 'normal' | 'warning' | 'alert';
+export declare const ModalHeader: React.ForwardRefExoticComponent<{
+    direction?: ModalHeaderPropDirection;
+    icon?: IconComponent;
+    status?: ModalHeaderPropStatus;
+    onClose?: () => void;
+    size?: "s" | "m" | "l" | "xs";
+} & Omit<React.HTMLAttributes<HTMLDivElement>, "css" | "size" | "status" | "onClose" | "icon" | "direction"> & React.RefAttributes<HTMLDivElement>>;
+export {};

package/__internal__/src/components/Modal/ModalHeader/ModalHeader.js

@@ -0,0 +1,2 @@
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _defineProperty from"@babel/runtime/helpers/defineProperty";var _excluded=["children","className","icon","onClose","direction","size","status"];import"./ModalHeader.css";import{IconClose}from"@consta/icons/IconClose";import React,{forwardRef}from"react";import{Button}from"../../Button";import{Text}from"../../Text";import{cnMixFlex}from"../../../mixs/MixFlex";import{cnMixHitSlop}from"../../../mixs/MixHitSlop";import{cn}from"../../../utils/bem";import{isString}from"../../../utils/type-guards";export var cnModalHeader=cn("ModalHeader");var StatusIcon=function(a){var b,c=a.icon,d=a.status,e=a.size,f=void 0===e?"m":e;return React.createElement(Text,{view:d,className:cnModalHeader("StatusIcon",{status:d,size:f},[cnMixFlex({align:"center",justify:"center"})]),style:d?(b={},_defineProperty(b,"--modal-status-icon-degree-mixing","system"===d?"30%":"10%"),_defineProperty(b,"--modal-status-icon-bg","var(--color-bg-".concat(d,")")),b):void 0},React.createElement(c,{size:"m",view:"system"===d?"secondary":void 0}))},rootFlexProps={horizontal:{direction:"row",gap:"xs"},vertical:{direction:"column",align:"center",justify:"center",gap:"s"}};export var ModalHeader=forwardRef(function(a,b){var c=a.children,d=a.className,e=a.icon,f=a.onClose,g=a.direction,h=void 0===g?"horizontal":g,i=a.size,j=a.status,k=_objectWithoutProperties(a,_excluded);return React.createElement("div",Object.assign({},k,{ref:b,className:cnModalHeader({gap:"vertical"===h&&f&&!e},[d,cnMixFlex(rootFlexProps[h])])}),e&&React.createElement(StatusIcon,{icon:e,status:j,size:"vertical"===h?"l":"m"}),isString(c)?React.createElement(Text,{view:"primary",weight:"semibold",size:i,align:"vertical"===h?"center":void 0,className:cnModalHeader("Title",{minHeight:"horizontal"===h||"vertical"===h&&!e,gap:"vertical"===h&&f&&!e},[cnMixFlex({align:"center"})])},c):c,f&&React.createElement(Button,{className:cnModalHeader("ButtonClose",{fixed:"vertical"===h||!c&&!e},[cnMixHitSlop({mode:"reverseMargin"})]),size:"s",view:"clear",iconLeft:IconClose,onClick:f,form:"round"}))});
+//# sourceMappingURL=ModalHeader.js.map

package/__internal__/src/components/Modal/ModalHeader/ModalHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalHeader.js","names":["IconClose","React","forwardRef","Button","Text","cnMixFlex","cnMixHitSlop","cn","isString","cnModalHeader","StatusIcon","Icon","icon","status","size","align","justify","rootFlexProps","horizontal","direction","gap","vertical","ModalHeader","props","ref","children","className","onClose","otherProps","minHeight","fixed","mode"],"sources":["../../../../../../src/components/Modal/ModalHeader/ModalHeader.tsx"],"sourcesContent":["import './ModalHeader.css';\n\nimport { IconComponent } from '@consta/icons/Icon';\nimport { IconClose } from '@consta/icons/IconClose';\nimport React, { forwardRef } from 'react';\n\nimport { Button } from '##/components/Button';\nimport { Text } from '##/components/Text';\nimport { cnMixFlex, CnMixFlexProps } from '##/mixs/MixFlex';\nimport { cnMixHitSlop } from '##/mixs/MixHitSlop';\nimport { cn } from '##/utils/bem';\nimport { isString } from '##/utils/type-guards';\nimport { PropsWithHTMLAttributes } from '##/utils/types/PropsWithHTMLAttributes';\n\nexport const cnModalHeader = cn('ModalHeader');\n\ntype ModalHeaderPropDirection = 'vertical' | 'horizontal';\n\nexport type ModalHeaderPropStatus =\n  | 'success'\n  | 'system'\n  | 'normal'\n  | 'warning'\n  | 'alert';\n\ntype ModalHeaderProps = PropsWithHTMLAttributes<\n  {\n    direction?: ModalHeaderPropDirection;\n    icon?: IconComponent;\n    status?: ModalHeaderPropStatus;\n    onClose?: () => void;\n    size?: 's' | 'm' | 'l' | 'xs';\n  },\n  HTMLDivElement\n>;\n\nconst StatusIcon: React.FC<{\n  icon: IconComponent;\n  status: ModalHeaderProps['status'];\n  size: 'm' | 'l';\n}> = ({ icon: Icon, status, size = 'm' }) => {\n  return (\n    <Text\n      view={status}\n      className={cnModalHeader('StatusIcon', { status, size }, [\n        cnMixFlex({ align: 'center', justify: 'center' }),\n      ])}\n      style={\n        status\n          ? {\n              ['--modal-status-icon-degree-mixing' as string]:\n                status === 'system' ? '30%' : '10%',\n              ['--modal-status-icon-bg' as string]: `var(--color-bg-${status})`,\n            }\n          : undefined\n      }\n    >\n      <Icon size=\"m\" view={status === 'system' ? 'secondary' : undefined} />\n    </Text>\n  );\n};\n\nconst rootFlexProps: Record<ModalHeaderPropDirection, CnMixFlexProps> = {\n  horizontal: {\n    direction: 'row',\n    gap: 'xs',\n  },\n  vertical: {\n    direction: 'column',\n    align: 'center',\n    justify: 'center',\n    gap: 's',\n  },\n};\n\nexport const ModalHeader = forwardRef<HTMLDivElement, ModalHeaderProps>(\n  (props, ref) => {\n    const {\n      children,\n      className,\n      icon: Icon,\n      onClose,\n      direction = 'horizontal',\n      size,\n      status,\n      ...otherProps\n    } = props;\n\n    return (\n      <div\n        {...otherProps}\n        ref={ref}\n        className={cnModalHeader(\n          { gap: direction === 'vertical' && onClose && !Icon },\n          [className, cnMixFlex(rootFlexProps[direction])],\n        )}\n      >\n        {Icon && (\n          <StatusIcon\n            icon={Icon}\n            status={status}\n            size={direction === 'vertical' ? 'l' : 'm'}\n          />\n        )}\n        {isString(children) ? (\n          <Text\n            view=\"primary\"\n            weight=\"semibold\"\n            size={size}\n            align={direction === 'vertical' ? 'center' : undefined}\n            className={cnModalHeader(\n              'Title',\n              {\n                minHeight:\n                  direction === 'horizontal' ||\n                  (direction === 'vertical' && !Icon),\n                gap: direction === 'vertical' && onClose && !Icon,\n              },\n              [cnMixFlex({ align: 'center' })],\n            )}\n          >\n            {children}\n          </Text>\n        ) : (\n          children\n        )}\n        {onClose && (\n          <Button\n            className={cnModalHeader(\n              'ButtonClose',\n              { fixed: direction === 'vertical' || (!children && !Icon) },\n              [cnMixHitSlop({ mode: 'reverseMargin' })],\n            )}\n            size=\"s\"\n            view=\"clear\"\n            iconLeft={IconClose}\n            onClick={onClose}\n            form=\"round\"\n          />\n        )}\n      </div>\n    );\n  },\n);\n"],"mappings":"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"}

package/__internal__/src/components/Modal/ModalHeader/index.d.ts

@@ -0,0 +1 @@
+export * from './ModalHeader';

package/__internal__/src/components/Modal/ModalHeader/index.js

@@ -0,0 +1,2 @@
+export*from"./ModalHeader";
+//# sourceMappingURL=index.js.map

package/__internal__/src/components/Modal/ModalHeader/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../../src/components/Modal/ModalHeader/index.ts"],"sourcesContent":["export * from './ModalHeader';\n"],"mappings":"AAAA"}

package/__internal__/src/components/Modal/ModalLayout/ModalLayout.css

@@ -0,0 +1,5 @@
+.ModalLayout{display:flex;flex:1;flex-direction:column;justify-content:space-between}.ModalLayout-Slot{background-color:var(--color-bg-default);transition:box-shadow .3s}.ModalLayout-Slot_border_top{box-shadow:0 1px 0 0 var(--color-bg-border) inset,0 -2px 3px var(--modal-layout-slot-color-shadow,transparent);padding-top:1px}.ModalLayout-Slot_border_top[class*=MixSpace_pT]{padding-top:calc(var(--space-padding-top) + 1px)}.ModalLayout-Slot_border_bottom{box-shadow:0 -1px 0 0 var(--color-bg-border) inset,0 2px 3px var(--modal-layout-slot-color-shadow,transparent);padding-bottom:1px}.ModalLayout-Slot_border_bottom[class*=MixSpace_pB]{padding-bottom:calc(var(--space-padding-bottom) + 1px)}.ModalLayout-Slot_fixed_top{--modal-layout-slot-color-shadow:var(
+            --modal-layout-header-color-shadow
+          );top:0}.ModalLayout-Slot_fixed_bottom,.ModalLayout-Slot_fixed_top{position:sticky;z-index:calc(var(--modal-layout-z-index-for-fixed-slot) + 1)}.ModalLayout-Slot_fixed_bottom{--modal-layout-slot-color-shadow:var(
+            --modal-layout-footer-color-shadow
+          );bottom:0}.ModalLayout-Slot_stretch{flex:1}

package/__internal__/src/components/Modal/ModalLayout/ModalLayout.d.ts

@@ -0,0 +1,10 @@
+import './ModalLayout.css';
+import React from 'react';
+import { MixSpaceProps } from '../../../mixs/MixSpace';
+export declare const cnModalLayout: import("@bem-react/classname").ClassNameFormatter;
+export declare const ModalLayout: React.ForwardRefExoticComponent<{
+    children?: React.ReactNode;
+    fixed?: boolean | [boolean, boolean];
+    border?: boolean | [boolean, boolean];
+    space?: MixSpaceProps | (MixSpaceProps | undefined)[];
+} & Omit<React.HTMLAttributes<HTMLDivElement>, "css" | "children" | "fixed" | "border" | "space"> & React.RefAttributes<HTMLDivElement>>;

package/__internal__/src/components/Modal/ModalLayout/ModalLayout.js

@@ -0,0 +1,2 @@
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["children","className","border","space","fixed"];import"./ModalLayout.css";import React,{forwardRef}from"react";import{cnMixSpace}from"../../../mixs/MixSpace";import{cn}from"../../../utils/bem";import{isNotNil}from"../../../utils/type-guards";export var cnModalLayout=cn("ModalLayout");var getSlotProp=function(a,b){return Array.isArray(a)?a[b]:a},childrenToArray=function(a){return(Array.isArray(a)?a:[a]).filter(isNotNil)},getSlotPropFirstOrLast=function(a,b,c,d){var e=c.length;return 0===b?getSlotProp(a,0)?d[0]:void 0:b===e-1?getSlotProp(a,1)?d[1]:void 0:void 0};export var ModalLayout=forwardRef(function(a,b){var c=a.children,d=a.className,e=a.border,f=a.space,g=a.fixed,h=_objectWithoutProperties(a,_excluded),i=childrenToArray(c);return React.createElement("div",Object.assign({},h,{ref:b,className:cnModalLayout(null,[d])}),i.map(function(a,b){return React.createElement("div",{key:b,className:cnModalLayout("Slot",{fixed:getSlotPropFirstOrLast(g,b,i,["top","bottom"]),border:getSlotPropFirstOrLast(e,b,i,["bottom ","top"]),stretch:b===i.length-2&&getSlotProp(g,1)||b===i.length-1&&!getSlotProp(g,1)},[cnMixSpace(getSlotProp(f,b))])},a)}))});
+//# sourceMappingURL=ModalLayout.js.map

package/__internal__/src/components/Modal/ModalLayout/ModalLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalLayout.js","names":["React","forwardRef","cnMixSpace","cn","isNotNil","cnModalLayout","getSlotProp","prop","index","Array","isArray","childrenToArray","children","filter","getSlotPropFirstOrLast","border","slots","value","length","ModalLayout","props","ref","className","space","fixed","otherProps","map","child","stretch"],"sources":["../../../../../../src/components/Modal/ModalLayout/ModalLayout.tsx"],"sourcesContent":["import './ModalLayout.css';\n\nimport React, { forwardRef } from 'react';\n\nimport { cnMixSpace, MixSpaceProps } from '##/mixs/MixSpace';\nimport { cn } from '##/utils/bem';\nimport { isNotNil } from '##/utils/type-guards';\nimport { PropsWithHTMLAttributes } from '##/utils/types/PropsWithHTMLAttributes';\n\nexport const cnModalLayout = cn('ModalLayout');\n\ntype ModalLayoutProps = PropsWithHTMLAttributes<\n  {\n    children?: React.ReactNode;\n    fixed?: boolean | [boolean, boolean];\n    border?: boolean | [boolean, boolean];\n    space?: MixSpaceProps | (MixSpaceProps | undefined)[];\n  },\n  HTMLDivElement\n>;\n\nconst getSlotProp = <T,>(\n  prop: T | (T | undefined)[] | undefined,\n  index: number,\n) => (Array.isArray(prop) ? prop[index] : prop);\n\nconst childrenToArray = (children: React.ReactNode): React.ReactNode[] =>\n  (Array.isArray(children) ? children : [children]).filter(isNotNil);\n\nconst getSlotPropFirstOrLast = (\n  border: boolean | [boolean, boolean] | undefined,\n  index: number,\n  slots: React.ReactNode[],\n  value: [string, string],\n) => {\n  const { length } = slots;\n  if (index === 0) {\n    return getSlotProp(border, 0) ? value[0] : undefined;\n  }\n\n  if (index === length - 1) {\n    return getSlotProp(border, 1) ? value[1] : undefined;\n  }\n};\n\nexport const ModalLayout = forwardRef<HTMLDivElement, ModalLayoutProps>(\n  (props, ref) => {\n    const { children, className, border, space, fixed, ...otherProps } = props;\n\n    const slots = childrenToArray(children);\n\n    return (\n      <div\n        {...otherProps}\n        ref={ref}\n        className={cnModalLayout(null, [className])}\n      >\n        {slots.map((child, index) => (\n          <div\n            key={index}\n            className={cnModalLayout(\n              'Slot',\n              {\n                fixed: getSlotPropFirstOrLast(fixed, index, slots, [\n                  'top',\n                  'bottom',\n                ]),\n                border: getSlotPropFirstOrLast(border, index, slots, [\n                  'bottom ',\n                  'top',\n                ]),\n                stretch:\n                  (index === slots.length - 2 && getSlotProp(fixed, 1)) ||\n                  (index === slots.length - 1 && !getSlotProp(fixed, 1)),\n              },\n              [cnMixSpace(getSlotProp(space, index))],\n            )}\n          >\n            {child}\n          </div>\n        ))}\n      </div>\n    );\n  },\n);\n"],"mappings":"qJAAA,0BAEA,MAAOA,MAAP,EAAgBC,UAAhB,KAAkC,OAAlC,CAEA,OAASC,UAAT,8BACA,OAASC,EAAT,0BACA,OAASC,QAAT,kCAGA,MAAO,IAAMC,cAAa,CAAGF,EAAE,CAAC,aAAD,CAAxB,C,GAYDG,YAAW,CAAG,SAClBC,CADkB,CAElBC,CAFkB,QAGdC,MAAK,CAACC,OAAN,CAAcH,CAAd,EAAsBA,CAAI,CAACC,CAAD,CAA1B,CAAoCD,CAHtB,C,CAKdI,eAAe,CAAG,SAACC,CAAD,QACtB,CAACH,KAAK,CAACC,OAAN,CAAcE,CAAd,EAA0BA,CAA1B,CAAqC,CAACA,CAAD,CAAtC,EAAkDC,MAAlD,CAAyDT,QAAzD,CADsB,C,CAGlBU,sBAAsB,CAAG,SAC7BC,CAD6B,CAE7BP,CAF6B,CAG7BQ,CAH6B,CAI7BC,CAJ6B,CAK1B,CACH,GAAQC,EAAR,CAAmBF,CAAnB,CAAQE,MAAR,CADG,MAEW,EAAV,GAAAV,CAFD,CAGMF,WAAW,CAACS,CAAD,CAAS,CAAT,CAAX,CAAyBE,CAAK,CAAC,CAAD,CAA9B,OAHN,CAMCT,CAAK,GAAKU,CAAM,CAAG,CANpB,CAOMZ,WAAW,CAACS,CAAD,CAAS,CAAT,CAAX,CAAyBE,CAAK,CAAC,CAAD,CAA9B,OAPN,OASJ,C,CAED,MAAO,IAAME,YAAW,CAAGlB,UAAU,CACnC,SAACmB,CAAD,CAAQC,CAAR,CAAgB,IACNT,EADM,CACuDQ,CADvD,CACNR,QADM,CACIU,CADJ,CACuDF,CADvD,CACIE,SADJ,CACeP,CADf,CACuDK,CADvD,CACeL,MADf,CACuBQ,CADvB,CACuDH,CADvD,CACuBG,KADvB,CAC8BC,CAD9B,CACuDJ,CADvD,CAC8BI,KAD9B,CACwCC,CADxC,0BACuDL,CADvD,YAGRJ,CAAK,CAAGL,eAAe,CAACC,CAAD,CAHf,CAKd,MACE,4CACMa,CADN,EAEE,GAAG,CAAEJ,CAFP,CAGE,SAAS,CAAEhB,aAAa,CAAC,IAAD,CAAO,CAACiB,CAAD,CAAP,CAH1B,GAKGN,CAAK,CAACU,GAAN,CAAU,SAACC,CAAD,CAAQnB,CAAR,QACT,4BACE,GAAG,CAAEA,CADP,CAEE,SAAS,CAAEH,aAAa,CACtB,MADsB,CAEtB,CACEmB,KAAK,CAAEV,sBAAsB,CAACU,CAAD,CAAQhB,CAAR,CAAeQ,CAAf,CAAsB,CACjD,KADiD,CAEjD,QAFiD,CAAtB,CAD/B,CAKED,MAAM,CAAED,sBAAsB,CAACC,CAAD,CAASP,CAAT,CAAgBQ,CAAhB,CAAuB,CACnD,SADmD,CAEnD,KAFmD,CAAvB,CALhC,CASEY,OAAO,CACJpB,CAAK,GAAKQ,CAAK,CAACE,MAAN,CAAe,CAAzB,EAA8BZ,WAAW,CAACkB,CAAD,CAAQ,CAAR,CAA1C,EACChB,CAAK,GAAKQ,CAAK,CAACE,MAAN,CAAe,CAAzB,EAA8B,CAACZ,WAAW,CAACkB,CAAD,CAAQ,CAAR,CAX/C,CAFsB,CAetB,CAACtB,UAAU,CAACI,WAAW,CAACiB,CAAD,CAAQf,CAAR,CAAZ,CAAX,CAfsB,CAF1B,EAoBGmB,CApBH,CADS,CAAV,CALH,CA+BH,CAtCkC,CAA9B"}

package/__internal__/src/components/Modal/ModalLayout/index.d.ts

@@ -0,0 +1 @@
+export * from './ModalLayout';

package/__internal__/src/components/Modal/ModalLayout/index.js

@@ -0,0 +1,2 @@
+export*from"./ModalLayout";
+//# sourceMappingURL=index.js.map

package/__internal__/src/components/Modal/ModalLayout/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../../src/components/Modal/ModalLayout/index.ts"],"sourcesContent":["export * from './ModalLayout';\n"],"mappings":"AAAA"}

package/__internal__/src/components/Modal/index.d.ts

@@ -1 +1,4 @@
+export * from './types';
 export * from './Modal';
+export * from './ModalLayout';
+export * from './ModalHeader';

package/__internal__/src/components/Modal/index.js

@@ -1,2 +1,2 @@
-export*from"./Modal";
+export*from"./types";export*from"./Modal";export*from"./ModalLayout";export*from"./ModalHeader";
 //# sourceMappingURL=index.js.map

package/__internal__/src/components/Modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/Modal/index.ts"],"sourcesContent":["export * from './Modal';\n"],"mappings":"AAAA"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/Modal/index.ts"],"sourcesContent":["export * from './types';\nexport * from './Modal';\nexport * from './ModalLayout';\nexport * from './ModalHeader';\n"],"mappings":"AAAA,qBACA,qBACA,2BACA"}

package/__internal__/src/components/Modal/types.d.ts

@@ -0,0 +1,23 @@
+import { PropsWithHTMLAttributes } from '../../utils/types/PropsWithHTMLAttributes';
+export type ModalProps = PropsWithHTMLAttributes<{
+    isOpen?: boolean;
+    onClose?: () => void;
+    onOpen?: () => void;
+    hasOverlay?: boolean;
+    /** @deprecated use onClickOutside */
+    onOverlayClick?: (event: MouseEvent) => void;
+    onClickOutside?: (event: MouseEvent) => void;
+    onEsc?: (event: KeyboardEvent) => void;
+    rootClassName?: string;
+    /** @deprecated use style or className */
+    width?: 'auto';
+    position?: 'center' | 'top';
+    form?: 'brick' | 'default';
+    border?: boolean;
+    children?: React.ReactNode;
+    container?: HTMLElement | React.RefObject<HTMLElement>;
+    afterClose?: () => void;
+    /** @deprecated use ignoreOutsideClicksRefs */
+    refsForExcludeClickOutside?: React.RefObject<HTMLElement>[];
+    ignoreOutsideClicksRefs?: React.RefObject<HTMLElement>[];
+}, HTMLDivElement>;

package/__internal__/src/components/Modal/types.js

@@ -0,0 +1,2 @@
+export{};
+//# sourceMappingURL=types.js.map

package/__internal__/src/components/Modal/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","names":[],"sources":["../../../../../src/components/Modal/types.ts"],"sourcesContent":["import { PropsWithHTMLAttributes } from '##/utils/types/PropsWithHTMLAttributes';\n\nexport type ModalProps = PropsWithHTMLAttributes<\n  {\n    isOpen?: boolean;\n    onClose?: () => void;\n    onOpen?: () => void;\n    hasOverlay?: boolean;\n    /** @deprecated use onClickOutside */\n    onOverlayClick?: (event: MouseEvent) => void;\n    onClickOutside?: (event: MouseEvent) => void;\n    onEsc?: (event: KeyboardEvent) => void;\n    rootClassName?: string;\n    /** @deprecated use style or className */\n    width?: 'auto';\n    position?: 'center' | 'top';\n    form?: 'brick' | 'default';\n    border?: boolean;\n    children?: React.ReactNode;\n    container?: HTMLElement | React.RefObject<HTMLElement>;\n    afterClose?: () => void;\n    /** @deprecated use ignoreOutsideClicksRefs */\n    refsForExcludeClickOutside?: React.RefObject<HTMLElement>[];\n    ignoreOutsideClicksRefs?: React.RefObject<HTMLElement>[];\n  },\n  HTMLDivElement\n>;\n"],"mappings":""}

package/__internal__/src/components/Modal/useModal.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+export declare const useModal: ({ ref, isOpen, onEsc, onOpen, onClose, ignoreOutsideClicksRefs, }: {
+    isOpen: boolean | undefined;
+    onEsc: ((event: KeyboardEvent) => void) | undefined;
+    onOpen: (() => void) | undefined;
+    onClose: (() => void) | undefined;
+    ref: React.ForwardedRef<HTMLDivElement>;
+    ignoreOutsideClicksRefs: React.RefObject<HTMLElement>[] | undefined;
+}) => {
+    shadowHeader: boolean;
+    shadowFooter: boolean;
+    scrollable: boolean;
+    theme: import("../Theme").ThemePreset;
+    portalRef: React.MutableRefObject<HTMLDivElement | null>;
+    windowRef: ((instance: HTMLDivElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null;
+    contentRef: React.RefCallback<HTMLDivElement | null>;
+    scrollRef: React.RefCallback<HTMLDivElement | null>;
+    windowElAtom: import("@reatom/core").AtomMut<HTMLDivElement | null>;
+    ignoreOutsideClicksRefs: React.RefObject<HTMLElement>[];
+};

package/__internal__/src/components/Modal/useModal.js

@@ -0,0 +1,2 @@
+import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{useAction,useAtom,useUpdate}from"@reatom/npm-react";import{useEffect,useRef}from"react";import{useTheme}from"../Theme";import{useForkRef}from"../../hooks/useForkRef";import{useGlobalKeys}from"../../hooks/useGlobalKeys";import{getElementHeight}from"../../hooks/useResizeObserved";import{useCreateAtom}from"../../utils/state/useCreateAtom";import{useElementAtomEventListener}from"../../utils/state/useElementAtomEventListener";import{useRefAtom}from"../../utils/state/useRefAtom";import{useResizeObservedAtom}from"../../utils/state/useResizeObservedAtom";export var useModal=function(a){var b=a.ref,c=a.isOpen,d=a.onEsc,e=a.onOpen,f=a.onClose,g=a.ignoreOutsideClicksRefs,h=useRef(null),i=useRef(null),j=useRefAtom(),k=_slicedToArray(j,2),l=k[0],m=k[1],n=useRefAtom(),o=_slicedToArray(n,2),p=o[0],q=o[1],r=useRefAtom(),s=_slicedToArray(r,2),t=s[0],u=s[1],v=useForkRef([h,m,b]),w=useTheme(),x=w.theme,y=useCreateAtom(0),z=useAction(function(a){var b;return y(a,(null===(b=a.get(t))||void 0===b?void 0:b.scrollTop)||0)}),A=useAtom(function(a){return 0<a.spy(y)}),B=_slicedToArray(A,1),C=B[0],D=useResizeObservedAtom(useCreateAtom(function(a){return[a.spy(t)]}),function(a){return[(null===a||void 0===a?void 0:a.scrollHeight)||0,(null===a||void 0===a?void 0:a.clientHeight)||0]}),E=useAtom(function(a){var b=a.spy(y),c=a.spy(D),d=_slicedToArray(c,1),e=d[0];e=void 0===e?[0,0]:e;var f=_slicedToArray(e,2),g=f[0],h=f[1];return b<g-h}),F=_slicedToArray(E,1),G=F[0],H=useResizeObservedAtom(useCreateAtom(function(a){return[a.spy(l),a.spy(p)]}),getElementHeight),I=useAtom(function(a){var b=a.spy(H),c=_slicedToArray(b,2),d=c[0],e=void 0===d?0:d,f=c[1],g=void 0===f?0:f;return e<g}),J=_slicedToArray(I,1),K=J[0];return useElementAtomEventListener(t,"scroll",z),useUpdate(z,[t]),useEffect(function(){c?null===e||void 0===e?void 0:e():null===f||void 0===f?void 0:f()},[c]),useGlobalKeys({Escape:function Escape(a){return c&&d&&d(a)}}),{shadowHeader:C,shadowFooter:G,scrollable:K,theme:x,portalRef:i,windowRef:v,contentRef:q,scrollRef:u,windowElAtom:l,ignoreOutsideClicksRefs:[].concat(_toConsumableArray(g||[]),[h])}};
+//# sourceMappingURL=useModal.js.map

package/__internal__/src/components/Modal/useModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useModal.js","names":["useAction","useAtom","useUpdate","useEffect","useRef","useTheme","useForkRef","useGlobalKeys","getElementHeight","useCreateAtom","useElementAtomEventListener","useRefAtom","useResizeObservedAtom","useModal","ref","isOpen","onEsc","onOpen","onClose","ignoreOutsideClicksRefs","modalRef","portalRef","windowElAtom","windowRefCallback","contentElAtom","contentRefCallback","scrollElAtom","scrollRefCallback","modalRefForked","theme","scrollTopAtom","updateScrollTop","ctx","get","scrollTop","spy","shadowHeader","elScrollDimensionsAtom","el","scrollHeight","clientHeight","shadowFooter","heightAtom","modalHeight","contentHeight","scrollable","Escape","e","windowRef","contentRef","scrollRef"],"sources":["../../../../../src/components/Modal/useModal.ts"],"sourcesContent":["import { useAction, useAtom, useUpdate } from '@reatom/npm-react';\nimport React, { useEffect, useRef } from 'react';\n\nimport { useTheme } from '##/components/Theme';\nimport { useForkRef } from '##/hooks/useForkRef';\nimport { useGlobalKeys } from '##/hooks/useGlobalKeys';\nimport { getElementHeight } from '##/hooks/useResizeObserved';\nimport { useCreateAtom } from '##/utils/state/useCreateAtom';\nimport { useElementAtomEventListener } from '##/utils/state/useElementAtomEventListener';\nimport { useRefAtom } from '##/utils/state/useRefAtom';\nimport { useResizeObservedAtom } from '##/utils/state/useResizeObservedAtom';\n\nexport const useModal = ({\n  ref,\n  isOpen,\n  onEsc,\n  onOpen,\n  onClose,\n  ignoreOutsideClicksRefs,\n}: {\n  isOpen: boolean | undefined;\n  onEsc: ((event: KeyboardEvent) => void) | undefined;\n  onOpen: (() => void) | undefined;\n  onClose: (() => void) | undefined;\n  ref: React.ForwardedRef<HTMLDivElement>;\n  ignoreOutsideClicksRefs: React.RefObject<HTMLElement>[] | undefined;\n}) => {\n  const modalRef = useRef<HTMLDivElement | null>(null);\n  const portalRef = useRef<HTMLDivElement | null>(null);\n  const [windowElAtom, windowRefCallback] = useRefAtom<HTMLDivElement>();\n  const [contentElAtom, contentRefCallback] = useRefAtom<HTMLDivElement>();\n  const [scrollElAtom, scrollRefCallback] = useRefAtom<HTMLDivElement>();\n  const modalRefForked = useForkRef([modalRef, windowRefCallback, ref]);\n\n  const { theme } = useTheme();\n\n  const scrollTopAtom = useCreateAtom<number>(0);\n  const updateScrollTop = useAction((ctx) =>\n    scrollTopAtom(ctx, ctx.get(scrollElAtom)?.scrollTop || 0),\n  );\n\n  const [shadowHeader] = useAtom<boolean>((ctx) => ctx.spy(scrollTopAtom) > 0);\n  const elScrollDimensionsAtom = useResizeObservedAtom(\n    useCreateAtom((ctx) => [ctx.spy(scrollElAtom)]),\n    (el) => [el?.scrollHeight || 0, el?.clientHeight || 0] as const,\n  );\n\n  const [shadowFooter] = useAtom<boolean>((ctx) => {\n    const scrollTop = ctx.spy(scrollTopAtom);\n    const [[scrollHeight, clientHeight] = [0, 0]] = ctx.spy(\n      elScrollDimensionsAtom,\n    );\n\n    return scrollTop < scrollHeight - clientHeight;\n  });\n\n  const heightAtom = useResizeObservedAtom(\n    useCreateAtom((ctx) => [ctx.spy(windowElAtom), ctx.spy(contentElAtom)]),\n    getElementHeight,\n  );\n\n  const [scrollable] = useAtom((ctx) => {\n    const [modalHeight = 0, contentHeight = 0] = ctx.spy(heightAtom);\n    return modalHeight < contentHeight;\n  });\n\n  useElementAtomEventListener(scrollElAtom, 'scroll', updateScrollTop);\n\n  useUpdate(updateScrollTop, [scrollElAtom]);\n\n  useEffect(() => {\n    if (isOpen) {\n      onOpen?.();\n    } else {\n      onClose?.();\n    }\n  }, [isOpen]);\n\n  useGlobalKeys({\n    Escape: (e: KeyboardEvent) => isOpen && onEsc && onEsc(e),\n  });\n\n  return {\n    shadowHeader,\n    shadowFooter,\n    scrollable,\n    theme,\n    portalRef,\n    windowRef: modalRefForked,\n    contentRef: contentRefCallback,\n    scrollRef: scrollRefCallback,\n    windowElAtom,\n    ignoreOutsideClicksRefs: [...(ignoreOutsideClicksRefs || []), modalRef],\n  };\n};\n"],"mappings":"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"}

package/__internal__/src/components/PortalWithTheme/PortalWithTheme.js

@@ -1,2 +1,2 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["children","container","style"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import React,{useEffect,useRef,useState}from"react";import ReactDOM from"react-dom";import{useForkRef}from"../../hooks/useForkRef/useForkRef";import{Theme}from"../Theme/Theme";import{PortalWithThemeProvider,usePortalContext}from"./PortalWithThemeContext/PortalWithThemeContext";export{usePortalContext};var getZIndex=function(a,b){return"number"==typeof b?b:a?a+1:void 0},isRef=function(a){return!!a&&"current"in a&&a.current instanceof HTMLElement},getElement=function(a){return isRef(a)?a.current:a};export var PortalWithTheme=React.forwardRef(function(a,b){var c=a.children,d=a.container,e=void 0===d?window.document.body:d,f=a.style,g=_objectWithoutProperties(a,_excluded),h=usePortalContext(),i=h.addRefs,j=h.zIndex,k=useState(getElement(e)),l=_slicedToArray(k,2),m=l[0],n=l[1],o=useRef(null),p=getZIndex(j,null===f||void 0===f?void 0:f.zIndex),q=useForkRef([o,b]);return useEffect(function(){i&&i([o])},[o]),useEffect(function(){n(getElement(e))},[getElement(e)]),m?ReactDOM.createPortal(React.createElement(PortalWithThemeProvider,{zIndex:p},React.createElement(Theme,Object.assign({},g,{ref:q,style:_objectSpread(_objectSpread({},f),{},{zIndex:p})}),c)),m):null});
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["children","container","style"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import React,{useEffect,useRef,useState}from"react";import ReactDOM from"react-dom";import{useForkRef}from"../../hooks/useForkRef/useForkRef";import{Theme}from"../Theme/Theme";import{PortalWithThemeProvider,usePortalContext}from"./PortalWithThemeContext/PortalWithThemeContext";export{usePortalContext};var getZIndex=function(a,b){return"number"==typeof b?b:a?a+1:void 0},isRef=function(a){return!!a&&"current"in a},getElement=function(a){return isRef(a)?a.current:a};export var PortalWithTheme=React.forwardRef(function(a,b){var c=a.children,d=a.container,e=void 0===d?window.document.body:d,f=a.style,g=_objectWithoutProperties(a,_excluded),h=usePortalContext(),i=h.addRefs,j=h.zIndex,k=useState(getElement(e)),l=_slicedToArray(k,2),m=l[0],n=l[1],o=useRef(null),p=getZIndex(j,null===f||void 0===f?void 0:f.zIndex),q=useForkRef([o,b]);return useEffect(function(){i&&i([o])},[o]),useEffect(function(){n(getElement(e))},[getElement(e)]),m?ReactDOM.createPortal(React.createElement(PortalWithThemeProvider,{zIndex:p},React.createElement(Theme,Object.assign({},g,{ref:q,style:_objectSpread(_objectSpread({},f),{},{zIndex:p})}),c)),m):null});
 //# sourceMappingURL=PortalWithTheme.js.map