@vkontakte/vkui 6.5.2 → 6.6.0

package/dist/components/Header/Header.js

@@ -68,7 +68,7 @@ const stylesMode = {
 /**
  * @see https://vkcom.github.io/VKUI/#/Header
  */ export const Header = (_param)=>{
-    var { mode = 'primary', size = 'regular', Component = 'h2', children, subtitle, subtitleComponent = 'span', indicator, aside, multiline } = _param, restProps = _object_without_properties(_param, [
+    var { mode = 'primary', size = 'regular', Component = 'h2', children, subtitle, subtitleComponent = 'span', indicator, aside, multiline, before, beforeTitle, afterTitle, beforeSubtitle, afterSubtitle } = _param, restProps = _object_without_properties(_param, [
         "mode",
         "size",
         "Component",
@@ -77,11 +77,20 @@ const stylesMode = {
         "subtitleComponent",
         "indicator",
         "aside",
-        "multiline"
+        "multiline",
+        "before",
+        "beforeTitle",
+        "afterTitle",
+        "beforeSubtitle",
+        "afterSubtitle"
     ]);
     return /*#__PURE__*/ _jsxs(RootComponent, _object_spread_props(_object_spread({}, restProps), {
         baseClassName: classNames("vkuiHeader", stylesMode[mode], size === 'large' && "vkuiHeader--large", isPrimitiveReactNode(indicator) && "vkuiHeader--pi", hasReactNode(subtitle) && "vkuiHeader--with-subtitle"),
         children: [
+            before && /*#__PURE__*/ _jsx("div", {
+                className: classNames("vkuiHeader__before", subtitle && "vkuiHeader__before--withSubtitle"),
+                children: before
+            }),
             /*#__PURE__*/ _jsxs("div", {
                 className: "vkuiHeader__main",
                 children: [
@@ -91,10 +100,18 @@ const stylesMode = {
                         mode: mode,
                         size: size,
                         children: [
+                            beforeTitle && /*#__PURE__*/ _jsx("div", {
+                                className: "vkuiHeader__content__before",
+                                children: beforeTitle
+                            }),
                             /*#__PURE__*/ _jsx("span", {
                                 className: classNames("vkuiHeader__content-in", multiline && "vkuiHeader__content--multiline"),
                                 children: children
                             }),
+                            afterTitle && /*#__PURE__*/ _jsx("div", {
+                                className: "vkuiHeader__content__after",
+                                children: afterTitle
+                            }),
                             hasReactNode(indicator) && /*#__PURE__*/ _jsx(Footnote, {
                                 className: "vkuiHeader__indicator",
                                 weight: "2",
@@ -102,10 +119,23 @@ const stylesMode = {
                             })
                         ]
                     }),
-                    hasReactNode(subtitle) && /*#__PURE__*/ _jsx(Subhead, {
-                        className: classNames("vkuiHeader__subtitle", multiline && "vkuiHeader__content--multiline"),
-                        Component: subtitleComponent,
-                        children: subtitle
+                    hasReactNode(subtitle) && /*#__PURE__*/ _jsxs("div", {
+                        className: "vkuiHeader__subtitleWrapper",
+                        children: [
+                            beforeSubtitle && /*#__PURE__*/ _jsx("div", {
+                                className: "vkuiHeader__subtitleBefore",
+                                children: beforeSubtitle
+                            }),
+                            /*#__PURE__*/ _jsx(Subhead, {
+                                className: classNames("vkuiHeader__subtitle", multiline && "vkuiHeader__content--multiline"),
+                                Component: subtitleComponent,
+                                children: subtitle
+                            }),
+                            afterSubtitle && /*#__PURE__*/ _jsx("div", {
+                                className: "vkuiHeader__subtitleAfter",
+                                children: afterSubtitle
+                            })
+                        ]
                     })
                 ]
             }),

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

@@ -1 +1 @@
-{"version":3,"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, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Header.module.css';\n\nexport interface HeaderProps extends HTMLAttributesWithRootRef<HTMLElement>, HasComponent {\n  mode?: 'primary' | 'secondary' | 'tertiary';\n  size?: 'regular' | 'large';\n  subtitle?: React.ReactNode;\n  /* Позволяет задать тип элемента в который будет обёрнут subtitle */\n  subtitleComponent?: React.ElementType;\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' | 'size' | 'className'> &\n  HasComponent;\n\nconst HeaderContent = ({ mode, size, ...restProps }: HeaderContentProps) => {\n  const isLarge = size === 'large';\n\n  const platform = usePlatform();\n  if (platform === 'ios') {\n    switch (mode) {\n      case 'primary':\n        return isLarge ? (\n          <Title level=\"2\" weight=\"2\" {...restProps} />\n        ) : (\n          <Title weight=\"1\" level=\"3\" {...restProps} />\n        );\n      case 'secondary':\n        return <Footnote weight=\"1\" caps {...restProps} />;\n      case 'tertiary':\n        return <Title weight=\"1\" level=\"3\" {...restProps} />;\n    }\n  }\n\n  switch (mode) {\n    case 'primary':\n      return isLarge ? (\n        <Title level=\"2\" weight=\"2\" {...restProps} />\n      ) : (\n        <Headline weight=\"2\" {...restProps} />\n      );\n    case 'secondary':\n      return <Footnote weight=\"1\" caps {...restProps} />;\n    case 'tertiary':\n      return <Headline weight=\"2\" {...restProps} />;\n  }\n\n  return null;\n};\n\nconst stylesMode = {\n  primary: styles['Header--mode-primary'],\n  secondary: styles['Header--mode-secondary'],\n  tertiary: styles['Header--mode-tertiary'],\n};\n/**\n * @see https://vkcom.github.io/VKUI/#/Header\n */\nexport const Header = ({\n  mode = 'primary',\n  size = 'regular',\n  Component = 'h2',\n  children,\n  subtitle,\n  subtitleComponent = 'span',\n  indicator,\n  aside,\n  multiline,\n  ...restProps\n}: HeaderProps): React.ReactNode => {\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['Header'],\n        stylesMode[mode],\n        size === 'large' && styles['Header--large'],\n        isPrimitiveReactNode(indicator) && styles['Header--pi'],\n        hasReactNode(subtitle) && styles['Header--with-subtitle'],\n      )}\n    >\n      <div className={styles['Header__main']}>\n        <HeaderContent\n          className={styles['Header__content']}\n          Component={Component}\n          mode={mode}\n          size={size}\n        >\n          <span\n            className={classNames(\n              styles['Header__content-in'],\n              multiline && styles['Header__content--multiline'],\n            )}\n          >\n            {children}\n          </span>\n          {hasReactNode(indicator) && (\n            <Footnote className={styles['Header__indicator']} weight=\"2\">\n              {indicator}\n            </Footnote>\n          )}\n        </HeaderContent>\n\n        {hasReactNode(subtitle) && (\n          <Subhead\n            className={classNames(\n              styles['Header__subtitle'],\n              multiline && styles['Header__content--multiline'],\n            )}\n            Component={subtitleComponent}\n          >\n            {subtitle}\n          </Subhead>\n        )}\n      </div>\n\n      {hasReactNode(aside) && (\n        <Paragraph className={styles['Header__aside']} Component=\"span\">\n          {aside}\n        </Paragraph>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","hasReactNode","isPrimitiveReactNode","usePlatform","RootComponent","Footnote","Headline","Paragraph","Subhead","Title","HeaderContent","mode","size","restProps","isLarge","platform","level","weight","caps","stylesMode","primary","secondary","tertiary","Header","Component","children","subtitle","subtitleComponent","indicator","aside","multiline","baseClassName","div","className","span"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,EAAEC,oBAAoB,QAAQ,kBAAkB;AACjF,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,SAAS,QAAQ,oCAAoC;AAC9D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,KAAK,QAAQ,4BAA4B;AAuBlD,MAAMC,gBAAgB;QAAC,EAAEC,IAAI,EAAEC,IAAI,EAAoC,WAA/BC;QAAfF;QAAMC;;IAC7B,MAAME,UAAUF,SAAS;IAEzB,MAAMG,WAAWZ;IACjB,IAAIY,aAAa,OAAO;QACtB,OAAQJ;YACN,KAAK;gBACH,OAAOG,wBACL,KAACL;oBAAMO,OAAM;oBAAIC,QAAO;mBAAQJ,4BAEhC,KAACJ;oBAAMQ,QAAO;oBAAID,OAAM;mBAAQH;YAEpC,KAAK;gBACH,qBAAO,KAACR;oBAASY,QAAO;oBAAIC,IAAI;mBAAKL;YACvC,KAAK;gBACH,qBAAO,KAACJ;oBAAMQ,QAAO;oBAAID,OAAM;mBAAQH;QAC3C;IACF;IAEA,OAAQF;QACN,KAAK;YACH,OAAOG,wBACL,KAACL;gBAAMO,OAAM;gBAAIC,QAAO;eAAQJ,4BAEhC,KAACP;gBAASW,QAAO;eAAQJ;QAE7B,KAAK;YACH,qBAAO,KAACR;gBAASY,QAAO;gBAAIC,IAAI;eAAKL;QACvC,KAAK;YACH,qBAAO,KAACP;gBAASW,QAAO;eAAQJ;IACpC;IAEA,OAAO;AACT;AAEA,MAAMM,aAAa;IACjBC,OAAO;IACPC,SAAS;IACTC,QAAQ;AACV;AACA;;CAEC,GACD,OAAO,MAAMC,SAAS;QAAC,EACrBZ,OAAO,SAAS,EAChBC,OAAO,SAAS,EAChBY,YAAY,IAAI,EAChBC,QAAQ,EACRC,QAAQ,EACRC,oBAAoB,MAAM,EAC1BC,SAAS,EACTC,KAAK,EACLC,SAAS,EAEG,WADTjB;QATHF;QACAC;QACAY;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,MAAC1B,uDACKS;QACJkB,eAAe/B,yBAEbmB,UAAU,CAACR,KAAK,EAChBC,SAAS,gCACTV,qBAAqB0B,gCACrB3B,aAAayB;;0BAGf,MAACM;gBAAIC,SAAS;;kCACZ,MAACvB;wBACCuB,SAAS;wBACTT,WAAWA;wBACXb,MAAMA;wBACNC,MAAMA;;0CAEN,KAACsB;gCACCD,WAAWjC,qCAET8B;0CAGDL;;4BAEFxB,aAAa2B,4BACZ,KAACvB;gCAAS4B,SAAS;gCAA+BhB,QAAO;0CACtDW;;;;oBAKN3B,aAAayB,2BACZ,KAAClB;wBACCyB,WAAWjC,mCAET8B;wBAEFN,WAAWG;kCAEVD;;;;YAKNzB,aAAa4B,wBACZ,KAACtB;gBAAU0B,SAAS;gBAA2BT,WAAU;0BACtDK;;;;AAKX,EAAE"}
+{"version":3,"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 type { HasComponent, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Header.module.css';\n\nexport interface HeaderProps extends HTMLAttributesWithRootRef<HTMLElement>, HasComponent {\n  mode?: 'primary' | 'secondary' | 'tertiary';\n  size?: 'regular' | 'large';\n  subtitle?: React.ReactNode;\n  /* Позволяет задать тип элемента в который будет обёрнут subtitle */\n  subtitleComponent?: React.ElementType;\n  /**\n   * Допускаются иконки, текст, Link\n   */\n  aside?: React.ReactNode;\n  /**\n   * Допускаются текст, Indicator\n   */\n  indicator?: React.ReactNode;\n  multiline?: boolean;\n  /**\n   * Иконка слева (рекомендуется использовать размер 28px)\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка слева от title (рекомендуется использовать размер 16px)\n   */\n  beforeTitle?: React.ReactNode;\n  /**\n   * Иконка справа от title (рекомендуется использовать размер 16px)\n   */\n  afterTitle?: React.ReactNode;\n  /**\n   * Иконка слева от subtitle (рекомендуется использовать размер 12px)\n   */\n  beforeSubtitle?: React.ReactNode;\n  /**\n   * Иконка справа от subtitle (рекомендуется использовать размер 12px)\n   */\n  afterSubtitle?: React.ReactNode;\n}\n\ntype HeaderContentProps = Pick<HeaderProps, 'children' | 'mode' | 'size' | 'className'> &\n  HasComponent;\n\nconst HeaderContent = ({ mode, size, ...restProps }: HeaderContentProps) => {\n  const isLarge = size === 'large';\n\n  const platform = usePlatform();\n  if (platform === 'ios') {\n    switch (mode) {\n      case 'primary':\n        return isLarge ? (\n          <Title level=\"2\" weight=\"2\" {...restProps} />\n        ) : (\n          <Title weight=\"1\" level=\"3\" {...restProps} />\n        );\n      case 'secondary':\n        return <Footnote weight=\"1\" caps {...restProps} />;\n      case 'tertiary':\n        return <Title weight=\"1\" level=\"3\" {...restProps} />;\n    }\n  }\n\n  switch (mode) {\n    case 'primary':\n      return isLarge ? (\n        <Title level=\"2\" weight=\"2\" {...restProps} />\n      ) : (\n        <Headline weight=\"2\" {...restProps} />\n      );\n    case 'secondary':\n      return <Footnote weight=\"1\" caps {...restProps} />;\n    case 'tertiary':\n      return <Headline weight=\"2\" {...restProps} />;\n  }\n\n  return null;\n};\n\nconst stylesMode = {\n  primary: styles['Header--mode-primary'],\n  secondary: styles['Header--mode-secondary'],\n  tertiary: styles['Header--mode-tertiary'],\n};\n/**\n * @see https://vkcom.github.io/VKUI/#/Header\n */\nexport const Header = ({\n  mode = 'primary',\n  size = 'regular',\n  Component = 'h2',\n  children,\n  subtitle,\n  subtitleComponent = 'span',\n  indicator,\n  aside,\n  multiline,\n  before,\n  beforeTitle,\n  afterTitle,\n  beforeSubtitle,\n  afterSubtitle,\n  ...restProps\n}: HeaderProps): React.ReactNode => {\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['Header'],\n        stylesMode[mode],\n        size === 'large' && styles['Header--large'],\n        isPrimitiveReactNode(indicator) && styles['Header--pi'],\n        hasReactNode(subtitle) && styles['Header--with-subtitle'],\n      )}\n    >\n      {before && (\n        <div\n          className={classNames(\n            styles['Header__before'],\n            subtitle && styles['Header__before--withSubtitle'],\n          )}\n        >\n          {before}\n        </div>\n      )}\n      <div className={styles['Header__main']}>\n        <HeaderContent\n          className={styles['Header__content']}\n          Component={Component}\n          mode={mode}\n          size={size}\n        >\n          {beforeTitle && <div className={styles['Header__content__before']}>{beforeTitle}</div>}\n          <span\n            className={classNames(\n              styles['Header__content-in'],\n              multiline && styles['Header__content--multiline'],\n            )}\n          >\n            {children}\n          </span>\n          {afterTitle && <div className={styles['Header__content__after']}>{afterTitle}</div>}\n          {hasReactNode(indicator) && (\n            <Footnote className={styles['Header__indicator']} weight=\"2\">\n              {indicator}\n            </Footnote>\n          )}\n        </HeaderContent>\n        {hasReactNode(subtitle) && (\n          <div className={styles['Header__subtitleWrapper']}>\n            {beforeSubtitle && (\n              <div className={styles['Header__subtitleBefore']}>{beforeSubtitle}</div>\n            )}\n            <Subhead\n              className={classNames(\n                styles['Header__subtitle'],\n                multiline && styles['Header__content--multiline'],\n              )}\n              Component={subtitleComponent}\n            >\n              {subtitle}\n            </Subhead>\n            {afterSubtitle && (\n              <div className={styles['Header__subtitleAfter']}>{afterSubtitle}</div>\n            )}\n          </div>\n        )}\n      </div>\n\n      {hasReactNode(aside) && (\n        <Paragraph className={styles['Header__aside']} Component=\"span\">\n          {aside}\n        </Paragraph>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","hasReactNode","isPrimitiveReactNode","usePlatform","RootComponent","Footnote","Headline","Paragraph","Subhead","Title","HeaderContent","mode","size","restProps","isLarge","platform","level","weight","caps","stylesMode","primary","secondary","tertiary","Header","Component","children","subtitle","subtitleComponent","indicator","aside","multiline","before","beforeTitle","afterTitle","beforeSubtitle","afterSubtitle","baseClassName","div","className","span"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,EAAEC,oBAAoB,QAAQ,kBAAkB;AACjF,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,SAAS,QAAQ,oCAAoC;AAC9D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,KAAK,QAAQ,4BAA4B;AA2ClD,MAAMC,gBAAgB;QAAC,EAAEC,IAAI,EAAEC,IAAI,EAAoC,WAA/BC;QAAfF;QAAMC;;IAC7B,MAAME,UAAUF,SAAS;IAEzB,MAAMG,WAAWZ;IACjB,IAAIY,aAAa,OAAO;QACtB,OAAQJ;YACN,KAAK;gBACH,OAAOG,wBACL,KAACL;oBAAMO,OAAM;oBAAIC,QAAO;mBAAQJ,4BAEhC,KAACJ;oBAAMQ,QAAO;oBAAID,OAAM;mBAAQH;YAEpC,KAAK;gBACH,qBAAO,KAACR;oBAASY,QAAO;oBAAIC,IAAI;mBAAKL;YACvC,KAAK;gBACH,qBAAO,KAACJ;oBAAMQ,QAAO;oBAAID,OAAM;mBAAQH;QAC3C;IACF;IAEA,OAAQF;QACN,KAAK;YACH,OAAOG,wBACL,KAACL;gBAAMO,OAAM;gBAAIC,QAAO;eAAQJ,4BAEhC,KAACP;gBAASW,QAAO;eAAQJ;QAE7B,KAAK;YACH,qBAAO,KAACR;gBAASY,QAAO;gBAAIC,IAAI;eAAKL;QACvC,KAAK;YACH,qBAAO,KAACP;gBAASW,QAAO;eAAQJ;IACpC;IAEA,OAAO;AACT;AAEA,MAAMM,aAAa;IACjBC,OAAO;IACPC,SAAS;IACTC,QAAQ;AACV;AACA;;CAEC,GACD,OAAO,MAAMC,SAAS;QAAC,EACrBZ,OAAO,SAAS,EAChBC,OAAO,SAAS,EAChBY,YAAY,IAAI,EAChBC,QAAQ,EACRC,QAAQ,EACRC,oBAAoB,MAAM,EAC1BC,SAAS,EACTC,KAAK,EACLC,SAAS,EACTC,MAAM,EACNC,WAAW,EACXC,UAAU,EACVC,cAAc,EACdC,aAAa,EAED,WADTtB;QAdHF;QACAC;QACAY;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,MAAC/B,uDACKS;QACJuB,eAAepC,yBAEbmB,UAAU,CAACR,KAAK,EAChBC,SAAS,gCACTV,qBAAqB0B,gCACrB3B,aAAayB;;YAGdK,wBACC,KAACM;gBACCC,WAAWtC,iCAET0B;0BAGDK;;0BAGL,MAACM;gBAAIC,SAAS;;kCACZ,MAAC5B;wBACC4B,SAAS;wBACTd,WAAWA;wBACXb,MAAMA;wBACNC,MAAMA;;4BAELoB,6BAAe,KAACK;gCAAIC,SAAS;0CAAsCN;;0CACpE,KAACO;gCACCD,WAAWtC,qCAET8B;0CAGDL;;4BAEFQ,4BAAc,KAACI;gCAAIC,SAAS;0CAAqCL;;4BACjEhC,aAAa2B,4BACZ,KAACvB;gCAASiC,SAAS;gCAA+BrB,QAAO;0CACtDW;;;;oBAIN3B,aAAayB,2BACZ,MAACW;wBAAIC,SAAS;;4BACXJ,gCACC,KAACG;gCAAIC,SAAS;0CAAqCJ;;0CAErD,KAAC1B;gCACC8B,WAAWtC,mCAET8B;gCAEFN,WAAWG;0CAEVD;;4BAEFS,+BACC,KAACE;gCAAIC,SAAS;0CAAoCH;;;;;;YAMzDlC,aAAa4B,wBACZ,KAACtB;gBAAU+B,SAAS;gBAA2Bd,WAAU;0BACtDK;;;;AAKX,EAAE"}

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { HasRef, HasRootRef } from '../../types';
+import type { HasRef, HasRootRef } from '../../types';
 import { type TappableProps } from '../Tappable/Tappable';
 export interface HorizontalCellProps extends Omit<TappableProps, 'size' | 'getRootRef'>, HasRootRef<HTMLDivElement>, HasRef<HTMLDivElement> {
     size?: 's' | 'm' | 'l';

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

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCell.d.ts","sourceRoot":"","sources":["../../../src/components/HorizontalCell/HorizontalCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,UAAU,EAA6B,MAAM,aAAa,CAAC;AAE5E,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAwBpE,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,YAAY,CAAC,EAChD,UAAU,CAAC,cAAc,CAAC,EAC1B,MAAM,CAAC,cAAc,CAAC;IACxB,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACvB;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACjC;AAED;;GAEG;AACH,eAAO,MAAM,cAAc,4GAWxB,mBAAmB,KAAG,KAAK,CAAC,SAyB9B,CAAC"}
+{"version":3,"file":"HorizontalCell.d.ts","sourceRoot":"","sources":["../../../src/components/HorizontalCell/HorizontalCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAA6B,MAAM,aAAa,CAAC;AAEjF,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAwBpE,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,YAAY,CAAC,EAChD,UAAU,CAAC,cAAc,CAAC,EAC1B,MAAM,CAAC,cAAc,CAAC;IACxB,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACvB;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACjC;AAED;;GAEG;AACH,eAAO,MAAM,cAAc,4GAWxB,mBAAmB,KAAG,KAAK,CAAC,SAyB9B,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/HorizontalCell/HorizontalCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { HasRef, HasRootRef, HTMLAttributesWithRootRef } from '../../types';\nimport { Avatar } from '../Avatar/Avatar';\nimport { Tappable, type TappableProps } from '../Tappable/Tappable';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './HorizontalCell.module.css';\n\nconst stylesSize = {\n  s: styles['HorizontalCell--size-s'],\n  m: styles['HorizontalCell--size-m'],\n  l: styles['HorizontalCell--size-l'],\n};\n\ninterface CellTypographyProps extends HTMLAttributesWithRootRef<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 Omit<TappableProps, 'size' | 'getRootRef'>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  size?: 's' | 'm' | 'l';\n  /**\n   * Заголовок\n   */\n  header?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\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  extraSubtitle,\n  ...restProps\n}: HorizontalCellProps): React.ReactNode => {\n  return (\n    <div\n      ref={getRootRef}\n      style={style}\n      className={classNames(styles['HorizontalCell'], stylesSize[size], className)}\n    >\n      <Tappable className={styles['HorizontalCell__body']} getRootRef={getRef} {...restProps}>\n        {hasReactNode(children) && (\n          <div className={styles['HorizontalCell__image']}>{children}</div>\n        )}\n        {(header || subtitle || extraSubtitle) && (\n          <div className={styles['HorizontalCell__content']}>\n            {hasReactNode(header) && <CellTypography size={size}>{header}</CellTypography>}\n            {hasReactNode(subtitle) && (\n              <Footnote className={styles['HorizontalCell__subtitle']}>{subtitle}</Footnote>\n            )}\n            {hasReactNode(extraSubtitle) && (\n              <Footnote className={styles['HorizontalCell__subtitle']}>{extraSubtitle}</Footnote>\n            )}\n          </div>\n        )}\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["React","classNames","hasReactNode","Avatar","Tappable","Caption","Footnote","Subhead","stylesSize","s","m","l","CellTypography","size","children","restProps","HorizontalCell","className","header","style","subtitle","getRootRef","getRef","extraSubtitle","div","ref"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAE3D,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,QAAQ,QAA4B,uBAAuB;AACpE,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,OAAO,QAAQ,gCAAgC;AAGxD,MAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;IACDC,CAAC;AACH;AAMA,MAAMC,iBAAiB;QAAC,EAAEC,IAAI,EAAEC,QAAQ,EAAqC,WAAhCC;QAAnBF;QAAMC;;IAC9B,OAAOD,SAAS,oBACd,KAACR,iDAAYU;kBAAYD;wBAEzB,KAACP,iDAAYQ;kBAAYD;;AAE7B;AAqBA;;CAEC,GACD,OAAO,MAAME,iBAAiB;QAAC,EAC7BC,SAAS,EACTC,MAAM,EACNC,KAAK,EACLC,QAAQ,EACRP,OAAO,GAAG,EACVC,yBAAW,KAACX;QAAOU,MAAM;MAAM,EAC/BQ,UAAU,EACVC,MAAM,EACNC,aAAa,EAEO,WADjBR;QATHE;QACAC;QACAC;QACAC;QACAP;QACAC;QACAO;QACAC;QACAC;;IAGA,qBACE,KAACC;QACCC,KAAKJ;QACLF,OAAOA;QACPF,WAAWhB,iCAAqCO,UAAU,CAACK,KAAK,EAAEI;kBAElE,cAAA,MAACb;YAASa,SAAS;YAAkCI,YAAYC;WAAYP;;gBAC1Eb,aAAaY,2BACZ,KAACU;oBAAIP,SAAS;8BAAoCH;;gBAElDI,CAAAA,UAAUE,YAAYG,aAAY,mBAClC,MAACC;oBAAIP,SAAS;;wBACXf,aAAagB,yBAAW,KAACN;4BAAeC,MAAMA;sCAAOK;;wBACrDhB,aAAakB,2BACZ,KAACd;4BAASW,SAAS;sCAAuCG;;wBAE3DlB,aAAaqB,gCACZ,KAACjB;4BAASW,SAAS;sCAAuCM;;;;;;;AAOxE,EAAE"}
+{"version":3,"sources":["../../../src/components/HorizontalCell/HorizontalCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport type { HasRef, HasRootRef, HTMLAttributesWithRootRef } from '../../types';\nimport { Avatar } from '../Avatar/Avatar';\nimport { Tappable, type TappableProps } from '../Tappable/Tappable';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './HorizontalCell.module.css';\n\nconst stylesSize = {\n  s: styles['HorizontalCell--size-s'],\n  m: styles['HorizontalCell--size-m'],\n  l: styles['HorizontalCell--size-l'],\n};\n\ninterface CellTypographyProps extends HTMLAttributesWithRootRef<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 Omit<TappableProps, 'size' | 'getRootRef'>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  size?: 's' | 'm' | 'l';\n  /**\n   * Заголовок\n   */\n  header?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\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  extraSubtitle,\n  ...restProps\n}: HorizontalCellProps): React.ReactNode => {\n  return (\n    <div\n      ref={getRootRef}\n      style={style}\n      className={classNames(styles['HorizontalCell'], stylesSize[size], className)}\n    >\n      <Tappable className={styles['HorizontalCell__body']} getRootRef={getRef} {...restProps}>\n        {hasReactNode(children) && (\n          <div className={styles['HorizontalCell__image']}>{children}</div>\n        )}\n        {(header || subtitle || extraSubtitle) && (\n          <div className={styles['HorizontalCell__content']}>\n            {hasReactNode(header) && <CellTypography size={size}>{header}</CellTypography>}\n            {hasReactNode(subtitle) && (\n              <Footnote className={styles['HorizontalCell__subtitle']}>{subtitle}</Footnote>\n            )}\n            {hasReactNode(extraSubtitle) && (\n              <Footnote className={styles['HorizontalCell__subtitle']}>{extraSubtitle}</Footnote>\n            )}\n          </div>\n        )}\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["React","classNames","hasReactNode","Avatar","Tappable","Caption","Footnote","Subhead","stylesSize","s","m","l","CellTypography","size","children","restProps","HorizontalCell","className","header","style","subtitle","getRootRef","getRef","extraSubtitle","div","ref"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAE3D,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,QAAQ,QAA4B,uBAAuB;AACpE,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,OAAO,QAAQ,gCAAgC;AAGxD,MAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;IACDC,CAAC;AACH;AAMA,MAAMC,iBAAiB;QAAC,EAAEC,IAAI,EAAEC,QAAQ,EAAqC,WAAhCC;QAAnBF;QAAMC;;IAC9B,OAAOD,SAAS,oBACd,KAACR,iDAAYU;kBAAYD;wBAEzB,KAACP,iDAAYQ;kBAAYD;;AAE7B;AAqBA;;CAEC,GACD,OAAO,MAAME,iBAAiB;QAAC,EAC7BC,SAAS,EACTC,MAAM,EACNC,KAAK,EACLC,QAAQ,EACRP,OAAO,GAAG,EACVC,yBAAW,KAACX;QAAOU,MAAM;MAAM,EAC/BQ,UAAU,EACVC,MAAM,EACNC,aAAa,EAEO,WADjBR;QATHE;QACAC;QACAC;QACAC;QACAP;QACAC;QACAO;QACAC;QACAC;;IAGA,qBACE,KAACC;QACCC,KAAKJ;QACLF,OAAOA;QACPF,WAAWhB,iCAAqCO,UAAU,CAACK,KAAK,EAAEI;kBAElE,cAAA,MAACb;YAASa,SAAS;YAAkCI,YAAYC;WAAYP;;gBAC1Eb,aAAaY,2BACZ,KAACU;oBAAIP,SAAS;8BAAoCH;;gBAElDI,CAAAA,UAAUE,YAAYG,aAAY,mBAClC,MAACC;oBAAIP,SAAS;;wBACXf,aAAagB,yBAAW,KAACN;4BAAeC,MAAMA;sCAAOK;;wBACrDhB,aAAakB,2BACZ,KAACd;4BAASW,SAAS;sCAAuCG;;wBAE3DlB,aAAaqB,gCACZ,KAACjB;4BAASW,SAAS;sCAAuCM;;;;;;;AAOxE,EAAE"}

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

@@ -1,7 +1,7 @@
-import { HasRef, HasRootRef, LiteralUnion } from '../../../types';
+import type { HasRef, HasRootRef, LiteralUnion } from '../../../types';
 import type { ImageBaseSize } from '../../ImageBase/ImageBase';
-import { TappableProps } from '../../Tappable/Tappable';
-import { SubheadProps } from '../../Typography/Subhead/Subhead';
+import { type TappableProps } from '../../Tappable/Tappable';
+import { type SubheadProps } from '../../Typography/Subhead/Subhead';
 export interface HorizontalCellShowMoreProps extends Omit<TappableProps, 'getRootRef' | 'size'>, HasRef<HTMLElement>, HasRootRef<HTMLDivElement> {
     /**
      * Задаёт высоту компонента. Должeн соответствовать размеру картинок

package/dist/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCellShowMore.d.ts","sourceRoot":"","sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAY,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAClE,OAAO,EAAW,YAAY,EAAE,MAAM,kCAAkC,CAAC;AASzE,MAAM,WAAW,2BACf,SAAQ,IAAI,CAAC,aAAa,EAAE,YAAY,GAAG,MAAM,CAAC,EAChD,MAAM,CAAC,WAAW,CAAC,EACnB,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC7C;;;OAGG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACvB;;;SAGK;IACL,QAAQ,CAAC,EAAE,YAAY,CAAC,UAAU,CAAC,CAAC;IACpC;;;;OAIG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,sBAAsB,uHAWhC,2BAA2B,KAAG,KAAK,CAAC,SAgCtC,CAAC"}
+{"version":3,"file":"HorizontalCellShowMore.d.ts","sourceRoot":"","sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACvE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAS9E,MAAM,WAAW,2BACf,SAAQ,IAAI,CAAC,aAAa,EAAE,YAAY,GAAG,MAAM,CAAC,EAChD,MAAM,CAAC,WAAW,CAAC,EACnB,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC7C;;;OAGG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACvB;;;SAGK;IACL,QAAQ,CAAC,EAAE,YAAY,CAAC,UAAU,CAAC,CAAC;IACpC;;;;OAIG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,sBAAsB,uHAWhC,2BAA2B,KAAG,KAAK,CAAC,SAgCtC,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"sourcesContent":["import { Icon28ChevronRightCircle } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasRef, HasRootRef, LiteralUnion } from '../../../types';\nimport type { ImageBaseSize } from '../../ImageBase/ImageBase';\nimport { Tappable, TappableProps } from '../../Tappable/Tappable';\nimport { Subhead, SubheadProps } from '../../Typography/Subhead/Subhead';\nimport styles from './HorizontalCellShowMore.module.css';\n\nconst sizeClassNames = {\n  s: styles['HorizontalCellShowMore--size-s'],\n  m: styles['HorizontalCellShowMore--size-m'],\n  l: styles['HorizontalCellShowMore--size-l'],\n};\n\nexport interface HorizontalCellShowMoreProps\n  extends Omit<TappableProps, 'getRootRef' | 'size'>,\n    HasRef<HTMLElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Задаёт высоту компонента. Должeн соответствовать размеру картинок\n   * внутри соседних `HorizontalCell` компонентов.\n   *\n   * Используйте размеры заданные дизайн-системой (см. типы).\n   *\n   * > ⚠️ Использование кастомного размера – это пограничный кейс.\n   *\n   * Игнорируется если `size='s'`.\n   */\n  height?: LiteralUnion<ImageBaseSize, number>;\n  /**\n   * Задаёт размер компонента. Аналогичен такому же пропу у [HorizontalCell](https://vkcom.github.io/VKUI/#/HorizontalCellShowMore?id=props).\n   * Должен соответствовать значению пропа `size` соседних `HorizontalCell`.\n   */\n  size?: 's' | 'm' | 'l';\n  /**\n   * Предназначен для отрисовки текста.\n   * По умолчанию для `size='s'` содержит текст `Все` для других размеров `Показать все`.\n   * */\n  children?: SubheadProps['children'];\n  /**\n   * Позволяет компенсировать особый правый отступ у предшевствующего элементa `HorizontalCell`,\n   * в том случае, если тот элемент последний в родителе.\n   * Если `HorizontalCellShowMore` находится на одном уровне с остальными `HorizontalCell`, то этот проп использовать не нужно.\n   */\n  compensateLastCellIndent?: boolean;\n  /**\n   * Выравнивание по центру относительно родителя\n   */\n  centered?: boolean;\n}\n\nexport const HorizontalCellShowMore = ({\n  className,\n  style,\n  getRef,\n  getRootRef,\n  compensateLastCellIndent,\n  height,\n  size = 's',\n  children = size === 's' ? 'Все' : 'Показать все',\n  centered = false,\n  ...restProps\n}: HorizontalCellShowMoreProps): React.ReactNode => {\n  return (\n    <div\n      style={style}\n      className={classNames(\n        styles['HorizontalCellShowMore'],\n        compensateLastCellIndent && styles['HorizontalCellShowMore--compensate-last-cell-indent'],\n        centered && styles['HorizontalCellShowMore--centered'],\n        sizeClassNames[size],\n        className,\n      )}\n      ref={getRootRef}\n    >\n      <Tappable\n        style={size === 's' ? undefined : { height }}\n        className={styles['HorizontalCellShowMore__body']}\n        getRootRef={getRef}\n        activeMode=\"opacity\"\n        hoverMode=\"opacity\"\n        {...restProps}\n      >\n        <Icon28ChevronRightCircle\n          className={styles['HorizontalCellShowMore__icon']}\n          fill=\"currentColor\"\n        />\n\n        <Subhead className={styles['HorizontalCellShowMore__text']} weight=\"2\">\n          {children}\n        </Subhead>\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["Icon28ChevronRightCircle","classNames","Tappable","Subhead","sizeClassNames","s","m","l","HorizontalCellShowMore","className","style","getRef","getRootRef","compensateLastCellIndent","height","size","children","centered","restProps","div","ref","undefined","activeMode","hoverMode","fill","weight"],"mappings":";;;;AAAA,SAASA,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,UAAU,QAAQ,kBAAkB;AAG7C,SAASC,QAAQ,QAAuB,0BAA0B;AAClE,SAASC,OAAO,QAAsB,mCAAmC;AAGzE,MAAMC,iBAAiB;IACrBC,CAAC;IACDC,CAAC;IACDC,CAAC;AACH;AAuCA,OAAO,MAAMC,yBAAyB;QAAC,EACrCC,SAAS,EACTC,KAAK,EACLC,MAAM,EACNC,UAAU,EACVC,wBAAwB,EACxBC,MAAM,EACNC,OAAO,GAAG,EACVC,WAAWD,SAAS,MAAM,QAAQ,cAAc,EAChDE,WAAW,KAAK,EAEY,WADzBC;QATHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,KAACE;QACCT,OAAOA;QACPD,WAAWR,yCAETY,uFACAI,oDACAb,cAAc,CAACW,KAAK,EACpBN;QAEFW,KAAKR;kBAEL,cAAA,MAACV;YACCQ,OAAOK,SAAS,MAAMM,YAAY;gBAAEP;YAAO;YAC3CL,SAAS;YACTG,YAAYD;YACZW,YAAW;YACXC,WAAU;WACNL;;8BAEJ,KAAClB;oBACCS,SAAS;oBACTe,MAAK;;8BAGP,KAACrB;oBAAQM,SAAS;oBAA0CgB,QAAO;8BAChET;;;;;AAKX,EAAE"}
+{"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"sourcesContent":["import { Icon28ChevronRightCircle } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasRef, HasRootRef, LiteralUnion } from '../../../types';\nimport type { ImageBaseSize } from '../../ImageBase/ImageBase';\nimport { Tappable, type TappableProps } from '../../Tappable/Tappable';\nimport { Subhead, type SubheadProps } from '../../Typography/Subhead/Subhead';\nimport styles from './HorizontalCellShowMore.module.css';\n\nconst sizeClassNames = {\n  s: styles['HorizontalCellShowMore--size-s'],\n  m: styles['HorizontalCellShowMore--size-m'],\n  l: styles['HorizontalCellShowMore--size-l'],\n};\n\nexport interface HorizontalCellShowMoreProps\n  extends Omit<TappableProps, 'getRootRef' | 'size'>,\n    HasRef<HTMLElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Задаёт высоту компонента. Должeн соответствовать размеру картинок\n   * внутри соседних `HorizontalCell` компонентов.\n   *\n   * Используйте размеры заданные дизайн-системой (см. типы).\n   *\n   * > ⚠️ Использование кастомного размера – это пограничный кейс.\n   *\n   * Игнорируется если `size='s'`.\n   */\n  height?: LiteralUnion<ImageBaseSize, number>;\n  /**\n   * Задаёт размер компонента. Аналогичен такому же пропу у [HorizontalCell](https://vkcom.github.io/VKUI/#/HorizontalCellShowMore?id=props).\n   * Должен соответствовать значению пропа `size` соседних `HorizontalCell`.\n   */\n  size?: 's' | 'm' | 'l';\n  /**\n   * Предназначен для отрисовки текста.\n   * По умолчанию для `size='s'` содержит текст `Все` для других размеров `Показать все`.\n   * */\n  children?: SubheadProps['children'];\n  /**\n   * Позволяет компенсировать особый правый отступ у предшевствующего элементa `HorizontalCell`,\n   * в том случае, если тот элемент последний в родителе.\n   * Если `HorizontalCellShowMore` находится на одном уровне с остальными `HorizontalCell`, то этот проп использовать не нужно.\n   */\n  compensateLastCellIndent?: boolean;\n  /**\n   * Выравнивание по центру относительно родителя\n   */\n  centered?: boolean;\n}\n\nexport const HorizontalCellShowMore = ({\n  className,\n  style,\n  getRef,\n  getRootRef,\n  compensateLastCellIndent,\n  height,\n  size = 's',\n  children = size === 's' ? 'Все' : 'Показать все',\n  centered = false,\n  ...restProps\n}: HorizontalCellShowMoreProps): React.ReactNode => {\n  return (\n    <div\n      style={style}\n      className={classNames(\n        styles['HorizontalCellShowMore'],\n        compensateLastCellIndent && styles['HorizontalCellShowMore--compensate-last-cell-indent'],\n        centered && styles['HorizontalCellShowMore--centered'],\n        sizeClassNames[size],\n        className,\n      )}\n      ref={getRootRef}\n    >\n      <Tappable\n        style={size === 's' ? undefined : { height }}\n        className={styles['HorizontalCellShowMore__body']}\n        getRootRef={getRef}\n        activeMode=\"opacity\"\n        hoverMode=\"opacity\"\n        {...restProps}\n      >\n        <Icon28ChevronRightCircle\n          className={styles['HorizontalCellShowMore__icon']}\n          fill=\"currentColor\"\n        />\n\n        <Subhead className={styles['HorizontalCellShowMore__text']} weight=\"2\">\n          {children}\n        </Subhead>\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["Icon28ChevronRightCircle","classNames","Tappable","Subhead","sizeClassNames","s","m","l","HorizontalCellShowMore","className","style","getRef","getRootRef","compensateLastCellIndent","height","size","children","centered","restProps","div","ref","undefined","activeMode","hoverMode","fill","weight"],"mappings":";;;;AAAA,SAASA,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,UAAU,QAAQ,kBAAkB;AAG7C,SAASC,QAAQ,QAA4B,0BAA0B;AACvE,SAASC,OAAO,QAA2B,mCAAmC;AAG9E,MAAMC,iBAAiB;IACrBC,CAAC;IACDC,CAAC;IACDC,CAAC;AACH;AAuCA,OAAO,MAAMC,yBAAyB;QAAC,EACrCC,SAAS,EACTC,KAAK,EACLC,MAAM,EACNC,UAAU,EACVC,wBAAwB,EACxBC,MAAM,EACNC,OAAO,GAAG,EACVC,WAAWD,SAAS,MAAM,QAAQ,cAAc,EAChDE,WAAW,KAAK,EAEY,WADzBC;QATHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,KAACE;QACCT,OAAOA;QACPD,WAAWR,yCAETY,uFACAI,oDACAb,cAAc,CAACW,KAAK,EACpBN;QAEFW,KAAKR;kBAEL,cAAA,MAACV;YACCQ,OAAOK,SAAS,MAAMM,YAAY;gBAAEP;YAAO;YAC3CL,SAAS;YACTG,YAAYD;YACZW,YAAW;YACXC,WAAU;WACNL;;8BAEJ,KAAClB;oBACCS,SAAS;oBACTe,MAAK;;8BAGP,KAACrB;oBAAQM,SAAS;oBAA0CgB,QAAO;8BAChET;;;;;AAKX,EAAE"}

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { HasRef, HTMLAttributesWithRootRef } from '../../types';
+import type { HasRef, HTMLAttributesWithRootRef } from '../../types';
 export type ScrollPositionHandler = (currentPosition: number) => number;
 export interface HorizontalScrollProps extends HTMLAttributesWithRootRef<HTMLDivElement>, HasRef<HTMLDivElement> {
     /**

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

@@ -1 +1 @@
-{"version":3,"file":"HorizontalScroll.d.ts","sourceRoot":"","sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EAAE,MAAM,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAqBhE,MAAM,MAAM,qBAAqB,GAAG,CAAC,eAAe,EAAE,MAAM,KAAK,MAAM,CAAC;AAExE,MAAM,WAAW,qBACf,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAC/C,MAAM,CAAC,cAAc,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,qBAAqB,CAAC;IACxC;;OAEG;IACH,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,SAAS,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACtB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAChC,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAsGD;;GAEG;AACH,eAAO,MAAM,gBAAgB,kKAY1B,qBAAqB,KAAG,KAAK,CAAC,SAsJhC,CAAC"}
+{"version":3,"file":"HorizontalScroll.d.ts","sourceRoot":"","sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAE,MAAM,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAqBrE,MAAM,MAAM,qBAAqB,GAAG,CAAC,eAAe,EAAE,MAAM,KAAK,MAAM,CAAC;AAExE,MAAM,WAAW,qBACf,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAC/C,MAAM,CAAC,cAAc,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,qBAAqB,CAAC;IACxC;;OAEG;IACH,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,SAAS,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACtB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAChC,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAsGD;;GAEG;AACH,eAAO,MAAM,gBAAgB,kKAY1B,qBAAqB,KAAG,KAAK,CAAC,SAsJhC,CAAC"}

package/dist/components/HorizontalScroll/HorizontalScroll.js

@@ -199,7 +199,7 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
         onMouseEnter: calculateArrowsVisibility,
         children: [
             showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && /*#__PURE__*/ _jsx(ScrollArrow, {
-                "data-testid": process.env.NODE_ENV === 'test' ? 'ScrollArrow' : undefined,
+                "data-testid": process.env.NODE_ENV === 'test' ? 'ScrollArrowLeft' : undefined,
                 size: arrowSize,
                 offsetY: arrowOffsetY,
                 direction: "left",
@@ -209,7 +209,7 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
                 onClick: scrollToLeft
             }),
             showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && /*#__PURE__*/ _jsx(ScrollArrow, {
-                "data-testid": process.env.NODE_ENV === 'test' ? 'ScrollArrow' : undefined,
+                "data-testid": process.env.NODE_ENV === 'test' ? 'ScrollArrowRight' : undefined,
                 size: arrowSize,
                 offsetY: arrowOffsetY,
                 direction: "right",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { easeInOutSine } from '../../lib/fx';\nimport { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollArrow } from '../ScrollArrow/ScrollArrow';\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  onScrollToEndBorder: VoidFunction;\n  onScrollEnd: VoidFunction;\n  onScrollStart: VoidFunction;\n  /**\n   * Начальная ширина прокрутки.\n   * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n   */\n  initialScrollWidth: number;\n  textDirection: 'ltr' | 'rtl';\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Функция для расчета величины прокрутки при клике на левую стрелку.\n   */\n  getScrollToLeft?: ScrollPositionHandler;\n  /**\n   * Функция для расчета величины прокрутки при клике на правую стрелку.\n   */\n  getScrollToRight?: ScrollPositionHandler;\n  arrowSize?: 'm' | 'l';\n  /**\n   * Смещает иконки кнопок навигации по вертикали.\n   */\n  arrowOffsetY?: number | string;\n  showArrows?: boolean | 'always';\n  scrollAnimationDuration?: number;\n  /**\n   * Добавляет возможность прокручивать контент на любое колесо мыши.\n   * По умолчанию прокручивается как любой горизонтальный контент через shift.\n   */\n  scrollOnAnyWheel?: boolean;\n  /**\n   * Задает потомкам инлайновое положение (горизонально)\n   *\n   * TODO [>=7]: Сделать по умолчанию `true` (или удалить, применяя стили всегда)\n   */\n  inline?: boolean;\n}\n\n/**\n * timing method\n */\nfunction now() {\n  return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Округление к большему по модулю\n *\n * ## Пример\n *\n * ```ts\n * import { strict as assert } from 'node:assert';\n *\n * assert.equal(roundingAwayFromZero(5.1), 6)\n * assert.equal(roundingAwayFromZero(-5.1), -6)\n * ```\n */\nfunction roundingAwayFromZero(value: number): number {\n  return value > 0 ? Math.ceil(value) : Math.floor(value);\n}\n\n/**\n * Округляем el.scrollLeft\n * https://github.com/VKCOM/VKUI/pull/2445\n */\nconst roundUpElementScrollLeft = (el: HTMLElement) => roundingAwayFromZero(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  onScrollToEndBorder,\n  onScrollEnd,\n  onScrollStart,\n  initialScrollWidth,\n  scrollAnimationDuration,\n  textDirection,\n}: ScrollContext) {\n  if (!scrollElement || !getScrollPosition) {\n    return;\n  }\n\n  /**\n   * крайнее значение сдвига\n   */\n  const extremeScrollLeft =\n    (textDirection === 'ltr' ? 1 : -1) * (initialScrollWidth - scrollElement.offsetWidth);\n\n  let startScrollLeft = roundUpElementScrollLeft(scrollElement);\n  let endScrollLeft = getScrollPosition(startScrollLeft);\n\n  onScrollStart();\n\n  /**\n   * Если окончание прокрутки вышло за ноль\n   */\n  if (startScrollLeft * endScrollLeft < 0) {\n    endScrollLeft = 0;\n  }\n\n  if (Math.abs(endScrollLeft) >= Math.abs(extremeScrollLeft)) {\n    onScrollToEndBorder();\n    endScrollLeft = extremeScrollLeft;\n  }\n\n  const startTime = now();\n\n  (function scroll() {\n    const time = now();\n    const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n    const value = easeInOutSine(elapsed);\n\n    const currentScrollLeft = startScrollLeft + (endScrollLeft - startScrollLeft) * value;\n    scrollElement.scrollLeft = roundingAwayFromZero(currentScrollLeft);\n\n    const scrollEnd =\n      textDirection === 'ltr' ? Math.max(0, endScrollLeft) : Math.min(0, endScrollLeft);\n    if (roundUpElementScrollLeft(scrollElement) !== scrollEnd && 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  arrowOffsetY,\n  scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n  getRef,\n  scrollOnAnyWheel = false,\n  inline = false,\n  ...restProps\n}: HorizontalScrollProps): React.ReactNode => {\n  const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n  const [canScrollRight, setCanScrollRight] = React.useState(false);\n  const [directionRef, textDirection] = useDirection<HTMLDivElement>();\n  const direction = textDirection || 'ltr';\n  const setCanScrollStart = direction === 'ltr' ? setCanScrollLeft : setCanScrollRight;\n  const setCanScrollEnd = direction === 'ltr' ? setCanScrollRight : setCanScrollLeft;\n\n  const isCustomScrollingRef = React.useRef(false);\n\n  const scrollerRef = useExternRef(getRef, directionRef);\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          onScrollToEndBorder: () => setCanScrollEnd(false),\n          onScrollEnd: () => (isCustomScrollingRef.current = false),\n          onScrollStart: () => (isCustomScrollingRef.current = true),\n          initialScrollWidth: scrollElement?.firstElementChild?.scrollWidth || 0,\n          scrollAnimationDuration,\n          textDirection: direction,\n        }),\n      );\n      if (animationQueue.current.length === 1) {\n        animationQueue.current[0]();\n      }\n    },\n    [scrollerRef, scrollAnimationDuration, direction, setCanScrollEnd],\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 calculateArrowsVisibility = React.useCallback(() => {\n    if (showArrows && hasPointer && scrollerRef.current && !isCustomScrollingRef.current) {\n      const scrollElement = scrollerRef.current;\n\n      setCanScrollStart(scrollElement.scrollLeft !== 0);\n      setCanScrollEnd(\n        Math.abs(roundUpElementScrollLeft(scrollElement)) + scrollElement.offsetWidth <\n          scrollElement.scrollWidth,\n      );\n    }\n  }, [showArrows, hasPointer, scrollerRef, setCanScrollStart, setCanScrollEnd]);\n\n  const scrollEvent = useEventListener('scroll', calculateArrowsVisibility);\n  React.useEffect(\n    function addScrollerRefToScrollEvent() {\n      if (!scrollerRef.current) {\n        return noop;\n      }\n\n      scrollEvent.add(scrollerRef.current);\n      return scrollEvent.remove;\n    },\n    [scrollEvent, scrollerRef],\n  );\n\n  React.useEffect(calculateArrowsVisibility, [calculateArrowsVisibility, children]);\n\n  /**\n   * Прокрутка с помощью любого колеса мыши\n   */\n  const onwheel = React.useCallback(\n    (e: WheelEvent) => {\n      scrollerRef.current!.scrollBy({ left: e.deltaX + e.deltaY, behavior: 'auto' });\n      e.preventDefault();\n    },\n    [scrollerRef],\n  );\n\n  const wheelEvent = useEventListener('wheel', onwheel);\n  React.useEffect(\n    function addScrollerRefToWheelEvent() {\n      if (!scrollerRef.current || !scrollOnAnyWheel) {\n        return noop;\n      }\n\n      wheelEvent.add(scrollerRef.current);\n\n      return wheelEvent.remove;\n    },\n    [wheelEvent, scrollerRef, scrollOnAnyWheel],\n  );\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['HorizontalScroll'],\n        'vkuiInternalHorizontalScroll',\n        showArrows === 'always' && styles['HorizontalScroll--withConstArrows'],\n        inline && styles['HorizontalScroll--inline'],\n      )}\n      onMouseEnter={calculateArrowsVisibility}\n    >\n      {showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && (\n        <ScrollArrow\n          data-testid={process.env.NODE_ENV === 'test' ? 'ScrollArrow' : undefined}\n          size={arrowSize}\n          offsetY={arrowOffsetY}\n          direction=\"left\"\n          aria-hidden\n          tabIndex={-1}\n          className={classNames(\n            styles['HorizontalScroll__arrow'],\n            styles['HorizontalScroll__arrowLeft'],\n          )}\n          onClick={scrollToLeft}\n        />\n      )}\n      {showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && (\n        <ScrollArrow\n          data-testid={process.env.NODE_ENV === 'test' ? 'ScrollArrow' : undefined}\n          size={arrowSize}\n          offsetY={arrowOffsetY}\n          direction=\"right\"\n          aria-hidden\n          tabIndex={-1}\n          className={classNames(\n            styles['HorizontalScroll__arrow'],\n            styles['HorizontalScroll__arrowRight'],\n          )}\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    </RootComponent>\n  );\n};\n"],"names":["React","classNames","noop","useAdaptivityHasPointer","useDirection","useEventListener","useExternRef","easeInOutSine","RootComponent","ScrollArrow","now","performance","Date","roundingAwayFromZero","value","Math","ceil","floor","roundUpElementScrollLeft","el","scrollLeft","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToEndBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","textDirection","extremeScrollLeft","offsetWidth","startScrollLeft","endScrollLeft","abs","startTime","scroll","time","elapsed","min","currentScrollLeft","scrollEnd","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","arrowOffsetY","getRef","scrollOnAnyWheel","inline","restProps","canScrollLeft","setCanScrollLeft","useState","canScrollRight","setCanScrollRight","directionRef","direction","setCanScrollStart","setCanScrollEnd","isCustomScrollingRef","useRef","scrollerRef","hasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","calculateArrowsVisibility","scrollEvent","useEffect","addScrollerRefToScrollEvent","add","remove","onwheel","e","scrollBy","left","deltaX","deltaY","behavior","preventDefault","wheelEvent","addScrollerRefToWheelEvent","baseClassName","onMouseEnter","undefined","data-testid","process","env","NODE_ENV","size","offsetY","aria-hidden","tabIndex","className","onClick","div","ref"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { easeInOutSine } from '../../lib/fx';\nimport type { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollArrow } from '../ScrollArrow/ScrollArrow';\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  onScrollToEndBorder: VoidFunction;\n  onScrollEnd: VoidFunction;\n  onScrollStart: VoidFunction;\n  /**\n   * Начальная ширина прокрутки.\n   * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n   */\n  initialScrollWidth: number;\n  textDirection: 'ltr' | 'rtl';\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Функция для расчета величины прокрутки при клике на левую стрелку.\n   */\n  getScrollToLeft?: ScrollPositionHandler;\n  /**\n   * Функция для расчета величины прокрутки при клике на правую стрелку.\n   */\n  getScrollToRight?: ScrollPositionHandler;\n  arrowSize?: 'm' | 'l';\n  /**\n   * Смещает иконки кнопок навигации по вертикали.\n   */\n  arrowOffsetY?: number | string;\n  showArrows?: boolean | 'always';\n  scrollAnimationDuration?: number;\n  /**\n   * Добавляет возможность прокручивать контент на любое колесо мыши.\n   * По умолчанию прокручивается как любой горизонтальный контент через shift.\n   */\n  scrollOnAnyWheel?: boolean;\n  /**\n   * Задает потомкам инлайновое положение (горизонально)\n   *\n   * TODO [>=7]: Сделать по умолчанию `true` (или удалить, применяя стили всегда)\n   */\n  inline?: boolean;\n}\n\n/**\n * timing method\n */\nfunction now() {\n  return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Округление к большему по модулю\n *\n * ## Пример\n *\n * ```ts\n * import { strict as assert } from 'node:assert';\n *\n * assert.equal(roundingAwayFromZero(5.1), 6)\n * assert.equal(roundingAwayFromZero(-5.1), -6)\n * ```\n */\nfunction roundingAwayFromZero(value: number): number {\n  return value > 0 ? Math.ceil(value) : Math.floor(value);\n}\n\n/**\n * Округляем el.scrollLeft\n * https://github.com/VKCOM/VKUI/pull/2445\n */\nconst roundUpElementScrollLeft = (el: HTMLElement) => roundingAwayFromZero(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  onScrollToEndBorder,\n  onScrollEnd,\n  onScrollStart,\n  initialScrollWidth,\n  scrollAnimationDuration,\n  textDirection,\n}: ScrollContext) {\n  if (!scrollElement || !getScrollPosition) {\n    return;\n  }\n\n  /**\n   * крайнее значение сдвига\n   */\n  const extremeScrollLeft =\n    (textDirection === 'ltr' ? 1 : -1) * (initialScrollWidth - scrollElement.offsetWidth);\n\n  let startScrollLeft = roundUpElementScrollLeft(scrollElement);\n  let endScrollLeft = getScrollPosition(startScrollLeft);\n\n  onScrollStart();\n\n  /**\n   * Если окончание прокрутки вышло за ноль\n   */\n  if (startScrollLeft * endScrollLeft < 0) {\n    endScrollLeft = 0;\n  }\n\n  if (Math.abs(endScrollLeft) >= Math.abs(extremeScrollLeft)) {\n    onScrollToEndBorder();\n    endScrollLeft = extremeScrollLeft;\n  }\n\n  const startTime = now();\n\n  (function scroll() {\n    const time = now();\n    const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n    const value = easeInOutSine(elapsed);\n\n    const currentScrollLeft = startScrollLeft + (endScrollLeft - startScrollLeft) * value;\n    scrollElement.scrollLeft = roundingAwayFromZero(currentScrollLeft);\n\n    const scrollEnd =\n      textDirection === 'ltr' ? Math.max(0, endScrollLeft) : Math.min(0, endScrollLeft);\n    if (roundUpElementScrollLeft(scrollElement) !== scrollEnd && 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  arrowOffsetY,\n  scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n  getRef,\n  scrollOnAnyWheel = false,\n  inline = false,\n  ...restProps\n}: HorizontalScrollProps): React.ReactNode => {\n  const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n  const [canScrollRight, setCanScrollRight] = React.useState(false);\n  const [directionRef, textDirection] = useDirection<HTMLDivElement>();\n  const direction = textDirection || 'ltr';\n  const setCanScrollStart = direction === 'ltr' ? setCanScrollLeft : setCanScrollRight;\n  const setCanScrollEnd = direction === 'ltr' ? setCanScrollRight : setCanScrollLeft;\n\n  const isCustomScrollingRef = React.useRef(false);\n\n  const scrollerRef = useExternRef(getRef, directionRef);\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          onScrollToEndBorder: () => setCanScrollEnd(false),\n          onScrollEnd: () => (isCustomScrollingRef.current = false),\n          onScrollStart: () => (isCustomScrollingRef.current = true),\n          initialScrollWidth: scrollElement?.firstElementChild?.scrollWidth || 0,\n          scrollAnimationDuration,\n          textDirection: direction,\n        }),\n      );\n      if (animationQueue.current.length === 1) {\n        animationQueue.current[0]();\n      }\n    },\n    [scrollerRef, scrollAnimationDuration, direction, setCanScrollEnd],\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 calculateArrowsVisibility = React.useCallback(() => {\n    if (showArrows && hasPointer && scrollerRef.current && !isCustomScrollingRef.current) {\n      const scrollElement = scrollerRef.current;\n\n      setCanScrollStart(scrollElement.scrollLeft !== 0);\n      setCanScrollEnd(\n        Math.abs(roundUpElementScrollLeft(scrollElement)) + scrollElement.offsetWidth <\n          scrollElement.scrollWidth,\n      );\n    }\n  }, [showArrows, hasPointer, scrollerRef, setCanScrollStart, setCanScrollEnd]);\n\n  const scrollEvent = useEventListener('scroll', calculateArrowsVisibility);\n  React.useEffect(\n    function addScrollerRefToScrollEvent() {\n      if (!scrollerRef.current) {\n        return noop;\n      }\n\n      scrollEvent.add(scrollerRef.current);\n      return scrollEvent.remove;\n    },\n    [scrollEvent, scrollerRef],\n  );\n\n  React.useEffect(calculateArrowsVisibility, [calculateArrowsVisibility, children]);\n\n  /**\n   * Прокрутка с помощью любого колеса мыши\n   */\n  const onwheel = React.useCallback(\n    (e: WheelEvent) => {\n      scrollerRef.current!.scrollBy({ left: e.deltaX + e.deltaY, behavior: 'auto' });\n      e.preventDefault();\n    },\n    [scrollerRef],\n  );\n\n  const wheelEvent = useEventListener('wheel', onwheel);\n  React.useEffect(\n    function addScrollerRefToWheelEvent() {\n      if (!scrollerRef.current || !scrollOnAnyWheel) {\n        return noop;\n      }\n\n      wheelEvent.add(scrollerRef.current);\n\n      return wheelEvent.remove;\n    },\n    [wheelEvent, scrollerRef, scrollOnAnyWheel],\n  );\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['HorizontalScroll'],\n        'vkuiInternalHorizontalScroll',\n        showArrows === 'always' && styles['HorizontalScroll--withConstArrows'],\n        inline && styles['HorizontalScroll--inline'],\n      )}\n      onMouseEnter={calculateArrowsVisibility}\n    >\n      {showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && (\n        <ScrollArrow\n          data-testid={process.env.NODE_ENV === 'test' ? 'ScrollArrowLeft' : undefined}\n          size={arrowSize}\n          offsetY={arrowOffsetY}\n          direction=\"left\"\n          aria-hidden\n          tabIndex={-1}\n          className={classNames(\n            styles['HorizontalScroll__arrow'],\n            styles['HorizontalScroll__arrowLeft'],\n          )}\n          onClick={scrollToLeft}\n        />\n      )}\n      {showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && (\n        <ScrollArrow\n          data-testid={process.env.NODE_ENV === 'test' ? 'ScrollArrowRight' : undefined}\n          size={arrowSize}\n          offsetY={arrowOffsetY}\n          direction=\"right\"\n          aria-hidden\n          tabIndex={-1}\n          className={classNames(\n            styles['HorizontalScroll__arrow'],\n            styles['HorizontalScroll__arrowRight'],\n          )}\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    </RootComponent>\n  );\n};\n"],"names":["React","classNames","noop","useAdaptivityHasPointer","useDirection","useEventListener","useExternRef","easeInOutSine","RootComponent","ScrollArrow","now","performance","Date","roundingAwayFromZero","value","Math","ceil","floor","roundUpElementScrollLeft","el","scrollLeft","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToEndBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","textDirection","extremeScrollLeft","offsetWidth","startScrollLeft","endScrollLeft","abs","startTime","scroll","time","elapsed","min","currentScrollLeft","scrollEnd","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","arrowOffsetY","getRef","scrollOnAnyWheel","inline","restProps","canScrollLeft","setCanScrollLeft","useState","canScrollRight","setCanScrollRight","directionRef","direction","setCanScrollStart","setCanScrollEnd","isCustomScrollingRef","useRef","scrollerRef","hasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","calculateArrowsVisibility","scrollEvent","useEffect","addScrollerRefToScrollEvent","add","remove","onwheel","e","scrollBy","left","deltaX","deltaY","behavior","preventDefault","wheelEvent","addScrollerRefToWheelEvent","baseClassName","onMouseEnter","undefined","data-testid","process","env","NODE_ENV","size","offsetY","aria-hidden","tabIndex","className","onClick","div","ref"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-import { TappableProps } from '../Tappable/Tappable';
+import { type TappableProps } from '../Tappable/Tappable';
 export interface IconButtonProps extends TappableProps {
     /**
      * Текст кнопки-иконки. Делает ее доступной для ассистивных технологий

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

@@ -1 +1 @@
-{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/components/IconButton/IconButton.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAY,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAS/D,MAAM,WAAW,eAAgB,SAAQ,aAAa;IACpD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAID;;GAEG;AACH,eAAO,MAAM,UAAU,iDAKpB,eAAe,KAAG,KAAK,CAAC,SAiC1B,CAAC"}
+{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/components/IconButton/IconButton.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AASpE,MAAM,WAAW,eAAgB,SAAQ,aAAa;IACpD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAID;;GAEG;AACH,eAAO,MAAM,UAAU,iDAKpB,eAAe,KAAG,KAAK,CAAC,SAiC1B,CAAC"}

package/dist/components/IconButton/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { hasAccessibleName } from '../../lib/accessibility';\nimport { COMMON_WARNINGS, warnOnce } from '../../lib/warnOnce';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './IconButton.module.css';\n\nconst sizeYClassNames = {\n  none: styles['IconButton--sizeY-none'],\n  compact: styles['IconButton--sizeY-compact'],\n} as const;\n\nexport interface IconButtonProps extends TappableProps {\n  /**\n   * Текст кнопки-иконки. Делает ее доступной для ассистивных технологий\n   */\n  label?: string;\n}\n\nconst warn = warnOnce('IconButton');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/IconButton\n */\nexport const IconButton = ({\n  label,\n  children,\n  className,\n  ...restProps\n}: IconButtonProps): React.ReactNode => {\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n\n  if (process.env.NODE_ENV === 'development') {\n    /* istanbul ignore next: проверка в dev mode, тест на hasAccessibleName() есть в lib/accessibility.test.tsx */\n    const isAccessible = hasAccessibleName({\n      children: [children, label],\n      ...restProps,\n    });\n\n    if (!isAccessible) {\n      warn(COMMON_WARNINGS.a11y[restProps.href ? 'link-name' : 'button-name'], 'error');\n    }\n  }\n\n  return (\n    <Tappable\n      activeEffectDelay={200}\n      activeMode=\"background\"\n      Component={restProps.href ? 'a' : 'button'}\n      {...restProps}\n      className={classNames(\n        styles['IconButton'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        platform === 'ios' && styles['IconButton--ios'],\n        className,\n      )}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["classNames","useAdaptivity","usePlatform","hasAccessibleName","COMMON_WARNINGS","warnOnce","Tappable","VisuallyHidden","sizeYClassNames","none","compact","warn","IconButton","label","children","className","restProps","platform","sizeY","process","env","NODE_ENV","isAccessible","a11y","href","activeEffectDelay","activeMode","Component"],"mappings":";;;;AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,iBAAiB,QAAQ,0BAA0B;AAC5D,SAASC,eAAe,EAAEC,QAAQ,QAAQ,qBAAqB;AAC/D,SAASC,QAAQ,QAAuB,uBAAuB;AAC/D,SAASC,cAAc,QAAQ,mCAAmC;AAGlE,MAAMC,kBAAkB;IACtBC,IAAI;IACJC,OAAO;AACT;AASA,MAAMC,OAAON,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMO,aAAa;QAAC,EACzBC,KAAK,EACLC,QAAQ,EACRC,SAAS,EAEO,WADbC;QAHHH;QACAC;QACAC;;IAGA,MAAME,WAAWf;IACjB,MAAM,EAAEgB,QAAQ,MAAM,EAAE,GAAGjB;IAE3B,IAAIkB,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,4GAA4G,GAC5G,MAAMC,eAAenB,kBAAkB;YACrCW,UAAU;gBAACA;gBAAUD;aAAM;WACxBG;QAGL,IAAI,CAACM,cAAc;YACjBX,KAAKP,gBAAgBmB,IAAI,CAACP,UAAUQ,IAAI,GAAG,cAAc,cAAc,EAAE;QAC3E;IACF;IAEA,qBACE,MAAClB;QACCmB,mBAAmB;QACnBC,YAAW;QACXC,WAAWX,UAAUQ,IAAI,GAAG,MAAM;OAC9BR;QACJD,WAAWf,6BAETkB,UAAU,aAAaV,eAAe,CAACU,MAAM,EAC7CD,aAAa,gCACbF;;YAGDF,uBAAS,KAACN;0BAAgBM;;YAC1BC;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { hasAccessibleName } from '../../lib/accessibility';\nimport { COMMON_WARNINGS, warnOnce } from '../../lib/warnOnce';\nimport { Tappable, type TappableProps } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './IconButton.module.css';\n\nconst sizeYClassNames = {\n  none: styles['IconButton--sizeY-none'],\n  compact: styles['IconButton--sizeY-compact'],\n} as const;\n\nexport interface IconButtonProps extends TappableProps {\n  /**\n   * Текст кнопки-иконки. Делает ее доступной для ассистивных технологий\n   */\n  label?: string;\n}\n\nconst warn = warnOnce('IconButton');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/IconButton\n */\nexport const IconButton = ({\n  label,\n  children,\n  className,\n  ...restProps\n}: IconButtonProps): React.ReactNode => {\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n\n  if (process.env.NODE_ENV === 'development') {\n    /* istanbul ignore next: проверка в dev mode, тест на hasAccessibleName() есть в lib/accessibility.test.tsx */\n    const isAccessible = hasAccessibleName({\n      children: [children, label],\n      ...restProps,\n    });\n\n    if (!isAccessible) {\n      warn(COMMON_WARNINGS.a11y[restProps.href ? 'link-name' : 'button-name'], 'error');\n    }\n  }\n\n  return (\n    <Tappable\n      activeEffectDelay={200}\n      activeMode=\"background\"\n      Component={restProps.href ? 'a' : 'button'}\n      {...restProps}\n      className={classNames(\n        styles['IconButton'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        platform === 'ios' && styles['IconButton--ios'],\n        className,\n      )}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["classNames","useAdaptivity","usePlatform","hasAccessibleName","COMMON_WARNINGS","warnOnce","Tappable","VisuallyHidden","sizeYClassNames","none","compact","warn","IconButton","label","children","className","restProps","platform","sizeY","process","env","NODE_ENV","isAccessible","a11y","href","activeEffectDelay","activeMode","Component"],"mappings":";;;;AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,iBAAiB,QAAQ,0BAA0B;AAC5D,SAASC,eAAe,EAAEC,QAAQ,QAAQ,qBAAqB;AAC/D,SAASC,QAAQ,QAA4B,uBAAuB;AACpE,SAASC,cAAc,QAAQ,mCAAmC;AAGlE,MAAMC,kBAAkB;IACtBC,IAAI;IACJC,OAAO;AACT;AASA,MAAMC,OAAON,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMO,aAAa;QAAC,EACzBC,KAAK,EACLC,QAAQ,EACRC,SAAS,EAEO,WADbC;QAHHH;QACAC;QACAC;;IAGA,MAAME,WAAWf;IACjB,MAAM,EAAEgB,QAAQ,MAAM,EAAE,GAAGjB;IAE3B,IAAIkB,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,4GAA4G,GAC5G,MAAMC,eAAenB,kBAAkB;YACrCW,UAAU;gBAACA;gBAAUD;aAAM;WACxBG;QAGL,IAAI,CAACM,cAAc;YACjBX,KAAKP,gBAAgBmB,IAAI,CAACP,UAAUQ,IAAI,GAAG,cAAc,cAAc,EAAE;QAC3E;IACF;IAEA,qBACE,MAAClB;QACCmB,mBAAmB;QACnBC,YAAW;QACXC,WAAWX,UAAUQ,IAAI,GAAG,MAAM;OAC9BR;QACJD,WAAWf,6BAETkB,UAAU,aAAaV,eAAe,CAACU,MAAM,EAC7CD,aAAa,gCACbF;;YAGDF,uBAAS,KAACN;0BAAgBM;;YAC1BC;;;AAGP,EAAE"}

package/dist/components/ImageBase/ImageBase.js

@@ -157,7 +157,10 @@ const sizeToNumber = (size)=>{
                     className: "vkuiImageBase__fallback",
                     children: fallbackIcon
                 }),
-                children,
+                children && /*#__PURE__*/ _jsx("div", {
+                    className: "vkuiImageBase__children",
+                    children: children
+                }),
                 !noBorder && /*#__PURE__*/ _jsx("div", {
                     "aria-hidden": true,
                     className: "vkuiImageBase__border"

package/dist/components/ImageBase/ImageBase.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ImageBase/ImageBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { minOr } from '../../lib/comparing';\nimport { getFetchPriorityProp } from '../../lib/utils';\nimport type { AnchorHTMLAttributesOnly, HasRef, HasRootRef, LiteralUnion } from '../../types';\nimport { Clickable } from '../Clickable/Clickable';\nimport { ImageBaseBadge, type ImageBaseBadgeProps } from './ImageBaseBadge/ImageBaseBadge';\nimport { ImageBaseOverlay, type ImageBaseOverlayProps } from './ImageBaseOverlay/ImageBaseOverlay';\nimport { ImageBaseContext } from './context';\nimport type { ImageBaseContextProps, ImageBaseExpectedIconProps, ImageBaseSize } from './types';\nimport { validateFallbackIcon, validateSize } from './validators';\nimport styles from './ImageBase.module.css';\n\nexport type {\n  ImageBaseSize,\n  ImageBaseExpectedIconProps,\n  ImageBaseBadgeProps,\n  ImageBaseOverlayProps,\n  ImageBaseContextProps,\n};\n\nexport {\n  getBadgeIconSizeByImageBaseSize,\n  getFallbackIconSizeByImageBaseSize,\n  getOverlayIconSizeByImageBaseSize,\n} from './helpers';\n\nexport { ImageBaseContext };\n\n/**\n * Размер по умолчанию.\n */\nconst defaultSize = 24;\n\nexport interface ImageBaseProps\n  extends React.ImgHTMLAttributes<HTMLElement>,\n    AnchorHTMLAttributesOnly,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLImageElement> {\n  /**\n   * Задаёт размер картинки.\n   *\n   * Используйте размеры заданные дизайн-системой `16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 72 | 80 | 88 | 96`.\n   *\n   * > ⚠️ Использование кастомного размера – это пограничный кейс.\n   */\n  size?: LiteralUnion<ImageBaseSize, number>;\n  /**\n   * Ширина изображения\n   */\n  widthSize?: number | string;\n  /**\n   * Высота изображения\n   */\n  heightSize?: number | string;\n  /**\n   * Отключает обводку.\n   */\n  noBorder?: boolean;\n  /**\n   * Фолбек на случай, если картинка не прогрузилась.\n   *\n   * > 📝 Нужный для `<ImageBase size={...} />` размер можно узнать из функции `getFallbackIconSizeByImageBaseSize()`.\n   *\n   * > Предпочтительней использовать иконки из `@vkontakte/icons`.\n   *\n   * > 📊️ Если вы хотите передать кастомную иконку, то следует именовать её по шаблону `Icon<size><name>`. Или же\n   * > чтобы в неё был передан параметр `width`. Тогда мы сможем выводить в консоль подсказку правильного ли размера вы\n   * > использовали иконку.\n   *\n   * > ⚠️ Может перекрывать `children`.\n   */\n  fallbackIcon?: React.ReactElement<ImageBaseExpectedIconProps>;\n  /**\n   * Отключает фон, заданный по умолчанию. Полезен для отображения картинок с прозрачностью.\n   * @since 5.10.0\n   */\n  withTransparentBackground?: boolean;\n  /**\n   * Пользовательское значения стиля object-fit\n   * Подробнее можно почитать в [документации](https://developer.mozilla.org/ru/docs/Web/CSS/object-fit)\n   */\n  objectFit?: React.CSSProperties['objectFit'];\n  /**\n   * Флаг для сохранения пропорций картинки.\n   * Для корректной работы необходимо задать размеры хотя бы одной стороны картинки\n   */\n  keepAspectRatio?: boolean;\n}\n\nconst getObjectFitClassName = (objectFit: React.CSSProperties['objectFit']) => {\n  switch (objectFit) {\n    case 'contain':\n      return styles['ImageBase__img--objectFit-contain'];\n    case 'cover':\n      return styles['ImageBase__img--objectFit-cover'];\n    case 'none':\n      return styles['ImageBase__img--objectFit-none'];\n    case 'scale-down':\n      return styles['ImageBase__img--objectFit-scaleDown'];\n  }\n  return undefined;\n};\n\nconst parsePx = (value: string): number | undefined => {\n  if (value.endsWith('px')) {\n    return parseInt(value);\n  }\n  return undefined;\n};\n\nconst sizeToNumber = (size: number | string | undefined): number | undefined => {\n  if (typeof size === 'string') {\n    return parsePx(size);\n  }\n  return size;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ImageBase\n */\nexport const ImageBase: React.FC<ImageBaseProps> & {\n  Badge: typeof ImageBaseBadge;\n  Overlay: typeof ImageBaseOverlay;\n} = ({\n  alt,\n  crossOrigin,\n  decoding,\n  loading,\n  referrerPolicy,\n  sizes,\n  src,\n  srcSet,\n  useMap,\n  fetchPriority,\n  getRef,\n  size: sizeProp,\n  width: widthImg,\n  height: heightImg,\n  widthSize,\n  heightSize,\n  style,\n  noBorder = false,\n  fallbackIcon: fallbackIconProp,\n  children,\n  onLoad,\n  onError,\n  withTransparentBackground,\n  objectFit = 'cover',\n  keepAspectRatio = false,\n  ...restProps\n}: ImageBaseProps) => {\n  const size = sizeProp ?? minOr([sizeToNumber(widthSize), sizeToNumber(heightSize)], defaultSize);\n\n  const width = widthSize ?? (keepAspectRatio ? undefined : size);\n  const height = heightSize ?? (keepAspectRatio ? undefined : size);\n\n  const [loaded, setLoaded] = React.useState(false);\n  const [failed, setFailed] = React.useState(false);\n\n  const hasSrc = src || srcSet;\n  const needShowFallbackIcon = (failed || !hasSrc) && React.isValidElement(fallbackIconProp);\n\n  const fallbackIcon = needShowFallbackIcon ? fallbackIconProp : null;\n\n  if (process.env.NODE_ENV === 'development') {\n    validateSize(size);\n    if (fallbackIcon) {\n      validateFallbackIcon(size, { name: 'fallbackIcon', value: fallbackIcon });\n    }\n  }\n\n  const handleImageLoad = (event: React.SyntheticEvent<HTMLImageElement>) => {\n    if (loaded) {\n      return;\n    }\n\n    setLoaded(true);\n    setFailed(false);\n    onLoad?.(event);\n  };\n\n  const handleImageError = (event: React.SyntheticEvent<HTMLImageElement>) => {\n    setLoaded(false);\n    setFailed(true);\n    onError?.(event);\n  };\n\n  const imgRef = useExternRef(getRef);\n  const isOnLoadStatusCheckedRef = React.useRef(false);\n  React.useEffect(\n    function dispatchLoadEventForAlreadyLoadedResourceIfReactInitializedLater() {\n      if (isOnLoadStatusCheckedRef.current) {\n        return;\n      }\n      isOnLoadStatusCheckedRef.current = true;\n\n      if (imgRef.current && imgRef.current.complete && !loaded) {\n        const event = new Event('load');\n        imgRef.current.dispatchEvent(event);\n      }\n    },\n    [imgRef, loaded],\n  );\n\n  return (\n    <ImageBaseContext.Provider value={{ size }}>\n      <Clickable\n        style={{ width, height, ...style }}\n        baseClassName={classNames(\n          styles['ImageBase'],\n          loaded && styles['ImageBase--loaded'],\n          withTransparentBackground && styles['ImageBase--transparent-background'],\n        )}\n        {...restProps}\n      >\n        {hasSrc && (\n          <img\n            ref={imgRef}\n            alt={alt}\n            className={classNames(\n              styles['ImageBase__img'],\n              getObjectFitClassName(objectFit),\n              keepAspectRatio && styles['ImageBase__img--keepRatio'],\n            )}\n            crossOrigin={crossOrigin}\n            decoding={decoding}\n            loading={loading}\n            referrerPolicy={referrerPolicy}\n            style={\n              keepAspectRatio\n                ? {\n                    width: widthImg || width,\n                    height: heightImg || height,\n                  }\n                : undefined\n            }\n            sizes={sizes}\n            src={src}\n            srcSet={srcSet}\n            useMap={useMap}\n            width={widthImg}\n            height={heightImg}\n            onLoad={handleImageLoad}\n            onError={handleImageError}\n            {...getFetchPriorityProp(fetchPriority)}\n          />\n        )}\n        {fallbackIcon && <div className={styles['ImageBase__fallback']}>{fallbackIcon}</div>}\n        {children}\n        {!noBorder && <div aria-hidden className={styles['ImageBase__border']} />}\n      </Clickable>\n    </ImageBaseContext.Provider>\n  );\n};\n\nImageBase.displayName = 'ImageBase';\n\nImageBase.Badge = ImageBaseBadge;\nImageBase.Badge.displayName = 'ImageBase.Badge';\n\nImageBase.Overlay = ImageBaseOverlay;\nImageBase.Overlay.displayName = 'ImageBase.Overlay';\n"],"names":["React","classNames","useExternRef","minOr","getFetchPriorityProp","Clickable","ImageBaseBadge","ImageBaseOverlay","ImageBaseContext","validateFallbackIcon","validateSize","getBadgeIconSizeByImageBaseSize","getFallbackIconSizeByImageBaseSize","getOverlayIconSizeByImageBaseSize","defaultSize","getObjectFitClassName","objectFit","undefined","parsePx","value","endsWith","parseInt","sizeToNumber","size","ImageBase","alt","crossOrigin","decoding","loading","referrerPolicy","sizes","src","srcSet","useMap","fetchPriority","getRef","sizeProp","width","widthImg","height","heightImg","widthSize","heightSize","style","noBorder","fallbackIcon","fallbackIconProp","children","onLoad","onError","withTransparentBackground","keepAspectRatio","restProps","loaded","setLoaded","useState","failed","setFailed","hasSrc","needShowFallbackIcon","isValidElement","process","env","NODE_ENV","name","handleImageLoad","event","handleImageError","imgRef","isOnLoadStatusCheckedRef","useRef","useEffect","dispatchLoadEventForAlreadyLoadedResourceIfReactInitializedLater","current","complete","Event","dispatchEvent","Provider","baseClassName","img","ref","className","div","aria-hidden","displayName","Badge","Overlay"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,KAAK,QAAQ,sBAAsB;AAC5C,SAASC,oBAAoB,QAAQ,kBAAkB;AAEvD,SAASC,SAAS,QAAQ,yBAAyB;AACnD,SAASC,cAAc,QAAkC,kCAAkC;AAC3F,SAASC,gBAAgB,QAAoC,sCAAsC;AACnG,SAASC,gBAAgB,QAAQ,YAAY;AAE7C,SAASC,oBAAoB,EAAEC,YAAY,QAAQ,eAAe;AAWlE,SACEC,+BAA+B,EAC/BC,kCAAkC,EAClCC,iCAAiC,QAC5B,YAAY;AAEnB,SAASL,gBAAgB,GAAG;AAE5B;;CAEC,GACD,MAAMM,cAAc;AA0DpB,MAAMC,wBAAwB,CAACC;IAC7B,OAAQA;QACN,KAAK;YACH;QACF,KAAK;YACH;QACF,KAAK;YACH;QACF,KAAK;YACH;IACJ;IACA,OAAOC;AACT;AAEA,MAAMC,UAAU,CAACC;IACf,IAAIA,MAAMC,QAAQ,CAAC,OAAO;QACxB,OAAOC,SAASF;IAClB;IACA,OAAOF;AACT;AAEA,MAAMK,eAAe,CAACC;IACpB,IAAI,OAAOA,SAAS,UAAU;QAC5B,OAAOL,QAAQK;IACjB;IACA,OAAOA;AACT;AAEA;;CAEC,GACD,OAAO,MAAMC,YAGT;QAAC,EACHC,GAAG,EACHC,WAAW,EACXC,QAAQ,EACRC,OAAO,EACPC,cAAc,EACdC,KAAK,EACLC,GAAG,EACHC,MAAM,EACNC,MAAM,EACNC,aAAa,EACbC,MAAM,EACNZ,MAAMa,QAAQ,EACdC,OAAOC,QAAQ,EACfC,QAAQC,SAAS,EACjBC,SAAS,EACTC,UAAU,EACVC,KAAK,EACLC,WAAW,KAAK,EAChBC,cAAcC,gBAAgB,EAC9BC,QAAQ,EACRC,MAAM,EACNC,OAAO,EACPC,yBAAyB,EACzBlC,YAAY,OAAO,EACnBmC,kBAAkB,KAAK,EAER,WADZC;QAzBH3B;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAZ;QACAc;QACAE;QACAE;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;QACAlC;QACAmC;;IAGA,MAAM5B,OAAOa,qBAAAA,sBAAAA,WAAYjC,MAAM;QAACmB,aAAamB;QAAYnB,aAAaoB;KAAY,EAAE5B;IAEpF,MAAMuB,QAAQI,sBAAAA,uBAAAA,YAAcU,kBAAkBlC,YAAYM;IAC1D,MAAMgB,SAASG,uBAAAA,wBAAAA,aAAeS,kBAAkBlC,YAAYM;IAE5D,MAAM,CAAC8B,QAAQC,UAAU,GAAGtD,MAAMuD,QAAQ,CAAC;IAC3C,MAAM,CAACC,QAAQC,UAAU,GAAGzD,MAAMuD,QAAQ,CAAC;IAE3C,MAAMG,SAAS3B,OAAOC;IACtB,MAAM2B,uBAAuB,AAACH,CAAAA,UAAU,CAACE,MAAK,mBAAM1D,MAAM4D,cAAc,CAACd;IAEzE,MAAMD,eAAec,uBAAuBb,mBAAmB;IAE/D,IAAIe,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1CrD,aAAaa;QACb,IAAIsB,cAAc;YAChBpC,qBAAqBc,MAAM;gBAAEyC,MAAM;gBAAgB7C,OAAO0B;YAAa;QACzE;IACF;IAEA,MAAMoB,kBAAkB,CAACC;QACvB,IAAIb,QAAQ;YACV;QACF;QAEAC,UAAU;QACVG,UAAU;QACVT,mBAAAA,6BAAAA,OAASkB;IACX;IAEA,MAAMC,mBAAmB,CAACD;QACxBZ,UAAU;QACVG,UAAU;QACVR,oBAAAA,8BAAAA,QAAUiB;IACZ;IAEA,MAAME,SAASlE,aAAaiC;IAC5B,MAAMkC,2BAA2BrE,MAAMsE,MAAM,CAAC;IAC9CtE,MAAMuE,SAAS,CACb,SAASC;QACP,IAAIH,yBAAyBI,OAAO,EAAE;YACpC;QACF;QACAJ,yBAAyBI,OAAO,GAAG;QAEnC,IAAIL,OAAOK,OAAO,IAAIL,OAAOK,OAAO,CAACC,QAAQ,IAAI,CAACrB,QAAQ;YACxD,MAAMa,QAAQ,IAAIS,MAAM;YACxBP,OAAOK,OAAO,CAACG,aAAa,CAACV;QAC/B;IACF,GACA;QAACE;QAAQf;KAAO;IAGlB,qBACE,KAAC7C,iBAAiBqE,QAAQ;QAAC1D,OAAO;YAAEI;QAAK;kBACvC,cAAA,MAAClB;YACCsC,OAAO;gBAAEN;gBAAOE;eAAWI;YAC3BmC,eAAe7E,4BAEboD,mCACAH;WAEEE;;gBAEHM,wBACC,KAACqB;oBACCC,KAAKZ;oBACL3C,KAAKA;oBACLwD,WAAWhF,iCAETc,sBAAsBC,YACtBmC;oBAEFzB,aAAaA;oBACbC,UAAUA;oBACVC,SAASA;oBACTC,gBAAgBA;oBAChBc,OACEQ,kBACI;wBACEd,OAAOC,YAAYD;wBACnBE,QAAQC,aAAaD;oBACvB,IACAtB;oBAENa,OAAOA;oBACPC,KAAKA;oBACLC,QAAQA;oBACRC,QAAQA;oBACRI,OAAOC;oBACPC,QAAQC;oBACRQ,QAAQiB;oBACRhB,SAASkB;mBACL/D,qBAAqB8B;gBAG5BW,8BAAgB,KAACqC;oBAAID,SAAS;8BAAkCpC;;gBAChEE;gBACA,CAACH,0BAAY,KAACsC;oBAAIC,aAAW;oBAACF,SAAS;;;;;AAIhD,EAAE;AAEFzD,UAAU4D,WAAW,GAAG;AAExB5D,UAAU6D,KAAK,GAAG/E;AAClBkB,UAAU6D,KAAK,CAACD,WAAW,GAAG;AAE9B5D,UAAU8D,OAAO,GAAG/E;AACpBiB,UAAU8D,OAAO,CAACF,WAAW,GAAG"}
+{"version":3,"sources":["../../../src/components/ImageBase/ImageBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { minOr } from '../../lib/comparing';\nimport { getFetchPriorityProp } from '../../lib/utils';\nimport type { AnchorHTMLAttributesOnly, HasRef, HasRootRef, LiteralUnion } from '../../types';\nimport { Clickable } from '../Clickable/Clickable';\nimport { ImageBaseBadge, type ImageBaseBadgeProps } from './ImageBaseBadge/ImageBaseBadge';\nimport { ImageBaseOverlay, type ImageBaseOverlayProps } from './ImageBaseOverlay/ImageBaseOverlay';\nimport { ImageBaseContext } from './context';\nimport type { ImageBaseContextProps, ImageBaseExpectedIconProps, ImageBaseSize } from './types';\nimport { validateFallbackIcon, validateSize } from './validators';\nimport styles from './ImageBase.module.css';\n\nexport type {\n  ImageBaseSize,\n  ImageBaseExpectedIconProps,\n  ImageBaseBadgeProps,\n  ImageBaseOverlayProps,\n  ImageBaseContextProps,\n};\n\nexport {\n  getBadgeIconSizeByImageBaseSize,\n  getFallbackIconSizeByImageBaseSize,\n  getOverlayIconSizeByImageBaseSize,\n} from './helpers';\n\nexport { ImageBaseContext };\n\n/**\n * Размер по умолчанию.\n */\nconst defaultSize = 24;\n\nexport interface ImageBaseProps\n  extends React.ImgHTMLAttributes<HTMLElement>,\n    AnchorHTMLAttributesOnly,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLImageElement> {\n  /**\n   * Задаёт размер картинки.\n   *\n   * Используйте размеры заданные дизайн-системой `16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 72 | 80 | 88 | 96`.\n   *\n   * > ⚠️ Использование кастомного размера – это пограничный кейс.\n   */\n  size?: LiteralUnion<ImageBaseSize, number>;\n  /**\n   * Ширина изображения\n   */\n  widthSize?: number | string;\n  /**\n   * Высота изображения\n   */\n  heightSize?: number | string;\n  /**\n   * Отключает обводку.\n   */\n  noBorder?: boolean;\n  /**\n   * Фолбек на случай, если картинка не прогрузилась.\n   *\n   * > 📝 Нужный для `<ImageBase size={...} />` размер можно узнать из функции `getFallbackIconSizeByImageBaseSize()`.\n   *\n   * > Предпочтительней использовать иконки из `@vkontakte/icons`.\n   *\n   * > 📊️ Если вы хотите передать кастомную иконку, то следует именовать её по шаблону `Icon<size><name>`. Или же\n   * > чтобы в неё был передан параметр `width`. Тогда мы сможем выводить в консоль подсказку правильного ли размера вы\n   * > использовали иконку.\n   *\n   * > ⚠️ Может перекрывать `children`.\n   */\n  fallbackIcon?: React.ReactElement<ImageBaseExpectedIconProps>;\n  /**\n   * Отключает фон, заданный по умолчанию. Полезен для отображения картинок с прозрачностью.\n   * @since 5.10.0\n   */\n  withTransparentBackground?: boolean;\n  /**\n   * Пользовательское значения стиля object-fit\n   * Подробнее можно почитать в [документации](https://developer.mozilla.org/ru/docs/Web/CSS/object-fit)\n   */\n  objectFit?: React.CSSProperties['objectFit'];\n  /**\n   * Флаг для сохранения пропорций картинки.\n   * Для корректной работы необходимо задать размеры хотя бы одной стороны картинки\n   */\n  keepAspectRatio?: boolean;\n}\n\nconst getObjectFitClassName = (objectFit: React.CSSProperties['objectFit']) => {\n  switch (objectFit) {\n    case 'contain':\n      return styles['ImageBase__img--objectFit-contain'];\n    case 'cover':\n      return styles['ImageBase__img--objectFit-cover'];\n    case 'none':\n      return styles['ImageBase__img--objectFit-none'];\n    case 'scale-down':\n      return styles['ImageBase__img--objectFit-scaleDown'];\n  }\n  return undefined;\n};\n\nconst parsePx = (value: string): number | undefined => {\n  if (value.endsWith('px')) {\n    return parseInt(value);\n  }\n  return undefined;\n};\n\nconst sizeToNumber = (size: number | string | undefined): number | undefined => {\n  if (typeof size === 'string') {\n    return parsePx(size);\n  }\n  return size;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ImageBase\n */\nexport const ImageBase: React.FC<ImageBaseProps> & {\n  Badge: typeof ImageBaseBadge;\n  Overlay: typeof ImageBaseOverlay;\n} = ({\n  alt,\n  crossOrigin,\n  decoding,\n  loading,\n  referrerPolicy,\n  sizes,\n  src,\n  srcSet,\n  useMap,\n  fetchPriority,\n  getRef,\n  size: sizeProp,\n  width: widthImg,\n  height: heightImg,\n  widthSize,\n  heightSize,\n  style,\n  noBorder = false,\n  fallbackIcon: fallbackIconProp,\n  children,\n  onLoad,\n  onError,\n  withTransparentBackground,\n  objectFit = 'cover',\n  keepAspectRatio = false,\n  ...restProps\n}: ImageBaseProps) => {\n  const size = sizeProp ?? minOr([sizeToNumber(widthSize), sizeToNumber(heightSize)], defaultSize);\n\n  const width = widthSize ?? (keepAspectRatio ? undefined : size);\n  const height = heightSize ?? (keepAspectRatio ? undefined : size);\n\n  const [loaded, setLoaded] = React.useState(false);\n  const [failed, setFailed] = React.useState(false);\n\n  const hasSrc = src || srcSet;\n  const needShowFallbackIcon = (failed || !hasSrc) && React.isValidElement(fallbackIconProp);\n\n  const fallbackIcon = needShowFallbackIcon ? fallbackIconProp : null;\n\n  if (process.env.NODE_ENV === 'development') {\n    validateSize(size);\n    if (fallbackIcon) {\n      validateFallbackIcon(size, { name: 'fallbackIcon', value: fallbackIcon });\n    }\n  }\n\n  const handleImageLoad = (event: React.SyntheticEvent<HTMLImageElement>) => {\n    if (loaded) {\n      return;\n    }\n\n    setLoaded(true);\n    setFailed(false);\n    onLoad?.(event);\n  };\n\n  const handleImageError = (event: React.SyntheticEvent<HTMLImageElement>) => {\n    setLoaded(false);\n    setFailed(true);\n    onError?.(event);\n  };\n\n  const imgRef = useExternRef(getRef);\n  const isOnLoadStatusCheckedRef = React.useRef(false);\n  React.useEffect(\n    function dispatchLoadEventForAlreadyLoadedResourceIfReactInitializedLater() {\n      if (isOnLoadStatusCheckedRef.current) {\n        return;\n      }\n      isOnLoadStatusCheckedRef.current = true;\n\n      if (imgRef.current && imgRef.current.complete && !loaded) {\n        const event = new Event('load');\n        imgRef.current.dispatchEvent(event);\n      }\n    },\n    [imgRef, loaded],\n  );\n\n  return (\n    <ImageBaseContext.Provider value={{ size }}>\n      <Clickable\n        style={{ width, height, ...style }}\n        baseClassName={classNames(\n          styles['ImageBase'],\n          loaded && styles['ImageBase--loaded'],\n          withTransparentBackground && styles['ImageBase--transparent-background'],\n        )}\n        {...restProps}\n      >\n        {hasSrc && (\n          <img\n            ref={imgRef}\n            alt={alt}\n            className={classNames(\n              styles['ImageBase__img'],\n              getObjectFitClassName(objectFit),\n              keepAspectRatio && styles['ImageBase__img--keepRatio'],\n            )}\n            crossOrigin={crossOrigin}\n            decoding={decoding}\n            loading={loading}\n            referrerPolicy={referrerPolicy}\n            style={\n              keepAspectRatio\n                ? {\n                    width: widthImg || width,\n                    height: heightImg || height,\n                  }\n                : undefined\n            }\n            sizes={sizes}\n            src={src}\n            srcSet={srcSet}\n            useMap={useMap}\n            width={widthImg}\n            height={heightImg}\n            onLoad={handleImageLoad}\n            onError={handleImageError}\n            {...getFetchPriorityProp(fetchPriority)}\n          />\n        )}\n        {fallbackIcon && <div className={styles['ImageBase__fallback']}>{fallbackIcon}</div>}\n        {children && <div className={styles['ImageBase__children']}>{children}</div>}\n        {!noBorder && <div aria-hidden className={styles['ImageBase__border']} />}\n      </Clickable>\n    </ImageBaseContext.Provider>\n  );\n};\n\nImageBase.displayName = 'ImageBase';\n\nImageBase.Badge = ImageBaseBadge;\nImageBase.Badge.displayName = 'ImageBase.Badge';\n\nImageBase.Overlay = ImageBaseOverlay;\nImageBase.Overlay.displayName = 'ImageBase.Overlay';\n"],"names":["React","classNames","useExternRef","minOr","getFetchPriorityProp","Clickable","ImageBaseBadge","ImageBaseOverlay","ImageBaseContext","validateFallbackIcon","validateSize","getBadgeIconSizeByImageBaseSize","getFallbackIconSizeByImageBaseSize","getOverlayIconSizeByImageBaseSize","defaultSize","getObjectFitClassName","objectFit","undefined","parsePx","value","endsWith","parseInt","sizeToNumber","size","ImageBase","alt","crossOrigin","decoding","loading","referrerPolicy","sizes","src","srcSet","useMap","fetchPriority","getRef","sizeProp","width","widthImg","height","heightImg","widthSize","heightSize","style","noBorder","fallbackIcon","fallbackIconProp","children","onLoad","onError","withTransparentBackground","keepAspectRatio","restProps","loaded","setLoaded","useState","failed","setFailed","hasSrc","needShowFallbackIcon","isValidElement","process","env","NODE_ENV","name","handleImageLoad","event","handleImageError","imgRef","isOnLoadStatusCheckedRef","useRef","useEffect","dispatchLoadEventForAlreadyLoadedResourceIfReactInitializedLater","current","complete","Event","dispatchEvent","Provider","baseClassName","img","ref","className","div","aria-hidden","displayName","Badge","Overlay"],"mappings":"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"}

package/dist/components/ImageBase/ImageBaseBadge/ImageBaseBadge.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { HTMLAttributesWithRootRef } from '../../../types';
+import type { HTMLAttributesWithRootRef } from '../../../types';
 import type { ImageBaseExpectedIconProps } from '../types';
 export interface ImageBaseBadgeProps extends HTMLAttributesWithRootRef<HTMLDivElement> {
     /**

package/dist/components/ImageBase/ImageBaseBadge/ImageBaseBadge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ImageBaseBadge.d.ts","sourceRoot":"","sources":["../../../../src/components/ImageBase/ImageBaseBadge/ImageBaseBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAG3D,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,UAAU,CAAC;AAmB3D,MAAM,WAAW,mBAAoB,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IACpF;;;;;OAKG;IACH,UAAU,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IACjC;;;;;;;;;;OAUG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,0BAA0B,CAAC,CAAC;CAC1D;AAED;;;;GAIG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAexD,CAAC"}
+{"version":3,"file":"ImageBaseBadge.d.ts","sourceRoot":"","sources":["../../../../src/components/ImageBase/ImageBaseBadge/ImageBaseBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAGhE,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,UAAU,CAAC;AAmB3D,MAAM,WAAW,mBAAoB,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IACpF;;;;;OAKG;IACH,UAAU,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IACjC;;;;;;;;;;OAUG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,0BAA0B,CAAC,CAAC;CAC1D;AAED;;;;GAIG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAexD,CAAC"}

package/dist/components/ImageBase/ImageBaseBadge/ImageBaseBadge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ImageBase/ImageBaseBadge/ImageBaseBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HTMLAttributesWithRootRef } from '../../../types';\nimport { RootComponent } from '../../RootComponent/RootComponent';\nimport { ImageBaseContext } from '../context';\nimport type { ImageBaseExpectedIconProps } from '../types';\nimport { validateBadgeIcon } from '../validators';\nimport styles from './ImageBaseBadge.module.css';\n\nfunction DevelopmentCheck({ children }: Pick<ImageBaseBadgeProps, 'children'>) {\n  const { size } = React.useContext(ImageBaseContext);\n\n  if (children) {\n    validateBadgeIcon(size, { name: 'children', value: children });\n  }\n\n  return null;\n}\n\nconst backgroundStyles = {\n  stroke: styles['ImageBaseBadge--background-stroke'],\n  shadow: styles['ImageBaseBadge--background-shadow'],\n};\n\nexport interface ImageBaseBadgeProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Вид подложки под иконку.\n   *\n   * - `\"stroke\"` – имитирует вырез (⚠️ если фон под компонентом динамический, то ожидайте баг).\n   * - `\"shadow\"` – добавляет небольшую тень.\n   */\n  background?: 'stroke' | 'shadow';\n  /**\n   * Принимает иконку.\n   *\n   * > 📝 Нужный для `<ImageBase size={...} />` размер можно узнать из функции `getBadgeIconSizeByImageBaseSize()`.\n   *\n   * > Предпочтительней использовать иконки из `@vkontakte/icons`.\n   *\n   * > 📊️ Если вы хотите передать кастомную иконку, то следует именовать её по шаблону `Icon<size><name>`. Или же\n   * > чтобы в неё был передан параметр `width`. Тогда мы сможем выводить в консоль подсказку правильного ли размера вы\n   * > использовали иконку.\n   */\n  children: React.ReactElement<ImageBaseExpectedIconProps>;\n}\n\n/**\n * Бейдж в правом нижнем углу компонента.\n *\n * > Не используйте при `size < 24`\n */\nexport const ImageBaseBadge: React.FC<ImageBaseBadgeProps> = ({\n  background = 'shadow',\n  ...restProps\n}: ImageBaseBadgeProps) => {\n  return (\n    <>\n      <RootComponent\n        {...restProps}\n        baseClassName={classNames(styles['ImageBaseBadge'], backgroundStyles[background])}\n      />\n      {process.env.NODE_ENV === 'development' && (\n        <DevelopmentCheck>{restProps.children}</DevelopmentCheck>\n      )}\n    </>\n  );\n};\n\nImageBaseBadge.displayName = 'ImageBaseBadge';\n"],"names":["React","classNames","RootComponent","ImageBaseContext","validateBadgeIcon","DevelopmentCheck","children","size","useContext","name","value","backgroundStyles","stroke","shadow","ImageBaseBadge","background","restProps","baseClassName","process","env","NODE_ENV","displayName"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,oCAAoC;AAClE,SAASC,gBAAgB,QAAQ,aAAa;AAE9C,SAASC,iBAAiB,QAAQ,gBAAgB;AAGlD,SAASC,iBAAiB,EAAEC,QAAQ,EAAyC;IAC3E,MAAM,EAAEC,IAAI,EAAE,GAAGP,MAAMQ,UAAU,CAACL;IAElC,IAAIG,UAAU;QACZF,kBAAkBG,MAAM;YAAEE,MAAM;YAAYC,OAAOJ;QAAS;IAC9D;IAEA,OAAO;AACT;AAEA,MAAMK,mBAAmB;IACvBC,MAAM;IACNC,MAAM;AACR;AAwBA;;;;CAIC,GACD,OAAO,MAAMC,iBAAgD;QAAC,EAC5DC,aAAa,QAAQ,EAED,WADjBC;QADHD;;IAGA,qBACE;;0BACE,KAACb,uDACKc;gBACJC,eAAehB,iCAAqCU,gBAAgB,CAACI,WAAW;;YAEjFG,QAAQC,GAAG,CAACC,QAAQ,KAAK,+BACxB,KAACf;0BAAkBW,UAAUV,QAAQ;;;;AAI7C,EAAE;AAEFQ,eAAeO,WAAW,GAAG"}
+{"version":3,"sources":["../../../../src/components/ImageBase/ImageBaseBadge/ImageBaseBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../../types';\nimport { RootComponent } from '../../RootComponent/RootComponent';\nimport { ImageBaseContext } from '../context';\nimport type { ImageBaseExpectedIconProps } from '../types';\nimport { validateBadgeIcon } from '../validators';\nimport styles from './ImageBaseBadge.module.css';\n\nfunction DevelopmentCheck({ children }: Pick<ImageBaseBadgeProps, 'children'>) {\n  const { size } = React.useContext(ImageBaseContext);\n\n  if (children) {\n    validateBadgeIcon(size, { name: 'children', value: children });\n  }\n\n  return null;\n}\n\nconst backgroundStyles = {\n  stroke: styles['ImageBaseBadge--background-stroke'],\n  shadow: styles['ImageBaseBadge--background-shadow'],\n};\n\nexport interface ImageBaseBadgeProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Вид подложки под иконку.\n   *\n   * - `\"stroke\"` – имитирует вырез (⚠️ если фон под компонентом динамический, то ожидайте баг).\n   * - `\"shadow\"` – добавляет небольшую тень.\n   */\n  background?: 'stroke' | 'shadow';\n  /**\n   * Принимает иконку.\n   *\n   * > 📝 Нужный для `<ImageBase size={...} />` размер можно узнать из функции `getBadgeIconSizeByImageBaseSize()`.\n   *\n   * > Предпочтительней использовать иконки из `@vkontakte/icons`.\n   *\n   * > 📊️ Если вы хотите передать кастомную иконку, то следует именовать её по шаблону `Icon<size><name>`. Или же\n   * > чтобы в неё был передан параметр `width`. Тогда мы сможем выводить в консоль подсказку правильного ли размера вы\n   * > использовали иконку.\n   */\n  children: React.ReactElement<ImageBaseExpectedIconProps>;\n}\n\n/**\n * Бейдж в правом нижнем углу компонента.\n *\n * > Не используйте при `size < 24`\n */\nexport const ImageBaseBadge: React.FC<ImageBaseBadgeProps> = ({\n  background = 'shadow',\n  ...restProps\n}: ImageBaseBadgeProps) => {\n  return (\n    <>\n      <RootComponent\n        {...restProps}\n        baseClassName={classNames(styles['ImageBaseBadge'], backgroundStyles[background])}\n      />\n      {process.env.NODE_ENV === 'development' && (\n        <DevelopmentCheck>{restProps.children}</DevelopmentCheck>\n      )}\n    </>\n  );\n};\n\nImageBaseBadge.displayName = 'ImageBaseBadge';\n"],"names":["React","classNames","RootComponent","ImageBaseContext","validateBadgeIcon","DevelopmentCheck","children","size","useContext","name","value","backgroundStyles","stroke","shadow","ImageBaseBadge","background","restProps","baseClassName","process","env","NODE_ENV","displayName"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,oCAAoC;AAClE,SAASC,gBAAgB,QAAQ,aAAa;AAE9C,SAASC,iBAAiB,QAAQ,gBAAgB;AAGlD,SAASC,iBAAiB,EAAEC,QAAQ,EAAyC;IAC3E,MAAM,EAAEC,IAAI,EAAE,GAAGP,MAAMQ,UAAU,CAACL;IAElC,IAAIG,UAAU;QACZF,kBAAkBG,MAAM;YAAEE,MAAM;YAAYC,OAAOJ;QAAS;IAC9D;IAEA,OAAO;AACT;AAEA,MAAMK,mBAAmB;IACvBC,MAAM;IACNC,MAAM;AACR;AAwBA;;;;CAIC,GACD,OAAO,MAAMC,iBAAgD;QAAC,EAC5DC,aAAa,QAAQ,EAED,WADjBC;QADHD;;IAGA,qBACE;;0BACE,KAACb,uDACKc;gBACJC,eAAehB,iCAAqCU,gBAAgB,CAACI,WAAW;;YAEjFG,QAAQC,GAAG,CAACC,QAAQ,KAAK,+BACxB,KAACf;0BAAkBW,UAAUV,QAAQ;;;;AAI7C,EAAE;AAEFQ,eAAeO,WAAW,GAAG"}

package/dist/components/ImageBase/ImageBaseOverlay/types.d.ts

@@ -1,5 +1,5 @@
-import * as React from 'react';
-import { HasRootRef } from '../../../types';
+import type * as React from 'react';
+import type { HasRootRef } from '../../../types';
 import type { ImageBaseExpectedIconProps } from '../types';
 export interface ImageBaseOverlayCommonProps extends React.AriaAttributes, HasRootRef<HTMLDivElement> {
     /**

package/dist/components/ImageBase/ImageBaseOverlay/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/ImageBase/ImageBaseOverlay/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,UAAU,CAAC;AAE3D,MAAM,WAAW,2BACf,SAAQ,KAAK,CAAC,cAAc,EAC1B,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,QAAQ,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,gCAAiC,SAAQ,2BAA2B;IACnF;;;OAGG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAC/C;;;;;;;;;;;OAWG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,0BAA0B,CAAC,CAAC;IACzD,kBAAkB,CAAC,EAAE,KAAK,CAAC;CAC5B;AAED,MAAM,WAAW,mCAAoC,SAAQ,2BAA2B;IACtF;;;;;OAKG;IACH,kBAAkB,EAAE,IAAI,CAAC;IACzB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/ImageBase/ImageBaseOverlay/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AACpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACjD,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,UAAU,CAAC;AAE3D,MAAM,WAAW,2BACf,SAAQ,KAAK,CAAC,cAAc,EAC1B,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,QAAQ,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,gCAAiC,SAAQ,2BAA2B;IACnF;;;OAGG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAC/C;;;;;;;;;;;OAWG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,0BAA0B,CAAC,CAAC;IACzD,kBAAkB,CAAC,EAAE,KAAK,CAAC;CAC5B;AAED,MAAM,WAAW,mCAAoC,SAAQ,2BAA2B;IACtF;;;;;OAKG;IACH,kBAAkB,EAAE,IAAI,CAAC;IACzB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B"}

package/dist/components/ImageBase/ImageBaseOverlay/types.js

@@ -1,3 +1,3 @@
-import * as React from 'react';
+export { };
 
 //# sourceMappingURL=types.js.map

package/dist/components/ImageBase/ImageBaseOverlay/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ImageBase/ImageBaseOverlay/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { HasRootRef } from '../../../types';\nimport type { ImageBaseExpectedIconProps } from '../types';\n\nexport interface ImageBaseOverlayCommonProps\n  extends React.AriaAttributes,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Задаёт тему оформления.\n   *\n   * > По умолчанию берётся из параметра `appearance` в `ConfigProvider`.\n   */\n  theme?: 'dark' | 'light';\n  /**\n   * Определяет каким образом должен показываться оверлей.\n   *\n   * - `\"on-hover\"` – на наведение указателя мыши.\n   * - `\"always\"` – всегда показывать.\n   *\n   * > По умолчанию определяется в зависимости от того, есть ли у пользователя мышь или нет.\n   */\n  visibility?: 'on-hover' | 'always';\n  className?: string;\n}\n\nexport interface ImageBaseOverlayInteractiveProps extends ImageBaseOverlayCommonProps {\n  /**\n   * Обработчик взаимодействия с элементом.\n   * Свойство несовместимо с `nonInteractive={true}`.\n   */\n  onClick?: React.MouseEventHandler<HTMLElement>;\n  /**\n   * Принимает иконку.\n   *\n   *\n   * > 📝 Нужный для `<ImageBase size={...} />` размер можно узнать из функции `getOverlayIconSizeByImageBaseSize()`.\n   *\n   * > Предпочтительней использовать иконки из `@vkontakte/icons`.\n   *\n   * > 📊️ Если вы хотите передать кастомную иконку, то следует именовать её по шаблону `Icon<size><name>`. Или же\n   * > чтобы в неё был передан параметр `width`. Тогда мы сможем выводить в консоль подсказку правильного ли размера вы\n   * > использовали иконку.\n   */\n  children: React.ReactElement<ImageBaseExpectedIconProps>;\n  disableInteractive?: false;\n}\n\nexport interface ImageBaseOverlayNonInteractiveProps extends ImageBaseOverlayCommonProps {\n  /**\n   * По умолчанию сам компонент является интерактивным элементом. Передав значение `true`, можно отключить\n   * такое поведение, что дает возможность передавать отдельные интерактивные элементы в `children`.\n   *\n   * TODO [>=7]: для определения интерактивности завязываться на св-во `onClick`\n   */\n  disableInteractive: true;\n  onClick?: undefined;\n  children: React.ReactNode;\n}\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
+{"version":3,"sources":["../../../../src/components/ImageBase/ImageBaseOverlay/types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type { HasRootRef } from '../../../types';\nimport type { ImageBaseExpectedIconProps } from '../types';\n\nexport interface ImageBaseOverlayCommonProps\n  extends React.AriaAttributes,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Задаёт тему оформления.\n   *\n   * > По умолчанию берётся из параметра `appearance` в `ConfigProvider`.\n   */\n  theme?: 'dark' | 'light';\n  /**\n   * Определяет каким образом должен показываться оверлей.\n   *\n   * - `\"on-hover\"` – на наведение указателя мыши.\n   * - `\"always\"` – всегда показывать.\n   *\n   * > По умолчанию определяется в зависимости от того, есть ли у пользователя мышь или нет.\n   */\n  visibility?: 'on-hover' | 'always';\n  className?: string;\n}\n\nexport interface ImageBaseOverlayInteractiveProps extends ImageBaseOverlayCommonProps {\n  /**\n   * Обработчик взаимодействия с элементом.\n   * Свойство несовместимо с `nonInteractive={true}`.\n   */\n  onClick?: React.MouseEventHandler<HTMLElement>;\n  /**\n   * Принимает иконку.\n   *\n   *\n   * > 📝 Нужный для `<ImageBase size={...} />` размер можно узнать из функции `getOverlayIconSizeByImageBaseSize()`.\n   *\n   * > Предпочтительней использовать иконки из `@vkontakte/icons`.\n   *\n   * > 📊️ Если вы хотите передать кастомную иконку, то следует именовать её по шаблону `Icon<size><name>`. Или же\n   * > чтобы в неё был передан параметр `width`. Тогда мы сможем выводить в консоль подсказку правильного ли размера вы\n   * > использовали иконку.\n   */\n  children: React.ReactElement<ImageBaseExpectedIconProps>;\n  disableInteractive?: false;\n}\n\nexport interface ImageBaseOverlayNonInteractiveProps extends ImageBaseOverlayCommonProps {\n  /**\n   * По умолчанию сам компонент является интерактивным элементом. Передав значение `true`, можно отключить\n   * такое поведение, что дает возможность передавать отдельные интерактивные элементы в `children`.\n   *\n   * TODO [>=7]: для определения интерактивности завязываться на св-во `onClick`\n   */\n  disableInteractive: true;\n  onClick?: undefined;\n  children: React.ReactNode;\n}\n"],"names":[],"mappings":"AA+CA,WAUC"}

package/dist/components/ImageBase/context.d.ts

@@ -1,4 +1,4 @@
 import * as React from 'react';
-import { ImageBaseContextProps } from './types';
+import type { ImageBaseContextProps } from './types';
 export declare const ImageBaseContext: React.Context<ImageBaseContextProps>;
 //# sourceMappingURL=context.d.ts.map

package/dist/components/ImageBase/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/components/ImageBase/context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAEhD,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,OAAO,CAAC,qBAAqB,CAG9D,CAAC"}
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/components/ImageBase/context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAErD,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,OAAO,CAAC,qBAAqB,CAG9D,CAAC"}

package/dist/components/ImageBase/context.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ImageBase/context.ts"],"sourcesContent":["import * as React from 'react';\nimport { ImageBaseContextProps } from './types';\n\nexport const ImageBaseContext: React.Context<ImageBaseContextProps> =\n  React.createContext<ImageBaseContextProps>({\n    size: 0,\n  });\n"],"names":["React","ImageBaseContext","createContext","size"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,MAAMC,mBACXD,MAAME,aAAa,CAAwB;IACzCC,MAAM;AACR,GAAG"}
+{"version":3,"sources":["../../../src/components/ImageBase/context.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ImageBaseContextProps } from './types';\n\nexport const ImageBaseContext: React.Context<ImageBaseContextProps> =\n  React.createContext<ImageBaseContextProps>({\n    size: 0,\n  });\n"],"names":["React","ImageBaseContext","createContext","size"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,MAAMC,mBACXD,MAAME,aAAa,CAAwB;IACzCC,MAAM;AACR,GAAG"}

package/dist/components/InfoRow/InfoRow.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { HTMLAttributesWithRootRef } from '../../types';
+import type { HTMLAttributesWithRootRef } from '../../types';
 export interface InfoRowProps extends HTMLAttributesWithRootRef<HTMLDivElement> {
     header: React.ReactNode;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"InfoRow.d.ts","sourceRoot":"","sources":["../../../src/components/InfoRow/InfoRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAMxD,MAAM,WAAW,YAAa,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IAC7E,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB;AAED;;GAEG;AACH,eAAO,MAAM,OAAO,kDAKjB,YAAY,KAAG,KAAK,CAAC,SAevB,CAAC"}
+{"version":3,"file":"InfoRow.d.ts","sourceRoot":"","sources":["../../../src/components/InfoRow/InfoRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAM7D,MAAM,WAAW,YAAa,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IAC7E,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB;AAED;;GAEG;AACH,eAAO,MAAM,OAAO,kDAKjB,YAAY,KAAG,KAAK,CAAC,SAevB,CAAC"}