EnterUI
DocsComponentsThemesExamplesDonation
Get Started
      • ErrorState
      • ErrorBoundaryFallback
      • LoadingOverlay
      • SkeletonForm

Default usage

  1. EnterUI
  2. /Docs
  3. /Product Operations
  4. /Product Surfaces
  5. /Error and Loading
  6. /SkeletonForm
Updated 3 October 2026

SkeletonForm

Loading placeholder shaped like a form layout with field rows and trailing actions.

SkeletonForm renders skeleton field rows so a form/settings surface keeps its dimensions while data loads.

#Default usage

Form skeleton

Defaults to 5 fields plus an actions row.

Code
<SkeletonForm />

#Import

Code
import { SkeletonForm } from "@froggdesign/enter-ui-react";

#Accessibility

Exposes aria-busy="true" and aria-live="polite". Replace with the real form once data arrives so focus order stays predictable.

#API

  • fields: number of field rows (default 5).
  • sectionEvery: render a divider every N fields.
  • showActions: render a trailing actions row (default true).

#Styling

Every exported component accepts className. EnterUI styles use .eui-* classes and --eui-* variables mapped from FroggDesign theme tokens.

PreviousLoadingOverlay
NextStatGrid
On this page
  • Default usage
  • Import
  • Accessibility
  • API
  • Styling