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

[Feature]: Exposing focus scope stack #1575

Closed
2 tasks
nicooprat opened this issue Jan 22, 2025 · 3 comments · Fixed by #1584
Closed
2 tasks

[Feature]: Exposing focus scope stack #1575

nicooprat opened this issue Jan 22, 2025 · 3 comments · Fixed by #1584

Comments

@nicooprat
Copy link
Contributor

Describe the feature

We're in the process of migrating to Radix, but we're already using this package to handle focus traps: https://github.com/focus-trap/focus-trap

We need to use stacks, for instance when trying to close a modal and displaying an alert to prevent losing modifications: the focus must be trapped in the alert, then in the dialog once dismissed.

Currently we can't migrate only one or another because the focus scope API in Radix is not exposed: https://github.com/unovue/radix-vue/blob/v2/packages/core/src/FocusScope/stack.ts

Could we imagine a solution so the two packages are compatible in order to ease a migration process?

Thanks

Additional information

  • I intend to submit a PR for this feature.
  • I have already implemented and/or tested this feature.
@zernonia
Copy link
Member

zernonia commented Jan 28, 2025

Hi @nicooprat ! Would exposing FocusScope component fit your need? 😁

@zernonia zernonia linked a pull request Jan 28, 2025 that will close this issue
@nicooprat
Copy link
Contributor Author

I'll try ASAP, thanks :) 🙏

@nicooprat
Copy link
Contributor Author

Trying quickly, I'm struggling to have the focus given back to the original focused element, and as the FocusScope trap doesn't share the same API as the one from https://github.com/focus-trap/focus-trap it won't be possible for them to share the same "stack". I will have to dig a bit more in the stack thing: https://github.com/unovue/radix-vue/blob/b2f0e1918702a53d980d43d470c66e59e731db75/packages/core/src/FocusScope/stack.ts

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants