@wulperstudio/cms/node/organisms/Menu/Menu.js

Wulper Studio Library Components CMS

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Menu = void 0;
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireDefault(require("react"));
var _material = require("@mui/material");
var _components = require("../../components");
var _styled = require("./styled");
var _jsxRuntime = require("react/jsx-runtime");
var _excluded = ["customHeader", "DividerProps", "AvatarProps", "ItemProps"];
var Menu = exports.Menu = function Menu(_ref) {
  var customHeader = _ref.customHeader,
    _DividerProps = _ref.DividerProps,
    _AvatarProps = _ref.AvatarProps,
    _ItemProps = _ref.ItemProps,
    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
  var theme = (0, _material.useTheme)();
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styled.CustomHeader, Object.assign({}, customHeader, {
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styled.Div, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
        spacing: props.spacing || 10,
        sx: Object.assign({
          width: '100%',
          height: '100%',
          display: 'grid',
          gridTemplateRows: 'auto 1fr'
        }, !!props.footer && {
          gridTemplateRows: 'auto 1fr auto'
        }),
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
          justifyContent: "center",
          alignItems: "center",
          sx: {
            height: '75px',
            marginTop: '5px'
          },
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Avatar, Object.assign({
            alt: "Logo",
            src: props.logoUrl,
            sx: {
              width: 45,
              height: 45
            }
          }, _AvatarProps))
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("nav", {
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
            spacing: 0,
            alignItems: "center",
            justifyContent: "center",
            children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
              spacing: props.spacingIcons,
              children: [props.icons.map(function (ico, index) {
                return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", Object.assign({
                  id: "menu_vertical_item_".concat(ico.text)
                }, _ItemProps, {
                  style: Object.assign({
                    order: index + 1
                  }, _ItemProps == null ? void 0 : _ItemProps.style),
                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Tooltip, {
                    title: ico.text,
                    placement: "right",
                    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styled.ListItem, {
                      active: ico.active,
                      onClick: function onClick() {
                        var _ico$toRoute;
                        (_ico$toRoute = ico.toRoute) == null || _ico$toRoute.call(ico);
                      },
                      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styled.ContainerIcon, {
                        children: ico.icon
                      })
                    })
                  })
                }), "".concat(ico.text));
              }), !props.hideDivider && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
                style: {
                  order: props.order
                },
                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, Object.assign({
                  variant: "fullWidth"
                }, _DividerProps, {
                  sx: Object.assign({
                    borderColor: theme.palette.text.secondary,
                    width: 'auto'
                  }, _DividerProps == null ? void 0 : _DividerProps.sx)
                }))
              })]
            })
          })
        }), props.footer]
      })
    })
  }));
};