ns-ui
An audio-style waveform rendered as columns of ASCII density glyphs with a draggable playhead — dragging (or hovering, or holding keyboard focus) subdivides the glyph columns nearest the cursor into finer sub-columns that re-ink the region at higher resolution, while the rest of the strip stays coarse.
Use when a scrub position control over a waveform where the region under the pointer should visibly resolve to finer detail while the rest stays a coarse print — a spatial resolution effect, not a hover brighten; pick voice-recorder-meter instead for a real Web Audio capture meter with no scrub/drag at all, or scrubber-film-strip for a playback scrubber whose mechanic is discrete frame-snap vs. continuous glide rather than local resolution.
Install
npx shadcn add https://design.helpmarq.comns-ui / waveform-ascii-scrub
| Prop | Type | Default | Description |
|---|---|---|---|
| value? | number | — | Controlled scrub position, 0..1. Omit for uncontrolled (see defaultValue). |
| defaultValue? | number | — | Initial position, 0..1, when uncontrolled. Default 0.3. |
| duration? | number | — | Total duration in seconds, used only to format aria-valuetext. Default 180. |
| onValueChange? | (value: number) => void | — | — |
| label? | string | — | — |
| className? | string | — | — |