@yahoo/uds-v5-wip 0.0.1

package/dist/loader/dist/loader/motion-transform.js

@@ -0,0 +1,717 @@
+import * as t from "@babel/types";
+//#region ../loader/dist/loader/motion-transform.js
+function isRecord(value) {
+	return typeof value === "object" && value !== null;
+}
+function isIntrinsicJsxTagName(name) {
+	return /^[a-z]/.test(name);
+}
+function getCustomSlotMotion(manifest, slotInfo) {
+	const component = manifest?.components[slotInfo.componentName];
+	if (!component || component.type !== "custom") return null;
+	const slotMotion = component.motion?.[slotInfo.slotName];
+	if (!isRecord(slotMotion)) return null;
+	if (slotMotion.runtime === "css") return null;
+	return slotMotion;
+}
+function hasAnimatePresenceAncestor(nodePath) {
+	let current = nodePath.parentPath;
+	while (current) {
+		if (current.node?.type === "JSXElement" && current.node.openingElement?.name?.type === "JSXIdentifier" && current.node.openingElement.name.name === "AnimatePresence") return true;
+		current = current.parentPath;
+	}
+	return false;
+}
+/**
+* Ensure the motion element has a `key` attribute.
+* AnimatePresence requires a `key` on its direct children to track exit animations.
+* If no `key` exists, inject `key="exit-motion"` as a stable identifier.
+*/
+function ensureKeyOnMotionElement(openingElementPath) {
+	const attributes = openingElementPath.node.attributes;
+	if (!attributes.some((attr) => attr.type === "JSXAttribute" && attr.name?.type === "JSXIdentifier" && attr.name.name === "key")) attributes.unshift(t.jsxAttribute(t.jsxIdentifier("key"), t.stringLiteral("exit-motion")));
+}
+/**
+* Build an `<AnimatePresence initial={false}>{expression}</AnimatePresence>` JSX wrapper.
+*/
+function buildAnimatePresenceJsxWrapper(expression) {
+	return t.jsxElement(t.jsxOpeningElement(t.jsxIdentifier("AnimatePresence"), [t.jsxAttribute(t.jsxIdentifier("initial"), t.jsxExpressionContainer(t.booleanLiteral(false)))], false), t.jsxClosingElement(t.jsxIdentifier("AnimatePresence")), [t.jsxExpressionContainer(expression)], false);
+}
+/**
+* Check if a node path is a direct argument of a CallExpression
+* (e.g. the first arg of `createPortal(expr, container)`).
+*/
+function isCallExpressionArg(nodePath) {
+	const parent = nodePath.parentPath;
+	if (!parent || parent.node?.type !== "CallExpression") return false;
+	return parent.node.arguments.includes(nodePath.node);
+}
+/**
+* Auto-wrap a conditionally rendered motion element with `<AnimatePresence initial={false}>`.
+*
+* Detects three patterns from the JSXElement parent of the opening element:
+* - `{condition && <motion.div ...>}` (LogicalExpression with &&)
+* - `{condition ? <motion.div ...> : null}` (ConditionalExpression with null/false alternate)
+* - `{items.map(cb => <motion.div ...>)}` (CallExpression with .map())
+*
+* Also ensures the motion element has a `key` attribute, which AnimatePresence
+* requires to track children for exit animations.
+*
+* Returns true if wrapping was applied.
+*/
+function wrapParentConditionalWithAnimatePresence(nodePath) {
+	const jsxElementPath = nodePath.parentPath;
+	if (!jsxElementPath || jsxElementPath.node?.type !== "JSXElement") return false;
+	if (hasAnimatePresenceAncestor(jsxElementPath)) return false;
+	const parentPath = jsxElementPath.parentPath;
+	if (!parentPath) return false;
+	const parentNode = parentPath.node;
+	let expressionContainerPath = null;
+	if (parentNode?.type === "LogicalExpression" && parentNode.operator === "&&" && parentNode.right === jsxElementPath.node) expressionContainerPath = parentPath.parentPath;
+	if (parentNode?.type === "ConditionalExpression" && parentNode.consequent === jsxElementPath.node) {
+		const alternate = parentNode.alternate;
+		if (alternate?.type === "NullLiteral" || alternate?.type === "BooleanLiteral" && alternate.value === false || alternate?.type === "Identifier" && alternate.name === "null") expressionContainerPath = parentPath.parentPath;
+	}
+	if (!expressionContainerPath) expressionContainerPath = findMapExpressionContainer(jsxElementPath);
+	ensureKeyOnMotionElement(nodePath);
+	if (expressionContainerPath?.node?.type === "JSXExpressionContainer") {
+		const originalExpression = expressionContainerPath.node.expression;
+		expressionContainerPath.replaceWith(buildAnimatePresenceJsxWrapper(originalExpression));
+		return true;
+	}
+	if (parentPath && isCallExpressionArg(parentPath)) {
+		const originalExpression = t.cloneNode(parentPath.node, true);
+		parentPath.replaceWith(buildAnimatePresenceJsxWrapper(originalExpression));
+		return true;
+	}
+	return false;
+}
+/**
+* Find the JSXExpressionContainer ancestor of a `.map()` call that returns
+* the given JSX element.
+*
+* Walks up from the JSXElement through:
+*   JSXElement → (optional ParenthesizedExpression) → ArrowFunctionExpression body
+*   OR JSXElement → ReturnStatement → BlockStatement → ArrowFunctionExpression/FunctionExpression
+*   → CallExpression(.map) argument → CallExpression → JSXExpressionContainer
+*/
+function findMapExpressionContainer(jsxElementPath) {
+	let current = jsxElementPath;
+	while (current.parentPath?.node?.type === "ParenthesizedExpression") current = current.parentPath;
+	let callbackPath = current.parentPath;
+	if (callbackPath?.node?.type === "ArrowFunctionExpression" && callbackPath.node.body === current.node) {} else {
+		if (current.parentPath?.node?.type !== "ReturnStatement") return null;
+		const blockPath = current.parentPath.parentPath;
+		if (blockPath?.node?.type !== "BlockStatement") return null;
+		callbackPath = blockPath.parentPath;
+		if (callbackPath?.node?.type !== "ArrowFunctionExpression" && callbackPath?.node?.type !== "FunctionExpression") return null;
+	}
+	const callExprPath = callbackPath.parentPath;
+	if (callExprPath?.node?.type !== "CallExpression") return null;
+	const callee = callExprPath.node.callee;
+	if (callee?.type !== "MemberExpression" || callee.property?.type !== "Identifier" || callee.property.name !== "map") return null;
+	const containerPath = callExprPath.parentPath;
+	if (containerPath?.node?.type === "JSXExpressionContainer") return containerPath;
+	return null;
+}
+/**
+* Convert a jsxs callee to its jsx (single-child) equivalent.
+* e.g. identifier `jsxs` → `jsx`, member `_runtime.jsxs` → `_runtime.jsx`
+*/
+function toSingleChildJsxCallee(callee) {
+	const cloned = t.cloneNode(callee, true);
+	if (t.isIdentifier(cloned) && cloned.name.endsWith("s")) {
+		cloned.name = cloned.name.slice(0, -1);
+		return cloned;
+	}
+	if ((t.isMemberExpression(cloned) || t.isOptionalMemberExpression(cloned)) && t.isIdentifier(cloned.property) && cloned.property.name.endsWith("s")) {
+		cloned.property = t.identifier(cloned.property.name.slice(0, -1));
+		return cloned;
+	}
+	return cloned;
+}
+/**
+* Auto-wrap a compiled JSX call expression that has exit motion with AnimatePresence.
+*
+* Detects three patterns:
+* - `condition && _jsx(motion.div, ...)` (LogicalExpression with &&)
+* - `condition ? _jsx(motion.div, ...) : null` (ConditionalExpression with null/false)
+* - `items.map(cb => _jsx(motion.div, ...))` (CallExpression with .map())
+*
+* Wraps the expression with: `_jsx(AnimatePresence, { initial: false, children: ... })`
+*/
+function wrapCompiledConditionalWithAnimatePresence(nodePath, jsxCallee) {
+	const parentPath = nodePath.parentPath;
+	if (!parentPath) return false;
+	const parentNode = parentPath.node;
+	let targetPath = null;
+	if (parentNode?.type === "LogicalExpression" && parentNode.operator === "&&" && parentNode.right === nodePath.node) targetPath = parentPath;
+	if (parentNode?.type === "ConditionalExpression" && parentNode.consequent === nodePath.node) {
+		const alternate = parentNode.alternate;
+		if (alternate?.type === "NullLiteral" || alternate?.type === "BooleanLiteral" && alternate.value === false || alternate?.type === "Identifier" && alternate.name === "null") targetPath = parentPath;
+	}
+	if (!targetPath) targetPath = findCompiledMapCallExpression(nodePath);
+	if (!targetPath) return false;
+	const singleChildCallee = toSingleChildJsxCallee(jsxCallee);
+	const originalExpression = t.cloneNode(targetPath.node, true);
+	const animatePresenceCall = t.callExpression(singleChildCallee, [t.identifier("AnimatePresence"), t.objectExpression([t.objectProperty(t.identifier("initial"), t.booleanLiteral(false)), t.objectProperty(t.identifier("children"), originalExpression)])]);
+	targetPath.replaceWith(animatePresenceCall);
+	return true;
+}
+/**
+* Find the .map() CallExpression ancestor of a compiled JSX call.
+*
+* Walks up from _jsx(motion.div, ...) through:
+*   CallExpression → ArrowFunctionExpression body (or ReturnStatement → BlockStatement → fn)
+*   → CallExpression(.map) argument → CallExpression(.map)
+*/
+function findCompiledMapCallExpression(nodePath) {
+	let callbackPath = nodePath.parentPath;
+	if (callbackPath?.node?.type === "ArrowFunctionExpression" && callbackPath.node.body === nodePath.node) {} else {
+		if (nodePath.parentPath?.node?.type !== "ReturnStatement") return null;
+		const blockPath = nodePath.parentPath.parentPath;
+		if (blockPath?.node?.type !== "BlockStatement") return null;
+		callbackPath = blockPath.parentPath;
+		if (callbackPath?.node?.type !== "ArrowFunctionExpression" && callbackPath?.node?.type !== "FunctionExpression") return null;
+	}
+	const mapCallPath = callbackPath.parentPath;
+	if (mapCallPath?.node?.type !== "CallExpression") return null;
+	const callee = mapCallPath.node.callee;
+	if (callee?.type !== "MemberExpression" || callee.property?.type !== "Identifier" || callee.property.name !== "map") return null;
+	return mapCallPath;
+}
+/**
+* Check if a custom component in the manifest has any slot with exit motion.
+*/
+function componentHasExitMotion(manifest, componentName) {
+	const component = manifest?.components[componentName];
+	if (!component || !component.motion) return false;
+	for (const slotMotion of Object.values(component.motion)) if (isRecord(slotMotion) && slotMotion.exit !== void 0) return true;
+	return false;
+}
+/**
+* Auto-wrap a custom component with exit motion in AnimatePresence when used
+* inside a conditional or .map() pattern.
+*
+* Unlike `wrapParentConditionalWithAnimatePresence` (which works on slot elements
+* inside createComponent), this works on custom component JSX usage sites
+* (e.g. `<Toast>` inside a createProvider or any other context).
+*
+* Returns true if wrapping was applied.
+*/
+function wrapCustomComponentWithAnimatePresence(nodePath) {
+	const jsxElementPath = nodePath.parentPath;
+	if (!jsxElementPath || jsxElementPath.node?.type !== "JSXElement") return false;
+	if (hasAnimatePresenceAncestor(jsxElementPath)) return false;
+	const parentPath = jsxElementPath.parentPath;
+	if (!parentPath) return false;
+	const parentNode = parentPath.node;
+	let expressionContainerPath = null;
+	if (parentNode?.type === "LogicalExpression" && parentNode.operator === "&&" && parentNode.right === jsxElementPath.node) expressionContainerPath = parentPath.parentPath;
+	if (parentNode?.type === "ConditionalExpression" && parentNode.consequent === jsxElementPath.node) {
+		const alternate = parentNode.alternate;
+		if (alternate?.type === "NullLiteral" || alternate?.type === "BooleanLiteral" && alternate.value === false || alternate?.type === "Identifier" && alternate.name === "null") expressionContainerPath = parentPath.parentPath;
+	}
+	if (!expressionContainerPath) expressionContainerPath = findMapExpressionContainer(jsxElementPath);
+	if (expressionContainerPath?.node?.type === "JSXExpressionContainer") {
+		const originalExpression = expressionContainerPath.node.expression;
+		expressionContainerPath.replaceWith(buildAnimatePresenceJsxWrapper(originalExpression));
+		return true;
+	}
+	if (parentPath && isCallExpressionArg(parentPath)) {
+		const originalExpression = t.cloneNode(parentPath.node, true);
+		parentPath.replaceWith(buildAnimatePresenceJsxWrapper(originalExpression));
+		return true;
+	}
+	return false;
+}
+function ensureMotionWrappedJsxElement(nodePath) {
+	const nameNode = nodePath.node.name;
+	if (nameNode.type !== "JSXIdentifier") return false;
+	if (!isIntrinsicJsxTagName(nameNode.name)) return false;
+	const intrinsicTagName = nameNode.name;
+	nodePath.node.name = t.jsxMemberExpression(t.jsxIdentifier("motion"), t.jsxIdentifier(intrinsicTagName));
+	const parent = nodePath.parent;
+	if (parent.type === "JSXElement" && parent.closingElement) {
+		if (parent.closingElement.name.type === "JSXIdentifier") parent.closingElement.name = t.jsxMemberExpression(t.jsxIdentifier("motion"), t.jsxIdentifier(intrinsicTagName));
+	}
+	return true;
+}
+function setJsxAttributeIfMissing(nodePath, key, value) {
+	if (value === void 0) return false;
+	if (nodePath.node.attributes.some((attr) => attr.type === "JSXAttribute" && attr.name?.type === "JSXIdentifier" && attr.name.name === key)) return false;
+	nodePath.node.attributes.push(t.jsxAttribute(t.jsxIdentifier(key), t.jsxExpressionContainer(t.valueToNode(value))));
+	return true;
+}
+/**
+* Check if a value is an InterpolateMarker object.
+*/
+function isInterpolateMarker(value) {
+	return typeof value === "object" && value !== null && value.__type === "interpolate";
+}
+/**
+* Check if a state map contains any InterpolateMarker values.
+*/
+function hasInterpolateMarkers(stateMap) {
+	for (const stateKeyframe of Object.values(stateMap)) {
+		if (!stateKeyframe || typeof stateKeyframe !== "object") continue;
+		for (const value of Object.values(stateKeyframe)) if (isInterpolateMarker(value)) return true;
+	}
+	return false;
+}
+/**
+* Extract data-attribute conditional keyframes from inside `slotMotion.animate`.
+* Looks for any key matching `data-*` (e.g. `'data-state'`, `'data-side'`).
+* Returns `{ attr, stateMap }` for the first match, or null if none found.
+*/
+function extractDataAttrModifiers(slotMotion) {
+	const animate = slotMotion.animate;
+	if (!animate || typeof animate !== "object") return null;
+	for (const [key, value] of Object.entries(animate)) if (key.startsWith("data-") && value && typeof value === "object") return {
+		attr: key,
+		stateMap: value
+	};
+	return null;
+}
+/**
+* Get the base animate object with all `data-*` keys removed.
+*/
+function getBaseAnimate(animate) {
+	if (!animate || typeof animate !== "object") return {};
+	const base = {};
+	for (const [key, value] of Object.entries(animate)) if (!key.startsWith("data-")) base[key] = value;
+	return base;
+}
+/**
+* Track hoisted motion states constants to be injected at module scope.
+* Each entry maps a unique variable name to its states config object.
+*/
+const hoistedMotionStates = /* @__PURE__ */ new Map();
+/**
+* Get the hoisted motion states map for injection into the AST.
+* Called by the loader after traversal to inject const declarations.
+*/
+function getHoistedMotionStates() {
+	return hoistedMotionStates;
+}
+/**
+* Clear hoisted motion states (call at start of each file transform).
+*/
+function clearHoistedMotionStates() {
+	hoistedMotionStates.clear();
+}
+let motionStatesCounter = 0;
+/**
+* Build an animate expression that wraps state keyframes with resolveMotionState.
+*
+* For a ternary data-state={expanded ? 'expanded' : 'collapsed'} with interpolate markers:
+*   animate={__rms(expanded ? __states.expanded : __states.collapsed, index)}
+*
+* Without interpolate markers (plain keyframes), produces direct keyframe objects:
+*   animate={expanded ? { rotate: 180 } : { rotate: 0 }}
+*/
+function buildInterpolateAnimateExpr(stateExpr, _stateMap, stateValues, statesVarName, indexExpr, _baseAnimate) {
+	let stateKeyframeExpr;
+	if (stateExpr.type === "ConditionalExpression" && stateExpr.consequent.type === "StringLiteral" && stateExpr.alternate.type === "StringLiteral" && stateValues.length === 2) stateKeyframeExpr = t.conditionalExpression(stateExpr.test, t.memberExpression(t.identifier(statesVarName), t.identifier(stateExpr.consequent.value)), t.memberExpression(t.identifier(statesVarName), t.identifier(stateExpr.alternate.value)));
+	else if (stateExpr.type === "StringLiteral") stateKeyframeExpr = t.memberExpression(t.identifier(statesVarName), t.identifier(stateExpr.value));
+	else {
+		let result = t.memberExpression(t.identifier(statesVarName), t.identifier(stateValues[0]));
+		for (const sv of [...stateValues].reverse()) result = t.conditionalExpression(t.binaryExpression("===", stateExpr, t.stringLiteral(sv)), t.memberExpression(t.identifier(statesVarName), t.identifier(sv)), result);
+		stateKeyframeExpr = result;
+	}
+	return t.callExpression(t.identifier("__rms"), [stateKeyframeExpr, indexExpr]);
+}
+/**
+* Transform data-attribute modifiers on a slot element.
+*
+* When the motion config has:
+*   `animate: { 'data-state': { open: { rotate: 180 }, closed: { rotate: 0 } } }`
+* and the element has `data-state={isOpen ? 'open' : 'closed'}`, the loader:
+* 1. Keeps the data attribute (still needed for CSS modifiers)
+* 2. Extracts the condition from the ternary expression
+* 3. Generates: `animate={isOpen ? { rotate: 180 } : { rotate: 0 }}`
+* 4. Sets `initial={false}` to prevent animation on first render
+*
+* When state keyframes contain InterpolateMarker objects, the loader:
+* 1. Finds `data-motion-index` on the element for the index expression
+* 2. Hoists state keyframes as a module-scope constant
+* 3. Generates: `animate={__rms(stateKeyframe, index)}`
+* 4. Removes `data-motion-index` from DOM attributes
+* 5. Adds `@uds/core` import for `resolveMotionState`
+*
+* Returns `{ applied, needsResolveMotionStateImport }`.
+*/
+function transformDataModifiers(nodePath, slotMotion) {
+	const dataAttrInfo = extractDataAttrModifiers(slotMotion);
+	if (!dataAttrInfo) return {
+		applied: false,
+		needsResolveMotionStateImport: false
+	};
+	const { attr: dataAttrName, stateMap } = dataAttrInfo;
+	const stateValues = Object.keys(stateMap);
+	if (stateValues.length === 0) return {
+		applied: false,
+		needsResolveMotionStateImport: false
+	};
+	const attributes = nodePath.node.attributes;
+	const attrIndex = attributes.findIndex((a) => a.type === "JSXAttribute" && a.name?.type === "JSXIdentifier" && a.name.name === dataAttrName);
+	if (attrIndex === -1) return {
+		applied: false,
+		needsResolveMotionStateImport: false
+	};
+	const attr = attributes[attrIndex];
+	if (attr.type !== "JSXAttribute") return {
+		applied: false,
+		needsResolveMotionStateImport: false
+	};
+	const needsInterpolation = hasInterpolateMarkers(stateMap);
+	let animateExpr = null;
+	let needsResolveMotionStateImport = false;
+	const baseAnimate = getBaseAnimate(slotMotion.animate);
+	let stateExpr = null;
+	if (attr.value?.type === "JSXExpressionContainer" && attr.value.expression.type !== "JSXEmptyExpression") stateExpr = attr.value.expression;
+	else if (attr.value?.type === "StringLiteral") stateExpr = t.stringLiteral(attr.value.value);
+	if (!stateExpr) return {
+		applied: false,
+		needsResolveMotionStateImport: false
+	};
+	if (needsInterpolation) {
+		const indexAttrIndex = attributes.findIndex((a) => a.type === "JSXAttribute" && a.name?.type === "JSXIdentifier" && a.name.name === "data-motion-index");
+		if (indexAttrIndex === -1) return {
+			applied: false,
+			needsResolveMotionStateImport: false
+		};
+		const indexAttr = attributes[indexAttrIndex];
+		let indexExpr = null;
+		if (indexAttr.value?.type === "JSXExpressionContainer" && indexAttr.value.expression.type !== "JSXEmptyExpression") indexExpr = indexAttr.value.expression;
+		else if (indexAttr.value?.type === "StringLiteral") indexExpr = t.numericLiteral(Number.parseInt(indexAttr.value.value, 10));
+		if (!indexExpr) return {
+			applied: false,
+			needsResolveMotionStateImport: false
+		};
+		const statesVarName = `__motion_states_${motionStatesCounter++}`;
+		hoistedMotionStates.set(statesVarName, stateMap);
+		animateExpr = buildInterpolateAnimateExpr(stateExpr, stateMap, stateValues, statesVarName, indexExpr, baseAnimate);
+		needsResolveMotionStateImport = true;
+		attributes.splice(indexAttrIndex, 1);
+	} else {
+		if (stateExpr.type === "StringLiteral") {
+			const staticValue = stateExpr.value;
+			animateExpr = stateMap[staticValue] ? t.valueToNode(stateMap[staticValue]) : t.valueToNode(baseAnimate);
+		} else if (stateExpr.type === "ConditionalExpression" && stateValues.length === 2) {
+			const { test, consequent, alternate } = stateExpr;
+			const consequentValue = consequent.type === "StringLiteral" ? consequent.value : null;
+			const alternateValue = alternate.type === "StringLiteral" ? alternate.value : null;
+			if (consequentValue && alternateValue && stateMap[consequentValue] !== void 0 && stateMap[alternateValue] !== void 0) animateExpr = t.conditionalExpression(test, t.valueToNode(stateMap[consequentValue]), t.valueToNode(stateMap[alternateValue]));
+		}
+		if (!animateExpr) {
+			let result = t.valueToNode(baseAnimate);
+			for (const stateValue of [...stateValues].reverse()) result = t.conditionalExpression(t.binaryExpression("===", stateExpr, t.stringLiteral(stateValue)), t.valueToNode(stateMap[stateValue]), result);
+			animateExpr = result;
+		}
+	}
+	if (!animateExpr) return {
+		applied: false,
+		needsResolveMotionStateImport: false
+	};
+	const existingAnimateIndex = attributes.findIndex((a) => a.type === "JSXAttribute" && a.name?.type === "JSXIdentifier" && a.name.name === "animate");
+	const animateAttr = t.jsxAttribute(t.jsxIdentifier("animate"), t.jsxExpressionContainer(animateExpr));
+	if (existingAnimateIndex !== -1) attributes[existingAnimateIndex] = animateAttr;
+	else attributes.push(animateAttr);
+	const existingInitialIndex = attributes.findIndex((a) => a.type === "JSXAttribute" && a.name?.type === "JSXIdentifier" && a.name.name === "initial");
+	const initialValue = slotMotion.initial ? t.valueToNode(slotMotion.initial) : t.booleanLiteral(false);
+	const initialAttr = t.jsxAttribute(t.jsxIdentifier("initial"), t.jsxExpressionContainer(initialValue));
+	if (existingInitialIndex !== -1) attributes[existingInitialIndex] = initialAttr;
+	else attributes.push(initialAttr);
+	return {
+		applied: true,
+		needsResolveMotionStateImport
+	};
+}
+/**
+* Detect and transform a boolean-toggle `animate` attribute on a slot element.
+*
+* When a component author writes `animate={expression}` where the expression
+* is NOT an ObjectExpression (e.g. `animate={isOpen}`), and the slot motion
+* config has both `initial` and `animate`, the expression is treated as a
+* boolean toggle condition. The loader transforms it to:
+*
+*   initial={false}
+*   animate={expression ? configAnimate : configInitial}
+*
+* This lets the component author signal *when* to toggle between states,
+* while the config defines *what* those states are.
+*
+* Returns true if the toggle transform was applied.
+*/
+function transformToggleAnimate(nodePath, slotMotion) {
+	if (!slotMotion.initial || !slotMotion.animate) return false;
+	const animateAttrIndex = nodePath.node.attributes.findIndex((attr) => attr.type === "JSXAttribute" && attr.name?.type === "JSXIdentifier" && attr.name.name === "animate");
+	if (animateAttrIndex === -1) return false;
+	const animateAttr = nodePath.node.attributes[animateAttrIndex];
+	if (animateAttr.type !== "JSXAttribute") return false;
+	let conditionExpr = null;
+	if (animateAttr.value?.type === "JSXExpressionContainer" && animateAttr.value.expression.type !== "JSXEmptyExpression") {
+		const expr = animateAttr.value.expression;
+		if (expr.type === "ObjectExpression") return false;
+		conditionExpr = expr;
+	}
+	if (!conditionExpr) return false;
+	animateAttr.value = t.jsxExpressionContainer(t.conditionalExpression(conditionExpr, t.valueToNode(slotMotion.animate), t.valueToNode(slotMotion.initial)));
+	const initialAttrIndex = nodePath.node.attributes.findIndex((attr) => attr.type === "JSXAttribute" && attr.name?.type === "JSXIdentifier" && attr.name.name === "initial");
+	const initialFalseAttr = t.jsxAttribute(t.jsxIdentifier("initial"), t.jsxExpressionContainer(t.booleanLiteral(false)));
+	if (initialAttrIndex !== -1) nodePath.node.attributes[initialAttrIndex] = initialFalseAttr;
+	else nodePath.node.attributes.push(initialFalseAttr);
+	return true;
+}
+function applySlotMotionToElement(nodePath, slotMotion, options) {
+	if (!ensureMotionWrappedJsxElement(nodePath)) return {
+		transformed: false,
+		needsResolveMotionStateImport: false
+	};
+	if (options?.injectAttributes === false) return {
+		transformed: true,
+		needsResolveMotionStateImport: false
+	};
+	const dataModResult = transformDataModifiers(nodePath, slotMotion);
+	const hasDataModifier = dataModResult.applied;
+	const needsResolveMotionStateImport = dataModResult.needsResolveMotionStateImport;
+	const isToggle = !hasDataModifier && transformToggleAnimate(nodePath, slotMotion);
+	let transformed = hasDataModifier || isToggle;
+	if (!hasDataModifier && !isToggle) {
+		transformed = setJsxAttributeIfMissing(nodePath, "initial", slotMotion.initial) || transformed;
+		const baseAnimate = getBaseAnimate(slotMotion.animate);
+		transformed = setJsxAttributeIfMissing(nodePath, "animate", Object.keys(baseAnimate).length > 0 ? baseAnimate : slotMotion.animate) || transformed;
+	}
+	transformed = setJsxAttributeIfMissing(nodePath, "exit", slotMotion.exit) || transformed;
+	transformed = setJsxAttributeIfMissing(nodePath, "transition", slotMotion.transition) || transformed;
+	transformed = setJsxAttributeIfMissing(nodePath, "whileHover", slotMotion.whileHover) || transformed;
+	transformed = setJsxAttributeIfMissing(nodePath, "whileTap", slotMotion.whileTap) || transformed;
+	transformed = setJsxAttributeIfMissing(nodePath, "drag", slotMotion.drag) || transformed;
+	transformed = setJsxAttributeIfMissing(nodePath, "dragConstraints", slotMotion.dragConstraints) || transformed;
+	transformed = setJsxAttributeIfMissing(nodePath, "dragElastic", slotMotion.dragElastic) || transformed;
+	transformed = setJsxAttributeIfMissing(nodePath, "dragSnapToOrigin", slotMotion.dragSnapToOrigin) || transformed;
+	transformed = setJsxAttributeIfMissing(nodePath, "layout", slotMotion.layout) || transformed;
+	return {
+		transformed,
+		needsResolveMotionStateImport
+	};
+}
+/**
+* Handle motion transforms on a JSX opening element.
+* Returns true if the element was transformed.
+*/
+function handleMotionOnElement(nodePath, manifest, customComponents, primitiveComponents, importsToAdd) {
+	const nameNode = nodePath.node.name;
+	if (nameNode.type !== "JSXIdentifier") return false;
+	const componentName = nameNode.name;
+	const motionAttrIndex = nodePath.node.attributes.findIndex((attr) => attr.type === "JSXAttribute" && attr.name.name === "motion");
+	if (motionAttrIndex === -1) return false;
+	if (!manifest) return false;
+	if (primitiveComponents.has(componentName)) {
+		const motionAttr = nodePath.node.attributes[motionAttrIndex];
+		if (motionAttr.type !== "JSXAttribute") return false;
+		const valueNode = motionAttr.value;
+		if (!valueNode) return false;
+		let presetName = null;
+		if (valueNode.type === "StringLiteral") presetName = valueNode.value;
+		else if (valueNode.type === "JSXExpressionContainer" && valueNode.expression.type !== "JSXEmptyExpression") if (valueNode.expression.type === "StringLiteral") presetName = valueNode.expression.value;
+		else {
+			swapMotionComponent(nodePath, {
+				componentName: `${componentName}WithInlineMotion`,
+				importPath: `.uds/motion-components/${componentName}WithInlineMotion`
+			}, importsToAdd);
+			return true;
+		}
+		if (!presetName) return false;
+		const presetInfo = manifest.presets[presetName];
+		if (!presetInfo) return false;
+		nodePath.node.attributes.splice(motionAttrIndex, 1);
+		if (presetInfo.runtime === "css") injectMotionCssClass(nodePath, presetName);
+		else {
+			const compInfo = manifest.components[componentName]?.presets[presetName];
+			if (!compInfo) return false;
+			swapMotionComponent(nodePath, compInfo, importsToAdd);
+		}
+		return true;
+	}
+	if (customComponents?.has(componentName)) {
+		const motionAttr = nodePath.node.attributes[motionAttrIndex];
+		if (motionAttr.type !== "JSXAttribute") return false;
+		const valueNode = motionAttr.value;
+		if (!valueNode || valueNode.type !== "StringLiteral") return false;
+		const presetName = valueNode.value;
+		const presetInfo = manifest.presets[presetName];
+		if (!presetInfo) return false;
+		nodePath.node.attributes.splice(motionAttrIndex, 1);
+		if (presetInfo.runtime === "css") injectCustomComponentCssClass(nodePath, presetName);
+		return true;
+	}
+	return false;
+}
+/**
+* Inject a `motion-{presetName}` CSS class into the className of a JSX element.
+*/
+function injectMotionCssClass(nodePath, presetName) {
+	const classNameAttr = nodePath.node.attributes.find((attr) => attr.type === "JSXAttribute" && attr.name.name === "className");
+	if (classNameAttr && classNameAttr.type === "JSXAttribute") {
+		if (classNameAttr.value?.type === "StringLiteral") classNameAttr.value.value += ` motion-${presetName}`;
+		else if (classNameAttr.value?.type === "JSXExpressionContainer" && classNameAttr.value.expression.type !== "JSXEmptyExpression") {
+			const existingExpr = classNameAttr.value.expression;
+			classNameAttr.value = t.jsxExpressionContainer(t.templateLiteral([t.templateElement({
+				raw: "",
+				cooked: ""
+			}), t.templateElement({
+				raw: ` motion-${presetName}`,
+				cooked: ` motion-${presetName}`
+			}, true)], [existingExpr]));
+		}
+	} else nodePath.node.attributes.push(t.jsxAttribute(t.jsxIdentifier("className"), t.stringLiteral(`motion-${presetName}`)));
+}
+/**
+* Inject a `motion-{presetName}` class into a custom component's internal class prop.
+*/
+function injectCustomComponentCssClass(nodePath, presetName) {
+	const classNameAttr = nodePath.node.attributes.find((attr) => attr.type === "JSXAttribute" && attr.name.type === "JSXIdentifier" && attr.name.name === "data-uds-class");
+	if (classNameAttr) {
+		if (classNameAttr.value?.type === "StringLiteral") classNameAttr.value.value += ` motion-${presetName}`;
+		else if (classNameAttr.value?.type === "JSXExpressionContainer" && classNameAttr.value.expression.type !== "JSXEmptyExpression") {
+			const existingExpr = classNameAttr.value.expression;
+			classNameAttr.value = t.jsxExpressionContainer(t.templateLiteral([t.templateElement({
+				raw: "",
+				cooked: ""
+			}), t.templateElement({
+				raw: ` motion-${presetName}`,
+				cooked: ` motion-${presetName}`
+			}, true)], [existingExpr]));
+		}
+	} else nodePath.node.attributes.push(t.jsxAttribute(t.jsxIdentifier("data-uds-class"), t.stringLiteral(`motion-${presetName}`)));
+}
+/**
+* Swap a JSX component to a generated motion wrapper component (JS runtime).
+*/
+function swapMotionComponent(nodePath, compInfo, importsToAdd) {
+	const nameNode = nodePath.node.name;
+	nameNode.name = compInfo.componentName;
+	const parent = nodePath.parent;
+	if (parent.type === "JSXElement" && parent.closingElement) {
+		const closingName = parent.closingElement.name;
+		if (closingName.type === "JSXIdentifier") closingName.name = compInfo.componentName;
+	}
+	importsToAdd.set(compInfo.componentName, compInfo.importPath);
+}
+function hasCompiledProp(propsArg, key) {
+	return propsArg.properties.some((prop) => prop.type === "ObjectProperty" && (prop.key.type === "Identifier" && prop.key.name === key || prop.key.type === "StringLiteral" && prop.key.value === key));
+}
+/**
+* Find a compiled prop by key and return its value node.
+*/
+function getCompiledPropValue(propsArg, key) {
+	for (const prop of propsArg.properties) {
+		if (prop.type !== "ObjectProperty") continue;
+		if (prop.key.type === "Identifier" && prop.key.name === key || prop.key.type === "StringLiteral" && prop.key.value === key) return prop.value;
+	}
+	return null;
+}
+/**
+* Handle data-attribute modifiers in compiled JSX.
+* Finds the matching data-* prop, extracts the condition, and builds
+* a ternary animate expression.
+*/
+function handleCompiledDataAttrModifiers(propsArg, slotMotion) {
+	const dataAttrInfo = extractDataAttrModifiers(slotMotion);
+	if (!dataAttrInfo) return {
+		applied: false,
+		needsResolveMotionStateImport: false
+	};
+	const { attr: dataAttrName, stateMap } = dataAttrInfo;
+	const stateValues = Object.keys(stateMap);
+	if (stateValues.length === 0) return {
+		applied: false,
+		needsResolveMotionStateImport: false
+	};
+	const dataStateValue = getCompiledPropValue(propsArg, dataAttrName);
+	if (!dataStateValue) return {
+		applied: false,
+		needsResolveMotionStateImport: false
+	};
+	const needsInterpolation = hasInterpolateMarkers(stateMap);
+	let animateExpr = null;
+	let needsResolveMotionStateImport = false;
+	if (needsInterpolation) {
+		const indexValue = getCompiledPropValue(propsArg, "data-motion-index");
+		if (!indexValue) return {
+			applied: false,
+			needsResolveMotionStateImport: false
+		};
+		const statesVarName = `__motion_states_${motionStatesCounter++}`;
+		hoistedMotionStates.set(statesVarName, stateMap);
+		animateExpr = buildInterpolateAnimateExpr(dataStateValue, stateMap, stateValues, statesVarName, indexValue, {});
+		needsResolveMotionStateImport = true;
+		propsArg.properties = propsArg.properties.filter((prop) => {
+			if (prop.type !== "ObjectProperty") return true;
+			return (prop.key.type === "Identifier" ? prop.key.name : prop.key.type === "StringLiteral" ? prop.key.value : null) !== "data-motion-index";
+		});
+	} else {
+		const baseAnimate = getBaseAnimate(slotMotion.animate);
+		if (dataStateValue.type === "ConditionalExpression" && stateValues.length === 2) {
+			const { test, consequent, alternate } = dataStateValue;
+			const consequentValue = consequent.type === "StringLiteral" ? consequent.value : null;
+			const alternateValue = alternate.type === "StringLiteral" ? alternate.value : null;
+			if (consequentValue && alternateValue && stateMap[consequentValue] !== void 0 && stateMap[alternateValue] !== void 0) animateExpr = t.conditionalExpression(test, t.valueToNode(stateMap[consequentValue]), t.valueToNode(stateMap[alternateValue]));
+		}
+		if (!animateExpr) {
+			let result = t.valueToNode(baseAnimate);
+			for (const stateValue of [...stateValues].reverse()) result = t.conditionalExpression(t.binaryExpression("===", dataStateValue, t.stringLiteral(stateValue)), t.valueToNode(stateMap[stateValue]), result);
+			animateExpr = result;
+		}
+	}
+	if (!animateExpr) return {
+		applied: false,
+		needsResolveMotionStateImport: false
+	};
+	const initialValue = slotMotion.initial ? t.valueToNode(slotMotion.initial) : t.booleanLiteral(false);
+	propsArg.properties.push(t.objectProperty(t.identifier("animate"), animateExpr), t.objectProperty(t.identifier("initial"), initialValue));
+	return {
+		applied: true,
+		needsResolveMotionStateImport
+	};
+}
+function applySlotMotionToCompiledJsx(args, propsArg, slotMotion) {
+	const tagArg = args[0];
+	let transformed = false;
+	let canApplyMotionProps = false;
+	let needsResolveMotionStateImport = false;
+	if (tagArg?.type === "StringLiteral" && isIntrinsicJsxTagName(tagArg.value)) {
+		args[0] = t.memberExpression(t.identifier("motion"), t.identifier(tagArg.value));
+		transformed = true;
+		canApplyMotionProps = true;
+	} else if (tagArg?.type === "MemberExpression" && tagArg.object?.type === "Identifier" && tagArg.object.name === "motion") canApplyMotionProps = true;
+	if (!canApplyMotionProps) return {
+		transformed: false,
+		needsMotionImport: false,
+		hasExit: false,
+		needsResolveMotionStateImport: false
+	};
+	const dataModResult = handleCompiledDataAttrModifiers(propsArg, slotMotion);
+	const hasDataStateModifier = dataModResult.applied;
+	if (dataModResult.needsResolveMotionStateImport) needsResolveMotionStateImport = true;
+	for (const [key, value] of Object.entries(slotMotion)) {
+		if (key === "runtime" || value === void 0 || hasCompiledProp(propsArg, key)) continue;
+		propsArg.properties.push(t.objectProperty(t.identifier(key), t.valueToNode(value)));
+		transformed = true;
+	}
+	if (hasDataStateModifier) transformed = true;
+	const hasExit = slotMotion.exit !== void 0;
+	if (hasExit) {
+		if (args.length < 3) args.push(t.stringLiteral("exit-motion"));
+	}
+	return {
+		transformed,
+		needsMotionImport: transformed,
+		hasExit,
+		needsResolveMotionStateImport
+	};
+}
+//#endregion
+export { applySlotMotionToCompiledJsx, applySlotMotionToElement, clearHoistedMotionStates, componentHasExitMotion, getCustomSlotMotion, getHoistedMotionStates, handleMotionOnElement, wrapCompiledConditionalWithAnimatePresence, wrapCustomComponentWithAnimatePresence, wrapParentConditionalWithAnimatePresence };