nice-ui
Version:
React design system, components, and utilities
34 lines (33 loc) • 1.43 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.Menu = void 0;
const React = require("react");
const nano_theme_1 = require("nano-theme");
const use_t_1 = require("use-t");
const MenuItem_1 = require("./MenuItem");
const nestedClass = (0, nano_theme_1.drule)({
pd: '0 0 0 10px',
mr: '6px 0 0 12px',
});
const Menu = ({ items, as, style, level = 1 }) => {
const Component = as || 'nav';
const [t] = (0, use_t_1.useT)();
const theme = (0, nano_theme_1.useTheme)();
return (React.createElement(Component, { style: style, className: level > 1
? nestedClass({
bdl: '1px solid ' + theme.g(0.9),
})
: '' }, items.map(({ key, menuItem, icon, children, ...rest }) => {
const name = typeof menuItem === 'function' ? menuItem(t) : menuItem;
let item = (React.createElement(MenuItem_1.MenuItem, { key: key, hasMore: !!children && !!children.length, ...rest },
icon,
!!icon ? React.createElement("div", { style: { marginLeft: 8 } }, name) : name));
if ((level < 1 || rest.activeChild) && children && children.length) {
item = (React.createElement(React.Fragment, { key: key + '_child' },
item,
React.createElement(exports.Menu, { items: children, level: level + 1 })));
}
return item;
})));
};
exports.Menu = Menu;