Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Customer Header breaks dragging behavior #149

Open
sharpsteelsoftware opened this issue Nov 25, 2023 · 0 comments
Open

Customer Header breaks dragging behavior #149

sharpsteelsoftware opened this issue Nov 25, 2023 · 0 comments

Comments

@sharpsteelsoftware
Copy link

sharpsteelsoftware commented Nov 25, 2023

When using a custom Header

      <Sheet
      draggable={false}
        className='mx-4'
        isOpen={isOpen}
        onClose={() => setOpen(false)}
      >
        <Sheet.Container className=''>
          {/* <Sheet.Header className='overflow-clip rounded-t-xl border-4 border-b-0 border-neutral-800 bg-yellow-500'>
            <div
              className='mx-auto flex w-full cursor-pointer justify-center p-2 text-4xl text-black'
              onClick={() => setOpen(false)}
            >
              <MdOutlineClose />
            </div>
          </Sheet.Header> */}
          <Sheet.Header />
          <Sheet.Content className='border-4 border-t-0 border-neutral-800'>
            <Sheet.Scroller>{children}</Sheet.Scroller>
          </Sheet.Content>
        </Sheet.Container>
        <Sheet.Backdrop onTap={() => setOpen(false)} />
      </Sheet>

the dragging behavior is broken. If the user starts dragging the modal down, but enough to dismiss the dialog, then the modal will remain frozen on the screen and the entire site will be without interaction.

Going back to the standard Header fixes the issue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant