@vkontakte/vkui 5.4.2 → 5.5.0

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import * as React from 'react';
 export type FocusVisibleMode = 'inside' | 'outside' | 'outline';
 export interface FocusVisibleProps {
     visible: boolean | undefined;
@@ -8,4 +8,4 @@ export interface FocusVisibleProps {
 /**
  * @see https://vkcom.github.io/VKUI/#/FocusVisible
  */
-export declare const FocusVisible: ({ visible, mode, thin }: FocusVisibleProps) => JSX.Element;
+export declare const FocusVisible: ({ visible, mode, thin, ...restProps }: FocusVisibleProps) => React.JSX.Element;

package/dist/cjs/components/FocusVisible/FocusVisible.js

@@ -8,19 +8,26 @@ Object.defineProperty(exports, "FocusVisible", {
         return FocusVisible;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
-var FocusVisible = function(param) {
-    var visible = param.visible, mode = param.mode, thin = param.thin;
-    return /*#__PURE__*/ _react.createElement("span", {
+var FocusVisible = function(_param) /*#__PURE__*/ {
+    var visible = _param.visible, mode = _param.mode, thin = _param.thin, restProps = _object_without_properties._(_param, [
+        "visible",
+        "mode",
+        "thin"
+    ]);
+    return _react.createElement("span", _object_spread_props._(_object_spread._({}, restProps), {
         "aria-hidden": true,
         className: (0, _vkjs.classNames)("vkuiFocusVisible", visible && "vkuiFocusVisible--visible", thin && "vkuiFocusVisible--thin", {
             inside: "vkuiFocusVisible--mode-inside",
             outside: "vkuiFocusVisible--mode-outside",
             outline: "vkuiFocusVisible--mode-outline"
         }[mode])
-    });
+    }));
 };
 
 //# sourceMappingURL=FocusVisible.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/FocusVisible/FocusVisible.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './FocusVisible.module.css';\n\nexport type FocusVisibleMode = 'inside' | 'outside' | 'outline';\n\nexport interface FocusVisibleProps {\n  visible: boolean | undefined;\n  mode: FocusVisibleMode;\n  thin?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FocusVisible\n */\nexport const FocusVisible = ({ visible, mode, thin }: FocusVisibleProps) => (\n  <span\n    aria-hidden\n    className={classNames(\n      styles['FocusVisible'],\n      visible && styles['FocusVisible--visible'],\n      thin && styles['FocusVisible--thin'],\n      {\n        inside: styles['FocusVisible--mode-inside'],\n        outside: styles['FocusVisible--mode-outside'],\n        outline: styles['FocusVisible--mode-outline'],\n      }[mode],\n    )}\n  />\n);\n"],"names":["FocusVisible","visible","mode","thin","span","aria-hidden","className","classNames","inside","outside","outline"],"mappings":";;;;+BAeaA;;;eAAAA;;;;2DAfU;oBACI;AAcpB,IAAMA,eAAe;QAAGC,gBAAAA,SAASC,aAAAA,MAAMC,aAAAA;yBAC5C,qBAACC;QACCC,eAAAA,IAAW;QACXC,WAAWC,IAAAA,gBAAU,sBAEnBN,wCACAE,kCACA;YACEK,MAAM;YACNC,OAAO;YACPC,OAAO;QACT,CAAC,CAACR,KAAK"}
+{"version":3,"sources":["../../../../src/components/FocusVisible/FocusVisible.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './FocusVisible.module.css';\n\nexport type FocusVisibleMode = 'inside' | 'outside' | 'outline';\n\nexport interface FocusVisibleProps {\n  visible: boolean | undefined;\n  mode: FocusVisibleMode;\n  thin?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FocusVisible\n */\nexport const FocusVisible = ({ visible, mode, thin, ...restProps }: FocusVisibleProps) => (\n  <span\n    {...restProps}\n    aria-hidden\n    className={classNames(\n      styles['FocusVisible'],\n      visible && styles['FocusVisible--visible'],\n      thin && styles['FocusVisible--thin'],\n      {\n        inside: styles['FocusVisible--mode-inside'],\n        outside: styles['FocusVisible--mode-outside'],\n        outline: styles['FocusVisible--mode-outline'],\n      }[mode],\n    )}\n  />\n);\n"],"names":["FocusVisible","visible","mode","thin","restProps","span","aria-hidden","className","classNames","inside","outside","outline"],"mappings":";;;;+BAeaA;;;eAAAA;;;;;;;+DAfU;oBACI;AAcpB,IAAMA,eAAe;QAAGC,iBAAAA,SAASC,cAAAA,MAAMC,cAAAA,MAASC;QAAxBH;QAASC;QAAMC;;WAC5C,qBAACE,oDACKD;QACJE,eAAAA;QACAC,WAAWC,IAAAA,sCAETP,wCACAE,kCACA;YACEM,MAAM;YACNC,OAAO;YACPC,OAAO;QACT,CAAC,CAACT,KAAK;;AAEV"}

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

@@ -4,4 +4,4 @@ export type FooterProps = React.AllHTMLAttributes<HTMLElement> & HasComponent;
 /**
  * @see https://vkcom.github.io/VKUI/#/Footer
  */
-export declare const Footer: ({ children, className, ...restProps }: FooterProps) => JSX.Element;
+export declare const Footer: ({ children, className, ...restProps }: FooterProps) => React.JSX.Element;

package/dist/cjs/components/Footer/Footer.js

@@ -8,19 +8,19 @@ Object.defineProperty(exports, "Footer", {
         return Footer;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
-var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
-var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
-var _footnote = require("../Typography/Footnote/Footnote");
+var _Footnote = require("../Typography/Footnote/Footnote");
 var Footer = function(_param) {
-    var children = _param.children, className = _param.className, restProps = _objectWithoutProperties(_param, [
+    var children = _param.children, className = _param.className, restProps = _object_without_properties._(_param, [
         "children",
         "className"
     ]);
-    return /*#__PURE__*/ _react.createElement(_footnote.Footnote, _objectSpreadProps(_objectSpread({
+    return /*#__PURE__*/ _react.createElement(_Footnote.Footnote, _object_spread_props._(_object_spread._({
         Component: "footer"
     }, restProps), {
         className: (0, _vkjs.classNames)("vkuiFooter", className)

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Footer/Footer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasComponent } from '../../types';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './Footer.module.css';\n\nexport type FooterProps = React.AllHTMLAttributes<HTMLElement> & HasComponent;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Footer\n */\nexport const Footer = ({ children, className, ...restProps }: FooterProps) => {\n  return (\n    <Footnote Component=\"footer\" {...restProps} className={classNames(styles['Footer'], className)}>\n      {children}\n    </Footnote>\n  );\n};\n"],"names":["Footer","children","className","restProps","Footnote","Component","classNames"],"mappings":";;;;+BAWaA;;;eAAAA;;;;;;;2DAXU;oBACI;wBAEF;AAQlB,IAAMA,SAAS,iBAAwD;QAArDC,kBAAAA,UAAUC,mBAAAA,WAAcC;QAAxBF;QAAUC;;IACjC,qBACE,qBAACE,kBAAQ;QAACC,WAAU;OAAaF;QAAWD,WAAWI,IAAAA,gBAAU,gBAAmBJ;QACjFD;AAGP"}
+{"version":3,"sources":["../../../../src/components/Footer/Footer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasComponent } from '../../types';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './Footer.module.css';\n\nexport type FooterProps = React.AllHTMLAttributes<HTMLElement> & HasComponent;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Footer\n */\nexport const Footer = ({ children, className, ...restProps }: FooterProps) => {\n  return (\n    <Footnote Component=\"footer\" {...restProps} className={classNames(styles['Footer'], className)}>\n      {children}\n    </Footnote>\n  );\n};\n"],"names":["Footer","children","className","restProps","Footnote","Component","classNames"],"mappings":";;;;+BAWaA;;;eAAAA;;;;;;;+DAXU;oBACI;wBAEF;AAQlB,IAAMA,SAAS;QAAGC,kBAAAA,UAAUC,mBAAAA,WAAcC;QAAxBF;QAAUC;;IACjC,qBACE,qBAACE;QAASC,WAAU;OAAaF;QAAWD,WAAWI,IAAAA,gCAA6BJ;QACjFD;AAGP"}

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

@@ -28,5 +28,5 @@ interface FormFieldOwnProps extends React.AllHTMLAttributes<HTMLElement>, HasRoo
 /**
  * @see https://vkcom.github.io/VKUI/#/FormField
  */
-export declare const FormField: ({ Component, status, children, getRootRef, before, after, disabled, mode, className, ...restProps }: FormFieldOwnProps) => JSX.Element;
+export declare const FormField: ({ Component, status, children, getRootRef, before, after, disabled, mode, className, ...restProps }: FormFieldOwnProps) => React.JSX.Element;
 export {};

package/dist/cjs/components/FormField/FormField.js

@@ -8,24 +8,24 @@ Object.defineProperty(exports, "FormField", {
         return FormField;
     }
 });
-var _defineProperty = require("@swc/helpers/lib/_define_property.js").default;
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
-var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
-var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
-var _slicedToArray = require("@swc/helpers/lib/_sliced_to_array.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _define_property = require("@swc/helpers/_/_define_property");
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
 var _useAdaptivity = require("../../hooks/useAdaptivity");
 var _useExternRef = require("../../hooks/useExternRef");
 var _useFocusWithin = require("../../hooks/useFocusWithin");
 var _adaptivity = require("../../lib/adaptivity");
-var _focusVisible = require("../FocusVisible/FocusVisible");
-var sizeYClassNames = _defineProperty({
+var _FocusVisible = require("../FocusVisible/FocusVisible");
+var sizeYClassNames = _define_property._({
     none: "vkuiFormField--sizeY-none"
 }, _adaptivity.SizeType.COMPACT, "vkuiFormField--sizeY-compact");
 var FormField = function(_param) {
-    var _param_Component = _param.Component, Component = _param_Component === void 0 ? "span" : _param_Component, _param_status = _param.status, status = _param_status === void 0 ? "default" : _param_status, children = _param.children, getRootRef = _param.getRootRef, before = _param.before, after = _param.after, disabled = _param.disabled, _param_mode = _param.mode, mode = _param_mode === void 0 ? "default" : _param_mode, className = _param.className, restProps = _objectWithoutProperties(_param, [
+    var _param_Component = _param.Component, Component = _param_Component === void 0 ? "span" : _param_Component, _param_status = _param.status, status = _param_status === void 0 ? "default" : _param_status, children = _param.children, getRootRef = _param.getRootRef, before = _param.before, after = _param.after, disabled = _param.disabled, _param_mode = _param.mode, mode = _param_mode === void 0 ? "default" : _param_mode, className = _param.className, restProps = _object_without_properties._(_param, [
         "Component",
         "status",
         "children",
@@ -39,7 +39,7 @@ var FormField = function(_param) {
     var elRef = (0, _useExternRef.useExternRef)(getRootRef);
     var focusWithin = (0, _useFocusWithin.useFocusWithin)(elRef);
     var _useAdaptivity1 = (0, _useAdaptivity.useAdaptivity)(), _useAdaptivity_sizeY = _useAdaptivity1.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? "none" : _useAdaptivity_sizeY;
-    var _React_useState = _slicedToArray(_react.useState(false), 2), hover = _React_useState[0], setHover = _React_useState[1];
+    var _React_useState = _sliced_to_array._(_react.useState(false), 2), hover = _React_useState[0], setHover = _React_useState[1];
     var handleMouseEnter = function(e) {
         e.stopPropagation();
         setHover(true);
@@ -48,7 +48,7 @@ var FormField = function(_param) {
         e.stopPropagation();
         setHover(false);
     };
-    return /*#__PURE__*/ _react.createElement(Component, _objectSpreadProps(_objectSpread({}, restProps), {
+    return /*#__PURE__*/ _react.createElement(Component, _object_spread_props._(_object_spread._({}, restProps), {
         ref: elRef,
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
@@ -63,7 +63,7 @@ var FormField = function(_param) {
     }, after), /*#__PURE__*/ _react.createElement("span", {
         "aria-hidden": true,
         className: "vkuiFormField__border"
-    }), /*#__PURE__*/ _react.createElement(_focusVisible.FocusVisible, {
+    }), /*#__PURE__*/ _react.createElement(_FocusVisible.FocusVisible, {
         thin: true,
         visible: focusWithin,
         mode: "outline"

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/FormField/FormField.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusWithin } from '../../hooks/useFocusWithin';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { FocusVisible } from '../FocusVisible/FocusVisible';\nimport styles from './FormField.module.css';\n\nconst sizeYClassNames = {\n  none: styles['FormField--sizeY-none'],\n  [SizeType.COMPACT]: styles['FormField--sizeY-compact'],\n};\n\nexport interface FormFieldProps {\n  status?: 'default' | 'error' | 'valid';\n  /**\n   * Добавляет иконку слева.\n   *\n   * Рекомендации:\n   *\n   * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n   * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n   */\n  before?: React.ReactNode;\n  /**\n   * Добавляет иконку справа.\n   *\n   * Рекомендации:\n   *\n   * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n   * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n   */\n  after?: React.ReactNode;\n  mode?: 'default' | 'plain';\n}\n\ninterface FormFieldOwnProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    FormFieldProps {\n  disabled?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormField\n */\nexport const FormField = ({\n  Component = 'span',\n  status = 'default',\n  children,\n  getRootRef,\n  before,\n  after,\n  disabled,\n  mode = 'default',\n  className,\n  ...restProps\n}: FormFieldOwnProps) => {\n  const elRef = useExternRef(getRootRef);\n  const focusWithin = useFocusWithin(elRef);\n  const { sizeY = 'none' } = useAdaptivity();\n  const [hover, setHover] = React.useState(false);\n\n  const handleMouseEnter = (e: MouseEvent) => {\n    e.stopPropagation();\n    setHover(true);\n  };\n\n  const handleMouseLeave = (e: MouseEvent) => {\n    e.stopPropagation();\n    setHover(false);\n  };\n\n  return (\n    <Component\n      {...restProps}\n      ref={elRef}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={classNames(\n        styles['FormField'],\n        mode === 'default' && styles['FormField--mode-default'],\n        status !== 'default' &&\n          {\n            error: styles['FormField--status-error'],\n            valid: styles['FormField--status-valid'],\n          }[status],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        disabled && styles['FormField--disabled'],\n        !disabled && hover && styles['FormField--hover'],\n        className,\n      )}\n    >\n      {before && <span className={styles['FormField__before']}>{before}</span>}\n      {children}\n      {after && (\n        <span className={classNames(styles['FormField__after'], 'vkuiInternalFormField__after')}>\n          {after}\n        </span>\n      )}\n      <span aria-hidden className={styles['FormField__border']} />\n      <FocusVisible thin visible={focusWithin} mode=\"outline\" />\n    </Component>\n  );\n};\n"],"names":["FormField","sizeYClassNames","none","SizeType","COMPACT","Component","status","children","getRootRef","before","after","disabled","mode","className","restProps","elRef","useExternRef","focusWithin","useFocusWithin","useAdaptivity","sizeY","React","useState","hover","setHover","handleMouseEnter","e","stopPropagation","handleMouseLeave","ref","onMouseEnter","onMouseLeave","classNames","error","valid","REGULAR","span","aria-hidden","FocusVisible","thin","visible"],"mappings":";;;;+BAiDaA;;;eAAAA;;;;;;;;;2DAjDU;oBACI;6BACG;4BACD;8BACE;0BACN;4BAEI;AAG7B,IAAMC;IACJC,IAAI;GACHC,oBAAQ,CAACC,OAAO;AAqCZ,IAAMJ,YAAY,iBAWA;kCAVvBK,WAAAA,0CAAY,kDACZC,QAAAA,oCAAS,2BACTC,kBAAAA,UACAC,oBAAAA,YACAC,gBAAAA,QACAC,eAAAA,OACAC,kBAAAA,+BACAC,MAAAA,gCAAO,yBACPC,mBAAAA,WACGC;QATHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,QAAQC,IAAAA,0BAAY,EAACR;IAC3B,IAAMS,cAAcC,IAAAA,8BAAc,EAACH;IACnC,IAA2BI,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBC,OAAAA,0CAAQ;IAChB,IAA0BC,iCAAAA,OAAMC,QAAQ,CAAC,KAAK,OAAvCC,QAAmBF,oBAAZG,WAAYH;IAE1B,IAAMI,mBAAmB,SAACC,GAAkB;QAC1CA,EAAEC,eAAe;QACjBH,SAAS,IAAI;IACf;IAEA,IAAMI,mBAAmB,SAACF,GAAkB;QAC1CA,EAAEC,eAAe;QACjBH,SAAS,KAAK;IAChB;IAEA,qBACE,qBAACnB,gDACKS;QACJe,KAAKd;QACLe,cAAcL;QACdM,cAAcH;QACdf,WAAWmB,IAAAA,gBAAU,mBAEnBpB,SAAS,4CACTN,WAAW,aACT,CAAA;YACE2B,KAAK;YACLC,KAAK;QACP,CAAA,CAAC,CAAC5B,OAAO,EACXc,UAAUjB,oBAAQ,CAACgC,OAAO,IAAIlC,eAAe,CAACmB,MAAM,EACpDT,uCACA,CAACA,YAAYY,iCACbV;QAGDJ,wBAAU,qBAAC2B;QAAKvB,SAAS;OAAgCJ,SACzDF,UACAG,uBACC,qBAAC0B;QAAKvB,WAAWmB,IAAAA,gBAAU,0BAA6B;OACrDtB,sBAGL,qBAAC0B;QAAKC,eAAAA,IAAW;QAACxB,SAAS;sBAC3B,qBAACyB,0BAAY;QAACC,MAAAA,IAAI;QAACC,SAASvB;QAAaL,MAAK;;AAGpD"}
+{"version":3,"sources":["../../../../src/components/FormField/FormField.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusWithin } from '../../hooks/useFocusWithin';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { FocusVisible } from '../FocusVisible/FocusVisible';\nimport styles from './FormField.module.css';\n\nconst sizeYClassNames = {\n  none: styles['FormField--sizeY-none'],\n  [SizeType.COMPACT]: styles['FormField--sizeY-compact'],\n};\n\nexport interface FormFieldProps {\n  status?: 'default' | 'error' | 'valid';\n  /**\n   * Добавляет иконку слева.\n   *\n   * Рекомендации:\n   *\n   * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n   * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n   */\n  before?: React.ReactNode;\n  /**\n   * Добавляет иконку справа.\n   *\n   * Рекомендации:\n   *\n   * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n   * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n   */\n  after?: React.ReactNode;\n  mode?: 'default' | 'plain';\n}\n\ninterface FormFieldOwnProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    FormFieldProps {\n  disabled?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormField\n */\nexport const FormField = ({\n  Component = 'span',\n  status = 'default',\n  children,\n  getRootRef,\n  before,\n  after,\n  disabled,\n  mode = 'default',\n  className,\n  ...restProps\n}: FormFieldOwnProps) => {\n  const elRef = useExternRef(getRootRef);\n  const focusWithin = useFocusWithin(elRef);\n  const { sizeY = 'none' } = useAdaptivity();\n  const [hover, setHover] = React.useState(false);\n\n  const handleMouseEnter = (e: MouseEvent) => {\n    e.stopPropagation();\n    setHover(true);\n  };\n\n  const handleMouseLeave = (e: MouseEvent) => {\n    e.stopPropagation();\n    setHover(false);\n  };\n\n  return (\n    <Component\n      {...restProps}\n      ref={elRef}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={classNames(\n        styles['FormField'],\n        mode === 'default' && styles['FormField--mode-default'],\n        status !== 'default' &&\n          {\n            error: styles['FormField--status-error'],\n            valid: styles['FormField--status-valid'],\n          }[status],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        disabled && styles['FormField--disabled'],\n        !disabled && hover && styles['FormField--hover'],\n        className,\n      )}\n    >\n      {before && <span className={styles['FormField__before']}>{before}</span>}\n      {children}\n      {after && (\n        <span className={classNames(styles['FormField__after'], 'vkuiInternalFormField__after')}>\n          {after}\n        </span>\n      )}\n      <span aria-hidden className={styles['FormField__border']} />\n      <FocusVisible thin visible={focusWithin} mode=\"outline\" />\n    </Component>\n  );\n};\n"],"names":["FormField","sizeYClassNames","none","SizeType","COMPACT","Component","status","children","getRootRef","before","after","disabled","mode","className","restProps","elRef","useExternRef","focusWithin","useFocusWithin","useAdaptivity","sizeY","React","useState","hover","setHover","handleMouseEnter","e","stopPropagation","handleMouseLeave","ref","onMouseEnter","onMouseLeave","classNames","error","valid","REGULAR","span","aria-hidden","FocusVisible","thin","visible"],"mappings":";;;;+BAiDaA;;;eAAAA;;;;;;;;;+DAjDU;oBACI;6BACG;4BACD;8BACE;0BACN;4BAEI;AAG7B,IAAMC;IACJC,IAAI;GACHC,qBAASC;AAqCL,IAAMJ,YAAY;kCACvBK,WAAAA,0CAAY,kDACZC,QAAAA,oCAAS,2BACTC,kBAAAA,UACAC,oBAAAA,YACAC,gBAAAA,QACAC,eAAAA,OACAC,kBAAAA,+BACAC,MAAAA,gCAAO,yBACPC,mBAAAA,WACGC;QATHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,QAAQC,IAAAA,4BAAaR;IAC3B,IAAMS,cAAcC,IAAAA,gCAAeH;IACnC,IAA2BI,kBAAAA,IAAAA,wDAAAA,gBAAnBC,OAAAA,0CAAQ;IAChB,IAA0BC,qCAAAA,OAAMC,SAAS,YAAlCC,QAAmBF,oBAAZG,WAAYH;IAE1B,IAAMI,mBAAmB,SAACC;QACxBA,EAAEC;QACFH,SAAS;IACX;IAEA,IAAMI,mBAAmB,SAACF;QACxBA,EAAEC;QACFH,SAAS;IACX;IAEA,qBACE,qBAACnB,uDACKS;QACJe,KAAKd;QACLe,cAAcL;QACdM,cAAcH;QACdf,WAAWmB,IAAAA,mCAETpB,SAAS,4CACTN,WAAW,aACT,CAAA;YACE2B,KAAK;YACLC,KAAK;QACP,CAAA,CAAC,CAAC5B,OAAO,EACXc,UAAUjB,qBAASgC,WAAWlC,eAAe,CAACmB,MAAM,EACpDT,uCACA,CAACA,YAAYY,iCACbV;QAGDJ,wBAAU,qBAAC2B;QAAKvB,SAAS;OAAgCJ,SACzDF,UACAG,uBACC,qBAAC0B;QAAKvB,WAAWmB,IAAAA,0CAAuC;OACrDtB,sBAGL,qBAAC0B;QAAKC,eAAAA;QAAYxB,SAAS;sBAC3B,qBAACyB;QAAaC,MAAAA;QAAKC,SAASvB;QAAaL,MAAK;;AAGpD"}

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

@@ -15,4 +15,4 @@ export interface FormItemProps extends React.AllHTMLAttributes<HTMLElement>, Has
 /**
  * @see https://vkcom.github.io/VKUI/#/FormItem
  */
-export declare const FormItem: ({ children, top, bottom, status, Component, removable, onRemove, removePlaceholder, getRootRef, className, ...restProps }: FormItemProps) => JSX.Element;
+export declare const FormItem: ({ children, top, bottom, status, Component, removable, onRemove, removePlaceholder, getRootRef, className, ...restProps }: FormItemProps) => React.JSX.Element;

package/dist/cjs/components/FormItem/FormItem.js

@@ -8,24 +8,24 @@ Object.defineProperty(exports, "FormItem", {
         return FormItem;
     }
 });
-var _defineProperty = require("@swc/helpers/lib/_define_property.js").default;
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
-var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
-var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _define_property = require("@swc/helpers/_/_define_property");
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
 var _useAdaptivity = require("../../hooks/useAdaptivity");
 var _useExternRef = require("../../hooks/useExternRef");
 var _adaptivity = require("../../lib/adaptivity");
-var _removable = require("../Removable/Removable");
-var _footnote = require("../Typography/Footnote/Footnote");
-var _subhead = require("../Typography/Subhead/Subhead");
-var sizeYClassNames = _defineProperty({
+var _Removable = require("../Removable/Removable");
+var _Footnote = require("../Typography/Footnote/Footnote");
+var _Subhead = require("../Typography/Subhead/Subhead");
+var sizeYClassNames = _define_property._({
     none: (0, _vkjs.classNames)("vkuiFormItem--sizeY-none", "vkuiInternalFormItem--sizeY-none")
 }, _adaptivity.SizeType.COMPACT, (0, _vkjs.classNames)("vkuiFormItem--sizeY-compact", "vkuiInternalFormItem--sizeY-compact"));
 var FormItem = function(_param) {
-    var children = _param.children, top = _param.top, bottom = _param.bottom, _param_status = _param.status, status = _param_status === void 0 ? "default" : _param_status, _param_Component = _param.Component, Component = _param_Component === void 0 ? "div" : _param_Component, removable = _param.removable, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? _vkjs.noop : _param_onRemove, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? "Удалить" : _param_removePlaceholder, getRootRef = _param.getRootRef, className = _param.className, restProps = _objectWithoutProperties(_param, [
+    var children = _param.children, top = _param.top, bottom = _param.bottom, _param_status = _param.status, status = _param_status === void 0 ? "default" : _param_status, _param_Component = _param.Component, Component = _param_Component === void 0 ? "div" : _param_Component, removable = _param.removable, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? _vkjs.noop : _param_onRemove, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? "Удалить" : _param_removePlaceholder, getRootRef = _param.getRootRef, className = _param.className, restProps = _object_without_properties._(_param, [
         "children",
         "top",
         "bottom",
@@ -39,18 +39,18 @@ var FormItem = function(_param) {
     ]);
     var rootEl = (0, _useExternRef.useExternRef)(getRootRef);
     var _useAdaptivity1 = (0, _useAdaptivity.useAdaptivity)(), _useAdaptivity_sizeY = _useAdaptivity1.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? "none" : _useAdaptivity_sizeY;
-    var wrappedChildren = /*#__PURE__*/ _react.createElement(_react.Fragment, null, (0, _vkjs.hasReactNode)(top) && /*#__PURE__*/ _react.createElement(_subhead.Subhead, {
+    var wrappedChildren = /*#__PURE__*/ _react.createElement(_react.Fragment, null, (0, _vkjs.hasReactNode)(top) && /*#__PURE__*/ _react.createElement(_Subhead.Subhead, {
         className: "vkuiFormItem__top"
-    }, top), children, (0, _vkjs.hasReactNode)(bottom) && /*#__PURE__*/ _react.createElement(_footnote.Footnote, {
+    }, top), children, (0, _vkjs.hasReactNode)(bottom) && /*#__PURE__*/ _react.createElement(_Footnote.Footnote, {
         className: "vkuiFormItem__bottom"
     }, bottom));
-    return /*#__PURE__*/ _react.createElement(Component, _objectSpreadProps(_objectSpread({}, restProps), {
+    return /*#__PURE__*/ _react.createElement(Component, _object_spread_props._(_object_spread._({}, restProps), {
         ref: rootEl,
         className: (0, _vkjs.classNames)("vkuiFormItem", "vkuiInternalFormItem", status !== "default" && ({
             error: (0, _vkjs.classNames)("vkuiFormItem--status-error", "vkuiInternalFormItem--status-error"),
             valid: (0, _vkjs.classNames)("vkuiFormItem--status-valid", "vkuiInternalFormItem--status-valid")
         })[status], sizeY !== _adaptivity.SizeType.REGULAR && sizeYClassNames[sizeY], (0, _vkjs.hasReactNode)(top) && (0, _vkjs.classNames)("vkuiFormItem--withTop", "vkuiInternalFormItem--withTop"), removable && (0, _vkjs.classNames)("vkuiFormItem--removable", "vkuiInternalFormItem--removable"), className)
-    }), removable ? /*#__PURE__*/ _react.createElement(_removable.Removable, {
+    }), removable ? /*#__PURE__*/ _react.createElement(_Removable.Removable, {
         align: "start",
         onRemove: function(e) {
             if (rootEl === null || rootEl === void 0 ? void 0 : rootEl.current) {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './FormItem.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(styles['FormItem--sizeY-none'], 'vkuiInternalFormItem--sizeY-none'),\n  [SizeType.COMPACT]: classNames(\n    styles['FormItem--sizeY-compact'],\n    'vkuiInternalFormItem--sizeY-compact',\n  ),\n};\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   * Режим `indent` предназначен для визуального отступа\n   */\n  removable?: boolean | 'indent';\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 = 'none' } = 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        'vkuiInternalFormItem',\n        status !== 'default' &&\n          {\n            error: classNames(\n              styles['FormItem--status-error'],\n              'vkuiInternalFormItem--status-error',\n            ),\n            valid: classNames(\n              styles['FormItem--status-valid'],\n              'vkuiInternalFormItem--status-valid',\n            ),\n          }[status],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        hasReactNode(top) &&\n          classNames(styles['FormItem--withTop'], 'vkuiInternalFormItem--withTop'),\n        removable && classNames(styles['FormItem--removable'], 'vkuiInternalFormItem--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          indent={removable === 'indent'}\n        >\n          <div\n            className={classNames(styles['FormItem__removable'], 'vkuiInternalFormItem__removable')}\n          >\n            {wrappedChildren}\n          </div>\n        </Removable>\n      ) : (\n        wrappedChildren\n      )}\n    </Component>\n  );\n};\n"],"names":["FormItem","sizeYClassNames","none","classNames","SizeType","COMPACT","children","top","bottom","status","Component","removable","onRemove","noop","removePlaceholder","getRootRef","className","restProps","rootEl","useExternRef","useAdaptivity","sizeY","wrappedChildren","React","Fragment","hasReactNode","Subhead","Footnote","ref","error","valid","REGULAR","Removable","align","e","current","indent","div"],"mappings":";;;;+BAsCaA;;;eAAAA;;;;;;;;2DAtCU;oBACwB;6BACjB;4BACD;0BACJ;yBAEiB;wBACjB;uBACD;AAGxB,IAAMC,kBAEJ;IADAC,MAAMC,IAAAA,gBAAU,8BAAiC;GAChDC,oBAAQ,CAACC,OAAO,EAAGF,IAAAA,gBAAU,iCAE5B;AAuBG,IAAMH,WAAW,iBAYH;QAXnBM,kBAAAA,UACAC,aAAAA,KACAC,gBAAAA,+BACAC,QAAAA,oCAAS,qDACTC,WAAAA,0CAAY,0BACZC,mBAAAA,oCACAC,UAAAA,wCAAWC,UAAI,sDACfC,mBAAAA,0DAAoB,sCACpBC,oBAAAA,YACAC,mBAAAA,WACGC;QAVHX;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;;IAGA,IAAME,SAASC,IAAAA,0BAAY,EAACJ;IAC5B,IAA2BK,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBC,OAAAA,0CAAQ;IAEhB,IAAMC,gCACJ,qBAACC,OAAMC,QAAQ,QACZC,IAAAA,kBAAY,EAAClB,sBAAQ,qBAACmB,gBAAO;QAACV,SAAS;OAA4BT,MACnED,UACAmB,IAAAA,kBAAY,EAACjB,yBAAW,qBAACmB,kBAAQ;QAACX,SAAS;OAA+BR;IAI/E,qBACE,qBAACE,gDACKO;QACJW,KAAKV;QACLF,WAAWb,IAAAA,gBAAU,kBAEnB,wBACAM,WAAW,aACT,CAAA;YACEoB,OAAO1B,IAAAA,gBAAU,gCAEf;YAEF2B,OAAO3B,IAAAA,gBAAU,gCAEf;QAEJ,CAAA,CAAC,CAACM,OAAO,EACXY,UAAUjB,oBAAQ,CAAC2B,OAAO,IAAI9B,eAAe,CAACoB,MAAM,EACpDI,IAAAA,kBAAY,EAAClB,QACXJ,IAAAA,gBAAU,2BAA8B,kCAC1CQ,aAAaR,IAAAA,gBAAU,6BAAgC,oCACvDa;QAGDL,0BACC,qBAACqB,oBAAS;QACRC,OAAM;QACNrB,UAAU,SAACsB,GAAM;YACf,IAAIhB,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQiB,OAAO,EAAE;gBACnBvB,SAASsB,GAAGhB,OAAOiB,OAAO;YAC5B,CAAC;QACH;QACArB,mBAAmBA;QACnBsB,QAAQzB,cAAc;qBAEtB,qBAAC0B;QACCrB,WAAWb,IAAAA,gBAAU,6BAAgC;OAEpDmB,oBAILA,eACD;AAGP"}
+{"version":3,"sources":["../../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './FormItem.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(styles['FormItem--sizeY-none'], 'vkuiInternalFormItem--sizeY-none'),\n  [SizeType.COMPACT]: classNames(\n    styles['FormItem--sizeY-compact'],\n    'vkuiInternalFormItem--sizeY-compact',\n  ),\n};\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   * Режим `indent` предназначен для визуального отступа\n   */\n  removable?: boolean | 'indent';\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 = 'none' } = 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        'vkuiInternalFormItem',\n        status !== 'default' &&\n          {\n            error: classNames(\n              styles['FormItem--status-error'],\n              'vkuiInternalFormItem--status-error',\n            ),\n            valid: classNames(\n              styles['FormItem--status-valid'],\n              'vkuiInternalFormItem--status-valid',\n            ),\n          }[status],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        hasReactNode(top) &&\n          classNames(styles['FormItem--withTop'], 'vkuiInternalFormItem--withTop'),\n        removable && classNames(styles['FormItem--removable'], 'vkuiInternalFormItem--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          indent={removable === 'indent'}\n        >\n          <div\n            className={classNames(styles['FormItem__removable'], 'vkuiInternalFormItem__removable')}\n          >\n            {wrappedChildren}\n          </div>\n        </Removable>\n      ) : (\n        wrappedChildren\n      )}\n    </Component>\n  );\n};\n"],"names":["FormItem","sizeYClassNames","none","classNames","SizeType","COMPACT","children","top","bottom","status","Component","removable","onRemove","noop","removePlaceholder","getRootRef","className","restProps","rootEl","useExternRef","useAdaptivity","sizeY","wrappedChildren","React","Fragment","hasReactNode","Subhead","Footnote","ref","error","valid","REGULAR","Removable","align","e","current","indent","div"],"mappings":";;;;+BAsCaA;;;eAAAA;;;;;;;;+DAtCU;oBACwB;6BACjB;4BACD;0BACJ;yBAEiB;wBACjB;uBACD;AAGxB,IAAMC,kBAEJ;IADAC,MAAMC,IAAAA,8CAA2C;GAChDC,qBAASC,SAAUF,IAAAA,iDAElB;AAuBG,IAAMH,WAAW;QACtBM,kBAAAA,UACAC,aAAAA,KACAC,gBAAAA,+BACAC,QAAAA,oCAAS,qDACTC,WAAAA,0CAAY,0BACZC,mBAAAA,oCACAC,UAAAA,wCAAWC,gEACXC,mBAAAA,0DAAoB,sCACpBC,oBAAAA,YACAC,mBAAAA,WACGC;QAVHX;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;;IAGA,IAAME,SAASC,IAAAA,4BAAaJ;IAC5B,IAA2BK,kBAAAA,IAAAA,wDAAAA,gBAAnBC,OAAAA,0CAAQ;IAEhB,IAAMC,gCACJ,qBAACC,OAAMC,gBACJC,IAAAA,oBAAalB,sBAAQ,qBAACmB;QAAQV,SAAS;OAA4BT,MACnED,UACAmB,IAAAA,oBAAajB,yBAAW,qBAACmB;QAASX,SAAS;OAA+BR;IAI/E,qBACE,qBAACE,uDACKO;QACJW,KAAKV;QACLF,WAAWb,IAAAA,kCAET,wBACAM,WAAW,aACT,CAAA;YACEoB,OAAO1B,IAAAA,gDAEL;YAEF2B,OAAO3B,IAAAA,gDAEL;QAEJ,CAAA,CAAC,CAACM,OAAO,EACXY,UAAUjB,qBAAS2B,WAAW9B,eAAe,CAACoB,MAAM,EACpDI,IAAAA,oBAAalB,QACXJ,IAAAA,2CAAwC,kCAC1CQ,aAAaR,IAAAA,6CAA0C,oCACvDa;QAGDL,0BACC,qBAACqB;QACCC,OAAM;QACNrB,UAAU,SAACsB;YACT,IAAIhB,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQiB,SAAS;gBACnBvB,SAASsB,GAAGhB,OAAOiB;YACrB;QACF;QACArB,mBAAmBA;QACnBsB,QAAQzB,cAAc;qBAEtB,qBAAC0B;QACCrB,WAAWb,IAAAA,6CAA0C;OAEpDmB,oBAILA;AAIR"}

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

@@ -4,4 +4,4 @@ export type FormLayoutProps = React.AllHTMLAttributes<HTMLElement> & HasRef<HTML
 /**
  * @see https://vkcom.github.io/VKUI/#/FormLayout
  */
-export declare const FormLayout: ({ children, Component, getRef, onSubmit, className, ...restProps }: FormLayoutProps) => JSX.Element;
+export declare const FormLayout: ({ children, Component, getRef, onSubmit, className, ...restProps }: FormLayoutProps) => React.JSX.Element;

package/dist/cjs/components/FormLayout/FormLayout.js

@@ -8,24 +8,24 @@ Object.defineProperty(exports, "FormLayout", {
         return FormLayout;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
-var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
-var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
 var preventDefault = function(e) {
     return e.preventDefault();
 };
 var FormLayout = function(_param) {
-    var children = _param.children, _param_Component = _param.Component, Component = _param_Component === void 0 ? "form" : _param_Component, getRef = _param.getRef, _param_onSubmit = _param.onSubmit, onSubmit = _param_onSubmit === void 0 ? preventDefault : _param_onSubmit, className = _param.className, restProps = _objectWithoutProperties(_param, [
+    var children = _param.children, _param_Component = _param.Component, Component = _param_Component === void 0 ? "form" : _param_Component, getRef = _param.getRef, _param_onSubmit = _param.onSubmit, onSubmit = _param_onSubmit === void 0 ? preventDefault : _param_onSubmit, className = _param.className, restProps = _object_without_properties._(_param, [
         "children",
         "Component",
         "getRef",
         "onSubmit",
         "className"
     ]);
-    return /*#__PURE__*/ _react.createElement(Component, _objectSpreadProps(_objectSpread({}, restProps), {
+    return /*#__PURE__*/ _react.createElement(Component, _object_spread_props._(_object_spread._({}, restProps), {
         className: (0, _vkjs.classNames)("vkuiFormLayout", className),
         onSubmit: onSubmit,
         ref: getRef

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

@@ -1 +1 @@
-{"version":3,"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      {children}\n      {Component === 'form' && (\n        <input type=\"submit\" className={styles['FormLayout__submit']} value=\"\" />\n      )}\n    </Component>\n  );\n};\n"],"names":["FormLayout","preventDefault","e","children","Component","getRef","onSubmit","className","restProps","classNames","ref","input","type","value"],"mappings":";;;;+BAcaA;;;eAAAA;;;;;;;2DAdU;oBACI;AAI3B,IAAMC,iBAAiB,SAACC;WAAuBA,EAAED,cAAc;;AASxD,IAAMD,aAAa,iBAOH;QANrBG,kBAAAA,oCACAC,WAAAA,0CAAY,2BACZC,gBAAAA,iCACAC,UAAAA,wCAAWL,kCACXM,mBAAAA,WACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,qBAACH,gDACKI;QACJD,WAAWE,IAAAA,gBAAU,oBAAuBF;QAC5CD,UAAUA;QACVI,KAAKL;QAEJF,UACAC,cAAc,wBACb,qBAACO;QAAMC,MAAK;QAASL,SAAS;QAAgCM,OAAM;;AAI5E"}
+{"version":3,"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      {children}\n      {Component === 'form' && (\n        <input type=\"submit\" className={styles['FormLayout__submit']} value=\"\" />\n      )}\n    </Component>\n  );\n};\n"],"names":["FormLayout","preventDefault","e","children","Component","getRef","onSubmit","className","restProps","classNames","ref","input","type","value"],"mappings":";;;;+BAcaA;;;eAAAA;;;;;;;+DAdU;oBACI;AAI3B,IAAMC,iBAAiB,SAACC;WAAuBA,EAAED;;AAS1C,IAAMD,aAAa;QACxBG,kBAAAA,oCACAC,WAAAA,0CAAY,2BACZC,gBAAAA,iCACAC,UAAAA,wCAAWL,kCACXM,mBAAAA,WACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,qBAACH,uDACKI;QACJD,WAAWE,IAAAA,oCAAiCF;QAC5CD,UAAUA;QACVI,KAAKL;QAEJF,UACAC,cAAc,wBACb,qBAACO;QAAMC,MAAK;QAASL,SAAS;QAAgCM,OAAM;;AAI5E"}

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

@@ -17,4 +17,4 @@ export interface FormLayoutGroupProps extends React.HTMLAttributes<HTMLDivElemen
 /**
  * @see https://vkcom.github.io/VKUI/#/FormLayoutGroup
  */
-export declare const FormLayoutGroup: ({ children, mode, removable, segmented, removePlaceholder, onRemove, getRootRef, className, ...restProps }: FormLayoutGroupProps) => JSX.Element;
+export declare const FormLayoutGroup: ({ children, mode, removable, segmented, removePlaceholder, onRemove, getRootRef, className, ...restProps }: FormLayoutGroupProps) => React.JSX.Element;

package/dist/cjs/components/FormLayoutGroup/FormLayoutGroup.js

@@ -8,21 +8,21 @@ Object.defineProperty(exports, "FormLayoutGroup", {
         return FormLayoutGroup;
     }
 });
-var _defineProperty = require("@swc/helpers/lib/_define_property.js").default;
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
-var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _define_property = require("@swc/helpers/_/_define_property");
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
 var _useAdaptivity = require("../../hooks/useAdaptivity");
 var _useExternRef = require("../../hooks/useExternRef");
 var _adaptivity = require("../../lib/adaptivity");
-var _removable = require("../Removable/Removable");
-var sizeYClassNames = _defineProperty({
+var _Removable = require("../Removable/Removable");
+var sizeYClassNames = _define_property._({
     none: (0, _vkjs.classNames)("vkuiFormLayoutGroup--sizeY-none", "vkuiInternalFormLayoutGroup--sizeY-none")
 }, _adaptivity.SizeType.COMPACT, (0, _vkjs.classNames)("vkuiFormLayoutGroup--sizeY-compact", "vkuiInternalFormLayoutGroup--sizeY-compact"));
 var FormLayoutGroup = function(_param) {
-    var children = _param.children, _param_mode = _param.mode, mode = _param_mode === void 0 ? "vertical" : _param_mode, removable = _param.removable, segmented = _param.segmented, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? "Удалить" : _param_removePlaceholder, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? _vkjs.noop : _param_onRemove, getRootRef = _param.getRootRef, className = _param.className, restProps = _objectWithoutProperties(_param, [
+    var children = _param.children, _param_mode = _param.mode, mode = _param_mode === void 0 ? "vertical" : _param_mode, removable = _param.removable, segmented = _param.segmented, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? "Удалить" : _param_removePlaceholder, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? _vkjs.noop : _param_onRemove, getRootRef = _param.getRootRef, className = _param.className, restProps = _object_without_properties._(_param, [
         "children",
         "mode",
         "removable",
@@ -36,10 +36,10 @@ var FormLayoutGroup = function(_param) {
     var isRemovable = removable && mode === "horizontal";
     var isSegmented = segmented && mode === "horizontal";
     var rootEl = (0, _useExternRef.useExternRef)(getRootRef);
-    return /*#__PURE__*/ _react.createElement("div", _objectSpread({
+    return /*#__PURE__*/ _react.createElement("div", _object_spread._({
         ref: rootEl,
         className: (0, _vkjs.classNames)(sizeY !== _adaptivity.SizeType.REGULAR && sizeYClassNames[sizeY], mode === "horizontal" && (0, _vkjs.classNames)("vkuiFormLayoutGroup--mode-horizontal", "vkuiInternalFormLayoutGroup--mode-horizontal"), isRemovable && (0, _vkjs.classNames)("vkuiFormLayoutGroup--removable", "vkuiInternalFormLayoutGroup--removable"), isSegmented && (0, _vkjs.classNames)("vkuiFormLayoutGroup--segmented", "vkuiInternalFormLayoutGroup--segmented"), className)
-    }, restProps), isRemovable ? /*#__PURE__*/ _react.createElement(_removable.Removable, {
+    }, restProps), isRemovable ? /*#__PURE__*/ _react.createElement(_Removable.Removable, {
         className: "vkuiFormLayoutGroup__removable",
         align: "start",
         removePlaceholder: removePlaceholder,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/FormLayoutGroup/FormLayoutGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport styles from './FormLayoutGroup.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(\n    styles['FormLayoutGroup--sizeY-none'],\n    'vkuiInternalFormLayoutGroup--sizeY-none',\n  ),\n  [SizeType.COMPACT]: classNames(\n    styles['FormLayoutGroup--sizeY-compact'],\n    'vkuiInternalFormLayoutGroup--sizeY-compact',\n  ),\n};\n\nexport interface FormLayoutGroupProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  mode?: 'vertical' | 'horizontal';\n  /**\n   * Только для режима horizontal. Дает возможность удалить всю группу `FormItem`.\n   *\n   * Режим `indent` предназначен для визуального отступа.\n   */\n  removable?: boolean | 'indent';\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 = 'none' } = 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        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        mode === 'horizontal' &&\n          classNames(\n            styles['FormLayoutGroup--mode-horizontal'],\n            'vkuiInternalFormLayoutGroup--mode-horizontal',\n          ),\n        isRemovable &&\n          classNames(\n            styles['FormLayoutGroup--removable'],\n            'vkuiInternalFormLayoutGroup--removable',\n          ),\n        isSegmented &&\n          classNames(\n            styles['FormLayoutGroup--segmented'],\n            'vkuiInternalFormLayoutGroup--segmented',\n          ),\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          indent={removable === 'indent'}\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"],"names":["FormLayoutGroup","sizeYClassNames","none","classNames","SizeType","COMPACT","children","mode","removable","segmented","removePlaceholder","onRemove","noop","getRootRef","className","restProps","useAdaptivity","sizeY","isRemovable","isSegmented","rootEl","useExternRef","div","ref","REGULAR","Removable","align","e","current","indent","React","Fragment","span","aria-hidden"],"mappings":";;;;+BAyCaA;;;eAAAA;;;;;;;2DAzCU;oBACU;6BACH;4BACD;0BACJ;yBAEiB;AAG1C,IAAMC,kBAKJ;IAJAC,MAAMC,IAAAA,gBAAU,qCAEd;GAEDC,oBAAQ,CAACC,OAAO,EAAGF,IAAAA,gBAAU,wCAE5B;AAyBG,IAAMH,kBAAkB,iBAUH;QAT1BM,kBAAAA,+BACAC,MAAAA,gCAAO,0BACPC,mBAAAA,WACAC,mBAAAA,6CACAC,mBAAAA,0DAAoB,+DACpBC,UAAAA,wCAAWC,UAAI,oBACfC,oBAAAA,YACAC,mBAAAA,WACGC;QARHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;;IAGA,IAA2BE,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBC,OAAAA,0CAAQ;IAChB,IAAMC,cAAcV,aAAaD,SAAS;IAC1C,IAAMY,cAAcV,aAAaF,SAAS;IAC1C,IAAMa,SAASC,IAAAA,0BAAY,EAACR;IAE5B,qBACE,qBAACS;QACCC,KAAKH;QACLN,WAAWX,IAAAA,gBAAU,EACnBc,UAAUb,oBAAQ,CAACoB,OAAO,IAAIvB,eAAe,CAACgB,MAAM,EACpDV,SAAS,gBACPJ,IAAAA,gBAAU,0CAER,iDAEJe,eACEf,IAAAA,gBAAU,oCAER,2CAEJgB,eACEhB,IAAAA,gBAAU,oCAER,2CAEJW;OAEEC,YAEHG,4BACC,qBAACO,oBAAS;QACRX,SAAS;QACTY,OAAM;QACNhB,mBAAmBA;QACnBC,UAAU,SAACgB,GAAM;YACf,IAAIP,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQQ,OAAO,EAAE;gBACnBjB,SAASgB,GAAGP,OAAOQ,OAAO;YAC5B,CAAC;QACH;QACAC,QAAQrB,cAAc;OAErBF,0BAGH,qBAACwB,OAAMC,QAAQ,QACZzB,wBACD,qBAAC0B;QAAKlB,SAAS;QAAqCmB,eAAAA,IAAW;OAElE;AAGP"}
+{"version":3,"sources":["../../../../src/components/FormLayoutGroup/FormLayoutGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport styles from './FormLayoutGroup.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(\n    styles['FormLayoutGroup--sizeY-none'],\n    'vkuiInternalFormLayoutGroup--sizeY-none',\n  ),\n  [SizeType.COMPACT]: classNames(\n    styles['FormLayoutGroup--sizeY-compact'],\n    'vkuiInternalFormLayoutGroup--sizeY-compact',\n  ),\n};\n\nexport interface FormLayoutGroupProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  mode?: 'vertical' | 'horizontal';\n  /**\n   * Только для режима horizontal. Дает возможность удалить всю группу `FormItem`.\n   *\n   * Режим `indent` предназначен для визуального отступа.\n   */\n  removable?: boolean | 'indent';\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 = 'none' } = 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        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        mode === 'horizontal' &&\n          classNames(\n            styles['FormLayoutGroup--mode-horizontal'],\n            'vkuiInternalFormLayoutGroup--mode-horizontal',\n          ),\n        isRemovable &&\n          classNames(\n            styles['FormLayoutGroup--removable'],\n            'vkuiInternalFormLayoutGroup--removable',\n          ),\n        isSegmented &&\n          classNames(\n            styles['FormLayoutGroup--segmented'],\n            'vkuiInternalFormLayoutGroup--segmented',\n          ),\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          indent={removable === 'indent'}\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"],"names":["FormLayoutGroup","sizeYClassNames","none","classNames","SizeType","COMPACT","children","mode","removable","segmented","removePlaceholder","onRemove","noop","getRootRef","className","restProps","useAdaptivity","sizeY","isRemovable","isSegmented","rootEl","useExternRef","div","ref","REGULAR","Removable","align","e","current","indent","React","Fragment","span","aria-hidden"],"mappings":";;;;+BAyCaA;;;eAAAA;;;;;;;+DAzCU;oBACU;6BACH;4BACD;0BACJ;yBAEiB;AAG1C,IAAMC,kBAKJ;IAJAC,MAAMC,IAAAA,qDAEJ;GAEDC,qBAASC,SAAUF,IAAAA,wDAElB;AAyBG,IAAMH,kBAAkB;QAC7BM,kBAAAA,+BACAC,MAAAA,gCAAO,0BACPC,mBAAAA,WACAC,mBAAAA,6CACAC,mBAAAA,0DAAoB,+DACpBC,UAAAA,wCAAWC,8BACXC,oBAAAA,YACAC,mBAAAA,WACGC;QARHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;;IAGA,IAA2BE,kBAAAA,IAAAA,wDAAAA,gBAAnBC,OAAAA,0CAAQ;IAChB,IAAMC,cAAcV,aAAaD,SAAS;IAC1C,IAAMY,cAAcV,aAAaF,SAAS;IAC1C,IAAMa,SAASC,IAAAA,4BAAaR;IAE5B,qBACE,qBAACS;QACCC,KAAKH;QACLN,WAAWX,IAAAA,kBACTc,UAAUb,qBAASoB,WAAWvB,eAAe,CAACgB,MAAM,EACpDV,SAAS,gBACPJ,IAAAA,0DAEE,iDAEJe,eACEf,IAAAA,oDAEE,2CAEJgB,eACEhB,IAAAA,oDAEE,2CAEJW;OAEEC,YAEHG,4BACC,qBAACO;QACCX,SAAS;QACTY,OAAM;QACNhB,mBAAmBA;QACnBC,UAAU,SAACgB;YACT,IAAIP,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQQ,SAAS;gBACnBjB,SAASgB,GAAGP,OAAOQ;YACrB;QACF;QACAC,QAAQrB,cAAc;OAErBF,0BAGH,qBAACwB,OAAMC,gBACJzB,wBACD,qBAAC0B;QAAKlB,SAAS;QAAqCmB,eAAAA;;AAK9D"}

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

@@ -7,4 +7,4 @@ export interface FormStatusProps extends React.HTMLAttributes<HTMLDivElement>, H
 /**
  * @see https://vkcom.github.io/VKUI/#/FormStatus
  */
-export declare const FormStatus: ({ mode, children, className, ...restProps }: FormStatusProps) => JSX.Element;
+export declare const FormStatus: ({ mode, children, className, ...restProps }: FormStatusProps) => React.JSX.Element;

package/dist/cjs/components/FormStatus/FormStatus.js

@@ -8,20 +8,20 @@ Object.defineProperty(exports, "FormStatus", {
         return FormStatus;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
-var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
-var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
-var _banner = require("../Banner/Banner");
+var _Banner = require("../Banner/Banner");
 var FormStatus = function(_param) {
-    var mode = _param.mode, children = _param.children, className = _param.className, restProps = _objectWithoutProperties(_param, [
+    var mode = _param.mode, children = _param.children, className = _param.className, restProps = _object_without_properties._(_param, [
         "mode",
         "children",
         "className"
     ]);
-    return /*#__PURE__*/ _react.createElement(_banner.Banner, _objectSpreadProps(_objectSpread({}, restProps), {
+    return /*#__PURE__*/ _react.createElement(_Banner.Banner, _object_spread_props._(_object_spread._({}, restProps), {
         subheader: children,
         className: (0, _vkjs.classNames)("vkuiInternalFormStatus", mode === "error" && (0, _vkjs.classNames)("vkuiFormStatus--mode-error", "vkuiInternalFormStatus--mode-error"), className)
     }));

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/FormStatus/FormStatus.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasRootRef } from '../../types';\nimport { Banner } from '../Banner/Banner';\nimport styles from './FormStatus.module.css';\n\nexport interface FormStatusProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLElement> {\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        'vkuiInternalFormStatus',\n        mode === 'error' &&\n          classNames(styles['FormStatus--mode-error'], 'vkuiInternalFormStatus--mode-error'),\n        className,\n      )}\n    />\n  );\n};\n"],"names":["FormStatus","mode","children","className","restProps","Banner","subheader","classNames"],"mappings":";;;;+BAgBaA;;;eAAAA;;;;;;;2DAhBU;oBACI;sBAEJ;AAahB,IAAMA,aAAa,iBAAkE;QAA/DC,cAAAA,MAAMC,kBAAAA,UAAUC,mBAAAA,WAAcC;QAA9BH;QAAMC;QAAUC;;IAC3C,qBACE,qBAACE,cAAM,uCACDD;QACJE,WAAWJ;QACXC,WAAWI,IAAAA,gBAAU,EACnB,0BACAN,SAAS,WACPM,IAAAA,gBAAU,gCAAmC,uCAC/CJ;;AAIR"}
+{"version":3,"sources":["../../../../src/components/FormStatus/FormStatus.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasRootRef } from '../../types';\nimport { Banner } from '../Banner/Banner';\nimport styles from './FormStatus.module.css';\n\nexport interface FormStatusProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLElement> {\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        'vkuiInternalFormStatus',\n        mode === 'error' &&\n          classNames(styles['FormStatus--mode-error'], 'vkuiInternalFormStatus--mode-error'),\n        className,\n      )}\n    />\n  );\n};\n"],"names":["FormStatus","mode","children","className","restProps","Banner","subheader","classNames"],"mappings":";;;;+BAgBaA;;;eAAAA;;;;;;;+DAhBU;oBACI;sBAEJ;AAahB,IAAMA,aAAa;QAAGC,cAAAA,MAAMC,kBAAAA,UAAUC,mBAAAA,WAAcC;QAA9BH;QAAMC;QAAUC;;IAC3C,qBACE,qBAACE,4DACKD;QACJE,WAAWJ;QACXC,WAAWI,IAAAA,kBACT,0BACAN,SAAS,WACPM,IAAAA,gDAA6C,uCAC/CJ;;AAIR"}

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { BaseGalleryProps } from '../BaseGallery/types';
 export interface GalleryProps extends BaseGalleryProps {
     initialSlideIndex?: number;
@@ -7,4 +7,4 @@ export interface GalleryProps extends BaseGalleryProps {
 /**
  * @see https://vkcom.github.io/VKUI/#/Gallery
  */
-export declare const Gallery: ({ initialSlideIndex, children, timeout, onChange, bullets, ...props }: GalleryProps) => JSX.Element;
+export declare const Gallery: ({ initialSlideIndex, children, timeout, onChange, bullets, ...props }: GalleryProps) => React.JSX.Element;

package/dist/cjs/components/Gallery/Gallery.js

@@ -8,24 +8,24 @@ Object.defineProperty(exports, "Gallery", {
         return Gallery;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
-var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
-var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
-var _slicedToArray = require("@swc/helpers/lib/_sliced_to_array.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _math = require("../../helpers/math");
 var _useTimeout = require("../../hooks/useTimeout");
-var _baseGallery = require("../BaseGallery/BaseGallery");
+var _BaseGallery = require("../BaseGallery/BaseGallery");
 var Gallery = function(_param) {
-    var _param_initialSlideIndex = _param.initialSlideIndex, initialSlideIndex = _param_initialSlideIndex === void 0 ? 0 : _param_initialSlideIndex, children = _param.children, _param_timeout = _param.timeout, timeout = _param_timeout === void 0 ? 0 : _param_timeout, onChange = _param.onChange, bullets = _param.bullets, props = _objectWithoutProperties(_param, [
+    var _param_initialSlideIndex = _param.initialSlideIndex, initialSlideIndex = _param_initialSlideIndex === void 0 ? 0 : _param_initialSlideIndex, children = _param.children, _param_timeout = _param.timeout, timeout = _param_timeout === void 0 ? 0 : _param_timeout, onChange = _param.onChange, bullets = _param.bullets, props = _object_without_properties._(_param, [
         "initialSlideIndex",
         "children",
         "timeout",
         "onChange",
         "bullets"
     ]);
-    var _React_useState = _slicedToArray(_react.useState(initialSlideIndex), 2), localSlideIndex = _React_useState[0], setSlideIndex = _React_useState[1];
+    var _React_useState = _sliced_to_array._(_react.useState(initialSlideIndex), 2), localSlideIndex = _React_useState[0], setSlideIndex = _React_useState[1];
     var isControlled = typeof props.slideIndex === "number";
     var _props_slideIndex;
     var slideIndex = isControlled ? (_props_slideIndex = props.slideIndex) !== null && _props_slideIndex !== void 0 ? _props_slideIndex : 0 : localSlideIndex;
@@ -73,7 +73,7 @@ var Gallery = function(_param) {
         safeSlideIndex,
         slideIndex
     ]);
-    return /*#__PURE__*/ _react.createElement(_baseGallery.BaseGallery, _objectSpreadProps(_objectSpread({
+    return /*#__PURE__*/ _react.createElement(_BaseGallery.BaseGallery, _object_spread_props._(_object_spread._({
         isDraggable: isDraggable
     }, props), {
         bullets: childCount > 0 && bullets,

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

@@ -1 +1 @@
-{"version":3,"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"],"names":["Gallery","initialSlideIndex","children","timeout","onChange","bullets","props","React","useState","localSlideIndex","setSlideIndex","isControlled","slideIndex","isDraggable","Boolean","slides","useMemo","Children","toArray","filter","item","childCount","length","handleChange","useCallback","current","autoplay","useTimeout","useEffect","set","clear","safeSlideIndex","clamp","BaseGallery"],"mappings":";;;;+BAcaA;;;eAAAA;;;;;;;;2DAdU;oBACD;0BACK;2BACC;AAWrB,IAAMA,UAAU,iBAOH;0CANlBC,mBAAAA,0DAAoB,8BACpBC,kBAAAA,kCACAC,SAAAA,sCAAU,oBACVC,kBAAAA,UACAC,iBAAAA,SACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAyCE,iCAAAA,OAAMC,QAAQ,CAACP,wBAAjDQ,kBAAkCF,oBAAjBG,gBAAiBH;IACzC,IAAMI,eAAe,OAAOL,MAAMM,UAAU,KAAK;QACfN;IAAlC,IAAMM,aAAaD,eAAeL,CAAAA,oBAAAA,MAAMM,UAAU,cAAhBN,+BAAAA,oBAAoB,CAAC,GAAGG,eAAe;IACzE,IAAMI,cAAc,CAACF,gBAAgBG,QAAQV;IAC7C,IAAMW,SAASR,OAAMS,OAAO,CAC1B;eAAMT,OAAMU,QAAQ,CAACC,OAAO,CAAChB,UAAUiB,MAAM,CAAC,SAACC;mBAASN,QAAQM;;OAChE;QAAClB;KAAS;IAEZ,IAAMmB,aAAaN,OAAOO,MAAM;IAEhC,IAAMC,eAAyChB,OAAMiB,WAAW,CAC9D,SAACC,SAAoB;QACnB,IAAIA,YAAYb,YAAY;YAC1B;QACF,CAAC;QACD,CAACD,gBAAgBD,cAAce;QAC/BrB,YAAYA,SAASqB;IACvB,GACA;QAACd;QAAcP;QAAUQ;KAAW;IAGtC,IAAMc,WAAWC,IAAAA,sBAAU,EAAC;eAAMJ,aAAa,AAACX,CAAAA,aAAa,CAAA,IAAKS;OAAalB;IAC/EI,OAAMqB,SAAS,CACb;eAAOzB,UAAUuB,SAASG,GAAG,KAAKH,SAASI,KAAK,EAAE;OAClD;QAAC3B;QAASS;QAAYc;KAAS;IAGjC,6BAA6B;IAC7B,gEAAgE;IAChE,IAAMK,iBAAiBV,aAAa,IAAIW,IAAAA,WAAK,EAACpB,YAAY,GAAGS,aAAa,KAAKT,UAAU;IACzF,mCAAmC;IACnCL,OAAMqB,SAAS,CAAC,WAAM;QACpB,IAAIxB,YAAY2B,mBAAmBnB,YAAY;YAC7CR,SAAS2B;QACX,CAAC;QACDrB,cAAcqB;IAChB,GAAG;QAAC3B;QAAU2B;QAAgBnB;KAAW;IAEzC,qBACE,qBAACqB,wBAAW;QACVpB,aAAaA;OACTP;QACJD,SAASgB,aAAa,KAAKhB;QAC3BO,YAAYmB;QACZ3B,UAAUmB;QAETR;AAGP"}
+{"version":3,"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"],"names":["Gallery","initialSlideIndex","children","timeout","onChange","bullets","props","React","useState","localSlideIndex","setSlideIndex","isControlled","slideIndex","isDraggable","Boolean","slides","useMemo","Children","toArray","filter","item","childCount","length","handleChange","useCallback","current","autoplay","useTimeout","useEffect","set","clear","safeSlideIndex","clamp","BaseGallery"],"mappings":";;;;+BAcaA;;;eAAAA;;;;;;;;+DAdU;oBACD;0BACK;2BACC;AAWrB,IAAMA,UAAU;0CACrBC,mBAAAA,0DAAoB,8BACpBC,kBAAAA,kCACAC,SAAAA,sCAAU,oBACVC,kBAAAA,UACAC,iBAAAA,SACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAyCE,qCAAAA,OAAMC,SAASP,wBAAjDQ,kBAAkCF,oBAAjBG,gBAAiBH;IACzC,IAAMI,eAAe,OAAOL,MAAMM,eAAe;QACfN;IAAlC,IAAMM,aAAaD,eAAeL,CAAAA,oBAAAA,MAAMM,wBAANN,+BAAAA,oBAAoB,IAAIG;IAC1D,IAAMI,cAAc,CAACF,gBAAgBG,QAAQV;IAC7C,IAAMW,SAASR,OAAMS,QACnB;eAAMT,OAAMU,SAASC,QAAQhB,UAAUiB,OAAO,SAACC;mBAASN,QAAQM;;OAChE;QAAClB;KAAS;IAEZ,IAAMmB,aAAaN,OAAOO;IAE1B,IAAMC,eAAyChB,OAAMiB,YACnD,SAACC;QACC,IAAIA,YAAYb,YAAY;YAC1B;QACF;QACA,CAACD,gBAAgBD,cAAce;QAC/BrB,YAAYA,SAASqB;IACvB,GACA;QAACd;QAAcP;QAAUQ;KAAW;IAGtC,IAAMc,WAAWC,IAAAA,wBAAW;eAAMJ,aAAa,AAACX,CAAAA,aAAa,CAAA,IAAKS;OAAalB;IAC/EI,OAAMqB,UACJ;eAAOzB,UAAUuB,SAASG,QAAQH,SAASI;OAC3C;QAAC3B;QAASS;QAAYc;KAAS;IAGjC,6BAA6B;IAC7B,gEAAgE;IAChE,IAAMK,iBAAiBV,aAAa,IAAIW,IAAAA,aAAMpB,YAAY,GAAGS,aAAa,KAAKT;IAC/E,mCAAmC;IACnCL,OAAMqB,UAAU;QACd,IAAIxB,YAAY2B,mBAAmBnB,YAAY;YAC7CR,SAAS2B;QACX;QACArB,cAAcqB;IAChB,GAAG;QAAC3B;QAAU2B;QAAgBnB;KAAW;IAEzC,qBACE,qBAACqB;QACCpB,aAAaA;OACTP;QACJD,SAASgB,aAAa,KAAKhB;QAC3BO,YAAYmB;QACZ3B,UAAUmB;QAETR;AAGP"}