@vkontakte/vkui 5.5.4 → 5.6.0

package/dist/cjs/components/FormField/FormField.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/FormField/FormField.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusWithin } from '../../hooks/useFocusWithin';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { FocusVisible } from '../FocusVisible/FocusVisible';\nimport styles from './FormField.module.css';\n\nconst sizeYClassNames = {\n  none: styles['FormField--sizeY-none'],\n  [SizeType.COMPACT]: styles['FormField--sizeY-compact'],\n};\n\nexport interface FormFieldProps {\n  status?: 'default' | 'error' | 'valid';\n  /**\n   * Добавляет иконку слева.\n   *\n   * Рекомендации:\n   *\n   * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n   * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n   */\n  before?: React.ReactNode;\n  /**\n   * Добавляет иконку справа.\n   *\n   * Рекомендации:\n   *\n   * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n   * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n   */\n  after?: React.ReactNode;\n  mode?: 'default' | 'plain';\n}\n\ninterface FormFieldOwnProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    FormFieldProps {\n  disabled?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormField\n */\nexport const FormField = ({\n  Component = 'span',\n  status = 'default',\n  children,\n  getRootRef,\n  before,\n  after,\n  disabled,\n  mode = 'default',\n  className,\n  ...restProps\n}: FormFieldOwnProps) => {\n  const elRef = useExternRef(getRootRef);\n  const focusWithin = useFocusWithin(elRef);\n  const { sizeY = 'none' } = useAdaptivity();\n  const [hover, setHover] = React.useState(false);\n\n  const handleMouseEnter = (e: MouseEvent) => {\n    e.stopPropagation();\n    setHover(true);\n  };\n\n  const handleMouseLeave = (e: MouseEvent) => {\n    e.stopPropagation();\n    setHover(false);\n  };\n\n  return (\n    <Component\n      {...restProps}\n      ref={elRef}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={classNames(\n        styles['FormField'],\n        mode === 'default' && styles['FormField--mode-default'],\n        status !== 'default' &&\n          {\n            error: styles['FormField--status-error'],\n            valid: styles['FormField--status-valid'],\n          }[status],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        disabled && styles['FormField--disabled'],\n        !disabled && hover && styles['FormField--hover'],\n        className,\n      )}\n    >\n      {before && <span className={styles['FormField__before']}>{before}</span>}\n      {children}\n      {after && (\n        <span className={classNames(styles['FormField__after'], 'vkuiInternalFormField__after')}>\n          {after}\n        </span>\n      )}\n      <span aria-hidden className={styles['FormField__border']} />\n      <FocusVisible thin visible={focusWithin} mode=\"outline\" />\n    </Component>\n  );\n};\n"],"names":["FormField","sizeYClassNames","none","SizeType","COMPACT","Component","status","children","getRootRef","before","after","disabled","mode","className","restProps","elRef","useExternRef","focusWithin","useFocusWithin","useAdaptivity","sizeY","React","useState","hover","setHover","handleMouseEnter","e","stopPropagation","handleMouseLeave","ref","onMouseEnter","onMouseLeave","classNames","error","valid","REGULAR","span","aria-hidden","FocusVisible","thin","visible"],"mappings":";;;;+BAiDaA;;;eAAAA;;;;;;;;;+DAjDU;oBACI;6BACG;4BACD;8BACE;0BACN;4BAEI;AAG7B,IAAMC;IACJC,IAAI;GACHC,qBAASC;AAqCL,IAAMJ,YAAY;kCACvBK,WAAAA,0CAAY,kDACZC,QAAAA,oCAAS,2BACTC,kBAAAA,UACAC,oBAAAA,YACAC,gBAAAA,QACAC,eAAAA,OACAC,kBAAAA,+BACAC,MAAAA,gCAAO,yBACPC,mBAAAA,WACGC;QATHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,QAAQC,IAAAA,4BAAaR;IAC3B,IAAMS,cAAcC,IAAAA,gCAAeH;IACnC,IAA2BI,kBAAAA,IAAAA,wDAAAA,gBAAnBC,OAAAA,0CAAQ;IAChB,IAA0BC,qCAAAA,OAAMC,SAAS,YAAlCC,QAAmBF,oBAAZG,WAAYH;IAE1B,IAAMI,mBAAmB,SAACC;QACxBA,EAAEC;QACFH,SAAS;IACX;IAEA,IAAMI,mBAAmB,SAACF;QACxBA,EAAEC;QACFH,SAAS;IACX;IAEA,qBACE,qBAACnB,uDACKS;QACJe,KAAKd;QACLe,cAAcL;QACdM,cAAcH;QACdf,WAAWmB,IAAAA,mCAETpB,SAAS,4CACTN,WAAW,aACT,CAAA;YACE2B,KAAK;YACLC,KAAK;QACP,CAAA,CAAC,CAAC5B,OAAO,EACXc,UAAUjB,qBAASgC,WAAWlC,eAAe,CAACmB,MAAM,EACpDT,uCACA,CAACA,YAAYY,iCACbV;QAGDJ,wBAAU,qBAAC2B;QAAKvB,SAAS;OAAgCJ,SACzDF,UACAG,uBACC,qBAAC0B;QAAKvB,WAAWmB,IAAAA,0CAAuC;OACrDtB,sBAGL,qBAAC0B;QAAKC,eAAAA;QAAYxB,SAAS;sBAC3B,qBAACyB;QAAaC,MAAAA;QAAKC,SAASvB;QAAaL,MAAK;;AAGpD"}
+{"version":3,"sources":["../../../../src/components/FormField/FormField.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusWithin } from '../../hooks/useFocusWithin';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { FocusVisible } from '../FocusVisible/FocusVisible';\nimport styles from './FormField.module.css';\n\nconst sizeYClassNames = {\n  none: styles['FormField--sizeY-none'],\n  [SizeType.COMPACT]: styles['FormField--sizeY-compact'],\n};\n\nexport interface FormFieldProps {\n  status?: 'default' | 'error' | 'valid';\n  /**\n   * Добавляет иконку слева.\n   *\n   * Рекомендации:\n   *\n   * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n   * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n   */\n  before?: React.ReactNode;\n  /**\n   * Добавляет иконку справа.\n   *\n   * Рекомендации:\n   *\n   * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n   * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n   */\n  after?: React.ReactNode;\n  mode?: 'default' | 'plain';\n}\n\ninterface FormFieldOwnProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    FormFieldProps {\n  disabled?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormField\n */\nexport const FormField = ({\n  Component = 'span',\n  status = 'default',\n  children,\n  getRootRef,\n  before,\n  after,\n  disabled,\n  mode = 'default',\n  className,\n  ...restProps\n}: FormFieldOwnProps) => {\n  const elRef = useExternRef(getRootRef);\n  const focusWithin = useFocusWithin(elRef);\n  const { sizeY = 'none' } = useAdaptivity();\n  const [hover, setHover] = React.useState(false);\n\n  const handleMouseEnter = (e: MouseEvent) => {\n    e.stopPropagation();\n    setHover(true);\n  };\n\n  const handleMouseLeave = (e: MouseEvent) => {\n    e.stopPropagation();\n    setHover(false);\n  };\n\n  return (\n    <Component\n      {...restProps}\n      ref={elRef}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={classNames(\n        styles['FormField'],\n        mode === 'default' && styles['FormField--mode-default'],\n        status !== 'default' &&\n          {\n            error: styles['FormField--status-error'],\n            valid: styles['FormField--status-valid'],\n          }[status],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        disabled && styles['FormField--disabled'],\n        !disabled && hover && styles['FormField--hover'],\n        className,\n      )}\n    >\n      {before && <span className={styles['FormField__before']}>{before}</span>}\n      {children}\n      {after && (\n        <span className={classNames(styles['FormField__after'], 'vkuiInternalFormField__after')}>\n          {after}\n        </span>\n      )}\n      <span aria-hidden className={styles['FormField__border']} />\n      <FocusVisible thin visible={focusWithin} mode=\"outline\" />\n    </Component>\n  );\n};\n"],"names":["FormField","sizeYClassNames","none","SizeType","COMPACT","Component","status","children","getRootRef","before","after","disabled","mode","className","restProps","elRef","useExternRef","focusWithin","useFocusWithin","useAdaptivity","sizeY","React","useState","hover","setHover","handleMouseEnter","e","stopPropagation","handleMouseLeave","ref","onMouseEnter","onMouseLeave","classNames","error","valid","REGULAR","span","aria-hidden","FocusVisible","thin","visible"],"mappings":";;;;+BAiDaA;;;eAAAA;;;;;;;;;+DAjDU;oBACI;6BACG;4BACD;8BACE;0BACN;4BAEI;AAG7B,IAAMC;IACJC,IAAI;GACHC,oBAAQ,CAACC,OAAO;AAqCZ,IAAMJ,YAAY;kCACvBK,WAAAA,0CAAY,kDACZC,QAAAA,oCAAS,2BACTC,kBAAAA,UACAC,oBAAAA,YACAC,gBAAAA,QACAC,eAAAA,OACAC,kBAAAA,+BACAC,MAAAA,gCAAO,yBACPC,mBAAAA,WACGC;QATHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,QAAQC,IAAAA,0BAAY,EAACR;IAC3B,IAAMS,cAAcC,IAAAA,8BAAc,EAACH;IACnC,IAA2BI,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBC,OAAAA,0CAAQ;IAChB,IAA0BC,qCAAAA,OAAMC,QAAQ,CAAC,YAAlCC,QAAmBF,oBAAZG,WAAYH;IAE1B,IAAMI,mBAAmB,SAACC;QACxBA,EAAEC,eAAe;QACjBH,SAAS;IACX;IAEA,IAAMI,mBAAmB,SAACF;QACxBA,EAAEC,eAAe;QACjBH,SAAS;IACX;IAEA,qBACE,qBAACnB,uDACKS;QACJe,KAAKd;QACLe,cAAcL;QACdM,cAAcH;QACdf,WAAWmB,IAAAA,gBAAU,mBAEnBpB,SAAS,4CACTN,WAAW,aACT,CAAA;YACE2B,KAAK;YACLC,KAAK;QACP,CAAA,CAAC,CAAC5B,OAAO,EACXc,UAAUjB,oBAAQ,CAACgC,OAAO,IAAIlC,eAAe,CAACmB,MAAM,EACpDT,uCACA,CAACA,YAAYY,iCACbV;QAGDJ,wBAAU,qBAAC2B;QAAKvB,SAAS;OAAgCJ,SACzDF,UACAG,uBACC,qBAAC0B;QAAKvB,WAAWmB,IAAAA,gBAAU,0BAA6B;OACrDtB,sBAGL,qBAAC0B;QAAKC,eAAAA;QAAYxB,SAAS;sBAC3B,qBAACyB,0BAAY;QAACC,MAAAA;QAAKC,SAASvB;QAAaL,MAAK;;AAGpD"}

package/dist/cjs/components/FormItem/FormItem.js

@@ -56,7 +56,8 @@ var FormItem = function(_param) {
     }), removable ? /*#__PURE__*/ _react.createElement(_Removable.Removable, {
         align: "start",
         onRemove: function(e) {
-            if (rootEl === null || rootEl === void 0 ? void 0 : rootEl.current) {
+            var _rootEl;
+            if ((_rootEl = rootEl) === null || _rootEl === void 0 ? void 0 : _rootEl.current) {
                 onRemove(e, rootEl.current);
             }
         },

package/dist/cjs/components/FormItem/FormItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './FormItem.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(styles['FormItem--sizeY-none'], 'vkuiInternalFormItem--sizeY-none'),\n  [SizeType.COMPACT]: classNames(\n    styles['FormItem--sizeY-compact'],\n    'vkuiInternalFormItem--sizeY-compact',\n  ),\n};\n\nexport interface FormItemProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    RemovableProps {\n  top?: React.ReactNode;\n  bottom?: React.ReactNode;\n  status?: 'default' | 'error' | 'valid';\n  /**\n   * Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n   *\n   * Режим `indent` предназначен для визуального отступа\n   */\n  removable?: boolean | 'indent';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormItem\n */\nexport const FormItem = ({\n  children,\n  top,\n  bottom,\n  status = 'default',\n  Component = 'div',\n  removable,\n  onRemove = noop,\n  removePlaceholder = 'Удалить',\n  getRootRef,\n  className,\n  htmlFor,\n  ...restProps\n}: FormItemProps) => {\n  const rootEl = useExternRef(getRootRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const wrappedChildren = (\n    <React.Fragment>\n      {hasReactNode(top) && (\n        <Subhead\n          className={styles['FormItem__top']}\n          Component={htmlFor ? 'label' : 'h5'}\n          htmlFor={htmlFor}\n        >\n          {top}\n        </Subhead>\n      )}\n      {children}\n      {hasReactNode(bottom) && <Footnote className={styles['FormItem__bottom']}>{bottom}</Footnote>}\n    </React.Fragment>\n  );\n\n  return (\n    <Component\n      {...restProps}\n      ref={rootEl}\n      className={classNames(\n        styles['FormItem'],\n        'vkuiInternalFormItem',\n        status !== 'default' &&\n          {\n            error: classNames(\n              styles['FormItem--status-error'],\n              'vkuiInternalFormItem--status-error',\n            ),\n            valid: classNames(\n              styles['FormItem--status-valid'],\n              'vkuiInternalFormItem--status-valid',\n            ),\n          }[status],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        hasReactNode(top) &&\n          classNames(styles['FormItem--withTop'], 'vkuiInternalFormItem--withTop'),\n        removable && classNames(styles['FormItem--removable'], 'vkuiInternalFormItem--removable'),\n        className,\n      )}\n    >\n      {removable ? (\n        <Removable\n          align=\"start\"\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove(e, rootEl.current);\n            }\n          }}\n          removePlaceholder={removePlaceholder}\n          indent={removable === 'indent'}\n        >\n          <div\n            className={classNames(styles['FormItem__removable'], 'vkuiInternalFormItem__removable')}\n          >\n            {wrappedChildren}\n          </div>\n        </Removable>\n      ) : (\n        wrappedChildren\n      )}\n    </Component>\n  );\n};\n"],"names":["FormItem","sizeYClassNames","none","classNames","SizeType","COMPACT","children","top","bottom","status","Component","removable","onRemove","noop","removePlaceholder","getRootRef","className","htmlFor","restProps","rootEl","useExternRef","useAdaptivity","sizeY","wrappedChildren","React","Fragment","hasReactNode","Subhead","Footnote","ref","error","valid","REGULAR","Removable","align","e","current","indent","div"],"mappings":";;;;+BAsCaA;;;eAAAA;;;;;;;;+DAtCU;oBACwB;6BACjB;4BACD;0BACJ;yBAEiB;wBACjB;uBACD;AAGxB,IAAMC,kBAEJ;IADAC,MAAMC,IAAAA,8CAA2C;GAChDC,qBAASC,SAAUF,IAAAA,iDAElB;AAuBG,IAAMH,WAAW;QACtBM,kBAAAA,UACAC,aAAAA,KACAC,gBAAAA,+BACAC,QAAAA,oCAAS,qDACTC,WAAAA,0CAAY,0BACZC,mBAAAA,oCACAC,UAAAA,wCAAWC,gEACXC,mBAAAA,0DAAoB,sCACpBC,oBAAAA,YACAC,mBAAAA,WACAC,iBAAAA,SACGC;QAXHZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;;IAGA,IAAME,SAASC,IAAAA,4BAAaL;IAC5B,IAA2BM,kBAAAA,IAAAA,wDAAAA,gBAAnBC,OAAAA,0CAAQ;IAEhB,IAAMC,gCACJ,qBAACC,OAAMC,gBACJC,IAAAA,oBAAanB,sBACZ,qBAACoB;QACCX,SAAS;QACTN,WAAWO,UAAU,UAAU;QAC/BA,SAASA;OAERV,MAGJD,UACAoB,IAAAA,oBAAalB,yBAAW,qBAACoB;QAASZ,SAAS;OAA+BR;IAI/E,qBACE,qBAACE,uDACKQ;QACJW,KAAKV;QACLH,WAAWb,IAAAA,kCAET,wBACAM,WAAW,aACT,CAAA;YACEqB,OAAO3B,IAAAA,gDAEL;YAEF4B,OAAO5B,IAAAA,gDAEL;QAEJ,CAAA,CAAC,CAACM,OAAO,EACXa,UAAUlB,qBAAS4B,WAAW/B,eAAe,CAACqB,MAAM,EACpDI,IAAAA,oBAAanB,QACXJ,IAAAA,2CAAwC,kCAC1CQ,aAAaR,IAAAA,6CAA0C,oCACvDa;QAGDL,0BACC,qBAACsB;QACCC,OAAM;QACNtB,UAAU,SAACuB;YACT,IAAIhB,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQiB,SAAS;gBACnBxB,SAASuB,GAAGhB,OAAOiB;YACrB;QACF;QACAtB,mBAAmBA;QACnBuB,QAAQ1B,cAAc;qBAEtB,qBAAC2B;QACCtB,WAAWb,IAAAA,6CAA0C;OAEpDoB,oBAILA;AAIR"}
+{"version":3,"sources":["../../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './FormItem.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(styles['FormItem--sizeY-none'], 'vkuiInternalFormItem--sizeY-none'),\n  [SizeType.COMPACT]: classNames(\n    styles['FormItem--sizeY-compact'],\n    'vkuiInternalFormItem--sizeY-compact',\n  ),\n};\n\nexport interface FormItemProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    RemovableProps {\n  top?: React.ReactNode;\n  bottom?: React.ReactNode;\n  status?: 'default' | 'error' | 'valid';\n  /**\n   * Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n   *\n   * Режим `indent` предназначен для визуального отступа\n   */\n  removable?: boolean | 'indent';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormItem\n */\nexport const FormItem = ({\n  children,\n  top,\n  bottom,\n  status = 'default',\n  Component = 'div',\n  removable,\n  onRemove = noop,\n  removePlaceholder = 'Удалить',\n  getRootRef,\n  className,\n  htmlFor,\n  ...restProps\n}: FormItemProps) => {\n  const rootEl = useExternRef(getRootRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const wrappedChildren = (\n    <React.Fragment>\n      {hasReactNode(top) && (\n        <Subhead\n          className={styles['FormItem__top']}\n          Component={htmlFor ? 'label' : 'h5'}\n          htmlFor={htmlFor}\n        >\n          {top}\n        </Subhead>\n      )}\n      {children}\n      {hasReactNode(bottom) && <Footnote className={styles['FormItem__bottom']}>{bottom}</Footnote>}\n    </React.Fragment>\n  );\n\n  return (\n    <Component\n      {...restProps}\n      ref={rootEl}\n      className={classNames(\n        styles['FormItem'],\n        'vkuiInternalFormItem',\n        status !== 'default' &&\n          {\n            error: classNames(\n              styles['FormItem--status-error'],\n              'vkuiInternalFormItem--status-error',\n            ),\n            valid: classNames(\n              styles['FormItem--status-valid'],\n              'vkuiInternalFormItem--status-valid',\n            ),\n          }[status],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        hasReactNode(top) &&\n          classNames(styles['FormItem--withTop'], 'vkuiInternalFormItem--withTop'),\n        removable && classNames(styles['FormItem--removable'], 'vkuiInternalFormItem--removable'),\n        className,\n      )}\n    >\n      {removable ? (\n        <Removable\n          align=\"start\"\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove(e, rootEl.current);\n            }\n          }}\n          removePlaceholder={removePlaceholder}\n          indent={removable === 'indent'}\n        >\n          <div\n            className={classNames(styles['FormItem__removable'], 'vkuiInternalFormItem__removable')}\n          >\n            {wrappedChildren}\n          </div>\n        </Removable>\n      ) : (\n        wrappedChildren\n      )}\n    </Component>\n  );\n};\n"],"names":["FormItem","sizeYClassNames","none","classNames","SizeType","COMPACT","children","top","bottom","status","Component","removable","onRemove","noop","removePlaceholder","getRootRef","className","htmlFor","restProps","rootEl","useExternRef","useAdaptivity","sizeY","wrappedChildren","React","Fragment","hasReactNode","Subhead","Footnote","ref","error","valid","REGULAR","Removable","align","e","current","indent","div"],"mappings":";;;;+BAsCaA;;;eAAAA;;;;;;;;+DAtCU;oBACwB;6BACjB;4BACD;0BACJ;yBAEiB;wBACjB;uBACD;AAGxB,IAAMC,kBAEJ;IADAC,MAAMC,IAAAA,gBAAU,8BAAiC;GAChDC,oBAAQ,CAACC,OAAO,EAAGF,IAAAA,gBAAU,iCAE5B;AAuBG,IAAMH,WAAW;QACtBM,kBAAAA,UACAC,aAAAA,KACAC,gBAAAA,+BACAC,QAAAA,oCAAS,qDACTC,WAAAA,0CAAY,0BACZC,mBAAAA,oCACAC,UAAAA,wCAAWC,UAAI,sDACfC,mBAAAA,0DAAoB,sCACpBC,oBAAAA,YACAC,mBAAAA,WACAC,iBAAAA,SACGC;QAXHZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;;IAGA,IAAME,SAASC,IAAAA,0BAAY,EAACL;IAC5B,IAA2BM,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBC,OAAAA,0CAAQ;IAEhB,IAAMC,gCACJ,qBAACC,OAAMC,QAAQ,QACZC,IAAAA,kBAAY,EAACnB,sBACZ,qBAACoB,gBAAO;QACNX,SAAS;QACTN,WAAWO,UAAU,UAAU;QAC/BA,SAASA;OAERV,MAGJD,UACAoB,IAAAA,kBAAY,EAAClB,yBAAW,qBAACoB,kBAAQ;QAACZ,SAAS;OAA+BR;IAI/E,qBACE,qBAACE,uDACKQ;QACJW,KAAKV;QACLH,WAAWb,IAAAA,gBAAU,kBAEnB,wBACAM,WAAW,aACT,CAAA;YACEqB,OAAO3B,IAAAA,gBAAU,gCAEf;YAEF4B,OAAO5B,IAAAA,gBAAU,gCAEf;QAEJ,CAAA,CAAC,CAACM,OAAO,EACXa,UAAUlB,oBAAQ,CAAC4B,OAAO,IAAI/B,eAAe,CAACqB,MAAM,EACpDI,IAAAA,kBAAY,EAACnB,QACXJ,IAAAA,gBAAU,2BAA8B,kCAC1CQ,aAAaR,IAAAA,gBAAU,6BAAgC,oCACvDa;QAGDL,0BACC,qBAACsB,oBAAS;QACRC,OAAM;QACNtB,UAAU,SAACuB;gBACLhB;YAAJ,KAAIA,UAAAA,oBAAAA,8BAAAA,QAAQiB,OAAO,EAAE;gBACnBxB,SAASuB,GAAGhB,OAAOiB,OAAO;YAC5B;QACF;QACAtB,mBAAmBA;QACnBuB,QAAQ1B,cAAc;qBAEtB,qBAAC2B;QACCtB,WAAWb,IAAAA,gBAAU,6BAAgC;OAEpDoB,oBAILA;AAIR"}

package/dist/cjs/components/FormLayout/FormLayout.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/FormLayout/FormLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasComponent, HasRef } from '../../types';\nimport styles from './FormLayout.module.css';\n\nconst preventDefault = (e: React.FormEvent) => e.preventDefault();\n\nexport type FormLayoutProps = React.AllHTMLAttributes<HTMLElement> &\n  HasRef<HTMLElement> &\n  HasComponent;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormLayout\n */\nexport const FormLayout = ({\n  children,\n  Component = 'form',\n  getRef,\n  onSubmit = preventDefault,\n  className,\n  ...restProps\n}: FormLayoutProps) => {\n  return (\n    <Component\n      {...restProps}\n      className={classNames(styles['FormLayout'], className)}\n      onSubmit={onSubmit}\n      ref={getRef}\n    >\n      {children}\n      {Component === 'form' && (\n        <input type=\"submit\" className={styles['FormLayout__submit']} value=\"\" />\n      )}\n    </Component>\n  );\n};\n"],"names":["FormLayout","preventDefault","e","children","Component","getRef","onSubmit","className","restProps","classNames","ref","input","type","value"],"mappings":";;;;+BAcaA;;;eAAAA;;;;;;;+DAdU;oBACI;AAI3B,IAAMC,iBAAiB,SAACC;WAAuBA,EAAED;;AAS1C,IAAMD,aAAa;QACxBG,kBAAAA,oCACAC,WAAAA,0CAAY,2BACZC,gBAAAA,iCACAC,UAAAA,wCAAWL,kCACXM,mBAAAA,WACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,qBAACH,uDACKI;QACJD,WAAWE,IAAAA,oCAAiCF;QAC5CD,UAAUA;QACVI,KAAKL;QAEJF,UACAC,cAAc,wBACb,qBAACO;QAAMC,MAAK;QAASL,SAAS;QAAgCM,OAAM;;AAI5E"}
+{"version":3,"sources":["../../../../src/components/FormLayout/FormLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasComponent, HasRef } from '../../types';\nimport styles from './FormLayout.module.css';\n\nconst preventDefault = (e: React.FormEvent) => e.preventDefault();\n\nexport type FormLayoutProps = React.AllHTMLAttributes<HTMLElement> &\n  HasRef<HTMLElement> &\n  HasComponent;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormLayout\n */\nexport const FormLayout = ({\n  children,\n  Component = 'form',\n  getRef,\n  onSubmit = preventDefault,\n  className,\n  ...restProps\n}: FormLayoutProps) => {\n  return (\n    <Component\n      {...restProps}\n      className={classNames(styles['FormLayout'], className)}\n      onSubmit={onSubmit}\n      ref={getRef}\n    >\n      {children}\n      {Component === 'form' && (\n        <input type=\"submit\" className={styles['FormLayout__submit']} value=\"\" />\n      )}\n    </Component>\n  );\n};\n"],"names":["FormLayout","preventDefault","e","children","Component","getRef","onSubmit","className","restProps","classNames","ref","input","type","value"],"mappings":";;;;+BAcaA;;;eAAAA;;;;;;;+DAdU;oBACI;AAI3B,IAAMC,iBAAiB,SAACC;WAAuBA,EAAED,cAAc;;AASxD,IAAMD,aAAa;QACxBG,kBAAAA,oCACAC,WAAAA,0CAAY,2BACZC,gBAAAA,iCACAC,UAAAA,wCAAWL,kCACXM,mBAAAA,WACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,qBAACH,uDACKI;QACJD,WAAWE,IAAAA,gBAAU,oBAAuBF;QAC5CD,UAAUA;QACVI,KAAKL;QAEJF,UACAC,cAAc,wBACb,qBAACO;QAAMC,MAAK;QAASL,SAAS;QAAgCM,OAAM;;AAI5E"}

package/dist/cjs/components/FormLayoutGroup/FormLayoutGroup.js

@@ -44,7 +44,8 @@ var FormLayoutGroup = function(_param) {
         align: "start",
         removePlaceholder: removePlaceholder,
         onRemove: function(e) {
-            if (rootEl === null || rootEl === void 0 ? void 0 : rootEl.current) {
+            var _rootEl;
+            if ((_rootEl = rootEl) === null || _rootEl === void 0 ? void 0 : _rootEl.current) {
                 onRemove(e, rootEl.current);
             }
         },

package/dist/cjs/components/FormLayoutGroup/FormLayoutGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/FormLayoutGroup/FormLayoutGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport styles from './FormLayoutGroup.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(\n    styles['FormLayoutGroup--sizeY-none'],\n    'vkuiInternalFormLayoutGroup--sizeY-none',\n  ),\n  [SizeType.COMPACT]: classNames(\n    styles['FormLayoutGroup--sizeY-compact'],\n    'vkuiInternalFormLayoutGroup--sizeY-compact',\n  ),\n};\n\nexport interface FormLayoutGroupProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  mode?: 'vertical' | 'horizontal';\n  /**\n   * Только для режима horizontal. Дает возможность удалить всю группу `FormItem`.\n   *\n   * Режим `indent` предназначен для визуального отступа.\n   */\n  removable?: boolean | 'indent';\n\n  /**\n   * Только для режима horizontal. Дает возможность склеить несколько `FormItem`.\n   */\n  segmented?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormLayoutGroup\n */\nexport const FormLayoutGroup = ({\n  children,\n  mode = 'vertical',\n  removable,\n  segmented,\n  removePlaceholder = 'Удалить',\n  onRemove = noop,\n  getRootRef,\n  className,\n  ...restProps\n}: FormLayoutGroupProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const isRemovable = removable && mode === 'horizontal';\n  const isSegmented = segmented && mode === 'horizontal';\n  const rootEl = useExternRef(getRootRef);\n\n  return (\n    <div\n      ref={rootEl}\n      className={classNames(\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        mode === 'horizontal' &&\n          classNames(\n            styles['FormLayoutGroup--mode-horizontal'],\n            'vkuiInternalFormLayoutGroup--mode-horizontal',\n          ),\n        isRemovable &&\n          classNames(\n            styles['FormLayoutGroup--removable'],\n            'vkuiInternalFormLayoutGroup--removable',\n          ),\n        isSegmented &&\n          classNames(\n            styles['FormLayoutGroup--segmented'],\n            'vkuiInternalFormLayoutGroup--segmented',\n          ),\n        className,\n      )}\n      {...restProps}\n    >\n      {isRemovable ? (\n        <Removable\n          className={styles['FormLayoutGroup__removable']}\n          align=\"start\"\n          removePlaceholder={removePlaceholder}\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove(e, rootEl.current);\n            }\n          }}\n          indent={removable === 'indent'}\n        >\n          {children}\n        </Removable>\n      ) : (\n        <React.Fragment>\n          {children}\n          <span className={styles['FormLayoutGroup__offset']} aria-hidden />\n        </React.Fragment>\n      )}\n    </div>\n  );\n};\n"],"names":["FormLayoutGroup","sizeYClassNames","none","classNames","SizeType","COMPACT","children","mode","removable","segmented","removePlaceholder","onRemove","noop","getRootRef","className","restProps","useAdaptivity","sizeY","isRemovable","isSegmented","rootEl","useExternRef","div","ref","REGULAR","Removable","align","e","current","indent","React","Fragment","span","aria-hidden"],"mappings":";;;;+BAyCaA;;;eAAAA;;;;;;;+DAzCU;oBACU;6BACH;4BACD;0BACJ;yBAEiB;AAG1C,IAAMC,kBAKJ;IAJAC,MAAMC,IAAAA,qDAEJ;GAEDC,qBAASC,SAAUF,IAAAA,wDAElB;AAyBG,IAAMH,kBAAkB;QAC7BM,kBAAAA,+BACAC,MAAAA,gCAAO,0BACPC,mBAAAA,WACAC,mBAAAA,6CACAC,mBAAAA,0DAAoB,+DACpBC,UAAAA,wCAAWC,8BACXC,oBAAAA,YACAC,mBAAAA,WACGC;QARHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;;IAGA,IAA2BE,kBAAAA,IAAAA,wDAAAA,gBAAnBC,OAAAA,0CAAQ;IAChB,IAAMC,cAAcV,aAAaD,SAAS;IAC1C,IAAMY,cAAcV,aAAaF,SAAS;IAC1C,IAAMa,SAASC,IAAAA,4BAAaR;IAE5B,qBACE,qBAACS;QACCC,KAAKH;QACLN,WAAWX,IAAAA,kBACTc,UAAUb,qBAASoB,WAAWvB,eAAe,CAACgB,MAAM,EACpDV,SAAS,gBACPJ,IAAAA,0DAEE,iDAEJe,eACEf,IAAAA,oDAEE,2CAEJgB,eACEhB,IAAAA,oDAEE,2CAEJW;OAEEC,YAEHG,4BACC,qBAACO;QACCX,SAAS;QACTY,OAAM;QACNhB,mBAAmBA;QACnBC,UAAU,SAACgB;YACT,IAAIP,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQQ,SAAS;gBACnBjB,SAASgB,GAAGP,OAAOQ;YACrB;QACF;QACAC,QAAQrB,cAAc;OAErBF,0BAGH,qBAACwB,OAAMC,gBACJzB,wBACD,qBAAC0B;QAAKlB,SAAS;QAAqCmB,eAAAA;;AAK9D"}
+{"version":3,"sources":["../../../../src/components/FormLayoutGroup/FormLayoutGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport styles from './FormLayoutGroup.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(\n    styles['FormLayoutGroup--sizeY-none'],\n    'vkuiInternalFormLayoutGroup--sizeY-none',\n  ),\n  [SizeType.COMPACT]: classNames(\n    styles['FormLayoutGroup--sizeY-compact'],\n    'vkuiInternalFormLayoutGroup--sizeY-compact',\n  ),\n};\n\nexport interface FormLayoutGroupProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  mode?: 'vertical' | 'horizontal';\n  /**\n   * Только для режима horizontal. Дает возможность удалить всю группу `FormItem`.\n   *\n   * Режим `indent` предназначен для визуального отступа.\n   */\n  removable?: boolean | 'indent';\n\n  /**\n   * Только для режима horizontal. Дает возможность склеить несколько `FormItem`.\n   */\n  segmented?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormLayoutGroup\n */\nexport const FormLayoutGroup = ({\n  children,\n  mode = 'vertical',\n  removable,\n  segmented,\n  removePlaceholder = 'Удалить',\n  onRemove = noop,\n  getRootRef,\n  className,\n  ...restProps\n}: FormLayoutGroupProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const isRemovable = removable && mode === 'horizontal';\n  const isSegmented = segmented && mode === 'horizontal';\n  const rootEl = useExternRef(getRootRef);\n\n  return (\n    <div\n      ref={rootEl}\n      className={classNames(\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        mode === 'horizontal' &&\n          classNames(\n            styles['FormLayoutGroup--mode-horizontal'],\n            'vkuiInternalFormLayoutGroup--mode-horizontal',\n          ),\n        isRemovable &&\n          classNames(\n            styles['FormLayoutGroup--removable'],\n            'vkuiInternalFormLayoutGroup--removable',\n          ),\n        isSegmented &&\n          classNames(\n            styles['FormLayoutGroup--segmented'],\n            'vkuiInternalFormLayoutGroup--segmented',\n          ),\n        className,\n      )}\n      {...restProps}\n    >\n      {isRemovable ? (\n        <Removable\n          className={styles['FormLayoutGroup__removable']}\n          align=\"start\"\n          removePlaceholder={removePlaceholder}\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove(e, rootEl.current);\n            }\n          }}\n          indent={removable === 'indent'}\n        >\n          {children}\n        </Removable>\n      ) : (\n        <React.Fragment>\n          {children}\n          <span className={styles['FormLayoutGroup__offset']} aria-hidden />\n        </React.Fragment>\n      )}\n    </div>\n  );\n};\n"],"names":["FormLayoutGroup","sizeYClassNames","none","classNames","SizeType","COMPACT","children","mode","removable","segmented","removePlaceholder","onRemove","noop","getRootRef","className","restProps","useAdaptivity","sizeY","isRemovable","isSegmented","rootEl","useExternRef","div","ref","REGULAR","Removable","align","e","current","indent","React","Fragment","span","aria-hidden"],"mappings":";;;;+BAyCaA;;;eAAAA;;;;;;;+DAzCU;oBACU;6BACH;4BACD;0BACJ;yBAEiB;AAG1C,IAAMC,kBAKJ;IAJAC,MAAMC,IAAAA,gBAAU,qCAEd;GAEDC,oBAAQ,CAACC,OAAO,EAAGF,IAAAA,gBAAU,wCAE5B;AAyBG,IAAMH,kBAAkB;QAC7BM,kBAAAA,+BACAC,MAAAA,gCAAO,0BACPC,mBAAAA,WACAC,mBAAAA,6CACAC,mBAAAA,0DAAoB,+DACpBC,UAAAA,wCAAWC,UAAI,oBACfC,oBAAAA,YACAC,mBAAAA,WACGC;QARHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;;IAGA,IAA2BE,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBC,OAAAA,0CAAQ;IAChB,IAAMC,cAAcV,aAAaD,SAAS;IAC1C,IAAMY,cAAcV,aAAaF,SAAS;IAC1C,IAAMa,SAASC,IAAAA,0BAAY,EAACR;IAE5B,qBACE,qBAACS;QACCC,KAAKH;QACLN,WAAWX,IAAAA,gBAAU,EACnBc,UAAUb,oBAAQ,CAACoB,OAAO,IAAIvB,eAAe,CAACgB,MAAM,EACpDV,SAAS,gBACPJ,IAAAA,gBAAU,0CAER,iDAEJe,eACEf,IAAAA,gBAAU,oCAER,2CAEJgB,eACEhB,IAAAA,gBAAU,oCAER,2CAEJW;OAEEC,YAEHG,4BACC,qBAACO,oBAAS;QACRX,SAAS;QACTY,OAAM;QACNhB,mBAAmBA;QACnBC,UAAU,SAACgB;gBACLP;YAAJ,KAAIA,UAAAA,oBAAAA,8BAAAA,QAAQQ,OAAO,EAAE;gBACnBjB,SAASgB,GAAGP,OAAOQ,OAAO;YAC5B;QACF;QACAC,QAAQrB,cAAc;OAErBF,0BAGH,qBAACwB,OAAMC,QAAQ,QACZzB,wBACD,qBAAC0B;QAAKlB,SAAS;QAAqCmB,eAAAA;;AAK9D"}

package/dist/cjs/components/FormStatus/FormStatus.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/FormStatus/FormStatus.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasRootRef } from '../../types';\nimport { Banner } from '../Banner/Banner';\nimport styles from './FormStatus.module.css';\n\nexport interface FormStatusProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLElement> {\n  mode?: 'default' | 'error';\n  header?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormStatus\n */\nexport const FormStatus = ({ mode, children, className, ...restProps }: FormStatusProps) => {\n  return (\n    <Banner\n      {...restProps}\n      subheader={children}\n      className={classNames(\n        'vkuiInternalFormStatus',\n        mode === 'error' &&\n          classNames(styles['FormStatus--mode-error'], 'vkuiInternalFormStatus--mode-error'),\n        className,\n      )}\n    />\n  );\n};\n"],"names":["FormStatus","mode","children","className","restProps","Banner","subheader","classNames"],"mappings":";;;;+BAgBaA;;;eAAAA;;;;;;;+DAhBU;oBACI;sBAEJ;AAahB,IAAMA,aAAa;QAAGC,cAAAA,MAAMC,kBAAAA,UAAUC,mBAAAA,WAAcC;QAA9BH;QAAMC;QAAUC;;IAC3C,qBACE,qBAACE,4DACKD;QACJE,WAAWJ;QACXC,WAAWI,IAAAA,kBACT,0BACAN,SAAS,WACPM,IAAAA,gDAA6C,uCAC/CJ;;AAIR"}
+{"version":3,"sources":["../../../../src/components/FormStatus/FormStatus.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasRootRef } from '../../types';\nimport { Banner } from '../Banner/Banner';\nimport styles from './FormStatus.module.css';\n\nexport interface FormStatusProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLElement> {\n  mode?: 'default' | 'error';\n  header?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormStatus\n */\nexport const FormStatus = ({ mode, children, className, ...restProps }: FormStatusProps) => {\n  return (\n    <Banner\n      {...restProps}\n      subheader={children}\n      className={classNames(\n        'vkuiInternalFormStatus',\n        mode === 'error' &&\n          classNames(styles['FormStatus--mode-error'], 'vkuiInternalFormStatus--mode-error'),\n        className,\n      )}\n    />\n  );\n};\n"],"names":["FormStatus","mode","children","className","restProps","Banner","subheader","classNames"],"mappings":";;;;+BAgBaA;;;eAAAA;;;;;;;+DAhBU;oBACI;sBAEJ;AAahB,IAAMA,aAAa;QAAGC,cAAAA,MAAMC,kBAAAA,UAAUC,mBAAAA,WAAcC;QAA9BH;QAAMC;QAAUC;;IAC3C,qBACE,qBAACE,cAAM,8CACDD;QACJE,WAAWJ;QACXC,WAAWI,IAAAA,gBAAU,EACnB,0BACAN,SAAS,WACPM,IAAAA,gBAAU,gCAAmC,uCAC/CJ;;AAIR"}

package/dist/cjs/components/Gallery/Gallery.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Gallery/Gallery.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clamp } from '../../helpers/math';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { BaseGallery } from '../BaseGallery/BaseGallery';\nimport { BaseGalleryProps } from '../BaseGallery/types';\n\nexport interface GalleryProps extends BaseGalleryProps {\n  initialSlideIndex?: number;\n  timeout?: number;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Gallery\n */\nexport const Gallery = ({\n  initialSlideIndex = 0,\n  children,\n  timeout = 0,\n  onChange,\n  bullets,\n  ...props\n}: GalleryProps) => {\n  const [localSlideIndex, setSlideIndex] = React.useState(initialSlideIndex);\n  const isControlled = typeof props.slideIndex === 'number';\n  const slideIndex = isControlled ? props.slideIndex ?? 0 : localSlideIndex;\n  const isDraggable = !isControlled || Boolean(onChange);\n  const slides = React.useMemo(\n    () => React.Children.toArray(children).filter((item) => Boolean(item)),\n    [children],\n  );\n  const childCount = slides.length;\n\n  const handleChange: GalleryProps['onChange'] = React.useCallback(\n    (current: number) => {\n      if (current === slideIndex) {\n        return;\n      }\n      !isControlled && setSlideIndex(current);\n      onChange && onChange(current);\n    },\n    [isControlled, onChange, slideIndex],\n  );\n\n  const autoplay = useTimeout(() => handleChange((slideIndex + 1) % childCount), timeout);\n  React.useEffect(\n    () => (timeout ? autoplay.set() : autoplay.clear()),\n    [timeout, slideIndex, autoplay],\n  );\n\n  // prevent invalid slideIndex\n  // any slide index is invalid with no slides, just keep it as is\n  const safeSlideIndex = childCount > 0 ? clamp(slideIndex, 0, childCount - 1) : slideIndex;\n  // notify parent in controlled mode\n  React.useEffect(() => {\n    if (onChange && safeSlideIndex !== slideIndex) {\n      onChange(safeSlideIndex);\n    }\n    setSlideIndex(safeSlideIndex);\n  }, [onChange, safeSlideIndex, slideIndex]);\n\n  return (\n    <BaseGallery\n      isDraggable={isDraggable}\n      {...props}\n      bullets={childCount > 0 && bullets}\n      slideIndex={safeSlideIndex}\n      onChange={handleChange}\n    >\n      {slides}\n    </BaseGallery>\n  );\n};\n"],"names":["Gallery","initialSlideIndex","children","timeout","onChange","bullets","props","React","useState","localSlideIndex","setSlideIndex","isControlled","slideIndex","isDraggable","Boolean","slides","useMemo","Children","toArray","filter","item","childCount","length","handleChange","useCallback","current","autoplay","useTimeout","useEffect","set","clear","safeSlideIndex","clamp","BaseGallery"],"mappings":";;;;+BAcaA;;;eAAAA;;;;;;;;+DAdU;oBACD;0BACK;2BACC;AAWrB,IAAMA,UAAU;0CACrBC,mBAAAA,0DAAoB,8BACpBC,kBAAAA,kCACAC,SAAAA,sCAAU,oBACVC,kBAAAA,UACAC,iBAAAA,SACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAyCE,qCAAAA,OAAMC,SAASP,wBAAjDQ,kBAAkCF,oBAAjBG,gBAAiBH;IACzC,IAAMI,eAAe,OAAOL,MAAMM,eAAe;QACfN;IAAlC,IAAMM,aAAaD,eAAeL,CAAAA,oBAAAA,MAAMM,wBAANN,+BAAAA,oBAAoB,IAAIG;IAC1D,IAAMI,cAAc,CAACF,gBAAgBG,QAAQV;IAC7C,IAAMW,SAASR,OAAMS,QACnB;eAAMT,OAAMU,SAASC,QAAQhB,UAAUiB,OAAO,SAACC;mBAASN,QAAQM;;OAChE;QAAClB;KAAS;IAEZ,IAAMmB,aAAaN,OAAOO;IAE1B,IAAMC,eAAyChB,OAAMiB,YACnD,SAACC;QACC,IAAIA,YAAYb,YAAY;YAC1B;QACF;QACA,CAACD,gBAAgBD,cAAce;QAC/BrB,YAAYA,SAASqB;IACvB,GACA;QAACd;QAAcP;QAAUQ;KAAW;IAGtC,IAAMc,WAAWC,IAAAA,wBAAW;eAAMJ,aAAa,AAACX,CAAAA,aAAa,CAAA,IAAKS;OAAalB;IAC/EI,OAAMqB,UACJ;eAAOzB,UAAUuB,SAASG,QAAQH,SAASI;OAC3C;QAAC3B;QAASS;QAAYc;KAAS;IAGjC,6BAA6B;IAC7B,gEAAgE;IAChE,IAAMK,iBAAiBV,aAAa,IAAIW,IAAAA,aAAMpB,YAAY,GAAGS,aAAa,KAAKT;IAC/E,mCAAmC;IACnCL,OAAMqB,UAAU;QACd,IAAIxB,YAAY2B,mBAAmBnB,YAAY;YAC7CR,SAAS2B;QACX;QACArB,cAAcqB;IAChB,GAAG;QAAC3B;QAAU2B;QAAgBnB;KAAW;IAEzC,qBACE,qBAACqB;QACCpB,aAAaA;OACTP;QACJD,SAASgB,aAAa,KAAKhB;QAC3BO,YAAYmB;QACZ3B,UAAUmB;QAETR;AAGP"}
+{"version":3,"sources":["../../../../src/components/Gallery/Gallery.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clamp } from '../../helpers/math';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { BaseGallery } from '../BaseGallery/BaseGallery';\nimport { BaseGalleryProps } from '../BaseGallery/types';\n\nexport interface GalleryProps extends BaseGalleryProps {\n  initialSlideIndex?: number;\n  timeout?: number;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Gallery\n */\nexport const Gallery = ({\n  initialSlideIndex = 0,\n  children,\n  timeout = 0,\n  onChange,\n  bullets,\n  ...props\n}: GalleryProps) => {\n  const [localSlideIndex, setSlideIndex] = React.useState(initialSlideIndex);\n  const isControlled = typeof props.slideIndex === 'number';\n  const slideIndex = isControlled ? props.slideIndex ?? 0 : localSlideIndex;\n  const isDraggable = !isControlled || Boolean(onChange);\n  const slides = React.useMemo(\n    () => React.Children.toArray(children).filter((item) => Boolean(item)),\n    [children],\n  );\n  const childCount = slides.length;\n\n  const handleChange: GalleryProps['onChange'] = React.useCallback(\n    (current: number) => {\n      if (current === slideIndex) {\n        return;\n      }\n      !isControlled && setSlideIndex(current);\n      onChange && onChange(current);\n    },\n    [isControlled, onChange, slideIndex],\n  );\n\n  const autoplay = useTimeout(() => handleChange((slideIndex + 1) % childCount), timeout);\n  React.useEffect(\n    () => (timeout ? autoplay.set() : autoplay.clear()),\n    [timeout, slideIndex, autoplay],\n  );\n\n  // prevent invalid slideIndex\n  // any slide index is invalid with no slides, just keep it as is\n  const safeSlideIndex = childCount > 0 ? clamp(slideIndex, 0, childCount - 1) : slideIndex;\n  // notify parent in controlled mode\n  React.useEffect(() => {\n    if (onChange && safeSlideIndex !== slideIndex) {\n      onChange(safeSlideIndex);\n    }\n    setSlideIndex(safeSlideIndex);\n  }, [onChange, safeSlideIndex, slideIndex]);\n\n  return (\n    <BaseGallery\n      isDraggable={isDraggable}\n      {...props}\n      bullets={childCount > 0 && bullets}\n      slideIndex={safeSlideIndex}\n      onChange={handleChange}\n    >\n      {slides}\n    </BaseGallery>\n  );\n};\n"],"names":["Gallery","initialSlideIndex","children","timeout","onChange","bullets","props","React","useState","localSlideIndex","setSlideIndex","isControlled","slideIndex","isDraggable","Boolean","slides","useMemo","Children","toArray","filter","item","childCount","length","handleChange","useCallback","current","autoplay","useTimeout","useEffect","set","clear","safeSlideIndex","clamp","BaseGallery"],"mappings":";;;;+BAcaA;;;eAAAA;;;;;;;;+DAdU;oBACD;0BACK;2BACC;AAWrB,IAAMA,UAAU;0CACrBC,mBAAAA,0DAAoB,8BACpBC,kBAAAA,kCACAC,SAAAA,sCAAU,oBACVC,kBAAAA,UACAC,iBAAAA,SACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAyCE,qCAAAA,OAAMC,QAAQ,CAACP,wBAAjDQ,kBAAkCF,oBAAjBG,gBAAiBH;IACzC,IAAMI,eAAe,OAAOL,MAAMM,UAAU,KAAK;QACfN;IAAlC,IAAMM,aAAaD,eAAeL,CAAAA,oBAAAA,MAAMM,UAAU,cAAhBN,+BAAAA,oBAAoB,IAAIG;IAC1D,IAAMI,cAAc,CAACF,gBAAgBG,QAAQV;IAC7C,IAAMW,SAASR,OAAMS,OAAO,CAC1B;eAAMT,OAAMU,QAAQ,CAACC,OAAO,CAAChB,UAAUiB,MAAM,CAAC,SAACC;mBAASN,QAAQM;;OAChE;QAAClB;KAAS;IAEZ,IAAMmB,aAAaN,OAAOO,MAAM;IAEhC,IAAMC,eAAyChB,OAAMiB,WAAW,CAC9D,SAACC;QACC,IAAIA,YAAYb,YAAY;YAC1B;QACF;QACA,CAACD,gBAAgBD,cAAce;QAC/BrB,YAAYA,SAASqB;IACvB,GACA;QAACd;QAAcP;QAAUQ;KAAW;IAGtC,IAAMc,WAAWC,IAAAA,sBAAU,EAAC;eAAMJ,aAAa,AAACX,CAAAA,aAAa,CAAA,IAAKS;OAAalB;IAC/EI,OAAMqB,SAAS,CACb;eAAOzB,UAAUuB,SAASG,GAAG,KAAKH,SAASI,KAAK;OAChD;QAAC3B;QAASS;QAAYc;KAAS;IAGjC,6BAA6B;IAC7B,gEAAgE;IAChE,IAAMK,iBAAiBV,aAAa,IAAIW,IAAAA,WAAK,EAACpB,YAAY,GAAGS,aAAa,KAAKT;IAC/E,mCAAmC;IACnCL,OAAMqB,SAAS,CAAC;QACd,IAAIxB,YAAY2B,mBAAmBnB,YAAY;YAC7CR,SAAS2B;QACX;QACArB,cAAcqB;IAChB,GAAG;QAAC3B;QAAU2B;QAAgBnB;KAAW;IAEzC,qBACE,qBAACqB,wBAAW;QACVpB,aAAaA;OACTP;QACJD,SAASgB,aAAa,KAAKhB;QAC3BO,YAAYmB;QACZ3B,UAAUmB;QAETR;AAGP"}

package/dist/cjs/components/Gradient/Gradient.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Gradient/Gradient.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './Gradient.module.css';\n\nexport interface GradientProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Тип градиента\n   */\n  mode?: 'tint' | 'white' | 'black';\n  /**\n   * Направление градиента\n   */\n  to?: 'top' | 'bottom';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Gradient\n */\nexport const Gradient = ({\n  mode = 'tint',\n  children,\n  to = 'top',\n  className,\n  ...restProps\n}: GradientProps) => {\n  return (\n    <div\n      role=\"presentation\"\n      {...restProps}\n      className={classNames(\n        {\n          tint: styles['Gradient--mode-tint'],\n          black: styles['Gradient--mode-black'],\n          white: styles['Gradient--mode-white'],\n        }[mode],\n        {\n          top: styles['Gradient--to-top'],\n          bottom: styles['Gradient--to-bottom'],\n        }[to],\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["Gradient","mode","children","to","className","restProps","div","role","classNames","tint","black","white","top","bottom"],"mappings":";;;;+BAkBaA;;;eAAAA;;;;;;;+DAlBU;oBACI;AAiBpB,IAAMA,WAAW;6BACtBC,MAAAA,gCAAO,sBACPC,kBAAAA,6BACAC,IAAAA,4BAAK,mBACLC,mBAAAA,WACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,qBACE,qBAACE;QACCC,MAAK;OACDF;QACJD,WAAWI,IAAAA,kBACT;YACEC,IAAI;YACJC,KAAK;YACLC,KAAK;QACP,CAAC,CAACV,KAAK,EACP;YACEW,GAAG;YACHC,MAAM;QACR,CAAC,CAACV,GAAG,EACLC;QAGDF;AAGP"}
+{"version":3,"sources":["../../../../src/components/Gradient/Gradient.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './Gradient.module.css';\n\nexport interface GradientProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Тип градиента\n   */\n  mode?: 'tint' | 'white' | 'black';\n  /**\n   * Направление градиента\n   */\n  to?: 'top' | 'bottom';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Gradient\n */\nexport const Gradient = ({\n  mode = 'tint',\n  children,\n  to = 'top',\n  className,\n  ...restProps\n}: GradientProps) => {\n  return (\n    <div\n      role=\"presentation\"\n      {...restProps}\n      className={classNames(\n        {\n          tint: styles['Gradient--mode-tint'],\n          black: styles['Gradient--mode-black'],\n          white: styles['Gradient--mode-white'],\n        }[mode],\n        {\n          top: styles['Gradient--to-top'],\n          bottom: styles['Gradient--to-bottom'],\n        }[to],\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["Gradient","mode","children","to","className","restProps","div","role","classNames","tint","black","white","top","bottom"],"mappings":";;;;+BAkBaA;;;eAAAA;;;;;;;+DAlBU;oBACI;AAiBpB,IAAMA,WAAW;6BACtBC,MAAAA,gCAAO,sBACPC,kBAAAA,6BACAC,IAAAA,4BAAK,mBACLC,mBAAAA,WACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,qBACE,qBAACE;QACCC,MAAK;OACDF;QACJD,WAAWI,IAAAA,gBAAU,EACnB;YACEC,IAAI;YACJC,KAAK;YACLC,KAAK;QACP,CAAC,CAACV,KAAK,EACP;YACEW,GAAG;YACHC,MAAM;QACR,CAAC,CAACV,GAAG,EACLC;QAGDF;AAGP"}

package/dist/cjs/components/GridAvatar/GridAvatar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/GridAvatar/GridAvatar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ImageBase, type ImageBaseProps } from '../ImageBase/ImageBase';\nimport { GridAvatarBadge, type GridAvatarBadgeProps } from './GridAvatarBadge/GridAvatarBadge';\nimport styles from './GridAvatar.module.css';\n\nexport { GridAvatarBadgeProps };\n\nexport const GRID_AVATAR_DEFAULT_SIZE = 48;\n\nexport const MAX_GRID_LENGTH = 4;\n\nexport interface GridAvatarProps extends Omit<ImageBaseProps, 'src' | 'fallbackIcon'> {\n  /**\n   * Массив со ссылками. От 1 до 4 элементов.\n   */\n  src?: string[];\n}\n\nconst warn = warnOnce('GridAvatar');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/GridAvatar\n */\nexport const GridAvatar = ({\n  src = [],\n  size = GRID_AVATAR_DEFAULT_SIZE,\n  className,\n  children,\n  ...restProps\n}: GridAvatarProps) => {\n  if (process.env.NODE_ENV === 'development') {\n    if (src.length > MAX_GRID_LENGTH) {\n      warn(`Длина массива src (${src.length}) больше максимальной (${MAX_GRID_LENGTH})`, 'error');\n    }\n  }\n\n  return (\n    <ImageBase {...restProps} size={size} className={classNames(styles['GridAvatar'], className)}>\n      <div className={styles['GridAvatar__in']} aria-hidden>\n        {src.map((url, index) =>\n          index < MAX_GRID_LENGTH ? (\n            <div\n              key={url}\n              className={styles['GridAvatar__item']}\n              style={{ backgroundImage: `url(${url})` }}\n            />\n          ) : null,\n        )}\n      </div>\n      {children}\n    </ImageBase>\n  );\n};\n\nGridAvatar.Badge = GridAvatarBadge;\n"],"names":["GRID_AVATAR_DEFAULT_SIZE","MAX_GRID_LENGTH","GridAvatar","warn","warnOnce","src","size","className","children","restProps","process","env","NODE_ENV","length","ImageBase","classNames","div","aria-hidden","map","url","index","key","style","backgroundImage","Badge","GridAvatarBadge"],"mappings":";;;;;;;;;;;IASaA,wBAAwB;eAAxBA;;IAEAC,eAAe;eAAfA;;IAcAC,UAAU;eAAVA;;;;;;;+DAzBU;oBACI;wBACF;yBACsB;+BACY;AAKpD,IAAMF,2BAA2B;AAEjC,IAAMC,kBAAkB;AAS/B,IAAME,OAAOC,IAAAA,oBAAS;AAKf,IAAMF,aAAa;4BACxBG,KAAAA,8BAAM,EAAE,oCACRC,MAAAA,gCAAON,wCACPO,mBAAAA,WACAC,kBAAAA,UACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAIE,QAAQC,IAAIC,aAAa,eAAe;QAC1C,IAAIP,IAAIQ,SAASZ,iBAAiB;YAChCE,KAAK,AAAC,sBAAyDF,OAApCI,IAAIQ,QAAO,2BAAyC,OAAhBZ,iBAAgB,MAAI;QACrF;IACF;IAEA,qBACE,qBAACa,kEAAcL;QAAWH,MAAMA;QAAMC,WAAWQ,IAAAA,oCAAiCR;sBAChF,qBAACS;QAAIT,SAAS;QAA4BU,eAAAA;OACvCZ,IAAIa,IAAI,SAACC,KAAKC;eACbA,QAAQnB,gCACN,qBAACe;YACCK,KAAKF;YACLZ,SAAS;YACTe,OAAO;gBAAEC,iBAAiB,AAAC,OAAU,OAAJJ,KAAI;YAAG;aAExC;SAGPX;AAGP;AAEAN,WAAWsB,QAAQC"}
+{"version":3,"sources":["../../../../src/components/GridAvatar/GridAvatar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ImageBase, type ImageBaseProps } from '../ImageBase/ImageBase';\nimport { GridAvatarBadge, type GridAvatarBadgeProps } from './GridAvatarBadge/GridAvatarBadge';\nimport styles from './GridAvatar.module.css';\n\nexport { GridAvatarBadgeProps };\n\nexport const GRID_AVATAR_DEFAULT_SIZE = 48;\n\nexport const MAX_GRID_LENGTH = 4;\n\nexport interface GridAvatarProps extends Omit<ImageBaseProps, 'src' | 'fallbackIcon'> {\n  /**\n   * Массив со ссылками. От 1 до 4 элементов.\n   */\n  src?: string[];\n}\n\nconst warn = warnOnce('GridAvatar');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/GridAvatar\n */\nexport const GridAvatar = ({\n  src = [],\n  size = GRID_AVATAR_DEFAULT_SIZE,\n  className,\n  children,\n  ...restProps\n}: GridAvatarProps) => {\n  if (process.env.NODE_ENV === 'development') {\n    if (src.length > MAX_GRID_LENGTH) {\n      warn(`Длина массива src (${src.length}) больше максимальной (${MAX_GRID_LENGTH})`, 'error');\n    }\n  }\n\n  return (\n    <ImageBase {...restProps} size={size} className={classNames(styles['GridAvatar'], className)}>\n      <div className={styles['GridAvatar__in']} aria-hidden>\n        {src.map((url, index) =>\n          index < MAX_GRID_LENGTH ? (\n            <div\n              key={url}\n              className={styles['GridAvatar__item']}\n              style={{ backgroundImage: `url(${url})` }}\n            />\n          ) : null,\n        )}\n      </div>\n      {children}\n    </ImageBase>\n  );\n};\n\nGridAvatar.Badge = GridAvatarBadge;\n"],"names":["GRID_AVATAR_DEFAULT_SIZE","MAX_GRID_LENGTH","GridAvatar","warn","warnOnce","src","size","className","children","restProps","process","env","NODE_ENV","length","ImageBase","classNames","div","aria-hidden","map","url","index","key","style","backgroundImage","Badge","GridAvatarBadge"],"mappings":";;;;;;;;;;;IASaA,wBAAwB;eAAxBA;;IAEAC,eAAe;eAAfA;;IAcAC,UAAU;eAAVA;;;;;;;+DAzBU;oBACI;wBACF;yBACsB;+BACY;AAKpD,IAAMF,2BAA2B;AAEjC,IAAMC,kBAAkB;AAS/B,IAAME,OAAOC,IAAAA,kBAAQ,EAAC;AAKf,IAAMF,aAAa;4BACxBG,KAAAA,8BAAM,EAAE,oCACRC,MAAAA,gCAAON,wCACPO,mBAAAA,WACAC,kBAAAA,UACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAIE,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,IAAIP,IAAIQ,MAAM,GAAGZ,iBAAiB;YAChCE,KAAK,AAAC,sBAAyDF,OAApCI,IAAIQ,MAAM,EAAC,2BAAyC,OAAhBZ,iBAAgB,MAAI;QACrF;IACF;IAEA,qBACE,qBAACa,oBAAS,8CAAKL;QAAWH,MAAMA;QAAMC,WAAWQ,IAAAA,gBAAU,oBAAuBR;sBAChF,qBAACS;QAAIT,SAAS;QAA4BU,eAAAA;OACvCZ,IAAIa,GAAG,CAAC,SAACC,KAAKC;eACbA,QAAQnB,gCACN,qBAACe;YACCK,KAAKF;YACLZ,SAAS;YACTe,OAAO;gBAAEC,iBAAiB,AAAC,OAAU,OAAJJ,KAAI;YAAG;aAExC;SAGPX;AAGP;AAEAN,WAAWsB,KAAK,GAAGC,gCAAe"}

package/dist/cjs/components/GridAvatar/GridAvatarBadge/GridAvatarBadge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/GridAvatar/GridAvatarBadge/GridAvatarBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ImageBase, type ImageBaseBadgeProps, ImageBaseContext } from '../../ImageBase/ImageBase';\nimport styles from './GridAvatarBadge.module.css';\n\nexport type GridAvatarBadgeProps = ImageBaseBadgeProps;\n\nexport const GridAvatarBadge = ({ className, ...restProps }: GridAvatarBadgeProps) => {\n  const { size } = React.useContext(ImageBaseContext);\n  return (\n    <ImageBase.Badge\n      {...restProps}\n      className={classNames(\n        styles['GridAvatarBadge'],\n        size < 96 && styles['GridAvatarBadge--shifted'],\n        className,\n      )}\n    />\n  );\n};\n"],"names":["GridAvatarBadge","className","restProps","size","React","useContext","ImageBaseContext","ImageBase","Badge","classNames"],"mappings":";;;;+BAOaA;;;eAAAA;;;;;;;+DAPU;oBACI;yBAC2C;AAK/D,IAAMA,kBAAkB;QAAGC,mBAAAA,WAAcC;QAAdD;;IAChC,IAAM,AAAEE,OAASC,OAAMC,WAAWC,6BAA1BH;IACR,qBACE,qBAACI,qBAAUC,mDACLN;QACJD,WAAWQ,IAAAA,yCAETN,OAAO,sCACPF;;AAIR"}
+{"version":3,"sources":["../../../../../src/components/GridAvatar/GridAvatarBadge/GridAvatarBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ImageBase, type ImageBaseBadgeProps, ImageBaseContext } from '../../ImageBase/ImageBase';\nimport styles from './GridAvatarBadge.module.css';\n\nexport type GridAvatarBadgeProps = ImageBaseBadgeProps;\n\nexport const GridAvatarBadge = ({ className, ...restProps }: GridAvatarBadgeProps) => {\n  const { size } = React.useContext(ImageBaseContext);\n  return (\n    <ImageBase.Badge\n      {...restProps}\n      className={classNames(\n        styles['GridAvatarBadge'],\n        size < 96 && styles['GridAvatarBadge--shifted'],\n        className,\n      )}\n    />\n  );\n};\n"],"names":["GridAvatarBadge","className","restProps","size","React","useContext","ImageBaseContext","ImageBase","Badge","classNames"],"mappings":";;;;+BAOaA;;;eAAAA;;;;;;;+DAPU;oBACI;yBAC2C;AAK/D,IAAMA,kBAAkB;QAAGC,mBAAAA,WAAcC;QAAdD;;IAChC,IAAM,AAAEE,OAASC,OAAMC,UAAU,CAACC,2BAAgB,EAA1CH;IACR,qBACE,qBAACI,oBAAS,CAACC,KAAK,8CACVN;QACJD,WAAWQ,IAAAA,gBAAU,yBAEnBN,OAAO,sCACPF;;AAIR"}

package/dist/cjs/components/Group/Group.d.ts

@@ -4,20 +4,20 @@ export interface GroupProps extends HasRootRef<HTMLElement>, React.HTMLAttribute
     header?: React.ReactNode;
     description?: React.ReactNode;
     /**
-      show - разделитель всегда показывается,
-      hide - разделитель всегда спрятан,
-      auto - разделитель рисуется автоматически между соседними группами.
+      `show` - разделитель всегда показывается,
+      `hide` - разделитель всегда спрятан,
+      `auto` - разделитель рисуется автоматически между соседними группами.
      */
     separator?: 'show' | 'hide' | 'auto';
     /**
-     * Режим отображения. Если установлен 'card', выглядит как карточка c
-     * обводкой и внешними отступами. Если 'plain' — без отступов и обводки.
-     * По умолчанию режим отображения зависит от `sizeX`. В модальных окнах
-     * по умолчанию 'plain'.
+     * Режим отображения. Если установлен `card`, выглядит как карточка c
+     * обводкой и внешними отступами. Если `plain` — без отступов и обводки.
+     * По умолчанию режим отображения зависит от `sizeX` (`mode=card` при `sizeX=REGULAR` и `mode=plain` при `sizeX=COMPACT`)
+     * В модальных окнах по умолчанию `plain`.
      */
     mode?: 'plain' | 'card';
     /**
-     * Отвечает за отступы вокруг контента в режиме 'card'.
+     * Отвечает за отступы вокруг контента в режиме `card`.
      */
     padding?: 's' | 'm';
 }

package/dist/cjs/components/Group/Group.js

@@ -60,7 +60,7 @@ var Group = function(_param) {
     return /*#__PURE__*/ _react.createElement(_react.Fragment, null, /*#__PURE__*/ _react.createElement("section", _object_spread_props._(_object_spread._({}, restProps), {
         tabIndex: tabIndex,
         ref: getRootRef,
-        className: (0, _vkjs.classNames)("vkuiInternalGroup", "vkuiGroup", platform === _platform.Platform.IOS && "vkuiGroup--ios", sizeX !== _adaptivity.SizeType.REGULAR && sizeXClassNames[sizeX], mode && ({
+        className: (0, _vkjs.classNames)("vkuiInternalGroup", "vkuiGroup", isInsideModal && "vkuiGroup--inside-modal", platform === _platform.Platform.IOS && "vkuiGroup--ios", sizeX !== _adaptivity.SizeType.REGULAR && sizeXClassNames[sizeX], mode && ({
             none: (0, _vkjs.classNames)("vkuiGroup--mode-none", "vkuiInternalGroup--mode-none"),
             plain: (0, _vkjs.classNames)("vkuiGroup--mode-plain", "vkuiInternalGroup--mode-plain"),
             card: (0, _vkjs.classNames)("vkuiGroup--mode-card", "vkuiInternalGroup--mode-card")

package/dist/cjs/components/Group/Group.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Group/Group.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HasChildren, HasRootRef } from '../../types';\nimport { ModalRootContext } from '../ModalRoot/ModalRootContext';\nimport { Separator } from '../Separator/Separator';\nimport { Spacing } from '../Spacing/Spacing';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './Group.module.css';\n\nconst sizeXClassNames = {\n  none: classNames(styles['Group--sizeX-none'], 'vkuiInternalGroup--sizeX-none'),\n  [SizeType.COMPACT]: styles['Group--sizeX-compact'],\n};\n\nexport interface GroupProps\n  extends HasRootRef<HTMLElement>,\n    React.HTMLAttributes<HTMLElement>,\n    HasChildren {\n  header?: React.ReactNode;\n  description?: React.ReactNode;\n  /**\n    show - разделитель всегда показывается,\n    hide - разделитель всегда спрятан,\n    auto - разделитель рисуется автоматически между соседними группами.\n   */\n  separator?: 'show' | 'hide' | 'auto';\n  /**\n   * Режим отображения. Если установлен 'card', выглядит как карточка c\n   * обводкой и внешними отступами. Если 'plain' — без отступов и обводки.\n   * По умолчанию режим отображения зависит от `sizeX`. В модальных окнах\n   * по умолчанию 'plain'.\n   */\n  mode?: 'plain' | 'card';\n  /**\n   * Отвечает за отступы вокруг контента в режиме 'card'.\n   */\n  padding?: 's' | 'm';\n}\n\nconst warn = warnOnce('Group');\n/**\n * @see https://vkcom.github.io/VKUI/#/Group\n */\nexport const Group = ({\n  header,\n  description,\n  children,\n  separator = 'auto',\n  getRootRef,\n  mode: modeProps,\n  padding = 'm',\n  className,\n  tabIndex: tabIndexProp,\n  ...restProps\n}: GroupProps) => {\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n  const { sizeX = 'none' } = useAdaptivity();\n\n  let mode: GroupProps['mode'] | 'none' = modeProps;\n\n  if (!modeProps) {\n    // Подробнее в \"none\" можно прочитать в ADAPTIVITY_GUIDE.md\n    mode = isInsideModal ? 'plain' : 'none';\n  }\n\n  if (mode === 'none' && sizeX !== 'none') {\n    mode = sizeX === SizeType.REGULAR ? 'card' : 'plain';\n  }\n\n  const isTabPanel = restProps.role === 'tabpanel';\n\n  if (\n    process.env.NODE_ENV === 'development' &&\n    isTabPanel &&\n    (!restProps['aria-controls'] || !restProps['id'])\n  ) {\n    warn(\n      'При использовании роли \"tabpanel\" необходимо задать значение свойств \"aria-controls\" и \"id\"',\n    );\n  }\n\n  const tabIndex = isTabPanel && tabIndexProp === undefined ? 0 : tabIndexProp;\n\n  const separatorClassName = classNames(\n    styles['Group__separator'],\n    separator === 'show' && styles['Group__separator--force'],\n  );\n\n  return (\n    <>\n      <section\n        {...restProps}\n        tabIndex={tabIndex}\n        ref={getRootRef}\n        className={classNames(\n          'vkuiInternalGroup',\n          styles['Group'],\n          platform === Platform.IOS && styles['Group--ios'],\n          sizeX !== SizeType.REGULAR && sizeXClassNames[sizeX],\n          mode &&\n            {\n              none: classNames(styles['Group--mode-none'], 'vkuiInternalGroup--mode-none'),\n              plain: classNames(styles['Group--mode-plain'], 'vkuiInternalGroup--mode-plain'),\n              card: classNames(styles['Group--mode-card'], 'vkuiInternalGroup--mode-card'),\n            }[mode],\n          {\n            s: styles['Group--padding-s'],\n            m: styles['Group--padding-m'],\n          }[padding],\n          className,\n        )}\n      >\n        {header}\n        {children}\n        {hasReactNode(description) && (\n          <Footnote className={styles['Group__description']}>{description}</Footnote>\n        )}\n      </section>\n\n      {separator !== 'hide' && (\n        <React.Fragment>\n          <Spacing\n            className={classNames(separatorClassName, styles['Group__separator--spacing'])}\n            size={16}\n          />\n          <Separator\n            className={classNames(separatorClassName, styles['Group__separator--separator'])}\n          />\n        </React.Fragment>\n      )}\n    </>\n  );\n};\n"],"names":["Group","sizeXClassNames","none","classNames","SizeType","COMPACT","warn","warnOnce","header","description","children","separator","getRootRef","mode","modeProps","padding","className","tabIndex","tabIndexProp","restProps","isInsideModal","React","useContext","ModalRootContext","platform","usePlatform","useAdaptivity","sizeX","REGULAR","isTabPanel","role","process","env","NODE_ENV","undefined","separatorClassName","section","ref","Platform","IOS","plain","card","s","m","hasReactNode","Footnote","Fragment","Spacing","size","Separator"],"mappings":";;;;+BAgDaA;;;eAAAA;;;;;;;;+DAhDU;oBACkB;6BACX;2BACF;0BACH;wBACA;wBACA;gCAEQ;yBACP;uBACF;wBACC;AAGzB,IAAMC;IACJC,MAAMC,IAAAA,2CAAwC;GAC7CC,qBAASC;AA4BZ,IAAMC,OAAOC,IAAAA,oBAAS;AAIf,IAAMP,QAAQ;QACnBQ,gBAAAA,QACAC,qBAAAA,aACAC,kBAAAA,oCACAC,WAAAA,0CAAY,2BACZC,oBAAAA,YACAC,AAAMC,mBAAND,8BACAE,SAAAA,sCAAU,sBACVC,mBAAAA,WACAC,AAAUC,sBAAVD,UACGE;QATHX;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;;IAGA,IAAM,AAAEG,gBAAkBC,OAAMC,WAAWC,oCAAnCH;IACR,IAAMI,WAAWC,IAAAA;IACjB,IAA2BC,kBAAAA,IAAAA,wDAAAA,gBAAnBC,OAAAA,0CAAQ;IAEhB,IAAId,OAAoCC;IAExC,IAAI,CAACA,WAAW;QACd,2DAA2D;QAC3DD,OAAOO,gBAAgB,UAAU;IACnC;IAEA,IAAIP,SAAS,UAAUc,UAAU,QAAQ;QACvCd,OAAOc,UAAUvB,qBAASwB,UAAU,SAAS;IAC/C;IAEA,IAAMC,aAAaV,UAAUW,SAAS;IAEtC,IACEC,QAAQC,IAAIC,aAAa,iBACzBJ,cACC,CAAA,CAACV,SAAS,CAAC,gBAAgB,IAAI,CAACA,SAAS,CAAC,KAAK,AAAD,GAC/C;QACAb,KACE;IAEJ;IAEA,IAAMW,WAAWY,cAAcX,iBAAiBgB,YAAY,IAAIhB;IAEhE,IAAMiB,qBAAqBhC,IAAAA,0CAEzBQ,cAAc;IAGhB,qBACE,0DACE,qBAACyB,uDACKjB;QACJF,UAAUA;QACVoB,KAAKzB;QACLI,WAAWb,IAAAA,kBACT,kCAEAqB,aAAac,mBAASC,yBACtBZ,UAAUvB,qBAASwB,WAAW3B,eAAe,CAAC0B,MAAM,EACpDd,QACE,CAAA;YACEX,MAAMC,IAAAA,0CAAuC;YAC7CqC,OAAOrC,IAAAA,2CAAwC;YAC/CsC,MAAMtC,IAAAA,0CAAuC;QAC/C,CAAA,CAAC,CAACU,KAAK,EACT;YACE6B,CAAC;YACDC,CAAC;QACH,CAAC,CAAC5B,QAAQ,EACVC;QAGDR,QACAE,UACAkC,IAAAA,oBAAanC,8BACZ,qBAACoC;QAAS7B,SAAS;OAAiCP,eAIvDE,cAAc,wBACb,qBAACU,OAAMyB,8BACL,qBAACC;QACC/B,WAAWb,IAAAA,kBAAWgC;QACtBa,MAAM;sBAER,qBAACC;QACCjC,WAAWb,IAAAA,kBAAWgC;;AAMlC"}
+{"version":3,"sources":["../../../../src/components/Group/Group.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HasChildren, HasRootRef } from '../../types';\nimport { ModalRootContext } from '../ModalRoot/ModalRootContext';\nimport { Separator } from '../Separator/Separator';\nimport { Spacing } from '../Spacing/Spacing';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './Group.module.css';\n\nconst sizeXClassNames = {\n  none: classNames(styles['Group--sizeX-none'], 'vkuiInternalGroup--sizeX-none'),\n  [SizeType.COMPACT]: styles['Group--sizeX-compact'],\n};\n\nexport interface GroupProps\n  extends HasRootRef<HTMLElement>,\n    React.HTMLAttributes<HTMLElement>,\n    HasChildren {\n  header?: React.ReactNode;\n  description?: React.ReactNode;\n  /**\n    `show` - разделитель всегда показывается,\n    `hide` - разделитель всегда спрятан,\n    `auto` - разделитель рисуется автоматически между соседними группами.\n   */\n  separator?: 'show' | 'hide' | 'auto';\n  /**\n   * Режим отображения. Если установлен `card`, выглядит как карточка c\n   * обводкой и внешними отступами. Если `plain` — без отступов и обводки.\n   * По умолчанию режим отображения зависит от `sizeX` (`mode=card` при `sizeX=REGULAR` и `mode=plain` при `sizeX=COMPACT`)\n   * В модальных окнах по умолчанию `plain`.\n   */\n  mode?: 'plain' | 'card';\n  /**\n   * Отвечает за отступы вокруг контента в режиме `card`.\n   */\n  padding?: 's' | 'm';\n}\n\nconst warn = warnOnce('Group');\n/**\n * @see https://vkcom.github.io/VKUI/#/Group\n */\nexport const Group = ({\n  header,\n  description,\n  children,\n  separator = 'auto',\n  getRootRef,\n  mode: modeProps,\n  padding = 'm',\n  className,\n  tabIndex: tabIndexProp,\n  ...restProps\n}: GroupProps) => {\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n  const { sizeX = 'none' } = useAdaptivity();\n\n  let mode: GroupProps['mode'] | 'none' = modeProps;\n\n  if (!modeProps) {\n    // Подробнее в \"none\" можно прочитать в ADAPTIVITY_GUIDE.md\n    mode = isInsideModal ? 'plain' : 'none';\n  }\n\n  if (mode === 'none' && sizeX !== 'none') {\n    mode = sizeX === SizeType.REGULAR ? 'card' : 'plain';\n  }\n\n  const isTabPanel = restProps.role === 'tabpanel';\n\n  if (\n    process.env.NODE_ENV === 'development' &&\n    isTabPanel &&\n    (!restProps['aria-controls'] || !restProps['id'])\n  ) {\n    warn(\n      'При использовании роли \"tabpanel\" необходимо задать значение свойств \"aria-controls\" и \"id\"',\n    );\n  }\n\n  const tabIndex = isTabPanel && tabIndexProp === undefined ? 0 : tabIndexProp;\n\n  const separatorClassName = classNames(\n    styles['Group__separator'],\n    separator === 'show' && styles['Group__separator--force'],\n  );\n\n  return (\n    <>\n      <section\n        {...restProps}\n        tabIndex={tabIndex}\n        ref={getRootRef}\n        className={classNames(\n          'vkuiInternalGroup',\n          styles['Group'],\n          isInsideModal && styles['Group--inside-modal'],\n          platform === Platform.IOS && styles['Group--ios'],\n          sizeX !== SizeType.REGULAR && sizeXClassNames[sizeX],\n          mode &&\n            {\n              none: classNames(styles['Group--mode-none'], 'vkuiInternalGroup--mode-none'),\n              plain: classNames(styles['Group--mode-plain'], 'vkuiInternalGroup--mode-plain'),\n              card: classNames(styles['Group--mode-card'], 'vkuiInternalGroup--mode-card'),\n            }[mode],\n          {\n            s: styles['Group--padding-s'],\n            m: styles['Group--padding-m'],\n          }[padding],\n          className,\n        )}\n      >\n        {header}\n        {children}\n        {hasReactNode(description) && (\n          <Footnote className={styles['Group__description']}>{description}</Footnote>\n        )}\n      </section>\n\n      {separator !== 'hide' && (\n        <React.Fragment>\n          <Spacing\n            className={classNames(separatorClassName, styles['Group__separator--spacing'])}\n            size={16}\n          />\n          <Separator\n            className={classNames(separatorClassName, styles['Group__separator--separator'])}\n          />\n        </React.Fragment>\n      )}\n    </>\n  );\n};\n"],"names":["Group","sizeXClassNames","none","classNames","SizeType","COMPACT","warn","warnOnce","header","description","children","separator","getRootRef","mode","modeProps","padding","className","tabIndex","tabIndexProp","restProps","isInsideModal","React","useContext","ModalRootContext","platform","usePlatform","useAdaptivity","sizeX","REGULAR","isTabPanel","role","process","env","NODE_ENV","undefined","separatorClassName","section","ref","Platform","IOS","plain","card","s","m","hasReactNode","Footnote","Fragment","Spacing","size","Separator"],"mappings":";;;;+BAgDaA;;;eAAAA;;;;;;;;+DAhDU;oBACkB;6BACX;2BACF;0BACH;wBACA;wBACA;gCAEQ;yBACP;uBACF;wBACC;AAGzB,IAAMC;IACJC,MAAMC,IAAAA,gBAAU,2BAA8B;GAC7CC,oBAAQ,CAACC,OAAO;AA4BnB,IAAMC,OAAOC,IAAAA,kBAAQ,EAAC;AAIf,IAAMP,QAAQ;QACnBQ,gBAAAA,QACAC,qBAAAA,aACAC,kBAAAA,oCACAC,WAAAA,0CAAY,2BACZC,oBAAAA,YACAC,AAAMC,mBAAND,8BACAE,SAAAA,sCAAU,sBACVC,mBAAAA,WACAC,AAAUC,sBAAVD,UACGE;QATHX;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;;IAGA,IAAM,AAAEG,gBAAkBC,OAAMC,UAAU,CAACC,kCAAgB,EAAnDH;IACR,IAAMI,WAAWC,IAAAA,wBAAW;IAC5B,IAA2BC,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBC,OAAAA,0CAAQ;IAEhB,IAAId,OAAoCC;IAExC,IAAI,CAACA,WAAW;QACd,2DAA2D;QAC3DD,OAAOO,gBAAgB,UAAU;IACnC;IAEA,IAAIP,SAAS,UAAUc,UAAU,QAAQ;QACvCd,OAAOc,UAAUvB,oBAAQ,CAACwB,OAAO,GAAG,SAAS;IAC/C;IAEA,IAAMC,aAAaV,UAAUW,IAAI,KAAK;IAEtC,IACEC,QAAQC,GAAG,CAACC,QAAQ,KAAK,iBACzBJ,cACC,CAAA,CAACV,SAAS,CAAC,gBAAgB,IAAI,CAACA,SAAS,CAAC,KAAK,AAAD,GAC/C;QACAb,KACE;IAEJ;IAEA,IAAMW,WAAWY,cAAcX,iBAAiBgB,YAAY,IAAIhB;IAEhE,IAAMiB,qBAAqBhC,IAAAA,gBAAU,0BAEnCQ,cAAc;IAGhB,qBACE,0DACE,qBAACyB,uDACKjB;QACJF,UAAUA;QACVoB,KAAKzB;QACLI,WAAWb,IAAAA,gBAAU,EACnB,kCAEAiB,4CACAI,aAAac,kBAAQ,CAACC,GAAG,sBACzBZ,UAAUvB,oBAAQ,CAACwB,OAAO,IAAI3B,eAAe,CAAC0B,MAAM,EACpDd,QACE,CAAA;YACEX,MAAMC,IAAAA,gBAAU,0BAA6B;YAC7CqC,OAAOrC,IAAAA,gBAAU,2BAA8B;YAC/CsC,MAAMtC,IAAAA,gBAAU,0BAA6B;QAC/C,CAAA,CAAC,CAACU,KAAK,EACT;YACE6B,CAAC;YACDC,CAAC;QACH,CAAC,CAAC5B,QAAQ,EACVC;QAGDR,QACAE,UACAkC,IAAAA,kBAAY,EAACnC,8BACZ,qBAACoC,kBAAQ;QAAC7B,SAAS;OAAiCP,eAIvDE,cAAc,wBACb,qBAACU,OAAMyB,QAAQ,sBACb,qBAACC,gBAAO;QACN/B,WAAWb,IAAAA,gBAAU,EAACgC;QACtBa,MAAM;sBAER,qBAACC,oBAAS;QACRjC,WAAWb,IAAAA,gBAAU,EAACgC;;AAMlC"}

package/dist/cjs/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 { Platform } from '../../lib/platform';\nimport { HasComponent, HasRootRef } from '../../types';\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 React.HTMLAttributes<HTMLElement>, HasRootRef<HTMLElement> {\n  mode?: 'primary' | 'secondary' | 'tertiary';\n  size?: 'regular' | 'large';\n  subtitle?: React.ReactNode;\n  /**\n   * Допускаются иконки, текст, Link\n   */\n  aside?: React.ReactNode;\n  /**\n   * Допускаются текст, Indicator\n   */\n  indicator?: React.ReactNode;\n  multiline?: boolean;\n}\n\ntype HeaderContentProps = Pick<HeaderProps, 'children' | 'mode' | 'size' | 'className'> &\n  HasComponent;\n\nconst HeaderContent = ({ mode, size, ...restProps }: HeaderContentProps) => {\n  const isLarge = size === 'large';\n\n  const platform = usePlatform();\n  if (platform === 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\n/**\n * @see https://vkcom.github.io/VKUI/#/Header\n */\nexport const Header = ({\n  mode = 'primary',\n  size = 'regular',\n  children,\n  subtitle,\n  indicator,\n  aside,\n  getRootRef,\n  multiline,\n  className,\n  ...restProps\n}: HeaderProps) => {\n  const platform = usePlatform();\n\n  return (\n    <header\n      {...restProps}\n      ref={getRootRef}\n      className={classNames(\n        styles['Header'],\n        platform === Platform.IOS && styles['Header--ios'],\n        {\n          primary: styles['Header--mode-primary'],\n          secondary: styles['Header--mode-secondary'],\n          tertiary: styles['Header--mode-tertiary'],\n        }[mode],\n        isPrimitiveReactNode(indicator) && styles['Header--pi'],\n        hasReactNode(subtitle) && styles['Header--with-subtitle'],\n        className,\n      )}\n    >\n      <div className={styles['Header__main']}>\n        <HeaderContent\n          className={styles['Header__content']}\n          Component=\"span\"\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=\"span\"\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    </header>\n  );\n};\n"],"names":["Header","HeaderContent","mode","size","restProps","isLarge","platform","usePlatform","Platform","IOS","Title","level","weight","Footnote","caps","Headline","children","subtitle","indicator","aside","getRootRef","multiline","className","header","ref","classNames","primary","secondary","tertiary","isPrimitiveReactNode","hasReactNode","div","Component","span","Subhead","Paragraph"],"mappings":";;;;+BAoEaA;;;eAAAA;;;;;;;+DApEU;oBACwC;2BACnC;wBACH;wBAEA;wBACA;yBACC;uBACF;qBACF;AAqBtB,IAAMC,gBAAgB;QAAGC,cAAAA,MAAMC,cAAAA,MAASC;QAAfF;QAAMC;;IAC7B,IAAME,UAAUF,SAAS;IAEzB,IAAMG,WAAWC,IAAAA;IACjB,IAAID,aAAaE,mBAASC,KAAK;QAC7B,OAAQP;YACN,KAAK;gBACH,OAAOG,wBACL,qBAACK;oBAAMC,OAAM;oBAAIC,QAAO;mBAAQR,4BAEhC,qBAACM;oBAAME,QAAO;oBAAID,OAAM;mBAAQP;YAEpC,KAAK;gBACH,qBAAO,qBAACS;oBAASD,QAAO;oBAAIE,MAAAA;mBAASV;YACvC,KAAK;gBACH,qBAAO,qBAACM;oBAAME,QAAO;oBAAID,OAAM;mBAAQP;QAC3C;IACF;IAEA,OAAQF;QACN,KAAK;YACH,OAAOG,wBACL,qBAACK;gBAAMC,OAAM;gBAAIC,QAAO;eAAQR,4BAEhC,qBAACW;gBAASH,QAAO;eAAQR;QAE7B,KAAK;YACH,qBAAO,qBAACS;gBAASD,QAAO;gBAAIE,MAAAA;eAASV;QACvC,KAAK;YACH,qBAAO,qBAACW;gBAASH,QAAO;eAAQR;IACpC;IAEA,OAAO;AACT;AAKO,IAAMJ,SAAS;6BACpBE,MAAAA,gCAAO,8CACPC,MAAAA,gCAAO,yBACPa,kBAAAA,UACAC,kBAAAA,UACAC,mBAAAA,WACAC,eAAAA,OACAC,oBAAAA,YACAC,mBAAAA,WACAC,mBAAAA,WACGlB;QATHF;QACAC;QACAa;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAMhB,WAAWC,IAAAA;IAEjB,qBACE,qBAACgB,sDACKnB;QACJoB,KAAKJ;QACLE,WAAWG,IAAAA,gCAETnB,aAAaE,mBAASC,0BACtB;YACEiB,OAAO;YACPC,SAAS;YACTC,QAAQ;QACV,CAAC,CAAC1B,KAAK,EACP2B,IAAAA,4BAAqBX,gCACrBY,IAAAA,oBAAab,0CACbK;sBAGF,qBAACS;QAAIT,SAAS;qBACZ,qBAACrB;QACCqB,SAAS;QACTU,WAAU;QACV9B,MAAMA;QACNC,MAAMA;qBAEN,qBAAC8B;QACCX,WAAWG,IAAAA,4CAETJ;OAGDL,WAEFc,IAAAA,oBAAaZ,4BACZ,qBAACL;QAASS,SAAS;QAA+BV,QAAO;OACtDM,aAKNY,IAAAA,oBAAab,2BACZ,qBAACiB;QACCZ,WAAWG,IAAAA,0CAETJ;QAEFW,WAAU;OAETf,YAKNa,IAAAA,oBAAaX,wBACZ,qBAACgB;QAAUb,SAAS;QAA2BU,WAAU;OACtDb;AAKX"}
+{"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 { Platform } from '../../lib/platform';\nimport { HasComponent, HasRootRef } from '../../types';\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 React.HTMLAttributes<HTMLElement>, HasRootRef<HTMLElement> {\n  mode?: 'primary' | 'secondary' | 'tertiary';\n  size?: 'regular' | 'large';\n  subtitle?: React.ReactNode;\n  /**\n   * Допускаются иконки, текст, Link\n   */\n  aside?: React.ReactNode;\n  /**\n   * Допускаются текст, Indicator\n   */\n  indicator?: React.ReactNode;\n  multiline?: boolean;\n}\n\ntype HeaderContentProps = Pick<HeaderProps, 'children' | 'mode' | 'size' | 'className'> &\n  HasComponent;\n\nconst HeaderContent = ({ mode, size, ...restProps }: HeaderContentProps) => {\n  const isLarge = size === 'large';\n\n  const platform = usePlatform();\n  if (platform === 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\n/**\n * @see https://vkcom.github.io/VKUI/#/Header\n */\nexport const Header = ({\n  mode = 'primary',\n  size = 'regular',\n  children,\n  subtitle,\n  indicator,\n  aside,\n  getRootRef,\n  multiline,\n  className,\n  ...restProps\n}: HeaderProps) => {\n  const platform = usePlatform();\n\n  return (\n    <header\n      {...restProps}\n      ref={getRootRef}\n      className={classNames(\n        styles['Header'],\n        platform === Platform.IOS && styles['Header--ios'],\n        {\n          primary: styles['Header--mode-primary'],\n          secondary: styles['Header--mode-secondary'],\n          tertiary: styles['Header--mode-tertiary'],\n        }[mode],\n        isPrimitiveReactNode(indicator) && styles['Header--pi'],\n        hasReactNode(subtitle) && styles['Header--with-subtitle'],\n        className,\n      )}\n    >\n      <div className={styles['Header__main']}>\n        <HeaderContent\n          className={styles['Header__content']}\n          Component=\"span\"\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=\"span\"\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    </header>\n  );\n};\n"],"names":["Header","HeaderContent","mode","size","restProps","isLarge","platform","usePlatform","Platform","IOS","Title","level","weight","Footnote","caps","Headline","children","subtitle","indicator","aside","getRootRef","multiline","className","header","ref","classNames","primary","secondary","tertiary","isPrimitiveReactNode","hasReactNode","div","Component","span","Subhead","Paragraph"],"mappings":";;;;+BAoEaA;;;eAAAA;;;;;;;+DApEU;oBACwC;2BACnC;wBACH;wBAEA;wBACA;yBACC;uBACF;qBACF;AAqBtB,IAAMC,gBAAgB;QAAGC,cAAAA,MAAMC,cAAAA,MAASC;QAAfF;QAAMC;;IAC7B,IAAME,UAAUF,SAAS;IAEzB,IAAMG,WAAWC,IAAAA,wBAAW;IAC5B,IAAID,aAAaE,kBAAQ,CAACC,GAAG,EAAE;QAC7B,OAAQP;YACN,KAAK;gBACH,OAAOG,wBACL,qBAACK,YAAK;oBAACC,OAAM;oBAAIC,QAAO;mBAAQR,4BAEhC,qBAACM,YAAK;oBAACE,QAAO;oBAAID,OAAM;mBAAQP;YAEpC,KAAK;gBACH,qBAAO,qBAACS,kBAAQ;oBAACD,QAAO;oBAAIE,MAAAA;mBAASV;YACvC,KAAK;gBACH,qBAAO,qBAACM,YAAK;oBAACE,QAAO;oBAAID,OAAM;mBAAQP;QAC3C;IACF;IAEA,OAAQF;QACN,KAAK;YACH,OAAOG,wBACL,qBAACK,YAAK;gBAACC,OAAM;gBAAIC,QAAO;eAAQR,4BAEhC,qBAACW,kBAAQ;gBAACH,QAAO;eAAQR;QAE7B,KAAK;YACH,qBAAO,qBAACS,kBAAQ;gBAACD,QAAO;gBAAIE,MAAAA;eAASV;QACvC,KAAK;YACH,qBAAO,qBAACW,kBAAQ;gBAACH,QAAO;eAAQR;IACpC;IAEA,OAAO;AACT;AAKO,IAAMJ,SAAS;6BACpBE,MAAAA,gCAAO,8CACPC,MAAAA,gCAAO,yBACPa,kBAAAA,UACAC,kBAAAA,UACAC,mBAAAA,WACAC,eAAAA,OACAC,oBAAAA,YACAC,mBAAAA,WACAC,mBAAAA,WACGlB;QATHF;QACAC;QACAa;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAMhB,WAAWC,IAAAA,wBAAW;IAE5B,qBACE,qBAACgB,sDACKnB;QACJoB,KAAKJ;QACLE,WAAWG,IAAAA,gBAAU,gBAEnBnB,aAAaE,kBAAQ,CAACC,GAAG,uBACzB;YACEiB,OAAO;YACPC,SAAS;YACTC,QAAQ;QACV,CAAC,CAAC1B,KAAK,EACP2B,IAAAA,0BAAoB,EAACX,gCACrBY,IAAAA,kBAAY,EAACb,0CACbK;sBAGF,qBAACS;QAAIT,SAAS;qBACZ,qBAACrB;QACCqB,SAAS;QACTU,WAAU;QACV9B,MAAMA;QACNC,MAAMA;qBAEN,qBAAC8B;QACCX,WAAWG,IAAAA,gBAAU,4BAEnBJ;OAGDL,WAEFc,IAAAA,kBAAY,EAACZ,4BACZ,qBAACL,kBAAQ;QAACS,SAAS;QAA+BV,QAAO;OACtDM,aAKNY,IAAAA,kBAAY,EAACb,2BACZ,qBAACiB,gBAAO;QACNZ,WAAWG,IAAAA,gBAAU,0BAEnBJ;QAEFW,WAAU;OAETf,YAKNa,IAAAA,kBAAY,EAACX,wBACZ,qBAACgB,oBAAS;QAACb,SAAS;QAA2BU,WAAU;OACtDb;AAKX"}

package/dist/cjs/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 { HasComponent, HasRef, HasRootRef } from '../../types';\nimport { Avatar } from '../Avatar/Avatar';\nimport { Tappable } 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\ninterface CellTypographyProps extends React.HTMLAttributes<HTMLDivElement> {\n  size: HorizontalCellProps['size'];\n}\n\nconst CellTypography = ({ size, children, ...restProps }: CellTypographyProps) => {\n  return size === 's' ? (\n    <Caption {...restProps}>{children}</Caption>\n  ) : (\n    <Subhead {...restProps}>{children}</Subhead>\n  );\n};\n\nexport interface HorizontalCellProps\n  extends React.AnchorHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement>,\n    HasComponent {\n  size?: 's' | 'm' | 'l';\n  /**\n   * Заголовок\n   */\n  header?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  disabled?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalCell\n */\nexport const HorizontalCell = ({\n  className,\n  header,\n  style,\n  subtitle,\n  size = 's',\n  children = <Avatar size={56} />,\n  getRootRef,\n  getRef,\n  extraSubtitle,\n  ...restProps\n}: HorizontalCellProps) => {\n  return (\n    <div\n      ref={getRootRef}\n      style={style}\n      className={classNames(\n        styles['HorizontalCell'],\n        {\n          s: styles['HorizontalCell--size-s'],\n          m: styles['HorizontalCell--size-m'],\n          l: styles['HorizontalCell--size-l'],\n        }[size],\n        className,\n      )}\n    >\n      <Tappable className={styles['HorizontalCell__body']} getRootRef={getRef} {...restProps}>\n        {hasReactNode(children) && (\n          <div className={styles['HorizontalCell__image']}>{children}</div>\n        )}\n        <div className={styles['HorizontalCell__content']}>\n          {hasReactNode(header) && <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      </Tappable>\n    </div>\n  );\n};\n"],"names":["HorizontalCell","CellTypography","size","children","restProps","Caption","Subhead","className","header","style","subtitle","Avatar","getRootRef","getRef","extraSubtitle","div","ref","classNames","s","m","l","Tappable","hasReactNode","Footnote"],"mappings":";;;;+BA8CaA;;;eAAAA;;;;;;+DA9CU;oBACkB;sBAElB;wBACE;uBACD;wBACC;uBACD;AAOxB,IAAMC,iBAAiB;QAAGC,cAAAA,MAAMC,kBAAAA,UAAaC;QAAnBF;QAAMC;;IAC9B,OAAOD,SAAS,oBACd,qBAACG,kBAAYD,WAAYD,0BAEzB,qBAACG,kBAAYF,WAAYD;AAE7B;AA0BO,IAAMH,iBAAiB;QAC5BO,mBAAAA,WACAC,gBAAAA,QACAC,eAAAA,OACAC,kBAAAA,+BACAR,MAAAA,gCAAO,4CACPC,UAAAA,sDAAW,qBAACQ;QAAOT,MAAM;0BACzBU,oBAAAA,YACAC,gBAAAA,QACAC,uBAAAA,eACGV;QATHG;QACAC;QACAC;QACAC;QACAR;QACAC;QACAS;QACAC;QACAC;;IAGA,qBACE,qBAACC;QACCC,KAAKJ;QACLH,OAAOA;QACPF,WAAWU,IAAAA,wCAET;YACEC,CAAC;YACDC,CAAC;YACDC,CAAC;QACH,CAAC,CAAClB,KAAK,EACPK;qBAGF,qBAACc;QAASd,SAAS;QAAkCK,YAAYC;OAAYT,YAC1EkB,IAAAA,oBAAanB,2BACZ,qBAACY;QAAIR,SAAS;OAAoCJ,yBAEpD,qBAACY;QAAIR,SAAS;OACXe,IAAAA,oBAAad,yBAAW,qBAACP;QAAeC,MAAMA;OAAOM,SACrDc,IAAAA,oBAAaZ,2BACZ,qBAACa;QAAShB,SAAS;OAAuCG,WAE3DY,IAAAA,oBAAaR,gCACZ,qBAACS;QAAShB,SAAS;OAAuCO;AAMtE"}
+{"version":3,"sources":["../../../../src/components/HorizontalCell/HorizontalCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { HasComponent, HasRef, HasRootRef } from '../../types';\nimport { Avatar } from '../Avatar/Avatar';\nimport { Tappable } 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\ninterface CellTypographyProps extends React.HTMLAttributes<HTMLDivElement> {\n  size: HorizontalCellProps['size'];\n}\n\nconst CellTypography = ({ size, children, ...restProps }: CellTypographyProps) => {\n  return size === 's' ? (\n    <Caption {...restProps}>{children}</Caption>\n  ) : (\n    <Subhead {...restProps}>{children}</Subhead>\n  );\n};\n\nexport interface HorizontalCellProps\n  extends React.AnchorHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement>,\n    HasComponent {\n  size?: 's' | 'm' | 'l';\n  /**\n   * Заголовок\n   */\n  header?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  disabled?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalCell\n */\nexport const HorizontalCell = ({\n  className,\n  header,\n  style,\n  subtitle,\n  size = 's',\n  children = <Avatar size={56} />,\n  getRootRef,\n  getRef,\n  extraSubtitle,\n  ...restProps\n}: HorizontalCellProps) => {\n  return (\n    <div\n      ref={getRootRef}\n      style={style}\n      className={classNames(\n        styles['HorizontalCell'],\n        {\n          s: styles['HorizontalCell--size-s'],\n          m: styles['HorizontalCell--size-m'],\n          l: styles['HorizontalCell--size-l'],\n        }[size],\n        className,\n      )}\n    >\n      <Tappable className={styles['HorizontalCell__body']} getRootRef={getRef} {...restProps}>\n        {hasReactNode(children) && (\n          <div className={styles['HorizontalCell__image']}>{children}</div>\n        )}\n        <div className={styles['HorizontalCell__content']}>\n          {hasReactNode(header) && <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      </Tappable>\n    </div>\n  );\n};\n"],"names":["HorizontalCell","CellTypography","size","children","restProps","Caption","Subhead","className","header","style","subtitle","Avatar","getRootRef","getRef","extraSubtitle","div","ref","classNames","s","m","l","Tappable","hasReactNode","Footnote"],"mappings":";;;;+BA8CaA;;;eAAAA;;;;;;+DA9CU;oBACkB;sBAElB;wBACE;uBACD;wBACC;uBACD;AAOxB,IAAMC,iBAAiB;QAAGC,cAAAA,MAAMC,kBAAAA,UAAaC;QAAnBF;QAAMC;;IAC9B,OAAOD,SAAS,oBACd,qBAACG,gBAAO,EAAKD,WAAYD,0BAEzB,qBAACG,gBAAO,EAAKF,WAAYD;AAE7B;AA0BO,IAAMH,iBAAiB;QAC5BO,mBAAAA,WACAC,gBAAAA,QACAC,eAAAA,OACAC,kBAAAA,+BACAR,MAAAA,gCAAO,4CACPC,UAAAA,sDAAW,qBAACQ,cAAM;QAACT,MAAM;0BACzBU,oBAAAA,YACAC,gBAAAA,QACAC,uBAAAA,eACGV;QATHG;QACAC;QACAC;QACAC;QACAR;QACAC;QACAS;QACAC;QACAC;;IAGA,qBACE,qBAACC;QACCC,KAAKJ;QACLH,OAAOA;QACPF,WAAWU,IAAAA,gBAAU,wBAEnB;YACEC,CAAC;YACDC,CAAC;YACDC,CAAC;QACH,CAAC,CAAClB,KAAK,EACPK;qBAGF,qBAACc,kBAAQ;QAACd,SAAS;QAAkCK,YAAYC;OAAYT,YAC1EkB,IAAAA,kBAAY,EAACnB,2BACZ,qBAACY;QAAIR,SAAS;OAAoCJ,yBAEpD,qBAACY;QAAIR,SAAS;OACXe,IAAAA,kBAAY,EAACd,yBAAW,qBAACP;QAAeC,MAAMA;OAAOM,SACrDc,IAAAA,kBAAY,EAACZ,2BACZ,qBAACa,kBAAQ;QAAChB,SAAS;OAAuCG,WAE3DY,IAAAA,kBAAY,EAACR,gCACZ,qBAACS,kBAAQ;QAAChB,SAAS;OAAuCO;AAMtE"}

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

@@ -0,0 +1,35 @@
+import React from 'react';
+import { HasRef, HasRootRef, LiteralUnion } from '../../types';
+import type { ImageBaseSize } from '../ImageBase/ImageBase';
+import { TappableProps } from '../Tappable/Tappable';
+import { SubheadProps } from '../Typography/Subhead/Subhead';
+export interface HorizontalCellShowMoreProps extends Omit<TappableProps, 'getRootRef' | 'size'>, HasRef<HTMLElement>, HasRootRef<HTMLDivElement> {
+    /**
+     * Задаёт высоту компонента. Должeн соответствовать размеру картинок
+     * внутри соседних `HorizontalCell` компонентов.
+     *
+     * Используйте размеры заданные дизайн-системой (см. типы).
+     *
+     * > ⚠️ Использование кастомного размера – это пограничный кейс.
+     *
+     * Игнорируется если `size='s'`.
+     */
+    height?: LiteralUnion<ImageBaseSize, number>;
+    /**
+     * Задаёт размер компонента. Аналогичен такому же пропу у [HorizontalCell](https://vkcom.github.io/VKUI/#/HorizontalCellShowMore?id=props).
+     * Должен соответствовать значению пропа `size` соседних `HorizontalCell`.
+     */
+    size?: 's' | 'm' | 'l';
+    /**
+     * Предназначен для отрисовки текста.
+     * По умолчанию для `size='s'` содержит текст `Все` для других размеров `Показать все`.
+     * */
+    children?: SubheadProps['children'];
+    /**
+     * Позволяет компенсировать особый правый отступ у предшевствующего элементa `HorizontalCell`,
+     * в том случае, если тот элемент последний в родителе.
+     * Если `HorizontalCellShowMore` находится на одном уровне с остальными `HorizontalCell`, то этот проп использовать не нужно.
+     */
+    compensateLastCellIndent?: boolean;
+}
+export declare const HorizontalCellShowMore: ({ className, style, getRef, getRootRef, compensateLastCellIndent, height, size, children, ...restProps }: HorizontalCellShowMoreProps) => React.JSX.Element;

package/dist/cjs/components/HorizontalCellShowMore/HorizontalCellShowMore.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "HorizontalCellShowMore", {
+    enumerable: true,
+    get: function() {
+        return HorizontalCellShowMore;
+    }
+});
+var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _react = /*#__PURE__*/ _interop_require_default._(require("react"));
+var _icons = require("@vkontakte/icons");
+var _vkjs = require("@vkontakte/vkjs");
+var _Tappable = require("../Tappable/Tappable");
+var _Subhead = require("../Typography/Subhead/Subhead");
+var sizeClassNames = {
+    s: "vkuiHorizontalCellShowMore--size-s",
+    m: "vkuiHorizontalCellShowMore--size-m",
+    l: "vkuiHorizontalCellShowMore--size-l"
+};
+var HorizontalCellShowMore = function(_param) {
+    var className = _param.className, style = _param.style, getRef = _param.getRef, getRootRef = _param.getRootRef, compensateLastCellIndent = _param.compensateLastCellIndent, height = _param.height, _param_size = _param.size, size = _param_size === void 0 ? "s" : _param_size, _param_children = _param.children, children = _param_children === void 0 ? size === "s" ? "Все" : "Показать все" : _param_children, restProps = _object_without_properties._(_param, [
+        "className",
+        "style",
+        "getRef",
+        "getRootRef",
+        "compensateLastCellIndent",
+        "height",
+        "size",
+        "children"
+    ]);
+    return /*#__PURE__*/ _react.default.createElement("div", {
+        style: style,
+        className: (0, _vkjs.classNames)("vkuiHorizontalCellShowMore", compensateLastCellIndent && "vkuiHorizontalCellShowMore--compensate-last-cell-indent", sizeClassNames[size], className),
+        ref: getRootRef
+    }, /*#__PURE__*/ _react.default.createElement(_Tappable.Tappable, _object_spread._({
+        style: size === "s" ? undefined : {
+            height: height
+        },
+        className: "vkuiHorizontalCellShowMore__body",
+        getRootRef: getRef,
+        activeMode: "opacity",
+        hoverMode: "opacity"
+    }, restProps), /*#__PURE__*/ _react.default.createElement(_icons.Icon28ChevronRightCircle, {
+        className: "vkuiHorizontalCellShowMore__icon",
+        fill: "currentColor"
+    }), /*#__PURE__*/ _react.default.createElement(_Subhead.Subhead, {
+        className: "vkuiHorizontalCellShowMore__text",
+        weight: "2"
+    }, children)));
+};
+
+//# sourceMappingURL=HorizontalCellShowMore.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"sourcesContent":["import React from 'react';\nimport { 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\nexport const HorizontalCellShowMore = ({\n  className,\n  style,\n  getRef,\n  getRootRef,\n  compensateLastCellIndent,\n  height,\n  size = 's',\n  children = size === 's' ? 'Все' : 'Показать все',\n  ...restProps\n}: HorizontalCellShowMoreProps) => {\n  return (\n    <div\n      style={style}\n      className={classNames(\n        styles['HorizontalCellShowMore'],\n        compensateLastCellIndent && styles['HorizontalCellShowMore--compensate-last-cell-indent'],\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":["HorizontalCellShowMore","sizeClassNames","s","m","l","className","style","getRef","getRootRef","compensateLastCellIndent","height","size","children","restProps","div","classNames","ref","Tappable","undefined","activeMode","hoverMode","Icon28ChevronRightCircle","fill","Subhead","weight"],"mappings":";;;;+BAgDaA;;;eAAAA;;;;;;8DAhDK;qBACuB;oBACd;wBAGa;uBACF;AAGtC,IAAMC,iBAAiB;IACrBC,CAAC;IACDC,CAAC;IACDC,CAAC;AACH;AAmCO,IAAMJ,yBAAyB;QACpCK,mBAAAA,WACAC,eAAAA,OACAC,gBAAAA,QACAC,oBAAAA,YACAC,kCAAAA,0BACAC,gBAAAA,6BACAC,MAAAA,gCAAO,4CACPC,UAAAA,wCAAWD,SAAS,MAAM,QAAQ,kCAC/BE;QARHR;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,6BAACE;QACCR,OAAOA;QACPD,WAAWU,IAAAA,gBAAU,gCAEnBN,uFACAR,cAAc,CAACU,KAAK,EACpBN;QAEFW,KAAKR;qBAEL,6BAACS,kBAAQ;QACPX,OAAOK,SAAS,MAAMO,YAAY;YAAER,QAAAA;QAAO;QAC3CL,SAAS;QACTG,YAAYD;QACZY,YAAW;QACXC,WAAU;OACNP,0BAEJ,6BAACQ,+BAAwB;QACvBhB,SAAS;QACTiB,MAAK;sBAGP,6BAACC,gBAAO;QAAClB,SAAS;QAA0CmB,QAAO;OAChEZ;AAKX"}

package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js

@@ -95,7 +95,7 @@ var HorizontalScroll = function(_param) {
     var scrollTo = _react.useCallback(function(getScrollPosition) {
         var scrollElement = scrollerRef.current;
         animationQueue.current.push(function() {
-            var _scrollElement_firstElementChild;
+            var _scrollElement_firstElementChild, _scrollElement;
             return doScroll({
                 scrollElement: scrollElement,
                 getScrollPosition: getScrollPosition,
@@ -109,7 +109,7 @@ var HorizontalScroll = function(_param) {
                 onScrollStart: function() {
                     return isCustomScrollingRef.current = true;
                 },
-                initialScrollWidth: (scrollElement === null || scrollElement === void 0 ? void 0 : (_scrollElement_firstElementChild = scrollElement.firstElementChild) === null || _scrollElement_firstElementChild === void 0 ? void 0 : _scrollElement_firstElementChild.scrollWidth) || 0,
+                initialScrollWidth: ((_scrollElement = scrollElement) === null || _scrollElement === void 0 ? void 0 : (_scrollElement_firstElementChild = _scrollElement.firstElementChild) === null || _scrollElement_firstElementChild === void 0 ? void 0 : _scrollElement_firstElementChild.scrollWidth) || 0,
                 scrollAnimationDuration: scrollAnimationDuration
             });
         });

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