@massimo-cassandro/minimo 1.33.7 → 1.35.0

package/{design-tokens/utilities → dev-tools/design-tokens-builder}/build-tokens-src/formats/json.mjs

@@ -216,20 +216,25 @@ export const collectConcreteFilePaths = async (sd) => {
 // @param {string|null}                    jsonDestFile       Aggregated file base name, or null
 // @param {'json'|'jsonc'}                 jsonFormat         Output format
 // @param {'keep'|'calc'|'resolve'}        jsonExpression     Expression handling mode
+// @param {string}                         [suffix]           Appended to every destination
+//   filename, before the extension — used by the sourceModes build
+//   (build-source-modes.mjs) to produce one set of files per mode, e.g.
+//   "-light" -> "tokens-light.jsonc" / "size-light.jsonc" (default: '')
 // @returns {object[]}  File descriptors for the Style Dictionary platform
 
 export const buildJsonFiles = (
   concreteFilePaths,
   jsonDestFile,
   jsonFormat = 'json',
-  jsonExpression = 'keep'
+  jsonExpression = 'keep',
+  suffix = ''
 ) => {
   const ext  = jsonFormat === 'jsonc' ? '.jsonc' : '.json';
   const jsonc = jsonFormat === 'jsonc';
 
   if (jsonDestFile) {
     return [{
-      destination: jsonDestFile + ext,
+      destination: jsonDestFile + suffix + ext,
       format: 'json/tokens',
       options: { jsonc, jsonExpression },
     }];
@@ -242,7 +247,7 @@ export const buildJsonFiles = (
   // one silently overwrite the other.
   const pathsByDestName = new Map();
   for (const filePath of concreteFilePaths) {
-    const destName = path.basename(filePath).replace(/\.[^.]+$/, '') + ext;
+    const destName = path.basename(filePath).replace(/\.[^.]+$/, '') + suffix + ext;
     if (!pathsByDestName.has(destName)) pathsByDestName.set(destName, []);
     pathsByDestName.get(destName).push(filePath);
   }
@@ -260,7 +265,7 @@ export const buildJsonFiles = (
   return concreteFilePaths.map((filePath) => {
     const absPath = path.resolve(filePath);
     return {
-      destination: path.basename(filePath).replace(/\.[^.]+$/, '') + ext,
+      destination: path.basename(filePath).replace(/\.[^.]+$/, '') + suffix + ext,
       format: 'json/tokens',
       options: { jsonc, jsonExpression },
       filter: (token) => {

package/dev-tools/design-tokens-builder/build-tokens-src/legacy-tokens-parser.mjs

@@ -0,0 +1,105 @@
+// build-tokens-src/legacy-tokens-parser.mjs
+// Registers a Style Dictionary parser that bridges "legacy" token files
+// (Style Dictionary v3/v4-style syntax: no `$` prefix on `value`/`type`,
+// references written as `{group.token.value}`) into the W3C DTCG syntax
+// (`$value`/`$type`, references as `{group.token}`) required by Style
+// Dictionary v5.
+//
+// Why this is needed: Style Dictionary v5 decides whether a build "usesDtcg"
+// ONCE per build, from whichever source file is processed first (see
+// detectDtcgSyntax() called inside combineJSON.js in style-dictionary) — it
+// is a single global flag, not a per-file check. Mixing a legacy-syntax file
+// (e.g. a file exported from Open Props, or from an old Style Dictionary
+// v3/v4 project) together with DTCG sources therefore causes the legacy
+// file's tokens to be silently dropped regardless of file order: they never
+// carry the `$value` key combineJSON's own tagging (and the rest of the
+// pipeline) expects.
+//
+// This parser intercepts every `.json` source file (not `.jsonc` — that
+// extension is reserved in this project for hand-authored DTCG sources,
+// already handled correctly by Style Dictionary's own built-in loader) and
+// converts, node by node:
+//   value -> $value, type -> $type, comment/description -> $description
+//   "{group.token.value}" -> "{group.token}" inside reference strings
+// Nodes that already use `$value` (DTCG v5 syntax) are left untouched, so
+// the parser is a safe no-op for files that don't need conversion — no
+// config flag or file list is required, detection is fully automatic.
+//
+// Limitation: `.json` files handled by this parser are parsed with plain
+// JSON.parse (no comments, no trailing commas), unlike Style Dictionary's
+// own built-in loader (which uses JSON5 for .json/.jsonc/.json5). This keeps
+// the builder dependency-free — legacy token exports (Open Props, old Style
+// Dictionary v3/v4 projects) are virtually always strict JSON anyway. Use
+// `.jsonc` or `.mjs` for hand-authored DTCG sources that need comments.
+
+import StyleDictionary from 'style-dictionary';
+
+export const LEGACY_TOKENS_PARSER_NAME = 'minimo/legacy-tokens';
+
+// Matches "{some.token.path.value}" -> captures "some.token.path"
+const LEGACY_REF = /\{([^}]+)\.value\}/g;
+
+/** @param {unknown} value @returns {unknown} */
+const convertLegacyRefs = (value) => {
+  if (typeof value === 'string') {
+    return value.replace(LEGACY_REF, '{$1}');
+  }
+  if (Array.isArray(value)) {
+    return value.map(convertLegacyRefs);
+  }
+  if (value !== null && typeof value === 'object') {
+    return Object.fromEntries(
+      Object.entries(value).map(([key, v]) => [key, convertLegacyRefs(v)])
+    );
+  }
+  return value;
+};
+
+/** @param {unknown} node @returns {node is Record<string, unknown>} */
+const isPlainObject = (node) => node !== null && typeof node === 'object' && !Array.isArray(node);
+
+/** @param {unknown} node @returns {unknown} */
+const convertLegacyNode = (node) => {
+  if (!isPlainObject(node)) return node;
+
+  // Already DTCG v5 syntax: leave untouched.
+  if (Object.hasOwn(node, '$value')) return node;
+
+  if (Object.hasOwn(node, 'value')) {
+    // Legacy token leaf. Some legacy files (e.g. Open Props) also attach
+    // sibling numbered/named children to a node that carries its own
+    // `value`/`type` (a group that is also a default token) — those
+    // children are converted too, even though Style Dictionary itself
+    // cannot represent "group + own $value" ambiguity natively.
+    const { value, type, comment, description, ...rest } = node;
+    const convertedRest = Object.fromEntries(
+      Object.entries(rest).map(([key, child]) => [key, convertLegacyNode(child)])
+    );
+    const desc = comment ?? description;
+
+    return {
+      ...convertedRest,
+      $value: convertLegacyRefs(value),
+      ...(type !== undefined ? { $type: type } : {}),
+      ...(desc !== undefined ? { $description: desc } : {}),
+    };
+  }
+
+  // Group node: recurse into children.
+  return Object.fromEntries(
+    Object.entries(node).map(([key, child]) => [key, convertLegacyNode(child)])
+  );
+};
+
+// Registers the parser globally on the StyleDictionary class. To actually
+// run it, a Style Dictionary instance must also opt in via
+// `parsers: [LEGACY_TOKENS_PARSER_NAME]` in its config (registering alone
+// does not activate it for every instance — see Style Dictionary's parser
+// hooks docs).
+export const registerLegacyTokensParser = () => {
+  StyleDictionary.registerParser({
+    name: LEGACY_TOKENS_PARSER_NAME,
+    pattern: /\.json$/,
+    parser: ({ contents }) => convertLegacyNode(JSON.parse(contents)),
+  });
+};

package/dev-tools/design-tokens-builder/build-tokens-src/merge-css.mjs

@@ -0,0 +1,192 @@
+// build-tokens-src/merge-css.mjs
+// Supports the `mergeCustomProps` config option: pre-existing custom
+// properties in the CSS destination file take priority over the ones
+// generated by the current build (manual overrides/additions survive rebuilds).
+//
+// Usage (single `source` build):
+//   1. Call loadExistingCustomProps(absDestPath) BEFORE Style Dictionary runs,
+//      since it reads the file that is about to be overwritten.
+//   2. The css/variables-sorted format (see formats/css.mjs) calls
+//      mergeCustomProps(generatedMap) while building the output, right before
+//      serialising the final CSS text.
+//
+// Usage (sourceModes build, see build-source-modes.mjs):
+//   1. Call loadExistingCustomPropsScoped(absDestPath, baseMode) BEFORE any
+//      of the per-mode Style Dictionary instances run.
+//   2. The css/variables-sorted format calls mergeCustomProps(generatedMap, mode)
+//      once per mode. Declarations are matched only within the same mode's
+//      scope (the base `:root { ... }` block, or the `:root { ... }` nested
+//      inside that mode's `@media (prefers-color-scheme: <mode>) { ... }`),
+//      so the same custom property name defined with different values across
+//      modes is never mixed up.
+
+import { existsSync, readFileSync } from 'node:fs';
+
+const CUSTOM_PROP_RE = /^\s*--([\w-]+):\s*(.+)$/gm;
+
+/**
+ * Parses `--name: <tail>` declarations out of a CSS text block. <tail> is
+ * captured verbatim (value, terminating `;`, and anything else on the same
+ * line, e.g. a trailing comment) so it round-trips unchanged through a merge.
+ * Only single-line declarations are supported.
+ * @param {string} cssText
+ * @returns {Record<string,string>} name → declaration-tail map, in first-seen order
+ */
+export const parseCustomProps = (cssText) => {
+  /** @type {Record<string,string>} */
+  const map = {};
+  for (const match of cssText.matchAll(CUSTOM_PROP_RE)) {
+    map[match[1]] = match[2].trim();
+  }
+  return map;
+};
+
+// Returns the index of the closing brace matching the `{` at openIndex, by
+// simple depth counting. Braces inside comments/strings are not special-cased
+// — not expected to occur in generated custom-properties CSS.
+/** @param {string} text @param {number} openIndex */
+const matchBraces = (text, openIndex) => {
+  let depth = 0;
+  for (let i = openIndex; i < text.length; i++) {
+    if (text[i] === '{') depth++;
+    else if (text[i] === '}') {
+      depth--;
+      if (depth === 0) return i;
+    }
+  }
+  return -1;
+};
+
+// Finds every @media (prefers-color-scheme: <mode>) { ... } block in a
+// previously generated sourceModes CSS destFile, with absolute character
+// offsets into cssText. Used to split the file into per-mode scopes (see
+// splitModeScopes() below) and, by check-unresolved-custom-props.mjs, to
+// tell which mode a given custom property declaration belongs to.
+// An optional wrapping `@layer { ... }` (addLayer option) is transparent to
+// this search, since it only looks for the `@media (prefers-color-scheme: ...)`
+// pattern itself.
+// @param {string} cssText
+// @returns {{mode:string,start:number,end:number}[]} start/end are the
+//   indices of the block's outer `{`/matching `}` (inclusive)
+export const findMediaModeBlocks = (cssText) => {
+  const MEDIA_RE = /@media\s*\(\s*prefers-color-scheme\s*:\s*([\w-]+)\s*\)\s*\{/g;
+  /** @type {{mode:string,start:number,end:number}[]} */
+  const mediaBlocks = [];
+  for (const match of cssText.matchAll(MEDIA_RE)) {
+    const openIdx = match.index + match[0].length - 1;
+    const closeIdx = matchBraces(cssText, openIdx);
+    if (closeIdx === -1) continue;
+    mediaBlocks.push({ mode: match[1], start: openIdx, end: closeIdx });
+  }
+  return mediaBlocks;
+};
+
+// Splits a previously generated sourceModes CSS destFile into per-mode
+// scopes (see build-source-modes.mjs for the shape of the generated file):
+//   - the base scope is the top-level `:root { ... }` block, i.e. the one
+//     NOT nested inside a `@media (prefers-color-scheme: ...)` rule
+//   - every other scope is the `:root { ... }` block nested inside its own
+//     `@media (prefers-color-scheme: <mode>) { ... }` rule
+// @param {string} cssText
+// @returns {Record<string,string>} mode → CSS body text (base mode keyed as '__base__')
+const splitModeScopes = (cssText) => {
+  /** @type {Record<string,string>} */
+  const scopes = {};
+
+  // 1. Every @media (prefers-color-scheme: <mode>) { ... } block, and the
+  // :root { ... } body nested inside each one.
+  const mediaBlocks = findMediaModeBlocks(cssText);
+  for (const { mode, start, end } of mediaBlocks) {
+    const body = cssText.slice(start + 1, end);
+    const rootMatch = /:root\s*\{/.exec(body);
+    if (rootMatch) {
+      const rootOpen = rootMatch.index + rootMatch[0].length - 1;
+      const rootClose = matchBraces(body, rootOpen);
+      if (rootClose !== -1) {
+        scopes[mode] = body.slice(rootOpen + 1, rootClose);
+      }
+    }
+  }
+
+  // 2. The base :root { ... } block: the first one not nested inside any of
+  // the media blocks found above.
+  const ROOT_RE = /:root\s*\{/g;
+  for (const match of cssText.matchAll(ROOT_RE)) {
+    const openIdx = match.index + match[0].length - 1;
+    const insideMedia = mediaBlocks.some((b) => openIdx > b.start && openIdx < b.end);
+    if (insideMedia) continue;
+    const closeIdx = matchBraces(cssText, openIdx);
+    if (closeIdx === -1) continue;
+    scopes.__base__ = cssText.slice(openIdx + 1, closeIdx);
+    break;
+  }
+
+  return scopes;
+};
+
+// null = merge disabled, or destination file not found yet (first build)
+/** @type {Record<string,string>|null} */
+let existingCustomProps = null;
+
+// Per-mode equivalent of existingCustomProps, populated by
+// loadExistingCustomPropsScoped() for a sourceModes build.
+/** @type {Record<string, Record<string,string>>|null} */
+let scopedExistingCustomProps = null;
+
+/**
+ * Reads the CSS destination file (if it exists) and stores a name → value
+ * map of its current custom properties for later merging.
+ * @param {string} absDestPath absolute path of the CSS file to read
+ * @returns {Record<string,string>|null}
+ */
+export const loadExistingCustomProps = (absDestPath) => {
+  existingCustomProps = existsSync(absDestPath)
+    ? parseCustomProps(readFileSync(absDestPath, 'utf8'))
+    : null;
+  return existingCustomProps;
+};
+
+/**
+ * sourceModes equivalent of loadExistingCustomProps(): reads the CSS
+ * destination file (if it exists) and stores a per-mode name → value map,
+ * scoped to each mode's own `:root { ... }` block (see splitModeScopes()).
+ * @param {string} absDestPath absolute path of the CSS file to read
+ * @param {string} baseMode mode whose declarations live in the top-level,
+ *   non-nested `:root { ... }` block (no default — always passed explicitly
+ *   by build-source-modes.mjs, from the resolved sourceModesBase)
+ * @returns {Record<string, Record<string,string>>|null}
+ */
+export const loadExistingCustomPropsScoped = (absDestPath, baseMode) => {
+  if (!existsSync(absDestPath)) {
+    scopedExistingCustomProps = null;
+    return scopedExistingCustomProps;
+  }
+  const scopes = splitModeScopes(readFileSync(absDestPath, 'utf8'));
+  scopedExistingCustomProps = {};
+  if (scopes.__base__ !== undefined) {
+    scopedExistingCustomProps[baseMode] = parseCustomProps(scopes.__base__);
+  }
+  for (const [mode, body] of Object.entries(scopes)) {
+    if (mode === '__base__') continue;
+    scopedExistingCustomProps[mode] = parseCustomProps(body);
+  }
+  return scopedExistingCustomProps;
+};
+
+/**
+ * Merges freshly generated custom properties with the ones previously loaded
+ * via loadExistingCustomProps() / loadExistingCustomPropsScoped(). Pre-existing
+ * values take priority; custom properties found only in the pre-existing file
+ * (no longer generated) are kept as well.
+ * @param {Record<string,string>} generated name → value map produced by this build
+ * @param {string|null} [mode] when set (sourceModes build), looks up the
+ *   pre-existing props scoped to this mode instead of the flat/global map (default: null)
+ * @returns {Record<string,string>}
+ */
+export const mergeCustomProps = (generated, mode = null) => {
+  if (mode !== null) {
+    const existing = scopedExistingCustomProps?.[mode];
+    return existing ? { ...generated, ...existing } : generated;
+  }
+  return existingCustomProps ? { ...generated, ...existingCustomProps } : generated;
+};

package/{design-tokens/utilities → dev-tools/design-tokens-builder}/build-tokens-src/platforms.mjs

@@ -28,7 +28,9 @@ export const CSS_TRANSFORMS = [
 // Kept minimal on purpose: consuming tools expect original values (e.g. "16px"
 // not "1rem") and alias references ({...}) must be preserved to maintain
 // token links.
-const JSON_TRANSFORMS = [
+// Exported so build-source-modes.mjs can build a matching json platform per
+// sourceModes mode.
+export const JSON_TRANSFORMS = [
   'attribute/cti',
   'name/kebab',
   'color/css-modern',

package/dev-tools/design-tokens-builder/build-tokens.mjs

@@ -0,0 +1,219 @@
+#!/usr/bin/env node
+/// <reference types="node" />
+/* eslint-disable no-console */
+
+// build-tokens.mjs
+// Entry point: imports modules, runs the build, lints the CSS output, prints the log.
+//
+// Project structure:
+//   build-tokens.mjs              <- this file
+//   build-tokens-src/config.mjs   <- reads --config flag and resolves all paths
+//   build-tokens-src/transforms.mjs  <- registers custom Style Dictionary transforms
+//   build-tokens-src/formats/css.mjs    <- registers the css/variables-sorted format
+//   build-tokens-src/formats/json.mjs   <- registers the json/tokens format, exports helpers
+//   build-tokens-src/platforms.mjs      <- builds the platforms object (css + optional json)
+//   build-tokens-src/build-source-modes.mjs  <- alternative build path used when sourceModes is set
+//   build-tokens-src/merge-css.mjs      <- supports the mergeCustomProps option (flat and per-mode)
+
+import StyleDictionary from 'style-dictionary';
+import * as path from 'node:path';
+import { styleText } from 'node:util';
+import { homedir } from 'node:os';
+import stylelint from 'stylelint';
+import { pathToFileURL } from 'node:url';
+
+// ── 1. Configuration (args + resolved paths) ────────────────────────────────
+import {
+  configAbsPath,
+  buildPath,
+  destFile,
+  stylelintConfigPath,
+  jsonBuildPath,
+  jsonDestFile,
+  jsonFormat,
+  jsonExpression,
+  source,
+  sourceModes,
+  sourceModesBase,
+  mergeCustomProps,
+  customPropsGroups,
+  pxToRem,
+  addLayer,
+} from './build-tokens-src/config.mjs';
+
+// ── 2. Custom transforms ─────────────────────────────────────────────────────
+import './build-tokens-src/transforms.mjs';
+
+// ── 2b. Legacy token syntax bridge ───────────────────────────────────────────
+// Converts legacy (non-DTCG, e.g. Open Props) .json/.jsonc source files to
+// DTCG v5 syntax at parse time — see build-tokens-src/legacy-tokens-parser.mjs.
+import { LEGACY_TOKENS_PARSER_NAME, registerLegacyTokensParser } from './build-tokens-src/legacy-tokens-parser.mjs';
+registerLegacyTokensParser();
+
+// ── 3. CSS format ─────────────────────────────────────────────────────────────
+// customPropsCount is updated by the format at render time
+// loadExistingCustomProps supports the mergeCustomProps option (see below)
+import { customPropsCount } from './build-tokens-src/formats/css.mjs';
+import { loadExistingCustomProps } from './build-tokens-src/merge-css.mjs';
+
+// ── 4. JSON format ────────────────────────────────────────────────────────────
+import { buildJsonFiles, collectConcreteFilePaths } from './build-tokens-src/formats/json.mjs';
+
+// ── 5. Platforms builder ──────────────────────────────────────────────────────
+import { buildPlatforms } from './build-tokens-src/platforms.mjs';
+
+// ── 5b. sourceModes builder (alternative to the single-source build below) ──
+import { buildSourceModes } from './build-tokens-src/build-source-modes.mjs';
+
+// ── 6. Clean json output directory ───────────────────────────────────────────
+// Remove only previously generated *.json/*.jsonc files, so that tokens
+// removed from the source are not left behind as stale artefacts, while any
+// other file placed in jsonBuildPath by the user (e.g. a README) is left
+// untouched. Files are written flat in jsonBuildPath (no subdirectories), so
+// only its top level is scanned. Runs regardless of sourceModes.
+if (jsonBuildPath) {
+  const { readdir, rm, mkdir } = await import('fs/promises');
+  const existingEntries = await readdir(jsonBuildPath, { withFileTypes: true }).catch(() => []);
+  await Promise.all(
+    existingEntries
+      .filter((entry) => entry.isFile() && /\.jsonc?$/.test(entry.name))
+      .map((entry) => rm(path.join(jsonBuildPath, entry.name)))
+  );
+  await mkdir(jsonBuildPath, { recursive: true });
+}
+
+// ── 7. Build ──────────────────────────────────────────────────────────────────
+// concreteFilePaths / modeResult are used below in the log section (10).
+/** @type {string[]} */
+let concreteFilePaths = [];
+/** @type {Awaited<ReturnType<typeof buildSourceModes>>|null} */
+let modeResult = null;
+
+if (sourceModes) {
+  // sourceModes build: one StyleDictionary instance per mode, composed into
+  // a single destFile — see build-tokens-src/build-source-modes.mjs.
+  modeResult = await buildSourceModes({
+    sourceModes,
+    baseMode: sourceModesBase,
+    buildPath,
+    destFile,
+    jsonBuildPath,
+    jsonDestFile,
+    jsonFormat,
+    jsonExpression,
+    customPropsGroups,
+    pxToRem,
+    addLayer,
+    mergeCustomProps,
+  });
+
+} else {
+  // Single-source build (default).
+
+  // Pre-existing custom properties (mergeCustomProps option): read before
+  // Style Dictionary runs, since it overwrites the destination file. The
+  // css/variables-sorted format (formats/css.mjs) merges these values in —
+  // pre-existing values take priority — right before serialising the final
+  // CSS output. See merge-css.mjs.
+  if (mergeCustomProps) {
+    loadExistingCustomProps(path.join(buildPath, destFile));
+  }
+
+  // Collect concrete source file paths (multi-file JSON mode only). Source
+  // entries may be glob patterns. SD expands them internally and stores the
+  // concrete path in token.filePath. We need those concrete paths to build
+  // the per-file descriptors for the json platform.
+  //
+  // SD v5 lazy-loads sources: `await sd.hasInitialized` triggers loading;
+  // after that sd.allTokens is a plain synchronous array with filePath populated.
+  //
+  // In single-file mode (jsonDestFile is set) we skip this step entirely.
+  // source is only null when sourceModes is set (see config.mjs); this
+  // branch runs exclusively when sourceModes is not set.
+  const singleSource = /** @type {string[]} */ (source);
+
+  if (jsonBuildPath && !jsonDestFile) {
+    const sdInit = new StyleDictionary({
+      source: singleSource,
+      parsers: [LEGACY_TOKENS_PARSER_NAME],
+      log: { verbosity: 'silent' },
+      platforms: {},
+    });
+    concreteFilePaths = await collectConcreteFilePaths(sdInit);
+  }
+
+  const sd = new StyleDictionary({
+    source: singleSource,
+    parsers: [LEGACY_TOKENS_PARSER_NAME],
+    log: { verbosity: 'verbose' },
+    platforms: buildPlatforms({
+      buildPath,
+      destFile,
+      jsonBuildPath,
+      jsonDestFile,
+      jsonFormat,
+      jsonExpression,
+      concreteFilePaths,
+      customPropsGroups,
+      pxToRem,
+      addLayer,
+    }),
+  });
+
+  await sd.buildAllPlatforms();
+}
+
+// ── 8. CSS lint ───────────────────────────────────────────────────────────────
+const stylelintConfig = await import(pathToFileURL(stylelintConfigPath).href).then(m => m.default);
+
+
+await stylelint.lint({
+  config: stylelintConfig,
+  files: [path.join(buildPath, destFile)],
+  fix: true,
+});
+
+// ── 9. Log ────────────────────────────────────────────────────────────────────
+/** @param {string} p */
+const short = (p) => p.replace(homedir(), '~');
+
+console.log(styleText(['yellow'], `[build-tokens] config file : ${short(configAbsPath)}`));
+
+if (sourceModes) {
+  console.log(styleText(['yellow'],
+    `[build-tokens] modes       : ${Object.keys(sourceModes).join(', ')} (base: ${sourceModesBase})`
+  ));
+} else {
+  console.log(styleText(['yellow'], `[build-tokens] source      : ${(/** @type {string[]} */ (source)).map(short)}`));
+}
+console.log(styleText(['yellow'], `[build-tokens] dest file   : ${short(path.join(buildPath, destFile))}`));
+
+if (jsonBuildPath) {
+  if (sourceModes && modeResult) {
+    const totalJsonFiles = Object.values(modeResult.jsonFilesByMode)
+      .reduce((count, files) => count + files.length, 0);
+    console.log(styleText(['yellow'],
+      `[build-tokens] json        : ${totalJsonFiles} files in ${short(jsonBuildPath)} (${Object.keys(sourceModes).length} modes)`
+    ));
+  } else {
+    const jsonFiles = buildJsonFiles(concreteFilePaths, jsonDestFile, jsonFormat, jsonExpression);
+    if (jsonFiles.length === 1) {
+      console.log(styleText(['yellow'],
+        `[build-tokens] json        : ${short(path.join(jsonBuildPath, jsonFiles[0].destination))}`
+      ));
+    } else {
+      console.log(styleText(['yellow'],
+        `[build-tokens] json        : ${jsonFiles.length} files in ${short(jsonBuildPath)}`
+      ));
+    }
+  }
+} else {
+  console.log(styleText(['yellow'],
+    '[build-tokens] json        : (disabled — jsonBuildPath not set)'
+  ));
+}
+
+console.log(styleText(['green'],
+  `[build-tokens] ${sourceModes && modeResult ? modeResult.totalCustomProps : customPropsCount} custom properties processed`
+));
+console.log(styleText(['green'], '**** DONE ****'));