Elementor Website Builder – more than just a page builder / 3.13.0-beta1

Elementor Website Builder – more than just a page builder v3.13.0-beta1

elementor / assets / js / packages / top-bar.js

top-bar.js in Elementor Website Builder – more than just a page builder 3.13.0-beta1, at assets/js/packages/top-bar.js

690 lines 27.2 KB

Raw Download Zip

1	/******/ (function() { // webpackBootstrap
2	/******/ "use strict";
3	/******/ // The require scope
4	/******/ var __webpack_require__ = {};
5	/******/
6	/************************************************************************/
7	/*****/ / webpack/runtime/define property getters */
8	/******/ !function() {
9	/******/ // define getter functions for harmony exports
10	/******/ __webpack_require__.d = function(exports, definition) {
11	/******/ for(var key in definition) {
12	/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
13	/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
14	/******/ }
15	/******/ }
16	/******/ };
17	/******/ }();
18	/******/
19	/*****/ / webpack/runtime/hasOwnProperty shorthand */
20	/******/ !function() {
21	/******/ __webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
22	/******/ }();
23	/******/
24	/*****/ / webpack/runtime/make namespace object */
25	/******/ !function() {
26	/******/ // define __esModule on exports
27	/******/ __webpack_require__.r = function(exports) {
28	/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
29	/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
30	/******/ }
31	/******/ Object.defineProperty(exports, '__esModule', { value: true });
32	/******/ };
33	/******/ }();
34	/******/
35	/************************************************************************/
36	var __webpack_exports__ = {};
37	// ESM COMPAT FLAG
38	__webpack_require__.r(__webpack_exports__);
39
40	// EXPORTS
41	__webpack_require__.d(__webpack_exports__, {
42	"Divider": function() { return /* reexport */ external_UNSTABLE_elementorPackages_ui_namespaceObject.Divider; },
43	"PopoverMenu": function() { return /* reexport */ PopoverMenu; },
44	"PopoverMenuItem": function() { return /* reexport */ PopoverMenuItem; },
45	"ToolbarMenu": function() { return /* reexport */ ToolbarMenu; },
46	"ToolbarMenuItem": function() { return /* reexport */ ToolbarMenuItem; },
47	"ToolbarMenuMore": function() { return /* reexport */ ToolbarMenuMore; },
48	"ToolbarMenuToggleItem": function() { return /* reexport */ ToolbarMenuToggleItem; },
49	"createMenu": function() { return /* reexport */ createMenu; },
50	"injectIntoCanvasDisplay": function() { return /* reexport */ injectIntoCanvasDisplay; },
51	"injectIntoPrimaryAction": function() { return /* reexport */ injectIntoPrimaryAction; },
52	"mainMenu": function() { return /* reexport */ mainMenu; },
53	"toolsMenu": function() { return /* reexport */ toolsMenu; },
54	"utilitiesMenu": function() { return /* reexport */ utilitiesMenu; }
55	});
56
57	;// CONCATENATED MODULE: external "React"
58	var external_React_namespaceObject = React;
59	;// CONCATENATED MODULE: external "__UNSTABLE__elementorPackages.locations"
60	var external_UNSTABLE_elementorPackages_locations_namespaceObject = __UNSTABLE__elementorPackages.locations;
61	;// CONCATENATED MODULE: ./packages/top-bar/src/contexts/menu-context.tsx
62
63	const MenuContext = /#__PURE__/(0,external_React_namespaceObject.createContext)({
64	type: 'toolbar'
65	});
66	function MenuContextProvider({
67	type,
68	children
69	}) {
70	return /#__PURE__/React.createElement(MenuContext.Provider, {
71	value: {
72	type
73	}
74	}, children);
75	}
76	function useMenuContext() {
77	return (0,external_React_namespaceObject.useContext)(MenuContext);
78	}
79	;// CONCATENATED MODULE: external "__UNSTABLE__elementorPackages.ui"
80	var external_UNSTABLE_elementorPackages_ui_namespaceObject = __UNSTABLE__elementorPackages.ui;
81	;// CONCATENATED MODULE: ./packages/top-bar/src/components/ui/toolbar-menu-item.tsx
82	function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
83
84	function ToolbarMenuItem({
85	title,
86	...props
87	}) {
88	return /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Tooltip, {
89	title: title
90	}, /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Box, {
91	component: "span",
92	"aria-label": undefined
93	}, /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.IconButton, _extends({}, props, {
94	"aria-label": title,
95	size: "small"
96	}))));
97	}
98	;// CONCATENATED MODULE: external "__UNSTABLE__elementorPackages.icons"
99	var external_UNSTABLE_elementorPackages_icons_namespaceObject = __UNSTABLE__elementorPackages.icons;
100	;// CONCATENATED MODULE: ./packages/top-bar/src/components/ui/popover-menu-item.tsx
101	function popover_menu_item_extends() { popover_menu_item_extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return popover_menu_item_extends.apply(this, arguments); }
102
103
104
105	const DirectionalArrowIcon = (0,external_UNSTABLE_elementorPackages_ui_namespaceObject.withDirection)(external_UNSTABLE_elementorPackages_icons_namespaceObject.ArrowUpRightIcon);
106	function PopoverMenuItem({
107	text,
108	icon,
109	onClick,
110	href,
111	target,
112	disabled,
113	...props
114	}) {
115	const isExternalLink = href && target === '_blank';
116	return /#__PURE__/external_React_namespaceObject.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.MenuItem, popover_menu_item_extends({}, props, {
117	disabled: disabled,
118	onClick: onClick,
119	component: href ? 'a' : 'div',
120	href: href,
121	target: target
122	}), /#__PURE__/external_React_namespaceObject.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.ListItemIcon, null, icon), /#__PURE__/external_React_namespaceObject.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.ListItemText, {
123	primary: text
124	}), isExternalLink && /#__PURE__/external_React_namespaceObject.createElement(DirectionalArrowIcon, null));
125	}
126	;// CONCATENATED MODULE: ./packages/top-bar/src/components/actions/action.tsx
127	function action_extends() { action_extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return action_extends.apply(this, arguments); }
128
129
130
131	function Action({
132	icon: Icon,
133	title,
134	visible = true,
135	...props
136	}) {
137	const {
138	type
139	} = useMenuContext();
140	if (!visible) {
141	return null;
142	}
143	return type === 'toolbar' ? /#__PURE__/React.createElement(ToolbarMenuItem, action_extends({
144	title: title
145	}, props), /#__PURE__/React.createElement(Icon, null)) : /#__PURE__/React.createElement(PopoverMenuItem, action_extends({}, props, {
146	text: title,
147	icon: /#__PURE__/React.createElement(Icon, null)
148	}));
149	}
150	;// CONCATENATED MODULE: ./packages/top-bar/src/components/ui/toolbar-menu-toggle-item.tsx
151	function toolbar_menu_toggle_item_extends() { toolbar_menu_toggle_item_extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return toolbar_menu_toggle_item_extends.apply(this, arguments); }
152
153	function ToolbarMenuToggleItem({
154	title,
155	onClick,
156	...props
157	}) {
158	return /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Tooltip, {
159	title: title
160	}, /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Box, {
161	component: "span",
162	"aria-label": undefined
163	}, /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.ToggleButton, toolbar_menu_toggle_item_extends({}, props, {
164	onChange: onClick,
165	"aria-label": title,
166	size: "small"
167	}))));
168	}
169	;// CONCATENATED MODULE: ./packages/top-bar/src/components/actions/toggle-action.tsx
170	function toggle_action_extends() { toggle_action_extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return toggle_action_extends.apply(this, arguments); }
171
172
173
174	function ToggleAction({
175	icon: Icon,
176	title,
177	value,
178	visible = true,
179	...props
180	}) {
181	const {
182	type
183	} = useMenuContext();
184	if (!visible) {
185	return null;
186	}
187	return type === 'toolbar' ? /#__PURE__/React.createElement(ToolbarMenuToggleItem, toggle_action_extends({
188	value: value \|\| title,
189	title: title
190	}, props), /#__PURE__/React.createElement(Icon, null)) : /#__PURE__/React.createElement(PopoverMenuItem, toggle_action_extends({}, props, {
191	text: title,
192	icon: /#__PURE__/React.createElement(Icon, null)
193	}));
194	}
195	;// CONCATENATED MODULE: ./packages/top-bar/src/components/actions/link.tsx
196	function link_extends() { link_extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return link_extends.apply(this, arguments); }
197
198
199
200	function Link({
201	icon: Icon,
202	title,
203	visible = true,
204	...props
205	}) {
206	const {
207	type
208	} = useMenuContext();
209	if (!visible) {
210	return null;
211	}
212	return type === 'toolbar' ? /#__PURE__/React.createElement(ToolbarMenuItem, link_extends({
213	title: title
214	}, props), /#__PURE__/React.createElement(Icon, null)) : /#__PURE__/React.createElement(PopoverMenuItem, link_extends({}, props, {
215	text: title,
216	icon: /#__PURE__/React.createElement(Icon, null)
217	}));
218	}
219	;// CONCATENATED MODULE: ./packages/top-bar/src/locations/menus.tsx
220	function menus_extends() { menus_extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return menus_extends.apply(this, arguments); }
221
222
223
224
225
226
227	function createMenu({
228	name: menuName,
229	groups = []
230	}) {
231	const menuGroups = [...groups, 'default'];
232	const registerAction = createRegisterMenuItem({
233	menuName,
234	menuGroups,
235	component: Action
236	});
237	const registerToggleAction = createRegisterMenuItem({
238	menuName,
239	menuGroups,
240	component: ToggleAction
241	});
242	const registerLink = createRegisterMenuItem({
243	menuName,
244	menuGroups,
245	component: Link
246	});
247	const useMenuItems = createUseMenuItems({
248	menuName,
249	menuGroups
250	});
251	return {
252	registerAction,
253	registerToggleAction,
254	registerLink,
255	useMenuItems
256	};
257	}
258	function createRegisterMenuItem({
259	menuName,
260	menuGroups,
261	component
262	}) {
263	return ({
264	group = 'default',
265	name,
266	overwrite,
267	priority,
268	...args
269	}) => {
270	if (!menuGroups.includes(group)) {
271	return;
272	}
273	const useProps = 'props' in args ? () => args.props : args.useProps;
274	const Component = component;
275	const Filler = props => {
276	const componentProps = useProps();
277	return /#__PURE__/external_React_namespaceObject.createElement(Component, menus_extends({}, props, componentProps));
278	};
279	const location = getMenuLocationId(menuName, group);
280	(0,external_UNSTABLE_elementorPackages_locations_namespaceObject.inject)({
281	location,
282	name,
283	filler: Filler,
284	options: {
285	priority,
286	overwrite
287	}
288	});
289	};
290	}
291	function createUseMenuItems({
292	menuName,
293	menuGroups
294	}) {
295	const locations = menuGroups.map(group => getMenuLocationId(menuName, group));
296	return () => {
297	const injectionsGroups = (0,external_UNSTABLE_elementorPackages_locations_namespaceObject.useInjectionsOf)(locations);
298
299	// Normalize the injections groups to an object with the groups as keys.
300	return (0,external_React_namespaceObject.useMemo)(() => {
301	return injectionsGroups.reduce((acc, injections, index) => {
302	const groupName = menuGroups[index];
303	return {
304	...acc,
305	[groupName]: injections.map(injection => ({
306	id: injection.id,
307	MenuItem: injection.filler
308	}))
309	};
310	}, {});
311	}, [injectionsGroups]);
312	};
313	}
314	function getMenuLocationId(menu, group) {
315	return `editor/top-bar/${menu}/${group}`;
316	}
317	;// CONCATENATED MODULE: ./packages/top-bar/src/locations/consts.ts
318	// Locations
319	const LOCATION_CANVAS_DISPLAY = 'editor/top-bar/canvas-display'; // What this name means?
320	const LOCATION_PRIMARY_ACTION = 'editor/top-bar/primary-action';
321	;// CONCATENATED MODULE: ./packages/top-bar/src/locations/index.ts
322
323
324
325
326
327	const injectIntoCanvasDisplay = (0,external_UNSTABLE_elementorPackages_locations_namespaceObject.createInjectorFor)(LOCATION_CANVAS_DISPLAY);
328	const injectIntoPrimaryAction = (0,external_UNSTABLE_elementorPackages_locations_namespaceObject.createInjectorFor)(LOCATION_PRIMARY_ACTION);
329	const mainMenu = createMenu({
330	name: 'main',
331	groups: ['exits']
332	});
333	const toolsMenu = createMenu({
334	name: 'tools'
335	});
336	const utilitiesMenu = createMenu({
337	name: 'utilities'
338	});
339	;// CONCATENATED MODULE: ./packages/top-bar/src/components/ui/popover-menu.tsx
340	function popover_menu_extends() { popover_menu_extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return popover_menu_extends.apply(this, arguments); }
341
342
343	function PopoverMenu({
344	children,
345	...props
346	}) {
347	return /#__PURE__/React.createElement(MenuContextProvider, {
348	type: 'popover'
349	}, /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Menu, popover_menu_extends({
350	PaperProps: {
351	sx: {
352	mt: 4
353	}
354	}
355	}, props, {
356	MenuListProps: {
357	component: 'div'
358	}
359	}), children));
360	}
361	;// CONCATENATED MODULE: ./packages/top-bar/src/components/ui/toolbar-menu.tsx
362
363
364	function ToolbarMenu({
365	children
366	}) {
367	return /#__PURE__/React.createElement(MenuContextProvider, {
368	type: 'toolbar'
369	}, /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Stack, {
370	sx: {
371	px: 4
372	},
373	spacing: 4,
374	direction: "row",
375	alignItems: "center"
376	}, children));
377	}
378	;// CONCATENATED MODULE: external "wp.i18n"
379	var external_wp_i18n_namespaceObject = wp.i18n;
380	;// CONCATENATED MODULE: ./packages/top-bar/src/components/ui/toolbar-menu-more.tsx
381	function toolbar_menu_more_extends() { toolbar_menu_more_extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return toolbar_menu_more_extends.apply(this, arguments); }
382
383
384
385
386
387	function ToolbarMenuMore({
388	children,
389	id
390	}) {
391	const popupState = (0,external_UNSTABLE_elementorPackages_ui_namespaceObject.usePopupState)({
392	variant: 'popover',
393	popupId: id
394	});
395	return /#__PURE__/React.createElement(React.Fragment, null, /#__PURE__/React.createElement(ToolbarMenuItem, toolbar_menu_more_extends({}, (0,external_UNSTABLE_elementorPackages_ui_namespaceObject.bindTrigger)(popupState), {
396	title: (0,external_wp_i18n_namespaceObject.__)('More', 'elementor')
397	}), /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_icons_namespaceObject.DotsVerticalIcon, null)), /#__PURE__/React.createElement(PopoverMenu, toolbar_menu_more_extends({
398	onClick: popupState.close
399	}, (0,external_UNSTABLE_elementorPackages_ui_namespaceObject.bindMenu)(popupState)), children));
400	}
401	;// CONCATENATED MODULE: ./packages/top-bar/src/components/ui/toolbar-logo.tsx
402	function toolbar_logo_extends() { toolbar_logo_extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return toolbar_logo_extends.apply(this, arguments); }
403
404
405
406	const ElementorLogo = props => {
407	return /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.SvgIcon, toolbar_logo_extends({
408	viewBox: "0 0 32 32"
409	}, props), /#__PURE__/React.createElement("g", null, /#__PURE__/React.createElement("circle", {
410	cx: "16",
411	cy: "16",
412	r: "16"
413	}), /#__PURE__/React.createElement("path", {
414	d: "M11.7 9H9V22.3H11.7V9Z"
415	}), /#__PURE__/React.createElement("path", {
416	d: "M22.4 9H9V11.7H22.4V9Z"
417	}), /#__PURE__/React.createElement("path", {
418	d: "M22.4 14.4004H9V17.1004H22.4V14.4004Z"
419	}), /#__PURE__/React.createElement("path", {
420	d: "M22.4 19.6992H9V22.3992H22.4V19.6992Z"
421	})));
422	};
423	const StyledToggleButton = (0,external_UNSTABLE_elementorPackages_ui_namespaceObject.styled)(external_UNSTABLE_elementorPackages_ui_namespaceObject.ToggleButton)(() => ({
424	padding: 0,
425	'&.MuiToggleButton-root:hover': {
426	backgroundColor: 'initial'
427	},
428	'&.MuiToggleButton-root.Mui-selected': {
429	backgroundColor: 'initial'
430	}
431	}));
432	const StyledElementorLogo = (0,external_UNSTABLE_elementorPackages_ui_namespaceObject.styled)(ElementorLogo, {
433	shouldForwardProp: prop => prop !== 'showMenuIcon'
434	})(({
435	theme,
436	showMenuIcon
437	}) => ({
438	width: 'auto',
439	height: '100%',
440	'& path': {
441	fill: 'initial',
442	transition: 'all 0.2s linear',
443	transformOrigin: 'bottom left',
444	'&:first-of-type': {
445	transitionDelay: !showMenuIcon && '0.2s',
446	transform: showMenuIcon && 'translateY(-9px) scaleY(0)'
447	},
448	'&:not(:first-of-type)': {
449	// Emotion automatically change 4 to -4 in RTL moode.
450	transform: !showMenuIcon && `translateX(${theme.direction === 'rtl' ? '4' : '9'}px) scaleX(0.6)`
451	},
452	'&:nth-of-type(2)': {
453	transitionDelay: showMenuIcon ? '0' : '0.2s'
454	},
455	'&:nth-of-type(3)': {
456	transitionDelay: '0.1s'
457	},
458	'&:nth-of-type(4)': {
459	transitionDelay: showMenuIcon ? '0.2s' : '0'
460	}
461	}
462	}));
463	function ToolbarLogo(props) {
464	const [isHoverState, setIsHoverState] = (0,external_React_namespaceObject.useState)(false);
465	const showMenuIcon = props.selected \|\| isHoverState;
466	return /#__PURE__/React.createElement(StyledToggleButton, toolbar_logo_extends({}, props, {
467	value: "selected",
468	size: "small",
469	onMouseEnter: () => setIsHoverState(true),
470	onMouseLeave: () => setIsHoverState(false)
471	}), /#__PURE__/React.createElement(StyledElementorLogo, {
472	titleAccess: (0,external_wp_i18n_namespaceObject.__)('Elementor Logo', 'elementor'),
473	showMenuIcon: showMenuIcon
474	}));
475	}
476	;// CONCATENATED MODULE: ./packages/top-bar/src/components/locations/main-menu-location.tsx
477	function main_menu_location_extends() { main_menu_location_extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return main_menu_location_extends.apply(this, arguments); }
478
479
480
481
482	const {
483	useMenuItems
484	} = mainMenu;
485	function MainMenuLocation() {
486	const menuItems = useMenuItems();
487	const orderedGroups = [menuItems.default, menuItems.exits];
488	const popupState = (0,external_UNSTABLE_elementorPackages_ui_namespaceObject.usePopupState)({
489	variant: 'popover',
490	popupId: 'elementor-v2-top-bar-main-menu'
491	});
492	return /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Stack, {
493	sx: {
494	paddingInlineStart: 4
495	},
496	direction: "row",
497	alignItems: "center"
498	}, /#__PURE__/React.createElement(ToolbarLogo, main_menu_location_extends({}, (0,external_UNSTABLE_elementorPackages_ui_namespaceObject.bindTrigger)(popupState), {
499	selected: popupState.isOpen
500	})), /#__PURE__/React.createElement(PopoverMenu, main_menu_location_extends({
501	onClick: popupState.close
502	}, (0,external_UNSTABLE_elementorPackages_ui_namespaceObject.bindMenu)(popupState), {
503	PaperProps: {
504	sx: {
505	mt: 4,
506	marginInlineStart: -2
507	}
508	}
509	}), orderedGroups.filter(group => group.length).map((group, index) => {
510	return [index > 0 ? /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Divider, {
511	key: index,
512	orientation: "horizontal"
513	}) : null, ...group.map(({
514	MenuItem,
515	id
516	}) => /#__PURE__/React.createElement(MenuItem, {
517	key: id
518	}))];
519	})));
520	}
521	;// CONCATENATED MODULE: ./packages/top-bar/src/components/locations/tools-menu-location.tsx
522
523
524
525
526	const MAX_TOOLBAR_ACTIONS = 5;
527	const {
528	useMenuItems: tools_menu_location_useMenuItems
529	} = toolsMenu;
530	function ToolsMenuLocation() {
531	const menuItems = tools_menu_location_useMenuItems();
532	const toolbarMenuItems = menuItems.default.slice(0, MAX_TOOLBAR_ACTIONS);
533	const popoverMenuItems = menuItems.default.slice(MAX_TOOLBAR_ACTIONS);
534	return /#__PURE__/external_React_namespaceObject.createElement(ToolbarMenu, null, toolbarMenuItems.map(({
535	MenuItem,
536	id
537	}) => /#__PURE__/external_React_namespaceObject.createElement(MenuItem, {
538	key: id
539	})), popoverMenuItems.length > 0 && /#__PURE__/external_React_namespaceObject.createElement(ToolbarMenuMore, {
540	id: "elementor-editor-top-bar-tools-more"
541	}, popoverMenuItems.map(({
542	MenuItem,
543	id
544	}) => /#__PURE__/external_React_namespaceObject.createElement(MenuItem, {
545	key: id
546	}))));
547	}
548	;// CONCATENATED MODULE: ./packages/top-bar/src/components/locations/canvas-display-location.tsx
549
550
551
552
553
554	function CanvasDisplayLocation() {
555	const injections = (0,external_UNSTABLE_elementorPackages_locations_namespaceObject.useInjectionsOf)(LOCATION_CANVAS_DISPLAY);
556	return /#__PURE__/React.createElement(ToolbarMenu, null, injections.map(({
557	filler: Filler,
558	id
559	}, index) => /#__PURE__/React.createElement(external_React_namespaceObject.Fragment, {
560	key: id
561	}, index === 0 && /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Divider, {
562	orientation: "vertical"
563	}), /#__PURE__/React.createElement(Filler, null), /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Divider, {
564	orientation: "vertical"
565	}))));
566	}
567	;// CONCATENATED MODULE: ./packages/top-bar/src/components/locations/utilities-menu-location.tsx
568
569
570
571
572
573	const utilities_menu_location_MAX_TOOLBAR_ACTIONS = 3;
574	const {
575	useMenuItems: utilities_menu_location_useMenuItems
576	} = utilitiesMenu;
577	function UtilitiesMenuLocation() {
578	const menuItems = utilities_menu_location_useMenuItems();
579	const toolbarMenuItems = menuItems.default.slice(0, utilities_menu_location_MAX_TOOLBAR_ACTIONS);
580	const popoverMenuItems = menuItems.default.slice(utilities_menu_location_MAX_TOOLBAR_ACTIONS);
581	return /#__PURE__/React.createElement(ToolbarMenu, null, toolbarMenuItems.map(({
582	MenuItem,
583	id
584	}, index) => /#__PURE__/React.createElement(external_React_namespaceObject.Fragment, {
585	key: id
586	}, index === 0 && /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Divider, {
587	orientation: "vertical"
588	}), /#__PURE__/React.createElement(MenuItem, null))), popoverMenuItems.length > 0 && /#__PURE__/React.createElement(ToolbarMenuMore, {
589	id: "elementor-editor-top-bar-utilities-more"
590	}, popoverMenuItems.map(({
591	MenuItem,
592	id
593	}) => /#__PURE__/React.createElement(MenuItem, {
594	key: id
595	}))));
596	}
597	;// CONCATENATED MODULE: ./packages/top-bar/src/components/locations/primary-action-location.tsx
598
599
600	function PrimaryActionLocation() {
601	return /#__PURE__/React.createElement(external_UNSTABLE_elementorPackages_locations_namespaceObject.Slot, {
602	location: LOCATION_PRIMARY_ACTION
603	});
604	}
605	;// CONCATENATED MODULE: ./packages/top-bar/src/components/top-bar.tsx
606
607
608
609
610
611
612
613	function TopBar() {
614	return /#__PURE__/external_React_namespaceObject.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.ThemeProvider, {
615	colorScheme: "dark"
616	}, /#__PURE__/external_React_namespaceObject.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.AppBar, {
617	position: "sticky"
618	}, /#__PURE__/external_React_namespaceObject.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Box, {
619	display: "grid",
620	gridTemplateColumns: "repeat(3, 1fr)"
621	}, /#__PURE__/external_React_namespaceObject.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Grid, {
622	container: true
623	}, /#__PURE__/external_React_namespaceObject.createElement(MainMenuLocation, null), /#__PURE__/external_React_namespaceObject.createElement(ToolsMenuLocation, null)), /#__PURE__/external_React_namespaceObject.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Grid, {
624	container: true,
625	justifyContent: "center"
626	}, /#__PURE__/external_React_namespaceObject.createElement(CanvasDisplayLocation, null)), /#__PURE__/external_React_namespaceObject.createElement(external_UNSTABLE_elementorPackages_ui_namespaceObject.Grid, {
627	container: true,
628	justifyContent: "flex-end"
629	}, /#__PURE__/external_React_namespaceObject.createElement(UtilitiesMenuLocation, null), /#__PURE__/external_React_namespaceObject.createElement(PrimaryActionLocation, null)))));
630	}
631	;// CONCATENATED MODULE: external "__UNSTABLE__elementorPackages.editor"
632	var external_UNSTABLE_elementorPackages_editor_namespaceObject = __UNSTABLE__elementorPackages.editor;
633	;// CONCATENATED MODULE: external "__UNSTABLE__elementorPackages.v1Adapters"
634	var external_UNSTABLE_elementorPackages_v1Adapters_namespaceObject = __UNSTABLE__elementorPackages.v1Adapters;
635	;// CONCATENATED MODULE: ./packages/top-bar/src/sync/index.ts
636
637	function sync() {
638	redirectOldMenus();
639	}
640	function redirectOldMenus() {
641	// Currently, in V1, when you click `esc` it opens the hamburger menu in the panel.
642	// In V2, we don't have this panel, so we redirect the user to the elements panel instead.
643	(0,external_UNSTABLE_elementorPackages_v1Adapters_namespaceObject.listenTo)((0,external_UNSTABLE_elementorPackages_v1Adapters_namespaceObject.routeOpenEvent)('panel/menu'), () => {
644	(0,external_UNSTABLE_elementorPackages_v1Adapters_namespaceObject.openRoute)('panel/elements/categories');
645	});
646	}
647	;// CONCATENATED MODULE: ./packages/top-bar/src/init.ts
648
649
650
651
652
653
654	function init() {
655	sync();
656	(0,external_UNSTABLE_elementorPackages_editor_namespaceObject.injectIntoTop)({
657	name: 'top-bar',
658	filler: TopBar
659	});
660	mainMenu.registerLink({
661	name: 'manage-website',
662	group: 'exits',
663	useProps: () => {
664	const {
665	urls
666	} = (0,external_UNSTABLE_elementorPackages_editor_namespaceObject.useSettings)();
667	return {
668	title: (0,external_wp_i18n_namespaceObject.__)('Manage Website', 'elementor'),
669	href: urls.admin,
670	icon: external_UNSTABLE_elementorPackages_icons_namespaceObject.WordpressIcon,
671	target: '_blank'
672	};
673	}
674	});
675	}
676	;// CONCATENATED MODULE: ./packages/top-bar/src/index.ts
677
678
679
680
681
682
683
684
685
686
687	init();
688	(window.__UNSTABLE__elementorPackages = window.__UNSTABLE__elementorPackages \|\| {}).topBar = __webpack_exports__;
689	/******/ })()
690	;