initial

layers/ui/composables/use-fuse-search.js

@@ -0,0 +1,56 @@
+import Fuse from 'fuse.js'
+import { isRef, ref, unref, watch } from 'vue'
+
+export default (items, options, term) => {
+  const fuse = ref(null)
+  const result = ref(unref(items))
+
+  watch(items, (value) => {
+    if (fuse.value) {
+      fuse.value.setCollection(unref(value))
+      result.value = unref(items)
+    }
+  })
+
+  watch(
+    () => options,
+    (value) => {
+      fuse.value = new Fuse(unref(items), { minMatchCharLength: 2, ...value })
+    },
+    { immediate: true },
+  )
+
+  if (isRef(term)) {
+    watch(term, (value) => {
+      search(value)
+    })
+  }
+
+  const search = (term = '') => {
+    if (!fuse.value)
+      return
+
+    term = term.trim()
+
+    if (term.length < 2) {
+      result.value = unref(items)
+
+      return
+    }
+
+    const documents = fuse.value.search(term)
+
+    result.value = documents.map(doc => doc.item)
+  }
+
+  const reset = () => {
+    result.value = unref(items)
+  }
+
+  return {
+    fuse,
+    result,
+    search,
+    reset,
+  }
+}