@vkontakte/vkui 5.0.0 → 5.0.2

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeader.js","names":["PanelHeaderIn","before","after","separator","children","React","useContext","ConfigProviderContext","webviewType","ModalRootContext","isInsideModal","platform","usePlatform","Platform","VKCOM","WebviewType","INTERNAL","PanelHeader","visor","transparent","shadow","getRef","getRootRef","fixed","restProps","useAdaptivity","sizeX","isFixed","undefined","classNames","getPlatformClassName","VKAPPS","getSizeXClassName"],"sources":["../../../../src/components/PanelHeader/PanelHeader.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getPlatformClassName } from \"../../helpers/getPlatformClassName\";\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { FixedLayout } from \"../FixedLayout/FixedLayout\";\nimport { Separator } from \"../Separator/Separator\";\nimport { Platform } from \"../../lib/platform\";\nimport { HasRef, HasRootRef } from \"../../types\";\nimport {\n  ConfigProviderContext,\n  WebviewType,\n} from \"../ConfigProvider/ConfigProviderContext\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { TooltipContainer } from \"../Tooltip/TooltipContainer\";\nimport { ModalRootContext } from \"../ModalRoot/ModalRootContext\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { Spacing } from \"../Spacing/Spacing\";\nimport { SizeXConditionalRender } from \"../SizeXConditionalRender/SizeXConditionalRender\";\nimport \"./PanelHeader.css\";\n\nexport interface PanelHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRef<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  before?: React.ReactNode;\n  after?: React.ReactNode;\n  separator?: boolean;\n  transparent?: boolean;\n  shadow?: boolean;\n  /**\n   * Если `false`, то шапка будет нулевой высоты и контент панели \"залезет\" под неё\n   */\n  visor?: boolean;\n  /**\n   * Если `false`, то шапка будет в потоке. По умолчанию `true`, но если платформа vkcom, то по умолчанию `false`.\n   */\n  fixed?: boolean;\n}\n\nconst PanelHeaderIn = ({\n  before,\n  after,\n  separator,\n  children,\n}: PanelHeaderProps) => {\n  const { webviewType } = React.useContext(ConfigProviderContext);\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n\n  return (\n    <React.Fragment>\n      <TooltipContainer fixed vkuiClass=\"PanelHeader__in\">\n        <div vkuiClass=\"PanelHeader__before\">{before}</div>\n        <div vkuiClass=\"PanelHeader__content\">\n          {platform === Platform.VKCOM ? (\n            <Text weight=\"2\">{children}</Text>\n          ) : (\n            <span vkuiClass=\"PanelHeader__content-in\">{children}</span>\n          )}\n        </div>\n        <div vkuiClass=\"PanelHeader__after\">\n          {(webviewType === WebviewType.INTERNAL || isInsideModal) && after}\n        </div>\n      </TooltipContainer>\n      {separator && platform === Platform.VKCOM && <Separator wide />}\n    </React.Fragment>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeader\n */\nexport const PanelHeader = ({\n  before,\n  children,\n  after,\n  separator = true,\n  visor = true,\n  transparent = false,\n  shadow,\n  getRef,\n  getRootRef,\n  fixed,\n  ...restProps\n}: PanelHeaderProps) => {\n  const platform = usePlatform();\n  const { webviewType } = React.useContext(ConfigProviderContext);\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const { sizeX } = useAdaptivity();\n  let isFixed = fixed !== undefined ? fixed : platform !== Platform.VKCOM;\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(\n        \"PanelHeader\",\n        getPlatformClassName(\"PanelHeader\", platform),\n        transparent && \"PanelHeader--trnsp\",\n        shadow && \"PanelHeader--shadow\",\n        visor && \"PanelHeader--vis\",\n        separator && visor && \"PanelHeader--sep\",\n        webviewType === WebviewType.VKAPPS &&\n          !isInsideModal &&\n          \"PanelHeader--vkapps\",\n        !before && \"PanelHeader--no-before\",\n        !after && \"PanelHeader--no-after\",\n        isFixed && \"PanelHeader--fixed\",\n        getSizeXClassName(\"PanelHeader\", sizeX)\n      )}\n      ref={isFixed ? getRootRef : getRef}\n    >\n      {isFixed ? (\n        <FixedLayout\n          vkuiClass=\"PanelHeader__fixed\"\n          vertical=\"top\"\n          getRootRef={getRef}\n        >\n          <PanelHeaderIn before={before} after={after} separator={separator}>\n            {children}\n          </PanelHeaderIn>\n        </FixedLayout>\n      ) : (\n        <PanelHeaderIn before={before} after={after} separator={separator}>\n          {children}\n        </PanelHeaderIn>\n      )}\n      {separator && visor && platform !== Platform.VKCOM && (\n        <SizeXConditionalRender\n          compact={<Separator />}\n          regular={<Spacing size={16} />}\n        />\n      )}\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"PanelHeader.js","names":["PanelHeaderIn","before","after","separator","children","useConfigProvider","webviewType","React","useContext","ModalRootContext","isInsideModal","platform","usePlatform","Platform","VKCOM","WebviewType","INTERNAL","PanelHeader","visor","transparent","shadow","getRef","getRootRef","fixed","className","restProps","useAdaptivity","sizeX","useAdaptivityConditionalRender","adaptiveSizeX","isFixed","undefined","classNamesString","getPlatformClassName","VKAPPS","getSizeXClassName","compact","regular"],"sources":["../../../../src/components/PanelHeader/PanelHeader.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getPlatformClassName } from \"../../helpers/getPlatformClassName\";\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { FixedLayout } from \"../FixedLayout/FixedLayout\";\nimport { Separator } from \"../Separator/Separator\";\nimport { Platform } from \"../../lib/platform\";\nimport { HasRef, HasRootRef } from \"../../types\";\nimport {\n  useConfigProvider,\n  WebviewType,\n} from \"../ConfigProvider/ConfigProviderContext\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { TooltipContainer } from \"../Tooltip/TooltipContainer\";\nimport { ModalRootContext } from \"../ModalRoot/ModalRootContext\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useAdaptivityConditionalRender } from \"../../hooks/useAdaptivityConditionalRender\";\nimport { Spacing } from \"../Spacing/Spacing\";\nimport styles from \"./PanelHeader.module.css\";\n\nexport interface PanelHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRef<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  before?: React.ReactNode;\n  after?: React.ReactNode;\n  separator?: boolean;\n  transparent?: boolean;\n  shadow?: boolean;\n  /**\n   * Если `false`, то шапка будет нулевой высоты и контент панели \"залезет\" под неё\n   */\n  visor?: boolean;\n  /**\n   * Если `false`, то шапка будет в потоке. По умолчанию `true`, но если платформа vkcom, то по умолчанию `false`.\n   */\n  fixed?: boolean;\n}\n\nconst PanelHeaderIn = ({\n  before,\n  after,\n  separator,\n  children,\n}: PanelHeaderProps) => {\n  const { webviewType } = useConfigProvider();\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n\n  return (\n    <React.Fragment>\n      <TooltipContainer fixed className={styles[\"PanelHeader__in\"]}>\n        <div className={styles[\"PanelHeader__before\"]}>{before}</div>\n        <div className={styles[\"PanelHeader__content\"]}>\n          {platform === Platform.VKCOM ? (\n            <Text weight=\"2\">{children}</Text>\n          ) : (\n            <span className={styles[\"PanelHeader__content-in\"]}>\n              {children}\n            </span>\n          )}\n        </div>\n        <div className={styles[\"PanelHeader__after\"]}>\n          {(webviewType === WebviewType.INTERNAL || isInsideModal) && after}\n        </div>\n      </TooltipContainer>\n      {separator && platform === Platform.VKCOM && <Separator wide />}\n    </React.Fragment>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeader\n */\nexport const PanelHeader = ({\n  before,\n  children,\n  after,\n  separator = true,\n  visor = true,\n  transparent = false,\n  shadow,\n  getRef,\n  getRootRef,\n  fixed,\n  className,\n  ...restProps\n}: PanelHeaderProps) => {\n  const platform = usePlatform();\n  const { webviewType } = useConfigProvider();\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const { sizeX } = useAdaptivity();\n  const { sizeX: adaptiveSizeX } = useAdaptivityConditionalRender();\n  let isFixed = fixed !== undefined ? fixed : platform !== Platform.VKCOM;\n\n  return (\n    <div\n      {...restProps}\n      className={classNamesString(\n        styles[\"PanelHeader\"],\n        getPlatformClassName(styles[\"PanelHeader\"], platform),\n        transparent && styles[\"PanelHeader--trnsp\"],\n        shadow && styles[\"PanelHeader--shadow\"],\n        visor && styles[\"PanelHeader--vis\"],\n        separator && visor && styles[\"PanelHeader--sep\"],\n        webviewType === WebviewType.VKAPPS &&\n          !isInsideModal &&\n          styles[\"PanelHeader--vkapps\"],\n        !before && styles[\"PanelHeader--no-before\"],\n        !after && styles[\"PanelHeader--no-after\"],\n        isFixed && styles[\"PanelHeader--fixed\"],\n        getSizeXClassName(styles[\"PanelHeader\"], sizeX),\n        className\n      )}\n      ref={isFixed ? getRootRef : getRef}\n    >\n      {isFixed ? (\n        <FixedLayout\n          className={styles[\"PanelHeader__fixed\"]}\n          vertical=\"top\"\n          getRootRef={getRef}\n        >\n          <PanelHeaderIn before={before} after={after} separator={separator}>\n            {children}\n          </PanelHeaderIn>\n        </FixedLayout>\n      ) : (\n        <PanelHeaderIn before={before} after={after} separator={separator}>\n          {children}\n        </PanelHeaderIn>\n      )}\n      {separator && visor && platform !== Platform.VKCOM && (\n        <React.Fragment>\n          {adaptiveSizeX.compact && (\n            <Separator className={adaptiveSizeX.compact.className} />\n          )}\n          {adaptiveSizeX.regular && (\n            <Spacing className={adaptiveSizeX.regular.className} size={16} />\n          )}\n        </React.Fragment>\n      )}\n    </div>\n  );\n};\n"],"mappings":"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"}

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { PanelHeaderButtonProps } from "../PanelHeaderButton/PanelHeaderButton";
+export declare type PanelHeaderBackProps = PanelHeaderButtonProps & {
+    "aria-label"?: string;
+};
+/**
+ * @see https://vkcom.github.io/VKUI/#/PanelHeaderBack
+ */
+export declare const PanelHeaderBack: ({ label, "aria-label": ariaLabel, className, ...restProps }: PanelHeaderButtonProps) => JSX.Element;

