@yahoo/uds-create-config 4.36.1 → 4.37.1

package/dist/configs/system.js

@@ -42,6 +42,8 @@ import { renderTokenRefsMigration } from "../migrations/20260923160425_render_to
 import { globalStyleDerivedColorsMigration } from "../migrations/20260923163604_global_style_derived_colors.js";
 import { slotCodeFormsMigration } from "../migrations/20260924044539_slot_code_forms.js";
 import { canvasRoleSlotMigration } from "../migrations/20260925143319_canvas_role_slot.js";
+import { linkOnLinkedMigration } from "../migrations/20260928180801_link_on_linked.js";
+import { compositePropLayerMigration } from "../migrations/20260928215509_composite_prop_layer.js";
 const System = defineConfig({
 	name: WEB_CONFIG_NAME,
 	description: "A design system: the values, primitives and compositions an app is built from. A ref is written `{ \"__ref\": \"<kind>:<path>\" }`, so a token is `{ \"__ref\": \"token:<group>/<name>\" }` and a token group is `{ \"__ref\": \"token:<group>\" }`. Build it in this order. Tokens first, in groups by purpose (colors, spacing, radii, type sizes), since everything else names them. Then style properties, each with `values` holding one ref to the token group whose members it accepts (`{ \"__ref\": \"token:color\" }`), so a prop takes token names rather than raw CSS; add a string keyword only for a value no token holds. A style rule's bag holds a prop's values (`\"padding\": \"4\"`, `\"bg\": \"brand\"`), never raw CSS. Then a few primitive components, one layer each, whose props are style properties (a box for layout and surface, a text for type, a pressable for interaction). Then every other component composed from those primitives: its layers name a primitive or an element, its anatomy places them (a node renders a layer, a tag or `Slot` where a slot prop's content lands; `children` is the edge list; `visible` is `{ \"$state\": \"<prop>\" }`; a prop shown in a nested layer is a `forward` route, and `$state` never sits in a node's props), and its style rules set style-property values per layer, keyed by prop values when a variant changes them. Modes (a dark mode is `{ type: \"selector\", value: \".dark\" }`) change token values through a token's `overrides`, so a component never restyles for a mode; modifiers (hover, focus, disabled) name a state, and a style rule applies under one as a `_hover` block inside a layer bag. Composites bundle style values that recur. Last, register canvas roles: the canvas draws with them, one entity per tool (`frame` for the layout primitive, `text` for the text primitive, `image`) whose entries name the components that tool inserts, and a tool whose role is unregistered is disabled. Give each component a `preview` entry under `*` so it shows content, and never write a CSS property name where a style-property name belongs.",
@@ -95,5 +97,7 @@ if (!registeredSchemaMigrations().has(20260923160425)) registerSchemaMigrations(
 if (!registeredSchemaMigrations().has(20260923163604)) registerSchemaMigrations(globalStyleDerivedColorsMigration);
 if (!registeredSchemaMigrations().has(20260924044539)) registerSchemaMigrations(slotCodeFormsMigration);
 if (!registeredSchemaMigrations().has(20260925143319)) registerSchemaMigrations(canvasRoleSlotMigration);
+if (!registeredSchemaMigrations().has(20260928180801)) registerSchemaMigrations(linkOnLinkedMigration);
+if (!registeredSchemaMigrations().has(20260928215509)) registerSchemaMigrations(compositePropLayerMigration);
 //#endregion
 export { System };

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

@@ -176,17 +176,46 @@ declare const propShapeDefinition: z.ZodDiscriminatedUnion<[z.ZodObject<{
   }, z.core.$strip>]>, z.ZodArray<z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodBoolean, z.ZodObject<{
     __ref: z.ZodString;
   }, z.core.$strip>]>>]>>>;
-}, z.core.$strict>, z.ZodObject<{
+}, z.core.$strict>, z.ZodPipe<z.ZodObject<{
   type: z.ZodLiteral<"composite">;
   value: z.ZodObject<{
     __ref: z.ZodString;
   }, z.core.$strip>;
+  layer: z.ZodOptional<z.ZodUnion<readonly [z.ZodString, z.ZodObject<{
+    __ref: z.ZodString;
+  }, z.core.$strip>]>>;
   when: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodBoolean, z.ZodObject<{
     __ref: z.ZodString;
   }, z.core.$strip>]>, z.ZodArray<z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodBoolean, z.ZodObject<{
     __ref: z.ZodString;
   }, z.core.$strip>]>>]>>>;
