Empty State
Empty states are used to convey there is no data is available for display. Types include No results, First use, No Data, User Cleared.
Figma Link
- Web Components
- Flutter
Demo
zeta-web v0.11.0
Web Components
Storybook
https://design.zebra.com/web/storybook/?path=/docs/components-empty-state--docs
Slots
Name | Description | Type |
---|---|---|
primaryAction | Primary Action Button. Should be a zeta-button . | text |
secondaryAction | Secondary Action Button. Should be a zeta-button . | text |
illustration | Illustration to be displayed in the empty state. Should be a zeta-illustration . | text |
Attributes
Name | Description | Type | Default |
---|---|---|---|
title | Title of the empty state | string | undefined |
description | Description of the empty state | string | undefined |
Inherited Attributes
Name | Description | Type | Default | Inherited From |
---|---|---|---|---|
rounded | Whether the component is rounded or sharp.When true, rounded will set the border radius of the first child, and any children with class 'contourable-target' to --radius-minimal .Otherwise, this value will be --radius-none . | boolean | undefined | true | Contourable |
Demo
Inheritance
Object
> DiagnosticableTree
> Widget
> StatelessWidget
Constructors
Constructs a ZetaEmptyState.
ZetaEmptyState.new({Key? key, required String title, required String description, Widget? illustration, Widget? primaryAction, Widget? secondaryAction})
Properties
Name | Description | Type | Features |
---|---|---|---|
description | Subtitle of the empty state, providing additional context or instructions. | String | final |
hashCode | The hash code for this object. | int | no setter inherited |
illustration | Illustration widget for the empty state, which can be a custom widget or an image. | Widget? | final |
key | Controls how one widget replaces another widget in the tree. | Key? | final inherited |
primaryAction | Primary action button for the empty state, typically used to guide the user to take an action. | Widget? | final |
runtimeType | A representation of the runtime type of the object. | Type | no setter inherited |
secondaryAction | Secondary action button for the empty state, providing an alternative action. | Widget? | final |
title | Title of the empty state, typically a short message indicating the state of the content. | String | final |