@vkontakte/vkui 5.0.3 → 5.1.2

package/dist/components/Typography/Subhead/Subhead.d.ts

@@ -1,10 +1,10 @@
-import * as React from "react";
-import { HasComponent } from "../../../types";
+import * as React from 'react';
+import { HasComponent } from '../../../types';
 export interface SubheadProps extends React.AllHTMLAttributes<HTMLElement>, HasComponent {
     /**
      * Задаёт начертание шрифта отличное от стандартного.
      */
-    weight?: "1" | "2" | "3";
+    weight?: '1' | '2' | '3';
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Subhead

package/dist/components/Typography/Subhead/Subhead.js

@@ -1,10 +1,10 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["className", "children", "weight", "Component"];
-import * as React from "react";
-import { classNamesString } from "../../../lib/classNames";
-import { useAdaptivity } from "../../../hooks/useAdaptivity";
-import { getSizeYClassName } from "../../../helpers/getSizeYClassName";
+import * as React from 'react';
+import { classNames } from '@vkontakte/vkjs';
+import { useAdaptivity } from '../../../hooks/useAdaptivity';
+import { getSizeYClassName } from '../../../helpers/getSizeYClassName';
 /**
  * @see https://vkcom.github.io/VKUI/#/Subhead
  */
@@ -13,12 +13,12 @@ export var Subhead = function Subhead(_ref) {
     children = _ref.children,
     weight = _ref.weight,
     _ref$Component = _ref.Component,
-    Component = _ref$Component === void 0 ? "h5" : _ref$Component,
+    Component = _ref$Component === void 0 ? 'h5' : _ref$Component,
     restProps = _objectWithoutProperties(_ref, _excluded);
   var _useAdaptivity = useAdaptivity(),
     sizeY = _useAdaptivity.sizeY;
   return /*#__PURE__*/React.createElement(Component, _extends({}, restProps, {
-    className: classNamesString(className, "vkuiSubhead", getSizeYClassName("vkuiSubhead", sizeY), weight && styles["Subhead--weight-".concat(weight)])
+    className: classNames(className, "vkuiSubhead", getSizeYClassName("vkuiSubhead", sizeY), weight && styles["Subhead--weight-".concat(weight)])
   }), children);
 };
 var styles = {

package/dist/components/Typography/Subhead/Subhead.js.map

@@ -1 +1 @@
-{"version":3,"file":"Subhead.js","names":["React","classNamesString","useAdaptivity","getSizeYClassName","Subhead","className","children","weight","Component","restProps","sizeY","styles"],"sources":["../../../../src/components/Typography/Subhead/Subhead.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { HasComponent } from \"../../../types\";\nimport { classNamesString } from \"../../../lib/classNames\";\nimport { useAdaptivity } from \"../../../hooks/useAdaptivity\";\nimport { getSizeYClassName } from \"../../../helpers/getSizeYClassName\";\nimport styles from \"./Subhead.module.css\";\n\nexport interface SubheadProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasComponent {\n  /**\n   * Задаёт начертание шрифта отличное от стандартного.\n   */\n  weight?: \"1\" | \"2\" | \"3\";\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Subhead\n */\nexport const Subhead = ({\n  className,\n  children,\n  weight,\n  Component = \"h5\",\n  ...restProps\n}: SubheadProps) => {\n  const { sizeY } = useAdaptivity();\n\n  return (\n    <Component\n      {...restProps}\n      className={classNamesString(\n        className,\n        styles[\"Subhead\"],\n        getSizeYClassName(styles[\"Subhead\"], sizeY),\n        weight && styles[`Subhead--weight-${weight}`]\n      )}\n    >\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,gBAAgB,QAAQ,yBAAyB;AAC1D,SAASC,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,iBAAiB,QAAQ,oCAAoC;AAYtE;AACA;AACA;AACA,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAO,OAMA;EAAA,IALlBC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,MAAM,QAANA,MAAM;IAAA,sBACNC,SAAS;IAATA,SAAS,+BAAG,IAAI;IACbC,SAAS;EAEZ,qBAAkBP,aAAa,EAAE;IAAzBQ,KAAK,kBAALA,KAAK;EAEb,oBACE,oBAAC,SAAS,eACJD,SAAS;IACb,SAAS,EAAER,gBAAgB,CACzBI,SAAS,iBAETF,iBAAiB,gBAAoBO,KAAK,CAAC,EAC3CH,MAAM,IAAII,MAAM,2BAAoBJ,MAAM,EAAG;EAC7C,IAEDD,QAAQ,CACC;AAEhB,CAAC;AAAC;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"file":"Subhead.js","names":["React","classNames","useAdaptivity","getSizeYClassName","Subhead","className","children","weight","Component","restProps","sizeY","styles"],"sources":["../../../../src/components/Typography/Subhead/Subhead.tsx"],"sourcesContent":["import * as React from 'react';\nimport { HasComponent } from '../../../types';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport { getSizeYClassName } from '../../../helpers/getSizeYClassName';\nimport styles from './Subhead.module.css';\n\nexport interface SubheadProps extends React.AllHTMLAttributes<HTMLElement>, HasComponent {\n  /**\n   * Задаёт начертание шрифта отличное от стандартного.\n   */\n  weight?: '1' | '2' | '3';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Subhead\n */\nexport const Subhead = ({\n  className,\n  children,\n  weight,\n  Component = 'h5',\n  ...restProps\n}: SubheadProps) => {\n  const { sizeY } = useAdaptivity();\n\n  return (\n    <Component\n      {...restProps}\n      className={classNames(\n        className,\n        styles['Subhead'],\n        getSizeYClassName(styles['Subhead'], sizeY),\n        weight && styles[`Subhead--weight-${weight}`],\n      )}\n    >\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,iBAAiB,QAAQ,oCAAoC;AAUtE;AACA;AACA;AACA,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAO,OAMA;EAAA,IALlBC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,MAAM,QAANA,MAAM;IAAA,sBACNC,SAAS;IAATA,SAAS,+BAAG,IAAI;IACbC,SAAS;EAEZ,qBAAkBP,aAAa,EAAE;IAAzBQ,KAAK,kBAALA,KAAK;EAEb,oBACE,oBAAC,SAAS,eACJD,SAAS;IACb,SAAS,EAAER,UAAU,CACnBI,SAAS,iBAETF,iBAAiB,gBAAoBO,KAAK,CAAC,EAC3CH,MAAM,IAAII,MAAM,2BAAoBJ,MAAM,EAAG;EAC7C,IAEDD,QAAQ,CACC;AAEhB,CAAC;AAAC;EAAA;EAAA;EAAA;AAAA"}

package/dist/components/Typography/Text/Text.d.ts

@@ -1,10 +1,10 @@
-import * as React from "react";
-import { HasComponent, HasRootRef } from "../../../types";
+import * as React from 'react';
+import { HasComponent, HasRootRef } from '../../../types';
 export interface TextProps extends React.AllHTMLAttributes<HTMLElement>, HasRootRef<HTMLElement>, HasComponent {
     /**
      * Задаёт начертание шрифта, отличное от стандартного.
      */
-    weight?: "1" | "2" | "3";
+    weight?: '1' | '2' | '3';
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Text

package/dist/components/Typography/Text/Text.js

@@ -1,12 +1,12 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["className", "children", "weight", "Component", "getRootRef"];
-import * as React from "react";
-import { useAdaptivity } from "../../../hooks/useAdaptivity";
-import { classNamesString } from "../../../lib/classNames";
-import { warnOnce } from "../../../lib/warnOnce";
-import { getSizeYClassName } from "../../../helpers/getSizeYClassName";
-var warn = warnOnce("Text");
+import * as React from 'react';
+import { useAdaptivity } from '../../../hooks/useAdaptivity';
+import { classNames } from '@vkontakte/vkjs';
+import { warnOnce } from '../../../lib/warnOnce';
+import { getSizeYClassName } from '../../../helpers/getSizeYClassName';
+var warn = warnOnce('Text');
 /**
  * @see https://vkcom.github.io/VKUI/#/Text
  */
@@ -15,17 +15,17 @@ export var Text = function Text(_ref) {
     children = _ref.children,
     weight = _ref.weight,
     _ref$Component = _ref.Component,
-    Component = _ref$Component === void 0 ? "span" : _ref$Component,
+    Component = _ref$Component === void 0 ? 'span' : _ref$Component,
     getRootRef = _ref.getRootRef,
     restProps = _objectWithoutProperties(_ref, _excluded);
-  if (process.env.NODE_ENV === "development" && typeof Component !== "string" && getRootRef) {
-    warn("\u0421\u0432\u043E\u0439\u0441\u0442\u0432\u043E \"getRootRef\" \u043C\u043E\u0436\u0435\u0442 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C\u0441\u044F \u0442\u043E\u043B\u044C\u043A\u043E \u0441 \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442\u0430\u043C\u0438 DOM", "error");
+  if (process.env.NODE_ENV === 'development' && typeof Component !== 'string' && getRootRef) {
+    warn("\u0421\u0432\u043E\u0439\u0441\u0442\u0432\u043E \"getRootRef\" \u043C\u043E\u0436\u0435\u0442 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C\u0441\u044F \u0442\u043E\u043B\u044C\u043A\u043E \u0441 \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442\u0430\u043C\u0438 DOM", 'error');
   }
   var _useAdaptivity = useAdaptivity(),
     sizeY = _useAdaptivity.sizeY;
   return /*#__PURE__*/React.createElement(Component, _extends({}, restProps, {
     ref: getRootRef,
-    className: classNamesString(className, "vkuiText", getSizeYClassName("vkuiText", sizeY), weight && styles["Text--weight-".concat(weight)])
+    className: classNames(className, "vkuiText", getSizeYClassName("vkuiText", sizeY), weight && styles["Text--weight-".concat(weight)])
   }), children);
 };
 var styles = {

package/dist/components/Typography/Text/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","names":["React","useAdaptivity","classNamesString","warnOnce","getSizeYClassName","warn","Text","className","children","weight","Component","getRootRef","restProps","process","env","NODE_ENV","sizeY","styles"],"sources":["../../../../src/components/Typography/Text/Text.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { useAdaptivity } from \"../../../hooks/useAdaptivity\";\nimport { classNamesString } from \"../../../lib/classNames\";\nimport { HasComponent, HasRootRef } from \"../../../types\";\nimport { warnOnce } from \"../../../lib/warnOnce\";\nimport { getSizeYClassName } from \"../../../helpers/getSizeYClassName\";\nimport styles from \"./Text.module.css\";\n\nexport interface TextProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent {\n  /**\n   * Задаёт начертание шрифта, отличное от стандартного.\n   */\n  weight?: \"1\" | \"2\" | \"3\";\n}\n\nconst warn = warnOnce(\"Text\");\n/**\n * @see https://vkcom.github.io/VKUI/#/Text\n */\nexport const Text = ({\n  className,\n  children,\n  weight,\n  Component = \"span\",\n  getRootRef,\n  ...restProps\n}: TextProps) => {\n  if (\n    process.env.NODE_ENV === \"development\" &&\n    typeof Component !== \"string\" &&\n    getRootRef\n  ) {\n    warn(\n      `Свойство \"getRootRef\" может использоваться только с компонентами DOM`,\n      \"error\"\n    );\n  }\n\n  const { sizeY } = useAdaptivity();\n\n  return (\n    <Component\n      {...restProps}\n      ref={getRootRef}\n      className={classNamesString(\n        className,\n        styles[\"Text\"],\n        getSizeYClassName(styles[\"Text\"], sizeY),\n        weight && styles[`Text--weight-${weight}`]\n      )}\n    >\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,gBAAgB,QAAQ,yBAAyB;AAE1D,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,iBAAiB,QAAQ,oCAAoC;AAatE,IAAMC,IAAI,GAAGF,QAAQ,CAAC,MAAM,CAAC;AAC7B;AACA;AACA;AACA,OAAO,IAAMG,IAAI,GAAG,SAAPA,IAAI,OAOA;EAAA,IANfC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,MAAM,QAANA,MAAM;IAAA,sBACNC,SAAS;IAATA,SAAS,+BAAG,MAAM;IAClBC,UAAU,QAAVA,UAAU;IACPC,SAAS;EAEZ,IACEC,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,aAAa,IACtC,OAAOL,SAAS,KAAK,QAAQ,IAC7BC,UAAU,EACV;IACAN,IAAI,iTAEF,OAAO,CACR;EACH;EAEA,qBAAkBJ,aAAa,EAAE;IAAzBe,KAAK,kBAALA,KAAK;EAEb,oBACE,oBAAC,SAAS,eACJJ,SAAS;IACb,GAAG,EAAED,UAAW;IAChB,SAAS,EAAET,gBAAgB,CACzBK,SAAS,cAETH,iBAAiB,aAAiBY,KAAK,CAAC,EACxCP,MAAM,IAAIQ,MAAM,wBAAiBR,MAAM,EAAG;EAC1C,IAEDD,QAAQ,CACC;AAEhB,CAAC;AAAC;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"file":"Text.js","names":["React","useAdaptivity","classNames","warnOnce","getSizeYClassName","warn","Text","className","children","weight","Component","getRootRef","restProps","process","env","NODE_ENV","sizeY","styles"],"sources":["../../../../src/components/Typography/Text/Text.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasComponent, HasRootRef } from '../../../types';\nimport { warnOnce } from '../../../lib/warnOnce';\nimport { getSizeYClassName } from '../../../helpers/getSizeYClassName';\nimport styles from './Text.module.css';\n\nexport interface TextProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent {\n  /**\n   * Задаёт начертание шрифта, отличное от стандартного.\n   */\n  weight?: '1' | '2' | '3';\n}\n\nconst warn = warnOnce('Text');\n/**\n * @see https://vkcom.github.io/VKUI/#/Text\n */\nexport const Text = ({\n  className,\n  children,\n  weight,\n  Component = 'span',\n  getRootRef,\n  ...restProps\n}: TextProps) => {\n  if (process.env.NODE_ENV === 'development' && typeof Component !== 'string' && getRootRef) {\n    warn(`Свойство \"getRootRef\" может использоваться только с компонентами DOM`, 'error');\n  }\n\n  const { sizeY } = useAdaptivity();\n\n  return (\n    <Component\n      {...restProps}\n      ref={getRootRef}\n      className={classNames(\n        className,\n        styles['Text'],\n        getSizeYClassName(styles['Text'], sizeY),\n        weight && styles[`Text--weight-${weight}`],\n      )}\n    >\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,UAAU,QAAQ,iBAAiB;AAE5C,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,iBAAiB,QAAQ,oCAAoC;AAatE,IAAMC,IAAI,GAAGF,QAAQ,CAAC,MAAM,CAAC;AAC7B;AACA;AACA;AACA,OAAO,IAAMG,IAAI,GAAG,SAAPA,IAAI,OAOA;EAAA,IANfC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,MAAM,QAANA,MAAM;IAAA,sBACNC,SAAS;IAATA,SAAS,+BAAG,MAAM;IAClBC,UAAU,QAAVA,UAAU;IACPC,SAAS;EAEZ,IAAIC,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,aAAa,IAAI,OAAOL,SAAS,KAAK,QAAQ,IAAIC,UAAU,EAAE;IACzFN,IAAI,iTAAyE,OAAO,CAAC;EACvF;EAEA,qBAAkBJ,aAAa,EAAE;IAAzBe,KAAK,kBAALA,KAAK;EAEb,oBACE,oBAAC,SAAS,eACJJ,SAAS;IACb,GAAG,EAAED,UAAW;IAChB,SAAS,EAAET,UAAU,CACnBK,SAAS,cAETH,iBAAiB,aAAiBY,KAAK,CAAC,EACxCP,MAAM,IAAIQ,MAAM,wBAAiBR,MAAM,EAAG;EAC1C,IAEDD,QAAQ,CACC;AAEhB,CAAC;AAAC;EAAA;EAAA;EAAA;AAAA"}

package/dist/components/Typography/Title/Title.d.ts

@@ -1,11 +1,11 @@
-import * as React from "react";
-import { HasComponent } from "../../../types";
+import * as React from 'react';
+import { HasComponent } from '../../../types';
 export interface TitleProps extends React.AllHTMLAttributes<HTMLElement>, HasComponent {
     /**
      * Задаёт начертание шрифта отличное от стандартного.
      */
-    weight?: "1" | "2" | "3";
-    level?: "1" | "2" | "3";
+    weight?: '1' | '2' | '3';
+    level?: '1' | '2' | '3';
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Title

package/dist/components/Typography/Title/Title.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["className", "children", "weight", "level", "Component"];
-import * as React from "react";
-import { classNamesString } from "../../../lib/classNames";
+import * as React from 'react';
+import { classNames } from '@vkontakte/vkjs';
 /**
  * @see https://vkcom.github.io/VKUI/#/Title
  */
@@ -11,14 +11,14 @@ export var Title = function Title(_ref) {
     children = _ref.children,
     weight = _ref.weight,
     _ref$level = _ref.level,
-    level = _ref$level === void 0 ? "1" : _ref$level,
+    level = _ref$level === void 0 ? '1' : _ref$level,
     Component = _ref.Component,
     restProps = _objectWithoutProperties(_ref, _excluded);
   if (!Component) {
-    Component = "h" + level;
+    Component = 'h' + level;
   }
   return /*#__PURE__*/React.createElement(Component, _extends({}, restProps, {
-    className: classNamesString(className, "vkuiTitle", styles["Title--level-".concat(level)], weight && styles["Title--weight-".concat(weight)])
+    className: classNames(className, "vkuiTitle", styles["Title--level-".concat(level)], weight && styles["Title--weight-".concat(weight)])
   }), children);
 };
 var styles = {

package/dist/components/Typography/Title/Title.js.map

@@ -1 +1 @@
-{"version":3,"file":"Title.js","names":["React","classNamesString","Title","className","children","weight","level","Component","restProps","styles"],"sources":["../../../../src/components/Typography/Title/Title.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { HasComponent } from \"../../../types\";\nimport { classNamesString } from \"../../../lib/classNames\";\nimport styles from \"./Title.module.css\";\n\nexport interface TitleProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasComponent {\n  /**\n   * Задаёт начертание шрифта отличное от стандартного.\n   */\n  weight?: \"1\" | \"2\" | \"3\";\n  level?: \"1\" | \"2\" | \"3\";\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Title\n */\nexport const Title = ({\n  className,\n  children,\n  weight,\n  level = \"1\",\n  Component,\n  ...restProps\n}: TitleProps) => {\n  if (!Component) {\n    Component = (\"h\" + level) as React.ElementType;\n  }\n\n  return (\n    <Component\n      {...restProps}\n      className={classNamesString(\n        className,\n        styles[\"Title\"],\n        styles[`Title--level-${level}`],\n        weight && styles[`Title--weight-${weight}`]\n      )}\n    >\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,gBAAgB,QAAQ,yBAAyB;AAa1D;AACA;AACA;AACA,OAAO,IAAMC,KAAK,GAAG,SAARA,KAAK,OAOA;EAAA,IANhBC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,MAAM,QAANA,MAAM;IAAA,kBACNC,KAAK;IAALA,KAAK,2BAAG,GAAG;IACXC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAI,CAACD,SAAS,EAAE;IACdA,SAAS,GAAI,GAAG,GAAGD,KAA2B;EAChD;EAEA,oBACE,oBAAC,SAAS,eACJE,SAAS;IACb,SAAS,EAAEP,gBAAgB,CACzBE,SAAS,eAETM,MAAM,wBAAiBH,KAAK,EAAG,EAC/BD,MAAM,IAAII,MAAM,yBAAkBJ,MAAM,EAAG;EAC3C,IAEDD,QAAQ,CACC;AAEhB,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"file":"Title.js","names":["React","classNames","Title","className","children","weight","level","Component","restProps","styles"],"sources":["../../../../src/components/Typography/Title/Title.tsx"],"sourcesContent":["import * as React from 'react';\nimport { HasComponent } from '../../../types';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './Title.module.css';\n\nexport interface TitleProps extends React.AllHTMLAttributes<HTMLElement>, HasComponent {\n  /**\n   * Задаёт начертание шрифта отличное от стандартного.\n   */\n  weight?: '1' | '2' | '3';\n  level?: '1' | '2' | '3';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Title\n */\nexport const Title = ({\n  className,\n  children,\n  weight,\n  level = '1',\n  Component,\n  ...restProps\n}: TitleProps) => {\n  if (!Component) {\n    Component = ('h' + level) as React.ElementType;\n  }\n\n  return (\n    <Component\n      {...restProps}\n      className={classNames(\n        className,\n        styles['Title'],\n        styles[`Title--level-${level}`],\n        weight && styles[`Title--weight-${weight}`],\n      )}\n    >\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,UAAU,QAAQ,iBAAiB;AAW5C;AACA;AACA;AACA,OAAO,IAAMC,KAAK,GAAG,SAARA,KAAK,OAOA;EAAA,IANhBC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,MAAM,QAANA,MAAM;IAAA,kBACNC,KAAK;IAALA,KAAK,2BAAG,GAAG;IACXC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAI,CAACD,SAAS,EAAE;IACdA,SAAS,GAAI,GAAG,GAAGD,KAA2B;EAChD;EAEA,oBACE,oBAAC,SAAS,eACJE,SAAS;IACb,SAAS,EAAEP,UAAU,CACnBE,SAAS,eAETM,MAAM,wBAAiBH,KAAK,EAAG,EAC/BD,MAAM,IAAII,MAAM,yBAAkBJ,MAAM,EAAG;EAC3C,IAEDD,QAAQ,CACC;AAEhB,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}

package/dist/components/UsersStack/UsersStack.d.ts

@@ -1,4 +1,4 @@
-import * as React from "react";
+import * as React from 'react';
 export interface UsersStackProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * Массив ссылок на фотографии
@@ -7,11 +7,11 @@ export interface UsersStackProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * Размер аватарок
      */
-    size?: "s" | "m" | "l";
+    size?: 's' | 'm' | 'l';
     /**
      * Вертикальный режим рекомендуется использовать с размером `m`
      */
-    layout?: "vertical" | "horizontal";
+    layout?: 'vertical' | 'horizontal';
     /**
      * Количество аватарок, которые будут показаны.
      * Если в массиве `photos` больше элементов и используется размер `m`, то будет показано количество остальных элементов

package/dist/components/UsersStack/UsersStack.js

@@ -2,25 +2,24 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["photoSize", "direction"],
   _excluded2 = ["photos", "visibleCount", "count", "size", "layout", "children", "className"];
-import * as React from "react";
-import { hasReactNode } from "../../lib/utils";
-import { classNamesString } from "../../lib/classNames";
-import { Footnote } from "../Typography/Footnote/Footnote";
-import { Caption } from "../Typography/Caption/Caption";
-import { useId } from "../../hooks/useId";
+import * as React from 'react';
+import { classNames, hasReactNode } from '@vkontakte/vkjs';
+import { Footnote } from '../Typography/Footnote/Footnote';
+import { Caption } from '../Typography/Caption/Caption';
+import { useId } from '../../hooks/useId';
 function PathElement(_ref) {
   var photoSize = _ref.photoSize,
     direction = _ref.direction,
     props = _objectWithoutProperties(_ref, _excluded);
   switch (direction) {
-    case "circle":
+    case 'circle':
       var radius = photoSize / 2;
       return /*#__PURE__*/React.createElement("circle", _extends({
         cx: radius,
         cy: radius,
         r: radius
       }, props));
-    case "right":
+    case 'right':
       switch (photoSize) {
         case 24:
           return /*#__PURE__*/React.createElement("path", _extends({
@@ -65,19 +64,19 @@ export var UsersStack = function UsersStack(_ref2) {
     _ref2$count = _ref2.count,
     count = _ref2$count === void 0 ? Math.max(0, photos.length - visibleCount) : _ref2$count,
     _ref2$size = _ref2.size,
-    size = _ref2$size === void 0 ? "m" : _ref2$size,
+    size = _ref2$size === void 0 ? 'm' : _ref2$size,
     _ref2$layout = _ref2.layout,
-    layout = _ref2$layout === void 0 ? "horizontal" : _ref2$layout,
+    layout = _ref2$layout === void 0 ? 'horizontal' : _ref2$layout,
     children = _ref2.children,
     className = _ref2.className,
     restProps = _objectWithoutProperties(_ref2, _excluded2);
   var cmpId = useId();
-  var canShowOthers = count > 0 && size !== "s";
-  var CounterTypography = size === "m" ? Footnote : Caption;
+  var canShowOthers = count > 0 && size !== 's';
+  var CounterTypography = size === 'l' ? Footnote : Caption;
   var photoSize = photoSizes[size];
-  var directionClip = canShowOthers ? "right" : "left";
+  var directionClip = canShowOthers ? 'right' : 'left';
   var photosElements = photos.slice(0, visibleCount).map(function (photo, i) {
-    var direction = i === 0 && !canShowOthers ? "circle" : directionClip;
+    var direction = i === 0 && !canShowOthers ? 'circle' : directionClip;
     var id = "UsersStackDefs".concat(cmpId).concat(i);
     var hrefID = "#".concat(id);
     var maskID = "UsersStackMask".concat(cmpId).concat(i);
@@ -112,10 +111,10 @@ export var UsersStack = function UsersStack(_ref2) {
   var othersElement = canShowOthers ? /*#__PURE__*/React.createElement(CounterTypography, {
     caps: true,
     weight: "1",
-    className: classNamesString("vkuiUsersStack__photo", "vkuiUsersStack__photo--others")
-  }, /*#__PURE__*/React.createElement("span", null, "+", count)) : null;
+    className: classNames("vkuiUsersStack__photo", "vkuiUsersStack__photo--others")
+  }, "+", count) : null;
   return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: classNamesString("vkuiUsersStack", styles["UsersStack--size-".concat(size)], styles["UsersStack--layout-".concat(layout)], canShowOthers && "vkuiUsersStack--others", className)
+    className: classNames("vkuiUsersStack", styles["UsersStack--size-".concat(size)], styles["UsersStack--layout-".concat(layout)], canShowOthers && "vkuiUsersStack--others", className)
   }), (photosElements.length > 0 || othersElement) && /*#__PURE__*/React.createElement("div", {
     className: "vkuiUsersStack__photos",
     role: "presentation"

package/dist/components/UsersStack/UsersStack.js.map

@@ -1 +1 @@
-{"version":3,"file":"UsersStack.js","names":["React","hasReactNode","classNamesString","Footnote","Caption","useId","PathElement","photoSize","direction","props","radius","photoSizes","s","m","l","UsersStack","photos","visibleCount","count","Math","max","length","size","layout","children","className","restProps","cmpId","canShowOthers","CounterTypography","directionClip","photosElements","slice","map","photo","i","id","hrefID","maskID","othersElement","styles"],"sources":["../../../src/components/UsersStack/UsersStack.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { Footnote } from \"../Typography/Footnote/Footnote\";\nimport { Caption } from \"../Typography/Caption/Caption\";\nimport { useId } from \"../../hooks/useId\";\nimport styles from \"./UsersStack.module.css\";\n\nexport interface UsersStackProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Массив ссылок на фотографии\n   */\n  photos?: string[];\n  /**\n   * Размер аватарок\n   */\n  size?: \"s\" | \"m\" | \"l\";\n  /**\n   * Вертикальный режим рекомендуется использовать с размером `m`\n   */\n  layout?: \"vertical\" | \"horizontal\";\n  /**\n   * Количество аватарок, которые будут показаны.\n   * Если в массиве `photos` больше элементов и используется размер `m`, то будет показано количество остальных элементов\n   */\n  visibleCount?: number;\n  /**\n   * Число, которое будет указано в счетчике.\n   * По умолчанию высчитывается по формуле `photos.length - visibleCount`.\n   * Если число больше 99, то счетчик скроется.\n   */\n  count?: number;\n}\n\ninterface PathElementProps extends React.SVGAttributes<SVGElement> {\n  photoSize: number;\n  direction: \"circle\" | \"right\" | \"left\";\n}\n\ntype PhotoSizeType = 16 | 24 | 32;\n\nfunction PathElement({ photoSize, direction, ...props }: PathElementProps) {\n  switch (direction) {\n    case \"circle\":\n      const radius = photoSize / 2;\n\n      return <circle cx={radius} cy={radius} r={radius} {...props} />;\n\n    case \"right\":\n      switch (photoSize) {\n        case 24:\n          return (\n            <path\n              d=\"M22,18.625A12 12 0 0 1 12 24A12 12 0 0 1 12 0A12 12 0 0 1 22 5.375A12 12 0 0 0 22,18.625\"\n              {...props}\n            />\n          );\n\n        default:\n          return (\n            <path\n              d=\"M30,23.75A16 16 0 0 1 16 32A16 16 0 0 1 16 0A16 16 0 0 1 30 8.25A16 16 0 0 0 30,23.75\"\n              {...props}\n            />\n          );\n      }\n\n    default:\n      switch (photoSize) {\n        case 16:\n          return (\n            <path\n              d=\"M2,13.285A8 8 0 0 0 8 16A8 8 0 0 0 8 0A8 8 0 0 0 2 2.715A8 8 0 0 1 2,13.285\"\n              {...props}\n            />\n          );\n        case 24:\n          return (\n            <path\n              d=\"M2,18.625A12 12 0 0 0 12 24A12 12 0 0 0 12 0A12 12 0 0 0 2 5.375A12 12 0 0 1 2,18.625\"\n              {...props}\n            />\n          );\n\n        default:\n          return (\n            <path\n              d=\"M2,23.75A16 16 0 0 0 16 32A16 16 0 0 0 16 0A16 16 0 0 0 2 8.25A16 16 0 0 1 2,23.75\"\n              {...props}\n            />\n          );\n      }\n  }\n}\n\nconst photoSizes: Record<\n  NonNullable<UsersStackProps[\"size\"]>,\n  PhotoSizeType\n> = {\n  s: 16,\n  m: 24,\n  l: 32,\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/UsersStack\n */\nexport const UsersStack = ({\n  photos = [],\n  visibleCount = 3,\n  count = Math.max(0, photos.length - visibleCount),\n  size = \"m\",\n  layout = \"horizontal\",\n  children,\n  className,\n  ...restProps\n}: UsersStackProps) => {\n  const cmpId = useId();\n\n  const canShowOthers = count > 0 && size !== \"s\";\n  const CounterTypography = size === \"m\" ? Footnote : Caption;\n\n  const photoSize = photoSizes[size];\n  const directionClip = canShowOthers ? \"right\" : \"left\";\n\n  const photosElements = photos.slice(0, visibleCount).map((photo, i) => {\n    const direction = i === 0 && !canShowOthers ? \"circle\" : directionClip;\n\n    const id = `UsersStackDefs${cmpId}${i}`;\n    const hrefID = `#${id}`;\n    const maskID = `UsersStackMask${cmpId}${i}`;\n\n    return (\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        className={styles[\"UsersStack__photo\"]}\n        key={i}\n        aria-hidden\n      >\n        <defs>\n          <PathElement id={id} direction={direction} photoSize={photoSize} />\n        </defs>\n        <clipPath id={maskID}>\n          <use href={hrefID} />\n        </clipPath>\n        <g clipPath={`url(#${maskID})`}>\n          <use href={hrefID} className={styles[\"UsersStack__fill\"]} />\n          <image href={photo} width={photoSize} height={photoSize} />\n          <use href={hrefID} fill=\"none\" stroke=\"rgba(0, 0, 0, 0.08)\" />\n        </g>\n      </svg>\n    );\n  });\n  const othersElement = canShowOthers ? (\n    <CounterTypography\n      caps\n      weight=\"1\"\n      className={classNamesString(\n        styles[\"UsersStack__photo\"],\n        styles[\"UsersStack__photo--others\"]\n      )}\n    >\n      <span>+{count}</span>\n    </CounterTypography>\n  ) : null;\n\n  return (\n    <div\n      {...restProps}\n      className={classNamesString(\n        styles[\"UsersStack\"],\n        styles[`UsersStack--size-${size}`],\n        styles[`UsersStack--layout-${layout}`],\n        canShowOthers && styles[\"UsersStack--others\"],\n        className\n      )}\n    >\n      {(photosElements.length > 0 || othersElement) && (\n        <div className={styles[\"UsersStack__photos\"]} role=\"presentation\">\n          {photosElements}\n          {othersElement}\n        </div>\n      )}\n      {hasReactNode(children) && (\n        <Footnote className={styles[\"UsersStack__text\"]}>{children}</Footnote>\n      )}\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"UsersStack.js","names":["React","classNames","hasReactNode","Footnote","Caption","useId","PathElement","photoSize","direction","props","radius","photoSizes","s","m","l","UsersStack","photos","visibleCount","count","Math","max","length","size","layout","children","className","restProps","cmpId","canShowOthers","CounterTypography","directionClip","photosElements","slice","map","photo","i","id","hrefID","maskID","othersElement","styles"],"sources":["../../../src/components/UsersStack/UsersStack.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { useId } from '../../hooks/useId';\nimport styles from './UsersStack.module.css';\n\nexport interface UsersStackProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Массив ссылок на фотографии\n   */\n  photos?: string[];\n  /**\n   * Размер аватарок\n   */\n  size?: 's' | 'm' | 'l';\n  /**\n   * Вертикальный режим рекомендуется использовать с размером `m`\n   */\n  layout?: 'vertical' | 'horizontal';\n  /**\n   * Количество аватарок, которые будут показаны.\n   * Если в массиве `photos` больше элементов и используется размер `m`, то будет показано количество остальных элементов\n   */\n  visibleCount?: number;\n  /**\n   * Число, которое будет указано в счетчике.\n   * По умолчанию высчитывается по формуле `photos.length - visibleCount`.\n   * Если число больше 99, то счетчик скроется.\n   */\n  count?: number;\n}\n\ninterface PathElementProps extends React.SVGAttributes<SVGElement> {\n  photoSize: number;\n  direction: 'circle' | 'right' | 'left';\n}\n\ntype PhotoSizeType = 16 | 24 | 32;\n\nfunction PathElement({ photoSize, direction, ...props }: PathElementProps) {\n  switch (direction) {\n    case 'circle':\n      const radius = photoSize / 2;\n\n      return <circle cx={radius} cy={radius} r={radius} {...props} />;\n\n    case 'right':\n      switch (photoSize) {\n        case 24:\n          return (\n            <path\n              d=\"M22,18.625A12 12 0 0 1 12 24A12 12 0 0 1 12 0A12 12 0 0 1 22 5.375A12 12 0 0 0 22,18.625\"\n              {...props}\n            />\n          );\n\n        default:\n          return (\n            <path\n              d=\"M30,23.75A16 16 0 0 1 16 32A16 16 0 0 1 16 0A16 16 0 0 1 30 8.25A16 16 0 0 0 30,23.75\"\n              {...props}\n            />\n          );\n      }\n\n    default:\n      switch (photoSize) {\n        case 16:\n          return (\n            <path\n              d=\"M2,13.285A8 8 0 0 0 8 16A8 8 0 0 0 8 0A8 8 0 0 0 2 2.715A8 8 0 0 1 2,13.285\"\n              {...props}\n            />\n          );\n        case 24:\n          return (\n            <path\n              d=\"M2,18.625A12 12 0 0 0 12 24A12 12 0 0 0 12 0A12 12 0 0 0 2 5.375A12 12 0 0 1 2,18.625\"\n              {...props}\n            />\n          );\n\n        default:\n          return (\n            <path\n              d=\"M2,23.75A16 16 0 0 0 16 32A16 16 0 0 0 16 0A16 16 0 0 0 2 8.25A16 16 0 0 1 2,23.75\"\n              {...props}\n            />\n          );\n      }\n  }\n}\n\nconst photoSizes: Record<NonNullable<UsersStackProps['size']>, PhotoSizeType> = {\n  s: 16,\n  m: 24,\n  l: 32,\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/UsersStack\n */\nexport const UsersStack = ({\n  photos = [],\n  visibleCount = 3,\n  count = Math.max(0, photos.length - visibleCount),\n  size = 'm',\n  layout = 'horizontal',\n  children,\n  className,\n  ...restProps\n}: UsersStackProps) => {\n  const cmpId = useId();\n\n  const canShowOthers = count > 0 && size !== 's';\n  const CounterTypography = size === 'l' ? Footnote : Caption;\n\n  const photoSize = photoSizes[size];\n  const directionClip = canShowOthers ? 'right' : 'left';\n\n  const photosElements = photos.slice(0, visibleCount).map((photo, i) => {\n    const direction = i === 0 && !canShowOthers ? 'circle' : directionClip;\n\n    const id = `UsersStackDefs${cmpId}${i}`;\n    const hrefID = `#${id}`;\n    const maskID = `UsersStackMask${cmpId}${i}`;\n\n    return (\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        className={styles['UsersStack__photo']}\n        key={i}\n        aria-hidden\n      >\n        <defs>\n          <PathElement id={id} direction={direction} photoSize={photoSize} />\n        </defs>\n        <clipPath id={maskID}>\n          <use href={hrefID} />\n        </clipPath>\n        <g clipPath={`url(#${maskID})`}>\n          <use href={hrefID} className={styles['UsersStack__fill']} />\n          <image href={photo} width={photoSize} height={photoSize} />\n          <use href={hrefID} fill=\"none\" stroke=\"rgba(0, 0, 0, 0.08)\" />\n        </g>\n      </svg>\n    );\n  });\n  const othersElement = canShowOthers ? (\n    <CounterTypography\n      caps\n      weight=\"1\"\n      className={classNames(styles['UsersStack__photo'], styles['UsersStack__photo--others'])}\n    >\n      +{count}\n    </CounterTypography>\n  ) : null;\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        styles['UsersStack'],\n        styles[`UsersStack--size-${size}`],\n        styles[`UsersStack--layout-${layout}`],\n        canShowOthers && styles['UsersStack--others'],\n        className,\n      )}\n    >\n      {(photosElements.length > 0 || othersElement) && (\n        <div className={styles['UsersStack__photos']} role=\"presentation\">\n          {photosElements}\n          {othersElement}\n        </div>\n      )}\n      {hasReactNode(children) && (\n        <Footnote className={styles['UsersStack__text']}>{children}</Footnote>\n      )}\n    </div>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,QAAQ,QAAQ,iCAAiC;AAC1D,SAASC,OAAO,QAAQ,+BAA+B;AACvD,SAASC,KAAK,QAAQ,mBAAmB;AAoCzC,SAASC,WAAW,OAAuD;EAAA,IAApDC,SAAS,QAATA,SAAS;IAAEC,SAAS,QAATA,SAAS;IAAKC,KAAK;EACnD,QAAQD,SAAS;IACf,KAAK,QAAQ;MACX,IAAME,MAAM,GAAGH,SAAS,GAAG,CAAC;MAE5B,oBAAO;QAAQ,EAAE,EAAEG,MAAO;QAAC,EAAE,EAAEA,MAAO;QAAC,CAAC,EAAEA;MAAO,GAAKD,KAAK,EAAI;IAEjE,KAAK,OAAO;MACV,QAAQF,SAAS;QACf,KAAK,EAAE;UACL,oBACE;YACE,CAAC,EAAC;UAA0F,GACxFE,KAAK,EACT;QAGN;UACE,oBACE;YACE,CAAC,EAAC;UAAuF,GACrFA,KAAK,EACT;MACF;IAGR;MACE,QAAQF,SAAS;QACf,KAAK,EAAE;UACL,oBACE;YACE,CAAC,EAAC;UAA6E,GAC3EE,KAAK,EACT;QAEN,KAAK,EAAE;UACL,oBACE;YACE,CAAC,EAAC;UAAuF,GACrFA,KAAK,EACT;QAGN;UACE,oBACE;YACE,CAAC,EAAC;UAAoF,GAClFA,KAAK,EACT;MACF;EACL;AAEP;AAEA,IAAME,UAAuE,GAAG;EAC9EC,CAAC,EAAE,EAAE;EACLC,CAAC,EAAE,EAAE;EACLC,CAAC,EAAE;AACL,CAAC;;AAED;AACA;AACA;AACA,OAAO,IAAMC,UAAU,GAAG,SAAbA,UAAU,QASA;EAAA,yBARrBC,MAAM;IAANA,MAAM,6BAAG,EAAE;IAAA,2BACXC,YAAY;IAAZA,YAAY,mCAAG,CAAC;IAAA,oBAChBC,KAAK;IAALA,KAAK,4BAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEJ,MAAM,CAACK,MAAM,GAAGJ,YAAY,CAAC;IAAA,mBACjDK,IAAI;IAAJA,IAAI,2BAAG,GAAG;IAAA,qBACVC,MAAM;IAANA,MAAM,6BAAG,YAAY;IACrBC,QAAQ,SAARA,QAAQ;IACRC,SAAS,SAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,KAAK,GAAGtB,KAAK,EAAE;EAErB,IAAMuB,aAAa,GAAGV,KAAK,GAAG,CAAC,IAAII,IAAI,KAAK,GAAG;EAC/C,IAAMO,iBAAiB,GAAGP,IAAI,KAAK,GAAG,GAAGnB,QAAQ,GAAGC,OAAO;EAE3D,IAAMG,SAAS,GAAGI,UAAU,CAACW,IAAI,CAAC;EAClC,IAAMQ,aAAa,GAAGF,aAAa,GAAG,OAAO,GAAG,MAAM;EAEtD,IAAMG,cAAc,GAAGf,MAAM,CAACgB,KAAK,CAAC,CAAC,EAAEf,YAAY,CAAC,CAACgB,GAAG,CAAC,UAACC,KAAK,EAAEC,CAAC,EAAK;IACrE,IAAM3B,SAAS,GAAG2B,CAAC,KAAK,CAAC,IAAI,CAACP,aAAa,GAAG,QAAQ,GAAGE,aAAa;IAEtE,IAAMM,EAAE,2BAAoBT,KAAK,SAAGQ,CAAC,CAAE;IACvC,IAAME,MAAM,cAAOD,EAAE,CAAE;IACvB,IAAME,MAAM,2BAAoBX,KAAK,SAAGQ,CAAC,CAAE;IAE3C,oBACE;MACE,KAAK,EAAC,4BAA4B;MAClC,SAAS,yBAA8B;MACvC,GAAG,EAAEA,CAAE;MACP;IAAW,gBAEX,+CACE,oBAAC,WAAW;MAAC,EAAE,EAAEC,EAAG;MAAC,SAAS,EAAE5B,SAAU;MAAC,SAAS,EAAED;IAAU,EAAG,CAC9D,eACP;MAAU,EAAE,EAAE+B;IAAO,gBACnB;MAAK,IAAI,EAAED;IAAO,EAAG,CACZ,eACX;MAAG,QAAQ,iBAAUC,MAAM;IAAI,gBAC7B;MAAK,IAAI,EAAED,MAAO;MAAC,SAAS;IAA6B,EAAG,eAC5D;MAAO,IAAI,EAAEH,KAAM;MAAC,KAAK,EAAE3B,SAAU;MAAC,MAAM,EAAEA;IAAU,EAAG,eAC3D;MAAK,IAAI,EAAE8B,MAAO;MAAC,IAAI,EAAC,MAAM;MAAC,MAAM,EAAC;IAAqB,EAAG,CAC5D,CACA;EAEV,CAAC,CAAC;EACF,IAAME,aAAa,GAAGX,aAAa,gBACjC,oBAAC,iBAAiB;IAChB,IAAI;IACJ,MAAM,EAAC,GAAG;IACV,SAAS,EAAE3B,UAAU;EAAmE,GACzF,GACE,EAACiB,KAAK,CACW,GAClB,IAAI;EAER,oBACE,wCACMQ,SAAS;IACb,SAAS,EAAEzB,UAAU,mBAEnBuC,MAAM,4BAAqBlB,IAAI,EAAG,EAClCkB,MAAM,8BAAuBjB,MAAM,EAAG,EACtCK,aAAa,4BAAgC,EAC7CH,SAAS;EACT,IAED,CAACM,cAAc,CAACV,MAAM,GAAG,CAAC,IAAIkB,aAAa,kBAC1C;IAAK,SAAS,0BAA+B;IAAC,IAAI,EAAC;EAAc,GAC9DR,cAAc,EACdQ,aAAa,CAEjB,EACArC,YAAY,CAACsB,QAAQ,CAAC,iBACrB,oBAAC,QAAQ;IAAC,SAAS;EAA6B,GAAEA,QAAQ,CAC3D,CACG;AAEV,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}

package/dist/components/View/View.d.ts

@@ -1,5 +1,5 @@
-import * as React from "react";
-import { NavIdProps } from "../../lib/getNavId";
+import * as React from 'react';
+import { NavIdProps } from '../../lib/getNavId';
 declare enum SwipeBackResults {
     fail = 1,
     success = 2
@@ -24,8 +24,10 @@ export interface ViewProps extends React.HTMLAttributes<HTMLElement>, NavIdProps
     onSwipeBack?(): void;
     /**
      * callback начала анимации свайпа назад.
+     *
+     * Чтобы остановить свайп назад, возвращайте `"prevent"`.
      */
-    onSwipeBackStart?(): void;
+    onSwipeBackStart?(activePanel: string | null): void | 'prevent';
     /**
      * callback завершения анимации отмененного пользователем свайпа
      */