@tekkare/auriga 0.1.183 → 0.1.185

package/dist/module.json

@@ -4,5 +4,5 @@
   "compatibility": {
     "nuxt": "^3.0.0"
   },
-  "version": "0.1.183"
+  "version": "0.1.185"
 }

package/dist/runtime/components/argComplexSelect.vue

@@ -133,9 +133,12 @@
             ></arg-icon>
           </div>
           <!-- List -->
-          <div v-if="!loading" class="oip_select_complex_selection_container">
+          <div
+            v-if="!loading && filterNameAdd.length > 0"
+            class="oip_select_complex_selection_container"
+          >
             <div
-              class="oip_select_complex_selection_loop add"
+              class="oip_select_complex_selection_loop add break"
               v-for="(element, index) of filterNameAdd"
               :key="index"
               @mouseover="hoverAdd = index"
@@ -165,17 +168,17 @@
             </div>
           </div>
           <div
-            class="oip_empty_dropdown"
-            v-else-if="filterNameAdd.length === 0"
+            v-else-if="loading"
+            class="oip_select_complex_selection_container"
           >
-            <p>{{ getEmptyContentMsg }}</p>
-          </div>
-          <div v-else class="oip_select_complex_selection_container">
             <arg-data-loader
               :text="getLoaderText[0]"
               :sub-text="getLoaderText[1]"
             />
           </div>
+          <div v-else class="oip_empty_dropdown">
+            <p>{{ getEmptyContentMsg }}</p>
+          </div>
         </div>
         <div class="oip_select_complex_del_selection">
           <div class="oip_select_complex_all_title">
@@ -218,7 +221,7 @@
           <!-- List -->
           <div class="oip_select_complex_selection_container">
             <div
-              class="oip_select_complex_selection_loop del"
+              class="oip_select_complex_selection_loop del break"
               v-for="(element, index) of filterNameDel"
               :key="index"
               @mouseover="hoverRemove = index"
@@ -250,6 +253,7 @@
   </div>
 </template>
 <script>
+import { useFuse } from "@vueuse/integrations/useFuse";
 import argSimpleLabel from "./argSimpleLabel.vue";
 import argBtn from "./argBtn.vue";
 import argIcon from "./argIcon.vue";
@@ -301,7 +305,9 @@ export default defineComponent({
       }
     },
     loader_text: { type: Array, default: null },
