@smitch/fluid
Version:
A Next/React ui-component libray.
11 lines (10 loc) • 1.41 kB
JavaScript
'use client';
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { Button } from '../..';
import { FaPlus, FaMinus, FaChevronLeft, FaChevronDown } from 'react-icons/fa';
var iconStyles = 'aspect-square text-current w-6 group-[.text-sm]:w-4 group-[.text-lg]:w-8';
var AccordionHead = function (_a) {
var _b = _a.icon, icon = _b === void 0 ? 'symbol' : _b, id = _a.id, open = _a.open, setopen = _a.setopen, title = _a.title, name = _a.name;
return (_jsxs("h3", { className: "peer font-semibold opacity-90 m-0 flex cursor-pointer items-center justify-between text-xl group-[.text-sm]:text-lg group-[.text-lg]:text-2xl p-2 capitalize ".concat(open === id ? 'open' : ''), onClick: function () { return setopen("".concat(open === id ? '' : id)); }, children: [title || name, _jsx(Button, { className: 'shadow-none !p-0', layout: 'circle', onClick: function () { return setopen("".concat(open === id ? '' : id)); }, btnBackground: 'transparent', btnColor: 'primary', children: _jsxs(_Fragment, { children: [open === id ? (icon === 'symbol' ? (_jsx(FaMinus, { className: iconStyles })) : (_jsx(FaChevronDown, { className: iconStyles }))) : icon === 'symbol' ? (_jsx(FaPlus, { className: iconStyles })) : (_jsx(FaChevronLeft, { className: iconStyles })), _jsx("span", { className: 'sr-only', children: "Toggle section" })] }) })] }));
};
export default AccordionHead;