@yahoo/uds 3.156.2 → 3.157.0

package/dist/automated-config/dist/utils/buildConfigSchema.js

@@ -1,10 +1,75 @@
 /*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
-import { filterPseudoStatesByExclusion, getExcludedPseudoStatesForComponentStateOption } from "./componentStatePseudoStates.js";
+import { getExcludedPseudoStatesForComponentStateOption } from "./componentStatePseudoStates.js";
 import { generateSchemaKey } from "./generateSchemaKey.js";
+import { resolvePropertyStates } from "./resolvePropertyStates.js";
 import { isVariantConfigWithComponentStates, isVariantConfigWithProperties } from "./variantConfigGuards.js";
 import { getArbitraryFixture, validateArbitraryValue } from "../../../fixtures/src/util.js";
 //#region ../automated-config/dist/utils/buildConfigSchema.js
 /*! © 2026 Yahoo, Inc. UDS Default Config v0.0.0-development */
+/**
+* Builds the per-state schema entries for one property on one variant option.
+* Each state slot (rest, hover, invalid&hover, ...) gets the property's
+* default value as a starting point so the Configurator UI has something to
+* render before users tweak.
+*
+* Per-state CSS emission depends on the emit mode (`exhaustive` by default,
+* `selective` opt-in) and on the `isEnabled` flag this builder writes:
+*   - `rest` always emits in both modes (no flag needed; CSS gen treats rest
+*     as enabled).
+*   - Under EXHAUSTIVE (the default) on `atomicStates` layers, every declared
+*     non-rest state emits a rule regardless of `isEnabled`; its value is
+*     cascade-resolved (see `resolveSlotByCascade`), so there are no gaps.
+*     `isEnabled` there only selects which value a state resolves to, not
+*     whether it emits.
+*   - Under SELECTIVE (and legacy `pseudoStates`) emission, non-rest slots
+*     emit only when `isEnabled === true`.
+*   - `skipRestState` properties have no rest fallback, so every populated
+*     state slot must emit; we set `isEnabled: true` on each.
+*   - Otherwise, auto-populated non-rest slots ship with no flag — under
+*     selective they're off until a designer enables them via the
+*     configurator's per-property checkbox (which sets or clears this flag
+*     through the setter); under exhaustive they still emit via the cascade.
+*/
+function buildPropertyStateMap(layer, property, variantOption, excludedStates = []) {
+	const stateMap = {};
+	const excluded = new Set(excludedStates);
+	const states = resolvePropertyStates(layer, property);
+	const fixtureType = findFixtureType(property, variantOption);
+	const value = property.defaults[variantOption];
+	const skipRestState = property.skipRestState === true;
+	const isTextVariant = propertyVariesOnlyAtRest(property);
+	for (const state of states) {
+		if (excluded.has(state)) continue;
+		if (isTextVariant && state !== "rest") continue;
+		stateMap[state] = skipRestState ? {
+			type: fixtureType,
+			valueType: "alias",
+			value,
+			isEnabled: true
+		} : {
+			type: fixtureType,
+			valueType: "alias",
+			value
+		};
+	}
+	return stateMap;
+}
+/**
+* Whether a property's non-rest slots are stored SPARSELY — never pre-populated
+* by the schema builder, only persisted when a designer authors an explicit
+* per-state override (resolved via the cascade otherwise). `textVariant` is the
+* only such property today: its non-rest "Emphasized" overrides are created
+* lazily in the configurator rather than seeded for every state.
+*
+* Consulted by the schema builder ({@link buildPropertyStateMap}) to keep the
+* stored config compact. CSS emission does NOT special-case these properties:
+* exhaustive emission walks every declared state and resolves each through the
+* cascade (`resolveSlotByCascade`), so an authored non-rest override emits a
+* rule that renders while unauthored states resolve back to rest.
+*/
+function propertyVariesOnlyAtRest(property) {
+	return property.name === "textVariant";
+}
 /** Resolves the fixture type by finding which value set contains the given value */
 function findFixtureTypeForValue(property, value) {
 	const index = property.values.findIndex((arr) => arr.includes(value));
@@ -17,13 +82,29 @@ function findFixtureTypeForValue(property, value) {
 function findFixtureType(property, variantKey) {
 	return findFixtureTypeForValue(property, property.defaults[variantKey]);
 }
-function appendPseudoStateVariables(variableObject, propertyKey, property, variantOption, excludedPseudoStates = []) {
-	if (!property.pseudoStates) return;
-	for (const pseudoState of filterPseudoStatesByExclusion(property.pseudoStates, excludedPseudoStates)) variableObject[propertyKey][pseudoState] = {
-		type: findFixtureType(property, variantOption),
-		valueType: "alias",
-		value: property.defaults[variantOption]
-	};
+/**
+* Walk a set of layers and emit schema entries keyed by layer (no
+* component-state segment). Shared between `VariantConfigWithProperties` and
+* the optional top-level `layers` field on `VariantConfigWithComponentStates`.
+*/
+function emitUniversalLayerSchema(result, layers, variantKey, variantOption, subComponentName) {
+	for (const layerKey in layers) {
+		const layer = layers[layerKey];
+		const schemaKey = generateSchemaKey({
+			variantKey,
+			variantValue: variantOption,
+			layer: layerKey,
+			subComponentName
+		});
+		result.variables[schemaKey] = {};
+		for (const propertyKey in layer.properties) {
+			const property = layer.properties[propertyKey];
+			result.variables[schemaKey] = {
+				...result.variables[schemaKey],
+				[propertyKey]: buildPropertyStateMap(layer, property, variantOption)
+			};
+		}
+	}
 }
 /** Builds component schema from ComponentConfig at runtime */
 function buildConfigSchema(config) {
@@ -35,6 +116,7 @@ function buildConfigSchema(config) {
 	for (const variantKey in config.variants) {
 		const variantConfig = config.variants[variantKey];
 		for (const variantOption of variantConfig.options) if (isVariantConfigWithComponentStates(variantConfig)) {
+			if (variantConfig.layers) emitUniversalLayerSchema(result, variantConfig.layers, variantKey, variantOption);
 			const componentStates = variantConfig.componentStates;
 			for (const componentStateKey in componentStates) {
 				const componentState = componentStates[componentStateKey];
@@ -50,16 +132,9 @@ function buildConfigSchema(config) {
 					result.variables[schemaKey] = {};
 					for (const propertyKey in layer.properties) {
 						const property = layer.properties[propertyKey];
-						const variableObject = { [propertyKey]: {} };
-						if (property?.skipRestState !== true) variableObject[propertyKey] = { rest: {
-							type: findFixtureType(property, variantOption),
-							valueType: "alias",
-							value: property.defaults[variantOption]
-						} };
-						appendPseudoStateVariables(variableObject, propertyKey, property, variantOption, getExcludedPseudoStatesForComponentStateOption(componentState, componentStateOption));
 						result.variables[schemaKey] = {
 							...result.variables[schemaKey],
-							...variableObject
+							[propertyKey]: buildPropertyStateMap(layer, property, variantOption, getExcludedPseudoStatesForComponentStateOption(componentState, componentStateOption))
 						};
 					}
 				}
@@ -70,43 +145,16 @@ function buildConfigSchema(config) {
 				result.variables[variantSchemaKey] = result.variables[variantSchemaKey] ?? {};
 				for (const propertyKey in variantConfig.variantProperties) {
 					const property = variantConfig.variantProperties[propertyKey];
-					const variableObject = { [propertyKey]: {} };
-					if (property?.skipRestState !== true) variableObject[propertyKey] = { rest: {
-						type: findFixtureType(property, variantOption),
-						valueType: "alias",
-						value: property.defaults[variantOption]
-					} };
-					appendPseudoStateVariables(variableObject, propertyKey, property, variantOption);
 					result.variables[variantSchemaKey] = {
 						...result.variables[variantSchemaKey],
-						...variableObject
-					};
-				}
-			}
-			const layers = variantConfig.layers;
-			for (const layerKey in layers) {
-				const layer = layers[layerKey];
-				const schemaKey = generateSchemaKey({
-					variantKey,
-					variantValue: variantOption,
-					layer: layerKey
-				});
-				result.variables[schemaKey] = {};
-				for (const propertyKey in layer.properties) {
-					const property = layer.properties[propertyKey];
-					const variableObject = { [propertyKey]: {} };
-					if (property?.skipRestState !== true) variableObject[propertyKey] = { rest: {
-						type: findFixtureType(property, variantOption),
-						valueType: "alias",
-						value: property.defaults[variantOption]
-					} };
-					appendPseudoStateVariables(variableObject, propertyKey, property, variantOption);
-					result.variables[schemaKey] = {
-						...result.variables[schemaKey],
-						...variableObject
+						[propertyKey]: buildPropertyStateMap({
+							label: "",
+							properties: {}
+						}, property, variantOption)
 					};
 				}
 			}
+			emitUniversalLayerSchema(result, variantConfig.layers, variantKey, variantOption);
 		}
 	}
 	if (config.subComponents) {
@@ -115,6 +163,7 @@ function buildConfigSchema(config) {
 			const variantConfig = subComponents[subComponentKey].variants[variantKey];
 			result.defaults[variantKey] = variantConfig.default;
 			for (const variantOption of variantConfig.options) if (isVariantConfigWithComponentStates(variantConfig)) {
+				if (variantConfig.layers) emitUniversalLayerSchema(result, variantConfig.layers, variantKey, variantOption, subComponentKey);
 				const componentStates = variantConfig.componentStates;
 				for (const componentStateKey in componentStates) {
 					const componentState = componentStates[componentStateKey];
@@ -131,47 +180,14 @@ function buildConfigSchema(config) {
 						result.variables[schemaKey] = {};
 						for (const propertyKey in layer.properties) {
 							const property = layer.properties[propertyKey];
-							const variableObject = { [propertyKey]: {} };
-							if (property?.skipRestState !== true) variableObject[propertyKey] = { rest: {
-								type: findFixtureType(property, variantOption),
-								valueType: "alias",
-								value: property.defaults[variantOption]
-							} };
-							appendPseudoStateVariables(variableObject, propertyKey, property, variantOption, getExcludedPseudoStatesForComponentStateOption(componentState, componentStateOption));
 							result.variables[schemaKey] = {
 								...result.variables[schemaKey],
-								...variableObject
+								[propertyKey]: buildPropertyStateMap(layer, property, variantOption, getExcludedPseudoStatesForComponentStateOption(componentState, componentStateOption))
 							};
 						}
 					}
 				}
-			} else if (isVariantConfigWithProperties(variantConfig)) {
-				const layers = variantConfig.layers;
-				for (const layerKey in layers) {
-					const layer = layers[layerKey];
-					const schemaKey = generateSchemaKey({
-						variantKey,
-						variantValue: variantOption,
-						layer: layerKey,
-						subComponentName: subComponentKey
-					});
-					result.variables[schemaKey] = {};
-					for (const propertyKey in layer.properties) {
-						const property = layer.properties[propertyKey];
-						const variableObject = { [propertyKey]: {} };
-						if (property?.skipRestState !== true) variableObject[propertyKey] = { rest: {
-							type: findFixtureType(property, variantOption),
-							valueType: "alias",
-							value: property.defaults[variantOption]
-						} };
-						appendPseudoStateVariables(variableObject, propertyKey, property, variantOption);
-						result.variables[schemaKey] = {
-							...result.variables[schemaKey],
-							...variableObject
-						};
-					}
-				}
-			}
+			} else if (isVariantConfigWithProperties(variantConfig)) emitUniversalLayerSchema(result, variantConfig.layers, variantKey, variantOption, subComponentKey);
 		}
 	}
 	return result;

package/dist/automated-config/dist/utils/canonicalizeStateKey.cjs

@@ -0,0 +1,32 @@
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+const require_StateAxis = require("../types/StateAxis.cjs");
+//#region ../automated-config/dist/utils/canonicalizeStateKey.js
+/*! © 2026 Yahoo, Inc. UDS Default Config v0.0.0-development */
+function canonicalizeStateKey(atoms) {
+	if (atoms.length === 0) return "rest";
+	const seen = /* @__PURE__ */ new Set();
+	const modifiers = [];
+	const interactives = [];
+	for (const atom of atoms) {
+		if (seen.has(atom)) continue;
+		seen.add(atom);
+		if (require_StateAxis.isModifierAtomic(atom)) modifiers.push(atom);
+		else if (require_StateAxis.isInteractiveAtomic(atom)) interactives.push(atom);
+		else throw new Error(`canonicalizeStateKey received an unrecognized atom "${atom}". Atoms must be in MODIFIER_ATOMICS or INTERACTIVE_ATOMICS — see StateAxis.`);
+	}
+	modifiers.sort(require_StateAxis.comparePriority);
+	interactives.sort(require_StateAxis.comparePriority);
+	const ordered = [...modifiers, ...interactives];
+	return ordered.length === 0 ? "rest" : ordered.join("&");
+}
+/**
+* Splits a canonical (or legacy) state key into its atomic parts.
+* `'rest'` and `''` produce an empty array.
+*/
+function splitStateKey(stateKey) {
+	if (!stateKey || stateKey === "rest") return [];
+	return stateKey.split("&");
+}
+//#endregion
+exports.canonicalizeStateKey = canonicalizeStateKey;
+exports.splitStateKey = splitStateKey;

package/dist/automated-config/dist/utils/canonicalizeStateKey.d.cts

@@ -0,0 +1,48 @@
+
+import { AtomicState } from "../types/StateAxis.cjs";
+import { PossibleStatesWithRest } from "../types/ComponentConfig.cjs";
+
+//#region ../automated-config/dist/utils/canonicalizeStateKey.d.ts
+//#region src/utils/canonicalizeStateKey.d.ts
+/**
+ * Returns the canonical state-key string for a list of atomic states.
+ *
+ * Canonical ordering rules:
+ * 1. Modifier atomics come first, sorted by `STATE_PRIORITY` (weakest first).
+ * 2. Interactive atomics come last, also sorted by `STATE_PRIORITY`. Multiple
+ *    interactives can co-occur (e.g. `focus-within` + `hover`), so a key may
+ *    carry more than one.
+ *    Sorting by priority — not alphabetically — keeps a key's atom order aligned
+ *    with the emission/cascade order in `resolvePropertyStates` and
+ *    `resolveSlotByCascade`, so one ordering convention holds end-to-end. (For
+ *    Input the two orders coincide; they diverge only for atoms like `visited`,
+ *    `autofill`, or `focus-visible` whose priority rank differs from their
+ *    alphabetical position.)
+ * 3. Duplicates are removed.
+ * 4. Unknown atoms throw. Every caller passes atoms already validated via
+ *    `isModifierAtomic`/`isInteractiveAtomic` (or pulled from
+ *    `MODIFIER_ATOMICS`/`INTERACTIVE_ATOMICS`), so an unrecognized atom signals
+ *    a caller bug and fails loudly rather than producing a silent bad key.
+ *
+ * Examples:
+ *   canonicalizeStateKey(['hover', 'invalid'])   // 'invalid&hover'
+ *   canonicalizeStateKey(['invalid', 'hover'])   // 'invalid&hover' (same)
+ *   canonicalizeStateKey(['hover'])              // 'hover'
+ *   canonicalizeStateKey([])                     // 'rest'
+ *
+ * The narrow public overload returns `PossibleStatesWithRest` so callers
+ * passing known atomics get a usable state-key type back without having to
+ * cast the result at the call site. The looser overload remains for callers
+ * that may pass unvalidated strings; its return is widened to `string` since
+ * those inputs can't guarantee a canonical-key result. The runtime body
+ * type-checks against the loose overload and validates atoms at runtime.
+ */
+declare function canonicalizeStateKey(atoms: readonly AtomicState[]): PossibleStatesWithRest;
+declare function canonicalizeStateKey(atoms: readonly string[]): string;
+/**
+ * Splits a canonical (or legacy) state key into its atomic parts.
+ * `'rest'` and `''` produce an empty array.
+ */
+declare function splitStateKey(stateKey: string): string[]; //#endregion
+//#endregion
+export { canonicalizeStateKey, splitStateKey };

package/dist/automated-config/dist/utils/canonicalizeStateKey.d.ts

@@ -0,0 +1,48 @@
+
+import { AtomicState } from "../types/StateAxis.js";
+import { PossibleStatesWithRest } from "../types/ComponentConfig.js";
+
+//#region ../automated-config/dist/utils/canonicalizeStateKey.d.ts
+//#region src/utils/canonicalizeStateKey.d.ts
+/**
+ * Returns the canonical state-key string for a list of atomic states.
+ *
+ * Canonical ordering rules:
+ * 1. Modifier atomics come first, sorted by `STATE_PRIORITY` (weakest first).
+ * 2. Interactive atomics come last, also sorted by `STATE_PRIORITY`. Multiple
+ *    interactives can co-occur (e.g. `focus-within` + `hover`), so a key may
+ *    carry more than one.
+ *    Sorting by priority — not alphabetically — keeps a key's atom order aligned
+ *    with the emission/cascade order in `resolvePropertyStates` and
+ *    `resolveSlotByCascade`, so one ordering convention holds end-to-end. (For
+ *    Input the two orders coincide; they diverge only for atoms like `visited`,
+ *    `autofill`, or `focus-visible` whose priority rank differs from their
+ *    alphabetical position.)
+ * 3. Duplicates are removed.
+ * 4. Unknown atoms throw. Every caller passes atoms already validated via
+ *    `isModifierAtomic`/`isInteractiveAtomic` (or pulled from
+ *    `MODIFIER_ATOMICS`/`INTERACTIVE_ATOMICS`), so an unrecognized atom signals
+ *    a caller bug and fails loudly rather than producing a silent bad key.
+ *
+ * Examples:
+ *   canonicalizeStateKey(['hover', 'invalid'])   // 'invalid&hover'
+ *   canonicalizeStateKey(['invalid', 'hover'])   // 'invalid&hover' (same)
+ *   canonicalizeStateKey(['hover'])              // 'hover'
+ *   canonicalizeStateKey([])                     // 'rest'
+ *
+ * The narrow public overload returns `PossibleStatesWithRest` so callers
+ * passing known atomics get a usable state-key type back without having to
+ * cast the result at the call site. The looser overload remains for callers
+ * that may pass unvalidated strings; its return is widened to `string` since
+ * those inputs can't guarantee a canonical-key result. The runtime body
+ * type-checks against the loose overload and validates atoms at runtime.
+ */
+declare function canonicalizeStateKey(atoms: readonly AtomicState[]): PossibleStatesWithRest;
+declare function canonicalizeStateKey(atoms: readonly string[]): string;
+/**
+ * Splits a canonical (or legacy) state key into its atomic parts.
+ * `'rest'` and `''` produce an empty array.
+ */
+declare function splitStateKey(stateKey: string): string[]; //#endregion
+//#endregion
+export { canonicalizeStateKey, splitStateKey };

package/dist/automated-config/dist/utils/canonicalizeStateKey.js

@@ -0,0 +1,31 @@
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+import { comparePriority, isInteractiveAtomic, isModifierAtomic } from "../types/StateAxis.js";
+//#region ../automated-config/dist/utils/canonicalizeStateKey.js
+/*! © 2026 Yahoo, Inc. UDS Default Config v0.0.0-development */
+function canonicalizeStateKey(atoms) {
+	if (atoms.length === 0) return "rest";
+	const seen = /* @__PURE__ */ new Set();
+	const modifiers = [];
+	const interactives = [];
+	for (const atom of atoms) {
+		if (seen.has(atom)) continue;
+		seen.add(atom);
+		if (isModifierAtomic(atom)) modifiers.push(atom);
+		else if (isInteractiveAtomic(atom)) interactives.push(atom);
+		else throw new Error(`canonicalizeStateKey received an unrecognized atom "${atom}". Atoms must be in MODIFIER_ATOMICS or INTERACTIVE_ATOMICS — see StateAxis.`);
+	}
+	modifiers.sort(comparePriority);
+	interactives.sort(comparePriority);
+	const ordered = [...modifiers, ...interactives];
+	return ordered.length === 0 ? "rest" : ordered.join("&");
+}
+/**
+* Splits a canonical (or legacy) state key into its atomic parts.
+* `'rest'` and `''` produce an empty array.
+*/
+function splitStateKey(stateKey) {
+	if (!stateKey || stateKey === "rest") return [];
+	return stateKey.split("&");
+}
+//#endregion
+export { canonicalizeStateKey, splitStateKey };

package/dist/automated-config/dist/utils/getConfigComponentVariant.d.cts

@@ -0,0 +1,8 @@
+
+import { ComponentConfig, VariantConfig } from "../types/ComponentConfig.cjs";
+
+//#region ../automated-config/dist/utils/getConfigComponentVariant.d.ts
+//#region src/utils/getConfigComponentVariant.d.ts
+declare function getConfigComponentVariant<C extends ComponentConfig>(config: C, variantKey: string, subComponentName?: string): VariantConfig<string> | null; //#endregion
+//#endregion
+export { getConfigComponentVariant };

package/dist/automated-config/dist/utils/getConfigComponentVariant.d.ts

@@ -0,0 +1,8 @@
+
+import { ComponentConfig, VariantConfig } from "../types/ComponentConfig.js";
+
+//#region ../automated-config/dist/utils/getConfigComponentVariant.d.ts
+//#region src/utils/getConfigComponentVariant.d.ts
+declare function getConfigComponentVariant<C extends ComponentConfig>(config: C, variantKey: string, subComponentName?: string): VariantConfig<string> | null; //#endregion
+//#endregion
+export { getConfigComponentVariant };

package/dist/automated-config/dist/utils/getConfigVariantProperties.d.cts

@@ -1,6 +1,6 @@
 
-import { VariantConfig } from "../types/ComponentConfig.cjs";
 import { SelectedConfigurableProperty } from "../properties.cjs";
+import { VariantConfig } from "../types/ComponentConfig.cjs";
 
 //#region ../automated-config/dist/utils/getConfigVariantProperties.d.ts
 //#region src/utils/getConfigVariantProperties.d.ts
@@ -11,8 +11,8 @@ import { SelectedConfigurableProperty } from "../properties.cjs";
  * @returns A Record of layer names to their properties, or null if no properties are found
  */
 declare function getConfigVariantProperties(variant?: VariantConfig): {
-  [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
-  root: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
+  [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
+  root: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
 } | null; //#endregion
 //#endregion
 export { getConfigVariantProperties };

package/dist/automated-config/dist/utils/getConfigVariantProperties.d.ts

@@ -1,6 +1,6 @@
 
-import { VariantConfig } from "../types/ComponentConfig.js";
 import { SelectedConfigurableProperty } from "../properties.js";
+import { VariantConfig } from "../types/ComponentConfig.js";
 
 //#region ../automated-config/dist/utils/getConfigVariantProperties.d.ts
 //#region src/utils/getConfigVariantProperties.d.ts
@@ -11,8 +11,8 @@ import { SelectedConfigurableProperty } from "../properties.js";
  * @returns A Record of layer names to their properties, or null if no properties are found
  */
 declare function getConfigVariantProperties(variant?: VariantConfig): {
-  [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
-  root: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
+  [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
+  root: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
 } | null; //#endregion
 //#endregion
 export { getConfigVariantProperties };

package/dist/automated-config/dist/utils/getConfigVariantPseudoStates.cjs

@@ -1,10 +1,17 @@
 /*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
 const require_componentStatePseudoStates = require("./componentStatePseudoStates.cjs");
+const require_resolvePropertyStates = require("./resolvePropertyStates.cjs");
 const require_variantConfigGuards = require("./variantConfigGuards.cjs");
 const require_getConfigComponentVariant = require("./getConfigComponentVariant.cjs");
 //#region ../automated-config/dist/utils/getConfigVariantPseudoStates.js
 /*! © 2026 Yahoo, Inc. UDS Default Config v0.0.0-development */
-const DEFAULT_PSEUDO_STATES = ["rest"];
+/**
+* Returns a map of state key → reactive properties for a variant. The state
+* set comes from `resolvePropertyStates` — rest, atoms, and auto-generated
+* compounds (modifier × interactive, modifier × modifier × interactive,
+* etc.). The Configurator's StateBuilder caps user composition at the same
+* depth, so every selectable state is in this map.
+*/
 function getConfigVariantPseudoStates(config, variantKey, state, subComponentName, componentStateValue) {
 	const componentVariant = require_getConfigComponentVariant.getConfigComponentVariant(config, variantKey, subComponentName);
 	if (!componentVariant) return null;
@@ -13,21 +20,21 @@ function getConfigVariantPseudoStates(config, variantKey, state, subComponentNam
 	const stateLayers = require_variantConfigGuards.isVariantConfigWithComponentStates(componentVariant) && state ? Object.entries(componentVariant.componentStates[state].layers ?? {}) : [];
 	return [...variantLayers, ...stateLayers].flatMap(([layerKey, layer]) => Object.entries(layer.properties).map(([propertyKey, property]) => [
 		layerKey,
+		layer,
 		propertyKey,
 		property
-	])).flatMap(([layerKey, propertyKey, property]) => [...property.skipRestState ? DEFAULT_PSEUDO_STATES.filter((s) => s !== "rest") : DEFAULT_PSEUDO_STATES, ...require_componentStatePseudoStates.filterPseudoStatesByExclusion(property.pseudoStates, excludedPseudoStates)].map((pseudoState) => [
+	])).flatMap(([layerKey, layer, propertyKey, property]) => require_componentStatePseudoStates.filterPseudoStatesByExclusion(require_resolvePropertyStates.resolvePropertyStates(layer, property), excludedPseudoStates).map((pseudoState) => [
 		layerKey,
 		propertyKey,
 		property,
 		pseudoState
 	])).reduce((acc, [layerKey, propertyKey, property, pseudoState]) => {
 		acc[pseudoState] = acc[pseudoState] ?? [];
-		const info = [
+		acc[pseudoState].push([
 			layerKey,
 			propertyKey,
 			property
-		];
-		acc[pseudoState].push(info);
+		]);
 		return acc;
 	}, {});
 }

package/dist/automated-config/dist/utils/getConfigVariantPseudoStates.d.cts

@@ -1,11 +1,18 @@
 
-import { ComponentConfig, PossibleStatesWithRest } from "../types/ComponentConfig.cjs";
 import { SelectedConfigurableProperty } from "../properties.cjs";
+import { ComponentConfig, PossibleStatesWithRest } from "../types/ComponentConfig.cjs";
 
 //#region ../automated-config/dist/utils/getConfigVariantPseudoStates.d.ts
 //#region src/utils/getConfigVariantPseudoStates.d.ts
 type GenericProperty = SelectedConfigurableProperty<any, any>;
 type InfoTuple = [string, string, GenericProperty];
+/**
+ * Returns a map of state key → reactive properties for a variant. The state
+ * set comes from `resolvePropertyStates` — rest, atoms, and auto-generated
+ * compounds (modifier × interactive, modifier × modifier × interactive,
+ * etc.). The Configurator's StateBuilder caps user composition at the same
+ * depth, so every selectable state is in this map.
+ */
 declare function getConfigVariantPseudoStates<C extends ComponentConfig>(config: C, variantKey: string, state?: string, subComponentName?: string, componentStateValue?: string): Record<PossibleStatesWithRest, InfoTuple[]> | null; //#endregion
 //#endregion
 export { getConfigVariantPseudoStates };

package/dist/automated-config/dist/utils/getConfigVariantPseudoStates.d.ts

@@ -1,11 +1,18 @@
 
-import { ComponentConfig, PossibleStatesWithRest } from "../types/ComponentConfig.js";
 import { SelectedConfigurableProperty } from "../properties.js";
+import { ComponentConfig, PossibleStatesWithRest } from "../types/ComponentConfig.js";
 
 //#region ../automated-config/dist/utils/getConfigVariantPseudoStates.d.ts
 //#region src/utils/getConfigVariantPseudoStates.d.ts
 type GenericProperty = SelectedConfigurableProperty<any, any>;
 type InfoTuple = [string, string, GenericProperty];
+/**
+ * Returns a map of state key → reactive properties for a variant. The state
+ * set comes from `resolvePropertyStates` — rest, atoms, and auto-generated
+ * compounds (modifier × interactive, modifier × modifier × interactive,
+ * etc.). The Configurator's StateBuilder caps user composition at the same
+ * depth, so every selectable state is in this map.
+ */
 declare function getConfigVariantPseudoStates<C extends ComponentConfig>(config: C, variantKey: string, state?: string, subComponentName?: string, componentStateValue?: string): Record<PossibleStatesWithRest, InfoTuple[]> | null; //#endregion
 //#endregion
 export { getConfigVariantPseudoStates };

package/dist/automated-config/dist/utils/getConfigVariantPseudoStates.js

@@ -1,10 +1,17 @@
 /*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
 import { filterPseudoStatesByExclusion, getExcludedPseudoStatesForComponentStateOption } from "./componentStatePseudoStates.js";
+import { resolvePropertyStates } from "./resolvePropertyStates.js";
 import { isVariantConfigWithComponentStates, isVariantConfigWithProperties } from "./variantConfigGuards.js";
 import { getConfigComponentVariant } from "./getConfigComponentVariant.js";
 //#region ../automated-config/dist/utils/getConfigVariantPseudoStates.js
 /*! © 2026 Yahoo, Inc. UDS Default Config v0.0.0-development */
-const DEFAULT_PSEUDO_STATES = ["rest"];
+/**
+* Returns a map of state key → reactive properties for a variant. The state
+* set comes from `resolvePropertyStates` — rest, atoms, and auto-generated
+* compounds (modifier × interactive, modifier × modifier × interactive,
+* etc.). The Configurator's StateBuilder caps user composition at the same
+* depth, so every selectable state is in this map.
+*/
 function getConfigVariantPseudoStates(config, variantKey, state, subComponentName, componentStateValue) {
 	const componentVariant = getConfigComponentVariant(config, variantKey, subComponentName);
 	if (!componentVariant) return null;
@@ -13,21 +20,21 @@ function getConfigVariantPseudoStates(config, variantKey, state, subComponentNam
 	const stateLayers = isVariantConfigWithComponentStates(componentVariant) && state ? Object.entries(componentVariant.componentStates[state].layers ?? {}) : [];
 	return [...variantLayers, ...stateLayers].flatMap(([layerKey, layer]) => Object.entries(layer.properties).map(([propertyKey, property]) => [
 		layerKey,
+		layer,
 		propertyKey,
 		property
-	])).flatMap(([layerKey, propertyKey, property]) => [...property.skipRestState ? DEFAULT_PSEUDO_STATES.filter((s) => s !== "rest") : DEFAULT_PSEUDO_STATES, ...filterPseudoStatesByExclusion(property.pseudoStates, excludedPseudoStates)].map((pseudoState) => [
+	])).flatMap(([layerKey, layer, propertyKey, property]) => filterPseudoStatesByExclusion(resolvePropertyStates(layer, property), excludedPseudoStates).map((pseudoState) => [
 		layerKey,
 		propertyKey,
 		property,
 		pseudoState
 	])).reduce((acc, [layerKey, propertyKey, property, pseudoState]) => {
 		acc[pseudoState] = acc[pseudoState] ?? [];
-		const info = [
+		acc[pseudoState].push([
 			layerKey,
 			propertyKey,
 			property
-		];
-		acc[pseudoState].push(info);
+		]);
 		return acc;
 	}, {});
 }