@vkontakte/vkui 5.2.4 → 5.3.1

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

@@ -1,75 +1,64 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "FormField", {
+    enumerable: true,
+    get: function() {
+        return FormField;
+    }
 });
-exports.FormField = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var React = _interopRequireWildcard(require("react"));
+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 _vkjs = require("@vkontakte/vkjs");
-var _useAdaptivity2 = require("../../hooks/useAdaptivity");
+var _useAdaptivity = require("../../hooks/useAdaptivity");
 var _adaptivity = require("../../lib/adaptivity");
-var _excluded = ["Component", "status", "children", "getRootRef", "before", "after", "disabled", "mode", "className"];
-var sizeYClassNames = (0, _defineProperty2.default)({
-  none: "vkuiFormField--sizeY-none"
+var sizeYClassNames = _defineProperty({
+    none: "vkuiFormField--sizeY-none"
 }, _adaptivity.SizeType.COMPACT, "vkuiFormField--sizeY-compact");
-/**
- * @see https://vkcom.github.io/VKUI/#/FormField
- */
-var FormField = function FormField(_ref) {
-  var _ref$Component = _ref.Component,
-    Component = _ref$Component === void 0 ? 'span' : _ref$Component,
-    _ref$status = _ref.status,
-    status = _ref$status === void 0 ? 'default' : _ref$status,
-    children = _ref.children,
-    getRootRef = _ref.getRootRef,
-    before = _ref.before,
-    after = _ref.after,
-    disabled = _ref.disabled,
-    _ref$mode = _ref.mode,
-    mode = _ref$mode === void 0 ? 'default' : _ref$mode,
-    className = _ref.className,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
-    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
-    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
-  var _React$useState = React.useState(false),
-    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-    hover = _React$useState2[0],
-    setHover = _React$useState2[1];
-  var handleMouseEnter = function handleMouseEnter(e) {
-    e.stopPropagation();
-    setHover(true);
-  };
-  var handleMouseLeave = function handleMouseLeave(e) {
-    e.stopPropagation();
-    setHover(false);
-  };
-  return /*#__PURE__*/React.createElement(Component, (0, _extends2.default)({}, restProps, {
-    ref: getRootRef,
-    onMouseEnter: handleMouseEnter,
-    onMouseLeave: handleMouseLeave,
-    className: (0, _vkjs.classNames)("vkuiFormField", styles["FormField--mode-".concat(mode)], styles["FormField--status-".concat(status)], sizeY !== _adaptivity.SizeType.REGULAR && sizeYClassNames[sizeY], disabled && "vkuiFormField--disabled", !disabled && hover && "vkuiFormField--hover", className)
-  }), before && /*#__PURE__*/React.createElement("span", {
-    className: "vkuiFormField__before"
-  }, before), children, after && /*#__PURE__*/React.createElement("span", {
-    className: "vkuiFormField__after"
-  }, after), /*#__PURE__*/React.createElement("span", {
-    "aria-hidden": true,
-    className: "vkuiFormField__border"
-  }));
-};
-exports.FormField = FormField;
-var styles = {
-  "FormField--mode-default": "vkuiFormField--mode-default",
-  "FormField--mode-plain": "vkuiFormField--mode-plain",
-  "FormField--status-error": "vkuiFormField--status-error",
-  "FormField--status-valid": "vkuiFormField--status-valid",
-  "FormField--status-default": "vkuiFormField--status-default"
+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, [
+        "Component",
+        "status",
+        "children",
+        "getRootRef",
+        "before",
+        "after",
+        "disabled",
+        "mode",
+        "className"
+    ]);
+    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 handleMouseEnter = function(e) {
+        e.stopPropagation();
+        setHover(true);
+    };
+    var handleMouseLeave = function(e) {
+        e.stopPropagation();
+        setHover(false);
+    };
+    return /*#__PURE__*/ _react.createElement(Component, _objectSpreadProps(_objectSpread({}, restProps), {
+        ref: getRootRef,
+        onMouseEnter: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        className: (0, _vkjs.classNames)("vkuiFormField", mode === "default" && "vkuiFormField--mode-default", status !== "default" && ({
+            error: "vkuiFormField--status-error",
+            valid: "vkuiFormField--status-valid"
+        })[status], sizeY !== _adaptivity.SizeType.REGULAR && sizeYClassNames[sizeY], disabled && "vkuiFormField--disabled", !disabled && hover && "vkuiFormField--hover", className)
+    }), before && /*#__PURE__*/ _react.createElement("span", {
+        className: "vkuiFormField__before"
+    }, before), children, after && /*#__PURE__*/ _react.createElement("span", {
+        className: (0, _vkjs.classNames)("vkuiFormField__after", "vkuiInternalFormField__after")
+    }, after), /*#__PURE__*/ _react.createElement("span", {
+        "aria-hidden": true,
+        className: "vkuiFormField__border"
+    }));
 };
+
 //# sourceMappingURL=FormField.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FormField.js","names":["sizeYClassNames","none","SizeType","COMPACT","FormField","Component","status","children","getRootRef","before","after","disabled","mode","className","restProps","useAdaptivity","sizeY","React","useState","hover","setHover","handleMouseEnter","e","stopPropagation","handleMouseLeave","classNames","styles","REGULAR"],"sources":["../../../../src/components/FormField/FormField.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\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 { 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={getRootRef}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={classNames(\n        styles['FormField'],\n        styles[`FormField--mode-${mode}`],\n        styles[`FormField--status-${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 && <span className={styles['FormField__after']}>{after}</span>}\n      <span aria-hidden className={styles['FormField__border']} />\n    </Component>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAAA;AACA;AACA;AACA;AAAgD;AAIhD,IAAMA,eAAe;EACnBC,IAAI;AAAiC,GACpCC,oBAAQ,CAACC,OAAO,iCAClB;AAiCD;AACA;AACA;AACO,IAAMC,SAAS,GAAG,SAAZA,SAAS,OAWG;EAAA,0BAVvBC,SAAS;IAATA,SAAS,+BAAG,MAAM;IAAA,mBAClBC,MAAM;IAANA,MAAM,4BAAG,SAAS;IAClBC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAG,SAAS;IAChBC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,qBAA2B,IAAAC,6BAAa,GAAE;IAAA,sCAAlCC,KAAK;IAALA,KAAK,qCAAG,MAAM;EACtB,sBAA0BC,KAAK,CAACC,QAAQ,CAAC,KAAK,CAAC;IAAA;IAAxCC,KAAK;IAAEC,QAAQ;EAEtB,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIC,CAAa,EAAK;IAC1CA,CAAC,CAACC,eAAe,EAAE;IACnBH,QAAQ,CAAC,IAAI,CAAC;EAChB,CAAC;EAED,IAAMI,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIF,CAAa,EAAK;IAC1CA,CAAC,CAACC,eAAe,EAAE;IACnBH,QAAQ,CAAC,KAAK,CAAC;EACjB,CAAC;EAED,oBACE,oBAAC,SAAS,6BACJN,SAAS;IACb,GAAG,EAAEN,UAAW;IAChB,YAAY,EAAEa,gBAAiB;IAC/B,YAAY,EAAEG,gBAAiB;IAC/B,SAAS,EAAE,IAAAC,gBAAU,mBAEnBC,MAAM,2BAAoBd,IAAI,EAAG,EACjCc,MAAM,6BAAsBpB,MAAM,EAAG,EACrCU,KAAK,KAAKd,oBAAQ,CAACyB,OAAO,IAAI3B,eAAe,CAACgB,KAAK,CAAC,EACpDL,QAAQ,6BAAiC,EACzC,CAACA,QAAQ,IAAIQ,KAAK,0BAA8B,EAChDN,SAAS;EACT,IAEDJ,MAAM,iBAAI;IAAM,SAAS;EAA8B,GAAEA,MAAM,CAAQ,EACvEF,QAAQ,EACRG,KAAK,iBAAI;IAAM,SAAS;EAA6B,GAAEA,KAAK,CAAQ,eACrE;IAAM,mBAAW;IAAC,SAAS;EAA8B,EAAG,CAClD;AAEhB,CAAC;AAAC;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}
+{"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 { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\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 { 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={getRootRef}\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    </Component>\n  );\n};\n"],"names":["FormField","sizeYClassNames","none","SizeType","COMPACT","Component","status","children","getRootRef","before","after","disabled","mode","className","restProps","useAdaptivity","sizeY","React","useState","hover","setHover","handleMouseEnter","e","stopPropagation","handleMouseLeave","ref","onMouseEnter","onMouseLeave","classNames","error","valid","REGULAR","span","aria-hidden"],"mappings":";;;;+BA8CaA;;;eAAAA;;;;;;;;;2DA9CU;oBACI;6BACG;0BACL;AAIzB,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,IAA2BE,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,qBAACf,gDACKS;QACJW,KAAKjB;QACLkB,cAAcL;QACdM,cAAcH;QACdX,WAAWe,IAAAA,gBAAU,mBAEnBhB,SAAS,4CACTN,WAAW,aACT,CAAA;YACEuB,KAAK;YACLC,KAAK;QACP,CAAA,CAAC,CAACxB,OAAO,EACXU,UAAUb,oBAAQ,CAAC4B,OAAO,IAAI9B,eAAe,CAACe,MAAM,EACpDL,uCACA,CAACA,YAAYQ,iCACbN;QAGDJ,wBAAU,qBAACuB;QAAKnB,SAAS;OAAgCJ,SACzDF,UACAG,uBACC,qBAACsB;QAAKnB,WAAWe,IAAAA,gBAAU,0BAA6B;OACrDlB,sBAGL,qBAACsB;QAAKC,eAAAA,IAAW;QAACpB,SAAS;;AAGjC"}

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

