From 7e6ba786816516ab5007a2ff15fc974cfdd796ab Mon Sep 17 00:00:00 2001
From: chenying <53081460+YIngChenIt@users.noreply.github.com>
Date: Fri, 26 Apr 2024 21:43:29 +0800
Subject: [PATCH] feat(InputMenu/SelectMenu): allow lazy search (#1705)

Co-authored-by: chenying <chenying@addcn.com>
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
---
 docs/content/2.components/input-menu.md     | 2 ++
 docs/content/2.components/select-menu.md    | 2 ++
 src/runtime/components/forms/InputMenu.vue  | 6 ++++++
 src/runtime/components/forms/SelectMenu.vue | 6 ++++++
 4 files changed, 16 insertions(+)

diff --git a/docs/content/2.components/input-menu.md b/docs/content/2.components/input-menu.md
index 869f295c..f43dd5d8 100644
--- a/docs/content/2.components/input-menu.md
+++ b/docs/content/2.components/input-menu.md
@@ -130,6 +130,8 @@ Pass a function to the `search` prop to customize the search behavior and filter
 
 Use the `debounce` prop to adjust the delay of the function.
 
+Use the `searchLazy` prop to control the immediacy of data requests. :u-badge{label="New" class="!rounded-full" variant="subtle"}
+
 ::component-example
 ---
 component: 'input-menu-example-search-async'
diff --git a/docs/content/2.components/select-menu.md b/docs/content/2.components/select-menu.md
index 43f90c09..eb4a261f 100644
--- a/docs/content/2.components/select-menu.md
+++ b/docs/content/2.components/select-menu.md
@@ -150,6 +150,8 @@ Pass a function to the `searchable` prop to customize the search behavior and fi
 
 Use the `debounce` prop to adjust the delay of the function.
 
+Use the `searchableLazy` prop to control the immediacy of data requests. :u-badge{label="New" class="!rounded-full" variant="subtle"}
+
 ::component-example
 ---
 component: 'select-menu-example-search-async'
diff --git a/src/runtime/components/forms/InputMenu.vue b/src/runtime/components/forms/InputMenu.vue
index 67e5bc8b..b23d5a58 100644
--- a/src/runtime/components/forms/InputMenu.vue
+++ b/src/runtime/components/forms/InputMenu.vue
@@ -249,6 +249,10 @@ export default defineComponent({
       type: Array,
       default: null
     },
+    searchLazy: {
+      type: Boolean,
+      default: false
+    },
     debounce: {
       type: Number,
       default: 200
@@ -407,6 +411,8 @@ export default defineComponent({
           return child !== null && child !== undefined && String(child).search(new RegExp(query.value, 'i')) !== -1
         })
       })
+    }, [], {
+      lazy: props.searchLazy
     })
 
     watch(container, (value) => {
diff --git a/src/runtime/components/forms/SelectMenu.vue b/src/runtime/components/forms/SelectMenu.vue
index 38bd6fad..948b9d54 100644
--- a/src/runtime/components/forms/SelectMenu.vue
+++ b/src/runtime/components/forms/SelectMenu.vue
@@ -249,6 +249,10 @@ export default defineComponent({
       type: String,
       default: 'Search...'
     },
+    searchableLazy: {
+      type: Boolean,
+      default: false
+    },
     clearSearchOnClose: {
       type: Boolean,
       default: () => configMenu.default.clearSearchOnClose
@@ -470,6 +474,8 @@ export default defineComponent({
           return child !== null && child !== undefined && String(child).search(new RegExp(query.value, 'i')) !== -1
         })
       })
+    }, [], {
+      lazy: props.searchableLazy
     })
 
     const createOption = computed(() => {