jss-extend - npm Package Compare versions

Comparing version 0.1.7 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.6 / 2014-01-31
@@ -2,0 +8,0 @@

package.json

 {
   "name": "jss-extend",
-  "description": "Inheritance plugin for jss",
-  "version": "0.1.7",
+  "description": "JSS plugin that enables inheritance",
+  "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-extend.js",
+    "build:min": "NODE_ENV=production webpack src/index.js dist/jss-extend.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,61 +0,87 @@
-## Inheritance plugin for JSS
+![JSS logo](https://avatars1.githubusercontent.com/u/9503099?v=3&s=60)
 
-For those who uses an ES6 transpiler - you can achieve the same by using the language itself.
+## JSS plugin that enables inheritance
 
+This plugin implements a custom `extend` style property.
+
+[Demo](http://jsstyles.github.io/jss-examples/index.html#plugin-jss-extend) -
+[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
-var redButton = {
-    background: 'red'
-}
+import jss from 'jss'
+import extend from 'jss-extend'
 
-export default {
-    button: {
-        ...redButton,
-        'font-size': '20px'
-    }
+jss.use(extend)
+
+const redContainer = {
+  background: 'red'
 }
-```
 
+const styleSheet = jss.createStyleSheet({
+  container: {
+    extend: redContainer, // Can be an array of styles
+    'font-size': '20px'
+  }
+})
 
-This plugin implements `extend` property for [jss](https://github.com/jsstyles/jss).
+/**
+ * For those who use an ES6 transpiler - you can achieve the same
+ * by using the language itself.
+ */
 
-Take a look at [examples](http://jsstyles.github.io/jss-extend/examples/index.html) directory.
+// ES7
+const styleSheet = jss.createStyleSheet({
+  container: {
+    ...redContainer,
+    'font-size': '20px'
+  }
+})
 
+// ES6
+const styleSheet = jss.createStyleSheet({
+  container: Object.assign({}, redContainer, {
+    'font-size': '20px'
+  })
+})
 
-```javascript
-var redButton = {
-    background: 'red'
-}
+// Or with a helper
+import xtend from 'xtend' // Does not mutate arguments
 
-exports.styles = {
-    button: {
-        extend: redButton, // can be an array of styles
-        'font-size': '20px'
-    }
-}
+const styleSheet = jss.createStyleSheet({
+  container: xtend(redContainer, {
+    'font-size': '20px'
+  })
+})
 ```
+
+```javascript
+console.log(styleSheet.toString())
+```
 ```css
-.button {
-    background: red;
-    font-size: 20px;
+.jss-0-0 {
+  background: red;
+  font-size: 20px;
 }
 ```
 
-## Register plugin
-
 ```javascript
-var jss = require('jss')
-var extend = require('jss-extend')
-jss.use(extend)
+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-extend/test)
 
@@ -62,0 +88,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

91

increased by40%

Worsened metrics

Total package byte prevSize

9328

decreased by-18.9%

Dev dependency count

13

increased by225%

Number of package files

11

decreased by-45%

Lines of code

136

decreased by-22.73%

Number of low supply chain risk alerts

4

increased by100%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes