@vkontakte/vkui 4.19.0 → 4.22.0

package/dist/components/Removable/Removable.js

@@ -1,11 +1,12 @@
 import _extends from "@babel/runtime/helpers/extends";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["children", "onRemove", "removePlaceholder", "align"];
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+var _excluded = ["getRootRef", "children", "onRemove", "removePlaceholder", "align"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from 'react';
 import { classNames } from "../../lib/classNames";
-import { getTitleFromChildren } from "../../lib/utils";
+import { getTitleFromChildren, noop } from "../../lib/utils";
+import { useExternRef } from "../../hooks/useExternRef";
 import { usePlatform } from "../../hooks/usePlatform";
 import { getClassName } from "../../helpers/getClassName";
 import { useAdaptivity } from "../../hooks/useAdaptivity";
@@ -15,109 +16,117 @@ import { Icon24Cancel } from '@vkontakte/icons';
 import IconButton from "../IconButton/IconButton";
 import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
 import Tappable from "../Tappable/Tappable";
-export 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 = _objectWithoutProperties(_ref, _excluded);
 
-  var platform = usePlatform();
-
-  var _useAdaptivity = useAdaptivity(),
-      sizeY = _useAdaptivity.sizeY;
+var RemovableIos = function RemovableIos(_ref) {
+  var onRemoveClick = _ref.onRemoveClick,
+      removePlaceholder = _ref.removePlaceholder,
+      removePlaceholderString = _ref.removePlaceholderString,
+      children = _ref.children;
 
   var _useDOM = useDOM(),
       document = _useDOM.document;
 
   var removeButtonRef = React.useRef(null);
 
-  var _React$useState = React.useState(false),
+  var _React$useState = React.useState(0),
       _React$useState2 = _slicedToArray(_React$useState, 2),
-      isRemoveActivated = _React$useState2[0],
-      setRemoveActivated = _React$useState2[1];
-
-  var _React$useState3 = React.useState(0),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      removeOffset = _React$useState4[0],
-      updateRemoveOffset = _React$useState4[1];
+      removeOffset = _React$useState2[0],
+      updateRemoveOffset = _React$useState2[1];
 
-  useGlobalEventListener(document, 'click', isRemoveActivated && function () {
-    setRemoveActivated(false);
+  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 = getTitleFromChildren(removePlaceholder);
-  return createScopedElement("div", _extends({}, restProps, {
-    vkuiClass: classNames(getClassName('Removable', platform), "Removable--".concat(align), "Removable--sizeY-".concat(sizeY))
-  }), (platform === ANDROID || platform === VKCOM) && createScopedElement("div", {
-    vkuiClass: "Removable__content"
-  }, children, createScopedElement(IconButton, {
-    "aria-label": removePlaceholderString,
-    vkuiClass: "Removable__action",
-    onClick: onRemoveClick
-  }, createScopedElement(Icon24Cancel, {
-    role: "presentation"
-  }))), platform === IOS && createScopedElement(React.Fragment, null, createScopedElement("div", {
+  return createScopedElement("div", {
     vkuiClass: "Removable__content",
     style: {
-      transform: "translateX(-".concat(removeOffset, "px)")
-    }
+      transform: "translateX(-".concat(removeOffset !== null && removeOffset !== void 0 ? removeOffset : 0, "px)")
+    },
+    onTransitionEnd: onRemoveTransitionEnd
   }, createScopedElement(IconButton, {
     hasActive: false,
     hasHover: false,
     "aria-label": removePlaceholderString,
     vkuiClass: "Removable__action Removable__toggle",
-    onClick: onRemoveActivateClick
+    onClick: onRemoveActivateClick,
+    disabled: removeOffset > 0
   }, createScopedElement("i", {
     vkuiClass: "Removable__toggle-in",
     role: "presentation"
   })), children, createScopedElement("span", {
     vkuiClass: "Removable__offset",
     "aria-hidden": "true"
-  })), createScopedElement(Tappable, {
+  }), createScopedElement(Tappable, {
     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
   }, createScopedElement("span", {
     vkuiClass: "Removable__remove-in"
-  }, removePlaceholder))));
+  }, removePlaceholder)));
+};
+
+export var Removable = function Removable(_ref2) {
+  var getRootRef = _ref2.getRootRef,
+      children = _ref2.children,
+      _ref2$onRemove = _ref2.onRemove,
+      onRemove = _ref2$onRemove === void 0 ? 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 = _objectWithoutProperties(_ref2, _excluded);
+
+  var platform = usePlatform();
+
+  var _useAdaptivity = useAdaptivity(),
+      sizeY = _useAdaptivity.sizeY;
+
+  var ref = useExternRef(getRootRef);
+
+  var onRemoveClick = function onRemoveClick(e) {
+    e.preventDefault();
+    onRemove(e);
+  };
+
+  var removePlaceholderString = getTitleFromChildren(removePlaceholder);
+  return createScopedElement("div", _extends({}, restProps, {
+    ref: ref,
+    vkuiClass: classNames(getClassName('Removable', platform), "Removable--".concat(align), "Removable--sizeY-".concat(sizeY))
+  }), (platform === ANDROID || platform === VKCOM) && createScopedElement("div", {
+    vkuiClass: "Removable__content"
+  }, children, createScopedElement(IconButton, {
+    activeMode: "opacity",
+    hoverMode: "opacity",
+    vkuiClass: "Removable__action",
+    onClick: onRemoveClick,
+    "aria-label": removePlaceholderString
+  }, createScopedElement(Icon24Cancel, {
+    role: "presentation"
+  }))), platform === IOS && createScopedElement(RemovableIos, {
+    onRemoveClick: onRemoveClick,
+    removePlaceholder: removePlaceholder,
+    removePlaceholderString: removePlaceholderString
+  }, children));
 };
 //# sourceMappingURL=Removable.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Removable/Removable.tsx"],"names":["React","classNames","getTitleFromChildren","usePlatform","getClassName","useAdaptivity","useDOM","ANDROID","IOS","VKCOM","Icon24Cancel","IconButton","useGlobalEventListener","Tappable","Removable","children","onRemove","removePlaceholder","align","restProps","platform","sizeY","document","removeButtonRef","useRef","useState","isRemoveActivated","setRemoveActivated","removeOffset","updateRemoveOffset","onRemoveTransitionEnd","current","focus","onRemoveActivateClick","e","nativeEvent","stopPropagation","preventDefault","onRemoveClick","stopImmediatePropagation","useEffect","removeButton","offsetWidth","removePlaceholderString","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":["React","classNames","getTitleFromChildren","noop","useExternRef","usePlatform","getClassName","useAdaptivity","useDOM","ANDROID","IOS","VKCOM","Icon24Cancel","IconButton","useGlobalEventListener","Tappable","RemovableIos","onRemoveClick","removePlaceholder","removePlaceholderString","children","document","removeButtonRef","useRef","useState","removeOffset","updateRemoveOffset","onRemoveTransitionEnd","current","focus","onRemoveActivateClick","offsetWidth","transform","Removable","getRootRef","onRemove","align","restProps","platform","sizeY","ref","e","preventDefault"],"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/components/Root/Root.js

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

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Root/Root.tsx"],"names":["React","classNames","getClassName","IOS","ConfigProviderContext","SplitColContext","AppRootPortal","ScrollContext","NavTransitionProvider","getNavId","warnOnce","useDOM","useIsomorphicLayoutEffect","useTimeout","usePlatform","warn","Root","popout","modal","children","_activeView","activeView","onTransition","nav","restProps","scroll","useContext","platform","document","scrolls","useRef","current","viewNodes","transitionMotionEnabled","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","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":["React","classNames","getClassName","IOS","ConfigProviderContext","SplitColContext","AppRootPortal","ScrollContext","NavTransitionProvider","getNavId","warnOnce","useDOM","useIsomorphicLayoutEffect","useTimeout","usePlatform","warn","Root","popout","modal","children","_activeView","activeView","onTransition","nav","restProps","scroll","useContext","platform","document","scrolls","useRef","current","viewNodes","transitionMotionEnabled","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","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/components/Search/Search.js

