search

bcgov / design-system

The B.C. Design System helps public sector design and development teams build consistent, accessible products
https://gov.bc.ca/designsystem
Apache License 2.0
57 stars 38 forks source link

Modal dialog #473

Closed mkernohanbc closed 1 month ago

mkernohanbc commented 2 months ago

A modal dialog presents an important message to the user, and blocks interaction with the rest of the interface until it is dismissed.

This will be implemented using RAC Modal as a base.

Note from @ty2k: This is mostly complicated by all of the different keyboard requirements for a component like this. Hopefully the underlying React Aria Component is very full-featured and this will be trivial.

ty2k commented 2 months ago

My guess is that you're correct and we will want the Modal from RAC for this. The browser native <dialog> is extremely good and in everything now, but I imagine it will be way simpler to use RAC than to try writing a React wrapper around the native thing.

As an aside, we have been using react-modal in the CMS prototype, and it has been excellent. I expect RAC to be similar, glancing at their API docs.

mkernohanbc commented 2 months ago

I'll get into it and see how it goes — if RAC's solution doesn't feel right we can revisit and think about a different path.