Skeleton

Loading placeholder. One of the five feedback states — the only one that renders bars (see guidelines/app-state-honesty).

Prop	Type	Notes
`variant`	`'page' \| 'block'`	`page` (title bar + lines) or `block` (in-container: lane, list, panel).
`lines`	`number`	Number of text bars.
`label`	`string`	Accessible label; announced via role="status".
`className`	`string`

Other props pass through to the root element (React.HTMLAttributes<HTMLDivElement>).

Preview

Declarations

TypeScript

export interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
  /** `page` (title bar + lines) or `block` (in-container: lane, list, panel). */
  variant?: 'page' | 'block';
  /** Number of text bars. */
  lines?: number;
  /** Accessible label; announced via role="status". */
  label?: string;
  className?: string;
}

/**
 * Loading placeholder. One of the five feedback states — the only one that
 * renders bars (see guidelines/app-state-honesty).
 */
export function Skeleton(props: SkeletonProps): React.JSX.Element;