Open bamnenim-kryptonium opened 7 months ago
@Temzasse @bamnenim-kryptonium happens since always and on all demos
workaround
import { PropsWithChildren } from "react";
import Sheet from "react-modal-sheet";
interface Props extends PropsWithChildren {
isOpen: boolean;
setIsOpen: (isOpen: boolean) => void;
}
const BottomSheet = ({ children, isOpen, setIsOpen }: Props) => (
<Sheet
isOpen={isOpen}
onClose={() => setIsOpen(false)}
style={{
zIndex: isOpen ? "9999999" : "-1",
visibility: isOpen ? "visible" : "hidden",
}}
>
<Sheet.Container>
<Sheet.Content>{children}</Sheet.Content>
</Sheet.Container>
</Sheet>
);
export default BottomSheet;
Also in Chrome if you use the Scroller and start to drag down, but not enough to actually dismiss the dialog, then the dialog will be frozen in a display space and unable to interact with site.
This seems to relate to this issue.
Sheet does not reopen only when using prefers reduce motion, which causes the values to change too quickly and AnimatePresence starts to glitch.
Environment: Windows, chrome Version 119.0.6045.107
The sheet can not be re-opened once it is closed.
the issue is reproducible in the example page and in the code sandbox i created here