@vkontakte/vkui 6.0.2 → 6.1.0

package/dist/components/Pagination/PaginationPage/PaginationPageEllipsis.js

@@ -1,5 +1,7 @@
 import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
 import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { Text } from '../../Typography/Text/Text';
@@ -13,9 +15,11 @@ export const PaginationPageEllipsis = (_param)=>{
         isCurrent: false,
         disabled
     });
-    return /*#__PURE__*/ React.createElement(Text, _object_spread({
+    return /*#__PURE__*/ _jsx(Text, _object_spread_props(_object_spread({
         className: classNames(paginationClassNames, "vkuiPaginationPage--type-ellipsis", className)
-    }, restProps), "…");
+    }, restProps), {
+        children: "…"
+    }));
 };
 
 //# sourceMappingURL=PaginationPageEllipsis.js.map

package/dist/components/Pagination/PaginationPage/PaginationPageEllipsis.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Pagination/PaginationPage/PaginationPageEllipsis.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasRootRef } from '../../../types';\nimport { Text } from '../../Typography/Text/Text';\nimport { usePaginationPageClassNames } from './usePaginationPageClasses';\nimport styles from './PaginationPage.module.css';\n\nexport interface PaginationPageEllipsisProps\n  extends React.HTMLAttributes<HTMLSpanElement>,\n    HasRootRef<HTMLSpanElement> {\n  disabled?: boolean;\n}\n\nexport const PaginationPageEllipsis = ({\n  className,\n  disabled,\n  ...restProps\n}: PaginationPageEllipsisProps) => {\n  const paginationClassNames = usePaginationPageClassNames({ isCurrent: false, disabled });\n\n  return (\n    <Text\n      className={classNames(\n        paginationClassNames,\n        styles['PaginationPage--type-ellipsis'],\n        className,\n      )}\n      {...restProps}\n    >\n      &#8230;\n    </Text>\n  );\n};\n"],"names":["React","classNames","Text","usePaginationPageClassNames","PaginationPageEllipsis","className","disabled","restProps","paginationClassNames","isCurrent"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,IAAI,QAAQ,6BAA6B;AAClD,SAASC,2BAA2B,QAAQ,6BAA6B;AASzE,OAAO,MAAMC,yBAAyB;QAAC,EACrCC,SAAS,EACTC,QAAQ,EAEoB,WADzBC;QAFHF;QACAC;;IAGA,MAAME,uBAAuBL,4BAA4B;QAAEM,WAAW;QAAOH;IAAS;IAEtF,qBACE,oBAACJ;QACCG,WAAWJ,WACTO,2DAEAH;OAEEE,YACL;AAIL,EAAE"}
+{"version":3,"sources":["../../../../src/components/Pagination/PaginationPage/PaginationPageEllipsis.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasRootRef } from '../../../types';\nimport { Text } from '../../Typography/Text/Text';\nimport { usePaginationPageClassNames } from './usePaginationPageClasses';\nimport styles from './PaginationPage.module.css';\n\nexport interface PaginationPageEllipsisProps\n  extends React.HTMLAttributes<HTMLSpanElement>,\n    HasRootRef<HTMLSpanElement> {\n  disabled?: boolean;\n}\n\nexport const PaginationPageEllipsis = ({\n  className,\n  disabled,\n  ...restProps\n}: PaginationPageEllipsisProps) => {\n  const paginationClassNames = usePaginationPageClassNames({ isCurrent: false, disabled });\n\n  return (\n    <Text\n      className={classNames(\n        paginationClassNames,\n        styles['PaginationPage--type-ellipsis'],\n        className,\n      )}\n      {...restProps}\n    >\n      &#8230;\n    </Text>\n  );\n};\n"],"names":["React","classNames","Text","usePaginationPageClassNames","PaginationPageEllipsis","className","disabled","restProps","paginationClassNames","isCurrent"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,IAAI,QAAQ,6BAA6B;AAClD,SAASC,2BAA2B,QAAQ,6BAA6B;AASzE,OAAO,MAAMC,yBAAyB;QAAC,EACrCC,SAAS,EACTC,QAAQ,EAEoB,WADzBC;QAFHF;QACAC;;IAGA,MAAME,uBAAuBL,4BAA4B;QAAEM,WAAW;QAAOH;IAAS;IAEtF,qBACE,KAACJ;QACCG,WAAWJ,WACTO,2DAEAH;OAEEE;kBACL;;AAIL,EAAE"}

package/dist/components/Pagination/PaginationPage/usePaginationPageClasses.d.ts

@@ -1,6 +1,10 @@
+import { SizeTypeValues } from '../../../lib/adaptivity';
 export interface UsePaginationPageClassNamesProps {
     isCurrent?: boolean;
     disabled?: boolean;
 }
+export declare const getPaginationPageClassNames: (opts: UsePaginationPageClassNamesProps & {
+    sizeY?: SizeTypeValues;
+}) => string;
 export declare function usePaginationPageClassNames({ isCurrent, disabled, }: UsePaginationPageClassNamesProps): string;
 //# sourceMappingURL=usePaginationPageClasses.d.ts.map

package/dist/components/Pagination/PaginationPage/usePaginationPageClasses.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePaginationPageClasses.d.ts","sourceRoot":"","sources":["../../../../src/components/Pagination/PaginationPage/usePaginationPageClasses.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,gCAAgC;IAC/C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,2BAA2B,CAAC,EAC1C,SAAS,EACT,QAAQ,GACT,EAAE,gCAAgC,UAUlC"}
+{"version":3,"file":"usePaginationPageClasses.d.ts","sourceRoot":"","sources":["../../../../src/components/Pagination/PaginationPage/usePaginationPageClasses.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAGzD,MAAM,WAAW,gCAAgC;IAC/C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,2BAA2B,SAChC,gCAAgC,GAAG;IAAE,KAAK,CAAC,EAAE,cAAc,CAAA;CAAE,WASpE,CAAC;AAEF,wBAAgB,2BAA2B,CAAC,EAC1C,SAAS,EACT,QAAQ,GACT,EAAE,gCAAgC,UAOlC"}

package/dist/components/Pagination/PaginationPage/usePaginationPageClasses.js

@@ -1,8 +1,15 @@
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivity } from '../../../hooks/useAdaptivity';
+export const getPaginationPageClassNames = (opts)=>{
+    return classNames("vkuiPaginationPage", opts.sizeY == null && "vkuiPaginationPage--sizeY-none", opts.sizeY === 'compact' && "vkuiPaginationPage--sizeY-compact", opts.isCurrent && "vkuiPaginationPage--current", opts.disabled && "vkuiPaginationPage--disabled");
+};
 export function usePaginationPageClassNames({ isCurrent, disabled }) {
-    const { sizeY = 'none' } = useAdaptivity();
-    return classNames("vkuiPaginationPage", sizeY === 'none' && "vkuiPaginationPage--sizeY-none", sizeY === 'compact' && "vkuiPaginationPage--sizeY-compact", isCurrent && "vkuiPaginationPage--current", disabled && "vkuiPaginationPage--disabled");
+    const { sizeY } = useAdaptivity();
+    return getPaginationPageClassNames({
+        isCurrent,
+        disabled,
+        sizeY
+    });
 }
 
 //# sourceMappingURL=usePaginationPageClasses.js.map

package/dist/components/Pagination/PaginationPage/usePaginationPageClasses.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Pagination/PaginationPage/usePaginationPageClasses.ts"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport styles from './PaginationPage.module.css';\n\nexport interface UsePaginationPageClassNamesProps {\n  isCurrent?: boolean;\n  disabled?: boolean;\n}\n\nexport function usePaginationPageClassNames({\n  isCurrent,\n  disabled,\n}: UsePaginationPageClassNamesProps) {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return classNames(\n    styles['PaginationPage'],\n    sizeY === 'none' && styles['PaginationPage--sizeY-none'],\n    sizeY === 'compact' && styles['PaginationPage--sizeY-compact'],\n    isCurrent && styles['PaginationPage--current'],\n    disabled && styles['PaginationPage--disabled'],\n  );\n}\n"],"names":["classNames","useAdaptivity","usePaginationPageClassNames","isCurrent","disabled","sizeY"],"mappings":"AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA+B;AAQ7D,OAAO,SAASC,4BAA4B,EAC1CC,SAAS,EACTC,QAAQ,EACyB;IACjC,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGJ;IAE3B,OAAOD,iCAELK,UAAU,4CACVA,UAAU,kDACVF,4CACAC;AAEJ"}
+{"version":3,"sources":["../../../../src/components/Pagination/PaginationPage/usePaginationPageClasses.ts"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport { SizeTypeValues } from '../../../lib/adaptivity';\nimport styles from './PaginationPage.module.css';\n\nexport interface UsePaginationPageClassNamesProps {\n  isCurrent?: boolean;\n  disabled?: boolean;\n}\n\nexport const getPaginationPageClassNames = (\n  opts: UsePaginationPageClassNamesProps & { sizeY?: SizeTypeValues },\n) => {\n  return classNames(\n    styles['PaginationPage'],\n    opts.sizeY == null && styles['PaginationPage--sizeY-none'],\n    opts.sizeY === 'compact' && styles['PaginationPage--sizeY-compact'],\n    opts.isCurrent && styles['PaginationPage--current'],\n    opts.disabled && styles['PaginationPage--disabled'],\n  );\n};\n\nexport function usePaginationPageClassNames({\n  isCurrent,\n  disabled,\n}: UsePaginationPageClassNamesProps) {\n  const { sizeY } = useAdaptivity();\n  return getPaginationPageClassNames({\n    isCurrent,\n    disabled,\n    sizeY,\n  });\n}\n"],"names":["classNames","useAdaptivity","getPaginationPageClassNames","opts","sizeY","isCurrent","disabled","usePaginationPageClassNames"],"rangeMappings":";;;;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA+B;AAS7D,OAAO,MAAMC,8BAA8B,CACzCC;IAEA,OAAOH,iCAELG,KAAKC,KAAK,IAAI,0CACdD,KAAKC,KAAK,KAAK,kDACfD,KAAKE,SAAS,mCACdF,KAAKG,QAAQ;AAEjB,EAAE;AAEF,OAAO,SAASC,4BAA4B,EAC1CF,SAAS,EACTC,QAAQ,EACyB;IACjC,MAAM,EAAEF,KAAK,EAAE,GAAGH;IAClB,OAAOC,4BAA4B;QACjCG;QACAC;QACAF;IACF;AACF"}

package/dist/components/Pagination/utils.js

@@ -1,5 +1,5 @@
 export function getPageLabelDefault(isCurrent) {
-    return isCurrent ? `Cтраница` : `Перейти на страницу`;
+    return isCurrent ? `Страница` : `Перейти на страницу`;
 }
 
 //# sourceMappingURL=utils.js.map

package/dist/components/Pagination/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Pagination/utils.ts"],"sourcesContent":["export function getPageLabelDefault(isCurrent: boolean): string {\n  return isCurrent ? `Cтраница` : `Перейти на страницу`;\n}\n"],"names":["getPageLabelDefault","isCurrent"],"mappings":"AAAA,OAAO,SAASA,oBAAoBC,SAAkB;IACpD,OAAOA,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,mBAAmB,CAAC;AACvD"}
+{"version":3,"sources":["../../../src/components/Pagination/utils.ts"],"sourcesContent":["export function getPageLabelDefault(isCurrent: boolean): string {\n  return isCurrent ? `Страница` : `Перейти на страницу`;\n}\n"],"names":["getPageLabelDefault","isCurrent"],"rangeMappings":";;","mappings":"AAAA,OAAO,SAASA,oBAAoBC,SAAkB;IACpD,OAAOA,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,mBAAmB,CAAC;AACvD"}

package/dist/components/Panel/Panel.d.ts

@@ -1,11 +1,22 @@
-import * as React from 'react';
 import { NavIdProps } from '../../lib/getNavId';
 import { HTMLAttributesWithRootRef } from '../../types';
 export interface PanelProps extends HTMLAttributesWithRootRef<HTMLDivElement>, NavIdProps {
     centered?: boolean;
+    /**
+     * Тип оформления панели.
+     *
+     * Позволяет переопределить тип оформления панели,
+     * заданный через адаптивность или свойство layout у [AppRoot](https://vkcom.github.io/VKUI/#/AppRoot),
+     * глобально задающим тип оформления макета.
+     *
+     * Если установлен `card` - Panel имеет фон отличный от фона контента.
+     * Позволяет компоненту [Group](https://vkcom.github.io/VKUI/#/Group) со свойством mode='card' точечно выглядеть как карточка.
+     * Тип `plain` — соответствует фону по умолчанию.
+     */
+    mode?: 'plain' | 'card';
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Panel
  */
-export declare const Panel: ({ centered, children, nav, ...restProps }: PanelProps) => React.JSX.Element;
+export declare const Panel: ({ centered, children, nav, mode: modeProp, ...restProps }: PanelProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Panel.d.ts.map

package/dist/components/Panel/Panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Panel.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/Panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAcxD,MAAM,WAAW,UAAW,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU;IACvF,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,eAAO,MAAM,KAAK,8CAAuD,UAAU,sBA0BlF,CAAC"}
+{"version":3,"file":"Panel.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/Panel.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAoBxD,MAAM,WAAW,UAAW,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU;IACvF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;;;;OAUG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CACzB;AAED;;GAEG;AACH,eAAO,MAAM,KAAK,8DAMf,UAAU,4CA2BZ,CAAC"}

package/dist/components/Panel/Panel.js

@@ -1,6 +1,7 @@
 import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
 import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
 import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
@@ -14,30 +15,57 @@ const sizeXClassNames = {
     ['compact']: "vkuiPanel--sizeX-compact",
     ['regular']: "vkuiPanel--sizeX-regular"
 };
+const stylesMode = {
+    none: "vkuiPanel--mode-none",
+    plain: "vkuiPanel--mode-plain",
+    card: "vkuiPanel--mode-card"
+};
 /**
  * @see https://vkcom.github.io/VKUI/#/Panel
  */ export const Panel = (_param)=>{
-    var { centered = false, children, nav } = _param, restProps = _object_without_properties(_param, [
+    var { centered = false, children, nav, mode: modeProp } = _param, restProps = _object_without_properties(_param, [
         "centered",
         "children",
-        "nav"
+        "nav",
+        "mode"
     ]);
     const { sizeX = 'none' } = useAdaptivity();
-    const { layout } = React.useContext(AppRootContext);
-    return /*#__PURE__*/ React.createElement(NavPanelIdContext.Provider, {
-        value: restProps.id || nav
-    }, /*#__PURE__*/ React.createElement(RootComponent, _object_spread_props(_object_spread({}, restProps), {
-        baseClassName: classNames("vkuiPanel", sizeXClassNames[sizeX], centered && 'vkuiInternalPanel--centered', layout === 'card' && "vkuiPanel--layout-card")
-    }), /*#__PURE__*/ React.createElement(Touch, {
-        Component: OnboardingTooltipContainer,
-        className: classNames("vkuiPanel__in", 'vkuiInternalPanel__in')
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: "vkuiPanel__in-before"
-    }), centered ? /*#__PURE__*/ React.createElement("div", {
-        className: "vkuiPanel__centered"
-    }, children) : children, /*#__PURE__*/ React.createElement("div", {
-        className: "vkuiPanel__in-after"
-    }))));
+    const mode = usePanelMode(modeProp, sizeX);
+    return /*#__PURE__*/ _jsx(NavPanelIdContext.Provider, {
+        value: restProps.id || nav,
+        children: /*#__PURE__*/ _jsx(RootComponent, _object_spread_props(_object_spread({}, restProps), {
+            baseClassName: classNames("vkuiPanel", sizeXClassNames[sizeX], centered && 'vkuiInternalPanel--centered', stylesMode[mode]),
+            children: /*#__PURE__*/ _jsxs(Touch, {
+                Component: OnboardingTooltipContainer,
+                className: classNames("vkuiPanel__in", 'vkuiInternalPanel__in'),
+                children: [
+                    /*#__PURE__*/ _jsx("div", {
+                        className: "vkuiPanel__in-before"
+                    }),
+                    centered ? /*#__PURE__*/ _jsx("div", {
+                        className: "vkuiPanel__centered",
+                        children: children
+                    }) : children,
+                    /*#__PURE__*/ _jsx("div", {
+                        className: "vkuiPanel__in-after"
+                    })
+                ]
+            })
+        }))
+    });
 };
+function usePanelMode(modeProp, sizeX) {
+    const { layout } = React.useContext(AppRootContext);
+    if (modeProp) {
+        return modeProp;
+    }
+    if (layout) {
+        return layout;
+    }
+    if (sizeX !== 'none') {
+        return sizeX === 'regular' ? 'card' : 'plain';
+    }
+    return 'none';
+}
 
 //# sourceMappingURL=Panel.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Panel/Panel.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { NavIdProps } from '../../lib/getNavId';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { AppRootContext } from '../AppRoot/AppRootContext';\nimport { NavPanelIdContext } from '../NavIdContext/NavIdContext';\nimport { OnboardingTooltipContainer } from '../OnboardingTooltip/OnboardingTooltipContainer';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Touch } from '../Touch/Touch';\nimport styles from './Panel.module.css';\n\nconst sizeXClassNames = {\n  none: styles['Panel--sizeX-none'],\n  ['compact']: styles['Panel--sizeX-compact'],\n  ['regular']: styles['Panel--sizeX-regular'],\n};\n\nexport interface PanelProps extends HTMLAttributesWithRootRef<HTMLDivElement>, NavIdProps {\n  centered?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Panel\n */\nexport const Panel = ({ centered = false, children, nav, ...restProps }: PanelProps) => {\n  const { sizeX = 'none' } = useAdaptivity();\n  const { layout } = React.useContext(AppRootContext);\n\n  return (\n    <NavPanelIdContext.Provider value={restProps.id || nav}>\n      <RootComponent\n        {...restProps}\n        baseClassName={classNames(\n          styles['Panel'],\n          sizeXClassNames[sizeX],\n          centered && 'vkuiInternalPanel--centered',\n          layout === 'card' && styles['Panel--layout-card'],\n        )}\n      >\n        <Touch\n          Component={OnboardingTooltipContainer}\n          className={classNames(styles['Panel__in'], 'vkuiInternalPanel__in')}\n        >\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      </RootComponent>\n    </NavPanelIdContext.Provider>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","AppRootContext","NavPanelIdContext","OnboardingTooltipContainer","RootComponent","Touch","sizeXClassNames","none","Panel","centered","children","nav","restProps","sizeX","layout","useContext","Provider","value","id","baseClassName","Component","className","div"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAG1D,SAASC,cAAc,QAAQ,4BAA4B;AAC3D,SAASC,iBAAiB,QAAQ,+BAA+B;AACjE,SAASC,0BAA0B,QAAQ,kDAAkD;AAC7F,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,KAAK,QAAQ,iBAAiB;AAGvC,MAAMC,kBAAkB;IACtBC,IAAI;IACJ,CAAC,UAAU;IACX,CAAC,UAAU;AACb;AAMA;;CAEC,GACD,OAAO,MAAMC,QAAQ;QAAC,EAAEC,WAAW,KAAK,EAAEC,QAAQ,EAAEC,GAAG,EAA4B,WAAvBC;QAApCH;QAAkBC;QAAUC;;IAClD,MAAM,EAAEE,QAAQ,MAAM,EAAE,GAAGb;IAC3B,MAAM,EAAEc,MAAM,EAAE,GAAGhB,MAAMiB,UAAU,CAACd;IAEpC,qBACE,oBAACC,kBAAkBc,QAAQ;QAACC,OAAOL,UAAUM,EAAE,IAAIP;qBACjD,oBAACP,uDACKQ;QACJO,eAAepB,wBAEbO,eAAe,CAACO,MAAM,EACtBJ,YAAY,+BACZK,WAAW;sBAGb,oBAACT;QACCe,WAAWjB;QACXkB,WAAWtB,4BAAgC;qBAE3C,oBAACuB;QAAID,SAAS;QACbZ,yBAAW,oBAACa;QAAID,SAAS;OAA8BX,YAAkBA,wBAC1E,oBAACY;QAAID,SAAS;;AAKxB,EAAE"}
+{"version":3,"sources":["../../../src/components/Panel/Panel.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeTypeValues } from '../../lib/adaptivity';\nimport { NavIdProps } from '../../lib/getNavId';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { AppRootContext } from '../AppRoot/AppRootContext';\nimport { NavPanelIdContext } from '../NavIdContext/NavIdContext';\nimport { OnboardingTooltipContainer } from '../OnboardingTooltip/OnboardingTooltipContainer';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Touch } from '../Touch/Touch';\nimport styles from './Panel.module.css';\n\nconst sizeXClassNames = {\n  none: styles['Panel--sizeX-none'],\n  ['compact']: styles['Panel--sizeX-compact'],\n  ['regular']: styles['Panel--sizeX-regular'],\n};\n\nconst stylesMode = {\n  none: styles['Panel--mode-none'],\n  plain: styles['Panel--mode-plain'],\n  card: styles['Panel--mode-card'],\n};\n\nexport interface PanelProps extends HTMLAttributesWithRootRef<HTMLDivElement>, NavIdProps {\n  centered?: boolean;\n  /**\n   * Тип оформления панели.\n   *\n   * Позволяет переопределить тип оформления панели,\n   * заданный через адаптивность или свойство layout у [AppRoot](https://vkcom.github.io/VKUI/#/AppRoot),\n   * глобально задающим тип оформления макета.\n   *\n   * Если установлен `card` - Panel имеет фон отличный от фона контента.\n   * Позволяет компоненту [Group](https://vkcom.github.io/VKUI/#/Group) со свойством mode='card' точечно выглядеть как карточка.\n   * Тип `plain` — соответствует фону по умолчанию.\n   */\n  mode?: 'plain' | 'card';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Panel\n */\nexport const Panel = ({\n  centered = false,\n  children,\n  nav,\n  mode: modeProp,\n  ...restProps\n}: PanelProps) => {\n  const { sizeX = 'none' } = useAdaptivity();\n\n  const mode = usePanelMode(modeProp, sizeX);\n\n  return (\n    <NavPanelIdContext.Provider value={restProps.id || nav}>\n      <RootComponent\n        {...restProps}\n        baseClassName={classNames(\n          styles['Panel'],\n          sizeXClassNames[sizeX],\n          centered && 'vkuiInternalPanel--centered',\n          stylesMode[mode],\n        )}\n      >\n        <Touch\n          Component={OnboardingTooltipContainer}\n          className={classNames(styles['Panel__in'], 'vkuiInternalPanel__in')}\n        >\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      </RootComponent>\n    </NavPanelIdContext.Provider>\n  );\n};\n\nfunction usePanelMode(\n  modeProp: PanelProps['mode'],\n  sizeX: SizeTypeValues | 'none',\n): 'plain' | 'card' | 'none' {\n  const { layout } = React.useContext(AppRootContext);\n\n  if (modeProp) {\n    return modeProp;\n  }\n\n  if (layout) {\n    return layout;\n  }\n\n  if (sizeX !== 'none') {\n    return sizeX === 'regular' ? 'card' : 'plain';\n  }\n\n  return 'none';\n}\n"],"names":["React","classNames","useAdaptivity","AppRootContext","NavPanelIdContext","OnboardingTooltipContainer","RootComponent","Touch","sizeXClassNames","none","stylesMode","plain","card","Panel","centered","children","nav","mode","modeProp","restProps","sizeX","usePanelMode","Provider","value","id","baseClassName","Component","className","div","layout","useContext"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAI1D,SAASC,cAAc,QAAQ,4BAA4B;AAC3D,SAASC,iBAAiB,QAAQ,+BAA+B;AACjE,SAASC,0BAA0B,QAAQ,kDAAkD;AAC7F,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,KAAK,QAAQ,iBAAiB;AAGvC,MAAMC,kBAAkB;IACtBC,IAAI;IACJ,CAAC,UAAU;IACX,CAAC,UAAU;AACb;AAEA,MAAMC,aAAa;IACjBD,IAAI;IACJE,KAAK;IACLC,IAAI;AACN;AAkBA;;CAEC,GACD,OAAO,MAAMC,QAAQ;QAAC,EACpBC,WAAW,KAAK,EAChBC,QAAQ,EACRC,GAAG,EACHC,MAAMC,QAAQ,EAEH,WADRC;QAJHL;QACAC;QACAC;QACAC;;IAGA,MAAM,EAAEG,QAAQ,MAAM,EAAE,GAAGlB;IAE3B,MAAMe,OAAOI,aAAaH,UAAUE;IAEpC,qBACE,KAAChB,kBAAkBkB,QAAQ;QAACC,OAAOJ,UAAUK,EAAE,IAAIR;kBACjD,cAAA,KAACV,uDACKa;YACJM,eAAexB,wBAEbO,eAAe,CAACY,MAAM,EACtBN,YAAY,+BACZJ,UAAU,CAACO,KAAK;sBAGlB,cAAA,MAACV;gBACCmB,WAAWrB;gBACXsB,WAAW1B,4BAAgC;;kCAE3C,KAAC2B;wBAAID,SAAS;;oBACbb,yBAAW,KAACc;wBAAID,SAAS;kCAA8BZ;yBAAkBA;kCAC1E,KAACa;wBAAID,SAAS;;;;;;AAKxB,EAAE;AAEF,SAASN,aACPH,QAA4B,EAC5BE,KAA8B;IAE9B,MAAM,EAAES,MAAM,EAAE,GAAG7B,MAAM8B,UAAU,CAAC3B;IAEpC,IAAIe,UAAU;QACZ,OAAOA;IACT;IAEA,IAAIW,QAAQ;QACV,OAAOA;IACT;IAEA,IAAIT,UAAU,QAAQ;QACpB,OAAOA,UAAU,YAAY,SAAS;IACxC;IAEA,OAAO;AACT"}

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

@@ -37,5 +37,5 @@ export interface PanelHeaderProps extends HTMLAttributesWithRootRef<HTMLDivEleme
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeader
  */
-export declare const PanelHeader: ({ before, children, after, float, transparent, delimiter, shadow, getRef, getRootRef, fixed, typographyProps, ...restProps }: PanelHeaderProps) => React.JSX.Element;
+export declare const PanelHeader: ({ before, children, after, float, transparent, delimiter, shadow, getRef, getRootRef, fixed, typographyProps, ...restProps }: PanelHeaderProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=PanelHeader.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeader.d.ts","sourceRoot":"","sources":["../../../src/components/PanelHeader/PanelHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AA2BhG,MAAM,WAAW,gBACf,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAC/C,MAAM,CAAC,cAAc,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;;OAIG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,WAAW,GAAG,SAAS,CAAC;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,eAAe,CAAC,EAAE,YAAY,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG,gBAAgB,CAAC;CACvF;AAgDD;;GAEG;AACH,eAAO,MAAM,WAAW,iIAarB,gBAAgB,sBA+DlB,CAAC"}
+{"version":3,"file":"PanelHeader.d.ts","sourceRoot":"","sources":["../../../src/components/PanelHeader/PanelHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AA2BhG,MAAM,WAAW,gBACf,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAC/C,MAAM,CAAC,cAAc,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;;OAIG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,WAAW,GAAG,SAAS,CAAC;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,eAAe,CAAC,EAAE,YAAY,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG,gBAAgB,CAAC;CACvF;AAgDD;;GAEG;AACH,eAAO,MAAM,WAAW,iIAarB,gBAAgB,4CA+DlB,CAAC"}

package/dist/components/PanelHeader/PanelHeader.js

@@ -1,6 +1,7 @@
 import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
 import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
 import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
@@ -41,22 +42,33 @@ const PanelHeaderIn = ({ before, after, children, typographyProps = {} })=>{
             minWidth: customPanelHeaderAfterMinWidth
         }
     };
-    const typographyNode = platform === 'vkcom' ? /*#__PURE__*/ React.createElement(Text, _object_spread({
+    const typographyNode = platform === 'vkcom' ? /*#__PURE__*/ _jsx(Text, _object_spread_props(_object_spread({
         weight: "2",
         Component: Component
-    }, restProps), children) : /*#__PURE__*/ React.createElement(Component, _object_spread({
+    }, restProps), {
+        children: children
+    })) : /*#__PURE__*/ _jsx(Component, _object_spread_props(_object_spread({
         className: "vkuiPanelHeader__content-in"
-    }, restProps), children);
-    return /*#__PURE__*/ React.createElement(OnboardingTooltipContainer, {
+    }, restProps), {
+        children: children
+    }));
+    return /*#__PURE__*/ _jsxs(OnboardingTooltipContainer, {
         fixed: true,
-        className: "vkuiPanelHeader__in"
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: classNames("vkuiPanelHeader__before", 'vkuiInternalPanelHeader__before')
-    }, before), /*#__PURE__*/ React.createElement("div", {
-        className: "vkuiPanelHeader__content"
-    }, typographyNode), /*#__PURE__*/ React.createElement("div", _object_spread({
-        className: classNames("vkuiPanelHeader__after", 'vkuiInternalPanelHeader__after')
-    }, afterSlotProps)));
+        className: "vkuiPanelHeader__in",
+        children: [
+            /*#__PURE__*/ _jsx("div", {
+                className: classNames("vkuiPanelHeader__before", 'vkuiInternalPanelHeader__before'),
+                children: before
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                className: "vkuiPanelHeader__content",
+                children: typographyNode
+            }),
+            /*#__PURE__*/ _jsx("div", _object_spread({
+                className: classNames("vkuiPanelHeader__after", 'vkuiInternalPanelHeader__after')
+            }, afterSlotProps))
+        ]
+    });
 };
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeader
@@ -82,29 +94,42 @@ const PanelHeaderIn = ({ before, after, children, typographyProps = {} })=>{
     const separatorVisible = delimiter === 'auto' || delimiter === 'separator';
     const staticSeparatorVisible = !float && separatorVisible;
     const staticSpacingVisible = !float && (delimiter === 'auto' || delimiter === 'spacing');
-    return /*#__PURE__*/ React.createElement(RootComponent, _object_spread_props(_object_spread({}, restProps), {
+    return /*#__PURE__*/ _jsxs(RootComponent, _object_spread_props(_object_spread({}, restProps), {
         baseClassName: classNames("vkuiPanelHeader", 'vkuiInternalPanelHeader', platformClassNames.hasOwnProperty(platform) ? platformClassNames[platform] : platformClassNames.android, transparent && "vkuiPanelHeader--trnsp", shadow && "vkuiPanelHeader--shadow", !float && classNames("vkuiPanelHeader--static", 'vkuiInternalPanelHeader--static'), staticSeparatorVisible && classNames("vkuiPanelHeader--sep", 'vkuiInternalPanelHeader--sep'), !before && classNames("vkuiPanelHeader--no-before", 'vkuiInternalPanelHeader--no-before'), !after && "vkuiPanelHeader--no-after", isFixed && "vkuiPanelHeader--fixed", sizeX !== 'compact' && sizeXClassNames[sizeX], sizeY !== 'regular' && sizeYClassNames[sizeY]),
-        getRootRef: isFixed ? getRootRef : getRef
-    }), isFixed ? /*#__PURE__*/ React.createElement(FixedLayout, {
-        className: classNames("vkuiPanelHeader__fixed", 'vkuiInternalPanelHeader__fixed'),
-        vertical: "top",
-        getRootRef: getRef
-    }, /*#__PURE__*/ React.createElement(PanelHeaderIn, {
-        before: before,
-        after: after,
-        typographyProps: typographyProps
-    }, children)) : /*#__PURE__*/ React.createElement(PanelHeaderIn, {
-        before: before,
-        after: after,
-        typographyProps: typographyProps
-    }, children), !isVKCOM && /*#__PURE__*/ React.createElement(React.Fragment, null, staticSeparatorVisible && adaptiveSizeX.compact && /*#__PURE__*/ React.createElement(Separator, {
-        className: adaptiveSizeX.compact.className
-    }), staticSpacingVisible && adaptiveSizeX.regular && /*#__PURE__*/ React.createElement(Spacing, {
-        className: adaptiveSizeX.regular.className,
-        size: 16
-    })), separatorVisible && isVKCOM && /*#__PURE__*/ React.createElement(Separator, {
-        className: "vkuiPanelHeader__separator",
-        wide: true
+        getRootRef: isFixed ? getRootRef : getRef,
+        children: [
+            isFixed ? /*#__PURE__*/ _jsx(FixedLayout, {
+                className: classNames("vkuiPanelHeader__fixed", 'vkuiInternalPanelHeader__fixed'),
+                vertical: "top",
+                getRootRef: getRef,
+                children: /*#__PURE__*/ _jsx(PanelHeaderIn, {
+                    before: before,
+                    after: after,
+                    typographyProps: typographyProps,
+                    children: children
+                })
+            }) : /*#__PURE__*/ _jsx(PanelHeaderIn, {
+                before: before,
+                after: after,
+                typographyProps: typographyProps,
+                children: children
+            }),
+            !isVKCOM && /*#__PURE__*/ _jsxs(_Fragment, {
+                children: [
+                    staticSeparatorVisible && adaptiveSizeX.compact && /*#__PURE__*/ _jsx(Separator, {
+                        className: adaptiveSizeX.compact.className
+                    }),
+                    staticSpacingVisible && adaptiveSizeX.regular && /*#__PURE__*/ _jsx(Spacing, {
+                        className: adaptiveSizeX.regular.className,
+                        size: 16
+                    })
+                ]
+            }),
+            separatorVisible && isVKCOM && /*#__PURE__*/ _jsx(Separator, {
+                className: "vkuiPanelHeader__separator",
+                wide: true
+            })
+        ]
     }));
 };
 

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PanelHeader/PanelHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasComponent, HasDataAttribute, HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FixedLayout } from '../FixedLayout/FixedLayout';\nimport { ModalRootContext } from '../ModalRoot/ModalRootContext';\nimport { OnboardingTooltipContainer } from '../OnboardingTooltip/OnboardingTooltipContainer';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Separator } from '../Separator/Separator';\nimport { Spacing } from '../Spacing/Spacing';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './PanelHeader.module.css';\n\nconst platformClassNames = {\n  ios: styles['PanelHeader--ios'],\n  android: styles['PanelHeader--android'],\n  vkcom: classNames(styles['PanelHeader--vkcom'], 'vkuiInternalPanelHeader--vkcom'),\n};\n\nconst sizeXClassNames = {\n  none: styles['PanelHeader--sizeX-none'],\n  regular: styles['PanelHeader--sizeX-regular'],\n};\n\nconst sizeYClassNames = {\n  none: styles['PanelHeader--sizeY-none'],\n  compact: styles['PanelHeader--sizeY-compact'],\n};\n\nexport interface PanelHeaderProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  before?: React.ReactNode;\n  /**\n   * Добавляет элемент справа.\n   *\n   * При передаче нескольких элементов, расставляет отступы между ними.\n   */\n  after?: React.ReactNode;\n  /**\n   * Тип разделителя под шапкой.\n   *\n   * - `\"none\"` означает, что разделитель не нужен\n   * - `\"separator\"` включает сепаратор при условии, что это:\n   *      - либо платформа `vkcom`\n   *      - либо платформа `android`/`ios` при `<AdaptivityProvider sizeX=\"compact\" />`\n   * - `\"spacing\"` включает отступ, если это платформа `android`/`ios` при `<AdaptivityProvider sizeX=\"regular\" />`\n   * - `\"auto\"` автоматически подбирает либо `\"separator\"`, либо `\"spacing\"` по их условиям\n   */\n  delimiter?: 'auto' | 'none' | 'separator' | 'spacing';\n  transparent?: boolean;\n  shadow?: boolean;\n  /**\n   * Высота шапки будет игнорироваться контентом панели\n   */\n  float?: boolean;\n  /**\n   * Если `false`, то шапка будет в потоке. По умолчанию `true`, но если платформа vkcom, то по умолчанию `false`.\n   */\n  fixed?: boolean;\n  /**\n   * По умолчанию как `Component` используется `span`.\n   */\n  typographyProps?: HasComponent & React.HTMLAttributes<HTMLElement> & HasDataAttribute;\n}\n\ninterface PanelHeaderInProps {\n  before?: PanelHeaderProps['before'];\n  after?: PanelHeaderProps['after'];\n  children?: PanelHeaderProps['children'];\n  typographyProps?: PanelHeaderProps['typographyProps'];\n}\n\nconst PanelHeaderIn = ({ before, after, children, typographyProps = {} }: PanelHeaderInProps) => {\n  const { Component = 'span', ...restProps } = typographyProps;\n  const { hasCustomPanelHeaderAfter, customPanelHeaderAfterMinWidth } = useConfigProvider();\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n\n  const afterSlotProps =\n    !hasCustomPanelHeaderAfter || isInsideModal\n      ? {\n          children: after,\n        }\n      : {\n          style: { minWidth: customPanelHeaderAfterMinWidth },\n        };\n  const typographyNode: React.ReactNode =\n    platform === 'vkcom' ? (\n      <Text weight=\"2\" Component={Component} {...restProps}>\n        {children}\n      </Text>\n    ) : (\n      <Component className={styles['PanelHeader__content-in']} {...restProps}>\n        {children}\n      </Component>\n    );\n\n  return (\n    <OnboardingTooltipContainer fixed className={styles['PanelHeader__in']}>\n      <div className={classNames(styles['PanelHeader__before'], 'vkuiInternalPanelHeader__before')}>\n        {before}\n      </div>\n      <div className={styles['PanelHeader__content']}>{typographyNode}</div>\n      <div\n        className={classNames(styles['PanelHeader__after'], 'vkuiInternalPanelHeader__after')}\n        {...afterSlotProps}\n      />\n    </OnboardingTooltipContainer>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeader\n */\nexport const PanelHeader = ({\n  before,\n  children,\n  after,\n  float = false,\n  transparent = false,\n  delimiter = 'auto',\n  shadow,\n  getRef,\n  getRootRef,\n  fixed,\n  typographyProps,\n  ...restProps\n}: PanelHeaderProps) => {\n  const platform = usePlatform();\n  const { sizeX = 'none', sizeY = 'none' } = useAdaptivity();\n  const { sizeX: adaptiveSizeX } = useAdaptivityConditionalRender();\n  const isVKCOM = platform === 'vkcom';\n  const isFixed = fixed !== undefined ? fixed : !isVKCOM;\n  const separatorVisible = delimiter === 'auto' || delimiter === 'separator';\n  const staticSeparatorVisible = !float && separatorVisible;\n  const staticSpacingVisible = !float && (delimiter === 'auto' || delimiter === 'spacing');\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['PanelHeader'],\n        'vkuiInternalPanelHeader',\n        platformClassNames.hasOwnProperty(platform)\n          ? platformClassNames[platform]\n          : platformClassNames.android,\n        transparent && styles['PanelHeader--trnsp'],\n        shadow && styles['PanelHeader--shadow'],\n        !float && classNames(styles['PanelHeader--static'], 'vkuiInternalPanelHeader--static'),\n        staticSeparatorVisible &&\n          classNames(styles['PanelHeader--sep'], 'vkuiInternalPanelHeader--sep'),\n        !before &&\n          classNames(styles['PanelHeader--no-before'], 'vkuiInternalPanelHeader--no-before'),\n        !after && styles['PanelHeader--no-after'],\n        isFixed && styles['PanelHeader--fixed'],\n        sizeX !== 'compact' && sizeXClassNames[sizeX],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n      )}\n      getRootRef={isFixed ? getRootRef : getRef}\n    >\n      {isFixed ? (\n        <FixedLayout\n          className={classNames(styles['PanelHeader__fixed'], 'vkuiInternalPanelHeader__fixed')}\n          vertical=\"top\"\n          getRootRef={getRef}\n        >\n          <PanelHeaderIn before={before} after={after} typographyProps={typographyProps}>\n            {children}\n          </PanelHeaderIn>\n        </FixedLayout>\n      ) : (\n        <PanelHeaderIn before={before} after={after} typographyProps={typographyProps}>\n          {children}\n        </PanelHeaderIn>\n      )}\n      {!isVKCOM && (\n        <>\n          {staticSeparatorVisible && adaptiveSizeX.compact && (\n            <Separator className={adaptiveSizeX.compact.className} />\n          )}\n          {staticSpacingVisible && adaptiveSizeX.regular && (\n            <Spacing className={adaptiveSizeX.regular.className} size={16} />\n          )}\n        </>\n      )}\n      {separatorVisible && isVKCOM && (\n        <Separator className={styles['PanelHeader__separator']} wide />\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useAdaptivityConditionalRender","usePlatform","useConfigProvider","FixedLayout","ModalRootContext","OnboardingTooltipContainer","RootComponent","Separator","Spacing","Text","platformClassNames","ios","android","vkcom","sizeXClassNames","none","regular","sizeYClassNames","compact","PanelHeaderIn","before","after","children","typographyProps","Component","restProps","hasCustomPanelHeaderAfter","customPanelHeaderAfterMinWidth","isInsideModal","useContext","platform","afterSlotProps","style","minWidth","typographyNode","weight","className","fixed","div","PanelHeader","float","transparent","delimiter","shadow","getRef","getRootRef","sizeX","sizeY","adaptiveSizeX","isVKCOM","isFixed","undefined","separatorVisible","staticSeparatorVisible","staticSpacingVisible","baseClassName","hasOwnProperty","vertical","size","wide"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/PanelHeader/PanelHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasComponent, HasDataAttribute, HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FixedLayout } from '../FixedLayout/FixedLayout';\nimport { ModalRootContext } from '../ModalRoot/ModalRootContext';\nimport { OnboardingTooltipContainer } from '../OnboardingTooltip/OnboardingTooltipContainer';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Separator } from '../Separator/Separator';\nimport { Spacing } from '../Spacing/Spacing';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './PanelHeader.module.css';\n\nconst platformClassNames = {\n  ios: styles['PanelHeader--ios'],\n  android: styles['PanelHeader--android'],\n  vkcom: classNames(styles['PanelHeader--vkcom'], 'vkuiInternalPanelHeader--vkcom'),\n};\n\nconst sizeXClassNames = {\n  none: styles['PanelHeader--sizeX-none'],\n  regular: styles['PanelHeader--sizeX-regular'],\n};\n\nconst sizeYClassNames = {\n  none: styles['PanelHeader--sizeY-none'],\n  compact: styles['PanelHeader--sizeY-compact'],\n};\n\nexport interface PanelHeaderProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  before?: React.ReactNode;\n  /**\n   * Добавляет элемент справа.\n   *\n   * При передаче нескольких элементов, расставляет отступы между ними.\n   */\n  after?: React.ReactNode;\n  /**\n   * Тип разделителя под шапкой.\n   *\n   * - `\"none\"` означает, что разделитель не нужен\n   * - `\"separator\"` включает сепаратор при условии, что это:\n   *      - либо платформа `vkcom`\n   *      - либо платформа `android`/`ios` при `<AdaptivityProvider sizeX=\"compact\" />`\n   * - `\"spacing\"` включает отступ, если это платформа `android`/`ios` при `<AdaptivityProvider sizeX=\"regular\" />`\n   * - `\"auto\"` автоматически подбирает либо `\"separator\"`, либо `\"spacing\"` по их условиям\n   */\n  delimiter?: 'auto' | 'none' | 'separator' | 'spacing';\n  transparent?: boolean;\n  shadow?: boolean;\n  /**\n   * Высота шапки будет игнорироваться контентом панели\n   */\n  float?: boolean;\n  /**\n   * Если `false`, то шапка будет в потоке. По умолчанию `true`, но если платформа vkcom, то по умолчанию `false`.\n   */\n  fixed?: boolean;\n  /**\n   * По умолчанию как `Component` используется `span`.\n   */\n  typographyProps?: HasComponent & React.HTMLAttributes<HTMLElement> & HasDataAttribute;\n}\n\ninterface PanelHeaderInProps {\n  before?: PanelHeaderProps['before'];\n  after?: PanelHeaderProps['after'];\n  children?: PanelHeaderProps['children'];\n  typographyProps?: PanelHeaderProps['typographyProps'];\n}\n\nconst PanelHeaderIn = ({ before, after, children, typographyProps = {} }: PanelHeaderInProps) => {\n  const { Component = 'span', ...restProps } = typographyProps;\n  const { hasCustomPanelHeaderAfter, customPanelHeaderAfterMinWidth } = useConfigProvider();\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n\n  const afterSlotProps =\n    !hasCustomPanelHeaderAfter || isInsideModal\n      ? {\n          children: after,\n        }\n      : {\n          style: { minWidth: customPanelHeaderAfterMinWidth },\n        };\n  const typographyNode: React.ReactNode =\n    platform === 'vkcom' ? (\n      <Text weight=\"2\" Component={Component} {...restProps}>\n        {children}\n      </Text>\n    ) : (\n      <Component className={styles['PanelHeader__content-in']} {...restProps}>\n        {children}\n      </Component>\n    );\n\n  return (\n    <OnboardingTooltipContainer fixed className={styles['PanelHeader__in']}>\n      <div className={classNames(styles['PanelHeader__before'], 'vkuiInternalPanelHeader__before')}>\n        {before}\n      </div>\n      <div className={styles['PanelHeader__content']}>{typographyNode}</div>\n      <div\n        className={classNames(styles['PanelHeader__after'], 'vkuiInternalPanelHeader__after')}\n        {...afterSlotProps}\n      />\n    </OnboardingTooltipContainer>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeader\n */\nexport const PanelHeader = ({\n  before,\n  children,\n  after,\n  float = false,\n  transparent = false,\n  delimiter = 'auto',\n  shadow,\n  getRef,\n  getRootRef,\n  fixed,\n  typographyProps,\n  ...restProps\n}: PanelHeaderProps) => {\n  const platform = usePlatform();\n  const { sizeX = 'none', sizeY = 'none' } = useAdaptivity();\n  const { sizeX: adaptiveSizeX } = useAdaptivityConditionalRender();\n  const isVKCOM = platform === 'vkcom';\n  const isFixed = fixed !== undefined ? fixed : !isVKCOM;\n  const separatorVisible = delimiter === 'auto' || delimiter === 'separator';\n  const staticSeparatorVisible = !float && separatorVisible;\n  const staticSpacingVisible = !float && (delimiter === 'auto' || delimiter === 'spacing');\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['PanelHeader'],\n        'vkuiInternalPanelHeader',\n        platformClassNames.hasOwnProperty(platform)\n          ? platformClassNames[platform]\n          : platformClassNames.android,\n        transparent && styles['PanelHeader--trnsp'],\n        shadow && styles['PanelHeader--shadow'],\n        !float && classNames(styles['PanelHeader--static'], 'vkuiInternalPanelHeader--static'),\n        staticSeparatorVisible &&\n          classNames(styles['PanelHeader--sep'], 'vkuiInternalPanelHeader--sep'),\n        !before &&\n          classNames(styles['PanelHeader--no-before'], 'vkuiInternalPanelHeader--no-before'),\n        !after && styles['PanelHeader--no-after'],\n        isFixed && styles['PanelHeader--fixed'],\n        sizeX !== 'compact' && sizeXClassNames[sizeX],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n      )}\n      getRootRef={isFixed ? getRootRef : getRef}\n    >\n      {isFixed ? (\n        <FixedLayout\n          className={classNames(styles['PanelHeader__fixed'], 'vkuiInternalPanelHeader__fixed')}\n          vertical=\"top\"\n          getRootRef={getRef}\n        >\n          <PanelHeaderIn before={before} after={after} typographyProps={typographyProps}>\n            {children}\n          </PanelHeaderIn>\n        </FixedLayout>\n      ) : (\n        <PanelHeaderIn before={before} after={after} typographyProps={typographyProps}>\n          {children}\n        </PanelHeaderIn>\n      )}\n      {!isVKCOM && (\n        <>\n          {staticSeparatorVisible && adaptiveSizeX.compact && (\n            <Separator className={adaptiveSizeX.compact.className} />\n          )}\n          {staticSpacingVisible && adaptiveSizeX.regular && (\n            <Spacing className={adaptiveSizeX.regular.className} size={16} />\n          )}\n        </>\n      )}\n      {separatorVisible && isVKCOM && (\n        <Separator className={styles['PanelHeader__separator']} wide />\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useAdaptivityConditionalRender","usePlatform","useConfigProvider","FixedLayout","ModalRootContext","OnboardingTooltipContainer","RootComponent","Separator","Spacing","Text","platformClassNames","ios","android","vkcom","sizeXClassNames","none","regular","sizeYClassNames","compact","PanelHeaderIn","before","after","children","typographyProps","Component","restProps","hasCustomPanelHeaderAfter","customPanelHeaderAfterMinWidth","isInsideModal","useContext","platform","afterSlotProps","style","minWidth","typographyNode","weight","className","fixed","div","PanelHeader","float","transparent","delimiter","shadow","getRef","getRootRef","sizeX","sizeY","adaptiveSizeX","isVKCOM","isFixed","undefined","separatorVisible","staticSeparatorVisible","staticSpacingVisible","baseClassName","hasOwnProperty","vertical","size","wide"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';
 export interface PanelHeaderBackProps extends Omit<PanelHeaderButtonProps, 'children'> {
     children?: string;
@@ -6,5 +5,5 @@ export interface PanelHeaderBackProps extends Omit<PanelHeaderButtonProps, 'chil
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderButton
  */
-export declare const PanelHeaderBack: ({ label, className, children, ...restProps }: PanelHeaderButtonProps) => React.JSX.Element;
+export declare const PanelHeaderBack: ({ label, className, children, ...restProps }: PanelHeaderButtonProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=PanelHeaderBack.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderBack.d.ts","sourceRoot":"","sources":["../../../src/components/PanelHeaderBack/PanelHeaderBack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,EAAqB,sBAAsB,EAAE,MAAM,wCAAwC,CAAC;AAInG,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,sBAAsB,EAAE,UAAU,CAAC;IACpF,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAuBD;;GAEG;AACH,eAAO,MAAM,eAAe,iDAKzB,sBAAsB,sBAuBxB,CAAC"}
+{"version":3,"file":"PanelHeaderBack.d.ts","sourceRoot":"","sources":["../../../src/components/PanelHeaderBack/PanelHeaderBack.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAqB,sBAAsB,EAAE,MAAM,wCAAwC,CAAC;AAInG,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,sBAAsB,EAAE,UAAU,CAAC;IACpF,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAuBD;;GAEG;AACH,eAAO,MAAM,eAAe,iDAKzB,sBAAsB,4CAuBxB,CAAC"}

package/dist/components/PanelHeaderBack/PanelHeaderBack.js

@@ -1,8 +1,8 @@
 import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
 import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
 import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
-import * as React from 'react';
-import { Icon24ArrowLeftOutline, Icon24ChevronLeftOutline, Icon28ArrowLeftOutline, Icon28ChevronBack, Icon28ChevronLeftOutline } from '@vkontakte/icons';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon20ChevronLeftOutline, Icon24ArrowLeftOutline, Icon28ArrowLeftOutline, Icon28ChevronBack, Icon28ChevronLeftOutline } from '@vkontakte/icons';
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
 import { usePlatform } from '../../hooks/usePlatform';
@@ -12,14 +12,14 @@ import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';
 const getBackIcon = (platform)=>{
     switch(platform){
         case 'ios':
-            return /*#__PURE__*/ React.createElement(Icon28ChevronBack, null);
+            return /*#__PURE__*/ _jsx(Icon28ChevronBack, {});
         case 'vkcom':
-            return /*#__PURE__*/ React.createElement(AdaptiveIconRenderer, {
-                IconCompact: Icon24ChevronLeftOutline,
+            return /*#__PURE__*/ _jsx(AdaptiveIconRenderer, {
+                IconCompact: Icon20ChevronLeftOutline,
                 IconRegular: Icon28ChevronLeftOutline
             });
         default:
-            return /*#__PURE__*/ React.createElement(AdaptiveIconRenderer, {
+            return /*#__PURE__*/ _jsx(AdaptiveIconRenderer, {
                 IconCompact: Icon24ArrowLeftOutline,
                 IconRegular: Icon28ArrowLeftOutline
             });
@@ -38,10 +38,16 @@ const getBackIcon = (platform)=>{
     // также label нужно скрывать при platform === 'ios' && sizeX === regular
     // https://github.com/VKCOM/VKUI/blob/master/src/components/PanelHeaderButton/PanelHeaderButton.css#L104
     const showLabel = platform === 'vkcom' || platform === 'ios';
-    return /*#__PURE__*/ React.createElement(PanelHeaderButton, _object_spread_props(_object_spread({}, restProps), {
+    return /*#__PURE__*/ _jsxs(PanelHeaderButton, _object_spread_props(_object_spread({}, restProps), {
         className: classNames(sizeX === 'compact' && "vkuiPanelHeaderBack--sizeX-compact", platform === 'ios' && "vkuiPanelHeaderBack--ios", platform === 'vkcom' && "vkuiPanelHeaderBack--vkcom", showLabel && !!label && "vkuiPanelHeaderBack--has-label", className),
-        label: showLabel && label
-    }), children && /*#__PURE__*/ React.createElement(VisuallyHidden, null, children), getBackIcon(platform));
+        label: showLabel && label,
+        children: [
+            children && /*#__PURE__*/ _jsx(VisuallyHidden, {
+                children: children
+            }),
+            getBackIcon(platform)
+        ]
+    }));
 };
 
 //# sourceMappingURL=PanelHeaderBack.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PanelHeaderBack/PanelHeaderBack.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon24ArrowLeftOutline,\n  Icon24ChevronLeftOutline,\n  Icon28ArrowLeftOutline,\n  Icon28ChevronBack,\n  Icon28ChevronLeftOutline,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { PlatformType } from '../../lib/platform';\nimport { AdaptiveIconRenderer } from '../AdaptiveIconRenderer/AdaptiveIconRenderer';\nimport { PanelHeaderButton, PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from '../PanelHeaderButton/PanelHeaderButton.module.css';\n\nexport interface PanelHeaderBackProps extends Omit<PanelHeaderButtonProps, 'children'> {\n  children?: string;\n}\n\nconst getBackIcon = (platform: PlatformType) => {\n  switch (platform) {\n    case 'ios':\n      return <Icon28ChevronBack />;\n    case 'vkcom':\n      return (\n        <AdaptiveIconRenderer\n          IconCompact={Icon24ChevronLeftOutline}\n          IconRegular={Icon28ChevronLeftOutline}\n        />\n      );\n    default:\n      return (\n        <AdaptiveIconRenderer\n          IconCompact={Icon24ArrowLeftOutline}\n          IconRegular={Icon28ArrowLeftOutline}\n        />\n      );\n  }\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderButton\n */\nexport const PanelHeaderBack = ({\n  label,\n  className,\n  children = 'Назад',\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n  const { sizeX = 'none' } = useAdaptivity();\n  // также label нужно скрывать при platform === 'ios' && sizeX === regular\n  // https://github.com/VKCOM/VKUI/blob/master/src/components/PanelHeaderButton/PanelHeaderButton.css#L104\n  const showLabel = platform === 'vkcom' || platform === 'ios';\n\n  return (\n    <PanelHeaderButton\n      {...restProps}\n      className={classNames(\n        sizeX === 'compact' && styles['PanelHeaderBack--sizeX-compact'],\n        platform === 'ios' && styles['PanelHeaderBack--ios'],\n        platform === 'vkcom' && styles['PanelHeaderBack--vkcom'],\n        showLabel && !!label && styles['PanelHeaderBack--has-label'],\n        className,\n      )}\n      label={showLabel && label}\n    >\n      {children && <VisuallyHidden>{children}</VisuallyHidden>}\n      {getBackIcon(platform)}\n    </PanelHeaderButton>\n  );\n};\n"],"names":["React","Icon24ArrowLeftOutline","Icon24ChevronLeftOutline","Icon28ArrowLeftOutline","Icon28ChevronBack","Icon28ChevronLeftOutline","classNames","useAdaptivity","usePlatform","AdaptiveIconRenderer","PanelHeaderButton","VisuallyHidden","getBackIcon","platform","IconCompact","IconRegular","PanelHeaderBack","label","className","children","restProps","sizeX","showLabel"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,sBAAsB,EACtBC,wBAAwB,EACxBC,sBAAsB,EACtBC,iBAAiB,EACjBC,wBAAwB,QACnB,mBAAmB;AAC1B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,oBAAoB,QAAQ,+CAA+C;AACpF,SAASC,iBAAiB,QAAgC,yCAAyC;AACnG,SAASC,cAAc,QAAQ,mCAAmC;AAOlE,MAAMC,cAAc,CAACC;IACnB,OAAQA;QACN,KAAK;YACH,qBAAO,oBAACT;QACV,KAAK;YACH,qBACE,oBAACK;gBACCK,aAAaZ;gBACba,aAAaV;;QAGnB;YACE,qBACE,oBAACI;gBACCK,aAAab;gBACbc,aAAaZ;;IAGrB;AACF;AAEA;;CAEC,GACD,OAAO,MAAMa,kBAAkB;QAAC,EAC9BC,KAAK,EACLC,SAAS,EACTC,WAAW,OAAO,EAEK,WADpBC;QAHHH;QACAC;QACAC;;IAGA,MAAMN,WAAWL;IACjB,MAAM,EAAEa,QAAQ,MAAM,EAAE,GAAGd;IAC3B,yEAAyE;IACzE,wGAAwG;IACxG,MAAMe,YAAYT,aAAa,WAAWA,aAAa;IAEvD,qBACE,oBAACH,2DACKU;QACJF,WAAWZ,WACTe,UAAU,mDACVR,aAAa,qCACbA,aAAa,yCACbS,aAAa,CAAC,CAACL,2CACfC;QAEFD,OAAOK,aAAaL;QAEnBE,0BAAY,oBAACR,sBAAgBQ,WAC7BP,YAAYC;AAGnB,EAAE"}
+{"version":3,"sources":["../../../src/components/PanelHeaderBack/PanelHeaderBack.tsx"],"sourcesContent":["import {\n  Icon20ChevronLeftOutline,\n  Icon24ArrowLeftOutline,\n  Icon28ArrowLeftOutline,\n  Icon28ChevronBack,\n  Icon28ChevronLeftOutline,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { PlatformType } from '../../lib/platform';\nimport { AdaptiveIconRenderer } from '../AdaptiveIconRenderer/AdaptiveIconRenderer';\nimport { PanelHeaderButton, PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from '../PanelHeaderButton/PanelHeaderButton.module.css';\n\nexport interface PanelHeaderBackProps extends Omit<PanelHeaderButtonProps, 'children'> {\n  children?: string;\n}\n\nconst getBackIcon = (platform: PlatformType) => {\n  switch (platform) {\n    case 'ios':\n      return <Icon28ChevronBack />;\n    case 'vkcom':\n      return (\n        <AdaptiveIconRenderer\n          IconCompact={Icon20ChevronLeftOutline}\n          IconRegular={Icon28ChevronLeftOutline}\n        />\n      );\n    default:\n      return (\n        <AdaptiveIconRenderer\n          IconCompact={Icon24ArrowLeftOutline}\n          IconRegular={Icon28ArrowLeftOutline}\n        />\n      );\n  }\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderButton\n */\nexport const PanelHeaderBack = ({\n  label,\n  className,\n  children = 'Назад',\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n  const { sizeX = 'none' } = useAdaptivity();\n  // также label нужно скрывать при platform === 'ios' && sizeX === regular\n  // https://github.com/VKCOM/VKUI/blob/master/src/components/PanelHeaderButton/PanelHeaderButton.css#L104\n  const showLabel = platform === 'vkcom' || platform === 'ios';\n\n  return (\n    <PanelHeaderButton\n      {...restProps}\n      className={classNames(\n        sizeX === 'compact' && styles['PanelHeaderBack--sizeX-compact'],\n        platform === 'ios' && styles['PanelHeaderBack--ios'],\n        platform === 'vkcom' && styles['PanelHeaderBack--vkcom'],\n        showLabel && !!label && styles['PanelHeaderBack--has-label'],\n        className,\n      )}\n      label={showLabel && label}\n    >\n      {children && <VisuallyHidden>{children}</VisuallyHidden>}\n      {getBackIcon(platform)}\n    </PanelHeaderButton>\n  );\n};\n"],"names":["Icon20ChevronLeftOutline","Icon24ArrowLeftOutline","Icon28ArrowLeftOutline","Icon28ChevronBack","Icon28ChevronLeftOutline","classNames","useAdaptivity","usePlatform","AdaptiveIconRenderer","PanelHeaderButton","VisuallyHidden","getBackIcon","platform","IconCompact","IconRegular","PanelHeaderBack","label","className","children","restProps","sizeX","showLabel"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;AAAA,SACEA,wBAAwB,EACxBC,sBAAsB,EACtBC,sBAAsB,EACtBC,iBAAiB,EACjBC,wBAAwB,QACnB,mBAAmB;AAC1B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,oBAAoB,QAAQ,+CAA+C;AACpF,SAASC,iBAAiB,QAAgC,yCAAyC;AACnG,SAASC,cAAc,QAAQ,mCAAmC;AAOlE,MAAMC,cAAc,CAACC;IACnB,OAAQA;QACN,KAAK;YACH,qBAAO,KAACT;QACV,KAAK;YACH,qBACE,KAACK;gBACCK,aAAab;gBACbc,aAAaV;;QAGnB;YACE,qBACE,KAACI;gBACCK,aAAaZ;gBACba,aAAaZ;;IAGrB;AACF;AAEA;;CAEC,GACD,OAAO,MAAMa,kBAAkB;QAAC,EAC9BC,KAAK,EACLC,SAAS,EACTC,WAAW,OAAO,EAEK,WADpBC;QAHHH;QACAC;QACAC;;IAGA,MAAMN,WAAWL;IACjB,MAAM,EAAEa,QAAQ,MAAM,EAAE,GAAGd;IAC3B,yEAAyE;IACzE,wGAAwG;IACxG,MAAMe,YAAYT,aAAa,WAAWA,aAAa;IAEvD,qBACE,MAACH,2DACKU;QACJF,WAAWZ,WACTe,UAAU,mDACVR,aAAa,qCACbA,aAAa,yCACbS,aAAa,CAAC,CAACL,2CACfC;QAEFD,OAAOK,aAAaL;;YAEnBE,0BAAY,KAACR;0BAAgBQ;;YAC7BP,YAAYC;;;AAGnB,EAAE"}

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

@@ -7,5 +7,5 @@ export interface PanelHeaderButtonProps extends Omit<TappableProps, 'label'> {
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderButton
  */
-export declare const PanelHeaderButton: ({ children, primary, label, className, ...restProps }: PanelHeaderButtonProps) => React.JSX.Element;
+export declare const PanelHeaderButton: ({ children, primary, label, className, ...restProps }: PanelHeaderButtonProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=PanelHeaderButton.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderButton.d.ts","sourceRoot":"","sources":["../../../src/components/PanelHeaderButton/PanelHeaderButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAY,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAW/D,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,aAAa,EAAE,OAAO,CAAC;IAC1E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB;AAsBD;;GAEG;AACH,eAAO,MAAM,iBAAiB,0DAM3B,sBAAsB,sBA8DxB,CAAC"}
+{"version":3,"file":"PanelHeaderButton.d.ts","sourceRoot":"","sources":["../../../src/components/PanelHeaderButton/PanelHeaderButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAY,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAW/D,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,aAAa,EAAE,OAAO,CAAC;IAC1E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB;AAsBD;;GAEG;AACH,eAAO,MAAM,iBAAiB,0DAM3B,sBAAsB,4CA8DxB,CAAC"}