feat(centralui): dark-mode toggle + localStorage persistence + SSR pre-hydration (T34b)

2026-06-18 20:09:00 -04:00
parent 0449c473c1
commit fef4d4cf83
5 changed files with 189 additions and 0 deletions
@@ -0,0 +1,32 @@
+// Dark-mode theme helper (T34b). Plain browser global in the treeview-storage.js
+// style (no ES-module export) so the App.razor <head> pre-hydration inline
+// script and this file agree on one localStorage key and one apply rule.
+//
+//   * get()    — reads the persisted choice ('dark' only when explicitly stored;
+//                anything else is 'light').
+//   * apply()  — sets data-bs-theme on <html>; the site.css [data-bs-theme="dark"]
+//                token-override block (T34a) does the rest, side-rail included.
+//   * set()    — persists + applies, returns the mode.
+//   * toggle() — flips and persists, returns the new mode (the DarkModeToggle
+//                component's click path).
+//
+// Every localStorage touch is wrapped in try/catch so private-browsing modes
+// (which throw on access) degrade to light rather than break the page.
+window.sbTheme = {
+    KEY: 'sb-theme',
+    get() {
+        try { return localStorage.getItem(this.KEY) === 'dark' ? 'dark' : 'light'; }
+        catch { return 'light'; }
+    },
+    apply(mode) {
+        document.documentElement.setAttribute('data-bs-theme', mode);
+    },
+    set(mode) {
+        try { localStorage.setItem(this.KEY, mode); } catch { }
+        this.apply(mode);
+        return mode;
+    },
+    toggle() {
+        return this.set(this.get() === 'dark' ? 'light' : 'dark');
+    }
+};