GitHub

Empty

Empty state placeholder with icon and message

Basic Usage

Loading...

Installation

pnpm add @corew500/ui

Usage

import { Empty } from "@corew500/ui/empty"

<Empty>Content</Empty>

Variants

emptyMediaVariants

AxisValuesDefault
variant
defaulticon
default

CMS Integration

CMSPayload CMS Integration
This component supports CMS-driven content via @corew500/cms-payload.
Loading...

API Reference

Accessibility

Screen Readers

  • - Empty states should have descriptive text for screen readers
  • Icons should be decorative with `aria-hidden="true"`

Additional

  • Call-to-action buttons should have clear, actionable labels
  • Use semantic heading elements within EmptyTitle when appropriate

Localization

Translatable Content

  • - Pass pre-translated strings to EmptyTitle and EmptyDescription
  • Button labels in EmptyContent should be localized
  • Icon labels (if used) should be localized via aria-label

Related

Related Components