@vkontakte/vkui 5.0.2 → 5.1.0

package/dist/components/FormItem/FormItem.js

@@ -1,15 +1,14 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "top", "bottom", "status", "Component", "removable", "onRemove", "removePlaceholder", "getRootRef", "className"];
-import * as React from "react";
-import { classNamesString } from "../../lib/classNames";
-import { useExternRef } from "../../hooks/useExternRef";
-import { hasReactNode, noop } from "../../lib/utils";
-import { Subhead } from "../Typography/Subhead/Subhead";
-import { Footnote } from "../Typography/Footnote/Footnote";
-import { useAdaptivity } from "../../hooks/useAdaptivity";
-import { Removable } from "../Removable/Removable";
-import { getSizeYClassName } from "../../helpers/getSizeYClassName";
+import * as React from 'react';
+import { classNames, hasReactNode, noop } from '@vkontakte/vkjs';
+import { useExternRef } from '../../hooks/useExternRef';
+import { Subhead } from '../Typography/Subhead/Subhead';
+import { Footnote } from '../Typography/Footnote/Footnote';
+import { useAdaptivity } from '../../hooks/useAdaptivity';
+import { Removable } from '../Removable/Removable';
+import { getSizeYClassName } from '../../helpers/getSizeYClassName';
 /**
  * @see https://vkcom.github.io/VKUI/#/FormItem
  */
