@dataloop-ai/components 0.18.142 → 0.18.144

package/package.json

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

package/src/components/basic/DlPanelContainer/DlPanelContainer.vue

@@ -216,7 +216,7 @@ export default defineComponent({
             }
         },
         contentStyle(): Record<string, any> {
-            return {
+            const styles: Record<string, any> = {
                 'padding-top':
                     this.hasHeader && this.headerHeight
                         ? this.headerHeight
@@ -226,6 +226,15 @@ export default defineComponent({
                         ? this.footerHeight
                         : 0 + 'px'
             }
+
+            if (this.isEmpty) {
+                styles['display'] = 'flex'
+                styles['justify-content'] = 'center'
+                styles['height'] = '100%'
+                styles['max-height'] = '100%'
+            }
+
+            return styles
         },
         position(): 'left' | 'right' {
             return this.direction === 'right' ? 'left' : 'right'

package/src/components/compound/DlDateTime/DlDatePicker/DlDatePicker.vue

@@ -196,7 +196,11 @@ export default defineComponent({
             if (this.disabled) return
             const valueToUse = value
             if (value && moment(value.from).isSame(value.to)) {
-                valueToUse.to = moment(value.from).endOf('day').toDate()
+                if (this.type === 'day')
+                    valueToUse.to = moment(value.from).endOf('day').toDate()
+                else {
+                    valueToUse.to = moment(value.from).endOf('month').toDate()
+                }
             }
             this.$emit('update:model-value', valueToUse)
             this.$emit('change', valueToUse)

package/src/components/compound/DlDateTime/DlDateTimeRange/DlDateTimeRange.vue

@@ -225,17 +225,17 @@ export default defineComponent({
             const lastMonth = CustomDate.subtract(1, 'months')
                 .startOf('month')
                 .toDate()
-
+            const today = CustomDate.endOf('day').toDate()
             return [
                 {
                     title: 'this month',
                     key: MONTH_SIDEBAR_OPTION.this_month,
-                    value: { from: thisMonth, to: thisMonth }
+                    value: { from: thisMonth, to: today }
                 },
                 {
                     title: 'last month',
                     key: MONTH_SIDEBAR_OPTION.last_month,
-                    value: { from: lastMonth, to: lastMonth }
+                    value: { from: lastMonth, to: thisMonth }
                 },
                 {
                     title: 'last 3 months',
@@ -469,9 +469,10 @@ export default defineComponent({
 
             if (option.key === DAY_SIDEBAR_OPTION.custom_by_month) {
                 this.handleTypeChange('month')
+                this.updateDateInterval(option.value)
+            } else {
+                this.updateDateIntervalWithAutoClose(option.value)
             }
-
-            this.updateDateInterval(option.value)
         },
         handleMonthTypeOptionClick(option: MonthTypeOption) {
             this.currentSidebarOption = option.key as MONTH_SIDEBAR_OPTION
@@ -483,9 +484,10 @@ export default defineComponent({
 
             if (option.key === MONTH_SIDEBAR_OPTION.custom_by_day) {
                 this.handleTypeChange('day')
+                this.updateDateInterval(option.value)
+            } else {
+                this.updateDateIntervalWithAutoClose(option.value)
             }
-
-            this.updateDateInterval(option.value)
         }
     }
 })

package/src/demos/DlPanelContainerDemo.vue

@@ -1,5 +1,31 @@
 <template>
     <div style="width: 700px">
+        <div style="height: 1000px">
+            <dl-panel-container
+                v-model="collapseP1"
+                :direction="direction"
+                :resizable="resizable"
+                :collapsable="collapsable"
+                width="500px"
+                style="height: 100%"
+            >
+                <dl-panel
+                    resizable
+                    collapsable
+                >
+                    <div>
+                        <h3>RESIZABLE & COLLAPSABLE</h3>
+                        <p>
+                            Lorem ipsum dolor sit amet consectetur adipisicing
+                            elit. Excepturi, rerum harum aut sunt recusandae
+                            obcaecati necessitatibus. Alias nulla aliquid,
+                            dolorem qui, nesciunt hic iste ratione voluptates
+                            magni optio quae. Vero!
+                        </p>
+                    </div>
+                </dl-panel>
+            </dl-panel-container>
+        </div>
         <div class="dl-panel-container-demo">
             <dl-panel-container
                 v-model="collapseP1"