@tamagui/sheet 2.7.7 → 3.0.0-beta.643.1

package/src/SheetScrollView.tsx

@@ -1,10 +1,9 @@
 import { composeRefs } from '@tamagui/compose-refs'
-import { isWeb, View, type GetRef } from '@tamagui/core'
-import type { ScrollViewProps } from '@tamagui/scroll-view'
+import { createStyledHOC, isWeb, View, type GetProps } from '@tamagui/core'
+import type { ScrollViewRef } from '@tamagui/scroll-view'
 import { ScrollView } from '@tamagui/scroll-view'
 import { useControllableState } from '@tamagui/use-controllable-state'
 import React, { useEffect, useRef, useState } from 'react'
-import type { ScrollView as RNScrollView } from 'react-native'
 import { useGestureSheetContext } from './GestureSheetContext'
 import { getGestureHandlerState, isGestureHandlerEnabled } from './gestureState'
 import { useSheetContext } from './SheetContext'
@@ -20,21 +19,29 @@ import {
 
 const SHEET_SCROLL_VIEW_NAME = 'SheetScrollView'
 
-export const SheetScrollView = React.forwardRef<
-  GetRef<typeof ScrollView>,
-  ScrollViewProps
->(
+type SheetScrollViewBaseProps = GetProps<typeof ScrollView>
+
+type SheetScrollViewProps = SheetScopedProps<
+  SheetScrollViewBaseProps & {
+    h?: SheetScrollViewBaseProps['height']
+    o?: SheetScrollViewBaseProps['opacity']
+    pos?: SheetScrollViewBaseProps['position']
+  }
+>
+
+export const SheetScrollView = createStyledHOC(
+  ScrollView,
   (
     {
-      __scopeSheet,
+      scope,
       children,
       onScroll,
       scrollEnabled: scrollEnabledProp,
       ...props
-    }: SheetScopedProps<ScrollViewProps>,
+    }: SheetScrollViewProps,
     ref
   ) => {
-    const context = useSheetContext(SHEET_SCROLL_VIEW_NAME, __scopeSheet)
+    const context = useSheetContext(scope)
     const gestureContext = useGestureSheetContext()
     const { scrollBridge, setHasScrollView, hasFit, screenSize } = context
     const keyboardOccludedHeight = Math.max(0, context.keyboardOccludedHeight || 0)
@@ -50,7 +57,7 @@ export const SheetScrollView = React.forwardRef<
       prop: scrollEnabledProp,
       defaultProp: true,
     })
-    const scrollRef = React.useRef<RNScrollView | null>(null)
+    const scrollRef = React.useRef<ScrollViewRef | null>(null)
 
     const [hasScrollableContent, setHasScrollableContent] = useState(true)
     const parentHeight = useRef(0)
@@ -61,8 +68,8 @@ export const SheetScrollView = React.forwardRef<
     // closed), so the height now comes from the sheet, which doesn't remount.
     const frozenFrameHeight = Math.max(0, context.keyboardStableFrameHeight || 0)
 
-    // with snapPointsMode="fit", Frame is content-sized (flex: 0, flex-basis: auto, height: undefined).
-    // a flex: 1 child can't grow inside a content-sized parent, so the ScrollView (and the Frame
+    // with snapPointsMode="fit", Container is content-sized (flex: 0, flex-basis: auto, height: undefined).
+    // a flex: 1 child can't grow inside a content-sized parent, so the ScrollView (and the Container
     // around it) collapse to 0 height. instead, let the ScrollView size to its content and cap it
     // at the available viewport (screenSize / maxContentSize) so scrolling kicks in for tall content.
     const fitSizingStyle = hasFit
@@ -364,5 +371,9 @@ export const SheetScrollView = React.forwardRef<
         {contentWrapper}
       </ScrollView>
     )
+  },
+  {
+    disableTheme: true,
+    displayName: SHEET_SCROLL_VIEW_NAME,
   }
 )

