Add custom behavior to prevent focus on multiselect dropdown

assets/javascript/custom.js

@@ -0,0 +1,11 @@
+document.addEventListener('DOMContentLoaded', function() {
+    const multiSelectDropdown = document.querySelector('.mantine-MultiSelect-dropdown');
+    if (multiSelectDropdown) {
+        multiSelectDropdown.addEventListener('mousedown', function(event) {
+            // Prevent default focus behavior
+            event.preventDefault();
+            // Set focus to another element (e.g., body)
+            document.body.focus();
+        });
+    }
+});

pages/components.py

@@ -234,7 +234,7 @@ def create_subtype_checklist(self):
                     id='subtype_checklist',
                     data=data,
                     value=initial_values,
-                    searchable=False,
+                    searchable=True,
                     nothingFoundMessage="No options found",
                     clearable=True,
                     style={"margin-bottom": "10px"},