search

davidtheclark / react-aria-modal

A fully accessible React modal built according WAI-ARIA Authoring Practices
http://davidtheclark.github.io/react-aria-modal/demo/
MIT License
1.04k stars 96 forks source link

Option to switch 'noScroll' off #39

Closed SammyM closed 7 years ago

SammyM commented 7 years ago

I'm using this library to create a date and time picker, of which its positioning is directly underneath the button that was clicked in order to display the modal.

The modal I'm using is quite large, and on some mobiles it's larger than the screen. Would it be possible to add an option to disable the noScroll feature?

davidtheclark commented 7 years ago

The way that I have done this in the past is to allow the backdrop element to scroll internally. Since the modal mounts within that, you should be able to scroll that way. Does that not work?

SammyM commented 7 years ago

That won't work for what I need, as I can't put the whole page in the backdrop.

What I need is the following:

datepicker

But I've had to hack things about to get it to do that which isn't ideal. Also it's still a bit buggy with the hack.

davidtheclark commented 7 years ago

It seems like what you need is a popover, not a modal. I'm not sure the ARIA attributes provided by this module would be correct for your datepicker. Are they?

What benefits do you get from using this module? Is it the focus trap? If so, you could use that on its own.

SammyM commented 7 years ago

I'm not 100% sure. I've looked at various date pickers out in the wild and some of them use the same ARIA attributes as this modal and some don't.

The benefits are the ARIA attributes, the focus trap, and the displacement. I tried using just the focus trap but it was buggy (https://github.com/davidtheclark/focus-trap-react/issues/14).

davidtheclark commented 7 years ago

This module hasn't been designed for non-modal dialogs. If you want to create an issue that outlines what this would entail, I'd be interested in hearing. But I'm closing this one for now.