react-web-component - npm Package Compare versions

Comparing version 1.0.13-alpha to 1.0.14

package.json

 {
   "name": "react-web-component",
-  "version": "1.0.13-alpha",
+  "version": "1.0.14",
   "description": "Create Web Components with React",
@@ -11,4 +11,4 @@ "main": "src/index.js",
     "react-dom": "^16.0.0",
-    "react-shadow-dom-retarget-events": "^1.0.7"
+    "react-shadow-dom-retarget-events": "^1.0.8"
   }
 }

README.md

@@ -48,2 +48,24 @@ <p align="center">
 
+It is also possible to create multiple web components in a single project and pass on props:
+
+```javascript
+import React from 'react';
+import ReactWebComponent from 'react-web-component';
+
+class MyComponent extends React.Component {
+  render() {
+    return <div>Hello World!</div>;
+  }
+}
+
+class AnotherComponent extends React.Component {
+  render() {
+    return <div>Hello {this.props.name}!</div>;
+  }
+}
+
+ReactWebComponent.create(<MyComponent />, 'my-component');
+ReactWebComponent.create(<AnotherComponent name="Mars" />, 'another-component');
+```
+
 Note that `react-web-component` does not limit you in the complexity of your React component. You can pass an entire single page application in your web component if you need to.
@@ -87,2 +109,3 @@
 
+Parameters passed to the web component methods will also be proxied to the react component.
 
@@ -89,0 +112,0 @@ ## Adding CSS to your web component using `react-web-component-style-loader`

src/index.js

@@ -45,3 +45,3 @@ const ReactDOM = require('react-dom');
           for (var i = 0; i < styles.length; i++) {
-            shadowRoot.appendChild(styles[i])
+              shadowRoot.appendChild(styles[i].cloneNode(true));
           }
@@ -48,0 +48,0 @@ shadowRoot.appendChild(mountPoint);

Fixed alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

39613

increased by1.68%

Number of low quality alerts

1

decreased by-50%

Number of lines in readme file

202

increased by12.85%

Dependency changes

• Updatedreact-shadow-dom-retarget-events@^1.0.8