From 107223f2cc60fd3027bf2ae7c5cd341b24d0cfef Mon Sep 17 00:00:00 2001
From: Russ Long <rl@tfmm.co>
Date: Fri, 1 May 2026 14:28:11 -0400
Subject: [PATCH] fix: use IIFE to prevent tomselect double initialization

---
 .../views/components/tomselect.blade.php      | 37 +++++++++----------
 1 file changed, 17 insertions(+), 20 deletions(-)

diff --git a/resources/views/components/tomselect.blade.php b/resources/views/components/tomselect.blade.php
index 9cec652..add4958 100644
--- a/resources/views/components/tomselect.blade.php
+++ b/resources/views/components/tomselect.blade.php
@@ -1,27 +1,24 @@
 <script src="https://cdn.jsdelivr.net/npm/tom-select@2.4.3/dist/js/tom-select.complete.min.js"></script>
 <link href="https://cdn.jsdelivr.net/npm/tom-select@2.4.3/dist/css/tom-select.bootstrap5.min.css" rel="stylesheet">
 <style>
-    /* Aggressive visibility for debug */
-    .ts-control, .ts-wrapper .ts-control {
-        background-color: #ffffff !important;
-        border: 2px solid red !important;
-        min-height: 50px !important;
-        opacity: 1 !important;
-    }
-    .ts-dropdown {
-        display: block !important;
-        z-index: 10000 !important;
-        background-color: white !important;
-        border: 1px solid black !important;
-    }
+    .ts-control { background-color: #ffffff !important; border: 1px solid #ced4da !important; }
 </style>
 <script>
-    window.addEventListener('load', function() {
-        document.querySelectorAll('select').forEach(function(el) {
-            new TomSelect(el, {
-                create: false,
-                sortField: { field: 'text', direction: 'asc' }
+    (function() {
+        const init = () => {
+            document.querySelectorAll('select').forEach((el) => {
+                if (el.tomselect) return;
+                new TomSelect(el, {
+                    create: false,
+                    sortField: { field: 'text', direction: 'asc' }
+                });
             });
-        });
-    });
+        };
+        // Use a single listener to prevent multiple triggers
+        if (document.readyState === 'loading') {
+            document.addEventListener('DOMContentLoaded', init);
+        } else {
+            init();
+        }
+    })();
 </script>