@massimo-cassandro/minimo 1.36.2 → 1.38.0

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

@@ -67,6 +67,12 @@ const matchBraces = (text, openIndex) => {
   return -1;
 };
 
+// Escapes a string for literal use inside a RegExp — needed because
+// customPropsSelector (see config.mjs) can contain regex-special characters,
+// e.g. ':where(html)'.
+/** @param {string} str */
+const escapeRegExp = (str) => str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+
 // 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
@@ -93,22 +99,25 @@ export const findMediaModeBlocks = (cssText) => {
 
 // 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
+//   - the base scope is the top-level `<selector> { ... }` block, i.e. the
+//     one NOT nested inside a `@media (prefers-color-scheme: ...)` rule
+//   - every other scope is the `<selector> { ... }` block nested inside its
+//     own `@media (prefers-color-scheme: <mode>) { ... }` rule
 // @param {string} cssText
+// @param {string} [selector] the customPropsSelector the file was generated
+//   with (default: ':root' — see config.mjs)
 // @returns {Record<string,string>} mode → CSS body text (base mode keyed as '__base__')
-const splitModeScopes = (cssText) => {
+const splitModeScopes = (cssText, selector = ':root') => {
   /** @type {Record<string,string>} */
   const scopes = {};
+  const selectorRe = new RegExp(`${escapeRegExp(selector)}\\s*\\{`);
 
   // 1. Every @media (prefers-color-scheme: <mode>) { ... } block, and the
-  // :root { ... } body nested inside each one.
+  // <selector> { ... } 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);
+    const rootMatch = selectorRe.exec(body);
     if (rootMatch) {
       const rootOpen = rootMatch.index + rootMatch[0].length - 1;
       const rootClose = matchBraces(body, rootOpen);
@@ -118,9 +127,9 @@ const splitModeScopes = (cssText) => {
     }
   }
 
-  // 2. The base :root { ... } block: the first one not nested inside any of
-  // the media blocks found above.
-  const ROOT_RE = /:root\s*\{/g;
+  // 2. The base <selector> { ... } block: the first one not nested inside
+  // any of the media blocks found above.
+  const ROOT_RE = new RegExp(`${escapeRegExp(selector)}\\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);
@@ -188,22 +197,24 @@ export const loadExistingCustomProps = (absDestPath, sources = true) => {
 /**
  * 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()).
+ * scoped to each mode's own `<selector> { ... }` 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
+ *   non-nested `<selector> { ... }` block (no default — always passed explicitly
  *   by build-source-modes.mjs, from the resolved sourceModesBase)
  * @param {true|(string|RegExp)[]} [sources] `true` merges every source, an
  *   array only the token source files matching one of its entries (default: true)
+ * @param {string} [selector] the customPropsSelector the pre-existing file was
+ *   generated with (default: ':root' — see config.mjs)
  * @returns {Record<string, Record<string,string>>|null}
  */
-export const loadExistingCustomPropsScoped = (absDestPath, baseMode, sources = true) => {
+export const loadExistingCustomPropsScoped = (absDestPath, baseMode, sources = true, selector = ':root') => {
   mergeSources = sources;
   if (!existsSync(absDestPath)) {
     scopedExistingCustomProps = null;
     return scopedExistingCustomProps;
   }
-  const scopes = splitModeScopes(readFileSync(absDestPath, 'utf8'));
+  const scopes = splitModeScopes(readFileSync(absDestPath, 'utf8'), selector);
   scopedExistingCustomProps = {};
   if (scopes.__base__ !== undefined) {
     scopedExistingCustomProps[baseMode] = parseCustomProps(scopes.__base__);

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

@@ -11,9 +11,10 @@ import { buildJsonFiles } from './formats/json.mjs';
 // Transforms applied to the CSS platform.
 // Exported so other scripts (e.g. check-unresolved-custom-props.mjs) can
 // build a Style Dictionary instance with matching transformed token names.
+// name/kebab-prefixed = name/kebab + per-source prefix (see source-prefixes.mjs).
 export const CSS_TRANSFORMS = [
   'attribute/cti',
-  'name/kebab',
+  'name/kebab-prefixed',
   'time/seconds',
   'asset/url',
   'size/pxToRem-smart',
@@ -27,7 +28,8 @@ export const CSS_TRANSFORMS = [
 // Transforms applied to the JSON platform.
 // Kept minimal on purpose: consuming tools expect original values (e.g. "16px"
 // not "1rem") and alias references ({...}) must be preserved to maintain
-// token links.
+// token links. Source prefixes are not applied here (plain name/kebab): the
+// JSON output keeps the original token tree.
 // Exported so build-source-modes.mjs can build a matching json platform per
 // sourceModes mode.
 export const JSON_TRANSFORMS = [
@@ -50,6 +52,7 @@ export const JSON_TRANSFORMS = [
  * @param {{name: string, prefixes: string[]}[]} opts.customPropsGroups  Named groups of name prefixes, moved to the top of the CSS output in list order.
  * @param {boolean}         opts.pxToRem             If false, skips the px→rem transform on the CSS platform. Default: true.
  * @param {string|null}     opts.addLayer            Wraps the generated custom properties inside `@layer <addLayer> { ... }`. null = no layer.
+ * @param {string}          opts.selector            CSS selector wrapping the generated block (default: ':root').
  * @returns {Record<string, PlatformConfig>} platforms object ready for Style Dictionary config
  */
 export const buildPlatforms = ({
@@ -63,6 +66,7 @@ export const buildPlatforms = ({
   customPropsGroups = [],
   pxToRem = true,
   addLayer = null,
+  selector = ':root',
 }) => {
   const cssTransforms = pxToRem
     ? CSS_TRANSFORMS
@@ -80,6 +84,7 @@ export const buildPlatforms = ({
           options: {
             outputReferences: true,
             showFileHeader: true,
+            selector,
             customPropsGroups,
             addLayer,
           },

package/dev-tools/design-tokens-builder/build-tokens-src/source-prefixes.mjs

@@ -0,0 +1,129 @@
+// build-tokens-src/source-prefixes.mjs
+// Supports per-source custom property prefixes: an entry of `source` (or of a
+// `sourceModes` mode) can be an object `{ src, prefix }` instead of a plain
+// string, e.g.
+//
+//   { src: 'node_modules/open-props/open-props.style-dictionary-tokens.json', prefix: 'op' }
+//
+// so that every token defined by those files is rendered as `--op-<name>`.
+//
+// How it works: the prefix is applied to the token NAME only (see the
+// name/kebab-prefixed transform in transforms.mjs), never to its path.
+// {references} are resolved through the token path and rendered with the
+// already-prefixed name, so a token of another source referencing e.g.
+// {gray.5} becomes `var(--op-gray-5)` with no change to the token files. The
+// JSON output keeps the original (unprefixed) tree structure.
+//
+// The name transform only knows the concrete file a token comes from
+// (token.filePath), while `src` may contain glob patterns: registerSourcePrefixes()
+// expands them (through Style Dictionary itself, so the result matches
+// token.filePath exactly) into a file path -> prefix map.
+
+import StyleDictionary from 'style-dictionary';
+import { LEGACY_TOKENS_PARSER_NAME } from './legacy-tokens-parser.mjs';
+import { resolveSourcePaths } from './resolve-source-paths.mjs';
+import { collectConcreteFilePaths } from './formats/json.mjs';
+
+/**
+ * @typedef {object} PrefixedSource
+ * @property {string[]} src     Source paths/globs, already resolved (see resolveSourcePaths)
+ * @property {string}   prefix  Normalised prefix, without leading `--` or trailing `-`
+ */
+
+/** @type {Map<string, string>} */
+let prefixByFile = new Map();
+
+/**
+ * Normalises a user-provided prefix: 'op', 'op-' and '--op-' all become 'op'.
+ * @param {unknown} prefix
+ * @returns {string}
+ * @throws {Error} if the result is not a valid custom property name segment
+ */
+export const normalizePrefix = (prefix) => {
+  const value = String(prefix).trim().replace(/^-+/, '').replace(/-+$/, '');
+  if (!/^[a-z_][\w-]*$/i.test(value)) {
+    throw new Error(`[build-tokens] config: invalid source prefix "${prefix}"`);
+  }
+  return value;
+};
+
+/**
+ * Splits a `source` (or `sourceModes[mode]`) array, whose entries can be
+ * strings or `{ src, prefix }` objects, into the flat list of patterns to pass
+ * to Style Dictionary and the list of the prefixed entries. Patterns are
+ * resolved relative to baseDir (see resolveSourcePaths).
+ * @param {(string|{src: string|string[], prefix?: string})[]} entries
+ * @param {string} baseDir
+ * @returns {{patterns: string[], prefixed: PrefixedSource[]}}
+ */
+export const splitSourceEntries = (entries, baseDir) => {
+  /** @type {string[]} */
+  const patterns = [];
+  /** @type {PrefixedSource[]} */
+  const prefixed = [];
+
+  for (const entry of entries ?? []) {
+    if (typeof entry === 'string') {
+      patterns.push(...resolveSourcePaths([entry], baseDir));
+      continue;
+    }
+
+    const isObjectEntry = entry !== null && typeof entry === 'object'
+      && (typeof entry.src === 'string' || Array.isArray(entry.src));
+    if (!isObjectEntry) {
+      throw new Error(
+        `[build-tokens] config: invalid source entry ${JSON.stringify(entry)} `
+        + '(expected a string or an object { src, prefix })'
+      );
+    }
+
+    const src = resolveSourcePaths([].concat(entry.src), baseDir);
+    patterns.push(...src);
+
+    if (entry.prefix !== undefined && entry.prefix !== null && entry.prefix !== '') {
+      prefixed.push({ src, prefix: normalizePrefix(entry.prefix) });
+    }
+  }
+
+  return { patterns, prefixed };
+};
+
+/**
+ * Expands the `src` patterns of every prefixed entry into concrete file paths
+ * and stores the file path -> prefix map used by getSourcePrefix().
+ * Must be called after registerLegacyTokensParser() and before any build.
+ * @param {PrefixedSource[]} prefixedSources
+ * @returns {Promise<void>}
+ * @throws {Error} if the same file is given two different prefixes
+ */
+export const registerSourcePrefixes = async (prefixedSources) => {
+  /** @type {Map<string, string>} */
+  const map = new Map();
+
+  for (const { src, prefix } of prefixedSources) {
+    const sd = new StyleDictionary({
+      source: src,
+      parsers: [LEGACY_TOKENS_PARSER_NAME],
+      log: { verbosity: 'silent' },
+      platforms: {},
+    });
+
+    for (const filePath of await collectConcreteFilePaths(sd)) {
+      const existing = map.get(filePath);
+      if (existing !== undefined && existing !== prefix) {
+        throw new Error(
+          `[build-tokens] config: "${filePath}" has two different prefixes ("${existing}" and "${prefix}")`
+        );
+      }
+      map.set(filePath, prefix);
+    }
+  }
+
+  prefixByFile = map;
+};
+
+/**
+ * @param {string|undefined} filePath  token.filePath
+ * @returns {string|undefined} the prefix registered for that file, if any
+ */
+export const getSourcePrefix = (filePath) => (filePath ? prefixByFile.get(filePath) : undefined);

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

@@ -3,6 +3,7 @@
 // Imported once by build-tokens.mjs before buildAllPlatforms() is called.
 
 import StyleDictionary from 'style-dictionary';
+import { getSourcePrefix } from './source-prefixes.mjs';
 
 const BASE_FONT_SIZE = 16;
 
@@ -212,3 +213,22 @@ StyleDictionary.registerTransform({
   filter: (token) => token.$type === 'typography' || token.type === 'typography',
   transform: (token) => token.$value ?? token.value,
 });
+
+// ---------------------------------------------------------------------------
+// 7. Kebab-case name with per-source prefix
+// Same as the built-in name/kebab, but prepends the prefix registered for the
+// token's source file (`{ src, prefix }` entries of `source`/`sourceModes`, see
+// source-prefixes.mjs), e.g. Open Props' gray.0 with prefix 'op' -> op-gray-0.
+// Only the name changes: the token path is untouched, so {references} keep
+// resolving and are rendered as var(--<prefixed-name>). Files without a
+// prefix get exactly the built-in name/kebab result.
+// ---------------------------------------------------------------------------
+StyleDictionary.registerTransform({
+  name: 'name/kebab-prefixed',
+  type: 'name',
+  transform: (token, options) => {
+    const kebab = StyleDictionary.hooks.transforms['name/kebab'].transform;
+    const prefix = getSourcePrefix(token.filePath);
+    return kebab(prefix ? { ...token, path: [prefix, ...token.path] } : token, options);
+  },
+});

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

@@ -14,6 +14,7 @@
 //   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)
+//   build-tokens-src/source-prefixes.mjs <- supports `{ src, prefix }` entries in source/sourceModes
 
 import StyleDictionary from 'style-dictionary';
 import * as path from 'node:path';
@@ -35,10 +36,13 @@ import {
   source,
   sourceModes,
   sourceModesBase,
+  prefixedSources,
   mergeCustomProps,
   customPropsGroups,
   pxToRem,
   addLayer,
+  useLightDarkFunc,
+  customPropsSelector,
 } from './build-tokens-src/config.mjs';
 
 // ── 2. Custom transforms ─────────────────────────────────────────────────────
@@ -50,6 +54,13 @@ import './build-tokens-src/transforms.mjs';
 import { LEGACY_TOKENS_PARSER_NAME, registerLegacyTokensParser } from './build-tokens-src/legacy-tokens-parser.mjs';
 registerLegacyTokensParser();
 
+// ── 2c. Per-source custom property prefixes ──────────────────────────────────
+// Expands the `{ src, prefix }` entries of source/sourceModes into the file ->
+// prefix map read by the name/kebab-prefixed transform (needs the legacy
+// parser above, to load legacy .json sources) — see source-prefixes.mjs.
+import { registerSourcePrefixes } from './build-tokens-src/source-prefixes.mjs';
+await registerSourcePrefixes(prefixedSources);
+
 // ── 3. CSS format ─────────────────────────────────────────────────────────────
 // customPropsCount is updated by the format at render time
 // loadExistingCustomProps supports the mergeCustomProps option (see below)
@@ -105,6 +116,8 @@ if (sourceModes) {
     pxToRem,
     addLayer,
     mergeCustomProps,
+    useLightDarkFunc,
+    customPropsSelector,
   });
 
 } else {
@@ -157,6 +170,7 @@ if (sourceModes) {
       customPropsGroups,
       pxToRem,
       addLayer,
+      selector: customPropsSelector,
     }),
   });
 

package/dev-tools/design-tokens-builder/check-unresolved-custom-props.mjs

@@ -24,7 +24,7 @@ import { styleText } from 'node:util';
 import StyleDictionary from 'style-dictionary';
 import './build-tokens-src/transforms.mjs';
 import { CSS_TRANSFORMS } from './build-tokens-src/platforms.mjs';
-import { resolveSourcePaths } from './build-tokens-src/resolve-source-paths.mjs';
+import { splitSourceEntries, registerSourcePrefixes } from './build-tokens-src/source-prefixes.mjs';
 import { findMediaModeBlocks } from './build-tokens-src/merge-css.mjs';
 import { LEGACY_TOKENS_PARSER_NAME, registerLegacyTokensParser } from './build-tokens-src/legacy-tokens-parser.mjs';
 
@@ -202,17 +202,22 @@ async function run() {
     /** @type {Map<string, Map<string, string>>} */
     const sourceFileByPropByMode = new Map();
 
-    // includePatterns: base-mode sources, passed as `include` for non-base
+    // includeEntries: base-mode sources, passed as `include` for non-base
     // modes so cross-mode references resolve (same as build-source-modes.mjs).
-    /** @param {string[]} sourcePatterns @param {string[]} [includePatterns] @returns {Promise<Map<string,string>>} */
-    const resolveSourceFileMap = async (sourcePatterns, includePatterns = []) => {
+    /** @param {Parameters<typeof splitSourceEntries>[0]} sourceEntries @param {Parameters<typeof splitSourceEntries>[0]} [includeEntries] @returns {Promise<Map<string,string>>} */
+    // Entries can be strings or `{ src, prefix }` objects (see
+    // build-tokens-src/source-prefixes.mjs): the prefixes are registered
+    // before the transform pipeline runs, so token names match the CSS.
+    const resolveSourceFileMap = async (sourceEntries, includeEntries = []) => {
       /** @type {Map<string, string>} */
       const map = new Map();
-      const resolvedPaths = resolveSourcePaths(sourcePatterns, configDir);
+      const { patterns: resolvedPaths, prefixed } = splitSourceEntries(sourceEntries, configDir);
+      const { patterns: includePaths, prefixed: includePrefixed } = splitSourceEntries(includeEntries, configDir);
       if (!resolvedPaths.length) return map;
       try {
+        await registerSourcePrefixes([...prefixed, ...includePrefixed]);
         const sd = new StyleDictionary({
-          include: resolveSourcePaths(includePatterns, configDir),
+          include: includePaths,
           source: resolvedPaths,
           parsers: [LEGACY_TOKENS_PARSER_NAME],
           log: { verbosity: 'silent' },
@@ -230,8 +235,8 @@ async function run() {
 
     if (checkUnused && config.sourceModes) {
       for (const [mode, modeSource] of Object.entries(config.sourceModes)) {
-        const includePatterns = mode === sourceModesBase ? [] : config.sourceModes[sourceModesBase];
-        sourceFileByPropByMode.set(mode, await resolveSourceFileMap(modeSource, includePatterns));
+        const includeEntries = mode === sourceModesBase ? [] : config.sourceModes[sourceModesBase];
+        sourceFileByPropByMode.set(mode, await resolveSourceFileMap(modeSource, includeEntries));
       }
     } else if (checkUnused && Array.isArray(config.source) && config.source.length) {
       const map = await resolveSourceFileMap(config.source);

package/dev-tools/design-tokens-builder/tokens-config-sample.mjs

@@ -51,15 +51,24 @@ const config = {
   // the pattern syntax. Use template literals instead:
   //   OK:  `${minimo_path}/**/*.{json,mjs}`
   //   NO:  path.join(minimo_path, '/**/*.{json,mjs}')
+  //
+  // An entry can also be an object `{ src, prefix }` (src: string or array of
+  // strings/globs), to render the custom properties of those files with a
+  // prefix: e.g. { src: '...open-props...json', prefix: 'op' } turns Open
+  // Props' gray.0 into --op-gray-0. Only the property name changes:
+  // {references} to those tokens are rendered as var(--op-gray-0), and the JSON
+  // output stays unprefixed. 'op', 'op-' and '--op-' are equivalent. The same
+  // syntax works inside sourceModes. Two different prefixes for the same file
+  // make the build fail.
   source: [
     `${minimo_path}/design-tokens/_src/**/*.tokens.{mjs,jsonc}`, // main tokens
     `${minimo_path}/src/**/*.tokens.{mjs,jsonc}`, // components tokens
 
     // optional extra token source (in this example, openProps, https://open-props.style/)
-    // `${node_modules_path}/open-props/open-props.style-dictionary-tokens.json`,
+    // { src: `${node_modules_path}/open-props/open-props.style-dictionary-tokens.json`, prefix: 'op' },
 
     // your project tokens
-    './project-tokens/*.{js,mjs,jsonc,json}',
+    {src: './project-tokens/*.{js,mjs,jsonc,json}', prefix: 'my-project'}
   ],
 
   // Optional light/dark (or other) custom properties split — alternative to
@@ -101,12 +110,54 @@ const config = {
   // },
   sourceModes: null,
 
+  // With sourceModes set, and only if it defines both a `light` and a `dark`
+  // key: custom properties present in BOTH — matched by name — are written
+  // once as `--name: light-dark(<light-value>, <dark-value>);`, instead of
+  // being split across the base mode's top-level block and a
+  // `@media (prefers-color-scheme: dark) { ... }` rule.
+  //
+  // Unaffected:
+  //   - any other key in sourceModes besides light/dark (e.g. a third,
+  //     custom mode) — always stays on its own
+  //     `@media (prefers-color-scheme: <mode>) { ... }` rule
+  //   - a property present in only one of `light`/`dark` — stays in its own
+  //     mode's block (still behind `@media`, unless that mode happens to be
+  //     sourceModesBase)
+  //
+  // Whenever this option is active (sourceModes has both a light and a dark
+  // key), the base mode's `color-scheme` declaration is always normalised to
+  // read "light dark [...any other mode]", with light before dark — matching
+  // light-dark()'s own (light-value, dark-value) argument order — regardless
+  // of the order sourceModes keys were declared in, or of which of the two
+  // is configured as sourceModesBase below.
+  //
+  // Interaction with mergeCustomProps: no special handling needed — the
+  // per-mode merge with pre-existing custom properties always runs first;
+  // this option then reconciles whatever value ends up in each mode
+  // (freshly generated or preserved from a pre-existing file) into
+  // light-dark(), matched by name. This also means that re-running a build
+  // with this option newly turned on, over a destFile previously generated
+  // with it off (classic `@media (prefers-color-scheme: dark)` split) and
+  // mergeCustomProps: true, converts the preserved values into light-dark()
+  // calls too — as with any mergeCustomProps case, a resulting mismatch is
+  // left for you to fix.
+  //
+  // Default: true. Ignored when sourceModes is not set (null/undefined).
+  useLightDarkFunc: true,
+
   // With sourceModes set: the mode whose declarations go in the top-level
   // `:root { ... }` block, instead of nested inside its own
   // `@media (prefers-color-scheme: <mode>) { ... }` rule (default: the first
   // key of sourceModes, e.g. 'light'). Ignored when sourceModes is not set.
   sourceModesBase: 'light',
 
+  // CSS selector wrapping the generated custom properties block(s), instead
+  // of the default `:root`. Applies uniformly whether using a single
+  // `source` or `sourceModes` (the base mode's top-level block and every
+  // other mode's block nested under its own
+  // `@media (prefers-color-scheme: <mode>)` rule all use this same
+  // selector). Falsy or blank values fall back to ':root'.
+  customPropsSelector: ':where(html)',
 
   // If true (default), dimension token values expressed in px are converted
   // to rem in the generated CSS. Values in other units (em, %, vh, dvw, ...)
@@ -132,7 +183,7 @@ const config = {
   // Comments at the end of a custom property line are preserved; full-line
   // comments are lost, and a multi-line comment is cut at the end of its first
   // line (and closed, to keep the CSS valid).
-  mergeCustomProps: false,
+  mergeCustomProps: true,
 
   // Wraps the generated custom properties inside a CSS `@layer` at-rule,
   // e.g. addLayer: 'project' -> `@layer project { :root { ... } }`.
@@ -146,7 +197,7 @@ const config = {
   customPropsGroups: [
     {
       name: 'COLORS',
-      prefixes: ['accent', 'primary', 'secondary', 'neutral'],
+      prefixes: ['accent', 'primary', 'secondary', 'neutral', 'color'],
     },
     {
       name: 'LAYOUT',

package/dev-tools/starter-kit/starter-install.sh

@@ -415,7 +415,7 @@ done
 # installato in node_modules (stessa versione che userà il progetto)
 MINIMO_PKG_DIR=./node_modules/@massimo-cassandro/minimo
 
-force_cat "${MINIMO_PKG_DIR}/src/custom-properties.css" "${FRONTEND_INSTALL_PATH}/css/custom-properties.css"
+force_cat "${MINIMO_PKG_DIR}/src/custom-properties.css" "${FRONTEND_INSTALL_PATH}/css/minimo-custom-properties.css"
 force_cat "${MINIMO_PKG_DIR}/src/custom-media.css" "${FRONTEND_INSTALL_PATH}/css/custom-media.css"
 
 # entry css principale del progetto: copia diretta di minimo.css, rinominato

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@massimo-cassandro/minimo",
-  "version": "1.36.2",
+  "version": "1.38.0",
   "description": "Light css framework & utilities",
   "type": "module",
   "main": "./index.js",