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

[FEATURE] A way to control transition when using layoutId #3103

Open
tounsoo opened this issue Mar 7, 2025 · 0 comments
Open

[FEATURE] A way to control transition when using layoutId #3103

tounsoo opened this issue Mar 7, 2025 · 0 comments
Labels
feature New feature or request

Comments

@tounsoo
Copy link

tounsoo commented Mar 7, 2025

Is your feature request related to a problem? Please describe.
I'm frustrated that the indicators are animating vertically when other elements are resizing when using layoutId. I have a tab with indicator similar to the example in the doc.

Describe the solution you'd like
A way to limit x or y animation when using layoutId

Describe alternatives you've considered

  • Tried adding layout to the wrapper which isn't ideal since that will animate the entire component vertically.
  • Changed parent div to motion.div with layout and transition={{ duration: 0 }}, this worked

Additional context
You can replicate what I'm frustrated with by adding a div on top of the Tab in the example and changing its height on click without animation.

Div will change its height instantly while the indicator will float outside of the Tab and animate to its position

@tounsoo tounsoo added the feature New feature or request label Mar 7, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant