Add listener to close drop down for click anywhere on page

Author: sarahsanders-docker

layouts/partials/md-dropdown.html

@@ -1,4 +1,4 @@
-<details class="group relative z-50 inline-block" data-heap-id="markdown-dropdown">
+<details id="markdownDropdown" class="group relative z-50 inline-block" data-heap-id="markdown-dropdown">
     <summary
       class="inline-flex cursor-pointer items-center gap-2 rounded border border-gray-light-200 bg-gray-light-200 px-4 py-2 text-base font-semibold text-black transition-colors hover:bg-gray-light-300 dark:border-gray-dark-200 dark:bg-gray-dark-300 dark:text-white dark:hover:bg-gray-dark-400"
       data-heap-id="markdown-dropdown-toggle"
@@ -100,4 +100,17 @@
       alert("Couldn't find Docs AI.");
     }
   }
+
+  document.addEventListener('click', function (event) {
+    const dropdown = document.getElementById('markdownDropdown');
+
+    if (!dropdown) return;
+
+    const isClickInside = dropdown.contains(event.target);
+
+    // If dropdown is open and click was outside, close it
+    if (!isClickInside && dropdown.hasAttribute('open')) {
+      dropdown.removeAttribute('open');
+    }
+  });
 </script>