@dataloop-ai/components 0.20.99 → 0.20.101

package/package.json

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

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

@@ -1,8 +1,5 @@
 <template>
-    <div
-        :id="uuid"
-        class="dl-date-time-range"
-    >
+    <div :id="uuid" class="dl-date-time-range">
         <date-input
             :text="dateInputText"
             :input-style="dateInputStyle"
@@ -136,6 +133,14 @@ export default defineComponent({
         width: {
             type: String,
             default: 'fit-content'
+        },
+        disabledType: {
+            type: String,
+            default: null
+        },
+        skipAvailableRangeIntervalUpdate: {
+            type: Boolean,
+            default: false
         }
     },
     emits: ['update:model-value', 'set-type', 'change'],
@@ -147,10 +152,14 @@ export default defineComponent({
         isInputDisabled: boolean
         currentSidebarOption: DAY_SIDEBAR_OPTION | MONTH_SIDEBAR_OPTION
     } {
+        let type: 'day' | 'month' = this.type
+        if (this.disabledType === this.type) {
+            type = this.type === 'day' ? 'month' : 'day'
+        }
         return {
             uuid: `dl-date-time-range-${v4()}`,
             dateInterval: this.modelValue,
-            typeState: this.type,
+            typeState: type,
             isOpen: false,
             isInputDisabled: false,
             currentSidebarOption: DAY_SIDEBAR_OPTION.custom
@@ -221,7 +230,8 @@ export default defineComponent({
                         to: new CalendarDate(this.dateInterval.from)
                             .startOf('month')
                             .toDate()
-                    }
+                    },
+                    disabled: this.disabledType === 'month'
                 }
             ]
         },
@@ -285,7 +295,8 @@ export default defineComponent({
                         to: new CalendarDate(this.dateInterval.from)
                             .startOf('day')
                             .toDate()
-                    }
+                    },
+                    disabled: this.disabledType === 'day'
                 },
                 { title: 'custom by month', key: MONTH_SIDEBAR_OPTION.custom }
             ]
