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

Add support for Portals #330

Closed
robframpton opened this issue Jan 4, 2018 · 3 comments
Closed

Add support for Portals #330

robframpton opened this issue Jan 4, 2018 · 3 comments
Assignees

Comments

@robframpton
Copy link

See https://reactjs.org/docs/portals.html.

Portals allow components to render sub components to a different part of the DOM than where they are declared. This is to solve z-index and overflow hidden issues with components such as dropdowns, modals, and tooltips.

@robframpton robframpton self-assigned this Jan 4, 2018
robframpton pushed a commit to robframpton/metal.js that referenced this issue Jan 5, 2018
robframpton pushed a commit to robframpton/metal.js that referenced this issue Jan 5, 2018
@eduardolundgren
Copy link
Contributor

If I understood correctly "portal" ability means to take the element specified to be the component element then render the children nodes inside it.

The third option of Metal component render(Ctor, configOrElement, element) specifies a different parent to render the component element.

The "portal" is different because of it uses the specified node as the component element instead of the parent of the component element.

Did I get it right?
If yes, the implementation prob. can be simplified.

@robframpton
Copy link
Author

It's specifically for child components, rather than the root level component where you would be passing a parent element to render to. The parent element can't be used for a child component because it is not the element that is passed to Incremental DOM's patch function, it is only used when attaching the component to the DOM.

I put together a demo built from my branch to show how it might be used.

@eduardolundgren
Copy link
Contributor

Got it. LGTM.

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

No branches or pull requests

2 participants