Adjusting the StackGrid component's width breaks the display #67
Description
First off, I'd like to say that this Component is awesome and I've really enjoyed using it in my project! Thanks so much for the fantastic work!
I did run into an issue, however. I have the stack grid set up as follows:
<StackGrid {...this.getStackGridProps()} style={{width: this.props.width}}> {this.renderGridItems()} </StackGrid>
Some logic outside of the component toggles that width style prop between 50%
and 100%
. When going from 100%
to 50%
, the grid always arranges in interlocking perfection. However, when going from 50%
to 100%
, there are uneven spaces between the grid items. Here's a picture with some scribbled arrows pointing to the spaces that shouldn't be there.
I've experimented with calling updateLayout()
on a ref attached to the StackGrid component, as well as using different values for the width (e.g. vw
instead of %
), but that hasn't seemed to make a difference.
If you have any thoughts or can look more into this, please let me know!
I also had another error where certain rerenders caused the items to scramble around on the screen with similar uneven gaps to the ones pictured. I can follow up with another issue there if the maintainers so desire. Thanks!