package/src/constants.tsx

@@ -1,5 +1,5 @@
-export const constants = {}
-
-export const SHEET_NAME = 'Sheet'
+export const SHEET_CONTAINER_NAME = 'SheetContainer'
+export const SHEET_BACKGROUND_NAME = 'SheetBackground'
 export const SHEET_HANDLE_NAME = 'SheetHandle'
 export const SHEET_OVERLAY_NAME = 'SheetOverlay'
+export const SHEET_OVERLAY_MARKER = Symbol('SheetOverlay')

package/src/helpers.tsx

@@ -15,17 +15,3 @@ export function resisted(y: number, minY: number, maxOverflow = 25) {
   // Return the position with resistance applied
   return minY - resistedDistance
 }
-
-// // set all the way off screen
-// // + 0.1 ensures this is unique - see hasntMeasured ref
-
-// let hiddenSize: number
-
-// export function getHiddenSize() {
-//   if (hiddenSize == undefined) {
-//     // this trigger reflow on web avoid doing on startup
-//     const screen = Dimensions.get('screen')
-//     hiddenSize = Math.max(screen.height, screen.width) + 0.1
-//   }
-//   return hiddenSize
-// }

package/src/index.ts

@@ -1,6 +1,7 @@
 export * from './Sheet'
-export * from './useSheet'
-export * from './createSheet'
+// public so copied skins can forward the open state into their own styled parts
+// (e.g. the Handle's open-driven opacity variant).
+export { useSheetContext } from './SheetContext'
 export * from './SheetController'
 export * from './useSheetController'
 export * from './useSheetOpenState'
@@ -9,7 +10,3 @@ export * from './SheetScrollView'
 export * from './nativeSheet'
 export * from './types'
 export * from './contexts'
-export {
-  getGestureHandlerState as unstable_getSheetGestureHandlerState,
-  isGestureHandlerEnabled as unstable_isSheetGestureHandlerEnabled,
-} from './gestureState'

package/src/nativeSheet.tsx

@@ -2,13 +2,11 @@ import { YStack } from '@tamagui/stacks'
 import type { FunctionComponent } from 'react'
 import { useEffect, useRef } from 'react'
 import { View } from 'react-native'
-import { SheetProvider } from './SheetContext'
+import { SheetNativeSystemContext, SheetProvider } from './SheetContext'
 import type { SheetProps } from './types'
 import { useSheetOpenState } from './useSheetOpenState'
 import { useSheetProviderProps } from './useSheetProviderProps'
 
-// import { useSheetSnapPoints } from './useSheetSnapPoints'
-
 type SheetNativePlatforms = 'ios'
 
 const nativeSheets: Record<SheetNativePlatforms, FunctionComponent<SheetProps> | null> = {
@@ -29,8 +27,6 @@ export function setupNativeSheet(
     nativeSheets[platform] = (props: SheetProps) => {
       const state = useSheetOpenState(props)
       const providerProps = useSheetProviderProps(props, state)
-      // const { position } = providerProps
-      // const { positions } = useSheetSnapPoints(providerProps)
 
       const { open, setOpen } = state
       const ref = useRef<{
@@ -51,21 +47,15 @@ export function setupNativeSheet(
         setOpen(next)
       }
 
-      // modalContentPreferredContentSize={{
-      //   mode: 'percent',
-      //   percentWidth: '100%',
-      //   percentHeight:
-      // }}
-
       return (
-        <>
+        <SheetNativeSystemContext.Provider value>
           <SheetProvider
             setHasScrollView={emptyFn}
             keyboardOccludedHeight={0}
             isKeyboardVisible={false}
             keyboardStableFrameHeight={0}
             {...providerProps}
-            onlyShowFrame
+            onlyShowContainer
           >
             <ModalSheetView ref={ref} onModalDidDismiss={() => setOpenInternal(false)}>
               <ModalSheetViewMainContent>
@@ -77,7 +67,7 @@ export function setupNativeSheet(
             {/* so just hiding it here for now... not great... */}
             <YStack
               position="absolute"
-              opacity={0}
+              display="none"
               pointerEvents="none"
               width={0}
               height={0}
@@ -85,7 +75,7 @@ export function setupNativeSheet(
               {props.children}
             </YStack>
           </SheetProvider>
-        </>
+        </SheetNativeSystemContext.Provider>
       )
     }
   }

package/src/types.tsx

@@ -1,99 +1,113 @@
 import type { AnimatedNumberStrategy, TransitionProp } from '@tamagui/core'
-import type { ScopedProps } from '@tamagui/create-context'
 import type { PortalProps } from '@tamagui/portal'
 import type { RemoveScroll } from '@tamagui/remove-scroll'
 import type { ReactNode } from 'react'
 import type React from 'react'
 
-export type SheetProps = ScopedProps<
-  {
-    open?: boolean
-    defaultOpen?: boolean
-    onOpenChange?: OpenChangeHandler
-
-    /**
-     * Control the index of the position in the `snapPoints` array
-     */
-    position?: number
-
-    /**
-     * Initial position from the `snapPoints` array
-     */
-    defaultPosition?: number
-
-    /**
-     * Array of pixels or percents the Sheet will attempt to move to when dragged.
-     * The first is the topmost and default when first opened via open prop.
-     */
-    snapPoints?: (string | number)[]
-
-    snapPointsMode?: SnapPointsMode
-    onPositionChange?: PositionChangeHandler
-    children?: ReactNode
-    dismissOnOverlayPress?: boolean
-    dismissOnSnapToBottom?: boolean
-
-    /**
-     * Disables the RemoveScroll behavior that prevents body scrolling while sheet is open.
-     * By default, RemoveScroll is enabled when the sheet is open and modal.
-     */
-    disableRemoveScroll?: boolean
-
-    /**
-     * @deprecated Use `disableRemoveScroll` instead. This prop will be removed in a future version.
-     * Note: `disableRemoveScroll={true}` is equivalent to `forceRemoveScrollEnabled={false}`
-     */
-    forceRemoveScrollEnabled?: boolean
-
-    transitionConfig?: AnimatedNumberStrategy
-
-    /**
-     * By default Sheet will prefer the open prop over a parent component that is
-     * controlling it via Adapt. In general if you want to Adapt to a sheet, you'd
-     * leave the open prop undefined. If you'd like to have the parent override the
-     * prop you've set manually on Sheet, set this to true.
-     */
-    preferAdaptParentOpenState?: boolean
-
-    /**
-     * (experimental) Remove the children while hidden (to save some performance, but can cause issues with animations)
-     */
-    unmountChildrenWhenHidden?: boolean
-
-    /**
-     * Keep the sheet content wrapper opaque while the sheet is hidden.
-     * Useful for native visual effects that cannot initialize below a transparent ancestor.
-     */
-    disableTransparencyHide?: boolean
-
-    /**
-     * Adapts the sheet to use native sheet on the given platform (if available)
-     */
-    native?: 'ios'[] | boolean
-
-    /**
-     * Pass if you're using the CSS animation driver
-     */
-    transition?: TransitionProp
-    handleDisableScroll?: boolean
-    disableDrag?: boolean
-    modal?: boolean
-    zIndex?: number
-    portalProps?: PortalProps
-    /**
-     * Makes the sheet move up when the mobile keyboard opens so the focused input remains visible.
-     * Works on native (via keyboard events) and on mobile web (via the VisualViewport API).
-     */
-    moveOnKeyboardChange?: boolean
-    containerComponent?: React.ComponentType<any>
-
-    /**
-     * Called when the sheet open/close animation completes.
-     */
-    onAnimationComplete?: (info: { open: boolean }) => void
-  },
-  'Sheet'
->
+export type SheetScopes = string
+
+export type SheetScopedProps<P> = Omit<P, 'scope'> & {
+  scope?: SheetScopes
+}
+
+export type SheetProps = SheetScopedProps<{
+  open?: boolean
+  defaultOpen?: boolean
+  onOpenChange?: OpenChangeHandler
+
+  /**
+   * Control the index of the position in the `snapPoints` array
+   */
+  position?: number
+
+  /**
+   * Initial position from the `snapPoints` array
+   */
+  defaultPosition?: number
+
+  /**
+   * Array of pixels or percents the Sheet will attempt to move to when dragged.
+   * The first is the topmost and default when first opened via open prop.
+   */
+  snapPoints?: (string | number)[]
+
+  snapPointsMode?: SnapPointsMode
+  onPositionChange?: PositionChangeHandler
+  children?: ReactNode
+  dismissOnOverlayPress?: boolean
+  dismissOnSnapToBottom?: boolean
+
+  /**
+   * Disables the RemoveScroll behavior that prevents body scrolling while sheet is open.
+   * By default, RemoveScroll is enabled when the sheet is open and modal.
+   */
+  disableRemoveScroll?: boolean
+
+  transitionConfig?: AnimatedNumberStrategy
+
+  /**
+   * By default Sheet will prefer the open prop over a parent component that is
+   * controlling it via Adapt. In general if you want to Adapt to a sheet, you'd
+   * leave the open prop undefined. If you'd like to have the parent override the
+   * prop you've set manually on Sheet, set this to true.
+   */
+  preferAdaptParentOpenState?: boolean
+
+  /**
+   * (experimental) Remove the children while hidden (to save some performance, but can cause issues with animations)
+   */
+  unmountChildrenWhenHidden?: boolean
+
+  /**
+   * By default a fully-closed sheet wrapper is hidden with `display: 'none'`.
+   * Set this to keep the closed wrapper laid out (e.g. for native visual effects
+   * that cannot initialize below a hidden ancestor). `pointerEvents` still gates
+   * interaction while closed.
+   */
+  disableHideWhenClosed?: boolean
+
+  /**
+   * Adapts the sheet to use native sheet on the given platform (if available)
+   * The iOS system sheet does not expose continuous position, so
+   * `Sheet.useAnimatedPosition` and `onTransition` are unavailable in this mode.
+   */
+  native?: 'ios'[] | boolean
+
+  /**
+   * Pass if you're using the CSS animation driver
+   */
+  transition?: TransitionProp
+  handleDisableScroll?: boolean
+  disableDrag?: boolean
+  modal?: boolean
+  zIndex?: number
+  portalProps?: PortalProps
+  /**
+   * Makes the sheet move up when the mobile keyboard opens so the focused input remains visible.
+   * Works on native (via keyboard events) and on mobile web (via the VisualViewport API).
+   */
+  moveOnKeyboardChange?: boolean
+  containerComponent?: React.ComponentType<any>
+
+  /**
+   * Fires at the start and end of the sheet's position transition. `cause` is
+   * `open` when moving from closed, `close` when moving off screen, and `snap`
+   * when moving between snap points while open. On the `end` phase, `finished`
+   * is `false` when the transition was interrupted (e.g. a close canceled by a
+   * re-open). `position` is the resolved translateY (px from screen top) target.
+   * Available on Tamagui's custom Sheet, not the native iOS system sheet.
+   */
+  onTransition?: (e: SheetTransitionEvent) => void
+}>
+
+export type SheetTransitionCause = 'open' | 'close' | 'snap'
+
+export type SheetTransitionEvent = {
+  phase: 'start' | 'end'
+  cause: SheetTransitionCause
+  position: number
+  finished?: boolean
+}
 
 export type PositionChangeHandler = (position: number) => void
 
@@ -105,8 +119,6 @@ export type RemoveScrollProps = React.ComponentProps<typeof RemoveScroll>
 
 export type SnapPointsMode = 'percent' | 'constant' | 'fit' | 'mixed'
 
-export type SheetScopedProps<A> = ScopedProps<A, 'Sheet'>
-
 export type ScrollBridge = {
   enabled: boolean
   y: number

package/src/useKeyboardControllerSheet.native.ts

@@ -97,10 +97,15 @@ export function useKeyboardControllerSheet(
     }
   }, [enabled, keyboardControllerEnabled])
 
-  // fallback to basic Keyboard API when keyboard-controller not available
+  // basic Keyboard API listeners, always on: keyboard-controller's events only
+  // fire when the app mounts its KeyboardProvider, and `enabled` above only
+  // proves the module is linked. an app (or the detox harness, which launches
+  // with disableKeyboardController) that skips the provider would otherwise get
+  // silently dead keyboard tracking - the sheet never moves and the scroll
+  // occlusion padding never applies. RN's Keyboard events always fire, so they
+  // are the baseline; when both fire the extra setState is a same-value no-op.
   useEffect(() => {
     if (!enabled) return
-    if (keyboardControllerEnabled) return
 
     const showEvent = Platform.OS === 'ios' ? 'keyboardWillShow' : 'keyboardDidShow'
     const hideEvent = Platform.OS === 'ios' ? 'keyboardWillHide' : 'keyboardDidHide'

package/src/useSafeAreaInsets.native.ts

@@ -1,3 +1,4 @@
+import { getSafeArea } from '@tamagui/native'
 import * as React from 'react'
 import { SafeAreaInsetsContext as RNSafeAreaInsetsContext } from 'react-native-safe-area-context'
 
@@ -9,21 +10,27 @@ import type { SafeAreaInsets } from './useSafeAreaInsets'
 export const SafeAreaInsetsContext =
   RNSafeAreaInsetsContext as unknown as React.Context<SafeAreaInsets | null>
 
+const safeArea = getSafeArea()
+
+function useContextInsets(): SafeAreaInsets | null {
+  return React.useContext(SafeAreaInsetsContext)
+}
+
 /**
- * Live safe-area insets (notch / status bar / home indicator) read from the
- * context the app's SafeAreaProvider provides.
+ * live safe-area insets (notch / status bar / home indicator).
  *
- * Read this in a component BODY that renders inside the provider. The Sheet does
- * exactly that — only its modal CONTENT is teleported out through the portal, so
- * the body still sees the real insets. This is the one read that works in real
- * native bundles:
- *  - `getSafeArea()` (the @tamagui/native abstraction) is frequently NOT enabled
- *    against the instance a component reads, so it returns 0.
- *  - a dynamic `require('react-native-safe-area-context')` throws "Unknown named
- *    module" in metro/rolldown bundles where the package isn't in the importing
- *    module's graph.
- * A static import + context read avoids both.
+ * setup-safe-area installs a context-to-store feed so every store subscriber
+ * sees provider updates. Without that setup, keep the direct context read that
+ * lets Sheet work independently.
  */
 export function useSafeAreaInsets(): SafeAreaInsets | null {
-  return React.useContext(SafeAreaInsetsContext)
+  const [useFeed] = React.useState(() => safeArea.state.useSafeAreaInsets)
+  const contextInsets = (useFeed || useContextInsets)()
+  const storeInsets = React.useSyncExternalStore(
+    safeArea.subscribe,
+    safeArea.getInsets,
+    safeArea.getInsets
+  )
+
+  return useFeed ? storeInsets : contextInsets
 }

package/src/useSheetController.tsx

@@ -1,7 +1,12 @@
-import React from 'react'
+import type React from 'react'
+import { createStyledContext, type StyledContext } from '@tamagui/core'
 
-export const useSheetController = () => {
-  const controller = React.useContext(SheetControllerContext)
+import type { SheetTransitionEvent } from './types'
+
+export const useSheetController = (scope?: string) => {
+  const controller = SheetControllerContext.useStyledContext(
+    scope
+  ) as SheetControllerContextValue | null
   const isHidden = controller?.hidden
   const isShowingNonSheet = isHidden && controller?.open
   return {
@@ -12,8 +17,11 @@ export const useSheetController = () => {
   }
 }
 
-export const SheetControllerContext =
-  React.createContext<SheetControllerContextValue | null>(null)
+export const SheetControllerContext = createStyledContext<SheetControllerContextValue>(
+  null as any,
+  'SheetController__'
+) as StyledContext<SheetControllerContextValue> &
+  React.Context<SheetControllerContextValue | null>
 
 export type SheetControllerContextValue = {
   id?: string
@@ -22,10 +30,10 @@ export type SheetControllerContextValue = {
   // hide without "closing" to prevent re-animation when shown again
   hidden?: boolean
   onOpenChange?: React.Dispatch<React.SetStateAction<boolean>> | ((val: boolean) => void)
-  // fired by the sheet after its open/close animation finishes. used by
+  // fired by the sheet at the start/end of its position transition. used by
   // Dialog adapt to know when it's safe to tear down adapted children
   // without cutting off the slide-out mid-animation.
-  onAnimationComplete?: (state: { open: boolean }) => void
+  onTransition?: (e: SheetTransitionEvent) => void
   // when true, the sheet should skip its open animation (used for adapt handoff)
   skipNextAnimation?: boolean
 }

package/src/useSheetOpenState.tsx

@@ -1,19 +1,65 @@
+import { useAdaptContext, useAdaptTarget } from '@tamagui/adapt'
+import React from 'react'
 import { useControllableState } from '@tamagui/use-controllable-state'
 
 import type { SheetProps } from './types'
+import type { SheetControllerContextValue } from './useSheetController'
 import { useSheetController } from './useSheetController'
 
 export const useSheetOpenState = (props: SheetProps) => {
-  const { isHidden, controller } = useSheetController()
+  const adaptContext = useAdaptContext()
+  const adapt = useAdaptTarget()
+  const { isHidden: controllerIsHidden, controller: legacyController } =
+    useSheetController(props.scope)
+  const shouldUseAdapt = Boolean(
+    adaptContext.open !== undefined || adaptContext.onOpenChange
+  )
+  // Dialog no longer mounts SheetController while Adapt is inactive, so the
+  // hidden state must come from the Adapt parent context even before a target
+  // can register through useAdaptTarget().
+  const isHidden = shouldUseAdapt ? !adaptContext.active : controllerIsHidden
+  const wasHiddenRef = React.useRef(isHidden)
+  // when the adapt target is exiting (media flipped off while the dialog stays
+  // open), Adapt keeps `active` true so the sheet stays mounted, and signals
+  // the close through handoff.hidden: drive the sheet's open state to false so
+  // it plays its exit animation and reports onTransition back to Adapt
+  const controllerOpen = shouldUseAdapt
+    ? Boolean(adaptContext.open) && !adaptContext.handoff.hidden
+    : legacyController?.open
+  const localSkipNextAnimation = Boolean(
+    wasHiddenRef.current && !isHidden && controllerOpen
+  )
+  const skipNextAnimation =
+    (shouldUseAdapt ? adapt?.handoff.skipNextAnimation : undefined) ??
+    localSkipNextAnimation
+
+  wasHiddenRef.current = isHidden
+
+  const adaptController = React.useMemo<SheetControllerContextValue | null>(() => {
+    if (!adapt || !shouldUseAdapt) return null
+
+    return {
+      open: adaptContext.open,
+      hidden: isHidden,
+      onOpenChange: adaptContext.active ? adaptContext.onOpenChange : undefined,
+      onTransition: adapt?.handoff.onTransition,
+      skipNextAnimation,
+    }
+  }, [adapt, adaptContext, isHidden, shouldUseAdapt, skipNextAnimation])
+
+  const controller = adaptController ?? legacyController
+  const controllerOnOpenChange =
+    (shouldUseAdapt && adaptContext.active ? adaptContext.onOpenChange : undefined) ??
+    legacyController?.onOpenChange
 
   const onOpenChangeInternal = (val: boolean) => {
-    controller?.onOpenChange?.(val)
+    controllerOnOpenChange?.(val)
     props.onOpenChange?.(val)
   }
 
   const propVal = props.preferAdaptParentOpenState
-    ? (controller?.open ?? props.open)
-    : (props.open ?? controller?.open)
+    ? (controllerOpen ?? props.open)
+    : (props.open ?? controllerOpen)
 
   const [open, setOpen] = useControllableState({
     prop: propVal,

package/src/useSheetProviderProps.tsx

@@ -22,13 +22,7 @@ export type SheetContextValue = ReturnType<typeof useSheetProviderProps> & {
   setHasScrollView: (val: boolean) => void
 }
 
-export function useSheetProviderProps(
-  props: SheetProps,
-  state: SheetOpenState,
-  options: {
-    onOverlayComponent?: (comp: any) => void
-  } = {}
-) {
+export function useSheetProviderProps(props: SheetProps, state: SheetOpenState) {
   const handleRef = React.useRef<TamaguiElement>(null)
   const contentRef = React.useRef<TamaguiElement>(null)
   const [frameSize, setFrameSize] = React.useState<number>(0)
@@ -179,23 +173,7 @@ export function useSheetProviderProps(
     return bridge
   })
 
-  // Handle both new disableRemoveScroll and deprecated forceRemoveScrollEnabled
-  let disableRemoveScroll: boolean | undefined
-  if (props.disableRemoveScroll !== undefined) {
-    // New prop: disableRemoveScroll={true} means RemoveScroll is disabled
-    disableRemoveScroll = props.disableRemoveScroll || !open || !props.modal
-  } else if (props.forceRemoveScrollEnabled !== undefined) {
-    // Deprecated prop: forceRemoveScrollEnabled can override the default
-    if (process.env.NODE_ENV === 'development') {
-      console.warn(
-        '[Sheet] forceRemoveScrollEnabled is deprecated. Use disableRemoveScroll instead.'
-      )
-    }
-    disableRemoveScroll = !props.forceRemoveScrollEnabled
-  } else {
-    // Default: disabled when not open or not modal
-    disableRemoveScroll = !open || !props.modal
-  }
+  const disableRemoveScroll = props.disableRemoveScroll || !open || !props.modal
 
   const maxSnapPoint = snapPoints[0]
   const screenSize =
@@ -218,8 +196,7 @@ export function useSheetProviderProps(
     setFrameSize,
     dismissOnOverlayPress: props.dismissOnOverlayPress ?? true,
     dismissOnSnapToBottom: props.dismissOnSnapToBottom ?? false,
-    onOverlayComponent: options.onOverlayComponent,
-    scope: props.__scopeSheet,
+    scope: props.scope ?? '',
     hasFit,
     position,
     snapPoints,
@@ -227,7 +204,7 @@ export function useSheetProviderProps(
     setMaxContentSize,
     setPosition,
     setPositionImmediate,
-    onlyShowFrame: false,
+    onlyShowContainer: false,
   }
 
   return providerProps

package/src/useSheetScrollViewGestures.ts

@@ -1,5 +1,5 @@
+import type { ScrollViewRef } from '@tamagui/scroll-view'
 import { useEffect, useRef } from 'react'
-import type { ScrollView as RNScrollView } from 'react-native'
 import type { ScrollBridge } from './types'
 
 type GestureOwner = 'none' | 'pan' | 'scroll'
@@ -15,7 +15,7 @@ interface GestureState {
 }
 
 interface UseSheetScrollViewGesturesProps {
-  scrollRef: React.RefObject<RNScrollView | null>
+  scrollRef: React.RefObject<ScrollViewRef | null>
   scrollBridge: ScrollBridge
   hasScrollableContent: boolean
   scrollEnabled: boolean