Skip to content
aq-ui
Back to ComponentsComponent

Progress

Open-code aq-ui accessible component family for Progress.

Preview

This is a live example. Interact with the available controls and use the keyboard to inspect the component's states and behavior.

Loading interactive preview…

Installation

pnpm dlx aq-ui@alpha add progress

API reference

Client module

Import the parts you need, then jump to an export for its contract.

View full source

Quick start

"use client"

import { Progress } from "@/components/ui/progress"

<Progress />

Progress

constSource L9

Open-code aq-ui accessible component family for Progress.

const Progress = React.forwardRef<React.ComponentRef<typeof ProgressPrimitive.Root>, ProgressPrimitive.Root.Props>(…)
Props type
ProgressPrimitive.Root.Props
<Progress />

ProgressIndicator

constSource L48

Public const export from Progress.

const ProgressIndicator = React.forwardRef<React.ComponentRef<typeof ProgressPrimitive.Indicator>, ProgressPrimitive.Indicator.Props>(…)
Props type
ProgressPrimitive.Indicator.Props
<ProgressIndicator />

ProgressLabel

constSource L63

Public const export from Progress.

const ProgressLabel = React.forwardRef<React.ComponentRef<typeof ProgressPrimitive.Label>, ProgressPrimitive.Label.Props>(…)
Props type
ProgressPrimitive.Label.Props
<ProgressLabel />

ProgressTrack

constSource L30

Public const export from Progress.

const ProgressTrack = React.forwardRef<React.ComponentRef<typeof ProgressPrimitive.Track>, ProgressPrimitive.Track.Props>(…)
Props type
ProgressPrimitive.Track.Props
<ProgressTrack />

ProgressValue

constSource L78

Public const export from Progress.

const ProgressValue = React.forwardRef<React.ComponentRef<typeof ProgressPrimitive.Value>, ProgressPrimitive.Value.Props>(…)
Props type
ProgressPrimitive.Value.Props
<ProgressValue />

Registry dependencies

utils

Package dependencies

@base-ui/react@^1.7.0

Files

  • components/ui/progress.tsx

Source