Sheet is not opening on mobile browsers

[zeptozor]

I am using Next.js and Redux as a state manager.

My bottom sheet component `import Sheet from 'react-modal-sheet' import { useAppDispatch, useAppSelector } from '@/store/hooks'

import { MenuButtons, changeActive } from '@/store/reducers/menu' import { SheetDetent } from 'react-modal-sheet/dist/types'

export default function BottomSheet({ value, content, detent }: { value: MenuButtons; content: React.ReactNode; detent: SheetDetent }) { const dispatch = useAppDispatch() const { active } = useAppSelector((store) => store.menu)

return (
    <>
        <Sheet isOpen={active == value} onClose={() => dispatch(changeActive('home'))} detent={detent} className="max-w-screen-sm mx-auto md:hidden">
            <Sheet.Container>
                <Sheet.Header>
                    <div className="w-full pb-10 flex justify-center">
                        <div className="w-[100px] h-[5px] rounded bg-[rgba(255,255,255,0.40)]"></div>
                    </div>
                </Sheet.Header>
                <Sheet.Scroller className="rounded">
                    <Sheet.Content>{content}</Sheet.Content>
                </Sheet.Scroller>
            </Sheet.Container>
            <Sheet.Backdrop />
        </Sheet>
    </>
)

}`

menu state is updating(100%) and component works well on desktop browsers simmulation, but not on real mobile browsers.

Adaptive design mode on FireFox desktop:

https://github.com/Temzasse/react-modal-sheet/assets/142510011/d790927f-6e00-4ca0-a938-e43b96b9f958

Chrome mobile: https://github.com/Temzasse/react-modal-sheet/assets/142510011/3005c547-3ca6-49f8-9920-14efb062785e

sorry for bad description of issue