react-native-keyboard-spacer - npm Package Compare versions

Comparing version 0.3.0 to 0.3.1

KeyboardSpacer.js

@@ -9,2 +9,3 @@ /**
   View,
+  Dimensions,
   Platform,
@@ -22,2 +23,16 @@ StyleSheet
 
+// From: https://medium.com/man-moon/writing-modern-react-native-ui-e317ff956f02
+const defaultAnimation = {
+  duration: 500,
+  create: {
+    duration: 300,
+    type: LayoutAnimation.Types.easeInEaseOut,
+    property: LayoutAnimation.Properties.opacity
+  },
+  update: {
+    type: LayoutAnimation.Types.spring,
+    springDamping: 200
+  }
+};
+
 export default class KeyboardSpacer extends Component {
@@ -28,3 +43,2 @@ static propTypes = {
     style: View.propTypes.style,
-    animationConfig: PropTypes.object,
   };
@@ -34,15 +48,2 @@
     topSpacing: 0,
-    // From: https://medium.com/man-moon/writing-modern-react-native-ui-e317ff956f02
-    animationConfig: {
-      duration: 500,
-      create: {
-        duration: 300,
-        type: LayoutAnimation.Types.easeInEaseOut,
-        property: LayoutAnimation.Properties.opacity
-      },
-      update: {
-        type: LayoutAnimation.Types.spring,
-        springDamping: 200
-      }
-    },
     onToggle: () => null,
@@ -71,8 +72,2 @@ };
 
-  componentWillUpdate(props, state) {
-    if (state.isKeyboardOpened !== this.state.isKeyboardOpened) {
-      LayoutAnimation.configureNext(props.animationConfig);
-    }
-  }
-
   componentWillUnmount() {
@@ -82,7 +77,23 @@ this._listeners.forEach(listener => listener.remove());
 
-  updateKeyboardSpace(frames) {
-    if (!frames.endCoordinates) {
+  updateKeyboardSpace(event) {
+    if (!event.endCoordinates) {
       return;
     }
-    const keyboardSpace = frames.endCoordinates.height + this.props.topSpacing;
+
+    let animationConfig = defaultAnimation;
+    if (Platform.OS === 'ios') {
+      animationConfig = LayoutAnimation.create(
+        event.duration,
+        LayoutAnimation.Types[event.easing],
+        LayoutAnimation.Properties.opacity,
+      );
+    }
+    LayoutAnimation.configureNext(animationConfig);
+
+    // get updated on rotation
+    const screenHeight = Dimensions.get('window').height;
+    // when external physical keyboard is connected
+    // event.endCoordinates.height still equals virtual keyboard height
+    // however only the keyboard toolbar is showing if there should be one
+    const keyboardSpace = (screenHeight - event.endCoordinates.screenY) + this.props.topSpacing;
     this.setState({
@@ -94,3 +105,13 @@ keyboardSpace,
 
-  resetKeyboardSpace() {
+  resetKeyboardSpace(event) {
+    let animationConfig = defaultAnimation;
+    if (Platform.OS === 'ios') {
+      animationConfig = LayoutAnimation.create(
+        event.duration,
+        LayoutAnimation.Types[event.easing],
+        LayoutAnimation.Properties.opacity,
+      );
+    }
+    LayoutAnimation.configureNext(animationConfig);
+
     this.setState({
@@ -97,0 +118,0 @@ keyboardSpace: 0,

package.json

 {
   "name": "react-native-keyboard-spacer",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "description": "Plug and play react-Native keyboard spacer view.",
@@ -5,0 +5,0 @@ "main": "KeyboardSpacer.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

7241

increased by10.33%

Lines of code

107

increased by20.22%

No dependency changes