@vkontakte/vkui 4.37.0 → 5.0.0

package/dist/cssm/components/PanelHeader/PanelHeader.js

@@ -1,21 +1,22 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["before", "left", "after", "right", "children", "separator", "visor", "transparent", "shadow", "getRef", "getRootRef", "sizeX", "sizeY", "fixed"];
+var _excluded = ["before", "children", "after", "separator", "visor", "transparent", "shadow", "getRef", "getRootRef", "fixed"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from "react";
 import { usePlatform } from "../../hooks/usePlatform";
-import { getClassName } from "../../helpers/getClassName";
+import { getPlatformClassName } from "../../helpers/getPlatformClassName";
+import { getSizeXClassName } from "../../helpers/getSizeXClassName";
 import { classNames } from "../../lib/classNames";
-import { warnOnce } from "../../lib/warnOnce";
 import { FixedLayout } from "../FixedLayout/FixedLayout";
 import { Separator } from "../Separator/Separator";
-import { Platform, VKCOM } from "../../lib/platform";
+import { Platform } from "../../lib/platform";
 import { ConfigProviderContext, WebviewType } from "../ConfigProvider/ConfigProviderContext";
-import { SizeType, withAdaptivity } from "../../hoc/withAdaptivity";
 import { Text } from "../Typography/Text/Text";
 import { TooltipContainer } from "../Tooltip/TooltipContainer";
 import { ModalRootContext } from "../ModalRoot/ModalRootContext";
+import { useAdaptivity } from "../../hooks/useAdaptivity";
 import { Spacing } from "../Spacing/Spacing";
+import { SizeXConditionalRender } from "../SizeXConditionalRender/SizeXConditionalRender";
 import "./PanelHeader.css";
 
 var PanelHeaderIn = function PanelHeaderIn(_ref) {
@@ -38,25 +39,25 @@ var PanelHeaderIn = function PanelHeaderIn(_ref) {
     vkuiClass: "PanelHeader__before"
   }, before), createScopedElement("div", {
     vkuiClass: "PanelHeader__content"
-  }, platform === VKCOM ? createScopedElement(Text, {
+  }, platform === Platform.VKCOM ? createScopedElement(Text, {
     weight: "2"
   }, children) : createScopedElement("span", {
     vkuiClass: "PanelHeader__content-in"
   }, children)), createScopedElement("div", {
     vkuiClass: "PanelHeader__after"
-  }, (webviewType === WebviewType.INTERNAL || isInsideModal) && after)), separator && platform === VKCOM && createScopedElement(Separator, {
+  }, (webviewType === WebviewType.INTERNAL || isInsideModal) && after)), separator && platform === Platform.VKCOM && createScopedElement(Separator, {
     wide: true
   }));
 };
+/**
+ * @see https://vkcom.github.io/VKUI/#/PanelHeader
+ */
 
-var warn = warnOnce("PanelHeader");
 
-var PanelHeaderComponent = function PanelHeaderComponent(_ref2) {
-  var propsBefore = _ref2.before,
-      left = _ref2.left,
-      propsAfter = _ref2.after,
-      right = _ref2.right,
+export var PanelHeader = function PanelHeader(_ref2) {
+  var before = _ref2.before,
       children = _ref2.children,
+      after = _ref2.after,
       _ref2$separator = _ref2.separator,
       separator = _ref2$separator === void 0 ? true : _ref2$separator,
       _ref2$visor = _ref2.visor,
@@ -66,8 +67,6 @@ var PanelHeaderComponent = function PanelHeaderComponent(_ref2) {
       shadow = _ref2.shadow,
       getRef = _ref2.getRef,
       getRootRef = _ref2.getRootRef,
-      sizeX = _ref2.sizeX,
-      sizeY = _ref2.sizeY,
       fixed = _ref2.fixed,
       restProps = _objectWithoutProperties(_ref2, _excluded);
 
@@ -79,44 +78,30 @@ var PanelHeaderComponent = function PanelHeaderComponent(_ref2) {
   var _React$useContext4 = React.useContext(ModalRootContext),
       isInsideModal = _React$useContext4.isInsideModal;
 
-  var needShadow = shadow && sizeX === SizeType.REGULAR;
-  var isFixed = fixed !== undefined ? fixed : platform !== Platform.VKCOM; // TODO: удалить перед 5.0.0
-
-  var before = propsBefore !== null && propsBefore !== void 0 ? propsBefore : left;
-  var after = propsAfter !== null && propsAfter !== void 0 ? propsAfter : right;
-
-  if (process.env.NODE_ENV === "development") {
-    right && warn("Свойство right устарелo и будет удалено в 5.0.0. Используйте after.");
-    left && warn("Свойство left устарелo и будет удалено в 5.0.0. Используйте before.");
-  } // /end TODO
+  var _useAdaptivity = useAdaptivity(),
+      sizeX = _useAdaptivity.sizeX;
 
-
-  var innerProps = {
-    before: before,
-    after: after,
-    separator: separator,
-    children: children
-  };
+  var isFixed = fixed !== undefined ? fixed : platform !== Platform.VKCOM;
   return createScopedElement("div", _extends({}, restProps, {
-    vkuiClass: classNames(getClassName("PanelHeader", platform), transparent && "PanelHeader--trnsp", needShadow && "PanelHeader--shadow", visor && "PanelHeader--vis", separator && visor && "PanelHeader--sep", webviewType === WebviewType.VKAPPS && !isInsideModal && "PanelHeader--vkapps", !before && "PanelHeader--no-before", !after && "PanelHeader--no-after", isFixed && "PanelHeader--fixed", // TODO v5.0.0 поправить под новую адаптивность
-    "PanelHeader--sizeX-".concat(sizeX)),
+    vkuiClass: classNames("PanelHeader", getPlatformClassName("PanelHeader", platform), transparent && "PanelHeader--trnsp", shadow && "PanelHeader--shadow", visor && "PanelHeader--vis", separator && visor && "PanelHeader--sep", webviewType === WebviewType.VKAPPS && !isInsideModal && "PanelHeader--vkapps", !before && "PanelHeader--no-before", !after && "PanelHeader--no-after", isFixed && "PanelHeader--fixed", getSizeXClassName("PanelHeader", sizeX)),
     ref: isFixed ? getRootRef : getRef
   }), isFixed ? createScopedElement(FixedLayout, {
     vkuiClass: "PanelHeader__fixed",
     vertical: "top",
     getRootRef: getRef
-  }, createScopedElement(PanelHeaderIn, innerProps)) : createScopedElement(PanelHeaderIn, innerProps), separator && visor && platform !== VKCOM && (sizeX === SizeType.REGULAR ? createScopedElement(Spacing, {
-    size: 16
-  }) : createScopedElement(Separator, null)));
+  }, createScopedElement(PanelHeaderIn, {
+    before: before,
+    after: after,
+    separator: separator
+  }, children)) : createScopedElement(PanelHeaderIn, {
+    before: before,
+    after: after,
+    separator: separator
+  }, children), separator && visor && platform !== Platform.VKCOM && createScopedElement(SizeXConditionalRender, {
+    compact: createScopedElement(Separator, null),
+    regular: createScopedElement(Spacing, {
+      size: 16
+    })
+  }));
 };
