edvoyui-component-library-test-flight 0.0.37 → 0.0.38

package/dist/table/EUIDashboardTable.vue.d.ts

@@ -1,5 +1,5 @@
 export * from "/Volumes/work/repos/edvoy-ui-v2/src/components/table/EUIDashboardTable.vue?vue&type=script&setup=true&lang.ts";
-import "/Volumes/work/repos/edvoy-ui-v2/src/components/table/EUIDashboardTable.vue?vue&type=style&index=0&scoped=853762cf&lang.scss";
+import "/Volumes/work/repos/edvoy-ui-v2/src/components/table/EUIDashboardTable.vue?vue&type=style&index=0&scoped=0768fd93&lang.scss";
 declare const _default: any;
 export default _default;
 //# sourceMappingURL=EUIDashboardTable.vue.d.ts.map

package/dist/table/EUITable.vue.d.ts

@@ -1,5 +1,5 @@
 export * from "/Volumes/work/repos/edvoy-ui-v2/src/components/table/EUITable.vue?vue&type=script&setup=true&lang.ts";
-import "/Volumes/work/repos/edvoy-ui-v2/src/components/table/EUITable.vue?vue&type=style&index=0&scoped=fc4a1467&lang.scss";
+import "/Volumes/work/repos/edvoy-ui-v2/src/components/table/EUITable.vue?vue&type=style&index=0&scoped=fd223767&lang.scss";
 declare const _default: any;
 export default _default;
 //# sourceMappingURL=EUITable.vue.d.ts.map

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "edvoyui-component-library-test-flight",
   "private": false,
