@yahoo/uds 3.114.0 → 3.115.0-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/automated-config/dist/mapTextVariantFixtureToValue.cjs +12 -1
- package/dist/automated-config/dist/mapTextVariantFixtureToValue.js +12 -1
- package/dist/automated-config/dist/properties.cjs +1 -1
- package/dist/automated-config/dist/properties.js +1 -1
- package/dist/cli/commands/sync.cjs +1 -3
- package/dist/cli/commands/sync.d.cts +1 -1
- package/dist/cli/commands/sync.d.ts +1 -1
- package/dist/cli/commands/sync.js +1 -3
- package/dist/cli/commands/version.cjs +0 -2
- package/dist/cli/commands/version.d.cts +1 -1
- package/dist/cli/commands/version.d.ts +1 -1
- package/dist/cli/commands/version.js +0 -2
- package/dist/cli/dist/commands/editor-rules.cjs +1 -1
- package/dist/cli/dist/commands/editor-rules.js +1 -1
- package/dist/cli/dist/lib/logger.cjs +66 -0
- package/dist/cli/dist/lib/logger.js +66 -0
- package/dist/cli/runner.cjs +9 -0
- package/dist/cli/runner.js +9 -0
- package/dist/components/client/Menu/Menu.ItemCheckbox.d.cts +1 -1
- package/dist/components/client/Menu/Menu.ItemCheckbox.d.ts +1 -1
- package/dist/index.cjs +2 -0
- package/dist/index.d.cts +3 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.js +2 -1
- package/dist/styles/styler.d.cts +29 -29
- package/dist/styles/styler.d.ts +29 -29
- package/dist/styles/variants.cjs +278 -278
- package/dist/styles/variants.js +278 -278
- package/dist/tailwind/dist/commands/css.cjs +79 -0
- package/dist/tailwind/dist/commands/css.helpers.cjs +32 -0
- package/dist/tailwind/dist/commands/css.helpers.js +28 -0
- package/dist/tailwind/dist/commands/css.js +79 -0
- package/dist/tailwind/dist/commands/generateComponentData.cjs +33 -31
- package/dist/tailwind/dist/commands/generateComponentData.d.ts +1 -1
- package/dist/tailwind/dist/commands/generateComponentData.js +33 -31
- package/dist/tailwind/dist/commands/purge.cjs +3 -4
- package/dist/tailwind/dist/commands/purge.js +3 -4
- package/dist/tailwind/dist/css/generate.cjs +121 -0
- package/dist/tailwind/dist/css/generate.d.cts +30 -0
- package/dist/tailwind/dist/css/generate.d.ts +31 -0
- package/dist/tailwind/dist/css/generate.helpers.cjs +112 -0
- package/dist/tailwind/dist/css/generate.helpers.js +100 -0
- package/dist/tailwind/dist/css/generate.js +116 -0
- package/dist/tailwind/dist/css/nodeUtils.cjs +156 -0
- package/dist/tailwind/dist/css/nodeUtils.js +149 -0
- package/dist/tailwind/dist/css/postcss.cjs +35 -0
- package/dist/tailwind/dist/css/postcss.helpers.cjs +27 -0
- package/dist/tailwind/dist/css/postcss.helpers.js +26 -0
- package/dist/tailwind/dist/css/postcss.js +35 -0
- package/dist/tailwind/dist/css/runner.cjs +279 -0
- package/dist/tailwind/dist/css/runner.helpers.cjs +26 -0
- package/dist/tailwind/dist/css/runner.helpers.js +23 -0
- package/dist/tailwind/dist/css/runner.js +276 -0
- package/dist/tailwind/dist/css/theme.cjs +12 -0
- package/dist/tailwind/dist/css/theme.d.cts +66 -0
- package/dist/tailwind/dist/css/theme.d.ts +66 -0
- package/dist/tailwind/dist/css/theme.js +11 -0
- package/dist/tailwind/dist/css/utils.cjs +72 -0
- package/dist/tailwind/dist/css/utils.js +69 -0
- package/dist/tailwind/dist/index.d.cts +1 -0
- package/dist/tailwind/dist/index.d.ts +2 -4
- package/dist/tailwind/dist/purger/legacy/purgeCSS.cjs +2 -1
- package/dist/tailwind/dist/purger/legacy/purgeCSS.js +2 -1
- package/dist/tailwind/dist/purger/optimized/ast/expressions.cjs +122 -125
- package/dist/tailwind/dist/purger/optimized/ast/expressions.js +122 -125
- package/dist/tailwind/dist/purger/optimized/ast/jsx.cjs +1 -8
- package/dist/tailwind/dist/purger/optimized/ast/jsx.js +1 -8
- package/dist/tailwind/dist/purger/optimized/purge.cjs +9 -8
- package/dist/tailwind/dist/purger/optimized/purge.js +9 -8
- package/dist/tailwind/dist/purger/optimized/purgeFromCode.cjs +238 -127
- package/dist/tailwind/dist/purger/optimized/purgeFromCode.js +238 -127
- package/dist/tailwind/dist/purger/optimized/utils/componentAnalyzer.cjs +352 -260
- package/dist/tailwind/dist/purger/optimized/utils/componentAnalyzer.js +351 -260
- package/dist/tailwind/dist/purger/optimized/utils/files.cjs +4 -3
- package/dist/tailwind/dist/purger/optimized/utils/files.js +4 -3
- package/dist/tailwind/dist/purger/optimized/utils/safelist.cjs +12 -20
- package/dist/tailwind/dist/purger/optimized/utils/safelist.js +12 -20
- package/dist/tailwind/dist/tailwind/components/getResponsiveTextStyles.cjs +1 -1
- package/dist/tailwind/dist/tailwind/components/getResponsiveTextStyles.js +1 -1
- package/dist/tailwind/dist/tailwind/plugins/breakpoints.cjs +1 -1
- package/dist/tailwind/dist/tailwind/plugins/breakpoints.js +1 -1
- package/dist/tailwind/dist/tailwind/plugins/typography.cjs +41 -13
- package/dist/tailwind/dist/tailwind/plugins/typography.js +41 -13
- package/dist/tailwind/dist/tailwind/utils/composeTailwindPlugins.cjs +4 -2
- package/dist/tailwind/dist/tailwind/utils/composeTailwindPlugins.d.cts +10 -1
- package/dist/tailwind/dist/tailwind/utils/composeTailwindPlugins.d.ts +10 -1
- package/dist/tailwind/dist/tailwind/utils/composeTailwindPlugins.js +4 -2
- package/dist/tailwind/dist/utils/optimizeCSS.cjs +405 -0
- package/dist/tailwind/dist/utils/optimizeCSS.js +403 -0
- package/dist/tailwind/dist/utils/postcssPreserveVars.cjs +67 -0
- package/dist/tailwind/dist/utils/postcssPreserveVars.js +65 -0
- package/dist/tailwind/dist/utils/tsMorph.cjs +1 -1
- package/dist/uds/generated/componentData.cjs +1218 -1182
- package/dist/uds/generated/componentData.js +1218 -1182
- package/dist/uds/package.cjs +10 -4
- package/dist/uds/package.js +10 -4
- package/generated/componentData.json +2683 -0
- package/generated/tailwindPurge.ts +4591 -0
- package/package.json +7 -4
- package/dist/tailwind/dist/commands/generatePurgeCSSData.d.ts +0 -3
- package/dist/tailwind/dist/commands/purge.d.ts +0 -4
- package/dist/tailwind/dist/purger/legacy/purgeCSS.d.ts +0 -2
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
+
const require_colors = require('../../../cli/dist/lib/colors.cjs');
|
|
3
|
+
const require_print = require('../../../cli/dist/lib/print.cjs');
|
|
4
|
+
const require_nodeUtils = require('../css/nodeUtils.cjs');
|
|
5
|
+
const require_runner = require('../css/runner.cjs');
|
|
6
|
+
const require_css_helpers = require('./css.helpers.cjs');
|
|
7
|
+
|
|
8
|
+
//#region ../tailwind/dist/commands/css.js
|
|
9
|
+
/*! © 2026 Yahoo, Inc. UDS Tailwind and Purger v0.0.0-development */
|
|
10
|
+
const showHelp = () => {
|
|
11
|
+
require_print.print("");
|
|
12
|
+
require_print.print(`${require_colors.green("uds css")} - Generate CSS for app`);
|
|
13
|
+
require_print.print("");
|
|
14
|
+
require_print.print(`${require_colors.magenta("Usage:")}`);
|
|
15
|
+
require_print.print(` ${require_colors.cyan("uds css")} [options]`);
|
|
16
|
+
require_print.print(` ${require_colors.cyan("uds css init")} [options]`);
|
|
17
|
+
require_print.print("");
|
|
18
|
+
require_print.print(`${require_colors.magenta("Commands:")}`);
|
|
19
|
+
require_print.print(` ${require_colors.cyan("init")} Create a new uds.theme.ts file`);
|
|
20
|
+
require_print.print("");
|
|
21
|
+
require_print.print(`${require_colors.magenta("Options:")}`);
|
|
22
|
+
require_print.print(` ${require_colors.cyan("--entry <path>")} Entry directory to scan (default: /src/)`);
|
|
23
|
+
require_print.print(` ${require_colors.cyan("--outFile <path>")} Output CSS file (default: dist/uds.css)`);
|
|
24
|
+
require_print.print(` ${require_colors.cyan("--config <path>")} Path to uds.config.ts for tokens`);
|
|
25
|
+
require_print.print(` ${require_colors.cyan("--theme <path>")} Path to uds.theme.ts (default: uds.theme.ts)`);
|
|
26
|
+
require_print.print(` ${require_colors.cyan("--watch, -w")} Watch for file changes and regenerate`);
|
|
27
|
+
require_print.print(` ${require_colors.cyan("--silent, -s")} Suppress output logging`);
|
|
28
|
+
require_print.print(` ${require_colors.cyan("--force")} Overwrite existing uds.theme.ts (for init)`);
|
|
29
|
+
require_print.print(` ${require_colors.cyan("--help, -h")} Show this help message`);
|
|
30
|
+
require_print.print("");
|
|
31
|
+
require_print.print(`${require_colors.magenta("Initialize theme config:")}`);
|
|
32
|
+
require_print.print(` ${require_colors.gray("uds css init")}`);
|
|
33
|
+
require_print.print("");
|
|
34
|
+
require_print.print(`${require_colors.magenta("Simple mode")} (no uds.theme.ts):`);
|
|
35
|
+
require_print.print(` ${require_colors.gray("uds css --entry ./src --outFile dist/uds.css")}`);
|
|
36
|
+
require_print.print("");
|
|
37
|
+
require_print.print(`${require_colors.magenta("Theme mode")} (with uds.theme.ts):`);
|
|
38
|
+
require_print.print(` ${require_colors.gray("uds css --theme uds.theme.ts --outFile dist/uds.css")}`);
|
|
39
|
+
require_print.print("");
|
|
40
|
+
require_print.print(`${require_colors.magenta("Example uds.theme.ts:")}`);
|
|
41
|
+
require_print.print(require_colors.gray(` import { defineTheme } from '@yahoo/uds';
|
|
42
|
+
|
|
43
|
+
export default defineTheme({
|
|
44
|
+
config: './uds.config.ts',
|
|
45
|
+
entry: './src',
|
|
46
|
+
colorModes: ['dark'],
|
|
47
|
+
css: {
|
|
48
|
+
preflight: true,
|
|
49
|
+
fontFaceDeclarations: true,
|
|
50
|
+
enableSystemColorMode: false, // Auto dark mode via prefers-color-scheme
|
|
51
|
+
disableOverrideTailwindTheme: true // Don't merge into Tailwind defaults
|
|
52
|
+
}
|
|
53
|
+
});`));
|
|
54
|
+
require_print.print("");
|
|
55
|
+
};
|
|
56
|
+
const makeCSSCommand = (getContext) => ({
|
|
57
|
+
name: "css",
|
|
58
|
+
description: "Generate CSS for app",
|
|
59
|
+
tag: "hidden",
|
|
60
|
+
run: async (props) => {
|
|
61
|
+
const { variants, autoVariants, componentData } = await getContext();
|
|
62
|
+
if (require_css_helpers.shouldShowHelp(props.options)) {
|
|
63
|
+
showHelp();
|
|
64
|
+
return;
|
|
65
|
+
}
|
|
66
|
+
if (require_css_helpers.isInitCommand(props.first)) {
|
|
67
|
+
await require_nodeUtils.scaffoldThemeConfig(require_css_helpers.getCssInitOptions(props.options));
|
|
68
|
+
return;
|
|
69
|
+
}
|
|
70
|
+
await require_runner.runCssCommand(require_css_helpers.getCssRunOptions(process.cwd(), props.options), {
|
|
71
|
+
variants,
|
|
72
|
+
autoVariants,
|
|
73
|
+
componentData
|
|
74
|
+
});
|
|
75
|
+
}
|
|
76
|
+
});
|
|
77
|
+
|
|
78
|
+
//#endregion
|
|
79
|
+
exports.makeCSSCommand = makeCSSCommand;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
+
|
|
3
|
+
//#region ../tailwind/dist/commands/css.helpers.js
|
|
4
|
+
/*! © 2026 Yahoo, Inc. UDS Tailwind and Purger v0.0.0-development */
|
|
5
|
+
const isTruthyFlag = (value) => value === true || value === "true";
|
|
6
|
+
const stringOption = (value) => typeof value === "string" ? value : void 0;
|
|
7
|
+
const shouldShowHelp = (options) => isTruthyFlag(options.help) || isTruthyFlag(options.h);
|
|
8
|
+
const isInitCommand = (firstArg) => firstArg === "init";
|
|
9
|
+
const getCssInitOptions = (options) => ({
|
|
10
|
+
force: isTruthyFlag(options.force),
|
|
11
|
+
configPath: stringOption(options.config),
|
|
12
|
+
entry: stringOption(options.entry),
|
|
13
|
+
outputPath: stringOption(options.outFile)
|
|
14
|
+
});
|
|
15
|
+
const getCssRunOptions = (workspaceDir, options) => {
|
|
16
|
+
return {
|
|
17
|
+
workspaceDir,
|
|
18
|
+
outFile: stringOption(options.outFile) ?? "dist/uds.css",
|
|
19
|
+
themeConfigPath: stringOption(options.theme) ?? "uds.theme.ts",
|
|
20
|
+
scope: stringOption(options.scope),
|
|
21
|
+
entryOption: stringOption(options.entry),
|
|
22
|
+
configOption: stringOption(options.config),
|
|
23
|
+
watch: isTruthyFlag(options.watch) || isTruthyFlag(options.w),
|
|
24
|
+
silent: isTruthyFlag(options.silent) || isTruthyFlag(options.s)
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
//#endregion
|
|
29
|
+
exports.getCssInitOptions = getCssInitOptions;
|
|
30
|
+
exports.getCssRunOptions = getCssRunOptions;
|
|
31
|
+
exports.isInitCommand = isInitCommand;
|
|
32
|
+
exports.shouldShowHelp = shouldShowHelp;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
+
//#region ../tailwind/dist/commands/css.helpers.js
|
|
3
|
+
/*! © 2026 Yahoo, Inc. UDS Tailwind and Purger v0.0.0-development */
|
|
4
|
+
const isTruthyFlag = (value) => value === true || value === "true";
|
|
5
|
+
const stringOption = (value) => typeof value === "string" ? value : void 0;
|
|
6
|
+
const shouldShowHelp = (options) => isTruthyFlag(options.help) || isTruthyFlag(options.h);
|
|
7
|
+
const isInitCommand = (firstArg) => firstArg === "init";
|
|
8
|
+
const getCssInitOptions = (options) => ({
|
|
9
|
+
force: isTruthyFlag(options.force),
|
|
10
|
+
configPath: stringOption(options.config),
|
|
11
|
+
entry: stringOption(options.entry),
|
|
12
|
+
outputPath: stringOption(options.outFile)
|
|
13
|
+
});
|
|
14
|
+
const getCssRunOptions = (workspaceDir, options) => {
|
|
15
|
+
return {
|
|
16
|
+
workspaceDir,
|
|
17
|
+
outFile: stringOption(options.outFile) ?? "dist/uds.css",
|
|
18
|
+
themeConfigPath: stringOption(options.theme) ?? "uds.theme.ts",
|
|
19
|
+
scope: stringOption(options.scope),
|
|
20
|
+
entryOption: stringOption(options.entry),
|
|
21
|
+
configOption: stringOption(options.config),
|
|
22
|
+
watch: isTruthyFlag(options.watch) || isTruthyFlag(options.w),
|
|
23
|
+
silent: isTruthyFlag(options.silent) || isTruthyFlag(options.s)
|
|
24
|
+
};
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
//#endregion
|
|
28
|
+
export { getCssInitOptions, getCssRunOptions, isInitCommand, shouldShowHelp };
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
+
import { cyan, gray, green, magenta } from "../../../cli/dist/lib/colors.js";
|
|
3
|
+
import { print } from "../../../cli/dist/lib/print.js";
|
|
4
|
+
import { scaffoldThemeConfig } from "../css/nodeUtils.js";
|
|
5
|
+
import { runCssCommand } from "../css/runner.js";
|
|
6
|
+
import { getCssInitOptions, getCssRunOptions, isInitCommand, shouldShowHelp } from "./css.helpers.js";
|
|
7
|
+
|
|
8
|
+
//#region ../tailwind/dist/commands/css.js
|
|
9
|
+
/*! © 2026 Yahoo, Inc. UDS Tailwind and Purger v0.0.0-development */
|
|
10
|
+
const showHelp = () => {
|
|
11
|
+
print("");
|
|
12
|
+
print(`${green("uds css")} - Generate CSS for app`);
|
|
13
|
+
print("");
|
|
14
|
+
print(`${magenta("Usage:")}`);
|
|
15
|
+
print(` ${cyan("uds css")} [options]`);
|
|
16
|
+
print(` ${cyan("uds css init")} [options]`);
|
|
17
|
+
print("");
|
|
18
|
+
print(`${magenta("Commands:")}`);
|
|
19
|
+
print(` ${cyan("init")} Create a new uds.theme.ts file`);
|
|
20
|
+
print("");
|
|
21
|
+
print(`${magenta("Options:")}`);
|
|
22
|
+
print(` ${cyan("--entry <path>")} Entry directory to scan (default: /src/)`);
|
|
23
|
+
print(` ${cyan("--outFile <path>")} Output CSS file (default: dist/uds.css)`);
|
|
24
|
+
print(` ${cyan("--config <path>")} Path to uds.config.ts for tokens`);
|
|
25
|
+
print(` ${cyan("--theme <path>")} Path to uds.theme.ts (default: uds.theme.ts)`);
|
|
26
|
+
print(` ${cyan("--watch, -w")} Watch for file changes and regenerate`);
|
|
27
|
+
print(` ${cyan("--silent, -s")} Suppress output logging`);
|
|
28
|
+
print(` ${cyan("--force")} Overwrite existing uds.theme.ts (for init)`);
|
|
29
|
+
print(` ${cyan("--help, -h")} Show this help message`);
|
|
30
|
+
print("");
|
|
31
|
+
print(`${magenta("Initialize theme config:")}`);
|
|
32
|
+
print(` ${gray("uds css init")}`);
|
|
33
|
+
print("");
|
|
34
|
+
print(`${magenta("Simple mode")} (no uds.theme.ts):`);
|
|
35
|
+
print(` ${gray("uds css --entry ./src --outFile dist/uds.css")}`);
|
|
36
|
+
print("");
|
|
37
|
+
print(`${magenta("Theme mode")} (with uds.theme.ts):`);
|
|
38
|
+
print(` ${gray("uds css --theme uds.theme.ts --outFile dist/uds.css")}`);
|
|
39
|
+
print("");
|
|
40
|
+
print(`${magenta("Example uds.theme.ts:")}`);
|
|
41
|
+
print(gray(` import { defineTheme } from '@yahoo/uds';
|
|
42
|
+
|
|
43
|
+
export default defineTheme({
|
|
44
|
+
config: './uds.config.ts',
|
|
45
|
+
entry: './src',
|
|
46
|
+
colorModes: ['dark'],
|
|
47
|
+
css: {
|
|
48
|
+
preflight: true,
|
|
49
|
+
fontFaceDeclarations: true,
|
|
50
|
+
enableSystemColorMode: false, // Auto dark mode via prefers-color-scheme
|
|
51
|
+
disableOverrideTailwindTheme: true // Don't merge into Tailwind defaults
|
|
52
|
+
}
|
|
53
|
+
});`));
|
|
54
|
+
print("");
|
|
55
|
+
};
|
|
56
|
+
const makeCSSCommand = (getContext) => ({
|
|
57
|
+
name: "css",
|
|
58
|
+
description: "Generate CSS for app",
|
|
59
|
+
tag: "hidden",
|
|
60
|
+
run: async (props) => {
|
|
61
|
+
const { variants, autoVariants, componentData } = await getContext();
|
|
62
|
+
if (shouldShowHelp(props.options)) {
|
|
63
|
+
showHelp();
|
|
64
|
+
return;
|
|
65
|
+
}
|
|
66
|
+
if (isInitCommand(props.first)) {
|
|
67
|
+
await scaffoldThemeConfig(getCssInitOptions(props.options));
|
|
68
|
+
return;
|
|
69
|
+
}
|
|
70
|
+
await runCssCommand(getCssRunOptions(process.cwd(), props.options), {
|
|
71
|
+
variants,
|
|
72
|
+
autoVariants,
|
|
73
|
+
componentData
|
|
74
|
+
});
|
|
75
|
+
}
|
|
76
|
+
});
|
|
77
|
+
|
|
78
|
+
//#endregion
|
|
79
|
+
export { makeCSSCommand };
|
|
@@ -23,43 +23,45 @@ const makeGenerateComponentDataCommand = (getContext) => ({
|
|
|
23
23
|
require_print.print("Scanning components in:", componentsDir);
|
|
24
24
|
const componentPaths = await require_componentAnalyzer.scanComponentFiles(componentsDir);
|
|
25
25
|
require_print.print(`Found ${componentPaths.size} components`);
|
|
26
|
-
const
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
26
|
+
const componentDataEntries = await Promise.all([...componentPaths].map(async ([name, filePath]) => {
|
|
27
|
+
try {
|
|
28
|
+
project.addSourceFileAtPath(filePath);
|
|
29
|
+
const info = require_componentAnalyzer.analyzeComponent(project, filePath);
|
|
30
|
+
return info ? [name, serializeComponentInfo(info)] : null;
|
|
31
|
+
} catch (error) {
|
|
32
|
+
console.warn(`Warning: Could not analyze ${name}:`, error);
|
|
33
|
+
return null;
|
|
34
|
+
}
|
|
35
|
+
}));
|
|
36
|
+
const componentData = Object.fromEntries(componentDataEntries.filter((entry) => Boolean(entry)));
|
|
34
37
|
(0, node_fs.writeFileSync)(outputFile, JSON.stringify(componentData, null, 2));
|
|
35
38
|
require_print.print(`Generated component data for ${Object.keys(componentData).length} components`);
|
|
36
39
|
require_print.print(`Output written to: ${outputFile}`);
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
40
|
+
const totals = Object.values(componentData).reduce((acc, comp) => ({
|
|
41
|
+
totalDefaults: acc.totalDefaults + Object.keys(comp.defaultProps).length,
|
|
42
|
+
totalLiterals: acc.totalLiterals + Object.keys(comp.getStylesLiterals).length,
|
|
43
|
+
totalInternalComponents: acc.totalInternalComponents + comp.internalComponents.length
|
|
44
|
+
}), {
|
|
45
|
+
totalDefaults: 0,
|
|
46
|
+
totalLiterals: 0,
|
|
47
|
+
totalInternalComponents: 0
|
|
48
|
+
});
|
|
45
49
|
require_print.print("\nStats:");
|
|
46
|
-
require_print.print(` Default props: ${totalDefaults}`);
|
|
47
|
-
require_print.print(` getStyles literals: ${totalLiterals}`);
|
|
48
|
-
require_print.print(` Internal component refs: ${totalInternalComponents}`);
|
|
50
|
+
require_print.print(` Default props: ${totals.totalDefaults}`);
|
|
51
|
+
require_print.print(` getStyles literals: ${totals.totalLiterals}`);
|
|
52
|
+
require_print.print(` Internal component refs: ${totals.totalInternalComponents}`);
|
|
49
53
|
}
|
|
50
54
|
});
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
};
|
|
62
|
-
}
|
|
55
|
+
const serializeComponentInfo = (info) => ({
|
|
56
|
+
name: info.name,
|
|
57
|
+
defaultProps: Object.fromEntries(info.defaultProps),
|
|
58
|
+
getStylesLiterals: Object.fromEntries(info.getStylesLiterals),
|
|
59
|
+
cxLiterals: info.cxLiterals,
|
|
60
|
+
internalComponents: info.internalComponents,
|
|
61
|
+
internalComponentProps: Object.fromEntries(Array.from(info.internalComponentProps.entries()).map(([key, propsMap]) => [key, Object.fromEntries(propsMap)])),
|
|
62
|
+
propToVariantKeys: Object.fromEntries(info.propToVariantKeys),
|
|
63
|
+
motionVarPrefixes: info.motionVarPrefixes
|
|
64
|
+
});
|
|
63
65
|
|
|
64
66
|
//#endregion
|
|
65
67
|
exports.makeGenerateComponentDataCommand = makeGenerateComponentDataCommand;
|
|
@@ -22,43 +22,45 @@ const makeGenerateComponentDataCommand = (getContext) => ({
|
|
|
22
22
|
print("Scanning components in:", componentsDir);
|
|
23
23
|
const componentPaths = await scanComponentFiles(componentsDir);
|
|
24
24
|
print(`Found ${componentPaths.size} components`);
|
|
25
|
-
const
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
25
|
+
const componentDataEntries = await Promise.all([...componentPaths].map(async ([name, filePath]) => {
|
|
26
|
+
try {
|
|
27
|
+
project.addSourceFileAtPath(filePath);
|
|
28
|
+
const info = analyzeComponent(project, filePath);
|
|
29
|
+
return info ? [name, serializeComponentInfo(info)] : null;
|
|
30
|
+
} catch (error) {
|
|
31
|
+
console.warn(`Warning: Could not analyze ${name}:`, error);
|
|
32
|
+
return null;
|
|
33
|
+
}
|
|
34
|
+
}));
|
|
35
|
+
const componentData = Object.fromEntries(componentDataEntries.filter((entry) => Boolean(entry)));
|
|
33
36
|
writeFileSync(outputFile, JSON.stringify(componentData, null, 2));
|
|
34
37
|
print(`Generated component data for ${Object.keys(componentData).length} components`);
|
|
35
38
|
print(`Output written to: ${outputFile}`);
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
39
|
+
const totals = Object.values(componentData).reduce((acc, comp) => ({
|
|
40
|
+
totalDefaults: acc.totalDefaults + Object.keys(comp.defaultProps).length,
|
|
41
|
+
totalLiterals: acc.totalLiterals + Object.keys(comp.getStylesLiterals).length,
|
|
42
|
+
totalInternalComponents: acc.totalInternalComponents + comp.internalComponents.length
|
|
43
|
+
}), {
|
|
44
|
+
totalDefaults: 0,
|
|
45
|
+
totalLiterals: 0,
|
|
46
|
+
totalInternalComponents: 0
|
|
47
|
+
});
|
|
44
48
|
print("\nStats:");
|
|
45
|
-
print(` Default props: ${totalDefaults}`);
|
|
46
|
-
print(` getStyles literals: ${totalLiterals}`);
|
|
47
|
-
print(` Internal component refs: ${totalInternalComponents}`);
|
|
49
|
+
print(` Default props: ${totals.totalDefaults}`);
|
|
50
|
+
print(` getStyles literals: ${totals.totalLiterals}`);
|
|
51
|
+
print(` Internal component refs: ${totals.totalInternalComponents}`);
|
|
48
52
|
}
|
|
49
53
|
});
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
};
|
|
61
|
-
}
|
|
54
|
+
const serializeComponentInfo = (info) => ({
|
|
55
|
+
name: info.name,
|
|
56
|
+
defaultProps: Object.fromEntries(info.defaultProps),
|
|
57
|
+
getStylesLiterals: Object.fromEntries(info.getStylesLiterals),
|
|
58
|
+
cxLiterals: info.cxLiterals,
|
|
59
|
+
internalComponents: info.internalComponents,
|
|
60
|
+
internalComponentProps: Object.fromEntries(Array.from(info.internalComponentProps.entries()).map(([key, propsMap]) => [key, Object.fromEntries(propsMap)])),
|
|
61
|
+
propToVariantKeys: Object.fromEntries(info.propToVariantKeys),
|
|
62
|
+
motionVarPrefixes: info.motionVarPrefixes
|
|
63
|
+
});
|
|
62
64
|
|
|
63
65
|
//#endregion
|
|
64
66
|
export { makeGenerateComponentDataCommand };
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
-
const require_analytics = require('../../../cli/dist/utils/analytics.cjs');
|
|
3
2
|
const require_print = require('../../../cli/dist/lib/print.cjs');
|
|
4
3
|
const require_spinner = require('../../../cli/dist/lib/spinner.cjs');
|
|
5
|
-
const require_purgeCSS = require('../purger/legacy/purgeCSS.cjs');
|
|
6
4
|
const require_purge = require('../purger/optimized/purge.cjs');
|
|
5
|
+
const require_purgeCSS = require('../purger/legacy/purgeCSS.cjs');
|
|
7
6
|
|
|
8
7
|
//#region ../tailwind/dist/commands/purge.js
|
|
9
8
|
/*! © 2026 Yahoo, Inc. UDS Tailwind and Purger v0.0.0-development */
|
|
@@ -28,7 +27,7 @@ const makePurgeCommand = (getContext) => ({
|
|
|
28
27
|
require_print.print(` Files scanned: ${result.stats.filesScanned}`);
|
|
29
28
|
require_print.print(` Spreads traced: ${result.stats.spreadsTraced}`);
|
|
30
29
|
require_print.print(` Expressions resolved: ${result.stats.expressionsResolved}`);
|
|
31
|
-
return
|
|
30
|
+
return;
|
|
32
31
|
} catch (error) {
|
|
33
32
|
if (error instanceof Error) require_spinner.spinStop("❌", error.message);
|
|
34
33
|
else require_spinner.spinStop("❌", "Purging css failed! Please reach out to #uds-ask channel for support.");
|
|
@@ -43,7 +42,7 @@ const makePurgeCommand = (getContext) => ({
|
|
|
43
42
|
output: typeof output === "string" ? output : void 0
|
|
44
43
|
});
|
|
45
44
|
require_spinner.spinStop("✅", "Purging css done!");
|
|
46
|
-
return
|
|
45
|
+
return;
|
|
47
46
|
} catch (error) {
|
|
48
47
|
if (error instanceof Error) require_spinner.spinStop("❌", error.message);
|
|
49
48
|
else require_spinner.spinStop("❌", "Purging css failed! Please reach out to #uds-ask channel for support.");
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
-
import { trackEvent } from "../../../cli/dist/utils/analytics.js";
|
|
3
2
|
import { print } from "../../../cli/dist/lib/print.js";
|
|
4
3
|
import { spinStart, spinStop } from "../../../cli/dist/lib/spinner.js";
|
|
5
|
-
import { purge } from "../purger/legacy/purgeCSS.js";
|
|
6
4
|
import { purgeOptimized } from "../purger/optimized/purge.js";
|
|
5
|
+
import { purge } from "../purger/legacy/purgeCSS.js";
|
|
7
6
|
|
|
8
7
|
//#region ../tailwind/dist/commands/purge.js
|
|
9
8
|
/*! © 2026 Yahoo, Inc. UDS Tailwind and Purger v0.0.0-development */
|
|
@@ -28,7 +27,7 @@ const makePurgeCommand = (getContext) => ({
|
|
|
28
27
|
print(` Files scanned: ${result.stats.filesScanned}`);
|
|
29
28
|
print(` Spreads traced: ${result.stats.spreadsTraced}`);
|
|
30
29
|
print(` Expressions resolved: ${result.stats.expressionsResolved}`);
|
|
31
|
-
return
|
|
30
|
+
return;
|
|
32
31
|
} catch (error) {
|
|
33
32
|
if (error instanceof Error) spinStop("❌", error.message);
|
|
34
33
|
else spinStop("❌", "Purging css failed! Please reach out to #uds-ask channel for support.");
|
|
@@ -43,7 +42,7 @@ const makePurgeCommand = (getContext) => ({
|
|
|
43
42
|
output: typeof output === "string" ? output : void 0
|
|
44
43
|
});
|
|
45
44
|
spinStop("✅", "Purging css done!");
|
|
46
|
-
return
|
|
45
|
+
return;
|
|
47
46
|
} catch (error) {
|
|
48
47
|
if (error instanceof Error) spinStop("❌", error.message);
|
|
49
48
|
else spinStop("❌", "Purging css failed! Please reach out to #uds-ask channel for support.");
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
+
const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
|
|
3
|
+
const require_index = require('../../../config/dist/index.cjs');
|
|
4
|
+
const require_colors = require('../../../cli/dist/lib/colors.cjs');
|
|
5
|
+
const require_print = require('../../../cli/dist/lib/print.cjs');
|
|
6
|
+
const require_spinner = require('../../../cli/dist/lib/spinner.cjs');
|
|
7
|
+
const require_nodeUtils = require('./nodeUtils.cjs');
|
|
8
|
+
const require_safelist = require('../purger/optimized/utils/safelist.cjs');
|
|
9
|
+
const require_utils = require('./utils.cjs');
|
|
10
|
+
const require_generate_helpers = require('./generate.helpers.cjs');
|
|
11
|
+
let node_path = require("node:path");
|
|
12
|
+
node_path = require_runtime.__toESM(node_path);
|
|
13
|
+
let node_fs = require("node:fs");
|
|
14
|
+
node_fs = require_runtime.__toESM(node_fs);
|
|
15
|
+
let node_zlib = require("node:zlib");
|
|
16
|
+
let postcss = require("postcss");
|
|
17
|
+
postcss = require_runtime.__toESM(postcss);
|
|
18
|
+
|
|
19
|
+
//#region ../tailwind/dist/css/generate.js
|
|
20
|
+
/*! © 2026 Yahoo, Inc. UDS Tailwind and Purger v0.0.0-development */
|
|
21
|
+
const normalizeScope = (scope) => {
|
|
22
|
+
const trimmedScope = scope?.trim();
|
|
23
|
+
return trimmedScope ? trimmedScope : void 0;
|
|
24
|
+
};
|
|
25
|
+
/**
|
|
26
|
+
* Generate CSS from a safelist using Tailwind + PostCSS
|
|
27
|
+
* @param safelist - UDS component classes to include
|
|
28
|
+
* @param config - Token configuration
|
|
29
|
+
* @param options - Additional options
|
|
30
|
+
*/
|
|
31
|
+
const generateCSS = async (safelist, config, options) => {
|
|
32
|
+
const sourceCSS = "@tailwind base; @tailwind components; @tailwind utilities";
|
|
33
|
+
const contentDir = options?.contentDir ?? node_path.default.join(process.cwd(), "src");
|
|
34
|
+
const cssFlags = require_generate_helpers.getCssFeatureFlags(options?.cssOptions);
|
|
35
|
+
const optimizationConfig = options?.cssOptions?.optimization;
|
|
36
|
+
const scopeClass = normalizeScope(options?.scope) ?? normalizeScope(options?.cssOptions?.scope);
|
|
37
|
+
let css = await require_generate_helpers.applyScopedColorModeFix((await (0, postcss.default)(require_generate_helpers.buildPostcssPlugins({
|
|
38
|
+
tailwindPlugin: require_generate_helpers.createTailwindPlugin({
|
|
39
|
+
contentDir,
|
|
40
|
+
safelist,
|
|
41
|
+
config,
|
|
42
|
+
enablePreflight: cssFlags.enablePreflight,
|
|
43
|
+
enableFontFaceDeclarations: cssFlags.enableFontFaceDeclarations
|
|
44
|
+
}),
|
|
45
|
+
shouldPruneVars: cssFlags.shouldPruneVars,
|
|
46
|
+
safeVarPrefixes: options?.safeVarPrefixes ?? [],
|
|
47
|
+
scopeClass
|
|
48
|
+
})).process(sourceCSS, { from: void 0 })).css, scopeClass);
|
|
49
|
+
const optimizedCss = await require_generate_helpers.optimizeGeneratedCss({
|
|
50
|
+
css,
|
|
51
|
+
shouldOptimize: cssFlags.shouldOptimize,
|
|
52
|
+
optimizationConfig,
|
|
53
|
+
referenceCss: options?.referenceCss,
|
|
54
|
+
scopeClass
|
|
55
|
+
});
|
|
56
|
+
css = optimizedCss.css;
|
|
57
|
+
const sizeBytes = Buffer.byteLength(css, "utf8");
|
|
58
|
+
const sizeGzipBytes = (0, node_zlib.gzipSync)(css).length;
|
|
59
|
+
return {
|
|
60
|
+
css,
|
|
61
|
+
sizeBytes,
|
|
62
|
+
sizeGzipBytes,
|
|
63
|
+
classCount: safelist.length,
|
|
64
|
+
optimizationStats: optimizedCss.optimizationStats
|
|
65
|
+
};
|
|
66
|
+
};
|
|
67
|
+
/**
|
|
68
|
+
* Generate CSS in simple mode (no uds.theme.ts)
|
|
69
|
+
*/
|
|
70
|
+
const generateSimpleModeCSS = async (options) => {
|
|
71
|
+
const isWatch = options.isWatch === true;
|
|
72
|
+
const shouldLogStats = !(options.silent === true) && !isWatch;
|
|
73
|
+
const startTime = performance.now();
|
|
74
|
+
const colorModes = ["dark"];
|
|
75
|
+
let tokensConfig = require_index.defaultTokensConfig;
|
|
76
|
+
if (options.configPath) {
|
|
77
|
+
const loadedConfig = await require_nodeUtils.loadConfigFile(options.configPath);
|
|
78
|
+
if (loadedConfig) tokensConfig = loadedConfig;
|
|
79
|
+
else if (shouldLogStats) require_spinner.spinStop("⚠️", `Config file not found: ${options.configPath}, using defaults`);
|
|
80
|
+
}
|
|
81
|
+
const variantDefaults = require_utils.extractVariantDefaults(tokensConfig);
|
|
82
|
+
const entryDir = node_path.default.join(options.workspaceDir, options.entry);
|
|
83
|
+
const scanResult = await require_nodeUtils.scanDirectoryForSafelist(entryDir, colorModes, options.variants, options.autoVariants, options.componentData, variantDefaults);
|
|
84
|
+
const totalFilesScanned = scanResult.filesScanned;
|
|
85
|
+
const allClasses = [...scanResult.safelist];
|
|
86
|
+
const allComponents = new Set(scanResult.components);
|
|
87
|
+
const packageDirs = [entryDir];
|
|
88
|
+
const cssResult = await generateCSS(require_safelist.deduplicateSafelist([...allClasses, ...require_safelist.getThemeAndScaleClasses(colorModes)]), tokensConfig, {
|
|
89
|
+
scope: options.scope,
|
|
90
|
+
contentDir: entryDir,
|
|
91
|
+
safeVarPrefixes: [...require_utils.getMotionVarPrefixes(options.componentData, [...allComponents]), ...require_utils.getConfigurableCssVariables()]
|
|
92
|
+
});
|
|
93
|
+
const outputPath = node_path.default.isAbsolute(options.outFile) ? options.outFile : node_path.default.join(options.workspaceDir, options.outFile);
|
|
94
|
+
const outputDir = node_path.default.dirname(outputPath);
|
|
95
|
+
if (!node_fs.default.existsSync(outputDir)) node_fs.default.mkdirSync(outputDir, { recursive: true });
|
|
96
|
+
node_fs.default.writeFileSync(outputPath, cssResult.css);
|
|
97
|
+
const duration = Math.round(performance.now() - startTime);
|
|
98
|
+
if (shouldLogStats) require_generate_helpers.printSimpleModeStats({
|
|
99
|
+
outputPath,
|
|
100
|
+
totalFilesScanned,
|
|
101
|
+
classCount: cssResult.classCount,
|
|
102
|
+
sizeBytes: cssResult.sizeBytes,
|
|
103
|
+
sizeGzipBytes: cssResult.sizeGzipBytes,
|
|
104
|
+
duration,
|
|
105
|
+
scope: options.scope,
|
|
106
|
+
optimizationStats: cssResult.optimizationStats,
|
|
107
|
+
print: require_print.print,
|
|
108
|
+
magenta: require_colors.magenta,
|
|
109
|
+
cyan: require_colors.cyan,
|
|
110
|
+
yellow: require_colors.yellow
|
|
111
|
+
});
|
|
112
|
+
return {
|
|
113
|
+
success: true,
|
|
114
|
+
outputPath,
|
|
115
|
+
packageDirs
|
|
116
|
+
};
|
|
117
|
+
};
|
|
118
|
+
|
|
119
|
+
//#endregion
|
|
120
|
+
exports.generateCSS = generateCSS;
|
|
121
|
+
exports.generateSimpleModeCSS = generateSimpleModeCSS;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
|
|
2
|
+
import "../../../config/dist/index.cjs";
|
|
3
|
+
import { UDSCSSOptimizationOptions } from "./theme.cjs";
|
|
4
|
+
import { SafelistConfig } from "tailwindcss/types/config";
|
|
5
|
+
|
|
6
|
+
//#region ../tailwind/dist/css/generate.d.ts
|
|
7
|
+
//#region src/css/generate.d.ts
|
|
8
|
+
/**
|
|
9
|
+
* CSS generation options for uds.theme.ts
|
|
10
|
+
*/
|
|
11
|
+
interface UDSCSSOptions {
|
|
12
|
+
/** CSS scope wrapper class (optional) */
|
|
13
|
+
scope?: string;
|
|
14
|
+
/** Safelist of CSS classes to always include */
|
|
15
|
+
safelist?: SafelistConfig[];
|
|
16
|
+
/** CSS optimization settings */
|
|
17
|
+
optimization?: UDSCSSOptimizationOptions;
|
|
18
|
+
/** Include Tailwind preflight/reset styles (default: true) */
|
|
19
|
+
preflight?: boolean;
|
|
20
|
+
/** Include @font-face declarations (default: true) */
|
|
21
|
+
fontFaceDeclarations?: boolean;
|
|
22
|
+
/** Debounce delay (ms) for watch mode regenerations */
|
|
23
|
+
watchDebounce?: number;
|
|
24
|
+
}
|
|
25
|
+
/**
|
|
26
|
+
* Options for generateCSS function
|
|
27
|
+
*/
|
|
28
|
+
//#endregion
|
|
29
|
+
//#endregion
|
|
30
|
+
export { type UDSCSSOptions };
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
|
|
2
|
+
import "../../../config/dist/index.js";
|
|
3
|
+
import "../commands/generateComponentData.js";
|
|
4
|
+
import { UDSCSSOptimizationOptions } from "./theme.js";
|
|
5
|
+
import { SafelistConfig } from "tailwindcss/types/config";
|
|
6
|
+
|
|
7
|
+
//#region ../tailwind/dist/css/generate.d.ts
|
|
8
|
+
//#region src/css/generate.d.ts
|
|
9
|
+
/**
|
|
10
|
+
* CSS generation options for uds.theme.ts
|
|
11
|
+
*/
|
|
12
|
+
interface UDSCSSOptions {
|
|
13
|
+
/** CSS scope wrapper class (optional) */
|
|
14
|
+
scope?: string;
|
|
15
|
+
/** Safelist of CSS classes to always include */
|
|
16
|
+
safelist?: SafelistConfig[];
|
|
17
|
+
/** CSS optimization settings */
|
|
18
|
+
optimization?: UDSCSSOptimizationOptions;
|
|
19
|
+
/** Include Tailwind preflight/reset styles (default: true) */
|
|
20
|
+
preflight?: boolean;
|
|
21
|
+
/** Include @font-face declarations (default: true) */
|
|
22
|
+
fontFaceDeclarations?: boolean;
|
|
23
|
+
/** Debounce delay (ms) for watch mode regenerations */
|
|
24
|
+
watchDebounce?: number;
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Options for generateCSS function
|
|
28
|
+
*/
|
|
29
|
+
//#endregion
|
|
30
|
+
//#endregion
|
|
31
|
+
export { type UDSCSSOptions };
|