@procore/core-react 12.41.0 → 12.43.0

package/dist/Modal/Modal.js

@@ -4,8 +4,12 @@ var _excluded = ["children", "compact", "onClose", "qa"],
   _excluded4 = ["children", "compact", "noSideSpacing"],
   _excluded5 = ["children"],
   _excluded6 = ["children"],
-  _excluded7 = ["aria-describedby", "aria-details", "aria-labelledby", "aria-label", "children", "compact", "howToClose", "id", "onClickOverlay", "onClose", "open", "placement", "role"],
-  _excluded8 = ["children", "headline", "onClose"];
+  _excluded7 = ["aria-describedby", "aria-details", "aria-labelledby", "aria-label", "aria-modal", "children", "compact", "howToClose", "id", "onClickOverlay", "onClose", "open", "placement", "role"],
+  _excluded8 = ["children", "headline", "howToClose", "onClose"];
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
 function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
@@ -58,7 +62,6 @@ var ModalClosableHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     qa = _ref.qa,
     props = _objectWithoutProperties(_ref, _excluded);
   var _React$useContext = React.useContext(ModalBodyScrollContext),
-    ariaLabelledBy = _React$useContext.ariaLabelledBy,
     isBodyScrolled = _React$useContext.isBodyScrolled;
   var _React$useContext2 = React.useContext(ModalCloseContext),
     howToClose = _React$useContext2.howToClose,
