Added functionality of programmatic Inc/Dec Page Number + Update Docs + Checkbox fix +Disabled Switch CSS fix + Sidebar ClickNotClose Issue fixed

.gitignore

@@ -14,6 +14,7 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 package-lock.json
+yarn.lock
 
 # Editor directories and files
 .bitmap

docs/.vuepress/components/Demos/Pagination/ProgrammaticChange.vue

@@ -0,0 +1,16 @@
+<template>
+  <div>
+    <p>Current: {{ currentx }}</p>
+    <vs-button @click="currentx++">Increment</vs-button>
+    <vs-button @click="currentx--">Decrement</vs-button>
+    <br><br>
+    <vs-pagination :total="20" v-model="currentx"></vs-pagination>
+  </div>
+</template>
+<script>
+export default {
+  data: () => ({
+    currentx: 5
+  })
+}
+</script>

docs/components/pagination.md

@@ -234,3 +234,39 @@ export default {
 </div>
 </vuecode>
 </box>
+
+
+<box>
+
+## Programmatic Inc/Dec
+
+You can also update page number from outside of pagination component.
+
+<vuecode md>
+<div slot="demo">
+<Demos-Pagination-ProgrammaticChange />
+</div>
+<div slot="code">
+
+```html
+<template>
+  <div>
+    <p>Current: {{ currentx }}</p>
+    <vs-button @click="currentx++">Increment</vs-button>
+    <vs-button @click="currentx--">Decrement</vs-button>
+    <br><br>
+    <vs-pagination :total="20" v-model="currentx"></vs-pagination>
+  </div>
+</template>
+<script>
+export default {
+  data: () => ({
+    currentx: 5
+  })
+}
+</script>
+```
+
+</div>
+</vuecode>
+</box>

src/components/vsCheckBox/vsCheckBox.vue

@@ -92,7 +92,7 @@ export default {
         this.setValueString()
       }
       else {
-        this.$emit('input', evt.target.value)
+        this.$emit('input',!this.value)
         this.$emit('change',evt)
       }
     },

src/components/vsPagination/vsPagination.vue

@@ -120,6 +120,10 @@ export default {
     },
     total() {
       this.getPages()
+    },
+    value(val) {
+        const pageNum = val < 1 ? 1 : (val <= this.total ? val : this.total)
+        this.goTo(pageNum)
     }
   },
 

src/components/vsSideBar/vsSidebar.vue

@@ -100,7 +100,7 @@ export default {
   },
   watch:{
     value() {
-      this.addEventClick()
+      if(!this.clickNotClose) this.addEventClick()
     }
   },
   methods:{

src/components/vsSwitch/vsSwitch.vue

@@ -1,5 +1,5 @@
 <template lang="html">
-  <div
+  <button
     :class="[
       `vs-switch-${color}`,
       {
@@ -43,7 +43,7 @@
       ></vs-icon>
     </span>
     <span class="vs-circle-switch vs-switch--circle"/>
-  </div>
+  </button>
 </template>
 
 <script>