@pathscale/ui 1.1.15 → 1.1.16

package/dist/components/colorpicker/ColorWheelFlower.js

@@ -107,8 +107,7 @@ const hueDistance = (a, b)=>{
 const isNearColor = (color, item)=>{
     const hueDelta = hueDistance(color.hsl.h, item.hue);
     const saturationDelta = Math.abs(color.hsl.s - item.saturation);
-    const lightnessDelta = Math.abs(color.hsl.l - item.lightness);
-    return hueDelta <= 2 && saturationDelta <= 2 && lightnessDelta <= 2;
+    return hueDelta <= 5 && saturationDelta <= 15;
 };
 const LAYOUT = [
     {
@@ -419,7 +418,7 @@ const ColorWheelFlower = (props)=>{
             const hueDelta = hueDistance(current.hsl.h, item.hue);
             const saturationDelta = Math.abs(current.hsl.s - item.saturation);
             const lightnessDelta = Math.abs(current.hsl.l - item.lightness);
-            const score = 1.4 * hueDelta + 0.8 * saturationDelta + 0.55 * lightnessDelta;
+            const score = 2.0 * hueDelta + +saturationDelta + 0.1 * lightnessDelta;
             if (score < bestScore) {
                 bestScore = score;
                 closest = index;

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

@@ -17,58 +17,11 @@ const checkCspAllowsInlineStyles = ()=>{
     return cspAllowsInlineStyles;
 };
 const MIN_CHROMA_SCALE = 0.3;
-function hslHueToOklchHue(hslHue) {
-    const h = (hslHue % 360 + 360) % 360;
-    const controlPoints = [
-        [
-            0,
-            29
-        ],
-        [
-            30,
-            55
-        ],
-        [
-            60,
-            100
-        ],
-        [
-            120,
-            145
-        ],
-        [
-            180,
-            195
-        ],
-        [
-            240,
-            265
-        ],
-        [
-            300,
-            330
-        ],
-        [
-            360,
-            389
-        ]
-    ];
-    for(let i = 0; i < controlPoints.length - 1; i++){
-        const [h1, o1] = controlPoints[i];
-        const [h2, o2] = controlPoints[i + 1];
-        if (h >= h1 && h <= h2) {
-            const t = (h - h1) / (h2 - h1);
-            const oklchHue = o1 + t * (o2 - o1);
-            return (oklchHue % 360 + 360) % 360;
-        }
-    }
-    return h;
-}
 const PRIMARY_SETTINGS = {
     light: {
         "--color-primary": {
-            l: 45,
-            c: 0.2
+            l: 58,
+            c: 0.22
         },
         "--color-primary-content": {
             l: 98,
@@ -77,12 +30,12 @@ const PRIMARY_SETTINGS = {
     },
     dark: {
         "--color-primary": {
-            l: 58,
-            c: 0.233
+            l: 75,
+            c: 0.18
         },
         "--color-primary-content": {
-            l: 96,
-            c: 0.018
+            l: 15,
+            c: 0.02
         }
     }
 };
@@ -101,8 +54,8 @@ const HARMONY_SETTINGS = {
             c: 0.026
         },
         "--color-accent": {
-            l: 60,
-            c: 0.118
+            l: 62,
+            c: 0.14
         },
         "--color-accent-content": {
             l: 98,
@@ -111,19 +64,19 @@ const HARMONY_SETTINGS = {
     },
     dark: {
         "--color-secondary": {
-            l: 63,
-            c: 0.237
+            l: 72,
+            c: 0.16
         },
         "--color-secondary-content": {
-            l: 97,
+            l: 15,
             c: 0.013
         },
         "--color-accent": {
-            l: 70,
-            c: 0.14
+            l: 78,
+            c: 0.12
         },
         "--color-accent-content": {
-            l: 98,
+            l: 15,
             c: 0.014
         }
     }
@@ -208,16 +161,16 @@ const SEMANTIC_SETTINGS = {
 const NF_ACCENT_SETTINGS = {
     light: {
         "--nf-accent": {
-            l: 45,
-            c: 0.2
+            l: 58,
+            c: 0.22
         },
         "--nf-on-accent": {
             l: 98,
             c: 0.02
         },
         "--color-nf-accent": {
-            l: 45,
-            c: 0.2
+            l: 58,
+            c: 0.22
         },
         "--color-nf-on-accent": {
             l: 98,
@@ -226,20 +179,20 @@ const NF_ACCENT_SETTINGS = {
     },
     dark: {
         "--nf-accent": {
-            l: 58,
-            c: 0.233
+            l: 75,
+            c: 0.18
         },
         "--nf-on-accent": {
-            l: 96,
-            c: 0.018
+            l: 15,
+            c: 0.02
         },
         "--color-nf-accent": {
-            l: 58,
-            c: 0.233
+            l: 75,
+            c: 0.18
         },
         "--color-nf-on-accent": {
-            l: 96,
-            c: 0.018
+            l: 15,
+            c: 0.02
         }
     }
 };
@@ -364,7 +317,7 @@ function getResolvedTheme() {
 function applyHueShift(targetHue, saturation = 100, lightnessOffset = 0) {
     if (!checkCspAllowsInlineStyles()) return;
     const root = document.documentElement;
-    const oklchHue = hslHueToOklchHue(targetHue);
+    const oklchHue = (targetHue % 360 + 360) % 360;
     const chromaScale = 0 === saturation ? 0 : MIN_CHROMA_SCALE + saturation / 100 * (1 - MIN_CHROMA_SCALE);
     const resolvedTheme = getResolvedTheme();
     const clampL = (l)=>Math.max(0, Math.min(100, l + lightnessOffset));

package/package.json

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