@vkontakte/vkui 6.0.2 → 6.1.0

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/RichCell/RichCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { RichCellIcon } from './RichCellIcon/RichCellIcon';\nimport styles from './RichCell.module.css';\n\nconst sizeYClassNames = {\n  none: styles['RichCell--sizeY-none'],\n  ['compact']: styles['RichCell--sizeY-compact'],\n};\n\nexport interface RichCellProps extends TappableProps {\n  /**\n   * Контейнер для текста над `children`.\n   */\n  subhead?: React.ReactNode;\n  /**\n   * Контейнер для текста под `children`.\n   */\n  text?: React.ReactNode;\n  /**\n   * Контейнер для текста под `text`.\n   */\n  caption?: React.ReactNode;\n  /**\n   * Контейнер для контента под `caption`. Например `<UsersStack size=\"m\" />`.\n   */\n  bottom?: React.ReactNode;\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:\n   *\n   * - `mode=\"primary\" size=\"s\"`\n   * - `mode=\"secondary\" size=\"s\"`\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `mode=\"horizontal\" gap=\"s\" stretched`\n   */\n  actions?: React.ReactNode;\n  /**\n   * `<Avatar size={40|48|72} />`.\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 28 или текст.\n   */\n  after?: React.ReactNode;\n  /**\n   * Текст под `after`.\n   */\n  afterCaption?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия.\n   */\n  disabled?: boolean;\n  /**\n   * Включает многострочный режим для `subhead`, `children`, `text` и `caption`.\n   */\n  multiline?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/RichCell\n */\nexport const RichCell = ({\n  subhead,\n  children,\n  text,\n  caption,\n  before,\n  after,\n  afterCaption,\n  bottom,\n  actions,\n  multiline,\n  className,\n  ...restProps\n}: RichCellProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Tappable\n      {...restProps}\n      className={classNames(\n        styles['RichCell'],\n        !multiline && styles['RichCell--text-ellipsis'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        className,\n      )}\n    >\n      {before && <div className={styles['RichCell__before']}>{before}</div>}\n      <div className={styles['RichCell__in']}>\n        <div className={styles['RichCell__content']}>\n          <div className={styles['RichCell__content-before']}>\n            {subhead && (\n              <Subhead Component=\"div\" className={styles['RichCell__subhead']}>\n                {subhead}\n              </Subhead>\n            )}\n            <div className={styles['RichCell__children']}>{children}</div>\n            {text && <div className={styles['RichCell__text']}>{text}</div>}\n            {caption && (\n              <Subhead Component=\"div\" className={styles['RichCell__caption']}>\n                {caption}\n              </Subhead>\n            )}\n          </div>\n          {(after || afterCaption) && (\n            <div className={styles['RichCell__content-after']}>\n              {after && <div className={styles['RichCell__after-children']}>{after}</div>}\n              {afterCaption && (\n                <div className={styles['RichCell__after-caption']}>{afterCaption}</div>\n              )}\n            </div>\n          )}\n        </div>\n        {bottom && <div className={styles['RichCell__bottom']}>{bottom}</div>}\n        {actions && <div className={styles['RichCell__actions']}>{actions}</div>}\n      </div>\n    </Tappable>\n  );\n};\n\nRichCell.Icon = RichCellIcon;\n"],"names":["RichCell","sizeYClassNames","none","subhead","children","text","caption","before","after","afterCaption","bottom","actions","multiline","className","restProps","sizeY","useAdaptivity","Tappable","classNames","div","Subhead","Component","Icon","RichCellIcon"],"mappings":";;;;+BAkEaA;;;eAAAA;;;;;;;iEAlEU;sBACI;+BACG;0BACU;yBAChB;8BACK;AAG7B,MAAMC,kBAAkB;IACtBC,IAAI;IACJ,CAAC,UAAU;AACb;AAuDO,MAAMF,WAAW;QAAC,EACvBG,OAAO,EACPC,QAAQ,EACRC,IAAI,EACJC,OAAO,EACPC,MAAM,EACNC,KAAK,EACLC,YAAY,EACZC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,SAAS,EAEK,WADXC;QAXHX;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,EAAEE,QAAQ,MAAM,EAAE,GAAGC,IAAAA,4BAAa;IAExC,qBACE,qBAACC,kBAAQ,8CACHH;QACJD,WAAWK,IAAAA,gBAAU,kBAEnB,CAACN,4CACDG,UAAU,aAAad,eAAe,CAACc,MAAM,EAC7CF;QAGDN,wBAAU,qBAACY;QAAIN,SAAS;OAA+BN,uBACxD,qBAACY;QAAIN,SAAS;qBACZ,qBAACM;QAAIN,SAAS;qBACZ,qBAACM;QAAIN,SAAS;OACXV,yBACC,qBAACiB,gBAAO;QAACC,WAAU;QAAMR,SAAS;OAC/BV,wBAGL,qBAACgB;QAAIN,SAAS;OAAiCT,WAC9CC,sBAAQ,qBAACc;QAAIN,SAAS;OAA6BR,OACnDC,yBACC,qBAACc,gBAAO;QAACC,WAAU;QAAMR,SAAS;OAC/BP,WAIN,AAACE,CAAAA,SAASC,YAAW,mBACpB,qBAACU;QAAIN,SAAS;OACXL,uBAAS,qBAACW;QAAIN,SAAS;OAAuCL,QAC9DC,8BACC,qBAACU;QAAIN,SAAS;OAAsCJ,iBAK3DC,wBAAU,qBAACS;QAAIN,SAAS;OAA+BH,SACvDC,yBAAW,qBAACQ;QAAIN,SAAS;OAAgCF;AAIlE;AAEAX,SAASsB,IAAI,GAAGC,0BAAY"}
+{"version":3,"sources":["../../../../src/components/RichCell/RichCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { RichCellIcon } from './RichCellIcon/RichCellIcon';\nimport styles from './RichCell.module.css';\n\nconst sizeYClassNames = {\n  none: styles['RichCell--sizeY-none'],\n  ['compact']: styles['RichCell--sizeY-compact'],\n};\n\nexport interface RichCellProps extends TappableProps {\n  /**\n   * Контейнер для текста над `children`.\n   */\n  subhead?: React.ReactNode;\n  /**\n   * Контейнер для текста под `children`.\n   */\n  text?: React.ReactNode;\n  /**\n   * Контейнер для текста под `text`.\n   */\n  caption?: React.ReactNode;\n  /**\n   * Контейнер для контента под `caption`. Например `<UsersStack size=\"m\" />`.\n   */\n  bottom?: React.ReactNode;\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:\n   *\n   * - `mode=\"primary\" size=\"s\"`\n   * - `mode=\"secondary\" size=\"s\"`\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `mode=\"horizontal\" gap=\"s\" stretched`\n   */\n  actions?: React.ReactNode;\n  /**\n   * `<Avatar size={40|48|72} />`.\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 28 или текст.\n   */\n  after?: React.ReactNode;\n  /**\n   * Текст под `after`.\n   */\n  afterCaption?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия.\n   */\n  disabled?: boolean;\n  /**\n   * Включает многострочный режим для `subhead`, `children`, `text` и `caption`.\n   */\n  multiline?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/RichCell\n */\nexport const RichCell = ({\n  subhead,\n  children,\n  text,\n  caption,\n  before,\n  after,\n  afterCaption,\n  bottom,\n  actions,\n  multiline,\n  className,\n  ...restProps\n}: RichCellProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Tappable\n      {...restProps}\n      className={classNames(\n        styles['RichCell'],\n        !multiline && styles['RichCell--text-ellipsis'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        className,\n      )}\n    >\n      {before && <div className={styles['RichCell__before']}>{before}</div>}\n      <div className={styles['RichCell__in']}>\n        <div className={styles['RichCell__content']}>\n          <div className={styles['RichCell__content-before']}>\n            {subhead && (\n              <Subhead Component=\"div\" className={styles['RichCell__subhead']}>\n                {subhead}\n              </Subhead>\n            )}\n            <div className={styles['RichCell__children']}>{children}</div>\n            {text && <div className={styles['RichCell__text']}>{text}</div>}\n            {caption && (\n              <Subhead Component=\"div\" className={styles['RichCell__caption']}>\n                {caption}\n              </Subhead>\n            )}\n          </div>\n          {(after || afterCaption) && (\n            <div className={styles['RichCell__content-after']}>\n              {after && <div className={styles['RichCell__after-children']}>{after}</div>}\n              {afterCaption && (\n                <div className={styles['RichCell__after-caption']}>{afterCaption}</div>\n              )}\n            </div>\n          )}\n        </div>\n        {bottom && <div className={styles['RichCell__bottom']}>{bottom}</div>}\n        {actions && <div className={styles['RichCell__actions']}>{actions}</div>}\n      </div>\n    </Tappable>\n  );\n};\n\nRichCell.Icon = RichCellIcon;\n"],"names":["RichCell","sizeYClassNames","none","subhead","children","text","caption","before","after","afterCaption","bottom","actions","multiline","className","restProps","sizeY","useAdaptivity","Tappable","classNames","div","Subhead","Component","Icon","RichCellIcon"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAkEaA;;;eAAAA;;;;;;;;iEAlEU;sBACI;+BACG;0BACU;yBAChB;8BACK;AAG7B,MAAMC,kBAAkB;IACtBC,IAAI;IACJ,CAAC,UAAU;AACb;AAuDO,MAAMF,WAAW;QAAC,EACvBG,OAAO,EACPC,QAAQ,EACRC,IAAI,EACJC,OAAO,EACPC,MAAM,EACNC,KAAK,EACLC,YAAY,EACZC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,SAAS,EAEK,WADXC;QAXHX;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,EAAEE,QAAQ,MAAM,EAAE,GAAGC,IAAAA,4BAAa;IAExC,qBACE,sBAACC,kBAAQ,8CACHH;QACJD,WAAWK,IAAAA,gBAAU,kBAEnB,CAACN,4CACDG,UAAU,aAAad,eAAe,CAACc,MAAM,EAC7CF;;YAGDN,wBAAU,qBAACY;gBAAIN,SAAS;0BAA+BN;;0BACxD,sBAACY;gBAAIN,SAAS;;kCACZ,sBAACM;wBAAIN,SAAS;;0CACZ,sBAACM;gCAAIN,SAAS;;oCACXV,yBACC,qBAACiB,gBAAO;wCAACC,WAAU;wCAAMR,SAAS;kDAC/BV;;kDAGL,qBAACgB;wCAAIN,SAAS;kDAAiCT;;oCAC9CC,sBAAQ,qBAACc;wCAAIN,SAAS;kDAA6BR;;oCACnDC,yBACC,qBAACc,gBAAO;wCAACC,WAAU;wCAAMR,SAAS;kDAC/BP;;;;4BAILE,CAAAA,SAASC,YAAW,mBACpB,sBAACU;gCAAIN,SAAS;;oCACXL,uBAAS,qBAACW;wCAAIN,SAAS;kDAAuCL;;oCAC9DC,8BACC,qBAACU;wCAAIN,SAAS;kDAAsCJ;;;;;;oBAK3DC,wBAAU,qBAACS;wBAAIN,SAAS;kCAA+BH;;oBACvDC,yBAAW,qBAACQ;wBAAIN,SAAS;kCAAgCF;;;;;;AAIlE;AAEAX,SAASsB,IAAI,GAAGC,0BAAY"}

package/dist/cjs/components/RichCell/RichCellIcon/RichCellIcon.d.ts

@@ -1,5 +1,4 @@
-import * as React from 'react';
 import { HTMLAttributesWithRootRef } from '../../../types';
 export type RichCellIconProps = HTMLAttributesWithRootRef<HTMLDivElement>;
-export declare const RichCellIcon: (props: RichCellIconProps) => React.JSX.Element;
+export declare const RichCellIcon: (props: RichCellIconProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=RichCellIcon.d.ts.map

package/dist/cjs/components/RichCell/RichCellIcon/RichCellIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RichCellIcon.d.ts","sourceRoot":"","sources":["../../../../../src/components/RichCell/RichCellIcon/RichCellIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAI3D,MAAM,MAAM,iBAAiB,GAAG,yBAAyB,CAAC,cAAc,CAAC,CAAC;AAE1E,eAAO,MAAM,YAAY,UAAW,iBAAiB,sBAEpD,CAAC"}
+{"version":3,"file":"RichCellIcon.d.ts","sourceRoot":"","sources":["../../../../../src/components/RichCell/RichCellIcon/RichCellIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAI3D,MAAM,MAAM,iBAAiB,GAAG,yBAAyB,CAAC,cAAc,CAAC,CAAC;AAE1E,eAAO,MAAM,YAAY,UAAW,iBAAiB,4CAEpD,CAAC"}

package/dist/cjs/components/RichCell/RichCellIcon/RichCellIcon.js

@@ -8,12 +8,11 @@ Object.defineProperty(exports, "RichCellIcon", {
         return RichCellIcon;
     }
 });
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _object_spread = require("@swc/helpers/_/_object_spread");
-const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _jsxruntime = require("react/jsx-runtime");
 const _RootComponent = require("../../RootComponent/RootComponent");
 const RichCellIcon = (props)=>{
-    return /*#__PURE__*/ _react.createElement(_RootComponent.RootComponent, _object_spread._({
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_RootComponent.RootComponent, _object_spread._({
         baseClassName: "vkuiRichCellIcon"
     }, props));
 };

package/dist/cjs/components/RichCell/RichCellIcon/RichCellIcon.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/RichCell/RichCellIcon/RichCellIcon.tsx"],"sourcesContent":["import * as React from 'react';\nimport { HTMLAttributesWithRootRef } from '../../../types';\nimport { RootComponent } from '../../RootComponent/RootComponent';\nimport styles from './RichCellIcon.module.css';\n\nexport type RichCellIconProps = HTMLAttributesWithRootRef<HTMLDivElement>;\n\nexport const RichCellIcon = (props: RichCellIconProps) => {\n  return <RootComponent baseClassName={styles['RichCellIcon']} {...props} />;\n};\n"],"names":["RichCellIcon","props","RootComponent","baseClassName"],"mappings":";;;;+BAOaA;;;eAAAA;;;;;iEAPU;+BAEO;AAKvB,MAAMA,eAAe,CAACC;IAC3B,qBAAO,qBAACC,4BAAa;QAACC,aAAa;OAA8BF;AACnE"}
+{"version":3,"sources":["../../../../../src/components/RichCell/RichCellIcon/RichCellIcon.tsx"],"sourcesContent":["import { HTMLAttributesWithRootRef } from '../../../types';\nimport { RootComponent } from '../../RootComponent/RootComponent';\nimport styles from './RichCellIcon.module.css';\n\nexport type RichCellIconProps = HTMLAttributesWithRootRef<HTMLDivElement>;\n\nexport const RichCellIcon = (props: RichCellIconProps) => {\n  return <RootComponent baseClassName={styles['RichCellIcon']} {...props} />;\n};\n"],"names":["RichCellIcon","props","RootComponent","baseClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":";;;;+BAMaA;;;eAAAA;;;;;+BALiB;AAKvB,MAAMA,eAAe,CAACC;IAC3B,qBAAO,qBAACC,4BAAa;QAACC,aAAa;OAA8BF;AACnE"}

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

@@ -3,11 +3,11 @@ import { NavIdProps } from '../../lib/getNavId';
 import { HTMLAttributesWithRootRef } from '../../types';
 export interface RootProps extends HTMLAttributesWithRootRef<HTMLDivElement>, NavIdProps {
     activeView: string;
-    onTransition?(params: {
+    onTransition?: (params: {
         isBack: boolean;
         from: string;
         to: string;
-    }): void;
+    }) => void;
     children: React.ReactElement | Iterable<React.ReactElement>;
 }
 export interface RootState {
@@ -19,5 +19,5 @@ export interface RootState {
 /**
  * @see https://vkcom.github.io/VKUI/#/Root
  */
-export declare const Root: ({ children, activeView: _activeView, onTransition, nav, ...restProps }: RootProps) => React.JSX.Element;
+export declare const Root: ({ children, activeView: _activeView, onTransition, nav, ...restProps }: RootProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Root.d.ts.map

package/dist/cjs/components/Root/Root.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Root.d.ts","sourceRoot":"","sources":["../../../../src/components/Root/Root.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAY,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAG1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AASxD,MAAM,WAAW,SAAU,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU;IACtF,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,CAAC,MAAM,EAAE;QAAE,MAAM,EAAE,OAAO,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAC3E,QAAQ,EAAE,KAAK,CAAC,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;CAC7D;AAED,MAAM,WAAW,SAAS;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAID;;GAEG;AACH,eAAO,MAAM,IAAI,2EAMd,SAAS,sBA2HX,CAAC"}
+{"version":3,"file":"Root.d.ts","sourceRoot":"","sources":["../../../../src/components/Root/Root.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAY,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAG1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AASxD,MAAM,WAAW,SAAU,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU;IACtF,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,MAAM,EAAE,OAAO,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC/E,QAAQ,EAAE,KAAK,CAAC,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;CAC7D;AAED,MAAM,WAAW,SAAS;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAID;;GAEG;AACH,eAAO,MAAM,IAAI,2EAMd,SAAS,4CA2HX,CAAC"}

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

@@ -12,6 +12,7 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
 const _object_spread = require("@swc/helpers/_/_object_spread");
 const _object_spread_props = require("@swc/helpers/_/_object_spread_props");
 const _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+const _jsxruntime = require("react/jsx-runtime");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _vkjs = require("@vkontakte/vkjs");
 const _usePlatform = require("../../hooks/usePlatform");
@@ -114,31 +115,35 @@ const Root = (_param)=>{
             finishTransition();
         }
     };
-    return /*#__PURE__*/ _react.createElement(_RootComponent.RootComponent, _object_spread_props._(_object_spread._({}, restProps), {
-        baseClassName: (0, _vkjs.classNames)("vkuiRoot", platform === 'ios' && "vkuiRoot--ios", transition && "vkuiRoot--transition")
-    }), views.map((view)=>{
-        const viewId = (0, _getNavId.getNavId)(view.props, warn);
-        if (viewId !== activeView && !(transition && viewId === prevView)) {
-            return null;
-        }
-        const isTransitionTarget = transition && viewId === (isBack ? prevView : activeView);
-        const compensateScroll = transition && (viewId === prevView || isBack && viewId === activeView);
-        var _scrolls_viewId;
-        return /*#__PURE__*/ _react.createElement("div", {
-            key: viewId,
-            ref: (e)=>viewId && (viewNodes[viewId] = e),
-            onAnimationEnd: isTransitionTarget ? onAnimationEnd : undefined,
-            className: (0, _vkjs.classNames)("vkuiRoot__view", transition && viewId === prevView && isBack && "vkuiRoot__view--hide-back", transition && viewId === prevView && !isBack && "vkuiRoot__view--hide-forward", transition && viewId === activeView && isBack && "vkuiRoot__view--show-back", transition && viewId === activeView && !isBack && "vkuiRoot__view--show-forward")
-        }, /*#__PURE__*/ _react.createElement(_NavTransitionDirectionContext.NavTransitionDirectionProvider, {
-            isBack: isBack
-        }, /*#__PURE__*/ _react.createElement(_NavTransitionContext.NavTransitionProvider, {
-            entering: transition && viewId === activeView
-        }, /*#__PURE__*/ _react.createElement("div", {
-            className: "vkuiRoot__scrollCompensation",
-            style: {
-                marginTop: compensateScroll ? viewId && -((_scrolls_viewId = scrolls[viewId]) !== null && _scrolls_viewId !== void 0 ? _scrolls_viewId : 0) : undefined
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_RootComponent.RootComponent, _object_spread_props._(_object_spread._({}, restProps), {
+        baseClassName: (0, _vkjs.classNames)("vkuiRoot", platform === 'ios' && "vkuiRoot--ios", transition && "vkuiRoot--transition"),
+        children: views.map((view)=>{
+            const viewId = (0, _getNavId.getNavId)(view.props, warn);
+            if (viewId !== activeView && !(transition && viewId === prevView)) {
+                return null;
             }
-        }, view))));
+            const isTransitionTarget = transition && viewId === (isBack ? prevView : activeView);
+            const compensateScroll = transition && (viewId === prevView || isBack && viewId === activeView);
+            var _scrolls_viewId;
+            return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                ref: (e)=>viewId && (viewNodes[viewId] = e),
+                onAnimationEnd: isTransitionTarget ? onAnimationEnd : undefined,
+                className: (0, _vkjs.classNames)("vkuiRoot__view", transition && viewId === prevView && isBack && "vkuiRoot__view--hide-back", transition && viewId === prevView && !isBack && "vkuiRoot__view--hide-forward", transition && viewId === activeView && isBack && "vkuiRoot__view--show-back", transition && viewId === activeView && !isBack && "vkuiRoot__view--show-forward"),
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_NavTransitionDirectionContext.NavTransitionDirectionProvider, {
+                    isBack: isBack,
+                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_NavTransitionContext.NavTransitionProvider, {
+                        entering: transition && viewId === activeView,
+                        children: /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                            className: "vkuiRoot__scrollCompensation",
+                            style: {
+                                marginTop: compensateScroll ? viewId && -((_scrolls_viewId = scrolls[viewId]) !== null && _scrolls_viewId !== void 0 ? _scrolls_viewId : 0) : undefined
+                            },
+                            children: view
+                        })
+                    })
+                })
+            }, viewId);
+        })
     }));
 };
 

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { NavTransitionProvider } from '../NavTransitionContext/NavTransitionContext';\nimport { NavTransitionDirectionProvider } from '../NavTransitionDirectionContext/NavTransitionDirectionContext';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { SplitColContext } from '../SplitCol/SplitColContext';\nimport styles from './Root.module.css';\n\nexport interface RootProps extends HTMLAttributesWithRootRef<HTMLDivElement>, NavIdProps {\n  activeView: string;\n  onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n  children: React.ReactElement | Iterable<React.ReactElement>;\n}\n\nexport interface RootState {\n  activeView: string;\n  transition: boolean;\n  isBack?: boolean;\n  prevView?: string;\n}\n\nconst warn = warnOnce('Root');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Root\n */\nexport const Root = ({\n  children,\n  activeView: _activeView,\n  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 | null>>({}).current;\n\n  const { transitionMotionEnabled = true } = useConfigProvider();\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({\n        activeView: panel,\n        prevView: activeView,\n        transition: !disableAnimation,\n        isBack,\n      });\n    }\n  };\n  const finishTransition = React.useCallback(\n    () => _setState({ activeView, prevView, isBack, transition: false }),\n    [activeView, isBack, prevView],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    (document!.activeElement as HTMLElement).blur();\n  }, [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 &&\n        onTransition({\n          isBack: Boolean(isBack),\n          from: prevView,\n          to: activeView,\n        });\n    }\n  }, [transition, prevView]);\n\n  const fallbackTransition = useTimeout(finishTransition, platform === 'ios' ? 600 : 300);\n  React.useEffect(() => {\n    if (!transition) {\n      fallbackTransition.clear();\n      return;\n    }\n    fallbackTransition.set();\n  }, [fallbackTransition, transition]);\n\n  const onAnimationEnd = (e: React.AnimationEvent) => {\n    if (\n      [\n        styles['root-android-animation-hide-back'],\n        styles['root-android-animation-show-forward'],\n        styles['root-ios-animation-hide-back'],\n        styles['root-ios-animation-show-forward'],\n      ].includes(e.animationName)\n    ) {\n      finishTransition();\n    }\n  };\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['Root'],\n        platform === 'ios' && styles['Root--ios'],\n        transition && styles['Root--transition'],\n      )}\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 =\n          transition && (viewId === prevView || (isBack && viewId === activeView));\n        return (\n          <div\n            key={viewId}\n            ref={(e) => viewId && (viewNodes[viewId] = e)}\n            onAnimationEnd={isTransitionTarget ? onAnimationEnd : undefined}\n            className={classNames(\n              styles['Root__view'],\n              transition && viewId === prevView && isBack && styles['Root__view--hide-back'],\n              transition && viewId === prevView && !isBack && styles['Root__view--hide-forward'],\n              transition && viewId === activeView && isBack && styles['Root__view--show-back'],\n              transition && viewId === activeView && !isBack && styles['Root__view--show-forward'],\n            )}\n          >\n            <NavTransitionDirectionProvider isBack={isBack}>\n              <NavTransitionProvider entering={transition && viewId === activeView}>\n                <div\n                  className={styles['Root__scrollCompensation']}\n                  style={{\n                    marginTop: compensateScroll ? viewId && -(scrolls[viewId] ?? 0) : undefined,\n                  }}\n                >\n                  {view}\n                </div>\n              </NavTransitionProvider>\n            </NavTransitionDirectionProvider>\n          </div>\n        );\n      })}\n    </RootComponent>\n  );\n};\n"],"names":["Root","warn","warnOnce","children","activeView","_activeView","onTransition","nav","restProps","scroll","React","useContext","ScrollContext","platform","usePlatform","document","useDOM","scrolls","useRef","current","viewNodes","transitionMotionEnabled","useConfigProvider","animate","SplitColContext","disableAnimation","views","Children","toArray","prevView","transition","isBack","_setState","useState","transitionTo","panel","viewIds","map","view","getNavId","props","indexOf","getScroll","y","finishTransition","useCallback","useIsomorphicLayoutEffect","activeElement","blur","scrollTo","Boolean","from","to","fallbackTransition","useTimeout","useEffect","clear","set","onAnimationEnd","e","includes","animationName","RootComponent","baseClassName","classNames","viewId","isTransitionTarget","compensateScroll","div","key","ref","undefined","className","NavTransitionDirectionProvider","NavTransitionProvider","entering","style","marginTop"],"mappings":";;;;+BAmCaA;;;eAAAA;;;;;;;iEAnCU;sBACI;6BACC;4BACD;qBACJ;0BACc;2CACK;0BACjB;+BAEK;uCACI;sCACI;+CACS;+BACjB;iCACE;AAgBhC,MAAMC,OAAOC,IAAAA,kBAAQ,EAAC;AAKf,MAAMF,OAAO;QAAC,EACnBG,QAAQ,EACRC,YAAYC,WAAW,EACvBC,YAAY,EACZC,GAAG,EAEO,WADPC;QAJHL;QACAC;QACAE;QACAC;;IAGA,MAAME,SAASC,OAAMC,UAAU,CAACC,4BAAa;IAC7C,MAAMC,WAAWC,IAAAA,wBAAW;IAC5B,MAAM,EAAEC,QAAQ,EAAE,GAAGC,IAAAA,WAAM;IAC3B,MAAMC,UAAUP,OAAMQ,MAAM,CAAyB,CAAC,GAAGC,OAAO;IAChE,MAAMC,YAAYV,OAAMQ,MAAM,CAAqC,CAAC,GAAGC,OAAO;IAE9E,MAAM,EAAEE,0BAA0B,IAAI,EAAE,GAAGC,IAAAA,wCAAiB;IAC5D,MAAM,EAAEC,OAAO,EAAE,GAAGb,OAAMC,UAAU,CAACa,gCAAe;IACpD,MAAMC,mBAAmB,CAACJ,2BAA2B,CAACE;IAEtD,MAAMG,QAAQhB,OAAMiB,QAAQ,CAACC,OAAO,CAACzB;IAErC,MAAM,CAAC,EAAE0B,QAAQ,EAAEzB,UAAU,EAAE0B,UAAU,EAAEC,MAAM,EAAE,EAAEC,UAAU,GAAGtB,OAAMuB,QAAQ,CAAY;QAC1F7B,YAAYC;QACZyB,YAAY;IACd;IACA,MAAMI,eAAe,CAACC;QACpB,IAAIA,UAAU/B,YAAY;YACxB,MAAMgC,UAAUV,MAAMW,GAAG,CAAC,CAACC,OAASC,IAAAA,kBAAQ,EAACD,KAAKE,KAAK,EAAEvC;YACzD,MAAM8B,SAASK,QAAQK,OAAO,CAACN,SAASC,QAAQK,OAAO,CAACrC;YACxDa,OAAO,CAACb,WAAW,GAAGK,OAAOiC,SAAS,GAAGC,CAAC;YAC1CX,UAAU;gBACR5B,YAAY+B;gBACZN,UAAUzB;gBACV0B,YAAY,CAACL;gBACbM;YACF;QACF;IACF;IACA,MAAMa,mBAAmBlC,OAAMmC,WAAW,CACxC,IAAMb,UAAU;YAAE5B;YAAYyB;YAAUE;YAAQD,YAAY;QAAM,IAClE;QAAC1B;QAAY2B;QAAQF;KAAS;IAGhCiB,IAAAA,oDAAyB,EAAC;QACvB/B,SAAUgC,aAAa,CAAiBC,IAAI;IAC/C,GAAG;QAAC5C;KAAW;IAEf,gBAAgB;IAChB0C,IAAAA,oDAAyB,EAAC,IAAMZ,aAAa7B,cAAc;QAACA;KAAY;IACxEyC,IAAAA,oDAAyB,EAAC;QACxB,IAAI,CAAChB,cAAcD,UAAU;YAC3B,qBAAqB;YACrBpB,OAAOwC,QAAQ,CAAC,GAAGlB,SAASd,OAAO,CAACb,WAAW,GAAG;YAClDE,gBACEA,aAAa;gBACXyB,QAAQmB,QAAQnB;gBAChBoB,MAAMtB;gBACNuB,IAAIhD;YACN;QACJ;IACF,GAAG;QAAC0B;QAAYD;KAAS;IAEzB,MAAMwB,qBAAqBC,IAAAA,sBAAU,EAACV,kBAAkB/B,aAAa,QAAQ,MAAM;IACnFH,OAAM6C,SAAS,CAAC;QACd,IAAI,CAACzB,YAAY;YACfuB,mBAAmBG,KAAK;YACxB;QACF;QACAH,mBAAmBI,GAAG;IACxB,GAAG;QAACJ;QAAoBvB;KAAW;IAEnC,MAAM4B,iBAAiB,CAACC;QACtB,IACE;;;;;SAKC,CAACC,QAAQ,CAACD,EAAEE,aAAa,GAC1B;YACAjB;QACF;IACF;IAEA,qBACE,qBAACkB,4BAAa,8CACRtD;QACJuD,eAAeC,IAAAA,gBAAU,cAEvBnD,aAAa,0BACbiB;QAGDJ,MAAMW,GAAG,CAAC,CAACC;QACV,MAAM2B,SAAS1B,IAAAA,kBAAQ,EAACD,KAAKE,KAAK,EAAEvC;QACpC,IAAIgE,WAAW7D,cAAc,CAAE0B,CAAAA,cAAcmC,WAAWpC,QAAO,GAAI;YACjE,OAAO;QACT;QACA,MAAMqC,qBAAqBpC,cAAcmC,WAAYlC,CAAAA,SAASF,WAAWzB,UAAS;QAClF,MAAM+D,mBACJrC,cAAemC,CAAAA,WAAWpC,YAAaE,UAAUkC,WAAW7D,UAAU;YAmBlBa;QAlBtD,qBACE,qBAACmD;YACCC,KAAKJ;YACLK,KAAK,CAACX,IAAMM,UAAW7C,CAAAA,SAAS,CAAC6C,OAAO,GAAGN,CAAAA;YAC3CD,gBAAgBQ,qBAAqBR,iBAAiBa;YACtDC,WAAWR,IAAAA,gBAAU,oBAEnBlC,cAAcmC,WAAWpC,YAAYE,uCACrCD,cAAcmC,WAAWpC,YAAY,CAACE,0CACtCD,cAAcmC,WAAW7D,cAAc2B,uCACvCD,cAAcmC,WAAW7D,cAAc,CAAC2B;yBAG1C,qBAAC0C,6DAA8B;YAAC1C,QAAQA;yBACtC,qBAAC2C,2CAAqB;YAACC,UAAU7C,cAAcmC,WAAW7D;yBACxD,qBAACgE;YACCI,SAAS;YACTI,OAAO;gBACLC,WAAWV,mBAAmBF,UAAU,CAAEhD,CAAAA,CAAAA,kBAAAA,OAAO,CAACgD,OAAO,cAAfhD,6BAAAA,kBAAmB,CAAA,IAAKsD;YACpE;WAECjC;IAMb;AAGN"}
+{"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { NavTransitionProvider } from '../NavTransitionContext/NavTransitionContext';\nimport { NavTransitionDirectionProvider } from '../NavTransitionDirectionContext/NavTransitionDirectionContext';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { SplitColContext } from '../SplitCol/SplitColContext';\nimport styles from './Root.module.css';\n\nexport interface RootProps extends HTMLAttributesWithRootRef<HTMLDivElement>, NavIdProps {\n  activeView: string;\n  onTransition?: (params: { isBack: boolean; from: string; to: string }) => void;\n  children: React.ReactElement | Iterable<React.ReactElement>;\n}\n\nexport interface RootState {\n  activeView: string;\n  transition: boolean;\n  isBack?: boolean;\n  prevView?: string;\n}\n\nconst warn = warnOnce('Root');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Root\n */\nexport const Root = ({\n  children,\n  activeView: _activeView,\n  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 | null>>({}).current;\n\n  const { transitionMotionEnabled = true } = useConfigProvider();\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({\n        activeView: panel,\n        prevView: activeView,\n        transition: !disableAnimation,\n        isBack,\n      });\n    }\n  };\n  const finishTransition = React.useCallback(\n    () => _setState({ activeView, prevView, isBack, transition: false }),\n    [activeView, isBack, prevView],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    (document!.activeElement as HTMLElement).blur();\n  }, [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 &&\n        onTransition({\n          isBack: Boolean(isBack),\n          from: prevView,\n          to: activeView,\n        });\n    }\n  }, [transition, prevView]);\n\n  const fallbackTransition = useTimeout(finishTransition, platform === 'ios' ? 600 : 300);\n  React.useEffect(() => {\n    if (!transition) {\n      fallbackTransition.clear();\n      return;\n    }\n    fallbackTransition.set();\n  }, [fallbackTransition, transition]);\n\n  const onAnimationEnd = (e: React.AnimationEvent) => {\n    if (\n      [\n        styles['root-android-animation-hide-back'],\n        styles['root-android-animation-show-forward'],\n        styles['root-ios-animation-hide-back'],\n        styles['root-ios-animation-show-forward'],\n      ].includes(e.animationName)\n    ) {\n      finishTransition();\n    }\n  };\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['Root'],\n        platform === 'ios' && styles['Root--ios'],\n        transition && styles['Root--transition'],\n      )}\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 =\n          transition && (viewId === prevView || (isBack && viewId === activeView));\n        return (\n          <div\n            key={viewId}\n            ref={(e) => viewId && (viewNodes[viewId] = e)}\n            onAnimationEnd={isTransitionTarget ? onAnimationEnd : undefined}\n            className={classNames(\n              styles['Root__view'],\n              transition && viewId === prevView && isBack && styles['Root__view--hide-back'],\n              transition && viewId === prevView && !isBack && styles['Root__view--hide-forward'],\n              transition && viewId === activeView && isBack && styles['Root__view--show-back'],\n              transition && viewId === activeView && !isBack && styles['Root__view--show-forward'],\n            )}\n          >\n            <NavTransitionDirectionProvider isBack={isBack}>\n              <NavTransitionProvider entering={transition && viewId === activeView}>\n                <div\n                  className={styles['Root__scrollCompensation']}\n                  style={{\n                    marginTop: compensateScroll ? viewId && -(scrolls[viewId] ?? 0) : undefined,\n                  }}\n                >\n                  {view}\n                </div>\n              </NavTransitionProvider>\n            </NavTransitionDirectionProvider>\n          </div>\n        );\n      })}\n    </RootComponent>\n  );\n};\n"],"names":["Root","warn","warnOnce","children","activeView","_activeView","onTransition","nav","restProps","scroll","React","useContext","ScrollContext","platform","usePlatform","document","useDOM","scrolls","useRef","current","viewNodes","transitionMotionEnabled","useConfigProvider","animate","SplitColContext","disableAnimation","views","Children","toArray","prevView","transition","isBack","_setState","useState","transitionTo","panel","viewIds","map","view","getNavId","props","indexOf","getScroll","y","finishTransition","useCallback","useIsomorphicLayoutEffect","activeElement","blur","scrollTo","Boolean","from","to","fallbackTransition","useTimeout","useEffect","clear","set","onAnimationEnd","e","includes","animationName","RootComponent","baseClassName","classNames","viewId","isTransitionTarget","compensateScroll","div","ref","undefined","className","NavTransitionDirectionProvider","NavTransitionProvider","entering","style","marginTop"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

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

@@ -6,5 +6,5 @@ export interface RootComponentProps<T> extends React.AllHTMLAttributes<T>, HasRo
 /**
  * Базовый корневой компонент.
  */
-export declare const RootComponent: <T>({ Component, baseClassName, className, getRootRef, ...restProps }: RootComponentProps<T>) => React.JSX.Element;
+export declare const RootComponent: <T>({ Component, baseClassName, className, getRootRef, ...restProps }: RootComponentProps<T>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=RootComponent.d.ts.map

package/dist/cjs/components/RootComponent/RootComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RootComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/RootComponent/RootComponent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEvD,MAAM,WAAW,kBAAkB,CAAC,CAAC,CACnC,SAAQ,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAChC,UAAU,CAAC,CAAC,CAAC,EACb,YAAY;IACd,aAAa,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;CAChC;AAED;;GAEG;AACH,eAAO,MAAM,aAAa,oHAQzB,CAAC"}
+{"version":3,"file":"RootComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/RootComponent/RootComponent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEvD,MAAM,WAAW,kBAAkB,CAAC,CAAC,CACnC,SAAQ,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAChC,UAAU,CAAC,CAAC,CAAC,EACb,YAAY;IACd,aAAa,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;CAChC;AAED;;GAEG;AACH,eAAO,MAAM,aAAa,yEAMvB,mBAAmB,CAAC,CAAC,4CAEvB,CAAC"}

package/dist/cjs/components/RootComponent/RootComponent.js

@@ -11,6 +11,7 @@ Object.defineProperty(exports, "RootComponent", {
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _object_spread = require("@swc/helpers/_/_object_spread");
 const _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+const _jsxruntime = require("react/jsx-runtime");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _vkjs = require("@vkontakte/vkjs");
 const RootComponent = (_param)=>{
@@ -20,7 +21,7 @@ const RootComponent = (_param)=>{
         "className",
         "getRootRef"
     ]);
-    return /*#__PURE__*/ _react.createElement(Component, _object_spread._({
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(Component, _object_spread._({
         ref: getRootRef,
         className: (0, _vkjs.classNames)(baseClassName, className)
     }, restProps));

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/RootComponent/RootComponent.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasComponent, HasRootRef } from '../../types';\n\nexport interface RootComponentProps<T>\n  extends React.AllHTMLAttributes<T>,\n    HasRootRef<T>,\n    HasComponent {\n  baseClassName?: string | false;\n}\n\n/**\n * Базовый корневой компонент.\n */\nexport const RootComponent = <T,>({\n  Component = 'div',\n  baseClassName,\n  className,\n  getRootRef,\n  ...restProps\n}: RootComponentProps<T>) => (\n  <Component ref={getRootRef} className={classNames(baseClassName, className)} {...restProps} />\n);\n"],"names":["RootComponent","Component","baseClassName","className","getRootRef","restProps","ref","classNames"],"mappings":";;;;+BAcaA;;;eAAAA;;;;;;iEAdU;sBACI;AAapB,MAAMA,gBAAgB;QAAK,EAChCC,YAAY,KAAK,EACjBC,aAAa,EACbC,SAAS,EACTC,UAAU,EAEY,WADnBC;QAJHJ;QACAC;QACAC;QACAC;;yBAGA,qBAACH;QAAUK,KAAKF;QAAYD,WAAWI,IAAAA,gBAAU,EAACL,eAAeC;OAAgBE"}
+{"version":3,"sources":["../../../../src/components/RootComponent/RootComponent.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasComponent, HasRootRef } from '../../types';\n\nexport interface RootComponentProps<T>\n  extends React.AllHTMLAttributes<T>,\n    HasRootRef<T>,\n    HasComponent {\n  baseClassName?: string | false;\n}\n\n/**\n * Базовый корневой компонент.\n */\nexport const RootComponent = <T,>({\n  Component = 'div',\n  baseClassName,\n  className,\n  getRootRef,\n  ...restProps\n}: RootComponentProps<T>) => (\n  <Component ref={getRootRef} className={classNames(baseClassName, className)} {...restProps} />\n);\n"],"names":["RootComponent","Component","baseClassName","className","getRootRef","restProps","ref","classNames"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAcaA;;;eAAAA;;;;;;;iEAdU;sBACI;AAapB,MAAMA,gBAAgB;QAAK,EAChCC,YAAY,KAAK,EACjBC,aAAa,EACbC,SAAS,EACTC,UAAU,EAEY,WADnBC;QAJHJ;QACAC;QACAC;QACAC;;yBAGA,qBAACH;QAAUK,KAAKF;QAAYD,WAAWI,IAAAA,gBAAU,EAACL,eAAeC;OAAgBE"}

package/dist/cjs/components/ScreenSpinner/Icon48CancelCircle.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
-export declare const Icon48CancelCircle: (props: React.SVGProps<SVGSVGElement>) => React.JSX.Element;
+export declare const Icon48CancelCircle: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Icon48CancelCircle.d.ts.map

package/dist/cjs/components/ScreenSpinner/Icon48CancelCircle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Icon48CancelCircle.d.ts","sourceRoot":"","sources":["../../../../src/components/ScreenSpinner/Icon48CancelCircle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,eAAO,MAAM,kBAAkB,UAAW,MAAM,QAAQ,CAAC,aAAa,CAAC,sBAiBtE,CAAC"}
+{"version":3,"file":"Icon48CancelCircle.d.ts","sourceRoot":"","sources":["../../../../src/components/ScreenSpinner/Icon48CancelCircle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,eAAO,MAAM,kBAAkB,UAAW,MAAM,QAAQ,CAAC,aAAa,CAAC,4CAiBtE,CAAC"}

package/dist/cjs/components/ScreenSpinner/Icon48CancelCircle.js

@@ -10,19 +10,23 @@ Object.defineProperty(exports, "Icon48CancelCircle", {
 });
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _object_spread = require("@swc/helpers/_/_object_spread");
+const _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+const _jsxruntime = require("react/jsx-runtime");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
-const Icon48CancelCircle = (props)=>/*#__PURE__*/ _react.createElement("svg", _object_spread._({
+const Icon48CancelCircle = (props)=>/*#__PURE__*/ (0, _jsxruntime.jsx)("svg", _object_spread_props._(_object_spread._({
         className: "vkuiIcon",
         width: "48",
         height: "48",
         viewBox: "0 0 48 48",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-    }, props), /*#__PURE__*/ _react.createElement("path", {
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M40 24c0 8.837-7.163 16-16 16S8 32.837 8 24 15.163 8 24 8s16 7.163 16 16Zm-10.08-4.33a1.125 1.125 0 0 0-1.59-1.59L24 22.409l-4.33-4.33a1.125 1.125 0 0 0-1.59 0l-.101.116a1.125 1.125 0 0 0 .1 1.476L22.41 24l-4.33 4.33a1.125 1.125 0 0 0 1.591 1.59L24 25.591l4.33 4.33c.439.439 1.151.439 1.59 0l.101-.116a1.125 1.125 0 0 0-.1-1.476L25.59 24l4.33-4.33Z",
-        fill: "currentColor"
+    }, props), {
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M40 24c0 8.837-7.163 16-16 16S8 32.837 8 24 15.163 8 24 8s16 7.163 16 16Zm-10.08-4.33a1.125 1.125 0 0 0-1.59-1.59L24 22.409l-4.33-4.33a1.125 1.125 0 0 0-1.59 0l-.101.116a1.125 1.125 0 0 0 .1 1.476L22.41 24l-4.33 4.33a1.125 1.125 0 0 0 1.591 1.59L24 25.591l4.33 4.33c.439.439 1.151.439 1.59 0l.101-.116a1.125 1.125 0 0 0-.1-1.476L25.59 24l4.33-4.33Z",
+            fill: "currentColor"
+        })
     }));
 
 //# sourceMappingURL=Icon48CancelCircle.js.map

package/dist/cjs/components/ScreenSpinner/Icon48CancelCircle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ScreenSpinner/Icon48CancelCircle.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const Icon48CancelCircle = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    className=\"vkuiIcon\"\n    width=\"48\"\n    height=\"48\"\n    viewBox=\"0 0 48 48\"\n    fill=\"none\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <path\n      fillRule=\"evenodd\"\n      clipRule=\"evenodd\"\n      d=\"M40 24c0 8.837-7.163 16-16 16S8 32.837 8 24 15.163 8 24 8s16 7.163 16 16Zm-10.08-4.33a1.125 1.125 0 0 0-1.59-1.59L24 22.409l-4.33-4.33a1.125 1.125 0 0 0-1.59 0l-.101.116a1.125 1.125 0 0 0 .1 1.476L22.41 24l-4.33 4.33a1.125 1.125 0 0 0 1.591 1.59L24 25.591l4.33 4.33c.439.439 1.151.439 1.59 0l.101-.116a1.125 1.125 0 0 0-.1-1.476L25.59 24l4.33-4.33Z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n);\n"],"names":["Icon48CancelCircle","props","svg","className","width","height","viewBox","fill","xmlns","path","fillRule","clipRule","d"],"mappings":";;;;+BAEaA;;;eAAAA;;;;;iEAFU;AAEhB,MAAMA,qBAAqB,CAACC,sBACjC,qBAACC;QACCC,WAAU;QACVC,OAAM;QACNC,QAAO;QACPC,SAAQ;QACRC,MAAK;QACLC,OAAM;OACFP,sBAEJ,qBAACQ;QACCC,UAAS;QACTC,UAAS;QACTC,GAAE;QACFL,MAAK"}
+{"version":3,"sources":["../../../../src/components/ScreenSpinner/Icon48CancelCircle.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const Icon48CancelCircle = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    className=\"vkuiIcon\"\n    width=\"48\"\n    height=\"48\"\n    viewBox=\"0 0 48 48\"\n    fill=\"none\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <path\n      fillRule=\"evenodd\"\n      clipRule=\"evenodd\"\n      d=\"M40 24c0 8.837-7.163 16-16 16S8 32.837 8 24 15.163 8 24 8s16 7.163 16 16Zm-10.08-4.33a1.125 1.125 0 0 0-1.59-1.59L24 22.409l-4.33-4.33a1.125 1.125 0 0 0-1.59 0l-.101.116a1.125 1.125 0 0 0 .1 1.476L22.41 24l-4.33 4.33a1.125 1.125 0 0 0 1.591 1.59L24 25.591l4.33 4.33c.439.439 1.151.439 1.59 0l.101-.116a1.125 1.125 0 0 0-.1-1.476L25.59 24l4.33-4.33Z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n);\n"],"names":["Icon48CancelCircle","props","svg","className","width","height","viewBox","fill","xmlns","path","fillRule","clipRule","d"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAEaA;;;eAAAA;;;;;;;iEAFU;AAEhB,MAAMA,qBAAqB,CAACC,sBACjC,qBAACC;QACCC,WAAU;QACVC,OAAM;QACNC,QAAO;QACPC,SAAQ;QACRC,MAAK;QACLC,OAAM;OACFP;kBAEJ,cAAA,qBAACQ;YACCC,UAAS;YACTC,UAAS;YACTC,GAAE;YACFL,MAAK"}

package/dist/cjs/components/ScreenSpinner/Icon48DoneOutline.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
-export declare const Icon48DoneOutline: (props: React.SVGProps<SVGSVGElement>) => React.JSX.Element;
+export declare const Icon48DoneOutline: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Icon48DoneOutline.d.ts.map

package/dist/cjs/components/ScreenSpinner/Icon48DoneOutline.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Icon48DoneOutline.d.ts","sourceRoot":"","sources":["../../../../src/components/ScreenSpinner/Icon48DoneOutline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,eAAO,MAAM,iBAAiB,UAAW,MAAM,QAAQ,CAAC,aAAa,CAAC,sBAkBrE,CAAC"}
+{"version":3,"file":"Icon48DoneOutline.d.ts","sourceRoot":"","sources":["../../../../src/components/ScreenSpinner/Icon48DoneOutline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,eAAO,MAAM,iBAAiB,UAAW,MAAM,QAAQ,CAAC,aAAa,CAAC,4CAkBrE,CAAC"}

package/dist/cjs/components/ScreenSpinner/Icon48DoneOutline.js

@@ -10,20 +10,24 @@ Object.defineProperty(exports, "Icon48DoneOutline", {
 });
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _object_spread = require("@swc/helpers/_/_object_spread");
+const _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+const _jsxruntime = require("react/jsx-runtime");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
-const Icon48DoneOutline = (props)=>/*#__PURE__*/ _react.createElement("svg", _object_spread._({
+const Icon48DoneOutline = (props)=>/*#__PURE__*/ (0, _jsxruntime.jsx)("svg", _object_spread_props._(_object_spread._({
         className: "vkuiIcon",
         width: "48",
         height: "48",
         viewBox: "0 0 48 48",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-    }, props), /*#__PURE__*/ _react.createElement("path", {
-        d: "M9 24L19 34L39 14",
-        stroke: "currentColor",
-        strokeWidth: "3.5",
-        strokeLinecap: "round",
-        strokeLinejoin: "round"
+    }, props), {
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)("path", {
+            d: "M9 24L19 34L39 14",
+            stroke: "currentColor",
+            strokeWidth: "3.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+        })
     }));
 
 //# sourceMappingURL=Icon48DoneOutline.js.map

package/dist/cjs/components/ScreenSpinner/Icon48DoneOutline.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ScreenSpinner/Icon48DoneOutline.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const Icon48DoneOutline = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    className=\"vkuiIcon\"\n    width=\"48\"\n    height=\"48\"\n    viewBox=\"0 0 48 48\"\n    fill=\"none\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <path\n      d=\"M9 24L19 34L39 14\"\n      stroke=\"currentColor\"\n      strokeWidth=\"3.5\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    />\n  </svg>\n);\n"],"names":["Icon48DoneOutline","props","svg","className","width","height","viewBox","fill","xmlns","path","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin"],"mappings":";;;;+BAEaA;;;eAAAA;;;;;iEAFU;AAEhB,MAAMA,oBAAoB,CAACC,sBAChC,qBAACC;QACCC,WAAU;QACVC,OAAM;QACNC,QAAO;QACPC,SAAQ;QACRC,MAAK;QACLC,OAAM;OACFP,sBAEJ,qBAACQ;QACCC,GAAE;QACFC,QAAO;QACPC,aAAY;QACZC,eAAc;QACdC,gBAAe"}
+{"version":3,"sources":["../../../../src/components/ScreenSpinner/Icon48DoneOutline.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const Icon48DoneOutline = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    className=\"vkuiIcon\"\n    width=\"48\"\n    height=\"48\"\n    viewBox=\"0 0 48 48\"\n    fill=\"none\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <path\n      d=\"M9 24L19 34L39 14\"\n      stroke=\"currentColor\"\n      strokeWidth=\"3.5\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    />\n  </svg>\n);\n"],"names":["Icon48DoneOutline","props","svg","className","width","height","viewBox","fill","xmlns","path","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAEaA;;;eAAAA;;;;;;;iEAFU;AAEhB,MAAMA,oBAAoB,CAACC,sBAChC,qBAACC;QACCC,WAAU;QACVC,OAAM;QACNC,QAAO;QACPC,SAAQ;QACRC,MAAK;QACLC,OAAM;OACFP;kBAEJ,cAAA,qBAACQ;YACCC,GAAE;YACFC,QAAO;YACPC,aAAY;YACZC,eAAc;YACdC,gBAAe"}

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { SpinnerProps } from '../Spinner/Spinner';
 export interface ScreenSpinnerProps extends SpinnerProps {
     state?: 'loading' | 'cancelable' | 'done' | 'error';
@@ -6,5 +5,5 @@ export interface ScreenSpinnerProps extends SpinnerProps {
 /**
  * @see https://vkcom.github.io/VKUI/#/ScreenSpinner
  */
-export declare const ScreenSpinner: ({ style, className, state, size, onClick, children, ...restProps }: ScreenSpinnerProps) => React.JSX.Element;
+export declare const ScreenSpinner: ({ style, className, state, size, onClick, children, ...restProps }: ScreenSpinnerProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ScreenSpinner.d.ts.map

package/dist/cjs/components/ScreenSpinner/ScreenSpinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenSpinner.d.ts","sourceRoot":"","sources":["../../../../src/components/ScreenSpinner/ScreenSpinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAW,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAK3D,MAAM,WAAW,kBAAmB,SAAQ,YAAY;IACtD,KAAK,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,MAAM,GAAG,OAAO,CAAC;CACrD;AAED;;GAEG;AACH,eAAO,MAAM,aAAa,uEAQvB,kBAAkB,sBA4CpB,CAAC"}
+{"version":3,"file":"ScreenSpinner.d.ts","sourceRoot":"","sources":["../../../../src/components/ScreenSpinner/ScreenSpinner.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAW,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAK3D,MAAM,WAAW,kBAAmB,SAAQ,YAAY;IACtD,KAAK,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,MAAM,GAAG,OAAO,CAAC;CACrD;AAED;;GAEG;AACH,eAAO,MAAM,aAAa,uEAQvB,kBAAkB,4CA4CpB,CAAC"}

package/dist/cjs/components/ScreenSpinner/ScreenSpinner.js

@@ -8,10 +8,10 @@ Object.defineProperty(exports, "ScreenSpinner", {
         return ScreenSpinner;
     }
 });
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _object_spread = require("@swc/helpers/_/_object_spread");
+const _object_spread_props = require("@swc/helpers/_/_object_spread_props");
 const _object_without_properties = require("@swc/helpers/_/_object_without_properties");
-const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _jsxruntime = require("react/jsx-runtime");
 const _icons = require("@vkontakte/icons");
 const _vkjs = require("@vkontakte/vkjs");
 const _ScrollContext = require("../AppRoot/ScrollContext");
@@ -36,19 +36,27 @@ const ScreenSpinner = (_param)=>{
         error: _Icon48CancelCircle.Icon48CancelCircle
     }[state];
     (0, _ScrollContext.useScrollLock)();
-    return /*#__PURE__*/ _react.createElement(_PopoutWrapper.PopoutWrapper, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_PopoutWrapper.PopoutWrapper, {
         noBackground: true,
         className: (0, _vkjs.classNames)("vkuiScreenSpinner", state === 'cancelable' && "vkuiScreenSpinner--clickable", className),
-        style: style
-    }, /*#__PURE__*/ _react.createElement("div", {
-        className: "vkuiScreenSpinner__container",
-        onClick: onClick
-    }, /*#__PURE__*/ _react.createElement(_Spinner.Spinner, _object_spread._({
-        className: (0, _vkjs.classNames)("vkuiScreenSpinner__spinner", hideSpinner && "vkuiScreenSpinner__spinner--hidden"),
-        size: size
-    }, restProps), children), /*#__PURE__*/ _react.createElement("div", {
-        className: (0, _vkjs.classNames)("vkuiScreenSpinner__icon", state === 'done' && "vkuiScreenSpinner__icon--state-done")
-    }, /*#__PURE__*/ _react.createElement(Icon, null))));
+        style: style,
+        children: /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+            className: "vkuiScreenSpinner__container",
+            onClick: onClick,
+            children: [
+                /*#__PURE__*/ (0, _jsxruntime.jsx)(_Spinner.Spinner, _object_spread_props._(_object_spread._({
+                    className: (0, _vkjs.classNames)("vkuiScreenSpinner__spinner", hideSpinner && "vkuiScreenSpinner__spinner--hidden"),
+                    size: size
+                }, restProps), {
+                    children: children
+                })),
+                /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                    className: (0, _vkjs.classNames)("vkuiScreenSpinner__icon", state === 'done' && "vkuiScreenSpinner__icon--state-done"),
+                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(Icon, {})
+                })
+            ]
+        })
+    });
 };
 
 //# sourceMappingURL=ScreenSpinner.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ScreenSpinner/ScreenSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Cancel } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { Spinner, SpinnerProps } from '../Spinner/Spinner';\nimport { Icon48CancelCircle } from './Icon48CancelCircle';\nimport { Icon48DoneOutline } from './Icon48DoneOutline';\nimport styles from './ScreenSpinner.module.css';\n\nexport interface ScreenSpinnerProps extends SpinnerProps {\n  state?: 'loading' | 'cancelable' | 'done' | 'error';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ScreenSpinner\n */\nexport const ScreenSpinner = ({\n  style,\n  className,\n  state = 'loading',\n  size = 'large',\n  onClick,\n  children = 'Пожалуйста, подождите...',\n  ...restProps\n}: ScreenSpinnerProps) => {\n  const hideSpinner = state === 'done' || state === 'error';\n\n  const Icon = {\n    loading: () => null,\n    cancelable: Icon24Cancel,\n    done: Icon48DoneOutline,\n    error: Icon48CancelCircle,\n  }[state];\n\n  useScrollLock();\n\n  return (\n    <PopoutWrapper\n      noBackground\n      className={classNames(\n        styles['ScreenSpinner'],\n        state === 'cancelable' && styles['ScreenSpinner--clickable'],\n        className,\n      )}\n      style={style}\n    >\n      <div className={styles['ScreenSpinner__container']} onClick={onClick}>\n        <Spinner\n          className={classNames(\n            styles['ScreenSpinner__spinner'],\n            hideSpinner && styles['ScreenSpinner__spinner--hidden'],\n          )}\n          size={size}\n          {...restProps}\n        >\n          {children}\n        </Spinner>\n        <div\n          className={classNames(\n            styles['ScreenSpinner__icon'],\n            state === 'done' && styles['ScreenSpinner__icon--state-done'],\n          )}\n        >\n          <Icon />\n        </div>\n      </div>\n    </PopoutWrapper>\n  );\n};\n"],"names":["ScreenSpinner","style","className","state","size","onClick","children","restProps","hideSpinner","Icon","loading","cancelable","Icon24Cancel","done","Icon48DoneOutline","error","Icon48CancelCircle","useScrollLock","PopoutWrapper","noBackground","classNames","div","Spinner"],"mappings":";;;;+BAiBaA;;;eAAAA;;;;;;iEAjBU;uBACM;sBACF;+BACG;+BACA;yBACQ;oCACH;mCACD;AAU3B,MAAMA,gBAAgB;QAAC,EAC5BC,KAAK,EACLC,SAAS,EACTC,QAAQ,SAAS,EACjBC,OAAO,OAAO,EACdC,OAAO,EACPC,WAAW,0BAA0B,EAElB,WADhBC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,cAAcL,UAAU,UAAUA,UAAU;IAElD,MAAMM,OAAO;QACXC,SAAS,IAAM;QACfC,YAAYC,mBAAY;QACxBC,MAAMC,oCAAiB;QACvBC,OAAOC,sCAAkB;IAC3B,CAAC,CAACb,MAAM;IAERc,IAAAA,4BAAa;IAEb,qBACE,qBAACC,4BAAa;QACZC,cAAAA;QACAjB,WAAWkB,IAAAA,gBAAU,uBAEnBjB,UAAU,gDACVD;QAEFD,OAAOA;qBAEP,qBAACoB;QAAInB,SAAS;QAAsCG,SAASA;qBAC3D,qBAACiB,gBAAO;QACNpB,WAAWkB,IAAAA,gBAAU,gCAEnBZ;QAEFJ,MAAMA;OACFG,YAEHD,yBAEH,qBAACe;QACCnB,WAAWkB,IAAAA,gBAAU,6BAEnBjB,UAAU;qBAGZ,qBAACM;AAKX"}
+{"version":3,"sources":["../../../../src/components/ScreenSpinner/ScreenSpinner.tsx"],"sourcesContent":["import { Icon24Cancel } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { Spinner, SpinnerProps } from '../Spinner/Spinner';\nimport { Icon48CancelCircle } from './Icon48CancelCircle';\nimport { Icon48DoneOutline } from './Icon48DoneOutline';\nimport styles from './ScreenSpinner.module.css';\n\nexport interface ScreenSpinnerProps extends SpinnerProps {\n  state?: 'loading' | 'cancelable' | 'done' | 'error';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ScreenSpinner\n */\nexport const ScreenSpinner = ({\n  style,\n  className,\n  state = 'loading',\n  size = 'large',\n  onClick,\n  children = 'Пожалуйста, подождите...',\n  ...restProps\n}: ScreenSpinnerProps) => {\n  const hideSpinner = state === 'done' || state === 'error';\n\n  const Icon = {\n    loading: () => null,\n    cancelable: Icon24Cancel,\n    done: Icon48DoneOutline,\n    error: Icon48CancelCircle,\n  }[state];\n\n  useScrollLock();\n\n  return (\n    <PopoutWrapper\n      noBackground\n      className={classNames(\n        styles['ScreenSpinner'],\n        state === 'cancelable' && styles['ScreenSpinner--clickable'],\n        className,\n      )}\n      style={style}\n    >\n      <div className={styles['ScreenSpinner__container']} onClick={onClick}>\n        <Spinner\n          className={classNames(\n            styles['ScreenSpinner__spinner'],\n            hideSpinner && styles['ScreenSpinner__spinner--hidden'],\n          )}\n          size={size}\n          {...restProps}\n        >\n          {children}\n        </Spinner>\n        <div\n          className={classNames(\n            styles['ScreenSpinner__icon'],\n            state === 'done' && styles['ScreenSpinner__icon--state-done'],\n          )}\n        >\n          <Icon />\n        </div>\n      </div>\n    </PopoutWrapper>\n  );\n};\n"],"names":["ScreenSpinner","style","className","state","size","onClick","children","restProps","hideSpinner","Icon","loading","cancelable","Icon24Cancel","done","Icon48DoneOutline","error","Icon48CancelCircle","useScrollLock","PopoutWrapper","noBackground","classNames","div","Spinner"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAgBaA;;;eAAAA;;;;;;;uBAhBgB;sBACF;+BACG;+BACA;yBACQ;oCACH;mCACD;AAU3B,MAAMA,gBAAgB;QAAC,EAC5BC,KAAK,EACLC,SAAS,EACTC,QAAQ,SAAS,EACjBC,OAAO,OAAO,EACdC,OAAO,EACPC,WAAW,0BAA0B,EAElB,WADhBC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,cAAcL,UAAU,UAAUA,UAAU;IAElD,MAAMM,OAAO;QACXC,SAAS,IAAM;QACfC,YAAYC,mBAAY;QACxBC,MAAMC,oCAAiB;QACvBC,OAAOC,sCAAkB;IAC3B,CAAC,CAACb,MAAM;IAERc,IAAAA,4BAAa;IAEb,qBACE,qBAACC,4BAAa;QACZC,YAAY;QACZjB,WAAWkB,IAAAA,gBAAU,uBAEnBjB,UAAU,gDACVD;QAEFD,OAAOA;kBAEP,cAAA,sBAACoB;YAAInB,SAAS;YAAsCG,SAASA;;8BAC3D,qBAACiB,gBAAO;oBACNpB,WAAWkB,IAAAA,gBAAU,gCAEnBZ;oBAEFJ,MAAMA;mBACFG;8BAEHD;;8BAEH,qBAACe;oBACCnB,WAAWkB,IAAAA,gBAAU,6BAEnBjB,UAAU;8BAGZ,cAAA,qBAACM;;;;;AAKX"}

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

@@ -21,5 +21,5 @@ export interface ScrollArrowProps extends React.ButtonHTMLAttributes<HTMLButtonE
  * @since 5.4.0
  * @see https://vkcom.github.io/VKUI/#/ScrollArrow
  */
-export declare const ScrollArrow: ({ size, offsetY, direction, label: labelProp, children, ...restProps }: ScrollArrowProps) => React.JSX.Element;
+export declare const ScrollArrow: ({ size, offsetY, direction, label: labelProp, children, ...restProps }: ScrollArrowProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ScrollArrow.d.ts.map

package/dist/cjs/components/ScrollArrow/ScrollArrow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollArrow.d.ts","sourceRoot":"","sources":["../../../../src/components/ScrollArrow/ScrollArrow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAiCzC,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,UAAU,CAAC,iBAAiB,CAAC;IAC/B;;OAEG;IACH,SAAS,EAAE,IAAI,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;IAC5C;;OAEG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;GAKG;AACH,eAAO,MAAM,WAAW,2EAOrB,gBAAgB,sBAoBlB,CAAC"}
+{"version":3,"file":"ScrollArrow.d.ts","sourceRoot":"","sources":["../../../../src/components/ScrollArrow/ScrollArrow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAiCzC,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,UAAU,CAAC,iBAAiB,CAAC;IAC/B;;OAEG;IACH,SAAS,EAAE,IAAI,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;IAC5C;;OAEG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;GAKG;AACH,eAAO,MAAM,WAAW,2EAOrB,gBAAgB,4CAoBlB,CAAC"}

package/dist/cjs/components/ScrollArrow/ScrollArrow.js

@@ -10,7 +10,9 @@ Object.defineProperty(exports, "ScrollArrow", {
 });
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _object_spread = require("@swc/helpers/_/_object_spread");
+const _object_spread_props = require("@swc/helpers/_/_object_spread_props");
 const _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+const _jsxruntime = require("react/jsx-runtime");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _icons = require("@vkontakte/icons");
 const _vkjs = require("@vkontakte/vkjs");
@@ -37,12 +39,12 @@ const ArrowIcon = ({ size })=>{
     if (size === 'm') {
         Icon = _icons.Icon16Chevron;
     }
-    return /*#__PURE__*/ _react.createElement(Icon, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(Icon, {
         className: "vkuiScrollArrow__defaultIcon"
     });
 };
 const ScrollArrow = (_param)=>{
-    var { size = 'l', offsetY, direction, label: labelProp, children = /*#__PURE__*/ _react.createElement(ArrowIcon, {
+    var { size = 'l', offsetY, direction, label: labelProp, children = /*#__PURE__*/ (0, _jsxruntime.jsx)(ArrowIcon, {
         size: size
     }) } = _param, restProps = _object_without_properties._(_param, [
         "size",
@@ -52,16 +54,24 @@ const ScrollArrow = (_param)=>{
         "children"
     ]);
     const label = labelProp !== null && labelProp !== void 0 ? labelProp : labelDirection[direction];
-    return /*#__PURE__*/ _react.createElement(_RootComponent.RootComponent, _object_spread._({
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_RootComponent.RootComponent, _object_spread_props._(_object_spread._({
         Component: "button",
         type: "button",
         baseClassName: (0, _vkjs.classNames)("vkuiScrollArrow", stylesSize[size], stylesDirection[direction])
-    }, restProps), label && /*#__PURE__*/ _react.createElement(_VisuallyHidden.VisuallyHidden, null, label), /*#__PURE__*/ _react.createElement("span", {
-        className: "vkuiScrollArrow__icon",
-        style: offsetY ? {
-            top: offsetY
-        } : undefined
-    }, children));
+    }, restProps), {
+        children: [
+            label && /*#__PURE__*/ (0, _jsxruntime.jsx)(_VisuallyHidden.VisuallyHidden, {
+                children: label
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                className: "vkuiScrollArrow__icon",
+                style: offsetY ? {
+                    top: offsetY
+                } : undefined,
+                children: children
+            })
+        ]
+    }));
 };
 
 //# sourceMappingURL=ScrollArrow.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ScrollArrow/ScrollArrow.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Chevron, Icon24Chevron } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ScrollArrow.module.css';\n\nconst stylesSize = {\n  m: styles['ScrollArrow--size-m'],\n  l: styles['ScrollArrow--size-l'],\n};\n\nconst stylesDirection = {\n  up: styles['ScrollArrow--direction-up'],\n  right: styles['ScrollArrow--direction-right'],\n  down: styles['ScrollArrow--direction-down'],\n  left: styles['ScrollArrow--direction-left'],\n};\n\nconst labelDirection = {\n  up: 'Назад',\n  right: 'Вперед',\n  down: 'Вперед',\n  left: 'Назад',\n};\n\nconst ArrowIcon = ({ size }: Pick<ScrollArrowProps, 'size'>) => {\n  let Icon = Icon24Chevron;\n  if (size === 'm') {\n    Icon = Icon16Chevron;\n  }\n\n  return <Icon className={styles['ScrollArrow__defaultIcon']} />;\n};\n\nexport interface ScrollArrowProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    HasRootRef<HTMLButtonElement> {\n  /**\n   * Направление стрелки\n   */\n  direction: 'up' | 'right' | 'down' | 'left';\n  /**\n   * Размер стрелки\n   */\n  size?: 'm' | 'l';\n  /**\n   * Смещает иконку кнопки навигации по вертикали.\n   */\n  offsetY?: number | string;\n  label?: string;\n}\n\n/**\n * Компонент стрелки. Используется в [HorizontalScroll](#/HorizontalScroll) и [Gallery](#/Gallery).\n *\n * @since 5.4.0\n * @see https://vkcom.github.io/VKUI/#/ScrollArrow\n */\nexport const ScrollArrow = ({\n  size = 'l',\n  offsetY,\n  direction,\n  label: labelProp,\n  children = <ArrowIcon size={size} />,\n  ...restProps\n}: ScrollArrowProps) => {\n  const label = labelProp ?? labelDirection[direction];\n\n  return (\n    <RootComponent\n      Component=\"button\"\n      type=\"button\"\n      baseClassName={classNames(\n        styles['ScrollArrow'],\n        stylesSize[size],\n        stylesDirection[direction],\n      )}\n      {...restProps}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n      <span className={styles['ScrollArrow__icon']} style={offsetY ? { top: offsetY } : undefined}>\n        {children}\n      </span>\n    </RootComponent>\n  );\n};\n"],"names":["ScrollArrow","stylesSize","m","l","stylesDirection","up","right","down","left","labelDirection","ArrowIcon","size","Icon","Icon24Chevron","Icon16Chevron","className","offsetY","direction","label","labelProp","children","restProps","RootComponent","Component","type","baseClassName","classNames","VisuallyHidden","span","style","top","undefined"],"mappings":";;;;+BA4DaA;;;eAAAA;;;;;;iEA5DU;uBACsB;sBAClB;+BAEG;gCACC;AAG/B,MAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;AACH;AAEA,MAAMC,kBAAkB;IACtBC,EAAE;IACFC,KAAK;IACLC,IAAI;IACJC,IAAI;AACN;AAEA,MAAMC,iBAAiB;IACrBJ,IAAI;IACJC,OAAO;IACPC,MAAM;IACNC,MAAM;AACR;AAEA,MAAME,YAAY,CAAC,EAAEC,IAAI,EAAkC;IACzD,IAAIC,OAAOC,oBAAa;IACxB,IAAIF,SAAS,KAAK;QAChBC,OAAOE,oBAAa;IACtB;IAEA,qBAAO,qBAACF;QAAKG,SAAS;;AACxB;AA0BO,MAAMf,cAAc;QAAC,EAC1BW,OAAO,GAAG,EACVK,OAAO,EACPC,SAAS,EACTC,OAAOC,SAAS,EAChBC,yBAAW,qBAACV;QAAUC,MAAMA;MAAQ,EAEnB,WADdU;QALHV;QACAK;QACAC;QACAC;QACAE;;IAGA,MAAMF,QAAQC,sBAAAA,uBAAAA,YAAaV,cAAc,CAACQ,UAAU;IAEpD,qBACE,qBAACK,4BAAa;QACZC,WAAU;QACVC,MAAK;QACLC,eAAeC,IAAAA,gBAAU,qBAEvBzB,UAAU,CAACU,KAAK,EAChBP,eAAe,CAACa,UAAU;OAExBI,YAEHH,uBAAS,qBAACS,8BAAc,QAAET,sBAC3B,qBAACU;QAAKb,SAAS;QAA+Bc,OAAOb,UAAU;YAAEc,KAAKd;QAAQ,IAAIe;OAC/EX;AAIT"}
+{"version":3,"sources":["../../../../src/components/ScrollArrow/ScrollArrow.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Chevron, Icon24Chevron } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ScrollArrow.module.css';\n\nconst stylesSize = {\n  m: styles['ScrollArrow--size-m'],\n  l: styles['ScrollArrow--size-l'],\n};\n\nconst stylesDirection = {\n  up: styles['ScrollArrow--direction-up'],\n  right: styles['ScrollArrow--direction-right'],\n  down: styles['ScrollArrow--direction-down'],\n  left: styles['ScrollArrow--direction-left'],\n};\n\nconst labelDirection = {\n  up: 'Назад',\n  right: 'Вперед',\n  down: 'Вперед',\n  left: 'Назад',\n};\n\nconst ArrowIcon = ({ size }: Pick<ScrollArrowProps, 'size'>) => {\n  let Icon = Icon24Chevron;\n  if (size === 'm') {\n    Icon = Icon16Chevron;\n  }\n\n  return <Icon className={styles['ScrollArrow__defaultIcon']} />;\n};\n\nexport interface ScrollArrowProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    HasRootRef<HTMLButtonElement> {\n  /**\n   * Направление стрелки\n   */\n  direction: 'up' | 'right' | 'down' | 'left';\n  /**\n   * Размер стрелки\n   */\n  size?: 'm' | 'l';\n  /**\n   * Смещает иконку кнопки навигации по вертикали.\n   */\n  offsetY?: number | string;\n  label?: string;\n}\n\n/**\n * Компонент стрелки. Используется в [HorizontalScroll](#/HorizontalScroll) и [Gallery](#/Gallery).\n *\n * @since 5.4.0\n * @see https://vkcom.github.io/VKUI/#/ScrollArrow\n */\nexport const ScrollArrow = ({\n  size = 'l',\n  offsetY,\n  direction,\n  label: labelProp,\n  children = <ArrowIcon size={size} />,\n  ...restProps\n}: ScrollArrowProps) => {\n  const label = labelProp ?? labelDirection[direction];\n\n  return (\n    <RootComponent\n      Component=\"button\"\n      type=\"button\"\n      baseClassName={classNames(\n        styles['ScrollArrow'],\n        stylesSize[size],\n        stylesDirection[direction],\n      )}\n      {...restProps}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n      <span className={styles['ScrollArrow__icon']} style={offsetY ? { top: offsetY } : undefined}>\n        {children}\n      </span>\n    </RootComponent>\n  );\n};\n"],"names":["ScrollArrow","stylesSize","m","l","stylesDirection","up","right","down","left","labelDirection","ArrowIcon","size","Icon","Icon24Chevron","Icon16Chevron","className","offsetY","direction","label","labelProp","children","restProps","RootComponent","Component","type","baseClassName","classNames","VisuallyHidden","span","style","top","undefined"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BA4DaA;;;eAAAA;;;;;;;;iEA5DU;uBACsB;sBAClB;+BAEG;gCACC;AAG/B,MAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;AACH;AAEA,MAAMC,kBAAkB;IACtBC,EAAE;IACFC,KAAK;IACLC,IAAI;IACJC,IAAI;AACN;AAEA,MAAMC,iBAAiB;IACrBJ,IAAI;IACJC,OAAO;IACPC,MAAM;IACNC,MAAM;AACR;AAEA,MAAME,YAAY,CAAC,EAAEC,IAAI,EAAkC;IACzD,IAAIC,OAAOC,oBAAa;IACxB,IAAIF,SAAS,KAAK;QAChBC,OAAOE,oBAAa;IACtB;IAEA,qBAAO,qBAACF;QAAKG,SAAS;;AACxB;AA0BO,MAAMf,cAAc;QAAC,EAC1BW,OAAO,GAAG,EACVK,OAAO,EACPC,SAAS,EACTC,OAAOC,SAAS,EAChBC,yBAAW,qBAACV;QAAUC,MAAMA;MAAQ,EAEnB,WADdU;QALHV;QACAK;QACAC;QACAC;QACAE;;IAGA,MAAMF,QAAQC,sBAAAA,uBAAAA,YAAaV,cAAc,CAACQ,UAAU;IAEpD,qBACE,sBAACK,4BAAa;QACZC,WAAU;QACVC,MAAK;QACLC,eAAeC,IAAAA,gBAAU,qBAEvBzB,UAAU,CAACU,KAAK,EAChBP,eAAe,CAACa,UAAU;OAExBI;;YAEHH,uBAAS,qBAACS,8BAAc;0BAAET;;0BAC3B,qBAACU;gBAAKb,SAAS;gBAA+Bc,OAAOb,UAAU;oBAAEc,KAAKd;gBAAQ,IAAIe;0BAC/EX;;;;AAIT"}

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

@@ -27,5 +27,5 @@ export interface SearchProps extends React.InputHTMLAttributes<HTMLInputElement>
 /**
  * @see https://vkcom.github.io/VKUI/#/Search
  */
-export declare const Search: ({ id: idProp, before, className, placeholder, after, getRef, icon, onIconClick, style, autoComplete, onChange, iconLabel, clearLabel, noPadding, getRootRef, findButtonText, onFindButtonClick, ...inputProps }: SearchProps) => React.JSX.Element;
+export declare const Search: ({ id: idProp, before, className, placeholder, after, getRef, icon, onIconClick, style, autoComplete, onChange, iconLabel, clearLabel, noPadding, getRootRef, findButtonText, onFindButtonClick, ...inputProps }: SearchProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Search.d.ts.map

package/dist/cjs/components/Search/Search.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Search.d.ts","sourceRoot":"","sources":["../../../../src/components/Search/Search.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAOjD,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EACjD,UAAU,CAAC,cAAc,CAAC,EAC1B,MAAM,CAAC,gBAAgB,CAAC;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,WAAW,CAAC,CAAC;IACrD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;CAC1D;AAED;;GAEG;AACH,eAAO,MAAM,MAAM,oNAmBhB,WAAW,sBAuJb,CAAC"}
+{"version":3,"file":"Search.d.ts","sourceRoot":"","sources":["../../../../src/components/Search/Search.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAOjD,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EACjD,UAAU,CAAC,cAAc,CAAC,EAC1B,MAAM,CAAC,gBAAgB,CAAC;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,WAAW,CAAC,CAAC;IACrD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;CAC1D;AAED;;GAEG;AACH,eAAO,MAAM,MAAM,oNAmBhB,WAAW,4CAiKb,CAAC"}