jss-nested - npm Package Compare versions

Comparing version 0.1.8 to 0.2.0

history.md

@@ -0,1 +1,7 @@
+## 0.2.0 / 2015-09-21
+
+- migrate to es6
+- move examples to jss-examples repository
+- simplify packaging
+
 ## 0.1.7 / 2014-02-06
@@ -2,0 +8,0 @@

package.json

 {
   "name": "jss-nested",
-  "description": "Nested selectors plugin for jss",
-  "version": "0.1.8",
+  "description": "JSS plugin that enables support for nested selectors",
+  "version": "0.2.0",
   "author": {
@@ -20,18 +20,33 @@ "name": "Oleg Slobodskoi",
   "engines": {},
-  "scripts": {},
-  "licenses": [
-    {
-      "type": "MIT",
-      "url": "http://www.opensource.org/licenses/mit-license.php"
-    }
-  ],
+  "scripts": {
+    "all": "npm run lint && npm run build",
+    "test": "opener ./test/index.html",
+    "build": "npm run clean && npm run build:lib && npm run build:max && npm run build:min",
+    "clean": "rimraf ./lib/*",
+    "build:lib": "babel src --out-dir lib",
+    "build:max": "NODE_ENV=development webpack src/index.js dist/jss-nested.js",
+    "build:min": "NODE_ENV=production webpack src/index.js dist/jss-nested.min.js",
+    "lint": "eslint ./src",
+    "prepublish": "npm run all && git push --tags"
+  },
+  "license": "MIT",
+  "main": "./lib/index.js",
   "devDependencies": {
-    "browserify": "6.0.3",
+    "babel": "^5.6.14",
+    "babel-core": "^5.6.20",
+    "babel-eslint": "^3.1.23",
+    "babel-loader": "^5.3.1",
+    "eslint": "^0.24.1",
+    "eslint-config-airbnb": "^0.0.6",
+    "eslint-config-jss": "^0.1.0",
+    "eslint-plugin-react": "^2.7.0",
+    "jss": "^2.3.4",
+    "opener": "^1.4.1",
     "qunitjs": "1.15.0",
-    "xpkg": "0.2.0",
-    "jss": "^2.1.0"
+    "rimraf": "^2.4.3",
+    "webpack": "^1.11.0"
   },
   "peerDependencies": {
-    "jss": "^2.1.0"
+    "jss": "^2.3.4"
   }
-}
+}

readme.md

@@ -1,63 +0,78 @@
-## Nested selectors plugin for JSS
+![JSS logo](https://avatars1.githubusercontent.com/u/9503099?v=3&s=60)
 
-This plugin implements nested selectors for [jss](https://github.com/jsstyles/jss).
+## JSS plugin that enables support for nested selectors
 
-Take a look at [examples](http://jsstyles.github.io/jss-nested/examples/index.html) directory.
+Put an `&` before a selector within a rule and it will be
+replaced by the parent selector and extracted to
+a [separate rule](http://jsstyles.github.io/jss-examples/plugins/jss-nested/simple/index.html).
 
-Put an `&` before a selector within a rule and it will be replaced by the parent selector and extracted to a [separate rule](http://jsstyles.github.io/jss-nested/examples/simple/index.html).
+[Demo](http://jsstyles.github.io/jss-examples/index.html#plugin-jss-nested) -
+[JSS](https://github.com/jsstyles/jss)
 
+[![Gitter](https://badges.gitter.im/Join Chat.svg)](https://gitter.im/jsstyles/jss?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
 
+
+## Usage example
+
 ```javascript
-{
-    '.container': {
-        padding: '20px',
-        // Will result in .container.clear
-        '&.clear': {
-            clear: 'both'
-        },
-        // Will result in .container .button
-        '& .button': {
-            background: 'red'
-        },
-        '&.selected, &.active': {
-            border: '1px solid red'
-        },
-        '&:hover': {
-            background: 'blue'
-        }
+import jss from 'jss'
+import nested from 'jss-nested'
+
+jss.use(nested)
+
+const styleSheet = jss.createStyleSheet({
+  container: {
+    padding: '20px',
+    '&:hover': {
+      background: 'blue'
+    },
+    '&.clear': {
+      clear: 'both'
+    },
+    '& .button': {
+      background: 'red'
+    },
+    '&.selected, &.active': {
+      border: '1px solid red'
     }
-}
+  }
+})
 ```
+
+```javascript
+console.log(styleSheet.toString())
+```
 ```css
-.container {
-    padding: 20px;
+.jss-0-0 {
+  padding: 20px;
 }
-.container.clear {
-    clear: both;
+.jss-0-0:hover {
+  background: blue;
 }
-.container .button {
-    background: red;
+.jss-0-0.clear {
+  clear: both;
 }
-.container.selected, .container.active {
-    border: 1px solid red;
+.jss-0-0 .button {
+  background: red;
 }
+.jss-0-0.selected, .jss-0-0.active {
+  border: 1px solid red;
+}
 ```
-## Register plugin
 
 ```javascript
-var jss = require('jss')
-var nested = require('jss-nested')
-jss.use(nested)
+console.log(styleSheet.classes)
 ```
+```javascript
+{ container: "jss-0-0" }
+```
 
+
 ## Run tests
 
-### Locally
 ```bash
 npm i
-open test/local.html
+npm run test
 ```
-### From github
 
-[Tests](https://jsstyles.github.com/jss-nested/test)
 
@@ -64,0 +79,0 @@ ## License

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

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

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

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

82

increased by22.39%

Worsened metrics

Total package byte prevSize

8400

decreased by-30.01%

Dev dependency count

13

increased by225%

Number of package files

11

decreased by-35.29%

Lines of code

116

decreased by-38.95%

Number of low supply chain risk alerts

4

increased by100%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes