@yahoo/uds-create-config 5.48.2 → 5.48.3

package/dist/configs/react-native-system.d.ts

@@ -2,6 +2,7 @@ import { Ref } from "../framework/utils/ref-grammar.js";
 import { SubEntityClass } from "../framework/defineSubEntity.js";
 import { ComputedInput } from "../framework/registry.js";
 import { DerivedColor, Gradient } from "../entities/system/color.js";
+import { Shadow } from "../entities/system/shadow.js";
 import { ComposedValue } from "../entities/system/composed-values.js";
 import { EntityClass } from "../framework/defineEntity.js";
 import { ConfigClass } from "../framework/defineConfig.js";
@@ -97,13 +98,13 @@ declare const ReactNativeSystemDefinition: ConfigClass<{
     }, _$zod_v4_core0.$strict>>;
     cssVariable: _$zod.ZodOptional<_$zod.ZodUnion<readonly [_$zod.ZodString, _$zod.ZodLiteral<false>]>>;
   }, "value" | "overrides" | "property" | "cssVariable"> & {
-    value: _$zod.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | {
+    value: _$zod.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
       flexGrow: number;
       flexShrink: number;
       flexBasis: string | number;
     } | {
       fontSizeMultiplier: number;
-    }, unknown, _$zod_v4_core0.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | {
+    }, unknown, _$zod_v4_core0.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
       flexGrow: number;
       flexShrink: number;
       flexBasis: string | number;
@@ -112,13 +113,13 @@ declare const ReactNativeSystemDefinition: ConfigClass<{
     }, unknown>>;
     overrides: _$zod.ZodOptional<_$zod.ZodUnion<readonly [_$zod.ZodPipe<_$zod.ZodArray<_$zod.ZodObject<{
       on: _$zod.ZodType<OverrideCondition, unknown, _$zod_v4_core0.$ZodTypeInternals<OverrideCondition, unknown>>;
-      value: _$zod.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | {
+      value: _$zod.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
         flexGrow: number;
         flexShrink: number;
         flexBasis: string | number;
       } | {
         fontSizeMultiplier: number;
-      }, unknown, _$zod_v4_core0.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | {
+      }, unknown, _$zod_v4_core0.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
         flexGrow: number;
         flexShrink: number;
         flexBasis: string | number;
@@ -127,7 +128,7 @@ declare const ReactNativeSystemDefinition: ConfigClass<{
       }, unknown>>;
     }, _$zod_v4_core0.$strip>>, _$zod.ZodTransform<Record<string, {
       on: OverrideCondition;
-      value: string | number | boolean | Ref | DerivedColor | Gradient | {
+      value: string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
         flexGrow: number;
         flexShrink: number;
         flexBasis: string | number;
@@ -136,7 +137,7 @@ declare const ReactNativeSystemDefinition: ConfigClass<{
       };
     }>, {
       on: OverrideCondition;
-      value: string | number | boolean | Ref | DerivedColor | Gradient | {
+      value: string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
         flexGrow: number;
         flexShrink: number;
         flexBasis: string | number;
@@ -145,13 +146,13 @@ declare const ReactNativeSystemDefinition: ConfigClass<{
       };
     }[]>>, SubEntityClass<_$zod.ZodObject<{
       on: _$zod.ZodType<OverrideCondition, unknown, _$zod_v4_core0.$ZodTypeInternals<OverrideCondition, unknown>>;
-      value: _$zod.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | {
+      value: _$zod.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
         flexGrow: number;
         flexShrink: number;
         flexBasis: string | number;
       } | {
         fontSizeMultiplier: number;
-      }, unknown, _$zod_v4_core0.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | {
+      }, unknown, _$zod_v4_core0.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
         flexGrow: number;
         flexShrink: number;
         flexBasis: string | number;

package/dist/configs/system.js

@@ -26,6 +26,7 @@ import { buildExcludeMigration } from "../migrations/20261019165323_build_exclud
 import { nativeLinearGradientsMigration } from "../migrations/20261020173914_native_linear_gradients.js";
 import { linkedDirMigration } from "../migrations/20261020182408_linked_dir.js";
 import { lintSettingsMigration } from "../migrations/20261020183330_lint_settings.js";
+import { directLayerCompositesMigration } from "../migrations/20261022124223_direct_layer_composites.js";
 import { CanvasRole } from "../entities/system/CanvasRole.js";
 import { GlobalStyle } from "../entities/system/GlobalStyle.js";
 import { Guidance } from "../entities/system/Guidance.js";
@@ -182,6 +183,9 @@ if (!registeredSchemaMigrations().has(20261016201727)) registerSchemaMigrations(
 if (!registeredSchemaMigrations().has(20261019165323)) registerSchemaMigrations(buildExcludeMigration);
 if (!registeredSchemaMigrations().has(20261020173914)) registerSchemaMigrations(nativeLinearGradientsMigration);
 if (!registeredSchemaMigrations().has(20261020182408)) registerSchemaMigrations(linkedDirMigration);
-if (!registeredSchemaMigrations().has(20261020183330)) registerSchemaMigrations(lintSettingsMigration);
+if (!registeredSchemaMigrations().has(20261020183330)) {
+	registerSchemaMigrations(lintSettingsMigration);
+	registerSchemaMigrations(directLayerCompositesMigration);
+}
 //#endregion
 export { System };

package/dist/entities/native/NativeToken.d.ts

@@ -2,6 +2,7 @@ import { Ref } from "../../framework/utils/ref-grammar.js";
 import { Ref as Ref$1 } from "../../framework/utils/refs.js";
 import { SubEntityClass } from "../../framework/defineSubEntity.js";
 import { DerivedColor, Gradient } from "../system/color.js";
+import { Shadow } from "../system/shadow.js";
 import { ComposedValue } from "../system/composed-values.js";
 import { EntityClass } from "../../framework/defineEntity.js";
 import { OverrideCondition } from "../system/Token.js";
@@ -10,7 +11,7 @@ import { RelativeLineHeightValue } from "../system/linked-line-height-values.js"
 import { z } from "zod";
 
 //#region src/entities/native/NativeToken.d.ts
-declare const nativeTokenValue: z.ZodType<number | boolean | string | Ref$1 | DerivedColor | Gradient | NativeFlexValue | RelativeLineHeightValue>;
+declare const nativeTokenValue: z.ZodType<number | boolean | string | Ref$1 | DerivedColor | Gradient | Shadow | NativeFlexValue | RelativeLineHeightValue>;
 declare const NativeToken: EntityClass<z.ZodObject<Omit<{
   value: z.ZodType<string | number | Ref | ComposedValue, unknown, z.core.$ZodTypeInternals<string | number | Ref | ComposedValue, unknown>>;
   type: z.ZodOptional<z.ZodString>;
@@ -34,13 +35,13 @@ declare const NativeToken: EntityClass<z.ZodObject<Omit<{
   }, z.core.$strict>>;
   cssVariable: z.ZodOptional<z.ZodUnion<readonly [z.ZodString, z.ZodLiteral<false>]>>;
 }, "value" | "overrides" | "property" | "cssVariable"> & {
-  value: z.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | {
+  value: z.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
     flexGrow: number;
     flexShrink: number;
     flexBasis: string | number;
   } | {
     fontSizeMultiplier: number;
-  }, unknown, z.core.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | {
+  }, unknown, z.core.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
     flexGrow: number;
     flexShrink: number;
     flexBasis: string | number;
@@ -49,13 +50,13 @@ declare const NativeToken: EntityClass<z.ZodObject<Omit<{
   }, unknown>>;
   overrides: z.ZodOptional<z.ZodUnion<readonly [z.ZodPipe<z.ZodArray<z.ZodObject<{
     on: z.ZodType<OverrideCondition, unknown, z.core.$ZodTypeInternals<OverrideCondition, unknown>>;
-    value: z.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | {
+    value: z.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
       flexGrow: number;
       flexShrink: number;
       flexBasis: string | number;
     } | {
       fontSizeMultiplier: number;
-    }, unknown, z.core.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | {
+    }, unknown, z.core.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
       flexGrow: number;
       flexShrink: number;
       flexBasis: string | number;
@@ -64,7 +65,7 @@ declare const NativeToken: EntityClass<z.ZodObject<Omit<{
     }, unknown>>;
   }, z.core.$strip>>, z.ZodTransform<Record<string, {
     on: OverrideCondition;
-    value: string | number | boolean | Ref | DerivedColor | Gradient | {
+    value: string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
       flexGrow: number;
       flexShrink: number;
       flexBasis: string | number;
@@ -73,7 +74,7 @@ declare const NativeToken: EntityClass<z.ZodObject<Omit<{
     };
   }>, {
     on: OverrideCondition;
-    value: string | number | boolean | Ref | DerivedColor | Gradient | {
+    value: string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
       flexGrow: number;
       flexShrink: number;
       flexBasis: string | number;
@@ -82,13 +83,13 @@ declare const NativeToken: EntityClass<z.ZodObject<Omit<{
     };
   }[]>>, SubEntityClass<z.ZodObject<{
     on: z.ZodType<OverrideCondition, unknown, z.core.$ZodTypeInternals<OverrideCondition, unknown>>;
-    value: z.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | {
+    value: z.ZodType<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
       flexGrow: number;
       flexShrink: number;
       flexBasis: string | number;
     } | {
       fontSizeMultiplier: number;
-    }, unknown, z.core.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | {
+    }, unknown, z.core.$ZodTypeInternals<string | number | boolean | Ref | DerivedColor | Gradient | Shadow | {
       flexGrow: number;
       flexShrink: number;
       flexBasis: string | number;

package/dist/entities/native/NativeToken.js

@@ -1,6 +1,7 @@
 import { NATIVE_CONFIG_NAME } from "../../configs/platform.js";
 import { refSchema } from "../../framework/utils/refs.js";
 import { oklchColor } from "../system/color.js";
+import { shadowValue } from "../system/shadow.js";
 import { orList } from "../../framework/defineSubEntity.js";
 import { Font } from "../system/Font.js";
 import { nativeFlexValue } from "../system/linked-flex-values.js";
@@ -15,7 +16,8 @@ import { z } from "zod";
 * (`'45deg'`, `'50%'`, a hex or RGB color, `'transparent'`), an alias to another token, a font-family
 * ref, a derived color (`mix()`/`alpha()` resolve to a concrete color, so they carry), or explicit
 * native flex declarations (a linked shorthand needs all three longhands), or a relative line
-* height resolved against the destination text layer's font size, or a structured linear gradient. What
+* height resolved against the destination text layer's font size, or a structured linear gradient
+* or shadow whose colors resolve with the theme. What
 * deliberately does not validate is web's open string arm — `'1rem'`, `calc(…)`, `'50vh'` mean
 * nothing off the web, and refusing them here is the platform model: the config is the platform,
 * so a native config cannot hold a web value.
@@ -76,6 +78,7 @@ const nativeTokenValue = z.union([
 	Font,
 	nativeDerivedColor,
 	nativeGradient,
+	shadowValue,
 	nativeFlexValue,
 	relativeLineHeightValue
 ]);

package/dist/entities/system/Component.js

@@ -14,7 +14,7 @@ import { listedIn } from "../../framework/utils/enumerated.js";
 import { valueSchemaOf } from "../../framework/value-domain.js";
 import { Package } from "./Package.js";
 import { bindPreviewGlyphs, glyphMemberRefIn } from "./glyph-identity.js";
-import { Style, addBagKeyIssues, anatomyPropValue, bagNameEdges, bagRewriteName, bindBagTokens, collectBag, isPlainRecord, nativeStyleArray, openBag, styleValueFor } from "./style-bag.js";
+import { Style, addBagKeyIssues, anatomyPropValue, bagNameEdges, bagRewriteName, bindBagTokens, collectBag, compositeApplication, isPlainRecord, nativeStyleArray, openBag, styleValueFor } from "./style-bag.js";
 import { storedPreview } from "../../framework/preview-store.js";
 import { glyphPropsOf, glyphPropsOfBody, propOwner, propValueDomain, refListOf, resolveComponentProps, stylePropNumberUnit, stylePropValueLeaves, validateComponentProps } from "../../framework/projections.js";
 import { carriesContent, intoName, isValueSlot, renderBoundProp, routedPropIn, routesContent, surfaceProps } from "../../framework/prop-surface.js";
@@ -1063,7 +1063,7 @@ const StyleRule = defineSubEntity({
 		const body = parent;
 		if (!config || !body) return z.object({
 			when: z.record(z.string(), z.unknown()).nullable().default(null),
-			layers: z.record(z.string(), z.record(z.string(), z.union([styleValueFor(config), z.never()], { error: "a layer bag value is a style-prop value — a token leaf such as `surface`, a keyword, a bracketed literal such as `[13px]` — or a modifier block holding more of them. Content is not set in a style rule: a glyph or a nested element is an anatomy node under the layer's node, `{ \"element\": { \"__ref\": \"icon:<library>/<Name>\" }, \"visible\": { \"$state\": \"<prop>\", \"eq\": \"<value>\" } }` to show one per variant value." })), { error: ruleShapeError })
+			layers: z.record(z.string(), z.object({ composite: compositeApplication.optional() }).catchall(z.union([styleValueFor(config), z.never()], { error: "a layer bag value is a style-prop value — a token leaf such as `surface`, a keyword, a bracketed literal such as `[13px]` — or a modifier block holding more of them. Content is not set in a style rule: a glyph or a nested element is an anatomy node under the layer's node, `{ \"element\": { \"__ref\": \"icon:<library>/<Name>\" }, \"visible\": { \"$state\": \"<prop>\", \"eq\": \"<value>\" } }` to show one per variant value." })), { error: ruleShapeError })
 		}, { error: ruleShapeError });
 		return perOwner({
 			cache: ruleSchemas,

package/dist/entities/system/Composite.js

@@ -1,6 +1,6 @@
 import { defineEntity } from "../../framework/defineEntity.js";
 import { translateLinkedStyleBags } from "./linked-style-values.js";
-import { Style, bagNameEdges, bagRewriteName, collectBag } from "./style-bag.js";
+import { Style, bagNameEdges, bagRewriteName, collectBag, compositeApplication } from "./style-bag.js";
 import { z } from "zod";
 //#region src/entities/system/Composite.ts
 /** A composite's one bag. Same shape as a component's, so the same hooks read it. */
@@ -18,6 +18,11 @@ const Composite = defineEntity({
 		...args,
 		bags: compositeBags
 	}),
+	layerKeys: { composite: {
+		preserveRefs: true,
+		schema: () => compositeApplication.describe("Apply one Composite.ref or an ordered list directly to this layer. Later composites win; explicit layer styles win over them. This does not declare a public prop."),
+		reach: () => "none"
+	} },
 	label: "Composite style",
 	labelPlural: "Composite styles",
 	fields: z.object({ styles: Style.describe("The style values the composite bundles. Each declaration is a member, so an editor writes one key at a time.") }),

package/dist/entities/system/Modifier.d.ts

@@ -43,8 +43,8 @@ type ModifierGroupMeta = z.infer<typeof modifierGroupFields> & {
 };
 declare const ModifierDefinition: EntityClass<z.ZodObject<{
   type: z.ZodEnum<{
-    selector: "selector";
     composite: "composite";
+    selector: "selector";
     "media-query": "media-query";
     "starting-style": "starting-style";
   }>;

package/dist/entities/system/applied-composites.d.ts

@@ -0,0 +1,9 @@
+import { Config } from "../../framework/Config.js";
+
+//#region src/entities/system/applied-composites.d.ts
+/** Resolve fixed composite selections before emitting CSS, native data or editor values.
+ * Later selections win; explicit declarations win over every selection. Modifier blocks merge.
+ * References remain in stored config so edits, renames and dependency tracking retain the link. */
+declare function resolveAppliedComposites(config: Config, bag: Record<string, unknown>, ancestry?: readonly string[]): Record<string, unknown>;
+//#endregion
+export { resolveAppliedComposites };

package/dist/entities/system/applied-composites.js

@@ -0,0 +1,47 @@
+import { isRef, kindOf, memberOf, pathOf, sourceOf } from "../../framework/utils/refs.js";
+//#region src/entities/system/applied-composites.ts
+/** Resolve fixed composite selections before emitting CSS, native data or editor values.
+* Later selections win; explicit declarations win over every selection. Modifier blocks merge.
+* References remain in stored config so edits, renames and dependency tracking retain the link. */
+function resolveAppliedComposites(config, bag, ancestry = []) {
+	const selection = bag.composite;
+	let base = {};
+	for (const selected of selection === void 0 ? [] : Array.isArray(selection) ? selection : [selection]) {
+		if (!isRef(selected) || kindOf(selected) !== "composite" || memberOf(selected) !== void 0) throw new Error("A layer composite must be a Composite.ref to an item.");
+		const path = pathOf(selected);
+		const identity = selected.__ref;
+		if (ancestry.includes(identity)) throw new Error(`Circular composite application: ${[...ancestry, identity].join(" -> ")}`);
+		const slug = sourceOf(selected);
+		const body = slug === void 0 || config.configFor(selected) === config ? config.resolve("composite", path)?.toJSON() : config.copyOf({
+			slug,
+			kind: "composite",
+			path
+		});
+		if (!body) throw new Error(`Cannot apply composite:${path}: expected a composite item.`);
+		const { styles = {} } = body;
+		base = mergeStyleBags(base, resolveAppliedComposites(config, styles, [...ancestry, identity]));
+	}
+	const own = {};
+	let changed = selection !== void 0;
+	for (const [key, value] of Object.entries(bag)) {
+		if (key === "composite") continue;
+		own[key] = key.startsWith("_") && isPlainBlock(value) ? resolveAppliedComposites(config, value, ancestry) : value;
+		changed ||= own[key] !== value;
+	}
+	return changed ? mergeStyleBags(base, own) : bag;
+}
+/** `over` laid on `base`, with a modifier block (`_md`, `_hover`) merged key by key rather than
+*  replaced, so a bag that adds one breakpoint value keeps the composite's others. */
+function mergeStyleBags(base, over) {
+	const out = { ...base };
+	for (const [key, value] of Object.entries(over)) {
+		const prior = out[key];
+		out[key] = key.startsWith("_") && isPlainBlock(prior) && isPlainBlock(value) ? mergeStyleBags(prior, value) : value;
+	}
+	return out;
+}
+function isPlainBlock(value) {
+	return typeof value === "object" && value !== null && !isRef(value);
+}
+//#endregion
+export { mergeStyleBags, resolveAppliedComposites };

package/dist/entities/system/component-module.js

@@ -16,7 +16,7 @@ import { contentKey } from "../../framework/utils/content-key.js";
 * The shared compiler/runtime contract. Bump whenever codegen can produce different module bytes
 * from identical config-visible inputs (shim contracts, entry shape, transforms, and so on).
 */
-const COMPONENT_MODULE_BUILD_VERSION = 6;
+const COMPONENT_MODULE_BUILD_VERSION = 7;
 /**
 * Generated web runtime inputs shared by every component module. These are intentionally separate
 * from the per-file closure: editing an unrelated component should not invalidate this module, but

package/dist/entities/system/style-bag.d.ts

@@ -1,3 +1,4 @@
+import { Ref } from "../../framework/utils/refs.js";
 import { SubEntityClass } from "../../framework/defineSubEntity.js";
 import { RegisteredModifiers, RegisteredStyleProps } from "../../framework/registered.js";
 import { ComposedValue } from "./composed-values.js";
@@ -16,7 +17,9 @@ import { z } from "zod";
  */
 type StyleValue = string | number | boolean | {
   readonly __ref: string;
-} | ComposedValue | readonly (string | number | boolean)[] | {
+} | ComposedValue | readonly (string | number | boolean)[] | readonly {
+  readonly __ref: string;
+}[] | {
   readonly [key: string]: StyleValue;
 };
 /**
@@ -32,7 +35,9 @@ type StyleValue = string | number | boolean | {
 declare const StyleDefinition: SubEntityClass<z.ZodType<StyleValue, unknown, z.core.$ZodTypeInternals<StyleValue, unknown>>>;
 interface StyleClass extends Named<typeof StyleDefinition> {}
 /** The style props the system registers, each taking any value a bag stores. */
-type RegisteredStyleBag = { [K in keyof RegisteredStyleProps]?: StyleValue };
+type RegisteredStyleBag = { [K in keyof RegisteredStyleProps]?: StyleValue } & {
+  composite?: Ref | readonly Ref[];
+};
 /**
  * A bag as a config file writes one when nothing but style props and modifiers may key it: the style
  * props the system registers, and a `_modifier` block of the same. Open until the build has filled

package/dist/entities/system/style-bag.js

@@ -1,5 +1,5 @@
 import "../../configs/platform.js";
-import { isExtendedRef, isRef, ref, refSchema, splitRef } from "../../framework/utils/refs.js";
+import { isExtendedRef, isRef, kindOf, ref, refSchema, splitRef } from "../../framework/utils/refs.js";
 import { composedValueSchemas } from "./composed-values.js";
 import { defineSubEntity } from "../../framework/defineSubEntity.js";
 import { isCssProperty, kebabCase } from "../../css/values.js";
@@ -8,6 +8,9 @@ import { glyphMemberRefIn, glyphPackageRef } from "./glyph-identity.js";
 import { glyphPropsOfBody, isCustomPropertyKey, refListOf, stylePropTokenPath } from "../../framework/projections.js";
 import { z } from "zod";
 //#region src/entities/system/style-bag.ts
+/** Fixed style composition, separate from the selectable members of a public composite prop. */
+const compositeReference = refSchema.refine((value) => kindOf(value) === "composite", "Expected a Composite.ref to a composite item.");
+const compositeApplication = z.union([compositeReference, z.array(compositeReference)]);
 /** Literal arrays such as React Native Text fontVariant; element trees remain anatomy. */
 const nativeStyleArray = z.array(z.union([
 	z.string(),
@@ -25,7 +28,7 @@ function styleValueSchema(arrays) {
 		...composedValueSchemas,
 		glyphPackageRef,
 		...arrays ? [nativeStyleArray] : [],
-		z.record(z.string(), value)
+		z.object({ composite: compositeApplication.optional() }).catchall(value)
 	]));
 	return value;
 }
@@ -67,7 +70,10 @@ const Style = defineSubEntity({
 	*/
 	fields: ({ config, parent, key }) => {
 		const value = styleValueFor(config);
+		if (key === "composite") return compositeApplication;
 		if (!config || key === void 0) return styleValue;
+		const owned = config.layerKeys().get(key);
+		if (owned) return owned.schema(void 0);
 		if (key.startsWith("_")) return openBag(config);
 		const bound = (config, declaration) => z.union([valueSchemaOf(declaration, config), value]);
 		const declared = parent?.props?.[key];
@@ -283,4 +289,4 @@ function openBag(config, { cssBehind = true, values = styleValueFor(config) } =
 	})).transform((bag) => bindBagTokens(config, bag));
 }
 //#endregion
-export { Style, addBagKeyIssues, anatomyPropValue, bagNameEdges, bagRewriteName, bindBagTokens, camelCase, collectBag, isPlainRecord, nativeStyleArray, openBag, styleValueFor };
+export { Style, addBagKeyIssues, anatomyPropValue, bagNameEdges, bagRewriteName, bindBagTokens, camelCase, collectBag, compositeApplication, isPlainRecord, nativeStyleArray, openBag, styleValueFor };

package/dist/framework/Config.d.ts

@@ -73,7 +73,7 @@ interface RecordedSource {
  * The dense-counter `2` a short-lived scheme stamped before the chain existed reads as the mint
  * that replaced it (see `detectedWireVersion`).
  */
-declare const SERIALIZED_CONFIG_VERSION = 20261020183330;
+declare const SERIALIZED_CONFIG_VERSION = 20261022124223;
 interface SerializedConfig {
   /** See {@link SERIALIZED_CONFIG_VERSION}. Always written; a stored artifact may lack it. */
   readonly version: number;
@@ -2196,6 +2196,9 @@ declare class Config {
    * Sorted, so anything built from it is deterministic.
    */
   sourceClosure(slug: string, kind?: string): string[];
+  /** Prose mentions remain in the reference graph and saved source data, but do not
+   * require executable copies or runtime dependencies in the consuming system. */
+  private dependencyBody;
   /** References used after local overrides; sourceClosure also preserves the original bases. */
   runtimeSourceClosure({
     slug,

package/dist/framework/Config.js

@@ -4431,6 +4431,12 @@ var Config = class Config {
 		cache.set(slug, targets);
 		return kind === void 0 ? targets : targets.filter((target) => kindOf(target) === kind);
 	}
+	/** Prose mentions remain in the reference graph and saved source data, but do not
+	* require executable copies or runtime dependencies in the consuming system. */
+	dependencyBody(kind, body) {
+		const mentions = this.entityOf(kind)?.mentionFields;
+		return mentions?.length ? Object.fromEntries(Object.entries(body).filter(([key]) => !mentions.includes(key))) : body;
+	}
 	/** References used after local overrides; sourceClosure also preserves the original bases. */
 	runtimeSourceClosure({ slug, kind }) {
 		let targets = this.caches.runtimeClosures.get(slug);
@@ -4465,7 +4471,7 @@ var Config = class Config {
 					queue.push(`${kindOf(target)}:${pathOf(target)}`);
 				}
 			}
-			for (const item of this.list(owned)) for (const target of collectRefs(item.toJSON())) {
+			for (const item of this.list(owned)) for (const target of collectRefs(includeExtensionBases ? item.toJSON() : this.dependencyBody(owned, item.toJSON()))) {
 				if (sourceOf(target) !== slug) continue;
 				queue.push(`${kindOf(target)}:${pathOf(target)}`);
 			}
@@ -4485,7 +4491,7 @@ var Config = class Config {
 				for (const member of source.members(kindOf(target), pathOf(target))) queue.push(`${kindOf(target)}:${member.path}`);
 				continue;
 			}
-			for (const nested of collectRefs(entity.toJSON())) {
+			for (const nested of collectRefs(includeExtensionBases ? entity.toJSON() : source.dependencyBody(kindOf(target), entity.toJSON()))) {
 				if (sourceOf(nested) !== void 0) continue;
 				queue.push(`${kindOf(nested)}:${pathOf(nested)}`);
 			}
@@ -5072,7 +5078,7 @@ var Config = class Config {
 			}
 		};
 		const visitEntity = (kind, body, theirs = false, linked = false) => {
-			visit(body, theirs, linked);
+			visit((theirs ? source : this).dependencyBody(kind, body), theirs, linked);
 			if (theirs) visitBags(kind, body, linked);
 		};
 		/**
@@ -5867,7 +5873,7 @@ var Config = class Config {
 	*  links from the provided sources. A declared `linkedKind` with no provided source throws. */
 	hydrateFrom(stored, options) {
 		const claimed = schemaVersionOf(stored);
-		if (claimed > 20261020183330) throw new SchemaVersionTooNew(claimed);
+		if (claimed > 20261022124223) throw new SchemaVersionTooNew(claimed);
 		const wire = upgradeSerializedConfig(stored);
 		if (!Array.isArray(wire.ownedKinds) || typeof wire.items !== "object" || wire.items === null) throw new ConfigFormatError(`Config "${stored.name ?? "system-config"}" cannot be hydrated: this is not a serialized config-v2 config (no "ownedKinds"/"items"). A pre-cutover build artifact converts through the registered cutover migration — import the config type's module (e.g. \`configs/system\`) before hydrating.`);
 		const leftover = wire.options;

package/dist/framework/class-names.d.ts

@@ -206,7 +206,7 @@ declare function componentPropComposites(config: Config, path: string, state?: R
  * `element` is the layer's element. A key is a composite when the element declares it as one, so a
  * plain-tag layer (which declares nothing) and a key naming no member are left as they are.
  */
-declare function inlineRuleComposites(config: Config, element: unknown, bag: Record<string, unknown>): Record<string, unknown>;
+declare function inlineRuleComposites(config: Config, element: unknown, authored: Record<string, unknown>): Record<string, unknown>;
 /**
  * The props a style rule's bag sends to each layer's ELEMENT rather than to the stylesheet, for one
  * instance. The same split the emitted module makes when it builds a layer's routed bundle.

package/dist/framework/class-names.js

@@ -6,6 +6,7 @@ import "./component-states.js";
 import { storedPreview } from "./preview-store.js";
 import { authoredValue, className, isCustomPropertyKey, negatedCssValue, renderStyleValue, resolveComponentProps, stylePropEntries, stylePropLeafForToken, stylePropNumberLeaf, stylePropNumberUnit, stylePropValueLeaves, stylePropertyPathFor } from "./projections.js";
 import { inlineMotionId, isInlineMotion, jsMotionBody } from "../entities/system/motion-variants.js";
+import { mergeStyleBags, resolveAppliedComposites } from "../entities/system/applied-composites.js";
 import { ruleApplies } from "./layer-styles.js";
 //#region src/framework/class-names.ts
 /**
@@ -524,7 +525,8 @@ const compositePropsCache = createSliceMemo({
 * `element` is the layer's element. A key is a composite when the element declares it as one, so a
 * plain-tag layer (which declares nothing) and a key naming no member are left as they are.
 */
-function inlineRuleComposites(config, element, bag) {
+function inlineRuleComposites(config, element, authored) {
+	const bag = resolveAppliedComposites(config, authored);
 	if (!isRef(element)) return bag;
 	const declared = resolveComponentProps(config, pathOf(element.__ref));
 	let inlined;
@@ -549,19 +551,6 @@ function inlineRuleComposites(config, element, bag) {
 	}
 	return inlined ? mergeStyleBags(inlined, rest) : bag;
 }
-/** `over` laid on `base`, with a modifier block (`_md`, `_hover`) merged key by key rather than
-*  replaced, so a bag that adds one breakpoint value keeps the composite's others. */
-function mergeStyleBags(base, over) {
-	const out = { ...base };
-	for (const [key, value] of Object.entries(over)) {
-		const prior = out[key];
-		out[key] = key.startsWith("_") && isPlainBlock(prior) && isPlainBlock(value) ? mergeStyleBags(prior, value) : value;
-	}
-	return out;
-}
-function isPlainBlock(value) {
-	return typeof value === "object" && value !== null && !isRef(value);
-}
 /**
 * The props a style rule's bag sends to each layer's ELEMENT rather than to the stylesheet, for one
 * instance. The same split the emitted module makes when it builds a layer's routed bundle.

package/dist/framework/layer-styles.js

@@ -1,6 +1,27 @@
 import { isRef, refLeaf } from "./utils/refs.js";
 import { authoredBag } from "./projections.js";
+import { resolveAppliedComposites } from "../entities/system/applied-composites.js";
 //#region src/framework/layer-styles.ts
+/**
+* What each of a component's layers is STYLED WITH, for one instance.
+*
+* The class projection ({@link componentRuleClasses}) answers the same question in the form a
+* stylesheet needs — which classes go on which element. This answers it in the form a person needs:
+* the property values themselves, per layer, so a properties panel can show that this layer's padding
+* is `3` and a matrix cell can paint a variant it has no compiled classes for yet.
+*
+* Both read the component's `styles` and the same condition test, so they cannot disagree about which
+* rules apply — which is the whole reason this lives here rather than being re-derived per surface.
+*
+* Unconditional rules sit at zero specificity in `:where()`. Every conditional rule emits ONE
+* class selector, whether its condition names one prop or several. Conditional rules therefore
+* tie at that level and retain authored order; counting props would disagree with the stylesheet.
+*
+* A forced state weighs what its stylesheet twin does: each interaction a rule's condition names,
+* and each forced block a value sits under, adds one attribute's worth on top of the rule's own.
+* So `variant=secondary`'s `_active` block beats a later `active=true&variant=secondary` rule, as
+* `.x-variant-secondary:active` beats `.x-active-true-variant-secondary` in the sheet.
+*/
 /** Native component rules' ordering. CSS gives every conditional rule one class selector; only
 * unconditional `:where()` rules rank lower. Stable sorting preserves authored order among
 * conditions with different numbers of props. */
@@ -73,7 +94,7 @@ function layerStyles(config, path, props = {}, options = {}) {
 	Object.values(styles).forEach((rule, index) => {
 		if (!ruleApplies(rule.when, state)) return;
 		for (const [layer, bag] of Object.entries(rule.layers ?? {})) collectBag({
-			bag: authoredBag(config, bag ?? {}),
+			bag: authoredBag(config, resolveAppliedComposites(config, bag ?? {})),
 			forced,
 			specificity: ruleSpecificity(rule.when),
 			push: (key, value, specificity) => declarations.push({

package/dist/framework/projections.js

@@ -770,6 +770,7 @@ function authoredValue(config, key, value) {
 	return authoredLeaf(config, key, value.__ref) ?? value;
 }
 function authoredLeaf(config, key, stored) {
+	if (config.layerKeys().get(key)?.preserveRefs) return void 0;
 	const path = pathOf(stored);
 	if (kindOf(stored) === "token" && config.resolve("style-property", key) !== void 0) return stylePropLeafForToken(config, key, path);
 	if (kindOf(stored) === "motion") return path;

package/dist/framework/registry.d.ts

@@ -52,6 +52,8 @@ type AuthoredValueForm = (ctx: {
  * style property: `motion` names a preset, `reducedMotion` says how the layer treats the OS setting.
  */
 interface LayerKey {
+  /** Keep authored references intact rather than reading them as selectable prop leaves. */
+  readonly preserveRefs?: boolean;
   /** What the key takes. `declared` is the element's own prop of the same name, where it declares
    *  one, which the key's value can also be. */
   readonly schema: (declared: z.ZodTypeAny | undefined) => z.ZodTypeAny;

package/dist/framework/schema-version.d.ts

@@ -15,7 +15,7 @@ import { Patch, SerializedConfig } from "./Config.js";
  * sets this constant to its own older timestamp; the merge ref then carries a registered migration
  * newer than the constant, and the assertion fails until the author re-mints.
  */
-declare const CURRENT_SCHEMA_VERSION = 20261020183330;
+declare const CURRENT_SCHEMA_VERSION = 20261022124223;
 /** What the walkers need to see of an envelope — loose on purpose, so a typed `SerializedConfig`
  *  and a raw old-shape record both flow in without casts. */
 interface VersionStamped {

package/dist/framework/schema-version.js

@@ -13,7 +13,7 @@ import { ConfigFormatError } from "./rejection.js";
 * sets this constant to its own older timestamp; the merge ref then carries a registered migration
 * newer than the constant, and the assertion fails until the author re-mints.
 */
-const CURRENT_SCHEMA_VERSION = 20261020183330;
+const CURRENT_SCHEMA_VERSION = 20261022124223;
 /** The mint that moved `options` into the `settings` kind — restated here, rather than imported
 *  from the migration that owns it, because that migration imports this module. */
 const SETTINGS_AS_KIND_VERSION = 20260908171448;
@@ -45,7 +45,7 @@ function registerSchemaMigrations(...migrations) {
 	for (const migration of migrations) {
 		if (migration.version !== 1 && !isMintTimestamp(migration.version)) throw new Error(`Schema migration version ${migration.version} is not a mint timestamp — mint one with \`date +%Y%m%d%H%M%S\`, like a supabase migration.`);
 		if (REGISTERED.has(migration.version)) throw new Error(`A schema migration at version ${migration.version} is already registered.`);
-		if (migration.version > 20261020183330) throw new Error(`Schema migration ${migration.version} is newer than CURRENT_SCHEMA_VERSION (${CURRENT_SCHEMA_VERSION}) — a stale branch merged, or the mint forgot to bump the constant. Re-mint: set CURRENT_SCHEMA_VERSION to the newest migration version.`);
+		if (migration.version > 20261022124223) throw new Error(`Schema migration ${migration.version} is newer than CURRENT_SCHEMA_VERSION (${CURRENT_SCHEMA_VERSION}) — a stale branch merged, or the mint forgot to bump the constant. Re-mint: set CURRENT_SCHEMA_VERSION to the newest migration version.`);
 		REGISTERED.set(migration.version, migration);
 	}
 }
@@ -102,7 +102,7 @@ function pendingFor(version, target, options) {
 * Already-current input passes through untouched — same reference, so hot paths pay nothing.
 */
 function upgradeSerializedConfig(json, options) {
-	const target = options?.target ?? 20261020183330;
+	const target = options?.target ?? 20261022124223;
 	const version = detectedWireVersion(json);
 	if (version > target) throw new SchemaVersionTooNew(version, target);
 	const raw = json;
@@ -160,7 +160,7 @@ function upgradedSources(json, options) {
 * meaning under the current schema and replay skips it — reported by the caller, not swallowed here.
 */
 function upgradePatch(patch, writtenAt, options) {
-	const target = options?.target ?? 20261020183330;
+	const target = options?.target ?? 20261022124223;
 	if (writtenAt > target) throw new SchemaVersionTooNew(writtenAt, target);
 	let current = patch;
 	for (const migration of pendingFor(writtenAt, target, options)) {
@@ -179,7 +179,7 @@ function upgradePatch(patch, writtenAt, options) {
 * stamp would cause.
 */
 function upgradeDraftEntries(draft, options) {
-	const target = options?.target ?? 20261020183330;
+	const target = options?.target ?? 20261022124223;
 	const entries = [];
 	const held = [];
 	const retired = [];