@tamagui/popover 1.0.1-beta.21 → 1.0.1-beta.211

package/dist/esm/Popover.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/Popover.tsx"],
-  "sourcesContent": ["// adapted from radix-ui popover\n\nimport '@tamagui/polyfill-dev'\n\nimport {\n  useDelayGroup,\n  useDismiss,\n  useFloating,\n  useFocus,\n  useHover,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react-dom-interactions'\nimport { AnimatePresence } from '@tamagui/animate-presence'\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport { composeEventHandlers, useId, withStaticProperties } from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\n// import { DismissableLayer } from '@tamagui/react-dismissable-layer'\n// import { useFocusGuards } from '@tamagui/react-focus-guards'\n// import { FocusScope } from '@tamagui/react-focus-scope'\nimport {\n  FloatingOverrideContext,\n  Popper,\n  PopperAnchor,\n  PopperArrow,\n  PopperContent,\n  PopperContentProps,\n  PopperProps,\n  UseFloatingFn,\n  createPopperScope,\n} from '@tamagui/popper'\nimport { Portal } from '@tamagui/portal'\nimport { YStack, YStackProps } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\n// import { hideOthers } from 'aria-hidden'\nimport * as React from 'react'\nimport { GestureResponderEvent, View } from 'react-native'\n\n// import { RemoveScroll } from 'react-remove-scroll'\n\nconst POPOVER_NAME = 'Popover'\n\ntype ScopedProps<P> = P & { __scopePopover?: Scope }\nconst [createPopoverContext, createPopoverScopeInternal] = createContextScope(POPOVER_NAME, [\n  createPopperScope,\n])\nexport const usePopoverScope = createPopperScope()\nexport const createPopoverScope = createPopoverScopeInternal\n\ntype PopoverContextValue = {\n  triggerRef: React.RefObject<HTMLButtonElement>\n  contentId?: string\n  open: boolean\n  onOpenChange(open: boolean): void\n  onOpenToggle(): void\n  hasCustomAnchor: boolean\n  onCustomAnchorAdd(): void\n  onCustomAnchorRemove(): void\n  modal: boolean\n}\n\nconst [PopoverProviderInternal, usePopoverInternalContext] =\n  createPopoverContext<PopoverContextValue>(POPOVER_NAME)\n\nexport const __PopoverProviderInternal = PopoverProviderInternal\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverAnchor\n * -----------------------------------------------------------------------------------------------*/\n\nconst ANCHOR_NAME = 'PopoverAnchor'\n\ntype PopoverAnchorElement = HTMLElement | View\nexport type PopoverAnchorProps = YStackProps\n\nexport const PopoverAnchor = React.forwardRef<PopoverAnchorElement, PopoverAnchorProps>(\n  (props: ScopedProps<PopoverAnchorProps>, forwardedRef) => {\n    const { __scopePopover, ...anchorProps } = props\n    const context = usePopoverInternalContext(ANCHOR_NAME, __scopePopover)\n    const popperScope = usePopoverScope(__scopePopover)\n    const { onCustomAnchorAdd, onCustomAnchorRemove } = context\n\n    React.useEffect(() => {\n      onCustomAnchorAdd()\n      return () => onCustomAnchorRemove()\n    }, [onCustomAnchorAdd, onCustomAnchorRemove])\n\n    return <PopperAnchor {...popperScope} {...anchorProps} ref={forwardedRef} />\n  }\n)\n\nPopoverAnchor.displayName = ANCHOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'PopoverTrigger'\n\ntype PopoverTriggerElement = HTMLElement | View\nexport type PopoverTriggerProps = YStackProps\n\nexport const PopoverTrigger = React.forwardRef<PopoverTriggerElement, PopoverTriggerProps>(\n  (props: ScopedProps<PopoverTriggerProps>, forwardedRef) => {\n    const { __scopePopover, ...triggerProps } = props\n    const context = usePopoverInternalContext(TRIGGER_NAME, __scopePopover)\n    const popperScope = usePopoverScope(__scopePopover)\n    const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef)\n\n    const trigger = (\n      <YStack\n        aria-haspopup=\"dialog\"\n        aria-expanded={context.open}\n        aria-controls={context.contentId}\n        data-state={getState(context.open)}\n        {...triggerProps}\n        ref={composedTriggerRef}\n        onPress={composeEventHandlers(props.onPress, context.onOpenToggle)}\n      />\n    )\n\n    return context.hasCustomAnchor ? (\n      trigger\n    ) : (\n      <PopperAnchor asChild {...popperScope}>\n        {trigger}\n      </PopperAnchor>\n    )\n  }\n)\n\nPopoverTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'PopoverContent'\n\nexport interface PopoverContentTypeProps\n  extends Omit<PopoverContentImplProps, 'trapFocus' | 'disableOutsidePointerEvents'> {\n  /**\n   * @see https://github.com/theKashey/react-remove-scroll#usage\n   */\n  allowPinchZoom?: RemoveScrollProps['allowPinchZoom']\n}\n\nexport type PopoverContentProps = PopoverContentTypeProps\n\nexport const PopoverContent = React.forwardRef<PopoverContentTypeElement, PopoverContentProps>(\n  (props: ScopedProps<PopoverContentProps>, forwardedRef) => {\n    const context = usePopoverInternalContext(CONTENT_NAME, props.__scopePopover)\n    return context.modal ? (\n      <PopoverContentModal {...props} ref={forwardedRef} />\n    ) : (\n      <PopoverContentNonModal {...props} ref={forwardedRef} />\n    )\n  }\n)\n\nPopoverContent.displayName = CONTENT_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype RemoveScrollProps = any //React.ComponentProps<typeof RemoveScroll>\ntype PopoverContentTypeElement = PopoverContentImplElement\n\nconst PopoverContentModal = React.forwardRef<PopoverContentTypeElement, PopoverContentTypeProps>(\n  (props: ScopedProps<PopoverContentTypeProps>, forwardedRef) => {\n    const { allowPinchZoom, ...contentModalProps } = props\n    const context = usePopoverInternalContext(CONTENT_NAME, props.__scopePopover)\n    const contentRef = React.useRef<HTMLDivElement>(null)\n    const composedRefs = useComposedRefs(forwardedRef, contentRef)\n    const isRightClickOutsideRef = React.useRef(false)\n\n    // aria-hide everything except the content (better supported equivalent to setting aria-modal)\n    // React.useEffect(() => {\n    //   const content = contentRef.current\n    //   if (content) return hideOthers(content)\n    // }, [])\n\n    const PortalWrapper = context.modal ? Portal : React.Fragment\n\n    return (\n      <PortalWrapper>\n        {/* <RemoveScroll allowPinchZoom={allowPinchZoom}> */}\n        <PopoverContentImpl\n          {...contentModalProps}\n          ref={composedRefs}\n          // we make sure we're not trapping once it's been closed\n          // (closed !== unmounted when animating out)\n          trapFocus={context.open}\n          disableOutsidePointerEvents\n          onCloseAutoFocus={composeEventHandlers(props.onCloseAutoFocus, (event) => {\n            event.preventDefault()\n            if (!isRightClickOutsideRef.current) context.triggerRef.current?.focus()\n          })}\n          onPointerDownOutside={composeEventHandlers(\n            props.onPointerDownOutside,\n            (event) => {\n              console.log('pinter outside', event)\n              // @ts-expect-error\n              const originalEvent = event.detail.originalEvent\n              const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true\n              const isRightClick = originalEvent.button === 2 || ctrlLeftClick\n              isRightClickOutsideRef.current = isRightClick\n            },\n            { checkDefaultPrevented: false }\n          )}\n          // When focus is trapped, a `focusout` event may still happen.\n          // We make sure we don't trigger our `onDismiss` in such case.\n          onFocusOutside={composeEventHandlers(\n            props.onFocusOutside,\n            (event) => event.preventDefault(),\n            { checkDefaultPrevented: false }\n          )}\n        />\n        {/* </RemoveScroll> */}\n      </PortalWrapper>\n    )\n  }\n)\n\nconst PopoverContentNonModal = React.forwardRef<PopoverContentTypeElement, PopoverContentTypeProps>(\n  (props: ScopedProps<PopoverContentTypeProps>, forwardedRef) => {\n    const { ...contentNonModalProps } = props\n    const context = usePopoverInternalContext(CONTENT_NAME, props.__scopePopover)\n    const hasInteractedOutsideRef = React.useRef(false)\n    const PortalWrapper = context.modal ? Portal : React.Fragment\n\n    return (\n      <PortalWrapper>\n        <PopoverContentImpl\n          {...contentNonModalProps}\n          ref={forwardedRef}\n          trapFocus={false}\n          disableOutsidePointerEvents={false}\n          onCloseAutoFocus={(event) => {\n            props.onCloseAutoFocus?.(event)\n\n            if (!event.defaultPrevented) {\n              if (!hasInteractedOutsideRef.current) context.triggerRef.current?.focus()\n              // Always prevent auto focus because we either focus manually or want user agent focus\n              event.preventDefault()\n            }\n\n            hasInteractedOutsideRef.current = false\n          }}\n          onInteractOutside={(event) => {\n            props.onInteractOutside?.(event)\n\n            if (!event.defaultPrevented) hasInteractedOutsideRef.current = true\n\n            // Prevent dismissing when clicking the trigger.\n            // As the trigger is already setup to close, without doing so would\n            // cause it to close and immediately open.\n            //\n            // We use `onInteractOutside` as some browsers also\n            // focus on pointer down, creating the same issue.\n            // @ts-ignore\n            const target = event.target as HTMLElement\n            const targetIsTrigger = context.triggerRef.current?.contains(target)\n            if (targetIsTrigger) event.preventDefault()\n          }}\n        />\n      </PortalWrapper>\n    )\n  }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype PopoverContentImplElement = React.ElementRef<typeof PopperContent>\n\n// TODO\ntype FocusScopeProps = {\n  /**\n   * Whether focus should be trapped within the FocusScope\n   * (default: false)\n   */\n  trapped?: boolean\n\n  /**\n   * Event handler called when auto-focusing on mount.\n   * Can be prevented.\n   */\n  onMountAutoFocus?: (event: GestureResponderEvent) => void\n\n  /**\n   * Event handler called when auto-focusing on unmount.\n   * Can be prevented.\n   */\n  onUnmountAutoFocus?: (event: GestureResponderEvent) => void\n}\n\ntype DismissableLayerProps = {\n  /**\n   * When `true`, hover/focus/click interactions will be disabled on elements outside the `DismissableLayer`.\n   * Users will need to click twice on outside elements to interact with them:\n   * Once to close the `DismissableLayer`, and again to trigger the element.\n   */\n  disableOutsidePointerEvents?: boolean\n\n  /**\n   * Event handler called when the escape key is down.\n   * Can be prevented.\n   */\n  onEscapeKeyDown?: (event: KeyboardEvent) => void\n\n  /**\n   * Event handler called when the a pointer event happens outside of the `DismissableLayer`.\n   * Can be prevented.\n   */\n  onPointerDownOutside?: (event: GestureResponderEvent) => void\n  // onPointerDownOutside?: (event: MouseEvent | TouchEvent) => void\n\n  /**\n   * Event handler called when the focus moves outside of the `DismissableLayer`.\n   * Can be prevented.\n   */\n  onFocusOutside?: (event: React.FocusEvent) => void\n\n  /**\n   * Event handler called when an interaction happens outside the `DismissableLayer`.\n   * Specifically, when a pointer event happens outside of the `DismissableLayer` or focus moves outside of it.\n   * Can be prevented.\n   */\n  onInteractOutside?: (event: GestureResponderEvent) => void\n  // onInteractOutside?: (event: MouseEvent | TouchEvent | React.FocusEvent) => void\n\n  /** Callback called when the `DismissableLayer` should be dismissed */\n  onDismiss?: () => void\n}\n\nexport interface PopoverContentImplProps\n  extends PopperContentProps,\n    Omit<DismissableLayerProps, 'onDismiss'> {\n  /**\n   * Whether focus should be trapped within the `Popover`\n   * (default: false)\n   */\n  trapFocus?: FocusScopeProps['trapped']\n\n  /**\n   * Event handler called when auto-focusing on open.\n   * Can be prevented.\n   */\n  onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus']\n\n  /**\n   * Event handler called when auto-focusing on close.\n   * Can be prevented.\n   */\n  onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus']\n}\n\nconst PopoverContentImpl = React.forwardRef<PopoverContentImplElement, PopoverContentImplProps>(\n  (props: ScopedProps<PopoverContentImplProps>, forwardedRef) => {\n    const {\n      __scopePopover,\n      trapFocus,\n      onOpenAutoFocus,\n      onCloseAutoFocus,\n      disableOutsidePointerEvents,\n      onEscapeKeyDown,\n      onPointerDownOutside,\n      onFocusOutside,\n      onInteractOutside,\n      ...contentProps\n    } = props\n    const context = usePopoverInternalContext(CONTENT_NAME, __scopePopover)\n    const popperScope = usePopoverScope(__scopePopover)\n\n    // Make sure the whole tree has focus guards as our `Popover` may be\n    // the last element in the DOM (beacuse of the `Portal`)\n    // useFocusGuards()\n\n    // <FocusScope\n    //   asChild\n    //   loop\n    //   trapped={trapFocus}\n    //   onMountAutoFocus={onOpenAutoFocus}\n    //   onUnmountAutoFocus={onCloseAutoFocus}\n    // >\n    // <DismissableLayer\n    //   asChild\n    //   disableOutsidePointerEvents={disableOutsidePointerEvents}\n    //   onInteractOutside={onInteractOutside}\n    //   onEscapeKeyDown={onEscapeKeyDown}\n    //   onPointerDownOutside={onPointerDownOutside}\n    //   onFocusOutside={onFocusOutside}\n    //   onDismiss={() => context.onOpenChange(false)}\n    // >\n    return (\n      <AnimatePresence>\n        {!!context.open && (\n          <PopperContent\n            data-state={getState(context.open)}\n            // role=\"dialog\"\n            id={context.contentId}\n            pointerEvents=\"auto\"\n            {...popperScope}\n            {...contentProps}\n            ref={forwardedRef}\n          />\n        )}\n      </AnimatePresence>\n    )\n    // </DismissableLayer>\n    // </FocusScope>\n  }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverClose\n * -----------------------------------------------------------------------------------------------*/\n\nconst CLOSE_NAME = 'PopoverClose'\n\ntype PopoverCloseElement = HTMLElement | View\nexport type PopoverCloseProps = YStackProps\n\nexport const PopoverClose = React.forwardRef<PopoverCloseElement, PopoverCloseProps>(\n  (props: ScopedProps<PopoverCloseProps>, forwardedRef) => {\n    const { __scopePopover, ...closeProps } = props\n    const context = usePopoverInternalContext(CLOSE_NAME, __scopePopover)\n    return (\n      <YStack\n        {...closeProps}\n        ref={forwardedRef}\n        onPress={composeEventHandlers(props.onPress, () => context.onOpenChange(false))}\n      />\n    )\n  }\n)\n\nPopoverClose.displayName = CLOSE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverArrow\n * -----------------------------------------------------------------------------------------------*/\n\nconst ARROW_NAME = 'PopoverArrow'\n\ntype PopoverArrowElement = HTMLElement | View\nexport type PopoverArrowProps = YStackProps\n\nexport const PopoverArrow = React.forwardRef<PopoverArrowElement, PopoverArrowProps>(\n  (props: ScopedProps<PopoverArrowProps>, forwardedRef) => {\n    const { __scopePopover, ...arrowProps } = props\n    const popperScope = usePopoverScope(__scopePopover)\n    return <PopperArrow {...popperScope} {...arrowProps} ref={forwardedRef} />\n  }\n)\n\nPopoverArrow.displayName = ARROW_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Popover\n * -----------------------------------------------------------------------------------------------*/\n\nexport type PopoverProps = PopperProps & {\n  open?: boolean\n  defaultOpen?: boolean\n  onOpenChange?: (open: boolean) => void\n  modal?: boolean\n}\n\nexport const Popover = withStaticProperties(\n  ((props: ScopedProps<PopoverProps>) => {\n    const {\n      __scopePopover,\n      children,\n      open: openProp,\n      defaultOpen,\n      onOpenChange,\n      modal = true,\n      ...restProps\n    } = props\n    const popperScope = usePopoverScope(__scopePopover)\n    const triggerRef = React.useRef<HTMLButtonElement>(null)\n    const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false)\n    const [open, setOpen] = useControllableState({\n      prop: openProp,\n      defaultProp: defaultOpen || false,\n      onChange: onOpenChange,\n    })\n\n    const useFloatingFn: UseFloatingFn = (props) => {\n      const floating = useFloating({\n        ...props,\n        open,\n        onOpenChange: setOpen,\n      })\n      const { getReferenceProps, getFloatingProps } = useInteractions([\n        useFocus(floating.context),\n        useRole(floating.context, { role: 'dialog' }),\n        useDismiss(floating.context),\n      ])\n      return {\n        ...floating,\n        getReferenceProps,\n        getFloatingProps,\n      } as any\n    }\n\n    const useFloatingContext = React.useCallback(useFloatingFn, [open])\n\n    return (\n      <FloatingOverrideContext.Provider value={useFloatingContext}>\n        <Popper {...popperScope} {...restProps}>\n          <PopoverProviderInternal\n            scope={__scopePopover}\n            contentId={useId()}\n            triggerRef={triggerRef}\n            open={open}\n            onOpenChange={setOpen}\n            onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])}\n            hasCustomAnchor={hasCustomAnchor}\n            onCustomAnchorAdd={React.useCallback(() => setHasCustomAnchor(true), [])}\n            onCustomAnchorRemove={React.useCallback(() => setHasCustomAnchor(false), [])}\n            modal={modal}\n          >\n            {children}\n          </PopoverProviderInternal>\n        </Popper>\n      </FloatingOverrideContext.Provider>\n    )\n  }) as React.FC<PopoverProps>,\n  {\n    Anchor: PopoverAnchor,\n    Arrow: PopoverArrow,\n    Trigger: PopoverTrigger,\n    Content: PopoverContent,\n    Close: PopoverClose,\n  }\n)\n\nPopover.displayName = POPOVER_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open: boolean) {\n  return open ? 'open' : 'closed'\n}\n"],
-  "mappings": "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",
-  "names": []
+  "sourcesContent": ["// adapted from radix-ui popover\n\nimport '@tamagui/polyfill-dev'\n\nimport { AnimatePresence } from '@tamagui/animate-presence'\nimport { hideOthers } from '@tamagui/aria-hidden'\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n  MediaQueryKey,\n  SizeTokens,\n  Theme,\n  composeEventHandlers,\n  isWeb,\n  useEvent,\n  useGet,\n  useId,\n  useMedia,\n  useThemeName,\n  withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { DismissableProps } from '@tamagui/dismissable'\nimport { FocusScope, FocusScopeProps } from '@tamagui/focus-scope'\nimport {\n  FloatingOverrideContext,\n  Popper,\n  PopperAnchor,\n  PopperArrow,\n  PopperArrowProps,\n  PopperContent,\n  PopperContentProps,\n  PopperProps,\n  createPopperScope,\n} from '@tamagui/popper'\nimport { Portal, PortalHost, PortalItem } from '@tamagui/portal'\nimport { RemoveScroll, RemoveScrollProps } from '@tamagui/remove-scroll'\nimport { ControlledSheet, SheetController } from '@tamagui/sheet'\nimport { YStack, YStackProps } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\nimport { ScrollView, ScrollViewProps, View } from 'react-native'\n\nimport type { UseFloatingProps } from './floating'\nimport { useDismiss, useFloating, useFocus, useInteractions, useRole } from './floating'\n\nconst POPOVER_NAME = 'Popover'\n\ntype ScopedProps<P> = P & { __scopePopover?: Scope }\ntype NonNull<A> = Exclude<A, void | null>\n\nexport type PopoverProps = PopperProps & {\n  open?: boolean\n  defaultOpen?: boolean\n  onOpenChange?: (open: boolean) => void\n  sheetBreakpoint?: MediaQueryKey | false\n}\n\ntype PopoverContextValue = {\n  triggerRef: React.RefObject<HTMLButtonElement>\n  contentId?: string\n  open: boolean\n  onOpenChange(open: boolean): void\n  onOpenToggle(): void\n  hasCustomAnchor: boolean\n  onCustomAnchorAdd(): void\n  onCustomAnchorRemove(): void\n  size?: SizeTokens\n  sheetBreakpoint: NonNull<PopoverProps['sheetBreakpoint']>\n  scopeKey: string\n}\n\nconst [createPopoverContext, createPopoverScopeInternal] = createContextScope(POPOVER_NAME, [\n  createPopperScope,\n])\nexport const usePopoverScope = createPopperScope()\nexport const createPopoverScope = createPopoverScopeInternal\n\nconst [PopoverProviderInternal, usePopoverInternalContext] =\n  createPopoverContext<PopoverContextValue>(POPOVER_NAME)\n\nexport const __PopoverProviderInternal = PopoverProviderInternal\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverAnchor\n * -----------------------------------------------------------------------------------------------*/\n\nconst ANCHOR_NAME = 'PopoverAnchor'\n\ntype PopoverAnchorElement = HTMLElement | View\nexport type PopoverAnchorProps = YStackProps\n\nexport const PopoverAnchor = React.forwardRef<PopoverAnchorElement, PopoverAnchorProps>(\n  (props: ScopedProps<PopoverAnchorProps>, forwardedRef) => {\n    const { __scopePopover, ...anchorProps } = props\n    const context = usePopoverInternalContext(ANCHOR_NAME, __scopePopover)\n    const popperScope = usePopoverScope(__scopePopover)\n    const { onCustomAnchorAdd, onCustomAnchorRemove } = context\n\n    React.useEffect(() => {\n      onCustomAnchorAdd()\n      return () => onCustomAnchorRemove()\n    }, [onCustomAnchorAdd, onCustomAnchorRemove])\n\n    return <PopperAnchor {...popperScope} {...anchorProps} ref={forwardedRef} />\n  }\n)\n\nPopoverAnchor.displayName = ANCHOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'PopoverTrigger'\n\ntype PopoverTriggerElement = HTMLElement | View\nexport type PopoverTriggerProps = YStackProps\n\nexport const PopoverTrigger = React.forwardRef<PopoverTriggerElement, PopoverTriggerProps>(\n  (props: ScopedProps<PopoverTriggerProps>, forwardedRef) => {\n    const { __scopePopover, ...triggerProps } = props\n    const context = usePopoverInternalContext(TRIGGER_NAME, __scopePopover)\n    const popperScope = usePopoverScope(__scopePopover)\n    const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef)\n\n    const trigger = (\n      <YStack\n        aria-haspopup=\"dialog\"\n        aria-expanded={context.open}\n        // TODO not matching\n        // aria-controls={context.contentId}\n        data-state={getState(context.open)}\n        {...triggerProps}\n        ref={composedTriggerRef}\n        onPress={composeEventHandlers(props.onPress, context.onOpenToggle)}\n      />\n    )\n\n    return context.hasCustomAnchor ? (\n      trigger\n    ) : (\n      <PopperAnchor asChild {...popperScope}>\n        {trigger}\n      </PopperAnchor>\n    )\n  }\n)\n\nPopoverTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'PopoverContent'\n\nexport type PopoverContentProps = PopoverContentTypeProps\n\ntype PopoverContentTypeElement = PopoverContentImplElement\n\nexport interface PopoverContentTypeProps\n  extends Omit<PopoverContentImplProps, 'disableOutsidePointerEvents'> {\n  /**\n   * @see https://github.com/theKashey/react-remove-scroll#usage\n   */\n  allowPinchZoom?: RemoveScrollProps['allowPinchZoom']\n}\n\nexport const PopoverContent = React.forwardRef<PopoverContentTypeElement, PopoverContentTypeProps>(\n  (props: ScopedProps<PopoverContentTypeProps>, forwardedRef) => {\n    const { allowPinchZoom, trapFocus, disableRemoveScroll = true, ...contentModalProps } = props\n    const context = usePopoverInternalContext(CONTENT_NAME, props.__scopePopover)\n    const contentRef = React.useRef<HTMLDivElement>(null)\n    const composedRefs = useComposedRefs(forwardedRef, contentRef)\n    const isRightClickOutsideRef = React.useRef(false)\n    const themeName = useThemeName()\n\n    // aria-hide everything except the content (better supported equivalent to setting aria-modal)\n    React.useEffect(() => {\n      if (!context.open) return\n      const content = contentRef.current\n      if (content) return hideOthers(content)\n    }, [context.open])\n\n    return (\n      <Portal zIndex={props.zIndex ?? 1000}>\n        <Theme name={themeName}>\n          <PopoverContentImpl\n            {...contentModalProps}\n            disableRemoveScroll={disableRemoveScroll}\n            ref={composedRefs}\n            // we make sure we're not trapping once it's been closed\n            // (closed !== unmounted when animating out)\n            trapFocus={trapFocus ?? context.open}\n            disableOutsidePointerEvents\n            onCloseAutoFocus={composeEventHandlers(props.onCloseAutoFocus, (event) => {\n              event.preventDefault()\n              if (!isRightClickOutsideRef.current) context.triggerRef.current?.focus()\n            })}\n            onPointerDownOutside={composeEventHandlers(\n              props.onPointerDownOutside,\n              (event) => {\n                const originalEvent = event.detail.originalEvent\n                const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true\n                const isRightClick = originalEvent.button === 2 || ctrlLeftClick\n                isRightClickOutsideRef.current = isRightClick\n              },\n              { checkDefaultPrevented: false }\n            )}\n            // When focus is trapped, a `focusout` event may still happen.\n            // We make sure we don't trigger our `onDismiss` in such case.\n            onFocusOutside={composeEventHandlers(\n              props.onFocusOutside,\n              (event) => event.preventDefault(),\n              { checkDefaultPrevented: false }\n            )}\n          />\n        </Theme>\n      </Portal>\n    )\n  }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype PopoverContentImplElement = React.ElementRef<typeof PopperContent>\n\nexport interface PopoverContentImplProps\n  extends PopperContentProps,\n    Omit<DismissableProps, 'onDismiss' | 'children'> {\n  /**\n   * Whether focus should be trapped within the `Popover`\n   * (default: false)\n   */\n  trapFocus?: FocusScopeProps['trapped']\n\n  /**\n   * Event handler called when auto-focusing on open.\n   * Can be prevented.\n   */\n  onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus']\n\n  /**\n   * Event handler called when auto-focusing on close.\n   * Can be prevented.\n   */\n  onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus']\n\n  disableRemoveScroll?: boolean\n}\n\nconst PopoverContentImpl = React.forwardRef<PopoverContentImplElement, PopoverContentImplProps>(\n  (props: ScopedProps<PopoverContentImplProps>, forwardedRef) => {\n    const {\n      __scopePopover,\n      trapFocus,\n      onOpenAutoFocus,\n      onCloseAutoFocus,\n      disableOutsidePointerEvents,\n      onEscapeKeyDown,\n      onPointerDownOutside,\n      onFocusOutside,\n      onInteractOutside,\n      children,\n      disableRemoveScroll,\n      ...contentProps\n    } = props\n    const popperScope = usePopoverScope(__scopePopover)\n    const context = usePopoverInternalContext(CONTENT_NAME, popperScope.__scopePopover)\n    const showSheet = useShowPopoverSheet(context)\n    // const popperContext = usePopperContext(CONTENT_NAME, popperScope.__scopePopper)\n\n    if (showSheet) {\n      // unwrap the PopoverScrollView if used, as it will use the SheetScrollView if that exists\n      const childrenWithoutScrollView = React.Children.toArray(children).map((child) => {\n        if (React.isValidElement(child)) {\n          if (child.type === PopoverScrollView) {\n            return child.props.children\n          }\n        }\n        return child\n      })\n\n      // doesn't show as popover yet on native, must use as sheet\n      return (\n        <PortalItem hostName={`${context.scopeKey}SheetContents`}>\n          {childrenWithoutScrollView}\n        </PortalItem>\n      )\n    }\n\n    // const handleDismiss = React.useCallback(() => context.onOpenChange(false), [])\n    // <Dismissable\n    //     disableOutsidePointerEvents={disableOutsidePointerEvents}\n    //     // onInteractOutside={onInteractOutside}\n    //     onEscapeKeyDown={onEscapeKeyDown}\n    //     // onPointerDownOutside={onPointerDownOutside}\n    //     // onFocusOutside={onFocusOutside}\n    //     onDismiss={handleDismiss}\n    //   >\n\n    return (\n      <AnimatePresence>\n        {!!context.open && (\n          <PopperContent\n            key=\"popper-content\"\n            data-state={getState(context.open)}\n            id={context.contentId}\n            pointerEvents=\"auto\"\n            {...popperScope}\n            {...contentProps}\n            ref={forwardedRef}\n          >\n            <RemoveScroll\n              enabled={disableRemoveScroll ? false : context.open}\n              allowPinchZoom\n              // causes lots of bugs on touch web on site\n              removeScrollBar={false}\n              style={{\n                display: 'contents',\n              }}\n            >\n              {trapFocus === false ? (\n                children\n              ) : (\n                <FocusScope\n                  loop\n                  trapped={trapFocus ?? context.open}\n                  onMountAutoFocus={onOpenAutoFocus}\n                  onUnmountAutoFocus={onCloseAutoFocus}\n                >\n                  <div style={{ display: 'contents' }}>{children}</div>\n                </FocusScope>\n              )}\n            </RemoveScroll>\n          </PopperContent>\n        )}\n      </AnimatePresence>\n    )\n  }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverClose\n * -----------------------------------------------------------------------------------------------*/\n\nconst CLOSE_NAME = 'PopoverClose'\n\ntype PopoverCloseElement = HTMLElement | View\nexport type PopoverCloseProps = YStackProps\n\nexport const PopoverClose = React.forwardRef<PopoverCloseElement, PopoverCloseProps>(\n  (props: ScopedProps<PopoverCloseProps>, forwardedRef) => {\n    const { __scopePopover, ...closeProps } = props\n    const context = usePopoverInternalContext(CLOSE_NAME, __scopePopover)\n    return (\n      <YStack\n        {...closeProps}\n        ref={forwardedRef}\n        onPress={composeEventHandlers(props.onPress, () => context.onOpenChange(false))}\n      />\n    )\n  }\n)\n\nPopoverClose.displayName = CLOSE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverArrow\n * -----------------------------------------------------------------------------------------------*/\n\nconst ARROW_NAME = 'PopoverArrow'\n\ntype PopoverArrowElement = HTMLElement | View\nexport type PopoverArrowProps = PopperArrowProps\n\nexport const PopoverArrow = React.forwardRef<PopoverArrowElement, PopoverArrowProps>(\n  (props: ScopedProps<PopoverArrowProps>, forwardedRef) => {\n    const { __scopePopover, ...arrowProps } = props\n    const popperScope = usePopoverScope(__scopePopover)\n    return <PopperArrow {...popperScope} {...arrowProps} ref={forwardedRef} />\n  }\n)\n\nPopoverArrow.displayName = ARROW_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'PopoverSheetContents'\n\nexport const PopoverSheetContents = ({ __scopePopover }: ScopedProps<{}>) => {\n  const context = usePopoverInternalContext(SHEET_CONTENTS_NAME, __scopePopover)\n  return <PortalHost name={`${context.scopeKey}SheetContents`}></PortalHost>\n}\n\nPopoverSheetContents.displayName = SHEET_CONTENTS_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopoverScrollView\n * -----------------------------------------------------------------------------------------------*/\n\nconst PopoverScrollView = React.forwardRef<ScrollView, ScrollViewProps>((props, ref) => {\n  return <ScrollView ref={ref} {...props} />\n})\n\n/* -------------------------------------------------------------------------------------------------\n * Popover\n * -----------------------------------------------------------------------------------------------*/\n\nexport const Popover = withStaticProperties(\n  ((props: ScopedProps<PopoverProps>) => {\n    const {\n      __scopePopover,\n      children,\n      open: openProp,\n      defaultOpen,\n      onOpenChange,\n      sheetBreakpoint = false,\n      ...restProps\n    } = props\n    const popperScope = usePopoverScope(__scopePopover)\n    const triggerRef = React.useRef<HTMLButtonElement>(null)\n    const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false)\n    const [open, setOpen] = useControllableState({\n      prop: openProp,\n      defaultProp: defaultOpen || false,\n      onChange: onOpenChange,\n    })\n\n    const breakpointActive = useSheetBreakpointActive(sheetBreakpoint)\n\n    const useFloatingContext = React.useCallback(\n      (props: UseFloatingProps) => {\n        const floating = useFloating({\n          ...props,\n          open,\n          onOpenChange: setOpen,\n        })\n        const { getReferenceProps, getFloatingProps } = useInteractions([\n          useFocus(floating.context, {\n            enabled: !breakpointActive,\n          }),\n          useRole(floating.context, { role: 'dialog' }),\n          useDismiss(floating.context, {\n            enabled: !breakpointActive,\n          }),\n        ])\n        return {\n          ...floating,\n          getReferenceProps,\n          getFloatingProps,\n        }\n      },\n      [breakpointActive, open, setOpen]\n    )\n\n    return (\n      <FloatingOverrideContext.Provider value={useFloatingContext as any}>\n        <Popper {...popperScope} stayInFrame {...restProps}>\n          <PopoverProviderInternal\n            scope={__scopePopover}\n            scopeKey={__scopePopover ? Object.keys(__scopePopover)[0] : ''}\n            sheetBreakpoint={sheetBreakpoint}\n            contentId={useId()}\n            triggerRef={triggerRef}\n            open={open}\n            onOpenChange={setOpen}\n            onOpenToggle={useEvent(() => {\n              if (open && breakpointActive) {\n                return\n              }\n              setOpen(!open)\n            })}\n            hasCustomAnchor={hasCustomAnchor}\n            onCustomAnchorAdd={React.useCallback(() => setHasCustomAnchor(true), [])}\n            onCustomAnchorRemove={React.useCallback(() => setHasCustomAnchor(false), [])}\n          >\n            <PopoverSheetController onOpenChange={setOpen} __scopePopover={__scopePopover}>\n              {children}\n            </PopoverSheetController>\n          </PopoverProviderInternal>\n        </Popper>\n      </FloatingOverrideContext.Provider>\n    )\n  }) as React.FC<PopoverProps>,\n  {\n    Anchor: PopoverAnchor,\n    Arrow: PopoverArrow,\n    Trigger: PopoverTrigger,\n    Content: PopoverContent,\n    Close: PopoverClose,\n    SheetContents: PopoverSheetContents,\n    ScrollView: PopoverScrollView,\n    Sheet: ControlledSheet,\n  }\n)\n\nPopover.displayName = POPOVER_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open: boolean) {\n  return open ? 'open' : 'closed'\n}\n\nconst PopoverSheetController = (\n  props: ScopedProps<{\n    children: React.ReactNode\n    onOpenChange: React.Dispatch<React.SetStateAction<boolean>>\n  }>\n) => {\n  const context = usePopoverInternalContext('PopoverSheetController', props.__scopePopover)\n  const showSheet = useShowPopoverSheet(context)\n  const breakpointActive = useSheetBreakpointActive(context.sheetBreakpoint)\n  const getShowSheet = useGet(showSheet)\n  return (\n    <SheetController\n      onOpenChange={(val) => {\n        if (getShowSheet()) {\n          props.onOpenChange(val)\n        }\n      }}\n      open={context.open}\n      hidden={breakpointActive === false}\n    >\n      {props.children}\n    </SheetController>\n  )\n}\n\nconst useSheetBreakpointActive = (breakpoint?: MediaQueryKey | false) => {\n  const media = useMedia()\n  return breakpoint ? media[breakpoint] : false\n}\n\nconst useShowPopoverSheet = (context: PopoverContextValue) => {\n  // for now always show as sheet on native\n  if (!isWeb) return true\n  const breakpointActive = useSheetBreakpointActive(context.sheetBreakpoint)\n  return context.open === false ? false : breakpointActive\n}\n"],
+  "mappings": "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",
+  "names": ["props"]
 }

