tamagui 2.0.0 → 2.1.0

package/.turbo/turbo-build.log

@@ -1,4 +1,4 @@
 $ tamagui-build
-built tamagui in 2588 ms
+built tamagui in 1029 ms
 Running afterBuild script...
-afterBuild completed in 559 ms
+afterBuild completed in 258 ms

package/dist/native.cjs

@@ -26554,6 +26554,7 @@ var closeLastOpenedPopover = function() {
 };
 var PopoverContext = createStyledContext({}, "Popover__");
 var PopoverZIndexContext = /* @__PURE__ */ react$1.createContext(void 0);
+var PopoverAdaptHiddenContext = /* @__PURE__ */ react$1.createContext(true);
 var PopoverTriggerContext = createStyledContext({}, "PopoverTrigger__");
 var usePopoverContext = PopoverContext.useStyledContext;
 var usePopoverTriggerContext = PopoverTriggerContext.useStyledContext;
@@ -26729,8 +26730,11 @@ var PopoverContent = PopperContentFrame.styleable(function PopoverContent2(props
 	useIsomorphicLayoutEffect(function() {
 		if (open && isFullyHidden) setIsFullyHidden(false);
 	}, [open, isFullyHidden]);
+	var isAdaptFullyHidden = react$1.useContext(PopoverAdaptHiddenContext);
 	if (!context.keepChildrenMounted) {
-		if (isFullyHidden && !open) return null;
+		if (context.breakpointActive) {
+			if (!open && isAdaptFullyHidden) return null;
+		} else if (isFullyHidden && !open) return null;
 	}
 	var _contentImplProps_pointerEvents;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PopoverPortal, {
@@ -27015,6 +27019,8 @@ var PopoverSheetController = function(param) {
 	var showSheet = useShowPopoverSheet(context, open);
 	var breakpointActive = context === null || context === void 0 ? void 0 : context.breakpointActive;
 	var getShowSheet = useGet(showSheet);
+	var [isAdaptFullyHidden, setIsAdaptFullyHidden] = react$1.useState(!open);
+	if (open && isAdaptFullyHidden) setIsAdaptFullyHidden(false);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SheetController, {
 		onOpenChange: function(val) {
 			if (getShowSheet()) {
@@ -27022,9 +27028,16 @@ var PopoverSheetController = function(param) {
 				(_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 || _props_onOpenChange.call(props, val);
 			}
 		},
+		onAnimationComplete: react$1.useCallback(function(param2) {
+			var { open: isOpen } = param2;
+			if (!isOpen) setIsAdaptFullyHidden(true);
+		}, []),
 		open,
 		hidden: !breakpointActive,
-		children: props.children
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PopoverAdaptHiddenContext.Provider, {
+			value: isAdaptFullyHidden,
+			children: props.children
+		})
 	});
 };
 var useShowPopoverSheet = function(context, open) {
@@ -28366,7 +28379,10 @@ function setupNativeSheet(platform, RNIOSModal) {
 		}
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(SheetProvider, _objectSpread2(_objectSpread2({
 			setHasScrollView: emptyFn,
-			keyboardOccludedHeight: 0
+			keyboardOccludedHeight: 0,
+			isKeyboardVisible: false,
+			keyboardStableFrameHeight: 0,
+			isKeyboardSeeding: false
 		}, providerProps), {}, {
 			onlyShowFrame: true,
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModalSheetView, {
@@ -28713,6 +28729,9 @@ function getSafeAreaTopInset() {
 	return _cachedSafeAreaTop;
 }
 var relativeDimensionTo = "screen";
+function getStableViewportHeight() {
+	return Dimensions.get(relativeDimensionTo).height;
+}
 var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(function SheetImplementationCustom2(props, forwardedRef) {
 	var parentSheet = react$1.default.useContext(ParentSheetContext);
 	var { transition, transitionConfig: transitionConfigProp, modal = false, zIndex = parentSheet.zIndex + 1, moveOnKeyboardChange = false, unmountChildrenWhenHidden = false, portalProps, containerComponent: ContainerComponent = react$1.default.Fragment, onAnimationComplete } = props;
@@ -28740,22 +28759,37 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 	var onInnerSheet = react$1.default.useCallback(function(hasChild) {
 		setIsShowingInnerSheet(hasChild);
 	}, []);
+	var { keyboardHeight, isKeyboardVisible, dismissKeyboard, pauseKeyboardHandler, flushPendingHide } = useKeyboardControllerSheet({ enabled: Boolean(moveOnKeyboardChange) });
 	var stableFrameSize = react$1.default.useRef(frameSize);
 	react$1.default.useEffect(function() {
 		if (open && frameSize) stableFrameSize.current = frameSize;
 	}, [open, frameSize]);
-	var effectiveFrameSize = open ? frameSize : stableFrameSize.current || frameSize;
+	var isWebKbSheet = false;
+	var hasCleanKbBaseline = react$1.default.useRef(false);
+	var seedSettled = react$1.default.useRef(false);
+	var stableKbGeom = react$1.default.useRef({
+		frame: 0,
+		screen: 0
+	});
+	if (frameSize > 0 && screenSize > 0) {
+		stableKbGeom.current.frame = frameSize;
+		stableKbGeom.current.screen = screenSize;
+		hasCleanKbBaseline.current = true;
+	} else if (isWebKbSheet && isKeyboardVisible && !hasCleanKbBaseline.current && screenSize > 0) stableKbGeom.current.screen = Math.max(stableKbGeom.current.screen, screenSize);
+	var seedingKbBaseline = isWebKbSheet && isKeyboardVisible && !hasCleanKbBaseline.current && !seedSettled.current;
+	var freezeForKb = isWebKbSheet && isKeyboardVisible && stableKbGeom.current.frame > 0;
+	var effScreenSize = freezeForKb ? stableKbGeom.current.screen : screenSize;
+	var effectiveFrameSize = freezeForKb ? stableKbGeom.current.frame : open ? frameSize : stableFrameSize.current || frameSize;
 	var positions = react$1.default.useMemo(function() {
 		return snapPoints.map(function(point) {
-			return getYPositions(snapPointsMode, point, screenSize, effectiveFrameSize);
+			return getYPositions(snapPointsMode, point, effScreenSize, effectiveFrameSize);
 		});
 	}, [
-		screenSize,
+		effScreenSize,
 		effectiveFrameSize,
 		snapPoints,
 		snapPointsMode
 	]);
-	var { keyboardHeight, isKeyboardVisible, dismissKeyboard, pauseKeyboardHandler, flushPendingHide } = useKeyboardControllerSheet({ enabled: Boolean(moveOnKeyboardChange) });
 	var [isDragging, setIsDragging_] = react$1.default.useState(false);
 	var isDraggingRef = react$1.default.useRef(false);
 	var setIsDragging = react$1.default.useCallback(function(val) {
@@ -28785,13 +28819,14 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 		screenSize,
 		isDragging
 	]);
-	var keyboardOccludedHeight = getKeyboardOccludedHeight({
-		frameSize,
+	var keyboardOccludedHeight = seedingKbBaseline ? 0 : getKeyboardOccludedHeight({
+		frameSize: effectiveFrameSize,
 		isKeyboardVisible,
 		keyboardHeight,
-		screenSize,
+		screenSize: effScreenSize,
 		sheetY: position >= 0 ? activePositions[position] : void 0
 	});
+	var keyboardStableFrameHeight = !isWebKbSheet ? 0 : seedingKbBaseline ? stableKbGeom.current.screen || screenSize : stableKbGeom.current.frame > 0 ? stableKbGeom.current.frame : 0;
 	var { useAnimatedNumber, useAnimatedNumberStyle, useAnimatedNumberReaction } = animationDriver;
 	var _animationDriver_View;
 	var AnimatedView = (_animationDriver_View = animationDriver.View) !== null && _animationDriver_View !== void 0 ? _animationDriver_View : View;
@@ -28850,7 +28885,7 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 	}
 	var animateTo = useEvent(function(position2, animationOverride) {
 		if (frameSize === 0) return;
-		var toValue = isHidden || position2 === -1 ? screenSize : activePositions[position2];
+		var toValue = isHidden || position2 === -1 ? effScreenSize : activePositions[position2];
 		if (at.current === toValue) return;
 		at.current = toValue;
 		stopSpring();
@@ -28897,6 +28932,7 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 			return;
 		}
 		if (disableAnimation) return;
+		if (isDraggingRef.current) return;
 		if (!frameSize || !screenSize || isHidden || hasntMeasured && !open) return;
 		animateTo(position);
 		if (position === -1) {
@@ -28933,7 +28969,7 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 		if (disableDrag) return;
 		if (!frameSize) return;
 		if (isShowingInnerSheet) return;
-		var minY = positions[0];
+		var minY = activePositions[0];
 		scrollBridge.paneMinY = minY;
 		var startY = at.current;
 		function setPanning(val) {
@@ -28949,8 +28985,8 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 			var end = at.current + frameSize * vy * .2;
 			var closestPoint = 0;
 			var dist = Number.POSITIVE_INFINITY;
-			for (var i = 0; i < positions.length; i++) {
-				var position2 = positions[i];
+			for (var i = 0; i < activePositions.length; i++) {
+				var position2 = activePositions[i];
 				var curDist = end > position2 ? end - position2 : position2 - end;
 				if (curDist < dist) {
 					dist = curDist;
@@ -28971,6 +29007,7 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 			var { dy } = param;
 			function getShouldSet() {
 				if (e.target === providerProps.handleRef.current) return true;
+				if (scrollBridge.scrollNodeTouched) return false;
 				if (scrollBridge.hasScrollableContent === true) {
 					if (scrollBridge.scrollLock) return false;
 					var isScrolled = scrollBridge.y !== 0;
@@ -28993,6 +29030,10 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 			startY = at.current;
 		};
 		var isExternalDrag = false;
+		scrollBridge.startPanDrag = function() {
+			isExternalDrag = true;
+			grant();
+		};
 		scrollBridge.drag = function(dy) {
 			if (!isExternalDrag) {
 				isExternalDrag = true;
@@ -29027,7 +29068,7 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 		isShowingInnerSheet,
 		animateTo,
 		frameSize,
-		positions,
+		activePositions,
 		setPosition
 	]);
 	react$1.default.useEffect(function() {
@@ -29050,7 +29091,11 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 		animateTo(position);
 	}, [isDragging]);
 	react$1.default.useEffect(function() {
-		if (!open && isKeyboardVisible) dismissKeyboard();
+		if (!open && isKeyboardVisible) {
+			dismissKeyboard();
+			pauseKeyboardHandler.current = false;
+			flushPendingHide();
+		}
 	}, [open]);
 	var { panGesture, panGestureRef, gestureHandlerEnabled } = useGestureHandlerPan({
 		positions: activePositions,
@@ -29072,20 +29117,41 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 		},
 		pauseKeyboardHandler
 	});
+	var ignoreLayoutForKeyboard = useEvent(function() {
+		return false;
+	});
+	var shouldSeedKbFrame = useEvent(function() {
+		return isWebKbSheet && !hasCleanKbBaseline.current && !seedSettled.current && ignoreLayoutForKeyboard();
+	});
+	var shouldSeedKbScreen = useEvent(function() {
+		return isWebKbSheet && !hasCleanKbBaseline.current && ignoreLayoutForKeyboard();
+	});
 	var handleAnimationViewLayout = useEvent(function(e) {
 		var _e_nativeEvent;
 		if (!open && stableFrameSize.current !== 0) return;
+		var seeding = shouldSeedKbFrame();
+		if (!seeding && ignoreLayoutForKeyboard()) return;
 		var layoutHeight = (_e_nativeEvent = e.nativeEvent) === null || _e_nativeEvent === void 0 ? void 0 : _e_nativeEvent.layout.height;
-		var next = modal ? Math.min(layoutHeight, Dimensions.get(relativeDimensionTo).height) : layoutHeight;
+		var next = modal || seeding ? Math.min(layoutHeight, getStableViewportHeight()) : layoutHeight;
 		if (!next) return;
-		setFrameSize(next);
+		var rounded = Math.round(next);
+		if (seeding) {
+			if (rounded > stableKbGeom.current.frame) stableKbGeom.current.frame = rounded;
+			else if (stableKbGeom.current.frame > 0) seedSettled.current = true;
+		}
+		setFrameSize(rounded);
 	});
 	var handleMaxContentViewLayout = react$1.default.useCallback(function(e) {
 		var _e_nativeEvent;
-		var next = Math.min((_e_nativeEvent = e.nativeEvent) === null || _e_nativeEvent === void 0 ? void 0 : _e_nativeEvent.layout.height, Dimensions.get(relativeDimensionTo).height);
+		if (shouldSeedKbScreen()) {
+			setMaxContentSize(Math.round(getStableViewportHeight()));
+			return;
+		}
+		if (ignoreLayoutForKeyboard()) return;
+		var next = Math.min((_e_nativeEvent = e.nativeEvent) === null || _e_nativeEvent === void 0 ? void 0 : _e_nativeEvent.layout.height, getStableViewportHeight());
 		if (!next) return;
-		setMaxContentSize(next);
-	}, []);
+		setMaxContentSize(Math.round(next));
+	}, [ignoreLayoutForKeyboard, shouldSeedKbScreen]);
 	var animatedStyle = useAnimatedNumberStyle(animatedNumber, react$1.default.useCallback(function(val) {
 		"worklet";
 		return { transform: [{ translateY: frameSize === 0 ? hiddenSize : val }] };
@@ -29108,6 +29174,9 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 			value: nextParentContext,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SheetProvider, _objectSpread2(_objectSpread2({}, providerProps), {}, {
 				keyboardOccludedHeight,
+				isKeyboardVisible,
+				keyboardStableFrameHeight,
+				isKeyboardSeeding: seedingKbBaseline,
 				setHasScrollView,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(GestureSheetProvider, {
 					isDragging,
@@ -29338,6 +29407,7 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 	var gestureContext = useGestureSheetContext();
 	var { scrollBridge, setHasScrollView, hasFit, screenSize } = context;
 	var keyboardOccludedHeight = Math.max(0, context.keyboardOccludedHeight || 0);
+	var isKeyboardVisible = context.isKeyboardVisible === true || false;
 	var [scrollEnabled] = useControllableState({
 		prop: scrollEnabledProp,
 		defaultProp: true
@@ -29346,12 +29416,17 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 	var [hasScrollableContent, setHasScrollableContent] = (0, react$1.useState)(true);
 	var parentHeight = (0, react$1.useRef)(0);
 	var contentHeight = (0, react$1.useRef)(0);
-	var keyboardFrozenHeight = hasFit && keyboardOccludedHeight > 0 && parentHeight.current ? parentHeight.current : void 0;
+	var frozenFrameHeight = Math.max(0, context.keyboardStableFrameHeight || 0);
 	var fitSizingStyle = hasFit ? {
 		flex: void 0,
-		height: keyboardFrozenHeight,
+		height: void 0,
 		maxHeight: screenSize || void 0
 	} : { flex: 1 };
+	var isKeyboardSeeding = context.isKeyboardSeeding === true;
+	var keyboardFrozenOverride = hasFit && isKeyboardVisible && frozenFrameHeight > 0 ? isKeyboardSeeding ? { maxHeight: frozenFrameHeight } : {
+		height: frozenFrameHeight,
+		maxHeight: frozenFrameHeight
+	} : null;
 	var panGestureRef = gestureContext === null || gestureContext === void 0 ? void 0 : gestureContext.panGestureRef;
 	var { ScrollView: RNGHScrollView } = getGestureHandlerState();
 	var useRNGHScrollView = isGestureHandlerEnabled() && RNGHScrollView && panGestureRef;
@@ -29396,6 +29471,9 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 	var updateScrollable = function() {
 		if (parentHeight.current && contentHeight.current) setHasScrollableContent(contentHeight.current > parentHeight.current);
 	};
+	var recordFitHeight = function(height) {
+		parentHeight.current = height;
+	};
 	(0, react$1.useEffect)(function() {
 		scrollBridge.hasScrollableContent = hasScrollableContent;
 	}, [hasScrollableContent]);
@@ -29420,14 +29498,14 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 			width: "100%"
 		})]
 	});
-	if (useRNGHScrollView && RNGHScrollView && panGestureRef) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RNGHScrollView, _objectSpread2(_objectSpread2({
+	if (useRNGHScrollView && RNGHScrollView && panGestureRef) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RNGHScrollView, _objectSpread2(_objectSpread2(_objectSpread2({
 		ref: composeRefs(scrollRef, ref),
 		style: fitSizingStyle,
 		scrollEventThrottle: 1,
 		scrollEnabled,
 		simultaneousHandlers: [panGestureRef],
 		onLayout: function(e) {
-			parentHeight.current = Math.ceil(e.nativeEvent.layout.height);
+			recordFitHeight(Math.ceil(e.nativeEvent.layout.height));
 			updateScrollable();
 		},
 		onScroll: function(e) {
@@ -29454,10 +29532,10 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 		bounces: false,
 		keyboardShouldPersistTaps: "always",
 		keyboardDismissMode: "none"
-	}, props), {}, { children: contentWrapper }));
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScrollView, _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({
+	}, props), keyboardFrozenOverride), {}, { children: contentWrapper }));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScrollView, _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({
 		onLayout: function(e) {
-			parentHeight.current = Math.ceil(e.nativeEvent.layout.height);
+			recordFitHeight(Math.ceil(e.nativeEvent.layout.height));
 			updateScrollable();
 		},
 		ref: composeRefs(scrollRef, ref)
@@ -29472,7 +29550,7 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 			onScroll === null || onScroll === void 0 || onScroll(e);
 		},
 		contentContainerStyle: { minHeight: "100%" }
-	}, gestureProps), props), {}, { children: contentWrapper }));
+	}, gestureProps), props), keyboardFrozenOverride), {}, { children: contentWrapper }));
 });
 //#endregion
 //#region ../sheet/dist/esm/useSheetOffscreenSize.native.js

package/dist/test.cjs

@@ -26620,6 +26620,7 @@ var closeLastOpenedPopover = function() {
 };
 var PopoverContext = createStyledContext({}, "Popover__");
 var PopoverZIndexContext = /* @__PURE__ */ react$1.createContext(void 0);
+var PopoverAdaptHiddenContext = /* @__PURE__ */ react$1.createContext(true);
 var PopoverTriggerContext = createStyledContext({}, "PopoverTrigger__");
 var usePopoverContext = PopoverContext.useStyledContext;
 var usePopoverTriggerContext = PopoverTriggerContext.useStyledContext;
@@ -26795,8 +26796,11 @@ var PopoverContent = PopperContentFrame.styleable(function PopoverContent2(props
 	useIsomorphicLayoutEffect(function() {
 		if (open && isFullyHidden) setIsFullyHidden(false);
 	}, [open, isFullyHidden]);
+	var isAdaptFullyHidden = react$1.useContext(PopoverAdaptHiddenContext);
 	if (!context.keepChildrenMounted) {
-		if (isFullyHidden && !open) return null;
+		if (context.breakpointActive) {
+			if (!open && isAdaptFullyHidden) return null;
+		} else if (isFullyHidden && !open) return null;
 	}
 	var _contentImplProps_pointerEvents;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PopoverPortal, {
@@ -27081,6 +27085,8 @@ var PopoverSheetController = function(param) {
 	var showSheet = useShowPopoverSheet(context, open);
 	var breakpointActive = context === null || context === void 0 ? void 0 : context.breakpointActive;
 	var getShowSheet = useGet(showSheet);
+	var [isAdaptFullyHidden, setIsAdaptFullyHidden] = react$1.useState(!open);
+	if (open && isAdaptFullyHidden) setIsAdaptFullyHidden(false);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SheetController, {
 		onOpenChange: function(val) {
 			if (getShowSheet()) {
@@ -27088,9 +27094,16 @@ var PopoverSheetController = function(param) {
 				(_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 || _props_onOpenChange.call(props, val);
 			}
 		},
+		onAnimationComplete: react$1.useCallback(function(param2) {
+			var { open: isOpen } = param2;
+			if (!isOpen) setIsAdaptFullyHidden(true);
+		}, []),
 		open,
 		hidden: !breakpointActive,
-		children: props.children
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PopoverAdaptHiddenContext.Provider, {
+			value: isAdaptFullyHidden,
+			children: props.children
+		})
 	});
 };
 var useShowPopoverSheet = function(context, open) {
@@ -28432,7 +28445,10 @@ function setupNativeSheet(platform, RNIOSModal) {
 		}
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(SheetProvider, _objectSpread2(_objectSpread2({
 			setHasScrollView: emptyFn,
-			keyboardOccludedHeight: 0
+			keyboardOccludedHeight: 0,
+			isKeyboardVisible: false,
+			keyboardStableFrameHeight: 0,
+			isKeyboardSeeding: false
 		}, providerProps), {}, {
 			onlyShowFrame: true,
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModalSheetView, {
@@ -28779,6 +28795,9 @@ function getSafeAreaTopInset() {
 	return _cachedSafeAreaTop;
 }
 var relativeDimensionTo = "screen";
+function getStableViewportHeight() {
+	return Dimensions.get(relativeDimensionTo).height;
+}
 var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(function SheetImplementationCustom2(props, forwardedRef) {
 	var parentSheet = react$1.default.useContext(ParentSheetContext);
 	var { transition, transitionConfig: transitionConfigProp, modal = false, zIndex = parentSheet.zIndex + 1, moveOnKeyboardChange = false, unmountChildrenWhenHidden = false, portalProps, containerComponent: ContainerComponent = react$1.default.Fragment, onAnimationComplete } = props;
@@ -28806,22 +28825,37 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 	var onInnerSheet = react$1.default.useCallback(function(hasChild) {
 		setIsShowingInnerSheet(hasChild);
 	}, []);
+	var { keyboardHeight, isKeyboardVisible, dismissKeyboard, pauseKeyboardHandler, flushPendingHide } = useKeyboardControllerSheet({ enabled: Boolean(moveOnKeyboardChange) });
 	var stableFrameSize = react$1.default.useRef(frameSize);
 	react$1.default.useEffect(function() {
 		if (open && frameSize) stableFrameSize.current = frameSize;
 	}, [open, frameSize]);
-	var effectiveFrameSize = open ? frameSize : stableFrameSize.current || frameSize;
+	var isWebKbSheet = false;
+	var hasCleanKbBaseline = react$1.default.useRef(false);
+	var seedSettled = react$1.default.useRef(false);
+	var stableKbGeom = react$1.default.useRef({
+		frame: 0,
+		screen: 0
+	});
+	if (frameSize > 0 && screenSize > 0) {
+		stableKbGeom.current.frame = frameSize;
+		stableKbGeom.current.screen = screenSize;
+		hasCleanKbBaseline.current = true;
+	} else if (isWebKbSheet && isKeyboardVisible && !hasCleanKbBaseline.current && screenSize > 0) stableKbGeom.current.screen = Math.max(stableKbGeom.current.screen, screenSize);
+	var seedingKbBaseline = isWebKbSheet && isKeyboardVisible && !hasCleanKbBaseline.current && !seedSettled.current;
+	var freezeForKb = isWebKbSheet && isKeyboardVisible && stableKbGeom.current.frame > 0;
+	var effScreenSize = freezeForKb ? stableKbGeom.current.screen : screenSize;
+	var effectiveFrameSize = freezeForKb ? stableKbGeom.current.frame : open ? frameSize : stableFrameSize.current || frameSize;
 	var positions = react$1.default.useMemo(function() {
 		return snapPoints.map(function(point) {
-			return getYPositions(snapPointsMode, point, screenSize, effectiveFrameSize);
+			return getYPositions(snapPointsMode, point, effScreenSize, effectiveFrameSize);
 		});
 	}, [
-		screenSize,
+		effScreenSize,
 		effectiveFrameSize,
 		snapPoints,
 		snapPointsMode
 	]);
-	var { keyboardHeight, isKeyboardVisible, dismissKeyboard, pauseKeyboardHandler, flushPendingHide } = useKeyboardControllerSheet({ enabled: Boolean(moveOnKeyboardChange) });
 	var [isDragging, setIsDragging_] = react$1.default.useState(false);
 	var isDraggingRef = react$1.default.useRef(false);
 	var setIsDragging = react$1.default.useCallback(function(val) {
@@ -28851,13 +28885,14 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 		screenSize,
 		isDragging
 	]);
-	var keyboardOccludedHeight = getKeyboardOccludedHeight({
-		frameSize,
+	var keyboardOccludedHeight = seedingKbBaseline ? 0 : getKeyboardOccludedHeight({
+		frameSize: effectiveFrameSize,
 		isKeyboardVisible,
 		keyboardHeight,
-		screenSize,
+		screenSize: effScreenSize,
 		sheetY: position >= 0 ? activePositions[position] : void 0
 	});
+	var keyboardStableFrameHeight = !isWebKbSheet ? 0 : seedingKbBaseline ? stableKbGeom.current.screen || screenSize : stableKbGeom.current.frame > 0 ? stableKbGeom.current.frame : 0;
 	var { useAnimatedNumber, useAnimatedNumberStyle, useAnimatedNumberReaction } = animationDriver;
 	var _animationDriver_View;
 	var AnimatedView = (_animationDriver_View = animationDriver.View) !== null && _animationDriver_View !== void 0 ? _animationDriver_View : View;
@@ -28916,7 +28951,7 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 	}
 	var animateTo = useEvent(function(position2, animationOverride) {
 		if (frameSize === 0) return;
-		var toValue = isHidden || position2 === -1 ? screenSize : activePositions[position2];
+		var toValue = isHidden || position2 === -1 ? effScreenSize : activePositions[position2];
 		if (at.current === toValue) return;
 		at.current = toValue;
 		stopSpring();
@@ -28963,6 +28998,7 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 			return;
 		}
 		if (disableAnimation) return;
+		if (isDraggingRef.current) return;
 		if (!frameSize || !screenSize || isHidden || hasntMeasured && !open) return;
 		animateTo(position);
 		if (position === -1) {
@@ -28999,7 +29035,7 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 		if (disableDrag) return;
 		if (!frameSize) return;
 		if (isShowingInnerSheet) return;
-		var minY = positions[0];
+		var minY = activePositions[0];
 		scrollBridge.paneMinY = minY;
 		var startY = at.current;
 		function setPanning(val) {
@@ -29015,8 +29051,8 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 			var end = at.current + frameSize * vy * .2;
 			var closestPoint = 0;
 			var dist = Number.POSITIVE_INFINITY;
-			for (var i = 0; i < positions.length; i++) {
-				var position2 = positions[i];
+			for (var i = 0; i < activePositions.length; i++) {
+				var position2 = activePositions[i];
 				var curDist = end > position2 ? end - position2 : position2 - end;
 				if (curDist < dist) {
 					dist = curDist;
@@ -29037,6 +29073,7 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 			var { dy } = param;
 			function getShouldSet() {
 				if (e.target === providerProps.handleRef.current) return true;
+				if (scrollBridge.scrollNodeTouched) return false;
 				if (scrollBridge.hasScrollableContent === true) {
 					if (scrollBridge.scrollLock) return false;
 					var isScrolled = scrollBridge.y !== 0;
@@ -29059,6 +29096,10 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 			startY = at.current;
 		};
 		var isExternalDrag = false;
+		scrollBridge.startPanDrag = function() {
+			isExternalDrag = true;
+			grant();
+		};
 		scrollBridge.drag = function(dy) {
 			if (!isExternalDrag) {
 				isExternalDrag = true;
@@ -29093,7 +29134,7 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 		isShowingInnerSheet,
 		animateTo,
 		frameSize,
-		positions,
+		activePositions,
 		setPosition
 	]);
 	react$1.default.useEffect(function() {
@@ -29116,7 +29157,11 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 		animateTo(position);
 	}, [isDragging]);
 	react$1.default.useEffect(function() {
-		if (!open && isKeyboardVisible) dismissKeyboard();
+		if (!open && isKeyboardVisible) {
+			dismissKeyboard();
+			pauseKeyboardHandler.current = false;
+			flushPendingHide();
+		}
 	}, [open]);
 	var { panGesture, panGestureRef, gestureHandlerEnabled } = useGestureHandlerPan({
 		positions: activePositions,
@@ -29138,20 +29183,41 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 		},
 		pauseKeyboardHandler
 	});
+	var ignoreLayoutForKeyboard = useEvent(function() {
+		return false;
+	});
+	var shouldSeedKbFrame = useEvent(function() {
+		return isWebKbSheet && !hasCleanKbBaseline.current && !seedSettled.current && ignoreLayoutForKeyboard();
+	});
+	var shouldSeedKbScreen = useEvent(function() {
+		return isWebKbSheet && !hasCleanKbBaseline.current && ignoreLayoutForKeyboard();
+	});
 	var handleAnimationViewLayout = useEvent(function(e) {
 		var _e_nativeEvent;
 		if (!open && stableFrameSize.current !== 0) return;
+		var seeding = shouldSeedKbFrame();
+		if (!seeding && ignoreLayoutForKeyboard()) return;
 		var layoutHeight = (_e_nativeEvent = e.nativeEvent) === null || _e_nativeEvent === void 0 ? void 0 : _e_nativeEvent.layout.height;
-		var next = modal ? Math.min(layoutHeight, Dimensions.get(relativeDimensionTo).height) : layoutHeight;
+		var next = modal || seeding ? Math.min(layoutHeight, getStableViewportHeight()) : layoutHeight;
 		if (!next) return;
-		setFrameSize(next);
+		var rounded = Math.round(next);
+		if (seeding) {
+			if (rounded > stableKbGeom.current.frame) stableKbGeom.current.frame = rounded;
+			else if (stableKbGeom.current.frame > 0) seedSettled.current = true;
+		}
+		setFrameSize(rounded);
 	});
 	var handleMaxContentViewLayout = react$1.default.useCallback(function(e) {
 		var _e_nativeEvent;
-		var next = Math.min((_e_nativeEvent = e.nativeEvent) === null || _e_nativeEvent === void 0 ? void 0 : _e_nativeEvent.layout.height, Dimensions.get(relativeDimensionTo).height);
+		if (shouldSeedKbScreen()) {
+			setMaxContentSize(Math.round(getStableViewportHeight()));
+			return;
+		}
+		if (ignoreLayoutForKeyboard()) return;
+		var next = Math.min((_e_nativeEvent = e.nativeEvent) === null || _e_nativeEvent === void 0 ? void 0 : _e_nativeEvent.layout.height, getStableViewportHeight());
 		if (!next) return;
-		setMaxContentSize(next);
-	}, []);
+		setMaxContentSize(Math.round(next));
+	}, [ignoreLayoutForKeyboard, shouldSeedKbScreen]);
 	var animatedStyle = useAnimatedNumberStyle(animatedNumber, react$1.default.useCallback(function(val) {
 		"worklet";
 		return { transform: [{ translateY: frameSize === 0 ? hiddenSize : val }] };
@@ -29174,6 +29240,9 @@ var SheetImplementationCustom = /* @__PURE__ */ react$1.default.forwardRef(funct
 			value: nextParentContext,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SheetProvider, _objectSpread2(_objectSpread2({}, providerProps), {}, {
 				keyboardOccludedHeight,
+				isKeyboardVisible,
+				keyboardStableFrameHeight,
+				isKeyboardSeeding: seedingKbBaseline,
 				setHasScrollView,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(GestureSheetProvider, {
 					isDragging,
@@ -29404,6 +29473,7 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 	var gestureContext = useGestureSheetContext();
 	var { scrollBridge, setHasScrollView, hasFit, screenSize } = context;
 	var keyboardOccludedHeight = Math.max(0, context.keyboardOccludedHeight || 0);
+	var isKeyboardVisible = context.isKeyboardVisible === true || false;
 	var [scrollEnabled] = useControllableState({
 		prop: scrollEnabledProp,
 		defaultProp: true
@@ -29412,12 +29482,17 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 	var [hasScrollableContent, setHasScrollableContent] = (0, react$1.useState)(true);
 	var parentHeight = (0, react$1.useRef)(0);
 	var contentHeight = (0, react$1.useRef)(0);
-	var keyboardFrozenHeight = hasFit && keyboardOccludedHeight > 0 && parentHeight.current ? parentHeight.current : void 0;
+	var frozenFrameHeight = Math.max(0, context.keyboardStableFrameHeight || 0);
 	var fitSizingStyle = hasFit ? {
 		flex: void 0,
-		height: keyboardFrozenHeight,
+		height: void 0,
 		maxHeight: screenSize || void 0
 	} : { flex: 1 };
+	var isKeyboardSeeding = context.isKeyboardSeeding === true;
+	var keyboardFrozenOverride = hasFit && isKeyboardVisible && frozenFrameHeight > 0 ? isKeyboardSeeding ? { maxHeight: frozenFrameHeight } : {
+		height: frozenFrameHeight,
+		maxHeight: frozenFrameHeight
+	} : null;
 	var panGestureRef = gestureContext === null || gestureContext === void 0 ? void 0 : gestureContext.panGestureRef;
 	var { ScrollView: RNGHScrollView } = getGestureHandlerState();
 	var useRNGHScrollView = isGestureHandlerEnabled() && RNGHScrollView && panGestureRef;
@@ -29462,6 +29537,9 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 	var updateScrollable = function() {
 		if (parentHeight.current && contentHeight.current) setHasScrollableContent(contentHeight.current > parentHeight.current);
 	};
+	var recordFitHeight = function(height) {
+		parentHeight.current = height;
+	};
 	(0, react$1.useEffect)(function() {
 		scrollBridge.hasScrollableContent = hasScrollableContent;
 	}, [hasScrollableContent]);
@@ -29486,14 +29564,14 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 			width: "100%"
 		})]
 	});
-	if (useRNGHScrollView && RNGHScrollView && panGestureRef) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RNGHScrollView, _objectSpread2(_objectSpread2({
+	if (useRNGHScrollView && RNGHScrollView && panGestureRef) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RNGHScrollView, _objectSpread2(_objectSpread2(_objectSpread2({
 		ref: composeRefs(scrollRef, ref),
 		style: fitSizingStyle,
 		scrollEventThrottle: 1,
 		scrollEnabled,
 		simultaneousHandlers: [panGestureRef],
 		onLayout: function(e) {
-			parentHeight.current = Math.ceil(e.nativeEvent.layout.height);
+			recordFitHeight(Math.ceil(e.nativeEvent.layout.height));
 			updateScrollable();
 		},
 		onScroll: function(e) {
@@ -29520,10 +29598,10 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 		bounces: false,
 		keyboardShouldPersistTaps: "always",
 		keyboardDismissMode: "none"
-	}, props), {}, { children: contentWrapper }));
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScrollView, _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({
+	}, props), keyboardFrozenOverride), {}, { children: contentWrapper }));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScrollView, _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({
 		onLayout: function(e) {
-			parentHeight.current = Math.ceil(e.nativeEvent.layout.height);
+			recordFitHeight(Math.ceil(e.nativeEvent.layout.height));
 			updateScrollable();
 		},
 		ref: composeRefs(scrollRef, ref)
@@ -29538,7 +29616,7 @@ var SheetScrollView = /* @__PURE__ */ react$1.default.forwardRef(function(param,
 			onScroll === null || onScroll === void 0 || onScroll(e);
 		},
 		contentContainerStyle: { minHeight: "100%" }
-	}, gestureProps), props), {}, { children: contentWrapper }));
+	}, gestureProps), props), keyboardFrozenOverride), {}, { children: contentWrapper }));
 });
 //#endregion
 //#region ../sheet/dist/esm/useSheetOffscreenSize.native.js

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tamagui",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "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.0.0",
-    "@tamagui/adapt": "2.0.0",
-    "@tamagui/alert-dialog": "2.0.0",
-    "@tamagui/animate": "2.0.0",
-    "@tamagui/animate-presence": "2.0.0",
-    "@tamagui/avatar": "2.0.0",
-    "@tamagui/button": "2.0.0",
-    "@tamagui/card": "2.0.0",
-    "@tamagui/checkbox": "2.0.0",
-    "@tamagui/collapsible": "2.0.0",
-    "@tamagui/compose-refs": "2.0.0",
-    "@tamagui/constants": "2.0.0",
-    "@tamagui/context-menu": "2.0.0",
-    "@tamagui/core": "2.0.0",
-    "@tamagui/create-context": "2.0.0",
-    "@tamagui/create-menu": "2.0.0",
-    "@tamagui/dialog": "2.0.0",
-    "@tamagui/element": "2.0.0",
-    "@tamagui/elements": "2.0.0",
-    "@tamagui/fake-react-native": "2.0.0",
-    "@tamagui/focusable": "2.0.0",
-    "@tamagui/form": "2.0.0",
-    "@tamagui/get-button-sized": "2.0.0",
-    "@tamagui/get-font-sized": "2.0.0",
-    "@tamagui/get-token": "2.0.0",
-    "@tamagui/group": "2.0.0",
-    "@tamagui/helpers-tamagui": "2.0.0",
-    "@tamagui/image": "2.0.0",
-    "@tamagui/input": "2.0.0",
-    "@tamagui/label": "2.0.0",
-    "@tamagui/linear-gradient": "2.0.0",
-    "@tamagui/list-item": "2.0.0",
-    "@tamagui/menu": "2.0.0",
-    "@tamagui/polyfill-dev": "2.0.0",
-    "@tamagui/popover": "2.0.0",
-    "@tamagui/popper": "2.0.0",
-    "@tamagui/portal": "2.0.0",
-    "@tamagui/progress": "2.0.0",
-    "@tamagui/radio-group": "2.0.0",
-    "@tamagui/react-native-media-driver": "2.0.0",
-    "@tamagui/scroll-view": "2.0.0",
-    "@tamagui/select": "2.0.0",
-    "@tamagui/separator": "2.0.0",
-    "@tamagui/shapes": "2.0.0",
-    "@tamagui/sheet": "2.0.0",
-    "@tamagui/slider": "2.0.0",
-    "@tamagui/spacer": "2.0.0",
-    "@tamagui/spinner": "2.0.0",
-    "@tamagui/stacks": "2.0.0",
-    "@tamagui/switch": "2.0.0",
-    "@tamagui/tabs": "2.0.0",
-    "@tamagui/text": "2.0.0",
-    "@tamagui/theme": "2.0.0",
-    "@tamagui/toast": "2.0.0",
-    "@tamagui/toggle-group": "2.0.0",
-    "@tamagui/tooltip": "2.0.0",
-    "@tamagui/use-controllable-state": "2.0.0",
-    "@tamagui/use-debounce": "2.0.0",
-    "@tamagui/use-force-update": "2.0.0",
-    "@tamagui/use-window-dimensions": "2.0.0",
-    "@tamagui/visually-hidden": "2.0.0",
-    "@tamagui/font-size": "2.0.0",
-    "@tamagui/z-index-stack": "2.0.0"
+    "@tamagui/accordion": "2.1.0",
+    "@tamagui/adapt": "2.1.0",
+    "@tamagui/alert-dialog": "2.1.0",
+    "@tamagui/animate": "2.1.0",
+    "@tamagui/animate-presence": "2.1.0",
+    "@tamagui/avatar": "2.1.0",
+    "@tamagui/button": "2.1.0",
+    "@tamagui/card": "2.1.0",
+    "@tamagui/checkbox": "2.1.0",
+    "@tamagui/collapsible": "2.1.0",
+    "@tamagui/compose-refs": "2.1.0",
+    "@tamagui/constants": "2.1.0",
+    "@tamagui/context-menu": "2.1.0",
+    "@tamagui/core": "2.1.0",
+    "@tamagui/create-context": "2.1.0",
+    "@tamagui/create-menu": "2.1.0",
+    "@tamagui/dialog": "2.1.0",
+    "@tamagui/element": "2.1.0",
+    "@tamagui/elements": "2.1.0",
+    "@tamagui/fake-react-native": "2.1.0",
+    "@tamagui/focusable": "2.1.0",
+    "@tamagui/form": "2.1.0",
+    "@tamagui/get-button-sized": "2.1.0",
+    "@tamagui/get-font-sized": "2.1.0",
+    "@tamagui/get-token": "2.1.0",
+    "@tamagui/group": "2.1.0",
+    "@tamagui/helpers-tamagui": "2.1.0",
+    "@tamagui/image": "2.1.0",
+    "@tamagui/input": "2.1.0",
+    "@tamagui/label": "2.1.0",
+    "@tamagui/linear-gradient": "2.1.0",
+    "@tamagui/list-item": "2.1.0",
+    "@tamagui/menu": "2.1.0",
+    "@tamagui/polyfill-dev": "2.1.0",
+    "@tamagui/popover": "2.1.0",
+    "@tamagui/popper": "2.1.0",
+    "@tamagui/portal": "2.1.0",
+    "@tamagui/progress": "2.1.0",
+    "@tamagui/radio-group": "2.1.0",
+    "@tamagui/react-native-media-driver": "2.1.0",
+    "@tamagui/scroll-view": "2.1.0",
+    "@tamagui/select": "2.1.0",
+    "@tamagui/separator": "2.1.0",
+    "@tamagui/shapes": "2.1.0",
+    "@tamagui/sheet": "2.1.0",
+    "@tamagui/slider": "2.1.0",
+    "@tamagui/spacer": "2.1.0",
+    "@tamagui/spinner": "2.1.0",
+    "@tamagui/stacks": "2.1.0",
+    "@tamagui/switch": "2.1.0",
+    "@tamagui/tabs": "2.1.0",
+    "@tamagui/text": "2.1.0",
+    "@tamagui/theme": "2.1.0",
+    "@tamagui/toast": "2.1.0",
+    "@tamagui/toggle-group": "2.1.0",
+    "@tamagui/tooltip": "2.1.0",
+    "@tamagui/use-controllable-state": "2.1.0",
+    "@tamagui/use-debounce": "2.1.0",
+    "@tamagui/use-force-update": "2.1.0",
+    "@tamagui/use-window-dimensions": "2.1.0",
+    "@tamagui/visually-hidden": "2.1.0",
+    "@tamagui/font-size": "2.1.0",
+    "@tamagui/z-index-stack": "2.1.0"
   },
   "devDependencies": {
-    "@tamagui/build": "2.0.0",
+    "@tamagui/build": "2.1.0",
     "react": ">=19",
     "react-native": "0.83.2",
     "react-native-web": "^0.21.0"