fix(PropertyInput): improve blur handling and suggestion click event handling

src/components/PropertyInput.tsx

@@ -165,18 +165,31 @@ export function PropertyInput({
 
   // Handle blur
   const handleBlur = useCallback((e: React.FocusEvent<HTMLInputElement>) => {
-    // Delay hiding suggestions to allow for clicks on suggestions
+    // Delay and more robust checking
     setTimeout(() => {
-      const relatedTarget = e.relatedTarget as HTMLElement;
+      // Check if the active element is within our suggestions dropdown
-      if (!suggestionsRef.current?.contains(relatedTarget)) {
+      const activeElement = document.activeElement;
+      const isClickingOnSuggestion = suggestionsRef.current?.contains(activeElement) ||
+                                    suggestionsRef.current?.contains(e.relatedTarget as HTMLElement);
+
+      if (!isClickingOnSuggestion) {
         setShowSuggestions(false);
         setSelectedIndex(-1);
       }
-    }, 150);
+    }, 200);
   }, []);
 
   // Handle suggestion click
-  const handleSuggestionClick = useCallback((property: PropertySuggestion) => {
+  const handleSuggestionClick = useCallback((property: PropertySuggestion, event: React.MouseEvent) => {
+    // Prevent the blur event from interfering
+    event.preventDefault();
+    event.stopPropagation();
+    
+    // Immediately hide suggestions and process selection
+    setShowSuggestions(false);
+    setSelectedIndex(-1);
+    
+    // Process the selection
     handlePropertySelect(property);
   }, [handlePropertySelect]);
 
@@ -246,7 +259,7 @@ export function PropertyInput({
                       : 'hover:bg-gray-50 border-l-4 border-transparent'
                     }
                   `}
-                  onClick={() => handleSuggestionClick(suggestion)}
+                  onClick={(event) => handleSuggestionClick(suggestion, event)}
                   onMouseEnter={() => setSelectedIndex(index)}
                 >
                   <div className="flex items-center justify-between">