package/dist/esm/floating.js

@@ -0,0 +1,15 @@
+import {
+  useDismiss,
+  useFloating,
+  useFocus,
+  useInteractions,
+  useRole
+} from "@floating-ui/react-dom-interactions";
+export {
+  useDismiss,
+  useFloating,
+  useFocus,
+  useInteractions,
+  useRole
+};
+//# sourceMappingURL=floating.js.map

package/dist/esm/floating.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/floating.ts"],
+  "sourcesContent": ["export {\n  type UseFloatingProps,\n  useDismiss,\n  useFloating,\n  useFocus,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react-dom-interactions'\n"],
+  "mappings": "AAAA;AAAA,EAEE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;",
+  "names": []
+}

package/dist/esm/floating.native.js

@@ -0,0 +1,31 @@
+const useDismiss = () => {
+};
+const useFloating = () => {
+  return {
+    context: {},
+    reference: () => {
+    },
+    floating: () => {
+    },
+    refs: {
+      floating: {},
+      reference: {}
+    },
+    middlewareData: {}
+  };
+};
+const useFocus = () => {
+};
+const useInteractions = () => {
+  return {};
+};
+const useRole = () => {
+};
+export {
+  useDismiss,
+  useFloating,
+  useFocus,
+  useInteractions,
+  useRole
+};
+//# sourceMappingURL=floating.native.js.map

