@tamagui/popover 2.7.7 → 3.0.0-beta.1091.1

package/src/Popover.tsx

@@ -1,6 +1,6 @@
 import '@tamagui/polyfill-dev'
 
-import type { UseHoverProps } from '@tamagui/floating'
+import type { OpenChangeReason, UseHoverProps } from '@tamagui/floating'
 import {
   Adapt,
   AdaptParent,
@@ -13,12 +13,13 @@ import { Animate } from '@tamagui/animate'
 import { ResetPresence } from '@tamagui/animate-presence'
 import { useComposedRefs } from '@tamagui/compose-refs'
 import { isWeb, useIsomorphicLayoutEffect } from '@tamagui/constants'
-import type { SizeTokens, TamaguiElement, ViewProps } from '@tamagui/core'
+import type { SizeTokens, GetRef, TamaguiElement, ViewProps } from '@tamagui/core'
 import {
+  createStyledHOC,
+  createRefComponent,
   createStyledContext,
   useCreateShallowSetState,
   useEvent,
-  useGet,
   View,
 } from '@tamagui/core'
 import {
@@ -47,7 +48,6 @@ import {
 import { needsPortalRepropagation, Portal } from '@tamagui/portal'
 import { RemoveScroll } from '@tamagui/remove-scroll'
 import { ScrollView, type ScrollViewProps } from '@tamagui/scroll-view'
-import { SheetController } from '@tamagui/sheet/controller'
 import type { YStackProps } from '@tamagui/stacks'
 import { YStack } from '@tamagui/stacks'
 import { useControllableState } from '@tamagui/use-controllable-state'
@@ -105,7 +105,8 @@ export type PopoverProps = ScopedPopoverProps<PopperProps> & {
   hoverable?: boolean | UseHoverProps
 
   /**
-   * Disable focusing behavior on open
+   * disable opening when the trigger receives keyboard focus.
+   * defaults to true unless hoverable is enabled.
    */
   disableFocus?: boolean
 
@@ -151,6 +152,8 @@ type PopoverContextValue = {
   anchorTo?: Rect
   // scoped branches Set for DismissableBranch/Dismissable to share
   branches: Set<HTMLElement>
+  // carry dismissal intent through focus restoration.
+  closeReasonRef?: React.RefObject<OpenChangeReason | undefined>
 }
 
 type PopoverTriggerStateSetter = React.Dispatch<React.SetStateAction<boolean>>
@@ -168,23 +171,15 @@ type PopoverTriggerContextValue = {
 
 export const PopoverContext = createStyledContext<PopoverContextValue>(
   // since we always provide this we can avoid setting here
-  {} as PopoverContextValue,
+  {},
   'Popover__'
 )
 
 // zIndex flows from root Popover prop to PopoverContent portal
 export const PopoverZIndexContext = React.createContext<number | undefined>(undefined)
 
-// when adapted to a Sheet, tracks whether the sheet has finished sliding out.
-// PopoverSheetController flips this true via SheetController.onAnimationComplete
-// so PopoverContent can hold its adapted children mounted until the slide-out
-// is done, instead of unmounting them on the popup's (passThrough) exit.
-// defaults true (= safe to unmount) for any PopoverContent rendered outside a
-// PopoverSheetController.
-const PopoverAdaptHiddenContext = React.createContext(true)
-
 export const PopoverTriggerContext = createStyledContext<PopoverTriggerContextValue>(
-  {} as PopoverTriggerContextValue,
+  {},
   'PopoverTrigger__'
 )
 
@@ -268,6 +263,7 @@ export type PopoverContextProviderProps = {
   keepChildrenMounted?: boolean | 'lazy'
   disableDismissable?: boolean
   hoverable?: boolean | object
+  closeReasonRef?: React.RefObject<OpenChangeReason | undefined>
 }
 
 /**
@@ -293,6 +289,7 @@ export const PopoverContextProvider = React.memo(
     keepChildrenMounted,
     disableDismissable,
     hoverable,
+    closeReasonRef,
   }: PopoverContextProviderProps) => {
     const [branches] = React.useState(() => new Set<HTMLElement>())
     const { setActiveTrigger, registerTrigger, unregisterTrigger } =
@@ -318,6 +315,7 @@ export const PopoverContextProvider = React.memo(
         keepChildrenMounted={keepChildrenMounted}
         disableDismissable={disableDismissable}
         hoverable={hoverable}
+        closeReasonRef={closeReasonRef}
       >
         <PopoverTriggerContext.Provider
           scope={scope}
@@ -346,7 +344,7 @@ const voidFn = () => {}
 export type PopoverAnchorProps = ScopedPopoverProps<YStackProps>
 
 export const PopoverAnchor = React.memo(
-  React.forwardRef<TamaguiElement, PopoverAnchorProps>(
+  createRefComponent<TamaguiElement, PopoverAnchorProps>(
     function PopoverAnchor(props, forwardedRef) {
       const { scope, ...rest } = props
       const context = usePopoverContext(scope)
@@ -378,7 +376,7 @@ export type PopoverTriggerProps = ScopedPopoverProps<
 >
 
 export const PopoverTrigger = React.memo(
-  React.forwardRef<TamaguiElement, PopoverTriggerProps>(
+  createRefComponent<TamaguiElement, PopoverTriggerProps>(
     function PopoverTrigger(props, forwardedRef) {
       const { scope, disablePressTrigger, ...rest } = props
       const triggerContext = usePopoverTriggerContext(scope)
@@ -411,8 +409,10 @@ export const PopoverTrigger = React.memo(
       const trigger = (
         <View
           aria-expanded={open}
-          // TODO not matching
-          // aria-controls={context.contentId}
+          // aria-controls is supplied at runtime by floating-ui's useRole
+          // (see useFloatingContext), pointing at the role="dialog" content
+          // element while open - no manual wiring is needed or wanted here
+          // (a manual id would point at the inner frame, not the dialog element)
           data-state={getState(open)}
           {...rest}
           // @ts-ignore
@@ -484,23 +484,24 @@ export interface PopoverContentTypeProps extends Omit<
    * Enable smooth animation when the content position changes (e.g., when flipping sides)
    */
   animatePosition?: boolean | 'even-when-repositioning'
-  /** @deprecated Use `animatePosition` instead */
-  enableAnimationForPositionChange?: boolean
 }
 
 export type PopoverContentProps = PopoverContentTypeProps
 
-export const PopoverContent = PopperContentFrame.styleable<PopoverContentProps>(
-  function PopoverContent(props, forwardedRef) {
+export const PopoverContent = createStyledHOC(
+  PopperContentFrame,
+  function PopoverContent(props: PopoverContentProps, forwardedRef) {
     const {
       trapFocus,
       enableRemoveScroll = false,
       zIndex: zIndexProp,
       scope,
+      forceMount,
       ...contentImplProps
     } = props
 
     const context = usePopoverContext(scope)
+    const adaptContext = useAdaptContext(context.adaptScope)
     const zIndexFromContext = React.useContext(PopoverZIndexContext)
     // prop on Content takes precedence for backwards compatibility, then context from root
     const zIndex = zIndexProp ?? zIndexFromContext
@@ -522,14 +523,13 @@ export const PopoverContent = PopperContentFrame.styleable<PopoverContentProps>(
 
     // when adapted to a Sheet, the content is portaled into the sheet via
     // Adapt.Contents. its mount lifecycle must follow the sheet's slide-out
-    // (PopoverAdaptHiddenContext, flipped by SheetController.onAnimationComplete),
-    // NOT the popup's own exit animation (isFullyHidden); the popup runs in
-    // passThrough mode while adapted, so isFullyHidden either fires immediately
-    // (content vanishes mid-slide) or never (content leaks), depending on driver.
-    const isAdaptFullyHidden = React.useContext(PopoverAdaptHiddenContext)
-    if (!context.keepChildrenMounted) {
+    // (adaptContext.targetFullyHidden, driven by the Adapt handoff), NOT the
+    // popup's own exit animation (isFullyHidden); the popup runs in passThrough
+    // mode while adapted, so isFullyHidden either fires immediately (content
+    // vanishes mid-slide) or never (content leaks), depending on driver.
+    if (!forceMount && !context.keepChildrenMounted) {
       if (context.breakpointActive) {
-        if (!open && isAdaptFullyHidden) {
+        if (!open && adaptContext.targetFullyHidden) {
           return null
         }
       } else if (isFullyHidden && !open) {
@@ -542,6 +542,7 @@ export const PopoverContent = PopperContentFrame.styleable<PopoverContentProps>(
         passThrough={context.breakpointActive}
         context={context}
         open={open}
+        visuallyActive={open || !isFullyHidden}
         zIndex={zIndex}
       >
         <View
@@ -552,6 +553,7 @@ export const PopoverContent = PopperContentFrame.styleable<PopoverContentProps>(
             {...contentImplProps}
             context={context}
             open={open}
+            forceMount={forceMount}
             enableRemoveScroll={enableRemoveScroll}
             ref={composedRefs}
             setIsFullyHidden={setIsFullyHidden}
@@ -564,8 +566,8 @@ export const PopoverContent = PopperContentFrame.styleable<PopoverContentProps>(
               props.onCloseAutoFocus === false
                 ? undefined
                 : composeEventHandlers(props.onCloseAutoFocus, (event) => {
-                    if (event.defaultPrevented) return
-                    event.preventDefault()
+                    if (event.isCanceled) return
+                    event.cancel()
                     if (!isRightClickOutsideRef.current)
                       context.triggerRef.current?.focus()
                   })
@@ -573,7 +575,8 @@ export const PopoverContent = PopperContentFrame.styleable<PopoverContentProps>(
             onPointerDownOutside={composeEventHandlers(
               props.onPointerDownOutside,
               (event) => {
-                const originalEvent = event.detail.originalEvent
+                const originalEvent = event.event
+                if (!originalEvent) return
                 const ctrlLeftClick =
                   originalEvent.button === 0 && originalEvent.ctrlKey === true
                 const isRightClick = originalEvent.button === 2 || ctrlLeftClick
@@ -585,13 +588,25 @@ export const PopoverContent = PopperContentFrame.styleable<PopoverContentProps>(
             // We make sure we don't trigger our `onDismiss` in such case.
             onFocusOutside={composeEventHandlers(
               props.onFocusOutside,
-              (event) => event.preventDefault(),
+              (event) => {
+                if (trapFocus ?? open) event.cancel()
+              },
               { checkDefaultPrevented: false }
             )}
           />
         </View>
       </PopoverPortal>
     )
+  },
+  {
+    staticConfig: {
+      inlineProps: new Set([
+        ...(PopperContentFrame.staticConfig.inlineProps || []),
+        'zIndex',
+        'opacity',
+        'y',
+      ]),
+    },
   }
 )
 
@@ -656,6 +671,7 @@ const PortalAdaptSafe = ({
 function PopoverPortal({
   context,
   open,
+  visuallyActive,
   zIndex,
   passThrough,
   children,
@@ -663,6 +679,9 @@ function PopoverPortal({
 }: Pick<PopoverContentProps, 'zIndex' | 'passThrough' | 'children' | 'onPress'> & {
   context: PopoverContextValue
   open: boolean
+  // true while open or still animating out - hides the portal host when false
+  // (matters for keepChildrenMounted/forceMount content, see Portal.tsx)
+  visuallyActive: boolean
 }) {
   'use no memo'
 
@@ -677,12 +696,18 @@ function PopoverPortal({
   }
 
   return (
-    <Portal passThrough={passThrough} stackZIndex zIndex={zIndex}>
+    <Portal
+      passThrough={passThrough}
+      stackZIndex
+      zIndex={zIndex}
+      hidden={!visuallyActive}
+    >
       {/* forceClassName avoids forced re-mount renders for some reason... see the HeadMenu as you change tints a few times */}
       {/* without this you'll see the site menu re-rendering. It must be something in wrapping children in Theme */}
       {!!open && !context.breakpointActive && !context.hoverable && (
         <YStack
-          fullscreen
+          position="absolute"
+          inset={0}
           onPress={composeEventHandlers(onPress as any, context.onOpenToggle)}
         />
       )}
@@ -695,7 +720,7 @@ function PopoverPortal({
 
 /* -----------------------------------------------------------------------------------------------*/
 
-type PopoverContentImplElement = React.ElementRef<typeof PopperContent>
+type PopoverContentImplElement = GetRef<typeof PopperContent>
 
 export type PopoverContentImplProps = PopperContentProps &
   Omit<DismissableProps, 'onDismiss' | 'children' | 'onPointerDownCapture'> & {
@@ -705,6 +730,13 @@ export type PopoverContentImplProps = PopperContentProps &
      */
     lazyMount?: boolean
 
+    /**
+     * Used to force mounting when more control is needed. Useful when
+     * controlling animation with React animation libraries. Matches Dialog:
+     * disables part presence gating so the content is always mounted.
+     */
+    forceMount?: boolean
+
     /**
      * Whether focus should be trapped within the `Popover`
      * @default false
@@ -718,12 +750,12 @@ export type PopoverContentImplProps = PopperContentProps &
     disableFocusScope?: boolean
 
     /**
-     * Event handler called when auto-focusing on open. Can be prevented.
+     * Event handler called when auto-focusing on open. Can be canceled.
      */
     onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus']
 
     /**
-     * Event handler called when auto-focusing on close. Can be prevented.
+     * Event handler called when auto-focusing on close. Can be canceled.
      */
     onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus'] | false
 
@@ -747,7 +779,7 @@ type PopoverContentImplInteralProps = PopoverContentImplProps & {
   setIsFullyHidden: React.Dispatch<React.SetStateAction<boolean>>
 }
 
-const PopoverContentImpl = React.forwardRef<
+const PopoverContentImpl = createRefComponent<
   PopoverContentImplElement,
   PopoverContentImplInteralProps
 >(function PopoverContentImpl(props, forwardedRef) {
@@ -768,13 +800,15 @@ const PopoverContentImpl = React.forwardRef<
     setIsFullyHidden,
     lazyMount,
     forceUnmount,
+    forceMount,
     context,
     open,
     alwaysDisable,
     ...contentProps
   } = props
 
-  const { keepChildrenMounted, disableDismissable } = context
+  const { disableDismissable } = context
+  const keepChildrenMounted = context.keepChildrenMounted || forceMount
 
   const handleExitComplete = React.useCallback(() => {
     setIsFullyHidden?.(true)
@@ -784,9 +818,16 @@ const PopoverContentImpl = React.forwardRef<
     <ResetPresence disable={context.breakpointActive}>{children}</ResetPresence>
   )
 
-  const handleDismiss = React.useCallback(() => {
-    context.onOpenChange(false, 'press')
-  }, [context])
+  const handleDismiss = React.useCallback<NonNullable<DismissableProps['onDismiss']>>(
+    (details) => {
+      if (context.closeReasonRef) {
+        context.closeReasonRef.current =
+          details.reason === 'escape-key' ? 'escape-key' : 'dismiss'
+      }
+      context.onOpenChange(false, 'press')
+    },
+    [context]
+  )
 
   // i want to avoid reparenting but react-remove-scroll makes it hard
   // TODO its removed now so we can probable do it now
@@ -801,7 +842,7 @@ const PopoverContentImpl = React.forwardRef<
             onMountAutoFocus={onOpenAutoFocus}
             onUnmountAutoFocus={onCloseAutoFocus === false ? undefined : onCloseAutoFocus}
           >
-            <div style={dspContentsStyle}>{contents}</div>
+            {contents}
           </FocusScope>
         )
       }
@@ -850,11 +891,6 @@ const PopoverContentImpl = React.forwardRef<
         id={context.contentId}
         ref={forwardedRef}
         passThrough={context.breakpointActive}
-        {...(!contentProps.unstyled && {
-          size: '$true',
-          backgroundColor: '$background',
-          alignItems: 'center',
-        })}
         {...contentProps}
       >
         <PortalAdaptSafe context={context}>{contents}</PortalAdaptSafe>
@@ -863,25 +899,21 @@ const PopoverContentImpl = React.forwardRef<
   )
 })
 
-const dspContentsStyle = {
-  display: 'contents',
-}
-
 /* -------------------------------------------------------------------------------------------------
  * PopoverClose
  * -----------------------------------------------------------------------------------------------*/
 
 export type PopoverCloseProps = ScopedPopoverProps<YStackProps>
 
-export const PopoverClose = React.forwardRef<TamaguiElement, PopoverCloseProps>(
+export const PopoverClose = createRefComponent<TamaguiElement, PopoverCloseProps>(
   function PopoverClose(props: ScopedPopoverProps<PopoverCloseProps>, forwardedRef) {
-    const { scope, ...rest } = props
+    const { scope, className, ...rest } = props
     const context = usePopoverContext(scope)
     return (
       <YStack
         {...rest}
         ref={forwardedRef}
-        componentName="PopoverClose"
+        className={`is_PopoverClose ${className || ''}`.trim()}
         onPress={composeEventHandlers(props.onPress as any, () =>
           context?.onOpenChange?.(false, 'press')
         )}
@@ -896,9 +928,10 @@ export const PopoverClose = React.forwardRef<TamaguiElement, PopoverCloseProps>(
 
 export type PopoverArrowProps = PopperArrowProps
 
-export const PopoverArrow = PopperArrowFrame.styleable<PopperArrowExtraProps>(
-  function PopoverArrow(props, forwardedRef) {
-    const { scope, ...rest } = props
+export const PopoverArrow = createStyledHOC(
+  PopperArrowFrame,
+  function PopoverArrow(props: PopperArrowExtraProps, forwardedRef) {
+    const { scope, className, ...rest } = props as PopperArrowProps
     const context = usePopoverContext(scope)
     const isAdapted = useAdaptIsActive(context.adaptScope)
 
@@ -909,7 +942,7 @@ export const PopoverArrow = PopperArrowFrame.styleable<PopperArrowExtraProps>(
     return (
       <PopperArrow
         scope={scope}
-        componentName="PopoverArrow"
+        className={`is_PopoverArrow ${className || ''}`.trim()}
         {...rest}
         ref={forwardedRef}
       />
@@ -940,7 +973,7 @@ export type PopoverScrollViewProps = ScrollViewProps & {
   scope?: string
 }
 
-const PopoverScrollView = React.forwardRef<ScrollView, PopoverScrollViewProps>(
+const PopoverScrollView = createRefComponent<ScrollView, PopoverScrollViewProps>(
   ({ scope, ...props }, ref) => {
     const context = usePopoverContext(scope)
 
@@ -961,20 +994,56 @@ const PopoverScrollView = React.forwardRef<ScrollView, PopoverScrollViewProps>(
 const DEFAULT_SCOPE = ''
 
 export const Popover = withStaticProperties(
-  React.forwardRef<Popover, PopoverProps>(function Popover(
+  createRefComponent<Popover, PopoverProps>(function Popover(
     { scope = DEFAULT_SCOPE, ...props },
     ref
   ) {
     const id = React.useId()
     const adaptScope = `PopoverAdapt${scope}`
+    const { open: openProp, defaultOpen, onOpenChange } = props
+    const viaRef = React.useRef<PopoverVia>(undefined)
+    const closeReasonRef = React.useRef<OpenChangeReason | undefined>(undefined)
+
+    // open state lives here (above AdaptParent) so the Adapt handoff can drive
+    // the adapted Sheet's open/close and unmount timing directly, mirroring Dialog
+    const [open, setOpen] = useControllableState({
+      prop: openProp,
+      defaultProp: defaultOpen || false,
+      onChange: (val) => {
+        onOpenChange?.(val, viaRef.current)
+      },
+    })
+
+    const handleOpenChange = useEvent((val: boolean, via?: PopoverVia): void => {
+      viaRef.current = via
+      setOpen(val)
+    })
+
+    // track open popovers for closeOpenPopovers()
+    React.useEffect(() => {
+      if (!open) return
+      openPopovers.add(setOpen)
+      return () => {
+        openPopovers.delete(setOpen)
+      }
+    }, [open, setOpen])
 
     return (
-      <AdaptParent scope={adaptScope} portal>
+      <AdaptParent
+        scope={adaptScope}
+        adaptChildren={props.children}
+        open={open}
+        onOpenChange={setOpen}
+      >
         <PopoverInner
           adaptScope={adaptScope}
           ref={ref}
           id={id}
           scope={scope}
+          open={open}
+          setOpen={setOpen}
+          handleOpenChange={handleOpenChange}
+          closeReasonRef={closeReasonRef}
           {...props}
         />
       </AdaptParent>
@@ -992,29 +1061,39 @@ export const Popover = withStaticProperties(
   }
 )
 
-const PopoverInner = React.forwardRef<
+const PopoverInner = createRefComponent<
   Popover,
-  PopoverProps & { id: string; adaptScope: string }
+  PopoverProps & {
+    id: string
+    adaptScope: string
+    open: boolean
+    setOpen: React.Dispatch<React.SetStateAction<boolean>>
+    handleOpenChange: (open: boolean, via?: PopoverVia) => void
+    closeReasonRef: React.RefObject<OpenChangeReason | undefined>
+  }
 >(function PopoverInner(props, forwardedRef) {
   const {
     children,
-    open: openProp,
-    defaultOpen,
-    onOpenChange,
+    open: _openProp,
+    defaultOpen: _defaultOpen,
+    onOpenChange: _onOpenChange,
     scope = DEFAULT_SCOPE,
     keepChildrenMounted: keepChildrenMountedProp,
     hoverable,
-    disableFocus,
+    disableFocus = !hoverable,
     disableDismissable,
     zIndex,
     id,
     adaptScope,
+    open,
+    setOpen,
+    handleOpenChange,
+    closeReasonRef,
     ...restProps
   } = props
 
   const triggerRef = React.useRef<TamaguiElement>(null)
   const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false)
-  const viaRef = React.useRef<PopoverVia>(undefined)
 
   const [keepChildrenMounted] = useControllableState({
     prop: keepChildrenMountedProp,
@@ -1022,36 +1101,16 @@ const PopoverInner = React.forwardRef<
     transition: keepChildrenMountedProp === 'lazy',
   })
 
-  const [open, setOpen] = useControllableState({
-    prop: openProp,
-    defaultProp: defaultOpen || false,
-    onChange: (val) => {
-      onOpenChange?.(val, viaRef.current)
-    },
-  })
-
-  // track open popovers for closeOpenPopovers()
-  React.useEffect(() => {
-    if (!open) return
-    openPopovers.add(setOpen)
-    return () => {
-      openPopovers.delete(setOpen)
-    }
-  }, [open, setOpen])
-
-  const handleOpenChange = useEvent((val, via) => {
-    viaRef.current = via
-    setOpen(val)
-  })
-
   const isAdapted = useAdaptIsActive(adaptScope)
 
   const floatingContext = useFloatingContext({
     open,
-    setOpen: handleOpenChange,
+    // floating passes a string via ('hover'), widen at this boundary
+    setOpen: handleOpenChange as (val: boolean, type?: string) => void,
+    closeReasonRef,
     disable: isAdapted,
     hoverable,
-    disableFocus: disableFocus,
+    disableFocus,
   })
 
   const [anchorTo, setAnchorToRaw] = React.useState<Rect>()
@@ -1074,6 +1133,7 @@ const PopoverInner = React.forwardRef<
     if (open && isAdapted) {
       return
     }
+    closeReasonRef.current = open ? 'reference-press' : undefined
     setOpen(!open)
   })
 
@@ -1099,10 +1159,9 @@ const PopoverInner = React.forwardRef<
         keepChildrenMounted={keepChildrenMounted}
         disableDismissable={disableDismissable}
         hoverable={hoverable}
+        closeReasonRef={closeReasonRef}
       >
-        <PopoverSheetController onOpenChange={setOpen} open={open} scope={scope}>
-          {children}
-        </PopoverSheetController>
+        {children}
       </PopoverContextProvider>
     </Popper>
   )
@@ -1135,59 +1194,3 @@ const PopoverInner = React.forwardRef<
 function getState(open: boolean) {
   return open ? 'open' : 'closed'
 }
-
-const PopoverSheetController = ({
-  open,
-  scope,
-  ...props
-}: {
-  open: boolean
-  scope?: string
-  children: React.ReactNode
-  onOpenChange: React.Dispatch<React.SetStateAction<boolean>>
-}) => {
-  const context = usePopoverContext(scope)
-  const showSheet = useShowPopoverSheet(context, open)
-  const breakpointActive = context?.breakpointActive
-  const getShowSheet = useGet(showSheet)
-
-  // tracks whether the adapted Sheet has finished its slide-out animation.
-  // starts true (= safe to unmount) when closed; flips false the moment the
-  // popover opens; flips back to true when the sheet signals onAnimationComplete
-  // with open=false (slide-out finished). mirrors DialogSheetController.
-  const [isAdaptFullyHidden, setIsAdaptFullyHidden] = React.useState(!open)
-  if (open && isAdaptFullyHidden) {
-    setIsAdaptFullyHidden(false)
-  }
-
-  const handleSheetAnimationComplete = React.useCallback(
-    ({ open: isOpen }: { open: boolean }) => {
-      if (!isOpen) {
-        setIsAdaptFullyHidden(true)
-      }
-    },
-    []
-  )
-
-  return (
-    <SheetController
-      onOpenChange={(val: boolean) => {
-        if (getShowSheet()) {
-          props.onOpenChange?.(val)
-        }
-      }}
-      onAnimationComplete={handleSheetAnimationComplete}
-      open={open}
-      hidden={!breakpointActive}
-    >
-      <PopoverAdaptHiddenContext.Provider value={isAdaptFullyHidden}>
-        {props.children}
-      </PopoverAdaptHiddenContext.Provider>
-    </SheetController>
-  )
-}
-
-const useShowPopoverSheet = (context: PopoverContextValue, open: boolean) => {
-  const isAdapted = useAdaptIsActive(context.adaptScope)
-  return open === false ? false : isAdapted
-}