@animus-ui/system 0.1.0-next.38 → 0.1.0-next.40

package/dist/groups/index.js

@@ -57,122 +57,146 @@ const border = {
 	border: {
 		property: "border",
 		scale: "borders",
+		strict: false,
 		transform: borderShorthand
 	},
 	borderX: {
 		property: "border",
 		properties: ["borderLeft", "borderRight"],
 		scale: "borders",
+		strict: false,
 		transform: borderShorthand
 	},
 	borderY: {
 		property: "border",
 		properties: ["borderTop", "borderBottom"],
 		scale: "borders",
+		strict: false,
 		transform: borderShorthand
 	},
 	borderTop: {
 		property: "borderTop",
 		scale: "borders",
+		strict: false,
 		transform: borderShorthand
 	},
 	borderRight: {
 		property: "borderRight",
 		scale: "borders",
+		strict: false,
 		transform: borderShorthand
 	},
 	borderBottom: {
 		property: "borderBottom",
 		scale: "borders",
+		strict: false,
 		transform: borderShorthand
 	},
 	borderLeft: {
 		property: "borderLeft",
 		scale: "borders",
+		strict: false,
 		transform: borderShorthand
 	},
 	borderWidth: {
 		property: "borderWidth",
-		scale: "borderWidths"
+		scale: "borderWidths",
+		strict: false
 	},
 	borderXWidth: {
 		property: "borderWidth",
 		properties: ["borderLeftWidth", "borderRightWidth"],
-		scale: "borderWidths"
+		scale: "borderWidths",
+		strict: false
 	},
 	borderYWidth: {
 		property: "borderWidth",
 		properties: ["borderTopWidth", "borderBottomWidth"],
-		scale: "borderWidths"
+		scale: "borderWidths",
+		strict: false
 	},
 	borderLeftWidth: {
 		property: "borderLeftWidth",
-		scale: "borderWidths"
+		scale: "borderWidths",
+		strict: false
 	},
 	borderRightWidth: {
 		property: "borderRightWidth",
-		scale: "borderWidths"
+		scale: "borderWidths",
+		strict: false
 	},
 	borderTopWidth: {
 		property: "borderTopWidth",
-		scale: "borderWidths"
+		scale: "borderWidths",
+		strict: false
 	},
 	borderBottomWidth: {
 		property: "borderBottomWidth",
-		scale: "borderWidths"
+		scale: "borderWidths",
+		strict: false
 	},
 	borderRadius: {
 		property: "borderRadius",
 		scale: "radii",
+		strict: false,
 		transform: size
 	},
 	rounded: {
 		property: "borderRadius",
 		scale: "radii",
+		strict: false,
 		transform: size
 	},
 	borderLeftRadius: {
 		property: "borderRadius",
 		properties: ["borderTopLeftRadius", "borderBottomLeftRadius"],
 		scale: "radii",
+		strict: false,
 		transform: size
 	},
 	borderTopRadius: {
 		property: "borderRadius",
 		properties: ["borderTopLeftRadius", "borderTopRightRadius"],
 		scale: "radii",
+		strict: false,
 		transform: size
 	},
 	borderBottomRadius: {
 		property: "borderRadius",
 		properties: ["borderBottomLeftRadius", "borderBottomRightRadius"],
 		scale: "radii",
+		strict: false,
 		transform: size
 	},
 	borderRightRadius: {
 		property: "borderRadius",
 		properties: ["borderTopRightRadius", "borderBottomRightRadius"],
 		scale: "radii",
+		strict: false,
 		transform: size
 	},
 	borderTopLeftRadius: {
 		property: "borderTopLeftRadius",
 		scale: "radii",
+		strict: false,
 		transform: size
 	},
 	borderTopRightRadius: {
 		property: "borderTopRightRadius",
 		scale: "radii",
+		strict: false,
 		transform: size
 	},
 	borderBottomRightRadius: {
 		property: "borderBottomRightRadius",
 		scale: "radii",
+		strict: false,
 		transform: size
 	},
 	borderBottomLeftRadius: {
 		property: "borderBottomLeftRadius",
 		scale: "radii",
+		strict: false,
 		transform: size
 	},
 	borderStyle: { property: "borderStyle" },
@@ -323,25 +347,30 @@ const positioning = {
 	},
 	zIndex: {
 		property: "zIndex",
-		scale: "zIndices"
+		scale: "zIndices",
+		strict: false
 	},
 	opacity: {
 		property: "opacity",
-		scale: "opacities"
+		scale: "opacities",
+		strict: false
 	}
 };
 const shadows = {
 	boxShadow: {
 		property: "boxShadow",
-		scale: "shadows"
+		scale: "shadows",
+		strict: false
 	},
 	shadow: {
 		property: "boxShadow",
-		scale: "shadows"
+		scale: "shadows",
+		strict: false
 	},
 	textShadow: {
 		property: "textShadow",
-		scale: "shadows"
+		scale: "shadows",
+		strict: false
 	}
 };
 const layout = {
@@ -414,11 +443,13 @@ const typography = {
 	},
 	fontWeight: {
 		property: "fontWeight",
-		scale: "fontWeights"
+		scale: "fontWeights",
+		strict: false
 	},
 	lineHeight: {
 		property: "lineHeight",
-		scale: "lineHeights"
+		scale: "lineHeights",
+		strict: false
 	},
 	fontSize: {
 		property: "fontSize",
@@ -426,7 +457,8 @@ const typography = {
 	},
 	letterSpacing: {
 		property: "letterSpacing",
-		scale: "letterSpacings"
+		scale: "letterSpacings",
+		strict: false
 	},
 	textAlign: { property: "textAlign" },
 	fontStyle: { property: "fontStyle" },

package/dist/index.d.ts

@@ -6,6 +6,7 @@ export { createClassResolver } from './runtime/createClassResolver';
 export type { GlobalStyleBlock, GlobalStyleMap, GlobalStylesFactory, SerializedConfig, SystemInstance, } from './SystemBuilder';
 export { createSystem, SystemBuilder } from './SystemBuilder';
 export { createScale, numericOrStringScale, numericScale, stringScale, } from './scales/createScale';
+export { BUILT_IN_SELECTORS, type SelectorAlias, type SelectorAliasMap, } from './selectors';
 export type { Assign, AssignValueIfUnmergable, ColorModeConfig, FindPath, KeyAsVariable, LiteralPaths, Mergable, Merge, MergeTheme, Path, PathToLiteral, PathValue, PrivateThemeKeys, SanitizeKey, } from './theme';
 export { createTheme, ThemeBuilder } from './theme';
 export { borderShorthand } from './transforms/border';
@@ -13,7 +14,7 @@ export { createTransform, type NamedTransform, type TransformFn, } from './trans
 export { gridItem, gridItemRatio } from './transforms/grid';
 export { percentageOrAbsolute, size } from './transforms/size';
 export type { AnimusComponent, AnimusWrappedComponent, AnyBrandedComponent, ComposedFamily, SharedConfig, VariantPropsOf, } from './types/component';
-export type { AbstractParser, CompoundEntry, CSSPropMap, CSSProps, CustomPropConfig, Parser, ParserProps, Prop, PropertyValues, Scale, ScaleValue, SystemProps, ThemedCSSPropMap, ThemedCSSProps, ThemedScale, ThemedScaleValue, VariantConfig, } from './types/config';
+export type { AbstractParser, BuiltInSelectorAlias, CompoundEntry, CSSPropMap, CSSProps, CustomPropConfig, Parser, ParserProps, Prop, PropertyValues, Scale, ScaleValue, SelectorAliasProps, SystemProps, ThemedCSSPropMap, ThemedCSSProps, ThemedScale, ThemedScaleValue, VariantConfig, } from './types/config';
 export type { AbstractProps, MediaQueryMap, ResponsiveProp, ThemeProps, } from './types/props';
 export type { ArrayScale, MapScale } from './types/scales';
 export type { CSSObject } from './types/shared';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAEzE,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAC;AACpE,YAAY,EACV,gBAAgB,EAChB,cAAc,EACd,mBAAmB,EACnB,gBAAgB,EAChB,cAAc,GACf,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAE9D,OAAO,EACL,WAAW,EACX,oBAAoB,EACpB,YAAY,EACZ,WAAW,GACZ,MAAM,sBAAsB,CAAC;AAC9B,YAAY,EACV,MAAM,EACN,uBAAuB,EACvB,eAAe,EACf,QAAQ,EACR,aAAa,EACb,YAAY,EACZ,QAAQ,EACR,KAAK,EACL,UAAU,EACV,IAAI,EACJ,aAAa,EACb,SAAS,EACT,gBAAgB,EAChB,WAAW,GACZ,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACpD,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAEtD,OAAO,EACL,eAAe,EACf,KAAK,cAAc,EACnB,KAAK,WAAW,GACjB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,oBAAoB,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAE/D,YAAY,EACV,eAAe,EACf,sBAAsB,EACtB,mBAAmB,EACnB,cAAc,EACd,YAAY,EACZ,cAAc,GACf,MAAM,mBAAmB,CAAC;AAC3B,YAAY,EACV,cAAc,EACd,aAAa,EACb,UAAU,EACV,QAAQ,EACR,gBAAgB,EAChB,MAAM,EACN,WAAW,EACX,IAAI,EACJ,cAAc,EACd,KAAK,EACL,UAAU,EACV,WAAW,EACX,gBAAgB,EAChB,cAAc,EACd,WAAW,EACX,gBAAgB,EAChB,aAAa,GACd,MAAM,gBAAgB,CAAC;AACxB,YAAY,EACV,aAAa,EACb,aAAa,EACb,cAAc,EACd,UAAU,GACX,MAAM,eAAe,CAAC;AACvB,YAAY,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC3D,YAAY,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAEhD,YAAY,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACb,aAAa,EACb,aAAa,EACb,iBAAiB,EACjB,aAAa,EACb,eAAe,EACf,KAAK,EACL,aAAa,EACb,WAAW,GACZ,MAAM,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAEzE,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAC;AACpE,YAAY,EACV,gBAAgB,EAChB,cAAc,EACd,mBAAmB,EACnB,gBAAgB,EAChB,cAAc,GACf,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAE9D,OAAO,EACL,WAAW,EACX,oBAAoB,EACpB,YAAY,EACZ,WAAW,GACZ,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EACL,kBAAkB,EAClB,KAAK,aAAa,EAClB,KAAK,gBAAgB,GACtB,MAAM,aAAa,CAAC;AACrB,YAAY,EACV,MAAM,EACN,uBAAuB,EACvB,eAAe,EACf,QAAQ,EACR,aAAa,EACb,YAAY,EACZ,QAAQ,EACR,KAAK,EACL,UAAU,EACV,IAAI,EACJ,aAAa,EACb,SAAS,EACT,gBAAgB,EAChB,WAAW,GACZ,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACpD,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAEtD,OAAO,EACL,eAAe,EACf,KAAK,cAAc,EACnB,KAAK,WAAW,GACjB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,oBAAoB,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAE/D,YAAY,EACV,eAAe,EACf,sBAAsB,EACtB,mBAAmB,EACnB,cAAc,EACd,YAAY,EACZ,cAAc,GACf,MAAM,mBAAmB,CAAC;AAC3B,YAAY,EACV,cAAc,EACd,oBAAoB,EACpB,aAAa,EACb,UAAU,EACV,QAAQ,EACR,gBAAgB,EAChB,MAAM,EACN,WAAW,EACX,IAAI,EACJ,cAAc,EACd,KAAK,EACL,UAAU,EACV,kBAAkB,EAClB,WAAW,EACX,gBAAgB,EAChB,cAAc,EACd,WAAW,EACX,gBAAgB,EAChB,aAAa,GACd,MAAM,gBAAgB,CAAC;AACxB,YAAY,EACV,aAAa,EACb,aAAa,EACb,cAAc,EACd,UAAU,GACX,MAAM,eAAe,CAAC;AACvB,YAAY,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC3D,YAAY,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAEhD,YAAY,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACb,aAAa,EACb,aAAa,EACb,iBAAiB,EACjB,aAAa,EACb,eAAe,EACf,KAAK,EACL,aAAa,EACb,WAAW,GACZ,MAAM,eAAe,CAAC"}

package/dist/index.js

@@ -1,4 +1,4 @@
-import { n as createComponent, t as createClassResolver } from "./createClassResolver-u1d160An.js";
+import { n as createComponent, t as createClassResolver } from "./createClassResolver-Qh7lL0eP.js";
 import { a as borderShorthand, c as numericOrStringScale, i as gridItemRatio, l as numericScale, n as size, o as createTransform, r as gridItem, s as createScale, t as percentageOrAbsolute, u as stringScale } from "./size-BjymBo7z.js";
 import { createContext, createElement, forwardRef, useContext } from "react";
 //#region src/utils/deepMerge.ts
@@ -229,70 +229,220 @@ var Animus = class extends AnimusWithBase {
 };
 //#endregion
 //#region src/compose.ts
-const EMPTY_SHARED = {};
 /**
 * Compose independently-authored Animus components into a sealed,
 * namespaced component family with shared variant propagation via
-* React context.
+* CSS cascade.
 *
 * - **Enforce**: TypeScript ensures shared keys exist on Root (the
-*   provider). Non-Root slots that have the key consume it from
-*   context; slots without the key are unaffected.
-* - **Wire**: Root provides shared variant values via context.
-*   Child slots consume from context. Direct props override context.
+*   cascade source). Non-Root slots that have the key consume it from
+*   CSS inheritance; slots without the key are unaffected.
+* - **Wire**: The extraction pipeline emits composed variant CSS
+*   rules — two per shared variant option per child (inheritance +
+*   override) within @layer variants.
+* - **Context**: When `context: true`, shared variant prop values
+*   are also propagated via React context for portal-mounted children
+*   that CSS descendant selectors cannot reach.
 * - **Seal**: Output components are plain ForwardRefExoticComponent —
 *   no `.extend()`, no builder methods. One-way door from builder-land
 *   to component-land.
 */
 function compose(slots, options) {
-	const sharedKeys = Object.keys(options.shared);
-	const FamilyContext = createContext(EMPTY_SHARED);
 	const familyName = options.name ?? "Composed";
+	const useCtx = options.context ?? false;
+	const FamilyCtx = useCtx ? createContext({}) : null;
+	const sharedKeySet = useCtx ? new Set(Object.keys(options.shared)) : null;
 	const result = {};
-	for (const [name, SourceComponent] of Object.entries(slots)) if (name === "Root") {
-		const RootWrapper = forwardRef((props, ref) => {
-			const sharedValues = {};
-			for (const key of sharedKeys) if (key in props) sharedValues[key] = props[key];
-			return createElement(FamilyContext.Provider, { value: sharedKeys.length > 0 ? sharedValues : EMPTY_SHARED }, createElement(SourceComponent, {
+	for (const [name, SourceComponent] of Object.entries(slots)) {
+		let Wrapper;
+		if (name === "Root" && FamilyCtx && sharedKeySet) Wrapper = forwardRef((props, ref) => {
+			const shared = {};
+			for (const key of sharedKeySet) if (key in props) shared[key] = props[key];
+			return createElement(SourceComponent, {
 				...props,
 				ref
-			}));
+			}, createElement(FamilyCtx.Provider, { value: shared }, props.children));
 		});
-		RootWrapper.displayName = `${familyName}.${name}`;
-		result[name] = RootWrapper;
-	} else {
-		const knownKeys = SourceComponent.__variantKeys;
-		const ChildWrapper = forwardRef((props, ref) => {
-			const shared = useContext(FamilyContext);
-			let merged;
-			if (knownKeys && sharedKeys.length > 0) {
-				const filtered = {};
-				for (const key of sharedKeys) if (knownKeys.has(key) && key in shared) filtered[key] = shared[key];
-				merged = {
-					...filtered,
-					...props,
-					ref
-				};
-			} else merged = {
+		else if (FamilyCtx) Wrapper = forwardRef((props, ref) => {
+			return createElement(SourceComponent, {
+				...useContext(FamilyCtx),
 				...props,
 				ref
-			};
-			return createElement(SourceComponent, merged);
+			});
 		});
-		ChildWrapper.displayName = `${familyName}.${name}`;
-		result[name] = ChildWrapper;
+		else Wrapper = forwardRef((props, ref) => createElement(SourceComponent, {
+			...props,
+			ref
+		}));
+		Wrapper.displayName = `${familyName}.${name}`;
+		result[name] = Wrapper;
 	}
 	if (!("Root" in result)) throw new Error("compose(): No \"Root\" slot found. The root slot key must be exactly \"Root\" (PascalCase).");
 	return result;
 }
 //#endregion
+//#region src/selectors.ts
+/**
+* Built-in selector aliases.
+*
+* Compound selectors (e.g. `_disabled`) target multiple CSS selectors
+* via comma-separation to cover native, ARIA, and data attribute conventions.
+*/
+const BUILT_IN_SELECTORS = {
+	_link: {
+		selector: "&:link",
+		order: 10
+	},
+	_visited: {
+		selector: "&:visited",
+		order: 20
+	},
+	_hover: {
+		selector: "&:hover",
+		order: 30
+	},
+	_focusWithin: {
+		selector: "&:focus-within",
+		order: 40
+	},
+	_focus: {
+		selector: "&:focus",
+		order: 50
+	},
+	_focusVisible: {
+		selector: "&:focus-visible",
+		order: 60
+	},
+	_active: {
+		selector: "&:active",
+		order: 70
+	},
+	_target: {
+		selector: "&:target",
+		order: 80
+	},
+	_checked: {
+		selector: "&:checked, &[aria-checked=\"true\"], &[data-checked]",
+		order: 100
+	},
+	_invalid: {
+		selector: "&:invalid, &[aria-invalid=\"true\"], &[data-invalid]",
+		order: 110
+	},
+	_required: {
+		selector: "&:required, &[aria-required=\"true\"]",
+		order: 120
+	},
+	_readOnly: {
+		selector: "&:read-only, &[aria-readonly=\"true\"], &[data-readonly]",
+		order: 130
+	},
+	_expanded: {
+		selector: "&[aria-expanded=\"true\"], &[data-expanded]",
+		order: 140
+	},
+	_selected: {
+		selector: "&[aria-selected=\"true\"], &[data-selected]",
+		order: 150
+	},
+	_pressed: {
+		selector: "&[aria-pressed=\"true\"], &[data-pressed]",
+		order: 160
+	},
+	_disabled: {
+		selector: "&:disabled, &[disabled], &[aria-disabled=\"true\"], &[data-disabled]",
+		order: 200
+	},
+	_before: {
+		selector: "&::before",
+		order: 300
+	},
+	_after: {
+		selector: "&::after",
+		order: 310
+	},
+	_placeholder: {
+		selector: "&::placeholder",
+		order: 320
+	},
+	_selection: {
+		selector: "&::selection",
+		order: 330
+	},
+	_first: {
+		selector: "&:first-child",
+		order: 400
+	},
+	_last: {
+		selector: "&:last-child",
+		order: 410
+	},
+	_even: {
+		selector: "&:nth-child(even)",
+		order: 420
+	},
+	_odd: {
+		selector: "&:nth-child(odd)",
+		order: 430
+	},
+	_empty: {
+		selector: "&:empty",
+		order: 440
+	}
+};
+/**
+* Merge user-provided selectors with built-in defaults.
+* User selectors override built-in aliases of the same name.
+* New aliases get an order value based on their position (500+).
+*/
+function mergeSelectors(base, custom) {
+	const merged = { ...base };
+	let nextOrder = 500;
+	for (const [key, selector] of Object.entries(custom)) if (key in merged) merged[key] = {
+		selector,
+		order: merged[key].order
+	};
+	else {
+		merged[key] = {
+			selector,
+			order: nextOrder
+		};
+		nextOrder += 10;
+	}
+	return merged;
+}
+/** Get the sorted alias keys for deterministic cascade ordering. */
+function getSortedAliasKeys(map) {
+	return Object.keys(map).sort((a, b) => map[a].order - map[b].order);
+}
+/**
+* Serialize the selector map for the extraction pipeline.
+* Emits a flat `Record<string, string>` (alias → selector) plus
+* the ordered key list for cascade determinism.
+*/
+function serializeSelectorMap(map) {
+	const selectors = {};
+	const order = getSortedAliasKeys(map);
+	for (const key of order) selectors[key] = map[key].selector;
+	return {
+		selectors,
+		order
+	};
+}
+//#endregion
 //#region src/SystemBuilder.ts
 var SystemBuilder = class SystemBuilder {
 	#propRegistry;
 	#groupRegistry;
-	constructor(propRegistry, groupRegistry) {
+	#selectorRegistry;
+	constructor(propRegistry, groupRegistry, selectorRegistry) {
 		this.#propRegistry = propRegistry || {};
 		this.#groupRegistry = groupRegistry || {};
+		this.#selectorRegistry = selectorRegistry || { ...BUILT_IN_SELECTORS };
+	}
+	addSelectors(selectors) {
+		const merged = mergeSelectors(this.#selectorRegistry, selectors);
+		return new SystemBuilder(this.#propRegistry, this.#groupRegistry, merged);
 	}
 	addGroup(name, config) {
 		if (name in this.#propRegistry) throw new Error(`Group name "${name}" collides with an existing prop name. Group names and prop names must be disjoint.`);
@@ -309,7 +459,7 @@ var SystemBuilder = class SystemBuilder {
 		return new SystemBuilder(nextProps, {
 			...this.#groupRegistry,
 			...newGroup
-		});
+		}, this.#selectorRegistry);
 	}
 	addProps(config) {
 		for (const key of Object.keys(config)) if (key in this.#groupRegistry) throw new Error(`Prop name "${key}" collides with an existing group name. Group names and prop names must be disjoint.`);
@@ -321,17 +471,18 @@ var SystemBuilder = class SystemBuilder {
 		return new SystemBuilder({
 			...this.#propRegistry,
 			...config
-		}, this.#groupRegistry);
+		}, this.#groupRegistry, this.#selectorRegistry);
 	}
 	includes(_systems) {
-		return this;
+		return new SystemBuilder(this.#propRegistry, this.#groupRegistry, this.#selectorRegistry);
 	}
 	build() {
 		const animus = new Animus(this.#propRegistry, this.#groupRegistry);
 		const propRegistry = this.#propRegistry;
 		const groupRegistry = this.#groupRegistry;
+		const selectorRegistry = this.#selectorRegistry;
 		const system = Object.assign(animus, { toConfig: () => {
-			return serializeInstance(propRegistry, groupRegistry);
+			return serializeInstance(propRegistry, groupRegistry, selectorRegistry);
 		} });
 		const createGlobalStyles = (styles) => {
 			return {
@@ -348,7 +499,7 @@ var SystemBuilder = class SystemBuilder {
 		};
 	}
 };
-function serializeInstance(propRegistry, groupRegistry) {
+function serializeInstance(propRegistry, groupRegistry, selectorRegistry) {
 	const serialized = {};
 	const transforms = {};
 	for (const [propName, entry] of Object.entries(propRegistry)) {
@@ -369,10 +520,13 @@ function serializeInstance(propRegistry, groupRegistry) {
 		if (entry.currentVar) s.currentVar = entry.currentVar;
 		serialized[propName] = s;
 	}
+	const { selectors, order } = serializeSelectorMap(selectorRegistry);
 	return {
 		propConfig: JSON.stringify(serialized),
 		groupRegistry: JSON.stringify(groupRegistry),
-		transforms
+		transforms,
+		selectorAliases: JSON.stringify(selectors),
+		selectorOrder: JSON.stringify(order)
 	};
 }
 function createSystem() {
@@ -755,4 +909,4 @@ function buildVariableCss(rootVariables, breakpointVariables, modeVariables) {
 	return parts.join("\n\n");
 }
 //#endregion
-export { Animus, AnimusExtended, AnimusExtendedWithAll, AnimusWithAll, SystemBuilder, ThemeBuilder, borderShorthand, compose, createClassResolver, createComponent, createScale, createSystem, createTheme, createTransform, gridItem, gridItemRatio, numericOrStringScale, numericScale, percentageOrAbsolute, size, stringScale };
+export { Animus, AnimusExtended, AnimusExtendedWithAll, AnimusWithAll, BUILT_IN_SELECTORS, SystemBuilder, ThemeBuilder, borderShorthand, compose, createClassResolver, createComponent, createScale, createSystem, createTheme, createTransform, gridItem, gridItemRatio, numericOrStringScale, numericScale, percentageOrAbsolute, size, stringScale };

package/dist/runtime/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/runtime/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAiB,UAAU,EAAE,MAAM,OAAO,CAAC;AAElD,OAAO,EACL,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EAEtB,KAAK,aAAa,EACnB,MAAM,kBAAkB,CAAC;AAE1B,UAAU,eAAgB,SAAQ,mBAAmB;CAAG;AAIxD,KAAK,WAAW,GAAG,MAAM,GAAG,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;AAErD,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG;IACrD,MAAM,EAAE,MAAM,KAAK,CAAC;CACrB,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,eAAe,EACvB,aAAa,CAAC,EAAE,aAAa,EAC7B,iBAAiB,CAAC,EAAE,iBAAiB,GACpC,eAAe,CA4FjB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/runtime/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAyC,UAAU,EAAkB,MAAM,OAAO,CAAC;AAE1F,OAAO,EACL,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EAEtB,KAAK,aAAa,EACnB,MAAM,kBAAkB,CAAC;AAE1B,UAAU,eAAgB,SAAQ,mBAAmB;CAAG;AAIxD,KAAK,WAAW,GAAG,MAAM,GAAG,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;AAErD,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG;IACrD,MAAM,EAAE,MAAM,KAAK,CAAC;CACrB,CAAC;AAgBF;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,eAAe,EACvB,aAAa,CAAC,EAAE,aAAa,EAC7B,iBAAiB,CAAC,EAAE,iBAAiB,GACpC,eAAe,CAiIjB"}

package/dist/runtime-entry.js

@@ -1,2 +1,2 @@
-import { n as createComponent, t as createClassResolver } from "./createClassResolver-u1d160An.js";
+import { n as createComponent, t as createClassResolver } from "./createClassResolver-Qh7lL0eP.js";
 export { createClassResolver, createComponent };

package/dist/selectors.d.ts

@@ -0,0 +1,40 @@
+/**
+ * Selector alias registry — maps `_`-prefixed alias keys to CSS selectors.
+ *
+ * Sort order determines cascade precedence within a layer:
+ * later entries override earlier ones when specificity is equal.
+ * The ordering follows CSS conventions (LVHA) and interaction semantics
+ * (disabled beats interaction states, pseudo-elements after states).
+ */
+export interface SelectorAlias {
+    /** CSS selector string (comma-separated for compound selectors) */
+    selector: string;
+    /** Sort index for cascade ordering within a layer */
+    order: number;
+}
+export type SelectorAliasMap = Record<string, SelectorAlias>;
+/**
+ * Built-in selector aliases.
+ *
+ * Compound selectors (e.g. `_disabled`) target multiple CSS selectors
+ * via comma-separation to cover native, ARIA, and data attribute conventions.
+ */
+export declare const BUILT_IN_SELECTORS: SelectorAliasMap;
+/**
+ * Merge user-provided selectors with built-in defaults.
+ * User selectors override built-in aliases of the same name.
+ * New aliases get an order value based on their position (500+).
+ */
+export declare function mergeSelectors(base: SelectorAliasMap, custom: Record<string, string>): SelectorAliasMap;
+/** Get the sorted alias keys for deterministic cascade ordering. */
+export declare function getSortedAliasKeys(map: SelectorAliasMap): string[];
+/**
+ * Serialize the selector map for the extraction pipeline.
+ * Emits a flat `Record<string, string>` (alias → selector) plus
+ * the ordered key list for cascade determinism.
+ */
+export declare function serializeSelectorMap(map: SelectorAliasMap): {
+    selectors: Record<string, string>;
+    order: string[];
+};
+//# sourceMappingURL=selectors.d.ts.map

package/dist/selectors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectors.d.ts","sourceRoot":"","sources":["../src/selectors.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,MAAM,WAAW,aAAa;IAC5B,mEAAmE;IACnE,QAAQ,EAAE,MAAM,CAAC;IACjB,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;AAE7D;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,EAAE,gBAyDhC,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,cAAc,CAC5B,IAAI,EAAE,gBAAgB,EACtB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAC7B,gBAAgB,CAgBlB;AAED,oEAAoE;AACpE,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,gBAAgB,GAAG,MAAM,EAAE,CAElE;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,GAAG,EAAE,gBAAgB,GAAG;IAC3D,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAClC,KAAK,EAAE,MAAM,EAAE,CAAC;CACjB,CAOA"}