package/dist/esm/floating.native.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/floating.native.ts"],
+  "sourcesContent": ["export const useDismiss = () => {}\nexport const useFloating = () => {\n  return {\n    context: {},\n    reference: () => {},\n    floating: () => {},\n    refs: {\n      floating: {},\n      reference: {},\n    },\n    middlewareData: {},\n  }\n}\nexport const useFocus = () => {}\nexport const useInteractions = () => {\n  return {}\n}\nexport const useRole = () => {}\n"],
+  "mappings": "AAAO,MAAM,aAAa,MAAM;AAAC;AAC1B,MAAM,cAAc,MAAM;AAC/B,SAAO;AAAA,IACL,SAAS,CAAC;AAAA,IACV,WAAW,MAAM;AAAA,IAAC;AAAA,IAClB,UAAU,MAAM;AAAA,IAAC;AAAA,IACjB,MAAM;AAAA,MACJ,UAAU,CAAC;AAAA,MACX,WAAW,CAAC;AAAA,IACd;AAAA,IACA,gBAAgB,CAAC;AAAA,EACnB;AACF;AACO,MAAM,WAAW,MAAM;AAAC;AACxB,MAAM,kBAAkB,MAAM;AACnC,SAAO,CAAC;AACV;AACO,MAAM,UAAU,MAAM;AAAC;",
+  "names": []
+}

