@yahoo/uds 3.156.2 → 3.157.0
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/generated/autoVariants.cjs +9 -4
- package/dist/automated-config/dist/generated/autoVariants.d.cts +2 -1
- package/dist/automated-config/dist/generated/autoVariants.d.ts +2 -1
- package/dist/automated-config/dist/generated/autoVariants.js +9 -4
- package/dist/automated-config/dist/generated/generatedConfigs.cjs +3011 -3038
- package/dist/automated-config/dist/generated/generatedConfigs.d.cts +143 -140
- package/dist/automated-config/dist/generated/generatedConfigs.d.ts +143 -140
- package/dist/automated-config/dist/generated/generatedConfigs.js +3011 -3038
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.cjs +1227 -501
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.js +1227 -501
- package/dist/automated-config/dist/properties.cjs +1 -1
- package/dist/automated-config/dist/properties.d.cts +15 -0
- package/dist/automated-config/dist/properties.d.ts +15 -0
- package/dist/automated-config/dist/properties.js +1 -1
- package/dist/automated-config/dist/types/ComponentConfig.d.cts +77 -4
- package/dist/automated-config/dist/types/ComponentConfig.d.ts +77 -4
- package/dist/automated-config/dist/types/ConfigSchema.d.cts +14 -2
- package/dist/automated-config/dist/types/ConfigSchema.d.ts +14 -2
- package/dist/automated-config/dist/types/StateAxis.cjs +90 -0
- package/dist/automated-config/dist/types/StateAxis.d.cts +70 -0
- package/dist/automated-config/dist/types/StateAxis.d.ts +70 -0
- package/dist/automated-config/dist/types/StateAxis.js +84 -0
- package/dist/automated-config/dist/utils/buildConfigSchema.cjs +98 -82
- package/dist/automated-config/dist/utils/buildConfigSchema.d.cts +32 -10
- package/dist/automated-config/dist/utils/buildConfigSchema.d.ts +32 -10
- package/dist/automated-config/dist/utils/buildConfigSchema.js +99 -83
- package/dist/automated-config/dist/utils/canonicalizeStateKey.cjs +32 -0
- package/dist/automated-config/dist/utils/canonicalizeStateKey.d.cts +48 -0
- package/dist/automated-config/dist/utils/canonicalizeStateKey.d.ts +48 -0
- package/dist/automated-config/dist/utils/canonicalizeStateKey.js +31 -0
- package/dist/automated-config/dist/utils/getConfigComponentVariant.d.cts +8 -0
- package/dist/automated-config/dist/utils/getConfigComponentVariant.d.ts +8 -0
- package/dist/automated-config/dist/utils/getConfigVariantProperties.d.cts +3 -3
- package/dist/automated-config/dist/utils/getConfigVariantProperties.d.ts +3 -3
- package/dist/automated-config/dist/utils/getConfigVariantPseudoStates.cjs +12 -5
- package/dist/automated-config/dist/utils/getConfigVariantPseudoStates.d.cts +8 -1
- package/dist/automated-config/dist/utils/getConfigVariantPseudoStates.d.ts +8 -1
- package/dist/automated-config/dist/utils/getConfigVariantPseudoStates.js +12 -5
- package/dist/automated-config/dist/utils/index.cjs +407 -97
- package/dist/automated-config/dist/utils/index.d.cts +66 -16
- package/dist/automated-config/dist/utils/index.d.ts +66 -16
- package/dist/automated-config/dist/utils/index.js +408 -99
- package/dist/automated-config/dist/utils/pseudoStateSelectors.cjs +122 -0
- package/dist/automated-config/dist/utils/pseudoStateSelectors.d.cts +80 -0
- package/dist/automated-config/dist/utils/pseudoStateSelectors.d.ts +80 -0
- package/dist/automated-config/dist/utils/pseudoStateSelectors.js +120 -0
- package/dist/automated-config/dist/utils/resolvePropertyStates.cjs +131 -0
- package/dist/automated-config/dist/utils/resolvePropertyStates.d.cts +49 -0
- package/dist/automated-config/dist/utils/resolvePropertyStates.d.ts +49 -0
- package/dist/automated-config/dist/utils/resolvePropertyStates.js +130 -0
- package/dist/automated-config/dist/utils/resolveSlotByCascade.cjs +118 -0
- package/dist/automated-config/dist/utils/resolveSlotByCascade.d.cts +68 -0
- package/dist/automated-config/dist/utils/resolveSlotByCascade.d.ts +68 -0
- package/dist/automated-config/dist/utils/resolveSlotByCascade.js +117 -0
- package/dist/automated-config/dist/utils/variantConfigGuards.d.cts +13 -0
- package/dist/automated-config/dist/utils/variantConfigGuards.d.ts +13 -0
- package/dist/components/client/Input/Input.cjs +42 -6
- package/dist/components/client/Input/Input.d.cts +13 -0
- package/dist/components/client/Input/Input.d.ts +13 -0
- package/dist/components/client/Input/Input.js +42 -6
- package/dist/config/dist/index.cjs +221 -550
- package/dist/config/dist/index.js +221 -550
- package/dist/css/dist/commands/css.cjs +1 -0
- package/dist/css/dist/commands/css.helpers.cjs +6 -0
- package/dist/css/dist/commands/css.helpers.js +6 -0
- package/dist/css/dist/commands/css.js +1 -0
- package/dist/css/dist/css/generate.cjs +4 -2
- package/dist/css/dist/css/generate.d.cts +28 -0
- package/dist/css/dist/css/generate.d.ts +28 -0
- package/dist/css/dist/css/generate.helpers.cjs +5 -1
- package/dist/css/dist/css/generate.helpers.js +6 -2
- package/dist/css/dist/css/generate.js +4 -2
- package/dist/css/dist/css/postcss.cjs +81 -0
- package/dist/css/dist/css/postcss.helpers.cjs +60 -0
- package/dist/css/dist/css/postcss.helpers.js +59 -1
- package/dist/css/dist/css/postcss.js +82 -2
- package/dist/css/dist/css/runner.cjs +12 -2
- package/dist/css/dist/css/runner.js +12 -2
- package/dist/css/dist/css/theme.d.cts +6 -0
- package/dist/css/dist/css/theme.d.ts +6 -0
- package/dist/css/dist/packages/automated-config/dist/properties.cjs +1 -1
- package/dist/css/dist/packages/automated-config/dist/properties.js +1 -1
- package/dist/css/dist/packages/automated-config/dist/utils/index.d.cts +6 -0
- package/dist/css/dist/packages/automated-config/dist/utils/index.d.ts +6 -0
- package/dist/css/dist/packages/config/dist/index.cjs +221 -550
- package/dist/css/dist/packages/config/dist/index.js +221 -550
- package/dist/css/dist/utils/optimizeCSS.cjs +59 -0
- package/dist/css/dist/utils/optimizeCSS.js +59 -0
- package/dist/index.cjs +25 -0
- package/dist/index.d.cts +10 -3
- package/dist/index.d.ts +10 -3
- package/dist/index.js +9 -2
- package/dist/styles/styler.d.cts +12 -11
- package/dist/styles/styler.d.ts +12 -11
- package/dist/styles/variants.d.cts +9 -4
- package/dist/styles/variants.d.ts +9 -4
- package/dist/tailwind-internal/dist/packages/automated-config/dist/generated/generatedConfigs.cjs +3011 -3038
- package/dist/tailwind-internal/dist/packages/automated-config/dist/generated/generatedConfigs.js +3011 -3038
- package/dist/tailwind-internal/dist/packages/automated-config/dist/properties.cjs +1 -1
- package/dist/tailwind-internal/dist/packages/automated-config/dist/properties.js +1 -1
- package/dist/tailwind-internal/dist/packages/automated-config/dist/types/StateAxis.cjs +81 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/types/StateAxis.js +76 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/canonicalizeStateKey.cjs +33 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/canonicalizeStateKey.js +32 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/componentStatePseudoStates.cjs +0 -7
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/componentStatePseudoStates.js +1 -7
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/index.cjs +354 -97
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/index.d.cts +6 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/index.d.ts +6 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/index.js +355 -98
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/pseudoStateSelectors.cjs +122 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/pseudoStateSelectors.js +121 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/resolvePropertyStates.cjs +132 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/resolvePropertyStates.js +131 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/resolveSlotByCascade.cjs +95 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/resolveSlotByCascade.js +95 -0
- package/dist/tailwind-internal/dist/packages/config/dist/index.cjs +221 -550
- package/dist/tailwind-internal/dist/packages/config/dist/index.js +221 -550
- package/dist/tailwind-internal/dist/plugins/components.cjs +28 -24
- package/dist/tailwind-internal/dist/plugins/components.js +28 -24
- package/dist/tailwind-internal/dist/utils/composeTailwindPlugins.d.cts +3 -0
- package/dist/tailwind-internal/dist/utils/composeTailwindPlugins.d.ts +3 -0
- package/dist/tailwind-internal/dist/utils/getShadowStyles.d.cts +2 -2
- package/dist/tailwind-internal/dist/utils/getShadowStyles.d.ts +2 -2
- package/dist/tokens/automation/index.cjs +25 -0
- package/dist/tokens/automation/index.d.cts +9 -2
- package/dist/tokens/automation/index.d.ts +9 -2
- package/dist/tokens/automation/index.js +9 -2
- package/dist/tokens/index.cjs +25 -0
- package/dist/tokens/index.d.cts +10 -3
- package/dist/tokens/index.d.ts +10 -3
- package/dist/tokens/index.js +9 -2
- package/dist/tokens/types.d.cts +1 -1
- package/dist/tokens/types.d.ts +1 -1
- package/dist/uds/generated/componentData.cjs +2202 -2200
- package/dist/uds/generated/componentData.js +2202 -2200
- package/dist/uds/generated/migrationSchemaVersion.cjs +1 -1
- package/dist/uds/generated/migrationSchemaVersion.js +1 -1
- package/dist/uds/generated/tailwindPurge.cjs +79 -78
- package/dist/uds/generated/tailwindPurge.js +79 -78
- package/generated/componentData.json +2720 -2718
- package/generated/migrationSchemaVersion.ts +1 -1
- package/generated/tailwindPurge.ts +2 -2
- package/package.json +1 -1
|
@@ -3,11 +3,15 @@ require("../../../../../../_virtual/_rolldown/runtime.cjs");
|
|
|
3
3
|
const require_index = require("../../../css-tokens/dist/index.cjs");
|
|
4
4
|
const require_mapTextVariantFixtureToValue = require("../mapTextVariantFixtureToValue.cjs");
|
|
5
5
|
const require_properties = require("../properties.cjs");
|
|
6
|
+
const require_StateAxis = require("../types/StateAxis.cjs");
|
|
6
7
|
const require_componentStatePseudoStates = require("./componentStatePseudoStates.cjs");
|
|
7
8
|
const require_generateSchemaKey = require("./generateSchemaKey.cjs");
|
|
9
|
+
const require_resolvePropertyStates = require("./resolvePropertyStates.cjs");
|
|
8
10
|
const require_variantConfigGuards = require("./variantConfigGuards.cjs");
|
|
9
11
|
const require_buildConfigSchema = require("./buildConfigSchema.cjs");
|
|
10
12
|
const require_generateDefaultClassName = require("./generateDefaultClassName.cjs");
|
|
13
|
+
const require_pseudoStateSelectors = require("./pseudoStateSelectors.cjs");
|
|
14
|
+
const require_resolveSlotByCascade = require("./resolveSlotByCascade.cjs");
|
|
11
15
|
let lodash_es = require("lodash-es");
|
|
12
16
|
//#region ../tailwind-internal/dist/packages/automated-config/dist/utils/index.js
|
|
13
17
|
/*! © 2026 Yahoo, Inc. UDS Tailwind Internal v0.0.0-development */
|
|
@@ -62,37 +66,55 @@ const COMPONENTS_WITH_SHADOW_BORDERS = [
|
|
|
62
66
|
}
|
|
63
67
|
];
|
|
64
68
|
/**
|
|
65
|
-
*
|
|
66
|
-
*
|
|
69
|
+
* Legacy state keys still used by unmigrated component configs via per-property
|
|
70
|
+
* `pseudoStates` arrays. They aren't in the new `StateAxis` taxonomy (so the
|
|
71
|
+
* resolver/StateBuilder don't auto-compose them) but they must remain in
|
|
72
|
+
* `KNOWN_STATE_KEYS` so the docs-mode map / configurator safelist still cover
|
|
73
|
+
* configs that emit them. Drop entries from this list as components migrate.
|
|
67
74
|
*/
|
|
68
|
-
const
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
75
|
+
const LEGACY_STATE_KEYS = [
|
|
76
|
+
"disabled",
|
|
77
|
+
"focused",
|
|
78
|
+
"focused-keyboard"
|
|
79
|
+
];
|
|
80
|
+
/**
|
|
81
|
+
* Enumerates every canonical state key the system supports: rest, every atom,
|
|
82
|
+
* every modifier-subset (up to {@link MAX_MODIFIERS_PER_COMPOUND}) on its own
|
|
83
|
+
* and combined with each interactive, plus any legacy keys still in use.
|
|
84
|
+
*
|
|
85
|
+
* Mirrors `resolvePropertyStates` exactly so what the resolver pre-emits in
|
|
86
|
+
* the schema, what the StateBuilder lets users compose, and what the docs
|
|
87
|
+
* map / configurator safelist preserve are all the same set.
|
|
88
|
+
*/
|
|
89
|
+
function enumerateAllStateKeys() {
|
|
90
|
+
const states = ["rest"];
|
|
91
|
+
const atoms = [...require_StateAxis.INTERACTIVE_ATOMICS, ...require_StateAxis.MODIFIER_ATOMICS].sort(require_StateAxis.comparePriority);
|
|
92
|
+
for (const stateKey of require_resolvePropertyStates.atomicAndCompoundStateKeys(atoms)) states.push(stateKey);
|
|
93
|
+
for (const legacy of LEGACY_STATE_KEYS) states.push(legacy);
|
|
94
|
+
return states;
|
|
95
|
+
}
|
|
96
|
+
const KNOWN_STATE_KEYS = enumerateAllStateKeys();
|
|
97
|
+
/**
|
|
98
|
+
* Lookup of every known state key to its index in `KNOWN_STATE_KEYS` — i.e. the
|
|
99
|
+
* resolver's emission order. The CSS generator iterates property-state maps
|
|
100
|
+
* in this order (instead of the alphabetical insertion order produced by
|
|
101
|
+
* `syncYosConfig`'s `normalizeConfig`), so cascade tie-breaking under the
|
|
102
|
+
* uniform per-atom specificity actually follows the priority chain. Unknown
|
|
103
|
+
* keys sort to the end.
|
|
104
|
+
*/
|
|
105
|
+
const KNOWN_STATE_RANK = new Map(KNOWN_STATE_KEYS.map((key, index) => [key, index]));
|
|
106
|
+
function compareStateKeys(a, b) {
|
|
107
|
+
const ra = KNOWN_STATE_RANK.get(a) ?? Number.POSITIVE_INFINITY;
|
|
108
|
+
const rb = KNOWN_STATE_RANK.get(b) ?? Number.POSITIVE_INFINITY;
|
|
109
|
+
if (ra === rb) return a < b ? -1 : a > b ? 1 : 0;
|
|
110
|
+
return ra - rb;
|
|
111
|
+
}
|
|
112
|
+
function buildStateRecord(transform) {
|
|
113
|
+
const record = {};
|
|
114
|
+
for (const key of KNOWN_STATE_KEYS) record[key] = transform(key);
|
|
115
|
+
return record;
|
|
116
|
+
}
|
|
117
|
+
buildStateRecord(require_pseudoStateSelectors.getStateDocsClass);
|
|
96
118
|
/**
|
|
97
119
|
* Generates button line-height with icon size minimum.
|
|
98
120
|
* Ensures button line-height is at least as tall as the icon to prevent clipping.
|
|
@@ -235,7 +257,57 @@ const getTheCssPropertyValue = (schema, theme, propertyName, schemaStateValue, e
|
|
|
235
257
|
if (propertyConfig.concatenate && existingValue) return `${existingValue}${propertyConfig.concatenationDelimiter || ", "}${newValue}`;
|
|
236
258
|
return newValue;
|
|
237
259
|
};
|
|
238
|
-
|
|
260
|
+
/**
|
|
261
|
+
* Builds the per-state resolution map for a per-componentState OVERRIDE in
|
|
262
|
+
* exhaustive mode: the universal layer's state map with the override's ENABLED
|
|
263
|
+
* (and `rest`) slots layered on top. An unset or disabled override slot defers
|
|
264
|
+
* to the universal layer's value, so `resolveSlotByCascade` picks the
|
|
265
|
+
* most-specific *enabled* slot across both layers (override winning ties) rather
|
|
266
|
+
* than collapsing every unset state to the override's own `rest`.
|
|
267
|
+
*/
|
|
268
|
+
function mergeUniversalUnderOverride(universal, override) {
|
|
269
|
+
const merged = { ...universal };
|
|
270
|
+
const overrideRecord = override;
|
|
271
|
+
for (const state of Object.keys(overrideRecord)) {
|
|
272
|
+
const slot = overrideRecord[state];
|
|
273
|
+
if (state === "rest" && slot?.isEnabled !== false || slot?.isEnabled === true) merged[state] = slot;
|
|
274
|
+
}
|
|
275
|
+
return merged;
|
|
276
|
+
}
|
|
277
|
+
/**
|
|
278
|
+
* Replays SELECTIVE emission for a STANDALONE atomicStates layer (no universal
|
|
279
|
+
* fallback) and returns the sparse set of slots it would emit: `rest`, every
|
|
280
|
+
* explicitly-enabled state, and every cascade-correction. Mirrors the inline
|
|
281
|
+
* selective decision in `generateDeclaration` — keep the two in lock-step.
|
|
282
|
+
*
|
|
283
|
+
* The override path seeds its own correction accumulator with this for the
|
|
284
|
+
* UNIVERSAL layer. Universal layers are emitted in a separate pass at the SAME
|
|
285
|
+
* specificity tier as their per-option overrides (see `bumpRootSpecificity`), so
|
|
286
|
+
* at runtime a universal rule wins wherever the override emits nothing. Without
|
|
287
|
+
* this seed, an override that flattens a state to `rest` (e.g. a `filled` help
|
|
288
|
+
* text that's `muted` everywhere) silently inherits the universal's brighter
|
|
289
|
+
* rule for that state in selective mode — a divergence from exhaustive, where
|
|
290
|
+
* the override emits every state explicitly. Seeding makes the override emit a
|
|
291
|
+
* correction whenever the universal would otherwise render a different value.
|
|
292
|
+
*/
|
|
293
|
+
function selectiveEmittedStates(stateMap, orderedStateKeys, emittableStates) {
|
|
294
|
+
const emitted = { rest: stateMap.rest };
|
|
295
|
+
for (const stateKey of orderedStateKeys) {
|
|
296
|
+
if (stateKey === "rest" || !emittableStates.has(stateKey)) continue;
|
|
297
|
+
const value = require_resolveSlotByCascade.resolveSlotByCascade(stateKey, stateMap);
|
|
298
|
+
if (!value) continue;
|
|
299
|
+
if (!(stateMap[stateKey]?.isEnabled === true)) {
|
|
300
|
+
if (require_resolveSlotByCascade.resolveSlotByCascade(stateKey, emitted)?.value === value.value) continue;
|
|
301
|
+
}
|
|
302
|
+
emitted[stateKey] = {
|
|
303
|
+
...value,
|
|
304
|
+
isEnabled: true
|
|
305
|
+
};
|
|
306
|
+
}
|
|
307
|
+
return emitted;
|
|
308
|
+
}
|
|
309
|
+
function generateDeclaration({ componentName, subComponentName, variantKey, variantValue, layer, layerOptionalPseudoSelector, componentStateKey, componentStateValue, schema, propertyKey, originalPropertyDefinition, declaredStates, layerUsesAtomicStates, theme, currentStyles, previewOptions, excludedPseudoStates = [], emit, fallbackStateMap, bumpRootSpecificity }) {
|
|
310
|
+
const shouldUseExhaustive = (emit ?? "exhaustive") === "exhaustive" && layerUsesAtomicStates;
|
|
239
311
|
const schemaKey = require_generateSchemaKey.generateSchemaKey({
|
|
240
312
|
variantKey,
|
|
241
313
|
variantValue,
|
|
@@ -256,14 +328,29 @@ function generateDeclaration({ componentName, subComponentName, variantKey, vari
|
|
|
256
328
|
const propertyStateMap = schema.variables?.[schemaKey]?.[propertyKey];
|
|
257
329
|
if (!propertyStateMap) throw new Error(`Prop definition (${componentName} - ${schemaKey} - ${propertyKey}) not found, this is not expected, please report the bug to the UDS team`);
|
|
258
330
|
const styles = {};
|
|
259
|
-
const
|
|
260
|
-
const
|
|
261
|
-
const
|
|
262
|
-
|
|
263
|
-
|
|
331
|
+
const excludedStateSet = new Set(excludedPseudoStates);
|
|
332
|
+
const emittableStates = new Set([...declaredStates].filter((state) => !excludedStateSet.has(state)));
|
|
333
|
+
const orderedStateKeys = (shouldUseExhaustive || layerUsesAtomicStates ? [...emittableStates] : Object.keys(propertyStateMap)).sort(compareStateKeys);
|
|
334
|
+
const resolutionStates = fallbackStateMap ? mergeUniversalUnderOverride(fallbackStateMap, propertyStateMap) : propertyStateMap;
|
|
335
|
+
const emittedForSelective = layerUsesAtomicStates && !shouldUseExhaustive ? fallbackStateMap ? selectiveEmittedStates(fallbackStateMap, orderedStateKeys, emittableStates) : { rest: resolutionStates.rest } : {};
|
|
336
|
+
for (const propStateStr of orderedStateKeys) {
|
|
337
|
+
if (!emittableStates.has(propStateStr)) continue;
|
|
264
338
|
const propertyState = propStateStr;
|
|
265
|
-
const propertyStateSelector =
|
|
266
|
-
const schemaValueForState = propertyStateMap[propertyState];
|
|
339
|
+
const propertyStateSelector = require_pseudoStateSelectors.getStateSelector(propertyState);
|
|
340
|
+
const schemaValueForState = shouldUseExhaustive || layerUsesAtomicStates ? require_resolveSlotByCascade.resolveSlotByCascade(propStateStr, resolutionStates) : propertyStateMap[propertyState];
|
|
341
|
+
if (!schemaValueForState) continue;
|
|
342
|
+
if (!shouldUseExhaustive) {
|
|
343
|
+
if (layerUsesAtomicStates) {
|
|
344
|
+
const isExplicitlyEnabled = propertyStateMap[propertyState]?.isEnabled === true;
|
|
345
|
+
if (propStateStr !== "rest" && !isExplicitlyEnabled) {
|
|
346
|
+
if (require_resolveSlotByCascade.resolveSlotByCascade(propStateStr, emittedForSelective)?.value === schemaValueForState.value) continue;
|
|
347
|
+
}
|
|
348
|
+
emittedForSelective[propStateStr] = {
|
|
349
|
+
...schemaValueForState,
|
|
350
|
+
isEnabled: true
|
|
351
|
+
};
|
|
352
|
+
} else if (schemaValueForState.isEnabled === false) continue;
|
|
353
|
+
}
|
|
267
354
|
let fullClassName = ``;
|
|
268
355
|
if (layer === "root") if (componentStateKey && componentStateValue) {
|
|
269
356
|
const rootVariantClass = generateClassName({
|
|
@@ -282,7 +369,7 @@ function generateDeclaration({ componentName, subComponentName, variantKey, vari
|
|
|
282
369
|
componentStateValue
|
|
283
370
|
});
|
|
284
371
|
fullClassName = `.${rootVariantClass}${propertyStateSelector}.${className}`;
|
|
285
|
-
} else fullClassName = `.${className}${propertyStateSelector}`;
|
|
372
|
+
} else fullClassName = bumpRootSpecificity ? `.${className}.${className}${propertyStateSelector}` : `.${className}${propertyStateSelector}`;
|
|
286
373
|
else {
|
|
287
374
|
const rootVariantClassName = generateClassName({
|
|
288
375
|
componentName,
|
|
@@ -309,7 +396,17 @@ function generateDeclaration({ componentName, subComponentName, variantKey, vari
|
|
|
309
396
|
subComponentName
|
|
310
397
|
});
|
|
311
398
|
fullClassName = `.${rootVariantClassName}${propertyStateSelector}.${rootVariantClassNameWithComponentState} .${className}`;
|
|
312
|
-
} else
|
|
399
|
+
} else {
|
|
400
|
+
className = generateClassName({
|
|
401
|
+
componentName,
|
|
402
|
+
variantKey,
|
|
403
|
+
variantValue,
|
|
404
|
+
layer,
|
|
405
|
+
layerOptionalPseudoSelector,
|
|
406
|
+
subComponentName
|
|
407
|
+
});
|
|
408
|
+
fullClassName = bumpRootSpecificity ? `.${rootVariantClassName}.${rootVariantClassName}${propertyStateSelector} .${className}` : `.${rootVariantClassName}${propertyStateSelector} .${className}`;
|
|
409
|
+
}
|
|
313
410
|
}
|
|
314
411
|
const { cssProperties, extendedProperties: extendedPropertiesGetter } = require_properties.configurableProperties[originalPropertyDefinition.name];
|
|
315
412
|
const cssDeclarations = {};
|
|
@@ -451,7 +548,7 @@ function generateDeclaration({ componentName, subComponentName, variantKey, vari
|
|
|
451
548
|
...styles[fullClassName]
|
|
452
549
|
};
|
|
453
550
|
if (previewOptions?.generatePseudoStateClassModifier) {
|
|
454
|
-
const pseudoPrefixClass =
|
|
551
|
+
const pseudoPrefixClass = require_pseudoStateSelectors.getStateDocsClass(propertyState);
|
|
455
552
|
if (pseudoPrefixClass.length) {
|
|
456
553
|
const importantCssDeclarations = Object.fromEntries(Object.entries(cssDeclarations).map(([prop, value]) => {
|
|
457
554
|
const strValue = String(value).trimEnd().replace(/;$/, "");
|
|
@@ -467,12 +564,137 @@ function generateDeclaration({ componentName, subComponentName, variantKey, vari
|
|
|
467
564
|
}
|
|
468
565
|
return styles;
|
|
469
566
|
}
|
|
470
|
-
|
|
567
|
+
/**
|
|
568
|
+
* Emit CSS for per-state schema entries that target a variant's universal
|
|
569
|
+
* layers — the "override" path. Per-state schema entries can be authored by
|
|
570
|
+
* the Configurator (via `setConfigPseudoStateVariable`) or written by data
|
|
571
|
+
* migrations; they aren't declared in source configs.
|
|
572
|
+
*
|
|
573
|
+
* Iterates the cartesian product of `componentStates.X.options × universal
|
|
574
|
+
* layers × universal properties`. For each combination, calls
|
|
575
|
+
* `generateDeclaration` with the universal property's metadata plus the
|
|
576
|
+
* componentState key/value — the existing schema lookup inside
|
|
577
|
+
* `generateDeclaration` picks up the override slot if one exists and skips
|
|
578
|
+
* the property otherwise.
|
|
579
|
+
*/
|
|
580
|
+
function emitSchemaOverrideStyles({ componentName, subComponentName, variantKey, variantOption, variantConfig, schema, theme, previewOptions, emit, currentStyles }) {
|
|
581
|
+
let styles = currentStyles;
|
|
582
|
+
const universalLayers = variantConfig.layers;
|
|
583
|
+
const componentStates = variantConfig.componentStates;
|
|
584
|
+
if (!universalLayers || !componentStates) return styles;
|
|
585
|
+
const variables = schema.variables;
|
|
586
|
+
if (!variables) return styles;
|
|
587
|
+
for (const componentStateKey in componentStates) {
|
|
588
|
+
const componentState = componentStates[componentStateKey];
|
|
589
|
+
for (const componentStateOption of componentState.options) for (const layerKey in universalLayers) {
|
|
590
|
+
const universalLayer = universalLayers[layerKey];
|
|
591
|
+
const schemaEntry = variables[require_generateSchemaKey.generateSchemaKey({
|
|
592
|
+
variantKey,
|
|
593
|
+
variantValue: variantOption,
|
|
594
|
+
componentStateKey,
|
|
595
|
+
componentStateValue: componentStateOption,
|
|
596
|
+
layer: layerKey,
|
|
597
|
+
subComponentName
|
|
598
|
+
})];
|
|
599
|
+
if (!schemaEntry) continue;
|
|
600
|
+
for (const propertyKey in universalLayer.properties) {
|
|
601
|
+
if (!schemaEntry[propertyKey]) continue;
|
|
602
|
+
const originalPropertyDefinition = universalLayer.properties[propertyKey];
|
|
603
|
+
const fallbackStateMap = variables[require_generateSchemaKey.generateSchemaKey({
|
|
604
|
+
variantKey,
|
|
605
|
+
variantValue: variantOption,
|
|
606
|
+
layer: layerKey,
|
|
607
|
+
subComponentName
|
|
608
|
+
})]?.[propertyKey];
|
|
609
|
+
const declarations = generateDeclaration({
|
|
610
|
+
componentName,
|
|
611
|
+
subComponentName,
|
|
612
|
+
variantKey,
|
|
613
|
+
variantValue: variantOption,
|
|
614
|
+
componentStateKey,
|
|
615
|
+
componentStateValue: componentStateOption,
|
|
616
|
+
layer: layerKey,
|
|
617
|
+
layerOptionalPseudoSelector: universalLayer.pseudoSelector,
|
|
618
|
+
propertyKey,
|
|
619
|
+
originalPropertyDefinition,
|
|
620
|
+
declaredStates: new Set(require_resolvePropertyStates.resolvePropertyStates(universalLayer, originalPropertyDefinition)),
|
|
621
|
+
layerUsesAtomicStates: (universalLayer.atomicStates?.length ?? 0) > 0,
|
|
622
|
+
theme,
|
|
623
|
+
schema,
|
|
624
|
+
currentStyles: styles,
|
|
625
|
+
previewOptions,
|
|
626
|
+
emit,
|
|
627
|
+
fallbackStateMap
|
|
628
|
+
});
|
|
629
|
+
styles = deepMerge(styles, declarations);
|
|
630
|
+
}
|
|
631
|
+
}
|
|
632
|
+
}
|
|
633
|
+
return styles;
|
|
634
|
+
}
|
|
635
|
+
/**
|
|
636
|
+
* Emit CSS for a set of layers without a component-state segment in the
|
|
637
|
+
* selector. Used by both `VariantConfigWithProperties` (where layers are the
|
|
638
|
+
* only source of styles) and `VariantConfigWithComponentStates` (where these
|
|
639
|
+
* layers express the variant's universal baseline, with per-state overrides
|
|
640
|
+
* winning via class-compound specificity).
|
|
641
|
+
*/
|
|
642
|
+
function emitUniversalLayers({ componentName, subComponentName, variantKey, variantOption, layers, schema, theme, previewOptions, emit, currentStyles, bumpRootSpecificity }) {
|
|
643
|
+
let styles = currentStyles;
|
|
644
|
+
const variables = schema.variables;
|
|
645
|
+
for (const layerKey in layers) {
|
|
646
|
+
const layer = layers[layerKey];
|
|
647
|
+
const schemaKey = require_generateSchemaKey.generateSchemaKey({
|
|
648
|
+
variantKey,
|
|
649
|
+
variantValue: variantOption,
|
|
650
|
+
layer: layerKey,
|
|
651
|
+
subComponentName
|
|
652
|
+
});
|
|
653
|
+
const schemaEntry = variables?.[schemaKey];
|
|
654
|
+
for (const propertyKey in layer.properties) {
|
|
655
|
+
if (!schemaEntry || !schemaEntry[propertyKey]) continue;
|
|
656
|
+
const originalPropertyDefinition = layer.properties[propertyKey];
|
|
657
|
+
const declarations = generateDeclaration({
|
|
658
|
+
componentName,
|
|
659
|
+
subComponentName,
|
|
660
|
+
variantKey,
|
|
661
|
+
variantValue: variantOption,
|
|
662
|
+
layer: layerKey,
|
|
663
|
+
layerOptionalPseudoSelector: layer.pseudoSelector,
|
|
664
|
+
propertyKey,
|
|
665
|
+
originalPropertyDefinition,
|
|
666
|
+
declaredStates: new Set(require_resolvePropertyStates.resolvePropertyStates(layer, originalPropertyDefinition)),
|
|
667
|
+
layerUsesAtomicStates: (layer.atomicStates?.length ?? 0) > 0,
|
|
668
|
+
theme,
|
|
669
|
+
schema,
|
|
670
|
+
currentStyles: styles,
|
|
671
|
+
previewOptions,
|
|
672
|
+
emit,
|
|
673
|
+
bumpRootSpecificity
|
|
674
|
+
});
|
|
675
|
+
styles = deepMerge(styles, declarations);
|
|
676
|
+
}
|
|
677
|
+
}
|
|
678
|
+
return styles;
|
|
679
|
+
}
|
|
680
|
+
function generateConfigStyles(config, schema, theme, previewOptions, emit) {
|
|
471
681
|
const componentName = config.label.toLowerCase();
|
|
472
682
|
let styles = {};
|
|
473
683
|
for (const variantKey in config.variants) {
|
|
474
684
|
const variantConfig = config.variants[variantKey];
|
|
475
685
|
for (const variantOption of variantConfig.options) if (require_variantConfigGuards.isVariantConfigWithComponentStates(variantConfig)) {
|
|
686
|
+
if (variantConfig.layers) styles = emitUniversalLayers({
|
|
687
|
+
componentName,
|
|
688
|
+
variantKey,
|
|
689
|
+
variantOption,
|
|
690
|
+
layers: variantConfig.layers,
|
|
691
|
+
schema,
|
|
692
|
+
theme,
|
|
693
|
+
previewOptions,
|
|
694
|
+
emit,
|
|
695
|
+
currentStyles: styles,
|
|
696
|
+
bumpRootSpecificity: true
|
|
697
|
+
});
|
|
476
698
|
const componentStates = variantConfig.componentStates;
|
|
477
699
|
for (const componentStateKey in componentStates) {
|
|
478
700
|
const componentState = componentStates[componentStateKey];
|
|
@@ -492,46 +714,61 @@ function generateConfigStyles(config, schema, theme, previewOptions) {
|
|
|
492
714
|
layerOptionalPseudoSelector: layer.pseudoSelector,
|
|
493
715
|
propertyKey,
|
|
494
716
|
originalPropertyDefinition,
|
|
717
|
+
declaredStates: new Set(require_resolvePropertyStates.resolvePropertyStates(layer, originalPropertyDefinition)),
|
|
718
|
+
layerUsesAtomicStates: (layer.atomicStates?.length ?? 0) > 0,
|
|
495
719
|
theme,
|
|
496
720
|
schema,
|
|
497
721
|
currentStyles: styles,
|
|
498
722
|
previewOptions,
|
|
499
|
-
excludedPseudoStates
|
|
723
|
+
excludedPseudoStates,
|
|
724
|
+
emit
|
|
500
725
|
});
|
|
501
726
|
styles = deepMerge(styles, declarations);
|
|
502
727
|
}
|
|
503
728
|
}
|
|
504
729
|
}
|
|
505
730
|
}
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
}
|
|
731
|
+
styles = emitSchemaOverrideStyles({
|
|
732
|
+
componentName,
|
|
733
|
+
variantKey,
|
|
734
|
+
variantOption,
|
|
735
|
+
variantConfig,
|
|
736
|
+
schema,
|
|
737
|
+
theme,
|
|
738
|
+
previewOptions,
|
|
739
|
+
emit,
|
|
740
|
+
currentStyles: styles
|
|
741
|
+
});
|
|
742
|
+
} else if (require_variantConfigGuards.isVariantConfigWithProperties(variantConfig)) styles = emitUniversalLayers({
|
|
743
|
+
componentName,
|
|
744
|
+
variantKey,
|
|
745
|
+
variantOption,
|
|
746
|
+
layers: variantConfig.layers,
|
|
747
|
+
schema,
|
|
748
|
+
theme,
|
|
749
|
+
previewOptions,
|
|
750
|
+
emit,
|
|
751
|
+
currentStyles: styles
|
|
752
|
+
});
|
|
529
753
|
}
|
|
530
754
|
if (config.subComponents) {
|
|
531
755
|
const { subComponents } = config;
|
|
532
756
|
for (const subComponentKey in subComponents) for (const variantKey in subComponents[subComponentKey].variants) {
|
|
533
757
|
const variantConfig = subComponents[subComponentKey].variants[variantKey];
|
|
534
758
|
for (const variantOption of variantConfig.options) if (require_variantConfigGuards.isVariantConfigWithComponentStates(variantConfig)) {
|
|
759
|
+
if (variantConfig.layers) styles = emitUniversalLayers({
|
|
760
|
+
componentName,
|
|
761
|
+
subComponentName: subComponentKey,
|
|
762
|
+
variantKey,
|
|
763
|
+
variantOption,
|
|
764
|
+
layers: variantConfig.layers,
|
|
765
|
+
schema,
|
|
766
|
+
theme,
|
|
767
|
+
previewOptions,
|
|
768
|
+
emit,
|
|
769
|
+
currentStyles: styles,
|
|
770
|
+
bumpRootSpecificity: true
|
|
771
|
+
});
|
|
535
772
|
const componentStates = variantConfig.componentStates;
|
|
536
773
|
for (const componentStateKey in componentStates) {
|
|
537
774
|
const componentState = componentStates[componentStateKey];
|
|
@@ -552,41 +789,44 @@ function generateConfigStyles(config, schema, theme, previewOptions) {
|
|
|
552
789
|
layerOptionalPseudoSelector: layer.pseudoSelector,
|
|
553
790
|
propertyKey,
|
|
554
791
|
originalPropertyDefinition,
|
|
792
|
+
declaredStates: new Set(require_resolvePropertyStates.resolvePropertyStates(layer, originalPropertyDefinition)),
|
|
793
|
+
layerUsesAtomicStates: (layer.atomicStates?.length ?? 0) > 0,
|
|
555
794
|
theme,
|
|
556
795
|
schema,
|
|
557
796
|
currentStyles: styles,
|
|
558
797
|
previewOptions,
|
|
559
|
-
excludedPseudoStates
|
|
798
|
+
excludedPseudoStates,
|
|
799
|
+
emit
|
|
560
800
|
});
|
|
561
801
|
styles = deepMerge(styles, declarations);
|
|
562
802
|
}
|
|
563
803
|
}
|
|
564
804
|
}
|
|
565
805
|
}
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
}
|
|
806
|
+
styles = emitSchemaOverrideStyles({
|
|
807
|
+
componentName,
|
|
808
|
+
subComponentName: subComponentKey,
|
|
809
|
+
variantKey,
|
|
810
|
+
variantOption,
|
|
811
|
+
variantConfig,
|
|
812
|
+
schema,
|
|
813
|
+
theme,
|
|
814
|
+
previewOptions,
|
|
815
|
+
emit,
|
|
816
|
+
currentStyles: styles
|
|
817
|
+
});
|
|
818
|
+
} else if (require_variantConfigGuards.isVariantConfigWithProperties(variantConfig)) styles = emitUniversalLayers({
|
|
819
|
+
componentName,
|
|
820
|
+
subComponentName: subComponentKey,
|
|
821
|
+
variantKey,
|
|
822
|
+
variantOption,
|
|
823
|
+
layers: variantConfig.layers,
|
|
824
|
+
schema,
|
|
825
|
+
theme,
|
|
826
|
+
previewOptions,
|
|
827
|
+
emit,
|
|
828
|
+
currentStyles: styles
|
|
829
|
+
});
|
|
590
830
|
}
|
|
591
831
|
}
|
|
592
832
|
/**
|
|
@@ -619,8 +859,8 @@ function generateConfigStyles(config, schema, theme, previewOptions) {
|
|
|
619
859
|
* @param previewOptions - Options for generating preview mode class modifiers
|
|
620
860
|
* @returns CSS styles object with grouped selectors for default aliases
|
|
621
861
|
*/
|
|
622
|
-
const
|
|
623
|
-
const styles = generateConfigStyles(config, schema, theme, previewOptions);
|
|
862
|
+
const generateStylesInner = (config, schema, theme, previewOptions) => {
|
|
863
|
+
const styles = generateConfigStyles(config, schema, theme, previewOptions, previewOptions.emit ?? "exhaustive");
|
|
624
864
|
if (!config.variants && !config.subComponents) return styles;
|
|
625
865
|
const componentName = config.label.toLowerCase();
|
|
626
866
|
if (componentName !== "button" && componentName !== "iconbutton") return styles;
|
|
@@ -628,14 +868,15 @@ const generateStyles = (config, schema, theme, previewOptions) => {
|
|
|
628
868
|
/**
|
|
629
869
|
* Helper: Extract all layer keys from a variant configuration
|
|
630
870
|
* Handles both simple variants (with direct layers) and variants with component states
|
|
871
|
+
* (which may additionally declare top-level universal layers).
|
|
631
872
|
*/
|
|
632
873
|
const getLayerKeys = (variantConfig) => {
|
|
633
|
-
if (require_variantConfigGuards.
|
|
634
|
-
else if (require_variantConfigGuards.isVariantConfigWithComponentStates(variantConfig)) {
|
|
874
|
+
if (require_variantConfigGuards.isVariantConfigWithComponentStates(variantConfig)) {
|
|
635
875
|
const layerKeysSet = /* @__PURE__ */ new Set();
|
|
636
|
-
for (const componentStateConfig of Object.values(variantConfig.componentStates)) Object.keys(componentStateConfig.layers).forEach((key) => layerKeysSet.add(key));
|
|
876
|
+
for (const componentStateConfig of Object.values(variantConfig.componentStates)) Object.keys(componentStateConfig.layers ?? {}).forEach((key) => layerKeysSet.add(key));
|
|
877
|
+
if (variantConfig.layers) Object.keys(variantConfig.layers).forEach((key) => layerKeysSet.add(key));
|
|
637
878
|
return Array.from(layerKeysSet);
|
|
638
|
-
}
|
|
879
|
+
} else if (require_variantConfigGuards.isVariantConfigWithProperties(variantConfig)) return Object.keys(variantConfig.layers);
|
|
639
880
|
return [];
|
|
640
881
|
};
|
|
641
882
|
/**
|
|
@@ -685,5 +926,21 @@ const generateStyles = (config, schema, theme, previewOptions) => {
|
|
|
685
926
|
}
|
|
686
927
|
return finalStyles;
|
|
687
928
|
};
|
|
929
|
+
/**
|
|
930
|
+
* Public entry point. Generates a component's CSS, emitting each declared state
|
|
931
|
+
* as its own rule (one selector per rule) so the cascade is carried entirely by
|
|
932
|
+
* per-rule specificity — which CSS minifiers preserve.
|
|
933
|
+
*
|
|
934
|
+
* An earlier optimization merged rules sharing a declaration block into a single
|
|
935
|
+
* comma-separated selector list (to avoid repeating invariant declarations per
|
|
936
|
+
* state). It was removed: a minifier's forgiving-`:is()` rewrite — applied to a
|
|
937
|
+
* comma-separated list that contains `:has()` when targeting browsers without
|
|
938
|
+
* native `:has()` support — collapses the list to its single highest
|
|
939
|
+
* specificity, inflating the weakest selector (`rest`) above genuinely
|
|
940
|
+
* customized states and corrupting the cascade. Separate rules never form such a
|
|
941
|
+
* list, so minifiers leave their specificity intact. (gzip already collapses the
|
|
942
|
+
* repeated declaration blocks, so the shipped-size cost is minimal.)
|
|
943
|
+
*/
|
|
944
|
+
const generateStyles = (config, schema, theme, previewOptions) => generateStylesInner(config, schema, theme, previewOptions);
|
|
688
945
|
//#endregion
|
|
689
946
|
exports.generateStyles = generateStyles;
|