@bagelink/vue 1.9.67 → 1.9.69

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bagelink/vue",
   "type": "module",
-  "version": "1.9.67",
+  "version": "1.9.69",
   "description": "Bagel core sdk packages",
   "author": {
     "name": "Bagel Studio",

package/src/components/Filter.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts" generic="T extends Record<string, any>">
 import type { Option } from '@bagelink/vue'
 import type { ComparisonOperator, LogicalOperator, QueryConditions } from '../utils/queryFilter'
-import { Btn, DateInput, Dropdown, Icon, SelectInput, TextInput, useI18n } from '@bagelink/vue'
+import { Btn, DateInput, Dropdown, Icon, SelectInput, TextInput, useI18n, useDebounceFn } from '@bagelink/vue'
 import { computed } from 'vue'
 
 type OptionsSource = Option[] | ((query: string) => Promise<Option[]>)
@@ -31,6 +31,8 @@ const model = defineModel<QueryConditions<T>>({ default: () => [] })
 
 const { $t } = useI18n()
 
+const debouncedEmit = useDebounceFn((value: QueryConditions<T>) => { emit('change', value) }, 400)
+
 let conditionIdCounter = 0
 function generateId() {
 	return `cond_${++conditionIdCounter}_${Date.now()}`
@@ -154,7 +156,8 @@ function updateConditionAtIndex(index: number, updates: Partial<{ field: string,
 
 	newModel[index] = updated
 	model.value = newModel
-	emit('change', newModel)
+	const completeConditions = newModel.filter(c => c.field && c.op && (c.op === 'pr' || (c.value !== '' && c.value !== null && c.value !== undefined)))
+	debouncedEmit(completeConditions)
 }
 
 function addCondition() {
@@ -167,7 +170,7 @@ function addCondition() {
 	}
 	const newModel = [...model.value, newCondition]
 	model.value = newModel
-	emit('change', newModel)
+	// don't emit incomplete new condition
 }
 
 function removeCondition(index: number) {
@@ -180,13 +183,13 @@ function removeCondition(index: number) {
 	// Clean up ID mapping
 	conditionIds.delete(index)
 	model.value = newModel
-	emit('change', newModel)
+	debouncedEmit(newModel)
 }
 
 function clearAll() {
 	conditionIds.clear()
 	model.value = []
-	emit('change', [])
+	debouncedEmit([])
 }
 
 function getFieldType(fieldValue: string): string {