The full center-to-rim needle crossed the digital readout at low/mid
values. Draw it as a short marker riding just inside the arc (with a dark
outline for contrast) and recenter the readout.
Bugs from real-product integration:
- Meter/LEDFader clamp geometry below breadth 14 (no negative SVG rects)
- mixColors falls back to CSS color-mix() so theme tokens can be var()/oklch()
- type-in editing fires a real edit gesture (Start/onChange/End, source 'edit')
- ScrubField Enter/Escape no longer double-commit or commit-on-revert via blur
- disabled dims the whole control uniformly, data-disabled on the wrapper
New capabilities:
- commitMode 'release': drags preview, emit once on pointer-up, Esc discards
- Meter accepts value=[l, r, ...]; theme zoneGood/zoneWarn/zoneHot defaults
- XYPad per-axis invert + detents; Fader valuePosition top|end|none
- LED skins: unit labels, uncapped displayDecimals, aria-valuetext defaults
New components: IndicatorLamp, SegmentSwitch, ScrubField, MeterBridge,
PushButton led='dot'. Docs: change-contract table, recipes, gallery cards.
- MIT license attributed to Dreamodus Software Inc. (root + package
LICENSE, package.json author, README and docs-site footer)
- Version 1.0.0; CHANGELOG.md summarizing the release
- Package files whitelist includes LICENSE/README/CHANGELOG; tarballs
gitignored
- Root README: instructions for consuming the unpublished package
(tarball, file dependency, or pnpm link)
Verified: 32 tests, both packages typecheck, production builds clean,
and a pnpm-pack tarball installed into a fresh project resolves all 50
exports via both ESM and CJS.
The crackle was software (our audio graph), not hardware:
- Peaks past 0 dBFS were being hard-clipped by the DAC (resonance up
to +27 dB and delay feedback easily exceed full scale). Added a
brickwall-style DynamicsCompressor (-3 dB, 20:1, 2 ms attack) before
the destination; worst-case output now peaks around -6 dB RMS.
- LFO cutoff modulation is clamped below the cutoff value so the
filter frequency cannot be driven negative (high-Q biquad near 0 Hz
sputters audibly).
- Envelope retriggers use cancelAndHoldAtTime (with fallback) instead
of cancel+set, removing step-discontinuity clicks on fast replays.
- Synth meter clip threshold moved to -1 dBFS: the LED now reads as a
limiter-activity indicator since true output clipping is gone.
- Dedicated clip LED at the hot end (default on): lights when the
signal reaches clipThreshold (default max), holds for clipHold ms or
latches until clicked ('latch'); clipColor, onClip callback,
data-clipped root attribute, data-part=clip for CSS
- clipValue prop: separate signal for clip detection so the bar can
show RMS while the LED watches sample peaks, like real meters
- Synth: analyser loop now computes sample peaks alongside RMS and
feeds them to the clip detector - overdriving the synth genuinely
trips the LED
- Gallery meter demo throws occasional hot transients to exercise it;
API docs and README updated
- Nav links scroll horizontally inside the bar on narrow screens
(hidden scrollbar) instead of forcing page-level horizontal scroll;
compact logo/link sizing under 760px
- API prop tables scroll inside their own box (display block +
overflow-x auto) - the last source of horizontal page overflow
- Playground: sticky controls become static in the stacked mobile
layout; grid columns use minmax(0, 1fr) so code blocks cannot blow
out the column; smaller code font on phones
Verified at 390x844 with touch emulation: zero horizontal overflow,
rotary knob touch-drag without page scroll, fader tap-to-jump, XY pad
touch drag, and the full synth flow (power, HOLD, latch/unlatch pads)
all working via touch.
- Modular hardware-style panel: System / Oscillator / Filter / Envelope
/ LFO / Drive / Echo / Output / Keyboard sections with labeled frames
- HOLD switch: pads become latching toggles (switching pads retunes the
held note, unlatching or disabling HOLD releases it)
- Fuller Web Audio voice: waveshaper drive, full ADSR, feedback delay
(time/feedback/mix), LFO target switch (cutoff or pitch via detune),
octave/detune/glide with live retuning of held notes
- More of the library in service: MetalKnob (drive, with value bubble),
VintageKnob (echo time), horizontal LEDFader (echo mix), XYPad
two-way-linked with the cutoff/res knobs (exponential x-axis mapping),
SegmentDisplay live frequency readout, 4 preset buttons that glide
every knob via animateChanges
- Disambiguated synth aria-labels from gallery demos; octave readout
fixed via decimals/format
- SteppedKnob now honors the format prop for numeric readouts
Docs/playground accuracy (from a full docs-vs-source audit):
- Playground: drag-feel select covers pickup/relative rotary modes, is
disabled for faders, and generated code no longer emits props the
target component does not accept
- API/README claims corrected: Shift-fine wheel scope, wheelStep and
decimals defaults, trackInset row, data-part and ref-forwarding
scope, VintageKnob readout exception, Meter peakHold tag, stale
component lists, aria-valuetext wording, also-exported list
API consistency fixes surfaced by the audit and the tutorial:
- Keyboard gestures now fire onChangeStart (bracket parity with drag/
wheel - fixes gesture-scoped undo patterns)
- name (hidden form input) added to Fader, LEDFader, ImageKnob
- PushButton gets a themed keyboard-only focus ring + data-focus-visible
New docs content:
- Getting Started: 7-step guide with live examples and a gotchas list
- Advanced guide: 8-step channel-strip tutorial ending in a live,
themed, gesture-undoable strip with meter (plus headless demo)
- Synth section: playable Web Audio synth - osc/filter/env/LFO/master
all dreamknob controls, momentary-pad keyboard, analyser-driven Meter
- valueBubble/bubbleFormat: floating readout above knobs while dragging
(Knob-based skins + ImageKnob)
- animateChanges: rAF ease-out tween of the pointer on programmatic
value changes; user gestures snap; prefers-reduced-motion disables
- wrap: endless encoder mode — values and relative drags roll around
min↔max; pairs with angleOffset={0} angleRange={360}
- XYPad: two-parameter pad with absolute drag, arrow keys (Shift
coarse), Escape cancel, double-click reset, grid/crosshair, focus
ring, hidden form inputs, change meta
- AlphaDisplay: fourteen-segment alphanumeric LED (A-Z, 0-9, symbols,
decimal points, chars padding/align, glow/skew)
- PushButton: studio panel button with LED strip — toggle or momentary,
controlled/uncontrolled, aria-pressed, hidden form input
- Docs: five new gallery cards incl. animated preset demo, API rows,
README
- rotaryMode: 'absolute' | 'relative' (angle deltas, no grab jump) |
'pickup' (MIDI-style: engages when the pointer sweeps past the value)
- dragAcceleration: velocity gain for relative drags (Shift bypasses);
hideCursorOnDrag hides the cursor mid-gesture
- Wheel: trackpad delta accumulation (flicks can't rocket the value,
one notch per wheel click), wheelStep override, wheelRequiresFocus
opt-out of the hover scroll-trap
- onChange/onChangeStart/onChangeEnd now receive { source: 'drag' |
'wheel' | 'keyboard' | 'reset' | 'api' }
- Every component forwards a ref to its root; name prop renders a
hidden form input; SVG primitives carry data-part attributes
- Arc gradient: position-anchored color stops rendered as sliced arcs
(mixColors/sampleGradient exported, unit-tested)
- New read-only Meter: LED level meter with peak hold, zones, readout
- Fader capColor/capLength for custom handle styling
- Docs: Meter/gradient/drag-feel gallery cards, white-cap fader demo,
API rows, README
- Keyboard focus-visible ring on all controls (WCAG 2.4.7), suppressed
for pointer grabs; focusRing prop to customize or disable
- aria-orientation on track modes; data-dragging/-disabled/-readonly/
-focus-visible state attributes; disabled dims, readOnly drops the
grab cursor
- Escape cancels a drag and restores the pre-gesture value
- Controlled mode no longer desyncs when the parent rejects onChange
- Second concurrent pointer can no longer hijack a drag session;
drags cancel when disabled/readOnly flips mid-gesture
- Wheel: onChangeStart symmetry, settle flush on unsubscribe, dominant-
axis direction (fixes macOS Shift+scroll reversal), ignored mid-drag
- Shift+wheel and fine multipliers now work on stepped/values knobs
- Fader/LEDFader track mapping inset-aligned with handle travel (no
value jump when grabbing the cap); LEDFader zones sorted
- roundTo no longer returns NaN for exponential-notation values;
logTaper falls back to linear for invalid ranges; decimalsFromStep
shaves float noise; findClosest([]) returns the input
- Double-click reset brackets with onChangeStart/End
- MetalKnob honors showValue/unit/format; VintageKnob omits them from
its type; TickLabels extracted as a public primitive
- SegmentDisplay: letters/hex charset, dash overflow instead of 888
React + TypeScript knob/fader library with a headless interaction core
(rotary, relative-drag and track modes, wheel, keyboard, a11y), SVG
primitives, nine prebuilt skins, seven-segment display engine, and a
Vite showcase with gallery, live playground and API docs.