react-flexbox-grid VS react-grid-layout

I'm developing an application using React and wanted to style components, I found https://roylee0704.github.io/react-flexbox-grid/ which talks about a fluid grid system. The example looks like:

You can find additional information about the React-Grid-Layout in the repository and documentation.

This is react-grid-layout with some custom logic https://github.com/react-grid-layout/react-grid-layout

react-grid-layout looks like a good candidate, but it seems like it lacks a way to customize/add rules for positioning elements to prevent "stacks" of elements. Imagine a user models a brick wall and you want to prevent users from stacking bricks above each other (prevent bricks stack bond and allow something like running bond brick pattern)

I was looking to build a somewhat similar project with react and react grid layout.

Would it be possible to prototype something like this in figma? http://react-grid-layout.github.io/react-grid-layout/examples/0-showcase.html

react-grid-layout A draggable and resizable grid layout with responsive breakpoints, for React.

A lot of projects seem to like: https://github.com/react-grid-layout/react-grid-layout

I’ve done that before using react grid layout (https://github.com/react-grid-layout/react-grid-layout) to allow for moving and resizing components, and then a lot of custom code. Having a well thought architecture makes a lot of difference there.