@vkontakte/vkui 8.0.2 → 8.1.0

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalCard/types.ts"],"sourcesContent":["import type { UIEvent } from 'react';\nimport type { NavIdProps } from '../../lib/getNavId';\nimport type { UseBottomSheetHandlers } from '../../lib/sheet';\nimport type { ModalCardBaseProps } from '../ModalCardBase/ModalCardBase';\n\nexport type ModalCardCloseReason =\n  | 'click-overlay'\n  | 'click-close-button'\n  | 'escape-key'\n  | 'swipe-down';\n\nexport interface ModalCardProps\n  extends NavIdProps,\n    Omit<ModalCardBaseProps, 'id' | 'onClose' | 'onTransitionEnd' | keyof UseBottomSheetHandlers> {\n  /**\n   * Состояние видимости.\n   *\n   * @default false\n   */\n  open?: boolean;\n  /**\n   * Сохранять ли компонент в DOM при `open={false}`.\n   *\n   * @default false\n   */\n  keepMounted?: boolean;\n  /**\n   * Отключает фокус на интерактивный элемент после открытия модалки.\n   *\n   * > Важно установить фокус после открытия в любое место модалки используя событие `onOpened`, иначе не будет работать закрытие по нажатию `Esc`.\n   */\n  noFocusToDialog?: boolean;\n  /**\n   * `data-testid` для оверлея.\n   */\n  modalOverlayTestId?: string;\n  /**\n   * Будет вызвано при начале открытия модалки.\n   */\n  onOpen?: VoidFunction;\n  /**\n   * Будет вызвано при окончательном открытии модалки.\n   */\n  onOpened?: VoidFunction;\n  /**\n   * Будет вызвано при начале закрытия модалки.\n   */\n  onClose?: (reason: ModalCardCloseReason, event?: UIEvent<HTMLElement>) => void;\n  /**\n   * Будет вызвано при окончательном закрытии модалки.\n   */\n  onClosed?: VoidFunction;\n  /**\n   * Позволяет отключить захват фокуса.\n   *\n   * Нужно использовать, когда поверх одной модалки открывается другая, чтобы два `FocusTrap` не конфликтовали.\n   */\n  disableFocusTrap?: boolean;\n  /**\n   * Отключает отображение и взаимодействие с фоном модалки.\n   */\n  disableModalOverlay?: boolean;\n  /**\n   * Отключает анимацию открытия модалки.\n   */\n  disableOpenAnimation?: boolean;\n  /**\n   * Отключает анимацию закрытия модалки.\n   */\n  disableCloseAnimation?: boolean;\n  /**\n   * Управление поведением возврата фокуса при закрытии всплывающего окна.\n   * @default true\n   */\n  restoreFocus?: boolean | (() => boolean | HTMLElement);\n}\n"],"names":[],"mappings":"AAWA,WAgEC"}
+{"version":3,"sources":["../../../../src/components/ModalCard/types.ts"],"sourcesContent":["import type { UIEvent } from 'react';\nimport type { NavIdProps } from '../../lib/getNavId';\nimport type { UseBottomSheetHandlers } from '../../lib/sheet';\nimport type { ModalCardBaseProps } from '../ModalCardBase/ModalCardBase';\n\nexport type ModalCardCloseReason =\n  | 'click-overlay'\n  | 'click-close-button'\n  | 'escape-key'\n  | 'swipe-down';\n\nexport interface ModalCardProps\n  extends NavIdProps,\n    Omit<ModalCardBaseProps, 'id' | 'onClose' | 'onTransitionEnd' | keyof UseBottomSheetHandlers> {\n  /**\n   * Состояние видимости.\n   *\n   * @default false\n   */\n  open?: boolean | undefined;\n  /**\n   * Сохранять ли компонент в DOM при `open={false}`.\n   *\n   * @default false\n   */\n  keepMounted?: boolean | undefined;\n  /**\n   * Отключает фокус на интерактивный элемент после открытия модалки.\n   *\n   * > Важно установить фокус после открытия в любое место модалки используя событие `onOpened`, иначе не будет работать закрытие по нажатию `Esc`.\n   */\n  noFocusToDialog?: boolean | undefined;\n  /**\n   * `data-testid` для оверлея.\n   */\n  modalOverlayTestId?: string | undefined;\n  /**\n   * Будет вызвано при начале открытия модалки.\n   */\n  onOpen?: VoidFunction | undefined;\n  /**\n   * Будет вызвано при окончательном открытии модалки.\n   */\n  onOpened?: VoidFunction | undefined;\n  /**\n   * Будет вызвано при начале закрытия модалки.\n   */\n  onClose?: ((reason: ModalCardCloseReason, event?: UIEvent<HTMLElement>) => void) | undefined;\n  /**\n   * Будет вызвано при окончательном закрытии модалки.\n   */\n  onClosed?: VoidFunction | undefined;\n  /**\n   * Позволяет отключить захват фокуса.\n   *\n   * Нужно использовать, когда поверх одной модалки открывается другая, чтобы два `FocusTrap` не конфликтовали.\n   */\n  disableFocusTrap?: boolean | undefined;\n  /**\n   * Отключает отображение и взаимодействие с фоном модалки.\n   */\n  disableModalOverlay?: boolean | undefined;\n  /**\n   * Отключает анимацию открытия модалки.\n   */\n  disableOpenAnimation?: boolean | undefined;\n  /**\n   * Отключает анимацию закрытия модалки.\n   */\n  disableCloseAnimation?: boolean | undefined;\n  /**\n   * Управление поведением возврата фокуса при закрытии всплывающего окна.\n   * @default true\n   */\n  restoreFocus?: boolean | (() => boolean | HTMLElement) | undefined;\n}\n"],"names":[],"mappings":"AAWA,WAgEC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalCardBase/ModalCardBase.tsx"],"sourcesContent":["'use client';\n\nimport type * 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={{ density: '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":["Icon20Cancel","Icon24Dismiss","classNames","hasReactNode","useAdaptivityWithJSMediaQueries","usePlatform","AdaptivityContext","ModalOutsideButton","ModalOutsideButtons","RootComponent","Spacing","Tappable","Subhead","Title","VisuallyHidden","styles","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","ios","desktop","baseStyle","maxWidth","div","className","container","id","level","weight","Component","Provider","value","density","aria-label","data-testid","onClick","dismiss","hoverMode","activeMode"],"mappings":"AAAA;;AAGA,SAASA,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;AAClE,OAAOC,YAAY,6BAA6B;AAyFhD;;CAEC,GACD,OAAO,MAAMC,gBAAgB,CAAC,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,EACP,GAAGC,WACgB;IACnB,MAAMC,WAAW7B;IACjB,MAAM,EAAE8B,SAAS,EAAE,GAAG/B;IAEtB,MAAMsB,OAAOS,YAAYR,WAAWS;IACpC,MAAMC,eACJ,CAACpB,QACAY,CAAAA,sBAAsB,YACpBK,aAAa,SAAS,CAACC,aAAaN,sBAAsB,MAAM;IAErE,MAAMS,WAAWnC,aAAae;IAC9B,MAAMqB,iBAAiBpC,aAAaiB;IACpC,qBACE,KAACX;QACE,GAAGwB,SAAS;QACbO,eAAetC,WACb,6BACAgC,aAAa,SAASnB,OAAO0B,GAAG,EAChCN,aAAapB,OAAO2B,OAAO,EAC3BL,gBAAgBtB,OAAOsB,YAAY;QAErCM,WAAW;YACTC,UAAUlB;QACZ;kBAEA,cAAA,MAACmB;YAAIC,WAAW/B,OAAOgC,SAAS;;gBAC7B5C,aAAac,uBAAS,KAAC4B;oBAAIC,WAAW/B,OAAOE,IAAI;8BAAGA;;gBACpDd,aAAae,wBACZ,KAACL;oBACCmC,IAAIhB;oBACJiB,OAAM;oBACNC,QAAO;oBACPJ,WAAW/B,OAAOG,KAAK;oBACvBiC,WAAWhC;8BAEVD;;gBAGJoB,YAAYC,gCAAkB,KAAC7B;oBAAQgB,MAAM;;gBAC7Ca,gCACC,KAACjC,kBAAkB8C,QAAQ;oBAACC,OAAO;wBAAEC,SAAS;oBAAU;8BACtD,cAAA,KAAC1C;wBAAQkC,WAAW/B,OAAOK,WAAW;wBAAE+B,WAAW9B;kCAChDD;;;gBAKNE;gBAEAnB,aAAaoB,0BAAY,KAACsB;oBAAIC,WAAW/B,OAAOQ,OAAO;8BAAGA;;gBAE1DY,aAAcN,CAAAA,sBAAsB,aAAaE,cAAa,mBAC7D,MAACvB;;wBACEqB,sBAAsB,2BACrB,KAACtB;4BACCgD,cAAY9B;4BACZ+B,eAAa5B;4BACb6B,SAASjC;sCAET,cAAA,KAACxB;;wBAGJ+B;;;gBAIHF,CAAAA,sBAAsB,YACrBK,aAAa,SAAS,CAACC,aAAaN,sBAAsB,MAAM,mBACjE,MAAClB;oBACCmC,WAAW/B,OAAO2C,OAAO;oBACzBD,SAASjC;oBACTmC,WAAU;oBACVC,YAAW;oBACXJ,eAAa5B;;sCAEb,KAACd;sCAAgBW;;wBAChBS,aAAa,sBAAQ,KAACjC,mCAAmB,KAACD;;;;;;AAMvD,EAAE"}
+{"version":3,"sources":["../../../../src/components/ModalCardBase/ModalCardBase.tsx"],"sourcesContent":["'use client';\n\nimport type * 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 | undefined;\n\n  /**\n   * Заголовок карточки.\n   */\n  title?: React.ReactNode | undefined;\n  /**\n   * Позволяет поменять тег используемый для заголовка.\n   */\n  titleComponent?: React.ElementType | undefined;\n  /**\n   * Позволяет задать id для заголовка. Используется, чтобы связать модальное окно и title через aria-labelledby, тем самым задав модальному окну имя через title.\n   */\n  titleId?: string | undefined;\n\n  /**\n   * Описание.\n   */\n  description?: React.ReactNode | undefined;\n  /**\n   * Позволяет поменять тег используемый для описания.\n   */\n  descriptionComponent?: React.ElementType | undefined;\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 | undefined;\n  /**\n   * Обработчик закрытия модального окна.\n   */\n  onClose?: VoidFunction | undefined;\n\n  /**\n   * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий.\n   */\n  dismissLabel?: string | undefined;\n\n  /**\n   * Задаёт контенту максимальную ширину для десктопной версии.\n   */\n  size?: number | undefined;\n\n  /**\n   * Передает атрибут `data-testid` для кнопки закрытия.\n   */\n  modalDismissButtonTestId?: string | undefined;\n  /**\n   * Расположение кнопки закрытия (внутри и вне `popout'a`).\n   *\n   * Доступно только в `compact`-режиме.\n   *\n   * На `iOS` в `regular`-режиме всегда включен `inside`.\n   *\n   * ⚠️ ВНИМАНИЕ: использование `none` скрывает крестик, это негативно сказывается на пользовательском опыте.\n   */\n  dismissButtonMode?: 'inside' | 'outside' | 'none' | undefined;\n  /**\n   * Позволяет отключить возможность закрытия модальной страницы (смахивание, клавиша `ESC`, нажатие на подложку).\n   *\n   * ⚠️ ВНИМАНИЕ: использование этой опции негативно сказывается на пользовательском опыте.\n   */\n  preventClose?: boolean | undefined;\n  /**\n   * Управляющие элементы под кнопкой закрытия.\n   *\n   * Доступно только в `compact`-режиме. Рекомендуется размещать иконки размера 20, обернутые в ModalOutsideButton.\n   *\n   */\n  outsideButtons?: React.ReactNode | undefined;\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={{ density: '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":["Icon20Cancel","Icon24Dismiss","classNames","hasReactNode","useAdaptivityWithJSMediaQueries","usePlatform","AdaptivityContext","ModalOutsideButton","ModalOutsideButtons","RootComponent","Spacing","Tappable","Subhead","Title","VisuallyHidden","styles","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","ios","desktop","baseStyle","maxWidth","div","className","container","id","level","weight","Component","Provider","value","density","aria-label","data-testid","onClick","dismiss","hoverMode","activeMode"],"mappings":"AAAA;;AAGA,SAASA,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;AAClE,OAAOC,YAAY,6BAA6B;AAyFhD;;CAEC,GACD,OAAO,MAAMC,gBAAgB,CAAC,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,EACP,GAAGC,WACgB;IACnB,MAAMC,WAAW7B;IACjB,MAAM,EAAE8B,SAAS,EAAE,GAAG/B;IAEtB,MAAMsB,OAAOS,YAAYR,WAAWS;IACpC,MAAMC,eACJ,CAACpB,QACAY,CAAAA,sBAAsB,YACpBK,aAAa,SAAS,CAACC,aAAaN,sBAAsB,MAAM;IAErE,MAAMS,WAAWnC,aAAae;IAC9B,MAAMqB,iBAAiBpC,aAAaiB;IACpC,qBACE,KAACX;QACE,GAAGwB,SAAS;QACbO,eAAetC,WACb,6BACAgC,aAAa,SAASnB,OAAO0B,GAAG,EAChCN,aAAapB,OAAO2B,OAAO,EAC3BL,gBAAgBtB,OAAOsB,YAAY;QAErCM,WAAW;YACTC,UAAUlB;QACZ;kBAEA,cAAA,MAACmB;YAAIC,WAAW/B,OAAOgC,SAAS;;gBAC7B5C,aAAac,uBAAS,KAAC4B;oBAAIC,WAAW/B,OAAOE,IAAI;8BAAGA;;gBACpDd,aAAae,wBACZ,KAACL;oBACCmC,IAAIhB;oBACJiB,OAAM;oBACNC,QAAO;oBACPJ,WAAW/B,OAAOG,KAAK;oBACvBiC,WAAWhC;8BAEVD;;gBAGJoB,YAAYC,gCAAkB,KAAC7B;oBAAQgB,MAAM;;gBAC7Ca,gCACC,KAACjC,kBAAkB8C,QAAQ;oBAACC,OAAO;wBAAEC,SAAS;oBAAU;8BACtD,cAAA,KAAC1C;wBAAQkC,WAAW/B,OAAOK,WAAW;wBAAE+B,WAAW9B;kCAChDD;;;gBAKNE;gBAEAnB,aAAaoB,0BAAY,KAACsB;oBAAIC,WAAW/B,OAAOQ,OAAO;8BAAGA;;gBAE1DY,aAAcN,CAAAA,sBAAsB,aAAaE,cAAa,mBAC7D,MAACvB;;wBACEqB,sBAAsB,2BACrB,KAACtB;4BACCgD,cAAY9B;4BACZ+B,eAAa5B;4BACb6B,SAASjC;sCAET,cAAA,KAACxB;;wBAGJ+B;;;gBAIHF,CAAAA,sBAAsB,YACrBK,aAAa,SAAS,CAACC,aAAaN,sBAAsB,MAAM,mBACjE,MAAClB;oBACCmC,WAAW/B,OAAO2C,OAAO;oBACzBD,SAASjC;oBACTmC,WAAU;oBACVC,YAAW;oBACXJ,eAAa5B;;sCAEb,KAACd;sCAAgBW;;wBAChBS,aAAa,sBAAQ,KAACjC,mCAAmB,KAACD;;;;;;AAMvD,EAAE"}

package/dist/cssm/components/ModalCardBase/ModalCardBase.module.css

@@ -25,10 +25,6 @@
   );
 }
 