@@ -1,72 +1,66 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "FormItem", {
+    enumerable: true,
+    get: function() {
+        return FormItem;
+    }
 });
-exports.FormItem = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var React = _interopRequireWildcard(require("react"));
+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 _vkjs = require("@vkontakte/vkjs");
-var _useAdaptivity2 = require("../../hooks/useAdaptivity");
+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 _excluded = ["children", "top", "bottom", "status", "Component", "removable", "onRemove", "removePlaceholder", "getRootRef", "className"];
-var sizeYClassNames = (0, _defineProperty2.default)({
-  none: "vkuiFormItem--sizeY-none"
-}, _adaptivity.SizeType.COMPACT, "vkuiFormItem--sizeY-compact");
-/**
- * @see https://vkcom.github.io/VKUI/#/FormItem
- */
-var FormItem = function FormItem(_ref) {
-  var children = _ref.children,
-    top = _ref.top,
-    bottom = _ref.bottom,
-    _ref$status = _ref.status,
-    status = _ref$status === void 0 ? 'default' : _ref$status,
-    _ref$Component = _ref.Component,
-    Component = _ref$Component === void 0 ? 'div' : _ref$Component,
-    removable = _ref.removable,
-    _ref$onRemove = _ref.onRemove,
-    _onRemove = _ref$onRemove === void 0 ? _vkjs.noop : _ref$onRemove,
-    _ref$removePlaceholde = _ref.removePlaceholder,
-    removePlaceholder = _ref$removePlaceholde === void 0 ? 'Удалить' : _ref$removePlaceholde,
-    getRootRef = _ref.getRootRef,
-    className = _ref.className,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var rootEl = (0, _useExternRef.useExternRef)(getRootRef);
-  var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
-    _useAdaptivity$sizeY = _useAdaptivity.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, {
-    className: "vkuiFormItem__top"
-  }, top), children, (0, _vkjs.hasReactNode)(bottom) && /*#__PURE__*/React.createElement(_Footnote.Footnote, {
-    className: "vkuiFormItem__bottom"
-  }, bottom));
-  return /*#__PURE__*/React.createElement(Component, (0, _extends2.default)({}, restProps, {
-    ref: rootEl,
-    className: (0, _vkjs.classNames)("vkuiFormItem", status !== 'default' && styles["FormItem--status-".concat(status)], sizeY !== _adaptivity.SizeType.REGULAR && sizeYClassNames[sizeY], (0, _vkjs.hasReactNode)(top) && "vkuiFormItem--withTop", removable && "vkuiFormItem--removable", className)
-  }), removable ? /*#__PURE__*/React.createElement(_Removable.Removable, {
-    align: "start",
-    onRemove: function onRemove(e) {
-      if (rootEl !== null && rootEl !== void 0 && rootEl.current) {
-        _onRemove(e, rootEl.current);
-      }
-    },
-    removePlaceholder: removePlaceholder
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "vkuiFormItem__removable"
-  }, wrappedChildren)) : wrappedChildren);
-};
-exports.FormItem = FormItem;
-var styles = {
-  "FormItem--status-error": "vkuiFormItem--status-error",
-  "FormItem--status-valid": "vkuiFormItem--status-valid"
+var _removable = require("../Removable/Removable");
+var _footnote = require("../Typography/Footnote/Footnote");
+var _subhead = require("../Typography/Subhead/Subhead");
+var sizeYClassNames = _defineProperty({
+    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, [
+        "children",
+        "top",
+        "bottom",
+        "status",
+        "Component",
+        "removable",
+        "onRemove",
+        "removePlaceholder",
+        "getRootRef",
+        "className"
+    ]);
+    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, {
+        className: "vkuiFormItem__top"
+    }, top), children, (0, _vkjs.hasReactNode)(bottom) && /*#__PURE__*/ _react.createElement(_footnote.Footnote, {
+        className: "vkuiFormItem__bottom"
+    }, bottom));
+    return /*#__PURE__*/ _react.createElement(Component, _objectSpreadProps(_objectSpread({}, 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, {
+        align: "start",
+        onRemove: function(e) {
+            if (rootEl === null || rootEl === void 0 ? void 0 : rootEl.current) {
+                onRemove(e, rootEl.current);
+            }
+        },
+        removePlaceholder: removePlaceholder
+    }, /*#__PURE__*/ _react.createElement("div", {
+        className: (0, _vkjs.classNames)("vkuiFormItem__removable", "vkuiInternalFormItem__removable")
+    }, wrappedChildren)) : wrappedChildren);
 };
+
 //# sourceMappingURL=FormItem.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FormItem.js","names":["sizeYClassNames","none","SizeType","COMPACT","FormItem","children","top","bottom","status","Component","removable","onRemove","noop","removePlaceholder","getRootRef","className","restProps","rootEl","useExternRef","useAdaptivity","sizeY","wrappedChildren","hasReactNode","classNames","styles","REGULAR","e","current"],"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: styles['FormItem--sizeY-none'],\n  [SizeType.COMPACT]: styles['FormItem--sizeY-compact'],\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  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 = '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        status !== 'default' && styles[`FormItem--status-${status}`],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[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;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAwD;AAGxD,IAAMA,eAAe;EACnBC,IAAI;AAAgC,GACnCC,oBAAQ,CAACC,OAAO,gCAClB;AAgBD;AACA;AACA;AACO,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,8BAAGC,UAAI;IAAA,6BACfC,iBAAiB;IAAjBA,iBAAiB,sCAAG,SAAS;IAC7BC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,MAAM,GAAG,IAAAC,0BAAY,EAACJ,UAAU,CAAC;EACvC,qBAA2B,IAAAK,6BAAa,GAAE;IAAA,sCAAlCC,KAAK;IAALA,KAAK,qCAAG,MAAM;EAEtB,IAAMC,eAAe,gBACnB,oBAAC,KAAK,CAAC,QAAQ,QACZ,IAAAC,kBAAY,EAAChB,GAAG,CAAC,iBAAI,oBAAC,gBAAO;IAAC,SAAS;EAA0B,GAAEA,GAAG,CAAW,EACjFD,QAAQ,EACR,IAAAiB,kBAAY,EAACf,MAAM,CAAC,iBAAI,oBAAC,kBAAQ;IAAC,SAAS;EAA6B,GAAEA,MAAM,CAAY,CAEhG;EAED,oBACE,oBAAC,SAAS,6BACJS,SAAS;IACb,GAAG,EAAEC,MAAO;IACZ,SAAS,EAAE,IAAAM,gBAAU,kBAEnBf,MAAM,KAAK,SAAS,IAAIgB,MAAM,4BAAqBhB,MAAM,EAAG,EAC5DY,KAAK,KAAKlB,oBAAQ,CAACuB,OAAO,IAAIzB,eAAe,CAACoB,KAAK,CAAC,EACpD,IAAAE,kBAAY,EAAChB,GAAG,CAAC,2BAA+B,EAChDI,SAAS,6BAAiC,EAC1CK,SAAS;EACT,IAEDL,SAAS,gBACR,oBAAC,oBAAS;IACR,KAAK,EAAC,OAAO;IACb,QAAQ,EAAE,kBAACgB,CAAC,EAAK;MACf,IAAIT,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEU,OAAO,EAAE;QACnBhB,SAAQ,CAACe,CAAC,EAAET,MAAM,CAACU,OAAO,CAAC;MAC7B;IACF,CAAE;IACF,iBAAiB,EAAEd;EAAkB,gBAErC;IAAK,SAAS;EAAgC,GAAEQ,eAAe,CAAO,CAC5D,GAEZA,eACD,CACS;AAEhB,CAAC;AAAC;AAAA;EAAA;EAAA;AAAA"}
