@tamagui/web 3.0.0-beta.924.1 → 3.0.0

package/dist/cjs/createComponent.native.cjs

@@ -48,6 +48,8 @@ var import_defaultComponentState = require("./defaultComponentState.native.js");
 var import_eventHandling = require("./eventHandling.native.js");
 var import_componentDisplayName = require("./helpers/componentDisplayName.native.js");
 var import_getSplitStyles = require("./helpers/getSplitStyles.native.js");
+var import_isTamaguiElement = require("./helpers/isTamaguiElement.native.js");
+var import_NativeTextBinding = require("./helpers/NativeTextBinding.native.js");
 var import_grammarConfig = require("./helpers/grammarConfig.native.js");
 var import_styleStaticConfig = require("./helpers/styleStaticConfig.native.js");
 var import_nativeStyleEngine = require("./helpers/nativeStyleEngine.native.js");
@@ -69,10 +71,6 @@ var import_useTheme = require("./hooks/useTheme.native.js");
 var import_setupHooks = require("./setupHooks.native.js");
 var import_Slot = require("./views/Slot.native.js");
 var import_Theme = require("./views/Theme.native.js");
-function _type_of(obj) {
-	"@swc/helpers - typeof";
-	return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
-}
 var time;
 var debugKeyListeners;
 var startVisualizer;
