Audio primitives
Reusable primitives for assembling audio players, podcast modules, voice memos, and Mufflermen exhaust previews. Visual references — primitives tolerate missing media sources gracefully.
Audio primitives is a reusable Oak Flats Muffler Men UI primitive with documented states, accessibility expectations, theme behavior, and implementation evidence.
Audio primitives: Reusable primitives for assembling audio players, podcast modules, voice memos, and Mufflermen exhaust previews. Visual references — primitives tolerate missing media sources gracefully.
Audio player
Full player — play/pause, skip, scrubber over waveform, time, volume, speaker selector.
Mini audio player
Compact inline player with 60px waveform and total duration chip.
Voice memo recorder
Round red record button, live spike visualization, elapsed counter, save/discard.
Audio waveform
Pure SVG waveform from sample array — compact and detailed variants, progress fill.
Volume slider
Horizontal or vertical slider in 0–1 with optional mute toggle.
Speaker selector
Popover dropdown of available output devices with type icons and subtitles.
Audio device chip
Compact chip showing current device with optional switch action.
Now playing card
Hero card — cover gradient, title, artist, progress, transport controls.
Audio queue list
Up-next list with track number, title, artist, duration, drag handle, remove.
Podcast episode card
Thumbnail + show name + duration chip + published time + chapter accordion.
Chapter markers
Horizontal chapter timeline strip with hover bubble revealing the chapter title.
Audio loading state
Buffering state — animated equalizer bars + status copy.
Exhaust sound preview
Mufflermen exhaust clip button — small waveform animation + loudness + pipe chips.
Equalizer bars
Decorative 4–16 bar live equalizer animated via CSS keyframes, reduced-motion safe.
Full audio scene
Now-playing card + full player + queue + chapter markers + equalizer decoration.