@@ -18,14 +17,14 @@ export var FormItem = function FormItem(_ref) {
     top = _ref.top,
     bottom = _ref.bottom,
     _ref$status = _ref.status,
-    status = _ref$status === void 0 ? "default" : _ref$status,
+    status = _ref$status === void 0 ? 'default' : _ref$status,
     _ref$Component = _ref.Component,
-    Component = _ref$Component === void 0 ? "div" : _ref$Component,
+    Component = _ref$Component === void 0 ? 'div' : _ref$Component,
     removable = _ref.removable,
     _ref$onRemove = _ref.onRemove,
     _onRemove = _ref$onRemove === void 0 ? noop : _ref$onRemove,
     _ref$removePlaceholde = _ref.removePlaceholder,
-    removePlaceholder = _ref$removePlaceholde === void 0 ? "Удалить" : _ref$removePlaceholde,
+    removePlaceholder = _ref$removePlaceholde === void 0 ? 'Удалить' : _ref$removePlaceholde,
     getRootRef = _ref.getRootRef,
     className = _ref.className,
     restProps = _objectWithoutProperties(_ref, _excluded);
@@ -39,7 +38,7 @@ export var FormItem = function FormItem(_ref) {
   }, bottom));
   return /*#__PURE__*/React.createElement(Component, _extends({}, restProps, {
     ref: rootEl,
-    className: classNamesString("vkuiFormItem", status !== "default" && styles["FormItem--status-".concat(status)], getSizeYClassName("vkuiFormItem", sizeY), hasReactNode(top) && "vkuiFormItem--withTop", removable && "vkuiFormItem--removable", className)
+    className: classNames("vkuiFormItem", status !== 'default' && styles["FormItem--status-".concat(status)], getSizeYClassName("vkuiFormItem", sizeY), hasReactNode(top) && "vkuiFormItem--withTop", removable && "vkuiFormItem--removable", className)
   }), removable ? /*#__PURE__*/React.createElement(Removable, {
     align: "start",
     onRemove: function onRemove(e) {

package/dist/components/FormItem/FormItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormItem.js","names":["React","classNamesString","useExternRef","hasReactNode","noop","Subhead","Footnote","useAdaptivity","Removable","getSizeYClassName","FormItem","children","top","bottom","status","Component","removable","onRemove","removePlaceholder","getRootRef","className","restProps","rootEl","sizeY","wrappedChildren","styles","e","current"],"sources":["../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { HasComponent, HasRootRef } from \"../../types\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { hasReactNode, noop } from \"../../lib/utils\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { Footnote } from \"../Typography/Footnote/Footnote\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { Removable, RemovableProps } from \"../Removable/Removable\";\nimport { getSizeYClassName } from \"../../helpers/getSizeYClassName\";\nimport styles from \"./FormItem.module.css\";\n\nexport interface FormItemProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    RemovableProps {\n  top?: React.ReactNode;\n  bottom?: React.ReactNode;\n  status?: \"default\" | \"error\" | \"valid\";\n  /**\n   * Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n   */\n  removable?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormItem\n */\nexport const FormItem = ({\n  children,\n  top,\n  bottom,\n  status = \"default\",\n  Component = \"div\",\n  removable,\n  onRemove = noop,\n  removePlaceholder = \"Удалить\",\n  getRootRef,\n  className,\n  ...restProps\n}: FormItemProps) => {\n  const rootEl = useExternRef(getRootRef);\n  const { sizeY } = useAdaptivity();\n\n  const wrappedChildren = (\n    <React.Fragment>\n      {hasReactNode(top) && (\n        <Subhead className={styles[\"FormItem__top\"]}>{top}</Subhead>\n      )}\n      {children}\n      {hasReactNode(bottom) && (\n        <Footnote className={styles[\"FormItem__bottom\"]}>{bottom}</Footnote>\n      )}\n    </React.Fragment>\n  );\n\n  return (\n    <Component\n      {...restProps}\n      ref={rootEl}\n      className={classNamesString(\n        styles[\"FormItem\"],\n        status !== \"default\" && styles[`FormItem--status-${status}`],\n        getSizeYClassName(styles[\"FormItem\"], sizeY),\n        hasReactNode(top) && styles[\"FormItem--withTop\"],\n        removable && styles[\"FormItem--removable\"],\n        className\n      )}\n    >\n      {removable ? (\n        <Removable\n          align=\"start\"\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove(e, rootEl.current);\n            }\n          }}\n          removePlaceholder={removePlaceholder}\n        >\n          <div className={styles[\"FormItem__removable\"]}>{wrappedChildren}</div>\n        </Removable>\n      ) : (\n        wrappedChildren\n      )}\n    </Component>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,gBAAgB,QAAQ,sBAAsB;AACvD,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,YAAY,EAAEC,IAAI,QAAQ,iBAAiB;AACpD,SAASC,OAAO,QAAQ,+BAA+B;AACvD,SAASC,QAAQ,QAAQ,iCAAiC;AAC1D,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,SAAS,QAAwB,wBAAwB;AAClE,SAASC,iBAAiB,QAAQ,iCAAiC;AAiBnE;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAYA;EAAA,IAXnBC,QAAQ,QAARA,QAAQ;IACRC,GAAG,QAAHA,GAAG;IACHC,MAAM,QAANA,MAAM;IAAA,mBACNC,MAAM;IAANA,MAAM,4BAAG,SAAS;IAAA,sBAClBC,SAAS;IAATA,SAAS,+BAAG,KAAK;IACjBC,SAAS,QAATA,SAAS;IAAA,qBACTC,QAAQ;IAARA,SAAQ,8BAAGb,IAAI;IAAA,6BACfc,iBAAiB;IAAjBA,iBAAiB,sCAAG,SAAS;IAC7BC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,MAAM,GAAGpB,YAAY,CAACiB,UAAU,CAAC;EACvC,qBAAkBZ,aAAa,EAAE;IAAzBgB,KAAK,kBAALA,KAAK;EAEb,IAAMC,eAAe,gBACnB,oBAAC,KAAK,CAAC,QAAQ,QACZrB,YAAY,CAACS,GAAG,CAAC,iBAChB,oBAAC,OAAO;IAAC,SAAS;EAA0B,GAAEA,GAAG,CAClD,EACAD,QAAQ,EACRR,YAAY,CAACU,MAAM,CAAC,iBACnB,oBAAC,QAAQ;IAAC,SAAS;EAA6B,GAAEA,MAAM,CACzD,CAEJ;EAED,oBACE,oBAAC,SAAS,eACJQ,SAAS;IACb,GAAG,EAAEC,MAAO;IACZ,SAAS,EAAErB,gBAAgB,iBAEzBa,MAAM,KAAK,SAAS,IAAIW,MAAM,4BAAqBX,MAAM,EAAG,EAC5DL,iBAAiB,iBAAqBc,KAAK,CAAC,EAC5CpB,YAAY,CAACS,GAAG,CAAC,2BAA+B,EAChDI,SAAS,6BAAiC,EAC1CI,SAAS;EACT,IAEDJ,SAAS,gBACR,oBAAC,SAAS;IACR,KAAK,EAAC,OAAO;IACb,QAAQ,EAAE,kBAACU,CAAC,EAAK;MACf,IAAIJ,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEK,OAAO,EAAE;QACnBV,SAAQ,CAACS,CAAC,EAAEJ,MAAM,CAACK,OAAO,CAAC;MAC7B;IACF,CAAE;IACF,iBAAiB,EAAET;EAAkB,gBAErC;IAAK,SAAS;EAAgC,GAAEM,eAAe,CAAO,CAC5D,GAEZA,eACD,CACS;AAEhB,CAAC;AAAC;EAAA;EAAA;AAAA"}
+{"version":3,"file":"FormItem.js","names":["React","classNames","hasReactNode","noop","useExternRef","Subhead","Footnote","useAdaptivity","Removable","getSizeYClassName","FormItem","children","top","bottom","status","Component","removable","onRemove","removePlaceholder","getRootRef","className","restProps","rootEl","sizeY","wrappedChildren","styles","e","current"],"sources":["../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { getSizeYClassName } from '../../helpers/getSizeYClassName';\nimport styles from './FormItem.module.css';\n\nexport interface FormItemProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    RemovableProps {\n  top?: React.ReactNode;\n  bottom?: React.ReactNode;\n  status?: 'default' | 'error' | 'valid';\n  /**\n   * Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n   */\n  removable?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormItem\n */\nexport const FormItem = ({\n  children,\n  top,\n  bottom,\n  status = 'default',\n  Component = 'div',\n  removable,\n  onRemove = noop,\n  removePlaceholder = 'Удалить',\n  getRootRef,\n  className,\n  ...restProps\n}: FormItemProps) => {\n  const rootEl = useExternRef(getRootRef);\n  const { sizeY } = useAdaptivity();\n\n  const wrappedChildren = (\n    <React.Fragment>\n      {hasReactNode(top) && <Subhead className={styles['FormItem__top']}>{top}</Subhead>}\n      {children}\n      {hasReactNode(bottom) && <Footnote className={styles['FormItem__bottom']}>{bottom}</Footnote>}\n    </React.Fragment>\n  );\n\n  return (\n    <Component\n      {...restProps}\n      ref={rootEl}\n      className={classNames(\n        styles['FormItem'],\n        status !== 'default' && styles[`FormItem--status-${status}`],\n        getSizeYClassName(styles['FormItem'], sizeY),\n        hasReactNode(top) && styles['FormItem--withTop'],\n        removable && styles['FormItem--removable'],\n        className,\n      )}\n    >\n      {removable ? (\n        <Removable\n          align=\"start\"\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove(e, rootEl.current);\n            }\n          }}\n          removePlaceholder={removePlaceholder}\n        >\n          <div className={styles['FormItem__removable']}>{wrappedChildren}</div>\n        </Removable>\n      ) : (\n        wrappedChildren\n      )}\n    </Component>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,UAAU,EAAEC,YAAY,EAAEC,IAAI,QAAQ,iBAAiB;AAChE,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,OAAO,QAAQ,+BAA+B;AACvD,SAASC,QAAQ,QAAQ,iCAAiC;AAC1D,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,SAAS,QAAwB,wBAAwB;AAClE,SAASC,iBAAiB,QAAQ,iCAAiC;AAiBnE;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAYA;EAAA,IAXnBC,QAAQ,QAARA,QAAQ;IACRC,GAAG,QAAHA,GAAG;IACHC,MAAM,QAANA,MAAM;IAAA,mBACNC,MAAM;IAANA,MAAM,4BAAG,SAAS;IAAA,sBAClBC,SAAS;IAATA,SAAS,+BAAG,KAAK;IACjBC,SAAS,QAATA,SAAS;IAAA,qBACTC,QAAQ;IAARA,SAAQ,8BAAGd,IAAI;IAAA,6BACfe,iBAAiB;IAAjBA,iBAAiB,sCAAG,SAAS;IAC7BC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,MAAM,GAAGlB,YAAY,CAACe,UAAU,CAAC;EACvC,qBAAkBZ,aAAa,EAAE;IAAzBgB,KAAK,kBAALA,KAAK;EAEb,IAAMC,eAAe,gBACnB,oBAAC,KAAK,CAAC,QAAQ,QACZtB,YAAY,CAACU,GAAG,CAAC,iBAAI,oBAAC,OAAO;IAAC,SAAS;EAA0B,GAAEA,GAAG,CAAW,EACjFD,QAAQ,EACRT,YAAY,CAACW,MAAM,CAAC,iBAAI,oBAAC,QAAQ;IAAC,SAAS;EAA6B,GAAEA,MAAM,CAAY,CAEhG;EAED,oBACE,oBAAC,SAAS,eACJQ,SAAS;IACb,GAAG,EAAEC,MAAO;IACZ,SAAS,EAAErB,UAAU,iBAEnBa,MAAM,KAAK,SAAS,IAAIW,MAAM,4BAAqBX,MAAM,EAAG,EAC5DL,iBAAiB,iBAAqBc,KAAK,CAAC,EAC5CrB,YAAY,CAACU,GAAG,CAAC,2BAA+B,EAChDI,SAAS,6BAAiC,EAC1CI,SAAS;EACT,IAEDJ,SAAS,gBACR,oBAAC,SAAS;IACR,KAAK,EAAC,OAAO;IACb,QAAQ,EAAE,kBAACU,CAAC,EAAK;MACf,IAAIJ,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEK,OAAO,EAAE;QACnBV,SAAQ,CAACS,CAAC,EAAEJ,MAAM,CAACK,OAAO,CAAC;MAC7B;IACF,CAAE;IACF,iBAAiB,EAAET;EAAkB,gBAErC;IAAK,SAAS;EAAgC,GAAEM,eAAe,CAAO,CAC5D,GAEZA,eACD,CACS;AAEhB,CAAC;AAAC;EAAA;EAAA;AAAA"}

package/dist/components/FormLayout/FormLayout.d.ts

@@ -1,5 +1,5 @@
-import * as React from "react";
-import { HasComponent, HasRef } from "../../types";
+import * as React from 'react';
+import { HasComponent, HasRef } from '../../types';
 export declare type FormLayoutProps = React.AllHTMLAttributes<HTMLElement> & HasRef<HTMLElement> & HasComponent;
 /**
  * @see https://vkcom.github.io/VKUI/#/FormLayout

package/dist/components/FormLayout/FormLayout.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "Component", "getRef", "onSubmit", "className"];
-import * as React from "react";
-import { classNamesString } from "../../lib/classNames";
+import * as React from 'react';
+import { classNames } from '@vkontakte/vkjs';
 var preventDefault = function preventDefault(e) {
   return e.preventDefault();
 };
@@ -12,19 +12,19 @@ var preventDefault = function preventDefault(e) {
 export var FormLayout = function FormLayout(_ref) {
   var children = _ref.children,
     _ref$Component = _ref.Component,
-    Component = _ref$Component === void 0 ? "form" : _ref$Component,
+    Component = _ref$Component === void 0 ? 'form' : _ref$Component,
     getRef = _ref.getRef,
     _ref$onSubmit = _ref.onSubmit,
     onSubmit = _ref$onSubmit === void 0 ? preventDefault : _ref$onSubmit,
     className = _ref.className,
     restProps = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React.createElement(Component, _extends({}, restProps, {
-    className: classNamesString("vkuiFormLayout", className),
+    className: classNames("vkuiFormLayout", className),
     onSubmit: onSubmit,
     ref: getRef
   }), /*#__PURE__*/React.createElement("div", {
     className: "vkuiFormLayout__container"
-  }, children), Component === "form" && /*#__PURE__*/React.createElement("input", {
+  }, children), Component === 'form' && /*#__PURE__*/React.createElement("input", {
     type: "submit",
     className: "vkuiFormLayout__submit",
     value: ""

package/dist/components/FormLayout/FormLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormLayout.js","names":["React","classNamesString","preventDefault","e","FormLayout","children","Component","getRef","onSubmit","className","restProps"],"sources":["../../../src/components/FormLayout/FormLayout.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { HasComponent, HasRef } from \"../../types\";\nimport styles from \"./FormLayout.module.css\";\n\nconst preventDefault = (e: React.FormEvent) => e.preventDefault();\n\nexport type FormLayoutProps = React.AllHTMLAttributes<HTMLElement> &\n  HasRef<HTMLElement> &\n  HasComponent;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormLayout\n */\nexport const FormLayout = ({\n  children,\n  Component = \"form\",\n  getRef,\n  onSubmit = preventDefault,\n  className,\n  ...restProps\n}: FormLayoutProps) => {\n  return (\n    <Component\n      {...restProps}\n      className={classNamesString(styles[\"FormLayout\"], className)}\n      onSubmit={onSubmit}\n      ref={getRef}\n    >\n      <div className={styles[\"FormLayout__container\"]}>{children}</div>\n      {Component === \"form\" && (\n        <input\n          type=\"submit\"\n          className={styles[\"FormLayout__submit\"]}\n          value=\"\"\n        />\n      )}\n    </Component>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,sBAAsB;AAIvD,IAAMC,cAAc,GAAG,SAAjBA,cAAc,CAAIC,CAAkB;EAAA,OAAKA,CAAC,CAACD,cAAc,EAAE;AAAA;AAMjE;AACA;AACA;AACA,OAAO,IAAME,UAAU,GAAG,SAAbA,UAAU,OAOA;EAAA,IANrBC,QAAQ,QAARA,QAAQ;IAAA,sBACRC,SAAS;IAATA,SAAS,+BAAG,MAAM;IAClBC,MAAM,QAANA,MAAM;IAAA,qBACNC,QAAQ;IAARA,QAAQ,8BAAGN,cAAc;IACzBO,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,oBACE,oBAAC,SAAS,eACJA,SAAS;IACb,SAAS,EAAET,gBAAgB,mBAAuBQ,SAAS,CAAE;IAC7D,QAAQ,EAAED,QAAS;IACnB,GAAG,EAAED;EAAO,iBAEZ;IAAK,SAAS;EAAkC,GAAEF,QAAQ,CAAO,EAChEC,SAAS,KAAK,MAAM,iBACnB;IACE,IAAI,EAAC,QAAQ;IACb,SAAS,0BAA+B;IACxC,KAAK,EAAC;EAAE,EAEX,CACS;AAEhB,CAAC"}
+{"version":3,"file":"FormLayout.js","names":["React","classNames","preventDefault","e","FormLayout","children","Component","getRef","onSubmit","className","restProps"],"sources":["../../../src/components/FormLayout/FormLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasComponent, HasRef } from '../../types';\nimport styles from './FormLayout.module.css';\n\nconst preventDefault = (e: React.FormEvent) => e.preventDefault();\n\nexport type FormLayoutProps = React.AllHTMLAttributes<HTMLElement> &\n  HasRef<HTMLElement> &\n  HasComponent;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormLayout\n */\nexport const FormLayout = ({\n  children,\n  Component = 'form',\n  getRef,\n  onSubmit = preventDefault,\n  className,\n  ...restProps\n}: FormLayoutProps) => {\n  return (\n    <Component\n      {...restProps}\n      className={classNames(styles['FormLayout'], className)}\n      onSubmit={onSubmit}\n      ref={getRef}\n    >\n      <div className={styles['FormLayout__container']}>{children}</div>\n      {Component === 'form' && (\n        <input type=\"submit\" className={styles['FormLayout__submit']} value=\"\" />\n      )}\n    </Component>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAI5C,IAAMC,cAAc,GAAG,SAAjBA,cAAc,CAAIC,CAAkB;EAAA,OAAKA,CAAC,CAACD,cAAc,EAAE;AAAA;AAMjE;AACA;AACA;AACA,OAAO,IAAME,UAAU,GAAG,SAAbA,UAAU,OAOA;EAAA,IANrBC,QAAQ,QAARA,QAAQ;IAAA,sBACRC,SAAS;IAATA,SAAS,+BAAG,MAAM;IAClBC,MAAM,QAANA,MAAM;IAAA,qBACNC,QAAQ;IAARA,QAAQ,8BAAGN,cAAc;IACzBO,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,oBACE,oBAAC,SAAS,eACJA,SAAS;IACb,SAAS,EAAET,UAAU,mBAAuBQ,SAAS,CAAE;IACvD,QAAQ,EAAED,QAAS;IACnB,GAAG,EAAED;EAAO,iBAEZ;IAAK,SAAS;EAAkC,GAAEF,QAAQ,CAAO,EAChEC,SAAS,KAAK,MAAM,iBACnB;IAAO,IAAI,EAAC,QAAQ;IAAC,SAAS,0BAA+B;IAAC,KAAK,EAAC;EAAE,EACvE,CACS;AAEhB,CAAC"}

package/dist/components/FormLayoutGroup/FormLayoutGroup.d.ts

@@ -1,8 +1,8 @@
-import * as React from "react";
-import { HasRootRef } from "../../types";
-import { RemovableProps } from "../Removable/Removable";
+import * as React from 'react';
+import { HasRootRef } from '../../types';
+import { RemovableProps } from '../Removable/Removable';
 export interface FormLayoutGroupProps extends React.HTMLAttributes<HTMLDivElement>, RemovableProps, HasRootRef<HTMLDivElement> {
-    mode?: "vertical" | "horizontal";
+    mode?: 'vertical' | 'horizontal';
     /**
      * Только для режима horizontal. Дает возможность удалить всю группу `FormItem`.
      */

package/dist/components/FormLayoutGroup/FormLayoutGroup.js

@@ -1,24 +1,23 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "mode", "removable", "segmented", "removePlaceholder", "onRemove", "getRootRef", "className"];
-import * as React from "react";
-import { classNamesString } from "../../lib/classNames";
-import { noop } from "../../lib/utils";
-import { useExternRef } from "../../hooks/useExternRef";
-import { Removable } from "../Removable/Removable";
-import { useAdaptivity } from "../../hooks/useAdaptivity";
-import { getSizeYClassName } from "../../helpers/getSizeYClassName";
+import * as React from 'react';
+import { classNames, noop } from '@vkontakte/vkjs';
+import { useExternRef } from '../../hooks/useExternRef';
+import { Removable } from '../Removable/Removable';
+import { useAdaptivity } from '../../hooks/useAdaptivity';
+import { getSizeYClassName } from '../../helpers/getSizeYClassName';
 /**
  * @see https://vkcom.github.io/VKUI/#/FormLayoutGroup
  */
 export var FormLayoutGroup = function FormLayoutGroup(_ref) {
   var children = _ref.children,
     _ref$mode = _ref.mode,
-    mode = _ref$mode === void 0 ? "vertical" : _ref$mode,
+    mode = _ref$mode === void 0 ? 'vertical' : _ref$mode,
     removable = _ref.removable,
     segmented = _ref.segmented,
     _ref$removePlaceholde = _ref.removePlaceholder,
-    removePlaceholder = _ref$removePlaceholde === void 0 ? "Удалить" : _ref$removePlaceholde,
+    removePlaceholder = _ref$removePlaceholde === void 0 ? 'Удалить' : _ref$removePlaceholde,
     _ref$onRemove = _ref.onRemove,
     _onRemove = _ref$onRemove === void 0 ? noop : _ref$onRemove,
     getRootRef = _ref.getRootRef,
@@ -26,12 +25,12 @@ export var FormLayoutGroup = function FormLayoutGroup(_ref) {
     restProps = _objectWithoutProperties(_ref, _excluded);
   var _useAdaptivity = useAdaptivity(),
     sizeY = _useAdaptivity.sizeY;
-  var isRemovable = removable && mode === "horizontal";
-  var isSegmented = segmented && mode === "horizontal";
+  var isRemovable = removable && mode === 'horizontal';
+  var isSegmented = segmented && mode === 'horizontal';
   var rootEl = useExternRef(getRootRef);
   return /*#__PURE__*/React.createElement("div", _extends({
     ref: rootEl,
-    className: classNamesString("vkuiFormLayoutGroup", getSizeYClassName("vkuiFormLayoutGroup", sizeY), styles["FormLayoutGroup--mode-".concat(mode)], isRemovable && "vkuiFormLayoutGroup--removable", isSegmented && "vkuiFormLayoutGroup--segmented", className)
+    className: classNames("vkuiFormLayoutGroup", getSizeYClassName("vkuiFormLayoutGroup", sizeY), styles["FormLayoutGroup--mode-".concat(mode)], isRemovable && "vkuiFormLayoutGroup--removable", isSegmented && "vkuiFormLayoutGroup--segmented", className)
   }, restProps), isRemovable ? /*#__PURE__*/React.createElement(Removable, {
     className: "vkuiFormLayoutGroup__removable",
     align: "start",

package/dist/components/FormLayoutGroup/FormLayoutGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormLayoutGroup.js","names":["React","classNamesString","noop","useExternRef","Removable","useAdaptivity","getSizeYClassName","FormLayoutGroup","children","mode","removable","segmented","removePlaceholder","onRemove","getRootRef","className","restProps","sizeY","isRemovable","isSegmented","rootEl","styles","e","current"],"sources":["../../../src/components/FormLayoutGroup/FormLayoutGroup.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { HasRootRef } from \"../../types\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { noop } from \"../../lib/utils\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { Removable, RemovableProps } from \"../Removable/Removable\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { getSizeYClassName } from \"../../helpers/getSizeYClassName\";\nimport styles from \"./FormLayoutGroup.module.css\";\n\nexport interface FormLayoutGroupProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  mode?: \"vertical\" | \"horizontal\";\n  /**\n   * Только для режима horizontal. Дает возможность удалить всю группу `FormItem`.\n   */\n  removable?: boolean;\n\n  /**\n   * Только для режима horizontal. Дает возможность склеить несколько `FormItem`.\n   */\n  segmented?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormLayoutGroup\n */\nexport const FormLayoutGroup = ({\n  children,\n  mode = \"vertical\",\n  removable,\n  segmented,\n  removePlaceholder = \"Удалить\",\n  onRemove = noop,\n  getRootRef,\n  className,\n  ...restProps\n}: FormLayoutGroupProps) => {\n  const { sizeY } = useAdaptivity();\n  const isRemovable = removable && mode === \"horizontal\";\n  const isSegmented = segmented && mode === \"horizontal\";\n  const rootEl = useExternRef(getRootRef);\n\n  return (\n    <div\n      ref={rootEl}\n      className={classNamesString(\n        styles[\"FormLayoutGroup\"],\n        getSizeYClassName(styles[\"FormLayoutGroup\"], sizeY),\n        styles[`FormLayoutGroup--mode-${mode}`],\n        isRemovable && styles[\"FormLayoutGroup--removable\"],\n        isSegmented && styles[\"FormLayoutGroup--segmented\"],\n        className\n      )}\n      {...restProps}\n    >\n      {isRemovable ? (\n        <Removable\n          className={styles[\"FormLayoutGroup__removable\"]}\n          align=\"start\"\n          removePlaceholder={removePlaceholder}\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove(e, rootEl.current);\n            }\n          }}\n        >\n          {children}\n        </Removable>\n      ) : (\n        <React.Fragment>\n          {children}\n          <span className={styles[\"FormLayoutGroup__offset\"]} aria-hidden />\n        </React.Fragment>\n      )}\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,gBAAgB,QAAQ,sBAAsB;AACvD,SAASC,IAAI,QAAQ,iBAAiB;AACtC,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,SAAS,QAAwB,wBAAwB;AAClE,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,iBAAiB,QAAQ,iCAAiC;AAmBnE;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAe,OAUA;EAAA,IAT1BC,QAAQ,QAARA,QAAQ;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAG,UAAU;IACjBC,SAAS,QAATA,SAAS;IACTC,SAAS,QAATA,SAAS;IAAA,6BACTC,iBAAiB;IAAjBA,iBAAiB,sCAAG,SAAS;IAAA,qBAC7BC,QAAQ;IAARA,SAAQ,8BAAGX,IAAI;IACfY,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,qBAAkBX,aAAa,EAAE;IAAzBY,KAAK,kBAALA,KAAK;EACb,IAAMC,WAAW,GAAGR,SAAS,IAAID,IAAI,KAAK,YAAY;EACtD,IAAMU,WAAW,GAAGR,SAAS,IAAIF,IAAI,KAAK,YAAY;EACtD,IAAMW,MAAM,GAAGjB,YAAY,CAACW,UAAU,CAAC;EAEvC,oBACE;IACE,GAAG,EAAEM,MAAO;IACZ,SAAS,EAAEnB,gBAAgB,wBAEzBK,iBAAiB,wBAA4BW,KAAK,CAAC,EACnDI,MAAM,iCAA0BZ,IAAI,EAAG,EACvCS,WAAW,oCAAwC,EACnDC,WAAW,oCAAwC,EACnDJ,SAAS;EACT,GACEC,SAAS,GAEZE,WAAW,gBACV,oBAAC,SAAS;IACR,SAAS,kCAAuC;IAChD,KAAK,EAAC,OAAO;IACb,iBAAiB,EAAEN,iBAAkB;IACrC,QAAQ,EAAE,kBAACU,CAAC,EAAK;MACf,IAAIF,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEG,OAAO,EAAE;QACnBV,SAAQ,CAACS,CAAC,EAAEF,MAAM,CAACG,OAAO,CAAC;MAC7B;IACF;EAAE,GAEDf,QAAQ,CACC,gBAEZ,oBAAC,KAAK,CAAC,QAAQ,QACZA,QAAQ,eACT;IAAM,SAAS,+BAAoC;IAAC;EAAW,EAAG,CAErE,CACG;AAEV,CAAC;AAAC;EAAA;EAAA;AAAA"}
+{"version":3,"file":"FormLayoutGroup.js","names":["React","classNames","noop","useExternRef","Removable","useAdaptivity","getSizeYClassName","FormLayoutGroup","children","mode","removable","segmented","removePlaceholder","onRemove","getRootRef","className","restProps","sizeY","isRemovable","isSegmented","rootEl","styles","e","current"],"sources":["../../../src/components/FormLayoutGroup/FormLayoutGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { HasRootRef } from '../../types';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { getSizeYClassName } from '../../helpers/getSizeYClassName';\nimport styles from './FormLayoutGroup.module.css';\n\nexport interface FormLayoutGroupProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  mode?: 'vertical' | 'horizontal';\n  /**\n   * Только для режима horizontal. Дает возможность удалить всю группу `FormItem`.\n   */\n  removable?: boolean;\n\n  /**\n   * Только для режима horizontal. Дает возможность склеить несколько `FormItem`.\n   */\n  segmented?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormLayoutGroup\n */\nexport const FormLayoutGroup = ({\n  children,\n  mode = 'vertical',\n  removable,\n  segmented,\n  removePlaceholder = 'Удалить',\n  onRemove = noop,\n  getRootRef,\n  className,\n  ...restProps\n}: FormLayoutGroupProps) => {\n  const { sizeY } = useAdaptivity();\n  const isRemovable = removable && mode === 'horizontal';\n  const isSegmented = segmented && mode === 'horizontal';\n  const rootEl = useExternRef(getRootRef);\n\n  return (\n    <div\n      ref={rootEl}\n      className={classNames(\n        styles['FormLayoutGroup'],\n        getSizeYClassName(styles['FormLayoutGroup'], sizeY),\n        styles[`FormLayoutGroup--mode-${mode}`],\n        isRemovable && styles['FormLayoutGroup--removable'],\n        isSegmented && styles['FormLayoutGroup--segmented'],\n        className,\n      )}\n      {...restProps}\n    >\n      {isRemovable ? (\n        <Removable\n          className={styles['FormLayoutGroup__removable']}\n          align=\"start\"\n          removePlaceholder={removePlaceholder}\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove(e, rootEl.current);\n            }\n          }}\n        >\n          {children}\n        </Removable>\n      ) : (\n        <React.Fragment>\n          {children}\n          <span className={styles['FormLayoutGroup__offset']} aria-hidden />\n        </React.Fragment>\n      )}\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,UAAU,EAAEC,IAAI,QAAQ,iBAAiB;AAClD,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,SAAS,QAAwB,wBAAwB;AAClE,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,iBAAiB,QAAQ,iCAAiC;AAmBnE;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAe,OAUA;EAAA,IAT1BC,QAAQ,QAARA,QAAQ;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAG,UAAU;IACjBC,SAAS,QAATA,SAAS;IACTC,SAAS,QAATA,SAAS;IAAA,6BACTC,iBAAiB;IAAjBA,iBAAiB,sCAAG,SAAS;IAAA,qBAC7BC,QAAQ;IAARA,SAAQ,8BAAGX,IAAI;IACfY,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,qBAAkBX,aAAa,EAAE;IAAzBY,KAAK,kBAALA,KAAK;EACb,IAAMC,WAAW,GAAGR,SAAS,IAAID,IAAI,KAAK,YAAY;EACtD,IAAMU,WAAW,GAAGR,SAAS,IAAIF,IAAI,KAAK,YAAY;EACtD,IAAMW,MAAM,GAAGjB,YAAY,CAACW,UAAU,CAAC;EAEvC,oBACE;IACE,GAAG,EAAEM,MAAO;IACZ,SAAS,EAAEnB,UAAU,wBAEnBK,iBAAiB,wBAA4BW,KAAK,CAAC,EACnDI,MAAM,iCAA0BZ,IAAI,EAAG,EACvCS,WAAW,oCAAwC,EACnDC,WAAW,oCAAwC,EACnDJ,SAAS;EACT,GACEC,SAAS,GAEZE,WAAW,gBACV,oBAAC,SAAS;IACR,SAAS,kCAAuC;IAChD,KAAK,EAAC,OAAO;IACb,iBAAiB,EAAEN,iBAAkB;IACrC,QAAQ,EAAE,kBAACU,CAAC,EAAK;MACf,IAAIF,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEG,OAAO,EAAE;QACnBV,SAAQ,CAACS,CAAC,EAAEF,MAAM,CAACG,OAAO,CAAC;MAC7B;IACF;EAAE,GAEDf,QAAQ,CACC,gBAEZ,oBAAC,KAAK,CAAC,QAAQ,QACZA,QAAQ,eACT;IAAM,SAAS,+BAAoC;IAAC;EAAW,EAAG,CAErE,CACG;AAEV,CAAC;AAAC;EAAA;EAAA;AAAA"}

package/dist/components/FormStatus/FormStatus.d.ts

@@ -1,6 +1,6 @@
-import * as React from "react";
+import * as React from 'react';
 export interface FormStatusProps extends React.HTMLAttributes<HTMLDivElement> {
-    mode?: "default" | "error";
+    mode?: 'default' | 'error';
     header?: React.ReactNode;
 }
 /**

package/dist/components/FormStatus/FormStatus.js

@@ -1,9 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["mode", "children", "className"];
-import * as React from "react";
-import { classNamesString } from "../../lib/classNames";
-import { Banner } from "../Banner/Banner";
+import * as React from 'react';
+import { classNames } from '@vkontakte/vkjs';
+import { Banner } from '../Banner/Banner';
 /**
  * @see https://vkcom.github.io/VKUI/#/FormStatus
  */
@@ -14,7 +14,7 @@ export var FormStatus = function FormStatus(_ref) {
     restProps = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React.createElement(Banner, _extends({}, restProps, {
     subheader: children,
-    className: classNamesString("vkuiFormStatus", mode === "error" && "vkuiFormStatus--mode-error", className)
+    className: classNames("vkuiFormStatus", mode === 'error' && "vkuiFormStatus--mode-error", className)
   }));
 };
 //# sourceMappingURL=FormStatus.js.map

package/dist/components/FormStatus/FormStatus.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormStatus.js","names":["React","classNamesString","Banner","FormStatus","mode","children","className","restProps"],"sources":["../../../src/components/FormStatus/FormStatus.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { Banner } from \"../Banner/Banner\";\nimport styles from \"./FormStatus.module.css\";\n\nexport interface FormStatusProps extends React.HTMLAttributes<HTMLDivElement> {\n  mode?: \"default\" | \"error\";\n  header?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormStatus\n */\nexport const FormStatus = ({\n  mode,\n  children,\n  className,\n  ...restProps\n}: FormStatusProps) => {\n  return (\n    <Banner\n      {...restProps}\n      subheader={children}\n      className={classNamesString(\n        styles[\"FormStatus\"],\n        mode === \"error\" && styles[\"FormStatus--mode-error\"],\n        className\n      )}\n    />\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,sBAAsB;AACvD,SAASC,MAAM,QAAQ,kBAAkB;AAQzC;AACA;AACA;AACA,OAAO,IAAMC,UAAU,GAAG,SAAbA,UAAU,OAKA;EAAA,IAJrBC,IAAI,QAAJA,IAAI;IACJC,QAAQ,QAARA,QAAQ;IACRC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,oBACE,oBAAC,MAAM,eACDA,SAAS;IACb,SAAS,EAAEF,QAAS;IACpB,SAAS,EAAEJ,gBAAgB,mBAEzBG,IAAI,KAAK,OAAO,gCAAoC,EACpDE,SAAS;EACT,GACF;AAEN,CAAC"}
+{"version":3,"file":"FormStatus.js","names":["React","classNames","Banner","FormStatus","mode","children","className","restProps"],"sources":["../../../src/components/FormStatus/FormStatus.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { Banner } from '../Banner/Banner';\nimport styles from './FormStatus.module.css';\n\nexport interface FormStatusProps extends React.HTMLAttributes<HTMLDivElement> {\n  mode?: 'default' | 'error';\n  header?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormStatus\n */\nexport const FormStatus = ({ mode, children, className, ...restProps }: FormStatusProps) => {\n  return (\n    <Banner\n      {...restProps}\n      subheader={children}\n      className={classNames(\n        styles['FormStatus'],\n        mode === 'error' && styles['FormStatus--mode-error'],\n        className,\n      )}\n    />\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,MAAM,QAAQ,kBAAkB;AAQzC;AACA;AACA;AACA,OAAO,IAAMC,UAAU,GAAG,SAAbA,UAAU,OAAqE;EAAA,IAA/DC,IAAI,QAAJA,IAAI;IAAEC,QAAQ,QAARA,QAAQ;IAAEC,SAAS,QAATA,SAAS;IAAKC,SAAS;EAClE,oBACE,oBAAC,MAAM,eACDA,SAAS;IACb,SAAS,EAAEF,QAAS;IACpB,SAAS,EAAEJ,UAAU,mBAEnBG,IAAI,KAAK,OAAO,gCAAoC,EACpDE,SAAS;EACT,GACF;AAEN,CAAC"}

package/dist/components/Gallery/Gallery.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { BaseGalleryProps } from "../BaseGallery/types";
+import { BaseGalleryProps } from '../BaseGallery/types';
 export interface GalleryProps extends BaseGalleryProps {
     initialSlideIndex?: number;
     timeout?: number;

package/dist/components/Gallery/Gallery.js

@@ -2,10 +2,10 @@ import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["initialSlideIndex", "children", "timeout", "onChange", "bullets"];
-import * as React from "react";
-import { clamp } from "../../helpers/math";
-import { useTimeout } from "../../hooks/useTimeout";
-import { BaseGallery } from "../BaseGallery/BaseGallery";
+import * as React from 'react';
+import { clamp } from '../../helpers/math';
+import { useTimeout } from '../../hooks/useTimeout';
+import { BaseGallery } from '../BaseGallery/BaseGallery';
 /**
  * @see https://vkcom.github.io/VKUI/#/Gallery
  */
@@ -23,7 +23,7 @@ export var Gallery = function Gallery(_ref) {
     _React$useState2 = _slicedToArray(_React$useState, 2),
     localSlideIndex = _React$useState2[0],
     setSlideIndex = _React$useState2[1];
-  var isControlled = typeof props.slideIndex === "number";
+  var isControlled = typeof props.slideIndex === 'number';
   var slideIndex = isControlled ? (_props$slideIndex = props.slideIndex) !== null && _props$slideIndex !== void 0 ? _props$slideIndex : 0 : localSlideIndex;
   var isDraggable = !isControlled || Boolean(onChange);
   var slides = React.useMemo(function () {

package/dist/components/Gallery/Gallery.js.map

@@ -1 +1 @@
-{"version":3,"file":"Gallery.js","names":["React","clamp","useTimeout","BaseGallery","Gallery","initialSlideIndex","children","timeout","onChange","bullets","props","useState","localSlideIndex","setSlideIndex","isControlled","slideIndex","isDraggable","Boolean","slides","useMemo","Children","toArray","filter","item","childCount","length","handleChange","useCallback","current","autoplay","useEffect","set","clear","safeSlideIndex"],"sources":["../../../src/components/Gallery/Gallery.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { clamp } from \"../../helpers/math\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { BaseGallery } from \"../BaseGallery/BaseGallery\";\nimport { BaseGalleryProps } from \"../BaseGallery/types\";\n\nexport interface GalleryProps extends BaseGalleryProps {\n  initialSlideIndex?: number;\n  timeout?: number;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Gallery\n */\nexport const Gallery = ({\n  initialSlideIndex = 0,\n  children,\n  timeout = 0,\n  onChange,\n  bullets,\n  ...props\n}: GalleryProps) => {\n  const [localSlideIndex, setSlideIndex] = React.useState(initialSlideIndex);\n  const isControlled = typeof props.slideIndex === \"number\";\n  const slideIndex = isControlled ? props.slideIndex ?? 0 : localSlideIndex;\n  const isDraggable = !isControlled || Boolean(onChange);\n  const slides = React.useMemo(\n    () => React.Children.toArray(children).filter((item) => Boolean(item)),\n    [children]\n  );\n  const childCount = slides.length;\n\n  const handleChange: GalleryProps[\"onChange\"] = React.useCallback(\n    (current: number) => {\n      if (current === slideIndex) {\n        return;\n      }\n      !isControlled && setSlideIndex(current);\n      onChange && onChange(current);\n    },\n    [isControlled, onChange, slideIndex]\n  );\n\n  const autoplay = useTimeout(\n    () => handleChange((slideIndex + 1) % childCount),\n    timeout\n  );\n  React.useEffect(\n    () => (timeout ? autoplay.set() : autoplay.clear()),\n    [timeout, slideIndex, autoplay]\n  );\n\n  // prevent invalid slideIndex\n  // any slide index is invalid with no slides, just keep it as is\n  const safeSlideIndex =\n    childCount > 0 ? clamp(slideIndex, 0, childCount - 1) : slideIndex;\n  // notify parent in controlled mode\n  React.useEffect(() => {\n    if (onChange && safeSlideIndex !== slideIndex) {\n      onChange(safeSlideIndex);\n    }\n    setSlideIndex(safeSlideIndex);\n  }, [onChange, safeSlideIndex, slideIndex]);\n\n  return (\n    <BaseGallery\n      isDraggable={isDraggable}\n      {...props}\n      bullets={childCount > 0 && bullets}\n      slideIndex={safeSlideIndex}\n      onChange={handleChange}\n    >\n      {slides}\n    </BaseGallery>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,KAAK,QAAQ,oBAAoB;AAC1C,SAASC,UAAU,QAAQ,wBAAwB;AACnD,SAASC,WAAW,QAAQ,4BAA4B;AAQxD;AACA;AACA;AACA,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAO,OAOA;EAAA;EAAA,iCANlBC,iBAAiB;IAAjBA,iBAAiB,sCAAG,CAAC;IACrBC,QAAQ,QAARA,QAAQ;IAAA,oBACRC,OAAO;IAAPA,OAAO,6BAAG,CAAC;IACXC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACJC,KAAK;EAER,sBAAyCV,KAAK,CAACW,QAAQ,CAACN,iBAAiB,CAAC;IAAA;IAAnEO,eAAe;IAAEC,aAAa;EACrC,IAAMC,YAAY,GAAG,OAAOJ,KAAK,CAACK,UAAU,KAAK,QAAQ;EACzD,IAAMA,UAAU,GAAGD,YAAY,wBAAGJ,KAAK,CAACK,UAAU,iEAAI,CAAC,GAAGH,eAAe;EACzE,IAAMI,WAAW,GAAG,CAACF,YAAY,IAAIG,OAAO,CAACT,QAAQ,CAAC;EACtD,IAAMU,MAAM,GAAGlB,KAAK,CAACmB,OAAO,CAC1B;IAAA,OAAMnB,KAAK,CAACoB,QAAQ,CAACC,OAAO,CAACf,QAAQ,CAAC,CAACgB,MAAM,CAAC,UAACC,IAAI;MAAA,OAAKN,OAAO,CAACM,IAAI,CAAC;IAAA,EAAC;EAAA,GACtE,CAACjB,QAAQ,CAAC,CACX;EACD,IAAMkB,UAAU,GAAGN,MAAM,CAACO,MAAM;EAEhC,IAAMC,YAAsC,GAAG1B,KAAK,CAAC2B,WAAW,CAC9D,UAACC,OAAe,EAAK;IACnB,IAAIA,OAAO,KAAKb,UAAU,EAAE;MAC1B;IACF;IACA,CAACD,YAAY,IAAID,aAAa,CAACe,OAAO,CAAC;IACvCpB,QAAQ,IAAIA,QAAQ,CAACoB,OAAO,CAAC;EAC/B,CAAC,EACD,CAACd,YAAY,EAAEN,QAAQ,EAAEO,UAAU,CAAC,CACrC;EAED,IAAMc,QAAQ,GAAG3B,UAAU,CACzB;IAAA,OAAMwB,YAAY,CAAC,CAACX,UAAU,GAAG,CAAC,IAAIS,UAAU,CAAC;EAAA,GACjDjB,OAAO,CACR;EACDP,KAAK,CAAC8B,SAAS,CACb;IAAA,OAAOvB,OAAO,GAAGsB,QAAQ,CAACE,GAAG,EAAE,GAAGF,QAAQ,CAACG,KAAK,EAAE;EAAA,CAAC,EACnD,CAACzB,OAAO,EAAEQ,UAAU,EAAEc,QAAQ,CAAC,CAChC;;EAED;EACA;EACA,IAAMI,cAAc,GAClBT,UAAU,GAAG,CAAC,GAAGvB,KAAK,CAACc,UAAU,EAAE,CAAC,EAAES,UAAU,GAAG,CAAC,CAAC,GAAGT,UAAU;EACpE;EACAf,KAAK,CAAC8B,SAAS,CAAC,YAAM;IACpB,IAAItB,QAAQ,IAAIyB,cAAc,KAAKlB,UAAU,EAAE;MAC7CP,QAAQ,CAACyB,cAAc,CAAC;IAC1B;IACApB,aAAa,CAACoB,cAAc,CAAC;EAC/B,CAAC,EAAE,CAACzB,QAAQ,EAAEyB,cAAc,EAAElB,UAAU,CAAC,CAAC;EAE1C,oBACE,oBAAC,WAAW;IACV,WAAW,EAAEC;EAAY,GACrBN,KAAK;IACT,OAAO,EAAEc,UAAU,GAAG,CAAC,IAAIf,OAAQ;IACnC,UAAU,EAAEwB,cAAe;IAC3B,QAAQ,EAAEP;EAAa,IAEtBR,MAAM,CACK;AAElB,CAAC"}
+{"version":3,"file":"Gallery.js","names":["React","clamp","useTimeout","BaseGallery","Gallery","initialSlideIndex","children","timeout","onChange","bullets","props","useState","localSlideIndex","setSlideIndex","isControlled","slideIndex","isDraggable","Boolean","slides","useMemo","Children","toArray","filter","item","childCount","length","handleChange","useCallback","current","autoplay","useEffect","set","clear","safeSlideIndex"],"sources":["../../../src/components/Gallery/Gallery.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clamp } from '../../helpers/math';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { BaseGallery } from '../BaseGallery/BaseGallery';\nimport { BaseGalleryProps } from '../BaseGallery/types';\n\nexport interface GalleryProps extends BaseGalleryProps {\n  initialSlideIndex?: number;\n  timeout?: number;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Gallery\n */\nexport const Gallery = ({\n  initialSlideIndex = 0,\n  children,\n  timeout = 0,\n  onChange,\n  bullets,\n  ...props\n}: GalleryProps) => {\n  const [localSlideIndex, setSlideIndex] = React.useState(initialSlideIndex);\n  const isControlled = typeof props.slideIndex === 'number';\n  const slideIndex = isControlled ? props.slideIndex ?? 0 : localSlideIndex;\n  const isDraggable = !isControlled || Boolean(onChange);\n  const slides = React.useMemo(\n    () => React.Children.toArray(children).filter((item) => Boolean(item)),\n    [children],\n  );\n  const childCount = slides.length;\n\n  const handleChange: GalleryProps['onChange'] = React.useCallback(\n    (current: number) => {\n      if (current === slideIndex) {\n        return;\n      }\n      !isControlled && setSlideIndex(current);\n      onChange && onChange(current);\n    },\n    [isControlled, onChange, slideIndex],\n  );\n\n  const autoplay = useTimeout(() => handleChange((slideIndex + 1) % childCount), timeout);\n  React.useEffect(\n    () => (timeout ? autoplay.set() : autoplay.clear()),\n    [timeout, slideIndex, autoplay],\n  );\n\n  // prevent invalid slideIndex\n  // any slide index is invalid with no slides, just keep it as is\n  const safeSlideIndex = childCount > 0 ? clamp(slideIndex, 0, childCount - 1) : slideIndex;\n  // notify parent in controlled mode\n  React.useEffect(() => {\n    if (onChange && safeSlideIndex !== slideIndex) {\n      onChange(safeSlideIndex);\n    }\n    setSlideIndex(safeSlideIndex);\n  }, [onChange, safeSlideIndex, slideIndex]);\n\n  return (\n    <BaseGallery\n      isDraggable={isDraggable}\n      {...props}\n      bullets={childCount > 0 && bullets}\n      slideIndex={safeSlideIndex}\n      onChange={handleChange}\n    >\n      {slides}\n    </BaseGallery>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,KAAK,QAAQ,oBAAoB;AAC1C,SAASC,UAAU,QAAQ,wBAAwB;AACnD,SAASC,WAAW,QAAQ,4BAA4B;AAQxD;AACA;AACA;AACA,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAO,OAOA;EAAA;EAAA,iCANlBC,iBAAiB;IAAjBA,iBAAiB,sCAAG,CAAC;IACrBC,QAAQ,QAARA,QAAQ;IAAA,oBACRC,OAAO;IAAPA,OAAO,6BAAG,CAAC;IACXC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACJC,KAAK;EAER,sBAAyCV,KAAK,CAACW,QAAQ,CAACN,iBAAiB,CAAC;IAAA;IAAnEO,eAAe;IAAEC,aAAa;EACrC,IAAMC,YAAY,GAAG,OAAOJ,KAAK,CAACK,UAAU,KAAK,QAAQ;EACzD,IAAMA,UAAU,GAAGD,YAAY,wBAAGJ,KAAK,CAACK,UAAU,iEAAI,CAAC,GAAGH,eAAe;EACzE,IAAMI,WAAW,GAAG,CAACF,YAAY,IAAIG,OAAO,CAACT,QAAQ,CAAC;EACtD,IAAMU,MAAM,GAAGlB,KAAK,CAACmB,OAAO,CAC1B;IAAA,OAAMnB,KAAK,CAACoB,QAAQ,CAACC,OAAO,CAACf,QAAQ,CAAC,CAACgB,MAAM,CAAC,UAACC,IAAI;MAAA,OAAKN,OAAO,CAACM,IAAI,CAAC;IAAA,EAAC;EAAA,GACtE,CAACjB,QAAQ,CAAC,CACX;EACD,IAAMkB,UAAU,GAAGN,MAAM,CAACO,MAAM;EAEhC,IAAMC,YAAsC,GAAG1B,KAAK,CAAC2B,WAAW,CAC9D,UAACC,OAAe,EAAK;IACnB,IAAIA,OAAO,KAAKb,UAAU,EAAE;MAC1B;IACF;IACA,CAACD,YAAY,IAAID,aAAa,CAACe,OAAO,CAAC;IACvCpB,QAAQ,IAAIA,QAAQ,CAACoB,OAAO,CAAC;EAC/B,CAAC,EACD,CAACd,YAAY,EAAEN,QAAQ,EAAEO,UAAU,CAAC,CACrC;EAED,IAAMc,QAAQ,GAAG3B,UAAU,CAAC;IAAA,OAAMwB,YAAY,CAAC,CAACX,UAAU,GAAG,CAAC,IAAIS,UAAU,CAAC;EAAA,GAAEjB,OAAO,CAAC;EACvFP,KAAK,CAAC8B,SAAS,CACb;IAAA,OAAOvB,OAAO,GAAGsB,QAAQ,CAACE,GAAG,EAAE,GAAGF,QAAQ,CAACG,KAAK,EAAE;EAAA,CAAC,EACnD,CAACzB,OAAO,EAAEQ,UAAU,EAAEc,QAAQ,CAAC,CAChC;;EAED;EACA;EACA,IAAMI,cAAc,GAAGT,UAAU,GAAG,CAAC,GAAGvB,KAAK,CAACc,UAAU,EAAE,CAAC,EAAES,UAAU,GAAG,CAAC,CAAC,GAAGT,UAAU;EACzF;EACAf,KAAK,CAAC8B,SAAS,CAAC,YAAM;IACpB,IAAItB,QAAQ,IAAIyB,cAAc,KAAKlB,UAAU,EAAE;MAC7CP,QAAQ,CAACyB,cAAc,CAAC;IAC1B;IACApB,aAAa,CAACoB,cAAc,CAAC;EAC/B,CAAC,EAAE,CAACzB,QAAQ,EAAEyB,cAAc,EAAElB,UAAU,CAAC,CAAC;EAE1C,oBACE,oBAAC,WAAW;IACV,WAAW,EAAEC;EAAY,GACrBN,KAAK;IACT,OAAO,EAAEc,UAAU,GAAG,CAAC,IAAIf,OAAQ;IACnC,UAAU,EAAEwB,cAAe;IAC3B,QAAQ,EAAEP;EAAa,IAEtBR,MAAM,CACK;AAElB,CAAC"}

package/dist/components/Gradient/Gradient.d.ts

@@ -1,13 +1,13 @@
-import * as React from "react";
+import * as React from 'react';
 export interface GradientProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * Тип градиента
      */
-    mode?: "tint" | "white" | "black";
+    mode?: 'tint' | 'white' | 'black';
     /**
      * Направление градиента
      */
-    to?: "top" | "bottom";
+    to?: 'top' | 'bottom';
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Gradient

package/dist/components/Gradient/Gradient.js

@@ -1,23 +1,23 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["mode", "children", "to", "className"];
-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/#/Gradient
  */
 export var Gradient = function Gradient(_ref) {
   var _ref$mode = _ref.mode,
-    mode = _ref$mode === void 0 ? "tint" : _ref$mode,
+    mode = _ref$mode === void 0 ? 'tint' : _ref$mode,
     children = _ref.children,
     _ref$to = _ref.to,
-    to = _ref$to === void 0 ? "top" : _ref$to,
+    to = _ref$to === void 0 ? 'top' : _ref$to,
     className = _ref.className,
     restProps = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React.createElement("div", _extends({
     role: "presentation"
   }, restProps, {
-    className: classNamesString("vkuiGradient", styles["Gradient--mode-".concat(mode)], styles["Gradient--to-".concat(to)], className)
+    className: classNames("vkuiGradient", styles["Gradient--mode-".concat(mode)], styles["Gradient--to-".concat(to)], className)
   }), children);
 };
 var styles = {

package/dist/components/Gradient/Gradient.js.map

@@ -1 +1 @@
-{"version":3,"file":"Gradient.js","names":["React","classNamesString","Gradient","mode","children","to","className","restProps","styles"],"sources":["../../../src/components/Gradient/Gradient.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport styles from \"./Gradient.module.css\";\n\nexport interface GradientProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Тип градиента\n   */\n  mode?: \"tint\" | \"white\" | \"black\";\n  /**\n   * Направление градиента\n   */\n  to?: \"top\" | \"bottom\";\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Gradient\n */\nexport const Gradient = ({\n  mode = \"tint\",\n  children,\n  to = \"top\",\n  className,\n  ...restProps\n}: GradientProps) => {\n  return (\n    <div\n      role=\"presentation\"\n      {...restProps}\n      className={classNamesString(\n        styles[\"Gradient\"],\n        styles[`Gradient--mode-${mode}`],\n        styles[`Gradient--to-${to}`],\n        className\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,sBAAsB;AAcvD;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAMA;EAAA,qBALnBC,IAAI;IAAJA,IAAI,0BAAG,MAAM;IACbC,QAAQ,QAARA,QAAQ;IAAA,eACRC,EAAE;IAAFA,EAAE,wBAAG,KAAK;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,oBACE;IACE,IAAI,EAAC;EAAc,GACfA,SAAS;IACb,SAAS,EAAEN,gBAAgB,iBAEzBO,MAAM,0BAAmBL,IAAI,EAAG,EAChCK,MAAM,wBAAiBH,EAAE,EAAG,EAC5BC,SAAS;EACT,IAEDF,QAAQ,CACL;AAEV,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"file":"Gradient.js","names":["React","classNames","Gradient","mode","children","to","className","restProps","styles"],"sources":["../../../src/components/Gradient/Gradient.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './Gradient.module.css';\n\nexport interface GradientProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Тип градиента\n   */\n  mode?: 'tint' | 'white' | 'black';\n  /**\n   * Направление градиента\n   */\n  to?: 'top' | 'bottom';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Gradient\n */\nexport const Gradient = ({\n  mode = 'tint',\n  children,\n  to = 'top',\n  className,\n  ...restProps\n}: GradientProps) => {\n  return (\n    <div\n      role=\"presentation\"\n      {...restProps}\n      className={classNames(\n        styles['Gradient'],\n        styles[`Gradient--mode-${mode}`],\n        styles[`Gradient--to-${to}`],\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAc5C;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAMA;EAAA,qBALnBC,IAAI;IAAJA,IAAI,0BAAG,MAAM;IACbC,QAAQ,QAARA,QAAQ;IAAA,eACRC,EAAE;IAAFA,EAAE,wBAAG,KAAK;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,oBACE;IACE,IAAI,EAAC;EAAc,GACfA,SAAS;IACb,SAAS,EAAEN,UAAU,iBAEnBO,MAAM,0BAAmBL,IAAI,EAAG,EAChCK,MAAM,wBAAiBH,EAAE,EAAG,EAC5BC,SAAS;EACT,IAEDF,QAAQ,CACL;AAEV,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}

package/dist/components/GridAvatar/GridAvatar.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
-import { type ImageBaseProps } from "../ImageBase/ImageBase";
-import { type GridAvatarBadgeProps } from "./GridAvatarBadge/GridAvatarBadge";
+import { type ImageBaseProps } from '../ImageBase/ImageBase';
+import { type GridAvatarBadgeProps } from './GridAvatarBadge/GridAvatarBadge';
 export { GridAvatarBadgeProps };
 export declare const GRID_AVATAR_DEFAULT_SIZE = 48;
 export declare const MAX_GRID_LENGTH = 4;
-export interface GridAvatarProps extends Omit<ImageBaseProps, "src" | "fallbackIcon"> {
+export interface GridAvatarProps extends Omit<ImageBaseProps, 'src' | 'fallbackIcon'> {
     /**
      * Массив со ссылками. От 1 до 4 элементов.
      */

package/dist/components/GridAvatar/GridAvatar.js

@@ -1,14 +1,14 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["src", "size", "className", "children"];
-import * as React from "react";
-import { classNamesString } from "../../lib/classNames";
-import { warnOnce } from "../../lib/warnOnce";
-import { ImageBase } from "../ImageBase/ImageBase";
-import { GridAvatarBadge } from "./GridAvatarBadge/GridAvatarBadge";
+import * as React from 'react';
+import { classNames } from '@vkontakte/vkjs';
+import { warnOnce } from '../../lib/warnOnce';
+import { ImageBase } from '../ImageBase/ImageBase';
+import { GridAvatarBadge } from './GridAvatarBadge/GridAvatarBadge';
 export var GRID_AVATAR_DEFAULT_SIZE = 48;
 export var MAX_GRID_LENGTH = 4;
-var warn = warnOnce("GridAvatar");
+var warn = warnOnce('GridAvatar');
 
 /**
  * @see https://vkcom.github.io/VKUI/#/GridAvatar
@@ -21,17 +21,17 @@ export var GridAvatar = function GridAvatar(_ref) {
     className = _ref.className,
     children = _ref.children,
     restProps = _objectWithoutProperties(_ref, _excluded);
-  if (process.env.NODE_ENV === "development") {
+  if (process.env.NODE_ENV === 'development') {
     if (src.length > MAX_GRID_LENGTH) {
-      warn("\u0414\u043B\u0438\u043D\u0430 \u043C\u0430\u0441\u0441\u0438\u0432\u0430 src (".concat(src.length, ") \u0431\u043E\u043B\u044C\u0448\u0435 \u043C\u0430\u043A\u0441\u0438\u043C\u0430\u043B\u044C\u043D\u043E\u0439 (").concat(MAX_GRID_LENGTH, ")"), "error");
+      warn("\u0414\u043B\u0438\u043D\u0430 \u043C\u0430\u0441\u0441\u0438\u0432\u0430 src (".concat(src.length, ") \u0431\u043E\u043B\u044C\u0448\u0435 \u043C\u0430\u043A\u0441\u0438\u043C\u0430\u043B\u044C\u043D\u043E\u0439 (").concat(MAX_GRID_LENGTH, ")"), 'error');
     }
   }
   return /*#__PURE__*/React.createElement(ImageBase, _extends({}, restProps, {
     size: size,
-    className: classNamesString("vkuiGridAvatar", className)
+    className: classNames("vkuiGridAvatar", className)
   }), /*#__PURE__*/React.createElement("div", {
     className: "vkuiGridAvatar__in",
-    "aria-hidden": "true"
+    "aria-hidden": true
   }, src.map(function (url, index) {
     return index < MAX_GRID_LENGTH ? /*#__PURE__*/React.createElement("div", {
       key: url,

package/dist/components/GridAvatar/GridAvatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"GridAvatar.js","names":["React","classNamesString","warnOnce","ImageBase","GridAvatarBadge","GRID_AVATAR_DEFAULT_SIZE","MAX_GRID_LENGTH","warn","GridAvatar","src","size","className","children","restProps","process","env","NODE_ENV","length","map","url","index","backgroundImage","Badge"],"sources":["../../../src/components/GridAvatar/GridAvatar.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { type ImageBaseProps, ImageBase } from \"../ImageBase/ImageBase\";\nimport {\n  type GridAvatarBadgeProps,\n  GridAvatarBadge,\n} from \"./GridAvatarBadge/GridAvatarBadge\";\nimport styles from \"./GridAvatar.module.css\";\n\nexport { GridAvatarBadgeProps };\n\nexport const GRID_AVATAR_DEFAULT_SIZE = 48;\n\nexport const MAX_GRID_LENGTH = 4;\n\nexport interface GridAvatarProps\n  extends Omit<ImageBaseProps, \"src\" | \"fallbackIcon\"> {\n  /**\n   * Массив со ссылками. От 1 до 4 элементов.\n   */\n  src?: string[];\n}\n\nconst warn = warnOnce(\"GridAvatar\");\n\n/**\n * @see https://vkcom.github.io/VKUI/#/GridAvatar\n */\nexport const GridAvatar = ({\n  src = [],\n  size = GRID_AVATAR_DEFAULT_SIZE,\n  className,\n  children,\n  ...restProps\n}: GridAvatarProps) => {\n  if (process.env.NODE_ENV === \"development\") {\n    if (src.length > MAX_GRID_LENGTH) {\n      warn(\n        `Длина массива src (${src.length}) больше максимальной (${MAX_GRID_LENGTH})`,\n        \"error\"\n      );\n    }\n  }\n\n  return (\n    <ImageBase\n      {...restProps}\n      size={size}\n      className={classNamesString(styles[\"GridAvatar\"], className)}\n    >\n      <div className={styles[\"GridAvatar__in\"]} aria-hidden=\"true\">\n        {src.map((url, index) =>\n          index < MAX_GRID_LENGTH ? (\n            <div\n              key={url}\n              className={styles[\"GridAvatar__item\"]}\n              style={{ backgroundImage: `url(${url})` }}\n            />\n          ) : null\n        )}\n      </div>\n      {children}\n    </ImageBase>\n  );\n};\n\nGridAvatar.Badge = GridAvatarBadge;\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,sBAAsB;AACvD,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAA8BC,SAAS,QAAQ,wBAAwB;AACvE,SAEEC,eAAe,QACV,mCAAmC;AAK1C,OAAO,IAAMC,wBAAwB,GAAG,EAAE;AAE1C,OAAO,IAAMC,eAAe,GAAG,CAAC;AAUhC,IAAMC,IAAI,GAAGL,QAAQ,CAAC,YAAY,CAAC;;AAEnC;AACA;AACA;AACA,OAAO,IAAMM,UAAU,GAAG,SAAbA,UAAU,OAMA;EAAA,oBALrBC,GAAG;IAAHA,GAAG,yBAAG,EAAE;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAGL,wBAAwB;IAC/BM,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACLC,SAAS;EAEZ,IAAIC,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,aAAa,EAAE;IAC1C,IAAIP,GAAG,CAACQ,MAAM,GAAGX,eAAe,EAAE;MAChCC,IAAI,0FACoBE,GAAG,CAACQ,MAAM,8HAA0BX,eAAe,QACzE,OAAO,CACR;IACH;EACF;EAEA,oBACE,oBAAC,SAAS,eACJO,SAAS;IACb,IAAI,EAAEH,IAAK;IACX,SAAS,EAAET,gBAAgB,mBAAuBU,SAAS;EAAE,iBAE7D;IAAK,SAAS,sBAA2B;IAAC,eAAY;EAAM,GACzDF,GAAG,CAACS,GAAG,CAAC,UAACC,GAAG,EAAEC,KAAK;IAAA,OAClBA,KAAK,GAAGd,eAAe,gBACrB;MACE,GAAG,EAAEa,GAAI;MACT,SAAS,wBAA6B;MACtC,KAAK,EAAE;QAAEE,eAAe,gBAASF,GAAG;MAAI;IAAE,EAC1C,GACA,IAAI;EAAA,EACT,CACG,EACLP,QAAQ,CACC;AAEhB,CAAC;AAEDJ,UAAU,CAACc,KAAK,GAAGlB,eAAe"}
+{"version":3,"file":"GridAvatar.js","names":["React","classNames","warnOnce","ImageBase","GridAvatarBadge","GRID_AVATAR_DEFAULT_SIZE","MAX_GRID_LENGTH","warn","GridAvatar","src","size","className","children","restProps","process","env","NODE_ENV","length","map","url","index","backgroundImage","Badge"],"sources":["../../../src/components/GridAvatar/GridAvatar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { type ImageBaseProps, ImageBase } from '../ImageBase/ImageBase';\nimport { type GridAvatarBadgeProps, GridAvatarBadge } from './GridAvatarBadge/GridAvatarBadge';\nimport styles from './GridAvatar.module.css';\n\nexport { GridAvatarBadgeProps };\n\nexport const GRID_AVATAR_DEFAULT_SIZE = 48;\n\nexport const MAX_GRID_LENGTH = 4;\n\nexport interface GridAvatarProps extends Omit<ImageBaseProps, 'src' | 'fallbackIcon'> {\n  /**\n   * Массив со ссылками. От 1 до 4 элементов.\n   */\n  src?: string[];\n}\n\nconst warn = warnOnce('GridAvatar');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/GridAvatar\n */\nexport const GridAvatar = ({\n  src = [],\n  size = GRID_AVATAR_DEFAULT_SIZE,\n  className,\n  children,\n  ...restProps\n}: GridAvatarProps) => {\n  if (process.env.NODE_ENV === 'development') {\n    if (src.length > MAX_GRID_LENGTH) {\n      warn(`Длина массива src (${src.length}) больше максимальной (${MAX_GRID_LENGTH})`, 'error');\n    }\n  }\n\n  return (\n    <ImageBase {...restProps} size={size} className={classNames(styles['GridAvatar'], className)}>\n      <div className={styles['GridAvatar__in']} aria-hidden>\n        {src.map((url, index) =>\n          index < MAX_GRID_LENGTH ? (\n            <div\n              key={url}\n              className={styles['GridAvatar__item']}\n              style={{ backgroundImage: `url(${url})` }}\n            />\n          ) : null,\n        )}\n      </div>\n      {children}\n    </ImageBase>\n  );\n};\n\nGridAvatar.Badge = GridAvatarBadge;\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAA8BC,SAAS,QAAQ,wBAAwB;AACvE,SAAoCC,eAAe,QAAQ,mCAAmC;AAK9F,OAAO,IAAMC,wBAAwB,GAAG,EAAE;AAE1C,OAAO,IAAMC,eAAe,GAAG,CAAC;AAShC,IAAMC,IAAI,GAAGL,QAAQ,CAAC,YAAY,CAAC;;AAEnC;AACA;AACA;AACA,OAAO,IAAMM,UAAU,GAAG,SAAbA,UAAU,OAMA;EAAA,oBALrBC,GAAG;IAAHA,GAAG,yBAAG,EAAE;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAGL,wBAAwB;IAC/BM,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACLC,SAAS;EAEZ,IAAIC,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,aAAa,EAAE;IAC1C,IAAIP,GAAG,CAACQ,MAAM,GAAGX,eAAe,EAAE;MAChCC,IAAI,0FAAuBE,GAAG,CAACQ,MAAM,8HAA0BX,eAAe,QAAK,OAAO,CAAC;IAC7F;EACF;EAEA,oBACE,oBAAC,SAAS,eAAKO,SAAS;IAAE,IAAI,EAAEH,IAAK;IAAC,SAAS,EAAET,UAAU,mBAAuBU,SAAS;EAAE,iBAC3F;IAAK,SAAS,sBAA2B;IAAC;EAAW,GAClDF,GAAG,CAACS,GAAG,CAAC,UAACC,GAAG,EAAEC,KAAK;IAAA,OAClBA,KAAK,GAAGd,eAAe,gBACrB;MACE,GAAG,EAAEa,GAAI;MACT,SAAS,wBAA6B;MACtC,KAAK,EAAE;QAAEE,eAAe,gBAASF,GAAG;MAAI;IAAE,EAC1C,GACA,IAAI;EAAA,EACT,CACG,EACLP,QAAQ,CACC;AAEhB,CAAC;AAEDJ,UAAU,CAACc,KAAK,GAAGlB,eAAe"}

package/dist/components/GridAvatar/GridAvatarBadge/GridAvatarBadge.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
-import { type ImageBaseBadgeProps } from "../../ImageBase/ImageBase";
+import { type ImageBaseBadgeProps } from '../../ImageBase/ImageBase';
 export declare type GridAvatarBadgeProps = ImageBaseBadgeProps;
 export declare const GridAvatarBadge: ({ className, ...restProps }: GridAvatarBadgeProps) => JSX.Element;

package/dist/components/GridAvatar/GridAvatarBadge/GridAvatarBadge.js

@@ -1,16 +1,16 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["className"];
-import * as React from "react";
-import { classNamesString } from "../../../lib/classNames";
-import { ImageBase, ImageBaseContext } from "../../ImageBase/ImageBase";
+import * as React from 'react';
+import { classNames } from '@vkontakte/vkjs';
+import { ImageBase, ImageBaseContext } from '../../ImageBase/ImageBase';
 export var GridAvatarBadge = function GridAvatarBadge(_ref) {
   var className = _ref.className,
     restProps = _objectWithoutProperties(_ref, _excluded);
   var _React$useContext = React.useContext(ImageBaseContext),
     size = _React$useContext.size;
   return /*#__PURE__*/React.createElement(ImageBase.Badge, _extends({}, restProps, {
-    className: classNamesString("vkuiGridAvatarBadge", size < 96 && "vkuiGridAvatarBadge--shifted", className)
+    className: classNames("vkuiGridAvatarBadge", size < 96 && "vkuiGridAvatarBadge--shifted", className)
   }));
 };
 //# sourceMappingURL=GridAvatarBadge.js.map

package/dist/components/GridAvatar/GridAvatarBadge/GridAvatarBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"GridAvatarBadge.js","names":["React","classNamesString","ImageBase","ImageBaseContext","GridAvatarBadge","className","restProps","useContext","size"],"sources":["../../../../src/components/GridAvatar/GridAvatarBadge/GridAvatarBadge.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../../lib/classNames\";\nimport {\n  type ImageBaseBadgeProps,\n  ImageBase,\n  ImageBaseContext,\n} from \"../../ImageBase/ImageBase\";\nimport styles from \"./GridAvatarBadge.module.css\";\n\nexport type GridAvatarBadgeProps = ImageBaseBadgeProps;\n\nexport const GridAvatarBadge = ({\n  className,\n  ...restProps\n}: GridAvatarBadgeProps) => {\n  const { size } = React.useContext(ImageBaseContext);\n  return (\n    <ImageBase.Badge\n      {...restProps}\n      className={classNamesString(\n        styles[\"GridAvatarBadge\"],\n        size < 96 && styles[\"GridAvatarBadge--shifted\"],\n        className\n      )}\n    />\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,yBAAyB;AAC1D,SAEEC,SAAS,EACTC,gBAAgB,QACX,2BAA2B;AAKlC,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAe,OAGA;EAAA,IAF1BC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,wBAAiBN,KAAK,CAACO,UAAU,CAACJ,gBAAgB,CAAC;IAA3CK,IAAI,qBAAJA,IAAI;EACZ,oBACE,oBAAC,SAAS,CAAC,KAAK,eACVF,SAAS;IACb,SAAS,EAAEL,gBAAgB,wBAEzBO,IAAI,GAAG,EAAE,kCAAsC,EAC/CH,SAAS;EACT,GACF;AAEN,CAAC"}
+{"version":3,"file":"GridAvatarBadge.js","names":["React","classNames","ImageBase","ImageBaseContext","GridAvatarBadge","className","restProps","useContext","size"],"sources":["../../../../src/components/GridAvatar/GridAvatarBadge/GridAvatarBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { type ImageBaseBadgeProps, ImageBase, ImageBaseContext } from '../../ImageBase/ImageBase';\nimport styles from './GridAvatarBadge.module.css';\n\nexport type GridAvatarBadgeProps = ImageBaseBadgeProps;\n\nexport const GridAvatarBadge = ({ className, ...restProps }: GridAvatarBadgeProps) => {\n  const { size } = React.useContext(ImageBaseContext);\n  return (\n    <ImageBase.Badge\n      {...restProps}\n      className={classNames(\n        styles['GridAvatarBadge'],\n        size < 96 && styles['GridAvatarBadge--shifted'],\n        className,\n      )}\n    />\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAAmCC,SAAS,EAAEC,gBAAgB,QAAQ,2BAA2B;AAKjG,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAe,OAA0D;EAAA,IAApDC,SAAS,QAATA,SAAS;IAAKC,SAAS;EACvD,wBAAiBN,KAAK,CAACO,UAAU,CAACJ,gBAAgB,CAAC;IAA3CK,IAAI,qBAAJA,IAAI;EACZ,oBACE,oBAAC,SAAS,CAAC,KAAK,eACVF,SAAS;IACb,SAAS,EAAEL,UAAU,wBAEnBO,IAAI,GAAG,EAAE,kCAAsC,EAC/CH,SAAS;EACT,GACF;AAEN,CAAC"}

package/dist/components/Group/Group.d.ts

@@ -1,5 +1,5 @@
-import * as React from "react";
-import { HasRootRef } from "../../types";
+import * as React from 'react';
+import { HasRootRef } from '../../types';
 export interface GroupProps extends HasRootRef<HTMLElement>, React.HTMLAttributes<HTMLElement> {
     header?: React.ReactNode;
     description?: React.ReactNode;
@@ -8,18 +8,18 @@ export interface GroupProps extends HasRootRef<HTMLElement>, React.HTMLAttribute
       hide - разделитель всегда спрятан,
       auto - разделитель рисуется автоматически между соседними группами.
      */
-    separator?: "show" | "hide" | "auto";
+    separator?: 'show' | 'hide' | 'auto';
     /**
      * Режим отображения. Если установлен 'card', выглядит как карточка c
      * обводкой и внешними отступами. Если 'plain' — без отступов и обводки.
      * По умолчанию режим отображения зависит от `sizeX`. В модальных окнах
      * по умолчанию 'plain'.
      */
-    mode?: "plain" | "card";
+    mode?: 'plain' | 'card';
     /**
      * Отвечает за отступы вокруг контента в режиме 'card'.
      */
-    padding?: "s" | "m";
+    padding?: 's' | 'm';
     children?: React.ReactNode;
 }
 export declare const Group: ({ header, description, children, separator, getRootRef, mode: modeProps, padding, className, tabIndex: tabIndexProp, ...restProps }: GroupProps) => JSX.Element;