@scattered-light/loomiere 0.4.0 → 0.4.1

package/figma/library/tools/diff-snippet.js

@@ -0,0 +1,15 @@
+// Diffs units on a real page against the same units on its check page. tools/run.mjs --diff
+// sets PAGE, UNITS (['doc:Color/Text', 'set:Input', 'wrap:Input', ...]) and MAX.
+var F = await new (Object.getPrototypeOf(async function () {}).constructor)('figma', figma.root.getSharedPluginData('loomiere', 'fingerprint'))(figma);
+var PREFIX = figma.root.getSharedPluginData('loomiere', 'pagePrefix');
+async function unitNode(name, key) {
+  var pg = figma.root.children.filter(function (p) { return p.name === name; })[0]; await pg.loadAsync();
+  var kind = key.slice(0, key.indexOf(':')), rest = key.slice(key.indexOf(':') + 1).replace(/#\d+$/, '');
+  if (kind === 'set') return pg.findAll(function (n) { return (n.type === 'COMPONENT_SET' || (n.type === 'COMPONENT' && n.parent.type !== 'COMPONENT_SET')) && n.name === rest; })[0];
+  if (kind === 'doc') { var d = rest.split('/'), top = pg.children.filter(function (n) { return n.name === d[0].replace('(frame)', ''); })[0]; return d.length > 1 ? top.children.filter(function (n) { return n.name === d.slice(1).join('/'); })[0] : top; }
+  if (kind === 'wrap') return pg.children.filter(function (n) { return n.name === 'Components'; })[0].children.filter(function (n) { return n.name === rest; })[0];
+  return pg.children.filter(function (n) { return n.name === rest.replace('(shell)', ''); })[0];
+}
+var out = {};
+for (var i = 0; i < UNITS.length; i++) out[UNITS[i]] = await F.diff(await unitNode(PAGE, UNITS[i]), await unitNode(PREFIX + PAGE, UNITS[i]), MAX || 12);
+return out;

package/figma/library/tools/kit-script.mjs

@@ -0,0 +1,21 @@
+// Prints the use_figma script that stores the library kit in a file's shared plugin data, and
+// returns each stored part's length and hash, to compare with `node tools/kit-script.mjs --hashes`.
+import fs from 'node:fs';
+const kit = new URL('../kit/', import.meta.url);
+export const KEYS = { 'base.js': 'docHelpers', 'components.js': 'compHelpers', 'docs.js': 'docKit', 'fingerprint.js': 'fingerprint' };
+const h32 = (s) => { let h = 0x811c9dc5; for (let i = 0; i < s.length; i++) { h ^= s.charCodeAt(i); h = Math.imul(h, 0x01000193) >>> 0; } return h.toString(16).padStart(8, '0'); };
+const read = (file) => fs.readFileSync(new URL(file, kit), 'utf8');
+if (process.argv.includes('--hashes')) {
+  console.log(JSON.stringify(Object.fromEntries(Object.entries(KEYS).map(([f, k]) => [k, `${read(f).length} ${h32(read(f))}`]))));
+} else {
+  // --only docHelpers,docKit stores just those parts.
+  const only = process.argv.includes('--only') ? process.argv[process.argv.indexOf('--only') + 1].split(',') : null;
+  let out = '';
+  for (const [file, key] of Object.entries(KEYS)) {
+    if (only && !only.includes(key)) continue;
+    out += `figma.root.setSharedPluginData('loomiere', '${key}', ${JSON.stringify(read(file))});\n`;
+  }
+  out += `function h32(s) { var h = 0x811c9dc5; for (var i = 0; i < s.length; i++) { h ^= s.charCodeAt(i); h = Math.imul(h, 0x01000193) >>> 0; } return ('0000000' + h.toString(16)).slice(-8); }\n`;
+  out += `var out = {}; ${JSON.stringify(Object.values(KEYS))}.forEach(function (k) { var t = figma.root.getSharedPluginData('loomiere', k); out[k] = t.length + ' ' + h32(t); }); return out;\n`;
+  process.stdout.write(out);
+}

package/figma/library/tools/run.mjs

@@ -0,0 +1,27 @@
+// Bundles page scripts into one use_figma script, under its 50,000-character limit.
+//   node tools/run.mjs [--store all|docHelpers,...] [--check|--real] [--diff Page=unit,unit] [--units Page] pages/...js ...
+// --store writes the kit first (needed once per file, and after a kit change).
+// --check builds on "✱ check / " pages beside the real ones; --real builds the real pages.
+// --diff compares units on the real page with the check page; --units returns a page's fingerprints
+// for tools/compare.mjs.
+import fs from 'node:fs';
+import { execFileSync } from 'node:child_process';
+const lib = new URL('../', import.meta.url);
+const args = process.argv.slice(2), files = [], opt = {};
+for (let i = 0; i < args.length; i++) {
+  if (!args[i].startsWith('--')) files.push(args[i]);
+  else opt[args[i].slice(2)] = ['check', 'real'].includes(args[i].slice(2)) ? true : args[++i];
+}
+let out = 'var __out = {};\n';
+if (opt.store) out += execFileSync('node', [new URL('tools/kit-script.mjs', lib).pathname, ...(opt.store === 'all' ? [] : ['--only', opt.store])], { encoding: 'utf8' }).replace(/^var out = .*$/m, '') + '\n';
+if (opt.check) out += "figma.root.setSharedPluginData('loomiere', 'pagePrefix', '✱ check / ');\n";
+if (opt.real) out += "figma.root.setSharedPluginData('loomiere', 'pagePrefix', '');\n";
+for (const f of files) out += `__out[${JSON.stringify(f)}] = await (async function () {\n${fs.readFileSync(new URL(f, lib), 'utf8')}\n})();\n`;
+if (opt.diff) {
+  const [page, units] = opt.diff.split('=');
+  out += `__out.diff = await (async function (PAGE, UNITS, MAX) {\n${fs.readFileSync(new URL('tools/diff-snippet.js', lib), 'utf8')}\n})(${JSON.stringify(page)}, ${JSON.stringify(units.split(','))}, ${Number(opt.max) || 12});\n`;
+}
+if (opt.units) out += `__out.units = await (async function () { var F = await new (Object.getPrototypeOf(async function () {}).constructor)('figma', figma.root.getSharedPluginData('loomiere', 'fingerprint'))(figma); var pg = figma.root.children.filter(function (p) { return p.name === (figma.root.getSharedPluginData('loomiere', 'pagePrefix') || '') + ${JSON.stringify(opt.units)}; })[0]; await figma.setCurrentPageAsync(pg); return await F.units(); })();\n`;
+out += 'return __out;\n';
+if (out.length > 50000) throw new Error(`Bundle is ${out.length} characters; use_figma takes 50,000. Split it.`);
+process.stdout.write(out);

package/figma/library/tools/runs.mjs

@@ -0,0 +1,34 @@
+// Packs run-order.json into as few use_figma scripts as fit under 50,000 characters each, and
+// writes them to a folder, numbered in the order to run them.
+//   node tools/runs.mjs [--real|--check] [--store] [--pages Fields,Buttons] [--out dir]
+// --real builds the real pages (the default); --check builds "✱ check / " pages to compare.
+// --store puts the kit store first (a new file, or after a kit change).
+// --pages keeps only the steps for those pages, in run order, for patching a few pages.
+import fs from 'node:fs';
+import { execFileSync } from 'node:child_process';
+const lib = new URL('../', import.meta.url);
+const args = process.argv.slice(2), opt = {};
+for (let i = 0; i < args.length; i++) opt[args[i].slice(2)] = ['real', 'check', 'store'].includes(args[i].slice(2)) ? true : args[++i];
+const { steps } = JSON.parse(fs.readFileSync(new URL('run-order.json', lib), 'utf8'));
+const want = opt.pages ? opt.pages.split(',') : null;
+const files = steps.filter((s) => !want || want.includes(s.page)).flatMap((s) => s.files);
+const run = (list, extra) => execFileSync('node', [new URL('tools/run.mjs', lib).pathname, opt.check ? '--check' : '--real', ...extra, ...list], { encoding: 'utf8', stdio: ['ignore', 'pipe', 'ignore'] });
+const out = new URL((opt.out || 'runs').replace(/\/?$/, '/'), lib);
+fs.rmSync(out, { recursive: true, force: true }); fs.mkdirSync(out, { recursive: true });
+const bundles = [];
+if (opt.store) bundles.push({ files: ['kit'], text: run([], ['--store', 'all']) });
+let group = [];
+for (const f of files) {
+  const next = [...group, f];
+  let ok = true;
+  try { run(next, []); } catch { ok = false; }
+  if (ok) { group = next; continue; }
+  if (!group.length) throw new Error(`${f} alone is over the limit; split it.`);
+  bundles.push({ files: group, text: run(group, []) }); group = [f];
+}
+if (group.length) bundles.push({ files: group, text: run(group, []) });
+bundles.forEach((b, i) => {
+  const name = `run-${String(i + 1).padStart(2, '0')}.js`;
+  fs.writeFileSync(new URL(name, out), b.text);
+  console.log(`${name}  ${String(b.text.length).padStart(6)}  ${b.files.join(' ')}`);
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scattered-light/loomiere",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "description": "Turns a small brand file into a full design token theme: OKLCH color ramps, a type scale, light, dark and high-contrast modes, plus Tailwind, MUI, Chakra, AG Grid and Figma exports.",
   "keywords": ["design-tokens", "theme", "style-dictionary", "dtcg", "oklch", "base-ui", "ag-grid", "tailwind"],
   "repository": {