@@ -293,13 +304,13 @@ export default defineComponent({
         sidebarDayOptions(): DayTypeOption[] {
             return this.dayTypeOptions.map((o) => ({
                 ...o,
-                disabled: !isInRange(this.availableRange, o.value)
+                disabled: !isInRange(this.availableRange, o.value) || o.disabled
             }))
         },
         sidebarMonthOptions(): MonthTypeOption[] {
             return this.monthTypeOptions.map((o) => ({
                 ...o,
-                disabled: !isInRange(this.availableRange, o.value)
+                disabled: !isInRange(this.availableRange, o.value) || o.disabled
             }))
         },
         dateInputStyle(): Record<string, any> {
@@ -396,6 +407,7 @@ export default defineComponent({
     },
     watch: {
         type(value: 'day' | 'month') {
+            if (value === this.disabledType) return
             this.typeState = value
 
             if (this.dateInterval === null) return
@@ -421,8 +433,23 @@ export default defineComponent({
                     this.typeState === 'day'
                         ? DAY_SIDEBAR_OPTION.custom
                         : MONTH_SIDEBAR_OPTION.custom
-
-                this.updateDateInterval(null)
+                if (this.dateInterval) {
+                    if (
+                        isInRange(
+                            this.availableRange,
+                            new CustomDate(this.dateInterval.from)
+                        ) &&
+                        isInRange(
+                            this.availableRange,
+                            new CustomDate(this.dateInterval.to)
+                        )
+                    ) {
+                        return
+                    }
+                }
+                if (!this.skipAvailableRangeIntervalUpdate) {
+                    this.updateDateInterval(null)
+                }
             },
             deep: true
         },

package/src/components/compound/DlSearches/DlSmartSearch/components/DlSmartSearchInput.vue

@@ -246,7 +246,7 @@ export default defineComponent({
             default: () => [] as string[]
         },
         operatorsOverride: {
-            type: Object as PropType<{[name: string]: string[]}>,
+            type: Object as PropType<{ [name: string]: string[] }>,
             default: () => ({})
         },
         forbiddenKeys: {
@@ -335,28 +335,7 @@ export default defineComponent({
 
             showSuggestions.value = false
 
-            // to handle typing . or , after accepting a suggestion
-            const dotOrCommaRegEx = /\s+([\.|\,]\s?)$/
-            const dotOrCommaMatch = value.match(dotOrCommaRegEx)
-            if (dotOrCommaMatch) {
-                value = value.replace(dotOrCommaRegEx, dotOrCommaMatch[1])
-            }
-
-            // to handle date suggestion modal to open automatically.
-            if (value.includes(dateSuggestionPattern)) {
-                value = value.trimEnd()
-            }
-
-            const specialSuggestions = suggestions.value.filter(
-                (suggestion) =>
-                    typeof suggestion === 'string' && suggestion.startsWith('.')
-            )
-
-            for (const suggestion of specialSuggestions) {
-                if (value.includes(suggestion)) {
-                    value = value.replace(` ${suggestion}`, suggestion)
-                }
-            }
+            value = _normalizeInputValue(value)
 
             searchQuery.value = value
 
@@ -408,6 +387,43 @@ export default defineComponent({
             }
         }
 
+        const _normalizeInputValue = (value: string): string => {
+            // Normalize logical operators (' and ' -> ' AND ', ' or ' -> ' OR ')
+            const logicalOperatorsRegEx = /\s(and|or)\s/g
+            const logicalMatch = value.match(logicalOperatorsRegEx)
+            if (logicalMatch) {
+                value = value.replace(
+                    logicalOperatorsRegEx,
+                    (_, match) => ` ${match.toUpperCase()} `
+                )
+            }
+
+            // Handle typing '.' or ',' after accepting a suggestion
+            const dotOrCommaRegEx = /\s+([.,]\s?)$/
+            const dotOrCommaMatch = value.match(dotOrCommaRegEx)
+            if (dotOrCommaMatch) {
+                value = value.replace(dotOrCommaRegEx, dotOrCommaMatch[1])
+            }
+
+            // Handle date suggestion modal to open automatically.
+            if (value.includes(dateSuggestionPattern)) {
+                value = value.trimEnd()
+            }
+
+            // Handle special suggestions (suggestions that start with '.')
+            const specialSuggestions = suggestions.value.filter(
+                (suggestion) =>
+                    typeof suggestion === 'string' && suggestion.startsWith('.')
+            )
+            for (const suggestion of specialSuggestions) {
+                if (value.includes(suggestion)) {
+                    value = value.replace(` ${suggestion}`, suggestion)
+                }
+            }
+
+            return value
+        }
+
         const setInputFromSuggestion = (suggestion: any) => {
             const value = '' + suggestion
             let stringValue = ''
@@ -639,18 +655,7 @@ export default defineComponent({
         }
 
         const endsWithOperator = computed(() => {
-            const operators = [
-                '>=',
-                '<=',
-                '!=',
-                '=',
-                '>',
-                '<',
-                'IN',
-                'NOT-IN',
-                'EXISTS',
-                'DOESNT-EXIST'
-            ]
+            const operators = ['>=', '<=', '!=', '=', '>', '<', 'IN', 'NOT-IN']
 
             for (const op of operators) {
                 if (
@@ -689,7 +694,9 @@ export default defineComponent({
         const onPaste = (e: ClipboardEvent) => {
             const selection = window.getSelection()
             if (selection.rangeCount) {
-                let text = (e.clipboardData || (window as any).clipboardData).getData('text')
+                let text = (
+                    e.clipboardData || (window as any).clipboardData
+                ).getData('text')
                 if (text?.length > 0) {
                     const range = selection.getRangeAt(0)
 
@@ -701,19 +708,27 @@ export default defineComponent({
 
                     const stringOperators = getStringOperators()
                     if (
-                        new RegExp(`(,|\\s(${stringOperators.join('|')}))\\s*$`).test(preceedingText) &&
+                        new RegExp(
+                            `(,|\\s(${stringOperators.join('|')}))\\s*$`
+                        ).test(preceedingText) &&
                         !/^\s*['"]/.test(text) &&
                         isNaN(Number(text)) &&
-                        text !== "false" &&
-                        text !== "true"
+                        text !== 'false' &&
+                        text !== 'true'
                     ) {
                         text = enquoteString(text)
                     }
 
                     selection.deleteFromDocument()
-                    selection.getRangeAt(0).insertNode(document.createTextNode(
-                        (preceedingText.endsWith(' ') ? '' : ' ') + text + ' '
-                    ))
+                    selection
+                        .getRangeAt(0)
+                        .insertNode(
+                            document.createTextNode(
+                                (preceedingText.endsWith(' ') ? '' : ' ') +
+                                    text +
+                                    ' '
+                            )
+                        )
                     selection.collapseToEnd()
 
                     e.preventDefault()
@@ -893,7 +908,11 @@ export default defineComponent({
 
         //#region computed
         const editorStyle = computed((): SyntaxColorSchema => {
-            return createColorSchema(colorSchema.value, aliases.value, schema.value)
+            return createColorSchema(
+                colorSchema.value,
+                aliases.value,
+                schema.value
+            )
         })
 
         const defaultIcon = 'icon-dl-stars'