@dataloop-ai/components 0.17.123 → 0.17.125

package/package.json

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

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

@@ -29,42 +29,44 @@
         </div>
         <div class="dl-smart-search__buttons">
             <slot name="buttons">
-                <div
-                    style="height: 28px"
-                    class="dl-smart-search__search-btn-wrapper"
-                >
-                    <dl-button
-                        icon="icon-dl-search"
-                        :styles="{
-                            height: '28px'
-                        }"
-                        :disabled="disabled"
-                        @click="emitSearchQuery"
-                    />
-                </div>
+                <div style="display: flex; align-items: center">
+                    <div
+                        style="height: 28px"
+                        class="dl-smart-search__search-btn-wrapper"
+                    >
+                        <dl-button
+                            icon="icon-dl-search"
+                            :styles="{
+                                height: '28px'
+                            }"
+                            :disabled="disabled"
+                            @click="emitSearchQuery"
+                        />
+                    </div>
 
-                <slot name="extra-actions" />
+                    <slot name="extra-actions" />
 
-                <dl-button
-                    class="dl-smart-search__buttons--filters"
-                    shaded
-                    outlined
-                    size="s"
-                >
-                    Saved Filters
-                    <dl-menu
-                        v-model="filtersModel"
-                        :offset="[0, 5]"
-                        anchor="bottom middle"
-                        self="top middle"
+                    <dl-button
+                        class="dl-smart-search__buttons--filters"
+                        shaded
+                        outlined
+                        size="s"
                     >
-                        <dl-smart-search-filters
-                            :filters="filters"
-                            @filters-select="handleFiltersSelect"
-                            @filters-delete="handleFiltersDelete"
-                        />
-                    </dl-menu>
-                </dl-button>
+                        Saved Filters
+                        <dl-menu
+                            v-model="filtersModel"
+                            :offset="[0, 5]"
+                            anchor="bottom middle"
+                            self="top middle"
+                        >
+                            <dl-smart-search-filters
+                                :filters="filters"
+                                @filters-select="handleFiltersSelect"
+                                @filters-delete="handleFiltersDelete"
+                            />
+                        </dl-menu>
+                    </dl-button>
+                </div>
             </slot>
         </div>
         <dl-dialog-box
