@vkontakte/vkui 5.2.2 → 5.2.4

package/dist/cssm/components/AdaptivityProvider/AdaptivityProvider.js

@@ -1,4 +1,3 @@
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import * as React from 'react';
 import { hasMouse as _hasPointer } from '@vkontakte/vkjs';
 import { useBridgeAdaptivity } from '../../hooks/useBridgeAdaptivity';
@@ -16,26 +15,15 @@ export var AdaptivityProvider = function AdaptivityProvider(_ref) {
     hasHover = _ref.hasHover,
     children = _ref.children;
   var bridge = useBridgeAdaptivity();
-  var _React$useState = React.useState({
+  var adaptivity = React.useMemo(function () {
+    return calculateAdaptivity({
       viewWidth: viewWidth,
       viewHeight: viewHeight,
       sizeX: sizeX,
       sizeY: sizeY,
       hasPointer: hasPointer,
       hasHover: hasHover
-    }),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    adaptivity = _React$useState2[0],
-    setAdaptivity = _React$useState2[1];
-  React.useEffect(function () {
-    setAdaptivity(calculateAdaptivity({
-      viewWidth: viewWidth,
-      viewHeight: viewHeight,
-      sizeX: sizeX,
-      sizeY: sizeY,
-      hasPointer: hasPointer,
-      hasHover: hasHover
-    }, bridge));
+    }, bridge);
   }, [viewWidth, viewHeight, sizeX, sizeY, hasPointer, hasHover, bridge]);
   return /*#__PURE__*/React.createElement(AdaptivityContext.Provider, {
     value: adaptivity

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

@@ -1 +1 @@
-{"version":3,"file":"AdaptivityProvider.js","names":["React","hasMouse","_hasPointer","useBridgeAdaptivity","BREAKPOINTS","SizeType","ViewHeight","ViewWidth","AdaptivityContext","AdaptivityProvider","viewWidth","viewHeight","sizeX","sizeY","hasPointer","hasHover","children","bridge","useState","adaptivity","setAdaptivity","useEffect","calculateAdaptivity","type","viewportWidth","viewportHeight","DESKTOP","TABLET","SMALL_TABLET","MOBILE","SMALL_MOBILE","MEDIUM_HEIGHT","MEDIUM","MOBILE_LANDSCAPE_HEIGHT","SMALL","EXTRA_SMALL","COMPACT","REGULAR","undefined"],"sources":["../../../../src/components/AdaptivityProvider/AdaptivityProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { hasMouse as _hasPointer } from '@vkontakte/vkjs';\nimport { BridgeAdaptivity, useBridgeAdaptivity } from '../../hooks/useBridgeAdaptivity';\nimport { BREAKPOINTS, SizeType, ViewHeight, ViewWidth } from '../../lib/adaptivity';\nimport { AdaptivityContext, type AdaptivityProps } from './AdaptivityContext';\n\nexport interface AdaptivityProviderProps extends AdaptivityProps {\n  children?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/AdaptivityProvider\n */\nexport const AdaptivityProvider = ({\n  viewWidth,\n  viewHeight,\n  sizeX,\n  sizeY,\n  hasPointer,\n  hasHover,\n  children,\n}: React.PropsWithChildren<AdaptivityProps>) => {\n  const bridge = useBridgeAdaptivity();\n  const [adaptivity, setAdaptivity] = React.useState({\n    viewWidth,\n    viewHeight,\n    sizeX,\n    sizeY,\n    hasPointer,\n    hasHover,\n  });\n\n  React.useEffect(() => {\n    setAdaptivity(\n      calculateAdaptivity(\n        {\n          viewWidth,\n          viewHeight,\n          sizeX,\n          sizeY,\n          hasPointer,\n          hasHover,\n        },\n        bridge,\n      ),\n    );\n  }, [viewWidth, viewHeight, sizeX, sizeY, hasPointer, hasHover, bridge]);\n\n  return <AdaptivityContext.Provider value={adaptivity}>{children}</AdaptivityContext.Provider>;\n};\n\nfunction calculateAdaptivity(\n  { viewWidth, viewHeight, sizeX, sizeY, hasPointer, hasHover }: AdaptivityProps,\n  bridge: BridgeAdaptivity,\n) {\n  if (bridge.type === 'adaptive') {\n    const { viewportWidth, viewportHeight } = bridge;\n\n    if (viewportWidth >= BREAKPOINTS.DESKTOP) {\n      viewWidth = ViewWidth.DESKTOP;\n    } else if (viewportWidth >= BREAKPOINTS.TABLET) {\n      viewWidth = ViewWidth.TABLET;\n    } else if (viewportWidth >= BREAKPOINTS.SMALL_TABLET) {\n      viewWidth = ViewWidth.SMALL_TABLET;\n    } else if (viewportWidth >= BREAKPOINTS.MOBILE) {\n      viewWidth = ViewWidth.MOBILE;\n    } else {\n      viewWidth = ViewWidth.SMALL_MOBILE;\n    }\n\n    if (viewportHeight >= BREAKPOINTS.MEDIUM_HEIGHT) {\n      viewHeight = ViewHeight.MEDIUM;\n    } else if (viewportHeight >= BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT) {\n      viewHeight = ViewHeight.SMALL;\n    } else {\n      viewHeight = ViewHeight.EXTRA_SMALL;\n    }\n\n    if (viewWidth <= ViewWidth.MOBILE) {\n      sizeX = SizeType.COMPACT;\n    } else {\n      sizeX = SizeType.REGULAR;\n    }\n\n    if (\n      (viewWidth >= ViewWidth.SMALL_TABLET && _hasPointer) ||\n      viewHeight <= ViewHeight.EXTRA_SMALL\n    ) {\n      sizeY = SizeType.COMPACT;\n    } else {\n      sizeY = SizeType.REGULAR;\n    }\n  } else if (bridge.type === 'force_mobile' || bridge.type === 'force_mobile_compact') {\n    viewWidth = ViewWidth.MOBILE;\n    sizeX = SizeType.COMPACT;\n\n    if (bridge.type === 'force_mobile_compact') {\n      sizeY = SizeType.COMPACT;\n    } else {\n      sizeY = SizeType.REGULAR;\n    }\n  } else {\n    if (sizeX === undefined && viewWidth !== undefined) {\n      if (viewWidth <= ViewWidth.MOBILE) {\n        sizeX = SizeType.COMPACT;\n      } else {\n        sizeX = SizeType.REGULAR;\n      }\n    }\n    if (sizeY === undefined && viewWidth !== undefined && viewHeight !== undefined) {\n      if (\n        (viewWidth >= ViewWidth.SMALL_TABLET && _hasPointer) ||\n        viewHeight <= ViewHeight.EXTRA_SMALL\n      ) {\n        sizeY = SizeType.COMPACT;\n      } else {\n        sizeY = SizeType.REGULAR;\n      }\n    }\n  }\n\n  return {\n    viewWidth,\n    viewHeight,\n    sizeX,\n    sizeY,\n    hasPointer,\n    hasHover,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"AdaptivityProvider.js","names":["React","hasMouse","_hasPointer","useBridgeAdaptivity","BREAKPOINTS","SizeType","ViewHeight","ViewWidth","AdaptivityContext","AdaptivityProvider","viewWidth","viewHeight","sizeX","sizeY","hasPointer","hasHover","children","bridge","adaptivity","useMemo","calculateAdaptivity","type","viewportWidth","viewportHeight","DESKTOP","TABLET","SMALL_TABLET","MOBILE","SMALL_MOBILE","MEDIUM_HEIGHT","MEDIUM","MOBILE_LANDSCAPE_HEIGHT","SMALL","EXTRA_SMALL","COMPACT","REGULAR","undefined"],"sources":["../../../../src/components/AdaptivityProvider/AdaptivityProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { hasMouse as _hasPointer } from '@vkontakte/vkjs';\nimport { BridgeAdaptivity, useBridgeAdaptivity } from '../../hooks/useBridgeAdaptivity';\nimport { BREAKPOINTS, SizeType, ViewHeight, ViewWidth } from '../../lib/adaptivity';\nimport { AdaptivityContext, type AdaptivityProps } from './AdaptivityContext';\n\nexport interface AdaptivityProviderProps extends AdaptivityProps {\n  children?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/AdaptivityProvider\n */\nexport const AdaptivityProvider = ({\n  viewWidth,\n  viewHeight,\n  sizeX,\n  sizeY,\n  hasPointer,\n  hasHover,\n  children,\n}: React.PropsWithChildren<AdaptivityProps>) => {\n  const bridge = useBridgeAdaptivity();\n  const adaptivity = React.useMemo(\n    () =>\n      calculateAdaptivity(\n        {\n          viewWidth,\n          viewHeight,\n          sizeX,\n          sizeY,\n          hasPointer,\n          hasHover,\n        },\n        bridge,\n      ),\n    [viewWidth, viewHeight, sizeX, sizeY, hasPointer, hasHover, bridge],\n  );\n\n  return <AdaptivityContext.Provider value={adaptivity}>{children}</AdaptivityContext.Provider>;\n};\n\nfunction calculateAdaptivity(\n  { viewWidth, viewHeight, sizeX, sizeY, hasPointer, hasHover }: AdaptivityProps,\n  bridge: BridgeAdaptivity,\n) {\n  if (bridge.type === 'adaptive') {\n    const { viewportWidth, viewportHeight } = bridge;\n\n    if (viewportWidth >= BREAKPOINTS.DESKTOP) {\n      viewWidth = ViewWidth.DESKTOP;\n    } else if (viewportWidth >= BREAKPOINTS.TABLET) {\n      viewWidth = ViewWidth.TABLET;\n    } else if (viewportWidth >= BREAKPOINTS.SMALL_TABLET) {\n      viewWidth = ViewWidth.SMALL_TABLET;\n    } else if (viewportWidth >= BREAKPOINTS.MOBILE) {\n      viewWidth = ViewWidth.MOBILE;\n    } else {\n      viewWidth = ViewWidth.SMALL_MOBILE;\n    }\n\n    if (viewportHeight >= BREAKPOINTS.MEDIUM_HEIGHT) {\n      viewHeight = ViewHeight.MEDIUM;\n    } else if (viewportHeight >= BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT) {\n      viewHeight = ViewHeight.SMALL;\n    } else {\n      viewHeight = ViewHeight.EXTRA_SMALL;\n    }\n\n    if (viewWidth <= ViewWidth.MOBILE) {\n      sizeX = SizeType.COMPACT;\n    } else {\n      sizeX = SizeType.REGULAR;\n    }\n\n    if (\n      (viewWidth >= ViewWidth.SMALL_TABLET && _hasPointer) ||\n      viewHeight <= ViewHeight.EXTRA_SMALL\n    ) {\n      sizeY = SizeType.COMPACT;\n    } else {\n      sizeY = SizeType.REGULAR;\n    }\n  } else if (bridge.type === 'force_mobile' || bridge.type === 'force_mobile_compact') {\n    viewWidth = ViewWidth.MOBILE;\n    sizeX = SizeType.COMPACT;\n\n    if (bridge.type === 'force_mobile_compact') {\n      sizeY = SizeType.COMPACT;\n    } else {\n      sizeY = SizeType.REGULAR;\n    }\n  } else {\n    if (sizeX === undefined && viewWidth !== undefined) {\n      if (viewWidth <= ViewWidth.MOBILE) {\n        sizeX = SizeType.COMPACT;\n      } else {\n        sizeX = SizeType.REGULAR;\n      }\n    }\n    if (sizeY === undefined && viewWidth !== undefined && viewHeight !== undefined) {\n      if (\n        (viewWidth >= ViewWidth.SMALL_TABLET && _hasPointer) ||\n        viewHeight <= ViewHeight.EXTRA_SMALL\n      ) {\n        sizeY = SizeType.COMPACT;\n      } else {\n        sizeY = SizeType.REGULAR;\n      }\n    }\n  }\n\n  return {\n    viewWidth,\n    viewHeight,\n    sizeX,\n    sizeY,\n    hasPointer,\n    hasHover,\n  };\n}\n"],"mappings":"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"}

package/dist/cssm/components/Cell/CellCheckbox/CellCheckbox.js

@@ -4,7 +4,6 @@ var _excluded = ["className", "style"];
 import * as React from 'react';
 import { Icon24CheckBoxOff, Icon24CheckBoxOn, Icon24CheckCircleOff, Icon24CheckCircleOn } from '@vkontakte/icons';
 import { classNames } from '@vkontakte/vkjs';
-import { getPlatformClassName } from '../../../helpers/getPlatformClassName';
 import { usePlatform } from '../../../hooks/usePlatform';
 import { Platform } from '../../../lib/platform';
 import { VisuallyHiddenInput } from '../../VisuallyHiddenInput/VisuallyHiddenInput';
@@ -17,7 +16,7 @@ export var CellCheckbox = function CellCheckbox(_ref) {
   var IconOff = platform === Platform.IOS || platform === Platform.VKCOM ? Icon24CheckCircleOff : Icon24CheckBoxOff;
   var IconOn = platform === Platform.IOS || platform === Platform.VKCOM ? Icon24CheckCircleOn : Icon24CheckBoxOn;
   return /*#__PURE__*/React.createElement("span", {
-    className: classNames("vkuiCellCheckbox", getPlatformClassName("vkuiCellCheckbox", platform), className),
+    className: classNames("vkuiCellCheckbox", className),
     style: style
   }, /*#__PURE__*/React.createElement(VisuallyHiddenInput, _extends({
     className: "vkuiCellCheckbox__input",

package/dist/cssm/components/Cell/CellCheckbox/CellCheckbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"CellCheckbox.js","names":["React","Icon24CheckBoxOff","Icon24CheckBoxOn","Icon24CheckCircleOff","Icon24CheckCircleOn","classNames","getPlatformClassName","usePlatform","Platform","VisuallyHiddenInput","CellCheckbox","className","style","restProps","platform","IconOff","IOS","VKCOM","IconOn"],"sources":["../../../../../src/components/Cell/CellCheckbox/CellCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon24CheckBoxOff,\n  Icon24CheckBoxOn,\n  Icon24CheckCircleOff,\n  Icon24CheckCircleOn,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getPlatformClassName } from '../../../helpers/getPlatformClassName';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { Platform } from '../../../lib/platform';\nimport { VisuallyHiddenInput } from '../../VisuallyHiddenInput/VisuallyHiddenInput';\nimport { CellProps } from '../Cell';\nimport styles from './CellCheckbox.module.css';\n\nexport type CellCheckboxProps = Pick<CellProps, 'defaultChecked' | 'checked'> &\n  React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const CellCheckbox = ({ className, style, ...restProps }: CellCheckboxProps) => {\n  const platform = usePlatform();\n\n  const IconOff =\n    platform === Platform.IOS || platform === Platform.VKCOM\n      ? Icon24CheckCircleOff\n      : Icon24CheckBoxOff;\n\n  const IconOn =\n    platform === Platform.IOS || platform === Platform.VKCOM\n      ? Icon24CheckCircleOn\n      : Icon24CheckBoxOn;\n\n  return (\n    <span\n      className={classNames(\n        styles['CellCheckbox'],\n        getPlatformClassName(styles['CellCheckbox'], platform),\n        className,\n      )}\n      style={style}\n    >\n      <VisuallyHiddenInput\n        className={styles['CellCheckbox__input']}\n        type=\"checkbox\"\n        {...restProps}\n      />\n      <span\n        className={classNames(styles['CellCheckbox__icon'], styles['CellCheckbox__icon--off'])}\n        aria-hidden\n      >\n        <IconOff />\n      </span>\n      <span\n        className={classNames(styles['CellCheckbox__icon'], styles['CellCheckbox__icon--on'])}\n        aria-hidden\n      >\n        <IconOn />\n      </span>\n    </span>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SACEC,iBAAiB,EACjBC,gBAAgB,EAChBC,oBAAoB,EACpBC,mBAAmB,QACd,kBAAkB;AACzB,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,oBAAoB,QAAQ,uCAAuC;AAC5E,SAASC,WAAW,QAAQ,4BAA4B;AACxD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,mBAAmB,QAAQ,+CAA+C;AAAC;AAOpF,OAAO,IAAMC,YAAY,GAAG,SAAfA,YAAY,OAA8D;EAAA,IAAxDC,SAAS,QAATA,SAAS;IAAEC,KAAK,QAALA,KAAK;IAAKC,SAAS;EAC3D,IAAMC,QAAQ,GAAGP,WAAW,EAAE;EAE9B,IAAMQ,OAAO,GACXD,QAAQ,KAAKN,QAAQ,CAACQ,GAAG,IAAIF,QAAQ,KAAKN,QAAQ,CAACS,KAAK,GACpDd,oBAAoB,GACpBF,iBAAiB;EAEvB,IAAMiB,MAAM,GACVJ,QAAQ,KAAKN,QAAQ,CAACQ,GAAG,IAAIF,QAAQ,KAAKN,QAAQ,CAACS,KAAK,GACpDb,mBAAmB,GACnBF,gBAAgB;EAEtB,oBACE;IACE,SAAS,EAAEG,UAAU,qBAEnBC,oBAAoB,qBAAyBQ,QAAQ,CAAC,EACtDH,SAAS,CACT;IACF,KAAK,EAAEC;EAAM,gBAEb,oBAAC,mBAAmB;IAClB,SAAS,2BAAgC;IACzC,IAAI,EAAC;EAAU,GACXC,SAAS,EACb,eACF;IACE,SAAS,EAAER,UAAU,yDAAkE;IACvF;EAAW,gBAEX,oBAAC,OAAO,OAAG,CACN,eACP;IACE,SAAS,EAAEA,UAAU,wDAAiE;IACtF;EAAW,gBAEX,oBAAC,MAAM,OAAG,CACL,CACF;AAEX,CAAC"}
+{"version":3,"file":"CellCheckbox.js","names":["React","Icon24CheckBoxOff","Icon24CheckBoxOn","Icon24CheckCircleOff","Icon24CheckCircleOn","classNames","usePlatform","Platform","VisuallyHiddenInput","CellCheckbox","className","style","restProps","platform","IconOff","IOS","VKCOM","IconOn"],"sources":["../../../../../src/components/Cell/CellCheckbox/CellCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon24CheckBoxOff,\n  Icon24CheckBoxOn,\n  Icon24CheckCircleOff,\n  Icon24CheckCircleOn,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { Platform } from '../../../lib/platform';\nimport { VisuallyHiddenInput } from '../../VisuallyHiddenInput/VisuallyHiddenInput';\nimport { CellProps } from '../Cell';\nimport styles from './CellCheckbox.module.css';\n\nexport type CellCheckboxProps = Pick<CellProps, 'defaultChecked' | 'checked'> &\n  React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const CellCheckbox = ({ className, style, ...restProps }: CellCheckboxProps) => {\n  const platform = usePlatform();\n\n  const IconOff =\n    platform === Platform.IOS || platform === Platform.VKCOM\n      ? Icon24CheckCircleOff\n      : Icon24CheckBoxOff;\n\n  const IconOn =\n    platform === Platform.IOS || platform === Platform.VKCOM\n      ? Icon24CheckCircleOn\n      : Icon24CheckBoxOn;\n\n  return (\n    <span className={classNames(styles['CellCheckbox'], className)} style={style}>\n      <VisuallyHiddenInput\n        className={styles['CellCheckbox__input']}\n        type=\"checkbox\"\n        {...restProps}\n      />\n      <span\n        className={classNames(styles['CellCheckbox__icon'], styles['CellCheckbox__icon--off'])}\n        aria-hidden\n      >\n        <IconOff />\n      </span>\n      <span\n        className={classNames(styles['CellCheckbox__icon'], styles['CellCheckbox__icon--on'])}\n        aria-hidden\n      >\n        <IconOn />\n      </span>\n    </span>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SACEC,iBAAiB,EACjBC,gBAAgB,EAChBC,oBAAoB,EACpBC,mBAAmB,QACd,kBAAkB;AACzB,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,WAAW,QAAQ,4BAA4B;AACxD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,mBAAmB,QAAQ,+CAA+C;AAAC;AAOpF,OAAO,IAAMC,YAAY,GAAG,SAAfA,YAAY,OAA8D;EAAA,IAAxDC,SAAS,QAATA,SAAS;IAAEC,KAAK,QAALA,KAAK;IAAKC,SAAS;EAC3D,IAAMC,QAAQ,GAAGP,WAAW,EAAE;EAE9B,IAAMQ,OAAO,GACXD,QAAQ,KAAKN,QAAQ,CAACQ,GAAG,IAAIF,QAAQ,KAAKN,QAAQ,CAACS,KAAK,GACpDb,oBAAoB,GACpBF,iBAAiB;EAEvB,IAAMgB,MAAM,GACVJ,QAAQ,KAAKN,QAAQ,CAACQ,GAAG,IAAIF,QAAQ,KAAKN,QAAQ,CAACS,KAAK,GACpDZ,mBAAmB,GACnBF,gBAAgB;EAEtB,oBACE;IAAM,SAAS,EAAEG,UAAU,qBAAyBK,SAAS,CAAE;IAAC,KAAK,EAAEC;EAAM,gBAC3E,oBAAC,mBAAmB;IAClB,SAAS,2BAAgC;IACzC,IAAI,EAAC;EAAU,GACXC,SAAS,EACb,eACF;IACE,SAAS,EAAEP,UAAU,yDAAkE;IACvF;EAAW,gBAEX,oBAAC,OAAO,OAAG,CACN,eACP;IACE,SAAS,EAAEA,UAAU,wDAAiE;IACtF;EAAW,gBAEX,oBAAC,MAAM,OAAG,CACL,CACF;AAEX,CAAC"}

package/dist/cssm/components/Cell/CellDragger/CellDragger.js

@@ -4,7 +4,6 @@ var _excluded = ["onDragStart", "onDragMove", "onDragEnd", "className"];
 import * as React from 'react';
 import { Icon24Reorder, Icon24ReorderIos } from '@vkontakte/icons';
 import { classNames } from '@vkontakte/vkjs';
-import { getPlatformClassName } from '../../../helpers/getPlatformClassName';
 import { usePlatform } from '../../../hooks/usePlatform';
 import { Platform } from '../../../lib/platform';
 import { Touch } from '../../Touch/Touch';
@@ -20,7 +19,7 @@ export var CellDragger = function CellDragger(_ref) {
     e.preventDefault();
   }, []);
   return /*#__PURE__*/React.createElement(Touch, _extends({
-    className: classNames("vkuiCellDragger", getPlatformClassName("vkuiCellDragger", platform), className),
+    className: classNames("vkuiCellDragger", className),
     onStart: onDragStart,
     onMoveY: onDragMove,
     onEnd: onDragEnd,

package/dist/cssm/components/Cell/CellDragger/CellDragger.js.map

@@ -1 +1 @@
-{"version":3,"file":"CellDragger.js","names":["React","Icon24Reorder","Icon24ReorderIos","classNames","getPlatformClassName","usePlatform","Platform","Touch","CellDragger","onDragStart","onDragMove","onDragEnd","className","restProps","platform","onClick","useCallback","e","preventDefault","IOS"],"sources":["../../../../../src/components/Cell/CellDragger/CellDragger.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Reorder, Icon24ReorderIos } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getPlatformClassName } from '../../../helpers/getPlatformClassName';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { Platform } from '../../../lib/platform';\nimport { Touch } from '../../Touch/Touch';\nimport { DraggableProps } from '../useDraggable';\nimport styles from './CellDragger.module.css';\n\ntype CellDraggerProps = DraggableProps & React.HTMLAttributes<HTMLElement>;\n\nexport const CellDragger = ({\n  onDragStart,\n  onDragMove,\n  onDragEnd,\n  className,\n  ...restProps\n}: CellDraggerProps) => {\n  const platform = usePlatform();\n\n  const onClick = React.useCallback((e: React.MouseEvent) => {\n    e.preventDefault();\n  }, []);\n\n  return (\n    <Touch\n      className={classNames(\n        styles['CellDragger'],\n        getPlatformClassName(styles['CellDragger'], platform),\n        className,\n      )}\n      onStart={onDragStart}\n      onMoveY={onDragMove}\n      onEnd={onDragEnd}\n      onClick={onClick}\n      {...restProps}\n    >\n      {platform === Platform.IOS ? <Icon24ReorderIos /> : <Icon24Reorder />}\n    </Touch>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,aAAa,EAAEC,gBAAgB,QAAQ,kBAAkB;AAClE,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,oBAAoB,QAAQ,uCAAuC;AAC5E,SAASC,WAAW,QAAQ,4BAA4B;AACxD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,KAAK,QAAQ,mBAAmB;AAAC;AAM1C,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAMA;EAAA,IALtBC,WAAW,QAAXA,WAAW;IACXC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACTC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAGT,WAAW,EAAE;EAE9B,IAAMU,OAAO,GAAGf,KAAK,CAACgB,WAAW,CAAC,UAACC,CAAmB,EAAK;IACzDA,CAAC,CAACC,cAAc,EAAE;EACpB,CAAC,EAAE,EAAE,CAAC;EAEN,oBACE,oBAAC,KAAK;IACJ,SAAS,EAAEf,UAAU,oBAEnBC,oBAAoB,oBAAwBU,QAAQ,CAAC,EACrDF,SAAS,CACT;IACF,OAAO,EAAEH,WAAY;IACrB,OAAO,EAAEC,UAAW;IACpB,KAAK,EAAEC,SAAU;IACjB,OAAO,EAAEI;EAAQ,GACbF,SAAS,GAEZC,QAAQ,KAAKR,QAAQ,CAACa,GAAG,gBAAG,oBAAC,gBAAgB,OAAG,gBAAG,oBAAC,aAAa,OAAG,CAC/D;AAEZ,CAAC"}
+{"version":3,"file":"CellDragger.js","names":["React","Icon24Reorder","Icon24ReorderIos","classNames","usePlatform","Platform","Touch","CellDragger","onDragStart","onDragMove","onDragEnd","className","restProps","platform","onClick","useCallback","e","preventDefault","IOS"],"sources":["../../../../../src/components/Cell/CellDragger/CellDragger.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Reorder, Icon24ReorderIos } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { Platform } from '../../../lib/platform';\nimport { Touch } from '../../Touch/Touch';\nimport { DraggableProps } from '../useDraggable';\nimport styles from './CellDragger.module.css';\n\ntype CellDraggerProps = DraggableProps & React.HTMLAttributes<HTMLElement>;\n\nexport const CellDragger = ({\n  onDragStart,\n  onDragMove,\n  onDragEnd,\n  className,\n  ...restProps\n}: CellDraggerProps) => {\n  const platform = usePlatform();\n\n  const onClick = React.useCallback((e: React.MouseEvent) => {\n    e.preventDefault();\n  }, []);\n\n  return (\n    <Touch\n      className={classNames(styles['CellDragger'], className)}\n      onStart={onDragStart}\n      onMoveY={onDragMove}\n      onEnd={onDragEnd}\n      onClick={onClick}\n      {...restProps}\n    >\n      {platform === Platform.IOS ? <Icon24ReorderIos /> : <Icon24Reorder />}\n    </Touch>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,aAAa,EAAEC,gBAAgB,QAAQ,kBAAkB;AAClE,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,WAAW,QAAQ,4BAA4B;AACxD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,KAAK,QAAQ,mBAAmB;AAAC;AAM1C,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAMA;EAAA,IALtBC,WAAW,QAAXA,WAAW;IACXC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACTC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAGT,WAAW,EAAE;EAE9B,IAAMU,OAAO,GAAGd,KAAK,CAACe,WAAW,CAAC,UAACC,CAAmB,EAAK;IACzDA,CAAC,CAACC,cAAc,EAAE;EACpB,CAAC,EAAE,EAAE,CAAC;EAEN,oBACE,oBAAC,KAAK;IACJ,SAAS,EAAEd,UAAU,oBAAwBQ,SAAS,CAAE;IACxD,OAAO,EAAEH,WAAY;IACrB,OAAO,EAAEC,UAAW;IACpB,KAAK,EAAEC,SAAU;IACjB,OAAO,EAAEI;EAAQ,GACbF,SAAS,GAEZC,QAAQ,KAAKR,QAAQ,CAACa,GAAG,gBAAG,oBAAC,gBAAgB,OAAG,gBAAG,oBAAC,aAAa,OAAG,CAC/D;AAEZ,CAAC"}

package/dist/cssm/components/File/File.js

@@ -3,8 +3,6 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["children", "align", "size", "mode", "stretched", "before", "after", "loading", "className", "style", "getRef", "getRootRef", "appearance"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
-import { getPlatformClassName } from '../../helpers/getPlatformClassName';
-import { usePlatform } from '../../hooks/usePlatform';
 import { Button } from '../Button/Button';
 import { VisuallyHiddenInput } from '../VisuallyHiddenInput/VisuallyHiddenInput';
 import "./File.module.css";
@@ -28,11 +26,10 @@ export var File = function File(_ref) {
     getRootRef = _ref.getRootRef,
     appearance = _ref.appearance,
     restProps = _objectWithoutProperties(_ref, _excluded);
-  var platform = usePlatform();
   return /*#__PURE__*/React.createElement(Button, {
     Component: "label",
     align: align,
-    className: classNames("vkuiFile", getPlatformClassName("vkuiFile", platform), className),
+    className: classNames("vkuiFile", className),
     stretched: stretched,
     mode: mode,
     appearance: appearance,

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

@@ -1 +1 @@
-{"version":3,"file":"File.js","names":["React","classNames","getPlatformClassName","usePlatform","Button","VisuallyHiddenInput","File","children","align","size","mode","stretched","before","after","loading","className","style","getRef","getRootRef","appearance","restProps","platform","disabled"],"sources":["../../../../src/components/File/File.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getPlatformClassName } from '../../helpers/getPlatformClassName';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { Button, VKUIButtonProps } from '../Button/Button';\nimport { VisuallyHiddenInput } from '../VisuallyHiddenInput/VisuallyHiddenInput';\nimport styles from './File.module.css';\n\nexport interface FileProps\n  extends Omit<VKUIButtonProps, 'type'>,\n    Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'>,\n    HasRef<HTMLInputElement>,\n    HasRootRef<HTMLElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/File\n */\nexport const File = ({\n  children = 'Выберите файл',\n  align = 'left',\n  size,\n  mode,\n  stretched,\n  before,\n  after,\n  loading,\n  className,\n  style,\n  getRef,\n  getRootRef,\n  appearance,\n  ...restProps\n}: FileProps) => {\n  const platform = usePlatform();\n\n  return (\n    <Button\n      Component=\"label\"\n      align={align}\n      className={classNames(\n        styles['File'],\n        getPlatformClassName(styles['File'], platform),\n        className,\n      )}\n      stretched={stretched}\n      mode={mode}\n      appearance={appearance}\n      size={size}\n      before={before}\n      after={after}\n      loading={loading}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={restProps.disabled}\n    >\n      <VisuallyHiddenInput\n        {...restProps}\n        className={styles['File__input']}\n        type=\"file\"\n        getRef={getRef}\n      />\n      {children}\n    </Button>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,oBAAoB,QAAQ,oCAAoC;AACzE,SAASC,WAAW,QAAQ,yBAAyB;AAErD,SAASC,MAAM,QAAyB,kBAAkB;AAC1D,SAASC,mBAAmB,QAAQ,4CAA4C;AAAC;AASjF;AACA;AACA;AACA,OAAO,IAAMC,IAAI,GAAG,SAAPA,IAAI,OAeA;EAAA,yBAdfC,QAAQ;IAARA,QAAQ,8BAAG,eAAe;IAAA,kBAC1BC,KAAK;IAALA,KAAK,2BAAG,MAAM;IACdC,IAAI,QAAJA,IAAI;IACJC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACTC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,UAAU,QAAVA,UAAU;IACVC,UAAU,QAAVA,UAAU;IACPC,SAAS;EAEZ,IAAMC,QAAQ,GAAGlB,WAAW,EAAE;EAE9B,oBACE,oBAAC,MAAM;IACL,SAAS,EAAC,OAAO;IACjB,KAAK,EAAEK,KAAM;IACb,SAAS,EAAEP,UAAU,aAEnBC,oBAAoB,aAAiBmB,QAAQ,CAAC,EAC9CN,SAAS,CACT;IACF,SAAS,EAAEJ,SAAU;IACrB,IAAI,EAAED,IAAK;IACX,UAAU,EAAES,UAAW;IACvB,IAAI,EAAEV,IAAK;IACX,MAAM,EAAEG,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,OAAO,EAAEC,OAAQ;IACjB,KAAK,EAAEE,KAAM;IACb,UAAU,EAAEE,UAAW;IACvB,QAAQ,EAAEE,SAAS,CAACE;EAAS,gBAE7B,oBAAC,mBAAmB,eACdF,SAAS;IACb,SAAS,mBAAwB;IACjC,IAAI,EAAC,MAAM;IACX,MAAM,EAAEH;EAAO,GACf,EACDV,QAAQ,CACF;AAEb,CAAC"}
+{"version":3,"file":"File.js","names":["React","classNames","Button","VisuallyHiddenInput","File","children","align","size","mode","stretched","before","after","loading","className","style","getRef","getRootRef","appearance","restProps","disabled"],"sources":["../../../../src/components/File/File.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasRef, HasRootRef } from '../../types';\nimport { Button, VKUIButtonProps } from '../Button/Button';\nimport { VisuallyHiddenInput } from '../VisuallyHiddenInput/VisuallyHiddenInput';\nimport styles from './File.module.css';\n\nexport interface FileProps\n  extends Omit<VKUIButtonProps, 'type'>,\n    Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'>,\n    HasRef<HTMLInputElement>,\n    HasRootRef<HTMLElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/File\n */\nexport const File = ({\n  children = 'Выберите файл',\n  align = 'left',\n  size,\n  mode,\n  stretched,\n  before,\n  after,\n  loading,\n  className,\n  style,\n  getRef,\n  getRootRef,\n  appearance,\n  ...restProps\n}: FileProps) => {\n  return (\n    <Button\n      Component=\"label\"\n      align={align}\n      className={classNames(styles['File'], className)}\n      stretched={stretched}\n      mode={mode}\n      appearance={appearance}\n      size={size}\n      before={before}\n      after={after}\n      loading={loading}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={restProps.disabled}\n    >\n      <VisuallyHiddenInput\n        {...restProps}\n        className={styles['File__input']}\n        type=\"file\"\n        getRef={getRef}\n      />\n      {children}\n    </Button>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAE5C,SAASC,MAAM,QAAyB,kBAAkB;AAC1D,SAASC,mBAAmB,QAAQ,4CAA4C;AAAC;AASjF;AACA;AACA;AACA,OAAO,IAAMC,IAAI,GAAG,SAAPA,IAAI,OAeA;EAAA,yBAdfC,QAAQ;IAARA,QAAQ,8BAAG,eAAe;IAAA,kBAC1BC,KAAK;IAALA,KAAK,2BAAG,MAAM;IACdC,IAAI,QAAJA,IAAI;IACJC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACTC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,UAAU,QAAVA,UAAU;IACVC,UAAU,QAAVA,UAAU;IACPC,SAAS;EAEZ,oBACE,oBAAC,MAAM;IACL,SAAS,EAAC,OAAO;IACjB,KAAK,EAAEZ,KAAM;IACb,SAAS,EAAEL,UAAU,aAAiBY,SAAS,CAAE;IACjD,SAAS,EAAEJ,SAAU;IACrB,IAAI,EAAED,IAAK;IACX,UAAU,EAAES,UAAW;IACvB,IAAI,EAAEV,IAAK;IACX,MAAM,EAAEG,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,OAAO,EAAEC,OAAQ;IACjB,KAAK,EAAEE,KAAM;IACb,UAAU,EAAEE,UAAW;IACvB,QAAQ,EAAEE,SAAS,CAACC;EAAS,gBAE7B,oBAAC,mBAAmB,eACdD,SAAS;IACb,SAAS,mBAAwB;IACjC,IAAI,EAAC,MAAM;IACX,MAAM,EAAEH;EAAO,GACf,EACDV,QAAQ,CACF;AAEb,CAAC"}

package/dist/cssm/components/Input/Input.js

@@ -17,7 +17,8 @@ var sizeYClassNames = _defineProperty({
 export var Input = function Input(_ref) {
   var _ref$type = _ref.type,
     type = _ref$type === void 0 ? 'text' : _ref$type,
-    align = _ref.align,
+    _ref$align = _ref.align,
+    align = _ref$align === void 0 ? 'left' : _ref$align,
     getRef = _ref.getRef,
     className = _ref.className,
     getRootRef = _ref.getRootRef,
@@ -32,7 +33,7 @@ export var Input = function Input(_ref) {
     sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
   return /*#__PURE__*/React.createElement(FormField, {
     style: style,
-    className: classNames("vkuiInput", align && styles["Input--align-".concat(align)], sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY], before && "vkuiInput--hasBefore", after && "vkuiInput--hasAfter", className),
+    className: classNames("vkuiInput", align === 'right' && "vkuiInput--align-right", align === 'center' && "vkuiInput--align-center", sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY], before && "vkuiInput--hasBefore", after && "vkuiInput--hasAfter", className),
     getRootRef: getRootRef,
     before: before,
     after: after,
@@ -45,9 +46,4 @@ export var Input = function Input(_ref) {
     ref: getRef
   })));
 };
-var styles = {
-  "Input--align-center": "vkuiInput--align-center",
-  "Input--align-right": "vkuiInput--align-right",
-  "Input--align-left": "vkuiInput--align-left"
-};
 //# sourceMappingURL=Input.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Input.js","names":["React","classNames","useAdaptivity","SizeType","FormField","sizeYClassNames","none","COMPACT","Input","type","align","getRef","className","getRootRef","style","before","after","status","mode","restProps","sizeY","styles","REGULAR","disabled"],"sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport styles from './Input.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Input--sizeY-none'],\n  [SizeType.COMPACT]: styles['Input--sizeY-compact'],\n};\n\nexport interface InputProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRef<HTMLInputElement>,\n    HasRootRef<HTMLDivElement>,\n    HasAlign,\n    FormFieldProps {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Input\n */\nexport const Input = ({\n  type = 'text',\n  align,\n  getRef,\n  className,\n  getRootRef,\n  style,\n  before,\n  after,\n  status,\n  mode,\n  ...restProps\n}: InputProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <FormField\n      style={style}\n      className={classNames(\n        styles['Input'],\n        align && styles[`Input--align-${align}`],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        before && styles['Input--hasBefore'],\n        after && styles['Input--hasAfter'],\n        className,\n      )}\n      getRootRef={getRootRef}\n      before={before}\n      after={after}\n      disabled={restProps.disabled}\n      mode={mode}\n      status={status}\n    >\n      <input {...restProps} type={type} className={styles['Input__el']} ref={getRef} />\n    </FormField>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,QAAQ,QAAQ,sBAAsB;AAE/C,SAASC,SAAS,QAAwB,wBAAwB;AAAC;AAGnE,IAAMC,eAAe;EACnBC,IAAI;AAA6B,GAChCH,QAAQ,CAACI,OAAO,6BAClB;AASD;AACA;AACA;AACA,OAAO,IAAMC,KAAK,GAAG,SAARA,KAAK,OAYA;EAAA,qBAXhBC,IAAI;IAAJA,IAAI,0BAAG,MAAM;IACbC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACTC,UAAU,QAAVA,UAAU;IACVC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,IAAI,QAAJA,IAAI;IACDC,SAAS;EAEZ,qBAA2BjB,aAAa,EAAE;IAAA,sCAAlCkB,KAAK;IAALA,KAAK,qCAAG,MAAM;EAEtB,oBACE,oBAAC,SAAS;IACR,KAAK,EAAEN,KAAM;IACb,SAAS,EAAEb,UAAU,cAEnBS,KAAK,IAAIW,MAAM,wBAAiBX,KAAK,EAAG,EACxCU,KAAK,KAAKjB,QAAQ,CAACmB,OAAO,IAAIjB,eAAe,CAACe,KAAK,CAAC,EACpDL,MAAM,0BAA8B,EACpCC,KAAK,yBAA6B,EAClCJ,SAAS,CACT;IACF,UAAU,EAAEC,UAAW;IACvB,MAAM,EAAEE,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,QAAQ,EAAEG,SAAS,CAACI,QAAS;IAC7B,IAAI,EAAEL,IAAK;IACX,MAAM,EAAED;EAAO,gBAEf,0CAAWE,SAAS;IAAE,IAAI,EAAEV,IAAK;IAAC,SAAS,iBAAsB;IAAC,GAAG,EAAEE;EAAO,GAAG,CACvE;AAEhB,CAAC;AAAC;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"file":"Input.js","names":["React","classNames","useAdaptivity","SizeType","FormField","sizeYClassNames","none","COMPACT","Input","type","align","getRef","className","getRootRef","style","before","after","status","mode","restProps","sizeY","REGULAR","disabled"],"sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport styles from './Input.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Input--sizeY-none'],\n  [SizeType.COMPACT]: styles['Input--sizeY-compact'],\n};\n\nexport interface InputProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRef<HTMLInputElement>,\n    HasRootRef<HTMLDivElement>,\n    HasAlign,\n    FormFieldProps {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Input\n */\nexport const Input = ({\n  type = 'text',\n  align = 'left',\n  getRef,\n  className,\n  getRootRef,\n  style,\n  before,\n  after,\n  status,\n  mode,\n  ...restProps\n}: InputProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <FormField\n      style={style}\n      className={classNames(\n        styles['Input'],\n        align === 'right' && styles['Input--align-right'],\n        align === 'center' && styles['Input--align-center'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        before && styles['Input--hasBefore'],\n        after && styles['Input--hasAfter'],\n        className,\n      )}\n      getRootRef={getRootRef}\n      before={before}\n      after={after}\n      disabled={restProps.disabled}\n      mode={mode}\n      status={status}\n    >\n      <input {...restProps} type={type} className={styles['Input__el']} ref={getRef} />\n    </FormField>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,QAAQ,QAAQ,sBAAsB;AAE/C,SAASC,SAAS,QAAwB,wBAAwB;AAAC;AAGnE,IAAMC,eAAe;EACnBC,IAAI;AAA6B,GAChCH,QAAQ,CAACI,OAAO,6BAClB;AASD;AACA;AACA;AACA,OAAO,IAAMC,KAAK,GAAG,SAARA,KAAK,OAYA;EAAA,qBAXhBC,IAAI;IAAJA,IAAI,0BAAG,MAAM;IAAA,kBACbC,KAAK;IAALA,KAAK,2BAAG,MAAM;IACdC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACTC,UAAU,QAAVA,UAAU;IACVC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,IAAI,QAAJA,IAAI;IACDC,SAAS;EAEZ,qBAA2BjB,aAAa,EAAE;IAAA,sCAAlCkB,KAAK;IAALA,KAAK,qCAAG,MAAM;EAEtB,oBACE,oBAAC,SAAS;IACR,KAAK,EAAEN,KAAM;IACb,SAAS,EAAEb,UAAU,cAEnBS,KAAK,KAAK,OAAO,4BAAgC,EACjDA,KAAK,KAAK,QAAQ,6BAAiC,EACnDU,KAAK,KAAKjB,QAAQ,CAACkB,OAAO,IAAIhB,eAAe,CAACe,KAAK,CAAC,EACpDL,MAAM,0BAA8B,EACpCC,KAAK,yBAA6B,EAClCJ,SAAS,CACT;IACF,UAAU,EAAEC,UAAW;IACvB,MAAM,EAAEE,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,QAAQ,EAAEG,SAAS,CAACG,QAAS;IAC7B,IAAI,EAAEJ,IAAK;IACX,MAAM,EAAED;EAAO,gBAEf,0CAAWE,SAAS;IAAE,IAAI,EAAEV,IAAK;IAAC,SAAS,iBAAsB;IAAC,GAAG,EAAEE;EAAO,GAAG,CACvE;AAEhB,CAAC"}

package/dist/cssm/components/Input/Input.module.css

@@ -1 +1 @@
-.vkuiInput{font-size:16px;line-height:20px;position:relative}.vkuiInput--align-center .vkuiInput__el{text-align:center}.vkuiInput--align-right .vkuiInput__el{text-align:right}.vkuiInput__el{align-self:stretch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-radius:inherit;box-shadow:none;box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);display:block;font-family:inherit;font-size:16px;font-size:var(--vkui--font_text--font_size--regular);font-weight:400;font-weight:var(--vkui--font_text--font_weight--regular);line-height:20px;line-height:var(--vkui--font_text--line_height--regular);margin:0;padding:0 12px;position:relative;text-overflow:ellipsis;width:100%;z-index:1;z-index:var(--vkui_internal--z_index_form_field_element)}.vkuiInput--sizeY-compact .vkuiInput__el{font-size:15px;font-size:var(--vkui--font_text--font_size--compact);line-height:20px;line-height:var(--vkui--font_text--line_height--compact)}.vkuiInput--hasBefore .vkuiInput__el{padding-left:0}.vkuiInput--hasAfter .vkuiInput__el{padding-right:0}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiInput--sizeY-none .vkuiInput__el{font-size:15px;font-size:var(--vkui--font_text--font_size--compact);line-height:20px;line-height:var(--vkui--font_text--line_height--compact)}}.vkuiInput__el:disabled{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiInput__el::-webkit-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::-moz-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::-ms-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el:disabled::-webkit-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::-moz-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::-ms-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}
+.vkuiInput{font-size:16px;line-height:20px;position:relative}.vkuiInput--align-center .vkuiInput__el{text-align:center}.vkuiInput--align-right .vkuiInput__el{text-align:right}.vkuiInput__el{align-self:stretch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-radius:inherit;box-shadow:none;box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);display:block;font-family:inherit;font-size:16px;font-size:var(--vkui--font_text--font_size--regular);font-weight:400;font-weight:var(--vkui--font_text--font_weight--regular);line-height:20px;line-height:var(--vkui--font_text--line_height--regular);margin:0;padding:0 12px;position:relative;width:100%;z-index:1;z-index:var(--vkui_internal--z_index_form_field_element)}.vkuiInput--sizeY-compact .vkuiInput__el{font-size:15px;font-size:var(--vkui--font_text--font_size--compact);line-height:20px;line-height:var(--vkui--font_text--line_height--compact)}.vkuiInput--hasBefore .vkuiInput__el{padding-left:0}.vkuiInput--hasAfter .vkuiInput__el{padding-right:0}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiInput--sizeY-none .vkuiInput__el{font-size:15px;font-size:var(--vkui--font_text--font_size--compact);line-height:20px;line-height:var(--vkui--font_text--line_height--compact)}}.vkuiInput__el:disabled{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiInput__el::-webkit-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::-moz-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::-ms-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el:disabled::-webkit-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::-moz-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::-ms-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}

package/dist/cssm/components/ModalCard/ModalCard.js

@@ -3,7 +3,6 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["icon", "header", "subheader", "children", "actions", "onClose", "nav", "id", "className", "size"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
-import { getPlatformClassName } from '../../helpers/getPlatformClassName';
 import { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';
 import { usePlatform } from '../../hooks/usePlatform';
 import { getNavId } from '../../lib/getNavId';
@@ -12,6 +11,11 @@ import { ModalCardBase } from '../ModalCardBase/ModalCardBase';
 import { ModalRootContext, useModalRegistry } from '../ModalRoot/ModalRootContext';
 import { ModalType } from '../ModalRoot/types';
 import "./ModalCard.module.css";
+var platformClassNames = {
+  ios: "vkuiModalCard--ios",
+  android: "vkuiModalCard--android",
+  vkcom: "vkuiModalCard--vkcom"
+};
 var warn = warnOnce('ModalCard');
 
 /**
@@ -40,7 +44,7 @@ export var ModalCard = function ModalCard(_ref) {
     refs = _useModalRegistry.refs;
   return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
     id: id,
-    className: classNames("vkuiModalCard", getPlatformClassName("vkuiModalCard", platform), isDesktop && "vkuiModalCard--desktop", className)
+    className: classNames("vkuiModalCard", platformClassNames.hasOwnProperty(platform) ? platformClassNames[platform] : platformClassNames.android, isDesktop && "vkuiModalCard--desktop", className)
   }), /*#__PURE__*/React.createElement(ModalCardBase, {
     className: "vkuiModalCard__in",
     getRootRef: refs.innerElement,

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

@@ -1 +1 @@
-{"version":3,"file":"ModalCard.js","names":["React","classNames","getPlatformClassName","useAdaptivityWithJSMediaQueries","usePlatform","getNavId","warnOnce","ModalCardBase","ModalRootContext","useModalRegistry","ModalType","warn","ModalCard","icon","header","subheader","children","actions","onClose","nav","id","className","size","restProps","isDesktop","platform","modalContext","useContext","CARD","refs","innerElement"],"sources":["../../../../src/components/ModalCard/ModalCard.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getPlatformClassName } from '../../helpers/getPlatformClassName';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ModalCardBase, ModalCardBaseProps } from '../ModalCardBase/ModalCardBase';\nimport { ModalRootContext, useModalRegistry } from '../ModalRoot/ModalRootContext';\nimport { ModalType } from '../ModalRoot/types';\nimport styles from './ModalCard.module.css';\n\nexport interface ModalCardProps extends NavIdProps, ModalCardBaseProps {}\n\nconst warn = warnOnce('ModalCard');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCard\n */\nexport const ModalCard = ({\n  icon,\n  header,\n  subheader,\n  children,\n  actions,\n  onClose,\n  nav,\n  id,\n  className,\n  size,\n  ...restProps\n}: ModalCardProps) => {\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const platform = usePlatform();\n\n  const modalContext = React.useContext(ModalRootContext);\n  const { refs } = useModalRegistry(getNavId({ nav, id }, warn), ModalType.CARD);\n\n  return (\n    <div\n      {...restProps}\n      id={id}\n      className={classNames(\n        styles['ModalCard'],\n        getPlatformClassName(styles['ModalCard'], platform),\n        isDesktop && styles['ModalCard--desktop'],\n        className,\n      )}\n    >\n      <ModalCardBase\n        className={styles['ModalCard__in']}\n        getRootRef={refs.innerElement}\n        icon={icon}\n        header={header}\n        subheader={subheader}\n        actions={actions}\n        onClose={onClose || modalContext.onClose}\n        size={size}\n      >\n        {children}\n      </ModalCardBase>\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,oBAAoB,QAAQ,oCAAoC;AACzE,SAASC,+BAA+B,QAAQ,6CAA6C;AAC7F,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAoB,oBAAoB;AACzD,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,aAAa,QAA4B,gCAAgC;AAClF,SAASC,gBAAgB,EAAEC,gBAAgB,QAAQ,+BAA+B;AAClF,SAASC,SAAS,QAAQ,oBAAoB;AAAC;AAK/C,IAAMC,IAAI,GAAGL,QAAQ,CAAC,WAAW,CAAC;;AAElC;AACA;AACA;AACA,OAAO,IAAMM,SAAS,GAAG,SAAZA,SAAS,OAYA;EAAA,IAXpBC,IAAI,QAAJA,IAAI;IACJC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACPC,OAAO,QAAPA,OAAO;IACPC,GAAG,QAAHA,GAAG;IACHC,EAAE,QAAFA,EAAE;IACFC,SAAS,QAATA,SAAS;IACTC,IAAI,QAAJA,IAAI;IACDC,SAAS;EAEZ,4BAAsBpB,+BAA+B,EAAE;IAA/CqB,SAAS,yBAATA,SAAS;EACjB,IAAMC,QAAQ,GAAGrB,WAAW,EAAE;EAE9B,IAAMsB,YAAY,GAAG1B,KAAK,CAAC2B,UAAU,CAACnB,gBAAgB,CAAC;EACvD,wBAAiBC,gBAAgB,CAACJ,QAAQ,CAAC;MAAEc,GAAG,EAAHA,GAAG;MAAEC,EAAE,EAAFA;IAAG,CAAC,EAAET,IAAI,CAAC,EAAED,SAAS,CAACkB,IAAI,CAAC;IAAtEC,IAAI,qBAAJA,IAAI;EAEZ,oBACE,wCACMN,SAAS;IACb,EAAE,EAAEH,EAAG;IACP,SAAS,EAAEnB,UAAU,kBAEnBC,oBAAoB,kBAAsBuB,QAAQ,CAAC,EACnDD,SAAS,4BAAgC,EACzCH,SAAS;EACT,iBAEF,oBAAC,aAAa;IACZ,SAAS,qBAA0B;IACnC,UAAU,EAAEQ,IAAI,CAACC,YAAa;IAC9B,IAAI,EAAEjB,IAAK;IACX,MAAM,EAAEC,MAAO;IACf,SAAS,EAAEC,SAAU;IACrB,OAAO,EAAEE,OAAQ;IACjB,OAAO,EAAEC,OAAO,IAAIQ,YAAY,CAACR,OAAQ;IACzC,IAAI,EAAEI;EAAK,GAEVN,QAAQ,CACK,CACZ;AAEV,CAAC"}
+{"version":3,"file":"ModalCard.js","names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","getNavId","warnOnce","ModalCardBase","ModalRootContext","useModalRegistry","ModalType","platformClassNames","ios","android","vkcom","warn","ModalCard","icon","header","subheader","children","actions","onClose","nav","id","className","size","restProps","isDesktop","platform","modalContext","useContext","CARD","refs","hasOwnProperty","innerElement"],"sources":["../../../../src/components/ModalCard/ModalCard.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ModalCardBase, ModalCardBaseProps } from '../ModalCardBase/ModalCardBase';\nimport { ModalRootContext, useModalRegistry } from '../ModalRoot/ModalRootContext';\nimport { ModalType } from '../ModalRoot/types';\nimport styles from './ModalCard.module.css';\n\nconst platformClassNames = {\n  ios: styles['ModalCard--ios'],\n  android: styles['ModalCard--android'],\n  vkcom: styles['ModalCard--vkcom'],\n};\n\nexport interface ModalCardProps extends NavIdProps, ModalCardBaseProps {}\n\nconst warn = warnOnce('ModalCard');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCard\n */\nexport const ModalCard = ({\n  icon,\n  header,\n  subheader,\n  children,\n  actions,\n  onClose,\n  nav,\n  id,\n  className,\n  size,\n  ...restProps\n}: ModalCardProps) => {\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const platform = usePlatform();\n\n  const modalContext = React.useContext(ModalRootContext);\n  const { refs } = useModalRegistry(getNavId({ nav, id }, warn), ModalType.CARD);\n\n  return (\n    <div\n      {...restProps}\n      id={id}\n      className={classNames(\n        styles['ModalCard'],\n        platformClassNames.hasOwnProperty(platform)\n          ? platformClassNames[platform]\n          : platformClassNames.android,\n        isDesktop && styles['ModalCard--desktop'],\n        className,\n      )}\n    >\n      <ModalCardBase\n        className={styles['ModalCard__in']}\n        getRootRef={refs.innerElement}\n        icon={icon}\n        header={header}\n        subheader={subheader}\n        actions={actions}\n        onClose={onClose || modalContext.onClose}\n        size={size}\n      >\n        {children}\n      </ModalCardBase>\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,+BAA+B,QAAQ,6CAA6C;AAC7F,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAoB,oBAAoB;AACzD,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,aAAa,QAA4B,gCAAgC;AAClF,SAASC,gBAAgB,EAAEC,gBAAgB,QAAQ,+BAA+B;AAClF,SAASC,SAAS,QAAQ,oBAAoB;AAAC;AAG/C,IAAMC,kBAAkB,GAAG;EACzBC,GAAG,sBAA0B;EAC7BC,OAAO,0BAA8B;EACrCC,KAAK;AACP,CAAC;AAID,IAAMC,IAAI,GAAGT,QAAQ,CAAC,WAAW,CAAC;;AAElC;AACA;AACA;AACA,OAAO,IAAMU,SAAS,GAAG,SAAZA,SAAS,OAYA;EAAA,IAXpBC,IAAI,QAAJA,IAAI;IACJC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACPC,OAAO,QAAPA,OAAO;IACPC,GAAG,QAAHA,GAAG;IACHC,EAAE,QAAFA,EAAE;IACFC,SAAS,QAATA,SAAS;IACTC,IAAI,QAAJA,IAAI;IACDC,SAAS;EAEZ,4BAAsBxB,+BAA+B,EAAE;IAA/CyB,SAAS,yBAATA,SAAS;EACjB,IAAMC,QAAQ,GAAGzB,WAAW,EAAE;EAE9B,IAAM0B,YAAY,GAAG7B,KAAK,CAAC8B,UAAU,CAACvB,gBAAgB,CAAC;EACvD,wBAAiBC,gBAAgB,CAACJ,QAAQ,CAAC;MAAEkB,GAAG,EAAHA,GAAG;MAAEC,EAAE,EAAFA;IAAG,CAAC,EAAET,IAAI,CAAC,EAAEL,SAAS,CAACsB,IAAI,CAAC;IAAtEC,IAAI,qBAAJA,IAAI;EAEZ,oBACE,wCACMN,SAAS;IACb,EAAE,EAAEH,EAAG;IACP,SAAS,EAAEtB,UAAU,kBAEnBS,kBAAkB,CAACuB,cAAc,CAACL,QAAQ,CAAC,GACvClB,kBAAkB,CAACkB,QAAQ,CAAC,GAC5BlB,kBAAkB,CAACE,OAAO,EAC9Be,SAAS,4BAAgC,EACzCH,SAAS;EACT,iBAEF,oBAAC,aAAa;IACZ,SAAS,qBAA0B;IACnC,UAAU,EAAEQ,IAAI,CAACE,YAAa;IAC9B,IAAI,EAAElB,IAAK;IACX,MAAM,EAAEC,MAAO;IACf,SAAS,EAAEC,SAAU;IACrB,OAAO,EAAEE,OAAQ;IACjB,OAAO,EAAEC,OAAO,IAAIQ,YAAY,CAACR,OAAQ;IACzC,IAAI,EAAEI;EAAK,GAEVN,QAAQ,CACK,CACZ;AAEV,CAAC"}

package/dist/cssm/components/ModalCardBase/ModalCardBase.js

@@ -5,7 +5,6 @@ var _excluded = ["getRootRef", "icon", "header", "subheader", "children", "actio
 import * as React from 'react';
 import { Icon24Dismiss } from '@vkontakte/icons';
 import { classNames, hasReactNode } from '@vkontakte/vkjs';
-import { getPlatformClassName } from '../../helpers/getPlatformClassName';
 import { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';
 import { useKeyboard } from '../../hooks/useKeyboard';
 import { usePlatform } from '../../hooks/usePlatform';
@@ -15,6 +14,11 @@ import { PanelHeaderButton } from '../PanelHeaderButton/PanelHeaderButton';
 import { Subhead } from '../Typography/Subhead/Subhead';
 import { Title } from '../Typography/Title/Title';
 import "./ModalCardBase.module.css";
+var platformClassNames = {
+  ios: "vkuiModalCardBase--ios",
+  android: "vkuiModalCardBase--android",
+  vkcom: "vkuiModalCardBase--vkcom"
+};
 /**
  * @see https://vkcom.github.io/VKUI/#/ModalCardBase
  */
@@ -39,7 +43,7 @@ export var ModalCardBase = function ModalCardBase(_ref) {
   var canShowCloseButtonIOS = platform === Platform.IOS && !isDesktop;
   var size = isDesktop ? sizeProp : undefined;
   return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: classNames("vkuiModalCardBase", getPlatformClassName("vkuiModalCardBase", platform), isDesktop && "vkuiModalCardBase--desktop", className),
+    className: classNames("vkuiModalCardBase", platformClassNames.hasOwnProperty(platform) ? platformClassNames[platform] : platformClassNames.android, isDesktop && "vkuiModalCardBase--desktop", className),
     ref: getRootRef,
     style: _objectSpread(_objectSpread({}, style), {}, {
       maxWidth: size

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

@@ -1 +1 @@
-{"version":3,"file":"ModalCardBase.js","names":["React","Icon24Dismiss","classNames","hasReactNode","getPlatformClassName","useAdaptivityWithJSMediaQueries","useKeyboard","usePlatform","Platform","ModalDismissButton","PanelHeaderButton","Subhead","Title","ModalCardBase","getRootRef","icon","header","subheader","children","actions","onClose","dismissLabel","className","style","sizeProp","size","restProps","platform","isDesktop","isSoftwareKeyboardOpened","isOpened","canShowCloseButtonIOS","IOS","undefined","maxWidth"],"sources":["../../../../src/components/ModalCardBase/ModalCardBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Dismiss } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { getPlatformClassName } from '../../helpers/getPlatformClassName';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useKeyboard } from '../../hooks/useKeyboard';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRootRef } from '../../types';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PanelHeaderButton } from '../PanelHeaderButton/PanelHeaderButton';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './ModalCardBase.module.css';\n\nexport interface ModalCardBaseProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Иконка.\n   *\n   * Может быть компонентом иконки, например, `<Icon56MoneyTransferOutline />`, или `<Avatar size={72} src=\"\" />`\n   */\n  icon?: React.ReactNode;\n\n  /**\n   * Заголовок карточки\n   */\n  header?: React.ReactNode;\n\n  /**\n   * Подзаголовок\n   */\n  subheader?: React.ReactNode;\n\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:\n   *\n   * - `size=\"l\" mode=\"primary\" stretched`\n   * - `size=\"l\" mode=\"secondary\" stretched`\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `gap=\"s\" mode=\"horizontal\" stretched`\n   * - `gap=\"m\" mode=\"vertical\" stretched`\n   */\n  actions?: React.ReactNode;\n\n  onClose?: VoidFunction;\n\n  /**\n   * `aria-label` для кнопки закрытия. Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n\n  /**\n   * Задаёт контенту максимальную ширину для десктопной версии.\n   */\n  size?: number;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCardBase\n */\nexport const ModalCardBase = ({\n  getRootRef,\n  icon,\n  header,\n  subheader,\n  children,\n  actions,\n  onClose,\n  dismissLabel = 'Скрыть',\n  className,\n  style,\n  size: sizeProp,\n  ...restProps\n}: ModalCardBaseProps) => {\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const isSoftwareKeyboardOpened = useKeyboard().isOpened;\n\n  const canShowCloseButtonIOS = platform === Platform.IOS && !isDesktop;\n\n  const size = isDesktop ? sizeProp : undefined;\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        styles['ModalCardBase'],\n        getPlatformClassName(styles['ModalCardBase'], platform),\n        isDesktop && styles['ModalCardBase--desktop'],\n        className,\n      )}\n      ref={getRootRef}\n      style={{\n        ...style,\n        maxWidth: size,\n      }}\n    >\n      <div\n        className={classNames(\n          styles['ModalCardBase__container'],\n          isSoftwareKeyboardOpened && styles['ModalCardBase__container--softwareKeyboardOpened'],\n        )}\n      >\n        {hasReactNode(icon) && <div className={styles['ModalCardBase__icon']}>{icon}</div>}\n        {hasReactNode(header) && (\n          <Title level=\"2\" weight=\"2\" className={styles['ModalCardBase__header']}>\n            {header}\n          </Title>\n        )}\n        {hasReactNode(subheader) && (\n          <Subhead className={styles['ModalCardBase__subheader']}>{subheader}</Subhead>\n        )}\n\n        {children}\n\n        {hasReactNode(actions) && <div className={styles['ModalCardBase__actions']}>{actions}</div>}\n\n        {isDesktop && <ModalDismissButton onClick={onClose} />}\n        {canShowCloseButtonIOS && (\n          <PanelHeaderButton\n            aria-label={dismissLabel}\n            className={styles['ModalCardBase__dismiss']}\n            onClick={onClose}\n          >\n            <Icon24Dismiss />\n          </PanelHeaderButton>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,oBAAoB,QAAQ,oCAAoC;AACzE,SAASC,+BAA+B,QAAQ,6CAA6C;AAC7F,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAQ,oBAAoB;AAE7C,SAASC,kBAAkB,QAAQ,0CAA0C;AAC7E,SAASC,iBAAiB,QAAQ,wCAAwC;AAC1E,SAASC,OAAO,QAAQ,+BAA+B;AACvD,SAASC,KAAK,QAAQ,2BAA2B;AAAC;AAiDlD;AACA;AACA;AACA,OAAO,IAAMC,aAAa,GAAG,SAAhBA,aAAa,OAaA;EAAA,IAZxBC,UAAU,QAAVA,UAAU;IACVC,IAAI,QAAJA,IAAI;IACJC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACPC,OAAO,QAAPA,OAAO;IAAA,yBACPC,YAAY;IAAZA,YAAY,kCAAG,QAAQ;IACvBC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACCC,QAAQ,QAAdC,IAAI;IACDC,SAAS;EAEZ,IAAMC,QAAQ,GAAGpB,WAAW,EAAE;EAC9B,4BAAsBF,+BAA+B,EAAE;IAA/CuB,SAAS,yBAATA,SAAS;EACjB,IAAMC,wBAAwB,GAAGvB,WAAW,EAAE,CAACwB,QAAQ;EAEvD,IAAMC,qBAAqB,GAAGJ,QAAQ,KAAKnB,QAAQ,CAACwB,GAAG,IAAI,CAACJ,SAAS;EAErE,IAAMH,IAAI,GAAGG,SAAS,GAAGJ,QAAQ,GAAGS,SAAS;EAE7C,oBACE,wCACMP,SAAS;IACb,SAAS,EAAExB,UAAU,sBAEnBE,oBAAoB,sBAA0BuB,QAAQ,CAAC,EACvDC,SAAS,gCAAoC,EAC7CN,SAAS,CACT;IACF,GAAG,EAAER,UAAW;IAChB,KAAK,kCACAS,KAAK;MACRW,QAAQ,EAAET;IAAI;EACd,iBAEF;IACE,SAAS,EAAEvB,UAAU,iCAEnB2B,wBAAwB,0DAA8D;EACtF,GAED1B,YAAY,CAACY,IAAI,CAAC,iBAAI;IAAK,SAAS;EAAgC,GAAEA,IAAI,CAAO,EACjFZ,YAAY,CAACa,MAAM,CAAC,iBACnB,oBAAC,KAAK;IAAC,KAAK,EAAC,GAAG;IAAC,MAAM,EAAC,GAAG;IAAC,SAAS;EAAkC,GACpEA,MAAM,CAEV,EACAb,YAAY,CAACc,SAAS,CAAC,iBACtB,oBAAC,OAAO;IAAC,SAAS;EAAqC,GAAEA,SAAS,CACnE,EAEAC,QAAQ,EAERf,YAAY,CAACgB,OAAO,CAAC,iBAAI;IAAK,SAAS;EAAmC,GAAEA,OAAO,CAAO,EAE1FS,SAAS,iBAAI,oBAAC,kBAAkB;IAAC,OAAO,EAAER;EAAQ,EAAG,EACrDW,qBAAqB,iBACpB,oBAAC,iBAAiB;IAChB,cAAYV,YAAa;IACzB,SAAS,8BAAmC;IAC5C,OAAO,EAAED;EAAQ,gBAEjB,oBAAC,aAAa,OAAG,CAEpB,CACG,CACF;AAEV,CAAC"}
+{"version":3,"file":"ModalCardBase.js","names":["React","Icon24Dismiss","classNames","hasReactNode","useAdaptivityWithJSMediaQueries","useKeyboard","usePlatform","Platform","ModalDismissButton","PanelHeaderButton","Subhead","Title","platformClassNames","ios","android","vkcom","ModalCardBase","getRootRef","icon","header","subheader","children","actions","onClose","dismissLabel","className","style","sizeProp","size","restProps","platform","isDesktop","isSoftwareKeyboardOpened","isOpened","canShowCloseButtonIOS","IOS","undefined","hasOwnProperty","maxWidth"],"sources":["../../../../src/components/ModalCardBase/ModalCardBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Dismiss } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useKeyboard } from '../../hooks/useKeyboard';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRootRef } from '../../types';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PanelHeaderButton } from '../PanelHeaderButton/PanelHeaderButton';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './ModalCardBase.module.css';\n\nconst platformClassNames = {\n  ios: styles['ModalCardBase--ios'],\n  android: styles['ModalCardBase--android'],\n  vkcom: styles['ModalCardBase--vkcom'],\n};\n\nexport interface ModalCardBaseProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Иконка.\n   *\n   * Может быть компонентом иконки, например, `<Icon56MoneyTransferOutline />`, или `<Avatar size={72} src=\"\" />`\n   */\n  icon?: React.ReactNode;\n\n  /**\n   * Заголовок карточки\n   */\n  header?: React.ReactNode;\n\n  /**\n   * Подзаголовок\n   */\n  subheader?: React.ReactNode;\n\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:\n   *\n   * - `size=\"l\" mode=\"primary\" stretched`\n   * - `size=\"l\" mode=\"secondary\" stretched`\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `gap=\"s\" mode=\"horizontal\" stretched`\n   * - `gap=\"m\" mode=\"vertical\" stretched`\n   */\n  actions?: React.ReactNode;\n\n  onClose?: VoidFunction;\n\n  /**\n   * `aria-label` для кнопки закрытия. Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n\n  /**\n   * Задаёт контенту максимальную ширину для десктопной версии.\n   */\n  size?: number;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCardBase\n */\nexport const ModalCardBase = ({\n  getRootRef,\n  icon,\n  header,\n  subheader,\n  children,\n  actions,\n  onClose,\n  dismissLabel = 'Скрыть',\n  className,\n  style,\n  size: sizeProp,\n  ...restProps\n}: ModalCardBaseProps) => {\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const isSoftwareKeyboardOpened = useKeyboard().isOpened;\n\n  const canShowCloseButtonIOS = platform === Platform.IOS && !isDesktop;\n\n  const size = isDesktop ? sizeProp : undefined;\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        styles['ModalCardBase'],\n        platformClassNames.hasOwnProperty(platform)\n          ? platformClassNames[platform]\n          : platformClassNames.android,\n        isDesktop && styles['ModalCardBase--desktop'],\n        className,\n      )}\n      ref={getRootRef}\n      style={{\n        ...style,\n        maxWidth: size,\n      }}\n    >\n      <div\n        className={classNames(\n          styles['ModalCardBase__container'],\n          isSoftwareKeyboardOpened && styles['ModalCardBase__container--softwareKeyboardOpened'],\n        )}\n      >\n        {hasReactNode(icon) && <div className={styles['ModalCardBase__icon']}>{icon}</div>}\n        {hasReactNode(header) && (\n          <Title level=\"2\" weight=\"2\" className={styles['ModalCardBase__header']}>\n            {header}\n          </Title>\n        )}\n        {hasReactNode(subheader) && (\n          <Subhead className={styles['ModalCardBase__subheader']}>{subheader}</Subhead>\n        )}\n\n        {children}\n\n        {hasReactNode(actions) && <div className={styles['ModalCardBase__actions']}>{actions}</div>}\n\n        {isDesktop && <ModalDismissButton onClick={onClose} />}\n        {canShowCloseButtonIOS && (\n          <PanelHeaderButton\n            aria-label={dismissLabel}\n            className={styles['ModalCardBase__dismiss']}\n            onClick={onClose}\n          >\n            <Icon24Dismiss />\n          </PanelHeaderButton>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,+BAA+B,QAAQ,6CAA6C;AAC7F,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAQ,oBAAoB;AAE7C,SAASC,kBAAkB,QAAQ,0CAA0C;AAC7E,SAASC,iBAAiB,QAAQ,wCAAwC;AAC1E,SAASC,OAAO,QAAQ,+BAA+B;AACvD,SAASC,KAAK,QAAQ,2BAA2B;AAAC;AAGlD,IAAMC,kBAAkB,GAAG;EACzBC,GAAG,0BAA8B;EACjCC,OAAO,8BAAkC;EACzCC,KAAK;AACP,CAAC;AAgDD;AACA;AACA;AACA,OAAO,IAAMC,aAAa,GAAG,SAAhBA,aAAa,OAaA;EAAA,IAZxBC,UAAU,QAAVA,UAAU;IACVC,IAAI,QAAJA,IAAI;IACJC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACPC,OAAO,QAAPA,OAAO;IAAA,yBACPC,YAAY;IAAZA,YAAY,kCAAG,QAAQ;IACvBC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACCC,QAAQ,QAAdC,IAAI;IACDC,SAAS;EAEZ,IAAMC,QAAQ,GAAGxB,WAAW,EAAE;EAC9B,4BAAsBF,+BAA+B,EAAE;IAA/C2B,SAAS,yBAATA,SAAS;EACjB,IAAMC,wBAAwB,GAAG3B,WAAW,EAAE,CAAC4B,QAAQ;EAEvD,IAAMC,qBAAqB,GAAGJ,QAAQ,KAAKvB,QAAQ,CAAC4B,GAAG,IAAI,CAACJ,SAAS;EAErE,IAAMH,IAAI,GAAGG,SAAS,GAAGJ,QAAQ,GAAGS,SAAS;EAE7C,oBACE,wCACMP,SAAS;IACb,SAAS,EAAE3B,UAAU,sBAEnBU,kBAAkB,CAACyB,cAAc,CAACP,QAAQ,CAAC,GACvClB,kBAAkB,CAACkB,QAAQ,CAAC,GAC5BlB,kBAAkB,CAACE,OAAO,EAC9BiB,SAAS,gCAAoC,EAC7CN,SAAS,CACT;IACF,GAAG,EAAER,UAAW;IAChB,KAAK,kCACAS,KAAK;MACRY,QAAQ,EAAEV;IAAI;EACd,iBAEF;IACE,SAAS,EAAE1B,UAAU,iCAEnB8B,wBAAwB,0DAA8D;EACtF,GAED7B,YAAY,CAACe,IAAI,CAAC,iBAAI;IAAK,SAAS;EAAgC,GAAEA,IAAI,CAAO,EACjFf,YAAY,CAACgB,MAAM,CAAC,iBACnB,oBAAC,KAAK;IAAC,KAAK,EAAC,GAAG;IAAC,MAAM,EAAC,GAAG;IAAC,SAAS;EAAkC,GACpEA,MAAM,CAEV,EACAhB,YAAY,CAACiB,SAAS,CAAC,iBACtB,oBAAC,OAAO;IAAC,SAAS;EAAqC,GAAEA,SAAS,CACnE,EAEAC,QAAQ,EAERlB,YAAY,CAACmB,OAAO,CAAC,iBAAI;IAAK,SAAS;EAAmC,GAAEA,OAAO,CAAO,EAE1FS,SAAS,iBAAI,oBAAC,kBAAkB;IAAC,OAAO,EAAER;EAAQ,EAAG,EACrDW,qBAAqB,iBACpB,oBAAC,iBAAiB;IAChB,cAAYV,YAAa;IACzB,SAAS,8BAAmC;IAC5C,OAAO,EAAED;EAAQ,gBAEjB,oBAAC,aAAa,OAAG,CAEpB,CACG,CACF;AAEV,CAAC"}

package/dist/cssm/components/ModalPageHeader/ModalPageHeader.js

@@ -3,7 +3,6 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["children", "separator", "getRef", "className"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
-import { getPlatformClassName } from '../../helpers/getPlatformClassName';
 import { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';
 import { usePlatform } from '../../hooks/usePlatform';
 import { Platform } from '../../lib/platform';
@@ -25,7 +24,7 @@ export var ModalPageHeader = function ModalPageHeader(_ref) {
   var _useAdaptivityWithJSM = useAdaptivityWithJSMediaQueries(),
     isDesktop = _useAdaptivityWithJSM.isDesktop;
   return /*#__PURE__*/React.createElement("div", {
-    className: classNames("vkuiModalPageHeader", getPlatformClassName("vkuiModalPageHeader", platform), platform !== Platform.VKCOM && "vkuiModalPageHeader--withGaps", isDesktop && "vkuiModalPageHeader--desktop"),
+    className: classNames("vkuiModalPageHeader", platform !== Platform.VKCOM && "vkuiModalPageHeader--withGaps", isDesktop && "vkuiModalPageHeader--desktop"),
     ref: getRef
   }, /*#__PURE__*/React.createElement(PanelHeader, _extends({
     className: classNames("vkuiModalPageHeader__in", className)

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

@@ -1 +1 @@
-{"version":3,"file":"ModalPageHeader.js","names":["React","classNames","getPlatformClassName","useAdaptivityWithJSMediaQueries","usePlatform","Platform","PanelHeader","Separator","ModalPageHeader","children","separator","getRef","className","restProps","platform","hasSeparator","VKCOM","isDesktop"],"sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getPlatformClassName } from '../../helpers/getPlatformClassName';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRef } from '../../types';\nimport { PanelHeader, PanelHeaderProps } from '../PanelHeader/PanelHeader';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageHeader.module.css';\n\nexport interface ModalPageHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    Omit<PanelHeaderProps, 'fixed' | 'shadow'>,\n    HasRef<HTMLDivElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPageHeader\n */\nexport const ModalPageHeader = ({\n  children,\n  separator = true,\n  getRef,\n  className,\n  ...restProps\n}: ModalPageHeaderProps) => {\n  const platform = usePlatform();\n  const hasSeparator = separator && platform === Platform.VKCOM;\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  return (\n    <div\n      className={classNames(\n        styles['ModalPageHeader'],\n        getPlatformClassName(styles['ModalPageHeader'], platform),\n        platform !== Platform.VKCOM && styles['ModalPageHeader--withGaps'],\n        isDesktop && styles['ModalPageHeader--desktop'],\n      )}\n      ref={getRef}\n    >\n      <PanelHeader\n        className={classNames(styles['ModalPageHeader__in'], className)}\n        {...restProps}\n        fixed={false}\n        separator={false}\n        transparent\n      >\n        {children}\n      </PanelHeader>\n      {hasSeparator && <Separator wide />}\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,oBAAoB,QAAQ,oCAAoC;AACzE,SAASC,+BAA+B,QAAQ,6CAA6C;AAC7F,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAQ,oBAAoB;AAE7C,SAASC,WAAW,QAA0B,4BAA4B;AAC1E,SAASC,SAAS,QAAQ,wBAAwB;AAAC;AAQnD;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAe,OAMA;EAAA,IAL1BC,QAAQ,QAARA,QAAQ;IAAA,sBACRC,SAAS;IAATA,SAAS,+BAAG,IAAI;IAChBC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAGV,WAAW,EAAE;EAC9B,IAAMW,YAAY,GAAGL,SAAS,IAAII,QAAQ,KAAKT,QAAQ,CAACW,KAAK;EAC7D,4BAAsBb,+BAA+B,EAAE;IAA/Cc,SAAS,yBAATA,SAAS;EAEjB,oBACE;IACE,SAAS,EAAEhB,UAAU,wBAEnBC,oBAAoB,wBAA4BY,QAAQ,CAAC,EACzDA,QAAQ,KAAKT,QAAQ,CAACW,KAAK,mCAAuC,EAClEC,SAAS,kCAAsC,CAC/C;IACF,GAAG,EAAEN;EAAO,gBAEZ,oBAAC,WAAW;IACV,SAAS,EAAEV,UAAU,4BAAgCW,SAAS;EAAE,GAC5DC,SAAS;IACb,KAAK,EAAE,KAAM;IACb,SAAS,EAAE,KAAM;IACjB,WAAW;EAAA,IAEVJ,QAAQ,CACG,EACbM,YAAY,iBAAI,oBAAC,SAAS;IAAC,IAAI;EAAA,EAAG,CAC/B;AAEV,CAAC"}
+{"version":3,"file":"ModalPageHeader.js","names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","Platform","PanelHeader","Separator","ModalPageHeader","children","separator","getRef","className","restProps","platform","hasSeparator","VKCOM","isDesktop"],"sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRef } from '../../types';\nimport { PanelHeader, PanelHeaderProps } from '../PanelHeader/PanelHeader';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageHeader.module.css';\n\nexport interface ModalPageHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    Omit<PanelHeaderProps, 'fixed' | 'shadow'>,\n    HasRef<HTMLDivElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPageHeader\n */\nexport const ModalPageHeader = ({\n  children,\n  separator = true,\n  getRef,\n  className,\n  ...restProps\n}: ModalPageHeaderProps) => {\n  const platform = usePlatform();\n  const hasSeparator = separator && platform === Platform.VKCOM;\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  return (\n    <div\n      className={classNames(\n        styles['ModalPageHeader'],\n        platform !== Platform.VKCOM && styles['ModalPageHeader--withGaps'],\n        isDesktop && styles['ModalPageHeader--desktop'],\n      )}\n      ref={getRef}\n    >\n      <PanelHeader\n        className={classNames(styles['ModalPageHeader__in'], className)}\n        {...restProps}\n        fixed={false}\n        separator={false}\n        transparent\n      >\n        {children}\n      </PanelHeader>\n      {hasSeparator && <Separator wide />}\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,+BAA+B,QAAQ,6CAA6C;AAC7F,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAQ,oBAAoB;AAE7C,SAASC,WAAW,QAA0B,4BAA4B;AAC1E,SAASC,SAAS,QAAQ,wBAAwB;AAAC;AAQnD;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAe,OAMA;EAAA,IAL1BC,QAAQ,QAARA,QAAQ;IAAA,sBACRC,SAAS;IAATA,SAAS,+BAAG,IAAI;IAChBC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAGV,WAAW,EAAE;EAC9B,IAAMW,YAAY,GAAGL,SAAS,IAAII,QAAQ,KAAKT,QAAQ,CAACW,KAAK;EAC7D,4BAAsBb,+BAA+B,EAAE;IAA/Cc,SAAS,yBAATA,SAAS;EAEjB,oBACE;IACE,SAAS,EAAEf,UAAU,wBAEnBY,QAAQ,KAAKT,QAAQ,CAACW,KAAK,mCAAuC,EAClEC,SAAS,kCAAsC,CAC/C;IACF,GAAG,EAAEN;EAAO,gBAEZ,oBAAC,WAAW;IACV,SAAS,EAAET,UAAU,4BAAgCU,SAAS;EAAE,GAC5DC,SAAS;IACb,KAAK,EAAE,KAAM;IACb,SAAS,EAAE,KAAM;IACjB,WAAW;EAAA,IAEVJ,QAAQ,CACG,EACbM,YAAY,iBAAI,oBAAC,SAAS;IAAC,IAAI;EAAA,EAAG,CAC/B;AAEV,CAAC"}

package/dist/cssm/components/NativeSelect/NativeSelect.js

@@ -5,11 +5,9 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["style", "defaultValue", "align", "placeholder", "children", "className", "getRef", "getRootRef", "disabled", "multiline", "selectType", "status", "onChange", "value"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
-import { getPlatformClassName } from '../../helpers/getPlatformClassName';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
 import { useEnsuredControl } from '../../hooks/useEnsuredControl';
 import { useExternRef } from '../../hooks/useExternRef';
-import { usePlatform } from '../../hooks/usePlatform';
 import { SizeType } from '../../lib/adaptivity';
 import { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';
 import { DropdownIcon } from '../DropdownIcon/DropdownIcon';
@@ -40,7 +38,6 @@ var NativeSelect = function NativeSelect(_ref) {
     onChangeProp = _ref.onChange,
     valueProp = _ref.value,
     restProps = _objectWithoutProperties(_ref, _excluded);
-  var platform = usePlatform();
   var _React$useState = React.useState(''),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     title = _React$useState2[0],
@@ -72,7 +69,7 @@ var NativeSelect = function NativeSelect(_ref) {
   }, [value, children]);
   return /*#__PURE__*/React.createElement(FormField, {
     Component: "label",
-    className: classNames("vkuiSelect", getPlatformClassName("vkuiSelect", platform), empty && "vkuiSelect--empty", multiline && "vkuiSelect--multiline", align && styles["Select--align-".concat(align)], sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY], className),
+    className: classNames("vkuiSelect", empty && "vkuiSelect--empty", multiline && "vkuiSelect--multiline", align && styles["Select--align-".concat(align)], sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY], className),
     style: style,
     getRootRef: getRootRef,
     disabled: disabled,

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

@@ -1 +1 @@
-{"version":3,"file":"NativeSelect.js","names":["React","classNames","getPlatformClassName","useAdaptivity","useEnsuredControl","useExternRef","usePlatform","SizeType","useIsomorphicLayoutEffect","DropdownIcon","FormField","SelectTypography","sizeYClassNames","none","COMPACT","NativeSelect","style","defaultValue","align","placeholder","children","className","getRef","getRootRef","disabled","multiline","selectType","status","onChangeProp","onChange","valueProp","value","restProps","platform","useState","title","setTitle","empty","setEmpty","selectRef","sizeY","selectedOption","current","options","selectedIndex","text","styles","REGULAR"],"sources":["../../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getPlatformClassName } from '../../helpers/getPlatformClassName';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport type { SelectType } from '../Select/Select';\nimport { SelectTypography } from '../SelectTypography/SelectTypography';\nimport styles from '../Select/Select.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Select--sizeY-none'],\n  [SizeType.COMPACT]: styles['Select--sizeY-compact'],\n};\n\nexport interface NativeSelectProps\n  extends React.SelectHTMLAttributes<HTMLSelectElement>,\n    HasRef<HTMLSelectElement>,\n    HasRootRef<HTMLLabelElement>,\n    HasAlign,\n    Pick<FormFieldProps, 'status'> {\n  placeholder?: string;\n  multiline?: boolean;\n  selectType?: SelectType;\n}\n\nexport interface SelectState {\n  value?: React.SelectHTMLAttributes<HTMLSelectElement>['value'];\n  title?: string;\n  notSelected?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/NativeSelect\n */\nconst NativeSelect = ({\n  style,\n  defaultValue = '',\n  align,\n  placeholder,\n  children,\n  className,\n  getRef,\n  getRootRef,\n  disabled,\n  multiline,\n  selectType = 'default',\n  status,\n  onChange: onChangeProp,\n  value: valueProp,\n  ...restProps\n}: NativeSelectProps) => {\n  const platform = usePlatform();\n  const [title, setTitle] = React.useState('');\n  const [empty, setEmpty] = React.useState(false);\n  const [value, onChange] = useEnsuredControl({\n    defaultValue,\n    disabled,\n    onChange: onChangeProp,\n    value: valueProp,\n  });\n  const selectRef = useExternRef(getRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  useIsomorphicLayoutEffect(() => {\n    const selectedOption = selectRef.current?.options[selectRef.current.selectedIndex];\n    if (selectedOption) {\n      setTitle(selectedOption.text);\n      setEmpty(selectedOption.value === '' && placeholder != null);\n    }\n  }, [value, children]);\n\n  return (\n    <FormField\n      Component=\"label\"\n      className={classNames(\n        styles['Select'],\n        getPlatformClassName(styles['Select'], platform),\n        empty && styles['Select--empty'],\n        multiline && styles['Select--multiline'],\n        align && styles[`Select--align-${align}`],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        className,\n      )}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={disabled}\n      after={<DropdownIcon />}\n      status={status}\n    >\n      <select\n        {...restProps}\n        disabled={disabled}\n        className={styles['Select__el']}\n        onChange={onChange}\n        value={value}\n        ref={selectRef}\n      >\n        {placeholder && <option value=\"\">{placeholder}</option>}\n        {children}\n      </select>\n      <div className={styles['Select__container']}>\n        <SelectTypography className={styles['Select__title']} selectType={selectType}>\n          {title}\n        </SelectTypography>\n      </div>\n    </FormField>\n  );\n};\n\nexport { NativeSelect };\n"],"mappings":"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"}
+{"version":3,"file":"NativeSelect.js","names":["React","classNames","useAdaptivity","useEnsuredControl","useExternRef","SizeType","useIsomorphicLayoutEffect","DropdownIcon","FormField","SelectTypography","sizeYClassNames","none","COMPACT","NativeSelect","style","defaultValue","align","placeholder","children","className","getRef","getRootRef","disabled","multiline","selectType","status","onChangeProp","onChange","valueProp","value","restProps","useState","title","setTitle","empty","setEmpty","selectRef","sizeY","selectedOption","current","options","selectedIndex","text","styles","REGULAR"],"sources":["../../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport type { SelectType } from '../Select/Select';\nimport { SelectTypography } from '../SelectTypography/SelectTypography';\nimport styles from '../Select/Select.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Select--sizeY-none'],\n  [SizeType.COMPACT]: styles['Select--sizeY-compact'],\n};\n\nexport interface NativeSelectProps\n  extends React.SelectHTMLAttributes<HTMLSelectElement>,\n    HasRef<HTMLSelectElement>,\n    HasRootRef<HTMLLabelElement>,\n    HasAlign,\n    Pick<FormFieldProps, 'status'> {\n  placeholder?: string;\n  multiline?: boolean;\n  selectType?: SelectType;\n}\n\nexport interface SelectState {\n  value?: React.SelectHTMLAttributes<HTMLSelectElement>['value'];\n  title?: string;\n  notSelected?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/NativeSelect\n */\nconst NativeSelect = ({\n  style,\n  defaultValue = '',\n  align,\n  placeholder,\n  children,\n  className,\n  getRef,\n  getRootRef,\n  disabled,\n  multiline,\n  selectType = 'default',\n  status,\n  onChange: onChangeProp,\n  value: valueProp,\n  ...restProps\n}: NativeSelectProps) => {\n  const [title, setTitle] = React.useState('');\n  const [empty, setEmpty] = React.useState(false);\n  const [value, onChange] = useEnsuredControl({\n    defaultValue,\n    disabled,\n    onChange: onChangeProp,\n    value: valueProp,\n  });\n  const selectRef = useExternRef(getRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  useIsomorphicLayoutEffect(() => {\n    const selectedOption = selectRef.current?.options[selectRef.current.selectedIndex];\n    if (selectedOption) {\n      setTitle(selectedOption.text);\n      setEmpty(selectedOption.value === '' && placeholder != null);\n    }\n  }, [value, children]);\n\n  return (\n    <FormField\n      Component=\"label\"\n      className={classNames(\n        styles['Select'],\n        empty && styles['Select--empty'],\n        multiline && styles['Select--multiline'],\n        align && styles[`Select--align-${align}`],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        className,\n      )}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={disabled}\n      after={<DropdownIcon />}\n      status={status}\n    >\n      <select\n        {...restProps}\n        disabled={disabled}\n        className={styles['Select__el']}\n        onChange={onChange}\n        value={value}\n        ref={selectRef}\n      >\n        {placeholder && <option value=\"\">{placeholder}</option>}\n        {children}\n      </select>\n      <div className={styles['Select__container']}>\n        <SelectTypography className={styles['Select__title']} selectType={selectType}>\n          {title}\n        </SelectTypography>\n      </div>\n    </FormField>\n  );\n};\n\nexport { NativeSelect };\n"],"mappings":"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"}

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

@@ -16,16 +16,11 @@ import { Spacing } from '../Spacing/Spacing';
 import { TooltipContainer } from '../Tooltip/TooltipContainer';
 import { Text } from '../Typography/Text/Text';
 import "./PanelHeader.module.css";
-function getPlatformClassName(platform) {
-  switch (platform) {
-    case 'ios':
-      return "vkuiPanelHeader--ios";
-    case 'vkcom':
-      return "vkuiPanelHeader--vkcom";
-    default:
-      return "vkuiPanelHeader--android";
-  }
-}
+var platformClassNames = {
+  ios: "vkuiPanelHeader--ios",
+  android: "vkuiPanelHeader--android",
+  vkcom: "vkuiPanelHeader--vkcom"
+};
 var sizeXClassNames = {
   none: "vkuiPanelHeader--sizeX-none",
   regular: "vkuiPanelHeader--sizeX-regular"
@@ -90,7 +85,7 @@ export var PanelHeader = function PanelHeader(_ref2) {
     adaptiveSizeX = _useAdaptivityConditi.sizeX;
   var isFixed = fixed !== undefined ? fixed : platform !== Platform.VKCOM;
   return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: classNames("vkuiPanelHeader", getPlatformClassName(platform), transparent && "vkuiPanelHeader--trnsp", shadow && "vkuiPanelHeader--shadow", visor && "vkuiPanelHeader--vis", separator && visor && "vkuiPanelHeader--sep", webviewType === WebviewType.VKAPPS && !isInsideModal && "vkuiPanelHeader--vkapps", !before && "vkuiPanelHeader--no-before", !after && "vkuiPanelHeader--no-after", isFixed && "vkuiPanelHeader--fixed", sizeX !== SizeType.COMPACT && sizeXClassNames[sizeX], className),
+    className: classNames("vkuiPanelHeader", platformClassNames.hasOwnProperty(platform) ? platformClassNames[platform] : platformClassNames.android, transparent && "vkuiPanelHeader--trnsp", shadow && "vkuiPanelHeader--shadow", visor && "vkuiPanelHeader--vis", separator && visor && "vkuiPanelHeader--sep", webviewType === WebviewType.VKAPPS && !isInsideModal && "vkuiPanelHeader--vkapps", !before && "vkuiPanelHeader--no-before", !after && "vkuiPanelHeader--no-after", isFixed && "vkuiPanelHeader--fixed", sizeX !== SizeType.COMPACT && sizeXClassNames[sizeX], className),
     ref: isFixed ? getRootRef : getRef
   }), isFixed ? /*#__PURE__*/React.createElement(FixedLayout, {
     className: "vkuiPanelHeader__fixed",

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeader.js","names":["React","classNames","useAdaptivity","useAdaptivityConditionalRender","usePlatform","SizeType","Platform","useConfigProvider","WebviewType","FixedLayout","ModalRootContext","Separator","Spacing","TooltipContainer","Text","getPlatformClassName","platform","sizeXClassNames","none","regular","PanelHeaderIn","before","after","separator","children","webviewType","useContext","isInsideModal","VKCOM","INTERNAL","PanelHeader","visor","transparent","shadow","getRef","getRootRef","fixed","className","restProps","sizeX","adaptiveSizeX","isFixed","undefined","VKAPPS","COMPACT","compact"],"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 { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { useConfigProvider, WebviewType } from '../ConfigProvider/ConfigProviderContext';\nimport { FixedLayout } from '../FixedLayout/FixedLayout';\nimport { ModalRootContext } from '../ModalRoot/ModalRootContext';\nimport { Separator } from '../Separator/Separator';\nimport { Spacing } from '../Spacing/Spacing';\nimport { TooltipContainer } from '../Tooltip/TooltipContainer';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './PanelHeader.module.css';\n\nfunction getPlatformClassName(platform: string): string {\n  switch (platform) {\n    case 'ios':\n      return styles['PanelHeader--ios'];\n    case 'vkcom':\n      return styles['PanelHeader--vkcom'];\n    default:\n      return styles['PanelHeader--android'];\n  }\n}\n\nconst sizeXClassNames = {\n  none: styles['PanelHeader--sizeX-none'],\n  regular: styles['PanelHeader--sizeX-regular'],\n};\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 && (\n        <Separator className={styles['PanelHeader__separator']} wide />\n      )}\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 = 'none' } = 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(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        sizeX !== SizeType.COMPACT && sizeXClassNames[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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"}
+{"version":3,"file":"PanelHeader.js","names":["React","classNames","useAdaptivity","useAdaptivityConditionalRender","usePlatform","SizeType","Platform","useConfigProvider","WebviewType","FixedLayout","ModalRootContext","Separator","Spacing","TooltipContainer","Text","platformClassNames","ios","android","vkcom","sizeXClassNames","none","regular","PanelHeaderIn","before","after","separator","children","webviewType","useContext","isInsideModal","platform","VKCOM","INTERNAL","PanelHeader","visor","transparent","shadow","getRef","getRootRef","fixed","className","restProps","sizeX","adaptiveSizeX","isFixed","undefined","hasOwnProperty","VKAPPS","COMPACT","compact"],"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 { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { useConfigProvider, WebviewType } from '../ConfigProvider/ConfigProviderContext';\nimport { FixedLayout } from '../FixedLayout/FixedLayout';\nimport { ModalRootContext } from '../ModalRoot/ModalRootContext';\nimport { Separator } from '../Separator/Separator';\nimport { Spacing } from '../Spacing/Spacing';\nimport { TooltipContainer } from '../Tooltip/TooltipContainer';\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: styles['PanelHeader--vkcom'],\n};\n\nconst sizeXClassNames = {\n  none: styles['PanelHeader--sizeX-none'],\n  regular: styles['PanelHeader--sizeX-regular'],\n};\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 && (\n        <Separator className={styles['PanelHeader__separator']} wide />\n      )}\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 = 'none' } = 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        platformClassNames.hasOwnProperty(platform)\n          ? platformClassNames[platform]\n          : platformClassNames.android,\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        sizeX !== SizeType.COMPACT && sizeXClassNames[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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"}