Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[FocusTrap] is planned? #1374

Open
dartess opened this issue Jan 31, 2025 · 2 comments
Open

[FocusTrap] is planned? #1374

dartess opened this issue Jan 31, 2025 · 2 comments
Labels
component: FocusTrap The React component. status: waiting for maintainer These issues haven't been looked at yet by a maintainer

Comments

@dartess
Copy link

dartess commented Jan 31, 2025

Feature request

Summary

FocusTrap

Examples in other libraries

@mui/base: https://mui.com/base-ui/react-focus-trap/
focus-trap: https://www.npmjs.com/package/focus-trap

Motivation

I'm currently using this component from deprecated @mui/base. Please tell, is it planned to move this component from @mui/base in the first version of @base-ui-components/react, or it definitely won't be there and I should migrate to a third-party package?

@github-actions github-actions bot added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Jan 31, 2025
@colmtuite
Copy link
Contributor

All of our components manage focus automatically, and also provide props to customise focus management in some cases. I'm curious why you'd like to use a focus trap utility directly. Can you share more about your use case?

@zannager zannager added the component: FocusTrap The React component. label Feb 3, 2025
@dartess
Copy link
Author

dartess commented Feb 4, 2025

Can you share more about your use case?

FocusTrap is used in a custom dropdown component with something like form.

All of our components manage focus automatically, and also provide props to customise focus management in some cases.

I tried to make a demo with popover: https://codesandbox.io/p/sandbox/58wl54?file=%2Fsrc%2FApp.tsx

The popover has two inputs. The focus after the second one goes out, closing the popover. This is acceptable behavior in my case, but ideally I would like to have a looping focus inside the popover content for as long as the popover is open. I haven't found a way to set up this yet.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: FocusTrap The React component. status: waiting for maintainer These issues haven't been looked at yet by a maintainer
Projects
None yet
Development

No branches or pull requests

3 participants