-.containerSoftwareKeyboardOpened {
-  margin-block-end: 0;
-}
-
 .title,
 .description {
   padding-block: 0;

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalDismissButton/ModalDismissButton.tsx"],"sourcesContent":["import type * 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":["Icon20Cancel","classNames","ModalOutsideButton","VisuallyHidden","styles","ModalDismissButton","children","className","restProps","host"],"mappings":";AACA,SAASA,YAAY,QAAQ,mBAAmB;AAChD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SACEC,kBAAkB,QAEb,8CAA2C;AAClD,SAASC,cAAc,QAAQ,sCAAmC;AAClE,OAAOC,YAAY,kCAAkC;AASrD;;CAEC,GACD,OAAO,MAAMC,qBAAqB,CAAC,EACjCC,WAAW,SAAS,EACpBC,SAAS,EACT,GAAGC,WACqB;IACxB,qBACE,MAACN;QAAmBK,WAAWN,WAAWG,OAAOK,IAAI,EAAEF;QAAa,GAAGC,SAAS;;YAC7EF,0BAAY,KAACH;0BAAgBG;;0BAC9B,KAACN;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../../src/components/ModalDismissButton/ModalDismissButton.tsx"],"sourcesContent":["import type * 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 | undefined;\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":["Icon20Cancel","classNames","ModalOutsideButton","VisuallyHidden","styles","ModalDismissButton","children","className","restProps","host"],"mappings":";AACA,SAASA,YAAY,QAAQ,mBAAmB;AAChD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SACEC,kBAAkB,QAEb,8CAA2C;AAClD,SAASC,cAAc,QAAQ,sCAAmC;AAClE,OAAOC,YAAY,kCAAkC;AASrD;;CAEC,GACD,OAAO,MAAMC,qBAAqB,CAAC,EACjCC,WAAW,SAAS,EACpBC,SAAS,EACT,GAAGC,WACqB;IACxB,qBACE,MAACN;QAAmBK,WAAWN,WAAWG,OAAOK,IAAI,EAAEF;QAAa,GAAGC,SAAS;;YAC7EF,0BAAY,KAACH;0BAAgBG;;0BAC9B,KAACN;;;AAGP,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalOutlet/ModalOutlet.tsx"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\n\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport styles from './ModalOutlet.module.css';\n\nexport interface ModalOutletProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'hidden' | 'aria-hidden'> {\n  disableModalOverlay?: boolean;\n  hidden?: boolean;\n  isDesktop?: boolean;\n}\n\n/**\n * @private\n */\nexport const ModalOutlet = ({\n  className,\n  hidden,\n  isDesktop,\n  children,\n  getRootRef,\n  disableModalOverlay,\n  ...restProps\n}: ModalOutletProps) => {\n  return (\n    <div\n      ref={getRootRef}\n      className={classNames(\n        className,\n        styles.host,\n        isDesktop && styles.hostDesktop,\n        disableModalOverlay && styles.disableModalOverlay,\n      )}\n      hidden={hidden}\n      aria-hidden={hidden}\n      {...restProps}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["classNames","styles","ModalOutlet","className","hidden","isDesktop","children","getRootRef","disableModalOverlay","restProps","div","ref","host","hostDesktop","aria-hidden"],"mappings":";AAAA,sCAAsC,GAEtC,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,OAAOC,YAAY,2BAA2B;AAS9C;;CAEC,GACD,OAAO,MAAMC,cAAc,CAAC,EAC1BC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,QAAQ,EACRC,UAAU,EACVC,mBAAmB,EACnB,GAAGC,WACc;IACjB,qBACE,KAACC;QACCC,KAAKJ;QACLJ,WAAWH,WACTG,WACAF,OAAOW,IAAI,EACXP,aAAaJ,OAAOY,WAAW,EAC/BL,uBAAuBP,OAAOO,mBAAmB;QAEnDJ,QAAQA;QACRU,eAAaV;QACZ,GAAGK,SAAS;kBAEZH;;AAGP,EAAE"}
+{"version":3,"sources":["../../../../src/components/ModalOutlet/ModalOutlet.tsx"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\n\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport styles from './ModalOutlet.module.css';\n\nexport interface ModalOutletProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'hidden' | 'aria-hidden'> {\n  disableModalOverlay?: boolean | undefined;\n  hidden?: boolean | undefined;\n  isDesktop?: boolean | undefined;\n}\n\n/**\n * @private\n */\nexport const ModalOutlet = ({\n  className,\n  hidden,\n  isDesktop,\n  children,\n  getRootRef,\n  disableModalOverlay,\n  ...restProps\n}: ModalOutletProps) => {\n  return (\n    <div\n      ref={getRootRef}\n      className={classNames(\n        className,\n        styles.host,\n        isDesktop && styles.hostDesktop,\n        disableModalOverlay && styles.disableModalOverlay,\n      )}\n      hidden={hidden}\n      aria-hidden={hidden}\n      {...restProps}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["classNames","styles","ModalOutlet","className","hidden","isDesktop","children","getRootRef","disableModalOverlay","restProps","div","ref","host","hostDesktop","aria-hidden"],"mappings":";AAAA,sCAAsC,GAEtC,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,OAAOC,YAAY,2BAA2B;AAS9C;;CAEC,GACD,OAAO,MAAMC,cAAc,CAAC,EAC1BC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,QAAQ,EACRC,UAAU,EACVC,mBAAmB,EACnB,GAAGC,WACc;IACjB,qBACE,KAACC;QACCC,KAAKJ;QACLJ,WAAWH,WACTG,WACAF,OAAOW,IAAI,EACXP,aAAaJ,OAAOY,WAAW,EAC/BL,uBAAuBP,OAAOO,mBAAmB;QAEnDJ,QAAQA;QACRU,eAAaV;QACZ,GAAGK,SAAS;kBAEZH;;AAGP,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalOutsideButton/ModalOutsideButton.tsx"],"sourcesContent":["'use client';\n\nimport type * 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":["Tappable","VisuallyHidden","styles","ModalOutsideButton","children","ariaLabel","restProps","baseClassName","host","activeMode","active","hoverMode","hover"],"mappings":"AAAA;;AAGA,SAASA,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,cAAc,QAAQ,sCAAmC;AAClE,OAAOC,YAAY,kCAAkC;AAarD;;CAEC,GACD,OAAO,MAAMC,qBAAqB,CAAC,EACjCC,QAAQ,EACR,cAAcC,SAAS,EACvB,GAAGC,WACqB;IACxB,qBACE,MAACN;QACCO,eAAeL,OAAOM,IAAI;QAC1BC,YAAYP,OAAOQ,MAAM;QACzBC,WAAWT,OAAOU,KAAK;QACtB,GAAGN,SAAS;;YAEZD,2BAAa,KAACJ;0BAAgBI;;YAC9BD;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../../src/components/ModalOutsideButton/ModalOutsideButton.tsx"],"sourcesContent":["'use client';\n\nimport type * 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 | undefined;\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":["Tappable","VisuallyHidden","styles","ModalOutsideButton","children","ariaLabel","restProps","baseClassName","host","activeMode","active","hoverMode","hover"],"mappings":"AAAA;;AAGA,SAASA,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,cAAc,QAAQ,sCAAmC;AAClE,OAAOC,YAAY,kCAAkC;AAarD;;CAEC,GACD,OAAO,MAAMC,qBAAqB,CAAC,EACjCC,QAAQ,EACR,cAAcC,SAAS,EACvB,GAAGC,WACqB;IACxB,qBACE,MAACN;QACCO,eAAeL,OAAOM,IAAI;QAC1BC,YAAYP,OAAOQ,MAAM;QACzBC,WAAWT,OAAOU,KAAK;QACtB,GAAGN,SAAS;;YAEZD,2BAAa,KAACJ;0BAAgBI;;YAC9BD;;;AAGP,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalOverlay/ModalOverlay.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport type { DataHTMLAttributes } from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation/useCSSTransition';\nimport type { HasRootRef } from '../../types';\nimport styles from './ModalOverlay.module.css';\n\nconst positionClassNames = {\n  absolute: styles.hostPositionAbsolute,\n  fixed: styles.hostPositionFixed,\n};\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n  appear: styles.hostStateEnter,\n  appearing: styles.hostStateEntering,\n  appeared: styles.hostStateEntered,\n  enter: styles.hostStateEnter,\n  entering: styles.hostStateEntering,\n  entered: styles.hostStateEntered,\n  exit: styles.hostStateExit,\n  exiting: styles.hostStateExiting,\n  exited: styles.hostStateExited,\n};\n\nexport interface ModalOverlayProps\n  extends DataHTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  visible?: boolean;\n  position?: 'absolute' | 'fixed';\n  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n  onClosed?: () => void;\n  onShowed?: () => void;\n  disableOpenAnimation?: boolean;\n  disableCloseAnimation?: boolean;\n}\n\n/**\n * @private\n */\nexport const ModalOverlay = ({\n  visible = false,\n  position = 'absolute',\n  getRootRef,\n  onClick,\n  onClosed,\n  onShowed,\n  disableOpenAnimation,\n  disableCloseAnimation,\n  ...restProps\n}: ModalOverlayProps) => {\n  const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(visible, {\n    enableAppear: !disableOpenAnimation,\n    enableEnter: !disableOpenAnimation,\n    enableExit: !disableCloseAnimation,\n    onExited: onClosed,\n    onEntered: onShowed,\n  });\n  const handleRef = useExternRef(getRootRef, ref);\n\n  return (\n    <div\n      {...restProps}\n      ref={handleRef}\n      aria-hidden=\"true\"\n      hidden={transitionState === 'exited'}\n      className={classNames(\n        styles.host,\n        onClick === undefined && styles.nonInteractive,\n        positionClassNames[position],\n        transitionStateClassNames[transitionState],\n      )}\n      onClick={onClick}\n      onTransitionEnd={onTransitionEnd}\n    />\n  );\n};\n"],"names":["classNames","useExternRef","useCSSTransition","styles","positionClassNames","absolute","hostPositionAbsolute","fixed","hostPositionFixed","transitionStateClassNames","appear","hostStateEnter","appearing","hostStateEntering","appeared","hostStateEntered","enter","entering","entered","exit","hostStateExit","exiting","hostStateExiting","exited","hostStateExited","ModalOverlay","visible","position","getRootRef","onClick","onClosed","onShowed","disableOpenAnimation","disableCloseAnimation","restProps","transitionState","ref","onTransitionEnd","enableAppear","enableEnter","enableExit","onExited","onEntered","handleRef","div","aria-hidden","hidden","className","host","undefined","nonInteractive"],"mappings":"AAAA;;AAIA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,gBAAgB,QAAoC,0CAAuC;AAEpG,OAAOC,YAAY,4BAA4B;AAE/C,MAAMC,qBAAqB;IACzBC,UAAUF,OAAOG,oBAAoB;IACrCC,OAAOJ,OAAOK,iBAAiB;AACjC;AAEA,MAAMC,4BAA4E;IAChFC,QAAQP,OAAOQ,cAAc;IAC7BC,WAAWT,OAAOU,iBAAiB;IACnCC,UAAUX,OAAOY,gBAAgB;IACjCC,OAAOb,OAAOQ,cAAc;IAC5BM,UAAUd,OAAOU,iBAAiB;IAClCK,SAASf,OAAOY,gBAAgB;IAChCI,MAAMhB,OAAOiB,aAAa;IAC1BC,SAASlB,OAAOmB,gBAAgB;IAChCC,QAAQpB,OAAOqB,eAAe;AAChC;AAcA;;CAEC,GACD,OAAO,MAAMC,eAAe,CAAC,EAC3BC,UAAU,KAAK,EACfC,WAAW,UAAU,EACrBC,UAAU,EACVC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACRC,oBAAoB,EACpBC,qBAAqB,EACrB,GAAGC,WACe;IAClB,MAAM,CAACC,iBAAiB,EAAEC,GAAG,EAAEC,eAAe,EAAE,CAAC,GAAGnC,iBAAiCwB,SAAS;QAC5FY,cAAc,CAACN;QACfO,aAAa,CAACP;QACdQ,YAAY,CAACP;QACbQ,UAAUX;QACVY,WAAWX;IACb;IACA,MAAMY,YAAY1C,aAAa2B,YAAYQ;IAE3C,qBACE,KAACQ;QACE,GAAGV,SAAS;QACbE,KAAKO;QACLE,eAAY;QACZC,QAAQX,oBAAoB;QAC5BY,WAAW/C,WACTG,OAAO6C,IAAI,EACXnB,YAAYoB,aAAa9C,OAAO+C,cAAc,EAC9C9C,kBAAkB,CAACuB,SAAS,EAC5BlB,yBAAyB,CAAC0B,gBAAgB;QAE5CN,SAASA;QACTQ,iBAAiBA;;AAGvB,EAAE"}
+{"version":3,"sources":["../../../../src/components/ModalOverlay/ModalOverlay.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport type { DataHTMLAttributes } from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation/useCSSTransition';\nimport type { HasRootRef } from '../../types';\nimport styles from './ModalOverlay.module.css';\n\nconst positionClassNames = {\n  absolute: styles.hostPositionAbsolute,\n  fixed: styles.hostPositionFixed,\n};\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n  appear: styles.hostStateEnter,\n  appearing: styles.hostStateEntering,\n  appeared: styles.hostStateEntered,\n  enter: styles.hostStateEnter,\n  entering: styles.hostStateEntering,\n  entered: styles.hostStateEntered,\n  exit: styles.hostStateExit,\n  exiting: styles.hostStateExiting,\n  exited: styles.hostStateExited,\n};\n\nexport interface ModalOverlayProps\n  extends DataHTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  visible?: boolean | undefined;\n  position?: 'absolute' | 'fixed' | undefined;\n  onClick?: ((event: React.MouseEvent<HTMLDivElement>) => void) | undefined;\n  onClosed?: (() => void) | undefined;\n  onShowed?: (() => void) | undefined;\n  disableOpenAnimation?: boolean | undefined;\n  disableCloseAnimation?: boolean | undefined;\n}\n\n/**\n * @private\n */\nexport const ModalOverlay = ({\n  visible = false,\n  position = 'absolute',\n  getRootRef,\n  onClick,\n  onClosed,\n  onShowed,\n  disableOpenAnimation,\n  disableCloseAnimation,\n  ...restProps\n}: ModalOverlayProps) => {\n  const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(visible, {\n    enableAppear: !disableOpenAnimation,\n    enableEnter: !disableOpenAnimation,\n    enableExit: !disableCloseAnimation,\n    onExited: onClosed,\n    onEntered: onShowed,\n  });\n  const handleRef = useExternRef(getRootRef, ref);\n\n  return (\n    <div\n      {...restProps}\n      ref={handleRef}\n      aria-hidden=\"true\"\n      hidden={transitionState === 'exited'}\n      className={classNames(\n        styles.host,\n        onClick === undefined && styles.nonInteractive,\n        positionClassNames[position],\n        transitionStateClassNames[transitionState],\n      )}\n      onClick={onClick}\n      onTransitionEnd={onTransitionEnd}\n    />\n  );\n};\n"],"names":["classNames","useExternRef","useCSSTransition","styles","positionClassNames","absolute","hostPositionAbsolute","fixed","hostPositionFixed","transitionStateClassNames","appear","hostStateEnter","appearing","hostStateEntering","appeared","hostStateEntered","enter","entering","entered","exit","hostStateExit","exiting","hostStateExiting","exited","hostStateExited","ModalOverlay","visible","position","getRootRef","onClick","onClosed","onShowed","disableOpenAnimation","disableCloseAnimation","restProps","transitionState","ref","onTransitionEnd","enableAppear","enableEnter","enableExit","onExited","onEntered","handleRef","div","aria-hidden","hidden","className","host","undefined","nonInteractive"],"mappings":"AAAA;;AAIA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,gBAAgB,QAAoC,0CAAuC;AAEpG,OAAOC,YAAY,4BAA4B;AAE/C,MAAMC,qBAAqB;IACzBC,UAAUF,OAAOG,oBAAoB;IACrCC,OAAOJ,OAAOK,iBAAiB;AACjC;AAEA,MAAMC,4BAA4E;IAChFC,QAAQP,OAAOQ,cAAc;IAC7BC,WAAWT,OAAOU,iBAAiB;IACnCC,UAAUX,OAAOY,gBAAgB;IACjCC,OAAOb,OAAOQ,cAAc;IAC5BM,UAAUd,OAAOU,iBAAiB;IAClCK,SAASf,OAAOY,gBAAgB;IAChCI,MAAMhB,OAAOiB,aAAa;IAC1BC,SAASlB,OAAOmB,gBAAgB;IAChCC,QAAQpB,OAAOqB,eAAe;AAChC;AAcA;;CAEC,GACD,OAAO,MAAMC,eAAe,CAAC,EAC3BC,UAAU,KAAK,EACfC,WAAW,UAAU,EACrBC,UAAU,EACVC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACRC,oBAAoB,EACpBC,qBAAqB,EACrB,GAAGC,WACe;IAClB,MAAM,CAACC,iBAAiB,EAAEC,GAAG,EAAEC,eAAe,EAAE,CAAC,GAAGnC,iBAAiCwB,SAAS;QAC5FY,cAAc,CAACN;QACfO,aAAa,CAACP;QACdQ,YAAY,CAACP;QACbQ,UAAUX;QACVY,WAAWX;IACb;IACA,MAAMY,YAAY1C,aAAa2B,YAAYQ;IAE3C,qBACE,KAACQ;QACE,GAAGV,SAAS;QACbE,KAAKO;QACLE,eAAY;QACZC,QAAQX,oBAAoB;QAC5BY,WAAW/C,WACTG,OAAO6C,IAAI,EACXnB,YAAYoB,aAAa9C,OAAO+C,cAAc,EAC9C9C,kBAAkB,CAACuB,SAAS,EAC5BlB,yBAAyB,CAAC0B,gBAAgB;QAE5CN,SAASA;QACTQ,iBAAiBA;;AAGvB,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalPage/ModalPageBase.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE } from '../../lib/sheet';\nimport type { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { ModalOutsideButton } from '../ModalOutsideButton/ModalOutsideButton';\nimport { ModalOutsideButtons } from '../ModalOutsideButtons/ModalOutsideButtons';\nimport { ModalPageContent } from '../ModalPageContent/ModalPageContent';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport type { ModalPageInternalProps } from './ModalPageInternal';\nimport styles from './ModalPage.module.css';\n\nexport interface ModalPageBaseProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'title'>,\n    HasRef<HTMLDivElement>,\n    Pick<\n      ModalPageInternalProps,\n      | 'disableContentPanningGesture'\n      | 'header'\n      | 'children'\n      | 'footer'\n      | 'outsideButtons'\n      | 'modalContentTestId'\n      | 'modalDismissButtonTestId'\n      | 'modalDismissButtonLabel'\n      | 'hideCloseButton'\n      | 'onClose'\n    > {\n  isDesktop?: boolean;\n  closable?: boolean;\n}\n\nexport const ModalPageBase = ({\n  isDesktop,\n  getRef,\n  disableContentPanningGesture,\n  header,\n  children,\n  footer,\n  outsideButtons,\n  modalContentTestId,\n  modalDismissButtonTestId,\n  modalDismissButtonLabel,\n  hideCloseButton,\n  closable,\n  onClose = noop,\n  ...restProps\n}: ModalPageBaseProps) => {\n  const disableContentPanningGestureProp = disableContentPanningGesture\n    ? BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE\n    : undefined;\n\n  const closeButton =\n    hideCloseButton || !isDesktop ? null : (\n      <ModalOutsideButton\n        data-testid={modalDismissButtonTestId}\n        onClick={\n          closable\n            ? function handleDismissButtonClick(event) {\n                onClose('click-close-button', event);\n              }\n            : noop\n        }\n        aria-label={modalDismissButtonLabel}\n      >\n        <Icon20Cancel />\n      </ModalOutsideButton>\n    );\n\n  return (\n    <RootComponent role=\"document\" baseClassName={styles.document} {...restProps}>\n      <div\n        className={classNames(\n          styles.children,\n          isDesktop ? styles.childrenDesktop : styles.childrenMobile,\n        )}\n      >\n        {hasReactNode(header) && header}\n        <ModalPageContent\n          getRootRef={getRef}\n          data-testid={modalContentTestId}\n          {...disableContentPanningGestureProp}\n        >\n          {children}\n        </ModalPageContent>\n        {hasReactNode(footer) && footer}\n      </div>\n      {isDesktop && (closeButton || outsideButtons) && (\n        <ModalOutsideButtons>\n          {closeButton}\n          {outsideButtons}\n        </ModalOutsideButtons>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["Icon20Cancel","classNames","hasReactNode","noop","BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE","ModalOutsideButton","ModalOutsideButtons","ModalPageContent","RootComponent","styles","ModalPageBase","isDesktop","getRef","disableContentPanningGesture","header","children","footer","outsideButtons","modalContentTestId","modalDismissButtonTestId","modalDismissButtonLabel","hideCloseButton","closable","onClose","restProps","disableContentPanningGestureProp","undefined","closeButton","data-testid","onClick","handleDismissButtonClick","event","aria-label","role","baseClassName","document","div","className","childrenDesktop","childrenMobile","getRootRef"],"mappings":"AAAA;;AACA,sCAAsC,GAEtC,SAASA,YAAY,QAAQ,mBAAmB;AAChD,SAASC,UAAU,EAAEC,YAAY,EAAEC,IAAI,QAAQ,kBAAkB;AACjE,SAASC,mCAAmC,QAAQ,2BAAkB;AAEtE,SAASC,kBAAkB,QAAQ,8CAA2C;AAC9E,SAASC,mBAAmB,QAAQ,gDAA6C;AACjF,SAASC,gBAAgB,QAAQ,0CAAuC;AACxE,SAASC,aAAa,QAAQ,oCAAiC;AAE/D,OAAOC,YAAY,yBAAyB;AAsB5C,OAAO,MAAMC,gBAAgB,CAAC,EAC5BC,SAAS,EACTC,MAAM,EACNC,4BAA4B,EAC5BC,MAAM,EACNC,QAAQ,EACRC,MAAM,EACNC,cAAc,EACdC,kBAAkB,EAClBC,wBAAwB,EACxBC,uBAAuB,EACvBC,eAAe,EACfC,QAAQ,EACRC,UAAUpB,IAAI,EACd,GAAGqB,WACgB;IACnB,MAAMC,mCAAmCZ,+BACrCT,sCACAsB;IAEJ,MAAMC,cACJN,mBAAmB,CAACV,YAAY,qBAC9B,KAACN;QACCuB,eAAaT;QACbU,SACEP,WACI,SAASQ,yBAAyBC,KAAK;YACrCR,QAAQ,sBAAsBQ;QAChC,IACA5B;QAEN6B,cAAYZ;kBAEZ,cAAA,KAACpB;;IAIP,qBACE,MAACQ;QAAcyB,MAAK;QAAWC,eAAezB,OAAO0B,QAAQ;QAAG,GAAGX,SAAS;;0BAC1E,MAACY;gBACCC,WAAWpC,WACTQ,OAAOM,QAAQ,EACfJ,YAAYF,OAAO6B,eAAe,GAAG7B,OAAO8B,cAAc;;oBAG3DrC,aAAaY,WAAWA;kCACzB,KAACP;wBACCiC,YAAY5B;wBACZgB,eAAaV;wBACZ,GAAGO,gCAAgC;kCAEnCV;;oBAEFb,aAAac,WAAWA;;;YAE1BL,aAAcgB,CAAAA,eAAeV,cAAa,mBACzC,MAACX;;oBACEqB;oBACAV;;;;;AAKX,EAAE"}
+{"version":3,"sources":["../../../../src/components/ModalPage/ModalPageBase.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE } from '../../lib/sheet';\nimport type { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { ModalOutsideButton } from '../ModalOutsideButton/ModalOutsideButton';\nimport { ModalOutsideButtons } from '../ModalOutsideButtons/ModalOutsideButtons';\nimport { ModalPageContent } from '../ModalPageContent/ModalPageContent';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport type { ModalPageInternalProps } from './ModalPageInternal';\nimport styles from './ModalPage.module.css';\n\nexport interface ModalPageBaseProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'title'>,\n    HasRef<HTMLDivElement>,\n    Pick<\n      ModalPageInternalProps,\n      | 'disableContentPanningGesture'\n      | 'header'\n      | 'children'\n      | 'footer'\n      | 'outsideButtons'\n      | 'modalContentTestId'\n      | 'modalDismissButtonTestId'\n      | 'modalDismissButtonLabel'\n      | 'hideCloseButton'\n      | 'onClose'\n    > {\n  isDesktop?: boolean | undefined;\n  closable?: boolean | undefined;\n}\n\nexport const ModalPageBase = ({\n  isDesktop,\n  getRef,\n  disableContentPanningGesture,\n  header,\n  children,\n  footer,\n  outsideButtons,\n  modalContentTestId,\n  modalDismissButtonTestId,\n  modalDismissButtonLabel,\n  hideCloseButton,\n  closable,\n  onClose = noop,\n  ...restProps\n}: ModalPageBaseProps) => {\n  const disableContentPanningGestureProp = disableContentPanningGesture\n    ? BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE\n    : undefined;\n\n  const closeButton =\n    hideCloseButton || !isDesktop ? null : (\n      <ModalOutsideButton\n        data-testid={modalDismissButtonTestId}\n        onClick={\n          closable\n            ? function handleDismissButtonClick(event) {\n                onClose('click-close-button', event);\n              }\n            : noop\n        }\n        aria-label={modalDismissButtonLabel}\n      >\n        <Icon20Cancel />\n      </ModalOutsideButton>\n    );\n\n  return (\n    <RootComponent role=\"document\" baseClassName={styles.document} {...restProps}>\n      <div\n        className={classNames(\n          styles.children,\n          isDesktop ? styles.childrenDesktop : styles.childrenMobile,\n        )}\n      >\n        {hasReactNode(header) && header}\n        <ModalPageContent\n          getRootRef={getRef}\n          data-testid={modalContentTestId}\n          {...disableContentPanningGestureProp}\n        >\n          {children}\n        </ModalPageContent>\n        {hasReactNode(footer) && footer}\n      </div>\n      {isDesktop && (closeButton || outsideButtons) && (\n        <ModalOutsideButtons>\n          {closeButton}\n          {outsideButtons}\n        </ModalOutsideButtons>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["Icon20Cancel","classNames","hasReactNode","noop","BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE","ModalOutsideButton","ModalOutsideButtons","ModalPageContent","RootComponent","styles","ModalPageBase","isDesktop","getRef","disableContentPanningGesture","header","children","footer","outsideButtons","modalContentTestId","modalDismissButtonTestId","modalDismissButtonLabel","hideCloseButton","closable","onClose","restProps","disableContentPanningGestureProp","undefined","closeButton","data-testid","onClick","handleDismissButtonClick","event","aria-label","role","baseClassName","document","div","className","childrenDesktop","childrenMobile","getRootRef"],"mappings":"AAAA;;AACA,sCAAsC,GAEtC,SAASA,YAAY,QAAQ,mBAAmB;AAChD,SAASC,UAAU,EAAEC,YAAY,EAAEC,IAAI,QAAQ,kBAAkB;AACjE,SAASC,mCAAmC,QAAQ,2BAAkB;AAEtE,SAASC,kBAAkB,QAAQ,8CAA2C;AAC9E,SAASC,mBAAmB,QAAQ,gDAA6C;AACjF,SAASC,gBAAgB,QAAQ,0CAAuC;AACxE,SAASC,aAAa,QAAQ,oCAAiC;AAE/D,OAAOC,YAAY,yBAAyB;AAsB5C,OAAO,MAAMC,gBAAgB,CAAC,EAC5BC,SAAS,EACTC,MAAM,EACNC,4BAA4B,EAC5BC,MAAM,EACNC,QAAQ,EACRC,MAAM,EACNC,cAAc,EACdC,kBAAkB,EAClBC,wBAAwB,EACxBC,uBAAuB,EACvBC,eAAe,EACfC,QAAQ,EACRC,UAAUpB,IAAI,EACd,GAAGqB,WACgB;IACnB,MAAMC,mCAAmCZ,+BACrCT,sCACAsB;IAEJ,MAAMC,cACJN,mBAAmB,CAACV,YAAY,qBAC9B,KAACN;QACCuB,eAAaT;QACbU,SACEP,WACI,SAASQ,yBAAyBC,KAAK;YACrCR,QAAQ,sBAAsBQ;QAChC,IACA5B;QAEN6B,cAAYZ;kBAEZ,cAAA,KAACpB;;IAIP,qBACE,MAACQ;QAAcyB,MAAK;QAAWC,eAAezB,OAAO0B,QAAQ;QAAG,GAAGX,SAAS;;0BAC1E,MAACY;gBACCC,WAAWpC,WACTQ,OAAOM,QAAQ,EACfJ,YAAYF,OAAO6B,eAAe,GAAG7B,OAAO8B,cAAc;;oBAG3DrC,aAAaY,WAAWA;kCACzB,KAACP;wBACCiC,YAAY5B;wBACZgB,eAAaV;wBACZ,GAAGO,gCAAgC;kCAEnCV;;oBAEFb,aAAac,WAAWA;;;YAE1BL,aAAcgB,CAAAA,eAAeV,cAAa,mBACzC,MAACX;;oBACEqB;oBACAV;;;;;AAKX,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalPage/ModalPageInternal.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport { type ComponentType, type KeyboardEvent, useCallback } from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { mergeStyle } from '../../helpers/mergeStyle';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport {\n  isSizeXRegularFallback,\n  useAdaptivityWithJSMediaQueries,\n} from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useVirtualKeyboardState } from '../../hooks/useVirtualKeyboardState';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation';\nimport { type SnapPoint, type SnapPointChange, useBottomSheet } from '../../lib/sheet';\nimport type { CSSCustomProperties } from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { ModalOutlet } from '../ModalOutlet/ModalOutlet';\nimport {\n  ModalOverlay as ModalOverlayDefault,\n  type ModalOverlayProps,\n} from '../ModalOverlay/ModalOverlay';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ModalPageBase } from './ModalPageBase';\nimport type { ModalPageProps } from './types';\nimport styles from './ModalPage.module.css';\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n  appear: styles.documentStateEnter,\n  appearing: styles.documentStateEntering,\n\n  enter: styles.documentStateEnter,\n  entering: styles.documentStateEntering,\n\n  exiting: styles.documentStateExiting,\n  exited: styles.documentStateExited,\n};\n\nexport interface ModalPageInternalProps\n  extends Omit<ModalPageProps, 'nav' | 'keepMounted' | 'settlingHeight' | 'dynamicContentHeight'> {\n  snapPoint: SnapPoint;\n  ModalOverlay?: ComponentType<ModalOverlayProps>;\n  onSnapPointChange?: SnapPointChange;\n}\n\n/**\n * В компоненте заложена вся логика модального окна.\n *\n * @private\n */\nexport const ModalPageInternal = ({\n  getRootRef,\n  open,\n  header,\n  footer,\n  size: desktopMaxWidth,\n  height,\n  children,\n  className,\n  style,\n  snapPoint,\n  onSnapPointChange,\n  getModalContentRef,\n  ModalOverlay = ModalOverlayDefault,\n  modalOverlayTestId,\n  modalContentTestId,\n  modalDismissButtonTestId,\n  modalDismissButtonLabel = 'Закрыть',\n  outsideButtons,\n  noFocusToDialog,\n  hideCloseButton,\n  preventClose,\n  disableContentPanningGesture,\n  restoreFocus,\n  onOpen,\n  onOpened,\n  onClose = noop,\n  onClosed,\n  disableFocusTrap,\n  disableModalOverlay,\n  disableOpenAnimation = false,\n  disableCloseAnimation = false,\n  ...restProps\n}: ModalPageInternalProps) => {\n  const { hasCustomPanelHeaderAfter } = useConfigProvider();\n  const rootRef = useExternRef(getRootRef);\n  const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(open, {\n    enableAppear: !disableOpenAnimation,\n    enableEnter: !disableOpenAnimation,\n    enableExit: !disableCloseAnimation,\n    onEnter() {\n      onOpen?.();\n    },\n    onEntered() {\n      onOpened?.();\n    },\n    onExited() {\n      onClosed?.();\n    },\n  });\n  const opened = transitionState === 'appeared' || transitionState === 'entered';\n  const hidden = transitionState === 'exited';\n  const closable = !preventClose && opened;\n\n  const { sizeX: legacySizeXContext } = useAdaptivity();\n  const { isDesktop, sizeX: legacySizeX, viewWidth } = useAdaptivityWithJSMediaQueries();\n  const bottomSheetEnabled = !isDesktop && !preventClose && transitionState !== 'exited';\n  const { opened: keyboardOpened } = useVirtualKeyboardState(bottomSheetEnabled);\n\n  const [{ initialStyle, setSheetEl, setSheetScrollEl, setBackdropEl }, bottomSheetEventHandlers] =\n    useBottomSheet(bottomSheetEnabled, {\n      blocked: keyboardOpened,\n      snapPoint,\n      sheetCSSProperty: '--vkui_internal_ModalPageDocument--snapPoint',\n      backdropCSSProperty: '--vkui_internal--modal-overlay--opacity',\n      onSnapPointChange,\n      onDismiss() {\n        onClose('swipe-down');\n      },\n    });\n  const documentStyle = keyboardOpened\n    ? {\n        '--vkui_internal_ModalPageDocument--safeAreaInsetBottom': '0px',\n        ...initialStyle,\n      }\n    : initialStyle;\n  const handleSheetRef = useExternRef<HTMLDivElement>(setSheetEl, ref);\n  const handleSheetScrollRef = useExternRef<HTMLDivElement>(setSheetScrollEl, getModalContentRef);\n\n  const [desktopMaxWidthClassName, desktopMaxWidthStyle] = isDesktop\n    ? resolveDesktopMaxWidth(desktopMaxWidth)\n    : [undefined, undefined];\n\n  const modalOverlay = !disableModalOverlay && (\n    <ModalOverlay\n      getRootRef={setBackdropEl}\n      data-testid={modalOverlayTestId}\n      visible={open}\n      disableOpenAnimation={disableOpenAnimation}\n      disableCloseAnimation={disableCloseAnimation}\n      onClick={\n        closable\n          ? function handleBackdropClick(event) {\n              onClose('click-overlay', event);\n            }\n          : undefined\n      }\n    />\n  );\n  const handleEscKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLElement>) => {\n      if (closable && pressedKey(event) === Keys.ESCAPE) {\n        onClose('escape-key');\n      }\n    },\n    [closable, onClose],\n  );\n\n  useScrollLock(!hidden);\n\n  return (\n    <ModalOutlet\n      hidden={hidden}\n      isDesktop={isDesktop}\n      onKeyDown={handleEscKeyDown}\n      disableModalOverlay={disableModalOverlay}\n    >\n      {modalOverlay}\n      <FocusTrap\n        rootRef={rootRef}\n        restoreFocus={restoreFocus}\n        disabled={!opened || hidden || disableFocusTrap}\n        autoFocus={!noFocusToDialog}\n      >\n        <RootComponent\n          {...restProps}\n          tabIndex={-1}\n          getRootRef={rootRef}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          className={classNames(\n            className,\n            styles.host,\n            isDesktop ? styles.hostDesktop : styles.hostMobile,\n            !isDesktop &&\n              (hasCustomPanelHeaderAfter\n                ? styles.hostMobileSafeAreaInsetTopWithCustomOffset\n                : styles.hostMobileSafeAreaInsetTop),\n            desktopMaxWidthClassName,\n            isSizeXRegularFallback(viewWidth, legacySizeX, legacySizeXContext) &&\n              'vkuiInternalModalPage--viewWidth-smallTabletPlus',\n          )}\n          style={mergeStyle(mergeStyle(desktopMaxWidthStyle, getHeightCSSVariable(height)), style)}\n        >\n          <ModalPageBase\n            {...bottomSheetEventHandlers}\n            getRootRef={handleSheetRef}\n            getRef={handleSheetScrollRef}\n            style={documentStyle}\n            className={classNames(\n              isDesktop ? styles.documentDesktop : styles.documentMobile,\n              transitionStateClassNames[transitionState],\n            )}\n            onTransitionEnd={onTransitionEnd}\n            isDesktop={isDesktop}\n            disableContentPanningGesture={disableContentPanningGesture}\n            header={header}\n            footer={footer}\n            outsideButtons={outsideButtons}\n            modalContentTestId={modalContentTestId}\n            modalDismissButtonTestId={modalDismissButtonTestId}\n            modalDismissButtonLabel={modalDismissButtonLabel}\n            hideCloseButton={hideCloseButton}\n            closable={closable}\n            onClose={onClose}\n          >\n            {children}\n          </ModalPageBase>\n        </RootComponent>\n      </FocusTrap>\n    </ModalOutlet>\n  );\n};\n\nconst desktopMaxWidthClassNames: Record<string, string | undefined> = {\n  s: styles.hostDesktopMaxWidthS,\n  m: styles.hostDesktopMaxWidthM,\n  l: styles.hostDesktopMaxWidthL,\n};\n\nfunction resolveDesktopMaxWidth(\n  desktopMaxWidth: ModalPageInternalProps['size'] = 's',\n): [string | undefined, CSSCustomProperties | undefined] {\n  if (typeof desktopMaxWidth === 'number') {\n    return [undefined, { '--vkui_internal_ModalPage--desktopMaxWidth': `${desktopMaxWidth}px` }];\n  }\n\n  const className = desktopMaxWidthClassNames[desktopMaxWidth];\n  const style = className\n    ? undefined\n    : { '--vkui_internal_ModalPage--desktopMaxWidth': desktopMaxWidth };\n\n  return [className, style];\n}\n\nfunction getHeightCSSVariable(height?: number | string): CSSCustomProperties | undefined {\n  return height !== undefined\n    ? {\n        '--vkui_internal_ModalPage--userHeight':\n          typeof height === 'number' ? `${height}px` : height,\n      }\n    : undefined;\n}\n"],"names":["useCallback","classNames","noop","mergeStyle","useAdaptivity","isSizeXRegularFallback","useAdaptivityWithJSMediaQueries","useExternRef","useVirtualKeyboardState","Keys","pressedKey","useCSSTransition","useBottomSheet","useScrollLock","useConfigProvider","FocusTrap","ModalOutlet","ModalOverlay","ModalOverlayDefault","RootComponent","ModalPageBase","styles","transitionStateClassNames","appear","documentStateEnter","appearing","documentStateEntering","enter","entering","exiting","documentStateExiting","exited","documentStateExited","ModalPageInternal","getRootRef","open","header","footer","size","desktopMaxWidth","height","children","className","style","snapPoint","onSnapPointChange","getModalContentRef","modalOverlayTestId","modalContentTestId","modalDismissButtonTestId","modalDismissButtonLabel","outsideButtons","noFocusToDialog","hideCloseButton","preventClose","disableContentPanningGesture","restoreFocus","onOpen","onOpened","onClose","onClosed","disableFocusTrap","disableModalOverlay","disableOpenAnimation","disableCloseAnimation","restProps","hasCustomPanelHeaderAfter","rootRef","transitionState","ref","onTransitionEnd","enableAppear","enableEnter","enableExit","onEnter","onEntered","onExited","opened","hidden","closable","sizeX","legacySizeXContext","isDesktop","legacySizeX","viewWidth","bottomSheetEnabled","keyboardOpened","initialStyle","setSheetEl","setSheetScrollEl","setBackdropEl","bottomSheetEventHandlers","blocked","sheetCSSProperty","backdropCSSProperty","onDismiss","documentStyle","handleSheetRef","handleSheetScrollRef","desktopMaxWidthClassName","desktopMaxWidthStyle","resolveDesktopMaxWidth","undefined","modalOverlay","data-testid","visible","onClick","handleBackdropClick","event","handleEscKeyDown","ESCAPE","onKeyDown","disabled","autoFocus","tabIndex","role","aria-modal","host","hostDesktop","hostMobile","hostMobileSafeAreaInsetTopWithCustomOffset","hostMobileSafeAreaInsetTop","getHeightCSSVariable","getRef","documentDesktop","documentMobile","desktopMaxWidthClassNames","s","hostDesktopMaxWidthS","m","hostDesktopMaxWidthM","l","hostDesktopMaxWidthL"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/ModalPage/ModalPageInternal.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport { type ComponentType, type KeyboardEvent, useCallback } from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { mergeStyle } from '../../helpers/mergeStyle';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport {\n  isSizeXRegularFallback,\n  useAdaptivityWithJSMediaQueries,\n} from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useVirtualKeyboardState } from '../../hooks/useVirtualKeyboardState';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation';\nimport { type SnapPoint, type SnapPointChange, useBottomSheet } from '../../lib/sheet';\nimport type { CSSCustomProperties } from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { ModalOutlet } from '../ModalOutlet/ModalOutlet';\nimport {\n  ModalOverlay as ModalOverlayDefault,\n  type ModalOverlayProps,\n} from '../ModalOverlay/ModalOverlay';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ModalPageBase } from './ModalPageBase';\nimport type { ModalPageProps } from './types';\nimport styles from './ModalPage.module.css';\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n  appear: styles.documentStateEnter,\n  appearing: styles.documentStateEntering,\n\n  enter: styles.documentStateEnter,\n  entering: styles.documentStateEntering,\n\n  exiting: styles.documentStateExiting,\n  exited: styles.documentStateExited,\n};\n\nexport interface ModalPageInternalProps\n  extends Omit<ModalPageProps, 'nav' | 'keepMounted' | 'settlingHeight' | 'dynamicContentHeight'> {\n  snapPoint: SnapPoint;\n  ModalOverlay?: ComponentType<ModalOverlayProps> | undefined;\n  onSnapPointChange?: SnapPointChange | undefined;\n}\n\n/**\n * В компоненте заложена вся логика модального окна.\n *\n * @private\n */\nexport const ModalPageInternal = ({\n  getRootRef,\n  open,\n  header,\n  footer,\n  size: desktopMaxWidth,\n  height,\n  children,\n  className,\n  style,\n  snapPoint,\n  onSnapPointChange,\n  getModalContentRef,\n  ModalOverlay = ModalOverlayDefault,\n  modalOverlayTestId,\n  modalContentTestId,\n  modalDismissButtonTestId,\n  modalDismissButtonLabel = 'Закрыть',\n  outsideButtons,\n  noFocusToDialog,\n  hideCloseButton,\n  preventClose,\n  disableContentPanningGesture,\n  restoreFocus,\n  onOpen,\n  onOpened,\n  onClose = noop,\n  onClosed,\n  disableFocusTrap,\n  disableModalOverlay,\n  disableOpenAnimation = false,\n  disableCloseAnimation = false,\n  ...restProps\n}: ModalPageInternalProps) => {\n  const { hasCustomPanelHeaderAfter } = useConfigProvider();\n  const rootRef = useExternRef(getRootRef);\n  const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(open, {\n    enableAppear: !disableOpenAnimation,\n    enableEnter: !disableOpenAnimation,\n    enableExit: !disableCloseAnimation,\n    onEnter() {\n      onOpen?.();\n    },\n    onEntered() {\n      onOpened?.();\n    },\n    onExited() {\n      onClosed?.();\n    },\n  });\n  const opened = transitionState === 'appeared' || transitionState === 'entered';\n  const hidden = transitionState === 'exited';\n  const closable = !preventClose && opened;\n\n  const { sizeX: legacySizeXContext } = useAdaptivity();\n  const { isDesktop, sizeX: legacySizeX, viewWidth } = useAdaptivityWithJSMediaQueries();\n  const bottomSheetEnabled = !isDesktop && !preventClose && transitionState !== 'exited';\n  const { opened: keyboardOpened } = useVirtualKeyboardState(bottomSheetEnabled);\n\n  const [{ initialStyle, setSheetEl, setSheetScrollEl, setBackdropEl }, bottomSheetEventHandlers] =\n    useBottomSheet(bottomSheetEnabled, {\n      blocked: keyboardOpened,\n      snapPoint,\n      sheetCSSProperty: '--vkui_internal_ModalPageDocument--snapPoint',\n      backdropCSSProperty: '--vkui_internal--modal-overlay--opacity',\n      onSnapPointChange,\n      onDismiss() {\n        onClose('swipe-down');\n      },\n    });\n  const documentStyle = keyboardOpened\n    ? {\n        '--vkui_internal_ModalPageDocument--safeAreaInsetBottom': '0px',\n        ...initialStyle,\n      }\n    : initialStyle;\n  const handleSheetRef = useExternRef<HTMLDivElement>(setSheetEl, ref);\n  const handleSheetScrollRef = useExternRef<HTMLDivElement>(setSheetScrollEl, getModalContentRef);\n\n  const [desktopMaxWidthClassName, desktopMaxWidthStyle] = isDesktop\n    ? resolveDesktopMaxWidth(desktopMaxWidth)\n    : [undefined, undefined];\n\n  const modalOverlay = !disableModalOverlay && (\n    <ModalOverlay\n      getRootRef={setBackdropEl}\n      data-testid={modalOverlayTestId}\n      visible={open}\n      disableOpenAnimation={disableOpenAnimation}\n      disableCloseAnimation={disableCloseAnimation}\n      onClick={\n        closable\n          ? function handleBackdropClick(event) {\n              onClose('click-overlay', event);\n            }\n          : undefined\n      }\n    />\n  );\n  const handleEscKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLElement>) => {\n      if (closable && pressedKey(event) === Keys.ESCAPE) {\n        onClose('escape-key');\n      }\n    },\n    [closable, onClose],\n  );\n\n  useScrollLock(!hidden);\n\n  return (\n    <ModalOutlet\n      hidden={hidden}\n      isDesktop={isDesktop}\n      onKeyDown={handleEscKeyDown}\n      disableModalOverlay={disableModalOverlay}\n    >\n      {modalOverlay}\n      <FocusTrap\n        rootRef={rootRef}\n        restoreFocus={restoreFocus}\n        disabled={!opened || hidden || disableFocusTrap}\n        autoFocus={!noFocusToDialog}\n      >\n        <RootComponent\n          {...restProps}\n          tabIndex={-1}\n          getRootRef={rootRef}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          className={classNames(\n            className,\n            styles.host,\n            isDesktop ? styles.hostDesktop : styles.hostMobile,\n            !isDesktop &&\n              (hasCustomPanelHeaderAfter\n                ? styles.hostMobileSafeAreaInsetTopWithCustomOffset\n                : styles.hostMobileSafeAreaInsetTop),\n            desktopMaxWidthClassName,\n            isSizeXRegularFallback(viewWidth, legacySizeX, legacySizeXContext) &&\n              'vkuiInternalModalPage--viewWidth-smallTabletPlus',\n          )}\n          style={mergeStyle(mergeStyle(desktopMaxWidthStyle, getHeightCSSVariable(height)), style)}\n        >\n          <ModalPageBase\n            {...bottomSheetEventHandlers}\n            getRootRef={handleSheetRef}\n            getRef={handleSheetScrollRef}\n            style={documentStyle}\n            className={classNames(\n              isDesktop ? styles.documentDesktop : styles.documentMobile,\n              transitionStateClassNames[transitionState],\n            )}\n            onTransitionEnd={onTransitionEnd}\n            isDesktop={isDesktop}\n            disableContentPanningGesture={disableContentPanningGesture}\n            header={header}\n            footer={footer}\n            outsideButtons={outsideButtons}\n            modalContentTestId={modalContentTestId}\n            modalDismissButtonTestId={modalDismissButtonTestId}\n            modalDismissButtonLabel={modalDismissButtonLabel}\n            hideCloseButton={hideCloseButton}\n            closable={closable}\n            onClose={onClose}\n          >\n            {children}\n          </ModalPageBase>\n        </RootComponent>\n      </FocusTrap>\n    </ModalOutlet>\n  );\n};\n\nconst desktopMaxWidthClassNames: Record<string, string | undefined> = {\n  s: styles.hostDesktopMaxWidthS,\n  m: styles.hostDesktopMaxWidthM,\n  l: styles.hostDesktopMaxWidthL,\n};\n\nfunction resolveDesktopMaxWidth(\n  desktopMaxWidth: ModalPageInternalProps['size'] = 's',\n): [string | undefined, CSSCustomProperties | undefined] {\n  if (typeof desktopMaxWidth === 'number') {\n    return [undefined, { '--vkui_internal_ModalPage--desktopMaxWidth': `${desktopMaxWidth}px` }];\n  }\n\n  const className = desktopMaxWidthClassNames[desktopMaxWidth];\n  const style = className\n    ? undefined\n    : { '--vkui_internal_ModalPage--desktopMaxWidth': desktopMaxWidth };\n\n  return [className, style];\n}\n\nfunction getHeightCSSVariable(height?: number | string): CSSCustomProperties | undefined {\n  return height !== undefined\n    ? {\n        '--vkui_internal_ModalPage--userHeight':\n          typeof height === 'number' ? `${height}px` : height,\n      }\n    : undefined;\n}\n"],"names":["useCallback","classNames","noop","mergeStyle","useAdaptivity","isSizeXRegularFallback","useAdaptivityWithJSMediaQueries","useExternRef","useVirtualKeyboardState","Keys","pressedKey","useCSSTransition","useBottomSheet","useScrollLock","useConfigProvider","FocusTrap","ModalOutlet","ModalOverlay","ModalOverlayDefault","RootComponent","ModalPageBase","styles","transitionStateClassNames","appear","documentStateEnter","appearing","documentStateEntering","enter","entering","exiting","documentStateExiting","exited","documentStateExited","ModalPageInternal","getRootRef","open","header","footer","size","desktopMaxWidth","height","children","className","style","snapPoint","onSnapPointChange","getModalContentRef","modalOverlayTestId","modalContentTestId","modalDismissButtonTestId","modalDismissButtonLabel","outsideButtons","noFocusToDialog","hideCloseButton","preventClose","disableContentPanningGesture","restoreFocus","onOpen","onOpened","onClose","onClosed","disableFocusTrap","disableModalOverlay","disableOpenAnimation","disableCloseAnimation","restProps","hasCustomPanelHeaderAfter","rootRef","transitionState","ref","onTransitionEnd","enableAppear","enableEnter","enableExit","onEnter","onEntered","onExited","opened","hidden","closable","sizeX","legacySizeXContext","isDesktop","legacySizeX","viewWidth","bottomSheetEnabled","keyboardOpened","initialStyle","setSheetEl","setSheetScrollEl","setBackdropEl","bottomSheetEventHandlers","blocked","sheetCSSProperty","backdropCSSProperty","onDismiss","documentStyle","handleSheetRef","handleSheetScrollRef","desktopMaxWidthClassName","desktopMaxWidthStyle","resolveDesktopMaxWidth","undefined","modalOverlay","data-testid","visible","onClick","handleBackdropClick","event","handleEscKeyDown","ESCAPE","onKeyDown","disabled","autoFocus","tabIndex","role","aria-modal","host","hostDesktop","hostMobile","hostMobileSafeAreaInsetTopWithCustomOffset","hostMobileSafeAreaInsetTop","getHeightCSSVariable","getRef","documentDesktop","documentMobile","desktopMaxWidthClassNames","s","hostDesktopMaxWidthS","m","hostDesktopMaxWidthM","l","hostDesktopMaxWidthL"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalPage/types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode, Ref, UIEvent } from 'react';\nimport type { NavIdProps } from '../../lib/getNavId';\nimport type { HTMLAttributesWithRootRef, LiteralUnion } from '../../types';\n\nexport type ModalPageCloseReason =\n  | 'click-overlay'\n  | 'click-close-button'\n  | 'escape-key'\n  | 'swipe-down';\n\ntype OmittedStyleAttribute = {\n  /**\n   * Дополнительные стили.\n   */\n  style?: Omit<CSSProperties, 'height' | 'maxWidth' | 'maxHeight'>;\n};\n\nexport interface ModalPageProps\n  extends NavIdProps,\n    Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'id' | 'style'>,\n    OmittedStyleAttribute {\n  /**\n   * Состояние видимости.\n   *\n   * @default false\n   */\n  open?: boolean;\n  /**\n   * Сохранять ли компонент в DOM при `open={false}`.\n   *\n   * @default false\n   */\n  keepMounted?: boolean;\n  /**\n   * Шапка модальной страницы, `<ModalPageHeader />`.\n   */\n  header?: ReactNode;\n  /**\n   * Подвал модальной страницы, `<ModalPageFooter />`.\n   */\n  footer?: ReactNode;\n  /**\n   * Задаёт контенту максимальную ширину на десктопе.\n   */\n  size?: LiteralUnion<\n    's' | 'm' | 'l' | 'auto' | 'fit-content' | 'max-content' | 'min-content',\n    string | number\n  >;\n  /**\n   * Задаёт модальному окну фиксированную высоту.\n   * Можно передать числовое значение в пикселях, а можно строкой, в том числе и в процентах \"50%\".\n   * В мобильной версии 'settlingHeight' будет считаться относительно заданного height.\n   */\n  height?: string | number;\n  /**\n   * Процент, на который изначально будет открыта модальная страница.\n   *\n   * > ⚠️ Следует использовать следующие значения: `25`, `50`, `75`, `100`.\n   * > При передаче `< 25` значение приведётся к `25`, при передаче `> 75` значение приведётся к `75`.\n   *\n   * Игнорируется при включении `dynamicContentHeight`.\n   */\n  settlingHeight?: number;\n  /**\n   * Если высота контента в модальной странице может поменяться, нужно установить это свойство.\n   */\n  dynamicContentHeight?: boolean;\n  /**\n   * Отключает фокус на интерактивный элемент после открытия модалки.\n   *\n   * > Важно установить фокус после открытия в любое место модалки используя событие `onOpened`, иначе не будет работать закрытие по нажатию `Esc`.\n   */\n  noFocusToDialog?: boolean;\n  /**\n   * Скрывает кнопку закрытия (актуально для iOS, так как можно отрисовать кнопку закрытия внутри модалки).\n   */\n  hideCloseButton?: boolean;\n  /**\n   * `data-testid` для содержимого модального окна.\n   */\n  modalContentTestId?: string;\n  /**\n   * Возвращает DOM-элемент содержимого модального окна.\n   */\n  getModalContentRef?: Ref<HTMLDivElement>;\n  /**\n   * `data-testid` для оверлея.\n   */\n  modalOverlayTestId?: string;\n  /**\n   * `data-testid` для кнопки закрытия.\n   */\n  modalDismissButtonTestId?: string;\n  /**\n   * Текст для скринридера.\n   */\n  modalDismissButtonLabel?: string;\n  /**\n   * Позволяет отключить возможность закрытия модальной страницы (смахивание, клавиша `ESC`, нажатие на подложку).\n   *\n   * ⚠️ ВНИМАНИЕ: использование этой опции негативно сказывается на пользовательском опыте.\n   */\n  preventClose?: boolean;\n  /**\n   * Отключает раскрытие и закрытие панели в мобильном виде.\n   */\n  disableContentPanningGesture?: boolean;\n  /**\n   * Будет вызвано при начале открытия модалки.\n   */\n  onOpen?: VoidFunction;\n  /**\n   * Будет вызвано при окончательном открытии модалки.\n   */\n  onOpened?: VoidFunction;\n  /**\n   * Будет вызвано при начале закрытия модалки.\n   */\n  onClose?: (reason: ModalPageCloseReason, event?: UIEvent<HTMLElement>) => void;\n  /**\n   * Будет вызвано при окончательном закрытии модалки.\n   */\n  onClosed?: VoidFunction;\n  /**\n   * Управляющие элементы под кнопкой закрытия.\n   *\n   * Доступно только в `compact`-режиме. Рекомендуется размещать иконки размера 20, обернутые в ModalOutsideButton.\n   *\n   */\n  outsideButtons?: React.ReactNode;\n  /**\n   * Управление поведением возврата фокуса при закрытии всплывающего окна.\n   * @default true\n   */\n  restoreFocus?: boolean | (() => boolean | HTMLElement);\n  /**\n   * Позволяет отключить захват фокуса.\n   *\n   * Нужно использовать, когда поверх одной модалки открывается другая, чтобы два `FocusTrap` не конфликтовали.\n   */\n  disableFocusTrap?: boolean;\n  /**\n   * Отключает отображение и взаимодействие с фоном модалки.\n   */\n  disableModalOverlay?: boolean;\n  /**\n   * Отключает анимацию открытия модалки.\n   */\n  disableOpenAnimation?: boolean;\n  /**\n   * Отключает анимацию закрытия модалки.\n   */\n  disableCloseAnimation?: boolean;\n}\n"],"names":[],"mappings":"AAiBA,WAwIC"}
+{"version":3,"sources":["../../../../src/components/ModalPage/types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode, Ref, UIEvent } from 'react';\nimport type { NavIdProps } from '../../lib/getNavId';\nimport type { HTMLAttributesWithRootRef, LiteralUnion } from '../../types';\n\nexport type ModalPageCloseReason =\n  | 'click-overlay'\n  | 'click-close-button'\n  | 'escape-key'\n  | 'swipe-down';\n\ntype OmittedStyleAttribute = {\n  /**\n   * Дополнительные стили.\n   */\n  style?: Omit<CSSProperties, 'height' | 'maxWidth' | 'maxHeight'> | undefined;\n};\n\nexport interface ModalPageProps\n  extends NavIdProps,\n    Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'id' | 'style'>,\n    OmittedStyleAttribute {\n  /**\n   * Состояние видимости.\n   *\n   * @default false\n   */\n  open?: boolean | undefined;\n  /**\n   * Сохранять ли компонент в DOM при `open={false}`.\n   *\n   * @default false\n   */\n  keepMounted?: boolean | undefined;\n  /**\n   * Шапка модальной страницы, `<ModalPageHeader />`.\n   */\n  header?: ReactNode | undefined;\n  /**\n   * Подвал модальной страницы, `<ModalPageFooter />`.\n   */\n  footer?: ReactNode | undefined;\n  /**\n   * Задаёт контенту максимальную ширину на десктопе.\n   */\n  size?: LiteralUnion<\n    's' | 'm' | 'l' | 'auto' | 'fit-content' | 'max-content' | 'min-content',\n    string | number\n  >;\n  /**\n   * Задаёт модальному окну фиксированную высоту.\n   * Можно передать числовое значение в пикселях, а можно строкой, в том числе и в процентах \"50%\".\n   * В мобильной версии 'settlingHeight' будет считаться относительно заданного height.\n   */\n  height?: string | number | undefined;\n  /**\n   * Процент, на который изначально будет открыта модальная страница.\n   *\n   * > ⚠️ Следует использовать следующие значения: `25`, `50`, `75`, `100`.\n   * > При передаче `< 25` значение приведётся к `25`, при передаче `> 75` значение приведётся к `75`.\n   *\n   * Игнорируется при включении `dynamicContentHeight`.\n   */\n  settlingHeight?: number | undefined;\n  /**\n   * Если высота контента в модальной странице может поменяться, нужно установить это свойство.\n   */\n  dynamicContentHeight?: boolean | undefined;\n  /**\n   * Отключает фокус на интерактивный элемент после открытия модалки.\n   *\n   * > Важно установить фокус после открытия в любое место модалки используя событие `onOpened`, иначе не будет работать закрытие по нажатию `Esc`.\n   */\n  noFocusToDialog?: boolean | undefined;\n  /**\n   * Скрывает кнопку закрытия (актуально для iOS, так как можно отрисовать кнопку закрытия внутри модалки).\n   */\n  hideCloseButton?: boolean | undefined;\n  /**\n   * `data-testid` для содержимого модального окна.\n   */\n  modalContentTestId?: string | undefined;\n  /**\n   * Возвращает DOM-элемент содержимого модального окна.\n   */\n  getModalContentRef?: Ref<HTMLDivElement> | undefined;\n  /**\n   * `data-testid` для оверлея.\n   */\n  modalOverlayTestId?: string | undefined;\n  /**\n   * `data-testid` для кнопки закрытия.\n   */\n  modalDismissButtonTestId?: string | undefined;\n  /**\n   * Текст для скринридера.\n   */\n  modalDismissButtonLabel?: string | undefined;\n  /**\n   * Позволяет отключить возможность закрытия модальной страницы (смахивание, клавиша `ESC`, нажатие на подложку).\n   *\n   * ⚠️ ВНИМАНИЕ: использование этой опции негативно сказывается на пользовательском опыте.\n   */\n  preventClose?: boolean | undefined;\n  /**\n   * Отключает раскрытие и закрытие панели в мобильном виде.\n   */\n  disableContentPanningGesture?: boolean | undefined;\n  /**\n   * Будет вызвано при начале открытия модалки.\n   */\n  onOpen?: VoidFunction | undefined;\n  /**\n   * Будет вызвано при окончательном открытии модалки.\n   */\n  onOpened?: VoidFunction | undefined;\n  /**\n   * Будет вызвано при начале закрытия модалки.\n   */\n  onClose?: ((reason: ModalPageCloseReason, event?: UIEvent<HTMLElement>) => void) | undefined;\n  /**\n   * Будет вызвано при окончательном закрытии модалки.\n   */\n  onClosed?: VoidFunction | undefined;\n  /**\n   * Управляющие элементы под кнопкой закрытия.\n   *\n   * Доступно только в `compact`-режиме. Рекомендуется размещать иконки размера 20, обернутые в ModalOutsideButton.\n   *\n   */\n  outsideButtons?: React.ReactNode | undefined;\n  /**\n   * Управление поведением возврата фокуса при закрытии всплывающего окна.\n   * @default true\n   */\n  restoreFocus?: boolean | (() => boolean | HTMLElement) | undefined;\n  /**\n   * Позволяет отключить захват фокуса.\n   *\n   * Нужно использовать, когда поверх одной модалки открывается другая, чтобы два `FocusTrap` не конфликтовали.\n   */\n  disableFocusTrap?: boolean | undefined;\n  /**\n   * Отключает отображение и взаимодействие с фоном модалки.\n   */\n  disableModalOverlay?: boolean | undefined;\n  /**\n   * Отключает анимацию открытия модалки.\n   */\n  disableOpenAnimation?: boolean | undefined;\n  /**\n   * Отключает анимацию закрытия модалки.\n   */\n  disableCloseAnimation?: boolean | undefined;\n}\n"],"names":[],"mappings":"AAiBA,WAwIC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalPageFooter/ModalPageFooter.tsx"],"sourcesContent":["'use client';\n\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport {\n  isSizeXCompactFallback,\n  useAdaptivityWithJSMediaQueries,\n} from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageFooter.module.css';\n\nexport interface ModalPageFooterProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Отключение отображения разделителя.\n   */\n  noSeparator?: boolean;\n  /**\n   * Отключение отступов сверху и снизу.\n   */\n  noPadding?: boolean;\n}\n\nexport const ModalPageFooter = ({\n  noSeparator = false,\n  noPadding = false,\n  children,\n  ...restProps\n}: ModalPageFooterProps) => {\n  const { sizeX: legacySizeXContext } = useAdaptivity();\n  const { isDesktop, sizeX: legacySizeX, viewWidth } = useAdaptivityWithJSMediaQueries();\n  return (\n    <RootComponent\n      baseClassName={classNames(\n        styles.host,\n        !noPadding && styles.padded,\n        isDesktop ? styles.hostDesktop : styles.hostMobile,\n      )}\n      {...restProps}\n    >\n      {!noSeparator && (\n        <Separator\n          className={styles.Separator}\n          padding={isSizeXCompactFallback(viewWidth, legacySizeX, legacySizeXContext)}\n        />\n      )}\n      {children}\n    </RootComponent>\n  );\n};\n"],"names":["classNames","useAdaptivity","isSizeXCompactFallback","useAdaptivityWithJSMediaQueries","RootComponent","Separator","styles","ModalPageFooter","noSeparator","noPadding","children","restProps","sizeX","legacySizeXContext","isDesktop","legacySizeX","viewWidth","baseClassName","host","padded","hostDesktop","hostMobile","className","padding"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SACEC,sBAAsB,EACtBC,+BAA+B,QAC1B,iDAA8C;AAErD,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,SAAS,QAAQ,4BAAyB;AACnD,OAAOC,YAAY,+BAA+B;AAalD,OAAO,MAAMC,kBAAkB,CAAC,EAC9BC,cAAc,KAAK,EACnBC,YAAY,KAAK,EACjBC,QAAQ,EACR,GAAGC,WACkB;IACrB,MAAM,EAAEC,OAAOC,kBAAkB,EAAE,GAAGZ;IACtC,MAAM,EAAEa,SAAS,EAAEF,OAAOG,WAAW,EAAEC,SAAS,EAAE,GAAGb;IACrD,qBACE,MAACC;QACCa,eAAejB,WACbM,OAAOY,IAAI,EACX,CAACT,aAAaH,OAAOa,MAAM,EAC3BL,YAAYR,OAAOc,WAAW,GAAGd,OAAOe,UAAU;QAEnD,GAAGV,SAAS;;YAEZ,CAACH,6BACA,KAACH;gBACCiB,WAAWhB,OAAOD,SAAS;gBAC3BkB,SAASrB,uBAAuBc,WAAWD,aAAaF;;YAG3DH;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../../src/components/ModalPageFooter/ModalPageFooter.tsx"],"sourcesContent":["'use client';\n\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport {\n  isSizeXCompactFallback,\n  useAdaptivityWithJSMediaQueries,\n} from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageFooter.module.css';\n\nexport interface ModalPageFooterProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Отключение отображения разделителя.\n   */\n  noSeparator?: boolean | undefined;\n  /**\n   * Отключение отступов сверху и снизу.\n   */\n  noPadding?: boolean | undefined;\n}\n\nexport const ModalPageFooter = ({\n  noSeparator = false,\n  noPadding = false,\n  children,\n  ...restProps\n}: ModalPageFooterProps) => {\n  const { sizeX: legacySizeXContext } = useAdaptivity();\n  const { isDesktop, sizeX: legacySizeX, viewWidth } = useAdaptivityWithJSMediaQueries();\n  return (\n    <RootComponent\n      baseClassName={classNames(\n        styles.host,\n        !noPadding && styles.padded,\n        isDesktop ? styles.hostDesktop : styles.hostMobile,\n      )}\n      {...restProps}\n    >\n      {!noSeparator && (\n        <Separator\n          className={styles.Separator}\n          padding={isSizeXCompactFallback(viewWidth, legacySizeX, legacySizeXContext)}\n        />\n      )}\n      {children}\n    </RootComponent>\n  );\n};\n"],"names":["classNames","useAdaptivity","isSizeXCompactFallback","useAdaptivityWithJSMediaQueries","RootComponent","Separator","styles","ModalPageFooter","noSeparator","noPadding","children","restProps","sizeX","legacySizeXContext","isDesktop","legacySizeX","viewWidth","baseClassName","host","padded","hostDesktop","hostMobile","className","padding"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SACEC,sBAAsB,EACtBC,+BAA+B,QAC1B,iDAA8C;AAErD,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,SAAS,QAAQ,4BAAyB;AACnD,OAAOC,YAAY,+BAA+B;AAalD,OAAO,MAAMC,kBAAkB,CAAC,EAC9BC,cAAc,KAAK,EACnBC,YAAY,KAAK,EACjBC,QAAQ,EACR,GAAGC,WACkB;IACrB,MAAM,EAAEC,OAAOC,kBAAkB,EAAE,GAAGZ;IACtC,MAAM,EAAEa,SAAS,EAAEF,OAAOG,WAAW,EAAEC,SAAS,EAAE,GAAGb;IACrD,qBACE,MAACC;QACCa,eAAejB,WACbM,OAAOY,IAAI,EACX,CAACT,aAAaH,OAAOa,MAAM,EAC3BL,YAAYR,OAAOc,WAAW,GAAGd,OAAOe,UAAU;QAEnD,GAAGV,SAAS;;YAEZ,CAACH,6BACA,KAACH;gBACCiB,WAAWhB,OAAOD,SAAS;gBAC3BkB,SAASrB,uBAAuBc,WAAWD,aAAaF;;YAG3DH;;;AAGP,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useModalContext } from '../../context/ModalContext';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport {\n  isSizeXCompactFallback,\n  useAdaptivityWithJSMediaQueries,\n} 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 { sizeX: legacySizeXContext } = useAdaptivity();\n  const { isDesktop, sizeX: legacySizeX, viewWidth } = 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 && (\n        <Separator padding={isSizeXCompactFallback(viewWidth, legacySizeX, legacySizeXContext)} />\n      )}\n    </>\n  );\n};\n"],"names":["classNames","useModalContext","useAdaptivity","isSizeXCompactFallback","useAdaptivityWithJSMediaQueries","usePlatform","PanelHeader","Separator","styles","ModalPageHeader","children","noSeparator","getRootRef","className","typographyProps","restProps","platform","sizeX","legacySizeXContext","isDesktop","legacySizeX","viewWidth","modalContext","div","host","hostWithGaps","hostDesktop","ref","Component","id","labelId","fixed","delimiter","transparent","padding"],"mappings":"AAAA;;AAGA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,eAAe,QAAQ,gCAA6B;AAC7D,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SACEC,sBAAsB,EACtBC,+BAA+B,QAC1B,iDAA8C;AACrD,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,WAAW,QAA+B,gCAA6B;AAChF,SAASC,SAAS,QAAQ,4BAAyB;AACnD,OAAOC,YAAY,+BAA+B;AAalD;;CAEC,GACD,OAAO,MAAMC,kBAAkB,CAAC,EAC9BC,QAAQ,EACRC,cAAc,KAAK,EACnBC,UAAU,EACVC,SAAS,EACTC,eAAe,EACf,GAAGC,WACkB;IACrB,MAAMC,WAAWX;IACjB,MAAM,EAAEY,OAAOC,kBAAkB,EAAE,GAAGhB;IACtC,MAAM,EAAEiB,SAAS,EAAEF,OAAOG,WAAW,EAAEC,SAAS,EAAE,GAAGjB;IACrD,MAAMkB,eAAerB;IAErB,qBACE;;0BACE,KAACsB;gBACCV,WAAWb,WACTQ,OAAOgB,IAAI,EACXR,aAAa,WAAWR,OAAOiB,YAAY,EAC3CN,aAAaX,OAAOkB,WAAW;gBAEjCC,KAAKf;0BAEL,cAAA,KAACN;oBACCO,WAAWb,WAAW,mCAAmCa;oBACzDC,iBAAiB;wBACfc,WAAW;wBACXC,IAAIP,aAAaQ,OAAO;wBACxB,GAAGhB,eAAe;oBACpB;oBACC,GAAGC,SAAS;oBACbgB,OAAO;oBACPC,WAAU;oBACVC,WAAW;8BAEVvB;;;YAGJ,CAACC,6BACA,KAACJ;gBAAU2B,SAAS/B,uBAAuBkB,WAAWD,aAAaF;;;;AAI3E,EAAE"}
+{"version":3,"sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useModalContext } from '../../context/ModalContext';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport {\n  isSizeXCompactFallback,\n  useAdaptivityWithJSMediaQueries,\n} 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 | undefined;\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 { sizeX: legacySizeXContext } = useAdaptivity();\n  const { isDesktop, sizeX: legacySizeX, viewWidth } = 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 && (\n        <Separator padding={isSizeXCompactFallback(viewWidth, legacySizeX, legacySizeXContext)} />\n      )}\n    </>\n  );\n};\n"],"names":["classNames","useModalContext","useAdaptivity","isSizeXCompactFallback","useAdaptivityWithJSMediaQueries","usePlatform","PanelHeader","Separator","styles","ModalPageHeader","children","noSeparator","getRootRef","className","typographyProps","restProps","platform","sizeX","legacySizeXContext","isDesktop","legacySizeX","viewWidth","modalContext","div","host","hostWithGaps","hostDesktop","ref","Component","id","labelId","fixed","delimiter","transparent","padding"],"mappings":"AAAA;;AAGA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,eAAe,QAAQ,gCAA6B;AAC7D,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SACEC,sBAAsB,EACtBC,+BAA+B,QAC1B,iDAA8C;AACrD,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,WAAW,QAA+B,gCAA6B;AAChF,SAASC,SAAS,QAAQ,4BAAyB;AACnD,OAAOC,YAAY,+BAA+B;AAalD;;CAEC,GACD,OAAO,MAAMC,kBAAkB,CAAC,EAC9BC,QAAQ,EACRC,cAAc,KAAK,EACnBC,UAAU,EACVC,SAAS,EACTC,eAAe,EACf,GAAGC,WACkB;IACrB,MAAMC,WAAWX;IACjB,MAAM,EAAEY,OAAOC,kBAAkB,EAAE,GAAGhB;IACtC,MAAM,EAAEiB,SAAS,EAAEF,OAAOG,WAAW,EAAEC,SAAS,EAAE,GAAGjB;IACrD,MAAMkB,eAAerB;IAErB,qBACE;;0BACE,KAACsB;gBACCV,WAAWb,WACTQ,OAAOgB,IAAI,EACXR,aAAa,WAAWR,OAAOiB,YAAY,EAC3CN,aAAaX,OAAOkB,WAAW;gBAEjCC,KAAKf;0BAEL,cAAA,KAACN;oBACCO,WAAWb,WAAW,mCAAmCa;oBACzDC,iBAAiB;wBACfc,WAAW;wBACXC,IAAIP,aAAaQ,OAAO;wBACxB,GAAGhB,eAAe;oBACpB;oBACC,GAAGC,SAAS;oBACbgB,OAAO;oBACPC,WAAU;oBACVC,WAAW;8BAEVvB;;;YAGJ,CAACC,6BACA,KAACJ;gBAAU2B,SAAS/B,uBAAuBkB,WAAWD,aAAaF;;;;AAI3E,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalRoot/types.ts"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\n\nimport type { AppRootPortalProps } from '../AppRoot/AppRootPortal';\n\nexport type ModalRootActiveModal = string | null;\n\nexport type ModalRootCallbackFunction = (modalId: string) => void;\n\ntype ModalRootBaseProps = {\n  /**\n   * Открывает модальное окно с переданным id.\n   */\n  activeModal?: ModalRootActiveModal;\n\n  /**\n   * `data-testid` для маски.\n   */\n  modalOverlayTestId?: string;\n\n  /**\n   * Отключает фокус на контейнер диалогового окна при открытии.\n   *\n   * > Важно установить фокус после открытия в любое место модалки используя событие `onOpened`, иначе не будет работать закрытие по нажатию `Esc`.\n   */\n  noFocusToDialog?: boolean;\n\n  usePortal?: AppRootPortalProps['usePortal'];\n  /**\n   * Будет вызвано при начале открытия активной модалки с её id.\n   */\n  onOpen?: ModalRootCallbackFunction;\n\n  /**\n   * Будет вызвано при окончательном открытии активной модалки с её id.\n   */\n  onOpened?: ModalRootCallbackFunction;\n\n  /**\n   * Будет вызвано при начале закрытия активной модалки с её id.\n   */\n  onClose?: ModalRootCallbackFunction;\n\n  /**\n   * Будет вызвано при окончательном закрытии активной модалки с её id.\n   */\n  onClosed?: ModalRootCallbackFunction;\n\n  /**\n   * Отключает отображение и взаимодействие с фоном модалки.\n   */\n  disableModalOverlay?: boolean;\n\n  /**\n   * Отключает анимацию появления .\n   */\n  disableOpenAnimation?: boolean;\n  /**\n   * Отключает анимацию закрытия модалки.\n   */\n  disableCloseAnimation?: boolean;\n};\n\nexport interface ModalRootProps extends ModalRootBaseProps {\n  children: React.ReactElement | Iterable<React.ReactElement>;\n  onOverlayClosed?: () => void;\n  onOverlayShowed?: () => void;\n}\n\ntype ModalRootContextBaseInterface = {\n  /**\n   * Обозначает, в контексте ли модального окна мы сейчас.\n   */\n  isInsideModal: boolean;\n};\n\nexport interface ModalRootContextInterface\n  extends ModalRootContextBaseInterface,\n    ModalRootBaseProps {}\n\nexport interface UseModalRootContext extends ModalRootContextBaseInterface {\n  activeModal?: string | null;\n  onClose?: VoidFunction;\n}\n"],"names":[],"mappings":"AAAA,sCAAsC,GA+EtC,WAGC"}
+{"version":3,"sources":["../../../../src/components/ModalRoot/types.ts"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\n\nimport type { AppRootPortalProps } from '../AppRoot/AppRootPortal';\n\nexport type ModalRootActiveModal = string | null;\n\nexport type ModalRootCallbackFunction = (modalId: string) => void;\n\ntype ModalRootBaseProps = {\n  /**\n   * Открывает модальное окно с переданным id.\n   */\n  activeModal?: ModalRootActiveModal | undefined;\n\n  /**\n   * `data-testid` для маски.\n   */\n  modalOverlayTestId?: string | undefined;\n\n  /**\n   * Отключает фокус на контейнер диалогового окна при открытии.\n   *\n   * > Важно установить фокус после открытия в любое место модалки используя событие `onOpened`, иначе не будет работать закрытие по нажатию `Esc`.\n   */\n  noFocusToDialog?: boolean | undefined;\n\n  usePortal?: AppRootPortalProps['usePortal'] | undefined;\n  /**\n   * Будет вызвано при начале открытия активной модалки с её id.\n   */\n  onOpen?: ModalRootCallbackFunction | undefined;\n\n  /**\n   * Будет вызвано при окончательном открытии активной модалки с её id.\n   */\n  onOpened?: ModalRootCallbackFunction | undefined;\n\n  /**\n   * Будет вызвано при начале закрытия активной модалки с её id.\n   */\n  onClose?: ModalRootCallbackFunction | undefined;\n\n  /**\n   * Будет вызвано при окончательном закрытии активной модалки с её id.\n   */\n  onClosed?: ModalRootCallbackFunction | undefined;\n\n  /**\n   * Отключает отображение и взаимодействие с фоном модалки.\n   */\n  disableModalOverlay?: boolean | undefined;\n\n  /**\n   * Отключает анимацию появления .\n   */\n  disableOpenAnimation?: boolean | undefined;\n  /**\n   * Отключает анимацию закрытия модалки.\n   */\n  disableCloseAnimation?: boolean | undefined;\n};\n\nexport interface ModalRootProps extends ModalRootBaseProps {\n  children: React.ReactElement | Iterable<React.ReactElement>;\n  onOverlayClosed?: (() => void) | undefined;\n  onOverlayShowed?: (() => void) | undefined;\n}\n\ntype ModalRootContextBaseInterface = {\n  /**\n   * Обозначает, в контексте ли модального окна мы сейчас.\n   */\n  isInsideModal: boolean;\n};\n\nexport interface ModalRootContextInterface\n  extends ModalRootContextBaseInterface,\n    ModalRootBaseProps {}\n\nexport interface UseModalRootContext extends ModalRootContextBaseInterface {\n  activeModal?: string | null | undefined;\n  onClose?: VoidFunction | undefined;\n}\n"],"names":[],"mappings":"AAAA,sCAAsC,GA+EtC,WAGC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalRoot/useModalRootManager.tsx"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\n\nimport { useContext, useId, useState } from 'react';\nimport { getNavId } from '../../lib/getNavId';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { AnyFunction } from '../../types';\nimport { ModalOverlay, type ModalOverlayProps } from '../ModalOverlay/ModalOverlay';\nimport { ModalRootContext } from './ModalRootContext';\nimport { VisuallyHiddenModalOverlay } from './VisuallyHiddenModalOverlay/VisuallyHiddenModalOverlay';\nimport type { ModalRootCallbackFunction } from './types';\n\nconst warn = warnOnce('useModalManager');\nexport interface UseModalRootManager {\n  id?: string;\n  open: boolean;\n  keepMounted: boolean;\n  modalOverlayTestId?: string;\n  noFocusToDialog?: boolean;\n  disableModalOverlay?: boolean;\n  disableCloseAnimation?: boolean;\n  disableOpenAnimation?: boolean;\n  onOpen?: AnyFunction;\n  onOpened?: AnyFunction;\n  onClose?: AnyFunction;\n  onClosed?: AnyFunction;\n}\n\nexport interface UseModalRootManagerResolvedProps {\n  id: string;\n  open: boolean;\n  noFocusToDialog?: boolean;\n  disableModalOverlay?: boolean;\n  disableCloseAnimation?: boolean;\n  disableOpenAnimation?: boolean;\n  modalOverlayTestId?: string;\n  ModalOverlay: React.ComponentType<ModalOverlayProps>;\n  onOpen?: AnyFunction;\n  onOpened?: AnyFunction;\n  onClose?: AnyFunction;\n  onClosed?: AnyFunction;\n}\n\nexport type UseModalRootManagerResult =\n  | { mounted: false; shouldPreserveSnapPoint: boolean; id: UseModalRootManagerResolvedProps['id'] }\n  | ({ mounted: true; shouldPreserveSnapPoint: boolean } & UseModalRootManagerResolvedProps);\n\nexport const useModalRootManager = ({\n  id: idProp,\n  open,\n  keepMounted,\n  modalOverlayTestId,\n  noFocusToDialog,\n  disableModalOverlay,\n  disableCloseAnimation,\n  disableOpenAnimation,\n  onOpen,\n  onOpened,\n  onClose,\n  onClosed,\n}: UseModalRootManager): UseModalRootManagerResult => {\n  const context = useContext(ModalRootContext);\n  const generatingId = useId();\n  const id = getNavId({ nav: idProp }, context.isInsideModal ? warn : undefined) || generatingId;\n  const opened = context.isInsideModal ? context.activeModal === id : open;\n  const shouldPreserveSnapPoint = context.isInsideModal ? context.activeModal !== null : false;\n\n  const [unmounted, setUnmounted] = useState(keepMounted ? false : !opened);\n\n  useIsomorphicLayoutEffect(\n    function unsetUnmounted() {\n      if (!keepMounted && opened) {\n        setUnmounted((prev) => (prev ? false : prev));\n      }\n    },\n    [opened, keepMounted],\n  );\n\n  if (unmounted) {\n    return { mounted: false, shouldPreserveSnapPoint, id };\n  }\n\n  return {\n    id,\n    mounted: true,\n    open: opened,\n    shouldPreserveSnapPoint,\n    noFocusToDialog: noFocusToDialog || context.noFocusToDialog,\n    modalOverlayTestId: modalOverlayTestId || context.modalOverlayTestId,\n    disableModalOverlay: disableModalOverlay || context.disableModalOverlay,\n    disableCloseAnimation: disableCloseAnimation || context.disableCloseAnimation,\n    disableOpenAnimation: disableOpenAnimation || context.disableOpenAnimation,\n    ModalOverlay: context.isInsideModal ? VisuallyHiddenModalOverlay : ModalOverlay,\n    onOpen: onOpen || getContextCallback(id, context.onOpen),\n    onOpened: onOpened || getContextCallback(id, context.onOpened),\n    onClose: onClose || getContextCallback(id, context.onClose),\n    onClosed: function handleClosed(...args: any[]) {\n      if (!keepMounted) {\n        setUnmounted(true);\n      }\n\n      if (onClosed) {\n        onClosed(...args);\n      } else {\n        context.onClosed?.(id);\n      }\n    },\n  };\n};\n\nfunction getContextCallback(id: string, fn: ModalRootCallbackFunction | undefined) {\n  return fn ? () => fn(id) : undefined;\n}\n"],"names":["useContext","useId","useState","getNavId","useIsomorphicLayoutEffect","warnOnce","ModalOverlay","ModalRootContext","VisuallyHiddenModalOverlay","warn","useModalRootManager","id","idProp","open","keepMounted","modalOverlayTestId","noFocusToDialog","disableModalOverlay","disableCloseAnimation","disableOpenAnimation","onOpen","onOpened","onClose","onClosed","context","generatingId","nav","isInsideModal","undefined","opened","activeModal","shouldPreserveSnapPoint","unmounted","setUnmounted","unsetUnmounted","prev","mounted","getContextCallback","handleClosed","args","fn"],"mappings":"AAAA,sCAAsC,GAEtC,SAASA,UAAU,EAAEC,KAAK,EAAEC,QAAQ,QAAQ,QAAQ;AACpD,SAASC,QAAQ,QAAQ,wBAAqB;AAC9C,SAASC,yBAAyB,QAAQ,yCAAsC;AAChF,SAASC,QAAQ,QAAQ,wBAAqB;AAE9C,SAASC,YAAY,QAAgC,kCAA+B;AACpF,SAASC,gBAAgB,QAAQ,wBAAqB;AACtD,SAASC,0BAA0B,QAAQ,6DAA0D;AAGrG,MAAMC,OAAOJ,SAAS;AAmCtB,OAAO,MAAMK,sBAAsB,CAAC,EAClCC,IAAIC,MAAM,EACVC,IAAI,EACJC,WAAW,EACXC,kBAAkB,EAClBC,eAAe,EACfC,mBAAmB,EACnBC,qBAAqB,EACrBC,oBAAoB,EACpBC,MAAM,EACNC,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACY;IACpB,MAAMC,UAAUxB,WAAWO;IAC3B,MAAMkB,eAAexB;IACrB,MAAMU,KAAKR,SAAS;QAAEuB,KAAKd;IAAO,GAAGY,QAAQG,aAAa,GAAGlB,OAAOmB,cAAcH;IAClF,MAAMI,SAASL,QAAQG,aAAa,GAAGH,QAAQM,WAAW,KAAKnB,KAAKE;IACpE,MAAMkB,0BAA0BP,QAAQG,aAAa,GAAGH,QAAQM,WAAW,KAAK,OAAO;IAEvF,MAAM,CAACE,WAAWC,aAAa,GAAG/B,SAASY,cAAc,QAAQ,CAACe;IAElEzB,0BACE,SAAS8B;QACP,IAAI,CAACpB,eAAee,QAAQ;YAC1BI,aAAa,CAACE,OAAUA,OAAO,QAAQA;QACzC;IACF,GACA;QAACN;QAAQf;KAAY;IAGvB,IAAIkB,WAAW;QACb,OAAO;YAAEI,SAAS;YAAOL;YAAyBpB;QAAG;IACvD;IAEA,OAAO;QACLA;QACAyB,SAAS;QACTvB,MAAMgB;QACNE;QACAf,iBAAiBA,mBAAmBQ,QAAQR,eAAe;QAC3DD,oBAAoBA,sBAAsBS,QAAQT,kBAAkB;QACpEE,qBAAqBA,uBAAuBO,QAAQP,mBAAmB;QACvEC,uBAAuBA,yBAAyBM,QAAQN,qBAAqB;QAC7EC,sBAAsBA,wBAAwBK,QAAQL,oBAAoB;QAC1Eb,cAAckB,QAAQG,aAAa,GAAGnB,6BAA6BF;QACnEc,QAAQA,UAAUiB,mBAAmB1B,IAAIa,QAAQJ,MAAM;QACvDC,UAAUA,YAAYgB,mBAAmB1B,IAAIa,QAAQH,QAAQ;QAC7DC,SAASA,WAAWe,mBAAmB1B,IAAIa,QAAQF,OAAO;QAC1DC,UAAU,SAASe,aAAa,GAAGC,IAAW;YAC5C,IAAI,CAACzB,aAAa;gBAChBmB,aAAa;YACf;YAEA,IAAIV,UAAU;gBACZA,YAAYgB;YACd,OAAO;gBACLf,QAAQD,QAAQ,GAAGZ;YACrB;QACF;IACF;AACF,EAAE;AAEF,SAAS0B,mBAAmB1B,EAAU,EAAE6B,EAAyC;IAC/E,OAAOA,KAAK,IAAMA,GAAG7B,MAAMiB;AAC7B"}
+{"version":3,"sources":["../../../../src/components/ModalRoot/useModalRootManager.tsx"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\n\nimport { useContext, useId, useState } from 'react';\nimport { getNavId } from '../../lib/getNavId';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { AnyFunction } from '../../types';\nimport { ModalOverlay, type ModalOverlayProps } from '../ModalOverlay/ModalOverlay';\nimport { ModalRootContext } from './ModalRootContext';\nimport { VisuallyHiddenModalOverlay } from './VisuallyHiddenModalOverlay/VisuallyHiddenModalOverlay';\nimport type { ModalRootCallbackFunction } from './types';\n\nconst warn = warnOnce('useModalManager');\nexport interface UseModalRootManager {\n  id?: string | undefined;\n  open: boolean;\n  keepMounted: boolean;\n  modalOverlayTestId?: string | undefined;\n  noFocusToDialog?: boolean | undefined;\n  disableModalOverlay?: boolean | undefined;\n  disableCloseAnimation?: boolean | undefined;\n  disableOpenAnimation?: boolean | undefined;\n  onOpen?: AnyFunction | undefined;\n  onOpened?: AnyFunction | undefined;\n  onClose?: AnyFunction | undefined;\n  onClosed?: AnyFunction | undefined;\n}\n\nexport interface UseModalRootManagerResolvedProps {\n  id: string;\n  open: boolean;\n  noFocusToDialog?: boolean | undefined;\n  disableModalOverlay?: boolean | undefined;\n  disableCloseAnimation?: boolean | undefined;\n  disableOpenAnimation?: boolean | undefined;\n  modalOverlayTestId?: string | undefined;\n  ModalOverlay: React.ComponentType<ModalOverlayProps>;\n  onOpen?: AnyFunction | undefined;\n  onOpened?: AnyFunction | undefined;\n  onClose?: AnyFunction | undefined;\n  onClosed?: AnyFunction | undefined;\n}\n\nexport type UseModalRootManagerResult =\n  | { mounted: false; shouldPreserveSnapPoint: boolean; id: UseModalRootManagerResolvedProps['id'] }\n  | ({ mounted: true; shouldPreserveSnapPoint: boolean } & UseModalRootManagerResolvedProps);\n\nexport const useModalRootManager = ({\n  id: idProp,\n  open,\n  keepMounted,\n  modalOverlayTestId,\n  noFocusToDialog,\n  disableModalOverlay,\n  disableCloseAnimation,\n  disableOpenAnimation,\n  onOpen,\n  onOpened,\n  onClose,\n  onClosed,\n}: UseModalRootManager): UseModalRootManagerResult => {\n  const context = useContext(ModalRootContext);\n  const generatingId = useId();\n  const id = getNavId({ nav: idProp }, context.isInsideModal ? warn : undefined) || generatingId;\n  const opened = context.isInsideModal ? context.activeModal === id : open;\n  const shouldPreserveSnapPoint = context.isInsideModal ? context.activeModal !== null : false;\n\n  const [unmounted, setUnmounted] = useState(keepMounted ? false : !opened);\n\n  useIsomorphicLayoutEffect(\n    function unsetUnmounted() {\n      if (!keepMounted && opened) {\n        setUnmounted((prev) => (prev ? false : prev));\n      }\n    },\n    [opened, keepMounted],\n  );\n\n  if (unmounted) {\n    return { mounted: false, shouldPreserveSnapPoint, id };\n  }\n\n  return {\n    id,\n    mounted: true,\n    open: opened,\n    shouldPreserveSnapPoint,\n    noFocusToDialog: noFocusToDialog || context.noFocusToDialog,\n    modalOverlayTestId: modalOverlayTestId || context.modalOverlayTestId,\n    disableModalOverlay: disableModalOverlay || context.disableModalOverlay,\n    disableCloseAnimation: disableCloseAnimation || context.disableCloseAnimation,\n    disableOpenAnimation: disableOpenAnimation || context.disableOpenAnimation,\n    ModalOverlay: context.isInsideModal ? VisuallyHiddenModalOverlay : ModalOverlay,\n    onOpen: onOpen || getContextCallback(id, context.onOpen),\n    onOpened: onOpened || getContextCallback(id, context.onOpened),\n    onClose: onClose || getContextCallback(id, context.onClose),\n    onClosed: function handleClosed(...args: any[]) {\n      if (!keepMounted) {\n        setUnmounted(true);\n      }\n\n      if (onClosed) {\n        onClosed(...args);\n      } else {\n        context.onClosed?.(id);\n      }\n    },\n  };\n};\n\nfunction getContextCallback(id: string, fn: ModalRootCallbackFunction | undefined) {\n  return fn ? () => fn(id) : undefined;\n}\n"],"names":["useContext","useId","useState","getNavId","useIsomorphicLayoutEffect","warnOnce","ModalOverlay","ModalRootContext","VisuallyHiddenModalOverlay","warn","useModalRootManager","id","idProp","open","keepMounted","modalOverlayTestId","noFocusToDialog","disableModalOverlay","disableCloseAnimation","disableOpenAnimation","onOpen","onOpened","onClose","onClosed","context","generatingId","nav","isInsideModal","undefined","opened","activeModal","shouldPreserveSnapPoint","unmounted","setUnmounted","unsetUnmounted","prev","mounted","getContextCallback","handleClosed","args","fn"],"mappings":"AAAA,sCAAsC,GAEtC,SAASA,UAAU,EAAEC,KAAK,EAAEC,QAAQ,QAAQ,QAAQ;AACpD,SAASC,QAAQ,QAAQ,wBAAqB;AAC9C,SAASC,yBAAyB,QAAQ,yCAAsC;AAChF,SAASC,QAAQ,QAAQ,wBAAqB;AAE9C,SAASC,YAAY,QAAgC,kCAA+B;AACpF,SAASC,gBAAgB,QAAQ,wBAAqB;AACtD,SAASC,0BAA0B,QAAQ,6DAA0D;AAGrG,MAAMC,OAAOJ,SAAS;AAmCtB,OAAO,MAAMK,sBAAsB,CAAC,EAClCC,IAAIC,MAAM,EACVC,IAAI,EACJC,WAAW,EACXC,kBAAkB,EAClBC,eAAe,EACfC,mBAAmB,EACnBC,qBAAqB,EACrBC,oBAAoB,EACpBC,MAAM,EACNC,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACY;IACpB,MAAMC,UAAUxB,WAAWO;IAC3B,MAAMkB,eAAexB;IACrB,MAAMU,KAAKR,SAAS;QAAEuB,KAAKd;IAAO,GAAGY,QAAQG,aAAa,GAAGlB,OAAOmB,cAAcH;IAClF,MAAMI,SAASL,QAAQG,aAAa,GAAGH,QAAQM,WAAW,KAAKnB,KAAKE;IACpE,MAAMkB,0BAA0BP,QAAQG,aAAa,GAAGH,QAAQM,WAAW,KAAK,OAAO;IAEvF,MAAM,CAACE,WAAWC,aAAa,GAAG/B,SAASY,cAAc,QAAQ,CAACe;IAElEzB,0BACE,SAAS8B;QACP,IAAI,CAACpB,eAAee,QAAQ;YAC1BI,aAAa,CAACE,OAAUA,OAAO,QAAQA;QACzC;IACF,GACA;QAACN;QAAQf;KAAY;IAGvB,IAAIkB,WAAW;QACb,OAAO;YAAEI,SAAS;YAAOL;YAAyBpB;QAAG;IACvD;IAEA,OAAO;QACLA;QACAyB,SAAS;QACTvB,MAAMgB;QACNE;QACAf,iBAAiBA,mBAAmBQ,QAAQR,eAAe;QAC3DD,oBAAoBA,sBAAsBS,QAAQT,kBAAkB;QACpEE,qBAAqBA,uBAAuBO,QAAQP,mBAAmB;QACvEC,uBAAuBA,yBAAyBM,QAAQN,qBAAqB;QAC7EC,sBAAsBA,wBAAwBK,QAAQL,oBAAoB;QAC1Eb,cAAckB,QAAQG,aAAa,GAAGnB,6BAA6BF;QACnEc,QAAQA,UAAUiB,mBAAmB1B,IAAIa,QAAQJ,MAAM;QACvDC,UAAUA,YAAYgB,mBAAmB1B,IAAIa,QAAQH,QAAQ;QAC7DC,SAASA,WAAWe,mBAAmB1B,IAAIa,QAAQF,OAAO;QAC1DC,UAAU,SAASe,aAAa,GAAGC,IAAW;YAC5C,IAAI,CAACzB,aAAa;gBAChBmB,aAAa;YACf;YAEA,IAAIV,UAAU;gBACZA,YAAYgB;YACd,OAAO;gBACLf,QAAQD,QAAQ,GAAGZ;YACrB;QACF;IACF;AACF,EAAE;AAEF,SAAS0B,mBAAmB1B,EAAU,EAAE6B,EAAyC;IAC/E,OAAOA,KAAK,IAAMA,GAAG7B,MAAMiB;AAC7B"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["'use client';\n\nimport type { ChangeEvent, ChangeEventHandler } from 'react';\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMergeProps } from '../../hooks/useMergeProps';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { getFormFieldModeFromSelectType } from '../../lib/select';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HasAlign, HasDataAttribute, HasRootRef } from '../../types';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport type { SelectType } from '../Select/Select';\nimport { SelectTypography } from '../SelectTypography/SelectTypography';\nimport styles from '../Select/Select.module.css';\n\nconst warn = warnOnce('NativeSelect');\n\nconst densityClassNames = {\n  none: styles.densityNone,\n  compact: styles.densityCompact,\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 type NativeHTMLSelectProps = Omit<\n  React.SelectHTMLAttributes<HTMLSelectElement>,\n  'multiple' | 'value' | 'defaultValue' | 'onChange'\n>;\n\nexport interface NativeSelectProps\n  extends Pick<\n      React.SelectHTMLAttributes<HTMLSelectElement>,\n      'disabled' | 'required' | 'autoFocus' | 'name' | 'form' | 'onFocus' | 'onBlur' | 'onClick'\n    >,\n    Omit<\n      React.HTMLAttributes<HTMLDivElement>,\n      'defaultValue' | 'onChange' | 'onFocus' | 'onBlur' | 'onClick'\n    >,\n    HasRootRef<HTMLDivElement>,\n    HasAlign,\n    Pick<FormFieldProps, 'before' | 'status'> {\n  /**\n   * Свойства, которые можно прокинуть внутрь компонента:\n   * - `root`: свойства для прокидывания в корень компонента;\n   * - `select`: свойства для прокидывания в нативный `select`.\n   */\n  slotProps?: {\n    root?: Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> &\n      HasDataAttribute &\n      HasRootRef<HTMLDivElement>;\n    select?: NativeHTMLSelectProps & HasRootRef<HTMLSelectElement> & HasDataAttribute;\n  };\n  /**\n   * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ select: { getRootRef: ... } }`.\n   */\n  getRef?: React.Ref<HTMLSelectElement>;\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  // NativeSelectProps\n  children,\n  align,\n  placeholder,\n  multiline,\n  selectType = 'default',\n  status,\n  icon = <DropdownIcon />,\n  before,\n  onChange,\n  value,\n  defaultValue,\n  getRef,\n\n  // Select props\n  disabled,\n  required,\n  autoFocus,\n  id,\n  name,\n  form,\n  onClick,\n  onFocus,\n  onBlur,\n\n  slotProps,\n  ...restProps\n}: NativeSelectProps): React.ReactNode => {\n  /* istanbul ignore if: не проверяем в тестах */\n  if (process.env.NODE_ENV === 'development' && getRef) {\n    warn('Свойство `getRef` устаревшее, используйте `slotProps={ select: { getRootRef: ... } }`');\n  }\n\n  const [title, setTitle] = React.useState('');\n  const [empty, setEmpty] = React.useState(false);\n  const { density = 'none' } = useAdaptivity();\n\n  const { className, style, getRootRef, ...rootRest } = useMergeProps(restProps, slotProps?.root);\n\n  const { getRootRef: getSelectRef, ...selectRest } = useMergeProps(\n    { getRootRef: getRef, disabled, required, autoFocus, id, name, form, onClick, onFocus, onBlur },\n    slotProps?.select,\n  );\n\n  const selectRef = useExternRef(getSelectRef);\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        density !== 'regular' && densityClassNames[density],\n        className,\n      )}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={selectRest.disabled}\n      before={before}\n      after={icon}\n      status={status}\n      mode={getFormFieldModeFromSelectType(selectType)}\n      {...rootRest}\n    >\n      <RootComponent\n        Component=\"select\"\n        baseClassName={styles.el}\n        value={value !== undefined ? remapFromSelectValueToNativeValue(value) : value}\n        defaultValue={\n          defaultValue !== undefined\n            ? remapFromSelectValueToNativeValue(defaultValue)\n            : defaultValue\n        }\n        onChange={callMultiple(_onChange, checkSelectedOption)}\n        getRootRef={selectRef}\n        {...selectRest}\n      >\n        {placeholder && <option value={NOT_SELECTED.NATIVE}>{placeholder}</option>}\n        {children}\n      </RootComponent>\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","useMergeProps","callMultiple","getFormFieldModeFromSelectType","useIsomorphicLayoutEffect","warnOnce","DropdownIcon","FormField","RootComponent","SelectTypography","styles","warn","densityClassNames","none","densityNone","compact","densityCompact","NOT_SELECTED","NATIVE","CUSTOM","remapFromSelectValueToNativeValue","value","remapFromNativeValueToSelectValue","NativeSelect","children","align","placeholder","multiline","selectType","status","icon","before","onChange","defaultValue","getRef","disabled","required","autoFocus","id","name","form","onClick","onFocus","onBlur","slotProps","restProps","process","env","NODE_ENV","title","setTitle","useState","empty","setEmpty","density","className","style","getRootRef","rootRest","root","getSelectRef","selectRest","select","selectRef","checkSelectedOption","selectedOption","current","options","selectedIndex","text","_onChange","e","newValue","target","currentTarget","Component","host","hasBefore","alignCenter","alignRight","after","mode","baseClassName","el","undefined","option","div","container","aria-hidden"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["'use client';\n\nimport type { ChangeEvent, ChangeEventHandler } from 'react';\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMergeProps } from '../../hooks/useMergeProps';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { getFormFieldModeFromSelectType } from '../../lib/select';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HasAlign, HasDataAttribute, HasRootRef } from '../../types';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport type { SelectType } from '../Select/Select';\nimport { SelectTypography } from '../SelectTypography/SelectTypography';\nimport styles from '../Select/Select.module.css';\n\nconst warn = warnOnce('NativeSelect');\n\nconst densityClassNames = {\n  none: styles.densityNone,\n  compact: styles.densityCompact,\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 type NativeHTMLSelectProps = Omit<\n  React.SelectHTMLAttributes<HTMLSelectElement>,\n  'multiple' | 'value' | 'defaultValue' | 'onChange'\n>;\n\nexport interface NativeSelectProps\n  extends Pick<\n      React.SelectHTMLAttributes<HTMLSelectElement>,\n      'disabled' | 'required' | 'autoFocus' | 'name' | 'form' | 'onFocus' | 'onBlur' | 'onClick'\n    >,\n    Omit<\n      React.HTMLAttributes<HTMLDivElement>,\n      'defaultValue' | 'onChange' | 'onFocus' | 'onBlur' | 'onClick'\n    >,\n    HasRootRef<HTMLDivElement>,\n    HasAlign,\n    Pick<FormFieldProps, 'before' | 'status'> {\n  /**\n   * Свойства, которые можно прокинуть внутрь компонента:\n   * - `root`: свойства для прокидывания в корень компонента;\n   * - `select`: свойства для прокидывания в нативный `select`.\n   */\n  slotProps?:\n    | {\n        root?:\n          | (Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> &\n              HasDataAttribute &\n              HasRootRef<HTMLDivElement>)\n          | undefined;\n        select?:\n          | (NativeHTMLSelectProps & HasRootRef<HTMLSelectElement> & HasDataAttribute)\n          | undefined;\n      }\n    | undefined;\n  /**\n   * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ select: { getRootRef: ... } }`.\n   */\n  getRef?: React.Ref<HTMLSelectElement> | undefined;\n  /**\n   * Выбранное значение.\n   *\n   * > ⚠️  Важно: При прокидывании `undefined` компонент будет считаться `Uncontrolled`.\n   * >\n   * > Не используйте `undefined`, чтобы показать невыбранное состояние. Вместо этого используйте `null`.\n   */\n  value?: SelectValue | undefined;\n  /**\n   * См. `value`.\n   */\n  defaultValue?: SelectValue | undefined;\n  /**\n   * Обработчик, срабатывающий при изменении выбранного значения.\n   * Вторым параметром прокидывается новое значение.\n   *\n   * > ⚠️ Лучше использовать второй параметр при работе с компонентом.\n   */\n  onChange?: ((e: ChangeEvent<HTMLSelectElement>, newValue: SelectValue) => void) | undefined;\n  /**\n   * Текст-подсказка при отсутствии выбранного значения.\n   */\n  placeholder?: string | undefined;\n  /**\n   * Флаг для включения многострочного режима.\n   */\n  multiline?: boolean | undefined;\n  /**\n   * Тип селекта, влияющий на отображение.\n   */\n  selectType?: SelectType | undefined;\n  /**\n   * Иконка раскрывающегося списка.\n   */\n  icon?: React.ReactNode | undefined;\n}\n\n/**\n * @see https://vkui.io/components/native-select\n */\nexport const NativeSelect = ({\n  // NativeSelectProps\n  children,\n  align,\n  placeholder,\n  multiline,\n  selectType = 'default',\n  status,\n  icon = <DropdownIcon />,\n  before,\n  onChange,\n  value,\n  defaultValue,\n  getRef,\n\n  // Select props\n  disabled,\n  required,\n  autoFocus,\n  id,\n  name,\n  form,\n  onClick,\n  onFocus,\n  onBlur,\n\n  slotProps,\n  ...restProps\n}: NativeSelectProps): React.ReactNode => {\n  /* istanbul ignore if: не проверяем в тестах */\n  if (process.env.NODE_ENV === 'development' && getRef) {\n    warn('Свойство `getRef` устаревшее, используйте `slotProps={ select: { getRootRef: ... } }`');\n  }\n\n  const [title, setTitle] = React.useState('');\n  const [empty, setEmpty] = React.useState(false);\n  const { density = 'none' } = useAdaptivity();\n\n  const { className, style, getRootRef, ...rootRest } = useMergeProps(restProps, slotProps?.root);\n\n  const { getRootRef: getSelectRef, ...selectRest } = useMergeProps(\n    { getRootRef: getRef, disabled, required, autoFocus, id, name, form, onClick, onFocus, onBlur },\n    slotProps?.select,\n  );\n\n  const selectRef = useExternRef(getSelectRef);\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        density !== 'regular' && densityClassNames[density],\n        className,\n      )}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={selectRest.disabled}\n      before={before}\n      after={icon}\n      status={status}\n      mode={getFormFieldModeFromSelectType(selectType)}\n      {...rootRest}\n    >\n      <RootComponent\n        Component=\"select\"\n        baseClassName={styles.el}\n        value={value !== undefined ? remapFromSelectValueToNativeValue(value) : value}\n        defaultValue={\n          defaultValue !== undefined\n            ? remapFromSelectValueToNativeValue(defaultValue)\n            : defaultValue\n        }\n        onChange={callMultiple(_onChange, checkSelectedOption)}\n        getRootRef={selectRef}\n        {...selectRest}\n      >\n        {placeholder && <option value={NOT_SELECTED.NATIVE}>{placeholder}</option>}\n        {children}\n      </RootComponent>\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","useMergeProps","callMultiple","getFormFieldModeFromSelectType","useIsomorphicLayoutEffect","warnOnce","DropdownIcon","FormField","RootComponent","SelectTypography","styles","warn","densityClassNames","none","densityNone","compact","densityCompact","NOT_SELECTED","NATIVE","CUSTOM","remapFromSelectValueToNativeValue","value","remapFromNativeValueToSelectValue","NativeSelect","children","align","placeholder","multiline","selectType","status","icon","before","onChange","defaultValue","getRef","disabled","required","autoFocus","id","name","form","onClick","onFocus","onBlur","slotProps","restProps","process","env","NODE_ENV","title","setTitle","useState","empty","setEmpty","density","className","style","getRootRef","rootRest","root","getSelectRef","selectRest","select","selectRef","checkSelectedOption","selectedOption","current","options","selectedIndex","text","_onChange","e","newValue","target","currentTarget","Component","host","hasBefore","alignCenter","alignRight","after","mode","baseClassName","el","undefined","option","div","container","aria-hidden"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/NumberInputLike/NumberInputLike.tsx"],"sourcesContent":["'use client';\n\nimport { InputLike, type InputLikeProps } from '../InputLike/InputLike';\n/* eslint-disable jsdoc/require-jsdoc */\n\nexport interface NumberInputLikeProps extends Omit<InputLikeProps, 'value'> {\n  value?: number | string;\n  maxValue?: number;\n  minValue?: number;\n}\n\nconst stringifyValue = (\n  value: NumberInputLikeProps['value'],\n  length: number,\n): string | undefined => {\n  if (value === undefined) {\n    return undefined;\n  }\n  if (typeof value === 'string') {\n    return value;\n  }\n  return String(value).padStart(length, '0');\n};\n\nexport const NumberInputLike: React.FC<NumberInputLikeProps> = ({\n  value,\n  length,\n  minValue,\n  maxValue,\n  readOnly,\n  disabled,\n  label,\n  onKeyDown,\n  'aria-label': ariaLabel,\n  ...restProps\n}) => {\n  const stringValue = stringifyValue(value, length);\n  return (\n    <InputLike\n      role=\"spinbutton\"\n      value={stringValue}\n      length={length}\n      aria-valuemin={minValue}\n      aria-valuemax={maxValue}\n      aria-valuenow={value !== undefined ? Number(value) : undefined}\n      aria-valuetext={stringValue}\n      aria-readonly={readOnly}\n      aria-disabled={disabled}\n      aria-label={label}\n      label={label}\n      tabIndex={readOnly ? -1 : 0}\n      onKeyDown={readOnly ? undefined : onKeyDown}\n      {...restProps}\n    />\n  );\n};\n"],"names":["InputLike","stringifyValue","value","length","undefined","String","padStart","NumberInputLike","minValue","maxValue","readOnly","disabled","label","onKeyDown","ariaLabel","restProps","stringValue","role","aria-valuemin","aria-valuemax","aria-valuenow","Number","aria-valuetext","aria-readonly","aria-disabled","aria-label","tabIndex"],"mappings":"AAAA;;AAEA,SAASA,SAAS,QAA6B,4BAAyB;AASxE,MAAMC,iBAAiB,CACrBC,OACAC;IAEA,IAAID,UAAUE,WAAW;QACvB,OAAOA;IACT;IACA,IAAI,OAAOF,UAAU,UAAU;QAC7B,OAAOA;IACT;IACA,OAAOG,OAAOH,OAAOI,QAAQ,CAACH,QAAQ;AACxC;AAEA,OAAO,MAAMI,kBAAkD,CAAC,EAC9DL,KAAK,EACLC,MAAM,EACNK,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,KAAK,EACLC,SAAS,EACT,cAAcC,SAAS,EACvB,GAAGC,WACJ;IACC,MAAMC,cAAcf,eAAeC,OAAOC;IAC1C,qBACE,KAACH;QACCiB,MAAK;QACLf,OAAOc;QACPb,QAAQA;QACRe,iBAAeV;QACfW,iBAAeV;QACfW,iBAAelB,UAAUE,YAAYiB,OAAOnB,SAASE;QACrDkB,kBAAgBN;QAChBO,iBAAeb;QACfc,iBAAeb;QACfc,cAAYb;QACZA,OAAOA;QACPc,UAAUhB,WAAW,CAAC,IAAI;QAC1BG,WAAWH,WAAWN,YAAYS;QACjC,GAAGE,SAAS;;AAGnB,EAAE"}
+{"version":3,"sources":["../../../../src/components/NumberInputLike/NumberInputLike.tsx"],"sourcesContent":["'use client';\n\nimport { InputLike, type InputLikeProps } from '../InputLike/InputLike';\n/* eslint-disable jsdoc/require-jsdoc */\n\nexport interface NumberInputLikeProps extends Omit<InputLikeProps, 'value'> {\n  value?: number | string | undefined;\n  maxValue?: number | undefined;\n  minValue?: number | undefined;\n}\n\nconst stringifyValue = (\n  value: NumberInputLikeProps['value'],\n  length: number,\n): string | undefined => {\n  if (value === undefined) {\n    return undefined;\n  }\n  if (typeof value === 'string') {\n    return value;\n  }\n  return String(value).padStart(length, '0');\n};\n\nexport const NumberInputLike: React.FC<NumberInputLikeProps> = ({\n  value,\n  length,\n  minValue,\n  maxValue,\n  readOnly,\n  disabled,\n  label,\n  onKeyDown,\n  'aria-label': ariaLabel,\n  ...restProps\n}) => {\n  const stringValue = stringifyValue(value, length);\n  return (\n    <InputLike\n      role=\"spinbutton\"\n      value={stringValue}\n      length={length}\n      aria-valuemin={minValue}\n      aria-valuemax={maxValue}\n      aria-valuenow={value !== undefined ? Number(value) : undefined}\n      aria-valuetext={stringValue}\n      aria-readonly={readOnly}\n      aria-disabled={disabled}\n      aria-label={label}\n      label={label}\n      tabIndex={readOnly ? -1 : 0}\n      onKeyDown={readOnly ? undefined : onKeyDown}\n      {...restProps}\n    />\n  );\n};\n"],"names":["InputLike","stringifyValue","value","length","undefined","String","padStart","NumberInputLike","minValue","maxValue","readOnly","disabled","label","onKeyDown","ariaLabel","restProps","stringValue","role","aria-valuemin","aria-valuemax","aria-valuenow","Number","aria-valuetext","aria-readonly","aria-disabled","aria-label","tabIndex"],"mappings":"AAAA;;AAEA,SAASA,SAAS,QAA6B,4BAAyB;AASxE,MAAMC,iBAAiB,CACrBC,OACAC;IAEA,IAAID,UAAUE,WAAW;QACvB,OAAOA;IACT;IACA,IAAI,OAAOF,UAAU,UAAU;QAC7B,OAAOA;IACT;IACA,OAAOG,OAAOH,OAAOI,QAAQ,CAACH,QAAQ;AACxC;AAEA,OAAO,MAAMI,kBAAkD,CAAC,EAC9DL,KAAK,EACLC,MAAM,EACNK,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,KAAK,EACLC,SAAS,EACT,cAAcC,SAAS,EACvB,GAAGC,WACJ;IACC,MAAMC,cAAcf,eAAeC,OAAOC;IAC1C,qBACE,KAACH;QACCiB,MAAK;QACLf,OAAOc;QACPb,QAAQA;QACRe,iBAAeV;QACfW,iBAAeV;QACfW,iBAAelB,UAAUE,YAAYiB,OAAOnB,SAASE;QACrDkB,kBAAgBN;QAChBO,iBAAeb;QACfc,iBAAeb;QACfc,cAAYb;QACZA,OAAOA;QACPc,UAAUhB,WAAW,CAAC,IAAI;QAC1BG,WAAWH,WAAWN,YAAYS;QACjC,GAAGE,SAAS;;AAGnB,EAAE"}

package/dist/cssm/components/OnboardingTooltip/OnboardingTooltip.js

@@ -42,11 +42,17 @@ const warn = warnOnce('OnboardingTooltip');
         overflowPadding
     });
     const isLock = React.useContext(LockFloatingPositionContext);
-    const { x: floatingDataX, y: floatingDataY, refs, placement: resolvedPlacement, middlewareData: { arrow: arrowCoords } } = useFloating({
+    const { x: floatingDataX, y: floatingDataY, isPositioned, refs, placement: resolvedPlacement, middlewareData: { arrow: arrowCoords } } = useFloating({
         strategy: positionStrategy,
-        placement: strictPlacement,
+        ...strictPlacement !== undefined && {
+            placement: strictPlacement
+        },
         middleware: middlewares,
-        whileElementsMounted: isLock ? undefined : autoUpdateFloatingElement
+        ...!isLock && {
+            whileElementsMounted: (...args)=>autoUpdateFloatingElement(...args, {
+                    elementResize: true
+                })
+        }
     });
     const tooltipRef = useExternRef(getRootRef, refs.setFloating);
     const focusTrapRootRef = React.useRef(null);
@@ -66,6 +72,9 @@ const warn = warnOnce('OnboardingTooltip');
             x: floatingDataX,
             y: floatingDataY
         });
+        if (!isPositioned) {
+            floatingStyle.visibility = 'hidden';
+        }
         tooltip = createPortal(/*#__PURE__*/ _jsx(FocusTrap, {
             rootRef: focusTrapRootRef,
             disabled: disableFocusTrap,