Haedong
036

Empty

Feedback

No results

Nothing matches "grid". Try another word.

Customize

Detail

Code

<Empty>
  <EmptyTitle>No results</EmptyTitle>
  <EmptyDescription>Nothing matches "grid". Try another word.</EmptyDescription>
  <EmptyContent>
    <Button size="sm">Clear search</Button>
  </EmptyContent>
</Empty>

Install

npx shadcn@latest add https://components.haedong.dev/r/empty.json

Props

All four extend the native element props (div, p, p, div). Empty is the dither field and centers one plate; put EmptyTitle, EmptyDescription and EmptyContent inside it. Static content: no role — if the emptiness is a result, announce it on the region that changed.

PropTypeDescription
classNamestringSize of the field. Defaults to full width and min-h-40.
childrenReactNodeEmptyTitle (uppercase), EmptyDescription (muted), EmptyContent (actions, e.g. a Button).