@vkontakte/vkui 8.0.2 → 8.1.1

package/dist/components/ScrollArrow/ScrollArrow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ScrollArrow/ScrollArrow.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { Icon16Chevron, Icon24Chevron } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useConfigDirection } from '../../hooks/useConfigDirection';\nimport type { HasRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ScrollArrow.module.css';\n\nconst stylesSize = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n};\n\nconst stylesDirection = {\n  up: styles.directionUp,\n  right: styles.directionRight,\n  down: styles.directionDown,\n  left: styles.directionLeft,\n};\n\nconst labelDirection = {\n  up: 'Назад',\n  right: 'Вперед',\n  down: 'Вперед',\n  left: 'Назад',\n};\n\nconst ArrowIcon = ({ size }: Pick<ScrollArrowProps, 'size'>) => {\n  let Icon = Icon24Chevron;\n  if (size === 's') {\n    Icon = Icon16Chevron;\n  }\n\n  return <Icon className={styles.defaultIcon} />;\n};\n\nexport interface ScrollArrowProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    HasRootRef<HTMLButtonElement> {\n  /**\n   * Направление стрелки.\n   */\n  direction: 'up' | 'right' | 'down' | 'left';\n  /**\n   * Размер стрелки.\n   */\n  size?: 's' | 'm';\n  /**\n   * Смещает иконку кнопки навигации по вертикали.\n   */\n  offsetY?: number | string;\n  /**\n   * [a11y]: Используется для ассистивных технологий.\n   */\n  label?: string;\n}\n\n/**\n * Компонент стрелки. Используется в [HorizontalScroll](#/HorizontalScroll) и [Gallery](#/Gallery).\n *\n * @since 5.4.0\n * @see https://vkui.io/components/scroll-arrow\n */\nexport const ScrollArrow = ({\n  size = 'm',\n  offsetY,\n  direction,\n  label: labelProp,\n  children = <ArrowIcon size={size} />,\n  ...restProps\n}: ScrollArrowProps): React.ReactNode => {\n  const textDirection = useConfigDirection();\n  const label = labelProp ?? labelDirection[direction];\n\n  return (\n    <RootComponent\n      Component=\"button\"\n      type=\"button\"\n      baseClassName={classNames(\n        styles.host,\n        stylesSize[size],\n        stylesDirection[direction],\n        textDirection === 'rtl' && styles.rtl,\n      )}\n      {...restProps}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n      <span className={styles.icon} style={offsetY ? { top: offsetY } : undefined}>\n        {children}\n      </span>\n    </RootComponent>\n  );\n};\n"],"names":["Icon16Chevron","Icon24Chevron","classNames","useConfigDirection","RootComponent","VisuallyHidden","stylesSize","s","m","stylesDirection","up","right","down","left","labelDirection","ArrowIcon","size","Icon","className","ScrollArrow","offsetY","direction","label","labelProp","children","restProps","textDirection","Component","type","baseClassName","span","style","top","undefined"],"mappings":"AAAA;;AAGA,SAASA,aAAa,EAAEC,aAAa,QAAQ,mBAAmB;AAChE,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,kBAAkB,QAAQ,oCAAiC;AAEpE,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,cAAc,QAAQ,sCAAmC;AAGlE,MAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;AACH;AAEA,MAAMC,kBAAkB;IACtBC,EAAE;IACFC,KAAK;IACLC,IAAI;IACJC,IAAI;AACN;AAEA,MAAMC,iBAAiB;IACrBJ,IAAI;IACJC,OAAO;IACPC,MAAM;IACNC,MAAM;AACR;AAEA,MAAME,YAAY,CAAC,EAAEC,IAAI,EAAkC;IACzD,IAAIC,OAAOhB;IACX,IAAIe,SAAS,KAAK;QAChBC,OAAOjB;IACT;IAEA,qBAAO,KAACiB;QAAKC,SAAS;;AACxB;AAuBA;;;;;CAKC,GACD,OAAO,MAAMC,cAAc,CAAC,EAC1BH,OAAO,GAAG,EACVI,OAAO,EACPC,SAAS,EACTC,OAAOC,SAAS,EAChBC,yBAAW,KAACT;IAAUC,MAAMA;EAAQ,EACpC,GAAGS,WACc;IACjB,MAAMC,gBAAgBvB;IACtB,MAAMmB,QAAQC,aAAaT,cAAc,CAACO,UAAU;IAEpD,qBACE,MAACjB;QACCuB,WAAU;QACVC,MAAK;QACLC,eAAe3B,oCAEbI,UAAU,CAACU,KAAK,EAChBP,eAAe,CAACY,UAAU,EAC1BK,kBAAkB;QAEnB,GAAGD,SAAS;;YAEZH,uBAAS,KAACjB;0BAAgBiB;;0BAC3B,KAACQ;gBAAKZ,SAAS;gBAAea,OAAOX,UAAU;oBAAEY,KAAKZ;gBAAQ,IAAIa;0BAC/DT;;;;AAIT,EAAE"}
+{"version":3,"sources":["../../../src/components/ScrollArrow/ScrollArrow.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { Icon16Chevron, Icon24Chevron } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useConfigDirection } from '../../hooks/useConfigDirection';\nimport type { HasRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ScrollArrow.module.css';\n\nconst stylesSize = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n};\n\nconst stylesDirection = {\n  up: styles.directionUp,\n  right: styles.directionRight,\n  down: styles.directionDown,\n  left: styles.directionLeft,\n};\n\nconst labelDirection = {\n  up: 'Назад',\n  right: 'Вперед',\n  down: 'Вперед',\n  left: 'Назад',\n};\n\nconst ArrowIcon = ({ size }: Pick<ScrollArrowProps, 'size'>) => {\n  let Icon = Icon24Chevron;\n  if (size === 's') {\n    Icon = Icon16Chevron;\n  }\n\n  return <Icon className={styles.defaultIcon} />;\n};\n\nexport interface ScrollArrowProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    HasRootRef<HTMLButtonElement> {\n  /**\n   * Направление стрелки.\n   */\n  direction: 'up' | 'right' | 'down' | 'left';\n  /**\n   * Размер стрелки.\n   */\n  size?: 's' | 'm' | undefined;\n  /**\n   * Смещает иконку кнопки навигации по вертикали.\n   */\n  offsetY?: number | string | undefined;\n  /**\n   * Смещает иконку кнопки навигации по горизонтали.\n   * Для `direction=\"left\"` применяется к `left` (в LTR) или `right` (в RTL).\n   * Для `direction=\"right\"` применяется к `right` (в LTR) или `left` (в RTL).\n   */\n  offsetX?: number | string | undefined;\n  /**\n   * [a11y]: Используется для ассистивных технологий.\n   */\n  label?: string | undefined;\n}\n\n/**\n * Компонент стрелки. Используется в [HorizontalScroll](#/HorizontalScroll) и [Gallery](#/Gallery).\n *\n * @since 5.4.0\n * @see https://vkui.io/components/scroll-arrow\n */\nexport const ScrollArrow = ({\n  size = 'm',\n  offsetY,\n  offsetX,\n  direction,\n  label: labelProp,\n  children = <ArrowIcon size={size} />,\n  ...restProps\n}: ScrollArrowProps): React.ReactNode => {\n  const textDirection = useConfigDirection();\n  const label = labelProp ?? labelDirection[direction];\n\n  const iconStyle: React.CSSProperties = {};\n  if (offsetY) {\n    iconStyle.top = offsetY;\n  }\n  if (offsetX) {\n    const isRtl = textDirection === 'rtl';\n    if (direction === 'left') {\n      iconStyle[isRtl ? 'right' : 'left'] = offsetX;\n    } else if (direction === 'right') {\n      iconStyle[isRtl ? 'left' : 'right'] = offsetX;\n    }\n  }\n\n  return (\n    <RootComponent\n      Component=\"button\"\n      type=\"button\"\n      baseClassName={classNames(\n        styles.host,\n        stylesSize[size],\n        stylesDirection[direction],\n        textDirection === 'rtl' && styles.rtl,\n      )}\n      {...restProps}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n      <span\n        className={styles.icon}\n        style={Object.keys(iconStyle).length > 0 ? iconStyle : undefined}\n      >\n        {children}\n      </span>\n    </RootComponent>\n  );\n};\n"],"names":["Icon16Chevron","Icon24Chevron","classNames","useConfigDirection","RootComponent","VisuallyHidden","stylesSize","s","m","stylesDirection","up","right","down","left","labelDirection","ArrowIcon","size","Icon","className","ScrollArrow","offsetY","offsetX","direction","label","labelProp","children","restProps","textDirection","iconStyle","top","isRtl","Component","type","baseClassName","span","style","Object","keys","length","undefined"],"mappings":"AAAA;;AAGA,SAASA,aAAa,EAAEC,aAAa,QAAQ,mBAAmB;AAChE,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,kBAAkB,QAAQ,oCAAiC;AAEpE,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,cAAc,QAAQ,sCAAmC;AAGlE,MAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;AACH;AAEA,MAAMC,kBAAkB;IACtBC,EAAE;IACFC,KAAK;IACLC,IAAI;IACJC,IAAI;AACN;AAEA,MAAMC,iBAAiB;IACrBJ,IAAI;IACJC,OAAO;IACPC,MAAM;IACNC,MAAM;AACR;AAEA,MAAME,YAAY,CAAC,EAAEC,IAAI,EAAkC;IACzD,IAAIC,OAAOhB;IACX,IAAIe,SAAS,KAAK;QAChBC,OAAOjB;IACT;IAEA,qBAAO,KAACiB;QAAKC,SAAS;;AACxB;AA6BA;;;;;CAKC,GACD,OAAO,MAAMC,cAAc,CAAC,EAC1BH,OAAO,GAAG,EACVI,OAAO,EACPC,OAAO,EACPC,SAAS,EACTC,OAAOC,SAAS,EAChBC,yBAAW,KAACV;IAAUC,MAAMA;EAAQ,EACpC,GAAGU,WACc;IACjB,MAAMC,gBAAgBxB;IACtB,MAAMoB,QAAQC,aAAaV,cAAc,CAACQ,UAAU;IAEpD,MAAMM,YAAiC,CAAC;IACxC,IAAIR,SAAS;QACXQ,UAAUC,GAAG,GAAGT;IAClB;IACA,IAAIC,SAAS;QACX,MAAMS,QAAQH,kBAAkB;QAChC,IAAIL,cAAc,QAAQ;YACxBM,SAAS,CAACE,QAAQ,UAAU,OAAO,GAAGT;QACxC,OAAO,IAAIC,cAAc,SAAS;YAChCM,SAAS,CAACE,QAAQ,SAAS,QAAQ,GAAGT;QACxC;IACF;IAEA,qBACE,MAACjB;QACC2B,WAAU;QACVC,MAAK;QACLC,eAAe/B,oCAEbI,UAAU,CAACU,KAAK,EAChBP,eAAe,CAACa,UAAU,EAC1BK,kBAAkB;QAEnB,GAAGD,SAAS;;YAEZH,uBAAS,KAAClB;0BAAgBkB;;0BAC3B,KAACW;gBACChB,SAAS;gBACTiB,OAAOC,OAAOC,IAAI,CAACT,WAAWU,MAAM,GAAG,IAAIV,YAAYW;0BAEtDd;;;;AAIT,EAAE"}

package/dist/components/Search/Search.d.ts

@@ -1,12 +1,12 @@
 import * as React from 'react';
 import type { HasDataAttribute, HasRootRef } from '../../types';
 import { type IconButtonProps } from '../IconButton/IconButton';
-export type RenderIconButtonFn = (icon: React.ReactNode, props?: Partial<IconButtonProps> & HasDataAttribute) => React.ReactElement;
+export type RenderIconButtonFn = (icon: React.ReactNode, props?: (Partial<IconButtonProps> & HasDataAttribute) | undefined) => React.ReactElement;
 export interface SearchProps extends Pick<React.InputHTMLAttributes<HTMLInputElement>, 'autoComplete' | 'autoCapitalize' | 'autoCorrect' | 'disabled' | 'list' | 'maxLength' | 'minLength' | 'name' | 'pattern' | 'enterKeyHint' | 'placeholder' | 'readOnly' | 'required' | 'value' | 'form' | 'onChange' | 'onFocus' | 'onBlur'>, Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'onFocus' | 'onBlur'>, HasRootRef<HTMLDivElement> {
     /**
      * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ input: { getRootRef: ... } }`.
      */
-    getRef?: React.Ref<HTMLInputElement>;
+    getRef?: React.Ref<HTMLInputElement> | undefined;
     /**
      * Свойства, которые можно прокинуть внутрь компонента:
      * - `root`: свойства для прокидывания в корень компонента;
@@ -14,64 +14,64 @@ export interface SearchProps extends Pick<React.InputHTMLAttributes<HTMLInputEle
      * - `clearButton`: свойства для прокидывания в кнопку очистки.
      */
     slotProps?: {
-        root?: React.HTMLAttributes<HTMLDivElement> & HasRootRef<HTMLDivElement> & HasDataAttribute;
+        root?: (React.HTMLAttributes<HTMLDivElement> & HasRootRef<HTMLDivElement> & HasDataAttribute) | undefined;
         input?: React.InputHTMLAttributes<HTMLInputElement> & HasRootRef<HTMLInputElement> & HasDataAttribute;
         clearButton?: React.HTMLAttributes<HTMLElement> & HasRootRef<HTMLElement> & HasDataAttribute;
-    };
+    } | undefined;
     /**
      * Only iOS. Текст кнопки "отмена", которая чистит текстовое поле и убирает фокус.
      */
-    after?: React.ReactNode;
+    after?: React.ReactNode | undefined;
     /**
      * Контент, отображаемый перед полем ввода.
      */
-    before?: React.ReactNode;
+    before?: React.ReactNode | undefined;
     /**
      * Иконка поиска. Может быть React-элементом или функцией, возвращающей элемент.
      */
-    icon?: React.ReactNode | ((renderFn: RenderIconButtonFn) => React.ReactNode);
+    icon?: React.ReactNode | ((renderFn: RenderIconButtonFn) => React.ReactNode) | undefined;
     /**
      * Обработчик нажатия на иконку поиска.
      */
-    onIconClick?: React.PointerEventHandler<HTMLElement>;
+    onIconClick?: React.PointerEventHandler<HTMLElement> | undefined;
     /**
      * Значение поля ввода по умолчанию.
      */
-    defaultValue?: string;
+    defaultValue?: string | undefined;
     /**
      * Текст для скринридеров, описывающий иконку поиска.
      */
-    iconLabel?: string;
+    iconLabel?: string | undefined;
     /**
      * Текст для скринридеров, описывающий кнопку очистки.
      */
-    clearLabel?: string;
+    clearLabel?: string | undefined;
     /**
      * @deprecated Since 8.1.0. Будет удалено в **VKUI v10**. Вместо этого используйте `slotProps={ clearButton: { 'data-testid': ... } }`.
      *
      * Передает атрибут `data-testid` для кнопки очистки.
      */
-    clearButtonTestId?: string;
+    clearButtonTestId?: string | undefined;
     /**
      * Удаляет отступы у компонента.
      */
-    noPadding?: boolean;
+    noPadding?: boolean | undefined;
     /**
      * Текст для кнопки Найти.
      */
-    findButtonText?: string;
+    findButtonText?: string | undefined;
     /**
      * Обработчик, при нажатии на кнопку "Найти".
      */
-    onFindButtonClick?: React.MouseEventHandler<HTMLElement>;
+    onFindButtonClick?: React.MouseEventHandler<HTMLElement> | undefined;
     /**
      * Передает атрибут `data-testid` для кнопки поиска.
      */
-    findButtonTestId?: string;
+    findButtonTestId?: string | undefined;
     /**
      * Скрывает кнопку очистки.
      */
-    hideClearButton?: boolean;
+    hideClearButton?: boolean | undefined;
 }
 /**
  * @see https://vkui.io/components/search

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

@@ -1 +1 @@
-{"version":3,"file":"Search.d.ts","sourceRoot":"","sources":["../../../src/components/Search/Search.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAe/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEhE,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAQ5E,MAAM,MAAM,kBAAkB,GAAG,CAC/B,IAAI,EAAE,KAAK,CAAC,SAAS,EACrB,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,gBAAgB,KAChD,KAAK,CAAC,YAAY,CAAC;AAExB,MAAM,WAAW,WACf,SAAQ,IAAI,CACR,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EACzC,cAAc,GACd,gBAAgB,GAChB,aAAa,GACb,UAAU,GACV,MAAM,GACN,WAAW,GACX,WAAW,GACX,MAAM,GACN,SAAS,GACT,cAAc,GACd,aAAa,GACb,UAAU,GACV,UAAU,GACV,OAAO,GACP,MAAM,GACN,UAAU,GACV,SAAS,GACT,QAAQ,CACX,EACD,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,SAAS,GAAG,QAAQ,CAAC,EAC7E,UAAU,CAAC,cAAc,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IACrC;;;;;OAKG;IACH,SAAS,CAAC,EAAE;QACV,IAAI,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG,UAAU,CAAC,cAAc,CAAC,GAAG,gBAAgB,CAAC;QAC5F,KAAK,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,GACjD,UAAU,CAAC,gBAAgB,CAAC,GAC5B,gBAAgB,CAAC;QACnB,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG,UAAU,CAAC,WAAW,CAAC,GAAG,gBAAgB,CAAC;KAC9F,CAAC;IACF;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,QAAQ,EAAE,kBAAkB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;IAC7E;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,WAAW,CAAC,CAAC;IACrD;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;IACzD;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED;;GAEG;AACH,eAAO,MAAM,MAAM,GAAI,igBA4CpB,WAAW,KAAG,KAAK,CAAC,SA+OtB,CAAC"}
+{"version":3,"file":"Search.d.ts","sourceRoot":"","sources":["../../../src/components/Search/Search.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAe/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEhE,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAQ5E,MAAM,MAAM,kBAAkB,GAAG,CAC/B,IAAI,EAAE,KAAK,CAAC,SAAS,EACrB,KAAK,CAAC,EAAE,CAAC,OAAO,CAAC,eAAe,CAAC,GAAG,gBAAgB,CAAC,GAAG,SAAS,KAC9D,KAAK,CAAC,YAAY,CAAC;AAExB,MAAM,WAAW,WACf,SAAQ,IAAI,CACR,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EACzC,cAAc,GACd,gBAAgB,GAChB,aAAa,GACb,UAAU,GACV,MAAM,GACN,WAAW,GACX,WAAW,GACX,MAAM,GACN,SAAS,GACT,cAAc,GACd,aAAa,GACb,UAAU,GACV,UAAU,GACV,OAAO,GACP,MAAM,GACN,UAAU,GACV,SAAS,GACT,QAAQ,CACX,EACD,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,SAAS,GAAG,QAAQ,CAAC,EAC7E,UAAU,CAAC,cAAc,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,GAAG,SAAS,CAAC;IACjD;;;;;OAKG;IACH,SAAS,CAAC,EACN;QACE,IAAI,CAAC,EACD,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG,UAAU,CAAC,cAAc,CAAC,GAAG,gBAAgB,CAAC,GACtF,SAAS,CAAC;QACd,KAAK,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,GACjD,UAAU,CAAC,gBAAgB,CAAC,GAC5B,gBAAgB,CAAC;QACnB,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAC7C,UAAU,CAAC,WAAW,CAAC,GACvB,gBAAgB,CAAC;KACpB,GACD,SAAS,CAAC;IACd;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACpC;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACrC;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,QAAQ,EAAE,kBAAkB,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;IACzF;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,WAAW,CAAC,GAAG,SAAS,CAAC;IACjE;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACvC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAChC;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC;;OAEG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,GAAG,SAAS,CAAC;IACrE;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACtC;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CACvC;AAED;;GAEG;AACH,eAAO,MAAM,MAAM,GAAI,igBA4CpB,WAAW,KAAG,KAAK,CAAC,SA6PtB,CAAC"}

package/dist/components/Search/Search.js

@@ -100,16 +100,6 @@ autoComplete = 'off', autoCapitalize, autoCorrect, disabled, list, maxLength, mi
     const onIconClickStart = React.useCallback((e)=>onIconClick?.(e), [
         onIconClick
     ]);
-    const onIconCancelClickStart = React.useCallback((e)=>{
-        e.preventDefault();
-        inputRef.current?.focus();
-        if (touchEnabled()) {
-            onCancel();
-        }
-    }, [
-        inputRef,
-        onCancel
-    ]);
     useIsomorphicLayoutEffect(()=>{
         if (inputRest.value !== undefined) {
             setHasValue(Boolean(inputRest.value));
@@ -136,6 +126,25 @@ autoComplete = 'off', autoCapitalize, autoCorrect, disabled, list, maxLength, mi
             ]
         });
     const showControls = Boolean(iconProp || !hideClearButton || adaptiveDensity.compact && onFindButtonClick);
+    const onClearPointerDown = (e)=>{
+        // Сначала вызываем внешний обработчик, затем локальную логику, чтобы можно было предотвратить обработку фокуса на поле ввода.
+        onClearButtonPointerDown?.(e);
+        e.preventDefault();
+        inputRef.current?.focus();
+        if (touchEnabled()) {
+            onCancel();
+        }
+    };
+    const onClearClick = (e)=>{
+        // eslint-disable-next-line @typescript-eslint/unbound-method
+        const nativeInputValueSetter = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set;
+        nativeInputValueSetter?.call(inputRef.current, '');
+        const ev2 = new Event('input', {
+            bubbles: true
+        });
+        inputRef.current?.dispatchEvent(ev2);
+        onClearButtonClick?.(e);
+    };
     return /*#__PURE__*/ _jsxs(RootComponent, {
         baseClassName: classNames('vkuiInternalSearch', "vkuiSearch__host", density === 'none' && "vkuiSearch__densityNone", density === 'compact' && "vkuiSearch__densityCompact", isFocused && "vkuiSearch__focused", hasValue && "vkuiSearch__hasValue", hasAfter && "vkuiSearch__hasAfter", iconProp && "vkuiSearch__hasIcon", inputRest.disabled && "vkuiSearch__disabled", !noPadding && "vkuiSearch__withPadding", isRtl && "vkuiSearch__rtl"),
         ...rootRest,
@@ -173,8 +182,8 @@ autoComplete = 'off', autoCapitalize, autoCorrect, disabled, list, maxLength, mi
                             iconProp && (typeof iconProp === 'function' ? iconProp(renderIconButton) : renderIconButton(iconProp)),
                             !hideClearButton && /*#__PURE__*/ _jsxs(IconButton, {
                                 hoverMode: "opacity",
-                                onPointerDown: callMultiple(onIconCancelClickStart, onClearButtonPointerDown),
-                                onClick: callMultiple(onCancel, onClearButtonClick),
+                                onPointerDown: onClearPointerDown,
+                                onClick: onClearClick,
                                 tabIndex: hasValue ? undefined : -1,
                                 disabled: inputRest.disabled,
                                 "data-testid": clearButtonTestId,

package/dist/components/Search/Search.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon16Clear, Icon16SearchOutline, Icon24Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport { useBooleanState } from '../../hooks/useBooleanState';\nimport { useConfigDirection } from '../../hooks/useConfigDirection';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMergeProps } from '../../hooks/useMergeProps';\nimport { useNativeFormResetListener } from '../../hooks/useNativeFormResetListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { touchEnabled } from '../../lib/touch';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HasDataAttribute, HasRootRef } from '../../types';\nimport { Button } from '../Button/Button';\nimport { IconButton, type IconButtonProps } from '../IconButton/IconButton';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './Search.module.css';\n\nconst warn = warnOnce('Search');\n\nexport type RenderIconButtonFn = (\n  icon: React.ReactNode,\n  props?: Partial<IconButtonProps> & HasDataAttribute,\n) => React.ReactElement;\n\nexport interface SearchProps\n  extends Pick<\n      React.InputHTMLAttributes<HTMLInputElement>,\n      | 'autoComplete'\n      | 'autoCapitalize'\n      | 'autoCorrect'\n      | 'disabled'\n      | 'list'\n      | 'maxLength'\n      | 'minLength'\n      | 'name'\n      | 'pattern'\n      | 'enterKeyHint'\n      | 'placeholder'\n      | 'readOnly'\n      | 'required'\n      | 'value'\n      | 'form'\n      | 'onChange'\n      | 'onFocus'\n      | 'onBlur'\n    >,\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'onFocus' | 'onBlur'>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ input: { getRootRef: ... } }`.\n   */\n  getRef?: React.Ref<HTMLInputElement>;\n  /**\n   * Свойства, которые можно прокинуть внутрь компонента:\n   * - `root`: свойства для прокидывания в корень компонента;\n   * - `input`: свойства для прокидывания в поле ввода;\n   * - `clearButton`: свойства для прокидывания в кнопку очистки.\n   */\n  slotProps?: {\n    root?: React.HTMLAttributes<HTMLDivElement> & HasRootRef<HTMLDivElement> & HasDataAttribute;\n    input?: React.InputHTMLAttributes<HTMLInputElement> &\n      HasRootRef<HTMLInputElement> &\n      HasDataAttribute;\n    clearButton?: React.HTMLAttributes<HTMLElement> & HasRootRef<HTMLElement> & HasDataAttribute;\n  };\n  /**\n   * Only iOS. Текст кнопки \"отмена\", которая чистит текстовое поле и убирает фокус.\n   */\n  after?: React.ReactNode;\n  /**\n   * Контент, отображаемый перед полем ввода.\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка поиска. Может быть React-элементом или функцией, возвращающей элемент.\n   */\n  icon?: React.ReactNode | ((renderFn: RenderIconButtonFn) => React.ReactNode);\n  /**\n   * Обработчик нажатия на иконку поиска.\n   */\n  onIconClick?: React.PointerEventHandler<HTMLElement>;\n  /**\n   * Значение поля ввода по умолчанию.\n   */\n  defaultValue?: string;\n  /**\n   * Текст для скринридеров, описывающий иконку поиска.\n   */\n  iconLabel?: string;\n  /**\n   * Текст для скринридеров, описывающий кнопку очистки.\n   */\n  clearLabel?: string;\n  /**\n   * @deprecated Since 8.1.0. Будет удалено в **VKUI v10**. Вместо этого используйте `slotProps={ clearButton: { 'data-testid': ... } }`.\n   *\n   * Передает атрибут `data-testid` для кнопки очистки.\n   */\n  clearButtonTestId?: string;\n  /**\n   * Удаляет отступы у компонента.\n   */\n  noPadding?: boolean;\n  /**\n   * Текст для кнопки Найти.\n   */\n  findButtonText?: string;\n  /**\n   * Обработчик, при нажатии на кнопку \"Найти\".\n   */\n  onFindButtonClick?: React.MouseEventHandler<HTMLElement>;\n  /**\n   * Передает атрибут `data-testid` для кнопки поиска.\n   */\n  findButtonTestId?: string;\n  /**\n   * Скрывает кнопку очистки.\n   */\n  hideClearButton?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/search\n */\nexport const Search = ({\n  // SearchProps\n  after = 'Отмена',\n  before = <Icon16SearchOutline />,\n  icon: iconProp,\n  onIconClick,\n  iconLabel,\n  clearLabel = 'Очистить',\n  clearButtonTestId,\n  noPadding,\n  findButtonText = 'Найти',\n  onFindButtonClick,\n  findButtonTestId,\n  hideClearButton,\n  getRef,\n\n  // input props\n  autoComplete = 'off',\n  autoCapitalize,\n  autoCorrect,\n  disabled,\n  list,\n  maxLength,\n  minLength,\n  name,\n  pattern,\n  placeholder: placeholderProp = 'Поиск',\n  enterKeyHint,\n  readOnly,\n  required,\n  value,\n  form,\n  id: idProp,\n  inputMode,\n  defaultValue,\n  autoFocus,\n  tabIndex,\n  spellCheck,\n  onChange: onChangeProp,\n  onFocus: onFocusProp,\n  onBlur: onBlurProp,\n\n  slotProps,\n  ...restProps\n}: SearchProps): React.ReactNode => {\n  /* istanbul ignore if: не проверяем в тестах */\n  if (process.env.NODE_ENV === 'development') {\n    if (getRef) {\n      warn('Свойство `getRef` устаревшее, используйте `slotProps={ input: { getRootRef: ... } }`');\n    }\n    if (clearButtonTestId) {\n      warn(\n        \"Свойство `clearButtonTestId` устаревшее, используйте `slotProps={ clearButton: { 'data-testid': ... } }`\",\n      );\n    }\n  }\n\n  const direction = useConfigDirection();\n  const isRtl = direction === 'rtl';\n\n  const rootRest = useMergeProps(restProps, slotProps?.root);\n\n  const {\n    id,\n    placeholder,\n    getRootRef: getInputRef,\n    onChange,\n    onFocus: onInputFocus,\n    onBlur: onInputBlur,\n    ...inputRest\n  } = useMergeProps(\n    {\n      getRootRef: getRef,\n      className: styles.nativeInput,\n      placeholder: placeholderProp,\n      autoComplete,\n      autoCapitalize,\n      autoCorrect,\n      disabled,\n      list,\n      maxLength,\n      minLength,\n      name,\n      pattern,\n      enterKeyHint,\n      readOnly,\n      required,\n      value,\n      form,\n      id: idProp,\n      inputMode,\n      defaultValue,\n      autoFocus,\n      tabIndex,\n      spellCheck,\n      onChange: onChangeProp,\n      onFocus: onFocusProp,\n      onBlur: onBlurProp,\n    },\n    slotProps?.input,\n  );\n\n  const {\n    onClick: onClearButtonClick,\n    onPointerDown: onClearButtonPointerDown,\n    ...clearButtonRest\n  } = useMergeProps({ className: styles.icon }, slotProps?.clearButton);\n\n  const inputRef = useExternRef(getInputRef);\n  const [isFocused, setFocusedTrue, setFocusedFalse] = useBooleanState(false);\n  const generatedId = React.useId();\n  const inputId = id ? id : `search-${generatedId}`;\n\n  const [hasValue, setHasValue] = React.useState<boolean>(() =>\n    Boolean(inputRest.value || inputRest.defaultValue),\n  );\n  const checkHasValue: React.ChangeEventHandler<HTMLInputElement> = (e) =>\n    setHasValue(Boolean(e.currentTarget.value));\n\n  const { density = 'none' } = useAdaptivity();\n  const { density: adaptiveDensity } = useAdaptivityConditionalRender();\n  const platform = usePlatform();\n\n  const hasAfter = platform === 'ios' && hasReactNode(after);\n\n  const onFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedTrue();\n    onInputFocus && onInputFocus(e);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedFalse();\n    onInputBlur && onInputBlur(e);\n  };\n\n  const onCancel = React.useCallback(() => {\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n      HTMLInputElement.prototype,\n      'value',\n    )?.set;\n    nativeInputValueSetter?.call(inputRef.current, '');\n\n    const ev2 = new Event('input', { bubbles: true });\n    inputRef.current?.dispatchEvent(ev2);\n  }, [inputRef]);\n\n  const onIconClickStart: React.PointerEventHandler<HTMLElement> = React.useCallback(\n    (e) => onIconClick?.(e),\n    [onIconClick],\n  );\n\n  const onIconCancelClickStart: React.PointerEventHandler<HTMLElement> = React.useCallback(\n    (e) => {\n      e.preventDefault();\n      inputRef.current?.focus();\n      if (touchEnabled()) {\n        onCancel();\n      }\n    },\n    [inputRef, onCancel],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    if (inputRest.value !== undefined) {\n      setHasValue(Boolean(inputRest.value));\n    }\n  }, [inputRest.value]);\n\n  useNativeFormResetListener(inputRef, () => {\n    setHasValue(Boolean(inputRest.defaultValue));\n  });\n\n  const renderIconButton: RenderIconButtonFn = (icon, props = {}) => (\n    <IconButton\n      hoverMode=\"opacity\"\n      onPointerDown={onIconClickStart}\n      className={styles.icon}\n      onFocus={setFocusedTrue}\n      onBlur={setFocusedFalse}\n      onClick={noop}\n      {...props}\n    >\n      <VisuallyHidden>{iconLabel}</VisuallyHidden>\n      {icon}\n    </IconButton>\n  );\n\n  const showControls = Boolean(\n    iconProp || !hideClearButton || (adaptiveDensity.compact && onFindButtonClick),\n  );\n\n  return (\n    <RootComponent\n      baseClassName={classNames(\n        'vkuiInternalSearch',\n        styles.host,\n        density === 'none' && styles.densityNone,\n        density === 'compact' && styles.densityCompact,\n        isFocused && styles.focused,\n        hasValue && styles.hasValue,\n        hasAfter && styles.hasAfter,\n        iconProp && styles.hasIcon,\n        inputRest.disabled && styles.disabled,\n        !noPadding && styles.withPadding,\n        isRtl && styles.rtl,\n      )}\n      {...rootRest}\n    >\n      <div className={styles.field}>\n        <label htmlFor={inputId} className={styles.label}>\n          {placeholder}\n        </label>\n        <div className={styles.input}>\n          {before}\n          <Headline\n            Component=\"input\"\n            type=\"search\"\n            level=\"1\"\n            weight=\"3\"\n            id={inputId}\n            placeholder={placeholder}\n            getRootRef={inputRef}\n            onChange={callMultiple(onChange, checkHasValue)}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            {...inputRest}\n          />\n        </div>\n        {showControls && (\n          <div className={styles.controls}>\n            {iconProp &&\n              (typeof iconProp === 'function'\n                ? iconProp(renderIconButton)\n                : renderIconButton(iconProp))}\n            {!hideClearButton && (\n              <IconButton\n                hoverMode=\"opacity\"\n                onPointerDown={callMultiple(onIconCancelClickStart, onClearButtonPointerDown)}\n                onClick={callMultiple(onCancel, onClearButtonClick)}\n                tabIndex={hasValue ? undefined : -1}\n                disabled={inputRest.disabled}\n                data-testid={clearButtonTestId}\n                {...clearButtonRest}\n              >\n                <VisuallyHidden>{clearLabel}</VisuallyHidden>\n                {platform === 'ios' ? <Icon16Clear /> : <Icon24Cancel />}\n              </IconButton>\n            )}\n            {adaptiveDensity.compact && onFindButtonClick && (\n              <Button\n                mode=\"primary\"\n                size=\"m\"\n                className={classNames(styles.findButton, adaptiveDensity.compact.className)}\n                focusVisibleMode=\"inside\"\n                onClick={onFindButtonClick}\n                tabIndex={hasValue ? undefined : -1}\n                data-testid={findButtonTestId}\n              >\n                {findButtonText}\n              </Button>\n            )}\n          </div>\n        )}\n      </div>\n      {hasAfter && (\n        <div className={styles.after}>\n          <Button\n            mode=\"tertiary\"\n            size=\"m\"\n            focusVisibleMode=\"inside\"\n            hoverMode=\"opacity\"\n            activeMode=\"opacity\"\n            onClick={onCancel}\n            onFocus={setFocusedTrue}\n            onBlur={setFocusedFalse}\n          >\n            <span className={styles.afterTextClip}>{after}</span>\n          </Button>\n        </div>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","Icon16Clear","Icon16SearchOutline","Icon24Cancel","classNames","hasReactNode","noop","useAdaptivity","useAdaptivityConditionalRender","useBooleanState","useConfigDirection","useExternRef","useMergeProps","useNativeFormResetListener","usePlatform","callMultiple","touchEnabled","useIsomorphicLayoutEffect","warnOnce","Button","IconButton","RootComponent","Headline","VisuallyHidden","warn","Search","after","before","icon","iconProp","onIconClick","iconLabel","clearLabel","clearButtonTestId","noPadding","findButtonText","onFindButtonClick","findButtonTestId","hideClearButton","getRef","autoComplete","autoCapitalize","autoCorrect","disabled","list","maxLength","minLength","name","pattern","placeholder","placeholderProp","enterKeyHint","readOnly","required","value","form","id","idProp","inputMode","defaultValue","autoFocus","tabIndex","spellCheck","onChange","onChangeProp","onFocus","onFocusProp","onBlur","onBlurProp","slotProps","restProps","process","env","NODE_ENV","direction","isRtl","rootRest","root","getRootRef","getInputRef","onInputFocus","onInputBlur","inputRest","className","input","onClick","onClearButtonClick","onPointerDown","onClearButtonPointerDown","clearButtonRest","clearButton","inputRef","isFocused","setFocusedTrue","setFocusedFalse","generatedId","useId","inputId","hasValue","setHasValue","useState","Boolean","checkHasValue","e","currentTarget","density","adaptiveDensity","platform","hasAfter","onCancel","useCallback","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","onIconCancelClickStart","preventDefault","focus","undefined","renderIconButton","props","hoverMode","showControls","compact","baseClassName","div","label","htmlFor","Component","type","level","weight","data-testid","mode","size","focusVisibleMode","activeMode","span"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon16Clear, Icon16SearchOutline, Icon24Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport { useBooleanState } from '../../hooks/useBooleanState';\nimport { useConfigDirection } from '../../hooks/useConfigDirection';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMergeProps } from '../../hooks/useMergeProps';\nimport { useNativeFormResetListener } from '../../hooks/useNativeFormResetListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { touchEnabled } from '../../lib/touch';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HasDataAttribute, HasRootRef } from '../../types';\nimport { Button } from '../Button/Button';\nimport { IconButton, type IconButtonProps } from '../IconButton/IconButton';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './Search.module.css';\n\nconst warn = warnOnce('Search');\n\nexport type RenderIconButtonFn = (\n  icon: React.ReactNode,\n  props?: (Partial<IconButtonProps> & HasDataAttribute) | undefined,\n) => React.ReactElement;\n\nexport interface SearchProps\n  extends Pick<\n      React.InputHTMLAttributes<HTMLInputElement>,\n      | 'autoComplete'\n      | 'autoCapitalize'\n      | 'autoCorrect'\n      | 'disabled'\n      | 'list'\n      | 'maxLength'\n      | 'minLength'\n      | 'name'\n      | 'pattern'\n      | 'enterKeyHint'\n      | 'placeholder'\n      | 'readOnly'\n      | 'required'\n      | 'value'\n      | 'form'\n      | 'onChange'\n      | 'onFocus'\n      | 'onBlur'\n    >,\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'onFocus' | 'onBlur'>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ input: { getRootRef: ... } }`.\n   */\n  getRef?: React.Ref<HTMLInputElement> | undefined;\n  /**\n   * Свойства, которые можно прокинуть внутрь компонента:\n   * - `root`: свойства для прокидывания в корень компонента;\n   * - `input`: свойства для прокидывания в поле ввода;\n   * - `clearButton`: свойства для прокидывания в кнопку очистки.\n   */\n  slotProps?:\n    | {\n        root?:\n          | (React.HTMLAttributes<HTMLDivElement> & HasRootRef<HTMLDivElement> & HasDataAttribute)\n          | undefined;\n        input?: React.InputHTMLAttributes<HTMLInputElement> &\n          HasRootRef<HTMLInputElement> &\n          HasDataAttribute;\n        clearButton?: React.HTMLAttributes<HTMLElement> &\n          HasRootRef<HTMLElement> &\n          HasDataAttribute;\n      }\n    | undefined;\n  /**\n   * Only iOS. Текст кнопки \"отмена\", которая чистит текстовое поле и убирает фокус.\n   */\n  after?: React.ReactNode | undefined;\n  /**\n   * Контент, отображаемый перед полем ввода.\n   */\n  before?: React.ReactNode | undefined;\n  /**\n   * Иконка поиска. Может быть React-элементом или функцией, возвращающей элемент.\n   */\n  icon?: React.ReactNode | ((renderFn: RenderIconButtonFn) => React.ReactNode) | undefined;\n  /**\n   * Обработчик нажатия на иконку поиска.\n   */\n  onIconClick?: React.PointerEventHandler<HTMLElement> | undefined;\n  /**\n   * Значение поля ввода по умолчанию.\n   */\n  defaultValue?: string | undefined;\n  /**\n   * Текст для скринридеров, описывающий иконку поиска.\n   */\n  iconLabel?: string | undefined;\n  /**\n   * Текст для скринридеров, описывающий кнопку очистки.\n   */\n  clearLabel?: string | undefined;\n  /**\n   * @deprecated Since 8.1.0. Будет удалено в **VKUI v10**. Вместо этого используйте `slotProps={ clearButton: { 'data-testid': ... } }`.\n   *\n   * Передает атрибут `data-testid` для кнопки очистки.\n   */\n  clearButtonTestId?: string | undefined;\n  /**\n   * Удаляет отступы у компонента.\n   */\n  noPadding?: boolean | undefined;\n  /**\n   * Текст для кнопки Найти.\n   */\n  findButtonText?: string | undefined;\n  /**\n   * Обработчик, при нажатии на кнопку \"Найти\".\n   */\n  onFindButtonClick?: React.MouseEventHandler<HTMLElement> | undefined;\n  /**\n   * Передает атрибут `data-testid` для кнопки поиска.\n   */\n  findButtonTestId?: string | undefined;\n  /**\n   * Скрывает кнопку очистки.\n   */\n  hideClearButton?: boolean | undefined;\n}\n\n/**\n * @see https://vkui.io/components/search\n */\nexport const Search = ({\n  // SearchProps\n  after = 'Отмена',\n  before = <Icon16SearchOutline />,\n  icon: iconProp,\n  onIconClick,\n  iconLabel,\n  clearLabel = 'Очистить',\n  clearButtonTestId,\n  noPadding,\n  findButtonText = 'Найти',\n  onFindButtonClick,\n  findButtonTestId,\n  hideClearButton,\n  getRef,\n\n  // input props\n  autoComplete = 'off',\n  autoCapitalize,\n  autoCorrect,\n  disabled,\n  list,\n  maxLength,\n  minLength,\n  name,\n  pattern,\n  placeholder: placeholderProp = 'Поиск',\n  enterKeyHint,\n  readOnly,\n  required,\n  value,\n  form,\n  id: idProp,\n  inputMode,\n  defaultValue,\n  autoFocus,\n  tabIndex,\n  spellCheck,\n  onChange: onChangeProp,\n  onFocus: onFocusProp,\n  onBlur: onBlurProp,\n\n  slotProps,\n  ...restProps\n}: SearchProps): React.ReactNode => {\n  /* istanbul ignore if: не проверяем в тестах */\n  if (process.env.NODE_ENV === 'development') {\n    if (getRef) {\n      warn('Свойство `getRef` устаревшее, используйте `slotProps={ input: { getRootRef: ... } }`');\n    }\n    if (clearButtonTestId) {\n      warn(\n        \"Свойство `clearButtonTestId` устаревшее, используйте `slotProps={ clearButton: { 'data-testid': ... } }`\",\n      );\n    }\n  }\n\n  const direction = useConfigDirection();\n  const isRtl = direction === 'rtl';\n\n  const rootRest = useMergeProps(restProps, slotProps?.root);\n\n  const {\n    id,\n    placeholder,\n    getRootRef: getInputRef,\n    onChange,\n    onFocus: onInputFocus,\n    onBlur: onInputBlur,\n    ...inputRest\n  } = useMergeProps(\n    {\n      getRootRef: getRef,\n      className: styles.nativeInput,\n      placeholder: placeholderProp,\n      autoComplete,\n      autoCapitalize,\n      autoCorrect,\n      disabled,\n      list,\n      maxLength,\n      minLength,\n      name,\n      pattern,\n      enterKeyHint,\n      readOnly,\n      required,\n      value,\n      form,\n      id: idProp,\n      inputMode,\n      defaultValue,\n      autoFocus,\n      tabIndex,\n      spellCheck,\n      onChange: onChangeProp,\n      onFocus: onFocusProp,\n      onBlur: onBlurProp,\n    },\n    slotProps?.input,\n  );\n\n  const {\n    onClick: onClearButtonClick,\n    onPointerDown: onClearButtonPointerDown,\n    ...clearButtonRest\n  } = useMergeProps({ className: styles.icon }, slotProps?.clearButton);\n\n  const inputRef = useExternRef(getInputRef);\n  const [isFocused, setFocusedTrue, setFocusedFalse] = useBooleanState(false);\n  const generatedId = React.useId();\n  const inputId = id ? id : `search-${generatedId}`;\n\n  const [hasValue, setHasValue] = React.useState<boolean>(() =>\n    Boolean(inputRest.value || inputRest.defaultValue),\n  );\n  const checkHasValue: React.ChangeEventHandler<HTMLInputElement> = (e) =>\n    setHasValue(Boolean(e.currentTarget.value));\n\n  const { density = 'none' } = useAdaptivity();\n  const { density: adaptiveDensity } = useAdaptivityConditionalRender();\n  const platform = usePlatform();\n\n  const hasAfter = platform === 'ios' && hasReactNode(after);\n\n  const onFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedTrue();\n    onInputFocus && onInputFocus(e);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedFalse();\n    onInputBlur && onInputBlur(e);\n  };\n\n  const onCancel = React.useCallback(() => {\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n      HTMLInputElement.prototype,\n      'value',\n    )?.set;\n    nativeInputValueSetter?.call(inputRef.current, '');\n\n    const ev2 = new Event('input', { bubbles: true });\n    inputRef.current?.dispatchEvent(ev2);\n  }, [inputRef]);\n\n  const onIconClickStart: React.PointerEventHandler<HTMLElement> = React.useCallback(\n    (e) => onIconClick?.(e),\n    [onIconClick],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    if (inputRest.value !== undefined) {\n      setHasValue(Boolean(inputRest.value));\n    }\n  }, [inputRest.value]);\n\n  useNativeFormResetListener(inputRef, () => {\n    setHasValue(Boolean(inputRest.defaultValue));\n  });\n\n  const renderIconButton: RenderIconButtonFn = (icon, props = {}) => (\n    <IconButton\n      hoverMode=\"opacity\"\n      onPointerDown={onIconClickStart}\n      className={styles.icon}\n      onFocus={setFocusedTrue}\n      onBlur={setFocusedFalse}\n      onClick={noop}\n      {...props}\n    >\n      <VisuallyHidden>{iconLabel}</VisuallyHidden>\n      {icon}\n    </IconButton>\n  );\n\n  const showControls = Boolean(\n    iconProp || !hideClearButton || (adaptiveDensity.compact && onFindButtonClick),\n  );\n\n  const onClearPointerDown: React.PointerEventHandler<HTMLElement> = (e) => {\n    // Сначала вызываем внешний обработчик, затем локальную логику, чтобы можно было предотвратить обработку фокуса на поле ввода.\n    onClearButtonPointerDown?.(e);\n\n    e.preventDefault();\n    inputRef.current?.focus();\n    if (touchEnabled()) {\n      onCancel();\n    }\n  };\n\n  const onClearClick: React.MouseEventHandler<HTMLElement> = (e) => {\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n      HTMLInputElement.prototype,\n      'value',\n    )?.set;\n    nativeInputValueSetter?.call(inputRef.current, '');\n\n    const ev2 = new Event('input', { bubbles: true });\n    inputRef.current?.dispatchEvent(ev2);\n\n    onClearButtonClick?.(e);\n  };\n\n  return (\n    <RootComponent\n      baseClassName={classNames(\n        'vkuiInternalSearch',\n        styles.host,\n        density === 'none' && styles.densityNone,\n        density === 'compact' && styles.densityCompact,\n        isFocused && styles.focused,\n        hasValue && styles.hasValue,\n        hasAfter && styles.hasAfter,\n        iconProp && styles.hasIcon,\n        inputRest.disabled && styles.disabled,\n        !noPadding && styles.withPadding,\n        isRtl && styles.rtl,\n      )}\n      {...rootRest}\n    >\n      <div className={styles.field}>\n        <label htmlFor={inputId} className={styles.label}>\n          {placeholder}\n        </label>\n        <div className={styles.input}>\n          {before}\n          <Headline\n            Component=\"input\"\n            type=\"search\"\n            level=\"1\"\n            weight=\"3\"\n            id={inputId}\n            placeholder={placeholder}\n            getRootRef={inputRef}\n            onChange={callMultiple(onChange, checkHasValue)}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            {...inputRest}\n          />\n        </div>\n        {showControls && (\n          <div className={styles.controls}>\n            {iconProp &&\n              (typeof iconProp === 'function'\n                ? iconProp(renderIconButton)\n                : renderIconButton(iconProp))}\n            {!hideClearButton && (\n              <IconButton\n                hoverMode=\"opacity\"\n                onPointerDown={onClearPointerDown}\n                onClick={onClearClick}\n                tabIndex={hasValue ? undefined : -1}\n                disabled={inputRest.disabled}\n                data-testid={clearButtonTestId}\n                {...clearButtonRest}\n              >\n                <VisuallyHidden>{clearLabel}</VisuallyHidden>\n                {platform === 'ios' ? <Icon16Clear /> : <Icon24Cancel />}\n              </IconButton>\n            )}\n            {adaptiveDensity.compact && onFindButtonClick && (\n              <Button\n                mode=\"primary\"\n                size=\"m\"\n                className={classNames(styles.findButton, adaptiveDensity.compact.className)}\n                focusVisibleMode=\"inside\"\n                onClick={onFindButtonClick}\n                tabIndex={hasValue ? undefined : -1}\n                data-testid={findButtonTestId}\n              >\n                {findButtonText}\n              </Button>\n            )}\n          </div>\n        )}\n      </div>\n      {hasAfter && (\n        <div className={styles.after}>\n          <Button\n            mode=\"tertiary\"\n            size=\"m\"\n            focusVisibleMode=\"inside\"\n            hoverMode=\"opacity\"\n            activeMode=\"opacity\"\n            onClick={onCancel}\n            onFocus={setFocusedTrue}\n            onBlur={setFocusedFalse}\n          >\n            <span className={styles.afterTextClip}>{after}</span>\n          </Button>\n        </div>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","Icon16Clear","Icon16SearchOutline","Icon24Cancel","classNames","hasReactNode","noop","useAdaptivity","useAdaptivityConditionalRender","useBooleanState","useConfigDirection","useExternRef","useMergeProps","useNativeFormResetListener","usePlatform","callMultiple","touchEnabled","useIsomorphicLayoutEffect","warnOnce","Button","IconButton","RootComponent","Headline","VisuallyHidden","warn","Search","after","before","icon","iconProp","onIconClick","iconLabel","clearLabel","clearButtonTestId","noPadding","findButtonText","onFindButtonClick","findButtonTestId","hideClearButton","getRef","autoComplete","autoCapitalize","autoCorrect","disabled","list","maxLength","minLength","name","pattern","placeholder","placeholderProp","enterKeyHint","readOnly","required","value","form","id","idProp","inputMode","defaultValue","autoFocus","tabIndex","spellCheck","onChange","onChangeProp","onFocus","onFocusProp","onBlur","onBlurProp","slotProps","restProps","process","env","NODE_ENV","direction","isRtl","rootRest","root","getRootRef","getInputRef","onInputFocus","onInputBlur","inputRest","className","input","onClick","onClearButtonClick","onPointerDown","onClearButtonPointerDown","clearButtonRest","clearButton","inputRef","isFocused","setFocusedTrue","setFocusedFalse","generatedId","useId","inputId","hasValue","setHasValue","useState","Boolean","checkHasValue","e","currentTarget","density","adaptiveDensity","platform","hasAfter","onCancel","useCallback","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","undefined","renderIconButton","props","hoverMode","showControls","compact","onClearPointerDown","preventDefault","focus","onClearClick","baseClassName","div","label","htmlFor","Component","type","level","weight","data-testid","mode","size","focusVisibleMode","activeMode","span"],"mappings":"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"}

package/dist/components/SegmentedControl/SegmentedControl.d.ts

@@ -6,7 +6,7 @@ export interface SegmentedControlOptionInterface<T extends SegmentedControlValue
      * Вставляет элемент перед основным контентом.
      * Рекомендуется использовать только иконки с размером 20.
      */
-    before?: React.ReactNode;
+    before?: React.ReactNode | undefined;
     /**
      * Текст или React-элемент, отображаемый в качестве метки опции.
      */
@@ -24,23 +24,23 @@ export interface SegmentedControlProps<T extends SegmentedControlValue = Segment
     /**
      * Размер компонента.
      */
-    size?: 'm' | 'l';
+    size?: 'm' | 'l' | undefined;
     /**
      * Имя для input-элементов внутри компонента.
      */
-    name?: string;
+    name?: string | undefined;
     /**
      * Обработчик изменения выбранного значения.
      */
-    onChange?: (value: T) => void;
+    onChange?: ((value: T) => void) | undefined;
     /**
      * Текущее выбранное значение (для контролируемого компонента).
      */
-    value?: T;
+    value?: T | undefined;
     /**
      * Значение по умолчанию (для неконтролируемого компонента).
      */
-    defaultValue?: T;
+    defaultValue?: T | undefined;
 }
 /**
  * @see https://vkui.io/components/segmented-control

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

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EAAuB,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAalF,MAAM,MAAM,qBAAqB,GAAG,MAAM,GAAG,MAAM,CAAC;AAEpD,MAAM,WAAW,+BAA+B,CAC9C,CAAC,SAAS,qBAAqB,GAAG,qBAAqB,CACvD,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IACxD;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;OAEG;IACH,KAAK,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,qBAAqB,CAAC,CAAC,SAAS,qBAAqB,GAAG,qBAAqB,CAC5F,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACnE;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,+BAA+B,CAAC,CAAC,CAAC,CAAC,CAAC;IACnD;;OAEG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B;;OAEG;IACH,KAAK,CAAC,EAAE,CAAC,CAAC;IACV;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC;CAClB;AAID;;GAEG;AACH,eAAO,MAAM,gBAAgB,GAAI,CAAC,SAAS,qBAAqB,GAAG,qBAAqB,EAAE,+GAUvF,qBAAqB,CAAC,CAAC,CAAC,KAAG,KAAK,CAAC,SA+EnC,CAAC"}
+{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EAAuB,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAalF,MAAM,MAAM,qBAAqB,GAAG,MAAM,GAAG,MAAM,CAAC;AAEpD,MAAM,WAAW,+BAA+B,CAC9C,CAAC,SAAS,qBAAqB,GAAG,qBAAqB,CACvD,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IACxD;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACrC;;OAEG;IACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;OAEG;IACH,KAAK,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,qBAAqB,CAAC,CAAC,SAAS,qBAAqB,GAAG,qBAAqB,CAC5F,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACnE;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,+BAA+B,CAAC,CAAC,CAAC,CAAC,CAAC;IACnD;;OAEG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,SAAS,CAAC;IAC7B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IAC5C;;OAEG;IACH,KAAK,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC;IACtB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC;CAC9B;AAID;;GAEG;AACH,eAAO,MAAM,gBAAgB,GAAI,CAAC,SAAS,qBAAqB,GAAG,qBAAqB,EAAE,+GAUvF,qBAAqB,CAAC,CAAC,CAAC,KAAG,KAAK,CAAC,SA+EnC,CAAC"}

package/dist/components/SegmentedControl/SegmentedControl.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useConfigDirection } from '../../hooks/useConfigDirection';\nimport { useCustomEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useTabsNavigation } from '../../hooks/useTabsNavigation';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { CSSCustomProperties, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport {\n  SegmentedControlOption,\n  type SegmentedControlOptionProps,\n} from './SegmentedControlOption/SegmentedControlOption';\nimport styles from './SegmentedControl.module.css';\n\nconst densityClassNames = {\n  none: styles.densityNone,\n  regular: styles.densityRegular,\n};\n\nexport type SegmentedControlValue = string | number;\n\nexport interface SegmentedControlOptionInterface<\n  T extends SegmentedControlValue = SegmentedControlValue,\n> extends Omit<React.HTMLAttributes<HTMLElement>, 'label'> {\n  /**\n   * Вставляет элемент перед основным контентом.\n   * Рекомендуется использовать только иконки с размером 20.\n   */\n  before?: React.ReactNode;\n  /**\n   * Текст или React-элемент, отображаемый в качестве метки опции.\n   */\n  label: React.ReactNode;\n  /**\n   * Значение опции, которое будет передано в обработчик onChange при выборе.\n   */\n  value: T;\n}\n\nexport interface SegmentedControlProps<T extends SegmentedControlValue = SegmentedControlValue>\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'> {\n  /**\n   * Массив опций для отображения в компоненте.\n   */\n  options: Array<SegmentedControlOptionInterface<T>>;\n  /**\n   * Размер компонента.\n   */\n  size?: 'm' | 'l';\n  /**\n   * Имя для input-элементов внутри компонента.\n   */\n  name?: string;\n  /**\n   * Обработчик изменения выбранного значения.\n   */\n  onChange?: (value: T) => void;\n  /**\n   * Текущее выбранное значение (для контролируемого компонента).\n   */\n  value?: T;\n  /**\n   * Значение по умолчанию (для неконтролируемого компонента).\n   */\n  defaultValue?: T;\n}\n\nconst warn = warnOnce('SegmentedControl');\n\n/**\n * @see https://vkui.io/components/segmented-control\n */\nexport const SegmentedControl = <T extends SegmentedControlValue = SegmentedControlValue>({\n  size = 'l',\n  name,\n  options,\n  defaultValue = options[0]?.value,\n  children,\n  onChange: onChangeProp,\n  value: valueProp,\n  role = 'radiogroup',\n  ...restProps\n}: SegmentedControlProps<T>): React.ReactNode => {\n  const id = React.useId();\n  const direction = useConfigDirection();\n  const isRtl = direction === 'rtl';\n\n  const [value, onChange] = useCustomEnsuredControl({\n    onChange: onChangeProp,\n    value: valueProp,\n    defaultValue,\n  });\n\n  const { density = 'none' } = useAdaptivity();\n\n  const { tabsRef } = useTabsNavigation(role === 'tablist', isRtl);\n\n  const actualIndex = options.findIndex((option) => option.value === value);\n\n  useIsomorphicLayoutEffect(() => {\n    if (actualIndex === -1 && process.env.NODE_ENV === 'development') {\n      warn('defaultValue: такого значения нет среди опций!', 'error');\n    }\n  }, [actualIndex]);\n\n  const sliderStyle: CSSCustomProperties = {\n    '--vkui_internal--SegmentedControl_actual_index': String(actualIndex),\n    '--vkui_internal--SegmentedControl_options': String(options.length),\n  };\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        density !== 'compact' && densityClassNames[density],\n        size === 'l' && styles.sizeL,\n        isRtl && styles.rtl,\n      )}\n    >\n      <div role={role} ref={tabsRef} className={styles.in}>\n        {actualIndex > -1 && <div aria-hidden className={styles.slider} style={sliderStyle} />}\n        {options.map(({ label, before, ...optionProps }) => {\n          const selected = value === optionProps.value;\n          const onSelect = () => onChange(optionProps.value);\n          const optionRootProps: SegmentedControlOptionProps['rootProps'] =\n            role === 'tablist'\n              ? {\n                  'role': 'tab',\n                  'aria-selected': selected,\n                  'onClick': onSelect,\n                  'tabIndex': optionProps.tabIndex ?? (selected ? 0 : -1),\n                  ...optionProps,\n                }\n              : undefined;\n\n          const optionInputProps: SegmentedControlOptionProps['inputProps'] =\n            role !== 'tablist'\n              ? {\n                  role: optionProps.role || (role === 'radiogroup' ? 'radio' : undefined),\n                  checked: selected,\n                  onChange: onSelect,\n                  name: name ?? id,\n                  ...optionProps,\n                }\n              : undefined;\n\n          return (\n            <SegmentedControlOption\n              key={`${optionProps.value}`}\n              before={before}\n              rootProps={optionRootProps}\n              inputProps={optionInputProps}\n            >\n              {label}\n            </SegmentedControlOption>\n          );\n        })}\n      </div>\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useConfigDirection","useCustomEnsuredControl","useTabsNavigation","useIsomorphicLayoutEffect","warnOnce","RootComponent","SegmentedControlOption","densityClassNames","none","regular","warn","SegmentedControl","size","name","options","defaultValue","value","children","onChange","onChangeProp","valueProp","role","restProps","id","useId","direction","isRtl","density","tabsRef","actualIndex","findIndex","option","process","env","NODE_ENV","sliderStyle","String","length","baseClassName","div","ref","className","aria-hidden","style","map","label","before","optionProps","selected","onSelect","optionRootProps","tabIndex","undefined","optionInputProps","checked","rootProps","inputProps"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,kBAAkB,QAAQ,oCAAiC;AACpE,SAASC,uBAAuB,QAAQ,mCAAgC;AACxE,SAASC,iBAAiB,QAAQ,mCAAgC;AAClE,SAASC,yBAAyB,QAAQ,yCAAsC;AAChF,SAASC,QAAQ,QAAQ,wBAAqB;AAE9C,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SACEC,sBAAsB,QAEjB,qDAAkD;AAGzD,MAAMC,oBAAoB;IACxBC,IAAI;IACJC,OAAO;AACT;AAkDA,MAAMC,OAAON,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMO,mBAAmB,CAA0D,EACxFC,OAAO,GAAG,EACVC,IAAI,EACJC,OAAO,EACPC,eAAeD,OAAO,CAAC,EAAE,EAAEE,KAAK,EAChCC,QAAQ,EACRC,UAAUC,YAAY,EACtBH,OAAOI,SAAS,EAChBC,OAAO,YAAY,EACnB,GAAGC,WACsB;IACzB,MAAMC,KAAK1B,MAAM2B,KAAK;IACtB,MAAMC,YAAYzB;IAClB,MAAM0B,QAAQD,cAAc;IAE5B,MAAM,CAACT,OAAOE,SAAS,GAAGjB,wBAAwB;QAChDiB,UAAUC;QACVH,OAAOI;QACPL;IACF;IAEA,MAAM,EAAEY,UAAU,MAAM,EAAE,GAAG5B;IAE7B,MAAM,EAAE6B,OAAO,EAAE,GAAG1B,kBAAkBmB,SAAS,WAAWK;IAE1D,MAAMG,cAAcf,QAAQgB,SAAS,CAAC,CAACC,SAAWA,OAAOf,KAAK,KAAKA;IAEnEb,0BAA0B;QACxB,IAAI0B,gBAAgB,CAAC,KAAKG,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;YAChExB,KAAK,kDAAkD;QACzD;IACF,GAAG;QAACmB;KAAY;IAEhB,MAAMM,cAAmC;QACvC,kDAAkDC,OAAOP;QACzD,6CAA6CO,OAAOtB,QAAQuB,MAAM;IACpE;IAEA,qBACE,KAAChC;QACE,GAAGiB,SAAS;QACbgB,eAAexC,yCAEb6B,YAAY,aAAapB,iBAAiB,CAACoB,QAAQ,EACnDf,SAAS,sCACTc;kBAGF,cAAA,MAACa;YAAIlB,MAAMA;YAAMmB,KAAKZ;YAASa,SAAS;;gBACrCZ,cAAc,CAAC,mBAAK,KAACU;oBAAIG,aAAW;oBAACD,SAAS;oBAAiBE,OAAOR;;gBACtErB,QAAQ8B,GAAG,CAAC,CAAC,EAAEC,KAAK,EAAEC,MAAM,EAAE,GAAGC,aAAa;oBAC7C,MAAMC,WAAWhC,UAAU+B,YAAY/B,KAAK;oBAC5C,MAAMiC,WAAW,IAAM/B,SAAS6B,YAAY/B,KAAK;oBACjD,MAAMkC,kBACJ7B,SAAS,YACL;wBACE,QAAQ;wBACR,iBAAiB2B;wBACjB,WAAWC;wBACX,YAAYF,YAAYI,QAAQ,IAAKH,CAAAA,WAAW,IAAI,CAAC,CAAA;wBACrD,GAAGD,WAAW;oBAChB,IACAK;oBAEN,MAAMC,mBACJhC,SAAS,YACL;wBACEA,MAAM0B,YAAY1B,IAAI,IAAKA,CAAAA,SAAS,eAAe,UAAU+B,SAAQ;wBACrEE,SAASN;wBACT9B,UAAU+B;wBACVpC,MAAMA,QAAQU;wBACd,GAAGwB,WAAW;oBAChB,IACAK;oBAEN,qBACE,KAAC9C;wBAECwC,QAAQA;wBACRS,WAAWL;wBACXM,YAAYH;kCAEXR;uBALI,GAAGE,YAAY/B,KAAK,EAAE;gBAQjC;;;;AAIR,EAAE"}
+{"version":3,"sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useConfigDirection } from '../../hooks/useConfigDirection';\nimport { useCustomEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useTabsNavigation } from '../../hooks/useTabsNavigation';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { CSSCustomProperties, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport {\n  SegmentedControlOption,\n  type SegmentedControlOptionProps,\n} from './SegmentedControlOption/SegmentedControlOption';\nimport styles from './SegmentedControl.module.css';\n\nconst densityClassNames = {\n  none: styles.densityNone,\n  regular: styles.densityRegular,\n};\n\nexport type SegmentedControlValue = string | number;\n\nexport interface SegmentedControlOptionInterface<\n  T extends SegmentedControlValue = SegmentedControlValue,\n> extends Omit<React.HTMLAttributes<HTMLElement>, 'label'> {\n  /**\n   * Вставляет элемент перед основным контентом.\n   * Рекомендуется использовать только иконки с размером 20.\n   */\n  before?: React.ReactNode | undefined;\n  /**\n   * Текст или React-элемент, отображаемый в качестве метки опции.\n   */\n  label: React.ReactNode;\n  /**\n   * Значение опции, которое будет передано в обработчик onChange при выборе.\n   */\n  value: T;\n}\n\nexport interface SegmentedControlProps<T extends SegmentedControlValue = SegmentedControlValue>\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'> {\n  /**\n   * Массив опций для отображения в компоненте.\n   */\n  options: Array<SegmentedControlOptionInterface<T>>;\n  /**\n   * Размер компонента.\n   */\n  size?: 'm' | 'l' | undefined;\n  /**\n   * Имя для input-элементов внутри компонента.\n   */\n  name?: string | undefined;\n  /**\n   * Обработчик изменения выбранного значения.\n   */\n  onChange?: ((value: T) => void) | undefined;\n  /**\n   * Текущее выбранное значение (для контролируемого компонента).\n   */\n  value?: T | undefined;\n  /**\n   * Значение по умолчанию (для неконтролируемого компонента).\n   */\n  defaultValue?: T | undefined;\n}\n\nconst warn = warnOnce('SegmentedControl');\n\n/**\n * @see https://vkui.io/components/segmented-control\n */\nexport const SegmentedControl = <T extends SegmentedControlValue = SegmentedControlValue>({\n  size = 'l',\n  name,\n  options,\n  defaultValue = options[0]?.value,\n  children,\n  onChange: onChangeProp,\n  value: valueProp,\n  role = 'radiogroup',\n  ...restProps\n}: SegmentedControlProps<T>): React.ReactNode => {\n  const id = React.useId();\n  const direction = useConfigDirection();\n  const isRtl = direction === 'rtl';\n\n  const [value, onChange] = useCustomEnsuredControl({\n    onChange: onChangeProp,\n    value: valueProp,\n    defaultValue,\n  });\n\n  const { density = 'none' } = useAdaptivity();\n\n  const { tabsRef } = useTabsNavigation(role === 'tablist', isRtl);\n\n  const actualIndex = options.findIndex((option) => option.value === value);\n\n  useIsomorphicLayoutEffect(() => {\n    if (actualIndex === -1 && process.env.NODE_ENV === 'development') {\n      warn('defaultValue: такого значения нет среди опций!', 'error');\n    }\n  }, [actualIndex]);\n\n  const sliderStyle: CSSCustomProperties = {\n    '--vkui_internal--SegmentedControl_actual_index': String(actualIndex),\n    '--vkui_internal--SegmentedControl_options': String(options.length),\n  };\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        density !== 'compact' && densityClassNames[density],\n        size === 'l' && styles.sizeL,\n        isRtl && styles.rtl,\n      )}\n    >\n      <div role={role} ref={tabsRef} className={styles.in}>\n        {actualIndex > -1 && <div aria-hidden className={styles.slider} style={sliderStyle} />}\n        {options.map(({ label, before, ...optionProps }) => {\n          const selected = value === optionProps.value;\n          const onSelect = () => onChange(optionProps.value);\n          const optionRootProps: SegmentedControlOptionProps['rootProps'] =\n            role === 'tablist'\n              ? {\n                  'role': 'tab',\n                  'aria-selected': selected,\n                  'onClick': onSelect,\n                  'tabIndex': optionProps.tabIndex ?? (selected ? 0 : -1),\n                  ...optionProps,\n                }\n              : undefined;\n\n          const optionInputProps: SegmentedControlOptionProps['inputProps'] =\n            role !== 'tablist'\n              ? {\n                  role: optionProps.role || (role === 'radiogroup' ? 'radio' : undefined),\n                  checked: selected,\n                  onChange: onSelect,\n                  name: name ?? id,\n                  ...optionProps,\n                }\n              : undefined;\n\n          return (\n            <SegmentedControlOption\n              key={`${optionProps.value}`}\n              before={before}\n              rootProps={optionRootProps}\n              inputProps={optionInputProps}\n            >\n              {label}\n            </SegmentedControlOption>\n          );\n        })}\n      </div>\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useConfigDirection","useCustomEnsuredControl","useTabsNavigation","useIsomorphicLayoutEffect","warnOnce","RootComponent","SegmentedControlOption","densityClassNames","none","regular","warn","SegmentedControl","size","name","options","defaultValue","value","children","onChange","onChangeProp","valueProp","role","restProps","id","useId","direction","isRtl","density","tabsRef","actualIndex","findIndex","option","process","env","NODE_ENV","sliderStyle","String","length","baseClassName","div","ref","className","aria-hidden","style","map","label","before","optionProps","selected","onSelect","optionRootProps","tabIndex","undefined","optionInputProps","checked","rootProps","inputProps"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,kBAAkB,QAAQ,oCAAiC;AACpE,SAASC,uBAAuB,QAAQ,mCAAgC;AACxE,SAASC,iBAAiB,QAAQ,mCAAgC;AAClE,SAASC,yBAAyB,QAAQ,yCAAsC;AAChF,SAASC,QAAQ,QAAQ,wBAAqB;AAE9C,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SACEC,sBAAsB,QAEjB,qDAAkD;AAGzD,MAAMC,oBAAoB;IACxBC,IAAI;IACJC,OAAO;AACT;AAkDA,MAAMC,OAAON,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMO,mBAAmB,CAA0D,EACxFC,OAAO,GAAG,EACVC,IAAI,EACJC,OAAO,EACPC,eAAeD,OAAO,CAAC,EAAE,EAAEE,KAAK,EAChCC,QAAQ,EACRC,UAAUC,YAAY,EACtBH,OAAOI,SAAS,EAChBC,OAAO,YAAY,EACnB,GAAGC,WACsB;IACzB,MAAMC,KAAK1B,MAAM2B,KAAK;IACtB,MAAMC,YAAYzB;IAClB,MAAM0B,QAAQD,cAAc;IAE5B,MAAM,CAACT,OAAOE,SAAS,GAAGjB,wBAAwB;QAChDiB,UAAUC;QACVH,OAAOI;QACPL;IACF;IAEA,MAAM,EAAEY,UAAU,MAAM,EAAE,GAAG5B;IAE7B,MAAM,EAAE6B,OAAO,EAAE,GAAG1B,kBAAkBmB,SAAS,WAAWK;IAE1D,MAAMG,cAAcf,QAAQgB,SAAS,CAAC,CAACC,SAAWA,OAAOf,KAAK,KAAKA;IAEnEb,0BAA0B;QACxB,IAAI0B,gBAAgB,CAAC,KAAKG,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;YAChExB,KAAK,kDAAkD;QACzD;IACF,GAAG;QAACmB;KAAY;IAEhB,MAAMM,cAAmC;QACvC,kDAAkDC,OAAOP;QACzD,6CAA6CO,OAAOtB,QAAQuB,MAAM;IACpE;IAEA,qBACE,KAAChC;QACE,GAAGiB,SAAS;QACbgB,eAAexC,yCAEb6B,YAAY,aAAapB,iBAAiB,CAACoB,QAAQ,EACnDf,SAAS,sCACTc;kBAGF,cAAA,MAACa;YAAIlB,MAAMA;YAAMmB,KAAKZ;YAASa,SAAS;;gBACrCZ,cAAc,CAAC,mBAAK,KAACU;oBAAIG,aAAW;oBAACD,SAAS;oBAAiBE,OAAOR;;gBACtErB,QAAQ8B,GAAG,CAAC,CAAC,EAAEC,KAAK,EAAEC,MAAM,EAAE,GAAGC,aAAa;oBAC7C,MAAMC,WAAWhC,UAAU+B,YAAY/B,KAAK;oBAC5C,MAAMiC,WAAW,IAAM/B,SAAS6B,YAAY/B,KAAK;oBACjD,MAAMkC,kBACJ7B,SAAS,YACL;wBACE,QAAQ;wBACR,iBAAiB2B;wBACjB,WAAWC;wBACX,YAAYF,YAAYI,QAAQ,IAAKH,CAAAA,WAAW,IAAI,CAAC,CAAA;wBACrD,GAAGD,WAAW;oBAChB,IACAK;oBAEN,MAAMC,mBACJhC,SAAS,YACL;wBACEA,MAAM0B,YAAY1B,IAAI,IAAKA,CAAAA,SAAS,eAAe,UAAU+B,SAAQ;wBACrEE,SAASN;wBACT9B,UAAU+B;wBACVpC,MAAMA,QAAQU;wBACd,GAAGwB,WAAW;oBAChB,IACAK;oBAEN,qBACE,KAAC9C;wBAECwC,QAAQA;wBACRS,WAAWL;wBACXM,YAAYH;kCAEXR;uBALI,GAAGE,YAAY/B,KAAK,EAAE;gBAQjC;;;;AAIR,EAAE"}

package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts

@@ -1,9 +1,9 @@
 import type * as React from 'react';
 import type { HasChildren, HasRef, HasRootRef } from '../../../types';
 export interface SegmentedControlOptionProps extends HasRootRef<HTMLLabelElement>, HasRef<HTMLInputElement>, HasChildren {
-    rootProps?: React.LabelHTMLAttributes<HTMLLabelElement>;
-    inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
-    before?: React.ReactNode;
+    rootProps?: React.LabelHTMLAttributes<HTMLLabelElement> | undefined;
+    inputProps?: React.InputHTMLAttributes<HTMLInputElement> | undefined;
+    before?: React.ReactNode | undefined;
 }
 export declare const SegmentedControlOption: ({ getRef, children, getRootRef, before, rootProps, inputProps, }: SegmentedControlOptionProps) => React.ReactNode;
 //# sourceMappingURL=SegmentedControlOption.d.ts.map

package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlOption.d.ts","sourceRoot":"","sources":["../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAMtE,MAAM,WAAW,2BACf,SAAQ,UAAU,CAAC,gBAAgB,CAAC,EAClC,MAAM,CAAC,gBAAgB,CAAC,EACxB,WAAW;IACb,SAAS,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;IACxD,UAAU,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;IACzD,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,eAAO,MAAM,sBAAsB,GAAI,kEAOpC,2BAA2B,KAAG,KAAK,CAAC,SAiBtC,CAAC"}
+{"version":3,"file":"SegmentedControlOption.d.ts","sourceRoot":"","sources":["../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAMtE,MAAM,WAAW,2BACf,SAAQ,UAAU,CAAC,gBAAgB,CAAC,EAClC,MAAM,CAAC,gBAAgB,CAAC,EACxB,WAAW;IACb,SAAS,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,GAAG,SAAS,CAAC;IACpE,UAAU,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,GAAG,SAAS,CAAC;IACrE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;CACtC;AAED,eAAO,MAAM,sBAAsB,GAAI,kEAOpC,2BAA2B,KAAG,KAAK,CAAC,SAiBtC,CAAC"}

package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport type * as React from 'react';\nimport { hasReactNode } from '@vkontakte/vkjs';\nimport type { HasChildren, HasRef, HasRootRef } from '../../../types';\nimport { Clickable } from '../../Clickable/Clickable';\nimport { Headline } from '../../Typography/Headline/Headline';\nimport { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';\nimport styles from './SegmentedControlOption.module.css';\n\nexport interface SegmentedControlOptionProps\n  extends HasRootRef<HTMLLabelElement>,\n    HasRef<HTMLInputElement>,\n    HasChildren {\n  rootProps?: React.LabelHTMLAttributes<HTMLLabelElement>;\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n  before?: React.ReactNode;\n}\n\nexport const SegmentedControlOption = ({\n  getRef,\n  children,\n  getRootRef,\n  before,\n  rootProps,\n  inputProps,\n}: SegmentedControlOptionProps): React.ReactNode => (\n  <Clickable\n    Component=\"label\"\n    baseClassName={styles.host}\n    hoverClassName={styles.hover}\n    activeClassName={styles.hover}\n    getRootRef={getRootRef}\n    {...rootProps}\n  >\n    {inputProps && (\n      <VisuallyHidden {...inputProps} Component=\"input\" getRootRef={getRef} type=\"radio\" />\n    )}\n    {hasReactNode(before) && <div className={styles.before}>{before}</div>}\n    <Headline level=\"2\" weight=\"2\">\n      {children}\n    </Headline>\n  </Clickable>\n);\n"],"names":["hasReactNode","Clickable","Headline","VisuallyHidden","SegmentedControlOption","getRef","children","getRootRef","before","rootProps","inputProps","Component","baseClassName","hoverClassName","activeClassName","type","div","className","level","weight"],"mappings":"AAAA;;AAIA,SAASA,YAAY,QAAQ,kBAAkB;AAE/C,SAASC,SAAS,QAAQ,+BAA4B;AACtD,SAASC,QAAQ,QAAQ,wCAAqC;AAC9D,SAASC,cAAc,QAAQ,yCAAsC;AAYrE,OAAO,MAAMC,yBAAyB,CAAC,EACrCC,MAAM,EACNC,QAAQ,EACRC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,UAAU,EACkB,iBAC5B,MAACT;QACCU,WAAU;QACVC,aAAa;QACbC,cAAc;QACdC,eAAe;QACfP,YAAYA;QACX,GAAGE,SAAS;;YAEZC,4BACC,KAACP;gBAAgB,GAAGO,UAAU;gBAAEC,WAAU;gBAAQJ,YAAYF;gBAAQU,MAAK;;YAE5Ef,aAAaQ,yBAAW,KAACQ;gBAAIC,SAAS;0BAAkBT;;0BACzD,KAACN;gBAASgB,OAAM;gBAAIC,QAAO;0BACxBb;;;OAGL"}
+{"version":3,"sources":["../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport type * as React from 'react';\nimport { hasReactNode } from '@vkontakte/vkjs';\nimport type { HasChildren, HasRef, HasRootRef } from '../../../types';\nimport { Clickable } from '../../Clickable/Clickable';\nimport { Headline } from '../../Typography/Headline/Headline';\nimport { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';\nimport styles from './SegmentedControlOption.module.css';\n\nexport interface SegmentedControlOptionProps\n  extends HasRootRef<HTMLLabelElement>,\n    HasRef<HTMLInputElement>,\n    HasChildren {\n  rootProps?: React.LabelHTMLAttributes<HTMLLabelElement> | undefined;\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement> | undefined;\n  before?: React.ReactNode | undefined;\n}\n\nexport const SegmentedControlOption = ({\n  getRef,\n  children,\n  getRootRef,\n  before,\n  rootProps,\n  inputProps,\n}: SegmentedControlOptionProps): React.ReactNode => (\n  <Clickable\n    Component=\"label\"\n    baseClassName={styles.host}\n    hoverClassName={styles.hover}\n    activeClassName={styles.hover}\n    getRootRef={getRootRef}\n    {...rootProps}\n  >\n    {inputProps && (\n      <VisuallyHidden {...inputProps} Component=\"input\" getRootRef={getRef} type=\"radio\" />\n    )}\n    {hasReactNode(before) && <div className={styles.before}>{before}</div>}\n    <Headline level=\"2\" weight=\"2\">\n      {children}\n    </Headline>\n  </Clickable>\n);\n"],"names":["hasReactNode","Clickable","Headline","VisuallyHidden","SegmentedControlOption","getRef","children","getRootRef","before","rootProps","inputProps","Component","baseClassName","hoverClassName","activeClassName","type","div","className","level","weight"],"mappings":"AAAA;;AAIA,SAASA,YAAY,QAAQ,kBAAkB;AAE/C,SAASC,SAAS,QAAQ,+BAA4B;AACtD,SAASC,QAAQ,QAAQ,wCAAqC;AAC9D,SAASC,cAAc,QAAQ,yCAAsC;AAYrE,OAAO,MAAMC,yBAAyB,CAAC,EACrCC,MAAM,EACNC,QAAQ,EACRC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,UAAU,EACkB,iBAC5B,MAACT;QACCU,WAAU;QACVC,aAAa;QACbC,cAAc;QACdC,eAAe;QACfP,YAAYA;QACX,GAAGE,SAAS;;YAEZC,4BACC,KAACP;gBAAgB,GAAGO,UAAU;gBAAEC,WAAU;gBAAQJ,YAAYF;gBAAQU,MAAK;;YAE5Ef,aAAaQ,yBAAW,KAACQ;gBAAIC,SAAS;0BAAkBT;;0BACzD,KAACN;gBAASgB,OAAM;gBAAIC,QAAO;0BACxBb;;;OAGL"}

package/dist/components/SelectMimicry/SelectMimicry.d.ts

@@ -6,15 +6,15 @@ export interface SelectMimicryProps extends React.AllHTMLAttributes<HTMLElement>
     /**
      * Включает многострочный режим отображения.
      */
-    multiline?: boolean;
+    multiline?: boolean | undefined;
     /**
      * Блокировка взаимодействия с компонентом.
      */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     /**
      * Тип селекта, влияющий на внешний вид компонента.
      */
-    selectType?: SelectType;
+    selectType?: SelectType | undefined;
 }
 /**
  * @see https://vkui.io/components/select-mimicry

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

@@ -1 +1 @@
-{"version":3,"file":"SelectMimicry.d.ts","sourceRoot":"","sources":["../../../src/components/SelectMimicry/SelectMimicry.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAMpC,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAExD,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AASnD,MAAM,WAAW,kBACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAC1C,UAAU,CAAC,WAAW,CAAC,EACvB,QAAQ,EACR,IAAI,CAAC,cAAc,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;IACrD;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB;AAED;;GAEG;AACH,eAAO,MAAM,aAAa,GAAI,6JAgB3B,kBAAkB,KAAG,KAAK,CAAC,SAqC7B,CAAC"}
+{"version":3,"file":"SelectMimicry.d.ts","sourceRoot":"","sources":["../../../src/components/SelectMimicry/SelectMimicry.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAMpC,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAExD,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AASnD,MAAM,WAAW,kBACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAC1C,UAAU,CAAC,WAAW,CAAC,EACvB,QAAQ,EACR,IAAI,CAAC,cAAc,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;IACrD;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAChC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;CACrC;AAED;;GAEG;AACH,eAAO,MAAM,aAAa,GAAI,6JAgB3B,kBAAkB,KAAG,KAAK,CAAC,SAqC7B,CAAC"}

package/dist/components/SelectMimicry/SelectMimicry.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SelectMimicry/SelectMimicry.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useAutoFocus } from '../../hooks/useAutoFocus';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { getFormFieldModeFromSelectType } from '../../lib/select';\nimport type { HasAlign, HasRootRef } from '../../types';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport type { SelectType } from '../Select/Select';\nimport { SelectTypography } from '../SelectTypography/SelectTypography';\nimport styles from '../Select/Select.module.css';\n\nconst densityClassNames = {\n  none: styles.densityNone,\n  compact: styles.densityCompact,\n};\n\nexport interface SelectMimicryProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasAlign,\n    Pick<FormFieldProps, 'before' | 'after' | 'status'> {\n  /**\n   * Включает многострочный режим отображения.\n   */\n  multiline?: boolean;\n  /**\n   * Блокировка взаимодействия с компонентом.\n   */\n  disabled?: boolean;\n  /**\n   * Тип селекта, влияющий на внешний вид компонента.\n   */\n  selectType?: SelectType;\n}\n\n/**\n * @see https://vkui.io/components/select-mimicry\n */\nexport const SelectMimicry = ({\n  tabIndex = 0,\n  placeholder,\n  children,\n  align,\n  getRootRef,\n  multiline,\n  disabled,\n  onClick,\n  before,\n  after = <DropdownIcon />,\n  selectType = 'default',\n  status,\n  className,\n  autoFocus,\n  ...restProps\n}: SelectMimicryProps): React.ReactNode => {\n  const rootRef = useExternRef(getRootRef);\n\n  const { density = 'none' } = useAdaptivity();\n  const title = children || placeholder;\n\n  useAutoFocus(rootRef, autoFocus);\n\n  return (\n    <FormField\n      {...restProps}\n      tabIndex={disabled ? undefined : tabIndex}\n      className={classNames(\n        styles.host,\n        density !== 'regular' && densityClassNames[density],\n        !children && styles.empty,\n        multiline && styles.multiline,\n        align === 'center' && styles.alignCenter,\n        align === 'right' && styles.alignRight,\n        before && styles.hasBefore,\n        className,\n      )}\n      getRootRef={rootRef}\n      onClick={disabled ? undefined : onClick}\n      disabled={disabled}\n      before={before}\n      after={after}\n      mode={getFormFieldModeFromSelectType(selectType)}\n      status={status}\n    >\n      <div className={styles.container}>\n        <SelectTypography selectType={selectType} className={styles.title}>\n          {title}\n        </SelectTypography>\n      </div>\n    </FormField>\n  );\n};\n"],"names":["classNames","useAdaptivity","useAutoFocus","useExternRef","getFormFieldModeFromSelectType","DropdownIcon","FormField","SelectTypography","densityClassNames","none","compact","SelectMimicry","tabIndex","placeholder","children","align","getRootRef","multiline","disabled","onClick","before","after","selectType","status","className","autoFocus","restProps","rootRef","density","title","undefined","mode","div"],"mappings":"AAAA;;AAGA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,8BAA8B,QAAQ,sBAAmB;AAElE,SAASC,YAAY,QAAQ,kCAA+B;AAC5D,SAASC,SAAS,QAA6B,4BAAyB;AAExE,SAASC,gBAAgB,QAAQ,0CAAuC;AAGxE,MAAMC,oBAAoB;IACxBC,IAAI;IACJC,OAAO;AACT;AAqBA;;CAEC,GACD,OAAO,MAAMC,gBAAgB,CAAC,EAC5BC,WAAW,CAAC,EACZC,WAAW,EACXC,QAAQ,EACRC,KAAK,EACLC,UAAU,EACVC,SAAS,EACTC,QAAQ,EACRC,OAAO,EACPC,MAAM,EACNC,sBAAQ,KAAChB,iBAAe,EACxBiB,aAAa,SAAS,EACtBC,MAAM,EACNC,SAAS,EACTC,SAAS,EACT,GAAGC,WACgB;IACnB,MAAMC,UAAUxB,aAAaa;IAE7B,MAAM,EAAEY,UAAU,MAAM,EAAE,GAAG3B;IAC7B,MAAM4B,QAAQf,YAAYD;IAE1BX,aAAayB,SAASF;IAEtB,qBACE,KAACnB;QACE,GAAGoB,SAAS;QACbd,UAAUM,WAAWY,YAAYlB;QACjCY,WAAWxB,+BAET4B,YAAY,aAAapB,iBAAiB,CAACoB,QAAQ,EACnD,CAACd,iCACDG,sCACAF,UAAU,uCACVA,UAAU,qCACVK,mCACAI;QAEFR,YAAYW;QACZR,SAASD,WAAWY,YAAYX;QAChCD,UAAUA;QACVE,QAAQA;QACRC,OAAOA;QACPU,MAAM3B,+BAA+BkB;QACrCC,QAAQA;kBAER,cAAA,KAACS;YAAIR,SAAS;sBACZ,cAAA,KAACjB;gBAAiBe,YAAYA;gBAAYE,SAAS;0BAChDK;;;;AAKX,EAAE"}
+{"version":3,"sources":["../../../src/components/SelectMimicry/SelectMimicry.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useAutoFocus } from '../../hooks/useAutoFocus';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { getFormFieldModeFromSelectType } from '../../lib/select';\nimport type { HasAlign, HasRootRef } from '../../types';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport type { SelectType } from '../Select/Select';\nimport { SelectTypography } from '../SelectTypography/SelectTypography';\nimport styles from '../Select/Select.module.css';\n\nconst densityClassNames = {\n  none: styles.densityNone,\n  compact: styles.densityCompact,\n};\n\nexport interface SelectMimicryProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasAlign,\n    Pick<FormFieldProps, 'before' | 'after' | 'status'> {\n  /**\n   * Включает многострочный режим отображения.\n   */\n  multiline?: boolean | undefined;\n  /**\n   * Блокировка взаимодействия с компонентом.\n   */\n  disabled?: boolean | undefined;\n  /**\n   * Тип селекта, влияющий на внешний вид компонента.\n   */\n  selectType?: SelectType | undefined;\n}\n\n/**\n * @see https://vkui.io/components/select-mimicry\n */\nexport const SelectMimicry = ({\n  tabIndex = 0,\n  placeholder,\n  children,\n  align,\n  getRootRef,\n  multiline,\n  disabled,\n  onClick,\n  before,\n  after = <DropdownIcon />,\n  selectType = 'default',\n  status,\n  className,\n  autoFocus,\n  ...restProps\n}: SelectMimicryProps): React.ReactNode => {\n  const rootRef = useExternRef(getRootRef);\n\n  const { density = 'none' } = useAdaptivity();\n  const title = children || placeholder;\n\n  useAutoFocus(rootRef, autoFocus);\n\n  return (\n    <FormField\n      {...restProps}\n      tabIndex={disabled ? undefined : tabIndex}\n      className={classNames(\n        styles.host,\n        density !== 'regular' && densityClassNames[density],\n        !children && styles.empty,\n        multiline && styles.multiline,\n        align === 'center' && styles.alignCenter,\n        align === 'right' && styles.alignRight,\n        before && styles.hasBefore,\n        className,\n      )}\n      getRootRef={rootRef}\n      onClick={disabled ? undefined : onClick}\n      disabled={disabled}\n      before={before}\n      after={after}\n      mode={getFormFieldModeFromSelectType(selectType)}\n      status={status}\n    >\n      <div className={styles.container}>\n        <SelectTypography selectType={selectType} className={styles.title}>\n          {title}\n        </SelectTypography>\n      </div>\n    </FormField>\n  );\n};\n"],"names":["classNames","useAdaptivity","useAutoFocus","useExternRef","getFormFieldModeFromSelectType","DropdownIcon","FormField","SelectTypography","densityClassNames","none","compact","SelectMimicry","tabIndex","placeholder","children","align","getRootRef","multiline","disabled","onClick","before","after","selectType","status","className","autoFocus","restProps","rootRef","density","title","undefined","mode","div"],"mappings":"AAAA;;AAGA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,8BAA8B,QAAQ,sBAAmB;AAElE,SAASC,YAAY,QAAQ,kCAA+B;AAC5D,SAASC,SAAS,QAA6B,4BAAyB;AAExE,SAASC,gBAAgB,QAAQ,0CAAuC;AAGxE,MAAMC,oBAAoB;IACxBC,IAAI;IACJC,OAAO;AACT;AAqBA;;CAEC,GACD,OAAO,MAAMC,gBAAgB,CAAC,EAC5BC,WAAW,CAAC,EACZC,WAAW,EACXC,QAAQ,EACRC,KAAK,EACLC,UAAU,EACVC,SAAS,EACTC,QAAQ,EACRC,OAAO,EACPC,MAAM,EACNC,sBAAQ,KAAChB,iBAAe,EACxBiB,aAAa,SAAS,EACtBC,MAAM,EACNC,SAAS,EACTC,SAAS,EACT,GAAGC,WACgB;IACnB,MAAMC,UAAUxB,aAAaa;IAE7B,MAAM,EAAEY,UAAU,MAAM,EAAE,GAAG3B;IAC7B,MAAM4B,QAAQf,YAAYD;IAE1BX,aAAayB,SAASF;IAEtB,qBACE,KAACnB;QACE,GAAGoB,SAAS;QACbd,UAAUM,WAAWY,YAAYlB;QACjCY,WAAWxB,+BAET4B,YAAY,aAAapB,iBAAiB,CAACoB,QAAQ,EACnD,CAACd,iCACDG,sCACAF,UAAU,uCACVA,UAAU,qCACVK,mCACAI;QAEFR,YAAYW;QACZR,SAASD,WAAWY,YAAYX;QAChCD,UAAUA;QACVE,QAAQA;QACRC,OAAOA;QACPU,MAAM3B,+BAA+BkB;QACrCC,QAAQA;kBAER,cAAA,KAACS;YAAIR,SAAS;sBACZ,cAAA,KAACjB;gBAAiBe,YAAYA;gBAAYE,SAAS;0BAChDK;;;;AAKX,EAAE"}

package/dist/components/SelectTypography/SelectTypography.d.ts

@@ -1,7 +1,7 @@
 import type { SelectType } from '../Select/Select';
 import { type TextProps } from '../Typography/Text/Text';
 export interface SelectTypographyProps extends TextProps {
-    selectType?: SelectType;
+    selectType?: SelectType | undefined;
 }
 /**
  * @private

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

@@ -1 +1 @@
-{"version":3,"file":"SelectTypography.d.ts","sourceRoot":"","sources":["../../../src/components/SelectTypography/SelectTypography.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAE/D,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB,GAAI,wCAI9B,qBAAqB,KAAG,KAAK,CAAC,SAMhC,CAAC"}
+{"version":3,"file":"SelectTypography.d.ts","sourceRoot":"","sources":["../../../src/components/SelectTypography/SelectTypography.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAE/D,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD,UAAU,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;CACrC;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB,GAAI,wCAI9B,qBAAqB,KAAG,KAAK,CAAC,SAMhC,CAAC"}

package/dist/components/SelectTypography/SelectTypography.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SelectTypography/SelectTypography.tsx"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\n\nimport type { SelectType } from '../Select/Select';\nimport { Text, type TextProps } from '../Typography/Text/Text';\n\nexport interface SelectTypographyProps extends TextProps {\n  selectType?: SelectType;\n}\n\n/**\n * @private\n */\nexport const SelectTypography = ({\n  selectType = 'default',\n  children,\n  ...restProps\n}: SelectTypographyProps): React.ReactNode => {\n  return (\n    <Text weight={selectType === 'accent' ? '2' : '3'} {...restProps}>\n      {children}\n    </Text>\n  );\n};\n"],"names":["Text","SelectTypography","selectType","children","restProps","weight"],"mappings":"AAAA,sCAAsC;AAGtC,SAASA,IAAI,QAAwB,6BAA0B;AAM/D;;CAEC,GACD,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,aAAa,SAAS,EACtBC,QAAQ,EACR,GAAGC,WACmB;IACtB,qBACE,KAACJ;QAAKK,QAAQH,eAAe,WAAW,MAAM;QAAM,GAAGE,SAAS;kBAC7DD;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/SelectTypography/SelectTypography.tsx"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\n\nimport type { SelectType } from '../Select/Select';\nimport { Text, type TextProps } from '../Typography/Text/Text';\n\nexport interface SelectTypographyProps extends TextProps {\n  selectType?: SelectType | undefined;\n}\n\n/**\n * @private\n */\nexport const SelectTypography = ({\n  selectType = 'default',\n  children,\n  ...restProps\n}: SelectTypographyProps): React.ReactNode => {\n  return (\n    <Text weight={selectType === 'accent' ? '2' : '3'} {...restProps}>\n      {children}\n    </Text>\n  );\n};\n"],"names":["Text","SelectTypography","selectType","children","restProps","weight"],"mappings":"AAAA,sCAAsC;AAGtC,SAASA,IAAI,QAAwB,6BAA0B;AAM/D;;CAEC,GACD,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,aAAa,SAAS,EACtBC,QAAQ,EACR,GAAGC,WACmB;IACtB,qBACE,KAACJ;QAAKK,QAAQH,eAAe,WAAW,MAAM;QAAM,GAAGE,SAAS;kBAC7DD;;AAGP,EAAE"}

package/dist/components/SelectionControl/SelectionControl.d.ts

@@ -6,7 +6,7 @@ export interface SelectionControlProps extends React.ComponentProps<'label'>, Ha
     /**
      * Отключает отступы. При использовании этого свойства, значение по умолчанию для свойств `hoverMode` и `activeMode` становится `"opacity"`.
      */
-    noPadding?: boolean;
+    noPadding?: boolean | undefined;
 }
 /**
  * @see https://vkui.io/components/selection-control

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

@@ -1 +1 @@
-{"version":3,"file":"SelectionControl.d.ts","sourceRoot":"","sources":["../../../src/components/SelectionControl/SelectionControl.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAIpC,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE5D,OAAO,EAAY,KAAK,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAExE,OAAO,EAAE,qBAAqB,EAAE,MAAM,+CAA+C,CAAC;AAQtF,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EACnC,UAAU,CAAC,gBAAgB,CAAC,EAC5B,YAAY,EACZ,IAAI,CACF,iBAAiB,EACjB,WAAW,GAAG,YAAY,GAAG,UAAU,GAAG,WAAW,GAAG,kBAAkB,GAAG,UAAU,CACxF;IACH;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB;wFAK1B,qBAAqB,GAAG,KAAK,CAAC,SAAS;;CAuBzC,CAAC"}
+{"version":3,"file":"SelectionControl.d.ts","sourceRoot":"","sources":["../../../src/components/SelectionControl/SelectionControl.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAIpC,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE5D,OAAO,EAAY,KAAK,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAExE,OAAO,EAAE,qBAAqB,EAAE,MAAM,+CAA+C,CAAC;AAQtF,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EACnC,UAAU,CAAC,gBAAgB,CAAC,EAC5B,YAAY,EACZ,IAAI,CACF,iBAAiB,EACjB,WAAW,GAAG,YAAY,GAAG,UAAU,GAAG,WAAW,GAAG,kBAAkB,GAAG,UAAU,CACxF;IACH;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CACjC;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB;wFAK1B,qBAAqB,GAAG,KAAK,CAAC,SAAS;;CAuBzC,CAAC"}

package/dist/components/SelectionControl/SelectionControl.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SelectionControl/SelectionControl.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { HasComponent, HasRootRef } from '../../types';\nimport { DEFAULT_ACTIVE_EFFECT_DELAY } from '../Clickable/useState';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport { SelectionControlContext } from './SelectionControlContext';\nimport { SelectionControlLabel } from './SelectionControlLabel/SelectionControlLabel';\nimport styles from './SelectionControl.module.css';\n\nconst densityClassNames = {\n  none: styles.densityNone,\n  compact: styles.densityCompact,\n};\n\nexport interface SelectionControlProps\n  extends React.ComponentProps<'label'>,\n    HasRootRef<HTMLLabelElement>,\n    HasComponent,\n    Pick<\n      TappableOmitProps,\n      'hoverMode' | 'activeMode' | 'hasHover' | 'hasActive' | 'focusVisibleMode' | 'disabled'\n    > {\n  /**\n   * Отключает отступы. При использовании этого свойства, значение по умолчанию для свойств `hoverMode` и `activeMode` становится `\"opacity\"`.\n   */\n  noPadding?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/selection-control\n */\nexport const SelectionControl = ({\n  noPadding = false,\n  hoverMode: hoverModeProp,\n  activeMode: activeModeProp,\n  ...restProps\n}: SelectionControlProps): React.ReactNode => {\n  const { density = 'none' } = useAdaptivity();\n  const platform = usePlatform();\n\n  const hoverMode = hoverModeProp || (noPadding ? 'opacity' : 'background');\n  const activeMode = activeModeProp || (noPadding ? 'opacity' : 'background');\n\n  return (\n    <SelectionControlContext.Provider value={{ noPadding }}>\n      <Tappable\n        Component=\"label\"\n        baseClassName={classNames(\n          styles.host,\n          density !== 'regular' && densityClassNames[density],\n          !noPadding && styles.withPadding,\n        )}\n        activeEffectDelay={platform === 'ios' ? 100 : DEFAULT_ACTIVE_EFFECT_DELAY}\n        hoverMode={hoverMode}\n        activeMode={activeMode}\n        {...restProps}\n      />\n    </SelectionControlContext.Provider>\n  );\n};\n\nSelectionControl.Label = SelectionControlLabel;\n"],"names":["classNames","useAdaptivity","usePlatform","DEFAULT_ACTIVE_EFFECT_DELAY","Tappable","SelectionControlContext","SelectionControlLabel","densityClassNames","none","compact","SelectionControl","noPadding","hoverMode","hoverModeProp","activeMode","activeModeProp","restProps","density","platform","Provider","value","Component","baseClassName","activeEffectDelay","Label"],"mappings":"AAAA;;AAGA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,2BAA2B,QAAQ,2BAAwB;AACpE,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,uBAAuB,QAAQ,+BAA4B;AACpE,SAASC,qBAAqB,QAAQ,mDAAgD;AAGtF,MAAMC,oBAAoB;IACxBC,IAAI;IACJC,OAAO;AACT;AAgBA;;CAEC,GACD,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,YAAY,KAAK,EACjBC,WAAWC,aAAa,EACxBC,YAAYC,cAAc,EAC1B,GAAGC,WACmB;IACtB,MAAM,EAAEC,UAAU,MAAM,EAAE,GAAGhB;IAC7B,MAAMiB,WAAWhB;IAEjB,MAAMU,YAAYC,iBAAkBF,CAAAA,YAAY,YAAY,YAAW;IACvE,MAAMG,aAAaC,kBAAmBJ,CAAAA,YAAY,YAAY,YAAW;IAEzE,qBACE,KAACN,wBAAwBc,QAAQ;QAACC,OAAO;YAAET;QAAU;kBACnD,cAAA,KAACP;YACCiB,WAAU;YACVC,eAAetB,yCAEbiB,YAAY,aAAaV,iBAAiB,CAACU,QAAQ,EACnD,CAACN;YAEHY,mBAAmBL,aAAa,QAAQ,MAAMf;YAC9CS,WAAWA;YACXE,YAAYA;YACX,GAAGE,SAAS;;;AAIrB,EAAE;AAEFN,iBAAiBc,KAAK,GAAGlB"}
+{"version":3,"sources":["../../../src/components/SelectionControl/SelectionControl.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { HasComponent, HasRootRef } from '../../types';\nimport { DEFAULT_ACTIVE_EFFECT_DELAY } from '../Clickable/useState';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport { SelectionControlContext } from './SelectionControlContext';\nimport { SelectionControlLabel } from './SelectionControlLabel/SelectionControlLabel';\nimport styles from './SelectionControl.module.css';\n\nconst densityClassNames = {\n  none: styles.densityNone,\n  compact: styles.densityCompact,\n};\n\nexport interface SelectionControlProps\n  extends React.ComponentProps<'label'>,\n    HasRootRef<HTMLLabelElement>,\n    HasComponent,\n    Pick<\n      TappableOmitProps,\n      'hoverMode' | 'activeMode' | 'hasHover' | 'hasActive' | 'focusVisibleMode' | 'disabled'\n    > {\n  /**\n   * Отключает отступы. При использовании этого свойства, значение по умолчанию для свойств `hoverMode` и `activeMode` становится `\"opacity\"`.\n   */\n  noPadding?: boolean | undefined;\n}\n\n/**\n * @see https://vkui.io/components/selection-control\n */\nexport const SelectionControl = ({\n  noPadding = false,\n  hoverMode: hoverModeProp,\n  activeMode: activeModeProp,\n  ...restProps\n}: SelectionControlProps): React.ReactNode => {\n  const { density = 'none' } = useAdaptivity();\n  const platform = usePlatform();\n\n  const hoverMode = hoverModeProp || (noPadding ? 'opacity' : 'background');\n  const activeMode = activeModeProp || (noPadding ? 'opacity' : 'background');\n\n  return (\n    <SelectionControlContext.Provider value={{ noPadding }}>\n      <Tappable\n        Component=\"label\"\n        baseClassName={classNames(\n          styles.host,\n          density !== 'regular' && densityClassNames[density],\n          !noPadding && styles.withPadding,\n        )}\n        activeEffectDelay={platform === 'ios' ? 100 : DEFAULT_ACTIVE_EFFECT_DELAY}\n        hoverMode={hoverMode}\n        activeMode={activeMode}\n        {...restProps}\n      />\n    </SelectionControlContext.Provider>\n  );\n};\n\nSelectionControl.Label = SelectionControlLabel;\n"],"names":["classNames","useAdaptivity","usePlatform","DEFAULT_ACTIVE_EFFECT_DELAY","Tappable","SelectionControlContext","SelectionControlLabel","densityClassNames","none","compact","SelectionControl","noPadding","hoverMode","hoverModeProp","activeMode","activeModeProp","restProps","density","platform","Provider","value","Component","baseClassName","activeEffectDelay","Label"],"mappings":"AAAA;;AAGA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,2BAA2B,QAAQ,2BAAwB;AACpE,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,uBAAuB,QAAQ,+BAA4B;AACpE,SAASC,qBAAqB,QAAQ,mDAAgD;AAGtF,MAAMC,oBAAoB;IACxBC,IAAI;IACJC,OAAO;AACT;AAgBA;;CAEC,GACD,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,YAAY,KAAK,EACjBC,WAAWC,aAAa,EACxBC,YAAYC,cAAc,EAC1B,GAAGC,WACmB;IACtB,MAAM,EAAEC,UAAU,MAAM,EAAE,GAAGhB;IAC7B,MAAMiB,WAAWhB;IAEjB,MAAMU,YAAYC,iBAAkBF,CAAAA,YAAY,YAAY,YAAW;IACvE,MAAMG,aAAaC,kBAAmBJ,CAAAA,YAAY,YAAY,YAAW;IAEzE,qBACE,KAACN,wBAAwBc,QAAQ;QAACC,OAAO;YAAET;QAAU;kBACnD,cAAA,KAACP;YACCiB,WAAU;YACVC,eAAetB,yCAEbiB,YAAY,aAAaV,iBAAiB,CAACU,QAAQ,EACnD,CAACN;YAEHY,mBAAmBL,aAAa,QAAQ,MAAMf;YAC9CS,WAAWA;YACXE,YAAYA;YACX,GAAGE,SAAS;;;AAIrB,EAAE;AAEFN,iBAAiBc,KAAK,GAAGlB"}

