Descriptions
A key-value pair list for displaying structured metadata.
Installation
dotnet add package Lumeo
One-time app setup (AddLumeo(), CSS & JS) is covered in the
installation guide.
Usage
@using Lumeo <Descriptions />
When to Use
- Detail views showing entity information like user profiles or order summaries
- Product specifications with labeled attribute-value pairs
- Key-value data display for settings, configuration, or metadata
- Read-only data presentation where a full table is not needed
User Details
- Name
- John Doe
- john@example.com
- Role
- Administrator
- Status
- Active
Order Details
- Order ID
- #2024-0127
- Date
- Jan 27, 2025
- Status
- Shipped
- Amount
- $249.00
- Payment
- Visa ***4242
- Tracking
- 1Z999AA10123456784
- Product
- Lumeo Pro License
- Price
- $99/year
- License Key
- XXXX-XXXX-XXXX-XXXX
API Reference
Descriptions
| Property | Type | Default | Description |
|---|---|---|---|
| Title | string? | null | Heading above the descriptions grid. |
| Bordered | bool | false | Display with borders and dividers. |
| Column | int | 3 | Number of columns (1-4). |
| ChildContent | RenderFragment? | null | DescriptionsItem children. |
DescriptionsItem
| Property | Type | Default | Description |
|---|---|---|---|
| Label | string? | null | Key label text. |
| ChildContent | RenderFragment? | null | Value content. |
| Class | string? | null | Additional CSS classes. |