PluginProbe
Elementor Website Builder – more than just a page builder / 4.1.0-beta2
Elementor Website Builder – more than just a page builder v4.1.0-beta2
4.3.4 4.3.3 4.3.2 4.3.1 4.3.0 4.3.0-beta3 4.3.0-beta2 4.3.0-beta1 4.2.4 4.2.3 4.2.2 4.2.1 4.2.0 4.1.5 4.2.0-beta2 4.2.0-dev2 4.2.0-beta1 4.1.4 4.1.3 4.1.2 4.1.1 4.1.0 4.1.0-beta3 4.1.0-dev3 4.0.9 All 457 releases
← All changes | assets/js/packages/editor-design-system/editor-design-system.js +2 -1685 4.2.0-dev2 → 4.1.0-beta2 View file →
@@ -1,1686 +1,3 @@
1 -/******/ (function() { // webpackBootstrap
2 -/******/ "use strict";
3 -/******/ var __webpack_modules__ = ({
4 -
5 -/***/ "./packages/packages/core/editor-design-system/src/components/design-system-entrypoints.tsx":
6 -/*!**************************************************************************************************!*\
7 - !*** ./packages/packages/core/editor-design-system/src/components/design-system-entrypoints.tsx ***!
8 - \**************************************************************************************************/
9 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
10 -
11 -__webpack_require__.r(__webpack_exports__);
12 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
13 -/* harmony export */ DesignSystemEntrypoints: function() { return /* binding */ DesignSystemEntrypoints; }
14 -/* harmony export */ });
15 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
16 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
17 -/* harmony import */ var _elementor_editor_documents__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @elementor/editor-documents */ "@elementor/editor-documents");
18 -/* harmony import */ var _elementor_editor_documents__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_documents__WEBPACK_IMPORTED_MODULE_1__);
19 -/* harmony import */ var _elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @elementor/editor-ui */ "@elementor/editor-ui");
20 -/* harmony import */ var _elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__);
21 -/* harmony import */ var _elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @elementor/editor-v1-adapters */ "@elementor/editor-v1-adapters");
22 -/* harmony import */ var _elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3__);
23 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
24 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__);
25 -/* harmony import */ var _design_system_panel__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../design-system-panel */ "./packages/packages/core/editor-design-system/src/design-system-panel.tsx");
26 -/* harmony import */ var _initial_tab__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../initial-tab */ "./packages/packages/core/editor-design-system/src/initial-tab.ts");
27 -
28 -
29 -
30 -
31 -
32 -
33 -
34 -
35 -const V1_ELEMENTS_PANEL_ROUTE = 'panel/elements/categories';
36 -const EVENT_OPEN_VARIABLES = 'elementor/open-variables-manager';
37 -const EVENT_OPEN_CLASSES = 'elementor/open-global-classes-manager';
38 -const EVENT_TOGGLE = 'elementor/toggle-design-system';
39 -const EVENT_SET_TAB = 'elementor/design-system/set-tab';
40 -const ACTIVE_PANEL_PARAM = 'active-panel';
41 -const PANEL_ID = 'design-system';
42 -const LEGACY_GLOBAL_CLASSES_PANEL = 'global-classes-manager';
43 -const LEGACY_VARIABLES_PANEL = 'variables-manager';
44 -function DesignSystemEntrypoints() {
45 - const {
46 - open,
47 - close
48 - } = (0,_design_system_panel__WEBPACK_IMPORTED_MODULE_5__.usePanelActions)();
49 - const {
50 - isOpen
51 - } = (0,_design_system_panel__WEBPACK_IMPORTED_MODULE_5__.usePanelStatus)();
52 - const document = (0,_elementor_editor_documents__WEBPACK_IMPORTED_MODULE_1__.__useActiveDocument)();
53 - const {
54 - save: saveDocument
55 - } = (0,_elementor_editor_documents__WEBPACK_IMPORTED_MODULE_1__.__useActiveDocumentActions)();
56 - const {
57 - open: openSaveDialog,
58 - close: closeSaveDialog,
59 - isOpen: isSaveDialogOpen
60 - } = (0,_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__.useDialog)();
61 - const documentRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(document);
62 - documentRef.current = document;
63 - const pendingOpenRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
64 - const gatedOpen = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(onClean => {
65 - if (documentRef.current?.isDirty) {
66 - pendingOpenRef.current = onClean;
67 - openSaveDialog();
68 - return;
69 - }
70 - onClean();
71 - }, [openSaveDialog]);
72 - const handleSaveAndContinue = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(async () => {
73 - try {
74 - await saveDocument();
75 - closeSaveDialog();
76 - pendingOpenRef.current?.();
77 - pendingOpenRef.current = null;
78 - } catch {
79 - // Keep dialog open;
80 - }
81 - }, [saveDocument, closeSaveDialog]);
82 - const handleStayHere = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(() => {
83 - closeSaveDialog();
84 - pendingOpenRef.current = null;
85 - }, [closeSaveDialog]);
86 - const isOpenRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(isOpen);
87 - isOpenRef.current = isOpen;
88 - (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
89 - const handler = event => {
90 - const tab = event.detail?.tab;
91 - if (tab !== 'variables' && tab !== 'classes') {
92 - return;
93 - }
94 - if (isOpenRef.current && (0,_initial_tab__WEBPACK_IMPORTED_MODULE_6__.getActiveDesignSystemTab)() === tab) {
95 - void close();
96 - return;
97 - }
98 - if (isOpenRef.current) {
99 - window.dispatchEvent(new CustomEvent(EVENT_SET_TAB, {
100 - detail: {
101 - tab
102 - }
103 - }));
104 - return;
105 - }
106 - gatedOpen(() => {
107 - window.dispatchEvent(new CustomEvent(tab === 'variables' ? EVENT_OPEN_VARIABLES : EVENT_OPEN_CLASSES));
108 - });
109 - };
110 - window.addEventListener(EVENT_TOGGLE, handler);
111 - return () => {
112 - window.removeEventListener(EVENT_TOGGLE, handler);
113 - };
114 - }, [close, gatedOpen]);
115 - const pendingTabRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
116 - const [readyToOpenFromEvent, setReadyToOpenFromEvent] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
117 - (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
118 - if (readyToOpenFromEvent) {
119 - setReadyToOpenFromEvent(false);
120 - void open();
121 - }
122 - }, [readyToOpenFromEvent, open]);
123 - (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
124 - return (0,_elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3__.__privateListenTo)((0,_elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3__.routeOpenEvent)(V1_ELEMENTS_PANEL_ROUTE), () => {
125 - const tab = pendingTabRef.current;
126 - if (tab) {
127 - pendingTabRef.current = null;
128 - (0,_initial_tab__WEBPACK_IMPORTED_MODULE_6__.setPendingDesignSystemTab)(tab);
129 - setReadyToOpenFromEvent(true);
130 - }
131 - });
132 - }, []);
133 - (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
134 - const bind = (eventName, tab) => {
135 - const handler = () => {
136 - pendingTabRef.current = tab;
137 - (0,_elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3__.__privateOpenRoute)(V1_ELEMENTS_PANEL_ROUTE);
138 - };
139 - window.addEventListener(eventName, handler);
140 - return () => window.removeEventListener(eventName, handler);
141 - };
142 - const unlistenVariables = bind(EVENT_OPEN_VARIABLES, 'variables');
143 - const unlistenClasses = bind(EVENT_OPEN_CLASSES, 'classes');
144 - return () => {
145 - unlistenVariables();
146 - unlistenClasses();
147 - };
148 - }, []);
149 - const hasOpenedFromUrl = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(false);
150 - (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
151 - const urlParams = new URLSearchParams(window.location.search);
152 - const activePanel = urlParams.get(ACTIVE_PANEL_PARAM);
153 - if (!activePanel) {
154 - return;
155 - }
156 - let targetTab = null;
157 - if (activePanel === PANEL_ID) {
158 - const tab = urlParams.get('design-system-tab');
159 - targetTab = tab === 'classes' ? 'classes' : 'variables';
160 - } else if (activePanel === LEGACY_GLOBAL_CLASSES_PANEL) {
161 - targetTab = 'classes';
162 - } else if (activePanel === LEGACY_VARIABLES_PANEL) {
163 - targetTab = 'variables';
164 - } else {
165 - return;
166 - }
167 - const cleanup = (0,_elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3__.__privateListenTo)((0,_elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3__.routeOpenEvent)(V1_ELEMENTS_PANEL_ROUTE), () => {
168 - if (hasOpenedFromUrl.current) {
169 - return;
170 - }
171 - hasOpenedFromUrl.current = true;
172 - requestAnimationFrame(() => {
173 - if (targetTab) {
174 - (0,_initial_tab__WEBPACK_IMPORTED_MODULE_6__.setPendingDesignSystemTab)(targetTab);
175 - }
176 - gatedOpen(() => void open());
177 - });
178 - });
179 - return cleanup;
180 - }, [open, gatedOpen]);
181 - return isSaveDialogOpen ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__.ThemeProvider, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__.SaveChangesDialog, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__.SaveChangesDialog.Title, null, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)('You have unsaved changes', 'elementor')), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__.SaveChangesDialog.Content, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__.SaveChangesDialog.ContentText, {
182 - sx: {
183 - mb: 2
184 - }
185 - }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("To open the Design System, save your page first. You can't continue without saving.", 'elementor'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__.SaveChangesDialog.Actions, {
186 - actions: {
187 - cancel: {
188 - label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)('Stay here', 'elementor'),
189 - action: handleStayHere
190 - },
191 - confirm: {
192 - label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)('Save & Continue', 'elementor'),
193 - action: handleSaveAndContinue
194 - }
195 - }
196 - }))) : null;
197 -}
198 -
199 -/***/ }),
200 -
201 -/***/ "./packages/packages/core/editor-design-system/src/components/design-system-header-menu.tsx":
202 -/*!**************************************************************************************************!*\
203 - !*** ./packages/packages/core/editor-design-system/src/components/design-system-header-menu.tsx ***!
204 - \**************************************************************************************************/
205 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
206 -
207 -__webpack_require__.r(__webpack_exports__);
208 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
209 -/* harmony export */ DesignSystemHeaderMenu: function() { return /* binding */ DesignSystemHeaderMenu; }
210 -/* harmony export */ });
211 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
212 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
213 -/* harmony import */ var _elementor_editor_current_user__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @elementor/editor-current-user */ "@elementor/editor-current-user");
214 -/* harmony import */ var _elementor_editor_current_user__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_current_user__WEBPACK_IMPORTED_MODULE_1__);
215 -/* harmony import */ var _elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @elementor/editor-ui */ "@elementor/editor-ui");
216 -/* harmony import */ var _elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__);
217 -/* harmony import */ var _elementor_icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @elementor/icons */ "@elementor/icons");
218 -/* harmony import */ var _elementor_icons__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_elementor_icons__WEBPACK_IMPORTED_MODULE_3__);
219 -/* harmony import */ var _elementor_query__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @elementor/query */ "@elementor/query");
220 -/* harmony import */ var _elementor_query__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_elementor_query__WEBPACK_IMPORTED_MODULE_4__);
221 -/* harmony import */ var _elementor_ui__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @elementor/ui */ "@elementor/ui");
222 -/* harmony import */ var _elementor_ui__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_elementor_ui__WEBPACK_IMPORTED_MODULE_5__);
223 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
224 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__);
225 -/* harmony import */ var _export_download__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../export/download */ "./packages/packages/core/editor-design-system/src/export/download.ts");
226 -/* harmony import */ var _export_export_notifications__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../export/export-notifications */ "./packages/packages/core/editor-design-system/src/export/export-notifications.ts");
227 -/* harmony import */ var _export_hooks_use_export_request__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../export/hooks/use-export-request */ "./packages/packages/core/editor-design-system/src/export/hooks/use-export-request.ts");
228 -/* harmony import */ var _import_hooks_use_import_request__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../import/hooks/use-import-request */ "./packages/packages/core/editor-design-system/src/import/hooks/use-import-request.ts");
229 -/* harmony import */ var _import_import_design_system_dialog__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../import/import-design-system-dialog */ "./packages/packages/core/editor-design-system/src/import/import-design-system-dialog.tsx");
230 -/* harmony import */ var _import_tracking__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../import/tracking */ "./packages/packages/core/editor-design-system/src/import/tracking.ts");
231 -function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
232 -
233 -
234 -
235 -
236 -
237 -
238 -
239 -
240 -
241 -
242 -
243 -
244 -
245 -const POPUP_STATE_ID = 'design-system-header-menu';
246 -const DesignSystemHeaderMenu = () => {
247 - const {
248 - isAdmin
249 - } = (0,_elementor_editor_current_user__WEBPACK_IMPORTED_MODULE_1__.useCurrentUserCapabilities)();
250 - const popupState = (0,_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.usePopupState)({
251 - variant: 'popover',
252 - popupId: POPUP_STATE_ID
253 - });
254 - const exportMutation = (0,_export_hooks_use_export_request__WEBPACK_IMPORTED_MODULE_9__.useExportRequest)();
255 - const isImporting = (0,_elementor_query__WEBPACK_IMPORTED_MODULE_4__.useIsMutating)({
256 - mutationKey: [_import_hooks_use_import_request__WEBPACK_IMPORTED_MODULE_10__.IMPORT_DESIGN_SYSTEM_MUTATION_KEY]
257 - }) > 0;
258 - const isExporting = (0,_elementor_query__WEBPACK_IMPORTED_MODULE_4__.useIsMutating)({
259 - mutationKey: [_export_hooks_use_export_request__WEBPACK_IMPORTED_MODULE_9__.EXPORT_DESIGN_SYSTEM_MUTATION_KEY]
260 - }) > 0;
261 - const isInProgress = isImporting || isExporting;
262 - const triggerProps = (0,_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.bindTrigger)(popupState);
263 - const handleImport = () => {
264 - popupState.close();
265 - (0,_import_tracking__WEBPACK_IMPORTED_MODULE_12__.trackDesignSystem)({
266 - event: 'importOpened'
267 - });
268 - (0,_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__.openDialog)({
269 - component: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_import_import_design_system_dialog__WEBPACK_IMPORTED_MODULE_11__.ImportDesignSystemDialog, {
270 - onClose: _elementor_editor_ui__WEBPACK_IMPORTED_MODULE_2__.closeDialog
271 - })
272 - });
273 - };
274 - const runExport = async () => {
275 - (0,_export_export_notifications__WEBPACK_IMPORTED_MODULE_8__.notifyExportInProgress)();
276 - try {
277 - const {
278 - blob,
279 - fileName
280 - } = await exportMutation.mutateAsync();
281 - (0,_export_download__WEBPACK_IMPORTED_MODULE_7__.downloadBlob)(blob, fileName);
282 - (0,_export_export_notifications__WEBPACK_IMPORTED_MODULE_8__.notifyExportSuccess)();
283 - } catch {
284 - (0,_export_export_notifications__WEBPACK_IMPORTED_MODULE_8__.notifyExportFailure)(runExport);
285 - }
286 - };
287 - const handleExport = () => {
288 - popupState.close();
289 - (0,_import_tracking__WEBPACK_IMPORTED_MODULE_12__.trackDesignSystem)({
290 - event: 'export'
291 - });
292 - void runExport();
293 - };
294 - const triggerLabel = (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__.__)('Design system actions', 'elementor');
295 - const currentlyExportingLabel = (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__.__)(`Export is in progress. The file will be downloaded when it's complete.`, 'elementor');
296 - const currentlyImportingLabel = (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__.__)(`Import is in progress. You will receive a notification when it's complete.`, 'elementor');
297 - let tooltipLabel = triggerLabel;
298 - if (isInProgress) {
299 - tooltipLabel = isExporting ? currentlyExportingLabel : currentlyImportingLabel;
300 - }
301 - return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, isAdmin && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
302 - title: tooltipLabel,
303 - placement: "top"
304 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("span", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.IconButton, _extends({}, triggerProps, {
305 - size: "small",
306 - "aria-label": triggerLabel,
307 - disabled: isInProgress
308 - }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_icons__WEBPACK_IMPORTED_MODULE_3__.DotsVerticalIcon, {
309 - fontSize: "small"
310 - })))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.Menu, _extends({}, (0,_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.bindMenu)(popupState), {
311 - MenuListProps: {
312 - dense: true
313 - },
314 - PaperProps: {
315 - elevation: 6
316 - },
317 - anchorOrigin: {
318 - vertical: 'bottom',
319 - horizontal: 'right'
320 - },
321 - transformOrigin: {
322 - vertical: 'top',
323 - horizontal: 'right'
324 - }
325 - }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.MenuItem, {
326 - onClick: handleImport,
327 - disabled: isImporting
328 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.ListItemIcon, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_icons__WEBPACK_IMPORTED_MODULE_3__.UploadIcon, {
329 - fontSize: "tiny"
330 - })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.ListItemText, null, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__.__)('Import', 'elementor'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.MenuItem, {
331 - onClick: handleExport,
332 - disabled: isExporting
333 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.ListItemIcon, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_icons__WEBPACK_IMPORTED_MODULE_3__.DownloadIcon, {
334 - fontSize: "tiny"
335 - })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_5__.ListItemText, null, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__.__)('Export', 'elementor')))));
336 -};
337 -
338 -/***/ }),
339 -
340 -/***/ "./packages/packages/core/editor-design-system/src/components/design-system-panel-content.tsx":
341 -/*!****************************************************************************************************!*\
342 - !*** ./packages/packages/core/editor-design-system/src/components/design-system-panel-content.tsx ***!
343 - \****************************************************************************************************/
344 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
345 -
346 -__webpack_require__.r(__webpack_exports__);
347 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
348 -/* harmony export */ DesignSystemPanelContent: function() { return /* binding */ DesignSystemPanelContent; }
349 -/* harmony export */ });
350 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
351 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
352 -/* harmony import */ var _elementor_editor_global_classes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @elementor/editor-global-classes */ "@elementor/editor-global-classes");
353 -/* harmony import */ var _elementor_editor_global_classes__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_global_classes__WEBPACK_IMPORTED_MODULE_1__);
354 -/* harmony import */ var _elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @elementor/editor-panels */ "@elementor/editor-panels");
355 -/* harmony import */ var _elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__);
356 -/* harmony import */ var _elementor_editor_ui__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @elementor/editor-ui */ "@elementor/editor-ui");
357 -/* harmony import */ var _elementor_editor_ui__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_3__);
358 -/* harmony import */ var _elementor_editor_variables__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @elementor/editor-variables */ "@elementor/editor-variables");
359 -/* harmony import */ var _elementor_editor_variables__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_variables__WEBPACK_IMPORTED_MODULE_4__);
360 -/* harmony import */ var _elementor_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @elementor/icons */ "@elementor/icons");
361 -/* harmony import */ var _elementor_icons__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_elementor_icons__WEBPACK_IMPORTED_MODULE_5__);
362 -/* harmony import */ var _elementor_ui__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @elementor/ui */ "@elementor/ui");
363 -/* harmony import */ var _elementor_ui__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_elementor_ui__WEBPACK_IMPORTED_MODULE_6__);
364 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
365 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_7__);
366 -/* harmony import */ var _initial_tab__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../initial-tab */ "./packages/packages/core/editor-design-system/src/initial-tab.ts");
367 -/* harmony import */ var _design_system_header_menu__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./design-system-header-menu */ "./packages/packages/core/editor-design-system/src/components/design-system-header-menu.tsx");
368 -function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
369 -
370 -
371 -
372 -
373 -
374 -
375 -
376 -
377 -
378 -
379 -
380 -const stickyTabRowStyles = {
381 - position: 'sticky',
382 - zIndex: 1100,
383 - opacity: 1,
384 - backgroundColor: 'background.default',
385 - transition: 'top 300ms ease'
386 -};
387 -const EVENT_SET_TAB = 'elementor/design-system/set-tab';
388 -const trackDesignSystemTabOpened = tab => {
389 - switch (tab) {
390 - case 'classes':
391 - (0,_elementor_editor_global_classes__WEBPACK_IMPORTED_MODULE_1__.trackGlobalClasses)({
392 - event: 'classManagerOpened',
393 - source: 'system-panel'
394 - });
395 - break;
396 - case 'variables':
397 - (0,_elementor_editor_variables__WEBPACK_IMPORTED_MODULE_4__.trackVariablesManagerEvent)({
398 - action: 'openManager',
399 - source: 'system-panel'
400 - });
401 - break;
402 - }
403 -};
404 -function DesignSystemPanelContent({
405 - onRequestClose
406 -}) {
407 - const [currentTab, setCurrentTab] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(() => (0,_initial_tab__WEBPACK_IMPORTED_MODULE_8__.getInitialDesignSystemTab)());
408 - const variablesCloseAttemptRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
409 - const classesCloseAttemptRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
410 - const isChainingRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(false);
411 - const {
412 - getTabProps,
413 - getTabPanelProps,
414 - getTabsProps
415 - } = (0,_elementor_ui__WEBPACK_IMPORTED_MODULE_6__.useTabs)(currentTab);
416 - const chainedThroughClasses = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(() => {
417 - if (!isChainingRef.current && classesCloseAttemptRef.current) {
418 - isChainingRef.current = true;
419 - classesCloseAttemptRef.current();
420 - isChainingRef.current = false;
421 - return;
422 - }
423 - void onRequestClose();
424 - }, [onRequestClose]);
425 - const chainedThroughVariables = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(() => {
426 - if (!isChainingRef.current && variablesCloseAttemptRef.current) {
427 - isChainingRef.current = true;
428 - variablesCloseAttemptRef.current();
429 - isChainingRef.current = false;
430 - return;
431 - }
432 - void onRequestClose();
433 - }, [onRequestClose]);
434 - (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
435 - (0,_initial_tab__WEBPACK_IMPORTED_MODULE_8__.notifyDesignSystemTabChange)(currentTab);
436 - }, [currentTab]);
437 - (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
438 - const handler = event => {
439 - const tab = event.detail?.tab;
440 - if (!tab) {
441 - return;
442 - }
443 - setCurrentTab(tab);
444 - (0,_initial_tab__WEBPACK_IMPORTED_MODULE_8__.persistDesignSystemTab)(tab);
445 - (0,_initial_tab__WEBPACK_IMPORTED_MODULE_8__.notifyDesignSystemTabChange)(tab);
446 - trackDesignSystemTabOpened(tab);
447 - };
448 - window.addEventListener(EVENT_SET_TAB, handler);
449 - return () => {
450 - window.removeEventListener(EVENT_SET_TAB, handler);
451 - };
452 - }, []);
453 - const handleHeaderClose = () => {
454 - if (currentTab === 'variables' && variablesCloseAttemptRef.current) {
455 - variablesCloseAttemptRef.current();
456 - return;
457 - }
458 - if (currentTab === 'classes' && classesCloseAttemptRef.current) {
459 - classesCloseAttemptRef.current();
460 - return;
461 - }
462 - void onRequestClose();
463 - };
464 - return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_3__.ThemeProvider, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__.Panel, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__.PanelHeader, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_6__.Stack, {
465 - p: 1,
466 - pl: 2,
467 - width: "100%",
468 - direction: "row",
469 - alignItems: "center",
470 - spacing: 0.5
471 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__.PanelHeaderTitle, {
472 - sx: {
473 - flex: 1,
474 - minWidth: 0
475 - }
476 - }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_7__.__)('Design system', 'elementor')), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_design_system_header_menu__WEBPACK_IMPORTED_MODULE_9__.DesignSystemHeaderMenu, null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_6__.CloseButton, {
477 - "aria-label": (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_7__.__)('Close', 'elementor'),
478 - sx: {
479 - flexShrink: 0
480 - },
481 - onClick: () => void handleHeaderClose()
482 - }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__.PanelBody, {
483 - sx: {
484 - display: 'flex',
485 - flexDirection: 'column',
486 - height: '100%',
487 - overflow: 'hidden',
488 - minHeight: 0
489 - }
490 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_6__.Stack, {
491 - direction: "column",
492 - sx: {
493 - width: '100%',
494 - flex: 1,
495 - minHeight: 0,
496 - overflow: 'hidden'
497 - }
498 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_6__.Stack, {
499 - sx: {
500 - ...stickyTabRowStyles,
501 - top: 0,
502 - flexShrink: 0
503 - }
504 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_6__.Tabs, _extends({
505 - variant: "fullWidth",
506 - size: "small",
507 - sx: {
508 - mt: 0.5
509 - }
510 - }, getTabsProps(), {
511 - onChange: (e, newValue) => {
512 - getTabsProps().onChange(e, newValue);
513 - setCurrentTab(newValue);
514 - (0,_initial_tab__WEBPACK_IMPORTED_MODULE_8__.persistDesignSystemTab)(newValue);
515 - (0,_initial_tab__WEBPACK_IMPORTED_MODULE_8__.notifyDesignSystemTabChange)(newValue);
516 - trackDesignSystemTabOpened(newValue);
517 - }
518 - }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_6__.Tab, _extends({
519 - label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_7__.__)('Variables', 'elementor'),
520 - icon: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_icons__WEBPACK_IMPORTED_MODULE_5__.ColorFilterIcon, {
521 - fontSize: "small"
522 - }),
523 - iconPosition: "start"
524 - }, getTabProps('variables'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_6__.Tab, _extends({
525 - label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_7__.__)('Classes', 'elementor'),
526 - icon: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_icons__WEBPACK_IMPORTED_MODULE_5__.ColorSwatchIcon, {
527 - fontSize: "small"
528 - }),
529 - iconPosition: "start"
530 - }, getTabProps('classes')))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_6__.Divider, null)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_6__.Box, _extends({
531 - role: "tabpanel"
532 - }, getTabPanelProps('variables'), {
533 - sx: {
534 - flex: 1,
535 - minHeight: 0,
536 - display: currentTab === 'variables' ? 'flex' : 'none',
537 - flexDirection: 'column',
538 - overflow: 'hidden',
539 - pt: 1
540 - }
541 - }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_variables__WEBPACK_IMPORTED_MODULE_4__.VariablesManagerPanelEmbedded, {
542 - onRequestClose: chainedThroughClasses,
543 - onExposeCloseAttempt: fn => {
544 - variablesCloseAttemptRef.current = fn;
545 - }
546 - })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_6__.Box, _extends({
547 - role: "tabpanel"
548 - }, getTabPanelProps('classes'), {
549 - sx: {
550 - flex: 1,
551 - minHeight: 0,
552 - display: currentTab === 'classes' ? 'flex' : 'none',
553 - flexDirection: 'column',
554 - overflow: 'hidden',
555 - pt: 1
556 - }
557 - }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_global_classes__WEBPACK_IMPORTED_MODULE_1__.ClassManagerPanelEmbedded, {
558 - onRequestClose: chainedThroughVariables,
559 - onExposeCloseAttempt: fn => {
560 - classesCloseAttemptRef.current = fn;
561 - },
562 - isActive: currentTab === 'classes'
563 - }))))));
564 -}
565 -
566 -/***/ }),
567 -
568 -/***/ "./packages/packages/core/editor-design-system/src/design-system-panel.tsx":
569 -/*!*********************************************************************************!*\
570 - !*** ./packages/packages/core/editor-design-system/src/design-system-panel.tsx ***!
571 - \*********************************************************************************/
572 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
573 -
574 -__webpack_require__.r(__webpack_exports__);
575 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
576 -/* harmony export */ panel: function() { return /* binding */ panel; },
577 -/* harmony export */ usePanelActions: function() { return /* binding */ usePanelActions; },
578 -/* harmony export */ usePanelStatus: function() { return /* binding */ usePanelStatus; }
579 -/* harmony export */ });
580 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
581 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
582 -/* harmony import */ var _elementor_editor_documents__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @elementor/editor-documents */ "@elementor/editor-documents");
583 -/* harmony import */ var _elementor_editor_documents__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_documents__WEBPACK_IMPORTED_MODULE_1__);
584 -/* harmony import */ var _elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @elementor/editor-panels */ "@elementor/editor-panels");
585 -/* harmony import */ var _elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__);
586 -/* harmony import */ var _elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @elementor/editor-v1-adapters */ "@elementor/editor-v1-adapters");
587 -/* harmony import */ var _elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3__);
588 -/* harmony import */ var _components_design_system_panel_content__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/design-system-panel-content */ "./packages/packages/core/editor-design-system/src/components/design-system-panel-content.tsx");
589 -
590 -
591 -
592 -
593 -
594 -const PANEL_ID = 'design-system';
595 -const {
596 - panel,
597 - usePanelStatus,
598 - usePanelActions
599 -} = (0,_elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__.__createPanel)({
600 - id: PANEL_ID,
601 - component: DesignSystemPanelRoot,
602 - allowedEditModes: ['edit', PANEL_ID],
603 - onOpen: () => {
604 - (0,_elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3__.changeEditMode)(PANEL_ID);
605 - },
606 - onClose: async () => {
607 - (0,_elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_3__.changeEditMode)('edit');
608 - await (0,_elementor_editor_documents__WEBPACK_IMPORTED_MODULE_1__.reloadCurrentDocument)();
609 - },
610 - isOpenPreviousElement: true
611 -});
612 -function DesignSystemPanelRoot() {
613 - const {
614 - close: closePanel
615 - } = usePanelActions();
616 - return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_design_system_panel_content__WEBPACK_IMPORTED_MODULE_4__.DesignSystemPanelContent, {
617 - onRequestClose: closePanel
618 - });
619 -}
620 -
621 -/***/ }),
622 -
623 -/***/ "./packages/packages/core/editor-design-system/src/export/download.ts":
624 -/*!****************************************************************************!*\
625 - !*** ./packages/packages/core/editor-design-system/src/export/download.ts ***!
626 - \****************************************************************************/
627 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
628 -
629 -__webpack_require__.r(__webpack_exports__);
630 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
631 -/* harmony export */ downloadBlob: function() { return /* binding */ downloadBlob; }
632 -/* harmony export */ });
633 -const downloadBlob = (blob, fileName) => {
634 - const url = URL.createObjectURL(blob);
635 - const anchor = document.createElement('a');
636 - anchor.href = url;
637 - anchor.download = fileName;
638 - anchor.rel = 'noopener';
639 - document.body.appendChild(anchor);
640 - anchor.click();
641 - document.body.removeChild(anchor);
642 - URL.revokeObjectURL(url);
643 -};
644 -
645 -/***/ }),
646 -
647 -/***/ "./packages/packages/core/editor-design-system/src/export/export-notifications.ts":
648 -/*!****************************************************************************************!*\
649 - !*** ./packages/packages/core/editor-design-system/src/export/export-notifications.ts ***!
650 - \****************************************************************************************/
651 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
652 -
653 -__webpack_require__.r(__webpack_exports__);
654 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
655 -/* harmony export */ notifyExportFailure: function() { return /* binding */ notifyExportFailure; },
656 -/* harmony export */ notifyExportInProgress: function() { return /* binding */ notifyExportInProgress; },
657 -/* harmony export */ notifyExportSuccess: function() { return /* binding */ notifyExportSuccess; }
658 -/* harmony export */ });
659 -/* harmony import */ var _elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @elementor/editor-notifications */ "@elementor/editor-notifications");
660 -/* harmony import */ var _elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__);
661 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
662 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
663 -
664 -
665 -const EXPORT_STARTED_NOTIFICATION_ID = 'design-system-export-started';
666 -const SUCCESS_NOTIFICATION_ID = 'design-system-export-succeeded';
667 -const FAILURE_NOTIFICATION_ID = 'design-system-export-failed';
668 -const notifyExportInProgress = () => {
669 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.notify)({
670 - id: EXPORT_STARTED_NOTIFICATION_ID,
671 - type: 'info',
672 - message: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Export in progress. Your file will download when it’s ready.', 'elementor')
673 - });
674 -};
675 -const notifyExportSuccess = () => {
676 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.dismissNotification)(EXPORT_STARTED_NOTIFICATION_ID);
677 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.notify)({
678 - id: SUCCESS_NOTIFICATION_ID,
679 - type: 'success',
680 - message: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Design system exported', 'elementor')
681 - });
682 -};
683 -const notifyExportFailure = onRetry => {
684 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.dismissNotification)(EXPORT_STARTED_NOTIFICATION_ID);
685 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.notify)({
686 - id: FAILURE_NOTIFICATION_ID,
687 - type: 'error',
688 - message: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Your design system export failed', 'elementor'),
689 - additionalActionProps: [{
690 - size: 'small',
691 - variant: 'outlined',
692 - color: 'error',
693 - children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Try again', 'elementor'),
694 - onClick: () => {
695 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.dismissNotification)(FAILURE_NOTIFICATION_ID);
696 - onRetry();
697 - }
698 - }]
699 - });
700 -};
701 -
702 -/***/ }),
703 -
704 -/***/ "./packages/packages/core/editor-design-system/src/export/hooks/use-export-request.ts":
705 -/*!********************************************************************************************!*\
706 - !*** ./packages/packages/core/editor-design-system/src/export/hooks/use-export-request.ts ***!
707 - \********************************************************************************************/
708 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
709 -
710 -__webpack_require__.r(__webpack_exports__);
711 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
712 -/* harmony export */ DEFAULT_EXPORT_FILE_NAME: function() { return /* binding */ DEFAULT_EXPORT_FILE_NAME; },
713 -/* harmony export */ DesignSystemExportError: function() { return /* binding */ DesignSystemExportError; },
714 -/* harmony export */ EXPORT_DESIGN_SYSTEM_MUTATION_KEY: function() { return /* binding */ EXPORT_DESIGN_SYSTEM_MUTATION_KEY; },
715 -/* harmony export */ useExportRequest: function() { return /* binding */ useExportRequest; }
716 -/* harmony export */ });
717 -/* harmony import */ var _elementor_http_client__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @elementor/http-client */ "@elementor/http-client");
718 -/* harmony import */ var _elementor_http_client__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_elementor_http_client__WEBPACK_IMPORTED_MODULE_0__);
719 -/* harmony import */ var _elementor_query__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @elementor/query */ "@elementor/query");
720 -/* harmony import */ var _elementor_query__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_elementor_query__WEBPACK_IMPORTED_MODULE_1__);
721 -
722 -
723 -const EXPORT_BASE_PATH = 'elementor/v1/import-export-customization';
724 -const EXPORT_DESIGN_SYSTEM_MUTATION_KEY = 'design-system-export';
725 -const DEFAULT_EXPORT_FILE_NAME = 'design-system-export.zip';
726 -
727 -// 2 minutes
728 -const EXPORT_REQUEST_TIMEOUT_MS = 120_000;
729 -const EXPORT_REQUEST_BODY = {
730 - include: ['settings'],
731 - kitInfo: {
732 - title: 'design-system',
733 - description: '',
734 - source: 'local'
735 - },
736 - customization: {
737 - settings: {
738 - theme: false,
739 - classes: true,
740 - variables: true
741 - }
742 - }
743 -};
744 -class DesignSystemExportError extends Error {
745 - constructor(cause) {
746 - super('Design system export failed');
747 - this.name = 'DesignSystemExportError';
748 - this.cause = cause;
749 - }
750 -}
751 -const useExportRequest = () => {
752 - return (0,_elementor_query__WEBPACK_IMPORTED_MODULE_1__.useMutation)({
753 - mutationKey: [EXPORT_DESIGN_SYSTEM_MUTATION_KEY],
754 - mutationFn: async () => {
755 - try {
756 - const {
757 - data
758 - } = await (0,_elementor_http_client__WEBPACK_IMPORTED_MODULE_0__.httpService)().post(`${EXPORT_BASE_PATH}/export`, EXPORT_REQUEST_BODY, {
759 - timeout: EXPORT_REQUEST_TIMEOUT_MS
760 - });
761 - return {
762 - fileName: DEFAULT_EXPORT_FILE_NAME,
763 - blob: base64ToZipBlob(data.data.file)
764 - };
765 - } catch (error) {
766 - throw new DesignSystemExportError(error);
767 - }
768 - }
769 - });
770 -};
771 -const base64ToZipBlob = base64 => {
772 - const binary = atob(base64);
773 - const bytes = new Uint8Array(binary.length);
774 - for (let i = 0; i < binary.length; i++) {
775 - bytes[i] = binary.charCodeAt(i);
776 - }
777 - return new Blob([bytes], {
778 - type: 'application/zip'
779 - });
780 -};
781 -
782 -/***/ }),
783 -
784 -/***/ "./packages/packages/core/editor-design-system/src/import/components/conflict-options.tsx":
785 -/*!************************************************************************************************!*\
786 - !*** ./packages/packages/core/editor-design-system/src/import/components/conflict-options.tsx ***!
787 - \************************************************************************************************/
788 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
789 -
790 -__webpack_require__.r(__webpack_exports__);
791 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
792 -/* harmony export */ ConflictOptions: function() { return /* binding */ ConflictOptions; }
793 -/* harmony export */ });
794 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
795 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
796 -/* harmony import */ var _elementor_ui__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @elementor/ui */ "@elementor/ui");
797 -/* harmony import */ var _elementor_ui__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__);
798 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
799 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
800 -
801 -
802 -
803 -const getOptions = () => [{
804 - value: 'replace',
805 - title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Replace existing values', 'elementor'),
806 - description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Imported design system values will overwrite existing variables and classes.', 'elementor')
807 -}, {
808 - value: 'keep',
809 - title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Keep existing values', 'elementor'),
810 - description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Existing variables and classes will not change.', 'elementor')
811 -}];
812 -const ConflictOptions = ({
813 - value,
814 - onChange
815 -}) => {
816 - const options = getOptions();
817 - return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__.Stack, {
818 - spacing: 1
819 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__.Typography, {
820 - variant: "body1"
821 - }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('How to handle conflicts with existing variables or classes?', 'elementor')), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__.RadioGroup, {
822 - value: value ?? '',
823 - onChange: (_, next) => onChange(next)
824 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__.Stack, {
825 - spacing: 1
826 - }, options.map(option => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__.Card, {
827 - key: option.value,
828 - variant: "outlined"
829 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__.CardActionArea, {
830 - onClick: () => onChange(option.value)
831 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__.Stack, {
832 - direction: "row",
833 - alignItems: "center",
834 - spacing: 2,
835 - padding: 2
836 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__.Radio, {
837 - value: option.value,
838 - checked: value === option.value,
839 - inputProps: {
840 - 'aria-label': option.title
841 - }
842 - }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__.Stack, {
843 - direction: "column",
844 - spacing: 0.5
845 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__.Typography, {
846 - variant: "subtitle2"
847 - }, option.title), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_1__.Typography, {
848 - variant: "caption",
849 - color: "text.secondary"
850 - }, option.description)))))))));
851 -};
852 -
853 -/***/ }),
854 -
855 -/***/ "./packages/packages/core/editor-design-system/src/import/hooks/use-dialog-state.ts":
856 -/*!******************************************************************************************!*\
857 - !*** ./packages/packages/core/editor-design-system/src/import/hooks/use-dialog-state.ts ***!
858 - \******************************************************************************************/
859 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
860 -
861 -__webpack_require__.r(__webpack_exports__);
862 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
863 -/* harmony export */ useDialogState: function() { return /* binding */ useDialogState; }
864 -/* harmony export */ });
865 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
866 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
867 -
868 -const initialState = {
869 - file: null,
870 - conflictStrategy: null
871 -};
872 -const useDialogState = () => {
873 - const [state, setState] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(initialState);
874 - const setFile = file => setState(prev => ({
875 - ...prev,
876 - file
877 - }));
878 - const setConflictStrategy = conflictStrategy => setState(prev => ({
879 - ...prev,
880 - conflictStrategy
881 - }));
882 - return {
883 - ...state,
884 - setFile,
885 - setConflictStrategy
886 - };
887 -};
888 -
889 -/***/ }),
890 -
891 -/***/ "./packages/packages/core/editor-design-system/src/import/hooks/use-import-request.ts":
892 -/*!********************************************************************************************!*\
893 - !*** ./packages/packages/core/editor-design-system/src/import/hooks/use-import-request.ts ***!
894 - \********************************************************************************************/
895 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
896 -
897 -__webpack_require__.r(__webpack_exports__);
898 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
899 -/* harmony export */ DesignSystemUploadValidationError: function() { return /* binding */ DesignSystemUploadValidationError; },
900 -/* harmony export */ IMPORT_DESIGN_SYSTEM_MUTATION_KEY: function() { return /* binding */ IMPORT_DESIGN_SYSTEM_MUTATION_KEY; },
901 -/* harmony export */ useImportRequest: function() { return /* binding */ useImportRequest; }
902 -/* harmony export */ });
903 -/* harmony import */ var _elementor_editor_canvas__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @elementor/editor-canvas */ "@elementor/editor-canvas");
904 -/* harmony import */ var _elementor_editor_canvas__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_canvas__WEBPACK_IMPORTED_MODULE_0__);
905 -/* harmony import */ var _elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @elementor/editor-v1-adapters */ "@elementor/editor-v1-adapters");
906 -/* harmony import */ var _elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_1__);
907 -/* harmony import */ var _elementor_http_client__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @elementor/http-client */ "@elementor/http-client");
908 -/* harmony import */ var _elementor_http_client__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_elementor_http_client__WEBPACK_IMPORTED_MODULE_2__);
909 -/* harmony import */ var _elementor_query__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @elementor/query */ "@elementor/query");
910 -/* harmony import */ var _elementor_query__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_elementor_query__WEBPACK_IMPORTED_MODULE_3__);
911 -
912 -
913 -
914 -
915 -const IMPORT_BASE_PATH = 'elementor/v1/import-export-customization';
916 -const IMPORT_REQUEST_TIMEOUT_MS = 120_000;
917 -const GLOBAL_CLASSES_RUNNER = 'global-classes';
918 -const GLOBAL_VARIABLES_RUNNER = 'global-variables';
919 -const SUPPORTED_RUNNERS = [GLOBAL_CLASSES_RUNNER, GLOBAL_VARIABLES_RUNNER];
920 -const IMPORT_DESIGN_SYSTEM_MUTATION_KEY = 'design-system-import';
921 -const useImportRequest = () => {
922 - return (0,_elementor_query__WEBPACK_IMPORTED_MODULE_3__.useMutation)({
923 - mutationKey: [IMPORT_DESIGN_SYSTEM_MUTATION_KEY],
924 - mutationFn: async ({
925 - file,
926 - conflictStrategy
927 - }) => {
928 - await (0,_elementor_editor_v1_adapters__WEBPACK_IMPORTED_MODULE_1__.__privateRunCommand)('document/save/auto', {
929 - force: true
930 - });
931 - const session = await uploadKit(file);
932 - const runners = await startImport(session, conflictStrategy);
933 - await runRunners(session, runners);
934 - window.dispatchEvent(new CustomEvent(_elementor_editor_canvas__WEBPACK_IMPORTED_MODULE_0__.GLOBAL_STYLES_IMPORTED_EVENT));
935 - }
936 - });
937 -};
938 -class DesignSystemUploadValidationError extends Error {
939 - constructor(cause) {
940 - super('Design system upload validation failed');
941 - this.name = 'DesignSystemUploadValidationError';
942 - this.cause = cause;
943 - }
944 -}
945 -const uploadKit = async file => {
946 - const formData = new FormData();
947 - formData.append('e_import_file', file);
948 - try {
949 - const {
950 - data
951 - } = await (0,_elementor_http_client__WEBPACK_IMPORTED_MODULE_2__.httpService)().post(`${IMPORT_BASE_PATH}/upload`, formData, {
952 - headers: {
953 - 'Content-Type': 'multipart/form-data'
954 - },
955 - timeout: IMPORT_REQUEST_TIMEOUT_MS
956 - });
957 - return data.data.session;
958 - } catch (error) {
959 - throw new DesignSystemUploadValidationError(error);
960 - }
961 -};
962 -const startImport = async (session, conflictStrategy) => {
963 - const customization = {
964 - 'design-system': {
965 - conflict_resolution: conflictStrategy === 'keep' ? 'skip' : 'replace'
966 - }
967 - };
968 - const {
969 - data
970 - } = await (0,_elementor_http_client__WEBPACK_IMPORTED_MODULE_2__.httpService)().post(`${IMPORT_BASE_PATH}/import`, {
971 - session,
972 - include: ['design-system'],
973 - customization
974 - }, {
975 - timeout: IMPORT_REQUEST_TIMEOUT_MS
976 - });
977 - return (data.data.runners ?? []).filter(runner => SUPPORTED_RUNNERS.includes(runner));
978 -};
979 -const runRunners = async (session, runners) => {
980 - for (const runner of runners) {
981 - await (0,_elementor_http_client__WEBPACK_IMPORTED_MODULE_2__.httpService)().post(`${IMPORT_BASE_PATH}/import-runner`, {
982 - session,
983 - runner
984 - }, {
985 - timeout: IMPORT_REQUEST_TIMEOUT_MS
986 - });
987 - }
988 -};
989 -
990 -/***/ }),
991 -
992 -/***/ "./packages/packages/core/editor-design-system/src/import/import-design-system-dialog.tsx":
993 -/*!************************************************************************************************!*\
994 - !*** ./packages/packages/core/editor-design-system/src/import/import-design-system-dialog.tsx ***!
995 - \************************************************************************************************/
996 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
997 -
998 -__webpack_require__.r(__webpack_exports__);
999 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
1000 -/* harmony export */ ImportDesignSystemDialog: function() { return /* binding */ ImportDesignSystemDialog; }
1001 -/* harmony export */ });
1002 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
1003 -/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
1004 -/* harmony import */ var _elementor_editor_ui__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @elementor/editor-ui */ "@elementor/editor-ui");
1005 -/* harmony import */ var _elementor_editor_ui__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_1__);
1006 -/* harmony import */ var _elementor_icons__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @elementor/icons */ "@elementor/icons");
1007 -/* harmony import */ var _elementor_icons__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_elementor_icons__WEBPACK_IMPORTED_MODULE_2__);
1008 -/* harmony import */ var _elementor_ui__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @elementor/ui */ "@elementor/ui");
1009 -/* harmony import */ var _elementor_ui__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_elementor_ui__WEBPACK_IMPORTED_MODULE_3__);
1010 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
1011 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__);
1012 -/* harmony import */ var _components_conflict_options__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components/conflict-options */ "./packages/packages/core/editor-design-system/src/import/components/conflict-options.tsx");
1013 -/* harmony import */ var _hooks_use_dialog_state__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./hooks/use-dialog-state */ "./packages/packages/core/editor-design-system/src/import/hooks/use-dialog-state.ts");
1014 -/* harmony import */ var _hooks_use_import_request__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./hooks/use-import-request */ "./packages/packages/core/editor-design-system/src/import/hooks/use-import-request.ts");
1015 -/* harmony import */ var _import_notifications__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./import-notifications */ "./packages/packages/core/editor-design-system/src/import/import-notifications.tsx");
1016 -/* harmony import */ var _tracking__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./tracking */ "./packages/packages/core/editor-design-system/src/import/tracking.ts");
1017 -
1018 -
1019 -
1020 -
1021 -
1022 -
1023 -
1024 -
1025 -
1026 -
1027 -const ALLOWED_FILE_TYPES = ['application/zip'];
1028 -const FILE_INPUT_ACCEPT = 'application/zip,.zip';
1029 -// TODO: Replace with the actual server-enforced limit once finalized.
1030 -const MAX_FILE_SIZE_MB = 3;
1031 -const LEARN_MORE_URL = 'https://go.elementor.com/wp-dash-import-export-design-system/';
1032 -const reopenSelf = () => {
1033 - (0,_tracking__WEBPACK_IMPORTED_MODULE_9__.trackDesignSystem)({
1034 - event: 'importOpened'
1035 - });
1036 - (0,_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_1__.openDialog)({
1037 - component: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(ImportDesignSystemDialog, {
1038 - onClose: _elementor_editor_ui__WEBPACK_IMPORTED_MODULE_1__.closeDialog
1039 - })
1040 - });
1041 -};
1042 -const ImportDesignSystemDialog = ({
1043 - onClose
1044 -}) => {
1045 - const {
1046 - file,
1047 - conflictStrategy,
1048 - setFile,
1049 - setConflictStrategy
1050 - } = (0,_hooks_use_dialog_state__WEBPACK_IMPORTED_MODULE_6__.useDialogState)();
1051 - const importMutation = (0,_hooks_use_import_request__WEBPACK_IMPORTED_MODULE_7__.useImportRequest)();
1052 - const isImportEnabled = Boolean(file && conflictStrategy);
1053 - const handleFileSelected = selected => {
1054 - setFile(selected);
1055 - (0,_tracking__WEBPACK_IMPORTED_MODULE_9__.trackDesignSystem)({
1056 - event: 'fileSelected',
1057 - file_type: _tracking__WEBPACK_IMPORTED_MODULE_9__.FILE_TYPE_DESIGN_SYSTEM
1058 - });
1059 - };
1060 - const handleConflictChange = choice => {
1061 - setConflictStrategy(choice);
1062 - (0,_tracking__WEBPACK_IMPORTED_MODULE_9__.trackDesignSystem)({
1063 - event: 'conflictChoice',
1064 - choice
1065 - });
1066 - };
1067 - const handleImport = async () => {
1068 - if (!file || !conflictStrategy) {
1069 - return;
1070 - }
1071 - (0,_tracking__WEBPACK_IMPORTED_MODULE_9__.trackDesignSystem)({
1072 - event: 'confirmed',
1073 - conflict_choice: conflictStrategy
1074 - });
1075 - (0,_import_notifications__WEBPACK_IMPORTED_MODULE_8__.notifyImportInProgress)();
1076 - onClose();
1077 - try {
1078 - await importMutation.mutateAsync({
1079 - file,
1080 - conflictStrategy
1081 - });
1082 - (0,_tracking__WEBPACK_IMPORTED_MODULE_9__.trackDesignSystem)({
1083 - event: 'imported'
1084 - });
1085 - (0,_import_notifications__WEBPACK_IMPORTED_MODULE_8__.notifyImportSuccess)();
1086 - } catch (error) {
1087 - if (error instanceof _hooks_use_import_request__WEBPACK_IMPORTED_MODULE_7__.DesignSystemUploadValidationError) {
1088 - (0,_tracking__WEBPACK_IMPORTED_MODULE_9__.trackDesignSystem)({
1089 - event: 'validationFailed',
1090 - file_type: _tracking__WEBPACK_IMPORTED_MODULE_9__.FILE_TYPE_DESIGN_SYSTEM
1091 - });
1092 - } else {
1093 - (0,_tracking__WEBPACK_IMPORTED_MODULE_9__.trackDesignSystem)({
1094 - event: 'importFailed'
1095 - });
1096 - }
1097 - (0,_import_notifications__WEBPACK_IMPORTED_MODULE_8__.notifyImportFailure)(reopenSelf);
1098 - }
1099 - };
1100 - return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_3__.DialogHeader, {
1101 - logo: false
1102 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_3__.DialogTitle, null, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)('Import Design System', 'elementor'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_3__.DialogContent, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_3__.Stack, {
1103 - spacing: 3
1104 - }, file ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_1__.FileUploadRow, {
1105 - file: file,
1106 - onRemove: () => setFile(null)
1107 - }) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_editor_ui__WEBPACK_IMPORTED_MODULE_1__.FileUploadDropzone, {
1108 - onFileSelected: handleFileSelected,
1109 - allowedFileTypes: ALLOWED_FILE_TYPES,
1110 - accept: FILE_INPUT_ACCEPT,
1111 - regionLabel: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)('Design system file dropzone', 'elementor'),
1112 - helperText: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.sprintf)(
1113 - // translators: %d is the maximum file size in megabytes.
1114 - (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)('zip (max. %dMB)', 'elementor'), MAX_FILE_SIZE_MB)
1115 - }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components_conflict_options__WEBPACK_IMPORTED_MODULE_5__.ConflictOptions, {
1116 - value: conflictStrategy,
1117 - onChange: handleConflictChange
1118 - }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_3__.Stack, {
1119 - direction: "row",
1120 - spacing: 0.5,
1121 - alignItems: "center",
1122 - justifyContent: "flex-start"
1123 - }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_icons__WEBPACK_IMPORTED_MODULE_2__.HelpIcon, {
1124 - sx: {
1125 - fontSize: 16,
1126 - color: 'text.tertiary'
1127 - }
1128 - }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_3__.Link, {
1129 - href: LEARN_MORE_URL,
1130 - target: "_blank",
1131 - rel: "noopener noreferrer",
1132 - underline: "always",
1133 - variant: "caption",
1134 - color: "text.tertiary"
1135 - }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)('Learn how design system imports work', 'elementor'))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_3__.DialogActions, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_3__.Button, {
1136 - size: "medium",
1137 - color: "secondary",
1138 - onClick: onClose
1139 - }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)('Cancel', 'elementor')), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_elementor_ui__WEBPACK_IMPORTED_MODULE_3__.Button, {
1140 - size: "medium",
1141 - variant: "contained",
1142 - color: "primary",
1143 - disabled: !isImportEnabled,
1144 - onClick: handleImport
1145 - }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)('Import', 'elementor'))));
1146 -};
1147 -
1148 -/***/ }),
1149 -
1150 -/***/ "./packages/packages/core/editor-design-system/src/import/import-notifications.tsx":
1151 -/*!*****************************************************************************************!*\
1152 - !*** ./packages/packages/core/editor-design-system/src/import/import-notifications.tsx ***!
1153 - \*****************************************************************************************/
1154 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
1155 -
1156 -__webpack_require__.r(__webpack_exports__);
1157 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
1158 -/* harmony export */ notifyImportFailure: function() { return /* binding */ notifyImportFailure; },
1159 -/* harmony export */ notifyImportInProgress: function() { return /* binding */ notifyImportInProgress; },
1160 -/* harmony export */ notifyImportSuccess: function() { return /* binding */ notifyImportSuccess; }
1161 -/* harmony export */ });
1162 -/* harmony import */ var _elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @elementor/editor-notifications */ "@elementor/editor-notifications");
1163 -/* harmony import */ var _elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__);
1164 -/* harmony import */ var _elementor_query__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @elementor/query */ "@elementor/query");
1165 -/* harmony import */ var _elementor_query__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_elementor_query__WEBPACK_IMPORTED_MODULE_1__);
1166 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
1167 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
1168 -/* harmony import */ var _hooks_use_import_request__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./hooks/use-import-request */ "./packages/packages/core/editor-design-system/src/import/hooks/use-import-request.ts");
1169 -
1170 -
1171 -
1172 -
1173 -const IMPORT_STARTED_NOTIFICATION_ID = 'design-system-import-started';
1174 -const SUCCESS_NOTIFICATION_ID = 'design-system-import-succeeded';
1175 -const FAILURE_NOTIFICATION_ID = 'design-system-import-failed';
1176 -const notifyImportInProgress = () => {
1177 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.notify)({
1178 - id: IMPORT_STARTED_NOTIFICATION_ID,
1179 - type: 'info',
1180 - message: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Import in Progress. You will be notified when the import is complete.', 'elementor')
1181 - });
1182 -};
1183 -const notifyImportSuccess = () => {
1184 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.dismissNotification)(IMPORT_STARTED_NOTIFICATION_ID);
1185 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.notify)({
1186 - id: SUCCESS_NOTIFICATION_ID,
1187 - type: 'success',
1188 - message: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Design system imported', 'elementor')
1189 - });
1190 -};
1191 -const notifyImportFailure = onRetry => {
1192 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.dismissNotification)(IMPORT_STARTED_NOTIFICATION_ID);
1193 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.notify)({
1194 - id: FAILURE_NOTIFICATION_ID,
1195 - type: 'error',
1196 - message: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Your design system import failed', 'elementor'),
1197 - additionalActionProps: [{
1198 - size: 'small',
1199 - variant: 'outlined',
1200 - color: 'error',
1201 - children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Try again', 'elementor'),
1202 - onClick: () => {
1203 - (0,_elementor_editor_notifications__WEBPACK_IMPORTED_MODULE_0__.dismissNotification)(FAILURE_NOTIFICATION_ID);
1204 - const isImporting = (0,_elementor_query__WEBPACK_IMPORTED_MODULE_1__.getQueryClient)().isMutating({
1205 - mutationKey: [_hooks_use_import_request__WEBPACK_IMPORTED_MODULE_3__.IMPORT_DESIGN_SYSTEM_MUTATION_KEY]
1206 - }) > 0;
1207 - if (isImporting) {
1208 - return;
1209 - }
1210 - onRetry();
1211 - }
1212 - }]
1213 - });
1214 -};
1215 -
1216 -/***/ }),
1217 -
1218 -/***/ "./packages/packages/core/editor-design-system/src/import/tracking.ts":
1219 -/*!****************************************************************************!*\
1220 - !*** ./packages/packages/core/editor-design-system/src/import/tracking.ts ***!
1221 - \****************************************************************************/
1222 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
1223 -
1224 -__webpack_require__.r(__webpack_exports__);
1225 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
1226 -/* harmony export */ FILE_TYPE_DESIGN_SYSTEM: function() { return /* binding */ FILE_TYPE_DESIGN_SYSTEM; },
1227 -/* harmony export */ trackDesignSystem: function() { return /* binding */ trackDesignSystem; }
1228 -/* harmony export */ });
1229 -/* harmony import */ var _elementor_events__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @elementor/events */ "@elementor/events");
1230 -/* harmony import */ var _elementor_events__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_elementor_events__WEBPACK_IMPORTED_MODULE_0__);
1231 -
1232 -const FILE_TYPE_DESIGN_SYSTEM = 'design_system';
1233 -const trackDesignSystem = payload => {
1234 - const {
1235 - dispatchEvent,
1236 - config
1237 - } = (0,_elementor_events__WEBPACK_IMPORTED_MODULE_0__.getMixpanel)();
1238 - const name = config?.names?.design_system?.[payload.event];
1239 - if (!name) {
1240 - return;
1241 - }
1242 - const {
1243 - event,
1244 - ...eventData
1245 - } = payload;
1246 - try {
1247 - dispatchEvent?.(name, {
1248 - event,
1249 - ...eventData
1250 - });
1251 - } catch {
1252 - // Silently ignore tracking errors so they don't break the user flow.
1253 - }
1254 -};
1255 -
1256 -/***/ }),
1257 -
1258 -/***/ "./packages/packages/core/editor-design-system/src/init.ts":
1259 -/*!*****************************************************************!*\
1260 - !*** ./packages/packages/core/editor-design-system/src/init.ts ***!
1261 - \*****************************************************************/
1262 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
1263 -
1264 -__webpack_require__.r(__webpack_exports__);
1265 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
1266 -/* harmony export */ init: function() { return /* binding */ init; }
1267 -/* harmony export */ });
1268 -/* harmony import */ var _elementor_editor__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @elementor/editor */ "@elementor/editor");
1269 -/* harmony import */ var _elementor_editor__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor__WEBPACK_IMPORTED_MODULE_0__);
1270 -/* harmony import */ var _elementor_editor_app_bar__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @elementor/editor-app-bar */ "@elementor/editor-app-bar");
1271 -/* harmony import */ var _elementor_editor_app_bar__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_app_bar__WEBPACK_IMPORTED_MODULE_1__);
1272 -/* harmony import */ var _elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @elementor/editor-panels */ "@elementor/editor-panels");
1273 -/* harmony import */ var _elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__);
1274 -/* harmony import */ var _components_design_system_entrypoints__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/design-system-entrypoints */ "./packages/packages/core/editor-design-system/src/components/design-system-entrypoints.tsx");
1275 -/* harmony import */ var _design_system_panel__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./design-system-panel */ "./packages/packages/core/editor-design-system/src/design-system-panel.tsx");
1276 -/* harmony import */ var _use_open_design_system_toolbar__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./use-open-design-system-toolbar */ "./packages/packages/core/editor-design-system/src/use-open-design-system-toolbar.ts");
1277 -
1278 -
1279 -
1280 -
1281 -
1282 -
1283 -function init() {
1284 - (0,_elementor_editor_panels__WEBPACK_IMPORTED_MODULE_2__.__registerPanel)(_design_system_panel__WEBPACK_IMPORTED_MODULE_4__.panel);
1285 - (0,_elementor_editor__WEBPACK_IMPORTED_MODULE_0__.injectIntoLogic)({
1286 - id: 'design-system-entrypoints',
1287 - component: _components_design_system_entrypoints__WEBPACK_IMPORTED_MODULE_3__.DesignSystemEntrypoints
1288 - });
1289 - _elementor_editor_app_bar__WEBPACK_IMPORTED_MODULE_1__.toolsMenu.registerToggleAction({
1290 - id: 'open-design-system-toolbar',
1291 - priority: 21,
1292 - useProps: _use_open_design_system_toolbar__WEBPACK_IMPORTED_MODULE_5__.useOpenDesignSystemToolbar
1293 - });
1294 -}
1295 -
1296 -/***/ }),
1297 -
1298 -/***/ "./packages/packages/core/editor-design-system/src/initial-tab.ts":
1299 -/*!************************************************************************!*\
1300 - !*** ./packages/packages/core/editor-design-system/src/initial-tab.ts ***!
1301 - \************************************************************************/
1302 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
1303 -
1304 -__webpack_require__.r(__webpack_exports__);
1305 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
1306 -/* harmony export */ getActiveDesignSystemTab: function() { return /* binding */ getActiveDesignSystemTab; },
1307 -/* harmony export */ getInitialDesignSystemTab: function() { return /* binding */ getInitialDesignSystemTab; },
1308 -/* harmony export */ notifyDesignSystemTabChange: function() { return /* binding */ notifyDesignSystemTabChange; },
1309 -/* harmony export */ persistDesignSystemTab: function() { return /* binding */ persistDesignSystemTab; },
1310 -/* harmony export */ setPendingDesignSystemTab: function() { return /* binding */ setPendingDesignSystemTab; }
1311 -/* harmony export */ });
1312 -const STORAGE_KEY = 'elementor_editor_design_system_active_tab';
1313 -function readStoredTab() {
1314 - if (typeof window === 'undefined') {
1315 - return 'variables';
1316 - }
1317 - try {
1318 - const raw = window.localStorage.getItem(STORAGE_KEY);
1319 - if (raw === 'classes' || raw === 'variables') {
1320 - return raw;
1321 - }
1322 - } catch {
1323 - // Storage may be unavailable (private mode, quota, etc.).
1324 - }
1325 - return 'variables';
1326 -}
1327 -let pendingTabForOpen = null;
1328 -let activeTabInMemory = readStoredTab();
1329 -function setPendingDesignSystemTab(tab) {
1330 - pendingTabForOpen = tab;
1331 -}
1332 -function getInitialDesignSystemTab() {
1333 - if (pendingTabForOpen) {
1334 - const t = pendingTabForOpen;
1335 - pendingTabForOpen = null;
1336 - activeTabInMemory = t;
1337 - persistDesignSystemTab(t);
1338 - return t;
1339 - }
1340 - const t = readStoredTab();
1341 - activeTabInMemory = t;
1342 - return t;
1343 -}
1344 -function notifyDesignSystemTabChange(tab) {
1345 - activeTabInMemory = tab;
1346 -}
1347 -function getActiveDesignSystemTab() {
1348 - return activeTabInMemory;
1349 -}
1350 -function persistDesignSystemTab(tab) {
1351 - if (typeof window === 'undefined') {
1352 - return;
1353 - }
1354 - try {
1355 - window.localStorage.setItem(STORAGE_KEY, tab);
1356 - } catch {
1357 - // Ignore persistence failures.
1358 - }
1359 -}
1360 -
1361 -/***/ }),
1362 -
1363 -/***/ "./packages/packages/core/editor-design-system/src/use-open-design-system-toolbar.ts":
1364 -/*!*******************************************************************************************!*\
1365 - !*** ./packages/packages/core/editor-design-system/src/use-open-design-system-toolbar.ts ***!
1366 - \*******************************************************************************************/
1367 -/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
1368 -
1369 -__webpack_require__.r(__webpack_exports__);
1370 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
1371 -/* harmony export */ useOpenDesignSystemToolbar: function() { return /* binding */ useOpenDesignSystemToolbar; }
1372 -/* harmony export */ });
1373 -/* harmony import */ var _elementor_icons__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @elementor/icons */ "@elementor/icons");
1374 -/* harmony import */ var _elementor_icons__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_elementor_icons__WEBPACK_IMPORTED_MODULE_0__);
1375 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
1376 -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
1377 -/* harmony import */ var _design_system_panel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./design-system-panel */ "./packages/packages/core/editor-design-system/src/design-system-panel.tsx");
1378 -/* harmony import */ var _import_tracking__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./import/tracking */ "./packages/packages/core/editor-design-system/src/import/tracking.ts");
1379 -/* harmony import */ var _initial_tab__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./initial-tab */ "./packages/packages/core/editor-design-system/src/initial-tab.ts");
1380 -
1381 -
1382 -const EVENT_TOGGLE = 'elementor/toggle-design-system';
1383 -
1384 -
1385 -
1386 -function useOpenDesignSystemToolbar() {
1387 - const {
1388 - isOpen
1389 - } = (0,_design_system_panel__WEBPACK_IMPORTED_MODULE_2__.usePanelStatus)();
1390 - return {
1391 - title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Design System', 'elementor'),
1392 - icon: _elementor_icons__WEBPACK_IMPORTED_MODULE_0__.DropletHalfFilledIcon,
1393 - onClick: () => {
1394 - if (!isOpen) {
1395 - (0,_import_tracking__WEBPACK_IMPORTED_MODULE_3__.trackDesignSystem)({
1396 - event: 'opened'
1397 - });
1398 - }
1399 - const tab = (0,_initial_tab__WEBPACK_IMPORTED_MODULE_4__.getActiveDesignSystemTab)() ?? 'variables';
1400 - window.dispatchEvent(new CustomEvent(EVENT_TOGGLE, {
1401 - detail: {
1402 - tab
1403 - }
1404 - }));
1405 - },
1406 - selected: isOpen
1407 - };
1408 -}
1409 -
1410 -/***/ }),
1411 -
1412 -/***/ "@elementor/editor":
1413 -/*!*****************************************!*\
1414 - !*** external ["elementorV2","editor"] ***!
1415 - \*****************************************/
1416 -/***/ (function(module) {
1417 -
1418 -module.exports = window["elementorV2"]["editor"];
1419 -
1420 -/***/ }),
1421 -
1422 -/***/ "@elementor/editor-app-bar":
1423 -/*!***********************************************!*\
1424 - !*** external ["elementorV2","editorAppBar"] ***!
1425 - \***********************************************/
1426 -/***/ (function(module) {
1427 -
1428 -module.exports = window["elementorV2"]["editorAppBar"];
1429 -
1430 -/***/ }),
1431 -
1432 -/***/ "@elementor/editor-canvas":
1433 -/*!***********************************************!*\
1434 - !*** external ["elementorV2","editorCanvas"] ***!
1435 - \***********************************************/
1436 -/***/ (function(module) {
1437 -
1438 -module.exports = window["elementorV2"]["editorCanvas"];
1439 -
1440 -/***/ }),
1441 -
1442 -/***/ "@elementor/editor-current-user":
1443 -/*!****************************************************!*\
1444 - !*** external ["elementorV2","editorCurrentUser"] ***!
1445 - \****************************************************/
1446 -/***/ (function(module) {
1447 -
1448 -module.exports = window["elementorV2"]["editorCurrentUser"];
1449 -
1450 -/***/ }),
1451 -
1452 -/***/ "@elementor/editor-documents":
1453 -/*!**************************************************!*\
1454 - !*** external ["elementorV2","editorDocuments"] ***!
1455 - \**************************************************/
1456 -/***/ (function(module) {
1457 -
1458 -module.exports = window["elementorV2"]["editorDocuments"];
1459 -
1460 -/***/ }),
1461 -
1462 -/***/ "@elementor/editor-global-classes":
1463 -/*!******************************************************!*\
1464 - !*** external ["elementorV2","editorGlobalClasses"] ***!
1465 - \******************************************************/
1466 -/***/ (function(module) {
1467 -
1468 -module.exports = window["elementorV2"]["editorGlobalClasses"];
1469 -
1470 -/***/ }),
1471 -
1472 -/***/ "@elementor/editor-notifications":
1473 -/*!******************************************************!*\
1474 - !*** external ["elementorV2","editorNotifications"] ***!
1475 - \******************************************************/
1476 -/***/ (function(module) {
1477 -
1478 -module.exports = window["elementorV2"]["editorNotifications"];
1479 -
1480 -/***/ }),
1481 -
1482 -/***/ "@elementor/editor-panels":
1483 -/*!***********************************************!*\
1484 - !*** external ["elementorV2","editorPanels"] ***!
1485 - \***********************************************/
1486 -/***/ (function(module) {
1487 -
1488 -module.exports = window["elementorV2"]["editorPanels"];
1489 -
1490 -/***/ }),
1491 -
1492 -/***/ "@elementor/editor-ui":
1493 -/*!*******************************************!*\
1494 - !*** external ["elementorV2","editorUi"] ***!
1495 - \*******************************************/
1496 -/***/ (function(module) {
1497 -
1498 -module.exports = window["elementorV2"]["editorUi"];
1499 -
1500 -/***/ }),
1501 -
1502 -/***/ "@elementor/editor-v1-adapters":
1503 -/*!***************************************************!*\
1504 - !*** external ["elementorV2","editorV1Adapters"] ***!
1505 - \***************************************************/
1506 -/***/ (function(module) {
1507 -
1508 -module.exports = window["elementorV2"]["editorV1Adapters"];
1509 -
1510 -/***/ }),
1511 -
1512 -/***/ "@elementor/editor-variables":
1513 -/*!**************************************************!*\
1514 - !*** external ["elementorV2","editorVariables"] ***!
1515 - \**************************************************/
1516 -/***/ (function(module) {
1517 -
1518 -module.exports = window["elementorV2"]["editorVariables"];
1519 -
1520 -/***/ }),
1521 -
1522 -/***/ "@elementor/events":
1523 -/*!*****************************************!*\
1524 - !*** external ["elementorV2","events"] ***!
1525 - \*****************************************/
1526 -/***/ (function(module) {
1527 -
1528 -module.exports = window["elementorV2"]["events"];
1529 -
1530 -/***/ }),
1531 -
1532 -/***/ "@elementor/http-client":
1533 -/*!*********************************************!*\
1534 - !*** external ["elementorV2","httpClient"] ***!
1535 - \*********************************************/
1536 -/***/ (function(module) {
1537 -
1538 -module.exports = window["elementorV2"]["httpClient"];
1539 -
1540 -/***/ }),
1541 -
1542 -/***/ "@elementor/icons":
1543 -/*!****************************************!*\
1544 - !*** external ["elementorV2","icons"] ***!
1545 - \****************************************/
1546 -/***/ (function(module) {
1547 -
1548 -module.exports = window["elementorV2"]["icons"];
1549 -
1550 -/***/ }),
1551 -
1552 -/***/ "@elementor/query":
1553 -/*!****************************************!*\
1554 - !*** external ["elementorV2","query"] ***!
1555 - \****************************************/
1556 -/***/ (function(module) {
1557 -
1558 -module.exports = window["elementorV2"]["query"];
1559 -
1560 -/***/ }),
1561 -
1562 -/***/ "@elementor/ui":
1563 -/*!*************************************!*\
1564 - !*** external ["elementorV2","ui"] ***!
1565 - \*************************************/
1566 -/***/ (function(module) {
1567 -
1568 -module.exports = window["elementorV2"]["ui"];
1569 -
1570 -/***/ }),
1571 -
1572 -/***/ "@wordpress/i18n":
1573 -/*!******************************!*\
1574 - !*** external ["wp","i18n"] ***!
1575 - \******************************/
1576 -/***/ (function(module) {
1577 -
1578 -module.exports = window["wp"]["i18n"];
1579 -
1580 -/***/ }),
1581 -
1582 -/***/ "react":
1583 -/*!**************************!*\
1584 - !*** external ["React"] ***!
1585 - \**************************/
1586 -/***/ (function(module) {
1587 -
1588 -module.exports = window["React"];
1589 -
1590 -/***/ })
1591 -
1592 -/******/ });
1593 -/************************************************************************/
1594 -/******/ // The module cache
1595 -/******/ var __webpack_module_cache__ = {};
1596 -/******/
1597 -/******/ // The require function
1598 -/******/ function __webpack_require__(moduleId) {
1599 -/******/ // Check if module is in cache
1600 -/******/ var cachedModule = __webpack_module_cache__[moduleId];
1601 -/******/ if (cachedModule !== undefined) {
1602 -/******/ return cachedModule.exports;
1603 -/******/ }
1604 -/******/ // Create a new module (and put it into the cache)
1605 -/******/ var module = __webpack_module_cache__[moduleId] = {
1606 -/******/ // no module.id needed
1607 -/******/ // no module.loaded needed
1608 -/******/ exports: {}
1609 -/******/ };
1610 -/******/
1611 -/******/ // Execute the module function
1612 -/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
1613 -/******/
1614 -/******/ // Return the exports of the module
1615 -/******/ return module.exports;
1616 -/******/ }
1617 -/******/
1618 -/************************************************************************/
1619 -/******/ /* webpack/runtime/compat get default export */
1620 -/******/ !function() {
1621 -/******/ // getDefaultExport function for compatibility with non-harmony modules
1622 -/******/ __webpack_require__.n = function(module) {
1623 -/******/ var getter = module && module.__esModule ?
1624 -/******/ function() { return module['default']; } :
1625 -/******/ function() { return module; };
1626 -/******/ __webpack_require__.d(getter, { a: getter });
1627 -/******/ return getter;
1628 -/******/ };
1629 -/******/ }();
1630 -/******/
1631 -/******/ /* webpack/runtime/define property getters */
1632 -/******/ !function() {
1633 -/******/ // define getter functions for harmony exports
1634 -/******/ __webpack_require__.d = function(exports, definition) {
1635 -/******/ for(var key in definition) {
1636 -/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
1637 -/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
1638 -/******/ }
1639 -/******/ }
1640 -/******/ };
1641 -/******/ }();
1642 -/******/
1643 -/******/ /* webpack/runtime/hasOwnProperty shorthand */
1644 -/******/ !function() {
1645 -/******/ __webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
1646 -/******/ }();
1647 -/******/
1648 -/******/ /* webpack/runtime/make namespace object */
1649 -/******/ !function() {
1650 -/******/ // define __esModule on exports
1651 -/******/ __webpack_require__.r = function(exports) {
1652 -/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
1653 -/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
1654 -/******/ }
1655 -/******/ Object.defineProperty(exports, '__esModule', { value: true });
1656 -/******/ };
1657 -/******/ }();
1658 -/******/
1659 -/************************************************************************/
1660 -var __webpack_exports__ = {};
1661 -// This entry needs to be wrapped in an IIFE because it needs to be isolated against other modules in the chunk.
1662 -!function() {
1663 -/*!******************************************************************!*\
1664 - !*** ./packages/packages/core/editor-design-system/src/index.ts ***!
1665 - \******************************************************************/
1666 -__webpack_require__.r(__webpack_exports__);
1667 -/* harmony export */ __webpack_require__.d(__webpack_exports__, {
1668 -/* harmony export */ getInitialDesignSystemTab: function() { return /* reexport safe */ _initial_tab__WEBPACK_IMPORTED_MODULE_1__.getInitialDesignSystemTab; },
1669 -/* harmony export */ init: function() { return /* reexport safe */ _init__WEBPACK_IMPORTED_MODULE_0__.init; },
1670 -/* harmony export */ panel: function() { return /* reexport safe */ _design_system_panel__WEBPACK_IMPORTED_MODULE_2__.panel; },
1671 -/* harmony export */ persistDesignSystemTab: function() { return /* reexport safe */ _initial_tab__WEBPACK_IMPORTED_MODULE_1__.persistDesignSystemTab; },
1672 -/* harmony export */ usePanelActions: function() { return /* reexport safe */ _design_system_panel__WEBPACK_IMPORTED_MODULE_2__.usePanelActions; },
1673 -/* harmony export */ usePanelStatus: function() { return /* reexport safe */ _design_system_panel__WEBPACK_IMPORTED_MODULE_2__.usePanelStatus; }
1674 -/* harmony export */ });
1675 -/* harmony import */ var _init__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./init */ "./packages/packages/core/editor-design-system/src/init.ts");
1676 -/* harmony import */ var _initial_tab__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./initial-tab */ "./packages/packages/core/editor-design-system/src/initial-tab.ts");
1677 -/* harmony import */ var _design_system_panel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./design-system-panel */ "./packages/packages/core/editor-design-system/src/design-system-panel.tsx");
1678 -
1679 -
1680 -
1681 -}();
1682 -(window.elementorV2 = window.elementorV2 || {}).editorDesignSystem = __webpack_exports__;
1683 -/******/ })()
1684 -;
1685 -window.elementorV2.editorDesignSystem?.init?.();
1 +/*! For license information please see editor-design-system.js.LICENSE.txt */
2 +!function(){"use strict";var e={"./packages/packages/core/editor-design-system/src/components/design-system-entrypoints.tsx":function(e,t,n){n.r(t),n.d(t,{DesignSystemEntrypoints:function(){return DesignSystemEntrypoints}});var s=n("react"),r=n("@elementor/editor-v1-adapters"),o=n("./packages/packages/core/editor-design-system/src/design-system-panel.tsx"),i=n("./packages/packages/core/editor-design-system/src/initial-tab.ts");const a="panel/elements/categories",c="elementor/open-variables-manager",l="elementor/open-global-classes-manager",m="elementor/toggle-design-system",d="elementor/design-system/set-tab",p="active-panel",u="design-system",g="global-classes-manager",y="variables-manager";function DesignSystemEntrypoints(){const{open:e,close:t}=(0,o.usePanelActions)(),{isOpen:n}=(0,o.usePanelStatus)(),f=(0,s.useRef)(n);f.current=n,(0,s.useEffect)(()=>{const handler=e=>{const n=e.detail?.tab;"variables"!==n&&"classes"!==n||(f.current&&(0,i.getActiveDesignSystemTab)()===n?t():f.current?window.dispatchEvent(new CustomEvent(d,{detail:{tab:n}})):window.dispatchEvent(new CustomEvent("variables"===n?c:l)))};return window.addEventListener(m,handler),()=>{window.removeEventListener(m,handler)}},[t]);const _=(0,s.useRef)(null),[E,S]=(0,s.useState)(!1);(0,s.useEffect)(()=>{E&&(S(!1),e())},[E,e]),(0,s.useEffect)(()=>(0,r.__privateListenTo)((0,r.routeOpenEvent)(a),()=>{const e=_.current;e&&(_.current=null,(0,i.setPendingDesignSystemTab)(e),S(!0))}),[]),(0,s.useEffect)(()=>{const bind=(e,t)=>{const handler=()=>{_.current=t,(0,r.__privateOpenRoute)(a)};return window.addEventListener(e,handler),()=>window.removeEventListener(e,handler)},e=bind(c,"variables"),t=bind(l,"classes");return()=>{e(),t()}},[]);const b=(0,s.useRef)(!1);return(0,s.useEffect)(()=>{const t=new URLSearchParams(window.location.search),n=t.get(p);if(!n)return;let s=null;if(n===u){const e=t.get("design-system-tab");s="classes"===e?"classes":"variables"}else if(n===g)s="classes";else{if(n!==y)return;s="variables"}return(0,r.__privateListenTo)((0,r.routeOpenEvent)(a),()=>{b.current||(b.current=!0,requestAnimationFrame(()=>{s&&(0,i.setPendingDesignSystemTab)(s),e()}))})},[e]),null}},"./packages/packages/core/editor-design-system/src/components/design-system-header-menu.tsx":function(e,t,n){n.r(t),n.d(t,{DesignSystemHeaderMenu:function(){return DesignSystemHeaderMenu}});var s=n("react"),r=n("@elementor/editor-current-user"),o=n("@elementor/editor-ui"),i=n("@elementor/icons"),a=n("@elementor/query"),c=n("@elementor/ui"),l=n("@wordpress/i18n"),m=n("./packages/packages/core/editor-design-system/src/export/download.ts"),d=n("./packages/packages/core/editor-design-system/src/export/export-notifications.ts"),p=n("./packages/packages/core/editor-design-system/src/export/hooks/use-export-request.ts"),u=n("./packages/packages/core/editor-design-system/src/import/hooks/use-import-request.ts"),g=n("./packages/packages/core/editor-design-system/src/import/import-design-system-dialog.tsx"),y=n("./packages/packages/core/editor-design-system/src/import/tracking.ts");function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var s in n)({}).hasOwnProperty.call(n,s)&&(e[s]=n[s])}return e},_extends.apply(null,arguments)}const DesignSystemHeaderMenu=()=>{const{isAdmin:e}=(0,r.useCurrentUserCapabilities)(),t=(0,c.usePopupState)({variant:"popover",popupId:"design-system-header-menu"}),n=(0,p.useExportRequest)(),f=(0,a.useIsMutating)({mutationKey:[u.IMPORT_DESIGN_SYSTEM_MUTATION_KEY]})>0,_=(0,a.useIsMutating)({mutationKey:[p.EXPORT_DESIGN_SYSTEM_MUTATION_KEY]})>0,E=f||_,S=(0,c.bindTrigger)(t),runExport=async()=>{(0,d.notifyExportInProgress)();try{const{blob:e,fileName:t}=await n.mutateAsync();(0,m.downloadBlob)(e,t),(0,d.notifyExportSuccess)()}catch{(0,d.notifyExportFailure)(runExport)}},b=(0,l.__)("Design system actions","elementor"),w=(0,l.__)("Export is in progress. The file will be downloaded when it's complete.","elementor"),k=(0,l.__)("Import is in progress. You will receive a notification when it's complete.","elementor");let v=b;return E&&(v=_?w:k),s.createElement(s.Fragment,null,e&&s.createElement(c.Tooltip,{title:v,placement:"top"},s.createElement("span",null,s.createElement(c.IconButton,_extends({},S,{size:"small","aria-label":b,disabled:E}),s.createElement(i.DotsVerticalIcon,{fontSize:"small"})))),s.createElement(c.Menu,_extends({},(0,c.bindMenu)(t),{MenuListProps:{dense:!0},PaperProps:{elevation:6},anchorOrigin:{vertical:"bottom",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"}}),s.createElement(c.MenuItem,{onClick:()=>{t.close(),(0,y.trackDesignSystem)({event:"importOpened"}),(0,o.openDialog)({component:s.createElement(g.ImportDesignSystemDialog,{onClose:o.closeDialog})})},disabled:f},s.createElement(c.ListItemIcon,null,s.createElement(i.UploadIcon,{fontSize:"tiny"})),s.createElement(c.ListItemText,null,(0,l.__)("Import","elementor"))),s.createElement(c.MenuItem,{onClick:()=>{t.close(),runExport()},disabled:_},s.createElement(c.ListItemIcon,null,s.createElement(i.DownloadIcon,{fontSize:"tiny"})),s.createElement(c.ListItemText,null,(0,l.__)("Export","elementor")))))}},"./packages/packages/core/editor-design-system/src/components/design-system-panel-content.tsx":function(e,t,n){n.r(t),n.d(t,{DesignSystemPanelContent:function(){return DesignSystemPanelContent}});var s=n("react"),r=n("@elementor/editor-global-classes"),o=n("@elementor/editor-panels"),i=n("@elementor/editor-ui"),a=n("@elementor/editor-variables"),c=n("@elementor/icons"),l=n("@elementor/ui"),m=n("@wordpress/i18n"),d=n("./packages/packages/core/editor-design-system/src/initial-tab.ts"),p=n("./packages/packages/core/editor-design-system/src/components/design-system-header-menu.tsx");function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var s in n)({}).hasOwnProperty.call(n,s)&&(e[s]=n[s])}return e},_extends.apply(null,arguments)}const u={position:"sticky",zIndex:1100,opacity:1,backgroundColor:"background.default",transition:"top 300ms ease"};function DesignSystemPanelContent({onRequestClose:e}){const[t,n]=(0,s.useState)(()=>(0,d.getInitialDesignSystemTab)()),g=(0,s.useRef)(null),y=(0,s.useRef)(null),{getTabProps:f,getTabPanelProps:_,getTabsProps:E}=(0,l.useTabs)(t);(0,s.useEffect)(()=>{(0,d.notifyDesignSystemTabChange)(t)},[t]),(0,s.useEffect)(()=>{const handler=e=>{const t=e.detail?.tab;t&&(n(t),(0,d.persistDesignSystemTab)(t),(0,d.notifyDesignSystemTabChange)(t))};return window.addEventListener("elementor/design-system/set-tab",handler),()=>{window.removeEventListener("elementor/design-system/set-tab",handler)}},[]);return s.createElement(i.ThemeProvider,null,s.createElement(o.Panel,null,s.createElement(o.PanelHeader,null,s.createElement(l.Stack,{p:1,pl:2,width:"100%",direction:"row",alignItems:"center",spacing:.5},s.createElement(o.PanelHeaderTitle,{sx:{flex:1,minWidth:0}},(0,m.__)("Design system","elementor")),s.createElement(p.DesignSystemHeaderMenu,null),s.createElement(l.CloseButton,{"aria-label":(0,m.__)("Close","elementor"),sx:{flexShrink:0},onClick:()=>{"variables"===t&&g.current?g.current():"classes"===t&&y.current?y.current():e()}}))),s.createElement(o.PanelBody,{sx:{display:"flex",flexDirection:"column",height:"100%",overflow:"hidden",minHeight:0}},s.createElement(l.Stack,{direction:"column",sx:{width:"100%",flex:1,minHeight:0,overflow:"hidden"}},s.createElement(l.Stack,{sx:{...u,top:0,flexShrink:0}},s.createElement(l.Tabs,_extends({variant:"fullWidth",size:"small",sx:{mt:.5}},E(),{onChange:(e,t)=>{E().onChange(e,t),n(t),(0,d.persistDesignSystemTab)(t),(0,d.notifyDesignSystemTabChange)(t)}}),s.createElement(l.Tab,_extends({label:(0,m.__)("Variables","elementor"),icon:s.createElement(c.ColorFilterIcon,{fontSize:"small"}),iconPosition:"start"},f("variables"))),s.createElement(l.Tab,_extends({label:(0,m.__)("Classes","elementor"),icon:s.createElement(c.ColorSwatchIcon,{fontSize:"small"}),iconPosition:"start"},f("classes")))),s.createElement(l.Divider,null)),s.createElement(l.Box,_extends({role:"tabpanel"},_(t),{sx:{flex:1,minHeight:0,display:"flex",flexDirection:"column",overflow:"hidden",pt:1}}),"variables"===t&&s.createElement(a.VariablesManagerPanelEmbedded,{onRequestClose:e,onExposeCloseAttempt:e=>{g.current=e}}),"classes"===t&&s.createElement(r.ClassManagerPanelEmbedded,{onRequestClose:e,onExposeCloseAttempt:e=>{y.current=e}}))))))}},"./packages/packages/core/editor-design-system/src/design-system-panel.tsx":function(e,t,n){n.r(t),n.d(t,{panel:function(){return l},usePanelActions:function(){return d},usePanelStatus:function(){return m}});var s=n("react"),r=n("@elementor/editor-documents"),o=n("@elementor/editor-panels"),i=n("@elementor/editor-v1-adapters"),a=n("./packages/packages/core/editor-design-system/src/components/design-system-panel-content.tsx");const c="design-system",{panel:l,usePanelStatus:m,usePanelActions:d}=(0,o.__createPanel)({id:c,component:function DesignSystemPanelRoot(){const{close:e}=d();return s.createElement(a.DesignSystemPanelContent,{onRequestClose:e})},allowedEditModes:["edit",c],onOpen:()=>{(0,i.changeEditMode)(c)},onClose:async()=>{(0,i.changeEditMode)("edit"),await(0,r.reloadCurrentDocument)()},isOpenPreviousElement:!0})},"./packages/packages/core/editor-design-system/src/experiment/init-design-system-experiment.ts":function(e,t,n){n.r(t),n.d(t,{initDesignSystemExperiment:function(){return initDesignSystemExperiment}});var s=n("@elementor/editor"),r=n("@elementor/editor-app-bar"),o=n("@elementor/editor-panels"),i=n("./packages/packages/core/editor-design-system/src/components/design-system-entrypoints.tsx"),a=n("./packages/packages/core/editor-design-system/src/design-system-panel.tsx"),c=n("./packages/packages/core/editor-design-system/src/use-open-design-system-toolbar.ts");function initDesignSystemExperiment(){(0,o.__registerPanel)(a.panel),(0,s.injectIntoLogic)({id:"design-system-entrypoints",component:i.DesignSystemEntrypoints}),r.toolsMenu.registerToggleAction({id:"open-design-system-toolbar",priority:21,useProps:c.useOpenDesignSystemToolbar})}},"./packages/packages/core/editor-design-system/src/export/download.ts":function(e,t,n){n.r(t),n.d(t,{downloadBlob:function(){return downloadBlob}});const downloadBlob=(e,t)=>{const n=URL.createObjectURL(e),s=document.createElement("a");s.href=n,s.download=t,s.rel="noopener",document.body.appendChild(s),s.click(),document.body.removeChild(s),URL.revokeObjectURL(n)}},"./packages/packages/core/editor-design-system/src/export/export-notifications.ts":function(e,t,n){n.r(t),n.d(t,{notifyExportFailure:function(){return notifyExportFailure},notifyExportInProgress:function(){return notifyExportInProgress},notifyExportSuccess:function(){return notifyExportSuccess}});var s=n("@elementor/editor-notifications"),r=n("@wordpress/i18n");const o="design-system-export-started",i="design-system-export-failed",notifyExportInProgress=()=>{(0,s.notify)({id:o,type:"info",message:(0,r.__)("Export in progress. Your file will download when it’s ready.","elementor")})},notifyExportSuccess=()=>{(0,s.dismissNotification)(o),(0,s.notify)({id:"design-system-export-succeeded",type:"success",message:(0,r.__)("Design system exported","elementor")})},notifyExportFailure=e=>{(0,s.dismissNotification)(o),(0,s.notify)({id:i,type:"error",message:(0,r.__)("Your design system export failed","elementor"),additionalActionProps:[{size:"small",variant:"outlined",color:"error",children:(0,r.__)("Try again","elementor"),onClick:()=>{(0,s.dismissNotification)(i),e()}}]})}},"./packages/packages/core/editor-design-system/src/export/hooks/use-export-request.ts":function(e,t,n){n.r(t),n.d(t,{DEFAULT_EXPORT_FILE_NAME:function(){return i},DesignSystemExportError:function(){return DesignSystemExportError},EXPORT_DESIGN_SYSTEM_MUTATION_KEY:function(){return o},useExportRequest:function(){return useExportRequest}});var s=n("@elementor/http-client"),r=n("@elementor/query");const o="design-system-export",i="design-system-export.zip",a={include:["settings"],kitInfo:{title:"design-system",description:"",source:"local"},customization:{settings:{theme:!1,classes:!0,variables:!0}}};class DesignSystemExportError extends Error{constructor(e){super("Design system export failed"),this.name="DesignSystemExportError",this.cause=e}}const useExportRequest=()=>(0,r.useMutation)({mutationKey:[o],mutationFn:async()=>{try{const{data:e}=await(0,s.httpService)().post("elementor/v1/import-export-customization/export",a,{timeout:12e4});return{fileName:i,blob:base64ToZipBlob(e.data.file)}}catch(e){throw new DesignSystemExportError(e)}}}),base64ToZipBlob=e=>{const t=atob(e),n=new Uint8Array(t.length);for(let e=0;e<t.length;e++)n[e]=t.charCodeAt(e);return new Blob([n],{type:"application/zip"})}},"./packages/packages/core/editor-design-system/src/import/components/conflict-options.tsx":function(e,t,n){n.r(t),n.d(t,{ConflictOptions:function(){return ConflictOptions}});var s=n("react"),r=n("@elementor/ui"),o=n("@wordpress/i18n");const ConflictOptions=({value:e,onChange:t})=>{const n=[{value:"replace",title:(0,o.__)("Replace existing values","elementor"),description:(0,o.__)("Imported design system values will overwrite existing variables and classes.","elementor")},{value:"keep",title:(0,o.__)("Keep existing values","elementor"),description:(0,o.__)("Existing variables and classes will not change.","elementor")}];return s.createElement(r.Stack,{spacing:1},s.createElement(r.Typography,{variant:"body1"},(0,o.__)("How to handle conflicts with existing variables or classes?","elementor")),s.createElement(r.RadioGroup,{value:e??"",onChange:(e,n)=>t(n)},s.createElement(r.Stack,{spacing:1},n.map(n=>s.createElement(r.Card,{key:n.value,variant:"outlined"},s.createElement(r.CardActionArea,{onClick:()=>t(n.value)},s.createElement(r.Stack,{direction:"row",alignItems:"center",spacing:2,padding:2},s.createElement(r.Radio,{value:n.value,checked:e===n.value,inputProps:{"aria-label":n.title}}),s.createElement(r.Stack,{direction:"column",spacing:.5},s.createElement(r.Typography,{variant:"subtitle2"},n.title),s.createElement(r.Typography,{variant:"caption",color:"text.secondary"},n.description)))))))))}},"./packages/packages/core/editor-design-system/src/import/hooks/use-dialog-state.ts":function(e,t,n){n.r(t),n.d(t,{useDialogState:function(){return useDialogState}});var s=n("react");const r={file:null,conflictStrategy:null},useDialogState=()=>{const[e,t]=(0,s.useState)(r);return{...e,setFile:e=>t(t=>({...t,file:e})),setConflictStrategy:e=>t(t=>({...t,conflictStrategy:e}))}}},"./packages/packages/core/editor-design-system/src/import/hooks/use-import-request.ts":function(e,t,n){n.r(t),n.d(t,{DesignSystemUploadValidationError:function(){return DesignSystemUploadValidationError},IMPORT_DESIGN_SYSTEM_MUTATION_KEY:function(){return m},useImportRequest:function(){return useImportRequest}});var s=n("@elementor/editor-canvas"),r=n("@elementor/editor-v1-adapters"),o=n("@elementor/http-client"),i=n("@elementor/query");const a="elementor/v1/import-export-customization",c=12e4,l=["global-classes","global-variables"],m="design-system-import",useImportRequest=()=>(0,i.useMutation)({mutationKey:[m],mutationFn:async({file:e,conflictStrategy:t})=>{await(0,r.__privateRunCommand)("document/save/auto",{force:!0});const n=await uploadKit(e),o=await startImport(n,t);await runRunners(n,o),window.dispatchEvent(new CustomEvent(s.GLOBAL_STYLES_IMPORTED_EVENT))}});class DesignSystemUploadValidationError extends Error{constructor(e){super("Design system upload validation failed"),this.name="DesignSystemUploadValidationError",this.cause=e}}const uploadKit=async e=>{const t=new FormData;t.append("e_import_file",e);try{const{data:e}=await(0,o.httpService)().post(`${a}/upload`,t,{headers:{"Content-Type":"multipart/form-data"},timeout:c});return e.data.session}catch(e){throw new DesignSystemUploadValidationError(e)}},startImport=async(e,t)=>{const n={"design-system":{conflict_resolution:"keep"===t?"skip":"replace"}},{data:s}=await(0,o.httpService)().post(`${a}/import`,{session:e,include:["design-system"],customization:n},{timeout:c});return(s.data.runners??[]).filter(e=>l.includes(e))},runRunners=async(e,t)=>{for(const n of t)await(0,o.httpService)().post(`${a}/import-runner`,{session:e,runner:n},{timeout:c})}},"./packages/packages/core/editor-design-system/src/import/import-design-system-dialog.tsx":function(e,t,n){n.r(t),n.d(t,{ImportDesignSystemDialog:function(){return ImportDesignSystemDialog}});var s=n("react"),r=n("@elementor/editor-ui"),o=n("@elementor/icons"),i=n("@elementor/ui"),a=n("@wordpress/i18n"),c=n("./packages/packages/core/editor-design-system/src/import/components/conflict-options.tsx"),l=n("./packages/packages/core/editor-design-system/src/import/hooks/use-dialog-state.ts"),m=n("./packages/packages/core/editor-design-system/src/import/hooks/use-import-request.ts"),d=n("./packages/packages/core/editor-design-system/src/import/import-notifications.tsx"),p=n("./packages/packages/core/editor-design-system/src/import/tracking.ts");const u=["application/zip"],reopenSelf=()=>{(0,p.trackDesignSystem)({event:"importOpened"}),(0,r.openDialog)({component:s.createElement(ImportDesignSystemDialog,{onClose:r.closeDialog})})},ImportDesignSystemDialog=({onClose:e})=>{const{file:t,conflictStrategy:n,setFile:g,setConflictStrategy:y}=(0,l.useDialogState)(),f=(0,m.useImportRequest)(),_=Boolean(t&&n);return s.createElement(s.Fragment,null,s.createElement(i.DialogHeader,{logo:!1},s.createElement(i.DialogTitle,null,(0,a.__)("Import Design System","elementor"))),s.createElement(i.DialogContent,null,s.createElement(i.Stack,{spacing:3},t?s.createElement(r.FileUploadRow,{file:t,onRemove:()=>g(null)}):s.createElement(r.FileUploadDropzone,{onFileSelected:e=>{g(e),(0,p.trackDesignSystem)({event:"fileSelected",file_type:p.FILE_TYPE_DESIGN_SYSTEM})},allowedFileTypes:u,accept:"application/zip,.zip",regionLabel:(0,a.__)("Design system file dropzone","elementor"),helperText:(0,a.sprintf)((0,a.__)("zip (max. %dMB)","elementor"),3)}),s.createElement(c.ConflictOptions,{value:n,onChange:e=>{y(e),(0,p.trackDesignSystem)({event:"conflictChoice",choice:e})}}),s.createElement(i.Stack,{direction:"row",spacing:.5,alignItems:"center",justifyContent:"flex-start"},s.createElement(o.HelpIcon,{sx:{fontSize:16,color:"text.tertiary"}}),s.createElement(i.Link,{href:"https://go.elementor.com/wp-dash-import-export-design-system/",target:"_blank",rel:"noopener noreferrer",underline:"always",variant:"caption",color:"text.tertiary"},(0,a.__)("Learn how design system imports work","elementor"))))),s.createElement(i.DialogActions,null,s.createElement(i.Button,{size:"medium",color:"secondary",onClick:e},(0,a.__)("Cancel","elementor")),s.createElement(i.Button,{size:"medium",variant:"contained",color:"primary",disabled:!_,onClick:async()=>{if(t&&n){(0,p.trackDesignSystem)({event:"confirmed",conflict_choice:n}),(0,d.notifyImportInProgress)(),e();try{await f.mutateAsync({file:t,conflictStrategy:n}),(0,p.trackDesignSystem)({event:"imported"}),(0,d.notifyImportSuccess)()}catch(e){e instanceof m.DesignSystemUploadValidationError?(0,p.trackDesignSystem)({event:"validationFailed",file_type:p.FILE_TYPE_DESIGN_SYSTEM}):(0,p.trackDesignSystem)({event:"importFailed"}),(0,d.notifyImportFailure)(reopenSelf)}}}},(0,a.__)("Import","elementor"))))}},"./packages/packages/core/editor-design-system/src/import/import-notifications.tsx":function(e,t,n){n.r(t),n.d(t,{notifyImportFailure:function(){return notifyImportFailure},notifyImportInProgress:function(){return notifyImportInProgress},notifyImportSuccess:function(){return notifyImportSuccess}});var s=n("@elementor/editor-notifications"),r=n("@elementor/query"),o=n("@wordpress/i18n"),i=n("./packages/packages/core/editor-design-system/src/import/hooks/use-import-request.ts");const a="design-system-import-started",c="design-system-import-failed",notifyImportInProgress=()=>{(0,s.notify)({id:a,type:"info",message:(0,o.__)("Import in Progress. You will be notified when the import is complete.","elementor")})},notifyImportSuccess=()=>{(0,s.dismissNotification)(a),(0,s.notify)({id:"design-system-import-succeeded",type:"success",message:(0,o.__)("Design system imported","elementor")})},notifyImportFailure=e=>{(0,s.dismissNotification)(a),(0,s.notify)({id:c,type:"error",message:(0,o.__)("Your design system import failed","elementor"),additionalActionProps:[{size:"small",variant:"outlined",color:"error",children:(0,o.__)("Try again","elementor"),onClick:()=>{(0,s.dismissNotification)(c);(0,r.getQueryClient)().isMutating({mutationKey:[i.IMPORT_DESIGN_SYSTEM_MUTATION_KEY]})>0||e()}}]})}},"./packages/packages/core/editor-design-system/src/import/tracking.ts":function(e,t,n){n.r(t),n.d(t,{FILE_TYPE_DESIGN_SYSTEM:function(){return r},trackDesignSystem:function(){return trackDesignSystem}});var s=n("@elementor/events");const r="design_system",trackDesignSystem=e=>{const{dispatchEvent:t,config:n}=(0,s.getMixpanel)(),r=n?.names?.design_system?.[e.event];if(!r)return;const{event:o,...i}=e;try{t?.(r,{event:o,...i})}catch{}}},"./packages/packages/core/editor-design-system/src/init.ts":function(e,t,n){n.r(t),n.d(t,{init:function(){return init}});var s=n("@elementor/editor-v1-adapters"),r=n("./packages/packages/core/editor-design-system/src/experiment/init-design-system-experiment.ts");function init(){(0,s.isExperimentActive)("e_editor_design_system_panel")&&(0,r.initDesignSystemExperiment)()}},"./packages/packages/core/editor-design-system/src/initial-tab.ts":function(e,t,n){n.r(t),n.d(t,{getActiveDesignSystemTab:function(){return getActiveDesignSystemTab},getInitialDesignSystemTab:function(){return getInitialDesignSystemTab},notifyDesignSystemTabChange:function(){return notifyDesignSystemTabChange},persistDesignSystemTab:function(){return persistDesignSystemTab},setPendingDesignSystemTab:function(){return setPendingDesignSystemTab}});const s="elementor_editor_design_system_active_tab";function readStoredTab(){if("undefined"==typeof window)return"variables";try{const e=window.localStorage.getItem(s);if("classes"===e||"variables"===e)return e}catch{}return"variables"}let r=null,o=readStoredTab();function setPendingDesignSystemTab(e){r=e}function getInitialDesignSystemTab(){if(r){const e=r;return r=null,o=e,persistDesignSystemTab(e),e}const e=readStoredTab();return o=e,e}function notifyDesignSystemTabChange(e){o=e}function getActiveDesignSystemTab(){return o}function persistDesignSystemTab(e){if("undefined"!=typeof window)try{window.localStorage.setItem(s,e)}catch{}}},"./packages/packages/core/editor-design-system/src/use-open-design-system-toolbar.ts":function(e,t,n){n.r(t),n.d(t,{useOpenDesignSystemToolbar:function(){return useOpenDesignSystemToolbar}});var s=n("react"),r=n("@elementor/icons"),o=n("@wordpress/i18n"),i=n("./packages/packages/core/editor-design-system/src/design-system-panel.tsx");function useOpenDesignSystemToolbar(){const{isOpen:e}=(0,i.usePanelStatus)(),{open:t,close:n}=(0,i.usePanelActions)(),a=(0,s.useCallback)(()=>{e?n():t()},[e,t,n]);return{title:(0,o.__)("Design System","elementor"),icon:r.DropletHalfFilledIcon,onClick:a,selected:e}}},"@elementor/editor":function(e){e.exports=window.elementorV2.editor},"@elementor/editor-app-bar":function(e){e.exports=window.elementorV2.editorAppBar},"@elementor/editor-canvas":function(e){e.exports=window.elementorV2.editorCanvas},"@elementor/editor-current-user":function(e){e.exports=window.elementorV2.editorCurrentUser},"@elementor/editor-documents":function(e){e.exports=window.elementorV2.editorDocuments},"@elementor/editor-global-classes":function(e){e.exports=window.elementorV2.editorGlobalClasses},"@elementor/editor-notifications":function(e){e.exports=window.elementorV2.editorNotifications},"@elementor/editor-panels":function(e){e.exports=window.elementorV2.editorPanels},"@elementor/editor-ui":function(e){e.exports=window.elementorV2.editorUi},"@elementor/editor-v1-adapters":function(e){e.exports=window.elementorV2.editorV1Adapters},"@elementor/editor-variables":function(e){e.exports=window.elementorV2.editorVariables},"@elementor/events":function(e){e.exports=window.elementorV2.events},"@elementor/http-client":function(e){e.exports=window.elementorV2.httpClient},"@elementor/icons":function(e){e.exports=window.elementorV2.icons},"@elementor/query":function(e){e.exports=window.elementorV2.query},"@elementor/ui":function(e){e.exports=window.elementorV2.ui},"@wordpress/i18n":function(e){e.exports=window.wp.i18n},react:function(e){e.exports=window.React}},t={};function __webpack_require__(n){var s=t[n];if(void 0!==s)return s.exports;var r=t[n]={exports:{}};return e[n](r,r.exports,__webpack_require__),r.exports}__webpack_require__.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return __webpack_require__.d(t,{a:t}),t},__webpack_require__.d=function(e,t){for(var n in t)__webpack_require__.o(t,n)&&!__webpack_require__.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},__webpack_require__.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},__webpack_require__.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};!function(){__webpack_require__.r(n),__webpack_require__.d(n,{getInitialDesignSystemTab:function(){return t.getInitialDesignSystemTab},init:function(){return e.init},panel:function(){return s.panel},persistDesignSystemTab:function(){return t.persistDesignSystemTab},usePanelActions:function(){return s.usePanelActions},usePanelStatus:function(){return s.usePanelStatus}});var e=__webpack_require__("./packages/packages/core/editor-design-system/src/init.ts"),t=__webpack_require__("./packages/packages/core/editor-design-system/src/initial-tab.ts"),s=__webpack_require__("./packages/packages/core/editor-design-system/src/design-system-panel.tsx")}(),(window.elementorV2=window.elementorV2||{}).editorDesignSystem=n}(),window.elementorV2.editorDesignSystem?.init?.();
1686 3 //# sourceMappingURL=editor-design-system.js.map