package/dist/esm/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/index.tsx"],
   "sourcesContent": ["export * from './Popover'\n"],
-  "mappings": "AAAA;",
+  "mappings": "AAAA,cAAc;",
   "names": []
 }

package/dist/jsx/Popover.js

@@ -1,17 +1,20 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 import "@tamagui/polyfill-dev";
-import {
-  useDismiss,
-  useFloating,
-  useFocus,
-  useInteractions,
-  useRole
-} from "@floating-ui/react-dom-interactions";
 import { AnimatePresence } from "@tamagui/animate-presence";
+import { hideOthers } from "@tamagui/aria-hidden";
 import { useComposedRefs } from "@tamagui/compose-refs";
-import { composeEventHandlers, useId, withStaticProperties } from "@tamagui/core";
+import {
+  Theme,
+  composeEventHandlers,
+  isWeb,
+  useEvent,
+  useGet,
+  useId,
+  useMedia,
+  useThemeName,
+  withStaticProperties
+} from "@tamagui/core";
 import { createContextScope } from "@tamagui/create-context";
+import { FocusScope } from "@tamagui/focus-scope";
 import {
   FloatingOverrideContext,
   Popper,
@@ -20,10 +23,14 @@ import {
   PopperContent,
   createPopperScope
 } from "@tamagui/popper";
-import { Portal } from "@tamagui/portal";
+import { Portal, PortalHost, PortalItem } from "@tamagui/portal";
+import { RemoveScroll } from "@tamagui/remove-scroll";
+import { ControlledSheet, SheetController } from "@tamagui/sheet";
 import { YStack } from "@tamagui/stacks";
 import { useControllableState } from "@tamagui/use-controllable-state";
 import * as React from "react";
+import { ScrollView } from "react-native";
+import { useDismiss, useFloating, useFocus, useInteractions, useRole } from "./floating";
 const POPOVER_NAME = "Popover";
 const [createPopoverContext, createPopoverScopeInternal] = createContextScope(POPOVER_NAME, [
   createPopperScope
@@ -33,167 +40,227 @@ const createPopoverScope = createPopoverScopeInternal;
 const [PopoverProviderInternal, usePopoverInternalContext] = createPopoverContext(POPOVER_NAME);
 const __PopoverProviderInternal = PopoverProviderInternal;
 const ANCHOR_NAME = "PopoverAnchor";
-const PopoverAnchor = React.forwardRef((props, forwardedRef) => {
-  const { __scopePopover, ...anchorProps } = props;
-  const context = usePopoverInternalContext(ANCHOR_NAME, __scopePopover);
-  const popperScope = usePopoverScope(__scopePopover);
-  const { onCustomAnchorAdd, onCustomAnchorRemove } = context;
-  React.useEffect(() => {
-    onCustomAnchorAdd();
-    return () => onCustomAnchorRemove();
-  }, [onCustomAnchorAdd, onCustomAnchorRemove]);
-  return <PopperAnchor {...popperScope} {...anchorProps} ref={forwardedRef} />;
-});
+const PopoverAnchor = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopePopover, ...anchorProps } = props;
+    const context = usePopoverInternalContext(ANCHOR_NAME, __scopePopover);
+    const popperScope = usePopoverScope(__scopePopover);
+    const { onCustomAnchorAdd, onCustomAnchorRemove } = context;
+    React.useEffect(() => {
+      onCustomAnchorAdd();
+      return () => onCustomAnchorRemove();
+    }, [onCustomAnchorAdd, onCustomAnchorRemove]);
+    return <PopperAnchor {...popperScope} {...anchorProps} ref={forwardedRef} />;
+  }
+);
 PopoverAnchor.displayName = ANCHOR_NAME;
 const TRIGGER_NAME = "PopoverTrigger";
