new structure

packages/sigproui/components/Dropdown.js

@@ -0,0 +1,20 @@
+import { $, html } from "sigpro";
+
+$.component(
+  "c-dropdown",
+  (props, { slot }) => {
+    // Generamos un ID único para el anclaje nativo
+    const id = props.id() ?? `pop-${Math.random().toString(36).slice(2, 7)}`;
+
+    return html`
+      <div class="inline-block">
+        <button class="btn" popovertarget="${id}" style="anchor-name: --${id}">${slot("trigger")}</button>
+
+        <div popover id="${id}" style="position-anchor: --${id}" class="dropdown menu bg-base-100 rounded-box shadow-sm border border-base-300">
+          ${slot()}
+        </div>
+      </div>
+    `;
+  },
+  ["id"],
+);