package/dist/components/SelectionControl/SelectionControlLabel/SelectionControlLabel.d.ts

@@ -1,6 +1,6 @@
 interface SelectionControlLabelProps extends React.ComponentProps<'div'> {
-    description?: React.ReactNode;
-    titleAfter?: React.ReactNode;
+    description?: React.ReactNode | undefined;
+    titleAfter?: React.ReactNode | undefined;
 }
 export declare function SelectionControlLabel({ children, titleAfter, description, ...restProps }: SelectionControlLabelProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/SelectionControl/SelectionControlLabel/SelectionControlLabel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionControlLabel.d.ts","sourceRoot":"","sources":["../../../../src/components/SelectionControl/SelectionControlLabel/SelectionControlLabel.tsx"],"names":[],"mappings":"AAgBA,UAAU,0BAA2B,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACtE,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AAED,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,UAAU,EACV,WAAW,EACX,GAAG,SAAS,EACb,EAAE,0BAA0B,2CAsB5B"}
+{"version":3,"file":"SelectionControlLabel.d.ts","sourceRoot":"","sources":["../../../../src/components/SelectionControl/SelectionControlLabel/SelectionControlLabel.tsx"],"names":[],"mappings":"AAgBA,UAAU,0BAA2B,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACtE,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IAC1C,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;CAC1C;AAED,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,UAAU,EACV,WAAW,EACX,GAAG,SAAS,EACb,EAAE,0BAA0B,2CAsB5B"}