motion-v 2.0.0-beta.1 → 2.0.0-beta.2

package/dist/es/components/reorder/index.d.ts

@@ -35,6 +35,7 @@ export declare const ReorderGroup: <T, K, V>(__VLS_props: NonNullable<Awaited<ty
             [k: string]: import('../..').VariantType | ((custom: K) => import('../..').VariantType);
         };
         custom?: K;
+        initial?: import('motion-dom').VariantLabels | import('../..').VariantType | boolean;
         style?: Partial<{
             [x: `--${string}`]: string | number | import('motion-dom').MotionValue<any>;
             string?: string | number | import('motion-dom').MotionValue<any>;
@@ -731,7 +732,6 @@ export declare const ReorderGroup: <T, K, V>(__VLS_props: NonNullable<Awaited<ty
         inView?: import('motion-dom').VariantLabels | import('../..').VariantType;
         onHoverStart?: import('../../features/gestures/hover/types').HoverEvent;
         onHoverEnd?: import('../../features/gestures/hover/types').HoverEvent;
-        initial?: import('motion-dom').VariantLabels | import('../..').VariantType | boolean;
         exit?: import('motion-dom').VariantLabels | import('../..').VariantType;
         onPress?: import('../../features/gestures/press/types').PressEvent;
         onPressCancel?: import('../../features/gestures/press/types').PressEvent;
@@ -820,6 +820,7 @@ export declare const ReorderItem: <T extends import('../..').ElementType = "li",
             [k: string]: import('../..').VariantType | ((custom: unknown) => import('../..').VariantType);
         };
         custom?: unknown;
+        initial?: import('motion-dom').VariantLabels | import('../..').VariantType | boolean;
         style?: Partial<{
             [x: `--${string}`]: string | number | import('motion-dom').MotionValue<any>;
             string?: string | number | import('motion-dom').MotionValue<any>;
@@ -1516,7 +1517,6 @@ export declare const ReorderItem: <T extends import('../..').ElementType = "li",
         inView?: import('motion-dom').VariantLabels | import('../..').VariantType;
         onHoverStart?: import('../../features/gestures/hover/types').HoverEvent;
         onHoverEnd?: import('../../features/gestures/hover/types').HoverEvent;
-        initial?: import('motion-dom').VariantLabels | import('../..').VariantType | boolean;
         exit?: import('motion-dom').VariantLabels | import('../..').VariantType;
         onPress?: import('../../features/gestures/press/types').PressEvent;
         onPressCancel?: import('../../features/gestures/press/types').PressEvent;
@@ -1608,6 +1608,7 @@ export declare const Reorder: {
                 [k: string]: import('../..').VariantType | ((custom: K) => import('../..').VariantType);
             };
             custom?: K;
+            initial?: import('motion-dom').VariantLabels | import('../..').VariantType | boolean;
             style?: Partial<{
                 [x: `--${string}`]: string | number | import('motion-dom').MotionValue<any>;
                 string?: string | number | import('motion-dom').MotionValue<any>;
@@ -2304,7 +2305,6 @@ export declare const Reorder: {
             inView?: import('motion-dom').VariantLabels | import('../..').VariantType;
             onHoverStart?: import('../../features/gestures/hover/types').HoverEvent;
             onHoverEnd?: import('../../features/gestures/hover/types').HoverEvent;
-            initial?: import('motion-dom').VariantLabels | import('../..').VariantType | boolean;
             exit?: import('motion-dom').VariantLabels | import('../..').VariantType;
             onPress?: import('../../features/gestures/press/types').PressEvent;
             onPressCancel?: import('../../features/gestures/press/types').PressEvent;
@@ -2393,6 +2393,7 @@ export declare const Reorder: {
                 [k: string]: import('../..').VariantType | ((custom: unknown) => import('../..').VariantType);
             };
             custom?: unknown;
+            initial?: import('motion-dom').VariantLabels | import('../..').VariantType | boolean;
             style?: Partial<{
                 [x: `--${string}`]: string | number | import('motion-dom').MotionValue<any>;
                 string?: string | number | import('motion-dom').MotionValue<any>;
@@ -3089,7 +3090,6 @@ export declare const Reorder: {
             inView?: import('motion-dom').VariantLabels | import('../..').VariantType;
             onHoverStart?: import('../../features/gestures/hover/types').HoverEvent;
             onHoverEnd?: import('../../features/gestures/hover/types').HoverEvent;
-            initial?: import('motion-dom').VariantLabels | import('../..').VariantType | boolean;
             exit?: import('motion-dom').VariantLabels | import('../..').VariantType;
             onPress?: import('../../features/gestures/press/types').PressEvent;
             onPressCancel?: import('../../features/gestures/press/types').PressEvent;

package/dist/es/directive/index.mjs

@@ -4,7 +4,7 @@ import { defaultConfig, motionConfigInjectionKey } from "../components/motion-co
 import { animatePresenceInjectionKey } from "../components/animate-presence/presence.mjs";
 import { createSVGStyles, createStyles } from "../state/style.mjs";
 import { updateLazyFeatures } from "../features/lazy-features.mjs";
-import { isSVGElement } from "../state/utils.mjs";
+import { isSVGElement, resolveInitialValues } from "../state/utils.mjs";
 import { MotionState, mountedStates } from "../state/motion-state.mjs";
 import { createVisualElement } from "../state/create-visual-element.mjs";
 import { domMax } from "../features/dom-max.mjs";
@@ -47,9 +47,9 @@ function computeStyles(values, tag, styleProp) {
 }
 function resolveSSRStyles(options) {
 	if (!options) return null;
-	const state = new MotionState(options);
-	if (Object.keys(state.latestValues).length === 0) return null;
-	return computeStyles(state.latestValues, options.as || "div", options.style).styles;
+	const latestValues = resolveInitialValues(options);
+	if (Object.keys(latestValues).length === 0) return null;
+	return computeStyles(latestValues, options.as || "div", options.style).styles;
 }
 function applyInitialStyles(el, state) {
 	const { styles, attrs } = computeStyles(state.latestValues, resolveTag(el), state.options.style);
@@ -134,7 +134,6 @@ function createMotionDirective(featureBundle, defaultOptions) {
 		updated(el, binding, vnode) {
 			const state = mountedStates.get(el);
 			if (!state) return;
-			cleanVNodeProps(el, vnode.props);
 			const provides = resolveProvides(vnode, binding);
 			const { options } = buildMotionOptions(mergeMotionProps(vnode, binding.value), provides, resolveTag(el));
 			state.update(options);

package/dist/es/state/motion-state.d.ts

@@ -24,7 +24,6 @@ export declare class MotionState {
     constructor(options: Options, parent?: MotionState);
     private _context;
     get context(): MotionStateContext;
-    private resolveInitialLatestValues;
     /**
      * Initialize features from options and global lazy features
      * Features are stored by key to avoid duplicate instantiation

package/dist/es/state/motion-state.mjs

@@ -1,5 +1,5 @@
 import { lazyFeatures } from "../features/lazy-features.mjs";
-import { isSVGElement, resolveVariant as resolveVariant$1 } from "./utils.mjs";
+import { isSVGElement, resolveInitialValues } from "./utils.mjs";
 import { motionGlobalConfig } from "../config.mjs";
 import { frame, isVariantLabel } from "motion-dom";
 import { invariant } from "hey-listen";
@@ -15,8 +15,7 @@ var MotionState = class {
 		this.options = options;
 		this.parent = parent;
 		parent?.children?.add(this);
-		const initialVariantSource = (options.initial === void 0 && options.variants ? this.context.initial : options.initial) === false ? ["initial", "animate"] : ["initial"];
-		this.resolveInitialLatestValues(initialVariantSource);
+		this.latestValues = resolveInitialValues(options, this.context);
 		this.type = isSVGElement(this.options.as) ? "svg" : "html";
 	}
 	get context() {
@@ -27,15 +26,6 @@ var MotionState = class {
 		} });
 		return this._context;
 	}
-	resolveInitialLatestValues(initialVariantSource) {
-		const custom = this.options.custom ?? this.options.presenceContext?.custom;
-		this.latestValues = initialVariantSource.reduce((acc, variant) => {
-			return {
-				...acc,
-				...resolveVariant$1(this.options[variant] || this.context[variant], this.options.variants, custom)
-			};
-		}, {});
-	}
 	updateFeatures() {
 		if (!this.visualElement) return;
 		for (const FeatureCtor of lazyFeatures) {

package/dist/es/state/utils.d.ts

@@ -1,5 +1,13 @@
-import { AsTag, Options, VariantType } from '../types';
+import { AsTag, MotionStateContext, Options, VariantType } from '../types';
 export declare function resolveVariant(definition?: Options['animate'], variants?: Options['variants'], custom?: Options['custom']): VariantType | undefined;
+/**
+ * Resolve initial latest values from variant sources.
+ * Shared by MotionState constructor and SSR style resolution.
+ *
+ * @param options - Motion options
+ * @param context - Optional parent context for variant inheritance (MotionState passes this)
+ */
+export declare function resolveInitialValues(options: Options, context?: MotionStateContext): Record<string, any>;
 export declare function shallowCompare(next: any[], prev: any[]): boolean;
 export declare function isCssVar(name: string): boolean;
 export declare const svgElements: readonly ["animate", "circle", "defs", "desc", "ellipse", "g", "image", "line", "filter", "marker", "mask", "metadata", "path", "pattern", "polygon", "polyline", "rect", "stop", "svg", "switch", "symbol", "text", "tspan", "use", "view", "clipPath", "feBlend", "feColorMatrix", "feComponentTransfer", "feComposite", "feConvolveMatrix", "feDiffuseLighting", "feDisplacementMap", "feDistantLight", "feDropShadow", "feFlood", "feFuncA", "feFuncB", "feFuncG", "feFuncR", "feGaussianBlur", "feImage", "feMerge", "feMergeNode", "feMorphology", "feOffset", "fePointLight", "feSpecularLighting", "feSpotLight", "feTile", "feTurbulence", "foreignObject", "linearGradient", "radialGradient", "textPath"];

package/dist/es/state/utils.mjs

@@ -21,6 +21,16 @@ function resolveVariant(definition, variants, custom) {
 		...transitionEnd
 	};
 }
+function resolveInitialValues(options, context) {
+	const sources = (options.initial === void 0 && options.variants ? context?.initial : options.initial) === false ? ["initial", "animate"] : ["initial"];
+	const custom = options.custom ?? options.presenceContext?.custom;
+	return sources.reduce((acc, variant) => {
+		return {
+			...acc,
+			...resolveVariant(options[variant] || context?.[variant], options.variants, custom)
+		};
+	}, {});
+}
 function shallowCompare(next, prev) {
 	const prevLength = prev?.length;
 	if (prevLength !== next.length) return false;
@@ -87,4 +97,4 @@ var svgElementSet = new Set([
 function isSVGElement(as) {
 	return svgElementSet.has(as);
 }
-export { isSVGElement, resolveVariant, shallowCompare };
+export { isSVGElement, resolveInitialValues, shallowCompare };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "motion-v",
   "type": "module",
-  "version": "2.0.0-beta.1",
+  "version": "2.0.0-beta.2",
   "description": "",
   "author": "",
   "license": "MIT",