@vkontakte/vkui 4.19.0 → 4.22.0

package/dist/cjs/components/Removable/Removable.js

@@ -9,20 +9,22 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Removable = void 0;
 
-var _jsxRuntime = require("../../lib/jsxRuntime");
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
+var _jsxRuntime = require("../../lib/jsxRuntime");
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 var React = _interopRequireWildcard(require("react"));
 
 var _classNames = require("../../lib/classNames");
 
 var _utils = require("../../lib/utils");
 
+var _useExternRef = require("../../hooks/useExternRef");
+
 var _usePlatform = require("../../hooks/usePlatform");
 
 var _getClassName = require("../../helpers/getClassName");
@@ -41,111 +43,118 @@ var _useGlobalEventListener = require("../../hooks/useGlobalEventListener");
 
 var _Tappable = _interopRequireDefault(require("../Tappable/Tappable"));
 
-var _excluded = ["children", "onRemove", "removePlaceholder", "align"];
+var _excluded = ["getRootRef", "children", "onRemove", "removePlaceholder", "align"];
 
-var Removable = function Removable(_ref) {
-  var children = _ref.children,
-      onRemove = _ref.onRemove,
-      _ref$removePlaceholde = _ref.removePlaceholder,
-      removePlaceholder = _ref$removePlaceholde === void 0 ? 'Удалить' : _ref$removePlaceholde,
-      _ref$align = _ref.align,
-      align = _ref$align === void 0 ? 'center' : _ref$align,
-      restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var platform = (0, _usePlatform.usePlatform)();
-
-  var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
-      sizeY = _useAdaptivity.sizeY;
+var RemovableIos = function RemovableIos(_ref) {
+  var onRemoveClick = _ref.onRemoveClick,
+      removePlaceholder = _ref.removePlaceholder,
+      removePlaceholderString = _ref.removePlaceholderString,
+      children = _ref.children;
 
   var _useDOM = (0, _dom.useDOM)(),
       document = _useDOM.document;
 
   var removeButtonRef = React.useRef(null);
 
-  var _React$useState = React.useState(false),
+  var _React$useState = React.useState(0),
       _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      isRemoveActivated = _React$useState2[0],
-      setRemoveActivated = _React$useState2[1];
-
-  var _React$useState3 = React.useState(0),
-      _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
-      removeOffset = _React$useState4[0],
-      updateRemoveOffset = _React$useState4[1];
+      removeOffset = _React$useState2[0],
+      updateRemoveOffset = _React$useState2[1];
 
-  (0, _useGlobalEventListener.useGlobalEventListener)(document, 'click', isRemoveActivated && function () {
-    setRemoveActivated(false);
+  (0, _useGlobalEventListener.useGlobalEventListener)(document, 'click', removeOffset > 0 && function () {
     updateRemoveOffset(0);
   });
 
   var onRemoveTransitionEnd = function onRemoveTransitionEnd() {
-    if (isRemoveActivated) {
+    if (removeOffset > 0) {
       var _removeButtonRef$curr;
 
       removeButtonRef === null || removeButtonRef === void 0 ? void 0 : (_removeButtonRef$curr = removeButtonRef.current) === null || _removeButtonRef$curr === void 0 ? void 0 : _removeButtonRef$curr.focus();
     }
   };
 
-  var onRemoveActivateClick = function onRemoveActivateClick(e) {
-    e.nativeEvent.stopPropagation();
-    e.preventDefault();
-    setRemoveActivated(true);
-  };
+  var onRemoveActivateClick = function onRemoveActivateClick() {
+    var _removeButtonRef$curr2 = removeButtonRef === null || removeButtonRef === void 0 ? void 0 : removeButtonRef.current,
+        _removeButtonRef$curr3 = _removeButtonRef$curr2.offsetWidth,
+        offsetWidth = _removeButtonRef$curr3 === void 0 ? 0 : _removeButtonRef$curr3;
 
-  var onRemoveClick = function onRemoveClick(e) {
-    e.nativeEvent.stopImmediatePropagation();
-    e.preventDefault();
-    onRemove && onRemove(e);
+    updateRemoveOffset(offsetWidth);
   };
 
-  React.useEffect(function () {
-    var removeButton = removeButtonRef === null || removeButtonRef === void 0 ? void 0 : removeButtonRef.current;
-
-    if (isRemoveActivated && removeButton) {
-      updateRemoveOffset(removeButton.offsetWidth);
-    }
-  }, [isRemoveActivated]);
-  var removePlaceholderString = (0, _utils.getTitleFromChildren)(removePlaceholder);
-  return (0, _jsxRuntime.createScopedElement)("div", (0, _extends2.default)({}, restProps, {
-    vkuiClass: (0, _classNames.classNames)((0, _getClassName.getClassName)('Removable', platform), "Removable--".concat(align), "Removable--sizeY-".concat(sizeY))
-  }), (platform === _platform.ANDROID || platform === _platform.VKCOM) && (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: "Removable__content"
-  }, children, (0, _jsxRuntime.createScopedElement)(_IconButton.default, {
-    "aria-label": removePlaceholderString,
-    vkuiClass: "Removable__action",
-    onClick: onRemoveClick
-  }, (0, _jsxRuntime.createScopedElement)(_icons.Icon24Cancel, {
-    role: "presentation"
-  }))), platform === _platform.IOS && (0, _jsxRuntime.createScopedElement)(React.Fragment, null, (0, _jsxRuntime.createScopedElement)("div", {
+  return (0, _jsxRuntime.createScopedElement)("div", {
     vkuiClass: "Removable__content",
     style: {
-      transform: "translateX(-".concat(removeOffset, "px)")
-    }
+      transform: "translateX(-".concat(removeOffset !== null && removeOffset !== void 0 ? removeOffset : 0, "px)")
+    },
+    onTransitionEnd: onRemoveTransitionEnd
   }, (0, _jsxRuntime.createScopedElement)(_IconButton.default, {
     hasActive: false,
     hasHover: false,
     "aria-label": removePlaceholderString,
     vkuiClass: "Removable__action Removable__toggle",
-    onClick: onRemoveActivateClick
+    onClick: onRemoveActivateClick,
+    disabled: removeOffset > 0
   }, (0, _jsxRuntime.createScopedElement)("i", {
     vkuiClass: "Removable__toggle-in",
     role: "presentation"
   })), children, (0, _jsxRuntime.createScopedElement)("span", {
     vkuiClass: "Removable__offset",
     "aria-hidden": "true"
-  })), (0, _jsxRuntime.createScopedElement)(_Tappable.default, {
+  }), (0, _jsxRuntime.createScopedElement)(_Tappable.default, {
     Component: "button",
     hasActive: false,
     hasHover: false,
-    disabled: !isRemoveActivated,
+    disabled: removeOffset === 0,
     getRootRef: removeButtonRef,
     vkuiClass: "Removable__remove",
     onClick: onRemoveClick,
-    onTransitionEnd: onRemoveTransitionEnd,
-    style: {
-      transform: "translateX(-".concat(removeOffset, "px)")
-    }
+    onTransitionEnd: onRemoveTransitionEnd
   }, (0, _jsxRuntime.createScopedElement)("span", {
     vkuiClass: "Removable__remove-in"
-  }, removePlaceholder))));
+  }, removePlaceholder)));
+};
+
+var Removable = function Removable(_ref2) {
+  var getRootRef = _ref2.getRootRef,
+      children = _ref2.children,
+      _ref2$onRemove = _ref2.onRemove,
+      onRemove = _ref2$onRemove === void 0 ? _utils.noop : _ref2$onRemove,
+      _ref2$removePlacehold = _ref2.removePlaceholder,
+      removePlaceholder = _ref2$removePlacehold === void 0 ? 'Удалить' : _ref2$removePlacehold,
+      _ref2$align = _ref2.align,
+      align = _ref2$align === void 0 ? 'center' : _ref2$align,
+      restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+  var platform = (0, _usePlatform.usePlatform)();
+
+  var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
+      sizeY = _useAdaptivity.sizeY;
+
+  var ref = (0, _useExternRef.useExternRef)(getRootRef);
+
+  var onRemoveClick = function onRemoveClick(e) {
+    e.preventDefault();
+    onRemove(e);
+  };
+
+  var removePlaceholderString = (0, _utils.getTitleFromChildren)(removePlaceholder);
+  return (0, _jsxRuntime.createScopedElement)("div", (0, _extends2.default)({}, restProps, {
+    ref: ref,
+    vkuiClass: (0, _classNames.classNames)((0, _getClassName.getClassName)('Removable', platform), "Removable--".concat(align), "Removable--sizeY-".concat(sizeY))
+  }), (platform === _platform.ANDROID || platform === _platform.VKCOM) && (0, _jsxRuntime.createScopedElement)("div", {
+    vkuiClass: "Removable__content"
+  }, children, (0, _jsxRuntime.createScopedElement)(_IconButton.default, {
+    activeMode: "opacity",
+    hoverMode: "opacity",
+    vkuiClass: "Removable__action",
+    onClick: onRemoveClick,
+    "aria-label": removePlaceholderString
+  }, (0, _jsxRuntime.createScopedElement)(_icons.Icon24Cancel, {
+    role: "presentation"
+  }))), platform === _platform.IOS && (0, _jsxRuntime.createScopedElement)(RemovableIos, {
+    onRemoveClick: onRemoveClick,
+    removePlaceholder: removePlaceholder,
+    removePlaceholderString: removePlaceholderString
+  }, children));
 };
 
 exports.Removable = Removable;

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Removable/Removable.tsx"],"names":["Removable","children","onRemove","removePlaceholder","align","restProps","platform","sizeY","document","removeButtonRef","React","useRef","useState","isRemoveActivated","setRemoveActivated","removeOffset","updateRemoveOffset","onRemoveTransitionEnd","current","focus","onRemoveActivateClick","e","nativeEvent","stopPropagation","preventDefault","onRemoveClick","stopImmediatePropagation","useEffect","removeButton","offsetWidth","removePlaceholderString","ANDROID","VKCOM","IOS","transform"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { getTitleFromChildren } from '../../lib/utils';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getClassName } from '../../helpers/getClassName';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDOM } from '../../lib/dom';\nimport { ANDROID, IOS, VKCOM } from '../../lib/platform';\nimport { Icon24Cancel } from '@vkontakte/icons';\nimport IconButton from '../IconButton/IconButton';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport Tappable from '../Tappable/Tappable';\nimport './Removable.css';\n\nexport interface RemovableProps {\n  /**\n   * iOS only. Текст в выезжающей кнопке для удаления ячейки.\n   */\n  removePlaceholder?: React.ReactNode;\n  /**\n   * Коллбэк срабатывает при клике на контрол удаления.\n   */\n  onRemove?: (e: React.MouseEvent, rootEl?: HTMLElement) => void;\n}\n\ninterface RemovableOwnProps extends React.AllHTMLAttributes<HTMLElement>, RemovableProps {\n  /**\n   * Расположение кнопки удаления.\n   */\n  align?: 'start' | 'center';\n}\n\nexport const Removable: React.FC<RemovableOwnProps> = ({\n  children,\n  onRemove,\n  removePlaceholder = 'Удалить',\n  align = 'center',\n  ...restProps\n}: RemovableOwnProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n  const { document } = useDOM();\n\n  const removeButtonRef = React.useRef(null);\n\n  const [isRemoveActivated, setRemoveActivated] = React.useState(false);\n  const [removeOffset, updateRemoveOffset] = React.useState(0);\n\n  useGlobalEventListener(document, 'click', isRemoveActivated && (() => {\n    setRemoveActivated(false);\n    updateRemoveOffset(0);\n  }));\n\n  const onRemoveTransitionEnd = () => {\n    if (isRemoveActivated) {\n      removeButtonRef?.current?.focus();\n    }\n  };\n\n  const onRemoveActivateClick = (e: React.MouseEvent) => {\n    e.nativeEvent.stopPropagation();\n    e.preventDefault();\n    setRemoveActivated(true);\n  };\n\n  const onRemoveClick = (e: React.MouseEvent) => {\n    e.nativeEvent.stopImmediatePropagation();\n    e.preventDefault();\n    onRemove && onRemove(e);\n  };\n\n  React.useEffect(() => {\n    const removeButton = removeButtonRef?.current;\n\n    if (isRemoveActivated && removeButton) {\n      updateRemoveOffset(removeButton.offsetWidth);\n    }\n  }, [isRemoveActivated]);\n\n  const removePlaceholderString: string = getTitleFromChildren(removePlaceholder);\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(\n        getClassName('Removable', platform),\n        `Removable--${align}`,\n        `Removable--sizeY-${sizeY}`,\n      )}\n    >\n      {(platform === ANDROID || platform === VKCOM) && (\n        <div vkuiClass=\"Removable__content\">\n          {children}\n\n          <IconButton\n            aria-label={removePlaceholderString}\n            vkuiClass=\"Removable__action\"\n            onClick={onRemoveClick}\n          >\n            <Icon24Cancel role=\"presentation\" />\n          </IconButton>\n        </div>\n      )}\n\n      {platform === IOS && (\n        <React.Fragment>\n          <div vkuiClass=\"Removable__content\" style={{ transform: `translateX(-${removeOffset}px)` }}>\n            <IconButton\n              hasActive={false}\n              hasHover={false}\n              aria-label={removePlaceholderString}\n              vkuiClass=\"Removable__action Removable__toggle\"\n              onClick={onRemoveActivateClick}\n            >\n              <i vkuiClass=\"Removable__toggle-in\" role=\"presentation\" />\n            </IconButton>\n            {children}\n\n            <span vkuiClass=\"Removable__offset\" aria-hidden=\"true\"></span>\n          </div>\n\n          <Tappable\n            Component=\"button\"\n            hasActive={false}\n            hasHover={false}\n            disabled={!isRemoveActivated}\n            getRootRef={removeButtonRef}\n            vkuiClass=\"Removable__remove\"\n            onClick={onRemoveClick}\n            onTransitionEnd={onRemoveTransitionEnd}\n            style={{ transform: `translateX(-${removeOffset}px)` }}\n          >\n            <span vkuiClass=\"Removable__remove-in\">{removePlaceholder}</span>\n          </Tappable>\n        </React.Fragment>\n      )}\n    </div>\n  );\n};\n"],"file":"Removable.js"}
+{"version":3,"sources":["../../../../src/components/Removable/Removable.tsx"],"names":["RemovableIos","onRemoveClick","removePlaceholder","removePlaceholderString","children","document","removeButtonRef","React","useRef","useState","removeOffset","updateRemoveOffset","onRemoveTransitionEnd","current","focus","onRemoveActivateClick","offsetWidth","transform","Removable","getRootRef","onRemove","noop","align","restProps","platform","sizeY","ref","e","preventDefault","ANDROID","VKCOM","IOS"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { HasRootRef } from '../../types';\nimport { classNames } from '../../lib/classNames';\nimport { getTitleFromChildren, noop } from '../../lib/utils';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getClassName } from '../../helpers/getClassName';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDOM } from '../../lib/dom';\nimport { ANDROID, IOS, VKCOM } from '../../lib/platform';\nimport { Icon24Cancel } from '@vkontakte/icons';\nimport IconButton from '../IconButton/IconButton';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport Tappable from '../Tappable/Tappable';\nimport './Removable.css';\n\nexport interface RemovableProps {\n  /**\n   * iOS only. Текст в выезжающей кнопке для удаления ячейки.\n   */\n  removePlaceholder?: React.ReactNode;\n  /**\n   * Коллбэк срабатывает при клике на контрол удаления.\n   */\n  onRemove?: (e: React.MouseEvent, rootEl?: HTMLElement) => void;\n}\n\ninterface RemovableIosOwnProps extends Pick<RemovableProps, 'removePlaceholder'> {\n  onRemoveClick?: (e: React.MouseEvent, rootEl?: HTMLElement) => void;\n  removePlaceholderString?: string;\n}\n\nconst RemovableIos: React.FC<RemovableIosOwnProps> = ({\n  onRemoveClick,\n  removePlaceholder,\n  removePlaceholderString,\n  children,\n}) => {\n  const { document } = useDOM();\n\n  const removeButtonRef = React.useRef(null);\n  const [removeOffset, updateRemoveOffset] = React.useState(0);\n\n  useGlobalEventListener(document, 'click', removeOffset > 0 && (() => {\n    updateRemoveOffset(0);\n  }));\n\n  const onRemoveTransitionEnd = () => {\n    if (removeOffset > 0) {\n      removeButtonRef?.current?.focus();\n    }\n  };\n\n  const onRemoveActivateClick = () => {\n    const { offsetWidth = 0 } = removeButtonRef?.current;\n    updateRemoveOffset(offsetWidth);\n  };\n\n  return (\n    <div\n      vkuiClass=\"Removable__content\"\n      style={{ transform: `translateX(-${removeOffset ?? 0}px)` }}\n      onTransitionEnd={onRemoveTransitionEnd}\n    >\n      <IconButton\n        hasActive={false}\n        hasHover={false}\n        aria-label={removePlaceholderString}\n        vkuiClass=\"Removable__action Removable__toggle\"\n        onClick={onRemoveActivateClick}\n        disabled={removeOffset > 0}\n      >\n        <i vkuiClass=\"Removable__toggle-in\" role=\"presentation\" />\n      </IconButton>\n      {children}\n\n      <span vkuiClass=\"Removable__offset\" aria-hidden=\"true\"></span>\n\n      <Tappable\n        Component=\"button\"\n        hasActive={false}\n        hasHover={false}\n        disabled={removeOffset === 0}\n        getRootRef={removeButtonRef}\n        vkuiClass=\"Removable__remove\"\n        onClick={onRemoveClick}\n        onTransitionEnd={onRemoveTransitionEnd}\n      >\n        <span vkuiClass=\"Removable__remove-in\">{removePlaceholder}</span>\n      </Tappable>\n    </div>\n  );\n};\n\ninterface RemovableOwnProps extends React.AllHTMLAttributes<HTMLElement>, RemovableProps, HasRootRef<HTMLDivElement> {\n  /**\n   * Расположение кнопки удаления.\n   */\n  align?: 'start' | 'center';\n}\n\nexport const Removable: React.FC<RemovableOwnProps> = ({\n  getRootRef,\n  children,\n  onRemove = noop,\n  removePlaceholder = 'Удалить',\n  align = 'center',\n  ...restProps\n}: RemovableOwnProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n\n  const ref = useExternRef(getRootRef);\n\n  const onRemoveClick = (e: React.MouseEvent) => {\n    e.preventDefault();\n    onRemove(e);\n  };\n\n  const removePlaceholderString: string = getTitleFromChildren(removePlaceholder);\n\n  return (\n    <div\n      {...restProps}\n      ref={ref}\n      vkuiClass={classNames(\n        getClassName('Removable', platform),\n        `Removable--${align}`,\n        `Removable--sizeY-${sizeY}`,\n      )}\n    >\n      {(platform === ANDROID || platform === VKCOM) && (\n        <div vkuiClass=\"Removable__content\">\n          {children}\n\n          <IconButton\n            activeMode=\"opacity\"\n            hoverMode=\"opacity\"\n            vkuiClass=\"Removable__action\"\n            onClick={onRemoveClick}\n            aria-label={removePlaceholderString}\n          >\n            <Icon24Cancel role=\"presentation\" />\n          </IconButton>\n        </div>\n      )}\n\n      {platform === IOS && (\n        <RemovableIos\n          onRemoveClick={onRemoveClick}\n          removePlaceholder={removePlaceholder}\n          removePlaceholderString={removePlaceholderString}\n        >\n          {children}\n        </RemovableIos>\n      )}\n    </div>\n  );\n};\n"],"file":"Removable.js"}

