Repository navigation
Modal,Backdrop - Add animation support #12551
Description
Activity
🔗 Related PRs
#12288 - feat(Accordion): Added isPlain and isNoPlainOnGlass prop to Accordion [merged]
#12466 - fix(BullhornIcon): Replace BullhornIcon with RhUiAttentionBellFillIcon [merged]
#12597 - chore(DualListSelector): Include OUIAProps for DualListSelector [open]
📝 Issue Planner
Check the box below or use the
@coderabbitai plancommand to generate an implementation plan and prompts that you can use with your favorite coding assistant.- Create Plan
🧪 Issue enrichment is currently in open beta.
You can configure auto-planning by selecting labels in the issue_enrichment configuration.
To disable automatic issue enrichment, add the following to your
.coderabbit.yaml:issue_enrichment: auto_enrich: enabled: false
💬 Have feedback or questions? Drop into our discord!
Metadata
Metadata
Assignees
Labels
No labels
Is this a new component or an extension?
Enhancement to a current feature
Existing Component
Modal, Backdrop
Describe the feature
Modal & Backdrop animation support
PatternFly Modals (and Backdrop that it uses) currently lack a smooth animation from closed->open->closed states.
This works well for smaller modals showing simple information or requiring a simple action from the user; But for larger modals it is really jarring.
A proposed new component
<Tearsheet>that leverages the<Modal>makes this missing animation a larger friction point with a near-full-screen modal size.Modal and Backdrop could function like the other PF components that already opt-in to animations via
<AnimationsProvider>. opt-in is important to not break or regress the performance of pages depending on the as-is of Modals/Backdrops.User Story
As a user, when I use a Modal with rich information or a form, it is jarring to see it flash on screen with no visual easing from the open-to-closed state.
Visuals & Mockups
animated-modal.mp4
Interaction States & Variations
On opening: modal fades in + shifts down a few pixels slightly and falls full into view
On closing: modal fades out + shifts up a few pixels slightly and is removed from view
Accessibility (A11y)
No response
Product & Target Release
No response
Contribution
I am interested in contributing this feature.
I have searched for similar existing requests.
Jira Issue: PF-4419