package/dist/cjs/components/PanelHeaderBack/PanelHeaderBack.js

@@ -1,68 +1,51 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PanelHeaderBack = void 0;
-
-var _jsxRuntime = require("../../lib/jsxRuntime");
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
+var React = _interopRequireWildcard(require("react"));
 var _icons = require("@vkontakte/icons");
-
 var _PanelHeaderButton = require("../PanelHeaderButton/PanelHeaderButton");
-
 var _platform = require("../../lib/platform");
-
 var _getSizeXClassName = require("../../helpers/getSizeXClassName");
-
 var _usePlatform = require("../../hooks/usePlatform");
-
 var _classNames = require("../../lib/classNames");
-
 var _useAdaptivity2 = require("../../hooks/useAdaptivity");
-
-var _excluded = ["label", "aria-label"];
-
+var _excluded = ["label", "aria-label", "className"];
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderBack
  */
 var PanelHeaderBack = function PanelHeaderBack(_ref) {
   var label = _ref.label,
-      _ref$ariaLabel = _ref["aria-label"],
-      ariaLabel = _ref$ariaLabel === void 0 ? "Назад" : _ref$ariaLabel,
-      restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+    _ref$ariaLabel = _ref["aria-label"],
+    ariaLabel = _ref$ariaLabel === void 0 ? "Назад" : _ref$ariaLabel,
+    className = _ref.className,
+    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var platform = (0, _usePlatform.usePlatform)();
-
   var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
-      sizeX = _useAdaptivity.sizeX; // так-же label нужно скрывать при platform === Platform.IOS && sizeX === regular
+    sizeX = _useAdaptivity.sizeX;
+  // так-же label нужно скрывать при platform === Platform.IOS && sizeX === regular
   // https://github.com/VKCOM/VKUI/blob/master/src/components/PanelHeaderButton/PanelHeaderButton.css#L104
-
-
   var showLabel = platform === _platform.Platform.VKCOM || platform === _platform.Platform.IOS;
-  var icon = (0, _jsxRuntime.createScopedElement)(_icons.Icon28ArrowLeftOutline, null);
-
+  var icon = /*#__PURE__*/React.createElement(_icons.Icon28ArrowLeftOutline, null);
   switch (platform) {
     case _platform.Platform.IOS:
-      icon = (0, _jsxRuntime.createScopedElement)(_icons.Icon28ChevronBack, null);
+      icon = /*#__PURE__*/React.createElement(_icons.Icon28ChevronBack, null);
       break;
-
     case _platform.Platform.VKCOM:
-      icon = (0, _jsxRuntime.createScopedElement)(_icons.Icon28ChevronLeftOutline, null);
+      icon = /*#__PURE__*/React.createElement(_icons.Icon28ChevronLeftOutline, null);
       break;
   }
-
-  return (0, _jsxRuntime.createScopedElement)(_PanelHeaderButton.PanelHeaderButton, (0, _extends2.default)({}, restProps, {
-    vkuiClass: (0, _classNames.classNames)("PanelHeaderBack", (0, _getSizeXClassName.getSizeXClassName)("PanelHeaderBack", sizeX), platform === _platform.Platform.IOS && "PanelHeaderBack--ios", platform === _platform.Platform.VKCOM && "PanelHeaderBack--vkcom", showLabel && !!label && "PanelHeaderBack--has-label"),
+  return /*#__PURE__*/React.createElement(_PanelHeaderButton.PanelHeaderButton, (0, _extends2.default)({}, restProps, {
+    className: (0, _classNames.classNamesString)("vkuiPanelHeaderBack", (0, _getSizeXClassName.getSizeXClassName)("vkuiPanelHeaderBack", sizeX), platform === _platform.Platform.IOS && "vkuiPanelHeaderBack--ios", platform === _platform.Platform.VKCOM && "vkuiPanelHeaderBack--vkcom", showLabel && !!label && "vkuiPanelHeaderBack--has-label", className),
     label: showLabel && label,
     "aria-label": ariaLabel
   }), icon);
 };
-
 exports.PanelHeaderBack = PanelHeaderBack;
 //# sourceMappingURL=PanelHeaderBack.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderBack.js","names":["PanelHeaderBack","label","ariaLabel","restProps","platform","usePlatform","useAdaptivity","sizeX","showLabel","Platform","VKCOM","IOS","icon","classNames","getSizeXClassName"],"sources":["../../../../src/components/PanelHeaderBack/PanelHeaderBack.tsx"],"sourcesContent":["import {\n  Icon28ChevronBack,\n  Icon28ChevronLeftOutline,\n  Icon28ArrowLeftOutline,\n} from \"@vkontakte/icons\";\nimport {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Platform } from \"../../lib/platform\";\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { classNames } from \"../../lib/classNames\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport \"./PanelHeaderBack.css\";\n\nexport type PanelHeaderBackProps = PanelHeaderButtonProps & {\n  \"aria-label\"?: string;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderBack\n */\nexport const PanelHeaderBack = ({\n  label,\n  \"aria-label\": ariaLabel = \"Назад\",\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n  const { sizeX } = useAdaptivity();\n  // так-же label нужно скрывать при platform === Platform.IOS && sizeX === regular\n  // https://github.com/VKCOM/VKUI/blob/master/src/components/PanelHeaderButton/PanelHeaderButton.css#L104\n  const showLabel = platform === Platform.VKCOM || platform === Platform.IOS;\n\n  let icon = <Icon28ArrowLeftOutline />;\n  switch (platform) {\n    case Platform.IOS:\n      icon = <Icon28ChevronBack />;\n      break;\n    case Platform.VKCOM:\n      icon = <Icon28ChevronLeftOutline />;\n      break;\n  }\n\n  return (\n    <PanelHeaderButton\n      {...restProps}\n      vkuiClass={classNames(\n        \"PanelHeaderBack\",\n        getSizeXClassName(\"PanelHeaderBack\", sizeX),\n        platform === Platform.IOS && \"PanelHeaderBack--ios\",\n        platform === Platform.VKCOM && \"PanelHeaderBack--vkcom\",\n        showLabel && !!label && \"PanelHeaderBack--has-label\"\n      )}\n      label={showLabel && label}\n      aria-label={ariaLabel}\n    >\n      {icon}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAAA;;AAKA;;AAIA;;AACA;;AACA;;AACA;;AACA;;;;AAOA;AACA;AACA;AACO,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,OAID;EAAA,IAH5BC,KAG4B,QAH5BA,KAG4B;EAAA,0BAF5B,YAE4B;EAAA,IAFdC,SAEc,+BAFF,OAEE;EAAA,IADzBC,SACyB;EAC5B,IAAMC,QAAQ,GAAG,IAAAC,wBAAA,GAAjB;;EACA,qBAAkB,IAAAC,6BAAA,GAAlB;EAAA,IAAQC,KAAR,kBAAQA,KAAR,CAF4B,CAG5B;EACA;;;EACA,IAAMC,SAAS,GAAGJ,QAAQ,KAAKK,kBAAA,CAASC,KAAtB,IAA+BN,QAAQ,KAAKK,kBAAA,CAASE,GAAvE;EAEA,IAAIC,IAAI,GAAG,qCAAC,6BAAD,OAAX;;EACA,QAAQR,QAAR;IACE,KAAKK,kBAAA,CAASE,GAAd;MACEC,IAAI,GAAG,qCAAC,wBAAD,OAAP;MACA;;IACF,KAAKH,kBAAA,CAASC,KAAd;MACEE,IAAI,GAAG,qCAAC,+BAAD,OAAP;MACA;EANJ;;EASA,OACE,qCAAC,oCAAD,6BACMT,SADN;IAEE,SAAS,EAAE,IAAAU,sBAAA,EACT,iBADS,EAET,IAAAC,oCAAA,EAAkB,iBAAlB,EAAqCP,KAArC,CAFS,EAGTH,QAAQ,KAAKK,kBAAA,CAASE,GAAtB,IAA6B,sBAHpB,EAITP,QAAQ,KAAKK,kBAAA,CAASC,KAAtB,IAA+B,wBAJtB,EAKTF,SAAS,IAAI,CAAC,CAACP,KAAf,IAAwB,4BALf,CAFb;IASE,KAAK,EAAEO,SAAS,IAAIP,KATtB;IAUE,cAAYC;EAVd,IAYGU,IAZH,CADF;AAgBD,CArCM"}
+{"version":3,"file":"PanelHeaderBack.js","names":["PanelHeaderBack","label","ariaLabel","className","restProps","platform","usePlatform","useAdaptivity","sizeX","showLabel","Platform","VKCOM","IOS","icon","classNamesString","getSizeXClassName"],"sources":["../../../../src/components/PanelHeaderBack/PanelHeaderBack.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {\n  Icon28ChevronBack,\n  Icon28ChevronLeftOutline,\n  Icon28ArrowLeftOutline,\n} from \"@vkontakte/icons\";\nimport {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Platform } from \"../../lib/platform\";\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport styles from \"./PanelHeaderBack.module.css\";\n\nexport type PanelHeaderBackProps = PanelHeaderButtonProps & {\n  \"aria-label\"?: string;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderBack\n */\nexport const PanelHeaderBack = ({\n  label,\n  \"aria-label\": ariaLabel = \"Назад\",\n  className,\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n  const { sizeX } = useAdaptivity();\n  // так-же label нужно скрывать при platform === Platform.IOS && sizeX === regular\n  // https://github.com/VKCOM/VKUI/blob/master/src/components/PanelHeaderButton/PanelHeaderButton.css#L104\n  const showLabel = platform === Platform.VKCOM || platform === Platform.IOS;\n\n  let icon = <Icon28ArrowLeftOutline />;\n  switch (platform) {\n    case Platform.IOS:\n      icon = <Icon28ChevronBack />;\n      break;\n    case Platform.VKCOM:\n      icon = <Icon28ChevronLeftOutline />;\n      break;\n  }\n\n  return (\n    <PanelHeaderButton\n      {...restProps}\n      className={classNamesString(\n        styles[\"PanelHeaderBack\"],\n        getSizeXClassName(styles[\"PanelHeaderBack\"], sizeX),\n        platform === Platform.IOS && styles[\"PanelHeaderBack--ios\"],\n        platform === Platform.VKCOM && styles[\"PanelHeaderBack--vkcom\"],\n        showLabel && !!label && styles[\"PanelHeaderBack--has-label\"],\n        className\n      )}\n      label={showLabel && label}\n      aria-label={ariaLabel}\n    >\n      {icon}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AAKA;AAIA;AACA;AACA;AACA;AACA;AAA0D;AAO1D;AACA;AACA;AACO,IAAMA,eAAe,GAAG,SAAlBA,eAAe,OAKE;EAAA,IAJ5BC,KAAK,QAALA,KAAK;IAAA,sBACL,YAAY;IAAEC,SAAS,+BAAG,OAAO;IACjCC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,qBAAkB,IAAAC,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EACb;EACA;EACA,IAAMC,SAAS,GAAGJ,QAAQ,KAAKK,kBAAQ,CAACC,KAAK,IAAIN,QAAQ,KAAKK,kBAAQ,CAACE,GAAG;EAE1E,IAAIC,IAAI,gBAAG,oBAAC,6BAAsB,OAAG;EACrC,QAAQR,QAAQ;IACd,KAAKK,kBAAQ,CAACE,GAAG;MACfC,IAAI,gBAAG,oBAAC,wBAAiB,OAAG;MAC5B;IACF,KAAKH,kBAAQ,CAACC,KAAK;MACjBE,IAAI,gBAAG,oBAAC,+BAAwB,OAAG;MACnC;EAAM;EAGV,oBACE,oBAAC,oCAAiB,6BACZT,SAAS;IACb,SAAS,EAAE,IAAAU,4BAAgB,yBAEzB,IAAAC,oCAAiB,yBAA4BP,KAAK,CAAC,EACnDH,QAAQ,KAAKK,kBAAQ,CAACE,GAAG,8BAAkC,EAC3DP,QAAQ,KAAKK,kBAAQ,CAACC,KAAK,gCAAoC,EAC/DF,SAAS,IAAI,CAAC,CAACR,KAAK,oCAAwC,EAC5DE,SAAS,CACT;IACF,KAAK,EAAEM,SAAS,IAAIR,KAAM;IAC1B,cAAYC;EAAU,IAErBW,IAAI,CACa;AAExB,CAAC;AAAC"}

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

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { TappableProps } from "../Tappable/Tappable";
+export interface PanelHeaderButtonProps extends Omit<TappableProps, "label"> {
+    primary?: boolean;
+    label?: React.ReactNode;
+}
+/**
+ * @see https://vkcom.github.io/VKUI/#/PanelHeaderButton
+ */
+export declare const PanelHeaderButton: ({ children, primary, label, className, ...restProps }: PanelHeaderButtonProps) => JSX.Element;

package/dist/cjs/components/PanelHeaderButton/PanelHeaderButton.js

@@ -1,111 +1,88 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PanelHeaderButton = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
-var _jsxRuntime = require("../../lib/jsxRuntime");
-
+var React = _interopRequireWildcard(require("react"));
 var _Tappable = require("../Tappable/Tappable");
-
-var _getClassName = require("../../helpers/getClassName");
-
+var _getPlatformClassName = require("../../helpers/getPlatformClassName");
 var _classNames = require("../../lib/classNames");
-
 var _warnOnce = require("../../lib/warnOnce");
-
 var _usePlatform = require("../../hooks/usePlatform");
-
 var _utils = require("../../lib/utils");
-
 var _platform = require("../../lib/platform");
-
 var _Text = require("../Typography/Text/Text");
-
 var _Title = require("../Typography/Title/Title");
-
-var _excluded = ["children", "primary", "label"];
-
+var _excluded = ["children", "primary", "label", "className"];
 var ButtonTypography = function ButtonTypography(_ref) {
   var primary = _ref.primary,
-      children = _ref.children;
+    children = _ref.children;
   var platform = (0, _usePlatform.usePlatform)();
-
   if (platform === _platform.Platform.IOS) {
-    return (0, _jsxRuntime.createScopedElement)(_Title.Title, {
+    return /*#__PURE__*/React.createElement(_Title.Title, {
       Component: "span",
       level: "3",
       weight: primary ? "1" : "3"
     }, children);
   }
-
-  return (0, _jsxRuntime.createScopedElement)(_Text.Text, {
+  return /*#__PURE__*/React.createElement(_Text.Text, {
     weight: platform === _platform.Platform.VKCOM ? undefined : "2"
   }, children);
 };
-
 var warn = (0, _warnOnce.warnOnce)("PanelHeaderButton");
+
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderButton
  */
-
 var PanelHeaderButton = function PanelHeaderButton(_ref2) {
   var children = _ref2.children,
-      _ref2$primary = _ref2.primary,
-      primary = _ref2$primary === void 0 ? false : _ref2$primary,
-      label = _ref2.label,
-      restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+    _ref2$primary = _ref2.primary,
+    primary = _ref2$primary === void 0 ? false : _ref2$primary,
+    label = _ref2.label,
+    className = _ref2.className,
+    restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
   var isPrimitive = (0, _utils.isPrimitiveReactNode)(children);
   var isPrimitiveLabel = (0, _utils.isPrimitiveReactNode)(label);
   var platform = (0, _usePlatform.usePlatform)();
   var hoverMode;
   var activeMode;
-
   switch (platform) {
     case _platform.Platform.IOS:
       hoverMode = "background";
       activeMode = "opacity";
       break;
-
     case _platform.Platform.VKCOM:
-      hoverMode = "PanelHeaderButton--hover";
-      activeMode = "PanelHeaderButton--active";
+      hoverMode = "vkuiPanelHeaderButton--hover";
+      activeMode = "vkuiPanelHeaderButton--active";
       break;
-
     default:
       hoverMode = "background";
       activeMode = "background";
   }
-
   if (process.env.NODE_ENV === "development") {
     var hasAccessibleName = Boolean((0, _utils.getTitleFromChildren)(children) || (0, _utils.getTitleFromChildren)(label) || restProps["aria-label"] || restProps["aria-labelledby"]);
-
     if (!hasAccessibleName) {
       warn("a11y: У кнопки нет названия, которое может прочитать скринридер, и она недоступна для части пользователей. Замените содержимое на текст или добавьте описание действия с помощью пропа aria-label.", "error");
     }
   }
-
-  return (0, _jsxRuntime.createScopedElement)(_Tappable.Tappable, (0, _extends2.default)({}, restProps, {
+  return /*#__PURE__*/React.createElement(_Tappable.Tappable, (0, _extends2.default)({}, restProps, {
     hoverMode: hoverMode,
     Component: restProps.href ? "a" : "button",
     activeEffectDelay: 200,
     activeMode: activeMode,
-    vkuiClass: (0, _classNames.classNames)((0, _getClassName.getClassName)("PanelHeaderButton", platform), primary && "PanelHeaderButton--primary", isPrimitive && "PanelHeaderButton--primitive", !isPrimitive && !isPrimitiveLabel && "PanelHeaderButton--notPrimitive")
-  }), isPrimitive ? (0, _jsxRuntime.createScopedElement)(ButtonTypography, {
+    className: (0, _classNames.classNamesString)("vkuiPanelHeaderButton", (0, _getPlatformClassName.getPlatformClassName)("vkuiPanelHeaderButton", platform), isPrimitive && "vkuiPanelHeaderButton--primitive", !isPrimitive && !isPrimitiveLabel && "vkuiPanelHeaderButton--notPrimitive", className)
+  }), isPrimitive ? /*#__PURE__*/React.createElement(ButtonTypography, {
     primary: primary
-  }, children) : children, (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: "PanelHeaderButton__label"
-  }, isPrimitiveLabel ? (0, _jsxRuntime.createScopedElement)(ButtonTypography, {
+  }, children) : children, /*#__PURE__*/React.createElement("div", {
+    className: "vkuiPanelHeaderButton__label"
+  }, isPrimitiveLabel ? /*#__PURE__*/React.createElement(ButtonTypography, {
     primary: primary
   }, label) : label));
 };
-
 exports.PanelHeaderButton = PanelHeaderButton;
 //# sourceMappingURL=PanelHeaderButton.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderButton.js","names":["ButtonTypography","primary","children","platform","usePlatform","Platform","IOS","VKCOM","undefined","warn","warnOnce","PanelHeaderButton","label","restProps","isPrimitive","isPrimitiveReactNode","isPrimitiveLabel","hoverMode","activeMode","process","env","NODE_ENV","hasAccessibleName","Boolean","getTitleFromChildren","href","classNames","getClassName"],"sources":["../../../../src/components/PanelHeaderButton/PanelHeaderButton.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { TappableProps, Tappable } from \"../Tappable/Tappable\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getTitleFromChildren, isPrimitiveReactNode } from \"../../lib/utils\";\nimport { Platform } from \"../../lib/platform\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { Title } from \"../Typography/Title/Title\";\nimport \"./PanelHeaderButton.css\";\n\nexport interface PanelHeaderButtonProps extends Omit<TappableProps, \"label\"> {\n  primary?: boolean;\n  label?: React.ReactNode;\n}\n\ninterface ButtonTypographyProps extends React.AllHTMLAttributes<HTMLElement> {\n  primary?: PanelHeaderButtonProps[\"primary\"];\n}\n\nconst ButtonTypography = ({ primary, children }: ButtonTypographyProps) => {\n  const platform = usePlatform();\n\n  if (platform === Platform.IOS) {\n    return (\n      <Title Component=\"span\" level=\"3\" weight={primary ? \"1\" : \"3\"}>\n        {children}\n      </Title>\n    );\n  }\n\n  return (\n    <Text weight={platform === Platform.VKCOM ? undefined : \"2\"}>\n      {children}\n    </Text>\n  );\n};\n\nconst warn = warnOnce(\"PanelHeaderButton\");\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderButton\n */\nexport const PanelHeaderButton = ({\n  children,\n  primary = false,\n  label,\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const isPrimitive = isPrimitiveReactNode(children);\n  const isPrimitiveLabel = isPrimitiveReactNode(label);\n  const platform = usePlatform();\n\n  let hoverMode;\n  let activeMode;\n\n  switch (platform) {\n    case Platform.IOS:\n      hoverMode = \"background\";\n      activeMode = \"opacity\";\n      break;\n    case Platform.VKCOM:\n      hoverMode = \"PanelHeaderButton--hover\";\n      activeMode = \"PanelHeaderButton--active\";\n      break;\n    default:\n      hoverMode = \"background\";\n      activeMode = \"background\";\n  }\n\n  if (process.env.NODE_ENV === \"development\") {\n    const hasAccessibleName = Boolean(\n      getTitleFromChildren(children) ||\n        getTitleFromChildren(label) ||\n        restProps[\"aria-label\"] ||\n        restProps[\"aria-labelledby\"]\n    );\n\n    if (!hasAccessibleName) {\n      warn(\n        \"a11y: У кнопки нет названия, которое может прочитать скринридер, и она недоступна для части пользователей. Замените содержимое на текст или добавьте описание действия с помощью пропа aria-label.\",\n        \"error\"\n      );\n    }\n  }\n\n  return (\n    <Tappable\n      {...restProps}\n      hoverMode={hoverMode}\n      Component={restProps.href ? \"a\" : \"button\"}\n      activeEffectDelay={200}\n      activeMode={activeMode}\n      vkuiClass={classNames(\n        getClassName(\"PanelHeaderButton\", platform),\n        primary && \"PanelHeaderButton--primary\",\n        isPrimitive && \"PanelHeaderButton--primitive\",\n        !isPrimitive && !isPrimitiveLabel && \"PanelHeaderButton--notPrimitive\"\n      )}\n    >\n      {isPrimitive ? (\n        <ButtonTypography primary={primary}>{children}</ButtonTypography>\n      ) : (\n        children\n      )}\n      <div vkuiClass=\"PanelHeaderButton__label\">\n        {isPrimitiveLabel ? (\n          <ButtonTypography primary={primary}>{label}</ButtonTypography>\n        ) : (\n          label\n        )}\n      </div>\n    </Tappable>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAYA,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAmB,OAAkD;EAAA,IAA/CC,OAA+C,QAA/CA,OAA+C;EAAA,IAAtCC,QAAsC,QAAtCA,QAAsC;EACzE,IAAMC,QAAQ,GAAG,IAAAC,wBAAA,GAAjB;;EAEA,IAAID,QAAQ,KAAKE,kBAAA,CAASC,GAA1B,EAA+B;IAC7B,OACE,qCAAC,YAAD;MAAO,SAAS,EAAC,MAAjB;MAAwB,KAAK,EAAC,GAA9B;MAAkC,MAAM,EAAEL,OAAO,GAAG,GAAH,GAAS;IAA1D,GACGC,QADH,CADF;EAKD;;EAED,OACE,qCAAC,UAAD;IAAM,MAAM,EAAEC,QAAQ,KAAKE,kBAAA,CAASE,KAAtB,GAA8BC,SAA9B,GAA0C;EAAxD,GACGN,QADH,CADF;AAKD,CAhBD;;AAkBA,IAAMO,IAAI,GAAG,IAAAC,kBAAA,EAAS,mBAAT,CAAb;AAEA;AACA;AACA;;AACO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,QAKH;EAAA,IAJ5BT,QAI4B,SAJ5BA,QAI4B;EAAA,0BAH5BD,OAG4B;EAAA,IAH5BA,OAG4B,8BAHlB,KAGkB;EAAA,IAF5BW,KAE4B,SAF5BA,KAE4B;EAAA,IADzBC,SACyB;EAC5B,IAAMC,WAAW,GAAG,IAAAC,2BAAA,EAAqBb,QAArB,CAApB;EACA,IAAMc,gBAAgB,GAAG,IAAAD,2BAAA,EAAqBH,KAArB,CAAzB;EACA,IAAMT,QAAQ,GAAG,IAAAC,wBAAA,GAAjB;EAEA,IAAIa,SAAJ;EACA,IAAIC,UAAJ;;EAEA,QAAQf,QAAR;IACE,KAAKE,kBAAA,CAASC,GAAd;MACEW,SAAS,GAAG,YAAZ;MACAC,UAAU,GAAG,SAAb;MACA;;IACF,KAAKb,kBAAA,CAASE,KAAd;MACEU,SAAS,GAAG,0BAAZ;MACAC,UAAU,GAAG,2BAAb;MACA;;IACF;MACED,SAAS,GAAG,YAAZ;MACAC,UAAU,GAAG,YAAb;EAXJ;;EAcA,IAAIC,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAA7B,EAA4C;IAC1C,IAAMC,iBAAiB,GAAGC,OAAO,CAC/B,IAAAC,2BAAA,EAAqBtB,QAArB,KACE,IAAAsB,2BAAA,EAAqBZ,KAArB,CADF,IAEEC,SAAS,CAAC,YAAD,CAFX,IAGEA,SAAS,CAAC,iBAAD,CAJoB,CAAjC;;IAOA,IAAI,CAACS,iBAAL,EAAwB;MACtBb,IAAI,CACF,oMADE,EAEF,OAFE,CAAJ;IAID;EACF;;EAED,OACE,qCAAC,kBAAD,6BACMI,SADN;IAEE,SAAS,EAAEI,SAFb;IAGE,SAAS,EAAEJ,SAAS,CAACY,IAAV,GAAiB,GAAjB,GAAuB,QAHpC;IAIE,iBAAiB,EAAE,GAJrB;IAKE,UAAU,EAAEP,UALd;IAME,SAAS,EAAE,IAAAQ,sBAAA,EACT,IAAAC,0BAAA,EAAa,mBAAb,EAAkCxB,QAAlC,CADS,EAETF,OAAO,IAAI,4BAFF,EAGTa,WAAW,IAAI,8BAHN,EAIT,CAACA,WAAD,IAAgB,CAACE,gBAAjB,IAAqC,iCAJ5B;EANb,IAaGF,WAAW,GACV,qCAAC,gBAAD;IAAkB,OAAO,EAAEb;EAA3B,GAAqCC,QAArC,CADU,GAGVA,QAhBJ,EAkBE;IAAK,SAAS,EAAC;EAAf,GACGc,gBAAgB,GACf,qCAAC,gBAAD;IAAkB,OAAO,EAAEf;EAA3B,GAAqCW,KAArC,CADe,GAGfA,KAJJ,CAlBF,CADF;AA4BD,CAvEM"}
+{"version":3,"file":"PanelHeaderButton.js","names":["ButtonTypography","primary","children","platform","usePlatform","Platform","IOS","VKCOM","undefined","warn","warnOnce","PanelHeaderButton","label","className","restProps","isPrimitive","isPrimitiveReactNode","isPrimitiveLabel","hoverMode","activeMode","process","env","NODE_ENV","hasAccessibleName","Boolean","getTitleFromChildren","href","classNamesString","getPlatformClassName"],"sources":["../../../../src/components/PanelHeaderButton/PanelHeaderButton.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { TappableProps, Tappable } from \"../Tappable/Tappable\";\nimport { getPlatformClassName } from \"../../helpers/getPlatformClassName\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getTitleFromChildren, isPrimitiveReactNode } from \"../../lib/utils\";\nimport { Platform } from \"../../lib/platform\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { Title } from \"../Typography/Title/Title\";\nimport styles from \"./PanelHeaderButton.module.css\";\n\nexport interface PanelHeaderButtonProps extends Omit<TappableProps, \"label\"> {\n  primary?: boolean;\n  label?: React.ReactNode;\n}\n\ninterface ButtonTypographyProps extends React.AllHTMLAttributes<HTMLElement> {\n  primary?: PanelHeaderButtonProps[\"primary\"];\n}\n\nconst ButtonTypography = ({ primary, children }: ButtonTypographyProps) => {\n  const platform = usePlatform();\n\n  if (platform === Platform.IOS) {\n    return (\n      <Title Component=\"span\" level=\"3\" weight={primary ? \"1\" : \"3\"}>\n        {children}\n      </Title>\n    );\n  }\n\n  return (\n    <Text weight={platform === Platform.VKCOM ? undefined : \"2\"}>\n      {children}\n    </Text>\n  );\n};\n\nconst warn = warnOnce(\"PanelHeaderButton\");\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderButton\n */\nexport const PanelHeaderButton = ({\n  children,\n  primary = false,\n  label,\n  className,\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const isPrimitive = isPrimitiveReactNode(children);\n  const isPrimitiveLabel = isPrimitiveReactNode(label);\n  const platform = usePlatform();\n\n  let hoverMode;\n  let activeMode;\n\n  switch (platform) {\n    case Platform.IOS:\n      hoverMode = \"background\";\n      activeMode = \"opacity\";\n      break;\n    case Platform.VKCOM:\n      hoverMode = styles[\"PanelHeaderButton--hover\"];\n      activeMode = styles[\"PanelHeaderButton--active\"];\n      break;\n    default:\n      hoverMode = \"background\";\n      activeMode = \"background\";\n  }\n\n  if (process.env.NODE_ENV === \"development\") {\n    const hasAccessibleName = Boolean(\n      getTitleFromChildren(children) ||\n        getTitleFromChildren(label) ||\n        restProps[\"aria-label\"] ||\n        restProps[\"aria-labelledby\"]\n    );\n\n    if (!hasAccessibleName) {\n      warn(\n        \"a11y: У кнопки нет названия, которое может прочитать скринридер, и она недоступна для части пользователей. Замените содержимое на текст или добавьте описание действия с помощью пропа aria-label.\",\n        \"error\"\n      );\n    }\n  }\n\n  return (\n    <Tappable\n      {...restProps}\n      hoverMode={hoverMode}\n      Component={restProps.href ? \"a\" : \"button\"}\n      activeEffectDelay={200}\n      activeMode={activeMode}\n      className={classNamesString(\n        styles[\"PanelHeaderButton\"],\n        getPlatformClassName(styles[\"PanelHeaderButton\"], platform),\n        isPrimitive && styles[\"PanelHeaderButton--primitive\"],\n        !isPrimitive &&\n          !isPrimitiveLabel &&\n          styles[\"PanelHeaderButton--notPrimitive\"],\n        className\n      )}\n    >\n      {isPrimitive ? (\n        <ButtonTypography primary={primary}>{children}</ButtonTypography>\n      ) : (\n        children\n      )}\n      <div className={styles[\"PanelHeaderButton__label\"]}>\n        {isPrimitiveLabel ? (\n          <ButtonTypography primary={primary}>{label}</ButtonTypography>\n        ) : (\n          label\n        )}\n      </div>\n    </Tappable>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAkD;AAYlD,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgB,OAAqD;EAAA,IAA/CC,OAAO,QAAPA,OAAO;IAAEC,QAAQ,QAARA,QAAQ;EAC3C,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAE9B,IAAID,QAAQ,KAAKE,kBAAQ,CAACC,GAAG,EAAE;IAC7B,oBACE,oBAAC,YAAK;MAAC,SAAS,EAAC,MAAM;MAAC,KAAK,EAAC,GAAG;MAAC,MAAM,EAAEL,OAAO,GAAG,GAAG,GAAG;IAAI,GAC3DC,QAAQ,CACH;EAEZ;EAEA,oBACE,oBAAC,UAAI;IAAC,MAAM,EAAEC,QAAQ,KAAKE,kBAAQ,CAACE,KAAK,GAAGC,SAAS,GAAG;EAAI,GACzDN,QAAQ,CACJ;AAEX,CAAC;AAED,IAAMO,IAAI,GAAG,IAAAC,kBAAQ,EAAC,mBAAmB,CAAC;;AAE1C;AACA;AACA;AACO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAiB,QAMA;EAAA,IAL5BT,QAAQ,SAARA,QAAQ;IAAA,sBACRD,OAAO;IAAPA,OAAO,8BAAG,KAAK;IACfW,KAAK,SAALA,KAAK;IACLC,SAAS,SAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,WAAW,GAAG,IAAAC,2BAAoB,EAACd,QAAQ,CAAC;EAClD,IAAMe,gBAAgB,GAAG,IAAAD,2BAAoB,EAACJ,KAAK,CAAC;EACpD,IAAMT,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAE9B,IAAIc,SAAS;EACb,IAAIC,UAAU;EAEd,QAAQhB,QAAQ;IACd,KAAKE,kBAAQ,CAACC,GAAG;MACfY,SAAS,GAAG,YAAY;MACxBC,UAAU,GAAG,SAAS;MACtB;IACF,KAAKd,kBAAQ,CAACE,KAAK;MACjBW,SAAS,iCAAqC;MAC9CC,UAAU,kCAAsC;MAChD;IACF;MACED,SAAS,GAAG,YAAY;MACxBC,UAAU,GAAG,YAAY;EAAC;EAG9B,IAAIC,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,aAAa,EAAE;IAC1C,IAAMC,iBAAiB,GAAGC,OAAO,CAC/B,IAAAC,2BAAoB,EAACvB,QAAQ,CAAC,IAC5B,IAAAuB,2BAAoB,EAACb,KAAK,CAAC,IAC3BE,SAAS,CAAC,YAAY,CAAC,IACvBA,SAAS,CAAC,iBAAiB,CAAC,CAC/B;IAED,IAAI,CAACS,iBAAiB,EAAE;MACtBd,IAAI,CACF,oMAAoM,EACpM,OAAO,CACR;IACH;EACF;EAEA,oBACE,oBAAC,kBAAQ,6BACHK,SAAS;IACb,SAAS,EAAEI,SAAU;IACrB,SAAS,EAAEJ,SAAS,CAACY,IAAI,GAAG,GAAG,GAAG,QAAS;IAC3C,iBAAiB,EAAE,GAAI;IACvB,UAAU,EAAEP,UAAW;IACvB,SAAS,EAAE,IAAAQ,4BAAgB,2BAEzB,IAAAC,0CAAoB,2BAA8BzB,QAAQ,CAAC,EAC3DY,WAAW,sCAA0C,EACrD,CAACA,WAAW,IACV,CAACE,gBAAgB,yCACwB,EAC3CJ,SAAS;EACT,IAEDE,WAAW,gBACV,oBAAC,gBAAgB;IAAC,OAAO,EAAEd;EAAQ,GAAEC,QAAQ,CAAoB,GAEjEA,QACD,eACD;IAAK,SAAS;EAAqC,GAChDe,gBAAgB,gBACf,oBAAC,gBAAgB;IAAC,OAAO,EAAEhB;EAAQ,GAAEW,KAAK,CAAoB,GAE9DA,KACD,CACG,CACG;AAEf,CAAC;AAAC"}

package/dist/cjs/components/PanelHeaderClose/PanelHeaderClose.js

@@ -1,42 +1,31 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PanelHeaderClose = void 0;
-
-var _jsxRuntime = require("../../lib/jsxRuntime");
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
+var React = _interopRequireWildcard(require("react"));
 var _icons = require("@vkontakte/icons");
-
 var _PanelHeaderButton = require("../PanelHeaderButton/PanelHeaderButton");
-
 var _platform = require("../../lib/platform");
-
 var _utils = require("../../lib/utils");
-
 var _usePlatform = require("../../hooks/usePlatform");
-
 var _excluded = ["children"];
-
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderClose
  */
 var PanelHeaderClose = function PanelHeaderClose(_ref) {
   var _ref$children = _ref.children,
-      children = _ref$children === void 0 ? "Отмена" : _ref$children,
-      restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+    children = _ref$children === void 0 ? "Отмена" : _ref$children,
+    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var platform = (0, _usePlatform.usePlatform)();
-  return (0, _jsxRuntime.createScopedElement)(_PanelHeaderButton.PanelHeaderButton, (0, _extends2.default)({
+  return /*#__PURE__*/React.createElement(_PanelHeaderButton.PanelHeaderButton, (0, _extends2.default)({
     "aria-label": (0, _utils.getTitleFromChildren)(children)
-  }, restProps), platform === _platform.Platform.IOS ? children : (0, _jsxRuntime.createScopedElement)(_icons.Icon28CancelOutline, null));
+  }, restProps), platform === _platform.Platform.IOS ? children : /*#__PURE__*/React.createElement(_icons.Icon28CancelOutline, null));
 };
-
 exports.PanelHeaderClose = PanelHeaderClose;
 //# sourceMappingURL=PanelHeaderClose.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderClose.js","names":["PanelHeaderClose","children","restProps","platform","usePlatform","getTitleFromChildren","Platform","IOS"],"sources":["../../../../src/components/PanelHeaderClose/PanelHeaderClose.tsx"],"sourcesContent":["import { Icon28CancelOutline } from \"@vkontakte/icons\";\nimport {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Platform } from \"../../lib/platform\";\nimport { getTitleFromChildren } from \"../../lib/utils\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderClose\n */\nexport const PanelHeaderClose = ({\n  children = \"Отмена\",\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n  return (\n    <PanelHeaderButton\n      aria-label={getTitleFromChildren(children)}\n      {...restProps}\n    >\n      {platform === Platform.IOS ? children : <Icon28CancelOutline />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AAIA;;AACA;;AACA;;;;AAEA;AACA;AACA;AACO,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAmB,OAGF;EAAA,yBAF5BC,QAE4B;EAAA,IAF5BA,QAE4B,8BAFjB,QAEiB;EAAA,IADzBC,SACyB;EAC5B,IAAMC,QAAQ,GAAG,IAAAC,wBAAA,GAAjB;EACA,OACE,qCAAC,oCAAD;IACE,cAAY,IAAAC,2BAAA,EAAqBJ,QAArB;EADd,GAEMC,SAFN,GAIGC,QAAQ,KAAKG,kBAAA,CAASC,GAAtB,GAA4BN,QAA5B,GAAuC,qCAAC,0BAAD,OAJ1C,CADF;AAQD,CAbM"}
+{"version":3,"file":"PanelHeaderClose.js","names":["PanelHeaderClose","children","restProps","platform","usePlatform","getTitleFromChildren","Platform","IOS"],"sources":["../../../../src/components/PanelHeaderClose/PanelHeaderClose.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Icon28CancelOutline } from \"@vkontakte/icons\";\nimport {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Platform } from \"../../lib/platform\";\nimport { getTitleFromChildren } from \"../../lib/utils\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderClose\n */\nexport const PanelHeaderClose = ({\n  children = \"Отмена\",\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n  return (\n    <PanelHeaderButton\n      aria-label={getTitleFromChildren(children)}\n      {...restProps}\n    >\n      {platform === Platform.IOS ? children : <Icon28CancelOutline />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AAIA;AACA;AACA;AAAsD;AAEtD;AACA;AACA;AACO,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgB,OAGC;EAAA,yBAF5BC,QAAQ;IAARA,QAAQ,8BAAG,QAAQ;IAChBC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,oBACE,oBAAC,oCAAiB;IAChB,cAAY,IAAAC,2BAAoB,EAACJ,QAAQ;EAAE,GACvCC,SAAS,GAEZC,QAAQ,KAAKG,kBAAQ,CAACC,GAAG,GAAGN,QAAQ,gBAAG,oBAAC,0BAAmB,OAAG,CAC7C;AAExB,CAAC;AAAC"}

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

@@ -0,0 +1,10 @@
+import * as React from "react";
+export interface PanelHeaderContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    aside?: React.ReactNode;
+    before?: React.ReactNode;
+    status?: React.ReactNode;
+}
+/**
+ * @see https://vkcom.github.io/VKUI/#/PanelHeaderContent
+ */
+export declare const PanelHeaderContent: ({ className, style, aside, status, before, children, onClick, ...restProps }: PanelHeaderContentProps) => JSX.Element;

package/dist/cjs/components/PanelHeaderContent/PanelHeaderContent.js

@@ -1,74 +1,56 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PanelHeaderContent = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
-var _jsxRuntime = require("../../lib/jsxRuntime");
-
+var React = _interopRequireWildcard(require("react"));
 var _classNames = require("../../lib/classNames");
-
 var _Tappable = require("../Tappable/Tappable");
-
 var _usePlatform = require("../../hooks/usePlatform");
-
 var _utils = require("../../lib/utils");
-
 var _getPlatformClassName = require("../../helpers/getPlatformClassName");
-
 var _Footnote = require("../Typography/Footnote/Footnote");
-
 var _Headline = require("../Typography/Headline/Headline");
-
 var _platform = require("../../lib/platform");
-
 var _Text = require("../Typography/Text/Text");
-
 var _excluded = ["className", "style", "aside", "status", "before", "children", "onClick"];
-
 var PanelHeaderChildren = function PanelHeaderChildren(_ref) {
-  var platform = _ref.platform,
-      hasStatus = _ref.hasStatus,
-      hasBefore = _ref.hasBefore,
-      children = _ref.children;
-
+  var hasStatus = _ref.hasStatus,
+    hasBefore = _ref.hasBefore,
+    children = _ref.children;
+  var platform = (0, _usePlatform.usePlatform)();
   if (platform === _platform.Platform.VKCOM) {
-    return (0, _jsxRuntime.createScopedElement)(_Text.Text, {
+    return /*#__PURE__*/React.createElement(_Text.Text, {
       Component: "div",
       weight: "2"
     }, children);
   }
-
-  return hasStatus || hasBefore ? (0, _jsxRuntime.createScopedElement)(_Headline.Headline, {
+  return hasStatus || hasBefore ? /*#__PURE__*/React.createElement(_Headline.Headline, {
     Component: "div",
     weight: "2"
-  }, children) : (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: "PanelHeaderContent__children-in"
+  }, children) : /*#__PURE__*/React.createElement("div", {
+    className: "vkuiPanelHeaderContent__children-in"
   }, children);
 };
+
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderContent
  */
-
-
 var PanelHeaderContent = function PanelHeaderContent(_ref2) {
   var className = _ref2.className,
-      style = _ref2.style,
-      aside = _ref2.aside,
-      status = _ref2.status,
-      before = _ref2.before,
-      children = _ref2.children,
-      onClick = _ref2.onClick,
-      restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+    style = _ref2.style,
+    aside = _ref2.aside,
+    status = _ref2.status,
+    before = _ref2.before,
+    children = _ref2.children,
+    onClick = _ref2.onClick,
+    restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
   var InComponent = onClick ? _Tappable.Tappable : "div";
   var rootProps = onClick ? {} : restProps;
   var platform = (0, _usePlatform.usePlatform)();
@@ -78,28 +60,25 @@ var PanelHeaderContent = function PanelHeaderContent(_ref2) {
     hasActive: platform === _platform.Platform.IOS,
     activeMode: "opacity"
   }) : {};
-  return (0, _jsxRuntime.createScopedElement)("div", (0, _extends2.default)({}, rootProps, {
-    vkuiClass: (0, _classNames.classNames)("PanelHeaderContent", (0, _getPlatformClassName.getPlatformClassName)("PanelHeaderContent", platform)),
+  return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({}, rootProps, {
     style: style,
-    className: className
-  }), (0, _utils.hasReactNode)(before) && (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: "PanelHeaderContent__before"
-  }, before), (0, _jsxRuntime.createScopedElement)(InComponent, (0, _extends2.default)({}, inProps, {
-    vkuiClass: (0, _classNames.classNames)("PanelHeaderContent__in", !before && platform !== _platform.Platform.ANDROID && "PanelHeaderContent__in--centered")
-  }), (0, _utils.hasReactNode)(status) && (0, _jsxRuntime.createScopedElement)(_Footnote.Footnote, {
-    vkuiClass: "PanelHeaderContent__status"
-  }, status), (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: "PanelHeaderContent__children"
-  }, (0, _jsxRuntime.createScopedElement)(PanelHeaderChildren, {
-    platform: platform,
+    className: (0, _classNames.classNamesString)("vkuiPanelHeaderContent", (0, _getPlatformClassName.getPlatformClassName)("vkuiPanelHeaderContent", platform), className)
+  }), (0, _utils.hasReactNode)(before) && /*#__PURE__*/React.createElement("div", {
+    className: "vkuiPanelHeaderContent__before"
+  }, before), /*#__PURE__*/React.createElement(InComponent, (0, _extends2.default)({}, inProps, {
+    className: (0, _classNames.classNamesString)("vkuiPanelHeaderContent__in", !before && platform !== _platform.Platform.ANDROID && "vkuiPanelHeaderContent__in--centered")
+  }), (0, _utils.hasReactNode)(status) && /*#__PURE__*/React.createElement(_Footnote.Footnote, {
+    className: "vkuiPanelHeaderContent__status"
+  }, status), /*#__PURE__*/React.createElement("div", {
+    className: "vkuiPanelHeaderContent__children"
+  }, /*#__PURE__*/React.createElement(PanelHeaderChildren, {
     hasStatus: (0, _utils.hasReactNode)(status),
     hasBefore: (0, _utils.hasReactNode)(before)
-  }, children), (0, _utils.hasReactNode)(aside) && (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: "PanelHeaderContent__aside"
-  }, aside)), (0, _utils.hasReactNode)(before) && (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: "PanelHeaderContent__width"
+  }, children), (0, _utils.hasReactNode)(aside) && /*#__PURE__*/React.createElement("div", {
+    className: "vkuiPanelHeaderContent__aside"
+  }, aside)), (0, _utils.hasReactNode)(before) && /*#__PURE__*/React.createElement("div", {
+    className: "vkuiPanelHeaderContent__width"
   })));
 };
-
 exports.PanelHeaderContent = PanelHeaderContent;
 //# sourceMappingURL=PanelHeaderContent.js.map