# @n3/react-grid

> Grid components for react applications based on @n3/kit

Latest version **0.2.0** (published 2021-01-26) · MIT license · 0 weekly downloads

## Install

```sh
npm install @n3/react-grid
pnpm add @n3/react-grid
yarn add @n3/react-grid
bun add @n3/react-grid
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.0 |
| Published | 2021-01-26 |
| First published | 2020-06-11 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 3 |
| Unpacked size | 18.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Vadim Taits |
| Maintainers | v.voloshin, n3admin, vtaits, k.kulik, a_sannikov |

## Links

- npm: https://www.npmjs.com/package/@n3/react-grid
- Repository: git@gitlab.develop.netrika.ru:web/n3components
- npm.io page: https://npm.io/package/@n3/react-grid

## Dependencies (3)

- [@n3/css-base](https://npm.io/package/@n3/css-base.md) ^0.1.2
- [@babel/runtime](https://npm.io/package/@babel/runtime.md) ^7.12.5
- [styled-components](https://npm.io/package/styled-components.md) ^5.2.1

## Recent versions

- 0.2.0 (latest) — 2021-01-26
- 0.1.1 — 2020-06-11
- 0.1.0 — 2020-06-11

## README

# @n3/react-grid

Сетка для приложений на базе `@n3/kit`.

```javascript
import {
  Grid,
  Row,
  Cell,
} from '@n3/react-grid';
```

## Props

### Grid

| Название | Обязательность | Тип | Значение по умолчанию | Описание |
|----------|----------------|-----|-----------------------|----------|
| centered |  | boolean | `false` | Добавить ли margin слева и справа |
| isFixedWidth |  | boolean | `false` | Не давать контенту сужаться |

### Row

| Название | Обязательность | Тип | Значение по умолчанию | Описание |
|----------|----------------|-----|-----------------------|----------|
| isWrap |  | boolean | `false` | Рендер внутренних блоков c переносами |

### Cell

| Название | Обязательность | Тип | Значение по умолчанию | Описание |
|----------|----------------|-----|-----------------------|----------|
| xs |  | 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 11 \| 12 | `null` | Количество колонок в разрешениях до 576px |
| sm |  | 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 11 \| 12 | `null` | Количество колонок в разрешениях до 768px |
| md |  | 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 11 \| 12 | `null` | Количество колонок в разрешениях до 992px |
| lg |  | 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 11 \| 12 | `null` | Количество колонок в разрешениях до 1200px |
| xl |  | 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 11 \| 12 | `null` | Количество колонок в разрешениях от 1200px включительно |

---
_Source: https://npm.io/package/@n3/react-grid · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._