Add Accordion component for collapsible sections
This commit is contained in:
24
src/components/Accordion.js
Normal file
24
src/components/Accordion.js
Normal file
@@ -0,0 +1,24 @@
|
|||||||
|
import { $html } from "sigpro";
|
||||||
|
import { joinClass } from "../core/utils.js";
|
||||||
|
|
||||||
|
/** ACCORDION */
|
||||||
|
export const Accordion = (props, children) => {
|
||||||
|
const { title, name, open, ...rest } = props;
|
||||||
|
|
||||||
|
return $html(
|
||||||
|
"div",
|
||||||
|
{
|
||||||
|
...rest,
|
||||||
|
class: joinClass("collapse collapse-arrow bg-base-200 mb-2", props.class),
|
||||||
|
},
|
||||||
|
[
|
||||||
|
$html("input", {
|
||||||
|
type: name ? "radio" : "checkbox",
|
||||||
|
name: name,
|
||||||
|
checked: open
|
||||||
|
}),
|
||||||
|
$html("div", { class: "collapse-title text-xl font-medium" }, title),
|
||||||
|
$html("div", { class: "collapse-content" }, children),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
};
|
||||||
Reference in New Issue
Block a user