Screen State

ScreenState component is used to display the current state of the screen. It is used to show the loading, error, and empty states of the screen.

Source Code

screen-state-01.tsx
"use client"
 
import ScreenState from "./components/screen-state"
 
const ScreenState01 = () => {
  const handleCancel = () => {}
 
  const handleCreate = () => {}
 
  return (
    <div className="flex size-full items-center justify-center">
      <ScreenState
        title="No files found"
        description="Your search “design system” did not match any projects. Please try again."
        onCancel={handleCancel}
        onCreate={handleCreate}
      />
    </div>
  )
}
 
export default ScreenState01

Previous

Kanban Column