@@ -93,9 +96,6 @@ var ModalClosableHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     }
   }, /*#__PURE__*/React.createElement(StyledModalHeading, {
     $compact: compact
-    // This made all children the heading, like Title content
-    ,
-    id: ariaLabelledBy
   }, children), onClose && howToClose !== null && howToClose !== void 0 && howToClose.includes('x') || externalOnClose ? /*#__PURE__*/React.createElement(StyledModalCancel, null, /*#__PURE__*/React.createElement(Button, {
     "aria-label": I18n.t('core.modal.a11y.close'),
     "data-internal": "close-button",
@@ -219,6 +219,7 @@ var Modal_ = /*#__PURE__*/React.forwardRef(function (_ref7, ref) {
     ariaDetails = _ref7['aria-details'],
     ariaLabelledby = _ref7['aria-labelledby'],
     ariaLabel = _ref7['aria-label'],
+    ariaModal = _ref7['aria-modal'],
     children = _ref7.children,
     _ref7$compact = _ref7.compact,
     compact = _ref7$compact === void 0 ? false : _ref7$compact,
@@ -277,13 +278,13 @@ var Modal_ = /*#__PURE__*/React.forwardRef(function (_ref7, ref) {
       'aria-details': ariaDetails,
       'aria-labelledby': labelledbyId,
       'aria-label': ariaLabel,
+      'aria-modal': ariaModal,
       id: id,
-      isModal: false,
       isOpen: open,
       role: role
     }),
     dialogProps_ = _useModalDialogLike.dialogProps;
-  var dialogProps = onClose && role === 'dialog' ? dialogProps_ : {};
+  var dialogProps = onClose && (role === 'dialog' || role === 'alertdialog') ? dialogProps_ : {};
   function onClickScrim(e) {
     onClickOverlay(e);
     if (onClose && howToClose !== null && howToClose !== void 0 && howToClose.includes('scrim')) {
@@ -342,21 +343,32 @@ var ModalBodyScrollObserver = function ModalBodyScrollObserver(_ref8) {
 export var ConfirmModal = /*#__PURE__*/React.forwardRef(function (_ref9, ref) {
   var children = _ref9.children,
     headline = _ref9.headline,
+    _ref9$howToClose = _ref9.howToClose,
+    howToClose = _ref9$howToClose === void 0 ? [] : _ref9$howToClose,
     onClose = _ref9.onClose,
     props = _objectWithoutProperties(_ref9, _excluded8);
-  return /*#__PURE__*/React.createElement(Modal, _extends({}, props, {
+  var isDialog = props.role === 'dialog' || props.role === 'alertdialog';
+
+  // When role="dialog", pass onClose to Modal for focus management and Escape key.
+  // The header X button is handled via ModalCloseContext when howToClose includes 'x'.
+  var configuredModalProps = isDialog && onClose ? {
+    onClose: onClose,
+    howToClose: ['x'].concat(_toConsumableArray(howToClose))
+  } : undefined;
+  var headerOnClose = !isDialog && onClose ? onClose : undefined;
+  return /*#__PURE__*/React.createElement(Modal, _extends({}, props, configuredModalProps, {
     ref: ref
   }), /*#__PURE__*/React.createElement(ModalClosableHeader, {
-    onClose: onClose
+    onClose: headerOnClose
   }, /*#__PURE__*/React.createElement(StyledModalWarningIcon, {
     size: "lg"
-  }), headline), children);
+  }), /*#__PURE__*/React.createElement(ModalHeading, null, headline)), children);
 });
 
 /**
- * Applies proper smenatics regardless of where in the Modal.
- * Adds the generate ID to node when necessary so the dialog and scroll region
- * aria-labelledby by can find the primary heading (in the Modal.Header)
+ * Applies proper semantics regardless of where in the Modal.
+ * @a11y The primary heading that is auto linked to the dialog and scroll region with
+ * aria-labelledby, when inside the Modal.Header.
  */
 var ModalHeading = function ModalHeading(props) {
   var _React$useContext6 = React.useContext(ModalBodyScrollContext),
@@ -415,6 +427,10 @@ export var Modal = addSubcomponents({
   FooterNotation: FooterNotation,
   FooterSummary: FooterSummary,
   Header: Header,
+  /**
+   * @a11y The primary heading inside the `Modal.Header` that is auto linked
+   * to the dialog and scroll region with aria-labelledby.
+   */
   Heading: ModalHeading,
   Overlay: Overlay,
   Scrim: Scrim,

package/dist/Modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","names":["Clear","useId","React","useEffect","Button","useModalDialogLike","Portal","Heading","LevelContext","Section","SectionProvider","useDeprecation","useLayoutEventListener","OverridableFocusScope","useI18nContext","useOverflowObserver","useScrollLock","Visibility","addSubcomponents","CloseWithConfirmContext","useCloseWithConfirmContext","useCloseWithConfirmState","mergeRefs","ChildRegistryProvider","useModalChildRegistryDispatch","fadeInClassName","fadeOutClassName","StyledModal","StyledModalBody","StyledModalButtons","StyledModalCancel","StyledModalContainer","StyledModalContent","StyledModalFooter","StyledModalFooterNotation","StyledModalFooterSummary","StyledModalHeader","StyledModalHeading","StyledModalScrim","StyledModalWarningIcon","useInitializeModalFocus","noop","defaultStartLevel","initialBodyLevel","ModalCloseContext","createContext","howToClose","onClose","undefined","ModalPrimaryHeadingCheckContext","inModalHeader","ModalBodyScrollContext","isBodyScrolled","setIsBodyScrolled","ariaLabelledBy","ModalClosableHeader","forwardRef","_ref","ref","children","_ref$compact","compact","externalOnClose","qa","props","_objectWithoutProperties","_excluded","_React$useContext","useContext","_React$useContext2","I18n","modalClosableHeaderRef","useRef","_useCloseWithConfirmC","closeWithConfirm","registerChildRef","child","onClickButton","e","includes","createElement","_extends","$compact","$isBodyScrolled","Provider","value","id","t","closeButton","icon","onClick","size","variant","ModalClosableFooterButtons","_ref2","_excluded2","_React$useContext3","_useCloseWithConfirmC2","modalClosableFooterButtonsRef","ModalContainer","_ref3","_ref3$compact","placement","width","_excluded3","_React$useContext4","modalContainerRef","hasOnClose","shadowStrength","$placement","$width","ModalBody","_ref4","_ref4$compact","_ref4$noSideSpacing","noSideSpacing","_excluded4","_useOverflowObserver","isOverflowingY","overflowRef","scrollRef","modalBodyRef","_React$useContext5","event","handler","currentTarget","scrollTop","scope","$isOverflowingY","$noSideSpacing","tabIndex","role","ModalFooterSummary","_ref5","_excluded5","ModalFooterNotation","_ref6","_excluded6","intent","color","italic","Modal_","_ref7","ariaDescribedby","ariaDetails","ariaLabelledby","ariaLabel","_ref7$compact","_ref7$onClickOverlay","onClickOverlay","_ref7$open","open","_ref7$placement","_excluded7","defaultLabelId","labelledbyId","_React$useState","useState","_React$useState2","_slicedToArray","visible","setVisible","_React$useState3","_React$useState4","fadeType","setFadeType","closeWithConfirmState","fadeTimer","setTimeout","clearTimeout","onTransitionEnd","handleKeyDown","key","preventDefault","stopPropagation","_useModalDialogLike","isModal","isOpen","dialogProps_","dialogProps","onClickScrim","autoFocus","contain","restoreFocus","className","onKeyDown","ModalBodyScrollObserver","_ref8","_React$useState5","_React$useState6","ConfirmModal","_ref9","headline","_excluded8","Modal","ModalHeading","_React$useContext6","_React$useContext7","ModalState","oldThing","displayName","Body","Container","Content","FooterSummary","Footer","FooterButtons","FooterNotation","Header","Overlay","Scrim","State"],"sources":["../../src/Modal/Modal.tsx"],"sourcesContent":["import { Clear } from '@procore/core-icons/dist'\nimport { useId } from '@react-aria/utils'\nimport React, { useEffect } from 'react'\nimport { Button } from '../Button'\nimport { useModalDialogLike } from '../OverlayTrigger/a11yPresets'\nimport { Portal } from '../Portal'\nimport {\n  Heading,\n  LevelContext,\n  Section,\n  SectionProvider,\n} from '../Section/Section'\nimport type { HeadingProps } from '../Semantic/Semantic.types'\nimport type { TypographyProps } from '../Typography'\nimport { useDeprecation } from '../_hooks/Deprecation'\nimport { useLayoutEventListener } from '../_hooks/EventListener'\nimport { OverridableFocusScope } from '../_hooks/FocusScopeOverride'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { useOverflowObserver } from '../_hooks/OverflowObserver'\nimport { useScrollLock } from '../_hooks/ScrollLock'\nimport type { RenderProps } from '../_hooks/Visibility'\nimport { Visibility } from '../_hooks/Visibility'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport {\n  CloseWithConfirmContext,\n  useCloseWithConfirmContext,\n  useCloseWithConfirmState,\n} from '../_utils/closeWithConfirm'\nimport { mergeRefs } from '../_utils/mergeRefs'\nimport {\n  ChildRegistryProvider,\n  useModalChildRegistryDispatch,\n} from './ChildRegistry.context'\nimport {\n  fadeInClassName,\n  fadeOutClassName,\n  StyledModal,\n  StyledModalBody,\n  StyledModalButtons,\n  StyledModalCancel,\n  StyledModalContainer,\n  StyledModalContent,\n  StyledModalFooter,\n  StyledModalFooterNotation,\n  StyledModalFooterSummary,\n  StyledModalHeader,\n  StyledModalHeading,\n  StyledModalScrim,\n  StyledModalWarningIcon,\n} from './Modal.styles'\nimport type {\n  ConfirmModalProps,\n  ModalBodyProps,\n  ModalCloseableHeaderProps,\n  ModalCloseContextApi,\n  ModalContainerProps,\n  ModalProps,\n} from './Modal.types'\nimport { useInitializeModalFocus } from './useInitializeModalFocus'\n\nfunction noop() {}\nconst defaultStartLevel = 2\nconst initialBodyLevel = 3\n\nconst ModalCloseContext = React.createContext<ModalCloseContextApi>({\n  howToClose: [],\n  onClose: undefined,\n})\n\nconst ModalPrimaryHeadingCheckContext = React.createContext({\n  inModalHeader: false,\n})\n\ninterface ModalBodyScrollContextApi {\n  isBodyScrolled: boolean\n  setIsBodyScrolled: React.Dispatch<React.SetStateAction<boolean>>\n  ariaLabelledBy?: string\n}\n\nconst ModalBodyScrollContext = React.createContext<ModalBodyScrollContextApi>({\n  isBodyScrolled: false,\n  setIsBodyScrolled: noop,\n  ariaLabelledBy: undefined,\n})\n\nconst ModalClosableHeader = React.forwardRef<\n  HTMLDivElement,\n  ModalCloseableHeaderProps\n>(\n  (\n    { children, compact = false, onClose: externalOnClose, qa, ...props },\n    ref\n  ) => {\n    const { ariaLabelledBy, isBodyScrolled } = React.useContext(\n      ModalBodyScrollContext\n    )\n    const { howToClose, onClose } = React.useContext(ModalCloseContext)\n    const I18n = useI18nContext()\n    const modalClosableHeaderRef = React.useRef(null)\n\n    const { closeWithConfirm } = useCloseWithConfirmContext()\n    const registerChildRef = useModalChildRegistryDispatch()\n\n    useEffect(() => {\n      registerChildRef({ child: 'header', ref: modalClosableHeaderRef })\n    }, [])\n\n    function onClickButton(e: React.MouseEvent<HTMLButtonElement>) {\n      if (onClose && howToClose?.includes('x')) {\n        closeWithConfirm(onClose)(e, 'x')\n        return\n      }\n      closeWithConfirm(externalOnClose!)(e)\n    }\n\n    return (\n      <StyledModalHeader\n        $compact={compact}\n        $isBodyScrolled={isBodyScrolled}\n        {...props}\n        ref={mergeRefs(ref, modalClosableHeaderRef)}\n        data-id=\"modal-header\"\n      >\n        <ModalPrimaryHeadingCheckContext.Provider\n          value={{ inModalHeader: true }}\n        >\n          <StyledModalHeading\n            $compact={compact}\n            // This made all children the heading, like Title content\n            id={ariaLabelledBy}\n          >\n            {children}\n          </StyledModalHeading>\n          {(onClose && howToClose?.includes('x')) || externalOnClose ? (\n            <StyledModalCancel>\n              <Button\n                aria-label={I18n.t('core.modal.a11y.close')}\n                data-internal=\"close-button\"\n                data-qa={qa?.closeButton}\n                icon={<Clear />}\n                onClick={onClickButton}\n                size={compact ? 'sm' : 'md'}\n                variant=\"tertiary\"\n              />\n            </StyledModalCancel>\n          ) : null}\n        </ModalPrimaryHeadingCheckContext.Provider>\n      </StyledModalHeader>\n    )\n  }\n)\n\nconst ModalClosableFooterButtons = React.forwardRef<\n  HTMLDivElement,\n  ModalCloseableHeaderProps\n>(({ children, ...props }, ref) => {\n  const { howToClose, onClose } = React.useContext(ModalCloseContext)\n  const I18n = useI18nContext()\n  const { closeWithConfirm } = useCloseWithConfirmContext()\n  const modalClosableFooterButtonsRef = React.useRef(null)\n\n  const registerChildRef = useModalChildRegistryDispatch()\n\n  useEffect(() => {\n    registerChildRef({\n      child: 'closeableButtons',\n      ref: modalClosableFooterButtonsRef,\n    })\n  }, [])\n\n  function onClickButton(e: React.MouseEvent<HTMLButtonElement>) {\n    closeWithConfirm(onClose!)(e, 'footer-button')\n  }\n\n  return (\n    <StyledModalButtons\n      {...props}\n      ref={mergeRefs(ref, modalClosableFooterButtonsRef)}\n    >\n      {howToClose?.includes('footer-button') && (\n        <Button onClick={onClickButton} variant=\"tertiary\">\n          {I18n.t('core.modal.cancel')}\n        </Button>\n      )}\n      {children}\n    </StyledModalButtons>\n  )\n})\n\nconst ModalContainer = React.forwardRef<HTMLDivElement, ModalContainerProps>(\n  ({ compact = false, placement, width, ...props }, ref) => {\n    const { onClose } = React.useContext(ModalCloseContext)\n    const modalContainerRef = React.useRef<HTMLDivElement>(null)\n    useInitializeModalFocus({ modalContainerRef, hasOnClose: !!onClose })\n\n    return (\n      <StyledModalContainer\n        {...props}\n        shadowStrength={4}\n        $compact={compact}\n        $placement={placement}\n        $width={width}\n        ref={mergeRefs(ref, modalContainerRef)}\n      />\n    )\n  }\n)\n\nconst ModalBody = React.forwardRef<HTMLDivElement, ModalBodyProps>(\n  ({ children, compact = false, noSideSpacing = false, ...props }, ref) => {\n    const { isOverflowingY, ref: overflowRef } = useOverflowObserver()\n    const scrollRef = React.useRef(null)\n    const modalBodyRef = React.useRef(null)\n    const { ariaLabelledBy, setIsBodyScrolled } = React.useContext(\n      ModalBodyScrollContext\n    )\n    const registerChildRef = useModalChildRegistryDispatch()\n\n    useEffect(() => {\n      registerChildRef({ child: 'body', ref: modalBodyRef })\n    }, [])\n\n    useLayoutEventListener({\n      event: 'scroll',\n      handler: (e: React.UIEvent<HTMLElement>) => {\n        setIsBodyScrolled(e.currentTarget.scrollTop > 0)\n      },\n      scope: scrollRef,\n    })\n\n    return (\n      <SectionProvider>\n        <LevelContext.Provider value={initialBodyLevel}>\n          <StyledModalBody\n            {...props}\n            $compact={compact}\n            $isOverflowingY={isOverflowingY}\n            $noSideSpacing={noSideSpacing}\n            ref={mergeRefs(overflowRef, scrollRef, ref, modalBodyRef)}\n            tabIndex={0}\n            role=\"region\"\n            aria-labelledby={ariaLabelledBy}\n          >\n            {children}\n          </StyledModalBody>\n        </LevelContext.Provider>\n      </SectionProvider>\n    )\n  }\n)\n\nconst ModalFooterSummary = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ children, ...props }, ref) => {\n  return (\n    <StyledModalFooterSummary {...props} ref={ref}>\n      {children}\n    </StyledModalFooterSummary>\n  )\n})\n\nconst ModalFooterNotation = React.forwardRef<\n  HTMLSpanElement,\n  React.HTMLAttributes<HTMLSpanElement> & TypographyProps\n>(({ children, ...props }, ref) => (\n  <StyledModalFooterNotation\n    aria-live=\"polite\"\n    intent=\"small\"\n    color=\"gray45\"\n    italic\n    {...props}\n    ref={ref}\n  >\n    {children}\n  </StyledModalFooterNotation>\n))\n\nconst Modal_ = React.forwardRef<HTMLDivElement, ModalProps>(\n  (\n    {\n      ['aria-describedby']: ariaDescribedby,\n      ['aria-details']: ariaDetails,\n      ['aria-labelledby']: ariaLabelledby,\n      ['aria-label']: ariaLabel,\n      children,\n      compact = false,\n      howToClose,\n      id,\n      onClickOverlay = noop,\n      onClose,\n      open = false,\n      placement = 'center',\n      role,\n      ...props\n    },\n    ref\n  ) => {\n    useScrollLock(open)\n    const defaultLabelId = useId()\n    const labelledbyId = ariaLabel ? id : ariaLabelledby ?? defaultLabelId\n    const [visible, setVisible] = React.useState<boolean>(open)\n    const [fadeType, setFadeType] = React.useState<string>('')\n    const closeWithConfirmState = useCloseWithConfirmState()\n    const { closeWithConfirm } = closeWithConfirmState\n\n    React.useEffect(() => {\n      if (open) {\n        setVisible(true)\n        const fadeTimer = setTimeout(() => {\n          setFadeType(fadeInClassName)\n        }, 0)\n        return () => clearTimeout(fadeTimer)\n      } else {\n        setFadeType(fadeOutClassName)\n      }\n    }, [open])\n\n    const onTransitionEnd = () => {\n      if (fadeType === fadeOutClassName) {\n        setVisible(false)\n      }\n    }\n\n    const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n      if (!onClose) return\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        e.stopPropagation()\n        closeWithConfirm(onClose)(e, 'x')\n      }\n    }\n\n    const { dialogProps: dialogProps_ } = useModalDialogLike({\n      'aria-describedby': ariaDescribedby,\n      'aria-details': ariaDetails,\n      'aria-labelledby': labelledbyId,\n      'aria-label': ariaLabel,\n      id,\n      isModal: false,\n      isOpen: open,\n      role,\n    })\n\n    const dialogProps = onClose && role === 'dialog' ? dialogProps_ : {}\n\n    function onClickScrim(e: React.MouseEvent<HTMLDivElement>) {\n      onClickOverlay(e)\n      if (onClose && howToClose?.includes('scrim')) {\n        closeWithConfirm(onClose)(e, 'scrim')\n      }\n    }\n\n    return visible ? (\n      <Portal>\n        <ModalCloseContext.Provider value={{ onClose, howToClose }}>\n          <LevelContext.Provider value={defaultStartLevel}>\n            <ChildRegistryProvider>\n              <OverridableFocusScope\n                // TODO breaking - always\n                autoFocus={!!onClose}\n                contain={!!onClose}\n                restoreFocus={!!onClose}\n              >\n                <StyledModal\n                  className={fadeType}\n                  ref={ref}\n                  onTransitionEnd={onTransitionEnd}\n                  onKeyDown={handleKeyDown}\n                  {...dialogProps}\n                  data-id=\"modal\"\n                >\n                  <StyledModalScrim\n                    data-qa=\"core-modal-scrim\"\n                    onClick={onClickScrim}\n                  />\n\n                  <ModalContainer\n                    {...props}\n                    compact={compact}\n                    placement={placement}\n                  >\n                    <StyledModalContent $compact={compact}>\n                      <ModalBodyScrollObserver ariaLabelledBy={labelledbyId}>\n                        <CloseWithConfirmContext.Provider\n                          value={closeWithConfirmState}\n                        >\n                          {children}\n                        </CloseWithConfirmContext.Provider>\n                      </ModalBodyScrollObserver>\n                    </StyledModalContent>\n                  </ModalContainer>\n                </StyledModal>\n              </OverridableFocusScope>\n            </ChildRegistryProvider>\n          </LevelContext.Provider>\n        </ModalCloseContext.Provider>\n      </Portal>\n    ) : null\n  }\n)\n\ninterface ModalBodyScrollObserverProps {\n  ariaLabelledBy?: string\n}\n\nconst ModalBodyScrollObserver = ({\n  ariaLabelledBy,\n  children,\n}: React.PropsWithChildren<ModalBodyScrollObserverProps>) => {\n  const [isBodyScrolled, setIsBodyScrolled] = React.useState<boolean>(false)\n\n  return (\n    <ModalBodyScrollContext.Provider\n      value={{ ariaLabelledBy, isBodyScrolled, setIsBodyScrolled }}\n    >\n      {children}\n    </ModalBodyScrollContext.Provider>\n  )\n}\n\nexport const ConfirmModal = React.forwardRef<HTMLDivElement, ConfirmModalProps>(\n  ({ children, headline, onClose, ...props }, ref) => {\n    return (\n      <Modal {...props} ref={ref}>\n        <ModalClosableHeader onClose={onClose}>\n          <StyledModalWarningIcon size=\"lg\" />\n          {headline}\n        </ModalClosableHeader>\n        {children}\n      </Modal>\n    )\n  }\n)\n\n/**\n * Applies proper smenatics regardless of where in the Modal.\n * Adds the generate ID to node when necessary so the dialog and scroll region\n * aria-labelledby by can find the primary heading (in the Modal.Header)\n */\nconst ModalHeading = (\n  props: React.PropsWithChildren<HeadingProps & { level?: number }>\n) => {\n  const { ariaLabelledBy } = React.useContext(ModalBodyScrollContext)\n  const { inModalHeader } = React.useContext(ModalPrimaryHeadingCheckContext)\n\n  return <Heading id={inModalHeader ? ariaLabelledBy : undefined} {...props} />\n}\n\nfunction ModalState(props: RenderProps) {\n  useDeprecation({ oldThing: 'Modal.State' })\n  return <Visibility {...props} />\n}\n\nModal_.displayName = 'Modal'\n\nConfirmModal.displayName = 'ConfirmModal'\n\nModalBody.displayName = 'Modal.Body'\n\nModalFooterNotation.displayName = 'Modal.FooterNotation'\n\nModalFooterSummary.displayName = 'Modal.FooterSummary'\n\nconst Body = ModalBody\nconst Container = ModalContainer\nconst Content = StyledModalContent\nconst FooterSummary = ModalFooterSummary\nconst Footer = StyledModalFooter\nconst FooterButtons = ModalClosableFooterButtons\nconst FooterNotation = ModalFooterNotation\nconst Header = ModalClosableHeader\nconst Overlay = StyledModal\nconst Scrim = StyledModalScrim\nconst State = ModalState\n\n/**\n\n We use modals to present additional actions, information, or forms on pages\n where a user’s experience would benefit from remaining on the same page.\n They can include graphics, inputs, buttons, and other elements as needed to\n produce the workflow or action needed.\n\n Do not include modals on pages with complicated UI layouts.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-modal--demo)\n\n @see [Design Guidelines](https://design.procore.com/modal)\n\n */\nexport const Modal = addSubcomponents(\n  {\n    Body,\n    Container,\n    Content,\n    Footer,\n    FooterButtons,\n    FooterNotation,\n    FooterSummary,\n    Header,\n    Heading: ModalHeading,\n    Overlay,\n    Scrim,\n    State,\n    Section,\n  },\n  Modal_\n)\n"],"mappings":"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"}
+{"version":3,"file":"Modal.js","names":["Clear","useId","React","useEffect","Button","useModalDialogLike","Portal","Heading","LevelContext","Section","SectionProvider","useDeprecation","useLayoutEventListener","OverridableFocusScope","useI18nContext","useOverflowObserver","useScrollLock","Visibility","addSubcomponents","CloseWithConfirmContext","useCloseWithConfirmContext","useCloseWithConfirmState","mergeRefs","ChildRegistryProvider","useModalChildRegistryDispatch","fadeInClassName","fadeOutClassName","StyledModal","StyledModalBody","StyledModalButtons","StyledModalCancel","StyledModalContainer","StyledModalContent","StyledModalFooter","StyledModalFooterNotation","StyledModalFooterSummary","StyledModalHeader","StyledModalHeading","StyledModalScrim","StyledModalWarningIcon","useInitializeModalFocus","noop","defaultStartLevel","initialBodyLevel","ModalCloseContext","createContext","howToClose","onClose","undefined","ModalPrimaryHeadingCheckContext","inModalHeader","ModalBodyScrollContext","isBodyScrolled","setIsBodyScrolled","ariaLabelledBy","ModalClosableHeader","forwardRef","_ref","ref","children","_ref$compact","compact","externalOnClose","qa","props","_objectWithoutProperties","_excluded","_React$useContext","useContext","_React$useContext2","I18n","modalClosableHeaderRef","useRef","_useCloseWithConfirmC","closeWithConfirm","registerChildRef","child","onClickButton","e","includes","createElement","_extends","$compact","$isBodyScrolled","Provider","value","t","closeButton","icon","onClick","size","variant","ModalClosableFooterButtons","_ref2","_excluded2","_React$useContext3","_useCloseWithConfirmC2","modalClosableFooterButtonsRef","ModalContainer","_ref3","_ref3$compact","placement","width","_excluded3","_React$useContext4","modalContainerRef","hasOnClose","shadowStrength","$placement","$width","ModalBody","_ref4","_ref4$compact","_ref4$noSideSpacing","noSideSpacing","_excluded4","_useOverflowObserver","isOverflowingY","overflowRef","scrollRef","modalBodyRef","_React$useContext5","event","handler","currentTarget","scrollTop","scope","$isOverflowingY","$noSideSpacing","tabIndex","role","ModalFooterSummary","_ref5","_excluded5","ModalFooterNotation","_ref6","_excluded6","intent","color","italic","Modal_","_ref7","ariaDescribedby","ariaDetails","ariaLabelledby","ariaLabel","ariaModal","_ref7$compact","id","_ref7$onClickOverlay","onClickOverlay","_ref7$open","open","_ref7$placement","_excluded7","defaultLabelId","labelledbyId","_React$useState","useState","_React$useState2","_slicedToArray","visible","setVisible","_React$useState3","_React$useState4","fadeType","setFadeType","closeWithConfirmState","fadeTimer","setTimeout","clearTimeout","onTransitionEnd","handleKeyDown","key","preventDefault","stopPropagation","_useModalDialogLike","isOpen","dialogProps_","dialogProps","onClickScrim","autoFocus","contain","restoreFocus","className","onKeyDown","ModalBodyScrollObserver","_ref8","_React$useState5","_React$useState6","ConfirmModal","_ref9","headline","_ref9$howToClose","_excluded8","isDialog","configuredModalProps","concat","_toConsumableArray","headerOnClose","Modal","ModalHeading","_React$useContext6","_React$useContext7","ModalState","oldThing","displayName","Body","Container","Content","FooterSummary","Footer","FooterButtons","FooterNotation","Header","Overlay","Scrim","State"],"sources":["../../src/Modal/Modal.tsx"],"sourcesContent":["import { Clear } from '@procore/core-icons/dist'\nimport { useId } from '@react-aria/utils'\nimport React, { useEffect } from 'react'\nimport { Button } from '../Button'\nimport { useModalDialogLike } from '../OverlayTrigger/a11yPresets'\nimport { Portal } from '../Portal'\nimport {\n  Heading,\n  LevelContext,\n  Section,\n  SectionProvider,\n} from '../Section/Section'\nimport type { HeadingProps } from '../Semantic/Semantic.types'\nimport type { TypographyProps } from '../Typography'\nimport { useDeprecation } from '../_hooks/Deprecation'\nimport { useLayoutEventListener } from '../_hooks/EventListener'\nimport { OverridableFocusScope } from '../_hooks/FocusScopeOverride'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { useOverflowObserver } from '../_hooks/OverflowObserver'\nimport { useScrollLock } from '../_hooks/ScrollLock'\nimport type { RenderProps } from '../_hooks/Visibility'\nimport { Visibility } from '../_hooks/Visibility'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport {\n  CloseWithConfirmContext,\n  useCloseWithConfirmContext,\n  useCloseWithConfirmState,\n} from '../_utils/closeWithConfirm'\nimport { mergeRefs } from '../_utils/mergeRefs'\nimport {\n  ChildRegistryProvider,\n  useModalChildRegistryDispatch,\n} from './ChildRegistry.context'\nimport {\n  fadeInClassName,\n  fadeOutClassName,\n  StyledModal,\n  StyledModalBody,\n  StyledModalButtons,\n  StyledModalCancel,\n  StyledModalContainer,\n  StyledModalContent,\n  StyledModalFooter,\n  StyledModalFooterNotation,\n  StyledModalFooterSummary,\n  StyledModalHeader,\n  StyledModalHeading,\n  StyledModalScrim,\n  StyledModalWarningIcon,\n} from './Modal.styles'\nimport type {\n  ConfirmModalProps,\n  ModalBodyProps,\n  ModalCloseableHeaderProps,\n  ModalCloseContextApi,\n  ModalContainerProps,\n  ModalOnClose,\n  ModalOptionalCloseStartegy,\n  ModalProps,\n} from './Modal.types'\nimport { useInitializeModalFocus } from './useInitializeModalFocus'\n\nfunction noop() {}\nconst defaultStartLevel = 2\nconst initialBodyLevel = 3\n\nconst ModalCloseContext = React.createContext<ModalCloseContextApi>({\n  howToClose: [],\n  onClose: undefined,\n})\n\nconst ModalPrimaryHeadingCheckContext = React.createContext({\n  inModalHeader: false,\n})\n\ninterface ModalBodyScrollContextApi {\n  isBodyScrolled: boolean\n  setIsBodyScrolled: React.Dispatch<React.SetStateAction<boolean>>\n  ariaLabelledBy?: string\n}\n\nconst ModalBodyScrollContext = React.createContext<ModalBodyScrollContextApi>({\n  isBodyScrolled: false,\n  setIsBodyScrolled: noop,\n  ariaLabelledBy: undefined,\n})\n\nconst ModalClosableHeader = React.forwardRef<\n  HTMLDivElement,\n  ModalCloseableHeaderProps\n>(\n  (\n    { children, compact = false, onClose: externalOnClose, qa, ...props },\n    ref\n  ) => {\n    const { isBodyScrolled } = React.useContext(ModalBodyScrollContext)\n    const { howToClose, onClose } = React.useContext(ModalCloseContext)\n    const I18n = useI18nContext()\n    const modalClosableHeaderRef = React.useRef(null)\n\n    const { closeWithConfirm } = useCloseWithConfirmContext()\n    const registerChildRef = useModalChildRegistryDispatch()\n\n    useEffect(() => {\n      registerChildRef({ child: 'header', ref: modalClosableHeaderRef })\n    }, [])\n\n    function onClickButton(e: React.MouseEvent<HTMLButtonElement>) {\n      if (onClose && howToClose?.includes('x')) {\n        closeWithConfirm(onClose)(e, 'x')\n        return\n      }\n      closeWithConfirm(externalOnClose!)(e)\n    }\n\n    return (\n      <StyledModalHeader\n        $compact={compact}\n        $isBodyScrolled={isBodyScrolled}\n        {...props}\n        ref={mergeRefs(ref, modalClosableHeaderRef)}\n        data-id=\"modal-header\"\n      >\n        <ModalPrimaryHeadingCheckContext.Provider\n          value={{ inModalHeader: true }}\n        >\n          <StyledModalHeading $compact={compact}>{children}</StyledModalHeading>\n          {(onClose && howToClose?.includes('x')) || externalOnClose ? (\n            <StyledModalCancel>\n              <Button\n                aria-label={I18n.t('core.modal.a11y.close')}\n                data-internal=\"close-button\"\n                data-qa={qa?.closeButton}\n                icon={<Clear />}\n                onClick={onClickButton}\n                size={compact ? 'sm' : 'md'}\n                variant=\"tertiary\"\n              />\n            </StyledModalCancel>\n          ) : null}\n        </ModalPrimaryHeadingCheckContext.Provider>\n      </StyledModalHeader>\n    )\n  }\n)\n\nconst ModalClosableFooterButtons = React.forwardRef<\n  HTMLDivElement,\n  ModalCloseableHeaderProps\n>(({ children, ...props }, ref) => {\n  const { howToClose, onClose } = React.useContext(ModalCloseContext)\n  const I18n = useI18nContext()\n  const { closeWithConfirm } = useCloseWithConfirmContext()\n  const modalClosableFooterButtonsRef = React.useRef(null)\n\n  const registerChildRef = useModalChildRegistryDispatch()\n\n  useEffect(() => {\n    registerChildRef({\n      child: 'closeableButtons',\n      ref: modalClosableFooterButtonsRef,\n    })\n  }, [])\n\n  function onClickButton(e: React.MouseEvent<HTMLButtonElement>) {\n    closeWithConfirm(onClose!)(e, 'footer-button')\n  }\n\n  return (\n    <StyledModalButtons\n      {...props}\n      ref={mergeRefs(ref, modalClosableFooterButtonsRef)}\n    >\n      {howToClose?.includes('footer-button') && (\n        <Button onClick={onClickButton} variant=\"tertiary\">\n          {I18n.t('core.modal.cancel')}\n        </Button>\n      )}\n      {children}\n    </StyledModalButtons>\n  )\n})\n\nconst ModalContainer = React.forwardRef<HTMLDivElement, ModalContainerProps>(\n  ({ compact = false, placement, width, ...props }, ref) => {\n    const { onClose } = React.useContext(ModalCloseContext)\n    const modalContainerRef = React.useRef<HTMLDivElement>(null)\n    useInitializeModalFocus({ modalContainerRef, hasOnClose: !!onClose })\n\n    return (\n      <StyledModalContainer\n        {...props}\n        shadowStrength={4}\n        $compact={compact}\n        $placement={placement}\n        $width={width}\n        ref={mergeRefs(ref, modalContainerRef)}\n      />\n    )\n  }\n)\n\nconst ModalBody = React.forwardRef<HTMLDivElement, ModalBodyProps>(\n  ({ children, compact = false, noSideSpacing = false, ...props }, ref) => {\n    const { isOverflowingY, ref: overflowRef } = useOverflowObserver()\n    const scrollRef = React.useRef(null)\n    const modalBodyRef = React.useRef(null)\n    const { ariaLabelledBy, setIsBodyScrolled } = React.useContext(\n      ModalBodyScrollContext\n    )\n    const registerChildRef = useModalChildRegistryDispatch()\n\n    useEffect(() => {\n      registerChildRef({ child: 'body', ref: modalBodyRef })\n    }, [])\n\n    useLayoutEventListener({\n      event: 'scroll',\n      handler: (e: React.UIEvent<HTMLElement>) => {\n        setIsBodyScrolled(e.currentTarget.scrollTop > 0)\n      },\n      scope: scrollRef,\n    })\n\n    return (\n      <SectionProvider>\n        <LevelContext.Provider value={initialBodyLevel}>\n          <StyledModalBody\n            {...props}\n            $compact={compact}\n            $isOverflowingY={isOverflowingY}\n            $noSideSpacing={noSideSpacing}\n            ref={mergeRefs(overflowRef, scrollRef, ref, modalBodyRef)}\n            tabIndex={0}\n            role=\"region\"\n            aria-labelledby={ariaLabelledBy}\n          >\n            {children}\n          </StyledModalBody>\n        </LevelContext.Provider>\n      </SectionProvider>\n    )\n  }\n)\n\nconst ModalFooterSummary = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ children, ...props }, ref) => {\n  return (\n    <StyledModalFooterSummary {...props} ref={ref}>\n      {children}\n    </StyledModalFooterSummary>\n  )\n})\n\nconst ModalFooterNotation = React.forwardRef<\n  HTMLSpanElement,\n  React.HTMLAttributes<HTMLSpanElement> & TypographyProps\n>(({ children, ...props }, ref) => (\n  <StyledModalFooterNotation\n    aria-live=\"polite\"\n    intent=\"small\"\n    color=\"gray45\"\n    italic\n    {...props}\n    ref={ref}\n  >\n    {children}\n  </StyledModalFooterNotation>\n))\n\nconst Modal_ = React.forwardRef<HTMLDivElement, ModalProps>(\n  (\n    {\n      ['aria-describedby']: ariaDescribedby,\n      ['aria-details']: ariaDetails,\n      ['aria-labelledby']: ariaLabelledby,\n      ['aria-label']: ariaLabel,\n      ['aria-modal']: ariaModal,\n      children,\n      compact = false,\n      howToClose,\n      id,\n      onClickOverlay = noop,\n      onClose,\n      open = false,\n      placement = 'center',\n      role,\n      ...props\n    },\n    ref\n  ) => {\n    useScrollLock(open)\n    const defaultLabelId = useId()\n    const labelledbyId = ariaLabel ? id : ariaLabelledby ?? defaultLabelId\n    const [visible, setVisible] = React.useState<boolean>(open)\n    const [fadeType, setFadeType] = React.useState<string>('')\n    const closeWithConfirmState = useCloseWithConfirmState()\n    const { closeWithConfirm } = closeWithConfirmState\n\n    React.useEffect(() => {\n      if (open) {\n        setVisible(true)\n        const fadeTimer = setTimeout(() => {\n          setFadeType(fadeInClassName)\n        }, 0)\n        return () => clearTimeout(fadeTimer)\n      } else {\n        setFadeType(fadeOutClassName)\n      }\n    }, [open])\n\n    const onTransitionEnd = () => {\n      if (fadeType === fadeOutClassName) {\n        setVisible(false)\n      }\n    }\n\n    const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n      if (!onClose) return\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        e.stopPropagation()\n        closeWithConfirm(onClose)(e, 'x')\n      }\n    }\n\n    const { dialogProps: dialogProps_ } = useModalDialogLike({\n      'aria-describedby': ariaDescribedby,\n      'aria-details': ariaDetails,\n      'aria-labelledby': labelledbyId,\n      'aria-label': ariaLabel,\n      'aria-modal': ariaModal,\n      id,\n      isOpen: open,\n      role,\n    })\n\n    const dialogProps =\n      onClose && (role === 'dialog' || role === 'alertdialog')\n        ? dialogProps_\n        : {}\n\n    function onClickScrim(e: React.MouseEvent<HTMLDivElement>) {\n      onClickOverlay(e)\n      if (onClose && howToClose?.includes('scrim')) {\n        closeWithConfirm(onClose)(e, 'scrim')\n      }\n    }\n\n    return visible ? (\n      <Portal>\n        <ModalCloseContext.Provider value={{ onClose, howToClose }}>\n          <LevelContext.Provider value={defaultStartLevel}>\n            <ChildRegistryProvider>\n              <OverridableFocusScope\n                // TODO breaking - always\n                autoFocus={!!onClose}\n                contain={!!onClose}\n                restoreFocus={!!onClose}\n              >\n                <StyledModal\n                  className={fadeType}\n                  ref={ref}\n                  onTransitionEnd={onTransitionEnd}\n                  onKeyDown={handleKeyDown}\n                  {...dialogProps}\n                  data-id=\"modal\"\n                >\n                  <StyledModalScrim\n                    data-qa=\"core-modal-scrim\"\n                    onClick={onClickScrim}\n                  />\n\n                  <ModalContainer\n                    {...props}\n                    compact={compact}\n                    placement={placement}\n                  >\n                    <StyledModalContent $compact={compact}>\n                      <ModalBodyScrollObserver ariaLabelledBy={labelledbyId}>\n                        <CloseWithConfirmContext.Provider\n                          value={closeWithConfirmState}\n                        >\n                          {children}\n                        </CloseWithConfirmContext.Provider>\n                      </ModalBodyScrollObserver>\n                    </StyledModalContent>\n                  </ModalContainer>\n                </StyledModal>\n              </OverridableFocusScope>\n            </ChildRegistryProvider>\n          </LevelContext.Provider>\n        </ModalCloseContext.Provider>\n      </Portal>\n    ) : null\n  }\n)\n\ninterface ModalBodyScrollObserverProps {\n  ariaLabelledBy?: string\n}\n\nconst ModalBodyScrollObserver = ({\n  ariaLabelledBy,\n  children,\n}: React.PropsWithChildren<ModalBodyScrollObserverProps>) => {\n  const [isBodyScrolled, setIsBodyScrolled] = React.useState<boolean>(false)\n\n  return (\n    <ModalBodyScrollContext.Provider\n      value={{ ariaLabelledBy, isBodyScrolled, setIsBodyScrolled }}\n    >\n      {children}\n    </ModalBodyScrollContext.Provider>\n  )\n}\n\nexport const ConfirmModal = React.forwardRef<HTMLDivElement, ConfirmModalProps>(\n  ({ children, headline, howToClose = [], onClose, ...props }, ref) => {\n    const isDialog = props.role === 'dialog' || props.role === 'alertdialog'\n\n    // When role=\"dialog\", pass onClose to Modal for focus management and Escape key.\n    // The header X button is handled via ModalCloseContext when howToClose includes 'x'.\n    const configuredModalProps =\n      isDialog && onClose\n        ? {\n            onClose: onClose as ModalOnClose,\n            howToClose: ['x', ...howToClose] as ModalOptionalCloseStartegy[],\n          }\n        : undefined\n    const headerOnClose =\n      !isDialog && onClose\n        ? (onClose as (event: React.MouseEvent<HTMLButtonElement>) => void)\n        : undefined\n\n    return (\n      <Modal {...props} {...configuredModalProps} ref={ref}>\n        <ModalClosableHeader onClose={headerOnClose}>\n          <StyledModalWarningIcon size=\"lg\" />\n          <ModalHeading>{headline}</ModalHeading>\n        </ModalClosableHeader>\n        {children}\n      </Modal>\n    )\n  }\n)\n\n/**\n * Applies proper semantics regardless of where in the Modal.\n * @a11y The primary heading that is auto linked to the dialog and scroll region with\n * aria-labelledby, when inside the Modal.Header.\n */\nconst ModalHeading = (\n  props: React.PropsWithChildren<HeadingProps & { level?: number }>\n) => {\n  const { ariaLabelledBy } = React.useContext(ModalBodyScrollContext)\n  const { inModalHeader } = React.useContext(ModalPrimaryHeadingCheckContext)\n\n  return <Heading id={inModalHeader ? ariaLabelledBy : undefined} {...props} />\n}\n\nfunction ModalState(props: RenderProps) {\n  useDeprecation({ oldThing: 'Modal.State' })\n  return <Visibility {...props} />\n}\n\nModal_.displayName = 'Modal'\n\nConfirmModal.displayName = 'ConfirmModal'\n\nModalBody.displayName = 'Modal.Body'\n\nModalFooterNotation.displayName = 'Modal.FooterNotation'\n\nModalFooterSummary.displayName = 'Modal.FooterSummary'\n\nconst Body = ModalBody\nconst Container = ModalContainer\nconst Content = StyledModalContent\nconst FooterSummary = ModalFooterSummary\nconst Footer = StyledModalFooter\nconst FooterButtons = ModalClosableFooterButtons\nconst FooterNotation = ModalFooterNotation\nconst Header = ModalClosableHeader\nconst Overlay = StyledModal\nconst Scrim = StyledModalScrim\nconst State = ModalState\n\n/**\n\n We use modals to present additional actions, information, or forms on pages\n where a user’s experience would benefit from remaining on the same page.\n They can include graphics, inputs, buttons, and other elements as needed to\n produce the workflow or action needed.\n\n Do not include modals on pages with complicated UI layouts.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-modal--demo)\n\n @see [Design Guidelines](https://design.procore.com/modal)\n\n */\nexport const Modal = addSubcomponents(\n  {\n    Body,\n    Container,\n    Content,\n    Footer,\n    FooterButtons,\n    FooterNotation,\n    FooterSummary,\n    Header,\n    /**\n     * @a11y The primary heading inside the `Modal.Header` that is auto linked\n     * to the dialog and scroll region with aria-labelledby.\n     */\n    Heading: ModalHeading,\n    Overlay,\n    Scrim,\n    State,\n    Section,\n  },\n  Modal_\n)\n"],"mappings":"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"}

package/dist/Modal/Modal.styles.js

@@ -32,15 +32,15 @@ var screenWidthPixelBreakpoints = {
 };
 export var StyledModal = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledModal",
-  componentId: "core-12_41_0__sc-1ijdug2-0"
+  componentId: "core-12_43_0__sc-1ijdug2-0"
 })(["display:flex;height:100vh;position:absolute;opacity:0;transition:0.3s opacity ease;width:100vw;z-index:0;pointer-events:none;&.", "{opacity:1;pointer-events:auto;}&.", "{opacity:0;pointer-events:none;}"], fadeInClassName, fadeOutClassName);
 export var StyledModalButtons = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledModalButtons",
-  componentId: "core-12_41_0__sc-1ijdug2-1"
+  componentId: "core-12_43_0__sc-1ijdug2-1"
 })(["display:flex;flex:0 0 auto;margin-left:", "px;> * + *{margin-left:", "px;}"], spacing.lg, spacing.sm);
 export var StyledModalContainer = /*#__PURE__*/styled(Card).withConfig({
   displayName: "StyledModalContainer",
-  componentId: "core-12_41_0__sc-1ijdug2-2"
+  componentId: "core-12_43_0__sc-1ijdug2-2"
 })(["display:flex;flex-direction:row;position:absolute;z-index:2;", " ", " ", ""], function (_ref) {
   var $compact = _ref.$compact;
   if (!$compact) {
@@ -64,11 +64,11 @@ export var StyledModalContainer = /*#__PURE__*/styled(Card).withConfig({
 });
 export var StyledModalFooter = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledModalFooter",
-  componentId: "core-12_41_0__sc-1ijdug2-3"
+  componentId: "core-12_43_0__sc-1ijdug2-3"
 })(["align-items:center;display:flex;flex:0 0 auto;flex-wrap:wrap;justify-content:flex-end;padding:", "px ", "px ", "px;"], spacing.xl, spacing.xxl, spacing.xxl);
 export var StyledModalBody = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledModalBody",
-  componentId: "core-12_41_0__sc-1ijdug2-4"
+  componentId: "core-12_43_0__sc-1ijdug2-4"
 })(["", " &:focus-visible{", "}box-sizing:border-box;color:", ";display:flex;flex-direction:column;overflow:auto;", " ", " > ", "{padding-left:0;padding-right:0;&:first-child > ", "{padding-top:0;}}", ""], getTypographyIntent('body'), getFocusInset(), colors.gray15, function (_ref4) {
   var $noSideSpacing = _ref4.$noSideSpacing;
   return css(["padding:", "px ", "px;"], spacing.xl, $noSideSpacing ? 0 : spacing.xxl);
@@ -85,7 +85,7 @@ export var StyledModalBody = /*#__PURE__*/styled.div.withConfig({
 });
 export var StyledModalContent = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledModalContent",
-  componentId: "core-12_41_0__sc-1ijdug2-5"
+  componentId: "core-12_43_0__sc-1ijdug2-5"
 })(["display:flex;flex-direction:column;max-height:90vh;overflow:hidden;width:100%;", ""], function (_ref7) {
   var _ref7$$compact = _ref7.$compact,
     $compact = _ref7$$compact === void 0 ? false : _ref7$$compact;
@@ -96,11 +96,11 @@ export var StyledModalContent = /*#__PURE__*/styled.div.withConfig({
 });
 export var StyledModalFooterNotation = /*#__PURE__*/styled(Typography).withConfig({
   displayName: "StyledModalFooterNotation",
-  componentId: "core-12_41_0__sc-1ijdug2-6"
+  componentId: "core-12_43_0__sc-1ijdug2-6"
 })(["flex-grow:1;"]);
 export var StyledModalHeader = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledModalHeader",
-  componentId: "core-12_41_0__sc-1ijdug2-7"
+  componentId: "core-12_43_0__sc-1ijdug2-7"
 })(["align-items:flex-start;color:", ";display:flex;flex:0 0 auto;position:relative;", " ", ""], colors.gray10, function (_ref8) {
   var $compact = _ref8.$compact,
     $isBodyScrolled = _ref8.$isBodyScrolled;
@@ -118,7 +118,7 @@ export var StyledModalHeader = /*#__PURE__*/styled.div.withConfig({
 });
 export var StyledModalHeading = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledModalHeading",
-  componentId: "core-12_41_0__sc-1ijdug2-8"
+  componentId: "core-12_43_0__sc-1ijdug2-8"
 })(["", " align-items:center;display:flex;flex:1 1 auto;min-height:36px;padding-right:", "px;", ""], function (_ref0) {
   var $compact = _ref0.$compact;
   return getTypographyIntent($compact ? 'h3' : 'h2');
@@ -134,18 +134,18 @@ export var StyledModalHeading = /*#__PURE__*/styled.div.withConfig({
 });
 export var StyledModalCancel = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledModalCancel",
-  componentId: "core-12_41_0__sc-1ijdug2-9"
+  componentId: "core-12_43_0__sc-1ijdug2-9"
 })(["flex:0 0 auto;"]);
 export var StyledModalScrim = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledModalScrim",
-  componentId: "core-12_41_0__sc-1ijdug2-10"
+  componentId: "core-12_43_0__sc-1ijdug2-10"
 })(["background:hsla(200,8%,10%,0.6);height:100vh;left:0;position:absolute;top:0;width:100vw;z-index:1;"]);
 export var StyledModalWarningIcon = /*#__PURE__*/styled(Warning).withConfig({
   displayName: "StyledModalWarningIcon",
-  componentId: "core-12_41_0__sc-1ijdug2-11"
+  componentId: "core-12_43_0__sc-1ijdug2-11"
 })(["color:", ";margin-right:", "px;"], colors.yellow40, spacing.sm);
 export var StyledModalFooterSummary = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledModalFooterSummary",
-  componentId: "core-12_41_0__sc-1ijdug2-12"
+  componentId: "core-12_43_0__sc-1ijdug2-12"
 })(["", " border-top:1px solid ", ";border-bottom:1px solid ", ";padding:", "px ", "px;color:", ";font-style:italic;background-color:", ";margin:-", "px -", "px ", "px -", "px;flex:1 1 100%;"], getTypographyIntent('small'), colors.gray85, colors.gray85, spacing.md, spacing.xxl, colors.gray15, colors.gray98, spacing.xl, spacing.xxl, spacing.xl, spacing.xxl);
 //# sourceMappingURL=Modal.styles.js.map

package/dist/Modal/Modal.types.d.ts

@@ -10,7 +10,7 @@ export declare type ModalWidth = 'sm' | 'md' | 'lg' | 'xl';
  */
 export declare type ModalOptionalCloseStartegy = 'x' | 'footer-button' | 'scrim';
 declare type ModalCloseStragety = 'esc' | ModalOptionalCloseStartegy;
-declare type ModalOnClose = (event: React.MouseEvent<HTMLDivElement> | React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLElement>, how: ModalCloseStragety) => void;
+export declare type ModalOnClose = (event: React.MouseEvent<HTMLDivElement> | React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLElement>, how: ModalCloseStragety) => void;
 export interface ModalCloseContextApi {
     /**
      * Escape key will always close a dialog. This adds additional UI or UX to close.
@@ -44,6 +44,12 @@ export interface ModalProps extends Props {
      * @since 11.12.0
      */
     'aria-label'?: string;
+    /**
+     * @a11y Should be used for a single true modal. Cannot open nested modals.
+     * @experimental Core-React does not support multiple or nested `aria-modal`s for Tearsheets, Modals, or ConfirmModals.
+     * @since 12.42.0
+     */
+    'aria-modal'?: boolean;
     /**
      * @deprecated @experimental Changes the UI of modal to work on mobile breakpoints, to be used on Helix Header ONLY
      * @defaultValue false
@@ -65,7 +71,8 @@ export interface ModalProps extends Props {
      */
     id?: string;
     /**
-     * Callback for clicking the overlay
+     * @deprecated Use `howToClose={['scrim']}` with `onClose` instead.
+     * @deprecatedSince 12.41.0
      * @since 10.19.0
      */
     onClickOverlay?: (event: React.MouseEvent<HTMLDivElement>) => void;
@@ -85,7 +92,7 @@ export interface ModalProps extends Props {
     /**
      * Enable dialog props. REQUIRES `onClose` to enable Escape key and focus management. MUST be labelled, prefer `aria-labelledby` over `aria-label`.
      */
-    role?: 'dialog';
+    role?: 'dialog' | 'alertdialog';
     /**
      * Vertical placement of the modal.
      * Positioning modal at the top ensures that variable height modal won't shift position during content loading,
@@ -124,10 +131,24 @@ export interface ConfirmModalProps extends Omit<ModalProps, 'onClose'> {
      */
     headline?: string;
     /**
-     * The dismiss onClick callback
+     * Callback when the ConfirmModal is dismissed.
+     *
+     * @a11y **Accessible pattern (recommended):** Use with `role="dialog"` and `howToClose={['x']}`.
+     * This enables focus management, Escape key support, and proper dialog semantics.
+     * The callback signature is `(event, how) => void`.
+     *
+     * **Legacy pattern:** `(event: MouseEvent<HTMLButtonElement>) => void` — only handles X button click,
+     * no focus management or Escape key support.
+     *
      * @since 10.19.0
      */
-    onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    onClose?: ModalOnClose | ((event: React.MouseEvent<HTMLButtonElement>) => void);
+    /**
+     *
+     * @a11y Recommended to use. When using alertdialog should be a `aria-modal` because of their urgent nature. **Cannot open nested modals.**
+     * @since 12.42.0
+     */
+    'aria-modal'?: boolean;
 }
 /**
  * NOTE: Using howToClose 'x' requires the `Modal.Header` component.
@@ -135,6 +156,8 @@ export interface ConfirmModalProps extends Omit<ModalProps, 'onClose'> {
  */
 export interface ModalCloseableHeaderProps extends Props {
     /**
+     * @deprecated Use `Modal onClose` with `howToClose={['x']}` instead.
+     * @deprecatedSince 12.41.0
      * @since 10.19.0
      */
     onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;

package/dist/Modal/Modal.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.types.js","names":[],"sources":["../../src/Modal/Modal.types.ts"],"sourcesContent":["import type React from 'react'\nimport type { Props } from '../_utils/types'\n\nexport type ModalPlacement = 'top' | 'center'\nexport type ModalWidth = 'sm' | 'md' | 'lg' | 'xl'\n\n/**\n * Additional UI/UX to dismiss. (In addition to the Esc key)\n *  - `x` Close Button in the Modal Header\n *  - `scrim` Overlay dimmed scrim\n *  - `footer-button` Cancel Button in the Modal Footer Actions\n */\nexport type ModalOptionalCloseStartegy = 'x' | 'footer-button' | 'scrim'\ntype ModalCloseStragety = 'esc' | ModalOptionalCloseStartegy\n\ntype ModalOnClose = (\n  event: // clicked scrim\n  | React.MouseEvent<HTMLDivElement>\n    // clicked x button\n    | React.MouseEvent<HTMLButtonElement>\n    // pressed escape key\n    | React.KeyboardEvent<HTMLElement>,\n  how: ModalCloseStragety\n) => void\n\nexport interface ModalCloseContextApi {\n  /**\n   * Escape key will always close a dialog. This adds additional UI or UX to close.\n   */\n  howToClose: ModalOptionalCloseStartegy[] | undefined\n  onClose: ModalOnClose | undefined\n}\n\nexport interface ModalCloseableHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * @deprecated @experimental Changes the UI of modal to work on mobile breakpoints, to be used on Helix Header ONLY\n   * @defaultValue false\n   * @since 12.8.0\n   */\n  compact?: boolean\n  qa?: { closeButton?: string }\n}\n\nexport interface ModalProps extends Props {\n  'aria-describedby'?: string\n  'aria-details'?: string\n  /**\n   * @a11y Automatially created when using `Modal.Heading`. The `role='dialog'` MUST be labelled. Prefer `aria-labelledby` over `aria-label`.\n   * @since 11.12.0\n   */\n  'aria-labelledby'?: string\n  /**\n   * @a11y `role='dialog'` MUST be labelled. Prefer `aria-labelledby` over `aria-label`.\n   * If using an `aria-label` instead of a node, be sure give the modal an `id` so\n   * other regions can reference it.\n   * @since 11.12.0\n   */\n  'aria-label'?: string\n  /**\n   * @deprecated @experimental Changes the UI of modal to work on mobile breakpoints, to be used on Helix Header ONLY\n   * @defaultValue false\n   * @since 12.8.0\n   */\n  compact?: boolean\n  /**\n   * This adds additional UI or UX to close. Escape key will always close a dialog, see `onClose`.\n   *\n   * NOTE 'footer-button': Footer Cancel button still requires at least a rendered self closing `Modal.FooterButtons`.\n   *\n   * NOTE 'x': The X button still requires a rendered `Modal.Header` component.\n   * @defaultValue []\n   * @since 11.12.0\n   */\n  howToClose?: ModalOptionalCloseStartegy[]\n  /**\n   * Aligns with `role` and `ref` location.\n   */\n  id?: string\n  /**\n   * Callback for clicking the overlay\n   * @since 10.19.0\n   */\n  onClickOverlay?: (event: React.MouseEvent<HTMLDivElement>) => void\n  /**\n   * When a user closes the Modal by some approved `howToClose` method or the Escape key. This also opts-in to dialog focus management.\n   * @a11y Future default! Moves focus into and cycles focus in the Modal, and returning focus\n   * to the trigger when closed. Also enables the Escape key to close the Modal.\n   * @since 11.6.0\n   */\n  onClose?: ModalOnClose\n  /**\n   * Modal open state\n   * @defaultValue false\n   * @since 10.19.0\n   */\n  open?: boolean\n  /**\n   * Enable dialog props. REQUIRES `onClose` to enable Escape key and focus management. MUST be labelled, prefer `aria-labelledby` over `aria-label`.\n   */\n  role?: 'dialog'\n  /**\n   * Vertical placement of the modal.\n   * Positioning modal at the top ensures that variable height modal won't shift position during content loading,\n   * providing a more stable user experience.\n   * @defaultValue center\n   * @since 10.19.0\n   */\n  placement?: ModalPlacement\n  /**\n   * Sets a width on the container and uses next centering.\n   * Future will default to `md`\n   * @since 10.19.0\n   */\n  width?: ModalWidth\n}\n\nexport interface ModalContainerProps extends Props {\n  /**\n   * @deprecated @experimental Changes the UI of modal to work on mobile breakpoints, to be used on Helix Header ONLY\n   * @defaultValue false\n   * @since 12.8.0\n   */\n  compact?: boolean\n  /**\n   * @since 10.19.0\n   */\n  placement: ModalPlacement\n  /**\n   * @since 10.19.0\n   */\n  width?: ModalWidth\n}\n\nexport interface ConfirmModalProps extends Omit<ModalProps, 'onClose'> {\n  /**\n   * Headline message\n   * @since 10.19.0\n   */\n  headline?: string\n\n  /**\n   * The dismiss onClick callback\n   * @since 10.19.0\n   */\n  onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void\n}\n\n/**\n * NOTE: Using howToClose 'x' requires the `Modal.Header` component.\n * @a11y This component is a not semantic heading! For that, see `Modal.Heading`.\n */\nexport interface ModalCloseableHeaderProps extends Props {\n  /**\n   * @since 10.19.0\n   */\n  onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void\n  /**\n   * @since 10.19.0\n   */\n  qa?: { closeButton?: string }\n}\n\nexport interface ModalBodyProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * @deprecated @experimental Changes the UI of modal to work on mobile breakpoints, to be used on Helix Header ONLY\n   * @defaultValue false\n   * @since 12.8.0\n   */\n  compact?: boolean\n  /**\n   * Removes left, right paddings from the modal body when true\n   * @defaultValue false\n   * @since 10.19.0\n   */\n  noSideSpacing?: boolean\n}\n"],"mappings":""}
+{"version":3,"file":"Modal.types.js","names":[],"sources":["../../src/Modal/Modal.types.ts"],"sourcesContent":["import type React from 'react'\nimport type { Props } from '../_utils/types'\n\nexport type ModalPlacement = 'top' | 'center'\nexport type ModalWidth = 'sm' | 'md' | 'lg' | 'xl'\n\n/**\n * Additional UI/UX to dismiss. (In addition to the Esc key)\n *  - `x` Close Button in the Modal Header\n *  - `scrim` Overlay dimmed scrim\n *  - `footer-button` Cancel Button in the Modal Footer Actions\n */\nexport type ModalOptionalCloseStartegy = 'x' | 'footer-button' | 'scrim'\ntype ModalCloseStragety = 'esc' | ModalOptionalCloseStartegy\n\nexport type ModalOnClose = (\n  event: // clicked scrim\n  | React.MouseEvent<HTMLDivElement>\n    // clicked x button\n    | React.MouseEvent<HTMLButtonElement>\n    // pressed escape key\n    | React.KeyboardEvent<HTMLElement>,\n  how: ModalCloseStragety\n) => void\n\nexport interface ModalCloseContextApi {\n  /**\n   * Escape key will always close a dialog. This adds additional UI or UX to close.\n   */\n  howToClose: ModalOptionalCloseStartegy[] | undefined\n  onClose: ModalOnClose | undefined\n}\n\nexport interface ModalCloseableHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * @deprecated @experimental Changes the UI of modal to work on mobile breakpoints, to be used on Helix Header ONLY\n   * @defaultValue false\n   * @since 12.8.0\n   */\n  compact?: boolean\n  qa?: { closeButton?: string }\n}\n\nexport interface ModalProps extends Props {\n  'aria-describedby'?: string\n  'aria-details'?: string\n  /**\n   * @a11y Automatially created when using `Modal.Heading`. The `role='dialog'` MUST be labelled. Prefer `aria-labelledby` over `aria-label`.\n   * @since 11.12.0\n   */\n  'aria-labelledby'?: string\n  /**\n   * @a11y `role='dialog'` MUST be labelled. Prefer `aria-labelledby` over `aria-label`.\n   * If using an `aria-label` instead of a node, be sure give the modal an `id` so\n   * other regions can reference it.\n   * @since 11.12.0\n   */\n  'aria-label'?: string\n  /**\n   * @a11y Should be used for a single true modal. Cannot open nested modals.\n   * @experimental Core-React does not support multiple or nested `aria-modal`s for Tearsheets, Modals, or ConfirmModals.\n   * @since 12.42.0\n   */\n  'aria-modal'?: boolean\n  /**\n   * @deprecated @experimental Changes the UI of modal to work on mobile breakpoints, to be used on Helix Header ONLY\n   * @defaultValue false\n   * @since 12.8.0\n   */\n  compact?: boolean\n  /**\n   * This adds additional UI or UX to close. Escape key will always close a dialog, see `onClose`.\n   *\n   * NOTE 'footer-button': Footer Cancel button still requires at least a rendered self closing `Modal.FooterButtons`.\n   *\n   * NOTE 'x': The X button still requires a rendered `Modal.Header` component.\n   * @defaultValue []\n   * @since 11.12.0\n   */\n  howToClose?: ModalOptionalCloseStartegy[]\n  /**\n   * Aligns with `role` and `ref` location.\n   */\n  id?: string\n  /**\n   * @deprecated Use `howToClose={['scrim']}` with `onClose` instead.\n   * @deprecatedSince 12.41.0\n   * @since 10.19.0\n   */\n  onClickOverlay?: (event: React.MouseEvent<HTMLDivElement>) => void\n  /**\n   * When a user closes the Modal by some approved `howToClose` method or the Escape key. This also opts-in to dialog focus management.\n   * @a11y Future default! Moves focus into and cycles focus in the Modal, and returning focus\n   * to the trigger when closed. Also enables the Escape key to close the Modal.\n   * @since 11.6.0\n   */\n  onClose?: ModalOnClose\n  /**\n   * Modal open state\n   * @defaultValue false\n   * @since 10.19.0\n   */\n  open?: boolean\n  /**\n   * Enable dialog props. REQUIRES `onClose` to enable Escape key and focus management. MUST be labelled, prefer `aria-labelledby` over `aria-label`.\n   */\n  role?: 'dialog' | 'alertdialog'\n  /**\n   * Vertical placement of the modal.\n   * Positioning modal at the top ensures that variable height modal won't shift position during content loading,\n   * providing a more stable user experience.\n   * @defaultValue center\n   * @since 10.19.0\n   */\n  placement?: ModalPlacement\n  /**\n   * Sets a width on the container and uses next centering.\n   * Future will default to `md`\n   * @since 10.19.0\n   */\n  width?: ModalWidth\n}\n\nexport interface ModalContainerProps extends Props {\n  /**\n   * @deprecated @experimental Changes the UI of modal to work on mobile breakpoints, to be used on Helix Header ONLY\n   * @defaultValue false\n   * @since 12.8.0\n   */\n  compact?: boolean\n  /**\n   * @since 10.19.0\n   */\n  placement: ModalPlacement\n  /**\n   * @since 10.19.0\n   */\n  width?: ModalWidth\n}\n\nexport interface ConfirmModalProps extends Omit<ModalProps, 'onClose'> {\n  /**\n   * Headline message\n   * @since 10.19.0\n   */\n  headline?: string\n\n  /**\n   * Callback when the ConfirmModal is dismissed.\n   *\n   * @a11y **Accessible pattern (recommended):** Use with `role=\"dialog\"` and `howToClose={['x']}`.\n   * This enables focus management, Escape key support, and proper dialog semantics.\n   * The callback signature is `(event, how) => void`.\n   *\n   * **Legacy pattern:** `(event: MouseEvent<HTMLButtonElement>) => void` — only handles X button click,\n   * no focus management or Escape key support.\n   *\n   * @since 10.19.0\n   */\n  onClose?:\n    | ModalOnClose\n    | ((event: React.MouseEvent<HTMLButtonElement>) => void)\n  /**\n   *\n   * @a11y Recommended to use. When using alertdialog should be a `aria-modal` because of their urgent nature. **Cannot open nested modals.**\n   * @since 12.42.0\n   */\n  'aria-modal'?: boolean\n}\n\n/**\n * NOTE: Using howToClose 'x' requires the `Modal.Header` component.\n * @a11y This component is a not semantic heading! For that, see `Modal.Heading`.\n */\nexport interface ModalCloseableHeaderProps extends Props {\n  /**\n   * @deprecated Use `Modal onClose` with `howToClose={['x']}` instead.\n   * @deprecatedSince 12.41.0\n   * @since 10.19.0\n   */\n  onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void\n  /**\n   * @since 10.19.0\n   */\n  qa?: { closeButton?: string }\n}\n\nexport interface ModalBodyProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * @deprecated @experimental Changes the UI of modal to work on mobile breakpoints, to be used on Helix Header ONLY\n   * @defaultValue false\n   * @since 12.8.0\n   */\n  compact?: boolean\n  /**\n   * Removes left, right paddings from the modal body when true\n   * @defaultValue false\n   * @since 10.19.0\n   */\n  noSideSpacing?: boolean\n}\n"],"mappings":""}

package/dist/Modal/index.d.ts

@@ -1,2 +1,2 @@
 export { ConfirmModal, Modal } from './Modal';
-export type { ConfirmModalProps, ModalProps } from './Modal.types';
+export type { ConfirmModalProps, ModalOnClose, ModalProps } from './Modal.types';

package/dist/Modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ConfirmModal","Modal"],"sources":["../../src/Modal/index.ts"],"sourcesContent":["export { ConfirmModal, Modal } from './Modal'\nexport type { ConfirmModalProps, ModalProps } from './Modal.types'\n"],"mappings":"AAAA,SAASA,YAAY,EAAEC,KAAK,QAAQ,SAAS"}
+{"version":3,"file":"index.js","names":["ConfirmModal","Modal"],"sources":["../../src/Modal/index.ts"],"sourcesContent":["export { ConfirmModal, Modal } from './Modal'\nexport type { ConfirmModalProps, ModalOnClose, ModalProps } from './Modal.types'\n"],"mappings":"AAAA,SAASA,YAAY,EAAEC,KAAK,QAAQ,SAAS"}

package/dist/MultiSelect/MultiSelect.js

@@ -1,6 +1,7 @@
 var _excluded = ["getId", "getLabel", "qa", "value"],
   _excluded2 = ["value"],
-  _excluded3 = ["afterHide", "afterShow", "beforeHide", "beforeShow", "block", "disabled", "emptyMessage", "error", "footer", "getId", "getLabel", "getGroup", "loading", "onChange", "onScrollBottom", "onSearch", "options", "isOptionDisabled", "optionRenderer", "optgroups", "groupHeaderRenderer", "groupRenderer", "tokenRenderer", "placeholder", "placement", "value", "tabIndex", "aria-labelledby", "aria-describedby", "qa"];
+  _excluded3 = ["afterHide", "afterShow", "beforeHide", "beforeShow", "block", "disabled", "emptyMessage", "error", "footer", "getId", "getLabel", "getGroup", "loading", "onChange", "onScrollBottom", "onSearch", "options", "isOptionDisabled", "optionRenderer", "optgroups", "groupHeaderRenderer", "groupRenderer", "tokenRenderer", "placeholder", "placement", "value", "tabIndex", "aria-labelledby", "aria-describedby", "qa"],
+  _excluded4 = ["aria-controls"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -393,7 +394,6 @@ var MultiSelect_ = /*#__PURE__*/React.forwardRef(function MultiSelect(_ref7, ref
   var targetRef = ref || ownRef;
   var searchRef = React.useRef(null);
   var menuRef = React.useRef(null);
-  var menuId = useId();
   var tokenListId = useId();
   var tokenBaseId = useId();
   var noneSelectedId = useId();
@@ -404,6 +404,8 @@ var MultiSelect_ = /*#__PURE__*/React.forwardRef(function MultiSelect(_ref7, ref
   var _useMenuImperativeCon = useMenuImperativeControlNavigation(menuRef, isMenuOpen),
     menuNavigationTriggerProps = _useMenuImperativeCon.menuNavigationTriggerProps,
     menuProps = _useMenuImperativeCon.menuProps;
+  var menuAriaControls = menuNavigationTriggerProps['aria-controls'],
+    restMenuNavigationTriggerProps = _objectWithoutProperties(menuNavigationTriggerProps, _excluded4);
   var I18n = useI18nContext();
   var multiselect = useMultiSelect({
     getId: getId,
@@ -426,7 +428,6 @@ var MultiSelect_ = /*#__PURE__*/React.forwardRef(function MultiSelect(_ref7, ref
     shadowStrength: 2
   }, /*#__PURE__*/React.createElement(MenuImperative, _extends({}, menuProps, {
     ref: menuRef,
-    id: menuId,
     onScrollBottom: onScrollBottom,
     onSelect: multiselect.onSelect,
     "data-qa": "multi-select-menu",
@@ -485,6 +486,7 @@ var MultiSelect_ = /*#__PURE__*/React.forwardRef(function MultiSelect(_ref7, ref
     var disable = _ref8.disable,
       enable = _ref8.enable,
       isVisible = _ref8.isVisible;
+    var ariaControls = isNavigatingTokens ? tokenListId : menuAriaControls;
     return /*#__PURE__*/React.createElement(StyledMultiSelectButton, _extends({
       $block: block,
       $error: error,
@@ -520,7 +522,7 @@ var MultiSelect_ = /*#__PURE__*/React.forwardRef(function MultiSelect(_ref7, ref
       }));
     })), /*#__PURE__*/React.createElement(StyledMultiSelectSearch, null, /*#__PURE__*/React.createElement(StyledMultiSelectSearchInput, _extends({
       "aria-activedescendant": activeTokenId,
-      "aria-controls": isNavigatingTokens ? tokenListId : menuId,
+      "aria-controls": ariaControls,
       "aria-describedby": [ariaDescribedBy, value.length === 0 ? noneSelectedId : undefined].filter(Boolean).join(' ') || undefined,
       "aria-expanded": isVisible,
       "aria-invalid": error || undefined,
@@ -533,7 +535,7 @@ var MultiSelect_ = /*#__PURE__*/React.forwardRef(function MultiSelect(_ref7, ref
       onChange: function onChange(e) {
         multiselect.onSearch(e);
       }
-    }, menuNavigationTriggerProps, {
+    }, restMenuNavigationTriggerProps, {
       onKeyDown: function onKeyDown(e) {
         if (isNavigatingTokens && e.key !== 'Tab') {
           // if we are navigating tokens don't do any input but allow Tab