@dataloop-ai/components 0.20.184 → 0.20.186-ds-v3.0

package/src/components/compound/DlTable/DlTable.vue

@@ -161,7 +161,7 @@
                                     <div
                                         v-if="
                                             visibleColumns &&
-                                            visibleColumns.length
+                                                visibleColumns.length
                                         "
                                         class="visible-columns-justify-end"
                                         style="width: 100%; display: flex"
@@ -274,8 +274,8 @@
                                     isRowSelected(getRowKey(props.item))
                                         ? 'selected'
                                         : hasAnyAction
-                                        ? ' cursor-pointer'
-                                        : ''
+                                            ? ' cursor-pointer'
+                                            : ''
                                 "
                                 :no-hover="noHover"
                                 @click="
@@ -565,7 +565,7 @@
                                     <div
                                         v-if="
                                             visibleColumns &&
-                                            visibleColumns.length
+                                                visibleColumns.length
                                         "
                                         class="visible-columns-justify-end"
                                         style="width: 100%; display: flex"
@@ -674,8 +674,8 @@
                             <dl-top-scroll
                                 v-if="
                                     tableScroll &&
-                                    infiniteScroll &&
-                                    !isDataEmpty
+                                        infiniteScroll &&
+                                        !isDataEmpty
                                 "
                                 :container-ref="tableScroll"
                                 @scroll-to-top="
@@ -709,8 +709,8 @@
                                         isRowSelected(getRowKey(row))
                                             ? 'selected'
                                             : hasAnyAction
-                                            ? ' cursor-pointer'
-                                            : ''
+                                                ? ' cursor-pointer'
+                                                : ''
                                     "
                                     :no-hover="noHover"
                                     @click="onTrClick($event, row, pageIndex)"
@@ -845,8 +845,8 @@
                             <dl-bottom-scroll
                                 v-if="
                                     tableScroll &&
-                                    infiniteScroll &&
-                                    !isDataEmpty
+                                        infiniteScroll &&
+                                        !isDataEmpty
                                 "
                                 :container-ref="tableScroll"
                                 @scroll-to-bottom="
@@ -903,7 +903,7 @@
                     <div
                         v-if="
                             hasBottomSelectionBanner &&
-                            selectedRowsLabel(rowsSelectedNumber)
+                                selectedRowsLabel(rowsSelectedNumber)
                         "
                         class="dl-table__control"
                     >
@@ -1762,7 +1762,8 @@ export default defineComponent({
 
         const colspanForProgressBar = computed(() => {
             return (
-                colspanWithExpandableRow.value - (hasDraggableRows.value ? 0 : 1)
+                colspanWithExpandableRow.value -
+                (hasDraggableRows.value ? 0 : 1)
             )
         })
 

package/src/components/compound/DlTable/hooks/use-sortable.ts

@@ -100,12 +100,11 @@ export function useSortable(vm: Record<string, any>) {
     })
 
     watch(rootRef, (newRootRef) => {
-
         if (sortable.value) {
             sortable.value.destroy()
             sortable.value = null
         }
-        
+
         if (newRootRef) {
             sortable.value = new Sortable(newRootRef, {
                 ...props.options,

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

@@ -804,7 +804,9 @@ export default defineComponent({
                 targetRow: finalTarget
             })
 
-            const isDragValid = shouldSkipValidation || checkParentCondition(draggedRow.value, finalTarget)
+            const isDragValid =
+                shouldSkipValidation ||
+                checkParentCondition(draggedRow.value, finalTarget)
             if (isDragValid) {
                 const smartSortingMovement = {
                     ...sortingMovement.value,
@@ -929,7 +931,7 @@ export default defineComponent({
             }
 
             const isValid = checkParentCondition(draggedRow.value, targetRow)
-            
+
             if (isValid) {
                 storedValidTarget.value = targetRow
             }

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

@@ -16,7 +16,7 @@
             }`"
         >
             <dl-icon
-               v-if="hasDraggableRows && !row.disableDraggable"
+                v-if="hasDraggableRows && !row.disableDraggable"
                 class="draggable-icon"
                 icon="icon-dl-drag"
                 size="12px"

package/src/components/essential/DlSwitch/DlSwitch.vue

@@ -7,12 +7,14 @@
         }`"
     >
         <label
-            v-if="!!leftLabel"
+            v-if="hasLeftLabel"
             class="left dl-switch-label"
             :for="computedId"
             :style="cssLabelVars"
         >
-            {{ leftLabel }}
+            <slot name="left-label">
+                {{ leftLabel }}
+            </slot>
         </label>
         <span
             class="dl-switch-container"
@@ -35,12 +37,14 @@
             />
         </span>
         <label
-            v-if="!!rightLabel"
+            v-if="hasRightLabel"
             class="right dl-switch-label"
             :for="computedId"
             :style="cssLabelVars"
         >
-            {{ rightLabel }}
+            <slot name="right-label">
+                {{ rightLabel }}
+            </slot>
         </label>
     </div>
 </template>
@@ -143,6 +147,12 @@ export default defineComponent({
                 ? this.index === -1
                 : toRaw(this.modelValue) === toRaw(this.falseValue)
         },
+        hasLeftLabel(): boolean {
+            return !!this.leftLabel || !!this.$slots['left-label']
+        },
+        hasRightLabel(): boolean {
+            return !!this.rightLabel || !!this.$slots['right-label']
+        },
         cssVars(): Record<string, string> {
             return {
                 '--dl-checkbox-height': `${this.size}px`,

package/src/components/shared/DlVirtualScroll/DlVirtualScroll.vue

@@ -124,7 +124,9 @@ export default defineComponent({
 
         let localScrollTarget: HTMLElement | undefined
         const rootRef: Ref<HTMLElement | null> = ref(null)
-        const scrollSizeItem: Ref<number> = ref(40)
+        const scrollSizeItem: Ref<number> = ref(
+            virtualScrollItemSize.value || 40
+        )
 
         const isDefined = (v: any) => v !== undefined && v !== null
 

package/src/demos/DlDateTimeRangeDemo.vue

@@ -176,6 +176,26 @@
                 @change="handleModelValueUpdate"
             />
         </div>
+        <div style="width: 500px; margin-top: 30px">
+            <div style="margin-bottom: 10px; font-weight: bold">
+                Inline Mode
+            </div>
+            <dl-date-time-range
+                v-model="date"
+                :type="type"
+                width="100%"
+                :available-range="range ? availableRange : null"
+                :mode="mode"
+                :show-time="showTime"
+                :auto-close="autoClose"
+                :including-current-month="includesCurrentMonthEnd"
+                :should-clear-select-first-option="shouldClearSelectFirstOption"
+                :disabled-type="type === 'day' ? 'month' : 'day'"
+                view-mode="inline"
+                @set-type="handleSetType"
+                @change="handleModelValueUpdate"
+            />
+        </div>
     </div>
 </template>
 <script lang="ts">

package/src/demos/SmartSearchDemo/DlSmartSearchDemo.vue

@@ -42,6 +42,7 @@
 
         <dl-smart-search-input
             v-model="queryObject"
+            no-tooltip
             :aliases="aliases"
             :schema="schema"
             :color-schema="colorSchema"