@vkontakte/vkui 4.15.0 → 4.16.2

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

@@ -1,233 +1,178 @@
 import _extends from "@babel/runtime/helpers/extends";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _createSuper from "@babel/runtime/helpers/createSuper";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["popout", "modal", "platform", "splitCol", "configProvider", "activeView", "onTransition", "window", "document", "scroll", "nav"];
+var _excluded = ["popout", "modal", "children", "activeView", "onTransition", "nav"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from 'react';
 import { classNames } from "../../lib/classNames";
 import { getClassName } from "../../helpers/getClassName";
-import { animationEvent } from "../../lib/supportEvents";
-import { ANDROID, VKCOM } from "../../lib/platform";
-import { withPlatform } from "../../hoc/withPlatform";
-import { withContext } from "../../hoc/withContext";
+import { IOS } from "../../lib/platform";
 import { ConfigProviderContext } from "../ConfigProvider/ConfigProviderContext";
 import { SplitColContext } from "../SplitCol/SplitCol";
 import { AppRootPortal } from "../AppRoot/AppRootPortal";
-import { canUseDOM, withDOM } from "../../lib/dom";
 import { ScrollContext } from "../AppRoot/ScrollContext";
 import { getNavId } from "../../lib/getNavId";
 import { warnOnce } from "../../lib/warnOnce";
+import { useDOM } from "../../lib/dom";
+import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
+import { useTimeout } from "../../hooks/useTimeout";
+import { usePlatform } from "../../hooks/usePlatform";
 import "./Root.css";
 var warn = warnOnce('Root');
 
-var Root = /*#__PURE__*/function (_React$Component) {
-  _inherits(Root, _React$Component);
-
-  var _super = _createSuper(Root);
-
-  function Root(props) {
-    var _this;
-
-    _classCallCheck(this, Root);
-
-    _this = _super.call(this, props);
-
-    _defineProperty(_assertThisInitialized(_this), "animationFinishTimeout", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "viewNodes", {});
-
-    _defineProperty(_assertThisInitialized(_this), "onAnimationEnd", function (e) {
-      if (!e || ['vkui-root-android-animation-hide-back', 'vkui-root-android-animation-show-forward', 'vkui-root-ios-animation-hide-back', 'vkui-root-ios-animation-show-forward'].includes(e.animationName)) {
-        var isBack = _this.state.isBack;
-        var prevView = _this.state.prevView;
-        var nextView = _this.state.nextView;
+var Root = function Root(_ref) {
+  var _ref$popout = _ref.popout,
+      popout = _ref$popout === void 0 ? null : _ref$popout,
+      modal = _ref.modal,
+      children = _ref.children,
+      _activeView = _ref.activeView,
+      onTransition = _ref.onTransition,
+      nav = _ref.nav,
+      restProps = _objectWithoutProperties(_ref, _excluded);
+
+  var scroll = React.useContext(ScrollContext);
+  var platform = usePlatform();
+
+  var _useDOM = useDOM(),
+      document = _useDOM.document;
+
+  var scrolls = React.useRef({}).current;
+  var viewNodes = React.useRef({}).current;
+
+  var _React$useContext = React.useContext(ConfigProviderContext),
+      _React$useContext$tra = _React$useContext.transitionMotionEnabled,
+      transitionMotionEnabled = _React$useContext$tra === void 0 ? true : _React$useContext$tra;
+
+  var _React$useContext2 = React.useContext(SplitColContext),
+      animate = _React$useContext2.animate;
+
+  var disableAnimation = !transitionMotionEnabled || !animate;
+  var views = React.Children.toArray(children);
+
+  var _React$useState = React.useState({
+    activeView: _activeView,
+    transition: false
+  }),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      _React$useState2$ = _React$useState2[0],
+      prevView = _React$useState2$.prevView,
+      activeView = _React$useState2$.activeView,
+      transition = _React$useState2$.transition,
+      isBack = _React$useState2$.isBack,
+      _setState = _React$useState2[1];
+
+  var transitionTo = function transitionTo(panel) {
+    if (panel !== activeView) {
+      var viewIds = views.map(function (view) {
+        return getNavId(view.props, warn);
+      });
 
-        _this.setState({
-          activeView: nextView,
-          prevView: null,
-          nextView: null,
-          visibleViews: [nextView],
-          transition: false,
-          isBack: undefined
-        }, function () {
-          _this.props.scroll.scrollTo(0, isBack ? _this.state.scrolls[_this.state.activeView] : 0);
+      var _isBack = viewIds.indexOf(panel) < viewIds.indexOf(activeView);
 
-          _this.props.onTransition && _this.props.onTransition({
-            isBack: isBack,
-            from: prevView,
-            to: nextView
-          });
-        });
-      }
-    });
+      _setState({
+        activeView: panel,
+        prevView: activeView,
+        transition: true,
+        isBack: _isBack
+      });
+    }
+  };
 
-    _this.state = {
-      activeView: props.activeView,
-      prevView: null,
-      nextView: null,
-      visibleViews: [props.activeView],
-      isBack: undefined,
-      scrolls: {},
+  var finishTransition = function finishTransition() {
+    return _setState({
+      activeView: activeView,
+      prevView: prevView,
+      isBack: isBack,
       transition: false
-    };
-    return _this;
-  }
-
-  _createClass(Root, [{
-    key: "document",
-    get: function get() {
-      return this.props.document;
-    }
-  }, {
-    key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps, prevState) {
-      var _this2 = this;
-
-      if (this.props.popout && !prevProps.popout) {
-        this.blurActiveElement();
-      } // Нужен переход
-
-
-      if (this.props.activeView !== prevProps.activeView) {
-        var pageYOffset = this.props.scroll.getScroll().y;
-        var firstLayerId = [].concat(prevProps.children).map(function (view) {
-          return getNavId(view.props, warn);
-        }).find(function (id) {
-          return id === prevProps.activeView || id === _this2.props.activeView;
-        });
-        var isBack = firstLayerId === this.props.activeView;
-        this.blurActiveElement();
-        var nextView = this.props.activeView;
-        var prevView = prevProps.activeView;
-        this.setState({
-          scrolls: _objectSpread(_objectSpread({}, this.state.scrolls), {}, _defineProperty({}, prevProps.activeView, pageYOffset)),
-          transition: true,
-          activeView: null,
-          nextView: nextView,
-          prevView: prevView,
-          visibleViews: [nextView, prevView],
-          isBack: isBack
-        });
-      } // Начался переход
-
-
-      if (!prevState.transition && this.state.transition) {
-        var prevViewElement = this.viewNodes[this.state.prevView];
-        var nextViewElement = this.viewNodes[this.state.nextView];
-
-        var setPanelScroll = function setPanelScroll(e, scroll) {
-          // eslint-disable-next-line no-restricted-properties
-          var pan = e.querySelector('[data-vkui-active-panel=true]');
-          pan && (pan.scrollTop = scroll);
-        };
-
-        setPanelScroll(prevViewElement, this.state.scrolls[this.state.prevView]);
-
-        if (this.state.isBack) {
-          setPanelScroll(nextViewElement, this.state.scrolls[this.state.nextView]);
-        }
-
-        this.waitAnimationFinish(this.state.isBack ? prevViewElement : nextViewElement, this.onAnimationEnd);
-      }
-    }
-  }, {
-    key: "shouldDisableTransitionMotion",
-    value: function shouldDisableTransitionMotion() {
-      return this.props.configProvider.transitionMotionEnabled === false || !this.props.splitCol.animate;
-    }
-  }, {
-    key: "waitAnimationFinish",
-    value: function waitAnimationFinish(elem, eventHandler) {
-      if (this.shouldDisableTransitionMotion()) {
-        eventHandler();
-        return;
-      }
-
-      if (animationEvent.supported) {
-        elem.removeEventListener(animationEvent.name, eventHandler);
-        elem.addEventListener(animationEvent.name, eventHandler);
-      } else {
-        clearTimeout(this.animationFinishTimeout);
-        this.animationFinishTimeout = setTimeout(eventHandler.bind(this), this.props.platform === ANDROID || this.props.platform === VKCOM ? 300 : 600);
-      }
-    }
-  }, {
-    key: "blurActiveElement",
-    value: function blurActiveElement() {
-      if (canUseDOM && this.document.activeElement) {
-        this.document.activeElement.blur();
-      }
+    });
+  };
+
+  useIsomorphicLayoutEffect(function () {
+    var _document$activeEleme;
+
+    (_document$activeEleme = document.activeElement) === null || _document$activeEleme === void 0 ? void 0 : _document$activeEleme.blur();
+  }, [!!popout, activeView]); // Нужен переход
+
+  useIsomorphicLayoutEffect(function () {
+    return transitionTo(_activeView);
+  }, [_activeView]); // scroll restoration
+
+  useIsomorphicLayoutEffect(function () {
+    if (transition) {
+      // save scroll
+      scrolls[prevView] = scroll.getScroll().y;
+      setPanelScroll(viewNodes[prevView], scrolls[prevView]);
+      isBack && setPanelScroll(viewNodes[activeView], scrolls[activeView]);
+    } else if (prevView) {
+      // Закончился переход
+      scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);
     }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this3 = this;
-
-      var _this$props = this.props,
-          popout = _this$props.popout,
-          modal = _this$props.modal,
-          platform = _this$props.platform,
-          splitCol = _this$props.splitCol,
-          configProvider = _this$props.configProvider,
-          _1 = _this$props.activeView,
-          onTransition = _this$props.onTransition,
-          window = _this$props.window,
-          document = _this$props.document,
-          scroll = _this$props.scroll,
-          nav = _this$props.nav,
-          restProps = _objectWithoutProperties(_this$props, _excluded);
-
-      var _this$state = this.state,
-          transition = _this$state.transition,
-          isBack = _this$state.isBack,
-          prevView = _this$state.prevView,
-          activeView = _this$state.activeView,
-          nextView = _this$state.nextView;
-      var Views = React.Children.toArray(this.props.children).filter(function (view) {
-        return _this3.state.visibleViews.includes(getNavId(view.props, warn));
+  }, [transition]); // onTransition
+
+  useIsomorphicLayoutEffect(function () {
+    if (!transition && prevView) {
+      onTransition && onTransition({
+        isBack: isBack,
+        from: prevView,
+        to: activeView
       });
-      var baseClassName = getClassName('Root', platform);
-      var disableAnimation = this.shouldDisableTransitionMotion();
-      return createScopedElement("div", _extends({}, restProps, {
-        vkuiClass: classNames(baseClassName, {
-          'Root--transition': !disableAnimation && transition,
-          'Root--no-motion': disableAnimation
-        })
-      }), Views.map(function (view) {
-        var viewId = getNavId(view.props, warn);
-        return createScopedElement("div", {
-          key: viewId,
-          ref: function ref(e) {
-            return _this3.viewNodes[viewId] = e;
-          },
-          vkuiClass: classNames('Root__view', {
-            'Root__view--hide-back': viewId === prevView && isBack,
-            'Root__view--hide-forward': viewId === prevView && !isBack,
-            'Root__view--show-back': viewId === nextView && isBack,
-            'Root__view--show-forward': viewId === nextView && !isBack,
-            'Root__view--active': viewId === activeView
-          })
-        }, view);
-      }), createScopedElement(AppRootPortal, null, !!popout && createScopedElement("div", {
-        vkuiClass: "Root__popout"
-      }, popout), !!modal && createScopedElement("div", {
-        vkuiClass: "Root__modal"
-      }, modal)));
     }
-  }]);
+  }, [transition]);
+  var fallbackTransition = useTimeout(finishTransition, platform === IOS ? 600 : 300);
+  React.useEffect(function () {
+    if (!transition) {
+      fallbackTransition.clear();
+      return;
+    }
 
-  return Root;
-}(React.Component);
+    disableAnimation ? finishTransition() : fallbackTransition.set();
+  }, [transition]);
 
-_defineProperty(Root, "defaultProps", {
-  popout: null
-});
+  var onAnimationEnd = function onAnimationEnd(e) {
+    if (['vkui-root-android-animation-hide-back', 'vkui-root-android-animation-show-forward', 'vkui-root-ios-animation-hide-back', 'vkui-root-ios-animation-show-forward'].includes(e.animationName)) {
+      finishTransition();
+    }
+  };
+
+  return createScopedElement("div", _extends({}, restProps, {
+    vkuiClass: classNames(getClassName('Root', platform), {
+      'Root--transition': !disableAnimation && transition,
+      'Root--no-motion': disableAnimation
+    })
+  }), views.map(function (view) {
+    var viewId = getNavId(view.props, warn);
+
+    if (viewId !== activeView && !(transition && viewId === prevView)) {
+      return null;
+    }
 
-export default withContext(withContext(withContext(withPlatform(withDOM(Root)), SplitColContext, 'splitCol'), ConfigProviderContext, 'configProvider'), ScrollContext, 'scroll');
+    var isTransitionTarget = transition && viewId === (isBack ? prevView : activeView);
+    return createScopedElement("div", {
+      key: viewId,
+      ref: function ref(e) {
+        return viewNodes[viewId] = e;
+      },
+      onAnimationEnd: isTransitionTarget ? onAnimationEnd : null,
+      vkuiClass: classNames('Root__view', {
+        'Root__view--hide-back': transition && viewId === prevView && isBack,
+        'Root__view--hide-forward': transition && viewId === prevView && !isBack,
+        'Root__view--show-back': transition && viewId === activeView && isBack,
+        'Root__view--show-forward': transition && viewId === activeView && !isBack,
+        'Root__view--active': !transition && viewId === activeView
+      })
+    }, view);
+  }), createScopedElement(AppRootPortal, null, !!popout && createScopedElement("div", {
+    vkuiClass: "Root__popout"
+  }, popout), !!modal && createScopedElement("div", {
+    vkuiClass: "Root__modal"
+  }, modal)));
+};
+
+export default Root;
+
+function setPanelScroll(e, scroll) {
+  // eslint-disable-next-line no-restricted-properties
+  var pan = e.querySelector('[data-vkui-active-panel=true]');
+  pan && (pan.scrollTop = scroll);
+}
 //# sourceMappingURL=Root.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"names":["React","classNames","getClassName","animationEvent","ANDROID","VKCOM","withPlatform","withContext","ConfigProviderContext","SplitColContext","AppRootPortal","canUseDOM","withDOM","ScrollContext","getNavId","warnOnce","warn","Root","props","e","includes","animationName","isBack","state","prevView","nextView","setState","activeView","visibleViews","transition","undefined","scroll","scrollTo","scrolls","onTransition","from","to","document","prevProps","prevState","popout","blurActiveElement","pageYOffset","getScroll","y","firstLayerId","concat","children","map","view","find","id","prevViewElement","viewNodes","nextViewElement","setPanelScroll","pan","querySelector","scrollTop","waitAnimationFinish","onAnimationEnd","configProvider","transitionMotionEnabled","splitCol","animate","elem","eventHandler","shouldDisableTransitionMotion","supported","removeEventListener","name","addEventListener","clearTimeout","animationFinishTimeout","setTimeout","bind","platform","activeElement","blur","modal","_1","window","nav","restProps","Views","Children","toArray","filter","baseClassName","disableAnimation","viewId","Component"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport { animationEvent } from '../../lib/supportEvents';\nimport { ANDROID, VKCOM } from '../../lib/platform';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { withContext } from '../../hoc/withContext';\nimport { HasPlatform } from '../../types';\nimport { ConfigProviderContext, ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';\nimport { SplitColContextProps, SplitColContext } from '../SplitCol/SplitCol';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { canUseDOM, DOMProps, withDOM } from '../../lib/dom';\nimport { ScrollContext, ScrollContextInterface } from '../AppRoot/ScrollContext';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport './Root.css';\n\nconst warn = warnOnce('Root');\n\nexport interface RootProps extends React.HTMLAttributes<HTMLDivElement>, HasPlatform, 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   * @ignore\n   */\n  splitCol?: SplitColContextProps;\n  /**\n   * @ignore\n   */\n  configProvider?: ConfigProviderContextInterface;\n  /**\n   * @ignore\n   */\n  scroll?: ScrollContextInterface;\n}\n\nexport type AnimationEndCallback = (e?: AnimationEvent) => void;\n\nexport interface RootState {\n  activeView: string;\n  prevView: string;\n  nextView: string;\n  visibleViews: [string] | [string, string];\n  isBack: boolean;\n  scrolls: {\n    [index: string]: number;\n  };\n  transition: boolean;\n}\n\nclass Root extends React.Component<RootProps & DOMProps, RootState> {\n  constructor(props: RootProps) {\n    super(props);\n\n    this.state = {\n      activeView: props.activeView,\n      prevView: null,\n      nextView: null,\n      visibleViews: [props.activeView],\n      isBack: undefined,\n      scrolls: {},\n      transition: false,\n    };\n  }\n\n  static defaultProps: Partial<RootProps> = {\n    popout: null,\n  };\n\n  private animationFinishTimeout: ReturnType<typeof setTimeout>;\n  private viewNodes: { [id: string]: HTMLElement } = {};\n\n  get document() {\n    return this.props.document;\n  }\n\n  componentDidUpdate(prevProps: RootProps, prevState: RootState) {\n    if (this.props.popout && !prevProps.popout) {\n      this.blurActiveElement();\n    }\n\n    // Нужен переход\n    if (this.props.activeView !== prevProps.activeView) {\n      let pageYOffset = this.props.scroll.getScroll().y;\n      const firstLayerId = [].concat(prevProps.children)\n        .map((view) => getNavId(view.props, warn))\n        .find((id) => id === prevProps.activeView || id === this.props.activeView);\n      const isBack = firstLayerId === this.props.activeView;\n\n      this.blurActiveElement();\n\n      const nextView = this.props.activeView;\n      const prevView = prevProps.activeView;\n\n      this.setState({\n        scrolls: {\n          ...this.state.scrolls,\n          [prevProps.activeView]: pageYOffset,\n        },\n        transition: true,\n        activeView: null,\n        nextView,\n        prevView,\n        visibleViews: [nextView, prevView],\n        isBack,\n      });\n    }\n\n    // Начался переход\n    if (!prevState.transition && this.state.transition) {\n      const prevViewElement = this.viewNodes[this.state.prevView];\n      const nextViewElement = this.viewNodes[this.state.nextView];\n      const setPanelScroll = (e: HTMLElement, scroll: number) => {\n        // eslint-disable-next-line no-restricted-properties\n        const pan: HTMLElement | null = e.querySelector('[data-vkui-active-panel=true]');\n        pan && (pan.scrollTop = scroll);\n      };\n\n      setPanelScroll(prevViewElement, this.state.scrolls[this.state.prevView]);\n\n      if (this.state.isBack) {\n        setPanelScroll(nextViewElement, this.state.scrolls[this.state.nextView]);\n      }\n      this.waitAnimationFinish(this.state.isBack ? prevViewElement : nextViewElement, this.onAnimationEnd);\n    }\n  }\n\n  shouldDisableTransitionMotion(): boolean {\n    return this.props.configProvider.transitionMotionEnabled === false ||\n      !this.props.splitCol.animate;\n  }\n\n  waitAnimationFinish(elem: HTMLElement, eventHandler: AnimationEndCallback) {\n    if (this.shouldDisableTransitionMotion()) {\n      eventHandler();\n      return;\n    }\n\n    if (animationEvent.supported) {\n      elem.removeEventListener(animationEvent.name, eventHandler);\n      elem.addEventListener(animationEvent.name, eventHandler);\n    } else {\n      clearTimeout(this.animationFinishTimeout);\n      this.animationFinishTimeout = setTimeout(eventHandler.bind(this), this.props.platform === ANDROID || this.props.platform === VKCOM ? 300 : 600);\n    }\n  }\n\n  onAnimationEnd: AnimationEndCallback = (e?: AnimationEvent) => {\n    if (!e || [\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      const isBack = this.state.isBack;\n      const prevView = this.state.prevView;\n      const nextView = this.state.nextView;\n      this.setState({\n        activeView: nextView,\n        prevView: null,\n        nextView: null,\n        visibleViews: [nextView],\n        transition: false,\n        isBack: undefined,\n      }, () => {\n        this.props.scroll.scrollTo(0, isBack ? this.state.scrolls[this.state.activeView] : 0);\n        this.props.onTransition && this.props.onTransition({ isBack, from: prevView, to: nextView });\n      });\n    }\n  };\n\n  blurActiveElement() {\n    if (canUseDOM && this.document.activeElement) {\n      (this.document.activeElement as HTMLElement).blur();\n    }\n  }\n\n  render() {\n    const {\n      popout, modal, platform,\n      splitCol, configProvider, activeView: _1, onTransition,\n      window, document, scroll, nav,\n      ...restProps\n    } = this.props;\n    const { transition, isBack, prevView, activeView, nextView } = this.state;\n\n    const Views = React.Children.toArray(this.props.children).filter((view: React.ReactElement) => {\n      return this.state.visibleViews.includes(getNavId(view.props, warn));\n    });\n\n    const baseClassName = getClassName('Root', platform);\n    const disableAnimation = this.shouldDisableTransitionMotion();\n\n    return (\n      <div {...restProps} vkuiClass={classNames(baseClassName, {\n        'Root--transition': !disableAnimation && transition,\n        'Root--no-motion': disableAnimation,\n      })}>\n        {Views.map((view: React.ReactElement) => {\n          const viewId = getNavId(view.props, warn);\n          return (\n            <div key={viewId} ref={(e) => this.viewNodes[viewId] = e} vkuiClass={classNames('Root__view', {\n              'Root__view--hide-back': viewId === prevView && isBack,\n              'Root__view--hide-forward': viewId === prevView && !isBack,\n              'Root__view--show-back': viewId === nextView && isBack,\n              'Root__view--show-forward': viewId === nextView && !isBack,\n              'Root__view--active': viewId === activeView,\n            })}>\n              {view}\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}\n\nexport default withContext(withContext(withContext(\n  withPlatform(withDOM<RootProps>(Root)),\n  SplitColContext,\n  'splitCol',\n), ConfigProviderContext, 'configProvider'), ScrollContext, 'scroll');\n"],"file":"Root.js"}
+{"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"names":["React","classNames","getClassName","IOS","ConfigProviderContext","SplitColContext","AppRootPortal","ScrollContext","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","finishTransition","activeElement","blur","getScroll","y","setPanelScroll","scrollTo","from","to","fallbackTransition","useEffect","clear","set","onAnimationEnd","e","includes","animationName","viewId","isTransitionTarget","pan","querySelector","scrollTop"],"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 { 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}) => {\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      _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  // scroll restoration\n  useIsomorphicLayoutEffect(() => {\n    if (transition) {\n      // save scroll\n      scrolls[prevView] = scroll.getScroll().y;\n      setPanelScroll(viewNodes[prevView], scrolls[prevView]);\n      isBack && setPanelScroll(viewNodes[activeView], scrolls[activeView]);\n    } else if (prevView) {\n      // Закончился переход\n      scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);\n    }\n  }, [transition]);\n  // onTransition\n  useIsomorphicLayoutEffect(() => {\n    if (!transition && prevView) {\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        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          >{view}</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\nfunction setPanelScroll(e: HTMLElement, scroll: number) {\n  // eslint-disable-next-line no-restricted-properties\n  const pan: HTMLElement | null = e.querySelector('[data-vkui-active-panel=true]');\n  pan && (pan.scrollTop = scroll);\n}\n"],"file":"Root.js"}

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

@@ -9,7 +9,7 @@ import { withPlatform } from "../../hoc/withPlatform";
 import { getClassName } from "../../helpers/getClassName";
 import { Icon16SearchOutline, Icon16Clear, Icon24Cancel } from '@vkontakte/icons';
 import { IOS, VKCOM } from "../../lib/platform";
-import Touch from "../Touch/Touch";
+import { Touch } from "../Touch/Touch";
 import { noop } from "../../lib/utils";
 import Text from "../Typography/Text/Text";
 import Title from "../Typography/Title/Title";

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 === 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"}

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,MAAM,EAAC;AAAb,KAA2BF,KAA3B,EADG,GAEH,oBAAC,KAAD;AAAO,IAAA,KAAK,EAAC,GAAb;AAAiB,IAAA,MAAM,EAAC;AAAxB,KAAsCA,KAAtC,EAFJ;AAGD,CAND;;AAQA,IAAMG,UAAqC,GAAG,SAAxCA,UAAwC,OAWxC;AAAA,MAVJC,KAUI,QAVJA,KAUI;AAAA,MATJC,MASI,QATJA,MASI;AAAA,MARJC,SAQI,QARJA,SAQI;AAAA,MAPJC,QAOI,QAPJA,QAOI;AAAA,MANJC,KAMI,QANJA,KAMI;AAAA,MALJC,WAKI,QALJA,WAKI;AAAA,MAJJC,UAII,QAJJA,UAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJV,KAEI,QAFJA,KAEI;AAAA,MADDW,SACC;;AACJ,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 weight=\"regular\" {...props} />\n    : <Title 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}) => {\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":";;;;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,MAAM,EAAC;AAAb,KAA2BF,KAA3B,EADG,GAEH,oBAAC,KAAD;AAAO,IAAA,KAAK,EAAC,GAAb;AAAiB,IAAA,MAAM,EAAC;AAAxB,KAAsCA,KAAtC,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 weight=\"regular\" {...props} />\n    : <Title 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/SimpleCheckbox/SimpleCheckbox.css

@@ -0,0 +1 @@
+.vkuiSimpleCheckbox{display:block;margin:-10px;padding:10px;width:24px;height:24px;border-radius:50%}.vkuiSimpleCheckbox__input{position:absolute;-webkit-appearance:none;appearance:none}.vkuiSimpleCheckbox__container{display:flex;align-items:flex-start;justify-content:flex-start}.vkuiSimpleCheckbox__icon{flex-shrink:0;margin:0;box-sizing:border-box;border-radius:4px;display:flex}.vkuiSimpleCheckbox__icon--on{color:#3f8ae0;color:var(--accent);display:none}.vkuiSimpleCheckbox__icon--indeterminate{color:#3f8ae0;color:var(--accent);display:none}.vkuiSimpleCheckbox__icon--off{color:#b8c1cc;color:var(--icon_tertiary)}.vkuiSimpleCheckbox__input:checked~.vkuiSimpleCheckbox__container .vkuiSimpleCheckbox__icon--on{display:flex}.vkuiSimpleCheckbox__input:indeterminate~.vkuiSimpleCheckbox__container .vkuiSimpleCheckbox__icon--indeterminate,.vkuiSimpleCheckbox__input:checked~.vkuiSimpleCheckbox__container .vkuiSimpleCheckbox__icon--off{display:none}.vkuiSimpleCheckbox__input:indeterminate~.vkuiSimpleCheckbox__container .vkuiSimpleCheckbox__icon--indeterminate{display:flex}.vkuiSimpleCheckbox__input:indeterminate~.vkuiSimpleCheckbox__container .vkuiSimpleCheckbox__icon--on,.vkuiSimpleCheckbox__input:indeterminate~.vkuiSimpleCheckbox__container .vkuiSimpleCheckbox__icon--off{display:none}.vkuiSimpleCheckbox__input[disabled]~.vkuiSimpleCheckbox__container{opacity:.6}.vkuiSimpleCheckbox--ios.vkuiSimpleCheckbox--sizeY-compact,.vkuiSimpleCheckbox--android.vkuiSimpleCheckbox--sizeY-compact{margin:-8px;padding:8px;width:20px;height:20px}.vkuiSimpleCheckbox--vkcom{margin:0;padding:0;width:22px;height:22px;border-radius:4px}.vkuiSimpleCheckbox--vkcom .vkuiSimpleCheckbox__activeShadow,.vkuiSimpleCheckbox--vkcom .vkuiSimpleCheckbox__hoverShadow{margin:3px;width:16px;height:16px;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;border-radius:inherit;transition:inherit}.vkuiSimpleCheckbox--vkcom.vkuiSimpleCheckbox--active .vkuiSimpleCheckbox__activeShadow{background-color:rgba(0,0,0,.08);background-color:var(--background_highlighted)}.vkuiSimpleCheckbox--vkcom.vkuiSimpleCheckbox--hover .vkuiSimpleCheckbox__hoverShadow{background-color:rgba(0,0,0,.04);background-color:var(--background_hover)}.vkuiSimpleCheckbox--vkcom .vkuiSimpleCheckbox__icon{border-radius:3px;padding:1px;border-width:1px}.vkuiSimpleCheckbox--vkcom .vkuiSimpleCheckbox__input[disabled]~.vkuiSimpleCheckbox__container{opacity:.4}