@pathscale/ui 1.1.29 → 1.1.31

package/dist/components/theme-color-picker/ThemeColorPicker.js

@@ -27,52 +27,53 @@ const ThemeColorPicker_ThemeColorPicker = (props)=>{
     const [isOpen, setIsOpen] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(false);
     const [featureAvailable, setFeatureAvailable] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(true);
     let containerRef;
-    const store = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE__hueShift_js_ca4235e5__.createHueShiftStore)(local.storagePrefix ?? "theme"));
-    const colorValue = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>hexToColorValue(store().themeColor()));
+    const store = (0, __WEBPACK_EXTERNAL_MODULE__hueShift_js_ca4235e5__.createHueShiftStore)(local.storagePrefix ?? "theme");
+    const colorValue = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>hexToColorValue(store.themeColor()));
     const handleColorChange = (color)=>{
         const { s, l } = color.hsl;
         if (s < 10 && l > 90) {
-            store().setThemeColor(null);
+            store.setThemeColor(null);
             local.onColorChange?.(null, 100);
             return;
         }
-        store().setThemeColor(color.hex);
+        store.setThemeColor(color.hex);
         local.onColorChange?.(color.hsl.h, color.hsl.s);
     };
     const GRAYSCALE_SWATCHES = [
         {
             label: "White",
             hex: "#fafafa",
-            theme: "light"
+            theme: "dark"
         },
         {
             label: "Light gray",
             hex: "#d4d4d4",
-            theme: "light"
+            theme: "dark"
         },
         {
             label: "Gray",
             hex: "#737373",
-            theme: "light"
+            theme: "dark"
         },
         {
             label: "Dark gray",
             hex: "#404040",
-            theme: "dark"
+            theme: "light"
         },
         {
             label: "Charcoal",
             hex: "#262626",
-            theme: "dark"
+            theme: "light"
         },
         {
             label: "Black",
             hex: "#0a0a0a",
-            theme: "dark"
+            theme: "light"
         }
     ];
     const handleGrayscale = (swatch)=>{
-        store().setThemeColor(swatch.hex);
+        store.setThemeColor(null);
+        (0, __WEBPACK_EXTERNAL_MODULE__hueShift_js_ca4235e5__.resetHueShift)();
         local.onColorChange?.(null, 0);
         local.onThemeSwitch?.(swatch.theme);
     };
@@ -140,7 +141,7 @@ const ThemeColorPicker_ThemeColorPicker = (props)=>{
                         width: 16,
                         height: 16,
                         get ["class"] () {
-                            return null !== store().themeColor() ? "text-primary" : void 0;
+                            return null !== store.themeColor() ? "text-primary" : void 0;
                         }
                     });
                 }

package/dist/components/theme-color-picker/hueShift.js

@@ -126,9 +126,9 @@ function applyThemeColor(hex) {
     const root = document.documentElement;
     const content = pickContentColor(rgb.r, rgb.g, rgb.b);
     const resolvedTheme = getResolvedTheme();
-    for (const varName of PRIMARY_VARS)root.style.setProperty(varName, hex);
-    for (const varName of CONTENT_VARS)root.style.setProperty(varName, content);
-    for (const { name, anchor, mix } of BACKGROUND_VARS[resolvedTheme])root.style.setProperty(name, `color-mix(in oklab, ${hex} ${mix}%, ${anchor})`);
+    for (const varName of PRIMARY_VARS)root.style.setProperty(varName, hex, "important");
+    for (const varName of CONTENT_VARS)root.style.setProperty(varName, content, "important");
+    for (const { name, anchor, mix } of BACKGROUND_VARS[resolvedTheme])root.style.setProperty(name, `color-mix(in oklab, ${hex} ${mix}%, ${anchor})`, "important");
 }
 function resetHueShift() {
     if (!checkCspAllowsInlineStyles()) return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pathscale/ui",
-  "version": "1.1.29",
+  "version": "1.1.31",
   "author": "pathscale",
   "repository": {
     "type": "git",