# Quick Start

> Get a filterable data table running in your project with one install command

Source: https://data-table.openstatus.dev/docs/quick-start · Docs index: https://data-table.openstatus.dev/llms.txt · Full docs: https://data-table.openstatus.dev/llms-full.txt

## Zero Config

The fastest way to try data-table-filters — pass an array of objects, get a fully filtered table:

```tsx
import { DataTableAuto } from "@/components/data-table/data-table-auto";

const data = [
  {
    name: "Alice",
    role: "admin",
    rating: 5,
    created_at: "2026-01-15T10:00:00Z",
  },
  { name: "Bob", role: "user", rating: 3, created_at: "2026-02-20T14:30:00Z" },
];

<DataTableAuto data={data} />;
```

Columns, filters, display types, and cell renderers are auto-inferred from your data. When you need customization, [eject to the Builder](/builder) or define a [Table Schema](/docs/table-schema).

See the [/auto](/auto) example for a live demo.

## Agent Skill

Install the plugin in Claude Code:

```bash
/plugin marketplace add openstatushq/data-table-filters
/plugin install data-table-filters@openstatus
```

Or install the skill with any agent that supports the `skills` CLI:

```bash
npx skills add https://github.com/openstatushq/data-table-filters --skill data-table-filters
```

Let the agent handle the rest:

> Add a data table with filters to my project

It detects your stack, installs the right blocks, and wires them up. For agents
without the skill, see [For AI Agents](/docs/agents) — `llms.txt`, raw markdown
docs, and Cursor rules.

## Install Components

Start by installing the core `data-table` block — it includes the table engine, memory store adapter, and all 4 filter types:

```bash
npx shadcn@latest add https://data-table.openstatus.dev/r/data-table.json
```

Then add any extension block from the [registry](#blocks) below.

## Blocks

The following blocks can be installed via shadcn CLI.

```bash
npx shadcn@latest add https://data-table.openstatus.dev/r/<block>
```

| Name                           | Block                                                                                                      | Components |
| ------------------------------ | ---------------------------------------------------------------------------------------------------------- | ---------: |
| `data-table`                   | [data-table.json](https://data-table.openstatus.dev/r/data-table.json)                                     |         53 |
| `data-table-filter-command`    | [data-table-filter-command.json](https://data-table.openstatus.dev/r/data-table-filter-command.json)       |          2 |
| `data-table-cell`              | [data-table-cell.json](https://data-table.openstatus.dev/r/data-table-cell.json)                           |         17 |
| `data-table-sheet`             | [data-table-sheet.json](https://data-table.openstatus.dev/r/data-table-sheet.json)                         |          5 |
| `data-table-nuqs`              | [data-table-nuqs.json](https://data-table.openstatus.dev/r/data-table-nuqs.json)                           |          4 |
| `data-table-zustand`           | [data-table-zustand.json](https://data-table.openstatus.dev/r/data-table-zustand.json)                     |          3 |
| `data-table-schema`            | [data-table-schema.json](https://data-table.openstatus.dev/r/data-table-schema.json)                       |         13 |
| `data-table-drizzle`           | [data-table-drizzle.json](https://data-table.openstatus.dev/r/data-table-drizzle.json)                     |          7 |
| `data-table-query`             | [data-table-query.json](https://data-table.openstatus.dev/r/data-table-query.json)                         |          3 |
| `data-table-filter-command-ai` | [data-table-filter-command-ai.json](https://data-table.openstatus.dev/r/data-table-filter-command-ai.json) |         11 |
| `data-table-mcp`               | [data-table-mcp.json](https://data-table.openstatus.dev/r/data-table-mcp.json)                             |          5 |

> Looking to add natural language filtering? The `data-table-filter-command-ai` block translates queries like _"5xx errors last 24h"_ into structured filters using any LLM. See [AI Filters](/docs/ai-filters) for setup.

## Next Steps

- Browse the [/infinite](/infinite) demo to see all components in action
- Learn about the [Table Schema](/docs/table-schema) builder for type-safe column definitions
- Explore the [UI Components](/docs/ui-components) available out of the box