Building Dark Mode Toggle with Livewire v4

<div 
    x-data="{ 
        dark: localStorage.getItem('dark') === 'true',
        toggle() {
            this.dark = !this.dark;
            localStorage.setItem('dark', this.dark);
            document.documentElement.classList.toggle('dark', this.dark);
        }
    }"
    x-init="document.documentElement.classList.toggle('dark', dark)">
    
    <button @click="toggle()">
        <span x-show="!dark">🌙</span>
        <span x-show="dark">☀️</span>
    </button>
</div>