[dialog] Slim dialog root and dedupe default initial focus#5034
Conversation
commit: |
Bundle size
PerformanceTotal duration: 1,255.72 ms -198.53 ms(-13.7%) | Renders: 50 (+0) | Paint: 1,898.34 ms -286.04 ms(-13.1%)
11 tests within noise — details Check out the code infra dashboard for more information about this PR. |
✅ Deploy Preview for base-ui ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
- Drop the redundant mergeProps(FOCUSABLE_POPUP_PROPS, dismiss.floating); both popup consumers (DialogPopup/DrawerPopup) already spread FOCUSABLE_POPUP_PROPS. - Extract the shared touch default-initial-focus resolver into createDefaultInitialFocus, used by Dialog and Popover popups. - Return void from useDialogRoot, pass parentContext/isDrawer to DialogInteractions directly, and drop the dead UseDialogRoot* interfaces and eventTarget alias. - Add a default touch initialFocus regression test.
bd2abb0 to
d0a14b3
Compare
There was a problem hiding this comment.
Pull request overview
This PR refactors shared popup/dialog internals to remove redundant prop merging, centralize the default touch initialFocus behavior, and simplify useDialogRoot’s API (no intended behavior change), while adding a regression test for touch-open focus behavior.
Changes:
- Introduces
createDefaultInitialFocusto dedupe the “touch opens: focus popup to avoid virtual keyboard” behavior across popups. - Simplifies dialog root wiring by making
useDialogRootreturnvoidand passingparentContext/isDrawerdirectly toDialogInteractions. - Removes redundant merging of
FOCUSABLE_POPUP_PROPSinto dialog popup props and adds a touch-focus test forDialog.Popup.
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| packages/react/src/utils/popups/popupStoreUtils.ts | Adds shared createDefaultInitialFocus helper for touch vs non-touch initial focus resolution. |
| packages/react/src/popover/popup/PopoverPopup.tsx | Replaces inline touch initial-focus logic with createDefaultInitialFocus. |
| packages/react/src/dialog/root/useRenderDialogRoot.tsx | Adjusts dialog root composition to call useDialogRoot for side effects and pass context flags into DialogInteractions. |
| packages/react/src/dialog/root/useDialogRoot.ts | Simplifies useDialogRoot API, updates DialogInteractions props, and removes redundant popup prop merging. |
| packages/react/src/dialog/popup/DialogPopup.tsx | Replaces inline touch initial-focus logic with createDefaultInitialFocus. |
| packages/react/src/dialog/popup/DialogPopup.test.tsx | Adds coverage asserting touch-open focuses the popup instead of inner input content. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Dialog-root simplifications (no behavior change):
mergeProps(FOCUSABLE_POPUP_PROPS, dismiss.floating)— both popup consumers (DialogPopup/DrawerPopup) already spreadFOCUSABLE_POPUP_PROPSdirectly.createDefaultInitialFocus, used by Dialog and Popover popups.useDialogRootreturnvoidand passparentContext/isDrawertoDialogInteractionsdirectly; drop the deadUseDialogRoot*interfaces and aneventTargetalias.Adds a default touch
initialFocustest.