+{"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  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 = '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        >\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","div"],"mappings":";;;;+BAoCaA;;;eAAAA;;;;;;;;2DApCU;oBACwB;6BACjB;4BACD;0BACJ;yBAEiB;wBACjB;uBACD;AAGxB,IAAMC,kBAEJ;IADAC,MAAMC,IAAAA,gBAAU,8BAAiC;GAChDC,oBAAQ,CAACC,OAAO,EAAGF,IAAAA,gBAAU,iCAE5B;AAqBG,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;qBAEnB,qBAACsB;QACCpB,WAAWb,IAAAA,gBAAU,6BAAgC;OAEpDmB,oBAILA,eACD;AAGP"}

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

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

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

@@ -1,42 +1,39 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "FormLayout", {
+    enumerable: true,
+    get: function() {
+        return FormLayout;
+    }
 });
-exports.FormLayout = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var React = _interopRequireWildcard(require("react"));
+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 _vkjs = require("@vkontakte/vkjs");
-var _excluded = ["children", "Component", "getRef", "onSubmit", "className"];
-var preventDefault = function preventDefault(e) {
-  return e.preventDefault();
+var preventDefault = function(e) {
+    return e.preventDefault();
 };
-/**
- * @see https://vkcom.github.io/VKUI/#/FormLayout
- */
-var FormLayout = function FormLayout(_ref) {
-  var children = _ref.children,
-    _ref$Component = _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 = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Component, (0, _extends2.default)({}, restProps, {
-    className: (0, _vkjs.classNames)("vkuiFormLayout", className),
-    onSubmit: onSubmit,
-    ref: getRef
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "vkuiFormLayout__container"
-  }, children), Component === 'form' && /*#__PURE__*/React.createElement("input", {
-    type: "submit",
-    className: "vkuiFormLayout__submit",
-    value: ""
-  }));
+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, [
+        "children",
+        "Component",
+        "getRef",
+        "onSubmit",
+        "className"
+    ]);
+    return /*#__PURE__*/ _react.createElement(Component, _objectSpreadProps(_objectSpread({}, restProps), {
+        className: (0, _vkjs.classNames)("vkuiFormLayout", className),
+        onSubmit: onSubmit,
+        ref: getRef
+    }), children, Component === "form" && /*#__PURE__*/ _react.createElement("input", {
+        type: "submit",
+        className: "vkuiFormLayout__submit",
+        value: ""
+    }));
 };
