mdbvue - npm Package Compare versions

Comparing version 5.1.2 to 5.2.0

package.json

 {
   "name": "mdbvue",
-  "version": "5.1.2",
+  "version": "5.2.0",
   "description": "Vue Bootstrap with Material Design",
@@ -26,3 +26,3 @@ "author": "MDBootstrap <[e-mail]>",
     "moment": "^2.24.0",
-    "popper.js": "^1.14.7",
+    "popper.js": "^1.15.0",
     "vue": "^2.6.10",
@@ -33,4 +33,4 @@ "vue-chartjs": "^3.4.2",
     "vue-perfect-scrollbar": "^0.1.0",
-    "vue-router": "^3.0.2",
-    "vue2-touch-events": "^1.1.1"
+    "vue-router": "^3.0.3",
+    "vue2-touch-events": "^2.0.0"
   },
@@ -85,3 +85,3 @@ "devDependencies": {
     "webpack": "^4.19.1",
-    "webpack-bundle-analyzer": "^3.0.2",
+    "webpack-bundle-analyzer": "^3.0.3",
     "webpack-dev-middleware": "^3.3.0",
@@ -88,0 +88,0 @@ "webpack-hot-middleware": "^2.24.0",

README.md

@@ -61,3 +61,3 @@
 
-- MDBVue 5.1.2
+- MDBVue 5.2.0
 - Vue 2.6.10
@@ -64,0 +64,0 @@

src/components/ChartBar.js

@@ -8,2 +8,10 @@ import { Bar } from 'vue-chartjs';
     this.renderChart(this.data, this.options);
+  },
+  watch: {
+    data(newData) {
+      this.renderChart(newData, this.options);
+    },
+    options(newOptions) {
+      this.renderChart(this.data, newOptions);
+    }
   }
@@ -10,0 +18,0 @@ };

src/components/ChartDoughnut.js

@@ -8,2 +8,10 @@ import { Doughnut } from 'vue-chartjs';
     this.renderChart(this.data, this.options);
+  },
+  watch: {
+    data(newData) {
+      this.renderChart(newData, this.options);
+    },
+    options(newOptions) {
+      this.renderChart(this.data, newOptions);
+    }
   }
@@ -10,0 +18,0 @@ };

src/components/ChartLine.js

@@ -8,2 +8,10 @@ import { Line } from 'vue-chartjs';
     this.renderChart(this.data, this.options);
+  },
+  watch: {
+    data(newData) {
+      this.renderChart(newData, this.options);
+    },
+    options(newOptions) {
+      this.renderChart(this.data, newOptions);
+    }
   }
@@ -10,0 +18,0 @@ };

src/components/ChartPie.js

@@ -8,2 +8,10 @@ import { Pie } from 'vue-chartjs';
     this.renderChart(this.data, this.options);
+  },
+  watch: {
+    data(newData) {
+      this.renderChart(newData, this.options);
+    },
+    options(newOptions) {
+      this.renderChart(this.data, newOptions);
+    }
   }
@@ -10,0 +18,0 @@ };

src/components/ChartPolar.js

@@ -8,2 +8,10 @@ import { PolarArea } from 'vue-chartjs';
     this.renderChart(this.data, this.options);
+  },
+  watch: {
+    data(newData) {
+      this.renderChart(newData, this.options);
+    },
+    options(newOptions) {
+      this.renderChart(this.data, newOptions);
+    }
   }
@@ -10,0 +18,0 @@ };

src/components/ChartRadar.js

@@ -8,2 +8,10 @@ import { Radar } from 'vue-chartjs';
     this.renderChart(this.data, this.options);
+  },
+  watch: {
+    data(newData) {
+      this.renderChart(newData, this.options);
+    },
+    options(newOptions) {
+      this.renderChart(this.data, newOptions);
+    }
   }
@@ -10,0 +18,0 @@ };

src/directives/AnimateOnScroll.js

 export default {
   name: 'animateOnScroll',
   inserted(el, binding) {
-    let f = () => {
+    el.setAttribute(
+      'style',
+      'visibility: hidden;'
+    );
+
+    el.animate = () => {
       const offset = el => {
@@ -11,14 +16,28 @@ var rect = el.getBoundingClientRect(),
       };
-      if (offset(el).top - window.scrollY < window.innerHeight) {
-        let classNames = el.getAttribute('class');
-        classNames = `${classNames} animated ${binding.value}`;
-        el.setAttribute(
-          'class',
-          classNames
-        );
+
+      const position = binding.value.position || 0;
+      const delay = binding.value.delay || 0;
+      const animation = binding.value.animation || binding.value;
+
+      if (offset(el).top - window.scrollY + el.clientHeight + (window.innerHeight*position/100) < window.innerHeight) {
+        setTimeout(() => {
+          let classNames = el.getAttribute('class');
+          classNames = `${classNames} animated ${animation}`;
+          el.setAttribute(
+            'style',
+            'visibility: visible'
+          );
+          el.setAttribute(
+            'class',
+            classNames
+          );
+        }, delay);
       }
       return offset(el).top - window.scrollY < window.innerHeight;
     };
-    window.addEventListener('scroll', f);
+    window.addEventListener('scroll', el.animate);
+  },
+  unbind(el) {
+    window.removeEventListener('scroll', el.animate);
   }
 };

src/index.js

@@ -34,2 +34,5 @@ // FREE
 import RadarChart, { mdbRadarChart } from './components/ChartRadar';
+import BubbleChart, { mdbBubbleChart } from './components/ChartBubble';
+import ScatterChart, { mdbScatterChart } from './components/ChartScatter';
+import HorizontalBarChart, { mdbHorizontalBarChart } from './components/ChartHorizontalBar';
 import Collapse, { mdbCollapse } from './components/Collapse';
@@ -88,2 +91,3 @@ import Column, { mdbCol } from './components/Col';
 import animateOnScroll from './directives/AnimateOnScroll';
+import Scrollbar, { mdbScrollbar } from './components/Scrollbar';
 
@@ -124,2 +128,5 @@ export {
   RadarChart,
+  BubbleChart,
+  ScatterChart,
+  HorizontalBarChart,
   Container,
@@ -176,3 +183,3 @@ Collapse,
   animateOnScroll,
-
+  Scrollbar,
   // MDB FREE
@@ -211,2 +218,5 @@ mdbAccordion,
   mdbRadarChart,
+  mdbBubbleChart,
+  mdbScatterChart,
+  mdbHorizontalBarChart,
   mdbCol,
@@ -260,3 +270,4 @@ mdbCollapse,
   mdbTooltip,
-  mdbView
+  mdbView,
+  mdbScrollbar
 };

src/router/index.js

@@ -268,3 +268,3 @@ import Vue from 'vue';
     }, {
-      path: '/components/alert',
+      path: '/components/alerts',
       name: 'AlertPage',
@@ -271,0 +271,0 @@ component: AlertPage

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

Improved metrics

Total package byte prevSize

3284871

increased by2.17%

Number of package files

274

increased by1.86%

Worsened metrics

Lines of code

13107

decreased by-0.01%

Dependency changes

• + Addedvue2-touch-events@2.3.2(transitive)

• - Removedvue2-touch-events@1.1.2(transitive)

• Updatedpopper.js@^1.15.0

• Updatedvue-router@^3.0.3

• Updatedvue2-touch-events@^2.0.0