-const PopoverTrigger = React.forwardRef((props, forwardedRef) => {
-  const { __scopePopover, ...triggerProps } = props;
-  const context = usePopoverInternalContext(TRIGGER_NAME, __scopePopover);
-  const popperScope = usePopoverScope(__scopePopover);
-  const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef);
-  const trigger = <YStack aria-haspopup="dialog" aria-expanded={context.open} aria-controls={context.contentId} data-state={getState(context.open)} {...triggerProps} ref={composedTriggerRef} onPress={composeEventHandlers(props.onPress, context.onOpenToggle)} />;
-  return context.hasCustomAnchor ? trigger : <PopperAnchor asChild {...popperScope}>{trigger}</PopperAnchor>;
-});
+const PopoverTrigger = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopePopover, ...triggerProps } = props;
+    const context = usePopoverInternalContext(TRIGGER_NAME, __scopePopover);
+    const popperScope = usePopoverScope(__scopePopover);
+    const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef);
+    const trigger = <YStack aria-haspopup="dialog" aria-expanded={context.open} data-state={getState(context.open)} {...triggerProps} ref={composedTriggerRef} onPress={composeEventHandlers(props.onPress, context.onOpenToggle)} />;
+    return context.hasCustomAnchor ? trigger : <PopperAnchor asChild {...popperScope}>{trigger}</PopperAnchor>;
+  }
+);
 PopoverTrigger.displayName = TRIGGER_NAME;
 const CONTENT_NAME = "PopoverContent";
