@vkontakte/vkui 6.0.2 → 6.0.3

package/dist/cjs/components/Pagination/Pagination.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,YAAY,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAS3E,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,yBAAyB,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC;IAC/F;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wBAAwB,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IACrD;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,CAAC,SAAS,EAAE,OAAO,GAAG,MAAM,CAAC;IAC1C,QAAQ,CAAC,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;CAC/B;AAED;;GAEG;AACH,eAAO,MAAM,UAAU,2LAapB,eAAe,sBAkGjB,CAAC"}
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,YAAY,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAS3E,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,yBAAyB,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC;IAC/F;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wBAAwB,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IACrD;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,MAAM,CAAC;IAC9C,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC;AAED;;GAEG;AACH,eAAO,MAAM,UAAU,2LAapB,eAAe,sBAkGjB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24ChevronCompactLeft, Icon24ChevronCompactRight } from '@vkontakte/icons';\nimport { PaginationPageType, usePagination } from '../../hooks/usePagination';\nimport type { HasComponent, HTMLAttributesWithRootRef } from '../../types';\nimport { Button } from '../Button/Button';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport { PaginationPageButton } from './PaginationPage/PaginationPageButton';\nimport { PaginationPageEllipsis } from './PaginationPage/PaginationPageEllipsis';\nimport { getPageLabelDefault } from './utils';\nimport styles from './Pagination.module.css';\n\nexport interface PaginationProps extends Omit<HTMLAttributesWithRootRef<HTMLElement>, 'onChange'> {\n  /**\n   * Текущая страница.\n   */\n  currentPage?: number;\n  /**\n   * Кол-во всегда видимых страниц по краям текущей страницы.\n   */\n  siblingCount?: number;\n  /**\n   * Кол-во всегда видимых страниц в начале и в конце.\n   */\n  boundaryCount?: number;\n  /**\n   * Общее кол-во страниц.\n   */\n  totalPages?: number;\n  /**\n   * Блокировка всех кнопок.\n   */\n  disabled?: boolean;\n  /**\n   * Переопределение текста для обозначения блока навигации.\n   * По умолчанию используется текст на \"ru_RU\".\n   */\n  navigationLabel?: string;\n  navigationLabelComponent?: HasComponent['Component'];\n  /**\n   * Переопределение текста для кнопки навигации назад.\n   * По умолчанию используется текст на \"ru_RU\".\n   */\n  prevButtonLabel?: string;\n  /**\n   * Переопределение текста для кнопки навигации вперёд.\n   * По умолчанию используется текст на \"ru_RU\".\n   */\n  nextButtonLabel?: string;\n  /**\n   * Функция для переопределения и/или локализации текста кнопки страницы.\n   * По умолчанию используется текст на \"ru_RU\".\n   */\n  getPageLabel?(isCurrent: boolean): string;\n  onChange?(page: number): void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Pagination\n */\nexport const Pagination = ({\n  currentPage = 1,\n  siblingCount = 1,\n  boundaryCount = 1,\n  totalPages = 1,\n  disabled,\n  getPageLabel = getPageLabelDefault,\n  navigationLabel = 'Навигация по страницам',\n  navigationLabelComponent = 'h2',\n  prevButtonLabel = 'Перейти на предыдущую страницу',\n  nextButtonLabel = 'Перейти на следующую страницу',\n  onChange,\n  ...resetProps\n}: PaginationProps) => {\n  const pages = usePagination({\n    currentPage,\n    totalPages,\n    siblingCount,\n    boundaryCount,\n  });\n  const isFirstPage = currentPage === 1;\n  const isLastPage = currentPage === totalPages;\n\n  const handlePrevClick = React.useCallback(() => {\n    if (onChange && !isFirstPage) {\n      onChange(currentPage - 1);\n    }\n  }, [currentPage, isFirstPage, onChange]);\n\n  const handleClick = React.useCallback(\n    (event: React.MouseEvent<HTMLElement>) => {\n      const page: string = event.currentTarget.dataset.page || '1';\n      onChange?.(Number(page));\n    },\n    [onChange],\n  );\n\n  const handleNextClick = React.useCallback(() => {\n    if (onChange && !isLastPage) {\n      onChange(currentPage + 1);\n    }\n  }, [currentPage, isLastPage, onChange]);\n\n  const renderPages = React.useCallback(\n    (page: PaginationPageType) => {\n      switch (page) {\n        case 'start-ellipsis':\n        case 'end-ellipsis':\n          return (\n            <li key={page}>\n              <PaginationPageEllipsis disabled={disabled} />\n            </li>\n          );\n        default: {\n          const isCurrent = page === currentPage;\n          return (\n            <li key={page}>\n              <PaginationPageButton\n                getPageLabel={getPageLabel}\n                isCurrent={isCurrent}\n                onClick={handleClick}\n                disabled={disabled}\n              >\n                {page}\n              </PaginationPageButton>\n            </li>\n          );\n        }\n      }\n    },\n    [currentPage, disabled, getPageLabel, handleClick],\n  );\n\n  return (\n    <RootComponent Component=\"nav\" role=\"navigation\" {...resetProps}>\n      <VisuallyHidden Component={navigationLabelComponent}>{navigationLabel}</VisuallyHidden>\n      <ul className={styles['Pagination__list']}>\n        <li className={styles['Pagination__prevButtonContainer']}>\n          <Button\n            size=\"l\"\n            before={\n              <>\n                <VisuallyHidden>{prevButtonLabel}</VisuallyHidden>{' '}\n                <Icon24ChevronCompactLeft width={24} />\n              </>\n            }\n            appearance=\"accent\"\n            mode=\"tertiary\"\n            disabled={isFirstPage || disabled}\n            onClick={handlePrevClick}\n          />\n        </li>\n        {pages.map(renderPages)}\n        <li className={styles['Pagination__nextButtonContainer']}>\n          <Button\n            size=\"l\"\n            after={\n              <>\n                <VisuallyHidden>{nextButtonLabel}</VisuallyHidden>\n                <Icon24ChevronCompactRight width={24} />\n              </>\n            }\n            appearance=\"accent\"\n            mode=\"tertiary\"\n            disabled={isLastPage || disabled}\n            onClick={handleNextClick}\n          />\n        </li>\n      </ul>\n    </RootComponent>\n  );\n};\n"],"names":["Pagination","currentPage","siblingCount","boundaryCount","totalPages","disabled","getPageLabel","getPageLabelDefault","navigationLabel","navigationLabelComponent","prevButtonLabel","nextButtonLabel","onChange","resetProps","pages","usePagination","isFirstPage","isLastPage","handlePrevClick","React","useCallback","handleClick","event","page","currentTarget","dataset","Number","handleNextClick","renderPages","li","key","PaginationPageEllipsis","isCurrent","PaginationPageButton","onClick","RootComponent","Component","role","VisuallyHidden","ul","className","Button","size","before","Icon24ChevronCompactLeft","width","appearance","mode","map","after","Icon24ChevronCompactRight"],"mappings":";;;;+BA4DaA;;;eAAAA;;;;;;iEA5DU;uBAC6C;+BAClB;wBAE3B;+BACO;gCACC;sCACM;wCACE;uBACH;AAmD7B,MAAMA,aAAa;QAAC,EACzBC,cAAc,CAAC,EACfC,eAAe,CAAC,EAChBC,gBAAgB,CAAC,EACjBC,aAAa,CAAC,EACdC,QAAQ,EACRC,eAAeC,0BAAmB,EAClCC,kBAAkB,wBAAwB,EAC1CC,2BAA2B,IAAI,EAC/BC,kBAAkB,gCAAgC,EAClDC,kBAAkB,+BAA+B,EACjDC,QAAQ,EAEQ,WADbC;QAXHZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,QAAQC,IAAAA,4BAAa,EAAC;QAC1Bd;QACAG;QACAF;QACAC;IACF;IACA,MAAMa,cAAcf,gBAAgB;IACpC,MAAMgB,aAAahB,gBAAgBG;IAEnC,MAAMc,kBAAkBC,OAAMC,WAAW,CAAC;QACxC,IAAIR,YAAY,CAACI,aAAa;YAC5BJ,SAASX,cAAc;QACzB;IACF,GAAG;QAACA;QAAae;QAAaJ;KAAS;IAEvC,MAAMS,cAAcF,OAAMC,WAAW,CACnC,CAACE;QACC,MAAMC,OAAeD,MAAME,aAAa,CAACC,OAAO,CAACF,IAAI,IAAI;QACzDX,qBAAAA,+BAAAA,SAAWc,OAAOH;IACpB,GACA;QAACX;KAAS;IAGZ,MAAMe,kBAAkBR,OAAMC,WAAW,CAAC;QACxC,IAAIR,YAAY,CAACK,YAAY;YAC3BL,SAASX,cAAc;QACzB;IACF,GAAG;QAACA;QAAagB;QAAYL;KAAS;IAEtC,MAAMgB,cAAcT,OAAMC,WAAW,CACnC,CAACG;QACC,OAAQA;YACN,KAAK;YACL,KAAK;gBACH,qBACE,qBAACM;oBAAGC,KAAKP;iCACP,qBAACQ,8CAAsB;oBAAC1B,UAAUA;;YAGxC;gBAAS;oBACP,MAAM2B,YAAYT,SAAStB;oBAC3B,qBACE,qBAAC4B;wBAAGC,KAAKP;qCACP,qBAACU,0CAAoB;wBACnB3B,cAAcA;wBACd0B,WAAWA;wBACXE,SAASb;wBACThB,UAAUA;uBAETkB;gBAIT;QACF;IACF,GACA;QAACtB;QAAaI;QAAUC;QAAce;KAAY;IAGpD,qBACE,qBAACc,4BAAa;QAACC,WAAU;QAAMC,MAAK;OAAiBxB,2BACnD,qBAACyB,8BAAc;QAACF,WAAW3B;OAA2BD,gCACtD,qBAAC+B;QAAGC,SAAS;qBACX,qBAACX;QAAGW,SAAS;qBACX,qBAACC,cAAM;QACLC,MAAK;QACLC,sBACE,0DACE,qBAACL,8BAAc,QAAE5B,kBAAkC,mBACnD,qBAACkC,+BAAwB;YAACC,OAAO;;QAGrCC,YAAW;QACXC,MAAK;QACL1C,UAAUW,eAAeX;QACzB6B,SAAShB;SAGZJ,MAAMkC,GAAG,CAACpB,4BACX,qBAACC;QAAGW,SAAS;qBACX,qBAACC,cAAM;QACLC,MAAK;QACLO,qBACE,0DACE,qBAACX,8BAAc,QAAE3B,gCACjB,qBAACuC,gCAAyB;YAACL,OAAO;;QAGtCC,YAAW;QACXC,MAAK;QACL1C,UAAUY,cAAcZ;QACxB6B,SAASP;;AAMrB"}
+{"version":3,"sources":["../../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24ChevronCompactLeft, Icon24ChevronCompactRight } from '@vkontakte/icons';\nimport { PaginationPageType, usePagination } from '../../hooks/usePagination';\nimport type { HasComponent, HTMLAttributesWithRootRef } from '../../types';\nimport { Button } from '../Button/Button';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport { PaginationPageButton } from './PaginationPage/PaginationPageButton';\nimport { PaginationPageEllipsis } from './PaginationPage/PaginationPageEllipsis';\nimport { getPageLabelDefault } from './utils';\nimport styles from './Pagination.module.css';\n\nexport interface PaginationProps extends Omit<HTMLAttributesWithRootRef<HTMLElement>, 'onChange'> {\n  /**\n   * Текущая страница.\n   */\n  currentPage?: number;\n  /**\n   * Кол-во всегда видимых страниц по краям текущей страницы.\n   */\n  siblingCount?: number;\n  /**\n   * Кол-во всегда видимых страниц в начале и в конце.\n   */\n  boundaryCount?: number;\n  /**\n   * Общее кол-во страниц.\n   */\n  totalPages?: number;\n  /**\n   * Блокировка всех кнопок.\n   */\n  disabled?: boolean;\n  /**\n   * Переопределение текста для обозначения блока навигации.\n   * По умолчанию используется текст на \"ru_RU\".\n   */\n  navigationLabel?: string;\n  navigationLabelComponent?: HasComponent['Component'];\n  /**\n   * Переопределение текста для кнопки навигации назад.\n   * По умолчанию используется текст на \"ru_RU\".\n   */\n  prevButtonLabel?: string;\n  /**\n   * Переопределение текста для кнопки навигации вперёд.\n   * По умолчанию используется текст на \"ru_RU\".\n   */\n  nextButtonLabel?: string;\n  /**\n   * Функция для переопределения и/или локализации текста кнопки страницы.\n   * По умолчанию используется текст на \"ru_RU\".\n   */\n  getPageLabel?: (isCurrent: boolean) => string;\n  onChange?: (page: number) => void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Pagination\n */\nexport const Pagination = ({\n  currentPage = 1,\n  siblingCount = 1,\n  boundaryCount = 1,\n  totalPages = 1,\n  disabled,\n  getPageLabel = getPageLabelDefault,\n  navigationLabel = 'Навигация по страницам',\n  navigationLabelComponent = 'h2',\n  prevButtonLabel = 'Перейти на предыдущую страницу',\n  nextButtonLabel = 'Перейти на следующую страницу',\n  onChange,\n  ...resetProps\n}: PaginationProps) => {\n  const pages = usePagination({\n    currentPage,\n    totalPages,\n    siblingCount,\n    boundaryCount,\n  });\n  const isFirstPage = currentPage === 1;\n  const isLastPage = currentPage === totalPages;\n\n  const handlePrevClick = React.useCallback(() => {\n    if (onChange && !isFirstPage) {\n      onChange(currentPage - 1);\n    }\n  }, [currentPage, isFirstPage, onChange]);\n\n  const handleClick = React.useCallback(\n    (event: React.MouseEvent<HTMLElement>) => {\n      const page: string = event.currentTarget.dataset.page || '1';\n      onChange?.(Number(page));\n    },\n    [onChange],\n  );\n\n  const handleNextClick = React.useCallback(() => {\n    if (onChange && !isLastPage) {\n      onChange(currentPage + 1);\n    }\n  }, [currentPage, isLastPage, onChange]);\n\n  const renderPages = React.useCallback(\n    (page: PaginationPageType) => {\n      switch (page) {\n        case 'start-ellipsis':\n        case 'end-ellipsis':\n          return (\n            <li key={page}>\n              <PaginationPageEllipsis disabled={disabled} />\n            </li>\n          );\n        default: {\n          const isCurrent = page === currentPage;\n          return (\n            <li key={page}>\n              <PaginationPageButton\n                getPageLabel={getPageLabel}\n                isCurrent={isCurrent}\n                onClick={handleClick}\n                disabled={disabled}\n              >\n                {page}\n              </PaginationPageButton>\n            </li>\n          );\n        }\n      }\n    },\n    [currentPage, disabled, getPageLabel, handleClick],\n  );\n\n  return (\n    <RootComponent Component=\"nav\" role=\"navigation\" {...resetProps}>\n      <VisuallyHidden Component={navigationLabelComponent}>{navigationLabel}</VisuallyHidden>\n      <ul className={styles['Pagination__list']}>\n        <li className={styles['Pagination__prevButtonContainer']}>\n          <Button\n            size=\"l\"\n            before={\n              <>\n                <VisuallyHidden>{prevButtonLabel}</VisuallyHidden>{' '}\n                <Icon24ChevronCompactLeft width={24} />\n              </>\n            }\n            appearance=\"accent\"\n            mode=\"tertiary\"\n            disabled={isFirstPage || disabled}\n            onClick={handlePrevClick}\n          />\n        </li>\n        {pages.map(renderPages)}\n        <li className={styles['Pagination__nextButtonContainer']}>\n          <Button\n            size=\"l\"\n            after={\n              <>\n                <VisuallyHidden>{nextButtonLabel}</VisuallyHidden>\n                <Icon24ChevronCompactRight width={24} />\n              </>\n            }\n            appearance=\"accent\"\n            mode=\"tertiary\"\n            disabled={isLastPage || disabled}\n            onClick={handleNextClick}\n          />\n        </li>\n      </ul>\n    </RootComponent>\n  );\n};\n"],"names":["Pagination","currentPage","siblingCount","boundaryCount","totalPages","disabled","getPageLabel","getPageLabelDefault","navigationLabel","navigationLabelComponent","prevButtonLabel","nextButtonLabel","onChange","resetProps","pages","usePagination","isFirstPage","isLastPage","handlePrevClick","React","useCallback","handleClick","event","page","currentTarget","dataset","Number","handleNextClick","renderPages","li","key","PaginationPageEllipsis","isCurrent","PaginationPageButton","onClick","RootComponent","Component","role","VisuallyHidden","ul","className","Button","size","before","Icon24ChevronCompactLeft","width","appearance","mode","map","after","Icon24ChevronCompactRight"],"mappings":";;;;+BA4DaA;;;eAAAA;;;;;;iEA5DU;uBAC6C;+BAClB;wBAE3B;+BACO;gCACC;sCACM;wCACE;uBACH;AAmD7B,MAAMA,aAAa;QAAC,EACzBC,cAAc,CAAC,EACfC,eAAe,CAAC,EAChBC,gBAAgB,CAAC,EACjBC,aAAa,CAAC,EACdC,QAAQ,EACRC,eAAeC,0BAAmB,EAClCC,kBAAkB,wBAAwB,EAC1CC,2BAA2B,IAAI,EAC/BC,kBAAkB,gCAAgC,EAClDC,kBAAkB,+BAA+B,EACjDC,QAAQ,EAEQ,WADbC;QAXHZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,QAAQC,IAAAA,4BAAa,EAAC;QAC1Bd;QACAG;QACAF;QACAC;IACF;IACA,MAAMa,cAAcf,gBAAgB;IACpC,MAAMgB,aAAahB,gBAAgBG;IAEnC,MAAMc,kBAAkBC,OAAMC,WAAW,CAAC;QACxC,IAAIR,YAAY,CAACI,aAAa;YAC5BJ,SAASX,cAAc;QACzB;IACF,GAAG;QAACA;QAAae;QAAaJ;KAAS;IAEvC,MAAMS,cAAcF,OAAMC,WAAW,CACnC,CAACE;QACC,MAAMC,OAAeD,MAAME,aAAa,CAACC,OAAO,CAACF,IAAI,IAAI;QACzDX,qBAAAA,+BAAAA,SAAWc,OAAOH;IACpB,GACA;QAACX;KAAS;IAGZ,MAAMe,kBAAkBR,OAAMC,WAAW,CAAC;QACxC,IAAIR,YAAY,CAACK,YAAY;YAC3BL,SAASX,cAAc;QACzB;IACF,GAAG;QAACA;QAAagB;QAAYL;KAAS;IAEtC,MAAMgB,cAAcT,OAAMC,WAAW,CACnC,CAACG;QACC,OAAQA;YACN,KAAK;YACL,KAAK;gBACH,qBACE,qBAACM;oBAAGC,KAAKP;iCACP,qBAACQ,8CAAsB;oBAAC1B,UAAUA;;YAGxC;gBAAS;oBACP,MAAM2B,YAAYT,SAAStB;oBAC3B,qBACE,qBAAC4B;wBAAGC,KAAKP;qCACP,qBAACU,0CAAoB;wBACnB3B,cAAcA;wBACd0B,WAAWA;wBACXE,SAASb;wBACThB,UAAUA;uBAETkB;gBAIT;QACF;IACF,GACA;QAACtB;QAAaI;QAAUC;QAAce;KAAY;IAGpD,qBACE,qBAACc,4BAAa;QAACC,WAAU;QAAMC,MAAK;OAAiBxB,2BACnD,qBAACyB,8BAAc;QAACF,WAAW3B;OAA2BD,gCACtD,qBAAC+B;QAAGC,SAAS;qBACX,qBAACX;QAAGW,SAAS;qBACX,qBAACC,cAAM;QACLC,MAAK;QACLC,sBACE,0DACE,qBAACL,8BAAc,QAAE5B,kBAAkC,mBACnD,qBAACkC,+BAAwB;YAACC,OAAO;;QAGrCC,YAAW;QACXC,MAAK;QACL1C,UAAUW,eAAeX;QACzB6B,SAAShB;SAGZJ,MAAMkC,GAAG,CAACpB,4BACX,qBAACC;QAAGW,SAAS;qBACX,qBAACC,cAAM;QACLC,MAAK;QACLO,qBACE,0DACE,qBAACX,8BAAc,QAAE3B,gCACjB,qBAACuC,gCAAyB;YAACL,OAAO;;QAGtCC,YAAW;QACXC,MAAK;QACL1C,UAAUY,cAAcZ;QACxB6B,SAASP;;AAMrB"}

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

@@ -3,11 +3,11 @@ import { NavIdProps } from '../../lib/getNavId';
 import { HTMLAttributesWithRootRef } from '../../types';
 export interface RootProps extends HTMLAttributesWithRootRef<HTMLDivElement>, NavIdProps {
     activeView: string;
-    onTransition?(params: {
+    onTransition?: (params: {
         isBack: boolean;
         from: string;
         to: string;
-    }): void;
+    }) => void;
     children: React.ReactElement | Iterable<React.ReactElement>;
 }
 export interface RootState {

package/dist/cjs/components/Root/Root.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Root.d.ts","sourceRoot":"","sources":["../../../../src/components/Root/Root.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAY,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAG1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AASxD,MAAM,WAAW,SAAU,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU;IACtF,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,CAAC,MAAM,EAAE;QAAE,MAAM,EAAE,OAAO,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAC3E,QAAQ,EAAE,KAAK,CAAC,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;CAC7D;AAED,MAAM,WAAW,SAAS;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAID;;GAEG;AACH,eAAO,MAAM,IAAI,2EAMd,SAAS,sBA2HX,CAAC"}
+{"version":3,"file":"Root.d.ts","sourceRoot":"","sources":["../../../../src/components/Root/Root.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAY,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAG1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AASxD,MAAM,WAAW,SAAU,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU;IACtF,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,MAAM,EAAE,OAAO,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC/E,QAAQ,EAAE,KAAK,CAAC,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;CAC7D;AAED,MAAM,WAAW,SAAS;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAID;;GAEG;AACH,eAAO,MAAM,IAAI,2EAMd,SAAS,sBA2HX,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { 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  activeView: string;\n  onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n  children: React.ReactElement | Iterable<React.ReactElement>;\n}\n\nexport interface RootState {\n  activeView: string;\n  transition: boolean;\n  isBack?: boolean;\n  prevView?: string;\n}\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) => {\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 React.ReactElement[];\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  const fallbackTransition = useTimeout(finishTransition, platform === 'ios' ? 600 : 300);\n  React.useEffect(() => {\n    if (!transition) {\n      fallbackTransition.clear();\n      return;\n    }\n    fallbackTransition.set();\n  }, [fallbackTransition, transition]);\n\n  const onAnimationEnd = (e: React.AnimationEvent) => {\n    if (\n      [\n        styles['root-android-animation-hide-back'],\n        styles['root-android-animation-show-forward'],\n        styles['root-ios-animation-hide-back'],\n        styles['root-ios-animation-show-forward'],\n      ].includes(e.animationName)\n    ) {\n      finishTransition();\n    }\n  };\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['Root'],\n        platform === 'ios' && styles['Root--ios'],\n        transition && styles['Root--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) => viewId && (viewNodes[viewId] = e)}\n            onAnimationEnd={isTransitionTarget ? onAnimationEnd : undefined}\n            className={classNames(\n              styles['Root__view'],\n              transition && viewId === prevView && isBack && styles['Root__view--hide-back'],\n              transition && viewId === prevView && !isBack && styles['Root__view--hide-forward'],\n              transition && viewId === activeView && isBack && styles['Root__view--show-back'],\n              transition && viewId === activeView && !isBack && styles['Root__view--show-forward'],\n            )}\n          >\n            <NavTransitionDirectionProvider isBack={isBack}>\n              <NavTransitionProvider entering={transition && viewId === activeView}>\n                <div\n                  className={styles['Root__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":["Root","warn","warnOnce","children","activeView","_activeView","onTransition","nav","restProps","scroll","React","useContext","ScrollContext","platform","usePlatform","document","useDOM","scrolls","useRef","current","viewNodes","transitionMotionEnabled","useConfigProvider","animate","SplitColContext","disableAnimation","views","Children","toArray","prevView","transition","isBack","_setState","useState","transitionTo","panel","viewIds","map","view","getNavId","props","indexOf","getScroll","y","finishTransition","useCallback","useIsomorphicLayoutEffect","activeElement","blur","scrollTo","Boolean","from","to","fallbackTransition","useTimeout","useEffect","clear","set","onAnimationEnd","e","includes","animationName","RootComponent","baseClassName","classNames","viewId","isTransitionTarget","compensateScroll","div","key","ref","undefined","className","NavTransitionDirectionProvider","NavTransitionProvider","entering","style","marginTop"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { 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  activeView: string;\n  onTransition?: (params: { isBack: boolean; from: string; to: string }) => void;\n  children: React.ReactElement | Iterable<React.ReactElement>;\n}\n\nexport interface RootState {\n  activeView: string;\n  transition: boolean;\n  isBack?: boolean;\n  prevView?: string;\n}\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) => {\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 React.ReactElement[];\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  const fallbackTransition = useTimeout(finishTransition, platform === 'ios' ? 600 : 300);\n  React.useEffect(() => {\n    if (!transition) {\n      fallbackTransition.clear();\n      return;\n    }\n    fallbackTransition.set();\n  }, [fallbackTransition, transition]);\n\n  const onAnimationEnd = (e: React.AnimationEvent) => {\n    if (\n      [\n        styles['root-android-animation-hide-back'],\n        styles['root-android-animation-show-forward'],\n        styles['root-ios-animation-hide-back'],\n        styles['root-ios-animation-show-forward'],\n      ].includes(e.animationName)\n    ) {\n      finishTransition();\n    }\n  };\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['Root'],\n        platform === 'ios' && styles['Root--ios'],\n        transition && styles['Root--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) => viewId && (viewNodes[viewId] = e)}\n            onAnimationEnd={isTransitionTarget ? onAnimationEnd : undefined}\n            className={classNames(\n              styles['Root__view'],\n              transition && viewId === prevView && isBack && styles['Root__view--hide-back'],\n              transition && viewId === prevView && !isBack && styles['Root__view--hide-forward'],\n              transition && viewId === activeView && isBack && styles['Root__view--show-back'],\n              transition && viewId === activeView && !isBack && styles['Root__view--show-forward'],\n            )}\n          >\n            <NavTransitionDirectionProvider isBack={isBack}>\n              <NavTransitionProvider entering={transition && viewId === activeView}>\n                <div\n                  className={styles['Root__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":["Root","warn","warnOnce","children","activeView","_activeView","onTransition","nav","restProps","scroll","React","useContext","ScrollContext","platform","usePlatform","document","useDOM","scrolls","useRef","current","viewNodes","transitionMotionEnabled","useConfigProvider","animate","SplitColContext","disableAnimation","views","Children","toArray","prevView","transition","isBack","_setState","useState","transitionTo","panel","viewIds","map","view","getNavId","props","indexOf","getScroll","y","finishTransition","useCallback","useIsomorphicLayoutEffect","activeElement","blur","scrollTo","Boolean","from","to","fallbackTransition","useTimeout","useEffect","clear","set","onAnimationEnd","e","includes","animationName","RootComponent","baseClassName","classNames","viewId","isTransitionTarget","compensateScroll","div","key","ref","undefined","className","NavTransitionDirectionProvider","NavTransitionProvider","entering","style","marginTop"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlOption.d.ts","sourceRoot":"","sources":["../../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAKpD,MAAM,WAAW,2BACf,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EACjD,UAAU,CAAC,gBAAgB,CAAC,EAC5B,MAAM,CAAC,gBAAgB,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED;;GAEG;AACH,eAAO,MAAM,sBAAsB,6EAQhC,2BAA2B,sBA+B7B,CAAC"}
+{"version":3,"file":"SegmentedControlOption.d.ts","sourceRoot":"","sources":["../../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAMpD,MAAM,WAAW,2BACf,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EACjD,UAAU,CAAC,gBAAgB,CAAC,EAC5B,MAAM,CAAC,gBAAgB,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED;;GAEG;AACH,eAAO,MAAM,sBAAsB,6EAQhC,2BAA2B,sBAkB7B,CAAC"}

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

@@ -14,9 +14,7 @@ const _object_spread_props = require("@swc/helpers/_/_object_spread_props");
 const _object_without_properties = require("@swc/helpers/_/_object_without_properties");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _vkjs = require("@vkontakte/vkjs");
-const _useFocusVisible = require("../../../hooks/useFocusVisible");
-const _useFocusVisibleClassName = require("../../../hooks/useFocusVisibleClassName");
-const _callMultiple = require("../../../lib/callMultiple");
+const _Clickable = require("../../Clickable/Clickable");
 const _Headline = require("../../Typography/Headline/Headline");
 const _VisuallyHidden = require("../../VisuallyHidden/VisuallyHidden");
 const SegmentedControlOption = (_param)=>{
@@ -28,20 +26,18 @@ const SegmentedControlOption = (_param)=>{
         "getRootRef",
         "before"
     ]);
-    const { focusVisible, onBlur, onFocus } = (0, _useFocusVisible.useFocusVisible)();
-    const focusVisibleClassNames = (0, _useFocusVisibleClassName.useFocusVisibleClassName)({
-        focusVisible
-    });
-    return /*#__PURE__*/ _react.createElement("label", {
-        className: (0, _vkjs.classNames)("vkuiSegmentedControlOption", restProps.checked && "vkuiSegmentedControlOption--checked", focusVisibleClassNames, className),
-        ref: getRootRef,
+    return /*#__PURE__*/ _react.createElement(_Clickable.Clickable, {
+        Component: "label",
+        baseClassName: "vkuiSegmentedControlOption",
+        hoverClassName: "vkuiSegmentedControlOption--hover",
+        activeClassName: "vkuiSegmentedControlOption--hover",
+        className: className,
+        getRootRef: getRootRef,
         style: style
     }, /*#__PURE__*/ _react.createElement(_VisuallyHidden.VisuallyHidden, _object_spread_props._(_object_spread._({}, restProps), {
         Component: "input",
         getRootRef: getRef,
-        type: "radio",
-        onBlur: (0, _callMultiple.callMultiple)(onBlur, restProps.onBlur),
-        onFocus: (0, _callMultiple.callMultiple)(onFocus, restProps.onFocus)
+        type: "radio"
     })), (0, _vkjs.hasReactNode)(before) && /*#__PURE__*/ _react.createElement("div", {
         className: "vkuiSegmentedControlOption__before"
     }, before), /*#__PURE__*/ _react.createElement(_Headline.Headline, {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useFocusVisible } from '../../../hooks/useFocusVisible';\nimport { useFocusVisibleClassName } from '../../../hooks/useFocusVisibleClassName';\nimport { callMultiple } from '../../../lib/callMultiple';\nimport { HasRef, HasRootRef } from '../../../types';\nimport { Headline } from '../../Typography/Headline/Headline';\nimport { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';\nimport styles from './SegmentedControlOption.module.css';\n\nexport interface SegmentedControlOptionProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLLabelElement>,\n    HasRef<HTMLInputElement> {\n  before?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SegmentedControl\n */\nexport const SegmentedControlOption = ({\n  getRef,\n  className,\n  style,\n  children,\n  getRootRef,\n  before,\n  ...restProps\n}: SegmentedControlOptionProps) => {\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n  const focusVisibleClassNames = useFocusVisibleClassName({ focusVisible });\n\n  return (\n    <label\n      className={classNames(\n        styles['SegmentedControlOption'],\n        restProps.checked && styles['SegmentedControlOption--checked'],\n        focusVisibleClassNames,\n        className,\n      )}\n      ref={getRootRef}\n      style={style}\n    >\n      <VisuallyHidden\n        {...restProps}\n        Component=\"input\"\n        getRootRef={getRef}\n        type=\"radio\"\n        onBlur={callMultiple(onBlur, restProps.onBlur)}\n        onFocus={callMultiple(onFocus, restProps.onFocus)}\n      />\n      {hasReactNode(before) && (\n        <div className={styles['SegmentedControlOption__before']}>{before}</div>\n      )}\n      <Headline level=\"2\" weight=\"2\">\n        {children}\n      </Headline>\n    </label>\n  );\n};\n"],"names":["SegmentedControlOption","getRef","className","style","children","getRootRef","before","restProps","focusVisible","onBlur","onFocus","useFocusVisible","focusVisibleClassNames","useFocusVisibleClassName","label","classNames","checked","ref","VisuallyHidden","Component","type","callMultiple","hasReactNode","div","Headline","level","weight"],"mappings":";;;;+BAoBaA;;;eAAAA;;;;;;;iEApBU;sBACkB;iCACT;0CACS;8BACZ;0BAEJ;gCACM;AAaxB,MAAMA,yBAAyB;QAAC,EACrCC,MAAM,EACNC,SAAS,EACTC,KAAK,EACLC,QAAQ,EACRC,UAAU,EACVC,MAAM,EAEsB,WADzBC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,EAAEE,YAAY,EAAEC,MAAM,EAAEC,OAAO,EAAE,GAAGC,IAAAA,gCAAe;IACzD,MAAMC,yBAAyBC,IAAAA,kDAAwB,EAAC;QAAEL;IAAa;IAEvE,qBACE,qBAACM;QACCZ,WAAWa,IAAAA,gBAAU,gCAEnBR,UAAUS,OAAO,2CACjBJ,wBACAV;QAEFe,KAAKZ;QACLF,OAAOA;qBAEP,qBAACe,8BAAc,8CACTX;QACJY,WAAU;QACVd,YAAYJ;QACZmB,MAAK;QACLX,QAAQY,IAAAA,0BAAY,EAACZ,QAAQF,UAAUE,MAAM;QAC7CC,SAASW,IAAAA,0BAAY,EAACX,SAASH,UAAUG,OAAO;SAEjDY,IAAAA,kBAAY,EAAChB,yBACZ,qBAACiB;QAAIrB,SAAS;OAA6CI,uBAE7D,qBAACkB,kBAAQ;QAACC,OAAM;QAAIC,QAAO;OACxBtB;AAIT"}
+{"version":3,"sources":["../../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"sourcesContent":["import * as React from 'react';\nimport { hasReactNode } from '@vkontakte/vkjs';\nimport { 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 React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLLabelElement>,\n    HasRef<HTMLInputElement> {\n  before?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SegmentedControl\n */\nexport const SegmentedControlOption = ({\n  getRef,\n  className,\n  style,\n  children,\n  getRootRef,\n  before,\n  ...restProps\n}: SegmentedControlOptionProps) => (\n  <Clickable\n    Component=\"label\"\n    baseClassName={styles['SegmentedControlOption']}\n    hoverClassName={styles['SegmentedControlOption--hover']}\n    activeClassName={styles['SegmentedControlOption--hover']}\n    className={className}\n    getRootRef={getRootRef}\n    style={style}\n  >\n    <VisuallyHidden {...restProps} Component=\"input\" getRootRef={getRef} type=\"radio\" />\n    {hasReactNode(before) && (\n      <div className={styles['SegmentedControlOption__before']}>{before}</div>\n    )}\n    <Headline level=\"2\" weight=\"2\">\n      {children}\n    </Headline>\n  </Clickable>\n);\n"],"names":["SegmentedControlOption","getRef","className","style","children","getRootRef","before","restProps","Clickable","Component","baseClassName","hoverClassName","activeClassName","VisuallyHidden","type","hasReactNode","div","Headline","level","weight"],"mappings":";;;;+BAkBaA;;;eAAAA;;;;;;;iEAlBU;sBACM;2BAEH;0BACD;gCACM;AAaxB,MAAMA,yBAAyB;QAAC,EACrCC,MAAM,EACNC,SAAS,EACTC,KAAK,EACLC,QAAQ,EACRC,UAAU,EACVC,MAAM,EAEsB,WADzBC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;yBAGA,qBAACE,oBAAS;QACRC,WAAU;QACVC,aAAa;QACbC,cAAc;QACdC,eAAe;QACfV,WAAWA;QACXG,YAAYA;QACZF,OAAOA;qBAEP,qBAACU,8BAAc,8CAAKN;QAAWE,WAAU;QAAQJ,YAAYJ;QAAQa,MAAK;SACzEC,IAAAA,kBAAY,EAACT,yBACZ,qBAACU;QAAId,SAAS;OAA6CI,uBAE7D,qBAACW,kBAAQ;QAACC,OAAM;QAAIC,QAAO;OACxBf"}

package/dist/cjs/components/SimpleCell/SimpleCell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SimpleCell.d.ts","sourceRoot":"","sources":["../../../../src/components/SimpleCell/SimpleCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC3C,OAAO,EAAY,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAY/D,MAAM,WAAW,kBAAmB,SAAQ,YAAY;IACtD;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC;;OAEG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC;;OAEG;IACH,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtC;;OAEG;IACH,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC/B;;OAEG;IACH,WAAW,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,eAAgB,SAAQ,kBAAkB,EAAE,aAAa;CAAG;AAE7E;;GAEG;AACH,eAAO,MAAM,UAAU,sNAiBpB,eAAe,sBA8EjB,CAAC"}
+{"version":3,"file":"SimpleCell.d.ts","sourceRoot":"","sources":["../../../../src/components/SimpleCell/SimpleCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC3C,OAAO,EAAY,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAY/D,MAAM,WAAW,kBAAmB,SAAQ,YAAY;IACtD;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC;;OAEG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC;;OAEG;IACH,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtC;;OAEG;IACH,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC/B;;OAEG;IACH,WAAW,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,eAAgB,SAAQ,kBAAkB,EAAE,aAAa;CAAG;AAE7E;;GAEG;AACH,eAAO,MAAM,UAAU,sNAiBpB,eAAe,sBAqFjB,CAAC"}

package/dist/cjs/components/SimpleCell/SimpleCell.js

@@ -50,7 +50,7 @@ const SimpleCell = (_param)=>{
     return /*#__PURE__*/ _react.createElement(_Tappable.Tappable, _object_spread_props._(_object_spread._({}, restProps), {
         className: (0, _vkjs.classNames)("vkuiSimpleCell", sizeY !== 'regular' && sizeYClassNames[sizeY], multiline && "vkuiSimpleCell--mult", className)
     }), /*#__PURE__*/ _react.createElement("div", {
-        className: "vkuiSimpleCell__before"
+        className: (0, _vkjs.classNames)("vkuiSimpleCell__before", platform === 'ios' && "vkuiSimpleCell__before--ios")
     }, before), /*#__PURE__*/ _react.createElement("div", {
         className: "vkuiSimpleCell__middle"
     }, subhead && /*#__PURE__*/ _react.createElement(_Subhead.Subhead, {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SimpleCell/SimpleCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasComponent } from '../../types';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Chevron } from './Chevron/Chevron';\nimport styles from './SimpleCell.module.css';\n\nconst sizeYClassNames = {\n  none: styles['SimpleCell--sizeY-none'],\n  ['compact']: styles['SimpleCell--sizeY-compact'],\n};\n\nexport interface SimpleCellOwnProps extends HasComponent {\n  /**\n   * Иконка 28 или `<Avatar size={28|32|40|48|72} />`\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится слева от текста `children`.\n   */\n  badgeBeforeTitle?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится справа от текста `children`.\n   */\n  badgeAfterTitle?: React.ReactNode;\n  /**\n   * Иконка 12. Добавится слева от текста `subtitle`.\n   */\n  badgeBeforeSubtitle?: React.ReactNode;\n  /**\n   * Иконка 12. Добавится справа от текста `subtitle`.\n   */\n  badgeAfterSubtitle?: React.ReactNode;\n  /**\n   * Контейнер для текста справа от `children`.\n   */\n  indicator?: React.ReactNode;\n  /**\n   * Дополнительная строка текста над `children`.\n   */\n  subhead?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  /**\n   * Иконка 24|28 или `<Switch />`. Располагается справа от `indicator`.\n   */\n  after?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия\n   */\n  disabled?: boolean;\n  /**\n   * В режиме `auto` в iOS добавляет chevron справа.\n   * Передавать `always`, если предполагается переход при клике по ячейке.\n   */\n  expandable?: 'auto' | 'always';\n  /**\n   * Размер chevron\n   */\n  chevronSize?: 's' | 'm';\n  /**\n   * Включает многострочный режим для отображения текста\n   */\n  multiline?: boolean;\n}\n\nexport interface SimpleCellProps extends SimpleCellOwnProps, TappableProps {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SimpleCell\n */\nexport const SimpleCell = ({\n  badgeBeforeTitle,\n  badgeAfterTitle,\n  badgeBeforeSubtitle,\n  badgeAfterSubtitle,\n  before,\n  indicator,\n  children,\n  after,\n  expandable,\n  multiline,\n  subhead,\n  subtitle,\n  extraSubtitle,\n  className,\n  chevronSize = 'm',\n  ...restProps\n}: SimpleCellProps) => {\n  const platform = usePlatform();\n\n  const hasChevron = expandable === 'always' || (expandable === 'auto' && platform === 'ios');\n\n  const hasAfter = hasReactNode(after) || hasChevron;\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Tappable\n      {...restProps}\n      className={classNames(\n        styles['SimpleCell'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        multiline && styles['SimpleCell--mult'],\n        className,\n      )}\n    >\n      <div className={styles['SimpleCell__before']}>{before}</div>\n      <div className={styles['SimpleCell__middle']}>\n        {subhead && (\n          <Subhead\n            Component=\"span\"\n            className={classNames(styles['SimpleCell__text'], styles['SimpleCell__subhead'])}\n          >\n            {subhead}\n          </Subhead>\n        )}\n        <div className={styles['SimpleCell__content']}>\n          {badgeBeforeTitle && (\n            <span className={styles['SimpleCell__badge']}>{badgeBeforeTitle}</span>\n          )}\n          <Headline Component=\"span\" className={styles['SimpleCell__children']} weight=\"3\">\n            {children}\n          </Headline>\n          {hasReactNode(badgeAfterTitle) && (\n            <span className={styles['SimpleCell__badge']}>{badgeAfterTitle}</span>\n          )}\n        </div>\n        {subtitle && (\n          <div className={styles['SimpleCell__content']}>\n            {badgeBeforeSubtitle && (\n              <span className={styles['SimpleCell__badge']}>{badgeBeforeSubtitle}</span>\n            )}\n            <Footnote\n              normalize={false}\n              className={classNames(styles['SimpleCell__text'], styles['SimpleCell__subtitle'])}\n            >\n              {subtitle}\n            </Footnote>\n            {badgeAfterSubtitle && (\n              <span className={styles['SimpleCell__badge']}>{badgeAfterSubtitle}</span>\n            )}\n          </div>\n        )}\n        {extraSubtitle && (\n          <Footnote\n            className={classNames(styles['SimpleCell__text'], styles['SimpleCell__extraSubtitle'])}\n          >\n            {extraSubtitle}\n          </Footnote>\n        )}\n      </div>\n      {hasReactNode(indicator) && (\n        <Headline Component=\"span\" weight=\"3\" className={styles['SimpleCell__indicator']}>\n          {indicator}\n        </Headline>\n      )}\n      {hasAfter && (\n        <div className={classNames(styles['SimpleCell__after'], 'vkuiInternalSimpleCell__after')}>\n          {after}\n          {hasChevron && (\n            <Chevron size={chevronSize} className={styles['SimpleCell__chevronIcon']} />\n          )}\n        </div>\n      )}\n    </Tappable>\n  );\n};\n"],"names":["SimpleCell","sizeYClassNames","none","badgeBeforeTitle","badgeAfterTitle","badgeBeforeSubtitle","badgeAfterSubtitle","before","indicator","children","after","expandable","multiline","subhead","subtitle","extraSubtitle","className","chevronSize","restProps","platform","usePlatform","hasChevron","hasAfter","hasReactNode","sizeY","useAdaptivity","Tappable","classNames","div","Subhead","Component","span","Headline","weight","Footnote","normalize","Chevron","size"],"mappings":";;;;+BAkFaA;;;eAAAA;;;;;;;iEAlFU;sBACkB;+BACX;6BACF;0BAEY;0BACf;0BACA;yBACD;yBACA;AAGxB,MAAMC,kBAAkB;IACtBC,IAAI;IACJ,CAAC,UAAU;AACb;AAmEO,MAAMF,aAAa;QAAC,EACzBG,gBAAgB,EAChBC,eAAe,EACfC,mBAAmB,EACnBC,kBAAkB,EAClBC,MAAM,EACNC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACLC,UAAU,EACVC,SAAS,EACTC,OAAO,EACPC,QAAQ,EACRC,aAAa,EACbC,SAAS,EACTC,cAAc,GAAG,EAED,WADbC;QAfHf;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,WAAWC,IAAAA,wBAAW;IAE5B,MAAMC,aAAaV,eAAe,YAAaA,eAAe,UAAUQ,aAAa;IAErF,MAAMG,WAAWC,IAAAA,kBAAY,EAACb,UAAUW;IACxC,MAAM,EAAEG,QAAQ,MAAM,EAAE,GAAGC,IAAAA,4BAAa;IAExC,qBACE,qBAACC,kBAAQ,8CACHR;QACJF,WAAWW,IAAAA,gBAAU,oBAEnBH,UAAU,aAAavB,eAAe,CAACuB,MAAM,EAC7CZ,qCACAI;sBAGF,qBAACY;QAAIZ,SAAS;OAAiCT,uBAC/C,qBAACqB;QAAIZ,SAAS;OACXH,yBACC,qBAACgB,gBAAO;QACNC,WAAU;QACVd,WAAWW,IAAAA,gBAAU;OAEpBd,wBAGL,qBAACe;QAAIZ,SAAS;OACXb,kCACC,qBAAC4B;QAAKf,SAAS;OAAgCb,iCAEjD,qBAAC6B,kBAAQ;QAACF,WAAU;QAAOd,SAAS;QAAkCiB,QAAO;OAC1ExB,WAEFc,IAAAA,kBAAY,EAACnB,kCACZ,qBAAC2B;QAAKf,SAAS;OAAgCZ,mBAGlDU,0BACC,qBAACc;QAAIZ,SAAS;OACXX,qCACC,qBAAC0B;QAAKf,SAAS;OAAgCX,oCAEjD,qBAAC6B,kBAAQ;QACPC,WAAW;QACXnB,WAAWW,IAAAA,gBAAU;OAEpBb,WAEFR,oCACC,qBAACyB;QAAKf,SAAS;OAAgCV,sBAIpDS,+BACC,qBAACmB,kBAAQ;QACPlB,WAAWW,IAAAA,gBAAU;OAEpBZ,iBAINQ,IAAAA,kBAAY,EAACf,4BACZ,qBAACwB,kBAAQ;QAACF,WAAU;QAAOG,QAAO;QAAIjB,SAAS;OAC5CR,YAGJc,0BACC,qBAACM;QAAIZ,WAAWW,IAAAA,gBAAU,2BAA8B;OACrDjB,OACAW,4BACC,qBAACe,gBAAO;QAACC,MAAMpB;QAAaD,SAAS;;AAMjD"}
+{"version":3,"sources":["../../../../src/components/SimpleCell/SimpleCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasComponent } from '../../types';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Chevron } from './Chevron/Chevron';\nimport styles from './SimpleCell.module.css';\n\nconst sizeYClassNames = {\n  none: styles['SimpleCell--sizeY-none'],\n  ['compact']: styles['SimpleCell--sizeY-compact'],\n};\n\nexport interface SimpleCellOwnProps extends HasComponent {\n  /**\n   * Иконка 28 или `<Avatar size={28|32|40|48|72} />`\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится слева от текста `children`.\n   */\n  badgeBeforeTitle?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится справа от текста `children`.\n   */\n  badgeAfterTitle?: React.ReactNode;\n  /**\n   * Иконка 12. Добавится слева от текста `subtitle`.\n   */\n  badgeBeforeSubtitle?: React.ReactNode;\n  /**\n   * Иконка 12. Добавится справа от текста `subtitle`.\n   */\n  badgeAfterSubtitle?: React.ReactNode;\n  /**\n   * Контейнер для текста справа от `children`.\n   */\n  indicator?: React.ReactNode;\n  /**\n   * Дополнительная строка текста над `children`.\n   */\n  subhead?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  /**\n   * Иконка 24|28 или `<Switch />`. Располагается справа от `indicator`.\n   */\n  after?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия\n   */\n  disabled?: boolean;\n  /**\n   * В режиме `auto` в iOS добавляет chevron справа.\n   * Передавать `always`, если предполагается переход при клике по ячейке.\n   */\n  expandable?: 'auto' | 'always';\n  /**\n   * Размер chevron\n   */\n  chevronSize?: 's' | 'm';\n  /**\n   * Включает многострочный режим для отображения текста\n   */\n  multiline?: boolean;\n}\n\nexport interface SimpleCellProps extends SimpleCellOwnProps, TappableProps {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SimpleCell\n */\nexport const SimpleCell = ({\n  badgeBeforeTitle,\n  badgeAfterTitle,\n  badgeBeforeSubtitle,\n  badgeAfterSubtitle,\n  before,\n  indicator,\n  children,\n  after,\n  expandable,\n  multiline,\n  subhead,\n  subtitle,\n  extraSubtitle,\n  className,\n  chevronSize = 'm',\n  ...restProps\n}: SimpleCellProps) => {\n  const platform = usePlatform();\n\n  const hasChevron = expandable === 'always' || (expandable === 'auto' && platform === 'ios');\n\n  const hasAfter = hasReactNode(after) || hasChevron;\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Tappable\n      {...restProps}\n      className={classNames(\n        styles['SimpleCell'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        multiline && styles['SimpleCell--mult'],\n        className,\n      )}\n    >\n      <div\n        className={classNames(\n          styles['SimpleCell__before'],\n          platform === 'ios' && styles['SimpleCell__before--ios'],\n        )}\n      >\n        {before}\n      </div>\n      <div className={styles['SimpleCell__middle']}>\n        {subhead && (\n          <Subhead\n            Component=\"span\"\n            className={classNames(styles['SimpleCell__text'], styles['SimpleCell__subhead'])}\n          >\n            {subhead}\n          </Subhead>\n        )}\n        <div className={styles['SimpleCell__content']}>\n          {badgeBeforeTitle && (\n            <span className={styles['SimpleCell__badge']}>{badgeBeforeTitle}</span>\n          )}\n          <Headline Component=\"span\" className={styles['SimpleCell__children']} weight=\"3\">\n            {children}\n          </Headline>\n          {hasReactNode(badgeAfterTitle) && (\n            <span className={styles['SimpleCell__badge']}>{badgeAfterTitle}</span>\n          )}\n        </div>\n        {subtitle && (\n          <div className={styles['SimpleCell__content']}>\n            {badgeBeforeSubtitle && (\n              <span className={styles['SimpleCell__badge']}>{badgeBeforeSubtitle}</span>\n            )}\n            <Footnote\n              normalize={false}\n              className={classNames(styles['SimpleCell__text'], styles['SimpleCell__subtitle'])}\n            >\n              {subtitle}\n            </Footnote>\n            {badgeAfterSubtitle && (\n              <span className={styles['SimpleCell__badge']}>{badgeAfterSubtitle}</span>\n            )}\n          </div>\n        )}\n        {extraSubtitle && (\n          <Footnote\n            className={classNames(styles['SimpleCell__text'], styles['SimpleCell__extraSubtitle'])}\n          >\n            {extraSubtitle}\n          </Footnote>\n        )}\n      </div>\n      {hasReactNode(indicator) && (\n        <Headline Component=\"span\" weight=\"3\" className={styles['SimpleCell__indicator']}>\n          {indicator}\n        </Headline>\n      )}\n      {hasAfter && (\n        <div className={classNames(styles['SimpleCell__after'], 'vkuiInternalSimpleCell__after')}>\n          {after}\n          {hasChevron && (\n            <Chevron size={chevronSize} className={styles['SimpleCell__chevronIcon']} />\n          )}\n        </div>\n      )}\n    </Tappable>\n  );\n};\n"],"names":["SimpleCell","sizeYClassNames","none","badgeBeforeTitle","badgeAfterTitle","badgeBeforeSubtitle","badgeAfterSubtitle","before","indicator","children","after","expandable","multiline","subhead","subtitle","extraSubtitle","className","chevronSize","restProps","platform","usePlatform","hasChevron","hasAfter","hasReactNode","sizeY","useAdaptivity","Tappable","classNames","div","Subhead","Component","span","Headline","weight","Footnote","normalize","Chevron","size"],"mappings":";;;;+BAkFaA;;;eAAAA;;;;;;;iEAlFU;sBACkB;+BACX;6BACF;0BAEY;0BACf;0BACA;yBACD;yBACA;AAGxB,MAAMC,kBAAkB;IACtBC,IAAI;IACJ,CAAC,UAAU;AACb;AAmEO,MAAMF,aAAa;QAAC,EACzBG,gBAAgB,EAChBC,eAAe,EACfC,mBAAmB,EACnBC,kBAAkB,EAClBC,MAAM,EACNC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACLC,UAAU,EACVC,SAAS,EACTC,OAAO,EACPC,QAAQ,EACRC,aAAa,EACbC,SAAS,EACTC,cAAc,GAAG,EAED,WADbC;QAfHf;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,WAAWC,IAAAA,wBAAW;IAE5B,MAAMC,aAAaV,eAAe,YAAaA,eAAe,UAAUQ,aAAa;IAErF,MAAMG,WAAWC,IAAAA,kBAAY,EAACb,UAAUW;IACxC,MAAM,EAAEG,QAAQ,MAAM,EAAE,GAAGC,IAAAA,4BAAa;IAExC,qBACE,qBAACC,kBAAQ,8CACHR;QACJF,WAAWW,IAAAA,gBAAU,oBAEnBH,UAAU,aAAavB,eAAe,CAACuB,MAAM,EAC7CZ,qCACAI;sBAGF,qBAACY;QACCZ,WAAWW,IAAAA,gBAAU,4BAEnBR,aAAa;OAGdZ,uBAEH,qBAACqB;QAAIZ,SAAS;OACXH,yBACC,qBAACgB,gBAAO;QACNC,WAAU;QACVd,WAAWW,IAAAA,gBAAU;OAEpBd,wBAGL,qBAACe;QAAIZ,SAAS;OACXb,kCACC,qBAAC4B;QAAKf,SAAS;OAAgCb,iCAEjD,qBAAC6B,kBAAQ;QAACF,WAAU;QAAOd,SAAS;QAAkCiB,QAAO;OAC1ExB,WAEFc,IAAAA,kBAAY,EAACnB,kCACZ,qBAAC2B;QAAKf,SAAS;OAAgCZ,mBAGlDU,0BACC,qBAACc;QAAIZ,SAAS;OACXX,qCACC,qBAAC0B;QAAKf,SAAS;OAAgCX,oCAEjD,qBAAC6B,kBAAQ;QACPC,WAAW;QACXnB,WAAWW,IAAAA,gBAAU;OAEpBb,WAEFR,oCACC,qBAACyB;QAAKf,SAAS;OAAgCV,sBAIpDS,+BACC,qBAACmB,kBAAQ;QACPlB,WAAWW,IAAAA,gBAAU;OAEpBZ,iBAINQ,IAAAA,kBAAY,EAACf,4BACZ,qBAACwB,kBAAQ;QAACF,WAAU;QAAOG,QAAO;QAAIjB,SAAS;OAC5CR,YAGJc,0BACC,qBAACM;QAAIZ,WAAWW,IAAAA,gBAAU,2BAA8B;OACrDjB,OACAW,4BACC,qBAACe,gBAAO;QAACC,MAAMpB;QAAaD,SAAS;;AAMjD"}

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

@@ -11,7 +11,7 @@ export interface SliderBaseProps extends Omit<HTMLAttributesWithRootRef<HTMLDivE
      *
      * > Перебивает `aria-label`.
      */
-    getAriaLabel?(index: number): string;
+    getAriaLabel?: (index: number) => string;
     /**
      * В отличие от `aria-valuetext`, позволяет более гибко форматировать текст в зависимости от значения ползунка.
      *
@@ -19,20 +19,20 @@ export interface SliderBaseProps extends Omit<HTMLAttributesWithRootRef<HTMLDivE
      *
      * > Перебивает `aria-valuetext`.
      */
-    getAriaValueText?(value: number, index: number): string;
+    getAriaValueText?: (value: number, index: number) => string;
     withTooltip?: boolean;
 }
 export interface SliderProps extends SliderBaseProps {
     multiple?: false;
     value?: number;
     defaultValue?: number;
-    onChange?(value: number, event: TouchEvent | React.ChangeEvent): void;
+    onChange?: (value: number, event: TouchEvent | React.ChangeEvent) => void;
 }
 export interface SliderMultipleProps extends SliderBaseProps {
     multiple: true;
     value?: [number, number];
     defaultValue?: [number, number];
-    onChange?(value: [number, number], event: TouchEvent | React.ChangeEvent): void;
+    onChange?: (value: [number, number], event: TouchEvent | React.ChangeEvent) => void;
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Slider

package/dist/cjs/components/Slider/Slider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAS,KAAK,UAAU,EAA0B,MAAM,gBAAgB,CAAC;AAoBhF,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,CAAC;IAC9F,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,YAAY,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACrC;;;;;;OAMG;IACH,gBAAgB,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACxD,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,GAAG,KAAK,CAAC,WAAW,GAAG,IAAI,CAAC;CACvE;AAED,MAAM,WAAW,mBAAoB,SAAQ,eAAe;IAC1D,QAAQ,EAAE,IAAI,CAAC;IACf,KAAK,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACzB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,QAAQ,CAAC,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,UAAU,GAAG,KAAK,CAAC,WAAW,GAAG,IAAI,CAAC;CACjF;AAED;;GAEG;AACH,eAAO,MAAM,MAAM,qLAehB,WAAW,GAAG,mBAAmB,sBAkMnC,CAAC"}
+{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAS,KAAK,UAAU,EAA0B,MAAM,gBAAgB,CAAC;AAoBhF,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,CAAC;IAC9F,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACzC;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5D,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,GAAG,KAAK,CAAC,WAAW,KAAK,IAAI,CAAC;CAC3E;AAED,MAAM,WAAW,mBAAoB,SAAQ,eAAe;IAC1D,QAAQ,EAAE,IAAI,CAAC;IACf,KAAK,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACzB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,UAAU,GAAG,KAAK,CAAC,WAAW,KAAK,IAAI,CAAC;CACrF;AAED;;GAEG;AACH,eAAO,MAAM,MAAM,qLAehB,WAAW,GAAG,mBAAmB,sBAkMnC,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { Touch, type TouchEvent, type TouchEventHandler } from '../Touch/Touch';\nimport { SliderThumb } from './SliderThumb/SliderThumb';\nimport {\n  extractSliderAriaAttributesFromRestProps,\n  getDraggingTypeByTargetDataset,\n  isMultipleValues,\n  offsetToValue,\n  snapDirection,\n  toPercent,\n  updateInternalStateValue,\n  updateInternalStateValueByNativeChange,\n} from './helpers';\nimport type { InternalGestureRef, InternalValueState } from './types';\nimport styles from './Slider.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Slider--sizeY-none'],\n  ['compact']: styles['Slider--sizeY-compact'],\n};\n\nexport interface SliderBaseProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'value' | 'defaultValue' | 'onChange'> {\n  min?: number;\n  max?: number;\n  step?: number;\n  disabled?: boolean;\n  /**\n   * Тоже самое, что и `aria-label`, но на вход можно получать индекс текущего ползунка и в зависимости от этого выдавать разный текст.\n   *\n   * > Перебивает `aria-label`.\n   */\n  getAriaLabel?(index: number): string;\n  /**\n   * В отличие от `aria-valuetext`, позволяет более гибко форматировать текст в зависимости от значения ползунка.\n   *\n   * Полезно при использовании компонента как неконтролируемого.\n   *\n   * > Перебивает `aria-valuetext`.\n   */\n  getAriaValueText?(value: number, index: number): string;\n  withTooltip?: boolean;\n}\n\nexport interface SliderProps extends SliderBaseProps {\n  multiple?: false;\n  value?: number;\n  defaultValue?: number;\n  onChange?(value: number, event: TouchEvent | React.ChangeEvent): void;\n}\n\nexport interface SliderMultipleProps extends SliderBaseProps {\n  multiple: true;\n  value?: [number, number];\n  defaultValue?: [number, number];\n  onChange?(value: [number, number], event: TouchEvent | React.ChangeEvent): void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Slider\n */\nexport const Slider = ({\n  step = 1,\n  min = 0,\n  max = 100,\n  value: valueProp,\n  multiple: multipleProp,\n  defaultValue = multipleProp ? [min, max] : min,\n  disabled,\n  className,\n  getRootRef,\n  getAriaLabel,\n  getAriaValueText,\n  onChange,\n  withTooltip,\n  ...restProps\n}: SliderProps | SliderMultipleProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const isControlled = valueProp !== undefined;\n  const [localValue, setValue] = React.useState(defaultValue);\n\n  const value = React.useMemo<InternalValueState>(() => {\n    const resolvedValue = isControlled ? valueProp : localValue;\n    return Array.isArray(resolvedValue)\n      ? [clamp(resolvedValue[0], min, max), clamp(resolvedValue[1], min, max)]\n      : [clamp(resolvedValue, min, max), null];\n  }, [isControlled, valueProp, localValue, min, max]);\n\n  const [startValue, endValue] = value;\n  const multiple = multipleProp && endValue !== null;\n  const startValueInPercent = toPercent(startValue, min, max);\n  const endReversedValueInPercent = multiple ? toPercent(endValue, min, max) : 0;\n\n  const gesture = React.useRef<InternalGestureRef>({\n    dragging: null,\n    startX: 0,\n    containerWidth: 0,\n  }).current;\n  const thumbsContainerRef = useExternRef(getRootRef);\n  const thumbStartInputRef = React.useRef<HTMLInputElement>(null);\n  const thumbEndInputRef = React.useRef<HTMLInputElement>(null);\n\n  const { ariaLabel, ariaValueText, ariaLabelledBy, ...restPropsWithoutAriaAttributes } =\n    extractSliderAriaAttributesFromRestProps(restProps);\n\n  const changeValue = (nextValue: InternalValueState, event: TouchEvent | React.ChangeEvent) => {\n    if (disabled || (value[0] === nextValue[0] && value[1] === nextValue[1])) {\n      return;\n    }\n\n    if (multipleProp) {\n      if (isMultipleValues(nextValue)) {\n        !isControlled && setValue(nextValue);\n        onChange && onChange(nextValue, event);\n      }\n    } else {\n      !isControlled && setValue(nextValue[0]);\n      onChange && onChange(nextValue[0], event);\n    }\n  };\n\n  const handlePointerStart: TouchEventHandler = (event: TouchEvent) => {\n    if (!thumbsContainerRef.current) {\n      return;\n    }\n\n    const { left: nextContainerX, width: nextContainerWidth } =\n      thumbsContainerRef.current.getBoundingClientRect();\n\n    // @ts-expect-error: TS2345 в VKUITouchEvent плохо описаны типы. `target` это просто `EventTarget`.\n    const foundDraggingType = getDraggingTypeByTargetDataset(event.originalEvent.target);\n\n    const nextStartX = event.startX - nextContainerX;\n    const nextValue = offsetToValue(nextStartX, nextContainerWidth, min, max, step);\n    const nextDragging = snapDirection(value, nextValue, foundDraggingType);\n\n    gesture.dragging = nextDragging;\n    gesture.containerWidth = nextContainerWidth;\n    gesture.startX = nextStartX;\n\n    const updatedInternalStateValue = updateInternalStateValue(\n      value,\n      nextValue,\n      min,\n      max,\n      nextDragging,\n    );\n\n    const [nextStartValue, nextEndValue] = updatedInternalStateValue;\n    if (\n      thumbStartInputRef.current &&\n      (foundDraggingType === 'start' ||\n        (nextStartValue !== startValue && nextEndValue === endValue))\n    ) {\n      thumbStartInputRef.current.focus();\n      event.originalEvent.preventDefault();\n    } else if (\n      thumbEndInputRef.current &&\n      (foundDraggingType === 'end' || (nextEndValue !== endValue && nextStartValue === startValue))\n    ) {\n      thumbEndInputRef.current.focus();\n      event.originalEvent.preventDefault();\n    }\n\n    changeValue(updatedInternalStateValue, event);\n\n    event.originalEvent.stopPropagation();\n  };\n\n  const handlePointerMove: TouchEventHandler = (event: TouchEvent) => {\n    const { startX, containerWidth, dragging } = gesture;\n\n    const { shiftX = 0 } = event;\n    const nextStartX = startX + shiftX;\n    const nextValue = offsetToValue(nextStartX, containerWidth, min, max, step);\n\n    changeValue(updateInternalStateValue(value, nextValue, min, max, dragging), event);\n\n    event.originalEvent.stopPropagation();\n    event.originalEvent.preventDefault();\n  };\n\n  const handlePointerEnd: TouchEventHandler = (event) => {\n    gesture.dragging = null;\n    event.originalEvent.stopPropagation();\n  };\n\n  const handleChangeByNativeInput = (event: React.ChangeEvent<HTMLInputElement>) => {\n    changeValue(\n      updateInternalStateValueByNativeChange(\n        value,\n        Number(event.target.value),\n        getDraggingTypeByTargetDataset(event.target),\n      ),\n      event,\n    );\n  };\n\n  return (\n    <Touch\n      data-value={multiple ? `${startValue},${endValue}` : startValue}\n      {...restPropsWithoutAriaAttributes}\n      className={classNames(\n        styles['Slider'],\n        disabled && styles['Slider--disabled'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        className,\n      )}\n      onStart={disabled ? undefined : handlePointerStart}\n      onMove={disabled ? undefined : handlePointerMove}\n      onEnd={disabled ? undefined : handlePointerEnd}\n    >\n      <div className={styles['Slider__track']} />\n      <div\n        className={styles['Slider__track-fill']}\n        style={\n          multiple\n            ? { left: `${startValueInPercent}%`, right: `${100 - endReversedValueInPercent}%` }\n            : { width: `${startValueInPercent}%` }\n        }\n      />\n      <div ref={thumbsContainerRef} className={styles['Slider__thumbs']}>\n        <SliderThumb\n          data-type=\"start\"\n          className={styles['Slider__thumb']}\n          style={{\n            left: `${startValueInPercent}%`,\n            // Меняем местами порядок слоёв, иначе, при достижении `start` и `end` 100%, `end` будет перекрывать `start`.\n            zIndex: multiple && startValueInPercent >= 50 ? 2 : undefined,\n          }}\n          withTooltip={withTooltip}\n          inputProps={{\n            'data-type': 'start',\n            'ref': thumbStartInputRef,\n            'step': step,\n            'min': min,\n            'value': startValue,\n            'max': multiple ? endValue : max,\n            'disabled': disabled,\n            'aria-label': getAriaLabel ? getAriaLabel(0) : ariaLabel,\n            'aria-valuetext': getAriaValueText ? getAriaValueText(startValue, 0) : ariaValueText,\n            'aria-labelledby': ariaLabelledBy,\n            'onChange': handleChangeByNativeInput,\n          }}\n        />\n        {multiple && (\n          <SliderThumb\n            data-type=\"end\"\n            className={styles['Slider__thumb']}\n            style={{ left: `${endReversedValueInPercent}%` }}\n            withTooltip={withTooltip}\n            inputProps={{\n              'data-type': 'end',\n              'ref': thumbEndInputRef,\n              'step': step,\n              'min': startValue,\n              'value': endValue,\n              'max': max,\n              'disabled': disabled,\n              'aria-label': getAriaLabel ? getAriaLabel(1) : ariaLabel,\n              'aria-valuetext': getAriaValueText ? getAriaValueText(endValue, 1) : ariaValueText,\n              'aria-labelledby': ariaLabelledBy,\n              'onChange': handleChangeByNativeInput,\n            }}\n          />\n        )}\n      </div>\n    </Touch>\n  );\n};\n"],"names":["Slider","sizeYClassNames","none","step","min","max","value","valueProp","multiple","multipleProp","defaultValue","disabled","className","getRootRef","getAriaLabel","getAriaValueText","onChange","withTooltip","restProps","sizeY","useAdaptivity","isControlled","undefined","localValue","setValue","React","useState","useMemo","resolvedValue","Array","isArray","clamp","startValue","endValue","startValueInPercent","toPercent","endReversedValueInPercent","gesture","useRef","dragging","startX","containerWidth","current","thumbsContainerRef","useExternRef","thumbStartInputRef","thumbEndInputRef","extractSliderAriaAttributesFromRestProps","ariaLabel","ariaValueText","ariaLabelledBy","restPropsWithoutAriaAttributes","changeValue","nextValue","event","isMultipleValues","handlePointerStart","left","nextContainerX","width","nextContainerWidth","getBoundingClientRect","foundDraggingType","getDraggingTypeByTargetDataset","originalEvent","target","nextStartX","offsetToValue","nextDragging","snapDirection","updatedInternalStateValue","updateInternalStateValue","nextStartValue","nextEndValue","focus","preventDefault","stopPropagation","handlePointerMove","shiftX","handlePointerEnd","handleChangeByNativeInput","updateInternalStateValueByNativeChange","Number","Touch","data-value","classNames","onStart","onMove","onEnd","div","style","right","ref","SliderThumb","data-type","zIndex","inputProps"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { Touch, type TouchEvent, type TouchEventHandler } from '../Touch/Touch';\nimport { SliderThumb } from './SliderThumb/SliderThumb';\nimport {\n  extractSliderAriaAttributesFromRestProps,\n  getDraggingTypeByTargetDataset,\n  isMultipleValues,\n  offsetToValue,\n  snapDirection,\n  toPercent,\n  updateInternalStateValue,\n  updateInternalStateValueByNativeChange,\n} from './helpers';\nimport type { InternalGestureRef, InternalValueState } from './types';\nimport styles from './Slider.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Slider--sizeY-none'],\n  ['compact']: styles['Slider--sizeY-compact'],\n};\n\nexport interface SliderBaseProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'value' | 'defaultValue' | 'onChange'> {\n  min?: number;\n  max?: number;\n  step?: number;\n  disabled?: boolean;\n  /**\n   * Тоже самое, что и `aria-label`, но на вход можно получать индекс текущего ползунка и в зависимости от этого выдавать разный текст.\n   *\n   * > Перебивает `aria-label`.\n   */\n  getAriaLabel?: (index: number) => string;\n  /**\n   * В отличие от `aria-valuetext`, позволяет более гибко форматировать текст в зависимости от значения ползунка.\n   *\n   * Полезно при использовании компонента как неконтролируемого.\n   *\n   * > Перебивает `aria-valuetext`.\n   */\n  getAriaValueText?: (value: number, index: number) => string;\n  withTooltip?: boolean;\n}\n\nexport interface SliderProps extends SliderBaseProps {\n  multiple?: false;\n  value?: number;\n  defaultValue?: number;\n  onChange?: (value: number, event: TouchEvent | React.ChangeEvent) => void;\n}\n\nexport interface SliderMultipleProps extends SliderBaseProps {\n  multiple: true;\n  value?: [number, number];\n  defaultValue?: [number, number];\n  onChange?: (value: [number, number], event: TouchEvent | React.ChangeEvent) => void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Slider\n */\nexport const Slider = ({\n  step = 1,\n  min = 0,\n  max = 100,\n  value: valueProp,\n  multiple: multipleProp,\n  defaultValue = multipleProp ? [min, max] : min,\n  disabled,\n  className,\n  getRootRef,\n  getAriaLabel,\n  getAriaValueText,\n  onChange,\n  withTooltip,\n  ...restProps\n}: SliderProps | SliderMultipleProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const isControlled = valueProp !== undefined;\n  const [localValue, setValue] = React.useState(defaultValue);\n\n  const value = React.useMemo<InternalValueState>(() => {\n    const resolvedValue = isControlled ? valueProp : localValue;\n    return Array.isArray(resolvedValue)\n      ? [clamp(resolvedValue[0], min, max), clamp(resolvedValue[1], min, max)]\n      : [clamp(resolvedValue, min, max), null];\n  }, [isControlled, valueProp, localValue, min, max]);\n\n  const [startValue, endValue] = value;\n  const multiple = multipleProp && endValue !== null;\n  const startValueInPercent = toPercent(startValue, min, max);\n  const endReversedValueInPercent = multiple ? toPercent(endValue, min, max) : 0;\n\n  const gesture = React.useRef<InternalGestureRef>({\n    dragging: null,\n    startX: 0,\n    containerWidth: 0,\n  }).current;\n  const thumbsContainerRef = useExternRef(getRootRef);\n  const thumbStartInputRef = React.useRef<HTMLInputElement>(null);\n  const thumbEndInputRef = React.useRef<HTMLInputElement>(null);\n\n  const { ariaLabel, ariaValueText, ariaLabelledBy, ...restPropsWithoutAriaAttributes } =\n    extractSliderAriaAttributesFromRestProps(restProps);\n\n  const changeValue = (nextValue: InternalValueState, event: TouchEvent | React.ChangeEvent) => {\n    if (disabled || (value[0] === nextValue[0] && value[1] === nextValue[1])) {\n      return;\n    }\n\n    if (multipleProp) {\n      if (isMultipleValues(nextValue)) {\n        !isControlled && setValue(nextValue);\n        onChange && onChange(nextValue, event);\n      }\n    } else {\n      !isControlled && setValue(nextValue[0]);\n      onChange && onChange(nextValue[0], event);\n    }\n  };\n\n  const handlePointerStart: TouchEventHandler = (event: TouchEvent) => {\n    if (!thumbsContainerRef.current) {\n      return;\n    }\n\n    const { left: nextContainerX, width: nextContainerWidth } =\n      thumbsContainerRef.current.getBoundingClientRect();\n\n    // @ts-expect-error: TS2345 в VKUITouchEvent плохо описаны типы. `target` это просто `EventTarget`.\n    const foundDraggingType = getDraggingTypeByTargetDataset(event.originalEvent.target);\n\n    const nextStartX = event.startX - nextContainerX;\n    const nextValue = offsetToValue(nextStartX, nextContainerWidth, min, max, step);\n    const nextDragging = snapDirection(value, nextValue, foundDraggingType);\n\n    gesture.dragging = nextDragging;\n    gesture.containerWidth = nextContainerWidth;\n    gesture.startX = nextStartX;\n\n    const updatedInternalStateValue = updateInternalStateValue(\n      value,\n      nextValue,\n      min,\n      max,\n      nextDragging,\n    );\n\n    const [nextStartValue, nextEndValue] = updatedInternalStateValue;\n    if (\n      thumbStartInputRef.current &&\n      (foundDraggingType === 'start' ||\n        (nextStartValue !== startValue && nextEndValue === endValue))\n    ) {\n      thumbStartInputRef.current.focus();\n      event.originalEvent.preventDefault();\n    } else if (\n      thumbEndInputRef.current &&\n      (foundDraggingType === 'end' || (nextEndValue !== endValue && nextStartValue === startValue))\n    ) {\n      thumbEndInputRef.current.focus();\n      event.originalEvent.preventDefault();\n    }\n\n    changeValue(updatedInternalStateValue, event);\n\n    event.originalEvent.stopPropagation();\n  };\n\n  const handlePointerMove: TouchEventHandler = (event: TouchEvent) => {\n    const { startX, containerWidth, dragging } = gesture;\n\n    const { shiftX = 0 } = event;\n    const nextStartX = startX + shiftX;\n    const nextValue = offsetToValue(nextStartX, containerWidth, min, max, step);\n\n    changeValue(updateInternalStateValue(value, nextValue, min, max, dragging), event);\n\n    event.originalEvent.stopPropagation();\n    event.originalEvent.preventDefault();\n  };\n\n  const handlePointerEnd: TouchEventHandler = (event) => {\n    gesture.dragging = null;\n    event.originalEvent.stopPropagation();\n  };\n\n  const handleChangeByNativeInput = (event: React.ChangeEvent<HTMLInputElement>) => {\n    changeValue(\n      updateInternalStateValueByNativeChange(\n        value,\n        Number(event.target.value),\n        getDraggingTypeByTargetDataset(event.target),\n      ),\n      event,\n    );\n  };\n\n  return (\n    <Touch\n      data-value={multiple ? `${startValue},${endValue}` : startValue}\n      {...restPropsWithoutAriaAttributes}\n      className={classNames(\n        styles['Slider'],\n        disabled && styles['Slider--disabled'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        className,\n      )}\n      onStart={disabled ? undefined : handlePointerStart}\n      onMove={disabled ? undefined : handlePointerMove}\n      onEnd={disabled ? undefined : handlePointerEnd}\n    >\n      <div className={styles['Slider__track']} />\n      <div\n        className={styles['Slider__track-fill']}\n        style={\n          multiple\n            ? { left: `${startValueInPercent}%`, right: `${100 - endReversedValueInPercent}%` }\n            : { width: `${startValueInPercent}%` }\n        }\n      />\n      <div ref={thumbsContainerRef} className={styles['Slider__thumbs']}>\n        <SliderThumb\n          data-type=\"start\"\n          className={styles['Slider__thumb']}\n          style={{\n            left: `${startValueInPercent}%`,\n            // Меняем местами порядок слоёв, иначе, при достижении `start` и `end` 100%, `end` будет перекрывать `start`.\n            zIndex: multiple && startValueInPercent >= 50 ? 2 : undefined,\n          }}\n          withTooltip={withTooltip}\n          inputProps={{\n            'data-type': 'start',\n            'ref': thumbStartInputRef,\n            'step': step,\n            'min': min,\n            'value': startValue,\n            'max': multiple ? endValue : max,\n            'disabled': disabled,\n            'aria-label': getAriaLabel ? getAriaLabel(0) : ariaLabel,\n            'aria-valuetext': getAriaValueText ? getAriaValueText(startValue, 0) : ariaValueText,\n            'aria-labelledby': ariaLabelledBy,\n            'onChange': handleChangeByNativeInput,\n          }}\n        />\n        {multiple && (\n          <SliderThumb\n            data-type=\"end\"\n            className={styles['Slider__thumb']}\n            style={{ left: `${endReversedValueInPercent}%` }}\n            withTooltip={withTooltip}\n            inputProps={{\n              'data-type': 'end',\n              'ref': thumbEndInputRef,\n              'step': step,\n              'min': startValue,\n              'value': endValue,\n              'max': max,\n              'disabled': disabled,\n              'aria-label': getAriaLabel ? getAriaLabel(1) : ariaLabel,\n              'aria-valuetext': getAriaValueText ? getAriaValueText(endValue, 1) : ariaValueText,\n              'aria-labelledby': ariaLabelledBy,\n              'onChange': handleChangeByNativeInput,\n            }}\n          />\n        )}\n      </div>\n    </Touch>\n  );\n};\n"],"names":["Slider","sizeYClassNames","none","step","min","max","value","valueProp","multiple","multipleProp","defaultValue","disabled","className","getRootRef","getAriaLabel","getAriaValueText","onChange","withTooltip","restProps","sizeY","useAdaptivity","isControlled","undefined","localValue","setValue","React","useState","useMemo","resolvedValue","Array","isArray","clamp","startValue","endValue","startValueInPercent","toPercent","endReversedValueInPercent","gesture","useRef","dragging","startX","containerWidth","current","thumbsContainerRef","useExternRef","thumbStartInputRef","thumbEndInputRef","extractSliderAriaAttributesFromRestProps","ariaLabel","ariaValueText","ariaLabelledBy","restPropsWithoutAriaAttributes","changeValue","nextValue","event","isMultipleValues","handlePointerStart","left","nextContainerX","width","nextContainerWidth","getBoundingClientRect","foundDraggingType","getDraggingTypeByTargetDataset","originalEvent","target","nextStartX","offsetToValue","nextDragging","snapDirection","updatedInternalStateValue","updateInternalStateValue","nextStartValue","nextEndValue","focus","preventDefault","stopPropagation","handlePointerMove","shiftX","handlePointerEnd","handleChangeByNativeInput","updateInternalStateValueByNativeChange","Number","Touch","data-value","classNames","onStart","onMove","onEnd","div","style","right","ref","SliderThumb","data-type","zIndex","inputProps"],"mappings":"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"}

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

@@ -3,7 +3,7 @@ import { HasRef, HasRootRef } from '../../types';
 import { FormFieldProps } from '../FormField/FormField';
 export interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'onResize'>, HasRef<HTMLTextAreaElement>, HasRootRef<HTMLElement>, Pick<React.CSSProperties, 'maxHeight'>, Pick<FormFieldProps, 'status'> {
     grow?: boolean;
-    onResize?(el: HTMLTextAreaElement): void;
+    onResize?: (el: HTMLTextAreaElement) => void;
     defaultValue?: string;
 }
 /**

package/dist/cjs/components/Textarea/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAa,cAAc,EAAE,MAAM,wBAAwB,CAAC;AASnE,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,UAAU,CAAC,EACzE,MAAM,CAAC,mBAAmB,CAAC,EAC3B,UAAU,CAAC,WAAW,CAAC,EACvB,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,WAAW,CAAC,EACtC,IAAI,CAAC,cAAc,EAAE,QAAQ,CAAC;IAChC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,CAAC,EAAE,EAAE,mBAAmB,GAAG,IAAI,CAAC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,8GAYlB,aAAa,sBA6Cf,CAAC"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAa,cAAc,EAAE,MAAM,wBAAwB,CAAC;AASnE,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,UAAU,CAAC,EACzE,MAAM,CAAC,mBAAmB,CAAC,EAC3B,UAAU,CAAC,WAAW,CAAC,EACvB,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,WAAW,CAAC,EACtC,IAAI,CAAC,cAAc,EAAE,QAAQ,CAAC;IAChC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAC7C,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,8GAYlB,aAAa,sBA6Cf,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { HasRef, HasRootRef } from '../../types';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './Textarea.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Textarea--sizeY-none'],\n  ['compact']: styles['Textarea--sizeY-compact'],\n};\n\nexport interface TextareaProps\n  extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'onResize'>,\n    HasRef<HTMLTextAreaElement>,\n    HasRootRef<HTMLElement>,\n    Pick<React.CSSProperties, 'maxHeight'>,\n    Pick<FormFieldProps, 'status'> {\n  grow?: boolean;\n  onResize?(el: HTMLTextAreaElement): void;\n  defaultValue?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Textarea\n */\nexport const Textarea = ({\n  grow = true,\n  style,\n  onResize,\n  className,\n  getRootRef,\n  getRef,\n  rows = 2,\n  maxHeight,\n  status,\n  onChange,\n  ...restProps\n}: TextareaProps) => {\n  const currentScrollHeight = React.useRef<number>();\n  const elementRef = useExternRef(getRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const autosizeInput = () => {\n    const el = elementRef.current;\n\n    if (grow && el?.offsetParent) {\n      el.style.height = '';\n      el.style.height = `${el.scrollHeight}px`;\n\n      if (el.scrollHeight !== currentScrollHeight.current && onResize) {\n        onResize(el);\n        currentScrollHeight.current = el.scrollHeight;\n      }\n    }\n  };\n\n  React.useEffect(autosizeInput, [grow, sizeY, elementRef, onResize]);\n\n  return (\n    <FormField\n      className={classNames(\n        styles['Textarea'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        className,\n      )}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={restProps.disabled}\n      status={status}\n    >\n      <Text\n        {...restProps}\n        Component=\"textarea\"\n        normalize={false}\n        style={{ maxHeight }}\n        rows={rows}\n        className={styles['Textarea__el']}\n        onChange={callMultiple(onChange, autosizeInput)}\n        getRootRef={elementRef}\n      />\n    </FormField>\n  );\n};\n"],"names":["Textarea","sizeYClassNames","none","grow","style","onResize","className","getRootRef","getRef","rows","maxHeight","status","onChange","restProps","currentScrollHeight","React","useRef","elementRef","useExternRef","sizeY","useAdaptivity","autosizeInput","el","current","offsetParent","height","scrollHeight","useEffect","FormField","classNames","disabled","Text","Component","normalize","callMultiple"],"mappings":";;;;+BA6BaA;;;eAAAA;;;;;;;iEA7BU;sBACI;+BACG;8BACD;8BACA;2BAEa;sBACrB;AAGrB,MAAMC,kBAAkB;IACtBC,IAAI;IACJ,CAAC,UAAU;AACb;AAgBO,MAAMF,WAAW;QAAC,EACvBG,OAAO,IAAI,EACXC,KAAK,EACLC,QAAQ,EACRC,SAAS,EACTC,UAAU,EACVC,MAAM,EACNC,OAAO,CAAC,EACRC,SAAS,EACTC,MAAM,EACNC,QAAQ,EAEM,WADXC;QAVHV;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,sBAAsBC,OAAMC,MAAM;IACxC,MAAMC,aAAaC,IAAAA,0BAAY,EAACV;IAChC,MAAM,EAAEW,QAAQ,MAAM,EAAE,GAAGC,IAAAA,4BAAa;IAExC,MAAMC,gBAAgB;QACpB,MAAMC,KAAKL,WAAWM,OAAO;QAE7B,IAAIpB,SAAQmB,eAAAA,yBAAAA,GAAIE,YAAY,GAAE;YAC5BF,GAAGlB,KAAK,CAACqB,MAAM,GAAG;YAClBH,GAAGlB,KAAK,CAACqB,MAAM,GAAG,CAAC,EAAEH,GAAGI,YAAY,CAAC,EAAE,CAAC;YAExC,IAAIJ,GAAGI,YAAY,KAAKZ,oBAAoBS,OAAO,IAAIlB,UAAU;gBAC/DA,SAASiB;gBACTR,oBAAoBS,OAAO,GAAGD,GAAGI,YAAY;YAC/C;QACF;IACF;IAEAX,OAAMY,SAAS,CAACN,eAAe;QAAClB;QAAMgB;QAAOF;QAAYZ;KAAS;IAElE,qBACE,qBAACuB,oBAAS;QACRtB,WAAWuB,IAAAA,gBAAU,kBAEnBV,UAAU,aAAalB,eAAe,CAACkB,MAAM,EAC7Cb;QAEFF,OAAOA;QACPG,YAAYA;QACZuB,UAAUjB,UAAUiB,QAAQ;QAC5BnB,QAAQA;qBAER,qBAACoB,UAAI,8CACClB;QACJmB,WAAU;QACVC,WAAW;QACX7B,OAAO;YAAEM;QAAU;QACnBD,MAAMA;QACNH,SAAS;QACTM,UAAUsB,IAAAA,0BAAY,EAACtB,UAAUS;QACjCd,YAAYU;;AAIpB"}
+{"version":3,"sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { HasRef, HasRootRef } from '../../types';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './Textarea.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Textarea--sizeY-none'],\n  ['compact']: styles['Textarea--sizeY-compact'],\n};\n\nexport interface TextareaProps\n  extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'onResize'>,\n    HasRef<HTMLTextAreaElement>,\n    HasRootRef<HTMLElement>,\n    Pick<React.CSSProperties, 'maxHeight'>,\n    Pick<FormFieldProps, 'status'> {\n  grow?: boolean;\n  onResize?: (el: HTMLTextAreaElement) => void;\n  defaultValue?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Textarea\n */\nexport const Textarea = ({\n  grow = true,\n  style,\n  onResize,\n  className,\n  getRootRef,\n  getRef,\n  rows = 2,\n  maxHeight,\n  status,\n  onChange,\n  ...restProps\n}: TextareaProps) => {\n  const currentScrollHeight = React.useRef<number>();\n  const elementRef = useExternRef(getRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const autosizeInput = () => {\n    const el = elementRef.current;\n\n    if (grow && el?.offsetParent) {\n      el.style.height = '';\n      el.style.height = `${el.scrollHeight}px`;\n\n      if (el.scrollHeight !== currentScrollHeight.current && onResize) {\n        onResize(el);\n        currentScrollHeight.current = el.scrollHeight;\n      }\n    }\n  };\n\n  React.useEffect(autosizeInput, [grow, sizeY, elementRef, onResize]);\n\n  return (\n    <FormField\n      className={classNames(\n        styles['Textarea'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        className,\n      )}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={restProps.disabled}\n      status={status}\n    >\n      <Text\n        {...restProps}\n        Component=\"textarea\"\n        normalize={false}\n        style={{ maxHeight }}\n        rows={rows}\n        className={styles['Textarea__el']}\n        onChange={callMultiple(onChange, autosizeInput)}\n        getRootRef={elementRef}\n      />\n    </FormField>\n  );\n};\n"],"names":["Textarea","sizeYClassNames","none","grow","style","onResize","className","getRootRef","getRef","rows","maxHeight","status","onChange","restProps","currentScrollHeight","React","useRef","elementRef","useExternRef","sizeY","useAdaptivity","autosizeInput","el","current","offsetParent","height","scrollHeight","useEffect","FormField","classNames","disabled","Text","Component","normalize","callMultiple"],"mappings":";;;;+BA6BaA;;;eAAAA;;;;;;;iEA7BU;sBACI;+BACG;8BACD;8BACA;2BAEa;sBACrB;AAGrB,MAAMC,kBAAkB;IACtBC,IAAI;IACJ,CAAC,UAAU;AACb;AAgBO,MAAMF,WAAW;QAAC,EACvBG,OAAO,IAAI,EACXC,KAAK,EACLC,QAAQ,EACRC,SAAS,EACTC,UAAU,EACVC,MAAM,EACNC,OAAO,CAAC,EACRC,SAAS,EACTC,MAAM,EACNC,QAAQ,EAEM,WADXC;QAVHV;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,sBAAsBC,OAAMC,MAAM;IACxC,MAAMC,aAAaC,IAAAA,0BAAY,EAACV;IAChC,MAAM,EAAEW,QAAQ,MAAM,EAAE,GAAGC,IAAAA,4BAAa;IAExC,MAAMC,gBAAgB;QACpB,MAAMC,KAAKL,WAAWM,OAAO;QAE7B,IAAIpB,SAAQmB,eAAAA,yBAAAA,GAAIE,YAAY,GAAE;YAC5BF,GAAGlB,KAAK,CAACqB,MAAM,GAAG;YAClBH,GAAGlB,KAAK,CAACqB,MAAM,GAAG,CAAC,EAAEH,GAAGI,YAAY,CAAC,EAAE,CAAC;YAExC,IAAIJ,GAAGI,YAAY,KAAKZ,oBAAoBS,OAAO,IAAIlB,UAAU;gBAC/DA,SAASiB;gBACTR,oBAAoBS,OAAO,GAAGD,GAAGI,YAAY;YAC/C;QACF;IACF;IAEAX,OAAMY,SAAS,CAACN,eAAe;QAAClB;QAAMgB;QAAOF;QAAYZ;KAAS;IAElE,qBACE,qBAACuB,oBAAS;QACRtB,WAAWuB,IAAAA,gBAAU,kBAEnBV,UAAU,aAAalB,eAAe,CAACkB,MAAM,EAC7Cb;QAEFF,OAAOA;QACPG,YAAYA;QACZuB,UAAUjB,UAAUiB,QAAQ;QAC5BnB,QAAQA;qBAER,qBAACoB,UAAI,8CACClB;QACJmB,WAAU;QACVC,WAAW;QACX7B,OAAO;YAAEM;QAAU;QACnBD,MAAMA;QACNH,SAAS;QACTM,UAAUsB,IAAAA,0BAAY,EAACtB,UAAUS;QACjCd,YAAYU;;AAIpB"}

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

@@ -10,25 +10,25 @@ interface ViewsScrolls {
 export declare let scrollsCache: ViewsScrolls;
 export interface ViewProps extends HTMLAttributesWithRootRef<HTMLElement>, NavIdProps {
     activePanel: string;
-    onTransition?(params: {
+    onTransition?: (params: {
         isBack: boolean;
         from: string;
         to: string;
-    }): void;
+    }) => void;
     /**
      * callback свайпа назад
      */
-    onSwipeBack?(): void;
+    onSwipeBack?: () => void;
     /**
      * callback начала анимации свайпа назад.
      *
      * Чтобы остановить свайп назад, возвращайте `"prevent"`.
      */
-    onSwipeBackStart?(activePanel: string | null): void | 'prevent';
+    onSwipeBackStart?: (activePanel: string | null) => void | 'prevent';
     /**
      * callback завершения анимации отмененного пользователем свайпа
      */
-    onSwipeBackCancel?(): void;
+    onSwipeBackCancel?: () => void;
     history?: string[];
     children: React.ReactElement | Iterable<React.ReactElement>;
 }

package/dist/cjs/components/View/View.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"View.d.ts","sourceRoot":"","sources":["../../../../src/components/View/View.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EAAY,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAI1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAexD,UAAU,OAAO;IACf,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;CACrC;AAED,UAAU,YAAY;IACpB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B;AAED,eAAO,IAAI,YAAY,EAAE,YAAiB,CAAC;AAE3C,MAAM,WAAW,SAAU,SAAQ,yBAAyB,CAAC,WAAW,CAAC,EAAE,UAAU;IACnF,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,CAAC,MAAM,EAAE;QAAE,MAAM,EAAE,OAAO,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAC3E;;OAEG;IACH,WAAW,CAAC,IAAI,IAAI,CAAC;IACrB;;;;OAIG;IACH,gBAAgB,CAAC,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;IAChE;;OAEG;IACH,iBAAiB,CAAC,IAAI,IAAI,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IAEnB,QAAQ,EAAE,KAAK,CAAC,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;CAC7D;AAID;;GAEG;AACH,eAAO,MAAM,IAAI,6KAWd,SAAS,sBAqfX,CAAC"}
+{"version":3,"file":"View.d.ts","sourceRoot":"","sources":["../../../../src/components/View/View.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EAAY,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAI1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAexD,UAAU,OAAO;IACf,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;CACrC;AAED,UAAU,YAAY;IACpB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B;AAED,eAAO,IAAI,YAAY,EAAE,YAAiB,CAAC;AAE3C,MAAM,WAAW,SAAU,SAAQ,yBAAyB,CAAC,WAAW,CAAC,EAAE,UAAU;IACnF,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,MAAM,EAAE,OAAO,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC/E;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,GAAG,SAAS,CAAC;IACpE;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IAEnB,QAAQ,EAAE,KAAK,CAAC,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;CAC7D;AAID;;GAEG;AACH,eAAO,MAAM,IAAI,6KAWd,SAAS,sBAqfX,CAAC"}