mui-nav-menu/lib/cjs/MenuItemGroup.js

Navigation menu component based on material ui

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const PathContext_1 = require("./contexts/PathContext");
const MenuContext_1 = require("./contexts/MenuContext");
const mui_1 = require("tss-react/mui");
const material_1 = require("@mui/material");
const useStyle = (0, mui_1.makeStyles)()((theme) => ({
    headerMini: {
        textAlign: "center",
        padding: 0,
    },
}));
const MenuItemGroup = ({ label, className, children, }) => {
    const { classes } = useStyle();
    const connectedIdPath = (0, PathContext_1.useConnectedPath)();
    const { collapsed } = (0, MenuContext_1.useMenuContext)();
    const nestedLevel = (0, react_1.useMemo)(() => {
        return connectedIdPath.length;
    }, [connectedIdPath]);
    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.ListSubheader, { className: (0, classnames_1.default)(className, {
                    [classes.headerMini]: collapsed && nestedLevel <= 1,
                }), children: label }), children] }));
};
exports.default = (0, react_1.memo)(MenuItemGroup);