norma-library
Version:
Olos/Norma-DS. Design System based on Material UI, developed with TypeScript and Styled Components to create reusable and consistent components in web applications.
32 lines • 1.97 kB
JavaScript
import { __assign, __rest } from "tslib";
import React from 'react';
import { Box } from '@mui/material';
import { NormaTab, NormaTabs } from './UncontrolledTabs.style';
import { NormaTabInfo } from './UncontrolledTabsInfo.style';
function TabPanel(props) {
var children = props.children, value = props.value, index = props.index, other = __rest(props, ["children", "value", "index"]);
return (React.createElement("div", __assign({ role: "tabpanel", hidden: value !== index, id: "simple-tabpanel-".concat(index), "aria-labelledby": "simple-tab-".concat(index) }, other), value === index && React.createElement(Box, { sx: { p: 3 } }, children)));
}
function a11yProps(index) {
return {
id: "simple-tab-".concat(index),
'aria-controls': "simple-tabpanel-".concat(index),
};
}
var UncontrolledTabs = function (_a) {
var tabs = _a.tabs, tab = _a.tab, _b = _a.color, color = _b === void 0 ? 'primary' : _b, onTabChange = _a.onTabChange, info = _a.info, props = __rest(_a, ["tabs", "tab", "color", "onTabChange", "info"]);
var handleChange = function (event, newValue) {
onTabChange(event, newValue);
};
return (React.createElement(Box, { sx: { width: '100%' } },
React.createElement(Box, null,
React.createElement(NormaTabs, __assign({ value: tab, color: color, onChange: handleChange, "aria-label": "tabs" }, props),
tabs.map(function (item, key) { return (React.createElement(NormaTab, __assign({ key: key, label: item.label, color: color }, a11yProps(key)))); }),
info && React.createElement(NormaTabInfo, null, info))),
tabs.map(function (item, key) {
var _a;
return (React.createElement(TabPanel, __assign({}, (_a = item.tabPanel) === null || _a === void 0 ? void 0 : _a.props, { key: key, value: tab, index: key }), item.children));
})));
};
export default UncontrolledTabs;
//# sourceMappingURL=UncontrolledTabs.js.map