GridLayoutItem

const App = () => {
  return (
    <GridLayout
      rows={[{height: 50}, {height: 50}, {height: 50}]}
      cols={[{width: 50}, {width: 50}, {width: 50}]}
      gap={{rows: 5, cols: 5}}
      align={{horizontal: 'stretch', vertical: 'stretch'}}
    >
      <GridLayoutItem row={1} col={1}>Box</GridLayoutItem>
      <GridLayoutItem row={1} col={2} colSpan={2}>Box</GridLayoutItem>
      <GridLayoutItem row={2} col={1} colSpan={2} rowSpan={2}>Box</GridLayoutItem>
      <GridLayoutItem row={2} col={3}>Box</GridLayoutItem>
      <GridLayoutItem row={3} col={3}>Box</GridLayoutItem>
    </GridLayout>
  );
};