# Install

```shell
npm i @mate-react/block-layout
```

# Import

```tsx
import { MateBlockLayout } from '@mate-react/block-layout';
```

# Variants

## Default (4-4-4)

```tsx
<MateBlockLayout theme="spacing">
  <div>Block 1</div>
  <div>Block 2</div>
  <div>Block 3</div>
</MateBlockLayout>
```

## Layout 8-4

```tsx
<MateBlockLayout theme="spacing layout-8-4">
  <div>Block 1</div>
  <div>Block 2</div>
</MateBlockLayout>
```

## Layout 4-8

```tsx
<MateBlockLayout theme="spacing layout-4-8">
  <div>Block 1</div>
  <div>Block 2</div>
</MateBlockLayout>
```

## Layout 6-6

```tsx
<MateBlockLayout theme="spacing layout-6-6">
  <div>Block 1</div>
  <div>Block 2</div>
</MateBlockLayout>
```

## Layout 12

```tsx
<MateBlockLayout theme="spacing layout-12">
  <div>Block 1</div>
</MateBlockLayout>