21 lines
597 B
JavaScript
21 lines
597 B
JavaScript
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"],
|
|
);
|