Components
Built on React with Tailwind CSS and shadcn/ui.
UI Components (src/components/ui/)
shadcn Components (19):
| Component | Purpose |
|---|
alert | Alert messages and notifications |
badge | Status badges and labels |
button | Standard button component |
card | Card container layout |
checkbox | Checkbox input |
dialog | Modal dialog windows |
dropdown-menu | Dropdown menu component |
input | Text input field |
label | Form labels |
menubar | Application menu bar |
scroll-area | Custom scrollable container |
select | Select dropdown |
slider | Range slider input |
sonner | Toast notifications (Sonner wrapper) |
switch | Toggle switch |
table | Data table |
tabs | Tab navigation |
textarea | Multiline text input |
tooltip | Hover tooltips |
Custom Components (10):
| Component | Purpose |
|---|
activity-indicator | macOS-style circular spinner with 8 animated bars |
activity-indicator-with-label | Spinner with text label showing processing state |
audio-bars | Real-time audio frequency visualization bars |
audio-input-button | Mic button with recording, transcription, and waveform |
dial | Rotary knob control for synthesizer parameters |
playback-bars | Animated equalizer bars for playback indication |
right-click-menu | Context menu wrapper using DropdownMenu |
SwipeInstructions | Mobile swipe tutorial overlay for window switching |
volume-bar | Animated volume level indicator bar |
Layout Components (src/components/layout/)
Shared Components (src/components/shared/)
