Releases: pmndrs/react-spring
v9.2.0-beta.0
Features
Parallax
– child horizontal prop defaults to parent's (#1458) –POTENTIALLY_BREAKING_CHANGE
Fixes
Parallax
– scrollTo gets correct scroll value (#1455)Core
– SpringValue would jump toto
value at end of decay (#1437)Core
– SpringValue wouldn't animate afterimmediate
value has been changed (#1026)
Chores
- repo now uses
preconstruct
andchangesets
recrawl
has been removed from repo due to lack of windows support
v9.1.2
v9.1.1
Chores
- Deps of packages now use
~
instead of^
. This will help users not interenally download minor version of the package incase we have potential breaking changes like in v9.1.0 – #1414 (thanks @CPatchane)
v9.0.1
v9.1.0
Features
- We listened to the feedback people had, so whilst we encourage people to use the pattern
[styles, api] = useSpring()
we have aliased callingapi
to beapi.start
#1359 (thanks to @dbismut) POTENTIALLY BREAKING CHANGE
We've unified the return of all eventsonStart
,onChange
,onRest
etc. to be the following -(animationResult, controller, item)
item will only not beundefined
when usinguseTransition
.
Fixes
- scrollTop is not set when from & to are equal #1185 (thanks @Rohanhacker)
- skip animation with async to infinite loop #1160
- Stop jank in animation when duration changes on SpringValue #1163
Chores
v9.0.0
v8.0.1
https://twitter.com/0xca0a/status/1093146801467781120
Breaking changes
Migrating from 7.x to 8.0 is painless. The only breaking change is the default export. If you have previously done something like this:
import { Spring, animated, ... } from 'react-spring'
Then you will now do:
import { Spring, animated, ... } from 'react-spring/renderprops'
And if you have previously used hooks like so:
import { useSpring, animated, ... } from 'react-spring/hooks'
You will now do:
import { useSpring, animated, ... } from 'react-spring'
The lib comes with the following exports:
web (web/hooks, default for react-dom)
native (react-native/hooks, default for react-native)
renderprops-web (previously "web")
renderprops-native (previously "native")
renderprops-addons (previously "addons")
renderprops-konva (previously "konva")
renderprops-universal (previously "universal")
For commonjs, add ".cjs"
Both render-props and hooks will be kept and maintained for the forseeable future.
useTransition
useTransition(items, keys, config)
v6.0.0
React-spring 6.0
- ⚡️ React strict-mode compliant and ready for async rendering
- 🚀 New spring engine (from rk4 to see), lots of internal changes making it faster and leaner
- ✨ Simpler and more intuitive api
configs
- ⏰ Duration is built in and as easy as going
config={{ duration: 1000, easing: ... }}
- ⌛️ Delays can be driven per config
config={{ delay: 1000, ... }}
- ✨ Simpler property names (mass, tension, friction, delay, precision, clamp, velocity, duration, easing)
- 🎩 Spring config props are 1:1 compatible with react-motions and the presets finally do what they say
Springs
- ⏮ Springs can run
reverse
, which switchesfrom
andto
- 🚬 The
after
prop makes it easier to apply static values at the end of an animation - 🐉 Springs can animate scrollTop/Left
Transitions
- 🎉 Multistage transitions are finally possible.
Transition
inherits fromKeyframes
now, which allows it to receive the same values that you can use in slots, meaning you can chain or even script transitions - ⭐️ The
unique
prop prevents two children with the same key to co-exist, which was an often asked for suggestion. If it is true, a fading-out item will vanish when an item with the same key comes in again, as opposed to forming a stack (which is still the default) - ✖️ The
reset
prop, in combination withunique
forces an incoming item to always start from scratch instead of adapting the fading-out item to take start-position - 🐌 Transitions can trail using teh
trail
prop which takes a duration in ms - ✨ Simpler api. Previously you could optionally pass
items
and you would have to map over children yourself.items
andkeys
are Transitions sole source of truth now. You give a single function child instead of mapping - 🎮 Transition behaves more like Reacts TransitionGroup in that it can give you way more contextual information than before, you even have access to the state your output component is in (enter/leave/update)
Trails
- ✨ Simpler api. Same as Transitions
- ⏮ The
reverse
prop can move a trail bottom-up instead of the default top-down which is more natural for items swinging in and out
Keyframes
- ✨ Simpler api. You don't have to write
to: {...}
any longer since everything is interpolated to it
Parallax
- 🤷 Parallax always felt off since it's not as generic as the others. It has been moved to
react-spring/dist/addons
and could mark the start of convenience components or effects that don't belong anywhere else
Upgrading from 5.0 to 6.0
The changes made are mostly features, the api changes are slight and looking at the front page here will tell you immediately what to do. You will probably have to adapt your Transitions and Trail, Keyframes are backwards compatible. If you have used timings off dist/addons
before, duration is now inbuilt (see above). A noticeable change also concerns spring config props, where before we would be closer to how the animated library interprets tension and friction we are now 1:1 compatible with react-motion.
v5.9.0
New features
- Animate scrollTop/scrollLeft: http://react-spring.surge.sh/native#animating-scroll-position
Bugfixes
- Getting React.createRef() to work with react-spring
- TimingAnimation: alternatives, bugs with newer versions
- Trying to animate svg pathLength
New demos
Animate SVG props: https://codesandbox.io/embed/6z3nv1o1nn
Animate scrolling: https://codesandbox.io/embed/zlr555494x
v5.8.0
New features
- Transition.delay: trailing transitions (see: http://react-spring.surge.sh/transition#props)
- config.delay: being able to set delays per key (this will also overwrite Primitive.delay)
- Initial transition, being able to create a first-render transition, or none at all, (see: http://react-spring.surge.sh/transition#props)
Bugfixes
- AnimatedValue listener gets called twice with last value (overshootClamping: true)
- Keyframes doesn't use config with TimingAnimation and Konva
- overshootClamping not working as expected
- Possible event handler / cpu leak in react-spring
- Spring: onRest does not get triggered, if one animated value stays equal
- Overflow doesn't change on enter
- fix interpolation for rgb, border & boxShadows