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

package/dist/cjs/Popover.js

@@ -1,39 +1,10 @@
+"use strict";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -46,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var Popover_exports = {};
 __export(Popover_exports, {
@@ -55,23 +29,30 @@ __export(Popover_exports, {
   PopoverArrow: () => PopoverArrow,
   PopoverClose: () => PopoverClose,
   PopoverContent: () => PopoverContent,
+  PopoverSheetContents: () => PopoverSheetContents,
   PopoverTrigger: () => PopoverTrigger,
   __PopoverProviderInternal: () => __PopoverProviderInternal,
   createPopoverScope: () => createPopoverScope,
   usePopoverScope: () => usePopoverScope
 });
 module.exports = __toCommonJS(Popover_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_polyfill_dev = require("@tamagui/polyfill-dev");
-var import_react_dom_interactions = require("@floating-ui/react-dom-interactions");
 var import_animate_presence = require("@tamagui/animate-presence");
+var import_aria_hidden = require("@tamagui/aria-hidden");
 var import_compose_refs = require("@tamagui/compose-refs");
 var import_core = require("@tamagui/core");
 var import_create_context = require("@tamagui/create-context");
+var import_focus_scope = require("@tamagui/focus-scope");
 var import_popper = require("@tamagui/popper");
 var import_portal = require("@tamagui/portal");
+var import_remove_scroll = require("@tamagui/remove-scroll");
+var import_sheet = require("@tamagui/sheet");
 var import_stacks = require("@tamagui/stacks");
 var import_use_controllable_state = require("@tamagui/use-controllable-state");
 var React = __toESM(require("react"));
+var import_react_native = require("react-native");
+var import_floating = require("./floating");
 const POPOVER_NAME = "Popover";
 const [createPopoverContext, createPopoverScopeInternal] = (0, import_create_context.createContextScope)(POPOVER_NAME, [
   import_popper.createPopperScope
@@ -81,225 +62,319 @@ const createPopoverScope = createPopoverScopeInternal;
 const [PopoverProviderInternal, usePopoverInternalContext] = createPopoverContext(POPOVER_NAME);
 const __PopoverProviderInternal = PopoverProviderInternal;
 const ANCHOR_NAME = "PopoverAnchor";
-const PopoverAnchor = React.forwardRef((props, forwardedRef) => {
-  const _a = props, { __scopePopover } = _a, anchorProps = __objRest(_a, ["__scopePopover"]);
-  const context = usePopoverInternalContext(ANCHOR_NAME, __scopePopover);
-  const popperScope = usePopoverScope(__scopePopover);
-  const { onCustomAnchorAdd, onCustomAnchorRemove } = context;
-  React.useEffect(() => {
-    onCustomAnchorAdd();
-    return () => onCustomAnchorRemove();
-  }, [onCustomAnchorAdd, onCustomAnchorRemove]);
-  return /* @__PURE__ */ React.createElement(import_popper.PopperAnchor, __spreadProps(__spreadValues(__spreadValues({}, 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 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popper.PopperAnchor, {
+      ...popperScope,
+      ...anchorProps,
+      ref: forwardedRef
+    });
+  }
+);
 PopoverAnchor.displayName = ANCHOR_NAME;
 const TRIGGER_NAME = "PopoverTrigger";
-const PopoverTrigger = React.forwardRef((props, forwardedRef) => {
-  const _a = props, { __scopePopover } = _a, triggerProps = __objRest(_a, ["__scopePopover"]);
-  const context = usePopoverInternalContext(TRIGGER_NAME, __scopePopover);
-  const popperScope = usePopoverScope(__scopePopover);
-  const composedTriggerRef = (0, import_compose_refs.useComposedRefs)(forwardedRef, context.triggerRef);
-  const trigger = /* @__PURE__ */ React.createElement(import_stacks.YStack, __spreadProps(__spreadValues({
-    "aria-haspopup": "dialog",
-    "aria-expanded": context.open,
-    "aria-controls": context.contentId,
-    "data-state": getState(context.open)
-  }, triggerProps), {
-    ref: composedTriggerRef,
-    onPress: (0, import_core.composeEventHandlers)(props.onPress, context.onOpenToggle)
-  }));
-  return context.hasCustomAnchor ? trigger : /* @__PURE__ */ React.createElement(import_popper.PopperAnchor, __spreadValues({
-    asChild: true
-  }, popperScope), trigger);
-});
+const PopoverTrigger = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopePopover, ...triggerProps } = props;
+    const context = usePopoverInternalContext(TRIGGER_NAME, __scopePopover);
+    const popperScope = usePopoverScope(__scopePopover);
+    const composedTriggerRef = (0, import_compose_refs.useComposedRefs)(forwardedRef, context.triggerRef);
+    const trigger = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {
+      "aria-haspopup": "dialog",
+      "aria-expanded": context.open,
+      "data-state": getState(context.open),
+      ...triggerProps,
+      ref: composedTriggerRef,
+      onPress: (0, import_core.composeEventHandlers)(props.onPress, context.onOpenToggle)
+    });
+    return context.hasCustomAnchor ? trigger : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popper.PopperAnchor, {
+      asChild: true,
+      ...popperScope,
+      children: trigger
+    });
+  }
+);
 PopoverTrigger.displayName = TRIGGER_NAME;
 const CONTENT_NAME = "PopoverContent";
-const PopoverContent = React.forwardRef((props, forwardedRef) => {
-  const context = usePopoverInternalContext(CONTENT_NAME, props.__scopePopover);
-  return context.modal ? /* @__PURE__ */ React.createElement(PopoverContentModal, __spreadProps(__spreadValues({}, props), {
-    ref: forwardedRef
-  })) : /* @__PURE__ */ React.createElement(PopoverContentNonModal, __spreadProps(__spreadValues({}, props), {
-    ref: forwardedRef
-  }));
-});
-PopoverContent.displayName = CONTENT_NAME;
-const PopoverContentModal = React.forwardRef((props, forwardedRef) => {
-  const _a = props, { allowPinchZoom } = _a, contentModalProps = __objRest(_a, ["allowPinchZoom"]);
-  const context = usePopoverInternalContext(CONTENT_NAME, props.__scopePopover);
-  const contentRef = React.useRef(null);
-  const composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, contentRef);
-  const isRightClickOutsideRef = React.useRef(false);
-  const PortalWrapper = context.modal ? import_portal.Portal : React.Fragment;
-  return /* @__PURE__ */ React.createElement(PortalWrapper, null, /* @__PURE__ */ React.createElement(PopoverContentImpl, __spreadProps(__spreadValues({}, contentModalProps), {
-    ref: composedRefs,
-    trapFocus: context.open,
-    disableOutsidePointerEvents: true,
-    onCloseAutoFocus: (0, import_core.composeEventHandlers)(props.onCloseAutoFocus, (event) => {
-      var _a2;
-      event.preventDefault();
-      if (!isRightClickOutsideRef.current)
-        (_a2 = context.triggerRef.current) == null ? void 0 : _a2.focus();
-    }),
-    onPointerDownOutside: (0, import_core.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: (0, import_core.composeEventHandlers)(props.onFocusOutside, (event) => event.preventDefault(), { checkDefaultPrevented: false })
-  })));
-});
-const PopoverContentNonModal = React.forwardRef((props, forwardedRef) => {
-  const contentNonModalProps = __objRest(props, []);
-  const context = usePopoverInternalContext(CONTENT_NAME, props.__scopePopover);
-  const hasInteractedOutsideRef = React.useRef(false);
-  const PortalWrapper = context.modal ? import_portal.Portal : React.Fragment;
-  return /* @__PURE__ */ React.createElement(PortalWrapper, null, /* @__PURE__ */ React.createElement(PopoverContentImpl, __spreadProps(__spreadValues({}, 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();
-        event.preventDefault();
-      }
-      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();
+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 = (0, import_compose_refs.useComposedRefs)(forwardedRef, contentRef);
+    const isRightClickOutsideRef = React.useRef(false);
+    const themeName = (0, import_core.useThemeName)();
+    React.useEffect(() => {
+      if (!context.open)
+        return;
+      const content = contentRef.current;
+      if (content)
+        return (0, import_aria_hidden.hideOthers)(content);
+    }, [context.open]);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_portal.Portal, {
+      zIndex: props.zIndex ?? 1e3,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Theme, {
+        name: themeName,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopoverContentImpl, {
+          ...contentModalProps,
+          disableRemoveScroll,
+          ref: composedRefs,
+          trapFocus: trapFocus ?? context.open,
+          disableOutsidePointerEvents: true,
+          onCloseAutoFocus: (0, import_core.composeEventHandlers)(props.onCloseAutoFocus, (event) => {
+            var _a;
+            event.preventDefault();
+            if (!isRightClickOutsideRef.current)
+              (_a = context.triggerRef.current) == null ? void 0 : _a.focus();
+          }),
+          onPointerDownOutside: (0, import_core.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: (0, import_core.composeEventHandlers)(
+            props.onFocusOutside,
+            (event) => event.preventDefault(),
+            { checkDefaultPrevented: false }
+          )
+        })
+      })
+    });
+  }
+);
+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 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_portal.PortalItem, {
+        hostName: `${context.scopeKey}SheetContents`,
+        children: childrenWithoutScrollView
+      });
     }
-  })));
-});
-const PopoverContentImpl = React.forwardRef((props, forwardedRef) => {
-  const _a = props, {
-    __scopePopover,
-    trapFocus,
-    onOpenAutoFocus,
-    onCloseAutoFocus,
-    disableOutsidePointerEvents,
-    onEscapeKeyDown,
-    onPointerDownOutside,
-    onFocusOutside,
-    onInteractOutside
-  } = _a, contentProps = __objRest(_a, [
-    "__scopePopover",
-    "trapFocus",
-    "onOpenAutoFocus",
-    "onCloseAutoFocus",
-    "disableOutsidePointerEvents",
-    "onEscapeKeyDown",
-    "onPointerDownOutside",
-    "onFocusOutside",
-    "onInteractOutside"
-  ]);
-  const context = usePopoverInternalContext(CONTENT_NAME, __scopePopover);
-  const popperScope = usePopoverScope(__scopePopover);
-  return /* @__PURE__ */ React.createElement(import_animate_presence.AnimatePresence, null, !!context.open && /* @__PURE__ */ React.createElement(import_popper.PopperContent, __spreadProps(__spreadValues(__spreadValues({
-    "data-state": getState(context.open),
-    id: context.contentId,
-    pointerEvents: "auto"
-  }, popperScope), contentProps), {
-    ref: forwardedRef
-  })));
-});
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_animate_presence.AnimatePresence, {
+      children: !!context.open && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popper.PopperContent, {
+        "data-state": getState(context.open),
+        id: context.contentId,
+        pointerEvents: "auto",
+        ...popperScope,
+        ...contentProps,
+        ref: forwardedRef,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_remove_scroll.RemoveScroll, {
+          enabled: disableRemoveScroll ? false : context.open,
+          allowPinchZoom: true,
+          removeScrollBar: false,
+          style: {
+            display: "contents"
+          },
+          children: trapFocus === false ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_focus_scope.FocusScope, {
+            loop: true,
+            trapped: trapFocus ?? context.open,
+            onMountAutoFocus: onOpenAutoFocus,
+            onUnmountAutoFocus: onCloseAutoFocus,
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+              style: { display: "contents" },
+              children
+            })
+          })
+        })
+      }, "popper-content")
+    });
+  }
+);
 const CLOSE_NAME = "PopoverClose";