@@ -84,8 +82,7 @@ var avoidReRenderKeys = /* @__PURE__ */ new Set([
 	"group",
 	"focus",
 	"focusWithin",
-	"media",
-	"group"
+	"media"
 ]);
 var groupPseudoKeys = [
 	"disabled",
@@ -139,7 +136,7 @@ function createComponent(staticConfig) {
 			var nextStyleStaticConfig = (0, import_styleStaticConfig.getStyleStaticConfig)(staticConfig, config);
 			resolvedStyleStaticConfig = nextStyleStaticConfig;
 			resolvedDefaultProps = nextStyleStaticConfig.defaultProps;
-			if (import_constants.isWeb && !staticConfig.isText && config.settings.defaultPosition === "relative" && ((_nextStyleStaticConfig_baseStyle = nextStyleStaticConfig.baseStyle) === null || _nextStyleStaticConfig_baseStyle === void 0 ? void 0 : _nextStyleStaticConfig_baseStyle.position) === void 0) resolvedStyleStaticConfig = {
+			if (import_constants.isWeb && !staticConfig.isText && !staticConfig.isStyledHOC && config.settings.defaultPosition === "relative" && ((_nextStyleStaticConfig_baseStyle = nextStyleStaticConfig.baseStyle) === null || _nextStyleStaticConfig_baseStyle === void 0 ? void 0 : _nextStyleStaticConfig_baseStyle.position) === void 0) resolvedStyleStaticConfig = {
 				...nextStyleStaticConfig,
 				baseStyle: {
 					position: "relative",
@@ -167,7 +164,7 @@ function createComponent(staticConfig) {
 		}
 		if (process.env.NODE_ENV === "test") {
 			var testRenderCount = propsIn["data-test-renders"];
-			if (testRenderCount && (typeof testRenderCount === "undefined" ? "undefined" : _type_of(testRenderCount)) === "object" && !Object.isFrozen(testRenderCount)) {
+			if (testRenderCount && typeof testRenderCount === "object" && !Object.isFrozen(testRenderCount)) {
 				var _testRenderCount_current;
 				testRenderCount.current = (_testRenderCount_current = testRenderCount.current) !== null && _testRenderCount_current !== void 0 ? _testRenderCount_current : 0;
 				testRenderCount.current += 1;
@@ -180,10 +177,6 @@ function createComponent(staticConfig) {
 		var componentContext = import_react.default.useContext(import_ComponentContext.ComponentContext);
 		var hasTextAncestor = !!(import_constants.isWeb && isText ? componentContext.inText : false);
 		var isInsideNativeMenu = import_constants.isAndroid ? import_react.default.useContext(import_native.NativeMenuContext) : false;
-		if (!process.env.TAMAGUI_IS_CORE_NODE && process.env.NODE_ENV === "development" && debugProp === "profile" && !time) {
-			time = require("@tamagui/timer").timer().start();
-			globalThis["time"] = time;
-		}
 		if (process.env.NODE_ENV === "development" && !time && globalThis.time) time = globalThis.time;
 		if (process.env.NODE_ENV === "development" && time) time`non-tamagui time (ignore)`;
 		var props = propsIn;
@@ -258,8 +251,8 @@ function createComponent(staticConfig) {
 		if (stateRef.current.avoidReRenders) (0, import_constants.useIsomorphicLayoutEffect)(function() {
 			var emitted = stateRef.current.prevPseudoState;
 			if (emitted && (emitted.hover || emitted.press || emitted.focus)) {
-				var _stateRef_current_updateStyleListener, _stateRef_current2;
-				(_stateRef_current_updateStyleListener = (_stateRef_current2 = stateRef.current).updateStyleListener) === null || _stateRef_current_updateStyleListener === void 0 || _stateRef_current_updateStyleListener.call(_stateRef_current2);
+				var _stateRef_current_updateStyleListener, _stateRef_current3;
+				(_stateRef_current_updateStyleListener = (_stateRef_current3 = stateRef.current).updateStyleListener) === null || _stateRef_current_updateStyleListener === void 0 || _stateRef_current_updateStyleListener.call(_stateRef_current3);
 			}
 			var pendingState = stateRef.current.nextState;
 			if (!pendingState) return;
@@ -274,8 +267,8 @@ function createComponent(staticConfig) {
 			if (!pseudoDriver || !host) return;
 			return pseudoDriver.subscribe(host, function(param) {
 				var { hovered } = param;
-				var _stateRef_current_setStateShallow, _stateRef_current2;
-				(_stateRef_current_setStateShallow = (_stateRef_current2 = stateRef.current).setStateShallow) === null || _stateRef_current_setStateShallow === void 0 || _stateRef_current_setStateShallow.call(_stateRef_current2, { hover: hovered });
+				var _stateRef_current_setStateShallow, _stateRef_current3;
+				(_stateRef_current_setStateShallow = (_stateRef_current3 = stateRef.current).setStateShallow) === null || _stateRef_current_setStateShallow === void 0 || _stateRef_current_setStateShallow.call(_stateRef_current3, { hover: hovered });
 			});
 		}, [platformPseudo, props.disabled]);
 		var setStateShallow = componentState.setStateShallow;
@@ -287,7 +280,9 @@ function createComponent(staticConfig) {
 		var elementType = BaseComponent;
 		var isAnimatedCustomComponent = animationDriver && isAnimated && animationDriver.needsCustomComponent;
 		if (isAnimatedCustomComponent) elementType = animationDriver[isText ? "Text" : "View"] || elementType;
-		var disableTheme = isHOC;
+		var disableThemeProp = false;
+		var hocThemesSelf = isHOC && "theme" in props;
+		var disableTheme = disableThemeProp || isHOC && !hocThemesSelf;
 		if (process.env.NODE_ENV === "development" && time) time`theme-props`;
 		var themeStateProps = {
 			disable: disableTheme,
@@ -301,9 +296,9 @@ function createComponent(staticConfig) {
 		var _stateRef_current1;
 		themeStateProps.deopt = willBeAnimated;
 		themeStateProps.nativeUpdate = (_stateRef_current1 = stateRef.current).nativeUpdateProxy || (_stateRef_current1.nativeUpdateProxy = function(next) {
-			var _stateRef_current_nativeStyleUpdate, _stateRef_current2;
+			var _stateRef_current_nativeStyleUpdate, _stateRef_current3;
 			var _stateRef_current_nativeStyleUpdate1;
-			return (_stateRef_current_nativeStyleUpdate1 = (_stateRef_current_nativeStyleUpdate = (_stateRef_current2 = stateRef.current).nativeStyleUpdate) === null || _stateRef_current_nativeStyleUpdate === void 0 ? void 0 : _stateRef_current_nativeStyleUpdate.call(_stateRef_current2, next)) !== null && _stateRef_current_nativeStyleUpdate1 !== void 0 ? _stateRef_current_nativeStyleUpdate1 : false;
+			return (_stateRef_current_nativeStyleUpdate1 = (_stateRef_current_nativeStyleUpdate = (_stateRef_current3 = stateRef.current).nativeStyleUpdate) === null || _stateRef_current_nativeStyleUpdate === void 0 ? void 0 : _stateRef_current_nativeStyleUpdate.call(_stateRef_current3, next)) !== null && _stateRef_current_nativeStyleUpdate1 !== void 0 ? _stateRef_current_nativeStyleUpdate1 : false;
 		});
 		if (process.env.NODE_ENV === "development") {
 			if (debugProp && debugProp !== "profile") {
@@ -373,7 +368,7 @@ ${banner}
 		if (process.env.NODE_ENV === "development" && time) time`theme`;
 		if (!isAnimatedCustomComponent) elementType = element || elementType;
 		var isStringElement = typeof elementType === "string";
-		var mediaState = (0, import_useMedia.useMedia)(componentContext, debugProp, stateRef.current);
+		var mediaState = (0, import_useMedia.useMedia)(stateRef.current, debugProp, stateRef.current);
 		(0, import_createVariable.setDidGetVariableValue)(false);
 		if (process.env.NODE_ENV === "development" && time) time`media`;
 		var styleProps = {
@@ -385,7 +380,8 @@ ${banner}
 			willBeAnimated,
 			canPlatformPseudo: componentState.platformPseudo,
 			displayName,
-			styledContext: styledContextValue
+			styledContext: styledContextValue,
+			prevStyle: import_constants.isWeb ? void 0 : stateRef.current.prevStyle
 		};
 		var themeName = (themeState === null || themeState === void 0 ? void 0 : themeState.name) || "";
 		if (process.env.NODE_ENV === "development" && time) time`split-styles-prepare`;
@@ -570,7 +566,7 @@ ${banner}
 				};
 			}
 		}
-		var hasEnterExitTransition = props.transition && _type_of(props.transition) === "object" && !Array.isArray(props.transition) && ("enter" in props.transition || "exit" in props.transition);
+		var hasEnterExitTransition = props.transition && typeof props.transition === "object" && !Array.isArray(props.transition) && ("enter" in props.transition || "exit" in props.transition);
 		if (!isPassthrough && (hasAnimationProp || groupName || platformPseudo) && (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) && !hasEnterExitTransition) {
 			let updateGroupListeners2 = function() {
 				var updatedState = stateRef.current.nextState;
@@ -579,6 +575,7 @@ ${banner}
 					notifyGroupSubscribers(groupContext, stateRef.current.group || null, childrenGroupState);
 				}
 			};
+			var _stateRef_current2;
 			var ogSetStateShallow = setStateShallow;
 			stateRef.current.updateStyleListener = function() {
 				var useStyleListener = stateRef.current.useStyleListener;
@@ -597,39 +594,19 @@ ${banner}
 				var effectiveTransition2 = (_ref5 = (_nextStyles_effectiveTransition = nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.effectiveTransition) !== null && _nextStyles_effectiveTransition !== void 0 ? _nextStyles_effectiveTransition : props.transition) !== null && _ref5 !== void 0 ? _ref5 : platformPseudo ? "0ms" : void 0;
 				stateRef.current.prevPseudoState = (0, import_extractPseudoState.extractPseudoState)(updatedState);
 				var hasActivePseudo = Boolean(updatedState.hover || updatedState.press || updatedState.pressIn || updatedState.focus || updatedState.focusWithin);
-				useStyleListener((nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.style) || {}, effectiveTransition2, hasActivePseudo);
-			};
-			componentContext.mediaEmitListeners = componentContext.mediaEmitListeners || /* @__PURE__ */ new Set();
-			if (!stateRef.current.mediaEmitCleanup) {
-				var updateListener = function(next) {
-					var _stateRef_current_updateStyleListener, _stateRef_current2;
-					stateRef.current.nextMedia = next;
-					(_stateRef_current_updateStyleListener = (_stateRef_current2 = stateRef.current).updateStyleListener) === null || _stateRef_current_updateStyleListener === void 0 || _stateRef_current_updateStyleListener.call(_stateRef_current2);
-				};
-				componentContext.mediaEmitListeners.add(updateListener);
-				stateRef.current.mediaEmitCleanup = function() {
-					var _componentContext_mediaEmitListeners;
-					(_componentContext_mediaEmitListeners = componentContext.mediaEmitListeners) === null || _componentContext_mediaEmitListeners === void 0 || _componentContext_mediaEmitListeners.delete(updateListener);
-				};
-			}
-			componentContext.mediaEmit = componentContext.mediaEmit || function(next) {
-				var _iteratorNormalCompletion2 = true, _didIteratorError2 = false, _iteratorError2 = void 0;
-				try {
-					for (var _iterator2 = componentContext.mediaEmitListeners[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
-						var listener = _step2.value;
-						listener(next);
-					}
-				} catch (err) {
-					_didIteratorError2 = true;
-					_iteratorError2 = err;
-				} finally {
-					try {
-						if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
-					} finally {
-						if (_didIteratorError2) throw _iteratorError2;
-					}
-				}
+				useStyleListener((nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.style) || {}, effectiveTransition2, hasActivePseudo, nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.nativeTextMetrics);
 			};
+			(_stateRef_current2 = stateRef.current).mediaEmit || (_stateRef_current2.mediaEmit = function(next) {
+				var sr2 = stateRef.current;
+				sr2.nextMedia = next;
+				if (sr2.mediaEmitQueued) return;
+				sr2.mediaEmitQueued = true;
+				queueMicrotask(function() {
+					var _sr_updateStyleListener;
+					sr2.mediaEmitQueued = false;
+					(_sr_updateStyleListener = sr2.updateStyleListener) === null || _sr_updateStyleListener === void 0 || _sr_updateStyleListener.call(sr2);
+				});
+			});
 			stateRef.current.setStateShallow = function(nextOrGetNext) {
 				var prev = stateRef.current.nextState || state;
 				var next = typeof nextOrGetNext === "function" ? nextOrGetNext(prev) : nextOrGetNext;
@@ -645,7 +622,7 @@ ${banner}
 				};
 				stateRef.current.nextState = updatedState;
 				if (canAvoidReRender) {
-					var _stateRef_current_updateStyleListener, _stateRef_current2;
+					var _stateRef_current_updateStyleListener, _stateRef_current3;
 					if (process.env.NODE_ENV === "development" && debugProp && debugProp !== "profile") {
 						console.groupCollapsed(`[\u26A1\uFE0F] avoid setState`, displayName, next, {
 							updatedState,
@@ -655,7 +632,7 @@ ${banner}
 						console.groupEnd();
 					}
 					updateGroupListeners2();
-					(_stateRef_current_updateStyleListener = (_stateRef_current2 = stateRef.current).updateStyleListener) === null || _stateRef_current_updateStyleListener === void 0 || _stateRef_current_updateStyleListener.call(_stateRef_current2);
+					(_stateRef_current_updateStyleListener = (_stateRef_current3 = stateRef.current).updateStyleListener) === null || _stateRef_current_updateStyleListener === void 0 || _stateRef_current_updateStyleListener.call(_stateRef_current3);
 				} else {
 					if (process.env.NODE_ENV === "development" && debugProp && debugProp !== "profile") console.info(`[\u{1F40C}] re-render`, {
 						canAvoidReRender,
@@ -665,8 +642,8 @@ ${banner}
 				}
 			};
 			setStateShallow = function(state2) {
-				var _stateRef_current_setStateShallow, _stateRef_current2;
-				(_stateRef_current_setStateShallow = (_stateRef_current2 = stateRef.current).setStateShallow) === null || _stateRef_current_setStateShallow === void 0 || _stateRef_current_setStateShallow.call(_stateRef_current2, state2);
+				var _stateRef_current_setStateShallow, _stateRef_current3;
+				(_stateRef_current_setStateShallow = (_stateRef_current3 = stateRef.current).setStateShallow) === null || _stateRef_current_setStateShallow === void 0 || _stateRef_current_setStateShallow.call(_stateRef_current3, state2);
 			};
 		}
 		if (process.env.NODE_ENV === "development" && time) time`split-styles`;
@@ -683,20 +660,23 @@ ${banner}
 		(0, import_useMedia.setMediaShouldUpdate)(stateRef.current, shouldListenForMedia, mediaListeningKeys, stateRef.current.optimizeForFirstRender);
 		var { viewProps: viewPropsIn, style: splitStylesStyle, classNames, pseudoGroups, mediaGroups } = splitStyles || {};
 		var groupSetRevision = (0, import_subscribeToContextGroup.useGroupSetRevision)(pseudoGroups, mediaGroups);
+		if (!import_constants.isWeb) stateRef.current.prevStyle = splitStylesStyle || null;
 		var propsWithAnimation = props;
-		var { asChild, children, themeShallow, spaceDirection: _spaceDirection, onPress, onLongPress, onPressIn, onPressOut, onHoverIn, onHoverOut, onMouseUp, onMouseDown, onMouseEnter, onMouseLeave, onFocus, onBlur, onTransition, separator, passThrough, forceStyle: _forceStyle, onClick, theme: _themeProp, ...nonTamaguiProps } = viewPropsIn || {};
+		var { asChild, children, themeShallow, onPress, onLongPress, onPressIn, onPressOut, onHoverIn, onHoverOut, onMouseUp, onMouseDown, onMouseEnter, onMouseLeave, onFocus, onBlur, onTransition, separator, passThrough, forceStyle: _forceStyle, onClick, theme: _themeProp, ...nonTamaguiProps } = viewPropsIn || {};
 		var viewProps = nonTamaguiProps;
 		if (props.forceStyle) viewProps.forceStyle = props.forceStyle;
 		if (isHOC) {
-			if (typeof _themeProp !== "undefined") viewProps.theme = _themeProp;
+			if (typeof _themeProp !== "undefined" && !hocThemesSelf) viewProps.theme = _themeProp;
 			if (typeof passThrough !== "undefined") viewProps.passThrough = passThrough;
 			if (typeof asChild !== "undefined") viewProps.asChild = asChild;
 			if (typeof onTransition !== "undefined") viewProps.onTransition = onTransition;
 		}
 		var animationStyles;
+		var animatedText = isText && (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.nativeTextMetrics) && !splitStyles.nativeTextMetrics.inheritsFontSize ? null : componentContext.animatedText;
 		var shouldUseAnimation = (inputStyle === "css" ? willBeAnimatedClient : willBeAnimated) && useAnimations && !isHOC;
 		var animatedRef;
 		if (shouldUseAnimation) {
+			var _splitStyles_nativeTextMetrics;
 			var useStyleEmitter = (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) ? function(listener) {
 				stateRef.current.useStyleListener = listener;
 			} : void 0;
@@ -705,6 +685,7 @@ ${banner}
 			if (splitStyles) splitStyles.effectiveTransition = effectiveTransition;
 			stateRef.current.prevPseudoState = (0, import_extractPseudoState.extractPseudoState)(state);
 			var animations = useAnimations({
+				inheritedText: (splitStyles === null || splitStyles === void 0 ? void 0 : (_splitStyles_nativeTextMetrics = splitStyles.nativeTextMetrics) === null || _splitStyles_nativeTextMetrics === void 0 ? void 0 : _splitStyles_nativeTextMetrics.inheritsFontSize) ? componentContext.animatedText : null,
 				props: propsWithAnimation,
 				style: isHydrated ? splitStylesStyle || {} : { ...splitStylesStyle },
 				styleState: splitStyles,
@@ -719,6 +700,7 @@ ${banner}
 				onTransition
 			});
 			if (animations) {
+				animatedText = animations.textChannel;
 				if (animations.ref) animatedRef = animations.ref;
 				if (isHydrated && animations) {
 					animationStyles = animations.style;
@@ -742,12 +724,23 @@ ${banner}
 			stateRef.current.hasMeasured = true;
 		});
 		viewProps = ((_hooks_usePropsTransform = import_setupHooks.hooks.usePropsTransform) === null || _hooks_usePropsTransform === void 0 ? void 0 : _hooks_usePropsTransform.call(import_setupHooks.hooks, elementType, nonTamaguiProps, stateRef, stateRef.current.willHydrate)) || nonTamaguiProps;
+		stateRef.current.composedForwardedRef = forwardedRef;
 		if (!stateRef.current.composedRef) stateRef.current.composedRef = (0, import_compose_refs.composeRefs)(function(x) {
 			stateRef.current.host = x;
 			(0, import_nativeStyleEngine.updateNativeStyleLink)(stateRef.current, x);
-		}, forwardedRef, import_setElementProps.setElementProps, animatedRef);
+			var current = stateRef.current.composedForwardedRef;
+			stateRef.current.attachedForwardedRef = x ? current : void 0;
+			(0, import_compose_refs.setRef)(current, x);
+		}, import_setElementProps.setElementProps, animatedRef);
 		viewProps.ref = stateRef.current.composedRef;
 		if (onClick !== void 0 && ((_staticConfig_neverSkipProps = staticConfig.neverSkipProps) === null || _staticConfig_neverSkipProps === void 0 ? void 0 : _staticConfig_neverSkipProps.onClick)) viewProps.onClick = onClick;
+		(0, import_constants.useIsomorphicLayoutEffect)(function() {
+			var attached = stateRef.current.attachedForwardedRef;
+			if (attached === forwardedRef) return;
+			if (attached) (0, import_compose_refs.setRef)(attached, null);
+			stateRef.current.attachedForwardedRef = forwardedRef;
+			if (stateRef.current.host) (0, import_compose_refs.setRef)(forwardedRef, stateRef.current.host);
+		}, [forwardedRef]);
 		(0, import_pointerEvents.usePointerEvents)(props, viewProps);
 		if (process.env.NODE_ENV === "development") {
 			if (!isText && import_constants.isWeb && !isHOC) import_react.default.Children.toArray(props.children).forEach(function(item) {
@@ -802,10 +795,7 @@ ${banner}
 		}, [state.unmounted, inputStyle]);
 		(0, import_constants.useIsomorphicLayoutEffect)(function() {
 			return function() {
-				var _stateRef_current_mediaEmitCleanup, _stateRef_current2;
 				componentSetStates.delete(setState);
-				(_stateRef_current_mediaEmitCleanup = (_stateRef_current2 = stateRef.current).mediaEmitCleanup) === null || _stateRef_current_mediaEmitCleanup === void 0 || _stateRef_current_mediaEmitCleanup.call(_stateRef_current2);
-				stateRef.current.mediaEmitCleanup = void 0;
 			};
 		}, []);
 		(0, import_constants.useIsomorphicLayoutEffect)(function() {
@@ -942,6 +932,18 @@ ${banner}
 				}
 			}
 		} : null;
+		(0, import_constants.useIsomorphicLayoutEffect)(function() {
+			var hadPressPlumbing = stateRef.current.hadAttachPress;
+			stateRef.current.hadAttachPress = attachPress;
+			if (hadPressPlumbing && !attachPress && !(pseudoGroups === null || pseudoGroups === void 0 ? void 0 : pseudoGroups.size)) {
+				var _stateRef_current_setStateShallow;
+				var clearPress = (_stateRef_current_setStateShallow = stateRef.current.setStateShallow) !== null && _stateRef_current_setStateShallow !== void 0 ? _stateRef_current_setStateShallow : stateRef.current.baseSetStateShallow;
+				clearPress === null || clearPress === void 0 || clearPress({
+					press: false,
+					pressIn: false
+				});
+			}
+		}, [attachPress, pseudoGroups]);
 		if (events && !asChild) Object.assign(events, {
 			cancelable: !viewProps.rejectResponderTermination,
 			disabled,
@@ -990,13 +992,21 @@ ${banner}
 				}
 			}
 			if (!content) {
+				var _splitStyles_nativeTextMetrics1;
 				if (isRenderPropString && elementType["acceptRenderProp"]) viewProps.render = renderProp;
 				content = /* @__PURE__ */ import_react.default.createElement(elementType, viewProps, content || children);
+				if (!shouldUseAnimation && !isHOC && !staticConfig.isDOM && !asChild && (splitStyles === null || splitStyles === void 0 ? void 0 : (_splitStyles_nativeTextMetrics1 = splitStyles.nativeTextMetrics) === null || _splitStyles_nativeTextMetrics1 === void 0 ? void 0 : _splitStyles_nativeTextMetrics1.inheritsFontSize) && componentContext.animatedText && (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.useTextMetrics)) content = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_NativeTextBinding.NativeTextBinding, {
+					element: content,
+					useTextMetrics: animationDriver.useTextMetrics,
+					inheritedText: componentContext.animatedText,
+					lineHeight: splitStyles.nativeTextMetrics.lineHeight,
+					isInput: staticConfig.isInput
+				});
 			}
 			if (process.env.NODE_ENV === "development" && time) time`use-children`;
 		}
 		var isCompositeComponent = !isHOC && Component && typeof Component !== "string";
-		content = (0, import_eventHandling.wrapWithGestureDetector)(content, pressGesture, stateRef, isHOC, isCompositeComponent, hasRealPressEvents);
+		content = (0, import_eventHandling.wrapWithGestureDetector)(content, pressGesture, stateRef, isHOC, isCompositeComponent, hasRealPressEvents && !isInsideNativeMenu);
 		var ResetPresence = (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.isStub) ? void 0 : animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.ResetPresence;
 		var needsReset = Boolean(!asChild && splitStyles && !isHOC && ResetPresence && willBeAnimated && (hasEnterStyle || presenceState));
 		var hasEverReset = stateRef.current.hasEverResetPresence;
@@ -1006,15 +1016,25 @@ ${banner}
 			children: content
 		});
 		if (process.env.NODE_ENV === "development" && time) time`create-element`;
-		if (conditionalStates === null || conditionalStates === void 0 ? void 0 : conditionalStates.has("focus-within")) content = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ComponentContext.ComponentContext.Provider, {
-			...componentContext,
-			setParentFocusState: setStateShallow,
-			children: content
-		});
 		if (groupName || isContainer) content = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_GroupContext.GroupContext.Provider, {
 			value: allGroupContexts,
 			children: content
 		});
+		var textMetrics = !staticConfig.isDOM && !isHOC && isText && !(asChild && (0, import_isTamaguiElement.isTamaguiElement)(children)) ? splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.nativeTextMetrics : void 0;
+		var provideText = !!textMetrics && children !== null && typeof children === "object" && (!componentContext.inText || textMetrics.fontSize !== componentContext.parentFontSize || textMetrics.lineHeight !== componentContext.parentLineHeight || animatedText !== componentContext.animatedText);
+		var provideFocus = conditionalStates === null || conditionalStates === void 0 ? void 0 : conditionalStates.has("focus-within");
+		if (provideText || provideFocus) {
+			var _textMetrics_fontSize;
+			content = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ComponentContext.ComponentContext.Provider, {
+				...componentContext,
+				inText: provideText || componentContext.inText,
+				parentFontSize: (_textMetrics_fontSize = textMetrics === null || textMetrics === void 0 ? void 0 : textMetrics.fontSize) !== null && _textMetrics_fontSize !== void 0 ? _textMetrics_fontSize : componentContext.parentFontSize,
+				parentLineHeight: textMetrics ? textMetrics.lineHeight : componentContext.parentLineHeight,
+				animatedText,
+				setParentFocusState: provideFocus ? setStateShallow : componentContext.setParentFocusState,
+				children: content
+			});
+		}
 		if (process.env.NODE_ENV === "development" && time) time`group-context`;
 		content = disableTheme || !splitStyles ? content : (0, import_Theme.getThemedChildren)(themeState, content, themeStateProps, false, stateRef);
 		if (process.env.NODE_ENV === "development" && time) time`themed-children`;
@@ -1028,7 +1048,7 @@ ${banner}
 			});
 		}
 		if (process.env.NODE_ENV === "development" && time) time`context-override`;
-		if (!process.env.TAMAGUI_DID_OUTPUT_CSS && false);
+		if (process.env.TAMAGUI_RUNTIME !== "island" && false);
 		if (process.env.NODE_ENV === "development" && time) time`style-tags`;
 		if (process.env.NODE_ENV === "development") {
 			if (debugProp && debugProp !== "profile") {
@@ -1136,7 +1156,7 @@ var fromPx = function(val) {
 var getCustomRender = function(renderProp, content, viewProps, state) {
 	if (typeof renderProp === "function") renderProp = getRenderElementForPlatform(renderProp(viewProps, state));
 	if (renderProp) {
-		if ((typeof renderProp === "undefined" ? "undefined" : _type_of(renderProp)) === "object" && /* @__PURE__ */ import_react.default.isValidElement(renderProp)) {
+		if (typeof renderProp === "object" && /* @__PURE__ */ import_react.default.isValidElement(renderProp)) {
 			if (getRenderElementForPlatform(renderProp)) {
 				var elementProps = renderProp.props;
 				var mergedProps = elementProps ? (0, import_mergeRenderElementProps.mergeRenderElementProps)(elementProps, viewProps, content) : viewProps;