-/**
- * @see https://vkcom.github.io/VKUI/#/PanelHeader
- */
-
-
-export var PanelHeader = withAdaptivity(PanelHeaderComponent, {
-  sizeX: true,
-  sizeY: true
-});
-PanelHeader.displayName = "PanelHeader";
 //# sourceMappingURL=PanelHeader.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeader.js","names":["React","usePlatform","getClassName","classNames","warnOnce","FixedLayout","Separator","Platform","VKCOM","ConfigProviderContext","WebviewType","SizeType","withAdaptivity","Text","TooltipContainer","ModalRootContext","Spacing","PanelHeaderIn","before","after","separator","children","useContext","webviewType","isInsideModal","platform","INTERNAL","warn","PanelHeaderComponent","propsBefore","left","propsAfter","right","visor","transparent","shadow","getRef","getRootRef","sizeX","sizeY","fixed","restProps","needShadow","REGULAR","isFixed","undefined","process","env","NODE_ENV","innerProps","VKAPPS","PanelHeader","displayName"],"sources":["../../../../src/components/PanelHeader/PanelHeader.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { FixedLayout } from \"../FixedLayout/FixedLayout\";\nimport { Separator } from \"../Separator/Separator\";\nimport { Platform, VKCOM } from \"../../lib/platform\";\nimport { HasRef, HasRootRef } from \"../../types\";\nimport {\n  ConfigProviderContext,\n  WebviewType,\n} from \"../ConfigProvider/ConfigProviderContext\";\nimport {\n  AdaptivityProps,\n  SizeType,\n  withAdaptivity,\n} from \"../../hoc/withAdaptivity\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { TooltipContainer } from \"../Tooltip/TooltipContainer\";\nimport { ModalRootContext } from \"../ModalRoot/ModalRootContext\";\nimport { Spacing } from \"../Spacing/Spacing\";\nimport \"./PanelHeader.css\";\n\nexport interface PanelHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRef<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    AdaptivityProps {\n  before?: React.ReactNode;\n  /**\n   * @deprecated Будет удалено в 5.0.0. Используйте `before`\n   */\n  left?: React.ReactNode;\n  after?: React.ReactNode;\n  /**\n   * @deprecated Будет удалено в 5.0.0. Используйте `after`\n   */\n  right?: 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 === 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 === VKCOM && <Separator wide />}\n    </React.Fragment>\n  );\n};\n\nconst warn = warnOnce(\"PanelHeader\");\nconst PanelHeaderComponent = ({\n  // TODO: поправить перед 5.0.0\n  before: propsBefore,\n  left,\n  after: propsAfter,\n  right,\n  // /end TODO\n  children,\n  separator = true,\n  visor = true,\n  transparent = false,\n  shadow,\n  getRef,\n  getRootRef,\n  sizeX,\n  sizeY,\n  fixed,\n  ...restProps\n}: PanelHeaderProps) => {\n  const platform = usePlatform();\n  const { webviewType } = React.useContext(ConfigProviderContext);\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const needShadow = shadow && sizeX === SizeType.REGULAR;\n  let isFixed = fixed !== undefined ? fixed : platform !== Platform.VKCOM;\n\n  // TODO: удалить перед 5.0.0\n  const before = propsBefore ?? left;\n  const after = propsAfter ?? right;\n\n  if (process.env.NODE_ENV === \"development\") {\n    right &&\n      warn(\n        \"Свойство right устарелo и будет удалено в 5.0.0. Используйте after.\"\n      );\n    left &&\n      warn(\n        \"Свойство left устарелo и будет удалено в 5.0.0. Используйте before.\"\n      );\n  }\n  // /end TODO\n\n  const innerProps = { before, after, separator, children };\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(\n        getClassName(\"PanelHeader\", platform),\n        transparent && \"PanelHeader--trnsp\",\n        needShadow && \"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        // TODO v5.0.0 поправить под новую адаптивность\n        `PanelHeader--sizeX-${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 {...innerProps} />\n        </FixedLayout>\n      ) : (\n        <PanelHeaderIn {...innerProps} />\n      )}\n      {separator &&\n        visor &&\n        platform !== VKCOM &&\n        (sizeX === SizeType.REGULAR ? <Spacing size={16} /> : <Separator />)}\n    </div>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeader\n */\nexport const PanelHeader = withAdaptivity(PanelHeaderComponent, {\n  sizeX: true,\n  sizeY: true,\n});\n\nPanelHeader.displayName = \"PanelHeader\";\n"],"mappings":"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"}
+{"version":3,"file":"PanelHeader.js","names":["React","usePlatform","getPlatformClassName","getSizeXClassName","classNames","FixedLayout","Separator","Platform","ConfigProviderContext","WebviewType","Text","TooltipContainer","ModalRootContext","useAdaptivity","Spacing","SizeXConditionalRender","PanelHeaderIn","before","after","separator","children","useContext","webviewType","isInsideModal","platform","VKCOM","INTERNAL","PanelHeader","visor","transparent","shadow","getRef","getRootRef","fixed","restProps","sizeX","isFixed","undefined","VKAPPS"],"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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"}

package/dist/cssm/components/PanelHeaderBack/PanelHeaderBack.css

@@ -1 +1 @@
-.vkuiPanelHeaderBack--vkcom.vkuiPanelHeaderBack--has-label{padding-right:11px}.vkuiPanelHeaderBack--ios.vkuiPanelHeaderBack--has-label{padding-right:8px}
+.vkuiPanelHeaderBack--vkcom.vkuiPanelHeaderBack--has-label{padding-right:11px}@media (min-width:768px){.vkuiPanelHeaderBack--ios.vkuiPanelHeaderBack--has-label:not(.vkuiPanelHeaderBack--sizeX-compact){padding-right:8px}}

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

@@ -1,12 +1,10 @@
-import * as React from "react";
+/// <reference types="react" />
 import { PanelHeaderButtonProps } from "../PanelHeaderButton/PanelHeaderButton";
-import { AdaptivityProps } from "../../hoc/withAdaptivity";
 import "./PanelHeaderBack.css";
-export declare type PanelHeaderBackProps = PanelHeaderButtonProps & AdaptivityProps & {
+export declare type PanelHeaderBackProps = PanelHeaderButtonProps & {
     "aria-label"?: string;
 };
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderBack
  */
-export declare const PanelHeaderBackComponent: ({ label, sizeX, "aria-label": ariaLabel, ...restProps }: PanelHeaderButtonProps & AdaptivityProps) => JSX.Element;
-export declare const PanelHeaderBack: React.NamedExoticComponent<Pick<PanelHeaderButtonProps & AdaptivityProps, "max" | "required" | "high" | "low" | "disabled" | "default" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "color" | "content" | "size" | "wrap" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "method" | "min" | "name" | "target" | "type" | "role" | "tabIndex" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "list" | "classID" | "useMap" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "as" | "hrefLang" | "integrity" | "rel" | "sizes" | "charSet" | "kind" | "srcLang" | "value" | "download" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "htmlFor" | "httpEquiv" | "optimum" | "reversed" | "selected" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "poster" | "challenge" | "keyType" | "keyParams" | "onStart" | "onMove" | "onLeave" | "onEnter" | "onEnd" | "Component" | "getRootRef" | "stopPropagation" | "activeEffectDelay" | "hasHover" | "hoverMode" | "hasActive" | "activeMode" | "focusVisibleMode" | "primary"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
+export declare const PanelHeaderBack: ({ label, "aria-label": ariaLabel, ...restProps }: PanelHeaderButtonProps) => JSX.Element;

package/dist/cssm/components/PanelHeaderBack/PanelHeaderBack.js

@@ -1,36 +1,49 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["label", "sizeX", "aria-label"];
+var _excluded = ["label", "aria-label"];
 import { createScopedElement } from "../../lib/jsxRuntime";
-import * as React from "react";
 import { Icon28ChevronBack, Icon28ChevronLeftOutline, Icon28ArrowLeftOutline } from "@vkontakte/icons";
 import { PanelHeaderButton } from "../PanelHeaderButton/PanelHeaderButton";
-import { ANDROID, VKCOM, IOS } from "../../lib/platform";
+import { Platform } from "../../lib/platform";
+import { getSizeXClassName } from "../../helpers/getSizeXClassName";
 import { usePlatform } from "../../hooks/usePlatform";
-import { withAdaptivity, SizeType } from "../../hoc/withAdaptivity";
 import { classNames } from "../../lib/classNames";
+import { useAdaptivity } from "../../hooks/useAdaptivity";
 import "./PanelHeaderBack.css";
 
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderBack
  */
-export var PanelHeaderBackComponent = function PanelHeaderBackComponent(_ref) {
+export var PanelHeaderBack = function PanelHeaderBack(_ref) {
   var label = _ref.label,
-      sizeX = _ref.sizeX,
       _ref$ariaLabel = _ref["aria-label"],
       ariaLabel = _ref$ariaLabel === void 0 ? "Назад" : _ref$ariaLabel,
       restProps = _objectWithoutProperties(_ref, _excluded);
 
   var platform = usePlatform();
-  var showLabel = platform === VKCOM || platform === IOS && sizeX === SizeType.REGULAR;
+
+  var _useAdaptivity = useAdaptivity(),
+      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.VKCOM || platform === Platform.IOS;
+  var icon = createScopedElement(Icon28ArrowLeftOutline, null);
+
+  switch (platform) {
+    case Platform.IOS:
+      icon = createScopedElement(Icon28ChevronBack, null);
+      break;
+
+    case Platform.VKCOM:
+      icon = createScopedElement(Icon28ChevronLeftOutline, null);
+      break;
+  }
+
   return createScopedElement(PanelHeaderButton, _extends({}, restProps, {
-    "aria-label": ariaLabel,
-    vkuiClass: classNames("PanelHeaderBack", platform === IOS && "PanelHeaderBack--ios", platform === VKCOM && "PanelHeaderBack--vkcom", showLabel && !!label && "PanelHeaderBack--has-label"),
-    label: showLabel && label
-  }), platform === ANDROID && createScopedElement(Icon28ArrowLeftOutline, null), platform === VKCOM && createScopedElement(Icon28ChevronLeftOutline, null), platform === IOS && createScopedElement(Icon28ChevronBack, null));
+    vkuiClass: classNames("PanelHeaderBack", getSizeXClassName("PanelHeaderBack", sizeX), platform === Platform.IOS && "PanelHeaderBack--ios", platform === Platform.VKCOM && "PanelHeaderBack--vkcom", showLabel && !!label && "PanelHeaderBack--has-label"),
+    label: showLabel && label,
+    "aria-label": ariaLabel
+  }), icon);
 };
