@yahoo/uds 3.173.1-beta.1 → 3.174.1
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/utils/index.cjs +3 -2
- package/dist/automated-config/dist/utils/index.js +3 -2
- package/dist/components/client/Menu/Menu.ItemCheckbox.d.cts +1 -1
- package/dist/components/client/Menu/Menu.ItemCheckbox.d.ts +1 -1
- package/dist/css/dist/css/generate.cjs +4 -1
- package/dist/css/dist/css/generate.helpers.cjs +2 -0
- package/dist/css/dist/css/generate.helpers.js +2 -0
- package/dist/css/dist/css/generate.js +4 -1
- package/dist/css/dist/css/runner.cjs +2 -0
- package/dist/css/dist/css/runner.js +2 -0
- package/dist/css/dist/postcss/filterUnusedVariantRules.cjs +71 -0
- package/dist/css/dist/postcss/filterUnusedVariantRules.js +70 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/index.cjs +3 -2
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/index.js +3 -2
- package/dist/tailwind-internal/dist/utils/getShadowStyles.d.cts +2 -2
- package/dist/tailwind-internal/dist/utils/getShadowStyles.d.ts +2 -2
- package/dist/uds/generated/componentData.cjs +239 -239
- package/dist/uds/generated/componentData.js +239 -239
- package/generated/componentData.json +366 -366
- package/package.json +1 -1
|
@@ -970,7 +970,7 @@ function generateConfigStyles(config, schema, theme, previewOptions, emit, gener
|
|
|
970
970
|
* @param schema - Production schema with defaults and variables
|
|
971
971
|
* @param theme - Tailwind theme function to resolve design tokens
|
|
972
972
|
* @param previewOptions - Options for generating preview mode class modifiers
|
|
973
|
-
* @returns CSS styles object with
|
|
973
|
+
* @returns CSS styles object with separate twin rules for default aliases
|
|
974
974
|
*/
|
|
975
975
|
const generateStylesInner = (config, schema, theme, previewOptions, generateStylesContext) => {
|
|
976
976
|
const styles = generateConfigStyles(config, schema, theme, previewOptions, previewOptions.emit ?? "exhaustive", generateStylesContext);
|
|
@@ -1035,7 +1035,8 @@ const generateStylesInner = (config, schema, theme, previewOptions, generateStyl
|
|
|
1035
1035
|
finalStyles[selector] = declarations;
|
|
1036
1036
|
continue;
|
|
1037
1037
|
}
|
|
1038
|
-
finalStyles[
|
|
1038
|
+
finalStyles[selector] = declarations;
|
|
1039
|
+
finalStyles[defaultsSelector] = declarations;
|
|
1039
1040
|
}
|
|
1040
1041
|
return finalStyles;
|
|
1041
1042
|
};
|
|
@@ -969,7 +969,7 @@ function generateConfigStyles(config, schema, theme, previewOptions, emit, gener
|
|
|
969
969
|
* @param schema - Production schema with defaults and variables
|
|
970
970
|
* @param theme - Tailwind theme function to resolve design tokens
|
|
971
971
|
* @param previewOptions - Options for generating preview mode class modifiers
|
|
972
|
-
* @returns CSS styles object with
|
|
972
|
+
* @returns CSS styles object with separate twin rules for default aliases
|
|
973
973
|
*/
|
|
974
974
|
const generateStylesInner = (config, schema, theme, previewOptions, generateStylesContext) => {
|
|
975
975
|
const styles = generateConfigStyles(config, schema, theme, previewOptions, previewOptions.emit ?? "exhaustive", generateStylesContext);
|
|
@@ -1034,7 +1034,8 @@ const generateStylesInner = (config, schema, theme, previewOptions, generateStyl
|
|
|
1034
1034
|
finalStyles[selector] = declarations;
|
|
1035
1035
|
continue;
|
|
1036
1036
|
}
|
|
1037
|
-
finalStyles[
|
|
1037
|
+
finalStyles[selector] = declarations;
|
|
1038
|
+
finalStyles[defaultsSelector] = declarations;
|
|
1038
1039
|
}
|
|
1039
1040
|
return finalStyles;
|
|
1040
1041
|
};
|
|
@@ -131,6 +131,6 @@ interface MenuItemCheckboxProps extends Omit<PressableProps, 'asChild'>, HtmlBut
|
|
|
131
131
|
*
|
|
132
132
|
* @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item)
|
|
133
133
|
**/
|
|
134
|
-
declare const MenuItemCheckbox: _$react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "
|
|
134
|
+
declare const MenuItemCheckbox: _$react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "hideEndIcon" | "rootProps" | "active"> & _$react.RefAttributes<HTMLDivElement>>;
|
|
135
135
|
//#endregion
|
|
136
136
|
export { MenuItemCheckbox, type MenuItemCheckboxProps };
|
|
@@ -132,6 +132,6 @@ interface MenuItemCheckboxProps extends Omit<PressableProps, 'asChild'>, HtmlBut
|
|
|
132
132
|
*
|
|
133
133
|
* @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item)
|
|
134
134
|
**/
|
|
135
|
-
declare const MenuItemCheckbox: _$react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "
|
|
135
|
+
declare const MenuItemCheckbox: _$react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "hideEndIcon" | "rootProps" | "active"> & _$react.RefAttributes<HTMLDivElement>>;
|
|
136
136
|
//#endregion
|
|
137
137
|
export { MenuItemCheckbox, type MenuItemCheckboxProps };
|
|
@@ -9,6 +9,7 @@ const require_nodeUtils = require("./nodeUtils.cjs");
|
|
|
9
9
|
const require_spinner = require("../packages/cli/dist/lib/spinner.cjs");
|
|
10
10
|
const require_index = require("../packages/config/dist/index.cjs");
|
|
11
11
|
const require_safelist = require("../purger/optimized/utils/safelist.cjs");
|
|
12
|
+
const require_filterUnusedVariantRules = require("../postcss/filterUnusedVariantRules.cjs");
|
|
12
13
|
const require_generate_helpers = require("./generate.helpers.cjs");
|
|
13
14
|
let node_fs = require("node:fs");
|
|
14
15
|
node_fs = require_runtime.__toESM(node_fs, 1);
|
|
@@ -53,7 +54,8 @@ const generateCSS = async (safelist, config, options) => {
|
|
|
53
54
|
shouldPruneVars: cssFlags.shouldPruneVars,
|
|
54
55
|
safeVarPrefixes: options?.safeVarPrefixes ?? [],
|
|
55
56
|
scopeClass,
|
|
56
|
-
otherBoundaryScopes: options?.otherBoundaryScopes ?? []
|
|
57
|
+
otherBoundaryScopes: options?.otherBoundaryScopes ?? [],
|
|
58
|
+
unusedVariantClasses: options?.variantClassMaps ? require_filterUnusedVariantRules.buildUnusedVariantClassSet(safelist, options.variantClassMaps) : void 0
|
|
57
59
|
});
|
|
58
60
|
const result = await require_perf.measureAsync("gen:postcss", () => (0, postcss.default)(plugins).process(sourceCSS, { from: void 0 }));
|
|
59
61
|
let css = await require_perf.measureAsync("gen:scoped-color-fix", () => require_generate_helpers.applyScopedColorModeFix(result.css, scopeClass));
|
|
@@ -106,6 +108,7 @@ const generateSimpleModeCSS = async (options) => {
|
|
|
106
108
|
]), tokensConfig, {
|
|
107
109
|
scope: options.scope,
|
|
108
110
|
contentDir: entryDirs,
|
|
111
|
+
variantClassMaps: [options.variants, options.autoVariants],
|
|
109
112
|
safeVarPrefixes: [...require_utils.getMotionVarPrefixes(options.componentData, [...allComponents]), ...require_utils.getConfigurableCssVariables()]
|
|
110
113
|
});
|
|
111
114
|
const outputPath = node_path.default.isAbsolute(options.outFile) ? options.outFile : node_path.default.join(options.workspaceDir, options.outFile);
|
|
@@ -8,6 +8,7 @@ const require_entryPoints = require("../../../tailwind-internal/dist/utils/entry
|
|
|
8
8
|
const require_pruneVars = require("../postcss/pruneVars.cjs");
|
|
9
9
|
const require_safelist$1 = require("../purger/optimized/utils/safelist.cjs");
|
|
10
10
|
const require_runner_helpers = require("./runner.helpers.cjs");
|
|
11
|
+
const require_filterUnusedVariantRules = require("../postcss/filterUnusedVariantRules.cjs");
|
|
11
12
|
const require_optimizeCSS = require("../utils/optimizeCSS.cjs");
|
|
12
13
|
const require_postcss = require("./postcss.cjs");
|
|
13
14
|
let node_fs = require("node:fs");
|
|
@@ -86,6 +87,7 @@ const createTailwindPlugin = async (options) => {
|
|
|
86
87
|
};
|
|
87
88
|
const buildPostcssPlugins = (options) => {
|
|
88
89
|
const plugins = [options.tailwindPlugin, (0, autoprefixer.default)()];
|
|
90
|
+
if (options.unusedVariantClasses && options.unusedVariantClasses.size > 0) plugins.splice(1, 0, require_filterUnusedVariantRules.filterUnusedVariantRulesPlugin(options.unusedVariantClasses));
|
|
89
91
|
if (options.shouldPruneVars) plugins.push(...require_pruneVars.getPruneVarPlugins(options.safeVarPrefixes));
|
|
90
92
|
if (options.scopeClass) plugins.push((0, postcss_scope.default)(options.scopeClass));
|
|
91
93
|
const otherBoundaryScopes = options.otherBoundaryScopes ?? [];
|
|
@@ -7,6 +7,7 @@ import { hasAllowedEntryFileExtension } from "../../../tailwind-internal/dist/ut
|
|
|
7
7
|
import { getPruneVarPlugins } from "../postcss/pruneVars.js";
|
|
8
8
|
import { getInternalSafelistClasses } from "../purger/optimized/utils/safelist.js";
|
|
9
9
|
import { formatCssDuration } from "./runner.helpers.js";
|
|
10
|
+
import { filterUnusedVariantRulesPlugin } from "../postcss/filterUnusedVariantRules.js";
|
|
10
11
|
import { optimizeCSS } from "../utils/optimizeCSS.js";
|
|
11
12
|
import { appendIsolationExclusionPlugin, fixScopedColorModeSelectorsPlugin, fixScopedSelfOrParentSelectorsPlugin } from "./postcss.js";
|
|
12
13
|
import fs from "node:fs";
|
|
@@ -80,6 +81,7 @@ const createTailwindPlugin = async (options) => {
|
|
|
80
81
|
};
|
|
81
82
|
const buildPostcssPlugins = (options) => {
|
|
82
83
|
const plugins = [options.tailwindPlugin, autoprefixer()];
|
|
84
|
+
if (options.unusedVariantClasses && options.unusedVariantClasses.size > 0) plugins.splice(1, 0, filterUnusedVariantRulesPlugin(options.unusedVariantClasses));
|
|
83
85
|
if (options.shouldPruneVars) plugins.push(...getPruneVarPlugins(options.safeVarPrefixes));
|
|
84
86
|
if (options.scopeClass) plugins.push(postcssScope(options.scopeClass));
|
|
85
87
|
const otherBoundaryScopes = options.otherBoundaryScopes ?? [];
|
|
@@ -8,6 +8,7 @@ import { loadConfigFile, scanDirectoriesForSafelist } from "./nodeUtils.js";
|
|
|
8
8
|
import { spinStop } from "../packages/cli/dist/lib/spinner.js";
|
|
9
9
|
import { defaultTokensConfig } from "../packages/config/dist/index.js";
|
|
10
10
|
import { deduplicateSafelist, getInternalSafelistClasses, getThemeAndScaleClasses } from "../purger/optimized/utils/safelist.js";
|
|
11
|
+
import { buildUnusedVariantClassSet } from "../postcss/filterUnusedVariantRules.js";
|
|
11
12
|
import { applyScopedColorModeFix, buildPostcssPlugins, createTailwindPlugin, getCssFeatureFlags, getInternalIconModeCss, optimizeGeneratedCss, printSimpleModeStats } from "./generate.helpers.js";
|
|
12
13
|
import fs from "node:fs";
|
|
13
14
|
import path from "node:path";
|
|
@@ -49,7 +50,8 @@ const generateCSS = async (safelist, config, options) => {
|
|
|
49
50
|
shouldPruneVars: cssFlags.shouldPruneVars,
|
|
50
51
|
safeVarPrefixes: options?.safeVarPrefixes ?? [],
|
|
51
52
|
scopeClass,
|
|
52
|
-
otherBoundaryScopes: options?.otherBoundaryScopes ?? []
|
|
53
|
+
otherBoundaryScopes: options?.otherBoundaryScopes ?? [],
|
|
54
|
+
unusedVariantClasses: options?.variantClassMaps ? buildUnusedVariantClassSet(safelist, options.variantClassMaps) : void 0
|
|
53
55
|
});
|
|
54
56
|
const result = await measureAsync("gen:postcss", () => postcss(plugins).process(sourceCSS, { from: void 0 }));
|
|
55
57
|
let css = await measureAsync("gen:scoped-color-fix", () => applyScopedColorModeFix(result.css, scopeClass));
|
|
@@ -102,6 +104,7 @@ const generateSimpleModeCSS = async (options) => {
|
|
|
102
104
|
]), tokensConfig, {
|
|
103
105
|
scope: options.scope,
|
|
104
106
|
contentDir: entryDirs,
|
|
107
|
+
variantClassMaps: [options.variants, options.autoVariants],
|
|
105
108
|
safeVarPrefixes: [...getMotionVarPrefixes(options.componentData, [...allComponents]), ...getConfigurableCssVariables()]
|
|
106
109
|
});
|
|
107
110
|
const outputPath = path.isAbsolute(options.outFile) ? options.outFile : path.join(options.workspaceDir, options.outFile);
|
|
@@ -358,6 +358,7 @@ const runThemeMode = async (options, context) => {
|
|
|
358
358
|
emit
|
|
359
359
|
},
|
|
360
360
|
otherBoundaryScopes: allBoundarySelectors,
|
|
361
|
+
variantClassMaps: [context.variants, context.autoVariants],
|
|
361
362
|
safeVarPrefixes: [
|
|
362
363
|
...require_utils.getMotionVarPrefixes(context.componentData, allMotionComponents),
|
|
363
364
|
...require_utils.getConfigurableCssVariables(),
|
|
@@ -393,6 +394,7 @@ const runThemeMode = async (options, context) => {
|
|
|
393
394
|
emit
|
|
394
395
|
},
|
|
395
396
|
otherBoundaryScopes: allBoundarySelectors.filter((selector) => selector !== scopedPackageTarget.scopeClass),
|
|
397
|
+
variantClassMaps: [context.variants, context.autoVariants],
|
|
396
398
|
referenceCss: themeConfig.css?.optimization?.deduplicateScopedCss === false ? void 0 : mainCssResult.css,
|
|
397
399
|
safeVarPrefixes: [
|
|
398
400
|
...require_utils.getMotionVarPrefixes(context.componentData, [...packageScanResult.components]),
|
|
@@ -356,6 +356,7 @@ const runThemeMode = async (options, context) => {
|
|
|
356
356
|
emit
|
|
357
357
|
},
|
|
358
358
|
otherBoundaryScopes: allBoundarySelectors,
|
|
359
|
+
variantClassMaps: [context.variants, context.autoVariants],
|
|
359
360
|
safeVarPrefixes: [
|
|
360
361
|
...getMotionVarPrefixes(context.componentData, allMotionComponents),
|
|
361
362
|
...getConfigurableCssVariables(),
|
|
@@ -391,6 +392,7 @@ const runThemeMode = async (options, context) => {
|
|
|
391
392
|
emit
|
|
392
393
|
},
|
|
393
394
|
otherBoundaryScopes: allBoundarySelectors.filter((selector) => selector !== scopedPackageTarget.scopeClass),
|
|
395
|
+
variantClassMaps: [context.variants, context.autoVariants],
|
|
394
396
|
referenceCss: themeConfig.css?.optimization?.deduplicateScopedCss === false ? void 0 : mainCssResult.css,
|
|
395
397
|
safeVarPrefixes: [
|
|
396
398
|
...getMotionVarPrefixes(context.componentData, [...packageScanResult.components]),
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
+
//#region ../css/dist/postcss/filterUnusedVariantRules.mjs
|
|
3
|
+
/*! © 2026 Yahoo, Inc. UDS CSS v0.0.0-development */
|
|
4
|
+
const isPatternEntry = (entry) => typeof entry === "object" && entry !== null && entry.pattern instanceof RegExp;
|
|
5
|
+
/**
|
|
6
|
+
* Computes the variant classes that are enumerated by the variant class maps
|
|
7
|
+
* but absent from the safelist, for every axis the scan DID find at least one
|
|
8
|
+
* class of.
|
|
9
|
+
*
|
|
10
|
+
* Rationale: Tailwind v3 emits an `addComponents` rule when ANY class in its
|
|
11
|
+
* selector matches a candidate, so variant-agnostic classes shared across
|
|
12
|
+
* selectors (componentState classes like `…-value-checked-root`, default
|
|
13
|
+
* aliases) ship rules for variants the app never uses. Restricting to axes
|
|
14
|
+
* with at least one safelisted member keeps the filter conservative: an axis
|
|
15
|
+
* the scanner never matched contributes nothing, so components that only
|
|
16
|
+
* appear through another bundle or through raw `content` strings are left
|
|
17
|
+
* untouched.
|
|
18
|
+
*/
|
|
19
|
+
const buildUnusedVariantClassSet = (safelist, variantClassMaps) => {
|
|
20
|
+
const safelistedClasses = new Set(safelist.filter((entry) => typeof entry === "string"));
|
|
21
|
+
const patterns = safelist.filter(isPatternEntry).map((entry) => entry.pattern);
|
|
22
|
+
const isSafelisted = (className) => safelistedClasses.has(className) || patterns.some((pattern) => pattern.test(className));
|
|
23
|
+
const axes = /* @__PURE__ */ new Map();
|
|
24
|
+
for (const map of variantClassMaps) for (const [axisKey, values] of Object.entries(map)) {
|
|
25
|
+
const axisClasses = axes.get(axisKey) ?? /* @__PURE__ */ new Set();
|
|
26
|
+
for (const className of Object.values(values)) if (typeof className === "string" && !/\s/.test(className)) axisClasses.add(className);
|
|
27
|
+
axes.set(axisKey, axisClasses);
|
|
28
|
+
}
|
|
29
|
+
const unused = /* @__PURE__ */ new Set();
|
|
30
|
+
for (const axisClasses of axes.values()) {
|
|
31
|
+
let axisIsScanned = false;
|
|
32
|
+
for (const className of axisClasses) if (isSafelisted(className)) {
|
|
33
|
+
axisIsScanned = true;
|
|
34
|
+
break;
|
|
35
|
+
}
|
|
36
|
+
if (!axisIsScanned) continue;
|
|
37
|
+
for (const className of axisClasses) if (!isSafelisted(className)) unused.add(className);
|
|
38
|
+
}
|
|
39
|
+
return unused;
|
|
40
|
+
};
|
|
41
|
+
const CLASS_TOKEN_RE = /\.((?:[a-zA-Z0-9_-]|\\.)+)/g;
|
|
42
|
+
const selectorReferencesUnusedClass = (selector, unused) => {
|
|
43
|
+
for (const match of selector.matchAll(CLASS_TOKEN_RE)) if (unused.has(match[1])) return true;
|
|
44
|
+
return false;
|
|
45
|
+
};
|
|
46
|
+
/**
|
|
47
|
+
* PostCSS plugin dropping selector alternatives (and whole rules) that
|
|
48
|
+
* reference a variant class in `unused`. Runs on the Tailwind-generated
|
|
49
|
+
* bundle, after which emptied `@media`/`@supports` blocks are removed. Placed
|
|
50
|
+
* before var pruning so variables only referenced by dropped rules get pruned
|
|
51
|
+
* too.
|
|
52
|
+
*/
|
|
53
|
+
const filterUnusedVariantRulesPlugin = (unused) => ({
|
|
54
|
+
postcssPlugin: "uds-filter-unused-variant-rules",
|
|
55
|
+
Once(root) {
|
|
56
|
+
if (unused.size === 0) return;
|
|
57
|
+
root.walkRules((rule) => {
|
|
58
|
+
if (!rule.selector.includes(".uds-")) return;
|
|
59
|
+
const kept = rule.selectors.filter((selector) => !selectorReferencesUnusedClass(selector, unused));
|
|
60
|
+
if (kept.length === rule.selectors.length) return;
|
|
61
|
+
if (kept.length === 0) rule.remove();
|
|
62
|
+
else rule.selector = kept.join(", ");
|
|
63
|
+
});
|
|
64
|
+
root.walkAtRules((atRule) => {
|
|
65
|
+
if ((atRule.name === "media" || atRule.name === "supports") && (atRule.nodes?.length ?? 0) === 0) atRule.remove();
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
});
|
|
69
|
+
//#endregion
|
|
70
|
+
exports.buildUnusedVariantClassSet = buildUnusedVariantClassSet;
|
|
71
|
+
exports.filterUnusedVariantRulesPlugin = filterUnusedVariantRulesPlugin;
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
+
//#region ../css/dist/postcss/filterUnusedVariantRules.mjs
|
|
3
|
+
/*! © 2026 Yahoo, Inc. UDS CSS v0.0.0-development */
|
|
4
|
+
const isPatternEntry = (entry) => typeof entry === "object" && entry !== null && entry.pattern instanceof RegExp;
|
|
5
|
+
/**
|
|
6
|
+
* Computes the variant classes that are enumerated by the variant class maps
|
|
7
|
+
* but absent from the safelist, for every axis the scan DID find at least one
|
|
8
|
+
* class of.
|
|
9
|
+
*
|
|
10
|
+
* Rationale: Tailwind v3 emits an `addComponents` rule when ANY class in its
|
|
11
|
+
* selector matches a candidate, so variant-agnostic classes shared across
|
|
12
|
+
* selectors (componentState classes like `…-value-checked-root`, default
|
|
13
|
+
* aliases) ship rules for variants the app never uses. Restricting to axes
|
|
14
|
+
* with at least one safelisted member keeps the filter conservative: an axis
|
|
15
|
+
* the scanner never matched contributes nothing, so components that only
|
|
16
|
+
* appear through another bundle or through raw `content` strings are left
|
|
17
|
+
* untouched.
|
|
18
|
+
*/
|
|
19
|
+
const buildUnusedVariantClassSet = (safelist, variantClassMaps) => {
|
|
20
|
+
const safelistedClasses = new Set(safelist.filter((entry) => typeof entry === "string"));
|
|
21
|
+
const patterns = safelist.filter(isPatternEntry).map((entry) => entry.pattern);
|
|
22
|
+
const isSafelisted = (className) => safelistedClasses.has(className) || patterns.some((pattern) => pattern.test(className));
|
|
23
|
+
const axes = /* @__PURE__ */ new Map();
|
|
24
|
+
for (const map of variantClassMaps) for (const [axisKey, values] of Object.entries(map)) {
|
|
25
|
+
const axisClasses = axes.get(axisKey) ?? /* @__PURE__ */ new Set();
|
|
26
|
+
for (const className of Object.values(values)) if (typeof className === "string" && !/\s/.test(className)) axisClasses.add(className);
|
|
27
|
+
axes.set(axisKey, axisClasses);
|
|
28
|
+
}
|
|
29
|
+
const unused = /* @__PURE__ */ new Set();
|
|
30
|
+
for (const axisClasses of axes.values()) {
|
|
31
|
+
let axisIsScanned = false;
|
|
32
|
+
for (const className of axisClasses) if (isSafelisted(className)) {
|
|
33
|
+
axisIsScanned = true;
|
|
34
|
+
break;
|
|
35
|
+
}
|
|
36
|
+
if (!axisIsScanned) continue;
|
|
37
|
+
for (const className of axisClasses) if (!isSafelisted(className)) unused.add(className);
|
|
38
|
+
}
|
|
39
|
+
return unused;
|
|
40
|
+
};
|
|
41
|
+
const CLASS_TOKEN_RE = /\.((?:[a-zA-Z0-9_-]|\\.)+)/g;
|
|
42
|
+
const selectorReferencesUnusedClass = (selector, unused) => {
|
|
43
|
+
for (const match of selector.matchAll(CLASS_TOKEN_RE)) if (unused.has(match[1])) return true;
|
|
44
|
+
return false;
|
|
45
|
+
};
|
|
46
|
+
/**
|
|
47
|
+
* PostCSS plugin dropping selector alternatives (and whole rules) that
|
|
48
|
+
* reference a variant class in `unused`. Runs on the Tailwind-generated
|
|
49
|
+
* bundle, after which emptied `@media`/`@supports` blocks are removed. Placed
|
|
50
|
+
* before var pruning so variables only referenced by dropped rules get pruned
|
|
51
|
+
* too.
|
|
52
|
+
*/
|
|
53
|
+
const filterUnusedVariantRulesPlugin = (unused) => ({
|
|
54
|
+
postcssPlugin: "uds-filter-unused-variant-rules",
|
|
55
|
+
Once(root) {
|
|
56
|
+
if (unused.size === 0) return;
|
|
57
|
+
root.walkRules((rule) => {
|
|
58
|
+
if (!rule.selector.includes(".uds-")) return;
|
|
59
|
+
const kept = rule.selectors.filter((selector) => !selectorReferencesUnusedClass(selector, unused));
|
|
60
|
+
if (kept.length === rule.selectors.length) return;
|
|
61
|
+
if (kept.length === 0) rule.remove();
|
|
62
|
+
else rule.selector = kept.join(", ");
|
|
63
|
+
});
|
|
64
|
+
root.walkAtRules((atRule) => {
|
|
65
|
+
if ((atRule.name === "media" || atRule.name === "supports") && (atRule.nodes?.length ?? 0) === 0) atRule.remove();
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
});
|
|
69
|
+
//#endregion
|
|
70
|
+
export { buildUnusedVariantClassSet, filterUnusedVariantRulesPlugin };
|
|
@@ -956,7 +956,7 @@ function generateConfigStyles(config, schema, theme, previewOptions, emit, gener
|
|
|
956
956
|
* @param schema - Production schema with defaults and variables
|
|
957
957
|
* @param theme - Tailwind theme function to resolve design tokens
|
|
958
958
|
* @param previewOptions - Options for generating preview mode class modifiers
|
|
959
|
-
* @returns CSS styles object with
|
|
959
|
+
* @returns CSS styles object with separate twin rules for default aliases
|
|
960
960
|
*/
|
|
961
961
|
const generateStylesInner = (config, schema, theme, previewOptions, generateStylesContext) => {
|
|
962
962
|
const styles = generateConfigStyles(config, schema, theme, previewOptions, previewOptions.emit ?? "exhaustive", generateStylesContext);
|
|
@@ -1021,7 +1021,8 @@ const generateStylesInner = (config, schema, theme, previewOptions, generateStyl
|
|
|
1021
1021
|
finalStyles[selector] = declarations;
|
|
1022
1022
|
continue;
|
|
1023
1023
|
}
|
|
1024
|
-
finalStyles[
|
|
1024
|
+
finalStyles[selector] = declarations;
|
|
1025
|
+
finalStyles[defaultsSelector] = declarations;
|
|
1025
1026
|
}
|
|
1026
1027
|
return finalStyles;
|
|
1027
1028
|
};
|
|
@@ -955,7 +955,7 @@ function generateConfigStyles(config, schema, theme, previewOptions, emit, gener
|
|
|
955
955
|
* @param schema - Production schema with defaults and variables
|
|
956
956
|
* @param theme - Tailwind theme function to resolve design tokens
|
|
957
957
|
* @param previewOptions - Options for generating preview mode class modifiers
|
|
958
|
-
* @returns CSS styles object with
|
|
958
|
+
* @returns CSS styles object with separate twin rules for default aliases
|
|
959
959
|
*/
|
|
960
960
|
const generateStylesInner = (config, schema, theme, previewOptions, generateStylesContext) => {
|
|
961
961
|
const styles = generateConfigStyles(config, schema, theme, previewOptions, previewOptions.emit ?? "exhaustive", generateStylesContext);
|
|
@@ -1020,7 +1020,8 @@ const generateStylesInner = (config, schema, theme, previewOptions, generateStyl
|
|
|
1020
1020
|
finalStyles[selector] = declarations;
|
|
1021
1021
|
continue;
|
|
1022
1022
|
}
|
|
1023
|
-
finalStyles[
|
|
1023
|
+
finalStyles[selector] = declarations;
|
|
1024
|
+
finalStyles[defaultsSelector] = declarations;
|
|
1024
1025
|
}
|
|
1025
1026
|
return finalStyles;
|
|
1026
1027
|
};
|
|
@@ -10,8 +10,8 @@ declare function getShadowStyles({
|
|
|
10
10
|
}: {
|
|
11
11
|
config: UniversalTokensConfig;
|
|
12
12
|
shadowType: ShadowType;
|
|
13
|
-
}): Record<".uds-inset-shadow-
|
|
14
|
-
readonly [x: string]: "var(--uds-inset-shadow-
|
|
13
|
+
}): Record<".uds-inset-shadow-none" | ".uds-inset-shadow-sm" | ".uds-inset-shadow-md" | ".uds-inset-shadow-lg" | ".uds-inset-shadow-xl" | ".uds-inset-shadow-2xl" | ".uds-inset-shadow-xs" | ".uds-inset-shadow-elevation-0" | ".uds-inset-shadow-elevation-1" | ".uds-inset-shadow-elevation-2" | ".uds-inset-shadow-elevation-3" | ".uds-inset-shadow-elevation-4" | ".uds-inset-shadow-elevation-5" | ".uds-drop-shadow-none" | ".uds-drop-shadow-sm" | ".uds-drop-shadow-md" | ".uds-drop-shadow-lg" | ".uds-drop-shadow-xl" | ".uds-drop-shadow-2xl" | ".uds-drop-shadow-xs" | ".uds-drop-shadow-elevation-0" | ".uds-drop-shadow-elevation-1" | ".uds-drop-shadow-elevation-2" | ".uds-drop-shadow-elevation-3" | ".uds-drop-shadow-elevation-4" | ".uds-drop-shadow-elevation-5", {
|
|
14
|
+
readonly [x: string]: "var(--uds-inset-shadow-none)" | "var(--uds-inset-shadow-sm)" | "var(--uds-inset-shadow-md)" | "var(--uds-inset-shadow-lg)" | "var(--uds-inset-shadow-xl)" | "var(--uds-inset-shadow-2xl)" | "var(--uds-inset-shadow-xs)" | "var(--uds-inset-shadow-elevation-0)" | "var(--uds-inset-shadow-elevation-1)" | "var(--uds-inset-shadow-elevation-2)" | "var(--uds-inset-shadow-elevation-3)" | "var(--uds-inset-shadow-elevation-4)" | "var(--uds-inset-shadow-elevation-5)" | "var(--uds-drop-shadow-none)" | "var(--uds-drop-shadow-sm)" | "var(--uds-drop-shadow-md)" | "var(--uds-drop-shadow-lg)" | "var(--uds-drop-shadow-xl)" | "var(--uds-drop-shadow-2xl)" | "var(--uds-drop-shadow-xs)" | "var(--uds-drop-shadow-elevation-0)" | "var(--uds-drop-shadow-elevation-1)" | "var(--uds-drop-shadow-elevation-2)" | "var(--uds-drop-shadow-elevation-3)" | "var(--uds-drop-shadow-elevation-4)" | "var(--uds-drop-shadow-elevation-5)" | "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
|
|
15
15
|
readonly boxShadow: "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
|
|
16
16
|
}>; //#endregion
|
|
17
17
|
//#endregion
|
|
@@ -10,8 +10,8 @@ declare function getShadowStyles({
|
|
|
10
10
|
}: {
|
|
11
11
|
config: UniversalTokensConfig;
|
|
12
12
|
shadowType: ShadowType;
|
|
13
|
-
}): Record<".uds-inset-shadow-
|
|
14
|
-
readonly [x: string]: "var(--uds-inset-shadow-
|
|
13
|
+
}): Record<".uds-inset-shadow-none" | ".uds-inset-shadow-sm" | ".uds-inset-shadow-md" | ".uds-inset-shadow-lg" | ".uds-inset-shadow-xl" | ".uds-inset-shadow-2xl" | ".uds-inset-shadow-xs" | ".uds-inset-shadow-elevation-0" | ".uds-inset-shadow-elevation-1" | ".uds-inset-shadow-elevation-2" | ".uds-inset-shadow-elevation-3" | ".uds-inset-shadow-elevation-4" | ".uds-inset-shadow-elevation-5" | ".uds-drop-shadow-none" | ".uds-drop-shadow-sm" | ".uds-drop-shadow-md" | ".uds-drop-shadow-lg" | ".uds-drop-shadow-xl" | ".uds-drop-shadow-2xl" | ".uds-drop-shadow-xs" | ".uds-drop-shadow-elevation-0" | ".uds-drop-shadow-elevation-1" | ".uds-drop-shadow-elevation-2" | ".uds-drop-shadow-elevation-3" | ".uds-drop-shadow-elevation-4" | ".uds-drop-shadow-elevation-5", {
|
|
14
|
+
readonly [x: string]: "var(--uds-inset-shadow-none)" | "var(--uds-inset-shadow-sm)" | "var(--uds-inset-shadow-md)" | "var(--uds-inset-shadow-lg)" | "var(--uds-inset-shadow-xl)" | "var(--uds-inset-shadow-2xl)" | "var(--uds-inset-shadow-xs)" | "var(--uds-inset-shadow-elevation-0)" | "var(--uds-inset-shadow-elevation-1)" | "var(--uds-inset-shadow-elevation-2)" | "var(--uds-inset-shadow-elevation-3)" | "var(--uds-inset-shadow-elevation-4)" | "var(--uds-inset-shadow-elevation-5)" | "var(--uds-drop-shadow-none)" | "var(--uds-drop-shadow-sm)" | "var(--uds-drop-shadow-md)" | "var(--uds-drop-shadow-lg)" | "var(--uds-drop-shadow-xl)" | "var(--uds-drop-shadow-2xl)" | "var(--uds-drop-shadow-xs)" | "var(--uds-drop-shadow-elevation-0)" | "var(--uds-drop-shadow-elevation-1)" | "var(--uds-drop-shadow-elevation-2)" | "var(--uds-drop-shadow-elevation-3)" | "var(--uds-drop-shadow-elevation-4)" | "var(--uds-drop-shadow-elevation-5)" | "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
|
|
15
15
|
readonly boxShadow: "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
|
|
16
16
|
}>; //#endregion
|
|
17
17
|
//#endregion
|