Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 | 5x 5x 5x 5x 5x 5x 14x 14x 14x 14x 5x 9x 9x | /**
* CLI argument definitions, parsing, and validation for the CSS build pipeline.
*
* Consumers import `args` (the parsed result) and `THEME` / `THEME_TOKEN_FOLDER`
* (the resolved theme identifiers) rather than re-parsing argv themselves.
*/
import arg from 'arg';
export const args = arg({
/** Subsystem name, maps to src/<system>/ (e.g. "slds2") */
'--system': String,
/** Watch mode: recompile on source file changes */
'--watch': Boolean,
/** Dev build: modular legacy CSS (base structure + per-theme tokens) to build/css/. */
'--dev-standard': Boolean,
/** Dev build: modular theme-layer CSS (base + per-theme + LBC variants) to build/css/theme-layer/. */
'--dev-theme-layer': Boolean,
/** Production build: produces all consumer-facing outputs in dist/css/. Loops all themes internally. */
'--production': Boolean,
/** Scope all selectors under a wrapper class (default: .slds-scope) */
'--scoped': Boolean,
/** Custom scope class name; only meaningful with --scoped */
'--scope-class-name': String,
/**
* Hooks package folder / file prefix (e.g. "cosmos", "lightning-blue").
* Required when using --production.
*/
'--theme': String,
/** Log the resolved import order (index + file path) for each build to aid debugging. */
'--debug-imports': Boolean,
});
// ─── Validation ──────────────────────────────────────────────────────────────
Iif (!args['--system']) {
console.error('Error: --system is required.');
process.exit(1);
}
// ─── Derived theme constants ──────────────────────────────────────────────────
/**
* Hooks package folder / file prefix (e.g. "cosmos", "lightning-blue").
* Drives legacy-hooks paths (src/legacy-hooks/{THEME}/) and output filenames.
* May differ from the design-tokens dist/themes/ folder name (see THEME_TOKEN_FOLDER).
*/
export const THEME = args['--theme'] || 'cosmos';
/**
* Registry mapping each --theme value to its resolved CSS and token folder names.
*
* - `css`: component theme CSS filename in src/slds2/<component>/themes/<name>.css
* - `tokens`: folder name under design-tokens dist/themes/ that supplies the token set
*
* Exported for testing.
*/
export const THEMES = ['cosmos', 'lightning-blue'];
export const THEME_TOKEN_FOLDER = THEME;
/**
* Derives the output base filename from build flags.
* Pure function — exported for testing without needing to parse real argv.
*
* @param {{ system: string, theme: string, lbc?: boolean, themeLayer?: boolean, scoped?: boolean, production?: boolean }} opts
*/
export const deriveFilename = ({
system,
theme,
lbc = false,
themeLayer = false,
scoped = false,
production = false,
}) => {
const lbcInfix = lbc ? '.lbc' : '';
const themeLayerInfix = themeLayer ? '.theme-layer' : '';
const scopedSuffix = scoped ? '.scoped' : '';
// Non-production, non-theme-layer builds are base structure files (e.g. slds2.base, slds2.scoped.base)
if (!production && !themeLayer) {
return `${system}${scopedSuffix}.base`;
}
const themeSuffix = `.${theme}`;
return `${system}${lbcInfix}${themeLayerInfix}${scopedSuffix}${themeSuffix}`;
};
|