@@ -235,7 +237,7 @@ import {
     SyntaxColorSchema
 } from './types'
 import {
-    replaceAliases,
+    revertAliases,
     setAliases,
     replaceStringifiedDatesWithJSDates,
     createColorSchema,
@@ -354,9 +356,10 @@ export default defineComponent({
         )
 
         const handleInputModel = (value: string) => {
-            inputModel.value = value
+            const aliased = setAliases(value, props.aliases)
+            inputModel.value = aliased
             const bracketless = removeBrackets(value)
-            const cleanedAliases = replaceAliases(bracketless, props.aliases)
+            const cleanedAliases = revertAliases(bracketless, props.aliases)
             const json = toJSON(cleanedAliases)
             if (!isEqual(json, props.modelValue)) {
                 emit('update:modelValue', json)
@@ -364,10 +367,10 @@ export default defineComponent({
             const stringified = JSON.stringify(json)
             activeQuery.value.query = stringified
             nextTick(() => {
-                findSuggestions(value)
+                findSuggestions(aliased)
             })
             isQuerying.value = false
-            oldInputQuery.value = value
+            oldInputQuery.value = aliased
         }
 
         const debouncedInputModel = debounce(handleInputModel, 300)
@@ -548,7 +551,7 @@ export default defineComponent({
             const json = JSON.stringify(
                 this.toJSON(removeBrackets(this.inputModel))
             )
-            const newQuery = replaceAliases(json, this.aliases)
+            const newQuery = revertAliases(json, this.aliases)
             if (newQuery && newQuery !== '{}') {
                 this.jsonEditorQuery = newQuery
             }

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

@@ -268,11 +268,25 @@ export default defineComponent({
                         .join(' ')
                         .replace('  ', ' ')
                 } else {
-                    query.splice(-1)
+                    if (query[query.length - 1].endsWith('.')) {
+                        query[query.length - 1] = query[
+                            query.length - 1
+                        ].replace('.', '')
+                    } else {
+                        query.splice(-1)
+                    }
                     stringValue = [...query, value, ''].join(' ')
                 }
             } else {
-                stringValue = [value, ''].join(' ')
+                if (query[query.length - 1].endsWith('.')) {
+                    query[query.length - 1] = query[query.length - 1].replace(
+                        '.',
+                        ''
+                    )
+                    stringValue = [...query, value, ''].join(' ')
+                } else {
+                    stringValue = [value, ''].join(' ')
+                }
             }
 
             // to handle date suggestion modal to open automatically.
@@ -283,6 +297,7 @@ export default defineComponent({
             const specialSuggestions = props.suggestions.filter((suggestion) =>
                 suggestion.startsWith('.')
             )
+
             for (const suggestion of specialSuggestions) {
                 if (stringValue.includes(suggestion)) {
                     stringValue = stringValue.replace(

package/src/components/compound/DlSearches/DlSmartSearch/utils/index.ts

@@ -109,26 +109,29 @@ export function replaceJSDatesWithStringifiedDates(
         return json
     }
 
-    const flat: { [key: string]: any } = flatten(json)
-    for (const key of Object.keys(flat)) {
-        const value = flat[key]
+    for (const key of Object.keys(json)) {
+        if (typeof json[key] === 'object') {
+            json[key] = replaceJSDatesWithStringifiedDates(json[key], dateKeys)
+            continue
+        }
+
+        const value = json[key]
         const keyToCheck = key.split('.').pop()
 
         if (dateKeys.includes(keyToCheck)) {
-            flat[key] = formatToStringDate(value)
+            json[key] = formatToStringDate(value)
         }
     }
 
-    return unflatten(flat) as {
-        [key: string]: any
-    }
+    return json
 }
 
-export function replaceAliases(json: string, aliases: Alias[]) {
+export function revertAliases(json: string, aliases: Alias[]) {
     let newJson = json
-    aliases.forEach((alias) => {
-        newJson = newJson.replaceAll(alias.alias, alias.key)
-    })
+    for (const alias of aliases) {
+        const regex = new RegExp(`${alias.alias}`, 'gi')
+        newJson = newJson.replace(regex, alias.key)
+    }
     return newJson
 }
 

package/src/components/shared/DlItemSection/DlItemSection.vue

@@ -53,7 +53,6 @@ export default defineComponent({
 
 <style scoped lang="scss">
 .dl-item__section {
-    display: flex;
     padding-left: 0;
     padding-right: 0;
     font-size: var(--dl-font-size-body);

package/src/demos/DlRadioDemo.vue

@@ -16,6 +16,20 @@
             label="Option 3"
             :value="3"
         />
+        disabled
+
+        <dl-radio
+            v-model="disabledModel"
+            label="Option Disabled"
+            :value="4"
+            disabled
+        />
+        <dl-radio
+            v-model="disabledModel"
+            label="Option Disabled not selected"
+            :value="5"
+            disabled
+        />
     </div>
 </template>
 
@@ -28,7 +42,8 @@ export default {
     },
     data() {
         return {
-            checkModel: 1
+            checkModel: 1,
+            disabledModel: 4
         }
     }
 }

package/src/demos/SmartSearchDemo/DlSmartSearchDemo.vue

@@ -22,6 +22,7 @@
             style="width: 100px"
             class="props"
         />
+        { "metadata.system.width": 5 }
         <dl-smart-search
             v-model="queryObject"
             :aliases="aliases"
@@ -44,7 +45,7 @@
         <br>
         Test second if they work on same page..
         <dl-smart-search
-            v-model="queryObject"
+            v-model="queryObject2"
             :aliases="[]"
             :schema="schema2"
             :color-schema="colorSchema"
@@ -180,6 +181,7 @@ export default defineComponent({
             strictState: false,
             isLoading: false,
             queryObject: {},
+            queryObject2: {},
             textQuery: '',
             filters
         }