eui
eui copied to clipboard
[EuiForm] pass `fullWidth` from root EuiForm via context to children
When writing an <EuiForm> which is supposed to expand to the full width of the container you need to add fullWidth to every form group, row, and input in the form. It would be awesome if we could specify fullWidth on the EuiForm element and have that change the default value of fullWidth within each child component by passing true down via context.
If folks wouldn't mind this being implemented I'd be happy to try putting up a PR.
We always love getting PRs! What approach are you thinking in terms of implementation? Are you thinking of either a ReactContext set by EuiForm, or using React.cloneElement on each child/grandchild to try to set props?
FWIW I'd lean slightly towards context over cloneElement, and if using a context, I'd also want individual children to be able to set their own fullWidth prop that overrides the context.
Hope that helps!
Yeah, I was planning to go with context. I'll give it a shot and make sure that child elements only use the fullWidth from context if their fullWidth prop is undefined.