@ciridae/ui 0.7.0 → 0.7.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import { PALETTE_TOKEN_NAMES, canonicalPaletteSelection, derivePaletteTokens, paletteSelectionKey, resolvePaletteSelection, } from "../../lib/palette";
|
|
4
|
+
import { readStoredValue, removeStoredValue, writeStoredValue } from "../../lib/browser-storage";
|
|
4
5
|
import { ThemeContext, } from "./color-theme-context";
|
|
5
6
|
const defaultStorageKey = "ciridae-ui-theme";
|
|
6
7
|
const defaultPaletteStorageKey = "ciridae-ui-palette";
|
|
@@ -41,18 +42,18 @@ function ThemeProvider({ children, defaultMode = "system", defaultPalette, stora
|
|
|
41
42
|
}, []);
|
|
42
43
|
const setMode = React.useCallback((nextMode) => {
|
|
43
44
|
setModeState(nextMode);
|
|
44
|
-
|
|
45
|
+
writeStoredValue(storageKey, nextMode);
|
|
45
46
|
}, [storageKey]);
|
|
46
47
|
const toggleTheme = React.useCallback(() => {
|
|
47
48
|
setMode(resolvedTheme === "dark" ? "light" : "dark");
|
|
48
49
|
}, [resolvedTheme, setMode]);
|
|
49
50
|
const setPalette = React.useCallback((nextPalette) => {
|
|
50
51
|
setStoredPalette(nextPalette);
|
|
51
|
-
|
|
52
|
+
writeStoredValue(paletteStorageKey, JSON.stringify(nextPalette));
|
|
52
53
|
}, [paletteStorageKey]);
|
|
53
54
|
const resetPalette = React.useCallback(() => {
|
|
54
55
|
setStoredPalette(null);
|
|
55
|
-
|
|
56
|
+
removeStoredValue(paletteStorageKey);
|
|
56
57
|
}, [paletteStorageKey]);
|
|
57
58
|
const contextValue = React.useMemo(() => ({
|
|
58
59
|
mode,
|
|
@@ -104,9 +105,7 @@ function usePaletteTokens(palette, mode) {
|
|
|
104
105
|
}, [palette, mode]);
|
|
105
106
|
}
|
|
106
107
|
function readStoredMode(storageKey, defaultMode) {
|
|
107
|
-
|
|
108
|
-
return defaultMode;
|
|
109
|
-
const storedMode = localStorage.getItem(storageKey);
|
|
108
|
+
const storedMode = readStoredValue(storageKey);
|
|
110
109
|
if (storedMode === "light" || storedMode === "dark" || storedMode === "system") {
|
|
111
110
|
return storedMode;
|
|
112
111
|
}
|
|
@@ -117,9 +116,7 @@ function readStoredMode(storageKey, defaultMode) {
|
|
|
117
116
|
* deploys, so it outlives renamed presets and older shapes of the type.
|
|
118
117
|
*/
|
|
119
118
|
function readStoredPalette(storageKey) {
|
|
120
|
-
|
|
121
|
-
return null;
|
|
122
|
-
const raw = localStorage.getItem(storageKey);
|
|
119
|
+
const raw = readStoredValue(storageKey);
|
|
123
120
|
if (!raw)
|
|
124
121
|
return null;
|
|
125
122
|
try {
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* localStorage that cannot throw at its callers.
|
|
3
|
+
*
|
|
4
|
+
* Every access can raise: the API is absent during SSR, `getItem` throws when
|
|
5
|
+
* storage is disabled by policy or by Safari's private mode, and `setItem`
|
|
6
|
+
* throws on quota. A preference is worth remembering and never worth failing
|
|
7
|
+
* over, so each call degrades to "no stored value" and the caller keeps its
|
|
8
|
+
* in-memory state.
|
|
9
|
+
*/
|
|
10
|
+
declare function readStoredValue(key: string): string | null;
|
|
11
|
+
declare function writeStoredValue(key: string, value: string): void;
|
|
12
|
+
declare function removeStoredValue(key: string): void;
|
|
13
|
+
export { readStoredValue, removeStoredValue, writeStoredValue };
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* localStorage that cannot throw at its callers.
|
|
3
|
+
*
|
|
4
|
+
* Every access can raise: the API is absent during SSR, `getItem` throws when
|
|
5
|
+
* storage is disabled by policy or by Safari's private mode, and `setItem`
|
|
6
|
+
* throws on quota. A preference is worth remembering and never worth failing
|
|
7
|
+
* over, so each call degrades to "no stored value" and the caller keeps its
|
|
8
|
+
* in-memory state.
|
|
9
|
+
*/
|
|
10
|
+
function storage() {
|
|
11
|
+
try {
|
|
12
|
+
return typeof window === "undefined" ? null : window.localStorage;
|
|
13
|
+
}
|
|
14
|
+
catch {
|
|
15
|
+
// Accessing the property itself throws when storage is blocked by policy.
|
|
16
|
+
return null;
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
function readStoredValue(key) {
|
|
20
|
+
try {
|
|
21
|
+
return storage()?.getItem(key) ?? null;
|
|
22
|
+
}
|
|
23
|
+
catch {
|
|
24
|
+
return null;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
function writeStoredValue(key, value) {
|
|
28
|
+
try {
|
|
29
|
+
storage()?.setItem(key, value);
|
|
30
|
+
}
|
|
31
|
+
catch {
|
|
32
|
+
// Disabled or over quota: the preference lives for this session only.
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
function removeStoredValue(key) {
|
|
36
|
+
try {
|
|
37
|
+
storage()?.removeItem(key);
|
|
38
|
+
}
|
|
39
|
+
catch {
|
|
40
|
+
// Nothing to recover from -- the value either was not written or stays.
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
export { readStoredValue, removeStoredValue, writeStoredValue };
|