DescriptionList

Read-only record details.

CustomerAda Lovelace

StatusActive

Emailada@example.com

Created2026-07-01


import { DescriptionList } from '@gg-software/ui';
 
<DescriptionList
    columns={2}
    bordered
    items={[
        { label: 'Customer', value: order.customer },
        { label: 'Status', value: <Badge label={order.status} /> },
        { label: 'Email', value: order.email },
        { label: 'Created', value: formatDate(order.createdAt) },
    ]}
/>;

Props

Prop	Type	Default
`items`*	`DescriptionItem[]`	—
`columns`	`number`	`1`
`layout`	`"horizontal" \| "vertical"`	`vertical`
`bordered`	`boolean`	`false`
`className`	`string`	—

* required · generated from packages/ui/src/data/DescriptionList/DescriptionList.tsx

Types


type DescriptionItem = {
    label: ReactNode;
    value: ReactNode;
};