// components/Dropdown.js
import { h } from "sigpro";

let currentOpen = null;

if (typeof window !== 'undefined' && !window.__dropdownHandlerRegistered) {
  window.addEventListener('click', (e) => {
    if (currentOpen && !currentOpen.contains(e.target)) {
      currentOpen.open = false;
      currentOpen = null;
    }
  });
  window.__dropdownHandlerRegistered = true;
}

export const Dropdown = (props) => h("details", {
  ...props,
  class: `dropdown ${props.class ?? ''}`,
  onclick: (e) => {
    const details = e.currentTarget;
    if (currentOpen && currentOpen !== details) currentOpen.open = false;
    setTimeout(() => { currentOpen = details.open ? details : null; }, 0);
  }
}, props.children);