Description list
Labelled facts about one record, as a real dl. Use it on detail pages and sheets wherever you would otherwise write label: value by hand.
bunx --bun shadcn@4.17.0 add @waimakers/description-list- npm dependencies
- None
From the registry
Semantic dl, grouped dt and dd parts in stacked, inline or responsive two-column layouts. Details can use monospace; missing values show a dash and announce Not set.
Examples
Stacked
The default. Each term sits above its details; reads well in narrow columns.
- Agent
- Meeting scribe
- Owner
- Anna
- Model
- claude-sonnet-5-5
Inline
Term and details side by side on a one-to-two grid, for compact panels.
- Skill
- Summarise meeting
- Trigger
- When a recording finishes
- Writes to
- The meeting's channel in Slack
Two columns
Stacked on a phone, two columns from sm up, for longer records.
- Agent
- Release notes
- Owner
- Tamar
- Collaborators
- Paul, Joost
- Schedule
- Fridays at 16:00
- Last run
- 17 October, 16:00
- Average duration
- 3m 51s
Mono and missing
Identifiers set in mono. A missing value shows a quiet dash and reads as Not set.
- Agent id
- agt_01JB6N4W3K9QF2
- Commit
- 8aa21829de
- Slack channel
- Not set
Loading
SkeletonDescriptionList keeps each row's height while the record loads.
Loading details