-const PopoverClose = React.forwardRef((props, forwardedRef) => {
-  const _a = props, { __scopePopover } = _a, closeProps = __objRest(_a, ["__scopePopover"]);
-  const context = usePopoverInternalContext(CLOSE_NAME, __scopePopover);
-  return /* @__PURE__ */ React.createElement(import_stacks.YStack, __spreadProps(__spreadValues({}, closeProps), {
-    ref: forwardedRef,
-    onPress: (0, import_core.composeEventHandlers)(props.onPress, () => context.onOpenChange(false))
-  }));
-});
+const PopoverClose = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopePopover, ...closeProps } = props;
+    const context = usePopoverInternalContext(CLOSE_NAME, __scopePopover);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {
+      ...closeProps,
+      ref: forwardedRef,
+      onPress: (0, import_core.composeEventHandlers)(props.onPress, () => context.onOpenChange(false))
+    });
+  }
+);
 PopoverClose.displayName = CLOSE_NAME;
 const ARROW_NAME = "PopoverArrow";
-const PopoverArrow = React.forwardRef((props, forwardedRef) => {
-  const _a = props, { __scopePopover } = _a, arrowProps = __objRest(_a, ["__scopePopover"]);
-  const popperScope = usePopoverScope(__scopePopover);
-  return /* @__PURE__ */ React.createElement(import_popper.PopperArrow, __spreadProps(__spreadValues(__spreadValues({}, popperScope), arrowProps), {
-    ref: forwardedRef
-  }));
-});
+const PopoverArrow = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopePopover, ...arrowProps } = props;
+    const popperScope = usePopoverScope(__scopePopover);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popper.PopperArrow, {
+      ...popperScope,
+      ...arrowProps,
+      ref: forwardedRef
+    });
+  }
+);
 PopoverArrow.displayName = ARROW_NAME;