-const PopoverContent = React.forwardRef((props, forwardedRef) => {
-  const context = usePopoverInternalContext(CONTENT_NAME, props.__scopePopover);
-  return context.modal ? <PopoverContentModal {...props} ref={forwardedRef} /> : <PopoverContentNonModal {...props} ref={forwardedRef} />;
-});
-PopoverContent.displayName = CONTENT_NAME;
-const PopoverContentModal = React.forwardRef((props, forwardedRef) => {
-  const { allowPinchZoom, ...contentModalProps } = props;
-  const context = usePopoverInternalContext(CONTENT_NAME, props.__scopePopover);
-  const contentRef = React.useRef(null);
-  const composedRefs = useComposedRefs(forwardedRef, contentRef);
-  const isRightClickOutsideRef = React.useRef(false);
-  const PortalWrapper = context.modal ? Portal : React.Fragment;
-  return <PortalWrapper><PopoverContentImpl {...contentModalProps} ref={composedRefs} trapFocus={context.open} disableOutsidePointerEvents onCloseAutoFocus={composeEventHandlers(props.onCloseAutoFocus, (event) => {
-    var _a;
-    event.preventDefault();
-    if (!isRightClickOutsideRef.current)
-      (_a = context.triggerRef.current) == null ? void 0 : _a.focus();
-  })} onPointerDownOutside={composeEventHandlers(props.onPointerDownOutside, (event) => {
-    console.log("pinter outside", event);
-    const originalEvent = event.detail.originalEvent;
-    const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true;
-    const isRightClick = originalEvent.button === 2 || ctrlLeftClick;
-    isRightClickOutsideRef.current = isRightClick;
-  }, { checkDefaultPrevented: false })} onFocusOutside={composeEventHandlers(props.onFocusOutside, (event) => event.preventDefault(), { checkDefaultPrevented: false })} /></PortalWrapper>;
-});
-const PopoverContentNonModal = React.forwardRef((props, forwardedRef) => {
-  const { ...contentNonModalProps } = props;
-  const context = usePopoverInternalContext(CONTENT_NAME, props.__scopePopover);
-  const hasInteractedOutsideRef = React.useRef(false);
-  const PortalWrapper = context.modal ? Portal : React.Fragment;
-  return <PortalWrapper><PopoverContentImpl {...contentNonModalProps} ref={forwardedRef} trapFocus={false} disableOutsidePointerEvents={false} onCloseAutoFocus={(event) => {
-    var _a, _b;
-    (_a = props.onCloseAutoFocus) == null ? void 0 : _a.call(props, event);
-    if (!event.defaultPrevented) {
-      if (!hasInteractedOutsideRef.current)
-        (_b = context.triggerRef.current) == null ? void 0 : _b.focus();
+const PopoverContent = React.forwardRef(
+  (props, forwardedRef) => {
+    const { allowPinchZoom, trapFocus, disableRemoveScroll = true, ...contentModalProps } = props;
+    const context = usePopoverInternalContext(CONTENT_NAME, props.__scopePopover);
+    const contentRef = React.useRef(null);
+    const composedRefs = useComposedRefs(forwardedRef, contentRef);
+    const isRightClickOutsideRef = React.useRef(false);
+    const themeName = useThemeName();
+    React.useEffect(() => {
+      if (!context.open)
+        return;
+      const content = contentRef.current;
+      if (content)
+        return hideOthers(content);
+    }, [context.open]);
+    return <Portal zIndex={props.zIndex ?? 1e3}><Theme name={themeName}><PopoverContentImpl {...contentModalProps} disableRemoveScroll={disableRemoveScroll} ref={composedRefs} trapFocus={trapFocus ?? context.open} disableOutsidePointerEvents onCloseAutoFocus={composeEventHandlers(props.onCloseAutoFocus, (event) => {
       event.preventDefault();
+      if (!isRightClickOutsideRef.current)
+        context.triggerRef.current?.focus();
+    })} onPointerDownOutside={composeEventHandlers(
+      props.onPointerDownOutside,
+      (event) => {
+        const originalEvent = event.detail.originalEvent;
+        const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true;
+        const isRightClick = originalEvent.button === 2 || ctrlLeftClick;
+        isRightClickOutsideRef.current = isRightClick;
+      },
+      { checkDefaultPrevented: false }
+    )} onFocusOutside={composeEventHandlers(
+      props.onFocusOutside,
+      (event) => event.preventDefault(),
+      { checkDefaultPrevented: false }
+    )} /></Theme></Portal>;
+  }
+);
+const PopoverContentImpl = React.forwardRef(
+  (props, forwardedRef) => {
+    const {
+      __scopePopover,
+      trapFocus,
+      onOpenAutoFocus,
+      onCloseAutoFocus,
+      disableOutsidePointerEvents,
+      onEscapeKeyDown,
+      onPointerDownOutside,
+      onFocusOutside,
+      onInteractOutside,
+      children,
+      disableRemoveScroll,
+      ...contentProps
+    } = props;
+    const popperScope = usePopoverScope(__scopePopover);
+    const context = usePopoverInternalContext(CONTENT_NAME, popperScope.__scopePopover);
+    const showSheet = useShowPopoverSheet(context);
+    if (showSheet) {
+      const childrenWithoutScrollView = React.Children.toArray(children).map((child) => {
+        if (React.isValidElement(child)) {
+          if (child.type === PopoverScrollView) {
+            return child.props.children;
+          }
+        }
+        return child;
+      });
+      return <PortalItem hostName={`${context.scopeKey}SheetContents`}>{childrenWithoutScrollView}</PortalItem>;
     }
-    hasInteractedOutsideRef.current = false;
-  }} onInteractOutside={(event) => {
-    var _a, _b;
-    (_a = props.onInteractOutside) == null ? void 0 : _a.call(props, event);
-    if (!event.defaultPrevented)
-      hasInteractedOutsideRef.current = true;
-    const target = event.target;
-    const targetIsTrigger = (_b = context.triggerRef.current) == null ? void 0 : _b.contains(target);
-    if (targetIsTrigger)
-      event.preventDefault();
-  }} /></PortalWrapper>;
-});
-const PopoverContentImpl = React.forwardRef((props, forwardedRef) => {
-  const {
-    __scopePopover,
-    trapFocus,
-    onOpenAutoFocus,
-    onCloseAutoFocus,
-    disableOutsidePointerEvents,
-    onEscapeKeyDown,
-    onPointerDownOutside,
-    onFocusOutside,
-    onInteractOutside,
-    ...contentProps
-  } = props;
-  const context = usePopoverInternalContext(CONTENT_NAME, __scopePopover);
-  const popperScope = usePopoverScope(__scopePopover);
-  return <AnimatePresence>{!!context.open && <PopperContent data-state={getState(context.open)} id={context.contentId} pointerEvents="auto" {...popperScope} {...contentProps} ref={forwardedRef} />}</AnimatePresence>;
-});
+    return <AnimatePresence>{!!context.open && <PopperContent key="popper-content" data-state={getState(context.open)} id={context.contentId} pointerEvents="auto" {...popperScope} {...contentProps} ref={forwardedRef}><RemoveScroll enabled={disableRemoveScroll ? false : context.open} allowPinchZoom removeScrollBar={false} style={{
+      display: "contents"
+    }}>{trapFocus === false ? children : <FocusScope loop trapped={trapFocus ?? context.open} onMountAutoFocus={onOpenAutoFocus} onUnmountAutoFocus={onCloseAutoFocus}><div style={{ display: "contents" }}>{children}</div></FocusScope>}</RemoveScroll></PopperContent>}</AnimatePresence>;
+  }
+);
 const CLOSE_NAME = "PopoverClose";
-const PopoverClose = React.forwardRef((props, forwardedRef) => {
-  const { __scopePopover, ...closeProps } = props;
-  const context = usePopoverInternalContext(CLOSE_NAME, __scopePopover);
-  return <YStack {...closeProps} ref={forwardedRef} onPress={composeEventHandlers(props.onPress, () => context.onOpenChange(false))} />;
-});
+const PopoverClose = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopePopover, ...closeProps } = props;
+    const context = usePopoverInternalContext(CLOSE_NAME, __scopePopover);
+    return <YStack {...closeProps} ref={forwardedRef} onPress={composeEventHandlers(props.onPress, () => context.onOpenChange(false))} />;
+  }
+);
 PopoverClose.displayName = CLOSE_NAME;
 const ARROW_NAME = "PopoverArrow";
