@vkontakte/vkui 5.2.4 → 5.3.0

package/dist/cjs/components/Group/Group.js

@@ -1,82 +1,79 @@
 "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, "Group", {
+    enumerable: true,
+    get: function() {
+        return Group;
+    }
 });
-exports.Group = 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 _usePlatform = require("../../hooks/usePlatform");
 var _adaptivity = require("../../lib/adaptivity");
 var _platform = require("../../lib/platform");
 var _warnOnce = require("../../lib/warnOnce");
-var _ModalRootContext = require("../ModalRoot/ModalRootContext");
-var _Separator = require("../Separator/Separator");
-var _Spacing = require("../Spacing/Spacing");
-var _Footnote = require("../Typography/Footnote/Footnote");
-var _excluded = ["header", "description", "children", "separator", "getRootRef", "mode", "padding", "className", "tabIndex"];
-var _sizeXClassNames;
-var sizeXClassNames = (_sizeXClassNames = {
-  none: "vkuiGroup--sizeX-none"
-}, (0, _defineProperty2.default)(_sizeXClassNames, _adaptivity.SizeType.COMPACT, "vkuiGroup--sizeX-compact"), (0, _defineProperty2.default)(_sizeXClassNames, _adaptivity.SizeType.REGULAR, "vkuiGroup--sizeX-regular"), _sizeXClassNames);
-var warn = (0, _warnOnce.warnOnce)('TabsItem');
-var Group = function Group(_ref) {
-  var header = _ref.header,
-    description = _ref.description,
-    children = _ref.children,
-    _ref$separator = _ref.separator,
-    separator = _ref$separator === void 0 ? 'auto' : _ref$separator,
-    getRootRef = _ref.getRootRef,
-    modeProps = _ref.mode,
-    _ref$padding = _ref.padding,
-    padding = _ref$padding === void 0 ? 'm' : _ref$padding,
-    className = _ref.className,
-    tabIndexProp = _ref.tabIndex,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var _React$useContext = React.useContext(_ModalRootContext.ModalRootContext),
-    isInsideModal = _React$useContext.isInsideModal;
-  var platform = (0, _usePlatform.usePlatform)();
-  var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
-    _useAdaptivity$sizeX = _useAdaptivity.sizeX,
-    sizeX = _useAdaptivity$sizeX === void 0 ? 'none' : _useAdaptivity$sizeX;
-  var mode = modeProps;
-  if (!modeProps) {
-    // Подробнее в "none" можно прочитать в ADAPTIVITY_GUIDE.md
-    mode = isInsideModal ? 'plain' : 'none';
-  }
-  var isTabPanel = restProps.role === 'tabpanel';
-  if (process.env.NODE_ENV === 'development' && isTabPanel && (!restProps['aria-controls'] || !restProps['id'])) {
-    warn('При использовании роли "tabpanel" необходимо задать значение свойств "aria-controls" и "id"');
-  }
-  var tabIndex = isTabPanel && tabIndexProp === undefined ? 0 : tabIndexProp;
-  var separatorClassName = (0, _vkjs.classNames)("vkuiGroup__separator", separator === 'show' && "vkuiGroup__separator--force");
-  return /*#__PURE__*/React.createElement("section", (0, _extends2.default)({}, restProps, {
-    tabIndex: tabIndex,
-    ref: getRootRef,
-    className: (0, _vkjs.classNames)("vkuiGroup", platform === _platform.Platform.IOS && "vkuiGroup--ios", sizeXClassNames[sizeX], mode && styles["Group--mode-".concat(mode)], styles["Group--padding-".concat(padding)], className)
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "vkuiGroup__inner"
-  }, header, children, (0, _vkjs.hasReactNode)(description) && /*#__PURE__*/React.createElement(_Footnote.Footnote, {
-    className: "vkuiGroup__description"
-  }, description)), separator !== 'hide' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_Spacing.Spacing, {
-    className: (0, _vkjs.classNames)(separatorClassName, "vkuiGroup__separator--spacing"),
-    size: 16
-  }), /*#__PURE__*/React.createElement(_Separator.Separator, {
-    className: (0, _vkjs.classNames)(separatorClassName, "vkuiGroup__separator--separator")
-  })));
-};
-exports.Group = Group;
-var styles = {
-  "Group--mode-plain": "vkuiGroup--mode-plain",
-  "Group--mode-none": "vkuiGroup--mode-none",
-  "Group--mode-card": "vkuiGroup--mode-card",
-  "Group--padding-s": "vkuiGroup--padding-s",
-  "Group--padding-m": "vkuiGroup--padding-m"
+var _modalRootContext = require("../ModalRoot/ModalRootContext");
+var _separator = require("../Separator/Separator");
+var _spacing = require("../Spacing/Spacing");
+var _footnote = require("../Typography/Footnote/Footnote");
+var _obj;
+var sizeXClassNames = (_obj = {
+    none: "vkuiGroup--sizeX-none"
+}, _defineProperty(_obj, _adaptivity.SizeType.COMPACT, "vkuiGroup--sizeX-compact"), _defineProperty(_obj, _adaptivity.SizeType.REGULAR, "vkuiGroup--sizeX-regular"), _obj);
+var warn = (0, _warnOnce.warnOnce)("TabsItem");
+var Group = function(_param) {
+    var header = _param.header, description = _param.description, children = _param.children, _param_separator = _param.separator, separator = _param_separator === void 0 ? "auto" : _param_separator, getRootRef = _param.getRootRef, modeProps = _param.mode, _param_padding = _param.padding, padding = _param_padding === void 0 ? "m" : _param_padding, className = _param.className, tabIndexProp = _param.tabIndex, restProps = _objectWithoutProperties(_param, [
+        "header",
+        "description",
+        "children",
+        "separator",
+        "getRootRef",
+        "mode",
+        "padding",
+        "className",
+        "tabIndex"
+    ]);
+    var isInsideModal = _react.useContext(_modalRootContext.ModalRootContext).isInsideModal;
+    var platform = (0, _usePlatform.usePlatform)();
+    var _useAdaptivity1 = (0, _useAdaptivity.useAdaptivity)(), _useAdaptivity_sizeX = _useAdaptivity1.sizeX, sizeX = _useAdaptivity_sizeX === void 0 ? "none" : _useAdaptivity_sizeX;
+    var mode = modeProps;
+    if (!modeProps) {
+        // Подробнее в "none" можно прочитать в ADAPTIVITY_GUIDE.md
+        mode = isInsideModal ? "plain" : "none";
+    }
+    var isTabPanel = restProps.role === "tabpanel";
+    if (process.env.NODE_ENV === "development" && isTabPanel && (!restProps["aria-controls"] || !restProps["id"])) {
+        warn('При использовании роли "tabpanel" необходимо задать значение свойств "aria-controls" и "id"');
+    }
+    var tabIndex = isTabPanel && tabIndexProp === undefined ? 0 : tabIndexProp;
+    var separatorClassName = (0, _vkjs.classNames)("vkuiGroup__separator", separator === "show" && "vkuiGroup__separator--force");
+    return /*#__PURE__*/ _react.createElement(_react.Fragment, null, /*#__PURE__*/ _react.createElement("section", _objectSpreadProps(_objectSpread({}, restProps), {
+        tabIndex: tabIndex,
+        ref: getRootRef,
+        className: (0, _vkjs.classNames)("vkuiGroup", platform === _platform.Platform.IOS && "vkuiGroup--ios", sizeXClassNames[sizeX], mode && ({
+            none: (0, _vkjs.classNames)("vkuiGroup--mode-none", "vkuiInternalGroup--mode-none"),
+            plain: (0, _vkjs.classNames)("vkuiGroup--mode-plain", "vkuiInternalGroup--mode-plain"),
+            card: (0, _vkjs.classNames)("vkuiGroup--mode-card", "vkuiInternalGroup--mode-card")
+        })[mode], {
+            s: "vkuiGroup--padding-s",
+            m: "vkuiGroup--padding-m"
+        }[padding], className)
+    }), header, children, (0, _vkjs.hasReactNode)(description) && /*#__PURE__*/ _react.createElement(_footnote.Footnote, {
+        className: "vkuiGroup__description"
+    }, description)), separator !== "hide" && /*#__PURE__*/ _react.createElement(_react.Fragment, null, /*#__PURE__*/ _react.createElement(_spacing.Spacing, {
+        className: (0, _vkjs.classNames)(separatorClassName, "vkuiGroup__separator--spacing"),
+        size: 16
+    }), /*#__PURE__*/ _react.createElement(_separator.Separator, {
+        className: (0, _vkjs.classNames)(separatorClassName, "vkuiGroup__separator--separator")
+    })));
 };
+
 //# sourceMappingURL=Group.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Group.js","names":["sizeXClassNames","none","SizeType","COMPACT","REGULAR","warn","warnOnce","Group","header","description","children","separator","getRootRef","modeProps","mode","padding","className","tabIndexProp","tabIndex","restProps","React","useContext","ModalRootContext","isInsideModal","platform","usePlatform","useAdaptivity","sizeX","isTabPanel","role","process","env","NODE_ENV","undefined","separatorClassName","classNames","Platform","IOS","styles","hasReactNode"],"sources":["../../../../src/components/Group/Group.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HasRootRef } from '../../types';\nimport { ModalRootContext } from '../ModalRoot/ModalRootContext';\nimport { Separator } from '../Separator/Separator';\nimport { Spacing } from '../Spacing/Spacing';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './Group.module.css';\n\nconst sizeXClassNames = {\n  none: styles['Group--sizeX-none'],\n  [SizeType.COMPACT]: styles['Group--sizeX-compact'],\n  [SizeType.REGULAR]: styles['Group--sizeX-regular'],\n};\n\nexport interface GroupProps extends HasRootRef<HTMLElement>, React.HTMLAttributes<HTMLElement> {\n  header?: React.ReactNode;\n  description?: React.ReactNode;\n  /**\n    show - разделитель всегда показывается,\n    hide - разделитель всегда спрятан,\n    auto - разделитель рисуется автоматически между соседними группами.\n   */\n  separator?: 'show' | 'hide' | 'auto';\n  /**\n   * Режим отображения. Если установлен 'card', выглядит как карточка c\n   * обводкой и внешними отступами. Если 'plain' — без отступов и обводки.\n   * По умолчанию режим отображения зависит от `sizeX`. В модальных окнах\n   * по умолчанию 'plain'.\n   */\n  mode?: 'plain' | 'card';\n  /**\n   * Отвечает за отступы вокруг контента в режиме 'card'.\n   */\n  padding?: 's' | 'm';\n  children?: React.ReactNode;\n}\n\nconst warn = warnOnce('TabsItem');\n\nexport const Group = ({\n  header,\n  description,\n  children,\n  separator = 'auto',\n  getRootRef,\n  mode: modeProps,\n  padding = 'm',\n  className,\n  tabIndex: tabIndexProp,\n  ...restProps\n}: GroupProps) => {\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n  const { sizeX = 'none' } = useAdaptivity();\n\n  let mode: GroupProps['mode'] | 'none' = modeProps;\n\n  if (!modeProps) {\n    // Подробнее в \"none\" можно прочитать в ADAPTIVITY_GUIDE.md\n    mode = isInsideModal ? 'plain' : 'none';\n  }\n\n  const isTabPanel = restProps.role === 'tabpanel';\n\n  if (\n    process.env.NODE_ENV === 'development' &&\n    isTabPanel &&\n    (!restProps['aria-controls'] || !restProps['id'])\n  ) {\n    warn(\n      'При использовании роли \"tabpanel\" необходимо задать значение свойств \"aria-controls\" и \"id\"',\n    );\n  }\n\n  const tabIndex = isTabPanel && tabIndexProp === undefined ? 0 : tabIndexProp;\n\n  const separatorClassName = classNames(\n    styles['Group__separator'],\n    separator === 'show' && styles['Group__separator--force'],\n  );\n\n  return (\n    <section\n      {...restProps}\n      tabIndex={tabIndex}\n      ref={getRootRef}\n      className={classNames(\n        styles['Group'],\n        platform === Platform.IOS && styles['Group--ios'],\n        sizeXClassNames[sizeX],\n        mode && styles[`Group--mode-${mode}`],\n        styles[`Group--padding-${padding}`],\n        className,\n      )}\n    >\n      <div className={styles['Group__inner']}>\n        {header}\n        {children}\n        {hasReactNode(description) && (\n          <Footnote className={styles['Group__description']}>{description}</Footnote>\n        )}\n      </div>\n      {separator !== 'hide' && (\n        <React.Fragment>\n          <Spacing\n            className={classNames(separatorClassName, styles['Group__separator--spacing'])}\n            size={16}\n          />\n          <Separator\n            className={classNames(separatorClassName, styles['Group__separator--separator'])}\n          />\n        </React.Fragment>\n      )}\n    </section>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAA2D;AAAA;AAG3D,IAAMA,eAAe;EACnBC,IAAI;AAA6B,mDAChCC,oBAAQ,CAACC,OAAO,+EAChBD,oBAAQ,CAACE,OAAO,gDAClB;AAyBD,IAAMC,IAAI,GAAG,IAAAC,kBAAQ,EAAC,UAAU,CAAC;AAE1B,IAAMC,KAAK,GAAG,SAARA,KAAK,OAWA;EAAA,IAVhBC,MAAM,QAANA,MAAM;IACNC,WAAW,QAAXA,WAAW;IACXC,QAAQ,QAARA,QAAQ;IAAA,sBACRC,SAAS;IAATA,SAAS,+BAAG,MAAM;IAClBC,UAAU,QAAVA,UAAU;IACJC,SAAS,QAAfC,IAAI;IAAA,oBACJC,OAAO;IAAPA,OAAO,6BAAG,GAAG;IACbC,SAAS,QAATA,SAAS;IACCC,YAAY,QAAtBC,QAAQ;IACLC,SAAS;EAEZ,wBAA0BC,KAAK,CAACC,UAAU,CAACC,kCAAgB,CAAC;IAApDC,aAAa,qBAAbA,aAAa;EACrB,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,qBAA2B,IAAAC,6BAAa,GAAE;IAAA,sCAAlCC,KAAK;IAALA,KAAK,qCAAG,MAAM;EAEtB,IAAIb,IAAiC,GAAGD,SAAS;EAEjD,IAAI,CAACA,SAAS,EAAE;IACd;IACAC,IAAI,GAAGS,aAAa,GAAG,OAAO,GAAG,MAAM;EACzC;EAEA,IAAMK,UAAU,GAAGT,SAAS,CAACU,IAAI,KAAK,UAAU;EAEhD,IACEC,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,aAAa,IACtCJ,UAAU,KACT,CAACT,SAAS,CAAC,eAAe,CAAC,IAAI,CAACA,SAAS,CAAC,IAAI,CAAC,CAAC,EACjD;IACAd,IAAI,CACF,6FAA6F,CAC9F;EACH;EAEA,IAAMa,QAAQ,GAAGU,UAAU,IAAIX,YAAY,KAAKgB,SAAS,GAAG,CAAC,GAAGhB,YAAY;EAE5E,IAAMiB,kBAAkB,GAAG,IAAAC,gBAAU,0BAEnCxB,SAAS,KAAK,MAAM,iCAAqC,CAC1D;EAED,oBACE,0DACMQ,SAAS;IACb,QAAQ,EAAED,QAAS;IACnB,GAAG,EAAEN,UAAW;IAChB,SAAS,EAAE,IAAAuB,gBAAU,eAEnBX,QAAQ,KAAKY,kBAAQ,CAACC,GAAG,oBAAwB,EACjDrC,eAAe,CAAC2B,KAAK,CAAC,EACtBb,IAAI,IAAIwB,MAAM,uBAAgBxB,IAAI,EAAG,EACrCwB,MAAM,0BAAmBvB,OAAO,EAAG,EACnCC,SAAS;EACT,iBAEF;IAAK,SAAS;EAAyB,GACpCR,MAAM,EACNE,QAAQ,EACR,IAAA6B,kBAAY,EAAC9B,WAAW,CAAC,iBACxB,oBAAC,kBAAQ;IAAC,SAAS;EAA+B,GAAEA,WAAW,CAChE,CACG,EACLE,SAAS,KAAK,MAAM,iBACnB,oBAAC,KAAK,CAAC,QAAQ,qBACb,oBAAC,gBAAO;IACN,SAAS,EAAE,IAAAwB,gBAAU,EAACD,kBAAkB,kCAAuC;IAC/E,IAAI,EAAE;EAAG,EACT,eACF,oBAAC,oBAAS;IACR,SAAS,EAAE,IAAAC,gBAAU,EAACD,kBAAkB;EAAyC,EACjF,CAEL,CACO;AAEd,CAAC;AAAC;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"sources":["../../../../src/components/Group/Group.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HasRootRef } from '../../types';\nimport { ModalRootContext } from '../ModalRoot/ModalRootContext';\nimport { Separator } from '../Separator/Separator';\nimport { Spacing } from '../Spacing/Spacing';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './Group.module.css';\n\nconst sizeXClassNames = {\n  none: styles['Group--sizeX-none'],\n  [SizeType.COMPACT]: styles['Group--sizeX-compact'],\n  [SizeType.REGULAR]: styles['Group--sizeX-regular'],\n};\n\nexport interface GroupProps extends HasRootRef<HTMLElement>, React.HTMLAttributes<HTMLElement> {\n  header?: React.ReactNode;\n  description?: React.ReactNode;\n  /**\n    show - разделитель всегда показывается,\n    hide - разделитель всегда спрятан,\n    auto - разделитель рисуется автоматически между соседними группами.\n   */\n  separator?: 'show' | 'hide' | 'auto';\n  /**\n   * Режим отображения. Если установлен 'card', выглядит как карточка c\n   * обводкой и внешними отступами. Если 'plain' — без отступов и обводки.\n   * По умолчанию режим отображения зависит от `sizeX`. В модальных окнах\n   * по умолчанию 'plain'.\n   */\n  mode?: 'plain' | 'card';\n  /**\n   * Отвечает за отступы вокруг контента в режиме 'card'.\n   */\n  padding?: 's' | 'm';\n  children?: React.ReactNode;\n}\n\nconst warn = warnOnce('TabsItem');\n\nexport const Group = ({\n  header,\n  description,\n  children,\n  separator = 'auto',\n  getRootRef,\n  mode: modeProps,\n  padding = 'm',\n  className,\n  tabIndex: tabIndexProp,\n  ...restProps\n}: GroupProps) => {\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n  const { sizeX = 'none' } = useAdaptivity();\n\n  let mode: GroupProps['mode'] | 'none' = modeProps;\n\n  if (!modeProps) {\n    // Подробнее в \"none\" можно прочитать в ADAPTIVITY_GUIDE.md\n    mode = isInsideModal ? 'plain' : 'none';\n  }\n\n  const isTabPanel = restProps.role === 'tabpanel';\n\n  if (\n    process.env.NODE_ENV === 'development' &&\n    isTabPanel &&\n    (!restProps['aria-controls'] || !restProps['id'])\n  ) {\n    warn(\n      'При использовании роли \"tabpanel\" необходимо задать значение свойств \"aria-controls\" и \"id\"',\n    );\n  }\n\n  const tabIndex = isTabPanel && tabIndexProp === undefined ? 0 : tabIndexProp;\n\n  const separatorClassName = classNames(\n    styles['Group__separator'],\n    separator === 'show' && styles['Group__separator--force'],\n  );\n\n  return (\n    <>\n      <section\n        {...restProps}\n        tabIndex={tabIndex}\n        ref={getRootRef}\n        className={classNames(\n          styles['Group'],\n          platform === Platform.IOS && styles['Group--ios'],\n          sizeXClassNames[sizeX],\n          mode &&\n            {\n              none: classNames(styles['Group--mode-none'], 'vkuiInternalGroup--mode-none'),\n              plain: classNames(styles['Group--mode-plain'], 'vkuiInternalGroup--mode-plain'),\n              card: classNames(styles['Group--mode-card'], 'vkuiInternalGroup--mode-card'),\n            }[mode],\n          {\n            s: styles['Group--padding-s'],\n            m: styles['Group--padding-m'],\n          }[padding],\n          className,\n        )}\n      >\n        {header}\n        {children}\n        {hasReactNode(description) && (\n          <Footnote className={styles['Group__description']}>{description}</Footnote>\n        )}\n      </section>\n\n      {separator !== 'hide' && (\n        <React.Fragment>\n          <Spacing\n            className={classNames(separatorClassName, styles['Group__separator--spacing'])}\n            size={16}\n          />\n          <Separator\n            className={classNames(separatorClassName, styles['Group__separator--separator'])}\n          />\n        </React.Fragment>\n      )}\n    </>\n  );\n};\n"],"names":["Group","sizeXClassNames","none","SizeType","COMPACT","REGULAR","warn","warnOnce","header","description","children","separator","getRootRef","mode","modeProps","padding","className","tabIndex","tabIndexProp","restProps","isInsideModal","React","useContext","ModalRootContext","platform","usePlatform","useAdaptivity","sizeX","isTabPanel","role","process","env","NODE_ENV","undefined","separatorClassName","classNames","section","ref","Platform","IOS","plain","card","s","m","hasReactNode","Footnote","Fragment","Spacing","size","Separator"],"mappings":";;;;+BA6CaA;;;eAAAA;;;;;;;;2DA7CU;oBACkB;6BACX;2BACF;0BACH;wBACA;wBACA;gCAEQ;yBACP;uBACF;wBACC;IAGD;AAAxB,IAAMC,mBAAkB;IACtBC,IAAI;mBADkB,MAErBC,oBAAQ,CAACC,OAAO,+CAFK,MAGrBD,oBAAQ,CAACE,OAAO,+BAHK;AA6BxB,IAAMC,OAAOC,IAAAA,kBAAQ,EAAC;AAEf,IAAMP,QAAQ,iBAWH;QAVhBQ,gBAAAA,QACAC,qBAAAA,aACAC,kBAAAA,oCACAC,WAAAA,0CAAY,2BACZC,oBAAAA,YACAC,AAAMC,mBAAND,8BACAE,SAAAA,sCAAU,sBACVC,mBAAAA,WACAC,AAAUC,sBAAVD,UACGE;QATHX;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;;IAGA,IAAM,AAAEG,gBAAkBC,OAAMC,UAAU,CAACC,kCAAgB,EAAnDH;IACR,IAAMI,WAAWC,IAAAA,wBAAW;IAC5B,IAA2BC,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBC,OAAAA,0CAAQ;IAEhB,IAAId,OAAoCC;IAExC,IAAI,CAACA,WAAW;QACd,2DAA2D;QAC3DD,OAAOO,gBAAgB,UAAU,MAAM;IACzC,CAAC;IAED,IAAMQ,aAAaT,UAAUU,IAAI,KAAK;IAEtC,IACEC,QAAQC,GAAG,CAACC,QAAQ,KAAK,iBACzBJ,cACC,CAAA,CAACT,SAAS,CAAC,gBAAgB,IAAI,CAACA,SAAS,CAAC,KAAK,AAAD,GAC/C;QACAb,KACE;IAEJ,CAAC;IAED,IAAMW,WAAWW,cAAcV,iBAAiBe,YAAY,IAAIf,YAAY;IAE5E,IAAMgB,qBAAqBC,IAAAA,gBAAU,0BAEnCxB,cAAc;IAGhB,qBACE,0DACE,qBAACyB,gDACKjB;QACJF,UAAUA;QACVoB,KAAKzB;QACLI,WAAWmB,IAAAA,gBAAU,eAEnBX,aAAac,kBAAQ,CAACC,GAAG,sBACzBtC,eAAe,CAAC0B,MAAM,EACtBd,QACE,CAAA;YACEX,MAAMiC,IAAAA,gBAAU,0BAA6B;YAC7CK,OAAOL,IAAAA,gBAAU,2BAA8B;YAC/CM,MAAMN,IAAAA,gBAAU,0BAA6B;QAC/C,CAAA,CAAC,CAACtB,KAAK,EACT;YACE6B,CAAC;YACDC,CAAC;QACH,CAAC,CAAC5B,QAAQ,EACVC;QAGDR,QACAE,UACAkC,IAAAA,kBAAY,EAACnC,8BACZ,qBAACoC,kBAAQ;QAAC7B,SAAS;OAAiCP,eAIvDE,cAAc,wBACb,qBAACU,OAAMyB,QAAQ,sBACb,qBAACC,gBAAO;QACN/B,WAAWmB,IAAAA,gBAAU,EAACD;QACtBc,MAAM;sBAER,qBAACC,oBAAS;QACRjC,WAAWmB,IAAAA,gBAAU,EAACD;;AAMlC"}

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

@@ -2,6 +2,7 @@ import * as React from 'react';
 import { HasRootRef } from '../../types';
 export interface HeaderProps extends React.HTMLAttributes<HTMLElement>, HasRootRef<HTMLElement> {
     mode?: 'primary' | 'secondary' | 'tertiary';
+    size?: 'regular' | 'large';
     subtitle?: React.ReactNode;
     /**
      * Допускаются иконки, текст, Link
@@ -16,4 +17,4 @@ export interface HeaderProps extends React.HTMLAttributes<HTMLElement>, HasRootR
 /**
  * @see https://vkcom.github.io/VKUI/#/Header
  */
-export declare const Header: ({ mode, children, subtitle, indicator, aside, getRootRef, multiline, className, ...restProps }: HeaderProps) => JSX.Element;
+export declare const Header: ({ mode, size, children, subtitle, indicator, aside, getRootRef, multiline, className, ...restProps }: HeaderProps) => JSX.Element;

package/dist/cjs/components/Header/Header.js

@@ -1,112 +1,130 @@
 "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, "Header", {
+    enumerable: true,
+    get: function() {
+        return Header;
+    }
 });