-export var PanelHeaderBack = /*#__PURE__*/React.memo(withAdaptivity(PanelHeaderBackComponent, {
-  sizeX: true
-}));
-PanelHeaderBack.displayName = "PanelHeaderBack";
 //# sourceMappingURL=PanelHeaderBack.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderBack.js","names":["React","Icon28ChevronBack","Icon28ChevronLeftOutline","Icon28ArrowLeftOutline","PanelHeaderButton","ANDROID","VKCOM","IOS","usePlatform","withAdaptivity","SizeType","classNames","PanelHeaderBackComponent","label","sizeX","ariaLabel","restProps","platform","showLabel","REGULAR","PanelHeaderBack","memo","displayName"],"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 { ANDROID, VKCOM, IOS } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport {\n  withAdaptivity,\n  SizeType,\n  AdaptivityProps,\n} from \"../../hoc/withAdaptivity\";\nimport { classNames } from \"../../lib/classNames\";\nimport \"./PanelHeaderBack.css\";\n\nexport type PanelHeaderBackProps = PanelHeaderButtonProps &\n  AdaptivityProps & {\n    \"aria-label\"?: string;\n  };\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderBack\n */\nexport const PanelHeaderBackComponent = ({\n  label,\n  sizeX,\n  \"aria-label\": ariaLabel = \"Назад\",\n  ...restProps\n}: PanelHeaderButtonProps & AdaptivityProps) => {\n  const platform = usePlatform();\n  const showLabel =\n    platform === VKCOM || (platform === IOS && sizeX === SizeType.REGULAR);\n\n  return (\n    <PanelHeaderButton\n      {...restProps}\n      aria-label={ariaLabel}\n      vkuiClass={classNames(\n        \"PanelHeaderBack\",\n        platform === IOS && \"PanelHeaderBack--ios\",\n        platform === VKCOM && \"PanelHeaderBack--vkcom\",\n        showLabel && !!label && \"PanelHeaderBack--has-label\"\n      )}\n      label={showLabel && label}\n    >\n      {platform === ANDROID && <Icon28ArrowLeftOutline />}\n      {platform === VKCOM && <Icon28ChevronLeftOutline />}\n      {platform === IOS && <Icon28ChevronBack />}\n    </PanelHeaderButton>\n  );\n};\n\nexport const PanelHeaderBack = React.memo(\n  withAdaptivity(PanelHeaderBackComponent, {\n    sizeX: true,\n  })\n);\n\nPanelHeaderBack.displayName = \"PanelHeaderBack\";\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SACEC,iBADF,EAEEC,wBAFF,EAGEC,sBAHF,QAIO,kBAJP;AAKA,SACEC,iBADF;AAIA,SAASC,OAAT,EAAkBC,KAAlB,EAAyBC,GAAzB;AACA,SAASC,WAAT;AACA,SACEC,cADF,EAEEC,QAFF;AAKA,SAASC,UAAT;AACA;;AAOA;AACA;AACA;AACA,OAAO,IAAMC,wBAAwB,GAAG,SAA3BA,wBAA2B,OAKQ;EAAA,IAJ9CC,KAI8C,QAJ9CA,KAI8C;EAAA,IAH9CC,KAG8C,QAH9CA,KAG8C;EAAA,0BAF9C,YAE8C;EAAA,IAFhCC,SAEgC,+BAFpB,OAEoB;EAAA,IAD3CC,SAC2C;;EAC9C,IAAMC,QAAQ,GAAGT,WAAW,EAA5B;EACA,IAAMU,SAAS,GACbD,QAAQ,KAAKX,KAAb,IAAuBW,QAAQ,KAAKV,GAAb,IAAoBO,KAAK,KAAKJ,QAAQ,CAACS,OADhE;EAGA,OACE,oBAAC,iBAAD,eACMH,SADN;IAEE,cAAYD,SAFd;IAGE,SAAS,EAAEJ,UAAU,CACnB,iBADmB,EAEnBM,QAAQ,KAAKV,GAAb,IAAoB,sBAFD,EAGnBU,QAAQ,KAAKX,KAAb,IAAsB,wBAHH,EAInBY,SAAS,IAAI,CAAC,CAACL,KAAf,IAAwB,4BAJL,CAHvB;IASE,KAAK,EAAEK,SAAS,IAAIL;EATtB,IAWGI,QAAQ,KAAKZ,OAAb,IAAwB,oBAAC,sBAAD,OAX3B,EAYGY,QAAQ,KAAKX,KAAb,IAAsB,oBAAC,wBAAD,OAZzB,EAaGW,QAAQ,KAAKV,GAAb,IAAoB,oBAAC,iBAAD,OAbvB,CADF;AAiBD,CA3BM;AA6BP,OAAO,IAAMa,eAAe,gBAAGpB,KAAK,CAACqB,IAAN,CAC7BZ,cAAc,CAACG,wBAAD,EAA2B;EACvCE,KAAK,EAAE;AADgC,CAA3B,CADe,CAAxB;AAMPM,eAAe,CAACE,WAAhB,GAA8B,iBAA9B"}
+{"version":3,"file":"PanelHeaderBack.js","names":["Icon28ChevronBack","Icon28ChevronLeftOutline","Icon28ArrowLeftOutline","PanelHeaderButton","Platform","getSizeXClassName","usePlatform","classNames","useAdaptivity","PanelHeaderBack","label","ariaLabel","restProps","platform","sizeX","showLabel","VKCOM","IOS","icon"],"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,SACEA,iBADF,EAEEC,wBAFF,EAGEC,sBAHF,QAIO,kBAJP;AAKA,SACEC,iBADF;AAIA,SAASC,QAAT;AACA,SAASC,iBAAT;AACA,SAASC,WAAT;AACA,SAASC,UAAT;AACA,SAASC,aAAT;AACA;;AAMA;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,OAID;EAAA,IAH5BC,KAG4B,QAH5BA,KAG4B;EAAA,0BAF5B,YAE4B;EAAA,IAFdC,SAEc,+BAFF,OAEE;EAAA,IADzBC,SACyB;;EAC5B,IAAMC,QAAQ,GAAGP,WAAW,EAA5B;;EACA,qBAAkBE,aAAa,EAA/B;EAAA,IAAQM,KAAR,kBAAQA,KAAR,CAF4B,CAG5B;EACA;;;EACA,IAAMC,SAAS,GAAGF,QAAQ,KAAKT,QAAQ,CAACY,KAAtB,IAA+BH,QAAQ,KAAKT,QAAQ,CAACa,GAAvE;EAEA,IAAIC,IAAI,GAAG,oBAAC,sBAAD,OAAX;;EACA,QAAQL,QAAR;IACE,KAAKT,QAAQ,CAACa,GAAd;MACEC,IAAI,GAAG,oBAAC,iBAAD,OAAP;MACA;;IACF,KAAKd,QAAQ,CAACY,KAAd;MACEE,IAAI,GAAG,oBAAC,wBAAD,OAAP;MACA;EANJ;;EASA,OACE,oBAAC,iBAAD,eACMN,SADN;IAEE,SAAS,EAAEL,UAAU,CACnB,iBADmB,EAEnBF,iBAAiB,CAAC,iBAAD,EAAoBS,KAApB,CAFE,EAGnBD,QAAQ,KAAKT,QAAQ,CAACa,GAAtB,IAA6B,sBAHV,EAInBJ,QAAQ,KAAKT,QAAQ,CAACY,KAAtB,IAA+B,wBAJZ,EAKnBD,SAAS,IAAI,CAAC,CAACL,KAAf,IAAwB,4BALL,CAFvB;IASE,KAAK,EAAEK,SAAS,IAAIL,KATtB;IAUE,cAAYC;EAVd,IAYGO,IAZH,CADF;AAgBD,CArCM"}

