Record Button

A microphone toggle with three states: idle, recording (pulsing dot with dual rings), and confirmed (checkmark). Respects prefers-reduced-motion.

core/record-button

Installation

1 · Add registry to components.json

2 · Install component

Click to cycle through idle → recording → confirmed states.

Click to record

Prop	Type	Default	Description
`recording`	`boolean`	`false`	Whether recording is currently active.
`confirmed`	`boolean`	`false`	Completed/saved state — shows a checkmark.
`recordingClassName`	`string`	—	Class applied to the recording indicator (default: red-500).
`confirmedClassName`	`string`	—	Class applied to the checkmark icon (default: text-primary).