Skip to content

DialogContainer drops disableFocusManagement - not forwarded to underlying Modal #10280

Description

@richie

Provide a general summary of the feature here

DialogContainer accepts and forwards isDismissable and isKeyboardDismissDisabled to the Modal overlay it renders, but it does not destructure or forward disableFocusManagement. As a result, a consumer that needs to opt out of the modal's internal FocusScope has no supported way to do so through DialogContainer — the prop is silently dropped, the FocusScope activates, and it steals focus on open.

disableFocusManagement is already supported on Modal/the underlying overlay; the only missing link is DialogContainer not passing it through. It is also absent from the SpectrumDialogContainerProps type, so there's no type-safe way to pass it even if it were forwarded.

🤔 Expected Behavior?

DialogContainer forwards disableFocusManagement to its Modal, mirroring how it already forwards isDismissable and isKeyboardDismissDisabled, and the prop is declared as an optional boolean on SpectrumDialogContainerProps.

😯 Current Behavior

The prop is neither typed nor forwarded. Passing disableFocusManagement to DialogContainer is a no-op: the value never reaches Modal, the FocusScope always runs, and focus is moved into the dialog on mount regardless.

💁 Possible Solution

Two small changes (this is exactly what we currently apply as a patch-package patch):

In @react-spectrum/dialog DialogContainer, destructure and forward the prop:

let {
  children,
  type = 'modal',
  onDismiss,
  isDismissable,
  isKeyboardDismissDisabled,
  disableFocusManagement        // add
} = props;

// ...
<Modal
  state={state}
  type={type}
  isDismissable={isDismissable}
  isKeyboardDismissDisabled={isKeyboardDismissDisabled}
  disableFocusManagement={disableFocusManagement}>   // add

In @react-types/dialog, add it to SpectrumDialogContainerProps:

export interface SpectrumDialogContainerProps {
  // ...
  isKeyboardDismissDisabled?: boolean,
  /** Whether to disable focus management for the dialog (e.g. when an embedding host
      manages focus itself). */
  disableFocusManagement?: boolean
}

🔦 Context

We embed a host SDK that renders its own dialogs via DialogContainer and manages focus itself; it passes disableFocusManagement={true} so the dialog does not trap/steal focus on open. Because DialogContainer drops the prop, keyboard navigation (Tab / Enter / Space / Arrow keys) is broken for actions inside the dialog — a WCAG 2.1 AA keyboard-accessibility regression. We are working around it with a patch-package patch today and would like a native fix so we can remove the patch.

💻 Examples

Minimal repro:

<DialogContainer disableFocusManagement onDismiss={() => {}}>
  <Dialog aria-label="Example">content</Dialog>
</DialogContainer>
// FocusScope still activates and moves focus into the dialog; disableFocusManagement is ignored.

🧢 Your Company/Team

Adobe/PandoraUI

🕷 Tracking Issue

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions