@yahoo/uds-create-config 1.29.1 → 2.0.0

package/dist/Component.d.ts

@@ -117,6 +117,8 @@ type PropInfo = (PropBase & {
   kind: 'string';
 }) | (PropBase & {
   kind: 'number';
+}) | (PropBase & {
+  kind: 'motion';
 }) | (PropBase & {
   kind: 'styleProp';
 } & StylePropInfo) | (PropBase & {

package/dist/Component.js

@@ -5,7 +5,7 @@ import { isAssetGroupRef, isCompositeRef, isStylePropRef, isTokenRef, tag } from
 import { isColorExpression } from "./colorExpressions.js";
 import { readAssetGroupSlug } from "./defineAssetGroup.js";
 import { serializeElementsDeep } from "./element-marker.js";
-import { isBoolMarker, isNumberMarker, isSlotMarker, isStringMarker, isVariantArrayMarker, isVariantMarker } from "./markers.js";
+import { isBoolMarker, isMotionMarker, isNumberMarker, isSlotMarker, isStringMarker, isVariantArrayMarker, isVariantMarker } from "./markers.js";
 import { componentClassNames } from "@yahoo/uds-create-utils";
 //#region src/Component.ts
 /**
@@ -464,6 +464,11 @@ function inferPropInfo(name, binding, layers, resolve) {
 		name,
 		required: binding.__required === true
 	};
+	if (isMotionMarker(binding)) return {
+		kind: "motion",
+		name,
+		required: binding.__required === true
+	};
 	if (isStylePropRef(binding)) return {
 		kind: "styleProp",
 		name,

package/dist/MotionDef.d.ts

@@ -1,4 +1,4 @@
-import { CssMotionDefinition, JsMotionDefinition, MotionKeyframes, MotionStateKeyframe, MotionTransition } from "./types.js";
+import { CssMotionDefinition, JsMotionDefinition, MotionKeyframes, MotionTransition } from "./types.js";
 import { CssClassName } from "./brands.js";
 
 //#region src/MotionDef.d.ts
@@ -8,13 +8,13 @@ declare class CssMotionDef {
   readonly name: string;
   readonly keyframes: MotionKeyframes;
   readonly transition?: MotionTransition;
-  readonly animationDuration?: string | number;
-  readonly animationTimingFunction?: string;
-  readonly animationDelay?: string | number;
-  readonly animationIterationCount?: string | number;
-  readonly animationDirection?: string;
-  readonly animationFillMode?: string;
-  readonly animationPlayState?: string;
+  readonly duration?: CssMotionDefinition['duration'];
+  readonly timingFunction?: CssMotionDefinition['timingFunction'];
+  readonly delay?: CssMotionDefinition['delay'];
+  readonly iterationCount?: CssMotionDefinition['iterationCount'];
+  readonly direction?: CssMotionDefinition['direction'];
+  readonly fillMode?: CssMotionDefinition['fillMode'];
+  readonly playState?: CssMotionDefinition['playState'];
   readonly reducedMotion?: 'none';
   constructor(args: {
     name: string;
@@ -30,12 +30,28 @@ declare class CssMotionDef {
 declare class JsMotionDef {
   readonly runtime: "js";
   readonly name: string;
-  readonly initial?: MotionStateKeyframe;
-  readonly animate?: MotionStateKeyframe;
-  readonly exit?: MotionStateKeyframe;
+  readonly variants?: JsMotionDefinition['variants'];
+  readonly initial?: JsMotionDefinition['initial'];
+  readonly animate?: JsMotionDefinition['animate'];
+  readonly exit?: JsMotionDefinition['exit'];
   readonly transition?: MotionTransition;
-  readonly whileHover?: MotionStateKeyframe;
-  readonly whileTap?: MotionStateKeyframe;
+  readonly whileHover?: JsMotionDefinition['whileHover'];
+  readonly whileTap?: JsMotionDefinition['whileTap'];
+  readonly whileFocus?: JsMotionDefinition['whileFocus'];
+  readonly whileDrag?: JsMotionDefinition['whileDrag'];
+  readonly whileInView?: JsMotionDefinition['whileInView'];
+  readonly viewport?: JsMotionDefinition['viewport'];
+  readonly drag?: JsMotionDefinition['drag'];
+  readonly dragConstraints?: JsMotionDefinition['dragConstraints'];
+  readonly dragElastic?: JsMotionDefinition['dragElastic'];
+  readonly dragMomentum?: JsMotionDefinition['dragMomentum'];
+  readonly dragSnapToOrigin?: JsMotionDefinition['dragSnapToOrigin'];
+  readonly dragPropagation?: JsMotionDefinition['dragPropagation'];
+  readonly dragDirectionLock?: JsMotionDefinition['dragDirectionLock'];
+  readonly dragTransition?: JsMotionDefinition['dragTransition'];
+  readonly layout?: JsMotionDefinition['layout'];
+  readonly layoutId?: JsMotionDefinition['layoutId'];
+  readonly layoutDependency?: JsMotionDefinition['layoutDependency'];
   constructor(args: {
     name: string;
     definition: JsMotionDefinition;
@@ -45,5 +61,16 @@ declare class JsMotionDef {
   };
 }
 type MotionDef = CssMotionDef | JsMotionDef;
+/** Fields a `runtime: 'js'` motion preset may carry (`JsMotionDefinition`). */
+declare const JS_MOTION_DEFINITION_KEYS: (keyof JsMotionDefinition)[];
+/**
+ * JS motion field names minus the `runtime` discriminant — the props codegen
+ * spreads onto the `motion.create` wrapper. `runtime` is excluded because it's
+ * config metadata, not a framer `motion` prop (spreading it would leak a
+ * `runtime` attribute onto the DOM element).
+ */
+declare const JS_MOTION_FIELD_KEYS: ("initial" | "transition" | "animate" | "variants" | "exit" | "whileHover" | "whileTap" | "whileFocus" | "whileDrag" | "whileInView" | "viewport" | "drag" | "dragConstraints" | "dragElastic" | "dragMomentum" | "dragSnapToOrigin" | "dragPropagation" | "dragDirectionLock" | "dragTransition" | "layout" | "layoutId" | "layoutDependency")[];
+/** Fields a `runtime: 'css'` motion preset may carry (`CssMotionDefinition`). */
+declare const CSS_MOTION_DEFINITION_KEYS: (keyof CssMotionDefinition)[];
 //#endregion
-export { CssMotionDef, JsMotionDef, MotionDef };
+export { CSS_MOTION_DEFINITION_KEYS, CssMotionDef, JS_MOTION_DEFINITION_KEYS, JS_MOTION_FIELD_KEYS, JsMotionDef, MotionDef };

package/dist/MotionDef.js

@@ -14,13 +14,13 @@ var CssMotionDef = class {
 	name;
 	keyframes;
 	transition;
-	animationDuration;
-	animationTimingFunction;
-	animationDelay;
-	animationIterationCount;
-	animationDirection;
-	animationFillMode;
-	animationPlayState;
+	duration;
+	timingFunction;
+	delay;
+	iterationCount;
+	direction;
+	fillMode;
+	playState;
 	reducedMotion;
 	#derived;
 	constructor(args) {
@@ -28,13 +28,13 @@ var CssMotionDef = class {
 		this.name = args.name;
 		this.keyframes = d.keyframes;
 		this.transition = d.transition;
-		this.animationDuration = d.animationDuration;
-		this.animationTimingFunction = d.animationTimingFunction;
-		this.animationDelay = d.animationDelay;
-		this.animationIterationCount = d.animationIterationCount;
-		this.animationDirection = d.animationDirection;
-		this.animationFillMode = d.animationFillMode;
-		this.animationPlayState = d.animationPlayState;
+		this.duration = d.duration;
+		this.timingFunction = d.timingFunction;
+		this.delay = d.delay;
+		this.iterationCount = d.iterationCount;
+		this.direction = d.direction;
+		this.fillMode = d.fillMode;
+		this.playState = d.playState;
 		this.reducedMotion = d.reducedMotion === "none" ? "none" : void 0;
 	}
 	get derived() {
@@ -48,13 +48,13 @@ var CssMotionDef = class {
 			keyframes: this.keyframes,
 			...compact({
 				transition: this.transition,
-				animationDuration: this.animationDuration,
-				animationTimingFunction: this.animationTimingFunction,
-				animationDelay: this.animationDelay,
-				animationIterationCount: this.animationIterationCount,
-				animationDirection: this.animationDirection,
-				animationFillMode: this.animationFillMode,
-				animationPlayState: this.animationPlayState,
+				duration: this.duration,
+				timingFunction: this.timingFunction,
+				delay: this.delay,
+				iterationCount: this.iterationCount,
+				direction: this.direction,
+				fillMode: this.fillMode,
+				playState: this.playState,
 				reducedMotion: this.reducedMotion
 			})
 		};
@@ -63,35 +63,133 @@ var CssMotionDef = class {
 var JsMotionDef = class {
 	runtime = "js";
 	name;
+	variants;
 	initial;
 	animate;
 	exit;
 	transition;
 	whileHover;
 	whileTap;
+	whileFocus;
+	whileDrag;
+	whileInView;
+	viewport;
+	drag;
+	dragConstraints;
+	dragElastic;
+	dragMomentum;
+	dragSnapToOrigin;
+	dragPropagation;
+	dragDirectionLock;
+	dragTransition;
+	layout;
+	layoutId;
+	layoutDependency;
 	constructor(args) {
+		const d = args.definition;
 		this.name = args.name;
-		this.initial = args.definition.initial;
-		this.animate = args.definition.animate;
-		this.exit = args.definition.exit;
-		this.transition = args.definition.transition;
-		this.whileHover = args.definition.whileHover;
-		this.whileTap = args.definition.whileTap;
+		this.variants = d.variants;
+		this.initial = d.initial;
+		this.animate = d.animate;
+		this.exit = d.exit;
+		this.transition = d.transition;
+		this.whileHover = d.whileHover;
+		this.whileTap = d.whileTap;
+		this.whileFocus = d.whileFocus;
+		this.whileDrag = d.whileDrag;
+		this.whileInView = d.whileInView;
+		this.viewport = d.viewport;
+		this.drag = d.drag;
+		this.dragConstraints = d.dragConstraints;
+		this.dragElastic = d.dragElastic;
+		this.dragMomentum = d.dragMomentum;
+		this.dragSnapToOrigin = d.dragSnapToOrigin;
+		this.dragPropagation = d.dragPropagation;
+		this.dragDirectionLock = d.dragDirectionLock;
+		this.dragTransition = d.dragTransition;
+		this.layout = d.layout;
+		this.layoutId = d.layoutId;
+		this.layoutDependency = d.layoutDependency;
 	}
 	toJSON() {
 		return {
 			name: this.name,
 			runtime: "js",
 			...compact({
+				variants: this.variants,
 				initial: this.initial,
 				animate: this.animate,
 				exit: this.exit,
 				transition: this.transition,
 				whileHover: this.whileHover,
-				whileTap: this.whileTap
+				whileTap: this.whileTap,
+				whileFocus: this.whileFocus,
+				whileDrag: this.whileDrag,
+				whileInView: this.whileInView,
+				viewport: this.viewport,
+				drag: this.drag,
+				dragConstraints: this.dragConstraints,
+				dragElastic: this.dragElastic,
+				dragMomentum: this.dragMomentum,
+				dragSnapToOrigin: this.dragSnapToOrigin,
+				dragPropagation: this.dragPropagation,
+				dragDirectionLock: this.dragDirectionLock,
+				dragTransition: this.dragTransition,
+				layout: this.layout,
+				layoutId: this.layoutId,
+				layoutDependency: this.layoutDependency
 			})
 		};
 	}
 };
+const JS_MOTION_DEFINITION_KEY_PRESENCE = {
+	runtime: true,
+	variants: true,
+	initial: true,
+	animate: true,
+	exit: true,
+	transition: true,
+	whileHover: true,
+	whileTap: true,
+	whileFocus: true,
+	whileDrag: true,
+	whileInView: true,
+	viewport: true,
+	drag: true,
+	dragConstraints: true,
+	dragElastic: true,
+	dragMomentum: true,
+	dragSnapToOrigin: true,
+	dragPropagation: true,
+	dragDirectionLock: true,
+	dragTransition: true,
+	layout: true,
+	layoutId: true,
+	layoutDependency: true
+};
+const CSS_MOTION_DEFINITION_KEY_PRESENCE = {
+	runtime: true,
+	keyframes: true,
+	transition: true,
+	duration: true,
+	timingFunction: true,
+	delay: true,
+	iterationCount: true,
+	direction: true,
+	fillMode: true,
+	playState: true,
+	reducedMotion: true
+};
+/** Fields a `runtime: 'js'` motion preset may carry (`JsMotionDefinition`). */
+const JS_MOTION_DEFINITION_KEYS = Object.keys(JS_MOTION_DEFINITION_KEY_PRESENCE);
+/**
+* JS motion field names minus the `runtime` discriminant — the props codegen
+* spreads onto the `motion.create` wrapper. `runtime` is excluded because it's
+* config metadata, not a framer `motion` prop (spreading it would leak a
+* `runtime` attribute onto the DOM element).
+*/
+const JS_MOTION_FIELD_KEYS = JS_MOTION_DEFINITION_KEYS.filter((k) => k !== "runtime");
+/** Fields a `runtime: 'css'` motion preset may carry (`CssMotionDefinition`). */
+const CSS_MOTION_DEFINITION_KEYS = Object.keys(CSS_MOTION_DEFINITION_KEY_PRESENCE);
 //#endregion
-export { CssMotionDef, JsMotionDef };
+export { CSS_MOTION_DEFINITION_KEYS, CssMotionDef, JS_MOTION_DEFINITION_KEYS, JS_MOTION_FIELD_KEYS, JsMotionDef };

package/dist/Props.d.ts

@@ -1,6 +1,6 @@
-import { RegisteredCompositeStyles, RegisteredModifiers, RegisteredStyleProps, TagRef } from "./refs.js";
+import { MotionName, RegisteredCompositeStyles, RegisteredModifiers, RegisteredStyleProps, TagRef } from "./refs.js";
 import { ColorExpression } from "./colorExpressions.js";
-import { ComponentDefinition, LayerInput, PropBinding, RefElement, RootTag } from "./types.js";
+import { ComponentDefinition, LayerInput, PropBinding, RefElement, RootTag, SlotMotion } from "./types.js";
 import { ComponentPropsWithRef, ElementType, HTMLAttributes, JSX, ReactNode, Ref } from "react";
 
 //#region src/Props.d.ts
@@ -146,6 +146,8 @@ type ResolveBindingValue<TBinding, TLayers> = TBinding extends {
 } ? string : TBinding extends {
   readonly __kind: 'number';
 } ? number : TBinding extends {
+  readonly __kind: 'motion';
+} ? SlotMotion | MotionName : TBinding extends {
   readonly __kind: 'variant';
   readonly values: infer V;
 } ? V extends readonly (string | number)[] ? V[number] : keyof V & string : unknown : CompositeValue<Extract<CompositeRefName<TBinding>, keyof RegisteredCompositeStyles>> : StylePropValue<Extract<StylePropRefName<TBinding>, keyof RegisteredStyleProps>>;

package/dist/factories.d.ts

@@ -1,7 +1,7 @@
-import { RegisteredModifiers, TagRef, TokenGroupRef, TokenRawNameRegistry, composite, styleProp, token } from "./refs.js";
+import { MotionName, RegisteredModifiers, TagRef, TokenGroupRef, TokenRawNameRegistry, composite, styleProp, token } from "./refs.js";
 import { darken, lighten } from "./colorExpressions.js";
-import { ComponentDefinition, ComponentGroupDefinition, ComponentMetadata, CompositeStyleDefinition, LayerInput, ModeDefinition, ModifierDefinition, MotionDefinitionInput, PreviewDefinition, RefElement, StylePropDefinition, StylePropMetadata, StylePropProperty, TokenDefinition } from "./types.js";
-import { BooleanMarker, ComponentSlotMarker, LayerMarker, NumberMarker, PreviewAxisMarker, PreviewPropsRule, RequiredBrand, SlotMarker, SlotRef, SlotValueType, StringMarker, VariantMarker, VariantMarkerArray, VariantMarkerObject } from "./markers.js";
+import { ComponentDefinition, ComponentGroupDefinition, ComponentMetadata, CompositeStyleDefinition, LayerInput, ModeDefinition, ModifierDefinition, MotionDefinitionInput, PreviewDefinition, RefElement, SlotMotion, StylePropDefinition, StylePropMetadata, StylePropProperty, TokenDefinition } from "./types.js";
+import { BooleanMarker, ComponentSlotMarker, LayerMarker, MotionMarker, NumberMarker, PreviewAxisMarker, PreviewPropsRule, RequiredBrand, SlotMarker, SlotRef, SlotValueType, StringMarker, VariantMarker, VariantMarkerArray, VariantMarkerObject } from "./markers.js";
 import { BaseLayerStyles, LayerPropsMap, LayerTag, Props, PropsFromBindings, SlotPropValue } from "./Props.js";
 import { defineProvider } from "./defineProvider.js";
 import { ComponentPropsWithRef, ComponentRef, ComponentType, ElementType, FC, HTMLAttributes, JSX, ReactElement, ReactNode, Ref } from "react";
@@ -197,6 +197,19 @@ declare function string(): Chainable<StringMarker>;
  * `variant(...)` instead.
  */
 declare function number(): Chainable<NumberMarker>;
+/**
+ * JS-motion prop binding. Emits `<name>?: SlotMotion | MotionName` — either an
+ * inline framer-motion config object (`{ initial, animate, whileHover,
+ * transition, … }`) or the name of a `registerMotion({...})` preset
+ * (`motion="fadeIn"`; `MotionName` narrows to the registered names in an
+ * augmented config, else `string`). The loader routes both through
+ * `_renderWithMotion` at runtime (preset name → registered JS/CSS motion;
+ * object → inline config), so
+ * it produces no CSS of its own — this is the JS-animation counterpart to the
+ * CSS `animation`/`transition` style props, not a `styleProp`. Chain
+ * `.required()` to force callers to pass it.
+ */
+declare function motion(): Chainable<MotionMarker>;
 /**
  * Helpers passed to `defineComponent(...).config(cb)` callbacks. Same
  * shape regardless of single-layer (`defineComponent('div')`) or
@@ -215,6 +228,7 @@ interface ConfigCallbackHelpers {
   readonly asChild: typeof asChild;
   readonly string: typeof string;
   readonly number: typeof number;
+  readonly motion: typeof motion;
   readonly layer: typeof layer;
   readonly composite: typeof composite;
   readonly styleProp: typeof styleProp;
@@ -366,6 +380,7 @@ type TypedConfigHelpers<T extends ComponentDefinition> = T extends ComponentDefi
   readonly layer: TypedLayerHelper<TLayers>;
   readonly string: typeof string;
   readonly number: typeof number;
+  readonly motion: typeof motion;
   readonly composite: typeof composite;
   readonly styleProp: typeof styleProp;
   readonly token: typeof token;
@@ -522,6 +537,8 @@ type ResolveMarker<M> = M extends {
 } ? string : M extends {
   readonly __kind: 'number';
 } ? number : M extends {
+  readonly __kind: 'motion';
+} ? SlotMotion | MotionName : M extends {
   readonly __kind: 'boolean';
 } ? boolean : M extends {
   readonly __kind: 'variant';
@@ -809,4 +826,4 @@ type ProviderComponent<TProps = Record<never, never>> = FC<{
  */
 type DefinedProvider<TContext = unknown, TProps = Record<never, never>> = readonly [ProviderComponent<TProps>, () => TContext];
 //#endregion
-export { BoundComponent, ComponentBuilder, ComponentBuilderMethods, ComponentRenderFn, ConfigCallbackHelpers, DefineComponentFn, DefinedComponent, DefinedProvider, DefinedStyleProp, DefinedTokenGroup, PreviewCallbackHelpers, ProviderComponent, ProviderRenderFn, RawToken, TokenGroupMetadata, TokenRawValue, TypedSlotRef, asChild, boolean, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineStyleProp, defineTokenGroup, number, slot, string, variant };
+export { BoundComponent, ComponentBuilder, ComponentBuilderMethods, ComponentRenderFn, ConfigCallbackHelpers, DefineComponentFn, DefinedComponent, DefinedProvider, DefinedStyleProp, DefinedTokenGroup, PreviewCallbackHelpers, ProviderComponent, ProviderRenderFn, RawToken, TokenGroupMetadata, TokenRawValue, TypedSlotRef, asChild, boolean, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineStyleProp, defineTokenGroup, motion, number, slot, string, variant };

package/dist/factories.js

@@ -254,6 +254,21 @@ function number() {
 	return attachRequired({ __kind: "number" });
 }
 /**
+* JS-motion prop binding. Emits `<name>?: SlotMotion | MotionName` — either an
+* inline framer-motion config object (`{ initial, animate, whileHover,
+* transition, … }`) or the name of a `registerMotion({...})` preset
+* (`motion="fadeIn"`; `MotionName` narrows to the registered names in an
+* augmented config, else `string`). The loader routes both through
+* `_renderWithMotion` at runtime (preset name → registered JS/CSS motion;
+* object → inline config), so
+* it produces no CSS of its own — this is the JS-animation counterpart to the
+* CSS `animation`/`transition` style props, not a `styleProp`. Chain
+* `.required()` to force callers to pass it.
+*/
+function motion() {
+	return attachRequired({ __kind: "motion" });
+}
+/**
 * Axis marker for `.preview({ matrix: { columns, rows } })`. The
 * `kind` field discriminates between prop axes (varies a JSX prop
 * across the grid) and modifier axes (toggles a `_${name}` modifier
@@ -280,6 +295,7 @@ const configHelpers = {
 	asChild,
 	string,
 	number,
+	motion,
 	layer,
 	composite,
 	styleProp,
@@ -420,4 +436,4 @@ defineComponentImpl.layers = function layersEntry(layers) {
 };
 const defineComponent = defineComponentImpl;
 //#endregion
-export { asChild, boolean, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineStyleProp, defineTokenGroup, number, slot, string, variant };
+export { asChild, boolean, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineStyleProp, defineTokenGroup, motion, number, slot, string, variant };

package/dist/index.d.ts

@@ -1,25 +1,25 @@
 import { ASSET_CLASS_CAPABILITIES, AssetKind, isPlaceable } from "./asset-kind.js";
-import { AnyRef, AssetGroupName, AssetGroupRef, AssetName, AssetRef, ComponentName, ComponentRef, CompositeName, CompositeRef, CompositeRefBuilder, ModeName, ModeRef, RegisteredAssetGroups, RegisteredComponents, RegisteredCompositeStyles, RegisteredModes, RegisteredModifiers, RegisteredMotionDefs, RegisteredStyleProps, RegisteredTokenGroups, StylePropName, StylePropRef, TagName, TagRef, TokenGroupName, TokenGroupRef, TokenName, TokenQualifiedName, TokenRawNameRegistry, TokenRef, asset, assetGroup, component, composite, isAssetGroupRef, isAssetRef, isComponentRef, isCompositeRef, isModeRef, isStylePropRef, isTagRef, isTokenGroupRef, isTokenRef, mode, styleProp, tag, token, tokenGroup } from "./refs.js";
+import { AnyRef, AssetGroupName, AssetGroupRef, AssetName, AssetRef, ComponentName, ComponentRef, CompositeName, CompositeRef, CompositeRefBuilder, ModeName, ModeRef, MotionName, RegisteredAssetGroups, RegisteredComponents, RegisteredCompositeStyles, RegisteredModes, RegisteredModifiers, RegisteredMotion, RegisteredStyleProps, RegisteredTokenGroups, StylePropName, StylePropRef, TagName, TagRef, TokenGroupName, TokenGroupRef, TokenName, TokenQualifiedName, TokenRawNameRegistry, TokenRef, asset, assetGroup, component, composite, isAssetGroupRef, isAssetRef, isComponentRef, isCompositeRef, isModeRef, isStylePropRef, isTagRef, isTokenGroupRef, isTokenRef, mode, styleProp, tag, token, tokenGroup } from "./refs.js";
 import { ColorFn, ColorKeyword, CssAngle, CssColor, CssLength, CssPercentage, CssRatio, CssTime, CssValue, CssValueTypeName, CssVarRef, HexColor, HslColor, RgbColor } from "./types/css-values.js";
 import { ColorExpression, ColorSpace, ColorValue, GradientStop, GradientValue, LengthOrPercent, LineDirection, LinearGradientExpr, MixExpr, RadialGradientExpr, RadialSize, TokenRefToCss, alpha, isColorExpression, isLinearGradientExpr, isMixExpr, isRadialGradientExpr, linearGradient, mix, radialGradient, resolveColorExpression } from "./colorExpressions.js";
 import { CSS_GLOBAL_KEYWORDS, CSS_PROPERTY_KEYWORDS, CssPropertyWithKeywords } from "./types/css-property-keywords.js";
 import { ColorCssProperty, CssGlobalKeyword, CssPropertyName, CssPropertyValues } from "./types/css-properties.js";
-import { AnyStylePropDefinition, ArbitrarySpec, BaseStyles, BuildOptions, CanvasRole, CanvasRoleEntry, CanvasRoleEntryInput, CanvasRolesDefinition, CanvasRolesDefinitionInput, CanvasRolesInputConstraint, ComponentDefinition, ComponentGroupDefinition, ComponentMetadata, CompositeStyleDefinition, CompositeStyleObject, CompoundPropsEntry, CssMotionDefinition, FontAssetMember, GlobalStylesDef, JsMotionDefinition, LayerInput, LiteralFor, ModeDefinition, ModeOptionDefinition, ModifierDefinition, MotionDefinitionInput, MotionKeyframes, MotionStateKeyframe, MotionTransition, OpacityPairSpec, PlaygroundOptions, PlaygroundPage, PlaygroundSpec, PreviewDefinition, PropBinding, SerializedAssetGroup, SerializedComponentGroup, SerializedConfig, SerializedFontAssetGroup, SerializedIconAssetGroup, SerializedPlaygroundOptions, SerializedTokenGroup, SlotMotion, StylePropDefinition, StylePropMetadata, StylePropProperty, TokenDefinition, TokenGroupDefinition, TokenModifierKey, TokenModifierValue, TokenType, TokenValue, ValuesEntry } from "./types.js";
+import { AnyStylePropDefinition, ArbitrarySpec, BaseStyles, BuildOptions, CanvasRole, CanvasRoleEntry, CanvasRoleEntryInput, CanvasRolesDefinition, CanvasRolesDefinitionInput, CanvasRolesInputConstraint, ComponentDefinition, ComponentGroupDefinition, ComponentMetadata, CompositeStyleDefinition, CompositeStyleObject, CompoundPropsEntry, CssMotionDefinition, CssMotionFields, CssSlotMotion, FontAssetMember, GlobalStylesDef, JsMotionDefinition, JsMotionFields, JsSlotMotion, LayerInput, LiteralFor, ModeDefinition, ModeOptionDefinition, ModifierDefinition, MotionDefinitionInput, MotionDragBox, MotionKeyframes, MotionState, MotionStateKeyframe, MotionTransition, MotionVariants, MotionViewportOptions, OpacityPairSpec, PlaygroundOptions, PlaygroundPage, PlaygroundSpec, PreviewDefinition, PropBinding, SerializedAssetGroup, SerializedComponentGroup, SerializedConfig, SerializedFontAssetGroup, SerializedIconAssetGroup, SerializedPlaygroundOptions, SerializedTokenGroup, SlotMotion, StylePropDefinition, StylePropMetadata, StylePropProperty, TokenDefinition, TokenGroupDefinition, TokenModifierKey, TokenModifierValue, TokenType, TokenValue, ValuesEntry } from "./types.js";
 import { AssetGroupBuilder, AssetGroupConfig, AssetGroupDefinition, FontAssetGroupConfig, FontAssetGroupDefinition, IconAssetGroupConfig, IconAssetGroupDefinition, IconAssetMember, IconAssetMetadata, defineAssetGroup, defineAssetIcon } from "./defineAssetGroup.js";
 import { AssetGroup } from "./AssetGroup.js";
 import { resolveAssetRefCss, resolveFontStack } from "./asset-value.js";
 import { Css, CssClassName, CssDeclaration, CssSelector, CssVar, cssClassName, cssDeclaration, cssSelector, cssVar } from "./brands.js";
-import { BooleanMarker, LayerMarker, NumberMarker, PREVIEW_SEED_KEY, PreviewAxisMarker, PreviewPropsRule, RequiredBrand, SlotMarker, SlotRef, SlotValueType, StringMarker, VariantMarker, VariantMarkerArray, VariantMarkerObject, isBoolMarker, isLayerMarker, isNumberMarker, isPreviewAxisMarker, isSlotMarker, isStringMarker, isVariantArrayMarker, isVariantMarker, matchesPreviewWhen, resolvePreviewRules } from "./markers.js";
+import { BooleanMarker, LayerMarker, MotionMarker, NumberMarker, PREVIEW_SEED_KEY, PreviewAxisMarker, PreviewPropsRule, RequiredBrand, SlotMarker, SlotRef, SlotValueType, StringMarker, VariantMarker, VariantMarkerArray, VariantMarkerObject, isBoolMarker, isLayerMarker, isMotionMarker, isNumberMarker, isPreviewAxisMarker, isSlotMarker, isStringMarker, isVariantArrayMarker, isVariantMarker, matchesPreviewWhen, resolvePreviewRules } from "./markers.js";
 import { Component, ComponentKind, CompositeInfo, FunctionInfo, Layer, PrimitivePropKind, PropBase, PropInfo, PropKind, ResolvedCompoundOverrides, SlotInfo, SlotValueKind, StylePropInfo, StylePropKeyword, StylePropTokenUsage, VariantInfo } from "./Component.js";
 import { ComponentGroup } from "./ComponentGroup.js";
 import { CompositeStyle } from "./CompositeStyle.js";
 import { makeTokenRefToCss } from "./entity-utils.js";
 import { DataAttrs, LayerPropsMap } from "./Props.js";
 import { defineProvider } from "./defineProvider.js";
-import { BoundComponent, ComponentBuilder, ComponentBuilderMethods, ComponentRenderFn, ConfigCallbackHelpers, DefineComponentFn, DefinedComponent, DefinedProvider, DefinedStyleProp, DefinedTokenGroup, PreviewCallbackHelpers, RawToken, TokenGroupMetadata, TokenRawValue, TypedSlotRef, asChild, boolean, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineStyleProp, defineTokenGroup, number, slot, string, variant } from "./factories.js";
+import { BoundComponent, ComponentBuilder, ComponentBuilderMethods, ComponentRenderFn, ConfigCallbackHelpers, DefineComponentFn, DefinedComponent, DefinedProvider, DefinedStyleProp, DefinedTokenGroup, PreviewCallbackHelpers, RawToken, TokenGroupMetadata, TokenRawValue, TypedSlotRef, asChild, boolean, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineStyleProp, defineTokenGroup, motion, number, slot, string, variant } from "./factories.js";
 import { Mode, ModeOption } from "./Mode.js";
 import { Modifier } from "./Modifier.js";
-import { CssMotionDef, JsMotionDef, MotionDef } from "./MotionDef.js";
+import { CSS_MOTION_DEFINITION_KEYS, CssMotionDef, JS_MOTION_DEFINITION_KEYS, JS_MOTION_FIELD_KEYS, JsMotionDef, MotionDef } from "./MotionDef.js";
 import { Provider } from "./Provider.js";
 import { ResolvedTokenLiteral, Token } from "./Token.js";
 import { StyleProp, isSafeClassNameValue } from "./StyleProp.js";
@@ -32,4 +32,4 @@ import { collectFontFaceCss, deriveFontFaceCss, familiesInRawCss } from "./font-
 import { interpolate } from "./interpolate.js";
 import { ModeBackedModifierDefinition, ModeBackedModifierInput, ModeBackedModifierLookup, OverrideModeRef, OverrideRow, buildModeBackedModifierLookup, buildNestedModifierUpdate, createModeBackedModifierLookup, mergeModifierUpdates, modifierIdToPath, modifierPathToId, modifierTreeToOverrideRows, overrideRowsToModifierTree, resolveOverrideRowValue } from "./token-override-rows.js";
 import { rem } from "./units.js";
-export { ASSET_CLASS_CAPABILITIES, type AnyRef, type AnyStylePropDefinition, type ArbitrarySpec, AssetGroup, type AssetGroupBuilder, type AssetGroupConfig, type AssetGroupDefinition, type AssetGroupName, type AssetGroupRef, type AssetKind, type AssetName, type AssetRef, type BaseStyles, type BooleanMarker, type BoundComponent, type BuildOptions, CSS_GLOBAL_KEYWORDS, CSS_PROPERTY_KEYWORDS, type CanvasRole, type CanvasRoleEntry, type CanvasRoleEntryInput, type CanvasRolesDefinition, type CanvasRolesDefinitionInput, type CanvasRolesInputConstraint, type ColorCssProperty, type ColorExpression, type ColorFn, type ColorKeyword, type ColorSpace, type ColorValue, Component, type ComponentBuilder, type ComponentBuilderMethods, type ComponentDefinition, ComponentGroup, type ComponentGroupDefinition, type ComponentKind, type ComponentMetadata, type ComponentName, type ComponentRef, type ComponentRenderFn, type CompositeInfo, type CompositeName, type CompositeRef, type CompositeRefBuilder, CompositeStyle, type CompositeStyleDefinition, type CompositeStyleObject, type CompoundPropsEntry, Config, type ConfigCallbackHelpers, type Css, type CssAngle, type CssClassName, type CssColor, type CssDeclaration, type CssGlobalKeyword, type CssLength, CssMotionDef, type CssMotionDefinition, type CssPercentage, type CssPropertyName, type CssPropertyValues, type CssPropertyWithKeywords, type CssRatio, type CssSelector, type CssTime, type CssValue, type CssValueTypeName, type CssVar, type CssVarRef, type DataAttrs, type DefineComponentFn, type DefinedComponent, type DefinedProvider, type DefinedStyleProp, type DefinedTokenGroup, type DependenciesQuery, type DependencyKind, type DependencyRef, type DependentsQuery, ELEMENT_MARKER_KIND, type ElementMarker, type FontAssetGroupConfig, type FontAssetGroupDefinition, type FontAssetMember, type FunctionInfo, type GlobalStylesDef, type GradientStop, type GradientValue, type HexColor, type HslColor, type IconAssetGroupConfig, type IconAssetGroupDefinition, type IconAssetMember, type IconAssetMetadata, JsMotionDef, type JsMotionDefinition, Layer, type LayerInput, type LayerMarker, type LayerPropsMap, type LengthOrPercent, type LineDirection, type LinearGradientExpr, type LiteralFor, type MixExpr, Mode, type ModeBackedModifierDefinition, type ModeBackedModifierInput, type ModeBackedModifierLookup, type ModeDefinition, type ModeName, ModeOption, type ModeOptionDefinition, type ModeRef, Modifier, type ModifierDefinition, type MotionDef, type MotionDefinitionInput, type MotionKeyframes, type MotionStateKeyframe, type MotionTransition, type NumberMarker, type OpacityPairSpec, type OpaqueLeafPredicate, type OverrideModeRef, type OverrideRow, PREVIEW_SEED_KEY, type PlaygroundOptions, type PlaygroundPage, type PlaygroundSpec, type PreviewAxisMarker, type PreviewCallbackHelpers, type PreviewDefinition, type PreviewPropsRule, type PrimitivePropKind, type PropBase, type PropBinding, type PropInfo, type PropKind, Provider, type RadialGradientExpr, type RadialSize, type RawToken, type RegisteredAssetGroups, type RegisteredComponents, type RegisteredCompositeStyles, type RegisteredModes, type RegisteredModifiers, type RegisteredMotionDefs, type RegisteredStyleProps, type RegisteredTokenGroups, type RequiredBrand, type ResolvedCompoundOverrides, type ResolvedTokenLiteral, type RgbColor, SOURCE_PATH_KEY, type SerializedAssetGroup, type SerializedComponentGroup, type SerializedConfig, type SerializedFontAssetGroup, type SerializedIconAssetGroup, type SerializedPlaygroundOptions, type SerializedTokenGroup, type SlotInfo, type SlotMarker, type SlotMotion, type SlotRef, type SlotValueKind, type SlotValueType, type StringMarker, StyleProp, type StylePropDefinition, type StylePropInfo, type StylePropKeyword, type StylePropMetadata, type StylePropName, type StylePropProperty, type StylePropRef, type StylePropTokenUsage, type TagName, type TagRef, Token, type TokenDefinition, TokenGroup, type TokenGroupDefinition, type TokenGroupMetadata, type TokenGroupName, type TokenGroupRef, type TokenModifierKey, type TokenModifierValue, type TokenName, type TokenQualifiedName, type TokenRawNameRegistry, type TokenRawValue, type TokenRef, type TokenRefToCss, type TokenType, type TokenValue, type TypedSlotRef, type ValuesEntry, type VariantInfo, type VariantMarker, type VariantMarkerArray, type VariantMarkerObject, alpha, asChild, asset, assetGroup, attachSourcePath, boolean, buildModeBackedModifierLookup, buildNestedModifierUpdate, captureCallerPath, collectFontFaceCss, component, composite, createModeBackedModifierLookup, cssClassName, cssDeclaration, cssSelector, cssVar, defineAssetGroup, defineAssetIcon, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineProvider, defineStyleProp, defineTokenGroup, deriveFontFaceCss, familiesInRawCss, findComponentReferrers, hasElementMarkerDeep, interpolate, isAssetGroupRef, isAssetRef, isBoolMarker, isColorExpression, isComponentRef, isCompositeRef, isElementLikeValue, isElementMarker, isLayerMarker, isLinearGradientExpr, isMixExpr, isModeRef, isNumberMarker, isPlaceable, isPreviewAxisMarker, isRadialGradientExpr, isSafeClassNameValue, isSlotMarker, isStringMarker, isStylePropRef, isTagRef, isTokenGroupRef, isTokenRef, isVariantArrayMarker, isVariantMarker, linearGradient, makeTokenRefToCss, matchesPreviewWhen, mergeModifierUpdates, mix, mode, modifierIdToPath, modifierPathToId, modifierTreeToOverrideRows, number, overrideRowsToModifierTree, parseRegistryKey, radialGradient, readSourcePath, rem, resolveAssetRefCss, resolveColorExpression, resolveFontStack, resolveOverrideRowValue, resolvePreviewRules, reviveElementMarkersDeep, slot, string, styleProp, tag, token, tokenGroup, variant };
+export { ASSET_CLASS_CAPABILITIES, type AnyRef, type AnyStylePropDefinition, type ArbitrarySpec, AssetGroup, type AssetGroupBuilder, type AssetGroupConfig, type AssetGroupDefinition, type AssetGroupName, type AssetGroupRef, type AssetKind, type AssetName, type AssetRef, type BaseStyles, type BooleanMarker, type BoundComponent, type BuildOptions, CSS_GLOBAL_KEYWORDS, CSS_MOTION_DEFINITION_KEYS, CSS_PROPERTY_KEYWORDS, type CanvasRole, type CanvasRoleEntry, type CanvasRoleEntryInput, type CanvasRolesDefinition, type CanvasRolesDefinitionInput, type CanvasRolesInputConstraint, type ColorCssProperty, type ColorExpression, type ColorFn, type ColorKeyword, type ColorSpace, type ColorValue, Component, type ComponentBuilder, type ComponentBuilderMethods, type ComponentDefinition, ComponentGroup, type ComponentGroupDefinition, type ComponentKind, type ComponentMetadata, type ComponentName, type ComponentRef, type ComponentRenderFn, type CompositeInfo, type CompositeName, type CompositeRef, type CompositeRefBuilder, CompositeStyle, type CompositeStyleDefinition, type CompositeStyleObject, type CompoundPropsEntry, Config, type ConfigCallbackHelpers, type Css, type CssAngle, type CssClassName, type CssColor, type CssDeclaration, type CssGlobalKeyword, type CssLength, CssMotionDef, type CssMotionDefinition, type CssMotionFields, type CssPercentage, type CssPropertyName, type CssPropertyValues, type CssPropertyWithKeywords, type CssRatio, type CssSelector, type CssSlotMotion, type CssTime, type CssValue, type CssValueTypeName, type CssVar, type CssVarRef, type DataAttrs, type DefineComponentFn, type DefinedComponent, type DefinedProvider, type DefinedStyleProp, type DefinedTokenGroup, type DependenciesQuery, type DependencyKind, type DependencyRef, type DependentsQuery, ELEMENT_MARKER_KIND, type ElementMarker, type FontAssetGroupConfig, type FontAssetGroupDefinition, type FontAssetMember, type FunctionInfo, type GlobalStylesDef, type GradientStop, type GradientValue, type HexColor, type HslColor, type IconAssetGroupConfig, type IconAssetGroupDefinition, type IconAssetMember, type IconAssetMetadata, JS_MOTION_DEFINITION_KEYS, JS_MOTION_FIELD_KEYS, JsMotionDef, type JsMotionDefinition, type JsMotionFields, type JsSlotMotion, Layer, type LayerInput, type LayerMarker, type LayerPropsMap, type LengthOrPercent, type LineDirection, type LinearGradientExpr, type LiteralFor, type MixExpr, Mode, type ModeBackedModifierDefinition, type ModeBackedModifierInput, type ModeBackedModifierLookup, type ModeDefinition, type ModeName, ModeOption, type ModeOptionDefinition, type ModeRef, Modifier, type ModifierDefinition, type MotionDef, type MotionDefinitionInput, type MotionDragBox, type MotionKeyframes, type MotionMarker, type MotionName, type MotionState, type MotionStateKeyframe, type MotionTransition, type MotionVariants, type MotionViewportOptions, type NumberMarker, type OpacityPairSpec, type OpaqueLeafPredicate, type OverrideModeRef, type OverrideRow, PREVIEW_SEED_KEY, type PlaygroundOptions, type PlaygroundPage, type PlaygroundSpec, type PreviewAxisMarker, type PreviewCallbackHelpers, type PreviewDefinition, type PreviewPropsRule, type PrimitivePropKind, type PropBase, type PropBinding, type PropInfo, type PropKind, Provider, type RadialGradientExpr, type RadialSize, type RawToken, type RegisteredAssetGroups, type RegisteredComponents, type RegisteredCompositeStyles, type RegisteredModes, type RegisteredModifiers, type RegisteredMotion, type RegisteredStyleProps, type RegisteredTokenGroups, type RequiredBrand, type ResolvedCompoundOverrides, type ResolvedTokenLiteral, type RgbColor, SOURCE_PATH_KEY, type SerializedAssetGroup, type SerializedComponentGroup, type SerializedConfig, type SerializedFontAssetGroup, type SerializedIconAssetGroup, type SerializedPlaygroundOptions, type SerializedTokenGroup, type SlotInfo, type SlotMarker, type SlotMotion, type SlotRef, type SlotValueKind, type SlotValueType, type StringMarker, StyleProp, type StylePropDefinition, type StylePropInfo, type StylePropKeyword, type StylePropMetadata, type StylePropName, type StylePropProperty, type StylePropRef, type StylePropTokenUsage, type TagName, type TagRef, Token, type TokenDefinition, TokenGroup, type TokenGroupDefinition, type TokenGroupMetadata, type TokenGroupName, type TokenGroupRef, type TokenModifierKey, type TokenModifierValue, type TokenName, type TokenQualifiedName, type TokenRawNameRegistry, type TokenRawValue, type TokenRef, type TokenRefToCss, type TokenType, type TokenValue, type TypedSlotRef, type ValuesEntry, type VariantInfo, type VariantMarker, type VariantMarkerArray, type VariantMarkerObject, alpha, asChild, asset, assetGroup, attachSourcePath, boolean, buildModeBackedModifierLookup, buildNestedModifierUpdate, captureCallerPath, collectFontFaceCss, component, composite, createModeBackedModifierLookup, cssClassName, cssDeclaration, cssSelector, cssVar, defineAssetGroup, defineAssetIcon, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineProvider, defineStyleProp, defineTokenGroup, deriveFontFaceCss, familiesInRawCss, findComponentReferrers, hasElementMarkerDeep, interpolate, isAssetGroupRef, isAssetRef, isBoolMarker, isColorExpression, isComponentRef, isCompositeRef, isElementLikeValue, isElementMarker, isLayerMarker, isLinearGradientExpr, isMixExpr, isModeRef, isMotionMarker, isNumberMarker, isPlaceable, isPreviewAxisMarker, isRadialGradientExpr, isSafeClassNameValue, isSlotMarker, isStringMarker, isStylePropRef, isTagRef, isTokenGroupRef, isTokenRef, isVariantArrayMarker, isVariantMarker, linearGradient, makeTokenRefToCss, matchesPreviewWhen, mergeModifierUpdates, mix, mode, modifierIdToPath, modifierPathToId, modifierTreeToOverrideRows, motion, number, overrideRowsToModifierTree, parseRegistryKey, radialGradient, readSourcePath, rem, resolveAssetRefCss, resolveColorExpression, resolveFontStack, resolveOverrideRowValue, resolvePreviewRules, reviveElementMarkersDeep, slot, string, styleProp, tag, token, tokenGroup, variant };

package/dist/index.js

@@ -8,13 +8,13 @@ import { asset, assetGroup, component, composite, isAssetGroupRef, isAssetRef, i
 import { alpha, isColorExpression, isLinearGradientExpr, isMixExpr, isRadialGradientExpr, linearGradient, mix, radialGradient, resolveColorExpression } from "./colorExpressions.js";
 import { defineAssetGroup, defineAssetIcon } from "./defineAssetGroup.js";
 import { ELEMENT_MARKER_KIND, hasElementMarkerDeep, isElementLikeValue, isElementMarker, reviveElementMarkersDeep } from "./element-marker.js";
-import { PREVIEW_SEED_KEY, isBoolMarker, isLayerMarker, isNumberMarker, isPreviewAxisMarker, isSlotMarker, isStringMarker, isVariantArrayMarker, isVariantMarker, matchesPreviewWhen, resolvePreviewRules } from "./markers.js";
+import { PREVIEW_SEED_KEY, isBoolMarker, isLayerMarker, isMotionMarker, isNumberMarker, isPreviewAxisMarker, isSlotMarker, isStringMarker, isVariantArrayMarker, isVariantMarker, matchesPreviewWhen, resolvePreviewRules } from "./markers.js";
 import { Component, Layer } from "./Component.js";
 import { ComponentGroup } from "./ComponentGroup.js";
 import { CompositeStyle } from "./CompositeStyle.js";
 import { Mode, ModeOption } from "./Mode.js";
 import { Modifier } from "./Modifier.js";
-import { CssMotionDef, JsMotionDef } from "./MotionDef.js";
+import { CSS_MOTION_DEFINITION_KEYS, CssMotionDef, JS_MOTION_DEFINITION_KEYS, JS_MOTION_FIELD_KEYS, JsMotionDef } from "./MotionDef.js";
 import { Provider } from "./Provider.js";
 import { StyleProp, isSafeClassNameValue } from "./StyleProp.js";
 import { Token } from "./Token.js";
@@ -22,10 +22,10 @@ import { TokenGroup } from "./TokenGroup.js";
 import { Config, parseRegistryKey } from "./Config.js";
 import { findComponentReferrers } from "./component-referrers.js";
 import { defineProvider } from "./defineProvider.js";
-import { asChild, boolean, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineStyleProp, defineTokenGroup, number, slot, string, variant } from "./factories.js";
+import { asChild, boolean, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineStyleProp, defineTokenGroup, motion, number, slot, string, variant } from "./factories.js";
 import { collectFontFaceCss, deriveFontFaceCss, familiesInRawCss } from "./font-face.js";
 import { interpolate } from "./interpolate.js";
 import { buildModeBackedModifierLookup, buildNestedModifierUpdate, createModeBackedModifierLookup, mergeModifierUpdates, modifierIdToPath, modifierPathToId, modifierTreeToOverrideRows, overrideRowsToModifierTree, resolveOverrideRowValue } from "./token-override-rows.js";
 import { CSS_GLOBAL_KEYWORDS, CSS_PROPERTY_KEYWORDS } from "./types/css-property-keywords.js";
 import { rem } from "./units.js";
-export { ASSET_CLASS_CAPABILITIES, AssetGroup, CSS_GLOBAL_KEYWORDS, CSS_PROPERTY_KEYWORDS, Component, ComponentGroup, CompositeStyle, Config, CssMotionDef, ELEMENT_MARKER_KIND, JsMotionDef, Layer, Mode, ModeOption, Modifier, PREVIEW_SEED_KEY, Provider, SOURCE_PATH_KEY, StyleProp, Token, TokenGroup, alpha, asChild, asset, assetGroup, attachSourcePath, boolean, buildModeBackedModifierLookup, buildNestedModifierUpdate, captureCallerPath, collectFontFaceCss, component, composite, createModeBackedModifierLookup, cssClassName, cssDeclaration, cssSelector, cssVar, defineAssetGroup, defineAssetIcon, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineProvider, defineStyleProp, defineTokenGroup, deriveFontFaceCss, familiesInRawCss, findComponentReferrers, hasElementMarkerDeep, interpolate, isAssetGroupRef, isAssetRef, isBoolMarker, isColorExpression, isComponentRef, isCompositeRef, isElementLikeValue, isElementMarker, isLayerMarker, isLinearGradientExpr, isMixExpr, isModeRef, isNumberMarker, isPlaceable, isPreviewAxisMarker, isRadialGradientExpr, isSafeClassNameValue, isSlotMarker, isStringMarker, isStylePropRef, isTagRef, isTokenGroupRef, isTokenRef, isVariantArrayMarker, isVariantMarker, linearGradient, makeTokenRefToCss, matchesPreviewWhen, mergeModifierUpdates, mix, mode, modifierIdToPath, modifierPathToId, modifierTreeToOverrideRows, number, overrideRowsToModifierTree, parseRegistryKey, radialGradient, readSourcePath, rem, resolveAssetRefCss, resolveColorExpression, resolveFontStack, resolveOverrideRowValue, resolvePreviewRules, reviveElementMarkersDeep, slot, string, styleProp, tag, token, tokenGroup, variant };
+export { ASSET_CLASS_CAPABILITIES, AssetGroup, CSS_GLOBAL_KEYWORDS, CSS_MOTION_DEFINITION_KEYS, CSS_PROPERTY_KEYWORDS, Component, ComponentGroup, CompositeStyle, Config, CssMotionDef, ELEMENT_MARKER_KIND, JS_MOTION_DEFINITION_KEYS, JS_MOTION_FIELD_KEYS, JsMotionDef, Layer, Mode, ModeOption, Modifier, PREVIEW_SEED_KEY, Provider, SOURCE_PATH_KEY, StyleProp, Token, TokenGroup, alpha, asChild, asset, assetGroup, attachSourcePath, boolean, buildModeBackedModifierLookup, buildNestedModifierUpdate, captureCallerPath, collectFontFaceCss, component, composite, createModeBackedModifierLookup, cssClassName, cssDeclaration, cssSelector, cssVar, defineAssetGroup, defineAssetIcon, defineComponent, defineComponentGroup, defineCompositeStyle, defineMode, defineModifier, defineMotion, defineProvider, defineStyleProp, defineTokenGroup, deriveFontFaceCss, familiesInRawCss, findComponentReferrers, hasElementMarkerDeep, interpolate, isAssetGroupRef, isAssetRef, isBoolMarker, isColorExpression, isComponentRef, isCompositeRef, isElementLikeValue, isElementMarker, isLayerMarker, isLinearGradientExpr, isMixExpr, isModeRef, isMotionMarker, isNumberMarker, isPlaceable, isPreviewAxisMarker, isRadialGradientExpr, isSafeClassNameValue, isSlotMarker, isStringMarker, isStylePropRef, isTagRef, isTokenGroupRef, isTokenRef, isVariantArrayMarker, isVariantMarker, linearGradient, makeTokenRefToCss, matchesPreviewWhen, mergeModifierUpdates, mix, mode, modifierIdToPath, modifierPathToId, modifierTreeToOverrideRows, motion, number, overrideRowsToModifierTree, parseRegistryKey, radialGradient, readSourcePath, rem, resolveAssetRefCss, resolveColorExpression, resolveFontStack, resolveOverrideRowValue, resolvePreviewRules, reviveElementMarkersDeep, slot, string, styleProp, tag, token, tokenGroup, variant };

package/dist/markers.d.ts

@@ -161,6 +161,11 @@ interface NumberMarker {
 }
 declare function isStringMarker(value: unknown): value is StringMarker;
 declare function isNumberMarker(value: unknown): value is NumberMarker;
+interface MotionMarker {
+  readonly __kind: 'motion';
+  readonly __required?: boolean;
+}
+declare function isMotionMarker(value: unknown): value is MotionMarker;
 interface LayerMarker {
   readonly __kind: 'layer';
   readonly layer: string;
@@ -224,4 +229,4 @@ interface PreviewAxisMarker {
 }
 declare function isPreviewAxisMarker(value: unknown): value is PreviewAxisMarker;
 //#endregion
-export { BooleanMarker, ComponentSlotMarker, LayerMarker, NumberMarker, PREVIEW_SEED_KEY, PreviewAxisMarker, PreviewPropsRule, RequiredBrand, SlotMarker, SlotRef, SlotValueType, StringMarker, VariantMarker, VariantMarkerArray, VariantMarkerObject, isBoolMarker, isLayerMarker, isNumberMarker, isPreviewAxisMarker, isSlotMarker, isStringMarker, isVariantArrayMarker, isVariantMarker, matchesPreviewWhen, resolvePreviewRules };
+export { BooleanMarker, ComponentSlotMarker, LayerMarker, MotionMarker, NumberMarker, PREVIEW_SEED_KEY, PreviewAxisMarker, PreviewPropsRule, RequiredBrand, SlotMarker, SlotRef, SlotValueType, StringMarker, VariantMarker, VariantMarkerArray, VariantMarkerObject, isBoolMarker, isLayerMarker, isMotionMarker, isNumberMarker, isPreviewAxisMarker, isSlotMarker, isStringMarker, isVariantArrayMarker, isVariantMarker, matchesPreviewWhen, resolvePreviewRules };

package/dist/markers.js

@@ -30,6 +30,9 @@ function isStringMarker(value) {
 function isNumberMarker(value) {
 	return typeof value === "object" && value !== null && value.__kind === "number";
 }
+function isMotionMarker(value) {
+	return typeof value === "object" && value !== null && value.__kind === "motion";
+}
 function isLayerMarker(value) {
 	return typeof value === "object" && value !== null && value.__kind === "layer";
 }
@@ -64,4 +67,4 @@ function isPreviewAxisMarker(value) {
 	return typeof value === "object" && value !== null && value.__kind === "previewAxis";
 }
 //#endregion
-export { PREVIEW_SEED_KEY, isBoolMarker, isLayerMarker, isNumberMarker, isPreviewAxisMarker, isSlotMarker, isStringMarker, isVariantArrayMarker, isVariantMarker, matchesPreviewWhen, resolvePreviewRules };
+export { PREVIEW_SEED_KEY, isBoolMarker, isLayerMarker, isMotionMarker, isNumberMarker, isPreviewAxisMarker, isSlotMarker, isStringMarker, isVariantArrayMarker, isVariantMarker, matchesPreviewWhen, resolvePreviewRules };

package/dist/refs.d.ts

@@ -32,7 +32,7 @@ interface RegisteredModes {}
 interface RegisteredCompositeStyles {}
 interface RegisteredStyleProps {}
 interface RegisteredComponents {}
-interface RegisteredMotionDefs {}
+interface RegisteredMotion {}
 interface RegisteredAssetGroups {}
 interface TokenRawNameRegistry {}
 /** `<groupName>/<tokenName>` for every registered token. */
@@ -65,6 +65,10 @@ type ModeName = [keyof RegisteredModes] extends [never] ? `${string}/${string}`
 type StylePropName = [keyof RegisteredStyleProps] extends [never] ? string : keyof RegisteredStyleProps & string;
 /** Registered component names — `'Box'`, `'Alert'`. */
 type ComponentName = [keyof RegisteredComponents] extends [never] ? string : keyof RegisteredComponents & string;
+/** Registered `registerMotion({...})` preset names — `'fadeIn'`, `'slideUp'`.
+ *  Falls open to `string` when the registry isn't augmented (this package's
+ *  own compilation), so a `motion()` prop still typechecks in isolation. */
+type MotionName = [keyof RegisteredMotion] extends [never] ? string : keyof RegisteredMotion & string;
 /** Bare asset-group slugs — `'icons'`, `'fonts'`. */
 type AssetGroupName = [keyof RegisteredAssetGroups] extends [never] ? string : keyof RegisteredAssetGroups & string;
 /**
@@ -178,4 +182,4 @@ declare function isComponentRef(value: unknown): value is ComponentRef;
 declare function isAssetGroupRef(value: unknown): value is AssetGroupRef;
 declare function isAssetRef(value: unknown): value is AssetRef;
 //#endregion
-export { AnyRef, AssetGroupName, AssetGroupRef, AssetName, AssetRef, ComponentName, ComponentRef, CompositeName, CompositeRef, CompositeRefBuilder, ModeName, ModeRef, RegisteredAssetGroups, RegisteredComponents, RegisteredCompositeStyles, RegisteredModes, RegisteredModifiers, RegisteredMotionDefs, RegisteredStyleProps, RegisteredTokenGroups, StylePropName, StylePropRef, TagName, TagRef, TokenGroupName, TokenGroupRef, TokenName, TokenQualifiedName, TokenRawNameRegistry, TokenRef, asset, assetGroup, component, composite, isAssetGroupRef, isAssetRef, isComponentRef, isCompositeRef, isModeRef, isStylePropRef, isTagRef, isTokenGroupRef, isTokenRef, mode, styleProp, tag, token, tokenGroup };
+export { AnyRef, AssetGroupName, AssetGroupRef, AssetName, AssetRef, ComponentName, ComponentRef, CompositeName, CompositeRef, CompositeRefBuilder, ModeName, ModeRef, MotionName, RegisteredAssetGroups, RegisteredComponents, RegisteredCompositeStyles, RegisteredModes, RegisteredModifiers, RegisteredMotion, RegisteredStyleProps, RegisteredTokenGroups, StylePropName, StylePropRef, TagName, TagRef, TokenGroupName, TokenGroupRef, TokenName, TokenQualifiedName, TokenRawNameRegistry, TokenRef, asset, assetGroup, component, composite, isAssetGroupRef, isAssetRef, isComponentRef, isCompositeRef, isModeRef, isStylePropRef, isTagRef, isTokenGroupRef, isTokenRef, mode, styleProp, tag, token, tokenGroup };