@avakhula/ui 0.0.16 → 0.0.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@avakhula/ui",
-  "version": "0.0.16",
+  "version": "0.0.18",
   "main": "dist/index.js",
   "module": "dist/index.umd.cjs",
   "source": "src/index.js",

package/src/App.vue

@@ -6,11 +6,17 @@
     :is-multiple="false"
   />
 
-  <button @click="changeValue">test</button>
+  <button @click="changeValue">Change value</button>
+  <button @click="changeValueInProps">Change value in props</button>
+
+  <ib-checkbox  @input="test1" class="hello"/>
 </template>
 
 <script>
 import IbSelect from "./components/TreeSelect/Select.vue";
+import IbCheckbox from "./components/Form/Checkbox/Checkbox.vue"
+
+
 const testData = [
   {
     id: "1",
@@ -68,12 +74,21 @@ export default {
   },
   components: {
     IbSelect,
+    IbCheckbox
   },
   methods: {
+    test1() {
+      console.log('test 1')
+    },
+
     changeValue() {
         console.log('test')
         this.test = testData[2].id
     },
+    changeValueInProps() {
+        console.log('test')
+        this.test = testData[3].id
+    },
   },
 };
 </script>

package/src/components/Form/Checkbox/Checkbox.vue

@@ -1,6 +1,6 @@
 <template>
   <label
-    :class="classes"
+    v-bind="attrs"
     :for="id"
     :tabindex="disabled ? -1 : 0"
     @keypress.prevent="onChange"
@@ -47,6 +47,7 @@
 </template>
 <script>
 import generateUID from "../../../helpers/generateUID";
+import removeEvents from "../../../helpers/removeEvents";
 import IbIcon from "../../Icon.vue";
 
 export default {
@@ -100,6 +101,7 @@ export default {
   methods: {
     onChange() {
       this.checked = !this.checked;
+      console.log('input')
       this.$emit("input", this.checked);
     },
   },
@@ -116,10 +118,18 @@ export default {
     indeterminate() {
       return this.isChecked === null;
     },
+    attrs() {
+      const attrsList = { ...removeEvents({ ...this.$attrs }) };
+
+      attrsList.class = [this.classes, attrsList.class];
+
+      return attrsList;
+    },
   },
   components: {
     IbIcon,
   },
+  inheritAttrs: false,
 };
 </script>
 

package/src/components/TreeSelect/Select.vue

@@ -275,9 +275,6 @@ export default {
     },
     modelValue: {
       type: [Number, String, Array],
-      default() {
-        return [];
-      },
     },
     value: {
       type: [Number, String, Array],
@@ -371,6 +368,10 @@ export default {
     },
   },
   watch: {
+    value(value) {
+      this.val = value;
+      this.setPreparedValues();
+    },
     modelValue(value) {
       this.val = value;
       this.setPreparedValues();