Skip to content
← Inventory

DescriptionList

A <dl> that lays out term/description pairs in a grid. Import from "@desk/ui/components/description-list".

Material
Natural marble
Finish
Polished
Origin
Carrara, Italy
Lead time
3–5 business days

Usage

import { DescriptionDetails, DescriptionItem, DescriptionList, DescriptionTerm } from "@desk/ui/components/description-list";

Best practices

  • Fill it with DescriptionItem rows (each a DescriptionTerm + DescriptionDetails) — it renders a real <dl>, so keep the dt/dd semantics rather than nesting raw divs.

  • Use this for read-only key/value metadata about one entity; for tabular rows of many records reach for Table or DataGrid instead.

  • Turn on showSeparators when items are visually dense; leave it off inside a bordered Card where the container already frames them.

Props

DescriptionDetails

PropTypeDefaultDescription
clampLinesnumber

Number of lines to clamp to; 0 or undefined disables clamping. When the content actually overflows, a More/Less toggle is shown to expand it.

DescriptionList

PropTypeDefaultDescription
showSeparatorsboolean

Draw a divider line beneath each item except the last.

Also exports

  • componentDescriptionItem
  • componentDescriptionTerm