"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.PHXButtonGroup = PHXButtonGroup;
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importStar(require("react"));
const Button_1 = require("../Button/Button");
const types_1 = require("../types");
function PHXButtonGroup({ className, size, dataGroups, type, label }) {
    const [active, setActive] = (0, react_1.useState)('');
    const [current, setCurrent] = (0, react_1.useState)(false);
    const setIsActive = (item) => {
        item.onClick();
        if (type === 'active-button') {
            setActive(item.buttonText);
            if (item.buttonText === active) {
                setCurrent(false);
                setActive('');
            }
            else {
                setCurrent(true);
            }
        }
        else {
            return;
        }
    };
    (0, react_1.useEffect)(() => {
        for (const item of dataGroups) {
            if (item.defaultActive) {
                setActive(item.buttonText);
                setCurrent(true);
            }
        }
    }, [dataGroups]);
    return (react_1.default.createElement("div", null,
        label && react_1.default.createElement("label", { className: 'mb-1 flex text-xs font-normal text-gray-700' }, label),
        react_1.default.createElement("div", { className: `flex w-fit justify-start gap-x-2 rounded-lg ${className}` }, dataGroups.map((item, index) => (react_1.default.createElement(Button_1.PHXButton, { key: item.buttonText, className: (0, types_1.classNames)(index === 0 ? 'rounded-none rounded-tl-lg rounded-bl-lg border-l' : 'rounded-none', index === dataGroups.length - 1 ? 'rounded-none rounded-tr-lg rounded-br-lg' : 'rounded-none', type === 'active-button' && active === item.buttonText && current
                ? '!bg-gray-200 !shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset] !border-b-gray-300 hover:cursor-default'
                : '', '!ring-0 border-y border-r border-gray-300 leading-4'), secondary: true, size: size, onClick: () => {
                if (type === 'active-button' && active === item.buttonText && current) {
                    return;
                }
                setIsActive(item);
            } }, item.buttonText))))));
}
//# sourceMappingURL=ButtonGroup.js.map