[popups] initialFocus and finalFocus functions

[atomiks]

@vladmoroz this should solve your concerns with managing focus.

// Do not move focus at all
<Dialog.Popup initialFocus={null} />
<Dialog.Popup finalFocus={null} />

// Move focus to a custom element at focus time
<Dialog.Popup initialFocus={(openType) => myElement} />
<Dialog.Popup finalFocus={(closeType) => myElement} />

// Focus yourself, with custom options (void return)
<Dialog.Popup initialFocus={() => myElement.focus()} />

Breaking: if you specify a function, return the element directly instead of a ref

[pkg-pr-new]

vite-css-base-ui-example

pnpm add https://pkg.pr.new/mui/base-ui/@base-ui-components/react@2536

pnpm add https://pkg.pr.new/mui/base-ui/@base-ui-components/utils@2536

commit: cdc7894

[mui-bot]

Bundle size report

Bundle	Parsed size	Gzip size
@base-ui-components/react	🔺+1.29KB(+0.41%)	🔺+480B(+0.49%)

Details of bundle changes

Generated by 🚫 dangerJS against cdc7894

[netlify]

✅ Deploy Preview for base-ui ready!

Name	Link
🔨 Latest commit	f06c500
🔍 Latest deploy log	https://app.netlify.com/projects/base-ui/deploys/68a40ce3bb5d9000083215a5
😎 Deploy Preview	https://deploy-preview-2536--base-ui.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[netlify]

✅ Deploy Preview for base-ui ready!

Name	Link
🔨 Latest commit	cdc7894
🔍 Latest deploy log	https://app.netlify.com/projects/base-ui/deploys/68a5bf18c67e290008875ff8
😎 Deploy Preview	https://deploy-preview-2536--base-ui.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.