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

as={Component} not exposed from react-focus-lock #42

Closed
AaronPowell96 opened this issue Jul 2, 2020 · 5 comments
Closed

as={Component} not exposed from react-focus-lock #42

AaronPowell96 opened this issue Jul 2, 2020 · 5 comments
Assignees

Comments

@AaronPowell96
Copy link

AaronPowell96 commented Jul 2, 2020

I am trying to use react-focus-on with the as= prop to render my own nav without it being nested inside a div. As seen here:
image
however, it doesnt seem to be exposed from react-focus-lock.

EDIT: Have done a little digging and it seems internally the as is being used as RemoveScroll, and RemoveScroll is using a div, maybe we could pass through the as prop to removeScroll and that renders the component if provided?

Ive tried to use and implement forwardProps and that removed the div but then the lock didnt work.

@theKashey
Copy link
Owner

That's theoretically possible, but is it actually needed? Could you please explain your use case?
For example, why Focus Lock you not be outside nav (as per screenshot), or inside nav - why it should be nav?

And not working forwardProps is definitely an issue.

@AaronPowell96
Copy link
Author

Hey, sorry for the late reply, the reason was for semantics, I didn't think a nav should be inside a div. With a screenreader it never picked up the navigation when it was inside a div, but when you have the header with a nav it did.

@theKashey
Copy link
Owner

I didn't think a nav should be inside a div

But could https://caninclude.glitch.me/can/include/?child=nav&parent=div

Anyway, I've got you

@theKashey theKashey self-assigned this Jul 14, 2020
@AaronPowell96
Copy link
Author

Thank you, will be interested to see the solution as I did spend a few hours looking around haha

@theKashey
Copy link
Owner

Shipped as a part of v3.5.0

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

No branches or pull requests

2 participants