@vkontakte/vkui 5.0.3 → 5.1.0

package/dist/cssm/components/Header/Header.js

@@ -2,16 +2,15 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["mode"],
   _excluded2 = ["mode", "children", "subtitle", "indicator", "aside", "getRootRef", "multiline", "className"];
-import * as React from "react";
-import { classNamesString } from "../../lib/classNames";
-import { usePlatform } from "../../hooks/usePlatform";
-import { hasReactNode, isPrimitiveReactNode } from "../../lib/utils";
-import { Platform } from "../../lib/platform";
-import { Headline } from "../Typography/Headline/Headline";
-import { Footnote } from "../Typography/Footnote/Footnote";
-import { Title } from "../Typography/Title/Title";
-import { Text } from "../Typography/Text/Text";
-import { Subhead } from "../Typography/Subhead/Subhead";
+import * as React from 'react';
+import { classNames, hasReactNode, isPrimitiveReactNode } from '@vkontakte/vkjs';
+import { usePlatform } from '../../hooks/usePlatform';
+import { Platform } from '../../lib/platform';
+import { Headline } from '../Typography/Headline/Headline';
+import { Footnote } from '../Typography/Footnote/Footnote';
+import { Title } from '../Typography/Title/Title';
+import { Text } from '../Typography/Text/Text';
+import { Subhead } from '../Typography/Subhead/Subhead';
 import "./Header.module.css";
 var HeaderContent = function HeaderContent(_ref) {
   var mode = _ref.mode,
@@ -19,13 +18,13 @@ var HeaderContent = function HeaderContent(_ref) {
   var platform = usePlatform();
   if (platform === Platform.IOS) {
     switch (mode) {
-      case "primary":
-      case "tertiary":
+      case 'primary':
+      case 'tertiary':
         return /*#__PURE__*/React.createElement(Title, _extends({
           weight: "1",
           level: "3"
         }, restProps));
-      case "secondary":
+      case 'secondary':
         return /*#__PURE__*/React.createElement(Footnote, _extends({
           weight: "2",
           caps: true
@@ -34,22 +33,22 @@ var HeaderContent = function HeaderContent(_ref) {
   }
   if (platform === Platform.VKCOM) {
     switch (mode) {
-      case "primary":
+      case 'primary':
         return /*#__PURE__*/React.createElement(Headline, _extends({
           weight: "3"
         }, restProps));
-      case "secondary":
-      case "tertiary":
+      case 'secondary':
+      case 'tertiary':
         return /*#__PURE__*/React.createElement(Footnote, restProps);
     }
   }
   switch (mode) {
-    case "primary":
-    case "tertiary":
+    case 'primary':
+    case 'tertiary':
       return /*#__PURE__*/React.createElement(Headline, _extends({
         weight: "2"
       }, restProps));
-    case "secondary":
+    case 'secondary':
       return /*#__PURE__*/React.createElement(Footnote, _extends({
         weight: "1",
         caps: true
@@ -63,7 +62,7 @@ var HeaderContent = function HeaderContent(_ref) {
  */
 export var Header = function Header(_ref2) {
   var _ref2$mode = _ref2.mode,
-    mode = _ref2$mode === void 0 ? "primary" : _ref2$mode,
+    mode = _ref2$mode === void 0 ? 'primary' : _ref2$mode,
     children = _ref2.children,
     subtitle = _ref2.subtitle,
     indicator = _ref2.indicator,
@@ -74,10 +73,10 @@ export var Header = function Header(_ref2) {
     restProps = _objectWithoutProperties(_ref2, _excluded2);
   var platform = usePlatform();
   var AsideTypography = platform === Platform.VKCOM ? Subhead : Text;
-  var SubtitleTypography = mode === "secondary" ? Subhead : Footnote;
+  var SubtitleTypography = mode === 'secondary' ? Subhead : Footnote;
   return /*#__PURE__*/React.createElement("header", _extends({}, restProps, {
     ref: getRootRef,
-    className: classNamesString("vkuiHeader", platform === Platform.VKCOM && "vkuiHeader--vkcom", platform === Platform.ANDROID && "vkuiHeader--android", platform === Platform.IOS && "vkuiHeader--ios", styles["Header--mode-".concat(mode)], isPrimitiveReactNode(indicator) && "vkuiHeader--pi", className)
+    className: classNames("vkuiHeader", platform === Platform.VKCOM && "vkuiHeader--vkcom", platform === Platform.ANDROID && "vkuiHeader--android", platform === Platform.IOS && "vkuiHeader--ios", styles["Header--mode-".concat(mode)], isPrimitiveReactNode(indicator) && "vkuiHeader--pi", className)
   }), /*#__PURE__*/React.createElement("div", {
     className: "vkuiHeader__main"
   }, /*#__PURE__*/React.createElement(HeaderContent, {
@@ -85,10 +84,10 @@ export var Header = function Header(_ref2) {
     Component: "span",
     mode: mode
   }, /*#__PURE__*/React.createElement("span", {
-    className: classNamesString("vkuiHeader__content-in", multiline && "vkuiHeader__content-in--multiline")
+    className: classNames("vkuiHeader__content-in", multiline && "vkuiHeader__content-in--multiline")
   }, children), hasReactNode(indicator) && /*#__PURE__*/React.createElement(Footnote, {
     className: "vkuiHeader__indicator",
-    weight: mode === "primary" || mode === "secondary" ? "1" : undefined
+    weight: mode === 'primary' || mode === 'secondary' ? '1' : undefined
   }, indicator)), hasReactNode(subtitle) && /*#__PURE__*/React.createElement(SubtitleTypography, {
     className: "vkuiHeader__subtitle",
     Component: "span"

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

@@ -1 +1 @@
-{"version":3,"file":"Header.js","names":["React","classNamesString","usePlatform","hasReactNode","isPrimitiveReactNode","Platform","Headline","Footnote","Title","Text","Subhead","HeaderContent","mode","restProps","platform","IOS","VKCOM","Header","children","subtitle","indicator","aside","getRootRef","multiline","className","AsideTypography","SubtitleTypography","ANDROID","styles","undefined"],"sources":["../../../../src/components/Header/Header.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { HasComponent, HasRootRef } from \"../../types\";\nimport { hasReactNode, isPrimitiveReactNode } from \"../../lib/utils\";\nimport { Platform } from \"../../lib/platform\";\nimport { Headline } from \"../Typography/Headline/Headline\";\nimport { Footnote } from \"../Typography/Footnote/Footnote\";\nimport { Title } from \"../Typography/Title/Title\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport styles from \"./Header.module.css\";\n\nexport interface HeaderProps\n  extends React.HTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement> {\n  mode?: \"primary\" | \"secondary\" | \"tertiary\";\n  subtitle?: React.ReactNode;\n  /**\n   * Допускаются иконки, текст, Link\n   */\n  aside?: React.ReactNode;\n  /**\n   * Допускаются текст, Indicator\n   */\n  indicator?: React.ReactNode;\n  multiline?: boolean;\n}\n\ntype HeaderContentProps = Pick<HeaderProps, \"children\" | \"mode\" | \"className\"> &\n  HasComponent;\n\nconst HeaderContent = ({ mode, ...restProps }: HeaderContentProps) => {\n  const platform = usePlatform();\n  if (platform === Platform.IOS) {\n    switch (mode) {\n      case \"primary\":\n      case \"tertiary\":\n        return <Title weight=\"1\" level=\"3\" {...restProps} />;\n      case \"secondary\":\n        return <Footnote weight=\"2\" caps {...restProps} />;\n    }\n  }\n\n  if (platform === Platform.VKCOM) {\n    switch (mode) {\n      case \"primary\":\n        return <Headline weight=\"3\" {...restProps} />;\n      case \"secondary\":\n      case \"tertiary\":\n        return <Footnote {...restProps} />;\n    }\n  }\n\n  switch (mode) {\n    case \"primary\":\n    case \"tertiary\":\n      return <Headline weight=\"2\" {...restProps} />;\n    case \"secondary\":\n      return <Footnote weight=\"1\" caps {...restProps} />;\n  }\n\n  return null;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Header\n */\nexport const Header = ({\n  mode = \"primary\",\n  children,\n  subtitle,\n  indicator,\n  aside,\n  getRootRef,\n  multiline,\n  className,\n  ...restProps\n}: HeaderProps) => {\n  const platform = usePlatform();\n\n  const AsideTypography = platform === Platform.VKCOM ? Subhead : Text;\n  const SubtitleTypography = mode === \"secondary\" ? Subhead : Footnote;\n\n  return (\n    <header\n      {...restProps}\n      ref={getRootRef}\n      className={classNamesString(\n        styles[\"Header\"],\n        platform === Platform.VKCOM && styles[\"Header--vkcom\"],\n        platform === Platform.ANDROID && styles[\"Header--android\"],\n        platform === Platform.IOS && styles[\"Header--ios\"],\n        styles[`Header--mode-${mode}`],\n        isPrimitiveReactNode(indicator) && styles[\"Header--pi\"],\n        className\n      )}\n    >\n      <div className={styles[\"Header__main\"]}>\n        <HeaderContent\n          className={styles[\"Header__content\"]}\n          Component=\"span\"\n          mode={mode}\n        >\n          <span\n            className={classNamesString(\n              styles[\"Header__content-in\"],\n              multiline && styles[\"Header__content-in--multiline\"]\n            )}\n          >\n            {children}\n          </span>\n          {hasReactNode(indicator) && (\n            <Footnote\n              className={styles[\"Header__indicator\"]}\n              weight={\n                mode === \"primary\" || mode === \"secondary\" ? \"1\" : undefined\n              }\n            >\n              {indicator}\n            </Footnote>\n          )}\n        </HeaderContent>\n\n        {hasReactNode(subtitle) && (\n          <SubtitleTypography\n            className={styles[\"Header__subtitle\"]}\n            Component=\"span\"\n          >\n            {subtitle}\n          </SubtitleTypography>\n        )}\n      </div>\n\n      {hasReactNode(aside) && (\n        <AsideTypography className={styles[\"Header__aside\"]} Component=\"span\">\n          {aside}\n        </AsideTypography>\n      )}\n    </header>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Header.js","names":["React","classNames","hasReactNode","isPrimitiveReactNode","usePlatform","Platform","Headline","Footnote","Title","Text","Subhead","HeaderContent","mode","restProps","platform","IOS","VKCOM","Header","children","subtitle","indicator","aside","getRootRef","multiline","className","AsideTypography","SubtitleTypography","ANDROID","styles","undefined"],"sources":["../../../../src/components/Header/Header.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode, isPrimitiveReactNode } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { Platform } from '../../lib/platform';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Title } from '../Typography/Title/Title';\nimport { Text } from '../Typography/Text/Text';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './Header.module.css';\n\nexport interface HeaderProps extends React.HTMLAttributes<HTMLElement>, HasRootRef<HTMLElement> {\n  mode?: 'primary' | 'secondary' | 'tertiary';\n  subtitle?: React.ReactNode;\n  /**\n   * Допускаются иконки, текст, Link\n   */\n  aside?: React.ReactNode;\n  /**\n   * Допускаются текст, Indicator\n   */\n  indicator?: React.ReactNode;\n  multiline?: boolean;\n}\n\ntype HeaderContentProps = Pick<HeaderProps, 'children' | 'mode' | 'className'> & HasComponent;\n\nconst HeaderContent = ({ mode, ...restProps }: HeaderContentProps) => {\n  const platform = usePlatform();\n  if (platform === Platform.IOS) {\n    switch (mode) {\n      case 'primary':\n      case 'tertiary':\n        return <Title weight=\"1\" level=\"3\" {...restProps} />;\n      case 'secondary':\n        return <Footnote weight=\"2\" caps {...restProps} />;\n    }\n  }\n\n  if (platform === Platform.VKCOM) {\n    switch (mode) {\n      case 'primary':\n        return <Headline weight=\"3\" {...restProps} />;\n      case 'secondary':\n      case 'tertiary':\n        return <Footnote {...restProps} />;\n    }\n  }\n\n  switch (mode) {\n    case 'primary':\n    case 'tertiary':\n      return <Headline weight=\"2\" {...restProps} />;\n    case 'secondary':\n      return <Footnote weight=\"1\" caps {...restProps} />;\n  }\n\n  return null;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Header\n */\nexport const Header = ({\n  mode = 'primary',\n  children,\n  subtitle,\n  indicator,\n  aside,\n  getRootRef,\n  multiline,\n  className,\n  ...restProps\n}: HeaderProps) => {\n  const platform = usePlatform();\n\n  const AsideTypography = platform === Platform.VKCOM ? Subhead : Text;\n  const SubtitleTypography = mode === 'secondary' ? Subhead : Footnote;\n\n  return (\n    <header\n      {...restProps}\n      ref={getRootRef}\n      className={classNames(\n        styles['Header'],\n        platform === Platform.VKCOM && styles['Header--vkcom'],\n        platform === Platform.ANDROID && styles['Header--android'],\n        platform === Platform.IOS && styles['Header--ios'],\n        styles[`Header--mode-${mode}`],\n        isPrimitiveReactNode(indicator) && styles['Header--pi'],\n        className,\n      )}\n    >\n      <div className={styles['Header__main']}>\n        <HeaderContent className={styles['Header__content']} Component=\"span\" mode={mode}>\n          <span\n            className={classNames(\n              styles['Header__content-in'],\n              multiline && styles['Header__content-in--multiline'],\n            )}\n          >\n            {children}\n          </span>\n          {hasReactNode(indicator) && (\n            <Footnote\n              className={styles['Header__indicator']}\n              weight={mode === 'primary' || mode === 'secondary' ? '1' : undefined}\n            >\n              {indicator}\n            </Footnote>\n          )}\n        </HeaderContent>\n\n        {hasReactNode(subtitle) && (\n          <SubtitleTypography className={styles['Header__subtitle']} Component=\"span\">\n            {subtitle}\n          </SubtitleTypography>\n        )}\n      </div>\n\n      {hasReactNode(aside) && (\n        <AsideTypography className={styles['Header__aside']} Component=\"span\">\n          {aside}\n        </AsideTypography>\n      )}\n    </header>\n  );\n};\n"],"mappings":"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"}

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

@@ -1,7 +1,7 @@
-import * as React from "react";
-import { HasComponent, HasRef, HasRootRef } from "../../types";
+import * as React from 'react';
+import { HasComponent, HasRef, HasRootRef } from '../../types';
 export interface HorizontalCellProps extends React.AnchorHTMLAttributes<HTMLElement>, HasRootRef<HTMLDivElement>, HasRef<HTMLDivElement>, HasComponent {
-    size?: "s" | "m" | "l";
+    size?: 's' | 'm' | 'l';
     header?: React.ReactNode;
     subtitle?: React.ReactNode;
     disabled?: boolean;

package/dist/cssm/components/HorizontalCell/HorizontalCell.js

@@ -2,20 +2,19 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["size", "children"],
   _excluded2 = ["className", "header", "style", "subtitle", "size", "children", "getRootRef", "getRef"];
-import * as React from "react";
-import { classNamesString } from "../../lib/classNames";
-import { hasReactNode } from "../../lib/utils";
-import { Caption } from "../Typography/Caption/Caption";
-import { Tappable } from "../Tappable/Tappable";
-import { Subhead } from "../Typography/Subhead/Subhead";
-import { Footnote } from "../Typography/Footnote/Footnote";
-import { Avatar } from "../Avatar/Avatar";
+import * as React from 'react';
+import { classNames, hasReactNode } from '@vkontakte/vkjs';
+import { Caption } from '../Typography/Caption/Caption';
+import { Tappable } from '../Tappable/Tappable';
+import { Subhead } from '../Typography/Subhead/Subhead';
+import { Footnote } from '../Typography/Footnote/Footnote';
+import { Avatar } from '../Avatar/Avatar';
 import "./HorizontalCell.module.css";
 var CellTypography = function CellTypography(_ref) {
   var size = _ref.size,
     children = _ref.children,
     restProps = _objectWithoutProperties(_ref, _excluded);
-  return size === "s" ? /*#__PURE__*/React.createElement(Caption, restProps, children) : /*#__PURE__*/React.createElement(Subhead, restProps, children);
+  return size === 's' ? /*#__PURE__*/React.createElement(Caption, restProps, children) : /*#__PURE__*/React.createElement(Subhead, restProps, children);
 };
 /**
  * @see https://vkcom.github.io/VKUI/#/HorizontalCell
@@ -26,7 +25,7 @@ export var HorizontalCell = function HorizontalCell(_ref2) {
     style = _ref2.style,
     subtitle = _ref2.subtitle,
     _ref2$size = _ref2.size,
-    size = _ref2$size === void 0 ? "s" : _ref2$size,
+    size = _ref2$size === void 0 ? 's' : _ref2$size,
     _ref2$children = _ref2.children,
     children = _ref2$children === void 0 ? /*#__PURE__*/React.createElement(Avatar, {
       size: 56
@@ -37,7 +36,7 @@ export var HorizontalCell = function HorizontalCell(_ref2) {
   return /*#__PURE__*/React.createElement("div", {
     ref: getRootRef,
     style: style,
-    className: classNamesString("vkuiHorizontalCell", styles["HorizontalCell--size-".concat(size)], className)
+    className: classNames("vkuiHorizontalCell", styles["HorizontalCell--size-".concat(size)], className)
   }, /*#__PURE__*/React.createElement(Tappable, _extends({
     className: "vkuiHorizontalCell__body",
     getRootRef: getRef

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

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCell.js","names":["React","classNamesString","hasReactNode","Caption","Tappable","Subhead","Footnote","Avatar","CellTypography","size","children","restProps","HorizontalCell","className","header","style","subtitle","getRootRef","getRef","styles"],"sources":["../../../../src/components/HorizontalCell/HorizontalCell.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { Caption } from \"../Typography/Caption/Caption\";\nimport { Tappable } from \"../Tappable/Tappable\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { Footnote } from \"../Typography/Footnote/Footnote\";\nimport { Avatar } from \"../Avatar/Avatar\";\nimport { HasComponent, HasRef, HasRootRef } from \"../../types\";\nimport styles from \"./HorizontalCell.module.css\";\n\ninterface CellTypographyProps extends React.HTMLAttributes<HTMLDivElement> {\n  size: HorizontalCellProps[\"size\"];\n}\n\nconst CellTypography = ({\n  size,\n  children,\n  ...restProps\n}: CellTypographyProps) => {\n  return size === \"s\" ? (\n    <Caption {...restProps}>{children}</Caption>\n  ) : (\n    <Subhead {...restProps}>{children}</Subhead>\n  );\n};\n\nexport interface HorizontalCellProps\n  extends React.AnchorHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement>,\n    HasComponent {\n  size?: \"s\" | \"m\" | \"l\";\n  header?: React.ReactNode;\n  subtitle?: React.ReactNode;\n  disabled?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalCell\n */\nexport const HorizontalCell = ({\n  className,\n  header,\n  style,\n  subtitle,\n  size = \"s\",\n  children = <Avatar size={56} />,\n  getRootRef,\n  getRef,\n  ...restProps\n}: HorizontalCellProps) => {\n  return (\n    <div\n      ref={getRootRef}\n      style={style}\n      className={classNamesString(\n        styles[\"HorizontalCell\"],\n        styles[`HorizontalCell--size-${size}`],\n        className\n      )}\n    >\n      <Tappable\n        className={styles[\"HorizontalCell__body\"]}\n        getRootRef={getRef}\n        {...restProps}\n      >\n        {hasReactNode(children) && (\n          <div className={styles[\"HorizontalCell__image\"]}>{children}</div>\n        )}\n        <div className={styles[\"HorizontalCell__content\"]}>\n          {hasReactNode(header) && (\n            <CellTypography\n              size={size}\n              className={styles[\"HorizontalCell__title\"]}\n            >\n              {header}\n            </CellTypography>\n          )}\n          {hasReactNode(subtitle) && (\n            <Footnote className={styles[\"HorizontalCell__subtitle\"]}>\n              {subtitle}\n            </Footnote>\n          )}\n        </div>\n      </Tappable>\n    </div>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,sBAAsB;AACvD,SAASC,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,OAAO,QAAQ,+BAA+B;AACvD,SAASC,QAAQ,QAAQ,sBAAsB;AAC/C,SAASC,OAAO,QAAQ,+BAA+B;AACvD,SAASC,QAAQ,QAAQ,iCAAiC;AAC1D,SAASC,MAAM,QAAQ,kBAAkB;AAAC;AAQ1C,IAAMC,cAAc,GAAG,SAAjBA,cAAc,OAIO;EAAA,IAHzBC,IAAI,QAAJA,IAAI;IACJC,QAAQ,QAARA,QAAQ;IACLC,SAAS;EAEZ,OAAOF,IAAI,KAAK,GAAG,gBACjB,oBAAC,OAAO,EAAKE,SAAS,EAAGD,QAAQ,CAAW,gBAE5C,oBAAC,OAAO,EAAKC,SAAS,EAAGD,QAAQ,CAClC;AACH,CAAC;AAaD;AACA;AACA;AACA,OAAO,IAAME,cAAc,GAAG,SAAjBA,cAAc,QAUA;EAAA,IATzBC,SAAS,SAATA,SAAS;IACTC,MAAM,SAANA,MAAM;IACNC,KAAK,SAALA,KAAK;IACLC,QAAQ,SAARA,QAAQ;IAAA,mBACRP,IAAI;IAAJA,IAAI,2BAAG,GAAG;IAAA,uBACVC,QAAQ;IAARA,QAAQ,4CAAG,oBAAC,MAAM;MAAC,IAAI,EAAE;IAAG,EAAG;IAC/BO,UAAU,SAAVA,UAAU;IACVC,MAAM,SAANA,MAAM;IACHP,SAAS;EAEZ,oBACE;IACE,GAAG,EAAEM,UAAW;IAChB,KAAK,EAAEF,KAAM;IACb,SAAS,EAAEd,gBAAgB,uBAEzBkB,MAAM,gCAAyBV,IAAI,EAAG,EACtCI,SAAS;EACT,gBAEF,oBAAC,QAAQ;IACP,SAAS,4BAAiC;IAC1C,UAAU,EAAEK;EAAO,GACfP,SAAS,GAEZT,YAAY,CAACQ,QAAQ,CAAC,iBACrB;IAAK,SAAS;EAAkC,GAAEA,QAAQ,CAC3D,eACD;IAAK,SAAS;EAAoC,GAC/CR,YAAY,CAACY,MAAM,CAAC,iBACnB,oBAAC,cAAc;IACb,IAAI,EAAEL,IAAK;IACX,SAAS;EAAkC,GAE1CK,MAAM,CAEV,EACAZ,YAAY,CAACc,QAAQ,CAAC,iBACrB,oBAAC,QAAQ;IAAC,SAAS;EAAqC,GACrDA,QAAQ,CAEZ,CACG,CACG,CACP;AAEV,CAAC;AAAC;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"file":"HorizontalCell.js","names":["React","classNames","hasReactNode","Caption","Tappable","Subhead","Footnote","Avatar","CellTypography","size","children","restProps","HorizontalCell","className","header","style","subtitle","getRootRef","getRef","styles"],"sources":["../../../../src/components/HorizontalCell/HorizontalCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Avatar } from '../Avatar/Avatar';\nimport { HasComponent, HasRef, HasRootRef } from '../../types';\nimport styles from './HorizontalCell.module.css';\n\ninterface CellTypographyProps extends React.HTMLAttributes<HTMLDivElement> {\n  size: HorizontalCellProps['size'];\n}\n\nconst CellTypography = ({ size, children, ...restProps }: CellTypographyProps) => {\n  return size === 's' ? (\n    <Caption {...restProps}>{children}</Caption>\n  ) : (\n    <Subhead {...restProps}>{children}</Subhead>\n  );\n};\n\nexport interface HorizontalCellProps\n  extends React.AnchorHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement>,\n    HasComponent {\n  size?: 's' | 'm' | 'l';\n  header?: React.ReactNode;\n  subtitle?: React.ReactNode;\n  disabled?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalCell\n */\nexport const HorizontalCell = ({\n  className,\n  header,\n  style,\n  subtitle,\n  size = 's',\n  children = <Avatar size={56} />,\n  getRootRef,\n  getRef,\n  ...restProps\n}: HorizontalCellProps) => {\n  return (\n    <div\n      ref={getRootRef}\n      style={style}\n      className={classNames(\n        styles['HorizontalCell'],\n        styles[`HorizontalCell--size-${size}`],\n        className,\n      )}\n    >\n      <Tappable className={styles['HorizontalCell__body']} getRootRef={getRef} {...restProps}>\n        {hasReactNode(children) && (\n          <div className={styles['HorizontalCell__image']}>{children}</div>\n        )}\n        <div className={styles['HorizontalCell__content']}>\n          {hasReactNode(header) && (\n            <CellTypography size={size} className={styles['HorizontalCell__title']}>\n              {header}\n            </CellTypography>\n          )}\n          {hasReactNode(subtitle) && (\n            <Footnote className={styles['HorizontalCell__subtitle']}>{subtitle}</Footnote>\n          )}\n        </div>\n      </Tappable>\n    </div>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,OAAO,QAAQ,+BAA+B;AACvD,SAASC,QAAQ,QAAQ,sBAAsB;AAC/C,SAASC,OAAO,QAAQ,+BAA+B;AACvD,SAASC,QAAQ,QAAQ,iCAAiC;AAC1D,SAASC,MAAM,QAAQ,kBAAkB;AAAC;AAQ1C,IAAMC,cAAc,GAAG,SAAjBA,cAAc,OAA8D;EAAA,IAAxDC,IAAI,QAAJA,IAAI;IAAEC,QAAQ,QAARA,QAAQ;IAAKC,SAAS;EACpD,OAAOF,IAAI,KAAK,GAAG,gBACjB,oBAAC,OAAO,EAAKE,SAAS,EAAGD,QAAQ,CAAW,gBAE5C,oBAAC,OAAO,EAAKC,SAAS,EAAGD,QAAQ,CAClC;AACH,CAAC;AAaD;AACA;AACA;AACA,OAAO,IAAME,cAAc,GAAG,SAAjBA,cAAc,QAUA;EAAA,IATzBC,SAAS,SAATA,SAAS;IACTC,MAAM,SAANA,MAAM;IACNC,KAAK,SAALA,KAAK;IACLC,QAAQ,SAARA,QAAQ;IAAA,mBACRP,IAAI;IAAJA,IAAI,2BAAG,GAAG;IAAA,uBACVC,QAAQ;IAARA,QAAQ,4CAAG,oBAAC,MAAM;MAAC,IAAI,EAAE;IAAG,EAAG;IAC/BO,UAAU,SAAVA,UAAU;IACVC,MAAM,SAANA,MAAM;IACHP,SAAS;EAEZ,oBACE;IACE,GAAG,EAAEM,UAAW;IAChB,KAAK,EAAEF,KAAM;IACb,SAAS,EAAEd,UAAU,uBAEnBkB,MAAM,gCAAyBV,IAAI,EAAG,EACtCI,SAAS;EACT,gBAEF,oBAAC,QAAQ;IAAC,SAAS,4BAAiC;IAAC,UAAU,EAAEK;EAAO,GAAKP,SAAS,GACnFT,YAAY,CAACQ,QAAQ,CAAC,iBACrB;IAAK,SAAS;EAAkC,GAAEA,QAAQ,CAC3D,eACD;IAAK,SAAS;EAAoC,GAC/CR,YAAY,CAACY,MAAM,CAAC,iBACnB,oBAAC,cAAc;IAAC,IAAI,EAAEL,IAAK;IAAC,SAAS;EAAkC,GACpEK,MAAM,CAEV,EACAZ,YAAY,CAACc,QAAQ,CAAC,iBACrB,oBAAC,QAAQ;IAAC,SAAS;EAAqC,GAAEA,QAAQ,CACnE,CACG,CACG,CACP;AAEV,CAAC;AAAC;EAAA;EAAA;EAAA;AAAA"}

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

@@ -1,5 +1,5 @@
-import * as React from "react";
-import { HasRef } from "../../types";
+import * as React from 'react';
+import { HasRef } from '../../types';
 export declare type ScrollPositionHandler = (currentPosition: number) => number;
 export interface HorizontalScrollProps extends React.HTMLAttributes<HTMLDivElement>, HasRef<HTMLDivElement> {
     /**
@@ -10,8 +10,8 @@ export interface HorizontalScrollProps extends React.HTMLAttributes<HTMLDivEleme
      * Функция для расчета величины прокрутки при клике на правую стрелку.
      */
     getScrollToRight?: ScrollPositionHandler;
-    arrowSize?: "m" | "l";
-    showArrows?: boolean | "always";
+    arrowSize?: 'm' | 'l';
+    showArrows?: boolean | 'always';
     scrollAnimationDuration?: number;
 }
 /**

package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js

@@ -2,13 +2,13 @@ import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "getScrollToLeft", "getScrollToRight", "showArrows", "arrowSize", "scrollAnimationDuration", "getRef", "className"];
-import * as React from "react";
-import { useAdaptivityHasPointer } from "../../hooks/useAdaptivityHasPointer";
-import { HorizontalScrollArrow } from "./HorizontalScrollArrow";
-import { easeInOutSine } from "../../lib/fx";
-import { useEventListener } from "../../hooks/useEventListener";
-import { useExternRef } from "../../hooks/useExternRef";
-import { classNamesString } from "../../lib/classNames";
+import * as React from 'react';
+import { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';
+import { HorizontalScrollArrow } from './HorizontalScrollArrow';
+import { easeInOutSine } from '../../lib/fx';
+import { useEventListener } from '../../hooks/useEventListener';
+import { useExternRef } from '../../hooks/useExternRef';
+import { classNames } from '@vkontakte/vkjs';
 import "./HorizontalScroll.module.css";
 /**
  * timing method
@@ -89,7 +89,7 @@ export var HorizontalScroll = function HorizontalScroll(_ref2) {
     _ref2$showArrows = _ref2.showArrows,
     showArrows = _ref2$showArrows === void 0 ? true : _ref2$showArrows,
     _ref2$arrowSize = _ref2.arrowSize,
-    arrowSize = _ref2$arrowSize === void 0 ? "l" : _ref2$arrowSize,
+    arrowSize = _ref2$arrowSize === void 0 ? 'l' : _ref2$arrowSize,
     _ref2$scrollAnimation = _ref2.scrollAnimationDuration,
     scrollAnimationDuration = _ref2$scrollAnimation === void 0 ? SCROLL_ONE_FRAME_TIME : _ref2$scrollAnimation,
     getRef = _ref2.getRef,
@@ -151,7 +151,7 @@ export var HorizontalScroll = function HorizontalScroll(_ref2) {
       setCanScrollRight(roundUpElementScrollLeft(scrollElement) + scrollElement.offsetWidth < scrollElement.scrollWidth);
     }
   }, [hasPointer, scrollerRef, showArrows]);
-  var scrollEvent = useEventListener("scroll", onscroll);
+  var scrollEvent = useEventListener('scroll', onscroll);
   React.useEffect(function () {
     if (scrollerRef.current) {
       scrollEvent.add(scrollerRef.current);
@@ -159,8 +159,13 @@ export var HorizontalScroll = function HorizontalScroll(_ref2) {
   }, [scrollEvent, scrollerRef]);
   React.useEffect(onscroll, [scrollerRef, children, onscroll]);
   return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: classNamesString("vkuiHorizontalScroll", showArrows === "always" && "vkuiHorizontalScroll--withConstArrows", className)
-  }), showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && /*#__PURE__*/React.createElement(HorizontalScrollArrow, {
+    className: classNames("vkuiHorizontalScroll", showArrows === 'always' && "vkuiHorizontalScroll--withConstArrows", className)
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "vkuiHorizontalScroll__in",
+    ref: scrollerRef
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "vkuiHorizontalScroll__in-wrapper"
+  }, children)), showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && /*#__PURE__*/React.createElement(HorizontalScrollArrow, {
     size: arrowSize,
     direction: "left",
     className: "vkuiHorizontalScroll__arrowLeft",
@@ -170,11 +175,6 @@ export var HorizontalScroll = function HorizontalScroll(_ref2) {
     direction: "right",
     className: "vkuiHorizontalScroll__arrowRight",
     onClick: scrollToRight
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "vkuiHorizontalScroll__in",
-    ref: scrollerRef
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "vkuiHorizontalScroll__in-wrapper"
-  }, children)));
+  }));
 };
 //# sourceMappingURL=HorizontalScroll.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"HorizontalScroll.js","names":["React","useAdaptivityHasPointer","HorizontalScrollArrow","easeInOutSine","useEventListener","useExternRef","classNamesString","now","performance","Date","roundUpElementScrollLeft","el","Math","ceil","scrollLeft","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToRightBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","maxLeft","offsetWidth","startLeft","endLeft","startTime","scroll","time","elapsed","min","value","currentLeft","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","getRef","className","restProps","useState","canScrollLeft","setCanScrollLeft","canScrollRight","setCanScrollRight","isCustomScrollingRef","useRef","scrollerRef","hasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","onscroll","scrollEvent","useEffect","add","undefined"],"sources":["../../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { useAdaptivityHasPointer } from \"../../hooks/useAdaptivityHasPointer\";\nimport { HorizontalScrollArrow } from \"./HorizontalScrollArrow\";\nimport { easeInOutSine } from \"../../lib/fx\";\nimport { useEventListener } from \"../../hooks/useEventListener\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { HasRef } from \"../../types\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport styles from \"./HorizontalScroll.module.css\";\n\ninterface ScrollContext {\n  scrollElement: HTMLElement | null;\n  scrollAnimationDuration: number;\n  animationQueue: VoidFunction[];\n  getScrollPosition: (currentPosition: number) => number;\n  onScrollToRightBorder: VoidFunction;\n  onScrollEnd: VoidFunction;\n  onScrollStart: VoidFunction;\n  /**\n   * Начальная ширина прокрутки.\n   * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n   */\n  initialScrollWidth: number;\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Функция для расчета величины прокрутки при клике на левую стрелку.\n   */\n  getScrollToLeft?: ScrollPositionHandler;\n  /**\n   * Функция для расчета величины прокрутки при клике на правую стрелку.\n   */\n  getScrollToRight?: ScrollPositionHandler;\n  arrowSize?: \"m\" | \"l\";\n  showArrows?: boolean | \"always\";\n  scrollAnimationDuration?: number;\n}\n\n/**\n * timing method\n */\nfunction now() {\n  return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Округляем el.scrollLeft\n * https://github.com/VKCOM/VKUI/pull/2445\n */\nconst roundUpElementScrollLeft = (el: HTMLElement) => Math.ceil(el.scrollLeft);\n\n/**\n * Код анимации скрола, на основе полифила: https://github.com/iamdustan/smoothscroll\n * Константа взята из полифила (468), на дизайн-ревью уточнили до 250\n * @var {number} SCROLL_ONE_FRAME_TIME время анимации скролла\n */\nconst SCROLL_ONE_FRAME_TIME = 250;\n\nfunction doScroll({\n  scrollElement,\n  getScrollPosition,\n  animationQueue,\n  onScrollToRightBorder,\n  onScrollEnd,\n  onScrollStart,\n  initialScrollWidth,\n  scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n}: ScrollContext) {\n  if (!scrollElement || !getScrollPosition) {\n    return;\n  }\n\n  /**\n   * максимальное значение сдвига влево\n   */\n  const maxLeft = initialScrollWidth - scrollElement.offsetWidth;\n\n  let startLeft = roundUpElementScrollLeft(scrollElement);\n  let endLeft = getScrollPosition(startLeft);\n\n  onScrollStart();\n\n  if (endLeft >= maxLeft) {\n    onScrollToRightBorder();\n    endLeft = maxLeft;\n  }\n\n  const startTime = now();\n\n  (function scroll() {\n    if (!scrollElement) {\n      onScrollEnd();\n      return;\n    }\n\n    const time = now();\n    const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n    const value = easeInOutSine(elapsed);\n\n    const currentLeft = startLeft + (endLeft - startLeft) * value;\n    scrollElement.scrollLeft = Math.ceil(currentLeft);\n\n    if (\n      roundUpElementScrollLeft(scrollElement) !== Math.max(0, endLeft) &&\n      elapsed !== 1\n    ) {\n      requestAnimationFrame(scroll);\n      return;\n    }\n\n    onScrollEnd();\n    animationQueue.shift();\n    if (animationQueue.length > 0) {\n      animationQueue[0]();\n    }\n  })();\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalScroll\n */\nexport const HorizontalScroll = ({\n  children,\n  getScrollToLeft,\n  getScrollToRight,\n  showArrows = true,\n  arrowSize = \"l\",\n  scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n  getRef,\n  className,\n  ...restProps\n}: HorizontalScrollProps) => {\n  const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n  const [canScrollRight, setCanScrollRight] = React.useState(false);\n\n  const isCustomScrollingRef = React.useRef(false);\n\n  const scrollerRef = useExternRef(getRef);\n\n  const animationQueue = React.useRef<VoidFunction[]>([]);\n\n  const hasPointer = useAdaptivityHasPointer();\n\n  const scrollTo = React.useCallback(\n    (getScrollPosition: ScrollPositionHandler) => {\n      const scrollElement = scrollerRef.current;\n\n      animationQueue.current.push(() =>\n        doScroll({\n          scrollElement,\n          getScrollPosition,\n          animationQueue: animationQueue.current,\n          onScrollToRightBorder: () => setCanScrollRight(false),\n          onScrollEnd: () => (isCustomScrollingRef.current = false),\n          onScrollStart: () => (isCustomScrollingRef.current = true),\n          initialScrollWidth:\n            scrollElement?.firstElementChild?.scrollWidth || 0,\n          scrollAnimationDuration,\n        })\n      );\n      if (animationQueue.current.length === 1) {\n        animationQueue.current[0]();\n      }\n    },\n    [scrollAnimationDuration, scrollerRef]\n  );\n\n  const scrollToLeft = React.useCallback(() => {\n    const getScrollPosition =\n      getScrollToLeft ?? ((i: number) => i - scrollerRef.current!.offsetWidth);\n    scrollTo(getScrollPosition);\n  }, [getScrollToLeft, scrollTo, scrollerRef]);\n\n  const scrollToRight = React.useCallback(() => {\n    const getScrollPosition =\n      getScrollToRight ?? ((i: number) => i + scrollerRef.current!.offsetWidth);\n    scrollTo(getScrollPosition);\n  }, [getScrollToRight, scrollTo, scrollerRef]);\n\n  const onscroll = React.useCallback(() => {\n    if (\n      showArrows &&\n      hasPointer &&\n      scrollerRef.current &&\n      !isCustomScrollingRef.current\n    ) {\n      const scrollElement = scrollerRef.current;\n\n      setCanScrollLeft(scrollElement.scrollLeft > 0);\n      setCanScrollRight(\n        roundUpElementScrollLeft(scrollElement) + scrollElement.offsetWidth <\n          scrollElement.scrollWidth\n      );\n    }\n  }, [hasPointer, scrollerRef, showArrows]);\n\n  const scrollEvent = useEventListener(\"scroll\", onscroll);\n  React.useEffect(() => {\n    if (scrollerRef.current) {\n      scrollEvent.add(scrollerRef.current);\n    }\n  }, [scrollEvent, scrollerRef]);\n  React.useEffect(onscroll, [scrollerRef, children, onscroll]);\n\n  return (\n    <div\n      {...restProps}\n      className={classNamesString(\n        styles[\"HorizontalScroll\"],\n        showArrows === \"always\" && styles[\"HorizontalScroll--withConstArrows\"],\n        className\n      )}\n    >\n      {showArrows &&\n        (hasPointer || hasPointer === undefined) &&\n        canScrollLeft && (\n          <HorizontalScrollArrow\n            size={arrowSize}\n            direction=\"left\"\n            className={styles[\"HorizontalScroll__arrowLeft\"]}\n            onClick={scrollToLeft}\n          />\n        )}\n      {showArrows &&\n        (hasPointer || hasPointer === undefined) &&\n        canScrollRight && (\n          <HorizontalScrollArrow\n            size={arrowSize}\n            direction=\"right\"\n            className={styles[\"HorizontalScroll__arrowRight\"]}\n            onClick={scrollToRight}\n          />\n        )}\n      <div className={styles[\"HorizontalScroll__in\"]} ref={scrollerRef}>\n        <div className={styles[\"HorizontalScroll__in-wrapper\"]}>{children}</div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"HorizontalScroll.js","names":["React","useAdaptivityHasPointer","HorizontalScrollArrow","easeInOutSine","useEventListener","useExternRef","classNames","now","performance","Date","roundUpElementScrollLeft","el","Math","ceil","scrollLeft","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToRightBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","maxLeft","offsetWidth","startLeft","endLeft","startTime","scroll","time","elapsed","min","value","currentLeft","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","getRef","className","restProps","useState","canScrollLeft","setCanScrollLeft","canScrollRight","setCanScrollRight","isCustomScrollingRef","useRef","scrollerRef","hasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","onscroll","scrollEvent","useEffect","add","undefined"],"sources":["../../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { HorizontalScrollArrow } from './HorizontalScrollArrow';\nimport { easeInOutSine } from '../../lib/fx';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { HasRef } from '../../types';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './HorizontalScroll.module.css';\n\ninterface ScrollContext {\n  scrollElement: HTMLElement | null;\n  scrollAnimationDuration: number;\n  animationQueue: VoidFunction[];\n  getScrollPosition: (currentPosition: number) => number;\n  onScrollToRightBorder: VoidFunction;\n  onScrollEnd: VoidFunction;\n  onScrollStart: VoidFunction;\n  /**\n   * Начальная ширина прокрутки.\n   * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n   */\n  initialScrollWidth: number;\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Функция для расчета величины прокрутки при клике на левую стрелку.\n   */\n  getScrollToLeft?: ScrollPositionHandler;\n  /**\n   * Функция для расчета величины прокрутки при клике на правую стрелку.\n   */\n  getScrollToRight?: ScrollPositionHandler;\n  arrowSize?: 'm' | 'l';\n  showArrows?: boolean | 'always';\n  scrollAnimationDuration?: number;\n}\n\n/**\n * timing method\n */\nfunction now() {\n  return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Округляем el.scrollLeft\n * https://github.com/VKCOM/VKUI/pull/2445\n */\nconst roundUpElementScrollLeft = (el: HTMLElement) => Math.ceil(el.scrollLeft);\n\n/**\n * Код анимации скрола, на основе полифила: https://github.com/iamdustan/smoothscroll\n * Константа взята из полифила (468), на дизайн-ревью уточнили до 250\n * @var {number} SCROLL_ONE_FRAME_TIME время анимации скролла\n */\nconst SCROLL_ONE_FRAME_TIME = 250;\n\nfunction doScroll({\n  scrollElement,\n  getScrollPosition,\n  animationQueue,\n  onScrollToRightBorder,\n  onScrollEnd,\n  onScrollStart,\n  initialScrollWidth,\n  scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n}: ScrollContext) {\n  if (!scrollElement || !getScrollPosition) {\n    return;\n  }\n\n  /**\n   * максимальное значение сдвига влево\n   */\n  const maxLeft = initialScrollWidth - scrollElement.offsetWidth;\n\n  let startLeft = roundUpElementScrollLeft(scrollElement);\n  let endLeft = getScrollPosition(startLeft);\n\n  onScrollStart();\n\n  if (endLeft >= maxLeft) {\n    onScrollToRightBorder();\n    endLeft = maxLeft;\n  }\n\n  const startTime = now();\n\n  (function scroll() {\n    if (!scrollElement) {\n      onScrollEnd();\n      return;\n    }\n\n    const time = now();\n    const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n    const value = easeInOutSine(elapsed);\n\n    const currentLeft = startLeft + (endLeft - startLeft) * value;\n    scrollElement.scrollLeft = Math.ceil(currentLeft);\n\n    if (roundUpElementScrollLeft(scrollElement) !== Math.max(0, endLeft) && elapsed !== 1) {\n      requestAnimationFrame(scroll);\n      return;\n    }\n\n    onScrollEnd();\n    animationQueue.shift();\n    if (animationQueue.length > 0) {\n      animationQueue[0]();\n    }\n  })();\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalScroll\n */\nexport const HorizontalScroll = ({\n  children,\n  getScrollToLeft,\n  getScrollToRight,\n  showArrows = true,\n  arrowSize = 'l',\n  scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n  getRef,\n  className,\n  ...restProps\n}: HorizontalScrollProps) => {\n  const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n  const [canScrollRight, setCanScrollRight] = React.useState(false);\n\n  const isCustomScrollingRef = React.useRef(false);\n\n  const scrollerRef = useExternRef(getRef);\n\n  const animationQueue = React.useRef<VoidFunction[]>([]);\n\n  const hasPointer = useAdaptivityHasPointer();\n\n  const scrollTo = React.useCallback(\n    (getScrollPosition: ScrollPositionHandler) => {\n      const scrollElement = scrollerRef.current;\n\n      animationQueue.current.push(() =>\n        doScroll({\n          scrollElement,\n          getScrollPosition,\n          animationQueue: animationQueue.current,\n          onScrollToRightBorder: () => setCanScrollRight(false),\n          onScrollEnd: () => (isCustomScrollingRef.current = false),\n          onScrollStart: () => (isCustomScrollingRef.current = true),\n          initialScrollWidth: scrollElement?.firstElementChild?.scrollWidth || 0,\n          scrollAnimationDuration,\n        }),\n      );\n      if (animationQueue.current.length === 1) {\n        animationQueue.current[0]();\n      }\n    },\n    [scrollAnimationDuration, scrollerRef],\n  );\n\n  const scrollToLeft = React.useCallback(() => {\n    const getScrollPosition =\n      getScrollToLeft ?? ((i: number) => i - scrollerRef.current!.offsetWidth);\n    scrollTo(getScrollPosition);\n  }, [getScrollToLeft, scrollTo, scrollerRef]);\n\n  const scrollToRight = React.useCallback(() => {\n    const getScrollPosition =\n      getScrollToRight ?? ((i: number) => i + scrollerRef.current!.offsetWidth);\n    scrollTo(getScrollPosition);\n  }, [getScrollToRight, scrollTo, scrollerRef]);\n\n  const onscroll = React.useCallback(() => {\n    if (showArrows && hasPointer && scrollerRef.current && !isCustomScrollingRef.current) {\n      const scrollElement = scrollerRef.current;\n\n      setCanScrollLeft(scrollElement.scrollLeft > 0);\n      setCanScrollRight(\n        roundUpElementScrollLeft(scrollElement) + scrollElement.offsetWidth <\n          scrollElement.scrollWidth,\n      );\n    }\n  }, [hasPointer, scrollerRef, showArrows]);\n\n  const scrollEvent = useEventListener('scroll', onscroll);\n  React.useEffect(() => {\n    if (scrollerRef.current) {\n      scrollEvent.add(scrollerRef.current);\n    }\n  }, [scrollEvent, scrollerRef]);\n  React.useEffect(onscroll, [scrollerRef, children, onscroll]);\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        styles['HorizontalScroll'],\n        showArrows === 'always' && styles['HorizontalScroll--withConstArrows'],\n        className,\n      )}\n    >\n      <div className={styles['HorizontalScroll__in']} ref={scrollerRef}>\n        <div className={styles['HorizontalScroll__in-wrapper']}>{children}</div>\n      </div>\n      {showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && (\n        <HorizontalScrollArrow\n          size={arrowSize}\n          direction=\"left\"\n          className={styles['HorizontalScroll__arrowLeft']}\n          onClick={scrollToLeft}\n        />\n      )}\n      {showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && (\n        <HorizontalScrollArrow\n          size={arrowSize}\n          direction=\"right\"\n          className={styles['HorizontalScroll__arrowRight']}\n          onClick={scrollToRight}\n        />\n      )}\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.d.ts

@@ -1,7 +1,7 @@
-import * as React from "react";
+import * as React from 'react';
 export interface HorizontalScrollArrowProps {
-    direction: "left" | "right";
-    size?: "m" | "l";
+    direction: 'left' | 'right';
+    size?: 'm' | 'l';
     onClick(event: React.MouseEvent): void;
     className?: string;
 }

package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.js

@@ -1,29 +1,29 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["size", "direction", "onClick", "className"];
-import * as React from "react";
-import { Icon24Chevron, Icon24ChevronCompactLeft, Icon16Chevron, Icon16ChevronLeft } from "@vkontakte/icons";
-import { classNamesString } from "../../lib/classNames";
-import { Tappable } from "../Tappable/Tappable";
+import * as React from 'react';
+import { Icon24Chevron, Icon24ChevronCompactLeft, Icon16Chevron, Icon16ChevronLeft } from '@vkontakte/icons';
+import { classNames } from '@vkontakte/vkjs';
+import { Tappable } from '../Tappable/Tappable';
 import "./HorizontalScrollArrow.module.css";
 export var HorizontalScrollArrow = function HorizontalScrollArrow(_ref) {
   var _ref$size = _ref.size,
-    size = _ref$size === void 0 ? "l" : _ref$size,
+    size = _ref$size === void 0 ? 'l' : _ref$size,
     direction = _ref.direction,
     onClick = _ref.onClick,
     className = _ref.className,
     restProps = _objectWithoutProperties(_ref, _excluded);
   var ArrowIcon;
-  if (size === "m") {
-    ArrowIcon = direction === "left" ? Icon16ChevronLeft : Icon16Chevron;
+  if (size === 'm') {
+    ArrowIcon = direction === 'left' ? Icon16ChevronLeft : Icon16Chevron;
   } else {
-    ArrowIcon = direction === "left" ? Icon24ChevronCompactLeft : Icon24Chevron;
+    ArrowIcon = direction === 'left' ? Icon24ChevronCompactLeft : Icon24Chevron;
   }
   return /*#__PURE__*/React.createElement(Tappable, _extends({}, restProps, {
     Component: "button",
     hasHover: false,
     hasActive: false,
-    className: classNamesString("vkuiHorizontalScrollArrow", styles["HorizontalScrollArrow--size-".concat(size)], styles["HorizontalScrollArrow--direction-".concat(direction)], className),
+    className: classNames("vkuiHorizontalScrollArrow", styles["HorizontalScrollArrow--size-".concat(size)], styles["HorizontalScrollArrow--direction-".concat(direction)], className),
     onClick: onClick
   }), /*#__PURE__*/React.createElement("span", {
     className: "vkuiHorizontalScrollArrow__icon"

package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.js.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalScrollArrow.js","names":["React","Icon24Chevron","Icon24ChevronCompactLeft","Icon16Chevron","Icon16ChevronLeft","classNamesString","Tappable","HorizontalScrollArrow","size","direction","onClick","className","restProps","ArrowIcon","styles"],"sources":["../../../../src/components/HorizontalScroll/HorizontalScrollArrow.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {\n  Icon24Chevron,\n  Icon24ChevronCompactLeft,\n  Icon16Chevron,\n  Icon16ChevronLeft,\n} from \"@vkontakte/icons\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { Tappable } from \"../Tappable/Tappable\";\nimport styles from \"./HorizontalScrollArrow.module.css\";\n\nexport interface HorizontalScrollArrowProps {\n  direction: \"left\" | \"right\";\n  size?: \"m\" | \"l\";\n  onClick(event: React.MouseEvent): void;\n  className?: string;\n}\n\nexport const HorizontalScrollArrow = ({\n  size = \"l\",\n  direction,\n  onClick,\n  className,\n  ...restProps\n}: HorizontalScrollArrowProps) => {\n  let ArrowIcon: React.ComponentType<unknown>;\n\n  if (size === \"m\") {\n    ArrowIcon = direction === \"left\" ? Icon16ChevronLeft : Icon16Chevron;\n  } else {\n    ArrowIcon = direction === \"left\" ? Icon24ChevronCompactLeft : Icon24Chevron;\n  }\n\n  return (\n    <Tappable\n      {...restProps}\n      Component=\"button\"\n      hasHover={false}\n      hasActive={false}\n      className={classNamesString(\n        styles[\"HorizontalScrollArrow\"],\n        styles[`HorizontalScrollArrow--size-${size}`],\n        styles[`HorizontalScrollArrow--direction-${direction}`],\n        className\n      )}\n      onClick={onClick}\n    >\n      <span className={styles[\"HorizontalScrollArrow__icon\"]}>\n        <ArrowIcon />\n      </span>\n    </Tappable>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SACEC,aAAa,EACbC,wBAAwB,EACxBC,aAAa,EACbC,iBAAiB,QACZ,kBAAkB;AACzB,SAASC,gBAAgB,QAAQ,sBAAsB;AACvD,SAASC,QAAQ,QAAQ,sBAAsB;AAAC;AAUhD,OAAO,IAAMC,qBAAqB,GAAG,SAAxBA,qBAAqB,OAMA;EAAA,qBALhCC,IAAI;IAAJA,IAAI,0BAAG,GAAG;IACVC,SAAS,QAATA,SAAS;IACTC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAIC,SAAuC;EAE3C,IAAIL,IAAI,KAAK,GAAG,EAAE;IAChBK,SAAS,GAAGJ,SAAS,KAAK,MAAM,GAAGL,iBAAiB,GAAGD,aAAa;EACtE,CAAC,MAAM;IACLU,SAAS,GAAGJ,SAAS,KAAK,MAAM,GAAGP,wBAAwB,GAAGD,aAAa;EAC7E;EAEA,oBACE,oBAAC,QAAQ,eACHW,SAAS;IACb,SAAS,EAAC,QAAQ;IAClB,QAAQ,EAAE,KAAM;IAChB,SAAS,EAAE,KAAM;IACjB,SAAS,EAAEP,gBAAgB,8BAEzBS,MAAM,uCAAgCN,IAAI,EAAG,EAC7CM,MAAM,4CAAqCL,SAAS,EAAG,EACvDE,SAAS,CACT;IACF,OAAO,EAAED;EAAQ,iBAEjB;IAAM,SAAS;EAAwC,gBACrD,oBAAC,SAAS,OAAG,CACR,CACE;AAEf,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"file":"HorizontalScrollArrow.js","names":["React","Icon24Chevron","Icon24ChevronCompactLeft","Icon16Chevron","Icon16ChevronLeft","classNames","Tappable","HorizontalScrollArrow","size","direction","onClick","className","restProps","ArrowIcon","styles"],"sources":["../../../../src/components/HorizontalScroll/HorizontalScrollArrow.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon24Chevron,\n  Icon24ChevronCompactLeft,\n  Icon16Chevron,\n  Icon16ChevronLeft,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { Tappable } from '../Tappable/Tappable';\nimport styles from './HorizontalScrollArrow.module.css';\n\nexport interface HorizontalScrollArrowProps {\n  direction: 'left' | 'right';\n  size?: 'm' | 'l';\n  onClick(event: React.MouseEvent): void;\n  className?: string;\n}\n\nexport const HorizontalScrollArrow = ({\n  size = 'l',\n  direction,\n  onClick,\n  className,\n  ...restProps\n}: HorizontalScrollArrowProps) => {\n  let ArrowIcon: React.ComponentType<unknown>;\n\n  if (size === 'm') {\n    ArrowIcon = direction === 'left' ? Icon16ChevronLeft : Icon16Chevron;\n  } else {\n    ArrowIcon = direction === 'left' ? Icon24ChevronCompactLeft : Icon24Chevron;\n  }\n\n  return (\n    <Tappable\n      {...restProps}\n      Component=\"button\"\n      hasHover={false}\n      hasActive={false}\n      className={classNames(\n        styles['HorizontalScrollArrow'],\n        styles[`HorizontalScrollArrow--size-${size}`],\n        styles[`HorizontalScrollArrow--direction-${direction}`],\n        className,\n      )}\n      onClick={onClick}\n    >\n      <span className={styles['HorizontalScrollArrow__icon']}>\n        <ArrowIcon />\n      </span>\n    </Tappable>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SACEC,aAAa,EACbC,wBAAwB,EACxBC,aAAa,EACbC,iBAAiB,QACZ,kBAAkB;AACzB,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,QAAQ,QAAQ,sBAAsB;AAAC;AAUhD,OAAO,IAAMC,qBAAqB,GAAG,SAAxBA,qBAAqB,OAMA;EAAA,qBALhCC,IAAI;IAAJA,IAAI,0BAAG,GAAG;IACVC,SAAS,QAATA,SAAS;IACTC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAIC,SAAuC;EAE3C,IAAIL,IAAI,KAAK,GAAG,EAAE;IAChBK,SAAS,GAAGJ,SAAS,KAAK,MAAM,GAAGL,iBAAiB,GAAGD,aAAa;EACtE,CAAC,MAAM;IACLU,SAAS,GAAGJ,SAAS,KAAK,MAAM,GAAGP,wBAAwB,GAAGD,aAAa;EAC7E;EAEA,oBACE,oBAAC,QAAQ,eACHW,SAAS;IACb,SAAS,EAAC,QAAQ;IAClB,QAAQ,EAAE,KAAM;IAChB,SAAS,EAAE,KAAM;IACjB,SAAS,EAAEP,UAAU,8BAEnBS,MAAM,uCAAgCN,IAAI,EAAG,EAC7CM,MAAM,4CAAqCL,SAAS,EAAG,EACvDE,SAAS,CACT;IACF,OAAO,EAAED;EAAQ,iBAEjB;IAAM,SAAS;EAAwC,gBACrD,oBAAC,SAAS,OAAG,CACR,CACE;AAEf,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;AAAA"}

package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.module.css

@@ -1 +1 @@
-.vkuiHorizontalScrollArrow{background-color:initial;border:none;cursor:pointer;display:flex;flex-direction:column;height:100%;justify-content:center;opacity:0;padding:0;position:absolute;top:0;transition:opacity .15s;transition-timing-function:var(--vkui--animation_easing_platform);-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto;z-index:3}.vkuiHorizontalScrollArrow__icon{align-items:center;background-color:var(--vkui--color_background_modal);box-shadow:var(--vkui--elevation3);color:var(--vkui--color_icon_secondary);display:flex;justify-content:center}.vkuiHorizontalScrollArrow--size-m .vkuiHorizontalScrollArrow__icon{border-radius:14px;height:28px;width:28px}.vkuiHorizontalScrollArrow--size-l .vkuiHorizontalScrollArrow__icon{border-radius:24px;height:40px;width:40px}.vkuiHorizontalScrollArrow--direction-left{left:0;padding-left:16px;padding-left:var(--vkui--size_base_padding_horizontal--regular,16px)}.vkuiHorizontalScrollArrow--direction-right{padding-right:16px;padding-right:var(--vkui--size_base_padding_horizontal--regular,16px);right:0}.vkuiBaseGallery:hover .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll:hover .vkuiHorizontalScrollArrow{opacity:var(--vkui--opacity_disable_accessibility)}.vkuiBaseGallery:hover .vkuiHorizontalScrollArrow:hover,.vkuiHorizontalScroll--withConstArrows .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll--withConstArrows:hover .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll:hover .vkuiHorizontalScrollArrow:hover{opacity:1}
+.vkuiHorizontalScrollArrow{background-color:initial;border:none;cursor:pointer;display:flex;flex-direction:column;height:100%;justify-content:center;opacity:0;padding:0;position:absolute;top:0;transition:opacity .15s;transition-timing-function:var(--vkui--animation_easing_platform);-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.vkuiHorizontalScrollArrow__icon{align-items:center;background-color:var(--vkui--color_background_modal);box-shadow:var(--vkui--elevation3);color:var(--vkui--color_icon_secondary);display:flex;justify-content:center}.vkuiHorizontalScrollArrow--size-m .vkuiHorizontalScrollArrow__icon{border-radius:14px;height:28px;width:28px}.vkuiHorizontalScrollArrow--size-l .vkuiHorizontalScrollArrow__icon{border-radius:24px;height:40px;width:40px}.vkuiHorizontalScrollArrow--direction-left{left:0;padding-left:16px;padding-left:var(--vkui--size_base_padding_horizontal--regular,16px)}.vkuiHorizontalScrollArrow--direction-right{padding-right:16px;padding-right:var(--vkui--size_base_padding_horizontal--regular,16px);right:0}.vkuiBaseGallery:hover .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll:hover .vkuiHorizontalScrollArrow{opacity:var(--vkui--opacity_disable_accessibility)}.vkuiBaseGallery:hover .vkuiHorizontalScrollArrow:hover,.vkuiHorizontalScroll--withConstArrows .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll--withConstArrows:hover .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll:hover .vkuiHorizontalScrollArrow:hover{opacity:1}

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

@@ -1,5 +1,5 @@
-import * as React from "react";
-import { PopperCommonProps } from "../Popper/Popper";
+import * as React from 'react';
+import { PopperCommonProps } from '../Popper/Popper';
 export interface HoverPopperProps extends PopperCommonProps {
     /**
      * Содержимое тултипа

package/dist/cssm/components/HoverPopper/HoverPopper.js

@@ -2,12 +2,12 @@ import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["getRef", "content", "children", "onShownChange", "shown", "showDelay", "hideDelay"];
-import * as React from "react";
-import { Popper } from "../Popper/Popper";
-import { useEventListener } from "../../hooks/useEventListener";
-import { useTimeout } from "../../hooks/useTimeout";
-import { usePatchChildrenRef } from "../../hooks/usePatchChildrenRef";
-import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
+import * as React from 'react';
+import { Popper } from '../Popper/Popper';
+import { useEventListener } from '../../hooks/useEventListener';
+import { useTimeout } from '../../hooks/useTimeout';
+import { usePatchChildrenRef } from '../../hooks/usePatchChildrenRef';
+import { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';
 export var HoverPopper = function HoverPopper(_ref) {
   var getRef = _ref.getRef,
     content = _ref.content,
@@ -23,12 +23,12 @@ export var HoverPopper = function HoverPopper(_ref) {
     _React$useState2 = _slicedToArray(_React$useState, 2),
     computedShown = _React$useState2[0],
     setComputedShown = _React$useState2[1];
-  var shown = typeof _shown === "boolean" ? _shown : computedShown;
+  var shown = typeof _shown === 'boolean' ? _shown : computedShown;
   var setShown = function setShown(value) {
-    if (typeof _shown !== "boolean") {
+    if (typeof _shown !== 'boolean') {
       setComputedShown(value);
     }
-    typeof onShownChange === "function" && onShownChange(value);
+    typeof onShownChange === 'function' && onShownChange(value);
   };
   var showTimeout = useTimeout(function () {
     setShown(true);
@@ -48,8 +48,8 @@ export var HoverPopper = function HoverPopper(_ref) {
     showTimeout.clear();
     hideTimeout.set();
   };
-  var targetEnterListener = useEventListener("pointerenter", onTargetEnter);
-  var targetLeaveListener = useEventListener("pointerleave", onTargetLeave);
+  var targetEnterListener = useEventListener('pointerenter', onTargetEnter);
+  var targetLeaveListener = useEventListener('pointerleave', onTargetLeave);
   useIsomorphicLayoutEffect(function () {
     if (childRef.current) {
       targetEnterListener.add(childRef.current);

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

@@ -1 +1 @@
-{"version":3,"file":"HoverPopper.js","names":["React","Popper","useEventListener","useTimeout","usePatchChildrenRef","useIsomorphicLayoutEffect","HoverPopper","getRef","content","children","onShownChange","_shown","shown","showDelay","hideDelay","restProps","useState","computedShown","setComputedShown","setShown","value","showTimeout","hideTimeout","childRef","child","onTargetEnter","clear","set","onTargetLeave","targetEnterListener","targetLeaveListener","current","add"],"sources":["../../../../src/components/HoverPopper/HoverPopper.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Popper, PopperCommonProps } from \"../Popper/Popper\";\nimport { useEventListener } from \"../../hooks/useEventListener\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { usePatchChildrenRef } from \"../../hooks/usePatchChildrenRef\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\n\nexport interface HoverPopperProps extends PopperCommonProps {\n  /**\n   * Содержимое тултипа\n   */\n  content?: React.ReactNode;\n  /**\n   * Если передан, то тултип будет показан/скрыт в зависимости от значения свойства\n   */\n  shown?: boolean;\n  /**\n   * Вызывается при каждом изменении видимости тултипа\n   */\n  onShownChange?: (shown: boolean) => void;\n  /**\n   * Количество миллисекунд, после которых произойдет показ дропдауна\n   */\n  showDelay?: number;\n  /**\n   * Количество миллисекунд, после которых произойдет скрытие дропдауна\n   */\n  hideDelay?: number;\n  /**\n   * Либо jsx-элемент (div, button, etc.), либо компонент со свойством `getRootRef`, которое применяется к корневому элементу компонента\n   */\n  children?: React.ReactElement;\n}\n\nexport const HoverPopper = ({\n  getRef,\n  content,\n  children,\n  onShownChange,\n  shown: _shown,\n  showDelay = 150,\n  hideDelay = 150,\n  ...restProps\n}: HoverPopperProps) => {\n  const [computedShown, setComputedShown] = React.useState(_shown || false);\n\n  const shown = typeof _shown === \"boolean\" ? _shown : computedShown;\n\n  const setShown = (value: boolean) => {\n    if (typeof _shown !== \"boolean\") {\n      setComputedShown(value);\n    }\n    typeof onShownChange === \"function\" && onShownChange(value);\n  };\n\n  const showTimeout = useTimeout(() => {\n    setShown(true);\n  }, showDelay);\n\n  const hideTimeout = useTimeout(() => {\n    setShown(false);\n  }, hideDelay);\n\n  const [childRef, child] = usePatchChildrenRef(children);\n\n  const onTargetEnter = () => {\n    hideTimeout.clear();\n    showTimeout.set();\n  };\n\n  const onTargetLeave = () => {\n    showTimeout.clear();\n    hideTimeout.set();\n  };\n\n  const targetEnterListener = useEventListener(\"pointerenter\", onTargetEnter);\n  const targetLeaveListener = useEventListener(\"pointerleave\", onTargetLeave);\n\n  useIsomorphicLayoutEffect(() => {\n    if (childRef.current) {\n      targetEnterListener.add(childRef.current);\n      targetLeaveListener.add(childRef.current);\n    }\n  }, []);\n\n  return (\n    <React.Fragment>\n      {child}\n      {shown && (\n        <Popper\n          {...restProps}\n          onMouseOver={hideTimeout.clear}\n          onMouseOut={onTargetLeave}\n          getRef={getRef}\n          targetRef={childRef}\n        >\n          {content}\n        </Popper>\n      )}\n    </React.Fragment>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,MAAM,QAA2B,kBAAkB;AAC5D,SAASC,gBAAgB,QAAQ,8BAA8B;AAC/D,SAASC,UAAU,QAAQ,wBAAwB;AACnD,SAASC,mBAAmB,QAAQ,iCAAiC;AACrE,SAASC,yBAAyB,QAAQ,qCAAqC;AA6B/E,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OASA;EAAA,IARtBC,MAAM,QAANA,MAAM;IACNC,OAAO,QAAPA,OAAO;IACPC,QAAQ,QAARA,QAAQ;IACRC,aAAa,QAAbA,aAAa;IACNC,MAAM,QAAbC,KAAK;IAAA,sBACLC,SAAS;IAATA,SAAS,+BAAG,GAAG;IAAA,sBACfC,SAAS;IAATA,SAAS,+BAAG,GAAG;IACZC,SAAS;EAEZ,sBAA0Cf,KAAK,CAACgB,QAAQ,CAACL,MAAM,IAAI,KAAK,CAAC;IAAA;IAAlEM,aAAa;IAAEC,gBAAgB;EAEtC,IAAMN,KAAK,GAAG,OAAOD,MAAM,KAAK,SAAS,GAAGA,MAAM,GAAGM,aAAa;EAElE,IAAME,QAAQ,GAAG,SAAXA,QAAQ,CAAIC,KAAc,EAAK;IACnC,IAAI,OAAOT,MAAM,KAAK,SAAS,EAAE;MAC/BO,gBAAgB,CAACE,KAAK,CAAC;IACzB;IACA,OAAOV,aAAa,KAAK,UAAU,IAAIA,aAAa,CAACU,KAAK,CAAC;EAC7D,CAAC;EAED,IAAMC,WAAW,GAAGlB,UAAU,CAAC,YAAM;IACnCgB,QAAQ,CAAC,IAAI,CAAC;EAChB,CAAC,EAAEN,SAAS,CAAC;EAEb,IAAMS,WAAW,GAAGnB,UAAU,CAAC,YAAM;IACnCgB,QAAQ,CAAC,KAAK,CAAC;EACjB,CAAC,EAAEL,SAAS,CAAC;EAEb,2BAA0BV,mBAAmB,CAACK,QAAQ,CAAC;IAAA;IAAhDc,QAAQ;IAAEC,KAAK;EAEtB,IAAMC,aAAa,GAAG,SAAhBA,aAAa,GAAS;IAC1BH,WAAW,CAACI,KAAK,EAAE;IACnBL,WAAW,CAACM,GAAG,EAAE;EACnB,CAAC;EAED,IAAMC,aAAa,GAAG,SAAhBA,aAAa,GAAS;IAC1BP,WAAW,CAACK,KAAK,EAAE;IACnBJ,WAAW,CAACK,GAAG,EAAE;EACnB,CAAC;EAED,IAAME,mBAAmB,GAAG3B,gBAAgB,CAAC,cAAc,EAAEuB,aAAa,CAAC;EAC3E,IAAMK,mBAAmB,GAAG5B,gBAAgB,CAAC,cAAc,EAAE0B,aAAa,CAAC;EAE3EvB,yBAAyB,CAAC,YAAM;IAC9B,IAAIkB,QAAQ,CAACQ,OAAO,EAAE;MACpBF,mBAAmB,CAACG,GAAG,CAACT,QAAQ,CAACQ,OAAO,CAAC;MACzCD,mBAAmB,CAACE,GAAG,CAACT,QAAQ,CAACQ,OAAO,CAAC;IAC3C;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,oBACE,oBAAC,KAAK,CAAC,QAAQ,QACZP,KAAK,EACLZ,KAAK,iBACJ,oBAAC,MAAM,eACDG,SAAS;IACb,WAAW,EAAEO,WAAW,CAACI,KAAM;IAC/B,UAAU,EAAEE,aAAc;IAC1B,MAAM,EAAErB,MAAO;IACf,SAAS,EAAEgB;EAAS,IAEnBf,OAAO,CAEX,CACc;AAErB,CAAC"}
+{"version":3,"file":"HoverPopper.js","names":["React","Popper","useEventListener","useTimeout","usePatchChildrenRef","useIsomorphicLayoutEffect","HoverPopper","getRef","content","children","onShownChange","_shown","shown","showDelay","hideDelay","restProps","useState","computedShown","setComputedShown","setShown","value","showTimeout","hideTimeout","childRef","child","onTargetEnter","clear","set","onTargetLeave","targetEnterListener","targetLeaveListener","current","add"],"sources":["../../../../src/components/HoverPopper/HoverPopper.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Popper, PopperCommonProps } from '../Popper/Popper';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { usePatchChildrenRef } from '../../hooks/usePatchChildrenRef';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\n\nexport interface HoverPopperProps extends PopperCommonProps {\n  /**\n   * Содержимое тултипа\n   */\n  content?: React.ReactNode;\n  /**\n   * Если передан, то тултип будет показан/скрыт в зависимости от значения свойства\n   */\n  shown?: boolean;\n  /**\n   * Вызывается при каждом изменении видимости тултипа\n   */\n  onShownChange?: (shown: boolean) => void;\n  /**\n   * Количество миллисекунд, после которых произойдет показ дропдауна\n   */\n  showDelay?: number;\n  /**\n   * Количество миллисекунд, после которых произойдет скрытие дропдауна\n   */\n  hideDelay?: number;\n  /**\n   * Либо jsx-элемент (div, button, etc.), либо компонент со свойством `getRootRef`, которое применяется к корневому элементу компонента\n   */\n  children?: React.ReactElement;\n}\n\nexport const HoverPopper = ({\n  getRef,\n  content,\n  children,\n  onShownChange,\n  shown: _shown,\n  showDelay = 150,\n  hideDelay = 150,\n  ...restProps\n}: HoverPopperProps) => {\n  const [computedShown, setComputedShown] = React.useState(_shown || false);\n\n  const shown = typeof _shown === 'boolean' ? _shown : computedShown;\n\n  const setShown = (value: boolean) => {\n    if (typeof _shown !== 'boolean') {\n      setComputedShown(value);\n    }\n    typeof onShownChange === 'function' && onShownChange(value);\n  };\n\n  const showTimeout = useTimeout(() => {\n    setShown(true);\n  }, showDelay);\n\n  const hideTimeout = useTimeout(() => {\n    setShown(false);\n  }, hideDelay);\n\n  const [childRef, child] = usePatchChildrenRef(children);\n\n  const onTargetEnter = () => {\n    hideTimeout.clear();\n    showTimeout.set();\n  };\n\n  const onTargetLeave = () => {\n    showTimeout.clear();\n    hideTimeout.set();\n  };\n\n  const targetEnterListener = useEventListener('pointerenter', onTargetEnter);\n  const targetLeaveListener = useEventListener('pointerleave', onTargetLeave);\n\n  useIsomorphicLayoutEffect(() => {\n    if (childRef.current) {\n      targetEnterListener.add(childRef.current);\n      targetLeaveListener.add(childRef.current);\n    }\n  }, []);\n\n  return (\n    <React.Fragment>\n      {child}\n      {shown && (\n        <Popper\n          {...restProps}\n          onMouseOver={hideTimeout.clear}\n          onMouseOut={onTargetLeave}\n          getRef={getRef}\n          targetRef={childRef}\n        >\n          {content}\n        </Popper>\n      )}\n    </React.Fragment>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,MAAM,QAA2B,kBAAkB;AAC5D,SAASC,gBAAgB,QAAQ,8BAA8B;AAC/D,SAASC,UAAU,QAAQ,wBAAwB;AACnD,SAASC,mBAAmB,QAAQ,iCAAiC;AACrE,SAASC,yBAAyB,QAAQ,qCAAqC;AA6B/E,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OASA;EAAA,IARtBC,MAAM,QAANA,MAAM;IACNC,OAAO,QAAPA,OAAO;IACPC,QAAQ,QAARA,QAAQ;IACRC,aAAa,QAAbA,aAAa;IACNC,MAAM,QAAbC,KAAK;IAAA,sBACLC,SAAS;IAATA,SAAS,+BAAG,GAAG;IAAA,sBACfC,SAAS;IAATA,SAAS,+BAAG,GAAG;IACZC,SAAS;EAEZ,sBAA0Cf,KAAK,CAACgB,QAAQ,CAACL,MAAM,IAAI,KAAK,CAAC;IAAA;IAAlEM,aAAa;IAAEC,gBAAgB;EAEtC,IAAMN,KAAK,GAAG,OAAOD,MAAM,KAAK,SAAS,GAAGA,MAAM,GAAGM,aAAa;EAElE,IAAME,QAAQ,GAAG,SAAXA,QAAQ,CAAIC,KAAc,EAAK;IACnC,IAAI,OAAOT,MAAM,KAAK,SAAS,EAAE;MAC/BO,gBAAgB,CAACE,KAAK,CAAC;IACzB;IACA,OAAOV,aAAa,KAAK,UAAU,IAAIA,aAAa,CAACU,KAAK,CAAC;EAC7D,CAAC;EAED,IAAMC,WAAW,GAAGlB,UAAU,CAAC,YAAM;IACnCgB,QAAQ,CAAC,IAAI,CAAC;EAChB,CAAC,EAAEN,SAAS,CAAC;EAEb,IAAMS,WAAW,GAAGnB,UAAU,CAAC,YAAM;IACnCgB,QAAQ,CAAC,KAAK,CAAC;EACjB,CAAC,EAAEL,SAAS,CAAC;EAEb,2BAA0BV,mBAAmB,CAACK,QAAQ,CAAC;IAAA;IAAhDc,QAAQ;IAAEC,KAAK;EAEtB,IAAMC,aAAa,GAAG,SAAhBA,aAAa,GAAS;IAC1BH,WAAW,CAACI,KAAK,EAAE;IACnBL,WAAW,CAACM,GAAG,EAAE;EACnB,CAAC;EAED,IAAMC,aAAa,GAAG,SAAhBA,aAAa,GAAS;IAC1BP,WAAW,CAACK,KAAK,EAAE;IACnBJ,WAAW,CAACK,GAAG,EAAE;EACnB,CAAC;EAED,IAAME,mBAAmB,GAAG3B,gBAAgB,CAAC,cAAc,EAAEuB,aAAa,CAAC;EAC3E,IAAMK,mBAAmB,GAAG5B,gBAAgB,CAAC,cAAc,EAAE0B,aAAa,CAAC;EAE3EvB,yBAAyB,CAAC,YAAM;IAC9B,IAAIkB,QAAQ,CAACQ,OAAO,EAAE;MACpBF,mBAAmB,CAACG,GAAG,CAACT,QAAQ,CAACQ,OAAO,CAAC;MACzCD,mBAAmB,CAACE,GAAG,CAACT,QAAQ,CAACQ,OAAO,CAAC;IAC3C;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,oBACE,oBAAC,KAAK,CAAC,QAAQ,QACZP,KAAK,EACLZ,KAAK,iBACJ,oBAAC,MAAM,eACDG,SAAS;IACb,WAAW,EAAEO,WAAW,CAACI,KAAM;IAC/B,UAAU,EAAEE,aAAc;IAC1B,MAAM,EAAErB,MAAO;IACf,SAAS,EAAEgB;EAAS,IAEnBf,OAAO,CAEX,CACc;AAErB,CAAC"}

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

@@ -1,5 +1,5 @@
-import * as React from "react";
-import { TappableProps } from "../Tappable/Tappable";
+import * as React from 'react';
+import { TappableProps } from '../Tappable/Tappable';
 export interface IconButtonProps extends TappableProps {
     children?: React.ReactNode;
 }