masonic icon indicating copy to clipboard operation
masonic copied to clipboard

When switching a class on a parent element no resize happens.

Open The-Code-Monkey opened this issue 2 years ago • 5 comments

Describe the bug When you switch a class on a parent element using one that changes size.

To Reproduce Steps to reproduce the behavior:

Make it so that a class gets added that changes the size of a parent element.

Expected behavior A resize should happen as the parent div is no longer the correct size.

The-Code-Monkey avatar Jun 06 '22 15:06 The-Code-Monkey

I had the same problem, how did you finally solve it?

bici-fed avatar Jul 13 '22 07:07 bici-fed

If you use usePositioner directly you can provide the className prop as a dependency and then all elements will be reorganized when it changes.

As for <Masonry>, there is no way to force that besides using a key prop and causing a full remount. I guess we can expose something like positionerDeps or imperative reference with the .reorganize() function. 🤔

V3RON avatar Sep 28 '22 16:09 V3RON

Would be ok with an imperative reference. Maybe a name like .reflow() or .recalcuate()

jaredLunde avatar Oct 01 '22 17:10 jaredLunde

@jaredLunde Actually, why don't we use ResizeObserver? It got decent support unless we care about Internet Explorer and Opera Mini.

https://caniuse.com/?search=resizeobserver

V3RON avatar Oct 03 '22 18:10 V3RON

Honestly I can't remember why. I have a comment about ResizeObserver in the code for this. Using it elsewhere in the library already.

jaredLunde avatar Oct 05 '22 01:10 jaredLunde