0.0.25

CHANGELOG.md

@@ -1,7 +1,9 @@
-# 0.0.22
+# 0.0.25
 
 - **Breaking**: Drop simple gestures recognition. Use a tool like `react-native-gesture-handler` instead.
 - **Breaking**: Renamed `indices` prop to `keys`.
+- **Breaking**: Use `behavior.key` to retrieve current state index (now named `key`).
+- **Breaking**: Drop support for `rotateX`, `rotateY`, `scaleX` and `scaleY` state props, which were introduced only recently, to enhance performance. You can still use them through the `style` prop and a custom driver.
 - Add `unmount()` and `mount(state?: number)` methods. Useful for removing components that are hidden after animation.
 - Add `onStart` event to `goTo()` options.
 - Add `unmounted` prop. Useful for animations that start in a hidden state. Use `mount()` to mount the component first then animate it.

README.md

@@ -59,11 +59,7 @@ type State = {
   height?: number, // no percentages, default = null
   opacity?: number, // [0, 1], default = 1
   rotate?: string, // e.g. '45deg', default = '0deg'
-  rotateX?: string, // e.g. '45deg', default = '0deg'
-  rotateY?: string, // e.g. '45deg', default = '0deg'
   scale?: number, // default = 1
-  scaleX?: number, // default = 1
-  scaleY?: number, // default = 1
   translateX?: number, // default = 0
   translateY?: number, // default = 0
   width?: number // no percentages, default = null
@@ -114,7 +110,7 @@ behavior.unmount() // useful for removing components that are hidden after anima
 behavior.mount(state: ?number) // useful for animations that start in a hidden state
 // use along with `unmounted` prop and `mount()`
 
-behavior.index // to retrieve current state key
+behavior.key // to retrieve current state key
 ```
 
 ## Examples

package.json

@@ -2,7 +2,7 @@
   "license": "MIT",
   "name": "haraka",
   "description": "Stateful animations in React Native.",
-  "version": "0.0.22",
+  "version": "0.0.25",
   "main": "lib/index.js",
   "repository": {
     "type": "git",

src/behavior.js

@@ -20,7 +20,7 @@ export default class Behavior extends React.PureComponent {
     this.nativeDriver = nativeDriver || new Animated.Value(initialState);
     this.driver = driver || new Animated.Value(initialState);
 
-    this.index = initialState;
+    this.key = initialState;
 
     this.state = { mounted: !unmounted };
   }
@@ -61,7 +61,7 @@ export default class Behavior extends React.PureComponent {
 
       state.forEach(toValue => sequence.push(animate(toValue)));
 
-      this.index = sequence[sequence.length - 1];
+      this.key = sequence[sequence.length - 1];
 
       const animationRef = Animated.sequence(sequence);
 
@@ -73,7 +73,7 @@ export default class Behavior extends React.PureComponent {
       });
     }
 
-    this.index = state;
+    this.key = state;
 
     const animationRef = animate(state);
 
@@ -179,11 +179,7 @@ export default class Behavior extends React.PureComponent {
 
     const opacity = addNativeProp('opacity', 1);
     const rotate = addNativeProp('rotate', '0deg');
-    const rotateX = addNativeProp('rotateX', '0deg');
-    const rotateY = addNativeProp('rotateY', '0deg');
     const scale = addNativeProp('scale', 1);
-    const scaleX = addNativeProp('scaleX', 1);
-    const scaleY = addNativeProp('scaleY', 1);
     const translateX = addNativeProp('translateX', 0);
     const translateY = addNativeProp('translateY', 0);
 
@@ -193,16 +189,7 @@ export default class Behavior extends React.PureComponent {
 
     const nativeStyles = {
       opacity,
-      transform: [
-        { rotate },
-        { rotateX },
-        { rotateY },
-        { scale },
-        { scaleX },
-        { scaleY },
-        { translateX },
-        { translateY }
-      ]
+      transform: [{ rotate }, { scale }, { translateX }, { translateY }]
     };
 
     const styles = { backgroundColor, height, width };