@vkontakte/vkui 7.4.4 → 7.5.1

package/dist/cssm/components/RadioGroup/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './RadioGroup.module.css';\n\nexport interface RadioGroupProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Режим расположения элементов.\n   */\n  mode?: 'vertical' | 'horizontal';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/RadioGroup\n */\nexport const RadioGroup = ({\n  mode = 'vertical',\n  ...restProps\n}: RadioGroupProps): React.ReactNode => (\n  <RootComponent\n    baseClassName={classNames(\n      styles.host,\n      'vkuiInternalRadioGroup',\n      mode === 'horizontal' && styles.modeHorizontal,\n    )}\n    role=\"radiogroup\"\n    {...restProps}\n  />\n);\n"],"names":["React","classNames","RootComponent","styles","RadioGroup","mode","restProps","baseClassName","host","modeHorizontal","role"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,OAAOC,YAAY,0BAA0B;AAS7C;;CAEC,GACD,OAAO,MAAMC,aAAa,CAAC,EACzBC,OAAO,UAAU,EACjB,GAAGC,WACa,iBAChB,KAACJ;QACCK,eAAeN,WACbE,OAAOK,IAAI,EACX,0BACAH,SAAS,gBAAgBF,OAAOM,cAAc;QAEhDC,MAAK;QACJ,GAAGJ,SAAS;OAEf"}
+{"version":3,"sources":["../../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './RadioGroup.module.css';\n\nexport interface RadioGroupProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Режим расположения элементов.\n   */\n  mode?: 'vertical' | 'horizontal';\n}\n\n/**\n * @see https://vkui.io/components/radio-group\n */\nexport const RadioGroup = ({\n  mode = 'vertical',\n  ...restProps\n}: RadioGroupProps): React.ReactNode => (\n  <RootComponent\n    baseClassName={classNames(\n      styles.host,\n      'vkuiInternalRadioGroup',\n      mode === 'horizontal' && styles.modeHorizontal,\n    )}\n    role=\"radiogroup\"\n    {...restProps}\n  />\n);\n"],"names":["React","classNames","RootComponent","styles","RadioGroup","mode","restProps","baseClassName","host","modeHorizontal","role"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,OAAOC,YAAY,0BAA0B;AAS7C;;CAEC,GACD,OAAO,MAAMC,aAAa,CAAC,EACzBC,OAAO,UAAU,EACjB,GAAGC,WACa,iBAChB,KAACJ;QACCK,eAAeN,WACbE,OAAOK,IAAI,EACX,0BACAH,SAAS,gBAAgBF,OAAOM,cAAc;QAEhDC,MAAK;QACJ,GAAGJ,SAAS;OAEf"}

package/dist/cssm/components/RichCell/RichCell.js

@@ -27,7 +27,7 @@ const alignContentClassNames = {
     end: styles.contentAlignEnd
 };
 /**
- * @see https://vkcom.github.io/VKUI/#/RichCell
+ * @see https://vkui.io/components/rich-cell
  */ export const RichCell = ({ overTitle, children, subtitle, extraSubtitle, before, after, afterCaption, bottom, actions, multiline, beforeAlign = 'start', contentAlign = 'start', afterAlign = 'start', ...restProps })=>{
     const { sizeY = 'none' } = useAdaptivity();
     const withAfter = after || afterCaption;

package/dist/cssm/components/RichCell/RichCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/RichCell/RichCell.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { RichCellIcon } from './RichCellIcon/RichCellIcon';\nimport styles from './RichCell.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\nconst alignAfterClassNames = {\n  start: styles.alignAfterStart,\n  center: styles.alignAfterCenter,\n  end: styles.alignAfterEnd,\n};\n\nconst alignBeforeClassNames = {\n  start: styles.alignBeforeStart,\n  center: styles.alignBeforeCenter,\n  end: styles.alignBeforeEnd,\n};\n\nconst alignContentClassNames = {\n  start: styles.contentAlignStart,\n  center: styles.contentAlignCenter,\n  end: styles.contentAlignEnd,\n};\n\ntype Align = 'start' | 'center' | 'end';\n\nexport interface RichCellProps extends TappableOmitProps {\n  /**\n   * Контейнер для текста над `children`.\n   */\n  overTitle?: React.ReactNode;\n  /**\n   * Контейнер для текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Контейнер для текста под `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  /**\n   * Контейнер для контента под `caption`. Например `<UsersStack size=\"m\" />`.\n   */\n  bottom?: React.ReactNode;\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:\n   *\n   * - `mode=\"primary\" size=\"s\"`\n   * - `mode=\"secondary\" size=\"s\"`.\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `mode=\"horizontal\" gap=\"s\" stretched`.\n   */\n  actions?: React.ReactNode;\n  /**\n   * `<Avatar size={40|48|72} />`.\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 28 или текст.\n   */\n  after?: React.ReactNode;\n  /**\n   * Текст под `after`.\n   */\n  afterCaption?: React.ReactNode;\n  /**\n   * Выравнивание before компонента по вертикали.\n   */\n  beforeAlign?: Align;\n  /**\n   * Выравнивание центрального контента по вертикали.\n   */\n  contentAlign?: Align;\n  /**\n   * Выравнивание after компонента по вертикали.\n   */\n  afterAlign?: Align;\n  /**\n   * Блокировка взаимодействия с компонентом. Убирает анимацию нажатия.\n   */\n  disabled?: boolean;\n  /**\n   * Включает многострочный режим для `subhead`, `children`, `text` и `caption`.\n   */\n  multiline?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/RichCell\n */\nexport const RichCell: React.FC<RichCellProps> & {\n  Icon: typeof RichCellIcon;\n} = ({\n  overTitle,\n  children,\n  subtitle,\n  extraSubtitle,\n  before,\n  after,\n  afterCaption,\n  bottom,\n  actions,\n  multiline,\n  beforeAlign = 'start',\n  contentAlign = 'start',\n  afterAlign = 'start',\n  ...restProps\n}: RichCellProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const withAfter = after || afterCaption;\n\n  const afterRender = () => {\n    if (!withAfter) {\n      return;\n    }\n    return (\n      <div className={styles.contentAfter}>\n        {after && <div className={styles.afterChildren}>{after}</div>}\n        {afterCaption && <div className={styles.afterCaption}>{afterCaption}</div>}\n      </div>\n    );\n  };\n\n  return (\n    <Tappable\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        !multiline && styles.textEllipsis,\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        withAfter && styles.withAfter,\n        withAfter && alignAfterClassNames[afterAlign],\n        before && alignBeforeClassNames[beforeAlign],\n        alignContentClassNames[contentAlign],\n      )}\n    >\n      {before && <div className={styles.before}>{before}</div>}\n      <div className={styles.in}>\n        <div className={styles.content}>\n          <div className={styles.contentBefore}>\n            {overTitle && (\n              <Subhead Component=\"div\" className={styles.overTitle}>\n                {overTitle}\n              </Subhead>\n            )}\n            <div className={styles.children}>{children}</div>\n            {subtitle && <div className={styles.subtitle}>{subtitle}</div>}\n            {extraSubtitle && (\n              <Subhead Component=\"div\" className={styles.extraSubtitle}>\n                {extraSubtitle}\n              </Subhead>\n            )}\n          </div>\n          {afterAlign === 'start' && afterRender()}\n        </div>\n        {bottom && <div className={styles.bottom}>{bottom}</div>}\n        {actions && <div className={styles.actions}>{actions}</div>}\n      </div>\n      {afterAlign !== 'start' && afterRender()}\n    </Tappable>\n  );\n};\n\nRichCell.Icon = RichCellIcon;\n"],"names":["React","classNames","useAdaptivity","Tappable","Subhead","RichCellIcon","styles","sizeYClassNames","none","sizeYNone","compact","sizeYCompact","alignAfterClassNames","start","alignAfterStart","center","alignAfterCenter","end","alignAfterEnd","alignBeforeClassNames","alignBeforeStart","alignBeforeCenter","alignBeforeEnd","alignContentClassNames","contentAlignStart","contentAlignCenter","contentAlignEnd","RichCell","overTitle","children","subtitle","extraSubtitle","before","after","afterCaption","bottom","actions","multiline","beforeAlign","contentAlign","afterAlign","restProps","sizeY","withAfter","afterRender","div","className","contentAfter","afterChildren","baseClassName","host","textEllipsis","in","content","contentBefore","Component","Icon"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,YAAY,QAAQ,iCAA8B;AAC3D,OAAOC,YAAY,wBAAwB;AAE3C,MAAMC,kBAAkB;IACtBC,MAAMF,OAAOG,SAAS;IACtBC,SAASJ,OAAOK,YAAY;AAC9B;AAEA,MAAMC,uBAAuB;IAC3BC,OAAOP,OAAOQ,eAAe;IAC7BC,QAAQT,OAAOU,gBAAgB;IAC/BC,KAAKX,OAAOY,aAAa;AAC3B;AAEA,MAAMC,wBAAwB;IAC5BN,OAAOP,OAAOc,gBAAgB;IAC9BL,QAAQT,OAAOe,iBAAiB;IAChCJ,KAAKX,OAAOgB,cAAc;AAC5B;AAEA,MAAMC,yBAAyB;IAC7BV,OAAOP,OAAOkB,iBAAiB;IAC/BT,QAAQT,OAAOmB,kBAAkB;IACjCR,KAAKX,OAAOoB,eAAe;AAC7B;AAkEA;;CAEC,GACD,OAAO,MAAMC,WAET,CAAC,EACHC,SAAS,EACTC,QAAQ,EACRC,QAAQ,EACRC,aAAa,EACbC,MAAM,EACNC,KAAK,EACLC,YAAY,EACZC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,cAAc,OAAO,EACrBC,eAAe,OAAO,EACtBC,aAAa,OAAO,EACpB,GAAGC,WACW;IACd,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGxC;IAC3B,MAAMyC,YAAYV,SAASC;IAE3B,MAAMU,cAAc;QAClB,IAAI,CAACD,WAAW;YACd;QACF;QACA,qBACE,MAACE;YAAIC,WAAWxC,OAAOyC,YAAY;;gBAChCd,uBAAS,KAACY;oBAAIC,WAAWxC,OAAO0C,aAAa;8BAAGf;;gBAChDC,8BAAgB,KAACW;oBAAIC,WAAWxC,OAAO4B,YAAY;8BAAGA;;;;IAG7D;IAEA,qBACE,MAAC/B;QACE,GAAGsC,SAAS;QACbQ,eAAehD,WACbK,OAAO4C,IAAI,EACX,CAACb,aAAa/B,OAAO6C,YAAY,EACjCT,UAAU,aAAanC,eAAe,CAACmC,MAAM,EAC7CC,aAAarC,OAAOqC,SAAS,EAC7BA,aAAa/B,oBAAoB,CAAC4B,WAAW,EAC7CR,UAAUb,qBAAqB,CAACmB,YAAY,EAC5Cf,sBAAsB,CAACgB,aAAa;;YAGrCP,wBAAU,KAACa;gBAAIC,WAAWxC,OAAO0B,MAAM;0BAAGA;;0BAC3C,MAACa;gBAAIC,WAAWxC,OAAO8C,EAAE;;kCACvB,MAACP;wBAAIC,WAAWxC,OAAO+C,OAAO;;0CAC5B,MAACR;gCAAIC,WAAWxC,OAAOgD,aAAa;;oCACjC1B,2BACC,KAACxB;wCAAQmD,WAAU;wCAAMT,WAAWxC,OAAOsB,SAAS;kDACjDA;;kDAGL,KAACiB;wCAAIC,WAAWxC,OAAOuB,QAAQ;kDAAGA;;oCACjCC,0BAAY,KAACe;wCAAIC,WAAWxC,OAAOwB,QAAQ;kDAAGA;;oCAC9CC,+BACC,KAAC3B;wCAAQmD,WAAU;wCAAMT,WAAWxC,OAAOyB,aAAa;kDACrDA;;;;4BAINS,eAAe,WAAWI;;;oBAE5BT,wBAAU,KAACU;wBAAIC,WAAWxC,OAAO6B,MAAM;kCAAGA;;oBAC1CC,yBAAW,KAACS;wBAAIC,WAAWxC,OAAO8B,OAAO;kCAAGA;;;;YAE9CI,eAAe,WAAWI;;;AAGjC,EAAE;AAEFjB,SAAS6B,IAAI,GAAGnD"}
+{"version":3,"sources":["../../../../src/components/RichCell/RichCell.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { RichCellIcon } from './RichCellIcon/RichCellIcon';\nimport styles from './RichCell.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\nconst alignAfterClassNames = {\n  start: styles.alignAfterStart,\n  center: styles.alignAfterCenter,\n  end: styles.alignAfterEnd,\n};\n\nconst alignBeforeClassNames = {\n  start: styles.alignBeforeStart,\n  center: styles.alignBeforeCenter,\n  end: styles.alignBeforeEnd,\n};\n\nconst alignContentClassNames = {\n  start: styles.contentAlignStart,\n  center: styles.contentAlignCenter,\n  end: styles.contentAlignEnd,\n};\n\ntype Align = 'start' | 'center' | 'end';\n\nexport interface RichCellProps extends TappableOmitProps {\n  /**\n   * Контейнер для текста над `children`.\n   */\n  overTitle?: React.ReactNode;\n  /**\n   * Контейнер для текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Контейнер для текста под `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  /**\n   * Контейнер для контента под `caption`. Например `<UsersStack size=\"m\" />`.\n   */\n  bottom?: React.ReactNode;\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkui.io/components/button) с параметрами:\n   *\n   * - `mode=\"primary\" size=\"s\"`\n   * - `mode=\"secondary\" size=\"s\"`.\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkui.io/components/button-group) с параметрами:\n   *\n   * - `mode=\"horizontal\" gap=\"s\" stretched`.\n   */\n  actions?: React.ReactNode;\n  /**\n   * `<Avatar size={40|48|72} />`.\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 28 или текст.\n   */\n  after?: React.ReactNode;\n  /**\n   * Текст под `after`.\n   */\n  afterCaption?: React.ReactNode;\n  /**\n   * Выравнивание before компонента по вертикали.\n   */\n  beforeAlign?: Align;\n  /**\n   * Выравнивание центрального контента по вертикали.\n   */\n  contentAlign?: Align;\n  /**\n   * Выравнивание after компонента по вертикали.\n   */\n  afterAlign?: Align;\n  /**\n   * Блокировка взаимодействия с компонентом. Убирает анимацию нажатия.\n   */\n  disabled?: boolean;\n  /**\n   * Включает многострочный режим для `subhead`, `children`, `text` и `caption`.\n   */\n  multiline?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/rich-cell\n */\nexport const RichCell: React.FC<RichCellProps> & {\n  Icon: typeof RichCellIcon;\n} = ({\n  overTitle,\n  children,\n  subtitle,\n  extraSubtitle,\n  before,\n  after,\n  afterCaption,\n  bottom,\n  actions,\n  multiline,\n  beforeAlign = 'start',\n  contentAlign = 'start',\n  afterAlign = 'start',\n  ...restProps\n}: RichCellProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const withAfter = after || afterCaption;\n\n  const afterRender = () => {\n    if (!withAfter) {\n      return;\n    }\n    return (\n      <div className={styles.contentAfter}>\n        {after && <div className={styles.afterChildren}>{after}</div>}\n        {afterCaption && <div className={styles.afterCaption}>{afterCaption}</div>}\n      </div>\n    );\n  };\n\n  return (\n    <Tappable\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        !multiline && styles.textEllipsis,\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        withAfter && styles.withAfter,\n        withAfter && alignAfterClassNames[afterAlign],\n        before && alignBeforeClassNames[beforeAlign],\n        alignContentClassNames[contentAlign],\n      )}\n    >\n      {before && <div className={styles.before}>{before}</div>}\n      <div className={styles.in}>\n        <div className={styles.content}>\n          <div className={styles.contentBefore}>\n            {overTitle && (\n              <Subhead Component=\"div\" className={styles.overTitle}>\n                {overTitle}\n              </Subhead>\n            )}\n            <div className={styles.children}>{children}</div>\n            {subtitle && <div className={styles.subtitle}>{subtitle}</div>}\n            {extraSubtitle && (\n              <Subhead Component=\"div\" className={styles.extraSubtitle}>\n                {extraSubtitle}\n              </Subhead>\n            )}\n          </div>\n          {afterAlign === 'start' && afterRender()}\n        </div>\n        {bottom && <div className={styles.bottom}>{bottom}</div>}\n        {actions && <div className={styles.actions}>{actions}</div>}\n      </div>\n      {afterAlign !== 'start' && afterRender()}\n    </Tappable>\n  );\n};\n\nRichCell.Icon = RichCellIcon;\n"],"names":["React","classNames","useAdaptivity","Tappable","Subhead","RichCellIcon","styles","sizeYClassNames","none","sizeYNone","compact","sizeYCompact","alignAfterClassNames","start","alignAfterStart","center","alignAfterCenter","end","alignAfterEnd","alignBeforeClassNames","alignBeforeStart","alignBeforeCenter","alignBeforeEnd","alignContentClassNames","contentAlignStart","contentAlignCenter","contentAlignEnd","RichCell","overTitle","children","subtitle","extraSubtitle","before","after","afterCaption","bottom","actions","multiline","beforeAlign","contentAlign","afterAlign","restProps","sizeY","withAfter","afterRender","div","className","contentAfter","afterChildren","baseClassName","host","textEllipsis","in","content","contentBefore","Component","Icon"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,YAAY,QAAQ,iCAA8B;AAC3D,OAAOC,YAAY,wBAAwB;AAE3C,MAAMC,kBAAkB;IACtBC,MAAMF,OAAOG,SAAS;IACtBC,SAASJ,OAAOK,YAAY;AAC9B;AAEA,MAAMC,uBAAuB;IAC3BC,OAAOP,OAAOQ,eAAe;IAC7BC,QAAQT,OAAOU,gBAAgB;IAC/BC,KAAKX,OAAOY,aAAa;AAC3B;AAEA,MAAMC,wBAAwB;IAC5BN,OAAOP,OAAOc,gBAAgB;IAC9BL,QAAQT,OAAOe,iBAAiB;IAChCJ,KAAKX,OAAOgB,cAAc;AAC5B;AAEA,MAAMC,yBAAyB;IAC7BV,OAAOP,OAAOkB,iBAAiB;IAC/BT,QAAQT,OAAOmB,kBAAkB;IACjCR,KAAKX,OAAOoB,eAAe;AAC7B;AAkEA;;CAEC,GACD,OAAO,MAAMC,WAET,CAAC,EACHC,SAAS,EACTC,QAAQ,EACRC,QAAQ,EACRC,aAAa,EACbC,MAAM,EACNC,KAAK,EACLC,YAAY,EACZC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,cAAc,OAAO,EACrBC,eAAe,OAAO,EACtBC,aAAa,OAAO,EACpB,GAAGC,WACW;IACd,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGxC;IAC3B,MAAMyC,YAAYV,SAASC;IAE3B,MAAMU,cAAc;QAClB,IAAI,CAACD,WAAW;YACd;QACF;QACA,qBACE,MAACE;YAAIC,WAAWxC,OAAOyC,YAAY;;gBAChCd,uBAAS,KAACY;oBAAIC,WAAWxC,OAAO0C,aAAa;8BAAGf;;gBAChDC,8BAAgB,KAACW;oBAAIC,WAAWxC,OAAO4B,YAAY;8BAAGA;;;;IAG7D;IAEA,qBACE,MAAC/B;QACE,GAAGsC,SAAS;QACbQ,eAAehD,WACbK,OAAO4C,IAAI,EACX,CAACb,aAAa/B,OAAO6C,YAAY,EACjCT,UAAU,aAAanC,eAAe,CAACmC,MAAM,EAC7CC,aAAarC,OAAOqC,SAAS,EAC7BA,aAAa/B,oBAAoB,CAAC4B,WAAW,EAC7CR,UAAUb,qBAAqB,CAACmB,YAAY,EAC5Cf,sBAAsB,CAACgB,aAAa;;YAGrCP,wBAAU,KAACa;gBAAIC,WAAWxC,OAAO0B,MAAM;0BAAGA;;0BAC3C,MAACa;gBAAIC,WAAWxC,OAAO8C,EAAE;;kCACvB,MAACP;wBAAIC,WAAWxC,OAAO+C,OAAO;;0CAC5B,MAACR;gCAAIC,WAAWxC,OAAOgD,aAAa;;oCACjC1B,2BACC,KAACxB;wCAAQmD,WAAU;wCAAMT,WAAWxC,OAAOsB,SAAS;kDACjDA;;kDAGL,KAACiB;wCAAIC,WAAWxC,OAAOuB,QAAQ;kDAAGA;;oCACjCC,0BAAY,KAACe;wCAAIC,WAAWxC,OAAOwB,QAAQ;kDAAGA;;oCAC9CC,+BACC,KAAC3B;wCAAQmD,WAAU;wCAAMT,WAAWxC,OAAOyB,aAAa;kDACrDA;;;;4BAINS,eAAe,WAAWI;;;oBAE5BT,wBAAU,KAACU;wBAAIC,WAAWxC,OAAO6B,MAAM;kCAAGA;;oBAC1CC,yBAAW,KAACS;wBAAIC,WAAWxC,OAAO8B,OAAO;kCAAGA;;;;YAE9CI,eAAe,WAAWI;;;AAGjC,EAAE;AAEFjB,SAAS6B,IAAI,GAAGnD"}

package/dist/cssm/components/Root/Root.js

@@ -16,7 +16,7 @@ import { SplitColContext } from "../SplitCol/SplitColContext.js";
 import styles from "./Root.module.css";
 /* eslint-enable jsdoc/require-jsdoc */ const warn = warnOnce('Root');
 /**
- * @see https://vkcom.github.io/VKUI/#/Root
+ * @see https://vkui.io/components/root
  */ export const Root = ({ children, activeView: _activeView, onTransition, nav, ...restProps })=>{
     const scroll = React.useContext(ScrollContext);
     const platform = usePlatform();

package/dist/cssm/components/Root/Root.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useDOM } from '../../lib/dom';\nimport { getNavId, type NavIdProps } from '../../lib/getNavId';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { NavTransitionProvider } from '../NavTransitionContext/NavTransitionContext';\nimport { NavTransitionDirectionProvider } from '../NavTransitionDirectionContext/NavTransitionDirectionContext';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { SplitColContext } from '../SplitCol/SplitColContext';\nimport styles from './Root.module.css';\n\nexport interface RootProps extends HTMLAttributesWithRootRef<HTMLDivElement>, NavIdProps {\n  /**\n   * `id` активной `View`.\n   */\n  activeView: string;\n  /**\n   * Обработчик, который вызывается при завершении анимации смены активной `View`.\n   */\n  onTransition?: (params: { isBack: boolean; from: string; to: string }) => void;\n  /**\n   * Коллекция `View`. У каждой `View` должен быть `id`.\n   */\n  children: React.ReactElement | Iterable<React.ReactElement>;\n}\n\n/* eslint-disable jsdoc/require-jsdoc */\nexport interface RootState {\n  activeView: string;\n  transition: boolean;\n  isBack?: boolean;\n  prevView?: string;\n}\n/* eslint-enable jsdoc/require-jsdoc */\n\nconst warn = warnOnce('Root');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Root\n */\nexport const Root = ({\n  children,\n  activeView: _activeView,\n  onTransition,\n  nav,\n  ...restProps\n}: RootProps): React.ReactNode => {\n  const scroll = React.useContext(ScrollContext);\n  const platform = usePlatform();\n  const { document } = useDOM();\n  const scrolls = React.useRef<Record<string, number>>({}).current;\n  const viewNodes = React.useRef<Record<string, HTMLElement | null>>({}).current;\n\n  const { transitionMotionEnabled = true } = useConfigProvider();\n  const { animate } = React.useContext(SplitColContext);\n  const disableAnimation = !transitionMotionEnabled || !animate;\n\n  const views = React.Children.toArray(children) as Array<React.ReactElement<NavIdProps>>;\n\n  const [{ prevView, activeView, transition, isBack }, _setState] = React.useState<RootState>({\n    activeView: _activeView,\n    transition: false,\n  });\n  const transitionTo = (panel: string) => {\n    if (panel !== activeView) {\n      const viewIds = views.map((view) => getNavId(view.props, warn));\n      const isBack = viewIds.indexOf(panel) < viewIds.indexOf(activeView);\n      scrolls[activeView] = scroll.getScroll().y;\n      _setState({\n        activeView: panel,\n        prevView: activeView,\n        transition: !disableAnimation,\n        isBack,\n      });\n    }\n  };\n  const finishTransition = React.useCallback(\n    () => _setState({ activeView, prevView, isBack, transition: false }),\n    [activeView, isBack, prevView],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    (document!.activeElement as HTMLElement).blur();\n  }, [activeView]);\n\n  // Нужен переход\n  useIsomorphicLayoutEffect(() => transitionTo(_activeView), [_activeView]);\n  useIsomorphicLayoutEffect(() => {\n    if (!transition && prevView) {\n      // Закончился переход\n      scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);\n      onTransition &&\n        onTransition({\n          isBack: Boolean(isBack),\n          from: prevView,\n          to: activeView,\n        });\n    }\n  }, [transition, prevView]);\n\n  React.useEffect(\n    function onAnimationEndFallback() {\n      if (transition && disableAnimation) {\n        finishTransition();\n      }\n    },\n    [transition, disableAnimation, finishTransition],\n  );\n\n  const onAnimationEnd = () => {\n    finishTransition();\n  };\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        platform === 'ios' && styles.ios,\n        transition && styles.transition,\n      )}\n    >\n      {views.map((view) => {\n        const viewId = getNavId(view.props, warn);\n        if (viewId !== activeView && !(transition && viewId === prevView)) {\n          return null;\n        }\n        const isTransitionTarget = transition && viewId === (isBack ? prevView : activeView);\n        const compensateScroll =\n          transition && (viewId === prevView || (isBack && viewId === activeView));\n        return (\n          <div\n            key={viewId}\n            ref={(e) => {\n              viewId && (viewNodes[viewId] = e);\n            }}\n            onAnimationEnd={isTransitionTarget ? onAnimationEnd : undefined}\n            className={classNames(\n              styles.view,\n              transition && viewId === prevView && isBack && styles.viewHideBack,\n              transition && viewId === prevView && !isBack && styles.viewHideForward,\n              transition && viewId === activeView && isBack && styles.viewShowBack,\n              transition && viewId === activeView && !isBack && styles.viewShowForward,\n            )}\n          >\n            <NavTransitionDirectionProvider isBack={isBack}>\n              <NavTransitionProvider entering={transition && viewId === activeView}>\n                <div\n                  className={styles.scrollCompensation}\n                  style={{\n                    marginTop: compensateScroll ? viewId && -(scrolls[viewId] ?? 0) : undefined,\n                  }}\n                >\n                  {view}\n                </div>\n              </NavTransitionProvider>\n            </NavTransitionDirectionProvider>\n          </div>\n        );\n      })}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","usePlatform","useDOM","getNavId","useIsomorphicLayoutEffect","warnOnce","ScrollContext","useConfigProvider","NavTransitionProvider","NavTransitionDirectionProvider","RootComponent","SplitColContext","styles","warn","Root","children","activeView","_activeView","onTransition","nav","restProps","scroll","useContext","platform","document","scrolls","useRef","current","viewNodes","transitionMotionEnabled","animate","disableAnimation","views","Children","toArray","prevView","transition","isBack","_setState","useState","transitionTo","panel","viewIds","map","view","props","indexOf","getScroll","y","finishTransition","useCallback","activeElement","blur","scrollTo","Boolean","from","to","useEffect","onAnimationEndFallback","onAnimationEnd","baseClassName","host","ios","viewId","isTransitionTarget","compensateScroll","div","ref","e","undefined","className","viewHideBack","viewHideForward","viewShowBack","viewShowForward","entering","scrollCompensation","style","marginTop"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,MAAM,QAAQ,mBAAgB;AACvC,SAASC,QAAQ,QAAyB,wBAAqB;AAC/D,SAASC,yBAAyB,QAAQ,yCAAsC;AAChF,SAASC,QAAQ,QAAQ,wBAAqB;AAE9C,SAASC,aAAa,QAAQ,8BAA2B;AACzD,SAASC,iBAAiB,QAAQ,6CAA0C;AAC5E,SAASC,qBAAqB,QAAQ,kDAA+C;AACrF,SAASC,8BAA8B,QAAQ,oEAAiE;AAChH,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,eAAe,QAAQ,iCAA8B;AAC9D,OAAOC,YAAY,oBAAoB;AAwBvC,qCAAqC,GAErC,MAAMC,OAAOR,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMS,OAAO,CAAC,EACnBC,QAAQ,EACRC,YAAYC,WAAW,EACvBC,YAAY,EACZC,GAAG,EACH,GAAGC,WACO;IACV,MAAMC,SAAStB,MAAMuB,UAAU,CAAChB;IAChC,MAAMiB,WAAWtB;IACjB,MAAM,EAAEuB,QAAQ,EAAE,GAAGtB;IACrB,MAAMuB,UAAU1B,MAAM2B,MAAM,CAAyB,CAAC,GAAGC,OAAO;IAChE,MAAMC,YAAY7B,MAAM2B,MAAM,CAAqC,CAAC,GAAGC,OAAO;IAE9E,MAAM,EAAEE,0BAA0B,IAAI,EAAE,GAAGtB;IAC3C,MAAM,EAAEuB,OAAO,EAAE,GAAG/B,MAAMuB,UAAU,CAACX;IACrC,MAAMoB,mBAAmB,CAACF,2BAA2B,CAACC;IAEtD,MAAME,QAAQjC,MAAMkC,QAAQ,CAACC,OAAO,CAACnB;IAErC,MAAM,CAAC,EAAEoB,QAAQ,EAAEnB,UAAU,EAAEoB,UAAU,EAAEC,MAAM,EAAE,EAAEC,UAAU,GAAGvC,MAAMwC,QAAQ,CAAY;QAC1FvB,YAAYC;QACZmB,YAAY;IACd;IACA,MAAMI,eAAe,CAACC;QACpB,IAAIA,UAAUzB,YAAY;YACxB,MAAM0B,UAAUV,MAAMW,GAAG,CAAC,CAACC,OAASzC,SAASyC,KAAKC,KAAK,EAAEhC;YACzD,MAAMwB,SAASK,QAAQI,OAAO,CAACL,SAASC,QAAQI,OAAO,CAAC9B;YACxDS,OAAO,CAACT,WAAW,GAAGK,OAAO0B,SAAS,GAAGC,CAAC;YAC1CV,UAAU;gBACRtB,YAAYyB;gBACZN,UAAUnB;gBACVoB,YAAY,CAACL;gBACbM;YACF;QACF;IACF;IACA,MAAMY,mBAAmBlD,MAAMmD,WAAW,CACxC,IAAMZ,UAAU;YAAEtB;YAAYmB;YAAUE;YAAQD,YAAY;QAAM,IAClE;QAACpB;QAAYqB;QAAQF;KAAS;IAGhC/B,0BAA0B;QACvBoB,SAAU2B,aAAa,CAAiBC,IAAI;IAC/C,GAAG;QAACpC;KAAW;IAEf,gBAAgB;IAChBZ,0BAA0B,IAAMoC,aAAavB,cAAc;QAACA;KAAY;IACxEb,0BAA0B;QACxB,IAAI,CAACgC,cAAcD,UAAU;YAC3B,qBAAqB;YACrBd,OAAOgC,QAAQ,CAAC,GAAGhB,SAASZ,OAAO,CAACT,WAAW,GAAG;YAClDE,gBACEA,aAAa;gBACXmB,QAAQiB,QAAQjB;gBAChBkB,MAAMpB;gBACNqB,IAAIxC;YACN;QACJ;IACF,GAAG;QAACoB;QAAYD;KAAS;IAEzBpC,MAAM0D,SAAS,CACb,SAASC;QACP,IAAItB,cAAcL,kBAAkB;YAClCkB;QACF;IACF,GACA;QAACb;QAAYL;QAAkBkB;KAAiB;IAGlD,MAAMU,iBAAiB;QACrBV;IACF;IAEA,qBACE,KAACvC;QACE,GAAGU,SAAS;QACbwC,eAAe5D,WACbY,OAAOiD,IAAI,EACXtC,aAAa,SAASX,OAAOkD,GAAG,EAChC1B,cAAcxB,OAAOwB,UAAU;kBAGhCJ,MAAMW,GAAG,CAAC,CAACC;YACV,MAAMmB,SAAS5D,SAASyC,KAAKC,KAAK,EAAEhC;YACpC,IAAIkD,WAAW/C,cAAc,CAAEoB,CAAAA,cAAc2B,WAAW5B,QAAO,GAAI;gBACjE,OAAO;YACT;YACA,MAAM6B,qBAAqB5B,cAAc2B,WAAY1B,CAAAA,SAASF,WAAWnB,UAAS;YAClF,MAAMiD,mBACJ7B,cAAe2B,CAAAA,WAAW5B,YAAaE,UAAU0B,WAAW/C,UAAU;YACxE,qBACE,KAACkD;gBAECC,KAAK,CAACC;oBACJL,UAAWnC,CAAAA,SAAS,CAACmC,OAAO,GAAGK,CAAAA;gBACjC;gBACAT,gBAAgBK,qBAAqBL,iBAAiBU;gBACtDC,WAAWtE,WACTY,OAAOgC,IAAI,EACXR,cAAc2B,WAAW5B,YAAYE,UAAUzB,OAAO2D,YAAY,EAClEnC,cAAc2B,WAAW5B,YAAY,CAACE,UAAUzB,OAAO4D,eAAe,EACtEpC,cAAc2B,WAAW/C,cAAcqB,UAAUzB,OAAO6D,YAAY,EACpErC,cAAc2B,WAAW/C,cAAc,CAACqB,UAAUzB,OAAO8D,eAAe;0BAG1E,cAAA,KAACjE;oBAA+B4B,QAAQA;8BACtC,cAAA,KAAC7B;wBAAsBmE,UAAUvC,cAAc2B,WAAW/C;kCACxD,cAAA,KAACkD;4BACCI,WAAW1D,OAAOgE,kBAAkB;4BACpCC,OAAO;gCACLC,WAAWb,mBAAmBF,UAAU,CAAEtC,CAAAA,OAAO,CAACsC,OAAO,IAAI,CAAA,IAAKM;4BACpE;sCAECzB;;;;eArBFmB;QA2BX;;AAGN,EAAE"}
+{"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useDOM } from '../../lib/dom';\nimport { getNavId, type NavIdProps } from '../../lib/getNavId';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { NavTransitionProvider } from '../NavTransitionContext/NavTransitionContext';\nimport { NavTransitionDirectionProvider } from '../NavTransitionDirectionContext/NavTransitionDirectionContext';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { SplitColContext } from '../SplitCol/SplitColContext';\nimport styles from './Root.module.css';\n\nexport interface RootProps extends HTMLAttributesWithRootRef<HTMLDivElement>, NavIdProps {\n  /**\n   * `id` активной `View`.\n   */\n  activeView: string;\n  /**\n   * Обработчик, который вызывается при завершении анимации смены активной `View`.\n   */\n  onTransition?: (params: { isBack: boolean; from: string; to: string }) => void;\n  /**\n   * Коллекция `View`. У каждой `View` должен быть `id`.\n   */\n  children: React.ReactElement | Iterable<React.ReactElement>;\n}\n\n/* eslint-disable jsdoc/require-jsdoc */\nexport interface RootState {\n  activeView: string;\n  transition: boolean;\n  isBack?: boolean;\n  prevView?: string;\n}\n/* eslint-enable jsdoc/require-jsdoc */\n\nconst warn = warnOnce('Root');\n\n/**\n * @see https://vkui.io/components/root\n */\nexport const Root = ({\n  children,\n  activeView: _activeView,\n  onTransition,\n  nav,\n  ...restProps\n}: RootProps): React.ReactNode => {\n  const scroll = React.useContext(ScrollContext);\n  const platform = usePlatform();\n  const { document } = useDOM();\n  const scrolls = React.useRef<Record<string, number>>({}).current;\n  const viewNodes = React.useRef<Record<string, HTMLElement | null>>({}).current;\n\n  const { transitionMotionEnabled = true } = useConfigProvider();\n  const { animate } = React.useContext(SplitColContext);\n  const disableAnimation = !transitionMotionEnabled || !animate;\n\n  const views = React.Children.toArray(children) as Array<React.ReactElement<NavIdProps>>;\n\n  const [{ prevView, activeView, transition, isBack }, _setState] = React.useState<RootState>({\n    activeView: _activeView,\n    transition: false,\n  });\n  const transitionTo = (panel: string) => {\n    if (panel !== activeView) {\n      const viewIds = views.map((view) => getNavId(view.props, warn));\n      const isBack = viewIds.indexOf(panel) < viewIds.indexOf(activeView);\n      scrolls[activeView] = scroll.getScroll().y;\n      _setState({\n        activeView: panel,\n        prevView: activeView,\n        transition: !disableAnimation,\n        isBack,\n      });\n    }\n  };\n  const finishTransition = React.useCallback(\n    () => _setState({ activeView, prevView, isBack, transition: false }),\n    [activeView, isBack, prevView],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    (document!.activeElement as HTMLElement).blur();\n  }, [activeView]);\n\n  // Нужен переход\n  useIsomorphicLayoutEffect(() => transitionTo(_activeView), [_activeView]);\n  useIsomorphicLayoutEffect(() => {\n    if (!transition && prevView) {\n      // Закончился переход\n      scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);\n      onTransition &&\n        onTransition({\n          isBack: Boolean(isBack),\n          from: prevView,\n          to: activeView,\n        });\n    }\n  }, [transition, prevView]);\n\n  React.useEffect(\n    function onAnimationEndFallback() {\n      if (transition && disableAnimation) {\n        finishTransition();\n      }\n    },\n    [transition, disableAnimation, finishTransition],\n  );\n\n  const onAnimationEnd = () => {\n    finishTransition();\n  };\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        platform === 'ios' && styles.ios,\n        transition && styles.transition,\n      )}\n    >\n      {views.map((view) => {\n        const viewId = getNavId(view.props, warn);\n        if (viewId !== activeView && !(transition && viewId === prevView)) {\n          return null;\n        }\n        const isTransitionTarget = transition && viewId === (isBack ? prevView : activeView);\n        const compensateScroll =\n          transition && (viewId === prevView || (isBack && viewId === activeView));\n        return (\n          <div\n            key={viewId}\n            ref={(e) => {\n              viewId && (viewNodes[viewId] = e);\n            }}\n            onAnimationEnd={isTransitionTarget ? onAnimationEnd : undefined}\n            className={classNames(\n              styles.view,\n              transition && viewId === prevView && isBack && styles.viewHideBack,\n              transition && viewId === prevView && !isBack && styles.viewHideForward,\n              transition && viewId === activeView && isBack && styles.viewShowBack,\n              transition && viewId === activeView && !isBack && styles.viewShowForward,\n            )}\n          >\n            <NavTransitionDirectionProvider isBack={isBack}>\n              <NavTransitionProvider entering={transition && viewId === activeView}>\n                <div\n                  className={styles.scrollCompensation}\n                  style={{\n                    marginTop: compensateScroll ? viewId && -(scrolls[viewId] ?? 0) : undefined,\n                  }}\n                >\n                  {view}\n                </div>\n              </NavTransitionProvider>\n            </NavTransitionDirectionProvider>\n          </div>\n        );\n      })}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","usePlatform","useDOM","getNavId","useIsomorphicLayoutEffect","warnOnce","ScrollContext","useConfigProvider","NavTransitionProvider","NavTransitionDirectionProvider","RootComponent","SplitColContext","styles","warn","Root","children","activeView","_activeView","onTransition","nav","restProps","scroll","useContext","platform","document","scrolls","useRef","current","viewNodes","transitionMotionEnabled","animate","disableAnimation","views","Children","toArray","prevView","transition","isBack","_setState","useState","transitionTo","panel","viewIds","map","view","props","indexOf","getScroll","y","finishTransition","useCallback","activeElement","blur","scrollTo","Boolean","from","to","useEffect","onAnimationEndFallback","onAnimationEnd","baseClassName","host","ios","viewId","isTransitionTarget","compensateScroll","div","ref","e","undefined","className","viewHideBack","viewHideForward","viewShowBack","viewShowForward","entering","scrollCompensation","style","marginTop"],"mappings":"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"}

package/dist/cssm/components/ScreenSpinner/ScreenSpinner.js

@@ -9,7 +9,7 @@ import { ScreenSpinnerContainer } from "./ScreenSpinnerContainer.js";
 import { ScreenSpinnerLoader } from "./ScreenSpinnerLoader.js";
 import { ScreenSpinnerSwapIcon } from "./ScreenSpinnerSwapIcon.js";
 /**
- * @see https://vkcom.github.io/VKUI/#/ScreenSpinner
+ * @see https://vkui.io/components/screen-spinner
  */ export const ScreenSpinner = ({ style, className, state = 'loading', onClick, cancelLabel, mode, label, customIcon, usePortal, visibilityDelay, ...restProps })=>{
     useScrollLock();
     return /*#__PURE__*/ _jsx(AppRootPortal, {

package/dist/cssm/components/ScreenSpinner/ScreenSpinner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ScreenSpinner/ScreenSpinner.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { ScreenSpinnerContainer } from './ScreenSpinnerContainer';\nimport { ScreenSpinnerLoader } from './ScreenSpinnerLoader';\nimport { ScreenSpinnerSwapIcon } from './ScreenSpinnerSwapIcon';\nimport type { ScreenSpinnerProps } from './types';\n\nexport type { ScreenSpinnerProps };\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ScreenSpinner\n */\nexport const ScreenSpinner: React.FC<ScreenSpinnerProps> & {\n  Container: typeof ScreenSpinnerContainer;\n  Loader: typeof ScreenSpinnerLoader;\n  SwapIcon: typeof ScreenSpinnerSwapIcon;\n} = ({\n  style,\n  className,\n  state = 'loading',\n  onClick,\n  cancelLabel,\n  mode,\n  label,\n  customIcon,\n  usePortal,\n  visibilityDelay,\n  ...restProps\n}: ScreenSpinnerProps): React.ReactNode => {\n  useScrollLock();\n\n  return (\n    <AppRootPortal usePortal={usePortal}>\n      <PopoutWrapper className={className} style={style} noBackground strategy=\"fixed\">\n        <ScreenSpinnerContainer\n          state={state}\n          mode={mode}\n          label={label}\n          customIcon={customIcon}\n          visibilityDelay={visibilityDelay}\n        >\n          <ScreenSpinnerLoader {...restProps} />\n          <ScreenSpinnerSwapIcon onClick={onClick} cancelLabel={cancelLabel} />\n        </ScreenSpinnerContainer>\n      </PopoutWrapper>\n    </AppRootPortal>\n  );\n};\n\nScreenSpinner.Container = ScreenSpinnerContainer;\nScreenSpinner.Loader = ScreenSpinnerLoader;\nScreenSpinner.SwapIcon = ScreenSpinnerSwapIcon;\n\nif (process.env.NODE_ENV !== 'production') {\n  defineComponentDisplayNames(ScreenSpinner.Container, 'ScreenSpinner.Container');\n  defineComponentDisplayNames(ScreenSpinner.Loader, 'ScreenSpinner.Loader');\n  defineComponentDisplayNames(ScreenSpinner.SwapIcon, 'ScreenSpinner.SwapIcon');\n}\n"],"names":["React","defineComponentDisplayNames","AppRootPortal","useScrollLock","PopoutWrapper","ScreenSpinnerContainer","ScreenSpinnerLoader","ScreenSpinnerSwapIcon","ScreenSpinner","style","className","state","onClick","cancelLabel","mode","label","customIcon","usePortal","visibilityDelay","restProps","noBackground","strategy","Container","Loader","SwapIcon","process","env","NODE_ENV"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,2BAA2B,QAAQ,iDAA8C;AAC1F,SAASC,aAAa,QAAQ,8BAA2B;AACzD,SAASC,aAAa,QAAQ,8BAA2B;AACzD,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,sBAAsB,QAAQ,8BAA2B;AAClE,SAASC,mBAAmB,QAAQ,2BAAwB;AAC5D,SAASC,qBAAqB,QAAQ,6BAA0B;AAKhE;;CAEC,GACD,OAAO,MAAMC,gBAIT,CAAC,EACHC,KAAK,EACLC,SAAS,EACTC,QAAQ,SAAS,EACjBC,OAAO,EACPC,WAAW,EACXC,IAAI,EACJC,KAAK,EACLC,UAAU,EACVC,SAAS,EACTC,eAAe,EACf,GAAGC,WACgB;IACnBhB;IAEA,qBACE,KAACD;QAAce,WAAWA;kBACxB,cAAA,KAACb;YAAcM,WAAWA;YAAWD,OAAOA;YAAOW,YAAY;YAACC,UAAS;sBACvE,cAAA,MAAChB;gBACCM,OAAOA;gBACPG,MAAMA;gBACNC,OAAOA;gBACPC,YAAYA;gBACZE,iBAAiBA;;kCAEjB,KAACZ;wBAAqB,GAAGa,SAAS;;kCAClC,KAACZ;wBAAsBK,SAASA;wBAASC,aAAaA;;;;;;AAKhE,EAAE;AAEFL,cAAcc,SAAS,GAAGjB;AAC1BG,cAAce,MAAM,GAAGjB;AACvBE,cAAcgB,QAAQ,GAAGjB;AAEzB,IAAIkB,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;IACzC1B,4BAA4BO,cAAcc,SAAS,EAAE;IACrDrB,4BAA4BO,cAAce,MAAM,EAAE;IAClDtB,4BAA4BO,cAAcgB,QAAQ,EAAE;AACtD"}
+{"version":3,"sources":["../../../../src/components/ScreenSpinner/ScreenSpinner.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { ScreenSpinnerContainer } from './ScreenSpinnerContainer';\nimport { ScreenSpinnerLoader } from './ScreenSpinnerLoader';\nimport { ScreenSpinnerSwapIcon } from './ScreenSpinnerSwapIcon';\nimport type { ScreenSpinnerProps } from './types';\n\nexport type { ScreenSpinnerProps };\n\n/**\n * @see https://vkui.io/components/screen-spinner\n */\nexport const ScreenSpinner: React.FC<ScreenSpinnerProps> & {\n  Container: typeof ScreenSpinnerContainer;\n  Loader: typeof ScreenSpinnerLoader;\n  SwapIcon: typeof ScreenSpinnerSwapIcon;\n} = ({\n  style,\n  className,\n  state = 'loading',\n  onClick,\n  cancelLabel,\n  mode,\n  label,\n  customIcon,\n  usePortal,\n  visibilityDelay,\n  ...restProps\n}: ScreenSpinnerProps): React.ReactNode => {\n  useScrollLock();\n\n  return (\n    <AppRootPortal usePortal={usePortal}>\n      <PopoutWrapper className={className} style={style} noBackground strategy=\"fixed\">\n        <ScreenSpinnerContainer\n          state={state}\n          mode={mode}\n          label={label}\n          customIcon={customIcon}\n          visibilityDelay={visibilityDelay}\n        >\n          <ScreenSpinnerLoader {...restProps} />\n          <ScreenSpinnerSwapIcon onClick={onClick} cancelLabel={cancelLabel} />\n        </ScreenSpinnerContainer>\n      </PopoutWrapper>\n    </AppRootPortal>\n  );\n};\n\nScreenSpinner.Container = ScreenSpinnerContainer;\nScreenSpinner.Loader = ScreenSpinnerLoader;\nScreenSpinner.SwapIcon = ScreenSpinnerSwapIcon;\n\nif (process.env.NODE_ENV !== 'production') {\n  defineComponentDisplayNames(ScreenSpinner.Container, 'ScreenSpinner.Container');\n  defineComponentDisplayNames(ScreenSpinner.Loader, 'ScreenSpinner.Loader');\n  defineComponentDisplayNames(ScreenSpinner.SwapIcon, 'ScreenSpinner.SwapIcon');\n}\n"],"names":["React","defineComponentDisplayNames","AppRootPortal","useScrollLock","PopoutWrapper","ScreenSpinnerContainer","ScreenSpinnerLoader","ScreenSpinnerSwapIcon","ScreenSpinner","style","className","state","onClick","cancelLabel","mode","label","customIcon","usePortal","visibilityDelay","restProps","noBackground","strategy","Container","Loader","SwapIcon","process","env","NODE_ENV"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,2BAA2B,QAAQ,iDAA8C;AAC1F,SAASC,aAAa,QAAQ,8BAA2B;AACzD,SAASC,aAAa,QAAQ,8BAA2B;AACzD,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,sBAAsB,QAAQ,8BAA2B;AAClE,SAASC,mBAAmB,QAAQ,2BAAwB;AAC5D,SAASC,qBAAqB,QAAQ,6BAA0B;AAKhE;;CAEC,GACD,OAAO,MAAMC,gBAIT,CAAC,EACHC,KAAK,EACLC,SAAS,EACTC,QAAQ,SAAS,EACjBC,OAAO,EACPC,WAAW,EACXC,IAAI,EACJC,KAAK,EACLC,UAAU,EACVC,SAAS,EACTC,eAAe,EACf,GAAGC,WACgB;IACnBhB;IAEA,qBACE,KAACD;QAAce,WAAWA;kBACxB,cAAA,KAACb;YAAcM,WAAWA;YAAWD,OAAOA;YAAOW,YAAY;YAACC,UAAS;sBACvE,cAAA,MAAChB;gBACCM,OAAOA;gBACPG,MAAMA;gBACNC,OAAOA;gBACPC,YAAYA;gBACZE,iBAAiBA;;kCAEjB,KAACZ;wBAAqB,GAAGa,SAAS;;kCAClC,KAACZ;wBAAsBK,SAASA;wBAASC,aAAaA;;;;;;AAKhE,EAAE;AAEFL,cAAcc,SAAS,GAAGjB;AAC1BG,cAAce,MAAM,GAAGjB;AACvBE,cAAcgB,QAAQ,GAAGjB;AAEzB,IAAIkB,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;IACzC1B,4BAA4BO,cAAcc,SAAS,EAAE;IACrDrB,4BAA4BO,cAAce,MAAM,EAAE;IAClDtB,4BAA4BO,cAAcgB,QAAQ,EAAE;AACtD"}

package/dist/cssm/components/ScrollArrow/ScrollArrow.js

@@ -36,7 +36,7 @@ const ArrowIcon = ({ size })=>{
  * Компонент стрелки. Используется в [HorizontalScroll](#/HorizontalScroll) и [Gallery](#/Gallery).
  *
  * @since 5.4.0
- * @see https://vkcom.github.io/VKUI/#/ScrollArrow
+ * @see https://vkui.io/components/scroll-arrow
  */ export const ScrollArrow = ({ size = 'm', offsetY, direction, label: labelProp, children = /*#__PURE__*/ _jsx(ArrowIcon, {
     size: size
 }), ...restProps })=>{

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ScrollArrow/ScrollArrow.tsx"],"sourcesContent":["'use client';\n\nimport * 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://vkcom.github.io/VKUI/#/ScrollArrow\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":["React","Icon16Chevron","Icon24Chevron","classNames","useConfigDirection","RootComponent","VisuallyHidden","styles","stylesSize","s","sizeS","m","sizeM","stylesDirection","up","directionUp","right","directionRight","down","directionDown","left","directionLeft","labelDirection","ArrowIcon","size","Icon","className","defaultIcon","ScrollArrow","offsetY","direction","label","labelProp","children","restProps","textDirection","Component","type","baseClassName","host","rtl","span","icon","style","top","undefined"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,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;AAClE,OAAOC,YAAY,2BAA2B;AAE9C,MAAMC,aAAa;IACjBC,GAAGF,OAAOG,KAAK;IACfC,GAAGJ,OAAOK,KAAK;AACjB;AAEA,MAAMC,kBAAkB;IACtBC,IAAIP,OAAOQ,WAAW;IACtBC,OAAOT,OAAOU,cAAc;IAC5BC,MAAMX,OAAOY,aAAa;IAC1BC,MAAMb,OAAOc,aAAa;AAC5B;AAEA,MAAMC,iBAAiB;IACrBR,IAAI;IACJE,OAAO;IACPE,MAAM;IACNE,MAAM;AACR;AAEA,MAAMG,YAAY,CAAC,EAAEC,IAAI,EAAkC;IACzD,IAAIC,OAAOvB;IACX,IAAIsB,SAAS,KAAK;QAChBC,OAAOxB;IACT;IAEA,qBAAO,KAACwB;QAAKC,WAAWnB,OAAOoB,WAAW;;AAC5C;AAuBA;;;;;CAKC,GACD,OAAO,MAAMC,cAAc,CAAC,EAC1BJ,OAAO,GAAG,EACVK,OAAO,EACPC,SAAS,EACTC,OAAOC,SAAS,EAChBC,yBAAW,KAACV;IAAUC,MAAMA;EAAQ,EACpC,GAAGU,WACc;IACjB,MAAMC,gBAAgB/B;IACtB,MAAM2B,QAAQC,aAAaV,cAAc,CAACQ,UAAU;IAEpD,qBACE,MAACzB;QACC+B,WAAU;QACVC,MAAK;QACLC,eAAenC,WACbI,OAAOgC,IAAI,EACX/B,UAAU,CAACgB,KAAK,EAChBX,eAAe,CAACiB,UAAU,EAC1BK,kBAAkB,SAAS5B,OAAOiC,GAAG;QAEtC,GAAGN,SAAS;;YAEZH,uBAAS,KAACzB;0BAAgByB;;0BAC3B,KAACU;gBAAKf,WAAWnB,OAAOmC,IAAI;gBAAEC,OAAOd,UAAU;oBAAEe,KAAKf;gBAAQ,IAAIgB;0BAC/DZ;;;;AAIT,EAAE"}
+{"version":3,"sources":["../../../../src/components/ScrollArrow/ScrollArrow.tsx"],"sourcesContent":["'use client';\n\nimport * 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":["React","Icon16Chevron","Icon24Chevron","classNames","useConfigDirection","RootComponent","VisuallyHidden","styles","stylesSize","s","sizeS","m","sizeM","stylesDirection","up","directionUp","right","directionRight","down","directionDown","left","directionLeft","labelDirection","ArrowIcon","size","Icon","className","defaultIcon","ScrollArrow","offsetY","direction","label","labelProp","children","restProps","textDirection","Component","type","baseClassName","host","rtl","span","icon","style","top","undefined"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,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;AAClE,OAAOC,YAAY,2BAA2B;AAE9C,MAAMC,aAAa;IACjBC,GAAGF,OAAOG,KAAK;IACfC,GAAGJ,OAAOK,KAAK;AACjB;AAEA,MAAMC,kBAAkB;IACtBC,IAAIP,OAAOQ,WAAW;IACtBC,OAAOT,OAAOU,cAAc;IAC5BC,MAAMX,OAAOY,aAAa;IAC1BC,MAAMb,OAAOc,aAAa;AAC5B;AAEA,MAAMC,iBAAiB;IACrBR,IAAI;IACJE,OAAO;IACPE,MAAM;IACNE,MAAM;AACR;AAEA,MAAMG,YAAY,CAAC,EAAEC,IAAI,EAAkC;IACzD,IAAIC,OAAOvB;IACX,IAAIsB,SAAS,KAAK;QAChBC,OAAOxB;IACT;IAEA,qBAAO,KAACwB;QAAKC,WAAWnB,OAAOoB,WAAW;;AAC5C;AAuBA;;;;;CAKC,GACD,OAAO,MAAMC,cAAc,CAAC,EAC1BJ,OAAO,GAAG,EACVK,OAAO,EACPC,SAAS,EACTC,OAAOC,SAAS,EAChBC,yBAAW,KAACV;IAAUC,MAAMA;EAAQ,EACpC,GAAGU,WACc;IACjB,MAAMC,gBAAgB/B;IACtB,MAAM2B,QAAQC,aAAaV,cAAc,CAACQ,UAAU;IAEpD,qBACE,MAACzB;QACC+B,WAAU;QACVC,MAAK;QACLC,eAAenC,WACbI,OAAOgC,IAAI,EACX/B,UAAU,CAACgB,KAAK,EAChBX,eAAe,CAACiB,UAAU,EAC1BK,kBAAkB,SAAS5B,OAAOiC,GAAG;QAEtC,GAAGN,SAAS;;YAEZH,uBAAS,KAACzB;0BAAgByB;;0BAC3B,KAACU;gBAAKf,WAAWnB,OAAOmC,IAAI;gBAAEC,OAAOd,UAAU;oBAAEe,KAAKf;gBAAQ,IAAIgB;0BAC/DZ;;;;AAIT,EAAE"}

package/dist/cssm/components/Search/Search.js

@@ -19,7 +19,7 @@ import { Headline } from "../Typography/Headline/Headline.js";
 import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.js";
 import styles from "./Search.module.css";
 /**
- * @see https://vkcom.github.io/VKUI/#/Search
+ * @see https://vkui.io/components/search
  */ export const Search = ({ id: idProp, before = /*#__PURE__*/ _jsx(Icon16SearchOutline, {}), className, placeholder = 'Поиск', after = 'Отмена', getRef, icon: iconProp, onIconClick, style, autoComplete = 'off', onChange, iconLabel, clearLabel = 'Очистить', clearButtonTestId, noPadding, getRootRef, findButtonText = 'Найти', findButtonTestId, onFindButtonClick, ...inputProps })=>{
     const direction = useConfigDirection();
     const isRtl = direction === 'rtl';

package/dist/cssm/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 { 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 type { HasDataAttribute, HasRef, HasRootRef } from '../../types';\nimport { Button } from '../Button/Button';\nimport { IconButton, type IconButtonProps } from '../IconButton/IconButton';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './Search.module.css';\n\nexport type RenderIconButtonFn = (\n  icon: React.ReactNode,\n  props?: Partial<IconButtonProps> & HasDataAttribute,\n) => React.ReactElement;\n\nexport interface SearchProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLInputElement> {\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   * Передает атрибут `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 * @see https://vkcom.github.io/VKUI/#/Search\n */\nexport const Search = ({\n  id: idProp,\n  before = <Icon16SearchOutline />,\n  className,\n  placeholder = 'Поиск',\n  after = 'Отмена',\n  getRef,\n  icon: iconProp,\n  onIconClick,\n  style,\n  autoComplete = 'off',\n  onChange,\n  iconLabel,\n  clearLabel = 'Очистить',\n  clearButtonTestId,\n  noPadding,\n  getRootRef,\n  findButtonText = 'Найти',\n  findButtonTestId,\n  onFindButtonClick,\n  ...inputProps\n}: SearchProps): React.ReactNode => {\n  const direction = useConfigDirection();\n  const isRtl = direction === 'rtl';\n  const inputRef = useExternRef(getRef);\n  const {\n    value: isFocused,\n    setTrue: setFocusedTrue,\n    setFalse: setFocusedFalse,\n  } = useBooleanState(false);\n  const generatedId = React.useId();\n  const inputId = idProp ? idProp : `search-${generatedId}`;\n\n  const [hasValue, setHasValue] = React.useState<boolean>(() =>\n    Boolean(inputProps.value || inputProps.defaultValue),\n  );\n  const checkHasValue: React.ChangeEventHandler<HTMLInputElement> = (e) =>\n    setHasValue(Boolean(e.currentTarget.value));\n\n  const { sizeY = 'none' } = useAdaptivity();\n  const { sizeY: adaptiveSizeY } = useAdaptivityConditionalRender();\n  const platform = usePlatform();\n\n  const hasAfter = platform === 'ios' && hasReactNode(after);\n\n  const onFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedTrue();\n    inputProps.onFocus && inputProps.onFocus(e);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedFalse();\n    inputProps.onBlur && inputProps.onBlur(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 (inputProps.value !== undefined) {\n      setHasValue(Boolean(inputProps.value));\n    }\n  }, [inputProps.value]);\n\n  useNativeFormResetListener(inputRef, () => {\n    setHasValue(Boolean(inputProps.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  return (\n    <div\n      className={classNames(\n        'vkuiInternalSearch',\n        styles.host,\n        sizeY === 'none' && styles.sizeYNone,\n        sizeY === 'compact' && styles.sizeYCompact,\n        isFocused && styles.focused,\n        hasValue && styles.hasValue,\n        hasAfter && styles.hasAfter,\n        iconProp && styles.hasIcon,\n        inputProps.disabled && styles.disabled,\n        !noPadding && styles.withPadding,\n        isRtl && styles.rtl,\n        className,\n      )}\n      ref={getRootRef}\n      style={style}\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            {...inputProps}\n            id={inputId}\n            placeholder={placeholder}\n            autoComplete={autoComplete}\n            getRootRef={inputRef}\n            className={styles.nativeInput}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            onChange={callMultiple(onChange, checkHasValue)}\n          />\n        </div>\n        <div className={styles.controls}>\n          {iconProp &&\n            (typeof iconProp === 'function'\n              ? iconProp(renderIconButton)\n              : renderIconButton(iconProp))}\n          <IconButton\n            hoverMode=\"opacity\"\n            onPointerDown={onIconCancelClickStart}\n            onClick={onCancel}\n            className={styles.icon}\n            tabIndex={hasValue ? undefined : -1}\n            disabled={inputProps.disabled}\n            data-testid={clearButtonTestId}\n          >\n            <VisuallyHidden>{clearLabel}</VisuallyHidden>\n            {platform === 'ios' ? <Icon16Clear /> : <Icon24Cancel />}\n          </IconButton>\n          {adaptiveSizeY.compact && onFindButtonClick && (\n            <Button\n              mode=\"primary\"\n              size=\"m\"\n              className={classNames(styles.findButton, adaptiveSizeY.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      </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    </div>\n  );\n};\n"],"names":["React","Icon16Clear","Icon16SearchOutline","Icon24Cancel","classNames","hasReactNode","noop","useAdaptivity","useAdaptivityConditionalRender","useBooleanState","useConfigDirection","useExternRef","useNativeFormResetListener","usePlatform","callMultiple","touchEnabled","useIsomorphicLayoutEffect","Button","IconButton","Headline","VisuallyHidden","styles","Search","id","idProp","before","className","placeholder","after","getRef","icon","iconProp","onIconClick","style","autoComplete","onChange","iconLabel","clearLabel","clearButtonTestId","noPadding","getRootRef","findButtonText","findButtonTestId","onFindButtonClick","inputProps","direction","isRtl","inputRef","value","isFocused","setTrue","setFocusedTrue","setFalse","setFocusedFalse","generatedId","useId","inputId","hasValue","setHasValue","useState","Boolean","defaultValue","checkHasValue","e","currentTarget","sizeY","adaptiveSizeY","platform","hasAfter","onFocus","onBlur","onCancel","useCallback","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","onIconCancelClickStart","preventDefault","focus","undefined","renderIconButton","props","hoverMode","onPointerDown","onClick","div","host","sizeYNone","sizeYCompact","focused","hasIcon","disabled","withPadding","rtl","ref","field","label","htmlFor","input","Component","type","level","weight","nativeInput","controls","tabIndex","data-testid","compact","mode","size","findButton","focusVisibleMode","activeMode","span","afterTextClip"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,WAAW,EAAEC,mBAAmB,EAAEC,YAAY,QAAQ,mBAAmB;AAClF,SAASC,UAAU,EAAEC,YAAY,EAAEC,IAAI,QAAQ,kBAAkB;AACjE,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,8BAA8B,QAAQ,sDAA6C;AAC5F,SAASC,eAAe,QAAQ,iCAA8B;AAC9D,SAASC,kBAAkB,QAAQ,oCAAiC;AACpE,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,0BAA0B,QAAQ,4CAAyC;AACpF,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,YAAY,QAAQ,4BAAyB;AACtD,SAASC,YAAY,QAAQ,2BAAkB;AAC/C,SAASC,yBAAyB,QAAQ,yCAAsC;AAEhF,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,UAAU,QAA8B,8BAA2B;AAC5E,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,cAAc,QAAQ,sCAAmC;AAClE,OAAOC,YAAY,sBAAsB;AA6DzC;;CAEC,GACD,OAAO,MAAMC,SAAS,CAAC,EACrBC,IAAIC,MAAM,EACVC,uBAAS,KAACvB,wBAAsB,EAChCwB,SAAS,EACTC,cAAc,OAAO,EACrBC,QAAQ,QAAQ,EAChBC,MAAM,EACNC,MAAMC,QAAQ,EACdC,WAAW,EACXC,KAAK,EACLC,eAAe,KAAK,EACpBC,QAAQ,EACRC,SAAS,EACTC,aAAa,UAAU,EACvBC,iBAAiB,EACjBC,SAAS,EACTC,UAAU,EACVC,iBAAiB,OAAO,EACxBC,gBAAgB,EAChBC,iBAAiB,EACjB,GAAGC,YACS;IACZ,MAAMC,YAAYnC;IAClB,MAAMoC,QAAQD,cAAc;IAC5B,MAAME,WAAWpC,aAAakB;IAC9B,MAAM,EACJmB,OAAOC,SAAS,EAChBC,SAASC,cAAc,EACvBC,UAAUC,eAAe,EAC1B,GAAG5C,gBAAgB;IACpB,MAAM6C,cAActD,MAAMuD,KAAK;IAC/B,MAAMC,UAAUhC,SAASA,SAAS,CAAC,OAAO,EAAE8B,aAAa;IAEzD,MAAM,CAACG,UAAUC,YAAY,GAAG1D,MAAM2D,QAAQ,CAAU,IACtDC,QAAQhB,WAAWI,KAAK,IAAIJ,WAAWiB,YAAY;IAErD,MAAMC,gBAA4D,CAACC,IACjEL,YAAYE,QAAQG,EAAEC,aAAa,CAAChB,KAAK;IAE3C,MAAM,EAAEiB,QAAQ,MAAM,EAAE,GAAG1D;IAC3B,MAAM,EAAE0D,OAAOC,aAAa,EAAE,GAAG1D;IACjC,MAAM2D,WAAWtD;IAEjB,MAAMuD,WAAWD,aAAa,SAAS9D,aAAauB;IAEpD,MAAMyC,UAAU,CAACN;QACfZ;QACAP,WAAWyB,OAAO,IAAIzB,WAAWyB,OAAO,CAACN;IAC3C;IAEA,MAAMO,SAAS,CAACP;QACdV;QACAT,WAAW0B,MAAM,IAAI1B,WAAW0B,MAAM,CAACP;IACzC;IAEA,MAAMQ,WAAWvE,MAAMwE,WAAW,CAAC;QACjC,6DAA6D;QAC7D,MAAMC,yBAAyBC,OAAOC,wBAAwB,CAC5DC,iBAAiBC,SAAS,EAC1B,UACCC;QACHL,wBAAwBM,KAAKhC,SAASiC,OAAO,EAAE;QAE/C,MAAMC,MAAM,IAAIC,MAAM,SAAS;YAAEC,SAAS;QAAK;QAC/CpC,SAASiC,OAAO,EAAEI,cAAcH;IAClC,GAAG;QAAClC;KAAS;IAEb,MAAMsC,mBAA2DrF,MAAMwE,WAAW,CAChF,CAACT,IAAM/B,cAAc+B,IACrB;QAAC/B;KAAY;IAGf,MAAMsD,yBAAiEtF,MAAMwE,WAAW,CACtF,CAACT;QACCA,EAAEwB,cAAc;QAChBxC,SAASiC,OAAO,EAAEQ;QAClB,IAAIzE,gBAAgB;YAClBwD;QACF;IACF,GACA;QAACxB;QAAUwB;KAAS;IAGtBvD,0BAA0B;QACxB,IAAI4B,WAAWI,KAAK,KAAKyC,WAAW;YAClC/B,YAAYE,QAAQhB,WAAWI,KAAK;QACtC;IACF,GAAG;QAACJ,WAAWI,KAAK;KAAC;IAErBpC,2BAA2BmC,UAAU;QACnCW,YAAYE,QAAQhB,WAAWiB,YAAY;IAC7C;IAEA,MAAM6B,mBAAuC,CAAC5D,MAAM6D,QAAQ,CAAC,CAAC,iBAC5D,MAACzE;YACC0E,WAAU;YACVC,eAAeR;YACf3D,WAAWL,OAAOS,IAAI;YACtBuC,SAASlB;YACTmB,QAAQjB;YACRyC,SAASxF;YACR,GAAGqF,KAAK;;8BAET,KAACvE;8BAAgBgB;;gBAChBN;;;IAIL,qBACE,MAACiE;QACCrE,WAAWtB,WACT,sBACAiB,OAAO2E,IAAI,EACX/B,UAAU,UAAU5C,OAAO4E,SAAS,EACpChC,UAAU,aAAa5C,OAAO6E,YAAY,EAC1CjD,aAAa5B,OAAO8E,OAAO,EAC3B1C,YAAYpC,OAAOoC,QAAQ,EAC3BW,YAAY/C,OAAO+C,QAAQ,EAC3BrC,YAAYV,OAAO+E,OAAO,EAC1BxD,WAAWyD,QAAQ,IAAIhF,OAAOgF,QAAQ,EACtC,CAAC9D,aAAalB,OAAOiF,WAAW,EAChCxD,SAASzB,OAAOkF,GAAG,EACnB7E;QAEF8E,KAAKhE;QACLP,OAAOA;;0BAEP,MAAC8D;gBAAIrE,WAAWL,OAAOoF,KAAK;;kCAC1B,KAACC;wBAAMC,SAASnD;wBAAS9B,WAAWL,OAAOqF,KAAK;kCAC7C/E;;kCAEH,MAACoE;wBAAIrE,WAAWL,OAAOuF,KAAK;;4BACzBnF;0CACD,KAACN;gCACC0F,WAAU;gCACVC,MAAK;gCACLC,OAAM;gCACNC,QAAO;gCACN,GAAGpE,UAAU;gCACdrB,IAAIiC;gCACJ7B,aAAaA;gCACbO,cAAcA;gCACdM,YAAYO;gCACZrB,WAAWL,OAAO4F,WAAW;gCAC7B5C,SAASA;gCACTC,QAAQA;gCACRnC,UAAUrB,aAAaqB,UAAU2B;;;;kCAGrC,MAACiC;wBAAIrE,WAAWL,OAAO6F,QAAQ;;4BAC5BnF,YACE,CAAA,OAAOA,aAAa,aACjBA,SAAS2D,oBACTA,iBAAiB3D,SAAQ;0CAC/B,MAACb;gCACC0E,WAAU;gCACVC,eAAeP;gCACfQ,SAASvB;gCACT7C,WAAWL,OAAOS,IAAI;gCACtBqF,UAAU1D,WAAWgC,YAAY,CAAC;gCAClCY,UAAUzD,WAAWyD,QAAQ;gCAC7Be,eAAa9E;;kDAEb,KAAClB;kDAAgBiB;;oCAChB8B,aAAa,sBAAQ,KAAClE,iCAAiB,KAACE;;;4BAE1C+D,cAAcmD,OAAO,IAAI1E,mCACxB,KAAC1B;gCACCqG,MAAK;gCACLC,MAAK;gCACL7F,WAAWtB,WAAWiB,OAAOmG,UAAU,EAAEtD,cAAcmD,OAAO,CAAC3F,SAAS;gCACxE+F,kBAAiB;gCACjB3B,SAASnD;gCACTwE,UAAU1D,WAAWgC,YAAY,CAAC;gCAClC2B,eAAa1E;0CAEZD;;;;;;YAKR2B,0BACC,KAAC2B;gBAAIrE,WAAWL,OAAOO,KAAK;0BAC1B,cAAA,KAACX;oBACCqG,MAAK;oBACLC,MAAK;oBACLE,kBAAiB;oBACjB7B,WAAU;oBACV8B,YAAW;oBACX5B,SAASvB;oBACTF,SAASlB;oBACTmB,QAAQjB;8BAER,cAAA,KAACsE;wBAAKjG,WAAWL,OAAOuG,aAAa;kCAAGhG;;;;;;AAMpD,EAAE"}
+{"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 { 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 type { HasDataAttribute, HasRef, HasRootRef } from '../../types';\nimport { Button } from '../Button/Button';\nimport { IconButton, type IconButtonProps } from '../IconButton/IconButton';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './Search.module.css';\n\nexport type RenderIconButtonFn = (\n  icon: React.ReactNode,\n  props?: Partial<IconButtonProps> & HasDataAttribute,\n) => React.ReactElement;\n\nexport interface SearchProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLInputElement> {\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   * Передает атрибут `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 * @see https://vkui.io/components/search\n */\nexport const Search = ({\n  id: idProp,\n  before = <Icon16SearchOutline />,\n  className,\n  placeholder = 'Поиск',\n  after = 'Отмена',\n  getRef,\n  icon: iconProp,\n  onIconClick,\n  style,\n  autoComplete = 'off',\n  onChange,\n  iconLabel,\n  clearLabel = 'Очистить',\n  clearButtonTestId,\n  noPadding,\n  getRootRef,\n  findButtonText = 'Найти',\n  findButtonTestId,\n  onFindButtonClick,\n  ...inputProps\n}: SearchProps): React.ReactNode => {\n  const direction = useConfigDirection();\n  const isRtl = direction === 'rtl';\n  const inputRef = useExternRef(getRef);\n  const {\n    value: isFocused,\n    setTrue: setFocusedTrue,\n    setFalse: setFocusedFalse,\n  } = useBooleanState(false);\n  const generatedId = React.useId();\n  const inputId = idProp ? idProp : `search-${generatedId}`;\n\n  const [hasValue, setHasValue] = React.useState<boolean>(() =>\n    Boolean(inputProps.value || inputProps.defaultValue),\n  );\n  const checkHasValue: React.ChangeEventHandler<HTMLInputElement> = (e) =>\n    setHasValue(Boolean(e.currentTarget.value));\n\n  const { sizeY = 'none' } = useAdaptivity();\n  const { sizeY: adaptiveSizeY } = useAdaptivityConditionalRender();\n  const platform = usePlatform();\n\n  const hasAfter = platform === 'ios' && hasReactNode(after);\n\n  const onFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedTrue();\n    inputProps.onFocus && inputProps.onFocus(e);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedFalse();\n    inputProps.onBlur && inputProps.onBlur(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 (inputProps.value !== undefined) {\n      setHasValue(Boolean(inputProps.value));\n    }\n  }, [inputProps.value]);\n\n  useNativeFormResetListener(inputRef, () => {\n    setHasValue(Boolean(inputProps.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  return (\n    <div\n      className={classNames(\n        'vkuiInternalSearch',\n        styles.host,\n        sizeY === 'none' && styles.sizeYNone,\n        sizeY === 'compact' && styles.sizeYCompact,\n        isFocused && styles.focused,\n        hasValue && styles.hasValue,\n        hasAfter && styles.hasAfter,\n        iconProp && styles.hasIcon,\n        inputProps.disabled && styles.disabled,\n        !noPadding && styles.withPadding,\n        isRtl && styles.rtl,\n        className,\n      )}\n      ref={getRootRef}\n      style={style}\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            {...inputProps}\n            id={inputId}\n            placeholder={placeholder}\n            autoComplete={autoComplete}\n            getRootRef={inputRef}\n            className={styles.nativeInput}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            onChange={callMultiple(onChange, checkHasValue)}\n          />\n        </div>\n        <div className={styles.controls}>\n          {iconProp &&\n            (typeof iconProp === 'function'\n              ? iconProp(renderIconButton)\n              : renderIconButton(iconProp))}\n          <IconButton\n            hoverMode=\"opacity\"\n            onPointerDown={onIconCancelClickStart}\n            onClick={onCancel}\n            className={styles.icon}\n            tabIndex={hasValue ? undefined : -1}\n            disabled={inputProps.disabled}\n            data-testid={clearButtonTestId}\n          >\n            <VisuallyHidden>{clearLabel}</VisuallyHidden>\n            {platform === 'ios' ? <Icon16Clear /> : <Icon24Cancel />}\n          </IconButton>\n          {adaptiveSizeY.compact && onFindButtonClick && (\n            <Button\n              mode=\"primary\"\n              size=\"m\"\n              className={classNames(styles.findButton, adaptiveSizeY.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      </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    </div>\n  );\n};\n"],"names":["React","Icon16Clear","Icon16SearchOutline","Icon24Cancel","classNames","hasReactNode","noop","useAdaptivity","useAdaptivityConditionalRender","useBooleanState","useConfigDirection","useExternRef","useNativeFormResetListener","usePlatform","callMultiple","touchEnabled","useIsomorphicLayoutEffect","Button","IconButton","Headline","VisuallyHidden","styles","Search","id","idProp","before","className","placeholder","after","getRef","icon","iconProp","onIconClick","style","autoComplete","onChange","iconLabel","clearLabel","clearButtonTestId","noPadding","getRootRef","findButtonText","findButtonTestId","onFindButtonClick","inputProps","direction","isRtl","inputRef","value","isFocused","setTrue","setFocusedTrue","setFalse","setFocusedFalse","generatedId","useId","inputId","hasValue","setHasValue","useState","Boolean","defaultValue","checkHasValue","e","currentTarget","sizeY","adaptiveSizeY","platform","hasAfter","onFocus","onBlur","onCancel","useCallback","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","onIconCancelClickStart","preventDefault","focus","undefined","renderIconButton","props","hoverMode","onPointerDown","onClick","div","host","sizeYNone","sizeYCompact","focused","hasIcon","disabled","withPadding","rtl","ref","field","label","htmlFor","input","Component","type","level","weight","nativeInput","controls","tabIndex","data-testid","compact","mode","size","findButton","focusVisibleMode","activeMode","span","afterTextClip"],"mappings":"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"}

package/dist/cssm/components/SegmentedControl/SegmentedControl.js

@@ -17,7 +17,7 @@ const sizeYClassNames = {
 };
 const warn = warnOnce('SegmentedControl');
 /**
- * @see https://vkcom.github.io/VKUI/#/SegmentedControl
+ * @see https://vkui.io/components/segmented-control
  */ export const SegmentedControl = ({ size = 'l', name, options, defaultValue = options[0]?.value, children, onChange: onChangeProp, value: valueProp, role = 'radiogroup', ...restProps })=>{
     const id = React.useId();
     const direction = useConfigDirection();

package/dist/cssm/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 sizeYClassNames = {\n  none: styles.sizeYNone,\n  regular: styles.sizeYRegular,\n};\n\nexport type SegmentedControlValue = string | number | undefined;\n\nexport interface SegmentedControlOptionInterface\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: SegmentedControlValue;\n}\n\nexport interface SegmentedControlProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'> {\n  /**\n   * Массив опций для отображения в компоненте.\n   */\n  options: SegmentedControlOptionInterface[];\n  /**\n   * Размер компонента.\n   */\n  size?: 'm' | 'l';\n  /**\n   * Имя для input-элементов внутри компонента.\n   */\n  name?: string;\n  /**\n   * Обработчик изменения выбранного значения.\n   */\n  onChange?: (value: SegmentedControlValue) => void;\n  /**\n   * Текущее выбранное значение (для контролируемого компонента).\n   */\n  value?: SegmentedControlValue;\n  /**\n   * Значение по умолчанию (для неконтролируемого компонента).\n   */\n  defaultValue?: SegmentedControlValue;\n}\n\nconst warn = warnOnce('SegmentedControl');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SegmentedControl\n */\nexport const SegmentedControl = ({\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): 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 { sizeY = '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        sizeY !== 'compact' && sizeYClassNames[sizeY],\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","styles","sizeYClassNames","none","sizeYNone","regular","sizeYRegular","warn","SegmentedControl","size","name","options","defaultValue","value","children","onChange","onChangeProp","valueProp","role","restProps","id","useId","direction","isRtl","sizeY","tabsRef","actualIndex","findIndex","option","process","env","NODE_ENV","sliderStyle","String","length","baseClassName","host","sizeL","rtl","div","ref","className","in","aria-hidden","slider","style","map","label","before","optionProps","selected","onSelect","optionRootProps","tabIndex","undefined","optionInputProps","checked","rootProps","inputProps"],"mappings":"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"}
+{"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 sizeYClassNames = {\n  none: styles.sizeYNone,\n  regular: styles.sizeYRegular,\n};\n\nexport type SegmentedControlValue = string | number | undefined;\n\nexport interface SegmentedControlOptionInterface\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: SegmentedControlValue;\n}\n\nexport interface SegmentedControlProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'> {\n  /**\n   * Массив опций для отображения в компоненте.\n   */\n  options: SegmentedControlOptionInterface[];\n  /**\n   * Размер компонента.\n   */\n  size?: 'm' | 'l';\n  /**\n   * Имя для input-элементов внутри компонента.\n   */\n  name?: string;\n  /**\n   * Обработчик изменения выбранного значения.\n   */\n  onChange?: (value: SegmentedControlValue) => void;\n  /**\n   * Текущее выбранное значение (для контролируемого компонента).\n   */\n  value?: SegmentedControlValue;\n  /**\n   * Значение по умолчанию (для неконтролируемого компонента).\n   */\n  defaultValue?: SegmentedControlValue;\n}\n\nconst warn = warnOnce('SegmentedControl');\n\n/**\n * @see https://vkui.io/components/segmented-control\n */\nexport const SegmentedControl = ({\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): 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 { sizeY = '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        sizeY !== 'compact' && sizeYClassNames[sizeY],\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","styles","sizeYClassNames","none","sizeYNone","regular","sizeYRegular","warn","SegmentedControl","size","name","options","defaultValue","value","children","onChange","onChangeProp","valueProp","role","restProps","id","useId","direction","isRtl","sizeY","tabsRef","actualIndex","findIndex","option","process","env","NODE_ENV","sliderStyle","String","length","baseClassName","host","sizeL","rtl","div","ref","className","in","aria-hidden","slider","style","map","label","before","optionProps","selected","onSelect","optionRootProps","tabIndex","undefined","optionInputProps","checked","rootProps","inputProps"],"mappings":"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"}

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

@@ -6,9 +6,7 @@ import { Clickable } from "../../Clickable/Clickable.js";
 import { Headline } from "../../Typography/Headline/Headline.js";
 import { VisuallyHidden } from "../../VisuallyHidden/VisuallyHidden.js";
 import styles from "./SegmentedControlOption.module.css";
-/**
- * @see https://vkcom.github.io/VKUI/#/SegmentedControl
- */ export const SegmentedControlOption = ({ getRef, children, getRootRef, before, rootProps, inputProps })=>/*#__PURE__*/ _jsxs(Clickable, {
+export const SegmentedControlOption = ({ getRef, children, getRootRef, before, rootProps, inputProps })=>/*#__PURE__*/ _jsxs(Clickable, {
         Component: "label",
         baseClassName: styles.host,
         hoverClassName: styles.hover,

package/dist/cssm/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 * 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\n/**\n * @see https://vkcom.github.io/VKUI/#/SegmentedControl\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":["React","hasReactNode","Clickable","Headline","VisuallyHidden","styles","SegmentedControlOption","getRef","children","getRootRef","before","rootProps","inputProps","Component","baseClassName","host","hoverClassName","hover","activeClassName","type","div","className","level","weight"],"mappings":"AAAA;;AACA,sCAAsC,GAEtC,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,kBAAkB;AAE/C,SAASC,SAAS,QAAQ,+BAA4B;AACtD,SAASC,QAAQ,QAAQ,wCAAqC;AAC9D,SAASC,cAAc,QAAQ,yCAAsC;AACrE,OAAOC,YAAY,sCAAsC;AAWzD;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CAAC,EACrCC,MAAM,EACNC,QAAQ,EACRC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,UAAU,EACkB,iBAC5B,MAACV;QACCW,WAAU;QACVC,eAAeT,OAAOU,IAAI;QAC1BC,gBAAgBX,OAAOY,KAAK;QAC5BC,iBAAiBb,OAAOY,KAAK;QAC7BR,YAAYA;QACX,GAAGE,SAAS;;YAEZC,4BACC,KAACR;gBAAgB,GAAGQ,UAAU;gBAAEC,WAAU;gBAAQJ,YAAYF;gBAAQY,MAAK;;YAE5ElB,aAAaS,yBAAW,KAACU;gBAAIC,WAAWhB,OAAOK,MAAM;0BAAGA;;0BACzD,KAACP;gBAASmB,OAAM;gBAAIC,QAAO;0BACxBf;;;OAGL"}
+{"version":3,"sources":["../../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport * 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":["React","hasReactNode","Clickable","Headline","VisuallyHidden","styles","SegmentedControlOption","getRef","children","getRootRef","before","rootProps","inputProps","Component","baseClassName","host","hoverClassName","hover","activeClassName","type","div","className","level","weight"],"mappings":"AAAA;;AACA,sCAAsC,GAEtC,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,kBAAkB;AAE/C,SAASC,SAAS,QAAQ,+BAA4B;AACtD,SAASC,QAAQ,QAAQ,wCAAqC;AAC9D,SAASC,cAAc,QAAQ,yCAAsC;AACrE,OAAOC,YAAY,sCAAsC;AAWzD,OAAO,MAAMC,yBAAyB,CAAC,EACrCC,MAAM,EACNC,QAAQ,EACRC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,UAAU,EACkB,iBAC5B,MAACV;QACCW,WAAU;QACVC,eAAeT,OAAOU,IAAI;QAC1BC,gBAAgBX,OAAOY,KAAK;QAC5BC,iBAAiBb,OAAOY,KAAK;QAC7BR,YAAYA;QACX,GAAGE,SAAS;;YAEZC,4BACC,KAACR;gBAAgB,GAAGQ,UAAU;gBAAEC,WAAU;gBAAQJ,YAAYF;gBAAQY,MAAK;;YAE5ElB,aAAaS,yBAAW,KAACU;gBAAIC,WAAWhB,OAAOK,MAAM;0BAAGA;;0BACzD,KAACP;gBAASmB,OAAM;gBAAIC,QAAO;0BACxBf;;;OAGL"}

package/dist/cssm/components/Select/Select.js

@@ -6,7 +6,7 @@ import { useAdaptivityConditionalRender } from "../../hooks/useAdaptivityConditi
 import { CustomSelect } from "../CustomSelect/CustomSelect.js";
 import { NativeSelect } from "../NativeSelect/NativeSelect.js";
 /**
- * @see https://vkcom.github.io/VKUI/#/Select
+ * @see https://vkui.io/components/select
  */ export const Select = ({ children, className, ...props })=>{
     const { options = [], searchable, emptyText, onInputChange, filterFn, popupDirection, renderOption, renderDropdown, fetching, onClose, onOpen, icon, ClearButton, allowClearButton, clearButtonTestId, dropdownOffsetDistance, dropdownAutoWidth, forceDropdownPortal, noMaxHeight, labelTextTestId, nativeSelectTestId, after, mode, pattern, minLength, maxLength, readOnly, getSelectInputRef, overscrollBehavior, beforeAlign, afterAlign, onInputKeyDown, ...restProps } = props;
     const { deviceType } = useAdaptivityConditionalRender();

package/dist/cssm/components/Select/Select.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Select/Select.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport type { HasOnlyExpectedProps } from '../../types';\nimport {\n  CustomSelect,\n  type CustomSelectOptionInterface,\n  type SelectProps,\n} from '../CustomSelect/CustomSelect';\nimport { NativeSelect, type NativeSelectProps } from '../NativeSelect/NativeSelect';\nexport type SelectType = 'default' | 'plain' | 'accent';\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Select\n */\nexport const Select = <OptionT extends CustomSelectOptionInterface>({\n  children,\n  className,\n  ...props\n}: SelectProps<OptionT>): React.ReactNode => {\n  const {\n    options = [],\n    searchable,\n    emptyText,\n    onInputChange,\n    filterFn,\n    popupDirection,\n    renderOption,\n    renderDropdown,\n    fetching,\n    onClose,\n    onOpen,\n    icon,\n    ClearButton,\n    allowClearButton,\n    clearButtonTestId,\n    dropdownOffsetDistance,\n    dropdownAutoWidth,\n    forceDropdownPortal,\n    noMaxHeight,\n    labelTextTestId,\n    nativeSelectTestId,\n    after,\n    mode,\n    pattern,\n    minLength,\n    maxLength,\n    readOnly,\n    getSelectInputRef,\n    overscrollBehavior,\n    beforeAlign,\n    afterAlign,\n    onInputKeyDown,\n    ...restProps\n  } = props;\n\n  const { deviceType } = useAdaptivityConditionalRender();\n\n  const nativeProps: HasOnlyExpectedProps<typeof restProps, NativeSelectProps> = restProps;\n\n  return (\n    <React.Fragment>\n      {deviceType.desktop && (\n        <CustomSelect className={classNames(className, deviceType.desktop.className)} {...props} />\n      )}\n      {deviceType.mobile && (\n        <NativeSelect\n          className={classNames(className, deviceType.mobile.className)}\n          {...nativeProps}\n        >\n          {options.map(({ label, value, disabled }) => (\n            <option value={value} key={`${value}`} disabled={disabled}>\n              {label}\n            </option>\n          ))}\n        </NativeSelect>\n      )}\n    </React.Fragment>\n  );\n};\n"],"names":["React","classNames","useAdaptivityConditionalRender","CustomSelect","NativeSelect","Select","children","className","props","options","searchable","emptyText","onInputChange","filterFn","popupDirection","renderOption","renderDropdown","fetching","onClose","onOpen","icon","ClearButton","allowClearButton","clearButtonTestId","dropdownOffsetDistance","dropdownAutoWidth","forceDropdownPortal","noMaxHeight","labelTextTestId","nativeSelectTestId","after","mode","pattern","minLength","maxLength","readOnly","getSelectInputRef","overscrollBehavior","beforeAlign","afterAlign","onInputKeyDown","restProps","deviceType","nativeProps","Fragment","desktop","mobile","map","label","value","disabled","option"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,8BAA8B,QAAQ,sDAA6C;AAE5F,SACEC,YAAY,QAGP,kCAA+B;AACtC,SAASC,YAAY,QAAgC,kCAA+B;AAGpF;;CAEC,GACD,OAAO,MAAMC,SAAS,CAA8C,EAClEC,QAAQ,EACRC,SAAS,EACT,GAAGC,OACkB;IACrB,MAAM,EACJC,UAAU,EAAE,EACZC,UAAU,EACVC,SAAS,EACTC,aAAa,EACbC,QAAQ,EACRC,cAAc,EACdC,YAAY,EACZC,cAAc,EACdC,QAAQ,EACRC,OAAO,EACPC,MAAM,EACNC,IAAI,EACJC,WAAW,EACXC,gBAAgB,EAChBC,iBAAiB,EACjBC,sBAAsB,EACtBC,iBAAiB,EACjBC,mBAAmB,EACnBC,WAAW,EACXC,eAAe,EACfC,kBAAkB,EAClBC,KAAK,EACLC,IAAI,EACJC,OAAO,EACPC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACRC,iBAAiB,EACjBC,kBAAkB,EAClBC,WAAW,EACXC,UAAU,EACVC,cAAc,EACd,GAAGC,WACJ,GAAGjC;IAEJ,MAAM,EAAEkC,UAAU,EAAE,GAAGxC;IAEvB,MAAMyC,cAAyEF;IAE/E,qBACE,MAACzC,MAAM4C,QAAQ;;YACZF,WAAWG,OAAO,kBACjB,KAAC1C;gBAAaI,WAAWN,WAAWM,WAAWmC,WAAWG,OAAO,CAACtC,SAAS;gBAAI,GAAGC,KAAK;;YAExFkC,WAAWI,MAAM,kBAChB,KAAC1C;gBACCG,WAAWN,WAAWM,WAAWmC,WAAWI,MAAM,CAACvC,SAAS;gBAC3D,GAAGoC,WAAW;0BAEdlC,QAAQsC,GAAG,CAAC,CAAC,EAAEC,KAAK,EAAEC,KAAK,EAAEC,QAAQ,EAAE,iBACtC,KAACC;wBAAOF,OAAOA;wBAAwBC,UAAUA;kCAC9CF;uBADwB,GAAGC,OAAO;;;;AAQjD,EAAE"}
+{"version":3,"sources":["../../../../src/components/Select/Select.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport type { HasOnlyExpectedProps } from '../../types';\nimport {\n  CustomSelect,\n  type CustomSelectOptionInterface,\n  type SelectProps,\n} from '../CustomSelect/CustomSelect';\nimport { NativeSelect, type NativeSelectProps } from '../NativeSelect/NativeSelect';\nexport type SelectType = 'default' | 'plain' | 'accent';\n\n/**\n * @see https://vkui.io/components/select\n */\nexport const Select = <OptionT extends CustomSelectOptionInterface>({\n  children,\n  className,\n  ...props\n}: SelectProps<OptionT>): React.ReactNode => {\n  const {\n    options = [],\n    searchable,\n    emptyText,\n    onInputChange,\n    filterFn,\n    popupDirection,\n    renderOption,\n    renderDropdown,\n    fetching,\n    onClose,\n    onOpen,\n    icon,\n    ClearButton,\n    allowClearButton,\n    clearButtonTestId,\n    dropdownOffsetDistance,\n    dropdownAutoWidth,\n    forceDropdownPortal,\n    noMaxHeight,\n    labelTextTestId,\n    nativeSelectTestId,\n    after,\n    mode,\n    pattern,\n    minLength,\n    maxLength,\n    readOnly,\n    getSelectInputRef,\n    overscrollBehavior,\n    beforeAlign,\n    afterAlign,\n    onInputKeyDown,\n    ...restProps\n  } = props;\n\n  const { deviceType } = useAdaptivityConditionalRender();\n\n  const nativeProps: HasOnlyExpectedProps<typeof restProps, NativeSelectProps> = restProps;\n\n  return (\n    <React.Fragment>\n      {deviceType.desktop && (\n        <CustomSelect className={classNames(className, deviceType.desktop.className)} {...props} />\n      )}\n      {deviceType.mobile && (\n        <NativeSelect\n          className={classNames(className, deviceType.mobile.className)}\n          {...nativeProps}\n        >\n          {options.map(({ label, value, disabled }) => (\n            <option value={value} key={`${value}`} disabled={disabled}>\n              {label}\n            </option>\n          ))}\n        </NativeSelect>\n      )}\n    </React.Fragment>\n  );\n};\n"],"names":["React","classNames","useAdaptivityConditionalRender","CustomSelect","NativeSelect","Select","children","className","props","options","searchable","emptyText","onInputChange","filterFn","popupDirection","renderOption","renderDropdown","fetching","onClose","onOpen","icon","ClearButton","allowClearButton","clearButtonTestId","dropdownOffsetDistance","dropdownAutoWidth","forceDropdownPortal","noMaxHeight","labelTextTestId","nativeSelectTestId","after","mode","pattern","minLength","maxLength","readOnly","getSelectInputRef","overscrollBehavior","beforeAlign","afterAlign","onInputKeyDown","restProps","deviceType","nativeProps","Fragment","desktop","mobile","map","label","value","disabled","option"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,8BAA8B,QAAQ,sDAA6C;AAE5F,SACEC,YAAY,QAGP,kCAA+B;AACtC,SAASC,YAAY,QAAgC,kCAA+B;AAGpF;;CAEC,GACD,OAAO,MAAMC,SAAS,CAA8C,EAClEC,QAAQ,EACRC,SAAS,EACT,GAAGC,OACkB;IACrB,MAAM,EACJC,UAAU,EAAE,EACZC,UAAU,EACVC,SAAS,EACTC,aAAa,EACbC,QAAQ,EACRC,cAAc,EACdC,YAAY,EACZC,cAAc,EACdC,QAAQ,EACRC,OAAO,EACPC,MAAM,EACNC,IAAI,EACJC,WAAW,EACXC,gBAAgB,EAChBC,iBAAiB,EACjBC,sBAAsB,EACtBC,iBAAiB,EACjBC,mBAAmB,EACnBC,WAAW,EACXC,eAAe,EACfC,kBAAkB,EAClBC,KAAK,EACLC,IAAI,EACJC,OAAO,EACPC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACRC,iBAAiB,EACjBC,kBAAkB,EAClBC,WAAW,EACXC,UAAU,EACVC,cAAc,EACd,GAAGC,WACJ,GAAGjC;IAEJ,MAAM,EAAEkC,UAAU,EAAE,GAAGxC;IAEvB,MAAMyC,cAAyEF;IAE/E,qBACE,MAACzC,MAAM4C,QAAQ;;YACZF,WAAWG,OAAO,kBACjB,KAAC1C;gBAAaI,WAAWN,WAAWM,WAAWmC,WAAWG,OAAO,CAACtC,SAAS;gBAAI,GAAGC,KAAK;;YAExFkC,WAAWI,MAAM,kBAChB,KAAC1C;gBACCG,WAAWN,WAAWM,WAAWmC,WAAWI,MAAM,CAACvC,SAAS;gBAC3D,GAAGoC,WAAW;0BAEdlC,QAAQsC,GAAG,CAAC,CAAC,EAAEC,KAAK,EAAEC,KAAK,EAAEC,QAAQ,EAAE,iBACtC,KAACC;wBAAOF,OAAOA;wBAAwBC,UAAUA;kCAC9CF;uBADwB,GAAGC,OAAO;;;;AAQjD,EAAE"}

package/dist/cssm/components/SelectMimicry/SelectMimicry.js

@@ -15,7 +15,7 @@ const sizeYClassNames = {
     compact: styles.sizeYCompact
 };
 /**
- * @see https://vkcom.github.io/VKUI/#/SelectMimicry
+ * @see https://vkui.io/components/select-mimicry
  */ export const SelectMimicry = ({ tabIndex = 0, placeholder, children, align, getRootRef, multiline, disabled, onClick, before, after = /*#__PURE__*/ _jsx(DropdownIcon, {}), selectType = 'default', status, className, autoFocus, ...restProps })=>{
     const rootRef = useExternRef(getRootRef);
     const { sizeY = 'none' } = useAdaptivity();

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SelectMimicry/SelectMimicry.tsx"],"sourcesContent":["'use client';\n\nimport * 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 sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\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://vkcom.github.io/VKUI/#/SelectMimicry\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 { sizeY = '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        sizeY !== 'regular' && sizeYClassNames[sizeY],\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":["React","classNames","useAdaptivity","useAutoFocus","useExternRef","getFormFieldModeFromSelectType","DropdownIcon","FormField","SelectTypography","styles","sizeYClassNames","none","sizeYNone","compact","sizeYCompact","SelectMimicry","tabIndex","placeholder","children","align","getRootRef","multiline","disabled","onClick","before","after","selectType","status","className","autoFocus","restProps","rootRef","sizeY","title","undefined","host","empty","alignCenter","alignRight","hasBefore","mode","div","container"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,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;AACxE,OAAOC,YAAY,8BAA8B;AAEjD,MAAMC,kBAAkB;IACtBC,MAAMF,OAAOG,SAAS;IACtBC,SAASJ,OAAOK,YAAY;AAC9B;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,KAACnB,iBAAe,EACxBoB,aAAa,SAAS,EACtBC,MAAM,EACNC,SAAS,EACTC,SAAS,EACT,GAAGC,WACgB;IACnB,MAAMC,UAAU3B,aAAagB;IAE7B,MAAM,EAAEY,QAAQ,MAAM,EAAE,GAAG9B;IAC3B,MAAM+B,QAAQf,YAAYD;IAE1Bd,aAAa4B,SAASF;IAEtB,qBACE,KAACtB;QACE,GAAGuB,SAAS;QACbd,UAAUM,WAAWY,YAAYlB;QACjCY,WAAW3B,WACTQ,OAAO0B,IAAI,EACXH,UAAU,aAAatB,eAAe,CAACsB,MAAM,EAC7C,CAACd,YAAYT,OAAO2B,KAAK,EACzBf,aAAaZ,OAAOY,SAAS,EAC7BF,UAAU,YAAYV,OAAO4B,WAAW,EACxClB,UAAU,WAAWV,OAAO6B,UAAU,EACtCd,UAAUf,OAAO8B,SAAS,EAC1BX;QAEFR,YAAYW;QACZR,SAASD,WAAWY,YAAYX;QAChCD,UAAUA;QACVE,QAAQA;QACRC,OAAOA;QACPe,MAAMnC,+BAA+BqB;QACrCC,QAAQA;kBAER,cAAA,KAACc;YAAIb,WAAWnB,OAAOiC,SAAS;sBAC9B,cAAA,KAAClC;gBAAiBkB,YAAYA;gBAAYE,WAAWnB,OAAOwB,KAAK;0BAC9DA;;;;AAKX,EAAE"}
+{"version":3,"sources":["../../../../src/components/SelectMimicry/SelectMimicry.tsx"],"sourcesContent":["'use client';\n\nimport * 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 sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\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 { sizeY = '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        sizeY !== 'regular' && sizeYClassNames[sizeY],\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":["React","classNames","useAdaptivity","useAutoFocus","useExternRef","getFormFieldModeFromSelectType","DropdownIcon","FormField","SelectTypography","styles","sizeYClassNames","none","sizeYNone","compact","sizeYCompact","SelectMimicry","tabIndex","placeholder","children","align","getRootRef","multiline","disabled","onClick","before","after","selectType","status","className","autoFocus","restProps","rootRef","sizeY","title","undefined","host","empty","alignCenter","alignRight","hasBefore","mode","div","container"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,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;AACxE,OAAOC,YAAY,8BAA8B;AAEjD,MAAMC,kBAAkB;IACtBC,MAAMF,OAAOG,SAAS;IACtBC,SAASJ,OAAOK,YAAY;AAC9B;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,KAACnB,iBAAe,EACxBoB,aAAa,SAAS,EACtBC,MAAM,EACNC,SAAS,EACTC,SAAS,EACT,GAAGC,WACgB;IACnB,MAAMC,UAAU3B,aAAagB;IAE7B,MAAM,EAAEY,QAAQ,MAAM,EAAE,GAAG9B;IAC3B,MAAM+B,QAAQf,YAAYD;IAE1Bd,aAAa4B,SAASF;IAEtB,qBACE,KAACtB;QACE,GAAGuB,SAAS;QACbd,UAAUM,WAAWY,YAAYlB;QACjCY,WAAW3B,WACTQ,OAAO0B,IAAI,EACXH,UAAU,aAAatB,eAAe,CAACsB,MAAM,EAC7C,CAACd,YAAYT,OAAO2B,KAAK,EACzBf,aAAaZ,OAAOY,SAAS,EAC7BF,UAAU,YAAYV,OAAO4B,WAAW,EACxClB,UAAU,WAAWV,OAAO6B,UAAU,EACtCd,UAAUf,OAAO8B,SAAS,EAC1BX;QAEFR,YAAYW;QACZR,SAASD,WAAWY,YAAYX;QAChCD,UAAUA;QACVE,QAAQA;QACRC,OAAOA;QACPe,MAAMnC,+BAA+BqB;QACrCC,QAAQA;kBAER,cAAA,KAACc;YAAIb,WAAWnB,OAAOiC,SAAS;sBAC9B,cAAA,KAAClC;gBAAiBkB,YAAYA;gBAAYE,WAAWnB,OAAOwB,KAAK;0BAC9DA;;;;AAKX,EAAE"}

package/dist/cssm/components/SelectionControl/SelectionControl.js

@@ -13,7 +13,7 @@ const sizeYClassNames = {
     compact: styles.sizeYCompact
 };
 /**
- * @see https://vkcom.github.io/VKUI/#/SelectionControl
+ * @see https://vkui.io/components/selection-control
  */ export const SelectionControl = (restProps)=>{
     const { sizeY = 'none' } = useAdaptivity();
     const platform = usePlatform();

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SelectionControl/SelectionControl.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { HasRootRef } from '../../types';\nimport { DEFAULT_ACTIVE_EFFECT_DELAY } from '../Clickable/useState';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport { SelectionControlLabel } from './SelectionControlLabel/SelectionControlLabel';\nimport styles from './SelectionControl.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\nexport interface SelectionControlProps\n  extends React.ComponentProps<'label'>,\n    HasRootRef<HTMLLabelElement>,\n    Pick<\n      TappableOmitProps,\n      'hoverMode' | 'activeMode' | 'hasHover' | 'hasActive' | 'focusVisibleMode' | 'disabled'\n    > {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SelectionControl\n */\nexport const SelectionControl = (restProps: SelectionControlProps): React.ReactNode => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const platform = usePlatform();\n\n  return (\n    <Tappable\n      Component=\"label\"\n      baseClassName={classNames(styles.host, sizeY !== 'regular' && sizeYClassNames[sizeY])}\n      activeEffectDelay={platform === 'ios' ? 100 : DEFAULT_ACTIVE_EFFECT_DELAY}\n      {...restProps}\n    />\n  );\n};\n\nSelectionControl.Label = SelectionControlLabel;\n"],"names":["React","classNames","useAdaptivity","usePlatform","DEFAULT_ACTIVE_EFFECT_DELAY","Tappable","SelectionControlLabel","styles","sizeYClassNames","none","sizeYNone","compact","sizeYCompact","SelectionControl","restProps","sizeY","platform","Component","baseClassName","host","activeEffectDelay","Label"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,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,qBAAqB,QAAQ,mDAAgD;AACtF,OAAOC,YAAY,gCAAgC;AAEnD,MAAMC,kBAAkB;IACtBC,MAAMF,OAAOG,SAAS;IACtBC,SAASJ,OAAOK,YAAY;AAC9B;AAUA;;CAEC,GACD,OAAO,MAAMC,mBAAmB,CAACC;IAC/B,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGb;IAC3B,MAAMc,WAAWb;IAEjB,qBACE,KAACE;QACCY,WAAU;QACVC,eAAejB,WAAWM,OAAOY,IAAI,EAAEJ,UAAU,aAAaP,eAAe,CAACO,MAAM;QACpFK,mBAAmBJ,aAAa,QAAQ,MAAMZ;QAC7C,GAAGU,SAAS;;AAGnB,EAAE;AAEFD,iBAAiBQ,KAAK,GAAGf"}
+{"version":3,"sources":["../../../../src/components/SelectionControl/SelectionControl.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { HasRootRef } from '../../types';\nimport { DEFAULT_ACTIVE_EFFECT_DELAY } from '../Clickable/useState';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport { SelectionControlLabel } from './SelectionControlLabel/SelectionControlLabel';\nimport styles from './SelectionControl.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\nexport interface SelectionControlProps\n  extends React.ComponentProps<'label'>,\n    HasRootRef<HTMLLabelElement>,\n    Pick<\n      TappableOmitProps,\n      'hoverMode' | 'activeMode' | 'hasHover' | 'hasActive' | 'focusVisibleMode' | 'disabled'\n    > {}\n\n/**\n * @see https://vkui.io/components/selection-control\n */\nexport const SelectionControl = (restProps: SelectionControlProps): React.ReactNode => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const platform = usePlatform();\n\n  return (\n    <Tappable\n      Component=\"label\"\n      baseClassName={classNames(styles.host, sizeY !== 'regular' && sizeYClassNames[sizeY])}\n      activeEffectDelay={platform === 'ios' ? 100 : DEFAULT_ACTIVE_EFFECT_DELAY}\n      {...restProps}\n    />\n  );\n};\n\nSelectionControl.Label = SelectionControlLabel;\n"],"names":["React","classNames","useAdaptivity","usePlatform","DEFAULT_ACTIVE_EFFECT_DELAY","Tappable","SelectionControlLabel","styles","sizeYClassNames","none","sizeYNone","compact","sizeYCompact","SelectionControl","restProps","sizeY","platform","Component","baseClassName","host","activeEffectDelay","Label"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,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,qBAAqB,QAAQ,mDAAgD;AACtF,OAAOC,YAAY,gCAAgC;AAEnD,MAAMC,kBAAkB;IACtBC,MAAMF,OAAOG,SAAS;IACtBC,SAASJ,OAAOK,YAAY;AAC9B;AAUA;;CAEC,GACD,OAAO,MAAMC,mBAAmB,CAACC;IAC/B,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGb;IAC3B,MAAMc,WAAWb;IAEjB,qBACE,KAACE;QACCY,WAAU;QACVC,eAAejB,WAAWM,OAAOY,IAAI,EAAEJ,UAAU,aAAaP,eAAe,CAACO,MAAM;QACpFK,mBAAmBJ,aAAa,QAAQ,MAAMZ;QAC7C,GAAGU,SAAS;;AAGnB,EAAE;AAEFD,iBAAiBQ,KAAK,GAAGf"}

package/dist/cssm/components/Separator/Separator.js

@@ -18,7 +18,7 @@ const alignClassNames = {
     end: styles.alignEnd
 };
 /**
- * @see https://vkcom.github.io/VKUI/#/Separator
+ * @see https://vkui.io/components/separator
  */ export const Separator = ({ padding = false, appearance = 'primary', direction = 'horizontal', align = 'center', size, ...restProps })=>{
     const [spacingSizeClassName, spacingSizeStyle] = resolveSpacingSize(CUSTOM_CSS_TOKEN_FOR_USER_SIZE, size);
     return /*#__PURE__*/ _jsx(RootComponent, {

package/dist/cssm/components/Separator/Separator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Separator/Separator.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { resolveSpacingSize, type SpacingSizeProp } from '../../lib/spacings/sizes';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Separator.module.css';\n\nexport const CUSTOM_CSS_TOKEN_FOR_USER_SIZE = '--vkui_internal--spacing_size';\n\nexport interface SeparatorProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Стиль отображения разделителя.\n   */\n  appearance?: 'primary' | 'secondary' | 'primary-alpha';\n  /**\n   * Добавляет стандартные отступы у разделителя.\n   */\n  padding?: boolean;\n  /**\n   * Направление отображения разделителя.\n   */\n  direction?: 'horizontal' | 'vertical';\n  /**\n   * Размер контейнера, в который вложен разделитель.\n   *\n   * Принимает значения дизайн-системы, числовые значения и css-переменные.\n   */\n  size?: SpacingSizeProp;\n  /**\n   * Выравнивание разделителя в контейнере.\n   */\n  align?: 'start' | 'center' | 'end';\n}\n\nconst appearanceClassNames = {\n  'primary': styles.appearancePrimary,\n  'secondary': styles.appearanceSecondary,\n  'primary-alpha': styles.appearancePrimaryAlpha,\n};\n\nconst directionClassNames = {\n  horizontal: styles.directionHorizontal,\n  vertical: styles.directionVertical,\n};\n\nconst alignClassNames = {\n  start: styles.alignStart,\n  end: styles.alignEnd,\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Separator\n */\nexport const Separator = ({\n  padding = false,\n  appearance = 'primary',\n  direction = 'horizontal',\n  align = 'center',\n  size,\n  ...restProps\n}: SeparatorProps): React.ReactNode => {\n  const [spacingSizeClassName, spacingSizeStyle] = resolveSpacingSize(\n    CUSTOM_CSS_TOKEN_FOR_USER_SIZE,\n    size,\n  );\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        padding && styles.padded,\n        appearanceClassNames[appearance],\n        directionClassNames[direction],\n        size !== undefined && styles.sized,\n        align !== 'center' && alignClassNames[align],\n        spacingSizeClassName,\n      )}\n      baseStyle={spacingSizeStyle}\n    >\n      <hr className={styles.in} />\n    </RootComponent>\n  );\n};\n"],"names":["classNames","resolveSpacingSize","RootComponent","styles","CUSTOM_CSS_TOKEN_FOR_USER_SIZE","appearanceClassNames","appearancePrimary","appearanceSecondary","appearancePrimaryAlpha","directionClassNames","horizontal","directionHorizontal","vertical","directionVertical","alignClassNames","start","alignStart","end","alignEnd","Separator","padding","appearance","direction","align","size","restProps","spacingSizeClassName","spacingSizeStyle","baseClassName","padded","undefined","sized","baseStyle","hr","className","in"],"mappings":";AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,kBAAkB,QAA8B,8BAA2B;AAEpF,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,OAAOC,YAAY,yBAAyB;AAE5C,OAAO,MAAMC,iCAAiC,gCAAgC;AA2B9E,MAAMC,uBAAuB;IAC3B,WAAWF,OAAOG,iBAAiB;IACnC,aAAaH,OAAOI,mBAAmB;IACvC,iBAAiBJ,OAAOK,sBAAsB;AAChD;AAEA,MAAMC,sBAAsB;IAC1BC,YAAYP,OAAOQ,mBAAmB;IACtCC,UAAUT,OAAOU,iBAAiB;AACpC;AAEA,MAAMC,kBAAkB;IACtBC,OAAOZ,OAAOa,UAAU;IACxBC,KAAKd,OAAOe,QAAQ;AACtB;AAEA;;CAEC,GACD,OAAO,MAAMC,YAAY,CAAC,EACxBC,UAAU,KAAK,EACfC,aAAa,SAAS,EACtBC,YAAY,YAAY,EACxBC,QAAQ,QAAQ,EAChBC,IAAI,EACJ,GAAGC,WACY;IACf,MAAM,CAACC,sBAAsBC,iBAAiB,GAAG1B,mBAC/CG,gCACAoB;IAEF,qBACE,KAACtB;QACE,GAAGuB,SAAS;QACbG,eAAe5B,WACboB,WAAWjB,OAAO0B,MAAM,EACxBxB,oBAAoB,CAACgB,WAAW,EAChCZ,mBAAmB,CAACa,UAAU,EAC9BE,SAASM,aAAa3B,OAAO4B,KAAK,EAClCR,UAAU,YAAYT,eAAe,CAACS,MAAM,EAC5CG;QAEFM,WAAWL;kBAEX,cAAA,KAACM;YAAGC,WAAW/B,OAAOgC,EAAE;;;AAG9B,EAAE"}
+{"version":3,"sources":["../../../../src/components/Separator/Separator.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { resolveSpacingSize, type SpacingSizeProp } from '../../lib/spacings/sizes';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Separator.module.css';\n\nexport const CUSTOM_CSS_TOKEN_FOR_USER_SIZE = '--vkui_internal--spacing_size';\n\nexport interface SeparatorProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Стиль отображения разделителя.\n   */\n  appearance?: 'primary' | 'secondary' | 'primary-alpha';\n  /**\n   * Добавляет стандартные отступы у разделителя.\n   */\n  padding?: boolean;\n  /**\n   * Направление отображения разделителя.\n   */\n  direction?: 'horizontal' | 'vertical';\n  /**\n   * Размер контейнера, в который вложен разделитель.\n   *\n   * Принимает значения дизайн-системы, числовые значения и css-переменные.\n   */\n  size?: SpacingSizeProp;\n  /**\n   * Выравнивание разделителя в контейнере.\n   */\n  align?: 'start' | 'center' | 'end';\n}\n\nconst appearanceClassNames = {\n  'primary': styles.appearancePrimary,\n  'secondary': styles.appearanceSecondary,\n  'primary-alpha': styles.appearancePrimaryAlpha,\n};\n\nconst directionClassNames = {\n  horizontal: styles.directionHorizontal,\n  vertical: styles.directionVertical,\n};\n\nconst alignClassNames = {\n  start: styles.alignStart,\n  end: styles.alignEnd,\n};\n\n/**\n * @see https://vkui.io/components/separator\n */\nexport const Separator = ({\n  padding = false,\n  appearance = 'primary',\n  direction = 'horizontal',\n  align = 'center',\n  size,\n  ...restProps\n}: SeparatorProps): React.ReactNode => {\n  const [spacingSizeClassName, spacingSizeStyle] = resolveSpacingSize(\n    CUSTOM_CSS_TOKEN_FOR_USER_SIZE,\n    size,\n  );\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        padding && styles.padded,\n        appearanceClassNames[appearance],\n        directionClassNames[direction],\n        size !== undefined && styles.sized,\n        align !== 'center' && alignClassNames[align],\n        spacingSizeClassName,\n      )}\n      baseStyle={spacingSizeStyle}\n    >\n      <hr className={styles.in} />\n    </RootComponent>\n  );\n};\n"],"names":["classNames","resolveSpacingSize","RootComponent","styles","CUSTOM_CSS_TOKEN_FOR_USER_SIZE","appearanceClassNames","appearancePrimary","appearanceSecondary","appearancePrimaryAlpha","directionClassNames","horizontal","directionHorizontal","vertical","directionVertical","alignClassNames","start","alignStart","end","alignEnd","Separator","padding","appearance","direction","align","size","restProps","spacingSizeClassName","spacingSizeStyle","baseClassName","padded","undefined","sized","baseStyle","hr","className","in"],"mappings":";AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,kBAAkB,QAA8B,8BAA2B;AAEpF,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,OAAOC,YAAY,yBAAyB;AAE5C,OAAO,MAAMC,iCAAiC,gCAAgC;AA2B9E,MAAMC,uBAAuB;IAC3B,WAAWF,OAAOG,iBAAiB;IACnC,aAAaH,OAAOI,mBAAmB;IACvC,iBAAiBJ,OAAOK,sBAAsB;AAChD;AAEA,MAAMC,sBAAsB;IAC1BC,YAAYP,OAAOQ,mBAAmB;IACtCC,UAAUT,OAAOU,iBAAiB;AACpC;AAEA,MAAMC,kBAAkB;IACtBC,OAAOZ,OAAOa,UAAU;IACxBC,KAAKd,OAAOe,QAAQ;AACtB;AAEA;;CAEC,GACD,OAAO,MAAMC,YAAY,CAAC,EACxBC,UAAU,KAAK,EACfC,aAAa,SAAS,EACtBC,YAAY,YAAY,EACxBC,QAAQ,QAAQ,EAChBC,IAAI,EACJ,GAAGC,WACY;IACf,MAAM,CAACC,sBAAsBC,iBAAiB,GAAG1B,mBAC/CG,gCACAoB;IAEF,qBACE,KAACtB;QACE,GAAGuB,SAAS;QACbG,eAAe5B,WACboB,WAAWjB,OAAO0B,MAAM,EACxBxB,oBAAoB,CAACgB,WAAW,EAChCZ,mBAAmB,CAACa,UAAU,EAC9BE,SAASM,aAAa3B,OAAO4B,KAAK,EAClCR,UAAU,YAAYT,eAAe,CAACS,MAAM,EAC5CG;QAEFM,WAAWL;kBAEX,cAAA,KAACM;YAAGC,WAAW/B,OAAOgC,EAAE;;;AAG9B,EAAE"}

package/dist/cssm/components/SimpleCell/SimpleCell.js

@@ -15,7 +15,7 @@ const sizeYClassNames = {
     compact: styles.sizeYCompact
 };
 /**
- * @see https://vkcom.github.io/VKUI/#/SimpleCell
+ * @see https://vkui.io/components/simple-cell
  */ export const SimpleCell = ({ badgeBeforeTitle, badgeAfterTitle, badgeBeforeSubtitle, badgeAfterSubtitle, before, indicator, children, after, chevron, multiline, overTitle, subtitle, extraSubtitle, chevronSize = 'm', ...restProps })=>{
     const platform = usePlatform();
     const hasChevron = chevron === 'always' || chevron === 'auto' && platform === 'ios';