natxocc
16afea2768
All checks were successful
Deploy Docs to Synology / deploy (push) Successful in 4s
32 lines
932 B
JavaScript
32 lines
932 B
JavaScript
// components/Menu.js
|
|
import { Tag, For } from "sigpro";
|
|
|
|
export const Menu = (props, children) => {
|
|
children === undefined && (children = props, props = {});
|
|
return Tag("ul", { ...props, class: `menu ${props.class ?? ''}` }, children);
|
|
};
|
|
|
|
export const MenuItems = (props) => {
|
|
const { items, keyFn = (item, idx) => item.id ?? idx } = props;
|
|
const itemsSignal = typeof items === "function" ? items : () => items || [];
|
|
|
|
const renderItem = (item) => {
|
|
if (item.children) {
|
|
return Tag("li", {}, [
|
|
Tag("details", {}, [
|
|
Tag("summary", {}, item.label),
|
|
Tag("ul", {}, MenuItems({ items: item.children }))
|
|
])
|
|
]);
|
|
}
|
|
return Tag("li", {}, Tag("a", {
|
|
href: item.href,
|
|
onclick: item.onclick ? (e) => {
|
|
if (!item.href) e.preventDefault();
|
|
item.onclick(e);
|
|
} : null
|
|
}, item.label));
|
|
};
|
|
|
|
return For(itemsSignal, renderItem, keyFn);
|
|
}; |