sheengemologic ui
All components

Progress

Uses the native progress element for determinate or indeterminate task completion.@gemologic/sheen · feedback

Playground

This example has no scalar controls. Its validated source remains interactive below.
<Progress label="Upload progress" value={42} max={100} />

Variant matrix

Upload progress

Anatomy

Package
@gemologic/sheen
Source
packages/ui/src/primitives/Progress.tsx
Tokens
  • --sheen-color-bg-inset
  • --sheen-color-accent
  • --sheen-control-h-xs

Accessibility

Role: progressbarKeyboard: No component-owned keys

Do

  • Omit value for truly indeterminate work.

Do not

  • Do not invent progress percentages that the operation cannot measure.

Generated props

NameTypeDefaultDescription
label *string—Required accessible task label.
maxnumber1Positive finite completion bound.
valuenumber—Finite accepted progress; omit for an indeterminate task.
Native Solid/HTML attributes remain available and are omitted from this authored-prop view.