Components

EmptyState

v1.0.0

Friendly empty-state placeholder for lists and dashboards.

Import

import { EmptyState } from '@meteorack/sdk-react';

How To Use It

  • Render it when a query succeeds but returns no rows, modules, or activity to show.
  • Include a clear next step when the user can fix the empty state by creating, connecting, or installing something.

Works Well With

Props

icon?: ReactNode

Optional visual displayed above the title.

title: string

Primary empty-state heading.

description?: string

Supporting explanation shown under the title.

action?: ReactNode

Optional recovery or next-step action.

className?: string

Optional class name for the empty-state wrapper.

Example

EmptyState.tsx
import { EmptyState, Button } from '@meteorack/sdk-react';

export function ModulesEmptyState() {
  return (
    <EmptyState
      title="No Modules Found"
      description="Install your first Meteorack module to get started."
      action={<Button variant="primary">Browse modules</Button>}
    />
  );
}