Nathan Vasse
2916dd2af9
✨ (react) add custom modal portal
...
In some apps this is mostly needed, for instance: when the
CunninghamProvider is nested in the DOM, we want the modal to still
be displayed on top of anything else, then in those cases we will be
able to define a node directly in the body and tell cunningham to
render modals inside it.
2024-04-23 14:38:44 +02:00
Nathan Vasse
6ebeb116d3
♻️ (react) migrate Modals to react modal
...
We encoutered an issue where stacked modal backdrop were not rendered
above the modal below. It was caused by the dialog element that is
natively rendered on the top layer regardless where it is create in
the DOM. So we decided to use react modal that provides hand crafted
dialog, and implementing a11y features.
Closes #314
2024-04-23 14:38:44 +02:00
Nathan Vasse
c61b2ac43d
✨ (react) introduce large and extra-large new modal sizes
...
We realized it was missing an in between medium and large existing
modal sizes. The old large now become extra-large.
Closes #313
2024-04-23 14:38:44 +02:00
Nathan Vasse
9c614953b8
♻️ (react) remove faker usage from stories
...
Random data in stories was causing Chromatic to detect changes during
each build.
2024-03-25 15:40:27 +01:00
Nathan Vasse
c63aff4861
📝 (react) upgrade stories for Storybook 8
...
The old way of using Canvas is deprecated, we need to migrate all the
stories to the new standard.
2024-03-21 17:00:04 +01:00
Nathan Vasse
1f80674717
📝 (doc) upgrade doc for Storybook v8
...
The Canvas block does not handle free source code anymore, now we need
to put it in a dedicated Story.
2024-03-21 17:00:04 +01:00
Nathan Vasse
d63c203b21
🚨 (react) fix CSS end warning usage
...
Next.js is warning about the usage of end instead of flex-end during
compilation.
Fixes #291
2024-03-08 15:06:25 +01:00
Nathan Vasse
680365a117
💄 (react) make Modal close button sticky
...
We want to make sure this button is always visible inside scrollable
modals.
Fixes #278
2024-02-28 17:36:32 +01:00
Nathan Vasse
ce7a3d7c5b
📱 (react) improve Modal responsive
...
The footer of the Modal component was not perfect on mobile, the sided
footer must be on two lines on mobile.
2024-02-28 17:19:32 +01:00
Nathan Vasse
54df5d6c71
💄 (react) remove modal content outline on focus
...
This was giving a strange look n feel, neither improving a11y.
2024-02-28 17:19:32 +01:00
Nathan Vasse
a17c805f50
🐛 (react) fix closeOnClickOutside not working
...
Our recent changes to enable the customization of the modal backdrop
caused this prop to not work anymore.
2024-02-21 16:08:23 +01:00
Nathan Vasse
7f12f4d9b0
🐛 (fix) fix body scroll when a modal is opened
...
It was possible to scroll the body when a modal is opened, it was
cutting the visibility of the modal, and was simply weird.
Fixes #263
2024-02-21 14:54:52 +01:00
Nathan Vasse
266701a733
🐛 (react) fix default opened modal
...
Modal with isOpen=true on first render were causing a crash. With
this approach we make sure the portal node is already rendered.
Fixes #259
2024-02-20 17:21:32 +01:00
Nathan Vasse
c3416f3113
🏷️ (react) modal title type
...
We need to be able to use any ReactNode a modal title.
Fixes #260
2024-02-19 15:39:03 +01:00
Nathan Vasse
670eb8ce57
🏷️ (react) remove ModalFooter export
...
This component was not supposed to be exported, it could be misleading
for consumers.
Fixes #258
2024-02-19 15:30:39 +01:00
jbpenrath
be1e2e2614
💄 (react) make modal backdrop color customisable
...
As we cannot user CSS vars into backdrop pseudo element, we decide to
create a dom element to simulate the modal backdrop.
Resolve #257
2024-02-15 14:54:17 +01:00
Nathan Vasse
1445f4a222
✨ (react) add Modal
...
Here it is! Our really wanted Modal component, based on Figma sketches.
2024-02-05 15:23:03 +01:00
