"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Tabs = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const Tab_1 = require("@mui/material/Tab");
const Tabs_1 = require("@mui/material/Tabs");
const react_2 = require("react");
const TabPanel_1 = require("./TabPanel");
const Tabs = (props) => {
    const { tabs } = props;
    if (!tabs) {
        return null;
    }
    const [value, setValue] = (0, react_2.useState)(0);
    const tabsId = `tabs-${Date.now()}`;
    const handleTabsChange = (_event, newValue) => {
        setValue(newValue);
    };
    const a11yProps = (index) => {
        return {
            id: `tab-${tabsId}-${index}`,
            'aria-controls': `tabpanel-${tabsId}-${index}`,
        };
    };
    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(Tabs_1.default, { value: value, onChange: handleTabsChange, "aria-label": "Tabs", children: tabs.map((tab, key) => {
                    const { label } = tab;
                    return (0, react_1.createElement)(Tab_1.default, { label: label, ...a11yProps(key), key: key });
                }) }), tabs.map((tab, key) => {
                const { children } = tab;
                return ((0, jsx_runtime_1.jsx)(TabPanel_1.TabPanel, { index: key, tabsId: tabsId, value: value, children: children }, key));
            })] }));
};
exports.Tabs = Tabs;
exports.default = exports.Tabs;
//# sourceMappingURL=Tabs.js.map