Atelier UI

Search components…

Search components…

Description List

Semantic key/value detail list in vertical, horizontal and grid layouts with copy buttons, badges, links and empty placeholders.

Edit in sandbox

Copy a prompt for your AI coding tool with the source, dependencies and usage

Props

DescriptionListProps

Also accepts all props of Omit<React.ComponentProps<"dl">, "children">

PropTypeDefaultDescription
items* requiredDescriptionItem[]——
layout"vertical" | "horizontal" | "grid""vertical"—
emptyTextstring"Not provided"Text shown for empty values

Install

$ npx shadcn@latest add https://chromotion.dev/r/description-list.json

More like this