decentraland-ui2 0.4.2-10726557744.commit-ce9ffdf → 0.4.3-10740116152.commit-f0b1652
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Assets/Navbar/create-submenu.png +0 -0
- package/dist/Assets/Navbar/explore-submenu.png +0 -0
- package/dist/Assets/Navbar/governance-submenu.png +0 -0
- package/dist/Assets/Navbar/learn-submenu.png +0 -0
- package/dist/Assets/Navbar/marketplace-submenu.png +0 -0
- package/dist/components/ChainSelector/ChainSelector.d.ts +2 -1
- package/dist/components/ChainSelector/ChainSelector.js +3 -3
- package/dist/components/ChainSelector/ChainSelector.js.map +1 -1
- package/dist/components/ChainSelector/ChainSelector.styled.js +15 -10
- package/dist/components/ChainSelector/ChainSelector.styled.js.map +1 -1
- package/dist/components/Logo/Logo.d.ts +4 -0
- package/dist/components/Logo/Logo.js +8 -0
- package/dist/components/Logo/Logo.js.map +1 -0
- package/dist/components/Logo/Logo.stories.d.ts +7 -0
- package/dist/components/Logo/Logo.stories.js +12 -0
- package/dist/components/Logo/Logo.stories.js.map +1 -0
- package/dist/components/Logo/Logo.styled.d.ts +6 -0
- package/dist/components/Logo/Logo.styled.js +13 -0
- package/dist/components/Logo/Logo.styled.js.map +1 -0
- package/dist/components/Modal/Modal.styled.js +3 -2
- package/dist/components/Modal/Modal.styled.js.map +1 -1
- package/dist/components/Modal/Modal.types.d.ts +1 -1
- package/dist/components/Navbar/MainMenu/MainMenu.d.ts +2 -0
- package/dist/components/Navbar/MainMenu/MainMenu.js +10 -0
- package/dist/components/Navbar/MainMenu/MainMenu.js.map +1 -0
- package/dist/components/Navbar/MainMenu/MainMenu.styled.d.ts +8 -0
- package/dist/components/Navbar/MainMenu/MainMenu.styled.js +38 -0
- package/dist/components/Navbar/MainMenu/MainMenu.styled.js.map +1 -0
- package/dist/components/Navbar/MainMenu/MainMenu.types.d.ts +8 -0
- package/dist/components/Navbar/MainMenu/MainMenu.types.js +2 -0
- package/dist/components/Navbar/MainMenu/MainMenu.types.js.map +1 -0
- package/dist/components/Navbar/MenuItem/MenuItem.d.ts +3 -0
- package/dist/components/Navbar/MenuItem/MenuItem.js +15 -0
- package/dist/components/Navbar/MenuItem/MenuItem.js.map +1 -0
- package/dist/components/Navbar/MenuItem/MenuItem.styled.d.ts +13 -0
- package/dist/components/Navbar/MenuItem/MenuItem.styled.js +54 -0
- package/dist/components/Navbar/MenuItem/MenuItem.styled.js.map +1 -0
- package/dist/components/Navbar/MenuItem/MenuItem.types.d.ts +9 -0
- package/dist/components/Navbar/MenuItem/MenuItem.types.js +2 -0
- package/dist/components/Navbar/MenuItem/MenuItem.types.js.map +1 -0
- package/dist/components/Navbar/Navbar.d.ts +4 -0
- package/dist/components/Navbar/Navbar.defaults.d.ts +6 -0
- package/dist/components/Navbar/Navbar.defaults.js +220 -0
- package/dist/components/Navbar/Navbar.defaults.js.map +1 -0
- package/dist/components/Navbar/Navbar.js +46 -0
- package/dist/components/Navbar/Navbar.js.map +1 -0
- package/dist/components/Navbar/Navbar.stories.d.ts +9 -0
- package/dist/components/Navbar/Navbar.stories.js +61 -0
- package/dist/components/Navbar/Navbar.stories.js.map +1 -0
- package/dist/components/Navbar/Navbar.styled.d.ts +47 -0
- package/dist/components/Navbar/Navbar.styled.js +106 -0
- package/dist/components/Navbar/Navbar.styled.js.map +1 -0
- package/dist/components/Navbar/Navbar.types.d.ts +57 -0
- package/dist/components/Navbar/Navbar.types.js +10 -0
- package/dist/components/Navbar/Navbar.types.js.map +1 -0
- package/dist/components/Navbar/SubMenu/SubMenu.d.ts +2 -0
- package/dist/components/Navbar/SubMenu/SubMenu.js +14 -0
- package/dist/components/Navbar/SubMenu/SubMenu.js.map +1 -0
- package/dist/components/Navbar/SubMenu/SubMenu.styled.d.ts +26 -0
- package/dist/components/Navbar/SubMenu/SubMenu.styled.js +156 -0
- package/dist/components/Navbar/SubMenu/SubMenu.styled.js.map +1 -0
- package/dist/components/Navbar/SubMenu/SubMenu.types.d.ts +13 -0
- package/dist/components/Navbar/SubMenu/SubMenu.types.js +2 -0
- package/dist/components/Navbar/SubMenu/SubMenu.types.js.map +1 -0
- package/dist/components/Navbar/SubMenuColumn/SubMenuColumn.d.ts +3 -0
- package/dist/components/Navbar/SubMenuColumn/SubMenuColumn.js +9 -0
- package/dist/components/Navbar/SubMenuColumn/SubMenuColumn.js.map +1 -0
- package/dist/components/Navbar/SubMenuColumn/SubMenuColumn.styled.d.ts +11 -0
- package/dist/components/Navbar/SubMenuColumn/SubMenuColumn.styled.js +33 -0
- package/dist/components/Navbar/SubMenuColumn/SubMenuColumn.styled.js.map +1 -0
- package/dist/components/Navbar/SubMenuColumn/SubMenuColumn.types.d.ts +5 -0
- package/dist/components/Navbar/SubMenuColumn/SubMenuColumn.types.js +2 -0
- package/dist/components/Navbar/SubMenuColumn/SubMenuColumn.types.js.map +1 -0
- package/dist/components/Navbar/SubMenuItem/SubMenuItem.d.ts +2 -0
- package/dist/components/Navbar/SubMenuItem/SubMenuItem.js +16 -0
- package/dist/components/Navbar/SubMenuItem/SubMenuItem.js.map +1 -0
- package/dist/components/Navbar/SubMenuItem/SubMenuItem.styled.d.ts +28 -0
- package/dist/components/Navbar/SubMenuItem/SubMenuItem.styled.js +65 -0
- package/dist/components/Navbar/SubMenuItem/SubMenuItem.styled.js.map +1 -0
- package/dist/components/Navbar/SubMenuItem/SubMenuItem.types.d.ts +13 -0
- package/dist/components/Navbar/SubMenuItem/SubMenuItem.types.js +2 -0
- package/dist/components/Navbar/SubMenuItem/SubMenuItem.types.js.map +1 -0
- package/dist/components/Navbar/index.d.ts +2 -0
- package/dist/components/Navbar/index.js +3 -0
- package/dist/components/Navbar/index.js.map +1 -0
- package/dist/components/Notifications/Notifications.types.d.ts +3 -2
- package/dist/components/Notifications/NotificationsFeed.types.d.ts +2 -1
- package/dist/components/Notifications/NotificationsFeedTabs.js +1 -1
- package/dist/components/Notifications/NotificationsFeedTabs.js.map +1 -1
- package/dist/components/Notifications/NotificationsFeedTabs.types.d.ts +2 -1
- package/dist/components/Notifications/index.d.ts +3 -2
- package/dist/components/Notifications/index.js +1 -1
- package/dist/components/Notifications/index.js.map +1 -1
- package/dist/components/Notifications/types.d.ts +2 -1
- package/dist/components/Notifications/types.js +1 -1
- package/dist/components/Notifications/types.js.map +1 -1
- package/dist/components/UserMenu/ManaBalances/index.d.ts +1 -1
- package/dist/components/UserMenu/UserMenu.js +1 -1
- package/dist/components/UserMenu/UserMenu.js.map +1 -1
- package/dist/components/UserMenu/UserMenu.styled.js +12 -7
- package/dist/components/UserMenu/UserMenu.styled.js.map +1 -1
- package/dist/components/UserMenu/UserMenu.types.d.ts +3 -2
- package/dist/components/UserMenu/UserMenu.types.js.map +1 -1
- package/dist/components/UserMenu/UserMenuSignedIn/UserMenuSignedIn.styled.js +35 -29
- package/dist/components/UserMenu/UserMenuSignedIn/UserMenuSignedIn.styled.js.map +1 -1
- package/dist/components/UserMenu/UserMenuSignedIn/UserMenuSignedIn.types.d.ts +2 -2
- package/dist/components/UserMenu/index.d.ts +2 -2
- package/dist/config/env/dev.json +4 -2
- package/dist/config/env/prod.json +4 -2
- package/dist/config/env/stg.json +5 -3
- package/dist/data/notifications.d.ts +1 -1
- package/dist/data/notifications.js +1 -1
- package/dist/data/notifications.js.map +1 -1
- package/dist/theme/index.js +9 -0
- package/dist/theme/index.js.map +1 -1
- package/package.json +2 -2
@@ -0,0 +1,220 @@
|
|
1
|
+
import { config } from "../../config";
|
2
|
+
const navbarMainTitlesI18N = {
|
3
|
+
marketplace: "marketplace",
|
4
|
+
create: "create",
|
5
|
+
explore: "explore",
|
6
|
+
learn: "learn",
|
7
|
+
governance: "governance",
|
8
|
+
};
|
9
|
+
const i18nChainSelectorDefault = {
|
10
|
+
title: "Select a network",
|
11
|
+
connected: "Connected",
|
12
|
+
confirmInWallet: "Confirm in wallet",
|
13
|
+
};
|
14
|
+
const navbarSubmenu = {
|
15
|
+
marketplace: {
|
16
|
+
column1: [
|
17
|
+
{
|
18
|
+
title: "Overview",
|
19
|
+
description: "See what's trending & new",
|
20
|
+
url: config.get("MARKETPLACE_URL"),
|
21
|
+
eventTrackingName: "marketplace_overview",
|
22
|
+
},
|
23
|
+
{
|
24
|
+
title: "NAMEs",
|
25
|
+
description: "Claim a NAME, get a whole World",
|
26
|
+
url: config.get("MARKETPLACE_NAMES_URL"),
|
27
|
+
eventTrackingName: "marketplace_names",
|
28
|
+
},
|
29
|
+
],
|
30
|
+
column2: [
|
31
|
+
{
|
32
|
+
title: "Wearables",
|
33
|
+
description: "Customize your digital identity",
|
34
|
+
url: config.get("MARKETPLACE_WEARABLES_URL"),
|
35
|
+
eventTrackingName: "marketplace_wearables",
|
36
|
+
},
|
37
|
+
{
|
38
|
+
title: "LAND",
|
39
|
+
description: "Buy or Rent parcels on the Genesis City map",
|
40
|
+
url: config.get("MARKETPLACE_LANDS_URL"),
|
41
|
+
eventTrackingName: "marketplace_lands",
|
42
|
+
},
|
43
|
+
],
|
44
|
+
column3: [
|
45
|
+
{
|
46
|
+
title: "Emotes",
|
47
|
+
description: "Animate your avatar",
|
48
|
+
url: config.get("MARKETPLACE_EMOTES_URL"),
|
49
|
+
eventTrackingName: "marketplace_emotes",
|
50
|
+
},
|
51
|
+
{
|
52
|
+
title: "My Assets",
|
53
|
+
description: "Manage your assets, listings, bids, & more",
|
54
|
+
url: config.get("MARKETPLACE_MY_ASSETS_URL"),
|
55
|
+
eventTrackingName: "marketplace_my_assets",
|
56
|
+
},
|
57
|
+
],
|
58
|
+
},
|
59
|
+
create: {
|
60
|
+
column1: [
|
61
|
+
{
|
62
|
+
title: "Create in Decentraland",
|
63
|
+
description: "Discover all the benefits and possibilities",
|
64
|
+
url: config.get("LANDING_CREATORS_URL"),
|
65
|
+
eventTrackingName: "landing_creators",
|
66
|
+
},
|
67
|
+
{
|
68
|
+
title: "Decentraland Studios",
|
69
|
+
description: "Hire pros to transform your ideas to reality",
|
70
|
+
url: config.get("STUDIOS_URL"),
|
71
|
+
eventTrackingName: "studios",
|
72
|
+
isExternal: true,
|
73
|
+
},
|
74
|
+
],
|
75
|
+
column2Title: "PUBLISH",
|
76
|
+
column2: [
|
77
|
+
{
|
78
|
+
title: "Wearables & Emotes",
|
79
|
+
description: "Publish & manage Marketplace collections",
|
80
|
+
url: config.get("BUILDER_WEARABLE_EMOTES_URL"),
|
81
|
+
eventTrackingName: "builder_wearables_emotes",
|
82
|
+
},
|
83
|
+
{
|
84
|
+
title: "Scenes",
|
85
|
+
description: "Create & publish scenes to LAND or Worlds",
|
86
|
+
url: config.get("BUILDER_SCENES_URL"),
|
87
|
+
eventTrackingName: "builder_scenes",
|
88
|
+
},
|
89
|
+
],
|
90
|
+
column3Title: "MANAGE",
|
91
|
+
column3: [
|
92
|
+
{
|
93
|
+
title: "My NAMEs",
|
94
|
+
description: "Create & manage NAMEs",
|
95
|
+
url: config.get("BUILDER_NAMES_URL"),
|
96
|
+
eventTrackingName: "builder_names",
|
97
|
+
},
|
98
|
+
{
|
99
|
+
title: "My Worlds",
|
100
|
+
description: "Manage Worlds & Worlds storage",
|
101
|
+
url: config.get("BUILDER_WORLDS_URL"),
|
102
|
+
eventTrackingName: "builder_worlds",
|
103
|
+
},
|
104
|
+
{
|
105
|
+
title: "My LAND",
|
106
|
+
description: "Manage parcel permissions & more",
|
107
|
+
url: config.get("BUILDER_LAND_URL"),
|
108
|
+
eventTrackingName: "builder_land",
|
109
|
+
},
|
110
|
+
],
|
111
|
+
},
|
112
|
+
explore: {
|
113
|
+
column1: [
|
114
|
+
{
|
115
|
+
title: "Events",
|
116
|
+
description: "Find an event to jump into",
|
117
|
+
url: config.get("EVENTS_URL"),
|
118
|
+
eventTrackingName: "events",
|
119
|
+
},
|
120
|
+
{
|
121
|
+
title: "My Events",
|
122
|
+
description: "See saved events & events you’re hosting",
|
123
|
+
url: config.get("EVENTS_MY_EVENTS"),
|
124
|
+
eventTrackingName: "events_my_events",
|
125
|
+
},
|
126
|
+
],
|
127
|
+
column2: [
|
128
|
+
{
|
129
|
+
title: "Places",
|
130
|
+
description: "Browse locations in Genesis City & Worlds",
|
131
|
+
url: config.get("PLACES_URL"),
|
132
|
+
eventTrackingName: "places",
|
133
|
+
},
|
134
|
+
{
|
135
|
+
title: "My Favorite Places",
|
136
|
+
description: "See your saved locations",
|
137
|
+
url: config.get("PLACES_MY_FAVORITE_URL"),
|
138
|
+
eventTrackingName: "places_my_favorite",
|
139
|
+
},
|
140
|
+
],
|
141
|
+
},
|
142
|
+
learn: {
|
143
|
+
column1: [
|
144
|
+
{
|
145
|
+
title: "About Decentraland",
|
146
|
+
description: "FAQs, Whitepaper, & DAO docs",
|
147
|
+
url: config.get("DOCS_ABOUT_URL"),
|
148
|
+
eventTrackingName: "docs_about",
|
149
|
+
},
|
150
|
+
{
|
151
|
+
title: "Creator Docs",
|
152
|
+
description: "Make Wearables, Emotes, scenes, games, & more",
|
153
|
+
url: config.get("DOCS_CREATORS_URL"),
|
154
|
+
eventTrackingName: "docs_creators",
|
155
|
+
},
|
156
|
+
],
|
157
|
+
column2: [
|
158
|
+
{
|
159
|
+
title: "Blog",
|
160
|
+
description: "News, Community Highlights, & more",
|
161
|
+
url: config.get("BLOG_URL"),
|
162
|
+
eventTrackingName: "blog",
|
163
|
+
isExternal: true,
|
164
|
+
},
|
165
|
+
{
|
166
|
+
title: "Open Protocol Docs",
|
167
|
+
description: "See how Decentraland works & contribute",
|
168
|
+
url: config.get("DOCS_CONTRIBUTOR_URL"),
|
169
|
+
eventTrackingName: "docs_contributor",
|
170
|
+
},
|
171
|
+
],
|
172
|
+
},
|
173
|
+
governance: {
|
174
|
+
column1: [
|
175
|
+
{
|
176
|
+
title: "Overview",
|
177
|
+
description: "The latest in Decentraland governance",
|
178
|
+
url: config.get("GOVERNANCE_URL"),
|
179
|
+
eventTrackingName: "governance_overview",
|
180
|
+
},
|
181
|
+
{
|
182
|
+
title: "DAO Transparency",
|
183
|
+
description: "Treasury, Activity Dashboards, & more",
|
184
|
+
url: config.get("GOVERNANCE_TRANSPARENCY_URL"),
|
185
|
+
eventTrackingName: "governance_transparency",
|
186
|
+
},
|
187
|
+
],
|
188
|
+
column2: [
|
189
|
+
{
|
190
|
+
title: "Proposals",
|
191
|
+
description: "Vote on active proposals",
|
192
|
+
url: config.get("GOVERNANCE_PROPOSALS_URL"),
|
193
|
+
eventTrackingName: "governance_proposals",
|
194
|
+
},
|
195
|
+
{
|
196
|
+
title: "DAO Grants",
|
197
|
+
description: "Community grants overview, highlights, & resources",
|
198
|
+
url: config.get("DAO_GRANTS_URL"),
|
199
|
+
eventTrackingName: "dao_grants",
|
200
|
+
isExternal: true,
|
201
|
+
},
|
202
|
+
],
|
203
|
+
column3: [
|
204
|
+
{
|
205
|
+
title: "Active Grants",
|
206
|
+
description: "Browse grant-funded community projects",
|
207
|
+
url: config.get("GOVERNANCE_PROJECTS_URL"),
|
208
|
+
eventTrackingName: "governance_active_grants",
|
209
|
+
},
|
210
|
+
{
|
211
|
+
title: "DAO Docs",
|
212
|
+
description: "Learn about the DAO & how to participate",
|
213
|
+
url: config.get("DOCS_DAO_URL"),
|
214
|
+
eventTrackingName: "docs_dao",
|
215
|
+
},
|
216
|
+
],
|
217
|
+
},
|
218
|
+
};
|
219
|
+
export { navbarMainTitlesI18N, i18nChainSelectorDefault, navbarSubmenu };
|
220
|
+
//# sourceMappingURL=Navbar.defaults.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Navbar.defaults.js","sourceRoot":"","sources":["../../../src/components/Navbar/Navbar.defaults.ts"],"names":[],"mappings":"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"}
|
@@ -0,0 +1,46 @@
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
2
|
+
import React, { useCallback, useState } from "react";
|
3
|
+
import { Toolbar } from "@mui/material";
|
4
|
+
import { MainMenu } from "./MainMenu/MainMenu";
|
5
|
+
import { i18nChainSelectorDefault, navbarMainTitlesI18N as i18nNavbarTitlesDefault, navbarSubmenu, } from "./Navbar.defaults";
|
6
|
+
import { SubMenu } from "./SubMenu/SubMenu";
|
7
|
+
import { ChainSelector } from "../ChainSelector";
|
8
|
+
import { Logo } from "../Logo/Logo";
|
9
|
+
import { TabletAndBelow, useTabletAndBelowMediaQuery } from "../Media";
|
10
|
+
import { UserMenu } from "../UserMenu";
|
11
|
+
import { i18n as i18nUserMenuDefault } from "../UserMenu/UserMenu.i18n";
|
12
|
+
import { AppBarDesktopWrapper, AppBarRightWrapper, AppBarWrapper, DclAppBar, LogoLink, MenuIcon, MenuIconBar, MenuModal, } from "./Navbar.styled";
|
13
|
+
const Navbar = React.memo((props) => {
|
14
|
+
const { activePage, chains, chainBeingConfirmed, onSelectChain, selectedChain, isSignedIn, i18nNavbar = i18nNavbarTitlesDefault, i18nUserMenu = i18nUserMenuDefault, i18nChainSelector = i18nChainSelectorDefault, submenuItems = navbarSubmenu, onClickNavbarItem, ...userMenuProps } = props;
|
15
|
+
const [toggle, setToggle] = useState(false);
|
16
|
+
const [selectedMenu, setSelectedMenu] = useState();
|
17
|
+
const [menuMobileOpen, setMenuMobileOpen] = useState(false);
|
18
|
+
const isTabletAndBelow = useTabletAndBelowMediaQuery();
|
19
|
+
const handleToggle = useCallback((_e, show, section) => {
|
20
|
+
setToggle(show);
|
21
|
+
setSelectedMenu(show && section);
|
22
|
+
}, [setToggle, setSelectedMenu]);
|
23
|
+
const handleClickMenu = useCallback((event, options) => {
|
24
|
+
onClickNavbarItem && onClickNavbarItem(event, options);
|
25
|
+
}, [onClickNavbarItem]);
|
26
|
+
const handleMobileToggle = useCallback((_e, show) => {
|
27
|
+
if (!show) {
|
28
|
+
setToggle(false);
|
29
|
+
}
|
30
|
+
setMenuMobileOpen(show);
|
31
|
+
}, [setToggle, setMenuMobileOpen]);
|
32
|
+
const handleUserMenuOpen = useCallback((event, trackingId) => {
|
33
|
+
if (userMenuProps.onClickOpen) {
|
34
|
+
userMenuProps.onClickOpen(event, trackingId);
|
35
|
+
}
|
36
|
+
handleMobileToggle(event, false);
|
37
|
+
}, [userMenuProps.onClickOpen, handleMobileToggle]);
|
38
|
+
return (_jsxs(_Fragment, { children: [_jsx(DclAppBar, { isSubmenuOpen: toggle, isMobileOpen: menuMobileOpen, children: _jsx(Toolbar, { children: _jsxs(AppBarWrapper, { children: [_jsx(TabletAndBelow, { children: _jsxs(MenuIcon, { "aria-label": "menu", onClick: (e) => handleMobileToggle(e, !menuMobileOpen), children: [_jsx(MenuIconBar, { isOpen: menuMobileOpen }), _jsx(MenuIconBar, { isOpen: menuMobileOpen })] }) }), _jsxs(AppBarDesktopWrapper, { children: [_jsx(LogoLink, { isMobile: isTabletAndBelow, href: "https://decentraland.org", children: _jsx(Logo, {}) }), _jsx(MainMenu, { activePage: activePage, onToggleShowSubMenu: handleToggle, i18n: i18nNavbar, isMobile: false })] }), _jsxs(AppBarRightWrapper, { children: [isSignedIn &&
|
39
|
+
onSelectChain &&
|
40
|
+
chains?.length &&
|
41
|
+
selectedChain ? (_jsx(ChainSelector, { chains: chains, selectedChain: selectedChain, chainBeingConfirmed: chainBeingConfirmed, i18n: i18nChainSelector, onSelectChain: onSelectChain })) : null, _jsx(UserMenu, { ...userMenuProps, onClickOpen: isTabletAndBelow
|
42
|
+
? handleUserMenuOpen
|
43
|
+
: userMenuProps.onClickOpen, isSignedIn: isSignedIn, i18n: i18nUserMenu })] })] }) }) }), _jsx(SubMenu, { selectedMenu: selectedMenu, onToggleShowSubMenu: handleToggle, onClickMenuOption: handleClickMenu, submenus: submenuItems }), _jsx(MenuModal, { open: isTabletAndBelow && menuMobileOpen, onClose: (event) => handleMobileToggle(event, false), children: _jsxs(_Fragment, { children: [_jsx(MainMenu, { activePage: activePage, onToggleShowSubMenu: handleToggle, isOpenOnMobile: menuMobileOpen, i18n: i18nNavbar, isMobile: true }), _jsx(SubMenu, { selectedMenu: selectedMenu, onToggleShowSubMenu: handleToggle, onClickMenuOption: handleClickMenu, isMobile: isTabletAndBelow, submenus: submenuItems })] }) })] }));
|
44
|
+
});
|
45
|
+
export { Navbar };
|
46
|
+
//# sourceMappingURL=Navbar.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Navbar.js","sourceRoot":"","sources":["../../../src/components/Navbar/Navbar.tsx"],"names":[],"mappings":"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"}
|
@@ -0,0 +1,9 @@
|
|
1
|
+
import { NavbarProps } from "./Navbar.types";
|
2
|
+
import type { Meta, StoryObj } from "@storybook/react";
|
3
|
+
declare const meta: Meta;
|
4
|
+
type Story = StoryObj<NavbarProps>;
|
5
|
+
declare const Simple: Story;
|
6
|
+
declare const WithScroll: Story;
|
7
|
+
declare const WithChainSelector: Story;
|
8
|
+
export default meta;
|
9
|
+
export { Simple, WithScroll, WithChainSelector };
|
@@ -0,0 +1,61 @@
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
|
+
import { useState } from "react";
|
3
|
+
import { ChainId } from "@dcl/schemas";
|
4
|
+
import { Box, Toolbar, Typography } from "@mui/material";
|
5
|
+
import { Navbar } from "./Navbar";
|
6
|
+
import { avatar } from "../../data/avatar";
|
7
|
+
import { itemSoldNotificationPropsData } from "../../data/notifications";
|
8
|
+
import { NotificationActiveTab } from "../Notifications";
|
9
|
+
import { NavbarPages } from "./Navbar.types";
|
10
|
+
const meta = {
|
11
|
+
component: Navbar,
|
12
|
+
title: "Decentraland UI/Navbar",
|
13
|
+
argTypes: {},
|
14
|
+
render: (args) => _jsx(Navbar, { activePage: NavbarPages.MARKETPLACE, ...args }),
|
15
|
+
};
|
16
|
+
const Simple = {
|
17
|
+
render: (args) => _jsx(Navbar, { ...args, activePage: NavbarPages.CREATE }),
|
18
|
+
};
|
19
|
+
const WithScroll = {
|
20
|
+
render: (args) => (_jsxs(Box, { sx: { display: "flex" }, children: [_jsx(Navbar, { ...args, activePage: NavbarPages.CREATE }), _jsxs(Box, { children: [_jsx(Toolbar, {}), _jsx(Typography, { variant: "h1", children: "Lorem ipsum dolor." }), _jsx(Typography, { children: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Similique unde fugit veniam eius, perspiciatis sunt? Corporis qui ducimus quibusdam, aliquam dolore excepturi quae. Distinctio enim at eligendi perferendis in cum quibusdam sed quae, accusantium et aperiam? Quod itaque exercitationem, at ab sequi qui modi delectus quia corrupti alias distinctio nostrum. Minima ex dolor modi inventore sapiente necessitatibus aliquam fuga et. Sed numquam quibusdam at officia sapiente porro maxime corrupti perspiciatis asperiores, exercitationem eius nostrum consequuntur iure aliquam itaque, assumenda et! Quibusdam temporibus beatae doloremque voluptatum doloribus soluta accusamus porro reprehenderit eos inventore facere, fugit, molestiae ab officiis illo voluptates recusandae. Vel dolor nobis eius, ratione atque soluta, aliquam fugit qui iste architecto perspiciatis. Nobis, voluptatem! Cumque, eligendi unde aliquid minus quis sit debitis obcaecati error, delectus quo eius exercitationem tempore. Delectus sapiente, provident corporis dolorum quibusdam aut beatae repellendus est labore quisquam praesentium repudiandae non vel laboriosam quo ab perferendis velit ipsa deleniti modi! Ipsam, illo quod. Nesciunt commodi nihil corrupti cum non fugiat praesentium doloremque architecto laborum aliquid. Quae, maxime recusandae? Eveniet dolore molestiae dicta blanditiis est expedita eius debitis cupiditate porro sed aspernatur quidem, repellat nihil quasi praesentium quia eos, quibusdam provident. Incidunt tempore vel placeat voluptate iure labore, repellendus beatae quia unde est aliquid dolor molestias libero. Reiciendis similique exercitationem consequatur, nobis placeat illo laudantium! Enim perferendis nulla soluta magni error, provident repellat similique cupiditate ipsam, et tempore cumque quod! Qui, iure suscipit tempora unde rerum autem saepe nisi vel cupiditate iusto. Illum, corrupti? Fugiat quidem accusantium nulla. Aliquid inventore commodi reprehenderit rerum reiciendis! Quidem alias repudiandae eaque eveniet cumque nihil aliquam in expedita, impedit quas ipsum nesciunt ipsa ullam consequuntur dignissimos numquam at nisi porro a, quaerat rem repellendus. Voluptates perspiciatis, in pariatur impedit, nam facilis libero dolorem dolores sunt inventore perferendis, aut sapiente modi nesciunt." }), _jsx("img", { src: "https://www.adobe.com/au/products/firefly/features/media_179d807b0123090143eea74eea2d7cf4e7aa962ae.png?width=2000&format=webply&optimize=medium", style: { width: "100%" } }), _jsx(Typography, { children: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Similique unde fugit veniam eius, perspiciatis sunt? Corporis qui ducimus quibusdam, aliquam dolore excepturi quae. Distinctio enim at eligendi perferendis in cum quibusdam sed quae, accusantium et aperiam? Quod itaque exercitationem, at ab sequi qui modi delectus quia corrupti alias distinctio nostrum. Minima ex dolor modi inventore sapiente necessitatibus aliquam fuga et. Sed numquam quibusdam at officia sapiente porro maxime corrupti perspiciatis asperiores, exercitationem eius nostrum consequuntur iure aliquam itaque, assumenda et! Quibusdam temporibus beatae doloremque voluptatum doloribus soluta accusamus porro reprehenderit eos inventore facere, fugit, molestiae ab officiis illo voluptates recusandae. Vel dolor nobis eius, ratione atque soluta, aliquam fugit qui iste architecto perspiciatis. Nobis, voluptatem! Cumque, eligendi unde aliquid minus quis sit debitis obcaecati error, delectus quo eius exercitationem tempore. Delectus sapiente, provident corporis dolorum quibusdam aut beatae repellendus est labore quisquam praesentium repudiandae non vel laboriosam quo ab perferendis velit ipsa deleniti modi! Ipsam, illo quod. Nesciunt commodi nihil corrupti cum non fugiat praesentium doloremque architecto laborum aliquid. Quae, maxime recusandae? Eveniet dolore molestiae dicta blanditiis est expedita eius debitis cupiditate porro sed aspernatur quidem, repellat nihil quasi praesentium quia eos, quibusdam provident. Incidunt tempore vel placeat voluptate iure labore, repellendus beatae quia unde est aliquid dolor molestias libero. Reiciendis similique exercitationem consequatur, nobis placeat illo laudantium! Enim perferendis nulla soluta magni error, provident repellat similique cupiditate ipsam, et tempore cumque quod! Qui, iure suscipit tempora unde rerum autem saepe nisi vel cupiditate iusto. Illum, corrupti? Fugiat quidem accusantium nulla. Aliquid inventore commodi reprehenderit rerum reiciendis! Quidem alias repudiandae eaque eveniet cumque nihil aliquam in expedita, impedit quas ipsum nesciunt ipsa ullam consequuntur dignissimos numquam at nisi porro a, quaerat rem repellendus. Voluptates perspiciatis, in pariatur impedit, nam facilis libero dolorem dolores sunt inventore perferendis, aut sapiente modi nesciunt." })] })] })),
|
21
|
+
};
|
22
|
+
const WithChainSelector = {
|
23
|
+
args: {
|
24
|
+
activePage: NavbarPages.MARKETPLACE,
|
25
|
+
isSignedIn: true,
|
26
|
+
chains: [
|
27
|
+
ChainId.ETHEREUM_MAINNET,
|
28
|
+
ChainId.MATIC_MAINNET,
|
29
|
+
ChainId.ARBITRUM_MAINNET,
|
30
|
+
ChainId.OPTIMISM_MAINNET,
|
31
|
+
ChainId.BSC_MAINNET,
|
32
|
+
ChainId.FANTOM_MAINNET,
|
33
|
+
ChainId.AVALANCHE_MAINNET,
|
34
|
+
],
|
35
|
+
chainBeingConfirmed: ChainId.MATIC_MAINNET,
|
36
|
+
selectedChain: ChainId.ETHEREUM_MAINNET,
|
37
|
+
onSelectChain: (chain) => console.log("Selected chain", chain),
|
38
|
+
avatar: avatar,
|
39
|
+
onClickSignIn: () => console.log("Clicked on sign in"),
|
40
|
+
},
|
41
|
+
render: (args) => {
|
42
|
+
const [openNotification, setOpenNotification] = useState(false);
|
43
|
+
const [tab, setTab] = useState(NotificationActiveTab.NEWEST);
|
44
|
+
return (_jsx(Navbar, { ...args, notifications: {
|
45
|
+
isOnboarding: false,
|
46
|
+
isOpen: openNotification,
|
47
|
+
isLoading: false,
|
48
|
+
items: [itemSoldNotificationPropsData],
|
49
|
+
locale: "en",
|
50
|
+
activeTab: tab,
|
51
|
+
onBegin: console.log,
|
52
|
+
onChangeTab: (_e, tab) => setTab(tab),
|
53
|
+
onClick: () => setOpenNotification(true),
|
54
|
+
onClose: () => setOpenNotification(false),
|
55
|
+
} }));
|
56
|
+
},
|
57
|
+
};
|
58
|
+
// eslint-disable-next-line import/no-default-export
|
59
|
+
export default meta;
|
60
|
+
export { Simple, WithScroll, WithChainSelector };
|
61
|
+
//# sourceMappingURL=Navbar.stories.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Navbar.stories.js","sourceRoot":"","sources":["../../../src/components/Navbar/Navbar.stories.tsx"],"names":[],"mappings":"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"}
|
@@ -0,0 +1,47 @@
|
|
1
|
+
declare const DclAppBar: import("@emotion/styled").StyledComponent<import("@mui/material").AppBarOwnProps & Omit<import("@mui/material").PaperOwnProps, "color" | "position" | "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & {
|
2
|
+
ref?: ((instance: HTMLElement | null) => void) | import("react").RefObject<HTMLElement> | null | undefined;
|
3
|
+
}, "style" | "color" | "position" | "classes" | "className" | "children" | "square" | "sx" | "variant" | "elevation" | "enableColorOnDark"> & {
|
4
|
+
theme?: import("@emotion/react").Theme;
|
5
|
+
} & {
|
6
|
+
isSubmenuOpen: boolean;
|
7
|
+
isMobileOpen: boolean;
|
8
|
+
}, {}, {}>;
|
9
|
+
declare const LogoLink: import("@emotion/styled").StyledComponent<import("@mui/material").LinkOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
|
10
|
+
ref?: ((instance: HTMLAnchorElement | null) => void) | import("react").RefObject<HTMLAnchorElement> | null | undefined;
|
11
|
+
}, "p" | "style" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "classes" | "className" | "children" | "sx" | "variant" | "align" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping" | "underline" | "TypographyClasses"> & {
|
12
|
+
theme?: import("@emotion/react").Theme;
|
13
|
+
} & {
|
14
|
+
isMobile?: boolean;
|
15
|
+
}, {}, {}>;
|
16
|
+
declare const AppBarDesktopWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
17
|
+
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
18
|
+
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & {
|
19
|
+
theme?: import("@emotion/react").Theme;
|
20
|
+
}, {}, {}>;
|
21
|
+
declare const AppBarWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
22
|
+
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
23
|
+
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & {
|
24
|
+
theme?: import("@emotion/react").Theme;
|
25
|
+
}, {}, {}>;
|
26
|
+
declare const AppBarRightWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
27
|
+
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
28
|
+
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & {
|
29
|
+
theme?: import("@emotion/react").Theme;
|
30
|
+
}, {}, {}>;
|
31
|
+
declare const MenuIcon: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
|
32
|
+
ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
|
33
|
+
}, "style" | "color" | "classes" | "className" | "tabIndex" | "children" | "size" | "sx" | "variant" | "href" | "disabled" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "disableElevation" | "endIcon" | "fullWidth" | "startIcon"> & {
|
34
|
+
theme?: import("@emotion/react").Theme;
|
35
|
+
}, {}, {}>;
|
36
|
+
declare const MenuIconBar: import("@emotion/styled").StyledComponent<{
|
37
|
+
theme?: import("@emotion/react").Theme;
|
38
|
+
as?: import("react").ElementType;
|
39
|
+
} & {
|
40
|
+
isOpen: boolean;
|
41
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
42
|
+
declare const MenuModal: import("@emotion/styled").StyledComponent<import("@mui/material").ModalOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
43
|
+
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
44
|
+
}, "style" | "container" | "classes" | "className" | "children" | "sx" | "slots" | "slotProps" | "open" | "onClose" | "BackdropComponent" | "BackdropProps" | "closeAfterTransition" | "components" | "componentsProps" | "disableAutoFocus" | "disableEnforceFocus" | "disableEscapeKeyDown" | "disablePortal" | "disableRestoreFocus" | "disableScrollLock" | "hideBackdrop" | "keepMounted" | "onBackdropClick" | "onTransitionEnter" | "onTransitionExited"> & {
|
45
|
+
theme?: import("@emotion/react").Theme;
|
46
|
+
}, {}, {}>;
|
47
|
+
export { DclAppBar, LogoLink, AppBarDesktopWrapper, AppBarWrapper, AppBarRightWrapper, MenuIcon, MenuIconBar, MenuModal, };
|
@@ -0,0 +1,106 @@
|
|
1
|
+
import zIndex from "@mui/material/styles/zIndex";
|
2
|
+
import styled from "@emotion/styled";
|
3
|
+
import { AppBar, Box, Button, Link, Modal, useTheme } from "@mui/material";
|
4
|
+
const DclAppBar = styled(AppBar)((props) => {
|
5
|
+
const { isSubmenuOpen, isMobileOpen } = props;
|
6
|
+
let openedStyles;
|
7
|
+
if (isSubmenuOpen || isMobileOpen) {
|
8
|
+
openedStyles = {
|
9
|
+
boxShadow: "none",
|
10
|
+
backgroundImage: "none",
|
11
|
+
};
|
12
|
+
}
|
13
|
+
return { ...openedStyles };
|
14
|
+
});
|
15
|
+
const LogoLink = styled(Link)((props) => {
|
16
|
+
const { isMobile } = props;
|
17
|
+
let mobileStyles;
|
18
|
+
if (isMobile) {
|
19
|
+
mobileStyles = {
|
20
|
+
position: "absolute",
|
21
|
+
left: "50%",
|
22
|
+
transform: "translateX(-50%)",
|
23
|
+
zIndex: zIndex.appBar,
|
24
|
+
};
|
25
|
+
}
|
26
|
+
return {
|
27
|
+
height: "36px",
|
28
|
+
...mobileStyles,
|
29
|
+
};
|
30
|
+
});
|
31
|
+
const AppBarDesktopWrapper = styled(Box)({
|
32
|
+
display: "flex",
|
33
|
+
justifyContent: "flex-start",
|
34
|
+
alignItems: "center",
|
35
|
+
});
|
36
|
+
const AppBarWrapper = styled(Box)({
|
37
|
+
display: "flex",
|
38
|
+
justifyContent: "space-between",
|
39
|
+
width: "100%",
|
40
|
+
alignItems: "center",
|
41
|
+
});
|
42
|
+
const AppBarRightWrapper = styled(Box)({
|
43
|
+
display: "flex",
|
44
|
+
alignItems: "center",
|
45
|
+
});
|
46
|
+
const MenuIcon = styled(Button)(() => {
|
47
|
+
return {
|
48
|
+
height: "32px",
|
49
|
+
width: "32px",
|
50
|
+
minWidth: "32px",
|
51
|
+
position: "relative",
|
52
|
+
padding: 0,
|
53
|
+
"&:hover": {
|
54
|
+
backgroundColor: "transparent",
|
55
|
+
},
|
56
|
+
};
|
57
|
+
});
|
58
|
+
const MenuIconBar = styled("span")((props) => {
|
59
|
+
const { isOpen } = props;
|
60
|
+
const theme = useTheme();
|
61
|
+
let openedStyles;
|
62
|
+
if (isOpen) {
|
63
|
+
openedStyles = {
|
64
|
+
"&:nth-of-type(1)": {
|
65
|
+
top: "50%",
|
66
|
+
left: "50%",
|
67
|
+
transform: "translate(-50%, -50%) rotate(45deg)",
|
68
|
+
width: "33.94px",
|
69
|
+
},
|
70
|
+
"&:nth-of-type(2)": {
|
71
|
+
top: "50%",
|
72
|
+
left: "50%",
|
73
|
+
transform: "translate(-50%, -50%) rotate(-45deg)",
|
74
|
+
width: "33.94px",
|
75
|
+
},
|
76
|
+
};
|
77
|
+
}
|
78
|
+
return {
|
79
|
+
transition: `${theme.transitions.create(["top", "left", "width", "transform"], {
|
80
|
+
duration: theme.transitions.duration.shorter,
|
81
|
+
easing: theme.transitions.easing.easeInOut,
|
82
|
+
})}`,
|
83
|
+
height: "2px",
|
84
|
+
width: "100%",
|
85
|
+
backgroundColor: theme.palette.text.primary,
|
86
|
+
position: "absolute",
|
87
|
+
"&:nth-of-type(1)": {
|
88
|
+
top: "10.5px",
|
89
|
+
left: 0,
|
90
|
+
},
|
91
|
+
"&:nth-of-type(2)": {
|
92
|
+
top: "21.5px",
|
93
|
+
left: 0,
|
94
|
+
},
|
95
|
+
...openedStyles,
|
96
|
+
};
|
97
|
+
});
|
98
|
+
const MenuModal = styled(Modal)(() => {
|
99
|
+
return {
|
100
|
+
"& .MuiBackdrop-root.MuiModal-backdrop": {
|
101
|
+
backgroundColor: "transparent",
|
102
|
+
},
|
103
|
+
};
|
104
|
+
});
|
105
|
+
export { DclAppBar, LogoLink, AppBarDesktopWrapper, AppBarWrapper, AppBarRightWrapper, MenuIcon, MenuIconBar, MenuModal, };
|
106
|
+
//# sourceMappingURL=Navbar.styled.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Navbar.styled.js","sourceRoot":"","sources":["../../../src/components/Navbar/Navbar.styled.ts"],"names":[],"mappings":"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"}
|
@@ -0,0 +1,57 @@
|
|
1
|
+
import { ChainSelectorProps, ChainSelectori18n } from "../ChainSelector/ChainSelector.types";
|
2
|
+
import { UserMenuI18N, UserMenuProps } from "../UserMenu/UserMenu.types";
|
3
|
+
declare enum NavbarPages {
|
4
|
+
MARKETPLACE = "marketplace",
|
5
|
+
CREATE = "create",
|
6
|
+
EXPLORE = "explore",
|
7
|
+
LEARN = "learn",
|
8
|
+
GOVERNANCE = "governance"
|
9
|
+
}
|
10
|
+
type NavbarMenuI18nProps = Record<NavbarPages, NavbarPages>;
|
11
|
+
type NavbarSubMenuItemsProps = {
|
12
|
+
column1Title?: string;
|
13
|
+
column1: {
|
14
|
+
title: string;
|
15
|
+
description: string;
|
16
|
+
url: string;
|
17
|
+
eventTrackingName: string;
|
18
|
+
isExternal?: boolean;
|
19
|
+
}[];
|
20
|
+
column2Title?: string;
|
21
|
+
column2: {
|
22
|
+
title: string;
|
23
|
+
description: string;
|
24
|
+
url: string;
|
25
|
+
eventTrackingName: string;
|
26
|
+
isExternal?: boolean;
|
27
|
+
}[];
|
28
|
+
column3Title?: string;
|
29
|
+
column3?: {
|
30
|
+
title: string;
|
31
|
+
description: string;
|
32
|
+
url: string;
|
33
|
+
eventTrackingName: string;
|
34
|
+
isExternal?: boolean;
|
35
|
+
}[];
|
36
|
+
};
|
37
|
+
type NavbarSubmenuProps = {
|
38
|
+
marketplace: NavbarSubMenuItemsProps;
|
39
|
+
create: NavbarSubMenuItemsProps;
|
40
|
+
explore: NavbarSubMenuItemsProps;
|
41
|
+
learn: NavbarSubMenuItemsProps;
|
42
|
+
governance: NavbarSubMenuItemsProps;
|
43
|
+
};
|
44
|
+
type NavbarProps = Omit<UserMenuProps, "i18n"> & Partial<ChainSelectorProps> & {
|
45
|
+
i18nNavbar?: NavbarMenuI18nProps;
|
46
|
+
submenuItems?: NavbarSubmenuProps;
|
47
|
+
i18nUserMenu?: UserMenuI18N;
|
48
|
+
i18nChainSelector?: ChainSelectori18n;
|
49
|
+
activePage: NavbarPages | string;
|
50
|
+
onClickNavbarItem?: (event: React.MouseEvent<HTMLElement, MouseEvent>, options: {
|
51
|
+
eventTrackingName: string;
|
52
|
+
url?: string;
|
53
|
+
isExternal?: boolean;
|
54
|
+
}) => void;
|
55
|
+
};
|
56
|
+
export { NavbarPages };
|
57
|
+
export type { NavbarMenuI18nProps, NavbarSubMenuItemsProps, NavbarSubmenuProps, NavbarProps, };
|
@@ -0,0 +1,10 @@
|
|
1
|
+
var NavbarPages;
|
2
|
+
(function (NavbarPages) {
|
3
|
+
NavbarPages["MARKETPLACE"] = "marketplace";
|
4
|
+
NavbarPages["CREATE"] = "create";
|
5
|
+
NavbarPages["EXPLORE"] = "explore";
|
6
|
+
NavbarPages["LEARN"] = "learn";
|
7
|
+
NavbarPages["GOVERNANCE"] = "governance";
|
8
|
+
})(NavbarPages || (NavbarPages = {}));
|
9
|
+
export { NavbarPages };
|
10
|
+
//# sourceMappingURL=Navbar.types.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Navbar.types.js","sourceRoot":"","sources":["../../../src/components/Navbar/Navbar.types.ts"],"names":[],"mappings":"AAMA,IAAK,WAMJ;AAND,WAAK,WAAW;IACd,0CAA2B,CAAA;IAC3B,gCAAiB,CAAA;IACjB,kCAAmB,CAAA;IACnB,8BAAe,CAAA;IACf,wCAAyB,CAAA;AAC3B,CAAC,EANI,WAAW,KAAX,WAAW,QAMf;AAoDD,OAAO,EAAE,WAAW,EAAE,CAAA"}
|
@@ -0,0 +1,14 @@
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
|
+
import ArrowBackIosNewRoundedIcon from "@mui/icons-material/ArrowBackIosNewRounded";
|
3
|
+
import { SubMenuColumn } from "../SubMenuColumn/SubMenuColumn";
|
4
|
+
import { SubMenuItem } from "../SubMenuItem/SubMenuItem";
|
5
|
+
import { BackButton, MenuItemContainer, SubMenuContainer, SubMenuWrapper, } from "./SubMenu.styled";
|
6
|
+
export const SubMenu = (props) => {
|
7
|
+
const { selectedMenu, onToggleShowSubMenu, onClickMenuOption, isMobile, submenus, } = props;
|
8
|
+
return (_jsx(SubMenuContainer, { children: Object.keys(submenus).map((key) => {
|
9
|
+
const section = key;
|
10
|
+
const submenu = submenus[section];
|
11
|
+
return (_jsx(MenuItemContainer, { onMouseEnter: (e) => !isMobile && onToggleShowSubMenu(e, true, section), onMouseLeave: (e) => !isMobile && onToggleShowSubMenu(e, false, section), active: selectedMenu === section, section: section, isMobile: isMobile, children: _jsxs(SubMenuWrapper, { children: [isMobile && (_jsx(BackButton, { variant: "text", color: "inherit", onClick: (e) => onToggleShowSubMenu(e, false, section), startIcon: _jsx(ArrowBackIosNewRoundedIcon, {}), children: "Back" })), _jsx(SubMenuColumn, { title: submenu.column1Title, children: submenu.column1.map((item, index) => (_jsx(SubMenuItem, { isExternal: item.isExternal, title: item.title, description: item.description, href: item.url, eventTrackingName: item.eventTrackingName, onClickMenuOption: onClickMenuOption }, index))) }), _jsx(SubMenuColumn, { title: submenu.column2Title, children: submenu.column2.map((item, index) => (_jsx(SubMenuItem, { isExternal: item.isExternal, title: item.title, description: item.description, href: item.url, eventTrackingName: item.eventTrackingName, onClickMenuOption: onClickMenuOption }, index))) }), !!submenu.column3 && (_jsx(SubMenuColumn, { title: submenu.column3Title, children: submenu.column3.map((item, index) => (_jsx(SubMenuItem, { isExternal: item.isExternal, title: item.title, description: item.description, href: item.url, eventTrackingName: item.eventTrackingName, onClickMenuOption: onClickMenuOption }, index))) }))] }) }, key));
|
12
|
+
}) }));
|
13
|
+
};
|
14
|
+
//# sourceMappingURL=SubMenu.js.map
|