@@ -123,7 +123,7 @@ var Search = function Search(_ref) {
   }, icon), !!value && createScopedElement(Touch, {
     onStart: onIconCancelClickStart,
     vkuiClass: "Search__icon"
-  }, platform === VKCOM ? createScopedElement(Icon24Cancel, null) : createScopedElement(Icon16Clear, null))), platform === IOS && after && createScopedElement("div", {
+  }, platform === IOS ? createScopedElement(Icon16Clear, null) : createScopedElement(Icon24Cancel, null))), platform === IOS && after && createScopedElement("div", {
     vkuiClass: "Search__after-in"
   }, after))), platform === VKCOM && createScopedElement(Separator, {
     vkuiClass: "Search__separator",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Search/Search.tsx"],"names":["React","classNames","withPlatform","getClassName","Icon16SearchOutline","Icon16Clear","Icon24Cancel","IOS","VKCOM","Touch","noop","Text","Title","Separator","useExternRef","useEnsuredControl","Search","before","className","defaultValue","placeholder","after","getRef","platform","icon","onIconClick","style","inputProps","inputRef","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","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":["React","classNames","withPlatform","getClassName","Icon16SearchOutline","Icon16Clear","Icon24Cancel","IOS","VKCOM","Touch","noop","Text","Title","Separator","useExternRef","useEnsuredControl","Search","before","className","defaultValue","placeholder","after","getRef","platform","icon","onIconClick","style","inputProps","inputRef","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","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/components/SelectMimicry/SelectMimicry.js

@@ -4,7 +4,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["tabIndex", "placeholder", "children", "align", "getRootRef", "multiline", "disabled", "onClick", "sizeX", "sizeY"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import { classNames } from "../../lib/classNames";
-import { Icon24Dropdown, Icon20Dropdown } from '@vkontakte/icons';
+import { DropdownIcon } from "../DropdownIcon/DropdownIcon";
 import { FormField } from "../FormField/FormField";
 import { withAdaptivity, SizeType } from "../../hoc/withAdaptivity";
 import { usePlatform } from "../../hooks/usePlatform";
@@ -39,7 +39,7 @@ var SelectMimicry = function SelectMimicry(_ref) {
     getRootRef: getRootRef,
     onClick: disabled ? null : onClick,
     disabled: disabled,
-    after: sizeY === SizeType.COMPACT ? createScopedElement(Icon20Dropdown, null) : createScopedElement(Icon24Dropdown, null)
+    after: createScopedElement(DropdownIcon, null)
   }), createScopedElement(TypographyComponent, {
     Component: "div",
     weight: "regular",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SelectMimicry/SelectMimicry.tsx"],"names":["classNames","Icon24Dropdown","Icon20Dropdown","FormField","withAdaptivity","SizeType","usePlatform","getClassName","Headline","Text","VKCOM","SelectMimicry","tabIndex","placeholder","children","align","getRootRef","multiline","disabled","onClick","sizeX","sizeY","restProps","platform","TypographyComponent","COMPACT","defaultProps"],"mappings":";;;;;AACA,SAASA,UAAT;AACA,SAASC,cAAT,EAAyBC,cAAzB,QAA+C,kBAA/C;AACA,SAASC,SAAT;AAEA,SAASC,cAAT,EAA0CC,QAA1C;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,OAAOC,IAAP;AACA,SAASC,KAAT;;AAYA,IAAMC,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,GAAGjB,WAAW,EAA5B;AAEA,MAAMkB,mBAAmB,GAAGD,QAAQ,KAAKb,KAAb,IAAsBW,KAAK,KAAKhB,QAAQ,CAACoB,OAAzC,GAAmDhB,IAAnD,GAA0DD,QAAtF;AAEA,SACE,oBAAC,SAAD,eACMc,SADN;AAEE,IAAA,QAAQ,EAAEJ,QAAQ,GAAG,IAAH,GAAUN,QAF9B;AAGE,IAAA,SAAS,EAAEZ,UAAU,CAACO,YAAY,CAAC,QAAD,EAAWgB,QAAX,CAAb,EAAmC,iBAAnC;AACnB,8BAAwB,CAACT,QADN;AAEnB,2BAAqBG;AAFF,4DAGDF,KAHC,GAGS,CAAC,CAACA,KAHX,yDAIAK,KAJA,GAIU,CAAC,CAACA,KAJZ,yDAKAC,KALA,GAKU,CAAC,CAACA,KALZ,gBAHvB;AAUE,IAAA,UAAU,EAAEL,UAVd;AAWE,IAAA,OAAO,EAAEE,QAAQ,GAAG,IAAH,GAAUC,OAX7B;AAYE,IAAA,QAAQ,EAAED,QAZZ;AAaE,IAAA,KAAK,EAAEG,KAAK,KAAKhB,QAAQ,CAACoB,OAAnB,GAA6B,oBAAC,cAAD,OAA7B,GAAkD,oBAAC,cAAD;AAb3D,MAeE,oBAAC,mBAAD;AAAqB,IAAA,SAAS,EAAC,KAA/B;AAAqC,IAAA,MAAM,EAAC,SAA5C;AAAsD,IAAA,SAAS,EAAC;AAAhE,KACE;AAAM,IAAA,SAAS,EAAC;AAAhB,KAAiCX,QAAQ,IAAID,WAA7C,CADF,CAfF,CADF;AAqBD,CAtCD;;AAwCAF,aAAa,CAACe,YAAd,GAA6B;AAC3Bd,EAAAA,QAAQ,EAAE;AADiB,CAA7B;AAIA,eAAeR,cAAc,CAACO,aAAD,EAAgB;AAC3CS,EAAAA,KAAK,EAAE,IADoC;AAE3CC,EAAAA,KAAK,EAAE;AAFoC,CAAhB,CAA7B","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":["classNames","DropdownIcon","FormField","withAdaptivity","SizeType","usePlatform","getClassName","Headline","Text","VKCOM","SelectMimicry","tabIndex","placeholder","children","align","getRootRef","multiline","disabled","onClick","sizeX","sizeY","restProps","platform","TypographyComponent","COMPACT","defaultProps"],"mappings":";;;;;AACA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,SAASC,SAAT;AAEA,SAASC,cAAT,EAA0CC,QAA1C;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,OAAOC,IAAP;AACA,SAASC,KAAT;;AAYA,IAAMC,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,GAAGjB,WAAW,EAA5B;AAEA,MAAMkB,mBAAmB,GAAGD,QAAQ,KAAKb,KAAb,IAAsBW,KAAK,KAAKhB,QAAQ,CAACoB,OAAzC,GAAmDhB,IAAnD,GAA0DD,QAAtF;AAEA,SACE,oBAAC,SAAD,eACMc,SADN;AAEE,IAAA,QAAQ,EAAEJ,QAAQ,GAAG,IAAH,GAAUN,QAF9B;AAGE,IAAA,SAAS,EAAEX,UAAU,CAACM,YAAY,CAAC,QAAD,EAAWgB,QAAX,CAAb,EAAmC,iBAAnC;AACnB,8BAAwB,CAACT,QADN;AAEnB,2BAAqBG;AAFF,4DAGDF,KAHC,GAGS,CAAC,CAACA,KAHX,yDAIAK,KAJA,GAIU,CAAC,CAACA,KAJZ,yDAKAC,KALA,GAKU,CAAC,CAACA,KALZ,gBAHvB;AAUE,IAAA,UAAU,EAAEL,UAVd;AAWE,IAAA,OAAO,EAAEE,QAAQ,GAAG,IAAH,GAAUC,OAX7B;AAYE,IAAA,QAAQ,EAAED,QAZZ;AAaE,IAAA,KAAK,EAAE,oBAAC,YAAD;AAbT,MAeE,oBAAC,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,CAACe,YAAd,GAA6B;AAC3Bd,EAAAA,QAAQ,EAAE;AADiB,CAA7B;AAIA,eAAeR,cAAc,CAACO,aAAD,EAAgB;AAC3CS,EAAAA,KAAK,EAAE,IADoC;AAE3CC,EAAAA,KAAK,EAAE;AAFoC,CAAhB,CAA7B","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/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/components/SimpleCell/SimpleCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SimpleCell/SimpleCell.tsx"],"names":["classNames","getClassName","Tappable","Icon24Chevron","IOS","usePlatform","hasReactNode","useAdaptivity","withAdaptivity","SizeType","Title","Text","Subhead","SimpleCellTypography","props","sizeY","COMPACT","SimpleCell","badge","before","indicator","children","after","description","expandable","multiline","restProps","platform","hasAfter"],"mappings":";;;;AACA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,aAAT,QAA8B,kBAA9B;AACA,SAASC,GAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,aAAT;AACA,SAASC,cAAT,EAAyBC,QAAzB;AACA,OAAOC,KAAP;AACA,OAAOC,IAAP;AACA,OAAOC,OAAP;;AA0CA,IAAMC,oBAAyD,GAAG,SAA5DA,oBAA4D,CAACC,KAAD,EAAsC;AACtG,uBAAkBP,aAAa,EAA/B;AAAA,MAAQQ,KAAR,kBAAQA,KAAR;;AAEA,SAAOA,KAAK,KAAKN,QAAQ,CAACO,OAAnB,GACH,oBAAC,IAAD;AAAM,IAAA,SAAS,EAAC,MAAhB;AAAuB,IAAA,MAAM,EAAC;AAA9B,KAA4CF,KAA5C,EADG,GAEH,oBAAC,KAAD;AAAO,IAAA,SAAS,EAAC,MAAjB;AAAwB,IAAA,KAAK,EAAC,GAA9B;AAAkC,IAAA,MAAM,EAAC;AAAzC,KAAuDA,KAAvD,EAFJ;AAGD,CAND;;AAQA,IAAMG,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,MAFrBV,KAEqB,QAFrBA,KAEqB;AAAA,MADlBW,SACkB;;AACrB,MAAMC,QAAQ,GAAGtB,WAAW,EAA5B;AACA,MAAMuB,QAAQ,GAAGtB,YAAY,CAACgB,KAAD,CAAZ,IAAuBE,UAAU,IAAIG,QAAQ,KAAKvB,GAAnE;AAEA,SACE,oBAAC,QAAD,eACMsB,SADN;AAEE,IAAA,SAAS,EACP1B,UAAU,CACRC,YAAY,CAAC,YAAD,EAAe0B,QAAf,CADJ,EAER;AACE,yBAAmBH,UADrB;AAEE,0BAAoBC;AAFtB,KAFQ,8BAMaV,KANb;AAHd,MAaGI,MAbH,EAcE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,oBAAC,oBAAD;AAAsB,IAAA,SAAS,EAAC;AAAhC,KAAwDE,QAAxD,CADF,EAEGf,YAAY,CAACY,KAAD,CAAZ,IACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KACGA,KADH,CAHJ,CADF,EASGK,WAAW,IAAI,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC,MAAnB;AAA0B,IAAA,MAAM,EAAC,SAAjC;AAA2C,IAAA,SAAS,EAAC;AAArD,KAAgFA,WAAhF,CATlB,CAdF,EAyBGjB,YAAY,CAACc,SAAD,CAAZ,IACC,oBAAC,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,KAAKvB,GAA3B,IAAkC,oBAAC,aAAD,OAFrC,CA7BJ,CADF;AAqCD,CApDD;;AAsDA,eAAeI,cAAc,CAACS,UAAD,EAAa;AAAEF,EAAAA,KAAK,EAAE;AAAT,CAAb,CAA7B","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":["classNames","getClassName","Tappable","Icon24Chevron","IOS","usePlatform","hasReactNode","useAdaptivity","withAdaptivity","SizeType","Title","Text","Subhead","SimpleCellTypography","props","sizeY","COMPACT","SimpleCell","badge","before","indicator","children","after","description","expandable","multiline","restProps","platform","hasAfter"],"mappings":";;;;AAEA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,aAAT,QAA8B,kBAA9B;AACA,SAASC,GAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,aAAT;AACA,SAASC,cAAT,EAAyBC,QAAzB;AACA,OAAOC,KAAP;AACA,OAAOC,IAAP;AACA,OAAOC,OAAP;;AAuCA,IAAMC,oBAAyD,GAAG,SAA5DA,oBAA4D,CAACC,KAAD,EAAsC;AACtG,uBAAkBP,aAAa,EAA/B;AAAA,MAAQQ,KAAR,kBAAQA,KAAR;;AAEA,SAAOA,KAAK,KAAKN,QAAQ,CAACO,OAAnB,GACH,oBAAC,IAAD;AAAM,IAAA,SAAS,EAAC,MAAhB;AAAuB,IAAA,MAAM,EAAC;AAA9B,KAA4CF,KAA5C,EADG,GAEH,oBAAC,KAAD;AAAO,IAAA,SAAS,EAAC,MAAjB;AAAwB,IAAA,KAAK,EAAC,GAA9B;AAAkC,IAAA,MAAM,EAAC;AAAzC,KAAuDA,KAAvD,EAFJ;AAGD,CAND;;AAQA,IAAMG,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,MAFrBV,KAEqB,QAFrBA,KAEqB;AAAA,MADlBW,SACkB;;AACrB,MAAMC,QAAQ,GAAGtB,WAAW,EAA5B;AACA,MAAMuB,QAAQ,GAAGtB,YAAY,CAACgB,KAAD,CAAZ,IAAuBE,UAAU,IAAIG,QAAQ,KAAKvB,GAAnE;AAEA,SACE,oBAAC,QAAD,eACMsB,SADN;AAEE,IAAA,SAAS,EACP1B,UAAU,CACRC,YAAY,CAAC,YAAD,EAAe0B,QAAf,CADJ,EAER;AACE,yBAAmBH,UADrB;AAEE,0BAAoBC;AAFtB,KAFQ,8BAMaV,KANb;AAHd,MAaGI,MAbH,EAcE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,oBAAC,oBAAD;AAAsB,IAAA,SAAS,EAAC;AAAhC,KAAwDE,QAAxD,CADF,EAEGf,YAAY,CAACY,KAAD,CAAZ,IACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KACGA,KADH,CAHJ,CADF,EASGK,WAAW,IAAI,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC,MAAnB;AAA0B,IAAA,MAAM,EAAC,SAAjC;AAA2C,IAAA,SAAS,EAAC;AAArD,KAAgFA,WAAhF,CATlB,CAdF,EAyBGjB,YAAY,CAACc,SAAD,CAAZ,IACC,oBAAC,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,KAAKvB,GAA3B,IAAkC,oBAAC,aAAD,OAFrC,CA7BJ,CADF;AAqCD,CApDD;;AAsDA,eAAeI,cAAc,CAACS,UAAD,EAAa;AAAEF,EAAAA,KAAK,EAAE;AAAT,CAAb,CAA7B","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/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/components/SplitCol/SplitCol.js

@@ -15,7 +15,8 @@ export 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 = _objectWithoutProperties(props, _excluded);
@@ -44,7 +45,4 @@ export var SplitCol = function SplitCol(props) {
     vkuiClass: "SplitCol__fixedInner"
   }, children) : children));
 };
