diff --git a/src/sigpro-ui.js b/src/sigpro-ui.js index 80605f6..fad8fd5 100644 --- a/src/sigpro-ui.js +++ b/src/sigpro-ui.js @@ -905,6 +905,22 @@ export const UI = ($, defaultLang = "es") => { ], ); + /** LIST */ + ui.List = (props) => { + const { items, header, render, keyFn, class: className } = props; + + return $.html( + "ul", + { + class: joinClass("list bg-base-100 rounded-box shadow-md", className), + }, + [ + ui.If(header, () => $.html("li", { class: "p-4 pb-2 text-xs opacity-60 tracking-wide" }, [val(header)])), + ui.For(items, (item, index) => $.html("li", { class: "list-row" }, [render(item, index)]), keyFn), + ], + ); + }; + /** STACK */ ui.Stack = (props, children) => $.html("div", { ...props, class: joinClass("stack", props.$class || props.class) }, children);