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

Add modal component #176

Merged
merged 2 commits into from
Aug 16, 2024
Merged

Add modal component #176

merged 2 commits into from
Aug 16, 2024

Conversation

sergei-maertens
Copy link
Member

Required for #175 where clicking the edit icon/pencil will bring up the component definition in a modal.

This is currently managed in https://github.com/open-formulieren/open-forms by the formio.js webform builder, which we want to replace.

Like in open-forms and open-forms-sdk, we use the same proven library
to implement modals.
Formio's modal component is based on or inspired by bootstrap. To make
transitioning easier, we apply the same formio classnames so that we
can share the styling.

The modal implementation needs some tweaking to match the markup used
in Formio/bootstrap, but other than that it's pretty straight forward.

The ModalContext primarily serves to mute warnings and make interaction
testing easier in Storybook, by:

* disabling the aria-hidden integration on the app element
* injecting the modal node in the right place in the DOM so that it's
  within the canvas
@sergei-maertens sergei-maertens merged commit e7d0a19 into main Aug 16, 2024
13 checks passed
@sergei-maertens sergei-maertens deleted the feature/add-modal-component branch August 16, 2024 12:45
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

Successfully merging this pull request may close these issues.

1 participant