Lumeo

Empty State

A placeholder component for when there is no data to display.

Installation

dotnet add package Lumeo

One-time app setup (AddLumeo(), CSS & JS) is covered in the installation guide.

Usage

@using Lumeo

<EmptyState />

When to Use

  • No data messages when a list, table, or feed has zero items
  • Empty lists or collections before the user adds their first item
  • Search results pages that return no matches
  • First-time user experiences prompting an initial action

No results found

Try adjusting your search or filters to find what you're looking for.

No projects yet

Get started by creating your first project.

Inbox zero

You have no new messages. Enjoy the silence.

API Reference

EmptyState

Prop Type Default Description
IconContentRenderFragment?nullCustom icon displayed above the title. (Icon is a deprecated alias.)
Titlestring?nullMain heading text for the empty state.
Descriptionstring?nullSecondary description text below the title.
ActionRenderFragment?nullAction buttons area below the description.
Classstring?nullAdditional CSS classes.
AdditionalAttributesDictionary<string, object>?nullAdditional HTML attributes.
  • Card — Container for content that can hold empty states
  • Alert — Inline messages for warnings or informational notices
  • Skeleton — Placeholder while content is loading, before an empty state is shown