From b6eba73475df27efc03f61721d911f35dcf7ff44 Mon Sep 17 00:00:00 2001 From: WK Wong Date: Sun, 15 Sep 2024 02:33:31 +0800 Subject: [PATCH 1/2] chore: rollback pr3307 --- .changeset/fair-worms-reflect.md | 6 +++ .../marketing/hero/floating-components.tsx | 1 - packages/components/popover/package.json | 3 +- .../popover/src/popover-content.tsx | 41 +++++++++++-------- .../components/popover/src/use-popover.ts | 7 +--- .../components/tooltip/src/use-tooltip.ts | 15 +------ pnpm-lock.yaml | 3 ++ 7 files changed, 38 insertions(+), 38 deletions(-) create mode 100644 .changeset/fair-worms-reflect.md diff --git a/.changeset/fair-worms-reflect.md b/.changeset/fair-worms-reflect.md new file mode 100644 index 0000000000..7e60f5a697 --- /dev/null +++ b/.changeset/fair-worms-reflect.md @@ -0,0 +1,6 @@ +--- +"@nextui-org/popover": patch +"@nextui-org/tooltip": patch +--- + +rollback PR3307. reschduled 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:* From 6afe6762eea3a22da1cf7a2b5c691e6504877782 Mon Sep 17 00:00:00 2001 From: WK Wong Date: Sun, 15 Sep 2024 02:34:06 +0800 Subject: [PATCH 2/2] chore(changeset): fix typo --- .changeset/fair-worms-reflect.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.changeset/fair-worms-reflect.md b/.changeset/fair-worms-reflect.md index 7e60f5a697..a67ced2cc0 100644 --- a/.changeset/fair-worms-reflect.md +++ b/.changeset/fair-worms-reflect.md @@ -3,4 +3,4 @@ "@nextui-org/tooltip": patch --- -rollback PR3307. reschduled to v2.5.0. +rollback PR3307. rescheduled to v2.5.0.