{{-- The theme and the navigation rail's width, decided before the first paint. Include it in , ahead of @vite. It reads the visitor's choice from localStorage (`livewire-material.theme.storage_key`): `light`, `dark` or `system`, falling back to `theme.default`. `system` follows the operating system, now and whenever it changes. The result is written to , which is the only thing the stylesheet keys on; the choice itself is , where `$store.theme` picks it up. A value under one of `theme.legacy_keys` — an earlier toggle's key, which may be JSON-encoded (maryUI's `"dark"`) — is adopted once and removed. Nothing is written for a visitor who never chose, so changing `theme.default` later reaches them too. The rail rides along for the theme's reason: is `expanded` or `collapsed` (`livewire-material.rail.storage_key`, falling back to `rail.default`), and a collapsible rail's width is CSS keyed on it (the `rail-collapsed:` variant). Set any later, a collapsed rail would paint wide and snap shut on every load. `$store.rail` (resources/js/navigation.js) changes it. wire:navigate swaps the body, merges the head without running this again, and gives the next page's attributes — which the server rendered without any of these, so Livewire removes them. They are put back as the new page is swapped in (`onSwap`, in the same task, before anything paints), so this only has to run on a full load. --}} @php $theme = config('livewire-material.theme'); $rail = config('livewire-material.rail'); $settings = [ 'default' => in_array($theme['default'] ?? null, ['light', 'dark', 'system'], true) ? $theme['default'] : 'system', 'key' => $theme['storage_key'] ?? 'material-theme', 'legacy' => array_values($theme['legacy_keys'] ?? []), 'rail' => [ 'default' => ($rail['default'] ?? null) === 'collapsed' ? 'collapsed' : 'expanded', 'key' => $rail['storage_key'] ?? 'material-rail', ], ]; @endphp