package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.css

@@ -1 +1 @@
-.vkuiPanelHeaderButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;box-shadow:none;color:currentColor;display:block;margin:0;padding:0;position:relative}.vkuiPanelHeaderButton[disabled]{opacity:.6}.vkuiPanelHeaderButton .vkuiCounter{padding:0;position:absolute;right:2px;top:8px}.vkuiPanelHeaderButton--primitive{height:48px;line-height:48px;padding:0 12px}.vkuiPanelHeaderButton--ios{align-items:center;display:flex;font-size:17px;position:relative}.vkuiPanelHeaderButton--ios.vkuiPanelHeaderButton--primitive{height:44px;line-height:44px}.vkuiPanelHeaderButton--ios .vkuiIcon--24{padding:10px}.vkuiPanelHeaderButton--ios .vkuiIcon--28{padding:8px}.vkuiPanelHeaderButton--android.vkuiPanelHeaderButton--notPrimitive{border-radius:50%}.vkuiPanelHeaderButton--android .vkuiIcon--24{padding:12px}.vkuiPanelHeaderButton--android .vkuiIcon--28{padding:10px}.vkuiPanelHeaderButton--vkcom{color:#818c99;color:var(--header_text_secondary,var(--vkui--color_text_secondary))}.vkuiPanelHeaderButton--vkcom>:not(.vkuiCounter){opacity:.7;transition:opacity .3s}.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--active>:not(.vkuiCounter),.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--hover>:not(.vkuiCounter){opacity:1}.vkuiPanelHeaderButton--vkcom{align-items:center;display:flex;padding:10px}.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--notPrimitive{border-radius:50%}
+.vkuiPanelHeaderButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;box-shadow:none;color:currentColor;display:block;margin:0;padding:0;position:relative}.vkuiPanelHeaderButton[disabled]{opacity:.6}.vkuiPanelHeaderButton .vkuiCounter{padding:0;position:absolute;right:2px;top:8px}.vkuiPanelHeaderButton--primitive{height:48px;line-height:48px;padding:0 12px}.vkuiPanelHeaderButton--ios{align-items:center;display:flex;font-size:17px;position:relative}.vkuiPanelHeaderButton--ios.vkuiPanelHeaderButton--primitive{height:44px;line-height:44px}.vkuiPanelHeaderButton--ios .vkuiIcon--24{padding:10px}.vkuiPanelHeaderButton--ios .vkuiIcon--28{padding:8px}.vkuiPanelHeaderButton--android.vkuiPanelHeaderButton--notPrimitive{border-radius:50%}.vkuiPanelHeaderButton--android .vkuiIcon--24{padding:12px}.vkuiPanelHeaderButton--android .vkuiIcon--28{padding:10px}.vkuiPanelHeaderButton--vkcom{color:var(--vkui--color_text_secondary)}.vkuiPanelHeaderButton--vkcom>:not(.vkuiCounter){opacity:.7;transition:opacity .3s}.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--active>:not(.vkuiCounter),.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--hover>:not(.vkuiCounter){opacity:1}.vkuiPanelHeaderButton--vkcom{align-items:center;display:flex;padding:10px}.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--notPrimitive{border-radius:50%}@media (max-width:767px){.vkuiPanelHeaderBack--sizeX-none.vkuiPanelHeaderBack--ios .vkuiPanelHeaderButton__label{display:none}}

package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.js

@@ -8,7 +8,7 @@ import { classNames } from "../../lib/classNames";
 import { warnOnce } from "../../lib/warnOnce";
 import { usePlatform } from "../../hooks/usePlatform";
 import { getTitleFromChildren, isPrimitiveReactNode } from "../../lib/utils";
-import { IOS, VKCOM, ANDROID } from "../../lib/platform";
+import { Platform } from "../../lib/platform";
 import { Text } from "../Typography/Text/Text";
 import { Title } from "../Typography/Title/Title";
 import "./PanelHeaderButton.css";
@@ -18,7 +18,7 @@ var ButtonTypography = function ButtonTypography(_ref) {
       children = _ref.children;
   var platform = usePlatform();
 
-  if (platform === IOS) {
+  if (platform === Platform.IOS) {
     return createScopedElement(Title, {
       Component: "span",
       level: "3",
@@ -27,7 +27,7 @@ var ButtonTypography = function ButtonTypography(_ref) {
   }
 
   return createScopedElement(Text, {
-    weight: platform === VKCOM ? undefined : "2"
+    weight: platform === Platform.VKCOM ? undefined : "2"
   }, children);
 };
 
@@ -50,19 +50,19 @@ export var PanelHeaderButton = function PanelHeaderButton(_ref2) {
   var activeMode;
 
   switch (platform) {
-    case ANDROID:
-      hoverMode = "background";
-      activeMode = "background";
-      break;
-
-    case IOS:
+    case Platform.IOS:
       hoverMode = "background";
       activeMode = "opacity";
       break;
 
-    case VKCOM:
+    case Platform.VKCOM:
       hoverMode = "PanelHeaderButton--hover";
       activeMode = "PanelHeaderButton--active";
+      break;
+
+    default:
+      hoverMode = "background";
+      activeMode = "background";
   }
 
   if (process.env.NODE_ENV === "development") {
@@ -81,8 +81,10 @@ export var PanelHeaderButton = function PanelHeaderButton(_ref2) {
     vkuiClass: classNames(getClassName("PanelHeaderButton", platform), primary && "PanelHeaderButton--primary", isPrimitive && "PanelHeaderButton--primitive", !isPrimitive && !isPrimitiveLabel && "PanelHeaderButton--notPrimitive")
   }), isPrimitive ? createScopedElement(ButtonTypography, {
     primary: primary
-  }, children) : children, isPrimitiveLabel ? createScopedElement(ButtonTypography, {
+  }, children) : children, createScopedElement("div", {
+    vkuiClass: "PanelHeaderButton__label"
+  }, isPrimitiveLabel ? createScopedElement(ButtonTypography, {
     primary: primary
-  }, label) : label);
+  }, label) : label));
 };
 //# sourceMappingURL=PanelHeaderButton.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderButton.js","names":["Tappable","getClassName","classNames","warnOnce","usePlatform","getTitleFromChildren","isPrimitiveReactNode","IOS","VKCOM","ANDROID","Text","Title","ButtonTypography","primary","children","platform","undefined","warn","PanelHeaderButton","label","restProps","isPrimitive","isPrimitiveLabel","hoverMode","activeMode","process","env","NODE_ENV","hasAccessibleName","Boolean","href"],"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 { IOS, VKCOM, ANDROID } 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 === IOS) {\n    return (\n      <Title Component=\"span\" level=\"3\" weight={primary ? \"1\" : \"3\"}>\n        {children}\n      </Title>\n    );\n  }\n\n  return <Text weight={platform === VKCOM ? undefined : \"2\"}>{children}</Text>;\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 ANDROID:\n      hoverMode = \"background\";\n      activeMode = \"background\";\n      break;\n    case IOS:\n      hoverMode = \"background\";\n      activeMode = \"opacity\";\n      break;\n    case VKCOM:\n      hoverMode = \"PanelHeaderButton--hover\";\n      activeMode = \"PanelHeaderButton--active\";\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      {isPrimitiveLabel ? (\n        <ButtonTypography primary={primary}>{label}</ButtonTypography>\n      ) : (\n        label\n      )}\n    </Tappable>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"PanelHeaderButton.js","names":["Tappable","getClassName","classNames","warnOnce","usePlatform","getTitleFromChildren","isPrimitiveReactNode","Platform","Text","Title","ButtonTypography","primary","children","platform","IOS","VKCOM","undefined","warn","PanelHeaderButton","label","restProps","isPrimitive","isPrimitiveLabel","hoverMode","activeMode","process","env","NODE_ENV","hasAccessibleName","Boolean","href"],"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":"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"}

