# Records and tables

From the first filtered row to an edit made in place.

Lists you scan and records you work in: a table, its views and filters, and a record with its details.

- Canonical page: https://notchset.dev/kits/records
- Live pieces: 8 (5 free, 3 Pro)

## Follow the task

1. Filter the table and switch views.
2. Open a record beside the list without losing your place.
3. Edit a value in place and see it saved.

## States

Empty and no-match views, an edit made in place, a sort kept per view, a panel that keeps your place.

## Application boundary

The example uses fictional records in memory. Connect your own data source and keep the saving and error contracts.

## Install the kit

Set up your project and authorized Pro registry first:
https://notchset.dev/docs/installation

```sh
npx shadcn@latest add @notchset/data-table @notchset-pro/view-tabs @notchset/sortable-header @notchset-pro/record-header @notchset-pro/record-details @notchset/inline-edit @notchset/search-field @notchset/side-panel
```

## Start with free pieces

No Pro entitlement is required for these public Base UI URLs.

```sh
npx shadcn@latest add https://notchset.dev/r/data-table.json https://notchset.dev/r/sortable-header.json https://notchset.dev/r/inline-edit.json https://notchset.dev/r/search-field.json https://notchset.dev/r/side-panel.json
```

## Live pieces

- [Data table](https://notchset.dev/blocks/data-table) · Free
- [View tabs](https://notchset.dev/blocks/view-tabs) · Pro
- [Sortable header](https://notchset.dev/components/sortable-header) · Free
- [Record header](https://notchset.dev/blocks/record-header) · Pro
- [Record details](https://notchset.dev/blocks/record-details) · Pro
- [Inline edit](https://notchset.dev/components/inline-edit) · Free
- [Search field](https://notchset.dev/components/search-field) · Free
- [Side panel](https://notchset.dev/components/side-panel) · Free

Each item installs as source in your project. This public guide contains descriptions and installation links, not Pro source.