import cn from 'classnames' import { FC, useRef } from 'react' import s from './Sidebar.module.css' import { Transition } from '@headlessui/react' import { useOverlay, usePreventScroll, useModal, OverlayContainer, } from '@react-aria/overlays' import { useDialog } from '@react-aria/dialog' import { FocusScope } from '@react-aria/focus' interface Props { className?: string children?: any show?: boolean close: () => void } const Sidebar: FC = ({ className, children, show = true, close }) => { const rootClassName = cn(s.root, className) const ref = useRef(null) const { modalProps } = useModal() const { overlayProps } = useOverlay( { isOpen: show, onClose: close, isDismissable: true, }, ref ) const { dialogProps } = useDialog({}, ref) usePreventScroll({ isDisabled: !show, }) return (
{children}
) } export default Sidebar