-SplitCol.defaultProps = {
-  animate: false
-};
 //# sourceMappingURL=SplitCol.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SplitCol/SplitCol.tsx"],"names":["React","classNames","SplitColContext","createContext","colRef","animate","SplitCol","props","children","width","maxWidth","minWidth","spaced","fixed","style","restProps","baseRef","useRef","contextValue","useMemo","defaultProps"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AAQA,OAAO,IAAMC,eAAe,gBAAGF,KAAK,CAACG,aAAN,CAA0C;AACvEC,EAAAA,MAAM,EAAE,IAD+D;AAEvEC,EAAAA,OAAO,EAAE;AAF8D,CAA1C,CAAxB;AAoBP,OAAO,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,4BAA6FR,KAA7F;;AACA,MAAMS,OAAO,GAAGhB,KAAK,CAACiB,MAAN,EAAhB;AAEA,MAAMC,YAAY,GAAGlB,KAAK,CAACmB,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,wCACMU,SADN;AAEE,IAAA,KAAK,kCACAD,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,EAAEf,UAAU,CAAC,UAAD,EAAa;AAChC,0BAAoBW,MADY;AAEhC,yBAAmBC;AAFa,KAAb;AATvB,MAcE,oBAAC,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":["React","classNames","SplitColContext","createContext","colRef","animate","SplitCol","props","children","width","maxWidth","minWidth","spaced","fixed","style","restProps","baseRef","useRef","contextValue","useMemo"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AAQA,OAAO,IAAMC,eAAe,gBAAGF,KAAK,CAACG,aAAN,CAA0C;AACvEC,EAAAA,MAAM,EAAE,IAD+D;AAEvEC,EAAAA,OAAO,EAAE;AAF8D,CAA1C,CAAxB;AAoBP,OAAO,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,4BAAqGR,KAArG;;AACA,MAAMS,OAAO,GAAGhB,KAAK,CAACiB,MAAN,EAAhB;AAEA,MAAMC,YAAY,GAAGlB,KAAK,CAACmB,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,wCACMU,SADN;AAEE,IAAA,KAAK,kCACAD,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,EAAEf,UAAU,CAAC,UAAD,EAAa;AAChC,0BAAoBW,MADY;AAEhC,yBAAmBC;AAFa,KAAb;AATvB,MAcE,oBAAC,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/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>;