@dataloop-ai/components 0.19.103 → 0.19.105

package/package.json

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

package/src/components/basic/DlButton/DlButton.vue

@@ -536,6 +536,7 @@ export default defineComponent({
 .dl-button-container {
     display: inline-block;
     width: var(--dl-button-container-width);
+    height: fit-content;
 }
 
 .active-class {

package/src/components/blocks/DlLabelPicker/DlLabelPicker.vue

@@ -63,7 +63,7 @@ export default defineComponent({
             default: () => [] as PropType<DlLabelPickerItem[]>
         }
     },
-    emits: ['selectedLabel', 'click'],
+    emits: ['selected-label', 'click'],
     setup(props, { emit, slots }) {
         const { items } = toRefs(props)
 
@@ -84,7 +84,7 @@ export default defineComponent({
 
         const handleRowClick = (_: MouseEvent, item: DlLabelPickerItem) => {
             currentSelectedLabel.value = item
-            emit('selectedLabel', item)
+            emit('selected-label', item)
             emit('click', item)
         }
 

package/src/components/compound/DlDropdownButton/DlDropdownButton.vue

@@ -75,7 +75,7 @@
         <dl-menu
             ref="menuRef"
             v-model="menuModel"
-            :class="contentClass"
+            :menu-class="contentClass"
             :style="contentStyle"
             :cover="cover"
             fit-container
@@ -136,7 +136,7 @@
         <dl-menu
             ref="menuRef"
             v-model="menuModel"
-            :class="contentClass"
+            :menu-class="contentClass"
             :style="contentStyle"
             :cover="cover"
             fit-container
@@ -551,6 +551,7 @@ export default defineComponent({
 </style>
 <style lang="scss">
 .dl-button-dropdown {
+    height: fit-content;
     .dl-button-content {
         line-height: unset;
     }

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

@@ -452,6 +452,9 @@ export default defineComponent({
         const emitRowClick = (...payload: any) => {
             emit('row-click', ...payload)
         }
+        const emitRowDblclick = (...payload: any) => {
+            emit('row-dblclic', ...payload)
+        }
         const emitThClick = (payload: any) => {
             emit('th-click', payload)
         }
@@ -530,13 +533,13 @@ export default defineComponent({
                 'onUpdate:modelValue': (adding: boolean, evt: Event) => {
                     updateSelectionHierarchy(adding, evt, row)
                 },
-                onRowClick: () => {
+                onRowClick: (event: Event, row: any, index: number) => {
                     tableRootRef.value.onTrClick(event, row, index)
                 },
-                onRowDoubleClick: () => {
+                onRowDoubleClick: (event: Event, row: any, index: number) => {
                     tableRootRef.value.onTrDblClick(event, row, index)
                 },
-                onRowContextMenu: () => {
+                onRowContextMenu: (event: Event, row: any, index: number) => {
                     tableRootRef.value.onTrContextMenu(event, row, index)
                 },
                 onUpdateExpandedRow: () =>
@@ -545,13 +548,13 @@ export default defineComponent({
                     'update:modelValue': (adding: boolean, evt: Event) => {
                         updateSelectionHierarchy(adding, evt, row)
                     },
-                    rowClick: () => {
+                    rowClick: (event: Event, row: any, index: number) => {
                         tableRootRef.value.onTrClick(event, row, index)
                     },
-                    rowDoubleClick: () => {
+                    rowDoubleClick: (event: Event, row: any, index: number) => {
                         tableRootRef.value.onTrDblClick(event, row, index)
                     },
-                    rowContextMenu: () => {
+                    rowContextMenu: (event: Event, row: any, index: number) => {
                         tableRootRef.value.onTrContextMenu(event, row, index)
                     },
                     updateExpandedRow: () =>
@@ -788,6 +791,7 @@ export default defineComponent({
             updateSelected,
             emitSelectedItems,
             emitRowClick,
+            emitRowDblclick,
             emitThClick,
             hasSlotByName,
             getSlotByName,
@@ -836,11 +840,13 @@ export default defineComponent({
             noDataLabel: this.noDataLabel,
             visibleColumns: this.visibleColumns,
             onRowClick: this.emitRowClick,
+            onRowDblclick: this.emitRowDblclick,
             'onUpdate:selected': this.updateSelected,
             onColUpdate: this.updateColumns,
             class: this.containerClass,
             on: {
-                rowClick: this.emitRowClick,
+                'row-click': this.emitRowClick,
+                'row-dblclick': this.emitRowDblclick,
                 'update:selected': this.updateSelected,
                 'col-update': this.updateColumns
             },

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

@@ -24,7 +24,7 @@
             <DlIcon
                 v-if="(row.children || []).length > 0"
                 :icon="`icon-dl-${row.isExpanded ? 'down' : 'right'}-chevron`"
-                @click="emitUpdateExpandedRow"
+                @click.stop.prevent="emitUpdateExpandedRow"
             />
         </td>
         <td
@@ -168,7 +168,7 @@ export default defineComponent({
         'update:model-value',
         'updateExpandedRow'
     ],
-    setup(props, context) {
+    setup(props, { emit, slots }) {
         const visibleChildren = ref(0)
         const childrenCount = ref(0)
         const { row } = toRefs(props)
@@ -192,7 +192,7 @@ export default defineComponent({
             row: Record<string, any>,
             rowIndex: number
         ) => {
-            context.emit('rowClick', event, row, rowIndex)
+            emit('rowClick', event, row, rowIndex)
         }
 
         const onTrDoubleClick = (
@@ -200,7 +200,7 @@ export default defineComponent({
             row: DlTableRow,
             rowIndex: number
         ) => {
-            context.emit('rowDoubleClick', evt, row, rowIndex)
+            emit('rowDoubleClick', evt, row, rowIndex)
         }
 
         const onTrContextMenu = (
@@ -208,11 +208,11 @@ export default defineComponent({
             row: DlTableRow,
             rowIndex: number
         ) => {
-            context.emit('rowContextMenu', evt, row, rowIndex)
+            emit('rowContextMenu', evt, row, rowIndex)
         }
 
         const emitUpdateModelValue = (adding: boolean, evt: Event) => {
-            context.emit('update:model-value', adding, evt)
+            emit('update:model-value', adding, evt)
         }
 
         const getTdStyles = (row: any, colIndex: number) => {
@@ -224,10 +224,10 @@ export default defineComponent({
             return styles
         }
         const emitUpdateExpandedRow = () => {
-            context.emit('updateExpandedRow')
+            emit('updateExpandedRow')
         }
 
-        const hasSlotByName = (name: string) => !!context.slots[name]
+        const hasSlotByName = (name: string) => !!slots[name]
 
         const getSlotByName = (name: string) => {
             return hasSlotByName(`body-cell-${name}`)

package/src/demos/DlTableDemo.vue

@@ -1120,7 +1120,7 @@ export default defineComponent({
             this.resizable = val.length !== 0
         },
         log(...args: any[]) {
-            // console.log(...args)
+            console.log(...args)
         },
         filterMethod(
             rows: Record<string, any>[],

package/src/demos/DlTreeTableDemo.vue

@@ -690,7 +690,7 @@ export default defineComponent({
         }
 
         const onRowClick = (item: any) => {
-            // console.log('onRowClick TreeTableDemo: ', item)
+            console.log('onRowClick TreeTableDemo: ', item)
         }
 
         const reorderRows = (newRows: any[]) => {
@@ -738,6 +738,11 @@ export default defineComponent({
     },
 
     methods: {
+        addRowPerPage() {
+            this.rowsPerPageOptions.push(
+                this.rowsPerPageOptions[this.rowsPerPageOptions.length - 1] + 2
+            )
+        },
         selectedItems(payload: any) {
             console.log('Demo updateSelected: ', payload)
         },