archive-gh-me/nextui
1
0
Fork 0
mirror of https://github.com/nextui-org/nextui.git synced 2025-12-08 19:26:11 +00:00
Code Issues Projects Releases Wiki Activity

Fix/1298 (#1542)

Browse Source 
* fix(modal): focus trap added

* chore(navbar): changeset added
This commit is contained in:
Junior Garcia 2023-09-01 17:42:08 -03:00 committed by GitHub
parent 7a17256268
commit 57909accde
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/blue-days-work.md Normal file
View File

@ -0,0 +1,5 @@
---
"@nextui-org/navbar": patch
---
Fix #1298 navbar-menu focus trapping fixed

11
packages/components/navbar/src/navbar-menu.tsx
View File

@ -5,7 +5,7 @@ import {AnimatePresence, HTMLMotionProps, motion} from "framer-motion";
import {mergeProps} from "@react-aria/utils"; import {mergeProps} from "@react-aria/utils";
import {ReactElement, useCallback} from "react"; import {ReactElement, useCallback} from "react";
import {RemoveScroll} from "react-remove-scroll"; import {RemoveScroll} from "react-remove-scroll";
import {Overlay} from "@react-aria/overlays"; import {Overlay, DismissButton} from "@react-aria/overlays";
import {menuVariants} from "./navbar-menu-transitions"; import {menuVariants} from "./navbar-menu-transitions";
import {useNavbarContext} from "./navbar-context"; import {useNavbarContext} from "./navbar-context";
@ -27,7 +27,8 @@ const NavbarMenu = forwardRef<"ul", NavbarMenuProps>((props, ref) => {
const {className, children, portalContainer, motionProps, style, ...otherProps} = props; const {className, children, portalContainer, motionProps, style, ...otherProps} = props;
const domRef = useDOMRef(ref); const domRef = useDOMRef(ref);
const {slots, isMenuOpen, height, disableAnimation, classNames} = useNavbarContext(); const {slots, isMenuOpen, setIsMenuOpen, height, disableAnimation, classNames} =
useNavbarContext();
const styles = clsx(classNames?.menu, className); const styles = clsx(classNames?.menu, className);
@ -35,7 +36,11 @@ const NavbarMenu = forwardRef<"ul", NavbarMenuProps>((props, ref) => {
({children}: {children: ReactElement}) => { ({children}: {children: ReactElement}) => {
return ( return (
<RemoveScroll forwardProps enabled={isMenuOpen} removeScrollBar={false}> <RemoveScroll forwardProps enabled={isMenuOpen} removeScrollBar={false}>
{children} <>
<DismissButton onDismiss={() => setIsMenuOpen(false)} />
{children}
<DismissButton onDismiss={() => setIsMenuOpen(false)} />
</>
</RemoveScroll> </RemoveScroll>
); );
}, },