Error State

Overview

ErrorState displays a centered error message with a customizable icon and optional retry button. It is used to communicate loading failures, permission errors, network issues, or server problems in dashboards and data views.

Usage

import { ErrorState } from "@leanicon/web-builder-library/saas";
import { WifiOff } from "lucide-react";

<ErrorState
  title="Connection failed"
  message="Unable to reach the server. Check your connection."
  icon={WifiOff}
  onRetry={() => fetchData()}
  retryLabel="Reconnect"
/>;

Variants

Default

Dark

Network Error

Network Error - Dark

Server Error

Permission Error (No Retry)

Without Retry

Custom Retry Label