DataGrid with pinned filters, bulk actions, and a slide-out detail drawer.
The workhorse of B2B applications. A filterable, sortable, bulk-selectable table of records with a side drawer that opens on row click. Pinned filter chips at the top, bulk-action bar that appears when rows are selected. Pagination at 10/25/50/100 per page, configurable per user.
Each section pre-wired with the right CleenUI primitives. Swap, remove, or extend any of them — the template is a starting point, not a constraint.
Title, New-record CTA on right.
Pinned filters as chips; 'More filters' opens the drawer.
Sortable columns, sticky header, 10/25/50/100 pagination.
Slides in from top when rows are selected.
Right slide-out on row click; shows full record.
All of these are in the catalog — the Builder skill imports them automatically. Each chip links to that component's page.
When the Builder skill scaffolds this template for you, these are the fields it asks about — or infers from your prompt.
Ask your AI agent to scaffold this template in your project — the Builder skill knows the Datagrid layout and the components it uses.
Two paths to your first component. Pick the one that fits how your team builds.
One prompt to your AI tool. The Setup skill handles dependencies, design tokens, build config, and component registration — all without leaving your editor.
The classic flow. Install the package, import the styles, drop in your first component. No agents required — same end result.