diff --git a/.changeset/fair-worms-reflect.md b/.changeset/fair-worms-reflect.md
new file mode 100644
index 0000000000..a67ced2cc0
--- /dev/null
+++ b/.changeset/fair-worms-reflect.md
@@ -0,0 +1,6 @@
+---
+"@nextui-org/popover": patch
+"@nextui-org/tooltip": patch
+---
+
+rollback PR3307. rescheduled to v2.5.0.
diff --git a/apps/docs/components/marketing/hero/floating-components.tsx b/apps/docs/components/marketing/hero/floating-components.tsx
index a50b39ca47..ef7baec19f 100644
--- a/apps/docs/components/marketing/hero/floating-components.tsx
+++ b/apps/docs/components/marketing/hero/floating-components.tsx
@@ -110,7 +110,6 @@ export const FloatingComponents: React.FC<{}> = () => {
content="Developers love Next.js"
isOpen={!isTablet}
placement="top"
- shouldBlockScroll={false}
style={{
zIndex: 39,
}}
diff --git a/packages/components/popover/package.json b/packages/components/popover/package.json
index 9b1aa3df46..7879ca258b 100644
--- a/packages/components/popover/package.json
+++ b/packages/components/popover/package.json
@@ -56,7 +56,8 @@
"@react-aria/utils": "3.24.1",
"@react-stately/overlays": "3.6.7",
"@react-types/button": "3.9.4",
- "@react-types/overlays": "3.8.7"
+ "@react-types/overlays": "3.8.7",
+ "react-remove-scroll": "^2.5.6"
},
"devDependencies": {
"@nextui-org/card": "workspace:*",
diff --git a/packages/components/popover/src/popover-content.tsx b/packages/components/popover/src/popover-content.tsx
index f4eccd096f..ff4c4c0bc3 100644
--- a/packages/components/popover/src/popover-content.tsx
+++ b/packages/components/popover/src/popover-content.tsx
@@ -3,6 +3,7 @@ import type {HTMLMotionProps} from "framer-motion";
import {DOMAttributes, ReactNode, useMemo, useRef} from "react";
import {forwardRef} from "@nextui-org/system";
+import {RemoveScroll} from "react-remove-scroll";
import {DismissButton} from "@react-aria/overlays";
import {TRANSITION_VARIANTS} from "@nextui-org/framer-utils";
import {m, domAnimation, LazyMotion} from "framer-motion";
@@ -23,10 +24,12 @@ const PopoverContent = forwardRef<"div", PopoverContentProps>((props, _) => {
const {
Component: OverlayComponent,
+ isOpen,
placement,
backdrop,
motionProps,
disableAnimation,
+ shouldBlockScroll,
getPopoverProps,
getDialogProps,
getBackdropProps,
@@ -79,23 +82,27 @@ const PopoverContent = forwardRef<"div", PopoverContentProps>((props, _) => {
);
}, [backdrop, disableAnimation, getBackdropProps]);
- const contents = disableAnimation ? (
- content
- ) : (
-
-
- {content}
-
-
+ const contents = (
+
+ {disableAnimation ? (
+ content
+ ) : (
+
+
+ {content}
+
+
+ )}
+
);
return (
diff --git a/packages/components/popover/src/use-popover.ts b/packages/components/popover/src/use-popover.ts
index 6741a7e06f..b1cf10c0ae 100644
--- a/packages/components/popover/src/use-popover.ts
+++ b/packages/components/popover/src/use-popover.ts
@@ -6,7 +6,7 @@ import {RefObject, Ref} from "react";
import {ReactRef, useDOMRef} from "@nextui-org/react-utils";
import {OverlayTriggerState, useOverlayTriggerState} from "@react-stately/overlays";
import {useFocusRing} from "@react-aria/focus";
-import {useOverlayTrigger, usePreventScroll} from "@react-aria/overlays";
+import {useOverlayTrigger} from "@react-aria/overlays";
import {OverlayTriggerProps} from "@react-types/overlays";
import {
HTMLNextUIProps,
@@ -298,10 +298,6 @@ export function usePopover(originalProps: UsePopoverProps) {
[slots, state.isOpen, classNames, underlayProps],
);
- usePreventScroll({
- isDisabled: !(shouldBlockScroll && state.isOpen),
- });
-
return {
state,
Component,
@@ -316,6 +312,7 @@ export function usePopover(originalProps: UsePopoverProps) {
isOpen: state.isOpen,
onClose: state.close,
disableAnimation,
+ shouldBlockScroll,
backdrop: originalProps.backdrop ?? "transparent",
motionProps,
getBackdropProps,
diff --git a/packages/components/tooltip/src/use-tooltip.ts b/packages/components/tooltip/src/use-tooltip.ts
index ee243e24ca..bbee183ef3 100644
--- a/packages/components/tooltip/src/use-tooltip.ts
+++ b/packages/components/tooltip/src/use-tooltip.ts
@@ -8,12 +8,7 @@ import {ReactNode, Ref, useId, useImperativeHandle} from "react";
import {useTooltipTriggerState} from "@react-stately/tooltip";
import {mergeProps} from "@react-aria/utils";
import {useTooltip as useReactAriaTooltip, useTooltipTrigger} from "@react-aria/tooltip";
-import {
- useOverlayPosition,
- useOverlay,
- AriaOverlayProps,
- usePreventScroll,
-} from "@react-aria/overlays";
+import {useOverlayPosition, useOverlay, AriaOverlayProps} from "@react-aria/overlays";
import {
HTMLNextUIProps,
mapPropsVariants,
@@ -87,11 +82,6 @@ interface Props extends Omit {
* ```
*/
classNames?: SlotsToClasses<"base" | "arrow" | "content">;
- /**
- * Whether to block scrolling outside the tooltip.
- * @default true
- */
- shouldBlockScroll?: boolean;
}
export type UseTooltipProps = Props &
@@ -133,7 +123,6 @@ export function useTooltip(originalProps: UseTooltipProps) {
onClose,
motionProps,
classNames,
- shouldBlockScroll = true,
...otherProps
} = props;
@@ -169,8 +158,6 @@ export function useTooltip(originalProps: UseTooltipProps) {
createDOMRef(overlayRef),
);
- usePreventScroll({isDisabled: !(shouldBlockScroll && isOpen)});
-
const {triggerProps, tooltipProps: triggerTooltipProps} = useTooltipTrigger(
{
isDisabled,
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 24838e7751..cb066eb48c 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -2038,6 +2038,9 @@ importers:
'@react-types/overlays':
specifier: 3.8.7
version: 3.8.7(react@18.2.0)
+ react-remove-scroll:
+ specifier: ^2.5.6
+ version: 2.5.9(@types/react@18.2.8)(react@18.2.0)
devDependencies:
'@nextui-org/card':
specifier: workspace:*