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

Support promises and animated values for "expires" prop of v9 useTransition #871

Open
aleclarson opened this issue Nov 27, 2019 · 0 comments
Labels
kind: request New feature or request that should be actioned

Comments

@aleclarson
Copy link
Contributor

Feature proposal for the new expires prop:

  1. pass in a single animated value, or an array of animated values, so unmount will wait for these additional animated value(s) to rest, or if they're already at rest.
  2. pass in a single Promise, or an array of Promises, so unmount will wait for the Promises to resolve.

A real-world use case for (1) above is when animating an interactive chart. Use a Spring value to animate the chart's x/y axis, while useTransition to manage the enter/leave/update of elements on the chart.

// Pass the animated value `x` to the `expires` prop of transition,
// so that the unmount event can wait for the X-axis animation to rest,
// instead of in the middle of X-axis animation.
const [{ x }, setAxis] = useSpring(() => { x: 100 });
const transition = useTransition(elements, { ...props, expires: [x] });

Originally posted by @guopengliang in #809 (comment)

@aleclarson aleclarson added kind: request New feature or request that should be actioned v9 labels Nov 27, 2019
@joshuaellis joshuaellis added v9 and removed v9 labels Mar 18, 2021
@joshuaellis joshuaellis added this to the v9.1.0 milestone Mar 18, 2021
@joshuaellis joshuaellis modified the milestones: v9.1.0, v9.2.0 Apr 8, 2021
@joshuaellis joshuaellis modified the milestones: v9.2.0, v9.X.X Apr 16, 2021
@joshuaellis joshuaellis removed the v9 label Jun 29, 2021
@joshuaellis joshuaellis removed this from the v9.X.X milestone Jan 3, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
kind: request New feature or request that should be actioned
Projects
None yet
Development

No branches or pull requests

2 participants