Skip to content
DOL Studio

Table

Design: Stable Code: Coded datascanning 6 Figma sets Table cell header/Light style/General

Live preview

Sortable + selectable rows
EmailStatus
Alice Nguyenalice@dol.vnAdminActive
Bao Tranbao@dol.vnEditorActive
Chi Lechi@dol.vnViewerPending
Duy Phamduy@dol.vnEditorInactive
Striped variant + compact density
NameRoleLast login
Alice NguyenAdmin2h ago
Bao TranEditor2h ago
Chi LeViewer2h ago
Duy PhamEditor2h ago

Import & files

Import
import { Table } from "@dol/ui/table";
Source file
packages/@dol/ui/src/table/Table.tsx

Figma source

Figma source 6 sets
Page
Table
Sets
6
Primary set
Table cell header/Light style/General · 8 variants Open in Figma →
Showing: Table cell header/Light style/General
5 other sets
  • Header content/Component type 4 variants Figma →
  • Table cell content/General (Simple) 3 variants Figma →
  • Table cell header/Light style/Mini 4 variants Figma →
  • Table cell header/Light style/Simple 8 variants Figma →
  • Table cell/Layout/Simple 8 variants Figma →

AI context

AI context

Markdown summary safe to paste into Claude / ChatGPT / Cursor — includes name, status, import, props, axes, examples, figma source. 

# Table
Slug: `table`
Domain: general · Category: display
Design: stable · Code: coded


## Description
Data table primitives - header rows, body cells, light-style headers. Composes with pagination + empty state.


## Import
```ts
import { Table } from "@dol/ui/table";
```
Source: `packages/@dol/ui/src/table/Table.tsx`


## Figma source
Page: Table
Sets: 6
Primary: Table cell header/Light style/General
Open: https://www.figma.com/design/DqRd7UQkNGcdvYL5fwZxlf/?node-id=32825-21280

Related

  • DOL English logo

    Logo

    Coded

  • Avatar, User

    Coded
  • Tag label

    Tag

    Coded

  • Divider

    Coded

  • Order number

    Coded
  • 3

    Badge

    Coded

Status legend

Status legend
Stable
Design + code shipped, full DS parity.
Partial
Design ready, some variants/states missing in code.
Coded
Implemented in code; design canon may not yet exist.
Design only / Code only
One side present; awaiting the other.

Phase 1.X-5.2 detail view — read-only metadata. Code preview + recipe + live demo deferred (need @dol/ui registry integration).