-    empty_content_msg: { type: String, default: null }
+    empty_content_msg: { type: String, default: null },
+    fuzzySearch: { type: Boolean, default: false },
+    fuzzyThreshold: { type: Number, default: 0.5 }
   },
   emits: ["changeElement", "changeAddInputValue", "update:Selection"],
   setup(props, { emit }) {
@@ -427,13 +433,22 @@ export default defineComponent({
     });
     function checkIfContainsValue(element, searchArray) {
       let hasValue = false;
-      if (searchArray.every((l) => element.includes(l))) {
+      searchArray = searchArray.filter((a) => a.length > 0);
+      if (searchArray.every(
+        (l) => props.fuzzySearch ? useFuse(l, add_table.value, options.value).results.value.map((a) => a.item).includes(element) : element.includes(l)
+      )) {
         hasValue = true;
       }
       return hasValue;
     }
+    const options = computed(() => ({
+      fuseOptions: {
+        includeScore: true,
+        threshold: props.fuzzyThreshold
+      }
+    }));
     const filterNameAdd = computed(() => {
-      if (searchNameAdd.value !== null) {
+      if (searchNameAdd.value !== null && searchNameAdd.value.length > 0) {
         if (searchNameAdd.value.includes(" ")) {
           return add_table.value.filter(
             (element) => checkIfContainsValue(
@@ -443,7 +458,7 @@ export default defineComponent({
           ).slice(0, props.max_result);
         } else
           return add_table.value.filter(
-            (element) => element.toLowerCase().includes(searchNameAdd.value.toLowerCase())
+            (element) => props.fuzzySearch ? useFuse(searchNameAdd.value, add_table.value, options.value).results.value.map((a) => a.item).includes(element) : element.toLowerCase().includes(searchNameAdd.value.toLowerCase())
           ).slice(0, props.max_result);
       } else
         return add_table.value.slice(0, props.max_result);
@@ -639,7 +654,7 @@ export default defineComponent({
 </script>
 
 <style scoped>
-.oip_select_complex_del_selection{flex:1;padding:16px}.oip_select_complex_add_selection{border-right:1px solid var(--light);flex:1;padding:16px;width:auto}.oip_select_complex_all_tittle_right,.oip_select_complex_all_tittle_right.add{font-size:12px;font-weight:500;line-height:22px;vertical-align:bottom}.oip_select_complex_all_tittle_right.add{color:var(--primary);cursor:pointer}.oip_select_complex_selection_loop.add svg.disable{color:var(--dark)!important}.oip_select_complex_all_tittle_right.del{color:var(--system-alert);cursor:pointer;font-size:12px;font-weight:500;line-height:22px;vertical-align:bottom}.oip_select_complex_all_title{display:flex;gap:12px;margin-bottom:8px}.oip_select_complex_all_tittle_left{border-right:1px solid var(--light);color:var(--darkest);font-size:14px;font-weight:500;line-height:22px;padding-right:12px}.oip_select_complex_all_selection{display:flex}.oip_select_complex_footer{background-color:var(--white);border-radius:0 0 12px 12px;border-top:1px solid var(--light);display:flex;gap:16px;justify-content:flex-end;padding:28px 36px}.oip_select_complex_smart_title{font-size:14px;font-weight:500;line-height:22px;margin-bottom:12px}.oip_select_complex_smart_selection{display:flex;flex-wrap:wrap;gap:10px}.oip_select_complex_smart_selection>.oip_tag{cursor:pointer}.oip_select_complex_smart{margin-bottom:0;padding:16px}.oip_select_complex_block{background:var(--demi-fond);border:1px solid var(--light);border-radius:12px;box-shadow:var(--overlay-shadow);margin-top:15px;position:absolute;width:780px;z-index:12}.oip_select_complex_header{background-color:var(--white);border-bottom:1px solid var(--light);border-radius:12px 12px 0 0;padding:16px}.oip_select_complex_header_title{font-size:16px;font-weight:700;line-height:19px}.oip_select_complex_selection_loop>svg.add{fill:var(--accent)!important;color:var(--white)!important}.oip_tag.is_disable{cursor:pointer!important}
+.oip_select_complex_del_selection{flex:1;padding:16px}.oip_select_complex_add_selection{border-right:1px solid var(--light);flex:1;max-width:50%;padding:16px}.oip_select_complex_all_tittle_right,.oip_select_complex_all_tittle_right.add{font-size:12px;font-weight:500;line-height:22px;vertical-align:bottom}.oip_select_complex_all_tittle_right.add{color:var(--primary);cursor:pointer}.oip_select_complex_selection_loop.add svg.disable{color:var(--dark)!important}.oip_select_complex_selection_loop.break{word-break:break-word}.oip_select_complex_all_tittle_right.del{color:var(--system-alert);cursor:pointer;font-size:12px;font-weight:500;line-height:22px;vertical-align:bottom}.oip_select_complex_all_title{display:flex;gap:12px;margin-bottom:8px}.oip_select_complex_all_tittle_left{border-right:1px solid var(--light);color:var(--darkest);font-size:14px;font-weight:500;line-height:22px;padding-right:12px}.oip_select_complex_all_selection{display:flex}.oip_select_complex_footer{background-color:var(--white);border-radius:0 0 12px 12px;border-top:1px solid var(--light);display:flex;gap:16px;justify-content:flex-end;padding:28px 36px}.oip_select_complex_smart_title{font-size:14px;font-weight:500;line-height:22px;margin-bottom:12px}.oip_select_complex_smart_selection{display:flex;flex-wrap:wrap;gap:10px}.oip_select_complex_smart_selection>.oip_tag{cursor:pointer}.oip_select_complex_smart{margin-bottom:0;padding:16px}.oip_select_complex_block{background:var(--demi-fond);border:1px solid var(--light);border-radius:12px;box-shadow:var(--overlay-shadow);margin-top:15px;position:absolute;width:780px;z-index:12}.oip_select_complex_header{background-color:var(--white);border-bottom:1px solid var(--light);border-radius:12px 12px 0 0;padding:16px}.oip_select_complex_header_title{font-size:16px;font-weight:700;line-height:19px}.oip_select_complex_selection_loop>svg.add{fill:var(--accent)!important;color:var(--white)!important}.oip_tag.is_disable{cursor:pointer!important}
 </style>
 
 <style scoped>

package/dist/runtime/components/argComplexSelect.vue.d.ts

@@ -120,6 +120,14 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         default: null;
     };
+    fuzzySearch: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    fuzzyThreshold: {
+        type: NumberConstructor;
+        default: number;
+    };
 }, {
     add_table: import("vue").Ref<any>;
     del_table: import("vue").Ref<any>;
@@ -276,6 +284,14 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         default: null;
     };
+    fuzzySearch: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    fuzzyThreshold: {
+        type: NumberConstructor;
+        default: number;
+    };
 }>> & {
     onChangeElement?: ((...args: any[]) => any) | undefined;
     onChangeAddInputValue?: ((...args: any[]) => any) | undefined;
@@ -298,5 +314,7 @@ declare const _default: import("vue").DefineComponent<{
     empty_msg: string;
     loader_text: string[];
     empty_content_msg: string;
+    fuzzySearch: boolean;
+    fuzzyThreshold: number;
 }, {}>;
 export default _default;

package/dist/runtime/components/argDropdownSelect.vue.d.ts

@@ -240,6 +240,8 @@ declare const _default: import("vue").DefineComponent<{
     empty_msg: string;
     loader_text: string[];
     empty_content_msg: string;
+    fuzzySearch: boolean;
+    fuzzyThreshold: number;
     search: boolean;
     filter_placeholder: string;
     close_on_click: boolean;
@@ -247,7 +249,5 @@ declare const _default: import("vue").DefineComponent<{
     watch_default_change: boolean;
     values_disabled: unknown[];
     is_sort: boolean;
-    fuzzySearch: boolean;
-    fuzzyThreshold: number;
 }, {}>;
 export default _default;

package/dist/runtime/components/argMultipleSelect.vue

@@ -302,6 +302,7 @@
   </div>
 </template>
 <script>
+import { useFuse } from "@vueuse/integrations/useFuse";
 import {
   onMounted,
   ref,
@@ -339,7 +340,9 @@ export default defineComponent({
       }
     },
     loader_text: { type: Array, default: null },
-    empty_content_msg: { type: String, default: null }
+    empty_content_msg: { type: String, default: null },
+    fuzzySearch: { type: Boolean, default: false },
+    fuzzyThreshold: { type: Number, default: 0.5 }
   },
   emits: ["changeElement", "update:Selection", "changeInputValue", "onClose"],
   setup(props, { emit }) {
@@ -454,9 +457,18 @@ export default defineComponent({
           return element_table_copy.value;
       }
     });
+    const options = computed(() => ({
+      fuseOptions: {
+        includeScore: true,
+        threshold: props.fuzzyThreshold
+      }
+    }));
     function checkIfContainsValue(element, searchArray) {
       let hasValue = false;
-      if (searchArray.every((l) => element.includes(l))) {
+      searchArray = searchArray.filter((a) => a.length > 0);
+      if (searchArray.every(
+        (l) => props.fuzzySearch ? useFuse(l, element_table_copy.value, options.value).results.value.map((a) => a.item).includes(element) : element.includes(l)
+      )) {
         hasValue = true;
       }
       return hasValue;
@@ -473,7 +485,11 @@ export default defineComponent({
             );
           } else
             return element_table_copy.value.filter(
-              (element) => element.toLowerCase().includes(searchName.value.toLowerCase())
+              (element) => props.fuzzySearch ? useFuse(
+                searchName.value,
+                element_table_copy.value,
+                options.value
+              ).results.value.map((a) => a.item).includes(element) : element.toLowerCase().includes(searchName.value.toLowerCase())
             );
         } else
           return element_table_copy.value;
@@ -484,7 +500,11 @@ export default defineComponent({
           selectTable = [
             ...new Set(
               element_table_copy.value.filter(
-                (element) => element.toLowerCase().includes(searchName.value.toLowerCase())
+                (element) => props.fuzzySearch ? useFuse(
+                  searchName.value,
+                  element_table_copy.value,
+                  options.value
+                ).results.value.map((a) => a.item).includes(element) : element.toLowerCase().includes(searchName.value.toLowerCase())
               )
             )
           ];

package/dist/runtime/components/argMultipleSelect.vue.d.ts

@@ -108,6 +108,14 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         default: null;
     };
+    fuzzySearch: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    fuzzyThreshold: {
+        type: NumberConstructor;
+        default: number;
+    };
 }, {
     getNestedLength: import("vue").ComputedRef<number>;
     del_all: () => void;
@@ -252,6 +260,14 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         default: null;
     };
+    fuzzySearch: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    fuzzyThreshold: {
+        type: NumberConstructor;
+        default: number;
+    };
 }>> & {
     onOnClose?: ((...args: any[]) => any) | undefined;
     onChangeElement?: ((...args: any[]) => any) | undefined;
@@ -265,6 +281,8 @@ declare const _default: import("vue").DefineComponent<{
     empty_msg: string;
     loader_text: string[];
     empty_content_msg: string;
+    fuzzySearch: boolean;
+    fuzzyThreshold: number;
     search: boolean;
     filter_placeholder: string;
     default_select: String[];

package/dist/runtime/components/argTipsBox.vue

@@ -70,11 +70,15 @@ export default defineComponent({
       validator: (value) => {
         return ["en", "fr", "es"].includes(value);
       }
+    },
+    defaultOpen: {
+      type: Boolean,
+      default: false
     }
   },
   setup(props, { emit }) {
     const displayTip = ref(true);
-    const showMore = ref(false);
+    const showMore = ref(props.defaultOpen);
     return {
       displayTip,
       showMore

package/dist/runtime/components/argTipsBox.vue.d.ts

@@ -12,6 +12,10 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
         validator: (value: unknown) => boolean;
     };
+    defaultOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, {
     displayTip: import("vue").Ref<boolean>;
     showMore: import("vue").Ref<boolean>;
@@ -29,7 +33,12 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
         validator: (value: unknown) => boolean;
     };
+    defaultOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>>, {
+    defaultOpen: boolean;
     haveClose: boolean;
     haveMore: boolean;
     tipsLang: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tekkare/auriga",
-  "version": "0.1.183",
+  "version": "0.1.185",
   "description": "Aurgia is a UI kit developped by Tekkare",
   "license": "MIT",
   "type": "module",