@conductionnl/nl-design-system
Version:
NL design system components created by Conduction
25 lines (24 loc) • 1.82 kB
JavaScript
;
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Accordion = void 0;
var jsx_runtime_1 = require("react/jsx-runtime");
/**
* This components renders an bootstrap accordion.
* @returns JSX of the generated accordion.
*/
var Accordion = function (_a) {
var items = _a.items, id = _a.id;
return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "accordion mt-4", id: "".concat(id, "Accordion") }, { children: items.map(function (item, idx) { return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: "accordion-item" }, { children: [(0, jsx_runtime_1.jsx)("h2", __assign({ className: "accordion-header", id: item.id }, { children: (0, jsx_runtime_1.jsx)("button", __assign({ className: "accordion-button collapsed", type: "button", "data-bs-toggle": "collapse", "data-bs-target": "#".concat(item.id, "Collapse"), "aria-expanded": "false", "aria-controls": "".concat(item.id, "Collapse") }, { children: item.title }), void 0) }), void 0), (0, jsx_runtime_1.jsx)("div", __assign({ id: item.id + "Collapse", className: "accordion-collapse collapse", "aria-labelledby": item.id, "data-bs-parent": "#".concat(item.id, "Accordion") }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "accordion-body", style: { backgroundColor: item.backgroundColor } }, { children: item.render() }), void 0) }), void 0)] }), item.title + idx)); }) }), void 0));
};
exports.Accordion = Accordion;