@trops/dash-react 1.0.58 → 1.0.59

package/dist/index.js

@@ -1166,18 +1166,32 @@ function deriveShades(hex) {
     s = _rgbToHsl.s,
     l = _rgbToHsl.l;
   var baseL = l < 0.2 || l > 0.8 ? 0.5 : l;
+  // Anchor every stop to the input's lightness so the scale always darkens
+  // 50 → 950 with the input at 500. Lighter stops sit a fixed fraction of
+  // the way from the input up to near-white; darker stops a fixed fraction
+  // of the way down to near-black. (Fixed absolute targets put light inputs
+  // above 400 and dark inputs below 600 — an inverted scale.) For a
+  // mid-lightness input (0.5) these land close to the previous curve.
+  var LIGHTEST = 0.975;
+  var DARKEST = 0.03;
+  var lighter = function lighter(f) {
+    return baseL + (LIGHTEST - baseL) * f;
+  };
+  var darker = function darker(f) {
+    return baseL - (baseL - DARKEST) * f;
+  };
   var targets = {
-    50: 0.96,
-    100: 0.9,
-    200: 0.8,
-    300: 0.68,
-    400: 0.55,
+    50: lighter(0.96),
+    100: lighter(0.85),
+    200: lighter(0.66),
+    300: lighter(0.45),
+    400: lighter(0.22),
     500: baseL,
-    600: 0.42,
-    700: 0.32,
-    800: 0.22,
-    900: 0.13,
-    950: 0.08
+    600: darker(0.14),
+    700: darker(0.28),
+    800: darker(0.48),
+    900: darker(0.7),
+    950: darker(0.9)
   };
   // Slight saturation curve: lighter shades fade saturation toward
   // white-ish; darker shades fade toward black-ish. Mirrors how