@dataloop-ai/components 0.20.183 → 0.20.185

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dataloop-ai/components",
3
- "version": "0.20.183",
3
+ "version": "0.20.185",
4
4
  "exports": {
5
5
  ".": "./index.ts",
6
6
  "./models": "./models.ts",
@@ -178,10 +178,20 @@ export default defineComponent({
178
178
  return !!parentClassList?.contains('content')
179
179
  },
180
180
  hasHeader(): boolean {
181
- return !!this.$slots.header && !this.hideHeader
181
+ const slotKeys = Object.keys(this.$slots)
182
+ return (
183
+ !this.hideHeader &&
184
+ slotKeys.includes('header') &&
185
+ !!this.$slots.header
186
+ )
182
187
  },
183
188
  hasFooter(): boolean {
184
- return !!this.$slots.footer && !this.hideFooter
189
+ const slotKeys = Object.keys(this.$slots)
190
+ return (
191
+ !this.hideFooter &&
192
+ slotKeys.includes('footer') &&
193
+ !!this.$slots.footer
194
+ )
185
195
  }
186
196
  },
187
197
  watch: {
@@ -66,6 +66,11 @@
66
66
  style="width: 25px"
67
67
  @mousedown="stopAndPrevent"
68
68
  />
69
+ <th
70
+ v-if="hasDraggableRows && !isTreeTable"
71
+ class="dl-table--col-auto-width dl-table__drag-icon"
72
+ style="width: 25px"
73
+ />
69
74
  <th
70
75
  v-if="singleSelection"
71
76
  class="dl-table--col-auto-width dl-table--col-checkbox-wrapper"
@@ -296,7 +301,7 @@
296
301
  "
297
302
  >
298
303
  <td
299
- v-if="hasDraggableRows"
304
+ v-if="hasDraggableRows && !isTreeTable"
300
305
  class="dl-table__drag-icon"
301
306
  >
302
307
  <dl-icon
@@ -463,6 +468,11 @@
463
468
  style="width: 25px"
464
469
  @mousedown="stopAndPrevent"
465
470
  />
471
+ <th
472
+ v-if="hasDraggableRows && !isTreeTable"
473
+ class="dl-table--col-auto-width dl-table__drag-icon"
474
+ style="width: 25px"
475
+ />
466
476
  <th
467
477
  v-if="singleSelection"
468
478
  class="dl-table--col-auto-width dl-table--col-checkbox-wrapper"
@@ -655,11 +665,9 @@
655
665
  tag="tbody"
656
666
  class="nested-table dl-virtual-scroll__content"
657
667
  style="position: relative; z-index: 90"
658
- v-bind="{
659
- onEnd: handleSortableEvent
660
- }"
661
668
  :is-sortable="hasDraggableRows"
662
669
  :options="sortableOptions"
670
+ @end="handleSortableEvent"
663
671
  >
664
672
  <slot name="top-row" :cols="computedCols" />
665
673
  <slot name="table-body" :computed-rows="computedRows">
@@ -714,7 +722,7 @@
714
722
  "
715
723
  >
716
724
  <td
717
- v-if="hasDraggableRows"
725
+ v-if="hasDraggableRows && !isTreeTable"
718
726
  style="width: 25px"
719
727
  class="dl-table__drag-icon"
720
728
  >
@@ -1329,6 +1337,7 @@ export default defineComponent({
1329
1337
  const virtScrollRef = ref(null)
1330
1338
  const tableScroll = ref(null)
1331
1339
  const isVisibleColumnsOpen = ref(false)
1340
+ const tableUuid = `dl-table-${v4()}`
1332
1341
 
1333
1342
  const hasExpandableSlot = computed(() =>
1334
1343
  hasSlotByName('body-cell-expandable-content')
@@ -2031,8 +2040,10 @@ export default defineComponent({
2031
2040
  const handleSortableEvent = (event: SortableEvent) => {
2032
2041
  const { oldIndex, newIndex } = event
2033
2042
  const newRows = insertAtIndex(rows.value, oldIndex, newIndex)
2034
- tbodyKey.value = v4()
2035
2043
  emit('row-reorder', newRows)
2044
+ nextTick(() => {
2045
+ tbodyKey.value = v4()
2046
+ })
2036
2047
  }
2037
2048
 
2038
2049
  const reorderColumns = (sourceIndex: number, targetIndex: number) => {
@@ -2077,11 +2088,12 @@ export default defineComponent({
2077
2088
  })
2078
2089
 
2079
2090
  const sortableOptions: any = {
2080
- group: 'nested',
2091
+ group: props.isTreeTable ? 'nested' : tableUuid,
2081
2092
  animation: 150,
2082
2093
  fallbackOnBody: true,
2083
2094
  invertSwap: true,
2084
- swapThreshold: 0.5
2095
+ swapThreshold: 0.5,
2096
+ handle: '.draggable-icon'
2085
2097
  }
2086
2098
 
2087
2099
  const virtualScrollClasses = computed(() => {
@@ -2137,7 +2149,7 @@ export default defineComponent({
2137
2149
  handleSortableEvent,
2138
2150
  tbodyKey,
2139
2151
  tableKey,
2140
- uuid: `dl-table-${v4()}`,
2152
+ uuid: tableUuid,
2141
2153
  rootRef,
2142
2154
  containerClass,
2143
2155
  computedRows,
@@ -100,6 +100,12 @@ export function useSortable(vm: Record<string, any>) {
100
100
  })
101
101
 
102
102
  watch(rootRef, (newRootRef) => {
103
+
104
+ if (sortable.value) {
105
+ sortable.value.destroy()
106
+ sortable.value = null
107
+ }
108
+
103
109
  if (newRootRef) {
104
110
  sortable.value = new Sortable(newRootRef, {
105
111
  ...props.options,