Result
Displays the outcome of an operation with status icon, title, description, and action buttons.
Installation
dotnet add package Lumeo
One-time app setup (AddLumeo(), CSS & JS) is covered in the
installation guide.
Usage
@using Lumeo <Result />
When to Use
- Success or error pages after a form submission or payment
- Operation outcomes such as completed actions or failed processes
- Confirmation screens showing the result of a user action
- HTTP error pages like 404 Not Found or 403 Forbidden
Payment Successful
Order #2024-0127 has been confirmed.
Submission Failed
Please check your form and try again.
Warning
Proceed with caution.
Information
Here is some useful info.
404 Not Found
The page you are looking for does not exist.
403 Forbidden
You do not have permission to access this.
Pick a status to see it applied live.
Success Result
This is a success result page.
API Reference
| Property | Type | Default | Description |
|---|---|---|---|
| Status | ResultStatus | Info | Status type. Values: Success, Error, Warning, Info, NotFound, Forbidden, ServerError. |
| Size | ResultSize | Medium | Component size. Values: Small, Medium, Large. |
| Title | string? | null | Main heading text. |
| SubTitle | string? | null | Secondary description text. |
| IconContent | RenderFragment? | null | Custom icon slot that overrides the default status icon. |
| Extra | RenderFragment? | null | Action buttons area below the description. |
| Class | string? | null | Additional CSS classes. |
| AdditionalAttributes | Dictionary<string, object>? | null | Additional HTML attributes. |
Related Components
- Alert — Inline status messages within a page rather than full-page outcomes
- EmptyState — Placeholder when there is no data, rather than an operation result
- Card — Container for embedding result content within a layout