-const PopoverArrow = React.forwardRef((props, forwardedRef) => {
-  const { __scopePopover, ...arrowProps } = props;
-  const popperScope = usePopoverScope(__scopePopover);
-  return <PopperArrow {...popperScope} {...arrowProps} ref={forwardedRef} />;
-});
+const PopoverArrow = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopePopover, ...arrowProps } = props;
+    const popperScope = usePopoverScope(__scopePopover);
+    return <PopperArrow {...popperScope} {...arrowProps} ref={forwardedRef} />;
+  }
+);
 PopoverArrow.displayName = ARROW_NAME;
-const Popover = withStaticProperties((props) => {
-  const {
-    __scopePopover,
-    children,
-    open: openProp,
-    defaultOpen,
-    onOpenChange,
-    modal = true,
-    ...restProps
-  } = props;
-  const popperScope = usePopoverScope(__scopePopover);
-  const triggerRef = React.useRef(null);
-  const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
-  const [open, setOpen] = useControllableState({
-    prop: openProp,
-    defaultProp: defaultOpen || false,
-    onChange: onOpenChange
-  });
-  const useFloatingFn = /* @__PURE__ */ __name((props2) => {
-    const floating = useFloating({
-      ...props2,
-      open,
-      onOpenChange: setOpen
-    });
-    const { getReferenceProps, getFloatingProps } = useInteractions([
-      useFocus(floating.context),
-      useRole(floating.context, { role: "dialog" }),
-      useDismiss(floating.context)
-    ]);
-    return {
-      ...floating,
-      getReferenceProps,
-      getFloatingProps
-    };
-  }, "useFloatingFn");
-  const useFloatingContext = React.useCallback(useFloatingFn, [open]);
-  return <FloatingOverrideContext.Provider value={useFloatingContext}><Popper {...popperScope} {...restProps}><PopoverProviderInternal scope={__scopePopover} contentId={useId()} triggerRef={triggerRef} open={open} onOpenChange={setOpen} onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])} hasCustomAnchor={hasCustomAnchor} onCustomAnchorAdd={React.useCallback(() => setHasCustomAnchor(true), [])} onCustomAnchorRemove={React.useCallback(() => setHasCustomAnchor(false), [])} modal={modal}>{children}</PopoverProviderInternal></Popper></FloatingOverrideContext.Provider>;
-}, {
-  Anchor: PopoverAnchor,
-  Arrow: PopoverArrow,
-  Trigger: PopoverTrigger,
-  Content: PopoverContent,
-  Close: PopoverClose
+const SHEET_CONTENTS_NAME = "PopoverSheetContents";
+const PopoverSheetContents = ({ __scopePopover }) => {
+  const context = usePopoverInternalContext(SHEET_CONTENTS_NAME, __scopePopover);
+  return <PortalHost name={`${context.scopeKey}SheetContents`} />;
+};
+PopoverSheetContents.displayName = SHEET_CONTENTS_NAME;
+const PopoverScrollView = React.forwardRef((props, ref) => {
+  return <ScrollView ref={ref} {...props} />;
 });
+const Popover = withStaticProperties(
+  (props) => {
+    const {
+      __scopePopover,
+      children,
+      open: openProp,
+      defaultOpen,
+      onOpenChange,
+      sheetBreakpoint = false,
+      ...restProps
+    } = props;
+    const popperScope = usePopoverScope(__scopePopover);
+    const triggerRef = React.useRef(null);
+    const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
+    const [open, setOpen] = useControllableState({
+      prop: openProp,
+      defaultProp: defaultOpen || false,
+      onChange: onOpenChange
+    });
+    const breakpointActive = useSheetBreakpointActive(sheetBreakpoint);
+    const useFloatingContext = React.useCallback(
+      (props2) => {
+        const floating = useFloating({
+          ...props2,
+          open,
+          onOpenChange: setOpen
+        });
+        const { getReferenceProps, getFloatingProps } = useInteractions([
+          useFocus(floating.context, {
+            enabled: !breakpointActive
+          }),
+          useRole(floating.context, { role: "dialog" }),
+          useDismiss(floating.context, {
+            enabled: !breakpointActive
+          })
+        ]);
+        return {
+          ...floating,
+          getReferenceProps,
+          getFloatingProps
+        };
+      },
+      [breakpointActive, open, setOpen]
+    );
+    return <FloatingOverrideContext.Provider value={useFloatingContext}><Popper {...popperScope} stayInFrame {...restProps}><PopoverProviderInternal scope={__scopePopover} scopeKey={__scopePopover ? Object.keys(__scopePopover)[0] : ""} sheetBreakpoint={sheetBreakpoint} contentId={useId()} triggerRef={triggerRef} open={open} onOpenChange={setOpen} onOpenToggle={useEvent(() => {
+      if (open && breakpointActive) {
+        return;
+      }
+      setOpen(!open);
+    })} hasCustomAnchor={hasCustomAnchor} onCustomAnchorAdd={React.useCallback(() => setHasCustomAnchor(true), [])} onCustomAnchorRemove={React.useCallback(() => setHasCustomAnchor(false), [])}><PopoverSheetController onOpenChange={setOpen} __scopePopover={__scopePopover}>{children}</PopoverSheetController></PopoverProviderInternal></Popper></FloatingOverrideContext.Provider>;
+  },
+  {
+    Anchor: PopoverAnchor,
+    Arrow: PopoverArrow,
+    Trigger: PopoverTrigger,
+    Content: PopoverContent,
+    Close: PopoverClose,
+    SheetContents: PopoverSheetContents,
+    ScrollView: PopoverScrollView,
+    Sheet: ControlledSheet
+  }
+);
 Popover.displayName = POPOVER_NAME;
 function getState(open) {
   return open ? "open" : "closed";
 }
-__name(getState, "getState");
+const PopoverSheetController = (props) => {
+  const context = usePopoverInternalContext("PopoverSheetController", props.__scopePopover);
+  const showSheet = useShowPopoverSheet(context);
+  const breakpointActive = useSheetBreakpointActive(context.sheetBreakpoint);
+  const getShowSheet = useGet(showSheet);
+  return <SheetController onOpenChange={(val) => {
+    if (getShowSheet()) {
+      props.onOpenChange(val);
+    }
+  }} open={context.open} hidden={breakpointActive === false}>{props.children}</SheetController>;
+};
+const useSheetBreakpointActive = (breakpoint) => {
+  const media = useMedia();
+  return breakpoint ? media[breakpoint] : false;
+};
+const useShowPopoverSheet = (context) => {
+  if (!isWeb)
+    return true;
+  const breakpointActive = useSheetBreakpointActive(context.sheetBreakpoint);
+  return context.open === false ? false : breakpointActive;
+};
 export {
   Popover,
   PopoverAnchor,
   PopoverArrow,
   PopoverClose,
   PopoverContent,
+  PopoverSheetContents,
   PopoverTrigger,
   __PopoverProviderInternal,
   createPopoverScope,
   usePopoverScope
 };
+//# sourceMappingURL=Popover.js.map