npm - @vkontakte/vkui - Versions diffs - 5.0.2 → 5.1.0 - Mend

@vkontakte/vkui 5.0.2 → 5.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2369) hide show

package/dist/cjs/components/Header/Header.js CHANGED Viewed

@@ -9,9 +9,8 @@ exports.Header = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
-var _classNames = require("../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 var _usePlatform = require("../../hooks/usePlatform");
-var _utils = require("../../lib/utils");
 var _platform = require("../../lib/platform");
 var _Headline = require("../Typography/Headline/Headline");
 var _Footnote = require("../Typography/Footnote/Footnote");
@@ -26,13 +25,13 @@ var HeaderContent = function HeaderContent(_ref) {
   var platform = (0, _usePlatform.usePlatform)();
   if (platform === _platform.Platform.IOS) {
     switch (mode) {
-      case "primary":
-      case "tertiary":
+      case 'primary':
+      case 'tertiary':
         return /*#__PURE__*/React.createElement(_Title.Title, (0, _extends2.default)({
           weight: "1",
           level: "3"
         }, restProps));
-      case "secondary":
+      case 'secondary':
         return /*#__PURE__*/React.createElement(_Footnote.Footnote, (0, _extends2.default)({
           weight: "2",
           caps: true
@@ -41,22 +40,22 @@ var HeaderContent = function HeaderContent(_ref) {
   }
   if (platform === _platform.Platform.VKCOM) {
     switch (mode) {
-      case "primary":
+      case 'primary':
         return /*#__PURE__*/React.createElement(_Headline.Headline, (0, _extends2.default)({
           weight: "3"
         }, restProps));
-      case "secondary":
-      case "tertiary":
+      case 'secondary':
+      case 'tertiary':
         return /*#__PURE__*/React.createElement(_Footnote.Footnote, restProps);
     }
   }
   switch (mode) {
-    case "primary":
-    case "tertiary":
+    case 'primary':
+    case 'tertiary':
       return /*#__PURE__*/React.createElement(_Headline.Headline, (0, _extends2.default)({
         weight: "2"
       }, restProps));
-    case "secondary":
+    case 'secondary':
       return /*#__PURE__*/React.createElement(_Footnote.Footnote, (0, _extends2.default)({
         weight: "1",
         caps: true
@@ -70,7 +69,7 @@ var HeaderContent = function HeaderContent(_ref) {
  */
 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,
@@ -81,10 +80,10 @@ var Header = function Header(_ref2) {
     restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
   var platform = (0, _usePlatform.usePlatform)();
   var AsideTypography = platform === _platform.Platform.VKCOM ? _Subhead.Subhead : _Text.Text;
-  var SubtitleTypography = mode === "secondary" ? _Subhead.Subhead : _Footnote.Footnote;
+  var SubtitleTypography = mode === 'secondary' ? _Subhead.Subhead : _Footnote.Footnote;
   return /*#__PURE__*/React.createElement("header", (0, _extends2.default)({}, restProps, {
     ref: getRootRef,
-    className: (0, _classNames.classNamesString)("vkuiHeader", platform === _platform.Platform.VKCOM && "vkuiHeader--vkcom", platform === _platform.Platform.ANDROID && "vkuiHeader--android", platform === _platform.Platform.IOS && "vkuiHeader--ios", styles["Header--mode-".concat(mode)], (0, _utils.isPrimitiveReactNode)(indicator) && "vkuiHeader--pi", className)
+    className: (0, _vkjs.classNames)("vkuiHeader", platform === _platform.Platform.VKCOM && "vkuiHeader--vkcom", platform === _platform.Platform.ANDROID && "vkuiHeader--android", platform === _platform.Platform.IOS && "vkuiHeader--ios", styles["Header--mode-".concat(mode)], (0, _vkjs.isPrimitiveReactNode)(indicator) && "vkuiHeader--pi", className)
   }), /*#__PURE__*/React.createElement("div", {
     className: "vkuiHeader__main"
   }, /*#__PURE__*/React.createElement(HeaderContent, {
@@ -92,14 +91,14 @@ var Header = function Header(_ref2) {
     Component: "span",
     mode: mode
   }, /*#__PURE__*/React.createElement("span", {
-    className: (0, _classNames.classNamesString)("vkuiHeader__content-in", multiline && "vkuiHeader__content-in--multiline")
-  }, children), (0, _utils.hasReactNode)(indicator) && /*#__PURE__*/React.createElement(_Footnote.Footnote, {
+    className: (0, _vkjs.classNames)("vkuiHeader__content-in", multiline && "vkuiHeader__content-in--multiline")
+  }, children), (0, _vkjs.hasReactNode)(indicator) && /*#__PURE__*/React.createElement(_Footnote.Footnote, {
     className: "vkuiHeader__indicator",
-    weight: mode === "primary" || mode === "secondary" ? "1" : undefined
-  }, indicator)), (0, _utils.hasReactNode)(subtitle) && /*#__PURE__*/React.createElement(SubtitleTypography, {
+    weight: mode === 'primary' || mode === 'secondary' ? '1' : undefined
+  }, indicator)), (0, _vkjs.hasReactNode)(subtitle) && /*#__PURE__*/React.createElement(SubtitleTypography, {
     className: "vkuiHeader__subtitle",
     Component: "span"
-  }, subtitle)), (0, _utils.hasReactNode)(aside) && /*#__PURE__*/React.createElement(AsideTypography, {
+  }, subtitle)), (0, _vkjs.hasReactNode)(aside) && /*#__PURE__*/React.createElement(AsideTypography, {
     className: "vkuiHeader__aside",
     Component: "span"
   }, aside));

package/dist/cjs/components/Header/Header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.js","names":["HeaderContent","mode","restProps","platform","usePlatform","Platform","IOS","VKCOM","Header","children","subtitle","indicator","aside","getRootRef","multiline","className","AsideTypography","Subhead","Text","SubtitleTypography","Footnote","~~classNamesString~~","ANDROID","styles","isPrimitiveReactNode","hasReactNode","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":";;;;;;;;;;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;~~AACA;~~AAAwD;EAAA;~~AAsBxD~~,IAAMA,aAAa,GAAG,SAAhBA,aAAa,OAAmD;EAAA,IAA7CC,IAAI,QAAJA,IAAI;IAAKC,SAAS;EACzC,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,IAAID,QAAQ,KAAKE,kBAAQ,CAACC,GAAG,EAAE;IAC7B,QAAQL,IAAI;MACV,KAAK,SAAS;MACd,KAAK,UAAU;QACb,oBAAO,oBAAC,YAAK;UAAC,MAAM,EAAC,GAAG;UAAC,KAAK,EAAC;QAAG,GAAKC,SAAS,EAAI;MACtD,KAAK,WAAW;QACd,oBAAO,oBAAC,kBAAQ;UAAC,MAAM,EAAC,GAAG;UAAC,IAAI;QAAA,GAAKA,SAAS,EAAI;IAAC;EAEzD;EAEA,IAAIC,QAAQ,KAAKE,kBAAQ,CAACE,KAAK,EAAE;IAC/B,QAAQN,IAAI;MACV,KAAK,SAAS;QACZ,oBAAO,oBAAC,kBAAQ;UAAC,MAAM,EAAC;QAAG,GAAKC,SAAS,EAAI;MAC/C,KAAK,WAAW;MAChB,KAAK,UAAU;QACb,oBAAO,oBAAC,kBAAQ,EAAKA,SAAS,CAAI;IAAC;EAEzC;EAEA,QAAQD,IAAI;IACV,KAAK,SAAS;IACd,KAAK,UAAU;MACb,oBAAO,oBAAC,kBAAQ;QAAC,MAAM,EAAC;MAAG,GAAKC,SAAS,EAAI;IAC/C,KAAK,WAAW;MACd,oBAAO,oBAAC,kBAAQ;QAAC,MAAM,EAAC,GAAG;QAAC,IAAI;MAAA,GAAKA,SAAS,EAAI;EAAC;EAGvD,OAAO,IAAI;AACb,CAAC;;AAED;AACA;AACA;AACO,IAAMM,MAAM,GAAG,SAATA,MAAM,QAUA;EAAA,uBATjBP,IAAI;IAAJA,IAAI,2BAAG,SAAS;IAChBQ,QAAQ,SAARA,QAAQ;IACRC,QAAQ,SAARA,QAAQ;IACRC,SAAS,SAATA,SAAS;IACTC,KAAK,SAALA,KAAK;IACLC,UAAU,SAAVA,UAAU;IACVC,SAAS,SAATA,SAAS;IACTC,SAAS,SAATA,SAAS;IACNb,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAE9B,IAAMY,eAAe,GAAGb,QAAQ,KAAKE,kBAAQ,CAACE,KAAK,GAAGU,gBAAO,GAAGC,UAAI;EACpE,IAAMC,kBAAkB,GAAGlB,IAAI,KAAK,WAAW,GAAGgB,gBAAO,GAAGG,kBAAQ;EAEpE,oBACE,yDACMlB,SAAS;IACb,GAAG,EAAEW,UAAW;IAChB,SAAS,EAAE,IAAAQ,~~4BAAgB~~,~~gBAEzBlB~~,QAAQ,KAAKE,kBAAQ,CAACE,KAAK,uBAA2B,EACtDJ,QAAQ,KAAKE,kBAAQ,CAACiB,OAAO,yBAA6B,EAC1DnB,QAAQ,KAAKE,kBAAQ,CAACC,GAAG,qBAAyB,EAClDiB,MAAM,wBAAiBtB,IAAI,EAAG,EAC9B,IAAAuB,~~2BAAoB~~,EAACb,SAAS,CAAC,oBAAwB,EACvDI,SAAS;EACT,iBAEF;IAAK,SAAS;EAAyB,gBACrC,oBAAC,aAAa;~~IACZ~~,SAAS,uBAA4B;~~IACrC~~,SAAS,EAAC,MAAM;~~IAChB~~,IAAI,EAAEd;EAAK,~~gBAEX~~;IACE,SAAS,EAAE,IAAAoB,~~4BAAgB~~,~~4BAEzBP~~,SAAS,uCAA2C;EACpD,GAEDL,QAAQ,CACJ,EACN,IAAAgB,~~mBAAY~~,EAACd,SAAS,CAAC,iBACtB,oBAAC,kBAAQ;IACP,SAAS,yBAA8B;IACvC,MAAM,~~EACJV~~,IAAI,KAAK,SAAS,IAAIA,IAAI,KAAK,WAAW,GAAG,GAAG,GAAGyB;~~EACpD~~,~~GAEAf~~,SAAS,CAEb,CACa,EAEf,IAAAc,~~mBAAY~~,EAACf,QAAQ,CAAC,iBACrB,oBAAC,kBAAkB;~~IACjB~~,SAAS,wBAA6B;~~IACtC~~,SAAS,EAAC;EAAM,~~GAEfA~~,QAAQ,CAEZ,CACG,EAEL,IAAAe,~~mBAAY~~,EAACb,KAAK,CAAC,iBAClB,oBAAC,eAAe;IAAC,SAAS,qBAA0B;IAAC,SAAS,EAAC;EAAM,GAClEA,KAAK,CAET,CACM;AAEb,CAAC;AAAC;AAAA;EAAA;EAAA;EAAA;AAAA"}
1	+ {"version":3,"file":"Header.js","names":["HeaderContent","mode","restProps","platform","usePlatform","Platform","IOS","VKCOM","Header","children","subtitle","indicator","aside","getRootRef","multiline","className","AsideTypography","Subhead","Text","SubtitleTypography","Footnote","classNames","ANDROID","styles","isPrimitiveReactNode","hasReactNode","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/cjs/components/HorizontalCell/HorizontalCell.d.ts CHANGED Viewed

@@ -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/cjs/components/HorizontalCell/HorizontalCell.js CHANGED Viewed

@@ -9,8 +9,7 @@ exports.HorizontalCell = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
-var _classNames = require("../../lib/classNames");
-var _utils = require("../../lib/utils");
+var _vkjs = require("@vkontakte/vkjs");
 var _Caption = require("../Typography/Caption/Caption");
 var _Tappable = require("../Tappable/Tappable");
 var _Subhead = require("../Typography/Subhead/Subhead");
@@ -22,7 +21,7 @@ var CellTypography = function CellTypography(_ref) {
   var size = _ref.size,
     children = _ref.children,
     restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  return size === "s" ? /*#__PURE__*/React.createElement(_Caption.Caption, restProps, children) : /*#__PURE__*/React.createElement(_Subhead.Subhead, restProps, children);
+  return size === 's' ? /*#__PURE__*/React.createElement(_Caption.Caption, restProps, children) : /*#__PURE__*/React.createElement(_Subhead.Subhead, restProps, children);
 };
 /**
  * @see https://vkcom.github.io/VKUI/#/HorizontalCell
@@ -33,7 +32,7 @@ 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.Avatar, {
       size: 56
@@ -44,18 +43,18 @@ var HorizontalCell = function HorizontalCell(_ref2) {
   return /*#__PURE__*/React.createElement("div", {
     ref: getRootRef,
     style: style,
-    className: (0, _classNames.classNamesString)("vkuiHorizontalCell", styles["HorizontalCell--size-".concat(size)], className)
+    className: (0, _vkjs.classNames)("vkuiHorizontalCell", styles["HorizontalCell--size-".concat(size)], className)
   }, /*#__PURE__*/React.createElement(_Tappable.Tappable, (0, _extends2.default)({
     className: "vkuiHorizontalCell__body",
     getRootRef: getRef
-  }, restProps), (0, _utils.hasReactNode)(children) && /*#__PURE__*/React.createElement("div", {
+  }, restProps), (0, _vkjs.hasReactNode)(children) && /*#__PURE__*/React.createElement("div", {
     className: "vkuiHorizontalCell__image"
   }, children), /*#__PURE__*/React.createElement("div", {
     className: "vkuiHorizontalCell__content"
-  }, (0, _utils.hasReactNode)(header) && /*#__PURE__*/React.createElement(CellTypography, {
+  }, (0, _vkjs.hasReactNode)(header) && /*#__PURE__*/React.createElement(CellTypography, {
     size: size,
     className: "vkuiHorizontalCell__title"
-  }, header), (0, _utils.hasReactNode)(subtitle) && /*#__PURE__*/React.createElement(_Footnote.Footnote, {
+  }, header), (0, _vkjs.hasReactNode)(subtitle) && /*#__PURE__*/React.createElement(_Footnote.Footnote, {
     className: "vkuiHorizontalCell__subtitle"
   }, subtitle))));
 };

package/dist/cjs/components/HorizontalCell/HorizontalCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HorizontalCell.js","names":["CellTypography","size","children","restProps","HorizontalCell","className","header","style","subtitle","getRootRef","getRef","~~classNamesString~~","styles","hasReactNode"],"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;AACA;AACA;AACA;AACA;AACA;AACA;~~AACA;~~AAA0C;EAAA;AAQ1C,IAAMA,cAAc,GAAG,SAAjBA,cAAc,~~OAIO~~;EAAA,~~IAHzBC~~,IAAI,QAAJA,IAAI;~~IACJC~~,QAAQ,QAARA,QAAQ;~~IACLC~~,SAAS;~~EAEZ~~,OAAOF,IAAI,KAAK,GAAG,gBACjB,oBAAC,gBAAO,EAAKE,SAAS,EAAGD,QAAQ,CAAW,gBAE5C,oBAAC,gBAAO,EAAKC,SAAS,EAAGD,QAAQ,CAClC;AACH,CAAC;AAaD;AACA;AACA;AACO,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,cAAM;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,EAAE,IAAAI,~~4BAAgB~~,~~wBAEzBC~~,MAAM,gCAAyBX,IAAI,EAAG,EACtCI,SAAS;EACT,gBAEF,oBAAC,kBAAQ;~~IACP~~,SAAS,4BAAiC;~~IAC1C~~,UAAU,EAAEK;EAAO,~~GACfP~~,SAAS,~~GAEZ~~,IAAAU,~~mBAAY~~,EAACX,QAAQ,CAAC,iBACrB;IAAK,SAAS;EAAkC,GAAEA,QAAQ,CAC3D,eACD;IAAK,SAAS;EAAoC,GAC/C,IAAAW,~~mBAAY~~,EAACP,MAAM,CAAC,iBACnB,oBAAC,cAAc;~~IACb~~,IAAI,EAAEL,IAAK;~~IACX~~,SAAS;EAAkC,~~GAE1CK~~,MAAM,CAEV,EACA,IAAAO,~~mBAAY~~,EAACL,QAAQ,CAAC,iBACrB,oBAAC,kBAAQ;IAAC,SAAS;EAAqC,~~GACrDA~~,QAAQ,~~CAEZ~~,CACG,CACG,CACP;AAEV,CAAC;AAAC;AAAA;EAAA;EAAA;EAAA;AAAA"}
1	+ {"version":3,"file":"HorizontalCell.js","names":["CellTypography","size","children","restProps","HorizontalCell","className","header","style","subtitle","getRootRef","getRef","classNames","styles","hasReactNode"],"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;AACA;AACA;AACA;AACA;AACA;AACA;AAA0C;EAAA;AAQ1C,IAAMA,cAAc,GAAG,SAAjBA,cAAc,OAA8D;EAAA,IAAxDC,IAAI,QAAJA,IAAI;IAAEC,QAAQ,QAARA,QAAQ;IAAKC,SAAS;EACpD,OAAOF,IAAI,KAAK,GAAG,gBACjB,oBAAC,gBAAO,EAAKE,SAAS,EAAGD,QAAQ,CAAW,gBAE5C,oBAAC,gBAAO,EAAKC,SAAS,EAAGD,QAAQ,CAClC;AACH,CAAC;AAaD;AACA;AACA;AACO,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,cAAM;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,EAAE,IAAAI,gBAAU,wBAEnBC,MAAM,gCAAyBX,IAAI,EAAG,EACtCI,SAAS;EACT,gBAEF,oBAAC,kBAAQ;IAAC,SAAS,4BAAiC;IAAC,UAAU,EAAEK;EAAO,GAAKP,SAAS,GACnF,IAAAU,kBAAY,EAACX,QAAQ,CAAC,iBACrB;IAAK,SAAS;EAAkC,GAAEA,QAAQ,CAC3D,eACD;IAAK,SAAS;EAAoC,GAC/C,IAAAW,kBAAY,EAACP,MAAM,CAAC,iBACnB,oBAAC,cAAc;IAAC,IAAI,EAAEL,IAAK;IAAC,SAAS;EAAkC,GACpEK,MAAM,CAEV,EACA,IAAAO,kBAAY,EAACL,QAAQ,CAAC,iBACrB,oBAAC,kBAAQ;IAAC,SAAS;EAAqC,GAAEA,QAAQ,CACnE,CACG,CACG,CACP;AAEV,CAAC;AAAC;AAAA;EAAA;EAAA;EAAA;AAAA"}

package/dist/cjs/components/HorizontalScroll/HorizontalScroll.d.ts CHANGED Viewed

@@ -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/cjs/components/HorizontalScroll/HorizontalScroll.js CHANGED Viewed

@@ -15,7 +15,7 @@ var _HorizontalScrollArrow = require("./HorizontalScrollArrow");
 var _fx = require("../../lib/fx");
 var _useEventListener = require("../../hooks/useEventListener");
 var _useExternRef = require("../../hooks/useExternRef");
-var _classNames = require("../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 var _excluded = ["children", "getScrollToLeft", "getScrollToRight", "showArrows", "arrowSize", "scrollAnimationDuration", "getRef", "className"];
 /**
  * timing method
@@ -96,7 +96,7 @@ 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,
@@ -158,7 +158,7 @@ var HorizontalScroll = function HorizontalScroll(_ref2) {
       setCanScrollRight(roundUpElementScrollLeft(scrollElement) + scrollElement.offsetWidth < scrollElement.scrollWidth);
     }
   }, [hasPointer, scrollerRef, showArrows]);
-  var scrollEvent = (0, _useEventListener.useEventListener)("scroll", onscroll);
+  var scrollEvent = (0, _useEventListener.useEventListener)('scroll', onscroll);
   React.useEffect(function () {
     if (scrollerRef.current) {
       scrollEvent.add(scrollerRef.current);
@@ -166,8 +166,13 @@ var HorizontalScroll = function HorizontalScroll(_ref2) {
   }, [scrollEvent, scrollerRef]);
   React.useEffect(onscroll, [scrollerRef, children, onscroll]);
   return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({}, restProps, {
-    className: (0, _classNames.classNamesString)("vkuiHorizontalScroll", showArrows === "always" && "vkuiHorizontalScroll--withConstArrows", className)
-  }), showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && /*#__PURE__*/React.createElement(_HorizontalScrollArrow.HorizontalScrollArrow, {
+    className: (0, _vkjs.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.HorizontalScrollArrow, {
     size: arrowSize,
     direction: "left",
     className: "vkuiHorizontalScroll__arrowLeft",
@@ -177,12 +182,7 @@ 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)));
+  }));
 };
 exports.HorizontalScroll = HorizontalScroll;
 //# sourceMappingURL=HorizontalScroll.js.map

package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HorizontalScroll.js","names":["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","easeInOutSine","currentLeft","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","getRef","className","restProps","React","useState","canScrollLeft","setCanScrollLeft","canScrollRight","setCanScrollRight","isCustomScrollingRef","useRef","scrollerRef","useExternRef","hasPointer","useAdaptivityHasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","onscroll","scrollEvent","useEventListener","useEffect","add","classNamesString","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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"}
1	+ {"version":3,"file":"HorizontalScroll.js","names":["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","easeInOutSine","currentLeft","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","getRef","className","restProps","React","useState","canScrollLeft","setCanScrollLeft","canScrollRight","setCanScrollRight","isCustomScrollingRef","useRef","scrollerRef","useExternRef","hasPointer","useAdaptivityHasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","onscroll","scrollEvent","useEventListener","useEffect","add","classNames","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/cjs/components/HorizontalScroll/HorizontalScrollArrow.d.ts CHANGED Viewed

@@ -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/cjs/components/HorizontalScroll/HorizontalScrollArrow.js CHANGED Viewed

@@ -10,27 +10,27 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
 var _icons = require("@vkontakte/icons");
-var _classNames = require("../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 var _Tappable = require("../Tappable/Tappable");
 var _excluded = ["size", "direction", "onClick", "className"];
 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 = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var ArrowIcon;
-  if (size === "m") {
-    ArrowIcon = direction === "left" ? _icons.Icon16ChevronLeft : _icons.Icon16Chevron;
+  if (size === 'm') {
+    ArrowIcon = direction === 'left' ? _icons.Icon16ChevronLeft : _icons.Icon16Chevron;
   } else {
-    ArrowIcon = direction === "left" ? _icons.Icon24ChevronCompactLeft : _icons.Icon24Chevron;
+    ArrowIcon = direction === 'left' ? _icons.Icon24ChevronCompactLeft : _icons.Icon24Chevron;
   }
   return /*#__PURE__*/React.createElement(_Tappable.Tappable, (0, _extends2.default)({}, restProps, {
     Component: "button",
     hasHover: false,
     hasActive: false,
-    className: (0, _classNames.classNamesString)("vkuiHorizontalScrollArrow", styles["HorizontalScrollArrow--size-".concat(size)], styles["HorizontalScrollArrow--direction-".concat(direction)], className),
+    className: (0, _vkjs.classNames)("vkuiHorizontalScrollArrow", styles["HorizontalScrollArrow--size-".concat(size)], styles["HorizontalScrollArrow--direction-".concat(direction)], className),
     onClick: onClick
   }), /*#__PURE__*/React.createElement("span", {
     className: "vkuiHorizontalScrollArrow__icon"

package/dist/cjs/components/HorizontalScroll/HorizontalScrollArrow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HorizontalScrollArrow.js","names":["HorizontalScrollArrow","size","direction","onClick","className","restProps","ArrowIcon","Icon16ChevronLeft","Icon16Chevron","Icon24ChevronCompactLeft","Icon24Chevron","~~classNamesString~~","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;AACA;AAMA;AACA;AAAgD;AAUzC,IAAMA,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,GAAGK,wBAAiB,GAAGC,oBAAa;EACtE,CAAC,MAAM;IACLF,SAAS,GAAGJ,SAAS,KAAK,MAAM,GAAGO,+BAAwB,GAAGC,oBAAa;EAC7E;EAEA,oBACE,oBAAC,kBAAQ,6BACHL,SAAS;IACb,SAAS,EAAC,QAAQ;IAClB,QAAQ,EAAE,KAAM;IAChB,SAAS,EAAE,KAAM;IACjB,SAAS,EAAE,IAAAM,~~4BAAgB~~,+~~BAEzBC~~,MAAM,uCAAgCX,IAAI,EAAG,EAC7CW,MAAM,4CAAqCV,SAAS,EAAG,EACvDE,SAAS,CACT;IACF,OAAO,EAAED;EAAQ,iBAEjB;IAAM,SAAS;EAAwC,gBACrD,oBAAC,SAAS,OAAG,CACR,CACE;AAEf,CAAC;AAAC;AAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}
1	+ {"version":3,"file":"HorizontalScrollArrow.js","names":["HorizontalScrollArrow","size","direction","onClick","className","restProps","ArrowIcon","Icon16ChevronLeft","Icon16Chevron","Icon24ChevronCompactLeft","Icon24Chevron","classNames","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;AACA;AAMA;AACA;AAAgD;AAUzC,IAAMA,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,GAAGK,wBAAiB,GAAGC,oBAAa;EACtE,CAAC,MAAM;IACLF,SAAS,GAAGJ,SAAS,KAAK,MAAM,GAAGO,+BAAwB,GAAGC,oBAAa;EAC7E;EAEA,oBACE,oBAAC,kBAAQ,6BACHL,SAAS;IACb,SAAS,EAAC,QAAQ;IAClB,QAAQ,EAAE,KAAM;IAChB,SAAS,EAAE,KAAM;IACjB,SAAS,EAAE,IAAAM,gBAAU,+BAEnBC,MAAM,uCAAgCX,IAAI,EAAG,EAC7CW,MAAM,4CAAqCV,SAAS,EAAG,EACvDE,SAAS,CACT;IACF,OAAO,EAAED;EAAQ,iBAEjB;IAAM,SAAS;EAAwC,gBACrD,oBAAC,SAAS,OAAG,CACR,CACE;AAEf,CAAC;AAAC;AAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}

package/dist/cjs/components/HoverPopper/HoverPopper.d.ts CHANGED Viewed

@@ -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/cjs/components/HoverPopper/HoverPopper.js CHANGED Viewed

@@ -31,12 +31,12 @@ var HoverPopper = function HoverPopper(_ref) {
     _React$useState2 = (0, _slicedToArray2.default)(_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 = (0, _useTimeout.useTimeout)(function () {
     setShown(true);
@@ -56,8 +56,8 @@ var HoverPopper = function HoverPopper(_ref) {
     showTimeout.clear();
     hideTimeout.set();
   };
-  var targetEnterListener = (0, _useEventListener.useEventListener)("pointerenter", onTargetEnter);
-  var targetLeaveListener = (0, _useEventListener.useEventListener)("pointerleave", onTargetLeave);
+  var targetEnterListener = (0, _useEventListener.useEventListener)('pointerenter', onTargetEnter);
+  var targetLeaveListener = (0, _useEventListener.useEventListener)('pointerleave', onTargetLeave);
   (0, _useIsomorphicLayoutEffect.useIsomorphicLayoutEffect)(function () {
     if (childRef.current) {
       targetEnterListener.add(childRef.current);

package/dist/cjs/components/HoverPopper/HoverPopper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HoverPopper.js","names":["HoverPopper","getRef","content","children","onShownChange","_shown","shown","showDelay","hideDelay","restProps","React","useState","computedShown","setComputedShown","setShown","value","showTimeout","useTimeout","hideTimeout","usePatchChildrenRef","childRef","child","onTargetEnter","clear","set","onTargetLeave","targetEnterListener","useEventListener","targetLeaveListener","useIsomorphicLayoutEffect","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;AACA;AACA;AACA;AACA;AACA;AAAgF;AA6BzE,IAAMA,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,sBAA0CC,KAAK,CAACC,QAAQ,CAACN,MAAM,IAAI,KAAK,CAAC;IAAA;IAAlEO,aAAa;IAAEC,gBAAgB;EAEtC,IAAMP,KAAK,GAAG,OAAOD,MAAM,KAAK,SAAS,GAAGA,MAAM,GAAGO,aAAa;EAElE,IAAME,QAAQ,GAAG,SAAXA,QAAQ,CAAIC,KAAc,EAAK;IACnC,IAAI,OAAOV,MAAM,KAAK,SAAS,EAAE;MAC/BQ,gBAAgB,CAACE,KAAK,CAAC;IACzB;IACA,OAAOX,aAAa,KAAK,UAAU,IAAIA,aAAa,CAACW,KAAK,CAAC;EAC7D,CAAC;EAED,IAAMC,WAAW,GAAG,IAAAC,sBAAU,EAAC,YAAM;IACnCH,QAAQ,CAAC,IAAI,CAAC;EAChB,CAAC,EAAEP,SAAS,CAAC;EAEb,IAAMW,WAAW,GAAG,IAAAD,sBAAU,EAAC,YAAM;IACnCH,QAAQ,CAAC,KAAK,CAAC;EACjB,CAAC,EAAEN,SAAS,CAAC;EAEb,2BAA0B,IAAAW,yCAAmB,EAAChB,QAAQ,CAAC;IAAA;IAAhDiB,QAAQ;IAAEC,KAAK;EAEtB,IAAMC,aAAa,GAAG,SAAhBA,aAAa,GAAS;IAC1BJ,WAAW,CAACK,KAAK,EAAE;IACnBP,WAAW,CAACQ,GAAG,EAAE;EACnB,CAAC;EAED,IAAMC,aAAa,GAAG,SAAhBA,aAAa,GAAS;IAC1BT,WAAW,CAACO,KAAK,EAAE;IACnBL,WAAW,CAACM,GAAG,EAAE;EACnB,CAAC;EAED,IAAME,mBAAmB,GAAG,IAAAC,kCAAgB,EAAC,cAAc,EAAEL,aAAa,CAAC;EAC3E,IAAMM,mBAAmB,GAAG,IAAAD,kCAAgB,EAAC,cAAc,EAAEF,aAAa,CAAC;EAE3E,IAAAI,oDAAyB,EAAC,YAAM;IAC9B,IAAIT,QAAQ,CAACU,OAAO,EAAE;MACpBJ,mBAAmB,CAACK,GAAG,CAACX,QAAQ,CAACU,OAAO,CAAC;MACzCF,mBAAmB,CAACG,GAAG,CAACX,QAAQ,CAACU,OAAO,CAAC;IAC3C;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,oBACE,oBAAC,KAAK,CAAC,QAAQ,QACZT,KAAK,EACLf,KAAK,iBACJ,oBAAC,cAAM,6BACDG,SAAS;IACb,WAAW,EAAES,WAAW,CAACK,KAAM;IAC/B,UAAU,EAAEE,aAAc;IAC1B,MAAM,EAAExB,MAAO;IACf,SAAS,EAAEmB;EAAS,IAEnBlB,OAAO,CAEX,CACc;AAErB,CAAC;AAAC"}
1	+ {"version":3,"file":"HoverPopper.js","names":["HoverPopper","getRef","content","children","onShownChange","_shown","shown","showDelay","hideDelay","restProps","React","useState","computedShown","setComputedShown","setShown","value","showTimeout","useTimeout","hideTimeout","usePatchChildrenRef","childRef","child","onTargetEnter","clear","set","onTargetLeave","targetEnterListener","useEventListener","targetLeaveListener","useIsomorphicLayoutEffect","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;AACA;AACA;AACA;AACA;AACA;AAAgF;AA6BzE,IAAMA,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,sBAA0CC,KAAK,CAACC,QAAQ,CAACN,MAAM,IAAI,KAAK,CAAC;IAAA;IAAlEO,aAAa;IAAEC,gBAAgB;EAEtC,IAAMP,KAAK,GAAG,OAAOD,MAAM,KAAK,SAAS,GAAGA,MAAM,GAAGO,aAAa;EAElE,IAAME,QAAQ,GAAG,SAAXA,QAAQ,CAAIC,KAAc,EAAK;IACnC,IAAI,OAAOV,MAAM,KAAK,SAAS,EAAE;MAC/BQ,gBAAgB,CAACE,KAAK,CAAC;IACzB;IACA,OAAOX,aAAa,KAAK,UAAU,IAAIA,aAAa,CAACW,KAAK,CAAC;EAC7D,CAAC;EAED,IAAMC,WAAW,GAAG,IAAAC,sBAAU,EAAC,YAAM;IACnCH,QAAQ,CAAC,IAAI,CAAC;EAChB,CAAC,EAAEP,SAAS,CAAC;EAEb,IAAMW,WAAW,GAAG,IAAAD,sBAAU,EAAC,YAAM;IACnCH,QAAQ,CAAC,KAAK,CAAC;EACjB,CAAC,EAAEN,SAAS,CAAC;EAEb,2BAA0B,IAAAW,yCAAmB,EAAChB,QAAQ,CAAC;IAAA;IAAhDiB,QAAQ;IAAEC,KAAK;EAEtB,IAAMC,aAAa,GAAG,SAAhBA,aAAa,GAAS;IAC1BJ,WAAW,CAACK,KAAK,EAAE;IACnBP,WAAW,CAACQ,GAAG,EAAE;EACnB,CAAC;EAED,IAAMC,aAAa,GAAG,SAAhBA,aAAa,GAAS;IAC1BT,WAAW,CAACO,KAAK,EAAE;IACnBL,WAAW,CAACM,GAAG,EAAE;EACnB,CAAC;EAED,IAAME,mBAAmB,GAAG,IAAAC,kCAAgB,EAAC,cAAc,EAAEL,aAAa,CAAC;EAC3E,IAAMM,mBAAmB,GAAG,IAAAD,kCAAgB,EAAC,cAAc,EAAEF,aAAa,CAAC;EAE3E,IAAAI,oDAAyB,EAAC,YAAM;IAC9B,IAAIT,QAAQ,CAACU,OAAO,EAAE;MACpBJ,mBAAmB,CAACK,GAAG,CAACX,QAAQ,CAACU,OAAO,CAAC;MACzCF,mBAAmB,CAACG,GAAG,CAACX,QAAQ,CAACU,OAAO,CAAC;IAC3C;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,oBACE,oBAAC,KAAK,CAAC,QAAQ,QACZT,KAAK,EACLf,KAAK,iBACJ,oBAAC,cAAM,6BACDG,SAAS;IACb,WAAW,EAAES,WAAW,CAACK,KAAM;IAC/B,UAAU,EAAEE,aAAc;IAC1B,MAAM,EAAExB,MAAO;IACf,SAAS,EAAEmB;EAAS,IAEnBlB,OAAO,CAEX,CACc;AAErB,CAAC;AAAC"}

package/dist/cjs/components/IconButton/IconButton.d.ts CHANGED Viewed

@@ -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;
 }

package/dist/cjs/components/IconButton/IconButton.js CHANGED Viewed

@@ -10,7 +10,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
 var _Tappable = require("../Tappable/Tappable");
-var _classNames = require("../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 var _usePlatform = require("../../hooks/usePlatform");
 var _platform = require("../../lib/platform");
 var _getSizeYClassName = require("../../helpers/getSizeYClassName");
@@ -22,7 +22,7 @@ var _excluded = ["children", "Component", "className"];
 var IconButton = function IconButton(_ref) {
   var children = _ref.children,
     _ref$Component = _ref.Component,
-    Component = _ref$Component === void 0 ? "button" : _ref$Component,
+    Component = _ref$Component === void 0 ? 'button' : _ref$Component,
     className = _ref.className,
     restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var platform = (0, _usePlatform.usePlatform)();
@@ -32,8 +32,8 @@ var IconButton = function IconButton(_ref) {
     activeEffectDelay: 200,
     activeMode: "background"
   }, restProps, {
-    Component: restProps.href ? "a" : Component,
-    className: (0, _classNames.classNamesString)("vkuiIconButton", (0, _getSizeYClassName.getSizeYClassName)("vkuiIconButton", sizeY), platform === _platform.Platform.IOS && "vkuiIconButton--ios", className)
+    Component: restProps.href ? 'a' : Component,
+    className: (0, _vkjs.classNames)("vkuiIconButton", (0, _getSizeYClassName.getSizeYClassName)("vkuiIconButton", sizeY), platform === _platform.Platform.IOS && "vkuiIconButton--ios", className)
   }), children);
 };
 exports.IconButton = IconButton;

package/dist/cjs/components/IconButton/IconButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IconButton.js","names":["IconButton","children","Component","className","restProps","platform","usePlatform","useAdaptivity","sizeY","href","~~classNamesString~~","getSizeYClassName","Platform","IOS"],"sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { TappableProps, Tappable } from \"../Tappable/Tappable\";\nimport { ~~classNamesString~~ } from ~~\"../../lib~~/~~classNames\"~~;\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { Platform } from \"../../lib/platform\";\nimport { getSizeYClassName } from \"../../helpers/getSizeYClassName\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport styles from \"./IconButton.module.css\";\n\nexport interface IconButtonProps extends TappableProps {\n children?: React.ReactNode;\n}\n\n/*\n @see https://vkcom.github.io/VKUI/#/IconButton\n */\nexport const IconButton = ({\n children,\n Component = \"button\",\n className,\n ...restProps\n}: IconButtonProps) => {\n const platform = usePlatform();\n const { sizeY } = useAdaptivity();\n\n return (\n <Tappable\n activeEffectDelay={200}\n activeMode=\"background\"\n {...restProps}\n Component={restProps.href ? \"a\" : Component}\n className={~~classNamesString~~(\n styles[\"IconButton\"],\n getSizeYClassName(styles[\"IconButton\"], sizeY),\n platform === Platform.IOS && styles[\"IconButton--ios\"],\n className\n )}\n >\n {children}\n </Tappable>\n );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAA0D;AAO1D;AACA;AACA;AACO,IAAMA,UAAU,GAAG,SAAbA,UAAU,OAKA;EAAA,IAJrBC,QAAQ,QAARA,QAAQ;IAAA,sBACRC,SAAS;IAATA,SAAS,+BAAG,QAAQ;IACpBC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,qBAAkB,IAAAC,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EAEb,oBACE,oBAAC,kBAAQ;IACP,iBAAiB,EAAE,GAAI;IACvB,UAAU,EAAC;EAAY,GACnBJ,SAAS;IACb,SAAS,EAAEA,SAAS,CAACK,IAAI,GAAG,GAAG,GAAGP,SAAU;IAC5C,SAAS,EAAE,IAAAQ,~~4BAAgB~~,~~oBAEzB~~,IAAAC,oCAAiB,oBAAuBH,KAAK,CAAC,EAC9CH,QAAQ,KAAKO,kBAAQ,CAACC,GAAG,yBAA6B,EACtDV,SAAS;EACT,IAEDF,QAAQ,CACA;AAEf,CAAC;AAAC"}
1	+ {"version":3,"file":"IconButton.js","names":["IconButton","children","Component","className","restProps","platform","usePlatform","useAdaptivity","sizeY","href","classNames","getSizeYClassName","Platform","IOS"],"sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { TappableProps, Tappable } from '../Tappable/Tappable';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { getSizeYClassName } from '../../helpers/getSizeYClassName';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport styles from './IconButton.module.css';\n\nexport interface IconButtonProps extends TappableProps {\n children?: React.ReactNode;\n}\n\n/*\n @see https://vkcom.github.io/VKUI/#/IconButton\n */\nexport const IconButton = ({\n children,\n Component = 'button',\n className,\n ...restProps\n}: IconButtonProps) => {\n const platform = usePlatform();\n const { sizeY } = useAdaptivity();\n\n return (\n <Tappable\n activeEffectDelay={200}\n activeMode=\"background\"\n {...restProps}\n Component={restProps.href ? 'a' : Component}\n className={classNames(\n styles['IconButton'],\n getSizeYClassName(styles['IconButton'], sizeY),\n platform === Platform.IOS && styles['IconButton--ios'],\n className,\n )}\n >\n {children}\n </Tappable>\n );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAA0D;AAO1D;AACA;AACA;AACO,IAAMA,UAAU,GAAG,SAAbA,UAAU,OAKA;EAAA,IAJrBC,QAAQ,QAARA,QAAQ;IAAA,sBACRC,SAAS;IAATA,SAAS,+BAAG,QAAQ;IACpBC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,qBAAkB,IAAAC,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EAEb,oBACE,oBAAC,kBAAQ;IACP,iBAAiB,EAAE,GAAI;IACvB,UAAU,EAAC;EAAY,GACnBJ,SAAS;IACb,SAAS,EAAEA,SAAS,CAACK,IAAI,GAAG,GAAG,GAAGP,SAAU;IAC5C,SAAS,EAAE,IAAAQ,gBAAU,oBAEnB,IAAAC,oCAAiB,oBAAuBH,KAAK,CAAC,EAC9CH,QAAQ,KAAKO,kBAAQ,CAACC,GAAG,yBAA6B,EACtDV,SAAS;EACT,IAEDF,QAAQ,CACA;AAEf,CAAC;AAAC"}

package/dist/cjs/components/Image/Image.d.ts CHANGED Viewed

@@ -1,13 +1,13 @@
 /// <reference types="react" />
-import { type ImageBaseProps, type ImageBaseOverlayProps } from "../ImageBase/ImageBase";
-import { type ImageBadgeProps } from "./ImageBadge/ImageBadge";
+import { type ImageBaseProps, type ImageBaseOverlayProps } from '../ImageBase/ImageBase';
+import { type ImageBadgeProps } from './ImageBadge/ImageBadge';
 export type { ImageBadgeProps, ImageBaseOverlayProps as ImageOverlayProps };
 export declare const IMAGE_DEFAULT_SIZE = 48;
-export interface ImageProps extends Omit<ImageBaseProps, "badge"> {
+export interface ImageProps extends Omit<ImageBaseProps, 'badge'> {
     /**
      * Размер закругления.
      */
-    borderRadius?: "s" | "l" | "m";
+    borderRadius?: 's' | 'l' | 'm';
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Image