tamagui 2.2.0 → 2.3.1

package/.turbo/turbo-build.log

@@ -1,5 +1,4 @@
-
-$ tamagui-build
-built tamagui in 1777 ms
-Running afterBuild script...
-afterBuild completed in 409 ms
+$ tamagui-build
+built tamagui in 958 ms
+Running afterBuild script...
+afterBuild completed in 261 ms

package/dist/native.cjs

@@ -1021,7 +1021,7 @@ var init_index_native$11 = __esmMin((() => {
 	avoidUpdates = true;
 	queuedUpdates = /* @__PURE__ */ new Map();
 	if (ENABLE) {
-		let ensureRectFetchObserver = function() {
+		let ensureRectFetchObserver2 = function() {
 			if (rectFetchObserver) return rectFetchObserver;
 			rectFetchObserver = new IntersectionObserver(function(entries) {
 				lastCallbackDelay = Math.round(performance.now() - rectFetchStartTime);
@@ -1118,7 +1118,7 @@ var init_index_native$11 = __esmMin((() => {
 						}
 					}
 					if (visibleNodes.length > 0) {
-						var io = ensureRectFetchObserver();
+						var io = ensureRectFetchObserver2();
 						rectFetchStartTime = performance.now();
 						for (var i = 0; i < visibleNodes.length; i++) io.observe(visibleNodes[i]);
 						var _iteratorNormalCompletion1 = true, _didIteratorError1 = false, _iteratorError1 = void 0;
@@ -11838,9 +11838,19 @@ var init_constants_native$1 = __esmMin((() => {
 	}[Platform.OS] : void 0) || "native";
 }));
 //#endregion
+//#region ../../core/constants/dist/esm/platformDriver.native.js
+function getPlatformDriver() {
+	return platformDriver;
+}
+var platformDriver;
+var init_platformDriver_native = __esmMin((() => {
+	platformDriver = null;
+}));
+//#endregion
 //#region ../../core/constants/dist/esm/index.native.js
 var init_index_native$7 = __esmMin((() => {
 	init_constants_native$1();
+	init_platformDriver_native();
 }));
 //#endregion
 //#region ../../core/web/dist/esm/constants/constants.native.js
@@ -11922,6 +11932,7 @@ var init_config_native = __esmMin((() => {
 	};
 	updateConfig = function(key, value) {
 		var config = getConfigFromGlobalOrLocal();
+		if (!config || !Object.prototype.hasOwnProperty.call(config, key)) return;
 		Object.assign(config[key], value);
 	};
 	getFont = function(name) {
@@ -13947,10 +13958,17 @@ function useMainThreadPressEvents(events, viewProps) {
 		ref.current.pressOutTimer = null;
 		ref.current.longPressTimer = null;
 	}
-	viewProps.onStartShouldSetResponder = function() {
-		return !events.disabled;
+	var userStartShouldSet = viewProps.onStartShouldSetResponder;
+	var userGrant = viewProps.onResponderGrant;
+	var userRelease = viewProps.onResponderRelease;
+	var userTerminate = viewProps.onResponderTerminate;
+	var userTerminationRequest = viewProps.onResponderTerminationRequest;
+	var userMove = viewProps.onResponderMove;
+	viewProps.onStartShouldSetResponder = function(e) {
+		return Boolean(userStartShouldSet === null || userStartShouldSet === void 0 ? void 0 : userStartShouldSet(e)) || !events.disabled;
 	};
 	viewProps.onResponderGrant = function(e) {
+		userGrant === null || userGrant === void 0 || userGrant(e);
 		cleanup();
 		ref.current.state = "pressing";
 		if (delayPressIn > 0) ref.current.pressInTimer = setTimeout(function() {
@@ -13966,6 +13984,7 @@ function useMainThreadPressEvents(events, viewProps) {
 		}, delayLongPress + delayPressIn);
 	};
 	viewProps.onResponderRelease = function(e) {
+		userRelease === null || userRelease === void 0 || userRelease(e);
 		var wasLongPressed = ref.current.state === "longPressed";
 		cleanup();
 		if (ref.current.state === "pressing") activate(e);
@@ -13977,15 +13996,18 @@ function useMainThreadPressEvents(events, viewProps) {
 		ref.current.state = "idle";
 	};
 	viewProps.onResponderTerminate = function(e) {
+		userTerminate === null || userTerminate === void 0 || userTerminate(e);
 		cleanup();
 		if (ref.current.state === "active" || ref.current.state === "longPressed") deactivate(e);
 		ref.current.state = "idle";
 	};
-	viewProps.onResponderTerminationRequest = function() {
+	viewProps.onResponderTerminationRequest = function(e) {
+		if (userTerminationRequest) return userTerminationRequest(e);
 		return events.cancelable !== false;
 	};
 	viewProps.onResponderMove = function(e) {
 		var _events_onPressMove;
+		userMove === null || userMove === void 0 || userMove(e);
 		(_events_onPressMove = events.onPressMove) === null || _events_onPressMove === void 0 || _events_onPressMove.call(events, e);
 	};
 }
@@ -14439,11 +14461,11 @@ var init_expandStyle_native = __esmMin((() => {
 	init_parseBorderShorthand_native();
 	init_parseOutlineShorthand_native();
 	init_objectSpread2();
-	_loop = function(parent) {
+	_loop = function(parent2) {
 		var _exec;
 		var _exec_index;
-		var prefix = parent.slice(0, (_exec_index = (_exec = /[A-Z]/.exec(parent)) === null || _exec === void 0 ? void 0 : _exec.index) !== null && _exec_index !== void 0 ? _exec_index : parent.length);
-		EXPANSIONS[parent] = EXPANSIONS[parent].map(function(k) {
+		var prefix = parent2.slice(0, (_exec_index = (_exec = /[A-Z]/.exec(parent2)) === null || _exec === void 0 ? void 0 : _exec.index) !== null && _exec_index !== void 0 ? _exec_index : parent2.length);
+		EXPANSIONS[parent2] = EXPANSIONS[parent2].map(function(k) {
 			return `${prefix}${k}`;
 		});
 	};
@@ -16496,7 +16518,7 @@ var init_useComponentState_native = __esmMin((() => {
 	init_objectSpread2();
 	useComponentState = function(props, animationDriver, staticConfig, config) {
 		"use no memo";
-		var _animationDriver_usePresence;
+		var _getPlatformDriver, _animationDriver_usePresence;
 		var isHydrated = useDidFinishSSR();
 		var needsHydration = !useIsClientOnly();
 		var useAnimations = (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.isStub) ? void 0 : animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.useAnimations;
@@ -16510,8 +16532,9 @@ var init_useComponentState_native = __esmMin((() => {
 		var outputStyle = (_animationDriver_outputStyle = animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.outputStyle) !== null && _animationDriver_outputStyle !== void 0 ? _animationDriver_outputStyle : "css";
 		var curStateRef = stateRef.current;
 		if (!needsHydration && hasAnimationProp) curStateRef.hasAnimated = true;
+		var platformPseudo = Boolean(!isHOC && useAnimations && (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) && ((_getPlatformDriver = getPlatformDriver()) === null || _getPlatformDriver === void 0 ? void 0 : _getPlatformDriver.pseudo) && ("hoverStyle" in props || "pressStyle" in props || "focusStyle" in props));
 		var willBeAnimatedClient = function() {
-			return Boolean(!!(hasAnimationProp && !isHOC && useAnimations) || curStateRef.hasAnimated);
+			return Boolean(!!((hasAnimationProp || platformPseudo) && !isHOC && useAnimations) || curStateRef.hasAnimated);
 		}();
 		var willBeAnimated = willBeAnimatedClient;
 		if (willBeAnimated && !curStateRef.hasAnimated) curStateRef.hasAnimated = true;
@@ -16568,7 +16591,8 @@ var init_useComponentState_native = __esmMin((() => {
 			inputStyle,
 			outputStyle,
 			willBeAnimated,
-			willBeAnimatedClient
+			willBeAnimatedClient,
+			platformPseudo
 		};
 	};
 	isDisabled = function(props) {
@@ -16676,13 +16700,30 @@ function createComponent(staticConfig) {
 		}();
 		var useAnimations = animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.useAnimations;
 		var componentState = useComponentState(props, (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.isStub) ? null : animationDriver, staticConfig, config);
-		var { disabled, groupName, hasAnimationProp, hasEnterStyle, isAnimated, isExiting, isHydrated, presence, presenceState, setState, noClass, state, stateRef, inputStyle, outputStyle, willBeAnimated, willBeAnimatedClient, startedUnhydrated } = componentState;
+		var { disabled, groupName, hasAnimationProp, hasEnterStyle, isAnimated, isExiting, isHydrated, presence, presenceState, setState, noClass, state, stateRef, inputStyle, outputStyle, willBeAnimated, willBeAnimatedClient, platformPseudo, startedUnhydrated } = componentState;
 		if (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) useIsomorphicLayoutEffect(function() {
+			var emitted = stateRef.current.prevPseudoState;
+			if (emitted && (emitted.hover || emitted.press || emitted.focus)) {
+				var _stateRef_current_updateStyleListener, _stateRef_current;
+				(_stateRef_current_updateStyleListener = (_stateRef_current = stateRef.current).updateStyleListener) === null || _stateRef_current_updateStyleListener === void 0 || _stateRef_current_updateStyleListener.call(_stateRef_current);
+			}
 			var pendingState = stateRef.current.nextState;
 			if (!pendingState) return;
 			stateRef.current.nextState = void 0;
 			if (!isEqualShallow(state, pendingState)) componentState.setStateShallow(pendingState);
 		});
+		useIsomorphicLayoutEffect(function() {
+			var _getPlatformDriver;
+			if (!platformPseudo || props.disabled) return;
+			var pseudoDriver = (_getPlatformDriver = getPlatformDriver()) === null || _getPlatformDriver === void 0 ? void 0 : _getPlatformDriver.pseudo;
+			var host = stateRef.current.host;
+			if (!pseudoDriver || !host) return;
+			return pseudoDriver.subscribe(host, function(param) {
+				var { hovered } = param;
+				var _stateRef_current_setStateShallow, _stateRef_current;
+				(_stateRef_current_setStateShallow = (_stateRef_current = stateRef.current).setStateShallow) === null || _stateRef_current_setStateShallow === void 0 || _stateRef_current_setStateShallow.call(_stateRef_current, { hover: hovered });
+			});
+		}, [platformPseudo, props.disabled]);
 		var allGroupContexts = (0, react$1.useMemo)(function() {
 			var _stateRef_current_group_listeners, _stateRef_current_group;
 			if (!groupName || props.passThrough) return groupContextParent;
@@ -16778,7 +16819,7 @@ function createComponent(staticConfig) {
 			}
 		}
 		var hasEnterExitTransition = props.transition && _type_of$7(props.transition) === "object" && !Array.isArray(props.transition) && ("enter" in props.transition || "exit" in props.transition);
-		if (!isPassthrough && (hasAnimationProp || groupName) && (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) && !hasEnterExitTransition) {
+		if (!isPassthrough && (hasAnimationProp || groupName || platformPseudo) && (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) && !hasEnterExitTransition) {
 			let updateGroupListeners2 = function() {
 				var updatedState = stateRef.current.nextState;
 				if (groupContext) {
@@ -16797,9 +16838,11 @@ function createComponent(staticConfig) {
 				var updatedState = stateRef.current.nextState || state;
 				var mediaState2 = stateRef.current.nextMedia;
 				var nextStyles = getSplitStyles(props, staticConfig, theme, themeName, updatedState, mediaState2 ? _objectSpread2(_objectSpread2({}, styleProps), {}, { mediaState: mediaState2 }) : styleProps, null, componentContext, allGroupContexts, elementType, startedUnhydrated, debugProp, animationDriver);
-				var effectiveTransition2 = resolveEffectivePseudoTransition(stateRef.current.prevPseudoState, updatedState, nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.pseudoTransitions, props.transition);
+				var _props_transition2;
+				var effectiveTransition2 = resolveEffectivePseudoTransition(stateRef.current.prevPseudoState, updatedState, nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.pseudoTransitions, (_props_transition2 = props.transition) !== null && _props_transition2 !== void 0 ? _props_transition2 : platformPseudo ? "0ms" : void 0);
 				stateRef.current.prevPseudoState = extractPseudoState(updatedState);
-				useStyleListener((nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.style) || {}, effectiveTransition2);
+				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) {
@@ -16877,7 +16920,8 @@ function createComponent(staticConfig) {
 			var useStyleEmitter = (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) ? function(listener) {
 				stateRef.current.useStyleListener = listener;
 			} : void 0;
-			var effectiveTransition = resolveEffectivePseudoTransition(stateRef.current.prevPseudoState, state, splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.pseudoTransitions, props.transition);
+			var _props_transition;
+			var effectiveTransition = resolveEffectivePseudoTransition(stateRef.current.prevPseudoState, state, splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.pseudoTransitions, (_props_transition = props.transition) !== null && _props_transition !== void 0 ? _props_transition : platformPseudo ? "0ms" : void 0);
 			if (splitStyles) splitStyles.effectiveTransition = effectiveTransition;
 			stateRef.current.prevPseudoState = extractPseudoState(state);
 			var animations = useAnimations({
@@ -16984,7 +17028,7 @@ function createComponent(staticConfig) {
 		var hasDynamicGroupChildren = Boolean(groupName && state.hasDynGroupChildren);
 		var attachPress = Boolean(hasDynamicGroupChildren || runtimePressStyle || onPress || onPressOut || onPressIn || onMouseDown || onMouseUp || onLongPress || onClick || (pseudos === null || pseudos === void 0 ? void 0 : pseudos.focusVisibleStyle));
 		var runtimeHoverStyle = !disabled && noClass && (pseudos === null || pseudos === void 0 ? void 0 : pseudos.hoverStyle);
-		var needsHoverState = Boolean(hasDynamicGroupChildren || runtimeHoverStyle);
+		var needsHoverState = Boolean(hasDynamicGroupChildren || runtimeHoverStyle && !platformPseudo);
 		var attachHover = isNativeDesktop && !!(hasDynamicGroupChildren || needsHoverState || onMouseEnter || onMouseLeave);
 		var shouldAttach = !disabled && !props.asChild && Boolean(attachFocus || attachPress || attachHover || runtimePressStyle || runtimeHoverStyle || runtimeFocusStyle);
 		var needsPressState = Boolean(hasDynamicGroupChildren || runtimePressStyle);

package/dist/test.cjs

@@ -1021,7 +1021,7 @@ var init_index_native$11 = __esmMin((() => {
 	avoidUpdates = true;
 	queuedUpdates = /* @__PURE__ */ new Map();
 	if (ENABLE) {
-		let ensureRectFetchObserver = function() {
+		let ensureRectFetchObserver2 = function() {
 			if (rectFetchObserver) return rectFetchObserver;
 			rectFetchObserver = new IntersectionObserver(function(entries) {
 				lastCallbackDelay = Math.round(performance.now() - rectFetchStartTime);
@@ -1118,7 +1118,7 @@ var init_index_native$11 = __esmMin((() => {
 						}
 					}
 					if (visibleNodes.length > 0) {
-						var io = ensureRectFetchObserver();
+						var io = ensureRectFetchObserver2();
 						rectFetchStartTime = performance.now();
 						for (var i = 0; i < visibleNodes.length; i++) io.observe(visibleNodes[i]);
 						var _iteratorNormalCompletion1 = true, _didIteratorError1 = false, _iteratorError1 = void 0;
@@ -12016,9 +12016,19 @@ var init_constants_native$1 = __esmMin((() => {
 	}[Platform.OS] : void 0) || "native";
 }));
 //#endregion
+//#region ../../core/constants/dist/esm/platformDriver.native.js
+function getPlatformDriver() {
+	return platformDriver;
+}
+var platformDriver;
+var init_platformDriver_native = __esmMin((() => {
+	platformDriver = null;
+}));
+//#endregion
 //#region ../../core/constants/dist/esm/index.native.js
 var init_index_native$7 = __esmMin((() => {
 	init_constants_native$1();
+	init_platformDriver_native();
 }));
 //#endregion
 //#region ../../core/web/dist/esm/constants/constants.native.js
@@ -12100,6 +12110,7 @@ var init_config_native = __esmMin((() => {
 	};
 	updateConfig = function(key, value) {
 		var config = getConfigFromGlobalOrLocal();
+		if (!config || !Object.prototype.hasOwnProperty.call(config, key)) return;
 		Object.assign(config[key], value);
 	};
 	getFont = function(name) {
@@ -14125,10 +14136,17 @@ function useMainThreadPressEvents(events, viewProps) {
 		ref.current.pressOutTimer = null;
 		ref.current.longPressTimer = null;
 	}
-	viewProps.onStartShouldSetResponder = function() {
-		return !events.disabled;
+	var userStartShouldSet = viewProps.onStartShouldSetResponder;
+	var userGrant = viewProps.onResponderGrant;
+	var userRelease = viewProps.onResponderRelease;
+	var userTerminate = viewProps.onResponderTerminate;
+	var userTerminationRequest = viewProps.onResponderTerminationRequest;
+	var userMove = viewProps.onResponderMove;
+	viewProps.onStartShouldSetResponder = function(e) {
+		return Boolean(userStartShouldSet === null || userStartShouldSet === void 0 ? void 0 : userStartShouldSet(e)) || !events.disabled;
 	};
 	viewProps.onResponderGrant = function(e) {
+		userGrant === null || userGrant === void 0 || userGrant(e);
 		cleanup();
 		ref.current.state = "pressing";
 		if (delayPressIn > 0) ref.current.pressInTimer = setTimeout(function() {
@@ -14144,6 +14162,7 @@ function useMainThreadPressEvents(events, viewProps) {
 		}, delayLongPress + delayPressIn);
 	};
 	viewProps.onResponderRelease = function(e) {
+		userRelease === null || userRelease === void 0 || userRelease(e);
 		var wasLongPressed = ref.current.state === "longPressed";
 		cleanup();
 		if (ref.current.state === "pressing") activate(e);
@@ -14155,15 +14174,18 @@ function useMainThreadPressEvents(events, viewProps) {
 		ref.current.state = "idle";
 	};
 	viewProps.onResponderTerminate = function(e) {
+		userTerminate === null || userTerminate === void 0 || userTerminate(e);
 		cleanup();
 		if (ref.current.state === "active" || ref.current.state === "longPressed") deactivate(e);
 		ref.current.state = "idle";
 	};
-	viewProps.onResponderTerminationRequest = function() {
+	viewProps.onResponderTerminationRequest = function(e) {
+		if (userTerminationRequest) return userTerminationRequest(e);
 		return events.cancelable !== false;
 	};
 	viewProps.onResponderMove = function(e) {
 		var _events_onPressMove;
+		userMove === null || userMove === void 0 || userMove(e);
 		(_events_onPressMove = events.onPressMove) === null || _events_onPressMove === void 0 || _events_onPressMove.call(events, e);
 	};
 }
@@ -14617,11 +14639,11 @@ var init_expandStyle_native = __esmMin((() => {
 	init_parseBorderShorthand_native();
 	init_parseOutlineShorthand_native();
 	init_objectSpread2();
-	_loop = function(parent) {
+	_loop = function(parent2) {
 		var _exec;
 		var _exec_index;
-		var prefix = parent.slice(0, (_exec_index = (_exec = /[A-Z]/.exec(parent)) === null || _exec === void 0 ? void 0 : _exec.index) !== null && _exec_index !== void 0 ? _exec_index : parent.length);
-		EXPANSIONS[parent] = EXPANSIONS[parent].map(function(k) {
+		var prefix = parent2.slice(0, (_exec_index = (_exec = /[A-Z]/.exec(parent2)) === null || _exec === void 0 ? void 0 : _exec.index) !== null && _exec_index !== void 0 ? _exec_index : parent2.length);
+		EXPANSIONS[parent2] = EXPANSIONS[parent2].map(function(k) {
 			return `${prefix}${k}`;
 		});
 	};
@@ -16676,7 +16698,7 @@ var init_useComponentState_native = __esmMin((() => {
 	init_objectSpread2();
 	useComponentState = function(props, animationDriver, staticConfig, config) {
 		"use no memo";
-		var _animationDriver_usePresence;
+		var _getPlatformDriver, _animationDriver_usePresence;
 		var isHydrated = useDidFinishSSR();
 		var needsHydration = !useIsClientOnly();
 		var useAnimations = (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.isStub) ? void 0 : animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.useAnimations;
@@ -16690,8 +16712,9 @@ var init_useComponentState_native = __esmMin((() => {
 		var outputStyle = (_animationDriver_outputStyle = animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.outputStyle) !== null && _animationDriver_outputStyle !== void 0 ? _animationDriver_outputStyle : "css";
 		var curStateRef = stateRef.current;
 		if (!needsHydration && hasAnimationProp) curStateRef.hasAnimated = true;
+		var platformPseudo = Boolean(!isHOC && useAnimations && (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) && ((_getPlatformDriver = getPlatformDriver()) === null || _getPlatformDriver === void 0 ? void 0 : _getPlatformDriver.pseudo) && ("hoverStyle" in props || "pressStyle" in props || "focusStyle" in props));
 		var willBeAnimatedClient = function() {
-			return Boolean(!!(hasAnimationProp && !isHOC && useAnimations) || curStateRef.hasAnimated);
+			return Boolean(!!((hasAnimationProp || platformPseudo) && !isHOC && useAnimations) || curStateRef.hasAnimated);
 		}();
 		var willBeAnimated = willBeAnimatedClient;
 		if (willBeAnimated && !curStateRef.hasAnimated) curStateRef.hasAnimated = true;
@@ -16748,7 +16771,8 @@ var init_useComponentState_native = __esmMin((() => {
 			inputStyle,
 			outputStyle,
 			willBeAnimated,
-			willBeAnimatedClient
+			willBeAnimatedClient,
+			platformPseudo
 		};
 	};
 	isDisabled = function(props) {
@@ -16861,13 +16885,30 @@ function createComponent(staticConfig) {
 		}();
 		var useAnimations = animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.useAnimations;
 		var componentState = useComponentState(props, (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.isStub) ? null : animationDriver, staticConfig, config);
-		var { disabled, groupName, hasAnimationProp, hasEnterStyle, isAnimated, isExiting, isHydrated, presence, presenceState, setState, noClass, state, stateRef, inputStyle, outputStyle, willBeAnimated, willBeAnimatedClient, startedUnhydrated } = componentState;
+		var { disabled, groupName, hasAnimationProp, hasEnterStyle, isAnimated, isExiting, isHydrated, presence, presenceState, setState, noClass, state, stateRef, inputStyle, outputStyle, willBeAnimated, willBeAnimatedClient, platformPseudo, startedUnhydrated } = componentState;
 		if (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) useIsomorphicLayoutEffect(function() {
+			var emitted = stateRef.current.prevPseudoState;
+			if (emitted && (emitted.hover || emitted.press || emitted.focus)) {
+				var _stateRef_current_updateStyleListener, _stateRef_current;
+				(_stateRef_current_updateStyleListener = (_stateRef_current = stateRef.current).updateStyleListener) === null || _stateRef_current_updateStyleListener === void 0 || _stateRef_current_updateStyleListener.call(_stateRef_current);
+			}
 			var pendingState = stateRef.current.nextState;
 			if (!pendingState) return;
 			stateRef.current.nextState = void 0;
 			if (!isEqualShallow(state, pendingState)) componentState.setStateShallow(pendingState);
 		});
+		useIsomorphicLayoutEffect(function() {
+			var _getPlatformDriver;
+			if (!platformPseudo || props.disabled) return;
+			var pseudoDriver = (_getPlatformDriver = getPlatformDriver()) === null || _getPlatformDriver === void 0 ? void 0 : _getPlatformDriver.pseudo;
+			var host = stateRef.current.host;
+			if (!pseudoDriver || !host) return;
+			return pseudoDriver.subscribe(host, function(param) {
+				var { hovered } = param;
+				var _stateRef_current_setStateShallow, _stateRef_current;
+				(_stateRef_current_setStateShallow = (_stateRef_current = stateRef.current).setStateShallow) === null || _stateRef_current_setStateShallow === void 0 || _stateRef_current_setStateShallow.call(_stateRef_current, { hover: hovered });
+			});
+		}, [platformPseudo, props.disabled]);
 		var allGroupContexts = (0, react$1.useMemo)(function() {
 			var _stateRef_current_group_listeners, _stateRef_current_group;
 			if (!groupName || props.passThrough) return groupContextParent;
@@ -16963,7 +17004,7 @@ function createComponent(staticConfig) {
 			}
 		}
 		var hasEnterExitTransition = props.transition && _type_of$7(props.transition) === "object" && !Array.isArray(props.transition) && ("enter" in props.transition || "exit" in props.transition);
-		if (!isPassthrough && (hasAnimationProp || groupName) && (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) && !hasEnterExitTransition) {
+		if (!isPassthrough && (hasAnimationProp || groupName || platformPseudo) && (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) && !hasEnterExitTransition) {
 			let updateGroupListeners2 = function() {
 				var updatedState = stateRef.current.nextState;
 				if (groupContext) {
@@ -16982,9 +17023,11 @@ function createComponent(staticConfig) {
 				var updatedState = stateRef.current.nextState || state;
 				var mediaState2 = stateRef.current.nextMedia;
 				var nextStyles = getSplitStyles(props, staticConfig, theme, themeName, updatedState, mediaState2 ? _objectSpread2(_objectSpread2({}, styleProps), {}, { mediaState: mediaState2 }) : styleProps, null, componentContext, allGroupContexts, elementType, startedUnhydrated, debugProp, animationDriver);
-				var effectiveTransition2 = resolveEffectivePseudoTransition(stateRef.current.prevPseudoState, updatedState, nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.pseudoTransitions, props.transition);
+				var _props_transition2;
+				var effectiveTransition2 = resolveEffectivePseudoTransition(stateRef.current.prevPseudoState, updatedState, nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.pseudoTransitions, (_props_transition2 = props.transition) !== null && _props_transition2 !== void 0 ? _props_transition2 : platformPseudo ? "0ms" : void 0);
 				stateRef.current.prevPseudoState = extractPseudoState(updatedState);
-				useStyleListener((nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.style) || {}, effectiveTransition2);
+				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) {
@@ -17062,7 +17105,8 @@ function createComponent(staticConfig) {
 			var useStyleEmitter = (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) ? function(listener) {
 				stateRef.current.useStyleListener = listener;
 			} : void 0;
-			var effectiveTransition = resolveEffectivePseudoTransition(stateRef.current.prevPseudoState, state, splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.pseudoTransitions, props.transition);
+			var _props_transition;
+			var effectiveTransition = resolveEffectivePseudoTransition(stateRef.current.prevPseudoState, state, splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.pseudoTransitions, (_props_transition = props.transition) !== null && _props_transition !== void 0 ? _props_transition : platformPseudo ? "0ms" : void 0);
 			if (splitStyles) splitStyles.effectiveTransition = effectiveTransition;
 			stateRef.current.prevPseudoState = extractPseudoState(state);
 			var animations = useAnimations({
@@ -17169,7 +17213,7 @@ function createComponent(staticConfig) {
 		var hasDynamicGroupChildren = Boolean(groupName && state.hasDynGroupChildren);
 		var attachPress = Boolean(hasDynamicGroupChildren || runtimePressStyle || onPress || onPressOut || onPressIn || onMouseDown || onMouseUp || onLongPress || onClick || (pseudos === null || pseudos === void 0 ? void 0 : pseudos.focusVisibleStyle));
 		var runtimeHoverStyle = !disabled && noClass && (pseudos === null || pseudos === void 0 ? void 0 : pseudos.hoverStyle);
-		var needsHoverState = Boolean(hasDynamicGroupChildren || runtimeHoverStyle);
+		var needsHoverState = Boolean(hasDynamicGroupChildren || runtimeHoverStyle && !platformPseudo);
 		var attachHover = isNativeDesktop && !!(hasDynamicGroupChildren || needsHoverState || onMouseEnter || onMouseLeave);
 		var shouldAttach = !disabled && !props.asChild && Boolean(attachFocus || attachPress || attachHover || runtimePressStyle || runtimeHoverStyle || runtimeFocusStyle);
 		var needsPressState = Boolean(hasDynamicGroupChildren || runtimePressStyle);

package/package.json

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