@vkontakte/vkui 7.4.3 → 7.5.0

package/dist/components/MiniInfoCell/MiniInfoCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/MiniInfoCell/MiniInfoCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Chevron } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport styles from './MiniInfoCell.module.css';\n\nconst stylesMode = {\n  add: styles.modeAdd,\n  accent: styles.modeAccent,\n  more: styles.modeMore,\n};\n\nconst stylesTextWrap = {\n  nowrap: styles.textWrapNowrap,\n  full: styles.textWrapFull,\n  short: styles.textWrapShort,\n};\n\nexport interface MiniInfoCellProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Иконка слева.<br />\n   * Рекомендуется использовать иконки размера 20.\n   */\n  before?: React.ReactNode;\n\n  /**\n   * Содержимое справа.<br />\n   * `<UsersStack size=\"s\" />` или `<Avatar size={24} />`.\n   */\n  after?: React.ReactNode;\n\n  /**\n   * Тип ячейки:\n   *\n   * - `base` – базовая ячейка с серой иконкой и серым текстом.<br />\n   * В компонент можно передать `Link`, чтобы визуально сделать часть текста ссылкой.\n   * - `add` – тип ячейки, который показывает, что взаимодействие с ней должно вызывать действие добавления чего-то.\n   * - `more` – взаимодействие с такой ячейкой должно открывать какую-то подробную информацию.\n   */\n  mode?: 'base' | 'accent' | 'add' | 'more';\n\n  /**\n   * Тип отображения текста:\n   *\n   * - `nowrap` – в одну строку, текст не переносится и обрезается.\n   * - `short` – максимально отображается 3 строки, остальное обрезается.\n   * - `full` – текст отображается полностью. В дизайне это свойство `multiline`.\n   */\n  textWrap?: 'nowrap' | 'short' | 'full';\n\n  /**\n   * Передавать `true`, если предполагается переход при нажатии на ячейку.\n   */\n  chevron?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/MiniInfoCell\n */\nexport const MiniInfoCell = ({\n  before,\n  after,\n  children,\n  mode = 'base',\n  textWrap = 'nowrap',\n  chevron = false,\n  ...restProps\n}: MiniInfoCellProps): React.ReactNode => {\n  const cellClasses = classNames(\n    styles.host,\n    stylesTextWrap[textWrap],\n    mode !== 'base' && stylesMode[mode],\n  );\n\n  const cellContent = (\n    <React.Fragment>\n      {hasReactNode(before) && <span className={styles.before}>{before}</span>}\n      <div className={styles.middle}>\n        <Paragraph className={styles.content} weight={mode === 'more' ? '2' : undefined}>\n          {children}\n        </Paragraph>\n        {chevron && <Icon16Chevron />}\n      </div>\n      {hasReactNode(after) && <span className={styles.after}>{after}</span>}\n    </React.Fragment>\n  );\n\n  return (\n    <Tappable {...restProps} baseClassName={cellClasses}>\n      {cellContent}\n    </Tappable>\n  );\n};\n"],"names":["React","Icon16Chevron","classNames","hasReactNode","Tappable","Paragraph","stylesMode","add","accent","more","stylesTextWrap","nowrap","full","short","MiniInfoCell","before","after","children","mode","textWrap","chevron","restProps","cellClasses","cellContent","Fragment","span","className","div","weight","undefined","baseClassName"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,QAAQ,mBAAmB;AACjD,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAE3D,SAASC,QAAQ,QAAQ,0BAAuB;AAChD,SAASC,SAAS,QAAQ,uCAAoC;AAG9D,MAAMC,aAAa;IACjBC,GAAG;IACHC,MAAM;IACNC,IAAI;AACN;AAEA,MAAMC,iBAAiB;IACrBC,MAAM;IACNC,IAAI;IACJC,KAAK;AACP;AAwCA;;CAEC,GACD,OAAO,MAAMC,eAAe;QAAC,EAC3BC,MAAM,EACNC,KAAK,EACLC,QAAQ,EACRC,OAAO,MAAM,EACbC,WAAW,QAAQ,EACnBC,UAAU,KAAK,EAEG,WADfC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,cAAcpB,qCAElBQ,cAAc,CAACS,SAAS,EACxBD,SAAS,UAAUZ,UAAU,CAACY,KAAK;IAGrC,MAAMK,4BACJ,MAACvB,MAAMwB,QAAQ;;YACZrB,aAAaY,yBAAW,KAACU;gBAAKC,SAAS;0BAAkBX;;0BAC1D,MAACY;gBAAID,SAAS;;kCACZ,KAACrB;wBAAUqB,SAAS;wBAAkBE,QAAQV,SAAS,SAAS,MAAMW;kCACnEZ;;oBAEFG,yBAAW,KAACnB;;;YAEdE,aAAaa,wBAAU,KAACS;gBAAKC,SAAS;0BAAiBV;;;;IAI5D,qBACE,KAACZ,kDAAaiB;QAAWS,eAAeR;kBACrCC;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/MiniInfoCell/MiniInfoCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Chevron } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport styles from './MiniInfoCell.module.css';\n\nconst stylesMode = {\n  add: styles.modeAdd,\n  accent: styles.modeAccent,\n  more: styles.modeMore,\n};\n\nconst stylesTextWrap = {\n  nowrap: styles.textWrapNowrap,\n  full: styles.textWrapFull,\n  short: styles.textWrapShort,\n};\n\nexport interface MiniInfoCellProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Иконка слева.<br />\n   * Рекомендуется использовать иконки размера 20.\n   */\n  before?: React.ReactNode;\n\n  /**\n   * Содержимое справа.<br />\n   * `<UsersStack size=\"s\" />` или `<Avatar size={24} />`.\n   */\n  after?: React.ReactNode;\n\n  /**\n   * Тип ячейки:\n   *\n   * - `base` – базовая ячейка с серой иконкой и серым текстом.<br />\n   * В компонент можно передать `Link`, чтобы визуально сделать часть текста ссылкой.\n   * - `add` – тип ячейки, который показывает, что взаимодействие с ней должно вызывать действие добавления чего-то.\n   * - `more` – взаимодействие с такой ячейкой должно открывать какую-то подробную информацию.\n   */\n  mode?: 'base' | 'accent' | 'add' | 'more';\n\n  /**\n   * Тип отображения текста:\n   *\n   * - `nowrap` – в одну строку, текст не переносится и обрезается.\n   * - `short` – максимально отображается 3 строки, остальное обрезается.\n   * - `full` – текст отображается полностью. В дизайне это свойство `multiline`.\n   */\n  textWrap?: 'nowrap' | 'short' | 'full';\n\n  /**\n   * Передавать `true`, если предполагается переход при нажатии на ячейку.\n   */\n  chevron?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/mini-info-cell\n */\nexport const MiniInfoCell = ({\n  before,\n  after,\n  children,\n  mode = 'base',\n  textWrap = 'nowrap',\n  chevron = false,\n  ...restProps\n}: MiniInfoCellProps): React.ReactNode => {\n  const cellClasses = classNames(\n    styles.host,\n    stylesTextWrap[textWrap],\n    mode !== 'base' && stylesMode[mode],\n  );\n\n  const cellContent = (\n    <React.Fragment>\n      {hasReactNode(before) && <span className={styles.before}>{before}</span>}\n      <div className={styles.middle}>\n        <Paragraph className={styles.content} weight={mode === 'more' ? '2' : undefined}>\n          {children}\n        </Paragraph>\n        {chevron && <Icon16Chevron />}\n      </div>\n      {hasReactNode(after) && <span className={styles.after}>{after}</span>}\n    </React.Fragment>\n  );\n\n  return (\n    <Tappable {...restProps} baseClassName={cellClasses}>\n      {cellContent}\n    </Tappable>\n  );\n};\n"],"names":["React","Icon16Chevron","classNames","hasReactNode","Tappable","Paragraph","stylesMode","add","accent","more","stylesTextWrap","nowrap","full","short","MiniInfoCell","before","after","children","mode","textWrap","chevron","restProps","cellClasses","cellContent","Fragment","span","className","div","weight","undefined","baseClassName"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,QAAQ,mBAAmB;AACjD,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAE3D,SAASC,QAAQ,QAAQ,0BAAuB;AAChD,SAASC,SAAS,QAAQ,uCAAoC;AAG9D,MAAMC,aAAa;IACjBC,GAAG;IACHC,MAAM;IACNC,IAAI;AACN;AAEA,MAAMC,iBAAiB;IACrBC,MAAM;IACNC,IAAI;IACJC,KAAK;AACP;AAwCA;;CAEC,GACD,OAAO,MAAMC,eAAe;QAAC,EAC3BC,MAAM,EACNC,KAAK,EACLC,QAAQ,EACRC,OAAO,MAAM,EACbC,WAAW,QAAQ,EACnBC,UAAU,KAAK,EAEG,WADfC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,cAAcpB,qCAElBQ,cAAc,CAACS,SAAS,EACxBD,SAAS,UAAUZ,UAAU,CAACY,KAAK;IAGrC,MAAMK,4BACJ,MAACvB,MAAMwB,QAAQ;;YACZrB,aAAaY,yBAAW,KAACU;gBAAKC,SAAS;0BAAkBX;;0BAC1D,MAACY;gBAAID,SAAS;;kCACZ,KAACrB;wBAAUqB,SAAS;wBAAkBE,QAAQV,SAAS,SAAS,MAAMW;kCACnEZ;;oBAEFG,yBAAW,KAACnB;;;YAEdE,aAAaa,wBAAU,KAACS;gBAAKC,SAAS;0BAAiBV;;;;IAI5D,qBACE,KAACZ,kDAAaiB;QAAWS,eAAeR;kBACrCC;;AAGP,EAAE"}

package/dist/components/ModalCard/ModalCard.d.ts

@@ -1,6 +1,6 @@
 import type { ModalCardProps } from './types';
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalCard
+ * @see https://vkui.io/components/modal-card
  */
 export declare const ModalCard: ({ id: idProp, nav, open, modalOverlayTestId, noFocusToDialog, onOpen, onOpened, onClose, onClosed, keepMounted, ...restProps }: ModalCardProps) => React.ReactNode;
 //# sourceMappingURL=ModalCard.d.ts.map

package/dist/components/ModalCard/ModalCard.js

@@ -6,7 +6,7 @@ import { ModalContext } from "../../context/ModalContext.js";
 import { useModalManager } from "../ModalRoot/useModalManager.js";
 import { ModalCardInternal } from "./ModalCardInternal.js";
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalCard
+ * @see https://vkui.io/components/modal-card
  */ export const ModalCard = (_param)=>{
     var { id: idProp, nav, open = false, modalOverlayTestId, noFocusToDialog, onOpen, onOpened, onClose, onClosed, keepMounted = false } = _param, restProps = _object_without_properties(_param, [
         "id",

package/dist/components/ModalCard/ModalCard.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalCard/ModalCard.tsx"],"sourcesContent":["'use client';\n\nimport { ModalContext } from '../../context/ModalContext';\nimport { useModalManager } from '../ModalRoot/useModalManager';\nimport { ModalCardInternal } from './ModalCardInternal';\nimport type { ModalCardProps } from './types';\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCard\n */\nexport const ModalCard = ({\n  id: idProp,\n  nav,\n  open = false,\n  modalOverlayTestId,\n  noFocusToDialog,\n  onOpen,\n  onOpened,\n  onClose,\n  onClosed,\n  keepMounted = false,\n  ...restProps\n}: ModalCardProps): React.ReactNode => {\n  const {\n    mounted,\n    shouldPreserveSnapPoint: excludedProp,\n    id,\n    ...resolvedProps\n  } = useModalManager({\n    id: nav || idProp,\n    open,\n    keepMounted,\n    modalOverlayTestId,\n    noFocusToDialog,\n    onOpen,\n    onOpened,\n    onClose,\n    onClosed,\n  });\n\n  if (mounted === false) {\n    return null;\n  }\n\n  return (\n    <ModalContext.Provider value={id}>\n      <ModalCardInternal\n        id={id}\n        aria-labelledby={`${id}-label`}\n        titleId={`${id}-label`}\n        {...resolvedProps}\n        {...restProps}\n      />\n    </ModalContext.Provider>\n  );\n};\n"],"names":["ModalContext","useModalManager","ModalCardInternal","ModalCard","id","idProp","nav","open","modalOverlayTestId","noFocusToDialog","onOpen","onOpened","onClose","onClosed","keepMounted","restProps","mounted","shouldPreserveSnapPoint","excludedProp","resolvedProps","Provider","value","aria-labelledby","titleId"],"mappings":"AAAA;;;;AAEA,SAASA,YAAY,QAAQ,gCAA6B;AAC1D,SAASC,eAAe,QAAQ,kCAA+B;AAC/D,SAASC,iBAAiB,QAAQ,yBAAsB;AAGxD;;CAEC,GACD,OAAO,MAAMC,YAAY;QAAC,EACxBC,IAAIC,MAAM,EACVC,GAAG,EACHC,OAAO,KAAK,EACZC,kBAAkB,EAClBC,eAAe,EACfC,MAAM,EACNC,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACRC,cAAc,KAAK,EAEJ,WADZC;QAVHX;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAKIb,mBAAAA,gBAAgB;QAClBG,IAAIE,OAAOD;QACXE;QACAO;QACAN;QACAC;QACAC;QACAC;QACAC;QACAC;IACF,IAfM,EACJG,OAAO,EACPC,yBAAyBC,YAAY,EACrCd,EAAE,EAEH,GAAGH,kBADCkB,2CACDlB;QAJFe;QACAC;QACAb;;IAcF,IAAIY,YAAY,OAAO;QACrB,OAAO;IACT;IAEA,qBACE,KAAChB,aAAaoB,QAAQ;QAACC,OAAOjB;kBAC5B,cAAA,KAACF;YACCE,IAAIA;YACJkB,mBAAiB,GAAGlB,GAAG,MAAM,CAAC;YAC9BmB,SAAS,GAAGnB,GAAG,MAAM,CAAC;WAClBe,eACAJ;;AAIZ,EAAE"}
+{"version":3,"sources":["../../../src/components/ModalCard/ModalCard.tsx"],"sourcesContent":["'use client';\n\nimport { ModalContext } from '../../context/ModalContext';\nimport { useModalManager } from '../ModalRoot/useModalManager';\nimport { ModalCardInternal } from './ModalCardInternal';\nimport type { ModalCardProps } from './types';\n\n/**\n * @see https://vkui.io/components/modal-card\n */\nexport const ModalCard = ({\n  id: idProp,\n  nav,\n  open = false,\n  modalOverlayTestId,\n  noFocusToDialog,\n  onOpen,\n  onOpened,\n  onClose,\n  onClosed,\n  keepMounted = false,\n  ...restProps\n}: ModalCardProps): React.ReactNode => {\n  const {\n    mounted,\n    shouldPreserveSnapPoint: excludedProp,\n    id,\n    ...resolvedProps\n  } = useModalManager({\n    id: nav || idProp,\n    open,\n    keepMounted,\n    modalOverlayTestId,\n    noFocusToDialog,\n    onOpen,\n    onOpened,\n    onClose,\n    onClosed,\n  });\n\n  if (mounted === false) {\n    return null;\n  }\n\n  return (\n    <ModalContext.Provider value={id}>\n      <ModalCardInternal\n        id={id}\n        aria-labelledby={`${id}-label`}\n        titleId={`${id}-label`}\n        {...resolvedProps}\n        {...restProps}\n      />\n    </ModalContext.Provider>\n  );\n};\n"],"names":["ModalContext","useModalManager","ModalCardInternal","ModalCard","id","idProp","nav","open","modalOverlayTestId","noFocusToDialog","onOpen","onOpened","onClose","onClosed","keepMounted","restProps","mounted","shouldPreserveSnapPoint","excludedProp","resolvedProps","Provider","value","aria-labelledby","titleId"],"mappings":"AAAA;;;;AAEA,SAASA,YAAY,QAAQ,gCAA6B;AAC1D,SAASC,eAAe,QAAQ,kCAA+B;AAC/D,SAASC,iBAAiB,QAAQ,yBAAsB;AAGxD;;CAEC,GACD,OAAO,MAAMC,YAAY;QAAC,EACxBC,IAAIC,MAAM,EACVC,GAAG,EACHC,OAAO,KAAK,EACZC,kBAAkB,EAClBC,eAAe,EACfC,MAAM,EACNC,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACRC,cAAc,KAAK,EAEJ,WADZC;QAVHX;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAKIb,mBAAAA,gBAAgB;QAClBG,IAAIE,OAAOD;QACXE;QACAO;QACAN;QACAC;QACAC;QACAC;QACAC;QACAC;IACF,IAfM,EACJG,OAAO,EACPC,yBAAyBC,YAAY,EACrCd,EAAE,EAEH,GAAGH,kBADCkB,2CACDlB;QAJFe;QACAC;QACAb;;IAcF,IAAIY,YAAY,OAAO;QACrB,OAAO;IACT;IAEA,qBACE,KAAChB,aAAaoB,QAAQ;QAACC,OAAOjB;kBAC5B,cAAA,KAACF;YACCE,IAAIA;YACJkB,mBAAiB,GAAGlB,GAAG,MAAM,CAAC;YAC9BmB,SAAS,GAAGnB,GAAG,MAAM,CAAC;WAClBe,eACAJ;;AAIZ,EAAE"}

package/dist/components/ModalCardBase/ModalCardBase.d.ts

@@ -28,12 +28,12 @@ export interface ModalCardBaseProps extends Omit<HTMLAttributesWithRootRef<HTMLD
      */
     descriptionComponent?: React.ElementType;
     /**
-     * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:
+     * Кнопки-действия. Принимает [`Button`](https://vkui.io/components/button) с параметрами:
      *
      * - `size="l" mode="primary" stretched`
      * - `size="l" mode="secondary" stretched`.
      *
-     * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:
+     * Для набора кнопок используйте [`ButtonGroup`](https://vkui.io/components/button-group) с параметрами:
      *
      * - `gap="s" mode="horizontal" stretched`
      * - `gap="m" mode="vertical" stretched`.
@@ -80,7 +80,7 @@ export interface ModalCardBaseProps extends Omit<HTMLAttributesWithRootRef<HTMLD
     outsideButtons?: React.ReactNode;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalCardBase
+ * @see https://vkui.io/components/modal-card-base
  */
 export declare const ModalCardBase: ({ icon, title, titleComponent, description, descriptionComponent, children, actions, onClose, dismissLabel, size: sizeProp, modalDismissButtonTestId, dismissButtonMode, preventClose, outsideButtons, titleId, ...restProps }: ModalCardBaseProps) => React.ReactNode;
 //# sourceMappingURL=ModalCardBase.d.ts.map

package/dist/components/ModalCardBase/ModalCardBase.js

@@ -18,7 +18,7 @@ import { Subhead } from "../Typography/Subhead/Subhead.js";
 import { Title } from "../Typography/Title/Title.js";
 import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.js";
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalCardBase
+ * @see https://vkui.io/components/modal-card-base
  */ export const ModalCardBase = (_param)=>{
     var { icon, title, titleComponent = 'span', description, descriptionComponent = 'span', children, actions, onClose, dismissLabel = 'Закрыть', size: sizeProp, modalDismissButtonTestId, dismissButtonMode = 'outside', preventClose, outsideButtons, titleId } = _param, restProps = _object_without_properties(_param, [
         "icon",

package/dist/components/ModalCardBase/ModalCardBase.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalCardBase/ModalCardBase.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon20Cancel, Icon24Dismiss } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { AdaptivityContext } from '../AdaptivityProvider/AdaptivityContext';\nimport { ModalOutsideButton } from '../ModalOutsideButton/ModalOutsideButton';\nimport { ModalOutsideButtons } from '../ModalOutsideButtons/ModalOutsideButtons';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Spacing } from '../Spacing/Spacing';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Title } from '../Typography/Title/Title';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ModalCardBase.module.css';\n\nexport interface ModalCardBaseProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'title'> {\n  /**\n   * Иконка.\n   *\n   * Может быть компонентом иконки, например, `<Icon56MoneyTransferOutline />`, или `<Avatar size={72} src=\"\" />`.\n   */\n  icon?: React.ReactNode;\n\n  /**\n   * Заголовок карточки.\n   */\n  title?: React.ReactNode;\n  /**\n   * Позволяет поменять тег используемый для заголовка.\n   */\n  titleComponent?: React.ElementType;\n  /**\n   * Позволяет задать id для заголовка. Используется, чтобы связать модальное окно и title через aria-labelledby, тем самым задав модальному окну имя через title.\n   */\n  titleId?: string;\n\n  /**\n   * Описание.\n   */\n  description?: React.ReactNode;\n  /**\n   * Позволяет поменять тег используемый для описания.\n   */\n  descriptionComponent?: React.ElementType;\n\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:\n   *\n   * - `size=\"l\" mode=\"primary\" stretched`\n   * - `size=\"l\" mode=\"secondary\" stretched`.\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `gap=\"s\" mode=\"horizontal\" stretched`\n   * - `gap=\"m\" mode=\"vertical\" stretched`.\n   */\n  actions?: React.ReactNode;\n  /**\n   * Обработчик закрытия модального окна.\n   */\n  onClose?: VoidFunction;\n\n  /**\n   * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий.\n   */\n  dismissLabel?: string;\n\n  /**\n   * Задаёт контенту максимальную ширину для десктопной версии.\n   */\n  size?: number;\n\n  /**\n   * Передает атрибут `data-testid` для кнопки закрытия.\n   */\n  modalDismissButtonTestId?: string;\n  /**\n   * Расположение кнопки закрытия (внутри и вне `popout'a`).\n   *\n   * Доступно только в `compact`-режиме.\n   *\n   * На `iOS` в `regular`-режиме всегда включен `inside`.\n   *\n   * ⚠️ ВНИМАНИЕ: использование `none` скрывает крестик, это негативно сказывается на пользовательском опыте.\n   */\n  dismissButtonMode?: 'inside' | 'outside' | 'none';\n  /**\n   * Позволяет отключить возможность закрытия модальной страницы (смахивание, клавиша `ESC`, нажатие на подложку).\n   *\n   * ⚠️ ВНИМАНИЕ: использование этой опции негативно сказывается на пользовательском опыте.\n   */\n  preventClose?: boolean;\n  /**\n   * Управляющие элементы под кнопкой закрытия.\n   *\n   * Доступно только в `compact`-режиме. Рекомендуется размещать иконки размера 20, обернутые в ModalOutsideButton.\n   *\n   */\n  outsideButtons?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCardBase\n */\nexport const ModalCardBase = ({\n  icon,\n  title,\n  titleComponent = 'span',\n  description,\n  descriptionComponent = 'span',\n  children,\n  actions,\n  onClose,\n  dismissLabel = 'Закрыть',\n  size: sizeProp,\n  modalDismissButtonTestId,\n  dismissButtonMode = 'outside',\n  preventClose,\n  outsideButtons,\n  titleId,\n  ...restProps\n}: ModalCardBaseProps): React.ReactNode => {\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  const size = isDesktop ? sizeProp : undefined;\n  const withSafeZone =\n    !icon &&\n    (dismissButtonMode === 'inside' ||\n      (platform === 'ios' && !isDesktop && dismissButtonMode !== 'none'));\n\n  const hasTitle = hasReactNode(title);\n  const hasDescription = hasReactNode(description);\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        'vkuiInternalModalCardBase',\n        platform === 'ios' && styles.ios,\n        isDesktop && styles.desktop,\n        withSafeZone && styles.withSafeZone,\n      )}\n      baseStyle={{\n        maxWidth: size,\n      }}\n    >\n      <div className={styles.container}>\n        {hasReactNode(icon) && <div className={styles.icon}>{icon}</div>}\n        {hasReactNode(title) && (\n          <Title\n            id={titleId}\n            level=\"2\"\n            weight=\"2\"\n            className={styles.title}\n            Component={titleComponent}\n          >\n            {title}\n          </Title>\n        )}\n        {hasTitle && hasDescription && <Spacing size={8} />}\n        {hasDescription && (\n          <AdaptivityContext.Provider value={{ sizeY: 'regular' }}>\n            <Subhead className={styles.description} Component={descriptionComponent}>\n              {description}\n            </Subhead>\n          </AdaptivityContext.Provider>\n        )}\n\n        {children}\n\n        {hasReactNode(actions) && <div className={styles.actions}>{actions}</div>}\n\n        {isDesktop && (dismissButtonMode === 'outside' || outsideButtons) && (\n          <ModalOutsideButtons>\n            {dismissButtonMode === 'outside' && (\n              <ModalOutsideButton\n                aria-label={dismissLabel}\n                data-testid={modalDismissButtonTestId}\n                onClick={onClose}\n              >\n                <Icon20Cancel />\n              </ModalOutsideButton>\n            )}\n            {outsideButtons}\n          </ModalOutsideButtons>\n        )}\n\n        {(dismissButtonMode === 'inside' ||\n          (platform === 'ios' && !isDesktop && dismissButtonMode !== 'none')) && (\n          <Tappable\n            className={styles.dismiss}\n            onClick={onClose}\n            hoverMode=\"opacity\"\n            activeMode=\"opacity\"\n            data-testid={modalDismissButtonTestId}\n          >\n            <VisuallyHidden>{dismissLabel}</VisuallyHidden>\n            {platform === 'ios' ? <Icon24Dismiss /> : <Icon20Cancel />}\n          </Tappable>\n        )}\n      </div>\n    </RootComponent>\n  );\n};\n"],"names":["React","Icon20Cancel","Icon24Dismiss","classNames","hasReactNode","useAdaptivityWithJSMediaQueries","usePlatform","AdaptivityContext","ModalOutsideButton","ModalOutsideButtons","RootComponent","Spacing","Tappable","Subhead","Title","VisuallyHidden","ModalCardBase","icon","title","titleComponent","description","descriptionComponent","children","actions","onClose","dismissLabel","size","sizeProp","modalDismissButtonTestId","dismissButtonMode","preventClose","outsideButtons","titleId","restProps","platform","isDesktop","undefined","withSafeZone","hasTitle","hasDescription","baseClassName","baseStyle","maxWidth","div","className","id","level","weight","Component","Provider","value","sizeY","aria-label","data-testid","onClick","hoverMode","activeMode"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,EAAEC,aAAa,QAAQ,mBAAmB;AAC/D,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,iBAAiB,QAAQ,6CAA0C;AAC5E,SAASC,kBAAkB,QAAQ,8CAA2C;AAC9E,SAASC,mBAAmB,QAAQ,gDAA6C;AACjF,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,OAAO,QAAQ,wBAAqB;AAC7C,SAASC,QAAQ,QAAQ,0BAAuB;AAChD,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,KAAK,QAAQ,+BAA4B;AAClD,SAASC,cAAc,QAAQ,sCAAmC;AA0FlE;;CAEC,GACD,OAAO,MAAMC,gBAAgB;QAAC,EAC5BC,IAAI,EACJC,KAAK,EACLC,iBAAiB,MAAM,EACvBC,WAAW,EACXC,uBAAuB,MAAM,EAC7BC,QAAQ,EACRC,OAAO,EACPC,OAAO,EACPC,eAAe,SAAS,EACxBC,MAAMC,QAAQ,EACdC,wBAAwB,EACxBC,oBAAoB,SAAS,EAC7BC,YAAY,EACZC,cAAc,EACdC,OAAO,EAEY,WADhBC;QAfHhB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,WAAW5B;IACjB,MAAM,EAAE6B,SAAS,EAAE,GAAG9B;IAEtB,MAAMqB,OAAOS,YAAYR,WAAWS;IACpC,MAAMC,eACJ,CAACpB,QACAY,CAAAA,sBAAsB,YACpBK,aAAa,SAAS,CAACC,aAAaN,sBAAsB,MAAM;IAErE,MAAMS,WAAWlC,aAAac;IAC9B,MAAMqB,iBAAiBnC,aAAagB;IACpC,qBACE,KAACV,uDACKuB;QACJO,eAAerC,WACb,6BACA+B,aAAa,mCACbC,2CACAE;QAEFI,WAAW;YACTC,UAAUhB;QACZ;kBAEA,cAAA,MAACiB;YAAIC,SAAS;;gBACXxC,aAAaa,uBAAS,KAAC0B;oBAAIC,SAAS;8BAAgB3B;;gBACpDb,aAAac,wBACZ,KAACJ;oBACC+B,IAAIb;oBACJc,OAAM;oBACNC,QAAO;oBACPH,SAAS;oBACTI,WAAW7B;8BAEVD;;gBAGJoB,YAAYC,gCAAkB,KAAC5B;oBAAQe,MAAM;;gBAC7Ca,gCACC,KAAChC,kBAAkB0C,QAAQ;oBAACC,OAAO;wBAAEC,OAAO;oBAAU;8BACpD,cAAA,KAACtC;wBAAQ+B,SAAS;wBAAsBI,WAAW3B;kCAChDD;;;gBAKNE;gBAEAlB,aAAamB,0BAAY,KAACoB;oBAAIC,SAAS;8BAAmBrB;;gBAE1DY,aAAcN,CAAAA,sBAAsB,aAAaE,cAAa,mBAC7D,MAACtB;;wBACEoB,sBAAsB,2BACrB,KAACrB;4BACC4C,cAAY3B;4BACZ4B,eAAazB;4BACb0B,SAAS9B;sCAET,cAAA,KAACvB;;wBAGJ8B;;;gBAIHF,CAAAA,sBAAsB,YACrBK,aAAa,SAAS,CAACC,aAAaN,sBAAsB,MAAM,mBACjE,MAACjB;oBACCgC,SAAS;oBACTU,SAAS9B;oBACT+B,WAAU;oBACVC,YAAW;oBACXH,eAAazB;;sCAEb,KAACb;sCAAgBU;;wBAChBS,aAAa,sBAAQ,KAAChC,mCAAmB,KAACD;;;;;;AAMvD,EAAE"}
+{"version":3,"sources":["../../../src/components/ModalCardBase/ModalCardBase.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon20Cancel, Icon24Dismiss } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { AdaptivityContext } from '../AdaptivityProvider/AdaptivityContext';\nimport { ModalOutsideButton } from '../ModalOutsideButton/ModalOutsideButton';\nimport { ModalOutsideButtons } from '../ModalOutsideButtons/ModalOutsideButtons';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Spacing } from '../Spacing/Spacing';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Title } from '../Typography/Title/Title';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ModalCardBase.module.css';\n\nexport interface ModalCardBaseProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'title'> {\n  /**\n   * Иконка.\n   *\n   * Может быть компонентом иконки, например, `<Icon56MoneyTransferOutline />`, или `<Avatar size={72} src=\"\" />`.\n   */\n  icon?: React.ReactNode;\n\n  /**\n   * Заголовок карточки.\n   */\n  title?: React.ReactNode;\n  /**\n   * Позволяет поменять тег используемый для заголовка.\n   */\n  titleComponent?: React.ElementType;\n  /**\n   * Позволяет задать id для заголовка. Используется, чтобы связать модальное окно и title через aria-labelledby, тем самым задав модальному окну имя через title.\n   */\n  titleId?: string;\n\n  /**\n   * Описание.\n   */\n  description?: React.ReactNode;\n  /**\n   * Позволяет поменять тег используемый для описания.\n   */\n  descriptionComponent?: React.ElementType;\n\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkui.io/components/button) с параметрами:\n   *\n   * - `size=\"l\" mode=\"primary\" stretched`\n   * - `size=\"l\" mode=\"secondary\" stretched`.\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkui.io/components/button-group) с параметрами:\n   *\n   * - `gap=\"s\" mode=\"horizontal\" stretched`\n   * - `gap=\"m\" mode=\"vertical\" stretched`.\n   */\n  actions?: React.ReactNode;\n  /**\n   * Обработчик закрытия модального окна.\n   */\n  onClose?: VoidFunction;\n\n  /**\n   * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий.\n   */\n  dismissLabel?: string;\n\n  /**\n   * Задаёт контенту максимальную ширину для десктопной версии.\n   */\n  size?: number;\n\n  /**\n   * Передает атрибут `data-testid` для кнопки закрытия.\n   */\n  modalDismissButtonTestId?: string;\n  /**\n   * Расположение кнопки закрытия (внутри и вне `popout'a`).\n   *\n   * Доступно только в `compact`-режиме.\n   *\n   * На `iOS` в `regular`-режиме всегда включен `inside`.\n   *\n   * ⚠️ ВНИМАНИЕ: использование `none` скрывает крестик, это негативно сказывается на пользовательском опыте.\n   */\n  dismissButtonMode?: 'inside' | 'outside' | 'none';\n  /**\n   * Позволяет отключить возможность закрытия модальной страницы (смахивание, клавиша `ESC`, нажатие на подложку).\n   *\n   * ⚠️ ВНИМАНИЕ: использование этой опции негативно сказывается на пользовательском опыте.\n   */\n  preventClose?: boolean;\n  /**\n   * Управляющие элементы под кнопкой закрытия.\n   *\n   * Доступно только в `compact`-режиме. Рекомендуется размещать иконки размера 20, обернутые в ModalOutsideButton.\n   *\n   */\n  outsideButtons?: React.ReactNode;\n}\n\n/**\n * @see https://vkui.io/components/modal-card-base\n */\nexport const ModalCardBase = ({\n  icon,\n  title,\n  titleComponent = 'span',\n  description,\n  descriptionComponent = 'span',\n  children,\n  actions,\n  onClose,\n  dismissLabel = 'Закрыть',\n  size: sizeProp,\n  modalDismissButtonTestId,\n  dismissButtonMode = 'outside',\n  preventClose,\n  outsideButtons,\n  titleId,\n  ...restProps\n}: ModalCardBaseProps): React.ReactNode => {\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  const size = isDesktop ? sizeProp : undefined;\n  const withSafeZone =\n    !icon &&\n    (dismissButtonMode === 'inside' ||\n      (platform === 'ios' && !isDesktop && dismissButtonMode !== 'none'));\n\n  const hasTitle = hasReactNode(title);\n  const hasDescription = hasReactNode(description);\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        'vkuiInternalModalCardBase',\n        platform === 'ios' && styles.ios,\n        isDesktop && styles.desktop,\n        withSafeZone && styles.withSafeZone,\n      )}\n      baseStyle={{\n        maxWidth: size,\n      }}\n    >\n      <div className={styles.container}>\n        {hasReactNode(icon) && <div className={styles.icon}>{icon}</div>}\n        {hasReactNode(title) && (\n          <Title\n            id={titleId}\n            level=\"2\"\n            weight=\"2\"\n            className={styles.title}\n            Component={titleComponent}\n          >\n            {title}\n          </Title>\n        )}\n        {hasTitle && hasDescription && <Spacing size={8} />}\n        {hasDescription && (\n          <AdaptivityContext.Provider value={{ sizeY: 'regular' }}>\n            <Subhead className={styles.description} Component={descriptionComponent}>\n              {description}\n            </Subhead>\n          </AdaptivityContext.Provider>\n        )}\n\n        {children}\n\n        {hasReactNode(actions) && <div className={styles.actions}>{actions}</div>}\n\n        {isDesktop && (dismissButtonMode === 'outside' || outsideButtons) && (\n          <ModalOutsideButtons>\n            {dismissButtonMode === 'outside' && (\n              <ModalOutsideButton\n                aria-label={dismissLabel}\n                data-testid={modalDismissButtonTestId}\n                onClick={onClose}\n              >\n                <Icon20Cancel />\n              </ModalOutsideButton>\n            )}\n            {outsideButtons}\n          </ModalOutsideButtons>\n        )}\n\n        {(dismissButtonMode === 'inside' ||\n          (platform === 'ios' && !isDesktop && dismissButtonMode !== 'none')) && (\n          <Tappable\n            className={styles.dismiss}\n            onClick={onClose}\n            hoverMode=\"opacity\"\n            activeMode=\"opacity\"\n            data-testid={modalDismissButtonTestId}\n          >\n            <VisuallyHidden>{dismissLabel}</VisuallyHidden>\n            {platform === 'ios' ? <Icon24Dismiss /> : <Icon20Cancel />}\n          </Tappable>\n        )}\n      </div>\n    </RootComponent>\n  );\n};\n"],"names":["React","Icon20Cancel","Icon24Dismiss","classNames","hasReactNode","useAdaptivityWithJSMediaQueries","usePlatform","AdaptivityContext","ModalOutsideButton","ModalOutsideButtons","RootComponent","Spacing","Tappable","Subhead","Title","VisuallyHidden","ModalCardBase","icon","title","titleComponent","description","descriptionComponent","children","actions","onClose","dismissLabel","size","sizeProp","modalDismissButtonTestId","dismissButtonMode","preventClose","outsideButtons","titleId","restProps","platform","isDesktop","undefined","withSafeZone","hasTitle","hasDescription","baseClassName","baseStyle","maxWidth","div","className","id","level","weight","Component","Provider","value","sizeY","aria-label","data-testid","onClick","hoverMode","activeMode"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,EAAEC,aAAa,QAAQ,mBAAmB;AAC/D,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,iBAAiB,QAAQ,6CAA0C;AAC5E,SAASC,kBAAkB,QAAQ,8CAA2C;AAC9E,SAASC,mBAAmB,QAAQ,gDAA6C;AACjF,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,OAAO,QAAQ,wBAAqB;AAC7C,SAASC,QAAQ,QAAQ,0BAAuB;AAChD,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,KAAK,QAAQ,+BAA4B;AAClD,SAASC,cAAc,QAAQ,sCAAmC;AA0FlE;;CAEC,GACD,OAAO,MAAMC,gBAAgB;QAAC,EAC5BC,IAAI,EACJC,KAAK,EACLC,iBAAiB,MAAM,EACvBC,WAAW,EACXC,uBAAuB,MAAM,EAC7BC,QAAQ,EACRC,OAAO,EACPC,OAAO,EACPC,eAAe,SAAS,EACxBC,MAAMC,QAAQ,EACdC,wBAAwB,EACxBC,oBAAoB,SAAS,EAC7BC,YAAY,EACZC,cAAc,EACdC,OAAO,EAEY,WADhBC;QAfHhB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,WAAW5B;IACjB,MAAM,EAAE6B,SAAS,EAAE,GAAG9B;IAEtB,MAAMqB,OAAOS,YAAYR,WAAWS;IACpC,MAAMC,eACJ,CAACpB,QACAY,CAAAA,sBAAsB,YACpBK,aAAa,SAAS,CAACC,aAAaN,sBAAsB,MAAM;IAErE,MAAMS,WAAWlC,aAAac;IAC9B,MAAMqB,iBAAiBnC,aAAagB;IACpC,qBACE,KAACV,uDACKuB;QACJO,eAAerC,WACb,6BACA+B,aAAa,mCACbC,2CACAE;QAEFI,WAAW;YACTC,UAAUhB;QACZ;kBAEA,cAAA,MAACiB;YAAIC,SAAS;;gBACXxC,aAAaa,uBAAS,KAAC0B;oBAAIC,SAAS;8BAAgB3B;;gBACpDb,aAAac,wBACZ,KAACJ;oBACC+B,IAAIb;oBACJc,OAAM;oBACNC,QAAO;oBACPH,SAAS;oBACTI,WAAW7B;8BAEVD;;gBAGJoB,YAAYC,gCAAkB,KAAC5B;oBAAQe,MAAM;;gBAC7Ca,gCACC,KAAChC,kBAAkB0C,QAAQ;oBAACC,OAAO;wBAAEC,OAAO;oBAAU;8BACpD,cAAA,KAACtC;wBAAQ+B,SAAS;wBAAsBI,WAAW3B;kCAChDD;;;gBAKNE;gBAEAlB,aAAamB,0BAAY,KAACoB;oBAAIC,SAAS;8BAAmBrB;;gBAE1DY,aAAcN,CAAAA,sBAAsB,aAAaE,cAAa,mBAC7D,MAACtB;;wBACEoB,sBAAsB,2BACrB,KAACrB;4BACC4C,cAAY3B;4BACZ4B,eAAazB;4BACb0B,SAAS9B;sCAET,cAAA,KAACvB;;wBAGJ8B;;;gBAIHF,CAAAA,sBAAsB,YACrBK,aAAa,SAAS,CAACC,aAAaN,sBAAsB,MAAM,mBACjE,MAACjB;oBACCgC,SAAS;oBACTU,SAAS9B;oBACT+B,WAAU;oBACVC,YAAW;oBACXH,eAAazB;;sCAEb,KAACb;sCAAgBU;;wBAChBS,aAAa,sBAAQ,KAAChC,mCAAmB,KAACD;;;;;;AAMvD,EAAE"}

package/dist/components/ModalDismissButton/ModalDismissButton.d.ts

@@ -7,7 +7,7 @@ export interface ModalDismissButtonProps extends Omit<ModalOutsideButtonProps, '
     children?: React.ReactNode;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalDismissButton
+ * @see https://vkui.io/components/modal-dismiss-button
  */
 export declare const ModalDismissButton: ({ children, className, ...restProps }: ModalDismissButtonProps) => React.ReactNode;
 //# sourceMappingURL=ModalDismissButton.d.ts.map

package/dist/components/ModalDismissButton/ModalDismissButton.js

@@ -8,7 +8,7 @@ import { classNames } from "@vkontakte/vkjs";
 import { ModalOutsideButton } from "../ModalOutsideButton/ModalOutsideButton.js";
 import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.js";
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalDismissButton
+ * @see https://vkui.io/components/modal-dismiss-button
  */ export const ModalDismissButton = (_param)=>{
     var { children = 'Закрыть', className } = _param, restProps = _object_without_properties(_param, [
         "children",

package/dist/components/ModalDismissButton/ModalDismissButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalDismissButton/ModalDismissButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport {\n  ModalOutsideButton,\n  type ModalOutsideButtonProps,\n} from '../ModalOutsideButton/ModalOutsideButton';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ModalDismissButton.module.css';\n\nexport interface ModalDismissButtonProps extends Omit<ModalOutsideButtonProps, 'children'> {\n  /**\n   * Содержимое кнопки.\n   */\n  children?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalDismissButton\n */\nexport const ModalDismissButton = ({\n  children = 'Закрыть',\n  className,\n  ...restProps\n}: ModalDismissButtonProps): React.ReactNode => {\n  return (\n    <ModalOutsideButton className={classNames(styles.host, className)} {...restProps}>\n      {children && <VisuallyHidden>{children}</VisuallyHidden>}\n      <Icon20Cancel />\n    </ModalOutsideButton>\n  );\n};\n"],"names":["React","Icon20Cancel","classNames","ModalOutsideButton","VisuallyHidden","ModalDismissButton","children","className","restProps"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,mBAAmB;AAChD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SACEC,kBAAkB,QAEb,8CAA2C;AAClD,SAASC,cAAc,QAAQ,sCAAmC;AAUlE;;CAEC,GACD,OAAO,MAAMC,qBAAqB;QAAC,EACjCC,WAAW,SAAS,EACpBC,SAAS,EAEe,WADrBC;QAFHF;QACAC;;IAGA,qBACE,MAACJ;QAAmBI,WAAWL,2CAAwBK;OAAgBC;;YACpEF,0BAAY,KAACF;0BAAgBE;;0BAC9B,KAACL;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/ModalDismissButton/ModalDismissButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport {\n  ModalOutsideButton,\n  type ModalOutsideButtonProps,\n} from '../ModalOutsideButton/ModalOutsideButton';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ModalDismissButton.module.css';\n\nexport interface ModalDismissButtonProps extends Omit<ModalOutsideButtonProps, 'children'> {\n  /**\n   * Содержимое кнопки.\n   */\n  children?: React.ReactNode;\n}\n\n/**\n * @see https://vkui.io/components/modal-dismiss-button\n */\nexport const ModalDismissButton = ({\n  children = 'Закрыть',\n  className,\n  ...restProps\n}: ModalDismissButtonProps): React.ReactNode => {\n  return (\n    <ModalOutsideButton className={classNames(styles.host, className)} {...restProps}>\n      {children && <VisuallyHidden>{children}</VisuallyHidden>}\n      <Icon20Cancel />\n    </ModalOutsideButton>\n  );\n};\n"],"names":["React","Icon20Cancel","classNames","ModalOutsideButton","VisuallyHidden","ModalDismissButton","children","className","restProps"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,mBAAmB;AAChD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SACEC,kBAAkB,QAEb,8CAA2C;AAClD,SAASC,cAAc,QAAQ,sCAAmC;AAUlE;;CAEC,GACD,OAAO,MAAMC,qBAAqB;QAAC,EACjCC,WAAW,SAAS,EACpBC,SAAS,EAEe,WADrBC;QAFHF;QACAC;;IAGA,qBACE,MAACJ;QAAmBI,WAAWL,2CAAwBK;OAAgBC;;YACpEF,0BAAY,KAACF;0BAAgBE;;0BAC9B,KAACL;;;AAGP,EAAE"}

package/dist/components/ModalOutsideButton/ModalOutsideButton.d.ts

@@ -11,7 +11,7 @@ export interface ModalOutsideButtonProps extends TappableOmitProps {
     'children': React.ReactNode;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalOutsideButton
+ * @see https://vkui.io/components/modal-outside-button
  */
 export declare const ModalOutsideButton: ({ children, "aria-label": ariaLabel, ...restProps }: ModalOutsideButtonProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ModalOutsideButton.d.ts.map

package/dist/components/ModalOutsideButton/ModalOutsideButton.js

@@ -7,7 +7,7 @@ import * as React from "react";
 import { Tappable } from "../Tappable/Tappable.js";
 import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.js";
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalOutsideButton
+ * @see https://vkui.io/components/modal-outside-button
  */ export const ModalOutsideButton = (_param)=>{
     var { children, 'aria-label': ariaLabel } = _param, restProps = _object_without_properties(_param, [
         "children",

package/dist/components/ModalOutsideButton/ModalOutsideButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalOutsideButton/ModalOutsideButton.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ModalOutsideButton.module.css';\n\nexport interface ModalOutsideButtonProps extends TappableOmitProps {\n  /**\n   * Текст для скринридера.\n   */\n  'aria-label'?: string;\n  /**\n   * Рекомендуется использовать иконки размером `20px`.\n   */\n  'children': React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalOutsideButton\n */\nexport const ModalOutsideButton = ({\n  children,\n  'aria-label': ariaLabel,\n  ...restProps\n}: ModalOutsideButtonProps) => {\n  return (\n    <Tappable\n      baseClassName={styles.host}\n      activeMode={styles.active}\n      hoverMode={styles.hover}\n      {...restProps}\n    >\n      {ariaLabel && <VisuallyHidden>{ariaLabel}</VisuallyHidden>}\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["React","Tappable","VisuallyHidden","ModalOutsideButton","children","ariaLabel","restProps","baseClassName","activeMode","hoverMode"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,cAAc,QAAQ,sCAAmC;AAclE;;CAEC,GACD,OAAO,MAAMC,qBAAqB;QAAC,EACjCC,QAAQ,EACR,cAAcC,SAAS,EAEC,WADrBC;QAFHF;QACA;;IAGA,qBACE,MAACH;QACCM,aAAa;QACbC,UAAU;QACVC,SAAS;OACLH;;YAEHD,2BAAa,KAACH;0BAAgBG;;YAC9BD;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/ModalOutsideButton/ModalOutsideButton.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ModalOutsideButton.module.css';\n\nexport interface ModalOutsideButtonProps extends TappableOmitProps {\n  /**\n   * Текст для скринридера.\n   */\n  'aria-label'?: string;\n  /**\n   * Рекомендуется использовать иконки размером `20px`.\n   */\n  'children': React.ReactNode;\n}\n\n/**\n * @see https://vkui.io/components/modal-outside-button\n */\nexport const ModalOutsideButton = ({\n  children,\n  'aria-label': ariaLabel,\n  ...restProps\n}: ModalOutsideButtonProps) => {\n  return (\n    <Tappable\n      baseClassName={styles.host}\n      activeMode={styles.active}\n      hoverMode={styles.hover}\n      {...restProps}\n    >\n      {ariaLabel && <VisuallyHidden>{ariaLabel}</VisuallyHidden>}\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["React","Tappable","VisuallyHidden","ModalOutsideButton","children","ariaLabel","restProps","baseClassName","activeMode","hoverMode"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,cAAc,QAAQ,sCAAmC;AAclE;;CAEC,GACD,OAAO,MAAMC,qBAAqB;QAAC,EACjCC,QAAQ,EACR,cAAcC,SAAS,EAEC,WADrBC;QAFHF;QACA;;IAGA,qBACE,MAACH;QACCM,aAAa;QACbC,UAAU;QACVC,SAAS;OACLH;;YAEHD,2BAAa,KAACH;0BAAgBG;;YAC9BD;;;AAGP,EAAE"}

package/dist/components/ModalPage/ModalPage.d.ts

@@ -1,6 +1,6 @@
 import type { ModalPageProps } from './types';
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalPage
+ * @see https://vkui.io/components/modal-page
  */
 export declare const ModalPage: ({ id: idProp, nav, open, modalOverlayTestId, noFocusToDialog, onOpen, onOpened, onClose, onClosed, size, settlingHeight, dynamicContentHeight, keepMounted, ...restProps }: ModalPageProps) => import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=ModalPage.d.ts.map

package/dist/components/ModalPage/ModalPage.js

@@ -10,7 +10,7 @@ import { useModalManager } from "../ModalRoot/useModalManager.js";
 import { ModalPageInternal } from "./ModalPageInternal.js";
 const snapPointCache = new Map();
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalPage
+ * @see https://vkui.io/components/modal-page
  */ export const ModalPage = (_param)=>{
     var { id: idProp, nav, open = false, modalOverlayTestId, noFocusToDialog, onOpen, onOpened, onClose, onClosed, size = 's', settlingHeight = 50, dynamicContentHeight, keepMounted = false } = _param, restProps = _object_without_properties(_param, [
         "id",

package/dist/components/ModalPage/ModalPage.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalPage/ModalPage.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\nimport { ModalContext } from '../../context/ModalContext';\nimport { inRange } from '../../helpers/range';\nimport { SNAP_POINT_DETENTS, SNAP_POINT_SAFE_RANGE, type SnapPoint } from '../../lib/sheet';\nimport { useModalManager } from '../ModalRoot/useModalManager';\nimport { ModalPageInternal } from './ModalPageInternal';\nimport type { ModalPageProps } from './types';\n\nconst snapPointCache = new Map<string, Exclude<SnapPoint, 'auto'>>();\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPage\n */\nexport const ModalPage = ({\n  id: idProp,\n  nav,\n  open = false,\n  modalOverlayTestId,\n  noFocusToDialog,\n  onOpen,\n  onOpened,\n  onClose,\n  onClosed,\n  size = 's',\n  settlingHeight = 50,\n  dynamicContentHeight,\n  keepMounted = false,\n  ...restProps\n}: ModalPageProps) => {\n  const { mounted, shouldPreserveSnapPoint, id, ...resolvedProps } = useModalManager({\n    id: nav || idProp,\n    open,\n    keepMounted,\n    modalOverlayTestId,\n    noFocusToDialog,\n    onOpen,\n    onOpened,\n    onClose,\n    onClosed,\n  });\n\n  const snapPoint = useMemo((): SnapPoint => {\n    if (dynamicContentHeight) {\n      return 'auto';\n    }\n\n    if (shouldPreserveSnapPoint) {\n      const snapPointCached = snapPointCache.get(id);\n\n      if (snapPointCached) {\n        return snapPointCached;\n      }\n\n      const nextSnapPoint = transformSettlingHeightToSnapPoint(settlingHeight);\n      snapPointCache.set(id, nextSnapPoint);\n\n      return nextSnapPoint;\n    } else {\n      snapPointCache.delete(id);\n    }\n\n    return transformSettlingHeightToSnapPoint(settlingHeight);\n  }, [id, shouldPreserveSnapPoint, dynamicContentHeight, settlingHeight]);\n\n  if (!mounted) {\n    return null;\n  }\n\n  return (\n    <ModalContext.Provider value={id}>\n      <ModalPageInternal\n        id={id}\n        size={size}\n        aria-labelledby={`${id}-label`}\n        snapPoint={snapPoint}\n        onSnapPointChange={\n          snapPoint !== 'auto' && shouldPreserveSnapPoint\n            ? (snapPoint) => {\n                const snapPointCached = snapPointCache.get(id);\n\n                if (snapPointCached) {\n                  snapPointCached.initial = snapPoint;\n                  snapPointCache.set(id, snapPointCached);\n                }\n              }\n            : undefined\n        }\n        {...resolvedProps}\n        {...restProps}\n      />\n    </ModalContext.Provider>\n  );\n};\n\nfunction transformSettlingHeightToSnapPoint(settlingHeight: number): Exclude<SnapPoint, 'auto'> {\n  const currentSnapPoint = Math.min(\n    Math.max(settlingHeight, SNAP_POINT_SAFE_RANGE.LOWER),\n    SNAP_POINT_DETENTS.LARGE,\n  );\n\n  return {\n    initial: currentSnapPoint,\n    detents: inRange(currentSnapPoint, SNAP_POINT_SAFE_RANGE.LOWER, SNAP_POINT_SAFE_RANGE.HIGHEST)\n      ? [SNAP_POINT_DETENTS.MIN, currentSnapPoint, SNAP_POINT_DETENTS.LARGE]\n      : [SNAP_POINT_DETENTS.MIN, currentSnapPoint],\n  };\n}\n"],"names":["useMemo","ModalContext","inRange","SNAP_POINT_DETENTS","SNAP_POINT_SAFE_RANGE","useModalManager","ModalPageInternal","snapPointCache","Map","ModalPage","id","idProp","nav","open","modalOverlayTestId","noFocusToDialog","onOpen","onOpened","onClose","onClosed","size","settlingHeight","dynamicContentHeight","keepMounted","restProps","mounted","shouldPreserveSnapPoint","resolvedProps","snapPoint","snapPointCached","get","nextSnapPoint","transformSettlingHeightToSnapPoint","set","delete","Provider","value","aria-labelledby","onSnapPointChange","initial","undefined","currentSnapPoint","Math","min","max","LOWER","LARGE","detents","HIGHEST","MIN"],"mappings":"AAAA;;;;AAEA,SAASA,OAAO,QAAQ,QAAQ;AAChC,SAASC,YAAY,QAAQ,gCAA6B;AAC1D,SAASC,OAAO,QAAQ,yBAAsB;AAC9C,SAASC,kBAAkB,EAAEC,qBAAqB,QAAwB,2BAAkB;AAC5F,SAASC,eAAe,QAAQ,kCAA+B;AAC/D,SAASC,iBAAiB,QAAQ,yBAAsB;AAGxD,MAAMC,iBAAiB,IAAIC;AAE3B;;CAEC,GACD,OAAO,MAAMC,YAAY;QAAC,EACxBC,IAAIC,MAAM,EACVC,GAAG,EACHC,OAAO,KAAK,EACZC,kBAAkB,EAClBC,eAAe,EACfC,MAAM,EACNC,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACRC,OAAO,GAAG,EACVC,iBAAiB,EAAE,EACnBC,oBAAoB,EACpBC,cAAc,KAAK,EAEJ,WADZC;QAbHd;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAmElB,mBAAAA,gBAAgB;QACjFK,IAAIE,OAAOD;QACXE;QACAU;QACAT;QACAC;QACAC;QACAC;QACAC;QACAC;IACF,IAVM,EAAEM,OAAO,EAAEC,uBAAuB,EAAEhB,EAAE,EAAoB,GAAGL,kBAAlBsB,2CAAkBtB;QAA3DoB;QAASC;QAAyBhB;;IAY1C,MAAMkB,YAAY5B,QAAQ;QACxB,IAAIsB,sBAAsB;YACxB,OAAO;QACT;QAEA,IAAII,yBAAyB;YAC3B,MAAMG,kBAAkBtB,eAAeuB,GAAG,CAACpB;YAE3C,IAAImB,iBAAiB;gBACnB,OAAOA;YACT;YAEA,MAAME,gBAAgBC,mCAAmCX;YACzDd,eAAe0B,GAAG,CAACvB,IAAIqB;YAEvB,OAAOA;QACT,OAAO;YACLxB,eAAe2B,MAAM,CAACxB;QACxB;QAEA,OAAOsB,mCAAmCX;IAC5C,GAAG;QAACX;QAAIgB;QAAyBJ;QAAsBD;KAAe;IAEtE,IAAI,CAACI,SAAS;QACZ,OAAO;IACT;IAEA,qBACE,KAACxB,aAAakC,QAAQ;QAACC,OAAO1B;kBAC5B,cAAA,KAACJ;YACCI,IAAIA;YACJU,MAAMA;YACNiB,mBAAiB,GAAG3B,GAAG,MAAM,CAAC;YAC9BkB,WAAWA;YACXU,mBACEV,cAAc,UAAUF,0BACpB,CAACE;gBACC,MAAMC,kBAAkBtB,eAAeuB,GAAG,CAACpB;gBAE3C,IAAImB,iBAAiB;oBACnBA,gBAAgBU,OAAO,GAAGX;oBAC1BrB,eAAe0B,GAAG,CAACvB,IAAImB;gBACzB;YACF,IACAW;WAEFb,eACAH;;AAIZ,EAAE;AAEF,SAASQ,mCAAmCX,cAAsB;IAChE,MAAMoB,mBAAmBC,KAAKC,GAAG,CAC/BD,KAAKE,GAAG,CAACvB,gBAAgBjB,sBAAsByC,KAAK,GACpD1C,mBAAmB2C,KAAK;IAG1B,OAAO;QACLP,SAASE;QACTM,SAAS7C,QAAQuC,kBAAkBrC,sBAAsByC,KAAK,EAAEzC,sBAAsB4C,OAAO,IACzF;YAAC7C,mBAAmB8C,GAAG;YAAER;YAAkBtC,mBAAmB2C,KAAK;SAAC,GACpE;YAAC3C,mBAAmB8C,GAAG;YAAER;SAAiB;IAChD;AACF"}
+{"version":3,"sources":["../../../src/components/ModalPage/ModalPage.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\nimport { ModalContext } from '../../context/ModalContext';\nimport { inRange } from '../../helpers/range';\nimport { SNAP_POINT_DETENTS, SNAP_POINT_SAFE_RANGE, type SnapPoint } from '../../lib/sheet';\nimport { useModalManager } from '../ModalRoot/useModalManager';\nimport { ModalPageInternal } from './ModalPageInternal';\nimport type { ModalPageProps } from './types';\n\nconst snapPointCache = new Map<string, Exclude<SnapPoint, 'auto'>>();\n\n/**\n * @see https://vkui.io/components/modal-page\n */\nexport const ModalPage = ({\n  id: idProp,\n  nav,\n  open = false,\n  modalOverlayTestId,\n  noFocusToDialog,\n  onOpen,\n  onOpened,\n  onClose,\n  onClosed,\n  size = 's',\n  settlingHeight = 50,\n  dynamicContentHeight,\n  keepMounted = false,\n  ...restProps\n}: ModalPageProps) => {\n  const { mounted, shouldPreserveSnapPoint, id, ...resolvedProps } = useModalManager({\n    id: nav || idProp,\n    open,\n    keepMounted,\n    modalOverlayTestId,\n    noFocusToDialog,\n    onOpen,\n    onOpened,\n    onClose,\n    onClosed,\n  });\n\n  const snapPoint = useMemo((): SnapPoint => {\n    if (dynamicContentHeight) {\n      return 'auto';\n    }\n\n    if (shouldPreserveSnapPoint) {\n      const snapPointCached = snapPointCache.get(id);\n\n      if (snapPointCached) {\n        return snapPointCached;\n      }\n\n      const nextSnapPoint = transformSettlingHeightToSnapPoint(settlingHeight);\n      snapPointCache.set(id, nextSnapPoint);\n\n      return nextSnapPoint;\n    } else {\n      snapPointCache.delete(id);\n    }\n\n    return transformSettlingHeightToSnapPoint(settlingHeight);\n  }, [id, shouldPreserveSnapPoint, dynamicContentHeight, settlingHeight]);\n\n  if (!mounted) {\n    return null;\n  }\n\n  return (\n    <ModalContext.Provider value={id}>\n      <ModalPageInternal\n        id={id}\n        size={size}\n        aria-labelledby={`${id}-label`}\n        snapPoint={snapPoint}\n        onSnapPointChange={\n          snapPoint !== 'auto' && shouldPreserveSnapPoint\n            ? (snapPoint) => {\n                const snapPointCached = snapPointCache.get(id);\n\n                if (snapPointCached) {\n                  snapPointCached.initial = snapPoint;\n                  snapPointCache.set(id, snapPointCached);\n                }\n              }\n            : undefined\n        }\n        {...resolvedProps}\n        {...restProps}\n      />\n    </ModalContext.Provider>\n  );\n};\n\nfunction transformSettlingHeightToSnapPoint(settlingHeight: number): Exclude<SnapPoint, 'auto'> {\n  const currentSnapPoint = Math.min(\n    Math.max(settlingHeight, SNAP_POINT_SAFE_RANGE.LOWER),\n    SNAP_POINT_DETENTS.LARGE,\n  );\n\n  return {\n    initial: currentSnapPoint,\n    detents: inRange(currentSnapPoint, SNAP_POINT_SAFE_RANGE.LOWER, SNAP_POINT_SAFE_RANGE.HIGHEST)\n      ? [SNAP_POINT_DETENTS.MIN, currentSnapPoint, SNAP_POINT_DETENTS.LARGE]\n      : [SNAP_POINT_DETENTS.MIN, currentSnapPoint],\n  };\n}\n"],"names":["useMemo","ModalContext","inRange","SNAP_POINT_DETENTS","SNAP_POINT_SAFE_RANGE","useModalManager","ModalPageInternal","snapPointCache","Map","ModalPage","id","idProp","nav","open","modalOverlayTestId","noFocusToDialog","onOpen","onOpened","onClose","onClosed","size","settlingHeight","dynamicContentHeight","keepMounted","restProps","mounted","shouldPreserveSnapPoint","resolvedProps","snapPoint","snapPointCached","get","nextSnapPoint","transformSettlingHeightToSnapPoint","set","delete","Provider","value","aria-labelledby","onSnapPointChange","initial","undefined","currentSnapPoint","Math","min","max","LOWER","LARGE","detents","HIGHEST","MIN"],"mappings":"AAAA;;;;AAEA,SAASA,OAAO,QAAQ,QAAQ;AAChC,SAASC,YAAY,QAAQ,gCAA6B;AAC1D,SAASC,OAAO,QAAQ,yBAAsB;AAC9C,SAASC,kBAAkB,EAAEC,qBAAqB,QAAwB,2BAAkB;AAC5F,SAASC,eAAe,QAAQ,kCAA+B;AAC/D,SAASC,iBAAiB,QAAQ,yBAAsB;AAGxD,MAAMC,iBAAiB,IAAIC;AAE3B;;CAEC,GACD,OAAO,MAAMC,YAAY;QAAC,EACxBC,IAAIC,MAAM,EACVC,GAAG,EACHC,OAAO,KAAK,EACZC,kBAAkB,EAClBC,eAAe,EACfC,MAAM,EACNC,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACRC,OAAO,GAAG,EACVC,iBAAiB,EAAE,EACnBC,oBAAoB,EACpBC,cAAc,KAAK,EAEJ,WADZC;QAbHd;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAmElB,mBAAAA,gBAAgB;QACjFK,IAAIE,OAAOD;QACXE;QACAU;QACAT;QACAC;QACAC;QACAC;QACAC;QACAC;IACF,IAVM,EAAEM,OAAO,EAAEC,uBAAuB,EAAEhB,EAAE,EAAoB,GAAGL,kBAAlBsB,2CAAkBtB;QAA3DoB;QAASC;QAAyBhB;;IAY1C,MAAMkB,YAAY5B,QAAQ;QACxB,IAAIsB,sBAAsB;YACxB,OAAO;QACT;QAEA,IAAII,yBAAyB;YAC3B,MAAMG,kBAAkBtB,eAAeuB,GAAG,CAACpB;YAE3C,IAAImB,iBAAiB;gBACnB,OAAOA;YACT;YAEA,MAAME,gBAAgBC,mCAAmCX;YACzDd,eAAe0B,GAAG,CAACvB,IAAIqB;YAEvB,OAAOA;QACT,OAAO;YACLxB,eAAe2B,MAAM,CAACxB;QACxB;QAEA,OAAOsB,mCAAmCX;IAC5C,GAAG;QAACX;QAAIgB;QAAyBJ;QAAsBD;KAAe;IAEtE,IAAI,CAACI,SAAS;QACZ,OAAO;IACT;IAEA,qBACE,KAACxB,aAAakC,QAAQ;QAACC,OAAO1B;kBAC5B,cAAA,KAACJ;YACCI,IAAIA;YACJU,MAAMA;YACNiB,mBAAiB,GAAG3B,GAAG,MAAM,CAAC;YAC9BkB,WAAWA;YACXU,mBACEV,cAAc,UAAUF,0BACpB,CAACE;gBACC,MAAMC,kBAAkBtB,eAAeuB,GAAG,CAACpB;gBAE3C,IAAImB,iBAAiB;oBACnBA,gBAAgBU,OAAO,GAAGX;oBAC1BrB,eAAe0B,GAAG,CAACvB,IAAImB;gBACzB;YACF,IACAW;WAEFb,eACAH;;AAIZ,EAAE;AAEF,SAASQ,mCAAmCX,cAAsB;IAChE,MAAMoB,mBAAmBC,KAAKC,GAAG,CAC/BD,KAAKE,GAAG,CAACvB,gBAAgBjB,sBAAsByC,KAAK,GACpD1C,mBAAmB2C,KAAK;IAG1B,OAAO;QACLP,SAASE;QACTM,SAAS7C,QAAQuC,kBAAkBrC,sBAAsByC,KAAK,EAAEzC,sBAAsB4C,OAAO,IACzF;YAAC7C,mBAAmB8C,GAAG;YAAER;YAAkBtC,mBAAmB2C,KAAK;SAAC,GACpE;YAAC3C,mBAAmB8C,GAAG;YAAER;SAAiB;IAChD;AACF"}

package/dist/components/ModalPageHeader/ModalPageHeader.d.ts

@@ -8,7 +8,7 @@ export interface ModalPageHeaderProps extends React.HTMLAttributes<HTMLDivElemen
     noSeparator?: boolean;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalPageHeader
+ * @see https://vkui.io/components/modal-page-header
  */
 export declare const ModalPageHeader: ({ children, noSeparator, getRootRef, className, typographyProps, ...restProps }: ModalPageHeaderProps) => React.ReactNode;
 //# sourceMappingURL=ModalPageHeader.d.ts.map

package/dist/components/ModalPageHeader/ModalPageHeader.js

@@ -11,7 +11,7 @@ import { usePlatform } from "../../hooks/usePlatform.js";
 import { PanelHeader } from "../PanelHeader/PanelHeader.js";
 import { Separator } from "../Separator/Separator.js";
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalPageHeader
+ * @see https://vkui.io/components/modal-page-header
  */ export const ModalPageHeader = (_param)=>{
     var { children, noSeparator = false, getRootRef, className, typographyProps } = _param, restProps = _object_without_properties(_param, [
         "children",

package/dist/components/ModalPageHeader/ModalPageHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useModalContext } from '../../context/ModalContext';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { HasRef, HasRootRef } from '../../types';\nimport { PanelHeader, type PanelHeaderProps } from '../PanelHeader/PanelHeader';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageHeader.module.css';\n\nexport interface ModalPageHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    Omit<PanelHeaderProps, 'fixed' | 'shadow' | 'delimiter'>,\n    HasRef<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Отключение разделителя.\n   */\n  noSeparator?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPageHeader\n */\nexport const ModalPageHeader = ({\n  children,\n  noSeparator = false,\n  getRootRef,\n  className,\n  typographyProps,\n  ...restProps\n}: ModalPageHeaderProps): React.ReactNode => {\n  const platform = usePlatform();\n  const { isDesktop, sizeX } = useAdaptivityWithJSMediaQueries();\n  const modalContext = useModalContext();\n\n  return (\n    <>\n      <div\n        className={classNames(\n          styles.host,\n          platform !== 'vkcom' && styles.hostWithGaps,\n          isDesktop && styles.hostDesktop,\n        )}\n        ref={getRootRef}\n      >\n        <PanelHeader\n          className={classNames('vkuiInternalModalPageHeader__in', className)}\n          typographyProps={{\n            Component: 'h2',\n            id: modalContext.labelId,\n            ...typographyProps,\n          }}\n          {...restProps}\n          fixed={false}\n          delimiter=\"none\"\n          transparent\n        >\n          {children}\n        </PanelHeader>\n      </div>\n      {!noSeparator && <Separator padding={sizeX !== 'regular'} />}\n    </>\n  );\n};\n"],"names":["React","classNames","useModalContext","useAdaptivityWithJSMediaQueries","usePlatform","PanelHeader","Separator","ModalPageHeader","children","noSeparator","getRootRef","className","typographyProps","restProps","platform","isDesktop","sizeX","modalContext","div","ref","Component","id","labelId","fixed","delimiter","transparent","padding"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,eAAe,QAAQ,gCAA6B;AAC7D,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,WAAW,QAA+B,gCAA6B;AAChF,SAASC,SAAS,QAAQ,4BAAyB;AAcnD;;CAEC,GACD,OAAO,MAAMC,kBAAkB;QAAC,EAC9BC,QAAQ,EACRC,cAAc,KAAK,EACnBC,UAAU,EACVC,SAAS,EACTC,eAAe,EAEM,WADlBC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,WAAWV;IACjB,MAAM,EAAEW,SAAS,EAAEC,KAAK,EAAE,GAAGb;IAC7B,MAAMc,eAAef;IAErB,qBACE;;0BACE,KAACgB;gBACCP,WAAWV,wCAETa,aAAa,gDACbC;gBAEFI,KAAKT;0BAEL,cAAA,KAACL;oBACCM,WAAWV,WAAW,mCAAmCU;oBACzDC,iBAAiB;wBACfQ,WAAW;wBACXC,IAAIJ,aAAaK,OAAO;uBACrBV;mBAEDC;oBACJU,OAAO;oBACPC,WAAU;oBACVC,WAAW;8BAEVjB;;;YAGJ,CAACC,6BAAe,KAACH;gBAAUoB,SAASV,UAAU;;;;AAGrD,EAAE"}
+{"version":3,"sources":["../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useModalContext } from '../../context/ModalContext';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { HasRef, HasRootRef } from '../../types';\nimport { PanelHeader, type PanelHeaderProps } from '../PanelHeader/PanelHeader';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageHeader.module.css';\n\nexport interface ModalPageHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    Omit<PanelHeaderProps, 'fixed' | 'shadow' | 'delimiter'>,\n    HasRef<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Отключение разделителя.\n   */\n  noSeparator?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/modal-page-header\n */\nexport const ModalPageHeader = ({\n  children,\n  noSeparator = false,\n  getRootRef,\n  className,\n  typographyProps,\n  ...restProps\n}: ModalPageHeaderProps): React.ReactNode => {\n  const platform = usePlatform();\n  const { isDesktop, sizeX } = useAdaptivityWithJSMediaQueries();\n  const modalContext = useModalContext();\n\n  return (\n    <>\n      <div\n        className={classNames(\n          styles.host,\n          platform !== 'vkcom' && styles.hostWithGaps,\n          isDesktop && styles.hostDesktop,\n        )}\n        ref={getRootRef}\n      >\n        <PanelHeader\n          className={classNames('vkuiInternalModalPageHeader__in', className)}\n          typographyProps={{\n            Component: 'h2',\n            id: modalContext.labelId,\n            ...typographyProps,\n          }}\n          {...restProps}\n          fixed={false}\n          delimiter=\"none\"\n          transparent\n        >\n          {children}\n        </PanelHeader>\n      </div>\n      {!noSeparator && <Separator padding={sizeX !== 'regular'} />}\n    </>\n  );\n};\n"],"names":["React","classNames","useModalContext","useAdaptivityWithJSMediaQueries","usePlatform","PanelHeader","Separator","ModalPageHeader","children","noSeparator","getRootRef","className","typographyProps","restProps","platform","isDesktop","sizeX","modalContext","div","ref","Component","id","labelId","fixed","delimiter","transparent","padding"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,eAAe,QAAQ,gCAA6B;AAC7D,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,WAAW,QAA+B,gCAA6B;AAChF,SAASC,SAAS,QAAQ,4BAAyB;AAcnD;;CAEC,GACD,OAAO,MAAMC,kBAAkB;QAAC,EAC9BC,QAAQ,EACRC,cAAc,KAAK,EACnBC,UAAU,EACVC,SAAS,EACTC,eAAe,EAEM,WADlBC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,WAAWV;IACjB,MAAM,EAAEW,SAAS,EAAEC,KAAK,EAAE,GAAGb;IAC7B,MAAMc,eAAef;IAErB,qBACE;;0BACE,KAACgB;gBACCP,WAAWV,wCAETa,aAAa,gDACbC;gBAEFI,KAAKT;0BAEL,cAAA,KAACL;oBACCM,WAAWV,WAAW,mCAAmCU;oBACzDC,iBAAiB;wBACfQ,WAAW;wBACXC,IAAIJ,aAAaK,OAAO;uBACrBV;mBAEDC;oBACJU,OAAO;oBACPC,WAAU;oBACVC,WAAW;8BAEVjB;;;YAGJ,CAACC,6BAAe,KAACH;gBAAUoB,SAASV,UAAU;;;;AAGrD,EAAE"}

package/dist/components/ModalRoot/ModalRoot.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import type { ModalRootProps } from './types';
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalRoot
+ * @see https://vkui.io/components/modal-root
  */
 export declare const ModalRoot: ({ activeModal, children, modalOverlayTestId, noFocusToDialog, usePortal, onOpen, onOpened, onClose, onClosed, }: ModalRootProps) => React.ReactNode;
 //# sourceMappingURL=ModalRoot.d.ts.map

package/dist/components/ModalRoot/ModalRoot.js

@@ -8,7 +8,7 @@ import { ModalOverlay } from "../ModalOverlay/ModalOverlay.js";
 import { ModalRootContext, ModalRootOverlayContext } from "./ModalRootContext.js";
 const warn = warnOnce('ModalRoot');
 /**
- * @see https://vkcom.github.io/VKUI/#/ModalRoot
+ * @see https://vkui.io/components/modal-root
  */ export const ModalRoot = ({ activeModal, children, modalOverlayTestId, noFocusToDialog, usePortal, onOpen, onOpened, onClose, onClosed })=>{
     const contextValue = React.useMemo(()=>({
             isInsideModal: true,

package/dist/components/ModalRoot/ModalRoot.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalRoot/ModalRoot.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { ModalOverlay } from '../ModalOverlay/ModalOverlay';\nimport { ModalRootContext, ModalRootOverlayContext } from './ModalRootContext';\nimport type { ModalRootProps } from './types';\n\nconst warn = warnOnce('ModalRoot');\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalRoot\n */\nexport const ModalRoot = ({\n  activeModal,\n  children,\n  modalOverlayTestId,\n  noFocusToDialog,\n  usePortal,\n  onOpen,\n  onOpened,\n  onClose,\n  onClosed,\n}: ModalRootProps): React.ReactNode => {\n  const contextValue = React.useMemo(\n    () => ({\n      isInsideModal: true,\n\n      // base props\n      activeModal,\n      modalOverlayTestId,\n      noFocusToDialog,\n\n      // callbacks\n      onOpen,\n      onOpened,\n      onClose,\n      onClosed,\n\n      // TODO [>=8] Удалить метод\n      updateModalHeight:\n        /* istanbul ignore next: deprecated */\n        process.env.NODE_ENV === 'development'\n          ? () => {\n              warn('Метод updateModalHeight() устарел и будет удалён в VKUI v8');\n            }\n          : noop,\n\n      // TODO [>=8] Удалить метод\n      registerModal:\n        /* istanbul ignore next: deprecated */\n        process.env.NODE_ENV === 'development'\n          ? () => {\n              warn('Метод registerModal() устарел и будет удалён в VKUI v8');\n            }\n          : noop,\n    }),\n    [activeModal, modalOverlayTestId, noFocusToDialog, onClose, onClosed, onOpen, onOpened],\n  );\n  const modalOverlayRef = React.useRef<HTMLDivElement>(null);\n  return (\n    <AppRootPortal usePortal={usePortal}>\n      <ModalRootContext.Provider value={contextValue}>\n        <ModalRootOverlayContext.Provider value={modalOverlayRef}>\n          <ModalOverlay\n            position=\"fixed\"\n            visible={typeof activeModal === 'string'}\n            getRootRef={modalOverlayRef}\n          />\n          {children}\n        </ModalRootOverlayContext.Provider>\n      </ModalRootContext.Provider>\n    </AppRootPortal>\n  );\n};\n"],"names":["React","noop","warnOnce","AppRootPortal","ModalOverlay","ModalRootContext","ModalRootOverlayContext","warn","ModalRoot","activeModal","children","modalOverlayTestId","noFocusToDialog","usePortal","onOpen","onOpened","onClose","onClosed","contextValue","useMemo","isInsideModal","updateModalHeight","process","env","NODE_ENV","registerModal","modalOverlayRef","useRef","Provider","value","position","visible","getRootRef"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,QAAQ,QAAQ,wBAAqB;AAC9C,SAASC,aAAa,QAAQ,8BAA2B;AACzD,SAASC,YAAY,QAAQ,kCAA+B;AAC5D,SAASC,gBAAgB,EAAEC,uBAAuB,QAAQ,wBAAqB;AAG/E,MAAMC,OAAOL,SAAS;AACtB;;CAEC,GACD,OAAO,MAAMM,YAAY,CAAC,EACxBC,WAAW,EACXC,QAAQ,EACRC,kBAAkB,EAClBC,eAAe,EACfC,SAAS,EACTC,MAAM,EACNC,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACO;IACf,MAAMC,eAAelB,MAAMmB,OAAO,CAChC,IAAO,CAAA;YACLC,eAAe;YAEf,aAAa;YACbX;YACAE;YACAC;YAEA,YAAY;YACZE;YACAC;YACAC;YACAC;YAEA,2BAA2B;YAC3BI,mBACE,oCAAoC,GACpCC,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBACrB;gBACEjB,KAAK;YACP,IACAN;YAEN,2BAA2B;YAC3BwB,eACE,oCAAoC,GACpCH,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBACrB;gBACEjB,KAAK;YACP,IACAN;QACR,CAAA,GACA;QAACQ;QAAaE;QAAoBC;QAAiBI;QAASC;QAAUH;QAAQC;KAAS;IAEzF,MAAMW,kBAAkB1B,MAAM2B,MAAM,CAAiB;IACrD,qBACE,KAACxB;QAAcU,WAAWA;kBACxB,cAAA,KAACR,iBAAiBuB,QAAQ;YAACC,OAAOX;sBAChC,cAAA,MAACZ,wBAAwBsB,QAAQ;gBAACC,OAAOH;;kCACvC,KAACtB;wBACC0B,UAAS;wBACTC,SAAS,OAAOtB,gBAAgB;wBAChCuB,YAAYN;;oBAEbhB;;;;;AAKX,EAAE"}
+{"version":3,"sources":["../../../src/components/ModalRoot/ModalRoot.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { ModalOverlay } from '../ModalOverlay/ModalOverlay';\nimport { ModalRootContext, ModalRootOverlayContext } from './ModalRootContext';\nimport type { ModalRootProps } from './types';\n\nconst warn = warnOnce('ModalRoot');\n/**\n * @see https://vkui.io/components/modal-root\n */\nexport const ModalRoot = ({\n  activeModal,\n  children,\n  modalOverlayTestId,\n  noFocusToDialog,\n  usePortal,\n  onOpen,\n  onOpened,\n  onClose,\n  onClosed,\n}: ModalRootProps): React.ReactNode => {\n  const contextValue = React.useMemo(\n    () => ({\n      isInsideModal: true,\n\n      // base props\n      activeModal,\n      modalOverlayTestId,\n      noFocusToDialog,\n\n      // callbacks\n      onOpen,\n      onOpened,\n      onClose,\n      onClosed,\n\n      // TODO [>=8] Удалить метод\n      updateModalHeight:\n        /* istanbul ignore next: deprecated */\n        process.env.NODE_ENV === 'development'\n          ? () => {\n              warn('Метод updateModalHeight() устарел и будет удалён в VKUI v8');\n            }\n          : noop,\n\n      // TODO [>=8] Удалить метод\n      registerModal:\n        /* istanbul ignore next: deprecated */\n        process.env.NODE_ENV === 'development'\n          ? () => {\n              warn('Метод registerModal() устарел и будет удалён в VKUI v8');\n            }\n          : noop,\n    }),\n    [activeModal, modalOverlayTestId, noFocusToDialog, onClose, onClosed, onOpen, onOpened],\n  );\n  const modalOverlayRef = React.useRef<HTMLDivElement>(null);\n  return (\n    <AppRootPortal usePortal={usePortal}>\n      <ModalRootContext.Provider value={contextValue}>\n        <ModalRootOverlayContext.Provider value={modalOverlayRef}>\n          <ModalOverlay\n            position=\"fixed\"\n            visible={typeof activeModal === 'string'}\n            getRootRef={modalOverlayRef}\n          />\n          {children}\n        </ModalRootOverlayContext.Provider>\n      </ModalRootContext.Provider>\n    </AppRootPortal>\n  );\n};\n"],"names":["React","noop","warnOnce","AppRootPortal","ModalOverlay","ModalRootContext","ModalRootOverlayContext","warn","ModalRoot","activeModal","children","modalOverlayTestId","noFocusToDialog","usePortal","onOpen","onOpened","onClose","onClosed","contextValue","useMemo","isInsideModal","updateModalHeight","process","env","NODE_ENV","registerModal","modalOverlayRef","useRef","Provider","value","position","visible","getRootRef"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,QAAQ,QAAQ,wBAAqB;AAC9C,SAASC,aAAa,QAAQ,8BAA2B;AACzD,SAASC,YAAY,QAAQ,kCAA+B;AAC5D,SAASC,gBAAgB,EAAEC,uBAAuB,QAAQ,wBAAqB;AAG/E,MAAMC,OAAOL,SAAS;AACtB;;CAEC,GACD,OAAO,MAAMM,YAAY,CAAC,EACxBC,WAAW,EACXC,QAAQ,EACRC,kBAAkB,EAClBC,eAAe,EACfC,SAAS,EACTC,MAAM,EACNC,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACO;IACf,MAAMC,eAAelB,MAAMmB,OAAO,CAChC,IAAO,CAAA;YACLC,eAAe;YAEf,aAAa;YACbX;YACAE;YACAC;YAEA,YAAY;YACZE;YACAC;YACAC;YACAC;YAEA,2BAA2B;YAC3BI,mBACE,oCAAoC,GACpCC,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBACrB;gBACEjB,KAAK;YACP,IACAN;YAEN,2BAA2B;YAC3BwB,eACE,oCAAoC,GACpCH,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBACrB;gBACEjB,KAAK;YACP,IACAN;QACR,CAAA,GACA;QAACQ;QAAaE;QAAoBC;QAAiBI;QAASC;QAAUH;QAAQC;KAAS;IAEzF,MAAMW,kBAAkB1B,MAAM2B,MAAM,CAAiB;IACrD,qBACE,KAACxB;QAAcU,WAAWA;kBACxB,cAAA,KAACR,iBAAiBuB,QAAQ;YAACC,OAAOX;sBAChC,cAAA,MAACZ,wBAAwBsB,QAAQ;gBAACC,OAAOH;;kCACvC,KAACtB;wBACC0B,UAAS;wBACTC,SAAS,OAAOtB,gBAAgB;wBAChCuB,YAAYN;;oBAEbhB;;;;;AAKX,EAAE"}

package/dist/components/NativeSelect/NativeSelect.d.ts

@@ -52,7 +52,7 @@ export interface NativeSelectProps extends Omit<React.SelectHTMLAttributes<HTMLS
     icon?: React.ReactNode;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/NativeSelect
+ * @see https://vkui.io/components/native-select
  */
 export declare const NativeSelect: ({ style, align, placeholder, children, className, getRef, getRootRef, disabled, multiline, selectType, status, icon, before, onChange, value, defaultValue, ...restProps }: NativeSelectProps) => React.ReactNode;
 //# sourceMappingURL=NativeSelect.d.ts.map

package/dist/components/NativeSelect/NativeSelect.js

@@ -26,7 +26,7 @@ export const NOT_SELECTED = {
  */ export const remapFromSelectValueToNativeValue = (value)=>value === NOT_SELECTED.CUSTOM ? NOT_SELECTED.NATIVE : value;
 export const remapFromNativeValueToSelectValue = (value)=>value === NOT_SELECTED.NATIVE ? NOT_SELECTED.CUSTOM : value;
 /**
- * @see https://vkcom.github.io/VKUI/#/NativeSelect
+ * @see https://vkui.io/components/native-select
  */ export const NativeSelect = (_param)=>{
     var { style, align, placeholder, children, className, getRef, getRootRef, disabled, multiline, selectType = 'default', status, icon = /*#__PURE__*/ _jsx(DropdownIcon, {}), before, onChange, value, defaultValue } = _param, restProps = _object_without_properties(_param, [
         "style",

package/dist/components/NativeSelect/NativeSelect.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["'use client';\n\nimport { type ChangeEvent, type ChangeEventHandler } from 'react';\nimport * 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 { getFormFieldModeFromSelectType } from '../../lib/select';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport type { SelectType } from '../Select/Select';\nimport { SelectTypography } from '../SelectTypography/SelectTypography';\nimport styles from '../Select/Select.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\nexport type SelectValue = Exclude<\n  React.SelectHTMLAttributes<HTMLSelectElement>['value'],\n  undefined\n> | null;\n\nexport type NativeSelectValue = Exclude<SelectValue, null>;\n\nexport const NOT_SELECTED = {\n  NATIVE: '__vkui_internal_Select_not_selected__',\n  CUSTOM: null,\n};\n\n/**\n * @visibleName NativeSelect\n */\nexport const remapFromSelectValueToNativeValue = (value: SelectValue): NativeSelectValue =>\n  value === NOT_SELECTED.CUSTOM ? NOT_SELECTED.NATIVE : value;\n\nexport const remapFromNativeValueToSelectValue = (value: NativeSelectValue): SelectValue =>\n  value === NOT_SELECTED.NATIVE ? NOT_SELECTED.CUSTOM : value;\n\nexport interface NativeSelectProps\n  extends Omit<\n      React.SelectHTMLAttributes<HTMLSelectElement>,\n      'multiple' | 'value' | 'defaultValue' | 'onChange'\n    >,\n    HasRef<HTMLSelectElement>,\n    HasRootRef<HTMLDivElement>,\n    HasAlign,\n    Pick<FormFieldProps, 'before' | 'status'> {\n  /**\n   * Выбранное значение.\n   *\n   * > ⚠️  Важно: При прокидывании `undefined` компонент будет считаться `Uncontrolled`.\n   * >\n   * > Не используйте `undefined`, чтобы показать невыбранное состояние. Вместо этого используйте `null`.\n   */\n  value?: SelectValue;\n  /**\n   * См. `value`.\n   */\n  defaultValue?: SelectValue;\n  /**\n   * Обработчик, срабатывающий при изменении выбранного значения.\n   * Вторым параметром прокидывается новое значение.\n   *\n   * > ⚠️ Лучше использовать второй параметр при работе с компонентом.\n   */\n  onChange?: (e: ChangeEvent<HTMLSelectElement>, newValue: SelectValue) => void;\n  /**\n   * Текст-подсказка при отсутствии выбранного значения.\n   */\n  placeholder?: string;\n  /**\n   * Флаг для включения многострочного режима.\n   */\n  multiline?: boolean;\n  /**\n   * Тип селекта, влияющий на отображение.\n   */\n  selectType?: SelectType;\n  /**\n   * Иконка раскрывающегося списка.\n   */\n  icon?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/NativeSelect\n */\nexport const NativeSelect = ({\n  style,\n  align,\n  placeholder,\n  children,\n  className,\n  getRef,\n  getRootRef,\n  disabled,\n  multiline,\n  selectType = 'default',\n  status,\n  icon = <DropdownIcon />,\n  before,\n  onChange,\n  value,\n  defaultValue,\n  ...restProps\n}: NativeSelectProps): React.ReactNode => {\n  const [title, setTitle] = React.useState('');\n  const [empty, setEmpty] = React.useState(false);\n  const selectRef = useExternRef(getRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const checkSelectedOption = () => {\n    const selectedOption = selectRef.current?.options[selectRef.current.selectedIndex];\n    if (selectedOption) {\n      setTitle(selectedOption.text);\n      setEmpty(selectedOption.value === NOT_SELECTED.NATIVE && placeholder != null);\n    }\n  };\n\n  const _onChange: ChangeEventHandler<HTMLSelectElement> = (e) => {\n    const newValue = remapFromNativeValueToSelectValue(e.target.value);\n    if (e.target.value === NOT_SELECTED.NATIVE) {\n      e.target.value = '';\n    }\n    if (e.currentTarget.value === NOT_SELECTED.NATIVE) {\n      e.currentTarget.value = '';\n    }\n    onChange?.(e, newValue);\n  };\n  useIsomorphicLayoutEffect(checkSelectedOption, [children]);\n\n  return (\n    <FormField\n      Component=\"div\"\n      className={classNames(\n        styles.host,\n        'vkuiInternalNativeSelect',\n        before && styles.hasBefore,\n        empty && styles.empty,\n        multiline && styles.multiline,\n        align === 'center' && styles.alignCenter,\n        align === 'right' && styles.alignRight,\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        className,\n      )}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={disabled}\n      before={before}\n      after={icon}\n      status={status}\n      mode={getFormFieldModeFromSelectType(selectType)}\n    >\n      <select\n        {...restProps}\n        value={value !== undefined ? remapFromSelectValueToNativeValue(value) : value}\n        defaultValue={\n          defaultValue !== undefined\n            ? remapFromSelectValueToNativeValue(defaultValue)\n            : defaultValue\n        }\n        disabled={disabled}\n        className={styles.el}\n        onChange={callMultiple(_onChange, checkSelectedOption)}\n        ref={selectRef}\n      >\n        {placeholder && <option value={NOT_SELECTED.NATIVE}>{placeholder}</option>}\n        {children}\n      </select>\n      <div className={styles.container} aria-hidden>\n        <SelectTypography className={styles.title} selectType={selectType}>\n          {title}\n        </SelectTypography>\n      </div>\n    </FormField>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useExternRef","callMultiple","getFormFieldModeFromSelectType","useIsomorphicLayoutEffect","DropdownIcon","FormField","SelectTypography","sizeYClassNames","none","compact","NOT_SELECTED","NATIVE","CUSTOM","remapFromSelectValueToNativeValue","value","remapFromNativeValueToSelectValue","NativeSelect","style","align","placeholder","children","className","getRef","getRootRef","disabled","multiline","selectType","status","icon","before","onChange","defaultValue","restProps","title","setTitle","useState","empty","setEmpty","selectRef","sizeY","checkSelectedOption","selectedOption","current","options","selectedIndex","text","_onChange","e","newValue","target","currentTarget","Component","after","mode","select","undefined","ref","option","div","aria-hidden"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["'use client';\n\nimport { type ChangeEvent, type ChangeEventHandler } from 'react';\nimport * 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 { getFormFieldModeFromSelectType } from '../../lib/select';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport type { SelectType } from '../Select/Select';\nimport { SelectTypography } from '../SelectTypography/SelectTypography';\nimport styles from '../Select/Select.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\nexport type SelectValue = Exclude<\n  React.SelectHTMLAttributes<HTMLSelectElement>['value'],\n  undefined\n> | null;\n\nexport type NativeSelectValue = Exclude<SelectValue, null>;\n\nexport const NOT_SELECTED = {\n  NATIVE: '__vkui_internal_Select_not_selected__',\n  CUSTOM: null,\n};\n\n/**\n * @visibleName NativeSelect\n */\nexport const remapFromSelectValueToNativeValue = (value: SelectValue): NativeSelectValue =>\n  value === NOT_SELECTED.CUSTOM ? NOT_SELECTED.NATIVE : value;\n\nexport const remapFromNativeValueToSelectValue = (value: NativeSelectValue): SelectValue =>\n  value === NOT_SELECTED.NATIVE ? NOT_SELECTED.CUSTOM : value;\n\nexport interface NativeSelectProps\n  extends Omit<\n      React.SelectHTMLAttributes<HTMLSelectElement>,\n      'multiple' | 'value' | 'defaultValue' | 'onChange'\n    >,\n    HasRef<HTMLSelectElement>,\n    HasRootRef<HTMLDivElement>,\n    HasAlign,\n    Pick<FormFieldProps, 'before' | 'status'> {\n  /**\n   * Выбранное значение.\n   *\n   * > ⚠️  Важно: При прокидывании `undefined` компонент будет считаться `Uncontrolled`.\n   * >\n   * > Не используйте `undefined`, чтобы показать невыбранное состояние. Вместо этого используйте `null`.\n   */\n  value?: SelectValue;\n  /**\n   * См. `value`.\n   */\n  defaultValue?: SelectValue;\n  /**\n   * Обработчик, срабатывающий при изменении выбранного значения.\n   * Вторым параметром прокидывается новое значение.\n   *\n   * > ⚠️ Лучше использовать второй параметр при работе с компонентом.\n   */\n  onChange?: (e: ChangeEvent<HTMLSelectElement>, newValue: SelectValue) => void;\n  /**\n   * Текст-подсказка при отсутствии выбранного значения.\n   */\n  placeholder?: string;\n  /**\n   * Флаг для включения многострочного режима.\n   */\n  multiline?: boolean;\n  /**\n   * Тип селекта, влияющий на отображение.\n   */\n  selectType?: SelectType;\n  /**\n   * Иконка раскрывающегося списка.\n   */\n  icon?: React.ReactNode;\n}\n\n/**\n * @see https://vkui.io/components/native-select\n */\nexport const NativeSelect = ({\n  style,\n  align,\n  placeholder,\n  children,\n  className,\n  getRef,\n  getRootRef,\n  disabled,\n  multiline,\n  selectType = 'default',\n  status,\n  icon = <DropdownIcon />,\n  before,\n  onChange,\n  value,\n  defaultValue,\n  ...restProps\n}: NativeSelectProps): React.ReactNode => {\n  const [title, setTitle] = React.useState('');\n  const [empty, setEmpty] = React.useState(false);\n  const selectRef = useExternRef(getRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const checkSelectedOption = () => {\n    const selectedOption = selectRef.current?.options[selectRef.current.selectedIndex];\n    if (selectedOption) {\n      setTitle(selectedOption.text);\n      setEmpty(selectedOption.value === NOT_SELECTED.NATIVE && placeholder != null);\n    }\n  };\n\n  const _onChange: ChangeEventHandler<HTMLSelectElement> = (e) => {\n    const newValue = remapFromNativeValueToSelectValue(e.target.value);\n    if (e.target.value === NOT_SELECTED.NATIVE) {\n      e.target.value = '';\n    }\n    if (e.currentTarget.value === NOT_SELECTED.NATIVE) {\n      e.currentTarget.value = '';\n    }\n    onChange?.(e, newValue);\n  };\n  useIsomorphicLayoutEffect(checkSelectedOption, [children]);\n\n  return (\n    <FormField\n      Component=\"div\"\n      className={classNames(\n        styles.host,\n        'vkuiInternalNativeSelect',\n        before && styles.hasBefore,\n        empty && styles.empty,\n        multiline && styles.multiline,\n        align === 'center' && styles.alignCenter,\n        align === 'right' && styles.alignRight,\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        className,\n      )}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={disabled}\n      before={before}\n      after={icon}\n      status={status}\n      mode={getFormFieldModeFromSelectType(selectType)}\n    >\n      <select\n        {...restProps}\n        value={value !== undefined ? remapFromSelectValueToNativeValue(value) : value}\n        defaultValue={\n          defaultValue !== undefined\n            ? remapFromSelectValueToNativeValue(defaultValue)\n            : defaultValue\n        }\n        disabled={disabled}\n        className={styles.el}\n        onChange={callMultiple(_onChange, checkSelectedOption)}\n        ref={selectRef}\n      >\n        {placeholder && <option value={NOT_SELECTED.NATIVE}>{placeholder}</option>}\n        {children}\n      </select>\n      <div className={styles.container} aria-hidden>\n        <SelectTypography className={styles.title} selectType={selectType}>\n          {title}\n        </SelectTypography>\n      </div>\n    </FormField>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useExternRef","callMultiple","getFormFieldModeFromSelectType","useIsomorphicLayoutEffect","DropdownIcon","FormField","SelectTypography","sizeYClassNames","none","compact","NOT_SELECTED","NATIVE","CUSTOM","remapFromSelectValueToNativeValue","value","remapFromNativeValueToSelectValue","NativeSelect","style","align","placeholder","children","className","getRef","getRootRef","disabled","multiline","selectType","status","icon","before","onChange","defaultValue","restProps","title","setTitle","useState","empty","setEmpty","selectRef","sizeY","checkSelectedOption","selectedOption","current","options","selectedIndex","text","_onChange","e","newValue","target","currentTarget","Component","after","mode","select","undefined","ref","option","div","aria-hidden"],"mappings":"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"}

package/dist/components/OnboardingTooltip/OnboardingTooltip.d.ts

@@ -30,7 +30,7 @@ export interface OnboardingTooltipProps extends AllowedFloatingComponentProps, A
     overlayLabel?: string;
 }
 /**
- * @see https://vkcom.github.io/VKUI/#/Tooltip
+ * @see https://vkui.io/components/onboarding-tooltip
  */
 export declare const OnboardingTooltip: ({ "id": idProp, children, "shown": shownProp, arrowPadding, arrowHeight, offsetByMainAxis, offsetByCrossAxis, arrowOffset, isStaticArrowOffset, onClose, "placement": placementProp, maxWidth, "style": styleProp, getRootRef, disableArrow, onPlacementChange, disableFlipMiddleware, overlayLabel, title, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, restoreFocus, disableFocusTrap, ...restProps }: OnboardingTooltipProps) => React.ReactNode;
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"OnboardingTooltip.d.ts","sourceRoot":"","sources":["../../../src/components/OnboardingTooltip/OnboardingTooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAGL,KAAK,sBAAsB,EAI5B,MAAM,oBAAoB,CAAC;AAG5B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGzE,OAAO,EAAkC,KAAK,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAOnG,KAAK,6BAA6B,GAAG,IAAI,CACvC,sBAAsB,EACpB,aAAa,GACb,cAAc,GACd,UAAU,GACV,WAAW,GACX,kBAAkB,GAClB,mBAAmB,GACnB,OAAO,GACP,UAAU,GACV,mBAAmB,GACnB,uBAAuB,GACvB,kBAAkB,CACrB,CAAC;AAEF,KAAK,uBAAuB,GAAG,IAAI,CACjC,gBAAgB,EAChB,YAAY,GAAG,gBAAgB,GAAG,kBAAkB,CACrD,CAAC;AAEF,KAAK,yBAAyB,GAAG;IAC/B;;OAEG;IACH,WAAW,CAAC,EAAE,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IAC3C;;OAEG;IACH,mBAAmB,CAAC,EAAE,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;CAC5D,CAAC;AAEF,MAAM,WAAW,sBACf,SAAQ,6BAA6B,EACnC,uBAAuB,EACvB,yBAAyB,EACzB,IAAI,CAAC,iBAAiB,EAAE,cAAc,CAAC;IACzC;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC/B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,eAAO,MAAM,iBAAiB,GAAI,wZAyB/B,sBAAsB,KAAG,KAAK,CAAC,SAyIjC,CAAC"}
+{"version":3,"file":"OnboardingTooltip.d.ts","sourceRoot":"","sources":["../../../src/components/OnboardingTooltip/OnboardingTooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAGL,KAAK,sBAAsB,EAI5B,MAAM,oBAAoB,CAAC;AAI5B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGzE,OAAO,EAAkC,KAAK,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAMnG,KAAK,6BAA6B,GAAG,IAAI,CACvC,sBAAsB,EACpB,aAAa,GACb,cAAc,GACd,UAAU,GACV,WAAW,GACX,kBAAkB,GAClB,mBAAmB,GACnB,OAAO,GACP,UAAU,GACV,mBAAmB,GACnB,uBAAuB,GACvB,kBAAkB,CACrB,CAAC;AAEF,KAAK,uBAAuB,GAAG,IAAI,CACjC,gBAAgB,EAChB,YAAY,GAAG,gBAAgB,GAAG,kBAAkB,CACrD,CAAC;AAEF,KAAK,yBAAyB,GAAG;IAC/B;;OAEG;IACH,WAAW,CAAC,EAAE,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IAC3C;;OAEG;IACH,mBAAmB,CAAC,EAAE,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;CAC5D,CAAC;AAEF,MAAM,WAAW,sBACf,SAAQ,6BAA6B,EACnC,uBAAuB,EACvB,yBAAyB,EACzB,IAAI,CAAC,iBAAiB,EAAE,cAAc,CAAC;IACzC;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC/B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,eAAO,MAAM,iBAAiB,GAAI,wZAyB/B,sBAAsB,KAAG,KAAK,CAAC,SAmIjC,CAAC"}

package/dist/components/OnboardingTooltip/OnboardingTooltip.js

@@ -10,16 +10,16 @@ import { useExternRef } from "../../hooks/useExternRef.js";
 import { usePatchChildren } from "../../hooks/usePatchChildren.js";
 import { createPortal } from "../../lib/createPortal.js";
 import { autoUpdateFloatingElement, convertFloatingDataToReactCSSProperties, useFloating, useFloatingMiddlewaresBootstrap, usePlacementChangeCallback } from "../../lib/floating/index.js";
+import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect.js";
 import { warnOnce } from "../../lib/warnOnce.js";
 import { DEFAULT_ARROW_HEIGHT, DEFAULT_ARROW_PADDING } from "../FloatingArrow/DefaultIcon.js";
 import { FocusTrap } from "../FocusTrap/FocusTrap.js";
 import { useNavTransition } from "../NavTransitionContext/NavTransitionContext.js";
 import { TOOLTIP_MAX_WIDTH, TooltipBase } from "../TooltipBase/TooltipBase.js";
 import { onboardingTooltipContainerAttr } from "./OnboardingTooltipContainer.js";
-import { useOnboardingTooltipContext } from "./OnboardingTooltipContext.js";
 const warn = warnOnce('OnboardingTooltip');
 /**
- * @see https://vkcom.github.io/VKUI/#/Tooltip
+ * @see https://vkui.io/components/onboarding-tooltip
  */ export const OnboardingTooltip = (_param)=>{
     var { 'id': idProp, children, 'shown': shownProp = true, arrowPadding = DEFAULT_ARROW_PADDING, arrowHeight = DEFAULT_ARROW_HEIGHT, offsetByMainAxis = 0, offsetByCrossAxis = 0, arrowOffset = 0, isStaticArrowOffset = false, onClose, 'placement': placementProp = 'bottom-start', maxWidth = TOOLTIP_MAX_WIDTH, 'style': styleProp, getRootRef, disableArrow = false, onPlacementChange, disableFlipMiddleware = false, overlayLabel = 'Закрыть', title, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, restoreFocus, disableFocusTrap } = _param, restProps = _object_without_properties(_param, [
         'id',
@@ -49,7 +49,6 @@ const warn = warnOnce('OnboardingTooltip');
     const generatedId = React.useId();
     const tooltipId = idProp || generatedId;
     const { entering } = useNavTransition();
-    const { containerRef: tooltipContainerRef } = useOnboardingTooltipContext();
     const [arrowRef, setArrowRef] = React.useState(null);
     const [tooltipContainer, setTooltipContainer] = React.useState(null);
     const [positionStrategy, setPositionStrategy] = React.useState('absolute');
@@ -118,22 +117,15 @@ const warn = warnOnce('OnboardingTooltip');
             ]
         }), tooltipContainer);
     }
-    React.useEffect(function initialize() {
+    useIsomorphicLayoutEffect(function initialize() {
         const referenceEl = childRef.current;
-        if (!referenceEl) {
-            return;
-        }
-        const tooltipContainer = tooltipContainerRef.current || // eslint-disable-next-line no-restricted-properties
-        referenceEl.closest(`[${onboardingTooltipContainerAttr}]`);
-        if (tooltipContainer) {
-            setTooltipContainer(tooltipContainer);
+        if (referenceEl) {
+            setTooltipContainer(referenceEl.closest(`[${onboardingTooltipContainerAttr}]`));
             setPositionStrategy(referenceEl.style.position === 'fixed' ? 'fixed' : 'absolute');
             refs.setReference(referenceEl);
         }
     }, [
-        childRef,
-        refs,
-        tooltipContainerRef
+        childRef
     ]);
     if (process.env.NODE_ENV === 'development') {
         const multiChildren = React.Children.count(children) > 1;