@vkontakte/vkui 8.0.0-rc.5 → 8.0.0

package/dist/components/Accordion/Accordion.js

@@ -8,8 +8,8 @@ import { AccordionContext } from "./AccordionContext.js";
 import { AccordionSummary } from "./AccordionSummary.js";
 function useAccordionId(id) {
     const generatedId = React.useId();
-    const labelId = id !== null && id !== void 0 ? id : `Accordion${generatedId}`;
-    const contentId = `AccordionContent${id !== null && id !== void 0 ? id : generatedId}`;
+    const labelId = id ?? `Accordion${generatedId}`;
+    const contentId = `AccordionContent${id ?? generatedId}`;
     return {
         labelId,
         contentId

package/dist/components/Accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useCustomEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';\nimport type { HasChildren } from '../../types';\nimport { AccordionContent } from './AccordionContent';\nimport { AccordionContext, type AccordionContextProps } from './AccordionContext';\nimport { AccordionSummary } from './AccordionSummary';\n\nfunction useAccordionId(id: AccordionProps['id']) {\n  const generatedId = React.useId();\n  const labelId = id ?? `Accordion${generatedId}`;\n  const contentId = `AccordionContent${id ?? generatedId}`;\n\n  return { labelId, contentId };\n}\n\nexport interface AccordionProps extends HasChildren {\n  /**\n   * Используется для генерации id для заголовка и контента(a11y).\n   */\n  id?: string;\n  /**\n   * Управляет раскрытием и скрытием контента.\n   */\n  expanded?: boolean;\n  /**\n   * Значение по умолчанию.\n   */\n  defaultExpanded?: boolean;\n  /**\n   * Возвращает новое значение при изменении раскрытия/сворачивания контента.\n   */\n  onChange?: (newValue: boolean) => void;\n  /**\n   * Блокировка взаимодействия с компонентом.\n   */\n  disabled?: boolean;\n  /**\n   * Нужно ли удалять из DOM контент при сворачивании.\n   */\n  unmountOnCollapsed?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/accordion\n */\nexport const Accordion: React.FC<AccordionProps> & {\n  Summary: typeof AccordionSummary;\n  Content: typeof AccordionContent;\n} = ({\n  id,\n  expanded: expandedProp,\n  defaultExpanded = false,\n  onChange: onChangeProp,\n  children,\n  unmountOnCollapsed = false,\n  ...restProps\n}: AccordionProps) => {\n  const { labelId, contentId } = useAccordionId(id);\n\n  const [expanded, onChange] = useCustomEnsuredControl({\n    value: expandedProp,\n    defaultValue: defaultExpanded,\n    onChange: onChangeProp,\n    disabled: restProps.disabled,\n  });\n\n  const context = React.useMemo<AccordionContextProps>(\n    () => ({\n      labelId,\n      contentId,\n      expanded: expanded || false,\n      unmountOnCollapsed,\n      onChange,\n    }),\n    [contentId, expanded, labelId, onChange, unmountOnCollapsed],\n  );\n\n  return <AccordionContext.Provider value={context}>{children}</AccordionContext.Provider>;\n};\n\nAccordion.Summary = AccordionSummary;\nAccordion.Content = AccordionContent;\n\nif (process.env.NODE_ENV !== 'production') {\n  defineComponentDisplayNames(Accordion.Summary, 'Accordion.Summary');\n  defineComponentDisplayNames(Accordion.Content, 'Accordion.Content');\n}\n"],"names":["React","useCustomEnsuredControl","defineComponentDisplayNames","AccordionContent","AccordionContext","AccordionSummary","useAccordionId","id","generatedId","useId","labelId","contentId","Accordion","expanded","expandedProp","defaultExpanded","onChange","onChangeProp","children","unmountOnCollapsed","restProps","value","defaultValue","disabled","context","useMemo","Provider","Summary","Content","process","env","NODE_ENV"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mCAAgC;AACxE,SAASC,2BAA2B,QAAQ,iDAA8C;AAE1F,SAASC,gBAAgB,QAAQ,wBAAqB;AACtD,SAASC,gBAAgB,QAAoC,wBAAqB;AAClF,SAASC,gBAAgB,QAAQ,wBAAqB;AAEtD,SAASC,eAAeC,EAAwB;IAC9C,MAAMC,cAAcR,MAAMS,KAAK;IAC/B,MAAMC,UAAUH,eAAAA,gBAAAA,KAAM,CAAC,SAAS,EAAEC,aAAa;IAC/C,MAAMG,YAAY,CAAC,gBAAgB,EAAEJ,eAAAA,gBAAAA,KAAMC,aAAa;IAExD,OAAO;QAAEE;QAASC;IAAU;AAC9B;AA6BA;;CAEC,GACD,OAAO,MAAMC,YAGT,CAAC,EACHL,EAAE,EACFM,UAAUC,YAAY,EACtBC,kBAAkB,KAAK,EACvBC,UAAUC,YAAY,EACtBC,QAAQ,EACRC,qBAAqB,KAAK,EAC1B,GAAGC,WACY;IACf,MAAM,EAAEV,OAAO,EAAEC,SAAS,EAAE,GAAGL,eAAeC;IAE9C,MAAM,CAACM,UAAUG,SAAS,GAAGf,wBAAwB;QACnDoB,OAAOP;QACPQ,cAAcP;QACdC,UAAUC;QACVM,UAAUH,UAAUG,QAAQ;IAC9B;IAEA,MAAMC,UAAUxB,MAAMyB,OAAO,CAC3B,IAAO,CAAA;YACLf;YACAC;YACAE,UAAUA,YAAY;YACtBM;YACAH;QACF,CAAA,GACA;QAACL;QAAWE;QAAUH;QAASM;QAAUG;KAAmB;IAG9D,qBAAO,KAACf,iBAAiBsB,QAAQ;QAACL,OAAOG;kBAAUN;;AACrD,EAAE;AAEFN,UAAUe,OAAO,GAAGtB;AACpBO,UAAUgB,OAAO,GAAGzB;AAEpB,IAAI0B,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;IACzC7B,4BAA4BU,UAAUe,OAAO,EAAE;IAC/CzB,4BAA4BU,UAAUgB,OAAO,EAAE;AACjD"}
+{"version":3,"sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useCustomEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';\nimport type { HasChildren } from '../../types';\nimport { AccordionContent } from './AccordionContent';\nimport { AccordionContext, type AccordionContextProps } from './AccordionContext';\nimport { AccordionSummary } from './AccordionSummary';\n\nfunction useAccordionId(id: AccordionProps['id']) {\n  const generatedId = React.useId();\n  const labelId = id ?? `Accordion${generatedId}`;\n  const contentId = `AccordionContent${id ?? generatedId}`;\n\n  return { labelId, contentId };\n}\n\nexport interface AccordionProps extends HasChildren {\n  /**\n   * Используется для генерации id для заголовка и контента(a11y).\n   */\n  id?: string;\n  /**\n   * Управляет раскрытием и скрытием контента.\n   */\n  expanded?: boolean;\n  /**\n   * Значение по умолчанию.\n   */\n  defaultExpanded?: boolean;\n  /**\n   * Возвращает новое значение при изменении раскрытия/сворачивания контента.\n   */\n  onChange?: (newValue: boolean) => void;\n  /**\n   * Блокировка взаимодействия с компонентом.\n   */\n  disabled?: boolean;\n  /**\n   * Нужно ли удалять из DOM контент при сворачивании.\n   */\n  unmountOnCollapsed?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/accordion\n */\nexport const Accordion: React.FC<AccordionProps> & {\n  Summary: typeof AccordionSummary;\n  Content: typeof AccordionContent;\n} = ({\n  id,\n  expanded: expandedProp,\n  defaultExpanded = false,\n  onChange: onChangeProp,\n  children,\n  unmountOnCollapsed = false,\n  ...restProps\n}: AccordionProps) => {\n  const { labelId, contentId } = useAccordionId(id);\n\n  const [expanded, onChange] = useCustomEnsuredControl({\n    value: expandedProp,\n    defaultValue: defaultExpanded,\n    onChange: onChangeProp,\n    disabled: restProps.disabled,\n  });\n\n  const context = React.useMemo<AccordionContextProps>(\n    () => ({\n      labelId,\n      contentId,\n      expanded: expanded || false,\n      unmountOnCollapsed,\n      onChange,\n    }),\n    [contentId, expanded, labelId, onChange, unmountOnCollapsed],\n  );\n\n  return <AccordionContext.Provider value={context}>{children}</AccordionContext.Provider>;\n};\n\nAccordion.Summary = AccordionSummary;\nAccordion.Content = AccordionContent;\n\nif (process.env.NODE_ENV !== 'production') {\n  defineComponentDisplayNames(Accordion.Summary, 'Accordion.Summary');\n  defineComponentDisplayNames(Accordion.Content, 'Accordion.Content');\n}\n"],"names":["React","useCustomEnsuredControl","defineComponentDisplayNames","AccordionContent","AccordionContext","AccordionSummary","useAccordionId","id","generatedId","useId","labelId","contentId","Accordion","expanded","expandedProp","defaultExpanded","onChange","onChangeProp","children","unmountOnCollapsed","restProps","value","defaultValue","disabled","context","useMemo","Provider","Summary","Content","process","env","NODE_ENV"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mCAAgC;AACxE,SAASC,2BAA2B,QAAQ,iDAA8C;AAE1F,SAASC,gBAAgB,QAAQ,wBAAqB;AACtD,SAASC,gBAAgB,QAAoC,wBAAqB;AAClF,SAASC,gBAAgB,QAAQ,wBAAqB;AAEtD,SAASC,eAAeC,EAAwB;IAC9C,MAAMC,cAAcR,MAAMS,KAAK;IAC/B,MAAMC,UAAUH,MAAM,CAAC,SAAS,EAAEC,aAAa;IAC/C,MAAMG,YAAY,CAAC,gBAAgB,EAAEJ,MAAMC,aAAa;IAExD,OAAO;QAAEE;QAASC;IAAU;AAC9B;AA6BA;;CAEC,GACD,OAAO,MAAMC,YAGT,CAAC,EACHL,EAAE,EACFM,UAAUC,YAAY,EACtBC,kBAAkB,KAAK,EACvBC,UAAUC,YAAY,EACtBC,QAAQ,EACRC,qBAAqB,KAAK,EAC1B,GAAGC,WACY;IACf,MAAM,EAAEV,OAAO,EAAEC,SAAS,EAAE,GAAGL,eAAeC;IAE9C,MAAM,CAACM,UAAUG,SAAS,GAAGf,wBAAwB;QACnDoB,OAAOP;QACPQ,cAAcP;QACdC,UAAUC;QACVM,UAAUH,UAAUG,QAAQ;IAC9B;IAEA,MAAMC,UAAUxB,MAAMyB,OAAO,CAC3B,IAAO,CAAA;YACLf;YACAC;YACAE,UAAUA,YAAY;YACtBM;YACAH;QACF,CAAA,GACA;QAACL;QAAWE;QAAUH;QAASM;QAAUG;KAAmB;IAG9D,qBAAO,KAACf,iBAAiBsB,QAAQ;QAACL,OAAOG;kBAAUN;;AACrD,EAAE;AAEFN,UAAUe,OAAO,GAAGtB;AACpBO,UAAUgB,OAAO,GAAGzB;AAEpB,IAAI0B,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;IACzC7B,4BAA4BU,UAAUe,OAAO,EAAE;IAC/CzB,4BAA4BU,UAAUgB,OAAO,EAAE;AACjD"}

package/dist/components/ActionSheet/ActionSheet.js

@@ -40,7 +40,7 @@ import { ActionSheetDropdownSheet } from "./ActionSheetDropdownSheet.js";
         }
     });
     const { isDesktop } = useAdaptivityWithJSMediaQueries();
