32 lines
862 B
JavaScript
32 lines
862 B
JavaScript
import { $, html } from "sigpro";
|
|
|
|
$.component(
|
|
"c-drawer",
|
|
(props, { emit, slot }) => {
|
|
const id = `drawer-${Math.random().toString(36).substring(2, 9)}`;
|
|
|
|
return html`
|
|
<div class="drawer">
|
|
<input
|
|
id="${id}"
|
|
type="checkbox"
|
|
class="drawer-toggle"
|
|
.checked=${() => props.open()}
|
|
@change=${(e) => {
|
|
const isChecked = e.target.checked;
|
|
if (typeof props.open === "function") props.open(isChecked);
|
|
emit("change", isChecked);
|
|
}} />
|
|
|
|
<div class="drawer-content">${slot("content")}</div>
|
|
|
|
<div class="drawer-side z-999">
|
|
<label for="${id}" aria-label="close sidebar" class="drawer-overlay"></label>
|
|
<div class="bg-base-200 min-h-full w-80">${slot()}</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
},
|
|
["open"],
|
|
);
|