@wordpress/theme 0.1.0 → 0.1.1-next.2f1c7c01b.0

package/build-module/color-ramps/lib/default-ramps.js

@@ -0,0 +1,196 @@
+// packages/theme/src/color-ramps/lib/default-ramps.ts
+var DEFAULT_RAMPS = {
+  bg: {
+    ramp: {
+      surface2: { color: "#f8f8f8", warning: false },
+      bgFill1: { color: "#555", warning: false },
+      fgFill: { color: "#f0f0f0", warning: false },
+      bgFill2: { color: "#474747", warning: false },
+      surface6: { color: "#d0d0d0", warning: false },
+      surface5: { color: "#dfdfdf", warning: false },
+      surface4: { color: "#eaeaea", warning: false },
+      surface3: { color: "#fff", warning: false },
+      fgSurface4: { color: "#1e1e1e", warning: false },
+      fgSurface3: { color: "#6d6d6d", warning: false },
+      fgSurface2: { color: "#898989", warning: false },
+      fgSurface1: { color: "#a9a9a9", warning: false },
+      stroke3: { color: "#898989", warning: false },
+      stroke4: { color: "#6a6a6a", warning: false },
+      stroke2: { color: "#adadad", warning: false },
+      stroke1: { color: "#d0d0d0", warning: false },
+      bgFillDark: { color: "#1e1e1e", warning: false },
+      fgFillDark: { color: "#f0f0f0", warning: false },
+      bgFillInverted2: { color: "#1e1e1e", warning: false },
+      bgFillInverted1: { color: "#2f2f2f", warning: false },
+      fgFillInverted: { color: "#f0f0f0", warning: false },
+      surface1: { color: "#f0f0f0", warning: false }
+    },
+    direction: "darker"
+  },
+  primary: {
+    ramp: {
+      bgFill1: { color: "#3858e9", warning: false },
+      fgFill: { color: "#eff0f2", warning: false },
+      bgFill2: { color: "#2c47d7", warning: false },
+      surface2: { color: "#f6f8fc", warning: false },
+      surface6: { color: "#c4d0ee", warning: false },
+      surface5: { color: "#d8e0f3", warning: false },
+      surface4: { color: "#e5eaf7", warning: false },
+      surface3: { color: "#fff", warning: false },
+      fgSurface4: { color: "#080071", warning: false },
+      fgSurface3: { color: "#3858e9", warning: false },
+      fgSurface2: { color: "#5780ff", warning: false },
+      fgSurface1: { color: "#81a7ff", warning: false },
+      stroke3: { color: "#3858e9", warning: false },
+      stroke4: { color: "#2236c7", warning: false },
+      stroke2: { color: "#6f85c0", warning: false },
+      stroke1: { color: "#92a4cf", warning: false },
+      bgFillDark: { color: "#1b1e26", warning: false },
+      fgFillDark: { color: "#eff0f2", warning: false },
+      bgFillInverted2: { color: "#1b1e26", warning: false },
+      bgFillInverted1: { color: "#1401a4", warning: false },
+      fgFillInverted: { color: "#eff0f2", warning: false },
+      surface1: { color: "#ecf0f9", warning: false }
+    },
+    direction: "darker"
+  },
+  info: {
+    ramp: {
+      bgFill1: { color: "#0090ff", warning: false },
+      fgFill: { color: "#1b1e23", warning: false },
+      bgFill2: { color: "#007eec", warning: false },
+      surface2: { color: "#f5f9fd", warning: false },
+      surface6: { color: "#bad3f0", warning: false },
+      surface5: { color: "#d1e1f5", warning: false },
+      surface4: { color: "#e1ecf8", warning: false },
+      surface3: { color: "#fff", warning: false },
+      fgSurface4: { color: "#001758", warning: false },
+      fgSurface3: { color: "#006cd8", warning: false },
+      fgSurface2: { color: "#008bfa", warning: false },
+      fgSurface1: { color: "#4dafff", warning: false },
+      stroke3: { color: "#006cd8", warning: false },
+      stroke4: { color: "#004bb5", warning: false },
+      stroke2: { color: "#5e90c7", warning: false },
+      stroke1: { color: "#8baed6", warning: false },
+      bgFillDark: { color: "#1b1e23", warning: false },
+      fgFillDark: { color: "#eff0f2", warning: false },
+      bgFillInverted2: { color: "#1b1e23", warning: false },
+      bgFillInverted1: { color: "#00297a", warning: false },
+      fgFillInverted: { color: "#eff0f2", warning: false },
+      surface1: { color: "#e9f1fa", warning: false }
+    },
+    direction: "darker"
+  },
+  success: {
+    ramp: {
+      bgFill1: { color: "#4ab866", warning: false },
+      fgFill: { color: "#1b1f1c", warning: false },
+      bgFill2: { color: "#34a554", warning: false },
+      surface2: { color: "#f0fcf2", warning: false },
+      surface6: { color: "#7be792", warning: false },
+      surface5: { color: "#acf0b7", warning: false },
+      surface4: { color: "#cdf5d3", warning: false },
+      surface3: { color: "#fff", warning: false },
+      fgSurface4: { color: "#002b00", warning: false },
+      fgSurface3: { color: "#008030", warning: false },
+      fgSurface2: { color: "#2a9e4d", warning: false },
+      fgSurface1: { color: "#52bf6d", warning: false },
+      stroke3: { color: "#008030", warning: false },
+      stroke4: { color: "#006113", warning: false },
+      stroke2: { color: "#62996c", warning: false },
+      stroke1: { color: "#78ba84", warning: false },
+      bgFillDark: { color: "#1b1f1c", warning: false },
+      fgFillDark: { color: "#edf2ed", warning: false },
+      bgFillInverted2: { color: "#1b1f1c", warning: false },
+      bgFillInverted1: { color: "#003a00", warning: false },
+      fgFillInverted: { color: "#edf2ed", warning: false },
+      surface1: { color: "#ddf8e0", warning: false }
+    },
+    direction: "darker"
+  },
+  caution: {
+    ramp: {
+      bgFill1: { color: "#f0d149", warning: false },
+      fgFill: { color: "#1f1e1b", warning: false },
+      bgFill2: { color: "#dabb2b", warning: false },
+      surface2: { color: "#fdf9e7", warning: false },
+      surface6: { color: "#e7d070", warning: false },
+      surface5: { color: "#f4e08c", warning: false },
+      surface4: { color: "#f8ebb6", warning: false },
+      surface3: { color: "#fff", warning: false },
+      fgSurface4: { color: "#291d00", warning: false },
+      fgSurface3: { color: "#866a00", warning: false },
+      fgSurface2: { color: "#a58700", warning: false },
+      fgSurface1: { color: "#c6a800", warning: false },
+      stroke3: { color: "#866a00", warning: false },
+      stroke4: { color: "#644e00", warning: false },
+      stroke2: { color: "#988d60", warning: false },
+      stroke1: { color: "#b8ab76", warning: false },
+      bgFillDark: { color: "#1f1e1b", warning: false },
+      fgFillDark: { color: "#f6f1da", warning: false },
+      bgFillInverted2: { color: "#1f1e1b", warning: false },
+      bgFillInverted1: { color: "#3d2d00", warning: false },
+      fgFillInverted: { color: "#f6f1da", warning: false },
+      surface1: { color: "#faf1cb", warning: false }
+    },
+    direction: "darker"
+  },
+  warning: {
+    ramp: {
+      bgFill1: { color: "#f0b849", warning: false },
+      fgFill: { color: "#1f1e1b", warning: false },
+      bgFill2: { color: "#dba430", warning: false },
+      surface2: { color: "#fdf7ee", warning: false },
+      surface6: { color: "#f0cb89", warning: false },
+      surface5: { color: "#f5ddb2", warning: false },
+      surface4: { color: "#f8e9cd", warning: false },
+      surface3: { color: "#fff", warning: false },
+      fgSurface4: { color: "#2f1800", warning: false },
+      fgSurface3: { color: "#966200", warning: false },
+      fgSurface2: { color: "#b58000", warning: false },
+      fgSurface1: { color: "#d7a02b", warning: false },
+      stroke3: { color: "#966200", warning: false },
+      stroke4: { color: "#724700", warning: false },
+      stroke2: { color: "#a08961", warning: false },
+      stroke1: { color: "#c2a777", warning: false },
+      bgFillDark: { color: "#1f1e1b", warning: false },
+      fgFillDark: { color: "#f3f0e9", warning: false },
+      bgFillInverted2: { color: "#1f1e1b", warning: false },
+      bgFillInverted1: { color: "#472900", warning: false },
+      fgFillInverted: { color: "#f3f0e9", warning: false },
+      surface1: { color: "#faefdb", warning: false }
+    },
+    direction: "darker"
+  },
+  error: {
+    ramp: {
+      bgFill1: { color: "#cc1818", warning: false },
+      fgFill: { color: "#f2efef", warning: false },
+      bgFill2: { color: "#b90000", warning: false },
+      surface2: { color: "#fdf6f5", warning: false },
+      surface6: { color: "#f5c5be", warning: false },
+      surface5: { color: "#f8d8d3", warning: false },
+      surface4: { color: "#fae6e2", warning: false },
+      surface3: { color: "#fff", warning: false },
+      fgSurface4: { color: "#4a0000", warning: false },
+      fgSurface3: { color: "#cc1818", warning: false },
+      fgSurface2: { color: "#f64b40", warning: false },
+      fgSurface1: { color: "#ff8070", warning: false },
+      stroke3: { color: "#cc1818", warning: false },
+      stroke4: { color: "#a40000", warning: false },
+      stroke2: { color: "#cd695d", warning: false },
+      stroke1: { color: "#dc9085", warning: false },
+      bgFillDark: { color: "#231c1b", warning: false },
+      fgFillDark: { color: "#f2efef", warning: false },
+      bgFillInverted2: { color: "#231c1b", warning: false },
+      bgFillInverted1: { color: "#6d0000", warning: false },
+      fgFillInverted: { color: "#f2efef", warning: false },
+      surface1: { color: "#fcecea", warning: false }
+    },
+    direction: "darker"
+  }
+};
+export {
+  DEFAULT_RAMPS
+};
+//# sourceMappingURL=default-ramps.js.map

package/build-module/color-ramps/lib/default-ramps.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/color-ramps/lib/default-ramps.ts"],
+  "sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { RampResult } from './types';\nimport type { DEFAULT_SEED_COLORS } from './constants';\n\nexport const DEFAULT_RAMPS: Record<\n\tkeyof typeof DEFAULT_SEED_COLORS,\n\tRampResult\n> = {\n\tbg: {\n\t\tramp: {\n\t\t\tsurface2: { color: '#f8f8f8', warning: false },\n\t\t\tbgFill1: { color: '#555', warning: false },\n\t\t\tfgFill: { color: '#f0f0f0', warning: false },\n\t\t\tbgFill2: { color: '#474747', warning: false },\n\t\t\tsurface6: { color: '#d0d0d0', warning: false },\n\t\t\tsurface5: { color: '#dfdfdf', warning: false },\n\t\t\tsurface4: { color: '#eaeaea', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#1e1e1e', warning: false },\n\t\t\tfgSurface3: { color: '#6d6d6d', warning: false },\n\t\t\tfgSurface2: { color: '#898989', warning: false },\n\t\t\tfgSurface1: { color: '#a9a9a9', warning: false },\n\t\t\tstroke3: { color: '#898989', warning: false },\n\t\t\tstroke4: { color: '#6a6a6a', warning: false },\n\t\t\tstroke2: { color: '#adadad', warning: false },\n\t\t\tstroke1: { color: '#d0d0d0', warning: false },\n\t\t\tbgFillDark: { color: '#1e1e1e', warning: false },\n\t\t\tfgFillDark: { color: '#f0f0f0', warning: false },\n\t\t\tbgFillInverted2: { color: '#1e1e1e', warning: false },\n\t\t\tbgFillInverted1: { color: '#2f2f2f', warning: false },\n\t\t\tfgFillInverted: { color: '#f0f0f0', warning: false },\n\t\t\tsurface1: { color: '#f0f0f0', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\tprimary: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#3858e9', warning: false },\n\t\t\tfgFill: { color: '#eff0f2', warning: false },\n\t\t\tbgFill2: { color: '#2c47d7', warning: false },\n\t\t\tsurface2: { color: '#f6f8fc', warning: false },\n\t\t\tsurface6: { color: '#c4d0ee', warning: false },\n\t\t\tsurface5: { color: '#d8e0f3', warning: false },\n\t\t\tsurface4: { color: '#e5eaf7', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#080071', warning: false },\n\t\t\tfgSurface3: { color: '#3858e9', warning: false },\n\t\t\tfgSurface2: { color: '#5780ff', warning: false },\n\t\t\tfgSurface1: { color: '#81a7ff', warning: false },\n\t\t\tstroke3: { color: '#3858e9', warning: false },\n\t\t\tstroke4: { color: '#2236c7', warning: false },\n\t\t\tstroke2: { color: '#6f85c0', warning: false },\n\t\t\tstroke1: { color: '#92a4cf', warning: false },\n\t\t\tbgFillDark: { color: '#1b1e26', warning: false },\n\t\t\tfgFillDark: { color: '#eff0f2', warning: false },\n\t\t\tbgFillInverted2: { color: '#1b1e26', warning: false },\n\t\t\tbgFillInverted1: { color: '#1401a4', warning: false },\n\t\t\tfgFillInverted: { color: '#eff0f2', warning: false },\n\t\t\tsurface1: { color: '#ecf0f9', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\tinfo: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#0090ff', warning: false },\n\t\t\tfgFill: { color: '#1b1e23', warning: false },\n\t\t\tbgFill2: { color: '#007eec', warning: false },\n\t\t\tsurface2: { color: '#f5f9fd', warning: false },\n\t\t\tsurface6: { color: '#bad3f0', warning: false },\n\t\t\tsurface5: { color: '#d1e1f5', warning: false },\n\t\t\tsurface4: { color: '#e1ecf8', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#001758', warning: false },\n\t\t\tfgSurface3: { color: '#006cd8', warning: false },\n\t\t\tfgSurface2: { color: '#008bfa', warning: false },\n\t\t\tfgSurface1: { color: '#4dafff', warning: false },\n\t\t\tstroke3: { color: '#006cd8', warning: false },\n\t\t\tstroke4: { color: '#004bb5', warning: false },\n\t\t\tstroke2: { color: '#5e90c7', warning: false },\n\t\t\tstroke1: { color: '#8baed6', warning: false },\n\t\t\tbgFillDark: { color: '#1b1e23', warning: false },\n\t\t\tfgFillDark: { color: '#eff0f2', warning: false },\n\t\t\tbgFillInverted2: { color: '#1b1e23', warning: false },\n\t\t\tbgFillInverted1: { color: '#00297a', warning: false },\n\t\t\tfgFillInverted: { color: '#eff0f2', warning: false },\n\t\t\tsurface1: { color: '#e9f1fa', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\tsuccess: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#4ab866', warning: false },\n\t\t\tfgFill: { color: '#1b1f1c', warning: false },\n\t\t\tbgFill2: { color: '#34a554', warning: false },\n\t\t\tsurface2: { color: '#f0fcf2', warning: false },\n\t\t\tsurface6: { color: '#7be792', warning: false },\n\t\t\tsurface5: { color: '#acf0b7', warning: false },\n\t\t\tsurface4: { color: '#cdf5d3', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#002b00', warning: false },\n\t\t\tfgSurface3: { color: '#008030', warning: false },\n\t\t\tfgSurface2: { color: '#2a9e4d', warning: false },\n\t\t\tfgSurface1: { color: '#52bf6d', warning: false },\n\t\t\tstroke3: { color: '#008030', warning: false },\n\t\t\tstroke4: { color: '#006113', warning: false },\n\t\t\tstroke2: { color: '#62996c', warning: false },\n\t\t\tstroke1: { color: '#78ba84', warning: false },\n\t\t\tbgFillDark: { color: '#1b1f1c', warning: false },\n\t\t\tfgFillDark: { color: '#edf2ed', warning: false },\n\t\t\tbgFillInverted2: { color: '#1b1f1c', warning: false },\n\t\t\tbgFillInverted1: { color: '#003a00', warning: false },\n\t\t\tfgFillInverted: { color: '#edf2ed', warning: false },\n\t\t\tsurface1: { color: '#ddf8e0', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\tcaution: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#f0d149', warning: false },\n\t\t\tfgFill: { color: '#1f1e1b', warning: false },\n\t\t\tbgFill2: { color: '#dabb2b', warning: false },\n\t\t\tsurface2: { color: '#fdf9e7', warning: false },\n\t\t\tsurface6: { color: '#e7d070', warning: false },\n\t\t\tsurface5: { color: '#f4e08c', warning: false },\n\t\t\tsurface4: { color: '#f8ebb6', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#291d00', warning: false },\n\t\t\tfgSurface3: { color: '#866a00', warning: false },\n\t\t\tfgSurface2: { color: '#a58700', warning: false },\n\t\t\tfgSurface1: { color: '#c6a800', warning: false },\n\t\t\tstroke3: { color: '#866a00', warning: false },\n\t\t\tstroke4: { color: '#644e00', warning: false },\n\t\t\tstroke2: { color: '#988d60', warning: false },\n\t\t\tstroke1: { color: '#b8ab76', warning: false },\n\t\t\tbgFillDark: { color: '#1f1e1b', warning: false },\n\t\t\tfgFillDark: { color: '#f6f1da', warning: false },\n\t\t\tbgFillInverted2: { color: '#1f1e1b', warning: false },\n\t\t\tbgFillInverted1: { color: '#3d2d00', warning: false },\n\t\t\tfgFillInverted: { color: '#f6f1da', warning: false },\n\t\t\tsurface1: { color: '#faf1cb', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\twarning: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#f0b849', warning: false },\n\t\t\tfgFill: { color: '#1f1e1b', warning: false },\n\t\t\tbgFill2: { color: '#dba430', warning: false },\n\t\t\tsurface2: { color: '#fdf7ee', warning: false },\n\t\t\tsurface6: { color: '#f0cb89', warning: false },\n\t\t\tsurface5: { color: '#f5ddb2', warning: false },\n\t\t\tsurface4: { color: '#f8e9cd', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#2f1800', warning: false },\n\t\t\tfgSurface3: { color: '#966200', warning: false },\n\t\t\tfgSurface2: { color: '#b58000', warning: false },\n\t\t\tfgSurface1: { color: '#d7a02b', warning: false },\n\t\t\tstroke3: { color: '#966200', warning: false },\n\t\t\tstroke4: { color: '#724700', warning: false },\n\t\t\tstroke2: { color: '#a08961', warning: false },\n\t\t\tstroke1: { color: '#c2a777', warning: false },\n\t\t\tbgFillDark: { color: '#1f1e1b', warning: false },\n\t\t\tfgFillDark: { color: '#f3f0e9', warning: false },\n\t\t\tbgFillInverted2: { color: '#1f1e1b', warning: false },\n\t\t\tbgFillInverted1: { color: '#472900', warning: false },\n\t\t\tfgFillInverted: { color: '#f3f0e9', warning: false },\n\t\t\tsurface1: { color: '#faefdb', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\terror: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#cc1818', warning: false },\n\t\t\tfgFill: { color: '#f2efef', warning: false },\n\t\t\tbgFill2: { color: '#b90000', warning: false },\n\t\t\tsurface2: { color: '#fdf6f5', warning: false },\n\t\t\tsurface6: { color: '#f5c5be', warning: false },\n\t\t\tsurface5: { color: '#f8d8d3', warning: false },\n\t\t\tsurface4: { color: '#fae6e2', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#4a0000', warning: false },\n\t\t\tfgSurface3: { color: '#cc1818', warning: false },\n\t\t\tfgSurface2: { color: '#f64b40', warning: false },\n\t\t\tfgSurface1: { color: '#ff8070', warning: false },\n\t\t\tstroke3: { color: '#cc1818', warning: false },\n\t\t\tstroke4: { color: '#a40000', warning: false },\n\t\t\tstroke2: { color: '#cd695d', warning: false },\n\t\t\tstroke1: { color: '#dc9085', warning: false },\n\t\t\tbgFillDark: { color: '#231c1b', warning: false },\n\t\t\tfgFillDark: { color: '#f2efef', warning: false },\n\t\t\tbgFillInverted2: { color: '#231c1b', warning: false },\n\t\t\tbgFillInverted1: { color: '#6d0000', warning: false },\n\t\t\tfgFillInverted: { color: '#f2efef', warning: false },\n\t\t\tsurface1: { color: '#fcecea', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n};\n"],
+  "mappings": "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",
+  "names": []
+}

package/build-module/color-ramps/lib/find-color-with-constraints.js

@@ -1,4 +1,6 @@
-import Color from "colorjs.io";
+// packages/theme/src/color-ramps/lib/find-color-with-constraints.ts
+import { get, OKLCH } from "colorjs.io/fn";
+import "./register-color-spaces";
 import { clampToGamut } from "./utils";
 import {
   WHITE,
@@ -6,38 +8,36 @@ import {
   LIGHTNESS_EPSILON,
   MAX_BISECTION_ITERATIONS
 } from "./constants";
-import { getCachedContrast } from "./cache-utils";
+import { getContrast } from "./color-utils";
 import { taperChroma } from "./taper-chroma";
 function findColorMeetingRequirements(reference, seed, target, direction, {
   lightnessConstraint,
   taperChromaOptions,
-  strict = true,
-  debug = false
+  strict = true
 } = {}) {
   if (target <= 1) {
-    return { color: seed.clone(), reached: true, achieved: 1 };
+    return { color: seed, reached: true, achieved: 1 };
   }
-  if (lightnessConstraint) {
-    let newL = lightnessConstraint.value;
-    let newC = seed.oklch.c;
+  function getColorForL(l) {
+    let newL = l;
+    let newC = get(seed, [OKLCH, "c"]);
     if (taperChromaOptions) {
-      ({ l: newL, c: newC } = taperChroma(
-        seed,
-        newL,
-        taperChromaOptions
-      ));
-    }
-    const colorWithExactL = clampToGamut(
-      new Color("oklch", [newL, newC, seed.oklch.h])
-    );
-    const exactLContrast = getCachedContrast(reference, colorWithExactL);
-    if (debug) {
-      console.log(
-        `Succeeded with ${lightnessConstraint.type} lightness`,
-        lightnessConstraint.value,
-        colorWithExactL.oklch.l
-      );
+      const tapered = taperChroma(seed, newL, taperChromaOptions);
+      if ("l" in tapered && "c" in tapered) {
+        newL = tapered.l;
+        newC = tapered.c;
+      } else {
+        return tapered;
+      }
     }
+    return clampToGamut({
+      spaceId: "oklch",
+      coords: [newL, newC, get(seed, [OKLCH, "h"])]
+    });
+  }
+  if (lightnessConstraint) {
+    const colorWithExactL = getColorForL(lightnessConstraint.value);
+    const exactLContrast = getContrast(reference, colorWithExactL);
     if (lightnessConstraint.type === "force" || exactLContrast >= target) {
       return {
         color: colorWithExactL,
@@ -48,62 +48,58 @@ function findColorMeetingRequirements(reference, seed, target, direction, {
   }
   const mostContrastingL = direction === "lighter" ? 1 : 0;
   const mostContrastingColor = direction === "lighter" ? WHITE : BLACK;
-  const highestPossibleContrast = getCachedContrast(
-    reference,
-    mostContrastingColor
-  );
-  if (highestPossibleContrast < target) {
+  const highestContrast = getContrast(reference, mostContrastingColor);
+  if (highestContrast < target) {
     if (strict) {
       throw new Error(
         `Contrast target ${target.toFixed(
           2
-        )}:1 unreachable in ${direction} direction against ${mostContrastingColor.toString()}(boundary achieves ${highestPossibleContrast.toFixed(
-          3
-        )}:1).`
-      );
-    }
-    if (debug) {
-      console.log(
-        "Did not succeeded because it reached the limit",
-        mostContrastingL
+        )}:1 unreachable in ${direction} direction(boundary achieves ${highestContrast.toFixed(3)}:1).`
       );
     }
     return {
       color: mostContrastingColor,
       reached: false,
-      achieved: highestPossibleContrast
+      achieved: highestContrast
     };
   }
-  let worseL = reference.oklch.l;
+  let worseL = get(reference, [OKLCH, "l"]);
+  let worseContrast = 1;
+  let replacedWorse = false;
   let betterL = mostContrastingL;
-  let bestContrastFound = highestPossibleContrast;
-  let resultingColor = mostContrastingColor;
-  for (let i = 0; i < MAX_BISECTION_ITERATIONS && Math.abs(betterL - worseL) > LIGHTNESS_EPSILON; i++) {
-    let newL = (worseL + betterL) / 2;
-    let newC = seed.oklch.c;
-    if (taperChromaOptions) {
-      ({ l: newL, c: newC } = taperChroma(
-        seed,
-        newL,
-        taperChromaOptions
-      ));
+  let betterContrast = highestContrast;
+  let replacedBetter = false;
+  let bestColor = mostContrastingColor;
+  let bestContrast = highestContrast;
+  for (let i = 0; i < MAX_BISECTION_ITERATIONS; i++) {
+    const newL = (worseL * (betterContrast - target) - betterL * (worseContrast - target)) / (betterContrast - worseContrast);
+    bestColor = getColorForL(newL);
+    bestContrast = getContrast(reference, bestColor);
+    if (Math.abs(bestContrast - target) <= LIGHTNESS_EPSILON) {
+      break;
     }
-    const newColor = clampToGamut(
-      new Color("oklch", [newL, newC, seed.oklch.h])
-    );
-    const newContrast = getCachedContrast(reference, newColor);
-    if (newContrast >= target) {
+    if (bestContrast >= target) {
       betterL = newL;
-      bestContrastFound = newContrast;
-      resultingColor = newColor;
+      betterContrast = bestContrast;
+      if (replacedBetter) {
+        worseContrast = (worseContrast + target) / 2;
+      }
+      replacedBetter = true;
+      replacedWorse = false;
     } else {
       worseL = newL;
+      worseContrast = bestContrast;
+      if (replacedWorse) {
+        betterContrast = (betterContrast + target) / 2;
+      }
+      replacedWorse = true;
+      replacedBetter = false;
     }
   }
   return {
-    color: resultingColor,
+    color: bestColor,
     reached: true,
-    achieved: bestContrastFound
+    achieved: bestContrast
   };
 }
 export {

package/build-module/color-ramps/lib/find-color-with-constraints.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/color-ramps/lib/find-color-with-constraints.ts"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport Color from 'colorjs.io';\n\n/**\n * Internal dependencies\n */\nimport { clampToGamut } from './utils';\nimport {\n\tWHITE,\n\tBLACK,\n\tLIGHTNESS_EPSILON,\n\tMAX_BISECTION_ITERATIONS,\n} from './constants';\nimport { getCachedContrast } from './cache-utils';\nimport { type TaperChromaOptions, taperChroma } from './taper-chroma';\n\n/**\n * Solve for L such that:\n *  - the L applied to the seed meets the contrast target against the reference\n *  - the search is performed in one direction (ie lighter / darker)\n *  - more constraints can be applied around lightness\n *  - chroma could be tapered\n * @param reference\n * @param seed\n * @param target\n * @param direction\n * @param options\n * @param options.strict\n * @param options.debug\n * @param options.lightnessConstraint\n * @param options.lightnessConstraint.type\n * @param options.lightnessConstraint.value\n * @param options.taperChromaOptions\n */\nexport function findColorMeetingRequirements(\n\treference: Color,\n\tseed: Color,\n\ttarget: number,\n\tdirection: 'lighter' | 'darker',\n\t{\n\t\tlightnessConstraint,\n\t\ttaperChromaOptions,\n\t\tstrict = true,\n\t\tdebug = false,\n\t}: {\n\t\tlightnessConstraint?: {\n\t\t\ttype: 'force' | 'onlyIfSucceeds';\n\t\t\tvalue: number;\n\t\t};\n\t\ttaperChromaOptions?: TaperChromaOptions;\n\t\tstrict?: boolean;\n\t\tdebug?: boolean;\n\t} = {}\n): { color: Color; reached: boolean; achieved: number } {\n\t// A target of 1 means same color.\n\t// A target lower than 1 doesn't make sense.\n\tif ( target <= 1 ) {\n\t\treturn { color: seed.clone(), reached: true, achieved: 1 };\n\t}\n\n\tif ( lightnessConstraint ) {\n\t\t// Apply a specific L value.\n\t\t// Useful when pinning a step to a specific lightness, of to specify\n\t\t// min/max L values.\n\t\tlet newL = lightnessConstraint.value;\n\t\tlet newC = seed.oklch.c;\n\n\t\tif ( taperChromaOptions ) {\n\t\t\t( { l: newL, c: newC } = taperChroma(\n\t\t\t\tseed,\n\t\t\t\tnewL,\n\t\t\t\ttaperChromaOptions\n\t\t\t) );\n\t\t}\n\n\t\tconst colorWithExactL = clampToGamut(\n\t\t\tnew Color( 'oklch', [ newL, newC, seed.oklch.h ] )\n\t\t);\n\t\tconst exactLContrast = getCachedContrast( reference, colorWithExactL );\n\n\t\tif ( debug ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.log(\n\t\t\t\t`Succeeded with ${ lightnessConstraint.type } lightness`,\n\t\t\t\tlightnessConstraint.value,\n\t\t\t\tcolorWithExactL.oklch.l\n\t\t\t);\n\t\t}\n\n\t\t// If the L constraint is of \"force\" type, apply it even when it doesn't\n\t\t// meet the contrast target.\n\t\tif (\n\t\t\tlightnessConstraint.type === 'force' ||\n\t\t\texactLContrast >= target\n\t\t) {\n\t\t\treturn {\n\t\t\t\tcolor: colorWithExactL,\n\t\t\t\treached: exactLContrast >= target,\n\t\t\t\tachieved: exactLContrast,\n\t\t\t};\n\t\t}\n\t}\n\n\t// Set the boundary based on the direction.\n\tconst mostContrastingL = direction === 'lighter' ? 1 : 0;\n\tconst mostContrastingColor = direction === 'lighter' ? WHITE : BLACK;\n\tconst highestPossibleContrast = getCachedContrast(\n\t\treference,\n\t\tmostContrastingColor\n\t);\n\n\t// If even the most contrasting color can't reach the target,\n\t// the target is unreachable.\n\tif ( highestPossibleContrast < target ) {\n\t\tif ( strict ) {\n\t\t\tthrow new Error(\n\t\t\t\t`Contrast target ${ target.toFixed(\n\t\t\t\t\t2\n\t\t\t\t) }:1 unreachable in ${ direction } direction against ${ mostContrastingColor.toString() }` +\n\t\t\t\t\t`(boundary achieves ${ highestPossibleContrast.toFixed(\n\t\t\t\t\t\t3\n\t\t\t\t\t) }:1).`\n\t\t\t);\n\t\t}\n\n\t\tif ( debug ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.log(\n\t\t\t\t'Did not succeeded because it reached the limit',\n\t\t\t\tmostContrastingL\n\t\t\t);\n\t\t}\n\t\treturn {\n\t\t\tcolor: mostContrastingColor,\n\t\t\treached: false,\n\t\t\tachieved: highestPossibleContrast,\n\t\t};\n\t}\n\n\t// Bracket: low fails, high meets.\n\t// Originally this was seed.oklch.l \u2014 although it's an assumption that works\n\t// only when we know for sure the direction of the search.\n\t// TODO: can we bring this back to seed.oklch.l ?\n\tlet worseL = reference.oklch.l;\n\tlet betterL = mostContrastingL;\n\n\tlet bestContrastFound = highestPossibleContrast;\n\tlet resultingColor = mostContrastingColor;\n\n\tfor (\n\t\tlet i = 0;\n\t\ti < MAX_BISECTION_ITERATIONS &&\n\t\tMath.abs( betterL - worseL ) > LIGHTNESS_EPSILON;\n\t\ti++\n\t) {\n\t\tlet newL = ( worseL + betterL ) / 2;\n\t\tlet newC = seed.oklch.c;\n\n\t\tif ( taperChromaOptions ) {\n\t\t\t( { l: newL, c: newC } = taperChroma(\n\t\t\t\tseed,\n\t\t\t\tnewL,\n\t\t\t\ttaperChromaOptions\n\t\t\t) );\n\t\t}\n\n\t\tconst newColor = clampToGamut(\n\t\t\tnew Color( 'oklch', [ newL, newC, seed.oklch.h ] )\n\t\t);\n\t\tconst newContrast = getCachedContrast( reference, newColor );\n\n\t\tif ( newContrast >= target ) {\n\t\t\tbetterL = newL;\n\t\t\t// Only update the resulting color when the target is met, this ensuring\n\t\t\t// at the end of the search the target is always met.\n\t\t\tbestContrastFound = newContrast;\n\t\t\tresultingColor = newColor;\n\t\t} else {\n\t\t\tworseL = newL;\n\t\t}\n\t}\n\n\treturn {\n\t\tcolor: resultingColor,\n\t\treached: true,\n\t\tachieved: bestContrastFound,\n\t};\n}\n"],
-  "mappings": "AAGA,OAAO,WAAW;AAKlB,SAAS,oBAAoB;AAC7B;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,yBAAyB;AAClC,SAAkC,mBAAmB;AAoB9C,SAAS,6BACf,WACA,MACA,QACA,WACA;AAAA,EACC;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,QAAQ;AACT,IAQI,CAAC,GACkD;AAGvD,MAAK,UAAU,GAAI;AAClB,WAAO,EAAE,OAAO,KAAK,MAAM,GAAG,SAAS,MAAM,UAAU,EAAE;AAAA,EAC1D;AAEA,MAAK,qBAAsB;AAI1B,QAAI,OAAO,oBAAoB;AAC/B,QAAI,OAAO,KAAK,MAAM;AAEtB,QAAK,oBAAqB;AACzB,OAAE,EAAE,GAAG,MAAM,GAAG,KAAK,IAAI;AAAA,QACxB;AAAA,QACA;AAAA,QACA;AAAA,MACD;AAAA,IACD;AAEA,UAAM,kBAAkB;AAAA,MACvB,IAAI,MAAO,SAAS,CAAE,MAAM,MAAM,KAAK,MAAM,CAAE,CAAE;AAAA,IAClD;AACA,UAAM,iBAAiB,kBAAmB,WAAW,eAAgB;AAErE,QAAK,OAAQ;AAEZ,cAAQ;AAAA,QACP,kBAAmB,oBAAoB,IAAK;AAAA,QAC5C,oBAAoB;AAAA,QACpB,gBAAgB,MAAM;AAAA,MACvB;AAAA,IACD;AAIA,QACC,oBAAoB,SAAS,WAC7B,kBAAkB,QACjB;AACD,aAAO;AAAA,QACN,OAAO;AAAA,QACP,SAAS,kBAAkB;AAAA,QAC3B,UAAU;AAAA,MACX;AAAA,IACD;AAAA,EACD;AAGA,QAAM,mBAAmB,cAAc,YAAY,IAAI;AACvD,QAAM,uBAAuB,cAAc,YAAY,QAAQ;AAC/D,QAAM,0BAA0B;AAAA,IAC/B;AAAA,IACA;AAAA,EACD;AAIA,MAAK,0BAA0B,QAAS;AACvC,QAAK,QAAS;AACb,YAAM,IAAI;AAAA,QACT,mBAAoB,OAAO;AAAA,UAC1B;AAAA,QACD,CAAE,qBAAsB,SAAU,sBAAuB,qBAAqB,SAAS,CAAE,sBACjE,wBAAwB;AAAA,UAC9C;AAAA,QACD,CAAE;AAAA,MACJ;AAAA,IACD;AAEA,QAAK,OAAQ;AAEZ,cAAQ;AAAA,QACP;AAAA,QACA;AAAA,MACD;AAAA,IACD;AACA,WAAO;AAAA,MACN,OAAO;AAAA,MACP,SAAS;AAAA,MACT,UAAU;AAAA,IACX;AAAA,EACD;AAMA,MAAI,SAAS,UAAU,MAAM;AAC7B,MAAI,UAAU;AAEd,MAAI,oBAAoB;AACxB,MAAI,iBAAiB;AAErB,WACK,IAAI,GACR,IAAI,4BACJ,KAAK,IAAK,UAAU,MAAO,IAAI,mBAC/B,KACC;AACD,QAAI,QAAS,SAAS,WAAY;AAClC,QAAI,OAAO,KAAK,MAAM;AAEtB,QAAK,oBAAqB;AACzB,OAAE,EAAE,GAAG,MAAM,GAAG,KAAK,IAAI;AAAA,QACxB;AAAA,QACA;AAAA,QACA;AAAA,MACD;AAAA,IACD;AAEA,UAAM,WAAW;AAAA,MAChB,IAAI,MAAO,SAAS,CAAE,MAAM,MAAM,KAAK,MAAM,CAAE,CAAE;AAAA,IAClD;AACA,UAAM,cAAc,kBAAmB,WAAW,QAAS;AAE3D,QAAK,eAAe,QAAS;AAC5B,gBAAU;AAGV,0BAAoB;AACpB,uBAAiB;AAAA,IAClB,OAAO;AACN,eAAS;AAAA,IACV;AAAA,EACD;AAEA,SAAO;AAAA,IACN,OAAO;AAAA,IACP,SAAS;AAAA,IACT,UAAU;AAAA,EACX;AACD;",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport { get, OKLCH, type ColorTypes } from 'colorjs.io/fn';\n\n/**\n * Internal dependencies\n */\nimport './register-color-spaces';\nimport { clampToGamut } from './utils';\nimport {\n\tWHITE,\n\tBLACK,\n\tLIGHTNESS_EPSILON,\n\tMAX_BISECTION_ITERATIONS,\n} from './constants';\nimport { getContrast } from './color-utils';\nimport { type TaperChromaOptions, taperChroma } from './taper-chroma';\n\n/**\n * Solve for L such that:\n *  - the L applied to the seed meets the contrast target against the reference\n *  - the search is performed in one direction (ie lighter / darker)\n *  - more constraints can be applied around lightness\n *  - chroma could be tapered\n * @param reference\n * @param seed\n * @param target\n * @param direction\n * @param options\n * @param options.strict\n * @param options.lightnessConstraint\n * @param options.lightnessConstraint.type\n * @param options.lightnessConstraint.value\n * @param options.taperChromaOptions\n */\nexport function findColorMeetingRequirements(\n\treference: ColorTypes,\n\tseed: ColorTypes,\n\ttarget: number,\n\tdirection: 'lighter' | 'darker',\n\t{\n\t\tlightnessConstraint,\n\t\ttaperChromaOptions,\n\t\tstrict = true,\n\t}: {\n\t\tlightnessConstraint?: {\n\t\t\ttype: 'force' | 'onlyIfSucceeds';\n\t\t\tvalue: number;\n\t\t};\n\t\ttaperChromaOptions?: TaperChromaOptions;\n\t\tstrict?: boolean;\n\t} = {}\n): { color: ColorTypes; reached: boolean; achieved: number } {\n\t// A target of 1 means same color.\n\t// A target lower than 1 doesn't make sense.\n\tif ( target <= 1 ) {\n\t\treturn { color: seed, reached: true, achieved: 1 };\n\t}\n\n\tfunction getColorForL( l: number ): ColorTypes {\n\t\tlet newL = l;\n\t\tlet newC = get( seed, [ OKLCH, 'c' ] );\n\n\t\tif ( taperChromaOptions ) {\n\t\t\tconst tapered = taperChroma( seed, newL, taperChromaOptions );\n\t\t\t// taperChroma returns either { l, c } or a ColorObject\n\t\t\tif ( 'l' in tapered && 'c' in tapered ) {\n\t\t\t\tnewL = tapered.l;\n\t\t\t\tnewC = tapered.c;\n\t\t\t} else {\n\t\t\t\t// It's already a ColorObject, return it directly\n\t\t\t\treturn tapered;\n\t\t\t}\n\t\t}\n\n\t\treturn clampToGamut( {\n\t\t\tspaceId: 'oklch',\n\t\t\tcoords: [ newL, newC, get( seed, [ OKLCH, 'h' ] ) ],\n\t\t} );\n\t}\n\n\tif ( lightnessConstraint ) {\n\t\t// Apply a specific L value.\n\t\t// Useful when pinning a step to a specific lightness, of to specify\n\t\t// min/max L values.\n\t\tconst colorWithExactL = getColorForL( lightnessConstraint.value );\n\t\tconst exactLContrast = getContrast( reference, colorWithExactL );\n\n\t\t// If the L constraint is of \"force\" type, apply it even when it doesn't\n\t\t// meet the contrast target.\n\t\tif (\n\t\t\tlightnessConstraint.type === 'force' ||\n\t\t\texactLContrast >= target\n\t\t) {\n\t\t\treturn {\n\t\t\t\tcolor: colorWithExactL,\n\t\t\t\treached: exactLContrast >= target,\n\t\t\t\tachieved: exactLContrast,\n\t\t\t};\n\t\t}\n\t}\n\n\t// Set the boundary based on the direction.\n\tconst mostContrastingL = direction === 'lighter' ? 1 : 0;\n\tconst mostContrastingColor = direction === 'lighter' ? WHITE : BLACK;\n\tconst highestContrast = getContrast( reference, mostContrastingColor );\n\n\t// If even the most contrasting color can't reach the target,\n\t// the target is unreachable.\n\tif ( highestContrast < target ) {\n\t\tif ( strict ) {\n\t\t\tthrow new Error(\n\t\t\t\t`Contrast target ${ target.toFixed(\n\t\t\t\t\t2\n\t\t\t\t) }:1 unreachable in ${ direction } direction` +\n\t\t\t\t\t`(boundary achieves ${ highestContrast.toFixed( 3 ) }:1).`\n\t\t\t);\n\t\t}\n\n\t\treturn {\n\t\t\tcolor: mostContrastingColor,\n\t\t\treached: false,\n\t\t\tachieved: highestContrast,\n\t\t};\n\t}\n\n\t// Bracket: low fails, high meets.\n\t// Originally this was seed.oklch.l \u2014 although it's an assumption that works\n\t// only when we know for sure the direction of the search.\n\t// TODO: can we bring this back to seed.oklch.l ?\n\tlet worseL = get( reference, [ OKLCH, 'l' ] );\n\tlet worseContrast = 1;\n\tlet replacedWorse = false;\n\tlet betterL = mostContrastingL;\n\tlet betterContrast = highestContrast;\n\tlet replacedBetter = false;\n\n\tlet bestColor: ColorTypes = mostContrastingColor;\n\tlet bestContrast = highestContrast;\n\n\tfor ( let i = 0; i < MAX_BISECTION_ITERATIONS; i++ ) {\n\t\t// Linear interpolation between worse and better L values, weighted by the contrast difference.\n\t\tconst newL =\n\t\t\t( worseL * ( betterContrast - target ) -\n\t\t\t\tbetterL * ( worseContrast - target ) ) /\n\t\t\t( betterContrast - worseContrast );\n\n\t\tbestColor = getColorForL( newL );\n\t\tbestContrast = getContrast( reference, bestColor );\n\n\t\tif ( Math.abs( bestContrast - target ) <= LIGHTNESS_EPSILON ) {\n\t\t\tbreak;\n\t\t}\n\n\t\t// Update one of the boundary L values, using the Illinois method.\n\t\tif ( bestContrast >= target ) {\n\t\t\tbetterL = newL;\n\t\t\tbetterContrast = bestContrast;\n\t\t\tif ( replacedBetter ) {\n\t\t\t\tworseContrast = ( worseContrast + target ) / 2;\n\t\t\t}\n\t\t\treplacedBetter = true;\n\t\t\treplacedWorse = false;\n\t\t} else {\n\t\t\tworseL = newL;\n\t\t\tworseContrast = bestContrast;\n\t\t\tif ( replacedWorse ) {\n\t\t\t\tbetterContrast = ( betterContrast + target ) / 2;\n\t\t\t}\n\t\t\treplacedWorse = true;\n\t\t\treplacedBetter = false;\n\t\t}\n\t}\n\n\treturn {\n\t\tcolor: bestColor,\n\t\treached: true,\n\t\tachieved: bestContrast,\n\t};\n}\n"],
+  "mappings": ";AAGA,SAAS,KAAK,aAA8B;AAK5C,OAAO;AACP,SAAS,oBAAoB;AAC7B;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,mBAAmB;AAC5B,SAAkC,mBAAmB;AAmB9C,SAAS,6BACf,WACA,MACA,QACA,WACA;AAAA,EACC;AAAA,EACA;AAAA,EACA,SAAS;AACV,IAOI,CAAC,GACuD;AAG5D,MAAK,UAAU,GAAI;AAClB,WAAO,EAAE,OAAO,MAAM,SAAS,MAAM,UAAU,EAAE;AAAA,EAClD;AAEA,WAAS,aAAc,GAAwB;AAC9C,QAAI,OAAO;AACX,QAAI,OAAO,IAAK,MAAM,CAAE,OAAO,GAAI,CAAE;AAErC,QAAK,oBAAqB;AACzB,YAAM,UAAU,YAAa,MAAM,MAAM,kBAAmB;AAE5D,UAAK,OAAO,WAAW,OAAO,SAAU;AACvC,eAAO,QAAQ;AACf,eAAO,QAAQ;AAAA,MAChB,OAAO;AAEN,eAAO;AAAA,MACR;AAAA,IACD;AAEA,WAAO,aAAc;AAAA,MACpB,SAAS;AAAA,MACT,QAAQ,CAAE,MAAM,MAAM,IAAK,MAAM,CAAE,OAAO,GAAI,CAAE,CAAE;AAAA,IACnD,CAAE;AAAA,EACH;AAEA,MAAK,qBAAsB;AAI1B,UAAM,kBAAkB,aAAc,oBAAoB,KAAM;AAChE,UAAM,iBAAiB,YAAa,WAAW,eAAgB;AAI/D,QACC,oBAAoB,SAAS,WAC7B,kBAAkB,QACjB;AACD,aAAO;AAAA,QACN,OAAO;AAAA,QACP,SAAS,kBAAkB;AAAA,QAC3B,UAAU;AAAA,MACX;AAAA,IACD;AAAA,EACD;AAGA,QAAM,mBAAmB,cAAc,YAAY,IAAI;AACvD,QAAM,uBAAuB,cAAc,YAAY,QAAQ;AAC/D,QAAM,kBAAkB,YAAa,WAAW,oBAAqB;AAIrE,MAAK,kBAAkB,QAAS;AAC/B,QAAK,QAAS;AACb,YAAM,IAAI;AAAA,QACT,mBAAoB,OAAO;AAAA,UAC1B;AAAA,QACD,CAAE,qBAAsB,SAAU,gCACV,gBAAgB,QAAS,CAAE,CAAE;AAAA,MACtD;AAAA,IACD;AAEA,WAAO;AAAA,MACN,OAAO;AAAA,MACP,SAAS;AAAA,MACT,UAAU;AAAA,IACX;AAAA,EACD;AAMA,MAAI,SAAS,IAAK,WAAW,CAAE,OAAO,GAAI,CAAE;AAC5C,MAAI,gBAAgB;AACpB,MAAI,gBAAgB;AACpB,MAAI,UAAU;AACd,MAAI,iBAAiB;AACrB,MAAI,iBAAiB;AAErB,MAAI,YAAwB;AAC5B,MAAI,eAAe;AAEnB,WAAU,IAAI,GAAG,IAAI,0BAA0B,KAAM;AAEpD,UAAM,QACH,UAAW,iBAAiB,UAC7B,WAAY,gBAAgB,YAC3B,iBAAiB;AAEpB,gBAAY,aAAc,IAAK;AAC/B,mBAAe,YAAa,WAAW,SAAU;AAEjD,QAAK,KAAK,IAAK,eAAe,MAAO,KAAK,mBAAoB;AAC7D;AAAA,IACD;AAGA,QAAK,gBAAgB,QAAS;AAC7B,gBAAU;AACV,uBAAiB;AACjB,UAAK,gBAAiB;AACrB,yBAAkB,gBAAgB,UAAW;AAAA,MAC9C;AACA,uBAAiB;AACjB,sBAAgB;AAAA,IACjB,OAAO;AACN,eAAS;AACT,sBAAgB;AAChB,UAAK,eAAgB;AACpB,0BAAmB,iBAAiB,UAAW;AAAA,MAChD;AACA,sBAAgB;AAChB,uBAAiB;AAAA,IAClB;AAAA,EACD;AAEA,SAAO;AAAA,IACN,OAAO;AAAA,IACP,SAAS;AAAA,IACT,UAAU;AAAA,EACX;AACD;",
   "names": []
 }

package/build-module/color-ramps/lib/index.js

@@ -1,5 +1,13 @@
-import Color from "colorjs.io";
-import { getCachedContrast, getColorString } from "./cache-utils";
+// packages/theme/src/color-ramps/lib/index.ts
+import {
+  clone,
+  get,
+  OKLCH,
+  parse,
+  set
+} from "colorjs.io/fn";
+import "./register-color-spaces";
+import { getContrast, getColorString } from "./color-utils";
 import { findColorMeetingRequirements } from "./find-color-with-constraints";
 import {
   clampToGamut,
@@ -14,8 +22,7 @@ function calculateRamp({
   config,
   mainDir,
   oppDir,
-  pinLightness,
-  debug = false
+  pinLightness
 }) {
   const rampResults = {};
   let SATISFIED_ALL_CONTRAST_REQUIREMENTS = true;
@@ -24,7 +31,7 @@ function calculateRamp({
   const calculatedColors = /* @__PURE__ */ new Map();
   calculatedColors.set("seed", seed);
   for (const stepName of sortedSteps) {
-    let computeDirection2 = function(color, followDirection) {
+    let computeDirection = function(color, followDirection) {
       if (followDirection === "main") {
         return mainDir;
       }
@@ -39,7 +46,6 @@ function calculateRamp({
       }
       return followDirection;
     };
-    var computeDirection = computeDirection2;
     const {
       contrast,
       lightness: stepLightnessConstraint,
@@ -55,7 +61,7 @@ function calculateRamp({
     if (sameAsIfPossible) {
       const candidateColor = calculatedColors.get(sameAsIfPossible);
       if (candidateColor) {
-        const candidateContrast = getCachedContrast(
+        const candidateContrast = getContrast(
           referenceColor,
           candidateColor
         );
@@ -70,7 +76,7 @@ function calculateRamp({
         }
       }
     }
-    const computedDir = computeDirection2(
+    const computedDir = computeDirection(
       referenceColor,
       contrast.followDirection
     );
@@ -95,14 +101,13 @@ function calculateRamp({
       {
         strict: false,
         lightnessConstraint,
-        taperChromaOptions,
-        debug
+        taperChromaOptions
       }
     );
     if (!searchResults.reached && !contrast.ignoreWhenAdjustingSeed) {
       SATISFIED_ALL_CONTRAST_REQUIREMENTS = false;
       const deficitVsTarget = adjustedTarget - searchResults.achieved;
-      const impactWeight = 1 / getCachedContrast(seed, referenceColor);
+      const impactWeight = 1 / getContrast(seed, referenceColor);
       const weightedDeficit = deficitVsTarget * impactWeight;
       if (weightedDeficit > MAX_WEIGHTED_DEFICIT) {
         MAX_WEIGHTED_DEFICIT = weightedDeficit;
@@ -124,12 +129,11 @@ function calculateRamp({
 function buildRamp(seedArg, config, {
   mainDirection,
   pinLightness,
-  debug = false,
   rescaleToFitContrastTargets = true
 } = {}) {
   let seed;
   try {
-    seed = clampToGamut(new Color(seedArg));
+    seed = clampToGamut(parse(seedArg));
   } catch (error) {
     throw new Error(
       `Invalid seed color "${seedArg}": ${error instanceof Error ? error.message : "Unknown error"}`
@@ -156,69 +160,38 @@ function buildRamp(seedArg, config, {
     config,
     mainDir,
     oppDir,
-    pinLightness,
-    debug
+    pinLightness
   });
   const toReturn = {
     ramp: rampResults,
     direction: mainDir
   };
-  if (debug) {
-    console.log(`First run`, {
-      SATISFIED_ALL_CONTRAST_REQUIREMENTS,
-      UNSATISFIED_DIRECTION,
-      seed: seed.toString(),
-      sortedSteps,
-      config,
-      mainDir,
-      oppDir,
-      pinLightness
-    });
-  }
   if (!SATISFIED_ALL_CONTRAST_REQUIREMENTS && rescaleToFitContrastTargets) {
-    let worseSeedL = seed.oklch.l;
+    let worseSeedL = get(seed, [OKLCH, "l"]);
     let betterSeedL = UNSATISFIED_DIRECTION === "lighter" ? 0 : 1;
     for (let i = 0; i < MAX_BISECTION_ITERATIONS && Math.abs(betterSeedL - worseSeedL) > LIGHTNESS_EPSILON; i++) {
       const newSeed = clampToGamut(
-        seed.clone().set({
-          l: (worseSeedL + betterSeedL) / 2
-        })
+        set(
+          clone(seed),
+          [OKLCH, "l"],
+          (worseSeedL + betterSeedL) / 2
+        )
       );
-      if (debug) {
-        console.log(`Iteration ${i}`, {
-          worseSeedL,
-          newSeedL: (worseSeedL + betterSeedL) / 2,
-          betterSeedL
-        });
-      }
       const iterationResults = calculateRamp({
         seed: newSeed,
         sortedSteps,
         config,
         mainDir,
         oppDir,
-        pinLightness,
-        debug
+        pinLightness
       });
       if (iterationResults.SATISFIED_ALL_CONTRAST_REQUIREMENTS) {
-        betterSeedL = newSeed.oklch.l;
+        betterSeedL = get(newSeed, [OKLCH, "l"]);
         toReturn.ramp = iterationResults.rampResults;
       } else if (UNSATISFIED_DIRECTION !== mainDir) {
-        betterSeedL = newSeed.oklch.l;
+        betterSeedL = get(newSeed, [OKLCH, "l"]);
       } else {
-        worseSeedL = newSeed.oklch.l;
-      }
-      if (debug) {
-        console.log(`Retry #${i}`, {
-          SATISFIED_ALL_CONTRAST_REQUIREMENTS,
-          UNSATISFIED_DIRECTION,
-          seed: newSeed.toString(),
-          sortedSteps,
-          config,
-          mainDir,
-          oppDir,
-          pinLightness
-        });
+        worseSeedL = get(newSeed, [OKLCH, "l"]);
       }
     }
   }