@dataloop-ai/components 0.20.165 → 0.20.166

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dataloop-ai/components",
-  "version": "0.20.165",
+  "version": "0.20.166",
   "exports": {
     ".": "./index.ts",
     "./models": "./models.ts",

package/src/components/compound/DlTable/hooks/tableRowSelection.ts

@@ -51,14 +51,18 @@ export function useTableRowSelection(
             )
     )
 
-    const someRowsSelected = computed(
-        () =>
-            allRowsSelected.value !== true &&
-            computedRows.value.some(
-                (row) => selectedKeys.value[getRowKey.value(row)] === true
-            )
-    )
-
+    const someRowsSelected = computed(() => {
+        if (allRowsSelected.value === true) return false
+        const stack = computedRows.value.slice()
+        while (stack.length) {
+            const row = stack.pop()
+            if (selectedKeys.value[getRowKey.value(row)] === true) return true
+            if (row.children && row.children.length) {
+                stack.push(...row.children)
+            }
+        }
+        return false
+    })
     const rowsSelectedNumber = computed(() => props.selected.length)
 
     function isRowSelected(key: string) {

package/src/components/compound/DlTable/types.ts

@@ -22,6 +22,7 @@ export type DlTableProps = {
 
 export type DlTableRow = {
     [key: string]: any
+    children?: DlTableRow[]
 }
 
 export type DlTableFilter = string | Record<string, any>

package/src/components/compound/DlTreeTable/DlTreeTable.vue

@@ -513,7 +513,12 @@ export default defineComponent({
                 props.rowKey
             )
 
-            updateSelection(childrenKeys, childrenCollection, adding, event)
+            selectedData.value = updateSelection(
+                childrenKeys,
+                childrenCollection,
+                adding,
+                event
+            )
         }
         const headerSelectedValue = computed(() => {
             if (selectedData.value.length === tableRows.value.length)
@@ -538,16 +543,7 @@ export default defineComponent({
             updateSelected(value ? tableRows.value : [])
         }
         const updateSelected = (payload: DlTableRow[]) => {
-            const hasSelection = selectedData.value.length > 0
-            selectedData.value = payload
-
-            if (payload.length > 0) {
-                selectAllRows(true)
-            } else if (payload.length === 0 && hasSelection) {
-                selectAllRows(false)
-            } else {
-                emitSelectedItems(payload)
-            }
+            selectedData.value = selectAllRows(!allRowsSelected.value)
         }
         const emitSelectedItems = (payload: DlTableRow[]) => {
             emit('selected-items', payload)

package/src/components/compound/DlTreeTable/utils/treeTableRowSelection.ts

@@ -182,6 +182,7 @@ export function useTreeTableRowSelection(
         selectedItemsNested.value = selectedItems
 
         emit('selected-items', selectedItems)
+        return selectedItems
     }
 
     function isIncludedInSelectedNestedItems(
@@ -257,12 +258,13 @@ export function useTreeTableRowSelection(
         if (select) {
             const allRows = getAllRows(computedRows.value)
             const allKeys = allRows.map(getRowKey.value)
-            updateSelection(allKeys, allRows, true)
+            return updateSelection(allKeys, allRows, true)
         } else {
             clearSelection()
             selectedItemsNested.value = []
             emit('selected-items', [])
         }
+        return []
     }
 
     return {

package/src/demos/DlTreeTableDemo.vue

@@ -110,7 +110,7 @@
                     :loading="loading"
                     :rows="tableRows"
                     :resizable="resizable"
-                    row-key="name"
+                    row-key="id"
                     color="dl-color-secondary"
                     title="Table Title"
                     :virtual-scroll="vScroll"
@@ -560,7 +560,15 @@ const columns2 = [
         hint: 'test hint'
     }
 ]
-
+function markAllSelectable(list: DlTableRow[]): DlTableRow[] {
+    return list.map((r) => ({
+        ...r,
+        isSelectable: true,
+        ...(Array.isArray(r.children) && r.children.length
+            ? { children: markAllSelectable(r.children) }
+            : {})
+    }))
+}
 export default defineComponent({
     components: {
         DlSwitch,
@@ -583,7 +591,7 @@ export default defineComponent({
         const denseState = ref([])
         const virtualScroll = ref([])
         const resizableState = ref([])
-        const tableRows = ref(rows)
+        const tableRows = ref(markAllSelectable(rows))
         const tableRowsVS = ref(cloneDeep(rows))
         const draggable = ref('both')
         const tableColumns = ref(columns)