@vkontakte/vkui 4.19.0 → 4.22.0

package/dist/cssm/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";
@@ -16,109 +17,117 @@ import IconButton from "../IconButton/IconButton";
 import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
 import Tappable from "../Tappable/Tappable";
 import "./Removable.css";
-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/cssm/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/cssm/components/Root/Root.css

@@ -1 +1 @@
-.vkuiRoot{width:100%;height:100%;position:relative}.vkuiRoot--transition{pointer-events:none}.vkuiRoot__view{width:100%;height:100%;position:relative}.vkuiRoot--transition .vkuiRoot__view{position:fixed;left:0;top:0;overflow:hidden}.vkuiRoot__view--show-back,.vkuiRoot__view--hide-forward{z-index:1}.vkuiRoot__view--show-forward,.vkuiRoot__view--hide-back{z-index:2}.vkuiRoot__popout{position:fixed;left:0;top:0;z-index:100;width:100%;height:100%}.vkuiRoot__modal{position:fixed;left:0;top:0;z-index:99;width:100%;height:100%}.vkuiRoot__modal:empty{display:none}.vkuiRoot--ios .vkuiRoot__view--show-back::after,.vkuiRoot--ios .vkuiRoot__view--hide-forward::after{position:absolute;width:100%;height:100%;left:0;top:0;display:block;content:'';background-color:#000;z-index:6}.vkuiRoot--ios .vkuiRoot__view--show-back::after{-webkit-animation:vkui-root-ios-animation-show-back .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-show-back .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-show-back .6s var(--ios-easing);animation:vkui-root-ios-animation-show-back .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--hide-forward::after{-webkit-animation:vkui-root-ios-animation-hide-forward .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-hide-forward .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-hide-forward .6s var(--ios-easing);animation:vkui-root-ios-animation-hide-forward .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--show-forward{-webkit-animation:vkui-root-ios-animation-show-forward .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-show-forward .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-show-forward .6s var(--ios-easing);animation:vkui-root-ios-animation-show-forward .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--hide-back{-webkit-animation:vkui-root-ios-animation-hide-back .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-hide-back .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-hide-back .6s var(--ios-easing);animation:vkui-root-ios-animation-hide-back .6s var(--ios-easing)}@-webkit-keyframes vkui-root-ios-animation-show-back{0%{opacity:.3}to{opacity:0}}@keyframes vkui-root-ios-animation-show-back{0%{opacity:.3}to{opacity:0}}@-webkit-keyframes vkui-root-ios-animation-hide-forward{0%{opacity:0}to{opacity:.3}}@keyframes vkui-root-ios-animation-hide-forward{0%{opacity:0}to{opacity:.3}}@-webkit-keyframes vkui-root-ios-animation-hide-back{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes vkui-root-ios-animation-hide-back{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@-webkit-keyframes vkui-root-ios-animation-show-forward{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes vkui-root-ios-animation-show-forward{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.vkuiRoot--android .vkuiRoot__view--show-forward,.vkuiRoot--vkcom .vkuiRoot__view--show-forward{-webkit-animation:vkui-root-android-animation-show-forward .3s cubic-bezier(.4,0,.2,1);animation:vkui-root-android-animation-show-forward .3s cubic-bezier(.4,0,.2,1);-webkit-animation:vkui-root-android-animation-show-forward .3s var(--android-easing);animation:vkui-root-android-animation-show-forward .3s var(--android-easing)}.vkuiRoot--android .vkuiRoot__view--hide-back,.vkuiRoot--vkcom .vkuiRoot__view--hide-back{-webkit-animation:vkui-root-android-animation-hide-back .3s cubic-bezier(.4,0,.2,1);animation:vkui-root-android-animation-hide-back .3s cubic-bezier(.4,0,.2,1);-webkit-animation:vkui-root-android-animation-hide-back .3s var(--android-easing);animation:vkui-root-android-animation-hide-back .3s var(--android-easing)}@-webkit-keyframes vkui-root-android-animation-hide-back{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}}@keyframes vkui-root-android-animation-hide-back{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}}@-webkit-keyframes vkui-root-android-animation-show-forward{0%{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes vkui-root-android-animation-show-forward{0%{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.vkuiRoot--ios.vkuiRoot--no-motion .vkuiRoot__view,.vkuiRoot--android.vkuiRoot--no-motion .vkuiRoot__view,.vkuiRoot--vkcom.vkuiRoot--no-motion .vkuiRoot__view{-webkit-animation:none;animation:none}
+.vkuiRoot{width:100%;height:100%;position:relative}.vkuiRoot--transition{pointer-events:none}.vkuiRoot__view{width:100%;height:100%;position:relative}.vkuiRoot--transition .vkuiRoot__view{position:fixed;left:0;top:0;overflow:hidden}.vkuiRoot__scrollCompensation{width:100%;height:100%}.vkuiRoot__view--show-back,.vkuiRoot__view--hide-forward{z-index:1}.vkuiRoot__view--show-forward,.vkuiRoot__view--hide-back{z-index:2}.vkuiRoot__popout{position:fixed;left:0;top:0;z-index:100;width:100%;height:100%}.vkuiRoot__modal{position:fixed;left:0;top:0;z-index:99;width:100%;height:100%}.vkuiRoot__modal:empty{display:none}.vkuiRoot--ios .vkuiRoot__view--show-back::after,.vkuiRoot--ios .vkuiRoot__view--hide-forward::after{position:absolute;width:100%;height:100%;left:0;top:0;display:block;content:'';background-color:#000;z-index:6}.vkuiRoot--ios .vkuiRoot__view--show-back::after{-webkit-animation:vkui-root-ios-animation-show-back .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-show-back .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-show-back .6s var(--ios-easing);animation:vkui-root-ios-animation-show-back .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--hide-forward::after{-webkit-animation:vkui-root-ios-animation-hide-forward .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-hide-forward .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-hide-forward .6s var(--ios-easing);animation:vkui-root-ios-animation-hide-forward .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--show-forward{-webkit-animation:vkui-root-ios-animation-show-forward .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-show-forward .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-show-forward .6s var(--ios-easing);animation:vkui-root-ios-animation-show-forward .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--hide-back{-webkit-animation:vkui-root-ios-animation-hide-back .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-hide-back .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-hide-back .6s var(--ios-easing);animation:vkui-root-ios-animation-hide-back .6s var(--ios-easing)}@-webkit-keyframes vkui-root-ios-animation-show-back{0%{opacity:.3}to{opacity:0}}@keyframes vkui-root-ios-animation-show-back{0%{opacity:.3}to{opacity:0}}@-webkit-keyframes vkui-root-ios-animation-hide-forward{0%{opacity:0}to{opacity:.3}}@keyframes vkui-root-ios-animation-hide-forward{0%{opacity:0}to{opacity:.3}}@-webkit-keyframes vkui-root-ios-animation-hide-back{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes vkui-root-ios-animation-hide-back{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@-webkit-keyframes vkui-root-ios-animation-show-forward{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes vkui-root-ios-animation-show-forward{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.vkuiRoot--android .vkuiRoot__view--show-forward,.vkuiRoot--vkcom .vkuiRoot__view--show-forward{-webkit-animation:vkui-root-android-animation-show-forward .3s cubic-bezier(.4,0,.2,1);animation:vkui-root-android-animation-show-forward .3s cubic-bezier(.4,0,.2,1);-webkit-animation:vkui-root-android-animation-show-forward .3s var(--android-easing);animation:vkui-root-android-animation-show-forward .3s var(--android-easing)}.vkuiRoot--android .vkuiRoot__view--hide-back,.vkuiRoot--vkcom .vkuiRoot__view--hide-back{-webkit-animation:vkui-root-android-animation-hide-back .3s cubic-bezier(.4,0,.2,1);animation:vkui-root-android-animation-hide-back .3s cubic-bezier(.4,0,.2,1);-webkit-animation:vkui-root-android-animation-hide-back .3s var(--android-easing);animation:vkui-root-android-animation-hide-back .3s var(--android-easing)}@-webkit-keyframes vkui-root-android-animation-hide-back{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}}@keyframes vkui-root-android-animation-hide-back{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}}@-webkit-keyframes vkui-root-android-animation-show-forward{0%{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes vkui-root-android-animation-show-forward{0%{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.vkuiRoot--ios.vkuiRoot--no-motion .vkuiRoot__view,.vkuiRoot--android.vkuiRoot--no-motion .vkuiRoot__view,.vkuiRoot--vkcom.vkuiRoot--no-motion .vkuiRoot__view{-webkit-animation:none;animation:none}

package/dist/cssm/components/Root/Root.js

@@ -156,6 +156,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/cssm/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/cssm/components/Search/Search.css

@@ -1 +1 @@
-.vkuiSearch{overflow:hidden;font-weight:400;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-common);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);line-height:normal}.vkuiSearch__in{position:relative}.vkuiSearch__width{height:36px;height:var(--search_default_height);white-space:nowrap;color:transparent;width:10000px}.vkuiSearch__control{display:flex;justify-content:flex-start;align-items:center;position:absolute;left:0;top:0;width:calc(100% - 1px);height:100%;border-radius:10px}.vkuiSearch__input{-webkit-appearance:textfield;border:0;margin:0;height:36px;height:var(--search_default_height);position:relative;padding:0 22px 0 36px;box-sizing:border-box;font-size:17px;border-radius:10px;max-width:100%;flex-grow:1;min-width:0;background-color:transparent;z-index:2;color:#000;color:var(--text_primary)}.vkuiSearch__input::-webkit-search-decoration,.vkuiSearch__input::-webkit-search-cancel-button,.vkuiSearch__input::-webkit-search-results-button,.vkuiSearch__input::-webkit-search-results-decoration{display:none}.vkuiSearch--has-after .vkuiSearch__input{border-radius:10px 0 0 10px}.vkuiSearch--has-value .vkuiSearch__input,.vkuiSearch--has-icon .vkuiSearch__input,.vkuiSearch--has-value .vkuiSearch__placeholder,.vkuiSearch--has-icon .vkuiSearch__placeholder{padding-right:40px}.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__input,.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__placeholder{padding-right:80px}.vkuiSearch__after-width{font-size:17px;height:36px;height:var(--search_default_height);line-height:36px;line-height:var(--search_default_height);padding-left:12px;padding-right:4px;flex-shrink:0;pointer-events:none;cursor:text}.vkuiSearch__placeholder{position:absolute;left:0;width:100%;cursor:text;z-index:1;text-align:left;height:36px;height:var(--search_default_height);font-size:0;padding-left:12px;padding-right:22px;pointer-events:none;box-sizing:border-box;display:flex}.vkuiSearch__placeholder-in{height:36px;height:var(--search_default_height);display:flex;align-items:center;overflow:hidden;flex-grow:1;max-width:100%}.vkuiSearch__placeholder-text{margin-left:8px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.vkuiSearch--has-value .vkuiSearch__placeholder-text{opacity:0}.vkuiSearch__icons{position:absolute;right:100%;top:0;display:flex;align-items:center;justify-content:center;color:#818c99;color:var(--search_bar_field_tint)}.vkuiSearch__icon{width:40px;height:36px;height:var(--search_default_height);display:flex;align-items:center;justify-content:center}.vkuiSearch__after{position:absolute;left:100%;top:0;line-height:36px;line-height:var(--search_default_height);z-index:2;-webkit-transform:translate(0);transform:translate(0);transition:-webkit-transform .3s cubic-bezier(.36,.66,.04,1);transition:transform .3s cubic-bezier(.36,.66,.04,1);transition:transform .3s cubic-bezier(.36,.66,.04,1),-webkit-transform .3s cubic-bezier(.36,.66,.04,1);transition:-webkit-transform .3s var(--ios-easing);transition:transform .3s var(--ios-easing);transition:transform .3s var(--ios-easing),-webkit-transform .3s var(--ios-easing);cursor:default}.vkuiSearch--focused .vkuiSearch__after,.vkuiSearch--has-value .vkuiSearch__after{-webkit-transform:translate(-100%);transform:translate(-100%)}.vkuiSearch__after::before{position:absolute;right:calc(100% - 1px);display:block;height:100%;width:10px;content:'';pointer-events:none}.vkuiSearch__after-in{position:relative;z-index:2;cursor:pointer;font-size:17px;padding-left:12px;padding-right:4px}.vkuiSearch__after::after{position:absolute;right:100%;display:block;height:100%;width:10px;content:'';top:0;border-radius:0 10px 10px 0;cursor:text;pointer-events:none}.vkuiGroup--plain .vkuiSearch{padding-top:4px}.vkuiSearch{background:#fff;background:var(--search_bar_background)}.vkuiSearch__control{background-color:#ebedf0;background-color:var(--search_bar_field_background)}.vkuiSearch__input{color:#000;color:var(--text_primary)}.vkuiSearch__placeholder{color:#818c99;color:var(--search_bar_field_tint)}.vkuiSearch__after-width{background:#ebedf0;background:var(--search_bar_field_background);color:#ebedf0;color:var(--search_bar_field_background)}.vkuiSearch__after{background:#fff;background:var(--search_bar_background);color:#2688eb;color:var(--accent)}.vkuiSearch__after::after{background-color:#ebedf0;background-color:var(--search_bar_field_background)}.vkuiSearch__after::before{background-color:#fff;background-color:var(--search_bar_background)}.vkuiPanelHeader .vkuiSearch{background:#fff;background:var(--header_background)}.vkuiPanelHeader .vkuiSearch__control{background-color:#ebedf0;background-color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__input{color:#000;color:var(--text_primary)}.vkuiPanelHeader .vkuiSearch__placeholder{color:#818c99;color:var(--header_search_field_tint)}.vkuiPanelHeader .vkuiSearch__after-width{background:#ebedf0;background:var(--header_search_field_background);color:#ebedf0;color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__after{background:#fff;background:var(--header_background);color:#2688eb;color:var(--header_tint)}.vkuiPanelHeader .vkuiSearch__after::after{background-color:#ebedf0;background-color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__after::before{background-color:#fff;background-color:var(--header_background)}.vkuiSearch--ios{padding:8px 12px}.vkuiSearch--android{padding:8px 16px}.vkuiSearch--vkcom,.vkuiPanelHeader--vkcom .vkuiSearch{background:0 0}.vkuiSearch--vkcom .vkuiSearch__in{padding-top:6px;padding-bottom:6px}.vkuiSearch--vkcom .vkuiSearch__input{font-size:15px;line-height:20px;padding-left:40px}.vkuiSearch--vkcom .vkuiSearch__placeholder{padding-left:16px}.vkuiSearch--vkcom .vkuiSearch__icons{top:4px;right:calc(100% + 8px)}.vkuiSearch--vkcom.vkuiSearch--has-value .vkuiSearch__input{padding-right:56px}.vkuiSearch--vkcom.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__input{padding-right:92px}.vkuiSearch--vkcom .vkuiSearch__icon{width:40px;height:40px}.vkuiSearch--vkcom .vkuiSearch__icon:hover{background-color:rgba(0,0,0,.04);background-color:var(--background_hover);border-radius:50%}.vkuiSearch--vkcom .vkuiSearch__control{background-color:transparent}.vkuiPanelHeader--vkcom .vkuiSearch__separator{display:none}.vkuiSearch--vkcom .vkuiSearch__separator{color:#e1e3e6;color:var(--input_border)}.vkuiGroup--card .vkuiSearch--vkcom{margin:0 -8px}.vkuiGroup--card .vkuiSearch--vkcom:first-child{margin-top:-8px}.vkuiGroup--card .vkuiSearch--vkcom:not(:last-child){margin-bottom:8px}.vkuiGroup--card .vkuiSearch--vkcom .vkuiSearch__placeholder{padding-left:20px}.vkuiGroup--card .vkuiSearch--vkcom .vkuiSearch__input{padding-left:44px}
+.vkuiSearch{overflow:hidden;font-weight:400;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-common);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);line-height:normal}.vkuiSearch__in{position:relative}.vkuiSearch__width{height:36px;height:var(--search_default_height);white-space:nowrap;color:transparent;width:10000px}.vkuiSearch__control{display:flex;justify-content:flex-start;align-items:center;position:absolute;left:0;top:0;width:calc(100% - 1px);height:100%;border-radius:10px}.vkuiSearch__input{-webkit-appearance:none;border:0;margin:0;height:36px;height:var(--search_default_height);position:relative;padding:0 22px 0 36px;box-sizing:border-box;font-size:17px;border-radius:10px;max-width:100%;flex-grow:1;min-width:0;background-color:transparent;z-index:2;color:#000;color:var(--text_primary)}.vkuiSearch__input::-webkit-search-decoration,.vkuiSearch__input::-webkit-search-cancel-button,.vkuiSearch__input::-webkit-search-results-button,.vkuiSearch__input::-webkit-search-results-decoration{display:none}.vkuiSearch--has-after .vkuiSearch__input{border-radius:10px 0 0 10px}.vkuiSearch--has-value .vkuiSearch__input,.vkuiSearch--has-icon .vkuiSearch__input,.vkuiSearch--has-value .vkuiSearch__placeholder,.vkuiSearch--has-icon .vkuiSearch__placeholder{padding-right:40px}.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__input,.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__placeholder{padding-right:80px}.vkuiSearch__after-width{font-size:17px;height:36px;height:var(--search_default_height);line-height:36px;line-height:var(--search_default_height);padding-left:12px;padding-right:4px;flex-shrink:0;pointer-events:none;cursor:text}.vkuiSearch__placeholder{position:absolute;left:0;width:100%;cursor:text;z-index:1;text-align:left;height:36px;height:var(--search_default_height);font-size:0;padding-left:12px;padding-right:22px;pointer-events:none;box-sizing:border-box;display:flex}.vkuiSearch__placeholder-in{height:36px;height:var(--search_default_height);display:flex;align-items:center;overflow:hidden;flex-grow:1;max-width:100%}.vkuiSearch__placeholder-text{margin-left:8px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.vkuiSearch--has-value .vkuiSearch__placeholder-text{opacity:0}.vkuiSearch__icons{position:absolute;right:100%;top:0;display:flex;align-items:center;justify-content:center;color:#818c99;color:var(--search_bar_field_tint)}.vkuiSearch__icon{width:40px;height:36px;height:var(--search_default_height);display:flex;align-items:center;justify-content:center}.vkuiSearch__after{position:absolute;left:100%;top:0;line-height:36px;line-height:var(--search_default_height);z-index:2;-webkit-transform:translate(0);transform:translate(0);transition:-webkit-transform .3s cubic-bezier(.36,.66,.04,1);transition:transform .3s cubic-bezier(.36,.66,.04,1);transition:transform .3s cubic-bezier(.36,.66,.04,1),-webkit-transform .3s cubic-bezier(.36,.66,.04,1);transition:-webkit-transform .3s var(--ios-easing);transition:transform .3s var(--ios-easing);transition:transform .3s var(--ios-easing),-webkit-transform .3s var(--ios-easing);cursor:default}.vkuiSearch--focused .vkuiSearch__after,.vkuiSearch--has-value .vkuiSearch__after{-webkit-transform:translate(-100%);transform:translate(-100%)}.vkuiSearch__after::before{position:absolute;right:calc(100% - 1px);display:block;height:100%;width:10px;content:'';pointer-events:none}.vkuiSearch__after-in{position:relative;z-index:2;cursor:pointer;font-size:17px;padding-left:12px;padding-right:4px}.vkuiSearch__after::after{position:absolute;right:100%;display:block;height:100%;width:10px;content:'';top:0;border-radius:0 10px 10px 0;cursor:text;pointer-events:none}.vkuiGroup--plain .vkuiSearch{padding-top:4px}.vkuiSearch{background:#fff;background:var(--search_bar_background)}.vkuiSearch__control{background-color:#ebedf0;background-color:var(--search_bar_field_background)}.vkuiSearch__input{color:#000;color:var(--text_primary)}.vkuiSearch__placeholder{color:#818c99;color:var(--search_bar_field_tint)}.vkuiSearch__after-width{background:#ebedf0;background:var(--search_bar_field_background);color:#ebedf0;color:var(--search_bar_field_background)}.vkuiSearch__after{background:#fff;background:var(--search_bar_background);color:#2688eb;color:var(--accent)}.vkuiSearch__after::after{background-color:#ebedf0;background-color:var(--search_bar_field_background)}.vkuiSearch__after::before{background-color:#fff;background-color:var(--search_bar_background)}.vkuiPanelHeader .vkuiSearch{background:#fff;background:var(--header_background)}.vkuiPanelHeader .vkuiSearch__control{background-color:#ebedf0;background-color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__input{color:#000;color:var(--text_primary)}.vkuiPanelHeader .vkuiSearch__placeholder{color:#818c99;color:var(--header_search_field_tint)}.vkuiPanelHeader .vkuiSearch__after-width{background:#ebedf0;background:var(--header_search_field_background);color:#ebedf0;color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__after{background:#fff;background:var(--header_background);color:#2688eb;color:var(--header_tint)}.vkuiPanelHeader .vkuiSearch__after::after{background-color:#ebedf0;background-color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__after::before{background-color:#fff;background-color:var(--header_background)}.vkuiSearch--ios{padding:8px 12px}.vkuiSearch--android{padding:8px 16px}.vkuiSearch--vkcom,.vkuiPanelHeader--vkcom .vkuiSearch{background:0 0}.vkuiSearch--vkcom .vkuiSearch__in{padding-top:6px;padding-bottom:6px}.vkuiSearch--vkcom .vkuiSearch__input{font-size:15px;line-height:20px;padding-left:40px}.vkuiSearch--vkcom .vkuiSearch__placeholder{padding-left:16px}.vkuiSearch--vkcom .vkuiSearch__icons{top:4px;right:calc(100% + 8px)}.vkuiSearch--vkcom.vkuiSearch--has-value .vkuiSearch__input{padding-right:56px}.vkuiSearch--vkcom.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__input{padding-right:92px}.vkuiSearch--vkcom .vkuiSearch__icon{width:40px;height:40px}.vkuiSearch--vkcom .vkuiSearch__icon:hover{background-color:rgba(0,0,0,.04);background-color:var(--background_hover);border-radius:50%}.vkuiSearch--vkcom .vkuiSearch__control{background-color:transparent}.vkuiPanelHeader--vkcom .vkuiSearch__separator{display:none}.vkuiSearch--vkcom .vkuiSearch__separator{color:#e1e3e6;color:var(--input_border)}.vkuiGroup--card .vkuiSearch--vkcom{margin:0 -8px}.vkuiGroup--card .vkuiSearch--vkcom:first-child{margin-top:-8px}.vkuiGroup--card .vkuiSearch--vkcom:not(:last-child){margin-bottom:8px}.vkuiGroup--card .vkuiSearch--vkcom .vkuiSearch__placeholder{padding-left:20px}.vkuiGroup--card .vkuiSearch--vkcom .vkuiSearch__input{padding-left:44px}

package/dist/cssm/components/Search/Search.js

@@ -124,7 +124,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/cssm/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/cssm/components/Select/Select.css

@@ -1 +1 @@
-.vkuiSelect{position:relative;box-sizing:border-box}.vkuiSelect__el{display:block;position:absolute;-webkit-appearance:none;appearance:none;border:0;left:0;top:0;width:100%;height:100%;opacity:0;z-index:3;font-size:16px}.vkuiSelect__container{flex-grow:1;flex-shrink:1;padding:11px;color:#000;color:var(--text_primary);box-sizing:border-box;position:relative;z-index:2;cursor:pointer;overflow:hidden}.vkuiSelect__title{display:block}.vkuiSelect:not(.vkuiSelect--multiline) .vkuiSelect__title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.vkuiSelect--not-selected .vkuiSelect__title{color:#818c99;color:var(--field_text_placeholder)}.vkuiSelect--align-right .vkuiSelect__title{text-align:right}.vkuiSelect--align-center .vkuiSelect__title{text-align:center}.vkuiSelect--sizeY--compact .vkuiSelect__container{padding:7px 11px}
+.vkuiSelect{position:relative;cursor:pointer;box-sizing:border-box}.vkuiSelect__el{display:block;position:absolute;-webkit-appearance:none;appearance:none;border:0;left:0;top:0;width:100%;height:100%;opacity:0;z-index:3;font-size:16px}.vkuiSelect__container{flex-grow:1;flex-shrink:1;padding:11px;color:#000;color:var(--text_primary);box-sizing:border-box;position:relative;z-index:2;overflow:hidden}.vkuiSelect__title{display:block}.vkuiSelect:not(.vkuiSelect--multiline) .vkuiSelect__title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.vkuiSelect--not-selected .vkuiSelect__title{color:#818c99;color:var(--field_text_placeholder)}.vkuiSelect--align-right .vkuiSelect__title{text-align:right}.vkuiSelect--align-center .vkuiSelect__title{text-align:center}.vkuiSelect--sizeY--compact .vkuiSelect__container{padding:7px 11px}

package/dist/cssm/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";
@@ -40,7 +40,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/cssm/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;AACA;;AAWA,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;AACA;;AAWA,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/cssm/components/SimpleCell/SimpleCell.css

@@ -1 +1 @@
-.vkuiSimpleCell{display:flex;align-items:center;min-height:48px;white-space:nowrap;text-decoration:none;color:#000;color:var(--text_primary)}.vkuiFormItem .vkuiSimpleCell{width:100%;box-sizing:content-box;margin:0 calc(-1*16px);margin:0 calc(-1*var(--formitem_padding))}.vkuiSimpleCell--mult{white-space:normal}.vkuiSimpleCell--mult .vkuiSimpleCell__description,.vkuiSimpleCell--mult .vkuiSimpleCell__children{text-overflow:initial}.vkuiSimpleCell__main{max-width:100%;flex-grow:1;min-width:0;flex-shrink:initial;overflow:hidden}.vkuiSimpleCell>.vkuiIcon{padding-top:10px;padding-bottom:10px;padding-right:12px;flex-shrink:0;color:#2688eb;color:var(--accent)}.vkuiSimpleCell>.vkuiIcon--28{padding-right:16px}.vkuiSimpleCell__description{color:#818c99;color:var(--text_secondary);text-overflow:ellipsis;overflow:hidden;margin-top:3px;display:block}.vkuiSimpleCell>.vkuiAvatar--sz-32~.vkuiSimpleCell__main .vkuiSimpleCell__description,.vkuiSimpleCell>.vkuiAvatar--sz-28~.vkuiSimpleCell__main .vkuiSimpleCell__description{margin-top:2px}.vkuiSimpleCell:not(.vkuiSimpleCell--mult) .vkuiSimpleCell__content{display:flex;flex-flow:row nowrap;align-content:flex-start;align-items:center;justify-content:flex-start;max-width:100%}.vkuiSimpleCell__children{color:inherit;text-overflow:ellipsis;overflow:hidden;display:block}.vkuiSimpleCell__badge{display:inline-block;flex-grow:0;flex-shrink:0;margin-left:4px;color:#5c9ce6;color:var(--blue_200)}.vkuiSimpleCell__badge .vkuiBadge{margin-top:2px;margin-left:3px}.vkuiSimpleCell--mult .vkuiSimpleCell__badge{vertical-align:top}.vkuiSimpleCell--mult .vkuiSimpleCell__badge .vkuiIcon{-webkit-transform:translateY(2px);transform:translateY(2px)}.vkuiSimpleCell--mult .vkuiSimpleCell__badge .vkuiBadge{margin-top:8px}.vkuiSimpleCell__indicator{color:#818c99;color:var(--text_secondary);min-width:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding-left:4px}.vkuiSimpleCell__after{flex-shrink:0;display:flex;align-items:center;color:#2688eb;color:var(--accent)}.vkuiSimpleCell__after>.vkuiIcon{padding-left:8px}.vkuiSimpleCell__after>.vkuiIcon:last-child{padding-right:2px}.vkuiSimpleCell .vkuiSwitch{padding-left:10px}.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--28,.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--28~*{margin-right:-8px}.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--24,.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--24~*{margin-right:-10px}.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16,.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16~*{margin-right:-14px}.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--w-8,.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--w-8~*{margin-right:-12px}.vkuiSimpleCell--ios{padding-left:12px;padding-right:12px}.vkuiSimpleCell--ios .vkuiSimpleCell__main,.vkuiSimpleCell--ios .vkuiSimpleCell__indicator{padding-top:9px;padding-bottom:11px}.vkuiSimpleCell--ios>.vkuiIcon--28{padding-left:4px}.vkuiSimpleCell--ios .vkuiSimpleCell__after .vkuiIcon--chevron_24{color:#b8c1cc;color:var(--icon_tertiary);padding-right:4px;padding-left:12px}.vkuiSimpleCell--ios .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16,.vkuiSimpleCell--ios .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16~*{margin-right:-12px}.vkuiSimpleCell--ios.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16,.vkuiSimpleCell--ios.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16~*{margin-right:-14px}.vkuiSimpleCell--ios.vkuiSimpleCell--sizeY-regular>.vkuiAvatar:not(.vkuiAvatar--sz-32)~.vkuiSimpleCell__main .vkuiSimpleCell__children,.vkuiSimpleCell--ios.vkuiSimpleCell--sizeY-regular>.vkuiAvatar:not(.vkuiAvatar--sz-32)~.vkuiSimpleCell__indicator{font-size:16px;line-height:20px}.vkuiSimpleCell--android,.vkuiSimpleCell--vkcom{padding-left:16px;padding-right:16px}.vkuiSimpleCell--android .vkuiSimpleCell__main,.vkuiSimpleCell--android .vkuiSimpleCell__indicator,.vkuiSimpleCell--vkcom .vkuiSimpleCell__main,.vkuiSimpleCell--vkcom .vkuiSimpleCell__indicator{padding-top:11px;padding-bottom:10px}.vkuiSimpleCell--sizeY-compact{min-height:44px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__main,.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__indicator{padding-top:10px;padding-bottom:10px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__description,.vkuiSimpleCell--sizeY-compact>.vkuiAvatar--sz-32~.vkuiSimpleCell__main .vkuiSimpleCell__description,.vkuiSimpleCell--sizeY-compact>.vkuiAvatar--sz-28~.vkuiSimpleCell__main .vkuiSimpleCell__description{margin-top:1px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--28,.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--28~*{margin-right:-6px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--24,.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--24~*{margin-right:-8px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16,.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16~*{margin-right:-12px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--w-8,.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--w-8~*{margin-right:-10px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__badge .vkuiBadge{-webkit-transform:translateY(.5px);transform:translateY(.5px)}
+.vkuiSimpleCell{display:flex;align-items:center;min-height:48px;white-space:nowrap;text-decoration:none;color:#000;color:var(--text_primary);padding-left:16px;padding-right:16px}.vkuiSimpleCell--mult{white-space:normal}.vkuiSimpleCell--mult .vkuiSimpleCell__description,.vkuiSimpleCell--mult .vkuiSimpleCell__children{text-overflow:initial}.vkuiSimpleCell__main{max-width:100%;flex-grow:1;min-width:0;overflow:hidden}.vkuiSimpleCell>.vkuiIcon{padding-top:10px;padding-bottom:10px;padding-right:12px;flex-shrink:0;color:#2688eb;color:var(--accent)}.vkuiSimpleCell>.vkuiIcon--28{padding-right:16px}.vkuiSimpleCell__description{color:#818c99;color:var(--text_secondary);text-overflow:ellipsis;overflow:hidden;margin-top:3px;display:block}.vkuiSimpleCell>.vkuiAvatar--sz-32~.vkuiSimpleCell__main .vkuiSimpleCell__description,.vkuiSimpleCell>.vkuiAvatar--sz-28~.vkuiSimpleCell__main .vkuiSimpleCell__description{margin-top:2px}.vkuiSimpleCell:not(.vkuiSimpleCell--mult) .vkuiSimpleCell__content{display:flex;align-content:flex-start;align-items:center;justify-content:flex-start;max-width:100%}.vkuiSimpleCell__children{color:inherit;text-overflow:ellipsis;overflow:hidden;display:block}.vkuiSimpleCell__badge{display:inline-block;flex-grow:0;flex-shrink:0;margin-left:4px;color:#5c9ce6;color:var(--blue_200)}.vkuiSimpleCell__badge .vkuiBadge{margin-top:2px;margin-left:3px}.vkuiSimpleCell--mult .vkuiSimpleCell__badge{vertical-align:top}.vkuiSimpleCell--mult .vkuiSimpleCell__badge .vkuiIcon{-webkit-transform:translateY(2px);transform:translateY(2px)}.vkuiSimpleCell--mult .vkuiSimpleCell__badge .vkuiBadge{margin-top:8px}.vkuiSimpleCell__indicator{color:#818c99;color:var(--text_secondary);min-width:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding-left:4px}.vkuiSimpleCell__after{flex-shrink:0;display:flex;align-items:center;color:#2688eb;color:var(--accent)}.vkuiSimpleCell__after>.vkuiIcon{padding-left:8px}.vkuiSimpleCell__after>.vkuiIcon:last-child{padding-right:2px}.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--28,.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--28~*{margin-right:-8px}.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--24,.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--24~*{margin-right:-10px}.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16,.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16~*{margin-right:-14px}.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--w-8,.vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--w-8~*{margin-right:-12px}.vkuiSimpleCell--ios{padding-left:12px;padding-right:12px}.vkuiSimpleCell--ios .vkuiSimpleCell__main,.vkuiSimpleCell--ios .vkuiSimpleCell__indicator{padding-top:9px;padding-bottom:11px}.vkuiSimpleCell--ios>.vkuiIcon--28{padding-left:4px}.vkuiSimpleCell--ios .vkuiSimpleCell__after .vkuiIcon--chevron_24{color:#b8c1cc;color:var(--icon_tertiary);padding-right:4px;padding-left:12px}.vkuiSimpleCell--ios .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16,.vkuiSimpleCell--ios .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16~*{margin-right:-12px}.vkuiSimpleCell--ios.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16,.vkuiSimpleCell--ios.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16~*{margin-right:-14px}.vkuiSimpleCell--ios.vkuiSimpleCell--sizeY-regular>.vkuiAvatar:not(.vkuiAvatar--sz-32)~.vkuiSimpleCell__main .vkuiSimpleCell__children,.vkuiSimpleCell--ios.vkuiSimpleCell--sizeY-regular>.vkuiAvatar:not(.vkuiAvatar--sz-32)~.vkuiSimpleCell__indicator{font-size:16px;line-height:20px}.vkuiSimpleCell--android .vkuiSimpleCell__main,.vkuiSimpleCell--android .vkuiSimpleCell__indicator,.vkuiSimpleCell--vkcom .vkuiSimpleCell__main,.vkuiSimpleCell--vkcom .vkuiSimpleCell__indicator{padding-top:11px;padding-bottom:10px}.vkuiSimpleCell--sizeY-compact{min-height:44px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__main,.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__indicator{padding-top:10px;padding-bottom:10px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__description,.vkuiSimpleCell--sizeY-compact>.vkuiAvatar--sz-32~.vkuiSimpleCell__main .vkuiSimpleCell__description,.vkuiSimpleCell--sizeY-compact>.vkuiAvatar--sz-28~.vkuiSimpleCell__main .vkuiSimpleCell__description{margin-top:1px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--28,.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--28~*{margin-right:-6px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--24,.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--24~*{margin-right:-8px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16,.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--16~*{margin-right:-12px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--w-8,.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__after .vkuiIconButton .vkuiIcon--w-8~*{margin-right:-10px}.vkuiSimpleCell--sizeY-compact .vkuiSimpleCell__badge .vkuiBadge{-webkit-transform:translateY(.5px);transform:translateY(.5px)}.vkuiFormItem>.vkuiSimpleCell{margin:0 calc(-1*16px);margin:0 calc(-1*var(--formitem_padding))}

package/dist/cssm/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;AACA;;AAyCA,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;AACA;;AAsCA,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/cssm/components/SplitCol/SplitCol.js

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