# @illa-design/grid

> Illa Design Grid.

Latest version **1.3.0** (published 2023-12-25) · Apache-2.0 license · 0 weekly downloads

## Install

```sh
npm install @illa-design/grid
pnpm add @illa-design/grid
yarn add @illa-design/grid
bun add @illa-design/grid
```

## Health

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

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.3.0 |
| Published | 2023-12-25 |
| First published | 2022-04-21 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 521.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 354 |
| Author | ILLA Cloud |
| Maintainers | aruseito, owen_chen |
| Keywords | grid, react, component |

## Links

- npm: https://www.npmjs.com/package/@illa-design/grid
- Repository: https://github.com/illacloud/illa-design
- Issues: https://github.com/illacloud/illa-design/issues
- npm.io page: https://npm.io/package/@illa-design/grid

## Dependencies (2)

- [@illa-design/theme](https://npm.io/package/@illa-design/theme.md) 1.3.0
- [@illa-design/system](https://npm.io/package/@illa-design/system.md) 1.3.0

## Alternatives

- [@lexical/table](https://npm.io/package/@lexical/table.md) — 3.0M weekly downloads
- [mantine-datatable](https://npm.io/package/mantine-datatable.md) — 98.2K weekly downloads
- [react-native-collapsible-tab-view](https://npm.io/package/react-native-collapsible-tab-view.md) — 70.6K weekly downloads
- [@handsontable/vue3](https://npm.io/package/@handsontable/vue3.md) — 16.1K weekly downloads
- [vuewordcloud](https://npm.io/package/vuewordcloud.md) — 7.2K weekly downloads

## Recent versions

- 1.3.0 (latest) — 2023-12-25
- 1.2.0 — 2023-12-25
- 1.1.0 — 2023-09-14
- 1.0.30 — 2023-08-18
- 1.0.29 — 2023-07-20
- 1.0.28 — 2023-07-20
- 1.0.27 — 2023-06-30
- 1.0.26 — 2023-05-30
- 1.0.25 — 2023-05-29
- 1.0.24 — 2023-05-17
- 1.0.23 — 2023-05-15
- 1.0.22 — 2023-05-05
- 1.0.21 — 2023-05-05
- 1.0.20 — 2023-04-18
- 1.0.19 — 2023-04-18
- … 36 more at https://npm.io/package/@illa-design/grid/versions

## README

<div align="center">
    <img alt="ILLA Design Logo" width="120px" height="120px" src="./.github/assets/images/logo.svg"/>
</div>

<h1 align="center">ILLA Design</h1>

<p align="center">Accelerate your internal tools development.</p>

<div align="center">
  <p>Create with ❤︎ by <a href="https://github.com/illacloud/illa-design/graphs/contributors">contributors</a></p>
</div>

![cover](./.github/assets/images/design-cover.png)

[![Chat on Discord](https://img.shields.io/badge/chat-Discord-7289DA?logo=discord)](https://discord.gg/illacloud)
[![storybook](./.github/assets/images/storybook.svg)](https://design.illafamily.com)
[![codecov](https://codecov.io/gh/illacloud/illa-design/branch/main/graph/badge.svg?token=GR2SOLBWQN)](https://codecov.io/gh/illacloud/illa-design)
[![license](https://img.shields.io/github/license/illacloud/illa-design)](./LICENSE)
[![contributing](https://badgen.net/badge/PRs/Welcome/green?icon=storybook)](./CONTRIBUTING.md)

## ✨ Features

1. 🛠 **Made for React:** Ready-to-use component library for React.
2. 📝 **TypeScript Friendly:** Come with TypeScript typings out of the box and support with predictable static typings.
3. 📦 **High Productivity:** Easy and fast, import in 5 seconds.
4. 🎨 **Vibrant Design:** Beautifully designed components and powerful theming system supports custom themes to match
   your brand, including light and dark mode.
5. 🌍 **Internationalization:** Each component was designed with i18n in mind and multiple languages are supported.
6. 📱 **Fully Responsive:** Perfectly adaptable with all the devices, desktops to mobiles.

## 💡 Components

You can review all components in Storybook.

[![storybook](./.github/assets/images/storybook.svg)](https://design.illafamily.com)

## 🖥 Fast Try

You can quickly use ILLA Design on codesandbox.

[![Edit illa-design-demo](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/illa-design-demo-r1qyy2?fontsize=14&hidenavigation=1&theme=dark)

## 🚀 Get Started

Step 1: Install

```bash
$ pnpm add @illa-design/react @emotion/react framer-motion

# or

$ npm i @illa-design/react @emotion/react framer-motion
```

Step 2: Use

```tsx
import { Tag } from '@illa-design/react';

const App = () => (
  <div>
    <Tag>Hello ILLA</Tag>
  </div>
);
```

## ⌨️ Development

Step 1: Clone locally.

```bash
$ git clone https://github.com/illacloud/illa-design.git
$ cd illa-design
$ pnpm install
```

Step 2: Run.

```bash
$ pnpm storybook
```

Then your can open storybook in your browser.

## 💬 Community

Join ILLA Community to share your ideas, suggestions or questions and connect with other users and contributors.

<b>Discussion</b>

[![Discuss on GitHub](https://img.shields.io/badge/discussions-GitHub-333333?logo=github)](https://github.com/orgs/illacloud/discussions)

<b>Hangout together!</b>

[![Chat on Discord](https://img.shields.io/badge/chat-Discord-7289DA?logo=discord)](https://discord.gg/illacloud)

## 🌱 Contributing

Thinking about contributing? All kinds of contributions to ILLA are greatly appreciated and welcomed! Check
out [Contributing Guide](./CONTRIBUTING.md) for details about how you can get involved.

## 🔥 We're Hiring

Looking for a passionate and creative team? We are actively hiring engineers for the following positions:

- Frontend Engineer
- Golang Engineer

Contact Us: hr@illasoft.com

## License

This project is [Apache License 2.0](./LICENSE).

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