robinweser/react-layout-components

Getting warning when nesting <Box> inside <Container>

nelson-rivera opened this issue · 5 comments

Hi,
More a question than an issue, every time I place a <Box> inside a <Container> component I get this warning on console:
Layout Components: Deprecated: Using one of the following props is deprecated for <Box>. Use the <Container> Component instead. padding, paddingLeft, paddingRight, paddingTop, paddingBottom, margin, marginLeft, marginRight, marginTop, marginBottom, border, borderWidth, borderColor, borderStyle, borderLeft, borderRight, borderTop, borderBottom, top, left, bottom, right, overflow, overflowX, overflowY, fixed, absolute

I'm definitely not using any of the <Container> props on a <Box> component as the message suggest. So I blame it to the fact of nesting Box inside Container. Is this something I'm not supposed to do maybe?
Great component BTW.

Oh, actually I've been a bit lazy with this. Right now Container renders into a Box and also passes all its props down without filtering Container-based props. I will remove this with the next release, thanks for mentioning :) But everything should still work fine right? @nelson-rivera

Yep, it works as it should. It's just the truckload of warnings I thought I was using the components in the wrong way. Thanks for the clarification.

Seeing this as well - would appreciate a fix.

Other than that, liking the way this lib works so far. A nice bit of wrapping around flexbox styling. Thanks!

I will update the lib this week including a new Component: TabView as well as a basic Border Layout Component. Thanks for your kind words :)

Warnings have been removed with 2.1.2