Skip to content

fix(Modal/Slideover): bind transition class to TransitionChild for Vue 3.5 #2227

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

Merged
merged 6 commits into from
Sep 20, 2024

Conversation

anthonyfranc
Copy link

@anthonyfranc anthonyfranc commented Sep 20, 2024

Temporary fix for Headless UI + Vue 3.5 Modal enter transition.

🔗 Linked issue

Resolves #2127

❓ Type of change

  • 📖 Documentation (updates to the documentation or readme)
  • 🐞 Bug fix (a non-breaking change that fixes an issue)
  • 👌 Enhancement (improving an existing functionality)
  • ✨ New feature (a non-breaking change that adds functionality)
  • 🧹 Chore (updates to the build process or auxiliary tools and libraries)
  • ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

This PR introduces a temporary fix for the issue where the enter transition for modals is no longer functioning after upgrading to Vue 3.5.x. The issue stems from changes in Vue's transition handling, specifically with how it interacts with the enterFrom class. This fix manually applies the enterFrom class to the TransitionChild component in order to restore the expected behavior.

Without this fix, modals may fail to animate correctly on enter, which can affect user experience

📝 Checklist

  • I have linked an issue or discussion.
Temporary fix for Headless UI + Vue 3.5 Modal enter transition.
Copy link
Author

@anthonyfranc anthonyfranc left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • Slideover fix
@benjamincanac benjamincanac changed the title Fix: Modal.vue Sep 20, 2024
anthonyfranc and others added 2 commits September 20, 2024 09:45
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
@benjamincanac benjamincanac merged commit 803c20a into nuxt:dev Sep 20, 2024
2 checks passed
@anthonyfranc anthonyfranc deleted the patch-1 branch September 20, 2024 14:04
patrick-hofmann pushed a commit to patrick-hofmann/nuxt-ui that referenced this pull request Oct 3, 2024
…Vue 3.5 (nuxt#2227)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
2 participants