-exports.FormLayout = FormLayout;
+
 //# sourceMappingURL=FormLayout.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FormLayout.js","names":["preventDefault","e","FormLayout","children","Component","getRef","onSubmit","className","restProps","classNames"],"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;AACA;AAA6C;AAI7C,IAAMA,cAAc,GAAG,SAAjBA,cAAc,CAAIC,CAAkB;EAAA,OAAKA,CAAC,CAACD,cAAc,EAAE;AAAA;AAMjE;AACA;AACA;AACO,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,6BACJA,SAAS;IACb,SAAS,EAAE,IAAAC,gBAAU,oBAAuBF,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;AAAC"}
+{"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"}

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

@@ -1,66 +1,57 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "FormLayoutGroup", {
+    enumerable: true,
+    get: function() {
+        return FormLayoutGroup;
+    }
 });
-exports.FormLayoutGroup = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var React = _interopRequireWildcard(require("react"));
+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 _vkjs = require("@vkontakte/vkjs");
-var _useAdaptivity2 = require("../../hooks/useAdaptivity");
+var _useAdaptivity = require("../../hooks/useAdaptivity");
 var _useExternRef = require("../../hooks/useExternRef");
 var _adaptivity = require("../../lib/adaptivity");
-var _Removable = require("../Removable/Removable");
-var _excluded = ["children", "mode", "removable", "segmented", "removePlaceholder", "onRemove", "getRootRef", "className"];
-var sizeYClassNames = (0, _defineProperty2.default)({
-  none: "vkuiFormLayoutGroup--sizeY-none"
-}, _adaptivity.SizeType.COMPACT, "vkuiFormLayoutGroup--sizeY-compact");
-/**
- * @see https://vkcom.github.io/VKUI/#/FormLayoutGroup
- */
-var FormLayoutGroup = function FormLayoutGroup(_ref) {
-  var children = _ref.children,
-    _ref$mode = _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,
-    _ref$onRemove = _ref.onRemove,
-    _onRemove = _ref$onRemove === void 0 ? _vkjs.noop : _ref$onRemove,
-    getRootRef = _ref.getRootRef,
-    className = _ref.className,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
-    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
-    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
-  var isRemovable = removable && mode === 'horizontal';
-  var isSegmented = segmented && mode === 'horizontal';
-  var rootEl = (0, _useExternRef.useExternRef)(getRootRef);
-  return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
-    ref: rootEl,
-    className: (0, _vkjs.classNames)("vkuiFormLayoutGroup", sizeY !== _adaptivity.SizeType.REGULAR && sizeYClassNames[sizeY], styles["FormLayoutGroup--mode-".concat(mode)], isRemovable && "vkuiFormLayoutGroup--removable", isSegmented && "vkuiFormLayoutGroup--segmented", className)
-  }, restProps), isRemovable ? /*#__PURE__*/React.createElement(_Removable.Removable, {
-    className: "vkuiFormLayoutGroup__removable",
-    align: "start",
-    removePlaceholder: removePlaceholder,
-    onRemove: function onRemove(e) {
-      if (rootEl !== null && rootEl !== void 0 && rootEl.current) {
-        _onRemove(e, rootEl.current);
-      }
-    }
-  }, children) : /*#__PURE__*/React.createElement(React.Fragment, null, children, /*#__PURE__*/React.createElement("span", {
-    className: "vkuiFormLayoutGroup__offset",
-    "aria-hidden": true
-  })));
-};
-exports.FormLayoutGroup = FormLayoutGroup;
-var styles = {
-  "FormLayoutGroup--mode-horizontal": "vkuiFormLayoutGroup--mode-horizontal",
-  "FormLayoutGroup--mode-vertical": "vkuiFormLayoutGroup--mode-vertical"
+var _removable = require("../Removable/Removable");
+var sizeYClassNames = _defineProperty({
+    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, [
+        "children",
+        "mode",
+        "removable",
+        "segmented",
+        "removePlaceholder",
+        "onRemove",
+        "getRootRef",
+        "className"
+    ]);
+    var _useAdaptivity1 = (0, _useAdaptivity.useAdaptivity)(), _useAdaptivity_sizeY = _useAdaptivity1.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? "none" : _useAdaptivity_sizeY;
+    var isRemovable = removable && mode === "horizontal";
+    var isSegmented = segmented && mode === "horizontal";
+    var rootEl = (0, _useExternRef.useExternRef)(getRootRef);
+    return /*#__PURE__*/ _react.createElement("div", _objectSpread({
+        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, {
+        className: "vkuiFormLayoutGroup__removable",
+        align: "start",
+        removePlaceholder: removePlaceholder,
+        onRemove: function(e) {
+            if (rootEl === null || rootEl === void 0 ? void 0 : rootEl.current) {
+                onRemove(e, rootEl.current);
+            }
+        }
+    }, children) : /*#__PURE__*/ _react.createElement(_react.Fragment, null, children, /*#__PURE__*/ _react.createElement("span", {
+        className: "vkuiFormLayoutGroup__offset",
+        "aria-hidden": true
+    })));
 };
+
 //# sourceMappingURL=FormLayoutGroup.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FormLayoutGroup.js","names":["sizeYClassNames","none","SizeType","COMPACT","FormLayoutGroup","children","mode","removable","segmented","removePlaceholder","onRemove","noop","getRootRef","className","restProps","useAdaptivity","sizeY","isRemovable","isSegmented","rootEl","useExternRef","classNames","REGULAR","styles","e","current"],"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: styles['FormLayoutGroup--sizeY-none'],\n  [SizeType.COMPACT]: styles['FormLayoutGroup--sizeY-compact'],\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  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 = '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        styles['FormLayoutGroup'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[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;AACA;AACA;AACA;AACA;AAEA;AAAmE;AAGnE,IAAMA,eAAe;EACnBC,IAAI;AAAuC,GAC1CC,oBAAQ,CAACC,OAAO,uCAClB;AAkBD;AACA;AACA;AACO,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,8BAAGC,UAAI;IACfC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,qBAA2B,IAAAC,6BAAa,GAAE;IAAA,sCAAlCC,KAAK;IAALA,KAAK,qCAAG,MAAM;EACtB,IAAMC,WAAW,GAAGV,SAAS,IAAID,IAAI,KAAK,YAAY;EACtD,IAAMY,WAAW,GAAGV,SAAS,IAAIF,IAAI,KAAK,YAAY;EACtD,IAAMa,MAAM,GAAG,IAAAC,0BAAY,EAACR,UAAU,CAAC;EAEvC,oBACE;IACE,GAAG,EAAEO,MAAO;IACZ,SAAS,EAAE,IAAAE,gBAAU,yBAEnBL,KAAK,KAAKd,oBAAQ,CAACoB,OAAO,IAAItB,eAAe,CAACgB,KAAK,CAAC,EACpDO,MAAM,iCAA0BjB,IAAI,EAAG,EACvCW,WAAW,oCAAwC,EACnDC,WAAW,oCAAwC,EACnDL,SAAS;EACT,GACEC,SAAS,GAEZG,WAAW,gBACV,oBAAC,oBAAS;IACR,SAAS,kCAAuC;IAChD,KAAK,EAAC,OAAO;IACb,iBAAiB,EAAER,iBAAkB;IACrC,QAAQ,EAAE,kBAACe,CAAC,EAAK;MACf,IAAIL,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEM,OAAO,EAAE;QACnBf,SAAQ,CAACc,CAAC,EAAEL,MAAM,CAACM,OAAO,CAAC;MAC7B;IACF;EAAE,GAEDpB,QAAQ,CACC,gBAEZ,oBAAC,KAAK,CAAC,QAAQ,QACZA,QAAQ,eACT;IAAM,SAAS,+BAAoC;IAAC;EAAW,EAAG,CAErE,CACG;AAEV,CAAC;AAAC;AAAA;EAAA;EAAA;AAAA"}
+{"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  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 = '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        >\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","React","Fragment","span","aria-hidden"],"mappings":";;;;+BAuCaA;;;eAAAA;;;;;;;2DAvCU;oBACU;6BACH;4BACD;0BACJ;yBAEiB;AAG1C,IAAMC,kBAKJ;IAJAC,MAAMC,IAAAA,gBAAU,qCAEd;GAEDC,oBAAQ,CAACC,OAAO,EAAGF,IAAAA,gBAAU,wCAE5B;AAuBG,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;OAECtB,0BAGH,qBAACuB,OAAMC,QAAQ,QACZxB,wBACD,qBAACyB;QAAKjB,SAAS;QAAqCkB,eAAAA,IAAW;OAElE;AAGP"}