-exports.Header = 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 _usePlatform = require("../../hooks/usePlatform");
 var _platform = require("../../lib/platform");
-var _Footnote = require("../Typography/Footnote/Footnote");
-var _Headline = require("../Typography/Headline/Headline");
-var _Subhead = require("../Typography/Subhead/Subhead");
-var _Text = require("../Typography/Text/Text");
-var _Title = require("../Typography/Title/Title");
-var _excluded = ["mode"],
-  _excluded2 = ["mode", "children", "subtitle", "indicator", "aside", "getRootRef", "multiline", "className"];
-var HeaderContent = function HeaderContent(_ref) {
-  var mode = _ref.mode,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var platform = (0, _usePlatform.usePlatform)();
-  if (platform === _platform.Platform.IOS) {
-    switch (mode) {
-      case 'primary':
-      case 'tertiary':
-        return /*#__PURE__*/React.createElement(_Title.Title, (0, _extends2.default)({
-          weight: "1",
-          level: "3"
-        }, restProps));
-      case 'secondary':
-        return /*#__PURE__*/React.createElement(_Footnote.Footnote, (0, _extends2.default)({
-          weight: "2",
-          caps: true
-        }, restProps));
+var _footnote = require("../Typography/Footnote/Footnote");
+var _headline = require("../Typography/Headline/Headline");
+var _subhead = require("../Typography/Subhead/Subhead");
+var _text = require("../Typography/Text/Text");
+var _title = require("../Typography/Title/Title");
+var HeaderContent = function(_param) {
+    var mode = _param.mode, size = _param.size, restProps = _objectWithoutProperties(_param, [
+        "mode",
+        "size"
+    ]);
+    var isLarge = size === "large";
+    var platform = (0, _usePlatform.usePlatform)();
+    if (platform === _platform.Platform.IOS) {
+        switch(mode){
+            case "primary":
+                return isLarge ? /*#__PURE__*/ _react.createElement(_title.Title, _objectSpread({
+                    level: "2",
+                    weight: "2"
+                }, restProps)) : /*#__PURE__*/ _react.createElement(_title.Title, _objectSpread({
+                    weight: "1",
+                    level: "3"
+                }, restProps));
+            case "tertiary":
+                return /*#__PURE__*/ _react.createElement(_title.Title, _objectSpread({
+                    weight: "1",
+                    level: "3"
+                }, restProps));
+            case "secondary":
+                return /*#__PURE__*/ _react.createElement(_footnote.Footnote, _objectSpread({
+                    weight: "2",
+                    caps: true
+                }, restProps));
+        }
     }
-  }
-  if (platform === _platform.Platform.VKCOM) {
-    switch (mode) {
-      case 'primary':
-        return /*#__PURE__*/React.createElement(_Headline.Headline, (0, _extends2.default)({
-          weight: "3"
-        }, restProps));
-      case 'secondary':
-      case 'tertiary':
-        return /*#__PURE__*/React.createElement(_Footnote.Footnote, restProps);
+    if (platform === _platform.Platform.VKCOM) {
+        switch(mode){
+            case "primary":
+                return isLarge ? /*#__PURE__*/ _react.createElement(_title.Title, _objectSpread({
+                    level: "2",
+                    weight: "1"
+                }, restProps)) : /*#__PURE__*/ _react.createElement(_headline.Headline, _objectSpread({
+                    weight: "3"
+                }, restProps));
+            case "secondary":
+            case "tertiary":
+                return /*#__PURE__*/ _react.createElement(_footnote.Footnote, restProps);
+        }
     }
-  }
-  switch (mode) {
-    case 'primary':
-    case 'tertiary':
-      return /*#__PURE__*/React.createElement(_Headline.Headline, (0, _extends2.default)({
-        weight: "2"
-      }, restProps));
-    case 'secondary':
-      return /*#__PURE__*/React.createElement(_Footnote.Footnote, (0, _extends2.default)({
-        weight: "1",
-        caps: true
-      }, restProps));
-  }
-  return null;
-};
-
-/**
- * @see https://vkcom.github.io/VKUI/#/Header
- */
-var Header = function Header(_ref2) {
-  var _ref2$mode = _ref2.mode,
-    mode = _ref2$mode === void 0 ? 'primary' : _ref2$mode,
-    children = _ref2.children,
-    subtitle = _ref2.subtitle,
-    indicator = _ref2.indicator,
-    aside = _ref2.aside,
-    getRootRef = _ref2.getRootRef,
-    multiline = _ref2.multiline,
-    className = _ref2.className,
-    restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
-  var platform = (0, _usePlatform.usePlatform)();
-  var AsideTypography = platform === _platform.Platform.VKCOM ? _Subhead.Subhead : _Text.Text;
-  var SubtitleTypography = mode === 'secondary' ? _Subhead.Subhead : _Footnote.Footnote;
-  return /*#__PURE__*/React.createElement("header", (0, _extends2.default)({}, restProps, {
-    ref: getRootRef,
-    className: (0, _vkjs.classNames)("vkuiHeader", platform === _platform.Platform.VKCOM && "vkuiHeader--vkcom", platform === _platform.Platform.ANDROID && "vkuiHeader--android", platform === _platform.Platform.IOS && "vkuiHeader--ios", styles["Header--mode-".concat(mode)], (0, _vkjs.isPrimitiveReactNode)(indicator) && "vkuiHeader--pi", className)
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "vkuiHeader__main"
-  }, /*#__PURE__*/React.createElement(HeaderContent, {
-    className: "vkuiHeader__content",
-    Component: "span",
-    mode: mode
-  }, /*#__PURE__*/React.createElement("span", {
-    className: (0, _vkjs.classNames)("vkuiHeader__content-in", multiline && "vkuiHeader__content-in--multiline")
-  }, children), (0, _vkjs.hasReactNode)(indicator) && /*#__PURE__*/React.createElement(_Footnote.Footnote, {
-    className: "vkuiHeader__indicator",
-    weight: mode === 'primary' || mode === 'secondary' ? '1' : undefined
-  }, indicator)), (0, _vkjs.hasReactNode)(subtitle) && /*#__PURE__*/React.createElement(SubtitleTypography, {
-    className: "vkuiHeader__subtitle",
-    Component: "span"
-  }, subtitle)), (0, _vkjs.hasReactNode)(aside) && /*#__PURE__*/React.createElement(AsideTypography, {
-    className: "vkuiHeader__aside",
-    Component: "span"
-  }, aside));
+    switch(mode){
+        case "primary":
+            return isLarge ? /*#__PURE__*/ _react.createElement(_title.Title, _objectSpread({
+                level: "2",
+                weight: "2"
+            }, restProps)) : /*#__PURE__*/ _react.createElement(_headline.Headline, _objectSpread({
+                weight: "2"
+            }, restProps));
+        case "tertiary":
+            return /*#__PURE__*/ _react.createElement(_headline.Headline, _objectSpread({
+                weight: "2"
+            }, restProps));
+        case "secondary":
+            return /*#__PURE__*/ _react.createElement(_footnote.Footnote, _objectSpread({
+                weight: "1",
+                caps: true
+            }, restProps));
+    }
+    return null;
 };
-exports.Header = Header;
-var styles = {
-  "Header--mode-primary": "vkuiHeader--mode-primary",
-  "Header--mode-secondary": "vkuiHeader--mode-secondary",
-  "Header--mode-tertiary": "vkuiHeader--mode-tertiary"
+var Header = function(_param) {
+    var _param_mode = _param.mode, mode = _param_mode === void 0 ? "primary" : _param_mode, _param_size = _param.size, size = _param_size === void 0 ? "regular" : _param_size, children = _param.children, subtitle = _param.subtitle, indicator = _param.indicator, aside = _param.aside, getRootRef = _param.getRootRef, multiline = _param.multiline, className = _param.className, restProps = _objectWithoutProperties(_param, [
+        "mode",
+        "size",
+        "children",
+        "subtitle",
+        "indicator",
+        "aside",
+        "getRootRef",
+        "multiline",
+        "className"
+    ]);
+    var platform = (0, _usePlatform.usePlatform)();
+    var AsideTypography = platform === _platform.Platform.VKCOM ? _subhead.Subhead : _text.Text;
+    var SubtitleTypography = mode === "secondary" ? _subhead.Subhead : _footnote.Footnote;
+    return /*#__PURE__*/ _react.createElement("header", _objectSpreadProps(_objectSpread({}, restProps), {
+        ref: getRootRef,
+        className: (0, _vkjs.classNames)("vkuiHeader", platform === _platform.Platform.VKCOM && "vkuiHeader--vkcom", platform === _platform.Platform.ANDROID && "vkuiHeader--android", platform === _platform.Platform.IOS && "vkuiHeader--ios", {
+            primary: "vkuiHeader--mode-primary",
+            secondary: "vkuiHeader--mode-secondary",
+            tertiary: "vkuiHeader--mode-tertiary"
+        }[mode], (0, _vkjs.isPrimitiveReactNode)(indicator) && "vkuiHeader--pi", className)
+    }), /*#__PURE__*/ _react.createElement("div", {
+        className: "vkuiHeader__main"
+    }, /*#__PURE__*/ _react.createElement(HeaderContent, {
+        className: "vkuiHeader__content",
+        Component: "span",
+        mode: mode,
+        size: size
+    }, /*#__PURE__*/ _react.createElement("span", {
+        className: (0, _vkjs.classNames)("vkuiHeader__content-in", multiline && "vkuiHeader__content-in--multiline")
+    }, children), (0, _vkjs.hasReactNode)(indicator) && /*#__PURE__*/ _react.createElement(_footnote.Footnote, {
+        className: "vkuiHeader__indicator",
+        weight: mode === "primary" || mode === "secondary" ? "1" : undefined
+    }, indicator)), (0, _vkjs.hasReactNode)(subtitle) && /*#__PURE__*/ _react.createElement(SubtitleTypography, {
+        className: "vkuiHeader__subtitle",
+        Component: "span"
+    }, subtitle)), (0, _vkjs.hasReactNode)(aside) && /*#__PURE__*/ _react.createElement(AsideTypography, {
+        className: "vkuiHeader__aside",
+        Component: "span"
+    }, aside));
 };
+
 //# sourceMappingURL=Header.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Header.js","names":["HeaderContent","mode","restProps","platform","usePlatform","Platform","IOS","VKCOM","Header","children","subtitle","indicator","aside","getRootRef","multiline","className","AsideTypography","Subhead","Text","SubtitleTypography","Footnote","classNames","ANDROID","styles","isPrimitiveReactNode","hasReactNode","undefined"],"sources":["../../../../src/components/Header/Header.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode, isPrimitiveReactNode } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Header.module.css';\n\nexport interface HeaderProps extends React.HTMLAttributes<HTMLElement>, HasRootRef<HTMLElement> {\n  mode?: 'primary' | 'secondary' | 'tertiary';\n  subtitle?: React.ReactNode;\n  /**\n   * Допускаются иконки, текст, Link\n   */\n  aside?: React.ReactNode;\n  /**\n   * Допускаются текст, Indicator\n   */\n  indicator?: React.ReactNode;\n  multiline?: boolean;\n}\n\ntype HeaderContentProps = Pick<HeaderProps, 'children' | 'mode' | 'className'> & HasComponent;\n\nconst HeaderContent = ({ mode, ...restProps }: HeaderContentProps) => {\n  const platform = usePlatform();\n  if (platform === Platform.IOS) {\n    switch (mode) {\n      case 'primary':\n      case 'tertiary':\n        return <Title weight=\"1\" level=\"3\" {...restProps} />;\n      case 'secondary':\n        return <Footnote weight=\"2\" caps {...restProps} />;\n    }\n  }\n\n  if (platform === Platform.VKCOM) {\n    switch (mode) {\n      case 'primary':\n        return <Headline weight=\"3\" {...restProps} />;\n      case 'secondary':\n      case 'tertiary':\n        return <Footnote {...restProps} />;\n    }\n  }\n\n  switch (mode) {\n    case 'primary':\n    case 'tertiary':\n      return <Headline weight=\"2\" {...restProps} />;\n    case 'secondary':\n      return <Footnote weight=\"1\" caps {...restProps} />;\n  }\n\n  return null;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Header\n */\nexport const Header = ({\n  mode = 'primary',\n  children,\n  subtitle,\n  indicator,\n  aside,\n  getRootRef,\n  multiline,\n  className,\n  ...restProps\n}: HeaderProps) => {\n  const platform = usePlatform();\n\n  const AsideTypography = platform === Platform.VKCOM ? Subhead : Text;\n  const SubtitleTypography = mode === 'secondary' ? Subhead : Footnote;\n\n  return (\n    <header\n      {...restProps}\n      ref={getRootRef}\n      className={classNames(\n        styles['Header'],\n        platform === Platform.VKCOM && styles['Header--vkcom'],\n        platform === Platform.ANDROID && styles['Header--android'],\n        platform === Platform.IOS && styles['Header--ios'],\n        styles[`Header--mode-${mode}`],\n        isPrimitiveReactNode(indicator) && styles['Header--pi'],\n        className,\n      )}\n    >\n      <div className={styles['Header__main']}>\n        <HeaderContent className={styles['Header__content']} Component=\"span\" mode={mode}>\n          <span\n            className={classNames(\n              styles['Header__content-in'],\n              multiline && styles['Header__content-in--multiline'],\n            )}\n          >\n            {children}\n          </span>\n          {hasReactNode(indicator) && (\n            <Footnote\n              className={styles['Header__indicator']}\n              weight={mode === 'primary' || mode === 'secondary' ? '1' : undefined}\n            >\n              {indicator}\n            </Footnote>\n          )}\n        </HeaderContent>\n\n        {hasReactNode(subtitle) && (\n          <SubtitleTypography className={styles['Header__subtitle']} Component=\"span\">\n            {subtitle}\n          </SubtitleTypography>\n        )}\n      </div>\n\n      {hasReactNode(aside) && (\n        <AsideTypography className={styles['Header__aside']} Component=\"span\">\n          {aside}\n        </AsideTypography>\n      )}\n    </header>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Header/Header.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode, isPrimitiveReactNode } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Header.module.css';\n\nexport interface HeaderProps extends React.HTMLAttributes<HTMLElement>, HasRootRef<HTMLElement> {\n  mode?: 'primary' | 'secondary' | 'tertiary';\n  size?: 'regular' | 'large';\n  subtitle?: React.ReactNode;\n  /**\n   * Допускаются иконки, текст, Link\n   */\n  aside?: React.ReactNode;\n  /**\n   * Допускаются текст, Indicator\n   */\n  indicator?: React.ReactNode;\n  multiline?: boolean;\n}\n\ntype HeaderContentProps = Pick<HeaderProps, 'children' | 'mode' | 'size' | 'className'> &\n  HasComponent;\n\nconst HeaderContent = ({ mode, size, ...restProps }: HeaderContentProps) => {\n  const isLarge = size === 'large';\n\n  const platform = usePlatform();\n  if (platform === Platform.IOS) {\n    switch (mode) {\n      case 'primary':\n        return isLarge ? (\n          <Title level=\"2\" weight=\"2\" {...restProps} />\n        ) : (\n          <Title weight=\"1\" level=\"3\" {...restProps} />\n        );\n      case 'tertiary':\n        return <Title weight=\"1\" level=\"3\" {...restProps} />;\n      case 'secondary':\n        return <Footnote weight=\"2\" caps {...restProps} />;\n    }\n  }\n\n  if (platform === Platform.VKCOM) {\n    switch (mode) {\n      case 'primary':\n        return isLarge ? (\n          <Title level=\"2\" weight=\"1\" {...restProps} />\n        ) : (\n          <Headline weight=\"3\" {...restProps} />\n        );\n      case 'secondary':\n      case 'tertiary':\n        return <Footnote {...restProps} />;\n    }\n  }\n\n  switch (mode) {\n    case 'primary':\n      return isLarge ? (\n        <Title level=\"2\" weight=\"2\" {...restProps} />\n      ) : (\n        <Headline weight=\"2\" {...restProps} />\n      );\n    case 'tertiary':\n      return <Headline weight=\"2\" {...restProps} />;\n    case 'secondary':\n      return <Footnote weight=\"1\" caps {...restProps} />;\n  }\n\n  return null;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Header\n */\nexport const Header = ({\n  mode = 'primary',\n  size = 'regular',\n  children,\n  subtitle,\n  indicator,\n  aside,\n  getRootRef,\n  multiline,\n  className,\n  ...restProps\n}: HeaderProps) => {\n  const platform = usePlatform();\n\n  const AsideTypography = platform === Platform.VKCOM ? Subhead : Text;\n  const SubtitleTypography = mode === 'secondary' ? Subhead : Footnote;\n\n  return (\n    <header\n      {...restProps}\n      ref={getRootRef}\n      className={classNames(\n        styles['Header'],\n        platform === Platform.VKCOM && styles['Header--vkcom'],\n        platform === Platform.ANDROID && styles['Header--android'],\n        platform === Platform.IOS && styles['Header--ios'],\n        {\n          primary: styles['Header--mode-primary'],\n          secondary: styles['Header--mode-secondary'],\n          tertiary: styles['Header--mode-tertiary'],\n        }[mode],\n        isPrimitiveReactNode(indicator) && styles['Header--pi'],\n        className,\n      )}\n    >\n      <div className={styles['Header__main']}>\n        <HeaderContent\n          className={styles['Header__content']}\n          Component=\"span\"\n          mode={mode}\n          size={size}\n        >\n          <span\n            className={classNames(\n              styles['Header__content-in'],\n              multiline && styles['Header__content-in--multiline'],\n            )}\n          >\n            {children}\n          </span>\n          {hasReactNode(indicator) && (\n            <Footnote\n              className={styles['Header__indicator']}\n              weight={mode === 'primary' || mode === 'secondary' ? '1' : undefined}\n            >\n              {indicator}\n            </Footnote>\n          )}\n        </HeaderContent>\n\n        {hasReactNode(subtitle) && (\n          <SubtitleTypography className={styles['Header__subtitle']} Component=\"span\">\n            {subtitle}\n          </SubtitleTypography>\n        )}\n      </div>\n\n      {hasReactNode(aside) && (\n        <AsideTypography className={styles['Header__aside']} Component=\"span\">\n          {aside}\n        </AsideTypography>\n      )}\n    </header>\n  );\n};\n"],"names":["Header","HeaderContent","mode","size","restProps","isLarge","platform","usePlatform","Platform","IOS","Title","level","weight","Footnote","caps","VKCOM","Headline","children","subtitle","indicator","aside","getRootRef","multiline","className","AsideTypography","Subhead","Text","SubtitleTypography","header","ref","classNames","ANDROID","primary","secondary","tertiary","isPrimitiveReactNode","div","Component","span","hasReactNode","undefined"],"mappings":";;;;+BAkFaA;;;eAAAA;;;;;;;2DAlFU;oBACwC;2BACnC;wBACH;wBAEA;wBACA;uBACD;oBACH;qBACC;AAqBtB,IAAMC,gBAAgB,iBAAsD;QAAnDC,cAAAA,MAAMC,cAAAA,MAASC;QAAfF;QAAMC;;IAC7B,IAAME,UAAUF,SAAS;IAEzB,IAAMG,WAAWC,IAAAA,wBAAW;IAC5B,IAAID,aAAaE,kBAAQ,CAACC,GAAG,EAAE;QAC7B,OAAQP;YACN,KAAK;gBACH,OAAOG,wBACL,qBAACK,YAAK;oBAACC,OAAM;oBAAIC,QAAO;mBAAQR,4BAEhC,qBAACM,YAAK;oBAACE,QAAO;oBAAID,OAAM;mBAAQP,WACjC;YACH,KAAK;gBACH,qBAAO,qBAACM,YAAK;oBAACE,QAAO;oBAAID,OAAM;mBAAQP;YACzC,KAAK;gBACH,qBAAO,qBAACS,kBAAQ;oBAACD,QAAO;oBAAIE,MAAAA,IAAI;mBAAKV;QACzC;IACF,CAAC;IAED,IAAIE,aAAaE,kBAAQ,CAACO,KAAK,EAAE;QAC/B,OAAQb;YACN,KAAK;gBACH,OAAOG,wBACL,qBAACK,YAAK;oBAACC,OAAM;oBAAIC,QAAO;mBAAQR,4BAEhC,qBAACY,kBAAQ;oBAACJ,QAAO;mBAAQR,WAC1B;YACH,KAAK;YACL,KAAK;gBACH,qBAAO,qBAACS,kBAAQ,EAAKT;QACzB;IACF,CAAC;IAED,OAAQF;QACN,KAAK;YACH,OAAOG,wBACL,qBAACK,YAAK;gBAACC,OAAM;gBAAIC,QAAO;eAAQR,4BAEhC,qBAACY,kBAAQ;gBAACJ,QAAO;eAAQR,WAC1B;QACH,KAAK;YACH,qBAAO,qBAACY,kBAAQ;gBAACJ,QAAO;eAAQR;QAClC,KAAK;YACH,qBAAO,qBAACS,kBAAQ;gBAACD,QAAO;gBAAIE,MAAAA,IAAI;eAAKV;IACzC;IAEA,OAAO,IAAI;AACb;AAKO,IAAMJ,SAAS,iBAWH;6BAVjBE,MAAAA,gCAAO,8CACPC,MAAAA,gCAAO,yBACPc,kBAAAA,UACAC,kBAAAA,UACAC,mBAAAA,WACAC,eAAAA,OACAC,oBAAAA,YACAC,mBAAAA,WACAC,mBAAAA,WACGnB;QATHF;QACAC;QACAc;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAMjB,WAAWC,IAAAA,wBAAW;IAE5B,IAAMiB,kBAAkBlB,aAAaE,kBAAQ,CAACO,KAAK,GAAGU,gBAAO,GAAGC,UAAI;IACpE,IAAMC,qBAAqBzB,SAAS,cAAcuB,gBAAO,GAAGZ,kBAAQ;IAEpE,qBACE,qBAACe,+CACKxB;QACJyB,KAAKR;QACLE,WAAWO,IAAAA,gBAAU,gBAEnBxB,aAAaE,kBAAQ,CAACO,KAAK,yBAC3BT,aAAaE,kBAAQ,CAACuB,OAAO,2BAC7BzB,aAAaE,kBAAQ,CAACC,GAAG,uBACzB;YACEuB,OAAO;YACPC,SAAS;YACTC,QAAQ;QACV,CAAC,CAAChC,KAAK,EACPiC,IAAAA,0BAAoB,EAAChB,gCACrBI;sBAGF,qBAACa;QAAIb,SAAS;qBACZ,qBAACtB;QACCsB,SAAS;QACTc,WAAU;QACVnC,MAAMA;QACNC,MAAMA;qBAEN,qBAACmC;QACCf,WAAWO,IAAAA,gBAAU,4BAEnBR;OAGDL,WAEFsB,IAAAA,kBAAY,EAACpB,4BACZ,qBAACN,kBAAQ;QACPU,SAAS;QACTX,QAAQV,SAAS,aAAaA,SAAS,cAAc,MAAMsC,SAAS;OAEnErB,aAKNoB,IAAAA,kBAAY,EAACrB,2BACZ,qBAACS;QAAmBJ,SAAS;QAA8Bc,WAAU;OAClEnB,YAKNqB,IAAAA,kBAAY,EAACnB,wBACZ,qBAACI;QAAgBD,SAAS;QAA2Bc,WAAU;OAC5DjB;AAKX"}