Progress

Progress defines how EnterUI handles a horizontal progress indicator with semantic variants, including default structure, accessible states, and token-driven styling.

#Default usage

<div className="docs-preview-stack">
  <Progress value={68} aria-label="Component coverage" />
  <Progress value={92} variant="success" aria-label="Release readiness" />
  <Progress value={34} variant="warning" aria-label="Migration progress" />
</div>

#Import

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

#Accessibility

Progress uses Radix progress semantics. Provide an accessible label unless nearby text already describes the value.

#API

• value and max control the indicator.
• variant: default, success, warning, error, or info.

#Styling

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