package/dist/cssm/components/PanelHeaderClose/PanelHeaderClose.js

@@ -4,7 +4,7 @@ var _excluded = ["children"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import { Icon28CancelOutline } from "@vkontakte/icons";
 import { PanelHeaderButton } from "../PanelHeaderButton/PanelHeaderButton";
-import { IOS } from "../../lib/platform";
+import { Platform } from "../../lib/platform";
 import { getTitleFromChildren } from "../../lib/utils";
 import { usePlatform } from "../../hooks/usePlatform";
 /**
@@ -19,6 +19,6 @@ export var PanelHeaderClose = function PanelHeaderClose(_ref) {
   var platform = usePlatform();
   return createScopedElement(PanelHeaderButton, _extends({
     "aria-label": getTitleFromChildren(children)
-  }, restProps), platform === IOS ? children : createScopedElement(Icon28CancelOutline, null));
+  }, restProps), platform === Platform.IOS ? children : createScopedElement(Icon28CancelOutline, null));
 };
 //# sourceMappingURL=PanelHeaderClose.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderClose.js","names":["Icon28CancelOutline","PanelHeaderButton","IOS","getTitleFromChildren","usePlatform","PanelHeaderClose","children","restProps","platform"],"sources":["../../../../src/components/PanelHeaderClose/PanelHeaderClose.tsx"],"sourcesContent":["import { Icon28CancelOutline } from \"@vkontakte/icons\";\nimport {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { IOS } 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 === IOS ? children : <Icon28CancelOutline />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;AAAA,SAASA,mBAAT,QAAoC,kBAApC;AACA,SACEC,iBADF;AAIA,SAASC,GAAT;AACA,SAASC,oBAAT;AACA,SAASC,WAAT;AAEA;AACA;AACA;;AACA,OAAO,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,OAGF;EAAA,yBAF5BC,QAE4B;EAAA,IAF5BA,QAE4B,8BAFjB,QAEiB;EAAA,IADzBC,SACyB;;EAC5B,IAAMC,QAAQ,GAAGJ,WAAW,EAA5B;EACA,OACE,oBAAC,iBAAD;IACE,cAAYD,oBAAoB,CAACG,QAAD;EADlC,GAEMC,SAFN,GAIGC,QAAQ,KAAKN,GAAb,GAAmBI,QAAnB,GAA8B,oBAAC,mBAAD,OAJjC,CADF;AAQD,CAbM"}
+{"version":3,"file":"PanelHeaderClose.js","names":["Icon28CancelOutline","PanelHeaderButton","Platform","getTitleFromChildren","usePlatform","PanelHeaderClose","children","restProps","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,SAASA,mBAAT,QAAoC,kBAApC;AACA,SACEC,iBADF;AAIA,SAASC,QAAT;AACA,SAASC,oBAAT;AACA,SAASC,WAAT;AAEA;AACA;AACA;;AACA,OAAO,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,OAGF;EAAA,yBAF5BC,QAE4B;EAAA,IAF5BA,QAE4B,8BAFjB,QAEiB;EAAA,IADzBC,SACyB;;EAC5B,IAAMC,QAAQ,GAAGJ,WAAW,EAA5B;EACA,OACE,oBAAC,iBAAD;IACE,cAAYD,oBAAoB,CAACG,QAAD;EADlC,GAEMC,SAFN,GAIGC,QAAQ,KAAKN,QAAQ,CAACO,GAAtB,GAA4BH,QAA5B,GAAuC,oBAAC,mBAAD,OAJ1C,CADF;AAQD,CAbM"}

package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.css

@@ -1,5 +1 @@
-.vkuiPanelHeaderContent{align-items:center;box-sizing:border-box;display:flex;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-common);height:100%;justify-content:flex-start;line-height:normal;max-width:100%}.vkuiPanelHeaderContent__before{flex-shrink:0;margin-right:12px}.vkuiPanelHeaderContent__in{align-items:flex-start;display:flex;flex-direction:column;flex-grow:1;height:100%;justify-content:center;min-width:0}.vkuiPanelHeaderContent__children-in,.vkuiPanelHeaderContent__status{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vkuiPanelHeaderContent__status{color:#818c99;color:var(--header_text_secondary,var(--vkui--color_text_secondary));margin-top:1px;max-width:100%;order:1}.vkuiPanelHeaderContent__children{align-items:center;display:flex;max-width:100%}.vkuiPanelHeaderContent__children-in{flex-grow:0;min-width:0}.vkuiPanelHeaderContent__aside{align-items:center;color:#2688eb;color:var(--header_tint,var(--vkui--color_icon_accent));display:flex;justify-content:flex-start;margin-left:2px}.vkuiPanelHeaderContent__width{width:1000px}.vkuiPanelHeaderContent__in--centered{align-items:center}.vkuiPanelHeaderContent--ios .vkuiPanelHeaderContent__children-in{font-family:VK Sans Display,-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-display);font-size:21px;font-weight:500;line-height:52px;line-height:var(
-    --panelheader_height_ios,var(--vkui--size_panel_header_height--regular)
-  )}.vkuiPanelHeaderContent--android .vkuiPanelHeaderContent__children-in{font-family:VK Sans Display,-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-display);font-size:23px;font-weight:500;line-height:56px;line-height:var(
-    --panelheader_height,var(--vkui--size_panel_header_height--regular)
-  )}.vkuiPanelHeader--no-before .vkuiPanelHeaderContent--vkcom{padding-left:16px}
+.vkuiPanelHeaderContent{align-items:center;box-sizing:border-box;display:flex;font-family:var(--vkui--font_family_base);font-family:var(--font-common);height:100%;justify-content:flex-start;line-height:normal;max-width:100%}.vkuiPanelHeaderContent__before{flex-shrink:0;margin-right:12px}.vkuiPanelHeaderContent__in{align-items:flex-start;display:flex;flex-direction:column;flex-grow:1;height:100%;justify-content:center;min-width:0}.vkuiPanelHeaderContent__children-in,.vkuiPanelHeaderContent__status{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vkuiPanelHeaderContent__status{color:var(--vkui--color_text_secondary);margin-top:1px;max-width:100%;order:1}.vkuiPanelHeaderContent__children{align-items:center;display:flex;max-width:100%}.vkuiPanelHeaderContent__children-in{flex-grow:0;min-width:0}.vkuiPanelHeaderContent__aside{align-items:center;color:var(--vkui--color_icon_accent);display:flex;justify-content:flex-start;margin-left:2px}.vkuiPanelHeaderContent__width{width:1000px}.vkuiPanelHeaderContent__in--centered{align-items:center}.vkuiPanelHeaderContent--ios .vkuiPanelHeaderContent__children-in{font-size:21px}.vkuiPanelHeaderContent--android .vkuiPanelHeaderContent__children-in,.vkuiPanelHeaderContent--ios .vkuiPanelHeaderContent__children-in{font-family:var(--vkui--font_family_accent);font-family:var(--font-display);font-weight:500;line-height:var(--vkui--size_panel_header_height--regular)}.vkuiPanelHeaderContent--android .vkuiPanelHeaderContent__children-in{font-size:23px}.vkuiPanelHeader--no-before .vkuiPanelHeaderContent--vkcom{padding-left:16px}

package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.js

@@ -7,10 +7,10 @@ import { classNames } from "../../lib/classNames";
 import { Tappable } from "../Tappable/Tappable";
 import { usePlatform } from "../../hooks/usePlatform";
 import { hasReactNode } from "../../lib/utils";
-import { getClassName } from "../../helpers/getClassName";
-import { Caption } from "../Typography/Caption/Caption";
+import { getPlatformClassName } from "../../helpers/getPlatformClassName";
+import { Footnote } from "../Typography/Footnote/Footnote";
 import { Headline } from "../Typography/Headline/Headline";
-import { IOS, ANDROID, Platform } from "../../lib/platform";
+import { Platform } from "../../lib/platform";
 import { Text } from "../Typography/Text/Text";
 import "./PanelHeaderContent.css";
 
@@ -55,18 +55,18 @@ export var PanelHeaderContent = function PanelHeaderContent(_ref2) {
   var inProps = onClick ? _objectSpread(_objectSpread({}, restProps), {}, {
     onClick: onClick,
     activeEffectDelay: 200,
-    hasActive: platform === IOS,
+    hasActive: platform === Platform.IOS,
     activeMode: "opacity"
   }) : {};
   return createScopedElement("div", _extends({}, rootProps, {
-    vkuiClass: getClassName("PanelHeaderContent", platform),
+    vkuiClass: classNames("PanelHeaderContent", getPlatformClassName("PanelHeaderContent", platform)),
     style: style,
     className: className
   }), hasReactNode(before) && createScopedElement("div", {
     vkuiClass: "PanelHeaderContent__before"
   }, before), createScopedElement(InComponent, _extends({}, inProps, {
-    vkuiClass: classNames("PanelHeaderContent__in", !before && platform !== ANDROID && "PanelHeaderContent__in--centered")
-  }), hasReactNode(status) && createScopedElement(Caption, {
+    vkuiClass: classNames("PanelHeaderContent__in", !before && platform !== Platform.ANDROID && "PanelHeaderContent__in--centered")
+  }), hasReactNode(status) && createScopedElement(Footnote, {
     vkuiClass: "PanelHeaderContent__status"
   }, status), createScopedElement("div", {
     vkuiClass: "PanelHeaderContent__children"

package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderContent.js","names":["classNames","Tappable","usePlatform","hasReactNode","getClassName","Caption","Headline","IOS","ANDROID","Platform","Text","PanelHeaderChildren","platform","hasStatus","hasBefore","children","VKCOM","PanelHeaderContent","className","style","aside","status","before","onClick","restProps","InComponent","rootProps","inProps","activeEffectDelay","hasActive","activeMode"],"sources":["../../../../src/components/PanelHeaderContent/PanelHeaderContent.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { Tappable } from \"../Tappable/Tappable\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { Caption } from \"../Typography/Caption/Caption\";\nimport { Headline } from \"../Typography/Headline/Headline\";\nimport { IOS, ANDROID, Platform } from \"../../lib/platform\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { HasPlatform } from \"../../types\";\nimport \"./PanelHeaderContent.css\";\n\nexport interface PanelHeaderContentProps\n  extends React.HTMLAttributes<HTMLDivElement> {\n  aside?: React.ReactNode;\n  before?: React.ReactNode;\n  status?: React.ReactNode;\n}\n\ninterface PanelHeaderChildrenProps extends HasPlatform {\n  hasStatus: boolean;\n  hasBefore: boolean;\n  children?: React.ReactNode;\n}\n\nconst PanelHeaderChildren = ({\n  platform,\n  hasStatus,\n  hasBefore,\n  children,\n}: PanelHeaderChildrenProps) => {\n  if (platform === Platform.VKCOM) {\n    return (\n      <Text Component=\"div\" weight=\"2\">\n        {children}\n      </Text>\n    );\n  }\n\n  return hasStatus || hasBefore ? (\n    <Headline Component=\"div\" weight=\"2\">\n      {children}\n    </Headline>\n  ) : (\n    <div vkuiClass=\"PanelHeaderContent__children-in\">{children}</div>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderContent\n */\nexport const PanelHeaderContent = ({\n  className,\n  style,\n  aside,\n  status,\n  before,\n  children,\n  onClick,\n  ...restProps\n}: PanelHeaderContentProps) => {\n  const InComponent = onClick ? Tappable : \"div\";\n  const rootProps = onClick ? {} : restProps;\n  const platform = usePlatform();\n  const inProps = onClick\n    ? {\n        ...restProps,\n        onClick,\n        activeEffectDelay: 200,\n        hasActive: platform === IOS,\n        activeMode: \"opacity\",\n      }\n    : {};\n\n  return (\n    <div\n      {...rootProps}\n      vkuiClass={getClassName(\"PanelHeaderContent\", platform)}\n      style={style}\n      className={className}\n    >\n      {hasReactNode(before) && (\n        <div vkuiClass=\"PanelHeaderContent__before\">{before}</div>\n      )}\n      <InComponent\n        {...inProps}\n        vkuiClass={classNames(\n          \"PanelHeaderContent__in\",\n          !before && platform !== ANDROID && \"PanelHeaderContent__in--centered\"\n        )}\n      >\n        {hasReactNode(status) && (\n          <Caption vkuiClass=\"PanelHeaderContent__status\">{status}</Caption>\n        )}\n        <div vkuiClass=\"PanelHeaderContent__children\">\n          <PanelHeaderChildren\n            platform={platform}\n            hasStatus={hasReactNode(status)}\n            hasBefore={hasReactNode(before)}\n          >\n            {children}\n          </PanelHeaderChildren>\n          {hasReactNode(aside) && (\n            <div vkuiClass=\"PanelHeaderContent__aside\">{aside}</div>\n          )}\n        </div>\n        {hasReactNode(before) && <div vkuiClass=\"PanelHeaderContent__width\" />}\n      </InComponent>\n    </div>\n  );\n};\n"],"mappings":";;;;;AACA,SAASA,UAAT;AACA,SAASC,QAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,YAAT;AACA,SAASC,OAAT;AACA,SAASC,QAAT;AACA,SAASC,GAAT,EAAcC,OAAd,EAAuBC,QAAvB;AACA,SAASC,IAAT;AAEA;;AAeA,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAsB,OAKI;EAAA,IAJ9BC,QAI8B,QAJ9BA,QAI8B;EAAA,IAH9BC,SAG8B,QAH9BA,SAG8B;EAAA,IAF9BC,SAE8B,QAF9BA,SAE8B;EAAA,IAD9BC,QAC8B,QAD9BA,QAC8B;;EAC9B,IAAIH,QAAQ,KAAKH,QAAQ,CAACO,KAA1B,EAAiC;IAC/B,OACE,oBAAC,IAAD;MAAM,SAAS,EAAC,KAAhB;MAAsB,MAAM,EAAC;IAA7B,GACGD,QADH,CADF;EAKD;;EAED,OAAOF,SAAS,IAAIC,SAAb,GACL,oBAAC,QAAD;IAAU,SAAS,EAAC,KAApB;IAA0B,MAAM,EAAC;EAAjC,GACGC,QADH,CADK,GAKL;IAAK,SAAS,EAAC;EAAf,GAAkDA,QAAlD,CALF;AAOD,CArBD;AAuBA;AACA;AACA;;;AACA,OAAO,IAAME,kBAAkB,GAAG,SAArBA,kBAAqB,QASH;EAAA,IAR7BC,SAQ6B,SAR7BA,SAQ6B;EAAA,IAP7BC,KAO6B,SAP7BA,KAO6B;EAAA,IAN7BC,KAM6B,SAN7BA,KAM6B;EAAA,IAL7BC,MAK6B,SAL7BA,MAK6B;EAAA,IAJ7BC,MAI6B,SAJ7BA,MAI6B;EAAA,IAH7BP,QAG6B,SAH7BA,QAG6B;EAAA,IAF7BQ,OAE6B,SAF7BA,OAE6B;EAAA,IAD1BC,SAC0B;;EAC7B,IAAMC,WAAW,GAAGF,OAAO,GAAGtB,QAAH,GAAc,KAAzC;EACA,IAAMyB,SAAS,GAAGH,OAAO,GAAG,EAAH,GAAQC,SAAjC;EACA,IAAMZ,QAAQ,GAAGV,WAAW,EAA5B;EACA,IAAMyB,OAAO,GAAGJ,OAAO,mCAEdC,SAFc;IAGjBD,OAAO,EAAPA,OAHiB;IAIjBK,iBAAiB,EAAE,GAJF;IAKjBC,SAAS,EAAEjB,QAAQ,KAAKL,GALP;IAMjBuB,UAAU,EAAE;EANK,KAQnB,EARJ;EAUA,OACE,wCACMJ,SADN;IAEE,SAAS,EAAEtB,YAAY,CAAC,oBAAD,EAAuBQ,QAAvB,CAFzB;IAGE,KAAK,EAAEO,KAHT;IAIE,SAAS,EAAED;EAJb,IAMGf,YAAY,CAACmB,MAAD,CAAZ,IACC;IAAK,SAAS,EAAC;EAAf,GAA6CA,MAA7C,CAPJ,EASE,oBAAC,WAAD,eACMK,OADN;IAEE,SAAS,EAAE3B,UAAU,CACnB,wBADmB,EAEnB,CAACsB,MAAD,IAAWV,QAAQ,KAAKJ,OAAxB,IAAmC,kCAFhB;EAFvB,IAOGL,YAAY,CAACkB,MAAD,CAAZ,IACC,oBAAC,OAAD;IAAS,SAAS,EAAC;EAAnB,GAAiDA,MAAjD,CARJ,EAUE;IAAK,SAAS,EAAC;EAAf,GACE,oBAAC,mBAAD;IACE,QAAQ,EAAET,QADZ;IAEE,SAAS,EAAET,YAAY,CAACkB,MAAD,CAFzB;IAGE,SAAS,EAAElB,YAAY,CAACmB,MAAD;EAHzB,GAKGP,QALH,CADF,EAQGZ,YAAY,CAACiB,KAAD,CAAZ,IACC;IAAK,SAAS,EAAC;EAAf,GAA4CA,KAA5C,CATJ,CAVF,EAsBGjB,YAAY,CAACmB,MAAD,CAAZ,IAAwB;IAAK,SAAS,EAAC;EAAf,EAtB3B,CATF,CADF;AAoCD,CA3DM"}
+{"version":3,"file":"PanelHeaderContent.js","names":["classNames","Tappable","usePlatform","hasReactNode","getPlatformClassName","Footnote","Headline","Platform","Text","PanelHeaderChildren","platform","hasStatus","hasBefore","children","VKCOM","PanelHeaderContent","className","style","aside","status","before","onClick","restProps","InComponent","rootProps","inProps","activeEffectDelay","hasActive","IOS","activeMode","ANDROID"],"sources":["../../../../src/components/PanelHeaderContent/PanelHeaderContent.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { Tappable } from \"../Tappable/Tappable\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { getPlatformClassName } from \"../../helpers/getPlatformClassName\";\nimport { Footnote } from \"../Typography/Footnote/Footnote\";\nimport { Headline } from \"../Typography/Headline/Headline\";\nimport { Platform } from \"../../lib/platform\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { HasPlatform } from \"../../types\";\nimport \"./PanelHeaderContent.css\";\n\nexport interface PanelHeaderContentProps\n  extends React.HTMLAttributes<HTMLDivElement> {\n  aside?: React.ReactNode;\n  before?: React.ReactNode;\n  status?: React.ReactNode;\n}\n\ninterface PanelHeaderChildrenProps extends HasPlatform {\n  hasStatus: boolean;\n  hasBefore: boolean;\n  children?: React.ReactNode;\n}\n\nconst PanelHeaderChildren = ({\n  platform,\n  hasStatus,\n  hasBefore,\n  children,\n}: PanelHeaderChildrenProps) => {\n  if (platform === Platform.VKCOM) {\n    return (\n      <Text Component=\"div\" weight=\"2\">\n        {children}\n      </Text>\n    );\n  }\n\n  return hasStatus || hasBefore ? (\n    <Headline Component=\"div\" weight=\"2\">\n      {children}\n    </Headline>\n  ) : (\n    <div vkuiClass=\"PanelHeaderContent__children-in\">{children}</div>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderContent\n */\nexport const PanelHeaderContent = ({\n  className,\n  style,\n  aside,\n  status,\n  before,\n  children,\n  onClick,\n  ...restProps\n}: PanelHeaderContentProps) => {\n  const InComponent = onClick ? Tappable : \"div\";\n  const rootProps = onClick ? {} : restProps;\n  const platform = usePlatform();\n  const inProps = onClick\n    ? {\n        ...restProps,\n        onClick,\n        activeEffectDelay: 200,\n        hasActive: platform === Platform.IOS,\n        activeMode: \"opacity\",\n      }\n    : {};\n\n  return (\n    <div\n      {...rootProps}\n      vkuiClass={classNames(\n        \"PanelHeaderContent\",\n        getPlatformClassName(\"PanelHeaderContent\", platform)\n      )}\n      style={style}\n      className={className}\n    >\n      {hasReactNode(before) && (\n        <div vkuiClass=\"PanelHeaderContent__before\">{before}</div>\n      )}\n      <InComponent\n        {...inProps}\n        vkuiClass={classNames(\n          \"PanelHeaderContent__in\",\n          !before &&\n            platform !== Platform.ANDROID &&\n            \"PanelHeaderContent__in--centered\"\n        )}\n      >\n        {hasReactNode(status) && (\n          <Footnote vkuiClass=\"PanelHeaderContent__status\">{status}</Footnote>\n        )}\n        <div vkuiClass=\"PanelHeaderContent__children\">\n          <PanelHeaderChildren\n            platform={platform}\n            hasStatus={hasReactNode(status)}\n            hasBefore={hasReactNode(before)}\n          >\n            {children}\n          </PanelHeaderChildren>\n          {hasReactNode(aside) && (\n            <div vkuiClass=\"PanelHeaderContent__aside\">{aside}</div>\n          )}\n        </div>\n        {hasReactNode(before) && <div vkuiClass=\"PanelHeaderContent__width\" />}\n      </InComponent>\n    </div>\n  );\n};\n"],"mappings":";;;;;AACA,SAASA,UAAT;AACA,SAASC,QAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,oBAAT;AACA,SAASC,QAAT;AACA,SAASC,QAAT;AACA,SAASC,QAAT;AACA,SAASC,IAAT;AAEA;;AAeA,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAsB,OAKI;EAAA,IAJ9BC,QAI8B,QAJ9BA,QAI8B;EAAA,IAH9BC,SAG8B,QAH9BA,SAG8B;EAAA,IAF9BC,SAE8B,QAF9BA,SAE8B;EAAA,IAD9BC,QAC8B,QAD9BA,QAC8B;;EAC9B,IAAIH,QAAQ,KAAKH,QAAQ,CAACO,KAA1B,EAAiC;IAC/B,OACE,oBAAC,IAAD;MAAM,SAAS,EAAC,KAAhB;MAAsB,MAAM,EAAC;IAA7B,GACGD,QADH,CADF;EAKD;;EAED,OAAOF,SAAS,IAAIC,SAAb,GACL,oBAAC,QAAD;IAAU,SAAS,EAAC,KAApB;IAA0B,MAAM,EAAC;EAAjC,GACGC,QADH,CADK,GAKL;IAAK,SAAS,EAAC;EAAf,GAAkDA,QAAlD,CALF;AAOD,CArBD;AAuBA;AACA;AACA;;;AACA,OAAO,IAAME,kBAAkB,GAAG,SAArBA,kBAAqB,QASH;EAAA,IAR7BC,SAQ6B,SAR7BA,SAQ6B;EAAA,IAP7BC,KAO6B,SAP7BA,KAO6B;EAAA,IAN7BC,KAM6B,SAN7BA,KAM6B;EAAA,IAL7BC,MAK6B,SAL7BA,MAK6B;EAAA,IAJ7BC,MAI6B,SAJ7BA,MAI6B;EAAA,IAH7BP,QAG6B,SAH7BA,QAG6B;EAAA,IAF7BQ,OAE6B,SAF7BA,OAE6B;EAAA,IAD1BC,SAC0B;;EAC7B,IAAMC,WAAW,GAAGF,OAAO,GAAGpB,QAAH,GAAc,KAAzC;EACA,IAAMuB,SAAS,GAAGH,OAAO,GAAG,EAAH,GAAQC,SAAjC;EACA,IAAMZ,QAAQ,GAAGR,WAAW,EAA5B;EACA,IAAMuB,OAAO,GAAGJ,OAAO,mCAEdC,SAFc;IAGjBD,OAAO,EAAPA,OAHiB;IAIjBK,iBAAiB,EAAE,GAJF;IAKjBC,SAAS,EAAEjB,QAAQ,KAAKH,QAAQ,CAACqB,GALhB;IAMjBC,UAAU,EAAE;EANK,KAQnB,EARJ;EAUA,OACE,wCACML,SADN;IAEE,SAAS,EAAExB,UAAU,CACnB,oBADmB,EAEnBI,oBAAoB,CAAC,oBAAD,EAAuBM,QAAvB,CAFD,CAFvB;IAME,KAAK,EAAEO,KANT;IAOE,SAAS,EAAED;EAPb,IASGb,YAAY,CAACiB,MAAD,CAAZ,IACC;IAAK,SAAS,EAAC;EAAf,GAA6CA,MAA7C,CAVJ,EAYE,oBAAC,WAAD,eACMK,OADN;IAEE,SAAS,EAAEzB,UAAU,CACnB,wBADmB,EAEnB,CAACoB,MAAD,IACEV,QAAQ,KAAKH,QAAQ,CAACuB,OADxB,IAEE,kCAJiB;EAFvB,IASG3B,YAAY,CAACgB,MAAD,CAAZ,IACC,oBAAC,QAAD;IAAU,SAAS,EAAC;EAApB,GAAkDA,MAAlD,CAVJ,EAYE;IAAK,SAAS,EAAC;EAAf,GACE,oBAAC,mBAAD;IACE,QAAQ,EAAET,QADZ;IAEE,SAAS,EAAEP,YAAY,CAACgB,MAAD,CAFzB;IAGE,SAAS,EAAEhB,YAAY,CAACiB,MAAD;EAHzB,GAKGP,QALH,CADF,EAQGV,YAAY,CAACe,KAAD,CAAZ,IACC;IAAK,SAAS,EAAC;EAAf,GAA4CA,KAA5C,CATJ,CAZF,EAwBGf,YAAY,CAACiB,MAAD,CAAZ,IAAwB;IAAK,SAAS,EAAC;EAAf,EAxB3B,CAZF,CADF;AAyCD,CAhEM"}

