@vkontakte/vkui 5.0.3 → 5.1.0

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

@@ -1 +1 @@
-{"version":3,"file":"Panel.js","names":["Panel","centered","children","getRootRef","nav","className","restProps","platform","usePlatform","useAdaptivity","sizeX","classNamesString","getSizeXClassName","TooltipContainer","Platform","IOS"],"sources":["../../../../src/components/Panel/Panel.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { Touch } from \"../Touch/Touch\";\nimport { TooltipContainer } from \"../Tooltip/TooltipContainer\";\nimport { HasRootRef } from \"../../types\";\nimport { Platform } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { NavIdProps } from \"../../lib/getNavId\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport styles from \"./Panel.module.css\";\n\nexport interface PanelProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    NavIdProps {\n  centered?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Panel\n */\nexport const Panel = ({\n  centered = false,\n  children,\n  getRootRef,\n  nav,\n  className,\n  ...restProps\n}: PanelProps) => {\n  const platform = usePlatform();\n  const { sizeX } = useAdaptivity();\n\n  return (\n    <div\n      {...restProps}\n      ref={getRootRef}\n      className={classNamesString(\n        styles[\"Panel\"],\n        getSizeXClassName(styles[\"Panel\"], sizeX),\n        centered && styles[\"Panel--centered\"],\n        className\n      )}\n    >\n      <Touch Component={TooltipContainer} className={styles[\"Panel__in\"]}>\n        {platform === Platform.IOS && <div className={styles[\"Panel__fade\"]} />}\n        <div className={styles[\"Panel__in-before\"]} />\n        {centered ? (\n          <div className={styles[\"Panel__centered\"]}>{children}</div>\n        ) : (\n          children\n        )}\n        <div className={styles[\"Panel__in-after\"]} />\n      </Touch>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAA0D;AAU1D;AACA;AACA;AACO,IAAMA,KAAK,GAAG,SAARA,KAAK,OAOA;EAAA,yBANhBC,QAAQ;IAARA,QAAQ,8BAAG,KAAK;IAChBC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,GAAG,QAAHA,GAAG;IACHC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,qBAAkB,IAAAC,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EAEb,oBACE,sDACMJ,SAAS;IACb,GAAG,EAAEH,UAAW;IAChB,SAAS,EAAE,IAAAQ,4BAAgB,eAEzB,IAAAC,oCAAiB,eAAkBF,KAAK,CAAC,EACzCT,QAAQ,yBAA6B,EACrCI,SAAS;EACT,iBAEF,oBAAC,YAAK;IAAC,SAAS,EAAEQ,kCAAiB;IAAC,SAAS;EAAsB,GAChEN,QAAQ,KAAKO,kBAAQ,CAACC,GAAG,iBAAI;IAAK,SAAS;EAAwB,EAAG,eACvE;IAAK,SAAS;EAA6B,EAAG,EAC7Cd,QAAQ,gBACP;IAAK,SAAS;EAA4B,GAAEC,QAAQ,CAAO,GAE3DA,QACD,eACD;IAAK,SAAS;EAA4B,EAAG,CACvC,CACJ;AAEV,CAAC;AAAC"}
+{"version":3,"file":"Panel.js","names":["Panel","centered","children","getRootRef","nav","className","restProps","platform","usePlatform","useAdaptivity","sizeX","classNames","getSizeXClassName","TooltipContainer","Platform","IOS"],"sources":["../../../../src/components/Panel/Panel.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSizeXClassName } from '../../helpers/getSizeXClassName';\nimport { classNames } from '@vkontakte/vkjs';\nimport { Touch } from '../Touch/Touch';\nimport { TooltipContainer } from '../Tooltip/TooltipContainer';\nimport { HasRootRef } from '../../types';\nimport { Platform } from '../../lib/platform';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { NavIdProps } from '../../lib/getNavId';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport styles from './Panel.module.css';\n\nexport interface PanelProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    NavIdProps {\n  centered?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Panel\n */\nexport const Panel = ({\n  centered = false,\n  children,\n  getRootRef,\n  nav,\n  className,\n  ...restProps\n}: PanelProps) => {\n  const platform = usePlatform();\n  const { sizeX } = useAdaptivity();\n\n  return (\n    <div\n      {...restProps}\n      ref={getRootRef}\n      className={classNames(\n        styles['Panel'],\n        getSizeXClassName(styles['Panel'], sizeX),\n        centered && styles['Panel--centered'],\n        className,\n      )}\n    >\n      <Touch Component={TooltipContainer} className={styles['Panel__in']}>\n        {platform === Platform.IOS && <div className={styles['Panel__fade']} />}\n        <div className={styles['Panel__in-before']} />\n        {centered ? <div className={styles['Panel__centered']}>{children}</div> : children}\n        <div className={styles['Panel__in-after']} />\n      </Touch>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAA0D;AAU1D;AACA;AACA;AACO,IAAMA,KAAK,GAAG,SAARA,KAAK,OAOA;EAAA,yBANhBC,QAAQ;IAARA,QAAQ,8BAAG,KAAK;IAChBC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,GAAG,QAAHA,GAAG;IACHC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,qBAAkB,IAAAC,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EAEb,oBACE,sDACMJ,SAAS;IACb,GAAG,EAAEH,UAAW;IAChB,SAAS,EAAE,IAAAQ,gBAAU,eAEnB,IAAAC,oCAAiB,eAAkBF,KAAK,CAAC,EACzCT,QAAQ,yBAA6B,EACrCI,SAAS;EACT,iBAEF,oBAAC,YAAK;IAAC,SAAS,EAAEQ,kCAAiB;IAAC,SAAS;EAAsB,GAChEN,QAAQ,KAAKO,kBAAQ,CAACC,GAAG,iBAAI;IAAK,SAAS;EAAwB,EAAG,eACvE;IAAK,SAAS;EAA6B,EAAG,EAC7Cd,QAAQ,gBAAG;IAAK,SAAS;EAA4B,GAAEC,QAAQ,CAAO,GAAGA,QAAQ,eAClF;IAAK,SAAS;EAA4B,EAAG,CACvC,CACJ;AAEV,CAAC;AAAC"}

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

@@ -1,5 +1,5 @@
-import * as React from "react";
-import { HasRef, HasRootRef } from "../../types";
+import * as React from 'react';
+import { HasRef, HasRootRef } from '../../types';
 export interface PanelHeaderProps extends React.HTMLAttributes<HTMLDivElement>, HasRef<HTMLDivElement>, HasRootRef<HTMLDivElement> {
     before?: React.ReactNode;
     after?: React.ReactNode;

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

@@ -12,7 +12,7 @@ var React = _interopRequireWildcard(require("react"));
 var _usePlatform = require("../../hooks/usePlatform");
 var _getPlatformClassName = require("../../helpers/getPlatformClassName");
 var _getSizeXClassName = require("../../helpers/getSizeXClassName");
-var _classNames = require("../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 var _FixedLayout = require("../FixedLayout/FixedLayout");
 var _Separator = require("../Separator/Separator");
 var _platform = require("../../lib/platform");
@@ -82,7 +82,7 @@ var PanelHeader = function PanelHeader(_ref2) {
     adaptiveSizeX = _useAdaptivityConditi.sizeX;
   var isFixed = fixed !== undefined ? fixed : platform !== _platform.Platform.VKCOM;
   return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({}, restProps, {
-    className: (0, _classNames.classNamesString)("vkuiPanelHeader", (0, _getPlatformClassName.getPlatformClassName)("vkuiPanelHeader", platform), transparent && "vkuiPanelHeader--trnsp", shadow && "vkuiPanelHeader--shadow", visor && "vkuiPanelHeader--vis", separator && visor && "vkuiPanelHeader--sep", webviewType === _ConfigProviderContext.WebviewType.VKAPPS && !isInsideModal && "vkuiPanelHeader--vkapps", !before && "vkuiPanelHeader--no-before", !after && "vkuiPanelHeader--no-after", isFixed && "vkuiPanelHeader--fixed", (0, _getSizeXClassName.getSizeXClassName)("vkuiPanelHeader", sizeX), className),
+    className: (0, _vkjs.classNames)("vkuiPanelHeader", (0, _getPlatformClassName.getPlatformClassName)("vkuiPanelHeader", platform), transparent && "vkuiPanelHeader--trnsp", shadow && "vkuiPanelHeader--shadow", visor && "vkuiPanelHeader--vis", separator && visor && "vkuiPanelHeader--sep", webviewType === _ConfigProviderContext.WebviewType.VKAPPS && !isInsideModal && "vkuiPanelHeader--vkapps", !before && "vkuiPanelHeader--no-before", !after && "vkuiPanelHeader--no-after", isFixed && "vkuiPanelHeader--fixed", (0, _getSizeXClassName.getSizeXClassName)("vkuiPanelHeader", sizeX), className),
     ref: isFixed ? getRootRef : getRef
   }), isFixed ? /*#__PURE__*/React.createElement(_FixedLayout.FixedLayout, {
     className: "vkuiPanelHeader__fixed",

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

@@ -1 +1 @@
-{"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":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAIA;AACA;AACA;AACA;AACA;AACA;AAA6C;AAsB7C,IAAMA,aAAa,GAAG,SAAhBA,aAAa,OAKK;EAAA,IAJtBC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;EAER,yBAAwB,IAAAC,wCAAiB,GAAE;IAAnCC,WAAW,sBAAXA,WAAW;EACnB,wBAA0BC,KAAK,CAACC,UAAU,CAACC,kCAAgB,CAAC;IAApDC,aAAa,qBAAbA,aAAa;EACrB,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAE9B,oBACE,oBAAC,KAAK,CAAC,QAAQ,qBACb,oBAAC,kCAAgB;IAAC,KAAK;IAAC,SAAS;EAA4B,gBAC3D;IAAK,SAAS;EAAgC,GAAEX,MAAM,CAAO,eAC7D;IAAK,SAAS;EAAiC,GAC5CU,QAAQ,KAAKE,kBAAQ,CAACC,KAAK,gBAC1B,oBAAC,UAAI;IAAC,MAAM,EAAC;EAAG,GAAEV,QAAQ,CAAQ,gBAElC;IAAM,SAAS;EAAoC,GAChDA,QAAQ,CAEZ,CACG,eACN;IAAK,SAAS;EAA+B,GAC1C,CAACE,WAAW,KAAKS,kCAAW,CAACC,QAAQ,IAAIN,aAAa,KAAKR,KAAK,CAC7D,CACW,EAClBC,SAAS,IAAIQ,QAAQ,KAAKE,kBAAQ,CAACC,KAAK,iBAAI,oBAAC,oBAAS;IAAC,IAAI;EAAA,EAAG,CAChD;AAErB,CAAC;;AAED;AACA;AACA;AACO,IAAMG,WAAW,GAAG,SAAdA,WAAW,QAaA;EAAA,IAZtBhB,MAAM,SAANA,MAAM;IACNG,QAAQ,SAARA,QAAQ;IACRF,KAAK,SAALA,KAAK;IAAA,wBACLC,SAAS;IAATA,SAAS,gCAAG,IAAI;IAAA,oBAChBe,KAAK;IAALA,KAAK,4BAAG,IAAI;IAAA,0BACZC,WAAW;IAAXA,WAAW,kCAAG,KAAK;IACnBC,MAAM,SAANA,MAAM;IACNC,MAAM,SAANA,MAAM;IACNC,UAAU,SAAVA,UAAU;IACVC,KAAK,SAALA,KAAK;IACLC,SAAS,SAATA,SAAS;IACNC,SAAS;EAEZ,IAAMd,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,0BAAwB,IAAAP,wCAAiB,GAAE;IAAnCC,WAAW,uBAAXA,WAAW;EACnB,yBAA0BC,KAAK,CAACC,UAAU,CAACC,kCAAgB,CAAC;IAApDC,aAAa,sBAAbA,aAAa;EACrB,qBAAkB,IAAAgB,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EACb,4BAAiC,IAAAC,8DAA8B,GAAE;IAAlDC,aAAa,yBAApBF,KAAK;EACb,IAAIG,OAAO,GAAGP,KAAK,KAAKQ,SAAS,GAAGR,KAAK,GAAGZ,QAAQ,KAAKE,kBAAQ,CAACC,KAAK;EAEvE,oBACE,sDACMW,SAAS;IACb,SAAS,EAAE,IAAAO,4BAAgB,qBAEzB,IAAAC,0CAAoB,qBAAwBtB,QAAQ,CAAC,EACrDQ,WAAW,4BAAgC,EAC3CC,MAAM,6BAAiC,EACvCF,KAAK,0BAA8B,EACnCf,SAAS,IAAIe,KAAK,0BAA8B,EAChDZ,WAAW,KAAKS,kCAAW,CAACmB,MAAM,IAChC,CAACxB,aAAa,6BACe,EAC/B,CAACT,MAAM,gCAAoC,EAC3C,CAACC,KAAK,+BAAmC,EACzC4B,OAAO,4BAAgC,EACvC,IAAAK,oCAAiB,qBAAwBR,KAAK,CAAC,EAC/CH,SAAS,CACT;IACF,GAAG,EAAEM,OAAO,GAAGR,UAAU,GAAGD;EAAO,IAElCS,OAAO,gBACN,oBAAC,wBAAW;IACV,SAAS,0BAA+B;IACxC,QAAQ,EAAC,KAAK;IACd,UAAU,EAAET;EAAO,gBAEnB,oBAAC,aAAa;IAAC,MAAM,EAAEpB,MAAO;IAAC,KAAK,EAAEC,KAAM;IAAC,SAAS,EAAEC;EAAU,GAC/DC,QAAQ,CACK,CACJ,gBAEd,oBAAC,aAAa;IAAC,MAAM,EAAEH,MAAO;IAAC,KAAK,EAAEC,KAAM;IAAC,SAAS,EAAEC;EAAU,GAC/DC,QAAQ,CAEZ,EACAD,SAAS,IAAIe,KAAK,IAAIP,QAAQ,KAAKE,kBAAQ,CAACC,KAAK,iBAChD,oBAAC,KAAK,CAAC,QAAQ,QACZe,aAAa,CAACO,OAAO,iBACpB,oBAAC,oBAAS;IAAC,SAAS,EAAEP,aAAa,CAACO,OAAO,CAACZ;EAAU,EACvD,EACAK,aAAa,CAACQ,OAAO,iBACpB,oBAAC,gBAAO;IAAC,SAAS,EAAER,aAAa,CAACQ,OAAO,CAACb,SAAU;IAAC,IAAI,EAAE;EAAG,EAC/D,CAEJ,CACG;AAEV,CAAC;AAAC"}
+{"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","classNames","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 { classNames } from '@vkontakte/vkjs';\nimport { FixedLayout } from '../FixedLayout/FixedLayout';\nimport { Separator } from '../Separator/Separator';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { useConfigProvider, WebviewType } 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 = ({ before, after, separator, children }: 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']}>{children}</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={classNames(\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 && !isInsideModal && 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 className={styles['PanelHeader__fixed']} vertical=\"top\" getRootRef={getRef}>\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 && <Separator className={adaptiveSizeX.compact.className} />}\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

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import { PanelHeaderButtonProps } from "../PanelHeaderButton/PanelHeaderButton";
+import { PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';
 export declare type PanelHeaderBackProps = PanelHeaderButtonProps & {
-    "aria-label"?: string;
+    'aria-label'?: string;
 };
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderBack

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

@@ -14,7 +14,7 @@ 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 _vkjs = require("@vkontakte/vkjs");
 var _useAdaptivity2 = require("../../hooks/useAdaptivity");
 var _excluded = ["label", "aria-label", "className"];
 /**
@@ -22,8 +22,8 @@ var _excluded = ["label", "aria-label", "className"];
  */
 var PanelHeaderBack = function PanelHeaderBack(_ref) {
   var label = _ref.label,
-    _ref$ariaLabel = _ref["aria-label"],
-    ariaLabel = _ref$ariaLabel === void 0 ? "Назад" : _ref$ariaLabel,
+    _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)();
@@ -42,7 +42,7 @@ var PanelHeaderBack = function PanelHeaderBack(_ref) {
       break;
   }
   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),
+    className: (0, _vkjs.classNames)("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);

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

@@ -1 +1 @@
-{"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"}
+{"version":3,"file":"PanelHeaderBack.js","names":["PanelHeaderBack","label","ariaLabel","className","restProps","platform","usePlatform","useAdaptivity","sizeX","showLabel","Platform","VKCOM","IOS","icon","classNames","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 { PanelHeaderButton, PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';\nimport { Platform } from '../../lib/platform';\nimport { getSizeXClassName } from '../../helpers/getSizeXClassName';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { classNames } from '@vkontakte/vkjs';\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={classNames(\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;AACA;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,gBAAU,yBAEnB,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

@@ -1,6 +1,6 @@
-import * as React from "react";
-import { TappableProps } from "../Tappable/Tappable";
-export interface PanelHeaderButtonProps extends Omit<TappableProps, "label"> {
+import * as React from 'react';
+import { TappableProps } from '../Tappable/Tappable';
+export interface PanelHeaderButtonProps extends Omit<TappableProps, 'label'> {
     primary?: boolean;
     label?: React.ReactNode;
 }

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

@@ -11,7 +11,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var React = _interopRequireWildcard(require("react"));
 var _Tappable = require("../Tappable/Tappable");
 var _getPlatformClassName = require("../../helpers/getPlatformClassName");
-var _classNames = require("../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 var _warnOnce = require("../../lib/warnOnce");
 var _usePlatform = require("../../hooks/usePlatform");
 var _utils = require("../../lib/utils");
@@ -27,14 +27,14 @@ var ButtonTypography = function ButtonTypography(_ref) {
     return /*#__PURE__*/React.createElement(_Title.Title, {
       Component: "span",
       level: "3",
-      weight: primary ? "1" : "3"
+      weight: primary ? '1' : '3'
     }, children);
   }
   return /*#__PURE__*/React.createElement(_Text.Text, {
-    weight: platform === _platform.Platform.VKCOM ? undefined : "2"
+    weight: platform === _platform.Platform.VKCOM ? undefined : '2'
   }, children);
 };
-var warn = (0, _warnOnce.warnOnce)("PanelHeaderButton");
+var warn = (0, _warnOnce.warnOnce)('PanelHeaderButton');
 
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderButton
@@ -46,36 +46,36 @@ var PanelHeaderButton = function PanelHeaderButton(_ref2) {
     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 isPrimitive = (0, _vkjs.isPrimitiveReactNode)(children);
+  var isPrimitiveLabel = (0, _vkjs.isPrimitiveReactNode)(label);
   var platform = (0, _usePlatform.usePlatform)();
   var hoverMode;
   var activeMode;
   switch (platform) {
     case _platform.Platform.IOS:
-      hoverMode = "background";
-      activeMode = "opacity";
+      hoverMode = 'background';
+      activeMode = 'opacity';
       break;
     case _platform.Platform.VKCOM:
       hoverMode = "vkuiPanelHeaderButton--hover";
       activeMode = "vkuiPanelHeaderButton--active";
       break;
     default:
-      hoverMode = "background";
-      activeMode = "background";
+      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 (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");
+      warn('a11y: У кнопки нет названия, которое может прочитать скринридер, и она недоступна для части пользователей. Замените содержимое на текст или добавьте описание действия с помощью пропа aria-label.', 'error');
     }
   }
   return /*#__PURE__*/React.createElement(_Tappable.Tappable, (0, _extends2.default)({}, restProps, {
     hoverMode: hoverMode,
-    Component: restProps.href ? "a" : "button",
+    Component: restProps.href ? 'a' : 'button',
     activeEffectDelay: 200,
     activeMode: activeMode,
-    className: (0, _classNames.classNamesString)("vkuiPanelHeaderButton", (0, _getPlatformClassName.getPlatformClassName)("vkuiPanelHeaderButton", platform), isPrimitive && "vkuiPanelHeaderButton--primitive", !isPrimitive && !isPrimitiveLabel && "vkuiPanelHeaderButton--notPrimitive", className)
+    className: (0, _vkjs.classNames)("vkuiPanelHeaderButton", (0, _getPlatformClassName.getPlatformClassName)("vkuiPanelHeaderButton", platform), isPrimitive && "vkuiPanelHeaderButton--primitive", !isPrimitive && !isPrimitiveLabel && "vkuiPanelHeaderButton--notPrimitive", className)
   }), isPrimitive ? /*#__PURE__*/React.createElement(ButtonTypography, {
     primary: primary
   }, children) : children, isPrimitiveLabel ? /*#__PURE__*/React.createElement(ButtonTypography, {

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","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      {isPrimitiveLabel ? (\n        <ButtonTypography\n          primary={primary}\n          className={styles[\"PanelHeaderButton__label\"]}\n        >\n          {label}\n        </ButtonTypography>\n      ) : (\n        label\n      )}\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,EACAe,gBAAgB,gBACf,oBAAC,gBAAgB;IACf,OAAO,EAAEhB,OAAQ;IACjB,SAAS;EAAqC,GAE7CW,KAAK,CACW,GAEnBA,KACD,CACQ;AAEf,CAAC;AAAC"}
+{"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","classNames","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 { classNames, isPrimitiveReactNode } from '@vkontakte/vkjs';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getTitleFromChildren } 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 <Text weight={platform === 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  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={classNames(\n        styles['PanelHeaderButton'],\n        getPlatformClassName(styles['PanelHeaderButton'], platform),\n        isPrimitive && styles['PanelHeaderButton--primitive'],\n        !isPrimitive && !isPrimitiveLabel && styles['PanelHeaderButton--notPrimitive'],\n        className,\n      )}\n    >\n      {isPrimitive ? <ButtonTypography primary={primary}>{children}</ButtonTypography> : children}\n      {isPrimitiveLabel ? (\n        <ButtonTypography primary={primary} className={styles['PanelHeaderButton__label']}>\n          {label}\n        </ButtonTypography>\n      ) : (\n        label\n      )}\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,oBAAO,oBAAC,UAAI;IAAC,MAAM,EAAEC,QAAQ,KAAKE,kBAAQ,CAACE,KAAK,GAAGC,SAAS,GAAG;EAAI,GAAEN,QAAQ,CAAQ;AACvF,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,0BAAoB,EAACd,QAAQ,CAAC;EAClD,IAAMe,gBAAgB,GAAG,IAAAD,0BAAoB,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,gBAAU,2BAEnB,IAAAC,0CAAoB,2BAA8BzB,QAAQ,CAAC,EAC3DY,WAAW,sCAA0C,EACrD,CAACA,WAAW,IAAI,CAACE,gBAAgB,yCAA6C,EAC9EJ,SAAS;EACT,IAEDE,WAAW,gBAAG,oBAAC,gBAAgB;IAAC,OAAO,EAAEd;EAAQ,GAAEC,QAAQ,CAAoB,GAAGA,QAAQ,EAC1Fe,gBAAgB,gBACf,oBAAC,gBAAgB;IAAC,OAAO,EAAEhB,OAAQ;IAAC,SAAS;EAAqC,GAC/EW,KAAK,CACW,GAEnBA,KACD,CACQ;AAEf,CAAC;AAAC"}

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { PanelHeaderButtonProps } from "../PanelHeaderButton/PanelHeaderButton";
+import { PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderClose
  */

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

@@ -20,7 +20,7 @@ var _excluded = ["children"];
  */
 var PanelHeaderClose = function PanelHeaderClose(_ref) {
   var _ref$children = _ref.children,
-    children = _ref$children === void 0 ? "Отмена" : _ref$children,
+    children = _ref$children === void 0 ? 'Отмена' : _ref$children,
     restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var platform = (0, _usePlatform.usePlatform)();
   return /*#__PURE__*/React.createElement(_PanelHeaderButton.PanelHeaderButton, (0, _extends2.default)({

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 * 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"}
+{"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 { PanelHeaderButton, PanelHeaderButtonProps } 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 = ({ children = 'Отмена', ...restProps }: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n  return (\n    <PanelHeaderButton aria-label={getTitleFromChildren(children)} {...restProps}>\n      {platform === Platform.IOS ? children : <Icon28CancelOutline />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAAsD;AAEtD;AACA;AACA;AACO,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgB,OAAsE;EAAA,yBAAhEC,QAAQ;IAARA,QAAQ,8BAAG,QAAQ;IAAKC,SAAS;EAClE,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,oBACE,oBAAC,oCAAiB;IAAC,cAAY,IAAAC,2BAAoB,EAACJ,QAAQ;EAAE,GAAKC,SAAS,GACzEC,QAAQ,KAAKG,kBAAQ,CAACC,GAAG,GAAGN,QAAQ,gBAAG,oBAAC,0BAAmB,OAAG,CAC7C;AAExB,CAAC;AAAC"}

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

@@ -1,4 +1,4 @@
-import * as React from "react";
+import * as React from 'react';
 export interface PanelHeaderContentProps extends React.HTMLAttributes<HTMLDivElement> {
     aside?: React.ReactNode;
     before?: React.ReactNode;

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

@@ -10,10 +10,9 @@ 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 React = _interopRequireWildcard(require("react"));
-var _classNames = require("../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 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");
@@ -51,32 +50,32 @@ var PanelHeaderContent = function PanelHeaderContent(_ref2) {
     children = _ref2.children,
     onClick = _ref2.onClick,
     restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
-  var InComponent = onClick ? _Tappable.Tappable : "div";
+  var InComponent = onClick ? _Tappable.Tappable : 'div';
   var rootProps = onClick ? {} : restProps;
   var platform = (0, _usePlatform.usePlatform)();
   var inProps = onClick ? (0, _objectSpread2.default)((0, _objectSpread2.default)({}, restProps), {}, {
     onClick: onClick,
     activeEffectDelay: 200,
     hasActive: platform === _platform.Platform.IOS,
-    activeMode: "opacity"
+    activeMode: 'opacity'
   }) : {};
   return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({}, rootProps, {
     style: style,
-    className: (0, _classNames.classNamesString)("vkuiPanelHeaderContent", (0, _getPlatformClassName.getPlatformClassName)("vkuiPanelHeaderContent", platform), className)
-  }), (0, _utils.hasReactNode)(before) && /*#__PURE__*/React.createElement("div", {
+    className: (0, _vkjs.classNames)("vkuiPanelHeaderContent", (0, _getPlatformClassName.getPlatformClassName)("vkuiPanelHeaderContent", platform), className)
+  }), (0, _vkjs.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: (0, _vkjs.classNames)("vkuiPanelHeaderContent__in", !before && platform !== _platform.Platform.ANDROID && "vkuiPanelHeaderContent__in--centered")
+  }), (0, _vkjs.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) && /*#__PURE__*/React.createElement("div", {
+    hasStatus: (0, _vkjs.hasReactNode)(status),
+    hasBefore: (0, _vkjs.hasReactNode)(before)
+  }, children), (0, _vkjs.hasReactNode)(aside) && /*#__PURE__*/React.createElement("div", {
     className: "vkuiPanelHeaderContent__aside"
-  }, aside)), (0, _utils.hasReactNode)(before) && /*#__PURE__*/React.createElement("div", {
+  }, aside)), (0, _vkjs.hasReactNode)(before) && /*#__PURE__*/React.createElement("div", {
     className: "vkuiPanelHeaderContent__width"
   })));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderContent.js","names":["PanelHeaderChildren","hasStatus","hasBefore","children","platform","usePlatform","Platform","VKCOM","PanelHeaderContent","className","style","aside","status","before","onClick","restProps","InComponent","Tappable","rootProps","inProps","activeEffectDelay","hasActive","IOS","activeMode","classNamesString","getPlatformClassName","hasReactNode","ANDROID"],"sources":["../../../../src/components/PanelHeaderContent/PanelHeaderContent.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } 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 styles from \"./PanelHeaderContent.module.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 {\n  hasStatus: boolean;\n  hasBefore: boolean;\n  children?: React.ReactNode;\n}\n\nconst PanelHeaderChildren = ({\n  hasStatus,\n  hasBefore,\n  children,\n}: PanelHeaderChildrenProps) => {\n  const platform = usePlatform();\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 className={styles[\"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      style={style}\n      className={classNamesString(\n        styles[\"PanelHeaderContent\"],\n        getPlatformClassName(styles[\"PanelHeaderContent\"], platform),\n        className\n      )}\n    >\n      {hasReactNode(before) && (\n        <div className={styles[\"PanelHeaderContent__before\"]}>{before}</div>\n      )}\n      <InComponent\n        {...inProps}\n        className={classNamesString(\n          styles[\"PanelHeaderContent__in\"],\n          !before &&\n            platform !== Platform.ANDROID &&\n            styles[\"PanelHeaderContent__in--centered\"]\n        )}\n      >\n        {hasReactNode(status) && (\n          <Footnote className={styles[\"PanelHeaderContent__status\"]}>\n            {status}\n          </Footnote>\n        )}\n        <div className={styles[\"PanelHeaderContent__children\"]}>\n          <PanelHeaderChildren\n            hasStatus={hasReactNode(status)}\n            hasBefore={hasReactNode(before)}\n          >\n            {children}\n          </PanelHeaderChildren>\n          {hasReactNode(aside) && (\n            <div className={styles[\"PanelHeaderContent__aside\"]}>{aside}</div>\n          )}\n        </div>\n        {hasReactNode(before) && (\n          <div className={styles[\"PanelHeaderContent__width\"]} />\n        )}\n      </InComponent>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAA+C;AAgB/C,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAmB,OAIO;EAAA,IAH9BC,SAAS,QAATA,SAAS;IACTC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;EAER,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,IAAID,QAAQ,KAAKE,kBAAQ,CAACC,KAAK,EAAE;IAC/B,oBACE,oBAAC,UAAI;MAAC,SAAS,EAAC,KAAK;MAAC,MAAM,EAAC;IAAG,GAC7BJ,QAAQ,CACJ;EAEX;EAEA,OAAOF,SAAS,IAAIC,SAAS,gBAC3B,oBAAC,kBAAQ;IAAC,SAAS,EAAC,KAAK;IAAC,MAAM,EAAC;EAAG,GACjCC,QAAQ,CACA,gBAEX;IAAK,SAAS;EAA4C,GAAEA,QAAQ,CACrE;AACH,CAAC;;AAED;AACA;AACA;AACO,IAAMK,kBAAkB,GAAG,SAArBA,kBAAkB,QASA;EAAA,IAR7BC,SAAS,SAATA,SAAS;IACTC,KAAK,SAALA,KAAK;IACLC,KAAK,SAALA,KAAK;IACLC,MAAM,SAANA,MAAM;IACNC,MAAM,SAANA,MAAM;IACNV,QAAQ,SAARA,QAAQ;IACRW,OAAO,SAAPA,OAAO;IACJC,SAAS;EAEZ,IAAMC,WAAW,GAAGF,OAAO,GAAGG,kBAAQ,GAAG,KAAK;EAC9C,IAAMC,SAAS,GAAGJ,OAAO,GAAG,CAAC,CAAC,GAAGC,SAAS;EAC1C,IAAMX,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,IAAMc,OAAO,GAAGL,OAAO,+DAEdC,SAAS;IACZD,OAAO,EAAPA,OAAO;IACPM,iBAAiB,EAAE,GAAG;IACtBC,SAAS,EAAEjB,QAAQ,KAAKE,kBAAQ,CAACgB,GAAG;IACpCC,UAAU,EAAE;EAAS,KAEvB,CAAC,CAAC;EAEN,oBACE,sDACML,SAAS;IACb,KAAK,EAAER,KAAM;IACb,SAAS,EAAE,IAAAc,4BAAgB,4BAEzB,IAAAC,0CAAoB,4BAA+BrB,QAAQ,CAAC,EAC5DK,SAAS;EACT,IAED,IAAAiB,mBAAY,EAACb,MAAM,CAAC,iBACnB;IAAK,SAAS;EAAuC,GAAEA,MAAM,CAC9D,eACD,oBAAC,WAAW,6BACNM,OAAO;IACX,SAAS,EAAE,IAAAK,4BAAgB,gCAEzB,CAACX,MAAM,IACLT,QAAQ,KAAKE,kBAAQ,CAACqB,OAAO,0CACa;EAC5C,IAED,IAAAD,mBAAY,EAACd,MAAM,CAAC,iBACnB,oBAAC,kBAAQ;IAAC,SAAS;EAAuC,GACvDA,MAAM,CAEV,eACD;IAAK,SAAS;EAAyC,gBACrD,oBAAC,mBAAmB;IAClB,SAAS,EAAE,IAAAc,mBAAY,EAACd,MAAM,CAAE;IAChC,SAAS,EAAE,IAAAc,mBAAY,EAACb,MAAM;EAAE,GAE/BV,QAAQ,CACW,EACrB,IAAAuB,mBAAY,EAACf,KAAK,CAAC,iBAClB;IAAK,SAAS;EAAsC,GAAEA,KAAK,CAC5D,CACG,EACL,IAAAe,mBAAY,EAACb,MAAM,CAAC,iBACnB;IAAK,SAAS;EAAsC,EACrD,CACW,CACV;AAEV,CAAC;AAAC"}
+{"version":3,"file":"PanelHeaderContent.js","names":["PanelHeaderChildren","hasStatus","hasBefore","children","platform","usePlatform","Platform","VKCOM","PanelHeaderContent","className","style","aside","status","before","onClick","restProps","InComponent","Tappable","rootProps","inProps","activeEffectDelay","hasActive","IOS","activeMode","classNames","getPlatformClassName","hasReactNode","ANDROID"],"sources":["../../../../src/components/PanelHeaderContent/PanelHeaderContent.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { Tappable } from '../Tappable/Tappable';\nimport { usePlatform } from '../../hooks/usePlatform';\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 styles from './PanelHeaderContent.module.css';\n\nexport interface PanelHeaderContentProps extends React.HTMLAttributes<HTMLDivElement> {\n  aside?: React.ReactNode;\n  before?: React.ReactNode;\n  status?: React.ReactNode;\n}\n\ninterface PanelHeaderChildrenProps {\n  hasStatus: boolean;\n  hasBefore: boolean;\n  children?: React.ReactNode;\n}\n\nconst PanelHeaderChildren = ({ hasStatus, hasBefore, children }: PanelHeaderChildrenProps) => {\n  const platform = usePlatform();\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 className={styles['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      style={style}\n      className={classNames(\n        styles['PanelHeaderContent'],\n        getPlatformClassName(styles['PanelHeaderContent'], platform),\n        className,\n      )}\n    >\n      {hasReactNode(before) && <div className={styles['PanelHeaderContent__before']}>{before}</div>}\n      <InComponent\n        {...inProps}\n        className={classNames(\n          styles['PanelHeaderContent__in'],\n          !before && platform !== Platform.ANDROID && styles['PanelHeaderContent__in--centered'],\n        )}\n      >\n        {hasReactNode(status) && (\n          <Footnote className={styles['PanelHeaderContent__status']}>{status}</Footnote>\n        )}\n        <div className={styles['PanelHeaderContent__children']}>\n          <PanelHeaderChildren hasStatus={hasReactNode(status)} hasBefore={hasReactNode(before)}>\n            {children}\n          </PanelHeaderChildren>\n          {hasReactNode(aside) && (\n            <div className={styles['PanelHeaderContent__aside']}>{aside}</div>\n          )}\n        </div>\n        {hasReactNode(before) && <div className={styles['PanelHeaderContent__width']} />}\n      </InComponent>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAA+C;AAe/C,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAmB,OAAqE;EAAA,IAA/DC,SAAS,QAATA,SAAS;IAAEC,SAAS,QAATA,SAAS;IAAEC,QAAQ,QAARA,QAAQ;EAC3D,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,IAAID,QAAQ,KAAKE,kBAAQ,CAACC,KAAK,EAAE;IAC/B,oBACE,oBAAC,UAAI;MAAC,SAAS,EAAC,KAAK;MAAC,MAAM,EAAC;IAAG,GAC7BJ,QAAQ,CACJ;EAEX;EAEA,OAAOF,SAAS,IAAIC,SAAS,gBAC3B,oBAAC,kBAAQ;IAAC,SAAS,EAAC,KAAK;IAAC,MAAM,EAAC;EAAG,GACjCC,QAAQ,CACA,gBAEX;IAAK,SAAS;EAA4C,GAAEA,QAAQ,CACrE;AACH,CAAC;;AAED;AACA;AACA;AACO,IAAMK,kBAAkB,GAAG,SAArBA,kBAAkB,QASA;EAAA,IAR7BC,SAAS,SAATA,SAAS;IACTC,KAAK,SAALA,KAAK;IACLC,KAAK,SAALA,KAAK;IACLC,MAAM,SAANA,MAAM;IACNC,MAAM,SAANA,MAAM;IACNV,QAAQ,SAARA,QAAQ;IACRW,OAAO,SAAPA,OAAO;IACJC,SAAS;EAEZ,IAAMC,WAAW,GAAGF,OAAO,GAAGG,kBAAQ,GAAG,KAAK;EAC9C,IAAMC,SAAS,GAAGJ,OAAO,GAAG,CAAC,CAAC,GAAGC,SAAS;EAC1C,IAAMX,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,IAAMc,OAAO,GAAGL,OAAO,+DAEdC,SAAS;IACZD,OAAO,EAAPA,OAAO;IACPM,iBAAiB,EAAE,GAAG;IACtBC,SAAS,EAAEjB,QAAQ,KAAKE,kBAAQ,CAACgB,GAAG;IACpCC,UAAU,EAAE;EAAS,KAEvB,CAAC,CAAC;EAEN,oBACE,sDACML,SAAS;IACb,KAAK,EAAER,KAAM;IACb,SAAS,EAAE,IAAAc,gBAAU,4BAEnB,IAAAC,0CAAoB,4BAA+BrB,QAAQ,CAAC,EAC5DK,SAAS;EACT,IAED,IAAAiB,kBAAY,EAACb,MAAM,CAAC,iBAAI;IAAK,SAAS;EAAuC,GAAEA,MAAM,CAAO,eAC7F,oBAAC,WAAW,6BACNM,OAAO;IACX,SAAS,EAAE,IAAAK,gBAAU,gCAEnB,CAACX,MAAM,IAAIT,QAAQ,KAAKE,kBAAQ,CAACqB,OAAO,0CAA8C;EACtF,IAED,IAAAD,kBAAY,EAACd,MAAM,CAAC,iBACnB,oBAAC,kBAAQ;IAAC,SAAS;EAAuC,GAAEA,MAAM,CACnE,eACD;IAAK,SAAS;EAAyC,gBACrD,oBAAC,mBAAmB;IAAC,SAAS,EAAE,IAAAc,kBAAY,EAACd,MAAM,CAAE;IAAC,SAAS,EAAE,IAAAc,kBAAY,EAACb,MAAM;EAAE,GACnFV,QAAQ,CACW,EACrB,IAAAuB,kBAAY,EAACf,KAAK,CAAC,iBAClB;IAAK,SAAS;EAAsC,GAAEA,KAAK,CAC5D,CACG,EACL,IAAAe,kBAAY,EAACb,MAAM,CAAC,iBAAI;IAAK,SAAS;EAAsC,EAAG,CACpE,CACV;AAEV,CAAC;AAAC"}

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

@@ -1,4 +1,4 @@
-import * as React from "react";
+import * as React from 'react';
 export interface PanelHeaderContextProps extends React.HTMLAttributes<HTMLDivElement> {
     opened: boolean;
     onClose: VoidFunction;

package/dist/cjs/components/PanelHeaderContext/PanelHeaderContext.js

@@ -11,7 +11,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
 var _FixedLayout = require("../FixedLayout/FixedLayout");
-var _classNames = require("../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 var _useAdaptivity2 = require("../../hooks/useAdaptivity");
 var _dom = require("../../lib/dom");
 var _platform = require("../../lib/platform");
@@ -49,7 +49,7 @@ var PanelHeaderContext = function PanelHeaderContext(_ref) {
   (0, _ScrollContext.useScrollLock)(platform !== _platform.Platform.VKCOM && opened);
 
   // start closing on outer click
-  (0, _useGlobalEventListener.useGlobalEventListener)(document, "click", opened && !closing && function (event) {
+  (0, _useGlobalEventListener.useGlobalEventListener)(document, 'click', opened && !closing && function (event) {
     if (elementRef.current && !elementRef.current.contains(event.target)) {
       event.stopPropagation();
       onClose();
@@ -67,21 +67,21 @@ var PanelHeaderContext = function PanelHeaderContext(_ref) {
     return closing ? animationFallback.set() : animationFallback.clear();
   }, [animationFallback, closing]);
   return /*#__PURE__*/React.createElement(_FixedLayout.FixedLayout, (0, _extends2.default)({}, restProps, {
-    className: (0, _classNames.classNamesString)("vkuiPanelHeaderContext", platform === _platform.Platform.IOS && "vkuiPanelHeaderContext--ios", opened && "vkuiPanelHeaderContext--opened", closing && "vkuiPanelHeaderContext--closing", (0, _getSizeXClassName.getSizeXClassName)("vkuiPanelHeaderContext", sizeX), "vkuiPanelHeaderContext--rounded", className),
+    className: (0, _vkjs.classNames)("vkuiPanelHeaderContext", platform === _platform.Platform.IOS && "vkuiPanelHeaderContext--ios", opened && "vkuiPanelHeaderContext--opened", closing && "vkuiPanelHeaderContext--closing", (0, _getSizeXClassName.getSizeXClassName)("vkuiPanelHeaderContext", sizeX), "vkuiPanelHeaderContext--rounded", className),
     vertical: "top"
+  }), visible && /*#__PURE__*/React.createElement("div", {
+    onClick: function onClick(event) {
+      event.stopPropagation();
+      onClose();
+    },
+    className: "vkuiPanelHeaderContext__fade"
   }), /*#__PURE__*/React.createElement("div", {
     className: "vkuiPanelHeaderContext__in",
     ref: elementRef,
     onAnimationEnd: closing ? onAnimationEnd : undefined
   }, /*#__PURE__*/React.createElement("div", {
     className: "vkuiPanelHeaderContext__content"
-  }, visible && children)), visible && /*#__PURE__*/React.createElement("div", {
-    onClick: function onClick(event) {
-      event.stopPropagation();
-      onClose();
-    },
-    className: "vkuiPanelHeaderContext__fade"
-  }));
+  }, visible && children)));
 };
 exports.PanelHeaderContext = PanelHeaderContext;
 //# sourceMappingURL=PanelHeaderContext.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderContext.js","names":["PanelHeaderContext","children","onClose","opened","className","restProps","useDOM","document","platform","usePlatform","React","useState","visible","setVisible","closing","useAdaptivity","sizeX","elementRef","useRef","useIsomorphicLayoutEffect","useScrollLock","Platform","VKCOM","useGlobalEventListener","event","current","contains","target","stopPropagation","capture","onAnimationEnd","animationFallback","useTimeout","useEffect","set","clear","classNamesString","IOS","getSizeXClassName","undefined"],"sources":["../../../../src/components/PanelHeaderContext/PanelHeaderContext.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { FixedLayout } from \"../FixedLayout/FixedLayout\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useDOM } from \"../../lib/dom\";\nimport { Platform } from \"../../lib/platform\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useScrollLock } from \"../AppRoot/ScrollContext\";\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport styles from \"./PanelHeaderContext.module.css\";\n\nexport interface PanelHeaderContextProps\n  extends React.HTMLAttributes<HTMLDivElement> {\n  opened: boolean;\n  onClose: VoidFunction;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderContext\n */\nexport const PanelHeaderContext = ({\n  children,\n  onClose,\n  opened = false,\n  className,\n  ...restProps\n}: PanelHeaderContextProps) => {\n  const { document } = useDOM();\n  const platform = usePlatform();\n  const [visible, setVisible] = React.useState(opened);\n  const closing = visible && !opened;\n  const { sizeX } = useAdaptivity();\n  const elementRef = React.useRef<HTMLDivElement>(null);\n\n  useIsomorphicLayoutEffect(() => {\n    opened && setVisible(true);\n  }, [opened]);\n\n  useScrollLock(platform !== Platform.VKCOM && opened);\n\n  // start closing on outer click\n  useGlobalEventListener(\n    document,\n    \"click\",\n    opened &&\n      !closing &&\n      ((event) => {\n        if (\n          elementRef.current &&\n          !elementRef.current.contains(event.target as Node)\n        ) {\n          event.stopPropagation();\n          onClose();\n        }\n      }),\n    { capture: true }\n  );\n\n  // fallback onAnimationEnd when animationend not supported\n  const onAnimationEnd = () => setVisible(false);\n  const animationFallback = useTimeout(onAnimationEnd, 200);\n  React.useEffect(\n    () => (closing ? animationFallback.set() : animationFallback.clear()),\n    [animationFallback, closing]\n  );\n\n  return (\n    <FixedLayout\n      {...restProps}\n      className={classNamesString(\n        styles[\"PanelHeaderContext\"],\n        platform === Platform.IOS && styles[\"PanelHeaderContext--ios\"],\n        opened && styles[\"PanelHeaderContext--opened\"],\n        closing && styles[\"PanelHeaderContext--closing\"],\n        getSizeXClassName(styles[\"PanelHeaderContext\"], sizeX),\n        styles[\"PanelHeaderContext--rounded\"],\n        className\n      )}\n      vertical=\"top\"\n    >\n      <div\n        className={styles[\"PanelHeaderContext__in\"]}\n        ref={elementRef}\n        onAnimationEnd={closing ? onAnimationEnd : undefined}\n      >\n        <div className={styles[\"PanelHeaderContext__content\"]}>\n          {visible && children}\n        </div>\n      </div>\n      {visible && (\n        <div\n          onClick={(event) => {\n            event.stopPropagation();\n            onClose();\n          }}\n          className={styles[\"PanelHeaderContext__fade\"]}\n        />\n      )}\n    </FixedLayout>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAoE;AASpE;AACA;AACA;AACO,IAAMA,kBAAkB,GAAG,SAArBA,kBAAkB,OAMA;EAAA,IAL7BC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IAAA,mBACPC,MAAM;IAANA,MAAM,4BAAG,KAAK;IACdC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,cAAqB,IAAAC,WAAM,GAAE;IAArBC,QAAQ,WAARA,QAAQ;EAChB,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,sBAA8BC,KAAK,CAACC,QAAQ,CAACR,MAAM,CAAC;IAAA;IAA7CS,OAAO;IAAEC,UAAU;EAC1B,IAAMC,OAAO,GAAGF,OAAO,IAAI,CAACT,MAAM;EAClC,qBAAkB,IAAAY,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EACb,IAAMC,UAAU,GAAGP,KAAK,CAACQ,MAAM,CAAiB,IAAI,CAAC;EAErD,IAAAC,oDAAyB,EAAC,YAAM;IAC9BhB,MAAM,IAAIU,UAAU,CAAC,IAAI,CAAC;EAC5B,CAAC,EAAE,CAACV,MAAM,CAAC,CAAC;EAEZ,IAAAiB,4BAAa,EAACZ,QAAQ,KAAKa,kBAAQ,CAACC,KAAK,IAAInB,MAAM,CAAC;;EAEpD;EACA,IAAAoB,8CAAsB,EACpBhB,QAAQ,EACR,OAAO,EACPJ,MAAM,IACJ,CAACW,OAAO,IACP,UAACU,KAAK,EAAK;IACV,IACEP,UAAU,CAACQ,OAAO,IAClB,CAACR,UAAU,CAACQ,OAAO,CAACC,QAAQ,CAACF,KAAK,CAACG,MAAM,CAAS,EAClD;MACAH,KAAK,CAACI,eAAe,EAAE;MACvB1B,OAAO,EAAE;IACX;EACF,CAAE,EACJ;IAAE2B,OAAO,EAAE;EAAK,CAAC,CAClB;;EAED;EACA,IAAMC,cAAc,GAAG,SAAjBA,cAAc;IAAA,OAASjB,UAAU,CAAC,KAAK,CAAC;EAAA;EAC9C,IAAMkB,iBAAiB,GAAG,IAAAC,sBAAU,EAACF,cAAc,EAAE,GAAG,CAAC;EACzDpB,KAAK,CAACuB,SAAS,CACb;IAAA,OAAOnB,OAAO,GAAGiB,iBAAiB,CAACG,GAAG,EAAE,GAAGH,iBAAiB,CAACI,KAAK,EAAE;EAAA,CAAC,EACrE,CAACJ,iBAAiB,EAAEjB,OAAO,CAAC,CAC7B;EAED,oBACE,oBAAC,wBAAW,6BACNT,SAAS;IACb,SAAS,EAAE,IAAA+B,4BAAgB,4BAEzB5B,QAAQ,KAAKa,kBAAQ,CAACgB,GAAG,iCAAqC,EAC9DlC,MAAM,oCAAwC,EAC9CW,OAAO,qCAAyC,EAChD,IAAAwB,oCAAiB,4BAA+BtB,KAAK,CAAC,qCAEtDZ,SAAS,CACT;IACF,QAAQ,EAAC;EAAK,iBAEd;IACE,SAAS,8BAAmC;IAC5C,GAAG,EAAEa,UAAW;IAChB,cAAc,EAAEH,OAAO,GAAGgB,cAAc,GAAGS;EAAU,gBAErD;IAAK,SAAS;EAAwC,GACnD3B,OAAO,IAAIX,QAAQ,CAChB,CACF,EACLW,OAAO,iBACN;IACE,OAAO,EAAE,iBAACY,KAAK,EAAK;MAClBA,KAAK,CAACI,eAAe,EAAE;MACvB1B,OAAO,EAAE;IACX,CAAE;IACF,SAAS;EAAqC,EAEjD,CACW;AAElB,CAAC;AAAC"}
+{"version":3,"file":"PanelHeaderContext.js","names":["PanelHeaderContext","children","onClose","opened","className","restProps","useDOM","document","platform","usePlatform","React","useState","visible","setVisible","closing","useAdaptivity","sizeX","elementRef","useRef","useIsomorphicLayoutEffect","useScrollLock","Platform","VKCOM","useGlobalEventListener","event","current","contains","target","stopPropagation","capture","onAnimationEnd","animationFallback","useTimeout","useEffect","set","clear","classNames","IOS","getSizeXClassName","undefined"],"sources":["../../../../src/components/PanelHeaderContext/PanelHeaderContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport { FixedLayout } from '../FixedLayout/FixedLayout';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDOM } from '../../lib/dom';\nimport { Platform } from '../../lib/platform';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { getSizeXClassName } from '../../helpers/getSizeXClassName';\nimport styles from './PanelHeaderContext.module.css';\n\nexport interface PanelHeaderContextProps extends React.HTMLAttributes<HTMLDivElement> {\n  opened: boolean;\n  onClose: VoidFunction;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderContext\n */\nexport const PanelHeaderContext = ({\n  children,\n  onClose,\n  opened = false,\n  className,\n  ...restProps\n}: PanelHeaderContextProps) => {\n  const { document } = useDOM();\n  const platform = usePlatform();\n  const [visible, setVisible] = React.useState(opened);\n  const closing = visible && !opened;\n  const { sizeX } = useAdaptivity();\n  const elementRef = React.useRef<HTMLDivElement>(null);\n\n  useIsomorphicLayoutEffect(() => {\n    opened && setVisible(true);\n  }, [opened]);\n\n  useScrollLock(platform !== Platform.VKCOM && opened);\n\n  // start closing on outer click\n  useGlobalEventListener(\n    document,\n    'click',\n    opened &&\n      !closing &&\n      ((event) => {\n        if (elementRef.current && !elementRef.current.contains(event.target as Node)) {\n          event.stopPropagation();\n          onClose();\n        }\n      }),\n    { capture: true },\n  );\n\n  // fallback onAnimationEnd when animationend not supported\n  const onAnimationEnd = () => setVisible(false);\n  const animationFallback = useTimeout(onAnimationEnd, 200);\n  React.useEffect(\n    () => (closing ? animationFallback.set() : animationFallback.clear()),\n    [animationFallback, closing],\n  );\n\n  return (\n    <FixedLayout\n      {...restProps}\n      className={classNames(\n        styles['PanelHeaderContext'],\n        platform === Platform.IOS && styles['PanelHeaderContext--ios'],\n        opened && styles['PanelHeaderContext--opened'],\n        closing && styles['PanelHeaderContext--closing'],\n        getSizeXClassName(styles['PanelHeaderContext'], sizeX),\n        styles['PanelHeaderContext--rounded'],\n        className,\n      )}\n      vertical=\"top\"\n    >\n      {visible && (\n        <div\n          onClick={(event) => {\n            event.stopPropagation();\n            onClose();\n          }}\n          className={styles['PanelHeaderContext__fade']}\n        />\n      )}\n      <div\n        className={styles['PanelHeaderContext__in']}\n        ref={elementRef}\n        onAnimationEnd={closing ? onAnimationEnd : undefined}\n      >\n        <div className={styles['PanelHeaderContext__content']}>{visible && children}</div>\n      </div>\n    </FixedLayout>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAoE;AAQpE;AACA;AACA;AACO,IAAMA,kBAAkB,GAAG,SAArBA,kBAAkB,OAMA;EAAA,IAL7BC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IAAA,mBACPC,MAAM;IAANA,MAAM,4BAAG,KAAK;IACdC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,cAAqB,IAAAC,WAAM,GAAE;IAArBC,QAAQ,WAARA,QAAQ;EAChB,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,sBAA8BC,KAAK,CAACC,QAAQ,CAACR,MAAM,CAAC;IAAA;IAA7CS,OAAO;IAAEC,UAAU;EAC1B,IAAMC,OAAO,GAAGF,OAAO,IAAI,CAACT,MAAM;EAClC,qBAAkB,IAAAY,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EACb,IAAMC,UAAU,GAAGP,KAAK,CAACQ,MAAM,CAAiB,IAAI,CAAC;EAErD,IAAAC,oDAAyB,EAAC,YAAM;IAC9BhB,MAAM,IAAIU,UAAU,CAAC,IAAI,CAAC;EAC5B,CAAC,EAAE,CAACV,MAAM,CAAC,CAAC;EAEZ,IAAAiB,4BAAa,EAACZ,QAAQ,KAAKa,kBAAQ,CAACC,KAAK,IAAInB,MAAM,CAAC;;EAEpD;EACA,IAAAoB,8CAAsB,EACpBhB,QAAQ,EACR,OAAO,EACPJ,MAAM,IACJ,CAACW,OAAO,IACP,UAACU,KAAK,EAAK;IACV,IAAIP,UAAU,CAACQ,OAAO,IAAI,CAACR,UAAU,CAACQ,OAAO,CAACC,QAAQ,CAACF,KAAK,CAACG,MAAM,CAAS,EAAE;MAC5EH,KAAK,CAACI,eAAe,EAAE;MACvB1B,OAAO,EAAE;IACX;EACF,CAAE,EACJ;IAAE2B,OAAO,EAAE;EAAK,CAAC,CAClB;;EAED;EACA,IAAMC,cAAc,GAAG,SAAjBA,cAAc;IAAA,OAASjB,UAAU,CAAC,KAAK,CAAC;EAAA;EAC9C,IAAMkB,iBAAiB,GAAG,IAAAC,sBAAU,EAACF,cAAc,EAAE,GAAG,CAAC;EACzDpB,KAAK,CAACuB,SAAS,CACb;IAAA,OAAOnB,OAAO,GAAGiB,iBAAiB,CAACG,GAAG,EAAE,GAAGH,iBAAiB,CAACI,KAAK,EAAE;EAAA,CAAC,EACrE,CAACJ,iBAAiB,EAAEjB,OAAO,CAAC,CAC7B;EAED,oBACE,oBAAC,wBAAW,6BACNT,SAAS;IACb,SAAS,EAAE,IAAA+B,gBAAU,4BAEnB5B,QAAQ,KAAKa,kBAAQ,CAACgB,GAAG,iCAAqC,EAC9DlC,MAAM,oCAAwC,EAC9CW,OAAO,qCAAyC,EAChD,IAAAwB,oCAAiB,4BAA+BtB,KAAK,CAAC,qCAEtDZ,SAAS,CACT;IACF,QAAQ,EAAC;EAAK,IAEbQ,OAAO,iBACN;IACE,OAAO,EAAE,iBAACY,KAAK,EAAK;MAClBA,KAAK,CAACI,eAAe,EAAE;MACvB1B,OAAO,EAAE;IACX,CAAE;IACF,SAAS;EAAqC,EAEjD,eACD;IACE,SAAS,8BAAmC;IAC5C,GAAG,EAAEe,UAAW;IAChB,cAAc,EAAEH,OAAO,GAAGgB,cAAc,GAAGS;EAAU,gBAErD;IAAK,SAAS;EAAwC,GAAE3B,OAAO,IAAIX,QAAQ,CAAO,CAC9E,CACM;AAElB,CAAC;AAAC"}

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { PanelHeaderButtonProps } from "../PanelHeaderButton/PanelHeaderButton";
+import { PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';
 export interface PanelHeaderEditProps extends PanelHeaderButtonProps {
     /**
      * Включен ли режим редактирования

package/dist/cjs/components/PanelHeaderEdit/PanelHeaderEdit.js

@@ -21,9 +21,9 @@ var PanelHeaderEdit = function PanelHeaderEdit(_ref) {
   var _ref$isActive = _ref.isActive,
     isActive = _ref$isActive === void 0 ? false : _ref$isActive,
     _ref$editLabel = _ref.editLabel,
-    editLabel = _ref$editLabel === void 0 ? "Редактировать" : _ref$editLabel,
+    editLabel = _ref$editLabel === void 0 ? 'Редактировать' : _ref$editLabel,
     _ref$doneLabel = _ref.doneLabel,
-    doneLabel = _ref$doneLabel === void 0 ? "Готово" : _ref$doneLabel,
+    doneLabel = _ref$doneLabel === void 0 ? 'Готово' : _ref$doneLabel,
     restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var iOSText = isActive ? doneLabel : editLabel;
   var AndroidIcon = isActive ? _icons.Icon28DoneOutline : _icons.Icon28EditOutline;

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderEdit.js","names":["PanelHeaderEdit","isActive","editLabel","doneLabel","restProps","iOSText","AndroidIcon","Icon28DoneOutline","Icon28EditOutline","platform","usePlatform","Platform","IOS"],"sources":["../../../../src/components/PanelHeaderEdit/PanelHeaderEdit.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Platform } from \"../../lib/platform\";\nimport { Icon28EditOutline, Icon28DoneOutline } from \"@vkontakte/icons\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\n\nexport interface PanelHeaderEditProps extends PanelHeaderButtonProps {\n  /**\n   * Включен ли режим редактирования\n   */\n  isActive?: boolean;\n  /**\n   * iOS only. Текст кнопки, когда режим редактирования не активен\n   */\n  editLabel?: string;\n  /**\n   * iOS only. Текст кнопки при активном режиме редактирования для выхода из него\n   */\n  doneLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderEdit\n */\nexport const PanelHeaderEdit = ({\n  isActive = false,\n  editLabel = \"Редактировать\",\n  doneLabel = \"Готово\",\n  ...restProps\n}: PanelHeaderEditProps) => {\n  const iOSText = isActive ? doneLabel : editLabel;\n  const AndroidIcon = isActive ? Icon28DoneOutline : Icon28EditOutline;\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton aria-label={iOSText} {...restProps}>\n      {platform === Platform.IOS ? iOSText : <AndroidIcon />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AAIA;AACA;AACA;AAAsD;AAiBtD;AACA;AACA;AACO,IAAMA,eAAe,GAAG,SAAlBA,eAAe,OAKA;EAAA,yBAJ1BC,QAAQ;IAARA,QAAQ,8BAAG,KAAK;IAAA,sBAChBC,SAAS;IAATA,SAAS,+BAAG,eAAe;IAAA,sBAC3BC,SAAS;IAATA,SAAS,+BAAG,QAAQ;IACjBC,SAAS;EAEZ,IAAMC,OAAO,GAAGJ,QAAQ,GAAGE,SAAS,GAAGD,SAAS;EAChD,IAAMI,WAAW,GAAGL,QAAQ,GAAGM,wBAAiB,GAAGC,wBAAiB;EACpE,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAE9B,oBACE,oBAAC,oCAAiB;IAAC,cAAYL;EAAQ,GAAKD,SAAS,GAClDK,QAAQ,KAAKE,kBAAQ,CAACC,GAAG,GAAGP,OAAO,gBAAG,oBAAC,WAAW,OAAG,CACpC;AAExB,CAAC;AAAC"}
+{"version":3,"file":"PanelHeaderEdit.js","names":["PanelHeaderEdit","isActive","editLabel","doneLabel","restProps","iOSText","AndroidIcon","Icon28DoneOutline","Icon28EditOutline","platform","usePlatform","Platform","IOS"],"sources":["../../../../src/components/PanelHeaderEdit/PanelHeaderEdit.tsx"],"sourcesContent":["import * as React from 'react';\nimport { PanelHeaderButton, PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';\nimport { Platform } from '../../lib/platform';\nimport { Icon28EditOutline, Icon28DoneOutline } from '@vkontakte/icons';\nimport { usePlatform } from '../../hooks/usePlatform';\n\nexport interface PanelHeaderEditProps extends PanelHeaderButtonProps {\n  /**\n   * Включен ли режим редактирования\n   */\n  isActive?: boolean;\n  /**\n   * iOS only. Текст кнопки, когда режим редактирования не активен\n   */\n  editLabel?: string;\n  /**\n   * iOS only. Текст кнопки при активном режиме редактирования для выхода из него\n   */\n  doneLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderEdit\n */\nexport const PanelHeaderEdit = ({\n  isActive = false,\n  editLabel = 'Редактировать',\n  doneLabel = 'Готово',\n  ...restProps\n}: PanelHeaderEditProps) => {\n  const iOSText = isActive ? doneLabel : editLabel;\n  const AndroidIcon = isActive ? Icon28DoneOutline : Icon28EditOutline;\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton aria-label={iOSText} {...restProps}>\n      {platform === Platform.IOS ? iOSText : <AndroidIcon />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AAAsD;AAiBtD;AACA;AACA;AACO,IAAMA,eAAe,GAAG,SAAlBA,eAAe,OAKA;EAAA,yBAJ1BC,QAAQ;IAARA,QAAQ,8BAAG,KAAK;IAAA,sBAChBC,SAAS;IAATA,SAAS,+BAAG,eAAe;IAAA,sBAC3BC,SAAS;IAATA,SAAS,+BAAG,QAAQ;IACjBC,SAAS;EAEZ,IAAMC,OAAO,GAAGJ,QAAQ,GAAGE,SAAS,GAAGD,SAAS;EAChD,IAAMI,WAAW,GAAGL,QAAQ,GAAGM,wBAAiB,GAAGC,wBAAiB;EACpE,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAE9B,oBACE,oBAAC,oCAAiB;IAAC,cAAYL;EAAQ,GAAKD,SAAS,GAClDK,QAAQ,KAAKE,kBAAQ,CAACC,GAAG,GAAGP,OAAO,gBAAG,oBAAC,WAAW,OAAG,CACpC;AAExB,CAAC;AAAC"}

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { PanelHeaderButtonProps } from "../PanelHeaderButton/PanelHeaderButton";
+import { PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderSubmit
  */

package/dist/cjs/components/PanelHeaderSubmit/PanelHeaderSubmit.js

@@ -20,7 +20,7 @@ var _excluded = ["children"];
  */
 var PanelHeaderSubmit = function PanelHeaderSubmit(_ref) {
   var _ref$children = _ref.children,
-    children = _ref$children === void 0 ? "Готово" : _ref$children,
+    children = _ref$children === void 0 ? 'Готово' : _ref$children,
     restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var platform = (0, _usePlatform.usePlatform)();
   return /*#__PURE__*/React.createElement(_PanelHeaderButton.PanelHeaderButton, (0, _extends2.default)({