id-components
Version:
id components
57 lines (56 loc) • 2.67 kB
JavaScript
;
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
result["default"] = mod;
return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var React = __importStar(require("react"));
var PropTypes = __importStar(require("prop-types"));
var style_1 = require("./style");
var BottomSheet_1 = __importDefault(require("../BottomSheet"));
var VerticalNavBar_1 = __importDefault(require("../VerticalNavBar"));
var BottomNavBar = function (props) {
var _a = React.useState(props.defaultSelected), current = _a[0], setCurrent = _a[1];
var _b = React.useState(false), isActiveSubMenu = _b[0], setIsActiveSubMenu = _b[1];
var _c = React.useState([]), optionsSubMenu = _c[0], setOptionsSubMenu = _c[1];
var onClick = function (selected) {
if (selected.action) {
setCurrent(selected.value);
selected.action(selected);
}
else if (selected.subOptions) {
setOptionsSubMenu(selected.subOptions);
}
};
return (React.createElement(style_1.Wrapper, null,
React.createElement(style_1.BaseBar, { isMobile: props.isMobile || false }, props.options.map(function (opt, i) {
var isSelected = current === opt.value;
return (React.createElement(style_1.OptionWrapper, { key: i, onClick: function () { return onClick(opt); } },
React.createElement(style_1.IconPart, { isSelected: isSelected }, React.cloneElement(opt.icon, {
color: isSelected ? props.activeColor : props.desactivateColor,
})),
React.createElement(style_1.NamePart, { isSelected: isSelected }, opt.label)));
})),
React.createElement(BottomSheet_1.default, { active: isActiveSubMenu, onClose: function () { return setIsActiveSubMenu(false); }, isMobile: props.isMobile || false, h: 260 },
React.createElement(VerticalNavBar_1.default, { options: optionsSubMenu }))));
};
BottomNavBar.defaultProps = {
options: [],
defaultSelected: '/',
activeColor: '#6C63FF',
desactivateColor: '#BABFCD',
};
BottomNavBar.propTypes = {
isMobile: PropTypes.bool,
options: PropTypes.array.isRequired,
defaultSelected: PropTypes.string,
activeColor: PropTypes.string,
desactivateColor: PropTypes.string,
};
exports.default = BottomNavBar;