-  "version": "0.0.37",
+  "version": "0.0.38",
   "type": "module",
   "files": [
     "dist/",

package/src/components/table/EUIDashboardTable.vue

@@ -88,9 +88,7 @@
                     <EUITableCheckbox
                       :disabled="!isRowCheckable(row)"
                       :checked="isRowChecked(row)"
-                      @change.prevent.stop="
-                        ($event) => checkRow(row, rowIndex, $event)
-                      "
+                      @change="($event:boolean) => checkRow(row, rowIndex, $event)"
                     />
                   </td>
                 </template>
@@ -241,7 +239,6 @@ const currentSort = ref(defaultSort.value);
 const currentSortDir = ref(defaultSortDirection.value);
 const newCheckedRows = ref([...checkedRows.value]);
 const newCurrentPage = ref(currentPage.value);
-const lastCheckedRowIndex = ref();
 const limit = ref(props.perPage);
 const loading = computed(() => props.tableLoading);
 
@@ -388,29 +385,13 @@ const checkAll = () => {
   emit("update:checkedRows", newCheckedRows.value);
 };
 
-const removeCheckedRow = (row: any) => {
-  const index = indexOf(newCheckedRows.value, row, customIsChecked.value);
-  if (index >= 0) {
-    newCheckedRows.value.splice(index, 1);
-  }
-};
-
 const isRowChecked = (row: any) => {
   return indexOf(newCheckedRows.value, row, customIsChecked.value) >= 0;
 };
 
-const checkRow = (row: any, rowIndex: number, event: Event) => {
+const checkRow = (row: any, rowIndex: number, event:boolean) => {
   if (!isRowCheckable.value(row)) return;
-  if (event) {
-    lastCheckedRowIndex.value = rowIndex;
-    if (!isRowChecked(row)) {
-      newCheckedRows.value.push(row);
-    } else {
-      removeCheckedRow(row);
-    }
-    emit("check", newCheckedRows.value, row);
-    emit("update:checkedRows", newCheckedRows.value);
-  }
+    console.log('@event',row, rowIndex, event)
 };
 
 // watch

package/src/components/table/EUITable.vue

@@ -108,7 +108,7 @@
                     <EUITableCheckbox
                       :disabled="!isRowCheckable(row)"
                       :checked="isRowChecked(row)"
-                      @change.prevent.stop="($event) => checkRow(row, rowIndex, $event)"
+                      @change="($event:boolean) => checkRow(row, rowIndex, $event)"
                     />
                   </td>
                 </template>
@@ -248,7 +248,6 @@ const currentSort = ref(defaultSort.value);
 const currentSortDir = ref(defaultSortDirection.value);
 const newCheckedRows = ref([...checkedRows.value]);
 const newCurrentPage = ref(currentPage.value);
-const lastCheckedRowIndex = ref();
 const limit = ref(props.perPage);
 const loading = computed(() => props.tableLoading);
 
@@ -393,29 +392,13 @@ const checkAll = () => {
   emit("update:checkedRows", newCheckedRows.value);
 };
 
-const removeCheckedRow = (row:any) => {
-  const index = indexOf(newCheckedRows.value, row, customIsChecked.value);
-  if (index >= 0) {
-    newCheckedRows.value.splice(index, 1);
-  }
-};
-
 const isRowChecked = (row:any) => {
   return indexOf(newCheckedRows.value, row, customIsChecked.value) >= 0;
 };
 
-const checkRow = (row: any, rowIndex: number, event: Event) => {
+const checkRow = (row: any, rowIndex: number, event:boolean) => {
   if (!isRowCheckable.value(row)) return;
-    if(event) {
-      lastCheckedRowIndex.value = rowIndex;
-    if (!isRowChecked(row)) {
-      newCheckedRows.value.push(row);
-    } else {
-      removeCheckedRow(row);
-    }
-    emit("check", newCheckedRows.value, row);
-    emit("update:checkedRows", newCheckedRows.value);
-  }
+    console.log('@event',row, rowIndex, event)
 };
 
 // watch

package/src/components/table/EUITableCheckbox.vue

@@ -1,6 +1,6 @@
 <template>
   <label class="table-checkbox">
-    <input v-model="selected" type="checkbox" :value="value" v-bind="mergedAttrs" />
+    <input v-model="isChecked" type="checkbox" :value="value" v-bind="mergedAttrs" @change="toggle($event)" />
     <span class="check-icon">
       <svg
         xmlns="http://www.w3.org/2000/svg"
@@ -33,51 +33,28 @@ const props = defineProps({
     default: null
   }
 })
+const emit = defineEmits(['update:checked','change']);
+const attrs = useAttrs();
 
-const emit = defineEmits(['change'])
-const isIndeterminate = ref(props.indeterminate)
-
-watch(() => props.indeterminate, (val) => {
-  isIndeterminate.value = val
-})
-
-const selected = computed({
-  get() {
-    return props.checked
-  },
-  set(val) {
-    emit('change', val)
-  }
-})
-
-const isActive = computed(() => {
-  const modelIsArray = Array.isArray(props.checked) && props.checked.length !== 0
-
-  const sameValue = (element: any) => element === props.value
-
-  if (modelIsArray) {
-    return props.checked.some(sameValue)
-  }
-
-  return props.checked === true
-})
-
-const attrs = useAttrs()
-const computedTabIndex = computed(() => (attrs.disabled ? -1 : 0))
-
+const isChecked = ref<boolean>(props.checked);
 const mergedAttrs = computed(() => ({
   ...attrs,
-  tabindex: computedTabIndex.value,
+  tabindex: attrs.disabled ? -1 : 0,
   role: 'checkbox',
-  // 'aria-checked': isIndeterminate.value ? 'mixed' : isActive.value.toString(),
-  // 'aria-disabled': attrs.disabled,
-}))
+}));
+watch(
+  () => props.checked,
+  (newValue) => {
+    isChecked.value = newValue;
+  }
+);
 
-watch(isActive, () => {
-  if (props.indeterminate) {
-    isIndeterminate.value = false
+const toggle = ($event: Event) => {
+  if($event) {
+    emit('update:checked', isChecked.value);
+    emit('change', isChecked.value)
   }
-})
+};
 </script>
 
 <style lang="scss">