decentraland-ui
Version:
Decentraland's UI components and styles
35 lines (34 loc) • 3.21 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.SubMenu = void 0;
var react_1 = __importDefault(require("react"));
var classnames_1 = __importDefault(require("classnames"));
var Menu_1 = __importDefault(require("semantic-ui-react/dist/commonjs/collections/Menu"));
var Back_1 = require("../../Back/Back");
var SubMenuColumn_1 = require("../SubMenuColumn/SubMenuColumn");
var SubMenuItem_1 = require("../SubMenuItem/SubMenuItem");
require("./SubMenu.css");
/**
* @deprecated Should start using the same component migrated to UI2.
*/
var SubMenu = function (props) {
var selectedMenu = props.selectedMenu, onToggleShowSubMenu = props.onToggleShowSubMenu, onClickMenuOption = props.onClickMenuOption, isMobile = props.isMobile, submenus = props.submenus;
return (react_1.default.createElement("div", { className: (0, classnames_1.default)('dui-submenu-container', "".concat(selectedMenu, "-selected"), isMobile && 'mobile') }, Object.keys(submenus).map(function (key) {
var section = key;
var submenu = submenus[section];
return (react_1.default.createElement(Menu_1.default.Item, { key: key, className: (0, classnames_1.default)('submenu', "".concat(section, "-submenu")), onMouseEnter: function (e) {
return !isMobile && onToggleShowSubMenu(e, true, section);
}, onMouseLeave: function (e) {
return !isMobile && onToggleShowSubMenu(e, false, section);
} },
react_1.default.createElement("div", { className: "submenu-column__wrapper" },
isMobile && (react_1.default.createElement(Back_1.Back, { absolute: true, onClick: function (e) { return onToggleShowSubMenu(e, false, section); } }, "Back")),
react_1.default.createElement(SubMenuColumn_1.SubMenuColumn, { title: submenu.column1Title }, submenu.column1.map(function (item, index) { return (react_1.default.createElement(SubMenuItem_1.SubMenuItem, { key: index, isExternal: item.isExternal, title: item.title, description: item.description, href: item.url, eventTrackingName: item.eventTrackingName, onClickMenuOption: onClickMenuOption })); })),
react_1.default.createElement(SubMenuColumn_1.SubMenuColumn, { title: submenu.column2Title }, submenu.column2.map(function (item, index) { return (react_1.default.createElement(SubMenuItem_1.SubMenuItem, { key: index, isExternal: item.isExternal, title: item.title, description: item.description, href: item.url, eventTrackingName: item.eventTrackingName, onClickMenuOption: onClickMenuOption })); })),
!!submenu.column3 && (react_1.default.createElement(SubMenuColumn_1.SubMenuColumn, { title: submenu.column3Title }, submenu.column3.map(function (item, index) { return (react_1.default.createElement(SubMenuItem_1.SubMenuItem, { key: index, isExternal: item.isExternal, title: item.title, description: item.description, href: item.url, eventTrackingName: item.eventTrackingName, onClickMenuOption: onClickMenuOption })); }))))));
})));
};
exports.SubMenu = SubMenu;