Implemented MutationObserver to detect theme changes: - Added themeKey state that increments on theme change - MutationObserver watches document.documentElement for class changes - Detects when "dark" class is toggled - Added themeKey to waveform effect dependencies - Canvas automatically redraws with new theme colors How it works: 1. Observer listens for class attribute changes on <html> 2. When dark mode is toggled, themeKey increments 3. useEffect dependency triggers canvas redraw 4. getComputedStyle reads fresh --color-waveform-bg value 5. Waveform renders with correct theme background Benefits: - Seamless theme transitions - Waveform colors always match current theme - No manual refresh needed - Automatic cleanup on unmount Now switching between light/dark themes instantly updates all waveform backgrounds with the correct theme colors! 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
17 KiB
17 KiB