myprojectpackageprav
Version:
My package in npm
38 lines • 3.38 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
require("./tabs.css");
function Tabs(props) {
var _a = (0, react_1.useState)(props.items), items = _a[0], setItems = _a[1];
function show(event, index) {
var tabs = items;
tabs.map(function (item, index_item) {
item['is_active'] = 'false';
if (index === index_item) {
item['is_active'] = 'true';
}
return item;
});
setItems(tslib_1.__spreadArray([], tabs, true));
}
return (react_1.default.createElement("div", { className: "tabs" },
react_1.default.createElement("div", { className: (props === null || props === void 0 ? void 0 : props.className) ? "customTabs ".concat(props === null || props === void 0 ? void 0 : props.className) : 'customTabs' },
react_1.default.createElement("ul", { className: props === null || props === void 0 ? void 0 : props.tabsul },
react_1.default.createElement("div", { className: (props === null || props === void 0 ? void 0 : props.tablistclassName) ? "customTabs-list ".concat(props === null || props === void 0 ? void 0 : props.tablistclassName) : 'customTabs-list' }, items.map(function (item, index) {
return (react_1.default.createElement("li", null,
react_1.default.createElement("a", { tabIndex: 0, href: "javascript:void(0)", title: (item === null || item === void 0 ? void 0 : item.title) || (item === null || item === void 0 ? void 0 : item.tabtitle), key: index, onClick: function (event) { return show(event, index); }, className: item['is_active'] === 'true' ? (props === null || props === void 0 ? void 0 : props.anchorclass) ? "active ".concat(props === null || props === void 0 ? void 0 : props.anchorclass) : 'active' : (props === null || props === void 0 ? void 0 : props.anchorclass) ? "".concat(props === null || props === void 0 ? void 0 : props.anchorclass) : '' },
(item === null || item === void 0 ? void 0 : item.icon) && react_1.default.createElement("span", { className: item === null || item === void 0 ? void 0 : item.icon }),
" ", item === null || item === void 0 ? void 0 :
item.tabtitle,
" ",
(props === null || props === void 0 ? void 0 : props.badge) && react_1.default.createElement("span", { className: props === null || props === void 0 ? void 0 : props.badge }, item === null || item === void 0 ? void 0 : item.count))));
})), props === null || props === void 0 ? void 0 :
props.isButtons)),
react_1.default.createElement("div", { className: props === null || props === void 0 ? void 0 : props.tabscontentarea }, items.map(function (item, index) {
return (react_1.default.createElement("div", { key: index, className: "customTabs-content ".concat(item['is_active'] === 'true' ? 'active' : '') },
react_1.default.createElement("div", { className: props === null || props === void 0 ? void 0 : props.contentstyles }, item === null || item === void 0 ? void 0 : item.content)));
}))));
}
exports.default = Tabs;
//# sourceMappingURL=tabs.js.map