@dataloop-ai/components 0.19.133 → 0.19.135

package/package.json

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

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

@@ -281,6 +281,11 @@ export default defineComponent({
 
             showSuggestions.value = false
 
+            // to handle typing . after accepting a suggestion
+            if (/\s+\.$/.test(value)) {
+                value = value.replace(/\s+\.$/, '.')
+            }
+
             // to handle date suggestion modal to open automatically.
             if (value.includes('(dd/mm/yyyy)')) {
                 value = value.trimEnd()
@@ -316,6 +321,7 @@ export default defineComponent({
             }
 
             updateEditor(input.value, editorStyle.value)
+            setSelectionOffset(input.value, caretAt.value, caretAt.value)
             setMenuOffset(isEligibleToChange(input.value, expanded.value))
 
             if (!expanded.value) {
@@ -365,7 +371,12 @@ export default defineComponent({
                     queryRightSide = leftover + queryRightSide
                 } else if (value.startsWith('.')) {
                     // dot notation case
-                    queryLeftSide = queryLeftSide.trimEnd().replace(/\.$/, '')
+                    const words = queryLeftSide.trimEnd().split('.')
+                    const lastWord = words.pop()
+                    if (!value.startsWith('.' + lastWord)) {
+                        words.push(lastWord)
+                    }
+                    queryLeftSide = words.join('.')
                 } else if (queryLeftSide.endsWith(' ')) {
                     // caret after space: only replace multiple spaces on the left
                     queryLeftSide = queryLeftSide.trimEnd() + ' '
@@ -547,7 +558,11 @@ export default defineComponent({
 
         const onInput = (e: Event) => {
             const text = (e.target as HTMLElement).textContent
-            debouncedSetInputValue(text)
+            if (text.endsWith('.')) {
+                setInputValue(text)
+            } else {
+                debouncedSetInputValue(text)
+            }
         }
 
         const onDateSelection = (value: DateInterval) => {

package/src/hooks/use-size-observer.ts

@@ -8,6 +8,8 @@ export function useSizeObserver(elRef: Ref, ...refsToWatch: any[]) {
     const heightRef = ref(0)
     const hasEllipsis = ref(false)
     const borderBoxSize = ref(null)
+    const disposing = ref(false)
+
     const calcEllipsis = (el: HTMLElement) => {
         hasEllipsis.value = isEllipsisActive(el)
     }
@@ -22,16 +24,36 @@ export function useSizeObserver(elRef: Ref, ...refsToWatch: any[]) {
         }
     )
 
-    onMounted(() => elRef.value && resizeObserver.observe(elRef.value))
     watch(elRef, () => {
-        elRef.value && calcEllipsis(elRef.value)
+        if (disposing.value) {
+            return
+        }
+        if (elRef.value) {
+            calcEllipsis(elRef.value)
+        }
     })
     for (const ref of refsToWatch) {
         watch(ref, () => {
-            elRef.value && calcEllipsis(elRef.value)
+            if (disposing.value) {
+                return
+            }
+            if (elRef.value) {
+                calcEllipsis(elRef.value)
+            }
         })
     }
-    onBeforeUnmount(() => elRef.value && resizeObserver.unobserve(elRef.value))
+
+    onMounted(() => {
+        if (elRef.value) {
+            resizeObserver.observe(elRef.value)
+        }
+    })
+    onBeforeUnmount(() => {
+        disposing.value = true
+        if (elRef.value) {
+            resizeObserver.unobserve(elRef.value)
+        }
+    })
 
     return {
         widthRef,

package/src/hooks/use-suggestions.ts

@@ -178,7 +178,7 @@ export const useSuggestions = (
 
             if (!field) continue
 
-            const fieldSeparated: any = field.split('.')
+            const fieldSeparated: string[] = field.split('.')
 
             if (fieldSeparated.length > 1) {
                 localSuggestions = []
@@ -229,21 +229,35 @@ export const useSuggestions = (
             localSuggestions = getOperators(ops)
 
             if (!operator) {
-                const dotSeparated = matchedField.split('.').filter((el) => el)
+                const dotSeparated = matchedField.split('.')
+                const lastWord = dotSeparated.pop()
                 let fieldOf = schemaValue
                 for (const key of dotSeparated) {
                     fieldOf = fieldOf[key] as Schema
                 }
 
-                if (isObject(fieldOf) && !Array.isArray(fieldOf)) {
-                    const toConcat: string[] = []
-                    for (const key of Object.keys(fieldOf)) {
+                const toAdd: string[] = []
+
+                if (fieldOf[lastWord]) {
+                    fieldOf = fieldOf[lastWord] as Schema
+
+                    if (isObject(fieldOf) && !Array.isArray(fieldOf)) {
+                        for (const key of Object.keys(fieldOf)) {
+                            if (key === '*') continue
+                            toAdd.push(`.${key}`)
+                        }
+                    }
+                } else {
+                    for (const key in fieldOf) {
                         if (key === '*') continue
-                        toConcat.push(`.${key}`)
+                        if (key.startsWith(lastWord)) {
+                            toAdd.push(`.${key}`)
+                        }
                     }
-                    localSuggestions = localSuggestions.concat(toConcat)
                 }
 
+                localSuggestions = toAdd.concat(localSuggestions)
+
                 continue
             }