react-native-invertible-scroll-view - npm Package Compare versions

Comparing version 0.0.3 to 0.0.4

InvertibleScrollView.js

@@ -6,5 +6,4 @@ /**
 
-var React = require('react-native');
-var ScrollableMixin = require('react-native-scrollable-mixin');
-var {
+let React = require('react-native');
+let {
   PropTypes,
@@ -15,8 +14,11 @@ ScrollView,
 } = React;
+let ScrollableMixin = require('react-native-scrollable-mixin');
 
+let cloneReferencedElement = require('react-native-clone-referenced-element');
+
 type DefaultProps = {
-  renderScrollComponent: (props: Object) => ReactComponent;
+  renderScrollComponent: (props: Object) => ReactElement;
 };
 
-var InvertibleScrollView = React.createClass({
+let InvertibleScrollView = React.createClass({
   mixins: [ScrollableMixin],
@@ -32,3 +34,3 @@
     return {
-      renderScrollComponent: (props) => <ScrollView {...props} />,
+      renderScrollComponent: props => <ScrollView {...props} />,
     };
@@ -38,7 +40,7 @@ },
   getScrollResponder(): ReactComponent {
-    return this._scrollView.getScrollResponder();
+    return this._scrollComponent.getScrollResponder();
   },
 
   setNativeProps(props: Object) {
-    this._scrollView.setNativeProps(props);
+    this._scrollComponent.setNativeProps(props);
   },
@@ -63,6 +65,4 @@
 
-    return React.cloneElement(renderScrollComponent(props), {
-      ref: component => {
-        this._scrollView = component;
-      },
+    return cloneReferencedElement(renderScrollComponent(props), {
+      ref: component => { this._scrollComponent = component; },
     });
@@ -78,3 +78,3 @@ },
 
-var styles = StyleSheet.create({
+let styles = StyleSheet.create({
   verticallyInverted: {
@@ -81,0 +81,0 @@ transformMatrix: [

package.json

 {
   "name": "react-native-invertible-scroll-view",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "An invertible ScrollView for React Native",
   "main": "InvertibleScrollView.js",
-  "scripts": {
-  },
+  "scripts": {},
   "repository": {
@@ -17,3 +16,3 @@ "type": "git",
   ],
-  "author": "Charlie Cheever <[e-mail]>",
+  "author": "Charlie Cheever <[e-mail]>",
   "license": "MIT",
@@ -25,4 +24,5 @@ "bugs": {
   "dependencies": {
-    "react-native-scrollable-mixin": "0.0.2"
+    "react-native-clone-referenced-element": "^1.0.0",
+    "react-native-scrollable-mixin": "0.0.3"
   }
 }

README.md

 # InvertibleScrollView
 
+**NOTE:** don't try to use this until https://github.com/facebook/react-native/pull/785 is merged.
+
 InvertibleScrollView is a React Native scroll view that can be inverted so that content is rendered starting from the bottom, and the user must scroll down to reveal more. This is a common design in chat applications and the command-line terminals. InvertibleScrollView also supports horizontal scroll views to present content from right to left.
@@ -16,3 +18,3 @@
 
-Compose InvertibleScrollView with the scrollable component you would like to invert. In the case of a ListView, you would write: [**NOTE:** You need a patched version of React Native for this to work. Get https://github.com/facebook/react-native/pull/785.]
+Compose InvertibleScrollView with the scrollable component you would like to invert. In the case of a ListView, you would write:
 
@@ -30,5 +32,3 @@ ```js
     <ListView
-      renderScrollComponent={
-        (props) => <InvertibleScrollView {...props} inverted />
-      }
+      renderScrollComponent={props => <InvertibleScrollView {...props} inverted />}
       dataSource={...}
@@ -46,3 +46,3 @@ renderRow={...}
 - Horizontal scroll views are supported
-- To scroll to the bottom, call `scrollTo(0, 0)` on a ref to the scroll view
+- To scroll to the bottom, call `scrollTo(0)` on a ref to the scroll view
 - When the scroll view is inverted, InvertibleScrollView wraps each child in a View that is flipped
@@ -52,3 +52,3 @@ - Scroll views that add children (ex: ListViews) must delegate to InvertibleScrollViews so that the children can be properly inverted
 - Styles like `padding` are not corrected, so top padding will actually pad the bottom of the component
-- Properties like `contentOffset` and `contentInset` are not corrected
+- Properties like `contentOffset` and `contentInset` are not flipped; for example, the top inset adjusts the bottom of an inverted scroll view
 
@@ -55,0 +55,0 @@ ## Implementation

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

7137

increased by2.32%

Worsened metrics

Dependency count

2

increased by100%

Lines of code

78

decreased by-1.27%

Dependency changes

• + Addedreact-native-clone-referenced-element@^1.0.0

• + Addedreact-native-clone-referenced-element@1.0.0(transitive)

• + Addedreact-native-scrollable-mixin@0.0.3(transitive)

• - Removedreact-native-scrollable-mixin@0.0.2(transitive)

• Updatedreact-native-scrollable-mixin@0.0.3