package/dist/cssm/components/PanelHeaderContext/PanelHeaderContext.css

@@ -1 +1 @@
-.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--opened{height:100%;width:100%}.vkuiPanelHeaderContext--desktop.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--desktop.vkuiPanelHeaderContext--opened{height:auto}.vkuiPanelHeaderContext__in{left:0;position:absolute;width:100%;z-index:2}.vkuiPanelHeaderContext__fade{background:rgba(0,0,0,.4);height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__fade{-webkit-animation:vkui-animation-panelheadercontext-fade-in .2s ease;animation:vkui-animation-panelheadercontext-fade-in .2s ease}.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__fade{-webkit-animation:vkui-animation-panelheadercontext-fade-out .2s ease;animation:vkui-animation-panelheadercontext-fade-out .2s ease}.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-in .2s ease;animation:vkui-animation-panelheadercontext-translate-in .2s ease}.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-out .2s ease;animation:vkui-animation-panelheadercontext-translate-out .2s ease}.vkuiPanelHeaderContext .vkuiList{background:#fff;background:var(--header_background,var(--vkui--color_background_content))}.vkuiPanelHeaderContext__in{box-sizing:border-box;padding:8px}.vkuiPanelHeaderContext--ios .vkuiPanelHeaderContext__in{padding:0}.vkuiPanelHeaderContext--rounded .vkuiList{border-radius:12px;overflow:hidden;padding:8px 0}.vkuiPanelHeaderContext--desktop .vkuiPanelHeaderContext__in{padding:12px 8px}.vkuiPanelHeaderContext--desktop .vkuiPanelHeaderContext__content{background:#fff;background:var(--header_background,var(--vkui--color_background_content));border-radius:12px;box-shadow:0 0 4px rgba(0,0,0,.08),0 8px 8px rgba(0,0,0,.16);overflow:hidden}@-webkit-keyframes vkui-animation-panelheadercontext-translate-in{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes vkui-animation-panelheadercontext-translate-in{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes vkui-animation-panelheadercontext-translate-out{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes vkui-animation-panelheadercontext-translate-out{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@-webkit-keyframes vkui-animation-panelheadercontext-fade-in{0%{opacity:0}to{opacity:1}}@keyframes vkui-animation-panelheadercontext-fade-in{0%{opacity:0}to{opacity:1}}@-webkit-keyframes vkui-animation-panelheadercontext-fade-out{0%{opacity:1}to{opacity:0}}@keyframes vkui-animation-panelheadercontext-fade-out{0%{opacity:1}to{opacity:0}}
+.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--opened{height:100%;width:100%}.vkuiPanelHeaderContext--sizeX-regular.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--sizeX-regular.vkuiPanelHeaderContext--opened{height:auto}@media (min-width:768px){.vkuiPanelHeaderContext--sizeX-none.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--sizeX-none.vkuiPanelHeaderContext--opened{height:auto}}.vkuiPanelHeaderContext__in{left:0;position:absolute;width:100%;z-index:2}.vkuiPanelHeaderContext__fade{background:rgba(0,0,0,.4);display:none;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.vkuiPanelHeaderContext--sizeX-compact .vkuiPanelHeaderContext__fade{display:block}@media (max-width:767px){.vkuiPanelHeaderContext--sizeX-none .vkuiPanelHeaderContext__fade{display:block}}.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__fade{animation:vkui-animation-panelheadercontext-fade-in .2s ease}.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__fade{animation:vkui-animation-panelheadercontext-fade-out .2s ease}.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__in{animation:vkui-animation-panelheadercontext-translate-in .2s ease}.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__in{animation:vkui-animation-panelheadercontext-translate-out .2s ease}.vkuiPanelHeaderContext .vkuiList{background:var(--vkui--color_background_content)}.vkuiPanelHeaderContext__in{box-sizing:border-box;padding:8px}.vkuiPanelHeaderContext--ios .vkuiPanelHeaderContext__in{padding:0}.vkuiPanelHeaderContext--rounded:not(.vkuiPanelHeaderContext--ios) .vkuiList,.vkuiPanelHeaderContext--sizeX-regular.vkuiPanelHeaderContext--ios .vkuiPanelHeaderContext--rounded .vkuiList{border-radius:12px;overflow:hidden;padding:8px 0}@media (min-width:768px){.vkuiPanelHeaderContext--sizeX-none.vkuiPanelHeaderContext--ios .vkuiPanelHeaderContext--rounded .vkuiList{border-radius:12px;overflow:hidden;padding:8px 0}}.vkuiPanelHeaderContext--sizeX-regular .vkuiPanelHeaderContext__in{padding:12px 8px}.vkuiPanelHeaderContext--sizeX-regular .vkuiPanelHeaderContext__content{background:var(--vkui--color_background_content);border-radius:12px;box-shadow:0 0 4px rgba(0,0,0,.08),0 8px 8px rgba(0,0,0,.16);overflow:hidden}@media (min-width:768px){.vkuiPanelHeaderContext--sizeX-none .vkuiPanelHeaderContext__in{padding:12px 8px}.vkuiPanelHeaderContext--sizeX-none .vkuiPanelHeaderContext__content{background:var(--vkui--color_background_content);border-radius:12px;box-shadow:0 0 4px rgba(0,0,0,.08),0 8px 8px rgba(0,0,0,.16);overflow:hidden}}@keyframes vkui-animation-panelheadercontext-translate-in{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes vkui-animation-panelheadercontext-translate-out{0%{transform:translateY(0)}to{transform:translateY(-100%)}}@keyframes vkui-animation-panelheadercontext-fade-in{0%{opacity:0}to{opacity:1}}@keyframes vkui-animation-panelheadercontext-fade-out{0%{opacity:1}to{opacity:0}}