Show key-value details and a live indicator

At a glanceCopy Anchor Link

• Who: Developers rendering record details (drawers, side panels, headers).
• What: Key-value detail lists plus an optional live pulse.
• Use when: For read-only record summaries next to the list.
• Avoid when: For editable records — use Form instead.
• See also: Show a sortable, filterable, paginated data table, Slide in a drawer panel

PreviewCopy Anchor Link

InstallCopy Anchor Link

pnpm add @zedtech/zedkit-ui

Latest: 0.3.0 (via changesets).

ExampleCopy Anchor Link

import { DetailPanel, LivePulse, PageHeader } from "@zedtech/zedkit-ui";
<PageHeader title="Server" actions={<LivePulse />} />
<DetailPanel items={[{ label: "Region", value: "eu" }]} />

Wraps: none (theme tokens only)

PropsCopy Anchor Link