-const Popover = (0, import_core.withStaticProperties)((props) => {
-  const _a = props, {
-    __scopePopover,
-    children,
-    open: openProp,
-    defaultOpen,
-    onOpenChange,
-    modal = true
-  } = _a, restProps = __objRest(_a, [
-    "__scopePopover",
-    "children",
-    "open",
-    "defaultOpen",
-    "onOpenChange",
-    "modal"
-  ]);
-  const popperScope = usePopoverScope(__scopePopover);
-  const triggerRef = React.useRef(null);
-  const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
-  const [open, setOpen] = (0, import_use_controllable_state.useControllableState)({
-    prop: openProp,
-    defaultProp: defaultOpen || false,
-    onChange: onOpenChange
+const SHEET_CONTENTS_NAME = "PopoverSheetContents";
+const PopoverSheetContents = ({ __scopePopover }) => {
+  const context = usePopoverInternalContext(SHEET_CONTENTS_NAME, __scopePopover);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_portal.PortalHost, {
+    name: `${context.scopeKey}SheetContents`
+  });
+};
+PopoverSheetContents.displayName = SHEET_CONTENTS_NAME;
+const PopoverScrollView = React.forwardRef((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.ScrollView, {
+    ref,
+    ...props
   });
-  const useFloatingFn = /* @__PURE__ */ __name((props2) => {
-    const floating = (0, import_react_dom_interactions.useFloating)(__spreadProps(__spreadValues({}, props2), {
-      open,
-      onOpenChange: setOpen
-    }));
-    const { getReferenceProps, getFloatingProps } = (0, import_react_dom_interactions.useInteractions)([
-      (0, import_react_dom_interactions.useFocus)(floating.context),
-      (0, import_react_dom_interactions.useRole)(floating.context, { role: "dialog" }),
-      (0, import_react_dom_interactions.useDismiss)(floating.context)
-    ]);
-    return __spreadProps(__spreadValues({}, floating), {
-      getReferenceProps,
-      getFloatingProps
-    });
-  }, "useFloatingFn");
-  const useFloatingContext = React.useCallback(useFloatingFn, [open]);
-  return /* @__PURE__ */ React.createElement(import_popper.FloatingOverrideContext.Provider, {
-    value: useFloatingContext
-  }, /* @__PURE__ */ React.createElement(import_popper.Popper, __spreadValues(__spreadValues({}, popperScope), restProps), /* @__PURE__ */ React.createElement(PopoverProviderInternal, {
-    scope: __scopePopover,
-    contentId: (0, import_core.useId)(),
-    triggerRef,
-    open,
-    onOpenChange: setOpen,
-    onOpenToggle: React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen]),
-    hasCustomAnchor,
-    onCustomAnchorAdd: React.useCallback(() => setHasCustomAnchor(true), []),
-    onCustomAnchorRemove: React.useCallback(() => setHasCustomAnchor(false), []),
-    modal
-  }, children)));
-}, {
-  Anchor: PopoverAnchor,
-  Arrow: PopoverArrow,
-  Trigger: PopoverTrigger,
-  Content: PopoverContent,
-  Close: PopoverClose
 });