package/dist/cjs/components/Root/Root.js

@@ -184,6 +184,7 @@ var Root = function Root(_ref) {
     }, (0, _jsxRuntime.createScopedElement)(_NavTransitionContext.NavTransitionProvider, {
       entering: transition && viewId === activeView
     }, (0, _jsxRuntime.createScopedElement)("div", {
+      vkuiClass: "Root__scrollCompensation",
       style: {
         marginTop: compensateScroll ? -scrolls[viewId] : null
       }

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"names":["warn","Root","popout","modal","children","_activeView","activeView","onTransition","nav","restProps","scroll","React","useContext","ScrollContext","platform","document","scrolls","useRef","current","viewNodes","ConfigProviderContext","transitionMotionEnabled","SplitColContext","animate","disableAnimation","views","Children","toArray","useState","transition","prevView","isBack","_setState","transitionTo","panel","viewIds","map","view","props","indexOf","getScroll","y","finishTransition","activeElement","blur","scrollTo","from","to","fallbackTransition","IOS","useEffect","clear","set","onAnimationEnd","e","includes","animationName","viewId","isTransitionTarget","compensateScroll","marginTop"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport { IOS } from '../../lib/platform';\nimport { ConfigProviderContext } from '../ConfigProvider/ConfigProviderContext';\nimport { SplitColContext } from '../SplitCol/SplitCol';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\nimport { NavTransitionProvider } from '../NavTransitionContext/NavTransitionContext';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport './Root.css';\n\nconst warn = warnOnce('Root');\n\nexport interface RootProps extends React.HTMLAttributes<HTMLDivElement>, NavIdProps {\n  activeView: string;\n  onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n   *\n   * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n   */\n  popout?: React.ReactNode;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n   *\n   * Свойство для отрисовки `ModalRoot`.\n   */\n  modal?: React.ReactNode;\n}\n\nexport interface RootState {\n  activeView: string;\n  transition: boolean;\n  isBack?: boolean;\n  prevView?: string;\n}\n\nconst Root: React.FC<RootProps> = ({\n  popout = null, modal, children,\n  activeView: _activeView, onTransition,\n  nav,\n  ...restProps\n}: RootProps) => {\n  const scroll = React.useContext(ScrollContext);\n  const platform = usePlatform();\n  const { document } = useDOM();\n  const scrolls = React.useRef<Record<string, number>>({}).current;\n  const viewNodes = React.useRef<Record<string, HTMLElement>>({}).current;\n\n  const { transitionMotionEnabled = true } = React.useContext(ConfigProviderContext);\n  const { animate } = React.useContext(SplitColContext);\n  const disableAnimation = !transitionMotionEnabled || !animate;\n\n  const views = React.Children.toArray(children) as React.ReactElement[];\n\n  const [{ prevView, activeView, transition, isBack }, _setState] = React.useState<RootState>({\n    activeView: _activeView,\n    transition: false,\n  });\n  const transitionTo = (panel: string) => {\n    if (panel !== activeView) {\n      const viewIds = views.map((view) => getNavId(view.props, warn));\n      const isBack = viewIds.indexOf(panel) < viewIds.indexOf(activeView);\n      scrolls[activeView] = scroll.getScroll().y;\n      _setState({ activeView: panel, prevView: activeView, transition: true, isBack });\n    }\n  };\n  const finishTransition = () => _setState({ activeView, prevView, isBack, transition: false });\n\n  useIsomorphicLayoutEffect(() => {\n    (document.activeElement as HTMLElement)?.blur();\n  }, [!!popout, activeView]);\n\n  // Нужен переход\n  useIsomorphicLayoutEffect(() => transitionTo(_activeView), [_activeView]);\n  useIsomorphicLayoutEffect(() => {\n    if (!transition && prevView) {\n      // Закончился переход\n      scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);\n      onTransition && onTransition({ isBack, from: prevView, to: activeView });\n    }\n  }, [transition]);\n\n  const fallbackTransition = useTimeout(finishTransition, platform === IOS ? 600 : 300);\n  React.useEffect(() => {\n    if (!transition) {\n      fallbackTransition.clear();\n      return;\n    }\n    disableAnimation ? finishTransition() : fallbackTransition.set();\n  }, [transition]);\n\n  const onAnimationEnd = (e: React.AnimationEvent) => {\n    if ([\n      'vkui-root-android-animation-hide-back',\n      'vkui-root-android-animation-show-forward',\n      'vkui-root-ios-animation-hide-back',\n      'vkui-root-ios-animation-show-forward',\n    ].includes(e.animationName)) {\n      finishTransition();\n    }\n  };\n\n  return (\n    <div {...restProps} vkuiClass={classNames(getClassName('Root', platform), {\n      'Root--transition': !disableAnimation && transition,\n      'Root--no-motion': disableAnimation,\n    })}>\n      {views.map((view) => {\n        const viewId = getNavId(view.props, warn);\n        if (viewId !== activeView && !(transition && viewId === prevView)) {\n          return null;\n        }\n        const isTransitionTarget = transition && viewId === (isBack ? prevView : activeView);\n        const compensateScroll = transition && (viewId === prevView || isBack && viewId === activeView);\n        return (\n          <div\n            key={viewId}\n            ref={(e) => viewNodes[viewId] = e}\n            onAnimationEnd={isTransitionTarget ? onAnimationEnd : null}\n            vkuiClass={classNames('Root__view', {\n              'Root__view--hide-back': transition && viewId === prevView && isBack,\n              'Root__view--hide-forward': transition && viewId === prevView && !isBack,\n              'Root__view--show-back': transition && viewId === activeView && isBack,\n              'Root__view--show-forward': transition && viewId === activeView && !isBack,\n              'Root__view--active': !transition && viewId === activeView,\n            })}\n          >\n            <NavTransitionProvider entering={transition && viewId === activeView}>\n              <div style={{ marginTop: compensateScroll ? -scrolls[viewId] : null }}>\n                {view}\n              </div>\n            </NavTransitionProvider>\n          </div>\n        );\n      })}\n      <AppRootPortal>\n        {!!popout && <div vkuiClass=\"Root__popout\">{popout}</div>}\n        {!!modal && <div vkuiClass=\"Root__modal\">{modal}</div>}\n      </AppRootPortal>\n    </div>\n  );\n};\n\nexport default Root;\n"],"file":"Root.js"}
+{"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"names":["warn","Root","popout","modal","children","_activeView","activeView","onTransition","nav","restProps","scroll","React","useContext","ScrollContext","platform","document","scrolls","useRef","current","viewNodes","ConfigProviderContext","transitionMotionEnabled","SplitColContext","animate","disableAnimation","views","Children","toArray","useState","transition","prevView","isBack","_setState","transitionTo","panel","viewIds","map","view","props","indexOf","getScroll","y","finishTransition","activeElement","blur","scrollTo","from","to","fallbackTransition","IOS","useEffect","clear","set","onAnimationEnd","e","includes","animationName","viewId","isTransitionTarget","compensateScroll","marginTop"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport { IOS } from '../../lib/platform';\nimport { ConfigProviderContext } from '../ConfigProvider/ConfigProviderContext';\nimport { SplitColContext } from '../SplitCol/SplitCol';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\nimport { NavTransitionProvider } from '../NavTransitionContext/NavTransitionContext';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport './Root.css';\n\nconst warn = warnOnce('Root');\n\nexport interface RootProps extends React.HTMLAttributes<HTMLDivElement>, NavIdProps {\n  activeView: string;\n  onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n   *\n   * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n   */\n  popout?: React.ReactNode;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n   *\n   * Свойство для отрисовки `ModalRoot`.\n   */\n  modal?: React.ReactNode;\n}\n\nexport interface RootState {\n  activeView: string;\n  transition: boolean;\n  isBack?: boolean;\n  prevView?: string;\n}\n\nconst Root: React.FC<RootProps> = ({\n  popout = null, modal, children,\n  activeView: _activeView, onTransition,\n  nav,\n  ...restProps\n}: RootProps) => {\n  const scroll = React.useContext(ScrollContext);\n  const platform = usePlatform();\n  const { document } = useDOM();\n  const scrolls = React.useRef<Record<string, number>>({}).current;\n  const viewNodes = React.useRef<Record<string, HTMLElement>>({}).current;\n\n  const { transitionMotionEnabled = true } = React.useContext(ConfigProviderContext);\n  const { animate } = React.useContext(SplitColContext);\n  const disableAnimation = !transitionMotionEnabled || !animate;\n\n  const views = React.Children.toArray(children) as React.ReactElement[];\n\n  const [{ prevView, activeView, transition, isBack }, _setState] = React.useState<RootState>({\n    activeView: _activeView,\n    transition: false,\n  });\n  const transitionTo = (panel: string) => {\n    if (panel !== activeView) {\n      const viewIds = views.map((view) => getNavId(view.props, warn));\n      const isBack = viewIds.indexOf(panel) < viewIds.indexOf(activeView);\n      scrolls[activeView] = scroll.getScroll().y;\n      _setState({ activeView: panel, prevView: activeView, transition: true, isBack });\n    }\n  };\n  const finishTransition = () => _setState({ activeView, prevView, isBack, transition: false });\n\n  useIsomorphicLayoutEffect(() => {\n    (document.activeElement as HTMLElement)?.blur();\n  }, [!!popout, activeView]);\n\n  // Нужен переход\n  useIsomorphicLayoutEffect(() => transitionTo(_activeView), [_activeView]);\n  useIsomorphicLayoutEffect(() => {\n    if (!transition && prevView) {\n      // Закончился переход\n      scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);\n      onTransition && onTransition({ isBack, from: prevView, to: activeView });\n    }\n  }, [transition]);\n\n  const fallbackTransition = useTimeout(finishTransition, platform === IOS ? 600 : 300);\n  React.useEffect(() => {\n    if (!transition) {\n      fallbackTransition.clear();\n      return;\n    }\n    disableAnimation ? finishTransition() : fallbackTransition.set();\n  }, [transition]);\n\n  const onAnimationEnd = (e: React.AnimationEvent) => {\n    if ([\n      'vkui-root-android-animation-hide-back',\n      'vkui-root-android-animation-show-forward',\n      'vkui-root-ios-animation-hide-back',\n      'vkui-root-ios-animation-show-forward',\n    ].includes(e.animationName)) {\n      finishTransition();\n    }\n  };\n\n  return (\n    <div {...restProps} vkuiClass={classNames(getClassName('Root', platform), {\n      'Root--transition': !disableAnimation && transition,\n      'Root--no-motion': disableAnimation,\n    })}>\n      {views.map((view) => {\n        const viewId = getNavId(view.props, warn);\n        if (viewId !== activeView && !(transition && viewId === prevView)) {\n          return null;\n        }\n        const isTransitionTarget = transition && viewId === (isBack ? prevView : activeView);\n        const compensateScroll = transition && (viewId === prevView || isBack && viewId === activeView);\n        return (\n          <div\n            key={viewId}\n            ref={(e) => viewNodes[viewId] = e}\n            onAnimationEnd={isTransitionTarget ? onAnimationEnd : null}\n            vkuiClass={classNames('Root__view', {\n              'Root__view--hide-back': transition && viewId === prevView && isBack,\n              'Root__view--hide-forward': transition && viewId === prevView && !isBack,\n              'Root__view--show-back': transition && viewId === activeView && isBack,\n              'Root__view--show-forward': transition && viewId === activeView && !isBack,\n              'Root__view--active': !transition && viewId === activeView,\n            })}\n          >\n            <NavTransitionProvider entering={transition && viewId === activeView}>\n              <div\n                vkuiClass=\"Root__scrollCompensation\"\n                style={{ marginTop: compensateScroll ? -scrolls[viewId] : null }}\n              >\n                {view}\n              </div>\n            </NavTransitionProvider>\n          </div>\n        );\n      })}\n      <AppRootPortal>\n        {!!popout && <div vkuiClass=\"Root__popout\">{popout}</div>}\n        {!!modal && <div vkuiClass=\"Root__modal\">{modal}</div>}\n      </AppRootPortal>\n    </div>\n  );\n};\n\nexport default Root;\n"],"file":"Root.js"}

package/dist/cjs/components/Search/Search.js

@@ -150,7 +150,7 @@ var Search = function Search(_ref) {
   }, icon), !!value && (0, _jsxRuntime.createScopedElement)(_Touch.Touch, {
     onStart: onIconCancelClickStart,
     vkuiClass: "Search__icon"
-  }, platform === _platform.VKCOM ? (0, _jsxRuntime.createScopedElement)(_icons.Icon24Cancel, null) : (0, _jsxRuntime.createScopedElement)(_icons.Icon16Clear, null))), platform === _platform.IOS && after && (0, _jsxRuntime.createScopedElement)("div", {
+  }, platform === _platform.IOS ? (0, _jsxRuntime.createScopedElement)(_icons.Icon16Clear, null) : (0, _jsxRuntime.createScopedElement)(_icons.Icon24Cancel, null))), platform === _platform.IOS && after && (0, _jsxRuntime.createScopedElement)("div", {
     vkuiClass: "Search__after-in"
   }, after))), platform === _platform.VKCOM && (0, _jsxRuntime.createScopedElement)(_Separator.default, {
     vkuiClass: "Search__separator",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Search/Search.tsx"],"names":["Search","before","className","defaultValue","placeholder","after","getRef","platform","icon","onIconClick","noop","style","inputProps","inputRef","React","useState","isFocused","setFocused","value","onChange","onFocus","e","onBlur","onCancel","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","useCallback","originalEvent","onIconCancelClickStart","preventDefault","focus","IOS","VKCOM","defaultProps","autoComplete"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { getClassName } from '../../helpers/getClassName';\nimport { Icon16SearchOutline, Icon16Clear, Icon24Cancel } from '@vkontakte/icons';\nimport { IOS, VKCOM } from '../../lib/platform';\nimport { HasPlatform, HasRef } from '../../types';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport { VKUITouchEvent } from '../../lib/touch';\nimport { noop } from '../../lib/utils';\nimport Text from '../Typography/Text/Text';\nimport Title from '../Typography/Title/Title';\nimport Separator from '../Separator/Separator';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useEnsuredControl } from '../../hooks/useEnsuredControl';\nimport './Search.css';\n\nexport type InputRef = (element: HTMLInputElement) => void;\n\nexport interface SearchProps extends React.InputHTMLAttributes<HTMLInputElement>, HasRef<HTMLInputElement>, HasPlatform {\n  /**\n   * iOS only. Текст кнопки \"отмена\", которая чистит текстовое поле и убирает фокус.\n   */\n  after?: React.ReactNode;\n  before?: React.ReactNode;\n  icon?: React.ReactNode;\n  onIconClick?: (e: VKUITouchEvent) => void;\n  defaultValue?: string;\n}\n\nconst Search: React.FC<SearchProps> = ({\n  before,\n  className,\n  defaultValue,\n  placeholder,\n  after,\n  getRef,\n  platform,\n  icon,\n  onIconClick = noop,\n  style,\n  ...inputProps\n}) => {\n  const inputRef = useExternRef(getRef);\n  const [isFocused, setFocused] = React.useState(false);\n  const [value, onChange] = useEnsuredControl(inputProps, { defaultValue });\n\n  const onFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocused(true);\n    inputProps.onFocus && inputProps.onFocus(e);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocused(false);\n    inputProps.onBlur && inputProps.onBlur(e);\n  };\n\n  const onCancel = () => {\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    const nativeInputValueSetter = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value').set;\n    nativeInputValueSetter.call(inputRef.current, '');\n\n    const ev2 = new Event('input', { bubbles: true });\n    inputRef.current.dispatchEvent(ev2);\n  };\n\n  const onIconClickStart = React.useCallback((e: TouchEvent) => onIconClick(e.originalEvent), [onIconClick]);\n\n  const onIconCancelClickStart = React.useCallback((e: TouchEvent) => {\n    e.originalEvent.preventDefault();\n    inputRef.current.focus();\n    onCancel();\n  }, [onCancel]);\n\n  return (\n    <div\n      vkuiClass={classNames(getClassName('Search', platform), {\n        'Search--focused': isFocused,\n        'Search--has-value': !!value,\n        'Search--has-after': !!after,\n        'Search--has-icon': !!icon,\n      })}\n      className={className}\n      style={style}\n    >\n      <div vkuiClass=\"Search__in\">\n        <div vkuiClass=\"Search__width\" />\n        <label vkuiClass=\"Search__control\">\n          <input\n            type=\"search\"\n            {...inputProps}\n            ref={inputRef}\n            vkuiClass=\"Search__input\"\n            onFocus={onFocus}\n            onBlur={onBlur}\n            onChange={onChange}\n            value={value}\n          />\n          {platform === IOS && after && <div vkuiClass=\"Search__after-width\">{after}</div>}\n          <div vkuiClass=\"Search__placeholder\">\n            <div vkuiClass=\"Search__placeholder-in\">\n              {before}\n              {platform === VKCOM\n                ? <Text vkuiClass=\"Search__placeholder-text\" weight=\"regular\">{placeholder}</Text>\n                : <Title vkuiClass=\"Search__placeholder-text\" level=\"3\" weight=\"regular\">{placeholder}</Title>\n              }\n            </div>\n            {isFocused && platform === IOS && after && <div vkuiClass=\"Search__after-width\">{after}</div>}\n          </div>\n        </label>\n        <div vkuiClass=\"Search__after\" onClick={onCancel}>\n          <div vkuiClass=\"Search__icons\">\n            {icon &&\n              <Touch onStart={onIconClickStart} vkuiClass=\"Search__icon\">\n                {icon}\n              </Touch>\n            }\n            {!!value &&\n              <Touch onStart={onIconCancelClickStart} vkuiClass=\"Search__icon\">\n                {platform === VKCOM\n                  ? <Icon24Cancel />\n                  : <Icon16Clear />\n                }\n              </Touch>\n            }\n          </div>\n          {platform === IOS && after &&\n            <div vkuiClass=\"Search__after-in\">{after}</div>\n          }\n        </div>\n      </div>\n      {platform === VKCOM && <Separator vkuiClass=\"Search__separator\" wide />}\n    </div>\n  );\n};\n\nSearch.defaultProps = {\n  autoComplete: 'off',\n  defaultValue: '',\n  placeholder: 'Поиск',\n  after: 'Отмена',\n  before: <Icon16SearchOutline />,\n};\n\nexport default withPlatform(Search);\n"],"file":"Search.js"}
