Data table

Enterprise data table with sortable headers, row selection checkboxes, expandable detail rows, sticky first column, density modes, and loading state. All features are additive CSS on the existing component.

Full-featured table

1 account selected
Account Created PlanStatusSeats MRR
Acme Ops2024-03-15EnterpriseActive48$2,400

Account ID

acct_1000

Owner

AO Admin

Region

us-east-1

API calls (30d)

59,856

Northwind2024-08-02ProTrialing12$980

Account ID

acct_1001

Owner

N Admin

Region

us-east-1

API calls (30d)

14,964

Globex2024-01-22ProActive8$980

Account ID

acct_1002

Owner

G Admin

Region

us-east-1

API calls (30d)

9,976

Initech2024-11-10TeamPast due5$420

Account ID

acct_1003

Owner

I Admin

Region

us-east-1

API calls (30d)

6,235

Umbrella2023-06-01EnterpriseActive60$2,400

Account ID

acct_1004

Owner

U Admin

Region

us-east-1

API calls (30d)

74,820

Inline edit composition

A read view and a real form share one app-owned state boundary. This is a composition recipe, not a JavaScript dependency or new field variant.

Workspace nameAcme Operations

Compact density

Same data with data-pl-density="compact" for tighter rows.

Name PlanSeats
Acme OpsEnterprise48
NorthwindPro12
GlobexPro8
InitechTeam5
UmbrellaEnterprise60

Loading state

Skeleton rows while data is fetching.

AccountPlanMRR