-    const mode = modeProp !== null && modeProp !== void 0 ? modeProp : isDesktop ? 'menu' : 'sheet';
+    const mode = modeProp ?? (isDesktop ? 'menu' : 'sheet');
     useScrollLock(mode === 'sheet');
     const onItemClick = React.useCallback(({ action, immediateAction, autoClose, isCancelItem })=>(event)=>{
             event.persist();
@@ -104,8 +104,8 @@ import { ActionSheetDropdownSheet } from "./ActionSheetDropdownSheet.js";
                 }),
                 platform === 'ios' && mode === 'sheet' && /*#__PURE__*/ _jsx("div", {
                     className: "vkuiActionSheet__closeItemWrapperIos",
-                    children: iosCloseItem !== null && iosCloseItem !== void 0 ? iosCloseItem : /*#__PURE__*/ _jsx(ActionSheetDefaultIosCloseItem, {
-                        ...slotProps === null || slotProps === void 0 ? void 0 : slotProps.iosCloseItem
+                    children: iosCloseItem ?? /*#__PURE__*/ _jsx(ActionSheetDefaultIosCloseItem, {
+                        ...slotProps?.iosCloseItem
                     })
                 })
             ]

package/dist/components/ActionSheet/ActionSheet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ActionSheet/ActionSheet.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useStableCallback } from '../../hooks/useStableCallback';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport type { HasRootRef } from '../../types';\nimport type { ActionSheetItemProps } from '../ActionSheetItem/ActionSheetItem';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport {\n  ActionSheetContext,\n  type ActionSheetContextType,\n  type ItemClickHandler,\n} from './ActionSheetContext';\nimport { ActionSheetDefaultIosCloseItem } from './ActionSheetDefaultIosCloseItem';\nimport { ActionSheetDropdownMenu } from './ActionSheetDropdownMenu';\nimport { ActionSheetDropdownSheet } from './ActionSheetDropdownSheet';\nimport type { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nexport type ActionSheetOnCloseReason =\n  | 'click-action-item'\n  | 'click-cancel-item'\n  | 'click-overlay'\n  | 'keydown-item'\n  | 'escape-key';\n\nexport type ActionSheetOnClosedReason = 'action-item' | 'cancel-item' | 'other';\n\n/**\n * @deprecated Since 8.0.0 аргумент, переданный в функцию `onClosed`, устарел и будет удален в **VKUI v10**.\n * Для получения причины закрытия всплывающего окна используйте свойство `onClose`.\n */\nexport interface ActionSheetOnCloseOptions {\n  /**\n   * Причина закрытия всплывающего элемента.\n   *\n   * @deprecated Since 8.0.0 аргумент, переданный в функцию `onClosed`, устарел и будет удален в **VKUI v10**.\n   * Для получения причины закрытия всплывающего окна используйте свойство `onClose`.\n   */\n  closedBy: ActionSheetOnClosedReason;\n}\n\nexport interface ActionSheetProps\n  extends Pick<\n      SharedDropdownProps,\n      | 'toggleRef'\n      | 'popupOffsetDistance'\n      | 'placement'\n      | 'allowClickPropagation'\n      | 'timeout'\n      | 'restoreFocus'\n      | 'autoFocus'\n    >,\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'autoFocus' | 'title'> {\n  /**\n   * Заголовок всплывающего окна.\n   */\n  title?: React.ReactNode;\n  /**\n   * Описание всплывающего окна, под заголовком.\n   */\n  description?: React.ReactNode;\n  /**\n   * Обработчик закрытия всплывающего окна.\n   */\n  onClose?: (reason: ActionSheetOnCloseReason) => void;\n  /**\n   * Обработчик закрытия всплывающего окна срабатывающий после завершения анимации закрытия.\n   *\n   * > Since 8.0.0 аргумент, переданный в данную функцию, устарел и будет удален в **VKUI v10**.\n   * > Для получения причины закрытия всплывающего окна используйте свойство `onClose`.\n   */\n  onClosed: (options: ActionSheetOnCloseOptions) => void;\n  /**\n   * Только мобильный iOS.\n   */\n  iosCloseItem?: React.ReactNode;\n  /**\n   * Свойства, которые можно прокинуть внутрь компонента:\n   * - `iosCloseItem`: свойства для прокидывания в кнопку отмены на iOS.\n   */\n  slotProps?: {\n    iosCloseItem?: Omit<ActionSheetItemProps, 'mode' | 'isCancelItem'> & HasRootRef<HTMLElement>;\n  };\n  /**\n   * Режим отображения компонента:\n   *\n   * - `sheet` – отображение снизу экрана в виде всплывающего окна, подходит для мобильных устройств\n   * - `menu` – отображение в виде всплывающего элемента, относительно якорного элемента.\n   */\n  mode?: 'sheet' | 'menu';\n  /**\n   * @deprecated Since 7.3.0.  Будет удалeно в **VKUI v9**.\n   */\n  mount?: boolean; // TODO [>=9]: удалить неиспользуемое свойство\n  /**\n   * @deprecated Since 7.3.0. Будет удалeно в **VKUI v9**.\n   */\n  disabled?: boolean; // TODO [>=9]: удалить неиспользуемое свойство\n}\n\n/**\n * @see https://vkui.io/components/action-sheet\n */\nexport const ActionSheet = ({\n  children,\n  className,\n  title,\n  description,\n  style,\n  iosCloseItem,\n  slotProps,\n  popupOffsetDistance,\n  placement,\n  mode: modeProp,\n  onClose: onCloseProp,\n  onClosed,\n  ...restProps\n}: ActionSheetProps): React.ReactNode => {\n  const platform = usePlatform();\n  const [closedReason, setClosedReason] = React.useState<undefined | ActionSheetOnClosedReason>(\n    undefined,\n  );\n  const onCloseStable = useStableCallback(onCloseProp || noop);\n\n  const onClose = React.useCallback(\n    (onCloseReason: ActionSheetOnCloseReason, onClosedReason: ActionSheetOnClosedReason) => {\n      onCloseStable(onCloseReason);\n      setClosedReason(onClosedReason);\n    },\n    [onCloseStable],\n  );\n\n  const onOverlayClick = React.useCallback(() => onClose('click-overlay', 'other'), [onClose]);\n\n  const actionCallbackRef = React.useRef(noop);\n\n  const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n    closedReason !== undefined ? 'exit' : 'enter',\n    {\n      onExited() {\n        onClosed({ closedBy: closedReason || 'other' });\n        actionCallbackRef.current();\n        actionCallbackRef.current = noop;\n      },\n    },\n  );\n\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const mode = modeProp ?? (isDesktop ? 'menu' : 'sheet');\n\n  useScrollLock(mode === 'sheet');\n\n  const onItemClick = React.useCallback<ItemClickHandler>(\n    ({ action, immediateAction, autoClose, isCancelItem }) =>\n      (event) => {\n        event.persist();\n        immediateAction && immediateAction(event);\n        if (autoClose) {\n          if (action) {\n            actionCallbackRef.current = () => action(event);\n          }\n          onClose(\n            isCancelItem ? 'click-cancel-item' : 'click-action-item',\n            isCancelItem ? 'cancel-item' : 'action-item',\n          );\n        } else {\n          action && action(event);\n        }\n      },\n    [onClose],\n  );\n  const contextValue = React.useMemo<ActionSheetContextType>(\n    () => ({ onItemClick, mode, onClose: (reason) => onClose(reason, 'other') }),\n    [mode, onClose, onItemClick],\n  );\n\n  const DropdownComponent = mode === 'menu' ? ActionSheetDropdownMenu : ActionSheetDropdownSheet;\n\n  const dropdownProps =\n    mode === 'menu' ? Object.assign(restProps, { popupOffsetDistance, placement }) : restProps;\n\n  const actionSheet = (\n    <ActionSheetContext.Provider value={contextValue}>\n      <DropdownComponent\n        closing={Boolean(closedReason)}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        autoFocus={animationState === 'entered'}\n        {...dropdownProps}\n        {...animationHandlers}\n        className={mode === 'menu' ? className : undefined}\n        style={mode === 'menu' ? style : undefined}\n      >\n        <div className={styles.contentWrapper}>\n          {(title || description) && (\n            <div className={styles.header}>\n              {title && (\n                <Footnote weight=\"2\" className={styles.title}>\n                  {title}\n                </Footnote>\n              )}\n              {description && <Footnote className={styles.description}>{description}</Footnote>}\n            </div>\n          )}\n          {children}\n        </div>\n        {platform === 'ios' && mode === 'sheet' && (\n          <div className={styles.closeItemWrapperIos}>\n            {iosCloseItem ?? <ActionSheetDefaultIosCloseItem {...slotProps?.iosCloseItem} />}\n          </div>\n        )}\n      </DropdownComponent>\n    </ActionSheetContext.Provider>\n  );\n\n  return (\n    <AppRootPortal>\n      <PopoutWrapper\n        noBackground={mode === 'menu'}\n        closing={Boolean(closedReason)}\n        alignY=\"bottom\"\n        className={className}\n        style={style}\n        onClick={onOverlayClick}\n      >\n        {actionSheet}\n      </PopoutWrapper>\n    </AppRootPortal>\n  );\n};\n"],"names":["React","noop","useAdaptivityWithJSMediaQueries","usePlatform","useStableCallback","useCSSKeyframesAnimationController","AppRootPortal","useScrollLock","PopoutWrapper","Footnote","ActionSheetContext","ActionSheetDefaultIosCloseItem","ActionSheetDropdownMenu","ActionSheetDropdownSheet","ActionSheet","children","className","title","description","style","iosCloseItem","slotProps","popupOffsetDistance","placement","mode","modeProp","onClose","onCloseProp","onClosed","restProps","platform","closedReason","setClosedReason","useState","undefined","onCloseStable","useCallback","onCloseReason","onClosedReason","onOverlayClick","actionCallbackRef","useRef","animationState","animationHandlers","onExited","closedBy","current","isDesktop","onItemClick","action","immediateAction","autoClose","isCancelItem","event","persist","contextValue","useMemo","reason","DropdownComponent","dropdownProps","Object","assign","actionSheet","Provider","value","closing","Boolean","role","aria-modal","autoFocus","div","weight","noBackground","alignY","onClick"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/ActionSheet/ActionSheet.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useStableCallback } from '../../hooks/useStableCallback';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport type { HasRootRef } from '../../types';\nimport type { ActionSheetItemProps } from '../ActionSheetItem/ActionSheetItem';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport {\n  ActionSheetContext,\n  type ActionSheetContextType,\n  type ItemClickHandler,\n} from './ActionSheetContext';\nimport { ActionSheetDefaultIosCloseItem } from './ActionSheetDefaultIosCloseItem';\nimport { ActionSheetDropdownMenu } from './ActionSheetDropdownMenu';\nimport { ActionSheetDropdownSheet } from './ActionSheetDropdownSheet';\nimport type { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nexport type ActionSheetOnCloseReason =\n  | 'click-action-item'\n  | 'click-cancel-item'\n  | 'click-overlay'\n  | 'keydown-item'\n  | 'escape-key';\n\nexport type ActionSheetOnClosedReason = 'action-item' | 'cancel-item' | 'other';\n\n/**\n * @deprecated Since 8.0.0 аргумент, переданный в функцию `onClosed`, устарел и будет удален в **VKUI v10**.\n * Для получения причины закрытия всплывающего окна используйте свойство `onClose`.\n */\nexport interface ActionSheetOnCloseOptions {\n  /**\n   * Причина закрытия всплывающего элемента.\n   *\n   * @deprecated Since 8.0.0 аргумент, переданный в функцию `onClosed`, устарел и будет удален в **VKUI v10**.\n   * Для получения причины закрытия всплывающего окна используйте свойство `onClose`.\n   */\n  closedBy: ActionSheetOnClosedReason;\n}\n\nexport interface ActionSheetProps\n  extends Pick<\n      SharedDropdownProps,\n      | 'toggleRef'\n      | 'popupOffsetDistance'\n      | 'placement'\n      | 'allowClickPropagation'\n      | 'timeout'\n      | 'restoreFocus'\n      | 'autoFocus'\n    >,\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'autoFocus' | 'title'> {\n  /**\n   * Заголовок всплывающего окна.\n   */\n  title?: React.ReactNode;\n  /**\n   * Описание всплывающего окна, под заголовком.\n   */\n  description?: React.ReactNode;\n  /**\n   * Обработчик закрытия всплывающего окна.\n   */\n  onClose?: (reason: ActionSheetOnCloseReason) => void;\n  /**\n   * Обработчик закрытия всплывающего окна срабатывающий после завершения анимации закрытия.\n   *\n   * > Since 8.0.0 аргумент, переданный в данную функцию, устарел и будет удален в **VKUI v10**.\n   * > Для получения причины закрытия всплывающего окна используйте свойство `onClose`.\n   */\n  onClosed: (options: ActionSheetOnCloseOptions) => void;\n  /**\n   * Только мобильный iOS.\n   */\n  iosCloseItem?: React.ReactNode;\n  /**\n   * Свойства, которые можно прокинуть внутрь компонента:\n   * - `iosCloseItem`: свойства для прокидывания в кнопку отмены на iOS.\n   */\n  slotProps?: {\n    iosCloseItem?: Omit<ActionSheetItemProps, 'mode' | 'isCancelItem'> & HasRootRef<HTMLElement>;\n  };\n  /**\n   * Режим отображения компонента:\n   *\n   * - `sheet` – отображение снизу экрана в виде всплывающего окна, подходит для мобильных устройств\n   * - `menu` – отображение в виде всплывающего элемента, относительно якорного элемента.\n   */\n  mode?: 'sheet' | 'menu';\n  /**\n   * @deprecated Since 7.3.0.  Будет удалeно в **VKUI v9**.\n   */\n  mount?: boolean; // TODO [>=9]: удалить неиспользуемое свойство\n  /**\n   * @deprecated Since 7.3.0. Будет удалeно в **VKUI v9**.\n   */\n  disabled?: boolean; // TODO [>=9]: удалить неиспользуемое свойство\n}\n\n/**\n * @see https://vkui.io/components/action-sheet\n */\nexport const ActionSheet = ({\n  children,\n  className,\n  title,\n  description,\n  style,\n  iosCloseItem,\n  slotProps,\n  popupOffsetDistance,\n  placement,\n  mode: modeProp,\n  onClose: onCloseProp,\n  onClosed,\n  ...restProps\n}: ActionSheetProps): React.ReactNode => {\n  const platform = usePlatform();\n  const [closedReason, setClosedReason] = React.useState<undefined | ActionSheetOnClosedReason>(\n    undefined,\n  );\n  const onCloseStable = useStableCallback(onCloseProp || noop);\n\n  const onClose = React.useCallback(\n    (onCloseReason: ActionSheetOnCloseReason, onClosedReason: ActionSheetOnClosedReason) => {\n      onCloseStable(onCloseReason);\n      setClosedReason(onClosedReason);\n    },\n    [onCloseStable],\n  );\n\n  const onOverlayClick = React.useCallback(() => onClose('click-overlay', 'other'), [onClose]);\n\n  const actionCallbackRef = React.useRef(noop);\n\n  const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n    closedReason !== undefined ? 'exit' : 'enter',\n    {\n      onExited() {\n        onClosed({ closedBy: closedReason || 'other' });\n        actionCallbackRef.current();\n        actionCallbackRef.current = noop;\n      },\n    },\n  );\n\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const mode = modeProp ?? (isDesktop ? 'menu' : 'sheet');\n\n  useScrollLock(mode === 'sheet');\n\n  const onItemClick = React.useCallback<ItemClickHandler>(\n    ({ action, immediateAction, autoClose, isCancelItem }) =>\n      (event) => {\n        event.persist();\n        immediateAction && immediateAction(event);\n        if (autoClose) {\n          if (action) {\n            actionCallbackRef.current = () => action(event);\n          }\n          onClose(\n            isCancelItem ? 'click-cancel-item' : 'click-action-item',\n            isCancelItem ? 'cancel-item' : 'action-item',\n          );\n        } else {\n          action && action(event);\n        }\n      },\n    [onClose],\n  );\n  const contextValue = React.useMemo<ActionSheetContextType>(\n    () => ({ onItemClick, mode, onClose: (reason) => onClose(reason, 'other') }),\n    [mode, onClose, onItemClick],\n  );\n\n  const DropdownComponent = mode === 'menu' ? ActionSheetDropdownMenu : ActionSheetDropdownSheet;\n\n  const dropdownProps =\n    mode === 'menu' ? Object.assign(restProps, { popupOffsetDistance, placement }) : restProps;\n\n  const actionSheet = (\n    <ActionSheetContext.Provider value={contextValue}>\n      <DropdownComponent\n        closing={Boolean(closedReason)}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        autoFocus={animationState === 'entered'}\n        {...dropdownProps}\n        {...animationHandlers}\n        className={mode === 'menu' ? className : undefined}\n        style={mode === 'menu' ? style : undefined}\n      >\n        <div className={styles.contentWrapper}>\n          {(title || description) && (\n            <div className={styles.header}>\n              {title && (\n                <Footnote weight=\"2\" className={styles.title}>\n                  {title}\n                </Footnote>\n              )}\n              {description && <Footnote className={styles.description}>{description}</Footnote>}\n            </div>\n          )}\n          {children}\n        </div>\n        {platform === 'ios' && mode === 'sheet' && (\n          <div className={styles.closeItemWrapperIos}>\n            {iosCloseItem ?? <ActionSheetDefaultIosCloseItem {...slotProps?.iosCloseItem} />}\n          </div>\n        )}\n      </DropdownComponent>\n    </ActionSheetContext.Provider>\n  );\n\n  return (\n    <AppRootPortal>\n      <PopoutWrapper\n        noBackground={mode === 'menu'}\n        closing={Boolean(closedReason)}\n        alignY=\"bottom\"\n        className={className}\n        style={style}\n        onClick={onOverlayClick}\n      >\n        {actionSheet}\n      </PopoutWrapper>\n    </AppRootPortal>\n  );\n};\n"],"names":["React","noop","useAdaptivityWithJSMediaQueries","usePlatform","useStableCallback","useCSSKeyframesAnimationController","AppRootPortal","useScrollLock","PopoutWrapper","Footnote","ActionSheetContext","ActionSheetDefaultIosCloseItem","ActionSheetDropdownMenu","ActionSheetDropdownSheet","ActionSheet","children","className","title","description","style","iosCloseItem","slotProps","popupOffsetDistance","placement","mode","modeProp","onClose","onCloseProp","onClosed","restProps","platform","closedReason","setClosedReason","useState","undefined","onCloseStable","useCallback","onCloseReason","onClosedReason","onOverlayClick","actionCallbackRef","useRef","animationState","animationHandlers","onExited","closedBy","current","isDesktop","onItemClick","action","immediateAction","autoClose","isCancelItem","event","persist","contextValue","useMemo","reason","DropdownComponent","dropdownProps","Object","assign","actionSheet","Provider","value","closing","Boolean","role","aria-modal","autoFocus","div","weight","noBackground","alignY","onClick"],"mappings":"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"}

package/dist/components/ActionSheet/ActionSheetDropdownMenu.js

@@ -45,15 +45,15 @@ autoFocus, restoreFocus, disabled, timeout, ...restProps })=>{
         toggleRef
     ]);
     const onClose = React.useCallback(()=>{
-        onCloseProp === null || onCloseProp === void 0 ? void 0 : onCloseProp();
-        onActionSheetClose === null || onActionSheetClose === void 0 ? void 0 : onActionSheetClose('escape-key');
+        onCloseProp?.();
+        onActionSheetClose?.('escape-key');
     }, [
         onActionSheetClose,
         onCloseProp
     ]);
     const handleClick = allowClickPropagation ? onClick : (event)=>{
         stopPropagation(event);
-        onClick === null || onClick === void 0 ? void 0 : onClick(event);
+        onClick?.(event);
     };
     useGlobalEscKeyDown(true, onClose);
     return /*#__PURE__*/ _jsx(Popper, {

package/dist/components/ActionSheet/ActionSheetDropdownMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ActionSheet/ActionSheetDropdownMenu.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEscKeyDown } from '../../hooks/useGlobalEscKeyDown';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { isRefObject } from '../../lib/isRefObject';\nimport { stopPropagation } from '../../lib/utils';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Popper } from '../Popper/Popper';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ActionSheetContext, type ActionSheetContextType } from './ActionSheetContext';\nimport type { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst warn = warnOnce('ActionSheet');\nfunction getEl(ref: SharedDropdownProps['toggleRef']): Element | null | undefined {\n  return ref && 'current' in ref ? ref.current : ref;\n}\n\nexport const ActionSheetDropdownMenu = ({\n  children,\n  toggleRef,\n  closing,\n  onClose: onCloseProp,\n  className,\n  style,\n  popupOffsetDistance = 0,\n  placement,\n  onAnimationStart,\n  onAnimationEnd,\n  allowClickPropagation = false,\n  onClick,\n  getRootRef,\n  // FocusTrap props\n  autoFocus,\n  restoreFocus,\n  disabled,\n  timeout,\n  ...restProps\n}: SharedDropdownProps): React.ReactNode => {\n  const platform = usePlatform();\n  const { density } = useAdaptivityWithJSMediaQueries();\n  const focusTrapRootRef = useExternRef(getRootRef);\n  const elementRef = React.useRef<HTMLDivElement | null>(null);\n\n  const { onClose: onActionSheetClose } =\n    React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n\n  React.useEffect(() => {\n    if (process.env.NODE_ENV === 'development') {\n      const toggleEl = getEl(toggleRef);\n      if (!toggleEl) {\n        warn(`Свойство \"toggleRef\" не передано`, 'error');\n      }\n    }\n  }, [toggleRef]);\n\n  const targetRef = React.useMemo(() => {\n    if (isRefObject<SharedDropdownProps['toggleRef'], HTMLElement>(toggleRef)) {\n      return toggleRef;\n    }\n\n    return { current: toggleRef as HTMLElement };\n  }, [toggleRef]);\n\n  const onClose = React.useCallback(() => {\n    onCloseProp?.();\n    onActionSheetClose?.('escape-key');\n  }, [onActionSheetClose, onCloseProp]);\n\n  const handleClick = allowClickPropagation\n    ? onClick\n    : (event: React.MouseEvent<HTMLElement>) => {\n        stopPropagation(event);\n        onClick?.(event);\n      };\n\n  useGlobalEscKeyDown(true, onClose);\n\n  return (\n    <Popper\n      targetRef={targetRef}\n      offsetByMainAxis={popupOffsetDistance}\n      placement={placement}\n      className={classNames(\n        styles.host,\n        platform === 'ios' && styles.ios,\n        styles.menu,\n        closing ? styles.closing : styles.opening,\n        density === 'compact' && styles.densityCompact,\n        className,\n      )}\n      style={style}\n      getRootRef={elementRef}\n      usePortal={false}\n      onAnimationStart={onAnimationStart}\n      onAnimationEnd={onAnimationEnd}\n    >\n      <FocusTrap\n        autoFocus={autoFocus}\n        autoFocusDelay={timeout}\n        restoreFocus={restoreFocus}\n        disabled={disabled}\n        rootRef={focusTrapRootRef}\n      >\n        <RootComponent\n          {...restProps}\n          tabIndex={-1}\n          onClick={handleClick}\n          getRootRef={focusTrapRootRef}\n        >\n          {children}\n        </RootComponent>\n      </FocusTrap>\n    </Popper>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useExternRef","useGlobalEscKeyDown","usePlatform","isRefObject","stopPropagation","warnOnce","FocusTrap","Popper","RootComponent","ActionSheetContext","warn","getEl","ref","current","ActionSheetDropdownMenu","children","toggleRef","closing","onClose","onCloseProp","className","style","popupOffsetDistance","placement","onAnimationStart","onAnimationEnd","allowClickPropagation","onClick","getRootRef","autoFocus","restoreFocus","disabled","timeout","restProps","platform","density","focusTrapRootRef","elementRef","useRef","onActionSheetClose","useContext","useEffect","process","env","NODE_ENV","toggleEl","targetRef","useMemo","useCallback","handleClick","event","offsetByMainAxis","usePortal","autoFocusDelay","rootRef","tabIndex"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,mBAAmB,QAAQ,qCAAkC;AACtE,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,WAAW,QAAQ,2BAAwB;AACpD,SAASC,eAAe,QAAQ,qBAAkB;AAClD,SAASC,QAAQ,QAAQ,wBAAqB;AAC9C,SAASC,SAAS,QAAQ,4BAAyB;AACnD,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,kBAAkB,QAAqC,0BAAuB;AAIvF,MAAMC,OAAOL,SAAS;AACtB,SAASM,MAAMC,GAAqC;IAClD,OAAOA,OAAO,aAAaA,MAAMA,IAAIC,OAAO,GAAGD;AACjD;AAEA,OAAO,MAAME,0BAA0B,CAAC,EACtCC,QAAQ,EACRC,SAAS,EACTC,OAAO,EACPC,SAASC,WAAW,EACpBC,SAAS,EACTC,KAAK,EACLC,sBAAsB,CAAC,EACvBC,SAAS,EACTC,gBAAgB,EAChBC,cAAc,EACdC,wBAAwB,KAAK,EAC7BC,OAAO,EACPC,UAAU,EACV,kBAAkB;AAClBC,SAAS,EACTC,YAAY,EACZC,QAAQ,EACRC,OAAO,EACP,GAAGC,WACiB;IACpB,MAAMC,WAAWhC;IACjB,MAAM,EAAEiC,OAAO,EAAE,GAAGpC;IACpB,MAAMqC,mBAAmBpC,aAAa4B;IACtC,MAAMS,aAAaxC,MAAMyC,MAAM,CAAwB;IAEvD,MAAM,EAAEpB,SAASqB,kBAAkB,EAAE,GACnC1C,MAAM2C,UAAU,CAAsC/B;IAExDZ,MAAM4C,SAAS,CAAC;QACd,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;YAC1C,MAAMC,WAAWlC,MAAMK;YACvB,IAAI,CAAC6B,UAAU;gBACbnC,KAAK,CAAC,gCAAgC,CAAC,EAAE;YAC3C;QACF;IACF,GAAG;QAACM;KAAU;IAEd,MAAM8B,YAAYjD,MAAMkD,OAAO,CAAC;QAC9B,IAAI5C,YAA2Da,YAAY;YACzE,OAAOA;QACT;QAEA,OAAO;YAAEH,SAASG;QAAyB;IAC7C,GAAG;QAACA;KAAU;IAEd,MAAME,UAAUrB,MAAMmD,WAAW,CAAC;QAChC7B,wBAAAA,kCAAAA;QACAoB,+BAAAA,yCAAAA,mBAAqB;IACvB,GAAG;QAACA;QAAoBpB;KAAY;IAEpC,MAAM8B,cAAcvB,wBAChBC,UACA,CAACuB;QACC9C,gBAAgB8C;QAChBvB,oBAAAA,8BAAAA,QAAUuB;IACZ;IAEJjD,oBAAoB,MAAMiB;IAE1B,qBACE,KAACX;QACCuC,WAAWA;QACXK,kBAAkB7B;QAClBC,WAAWA;QACXH,WAAWtB,oCAEToC,aAAa,0DAEbjB,mEACAkB,YAAY,gDACZf;QAEFC,OAAOA;QACPO,YAAYS;QACZe,WAAW;QACX5B,kBAAkBA;QAClBC,gBAAgBA;kBAEhB,cAAA,KAACnB;YACCuB,WAAWA;YACXwB,gBAAgBrB;YAChBF,cAAcA;YACdC,UAAUA;YACVuB,SAASlB;sBAET,cAAA,KAAC5B;gBACE,GAAGyB,SAAS;gBACbsB,UAAU,CAAC;gBACX5B,SAASsB;gBACTrB,YAAYQ;0BAEXrB;;;;AAKX,EAAE"}
+{"version":3,"sources":["../../../src/components/ActionSheet/ActionSheetDropdownMenu.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEscKeyDown } from '../../hooks/useGlobalEscKeyDown';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { isRefObject } from '../../lib/isRefObject';\nimport { stopPropagation } from '../../lib/utils';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Popper } from '../Popper/Popper';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ActionSheetContext, type ActionSheetContextType } from './ActionSheetContext';\nimport type { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst warn = warnOnce('ActionSheet');\nfunction getEl(ref: SharedDropdownProps['toggleRef']): Element | null | undefined {\n  return ref && 'current' in ref ? ref.current : ref;\n}\n\nexport const ActionSheetDropdownMenu = ({\n  children,\n  toggleRef,\n  closing,\n  onClose: onCloseProp,\n  className,\n  style,\n  popupOffsetDistance = 0,\n  placement,\n  onAnimationStart,\n  onAnimationEnd,\n  allowClickPropagation = false,\n  onClick,\n  getRootRef,\n  // FocusTrap props\n  autoFocus,\n  restoreFocus,\n  disabled,\n  timeout,\n  ...restProps\n}: SharedDropdownProps): React.ReactNode => {\n  const platform = usePlatform();\n  const { density } = useAdaptivityWithJSMediaQueries();\n  const focusTrapRootRef = useExternRef(getRootRef);\n  const elementRef = React.useRef<HTMLDivElement | null>(null);\n\n  const { onClose: onActionSheetClose } =\n    React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n\n  React.useEffect(() => {\n    if (process.env.NODE_ENV === 'development') {\n      const toggleEl = getEl(toggleRef);\n      if (!toggleEl) {\n        warn(`Свойство \"toggleRef\" не передано`, 'error');\n      }\n    }\n  }, [toggleRef]);\n\n  const targetRef = React.useMemo(() => {\n    if (isRefObject<SharedDropdownProps['toggleRef'], HTMLElement>(toggleRef)) {\n      return toggleRef;\n    }\n\n    return { current: toggleRef as HTMLElement };\n  }, [toggleRef]);\n\n  const onClose = React.useCallback(() => {\n    onCloseProp?.();\n    onActionSheetClose?.('escape-key');\n  }, [onActionSheetClose, onCloseProp]);\n\n  const handleClick = allowClickPropagation\n    ? onClick\n    : (event: React.MouseEvent<HTMLElement>) => {\n        stopPropagation(event);\n        onClick?.(event);\n      };\n\n  useGlobalEscKeyDown(true, onClose);\n\n  return (\n    <Popper\n      targetRef={targetRef}\n      offsetByMainAxis={popupOffsetDistance}\n      placement={placement}\n      className={classNames(\n        styles.host,\n        platform === 'ios' && styles.ios,\n        styles.menu,\n        closing ? styles.closing : styles.opening,\n        density === 'compact' && styles.densityCompact,\n        className,\n      )}\n      style={style}\n      getRootRef={elementRef}\n      usePortal={false}\n      onAnimationStart={onAnimationStart}\n      onAnimationEnd={onAnimationEnd}\n    >\n      <FocusTrap\n        autoFocus={autoFocus}\n        autoFocusDelay={timeout}\n        restoreFocus={restoreFocus}\n        disabled={disabled}\n        rootRef={focusTrapRootRef}\n      >\n        <RootComponent\n          {...restProps}\n          tabIndex={-1}\n          onClick={handleClick}\n          getRootRef={focusTrapRootRef}\n        >\n          {children}\n        </RootComponent>\n      </FocusTrap>\n    </Popper>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useExternRef","useGlobalEscKeyDown","usePlatform","isRefObject","stopPropagation","warnOnce","FocusTrap","Popper","RootComponent","ActionSheetContext","warn","getEl","ref","current","ActionSheetDropdownMenu","children","toggleRef","closing","onClose","onCloseProp","className","style","popupOffsetDistance","placement","onAnimationStart","onAnimationEnd","allowClickPropagation","onClick","getRootRef","autoFocus","restoreFocus","disabled","timeout","restProps","platform","density","focusTrapRootRef","elementRef","useRef","onActionSheetClose","useContext","useEffect","process","env","NODE_ENV","toggleEl","targetRef","useMemo","useCallback","handleClick","event","offsetByMainAxis","usePortal","autoFocusDelay","rootRef","tabIndex"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,mBAAmB,QAAQ,qCAAkC;AACtE,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,WAAW,QAAQ,2BAAwB;AACpD,SAASC,eAAe,QAAQ,qBAAkB;AAClD,SAASC,QAAQ,QAAQ,wBAAqB;AAC9C,SAASC,SAAS,QAAQ,4BAAyB;AACnD,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,kBAAkB,QAAqC,0BAAuB;AAIvF,MAAMC,OAAOL,SAAS;AACtB,SAASM,MAAMC,GAAqC;IAClD,OAAOA,OAAO,aAAaA,MAAMA,IAAIC,OAAO,GAAGD;AACjD;AAEA,OAAO,MAAME,0BAA0B,CAAC,EACtCC,QAAQ,EACRC,SAAS,EACTC,OAAO,EACPC,SAASC,WAAW,EACpBC,SAAS,EACTC,KAAK,EACLC,sBAAsB,CAAC,EACvBC,SAAS,EACTC,gBAAgB,EAChBC,cAAc,EACdC,wBAAwB,KAAK,EAC7BC,OAAO,EACPC,UAAU,EACV,kBAAkB;AAClBC,SAAS,EACTC,YAAY,EACZC,QAAQ,EACRC,OAAO,EACP,GAAGC,WACiB;IACpB,MAAMC,WAAWhC;IACjB,MAAM,EAAEiC,OAAO,EAAE,GAAGpC;IACpB,MAAMqC,mBAAmBpC,aAAa4B;IACtC,MAAMS,aAAaxC,MAAMyC,MAAM,CAAwB;IAEvD,MAAM,EAAEpB,SAASqB,kBAAkB,EAAE,GACnC1C,MAAM2C,UAAU,CAAsC/B;IAExDZ,MAAM4C,SAAS,CAAC;QACd,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;YAC1C,MAAMC,WAAWlC,MAAMK;YACvB,IAAI,CAAC6B,UAAU;gBACbnC,KAAK,CAAC,gCAAgC,CAAC,EAAE;YAC3C;QACF;IACF,GAAG;QAACM;KAAU;IAEd,MAAM8B,YAAYjD,MAAMkD,OAAO,CAAC;QAC9B,IAAI5C,YAA2Da,YAAY;YACzE,OAAOA;QACT;QAEA,OAAO;YAAEH,SAASG;QAAyB;IAC7C,GAAG;QAACA;KAAU;IAEd,MAAME,UAAUrB,MAAMmD,WAAW,CAAC;QAChC7B;QACAoB,qBAAqB;IACvB,GAAG;QAACA;QAAoBpB;KAAY;IAEpC,MAAM8B,cAAcvB,wBAChBC,UACA,CAACuB;QACC9C,gBAAgB8C;QAChBvB,UAAUuB;IACZ;IAEJjD,oBAAoB,MAAMiB;IAE1B,qBACE,KAACX;QACCuC,WAAWA;QACXK,kBAAkB7B;QAClBC,WAAWA;QACXH,WAAWtB,oCAEToC,aAAa,0DAEbjB,mEACAkB,YAAY,gDACZf;QAEFC,OAAOA;QACPO,YAAYS;QACZe,WAAW;QACX5B,kBAAkBA;QAClBC,gBAAgBA;kBAEhB,cAAA,KAACnB;YACCuB,WAAWA;YACXwB,gBAAgBrB;YAChBF,cAAcA;YACdC,UAAUA;YACVuB,SAASlB;sBAET,cAAA,KAAC5B;gBACE,GAAGyB,SAAS;gBACbsB,UAAU,CAAC;gBACX5B,SAASsB;gBACTrB,YAAYQ;0BAEXrB;;;;AAKX,EAAE"}

package/dist/components/ActionSheet/ActionSheetDropdownSheet.js

@@ -18,15 +18,15 @@ autoFocus, restoreFocus, disabled, timeout, ...restProps })=>{
     const platform = usePlatform();
     const { onClose: onActionSheetClose } = React.useContext(ActionSheetContext);
     const onClose = React.useCallback(()=>{
-        onCloseProp === null || onCloseProp === void 0 ? void 0 : onCloseProp();
-        onActionSheetClose === null || onActionSheetClose === void 0 ? void 0 : onActionSheetClose('escape-key');
+        onCloseProp?.();
+        onActionSheetClose?.('escape-key');
     }, [
         onActionSheetClose,
         onCloseProp
     ]);
     const handleClick = allowClickPropagation ? onClick : (event)=>{
         stopPropagation(event);
-        onClick === null || onClick === void 0 ? void 0 : onClick(event);
+        onClick?.(event);
     };
     useGlobalEscKeyDown(true, onClose);
     return /*#__PURE__*/ _jsx(FocusTrap, {

package/dist/components/ActionSheet/ActionSheetDropdownSheet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ActionSheet/ActionSheetDropdownSheet.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEscKeyDown } from '../../hooks/useGlobalEscKeyDown';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { stopPropagation } from '../../lib/utils';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ActionSheetContext, type ActionSheetContextType } from './ActionSheetContext';\nimport type { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nexport const ActionSheetDropdownSheet = ({\n  getRootRef,\n  children,\n  closing,\n  // these 2 props are only omitted - ActionSheetDesktop compat\n  toggleRef,\n  className,\n  onClick,\n  allowClickPropagation = false,\n  onClose: onCloseProp,\n  // FocusTrap props\n  autoFocus,\n  restoreFocus,\n  disabled,\n  timeout,\n  ...restProps\n}: SharedDropdownProps): React.ReactNode => {\n  const { density } = useAdaptivityWithJSMediaQueries();\n  const focusTrapRootRef = useExternRef(getRootRef);\n  const platform = usePlatform();\n\n  const { onClose: onActionSheetClose } =\n    React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n\n  const onClose = React.useCallback(() => {\n    onCloseProp?.();\n    onActionSheetClose?.('escape-key');\n  }, [onActionSheetClose, onCloseProp]);\n\n  const handleClick = allowClickPropagation\n    ? onClick\n    : (event: React.MouseEvent<HTMLElement>) => {\n        stopPropagation(event);\n        onClick?.(event);\n      };\n\n  useGlobalEscKeyDown(true, onClose);\n\n  return (\n    <FocusTrap\n      autoFocus={autoFocus}\n      autoFocusDelay={timeout}\n      restoreFocus={restoreFocus}\n      disabled={disabled}\n      rootRef={focusTrapRootRef}\n    >\n      <RootComponent\n        {...restProps}\n        tabIndex={-1}\n        getRootRef={focusTrapRootRef}\n        onClick={handleClick}\n        className={classNames(\n          styles.host,\n          platform === 'ios' && styles.ios,\n          closing ? styles.closing : styles.opening,\n          density === 'compact' && styles.densityCompact,\n          className,\n        )}\n      >\n        {children}\n      </RootComponent>\n    </FocusTrap>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useExternRef","useGlobalEscKeyDown","usePlatform","stopPropagation","FocusTrap","RootComponent","ActionSheetContext","ActionSheetDropdownSheet","getRootRef","children","closing","toggleRef","className","onClick","allowClickPropagation","onClose","onCloseProp","autoFocus","restoreFocus","disabled","timeout","restProps","density","focusTrapRootRef","platform","onActionSheetClose","useContext","useCallback","handleClick","event","autoFocusDelay","rootRef","tabIndex"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,mBAAmB,QAAQ,qCAAkC;AACtE,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,eAAe,QAAQ,qBAAkB;AAClD,SAASC,SAAS,QAAQ,4BAAyB;AACnD,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,kBAAkB,QAAqC,0BAAuB;AAIvF,OAAO,MAAMC,2BAA2B,CAAC,EACvCC,UAAU,EACVC,QAAQ,EACRC,OAAO,EACP,6DAA6D;AAC7DC,SAAS,EACTC,SAAS,EACTC,OAAO,EACPC,wBAAwB,KAAK,EAC7BC,SAASC,WAAW,EACpB,kBAAkB;AAClBC,SAAS,EACTC,YAAY,EACZC,QAAQ,EACRC,OAAO,EACP,GAAGC,WACiB;IACpB,MAAM,EAAEC,OAAO,EAAE,GAAGvB;IACpB,MAAMwB,mBAAmBvB,aAAaQ;IACtC,MAAMgB,WAAWtB;IAEjB,MAAM,EAAEa,SAASU,kBAAkB,EAAE,GACnC5B,MAAM6B,UAAU,CAAsCpB;IAExD,MAAMS,UAAUlB,MAAM8B,WAAW,CAAC;QAChCX,wBAAAA,kCAAAA;QACAS,+BAAAA,yCAAAA,mBAAqB;IACvB,GAAG;QAACA;QAAoBT;KAAY;IAEpC,MAAMY,cAAcd,wBAChBD,UACA,CAACgB;QACC1B,gBAAgB0B;QAChBhB,oBAAAA,8BAAAA,QAAUgB;IACZ;IAEJ5B,oBAAoB,MAAMc;IAE1B,qBACE,KAACX;QACCa,WAAWA;QACXa,gBAAgBV;QAChBF,cAAcA;QACdC,UAAUA;QACVY,SAASR;kBAET,cAAA,KAAClB;YACE,GAAGgB,SAAS;YACbW,UAAU,CAAC;YACXxB,YAAYe;YACZV,SAASe;YACThB,WAAWd,oCAET0B,aAAa,iCACbd,mEACAY,YAAY,gDACZV;sBAGDH;;;AAIT,EAAE"}
+{"version":3,"sources":["../../../src/components/ActionSheet/ActionSheetDropdownSheet.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEscKeyDown } from '../../hooks/useGlobalEscKeyDown';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { stopPropagation } from '../../lib/utils';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ActionSheetContext, type ActionSheetContextType } from './ActionSheetContext';\nimport type { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nexport const ActionSheetDropdownSheet = ({\n  getRootRef,\n  children,\n  closing,\n  // these 2 props are only omitted - ActionSheetDesktop compat\n  toggleRef,\n  className,\n  onClick,\n  allowClickPropagation = false,\n  onClose: onCloseProp,\n  // FocusTrap props\n  autoFocus,\n  restoreFocus,\n  disabled,\n  timeout,\n  ...restProps\n}: SharedDropdownProps): React.ReactNode => {\n  const { density } = useAdaptivityWithJSMediaQueries();\n  const focusTrapRootRef = useExternRef(getRootRef);\n  const platform = usePlatform();\n\n  const { onClose: onActionSheetClose } =\n    React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n\n  const onClose = React.useCallback(() => {\n    onCloseProp?.();\n    onActionSheetClose?.('escape-key');\n  }, [onActionSheetClose, onCloseProp]);\n\n  const handleClick = allowClickPropagation\n    ? onClick\n    : (event: React.MouseEvent<HTMLElement>) => {\n        stopPropagation(event);\n        onClick?.(event);\n      };\n\n  useGlobalEscKeyDown(true, onClose);\n\n  return (\n    <FocusTrap\n      autoFocus={autoFocus}\n      autoFocusDelay={timeout}\n      restoreFocus={restoreFocus}\n      disabled={disabled}\n      rootRef={focusTrapRootRef}\n    >\n      <RootComponent\n        {...restProps}\n        tabIndex={-1}\n        getRootRef={focusTrapRootRef}\n        onClick={handleClick}\n        className={classNames(\n          styles.host,\n          platform === 'ios' && styles.ios,\n          closing ? styles.closing : styles.opening,\n          density === 'compact' && styles.densityCompact,\n          className,\n        )}\n      >\n        {children}\n      </RootComponent>\n    </FocusTrap>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useExternRef","useGlobalEscKeyDown","usePlatform","stopPropagation","FocusTrap","RootComponent","ActionSheetContext","ActionSheetDropdownSheet","getRootRef","children","closing","toggleRef","className","onClick","allowClickPropagation","onClose","onCloseProp","autoFocus","restoreFocus","disabled","timeout","restProps","density","focusTrapRootRef","platform","onActionSheetClose","useContext","useCallback","handleClick","event","autoFocusDelay","rootRef","tabIndex"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,mBAAmB,QAAQ,qCAAkC;AACtE,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,eAAe,QAAQ,qBAAkB;AAClD,SAASC,SAAS,QAAQ,4BAAyB;AACnD,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,kBAAkB,QAAqC,0BAAuB;AAIvF,OAAO,MAAMC,2BAA2B,CAAC,EACvCC,UAAU,EACVC,QAAQ,EACRC,OAAO,EACP,6DAA6D;AAC7DC,SAAS,EACTC,SAAS,EACTC,OAAO,EACPC,wBAAwB,KAAK,EAC7BC,SAASC,WAAW,EACpB,kBAAkB;AAClBC,SAAS,EACTC,YAAY,EACZC,QAAQ,EACRC,OAAO,EACP,GAAGC,WACiB;IACpB,MAAM,EAAEC,OAAO,EAAE,GAAGvB;IACpB,MAAMwB,mBAAmBvB,aAAaQ;IACtC,MAAMgB,WAAWtB;IAEjB,MAAM,EAAEa,SAASU,kBAAkB,EAAE,GACnC5B,MAAM6B,UAAU,CAAsCpB;IAExD,MAAMS,UAAUlB,MAAM8B,WAAW,CAAC;QAChCX;QACAS,qBAAqB;IACvB,GAAG;QAACA;QAAoBT;KAAY;IAEpC,MAAMY,cAAcd,wBAChBD,UACA,CAACgB;QACC1B,gBAAgB0B;QAChBhB,UAAUgB;IACZ;IAEJ5B,oBAAoB,MAAMc;IAE1B,qBACE,KAACX;QACCa,WAAWA;QACXa,gBAAgBV;QAChBF,cAAcA;QACdC,UAAUA;QACVY,SAASR;kBAET,cAAA,KAAClB;YACE,GAAGgB,SAAS;YACbW,UAAU,CAAC;YACXxB,YAAYe;YACZV,SAASe;YACThB,WAAWd,oCAET0B,aAAa,iCACbd,mEACAY,YAAY,gDACZV;sBAGDH;;;AAIT,EAAE"}

package/dist/components/ActionSheetItem/ActionSheetItem.js

@@ -36,13 +36,12 @@ const warn = warnOnce('ActionSheetItem');
     const isRich = subtitle || meta || selectable;
     const isCentered = !isRich && !before && platform === 'ios';
     const onItemClickHandler = React.useCallback((e)=>{
-        var _onItemClick;
-        (_onItemClick = onItemClick({
+        onItemClick({
             action: onClick,
             immediateAction: onImmediateClick,
             autoClose: !autoCloseDisabled,
             isCancelItem
-        })) === null || _onItemClick === void 0 ? void 0 : _onItemClick(e);
+        })?.(e);
     }, [
         autoCloseDisabled,
         isCancelItem,
@@ -52,7 +51,7 @@ const warn = warnOnce('ActionSheetItem');
     ]);
     const onKeyDown = React.useCallback((event)=>{
         if (pressedKey(event) === Keys.ENTER) {
-            onActionSheetClose === null || onActionSheetClose === void 0 ? void 0 : onActionSheetClose('keydown-item');
+            onActionSheetClose?.('keydown-item');
         }
     }, [
         onActionSheetClose

package/dist/components/ActionSheetItem/ActionSheetItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ActionSheetItem/ActionSheetItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HasDataAttribute } from '../../types';\nimport { ActionSheetContext, type ActionSheetContextType } from '../ActionSheet/ActionSheetContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport { ActionSheetItemContext } from './context';\nimport { isRealClickEvent } from './helpers';\nimport { Radio } from './subcomponents/Radio/Radio';\nimport styles from './ActionSheetItem.module.css';\n\nconst warn = warnOnce('ActionSheetItem');\n\nexport interface ActionSheetItemProps\n  extends React.HTMLAttributes<HTMLElement>,\n    React.AnchorHTMLAttributes<HTMLElement>,\n    HasDataAttribute,\n    Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'checked' | 'value'> {\n  /**\n   * Свойство, определяющее внешний вид элемента действия.\n   *\n   * > Since 8.0.0. Значение `\"cancel\"` устарело и будет удалено в **VKUI v10**.\n   * > Используйте компонент `ActionSheetDefaultIosCloseItem` или передайте пропсы через `slotProps.iosCloseItem` в `ActionSheet`.\n   */\n  mode?: 'default' | 'destructive' | 'cancel';\n  /**\n   * Если указано, элемент будет использоваться как ссылка.\n   */\n  href?: string;\n  /**\n   * Атрибут `target` для тега `<a>`.\n   */\n  target?: string;\n  /**\n   * Иконка или другой React-элемент для отображения перед основным контентом.\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка или другой React-элемент для отображения после основного контента.\n   */\n  after?: React.ReactNode;\n  /**\n   * Дополнительная информация, отображаемая рядом с основным контентом.\n   */\n  meta?: React.ReactNode;\n  /**\n   * Слот для подсказки или вспомогательного текста.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * По умолчанию нажатие на опцию вызывает переданную в `ActionSheet` функцию `onClose`, данное свойство\n   * позволяет отключить такое поведение.\n   */\n  autoCloseDisabled?: boolean;\n  /**\n   * Включает возможность выбрать элемент (отображает радиокнопку).\n   */\n  selectable?: boolean;\n  /**\n   * Блокировка взаимодействия с компонентом.\n   */\n  disabled?: boolean;\n  /**\n   * Все текстовые элементы при необходимости занимают несколько строк.\n   */\n  multiline?: boolean;\n  /**\n   * По умолчанию `onClick` будет вызван после завершения анимации скрытия и после вызова `onClose`.\n   * Из этого следует, что в объекте события значения полей типа `currentTarget` будут не определены.\n   * Если вам нужен объект события именно на момент нажатия, используйте `onImmediateClick`.\n   */\n  onClick?: React.MouseEventHandler<HTMLElement>;\n  /**\n   * Обработчик нажатия, вызывающийся непосредственно в момент нажатия (в отличие от `onClick`).\n   */\n  onImmediateClick?: React.MouseEventHandler<HTMLElement>;\n  /**\n   * Иконка для `selectable` режима.\n   */\n  iconChecked?: React.ReactNode;\n  /**\n   * Позволяет отделить `ActionItem` от `CancelItem` для определении того,\n   * кто вызвал закрытие `ActionSheet`. Используется в `ActionSheet.onClose()`.\n   *\n   * @deprecated Since 8.0.0. Свойство устарело и будет удалено в **VKUI v10**.\n   * Используйте компонент `ActionSheetDefaultIosCloseItem` или передайте пропсы через `slotProps.iosCloseItem` в `ActionSheet`.\n   */\n  isCancelItem?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/action-sheet#action-sheet-item\n */\nexport const ActionSheetItem = ({\n  children,\n  autoCloseDisabled = false,\n  mode = 'default',\n  meta,\n  subtitle,\n  before,\n  after,\n  selectable,\n  value,\n  name,\n  checked,\n  defaultChecked,\n  onChange,\n  onClick,\n  onImmediateClick,\n  multiline = false,\n  iconChecked,\n  isCancelItem: isCancelItemProp,\n  ...restProps\n}: ActionSheetItemProps): React.ReactNode => {\n  const platform = usePlatform();\n  const {\n    onItemClick = () => noop,\n    mode: actionSheetMode,\n    onClose: onActionSheetClose,\n  } = React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n  const { isCancelItem: isCancelItemFromContext } = React.useContext(ActionSheetItemContext);\n  const { density } = useAdaptivityWithJSMediaQueries();\n\n  if (process.env.NODE_ENV === 'development') {\n    if (mode === 'cancel') {\n      warn(\n        'Свойство `mode=\"cancel\"` устарело и будет удалено в VKUI v10. Используйте компонент `ActionSheetDefaultIosCloseItem` или передайте пропсы через `slotProps.iosCloseItem` в `ActionSheet`.',\n      );\n    }\n    if (isCancelItemProp) {\n      warn(\n        'Свойство `isCancelItem` устарело и будет удалено в VKUI v10. Используйте компонент `ActionSheetDefaultIosCloseItem` или передайте пропсы через `slotProps.iosCloseItem` в `ActionSheet`.',\n      );\n    }\n  }\n\n  const isCancelItem = isCancelItemFromContext || !!isCancelItemProp;\n\n  const isModeCancel = mode === 'cancel' || isCancelItemFromContext;\n\n  const Component: React.ElementType | undefined = selectable ? 'label' : undefined;\n\n  const isRich = subtitle || meta || selectable;\n  const isCentered = !isRich && !before && platform === 'ios';\n\n  const onItemClickHandler = React.useCallback(\n    (e: React.MouseEvent) => {\n      onItemClick({\n        action: onClick,\n        immediateAction: onImmediateClick,\n        autoClose: !autoCloseDisabled,\n        isCancelItem,\n      })?.(e);\n    },\n    [autoCloseDisabled, isCancelItem, onClick, onImmediateClick, onItemClick],\n  );\n\n  const onKeyDown: React.KeyboardEventHandler<HTMLElement> = React.useCallback(\n    (event) => {\n      if (pressedKey(event) === Keys.ENTER) {\n        onActionSheetClose?.('keydown-item');\n      }\n    },\n    [onActionSheetClose],\n  );\n\n  const onItemClickImpl: React.MouseEventHandler<HTMLElement> = React.useCallback(\n    (event) => {\n      if (selectable) {\n        if (isRealClickEvent(event)) {\n          onItemClickHandler(event);\n        }\n      } else {\n        onItemClickHandler(event);\n      }\n    },\n    [onItemClickHandler, selectable],\n  );\n\n  return (\n    <Tappable\n      {...(Component && { Component })}\n      {...restProps}\n      onClick={onItemClickImpl}\n      activeMode={platform === 'ios' ? styles.active : undefined}\n      baseClassName={classNames(\n        styles.host,\n        platform === 'ios' && styles.ios,\n        isModeCancel && styles.modeCancel,\n        mode === 'destructive' && styles.modeDestructive,\n        density === 'compact' && styles.densityCompact,\n        isRich && styles.rich,\n        actionSheetMode === 'menu' && styles.menu,\n        restProps.disabled && styles.disabled,\n      )}\n      onKeyDown={onKeyDown}\n    >\n      {before && <div className={styles.before}>{before}</div>}\n      <div className={classNames(styles.container, !multiline && styles.ellipsis)}>\n        <div className={classNames(styles.content, isCentered && styles.centered)}>\n          {platform === 'ios' ? (\n            <Title\n              className={styles.children}\n              weight={isModeCancel ? '2' : '3'}\n              level={isCentered ? '2' : '3'}\n            >\n              {children}\n            </Title>\n          ) : (\n            <Text className={styles.children}>{children}</Text>\n          )}\n          {meta && <Text className={styles.meta}>{meta}</Text>}\n        </div>\n        {subtitle && <Subhead className={styles.subtitle}>{subtitle}</Subhead>}\n      </div>\n      {(selectable || after) && (\n        <div className={styles.after}>\n          {after}\n          {selectable && (\n            <Radio\n              name={name}\n              value={value}\n              onChange={onChange}\n              defaultChecked={defaultChecked}\n              checked={checked}\n              disabled={restProps.disabled}\n            >\n              {iconChecked}\n            </Radio>\n          )}\n        </div>\n      )}\n    </Tappable>\n  );\n};\n"],"names":["React","classNames","noop","useAdaptivityWithJSMediaQueries","usePlatform","Keys","pressedKey","warnOnce","ActionSheetContext","Tappable","Subhead","Text","Title","ActionSheetItemContext","isRealClickEvent","Radio","warn","ActionSheetItem","children","autoCloseDisabled","mode","meta","subtitle","before","after","selectable","value","name","checked","defaultChecked","onChange","onClick","onImmediateClick","multiline","iconChecked","isCancelItem","isCancelItemProp","restProps","platform","onItemClick","actionSheetMode","onClose","onActionSheetClose","useContext","isCancelItemFromContext","density","process","env","NODE_ENV","isModeCancel","Component","undefined","isRich","isCentered","onItemClickHandler","useCallback","e","action","immediateAction","autoClose","onKeyDown","event","ENTER","onItemClickImpl","activeMode","baseClassName","disabled","div","className","weight","level"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/ActionSheetItem/ActionSheetItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HasDataAttribute } from '../../types';\nimport { ActionSheetContext, type ActionSheetContextType } from '../ActionSheet/ActionSheetContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport { ActionSheetItemContext } from './context';\nimport { isRealClickEvent } from './helpers';\nimport { Radio } from './subcomponents/Radio/Radio';\nimport styles from './ActionSheetItem.module.css';\n\nconst warn = warnOnce('ActionSheetItem');\n\nexport interface ActionSheetItemProps\n  extends React.HTMLAttributes<HTMLElement>,\n    React.AnchorHTMLAttributes<HTMLElement>,\n    HasDataAttribute,\n    Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'checked' | 'value'> {\n  /**\n   * Свойство, определяющее внешний вид элемента действия.\n   *\n   * > Since 8.0.0. Значение `\"cancel\"` устарело и будет удалено в **VKUI v10**.\n   * > Используйте компонент `ActionSheetDefaultIosCloseItem` или передайте пропсы через `slotProps.iosCloseItem` в `ActionSheet`.\n   */\n  mode?: 'default' | 'destructive' | 'cancel';\n  /**\n   * Если указано, элемент будет использоваться как ссылка.\n   */\n  href?: string;\n  /**\n   * Атрибут `target` для тега `<a>`.\n   */\n  target?: string;\n  /**\n   * Иконка или другой React-элемент для отображения перед основным контентом.\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка или другой React-элемент для отображения после основного контента.\n   */\n  after?: React.ReactNode;\n  /**\n   * Дополнительная информация, отображаемая рядом с основным контентом.\n   */\n  meta?: React.ReactNode;\n  /**\n   * Слот для подсказки или вспомогательного текста.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * По умолчанию нажатие на опцию вызывает переданную в `ActionSheet` функцию `onClose`, данное свойство\n   * позволяет отключить такое поведение.\n   */\n  autoCloseDisabled?: boolean;\n  /**\n   * Включает возможность выбрать элемент (отображает радиокнопку).\n   */\n  selectable?: boolean;\n  /**\n   * Блокировка взаимодействия с компонентом.\n   */\n  disabled?: boolean;\n  /**\n   * Все текстовые элементы при необходимости занимают несколько строк.\n   */\n  multiline?: boolean;\n  /**\n   * По умолчанию `onClick` будет вызван после завершения анимации скрытия и после вызова `onClose`.\n   * Из этого следует, что в объекте события значения полей типа `currentTarget` будут не определены.\n   * Если вам нужен объект события именно на момент нажатия, используйте `onImmediateClick`.\n   */\n  onClick?: React.MouseEventHandler<HTMLElement>;\n  /**\n   * Обработчик нажатия, вызывающийся непосредственно в момент нажатия (в отличие от `onClick`).\n   */\n  onImmediateClick?: React.MouseEventHandler<HTMLElement>;\n  /**\n   * Иконка для `selectable` режима.\n   */\n  iconChecked?: React.ReactNode;\n  /**\n   * Позволяет отделить `ActionItem` от `CancelItem` для определении того,\n   * кто вызвал закрытие `ActionSheet`. Используется в `ActionSheet.onClose()`.\n   *\n   * @deprecated Since 8.0.0. Свойство устарело и будет удалено в **VKUI v10**.\n   * Используйте компонент `ActionSheetDefaultIosCloseItem` или передайте пропсы через `slotProps.iosCloseItem` в `ActionSheet`.\n   */\n  isCancelItem?: boolean;\n}\n\n/**\n * @see https://vkui.io/components/action-sheet#action-sheet-item\n */\nexport const ActionSheetItem = ({\n  children,\n  autoCloseDisabled = false,\n  mode = 'default',\n  meta,\n  subtitle,\n  before,\n  after,\n  selectable,\n  value,\n  name,\n  checked,\n  defaultChecked,\n  onChange,\n  onClick,\n  onImmediateClick,\n  multiline = false,\n  iconChecked,\n  isCancelItem: isCancelItemProp,\n  ...restProps\n}: ActionSheetItemProps): React.ReactNode => {\n  const platform = usePlatform();\n  const {\n    onItemClick = () => noop,\n    mode: actionSheetMode,\n    onClose: onActionSheetClose,\n  } = React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n  const { isCancelItem: isCancelItemFromContext } = React.useContext(ActionSheetItemContext);\n  const { density } = useAdaptivityWithJSMediaQueries();\n\n  if (process.env.NODE_ENV === 'development') {\n    if (mode === 'cancel') {\n      warn(\n        'Свойство `mode=\"cancel\"` устарело и будет удалено в VKUI v10. Используйте компонент `ActionSheetDefaultIosCloseItem` или передайте пропсы через `slotProps.iosCloseItem` в `ActionSheet`.',\n      );\n    }\n    if (isCancelItemProp) {\n      warn(\n        'Свойство `isCancelItem` устарело и будет удалено в VKUI v10. Используйте компонент `ActionSheetDefaultIosCloseItem` или передайте пропсы через `slotProps.iosCloseItem` в `ActionSheet`.',\n      );\n    }\n  }\n\n  const isCancelItem = isCancelItemFromContext || !!isCancelItemProp;\n\n  const isModeCancel = mode === 'cancel' || isCancelItemFromContext;\n\n  const Component: React.ElementType | undefined = selectable ? 'label' : undefined;\n\n  const isRich = subtitle || meta || selectable;\n  const isCentered = !isRich && !before && platform === 'ios';\n\n  const onItemClickHandler = React.useCallback(\n    (e: React.MouseEvent) => {\n      onItemClick({\n        action: onClick,\n        immediateAction: onImmediateClick,\n        autoClose: !autoCloseDisabled,\n        isCancelItem,\n      })?.(e);\n    },\n    [autoCloseDisabled, isCancelItem, onClick, onImmediateClick, onItemClick],\n  );\n\n  const onKeyDown: React.KeyboardEventHandler<HTMLElement> = React.useCallback(\n    (event) => {\n      if (pressedKey(event) === Keys.ENTER) {\n        onActionSheetClose?.('keydown-item');\n      }\n    },\n    [onActionSheetClose],\n  );\n\n  const onItemClickImpl: React.MouseEventHandler<HTMLElement> = React.useCallback(\n    (event) => {\n      if (selectable) {\n        if (isRealClickEvent(event)) {\n          onItemClickHandler(event);\n        }\n      } else {\n        onItemClickHandler(event);\n      }\n    },\n    [onItemClickHandler, selectable],\n  );\n\n  return (\n    <Tappable\n      {...(Component && { Component })}\n      {...restProps}\n      onClick={onItemClickImpl}\n      activeMode={platform === 'ios' ? styles.active : undefined}\n      baseClassName={classNames(\n        styles.host,\n        platform === 'ios' && styles.ios,\n        isModeCancel && styles.modeCancel,\n        mode === 'destructive' && styles.modeDestructive,\n        density === 'compact' && styles.densityCompact,\n        isRich && styles.rich,\n        actionSheetMode === 'menu' && styles.menu,\n        restProps.disabled && styles.disabled,\n      )}\n      onKeyDown={onKeyDown}\n    >\n      {before && <div className={styles.before}>{before}</div>}\n      <div className={classNames(styles.container, !multiline && styles.ellipsis)}>\n        <div className={classNames(styles.content, isCentered && styles.centered)}>\n          {platform === 'ios' ? (\n            <Title\n              className={styles.children}\n              weight={isModeCancel ? '2' : '3'}\n              level={isCentered ? '2' : '3'}\n            >\n              {children}\n            </Title>\n          ) : (\n            <Text className={styles.children}>{children}</Text>\n          )}\n          {meta && <Text className={styles.meta}>{meta}</Text>}\n        </div>\n        {subtitle && <Subhead className={styles.subtitle}>{subtitle}</Subhead>}\n      </div>\n      {(selectable || after) && (\n        <div className={styles.after}>\n          {after}\n          {selectable && (\n            <Radio\n              name={name}\n              value={value}\n              onChange={onChange}\n              defaultChecked={defaultChecked}\n              checked={checked}\n              disabled={restProps.disabled}\n            >\n              {iconChecked}\n            </Radio>\n          )}\n        </div>\n      )}\n    </Tappable>\n  );\n};\n"],"names":["React","classNames","noop","useAdaptivityWithJSMediaQueries","usePlatform","Keys","pressedKey","warnOnce","ActionSheetContext","Tappable","Subhead","Text","Title","ActionSheetItemContext","isRealClickEvent","Radio","warn","ActionSheetItem","children","autoCloseDisabled","mode","meta","subtitle","before","after","selectable","value","name","checked","defaultChecked","onChange","onClick","onImmediateClick","multiline","iconChecked","isCancelItem","isCancelItemProp","restProps","platform","onItemClick","actionSheetMode","onClose","onActionSheetClose","useContext","isCancelItemFromContext","density","process","env","NODE_ENV","isModeCancel","Component","undefined","isRich","isCentered","onItemClickHandler","useCallback","e","action","immediateAction","autoClose","onKeyDown","event","ENTER","onItemClickImpl","activeMode","baseClassName","disabled","div","className","weight","level"],"mappings":"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"}

package/dist/components/Alert/Alert.js

@@ -12,7 +12,7 @@ const warn = warnOnce('Alert');
  */ export const Alert = ({ usePortal, style, className, getRootRef, onClose, ...restProps })=>{
     const [closing, setClosing] = React.useState(false);
     const close = React.useCallback(()=>{
-        onClose === null || onClose === void 0 ? void 0 : onClose('click-overlay');
+        onClose?.('click-overlay');
         setClosing(true);
     }, [
         onClose

package/dist/components/Alert/Alert.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type {\n  AlignType,\n  AnchorHTMLAttributesOnly,\n  HasDataAttribute,\n  HasRootRef,\n} from '../../types';\nimport type { AppRootPortalProps } from '../AppRoot/AppRootPortal';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport type { ButtonProps } from '../Button/Button';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport type { AlertActionProps } from './AlertAction';\nimport { AlertBase } from './AlertBase';\n\ntype AlertActionMode = 'cancel' | 'destructive' | 'default';\n\nexport type { AlertActionProps };\n\nexport type AlertCloseReason = 'click-overlay' | 'click-item' | 'escape-key' | 'click-close-button';\n\nexport interface AlertActionInterface\n  extends Pick<ButtonProps, 'Component'>,\n    AnchorHTMLAttributesOnly,\n    HasDataAttribute {\n  /**\n   * Текст опции.\n   */\n  title: string;\n  /**\n   * Обработчик нажатия на опцию. Если свойство `autoCloseDisabled` включено,\n   * то в аргументы `action` передаётся объект с функцией close,\n   * вызвав которую можно закрыть `action` вручную.\n   */\n  action?: (args?: { close?: VoidFunction }) => void;\n  /**\n   * По умолчанию нажатие на опцию вызывает переданную в `Alert` функцию `onClose`, данное свойство\n   * позволяет отключить такое поведение.\n   */\n  autoCloseDisabled?: boolean;\n  /**\n   * Режим отображения опции.\n   */\n  mode: AlertActionMode;\n}\n\nexport interface AlertProps\n  extends Omit<React.HTMLAttributes<HTMLElement>, 'title' | 'autoFocus'>,\n    Pick<AppRootPortalProps, 'usePortal'>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Расположение действий - вертикально или горизонтально.\n   */\n  actionsLayout?: 'vertical' | 'horizontal';\n  /**\n   * Тип выравнивания действий.\n   */\n  actionsAlign?: AlignType;\n  /**\n   * Список действий.\n   */\n  actions?: AlertActionInterface[];\n  /**\n   * Функция для отрисовки действия.\n   */\n  renderAction?: (props: AlertActionProps) => React.ReactNode;\n  /**\n   * Заголовок модального окна.\n   */\n  title?: React.ReactNode;\n  /**\n   * Описание модального окна.\n   */\n  description?: React.ReactNode;\n  /**\n   * Обработчик закрытия модального окна.\n   */\n  onClose?: (reason: AlertCloseReason) => void;\n  /**\n   * Обработчик закрытия модального окна, срабатывающий после окончания анимации.\n   */\n  onClosed: VoidFunction;\n  /**\n   * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий.\n   */\n  dismissLabel?: string;\n  /**\n   * Расположение кнопки закрытия (внутри и вне `popout'a`)\n   * Доступно только в `compact`-режиме, не отображается на `iOS`.\n   *\n   * ⚠️ ВНИМАНИЕ: использование `none` скрывает крестик, это негативно сказывается на пользовательском опыте.\n   */\n  dismissButtonMode?: 'inside' | 'outside' | 'none';\n  /**\n   * Передает атрибут `data-testid` для кнопки закрытия.\n   */\n  dismissButtonTestId?: string;\n  /**\n   * Передает атрибут `data-testid` для заголовка.\n   */\n  titleTestId?: string;\n  /**\n   * Передает атрибут `data-testid` для описания.\n   */\n  descriptionTestId?: string;\n  /**\n   * По умолчанию событие onClick не всплывает.\n   */\n  allowClickPropagation?: boolean;\n  /**\n   * Управление поведением возврата фокуса при закрытии всплывающего окна.\n   * @default true\n   */\n  restoreFocus?: boolean | (() => boolean | HTMLElement);\n  /**\n   * Управление поведением автофокуса при появлении всплывающего окна.\n   * При прокидывании `true` фокус будет установлен на первый элемент.\n   * При прокидывании `root` фокус будет установлен в корень.\n   * @default true\n   */\n  autoFocus?: boolean | 'root';\n}\n\nconst warn = warnOnce('Alert');\n\n/**\n * @see https://vkui.io/components/alert\n */\nexport const Alert = ({\n  usePortal,\n  style,\n  className,\n  getRootRef,\n  onClose,\n  ...restProps\n}: AlertProps): React.ReactNode => {\n  const [closing, setClosing] = React.useState(false);\n\n  const close = React.useCallback(() => {\n    onClose?.('click-overlay');\n    setClosing(true);\n  }, [onClose]);\n\n  useScrollLock();\n\n  if (\n    process.env.NODE_ENV === 'development' &&\n    !restProps.title &&\n    !restProps['aria-label'] &&\n    !restProps['aria-labelledby']\n  ) {\n    warn(\n      'Если \"title\" не используется, то необходимо задать либо \"aria-label\", либо \"aria-labelledby\" (см. правило axe aria-dialog-name)',\n    );\n  }\n\n  return (\n    <AppRootPortal usePortal={usePortal}>\n      <PopoutWrapper\n        className={className}\n        closing={closing}\n        style={style}\n        onClick={close}\n        getRootRef={getRootRef}\n      >\n        <AlertBase {...restProps} onClose={onClose} closing={closing} setClosing={setClosing} />\n      </PopoutWrapper>\n    </AppRootPortal>\n  );\n};\n"],"names":["React","warnOnce","AppRootPortal","useScrollLock","PopoutWrapper","AlertBase","warn","Alert","usePortal","style","className","getRootRef","onClose","restProps","closing","setClosing","useState","close","useCallback","process","env","NODE_ENV","title","onClick"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,QAAQ,wBAAqB;AAQ9C,SAASC,aAAa,QAAQ,8BAA2B;AACzD,SAASC,aAAa,QAAQ,8BAA2B;AAEzD,SAASC,aAAa,QAAQ,oCAAiC;AAE/D,SAASC,SAAS,QAAQ,iBAAc;AA8GxC,MAAMC,OAAOL,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMM,QAAQ,CAAC,EACpBC,SAAS,EACTC,KAAK,EACLC,SAAS,EACTC,UAAU,EACVC,OAAO,EACP,GAAGC,WACQ;IACX,MAAM,CAACC,SAASC,WAAW,GAAGf,MAAMgB,QAAQ,CAAC;IAE7C,MAAMC,QAAQjB,MAAMkB,WAAW,CAAC;QAC9BN,oBAAAA,8BAAAA,QAAU;QACVG,WAAW;IACb,GAAG;QAACH;KAAQ;IAEZT;IAEA,IACEgB,QAAQC,GAAG,CAACC,QAAQ,KAAK,iBACzB,CAACR,UAAUS,KAAK,IAChB,CAACT,SAAS,CAAC,aAAa,IACxB,CAACA,SAAS,CAAC,kBAAkB,EAC7B;QACAP,KACE;IAEJ;IAEA,qBACE,KAACJ;QAAcM,WAAWA;kBACxB,cAAA,KAACJ;YACCM,WAAWA;YACXI,SAASA;YACTL,OAAOA;YACPc,SAASN;YACTN,YAAYA;sBAEZ,cAAA,KAACN;gBAAW,GAAGQ,SAAS;gBAAED,SAASA;gBAASE,SAASA;gBAASC,YAAYA;;;;AAIlF,EAAE"}
+{"version":3,"sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type {\n  AlignType,\n  AnchorHTMLAttributesOnly,\n  HasDataAttribute,\n  HasRootRef,\n} from '../../types';\nimport type { AppRootPortalProps } from '../AppRoot/AppRootPortal';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport type { ButtonProps } from '../Button/Button';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport type { AlertActionProps } from './AlertAction';\nimport { AlertBase } from './AlertBase';\n\ntype AlertActionMode = 'cancel' | 'destructive' | 'default';\n\nexport type { AlertActionProps };\n\nexport type AlertCloseReason = 'click-overlay' | 'click-item' | 'escape-key' | 'click-close-button';\n\nexport interface AlertActionInterface\n  extends Pick<ButtonProps, 'Component'>,\n    AnchorHTMLAttributesOnly,\n    HasDataAttribute {\n  /**\n   * Текст опции.\n   */\n  title: string;\n  /**\n   * Обработчик нажатия на опцию. Если свойство `autoCloseDisabled` включено,\n   * то в аргументы `action` передаётся объект с функцией close,\n   * вызвав которую можно закрыть `action` вручную.\n   */\n  action?: (args?: { close?: VoidFunction }) => void;\n  /**\n   * По умолчанию нажатие на опцию вызывает переданную в `Alert` функцию `onClose`, данное свойство\n   * позволяет отключить такое поведение.\n   */\n  autoCloseDisabled?: boolean;\n  /**\n   * Режим отображения опции.\n   */\n  mode: AlertActionMode;\n}\n\nexport interface AlertProps\n  extends Omit<React.HTMLAttributes<HTMLElement>, 'title' | 'autoFocus'>,\n    Pick<AppRootPortalProps, 'usePortal'>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Расположение действий - вертикально или горизонтально.\n   */\n  actionsLayout?: 'vertical' | 'horizontal';\n  /**\n   * Тип выравнивания действий.\n   */\n  actionsAlign?: AlignType;\n  /**\n   * Список действий.\n   */\n  actions?: AlertActionInterface[];\n  /**\n   * Функция для отрисовки действия.\n   */\n  renderAction?: (props: AlertActionProps) => React.ReactNode;\n  /**\n   * Заголовок модального окна.\n   */\n  title?: React.ReactNode;\n  /**\n   * Описание модального окна.\n   */\n  description?: React.ReactNode;\n  /**\n   * Обработчик закрытия модального окна.\n   */\n  onClose?: (reason: AlertCloseReason) => void;\n  /**\n   * Обработчик закрытия модального окна, срабатывающий после окончания анимации.\n   */\n  onClosed: VoidFunction;\n  /**\n   * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий.\n   */\n  dismissLabel?: string;\n  /**\n   * Расположение кнопки закрытия (внутри и вне `popout'a`)\n   * Доступно только в `compact`-режиме, не отображается на `iOS`.\n   *\n   * ⚠️ ВНИМАНИЕ: использование `none` скрывает крестик, это негативно сказывается на пользовательском опыте.\n   */\n  dismissButtonMode?: 'inside' | 'outside' | 'none';\n  /**\n   * Передает атрибут `data-testid` для кнопки закрытия.\n   */\n  dismissButtonTestId?: string;\n  /**\n   * Передает атрибут `data-testid` для заголовка.\n   */\n  titleTestId?: string;\n  /**\n   * Передает атрибут `data-testid` для описания.\n   */\n  descriptionTestId?: string;\n  /**\n   * По умолчанию событие onClick не всплывает.\n   */\n  allowClickPropagation?: boolean;\n  /**\n   * Управление поведением возврата фокуса при закрытии всплывающего окна.\n   * @default true\n   */\n  restoreFocus?: boolean | (() => boolean | HTMLElement);\n  /**\n   * Управление поведением автофокуса при появлении всплывающего окна.\n   * При прокидывании `true` фокус будет установлен на первый элемент.\n   * При прокидывании `root` фокус будет установлен в корень.\n   * @default true\n   */\n  autoFocus?: boolean | 'root';\n}\n\nconst warn = warnOnce('Alert');\n\n/**\n * @see https://vkui.io/components/alert\n */\nexport const Alert = ({\n  usePortal,\n  style,\n  className,\n  getRootRef,\n  onClose,\n  ...restProps\n}: AlertProps): React.ReactNode => {\n  const [closing, setClosing] = React.useState(false);\n\n  const close = React.useCallback(() => {\n    onClose?.('click-overlay');\n    setClosing(true);\n  }, [onClose]);\n\n  useScrollLock();\n\n  if (\n    process.env.NODE_ENV === 'development' &&\n    !restProps.title &&\n    !restProps['aria-label'] &&\n    !restProps['aria-labelledby']\n  ) {\n    warn(\n      'Если \"title\" не используется, то необходимо задать либо \"aria-label\", либо \"aria-labelledby\" (см. правило axe aria-dialog-name)',\n    );\n  }\n\n  return (\n    <AppRootPortal usePortal={usePortal}>\n      <PopoutWrapper\n        className={className}\n        closing={closing}\n        style={style}\n        onClick={close}\n        getRootRef={getRootRef}\n      >\n        <AlertBase {...restProps} onClose={onClose} closing={closing} setClosing={setClosing} />\n      </PopoutWrapper>\n    </AppRootPortal>\n  );\n};\n"],"names":["React","warnOnce","AppRootPortal","useScrollLock","PopoutWrapper","AlertBase","warn","Alert","usePortal","style","className","getRootRef","onClose","restProps","closing","setClosing","useState","close","useCallback","process","env","NODE_ENV","title","onClick"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,QAAQ,wBAAqB;AAQ9C,SAASC,aAAa,QAAQ,8BAA2B;AACzD,SAASC,aAAa,QAAQ,8BAA2B;AAEzD,SAASC,aAAa,QAAQ,oCAAiC;AAE/D,SAASC,SAAS,QAAQ,iBAAc;AA8GxC,MAAMC,OAAOL,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMM,QAAQ,CAAC,EACpBC,SAAS,EACTC,KAAK,EACLC,SAAS,EACTC,UAAU,EACVC,OAAO,EACP,GAAGC,WACQ;IACX,MAAM,CAACC,SAASC,WAAW,GAAGf,MAAMgB,QAAQ,CAAC;IAE7C,MAAMC,QAAQjB,MAAMkB,WAAW,CAAC;QAC9BN,UAAU;QACVG,WAAW;IACb,GAAG;QAACH;KAAQ;IAEZT;IAEA,IACEgB,QAAQC,GAAG,CAACC,QAAQ,KAAK,iBACzB,CAACR,UAAUS,KAAK,IAChB,CAACT,SAAS,CAAC,aAAa,IACxB,CAACA,SAAS,CAAC,kBAAkB,EAC7B;QACAP,KACE;IAEJ;IAEA,qBACE,KAACJ;QAAcM,WAAWA;kBACxB,cAAA,KAACJ;YACCM,WAAWA;YACXI,SAASA;YACTL,OAAOA;YACPc,SAASN;YACTN,YAAYA;sBAEZ,cAAA,KAACN;gBAAW,GAAGQ,SAAS;gBAAED,SAASA;gBAASE,SAASA;gBAASC,YAAYA;;;;AAIlF,EAAE"}

package/dist/components/Alert/AlertBase.js

@@ -34,8 +34,8 @@ autoFocus, restoreFocus, ...restProps })=>{
     const isDismissButtonVisible = isDesktop && platform !== 'ios';
     const elementRef = React.useRef(null);
     const close = React.useCallback((reason)=>{
-        onClose === null || onClose === void 0 ? void 0 : onClose(reason);
-        setClosing === null || setClosing === void 0 ? void 0 : setClosing(true);
+        onClose?.(reason);
+        setClosing?.(true);
     }, [
         onClose,
         setClosing
@@ -57,7 +57,7 @@ autoFocus, restoreFocus, ...restProps })=>{
     ]);
     const handleClick = allowClickPropagation ? onClick : (event)=>{
         stopPropagation(event);
-        onClick === null || onClick === void 0 ? void 0 : onClick(event);
+        onClick?.(event);
     };
     const onEscape = React.useCallback(()=>close('escape-key'), [
         close

package/dist/components/Alert/AlertBase.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Alert/AlertBase.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useGlobalEscKeyDown } from '../../hooks/useGlobalEscKeyDown';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useStableCallback } from '../../hooks/useStableCallback';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport { stopPropagation } from '../../lib/utils';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { IconButton } from '../IconButton/IconButton';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport type { AlertActionInterface, AlertCloseReason, AlertProps } from './Alert';\nimport { AlertActions } from './AlertActions';\nimport { AlertDescription, AlertTitle } from './AlertTypography';\nimport styles from './Alert.module.css';\n\nexport interface AlertBaseProps\n  extends Omit<AlertProps, 'usePortal' | 'className' | 'style' | 'getRootRef'> {\n  /**\n   * Флаг, определяющий состояние закрытия модального окна.\n   * Когда установлен в true, запускает анимацию закрытия окна.\n   */\n  closing?: boolean;\n  /**\n   * Функция обратного вызова для управления состоянием закрытия модального окна.\n   * Принимает булево значение, которое определяет, находится ли окно в процессе закрытия.\n   */\n  setClosing?: (closing: boolean) => void;\n}\n\nexport const AlertBase = ({\n  actions,\n  actionsLayout = 'horizontal',\n  children,\n  title,\n  description,\n  onClose: onCloseProp,\n  onClosed,\n  dismissLabel = 'Закрыть предупреждение',\n  renderAction,\n  actionsAlign,\n  dismissButtonMode = 'outside',\n  dismissButtonTestId,\n  onClick,\n  allowClickPropagation = false,\n  titleTestId,\n  descriptionTestId,\n  closing,\n  setClosing,\n  // FocusTrap props\n  autoFocus,\n  restoreFocus,\n  ...restProps\n}: AlertBaseProps) => {\n  const generatedId = React.useId();\n\n  const titleId = `vkui-alert-${generatedId}-title`;\n  const descriptionId = `vkui-alert-${generatedId}-description`;\n  const onClose = useStableCallback(onCloseProp || noop);\n\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const itemActionCallbackRef = React.useRef(noop);\n  const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n    closing ? 'exit' : 'enter',\n    {\n      onExited() {\n        itemActionCallbackRef.current();\n        itemActionCallbackRef.current = noop;\n        onClosed();\n      },\n    },\n  );\n  const isDismissButtonVisible = isDesktop && platform !== 'ios';\n  const elementRef = React.useRef<HTMLDivElement>(null);\n\n  const close = React.useCallback(\n    (reason: AlertCloseReason) => {\n      onClose?.(reason);\n      setClosing?.(true);\n    },\n    [onClose, setClosing],\n  );\n\n  const onItemClick = React.useCallback(\n    (item: AlertActionInterface) => {\n      const { action: itemAction, autoCloseDisabled = false } = item;\n\n      if (autoCloseDisabled) {\n        itemAction && itemAction({ close: () => close('click-item') });\n      } else {\n        if (itemAction) {\n          itemActionCallbackRef.current = itemAction;\n        }\n        close('click-item');\n      }\n    },\n    [close],\n  );\n\n  const handleClick = allowClickPropagation\n    ? onClick\n    : (event: React.MouseEvent<HTMLElement>) => {\n        stopPropagation(event);\n        onClick?.(event);\n      };\n\n  const onEscape = React.useCallback(() => close('escape-key'), [close]);\n\n  const onCloseButtonClick = React.useCallback(() => close('click-close-button'), [close]);\n\n  useGlobalEscKeyDown(true, onEscape);\n\n  return (\n    <FocusTrap\n      rootRef={elementRef}\n      autoFocus={autoFocus === undefined ? animationState === 'entered' : autoFocus}\n      restoreFocus={restoreFocus}\n    >\n      <RootComponent\n        {...animationHandlers}\n        tabIndex={-1}\n        onClick={handleClick}\n        getRootRef={elementRef}\n        className={classNames(\n          styles.host,\n          platform === 'ios' && styles.ios,\n          platform === 'vkcom' && styles.vkcom,\n          closing ? styles.closing : styles.opening,\n          isDesktop && styles.desktop,\n        )}\n        role=\"alertdialog\"\n        aria-modal\n        aria-labelledby={titleId}\n        aria-describedby={descriptionId}\n        {...restProps}\n      >\n        <div\n          className={classNames(\n            styles.content,\n            dismissButtonMode === 'inside' && styles.contentWithButton,\n          )}\n          tabIndex={-1}\n        >\n          {hasReactNode(title) && (\n            <AlertTitle data-testid={titleTestId} id={titleId}>\n              {title}\n            </AlertTitle>\n          )}\n          {hasReactNode(description) && (\n            <AlertDescription data-testid={descriptionTestId} id={descriptionId}>\n              {description}\n            </AlertDescription>\n          )}\n          {children}\n          {isDismissButtonVisible && dismissButtonMode === 'inside' && (\n            <IconButton\n              label={dismissLabel}\n              className={classNames(styles.dismiss, 'vkuiInternalAlert__dismiss')}\n              onClick={onCloseButtonClick}\n              hoverMode=\"opacity\"\n              activeMode=\"opacity\"\n              data-testid={dismissButtonTestId}\n            >\n              <Icon20Cancel />\n            </IconButton>\n          )}\n        </div>\n        {isDismissButtonVisible && dismissButtonMode === 'outside' && (\n          <ModalDismissButton onClick={onCloseButtonClick} data-testid={dismissButtonTestId}>\n            {dismissLabel}\n          </ModalDismissButton>\n        )}\n        <AlertActions\n          actions={actions}\n          actionsAlign={actionsAlign}\n          actionsLayout={actionsLayout}\n          renderAction={renderAction}\n          onItemClick={onItemClick}\n        />\n      </RootComponent>\n    </FocusTrap>\n  );\n};\n"],"names":["React","Icon20Cancel","classNames","hasReactNode","noop","useAdaptivityWithJSMediaQueries","useGlobalEscKeyDown","usePlatform","useStableCallback","useCSSKeyframesAnimationController","stopPropagation","FocusTrap","IconButton","ModalDismissButton","RootComponent","AlertActions","AlertDescription","AlertTitle","AlertBase","actions","actionsLayout","children","title","description","onClose","onCloseProp","onClosed","dismissLabel","renderAction","actionsAlign","dismissButtonMode","dismissButtonTestId","onClick","allowClickPropagation","titleTestId","descriptionTestId","closing","setClosing","autoFocus","restoreFocus","restProps","generatedId","useId","titleId","descriptionId","platform","isDesktop","itemActionCallbackRef","useRef","animationState","animationHandlers","onExited","current","isDismissButtonVisible","elementRef","close","useCallback","reason","onItemClick","item","action","itemAction","autoCloseDisabled","handleClick","event","onEscape","onCloseButtonClick","rootRef","undefined","tabIndex","getRootRef","className","role","aria-modal","aria-labelledby","aria-describedby","div","data-testid","id","label","hoverMode","activeMode"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,mBAAmB;AAChD,SAASC,UAAU,EAAEC,YAAY,EAAEC,IAAI,QAAQ,kBAAkB;AACjE,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,mBAAmB,QAAQ,qCAAkC;AACtE,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,iBAAiB,QAAQ,mCAAgC;AAClE,SAASC,kCAAkC,QAAQ,+BAAsB;AACzE,SAASC,eAAe,QAAQ,qBAAkB;AAClD,SAASC,SAAS,QAAQ,4BAAyB;AACnD,SAASC,UAAU,QAAQ,8BAA2B;AACtD,SAASC,kBAAkB,QAAQ,8CAA2C;AAC9E,SAASC,aAAa,QAAQ,oCAAiC;AAE/D,SAASC,YAAY,QAAQ,oBAAiB;AAC9C,SAASC,gBAAgB,EAAEC,UAAU,QAAQ,uBAAoB;AAiBjE,OAAO,MAAMC,YAAY,CAAC,EACxBC,OAAO,EACPC,gBAAgB,YAAY,EAC5BC,QAAQ,EACRC,KAAK,EACLC,WAAW,EACXC,SAASC,WAAW,EACpBC,QAAQ,EACRC,eAAe,wBAAwB,EACvCC,YAAY,EACZC,YAAY,EACZC,oBAAoB,SAAS,EAC7BC,mBAAmB,EACnBC,OAAO,EACPC,wBAAwB,KAAK,EAC7BC,WAAW,EACXC,iBAAiB,EACjBC,OAAO,EACPC,UAAU,EACV,kBAAkB;AAClBC,SAAS,EACTC,YAAY,EACZ,GAAGC,WACY;IACf,MAAMC,cAAczC,MAAM0C,KAAK;IAE/B,MAAMC,UAAU,CAAC,WAAW,EAAEF,YAAY,MAAM,CAAC;IACjD,MAAMG,gBAAgB,CAAC,WAAW,EAAEH,YAAY,YAAY,CAAC;IAC7D,MAAMjB,UAAUhB,kBAAkBiB,eAAerB;IAEjD,MAAMyC,WAAWtC;IACjB,MAAM,EAAEuC,SAAS,EAAE,GAAGzC;IACtB,MAAM0C,wBAAwB/C,MAAMgD,MAAM,CAAC5C;IAC3C,MAAM,CAAC6C,gBAAgBC,kBAAkB,GAAGzC,mCAC1C2B,UAAU,SAAS,SACnB;QACEe;YACEJ,sBAAsBK,OAAO;YAC7BL,sBAAsBK,OAAO,GAAGhD;YAChCsB;QACF;IACF;IAEF,MAAM2B,yBAAyBP,aAAaD,aAAa;IACzD,MAAMS,aAAatD,MAAMgD,MAAM,CAAiB;IAEhD,MAAMO,QAAQvD,MAAMwD,WAAW,CAC7B,CAACC;QACCjC,oBAAAA,8BAAAA,QAAUiC;QACVpB,uBAAAA,iCAAAA,WAAa;IACf,GACA;QAACb;QAASa;KAAW;IAGvB,MAAMqB,cAAc1D,MAAMwD,WAAW,CACnC,CAACG;QACC,MAAM,EAAEC,QAAQC,UAAU,EAAEC,oBAAoB,KAAK,EAAE,GAAGH;QAE1D,IAAIG,mBAAmB;YACrBD,cAAcA,WAAW;gBAAEN,OAAO,IAAMA,MAAM;YAAc;QAC9D,OAAO;YACL,IAAIM,YAAY;gBACdd,sBAAsBK,OAAO,GAAGS;YAClC;YACAN,MAAM;QACR;IACF,GACA;QAACA;KAAM;IAGT,MAAMQ,cAAc9B,wBAChBD,UACA,CAACgC;QACCtD,gBAAgBsD;QAChBhC,oBAAAA,8BAAAA,QAAUgC;IACZ;IAEJ,MAAMC,WAAWjE,MAAMwD,WAAW,CAAC,IAAMD,MAAM,eAAe;QAACA;KAAM;IAErE,MAAMW,qBAAqBlE,MAAMwD,WAAW,CAAC,IAAMD,MAAM,uBAAuB;QAACA;KAAM;IAEvFjD,oBAAoB,MAAM2D;IAE1B,qBACE,KAACtD;QACCwD,SAASb;QACThB,WAAWA,cAAc8B,YAAYnB,mBAAmB,YAAYX;QACpEC,cAAcA;kBAEd,cAAA,MAACzB;YACE,GAAGoC,iBAAiB;YACrBmB,UAAU,CAAC;YACXrC,SAAS+B;YACTO,YAAYhB;YACZiB,WAAWrE,8BAET2C,aAAa,2BACbA,aAAa,+BACbT,uDACAU;YAEF0B,MAAK;YACLC,YAAU;YACVC,mBAAiB/B;YACjBgC,oBAAkB/B;YACjB,GAAGJ,SAAS;;8BAEb,MAACoC;oBACCL,WAAWrE,iCAET4B,sBAAsB;oBAExBuC,UAAU,CAAC;;wBAEVlE,aAAamB,wBACZ,KAACL;4BAAW4D,eAAa3C;4BAAa4C,IAAInC;sCACvCrB;;wBAGJnB,aAAaoB,8BACZ,KAACP;4BAAiB6D,eAAa1C;4BAAmB2C,IAAIlC;sCACnDrB;;wBAGJF;wBACAgC,0BAA0BvB,sBAAsB,0BAC/C,KAAClB;4BACCmE,OAAOpD;4BACP4C,WAAWrE,iCAA2B;4BACtC8B,SAASkC;4BACTc,WAAU;4BACVC,YAAW;4BACXJ,eAAa9C;sCAEb,cAAA,KAAC9B;;;;gBAINoD,0BAA0BvB,sBAAsB,2BAC/C,KAACjB;oBAAmBmB,SAASkC;oBAAoBW,eAAa9C;8BAC3DJ;;8BAGL,KAACZ;oBACCI,SAASA;oBACTU,cAAcA;oBACdT,eAAeA;oBACfQ,cAAcA;oBACd8B,aAAaA;;;;;AAKvB,EAAE"}
+{"version":3,"sources":["../../../src/components/Alert/AlertBase.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useGlobalEscKeyDown } from '../../hooks/useGlobalEscKeyDown';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useStableCallback } from '../../hooks/useStableCallback';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport { stopPropagation } from '../../lib/utils';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { IconButton } from '../IconButton/IconButton';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport type { AlertActionInterface, AlertCloseReason, AlertProps } from './Alert';\nimport { AlertActions } from './AlertActions';\nimport { AlertDescription, AlertTitle } from './AlertTypography';\nimport styles from './Alert.module.css';\n\nexport interface AlertBaseProps\n  extends Omit<AlertProps, 'usePortal' | 'className' | 'style' | 'getRootRef'> {\n  /**\n   * Флаг, определяющий состояние закрытия модального окна.\n   * Когда установлен в true, запускает анимацию закрытия окна.\n   */\n  closing?: boolean;\n  /**\n   * Функция обратного вызова для управления состоянием закрытия модального окна.\n   * Принимает булево значение, которое определяет, находится ли окно в процессе закрытия.\n   */\n  setClosing?: (closing: boolean) => void;\n}\n\nexport const AlertBase = ({\n  actions,\n  actionsLayout = 'horizontal',\n  children,\n  title,\n  description,\n  onClose: onCloseProp,\n  onClosed,\n  dismissLabel = 'Закрыть предупреждение',\n  renderAction,\n  actionsAlign,\n  dismissButtonMode = 'outside',\n  dismissButtonTestId,\n  onClick,\n  allowClickPropagation = false,\n  titleTestId,\n  descriptionTestId,\n  closing,\n  setClosing,\n  // FocusTrap props\n  autoFocus,\n  restoreFocus,\n  ...restProps\n}: AlertBaseProps) => {\n  const generatedId = React.useId();\n\n  const titleId = `vkui-alert-${generatedId}-title`;\n  const descriptionId = `vkui-alert-${generatedId}-description`;\n  const onClose = useStableCallback(onCloseProp || noop);\n\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const itemActionCallbackRef = React.useRef(noop);\n  const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n    closing ? 'exit' : 'enter',\n    {\n      onExited() {\n        itemActionCallbackRef.current();\n        itemActionCallbackRef.current = noop;\n        onClosed();\n      },\n    },\n  );\n  const isDismissButtonVisible = isDesktop && platform !== 'ios';\n  const elementRef = React.useRef<HTMLDivElement>(null);\n\n  const close = React.useCallback(\n    (reason: AlertCloseReason) => {\n      onClose?.(reason);\n      setClosing?.(true);\n    },\n    [onClose, setClosing],\n  );\n\n  const onItemClick = React.useCallback(\n    (item: AlertActionInterface) => {\n      const { action: itemAction, autoCloseDisabled = false } = item;\n\n      if (autoCloseDisabled) {\n        itemAction && itemAction({ close: () => close('click-item') });\n      } else {\n        if (itemAction) {\n          itemActionCallbackRef.current = itemAction;\n        }\n        close('click-item');\n      }\n    },\n    [close],\n  );\n\n  const handleClick = allowClickPropagation\n    ? onClick\n    : (event: React.MouseEvent<HTMLElement>) => {\n        stopPropagation(event);\n        onClick?.(event);\n      };\n\n  const onEscape = React.useCallback(() => close('escape-key'), [close]);\n\n  const onCloseButtonClick = React.useCallback(() => close('click-close-button'), [close]);\n\n  useGlobalEscKeyDown(true, onEscape);\n\n  return (\n    <FocusTrap\n      rootRef={elementRef}\n      autoFocus={autoFocus === undefined ? animationState === 'entered' : autoFocus}\n      restoreFocus={restoreFocus}\n    >\n      <RootComponent\n        {...animationHandlers}\n        tabIndex={-1}\n        onClick={handleClick}\n        getRootRef={elementRef}\n        className={classNames(\n          styles.host,\n          platform === 'ios' && styles.ios,\n          platform === 'vkcom' && styles.vkcom,\n          closing ? styles.closing : styles.opening,\n          isDesktop && styles.desktop,\n        )}\n        role=\"alertdialog\"\n        aria-modal\n        aria-labelledby={titleId}\n        aria-describedby={descriptionId}\n        {...restProps}\n      >\n        <div\n          className={classNames(\n            styles.content,\n            dismissButtonMode === 'inside' && styles.contentWithButton,\n          )}\n          tabIndex={-1}\n        >\n          {hasReactNode(title) && (\n            <AlertTitle data-testid={titleTestId} id={titleId}>\n              {title}\n            </AlertTitle>\n          )}\n          {hasReactNode(description) && (\n            <AlertDescription data-testid={descriptionTestId} id={descriptionId}>\n              {description}\n            </AlertDescription>\n          )}\n          {children}\n          {isDismissButtonVisible && dismissButtonMode === 'inside' && (\n            <IconButton\n              label={dismissLabel}\n              className={classNames(styles.dismiss, 'vkuiInternalAlert__dismiss')}\n              onClick={onCloseButtonClick}\n              hoverMode=\"opacity\"\n              activeMode=\"opacity\"\n              data-testid={dismissButtonTestId}\n            >\n              <Icon20Cancel />\n            </IconButton>\n          )}\n        </div>\n        {isDismissButtonVisible && dismissButtonMode === 'outside' && (\n          <ModalDismissButton onClick={onCloseButtonClick} data-testid={dismissButtonTestId}>\n            {dismissLabel}\n          </ModalDismissButton>\n        )}\n        <AlertActions\n          actions={actions}\n          actionsAlign={actionsAlign}\n          actionsLayout={actionsLayout}\n          renderAction={renderAction}\n          onItemClick={onItemClick}\n        />\n      </RootComponent>\n    </FocusTrap>\n  );\n};\n"],"names":["React","Icon20Cancel","classNames","hasReactNode","noop","useAdaptivityWithJSMediaQueries","useGlobalEscKeyDown","usePlatform","useStableCallback","useCSSKeyframesAnimationController","stopPropagation","FocusTrap","IconButton","ModalDismissButton","RootComponent","AlertActions","AlertDescription","AlertTitle","AlertBase","actions","actionsLayout","children","title","description","onClose","onCloseProp","onClosed","dismissLabel","renderAction","actionsAlign","dismissButtonMode","dismissButtonTestId","onClick","allowClickPropagation","titleTestId","descriptionTestId","closing","setClosing","autoFocus","restoreFocus","restProps","generatedId","useId","titleId","descriptionId","platform","isDesktop","itemActionCallbackRef","useRef","animationState","animationHandlers","onExited","current","isDismissButtonVisible","elementRef","close","useCallback","reason","onItemClick","item","action","itemAction","autoCloseDisabled","handleClick","event","onEscape","onCloseButtonClick","rootRef","undefined","tabIndex","getRootRef","className","role","aria-modal","aria-labelledby","aria-describedby","div","data-testid","id","label","hoverMode","activeMode"],"mappings":"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"}

package/dist/components/AppRoot/AppRootPortal.js

@@ -43,7 +43,7 @@ function usePortalContainer(usePortal) {
     // если portalRoot не передали через AppRoot, то мы используем body
     // мы можем использовать body как портал,
     // так как все стили передаются вместе с AppRootStyleContainer
-    const portalRoot = resolvedPortalFromContext || (document === null || document === void 0 ? void 0 : document.body) || null;
+    const portalRoot = resolvedPortalFromContext || document?.body || null;
     return portalRoot;
 }
 

package/dist/components/AppRoot/AppRootPortal.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/AppRoot/AppRootPortal.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useColorScheme } from '../../hooks/useColorScheme';\nimport { createPortal } from '../../lib/createPortal';\nimport { useDOM } from '../../lib/dom';\nimport { isRefObject } from '../../lib/isRefObject';\nimport type { HasChildren } from '../../types';\nimport { ColorSchemeProvider } from '../ColorSchemeProvider/ColorSchemeProvider';\nimport { AppRootContext, type AppRootContextInterface } from './AppRootContext';\nimport { AppRootStyleContainer } from './AppRootStyleContainer/AppRootStyleContainer';\n\nexport interface AppRootPortalProps extends HasChildren {\n  /**\n   * Настройка портала для рендеринга компонента.\n   *\n   * `true` - использует `portalRoot` из контекста `AppRoot` (если доступен) или `document.body`;\n   * `false` - отключает использование портала;\n   * `HTMLElement` - указывает конкретный DOM-элемент для использования в качестве портала;\n   * `React.RefObject<HTMLElement | null>` - ссылка на DOM-элемент для использования в качестве портала;\n   * `null` - эквивалентно `false`, отключает использование портала.\n   *\n   * @default true (использует `document.body` как портал по умолчанию)\n   */\n  usePortal?: boolean | HTMLElement | React.RefObject<HTMLElement | null> | null;\n  /**\n   * `className` для контейнера портала.\n   */\n  className?: string;\n}\n\nexport const AppRootPortal = ({\n  children,\n  usePortal,\n  className,\n}: AppRootPortalProps): React.ReactNode => {\n  const { mode, disablePortal: disableCreatePortalInGlobalPortalRoot } =\n    React.useContext(AppRootContext);\n  const colorScheme = useColorScheme();\n\n  const canUsePortal = shouldUsePortal(\n    usePortal,\n    mode,\n    Boolean(disableCreatePortalInGlobalPortalRoot),\n  );\n\n  const portalContainer = usePortalContainer(usePortal);\n\n  if (canUsePortal && portalContainer) {\n    return createPortal(\n      <ColorSchemeProvider value={colorScheme}>\n        <AppRootStyleContainer className={className}>{children}</AppRootStyleContainer>\n      </ColorSchemeProvider>,\n      portalContainer,\n    );\n  }\n\n  return children;\n};\n\nfunction shouldUsePortal(\n  usePortal: AppRootPortalProps['usePortal'],\n  mode: AppRootContextInterface['mode'],\n  disableCreatePortalInGlobalPortalRoot: boolean,\n) {\n  if (usePortal === undefined) {\n    return disableCreatePortalInGlobalPortalRoot === false && mode !== 'full';\n  }\n\n  if (typeof usePortal !== 'boolean') {\n    return true;\n  }\n\n  return disableCreatePortalInGlobalPortalRoot === false && usePortal === true;\n}\n\nfunction usePortalContainer(usePortal: AppRootPortalProps['usePortal']): HTMLElement | null {\n  const { portalRoot: portalRootFromContext } = React.useContext(AppRootContext);\n\n  const { document } = useDOM();\n\n  if (usePortal && typeof usePortal !== 'boolean') {\n    return isRefObject(usePortal) ? usePortal.current : usePortal;\n  }\n\n  const resolvedPortalFromContext = isRefObject(portalRootFromContext)\n    ? portalRootFromContext.current\n    : portalRootFromContext;\n  // если portalRoot не передали через AppRoot, то мы используем body\n  // мы можем использовать body как портал,\n  // так как все стили передаются вместе с AppRootStyleContainer\n  const portalRoot = resolvedPortalFromContext || document?.body || null;\n  return portalRoot;\n}\n"],"names":["React","useColorScheme","createPortal","useDOM","isRefObject","ColorSchemeProvider","AppRootContext","AppRootStyleContainer","AppRootPortal","children","usePortal","className","mode","disablePortal","disableCreatePortalInGlobalPortalRoot","useContext","colorScheme","canUsePortal","shouldUsePortal","Boolean","portalContainer","usePortalContainer","value","undefined","portalRoot","portalRootFromContext","document","current","resolvedPortalFromContext","body"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,cAAc,QAAQ,gCAA6B;AAC5D,SAASC,YAAY,QAAQ,4BAAyB;AACtD,SAASC,MAAM,QAAQ,mBAAgB;AACvC,SAASC,WAAW,QAAQ,2BAAwB;AAEpD,SAASC,mBAAmB,QAAQ,gDAA6C;AACjF,SAASC,cAAc,QAAsC,sBAAmB;AAChF,SAASC,qBAAqB,QAAQ,mDAAgD;AAqBtF,OAAO,MAAMC,gBAAgB,CAAC,EAC5BC,QAAQ,EACRC,SAAS,EACTC,SAAS,EACU;IACnB,MAAM,EAAEC,IAAI,EAAEC,eAAeC,qCAAqC,EAAE,GAClEd,MAAMe,UAAU,CAACT;IACnB,MAAMU,cAAcf;IAEpB,MAAMgB,eAAeC,gBACnBR,WACAE,MACAO,QAAQL;IAGV,MAAMM,kBAAkBC,mBAAmBX;IAE3C,IAAIO,gBAAgBG,iBAAiB;QACnC,OAAOlB,2BACL,KAACG;YAAoBiB,OAAON;sBAC1B,cAAA,KAACT;gBAAsBI,WAAWA;0BAAYF;;YAEhDW;IAEJ;IAEA,OAAOX;AACT,EAAE;AAEF,SAASS,gBACPR,SAA0C,EAC1CE,IAAqC,EACrCE,qCAA8C;IAE9C,IAAIJ,cAAca,WAAW;QAC3B,OAAOT,0CAA0C,SAASF,SAAS;IACrE;IAEA,IAAI,OAAOF,cAAc,WAAW;QAClC,OAAO;IACT;IAEA,OAAOI,0CAA0C,SAASJ,cAAc;AAC1E;AAEA,SAASW,mBAAmBX,SAA0C;IACpE,MAAM,EAAEc,YAAYC,qBAAqB,EAAE,GAAGzB,MAAMe,UAAU,CAACT;IAE/D,MAAM,EAAEoB,QAAQ,EAAE,GAAGvB;IAErB,IAAIO,aAAa,OAAOA,cAAc,WAAW;QAC/C,OAAON,YAAYM,aAAaA,UAAUiB,OAAO,GAAGjB;IACtD;IAEA,MAAMkB,4BAA4BxB,YAAYqB,yBAC1CA,sBAAsBE,OAAO,GAC7BF;IACJ,mEAAmE;IACnE,yCAAyC;IACzC,8DAA8D;IAC9D,MAAMD,aAAaI,8BAA6BF,qBAAAA,+BAAAA,SAAUG,IAAI,KAAI;IAClE,OAAOL;AACT"}
+{"version":3,"sources":["../../../src/components/AppRoot/AppRootPortal.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useColorScheme } from '../../hooks/useColorScheme';\nimport { createPortal } from '../../lib/createPortal';\nimport { useDOM } from '../../lib/dom';\nimport { isRefObject } from '../../lib/isRefObject';\nimport type { HasChildren } from '../../types';\nimport { ColorSchemeProvider } from '../ColorSchemeProvider/ColorSchemeProvider';\nimport { AppRootContext, type AppRootContextInterface } from './AppRootContext';\nimport { AppRootStyleContainer } from './AppRootStyleContainer/AppRootStyleContainer';\n\nexport interface AppRootPortalProps extends HasChildren {\n  /**\n   * Настройка портала для рендеринга компонента.\n   *\n   * `true` - использует `portalRoot` из контекста `AppRoot` (если доступен) или `document.body`;\n   * `false` - отключает использование портала;\n   * `HTMLElement` - указывает конкретный DOM-элемент для использования в качестве портала;\n   * `React.RefObject<HTMLElement | null>` - ссылка на DOM-элемент для использования в качестве портала;\n   * `null` - эквивалентно `false`, отключает использование портала.\n   *\n   * @default true (использует `document.body` как портал по умолчанию)\n   */\n  usePortal?: boolean | HTMLElement | React.RefObject<HTMLElement | null> | null;\n  /**\n   * `className` для контейнера портала.\n   */\n  className?: string;\n}\n\nexport const AppRootPortal = ({\n  children,\n  usePortal,\n  className,\n}: AppRootPortalProps): React.ReactNode => {\n  const { mode, disablePortal: disableCreatePortalInGlobalPortalRoot } =\n    React.useContext(AppRootContext);\n  const colorScheme = useColorScheme();\n\n  const canUsePortal = shouldUsePortal(\n    usePortal,\n    mode,\n    Boolean(disableCreatePortalInGlobalPortalRoot),\n  );\n\n  const portalContainer = usePortalContainer(usePortal);\n\n  if (canUsePortal && portalContainer) {\n    return createPortal(\n      <ColorSchemeProvider value={colorScheme}>\n        <AppRootStyleContainer className={className}>{children}</AppRootStyleContainer>\n      </ColorSchemeProvider>,\n      portalContainer,\n    );\n  }\n\n  return children;\n};\n\nfunction shouldUsePortal(\n  usePortal: AppRootPortalProps['usePortal'],\n  mode: AppRootContextInterface['mode'],\n  disableCreatePortalInGlobalPortalRoot: boolean,\n) {\n  if (usePortal === undefined) {\n    return disableCreatePortalInGlobalPortalRoot === false && mode !== 'full';\n  }\n\n  if (typeof usePortal !== 'boolean') {\n    return true;\n  }\n\n  return disableCreatePortalInGlobalPortalRoot === false && usePortal === true;\n}\n\nfunction usePortalContainer(usePortal: AppRootPortalProps['usePortal']): HTMLElement | null {\n  const { portalRoot: portalRootFromContext } = React.useContext(AppRootContext);\n\n  const { document } = useDOM();\n\n  if (usePortal && typeof usePortal !== 'boolean') {\n    return isRefObject(usePortal) ? usePortal.current : usePortal;\n  }\n\n  const resolvedPortalFromContext = isRefObject(portalRootFromContext)\n    ? portalRootFromContext.current\n    : portalRootFromContext;\n  // если portalRoot не передали через AppRoot, то мы используем body\n  // мы можем использовать body как портал,\n  // так как все стили передаются вместе с AppRootStyleContainer\n  const portalRoot = resolvedPortalFromContext || document?.body || null;\n  return portalRoot;\n}\n"],"names":["React","useColorScheme","createPortal","useDOM","isRefObject","ColorSchemeProvider","AppRootContext","AppRootStyleContainer","AppRootPortal","children","usePortal","className","mode","disablePortal","disableCreatePortalInGlobalPortalRoot","useContext","colorScheme","canUsePortal","shouldUsePortal","Boolean","portalContainer","usePortalContainer","value","undefined","portalRoot","portalRootFromContext","document","current","resolvedPortalFromContext","body"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,cAAc,QAAQ,gCAA6B;AAC5D,SAASC,YAAY,QAAQ,4BAAyB;AACtD,SAASC,MAAM,QAAQ,mBAAgB;AACvC,SAASC,WAAW,QAAQ,2BAAwB;AAEpD,SAASC,mBAAmB,QAAQ,gDAA6C;AACjF,SAASC,cAAc,QAAsC,sBAAmB;AAChF,SAASC,qBAAqB,QAAQ,mDAAgD;AAqBtF,OAAO,MAAMC,gBAAgB,CAAC,EAC5BC,QAAQ,EACRC,SAAS,EACTC,SAAS,EACU;IACnB,MAAM,EAAEC,IAAI,EAAEC,eAAeC,qCAAqC,EAAE,GAClEd,MAAMe,UAAU,CAACT;IACnB,MAAMU,cAAcf;IAEpB,MAAMgB,eAAeC,gBACnBR,WACAE,MACAO,QAAQL;IAGV,MAAMM,kBAAkBC,mBAAmBX;IAE3C,IAAIO,gBAAgBG,iBAAiB;QACnC,OAAOlB,2BACL,KAACG;YAAoBiB,OAAON;sBAC1B,cAAA,KAACT;gBAAsBI,WAAWA;0BAAYF;;YAEhDW;IAEJ;IAEA,OAAOX;AACT,EAAE;AAEF,SAASS,gBACPR,SAA0C,EAC1CE,IAAqC,EACrCE,qCAA8C;IAE9C,IAAIJ,cAAca,WAAW;QAC3B,OAAOT,0CAA0C,SAASF,SAAS;IACrE;IAEA,IAAI,OAAOF,cAAc,WAAW;QAClC,OAAO;IACT;IAEA,OAAOI,0CAA0C,SAASJ,cAAc;AAC1E;AAEA,SAASW,mBAAmBX,SAA0C;IACpE,MAAM,EAAEc,YAAYC,qBAAqB,EAAE,GAAGzB,MAAMe,UAAU,CAACT;IAE/D,MAAM,EAAEoB,QAAQ,EAAE,GAAGvB;IAErB,IAAIO,aAAa,OAAOA,cAAc,WAAW;QAC/C,OAAON,YAAYM,aAAaA,UAAUiB,OAAO,GAAGjB;IACtD;IAEA,MAAMkB,4BAA4BxB,YAAYqB,yBAC1CA,sBAAsBE,OAAO,GAC7BF;IACJ,mEAAmE;IACnE,yCAAyC;IACzC,8DAA8D;IAC9D,MAAMD,aAAaI,6BAA6BF,UAAUG,QAAQ;IAClE,OAAOL;AACT"}

package/dist/components/AppRoot/helpers.js

@@ -3,7 +3,7 @@ import { isRefObject } from "../../lib/isRefObject.js";
 export const extractPortalRootByProp = (portalRootProp)=>isRefObject(portalRootProp) ? portalRootProp.current : portalRootProp;
 export const CUSTOM_PROPERTY_INSET_PREFIX = `--vkui_internal--safe_area_inset_`;
 export function useSafeAreaInsetsMemo(safeAreaInsetsProp) {
-    const { top, right, bottom, left } = safeAreaInsetsProp !== null && safeAreaInsetsProp !== void 0 ? safeAreaInsetsProp : {};
+    const { top, right, bottom, left } = safeAreaInsetsProp ?? {};
     const safeAreaInsets = React.useMemo(()=>({
             top,
             right,

package/dist/components/AppRoot/helpers.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/AppRoot/helpers.ts"],"sourcesContent":["import * as React from 'react';\nimport { isRefObject } from '../../lib/isRefObject';\nimport type { AppRootUserSelectMode, SafeAreaInsets } from './types';\nimport styles from './AppRootStyleContainer/AppRootStyleContainer.module.css';\n\nexport const extractPortalRootByProp = (\n  portalRootProp: HTMLElement | React.RefObject<HTMLElement>,\n): HTMLElement | null => (isRefObject(portalRootProp) ? portalRootProp.current : portalRootProp);\n\nexport const CUSTOM_PROPERTY_INSET_PREFIX = `--vkui_internal--safe_area_inset_`;\n\nexport function useSafeAreaInsetsMemo(safeAreaInsetsProp: SafeAreaInsets | undefined) {\n  const { top, right, bottom, left } = safeAreaInsetsProp ?? {};\n  const safeAreaInsets = React.useMemo(\n    () => ({\n      top,\n      right,\n      bottom,\n      left,\n    }),\n    [top, right, bottom, left],\n  );\n\n  return safeAreaInsets;\n}\n\nexport function getSafeAreaInsetsAsCssVariables(\n  safeAreaInsets: SafeAreaInsets | undefined,\n): Record<string, string> {\n  if (!safeAreaInsets) {\n    return {};\n  }\n\n  const cssVariables = Object.entries(safeAreaInsets).reduce<Record<string, string>>(\n    (result, [key, value]) => {\n      if (value === undefined) {\n        return result;\n      }\n\n      result[`${CUSTOM_PROPERTY_INSET_PREFIX}${key}`] = `${value}px`;\n\n      return result;\n    },\n    {},\n  );\n\n  return cssVariables;\n}\n\nexport function getUserSelectModeClassName({\n  userSelectMode,\n  isWebView,\n  hasPointer,\n}: {\n  userSelectMode: AppRootUserSelectMode | undefined;\n  isWebView: boolean;\n  hasPointer: boolean | undefined;\n}): string | null {\n  switch (userSelectMode) {\n    case 'enabled-with-pointer': {\n      if (hasPointer) {\n        return null;\n      }\n\n      const enableByHasPointerMediaQuery = hasPointer === undefined;\n      if (enableByHasPointerMediaQuery) {\n        return styles.pointerNone;\n      }\n\n      return styles.userSelectNone;\n    }\n    case 'disabled':\n      return styles.userSelectNone;\n    case 'enabled':\n      return null;\n    default:\n      return isWebView ? styles.userSelectNone : null;\n  }\n}\n"],"names":["React","isRefObject","extractPortalRootByProp","portalRootProp","current","CUSTOM_PROPERTY_INSET_PREFIX","useSafeAreaInsetsMemo","safeAreaInsetsProp","top","right","bottom","left","safeAreaInsets","useMemo","getSafeAreaInsetsAsCssVariables","cssVariables","Object","entries","reduce","result","key","value","undefined","getUserSelectModeClassName","userSelectMode","isWebView","hasPointer","enableByHasPointerMediaQuery"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,WAAW,QAAQ,2BAAwB;AAIpD,OAAO,MAAMC,0BAA0B,CACrCC,iBACwBF,YAAYE,kBAAkBA,eAAeC,OAAO,GAAGD,eAAgB;AAEjG,OAAO,MAAME,+BAA+B,CAAC,iCAAiC,CAAC,CAAC;AAEhF,OAAO,SAASC,sBAAsBC,kBAA8C;IAClF,MAAM,EAAEC,GAAG,EAAEC,KAAK,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGJ,+BAAAA,gCAAAA,qBAAsB,CAAC;IAC5D,MAAMK,iBAAiBZ,MAAMa,OAAO,CAClC,IAAO,CAAA;YACLL;YACAC;YACAC;YACAC;QACF,CAAA,GACA;QAACH;QAAKC;QAAOC;QAAQC;KAAK;IAG5B,OAAOC;AACT;AAEA,OAAO,SAASE,gCACdF,cAA0C;IAE1C,IAAI,CAACA,gBAAgB;QACnB,OAAO,CAAC;IACV;IAEA,MAAMG,eAAeC,OAAOC,OAAO,CAACL,gBAAgBM,MAAM,CACxD,CAACC,QAAQ,CAACC,KAAKC,MAAM;QACnB,IAAIA,UAAUC,WAAW;YACvB,OAAOH;QACT;QAEAA,MAAM,CAAC,GAAGd,+BAA+Be,KAAK,CAAC,GAAG,GAAGC,MAAM,EAAE,CAAC;QAE9D,OAAOF;IACT,GACA,CAAC;IAGH,OAAOJ;AACT;AAEA,OAAO,SAASQ,2BAA2B,EACzCC,cAAc,EACdC,SAAS,EACTC,UAAU,EAKX;IACC,OAAQF;QACN,KAAK;YAAwB;gBAC3B,IAAIE,YAAY;oBACd,OAAO;gBACT;gBAEA,MAAMC,+BAA+BD,eAAeJ;gBACpD,IAAIK,8BAA8B;oBAChC;gBACF;gBAEA;YACF;QACA,KAAK;YACH;QACF,KAAK;YACH,OAAO;QACT;YACE,OAAOF,0DAAoC;IAC/C;AACF"}
+{"version":3,"sources":["../../../src/components/AppRoot/helpers.ts"],"sourcesContent":["import * as React from 'react';\nimport { isRefObject } from '../../lib/isRefObject';\nimport type { AppRootUserSelectMode, SafeAreaInsets } from './types';\nimport styles from './AppRootStyleContainer/AppRootStyleContainer.module.css';\n\nexport const extractPortalRootByProp = (\n  portalRootProp: HTMLElement | React.RefObject<HTMLElement>,\n): HTMLElement | null => (isRefObject(portalRootProp) ? portalRootProp.current : portalRootProp);\n\nexport const CUSTOM_PROPERTY_INSET_PREFIX = `--vkui_internal--safe_area_inset_`;\n\nexport function useSafeAreaInsetsMemo(safeAreaInsetsProp: SafeAreaInsets | undefined) {\n  const { top, right, bottom, left } = safeAreaInsetsProp ?? {};\n  const safeAreaInsets = React.useMemo(\n    () => ({\n      top,\n      right,\n      bottom,\n      left,\n    }),\n    [top, right, bottom, left],\n  );\n\n  return safeAreaInsets;\n}\n\nexport function getSafeAreaInsetsAsCssVariables(\n  safeAreaInsets: SafeAreaInsets | undefined,\n): Record<string, string> {\n  if (!safeAreaInsets) {\n    return {};\n  }\n\n  const cssVariables = Object.entries(safeAreaInsets).reduce<Record<string, string>>(\n    (result, [key, value]) => {\n      if (value === undefined) {\n        return result;\n      }\n\n      result[`${CUSTOM_PROPERTY_INSET_PREFIX}${key}`] = `${value}px`;\n\n      return result;\n    },\n    {},\n  );\n\n  return cssVariables;\n}\n\nexport function getUserSelectModeClassName({\n  userSelectMode,\n  isWebView,\n  hasPointer,\n}: {\n  userSelectMode: AppRootUserSelectMode | undefined;\n  isWebView: boolean;\n  hasPointer: boolean | undefined;\n}): string | null {\n  switch (userSelectMode) {\n    case 'enabled-with-pointer': {\n      if (hasPointer) {\n        return null;\n      }\n\n      const enableByHasPointerMediaQuery = hasPointer === undefined;\n      if (enableByHasPointerMediaQuery) {\n        return styles.pointerNone;\n      }\n\n      return styles.userSelectNone;\n    }\n    case 'disabled':\n      return styles.userSelectNone;\n    case 'enabled':\n      return null;\n    default:\n      return isWebView ? styles.userSelectNone : null;\n  }\n}\n"],"names":["React","isRefObject","extractPortalRootByProp","portalRootProp","current","CUSTOM_PROPERTY_INSET_PREFIX","useSafeAreaInsetsMemo","safeAreaInsetsProp","top","right","bottom","left","safeAreaInsets","useMemo","getSafeAreaInsetsAsCssVariables","cssVariables","Object","entries","reduce","result","key","value","undefined","getUserSelectModeClassName","userSelectMode","isWebView","hasPointer","enableByHasPointerMediaQuery"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,WAAW,QAAQ,2BAAwB;AAIpD,OAAO,MAAMC,0BAA0B,CACrCC,iBACwBF,YAAYE,kBAAkBA,eAAeC,OAAO,GAAGD,eAAgB;AAEjG,OAAO,MAAME,+BAA+B,CAAC,iCAAiC,CAAC,CAAC;AAEhF,OAAO,SAASC,sBAAsBC,kBAA8C;IAClF,MAAM,EAAEC,GAAG,EAAEC,KAAK,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGJ,sBAAsB,CAAC;IAC5D,MAAMK,iBAAiBZ,MAAMa,OAAO,CAClC,IAAO,CAAA;YACLL;YACAC;YACAC;YACAC;QACF,CAAA,GACA;QAACH;QAAKC;QAAOC;QAAQC;KAAK;IAG5B,OAAOC;AACT;AAEA,OAAO,SAASE,gCACdF,cAA0C;IAE1C,IAAI,CAACA,gBAAgB;QACnB,OAAO,CAAC;IACV;IAEA,MAAMG,eAAeC,OAAOC,OAAO,CAACL,gBAAgBM,MAAM,CACxD,CAACC,QAAQ,CAACC,KAAKC,MAAM;QACnB,IAAIA,UAAUC,WAAW;YACvB,OAAOH;QACT;QAEAA,MAAM,CAAC,GAAGd,+BAA+Be,KAAK,CAAC,GAAG,GAAGC,MAAM,EAAE,CAAC;QAE9D,OAAOF;IACT,GACA,CAAC;IAGH,OAAOJ;AACT;AAEA,OAAO,SAASQ,2BAA2B,EACzCC,cAAc,EACdC,SAAS,EACTC,UAAU,EAKX;IACC,OAAQF;QACN,KAAK;YAAwB;gBAC3B,IAAIE,YAAY;oBACd,OAAO;gBACT;gBAEA,MAAMC,+BAA+BD,eAAeJ;gBACpD,IAAIK,8BAA8B;oBAChC;gBACF;gBAEA;YACF;QACA,KAAK;YACH;QACF,KAAK;YACH,OAAO;QACT;YACE,OAAOF,0DAAoC;IAC/C;AACF"}

package/dist/components/Calendar/Calendar.js

@@ -66,7 +66,7 @@ const warn = warnOnce('Calendar');
         const key = pressedKey(event);
         if (key && NAVIGATION_KEYS.includes(key)) {
             event.preventDefault();
-            const newFocusedDay = navigateDate(focusedDay !== null && focusedDay !== void 0 ? focusedDay : timeZonedValue, key);
+            const newFocusedDay = navigateDate(focusedDay ?? timeZonedValue, key);
             if (newFocusedDay && !isSameMonth(newFocusedDay, viewDate)) {
                 setViewDate(newFocusedDay);
             }
@@ -80,9 +80,8 @@ const warn = warnOnce('Calendar');
             return;
         }
         if ((key === Keys.ENTER || key === Keys.SPACE) && isHTMLElement(event.target)) {
-            var _event_target_click, _event_target;
             event.preventDefault();
-            (_event_target_click = (_event_target = event.target).click) === null || _event_target_click === void 0 ? void 0 : _event_target_click.call(_event_target);
+            event.target.click?.();
         }
     }, [
         focusedDay,
@@ -93,7 +92,7 @@ const warn = warnOnce('Calendar');
         viewDate
     ]);
     const onDayChange = React.useCallback((date)=>{
-        let actualDate = createDateInTimeZone(timeZonedValue !== null && timeZonedValue !== void 0 ? timeZonedValue : date, timezone, {
+        let actualDate = createDateInTimeZone(timeZonedValue ?? date, timezone, {
             year: date.getFullYear(),
             month: date.getMonth(),
             date: date.getDate()