+{"version":3,"sources":["../../../../src/components/Search/Search.tsx"],"names":["Search","before","className","defaultValue","placeholder","after","getRef","platform","icon","onIconClick","noop","style","inputProps","inputRef","React","useState","isFocused","setFocused","value","onChange","onFocus","e","onBlur","onCancel","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","useCallback","originalEvent","onIconCancelClickStart","preventDefault","focus","IOS","VKCOM","defaultProps","autoComplete"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { getClassName } from '../../helpers/getClassName';\nimport { Icon16SearchOutline, Icon16Clear, Icon24Cancel } from '@vkontakte/icons';\nimport { IOS, VKCOM } from '../../lib/platform';\nimport { HasPlatform, HasRef } from '../../types';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport { VKUITouchEvent } from '../../lib/touch';\nimport { noop } from '../../lib/utils';\nimport Text from '../Typography/Text/Text';\nimport Title from '../Typography/Title/Title';\nimport Separator from '../Separator/Separator';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useEnsuredControl } from '../../hooks/useEnsuredControl';\nimport './Search.css';\n\nexport type InputRef = (element: HTMLInputElement) => void;\n\nexport interface SearchProps extends React.InputHTMLAttributes<HTMLInputElement>, HasRef<HTMLInputElement>, HasPlatform {\n  /**\n   * iOS only. Текст кнопки \"отмена\", которая чистит текстовое поле и убирает фокус.\n   */\n  after?: React.ReactNode;\n  before?: React.ReactNode;\n  icon?: React.ReactNode;\n  onIconClick?: (e: VKUITouchEvent) => void;\n  defaultValue?: string;\n}\n\nconst Search: React.FC<SearchProps> = ({\n  before,\n  className,\n  defaultValue,\n  placeholder,\n  after,\n  getRef,\n  platform,\n  icon,\n  onIconClick = noop,\n  style,\n  ...inputProps\n}) => {\n  const inputRef = useExternRef(getRef);\n  const [isFocused, setFocused] = React.useState(false);\n  const [value, onChange] = useEnsuredControl(inputProps, { defaultValue });\n\n  const onFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocused(true);\n    inputProps.onFocus && inputProps.onFocus(e);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocused(false);\n    inputProps.onBlur && inputProps.onBlur(e);\n  };\n\n  const onCancel = () => {\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    const nativeInputValueSetter = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value').set;\n    nativeInputValueSetter.call(inputRef.current, '');\n\n    const ev2 = new Event('input', { bubbles: true });\n    inputRef.current.dispatchEvent(ev2);\n  };\n\n  const onIconClickStart = React.useCallback((e: TouchEvent) => onIconClick(e.originalEvent), [onIconClick]);\n\n  const onIconCancelClickStart = React.useCallback((e: TouchEvent) => {\n    e.originalEvent.preventDefault();\n    inputRef.current.focus();\n    onCancel();\n  }, [onCancel]);\n\n  return (\n    <div\n      vkuiClass={classNames(getClassName('Search', platform), {\n        'Search--focused': isFocused,\n        'Search--has-value': !!value,\n        'Search--has-after': !!after,\n        'Search--has-icon': !!icon,\n      })}\n      className={className}\n      style={style}\n    >\n      <div vkuiClass=\"Search__in\">\n        <div vkuiClass=\"Search__width\" />\n        <label vkuiClass=\"Search__control\">\n          <input\n            type=\"search\"\n            {...inputProps}\n            ref={inputRef}\n            vkuiClass=\"Search__input\"\n            onFocus={onFocus}\n            onBlur={onBlur}\n            onChange={onChange}\n            value={value}\n          />\n          {platform === IOS && after && <div vkuiClass=\"Search__after-width\">{after}</div>}\n          <div vkuiClass=\"Search__placeholder\">\n            <div vkuiClass=\"Search__placeholder-in\">\n              {before}\n              {platform === VKCOM\n                ? <Text vkuiClass=\"Search__placeholder-text\" weight=\"regular\">{placeholder}</Text>\n                : <Title vkuiClass=\"Search__placeholder-text\" level=\"3\" weight=\"regular\">{placeholder}</Title>\n              }\n            </div>\n            {isFocused && platform === IOS && after && <div vkuiClass=\"Search__after-width\">{after}</div>}\n          </div>\n        </label>\n        <div vkuiClass=\"Search__after\" onClick={onCancel}>\n          <div vkuiClass=\"Search__icons\">\n            {icon &&\n              <Touch onStart={onIconClickStart} vkuiClass=\"Search__icon\">\n                {icon}\n              </Touch>\n            }\n            {!!value &&\n              <Touch onStart={onIconCancelClickStart} vkuiClass=\"Search__icon\">\n                {platform === IOS\n                  ? <Icon16Clear />\n                  : <Icon24Cancel />\n                }\n              </Touch>\n            }\n          </div>\n          {platform === IOS && after &&\n            <div vkuiClass=\"Search__after-in\">{after}</div>\n          }\n        </div>\n      </div>\n      {platform === VKCOM && <Separator vkuiClass=\"Search__separator\" wide />}\n    </div>\n  );\n};\n\nSearch.defaultProps = {\n  autoComplete: 'off',\n  defaultValue: '',\n  placeholder: 'Поиск',\n  after: 'Отмена',\n  before: <Icon16SearchOutline />,\n};\n\nexport default withPlatform(Search);\n"],"file":"Search.js"}

package/dist/cjs/components/SelectMimicry/SelectMimicry.js

@@ -17,7 +17,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 
 var _classNames2 = require("../../lib/classNames");
 
-var _icons = require("@vkontakte/icons");
+var _DropdownIcon = require("../DropdownIcon/DropdownIcon");
 
 var _FormField = require("../FormField/FormField");
 
@@ -60,7 +60,7 @@ var SelectMimicry = function SelectMimicry(_ref) {
     getRootRef: getRootRef,
     onClick: disabled ? null : onClick,
     disabled: disabled,
-    after: sizeY === _withAdaptivity.SizeType.COMPACT ? (0, _jsxRuntime.createScopedElement)(_icons.Icon20Dropdown, null) : (0, _jsxRuntime.createScopedElement)(_icons.Icon24Dropdown, null)
+    after: (0, _jsxRuntime.createScopedElement)(_DropdownIcon.DropdownIcon, null)
   }), (0, _jsxRuntime.createScopedElement)(TypographyComponent, {
     Component: "div",
     weight: "regular",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SelectMimicry/SelectMimicry.tsx"],"names":["SelectMimicry","tabIndex","placeholder","children","align","getRootRef","multiline","disabled","onClick","sizeX","sizeY","restProps","platform","TypographyComponent","VKCOM","SizeType","COMPACT","Text","Headline","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;AACA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAYA,IAAMA,aAA0D,GAAG,SAA7DA,aAA6D,OAYzC;AAAA;;AAAA,MAXxBC,QAWwB,QAXxBA,QAWwB;AAAA,MAVxBC,WAUwB,QAVxBA,WAUwB;AAAA,MATxBC,QASwB,QATxBA,QASwB;AAAA,MARxBC,KAQwB,QARxBA,KAQwB;AAAA,MAPxBC,UAOwB,QAPxBA,UAOwB;AAAA,MANxBC,SAMwB,QANxBA,SAMwB;AAAA,MALxBC,QAKwB,QALxBA,QAKwB;AAAA,MAJxBC,OAIwB,QAJxBA,OAIwB;AAAA,MAHxBC,KAGwB,QAHxBA,KAGwB;AAAA,MAFxBC,KAEwB,QAFxBA,KAEwB;AAAA,MADrBC,SACqB;AACxB,MAAMC,QAAQ,GAAG,+BAAjB;AAEA,MAAMC,mBAAmB,GAAGD,QAAQ,KAAKE,eAAb,IAAsBJ,KAAK,KAAKK,yBAASC,OAAzC,GAAmDC,aAAnD,GAA0DC,iBAAtF;AAEA,SACE,qCAAC,oBAAD,6BACMP,SADN;AAEE,IAAA,QAAQ,EAAEJ,QAAQ,GAAG,IAAH,GAAUN,QAF9B;AAGE,IAAA,SAAS,EAAE,6BAAW,gCAAa,QAAb,EAAuBW,QAAvB,CAAX,EAA6C,iBAA7C;AACT,8BAAwB,CAACT,QADhB;AAET,2BAAqBG;AAFZ,0EAGSF,KAHT,GAGmB,CAAC,CAACA,KAHrB,uEAIUK,KAJV,GAIoB,CAAC,CAACA,KAJtB,uEAKUC,KALV,GAKoB,CAAC,CAACA,KALtB,gBAHb;AAUE,IAAA,UAAU,EAAEL,UAVd;AAWE,IAAA,OAAO,EAAEE,QAAQ,GAAG,IAAH,GAAUC,OAX7B;AAYE,IAAA,QAAQ,EAAED,QAZZ;AAaE,IAAA,KAAK,EAAEG,KAAK,KAAKK,yBAASC,OAAnB,GAA6B,qCAAC,qBAAD,OAA7B,GAAkD,qCAAC,qBAAD;AAb3D,MAeE,qCAAC,mBAAD;AAAqB,IAAA,SAAS,EAAC,KAA/B;AAAqC,IAAA,MAAM,EAAC,SAA5C;AAAsD,IAAA,SAAS,EAAC;AAAhE,KACE;AAAM,IAAA,SAAS,EAAC;AAAhB,KAAiCb,QAAQ,IAAID,WAA7C,CADF,CAfF,CADF;AAqBD,CAtCD;;AAwCAF,aAAa,CAACmB,YAAd,GAA6B;AAC3BlB,EAAAA,QAAQ,EAAE;AADiB,CAA7B;;eAIe,oCAAeD,aAAf,EAA8B;AAC3CS,EAAAA,KAAK,EAAE,IADoC;AAE3CC,EAAAA,KAAK,EAAE;AAFoC,CAA9B,C","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { Icon24Dropdown, Icon20Dropdown } from '@vkontakte/icons';\nimport { FormField } from '../FormField/FormField';\nimport { HasAlign, HasRootRef } from '../../types';\nimport { withAdaptivity, AdaptivityProps, SizeType } from '../../hoc/withAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getClassName } from '../../helpers/getClassName';\nimport Headline from '../Typography/Headline/Headline';\nimport Text from '../Typography/Text/Text';\nimport { VKCOM } from '../../lib/platform';\nimport '../Select/Select.css';\n\nexport interface SelectMimicryProps extends\n  React.HTMLAttributes<HTMLElement>,\n  HasAlign,\n  HasRootRef<HTMLElement>,\n  AdaptivityProps {\n  multiline?: boolean;\n  disabled?: boolean;\n}\n\nconst SelectMimicry: React.FunctionComponent<SelectMimicryProps> = ({\n  tabIndex,\n  placeholder,\n  children,\n  align,\n  getRootRef,\n  multiline,\n  disabled,\n  onClick,\n  sizeX,\n  sizeY,\n  ...restProps\n}: SelectMimicryProps) => {\n  const platform = usePlatform();\n\n  const TypographyComponent = platform === VKCOM || sizeY === SizeType.COMPACT ? Text : Headline;\n\n  return (\n    <FormField\n      {...restProps}\n      tabIndex={disabled ? null : tabIndex}\n      vkuiClass={classNames(getClassName('Select', platform), 'Select--mimicry', {\n        'Select--not-selected': !children,\n        'Select--multiline': multiline,\n        [`Select--align-${align}`]: !!align,\n        [`Select--sizeX--${sizeX}`]: !!sizeX,\n        [`Select--sizeY--${sizeY}`]: !!sizeY,\n      })}\n      getRootRef={getRootRef}\n      onClick={disabled ? null : onClick}\n      disabled={disabled}\n      after={sizeY === SizeType.COMPACT ? <Icon20Dropdown /> : <Icon24Dropdown />}\n    >\n      <TypographyComponent Component=\"div\" weight=\"regular\" vkuiClass=\"Select__container\">\n        <span vkuiClass=\"Select__title\">{children || placeholder}</span>\n      </TypographyComponent>\n    </FormField>\n  );\n};\n\nSelectMimicry.defaultProps = {\n  tabIndex: 0,\n};\n\nexport default withAdaptivity(SelectMimicry, {\n  sizeX: true,\n  sizeY: true,\n});\n"],"file":"SelectMimicry.js"}
+{"version":3,"sources":["../../../../src/components/SelectMimicry/SelectMimicry.tsx"],"names":["SelectMimicry","tabIndex","placeholder","children","align","getRootRef","multiline","disabled","onClick","sizeX","sizeY","restProps","platform","TypographyComponent","VKCOM","SizeType","COMPACT","Text","Headline","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;AACA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAYA,IAAMA,aAA0D,GAAG,SAA7DA,aAA6D,OAYzC;AAAA;;AAAA,MAXxBC,QAWwB,QAXxBA,QAWwB;AAAA,MAVxBC,WAUwB,QAVxBA,WAUwB;AAAA,MATxBC,QASwB,QATxBA,QASwB;AAAA,MARxBC,KAQwB,QARxBA,KAQwB;AAAA,MAPxBC,UAOwB,QAPxBA,UAOwB;AAAA,MANxBC,SAMwB,QANxBA,SAMwB;AAAA,MALxBC,QAKwB,QALxBA,QAKwB;AAAA,MAJxBC,OAIwB,QAJxBA,OAIwB;AAAA,MAHxBC,KAGwB,QAHxBA,KAGwB;AAAA,MAFxBC,KAEwB,QAFxBA,KAEwB;AAAA,MADrBC,SACqB;AACxB,MAAMC,QAAQ,GAAG,+BAAjB;AAEA,MAAMC,mBAAmB,GAAGD,QAAQ,KAAKE,eAAb,IAAsBJ,KAAK,KAAKK,yBAASC,OAAzC,GAAmDC,aAAnD,GAA0DC,iBAAtF;AAEA,SACE,qCAAC,oBAAD,6BACMP,SADN;AAEE,IAAA,QAAQ,EAAEJ,QAAQ,GAAG,IAAH,GAAUN,QAF9B;AAGE,IAAA,SAAS,EAAE,6BAAW,gCAAa,QAAb,EAAuBW,QAAvB,CAAX,EAA6C,iBAA7C;AACT,8BAAwB,CAACT,QADhB;AAET,2BAAqBG;AAFZ,0EAGSF,KAHT,GAGmB,CAAC,CAACA,KAHrB,uEAIUK,KAJV,GAIoB,CAAC,CAACA,KAJtB,uEAKUC,KALV,GAKoB,CAAC,CAACA,KALtB,gBAHb;AAUE,IAAA,UAAU,EAAEL,UAVd;AAWE,IAAA,OAAO,EAAEE,QAAQ,GAAG,IAAH,GAAUC,OAX7B;AAYE,IAAA,QAAQ,EAAED,QAZZ;AAaE,IAAA,KAAK,EAAE,qCAAC,0BAAD;AAbT,MAeE,qCAAC,mBAAD;AAAqB,IAAA,SAAS,EAAC,KAA/B;AAAqC,IAAA,MAAM,EAAC,SAA5C;AAAsD,IAAA,SAAS,EAAC;AAAhE,KACE;AAAM,IAAA,SAAS,EAAC;AAAhB,KAAiCJ,QAAQ,IAAID,WAA7C,CADF,CAfF,CADF;AAqBD,CAtCD;;AAwCAF,aAAa,CAACmB,YAAd,GAA6B;AAC3BlB,EAAAA,QAAQ,EAAE;AADiB,CAA7B;;eAIe,oCAAeD,aAAf,EAA8B;AAC3CS,EAAAA,KAAK,EAAE,IADoC;AAE3CC,EAAAA,KAAK,EAAE;AAFoC,CAA9B,C","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField } from '../FormField/FormField';\nimport { HasAlign, HasRootRef } from '../../types';\nimport { withAdaptivity, AdaptivityProps, SizeType } from '../../hoc/withAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getClassName } from '../../helpers/getClassName';\nimport Headline from '../Typography/Headline/Headline';\nimport Text from '../Typography/Text/Text';\nimport { VKCOM } from '../../lib/platform';\nimport '../Select/Select.css';\n\nexport interface SelectMimicryProps extends\n  React.HTMLAttributes<HTMLElement>,\n  HasAlign,\n  HasRootRef<HTMLElement>,\n  AdaptivityProps {\n  multiline?: boolean;\n  disabled?: boolean;\n}\n\nconst SelectMimicry: React.FunctionComponent<SelectMimicryProps> = ({\n  tabIndex,\n  placeholder,\n  children,\n  align,\n  getRootRef,\n  multiline,\n  disabled,\n  onClick,\n  sizeX,\n  sizeY,\n  ...restProps\n}: SelectMimicryProps) => {\n  const platform = usePlatform();\n\n  const TypographyComponent = platform === VKCOM || sizeY === SizeType.COMPACT ? Text : Headline;\n\n  return (\n    <FormField\n      {...restProps}\n      tabIndex={disabled ? null : tabIndex}\n      vkuiClass={classNames(getClassName('Select', platform), 'Select--mimicry', {\n        'Select--not-selected': !children,\n        'Select--multiline': multiline,\n        [`Select--align-${align}`]: !!align,\n        [`Select--sizeX--${sizeX}`]: !!sizeX,\n        [`Select--sizeY--${sizeY}`]: !!sizeY,\n      })}\n      getRootRef={getRootRef}\n      onClick={disabled ? null : onClick}\n      disabled={disabled}\n      after={<DropdownIcon />}\n    >\n      <TypographyComponent Component=\"div\" weight=\"regular\" vkuiClass=\"Select__container\">\n        <span vkuiClass=\"Select__title\">{children || placeholder}</span>\n      </TypographyComponent>\n    </FormField>\n  );\n};\n\nSelectMimicry.defaultProps = {\n  tabIndex: 0,\n};\n\nexport default withAdaptivity(SelectMimicry, {\n  sizeX: true,\n  sizeY: true,\n});\n"],"file":"SelectMimicry.js"}

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

@@ -1,7 +1,8 @@
 import * as React from 'react';
+import { HasComponent } from '../../types';
 import { TappableProps } from '../Tappable/Tappable';
 import './SimpleCell.css';
-export interface SimpleCellOwnProps {
+export interface SimpleCellOwnProps extends HasComponent {
     /**
      * Иконка 28 или `<Avatar size={28|32|40|48|72} />`
      */
@@ -31,7 +32,6 @@ export interface SimpleCellOwnProps {
      */
     expandable?: boolean;
     multiline?: boolean;
-    Component?: React.ElementType;
 }
 export interface SimpleCellProps extends SimpleCellOwnProps, TappableProps {
 }

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SimpleCell/SimpleCell.tsx"],"names":["SimpleCellTypography","props","sizeY","SizeType","COMPACT","SimpleCell","badge","before","indicator","children","after","description","expandable","multiline","restProps","platform","hasAfter","IOS"],"mappings":";;;;;;;;;;;;;;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AA0CA,IAAMA,oBAAyD,GAAG,SAA5DA,oBAA4D,CAACC,KAAD,EAAsC;AACtG,uBAAkB,oCAAlB;AAAA,MAAQC,KAAR,kBAAQA,KAAR;;AAEA,SAAOA,KAAK,KAAKC,yBAASC,OAAnB,GACH,qCAAC,aAAD;AAAM,IAAA,SAAS,EAAC,MAAhB;AAAuB,IAAA,MAAM,EAAC;AAA9B,KAA4CH,KAA5C,EADG,GAEH,qCAAC,cAAD;AAAO,IAAA,SAAS,EAAC,MAAjB;AAAwB,IAAA,KAAK,EAAC,GAA9B;AAAkC,IAAA,MAAM,EAAC;AAAzC,KAAuDA,KAAvD,EAFJ;AAGD,CAND;;AAQA,IAAMI,UAAqC,GAAG,SAAxCA,UAAwC,OAWvB;AAAA,MAVrBC,KAUqB,QAVrBA,KAUqB;AAAA,MATrBC,MASqB,QATrBA,MASqB;AAAA,MARrBC,SAQqB,QARrBA,SAQqB;AAAA,MAPrBC,QAOqB,QAPrBA,QAOqB;AAAA,MANrBC,KAMqB,QANrBA,KAMqB;AAAA,MALrBC,WAKqB,QALrBA,WAKqB;AAAA,MAJrBC,UAIqB,QAJrBA,UAIqB;AAAA,MAHrBC,SAGqB,QAHrBA,SAGqB;AAAA,MAFrBX,KAEqB,QAFrBA,KAEqB;AAAA,MADlBY,SACkB;AACrB,MAAMC,QAAQ,GAAG,+BAAjB;;AACA,MAAMC,QAAQ,GAAG,yBAAaN,KAAb,KAAuBE,UAAU,IAAIG,QAAQ,KAAKE,aAAnE;;AAEA,SACE,qCAAC,iBAAD,6BACMH,SADN;AAEE,IAAA,SAAS,EACP,4BACE,gCAAa,YAAb,EAA2BC,QAA3B,CADF,EAEE;AACE,yBAAmBH,UADrB;AAEE,0BAAoBC;AAFtB,KAFF,8BAMuBX,KANvB;AAHJ,MAaGK,MAbH,EAcE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,qCAAC,oBAAD;AAAsB,IAAA,SAAS,EAAC;AAAhC,KAAwDE,QAAxD,CADF,EAEG,yBAAaH,KAAb,KACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KACGA,KADH,CAHJ,CADF,EASGK,WAAW,IAAI,qCAAC,gBAAD;AAAS,IAAA,SAAS,EAAC,MAAnB;AAA0B,IAAA,MAAM,EAAC,SAAjC;AAA2C,IAAA,SAAS,EAAC;AAArD,KAAgFA,WAAhF,CATlB,CAdF,EAyBG,yBAAaH,SAAb,KACC,qCAAC,oBAAD;AAAsB,IAAA,SAAS,EAAC,MAAhC;AAAuC,IAAA,SAAS,EAAC;AAAjD,KAA0EA,SAA1E,CA1BJ,EA4BGQ,QAAQ,IACP;AAAK,IAAA,SAAS,EAAC;AAAf,KACGN,KADH,EAEGE,UAAU,IAAIG,QAAQ,KAAKE,aAA3B,IAAkC,qCAAC,oBAAD,OAFrC,CA7BJ,CADF;AAqCD,CApDD;;eAsDe,oCAAeZ,UAAf,EAA2B;AAAEH,EAAAA,KAAK,EAAE;AAAT,CAA3B,C","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport Tappable, { TappableProps } from '../Tappable/Tappable';\nimport { Icon24Chevron } from '@vkontakte/icons';\nimport { IOS } from '../../lib/platform';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { hasReactNode } from '../../lib/utils';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { withAdaptivity, SizeType } from '../../hoc/withAdaptivity';\nimport Title from '../Typography/Title/Title';\nimport Text from '../Typography/Text/Text';\nimport Subhead from '../Typography/Subhead/Subhead';\nimport './SimpleCell.css';\n\nexport interface SimpleCellOwnProps {\n  /**\n   * Иконка 28 или `<Avatar size={28|32|40|48|72} />`\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится справа от текста `children`.\n   */\n  badge?: React.ReactNode;\n  /**\n   * Контейнер для текста справа от `children`.\n   */\n  indicator?: React.ReactNode;\n  /**\n   * Иконка 24|28 или `<Switch />`. Располагается справа от `indicator`.\n   */\n  after?: React.ReactNode;\n  /**\n   * Контейнер для текста под `children`.\n   */\n  description?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия\n   */\n  disabled?: boolean;\n  /**\n   * В iOS добавляет chevron справа. Передавать `true`, если предполагается переход при клике по ячейке.\n   */\n  expandable?: boolean;\n  multiline?: boolean;\n  Component?: React.ElementType;\n}\n\nexport interface SimpleCellProps extends SimpleCellOwnProps, TappableProps {}\n\ninterface SimpleCellTypographyProps extends React.HTMLAttributes<HTMLDivElement> {\n  Component?: React.ElementType;\n}\n\nconst SimpleCellTypography: React.FC<SimpleCellTypographyProps> = (props: SimpleCellTypographyProps) => {\n  const { sizeY } = useAdaptivity();\n\n  return sizeY === SizeType.COMPACT\n    ? <Text Component=\"span\" weight=\"regular\" {...props} />\n    : <Title Component=\"span\" level=\"3\" weight=\"regular\" {...props} />;\n};\n\nconst SimpleCell: React.FC<SimpleCellProps> = ({\n  badge,\n  before,\n  indicator,\n  children,\n  after,\n  description,\n  expandable,\n  multiline,\n  sizeY,\n  ...restProps\n}: SimpleCellProps) => {\n  const platform = usePlatform();\n  const hasAfter = hasReactNode(after) || expandable && platform === IOS;\n\n  return (\n    <Tappable\n      {...restProps}\n      vkuiClass={\n        classNames(\n          getClassName('SimpleCell', platform),\n          {\n            'SimpleCell--exp': expandable,\n            'SimpleCell--mult': multiline,\n          },\n          `SimpleCell--sizeY-${sizeY}`,\n        )\n      }\n    >\n      {before}\n      <div vkuiClass=\"SimpleCell__main\">\n        <div vkuiClass=\"SimpleCell__content\">\n          <SimpleCellTypography vkuiClass=\"SimpleCell__children\">{children}</SimpleCellTypography>\n          {hasReactNode(badge) &&\n            <span vkuiClass=\"SimpleCell__badge\">\n              {badge}\n            </span>\n          }\n        </div>\n        {description && <Subhead Component=\"span\" weight=\"regular\" vkuiClass=\"SimpleCell__description\">{description}</Subhead>}\n      </div>\n      {hasReactNode(indicator) &&\n        <SimpleCellTypography Component=\"span\" vkuiClass=\"SimpleCell__indicator\">{indicator}</SimpleCellTypography>\n      }\n      {hasAfter &&\n        <div vkuiClass=\"SimpleCell__after\">\n          {after}\n          {expandable && platform === IOS && <Icon24Chevron />}\n        </div>\n      }\n    </Tappable>\n  );\n};\n\nexport default withAdaptivity(SimpleCell, { sizeY: true });\n"],"file":"SimpleCell.js"}
+{"version":3,"sources":["../../../../src/components/SimpleCell/SimpleCell.tsx"],"names":["SimpleCellTypography","props","sizeY","SizeType","COMPACT","SimpleCell","badge","before","indicator","children","after","description","expandable","multiline","restProps","platform","hasAfter","IOS"],"mappings":";;;;;;;;;;;;;;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAuCA,IAAMA,oBAAyD,GAAG,SAA5DA,oBAA4D,CAACC,KAAD,EAAsC;AACtG,uBAAkB,oCAAlB;AAAA,MAAQC,KAAR,kBAAQA,KAAR;;AAEA,SAAOA,KAAK,KAAKC,yBAASC,OAAnB,GACH,qCAAC,aAAD;AAAM,IAAA,SAAS,EAAC,MAAhB;AAAuB,IAAA,MAAM,EAAC;AAA9B,KAA4CH,KAA5C,EADG,GAEH,qCAAC,cAAD;AAAO,IAAA,SAAS,EAAC,MAAjB;AAAwB,IAAA,KAAK,EAAC,GAA9B;AAAkC,IAAA,MAAM,EAAC;AAAzC,KAAuDA,KAAvD,EAFJ;AAGD,CAND;;AAQA,IAAMI,UAAqC,GAAG,SAAxCA,UAAwC,OAWvB;AAAA,MAVrBC,KAUqB,QAVrBA,KAUqB;AAAA,MATrBC,MASqB,QATrBA,MASqB;AAAA,MARrBC,SAQqB,QARrBA,SAQqB;AAAA,MAPrBC,QAOqB,QAPrBA,QAOqB;AAAA,MANrBC,KAMqB,QANrBA,KAMqB;AAAA,MALrBC,WAKqB,QALrBA,WAKqB;AAAA,MAJrBC,UAIqB,QAJrBA,UAIqB;AAAA,MAHrBC,SAGqB,QAHrBA,SAGqB;AAAA,MAFrBX,KAEqB,QAFrBA,KAEqB;AAAA,MADlBY,SACkB;AACrB,MAAMC,QAAQ,GAAG,+BAAjB;;AACA,MAAMC,QAAQ,GAAG,yBAAaN,KAAb,KAAuBE,UAAU,IAAIG,QAAQ,KAAKE,aAAnE;;AAEA,SACE,qCAAC,iBAAD,6BACMH,SADN;AAEE,IAAA,SAAS,EACP,4BACE,gCAAa,YAAb,EAA2BC,QAA3B,CADF,EAEE;AACE,yBAAmBH,UADrB;AAEE,0BAAoBC;AAFtB,KAFF,8BAMuBX,KANvB;AAHJ,MAaGK,MAbH,EAcE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,qCAAC,oBAAD;AAAsB,IAAA,SAAS,EAAC;AAAhC,KAAwDE,QAAxD,CADF,EAEG,yBAAaH,KAAb,KACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KACGA,KADH,CAHJ,CADF,EASGK,WAAW,IAAI,qCAAC,gBAAD;AAAS,IAAA,SAAS,EAAC,MAAnB;AAA0B,IAAA,MAAM,EAAC,SAAjC;AAA2C,IAAA,SAAS,EAAC;AAArD,KAAgFA,WAAhF,CATlB,CAdF,EAyBG,yBAAaH,SAAb,KACC,qCAAC,oBAAD;AAAsB,IAAA,SAAS,EAAC,MAAhC;AAAuC,IAAA,SAAS,EAAC;AAAjD,KAA0EA,SAA1E,CA1BJ,EA4BGQ,QAAQ,IACP;AAAK,IAAA,SAAS,EAAC;AAAf,KACGN,KADH,EAEGE,UAAU,IAAIG,QAAQ,KAAKE,aAA3B,IAAkC,qCAAC,oBAAD,OAFrC,CA7BJ,CADF;AAqCD,CApDD;;eAsDe,oCAAeZ,UAAf,EAA2B;AAAEH,EAAAA,KAAK,EAAE;AAAT,CAA3B,C","sourcesContent":["import * as React from 'react';\nimport { HasComponent } from '../../types';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport Tappable, { TappableProps } from '../Tappable/Tappable';\nimport { Icon24Chevron } from '@vkontakte/icons';\nimport { IOS } from '../../lib/platform';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { hasReactNode } from '../../lib/utils';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { withAdaptivity, SizeType } from '../../hoc/withAdaptivity';\nimport Title from '../Typography/Title/Title';\nimport Text from '../Typography/Text/Text';\nimport Subhead from '../Typography/Subhead/Subhead';\nimport './SimpleCell.css';\n\nexport interface SimpleCellOwnProps extends HasComponent {\n  /**\n   * Иконка 28 или `<Avatar size={28|32|40|48|72} />`\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится справа от текста `children`.\n   */\n  badge?: React.ReactNode;\n  /**\n   * Контейнер для текста справа от `children`.\n   */\n  indicator?: React.ReactNode;\n  /**\n   * Иконка 24|28 или `<Switch />`. Располагается справа от `indicator`.\n   */\n  after?: React.ReactNode;\n  /**\n   * Контейнер для текста под `children`.\n   */\n  description?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия\n   */\n  disabled?: boolean;\n  /**\n   * В iOS добавляет chevron справа. Передавать `true`, если предполагается переход при клике по ячейке.\n   */\n  expandable?: boolean;\n  multiline?: boolean;\n}\n\nexport interface SimpleCellProps extends SimpleCellOwnProps, TappableProps {}\n\ntype SimpleCellTypographyProps = React.HTMLAttributes<HTMLDivElement> & HasComponent;\n\nconst SimpleCellTypography: React.FC<SimpleCellTypographyProps> = (props: SimpleCellTypographyProps) => {\n  const { sizeY } = useAdaptivity();\n\n  return sizeY === SizeType.COMPACT\n    ? <Text Component=\"span\" weight=\"regular\" {...props} />\n    : <Title Component=\"span\" level=\"3\" weight=\"regular\" {...props} />;\n};\n\nconst SimpleCell: React.FC<SimpleCellProps> = ({\n  badge,\n  before,\n  indicator,\n  children,\n  after,\n  description,\n  expandable,\n  multiline,\n  sizeY,\n  ...restProps\n}: SimpleCellProps) => {\n  const platform = usePlatform();\n  const hasAfter = hasReactNode(after) || expandable && platform === IOS;\n\n  return (\n    <Tappable\n      {...restProps}\n      vkuiClass={\n        classNames(\n          getClassName('SimpleCell', platform),\n          {\n            'SimpleCell--exp': expandable,\n            'SimpleCell--mult': multiline,\n          },\n          `SimpleCell--sizeY-${sizeY}`,\n        )\n      }\n    >\n      {before}\n      <div vkuiClass=\"SimpleCell__main\">\n        <div vkuiClass=\"SimpleCell__content\">\n          <SimpleCellTypography vkuiClass=\"SimpleCell__children\">{children}</SimpleCellTypography>\n          {hasReactNode(badge) &&\n            <span vkuiClass=\"SimpleCell__badge\">\n              {badge}\n            </span>\n          }\n        </div>\n        {description && <Subhead Component=\"span\" weight=\"regular\" vkuiClass=\"SimpleCell__description\">{description}</Subhead>}\n      </div>\n      {hasReactNode(indicator) &&\n        <SimpleCellTypography Component=\"span\" vkuiClass=\"SimpleCell__indicator\">{indicator}</SimpleCellTypography>\n      }\n      {hasAfter &&\n        <div vkuiClass=\"SimpleCell__after\">\n          {after}\n          {expandable && platform === IOS && <Icon24Chevron />}\n        </div>\n      }\n    </Tappable>\n  );\n};\n\nexport default withAdaptivity(SimpleCell, { sizeY: true });\n"],"file":"SimpleCell.js"}

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

@@ -6,9 +6,9 @@ export interface SplitColContextProps {
 }
 export declare const SplitColContext: React.Context<SplitColContextProps>;
 export interface SplitColProps extends React.HTMLAttributes<HTMLDivElement> {
-    width?: string;
-    maxWidth?: string;
-    minWidth?: string;
+    width?: number | string;
+    maxWidth?: number | string;
+    minWidth?: number | string;
     /**
      * Если false, то переходы между Panel происходят без анимации
      */

package/dist/cjs/components/SplitCol/SplitCol.js

@@ -34,7 +34,8 @@ var SplitCol = function SplitCol(props) {
       maxWidth = props.maxWidth,
       minWidth = props.minWidth,
       spaced = props.spaced,
-      animate = props.animate,
+      _props$animate = props.animate,
+      animate = _props$animate === void 0 ? false : _props$animate,
       fixed = props.fixed,
       style = props.style,
       restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
@@ -64,7 +65,4 @@ var SplitCol = function SplitCol(props) {
 };
 
 exports.SplitCol = SplitCol;
-SplitCol.defaultProps = {
-  animate: false
-};
 //# sourceMappingURL=SplitCol.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SplitCol/SplitCol.tsx"],"names":["SplitColContext","React","createContext","colRef","animate","SplitCol","props","children","width","maxWidth","minWidth","spaced","fixed","style","restProps","baseRef","useRef","contextValue","useMemo","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;;AAQO,IAAMA,eAAe,gBAAGC,KAAK,CAACC,aAAN,CAA0C;AACvEC,EAAAA,MAAM,EAAE,IAD+D;AAEvEC,EAAAA,OAAO,EAAE;AAF8D,CAA1C,CAAxB;;;AAoBA,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,CAACC,KAAD,EAA0B;AACzE,MAAQC,QAAR,GAA6FD,KAA7F,CAAQC,QAAR;AAAA,MAAkBC,KAAlB,GAA6FF,KAA7F,CAAkBE,KAAlB;AAAA,MAAyBC,QAAzB,GAA6FH,KAA7F,CAAyBG,QAAzB;AAAA,MAAmCC,QAAnC,GAA6FJ,KAA7F,CAAmCI,QAAnC;AAAA,MAA6CC,MAA7C,GAA6FL,KAA7F,CAA6CK,MAA7C;AAAA,MAAqDP,OAArD,GAA6FE,KAA7F,CAAqDF,OAArD;AAAA,MAA8DQ,KAA9D,GAA6FN,KAA7F,CAA8DM,KAA9D;AAAA,MAAqEC,KAArE,GAA6FP,KAA7F,CAAqEO,KAArE;AAAA,MAA+EC,SAA/E,0CAA6FR,KAA7F;AACA,MAAMS,OAAO,GAAGd,KAAK,CAACe,MAAN,EAAhB;AAEA,MAAMC,YAAY,GAAGhB,KAAK,CAACiB,OAAN,CAAc,YAAM;AACvC,WAAO;AACLf,MAAAA,MAAM,EAAEY,OADH;AAELX,MAAAA,OAAO,EAAPA;AAFK,KAAP;AAID,GALoB,EAKlB,CAACW,OAAD,EAAUX,OAAV,CALkB,CAArB;AAOA,SACE,uEACMU,SADN;AAEE,IAAA,KAAK,8DACAD,KADA;AAEHL,MAAAA,KAAK,EAAEA,KAFJ;AAGHC,MAAAA,QAAQ,EAAEA,QAHP;AAIHC,MAAAA,QAAQ,EAAEA;AAJP,MAFP;AAQE,IAAA,GAAG,EAAEK,OARP;AASE,IAAA,SAAS,EAAE,4BAAW,UAAX,EAAuB;AAChC,0BAAoBJ,MADY;AAEhC,yBAAmBC;AAFa,KAAvB;AATb,MAcE,qCAAC,eAAD,CAAiB,QAAjB;AAA0B,IAAA,KAAK,EAAEK;AAAjC,KACGL,KAAK,GAAG;AAAK,IAAA,SAAS,EAAC;AAAf,KAAuCL,QAAvC,CAAH,GAA4DA,QADpE,CAdF,CADF;AAoBD,CA/BM;;;AAiCPF,QAAQ,CAACc,YAAT,GAAwB;AACtBf,EAAAA,OAAO,EAAE;AADa,CAAxB","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport './SplitCol.css';\n\nexport interface SplitColContextProps {\n  colRef: React.RefObject<HTMLDivElement>;\n  animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n  colRef: null,\n  animate: true,\n});\n\nexport interface SplitColProps extends React.HTMLAttributes<HTMLDivElement> {\n  width?: string;\n  maxWidth?: string;\n  minWidth?: string;\n  /**\n   * Если false, то переходы между Panel происходят без анимации\n   */\n  animate?: boolean;\n  /**\n   * Если true, то добавляются боковые отступы фиксированной величины\n   */\n  spaced?: boolean;\n  fixed?: boolean;\n}\n\nexport const SplitCol: React.FC<SplitColProps> = (props: SplitColProps) => {\n  const { children, width, maxWidth, minWidth, spaced, animate, fixed, style, ...restProps } = props;\n  const baseRef = React.useRef<HTMLDivElement>();\n\n  const contextValue = React.useMemo(() => {\n    return {\n      colRef: baseRef,\n      animate,\n    };\n  }, [baseRef, animate]);\n\n  return (\n    <div\n      {...restProps}\n      style={{\n        ...style,\n        width: width,\n        maxWidth: maxWidth,\n        minWidth: minWidth,\n      }}\n      ref={baseRef}\n      vkuiClass={classNames('SplitCol', {\n        'SplitCol--spaced': spaced,\n        'SplitCol--fixed': fixed,\n      })}\n    >\n      <SplitColContext.Provider value={contextValue}>\n        {fixed ? <div vkuiClass=\"SplitCol__fixedInner\">{children}</div> : children}\n      </SplitColContext.Provider>\n    </div>\n  );\n};\n\nSplitCol.defaultProps = {\n  animate: false,\n};\n"],"file":"SplitCol.js"}
+{"version":3,"sources":["../../../../src/components/SplitCol/SplitCol.tsx"],"names":["SplitColContext","React","createContext","colRef","animate","SplitCol","props","children","width","maxWidth","minWidth","spaced","fixed","style","restProps","baseRef","useRef","contextValue","useMemo"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;;AAQO,IAAMA,eAAe,gBAAGC,KAAK,CAACC,aAAN,CAA0C;AACvEC,EAAAA,MAAM,EAAE,IAD+D;AAEvEC,EAAAA,OAAO,EAAE;AAF8D,CAA1C,CAAxB;;;AAoBA,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,CAACC,KAAD,EAA0B;AACzE,MAAQC,QAAR,GAAqGD,KAArG,CAAQC,QAAR;AAAA,MAAkBC,KAAlB,GAAqGF,KAArG,CAAkBE,KAAlB;AAAA,MAAyBC,QAAzB,GAAqGH,KAArG,CAAyBG,QAAzB;AAAA,MAAmCC,QAAnC,GAAqGJ,KAArG,CAAmCI,QAAnC;AAAA,MAA6CC,MAA7C,GAAqGL,KAArG,CAA6CK,MAA7C;AAAA,uBAAqGL,KAArG,CAAqDF,OAArD;AAAA,MAAqDA,OAArD,+BAA+D,KAA/D;AAAA,MAAsEQ,KAAtE,GAAqGN,KAArG,CAAsEM,KAAtE;AAAA,MAA6EC,KAA7E,GAAqGP,KAArG,CAA6EO,KAA7E;AAAA,MAAuFC,SAAvF,0CAAqGR,KAArG;AACA,MAAMS,OAAO,GAAGd,KAAK,CAACe,MAAN,EAAhB;AAEA,MAAMC,YAAY,GAAGhB,KAAK,CAACiB,OAAN,CAAc,YAAM;AACvC,WAAO;AACLf,MAAAA,MAAM,EAAEY,OADH;AAELX,MAAAA,OAAO,EAAPA;AAFK,KAAP;AAID,GALoB,EAKlB,CAACW,OAAD,EAAUX,OAAV,CALkB,CAArB;AAOA,SACE,uEACMU,SADN;AAEE,IAAA,KAAK,8DACAD,KADA;AAEHL,MAAAA,KAAK,EAAEA,KAFJ;AAGHC,MAAAA,QAAQ,EAAEA,QAHP;AAIHC,MAAAA,QAAQ,EAAEA;AAJP,MAFP;AAQE,IAAA,GAAG,EAAEK,OARP;AASE,IAAA,SAAS,EAAE,4BAAW,UAAX,EAAuB;AAChC,0BAAoBJ,MADY;AAEhC,yBAAmBC;AAFa,KAAvB;AATb,MAcE,qCAAC,eAAD,CAAiB,QAAjB;AAA0B,IAAA,KAAK,EAAEK;AAAjC,KACGL,KAAK,GAAG;AAAK,IAAA,SAAS,EAAC;AAAf,KAAuCL,QAAvC,CAAH,GAA4DA,QADpE,CAdF,CADF;AAoBD,CA/BM","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport './SplitCol.css';\n\nexport interface SplitColContextProps {\n  colRef: React.RefObject<HTMLDivElement>;\n  animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n  colRef: null,\n  animate: true,\n});\n\nexport interface SplitColProps extends React.HTMLAttributes<HTMLDivElement> {\n  width?: number | string;\n  maxWidth?: number | string;\n  minWidth?: number | string;\n  /**\n   * Если false, то переходы между Panel происходят без анимации\n   */\n  animate?: boolean;\n  /**\n   * Если true, то добавляются боковые отступы фиксированной величины\n   */\n  spaced?: boolean;\n  fixed?: boolean;\n}\n\nexport const SplitCol: React.FC<SplitColProps> = (props: SplitColProps) => {\n  const { children, width, maxWidth, minWidth, spaced, animate = false, fixed, style, ...restProps } = props;\n  const baseRef = React.useRef<HTMLDivElement>();\n\n  const contextValue = React.useMemo(() => {\n    return {\n      colRef: baseRef,\n      animate,\n    };\n  }, [baseRef, animate]);\n\n  return (\n    <div\n      {...restProps}\n      style={{\n        ...style,\n        width: width,\n        maxWidth: maxWidth,\n        minWidth: minWidth,\n      }}\n      ref={baseRef}\n      vkuiClass={classNames('SplitCol', {\n        'SplitCol--spaced': spaced,\n        'SplitCol--fixed': fixed,\n      })}\n    >\n      <SplitColContext.Provider value={contextValue}>\n        {fixed ? <div vkuiClass=\"SplitCol__fixedInner\">{children}</div> : children}\n      </SplitColContext.Provider>\n    </div>\n  );\n};\n"],"file":"SplitCol.js"}

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

@@ -1,6 +1,7 @@
 import * as React from 'react';
+import { HorizontalScrollProps } from '../HorizontalScroll/HorizontalScroll';
 import './SubnavigationBar.css';
-export interface SubnavigationBarProps extends React.HTMLAttributes<HTMLDivElement> {
+export interface SubnavigationBarProps extends React.HTMLAttributes<HTMLDivElement>, Pick<HorizontalScrollProps, 'showArrows' | 'getScrollToLeft' | 'getScrollToRight' | 'scrollAnimationDuration'> {
     mode?: 'fixed' | 'overflow';
 }
 export declare const SubnavigationBar: React.FC<SubnavigationBarProps>;