vibecodng.com

Free MCP betaIndex and tools live

Measured entry

hextaui-progress

progressminimal-flatmotion on file

A minimal linear progress bar shipped as a shadcn registry component. It wraps Radix Progress, animates the indicator with a transform transition, and marks incomplete work as busy. Its styling relies on Tailwind theme utilities, the local cn helper, and the project alias used for that helper.

Specimen
Motion capture of the mounted demo, recorded by the harness. No audio track.
Harness screenshot of hextaui-progress at 375 pixels wide
Harness screenshot at 375 pixels wide. No horizontal overflow recorded.
Harness screenshot of hextaui-progress at 768 pixels wide
Harness screenshot at 768 pixels wide. No horizontal overflow recorded.
Harness screenshot of hextaui-progress at 1440 pixels wide
Harness screenshot at 1440 pixels wide. No horizontal overflow recorded.

Measured

Every value below was written by the harness on the run that produced the frames above. None of it is derived from the prose.

Harness measurements recorded for hextaui-progress
BuildOK
MountOK
Console errors0
Uncaught page errors0
Horizontal overflowclean at 375, 768, 1440
Axe critical0
Axe serious1
Axe moderate0
Axe minor0
Gzip marginal29.3 KB (94.7 KB build, 65.4 KB baseline)
Bare modeFAIL
Provider requiredNO
Demo usedwritten from the component source API

What the harness recorded

BARE BUILD

✗ Build failed in 1m
error during build:
[vite:load-fallback] Could not load <sandbox>/src/lib/utils (imported by src/cut/components/ui/progress.tsx): ENOENT: no such file or directory, open '<sandbox>/src/lib/utils'

Verdict

A sound, focused wrapper once labeled correctly, but the tested demo leaves the progressbar without an accessible name. It also needs a shadcn-style setup and does not mount in a bare project as supplied.

Use it if

  • You already use Radix primitives and want a compact determinate progress bar.
  • Your app has shadcn-style Tailwind tokens and a shared class-name utility.
  • You want motion that respects the user's reduced-motion preference.

Skip it if

  • You need an accessible label to be supplied automatically rather than at each call site.
  • You need segmented, circular, or richly labeled progress states.
  • You do not want to adopt Radix or Tailwind-based styling for a single indicator.

Install

Installation record for hextaui-progress
Declared dependencies@radix-ui/react-progress
Missing on installnone
Bare installfails once the shadcn-style helpers are removed, so it needs that setup
Providerno provider required in the harness

In a non-shadcn project, add the Radix Progress package, provide the cn class-merging helper or replace it, configure the referenced import alias, and recreate the Tailwind utilities and theme color tokens. Give every instance an accessible name through an ARIA label or a linked visible label.

Source and credit

This page is a review, not a copy. The component source lives with its author and this site does not republish it. Read the license before you use anything.

Author repository

github.com/preetsuthar17/HextaUI
License
MIT
Record published
2026-08-14

Alternatives

Other published entries for the progress pattern, ordered by what they measured: mounts first, then clean axe scans, then bare-mode passes, then the smaller bundle.