tamagui 2.5.0 → 2.5.2

package/.turbo/turbo-build.log

@@ -1,4 +1,4 @@
 $ tamagui-build
-built tamagui in 1581 ms
+built tamagui in 1153 ms
 Running afterBuild script...
-afterBuild completed in 528 ms
+afterBuild completed in 277 ms

package/dist/native.cjs

@@ -15780,9 +15780,13 @@ var init_getSplitStyles_native = __esmMin((() => {
 				}
 			}
 			if (keyInit in skipProps && !noSkip && !isHOC) {
-				var _driver_animations;
 				if (keyInit === "group");
-				if (keyInit === "transition" && typeof valInit === "string" && !(driver === null || driver === void 0 ? void 0 : (_driver_animations = driver.animations) === null || _driver_animations === void 0 ? void 0 : _driver_animations[valInit])) {} else return "continue";
+				if (keyInit === "transition" && typeof valInit === "string") {
+					var _driver_animations;
+					var animationConfig = driver === null || driver === void 0 ? void 0 : (_driver_animations = driver.animations) === null || _driver_animations === void 0 ? void 0 : _driver_animations[valInit];
+					if (animationConfig && (driver === null || driver === void 0 ? void 0 : driver.outputStyle) === "css" && process.env.IS_STATIC === "is_static") valInit = `all ${animationConfig}`;
+					else if (animationConfig) return "continue";
+				} else return "continue";
 			}
 			var isValidStyleKeyInit = isValidStyleKey(keyInit, validStyles$1, accept);
 			if (!isValidStyleKeyInit) {
@@ -17171,7 +17175,7 @@ function createComponent(staticConfig) {
 		setMediaShouldUpdate(componentContext, didGetVariableValue() || hasRuntimeMediaKeys || noClass && (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.hasMedia) === true, hasRuntimeMediaKeys ? splitStyles.hasMedia : null);
 		var { viewProps: viewPropsIn, pseudos, style: splitStylesStyle, classNames, pseudoGroups, mediaGroups } = splitStyles || {};
 		var propsWithAnimation = props;
-		var _ref5 = viewPropsIn || {}, { asChild, children, themeShallow, spaceDirection: _spaceDirection, onPress, onLongPress, onPressIn, onPressOut, onHoverIn, onHoverOut, onMouseUp, onMouseDown, onMouseEnter, onMouseLeave, onFocus, onBlur, separator, passThrough, forceStyle: _forceStyle, onClick, theme: _themeProp } = _ref5, nonTamaguiProps = _objectWithoutProperties(_ref5, _excluded2$29);
+		var _ref5 = viewPropsIn || {}, { asChild, children, themeShallow, spaceDirection: _spaceDirection, onPress, onLongPress, onPressIn, onPressOut, onHoverIn, onHoverOut, onMouseUp, onMouseDown, onMouseEnter, onMouseLeave, onFocus, onBlur, onDidAnimate, separator, passThrough, forceStyle: _forceStyle, onClick, theme: _themeProp } = _ref5, nonTamaguiProps = _objectWithoutProperties(_ref5, _excluded2$29);
 		var viewProps = nonTamaguiProps;
 		if (props.forceStyle) viewProps.forceStyle = props.forceStyle;
 		if (isHOC) {
@@ -17201,7 +17205,8 @@ function createComponent(staticConfig) {
 				themeName,
 				pseudos: pseudos || null,
 				staticConfig,
-				stateRef
+				stateRef,
+				onDidAnimate
 			});
 			if (animations) {
 				if (animations.ref) animatedRef = animations.ref;
@@ -17532,6 +17537,7 @@ var init_createComponent_native = __esmMin((() => {
 		"onMouseLeave",
 		"onFocus",
 		"onBlur",
+		"onDidAnimate",
 		"separator",
 		"passThrough",
 		"forceStyle",
@@ -20312,7 +20318,7 @@ var _excluded$48 = ["type"], _excluded2$26 = [
 	"disabled",
 	"dir",
 	"orientation"
-], _excluded5$12 = ["__scopeAccordion", "value"], _excluded6$8 = ["__scopeAccordion"], _excluded7$5 = ["__scopeAccordion"], _excluded8$5 = ["__scopeAccordion"], _excluded9$5 = ["children"];
+], _excluded5$12 = ["__scopeAccordion", "value"], _excluded6$8 = ["__scopeAccordion"], _excluded7$5 = ["__scopeAccordion"], _excluded8$5 = ["__scopeAccordion", "forceMount"], _excluded9$5 = ["children", "transition"];
 var ACCORDION_NAME = "Accordion";
 var ACCORDION_KEYS = [
 	"Home",
@@ -20539,38 +20545,109 @@ var AccordionContentFrame = styledExport(Collapsible.Content, {
 	} } },
 	defaultVariants: { unstyled: process.env.TAMAGUI_HEADLESS === "1" }
 });
+var AccordionHeightAnimatorContext = /* @__PURE__ */ react$1.createContext(false);
 var AccordionContent = AccordionContentFrame.styleable(function AccordionContent2(props, forwardedRef) {
-	var { __scopeAccordion } = props, contentProps = _objectWithoutProperties(props, _excluded8$5);
+	var { __scopeAccordion, forceMount } = props, contentProps = _objectWithoutProperties(props, _excluded8$5);
 	var accordionContext = useAccordionContext(__scopeAccordion);
+	var itemContext = useAccordionItemContext(__scopeAccordion);
+	var heightAnimatorPresent = react$1.useContext(AccordionHeightAnimatorContext);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AccordionContentFrame, _objectSpread2(_objectSpread2({
 		role: "region",
-		"aria-labelledby": useAccordionItemContext(__scopeAccordion).triggerId,
+		"aria-labelledby": itemContext.triggerId,
 		"data-orientation": accordionContext.orientation,
 		__scopeCollapsible: __scopeAccordion || ACCORDION_CONTEXT
-	}, contentProps), {}, { ref: forwardedRef }));
+	}, contentProps), {}, {
+		forceMount: forceMount || heightAnimatorPresent,
+		ref: forwardedRef
+	}));
 });
 var HeightAnimator = View.styleable(function(props, ref) {
 	var itemContext = useAccordionItemContext();
-	var { children } = props, rest = _objectWithoutProperties(props, _excluded9$5);
-	var [measuredHeight, setMeasuredHeight] = react$1.useState(0);
-	var hasMeasured = measuredHeight > 0;
-	var height = itemContext.open ? hasMeasured ? measuredHeight : "auto" : 0;
-	var shouldAbsolutePosition = hasMeasured || !itemContext.open;
+	var { children, transition } = props, rest = _objectWithoutProperties(props, _excluded9$5);
+	var open = !!itemContext.open;
+	var [fixed, setFixed] = react$1.useState(!open);
+	var [pinned, setPinned] = react$1.useState(false);
+	var [contentPresent, setContentPresent] = react$1.useState(open);
+	var [contentHeight, setContentHeight] = react$1.useState(0);
+	var outerRef = react$1.useRef(null);
+	var innerRef = react$1.useRef(null);
+	var composedRef = useComposedRefs(outerRef, ref);
+	var lastOuterHeightRef = react$1.useRef(0);
+	var pinnedHeightRef = react$1.useRef(0);
+	var settleTimerRef = react$1.useRef(void 0);
+	var prevOpenRef = react$1.useRef(open);
+	if (prevOpenRef.current !== open) {
+		prevOpenRef.current = open;
+		clearTimeout(settleTimerRef.current);
+		if (open) setContentPresent(true);
+		else if (lastOuterHeightRef.current < 1) setContentPresent(false);
+		if (!fixed) {
+			pinnedHeightRef.current = lastOuterHeightRef.current;
+			setFixed(true);
+			setPinned(true);
+		}
+	}
+	useIsomorphicLayoutEffect(function() {
+		if (!pinned) return;
+		var frame = requestAnimationFrame(function() {
+			return setPinned(false);
+		});
+		return function() {
+			return cancelAnimationFrame(frame);
+		};
+	}, [pinned]);
+	react$1.useEffect(function() {
+		return function() {
+			return clearTimeout(settleTimerRef.current);
+		};
+	}, []);
+	useIsomorphicLayoutEffect(function() {
+		var _el_getBoundingClientRect;
+		if (!fixed || !open) return;
+		var el = innerRef.current;
+		var naturalHeight = el === null || el === void 0 ? void 0 : (_el_getBoundingClientRect = el.getBoundingClientRect) === null || _el_getBoundingClientRect === void 0 ? void 0 : _el_getBoundingClientRect.call(el).height;
+		if (naturalHeight && naturalHeight > 0 && naturalHeight !== contentHeight) setContentHeight(naturalHeight);
+	});
+	var minHeight = pinned ? pinnedHeightRef.current : open ? contentHeight : 0;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(View, _objectSpread2(_objectSpread2({
-		ref,
-		height,
+		ref: composedRef,
 		position: "relative"
-	}, rest), {}, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(View, {
-		position: shouldAbsolutePosition ? "absolute" : "relative",
-		top: shouldAbsolutePosition ? 0 : void 0,
-		left: shouldAbsolutePosition ? 0 : void 0,
-		right: shouldAbsolutePosition ? 0 : void 0,
+	}, rest), {}, {
+		transition: fixed ? transition : void 0,
+		height: "auto",
+		minHeight,
+		overflow: "hidden",
 		onLayout: function(param) {
 			var { nativeEvent } = param;
-			if (nativeEvent.layout.height && nativeEvent.layout.height !== measuredHeight) setMeasuredHeight(nativeEvent.layout.height);
+			var outerHeight = nativeEvent.layout.height;
+			lastOuterHeightRef.current = outerHeight;
+			clearTimeout(settleTimerRef.current);
+			if (fixed && !pinned && open && contentHeight > 0) {
+				if (Math.abs(outerHeight - contentHeight) < 1) settleTimerRef.current = setTimeout(function() {
+					return setFixed(false);
+				}, 100);
+			}
 		},
-		children
-	}) }));
+		onDidAnimate: function() {
+			if (!prevOpenRef.current && !pinned) setContentPresent(false);
+		},
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(View, {
+			ref: innerRef,
+			position: fixed ? "absolute" : "relative",
+			top: fixed ? 0 : void 0,
+			left: fixed ? 0 : void 0,
+			right: fixed ? 0 : void 0,
+			onLayout: function(param) {
+				var { nativeEvent } = param;
+				var naturalHeight = nativeEvent.layout.height;
+				if (open && naturalHeight !== contentHeight) setContentHeight(naturalHeight);
+			},
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AccordionHeightAnimatorContext.Provider, {
+				value: contentPresent,
+				children
+			})
+		})
+	}));
 });
 function getState$4(open) {
 	return open ? "open" : "closed";
@@ -21985,6 +22062,7 @@ init_objectWithoutProperties();
 init_objectSpread2();
 var _excluded$41 = [
 	"src",
+	"source",
 	"width",
 	"height",
 	"borderRadius",
@@ -22011,8 +22089,13 @@ var defaultObjectFitMap = function(objectFit) {
 };
 var defaultTransformSource = function(props) {
 	var { src, source, width, height } = props;
-	if (source) return source;
-	if (src && typeof src !== "string") return src;
+	if (typeof src === "string") return {
+		uri: src,
+		width,
+		height
+	};
+	if (source !== void 0 && source !== null) return source;
+	if (src !== void 0 && src !== null) return src;
 	return {
 		uri: src,
 		width,
@@ -22021,7 +22104,7 @@ var defaultTransformSource = function(props) {
 };
 function createImage(options) {
 	var { Component, mapObjectFitToResizeMode = defaultObjectFitMap, resizeModePropName = "resizeMode", objectPositionPropName, transformSource = defaultTransformSource } = options;
-	var ImageComponent = styledExport(Component, { name: "Image" }, { inlineProps: /* @__PURE__ */ new Set([
+	var StyledImage = styledExport(Component, { name: "Image" }, { inlineProps: /* @__PURE__ */ new Set([
 		"source",
 		"placeholder",
 		"transition",
@@ -22038,13 +22121,15 @@ function createImage(options) {
 		"onLoadStart",
 		"onProgress",
 		"onLoadEnd"
-	]) }).styleable(function(incomingProps, ref) {
+	]) });
+	var ImageComponent = StyledImage.styleable(function(incomingProps, ref) {
 		var props = incomingProps;
-		var { src, width, height, borderRadius, objectFit, objectPosition, decoding, elementTiming, fetchpriority, isMap, loading, sizes, useMap, onLoad, onError } = props, rest = _objectWithoutProperties(props, _excluded$41);
+		var { src, source, width, height, borderRadius, objectFit, objectPosition, decoding, elementTiming, fetchpriority, isMap, loading, sizes, useMap, onLoad, onError } = props, rest = _objectWithoutProperties(props, _excluded$41);
 		var resolvedWidth = typeof width === "string" && width[0] === "$" ? getTokenValue(width, "size") : width;
 		var resolvedHeight = typeof height === "string" && height[0] === "$" ? getTokenValue(height, "size") : height;
 		var finalSource = transformSource({
 			src,
+			source,
 			width: resolvedWidth,
 			height: resolvedHeight
 		});
@@ -22058,11 +22143,11 @@ function createImage(options) {
 		if (objectPositionPropName && objectPosition) finalProps[objectPositionPropName] = objectPosition;
 		if (onLoad) finalProps.onLoad = function(e) {
 			var _e_nativeEvent;
-			var source = (e === null || e === void 0 ? void 0 : (_e_nativeEvent = e.nativeEvent) === null || _e_nativeEvent === void 0 ? void 0 : _e_nativeEvent.source) || (e === null || e === void 0 ? void 0 : e.source) || {};
+			var source2 = (e === null || e === void 0 ? void 0 : (_e_nativeEvent = e.nativeEvent) === null || _e_nativeEvent === void 0 ? void 0 : _e_nativeEvent.source) || (e === null || e === void 0 ? void 0 : e.source) || {};
 			onLoad({
 				target: {
-					naturalHeight: source === null || source === void 0 ? void 0 : source.height,
-					naturalWidth: source === null || source === void 0 ? void 0 : source.width
+					naturalHeight: source2 === null || source2 === void 0 ? void 0 : source2.height,
+					naturalWidth: source2 === null || source2 === void 0 ? void 0 : source2.width
 				},
 				type: "load"
 			});
@@ -22070,7 +22155,7 @@ function createImage(options) {
 		if (onError) finalProps.onError = function() {
 			onError({ type: "error" });
 		};
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, _objectSpread2({ ref }, finalProps));
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledImage, _objectSpread2({ ref }, finalProps));
 	});
 	var comp = Component;
 	ImageComponent.getSize = comp.getSize || function() {};
@@ -32319,10 +32404,10 @@ var Toggle = /* @__PURE__ */ react$1.forwardRef(function Toggle2(props, forwarde
 		"data-state": active ? "on" : "off",
 		"data-disabled": props.disabled ? "" : void 0,
 		unstyled
-	}, active && !activeStyle && !unstyled && { defaultActiveStyle: true }), active && activeStyle && _objectSpread2(_objectSpread2({}, activeStyle), {}, {
+	}, active && !activeStyle && !unstyled && { defaultActiveStyle: true }), buttonProps), active && activeStyle && _objectSpread2(_objectSpread2({}, activeStyle), {}, {
 		hoverStyle: activeStyle,
 		focusStyle: activeStyle
-	})), buttonProps), {}, {
+	})), {}, {
 		ref: forwardedRef,
 		onPress: composeEventHandlers((_props_onPress = props.onPress) !== null && _props_onPress !== void 0 ? _props_onPress : void 0, function() {
 			if (!props.disabled) setActive(function(prev) {

package/dist/test.cjs

@@ -15960,9 +15960,13 @@ var init_getSplitStyles_native = __esmMin((() => {
 				}
 			}
 			if (keyInit in skipProps && !noSkip && !isHOC) {
-				var _driver_animations;
 				if (keyInit === "group");
-				if (keyInit === "transition" && typeof valInit === "string" && !(driver === null || driver === void 0 ? void 0 : (_driver_animations = driver.animations) === null || _driver_animations === void 0 ? void 0 : _driver_animations[valInit])) {} else return "continue";
+				if (keyInit === "transition" && typeof valInit === "string") {
+					var _driver_animations;
+					var animationConfig = driver === null || driver === void 0 ? void 0 : (_driver_animations = driver.animations) === null || _driver_animations === void 0 ? void 0 : _driver_animations[valInit];
+					if (animationConfig && (driver === null || driver === void 0 ? void 0 : driver.outputStyle) === "css" && process.env.IS_STATIC === "is_static") valInit = `all ${animationConfig}`;
+					else if (animationConfig) return "continue";
+				} else return "continue";
 			}
 			var isValidStyleKeyInit = isValidStyleKey(keyInit, validStyles$1, accept);
 			if (!isValidStyleKeyInit) {
@@ -17357,7 +17361,7 @@ function createComponent(staticConfig) {
 		setMediaShouldUpdate(componentContext, didGetVariableValue() || hasRuntimeMediaKeys || noClass && (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.hasMedia) === true, hasRuntimeMediaKeys ? splitStyles.hasMedia : null);
 		var { viewProps: viewPropsIn, pseudos, style: splitStylesStyle, classNames, pseudoGroups, mediaGroups } = splitStyles || {};
 		var propsWithAnimation = props;
-		var _ref5 = viewPropsIn || {}, { asChild, children, themeShallow, spaceDirection: _spaceDirection, onPress, onLongPress, onPressIn, onPressOut, onHoverIn, onHoverOut, onMouseUp, onMouseDown, onMouseEnter, onMouseLeave, onFocus, onBlur, separator, passThrough, forceStyle: _forceStyle, onClick, theme: _themeProp } = _ref5, nonTamaguiProps = _objectWithoutProperties(_ref5, _excluded2$29);
+		var _ref5 = viewPropsIn || {}, { asChild, children, themeShallow, spaceDirection: _spaceDirection, onPress, onLongPress, onPressIn, onPressOut, onHoverIn, onHoverOut, onMouseUp, onMouseDown, onMouseEnter, onMouseLeave, onFocus, onBlur, onDidAnimate, separator, passThrough, forceStyle: _forceStyle, onClick, theme: _themeProp } = _ref5, nonTamaguiProps = _objectWithoutProperties(_ref5, _excluded2$29);
 		var viewProps = nonTamaguiProps;
 		if (props.forceStyle) viewProps.forceStyle = props.forceStyle;
 		if (isHOC) {
@@ -17387,7 +17391,8 @@ function createComponent(staticConfig) {
 				themeName,
 				pseudos: pseudos || null,
 				staticConfig,
-				stateRef
+				stateRef,
+				onDidAnimate
 			});
 			if (animations) {
 				if (animations.ref) animatedRef = animations.ref;
@@ -17718,6 +17723,7 @@ var init_createComponent_native = __esmMin((() => {
 		"onMouseLeave",
 		"onFocus",
 		"onBlur",
+		"onDidAnimate",
 		"separator",
 		"passThrough",
 		"forceStyle",
@@ -20379,7 +20385,7 @@ var _excluded$48 = ["type"], _excluded2$26 = [
 	"disabled",
 	"dir",
 	"orientation"
-], _excluded5$12 = ["__scopeAccordion", "value"], _excluded6$8 = ["__scopeAccordion"], _excluded7$5 = ["__scopeAccordion"], _excluded8$5 = ["__scopeAccordion"], _excluded9$5 = ["children"];
+], _excluded5$12 = ["__scopeAccordion", "value"], _excluded6$8 = ["__scopeAccordion"], _excluded7$5 = ["__scopeAccordion"], _excluded8$5 = ["__scopeAccordion", "forceMount"], _excluded9$5 = ["children", "transition"];
 var ACCORDION_NAME = "Accordion";
 var ACCORDION_KEYS = [
 	"Home",
@@ -20606,38 +20612,109 @@ var AccordionContentFrame = styledExport(Collapsible.Content, {
 	} } },
 	defaultVariants: { unstyled: process.env.TAMAGUI_HEADLESS === "1" }
 });
+var AccordionHeightAnimatorContext = /* @__PURE__ */ react$1.createContext(false);
 var AccordionContent = AccordionContentFrame.styleable(function AccordionContent2(props, forwardedRef) {
-	var { __scopeAccordion } = props, contentProps = _objectWithoutProperties(props, _excluded8$5);
+	var { __scopeAccordion, forceMount } = props, contentProps = _objectWithoutProperties(props, _excluded8$5);
 	var accordionContext = useAccordionContext(__scopeAccordion);
+	var itemContext = useAccordionItemContext(__scopeAccordion);
+	var heightAnimatorPresent = react$1.useContext(AccordionHeightAnimatorContext);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AccordionContentFrame, _objectSpread2(_objectSpread2({
 		role: "region",
-		"aria-labelledby": useAccordionItemContext(__scopeAccordion).triggerId,
+		"aria-labelledby": itemContext.triggerId,
 		"data-orientation": accordionContext.orientation,
 		__scopeCollapsible: __scopeAccordion || ACCORDION_CONTEXT
-	}, contentProps), {}, { ref: forwardedRef }));
+	}, contentProps), {}, {
+		forceMount: forceMount || heightAnimatorPresent,
+		ref: forwardedRef
+	}));
 });
 var HeightAnimator = View.styleable(function(props, ref) {
 	var itemContext = useAccordionItemContext();
-	var { children } = props, rest = _objectWithoutProperties(props, _excluded9$5);
-	var [measuredHeight, setMeasuredHeight] = react$1.useState(0);
-	var hasMeasured = measuredHeight > 0;
-	var height = itemContext.open ? hasMeasured ? measuredHeight : "auto" : 0;
-	var shouldAbsolutePosition = hasMeasured || !itemContext.open;
+	var { children, transition } = props, rest = _objectWithoutProperties(props, _excluded9$5);
+	var open = !!itemContext.open;
+	var [fixed, setFixed] = react$1.useState(!open);
+	var [pinned, setPinned] = react$1.useState(false);
+	var [contentPresent, setContentPresent] = react$1.useState(open);
+	var [contentHeight, setContentHeight] = react$1.useState(0);
+	var outerRef = react$1.useRef(null);
+	var innerRef = react$1.useRef(null);
+	var composedRef = useComposedRefs(outerRef, ref);
+	var lastOuterHeightRef = react$1.useRef(0);
+	var pinnedHeightRef = react$1.useRef(0);
+	var settleTimerRef = react$1.useRef(void 0);
+	var prevOpenRef = react$1.useRef(open);
+	if (prevOpenRef.current !== open) {
+		prevOpenRef.current = open;
+		clearTimeout(settleTimerRef.current);
+		if (open) setContentPresent(true);
+		else if (lastOuterHeightRef.current < 1) setContentPresent(false);
+		if (!fixed) {
+			pinnedHeightRef.current = lastOuterHeightRef.current;
+			setFixed(true);
+			setPinned(true);
+		}
+	}
+	useIsomorphicLayoutEffect(function() {
+		if (!pinned) return;
+		var frame = requestAnimationFrame(function() {
+			return setPinned(false);
+		});
+		return function() {
+			return cancelAnimationFrame(frame);
+		};
+	}, [pinned]);
+	react$1.useEffect(function() {
+		return function() {
+			return clearTimeout(settleTimerRef.current);
+		};
+	}, []);
+	useIsomorphicLayoutEffect(function() {
+		var _el_getBoundingClientRect;
+		if (!fixed || !open) return;
+		var el = innerRef.current;
+		var naturalHeight = el === null || el === void 0 ? void 0 : (_el_getBoundingClientRect = el.getBoundingClientRect) === null || _el_getBoundingClientRect === void 0 ? void 0 : _el_getBoundingClientRect.call(el).height;
+		if (naturalHeight && naturalHeight > 0 && naturalHeight !== contentHeight) setContentHeight(naturalHeight);
+	});
+	var minHeight = pinned ? pinnedHeightRef.current : open ? contentHeight : 0;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(View, _objectSpread2(_objectSpread2({
-		ref,
-		height,
+		ref: composedRef,
 		position: "relative"
-	}, rest), {}, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(View, {
-		position: shouldAbsolutePosition ? "absolute" : "relative",
-		top: shouldAbsolutePosition ? 0 : void 0,
-		left: shouldAbsolutePosition ? 0 : void 0,
-		right: shouldAbsolutePosition ? 0 : void 0,
+	}, rest), {}, {
+		transition: fixed ? transition : void 0,
+		height: "auto",
+		minHeight,
+		overflow: "hidden",
 		onLayout: function(param) {
 			var { nativeEvent } = param;
-			if (nativeEvent.layout.height && nativeEvent.layout.height !== measuredHeight) setMeasuredHeight(nativeEvent.layout.height);
+			var outerHeight = nativeEvent.layout.height;
+			lastOuterHeightRef.current = outerHeight;
+			clearTimeout(settleTimerRef.current);
+			if (fixed && !pinned && open && contentHeight > 0) {
+				if (Math.abs(outerHeight - contentHeight) < 1) settleTimerRef.current = setTimeout(function() {
+					return setFixed(false);
+				}, 100);
+			}
 		},
-		children
-	}) }));
+		onDidAnimate: function() {
+			if (!prevOpenRef.current && !pinned) setContentPresent(false);
+		},
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(View, {
+			ref: innerRef,
+			position: fixed ? "absolute" : "relative",
+			top: fixed ? 0 : void 0,
+			left: fixed ? 0 : void 0,
+			right: fixed ? 0 : void 0,
+			onLayout: function(param) {
+				var { nativeEvent } = param;
+				var naturalHeight = nativeEvent.layout.height;
+				if (open && naturalHeight !== contentHeight) setContentHeight(naturalHeight);
+			},
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AccordionHeightAnimatorContext.Provider, {
+				value: contentPresent,
+				children
+			})
+		})
+	}));
 });
 function getState$4(open) {
 	return open ? "open" : "closed";
@@ -22052,6 +22129,7 @@ init_objectWithoutProperties();
 init_objectSpread2();
 var _excluded$41 = [
 	"src",
+	"source",
 	"width",
 	"height",
 	"borderRadius",
@@ -22078,8 +22156,13 @@ var defaultObjectFitMap = function(objectFit) {
 };
 var defaultTransformSource = function(props) {
 	var { src, source, width, height } = props;
-	if (source) return source;
-	if (src && typeof src !== "string") return src;
+	if (typeof src === "string") return {
+		uri: src,
+		width,
+		height
+	};
+	if (source !== void 0 && source !== null) return source;
+	if (src !== void 0 && src !== null) return src;
 	return {
 		uri: src,
 		width,
@@ -22088,7 +22171,7 @@ var defaultTransformSource = function(props) {
 };
 function createImage(options) {
 	var { Component, mapObjectFitToResizeMode = defaultObjectFitMap, resizeModePropName = "resizeMode", objectPositionPropName, transformSource = defaultTransformSource } = options;
-	var ImageComponent = styledExport(Component, { name: "Image" }, { inlineProps: /* @__PURE__ */ new Set([
+	var StyledImage = styledExport(Component, { name: "Image" }, { inlineProps: /* @__PURE__ */ new Set([
 		"source",
 		"placeholder",
 		"transition",
@@ -22105,13 +22188,15 @@ function createImage(options) {
 		"onLoadStart",
 		"onProgress",
 		"onLoadEnd"
-	]) }).styleable(function(incomingProps, ref) {
+	]) });
+	var ImageComponent = StyledImage.styleable(function(incomingProps, ref) {
 		var props = incomingProps;
-		var { src, width, height, borderRadius, objectFit, objectPosition, decoding, elementTiming, fetchpriority, isMap, loading, sizes, useMap, onLoad, onError } = props, rest = _objectWithoutProperties(props, _excluded$41);
+		var { src, source, width, height, borderRadius, objectFit, objectPosition, decoding, elementTiming, fetchpriority, isMap, loading, sizes, useMap, onLoad, onError } = props, rest = _objectWithoutProperties(props, _excluded$41);
 		var resolvedWidth = typeof width === "string" && width[0] === "$" ? getTokenValue(width, "size") : width;
 		var resolvedHeight = typeof height === "string" && height[0] === "$" ? getTokenValue(height, "size") : height;
 		var finalSource = transformSource({
 			src,
+			source,
 			width: resolvedWidth,
 			height: resolvedHeight
 		});
@@ -22125,11 +22210,11 @@ function createImage(options) {
 		if (objectPositionPropName && objectPosition) finalProps[objectPositionPropName] = objectPosition;
 		if (onLoad) finalProps.onLoad = function(e) {
 			var _e_nativeEvent;
-			var source = (e === null || e === void 0 ? void 0 : (_e_nativeEvent = e.nativeEvent) === null || _e_nativeEvent === void 0 ? void 0 : _e_nativeEvent.source) || (e === null || e === void 0 ? void 0 : e.source) || {};
+			var source2 = (e === null || e === void 0 ? void 0 : (_e_nativeEvent = e.nativeEvent) === null || _e_nativeEvent === void 0 ? void 0 : _e_nativeEvent.source) || (e === null || e === void 0 ? void 0 : e.source) || {};
 			onLoad({
 				target: {
-					naturalHeight: source === null || source === void 0 ? void 0 : source.height,
-					naturalWidth: source === null || source === void 0 ? void 0 : source.width
+					naturalHeight: source2 === null || source2 === void 0 ? void 0 : source2.height,
+					naturalWidth: source2 === null || source2 === void 0 ? void 0 : source2.width
 				},
 				type: "load"
 			});
@@ -22137,7 +22222,7 @@ function createImage(options) {
 		if (onError) finalProps.onError = function() {
 			onError({ type: "error" });
 		};
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, _objectSpread2({ ref }, finalProps));
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledImage, _objectSpread2({ ref }, finalProps));
 	});
 	var comp = Component;
 	ImageComponent.getSize = comp.getSize || function() {};
@@ -32386,10 +32471,10 @@ var Toggle = /* @__PURE__ */ react$1.forwardRef(function Toggle2(props, forwarde
 		"data-state": active ? "on" : "off",
 		"data-disabled": props.disabled ? "" : void 0,
 		unstyled
-	}, active && !activeStyle && !unstyled && { defaultActiveStyle: true }), active && activeStyle && _objectSpread2(_objectSpread2({}, activeStyle), {}, {
+	}, active && !activeStyle && !unstyled && { defaultActiveStyle: true }), buttonProps), active && activeStyle && _objectSpread2(_objectSpread2({}, activeStyle), {}, {
 		hoverStyle: activeStyle,
 		focusStyle: activeStyle
-	})), buttonProps), {}, {
+	})), {}, {
 		ref: forwardedRef,
 		onPress: composeEventHandlers((_props_onPress = props.onPress) !== null && _props_onPress !== void 0 ? _props_onPress : void 0, function() {
 			if (!props.disabled) setActive(function(prev) {

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "tamagui",
-  "version": "2.5.0",
+  "version": "2.5.2",
   "gitHead": "a49cc7ea6b93ba384e77a4880ae48ac4a5635c14",
   "description": "Style and UI for React (web and native) meet an optimizing compiler",
   "repository": {
     "type": "git",
-    "url": "https://github.com/tamagui/tamagui.git",
+    "url": "git+https://github.com/tamagui/tamagui.git",
     "directory": "code/ui/tamagui"
   },
   "source": "src/index.ts",
@@ -77,72 +77,72 @@
     "check-circular-deps": "npx madge --circular ./src/index.ts"
   },
   "dependencies": {
-    "@tamagui/accordion": "2.5.0",
-    "@tamagui/adapt": "2.5.0",
-    "@tamagui/alert-dialog": "2.5.0",
-    "@tamagui/animate": "2.5.0",
-    "@tamagui/animate-presence": "2.5.0",
-    "@tamagui/avatar": "2.5.0",
-    "@tamagui/button": "2.5.0",
-    "@tamagui/card": "2.5.0",
-    "@tamagui/checkbox": "2.5.0",
-    "@tamagui/collapsible": "2.5.0",
-    "@tamagui/compose-refs": "2.5.0",
-    "@tamagui/constants": "2.5.0",
-    "@tamagui/context-menu": "2.5.0",
-    "@tamagui/core": "2.5.0",
-    "@tamagui/create-context": "2.5.0",
-    "@tamagui/create-menu": "2.5.0",
-    "@tamagui/dialog": "2.5.0",
-    "@tamagui/element": "2.5.0",
-    "@tamagui/elements": "2.5.0",
-    "@tamagui/fake-react-native": "2.5.0",
-    "@tamagui/focusable": "2.5.0",
-    "@tamagui/form": "2.5.0",
-    "@tamagui/get-button-sized": "2.5.0",
-    "@tamagui/get-font-sized": "2.5.0",
-    "@tamagui/get-token": "2.5.0",
-    "@tamagui/group": "2.5.0",
-    "@tamagui/helpers-tamagui": "2.5.0",
-    "@tamagui/image": "2.5.0",
-    "@tamagui/input": "2.5.0",
-    "@tamagui/label": "2.5.0",
-    "@tamagui/linear-gradient": "2.5.0",
-    "@tamagui/list-item": "2.5.0",
-    "@tamagui/menu": "2.5.0",
-    "@tamagui/polyfill-dev": "2.5.0",
-    "@tamagui/popover": "2.5.0",
-    "@tamagui/popper": "2.5.0",
-    "@tamagui/portal": "2.5.0",
-    "@tamagui/progress": "2.5.0",
-    "@tamagui/radio-group": "2.5.0",
-    "@tamagui/react-native-media-driver": "2.5.0",
-    "@tamagui/scroll-view": "2.5.0",
-    "@tamagui/select": "2.5.0",
-    "@tamagui/separator": "2.5.0",
-    "@tamagui/shapes": "2.5.0",
-    "@tamagui/sheet": "2.5.0",
-    "@tamagui/slider": "2.5.0",
-    "@tamagui/spacer": "2.5.0",
-    "@tamagui/spinner": "2.5.0",
-    "@tamagui/stacks": "2.5.0",
-    "@tamagui/switch": "2.5.0",
-    "@tamagui/tabs": "2.5.0",
-    "@tamagui/text": "2.5.0",
-    "@tamagui/theme": "2.5.0",
-    "@tamagui/toast": "2.5.0",
-    "@tamagui/toggle-group": "2.5.0",
-    "@tamagui/tooltip": "2.5.0",
-    "@tamagui/use-controllable-state": "2.5.0",
-    "@tamagui/use-debounce": "2.5.0",
-    "@tamagui/use-force-update": "2.5.0",
-    "@tamagui/use-window-dimensions": "2.5.0",
-    "@tamagui/visually-hidden": "2.5.0",
-    "@tamagui/font-size": "2.5.0",
-    "@tamagui/z-index-stack": "2.5.0"
+    "@tamagui/accordion": "2.5.2",
+    "@tamagui/adapt": "2.5.2",
+    "@tamagui/alert-dialog": "2.5.2",
+    "@tamagui/animate": "2.5.2",
+    "@tamagui/animate-presence": "2.5.2",
+    "@tamagui/avatar": "2.5.2",
+    "@tamagui/button": "2.5.2",
+    "@tamagui/card": "2.5.2",
+    "@tamagui/checkbox": "2.5.2",
+    "@tamagui/collapsible": "2.5.2",
+    "@tamagui/compose-refs": "2.5.2",
+    "@tamagui/constants": "2.5.2",
+    "@tamagui/context-menu": "2.5.2",
+    "@tamagui/core": "2.5.2",
+    "@tamagui/create-context": "2.5.2",
+    "@tamagui/create-menu": "2.5.2",
+    "@tamagui/dialog": "2.5.2",
+    "@tamagui/element": "2.5.2",
+    "@tamagui/elements": "2.5.2",
+    "@tamagui/fake-react-native": "2.5.2",
+    "@tamagui/focusable": "2.5.2",
+    "@tamagui/form": "2.5.2",
+    "@tamagui/get-button-sized": "2.5.2",
+    "@tamagui/get-font-sized": "2.5.2",
+    "@tamagui/get-token": "2.5.2",
+    "@tamagui/group": "2.5.2",
+    "@tamagui/helpers-tamagui": "2.5.2",
+    "@tamagui/image": "2.5.2",
+    "@tamagui/input": "2.5.2",
+    "@tamagui/label": "2.5.2",
+    "@tamagui/linear-gradient": "2.5.2",
+    "@tamagui/list-item": "2.5.2",
+    "@tamagui/menu": "2.5.2",
+    "@tamagui/polyfill-dev": "2.5.2",
+    "@tamagui/popover": "2.5.2",
+    "@tamagui/popper": "2.5.2",
+    "@tamagui/portal": "2.5.2",
+    "@tamagui/progress": "2.5.2",
+    "@tamagui/radio-group": "2.5.2",
+    "@tamagui/react-native-media-driver": "2.5.2",
+    "@tamagui/scroll-view": "2.5.2",
+    "@tamagui/select": "2.5.2",
+    "@tamagui/separator": "2.5.2",
+    "@tamagui/shapes": "2.5.2",
+    "@tamagui/sheet": "2.5.2",
+    "@tamagui/slider": "2.5.2",
+    "@tamagui/spacer": "2.5.2",
+    "@tamagui/spinner": "2.5.2",
+    "@tamagui/stacks": "2.5.2",
+    "@tamagui/switch": "2.5.2",
+    "@tamagui/tabs": "2.5.2",
+    "@tamagui/text": "2.5.2",
+    "@tamagui/theme": "2.5.2",
+    "@tamagui/toast": "2.5.2",
+    "@tamagui/toggle-group": "2.5.2",
+    "@tamagui/tooltip": "2.5.2",
+    "@tamagui/use-controllable-state": "2.5.2",
+    "@tamagui/use-debounce": "2.5.2",
+    "@tamagui/use-force-update": "2.5.2",
+    "@tamagui/use-window-dimensions": "2.5.2",
+    "@tamagui/visually-hidden": "2.5.2",
+    "@tamagui/font-size": "2.5.2",
+    "@tamagui/z-index-stack": "2.5.2"
   },
   "devDependencies": {
-    "@tamagui/build": "2.5.0",
+    "@tamagui/build": "2.5.2",
     "react": ">=19",
     "react-native": "0.83.2",
     "react-native-web": "^0.21.0"