+const Popover = (0, import_core.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] = (0, import_use_controllable_state.useControllableState)({
+      prop: openProp,
+      defaultProp: defaultOpen || false,
+      onChange: onOpenChange
+    });
+    const breakpointActive = useSheetBreakpointActive(sheetBreakpoint);
+    const useFloatingContext = React.useCallback(
+      (props2) => {
+        const floating = (0, import_floating.useFloating)({
+          ...props2,
+          open,
+          onOpenChange: setOpen
+        });
+        const { getReferenceProps, getFloatingProps } = (0, import_floating.useInteractions)([
+          (0, import_floating.useFocus)(floating.context, {
+            enabled: !breakpointActive
+          }),
+          (0, import_floating.useRole)(floating.context, { role: "dialog" }),
+          (0, import_floating.useDismiss)(floating.context, {
+            enabled: !breakpointActive
+          })
+        ]);
+        return {
+          ...floating,
+          getReferenceProps,
+          getFloatingProps
+        };
+      },
+      [breakpointActive, open, setOpen]
+    );
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popper.FloatingOverrideContext.Provider, {
+      value: useFloatingContext,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popper.Popper, {
+        ...popperScope,
+        stayInFrame: true,
+        ...restProps,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopoverProviderInternal, {
+          scope: __scopePopover,
+          scopeKey: __scopePopover ? Object.keys(__scopePopover)[0] : "",
+          sheetBreakpoint,
+          contentId: (0, import_core.useId)(),
+          triggerRef,
+          open,
+          onOpenChange: setOpen,
+          onOpenToggle: (0, import_core.useEvent)(() => {
+            if (open && breakpointActive) {
+              return;
+            }
+            setOpen(!open);
+          }),
+          hasCustomAnchor,
+          onCustomAnchorAdd: React.useCallback(() => setHasCustomAnchor(true), []),
+          onCustomAnchorRemove: React.useCallback(() => setHasCustomAnchor(false), []),
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopoverSheetController, {
+            onOpenChange: setOpen,
+            __scopePopover,
+            children
+          })
+        })
+      })
+    });
+  },
+  {
+    Anchor: PopoverAnchor,
+    Arrow: PopoverArrow,
+    Trigger: PopoverTrigger,
+    Content: PopoverContent,
+    Close: PopoverClose,
+    SheetContents: PopoverSheetContents,
+    ScrollView: PopoverScrollView,
+    Sheet: import_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 = (0, import_core.useGet)(showSheet);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_sheet.SheetController, {
+    onOpenChange: (val) => {
+      if (getShowSheet()) {
+        props.onOpenChange(val);
+      }
+    },
+    open: context.open,
+    hidden: breakpointActive === false,
+    children: props.children
+  });
+};
+const useSheetBreakpointActive = (breakpoint) => {
+  const media = (0, import_core.useMedia)();
+  return breakpoint ? media[breakpoint] : false;
+};
+const useShowPopoverSheet = (context) => {
+  if (!import_core.isWeb)
+    return true;
+  const breakpointActive = useSheetBreakpointActive(context.sheetBreakpoint);
+  return context.open === false ? false : breakpointActive;
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Popover,
@@ -307,6 +382,7 @@ __name(getState, "getState");
   PopoverArrow,
   PopoverClose,
   PopoverContent,
+  PopoverSheetContents,
   PopoverTrigger,
   __PopoverProviderInternal,
   createPopoverScope,