-}, z.core.$strict>, z.ZodObject<{
+}, z.core.$strict>, z.ZodTransform<{
+  type: "composite";
+  value: {
+    __ref: string;
+  };
+  layer?: string | {
+    __ref: string;
+  } | undefined;
+  when?: Record<string, string | number | boolean | {
+    __ref: string;
+  } | (string | number | boolean | {
+    __ref: string;
+  })[]> | undefined;
+}, {
+  type: "composite";
+  value: {
+    __ref: string;
+  };
+  layer?: string | {
+    __ref: string;
+  } | undefined;
+  when?: Record<string, string | number | boolean | {
+    __ref: string;
+  } | (string | number | boolean | {
+    __ref: string;
+  })[]> | undefined;
+}>>, z.ZodObject<{
   type: z.ZodLiteral<"motion">;
   value: z.ZodDefault<z.ZodObject<{
     __ref: z.ZodString;

package/dist/entities/system/Component.js

@@ -360,6 +360,14 @@ function routedTarget(decl) {
 		into: decl.target.slice(separator + 1)
 	};
 }
+/** A composite prop's authored `layer` name as the layer ref it is stored as — see {@link routedTarget}
+*  for why the coercion lives in the schema. */
+function layerAsRef(decl) {
+	return typeof decl.layer === "string" ? {
+		...decl,
+		layer: layerRef(decl.layer)
+	} : decl;
+}
 /** A prop that applies only under a condition on its siblings — the record a style rule's `when`
 *  holds. Open here, where no owner is known; `propSchemaFor` narrows it to the owner's props. */
 const conditionLeaf = z.union([
@@ -415,8 +423,9 @@ function propShapeWith(when) {
 		z.strictObject({
 			type: z.literal("composite"),
 			value: refSchema,
+			layer: z.union([z.string().min(1), refSchema]).optional(),
 			when
-		}),
+		}).transform(layerAsRef),
 		z.strictObject({
 			type: z.literal("motion"),
 			value: refSchema.default({ __ref: "motion:" }),

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

@@ -107,12 +107,20 @@ declare const LinkedSystemDefinition: EntityClass<z.ZodObject<{
     readonly input: z.ZodObject<{
       path: z.ZodType<string, string | undefined, z.core.$ZodTypeInternals<string, string | undefined>>;
       data: z.ZodUnion<readonly [z.ZodLiteral<"*">, z.ZodRecord<z.ZodString, z.ZodUnion<readonly [z.ZodLiteral<"*">, z.ZodArray<z.ZodString>]>>]>;
+      onLinked: z.ZodOptional<z.ZodEnum<{
+        keep: "keep";
+        take: "take";
+      }>>;
     }, z.core.$strip>;
   };
   readonly 'link-plan': {
     readonly input: z.ZodObject<{
       path: z.ZodType<string, string | undefined, z.core.$ZodTypeInternals<string, string | undefined>>;
       data: z.ZodUnion<readonly [z.ZodLiteral<"*">, z.ZodRecord<z.ZodString, z.ZodUnion<readonly [z.ZodLiteral<"*">, z.ZodArray<z.ZodString>]>>]>;
+      onLinked: z.ZodOptional<z.ZodEnum<{
+        keep: "keep";
+        take: "take";
+      }>>;
     }, z.core.$strip>;
   };
   readonly unlink: {

package/dist/entities/system/LinkedSystem.js

@@ -146,7 +146,10 @@ const linkInput = z.object({
 	path: pathInput("linked-system"),
 	/** What to draw, keyed by accessor the way the pin's `link` is, or `'*'` for everything the source
 	*  offers. A path that names a folder in the source covers its members. */
-	data: z.union([z.literal("*"), z.record(z.string(), copyPaths)])
+	data: z.union([z.literal("*"), z.record(z.string(), copyPaths)]),
+	/** What to do at a path another linked system provides: `'take'` makes it follow this source,
+	*  `'keep'` leaves it where it comes from. Required when there is one; `link-plan` lists them. */
+	onLinked: z.enum(["keep", "take"]).optional()
 });
 const unlinkInput = z.object({
 	path: pathInput("linked-system"),
@@ -173,6 +176,14 @@ function copyInputOf(input) {
 		...input.onConflict === void 0 ? {} : { onConflict: input.onConflict }
 	};
 }
+/** The parsed `link` input as the plan takes it. */
+function linkPlanInputOf(input) {
+	return {
+		path: String(input.path),
+		data: input.data,
+		...input.onLinked === void 0 ? {} : { onLinked: input.onLinked }
+	};
+}
 /** A `link` or `unlink` example: one entity the source offers, under the accessor this config files it by. */
 function linkExample({ config, path }) {
 	const target = exampleBorrowable(config, path);
@@ -243,7 +254,8 @@ const LinkedSystem = defineEntity({
 		* Draw entities from a linked system: the pin's `link` declaration grows to cover them and the
 		* build mints a pointer row per entity, in this one op. A row of this config's own at a covered
 		* path is deleted so theirs shows through; a row held through another pin becomes an extension
-		* through this one. `link-plan` says what that replaces before anything is written.
+		* through this one when `onLinked` is `'take'`. `link-plan` says what that replaces before anything
+		* is written.
 		*/
 		link: {
 			input: linkInput,
@@ -255,13 +267,14 @@ const LinkedSystem = defineEntity({
 			title: (entity) => `Link something from ${entity}`,
 			example: linkExample,
 			handler: (input, config) => {
-				const { patches } = planLink({
+				const { linked, patches } = planLink({
 					config,
-					input: {
-						path: String(input.path),
-						data: input.data
-					}
+					input: linkPlanInputOf(input)
 				});
+				if (linked.length > 0 && input.onLinked === void 0) {
+					const named = linked.map((at) => `${at.path} (from ${at.from})`);
+					rejectData(`Linking through "${String(input.path)}" reaches what another linked system provides: ${named.join(", ")}. Say whether to take them (\`onLinked: 'take'\`) or keep them where they come from (\`onLinked: 'keep'\`).`, ["onLinked"]);
+				}
 				if (patches.length === 0) return config;
 				return config.applyAll(patches).withDerivedRows();
 			}
@@ -270,17 +283,14 @@ const LinkedSystem = defineEntity({
 			input: linkInput,
 			readOnly: true,
 			label: "Plan a link",
-			description: "What `link` with the same input replaces — rows of yours deleted so the source shows through, rows held through another pin turned into extensions, and members left alone because they are already here from the same origin. Writes nothing.",
+			description: "What `link` with the same input replaces — rows of yours deleted so the source shows through, every path another linked system provides (`linked`, turned into extensions when `onLinked` says take), and members left alone because they are already here from the same origin. Writes nothing.",
 			scope: "item",
 			title: (entity) => `Plan a link from ${entity}`,
 			example: linkExample,
 			handler: (input, config) => {
 				const { patches: _patches, ...plan } = planLink({
 					config,
-					input: {
-						path: String(input.path),
-						data: input.data
-					}
+					input: linkPlanInputOf(input)
 				});
 				return plan;
 			}

package/dist/entities/system/copy-plan.js

@@ -413,8 +413,7 @@ function planCopy({ config, input }) {
 		const removal = /* @__PURE__ */ new Map();
 		for (const { kind, at, named } of taking) {
 			if (!named) continue;
-			const stored = config.storedBody(kind, at);
-			if (!stored || !isMintedRow(stored)) continue;
+			if (config.storedBody(kind, at) === void 0) continue;
 			if (config.resolve(kind, at)?.borrowedFrom !== slug) continue;
 			const accessor = config.accessorOf(kind) ?? kind;
 			if (!covers({

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

@@ -189,6 +189,9 @@ type PropDecl<Path extends string = string> = SlotDecl | ForwardDecl<Path> | {
 } | {
   type: 'composite';
   value: Ref$1;
+  /** The layer the chosen member styles; the root by default. Authored as its name, stored as a
+   *  layer ref. */
+  layer?: string | Ref$1;
   required?: boolean;
   when?: PropCondition;
 } | {

package/dist/entities/system/link-plan.d.ts

@@ -6,10 +6,21 @@ import { Config, Patch, TreeNode } from "../../framework/Config.js";
 /** What one op names, keyed by accessor the way the pin's `link` is: every entry of the kind, or the
  *  source's paths, where a folder names its members. `'*'` alone is every kind the source offers. */
 type LinkPaths = '*' | Readonly<Record<string, '*' | readonly string[]>>;
+/** What a link does at a path held through another linked system: `'take'` makes the row follow this
+ *  source, `'keep'` leaves it with the system it comes from. */
+type OnLinked = 'keep' | 'take';
 interface LinkPlanInput {
   /** The pin's slug. */
   readonly path: string;
   readonly data: LinkPaths;
+  /** Planned as `'take'` when omitted; the `link` op refuses without it while `linked` is not empty. */
+  readonly onLinked?: OnLinked;
+}
+/** A path the link reaches that another linked system provides, or declares under a row of this
+ *  config's own. */
+interface LinkedElsewhere extends EntityAddress {
+  /** The slug of the pin it comes through. */
+  readonly from: string;
 }
 /** One row a link mints. `named` when a path the call named covers it; otherwise it comes along
  *  because something linked points at it. */
@@ -25,6 +36,8 @@ interface LinkPlan {
   readonly replaces: number;
   /** Rows of this config's own deleted so the source's row shows through at the path. */
   readonly addresses: readonly EntityAddress[];
+  /** Every path the link reaches that another linked system provides, whatever `onLinked` says. */
+  readonly linked: readonly LinkedElsewhere[];
   /** Rows held through another pin, turned into extensions through this one. */
   readonly extended: readonly EntityAddress[];
   /** Members already here from the source's own origin, left alone and kept out of the declaration. */
@@ -85,6 +98,11 @@ interface SourceRowState {
   readonly linked: boolean;
   /** Rows of this config's own a `link` would write over. */
   readonly replaces: number;
+  /** Members another linked system provides or also declares, which a `link` asks about through
+   *  `onLinked`. */
+  readonly linkedElsewhere: number;
+  /** The slugs of the pins those come through. */
+  readonly linkedFrom: readonly string[];
   /** Members already here from the source's own origin, through another pin. */
   readonly shared: number;
   /** That origin's name, when `shared` is above zero. */
@@ -97,10 +115,11 @@ interface SourceRowState {
  * The declaration goes first. A row of this config's own that other rows point at can only be deleted
  * once the declaration covers the path, since the config refuses a delete that leaves a referrer
  * dangling. A row held through another pin is not deleted — that pin's declaration would mint it
- * again, and declaring one path on two pins is a collision nothing derives — so it becomes an
- * extension through this pin: a row of this config's own that shadows the other pin's and follows this
- * source. A member already here from the source's own origin is left alone and kept out of the
- * declaration, so a folder that holds one is declared by its other members.
+ * again, and declaring one path on two pins is a collision nothing derives. With `onLinked: 'take'` it
+ * becomes an extension through this pin: a row of this config's own that shadows the other pin's and
+ * follows this source. With `'keep'` it stays with the other pin and out of the declaration. A member
+ * already here from the source's own origin is left alone and kept out of the declaration, so a
+ * folder that holds one is declared by its other members.
  */
 declare function planLink({
   config,
@@ -159,4 +178,4 @@ declare function sourceRowStates({
   readonly slug: string;
 }): SourceRowState[];
 //#endregion
-export { BreakOutcome, BreakPlan, BreakPlanInput, BreakPlanRow, BreakReach, LinkArrival, LinkPaths, LinkPlan, LinkPlanInput, SourceRowState, UnlinkPlan, UnlinkPlanInput, planBreak, planLink, planUnlink, sourceRowStates };
+export { BreakOutcome, BreakPlan, BreakPlanInput, BreakPlanRow, BreakReach, LinkArrival, LinkPaths, LinkPlan, LinkPlanInput, LinkedElsewhere, OnLinked, SourceRowState, UnlinkPlan, UnlinkPlanInput, planBreak, planLink, planUnlink, sourceRowStates };

package/dist/entities/system/link-plan.js

@@ -42,6 +42,20 @@ function sharedWithOrigin({ config, source, slug, kind, path }) {
 	if (!theirs || !mine || theirs.key !== mine.key) return void 0;
 	return theirs.pin.displayName ?? theirs.key;
 }
+/** Another pin whose declaration covers the path and whose source has it: the pin the path would
+*  derive from if this config held nothing there. */
+function declaredElsewhere({ config, slug, kind, path }) {
+	const accessor = config.accessorOf(kind) ?? kind;
+	for (const pin of config.list(PIN_KIND)) {
+		if (pin.path === slug) continue;
+		if (!covers({
+			declared: declarationOf(config, pin.path),
+			accessor,
+			path
+		})) continue;
+		if (config.sourceFor(pin.path)?.resolve(kind, path)) return pin.path;
+	}
+}
 /**
 * Link paths of a source: the declaration that mints them, then the edits that let them show through
 * where this config already holds something.
@@ -49,10 +63,11 @@ function sharedWithOrigin({ config, source, slug, kind, path }) {
 * The declaration goes first. A row of this config's own that other rows point at can only be deleted
 * once the declaration covers the path, since the config refuses a delete that leaves a referrer
 * dangling. A row held through another pin is not deleted — that pin's declaration would mint it
-* again, and declaring one path on two pins is a collision nothing derives — so it becomes an
-* extension through this pin: a row of this config's own that shadows the other pin's and follows this
-* source. A member already here from the source's own origin is left alone and kept out of the
-* declaration, so a folder that holds one is declared by its other members.
+* again, and declaring one path on two pins is a collision nothing derives. With `onLinked: 'take'` it
+* becomes an extension through this pin: a row of this config's own that shadows the other pin's and
+* follows this source. With `'keep'` it stays with the other pin and out of the declaration. A member
+* already here from the source's own origin is left alone and kept out of the declaration, so a
+* folder that holds one is declared by its other members.
 */
 function planLink({ config, input }) {
 	const { path: slug } = input;
@@ -66,12 +81,13 @@ function planLink({ config, input }) {
 		verb: "link"
 	});
 	const addresses = [];
+	const linked = [];
 	const extended = [];
 	const shared = [];
 	const shadows = [];
 	/** Per accessor, what the declaration gains: the kind whole, or paths. */
 	const gains = /* @__PURE__ */ new Map();
-	let sharedAnywhere = false;
+	let leftAnywhere = false;
 	const shadow = (kind, path) => {
 		const held = config.resolve(kind, path);
 		if (!held || held.borrowedFrom === slug) return true;
@@ -86,10 +102,16 @@ function planLink({ config, input }) {
 				kind,
 				path
 			});
-			sharedAnywhere = true;
+			leftAnywhere = true;
 			return false;
 		}
-		if (held.borrowedFrom === void 0) {
+		const from = held.borrowedFrom ?? declaredElsewhere({
+			config,
+			slug,
+			kind,
+			path
+		});
+		if (from === void 0) {
 			addresses.push({
 				kind,
 				path
@@ -101,6 +123,20 @@ function planLink({ config, input }) {
 			});
 			return true;
 		}
+		linked.push({
+			kind,
+			path,
+			from
+		});
+		if (input.onLinked === "keep") {
+			if (held.borrowedFrom === void 0) shadows.push({
+				kind,
+				operation: "delete",
+				path
+			});
+			leftAnywhere = true;
+			return false;
+		}
 		const stored = config.storedBody(kind, path);
 		const minted = stored !== void 0 && isMintedRow(stored);
 		extended.push({
@@ -145,7 +181,7 @@ function planLink({ config, input }) {
 	}
 	const declares = [];
 	let declared = current;
-	if (current !== "*") if (input.data === "*" && !sharedAnywhere) {
+	if (current !== "*") if (input.data === "*" && !leftAnywhere) {
 		declared = "*";
 		declares.push({
 			kind: PIN_KIND,
@@ -192,6 +228,7 @@ function planLink({ config, input }) {
 		}),
 		replaces: addresses.length,
 		addresses,
+		linked,
 		extended,
 		shared,
 		patches
@@ -485,7 +522,7 @@ function planBreak({ config, input }) {
 	const pointing = /* @__PURE__ */ new Map();
 	/** Folders drawn through the pin by a pointer of this config's own, released once their members are copied. */
 	const pointedFolders = [];
-	const reach = ({ kind, path, reach }) => {
+	const reach = ({ kind, path, reach: how }) => {
 		const held = config.resolve(kind, path);
 		if (held?.borrowedFrom === slug) {
 			copying.path(kind, path);
@@ -495,7 +532,7 @@ function planBreak({ config, input }) {
 				folder: false,
 				refs: [ref(kind, path, slug).__ref],
 				outcome: "copied",
-				reach
+				reach: how
 			});
 			return;
 		}
@@ -516,9 +553,15 @@ function planBreak({ config, input }) {
 					folder: true,
 					refs: [ref(kind, path, slug).__ref],
 					outcome: "copied",
-					reach
+					reach: how
 				});
+				return;
 			}
+			for (const member of config.members(kind, path)) if (member.borrowedFrom === slug) reach({
+				kind,
+				path: member.path,
+				reach: "taken"
+			});
 			return;
 		}
 		const refs = drawnThroughPin({
@@ -534,7 +577,7 @@ function planBreak({ config, input }) {
 		}
 		pointing.set(`${kind}:${path}`, {
 			refs,
-			reach
+			reach: how
 		});
 	};
 	if (scoped) for (const { kind, accessor, paths } of wantedKinds({
@@ -730,6 +773,8 @@ function sourceRowStates({ config, slug }) {
 		if (members.length === 0) continue;
 		let linked = 0;
 		let local = 0;
+		let elsewhere = 0;
+		const linkedFrom = /* @__PURE__ */ new Set();
 		let shared = 0;
 		let sharedOrigin;
 		for (const leaf of members) {
@@ -739,7 +784,6 @@ function sourceRowStates({ config, slug }) {
 				linked += 1;
 				continue;
 			}
-			local += 1;
 			const origin = sharedWithOrigin({
 				config: derived,
 				source,
@@ -747,10 +791,19 @@ function sourceRowStates({ config, slug }) {
 				kind,
 				path: leaf.path
 			});
+			const from = origin === void 0 ? held.borrowedFrom ?? declaredElsewhere({
+				config: derived,
+				slug,
+				kind,
+				path: leaf.path
+			}) : void 0;
 			if (origin !== void 0) {
 				shared += 1;
 				sharedOrigin ??= origin;
-			}
+			} else if (from !== void 0) {
+				elsewhere += 1;
+				linkedFrom.add(from);
+			} else local += 1;
 		}
 		rows.push({
 			kind,
@@ -760,7 +813,9 @@ function sourceRowStates({ config, slug }) {
 			members: members.length,
 			held: linked,
 			linked: linked === members.length,
-			replaces: local - shared,
+			replaces: local,
+			linkedElsewhere: elsewhere,
+			linkedFrom: [...linkedFrom],
 			shared,
 			...sharedOrigin === void 0 ? {} : { sharedOrigin }
 		});

package/dist/framework/Config.d.ts

@@ -72,7 +72,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 = 20260925143319;
+declare const SERIALIZED_CONFIG_VERSION = 20260928215509;
 interface SerializedConfig {
   /** See {@link SERIALIZED_CONFIG_VERSION}. Always written; a stored artifact may lack it. */
   readonly version: number;

package/dist/framework/Config.js

@@ -5135,7 +5135,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 > 20260925143319) throw new SchemaVersionTooNew(claimed);
+		if (claimed > 20260928215509) 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, or port the repo once with \`uds migrate\`.`);
 		const leftover = wire.options;

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

@@ -84,6 +84,9 @@ interface ComponentRuleClass {
    *  emitted module tests it with `=== true`. */
   readonly when: Record<string, unknown>;
   readonly className: string;
+  /** Set when the class comes from a composite PROP rather than a style rule: the member whose bag
+   *  the class paints. See {@link compositePropRuleClasses}. */
+  readonly composite?: string;
 }
 /**
  * Every conditional class a component's style rules produce.
@@ -137,23 +140,59 @@ declare function componentMotionClasses(config: Config, path: string): Component
  * defaults, because a value the caller didn't set has to read the default — the same rule
  * {@link layerStyles} follows.
  *
- * Keyed by layer even though today it only ever names the ROOT one, so a caller needs no opinion
- * about which layer that is: an instance's own props land where its own props land.
+ * Keyed by layer: a prop lands on the layer it names (the root by default), or on the layer that
+ * forwards it. Each member contributes two classes, the composite's own and the component's rule
+ * class for it; {@link componentRuleClasses} lists the second too, for the module and the sheet, so
+ * a projection reading both skips its `composite` entries.
  */
 declare function componentPropClasses(config: Config, path: string, state?: Record<string, unknown>): Record<string, string[]>;
+/** One composite an instance's props pick, and where it lands. */
+interface PickedComposite {
+  readonly prop: string;
+  readonly layer: string;
+  /** The member's path (`textVariant/title1/emphasized`). */
+  readonly member: string;
+  /** The value as a caller writes it, the member's path under its group (`title1/emphasized`). */
+  readonly value: string;
+}
+/**
+ * The composites an instance's props pick, resolved over the component's defaults: each one beats
+ * the component's own rules on its layer (see {@link compositePropRuleClasses}).
+ *
+ * A projection that paints a component's rule declarations as props, as the component editor's cells
+ * do, needs this to hold that precedence: a rule's `fontSize` painted as a prop would otherwise beat
+ * the member a caller picked, where the stylesheet has the member win.
+ */
+declare function componentPropComposites(config: Config, path: string, state?: Record<string, unknown>): PickedComposite[];
+/**
+ * A style rule's bag with each composite it names written out in place: the member's styles first,
+ * the bag's own keys over them, and the composite's marker (`--<prefix>-composite-<group>`), so
+ * `_on<Group><Member>` still finds it.
+ *
+ * A composite a component's OWN rule names is part of that layer's defaults, the same as a
+ * `fontSize` beside it: the layer's element beats it with its variants, and a key the bag spells
+ * next to it overrides it (`{ textVariant: 'ui6', lineHeight: 'tight' }`). Forwarded to the element
+ * as a prop instead, it arrived as a caller's pick, and a caller's pick beats the element's
+ * variants (see {@link compositePropRuleClasses}), so FormInput's own `ui6` beat the `size="xs"`
+ * it renders its Input at. Only a composite passed as a prop at a call site takes that route.
+ *
+ * `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>;
 /**
  * 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.
  *
  * What makes a bag key CSS is that a style property claims it: that value lives in the stylesheet
  * under the rule's condition class. Everything else in the bag is a prop of the layer's element and
- * travels to it as one, whether or not the element declares it: a composite (`variant` on a
- * `Text`-backed layer, which the receiver resolves to its own class), the receiver's own variant or
+ * travels to it as one, whether or not the element declares it: the receiver's own variant or
  * scalar prop (`size: 'sm'` on an Icon layer), or an attribute of a plain element (`as: 'div'`,
  * `type: 'button'`, `aria-hidden`), or a value the rule hands a receiver's forward or slot
  * (`children: 'AI'` on a badge layer, `icon: 'XIcon'` on a button layer), which the emitted module
- * routes the same way. A style property under another name and motion stay out, since the
- * stylesheet and the motion classes already carry them.
+ * routes the same way. A style property under another name, a composite (written into the rule's
+ * declarations, {@link inlineRuleComposites}) and motion stay out, since the stylesheet and the
+ * motion classes already carry them.
  *
  * Forwarding rather than resolving is what makes a layer's styling live-editable at all: a class only
  * exists once a build has emitted the stylesheet, so an edit that makes a NEW style rule paints
@@ -258,4 +297,4 @@ declare function stylePropClasses(config: Config, path: string): Map<string, str
  */
 declare function modifierUtilitiesUsed(config: Config): Set<string>;
 //#endregion
-export { ComponentRuleClass, SplitStyleProps, componentClassBase, componentCompositeClasses, componentLayerClass, componentMotionClasses, componentPropClasses, componentRuleClasses, forceModeAttribute, forceModeAttributeOf, forceModeProp, forceModePropGroup, forceModePropValue, forceModeProps, forceStateAttribute, isForceModeProp, kebabComponent, layerRoutedProps, modifierUtilitiesUsed, motionClassName, ruleCondition, splitStyleProps, stylePropClassBase, stylePropClassName, stylePropClasses, styleRuleMotionClasses };
+export { ComponentRuleClass, PickedComposite, SplitStyleProps, componentClassBase, componentCompositeClasses, componentLayerClass, componentMotionClasses, componentPropClasses, componentPropComposites, componentRuleClasses, forceModeAttribute, forceModeAttributeOf, forceModeProp, forceModePropGroup, forceModePropValue, forceModeProps, forceStateAttribute, inlineRuleComposites, isForceModeProp, kebabComponent, layerRoutedProps, modifierUtilitiesUsed, motionClassName, ruleCondition, splitStyleProps, stylePropClassBase, stylePropClassName, stylePropClasses, styleRuleMotionClasses };