💎 Release new version 2.8.3

🔥 Remove default styles object as it causes problems

.babelrc

@@ -1,5 +1,5 @@
 {
   "presets": ["es2015", "stage-2"],
-  "plugins": ["transform-runtime"],
+  "plugins": ["transform-runtime", "transform-object-assign"],
   "comments": false
 }

CHANGELOG.md

@@ -1,5 +1,53 @@
 # Change Log
 
+## [v2.8.2](https://github.com/apertureless/vue-chartjs/tree/v2.8.2) (2017-08-12)
+[Full Changelog](https://github.com/apertureless/vue-chartjs/compare/v2.8.1...v2.8.2)
+
+**Closed issues:**
+
+- UNMET PEER DEPENDENCY [\#167](https://github.com/apertureless/vue-chartjs/issues/167)
+- Base Charts' height: 200% [\#164](https://github.com/apertureless/vue-chartjs/issues/164)
+
+**Merged pull requests:**
+
+- Add support for xLabels and yLabels [\#166](https://github.com/apertureless/vue-chartjs/pull/166) ([dsbert](https://github.com/dsbert))
+- Update README.md [\#165](https://github.com/apertureless/vue-chartjs/pull/165) ([mikeybeck](https://github.com/mikeybeck))
+
+## [v2.8.1](https://github.com/apertureless/vue-chartjs/tree/v2.8.1) (2017-08-05)
+[Full Changelog](https://github.com/apertureless/vue-chartjs/compare/v2.8.0...v2.8.1)
+
+**Merged pull requests:**
+
+- Add Russian documentation [\#163](https://github.com/apertureless/vue-chartjs/pull/163) ([dood-](https://github.com/dood-))
+
+## [v2.8.0](https://github.com/apertureless/vue-chartjs/tree/v2.8.0) (2017-08-04)
+[Full Changelog](https://github.com/apertureless/vue-chartjs/compare/v1.2.0...v2.8.0)
+
+**Closed issues:**
+
+- Update README CDN link [\#161](https://github.com/apertureless/vue-chartjs/issues/161)
+- Options being ignored [\#160](https://github.com/apertureless/vue-chartjs/issues/160)
+- Fails to dynamically change height. [\#158](https://github.com/apertureless/vue-chartjs/issues/158)
+- Chart doesn't load in bootstrap tab [\#157](https://github.com/apertureless/vue-chartjs/issues/157)
+- Add scatter chart to vue-chatjs@legacy [\#155](https://github.com/apertureless/vue-chartjs/issues/155)
+- \[Error\] Get error when $destroy is started. [\#149](https://github.com/apertureless/vue-chartjs/issues/149)
+
+**Merged pull requests:**
+
+- Feature/dynamic styles [\#162](https://github.com/apertureless/vue-chartjs/pull/162) ([apertureless](https://github.com/apertureless))
+- Add Chinese simplified docs support. [\#159](https://github.com/apertureless/vue-chartjs/pull/159) ([Mooooooon](https://github.com/Mooooooon))
+
+## [v1.2.0](https://github.com/apertureless/vue-chartjs/tree/v1.2.0) (2017-07-25)
+[Full Changelog](https://github.com/apertureless/vue-chartjs/compare/v2.7.2...v1.2.0)
+
+**Closed issues:**
+
+- this.$refs doesn't seem to have expected canvas property [\#156](https://github.com/apertureless/vue-chartjs/issues/156)
+
+**Merged pull requests:**
+
+- Before destroy fix [\#152](https://github.com/apertureless/vue-chartjs/pull/152) ([DenisLapi](https://github.com/DenisLapi))
+
 ## [v2.7.2](https://github.com/apertureless/vue-chartjs/tree/v2.7.2) (2017-07-22)
 [Full Changelog](https://github.com/apertureless/vue-chartjs/compare/v2.7.1...v2.7.2)
 

README.md

@@ -66,7 +66,7 @@ You can use `vue-chartjs` directly in the browser without any build setup. Like
 
 If you're using Gulp, Browserify or Webpack 1 the entry is `vue-chartjs.js` which is __transpiled__ and __bundled__ UMD Module.
 
-However Vue.js and Chart.js are `deerDependencies` so you have to install them seperately. In most projects you will have `Vue.js` already installed anyways. This way, you can have different versions of Vue.js and Chart.js then in this package.
+However Vue.js and Chart.js are `peerDependencies` so you have to install them separately. In most projects you will have `Vue.js` already installed anyways. This way, you can have different versions of Vue.js and Chart.js then in this package.
 
 ### Webpack 2
 If you're using Webpack 2 it will automatically use the `jsnext:main` / `module` entry point. Which is `es/index.js`

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-chartjs",
-  "version": "2.8.1",
+  "version": "2.8.3",
   "description": "vue.js wrapper for chart.js",
   "author": "Jakub Juszczak <jakub@posteo.de>",
   "homepage": "http://vue-chartjs.org",
@@ -56,9 +56,7 @@
     "release": "webpack --progress --hide-modules --config  ./build/webpack.release.js && NODE_ENV=production webpack --progress --hide-modules --config  ./build/webpack.release.min.js && webpack --progress --hide-modules --config  ./build/webpack.release.full.js && NODE_ENV=production webpack --progress --hide-modules --config  ./build/webpack.release.full.min.js",
     "prepublish": "yarn run lint && yarn run test && yarn run build"
   },
-  "dependencies": {
-    "lodash": "^4.17.4"
-  },
+  "dependencies": {},
   "peerDependencies": {
     "chart.js": "^2.6.0",
     "vue": "^2.4.2"
@@ -67,6 +65,7 @@
     "babel-cli": "^6.24.1",
     "babel-core": "^6.25.0",
     "babel-loader": "^7.0.0",
+    "babel-plugin-transform-object-assign": "^6.22.0",
     "babel-plugin-transform-runtime": "^6.23.0",
     "babel-preset-es2015": "^6.24.1",
     "babel-preset-stage-2": "^6.24.1",

src/BaseCharts/Bar.js

@@ -41,14 +41,7 @@ export default Vue.extend({
       default: ''
     },
     styles: {
-      type: Object,
-      default () {
-        return {
-          width: '100%',
-          height: '100%',
-          position: 'relative'
-        }
-      }
+      type: Object
     }
   },
   data () {

src/BaseCharts/Bubble.js

@@ -42,14 +42,7 @@ export default Vue.extend({
       default: ''
     },
     styles: {
-      type: Object,
-      default () {
-        return {
-          width: '100%',
-          height: '100%',
-          position: 'relative'
-        }
-      }
+      type: Object
     }
   },
 

src/BaseCharts/Doughnut.js

@@ -42,14 +42,7 @@ export default Vue.extend({
       default: ''
     },
     styles: {
-      type: Object,
-      default () {
-        return {
-          width: '100%',
-          height: '100%',
-          position: 'relative'
-        }
-      }
+      type: Object
     }
   },
 

src/BaseCharts/HorizontalBar.js

@@ -42,14 +42,7 @@ export default Vue.extend({
       default: ''
     },
     styles: {
-      type: Object,
-      default () {
-        return {
-          width: '100%',
-          height: '100%',
-          position: 'relative'
-        }
-      }
+      type: Object
     }
   },
 

src/BaseCharts/Line.js

@@ -42,14 +42,7 @@ export default Vue.extend({
       default: ''
     },
     styles: {
-      type: Object,
-      default () {
-        return {
-          width: '100%',
-          height: '100%',
-          position: 'relative'
-        }
-      }
+      type: Object
     }
   },
 

src/BaseCharts/Pie.js

@@ -42,14 +42,7 @@ export default Vue.extend({
       default: ''
     },
     styles: {
-      type: Object,
-      default () {
-        return {
-          width: '100%',
-          height: '100%',
-          position: 'relative'
-        }
-      }
+      type: Object
     }
   },
 

src/BaseCharts/PolarArea.js

@@ -42,14 +42,7 @@ export default Vue.extend({
       default: ''
     },
     styles: {
-      type: Object,
-      default () {
-        return {
-          width: '100%',
-          height: '100%',
-          position: 'relative'
-        }
-      }
+      type: Object
     }
   },
 

src/BaseCharts/Radar.js

@@ -42,14 +42,7 @@ export default Vue.extend({
       default: ''
     },
     styles: {
-      type: Object,
-      default () {
-        return {
-          width: '100%',
-          height: '100%',
-          position: 'relative'
-        }
-      }
+      type: Object
     }
   },
 

src/BaseCharts/Scatter.js

@@ -42,14 +42,7 @@ export default Vue.extend({
       default: ''
     },
     styles: {
-      type: Object,
-      default () {
-        return {
-          width: '100%',
-          height: '100%',
-          position: 'relative'
-        }
-      }
+      type: Object
     }
   },
 

src/helpers/options.js

@@ -1,5 +1,4 @@
-import merge from 'lodash/fp/merge'
-
 export function mergeOptions (obj, src) {
-  return merge(obj, src)
+  let mutableObj = Object.assign({}, obj)
+  return Object.assign(mutableObj, src)
 }

src/mixins/reactiveData.js

@@ -48,7 +48,15 @@ module.exports = {
               }
             })
 
-            chart.data.labels = newData.labels
+            if (newData.hasOwnProperty('labels')) {
+              chart.data.labels = newData.labels
+            }
+            if (newData.hasOwnProperty('xLabels')) {
+              chart.data.xLabels = newData.xLabels
+            }
+            if (newData.hasOwnProperty('yLabels')) {
+              chart.data.yLabels = newData.yLabels
+            }
             chart.update()
           } else {
             chart.destroy()

src/mixins/reactiveProp.js

@@ -48,7 +48,15 @@ module.exports = {
               }
             })
 
-            chart.data.labels = newData.labels
+            if (newData.hasOwnProperty('labels')) {
+              chart.data.labels = newData.labels
+            }
+            if (newData.hasOwnProperty('xLabels')) {
+              chart.data.xLabels = newData.xLabels
+            }
+            if (newData.hasOwnProperty('yLabels')) {
+              chart.data.yLabels = newData.yLabels
+            }
             chart.update()
           } else {
             chart.destroy()

test/unit/specs/helpers/options.spec.js

@@ -15,16 +15,40 @@ describe('mergeOptions.js', () => {
     c: 'c'
   }
 
+  const an = {
+    a: {
+      a: 'a'
+    },
+    b: {
+      b: 'a'
+    }
+  }
+
+  const bn = {
+    a: {
+      a: 'a'
+    },
+    b: {
+      b: 'b'
+    }
+  }
+
   it('should replace old a and b if a and b are new', () => {
-    let ab = mergeOptions(a, b)
+    const ab = mergeOptions(a, b)
     expect(ab).to.have.property('a').and.to.equal('b')
     expect(ab).to.have.property('b').and.to.equal('b')
   })
 
   it('should add c if c is new', () => {
-    let ac = mergeOptions(a, c)
+    const ac = mergeOptions(a, c)
     expect(ac).to.have.property('a').and.to.equal('a')
     expect(ac).to.have.property('b').and.to.equal('a')
     expect(ac).to.have.property('c').and.to.equal('c')
   })
+
+  it('should replace old a and b if a and b are new in nested objects', () => {
+    const ab = mergeOptions(an, bn)
+    expect(ab).to.have.deep.property('a.a').and.to.equal('a')
+    expect(ab).to.have.deep.property('b.b').and.to.equal('b')
+  })
 })

yarn.lock

@@ -687,6 +687,12 @@ babel-plugin-transform-exponentiation-operator@^6.24.1:
     babel-plugin-syntax-exponentiation-operator "^6.8.0"
     babel-runtime "^6.22.0"
 
+babel-plugin-transform-object-assign@^6.22.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-object-assign/-/babel-plugin-transform-object-assign-6.22.0.tgz#f99d2f66f1a0b0d498e346c5359684740caa20ba"
+  dependencies:
+    babel-runtime "^6.22.0"
+
 babel-plugin-transform-object-rest-spread@^6.22.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-object-rest-spread/-/babel-plugin-transform-object-rest-spread-6.23.0.tgz#875d6bc9be761c58a2ae3feee5dc4895d8c7f921"
@@ -3554,7 +3560,7 @@ lodash@^3.8.0:
   version "3.10.1"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
 
-lodash@^4.0.0, lodash@^4.0.1, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.3.0, lodash@^4.5.0:
+lodash@^4.0.0, lodash@^4.0.1, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.2.0, lodash@^4.3.0, lodash@^4.5.0:
   version "4.17.4"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae"