@weasel-js/theme 1.5.1 → 1.5.2

package/dist/engine.js

@@ -1,23 +1,13 @@
 import { ALPHA_EXT } from './chunk-PJMTWM34.js';
 import { mergeAxes, fullSelection, pick, enumerateSelections, resolveTokens, pickAll, themeAxes, isByAxis, selectionKey } from './chunk-LL2ERJPZ.js';
-import { srgbU8ToOklab, oklabToOklch, oklchToOklab, oklabToSrgbU8 } from '@weasel-js/paint';
+import { hexToOklchDeg, oklchDegToHex, srgbU8ToOklab } from '@weasel-js/paint';
 
-var clamp255 = (v) => Math.max(0, Math.min(255, Math.round(v)));
 function hexToRgb(hex) {
   const n = Number.parseInt(hex.slice(1), 16);
   return [n >> 16 & 255, n >> 8 & 255, n & 255];
 }
-function toHex(L, C, H) {
-  const [l, a, b] = oklchToOklab(L, C, H * Math.PI / 180);
-  const [r, g, bl] = oklabToSrgbU8(l, a, b);
-  return `#${[r, g, bl].map((v) => clamp255(v).toString(16).padStart(2, "0")).join("")}`;
-}
-function toLch(hex) {
-  const [r, g, b] = hexToRgb(hex);
-  const [L, A, B] = srgbU8ToOklab(r, g, b);
-  const [l, c, h] = oklabToOklch(L, A, B);
-  return { L: l, C: c, H: (h * 180 / Math.PI % 360 + 360) % 360 };
-}
+var toHex = oklchDegToHex;
+var toLch = hexToOklchDeg;
 function chromaCap(L, H) {
   return toLch(toHex(L, 0.5, H)).C;
 }
