@vkontakte/vkui 4.19.0 → 4.22.0

package/dist/cjs/components/ActionSheet/ActionSheet.js

@@ -45,6 +45,8 @@ var _useObjectMemo = require("../../hooks/useObjectMemo");
 
 var _warnOnce = require("../../lib/warnOnce");
 
+var _vkjs = require("@vkontakte/vkjs");
+
 var _excluded = ["children", "className", "header", "text", "style", "iosCloseItem"];
 var warn = (0, _warnOnce.warnOnce)('ActionSheet');
 
@@ -67,15 +69,11 @@ var ActionSheet = function ActionSheet(_ref) {
     return setClosing(true);
   };
 
-  var _React$useState3 = React.useState(),
-      _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
-      _closeAction = _React$useState4[0],
-      setCloseAction = _React$useState4[1];
+  var closeAction = React.useRef(_vkjs.noop);
 
   var afterClose = function afterClose() {
     restProps.onClose();
-    _closeAction && _closeAction();
-    setCloseAction(undefined);
+    closeAction.current();
   };
 
   if (process.env.NODE_ENV === 'development' && !restProps.onClose) {
@@ -88,7 +86,8 @@ var ActionSheet = function ActionSheet(_ref) {
       hasMouse = _useAdaptivity.hasMouse;
 
   var isDesktop = viewWidth >= _withAdaptivity.ViewWidth.SMALL_TABLET && (hasMouse || viewHeight >= _withAdaptivity.ViewHeight.MEDIUM);
-  var fallbackTransitionFinish = (0, _useTimeout.useTimeout)(afterClose, platform === _platform.IOS ? 300 : 200);
+  var timeout = platform === _platform.IOS ? 300 : 200;
+  var fallbackTransitionFinish = (0, _useTimeout.useTimeout)(afterClose, timeout);
   React.useEffect(function () {
     if (closing) {
       if (isDesktop) {
@@ -105,9 +104,10 @@ var ActionSheet = function ActionSheet(_ref) {
       event.persist();
 
       if (autoclose) {
-        setCloseAction(function () {
+        closeAction.current = function () {
           return action && action(event);
-        });
+        };
+
         setClosing(true);
       } else {
         action && action(event);
@@ -131,9 +131,10 @@ var ActionSheet = function ActionSheet(_ref) {
     value: contextValue
   }, (0, _jsxRuntime.createScopedElement)(DropdownComponent, (0, _extends2.default)({
     closing: closing,
-    onClose: onClose,
-    onTransitionEnd: closing && !isDesktop ? afterClose : null
-  }, restProps), ((0, _utils.hasReactNode)(header) || (0, _utils.hasReactNode)(text)) && (0, _jsxRuntime.createScopedElement)("header", {
+    timeout: timeout
+  }, restProps, {
+    onClose: onClose
+  }), ((0, _utils.hasReactNode)(header) || (0, _utils.hasReactNode)(text)) && (0, _jsxRuntime.createScopedElement)("header", {
     vkuiClass: "ActionSheet__header"
   }, (0, _utils.hasReactNode)(header) && (0, _jsxRuntime.createScopedElement)(_Caption.default, {
     level: "1",

package/dist/cjs/components/ActionSheet/ActionSheet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheet.tsx"],"names":["warn","ActionSheet","children","className","header","text","style","iosCloseItem","restProps","platform","React","useState","closing","setClosing","onClose","_closeAction","setCloseAction","afterClose","undefined","process","env","NODE_ENV","viewWidth","viewHeight","hasMouse","isDesktop","ViewWidth","SMALL_TABLET","ViewHeight","MEDIUM","fallbackTransitionFinish","IOS","useEffect","set","clear","onItemClick","useCallback","action","autoclose","event","persist","contextValue","DropdownComponent","ActionSheetDropdownDesktop","ActionSheetDropdown","defaultProps","popupDirection"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { ViewWidth, ViewHeight } from '../../hoc/withAdaptivity';\nimport { IOS } from '../../lib/platform';\nimport { ActionSheetDropdownDesktop } from './ActionSheetDropdownDesktop';\nimport { ActionSheetDropdown } from './ActionSheetDropdown';\nimport { hasReactNode } from '../../lib/utils';\nimport { ActionSheetContext, ItemClickHandler } from './ActionSheetContext';\nimport Caption from '../Typography/Caption/Caption';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { SharedDropdownProps, PopupDirection, ToggleRef } from './types';\nimport './ActionSheet.css';\n\nexport interface ActionSheetProps extends React.HTMLAttributes<HTMLDivElement> {\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  /**\n   * Закрыть попап по клику снаружи. В v5 будет обязательным.\n   */\n  onClose?: VoidFunction;\n  /**\n   * Элемент, рядом с которым вылезает попап на десктопе.\n   * Лучше передавать RefObject c current.\n   * В v5 будет обязательным.\n   */\n  toggleRef?: ToggleRef;\n  /**\n   * Направление на десктопе\n   */\n  popupDirection?: PopupDirection;\n  /**\n   * Только iOS. В v5 будет обязательным.\n   */\n  iosCloseItem?: React.ReactNode;\n}\n\nconst warn = warnOnce('ActionSheet');\n\nexport const ActionSheet: React.FC<ActionSheetProps> = ({\n  children,\n  className,\n  header,\n  text,\n  style,\n  iosCloseItem,\n  ...restProps\n}: ActionSheetProps) => {\n  const platform = usePlatform();\n  const [closing, setClosing] = React.useState(false);\n  const onClose = () => setClosing(true);\n\n  const [_closeAction, setCloseAction] = React.useState<VoidFunction>();\n  const afterClose = () => {\n    restProps.onClose();\n    _closeAction && _closeAction();\n    setCloseAction(undefined);\n  };\n\n  if (process.env.NODE_ENV === 'development' && !restProps.onClose) {\n    warn('can\\'t close on outer click without onClose');\n  }\n\n  const { viewWidth, viewHeight, hasMouse } = useAdaptivity();\n  const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET && (hasMouse || viewHeight >= ViewHeight.MEDIUM);\n\n  const fallbackTransitionFinish = useTimeout(afterClose, platform === IOS ? 300 : 200);\n  React.useEffect(() => {\n    if (closing) {\n      if (isDesktop) {\n        afterClose();\n      } else {\n        fallbackTransitionFinish.set();\n      }\n    } else {\n      fallbackTransitionFinish.clear();\n    }\n  }, [closing]);\n\n  const onItemClick = React.useCallback<ItemClickHandler>((action, autoclose) => (event) => {\n    event.persist();\n\n    if (autoclose) {\n      setCloseAction(() => action && action(event));\n      setClosing(true);\n    } else {\n      action && action(event);\n    }\n  }, []);\n  const contextValue = useObjectMemo({ onItemClick, isDesktop });\n\n  const DropdownComponent = isDesktop\n    ? ActionSheetDropdownDesktop\n    : ActionSheetDropdown;\n\n  return (\n    <PopoutWrapper\n      closing={closing}\n      alignY=\"bottom\"\n      className={className}\n      style={style}\n      onClick={!isDesktop ? onClose : null}\n      hasMask={!isDesktop}\n      fixed={!isDesktop}\n    >\n      <ActionSheetContext.Provider value={contextValue}>\n        <DropdownComponent\n          closing={closing}\n          onClose={onClose}\n          onTransitionEnd={closing && !isDesktop ? afterClose : null}\n          {...restProps as Omit<SharedDropdownProps, 'closing'>}\n        >\n          {(hasReactNode(header) || hasReactNode(text)) &&\n            <header vkuiClass=\"ActionSheet__header\">\n              {hasReactNode(header) &&\n                <Caption level=\"1\" weight={platform === IOS ? 'semibold' : 'medium'} vkuiClass=\"ActionSheet__title\">\n                  {header}\n                </Caption>\n              }\n              {hasReactNode(text) && <Caption level=\"1\" weight=\"regular\" vkuiClass=\"ActionSheet__text\">{text}</Caption>}\n            </header>\n          }\n          {children}\n          {platform === IOS && !isDesktop && iosCloseItem}\n        </DropdownComponent>\n      </ActionSheetContext.Provider>\n    </PopoutWrapper>\n  );\n};\n\nActionSheet.defaultProps = {\n  popupDirection: 'bottom',\n};\n"],"file":"ActionSheet.js"}
+{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheet.tsx"],"names":["warn","ActionSheet","children","className","header","text","style","iosCloseItem","restProps","platform","React","useState","closing","setClosing","onClose","closeAction","useRef","noop","afterClose","current","process","env","NODE_ENV","viewWidth","viewHeight","hasMouse","isDesktop","ViewWidth","SMALL_TABLET","ViewHeight","MEDIUM","timeout","IOS","fallbackTransitionFinish","useEffect","set","clear","onItemClick","useCallback","action","autoclose","event","persist","contextValue","DropdownComponent","ActionSheetDropdownDesktop","ActionSheetDropdown","defaultProps","popupDirection"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { ViewWidth, ViewHeight } from '../../hoc/withAdaptivity';\nimport { IOS } from '../../lib/platform';\nimport { ActionSheetDropdownDesktop } from './ActionSheetDropdownDesktop';\nimport { ActionSheetDropdown } from './ActionSheetDropdown';\nimport { hasReactNode } from '../../lib/utils';\nimport { ActionSheetContext, ItemClickHandler } from './ActionSheetContext';\nimport Caption from '../Typography/Caption/Caption';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { SharedDropdownProps, PopupDirection, ToggleRef } from './types';\nimport { noop } from '@vkontakte/vkjs';\nimport './ActionSheet.css';\n\nexport interface ActionSheetProps extends React.HTMLAttributes<HTMLDivElement> {\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  /**\n   * Закрыть попап по клику снаружи. В v5 будет обязательным.\n   */\n  onClose?: VoidFunction;\n  /**\n   * Элемент, рядом с которым вылезает попап на десктопе.\n   * Лучше передавать RefObject c current.\n   * В v5 будет обязательным.\n   */\n  toggleRef?: ToggleRef;\n  /**\n   * Направление на десктопе\n   */\n  popupDirection?: PopupDirection;\n  /**\n   * Только iOS. В v5 будет обязательным.\n   */\n  iosCloseItem?: React.ReactNode;\n}\n\nconst warn = warnOnce('ActionSheet');\n\nexport const ActionSheet: React.FC<ActionSheetProps> = ({\n  children,\n  className,\n  header,\n  text,\n  style,\n  iosCloseItem,\n  ...restProps\n}: ActionSheetProps) => {\n  const platform = usePlatform();\n  const [closing, setClosing] = React.useState(false);\n  const onClose = () => setClosing(true);\n\n  const closeAction = React.useRef<VoidFunction>(noop);\n  const afterClose = () => {\n    restProps.onClose();\n    closeAction.current();\n  };\n\n  if (process.env.NODE_ENV === 'development' && !restProps.onClose) {\n    warn('can\\'t close on outer click without onClose');\n  }\n\n  const { viewWidth, viewHeight, hasMouse } = useAdaptivity();\n  const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET && (hasMouse || viewHeight >= ViewHeight.MEDIUM);\n\n  const timeout = platform === IOS ? 300 : 200;\n\n  const fallbackTransitionFinish = useTimeout(afterClose, timeout);\n  React.useEffect(() => {\n    if (closing) {\n      if (isDesktop) {\n        afterClose();\n      } else {\n        fallbackTransitionFinish.set();\n      }\n    } else {\n      fallbackTransitionFinish.clear();\n    }\n  }, [closing]);\n\n  const onItemClick = React.useCallback<ItemClickHandler>((action, autoclose) => (event) => {\n    event.persist();\n\n    if (autoclose) {\n      closeAction.current = () => action && action(event);\n      setClosing(true);\n    } else {\n      action && action(event);\n    }\n  }, []);\n  const contextValue = useObjectMemo({ onItemClick, isDesktop });\n\n  const DropdownComponent = isDesktop\n    ? ActionSheetDropdownDesktop\n    : ActionSheetDropdown;\n\n  return (\n    <PopoutWrapper\n      closing={closing}\n      alignY=\"bottom\"\n      className={className}\n      style={style}\n      onClick={!isDesktop ? onClose : null}\n      hasMask={!isDesktop}\n      fixed={!isDesktop}\n    >\n      <ActionSheetContext.Provider value={contextValue}>\n        <DropdownComponent\n          closing={closing}\n          timeout={timeout}\n          {...restProps as Omit<SharedDropdownProps, 'closing'>}\n          onClose={onClose}\n        >\n          {(hasReactNode(header) || hasReactNode(text)) &&\n            <header vkuiClass=\"ActionSheet__header\">\n              {hasReactNode(header) &&\n                <Caption level=\"1\" weight={platform === IOS ? 'semibold' : 'medium'} vkuiClass=\"ActionSheet__title\">\n                  {header}\n                </Caption>\n              }\n              {hasReactNode(text) && <Caption level=\"1\" weight=\"regular\" vkuiClass=\"ActionSheet__text\">{text}</Caption>}\n            </header>\n          }\n          {children}\n          {platform === IOS && !isDesktop && iosCloseItem}\n        </DropdownComponent>\n      </ActionSheetContext.Provider>\n    </PopoutWrapper>\n  );\n};\n\nActionSheet.defaultProps = {\n  popupDirection: 'bottom',\n};\n"],"file":"ActionSheet.js"}

package/dist/cjs/components/ActionSheet/ActionSheetDropdown.js

@@ -19,6 +19,8 @@ var _classNames = require("../../lib/classNames");
 
 var _usePlatform = require("../../hooks/usePlatform");
 
+var _FocusTrap = require("../FocusTrap/FocusTrap");
+
 var _excluded = ["children", "closing", "toggleRef", "popupDirection"];
 
 var stopPropagation = function stopPropagation(e) {
@@ -33,7 +35,7 @@ var ActionSheetDropdown = function ActionSheetDropdown(_ref) {
       restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var platform = (0, _usePlatform.usePlatform)();
   var baseClaseName = (0, _getClassName.getClassName)('ActionSheet', platform);
-  return (0, _jsxRuntime.createScopedElement)("div", (0, _extends2.default)({}, restProps, {
+  return (0, _jsxRuntime.createScopedElement)(_FocusTrap.FocusTrap, (0, _extends2.default)({}, restProps, {
     onClick: stopPropagation,
     vkuiClass: (0, _classNames.classNames)(baseClaseName, {
       'ActionSheet--closing': closing

package/dist/cjs/components/ActionSheet/ActionSheetDropdown.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetDropdown.tsx"],"names":["stopPropagation","e","ActionSheetDropdown","children","closing","toggleRef","popupDirection","restProps","platform","baseClaseName"],"mappings":";;;;;;;;;;;;;;;AACA;;AACA;;AACA;;;;AAIA,IAAMA,eAAwC,GAAG,SAA3CA,eAA2C,CAACC,CAAD;AAAA,SAAOA,CAAC,CAACD,eAAF,EAAP;AAAA,CAAjD;;AAEO,IAAME,mBAAkD,GAAG,SAArDA,mBAAqD,OAO5D;AAAA,MANJC,QAMI,QANJA,QAMI;AAAA,MALJC,OAKI,QALJA,OAKI;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,cAEI,QAFJA,cAEI;AAAA,MADDC,SACC;AACJ,MAAMC,QAAQ,GAAG,+BAAjB;AACA,MAAMC,aAAa,GAAG,gCAAa,aAAb,EAA4BD,QAA5B,CAAtB;AAEA,SACE,uEACMD,SADN;AAEE,IAAA,OAAO,EAAEP,eAFX;AAGE,IAAA,SAAS,EAAE,4BAAWS,aAAX,EAA0B;AACnC,8BAAwBL;AADW,KAA1B;AAHb,MAOGD,QAPH,CADF;AAWD,CAtBM","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SharedDropdownProps } from './types';\nimport './ActionSheet.css';\n\nconst stopPropagation: React.MouseEventHandler = (e) => e.stopPropagation();\n\nexport const ActionSheetDropdown: React.FC<SharedDropdownProps> = ({\n  children,\n  closing,\n  // these 2 props are only omitted - ActionSheetDesktop compat\n  toggleRef,\n  popupDirection,\n  ...restProps\n}) => {\n  const platform = usePlatform();\n  const baseClaseName = getClassName('ActionSheet', platform);\n\n  return (\n    <div\n      {...restProps}\n      onClick={stopPropagation}\n      vkuiClass={classNames(baseClaseName, {\n        'ActionSheet--closing': closing,\n      })}\n    >\n      {children}\n    </div>\n  );\n};\n"],"file":"ActionSheetDropdown.js"}
+{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetDropdown.tsx"],"names":["stopPropagation","e","ActionSheetDropdown","children","closing","toggleRef","popupDirection","restProps","platform","baseClaseName"],"mappings":";;;;;;;;;;;;;;;AACA;;AACA;;AACA;;AAEA;;;;AAGA,IAAMA,eAAwC,GAAG,SAA3CA,eAA2C,CAACC,CAAD;AAAA,SAAOA,CAAC,CAACD,eAAF,EAAP;AAAA,CAAjD;;AAEO,IAAME,mBAAkD,GAAG,SAArDA,mBAAqD,OAO5D;AAAA,MANJC,QAMI,QANJA,QAMI;AAAA,MALJC,OAKI,QALJA,OAKI;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,cAEI,QAFJA,cAEI;AAAA,MADDC,SACC;AACJ,MAAMC,QAAQ,GAAG,+BAAjB;AACA,MAAMC,aAAa,GAAG,gCAAa,aAAb,EAA4BD,QAA5B,CAAtB;AAEA,SACE,qCAAC,oBAAD,6BACMD,SADN;AAEE,IAAA,OAAO,EAAEP,eAFX;AAGE,IAAA,SAAS,EAAE,4BAAWS,aAAX,EAA0B;AACnC,8BAAwBL;AADW,KAA1B;AAHb,MAOGD,QAPH,CADF;AAWD,CAtBM","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SharedDropdownProps } from './types';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport './ActionSheet.css';\n\nconst stopPropagation: React.MouseEventHandler = (e) => e.stopPropagation();\n\nexport const ActionSheetDropdown: React.FC<SharedDropdownProps> = ({\n  children,\n  closing,\n  // these 2 props are only omitted - ActionSheetDesktop compat\n  toggleRef,\n  popupDirection,\n  ...restProps\n}) => {\n  const platform = usePlatform();\n  const baseClaseName = getClassName('ActionSheet', platform);\n\n  return (\n    <FocusTrap\n      {...restProps}\n      onClick={stopPropagation}\n      vkuiClass={classNames(baseClaseName, {\n        'ActionSheet--closing': closing,\n      })}\n    >\n      {children}\n    </FocusTrap>\n  );\n};\n"],"file":"ActionSheetDropdown.js"}

package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.js

@@ -35,6 +35,8 @@ var _useIsomorphicLayoutEffect = require("../../lib/useIsomorphicLayoutEffect");
 
 var _useEventListener = require("../../hooks/useEventListener");
 
+var _FocusTrap = require("../FocusTrap/FocusTrap");
+
 var _excluded = ["children", "toggleRef", "closing", "popupDirection", "onClose"];
 var warn = (0, _warnOnce.warnOnce)('ActionSheet');
 
@@ -102,11 +104,14 @@ var ActionSheetDropdownDesktop = function ActionSheetDropdownDesktop(_ref) {
       bodyClickListener.add(document.body);
     });
   }, []);
-  return (0, _jsxRuntime.createScopedElement)("div", (0, _extends2.default)({}, restProps, {
-    ref: elementRef,
-    onClick: function onClick(e) {
-      return e.stopPropagation();
-    },
+  var onClick = React.useCallback(function (e) {
+    return e.stopPropagation();
+  }, []);
+  return (0, _jsxRuntime.createScopedElement)(_FocusTrap.FocusTrap, (0, _extends2.default)({
+    onClose: onClose
+  }, restProps, {
+    getRootRef: elementRef,
+    onClick: onClick,
     style: dropdownStyles,
     vkuiClass: (0, _classNames.classNames)((0, _getClassName.getClassName)('ActionSheet', platform), 'ActionSheet--desktop', {
       'ActionSheet--closing': closing

package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetDropdownDesktop.tsx"],"names":["warn","getEl","ref","current","ActionSheetDropdownDesktop","children","toggleRef","closing","popupDirection","onClose","restProps","window","document","platform","sizeY","elementRef","React","useRef","useState","left","top","opacity","pointerEvents","dropdownStyles","setDropdownStyles","toggleEl","process","env","NODE_ENV","toggleRect","getBoundingClientRect","elementRect","isTop","width","pageXOffset","pageYOffset","height","bodyClickListener","e","dropdownElement","contains","target","useEffect","setTimeout","add","body","stopPropagation"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;AAIA,IAAMA,IAAI,GAAG,wBAAS,aAAT,CAAb;;AACA,SAASC,KAAT,CAAeC,GAAf,EAAkF;AAChF,SAAOA,GAAG,IAAI,aAAaA,GAApB,GAA0BA,GAAG,CAACC,OAA9B,GAAwCD,GAA/C;AACD;;AAEM,IAAME,0BAAyD,GAAG,SAA5DA,0BAA4D,OAOnE;AAAA,MANJC,QAMI,QANJA,QAMI;AAAA,MALJC,SAKI,QALJA,SAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,cAGI,QAHJA,cAGI;AAAA,MAFJC,OAEI,QAFJA,OAEI;AAAA,MADDC,SACC;;AACJ,gBAA6B,kBAA7B;AAAA,MAAQC,MAAR,WAAQA,MAAR;AAAA,MAAgBC,QAAhB,WAAgBA,QAAhB;;AACA,MAAMC,QAAQ,GAAG,+BAAjB;;AACA,uBAAkB,oCAAlB;AAAA,MAAQC,KAAR,kBAAQA,KAAR;;AACA,MAAMC,UAAU,GAAGC,KAAK,CAACC,MAAN,EAAnB;;AAEA,wBAA4CD,KAAK,CAACE,QAAN,CAAoC;AAC9EC,IAAAA,IAAI,EAAE,CADwE;AAE9EC,IAAAA,GAAG,EAAE,CAFyE;AAG9EC,IAAAA,OAAO,EAAE,CAHqE;AAI9EC,IAAAA,aAAa,EAAE;AAJ+D,GAApC,CAA5C;AAAA;AAAA,MAAOC,cAAP;AAAA,MAAuBC,iBAAvB;;AAMA,4DAA0B,YAAM;AAC9B,QAAMC,QAAQ,GAAGxB,KAAK,CAACK,SAAD,CAAtB;;AACA,QAAI,CAACmB,QAAL,EAAe;AACb,UAAIC,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAA7B,EAA4C;AAC1C5B,QAAAA,IAAI,CAAC,sBAAD,CAAJ;AACD;;AACD;AACD;;AAED,QAAM6B,UAAU,GAAGJ,QAAQ,CAACK,qBAAT,EAAnB;AACA,QAAMC,WAAW,GAAGhB,UAAU,CAACZ,OAAX,CAAmB2B,qBAAnB,EAApB;AACA,QAAME,KAAK,GAAGxB,cAAc,KAAK,KAAnB,IAA4B,OAAOA,cAAP,KAA0B,UAA1B,IAAwCA,cAAc,CAACO,UAAD,CAAd,KAA+B,KAAjH;AAEAS,IAAAA,iBAAiB,CAAC;AAChBL,MAAAA,IAAI,EAAEU,UAAU,CAACV,IAAX,GAAkBU,UAAU,CAACI,KAA7B,GAAqCF,WAAW,CAACE,KAAjD,GAAyDtB,MAAM,CAACuB,WADtD;AAEhBd,MAAAA,GAAG,EAAES,UAAU,CAACT,GAAX,GAAiBT,MAAM,CAACwB,WAAxB,IAAuCH,KAAK,GAAG,CAACD,WAAW,CAACK,MAAhB,GAAyBP,UAAU,CAACO,MAAhF;AAFW,KAAD,CAAjB;AAID,GAjBD,EAiBG,CAAC9B,SAAD,CAjBH;AAmBA,MAAM+B,iBAAiB,GAAG,wCAAiB,OAAjB,EAA0B,UAACC,CAAD,EAAO;AACzD,QAAMC,eAAe,GAAGxB,UAAH,aAAGA,UAAH,uBAAGA,UAAU,CAAEZ,OAApC;;AACA,QAAIoC,eAAe,IAAI,CAACA,eAAe,CAACC,QAAhB,CAAyBF,CAAC,CAACG,MAA3B,CAAxB,EAAoE;AAClEhC,MAAAA,OAAO;AACR;AACF,GALyB,CAA1B;AAOAO,EAAAA,KAAK,CAAC0B,SAAN,CAAgB,YAAM;AACpBC,IAAAA,UAAU,CAAC,YAAM;AACfN,MAAAA,iBAAiB,CAACO,GAAlB,CAAsBhC,QAAQ,CAACiC,IAA/B;AACD,KAFS,CAAV;AAGD,GAJD,EAIG,EAJH;AAMA,SACE,uEACMnC,SADN;AAEE,IAAA,GAAG,EAAEK,UAFP;AAGE,IAAA,OAAO,EAAE,iBAACuB,CAAD;AAAA,aAAOA,CAAC,CAACQ,eAAF,EAAP;AAAA,KAHX;AAIE,IAAA,KAAK,EAAEvB,cAJT;AAKE,IAAA,SAAS,EAAE,4BAAW,gCAAa,aAAb,EAA4BV,QAA5B,CAAX,EAAkD,sBAAlD,EAA0E;AACnF,8BAAwBN;AAD2D,KAA1E,+BAEcO,KAFd;AALb,MASGT,QATH,CADF;AAaD,CAhEM","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { useDOM } from '../../lib/dom';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { SharedDropdownProps } from './types';\nimport './ActionSheet.css';\n\nconst warn = warnOnce('ActionSheet');\nfunction getEl(ref: SharedDropdownProps['toggleRef']): Element | null | undefined {\n  return ref && 'current' in ref ? ref.current : ref as Element | null | undefined;\n}\n\nexport const ActionSheetDropdownDesktop: React.FC<SharedDropdownProps> = ({\n  children,\n  toggleRef,\n  closing,\n  popupDirection,\n  onClose,\n  ...restProps\n}) => {\n  const { window, document } = useDOM();\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n  const elementRef = React.useRef<HTMLDivElement>();\n\n  const [dropdownStyles, setDropdownStyles] = React.useState<React.CSSProperties>({\n    left: 0,\n    top: 0,\n    opacity: 0,\n    pointerEvents: 'none',\n  });\n  useIsomorphicLayoutEffect(() => {\n    const toggleEl = getEl(toggleRef);\n    if (!toggleEl) {\n      if (process.env.NODE_ENV === 'development') {\n        warn('toggleRef not passed');\n      }\n      return;\n    }\n\n    const toggleRect = toggleEl.getBoundingClientRect();\n    const elementRect = elementRef.current.getBoundingClientRect();\n    const isTop = popupDirection === 'top' || typeof popupDirection === 'function' && popupDirection(elementRef) === 'top';\n\n    setDropdownStyles({\n      left: toggleRect.left + toggleRect.width - elementRect.width + window.pageXOffset,\n      top: toggleRect.top + window.pageYOffset + (isTop ? -elementRect.height : toggleRect.height),\n    });\n  }, [toggleRef]);\n\n  const bodyClickListener = useEventListener('click', (e) => {\n    const dropdownElement = elementRef?.current;\n    if (dropdownElement && !dropdownElement.contains(e.target as Node)) {\n      onClose();\n    }\n  });\n\n  React.useEffect(() => {\n    setTimeout(() => {\n      bodyClickListener.add(document.body);\n    });\n  }, []);\n\n  return (\n    <div\n      {...restProps}\n      ref={elementRef}\n      onClick={(e) => e.stopPropagation()}\n      style={dropdownStyles}\n      vkuiClass={classNames(getClassName('ActionSheet', platform), 'ActionSheet--desktop', {\n        'ActionSheet--closing': closing,\n      }, `ActionSheet--sizeY-${sizeY}`)}\n    >\n      {children}\n    </div>\n  );\n};\n"],"file":"ActionSheetDropdownDesktop.js"}
+{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetDropdownDesktop.tsx"],"names":["warn","getEl","ref","current","ActionSheetDropdownDesktop","children","toggleRef","closing","popupDirection","onClose","restProps","window","document","platform","sizeY","elementRef","React","useRef","useState","left","top","opacity","pointerEvents","dropdownStyles","setDropdownStyles","toggleEl","process","env","NODE_ENV","toggleRect","getBoundingClientRect","elementRect","isTop","width","pageXOffset","pageYOffset","height","bodyClickListener","e","dropdownElement","contains","target","useEffect","setTimeout","add","body","onClick","useCallback","stopPropagation"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { useDOM } from '../../lib/dom';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { SharedDropdownProps } from './types';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport './ActionSheet.css';\n\nconst warn = warnOnce('ActionSheet');\nfunction getEl(ref: SharedDropdownProps['toggleRef']): Element | null | undefined {\n  return ref && 'current' in ref ? ref.current : ref as Element | null | undefined;\n}\n\nexport const ActionSheetDropdownDesktop: React.FC<SharedDropdownProps> = ({\n  children,\n  toggleRef,\n  closing,\n  popupDirection,\n  onClose,\n  ...restProps\n}) => {\n  const { window, document } = useDOM();\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n  const elementRef = React.useRef<HTMLDivElement>();\n\n  const [dropdownStyles, setDropdownStyles] = React.useState<React.CSSProperties>({\n    left: 0,\n    top: 0,\n    opacity: 0,\n    pointerEvents: 'none',\n  });\n  useIsomorphicLayoutEffect(() => {\n    const toggleEl = getEl(toggleRef);\n    if (!toggleEl) {\n      if (process.env.NODE_ENV === 'development') {\n        warn('toggleRef not passed');\n      }\n      return;\n    }\n\n    const toggleRect = toggleEl.getBoundingClientRect();\n    const elementRect = elementRef.current.getBoundingClientRect();\n    const isTop = popupDirection === 'top' || typeof popupDirection === 'function' && popupDirection(elementRef) === 'top';\n\n    setDropdownStyles({\n      left: toggleRect.left + toggleRect.width - elementRect.width + window.pageXOffset,\n      top: toggleRect.top + window.pageYOffset + (isTop ? -elementRect.height : toggleRect.height),\n    });\n  }, [toggleRef]);\n\n  const bodyClickListener = useEventListener('click', (e: MouseEvent) => {\n    const dropdownElement = elementRef?.current;\n    if (dropdownElement && !dropdownElement.contains(e.target as Node)) {\n      onClose();\n    }\n  });\n\n  React.useEffect(() => {\n    setTimeout(() => {\n      bodyClickListener.add(document.body);\n    });\n  }, []);\n\n  const onClick = React.useCallback((e) => e.stopPropagation(), []);\n\n  return (\n    <FocusTrap\n      onClose={onClose}\n      {...restProps}\n      getRootRef={elementRef}\n      onClick={onClick}\n      style={dropdownStyles}\n      vkuiClass={classNames(getClassName('ActionSheet', platform), 'ActionSheet--desktop', {\n        'ActionSheet--closing': closing,\n      }, `ActionSheet--sizeY-${sizeY}`)}\n    >\n      {children}\n    </FocusTrap>\n  );\n};\n"],"file":"ActionSheetDropdownDesktop.js"}

package/dist/cjs/components/ActionSheet/types.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
+import { FocusTrapProps } from '../FocusTrap/FocusTrap';
 export declare type PopupDirection = 'top' | 'bottom' | ((elRef: React.RefObject<HTMLDivElement>) => 'top' | 'bottom');
 export declare type ToggleRef = Element | null | undefined | React.RefObject<Element>;
-export interface SharedDropdownProps extends React.HTMLAttributes<HTMLDivElement> {
+export interface SharedDropdownProps extends React.AllHTMLAttributes<HTMLElement>, FocusTrapProps {
     closing: boolean;
-    onClose: VoidFunction;
     toggleRef: ToggleRef;
     popupDirection: PopupDirection;
 }

package/dist/cjs/components/Alert/Alert.d.ts

@@ -27,6 +27,7 @@ declare class Alert extends React.Component<AlertProps, AlertState> {
     element: React.RefObject<HTMLDivElement>;
     private transitionFinishTimeout;
     static defaultProps: AlertProps;
+    private get timeout();
     onItemClick: ItemClickHander;
     onClose: VoidFunction;
     stopPropagation: React.MouseEventHandler;

package/dist/cjs/components/Alert/Alert.js

@@ -57,6 +57,8 @@ var _Caption = _interopRequireDefault(require("../Typography/Caption/Caption"));
 
 var _ModalDismissButton = _interopRequireDefault(require("../ModalDismissButton/ModalDismissButton"));
 
+var _FocusTrap = require("../FocusTrap/FocusTrap");
+
 var _excluded = ["actions", "actionsLayout", "children", "className", "style", "platform", "viewWidth", "text", "header"];
 
 var Alert = /*#__PURE__*/function (_React$Component) {
@@ -151,6 +153,11 @@ var Alert = /*#__PURE__*/function (_React$Component) {
   }
 
   (0, _createClass2.default)(Alert, [{
+    key: "timeout",
+    get: function get() {
+      return this.props.platform === _platform.ANDROID || this.props.platform === _platform.VKCOM ? 200 : 300;
+    }
+  }, {
     key: "waitTransitionFinish",
     value: function waitTransitionFinish(eventHandler) {
       if (_supportEvents.transitionEvent.supported) {
@@ -158,7 +165,7 @@ var Alert = /*#__PURE__*/function (_React$Component) {
         this.element.current.addEventListener(_supportEvents.transitionEvent.name, eventHandler);
       } else {
         clearTimeout(this.transitionFinishTimeout);
-        this.transitionFinishTimeout = setTimeout(eventHandler.bind(this), this.props.platform === _platform.ANDROID || this.props.platform === _platform.VKCOM ? 200 : 300);
+        this.transitionFinishTimeout = setTimeout(eventHandler.bind(this), this.timeout);
       }
     }
   }, {
@@ -234,9 +241,11 @@ var Alert = /*#__PURE__*/function (_React$Component) {
         closing: closing,
         style: style,
         onClick: this.onClose
-      }, (0, _jsxRuntime.createScopedElement)("div", (0, _extends2.default)({}, restProps, {
-        ref: this.element,
+      }, (0, _jsxRuntime.createScopedElement)(_FocusTrap.FocusTrap, (0, _extends2.default)({}, restProps, {
+        getRootRef: this.element,
         onClick: this.stopPropagation,
+        onClose: this.onClose,
+        timeout: this.timeout,
         vkuiClass: (0, _classNames.classNames)((0, _getClassName.getClassName)('Alert', platform), {
           'Alert--v': resolvedActionsLayout === 'vertical',
           'Alert--h': resolvedActionsLayout === 'horizontal',

package/dist/cjs/components/Alert/Alert.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Alert/Alert.tsx"],"names":["Alert","props","item","action","autoclose","setState","closing","waitTransitionFinish","e","propertyName","onClose","stopPropagation","i","platform","IOS","Component","href","mode","onItemClick","target","title","ANDROID","viewWidth","ViewWidth","DESKTOP","element","React","createRef","state","eventHandler","transitionEvent","supported","current","removeEventListener","name","addEventListener","clearTimeout","transitionFinishTimeout","setTimeout","bind","VKCOM","header","text","actions","actionsLayout","children","className","style","restProps","resolvedActionsLayout","canShowCloseButton","SMALL_TABLET","isDesktop","renderHeader","renderText","map","renderAction"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Tappable from '../Tappable/Tappable';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { transitionEvent } from '../../lib/supportEvents';\nimport { ANDROID, VKCOM, IOS } from '../../lib/platform';\nimport { HasPlatform } from '../../types';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { withAdaptivity, AdaptivityProps, ViewWidth } from '../../hoc/withAdaptivity';\nimport Button, { ButtonProps } from '../Button/Button';\nimport { hasReactNode } from '../../lib/utils';\nimport Headline from '../Typography/Headline/Headline';\nimport Title from '../Typography/Title/Title';\nimport Caption from '../Typography/Caption/Caption';\nimport ModalDismissButton from '../ModalDismissButton/ModalDismissButton';\nimport './Alert.css';\n\nexport type AlertActionInterface = AlertProps['actions'][0] & React.AnchorHTMLAttributes<HTMLElement>;\n\nexport interface AlertAction extends Pick<ButtonProps, 'Component' | 'href'> {\n  title: string;\n  action?: VoidFunction;\n  autoclose?: boolean;\n  mode: 'cancel' | 'destructive' | 'default';\n}\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLElement>, HasPlatform, AdaptivityProps {\n  actionsLayout?: 'vertical' | 'horizontal';\n  actions?: AlertAction[];\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  onClose?: VoidFunction;\n}\n\nexport interface AlertState {\n  closing: boolean;\n}\n\ntype TransitionEndHandler = (e?: TransitionEvent) => void;\n\ntype ItemClickHander = (item: AlertActionInterface) => () => void;\n\nclass Alert extends React.Component<AlertProps, AlertState> {\n  constructor(props: AlertProps) {\n    super(props);\n    this.element = React.createRef();\n    this.state = {\n      closing: false,\n    };\n  }\n\n  element: React.RefObject<HTMLDivElement>;\n\n  private transitionFinishTimeout: ReturnType<typeof setTimeout>;\n\n  static defaultProps: AlertProps = {\n    actionsLayout: 'horizontal',\n    actions: [],\n  };\n\n  onItemClick: ItemClickHander = (item: AlertActionInterface) => () => {\n    const { action, autoclose } = item;\n\n    if (autoclose) {\n      this.setState({ closing: true });\n      this.waitTransitionFinish((e?: TransitionEvent) => {\n        if (!e || e.propertyName === 'opacity') {\n          autoclose && this.props.onClose();\n          action && action();\n        }\n      });\n    } else {\n      action && action();\n    }\n  };\n\n  onClose: VoidFunction = () => {\n    this.setState({ closing: true });\n    this.waitTransitionFinish((e?: TransitionEvent) => {\n      if (!e || e.propertyName === 'opacity') {\n        this.props.onClose();\n      }\n    });\n  };\n\n  stopPropagation: React.MouseEventHandler = (e: React.SyntheticEvent) => {\n    e.stopPropagation();\n  };\n\n  waitTransitionFinish(eventHandler: TransitionEndHandler) {\n    if (transitionEvent.supported) {\n      this.element.current.removeEventListener(transitionEvent.name, eventHandler);\n      this.element.current.addEventListener(transitionEvent.name, eventHandler);\n    } else {\n      clearTimeout(this.transitionFinishTimeout);\n      this.transitionFinishTimeout = setTimeout(eventHandler.bind(this), this.props.platform === ANDROID || this.props.platform === VKCOM ? 200 : 300);\n    }\n  }\n\n  renderHeader(header: React.ReactNode) {\n    switch (this.props.platform) {\n      case VKCOM:\n        return <Headline vkuiClass=\"Alert__header\" weight=\"medium\">{header}</Headline>;\n      case IOS:\n        return <Title vkuiClass=\"Alert__header\" weight=\"semibold\" level=\"3\">{header}</Title>;\n      case ANDROID:\n        return <Title vkuiClass=\"Alert__header\" weight=\"medium\" level=\"2\">{header}</Title>;\n    }\n  }\n\n  renderText(text: React.ReactNode) {\n    switch (this.props.platform) {\n      case VKCOM:\n        return <Caption vkuiClass=\"Alert__text\" level=\"1\" weight=\"regular\">{text}</Caption>;\n      case IOS:\n        return <Caption vkuiClass=\"Alert__text\" level=\"2\" weight=\"regular\">{text}</Caption>;\n      case ANDROID:\n        return <Headline vkuiClass=\"Alert__text\" weight=\"regular\">{text}</Headline>;\n    }\n  }\n\n  renderAction = (action: AlertActionInterface, i: number) => {\n    const { platform } = this.props;\n\n    if (platform === IOS) {\n      const { Component = 'button' } = action;\n      return (\n        <Tappable\n          Component={action.href ? 'a' : Component}\n          vkuiClass={classNames('Alert__action', `Alert__action--${action.mode}`)}\n          onClick={this.onItemClick(action)}\n          href={action.href}\n          key={`alert-action-${i}`}\n          target={action.target}\n        >\n          {action.title}\n        </Tappable>\n      );\n    }\n\n    let mode: ButtonProps['mode'] = action.mode === 'cancel' ? 'secondary' : 'primary';\n\n    if (platform === ANDROID) {\n      mode = 'tertiary';\n\n      if (this.props.viewWidth === ViewWidth.DESKTOP && action.mode === 'destructive') {\n        mode = 'destructive';\n      }\n    }\n\n    return (\n      <Button\n        vkuiClass={classNames('Alert__button', `Alert__button--${action.mode}`)}\n        mode={mode}\n        size=\"m\"\n        onClick={this.onItemClick(action)}\n        Component={action.Component}\n        href={action.href}\n        key={`alert-action-${i}`}\n        target={action.target}\n      >\n        {action.title}\n      </Button>\n    );\n  };\n\n  render() {\n    const { actions, actionsLayout, children, className, style, platform, viewWidth, text, header, ...restProps } = this.props;\n    const { closing } = this.state;\n\n    const resolvedActionsLayout: AlertProps['actionsLayout'] = platform === VKCOM ? 'horizontal' : actionsLayout;\n    const canShowCloseButton = platform === VKCOM || platform === ANDROID && viewWidth >= ViewWidth.SMALL_TABLET;\n    const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET;\n\n    return (\n      <PopoutWrapper\n        className={className}\n        closing={closing}\n        style={style}\n        onClick={this.onClose}\n      >\n        <div\n          {...restProps}\n          ref={this.element}\n          onClick={this.stopPropagation}\n          vkuiClass={classNames(getClassName('Alert', platform), {\n            'Alert--v': resolvedActionsLayout === 'vertical',\n            'Alert--h': resolvedActionsLayout === 'horizontal',\n            'Alert--closing': closing,\n            'Alert--desktop': isDesktop,\n          })}\n        >\n          {canShowCloseButton && <ModalDismissButton onClick={this.onClose} />}\n          <div vkuiClass=\"Alert__content\">\n            {hasReactNode(header) && this.renderHeader(header)}\n            {hasReactNode(text) && this.renderText(text)}\n            {children}\n          </div>\n          <footer vkuiClass=\"Alert__actions\">\n            {actions.map(this.renderAction)}\n          </footer>\n        </div>\n      </PopoutWrapper>\n    );\n  }\n}\n\nexport default withPlatform(withAdaptivity(Alert, {\n  viewWidth: true,\n}));\n"],"file":"Alert.js"}
+{"version":3,"sources":["../../../../src/components/Alert/Alert.tsx"],"names":["Alert","props","item","action","autoclose","setState","closing","waitTransitionFinish","e","propertyName","onClose","stopPropagation","i","platform","IOS","Component","href","mode","onItemClick","target","title","ANDROID","viewWidth","ViewWidth","DESKTOP","element","React","createRef","state","VKCOM","eventHandler","transitionEvent","supported","current","removeEventListener","name","addEventListener","clearTimeout","transitionFinishTimeout","setTimeout","bind","timeout","header","text","actions","actionsLayout","children","className","style","restProps","resolvedActionsLayout","canShowCloseButton","SMALL_TABLET","isDesktop","renderHeader","renderText","map","renderAction"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Tappable from '../Tappable/Tappable';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { transitionEvent } from '../../lib/supportEvents';\nimport { ANDROID, VKCOM, IOS } from '../../lib/platform';\nimport { HasPlatform } from '../../types';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { withAdaptivity, AdaptivityProps, ViewWidth } from '../../hoc/withAdaptivity';\nimport Button, { ButtonProps } from '../Button/Button';\nimport { hasReactNode } from '../../lib/utils';\nimport Headline from '../Typography/Headline/Headline';\nimport Title from '../Typography/Title/Title';\nimport Caption from '../Typography/Caption/Caption';\nimport ModalDismissButton from '../ModalDismissButton/ModalDismissButton';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport './Alert.css';\n\nexport type AlertActionInterface = AlertProps['actions'][0] & React.AnchorHTMLAttributes<HTMLElement>;\n\nexport interface AlertAction extends Pick<ButtonProps, 'Component' | 'href'> {\n  title: string;\n  action?: VoidFunction;\n  autoclose?: boolean;\n  mode: 'cancel' | 'destructive' | 'default';\n}\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLElement>, HasPlatform, AdaptivityProps {\n  actionsLayout?: 'vertical' | 'horizontal';\n  actions?: AlertAction[];\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  onClose?: VoidFunction;\n}\n\nexport interface AlertState {\n  closing: boolean;\n}\n\ntype TransitionEndHandler = (e?: TransitionEvent) => void;\n\ntype ItemClickHander = (item: AlertActionInterface) => () => void;\n\nclass Alert extends React.Component<AlertProps, AlertState> {\n  constructor(props: AlertProps) {\n    super(props);\n    this.element = React.createRef();\n    this.state = {\n      closing: false,\n    };\n  }\n\n  element: React.RefObject<HTMLDivElement>;\n\n  private transitionFinishTimeout: ReturnType<typeof setTimeout>;\n\n  static defaultProps: AlertProps = {\n    actionsLayout: 'horizontal',\n    actions: [],\n  };\n\n  private get timeout(): number {\n    return this.props.platform === ANDROID || this.props.platform === VKCOM ? 200 : 300;\n  }\n\n  onItemClick: ItemClickHander = (item: AlertActionInterface) => () => {\n    const { action, autoclose } = item;\n\n    if (autoclose) {\n      this.setState({ closing: true });\n      this.waitTransitionFinish((e?: TransitionEvent) => {\n        if (!e || e.propertyName === 'opacity') {\n          autoclose && this.props.onClose();\n          action && action();\n        }\n      });\n    } else {\n      action && action();\n    }\n  };\n\n  onClose: VoidFunction = () => {\n    this.setState({ closing: true });\n    this.waitTransitionFinish((e?: TransitionEvent) => {\n      if (!e || e.propertyName === 'opacity') {\n        this.props.onClose();\n      }\n    });\n  };\n\n  stopPropagation: React.MouseEventHandler = (e: React.SyntheticEvent) => {\n    e.stopPropagation();\n  };\n\n  waitTransitionFinish(eventHandler: TransitionEndHandler) {\n    if (transitionEvent.supported) {\n      this.element.current.removeEventListener(transitionEvent.name, eventHandler);\n      this.element.current.addEventListener(transitionEvent.name, eventHandler);\n    } else {\n      clearTimeout(this.transitionFinishTimeout);\n      this.transitionFinishTimeout = setTimeout(eventHandler.bind(this), this.timeout);\n    }\n  }\n\n  renderHeader(header: React.ReactNode) {\n    switch (this.props.platform) {\n      case VKCOM:\n        return <Headline vkuiClass=\"Alert__header\" weight=\"medium\">{header}</Headline>;\n      case IOS:\n        return <Title vkuiClass=\"Alert__header\" weight=\"semibold\" level=\"3\">{header}</Title>;\n      case ANDROID:\n        return <Title vkuiClass=\"Alert__header\" weight=\"medium\" level=\"2\">{header}</Title>;\n    }\n  }\n\n  renderText(text: React.ReactNode) {\n    switch (this.props.platform) {\n      case VKCOM:\n        return <Caption vkuiClass=\"Alert__text\" level=\"1\" weight=\"regular\">{text}</Caption>;\n      case IOS:\n        return <Caption vkuiClass=\"Alert__text\" level=\"2\" weight=\"regular\">{text}</Caption>;\n      case ANDROID:\n        return <Headline vkuiClass=\"Alert__text\" weight=\"regular\">{text}</Headline>;\n    }\n  }\n\n  renderAction = (action: AlertActionInterface, i: number) => {\n    const { platform } = this.props;\n\n    if (platform === IOS) {\n      const { Component = 'button' } = action;\n      return (\n        <Tappable\n          Component={action.href ? 'a' : Component}\n          vkuiClass={classNames('Alert__action', `Alert__action--${action.mode}`)}\n          onClick={this.onItemClick(action)}\n          href={action.href}\n          key={`alert-action-${i}`}\n          target={action.target}\n        >\n          {action.title}\n        </Tappable>\n      );\n    }\n\n    let mode: ButtonProps['mode'] = action.mode === 'cancel' ? 'secondary' : 'primary';\n\n    if (platform === ANDROID) {\n      mode = 'tertiary';\n\n      if (this.props.viewWidth === ViewWidth.DESKTOP && action.mode === 'destructive') {\n        mode = 'destructive';\n      }\n    }\n\n    return (\n      <Button\n        vkuiClass={classNames('Alert__button', `Alert__button--${action.mode}`)}\n        mode={mode}\n        size=\"m\"\n        onClick={this.onItemClick(action)}\n        Component={action.Component}\n        href={action.href}\n        key={`alert-action-${i}`}\n        target={action.target}\n      >\n        {action.title}\n      </Button>\n    );\n  };\n\n  render() {\n    const { actions, actionsLayout, children, className, style, platform, viewWidth, text, header, ...restProps } = this.props;\n    const { closing } = this.state;\n\n    const resolvedActionsLayout: AlertProps['actionsLayout'] = platform === VKCOM ? 'horizontal' : actionsLayout;\n    const canShowCloseButton = platform === VKCOM || platform === ANDROID && viewWidth >= ViewWidth.SMALL_TABLET;\n    const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET;\n\n    return (\n      <PopoutWrapper\n        className={className}\n        closing={closing}\n        style={style}\n        onClick={this.onClose}\n      >\n        <FocusTrap\n          {...restProps}\n          getRootRef={this.element}\n          onClick={this.stopPropagation}\n          onClose={this.onClose}\n          timeout={this.timeout}\n          vkuiClass={classNames(getClassName('Alert', platform), {\n            'Alert--v': resolvedActionsLayout === 'vertical',\n            'Alert--h': resolvedActionsLayout === 'horizontal',\n            'Alert--closing': closing,\n            'Alert--desktop': isDesktop,\n          })}\n        >\n          {canShowCloseButton && <ModalDismissButton onClick={this.onClose} />}\n          <div vkuiClass=\"Alert__content\">\n            {hasReactNode(header) && this.renderHeader(header)}\n            {hasReactNode(text) && this.renderText(text)}\n            {children}\n          </div>\n          <footer vkuiClass=\"Alert__actions\">\n            {actions.map(this.renderAction)}\n          </footer>\n        </FocusTrap>\n      </PopoutWrapper>\n    );\n  }\n}\n\nexport default withPlatform(withAdaptivity(Alert, {\n  viewWidth: true,\n}));\n"],"file":"Alert.js"}

package/dist/cjs/components/AppRoot/AppRoot.js

@@ -175,7 +175,8 @@ var AppRoot = (0, _withAdaptivity.withAdaptivity)(function (_ref) {
     value: {
       appRoot: rootRef,
       portalRoot: portalRoot,
-      embedded: mode === 'embedded'
+      embedded: mode === 'embedded',
+      keyboardInput: isKeyboardInputActive
     }
   }, (0, _jsxRuntime.createScopedElement)(_ScrollContext.ScrollContext.Provider, {
     value: scrollController

package/dist/cjs/components/AppRoot/AppRoot.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/AppRoot/AppRoot.tsx"],"names":["warn","AppRoot","children","_mode","mode","_embedded","embedded","sizeX","hasMouse","noLegacyClasses","scroll","props","isKeyboardInputActive","rootRef","React","useRef","useState","portalRoot","setPortalRoot","window","document","insets","initialized","current","documentElement","classList","add","classScopingMode","noConflict","process","env","NODE_ENV","noop","portal","createElement","body","appendChild","parentElement","removeChild","parent","classes","concat","remove","key","hasOwnProperty","inset","style","setProperty","removeProperty","SizeType","REGULAR","container","scrollController","useMemo","content","appRoot"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useDOM } from '../../lib/dom';\nimport { classNames } from '../../lib/classNames';\nimport { AppRootContext } from './AppRootContext';\nimport { withAdaptivity, SizeType, AdaptivityProps } from '../../hoc/withAdaptivity';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { classScopingMode } from '../../lib/classScopingMode';\nimport { IconSettingsProvider } from '@vkontakte/icons';\nimport { elementScrollController, globalScrollController, ScrollContext, ScrollContextInterface } from './ScrollContext';\nimport { noop } from '../../lib/utils';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { useKeyboardInputTracker } from '../../hooks/useKeyboardInputTracker';\nimport { useInsets } from '../../hooks/useInsets';\nimport { Insets } from '@vkontakte/vk-bridge';\nimport './AppRoot.css';\n\n// Используйте classList, но будьте осторожны\n/* eslint-disable no-restricted-properties */\n\nexport interface AppRootProps extends React.HTMLAttributes<HTMLDivElement>, Pick<AdaptivityProps, 'sizeX' | 'hasMouse'> {\n  /** @deprecated Use mode=\"embedded\" */\n  embedded?: boolean;\n  /** Режим встраивания */\n  mode?: 'partial' | 'embedded' | 'full';\n  window?: Window;\n  /** Убирает классы без префикса (.Button) */\n  noLegacyClasses?: boolean;\n  scroll?: 'global' | 'contain';\n}\n\nconst warn = warnOnce('AppRoot');\nexport const AppRoot: React.FC<AppRootProps> = withAdaptivity(({\n  children, mode: _mode, embedded: _embedded, sizeX, hasMouse, noLegacyClasses = false, scroll = 'global',\n  ...props\n}: AppRootProps) => {\n  // normalize mode\n  const mode = _mode || (_embedded ? 'embedded' : 'full');\n  const isKeyboardInputActive = useKeyboardInputTracker();\n  const rootRef = React.useRef<HTMLDivElement>();\n  const [portalRoot, setPortalRoot] = React.useState<HTMLDivElement>(null);\n  const { window, document } = useDOM();\n  const insets = useInsets();\n\n  const initialized = React.useRef(false);\n  if (!initialized.current) {\n    if (window && mode === 'full') {\n      document.documentElement.classList.add('vkui');\n    }\n    classScopingMode.noConflict = noLegacyClasses;\n    initialized.current = true;\n  }\n\n  if (process.env.NODE_ENV === 'development') {\n    if (scroll !== 'global' && mode !== 'embedded') {\n      warn('Scroll modes only supported in embedded mode');\n    }\n    if (_mode && _embedded) {\n      warn(`mode=\"${mode}\" overrides embedded`);\n    }\n  }\n\n  // setup portal\n  useIsomorphicLayoutEffect(() => {\n    if (mode === 'full') {\n      return noop;\n    }\n\n    const portal = document.createElement('div');\n    portal.classList.add('vkui__portal-root');\n    document.body.appendChild(portal);\n    setPortalRoot(portal);\n    return () => portal.parentElement.removeChild(portal);\n  }, []);\n\n  // setup root classes\n  useIsomorphicLayoutEffect(() => {\n    if (mode === 'partial') {\n      return noop;\n    }\n\n    const parent = rootRef.current.parentElement;\n    const classes = ['vkui__root'].concat(mode === 'embedded' ? 'vkui__root--embedded' : []);\n    parent.classList.add(...classes);\n\n    return () => {\n      parent.classList.remove(...classes);\n      if (mode === 'full') {\n        document.documentElement.classList.remove('vkui');\n      }\n    };\n  }, []);\n\n  // setup insets\n  useIsomorphicLayoutEffect(() => {\n    if (mode === 'partial') {\n      return noop;\n    }\n\n    const parent = rootRef.current.parentElement;\n\n    for (const key in insets) {\n      if (insets.hasOwnProperty(key) && typeof insets[key as keyof Insets] === 'number') {\n        const inset = insets[key as keyof Insets];\n        parent.style.setProperty(`--safe-area-inset-${key}`, `${inset}px`);\n        portalRoot && portalRoot.style.setProperty(`--safe-area-inset-${key}`, `${inset}px`);\n      }\n    }\n\n    return () => {\n      for (const key in insets) {\n        if (insets.hasOwnProperty(key)) {\n          parent.style.removeProperty(`--safe-area-inset-${key}`);\n          portalRoot && portalRoot.style.removeProperty(`--safe-area-inset-${key}`);\n        }\n      }\n    };\n  }, [insets, portalRoot]);\n\n  // adaptivity handler\n  useIsomorphicLayoutEffect(() => {\n    if (mode === 'partial' || sizeX !== SizeType.REGULAR) {\n      return noop;\n    }\n    const container = mode === 'embedded' ? rootRef.current.parentElement : document.body;\n    container.classList.add('vkui--sizeX-regular');\n    return () => container.classList.remove('vkui--sizeX-regular');\n  }, [sizeX]);\n\n  const scrollController = React.useMemo<ScrollContextInterface>(\n    () => scroll === 'contain' ? elementScrollController(rootRef) : globalScrollController(window, document),\n    [scroll]);\n\n  const content = (\n    <AppRootContext.Provider value={{\n      appRoot: rootRef,\n      portalRoot: portalRoot,\n      embedded: mode === 'embedded',\n    }}>\n      <ScrollContext.Provider value={scrollController}>\n        <IconSettingsProvider classPrefix=\"vkui\" globalClasses={!noLegacyClasses}>\n          {children}\n        </IconSettingsProvider>\n      </ScrollContext.Provider>\n    </AppRootContext.Provider>\n  );\n\n  return mode === 'partial' ? content : (\n    <div ref={rootRef} vkuiClass={classNames('AppRoot', {\n      'AppRoot--no-mouse': !hasMouse,\n      'AppRoot--keyboard-input': isKeyboardInputActive,\n    })} {...props}>\n      {content}\n    </div>\n  );\n}, {\n  sizeX: true,\n  hasMouse: true,\n});\n\nexport default AppRoot;\n"],"file":"AppRoot.js"}
+{"version":3,"sources":["../../../../src/components/AppRoot/AppRoot.tsx"],"names":["warn","AppRoot","children","_mode","mode","_embedded","embedded","sizeX","hasMouse","noLegacyClasses","scroll","props","isKeyboardInputActive","rootRef","React","useRef","useState","portalRoot","setPortalRoot","window","document","insets","initialized","current","documentElement","classList","add","classScopingMode","noConflict","process","env","NODE_ENV","noop","portal","createElement","body","appendChild","parentElement","removeChild","parent","classes","concat","remove","key","hasOwnProperty","inset","style","setProperty","removeProperty","SizeType","REGULAR","container","scrollController","useMemo","content","appRoot","keyboardInput"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useDOM } from '../../lib/dom';\nimport { classNames } from '../../lib/classNames';\nimport { AppRootContext } from './AppRootContext';\nimport { withAdaptivity, SizeType, AdaptivityProps } from '../../hoc/withAdaptivity';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { classScopingMode } from '../../lib/classScopingMode';\nimport { IconSettingsProvider } from '@vkontakte/icons';\nimport { elementScrollController, globalScrollController, ScrollContext, ScrollContextInterface } from './ScrollContext';\nimport { noop } from '../../lib/utils';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { useKeyboardInputTracker } from '../../hooks/useKeyboardInputTracker';\nimport { useInsets } from '../../hooks/useInsets';\nimport { Insets } from '@vkontakte/vk-bridge';\nimport './AppRoot.css';\n\n// Используйте classList, но будьте осторожны\n/* eslint-disable no-restricted-properties */\n\nexport interface AppRootProps extends React.HTMLAttributes<HTMLDivElement>, Pick<AdaptivityProps, 'sizeX' | 'hasMouse'> {\n  /** @deprecated Use mode=\"embedded\" */\n  embedded?: boolean;\n  /** Режим встраивания */\n  mode?: 'partial' | 'embedded' | 'full';\n  window?: Window;\n  /** Убирает классы без префикса (.Button) */\n  noLegacyClasses?: boolean;\n  scroll?: 'global' | 'contain';\n}\n\nconst warn = warnOnce('AppRoot');\nexport const AppRoot: React.FC<AppRootProps> = withAdaptivity(({\n  children, mode: _mode, embedded: _embedded, sizeX, hasMouse, noLegacyClasses = false, scroll = 'global',\n  ...props\n}: AppRootProps) => {\n  // normalize mode\n  const mode = _mode || (_embedded ? 'embedded' : 'full');\n  const isKeyboardInputActive = useKeyboardInputTracker();\n  const rootRef = React.useRef<HTMLDivElement>();\n  const [portalRoot, setPortalRoot] = React.useState<HTMLDivElement>(null);\n  const { window, document } = useDOM();\n  const insets = useInsets();\n\n  const initialized = React.useRef(false);\n  if (!initialized.current) {\n    if (window && mode === 'full') {\n      document.documentElement.classList.add('vkui');\n    }\n    classScopingMode.noConflict = noLegacyClasses;\n    initialized.current = true;\n  }\n\n  if (process.env.NODE_ENV === 'development') {\n    if (scroll !== 'global' && mode !== 'embedded') {\n      warn('Scroll modes only supported in embedded mode');\n    }\n    if (_mode && _embedded) {\n      warn(`mode=\"${mode}\" overrides embedded`);\n    }\n  }\n\n  // setup portal\n  useIsomorphicLayoutEffect(() => {\n    if (mode === 'full') {\n      return noop;\n    }\n\n    const portal = document.createElement('div');\n    portal.classList.add('vkui__portal-root');\n    document.body.appendChild(portal);\n    setPortalRoot(portal);\n    return () => portal.parentElement.removeChild(portal);\n  }, []);\n\n  // setup root classes\n  useIsomorphicLayoutEffect(() => {\n    if (mode === 'partial') {\n      return noop;\n    }\n\n    const parent = rootRef.current.parentElement;\n    const classes = ['vkui__root'].concat(mode === 'embedded' ? 'vkui__root--embedded' : []);\n    parent.classList.add(...classes);\n\n    return () => {\n      parent.classList.remove(...classes);\n      if (mode === 'full') {\n        document.documentElement.classList.remove('vkui');\n      }\n    };\n  }, []);\n\n  // setup insets\n  useIsomorphicLayoutEffect(() => {\n    if (mode === 'partial') {\n      return noop;\n    }\n\n    const parent = rootRef.current.parentElement;\n\n    for (const key in insets) {\n      if (insets.hasOwnProperty(key) && typeof insets[key as keyof Insets] === 'number') {\n        const inset = insets[key as keyof Insets];\n        parent.style.setProperty(`--safe-area-inset-${key}`, `${inset}px`);\n        portalRoot && portalRoot.style.setProperty(`--safe-area-inset-${key}`, `${inset}px`);\n      }\n    }\n\n    return () => {\n      for (const key in insets) {\n        if (insets.hasOwnProperty(key)) {\n          parent.style.removeProperty(`--safe-area-inset-${key}`);\n          portalRoot && portalRoot.style.removeProperty(`--safe-area-inset-${key}`);\n        }\n      }\n    };\n  }, [insets, portalRoot]);\n\n  // adaptivity handler\n  useIsomorphicLayoutEffect(() => {\n    if (mode === 'partial' || sizeX !== SizeType.REGULAR) {\n      return noop;\n    }\n    const container = mode === 'embedded' ? rootRef.current.parentElement : document.body;\n    container.classList.add('vkui--sizeX-regular');\n    return () => container.classList.remove('vkui--sizeX-regular');\n  }, [sizeX]);\n\n  const scrollController = React.useMemo<ScrollContextInterface>(\n    () => scroll === 'contain' ? elementScrollController(rootRef) : globalScrollController(window, document),\n    [scroll]);\n\n  const content = (\n    <AppRootContext.Provider value={{\n      appRoot: rootRef,\n      portalRoot: portalRoot,\n      embedded: mode === 'embedded',\n      keyboardInput: isKeyboardInputActive,\n    }}>\n      <ScrollContext.Provider value={scrollController}>\n        <IconSettingsProvider classPrefix=\"vkui\" globalClasses={!noLegacyClasses}>\n          {children}\n        </IconSettingsProvider>\n      </ScrollContext.Provider>\n    </AppRootContext.Provider>\n  );\n\n  return mode === 'partial' ? content : (\n    <div ref={rootRef} vkuiClass={classNames('AppRoot', {\n      'AppRoot--no-mouse': !hasMouse,\n      'AppRoot--keyboard-input': isKeyboardInputActive,\n    })} {...props}>\n      {content}\n    </div>\n  );\n}, {\n  sizeX: true,\n  hasMouse: true,\n});\n\nexport default AppRoot;\n"],"file":"AppRoot.js"}

package/dist/cjs/components/AppRoot/AppRootContext.d.ts

@@ -3,5 +3,6 @@ export interface AppRootContextInterface {
     appRoot?: React.RefObject<HTMLDivElement>;
     portalRoot?: HTMLDivElement;
     embedded?: boolean;
+    keyboardInput?: boolean;
 }
 export declare const AppRootContext: React.Context<AppRootContextInterface>;

package/dist/cjs/components/AppRoot/AppRootContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/AppRoot/AppRootContext.ts"],"names":["AppRootContext","React","createContext","portalRoot"],"mappings":";;;;;;;;;AAAA;;AAQO,IAAMA,cAAc,gBAAGC,KAAK,CAACC,aAAN,CAA6C;AACzEC,EAAAA,UAAU,EAAE;AAD6D,CAA7C,CAAvB","sourcesContent":["import * as React from 'react';\n\nexport interface AppRootContextInterface {\n  appRoot?: React.RefObject<HTMLDivElement>;\n  portalRoot?: HTMLDivElement;\n  embedded?: boolean;\n}\n\nexport const AppRootContext = React.createContext<AppRootContextInterface>({\n  portalRoot: null,\n});\n"],"file":"AppRootContext.js"}
+{"version":3,"sources":["../../../../src/components/AppRoot/AppRootContext.ts"],"names":["AppRootContext","React","createContext","portalRoot"],"mappings":";;;;;;;;;AAAA;;AASO,IAAMA,cAAc,gBAAGC,KAAK,CAACC,aAAN,CAA6C;AACzEC,EAAAA,UAAU,EAAE;AAD6D,CAA7C,CAAvB","sourcesContent":["import * as React from 'react';\n\nexport interface AppRootContextInterface {\n  appRoot?: React.RefObject<HTMLDivElement>;\n  portalRoot?: HTMLDivElement;\n  embedded?: boolean;\n  keyboardInput?: boolean;\n}\n\nexport const AppRootContext = React.createContext<AppRootContextInterface>({\n  portalRoot: null,\n});\n"],"file":"AppRootContext.js"}

package/dist/cjs/components/Avatar/Avatar.d.ts

@@ -10,4 +10,6 @@ export interface AvatarProps extends React.ImgHTMLAttributes<HTMLElement>, HasRo
     shadow?: boolean;
 }
 declare const Avatar: React.FC<AvatarProps>;
+export declare const AVATAR_DEFAULT_SIZE = 48;
+export declare const AVATAR_DEFAULT_SHADOW = true;
 export default Avatar;

package/dist/cjs/components/Avatar/Avatar.js

@@ -7,7 +7,7 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWild
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = exports.AVATAR_DEFAULT_SHADOW = exports.AVATAR_DEFAULT_SIZE = void 0;
 
 var _jsxRuntime = require("../../lib/jsxRuntime");
 
@@ -123,10 +123,14 @@ var Avatar = function Avatar(_ref) {
   }, children));
 };
 
+var AVATAR_DEFAULT_SIZE = 48;
+exports.AVATAR_DEFAULT_SIZE = AVATAR_DEFAULT_SIZE;
+var AVATAR_DEFAULT_SHADOW = true;
+exports.AVATAR_DEFAULT_SHADOW = AVATAR_DEFAULT_SHADOW;
 Avatar.defaultProps = {
-  size: 48,
+  size: AVATAR_DEFAULT_SIZE,
   mode: 'default',
-  shadow: true
+  shadow: AVATAR_DEFAULT_SHADOW
 };
 var _default = Avatar;
 exports.default = _default;

package/dist/cjs/components/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Avatar/Avatar.tsx"],"names":["Avatar","alt","crossOrigin","decoding","height","loading","referrerPolicy","sizes","src","srcSet","useMap","width","getRef","size","shadow","mode","className","children","getRootRef","style","ariaLabel","restProps","platform","React","useState","failedImage","setFailedImage","onImageError","onImageLoad","borderRadius","hasSrc","defaultProps"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasRef, HasRootRef } from '../../types';\nimport './Avatar.css';\n\nexport interface AvatarProps extends React.ImgHTMLAttributes<HTMLElement>, HasRootRef<HTMLDivElement>, HasRef<HTMLImageElement> {\n  /**\n   * Рекомендуемый сет значений: 96 | 88 | 80 | 72 | 64 | 56 | 48 | 44 | 40 | 36 | 32 | 28 | 24\n   */\n  size?: number;\n  mode?: 'default' | 'image' | 'app';\n  shadow?: boolean;\n}\n\nconst Avatar: React.FC<AvatarProps> = ({\n  alt,\n  crossOrigin,\n  decoding,\n  height,\n  loading,\n  referrerPolicy,\n  sizes,\n  src,\n  srcSet,\n  useMap,\n  width,\n  getRef,\n  size,\n  shadow,\n  mode,\n  className,\n  children,\n  getRootRef,\n  style,\n  'aria-label': ariaLabel,\n  ...restProps\n}: AvatarProps) => {\n  const platform = usePlatform();\n  const [failedImage, setFailedImage] = React.useState(false);\n\n  const onImageError = () => {\n    setFailedImage(true);\n  };\n\n  const onImageLoad = () => {\n    setFailedImage(false);\n  };\n\n  let borderRadius: string | number = '50%';\n\n  switch (mode) {\n    case 'image':\n      size < 64 && (borderRadius = 4);\n      size >= 64 && size < 96 && (borderRadius = 6);\n      size >= 96 && (borderRadius = 8);\n      break;\n    case 'app':\n      size <= 40 && (borderRadius = 8);\n      size > 40 && size < 56 && (borderRadius = 10);\n      size >= 56 && size < 64 && (borderRadius = 12);\n      size >= 64 && size < 84 && (borderRadius = 16);\n      size >= 84 && (borderRadius = 18);\n      break;\n    default:\n      break;\n  }\n\n  const hasSrc = src || srcSet;\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(getClassName('Avatar', platform), `Avatar--type-${mode}`, `Avatar--sz-${size}`, {\n        'Avatar--shadow': shadow,\n        'Avatar--failed': failedImage,\n      })}\n      className={className}\n      ref={getRootRef}\n      role={hasSrc ? 'img' : 'presentation'}\n      aria-label={alt || ariaLabel}\n      style={{ ...style, width: size, height: size, borderRadius }}\n    >\n      {hasSrc &&\n        <img\n          crossOrigin={crossOrigin}\n          decoding={decoding}\n          height={height}\n          loading={loading}\n          referrerPolicy={referrerPolicy}\n          sizes={sizes}\n          src={src}\n          srcSet={srcSet}\n          useMap={useMap}\n          width={width}\n          ref={getRef}\n          onError={onImageError}\n          onLoad={onImageLoad}\n          vkuiClass=\"Avatar__img\"\n          alt=\"\"\n        />\n      }\n      {children && <div vkuiClass=\"Avatar__children\">{children}</div>}\n    </div>\n  );\n};\n\nAvatar.defaultProps = {\n  size: 48,\n  mode: 'default',\n  shadow: true,\n};\n\nexport default Avatar;\n"],"file":"Avatar.js"}
+{"version":3,"sources":["../../../../src/components/Avatar/Avatar.tsx"],"names":["Avatar","alt","crossOrigin","decoding","height","loading","referrerPolicy","sizes","src","srcSet","useMap","width","getRef","size","shadow","mode","className","children","getRootRef","style","ariaLabel","restProps","platform","React","useState","failedImage","setFailedImage","onImageError","onImageLoad","borderRadius","hasSrc","AVATAR_DEFAULT_SIZE","AVATAR_DEFAULT_SHADOW","defaultProps"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasRef, HasRootRef } from '../../types';\nimport './Avatar.css';\n\nexport interface AvatarProps extends React.ImgHTMLAttributes<HTMLElement>, HasRootRef<HTMLDivElement>, HasRef<HTMLImageElement> {\n  /**\n   * Рекомендуемый сет значений: 96 | 88 | 80 | 72 | 64 | 56 | 48 | 44 | 40 | 36 | 32 | 28 | 24\n   */\n  size?: number;\n  mode?: 'default' | 'image' | 'app';\n  shadow?: boolean;\n}\n\nconst Avatar: React.FC<AvatarProps> = ({\n  alt,\n  crossOrigin,\n  decoding,\n  height,\n  loading,\n  referrerPolicy,\n  sizes,\n  src,\n  srcSet,\n  useMap,\n  width,\n  getRef,\n  size,\n  shadow,\n  mode,\n  className,\n  children,\n  getRootRef,\n  style,\n  'aria-label': ariaLabel,\n  ...restProps\n}: AvatarProps) => {\n  const platform = usePlatform();\n  const [failedImage, setFailedImage] = React.useState(false);\n\n  const onImageError = () => {\n    setFailedImage(true);\n  };\n\n  const onImageLoad = () => {\n    setFailedImage(false);\n  };\n\n  let borderRadius: string | number = '50%';\n\n  switch (mode) {\n    case 'image':\n      size < 64 && (borderRadius = 4);\n      size >= 64 && size < 96 && (borderRadius = 6);\n      size >= 96 && (borderRadius = 8);\n      break;\n    case 'app':\n      size <= 40 && (borderRadius = 8);\n      size > 40 && size < 56 && (borderRadius = 10);\n      size >= 56 && size < 64 && (borderRadius = 12);\n      size >= 64 && size < 84 && (borderRadius = 16);\n      size >= 84 && (borderRadius = 18);\n      break;\n    default:\n      break;\n  }\n\n  const hasSrc = src || srcSet;\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(getClassName('Avatar', platform), `Avatar--type-${mode}`, `Avatar--sz-${size}`, {\n        'Avatar--shadow': shadow,\n        'Avatar--failed': failedImage,\n      })}\n      className={className}\n      ref={getRootRef}\n      role={hasSrc ? 'img' : 'presentation'}\n      aria-label={alt || ariaLabel}\n      style={{ ...style, width: size, height: size, borderRadius }}\n    >\n      {hasSrc &&\n        <img\n          crossOrigin={crossOrigin}\n          decoding={decoding}\n          height={height}\n          loading={loading}\n          referrerPolicy={referrerPolicy}\n          sizes={sizes}\n          src={src}\n          srcSet={srcSet}\n          useMap={useMap}\n          width={width}\n          ref={getRef}\n          onError={onImageError}\n          onLoad={onImageLoad}\n          vkuiClass=\"Avatar__img\"\n          alt=\"\"\n        />\n      }\n      {children && <div vkuiClass=\"Avatar__children\">{children}</div>}\n    </div>\n  );\n};\n\nexport const AVATAR_DEFAULT_SIZE = 48;\nexport const AVATAR_DEFAULT_SHADOW = true;\n\nAvatar.defaultProps = {\n  size: AVATAR_DEFAULT_SIZE,\n  mode: 'default',\n  shadow: AVATAR_DEFAULT_SHADOW,\n};\n\nexport default Avatar;\n"],"file":"Avatar.js"}

package/dist/cjs/components/Banner/Banner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Banner/Banner.tsx"],"names":["BannerHeader","size","restProps","BannerSubheader","Banner","props","platform","mode","imageTheme","before","asideMode","header","subheader","text","children","background","actions","onDismiss","dismissLabel","IOS","React","Children","count","ANDROID","VKCOM","defaultProps"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { ANDROID, IOS, VKCOM } from '../../lib/platform';\nimport { hasReactNode } from '../../lib/utils';\nimport { Icon24Chevron, Icon24DismissSubstract, Icon24DismissDark, Icon24Cancel } from '@vkontakte/icons';\nimport Tappable from '../Tappable/Tappable';\nimport IconButton from '../IconButton/IconButton';\nimport Headline from '../Typography/Headline/Headline';\nimport Subhead from '../Typography/Subhead/Subhead';\nimport Text from '../Typography/Text/Text';\nimport Title from '../Typography/Title/Title';\nimport './Banner.css';\n\nexport interface BannerProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Тип баннера.\n   */\n  mode?: 'tint' | 'image';\n  size?: 's' | 'm';\n  /**\n   * Тип действия в правой части баннера.\n   *\n   * - `dismiss` – отображается иконка крестика, при клике на неё сработает свойство `onDismiss`.\n   * - `expand` – отображается иконка шеврона, которая подразумевает, что при клике на баннер можно куда-то перейти.\n   */\n  asideMode?: 'dismiss' | 'expand';\n  /**\n   * Срабатывает при клике на иконку крестика при `asideMode=\"dismiss\"`.\n   */\n  onDismiss?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * `aria-label` для кнопки при `asideMode=\"dismiss\". Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n  /**\n   * Содержимое, отображаемое в левой части баннера.\n   */\n  before?: React.ReactNode;\n  /**\n   * Заголовок. <br />\n   * При использовании этого свойства рекомендуется не указывать `text`.\n   */\n  header?: React.ReactNode;\n  /**\n   * Подзаголовок. <br />\n   * При использовании этого свойства рекомендуется не указывать `text`.\n   */\n  subheader?: React.ReactNode;\n  /**\n   * Текст баннера. <br />\n   * Это свойство следует использовать без указания `header` и `subheader`.\n   */\n  text?: React.ReactNode;\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * - `light` – в качестве фона используется светлое изображение, цвет текста в баннере будет тёмным.\n   * - `dark` – в качестве фона используется тёмное изображение, цвет текста будет светлым.\n   */\n  imageTheme?: 'light' | 'dark';\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * Элемент, который нужно стилизовать цветом и/или фоном. Этот элемент будет растянут на 100% ширины и высоты баннера.\n   */\n  background?: React.ReactNode;\n  /**\n   * Кнопки, отображаемые в баннере.\n   *\n   * - В режиме `tint` или в `image` со светлым фоном рекомендуется использовать только `<Button mode=\"primary\" />` или `<Button mode=\"tertiary\" hasHover={false} />`.\n   * - В режиме `image` с тёмным фоном – `<Button mode=\"overlay_primary\" />`.\n   */\n  actions?: React.ReactNode;\n}\n\ninterface BannerTypographyProps extends Pick<BannerProps, 'size'> {\n  Component?: React.ElementType;\n}\n\nconst BannerHeader: React.FC<BannerTypographyProps> = ({ size, ...restProps }: BannerTypographyProps) => {\n  return size === 'm'\n    ? <Title level=\"2\" weight=\"medium\" {...restProps} />\n    : <Headline weight=\"medium\" {...restProps} />;\n};\n\nconst BannerSubheader: React.FC<BannerTypographyProps> = ({ size, ...restProps }: BannerTypographyProps) => {\n  return size === 'm'\n    ? <Text weight=\"regular\" {...restProps} />\n    : <Subhead weight=\"regular\" {...restProps} />;\n};\n\nconst Banner: React.FC<BannerProps> = (props: BannerProps) => {\n  const platform = usePlatform();\n  const {\n    mode, imageTheme, size, before, asideMode, header, subheader, text, children, background, actions,\n    onDismiss, dismissLabel,\n    ...restProps\n  } = props;\n\n  return (\n    <section\n      {...restProps}\n      vkuiClass={classNames(\n        getClassName('Banner', platform),\n        `Banner--md-${mode}`,\n        `Banner--sz-${size}`,\n        {\n          'Banner--inverted': mode === 'image' && imageTheme === 'dark',\n        },\n      )}\n    >\n      <Tappable\n        vkuiClass=\"Banner__in\"\n        activeMode={platform === IOS ? 'opacity' : 'background'}\n        disabled={asideMode !== 'expand'}\n        role={asideMode === 'expand' ? 'button' : null}\n      >\n        {mode === 'image' && background &&\n          <div aria-hidden=\"true\" vkuiClass=\"Banner__bg\">\n            {background}\n          </div>\n        }\n\n        {before && <div vkuiClass=\"Banner__before\">{before}</div>}\n\n        <div vkuiClass=\"Banner__content\">\n          {hasReactNode(header) && (\n            <BannerHeader size={size} Component=\"span\" vkuiClass=\"Banner__header\">{header}</BannerHeader>\n          )}\n          {hasReactNode(subheader) && (\n            <BannerSubheader Component=\"span\" size={size} vkuiClass=\"Banner__subheader\">{subheader}</BannerSubheader>\n          )}\n          {hasReactNode(text) && <Text weight=\"regular\" vkuiClass=\"Banner__text\">{text}</Text>}\n          {hasReactNode(actions) && React.Children.count(actions) > 0 && (\n            <div vkuiClass=\"Banner__actions\">{actions}</div>\n          )}\n        </div>\n\n        {!!asideMode && (\n          <div vkuiClass=\"Banner__aside\">\n            {asideMode === 'expand' && <Icon24Chevron />}\n\n            {asideMode === 'dismiss' && (\n              <IconButton\n                aria-label={dismissLabel}\n                vkuiClass=\"Banner__dismiss\"\n                onClick={onDismiss}\n                hoverMode=\"opacity\"\n                hasActive={false}\n              >\n                {(platform === ANDROID || platform === VKCOM) && <Icon24Cancel />}\n                {platform === IOS && (mode === 'image' ? <Icon24DismissDark /> : <Icon24DismissSubstract />)}\n              </IconButton>\n            )}\n          </div>\n        )}\n      </Tappable>\n    </section>\n  );\n};\n\nBanner.defaultProps = {\n  dismissLabel: 'Скрыть',\n  mode: 'tint',\n  size: 's',\n  imageTheme: 'dark',\n};\n\nexport default Banner;\n"],"file":"Banner.js"}
+{"version":3,"sources":["../../../../src/components/Banner/Banner.tsx"],"names":["BannerHeader","size","restProps","BannerSubheader","Banner","props","platform","mode","imageTheme","before","asideMode","header","subheader","text","children","background","actions","onDismiss","dismissLabel","IOS","React","Children","count","ANDROID","VKCOM","defaultProps"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { HasComponent } from '../../types';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { ANDROID, IOS, VKCOM } from '../../lib/platform';\nimport { hasReactNode } from '../../lib/utils';\nimport { Icon24Chevron, Icon24DismissSubstract, Icon24DismissDark, Icon24Cancel } from '@vkontakte/icons';\nimport Tappable from '../Tappable/Tappable';\nimport IconButton from '../IconButton/IconButton';\nimport Headline from '../Typography/Headline/Headline';\nimport Subhead from '../Typography/Subhead/Subhead';\nimport Text from '../Typography/Text/Text';\nimport Title from '../Typography/Title/Title';\nimport './Banner.css';\n\nexport interface BannerProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Тип баннера.\n   */\n  mode?: 'tint' | 'image';\n  size?: 's' | 'm';\n  /**\n   * Тип действия в правой части баннера.\n   *\n   * - `dismiss` – отображается иконка крестика, при клике на неё сработает свойство `onDismiss`.\n   * - `expand` – отображается иконка шеврона, которая подразумевает, что при клике на баннер можно куда-то перейти.\n   */\n  asideMode?: 'dismiss' | 'expand';\n  /**\n   * Срабатывает при клике на иконку крестика при `asideMode=\"dismiss\"`.\n   */\n  onDismiss?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * `aria-label` для кнопки при `asideMode=\"dismiss\". Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n  /**\n   * Содержимое, отображаемое в левой части баннера.\n   */\n  before?: React.ReactNode;\n  /**\n   * Заголовок. <br />\n   * При использовании этого свойства рекомендуется не указывать `text`.\n   */\n  header?: React.ReactNode;\n  /**\n   * Подзаголовок. <br />\n   * При использовании этого свойства рекомендуется не указывать `text`.\n   */\n  subheader?: React.ReactNode;\n  /**\n   * Текст баннера. <br />\n   * Это свойство следует использовать без указания `header` и `subheader`.\n   */\n  text?: React.ReactNode;\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * - `light` – в качестве фона используется светлое изображение, цвет текста в баннере будет тёмным.\n   * - `dark` – в качестве фона используется тёмное изображение, цвет текста будет светлым.\n   */\n  imageTheme?: 'light' | 'dark';\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * Элемент, который нужно стилизовать цветом и/или фоном. Этот элемент будет растянут на 100% ширины и высоты баннера.\n   */\n  background?: React.ReactNode;\n  /**\n   * Кнопки, отображаемые в баннере.\n   *\n   * - В режиме `tint` или в `image` со светлым фоном рекомендуется использовать только `<Button mode=\"primary\" />` или `<Button mode=\"tertiary\" hasHover={false} />`.\n   * - В режиме `image` с тёмным фоном – `<Button mode=\"overlay_primary\" />`.\n   */\n  actions?: React.ReactNode;\n}\n\ntype BannerTypographyProps = Pick<BannerProps, 'size'> & HasComponent;\n\nconst BannerHeader: React.FC<BannerTypographyProps> = ({ size, ...restProps }) => {\n  return size === 'm'\n    ? <Title level=\"2\" weight=\"medium\" {...restProps} />\n    : <Headline weight=\"medium\" {...restProps} />;\n};\n\nconst BannerSubheader: React.FC<BannerTypographyProps> = ({ size, ...restProps }) => {\n  return size === 'm'\n    ? <Text weight=\"regular\" {...restProps} />\n    : <Subhead weight=\"regular\" {...restProps} />;\n};\n\nconst Banner: React.FC<BannerProps> = (props: BannerProps) => {\n  const platform = usePlatform();\n  const {\n    mode, imageTheme, size, before, asideMode, header, subheader, text, children, background, actions,\n    onDismiss, dismissLabel,\n    ...restProps\n  } = props;\n\n  return (\n    <section\n      {...restProps}\n      vkuiClass={classNames(\n        getClassName('Banner', platform),\n        `Banner--md-${mode}`,\n        `Banner--sz-${size}`,\n        {\n          'Banner--inverted': mode === 'image' && imageTheme === 'dark',\n        },\n      )}\n    >\n      <Tappable\n        vkuiClass=\"Banner__in\"\n        activeMode={platform === IOS ? 'opacity' : 'background'}\n        disabled={asideMode !== 'expand'}\n        role={asideMode === 'expand' ? 'button' : null}\n      >\n        {mode === 'image' && background &&\n          <div aria-hidden=\"true\" vkuiClass=\"Banner__bg\">\n            {background}\n          </div>\n        }\n\n        {before && <div vkuiClass=\"Banner__before\">{before}</div>}\n\n        <div vkuiClass=\"Banner__content\">\n          {hasReactNode(header) && (\n            <BannerHeader size={size} Component=\"span\" vkuiClass=\"Banner__header\">{header}</BannerHeader>\n          )}\n          {hasReactNode(subheader) && (\n            <BannerSubheader Component=\"span\" size={size} vkuiClass=\"Banner__subheader\">{subheader}</BannerSubheader>\n          )}\n          {hasReactNode(text) && <Text weight=\"regular\" vkuiClass=\"Banner__text\">{text}</Text>}\n          {hasReactNode(actions) && React.Children.count(actions) > 0 && (\n            <div vkuiClass=\"Banner__actions\">{actions}</div>\n          )}\n        </div>\n\n        {!!asideMode && (\n          <div vkuiClass=\"Banner__aside\">\n            {asideMode === 'expand' && <Icon24Chevron />}\n\n            {asideMode === 'dismiss' && (\n              <IconButton\n                aria-label={dismissLabel}\n                vkuiClass=\"Banner__dismiss\"\n                onClick={onDismiss}\n                hoverMode=\"opacity\"\n                hasActive={false}\n              >\n                {(platform === ANDROID || platform === VKCOM) && <Icon24Cancel />}\n                {platform === IOS && (mode === 'image' ? <Icon24DismissDark /> : <Icon24DismissSubstract />)}\n              </IconButton>\n            )}\n          </div>\n        )}\n      </Tappable>\n    </section>\n  );\n};\n\nBanner.defaultProps = {\n  dismissLabel: 'Скрыть',\n  mode: 'tint',\n  size: 's',\n  imageTheme: 'dark',\n};\n\nexport default Banner;\n"],"file":"Banner.js"}