react-native-root-siblings - npm Package Compare versions

Comparing version 1.0.8 to 1.1.0

Examples/main.js

 'use strict';
-import React, {
-    AppRegistry,
-    View,
-    Component,
-    TouchableHighlight,
-    StyleSheet,
-    Text
-} from 'react-native';
-import Dimensions from 'Dimensions';
-
-// Import library there,it will wrap everything registered by AppRegistry.registerComponent
-// And add or remove other elements after the root component
+import React, { Component } from 'react';
+import { View, AppRegistry, TouchableHighlight, StyleSheet, Text, Dimensions } from 'react-native';
 import RootSiblings from 'react-native-root-siblings';
 
-var id = 0;
-var elements = [];
+let id = 0;
+const elements = [];
 class SiblingsExample extends Component{
     addSibling = () => {
-        let sibling = new RootSiblings(<View
-            style={[styles.sibling, {top: id * 20}]}
-        >
-            <Text>I`m No.{id}</Text>
-        </View>);
+        const sibling = new RootSiblings(
+            <View
+                style={[styles.sibling, {top: elements.length * 20}]}
+            >
+                <Text>I`m No.{id}</Text>
+            </View>
+        );
+        sibling.id = id;
         id++;
@@ -30,3 +23,3 @@ elements.push(sibling);
     destroySibling = () => {
-        let lastSibling = elements.pop();
+        const lastSibling = elements.pop();
         lastSibling && lastSibling.destroy();
@@ -36,31 +29,35 @@ };
     updateSibling = () => {
-        let lastId = elements.length - 1;
-        lastId >= 0 && elements[lastId].update(<View
-            style={[styles.sibling, {top: lastId * 20}]}
-        >
-            <Text>I`m No.{lastId} : {Math.random()}</Text>
-        </View>);
+        const last = elements[elements.length - 1];
+        last && last.update(
+            <View
+                style={[styles.sibling, {top: (elements.length - 1) * 20}]}
+            >
+                <Text>I`m No.{last.id} : {Math.random()}</Text>
+            </View>
+        );
     };
 
     render() {
-        return <View style={styles.container}>
-            <TouchableHighlight
-                style={styles.button}
-                onPress={this.addSibling}
-            >
-                <Text style={styles.buttonText}>Add element</Text>
-            </TouchableHighlight>
-            <TouchableHighlight
-                style={styles.button}
-                onPress={this.destroySibling}
-            >
-                <Text style={styles.buttonText}>Destroy element</Text>
-            </TouchableHighlight>
-            <TouchableHighlight
-                style={styles.button}
-                onPress={this.updateSibling}
-            >
-                <Text style={styles.buttonText}>Update last element</Text>
-            </TouchableHighlight>
-        </View>;
+        return (
+            <View style={styles.container}>
+                <TouchableHighlight
+                    style={styles.button}
+                    onPress={this.addSibling}
+                >
+                    <Text style={styles.buttonText}>Add element</Text>
+                </TouchableHighlight>
+                <TouchableHighlight
+                    style={styles.button}
+                    onPress={this.destroySibling}
+                >
+                    <Text style={styles.buttonText}>Destroy element</Text>
+                </TouchableHighlight>
+                <TouchableHighlight
+                    style={styles.button}
+                    onPress={this.updateSibling}
+                >
+                    <Text style={styles.buttonText}>Update last element</Text>
+                </TouchableHighlight>
+            </View>
+        );
     }
@@ -71,3 +68,3 @@ }
 
-var styles = StyleSheet.create({
+const styles = StyleSheet.create({
     container: {
@@ -98,2 +95,2 @@ flex: 1,
     }
-});
+});

Examples/package.json

@@ -9,5 +9,6 @@ {
   "dependencies": {
-    "react-native": "^0.17.0",
-    "react-native-root-siblings": "^1.0.3"
+    "react": "^15.3.1",
+    "react-native": "^0.34.0",
+    "react-native-root-siblings": "../"
   }
 }

lib/SiblingsManager.js

@@ -1,59 +0,39 @@
-import callbacks from 'jquery-callbacks';
-let decorators = {};
-let decoratorUid = 0;
-let setCallbacks = callbacks();
-let updateCallbacks = callbacks();
-let destroyCallbacks = callbacks();
+import React, { cloneElement } from 'react';
+import { StyleSheet } from 'react-native';
+import emitter from './AppRegistryInjection';
 
-class SiblingsManager {
-    constructor(element) {
-        decoratorUid++;
-        decorators[decoratorUid] = element;
-        this.id = decoratorUid;
-        setCallbacks.fire(element, this, decoratorUid);
+const styles = StyleSheet.create({
+    offStream: {
+        position: 'absolute'
     }
+});
+let uid = 0;
 
-    static addListener = (event, cb) => {
-        switch (event) {
-            case 'set':
-                setCallbacks.add(cb);
-                break;
-            case 'update':
-                updateCallbacks.add(cb);
-                break;
-            case 'destroy':
-                destroyCallbacks.add(cb);
-                break;
-            default:
-                console.warn(`SiblingsManager.addListener: Unexpected event \`${event}\`.\nEvent must be one of the ['set','update','destroy']`);
-        }
+export default class {
+    constructor(element) {
+        Object.defineProperty(this, '_id', {
+            enumerable: false,
+            configurable: false,
+            writable: false,
+            value: uid++
+        });
+
+        this.update(element);
     };
 
-    static removeListener = (event, cb) => {
-        switch (event) {
-            case 'set':
-                setCallbacks.remove(cb);
-                break;
-            case 'update':
-                updateCallbacks.remove(cb);
-                break;
-            case 'destroy':
-                destroyCallbacks.remove(cb);
-                break;
-            default:
-                console.warn(`SiblingsManager.removeListener: Unexpected event \`${event}\`.\nEvent must be one of the ['set','update','destroy']`);
-        }
+    _offstreamElement(element) {
+        return cloneElement(element, {
+            style: [element.props.style, styles.offStream]
+        });
     };
 
-    update = element => {
-        updateCallbacks.fire(element, decorators[this.id], this.id);
-        decorators[this.id] = element;
+    _id = null;
+
+    update(element) {
+        emitter.emit('siblings.update', this._id, this._offstreamElement(element));
     };
 
-    destroy = () => {
-        destroyCallbacks.fire(decorators[this.id], this.id);
-        delete decorators[this.id];
+    destroy() {
+        emitter.emit('siblings.update', this._id, null);
     };
 }
-
-export default SiblingsManager;

package.json

 {
-    "version": "1.0.8",
+    "version": "1.1.0",
     "name": "react-native-root-siblings",
@@ -9,8 +9,4 @@ "repository": {
     "license": "MIT",
-    "main": "./index.js",
+    "main": "./lib/SiblingsManager",
     "description": "react native root sibling elements manager",
-    "dependencies": {
-        "jquery-callbacks": "^0.0.1",
-        "lodash": "^3.10.0"
-    },
     "keywords": [
@@ -17,0 +13,0 @@ "react-component",

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

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

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

Found 1 instance in 1 package

Improved metrics

Dependency count

0

decreased by-100%

Worsened metrics

Total package byte prevSize

593778

decreased by-9.49%

Number of package files

45

decreased by-2.17%

Lines of code

259

decreased by-27.86%

Dependency changes

• - Removedjquery-callbacks@^0.0.1

• - Removedlodash@^3.10.0

• - Removedjquery-callbacks@0.0.1(transitive)

• - Removedlodash@3.10.1(transitive)