@vkontakte/vkui 7.4.4 → 7.5.0

package/dist/components/FormField/FormField.d.ts

@@ -12,7 +12,7 @@ export interface FormFieldProps {
      * Рекомендации:
      *
      * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.
-     * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна иконка, реагирующая на нажатие.
+     * - Используйте [IconButton](https://vkui.io/components/icon-button), если вам нужна иконка, реагирующая на нажатие.
      */
     before?: React.ReactNode;
     /**
@@ -25,7 +25,7 @@ export interface FormFieldProps {
      * Рекомендации:
      *
      * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.
-     * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна иконка, реагируюущая на нажатие.
+     * - Используйте [IconButton](https://vkui.io/components/icon-button), если вам нужна иконка, реагируюущая на нажатие.
      */
     after?: React.ReactNode;
     /**
@@ -51,7 +51,7 @@ export interface FormFieldOwnProps extends React.AllHTMLAttributes<HTMLElement>,
     disabled?: boolean;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/FormField
+ * @see https://vkui.io/components/form-field
  */
 export declare const FormField: ({ Component, status, children, getRootRef, before, after, beforeAlign, afterAlign, disabled, mode, className, maxHeight, style, ...restProps }: FormFieldOwnProps) => React.ReactNode;
 //# sourceMappingURL=FormField.d.ts.map

package/dist/components/FormField/FormField.js

@@ -32,7 +32,7 @@ const renderIcon = (icon, align, className)=>{
     });
 };
 /**
- * @see https://vkcom.github.io/VKUI/#/FormField
+ * @see https://vkui.io/components/form-field
  */ export const FormField = (_param)=>{
     var { Component = 'span', status = 'default', children, getRootRef, before, after, beforeAlign = 'center', afterAlign = 'center', disabled, mode = 'default', className, maxHeight, style } = _param, restProps = _object_without_properties(_param, [
         "Component",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FormField/FormField.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusVisibleClassName } from '../../hooks/useFocusVisibleClassName';\nimport { useFocusWithin } from '../../hooks/useFocusWithin';\nimport type { HasComponent, HasRootRef } from '../../types';\nimport styles from './FormField.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\nconst stylesStatus = {\n  error: styles.statusError,\n  valid: styles.statusValid,\n};\n\nconst iconAlignClassNames = {\n  center: undefined,\n  start: styles.iconAlignStart,\n  end: styles.iconAlignEnd,\n};\n\nconst renderIcon = (icon: React.ReactNode, align: FieldIconsAlign, className: string) => {\n  return (\n    <div className={styles.iconWrapper}>\n      <span className={classNames(iconAlignClassNames[align], className)}>{icon}</span>\n    </div>\n  );\n};\n\nexport type FieldIconsAlign = 'start' | 'center' | 'end';\n\nexport interface FormFieldProps {\n  /**\n   * Статус отображения поля в форме.\n   */\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  beforeAlign?: FieldIconsAlign;\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  /**\n   * Вертикальное выравнивание иконки справа.\n   */\n  afterAlign?: FieldIconsAlign;\n  /**\n   * Режим отображения.\n   *\n   * - `default` — показывает фон, обводку и, при наличии, текст-подсказку.\n   * - `plain` — показывает только текст-подсказку.\n   */\n  mode?: 'default' | 'plain';\n  /**\n   * Максимальная высота поля.\n   */\n  maxHeight?: number;\n}\n\nexport interface FormFieldOwnProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    FormFieldProps {\n  /**\n   * Блокировка взаимодействия с компонентом.\n   */\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  beforeAlign = 'center',\n  afterAlign = 'center',\n  disabled,\n  mode = 'default',\n  className,\n  maxHeight,\n  style,\n  ...restProps\n}: FormFieldOwnProps): React.ReactNode => {\n  const elRef = useExternRef(getRootRef);\n  const { sizeY = 'none' } = useAdaptivity();\n  const [hover, setHover] = React.useState(false);\n\n  const focusWithin = useFocusWithin(elRef);\n  const focusVisibleClassNames = useFocusVisibleClassName({\n    focusVisible: focusWithin,\n    mode: styles.focusVisible,\n  });\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      style={{\n        maxHeight,\n        ...style,\n      }}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={classNames(\n        styles.host,\n        mode === 'default' && styles.modeDefault,\n        status !== 'default' && stylesStatus[status],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        disabled && styles.disabled,\n        !disabled && hover && styles.hover,\n        focusVisibleClassNames,\n        className,\n      )}\n    >\n      <div className={styles.scrollContainer}>\n        {before && renderIcon(before, beforeAlign, styles.before)}\n        <div className={styles.content}>{children}</div>\n        {after &&\n          renderIcon(after, afterAlign, classNames(styles.after, 'vkuiInternalFormField__after'))}\n      </div>\n      <span aria-hidden className={styles.border} />\n    </Component>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useExternRef","useFocusVisibleClassName","useFocusWithin","sizeYClassNames","none","compact","stylesStatus","error","valid","iconAlignClassNames","center","undefined","start","end","renderIcon","icon","align","className","div","span","FormField","Component","status","children","getRootRef","before","after","beforeAlign","afterAlign","disabled","mode","maxHeight","style","restProps","elRef","sizeY","hover","setHover","useState","focusWithin","focusVisibleClassNames","focusVisible","handleMouseEnter","e","stopPropagation","handleMouseLeave","ref","onMouseEnter","onMouseLeave","aria-hidden"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,wBAAwB,QAAQ,0CAAuC;AAChF,SAASC,cAAc,QAAQ,gCAA6B;AAI5D,MAAMC,kBAAkB;IACtBC,IAAI;IACJC,OAAO;AACT;AAEA,MAAMC,eAAe;IACnBC,KAAK;IACLC,KAAK;AACP;AAEA,MAAMC,sBAAsB;IAC1BC,QAAQC;IACRC,KAAK;IACLC,GAAG;AACL;AAEA,MAAMC,aAAa,CAACC,MAAuBC,OAAwBC;IACjE,qBACE,KAACC;QAAID,SAAS;kBACZ,cAAA,KAACE;YAAKF,WAAWnB,WAAWW,mBAAmB,CAACO,MAAM,EAAEC;sBAAaF;;;AAG3E;AA2DA;;CAEC,GACD,OAAO,MAAMK,YAAY;QAAC,EACxBC,YAAY,MAAM,EAClBC,SAAS,SAAS,EAClBC,QAAQ,EACRC,UAAU,EACVC,MAAM,EACNC,KAAK,EACLC,cAAc,QAAQ,EACtBC,aAAa,QAAQ,EACrBC,QAAQ,EACRC,OAAO,SAAS,EAChBb,SAAS,EACTc,SAAS,EACTC,KAAK,EAEa,WADfC;QAbHZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAb;QACAc;QACAC;;IAGA,MAAME,QAAQlC,aAAawB;IAC3B,MAAM,EAAEW,QAAQ,MAAM,EAAE,GAAGpC;IAC3B,MAAM,CAACqC,OAAOC,SAAS,GAAGxC,MAAMyC,QAAQ,CAAC;IAEzC,MAAMC,cAAcrC,eAAegC;IACnC,MAAMM,yBAAyBvC,yBAAyB;QACtDwC,cAAcF;QACdT,IAAI;IACN;IAEA,MAAMY,mBAAmB,CAACC;QACxBA,EAAEC,eAAe;QACjBP,SAAS;IACX;IAEA,MAAMQ,mBAAmB,CAACF;QACxBA,EAAEC,eAAe;QACjBP,SAAS;IACX;IAEA,qBACE,MAAChB,mDACKY;QACJa,KAAKZ;QACLF,OAAO;YACLD;WACGC;QAELe,cAAcL;QACdM,cAAcH;QACd5B,WAAWnB,kCAETgC,SAAS,2CACTR,WAAW,aAAahB,YAAY,CAACgB,OAAO,EAC5Ca,UAAU,aAAahC,eAAe,CAACgC,MAAM,EAC7CN,uCACA,CAACA,YAAYO,iCACbI,wBACAvB;;0BAGF,MAACC;gBAAID,SAAS;;oBACXQ,UAAUX,WAAWW,QAAQE;kCAC9B,KAACT;wBAAID,SAAS;kCAAmBM;;oBAChCG,SACCZ,WAAWY,OAAOE,YAAY9B,mCAAyB;;;0BAE3D,KAACqB;gBAAK8B,aAAW;gBAAChC,SAAS;;;;AAGjC,EAAE"}
+{"version":3,"sources":["../../../src/components/FormField/FormField.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusVisibleClassName } from '../../hooks/useFocusVisibleClassName';\nimport { useFocusWithin } from '../../hooks/useFocusWithin';\nimport type { HasComponent, HasRootRef } from '../../types';\nimport styles from './FormField.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\nconst stylesStatus = {\n  error: styles.statusError,\n  valid: styles.statusValid,\n};\n\nconst iconAlignClassNames = {\n  center: undefined,\n  start: styles.iconAlignStart,\n  end: styles.iconAlignEnd,\n};\n\nconst renderIcon = (icon: React.ReactNode, align: FieldIconsAlign, className: string) => {\n  return (\n    <div className={styles.iconWrapper}>\n      <span className={classNames(iconAlignClassNames[align], className)}>{icon}</span>\n    </div>\n  );\n};\n\nexport type FieldIconsAlign = 'start' | 'center' | 'end';\n\nexport interface FormFieldProps {\n  /**\n   * Статус отображения поля в форме.\n   */\n  status?: 'default' | 'error' | 'valid';\n  /**\n   * Добавляет иконку слева.\n   *\n   * Рекомендации:\n   *\n   * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n   * - Используйте [IconButton](https://vkui.io/components/icon-button), если вам нужна иконка, реагирующая на нажатие.\n   */\n  before?: React.ReactNode;\n  /**\n   * Вертикальное выравнивание иконки слева.\n   */\n  beforeAlign?: FieldIconsAlign;\n  /**\n   * Добавляет иконку справа.\n   *\n   * Рекомендации:\n   *\n   * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n   * - Используйте [IconButton](https://vkui.io/components/icon-button), если вам нужна иконка, реагируюущая на нажатие.\n   */\n  after?: React.ReactNode;\n  /**\n   * Вертикальное выравнивание иконки справа.\n   */\n  afterAlign?: FieldIconsAlign;\n  /**\n   * Режим отображения.\n   *\n   * - `default` — показывает фон, обводку и, при наличии, текст-подсказку.\n   * - `plain` — показывает только текст-подсказку.\n   */\n  mode?: 'default' | 'plain';\n  /**\n   * Максимальная высота поля.\n   */\n  maxHeight?: number;\n}\n\nexport interface FormFieldOwnProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    FormFieldProps {\n  /**\n   * Блокировка взаимодействия с компонентом.\n   */\n  disabled?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/form-field\n */\nexport const FormField = ({\n  Component = 'span',\n  status = 'default',\n  children,\n  getRootRef,\n  before,\n  after,\n  beforeAlign = 'center',\n  afterAlign = 'center',\n  disabled,\n  mode = 'default',\n  className,\n  maxHeight,\n  style,\n  ...restProps\n}: FormFieldOwnProps): React.ReactNode => {\n  const elRef = useExternRef(getRootRef);\n  const { sizeY = 'none' } = useAdaptivity();\n  const [hover, setHover] = React.useState(false);\n\n  const focusWithin = useFocusWithin(elRef);\n  const focusVisibleClassNames = useFocusVisibleClassName({\n    focusVisible: focusWithin,\n    mode: styles.focusVisible,\n  });\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      style={{\n        maxHeight,\n        ...style,\n      }}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={classNames(\n        styles.host,\n        mode === 'default' && styles.modeDefault,\n        status !== 'default' && stylesStatus[status],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        disabled && styles.disabled,\n        !disabled && hover && styles.hover,\n        focusVisibleClassNames,\n        className,\n      )}\n    >\n      <div className={styles.scrollContainer}>\n        {before && renderIcon(before, beforeAlign, styles.before)}\n        <div className={styles.content}>{children}</div>\n        {after &&\n          renderIcon(after, afterAlign, classNames(styles.after, 'vkuiInternalFormField__after'))}\n      </div>\n      <span aria-hidden className={styles.border} />\n    </Component>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useExternRef","useFocusVisibleClassName","useFocusWithin","sizeYClassNames","none","compact","stylesStatus","error","valid","iconAlignClassNames","center","undefined","start","end","renderIcon","icon","align","className","div","span","FormField","Component","status","children","getRootRef","before","after","beforeAlign","afterAlign","disabled","mode","maxHeight","style","restProps","elRef","sizeY","hover","setHover","useState","focusWithin","focusVisibleClassNames","focusVisible","handleMouseEnter","e","stopPropagation","handleMouseLeave","ref","onMouseEnter","onMouseLeave","aria-hidden"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,wBAAwB,QAAQ,0CAAuC;AAChF,SAASC,cAAc,QAAQ,gCAA6B;AAI5D,MAAMC,kBAAkB;IACtBC,IAAI;IACJC,OAAO;AACT;AAEA,MAAMC,eAAe;IACnBC,KAAK;IACLC,KAAK;AACP;AAEA,MAAMC,sBAAsB;IAC1BC,QAAQC;IACRC,KAAK;IACLC,GAAG;AACL;AAEA,MAAMC,aAAa,CAACC,MAAuBC,OAAwBC;IACjE,qBACE,KAACC;QAAID,SAAS;kBACZ,cAAA,KAACE;YAAKF,WAAWnB,WAAWW,mBAAmB,CAACO,MAAM,EAAEC;sBAAaF;;;AAG3E;AA2DA;;CAEC,GACD,OAAO,MAAMK,YAAY;QAAC,EACxBC,YAAY,MAAM,EAClBC,SAAS,SAAS,EAClBC,QAAQ,EACRC,UAAU,EACVC,MAAM,EACNC,KAAK,EACLC,cAAc,QAAQ,EACtBC,aAAa,QAAQ,EACrBC,QAAQ,EACRC,OAAO,SAAS,EAChBb,SAAS,EACTc,SAAS,EACTC,KAAK,EAEa,WADfC;QAbHZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAb;QACAc;QACAC;;IAGA,MAAME,QAAQlC,aAAawB;IAC3B,MAAM,EAAEW,QAAQ,MAAM,EAAE,GAAGpC;IAC3B,MAAM,CAACqC,OAAOC,SAAS,GAAGxC,MAAMyC,QAAQ,CAAC;IAEzC,MAAMC,cAAcrC,eAAegC;IACnC,MAAMM,yBAAyBvC,yBAAyB;QACtDwC,cAAcF;QACdT,IAAI;IACN;IAEA,MAAMY,mBAAmB,CAACC;QACxBA,EAAEC,eAAe;QACjBP,SAAS;IACX;IAEA,MAAMQ,mBAAmB,CAACF;QACxBA,EAAEC,eAAe;QACjBP,SAAS;IACX;IAEA,qBACE,MAAChB,mDACKY;QACJa,KAAKZ;QACLF,OAAO;YACLD;WACGC;QAELe,cAAcL;QACdM,cAAcH;QACd5B,WAAWnB,kCAETgC,SAAS,2CACTR,WAAW,aAAahB,YAAY,CAACgB,OAAO,EAC5Ca,UAAU,aAAahC,eAAe,CAACgC,MAAM,EAC7CN,uCACA,CAACA,YAAYO,iCACbI,wBACAvB;;0BAGF,MAACC;gBAAID,SAAS;;oBACXQ,UAAUX,WAAWW,QAAQE;kCAC9B,KAACT;wBAAID,SAAS;kCAAmBM;;oBAChCG,SACCZ,WAAWY,OAAOE,YAAY9B,mCAAyB;;;0BAE3D,KAACqB;gBAAK8B,aAAW;gBAAChC,SAAS;;;;AAGjC,EAAE"}

package/dist/components/FormItem/FormItem.d.ts

@@ -56,7 +56,7 @@ export interface FormItemProps extends React.AllHTMLAttributes<HTMLElement>, Has
     required?: boolean;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/FormItem
+ * @see https://vkui.io/components/form-item
  */
 export declare const FormItem: React.FC<FormItemProps> & {
     Top: typeof FormItemTop;

package/dist/components/FormItem/FormItem.js

@@ -24,7 +24,7 @@ const stylesStatus = {
     valid: classNames("vkuiFormItem__statusValid", 'vkuiInternalFormItem--status-valid')
 };
 /**
- * @see https://vkcom.github.io/VKUI/#/FormItem
+ * @see https://vkui.io/components/form-item
  */ export const FormItem = (_param)=>{
     var { children, top, topId, topMultiline = false, topComponent: topComponentProp, bottom, status = 'default', removable, onRemove, removePlaceholder = 'Удалить', getRootRef, htmlFor, bottomId, noPadding, required = false, disabled } = _param, restProps = _object_without_properties(_param, [
         "children",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, hasReactNode, isPrimitiveReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';\nimport type { HasComponent, HasRootRef } from '../../types';\nimport { Removable, type RemovableProps } from '../Removable/Removable';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { FormItemTop } from './FormItemTop/FormItemTop';\nimport { FormItemTopAside } from './FormItemTop/FormItemTopAside';\nimport { FormItemTopLabel } from './FormItemTop/FormItemTopLabel';\nimport { FormItemContext } from './context';\nimport styles from './FormItem.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(styles.sizeYNone, 'vkuiInternalFormItem--sizeY-none'),\n  compact: classNames(styles.sizeYCompact, 'vkuiInternalFormItem--sizeY-compact'),\n};\n\nconst stylesStatus = {\n  error: classNames(styles.statusError, 'vkuiInternalFormItem--status-error'),\n  valid: classNames(styles.statusValid, 'vkuiInternalFormItem--status-valid'),\n};\n\nexport interface FormItemProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    RemovableProps {\n  /**\n   * Дополнительный элемент, отображаемый над содержимым.\n   */\n  top?: React.ReactNode;\n  /**\n   * Передаётся при использовании `top`.\n   *\n   * `id` для `top`.\n   */\n  topId?: string;\n  /**\n   * Многострочный вывод заголовка. По умолчанию текст не переносится при переполнении.\n   */\n  topMultiline?: boolean;\n  /**\n   * Позволяет поменять тег используемый для top\n   * Если оставить пустым, то тег top будет span.\n   * Если оставить пустым и использовать htmlFor, то тег top будет label.\n   */\n  topComponent?: React.ElementType;\n  /**\n   * Дополнительный элемент, отображаемый под содержимым.\n   */\n  bottom?: React.ReactNode;\n  /**\n   * Передаётся при использовании `bottom`.\n   *\n   * Должен совпадать с `aria-describedby`, который передаётся в компонент, отвечающий за пользовательский ввод.\n   */\n  bottomId?: string;\n  /**\n   * Статус, влияющий на стиль отображения компонента.\n   */\n  status?: 'default' | 'error' | 'valid';\n  /**\n   * Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n   *\n   * Режим `indent` предназначен для визуального отступа.\n   */\n  removable?: boolean | 'indent';\n  /**\n   * Удаляет внешние отступы вокруг компонента.\n   * @since 5.8.0\n   */\n  noPadding?: boolean;\n  /**\n   * Помечает поле обязательным.\n   */\n  required?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormItem\n */\nexport const FormItem: React.FC<FormItemProps> & {\n  Top: typeof FormItemTop;\n  TopLabel: typeof FormItemTopLabel;\n  TopAside: typeof FormItemTopAside;\n} = ({\n  children,\n  top,\n  topId,\n  topMultiline = false,\n  topComponent: topComponentProp,\n  bottom,\n  status = 'default',\n  removable,\n  onRemove,\n  removePlaceholder = 'Удалить',\n  getRootRef,\n  htmlFor,\n  bottomId,\n  noPadding,\n  required = false,\n  disabled,\n  ...restProps\n}: FormItemProps) => {\n  const rootEl = useExternRef(getRootRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const wrappedChildren = (\n    <React.Fragment>\n      {isPrimitiveReactNode(top) ? (\n        <FormItemTop>\n          <FormItemTopLabel htmlFor={htmlFor} Component={topComponentProp} id={topId}>\n            {top}\n          </FormItemTopLabel>\n        </FormItemTop>\n      ) : hasReactNode(top) ? (\n        top\n      ) : null}\n      {children}\n      {hasReactNode(bottom) && (\n        <Footnote\n          className={styles.bottom}\n          id={bottomId}\n          role={status === 'error' ? 'alert' : undefined}\n        >\n          {bottom}\n        </Footnote>\n      )}\n    </React.Fragment>\n  );\n\n  const context = React.useMemo(() => ({ required, topMultiline }), [required, topMultiline]);\n\n  return (\n    <RootComponent\n      {...restProps}\n      getRootRef={rootEl}\n      baseClassName={classNames(\n        styles.host,\n        !noPadding && styles.withPadding,\n        'vkuiInternalFormItem',\n        status !== 'default' && stylesStatus[status],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        hasReactNode(top) && classNames(styles.withTop, 'vkuiInternalFormItem--withTop'),\n        removable && classNames(styles.withRemovable, 'vkuiInternalFormItem--removable'),\n      )}\n    >\n      <FormItemContext.Provider value={context}>\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            noPadding={noPadding}\n            disabled={disabled}\n          >\n            <div className={classNames(styles.removable, 'vkuiInternalFormItem__removable')}>\n              {wrappedChildren}\n            </div>\n          </Removable>\n        ) : (\n          wrappedChildren\n        )}\n      </FormItemContext.Provider>\n    </RootComponent>\n  );\n};\n\nFormItem.Top = FormItemTop;\nFormItem.TopLabel = FormItemTopLabel;\nFormItem.TopAside = FormItemTopAside;\n\nif (process.env.NODE_ENV !== 'production') {\n  defineComponentDisplayNames(FormItem.Top, 'FormItem.Top');\n  defineComponentDisplayNames(FormItem.TopLabel, 'FormItem.TopLabel');\n  defineComponentDisplayNames(FormItem.TopAside, 'FormItem.TopAside');\n}\n"],"names":["React","classNames","hasReactNode","isPrimitiveReactNode","useAdaptivity","useExternRef","defineComponentDisplayNames","Removable","RootComponent","Footnote","FormItemTop","FormItemTopAside","FormItemTopLabel","FormItemContext","sizeYClassNames","none","compact","stylesStatus","error","valid","FormItem","children","top","topId","topMultiline","topComponent","topComponentProp","bottom","status","removable","onRemove","removePlaceholder","getRootRef","htmlFor","bottomId","noPadding","required","disabled","restProps","rootEl","sizeY","wrappedChildren","Fragment","Component","id","className","role","undefined","context","useMemo","baseClassName","Provider","value","align","e","current","indent","div","Top","TopLabel","TopAside","process","env","NODE_ENV"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,EAAEC,oBAAoB,QAAQ,kBAAkB;AACjF,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,2BAA2B,QAAQ,iDAA8C;AAE1F,SAASC,SAAS,QAA6B,4BAAyB;AACxE,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,WAAW,QAAQ,+BAA4B;AACxD,SAASC,gBAAgB,QAAQ,oCAAiC;AAClE,SAASC,gBAAgB,QAAQ,oCAAiC;AAClE,SAASC,eAAe,QAAQ,eAAY;AAG5C,MAAMC,kBAAkB;IACtBC,MAAMd,sCAA6B;IACnCe,SAASf,yCAAgC;AAC3C;AAEA,MAAMgB,eAAe;IACnBC,OAAOjB,wCAA+B;IACtCkB,OAAOlB,wCAA+B;AACxC;AA0DA;;CAEC,GACD,OAAO,MAAMmB,WAIT;QAAC,EACHC,QAAQ,EACRC,GAAG,EACHC,KAAK,EACLC,eAAe,KAAK,EACpBC,cAAcC,gBAAgB,EAC9BC,MAAM,EACNC,SAAS,SAAS,EAClBC,SAAS,EACTC,QAAQ,EACRC,oBAAoB,SAAS,EAC7BC,UAAU,EACVC,OAAO,EACPC,QAAQ,EACRC,SAAS,EACTC,WAAW,KAAK,EAChBC,QAAQ,EAEM,WADXC;QAhBHjB;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,SAASlC,aAAa2B;IAC5B,MAAM,EAAEQ,QAAQ,MAAM,EAAE,GAAGpC;IAE3B,MAAMqC,gCACJ,MAACzC,MAAM0C,QAAQ;;YACZvC,qBAAqBmB,qBACpB,KAACZ;0BACC,cAAA,KAACE;oBAAiBqB,SAASA;oBAASU,WAAWjB;oBAAkBkB,IAAIrB;8BAClED;;iBAGHpB,aAAaoB,OACfA,MACE;YACHD;YACAnB,aAAayB,yBACZ,KAAClB;gBACCoC,SAAS;gBACTD,IAAIV;gBACJY,MAAMlB,WAAW,UAAU,UAAUmB;0BAEpCpB;;;;IAMT,MAAMqB,UAAUhD,MAAMiD,OAAO,CAAC,IAAO,CAAA;YAAEb;YAAUZ;QAAa,CAAA,GAAI;QAACY;QAAUZ;KAAa;IAE1F,qBACE,KAAChB,uDACK8B;QACJN,YAAYO;QACZW,eAAejD,iCAEb,CAACkC,0CACD,wBACAP,WAAW,aAAaX,YAAY,CAACW,OAAO,EAC5CY,UAAU,aAAa1B,eAAe,CAAC0B,MAAM,EAC7CtC,aAAaoB,QAAQrB,oCAA2B,kCAChD4B,aAAa5B,0CAAiC;kBAGhD,cAAA,KAACY,gBAAgBsC,QAAQ;YAACC,OAAOJ;sBAC9BnB,0BACC,KAACtB;gBACC8C,OAAM;gBACNvB,UAAU,CAACwB;oBACT,IAAIf,mBAAAA,6BAAAA,OAAQgB,OAAO,EAAE;wBACnBzB,qBAAAA,+BAAAA,SAAWwB,GAAGf,OAAOgB,OAAO;oBAC9B;gBACF;gBACAxB,mBAAmBA;gBACnByB,QAAQ3B,cAAc;gBACtBM,WAAWA;gBACXE,UAAUA;0BAEV,cAAA,KAACoB;oBAAIZ,WAAW5C,sCAA6B;8BAC1CwC;;iBAILA;;;AAKV,EAAE;AAEFrB,SAASsC,GAAG,GAAGhD;AACfU,SAASuC,QAAQ,GAAG/C;AACpBQ,SAASwC,QAAQ,GAAGjD;AAEpB,IAAIkD,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;IACzCzD,4BAA4Bc,SAASsC,GAAG,EAAE;IAC1CpD,4BAA4Bc,SAASuC,QAAQ,EAAE;IAC/CrD,4BAA4Bc,SAASwC,QAAQ,EAAE;AACjD"}
+{"version":3,"sources":["../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, hasReactNode, isPrimitiveReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';\nimport type { HasComponent, HasRootRef } from '../../types';\nimport { Removable, type RemovableProps } from '../Removable/Removable';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { FormItemTop } from './FormItemTop/FormItemTop';\nimport { FormItemTopAside } from './FormItemTop/FormItemTopAside';\nimport { FormItemTopLabel } from './FormItemTop/FormItemTopLabel';\nimport { FormItemContext } from './context';\nimport styles from './FormItem.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(styles.sizeYNone, 'vkuiInternalFormItem--sizeY-none'),\n  compact: classNames(styles.sizeYCompact, 'vkuiInternalFormItem--sizeY-compact'),\n};\n\nconst stylesStatus = {\n  error: classNames(styles.statusError, 'vkuiInternalFormItem--status-error'),\n  valid: classNames(styles.statusValid, 'vkuiInternalFormItem--status-valid'),\n};\n\nexport interface FormItemProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    RemovableProps {\n  /**\n   * Дополнительный элемент, отображаемый над содержимым.\n   */\n  top?: React.ReactNode;\n  /**\n   * Передаётся при использовании `top`.\n   *\n   * `id` для `top`.\n   */\n  topId?: string;\n  /**\n   * Многострочный вывод заголовка. По умолчанию текст не переносится при переполнении.\n   */\n  topMultiline?: boolean;\n  /**\n   * Позволяет поменять тег используемый для top\n   * Если оставить пустым, то тег top будет span.\n   * Если оставить пустым и использовать htmlFor, то тег top будет label.\n   */\n  topComponent?: React.ElementType;\n  /**\n   * Дополнительный элемент, отображаемый под содержимым.\n   */\n  bottom?: React.ReactNode;\n  /**\n   * Передаётся при использовании `bottom`.\n   *\n   * Должен совпадать с `aria-describedby`, который передаётся в компонент, отвечающий за пользовательский ввод.\n   */\n  bottomId?: string;\n  /**\n   * Статус, влияющий на стиль отображения компонента.\n   */\n  status?: 'default' | 'error' | 'valid';\n  /**\n   * Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n   *\n   * Режим `indent` предназначен для визуального отступа.\n   */\n  removable?: boolean | 'indent';\n  /**\n   * Удаляет внешние отступы вокруг компонента.\n   * @since 5.8.0\n   */\n  noPadding?: boolean;\n  /**\n   * Помечает поле обязательным.\n   */\n  required?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/form-item\n */\nexport const FormItem: React.FC<FormItemProps> & {\n  Top: typeof FormItemTop;\n  TopLabel: typeof FormItemTopLabel;\n  TopAside: typeof FormItemTopAside;\n} = ({\n  children,\n  top,\n  topId,\n  topMultiline = false,\n  topComponent: topComponentProp,\n  bottom,\n  status = 'default',\n  removable,\n  onRemove,\n  removePlaceholder = 'Удалить',\n  getRootRef,\n  htmlFor,\n  bottomId,\n  noPadding,\n  required = false,\n  disabled,\n  ...restProps\n}: FormItemProps) => {\n  const rootEl = useExternRef(getRootRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const wrappedChildren = (\n    <React.Fragment>\n      {isPrimitiveReactNode(top) ? (\n        <FormItemTop>\n          <FormItemTopLabel htmlFor={htmlFor} Component={topComponentProp} id={topId}>\n            {top}\n          </FormItemTopLabel>\n        </FormItemTop>\n      ) : hasReactNode(top) ? (\n        top\n      ) : null}\n      {children}\n      {hasReactNode(bottom) && (\n        <Footnote\n          className={styles.bottom}\n          id={bottomId}\n          role={status === 'error' ? 'alert' : undefined}\n        >\n          {bottom}\n        </Footnote>\n      )}\n    </React.Fragment>\n  );\n\n  const context = React.useMemo(() => ({ required, topMultiline }), [required, topMultiline]);\n\n  return (\n    <RootComponent\n      {...restProps}\n      getRootRef={rootEl}\n      baseClassName={classNames(\n        styles.host,\n        !noPadding && styles.withPadding,\n        'vkuiInternalFormItem',\n        status !== 'default' && stylesStatus[status],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        hasReactNode(top) && classNames(styles.withTop, 'vkuiInternalFormItem--withTop'),\n        removable && classNames(styles.withRemovable, 'vkuiInternalFormItem--removable'),\n      )}\n    >\n      <FormItemContext.Provider value={context}>\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            noPadding={noPadding}\n            disabled={disabled}\n          >\n            <div className={classNames(styles.removable, 'vkuiInternalFormItem__removable')}>\n              {wrappedChildren}\n            </div>\n          </Removable>\n        ) : (\n          wrappedChildren\n        )}\n      </FormItemContext.Provider>\n    </RootComponent>\n  );\n};\n\nFormItem.Top = FormItemTop;\nFormItem.TopLabel = FormItemTopLabel;\nFormItem.TopAside = FormItemTopAside;\n\nif (process.env.NODE_ENV !== 'production') {\n  defineComponentDisplayNames(FormItem.Top, 'FormItem.Top');\n  defineComponentDisplayNames(FormItem.TopLabel, 'FormItem.TopLabel');\n  defineComponentDisplayNames(FormItem.TopAside, 'FormItem.TopAside');\n}\n"],"names":["React","classNames","hasReactNode","isPrimitiveReactNode","useAdaptivity","useExternRef","defineComponentDisplayNames","Removable","RootComponent","Footnote","FormItemTop","FormItemTopAside","FormItemTopLabel","FormItemContext","sizeYClassNames","none","compact","stylesStatus","error","valid","FormItem","children","top","topId","topMultiline","topComponent","topComponentProp","bottom","status","removable","onRemove","removePlaceholder","getRootRef","htmlFor","bottomId","noPadding","required","disabled","restProps","rootEl","sizeY","wrappedChildren","Fragment","Component","id","className","role","undefined","context","useMemo","baseClassName","Provider","value","align","e","current","indent","div","Top","TopLabel","TopAside","process","env","NODE_ENV"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,EAAEC,oBAAoB,QAAQ,kBAAkB;AACjF,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,2BAA2B,QAAQ,iDAA8C;AAE1F,SAASC,SAAS,QAA6B,4BAAyB;AACxE,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,WAAW,QAAQ,+BAA4B;AACxD,SAASC,gBAAgB,QAAQ,oCAAiC;AAClE,SAASC,gBAAgB,QAAQ,oCAAiC;AAClE,SAASC,eAAe,QAAQ,eAAY;AAG5C,MAAMC,kBAAkB;IACtBC,MAAMd,sCAA6B;IACnCe,SAASf,yCAAgC;AAC3C;AAEA,MAAMgB,eAAe;IACnBC,OAAOjB,wCAA+B;IACtCkB,OAAOlB,wCAA+B;AACxC;AA0DA;;CAEC,GACD,OAAO,MAAMmB,WAIT;QAAC,EACHC,QAAQ,EACRC,GAAG,EACHC,KAAK,EACLC,eAAe,KAAK,EACpBC,cAAcC,gBAAgB,EAC9BC,MAAM,EACNC,SAAS,SAAS,EAClBC,SAAS,EACTC,QAAQ,EACRC,oBAAoB,SAAS,EAC7BC,UAAU,EACVC,OAAO,EACPC,QAAQ,EACRC,SAAS,EACTC,WAAW,KAAK,EAChBC,QAAQ,EAEM,WADXC;QAhBHjB;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,SAASlC,aAAa2B;IAC5B,MAAM,EAAEQ,QAAQ,MAAM,EAAE,GAAGpC;IAE3B,MAAMqC,gCACJ,MAACzC,MAAM0C,QAAQ;;YACZvC,qBAAqBmB,qBACpB,KAACZ;0BACC,cAAA,KAACE;oBAAiBqB,SAASA;oBAASU,WAAWjB;oBAAkBkB,IAAIrB;8BAClED;;iBAGHpB,aAAaoB,OACfA,MACE;YACHD;YACAnB,aAAayB,yBACZ,KAAClB;gBACCoC,SAAS;gBACTD,IAAIV;gBACJY,MAAMlB,WAAW,UAAU,UAAUmB;0BAEpCpB;;;;IAMT,MAAMqB,UAAUhD,MAAMiD,OAAO,CAAC,IAAO,CAAA;YAAEb;YAAUZ;QAAa,CAAA,GAAI;QAACY;QAAUZ;KAAa;IAE1F,qBACE,KAAChB,uDACK8B;QACJN,YAAYO;QACZW,eAAejD,iCAEb,CAACkC,0CACD,wBACAP,WAAW,aAAaX,YAAY,CAACW,OAAO,EAC5CY,UAAU,aAAa1B,eAAe,CAAC0B,MAAM,EAC7CtC,aAAaoB,QAAQrB,oCAA2B,kCAChD4B,aAAa5B,0CAAiC;kBAGhD,cAAA,KAACY,gBAAgBsC,QAAQ;YAACC,OAAOJ;sBAC9BnB,0BACC,KAACtB;gBACC8C,OAAM;gBACNvB,UAAU,CAACwB;oBACT,IAAIf,mBAAAA,6BAAAA,OAAQgB,OAAO,EAAE;wBACnBzB,qBAAAA,+BAAAA,SAAWwB,GAAGf,OAAOgB,OAAO;oBAC9B;gBACF;gBACAxB,mBAAmBA;gBACnByB,QAAQ3B,cAAc;gBACtBM,WAAWA;gBACXE,UAAUA;0BAEV,cAAA,KAACoB;oBAAIZ,WAAW5C,sCAA6B;8BAC1CwC;;iBAILA;;;AAKV,EAAE;AAEFrB,SAASsC,GAAG,GAAGhD;AACfU,SAASuC,QAAQ,GAAG/C;AACpBQ,SAASwC,QAAQ,GAAGjD;AAEpB,IAAIkD,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;IACzCzD,4BAA4Bc,SAASsC,GAAG,EAAE;IAC1CpD,4BAA4Bc,SAASuC,QAAQ,EAAE;IAC/CrD,4BAA4Bc,SAASwC,QAAQ,EAAE;AACjD"}

package/dist/components/FormLayoutGroup/FormLayoutGroup.d.ts

@@ -18,7 +18,7 @@ export interface FormLayoutGroupProps extends HTMLAttributesWithRootRef<HTMLDivE
     segmented?: boolean;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/FormLayoutGroup
+ * @see https://vkui.io/components/form-layout-group
  */
 export declare const FormLayoutGroup: ({ children, mode, removable, segmented, removePlaceholder, onRemove, getRootRef, disabled, ...restProps }: FormLayoutGroupProps) => React.ReactNode;
 //# sourceMappingURL=FormLayoutGroup.d.ts.map

package/dist/components/FormLayoutGroup/FormLayoutGroup.js

@@ -14,7 +14,7 @@ const sizeYClassNames = {
     compact: classNames("vkuiFormLayoutGroup__sizeYCompact", 'vkuiInternalFormLayoutGroup--sizeY-compact')
 };
 /**
- * @see https://vkcom.github.io/VKUI/#/FormLayoutGroup
+ * @see https://vkui.io/components/form-layout-group
  */ export const FormLayoutGroup = (_param)=>{
     var { children, mode = 'vertical', removable, segmented, removePlaceholder = 'Удалить', onRemove, getRootRef, disabled } = _param, restProps = _object_without_properties(_param, [
         "children",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FormLayoutGroup/FormLayoutGroup.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { Removable, type RemovableProps } from '../Removable/Removable';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './FormLayoutGroup.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(styles.sizeYNone, 'vkuiInternalFormLayoutGroup--sizeY-none'),\n  compact: classNames(styles.sizeYCompact, 'vkuiInternalFormLayoutGroup--sizeY-compact'),\n};\n\nexport interface FormLayoutGroupProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    RemovableProps {\n  /**\n   * Направление отображения элементов формы.\n   */\n  mode?: 'vertical' | 'horizontal';\n  /**\n   * Только для режима horizontal. Дает возможность удалить всю группу `FormItem`.\n   *\n   * Режим `indent` предназначен для визуального отступа.\n   */\n  removable?: boolean | 'indent';\n\n  /**\n   * Дает возможность склеить несколько `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,\n  getRootRef,\n  disabled,\n  ...restProps\n}: FormLayoutGroupProps): React.ReactNode => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const isRemovable = removable && mode === 'horizontal';\n  const rootEl = useExternRef(getRootRef);\n\n  return (\n    <RootComponent\n      getRootRef={rootEl}\n      Component=\"fieldset\"\n      baseClassName={classNames(\n        styles.host,\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        mode === 'horizontal' &&\n          classNames(styles.modeHorizontal, 'vkuiInternalFormLayoutGroup--mode-horizontal'),\n        mode === 'vertical' && 'vkuiInternalFormLayoutGroup--mode-vertical',\n        isRemovable && classNames(styles.withRemovable, 'vkuiInternalFormLayoutGroup--removable'),\n        segmented && classNames(styles.segmented, 'vkuiInternalFormLayoutGroup--segmented'),\n      )}\n      disabled={disabled}\n      {...restProps}\n    >\n      {isRemovable ? (\n        <Removable\n          className={styles.removable}\n          align=\"start\"\n          removePlaceholder={removePlaceholder}\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove?.(e, rootEl.current);\n            }\n          }}\n          disabled={disabled}\n          indent={removable === 'indent'}\n        >\n          {children}\n        </Removable>\n      ) : (\n        <React.Fragment>\n          {children}\n          <span className={styles.offset} aria-hidden />\n        </React.Fragment>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useExternRef","Removable","RootComponent","sizeYClassNames","none","compact","FormLayoutGroup","children","mode","removable","segmented","removePlaceholder","onRemove","getRootRef","disabled","restProps","sizeY","isRemovable","rootEl","Component","baseClassName","className","align","e","current","indent","Fragment","span","aria-hidden"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,YAAY,QAAQ,8BAA2B;AAExD,SAASC,SAAS,QAA6B,4BAAyB;AACxE,SAASC,aAAa,QAAQ,oCAAiC;AAG/D,MAAMC,kBAAkB;IACtBC,MAAMN,6CAA6B;IACnCO,SAASP,gDAAgC;AAC3C;AAsBA;;CAEC,GACD,OAAO,MAAMQ,kBAAkB;QAAC,EAC9BC,QAAQ,EACRC,OAAO,UAAU,EACjBC,SAAS,EACTC,SAAS,EACTC,oBAAoB,SAAS,EAC7BC,QAAQ,EACRC,UAAU,EACVC,QAAQ,EAEa,WADlBC;QARHR;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,EAAEE,QAAQ,MAAM,EAAE,GAAGjB;IAC3B,MAAMkB,cAAcR,aAAaD,SAAS;IAC1C,MAAMU,SAASlB,aAAaa;IAE5B,qBACE,KAACX;QACCW,YAAYK;QACZC,WAAU;QACVC,eAAetB,wCAEbkB,UAAU,aAAab,eAAe,CAACa,MAAM,EAC7CR,SAAS,gBACPV,kDAAkC,iDACpCU,SAAS,cAAc,8CACvBS,eAAenB,iDAAiC,2CAChDY,aAAaZ,6CAA6B;QAE5CgB,UAAUA;OACNC;kBAEHE,4BACC,KAAChB;YACCoB,SAAS;YACTC,OAAM;YACNX,mBAAmBA;YACnBC,UAAU,CAACW;gBACT,IAAIL,mBAAAA,6BAAAA,OAAQM,OAAO,EAAE;oBACnBZ,qBAAAA,+BAAAA,SAAWW,GAAGL,OAAOM,OAAO;gBAC9B;YACF;YACAV,UAAUA;YACVW,QAAQhB,cAAc;sBAErBF;2BAGH,MAACV,MAAM6B,QAAQ;;gBACZnB;8BACD,KAACoB;oBAAKN,SAAS;oBAAiBO,aAAW;;;;;AAKrD,EAAE"}
+{"version":3,"sources":["../../../src/components/FormLayoutGroup/FormLayoutGroup.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { Removable, type RemovableProps } from '../Removable/Removable';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './FormLayoutGroup.module.css';\n\nconst sizeYClassNames = {\n  none: classNames(styles.sizeYNone, 'vkuiInternalFormLayoutGroup--sizeY-none'),\n  compact: classNames(styles.sizeYCompact, 'vkuiInternalFormLayoutGroup--sizeY-compact'),\n};\n\nexport interface FormLayoutGroupProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    RemovableProps {\n  /**\n   * Направление отображения элементов формы.\n   */\n  mode?: 'vertical' | 'horizontal';\n  /**\n   * Только для режима horizontal. Дает возможность удалить всю группу `FormItem`.\n   *\n   * Режим `indent` предназначен для визуального отступа.\n   */\n  removable?: boolean | 'indent';\n\n  /**\n   * Дает возможность склеить несколько `FormItem`.\n   */\n  segmented?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/form-layout-group\n */\nexport const FormLayoutGroup = ({\n  children,\n  mode = 'vertical',\n  removable,\n  segmented,\n  removePlaceholder = 'Удалить',\n  onRemove,\n  getRootRef,\n  disabled,\n  ...restProps\n}: FormLayoutGroupProps): React.ReactNode => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const isRemovable = removable && mode === 'horizontal';\n  const rootEl = useExternRef(getRootRef);\n\n  return (\n    <RootComponent\n      getRootRef={rootEl}\n      Component=\"fieldset\"\n      baseClassName={classNames(\n        styles.host,\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        mode === 'horizontal' &&\n          classNames(styles.modeHorizontal, 'vkuiInternalFormLayoutGroup--mode-horizontal'),\n        mode === 'vertical' && 'vkuiInternalFormLayoutGroup--mode-vertical',\n        isRemovable && classNames(styles.withRemovable, 'vkuiInternalFormLayoutGroup--removable'),\n        segmented && classNames(styles.segmented, 'vkuiInternalFormLayoutGroup--segmented'),\n      )}\n      disabled={disabled}\n      {...restProps}\n    >\n      {isRemovable ? (\n        <Removable\n          className={styles.removable}\n          align=\"start\"\n          removePlaceholder={removePlaceholder}\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove?.(e, rootEl.current);\n            }\n          }}\n          disabled={disabled}\n          indent={removable === 'indent'}\n        >\n          {children}\n        </Removable>\n      ) : (\n        <React.Fragment>\n          {children}\n          <span className={styles.offset} aria-hidden />\n        </React.Fragment>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useExternRef","Removable","RootComponent","sizeYClassNames","none","compact","FormLayoutGroup","children","mode","removable","segmented","removePlaceholder","onRemove","getRootRef","disabled","restProps","sizeY","isRemovable","rootEl","Component","baseClassName","className","align","e","current","indent","Fragment","span","aria-hidden"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,YAAY,QAAQ,8BAA2B;AAExD,SAASC,SAAS,QAA6B,4BAAyB;AACxE,SAASC,aAAa,QAAQ,oCAAiC;AAG/D,MAAMC,kBAAkB;IACtBC,MAAMN,6CAA6B;IACnCO,SAASP,gDAAgC;AAC3C;AAsBA;;CAEC,GACD,OAAO,MAAMQ,kBAAkB;QAAC,EAC9BC,QAAQ,EACRC,OAAO,UAAU,EACjBC,SAAS,EACTC,SAAS,EACTC,oBAAoB,SAAS,EAC7BC,QAAQ,EACRC,UAAU,EACVC,QAAQ,EAEa,WADlBC;QARHR;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,EAAEE,QAAQ,MAAM,EAAE,GAAGjB;IAC3B,MAAMkB,cAAcR,aAAaD,SAAS;IAC1C,MAAMU,SAASlB,aAAaa;IAE5B,qBACE,KAACX;QACCW,YAAYK;QACZC,WAAU;QACVC,eAAetB,wCAEbkB,UAAU,aAAab,eAAe,CAACa,MAAM,EAC7CR,SAAS,gBACPV,kDAAkC,iDACpCU,SAAS,cAAc,8CACvBS,eAAenB,iDAAiC,2CAChDY,aAAaZ,6CAA6B;QAE5CgB,UAAUA;OACNC;kBAEHE,4BACC,KAAChB;YACCoB,SAAS;YACTC,OAAM;YACNX,mBAAmBA;YACnBC,UAAU,CAACW;gBACT,IAAIL,mBAAAA,6BAAAA,OAAQM,OAAO,EAAE;oBACnBZ,qBAAAA,+BAAAA,SAAWW,GAAGL,OAAOM,OAAO;gBAC9B;YACF;YACAV,UAAUA;YACVW,QAAQhB,cAAc;sBAErBF;2BAGH,MAACV,MAAM6B,QAAQ;;gBACZnB;8BACD,KAACoB;oBAAKN,SAAS;oBAAiBO,aAAW;;;;;AAKrD,EAAE"}

package/dist/components/FormStatus/FormStatus.d.ts

@@ -11,7 +11,7 @@ export interface FormStatusProps extends Omit<HTMLAttributesWithRootRef<HTMLDivE
     title?: React.ReactNode;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/FormStatus
+ * @see https://vkui.io/components/form-status
  */
 export declare const FormStatus: ({ mode, children, className, role, title, ...restProps }: FormStatusProps) => React.ReactNode;
 //# sourceMappingURL=FormStatus.d.ts.map

package/dist/components/FormStatus/FormStatus.js

@@ -6,7 +6,7 @@ import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
 import { Banner } from "../Banner/Banner.js";
 /**
- * @see https://vkcom.github.io/VKUI/#/FormStatus
+ * @see https://vkui.io/components/form-status
  */ export const FormStatus = (_param)=>{
     var { mode, children, className, role = mode === 'error' ? 'alert' : 'status', title } = _param, restProps = _object_without_properties(_param, [
         "mode",

package/dist/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 type { HTMLAttributesWithRootRef } from '../../types';\nimport { Banner } from '../Banner/Banner';\nimport styles from './FormStatus.module.css';\n\nexport interface FormStatusProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'title'> {\n  /**\n   * Режим отображения компонента.\n   */\n  mode?: 'default' | 'error';\n  /**\n   * Основной текст.\n   */\n  title?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormStatus\n */\nexport const FormStatus = ({\n  mode,\n  children,\n  className,\n  role = mode === 'error' ? 'alert' : 'status',\n  title,\n  ...restProps\n}: FormStatusProps): React.ReactNode => {\n  return (\n    <Banner\n      {...restProps}\n      title={title}\n      role={role}\n      subtitle={children}\n      className={classNames(\n        'vkuiInternalFormStatus',\n        mode === 'error' && classNames(styles.modeError, 'vkuiInternalFormStatus--mode-error'),\n        className,\n      )}\n    />\n  );\n};\n"],"names":["React","classNames","Banner","FormStatus","mode","children","className","role","title","restProps","subtitle"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,MAAM,QAAQ,sBAAmB;AAc1C;;CAEC,GACD,OAAO,MAAMC,aAAa;QAAC,EACzBC,IAAI,EACJC,QAAQ,EACRC,SAAS,EACTC,OAAOH,SAAS,UAAU,UAAU,QAAQ,EAC5CI,KAAK,EAEW,WADbC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,KAACN,gDACKO;QACJD,OAAOA;QACPD,MAAMA;QACNG,UAAUL;QACVC,WAAWL,WACT,0BACAG,SAAS,WAAWH,wCAA6B,uCACjDK;;AAIR,EAAE"}
+{"version":3,"sources":["../../../src/components/FormStatus/FormStatus.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { Banner } from '../Banner/Banner';\nimport styles from './FormStatus.module.css';\n\nexport interface FormStatusProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'title'> {\n  /**\n   * Режим отображения компонента.\n   */\n  mode?: 'default' | 'error';\n  /**\n   * Основной текст.\n   */\n  title?: React.ReactNode;\n}\n\n/**\n * @see https://vkui.io/components/form-status\n */\nexport const FormStatus = ({\n  mode,\n  children,\n  className,\n  role = mode === 'error' ? 'alert' : 'status',\n  title,\n  ...restProps\n}: FormStatusProps): React.ReactNode => {\n  return (\n    <Banner\n      {...restProps}\n      title={title}\n      role={role}\n      subtitle={children}\n      className={classNames(\n        'vkuiInternalFormStatus',\n        mode === 'error' && classNames(styles.modeError, 'vkuiInternalFormStatus--mode-error'),\n        className,\n      )}\n    />\n  );\n};\n"],"names":["React","classNames","Banner","FormStatus","mode","children","className","role","title","restProps","subtitle"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,MAAM,QAAQ,sBAAmB;AAc1C;;CAEC,GACD,OAAO,MAAMC,aAAa;QAAC,EACzBC,IAAI,EACJC,QAAQ,EACRC,SAAS,EACTC,OAAOH,SAAS,UAAU,UAAU,QAAQ,EAC5CI,KAAK,EAEW,WADbC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,KAACN,gDACKO;QACJD,OAAOA;QACPD,MAAMA;QACNG,UAAUL;QACVC,WAAWL,WACT,0BACAG,SAAS,WAAWH,wCAA6B,uCACjDK;;AAIR,EAAE"}

package/dist/components/Gallery/Gallery.d.ts

@@ -11,7 +11,7 @@ export interface GalleryProps extends BaseGalleryProps {
     timeout?: number;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/Gallery
+ * @see https://vkui.io/components/gallery
  */
 export declare const Gallery: ({ initialSlideIndex, children, timeout, onChange, bullets, onDragStart, onDragEnd, ...props }: GalleryProps) => React.ReactNode;
 //# sourceMappingURL=Gallery.d.ts.map

package/dist/components/Gallery/Gallery.js

@@ -10,7 +10,7 @@ import { callMultiple } from "../../lib/callMultiple.js";
 import { CarouselBase } from "../CarouselBase/CarouselBase.js";
 import { useAutoPlay } from "./hooks.js";
 /**
- * @see https://vkcom.github.io/VKUI/#/Gallery
+ * @see https://vkui.io/components/gallery
  */ export const Gallery = (_param)=>{
     var { initialSlideIndex = 0, children, timeout = 0, onChange, bullets, onDragStart, onDragEnd } = _param, props = _object_without_properties(_param, [
         "initialSlideIndex",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Gallery/Gallery.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { clamp } from '../../helpers/math';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { CarouselBase } from '../CarouselBase/CarouselBase';\nimport type { BaseGalleryProps } from '../CarouselBase/types';\nimport { useAutoPlay } from './hooks';\n\nexport interface GalleryProps extends BaseGalleryProps {\n  /**\n   * Индекс слайда по умолчанию.\n   */\n  initialSlideIndex?: number;\n  /**\n   * При передаче происходит автоматический переход к следующему слайду через переданное время в ms.\n   */\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  onDragStart,\n  onDragEnd,\n  ...props\n}: GalleryProps): React.ReactNode => {\n  const [localSlideIndex, setSlideIndex] = React.useState(initialSlideIndex);\n  const isControlled = typeof props.slideIndex === 'number';\n  const slideIndex = isControlled ? (props.slideIndex ?? 0) : localSlideIndex;\n  const slides = React.useMemo(\n    () => React.Children.toArray(children).filter((item) => Boolean(item)),\n    [children],\n  );\n  const childCount = slides.length;\n  const isClient = useIsClient();\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 autoPlayControls = useAutoPlay({\n    timeout,\n    slideIndex,\n    onNext: () => handleChange((slideIndex + 1) % childCount),\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  if (!isClient) {\n    return null;\n  }\n\n  return (\n    <CarouselBase\n      dragDisabled={isControlled && !onChange}\n      {...props}\n      onDragStart={callMultiple(onDragStart, autoPlayControls.pause)}\n      onDragEnd={callMultiple(onDragEnd, autoPlayControls.resume)}\n      bullets={childCount > 0 && bullets}\n      slideIndex={safeSlideIndex}\n      onChange={handleChange}\n    >\n      {slides}\n    </CarouselBase>\n  );\n};\n"],"names":["React","clamp","useIsClient","callMultiple","CarouselBase","useAutoPlay","Gallery","initialSlideIndex","children","timeout","onChange","bullets","onDragStart","onDragEnd","props","localSlideIndex","setSlideIndex","useState","isControlled","slideIndex","slides","useMemo","Children","toArray","filter","item","Boolean","childCount","length","isClient","handleChange","useCallback","current","autoPlayControls","onNext","safeSlideIndex","useEffect","dragDisabled","pause","resume"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,QAAQ,wBAAqB;AAC3C,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,YAAY,QAAQ,4BAAyB;AACtD,SAASC,YAAY,QAAQ,kCAA+B;AAE5D,SAASC,WAAW,QAAQ,aAAU;AAatC;;CAEC,GACD,OAAO,MAAMC,UAAU;QAAC,EACtBC,oBAAoB,CAAC,EACrBC,QAAQ,EACRC,UAAU,CAAC,EACXC,QAAQ,EACRC,OAAO,EACPC,WAAW,EACXC,SAAS,EAEI,WADVC;QAPHP;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,CAACE,iBAAiBC,cAAc,GAAGhB,MAAMiB,QAAQ,CAACV;IACxD,MAAMW,eAAe,OAAOJ,MAAMK,UAAU,KAAK;QACdL;IAAnC,MAAMK,aAAaD,eAAgBJ,CAAAA,oBAAAA,MAAMK,UAAU,cAAhBL,+BAAAA,oBAAoB,IAAKC;IAC5D,MAAMK,SAASpB,MAAMqB,OAAO,CAC1B,IAAMrB,MAAMsB,QAAQ,CAACC,OAAO,CAACf,UAAUgB,MAAM,CAAC,CAACC,OAASC,QAAQD,QAChE;QAACjB;KAAS;IAEZ,MAAMmB,aAAaP,OAAOQ,MAAM;IAChC,MAAMC,WAAW3B;IAEjB,MAAM4B,eAAyC9B,MAAM+B,WAAW,CAC9D,CAACC;QACC,IAAIA,YAAYb,YAAY;YAC1B;QACF;QACA,CAACD,gBAAgBF,cAAcgB;QAC/BtB,YAAYA,SAASsB;IACvB,GACA;QAACd;QAAcR;QAAUS;KAAW;IAGtC,MAAMc,mBAAmB5B,YAAY;QACnCI;QACAU;QACAe,QAAQ,IAAMJ,aAAa,AAACX,CAAAA,aAAa,CAAA,IAAKQ;IAChD;IAEA,6BAA6B;IAC7B,gEAAgE;IAChE,MAAMQ,iBAAiBR,aAAa,IAAI1B,MAAMkB,YAAY,GAAGQ,aAAa,KAAKR;IAC/E,mCAAmC;IACnCnB,MAAMoC,SAAS,CAAC;QACd,IAAI1B,YAAYyB,mBAAmBhB,YAAY;YAC7CT,SAASyB;QACX;QACAnB,cAAcmB;IAChB,GAAG;QAACzB;QAAUyB;QAAgBhB;KAAW;IAEzC,IAAI,CAACU,UAAU;QACb,OAAO;IACT;IAEA,qBACE,KAACzB;QACCiC,cAAcnB,gBAAgB,CAACR;OAC3BI;QACJF,aAAaT,aAAaS,aAAaqB,iBAAiBK,KAAK;QAC7DzB,WAAWV,aAAaU,WAAWoB,iBAAiBM,MAAM;QAC1D5B,SAASgB,aAAa,KAAKhB;QAC3BQ,YAAYgB;QACZzB,UAAUoB;kBAETV;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/Gallery/Gallery.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { clamp } from '../../helpers/math';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { CarouselBase } from '../CarouselBase/CarouselBase';\nimport type { BaseGalleryProps } from '../CarouselBase/types';\nimport { useAutoPlay } from './hooks';\n\nexport interface GalleryProps extends BaseGalleryProps {\n  /**\n   * Индекс слайда по умолчанию.\n   */\n  initialSlideIndex?: number;\n  /**\n   * При передаче происходит автоматический переход к следующему слайду через переданное время в ms.\n   */\n  timeout?: number;\n}\n\n/**\n * @see https://vkui.io/components/gallery\n */\nexport const Gallery = ({\n  initialSlideIndex = 0,\n  children,\n  timeout = 0,\n  onChange,\n  bullets,\n  onDragStart,\n  onDragEnd,\n  ...props\n}: GalleryProps): React.ReactNode => {\n  const [localSlideIndex, setSlideIndex] = React.useState(initialSlideIndex);\n  const isControlled = typeof props.slideIndex === 'number';\n  const slideIndex = isControlled ? (props.slideIndex ?? 0) : localSlideIndex;\n  const slides = React.useMemo(\n    () => React.Children.toArray(children).filter((item) => Boolean(item)),\n    [children],\n  );\n  const childCount = slides.length;\n  const isClient = useIsClient();\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 autoPlayControls = useAutoPlay({\n    timeout,\n    slideIndex,\n    onNext: () => handleChange((slideIndex + 1) % childCount),\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  if (!isClient) {\n    return null;\n  }\n\n  return (\n    <CarouselBase\n      dragDisabled={isControlled && !onChange}\n      {...props}\n      onDragStart={callMultiple(onDragStart, autoPlayControls.pause)}\n      onDragEnd={callMultiple(onDragEnd, autoPlayControls.resume)}\n      bullets={childCount > 0 && bullets}\n      slideIndex={safeSlideIndex}\n      onChange={handleChange}\n    >\n      {slides}\n    </CarouselBase>\n  );\n};\n"],"names":["React","clamp","useIsClient","callMultiple","CarouselBase","useAutoPlay","Gallery","initialSlideIndex","children","timeout","onChange","bullets","onDragStart","onDragEnd","props","localSlideIndex","setSlideIndex","useState","isControlled","slideIndex","slides","useMemo","Children","toArray","filter","item","Boolean","childCount","length","isClient","handleChange","useCallback","current","autoPlayControls","onNext","safeSlideIndex","useEffect","dragDisabled","pause","resume"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,QAAQ,wBAAqB;AAC3C,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,YAAY,QAAQ,4BAAyB;AACtD,SAASC,YAAY,QAAQ,kCAA+B;AAE5D,SAASC,WAAW,QAAQ,aAAU;AAatC;;CAEC,GACD,OAAO,MAAMC,UAAU;QAAC,EACtBC,oBAAoB,CAAC,EACrBC,QAAQ,EACRC,UAAU,CAAC,EACXC,QAAQ,EACRC,OAAO,EACPC,WAAW,EACXC,SAAS,EAEI,WADVC;QAPHP;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,CAACE,iBAAiBC,cAAc,GAAGhB,MAAMiB,QAAQ,CAACV;IACxD,MAAMW,eAAe,OAAOJ,MAAMK,UAAU,KAAK;QACdL;IAAnC,MAAMK,aAAaD,eAAgBJ,CAAAA,oBAAAA,MAAMK,UAAU,cAAhBL,+BAAAA,oBAAoB,IAAKC;IAC5D,MAAMK,SAASpB,MAAMqB,OAAO,CAC1B,IAAMrB,MAAMsB,QAAQ,CAACC,OAAO,CAACf,UAAUgB,MAAM,CAAC,CAACC,OAASC,QAAQD,QAChE;QAACjB;KAAS;IAEZ,MAAMmB,aAAaP,OAAOQ,MAAM;IAChC,MAAMC,WAAW3B;IAEjB,MAAM4B,eAAyC9B,MAAM+B,WAAW,CAC9D,CAACC;QACC,IAAIA,YAAYb,YAAY;YAC1B;QACF;QACA,CAACD,gBAAgBF,cAAcgB;QAC/BtB,YAAYA,SAASsB;IACvB,GACA;QAACd;QAAcR;QAAUS;KAAW;IAGtC,MAAMc,mBAAmB5B,YAAY;QACnCI;QACAU;QACAe,QAAQ,IAAMJ,aAAa,AAACX,CAAAA,aAAa,CAAA,IAAKQ;IAChD;IAEA,6BAA6B;IAC7B,gEAAgE;IAChE,MAAMQ,iBAAiBR,aAAa,IAAI1B,MAAMkB,YAAY,GAAGQ,aAAa,KAAKR;IAC/E,mCAAmC;IACnCnB,MAAMoC,SAAS,CAAC;QACd,IAAI1B,YAAYyB,mBAAmBhB,YAAY;YAC7CT,SAASyB;QACX;QACAnB,cAAcmB;IAChB,GAAG;QAACzB;QAAUyB;QAAgBhB;KAAW;IAEzC,IAAI,CAACU,UAAU;QACb,OAAO;IACT;IAEA,qBACE,KAACzB;QACCiC,cAAcnB,gBAAgB,CAACR;OAC3BI;QACJF,aAAaT,aAAaS,aAAaqB,iBAAiBK,KAAK;QAC7DzB,WAAWV,aAAaU,WAAWoB,iBAAiBM,MAAM;QAC1D5B,SAASgB,aAAa,KAAKhB;QAC3BQ,YAAYgB;QACZzB,UAAUoB;kBAETV;;AAGP,EAAE"}

package/dist/components/Gradient/Gradient.d.ts

@@ -10,7 +10,7 @@ export interface GradientProps extends HTMLAttributesWithRootRef<HTMLDivElement>
     to?: 'top' | 'bottom';
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/Gradient
+ * @see https://vkui.io/components/gradient
  */
 export declare const Gradient: ({ mode, to, ...restProps }: GradientProps) => React.ReactNode;
 //# sourceMappingURL=Gradient.d.ts.map

package/dist/components/Gradient/Gradient.js

@@ -9,7 +9,7 @@ const modeStyles = {
     tint: "vkuiGradient__modeTint"
 };
 /**
- * @see https://vkcom.github.io/VKUI/#/Gradient
+ * @see https://vkui.io/components/gradient
  */ export const Gradient = (_param)=>{
     var { mode = 'default', to = 'top' } = _param, restProps = _object_without_properties(_param, [
         "mode",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Gradient/Gradient.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Gradient.module.css';\n\nconst modeStyles = {\n  overlay: styles.modeOverlay,\n  tint: styles.modeTint,\n};\n\nexport interface GradientProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Тип градиента.\n   */\n  mode?: 'tint' | 'default' | 'overlay';\n  /**\n   * Направление градиента.\n   */\n  to?: 'top' | 'bottom';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Gradient\n */\nexport const Gradient = ({\n  mode = 'default',\n  to = 'top',\n  ...restProps\n}: GradientProps): React.ReactNode => {\n  return (\n    <RootComponent\n      role=\"presentation\"\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        mode !== 'default' && modeStyles[mode],\n        to === 'bottom' && styles.toBottom,\n      )}\n    />\n  );\n};\n"],"names":["classNames","RootComponent","modeStyles","overlay","tint","Gradient","mode","to","restProps","role","baseClassName"],"mappings":";;;;AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,oCAAiC;AAG/D,MAAMC,aAAa;IACjBC,OAAO;IACPC,IAAI;AACN;AAaA;;CAEC,GACD,OAAO,MAAMC,WAAW;QAAC,EACvBC,OAAO,SAAS,EAChBC,KAAK,KAAK,EAEI,WADXC;QAFHF;QACAC;;IAGA,qBACE,KAACN;QACCQ,MAAK;OACDD;QACJE,eAAeV,iCAEbM,SAAS,aAAaJ,UAAU,CAACI,KAAK,EACtCC,OAAO;;AAIf,EAAE"}
+{"version":3,"sources":["../../../src/components/Gradient/Gradient.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Gradient.module.css';\n\nconst modeStyles = {\n  overlay: styles.modeOverlay,\n  tint: styles.modeTint,\n};\n\nexport interface GradientProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Тип градиента.\n   */\n  mode?: 'tint' | 'default' | 'overlay';\n  /**\n   * Направление градиента.\n   */\n  to?: 'top' | 'bottom';\n}\n\n/**\n * @see https://vkui.io/components/gradient\n */\nexport const Gradient = ({\n  mode = 'default',\n  to = 'top',\n  ...restProps\n}: GradientProps): React.ReactNode => {\n  return (\n    <RootComponent\n      role=\"presentation\"\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        mode !== 'default' && modeStyles[mode],\n        to === 'bottom' && styles.toBottom,\n      )}\n    />\n  );\n};\n"],"names":["classNames","RootComponent","modeStyles","overlay","tint","Gradient","mode","to","restProps","role","baseClassName"],"mappings":";;;;AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,oCAAiC;AAG/D,MAAMC,aAAa;IACjBC,OAAO;IACPC,IAAI;AACN;AAaA;;CAEC,GACD,OAAO,MAAMC,WAAW;QAAC,EACvBC,OAAO,SAAS,EAChBC,KAAK,KAAK,EAEI,WADXC;QAFHF;QACAC;;IAGA,qBACE,KAACN;QACCQ,MAAK;OACDD;QACJE,eAAeV,iCAEbM,SAAS,aAAaJ,UAAU,CAACI,KAAK,EACtCC,OAAO;;AAIf,EAAE"}

package/dist/components/GridAvatar/GridAvatar.d.ts

@@ -9,7 +9,7 @@ export interface GridAvatarProps extends Omit<ImageBaseProps, 'src' | 'fallbackI
     src?: string[];
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/GridAvatar
+ * @see https://vkui.io/components/grid-avatar
  */
 export declare const GridAvatar: React.FC<GridAvatarProps> & {
     Badge: typeof GridAvatarBadge;

package/dist/components/GridAvatar/GridAvatar.js

@@ -10,7 +10,7 @@ const GRID_AVATAR_DEFAULT_SIZE = 48;
 export const MAX_GRID_LENGTH = 4;
 const warn = warnOnce('GridAvatar');
 /**
- * @see https://vkcom.github.io/VKUI/#/GridAvatar
+ * @see https://vkui.io/components/grid-avatar
  */ export const GridAvatar = (_param)=>{
     var { src = [], size = GRID_AVATAR_DEFAULT_SIZE, className, children } = _param, restProps = _object_without_properties(_param, [
         "src",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/GridAvatar/GridAvatar.tsx"],"sourcesContent":["import { 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\nconst 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: React.FC<GridAvatarProps> & { Badge: typeof GridAvatarBadge } = ({\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.host, className)}>\n      <div className={styles.in} aria-hidden>\n        {src.map((url, index) =>\n          index < MAX_GRID_LENGTH ? (\n            <div key={index} className={styles.item} style={{ backgroundImage: `url(${url})` }} />\n          ) : null,\n        )}\n      </div>\n      {children}\n    </ImageBase>\n  );\n};\n\nGridAvatar.Badge = GridAvatarBadge;\n"],"names":["classNames","warnOnce","ImageBase","GridAvatarBadge","GRID_AVATAR_DEFAULT_SIZE","MAX_GRID_LENGTH","warn","GridAvatar","src","size","className","children","restProps","process","env","NODE_ENV","length","div","aria-hidden","map","url","index","style","backgroundImage","Badge"],"mappings":";;;;AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,QAAQ,QAAQ,wBAAqB;AAC9C,SAASC,SAAS,QAA6B,4BAAyB;AACxE,SAASC,eAAe,QAAmC,uCAAoC;AAK/F,MAAMC,2BAA2B;AAEjC,OAAO,MAAMC,kBAAkB,EAAE;AASjC,MAAMC,OAAOL,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMM,aAA4E;QAAC,EACxFC,MAAM,EAAE,EACRC,OAAOL,wBAAwB,EAC/BM,SAAS,EACTC,QAAQ,EAEQ,WADbC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAIE,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,IAAIP,IAAIQ,MAAM,GAAGX,iBAAiB;YAChCC,KAAK,CAAC,mBAAmB,EAAEE,IAAIQ,MAAM,CAAC,uBAAuB,EAAEX,gBAAgB,CAAC,CAAC,EAAE;QACrF;IACF;IAEA,qBACE,MAACH,mDAAcU;QAAWH,MAAMA;QAAMC,WAAWV,mCAAwBU;;0BACvE,KAACO;gBAAIP,SAAS;gBAAaQ,aAAW;0BACnCV,IAAIW,GAAG,CAAC,CAACC,KAAKC,QACbA,QAAQhB,gCACN,KAACY;wBAAgBP,SAAS;wBAAeY,OAAO;4BAAEC,iBAAiB,CAAC,IAAI,EAAEH,IAAI,CAAC,CAAC;wBAAC;uBAAvEC,SACR;;YAGPV;;;AAGP,EAAE;AAEFJ,WAAWiB,KAAK,GAAGrB"}
+{"version":3,"sources":["../../../src/components/GridAvatar/GridAvatar.tsx"],"sourcesContent":["import { 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\nconst 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://vkui.io/components/grid-avatar\n */\nexport const GridAvatar: React.FC<GridAvatarProps> & { Badge: typeof GridAvatarBadge } = ({\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.host, className)}>\n      <div className={styles.in} aria-hidden>\n        {src.map((url, index) =>\n          index < MAX_GRID_LENGTH ? (\n            <div key={index} className={styles.item} style={{ backgroundImage: `url(${url})` }} />\n          ) : null,\n        )}\n      </div>\n      {children}\n    </ImageBase>\n  );\n};\n\nGridAvatar.Badge = GridAvatarBadge;\n"],"names":["classNames","warnOnce","ImageBase","GridAvatarBadge","GRID_AVATAR_DEFAULT_SIZE","MAX_GRID_LENGTH","warn","GridAvatar","src","size","className","children","restProps","process","env","NODE_ENV","length","div","aria-hidden","map","url","index","style","backgroundImage","Badge"],"mappings":";;;;AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,QAAQ,QAAQ,wBAAqB;AAC9C,SAASC,SAAS,QAA6B,4BAAyB;AACxE,SAASC,eAAe,QAAmC,uCAAoC;AAK/F,MAAMC,2BAA2B;AAEjC,OAAO,MAAMC,kBAAkB,EAAE;AASjC,MAAMC,OAAOL,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMM,aAA4E;QAAC,EACxFC,MAAM,EAAE,EACRC,OAAOL,wBAAwB,EAC/BM,SAAS,EACTC,QAAQ,EAEQ,WADbC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAIE,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,IAAIP,IAAIQ,MAAM,GAAGX,iBAAiB;YAChCC,KAAK,CAAC,mBAAmB,EAAEE,IAAIQ,MAAM,CAAC,uBAAuB,EAAEX,gBAAgB,CAAC,CAAC,EAAE;QACrF;IACF;IAEA,qBACE,MAACH,mDAAcU;QAAWH,MAAMA;QAAMC,WAAWV,mCAAwBU;;0BACvE,KAACO;gBAAIP,SAAS;gBAAaQ,aAAW;0BACnCV,IAAIW,GAAG,CAAC,CAACC,KAAKC,QACbA,QAAQhB,gCACN,KAACY;wBAAgBP,SAAS;wBAAeY,OAAO;4BAAEC,iBAAiB,CAAC,IAAI,EAAEH,IAAI,CAAC,CAAC;wBAAC;uBAAvEC,SACR;;YAGPV;;;AAGP,EAAE;AAEFJ,WAAWiB,KAAK,GAAGrB"}

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

@@ -14,7 +14,7 @@ export interface GroupProps extends GroupContainerProps {
     description?: React.ReactNode;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/Group
+ * @see https://vkui.io/components/group
  */
 export declare const Group: React.FC<GroupProps> & {
     Container: typeof GroupContainer;

package/dist/components/Group/Group.js

@@ -10,7 +10,7 @@ import { GroupDescription } from "./GroupDescription.js";
 import { GroupExpandedContent } from "./GroupExpandedContent.js";
 import { GroupHeader } from "./GroupHeader.js";
 /**
- * @see https://vkcom.github.io/VKUI/#/Group
+ * @see https://vkui.io/components/group
  */ export const Group = (_param)=>{
     var { header, description, children } = _param, restProps = _object_without_properties(_param, [
         "header",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Group/Group.tsx"],"sourcesContent":["import * as React from 'react';\nimport { hasReactNode } from '@vkontakte/vkjs';\nimport { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';\nimport { GroupContainer, type GroupContainerProps } from './GroupContainer';\nimport { GroupDescription } from './GroupDescription';\nimport { GroupExpandedContent } from './GroupExpandedContent';\nimport { GroupHeader } from './GroupHeader';\n\nexport interface GroupProps extends GroupContainerProps {\n  /**\n   * Элемент заголовка группы.\n   */\n  header?: React.ReactNode;\n  /**\n   * Подпись под содержимым.\n   */\n  description?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Group\n */\nexport const Group: React.FC<GroupProps> & {\n  Container: typeof GroupContainer;\n  Header: typeof GroupHeader;\n  Description: typeof GroupDescription;\n  ExpandedContent: typeof GroupExpandedContent;\n} = ({ header, description, children, ...restProps }: GroupProps): React.ReactNode => {\n  return (\n    <GroupContainer {...restProps}>\n      {hasReactNode(header) && <GroupHeader>{header}</GroupHeader>}\n      {children}\n      {hasReactNode(description) && <GroupDescription>{description}</GroupDescription>}\n    </GroupContainer>\n  );\n};\n\nGroup.Container = GroupContainer;\nGroup.Header = GroupHeader;\nGroup.Description = GroupDescription;\nGroup.ExpandedContent = GroupExpandedContent;\n\nif (process.env.NODE_ENV !== 'production') {\n  defineComponentDisplayNames(Group.Container, 'Group.Container');\n  defineComponentDisplayNames(Group.Header, 'Group.Header');\n  defineComponentDisplayNames(Group.Description, 'Group.Description');\n  defineComponentDisplayNames(Group.ExpandedContent, 'Group.ExpandedContent');\n}\n"],"names":["React","hasReactNode","defineComponentDisplayNames","GroupContainer","GroupDescription","GroupExpandedContent","GroupHeader","Group","header","description","children","restProps","Container","Header","Description","ExpandedContent","process","env","NODE_ENV"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,kBAAkB;AAC/C,SAASC,2BAA2B,QAAQ,iDAA8C;AAC1F,SAASC,cAAc,QAAkC,sBAAmB;AAC5E,SAASC,gBAAgB,QAAQ,wBAAqB;AACtD,SAASC,oBAAoB,QAAQ,4BAAyB;AAC9D,SAASC,WAAW,QAAQ,mBAAgB;AAa5C;;CAEC,GACD,OAAO,MAAMC,QAKT;QAAC,EAAEC,MAAM,EAAEC,WAAW,EAAEC,QAAQ,EAA4B,WAAvBC;QAAlCH;QAAQC;QAAaC;;IAC1B,qBACE,MAACP,wDAAmBQ;;YACjBV,aAAaO,yBAAW,KAACF;0BAAaE;;YACtCE;YACAT,aAAaQ,8BAAgB,KAACL;0BAAkBK;;;;AAGvD,EAAE;AAEFF,MAAMK,SAAS,GAAGT;AAClBI,MAAMM,MAAM,GAAGP;AACfC,MAAMO,WAAW,GAAGV;AACpBG,MAAMQ,eAAe,GAAGV;AAExB,IAAIW,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;IACzChB,4BAA4BK,MAAMK,SAAS,EAAE;IAC7CV,4BAA4BK,MAAMM,MAAM,EAAE;IAC1CX,4BAA4BK,MAAMO,WAAW,EAAE;IAC/CZ,4BAA4BK,MAAMQ,eAAe,EAAE;AACrD"}
+{"version":3,"sources":["../../../src/components/Group/Group.tsx"],"sourcesContent":["import * as React from 'react';\nimport { hasReactNode } from '@vkontakte/vkjs';\nimport { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';\nimport { GroupContainer, type GroupContainerProps } from './GroupContainer';\nimport { GroupDescription } from './GroupDescription';\nimport { GroupExpandedContent } from './GroupExpandedContent';\nimport { GroupHeader } from './GroupHeader';\n\nexport interface GroupProps extends GroupContainerProps {\n  /**\n   * Элемент заголовка группы.\n   */\n  header?: React.ReactNode;\n  /**\n   * Подпись под содержимым.\n   */\n  description?: React.ReactNode;\n}\n\n/**\n * @see https://vkui.io/components/group\n */\nexport const Group: React.FC<GroupProps> & {\n  Container: typeof GroupContainer;\n  Header: typeof GroupHeader;\n  Description: typeof GroupDescription;\n  ExpandedContent: typeof GroupExpandedContent;\n} = ({ header, description, children, ...restProps }: GroupProps): React.ReactNode => {\n  return (\n    <GroupContainer {...restProps}>\n      {hasReactNode(header) && <GroupHeader>{header}</GroupHeader>}\n      {children}\n      {hasReactNode(description) && <GroupDescription>{description}</GroupDescription>}\n    </GroupContainer>\n  );\n};\n\nGroup.Container = GroupContainer;\nGroup.Header = GroupHeader;\nGroup.Description = GroupDescription;\nGroup.ExpandedContent = GroupExpandedContent;\n\nif (process.env.NODE_ENV !== 'production') {\n  defineComponentDisplayNames(Group.Container, 'Group.Container');\n  defineComponentDisplayNames(Group.Header, 'Group.Header');\n  defineComponentDisplayNames(Group.Description, 'Group.Description');\n  defineComponentDisplayNames(Group.ExpandedContent, 'Group.ExpandedContent');\n}\n"],"names":["React","hasReactNode","defineComponentDisplayNames","GroupContainer","GroupDescription","GroupExpandedContent","GroupHeader","Group","header","description","children","restProps","Container","Header","Description","ExpandedContent","process","env","NODE_ENV"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,kBAAkB;AAC/C,SAASC,2BAA2B,QAAQ,iDAA8C;AAC1F,SAASC,cAAc,QAAkC,sBAAmB;AAC5E,SAASC,gBAAgB,QAAQ,wBAAqB;AACtD,SAASC,oBAAoB,QAAQ,4BAAyB;AAC9D,SAASC,WAAW,QAAQ,mBAAgB;AAa5C;;CAEC,GACD,OAAO,MAAMC,QAKT;QAAC,EAAEC,MAAM,EAAEC,WAAW,EAAEC,QAAQ,EAA4B,WAAvBC;QAAlCH;QAAQC;QAAaC;;IAC1B,qBACE,MAACP,wDAAmBQ;;YACjBV,aAAaO,yBAAW,KAACF;0BAAaE;;YACtCE;YACAT,aAAaQ,8BAAgB,KAACL;0BAAkBK;;;;AAGvD,EAAE;AAEFF,MAAMK,SAAS,GAAGT;AAClBI,MAAMM,MAAM,GAAGP;AACfC,MAAMO,WAAW,GAAGV;AACpBG,MAAMQ,eAAe,GAAGV;AAExB,IAAIW,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;IACzChB,4BAA4BK,MAAMK,SAAS,EAAE;IAC7CV,4BAA4BK,MAAMM,MAAM,EAAE;IAC1CX,4BAA4BK,MAAMO,WAAW,EAAE;IAC/CZ,4BAA4BK,MAAMQ,eAAe,EAAE;AACrD"}

package/dist/components/Header/Header.d.ts

@@ -47,7 +47,7 @@ export interface HeaderProps extends HTMLAttributesWithRootRef<HTMLElement>, Has
     afterSubtitle?: React.ReactNode;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/Header
+ * @see https://vkui.io/components/group#header
  */
 export declare const Header: ({ size, Component, children, subtitle, subtitleComponent, indicator, after, multiline, before, beforeTitle, afterTitle, beforeSubtitle, afterSubtitle, ...restProps }: HeaderProps) => React.ReactNode;
 //# sourceMappingURL=Header.d.ts.map

package/dist/components/Header/Header.js

@@ -52,7 +52,7 @@ const Subtitle = ({ subtitleComponent, children, multiline, size })=>{
     });
 };
 /**
- * @see https://vkcom.github.io/VKUI/#/Header
+ * @see https://vkui.io/components/group#header
  */ export const Header = (_param)=>{
     var { size = 'm', Component = 'h2', children, subtitle, subtitleComponent = 'span', indicator, after, multiline, before, beforeTitle, afterTitle, beforeSubtitle, afterSubtitle } = _param, restProps = _object_without_properties(_param, [
         "size",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Header/Header.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, hasReactNode, isPrimitiveReactNode } from '@vkontakte/vkjs';\nimport type { HasComponent, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Header.module.css';\n\nexport interface HeaderProps extends HTMLAttributesWithRootRef<HTMLElement>, HasComponent {\n  /**\n   * Размер компонента.\n   */\n  size?: 's' | 'm' | 'l' | 'xl';\n  /**\n   * Подпись под основным текстом.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Позволяет задать тип элемента в который будет обёрнут subtitle.\n   */\n  subtitleComponent?: React.ElementType;\n  /**\n   * Допускаются иконки, текст, Link.\n   */\n  after?: React.ReactNode;\n  /**\n   * Допускаются текст, Indicator.\n   */\n  indicator?: React.ReactNode;\n  /**\n   * Возможность отображения текста в несколько строк.\n   */\n  multiline?: boolean;\n  /**\n   * Иконка слева (рекомендуется использовать размер 28px).\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка слева от title (рекомендуется использовать размер 16px).\n   */\n  beforeTitle?: React.ReactNode;\n  /**\n   * Иконка справа от title (рекомендуется использовать размер 16px).\n   */\n  afterTitle?: React.ReactNode;\n  /**\n   * Иконка слева от subtitle (рекомендуется использовать размер 12px).\n   */\n  beforeSubtitle?: React.ReactNode;\n  /**\n   * Иконка справа от subtitle (рекомендуется использовать размер 12px).\n   */\n  afterSubtitle?: React.ReactNode;\n}\n\nconst sizeClassNames: Record<Exclude<HeaderProps['size'], undefined>, string> = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n  l: styles.sizeL,\n  xl: styles.sizeXl,\n};\n\ntype HeaderContentProps = Pick<HeaderProps, 'children' | 'size' | 'className'> & HasComponent;\n\nconst HeaderContent = ({ size, ...restProps }: HeaderContentProps) => {\n  switch (size) {\n    case 'xl':\n      return <Title level=\"2\" weight=\"1\" {...restProps} />;\n    case 'l':\n      return <Title level=\"3\" weight=\"1\" {...restProps} />;\n    case 'm':\n      return <Headline {...restProps} />;\n    case 's':\n      return <Footnote caps weight=\"1\" {...restProps} />;\n  }\n\n  return null;\n};\n\nconst Subtitle: React.FC<\n  Pick<HeaderProps, 'multiline' | 'subtitleComponent' | 'size'> & { children: React.ReactNode }\n> = ({ subtitleComponent, children, multiline, size }) => {\n  const SubtitleElement = size === 'm' || size === 's' ? Caption : Subhead;\n  return (\n    <SubtitleElement\n      className={classNames(styles.subtitle, multiline && styles.contentMultiline)}\n      Component={subtitleComponent}\n    >\n      {children}\n    </SubtitleElement>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Header\n */\nexport const Header = ({\n  size = 'm',\n  Component = 'h2',\n  children,\n  subtitle,\n  subtitleComponent = 'span',\n  indicator,\n  after,\n  multiline,\n  before,\n  beforeTitle,\n  afterTitle,\n  beforeSubtitle,\n  afterSubtitle,\n  ...restProps\n}: HeaderProps): React.ReactNode => {\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        sizeClassNames[size],\n        isPrimitiveReactNode(indicator) && styles.pi,\n      )}\n    >\n      {before && (\n        <div className={classNames(styles.before, subtitle && styles.beforeWithSubtitle)}>\n          {before}\n        </div>\n      )}\n      <div className={styles.main}>\n        <HeaderContent className={styles.content} Component={Component} size={size}>\n          {beforeTitle && <div className={styles.contentBefore}>{beforeTitle}</div>}\n          <span className={classNames(styles.contentIn, multiline && styles.contentMultiline)}>\n            {children}\n          </span>\n          {afterTitle && <div className={styles.contentAfter}>{afterTitle}</div>}\n          {hasReactNode(indicator) && (\n            <Footnote className={styles.indicator} weight=\"2\">\n              {indicator}\n            </Footnote>\n          )}\n        </HeaderContent>\n        {hasReactNode(subtitle) && (\n          <div className={styles.subtitleWrapper}>\n            {beforeSubtitle && <div className={styles.subtitleBefore}>{beforeSubtitle}</div>}\n            <Subtitle multiline={multiline} subtitleComponent={subtitleComponent} size={size}>\n              {subtitle}\n            </Subtitle>\n            {afterSubtitle && <div className={styles.subtitleAfter}>{afterSubtitle}</div>}\n          </div>\n        )}\n      </div>\n\n      {hasReactNode(after) && (\n        <Paragraph className={styles.after} Component=\"span\">\n          {after}\n        </Paragraph>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","hasReactNode","isPrimitiveReactNode","RootComponent","Caption","Footnote","Headline","Paragraph","Subhead","Title","sizeClassNames","s","m","l","xl","HeaderContent","size","restProps","level","weight","caps","Subtitle","subtitleComponent","children","multiline","SubtitleElement","className","Component","Header","subtitle","indicator","after","before","beforeTitle","afterTitle","beforeSubtitle","afterSubtitle","baseClassName","div","span"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,EAAEC,oBAAoB,QAAQ,kBAAkB;AAEjF,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,SAAS,QAAQ,uCAAoC;AAC9D,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,KAAK,QAAQ,+BAA4B;AAkDlD,MAAMC,iBAA0E;IAC9EC,CAAC;IACDC,CAAC;IACDC,CAAC;IACDC,EAAE;AACJ;AAIA,MAAMC,gBAAgB;QAAC,EAAEC,IAAI,EAAoC,WAA/BC;QAATD;;IACvB,OAAQA;QACN,KAAK;YACH,qBAAO,KAACP;gBAAMS,OAAM;gBAAIC,QAAO;eAAQF;QACzC,KAAK;YACH,qBAAO,KAACR;gBAAMS,OAAM;gBAAIC,QAAO;eAAQF;QACzC,KAAK;YACH,qBAAO,KAACX,6BAAaW;QACvB,KAAK;YACH,qBAAO,KAACZ;gBAASe,IAAI;gBAACD,QAAO;eAAQF;IACzC;IAEA,OAAO;AACT;AAEA,MAAMI,WAEF,CAAC,EAAEC,iBAAiB,EAAEC,QAAQ,EAAEC,SAAS,EAAER,IAAI,EAAE;IACnD,MAAMS,kBAAkBT,SAAS,OAAOA,SAAS,MAAMZ,UAAUI;IACjE,qBACE,KAACiB;QACCC,WAAW1B,mCAA4BwB;QACvCG,WAAWL;kBAEVC;;AAGP;AAEA;;CAEC,GACD,OAAO,MAAMK,SAAS;QAAC,EACrBZ,OAAO,GAAG,EACVW,YAAY,IAAI,EAChBJ,QAAQ,EACRM,QAAQ,EACRP,oBAAoB,MAAM,EAC1BQ,SAAS,EACTC,KAAK,EACLP,SAAS,EACTQ,MAAM,EACNC,WAAW,EACXC,UAAU,EACVC,cAAc,EACdC,aAAa,EAED,WADTnB;QAbHD;QACAW;QACAJ;QACAM;QACAP;QACAQ;QACAC;QACAP;QACAQ;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,MAACjC,uDACKc;QACJoB,eAAerC,+BAEbU,cAAc,CAACM,KAAK,EACpBd,qBAAqB4B;;YAGtBE,wBACC,KAACM;gBAAIZ,WAAW1B,iCAA0B6B;0BACvCG;;0BAGL,MAACM;gBAAIZ,SAAS;;kCACZ,MAACX;wBAAcW,SAAS;wBAAkBC,WAAWA;wBAAWX,MAAMA;;4BACnEiB,6BAAe,KAACK;gCAAIZ,SAAS;0CAAyBO;;0CACvD,KAACM;gCAAKb,WAAW1B,oCAA6BwB;0CAC3CD;;4BAEFW,4BAAc,KAACI;gCAAIZ,SAAS;0CAAwBQ;;4BACpDjC,aAAa6B,4BACZ,KAACzB;gCAASqB,SAAS;gCAAoBP,QAAO;0CAC3CW;;;;oBAIN7B,aAAa4B,2BACZ,MAACS;wBAAIZ,SAAS;;4BACXS,gCAAkB,KAACG;gCAAIZ,SAAS;0CAA0BS;;0CAC3D,KAACd;gCAASG,WAAWA;gCAAWF,mBAAmBA;gCAAmBN,MAAMA;0CACzEa;;4BAEFO,+BAAiB,KAACE;gCAAIZ,SAAS;0CAAyBU;;;;;;YAK9DnC,aAAa8B,wBACZ,KAACxB;gBAAUmB,SAAS;gBAAgBC,WAAU;0BAC3CI;;;;AAKX,EAAE"}
+{"version":3,"sources":["../../../src/components/Header/Header.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, hasReactNode, isPrimitiveReactNode } from '@vkontakte/vkjs';\nimport type { HasComponent, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Header.module.css';\n\nexport interface HeaderProps extends HTMLAttributesWithRootRef<HTMLElement>, HasComponent {\n  /**\n   * Размер компонента.\n   */\n  size?: 's' | 'm' | 'l' | 'xl';\n  /**\n   * Подпись под основным текстом.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Позволяет задать тип элемента в который будет обёрнут subtitle.\n   */\n  subtitleComponent?: React.ElementType;\n  /**\n   * Допускаются иконки, текст, Link.\n   */\n  after?: React.ReactNode;\n  /**\n   * Допускаются текст, Indicator.\n   */\n  indicator?: React.ReactNode;\n  /**\n   * Возможность отображения текста в несколько строк.\n   */\n  multiline?: boolean;\n  /**\n   * Иконка слева (рекомендуется использовать размер 28px).\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка слева от title (рекомендуется использовать размер 16px).\n   */\n  beforeTitle?: React.ReactNode;\n  /**\n   * Иконка справа от title (рекомендуется использовать размер 16px).\n   */\n  afterTitle?: React.ReactNode;\n  /**\n   * Иконка слева от subtitle (рекомендуется использовать размер 12px).\n   */\n  beforeSubtitle?: React.ReactNode;\n  /**\n   * Иконка справа от subtitle (рекомендуется использовать размер 12px).\n   */\n  afterSubtitle?: React.ReactNode;\n}\n\nconst sizeClassNames: Record<Exclude<HeaderProps['size'], undefined>, string> = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n  l: styles.sizeL,\n  xl: styles.sizeXl,\n};\n\ntype HeaderContentProps = Pick<HeaderProps, 'children' | 'size' | 'className'> & HasComponent;\n\nconst HeaderContent = ({ size, ...restProps }: HeaderContentProps) => {\n  switch (size) {\n    case 'xl':\n      return <Title level=\"2\" weight=\"1\" {...restProps} />;\n    case 'l':\n      return <Title level=\"3\" weight=\"1\" {...restProps} />;\n    case 'm':\n      return <Headline {...restProps} />;\n    case 's':\n      return <Footnote caps weight=\"1\" {...restProps} />;\n  }\n\n  return null;\n};\n\nconst Subtitle: React.FC<\n  Pick<HeaderProps, 'multiline' | 'subtitleComponent' | 'size'> & { children: React.ReactNode }\n> = ({ subtitleComponent, children, multiline, size }) => {\n  const SubtitleElement = size === 'm' || size === 's' ? Caption : Subhead;\n  return (\n    <SubtitleElement\n      className={classNames(styles.subtitle, multiline && styles.contentMultiline)}\n      Component={subtitleComponent}\n    >\n      {children}\n    </SubtitleElement>\n  );\n};\n\n/**\n * @see https://vkui.io/components/group#header\n */\nexport const Header = ({\n  size = 'm',\n  Component = 'h2',\n  children,\n  subtitle,\n  subtitleComponent = 'span',\n  indicator,\n  after,\n  multiline,\n  before,\n  beforeTitle,\n  afterTitle,\n  beforeSubtitle,\n  afterSubtitle,\n  ...restProps\n}: HeaderProps): React.ReactNode => {\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        sizeClassNames[size],\n        isPrimitiveReactNode(indicator) && styles.pi,\n      )}\n    >\n      {before && (\n        <div className={classNames(styles.before, subtitle && styles.beforeWithSubtitle)}>\n          {before}\n        </div>\n      )}\n      <div className={styles.main}>\n        <HeaderContent className={styles.content} Component={Component} size={size}>\n          {beforeTitle && <div className={styles.contentBefore}>{beforeTitle}</div>}\n          <span className={classNames(styles.contentIn, multiline && styles.contentMultiline)}>\n            {children}\n          </span>\n          {afterTitle && <div className={styles.contentAfter}>{afterTitle}</div>}\n          {hasReactNode(indicator) && (\n            <Footnote className={styles.indicator} weight=\"2\">\n              {indicator}\n            </Footnote>\n          )}\n        </HeaderContent>\n        {hasReactNode(subtitle) && (\n          <div className={styles.subtitleWrapper}>\n            {beforeSubtitle && <div className={styles.subtitleBefore}>{beforeSubtitle}</div>}\n            <Subtitle multiline={multiline} subtitleComponent={subtitleComponent} size={size}>\n              {subtitle}\n            </Subtitle>\n            {afterSubtitle && <div className={styles.subtitleAfter}>{afterSubtitle}</div>}\n          </div>\n        )}\n      </div>\n\n      {hasReactNode(after) && (\n        <Paragraph className={styles.after} Component=\"span\">\n          {after}\n        </Paragraph>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","hasReactNode","isPrimitiveReactNode","RootComponent","Caption","Footnote","Headline","Paragraph","Subhead","Title","sizeClassNames","s","m","l","xl","HeaderContent","size","restProps","level","weight","caps","Subtitle","subtitleComponent","children","multiline","SubtitleElement","className","Component","Header","subtitle","indicator","after","before","beforeTitle","afterTitle","beforeSubtitle","afterSubtitle","baseClassName","div","span"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,EAAEC,oBAAoB,QAAQ,kBAAkB;AAEjF,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,SAAS,QAAQ,uCAAoC;AAC9D,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,KAAK,QAAQ,+BAA4B;AAkDlD,MAAMC,iBAA0E;IAC9EC,CAAC;IACDC,CAAC;IACDC,CAAC;IACDC,EAAE;AACJ;AAIA,MAAMC,gBAAgB;QAAC,EAAEC,IAAI,EAAoC,WAA/BC;QAATD;;IACvB,OAAQA;QACN,KAAK;YACH,qBAAO,KAACP;gBAAMS,OAAM;gBAAIC,QAAO;eAAQF;QACzC,KAAK;YACH,qBAAO,KAACR;gBAAMS,OAAM;gBAAIC,QAAO;eAAQF;QACzC,KAAK;YACH,qBAAO,KAACX,6BAAaW;QACvB,KAAK;YACH,qBAAO,KAACZ;gBAASe,IAAI;gBAACD,QAAO;eAAQF;IACzC;IAEA,OAAO;AACT;AAEA,MAAMI,WAEF,CAAC,EAAEC,iBAAiB,EAAEC,QAAQ,EAAEC,SAAS,EAAER,IAAI,EAAE;IACnD,MAAMS,kBAAkBT,SAAS,OAAOA,SAAS,MAAMZ,UAAUI;IACjE,qBACE,KAACiB;QACCC,WAAW1B,mCAA4BwB;QACvCG,WAAWL;kBAEVC;;AAGP;AAEA;;CAEC,GACD,OAAO,MAAMK,SAAS;QAAC,EACrBZ,OAAO,GAAG,EACVW,YAAY,IAAI,EAChBJ,QAAQ,EACRM,QAAQ,EACRP,oBAAoB,MAAM,EAC1BQ,SAAS,EACTC,KAAK,EACLP,SAAS,EACTQ,MAAM,EACNC,WAAW,EACXC,UAAU,EACVC,cAAc,EACdC,aAAa,EAED,WADTnB;QAbHD;QACAW;QACAJ;QACAM;QACAP;QACAQ;QACAC;QACAP;QACAQ;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,MAACjC,uDACKc;QACJoB,eAAerC,+BAEbU,cAAc,CAACM,KAAK,EACpBd,qBAAqB4B;;YAGtBE,wBACC,KAACM;gBAAIZ,WAAW1B,iCAA0B6B;0BACvCG;;0BAGL,MAACM;gBAAIZ,SAAS;;kCACZ,MAACX;wBAAcW,SAAS;wBAAkBC,WAAWA;wBAAWX,MAAMA;;4BACnEiB,6BAAe,KAACK;gCAAIZ,SAAS;0CAAyBO;;0CACvD,KAACM;gCAAKb,WAAW1B,oCAA6BwB;0CAC3CD;;4BAEFW,4BAAc,KAACI;gCAAIZ,SAAS;0CAAwBQ;;4BACpDjC,aAAa6B,4BACZ,KAACzB;gCAASqB,SAAS;gCAAoBP,QAAO;0CAC3CW;;;;oBAIN7B,aAAa4B,2BACZ,MAACS;wBAAIZ,SAAS;;4BACXS,gCAAkB,KAACG;gCAAIZ,SAAS;0CAA0BS;;0CAC3D,KAACd;gCAASG,WAAWA;gCAAWF,mBAAmBA;gCAAmBN,MAAMA;0CACzEa;;4BAEFO,+BAAiB,KAACE;gCAAIZ,SAAS;0CAAyBU;;;;;;YAK9DnC,aAAa8B,wBACZ,KAACxB;gBAAUmB,SAAS;gBAAgBC,WAAU;0BAC3CI;;;;AAKX,EAAE"}

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

@@ -41,7 +41,7 @@ export interface HorizontalCellProps extends Omit<TappableOmitProps, 'size' | 'g
     TitleComponent?: React.ElementType;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/HorizontalCell
+ * @see https://vkui.io/components/horizontal-cell
  */
 export declare const HorizontalCell: ({ className, title, style, subtitle, size, children, getRootRef, getRef, extraSubtitle, textAlign, noPadding, TitleComponent, ...restProps }: HorizontalCellProps) => React.ReactNode;
 export {};

package/dist/components/HorizontalCell/HorizontalCell.js

@@ -23,7 +23,7 @@ const textAlignClassNames = {
     end: "vkuiHorizontalCell__textAlignEnd"
 };
 /**
- * @see https://vkcom.github.io/VKUI/#/HorizontalCell
+ * @see https://vkui.io/components/horizontal-cell
  */ export const HorizontalCell = (_param)=>{
     var { className, title, style, subtitle, size = 's', children = /*#__PURE__*/ _jsx(Avatar, {
         size: 56

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/HorizontalCell/HorizontalCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { mergeStyle } from '../../helpers/mergeStyle';\nimport type { CSSCustomProperties, HasRef, HasRootRef, LiteralUnion } from '../../types';\nimport { Avatar } from '../Avatar/Avatar';\nimport { Tappable, type TappableOmitProps } 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\nexport const CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH = '--vkui_internal--cell_width';\n\nconst stylesSize = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n  l: styles.sizeL,\n  xl: styles.sizeXL,\n  auto: styles.sizeAuto,\n};\n\nconst textAlignClassNames = {\n  center: styles.textAlignCenter,\n  end: styles.textAlignEnd,\n};\n\ntype HorizontalCellSizes = 's' | 'm' | 'l' | 'xl' | 'auto';\n\nexport interface HorizontalCellProps\n  extends Omit<TappableOmitProps, 'size' | 'getRootRef' | 'title' | 'borderRadiusMode'>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Ширина компонента.\n   *\n   * Значения `'s' | 'm' | 'l' | 'xl'` определяются дизайн-системой.\n   * Значение `auto` позволяет задать динамическую ширину, определяемую контентом.\n   * Пользовательскую ширину можно задать через числовое значение.\n   */\n  size?: LiteralUnion<HorizontalCellSizes, number>;\n  /**\n   * Заголовок.\n   */\n  title?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  /**\n   * Задает выравнивание типографики. По умолчанию `center` для `size=s`, иначе `start`.\n   */\n  textAlign?: 'start' | 'center' | 'end';\n  /**\n   * Отключает формирование отступов у крайних элементов.\n   *\n   * Актуально для использования в многострочных списках.\n   */\n  noPadding?: boolean;\n  /**\n   * Позволяет передать типографический компонент, используемый для `title`.\n   * По умолчанию `Caption` для `size=s`, иначе `Subhead`.\n   */\n  TitleComponent?: React.ElementType;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalCell\n */\nexport const HorizontalCell = ({\n  className,\n  title,\n  style,\n  subtitle,\n  size = 's',\n  children = <Avatar size={56} />,\n  getRootRef,\n  getRef,\n  extraSubtitle,\n  textAlign = size === 's' ? 'center' : 'start',\n  noPadding = false,\n  TitleComponent = size === 's' ? Caption : Subhead,\n  ...restProps\n}: HorizontalCellProps): React.ReactNode => {\n  const hasTypography =\n    hasReactNode(title) || hasReactNode(subtitle) || hasReactNode(extraSubtitle);\n\n  const customProperties: CSSCustomProperties | undefined =\n    typeof size === 'number' ? { [CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH]: `${size}px` } : undefined;\n\n  return (\n    <div\n      ref={getRootRef}\n      style={mergeStyle(customProperties, style)}\n      className={classNames(\n        styles.host,\n        typeof size === 'string' && stylesSize[size],\n        size !== 'auto' && styles.sized,\n        typeof size === 'number' && styles.customSize,\n        noPadding && styles.noPadding,\n        className,\n      )}\n    >\n      <Tappable className={styles.body} getRootRef={getRef} {...restProps}>\n        {hasReactNode(children) && <div className={styles.image}>{children}</div>}\n        {hasTypography && (\n          <div\n            className={classNames(\n              styles.content,\n              textAlign !== 'start' && textAlignClassNames[textAlign],\n            )}\n          >\n            {hasReactNode(title) && <TitleComponent>{title}</TitleComponent>}\n            {hasReactNode(subtitle) && <Footnote className={styles.subtitle}>{subtitle}</Footnote>}\n            {hasReactNode(extraSubtitle) && (\n              <Footnote className={styles.subtitle}>{extraSubtitle}</Footnote>\n            )}\n          </div>\n        )}\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["React","classNames","hasReactNode","mergeStyle","Avatar","Tappable","Caption","Footnote","Subhead","CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH","stylesSize","s","m","l","xl","auto","textAlignClassNames","center","end","HorizontalCell","className","title","style","subtitle","size","children","getRootRef","getRef","extraSubtitle","textAlign","noPadding","TitleComponent","restProps","hasTypography","customProperties","undefined","div","ref"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,UAAU,QAAQ,8BAA2B;AAEtD,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,OAAO,QAAQ,mCAAgC;AAGxD,OAAO,MAAMC,kCAAkC,8BAA8B;AAE7E,MAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;IACDC,CAAC;IACDC,EAAE;IACFC,IAAI;AACN;AAEA,MAAMC,sBAAsB;IAC1BC,MAAM;IACNC,GAAG;AACL;AA6CA;;CAEC,GACD,OAAO,MAAMC,iBAAiB;QAAC,EAC7BC,SAAS,EACTC,KAAK,EACLC,KAAK,EACLC,QAAQ,EACRC,OAAO,GAAG,EACVC,yBAAW,KAACrB;QAAOoB,MAAM;MAAM,EAC/BE,UAAU,EACVC,MAAM,EACNC,aAAa,EACbC,YAAYL,SAAS,MAAM,WAAW,OAAO,EAC7CM,YAAY,KAAK,EACjBC,iBAAiBP,SAAS,MAAMlB,UAAUE,OAAO,EAE7B,WADjBwB;QAZHZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,gBACJ/B,aAAamB,UAAUnB,aAAaqB,aAAarB,aAAa0B;IAEhE,MAAMM,mBACJ,OAAOV,SAAS,WAAW;QAAE,CAACf,gCAAgC,EAAE,GAAGe,KAAK,EAAE,CAAC;IAAC,IAAIW;IAElF,qBACE,KAACC;QACCC,KAAKX;QACLJ,OAAOnB,WAAW+B,kBAAkBZ;QACpCF,WAAWnB,uCAET,OAAOuB,SAAS,YAAYd,UAAU,CAACc,KAAK,EAC5CA,SAAS,uCACT,OAAOA,SAAS,8CAChBM,8CACAV;kBAGF,cAAA,MAACf;YAASe,SAAS;YAAeM,YAAYC;WAAYK;;gBACvD9B,aAAauB,2BAAa,KAACW;oBAAIhB,SAAS;8BAAiBK;;gBACzDQ,+BACC,MAACG;oBACChB,WAAWnB,0CAET4B,cAAc,WAAWb,mBAAmB,CAACa,UAAU;;wBAGxD3B,aAAamB,wBAAU,KAACU;sCAAgBV;;wBACxCnB,aAAaqB,2BAAa,KAAChB;4BAASa,SAAS;sCAAoBG;;wBACjErB,aAAa0B,gCACZ,KAACrB;4BAASa,SAAS;sCAAoBQ;;;;;;;AAOrD,EAAE"}
+{"version":3,"sources":["../../../src/components/HorizontalCell/HorizontalCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { mergeStyle } from '../../helpers/mergeStyle';\nimport type { CSSCustomProperties, HasRef, HasRootRef, LiteralUnion } from '../../types';\nimport { Avatar } from '../Avatar/Avatar';\nimport { Tappable, type TappableOmitProps } 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\nexport const CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH = '--vkui_internal--cell_width';\n\nconst stylesSize = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n  l: styles.sizeL,\n  xl: styles.sizeXL,\n  auto: styles.sizeAuto,\n};\n\nconst textAlignClassNames = {\n  center: styles.textAlignCenter,\n  end: styles.textAlignEnd,\n};\n\ntype HorizontalCellSizes = 's' | 'm' | 'l' | 'xl' | 'auto';\n\nexport interface HorizontalCellProps\n  extends Omit<TappableOmitProps, 'size' | 'getRootRef' | 'title' | 'borderRadiusMode'>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Ширина компонента.\n   *\n   * Значения `'s' | 'm' | 'l' | 'xl'` определяются дизайн-системой.\n   * Значение `auto` позволяет задать динамическую ширину, определяемую контентом.\n   * Пользовательскую ширину можно задать через числовое значение.\n   */\n  size?: LiteralUnion<HorizontalCellSizes, number>;\n  /**\n   * Заголовок.\n   */\n  title?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  /**\n   * Задает выравнивание типографики. По умолчанию `center` для `size=s`, иначе `start`.\n   */\n  textAlign?: 'start' | 'center' | 'end';\n  /**\n   * Отключает формирование отступов у крайних элементов.\n   *\n   * Актуально для использования в многострочных списках.\n   */\n  noPadding?: boolean;\n  /**\n   * Позволяет передать типографический компонент, используемый для `title`.\n   * По умолчанию `Caption` для `size=s`, иначе `Subhead`.\n   */\n  TitleComponent?: React.ElementType;\n}\n\n/**\n * @see https://vkui.io/components/horizontal-cell\n */\nexport const HorizontalCell = ({\n  className,\n  title,\n  style,\n  subtitle,\n  size = 's',\n  children = <Avatar size={56} />,\n  getRootRef,\n  getRef,\n  extraSubtitle,\n  textAlign = size === 's' ? 'center' : 'start',\n  noPadding = false,\n  TitleComponent = size === 's' ? Caption : Subhead,\n  ...restProps\n}: HorizontalCellProps): React.ReactNode => {\n  const hasTypography =\n    hasReactNode(title) || hasReactNode(subtitle) || hasReactNode(extraSubtitle);\n\n  const customProperties: CSSCustomProperties | undefined =\n    typeof size === 'number' ? { [CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH]: `${size}px` } : undefined;\n\n  return (\n    <div\n      ref={getRootRef}\n      style={mergeStyle(customProperties, style)}\n      className={classNames(\n        styles.host,\n        typeof size === 'string' && stylesSize[size],\n        size !== 'auto' && styles.sized,\n        typeof size === 'number' && styles.customSize,\n        noPadding && styles.noPadding,\n        className,\n      )}\n    >\n      <Tappable className={styles.body} getRootRef={getRef} {...restProps}>\n        {hasReactNode(children) && <div className={styles.image}>{children}</div>}\n        {hasTypography && (\n          <div\n            className={classNames(\n              styles.content,\n              textAlign !== 'start' && textAlignClassNames[textAlign],\n            )}\n          >\n            {hasReactNode(title) && <TitleComponent>{title}</TitleComponent>}\n            {hasReactNode(subtitle) && <Footnote className={styles.subtitle}>{subtitle}</Footnote>}\n            {hasReactNode(extraSubtitle) && (\n              <Footnote className={styles.subtitle}>{extraSubtitle}</Footnote>\n            )}\n          </div>\n        )}\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["React","classNames","hasReactNode","mergeStyle","Avatar","Tappable","Caption","Footnote","Subhead","CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH","stylesSize","s","m","l","xl","auto","textAlignClassNames","center","end","HorizontalCell","className","title","style","subtitle","size","children","getRootRef","getRef","extraSubtitle","textAlign","noPadding","TitleComponent","restProps","hasTypography","customProperties","undefined","div","ref"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,UAAU,QAAQ,8BAA2B;AAEtD,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,OAAO,QAAQ,mCAAgC;AAGxD,OAAO,MAAMC,kCAAkC,8BAA8B;AAE7E,MAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;IACDC,CAAC;IACDC,EAAE;IACFC,IAAI;AACN;AAEA,MAAMC,sBAAsB;IAC1BC,MAAM;IACNC,GAAG;AACL;AA6CA;;CAEC,GACD,OAAO,MAAMC,iBAAiB;QAAC,EAC7BC,SAAS,EACTC,KAAK,EACLC,KAAK,EACLC,QAAQ,EACRC,OAAO,GAAG,EACVC,yBAAW,KAACrB;QAAOoB,MAAM;MAAM,EAC/BE,UAAU,EACVC,MAAM,EACNC,aAAa,EACbC,YAAYL,SAAS,MAAM,WAAW,OAAO,EAC7CM,YAAY,KAAK,EACjBC,iBAAiBP,SAAS,MAAMlB,UAAUE,OAAO,EAE7B,WADjBwB;QAZHZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,gBACJ/B,aAAamB,UAAUnB,aAAaqB,aAAarB,aAAa0B;IAEhE,MAAMM,mBACJ,OAAOV,SAAS,WAAW;QAAE,CAACf,gCAAgC,EAAE,GAAGe,KAAK,EAAE,CAAC;IAAC,IAAIW;IAElF,qBACE,KAACC;QACCC,KAAKX;QACLJ,OAAOnB,WAAW+B,kBAAkBZ;QACpCF,WAAWnB,uCAET,OAAOuB,SAAS,YAAYd,UAAU,CAACc,KAAK,EAC5CA,SAAS,uCACT,OAAOA,SAAS,8CAChBM,8CACAV;kBAGF,cAAA,MAACf;YAASe,SAAS;YAAeM,YAAYC;WAAYK;;gBACvD9B,aAAauB,2BAAa,KAACW;oBAAIhB,SAAS;8BAAiBK;;gBACzDQ,+BACC,MAACG;oBACChB,WAAWnB,0CAET4B,cAAc,WAAWb,mBAAmB,CAACa,UAAU;;wBAGxD3B,aAAamB,wBAAU,KAACU;sCAAgBV;;wBACxCnB,aAAaqB,2BAAa,KAAChB;4BAASa,SAAS;sCAAoBG;;wBACjErB,aAAa0B,gCACZ,KAACrB;4BAASa,SAAS;sCAAoBQ;;;;;;;AAOrD,EAAE"}

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

@@ -30,5 +30,8 @@ export interface HorizontalCellShowMoreProps extends Omit<TappableOmitProps, 'ge
      */
     centered?: boolean;
 }
+/**
+ * @see https://vkui.io/components/horizontal-scroll#horizontal-cell-show-more
+ */
 export declare const HorizontalCellShowMore: ({ className, style, getRef, getRootRef, height, size, children, centered, ...restProps }: HorizontalCellShowMoreProps) => React.ReactNode;
 //# sourceMappingURL=HorizontalCellShowMore.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCellShowMore.d.ts","sourceRoot":"","sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACvE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAY,KAAK,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAQ9E,MAAM,WAAW,2BACf,SAAQ,IAAI,CAAC,iBAAiB,EAAE,YAAY,GAAG,MAAM,GAAG,kBAAkB,CAAC,EACzE,MAAM,CAAC,WAAW,CAAC,EACnB,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC7C;;;;OAIG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB;;;SAGK;IACL,QAAQ,CAAC,EAAE,YAAY,CAAC,UAAU,CAAC,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,sBAAsB,GAAI,0FAUpC,2BAA2B,KAAG,KAAK,CAAC,SA4BtC,CAAC"}
+{"version":3,"file":"HorizontalCellShowMore.d.ts","sourceRoot":"","sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACvE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAY,KAAK,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAQ9E,MAAM,WAAW,2BACf,SAAQ,IAAI,CAAC,iBAAiB,EAAE,YAAY,GAAG,MAAM,GAAG,kBAAkB,CAAC,EACzE,MAAM,CAAC,WAAW,CAAC,EACnB,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC7C;;;;OAIG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB;;;SAGK;IACL,QAAQ,CAAC,EAAE,YAAY,CAAC,UAAU,CAAC,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,eAAO,MAAM,sBAAsB,GAAI,0FAUpC,2BAA2B,KAAG,KAAK,CAAC,SA4BtC,CAAC"}

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

@@ -10,7 +10,9 @@ const sizeClassNames = {
     s: "vkuiHorizontalCellShowMore__sizeS",
     m: "vkuiHorizontalCellShowMore__sizeM"
 };
-export const HorizontalCellShowMore = (_param)=>{
+/**
+ * @see https://vkui.io/components/horizontal-scroll#horizontal-cell-show-more
+ */ export const HorizontalCellShowMore = (_param)=>{
     var { className, style, getRef, getRootRef, height, size = 's', children = size === 's' ? 'Все' : 'Показать все', centered = false } = _param, restProps = _object_without_properties(_param, [
         "className",
         "style",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"sourcesContent":["import { Icon28ChevronRightCircle } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasRef, HasRootRef, LiteralUnion } from '../../../types';\nimport type { ImageBaseSize } from '../../ImageBase/ImageBase';\nimport { Tappable, type TappableOmitProps } from '../../Tappable/Tappable';\nimport { Subhead, type SubheadProps } from '../../Typography/Subhead/Subhead';\nimport styles from './HorizontalCellShowMore.module.css';\n\nconst sizeClassNames = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n};\n\nexport interface HorizontalCellShowMoreProps\n  extends Omit<TappableOmitProps, 'getRootRef' | 'size' | 'borderRadiusMode'>,\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   * Задаёт размер компонента.\n   *\n   * Значение `s` применяется для `<HorizontalCell size=\"s\"`, в остальных случаях рекомендуется `m`.\n   */\n  size?: 's' | 'm';\n  /**\n   * Предназначен для отрисовки текста.\n   * По умолчанию для `size='s'` содержит текст `Все`, для `size='m'` - `Показать все`.\n   * */\n  children?: SubheadProps['children'];\n  /**\n   * Выравнивание по центру относительно родителя.\n   */\n  centered?: boolean;\n}\n\nexport const HorizontalCellShowMore = ({\n  className,\n  style,\n  getRef,\n  getRootRef,\n  height,\n  size = 's',\n  children = size === 's' ? 'Все' : 'Показать все',\n  centered = false,\n  ...restProps\n}: HorizontalCellShowMoreProps): React.ReactNode => {\n  return (\n    <div\n      style={style}\n      className={classNames(\n        styles.host,\n        centered && styles.centered,\n        sizeClassNames[size],\n        className,\n      )}\n      ref={getRootRef}\n    >\n      <Tappable\n        style={size === 's' ? undefined : { height }}\n        className={styles.body}\n        getRootRef={getRef}\n        activeMode=\"opacity\"\n        hoverMode=\"opacity\"\n        {...restProps}\n      >\n        <Icon28ChevronRightCircle className={styles.icon} />\n\n        <Subhead className={styles.text} weight=\"2\">\n          {children}\n        </Subhead>\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["Icon28ChevronRightCircle","classNames","Tappable","Subhead","sizeClassNames","s","m","HorizontalCellShowMore","className","style","getRef","getRootRef","height","size","children","centered","restProps","div","ref","undefined","activeMode","hoverMode","weight"],"mappings":";;;;AAAA,SAASA,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,UAAU,QAAQ,kBAAkB;AAG7C,SAASC,QAAQ,QAAgC,6BAA0B;AAC3E,SAASC,OAAO,QAA2B,sCAAmC;AAG9E,MAAMC,iBAAiB;IACrBC,CAAC;IACDC,CAAC;AACH;AAkCA,OAAO,MAAMC,yBAAyB;QAAC,EACrCC,SAAS,EACTC,KAAK,EACLC,MAAM,EACNC,UAAU,EACVC,MAAM,EACNC,OAAO,GAAG,EACVC,WAAWD,SAAS,MAAM,QAAQ,cAAc,EAChDE,WAAW,KAAK,EAEY,WADzBC;QARHR;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,KAACE;QACCR,OAAOA;QACPD,WAAWP,+CAETc,oDACAX,cAAc,CAACS,KAAK,EACpBL;QAEFU,KAAKP;kBAEL,cAAA,MAACT;YACCO,OAAOI,SAAS,MAAMM,YAAY;gBAAEP;YAAO;YAC3CJ,SAAS;YACTG,YAAYD;YACZU,YAAW;YACXC,WAAU;WACNL;;8BAEJ,KAAChB;oBAAyBQ,SAAS;;8BAEnC,KAACL;oBAAQK,SAAS;oBAAec,QAAO;8BACrCR;;;;;AAKX,EAAE"}
+{"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"sourcesContent":["import { Icon28ChevronRightCircle } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasRef, HasRootRef, LiteralUnion } from '../../../types';\nimport type { ImageBaseSize } from '../../ImageBase/ImageBase';\nimport { Tappable, type TappableOmitProps } from '../../Tappable/Tappable';\nimport { Subhead, type SubheadProps } from '../../Typography/Subhead/Subhead';\nimport styles from './HorizontalCellShowMore.module.css';\n\nconst sizeClassNames = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n};\n\nexport interface HorizontalCellShowMoreProps\n  extends Omit<TappableOmitProps, 'getRootRef' | 'size' | 'borderRadiusMode'>,\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   * Задаёт размер компонента.\n   *\n   * Значение `s` применяется для `<HorizontalCell size=\"s\"`, в остальных случаях рекомендуется `m`.\n   */\n  size?: 's' | 'm';\n  /**\n   * Предназначен для отрисовки текста.\n   * По умолчанию для `size='s'` содержит текст `Все`, для `size='m'` - `Показать все`.\n   * */\n  children?: SubheadProps['children'];\n  /**\n   * Выравнивание по центру относительно родителя.\n   */\n  centered?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/horizontal-scroll#horizontal-cell-show-more\n */\nexport const HorizontalCellShowMore = ({\n  className,\n  style,\n  getRef,\n  getRootRef,\n  height,\n  size = 's',\n  children = size === 's' ? 'Все' : 'Показать все',\n  centered = false,\n  ...restProps\n}: HorizontalCellShowMoreProps): React.ReactNode => {\n  return (\n    <div\n      style={style}\n      className={classNames(\n        styles.host,\n        centered && styles.centered,\n        sizeClassNames[size],\n        className,\n      )}\n      ref={getRootRef}\n    >\n      <Tappable\n        style={size === 's' ? undefined : { height }}\n        className={styles.body}\n        getRootRef={getRef}\n        activeMode=\"opacity\"\n        hoverMode=\"opacity\"\n        {...restProps}\n      >\n        <Icon28ChevronRightCircle className={styles.icon} />\n\n        <Subhead className={styles.text} weight=\"2\">\n          {children}\n        </Subhead>\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["Icon28ChevronRightCircle","classNames","Tappable","Subhead","sizeClassNames","s","m","HorizontalCellShowMore","className","style","getRef","getRootRef","height","size","children","centered","restProps","div","ref","undefined","activeMode","hoverMode","weight"],"mappings":";;;;AAAA,SAASA,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,UAAU,QAAQ,kBAAkB;AAG7C,SAASC,QAAQ,QAAgC,6BAA0B;AAC3E,SAASC,OAAO,QAA2B,sCAAmC;AAG9E,MAAMC,iBAAiB;IACrBC,CAAC;IACDC,CAAC;AACH;AAkCA;;CAEC,GACD,OAAO,MAAMC,yBAAyB;QAAC,EACrCC,SAAS,EACTC,KAAK,EACLC,MAAM,EACNC,UAAU,EACVC,MAAM,EACNC,OAAO,GAAG,EACVC,WAAWD,SAAS,MAAM,QAAQ,cAAc,EAChDE,WAAW,KAAK,EAEY,WADzBC;QARHR;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,KAACE;QACCR,OAAOA;QACPD,WAAWP,+CAETc,oDACAX,cAAc,CAACS,KAAK,EACpBL;QAEFU,KAAKP;kBAEL,cAAA,MAACT;YACCO,OAAOI,SAAS,MAAMM,YAAY;gBAAEP;YAAO;YAC3CJ,SAAS;YACTG,YAAYD;YACZU,YAAW;YACXC,WAAU;WACNL;;8BAEJ,KAAChB;oBAAyBQ,SAAS;;8BAEnC,KAACL;oBAAQK,SAAS;oBAAec,QAAO;8BACrCR;;;;;AAKX,EAAE"}