@avakhula/ui 0.0.161 → 0.0.163

package/package.json

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

package/src/App.vue

@@ -1,41 +1,33 @@
 <template>
-  <form action="">
-
-    <ib-form-group class="form-group">
-      <ib-label for="email" required>
-        Email address
-      </ib-label>
-
-      <ib-input required autofocus type="email" id="email" name="email" ref="email" :disabled="disabled"
-        placeholder="Enter your email address" />
-    </ib-form-group>
-
-    <ib-form-group class="form-group">
-      <ib-label for="password" required>
-        Password
-      </ib-label>
-
-      <ib-input required autofocus type="password" id="password" name="password" :disabled="disabled" />
-    </ib-form-group>
-  </form>
-
-  <button type="button" @click="() => disabled = !disabled">Disbaled</button>
+  <ib-select is-toggle :options="roles" @input="changeRole" :value="roles.map(role => role.id)">
+
+    <template v-slot:trigger="{ selectedCount }">
+      <ib-button kind="tertiary">
+        Org Role ({{ roles.length - selectedCount }} hidden)
+        <ib-icon style="paddingLeft: 5px" name="chevron-down-outline"></ib-icon>
+      </ib-button>
+    </template>
+  </ib-select>
 </template>
 
 <script>
-import IbInput from "./components/Form/Input/Input.vue"
-import IbLabel from "./components/Form/Label/Label.vue"
-import IbFormGroup from "./components/Form/FormGroup/FormGroup.vue"
-
-
+import IbSelect from "./components/TreeSelect/Select.vue"
 export default {
   data() {
     return {
-      disabled: false,
+      roles: [{ "id": 1, "title": "ALL Access", "checked": true, "initiallyVisible": true, "visible": true, "isDisabled": false }, { "id": 2, "title": "Manager", "checked": true, "initiallyVisible": true, "visible": true, "isDisabled": false }, { "id": 3, "title": "Department Chair", "checked": true, "initiallyVisible": true, "visible": true, "isDisabled": false }, { "id": 4, "title": "test role", "checked": true, "initiallyVisible": true, "visible": true, "isDisabled": false }]
+    }
+  },
+  methods: {
+    changeRole(a) {
+      setTimeout(() => {
+        console.log(a)
+
+      })
     }
   },
   components: {
-    IbInput, IbLabel, IbFormGroup
+    IbSelect
   }
 }
 </script>

package/src/components/Form/Input/Input.vue

@@ -241,7 +241,7 @@ export default {
       this.actualValue = newVal;
     },
     disabled(val) {
-      this.$globalEvents.$emit(`label:disabled:${this.id}`, val);
+      // this.$globalEvents.$emit(`label:disabled:${this.id}`, val);
     },
   },
   emits: [
@@ -249,7 +249,7 @@ export default {
     "blur",
     "focus",
     "update:modelValue",
-    `label:disabled:${this.id}`,
+    // `label:disabled:${this.id}`,
   ],
   components: {
     IbAlert,

package/src/components/TreeSelect/Select.vue

@@ -769,8 +769,9 @@ export default {
             !(this.onlyEndNodes && option.children && option.children.length)
           ) {
             this.selected[option.id] = option;
-            this.$emit("input", Object.keys(this.selected));
             this.$emit("update:modelValue", Object.keys(this.selected));
+            this.$emit("input", Object.keys(this.selected));
+            console.log('test 1');
           }
         } else {
           const selectedOptionKey = Object.keys(this.selected)[0];
@@ -785,8 +786,9 @@ export default {
       } else {
         delete this.selected[option.id];
         option.checked = false;
-        this.$emit("input", Object.keys(this.selected));
         this.$emit("update:modelValue", Object.keys(this.selected));
+        this.$emit("input", Object.keys(this.selected));
+        console.log('test 2');
       }
 
       this.toggleDuplicateOptions(this.actualOptions, option.id, isChecked);