@pathscale/ui 1.1.30 → 1.1.31
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.
|
@@ -27,16 +27,16 @@ const ThemeColorPicker_ThemeColorPicker = (props)=>{
|
|
|
27
27
|
const [isOpen, setIsOpen] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(false);
|
|
28
28
|
const [featureAvailable, setFeatureAvailable] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(true);
|
|
29
29
|
let containerRef;
|
|
30
|
-
const store = (0,
|
|
31
|
-
const colorValue = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>hexToColorValue(store
|
|
30
|
+
const store = (0, __WEBPACK_EXTERNAL_MODULE__hueShift_js_ca4235e5__.createHueShiftStore)(local.storagePrefix ?? "theme");
|
|
31
|
+
const colorValue = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>hexToColorValue(store.themeColor()));
|
|
32
32
|
const handleColorChange = (color)=>{
|
|
33
33
|
const { s, l } = color.hsl;
|
|
34
34
|
if (s < 10 && l > 90) {
|
|
35
|
-
store
|
|
35
|
+
store.setThemeColor(null);
|
|
36
36
|
local.onColorChange?.(null, 100);
|
|
37
37
|
return;
|
|
38
38
|
}
|
|
39
|
-
store
|
|
39
|
+
store.setThemeColor(color.hex);
|
|
40
40
|
local.onColorChange?.(color.hsl.h, color.hsl.s);
|
|
41
41
|
};
|
|
42
42
|
const GRAYSCALE_SWATCHES = [
|
|
@@ -72,7 +72,7 @@ const ThemeColorPicker_ThemeColorPicker = (props)=>{
|
|
|
72
72
|
}
|
|
73
73
|
];
|
|
74
74
|
const handleGrayscale = (swatch)=>{
|
|
75
|
-
store
|
|
75
|
+
store.setThemeColor(null);
|
|
76
76
|
(0, __WEBPACK_EXTERNAL_MODULE__hueShift_js_ca4235e5__.resetHueShift)();
|
|
77
77
|
local.onColorChange?.(null, 0);
|
|
78
78
|
local.onThemeSwitch?.(swatch.theme);
|
|
@@ -141,7 +141,7 @@ const ThemeColorPicker_ThemeColorPicker = (props)=>{
|
|
|
141
141
|
width: 16,
|
|
142
142
|
height: 16,
|
|
143
143
|
get ["class"] () {
|
|
144
|
-
return null !== store
|
|
144
|
+
return null !== store.themeColor() ? "text-primary" : void 0;
|
|
145
145
|
}
|
|
146
146
|
});
|
|
147
147
|
}
|
|
@@ -126,9 +126,9 @@ function applyThemeColor(hex) {
|
|
|
126
126
|
const root = document.documentElement;
|
|
127
127
|
const content = pickContentColor(rgb.r, rgb.g, rgb.b);
|
|
128
128
|
const resolvedTheme = getResolvedTheme();
|
|
129
|
-
for (const varName of PRIMARY_VARS)root.style.setProperty(varName, hex);
|
|
130
|
-
for (const varName of CONTENT_VARS)root.style.setProperty(varName, content);
|
|
131
|
-
for (const { name, anchor, mix } of BACKGROUND_VARS[resolvedTheme])root.style.setProperty(name, `color-mix(in oklab, ${hex} ${mix}%, ${anchor})
|
|
129
|
+
for (const varName of PRIMARY_VARS)root.style.setProperty(varName, hex, "important");
|
|
130
|
+
for (const varName of CONTENT_VARS)root.style.setProperty(varName, content, "important");
|
|
131
|
+
for (const { name, anchor, mix } of BACKGROUND_VARS[resolvedTheme])root.style.setProperty(name, `color-mix(in oklab, ${hex} ${mix}%, ${anchor})`, "important");
|
|
132
132
|
}
|
|
133
133
|
function resetHueShift() {
|
|
134
134
|
if (!checkCspAllowsInlineStyles()) return;
|