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 ability to render DNodes to the document body #447

Closed
tomdye opened this issue Jul 16, 2019 · 0 comments · Fixed by #448

Comments

@tomdye
Copy link
Member

commented Jul 16, 2019

Enhancement

It would be useful to have the ability to render DNodes to the document.body similar to how react portals work.
This would enable us to fix issues where we need to render select / combobox / drop down menus outside of the parent domnode, thus allowing it to render outside of the constraints of any parent node css rules.
We have an open issue on the widgets repo related to select drop down not showing properly when displayed within a parent with overflow: hidden specified, I believe this functionality will fix this.

Proposed implementation

If we implemented this like we did the global event listener then it should be flexible enough for our usage. ie.

import { Body } from '@dojo/framework/vdom';

@watch()
_showMessage = false;

render() {	
	return (
		<div>
			<Body>
				{ this._showMessage && <div>I render in the body</div> }
			</Body>
			<button onclick={() => { this._showMessage = true; }}>Click me</button>
		</div>
	);
}

Related issue
dojo/widgets#674

@agubler agubler referenced this issue Jul 16, 2019
3 of 3 tasks complete

@agubler agubler closed this in #448 Jul 16, 2019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
1 participant
You can’t perform that action at this time.