@@ -638,12 +628,19 @@ function categoricalRamp(steps, gates, anchors) {
 
 // src/engine/scales.ts
 function scale(steps, p) {
-  if (p.step === void 0 === (p.ratio === void 0)) {
-    throw new Error("A scale takes exactly one of `step` and `ratio`");
+  const rules = [p.step, p.ratio, p.factors].filter((r) => r !== void 0);
+  if (rules.length !== 1) {
+    throw new Error("A scale takes exactly one of `step`, `ratio` and `factors`");
+  }
+  if (p.factors && p.factors.length !== steps.length) {
+    throw new Error(`A scale needs one factor per step; got ${p.factors.length} for ${steps.length} steps`);
   }
   const out = {};
   steps.forEach((name, i) => {
-    const v = p.step !== void 0 ? p.base + p.step * i : p.base * p.ratio ** i;
+    let v;
+    if (p.factors !== void 0) v = p.base * p.factors[i];
+    else if (p.step !== void 0) v = p.base + p.step * i;
+    else v = p.base * p.ratio ** i;
     out[name] = `${Math.round(v)}px`;
   });
   return out;
@@ -865,7 +862,7 @@ var SEED_REF2 = /^\{seeds\.([\w-]+)\}$/;
 var REF = /^\{([^}]+)\}$/;
 var HEX2 = /^#[0-9a-f]{6}$/i;
 var UNTYPED = "unknown";
-var PARAMS = ["kind", "steps", "lightness", "curve", "hue", "chroma", "anchor", "gates", "anchors", "base", "step", "ratio"];
+var PARAMS = ["kind", "steps", "lightness", "curve", "hue", "chroma", "anchor", "gates", "anchors", "base", "step", "ratio", "factors"];
 var has = (o, key) => Object.hasOwn(o, key);
 function refName(value) {
   return typeof value === "string" ? REF.exec(value.trim())?.[1] : void 0;
@@ -925,6 +922,14 @@ var Reader = class {
   optNum(x, path, fallback) {
     return x === void 0 ? fallback : this.num(x, path);
   }
+  optNums(x, path) {
+    if (x === void 0) return void 0;
+    if (!Array.isArray(x)) {
+      this.fail(path, "expected an array of numbers");
+      return void 0;
+    }
+    return x.map((v, i) => this.num(v, `${path}.${i}`));
+  }
   record(x, path) {
     if (x === void 0) return {};
     if (typeof x === "object" && x !== null && !Array.isArray(x)) return x;
@@ -1003,9 +1008,11 @@ function scaleValues(name, s, steps, issues) {
   const base = read.num(s.base, `${path}.base`);
   const step = read.optNum(s.step, `${path}.step`);
   const ratio = read.optNum(s.ratio, `${path}.ratio`);
+  const factors = read.optNums(s.factors, `${path}.factors`);
   if (!read.ok) return void 0;
   try {
-    return { values: scale(steps, { base, step, ratio }), rule: step !== void 0 ? "linear" : "geometric" };
+    const rule = factors !== void 0 ? "factors" : step !== void 0 ? "linear" : "geometric";
+    return { values: scale(steps, { base, step, ratio, factors }), rule };
   } catch (e) {
     issues.push({ kind: "invalid", path, message: e.message });
     return void 0;
@@ -1511,7 +1518,6 @@ function emitCss(themes) {
 
 // src/engine/emit/dtcg.ts
 var REF3 = /^\{([^}.]+)\}$/;
-var modeOnly = (theme, what) => new Error(`DTCG export supports a mode axis only; ${theme} ${what}`);
 function toDTCG(theme) {
   const axes = themeAxes(theme);
   const typeOf = (name) => {
@@ -1536,21 +1542,33 @@ function toDTCG(theme) {
       ...t.alpha !== void 0 ? { $extensions: { [ALPHA_EXT]: t.alpha } } : {}
     };
   };
-  const branches = (name, v) => {
+  const flatten = (v) => {
+    if (!isByAxis(v)) return v;
+    if (v.by === "mode") {
+      const out = { by: "mode" };
+      for (const [mode, x] of Object.entries(v)) {
+        if (mode === "by") continue;
+        const inner = flatten(x);
+        if (inner !== void 0) out[mode] = inner;
+      }
+      return out;
+    }
+    const fallback = axes[v.by]?.default;
+    const chosen = fallback !== void 0 ? v[fallback] : void 0;
+    return chosen === void 0 ? void 0 : flatten(chosen);
+  };
+  const branches = (v) => {
     if (!isByAxis(v)) return [];
-    if (v.by !== "mode") throw modeOnly(`"${name}"`, `varies by ${v.by}`);
-    return Object.entries(v).flatMap(([mode, x]) => {
-      if (mode === "by") return [];
-      if (isByAxis(x)) throw modeOnly(`"${name}"`, `varies by ${x.by} inside mode`);
-      return [[mode, x]];
-    });
+    return Object.entries(v).flatMap(([mode, x]) => mode === "by" ? [] : [[mode, x]]);
   };
   const modes = {};
   for (const mode of Object.keys(axes.mode?.values ?? {})) modes[mode] = {};
   const primitives = {};
-  for (const [name, v] of Object.entries(theme.tokens)) {
+  for (const [name, raw] of Object.entries(theme.tokens)) {
+    const v = flatten(raw);
+    if (v === void 0) continue;
     if (!isByAxis(v)) put(primitives, name, v);
-    else for (const [mode, t] of branches(name, v)) put(modes[mode] ??= {}, name, t);
+    else for (const [mode, t] of branches(v)) put(modes[mode] ??= {}, name, t);
   }
   return { name: theme.name, ...axes.mode ? { defaultMode: axes.mode.default } : {}, primitives, modes };
 }
@@ -1587,6 +1605,12 @@ var TOKEN_HOOKS = [
     value: "9ch",
     description: "Width of a numeric field in the Properties panel."
   },
+  {
+    name: "prop-row-h",
+    type: "dimension",
+    value: "20px",
+    description: "Floor under every Properties row, whatever control it holds. Unset, it is the panel\u2019s own field height, so it follows density \u2014 20px at the default one."
+  },
   {
     name: "prop-text-width",
     type: "dimension",
@@ -1620,7 +1644,11 @@ var TOKEN_HOOKS = [
 ];
 
 // src/engine/emit/manifest.ts
-var groupOf = (name) => name.includes("-") ? name.slice(0, name.indexOf("-")) : name;
+var MERGED_GROUPS = { danger: "status", warning: "status", success: "status" };
+var groupOf = (name) => {
+  const prefix = name.includes("-") ? name.slice(0, name.indexOf("-")) : name;
+  return MERGED_GROUPS[prefix] ?? prefix;
+};
 var row = (name, type, value, description, hook) => `  { name: '--wzl-${name}', type: ${JSON.stringify(type)}, group: ${JSON.stringify(groupOf(name))}, defaultValue: ${JSON.stringify(value)}, description: ${JSON.stringify(description)}, hook: ${hook} },`;
 function emitManifest({ baked }) {
   const all = pickAll(baked.tokens, fullSelection(baked.axes, {}));