EmptyState

import { EmptyState } from '@arcana-ui/core'

{/* Basic */}
<EmptyState
  title="No results found"
  description="Try adjusting your search or filters."
/>
 
{/* With icon */}
<EmptyState
  icon={<InboxIcon size={48} />}
  title="Your inbox is empty"
  description="When you receive messages, they'll appear here."
/>
 
{/* With action */}
<EmptyState
  title="No projects yet"
  description="Create your first project to get started."
  action={<Button onClick={handleCreate}>Create project</Button>}
/>
 
{/* Full example */}
<EmptyState
  icon={<FolderOpen size={48} />}
  title="No files uploaded"
  description="Drag and drop files here, or click below to browse."
  action={
    <>
      <Button>Upload files</Button>
      <Button variant="ghost">Learn more</Button>
    </>
  }
/>

<Table>
  <TableHead>
    <TableRow>
      <TableHeader>Name</TableHeader>
      <TableHeader>Status</TableHeader>
    </TableRow>
  </TableHead>
  <TableBody>
    {items.length === 0 ? (
      <TableRow>
        <TableCell colSpan={2}>
          <EmptyState
            title="No items"
            description="Add an item to get started."
            action={<Button size="sm">Add item</Button>}
          />
        </TableCell>
      </TableRow>
    ) : (
      items.map((item) => <TableRow key={item.id}>...</TableRow>)
    )}
  </TableBody>
</Table>