@achs/webkit
Version:
Conjunto de componentes de UI con el estilo del Sistema de Diseño ACHS (Asociación Chilena de Seguridad), para reutilizar de forma transversal en las aplicaciones web de ACHS. Construido con **React 19**, **TypeScript** y **Vite**, con soporte para las
56 lines (55 loc) • 1.92 kB
JavaScript
import { jsx as r, jsxs as c } from "react/jsx-runtime";
import { forwardRef as $, useState as g, useId as v } from "react";
import a from "./Accordion.module.scss.mjs";
import '../../../assets/node_modules/.pnpm/bootstrap-icons@1.13.1/node_modules/bootstrap-icons/font/bootstrap-icons.css';/* empty css */
const x = $(({
items: i,
allowMultiple: l = !1,
defaultOpen: m = [],
className: p,
...h
}, u) => {
const [b, f] = g(m), d = v(), N = (n) => {
f((e) => {
const s = e.includes(n);
return l ? s ? e.filter((t) => t !== n) : [...e, n] : s ? [] : [n];
});
};
return /* @__PURE__ */ r("div", { ref: u, className: `${a.accordion} ${p ?? ""}`.trim(), ...h, children: i.map((n, e) => {
const s = b.includes(e), t = `${d}-h-${e}`, o = `${d}-p-${e}`;
return /* @__PURE__ */ c("div", { className: a.item, "data-open": s, children: [
/* @__PURE__ */ r("h3", { className: a.heading, children: /* @__PURE__ */ c(
"button",
{
id: t,
type: "button",
className: a.trigger,
"aria-expanded": s,
"aria-controls": o,
disabled: n.disabled,
onClick: () => N(e),
children: [
/* @__PURE__ */ r("span", { className: a.title, children: n.title }),
/* @__PURE__ */ r("i", { className: `bi bi-chevron-down ${a.chevron}`, "aria-hidden": "true" })
]
}
) }),
/* @__PURE__ */ r(
"div",
{
id: o,
role: "region",
"aria-labelledby": t,
className: a.panel,
hidden: !s,
children: /* @__PURE__ */ r("div", { className: a.content, children: n.content })
}
)
] }, e);
}) });
});
x.displayName = "Accordion";
export {
x as Accordion,
x as default
};