UPDATE 3 (Dec 7th 2014): As a christmas bonus - I also made the same kind of port for Metafizzy Packery available as react-packery-mixin. Metafizzy licensing applies.

UPDATE 2 (Dec 7th 2014): The mixin now also supports transitions! It works a lot better after creating a diffing "algorithm" that enables the mixin to leverage the .appended() method.

UPDATE: I made an npm-ready module of the mixin called react-masonry-mixin, which is bundled with custom versions of masonry, outlayer and imagesloaded (all by @desandro at Twitter - kudos!).

I've been fiddling around with React and Masonry this weekend, and made a mixin than seems to work ok for now.

You can see it in use live here, at my open source project called Hearsay :-)

There is no official fully working npm module available from what I can see atm, so for now you will need to include Masonry as a script tag dependency:

<script src='//cdnjs.cloudflare.com/ajax/libs/masonry/3.1.5/masonry.pkgd.min.js' />

An example of the mixin in use - with the mixin itself following:

For some reason (might be application specific) I had to force the browser resize event when the component is unmounted and remounted.

The main drawback with this solution would be that you aren't leveraging the appended and prepended methods of Masonry, which improves performance quite a bit. So the next step would be to relieve React of its rendering duties in this case and write a custom renderer for the component.

If anyone has a better solution, please let me know by commenting! :-)