react-jss - npm Package Compare versions

Comparing version 1.1.1 to 2.0.0

package.json

 {
   "name": "react-jss",
-  "version": "1.1.1",
+  "version": "2.0.0",
   "description": "JSS mixin for React components",
@@ -31,3 +31,3 @@ "main": "lib/index.js",
   "peerDependencies": {
-    "jss": "^2.3.0",
+    "jss": ">=3.0.0 < 4.0.0",
     "react": ">=0.13"
@@ -34,0 +34,0 @@ },

README.md

@@ -23,22 +23,22 @@ ## React JSS
 // jss.js
-```js
+```javascript
 // Create a new instance of jss.
-var jss = require('jss').create();
+var jss = require('jss').create()
 // Now all plugins are used by this instance only.
-jss.use(require('jss-vendor-prefixer'));
+jss.use(require('jss-vendor-prefixer'))
 
 // Pass your jss instance to react-jss
-var useSheet = require('react-jss')(jss);
+var useSheet = require('react-jss')(jss)
 
-exports.jss = jss;
-exports.useSheet = useSheet;
+exports.jss = jss
+exports.useSheet = useSheet
 ```
 
 #### ES6
-```js
-import {Jss} from 'jss' 
+```javascript
+import {create} from 'jss'
 import reactJss from 'react-jss'
 import vendorPrefixer from 'jss-vendor-prefixer'
 
-export let jss = new Jss()
+export let jss = create()
 export let useSheet = reactJss(jss)
@@ -53,10 +53,10 @@
 
-```js
-var React = require('react');
-var useSheet = require('react-jss');
+```javascript
+var React = require('react')
+var useSheet = require('react-jss')
 
 // You can use jss directly too!
-var jss = require('jss');
-var vendorPrefixer = require('jss-vendor-prefixer');
-jss.use(vendorPrefixer);
+var jss = require('jss')
+var vendorPrefixer = require('jss-vendor-prefixer')
+jss.use(vendorPrefixer)
 
@@ -70,7 +70,7 @@ var styles = {
   }
-};
+}
 
 var Button = React.createClass({
   render: function () {
-    var classes = this.props.sheet.classes;
+    var classes = this.props.sheet.classes
 
@@ -83,7 +83,7 @@ return (
       </div>
-    );
+    )
   }
 })
 
-module.exports = useSheet(Button, styles);
+module.exports = useSheet(Button, styles)
 ```
@@ -93,10 +93,10 @@
 
-```js
-import React, { Component } from 'react';
-import useSheet from 'react-jss';
+```javascript
+import React, { Component } from 'react'
+import useSheet from 'react-jss'
 
 // You can use jss directly too!
-import jss from 'jss';
-import vendorPrefixer from 'jss-vendor-prefixer';
-jss.use(vendorPrefixer);
+import jss from 'jss'
+import vendorPrefixer from 'jss-vendor-prefixer'
+jss.use(vendorPrefixer)
 
@@ -110,7 +110,7 @@ const styles = {
   }
-};
+}
 
 class Button extends Component {
   render() {
-    const { classes } = this.props.sheet;
+    const { classes } = this.props.sheet
 
@@ -123,7 +123,7 @@ return (
       </div>
-    );
+    )
   }
 }
 
-export default useSheet(Button, styles);
+export default useSheet(Button, styles)
 ```
@@ -133,10 +133,10 @@
 
-```js
-import React, { Component } from 'react';
-import useSheet from 'react-jss';
+```javascript
+import React, { Component } from 'react'
+import useSheet from 'react-jss'
 
 // You can use jss directly too!
-import jss from 'jss';
-import vendorPrefixer from 'jss-vendor-prefixer';
-jss.use(vendorPrefixer);
+import jss from 'jss'
+import vendorPrefixer from 'jss-vendor-prefixer'
+jss.use(vendorPrefixer)
 
@@ -150,3 +150,3 @@ const styles = {
   }
-};
+}
 
@@ -156,3 +156,3 @@ @useSheet(styles)
   render() {
-    const { classes } = this.props.sheet;
+    const { classes } = this.props.sheet
 
@@ -165,5 +165,5 @@ return (
       </div>
-    );
+    )
   }
-};
+}
 ```
@@ -177,4 +177,4 @@
 
-```js
-import classSet from 'classnames';
+```javascript
+import classSet from 'classnames'
 
@@ -184,3 +184,3 @@ // ...
   render() {
-    const { classes } = this.props.sheet;
+    const { classes } = this.props.sheet
     return (
@@ -193,4 +193,4 @@ <div className={classSet({
       </div>
-    );
-  );
+    )
+  )
 ```
@@ -200,4 +200,4 @@
 
-```js
- var classSet = require('classnames');
+```javascript
+ var classSet = require('classnames')
 
@@ -207,3 +207,3 @@ // ...
  render: function () {
-    var classes = this.props.sheet.classes;
+    var classes = this.props.sheet.classes
     return (
@@ -216,3 +216,3 @@ <div className={classSet(
       </div>
-    );
+    )
   }
@@ -244,3 +244,3 @@ ```
 
-In both overloads, `rules` and `options` are the arguments to the `jss.createStyleSheet` call inside.  
+In both overloads, `rules` and `options` are the arguments to the `jss.createStyleSheet` call inside.
 If you're not sure which overload to use, go with the first one.
@@ -247,0 +247,0 @@

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

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

Improved metrics

Total package byte prevSize

12028

increased by0.21%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes