@elementor/editor-global-classes 0.7.1 → 0.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +12 -0
- package/dist/index.js +136 -101
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +155 -120
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -3
- package/src/components/class-manager/class-manager-panel.tsx +19 -2
- package/src/components/class-manager/global-classes-list.tsx +6 -5
- package/src/global-classes-styles-provider.ts +2 -8
- package/src/hooks/use-classes-order.ts +7 -0
- package/src/hooks/use-dirty-state.ts +7 -0
- package/src/hooks/use-ordered-classes.ts +7 -0
- package/src/publish-global-classes.ts +23 -0
- package/src/store.ts +4 -11
- package/src/sync-with-document-save.ts +4 -17
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @elementor/editor-global-classes
|
|
2
2
|
|
|
3
|
+
## 0.8.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 994025a: Added "save changes" button to global classes panel.
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- Updated dependencies [994025a]
|
|
12
|
+
- @elementor/editor-panels@0.12.0
|
|
13
|
+
- @elementor/editor-editing-panel@1.13.1
|
|
14
|
+
|
|
3
15
|
## 0.7.1
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
package/dist/index.js
CHANGED
|
@@ -28,7 +28,7 @@ var import_editor_editing_panel = require("@elementor/editor-editing-panel");
|
|
|
28
28
|
var import_editor_panels2 = require("@elementor/editor-panels");
|
|
29
29
|
var import_editor_styles_repository2 = require("@elementor/editor-styles-repository");
|
|
30
30
|
var import_editor_v1_adapters2 = require("@elementor/editor-v1-adapters");
|
|
31
|
-
var
|
|
31
|
+
var import_store16 = require("@elementor/store");
|
|
32
32
|
|
|
33
33
|
// src/components/class-manager/class-manager-button.tsx
|
|
34
34
|
var React6 = __toESM(require("react"));
|
|
@@ -43,54 +43,13 @@ var import_icons4 = require("@elementor/icons");
|
|
|
43
43
|
var import_ui5 = require("@elementor/ui");
|
|
44
44
|
var import_i18n5 = require("@wordpress/i18n");
|
|
45
45
|
|
|
46
|
-
// src/
|
|
47
|
-
var React = __toESM(require("react"));
|
|
48
|
-
var import_react = require("react");
|
|
49
|
-
var import_editor_current_user = require("@elementor/editor-current-user");
|
|
50
|
-
var import_editor_ui = require("@elementor/editor-ui");
|
|
51
|
-
var import_ui = require("@elementor/ui");
|
|
52
|
-
var import_i18n = require("@wordpress/i18n");
|
|
53
|
-
var MESSAGE_KEY = "global-class-manager-4";
|
|
54
|
-
var ClassManagerIntroduction = () => {
|
|
55
|
-
const [isMessageSuppressed, suppressMessage] = (0, import_editor_current_user.useSuppressedMessage)(MESSAGE_KEY);
|
|
56
|
-
const [shouldShowIntroduction, setShouldShowIntroduction] = (0, import_react.useState)(!isMessageSuppressed);
|
|
57
|
-
return /* @__PURE__ */ React.createElement(
|
|
58
|
-
import_editor_ui.IntroductionModal,
|
|
59
|
-
{
|
|
60
|
-
open: shouldShowIntroduction,
|
|
61
|
-
title: (0, import_i18n.__)("CSS Class manager", "elementor"),
|
|
62
|
-
content: /* @__PURE__ */ React.createElement(IntroductionContent, null),
|
|
63
|
-
handleClose: (shouldShowAgain) => {
|
|
64
|
-
if (!shouldShowAgain) {
|
|
65
|
-
suppressMessage();
|
|
66
|
-
}
|
|
67
|
-
setShouldShowIntroduction(false);
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
);
|
|
71
|
-
};
|
|
72
|
-
var IntroductionContent = () => {
|
|
73
|
-
return /* @__PURE__ */ React.createElement(import_ui.Stack, { gap: 1.5, padding: 3 }, /* @__PURE__ */ React.createElement(import_ui.Image, { sx: { width: "100%", height: "312px" }, src: "", alt: "Introduction" }), /* @__PURE__ */ React.createElement(import_ui.Box, null, /* @__PURE__ */ React.createElement(import_ui.Typography, { variant: "body2" }, (0, import_i18n.__)(
|
|
74
|
-
"The CSS Class Manager allows you to manage and organize your site's CSS classes efficiently. You can reorder classes to adjust their priority, rename them to maintain clarity in your design system, and delete unused classes to keep your CSS structured.",
|
|
75
|
-
"elementor"
|
|
76
|
-
)), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement(import_ui.Typography, { variant: "body2" }, (0, import_i18n.__)(
|
|
77
|
-
"Changes apply globally\u2014any modifications will affect all elements using the class, impacting the class order and priority across your site.",
|
|
78
|
-
"elementor"
|
|
79
|
-
))));
|
|
80
|
-
};
|
|
81
|
-
|
|
82
|
-
// src/components/class-manager/global-classes-list.tsx
|
|
83
|
-
var React4 = __toESM(require("react"));
|
|
84
|
-
var import_editor_styles_repository = require("@elementor/editor-styles-repository");
|
|
85
|
-
var import_editor_ui2 = require("@elementor/editor-ui");
|
|
86
|
-
var import_icons3 = require("@elementor/icons");
|
|
87
|
-
var import_ui4 = require("@elementor/ui");
|
|
88
|
-
var import_i18n4 = require("@wordpress/i18n");
|
|
89
|
-
|
|
90
|
-
// src/global-classes-styles-provider.ts
|
|
91
|
-
var import_editor_styles2 = require("@elementor/editor-styles");
|
|
46
|
+
// src/hooks/use-dirty-state.ts
|
|
92
47
|
var import_store2 = require("@elementor/store");
|
|
93
|
-
|
|
48
|
+
|
|
49
|
+
// src/store.ts
|
|
50
|
+
var import_editor_props = require("@elementor/editor-props");
|
|
51
|
+
var import_editor_styles = require("@elementor/editor-styles");
|
|
52
|
+
var import_store = require("@elementor/store");
|
|
94
53
|
|
|
95
54
|
// src/errors.ts
|
|
96
55
|
var import_utils = require("@elementor/utils");
|
|
@@ -104,9 +63,6 @@ var GlobalClassLabelAlreadyExistsError = (0, import_utils.createError)({
|
|
|
104
63
|
});
|
|
105
64
|
|
|
106
65
|
// src/store.ts
|
|
107
|
-
var import_editor_props = require("@elementor/editor-props");
|
|
108
|
-
var import_editor_styles = require("@elementor/editor-styles");
|
|
109
|
-
var import_store = require("@elementor/store");
|
|
110
66
|
var initialState = {
|
|
111
67
|
items: {},
|
|
112
68
|
order: [],
|
|
@@ -134,6 +90,7 @@ var slice = (0, import_store.__createSlice)({
|
|
|
134
90
|
},
|
|
135
91
|
setOrder(state, { payload }) {
|
|
136
92
|
state.order = payload;
|
|
93
|
+
state.isDirty = true;
|
|
137
94
|
},
|
|
138
95
|
update(state, { payload }) {
|
|
139
96
|
const style = state.items[payload.style.id];
|
|
@@ -166,35 +123,109 @@ var slice = (0, import_store.__createSlice)({
|
|
|
166
123
|
});
|
|
167
124
|
var selectOrder = (state) => state[SLICE_NAME].order;
|
|
168
125
|
var selectGlobalClasses = (state) => state[SLICE_NAME].items;
|
|
169
|
-
var
|
|
126
|
+
var selectOrderedClasses = (0, import_store.__createSelector)(
|
|
170
127
|
selectGlobalClasses,
|
|
171
128
|
selectOrder,
|
|
172
129
|
(items, order) => order.map((id) => items[id])
|
|
173
130
|
);
|
|
174
131
|
var selectClass = (state, id) => state[SLICE_NAME].items[id] ?? null;
|
|
175
132
|
var selectIsDirty = (state) => state.globalClasses.isDirty;
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
133
|
+
|
|
134
|
+
// src/hooks/use-dirty-state.ts
|
|
135
|
+
var useDirtyState = () => {
|
|
136
|
+
return (0, import_store2.__useSelector)(selectIsDirty);
|
|
179
137
|
};
|
|
180
|
-
|
|
138
|
+
|
|
139
|
+
// src/publish-global-classes.ts
|
|
140
|
+
var import_store4 = require("@elementor/store");
|
|
141
|
+
|
|
142
|
+
// src/api.ts
|
|
143
|
+
var import_http = require("@elementor/http");
|
|
144
|
+
var RESOURCE_URL = "/global-classes";
|
|
145
|
+
var apiClient = {
|
|
146
|
+
all: () => (0, import_http.httpService)().get("elementor/v1" + RESOURCE_URL),
|
|
147
|
+
update: (payload) => (0, import_http.httpService)().put("elementor/v1" + RESOURCE_URL, payload)
|
|
148
|
+
};
|
|
149
|
+
|
|
150
|
+
// src/publish-global-classes.ts
|
|
151
|
+
async function publishGlobalClasses() {
|
|
152
|
+
if (!isDirty()) {
|
|
153
|
+
return;
|
|
154
|
+
}
|
|
155
|
+
const state = (0, import_store4.__getState)().globalClasses;
|
|
156
|
+
await apiClient.update({
|
|
157
|
+
items: state.items,
|
|
158
|
+
order: state.order
|
|
159
|
+
});
|
|
160
|
+
(0, import_store4.__dispatch)(slice.actions.setPristine());
|
|
161
|
+
}
|
|
162
|
+
function isDirty() {
|
|
163
|
+
return selectIsDirty((0, import_store4.__getState)());
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
// src/components/class-manager/class-manager-introduction.tsx
|
|
167
|
+
var React = __toESM(require("react"));
|
|
168
|
+
var import_react = require("react");
|
|
169
|
+
var import_editor_current_user = require("@elementor/editor-current-user");
|
|
170
|
+
var import_editor_ui = require("@elementor/editor-ui");
|
|
171
|
+
var import_ui = require("@elementor/ui");
|
|
172
|
+
var import_i18n = require("@wordpress/i18n");
|
|
173
|
+
var MESSAGE_KEY = "global-class-manager-4";
|
|
174
|
+
var ClassManagerIntroduction = () => {
|
|
175
|
+
const [isMessageSuppressed, suppressMessage] = (0, import_editor_current_user.useSuppressedMessage)(MESSAGE_KEY);
|
|
176
|
+
const [shouldShowIntroduction, setShouldShowIntroduction] = (0, import_react.useState)(!isMessageSuppressed);
|
|
177
|
+
return /* @__PURE__ */ React.createElement(
|
|
178
|
+
import_editor_ui.IntroductionModal,
|
|
179
|
+
{
|
|
180
|
+
open: shouldShowIntroduction,
|
|
181
|
+
title: (0, import_i18n.__)("CSS Class manager", "elementor"),
|
|
182
|
+
content: /* @__PURE__ */ React.createElement(IntroductionContent, null),
|
|
183
|
+
handleClose: (shouldShowAgain) => {
|
|
184
|
+
if (!shouldShowAgain) {
|
|
185
|
+
suppressMessage();
|
|
186
|
+
}
|
|
187
|
+
setShouldShowIntroduction(false);
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
);
|
|
191
|
+
};
|
|
192
|
+
var IntroductionContent = () => {
|
|
193
|
+
return /* @__PURE__ */ React.createElement(import_ui.Stack, { gap: 1.5, padding: 3 }, /* @__PURE__ */ React.createElement(import_ui.Image, { sx: { width: "100%", height: "312px" }, src: "", alt: "Introduction" }), /* @__PURE__ */ React.createElement(import_ui.Box, null, /* @__PURE__ */ React.createElement(import_ui.Typography, { variant: "body2" }, (0, import_i18n.__)(
|
|
194
|
+
"The CSS Class Manager allows you to manage and organize your site's CSS classes efficiently. You can reorder classes to adjust their priority, rename them to maintain clarity in your design system, and delete unused classes to keep your CSS structured.",
|
|
195
|
+
"elementor"
|
|
196
|
+
)), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement(import_ui.Typography, { variant: "body2" }, (0, import_i18n.__)(
|
|
197
|
+
"Changes apply globally\u2014any modifications will affect all elements using the class, impacting the class order and priority across your site.",
|
|
198
|
+
"elementor"
|
|
199
|
+
))));
|
|
200
|
+
};
|
|
201
|
+
|
|
202
|
+
// src/components/class-manager/global-classes-list.tsx
|
|
203
|
+
var React4 = __toESM(require("react"));
|
|
204
|
+
var import_editor_styles_repository = require("@elementor/editor-styles-repository");
|
|
205
|
+
var import_editor_ui2 = require("@elementor/editor-ui");
|
|
206
|
+
var import_icons3 = require("@elementor/icons");
|
|
207
|
+
var import_ui4 = require("@elementor/ui");
|
|
208
|
+
var import_i18n4 = require("@wordpress/i18n");
|
|
181
209
|
|
|
182
210
|
// src/global-classes-styles-provider.ts
|
|
211
|
+
var import_editor_styles2 = require("@elementor/editor-styles");
|
|
212
|
+
var import_store6 = require("@elementor/store");
|
|
213
|
+
var import_i18n2 = require("@wordpress/i18n");
|
|
183
214
|
var globalClassesStylesProvider = {
|
|
184
215
|
key: "global-classes",
|
|
185
216
|
priority: 30,
|
|
186
217
|
actions: {
|
|
187
|
-
get: () =>
|
|
188
|
-
getById: (id) => selectClass((0,
|
|
218
|
+
get: () => selectOrderedClasses((0, import_store6.__getState)()),
|
|
219
|
+
getById: (id) => selectClass((0, import_store6.__getState)(), id),
|
|
189
220
|
create: (label) => {
|
|
190
|
-
const classes = selectGlobalClasses((0,
|
|
221
|
+
const classes = selectGlobalClasses((0, import_store6.__getState)());
|
|
191
222
|
const existingLabels = Object.values(classes).map((style) => style.label);
|
|
192
223
|
if (existingLabels.includes(label)) {
|
|
193
224
|
throw new GlobalClassLabelAlreadyExistsError({ context: { label } });
|
|
194
225
|
}
|
|
195
226
|
const existingIds = Object.keys(classes);
|
|
196
227
|
const id = (0, import_editor_styles2.generateId)("g-", existingIds);
|
|
197
|
-
(0,
|
|
228
|
+
(0, import_store6.__dispatch)(
|
|
198
229
|
slice.actions.add({
|
|
199
230
|
id,
|
|
200
231
|
type: "class",
|
|
@@ -205,20 +236,20 @@ var globalClassesStylesProvider = {
|
|
|
205
236
|
return id;
|
|
206
237
|
},
|
|
207
238
|
update: (payload) => {
|
|
208
|
-
(0,
|
|
239
|
+
(0, import_store6.__dispatch)(
|
|
209
240
|
slice.actions.update({
|
|
210
241
|
style: payload
|
|
211
242
|
})
|
|
212
243
|
);
|
|
213
244
|
},
|
|
214
245
|
delete: (id) => {
|
|
215
|
-
(0,
|
|
246
|
+
(0, import_store6.__dispatch)(slice.actions.delete(id));
|
|
216
247
|
},
|
|
217
248
|
setOrder: (order) => {
|
|
218
|
-
(0,
|
|
249
|
+
(0, import_store6.__dispatch)(slice.actions.setOrder(order));
|
|
219
250
|
},
|
|
220
251
|
updateProps: (args) => {
|
|
221
|
-
(0,
|
|
252
|
+
(0, import_store6.__dispatch)(
|
|
222
253
|
slice.actions.updateProps({
|
|
223
254
|
id: args.id,
|
|
224
255
|
meta: args.meta,
|
|
@@ -227,13 +258,25 @@ var globalClassesStylesProvider = {
|
|
|
227
258
|
);
|
|
228
259
|
}
|
|
229
260
|
},
|
|
230
|
-
subscribe: (cb) => (0,
|
|
261
|
+
subscribe: (cb) => (0, import_store6.__subscribeWithSelector)((state) => state.globalClasses, cb),
|
|
231
262
|
labels: {
|
|
232
263
|
singular: (0, import_i18n2.__)("Global class", "elementor"),
|
|
233
264
|
plural: (0, import_i18n2.__)("Global CSS Classes", "elementor")
|
|
234
265
|
}
|
|
235
266
|
};
|
|
236
267
|
|
|
268
|
+
// src/hooks/use-classes-order.ts
|
|
269
|
+
var import_store8 = require("@elementor/store");
|
|
270
|
+
var useClassesOrder = () => {
|
|
271
|
+
return (0, import_store8.__useSelector)(selectOrder);
|
|
272
|
+
};
|
|
273
|
+
|
|
274
|
+
// src/hooks/use-ordered-classes.ts
|
|
275
|
+
var import_store10 = require("@elementor/store");
|
|
276
|
+
var useOrderedClasses = () => {
|
|
277
|
+
return (0, import_store10.__useSelector)(selectOrderedClasses);
|
|
278
|
+
};
|
|
279
|
+
|
|
237
280
|
// src/components/class-manager/delete-confirmation-dialog.tsx
|
|
238
281
|
var React2 = __toESM(require("react"));
|
|
239
282
|
var import_react2 = require("react");
|
|
@@ -330,8 +373,8 @@ var SortableItemIndicator = (0, import_ui3.styled)(import_ui3.Box)`
|
|
|
330
373
|
|
|
331
374
|
// src/components/class-manager/global-classes-list.tsx
|
|
332
375
|
var GlobalClassesList = () => {
|
|
333
|
-
const cssClasses =
|
|
334
|
-
const [classesOrder, reorderClasses] =
|
|
376
|
+
const cssClasses = useOrderedClasses();
|
|
377
|
+
const [classesOrder, reorderClasses] = useReorder();
|
|
335
378
|
if (!cssClasses?.length) {
|
|
336
379
|
return /* @__PURE__ */ React4.createElement(EmptyState, null);
|
|
337
380
|
}
|
|
@@ -351,8 +394,8 @@ var GlobalClassesList = () => {
|
|
|
351
394
|
));
|
|
352
395
|
}))));
|
|
353
396
|
};
|
|
354
|
-
var
|
|
355
|
-
const order =
|
|
397
|
+
var useReorder = () => {
|
|
398
|
+
const order = useClassesOrder();
|
|
356
399
|
const reorder = (newIds) => {
|
|
357
400
|
globalClassesStylesProvider.actions.setOrder(newIds);
|
|
358
401
|
};
|
|
@@ -518,7 +561,19 @@ var { panel, usePanelActions } = (0, import_editor_panels.__createPanel)({
|
|
|
518
561
|
component: ClassManagerPanel
|
|
519
562
|
});
|
|
520
563
|
function ClassManagerPanel() {
|
|
521
|
-
|
|
564
|
+
const isDirty3 = useDirtyState();
|
|
565
|
+
return /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(import_ui5.ErrorBoundary, { fallback: /* @__PURE__ */ React5.createElement(ErrorBoundaryFallback, null) }, /* @__PURE__ */ React5.createElement(import_editor_panels.Panel, null, /* @__PURE__ */ React5.createElement(import_editor_panels.PanelHeader, null, /* @__PURE__ */ React5.createElement(import_ui5.Stack, { p: 1, pl: 2, width: "100%", direction: "row", alignItems: "center" }, /* @__PURE__ */ React5.createElement(import_editor_panels.PanelHeaderTitle, { sx: { display: "flex", alignItems: "center", gap: 0.5 } }, /* @__PURE__ */ React5.createElement(import_icons4.ColorSwatchIcon, { fontSize: "inherit", sx: { transform: "rotate(90deg)" } }), (0, import_i18n5.__)("CSS Class manager", "elementor")), /* @__PURE__ */ React5.createElement(CloseButton, { sx: { marginLeft: "auto" } }))), /* @__PURE__ */ React5.createElement(import_editor_panels.PanelBody, { px: 2 }, /* @__PURE__ */ React5.createElement(GlobalClassesList, null)), /* @__PURE__ */ React5.createElement(import_editor_panels.PanelFooter, null, /* @__PURE__ */ React5.createElement(
|
|
566
|
+
import_ui5.Button,
|
|
567
|
+
{
|
|
568
|
+
fullWidth: true,
|
|
569
|
+
size: "small",
|
|
570
|
+
variant: "contained",
|
|
571
|
+
color: "global",
|
|
572
|
+
disabled: !isDirty3,
|
|
573
|
+
onClick: publishGlobalClasses
|
|
574
|
+
},
|
|
575
|
+
(0, import_i18n5.__)("Save changes", "elementor")
|
|
576
|
+
)))), /* @__PURE__ */ React5.createElement(ClassManagerIntroduction, null));
|
|
522
577
|
}
|
|
523
578
|
var CloseButton = (props) => {
|
|
524
579
|
const { close } = usePanelActions();
|
|
@@ -534,64 +589,44 @@ var ClassManagerButton = () => {
|
|
|
534
589
|
|
|
535
590
|
// src/components/populate-store.tsx
|
|
536
591
|
var import_react3 = require("react");
|
|
537
|
-
var
|
|
538
|
-
|
|
539
|
-
// src/api.ts
|
|
540
|
-
var import_http = require("@elementor/http");
|
|
541
|
-
var RESOURCE_URL = "/global-classes";
|
|
542
|
-
var apiClient = {
|
|
543
|
-
all: () => (0, import_http.httpService)().get("elementor/v1" + RESOURCE_URL),
|
|
544
|
-
update: (payload) => (0, import_http.httpService)().put("elementor/v1" + RESOURCE_URL, payload)
|
|
545
|
-
};
|
|
546
|
-
|
|
547
|
-
// src/components/populate-store.tsx
|
|
592
|
+
var import_store12 = require("@elementor/store");
|
|
548
593
|
function PopulateStore() {
|
|
549
|
-
const
|
|
594
|
+
const dispatch3 = (0, import_store12.__useDispatch)();
|
|
550
595
|
(0, import_react3.useEffect)(() => {
|
|
551
596
|
apiClient.all().then((res) => {
|
|
552
597
|
const { data, meta } = res.data;
|
|
553
|
-
|
|
598
|
+
dispatch3(slice.actions.init({ items: data, order: meta.order }));
|
|
554
599
|
});
|
|
555
|
-
}, [
|
|
600
|
+
}, [dispatch3]);
|
|
556
601
|
return null;
|
|
557
602
|
}
|
|
558
603
|
|
|
559
604
|
// src/sync-with-document-save.ts
|
|
560
605
|
var import_editor_v1_adapters = require("@elementor/editor-v1-adapters");
|
|
561
|
-
var
|
|
606
|
+
var import_store14 = require("@elementor/store");
|
|
562
607
|
function syncWithDocumentSave() {
|
|
563
608
|
const unsubscribe = syncDirtyState();
|
|
564
609
|
bindSaveAction();
|
|
565
610
|
return unsubscribe;
|
|
566
611
|
}
|
|
567
612
|
function syncDirtyState() {
|
|
568
|
-
return (0,
|
|
569
|
-
if (!
|
|
613
|
+
return (0, import_store14.__subscribeWithSelector)(selectIsDirty, () => {
|
|
614
|
+
if (!isDirty2()) {
|
|
570
615
|
return;
|
|
571
616
|
}
|
|
572
617
|
(0, import_editor_v1_adapters.__privateRunCommandSync)("document/save/set-is-modified", { status: true }, { internal: true });
|
|
573
618
|
});
|
|
574
619
|
}
|
|
575
620
|
function bindSaveAction() {
|
|
576
|
-
(0, import_editor_v1_adapters.registerDataHook)("after", "document/save/save",
|
|
577
|
-
if (!isDirty()) {
|
|
578
|
-
return;
|
|
579
|
-
}
|
|
580
|
-
const state = (0, import_store7.__getState)().globalClasses;
|
|
581
|
-
await apiClient.update({
|
|
582
|
-
items: state.items,
|
|
583
|
-
order: state.order
|
|
584
|
-
});
|
|
585
|
-
(0, import_store7.__dispatch)(slice.actions.setPristine());
|
|
586
|
-
});
|
|
621
|
+
(0, import_editor_v1_adapters.registerDataHook)("after", "document/save/save", publishGlobalClasses);
|
|
587
622
|
}
|
|
588
|
-
function
|
|
589
|
-
return selectIsDirty((0,
|
|
623
|
+
function isDirty2() {
|
|
624
|
+
return selectIsDirty((0, import_store14.__getState)());
|
|
590
625
|
}
|
|
591
626
|
|
|
592
627
|
// src/init.ts
|
|
593
628
|
function init() {
|
|
594
|
-
(0,
|
|
629
|
+
(0, import_store16.__registerSlice)(slice);
|
|
595
630
|
(0, import_editor_panels2.__registerPanel)(panel);
|
|
596
631
|
import_editor_styles_repository2.stylesRepository.register(globalClassesStylesProvider);
|
|
597
632
|
(0, import_editor.injectIntoLogic)({
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/init.ts","../src/components/class-manager/class-manager-button.tsx","../src/components/class-manager/class-manager-panel.tsx","../src/components/class-manager/class-manager-introduction.tsx","../src/components/class-manager/global-classes-list.tsx","../src/global-classes-styles-provider.ts","../src/errors.ts","../src/store.ts","../src/components/class-manager/delete-confirmation-dialog.tsx","../src/components/class-manager/sortable.tsx","../src/components/populate-store.tsx","../src/api.ts","../src/sync-with-document-save.ts","../src/index.ts"],"sourcesContent":["import { injectIntoLogic } from '@elementor/editor';\nimport { injectIntoClassSelectorActions } from '@elementor/editor-editing-panel';\nimport { __registerPanel as registerPanel } from '@elementor/editor-panels';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\nimport { __registerSlice as registerSlice } from '@elementor/store';\n\nimport { ClassManagerButton } from './components/class-manager/class-manager-button';\nimport { panel } from './components/class-manager/class-manager-panel';\nimport { PopulateStore } from './components/populate-store';\nimport { globalClassesStylesProvider } from './global-classes-styles-provider';\nimport { slice } from './store';\nimport { syncWithDocumentSave } from './sync-with-document-save';\n\nexport function init() {\n\tregisterSlice( slice );\n\tregisterPanel( panel );\n\n\tstylesRepository.register( globalClassesStylesProvider );\n\n\tinjectIntoLogic( {\n\t\tid: 'global-classes-populate-store',\n\t\tcomponent: PopulateStore,\n\t} );\n\n\tinjectIntoClassSelectorActions( {\n\t\tid: 'global-classes-manager-button',\n\t\tcomponent: ClassManagerButton,\n\t} );\n\n\tlistenTo( v1ReadyEvent(), () => {\n\t\tsyncWithDocumentSave();\n\t} );\n}\n","import * as React from 'react';\nimport { ColorSwatchIcon } from '@elementor/icons';\nimport { IconButton, Tooltip } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { usePanelActions } from './class-manager-panel';\n\nexport const ClassManagerButton = () => {\n\tconst { open } = usePanelActions();\n\n\treturn (\n\t\t<Tooltip title={ __( 'Class manager', 'elementor' ) } placement=\"top\">\n\t\t\t<IconButton onClick={ open }>\n\t\t\t\t<ColorSwatchIcon fontSize=\"tiny\" />\n\t\t\t</IconButton>\n\t\t</Tooltip>\n\t);\n};\n","import * as React from 'react';\nimport {\n\t__createPanel as createPanel,\n\tPanel,\n\tPanelBody,\n\tPanelHeader,\n\tPanelHeaderTitle,\n} from '@elementor/editor-panels';\nimport { ColorSwatchIcon, XIcon } from '@elementor/icons';\nimport { Alert, Box, ErrorBoundary, IconButton, type IconButtonProps, Stack } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { ClassManagerIntroduction } from './class-manager-introduction';\nimport { GlobalClassesList } from './global-classes-list';\n\nexport const { panel, usePanelActions } = createPanel( {\n\tid: 'class-manager-panel',\n\tcomponent: ClassManagerPanel,\n} );\n\nfunction ClassManagerPanel() {\n\treturn (\n\t\t<>\n\t\t\t<ErrorBoundary fallback={ <ErrorBoundaryFallback /> }>\n\t\t\t\t<Panel>\n\t\t\t\t\t<PanelHeader>\n\t\t\t\t\t\t<Stack p={ 1 } pl={ 2 } width=\"100%\" direction=\"row\" alignItems=\"center\">\n\t\t\t\t\t\t\t<PanelHeaderTitle sx={ { display: 'flex', alignItems: 'center', gap: 0.5 } }>\n\t\t\t\t\t\t\t\t<ColorSwatchIcon fontSize=\"inherit\" sx={ { transform: 'rotate(90deg)' } } />\n\t\t\t\t\t\t\t\t{ __( 'CSS Class manager', 'elementor' ) }\n\t\t\t\t\t\t\t</PanelHeaderTitle>\n\t\t\t\t\t\t\t<CloseButton sx={ { marginLeft: 'auto' } } />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</PanelHeader>\n\t\t\t\t\t<PanelBody px={ 2 }>\n\t\t\t\t\t\t<GlobalClassesList />\n\t\t\t\t\t</PanelBody>\n\t\t\t\t</Panel>\n\t\t\t</ErrorBoundary>\n\t\t\t<ClassManagerIntroduction />\n\t\t</>\n\t);\n}\n\nconst CloseButton = ( props: IconButtonProps ) => {\n\tconst { close } = usePanelActions();\n\n\treturn (\n\t\t<IconButton size=\"small\" color=\"secondary\" onClick={ close } { ...props }>\n\t\t\t<XIcon fontSize=\"small\" />\n\t\t</IconButton>\n\t);\n};\n\nconst ErrorBoundaryFallback = () => (\n\t<Box role=\"alert\" sx={ { minHeight: '100%', p: 2 } }>\n\t\t<Alert severity=\"error\" sx={ { mb: 2, maxWidth: 400, textAlign: 'center' } }>\n\t\t\t<strong>{ __( 'Something went wrong', 'elementor' ) }</strong>\n\t\t</Alert>\n\t</Box>\n);\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { useSuppressedMessage } from '@elementor/editor-current-user';\nimport { IntroductionModal } from '@elementor/editor-ui';\nimport { Box, Image, Stack, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nconst MESSAGE_KEY = 'global-class-manager-4';\n\nexport const ClassManagerIntroduction = () => {\n\tconst [ isMessageSuppressed, suppressMessage ] = useSuppressedMessage( MESSAGE_KEY );\n\tconst [ shouldShowIntroduction, setShouldShowIntroduction ] = useState( ! isMessageSuppressed );\n\n\treturn (\n\t\t<IntroductionModal\n\t\t\topen={ shouldShowIntroduction }\n\t\t\ttitle={ __( 'CSS Class manager', 'elementor' ) }\n\t\t\tcontent={ <IntroductionContent /> }\n\t\t\thandleClose={ ( shouldShowAgain ) => {\n\t\t\t\tif ( ! shouldShowAgain ) {\n\t\t\t\t\tsuppressMessage();\n\t\t\t\t}\n\n\t\t\t\tsetShouldShowIntroduction( false );\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst IntroductionContent = () => {\n\treturn (\n\t\t<Stack gap={ 1.5 } padding={ 3 }>\n\t\t\t<Image sx={ { width: '100%', height: '312px' } } src=\"\" alt=\"Introduction\" />\n\t\t\t<Box>\n\t\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t\"The CSS Class Manager allows you to manage and organize your site's CSS classes efficiently. You can reorder classes to adjust their priority, rename them to maintain clarity in your design system, and delete unused classes to keep your CSS structured.\",\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</Typography>\n\t\t\t\t<br />\n\t\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Changes apply globally—any modifications will affect all elements using the class, impacting the class order and priority across your site.',\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</Typography>\n\t\t\t</Box>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { type StyleDefinitionID } from '@elementor/editor-styles';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { EditableField, EllipsisWithTooltip, useEditable } from '@elementor/editor-ui';\nimport { DotsVerticalIcon, PhotoIcon } from '@elementor/icons';\nimport {\n\tbindMenu,\n\tbindTrigger,\n\tBox,\n\tIconButton,\n\tList,\n\tListItem,\n\tListItemButton,\n\tListItemText,\n\tMenu,\n\tMenuItem,\n\tStack,\n\tstyled,\n\ttype Theme,\n\tTooltip,\n\tTypography,\n\ttype TypographyProps,\n\tusePopupState,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\nimport { useGlobalClassesOrder, useOrderedGlobalClasses } from '../../store';\nimport { DeleteConfirmationProvider, useDeleteConfirmation } from './delete-confirmation-dialog';\nimport { SortableItem, SortableItemIndicator, SortableProvider } from './sortable';\n\nexport const GlobalClassesList = () => {\n\tconst cssClasses = useOrderedGlobalClasses();\n\n\tconst [ classesOrder, reorderClasses ] = useClassesOrder();\n\n\tif ( ! cssClasses?.length ) {\n\t\treturn <EmptyState />;\n\t}\n\n\treturn (\n\t\t<DeleteConfirmationProvider>\n\t\t\t<List sx={ { display: 'flex', flexDirection: 'column', gap: 0.5 } }>\n\t\t\t\t<SortableProvider value={ classesOrder } onChange={ reorderClasses }>\n\t\t\t\t\t{ cssClasses?.map( ( { id, label } ) => {\n\t\t\t\t\t\tconst renameClass = ( newLabel: string ) => {\n\t\t\t\t\t\t\tglobalClassesStylesProvider.actions.update( { label: newLabel, id } );\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<SortableItem key={ id } id={ id }>\n\t\t\t\t\t\t\t\t{ ( { isDragged, showDropIndication, dropIndicationStyle } ) => (\n\t\t\t\t\t\t\t\t\t<ClassItem\n\t\t\t\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\t\t\t\trenameClass={ renameClass }\n\t\t\t\t\t\t\t\t\t\tselected={ isDragged }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ showDropIndication && (\n\t\t\t\t\t\t\t\t\t\t\t<SortableItemIndicator style={ dropIndicationStyle } />\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</ClassItem>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</SortableItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</SortableProvider>\n\t\t\t</List>\n\t\t</DeleteConfirmationProvider>\n\t);\n};\n\nconst useClassesOrder = () => {\n\tconst order = useGlobalClassesOrder();\n\n\tconst reorder = ( newIds: StyleDefinitionID[] ) => {\n\t\tglobalClassesStylesProvider.actions.setOrder( newIds );\n\t};\n\n\treturn [ order, reorder ] as const;\n};\n\nconst ClassItem = ( {\n\tid,\n\tlabel,\n\trenameClass,\n\tselected,\n\tchildren,\n}: React.PropsWithChildren< {\n\tid: string;\n\tlabel: string;\n\trenameClass: ( newLabel: string ) => void;\n\tselected: boolean;\n} > ) => {\n\tconst {\n\t\tref: editableRef,\n\t\topenEditMode,\n\t\tisEditing,\n\t\terror,\n\t\tgetProps: getEditableProps,\n\t} = useEditable( {\n\t\tvalue: label,\n\t\tonSubmit: renameClass,\n\t\tvalidation: validateLabel,\n\t} );\n\n\tconst { openDialog } = useDeleteConfirmation();\n\n\tconst popupState = usePopupState( {\n\t\tvariant: 'popover',\n\t\tdisableAutoFocus: true,\n\t} );\n\n\treturn (\n\t\t<Stack direction=\"row\" alignItems=\"center\" gap={ 1 } flexGrow={ 1 } flexShrink={ 0 }>\n\t\t\t<StyledListItem\n\t\t\t\tcomponent={ 'div' }\n\t\t\t\tdisablePadding\n\t\t\t\tdisableGutters\n\t\t\t\tsecondaryAction={\n\t\t\t\t\t<Tooltip\n\t\t\t\t\t\tplacement=\"top\"\n\t\t\t\t\t\tclassName=\"class-item-more-actions\"\n\t\t\t\t\t\ttitle={ __( 'More actions', 'elementor' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<IconButton size=\"tiny\" { ...bindTrigger( popupState ) } aria-label=\"More actions\">\n\t\t\t\t\t\t\t<DotsVerticalIcon fontSize=\"tiny\" />\n\t\t\t\t\t\t</IconButton>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<ListItemButton\n\t\t\t\t\tdense\n\t\t\t\t\tdisableGutters\n\t\t\t\t\tshape=\"rounded\"\n\t\t\t\t\tonDoubleClick={ openEditMode }\n\t\t\t\t\tselected={ selected || popupState.isOpen }\n\t\t\t\t\tfocusVisibleClassName=\"visible-class-item\"\n\t\t\t\t\tsx={ {\n\t\t\t\t\t\tminHeight: '36px',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t'&.visible-class-item': {\n\t\t\t\t\t\t\tboxShadow: 'none !important',\n\t\t\t\t\t\t},\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<Indicator isActive={ isEditing } isError={ !! error }>\n\t\t\t\t\t\t{ isEditing ? (\n\t\t\t\t\t\t\t<EditableField\n\t\t\t\t\t\t\t\tref={ editableRef }\n\t\t\t\t\t\t\t\terror={ error }\n\t\t\t\t\t\t\t\tas={ Typography }\n\t\t\t\t\t\t\t\tvariant=\"caption\"\n\t\t\t\t\t\t\t\t{ ...getEditableProps() }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EllipsisWithTooltip title={ label } as={ Typography } variant=\"caption\" />\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Indicator>\n\t\t\t\t</ListItemButton>\n\t\t\t\t{ children }\n\t\t\t\t<Menu\n\t\t\t\t\t{ ...bindMenu( popupState ) }\n\t\t\t\t\tanchorOrigin={ {\n\t\t\t\t\t\tvertical: 'bottom',\n\t\t\t\t\t\thorizontal: 'right',\n\t\t\t\t\t} }\n\t\t\t\t\ttransformOrigin={ {\n\t\t\t\t\t\tvertical: 'top',\n\t\t\t\t\t\thorizontal: 'right',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tsx={ { minWidth: '160px' } }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\t\topenEditMode();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<ListItemText primary={ __( 'Rename', 'elementor' ) } />\n\t\t\t\t\t</MenuItem>\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\t\topenDialog( { id, label } );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<ListItemText primary={ __( 'Delete', 'elementor' ) } sx={ { color: 'error.light' } } />\n\t\t\t\t\t</MenuItem>\n\t\t\t\t</Menu>\n\t\t\t</StyledListItem>\n\t\t</Stack>\n\t);\n};\n\nconst StyledListItem = styled( ListItem )`\n\t.class-item-more-actions {\n\t\tvisibility: hidden;\n\t}\n\t&:hover {\n\t\t.class-item-more-actions {\n\t\t\tvisibility: visible;\n\t\t}\n\t}\n`;\n\nconst EmptyState = () => (\n\t<Stack alignItems=\"center\" gap={ 3 } pt={ 4 } px={ 0.5 }>\n\t\t<PhotoIcon fontSize=\"large\" />\n\t\t<StyledHeader variant=\"subtitle2\" component=\"h2\" color=\"text.secondary\">\n\t\t\t{ __( 'No CSS classes created yet', 'elementor' ) }\n\t\t</StyledHeader>\n\t\t<Typography align=\"center\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ __(\n\t\t\t\t'CSS classes created in the editor panel will appear here. Once they are available, you can arrange their hierarchy, rename them, or delete them as needed.',\n\t\t\t\t'elementor'\n\t\t\t) }\n\t\t</Typography>\n\t</Stack>\n);\n\n// Override panel reset styles.\nconst StyledHeader = styled( Typography )< TypographyProps >( ( { theme, variant } ) => ( {\n\t'&.MuiTypography-root': {\n\t\t...( theme.typography[ variant as keyof typeof theme.typography ] as React.CSSProperties ),\n\t},\n} ) );\n\nconst Indicator = styled( Box, {\n\tshouldForwardProp: ( prop: string ) => ! [ 'isActive', 'isError' ].includes( prop ),\n} )< { isActive: boolean; isError: boolean } >( ( { theme, isActive, isError } ) => ( {\n\tdisplay: 'flex',\n\twidth: '100%',\n\tflexGrow: 1,\n\tborderRadius: theme.spacing( 0.5 ),\n\tborder: getIndicatorBorder( { isActive, isError, theme } ),\n\tpadding: `0 ${ theme.spacing( 1 ) }`,\n\tmarginLeft: isActive ? theme.spacing( 1 ) : 0,\n} ) );\n\nconst getIndicatorBorder = ( { isActive, isError, theme }: { isActive: boolean; isError: boolean; theme: Theme } ) => {\n\tif ( isError ) {\n\t\treturn `2px solid ${ theme.palette.error.main }`;\n\t}\n\n\tif ( isActive ) {\n\t\treturn `2px solid ${ theme.palette.secondary.main }`;\n\t}\n\n\treturn 'none';\n};\n\nconst validateLabel = ( newLabel: string ) => {\n\tif ( ! stylesRepository.isLabelValid( newLabel ) ) {\n\t\treturn __( 'Format is not valid', 'elementor' );\n\t}\n\n\tif ( stylesRepository.isLabelExist( newLabel ) ) {\n\t\treturn __( 'Existing name', 'elementor' );\n\t}\n\n\treturn null;\n};\n","import { generateId } from '@elementor/editor-styles';\nimport type { StylesProvider } from '@elementor/editor-styles-repository';\nimport {\n\t__dispatch as dispatch,\n\t__getState as getState,\n\t__subscribeWithSelector as subscribeWithSelector,\n} from '@elementor/store';\nimport { __ } from '@wordpress/i18n';\n\nimport { GlobalClassLabelAlreadyExistsError } from './errors';\nimport {\n\tselectClass,\n\tselectGlobalClasses,\n\tselectOrderedGlobalClasses,\n\tslice,\n\ttype StateWithGlobalClasses,\n} from './store';\n\nexport const globalClassesStylesProvider = {\n\tkey: 'global-classes',\n\tpriority: 30,\n\tactions: {\n\t\tget: () => selectOrderedGlobalClasses( getState() ),\n\t\tgetById: ( id ) => selectClass( getState(), id ),\n\t\tcreate: ( label ) => {\n\t\t\tconst classes = selectGlobalClasses( getState() );\n\n\t\t\tconst existingLabels = Object.values( classes ).map( ( style ) => style.label );\n\n\t\t\tif ( existingLabels.includes( label ) ) {\n\t\t\t\tthrow new GlobalClassLabelAlreadyExistsError( { context: { label } } );\n\t\t\t}\n\n\t\t\tconst existingIds = Object.keys( classes );\n\t\t\tconst id = generateId( 'g-', existingIds );\n\n\t\t\tdispatch(\n\t\t\t\tslice.actions.add( {\n\t\t\t\t\tid,\n\t\t\t\t\ttype: 'class',\n\t\t\t\t\tlabel,\n\t\t\t\t\tvariants: [],\n\t\t\t\t} )\n\t\t\t);\n\n\t\t\treturn id;\n\t\t},\n\t\tupdate: ( payload ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.update( {\n\t\t\t\t\tstyle: payload,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\tdelete: ( id ) => {\n\t\t\tdispatch( slice.actions.delete( id ) );\n\t\t},\n\t\tsetOrder: ( order ) => {\n\t\t\tdispatch( slice.actions.setOrder( order ) );\n\t\t},\n\t\tupdateProps: ( args ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.updateProps( {\n\t\t\t\t\tid: args.id,\n\t\t\t\t\tmeta: args.meta,\n\t\t\t\t\tprops: args.props,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t},\n\tsubscribe: ( cb ) => subscribeWithSelector( ( state: StateWithGlobalClasses ) => state.globalClasses, cb ),\n\tlabels: {\n\t\tsingular: __( 'Global class', 'elementor' ),\n\t\tplural: __( 'Global CSS Classes', 'elementor' ),\n\t},\n} satisfies StylesProvider;\n","import { createError } from '@elementor/utils';\n\nexport const GlobalClassNotFoundError = createError< { styleId: string } >( {\n\tcode: 'global_class_not_found',\n\tmessage: 'Global class not found.',\n} );\n\nexport const GlobalClassLabelAlreadyExistsError = createError< { label: string } >( {\n\tcode: 'global_class_label_already_exists',\n\tmessage: 'Class with this name already exists.',\n} );\n","import { mergeProps, type Props } from '@elementor/editor-props';\nimport {\n\tgetVariantByMeta,\n\ttype StyleDefinition,\n\ttype StyleDefinitionID,\n\ttype StyleDefinitionVariant,\n} from '@elementor/editor-styles';\nimport { type UpdateActionPayload } from '@elementor/editor-styles-repository';\nimport {\n\t__createSelector as createSelector,\n\t__createSlice as createSlice,\n\t__useSelector as useSelector,\n\ttype PayloadAction,\n\ttype SliceState,\n} from '@elementor/store';\n\nimport { GlobalClassNotFoundError } from './errors';\n\nexport type GlobalClassesState = {\n\titems: Record< StyleDefinitionID, StyleDefinition >;\n\torder: StyleDefinitionID[];\n\tisDirty: boolean;\n};\n\nconst initialState: GlobalClassesState = {\n\titems: {},\n\torder: [],\n\tisDirty: false,\n};\n\nexport type StateWithGlobalClasses = SliceState< typeof slice >;\n\n// Slice\nconst SLICE_NAME = 'globalClasses';\n\nexport const slice = createSlice( {\n\tname: SLICE_NAME,\n\tinitialState,\n\treducers: {\n\t\tinit( state, { payload }: PayloadAction< Pick< GlobalClassesState, 'items' | 'order' > > ) {\n\t\t\tstate.items = payload.items;\n\t\t\tstate.order = payload.order;\n\n\t\t\tstate.isDirty = false;\n\t\t},\n\t\tadd( state, { payload }: PayloadAction< StyleDefinition > ) {\n\t\t\tstate.items[ payload.id ] = payload;\n\t\t\tstate.order.unshift( payload.id );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tdelete( state, { payload }: PayloadAction< StyleDefinitionID > ) {\n\t\t\tstate.items = Object.fromEntries( Object.entries( state.items ).filter( ( [ id ] ) => id !== payload ) );\n\n\t\t\tstate.order = state.order.filter( ( id ) => id !== payload );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tsetOrder( state, { payload }: PayloadAction< StyleDefinitionID[] > ) {\n\t\t\tstate.order = payload;\n\t\t},\n\t\tupdate( state, { payload }: PayloadAction< { style: UpdateActionPayload } > ) {\n\t\t\tconst style = state.items[ payload.style.id ];\n\n\t\t\tconst mergedData = {\n\t\t\t\t...style,\n\t\t\t\t...payload.style,\n\t\t\t};\n\n\t\t\tstate.items[ payload.style.id ] = mergedData;\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tupdateProps(\n\t\t\tstate,\n\t\t\t{\n\t\t\t\tpayload,\n\t\t\t}: PayloadAction< { id: StyleDefinitionID; meta: StyleDefinitionVariant[ 'meta' ]; props: Props } >\n\t\t) {\n\t\t\tconst style = state.items[ payload.id ];\n\n\t\t\tif ( ! style ) {\n\t\t\t\tthrow new GlobalClassNotFoundError( { context: { styleId: payload.id } } );\n\t\t\t}\n\n\t\t\tconst variant = getVariantByMeta( style, payload.meta );\n\n\t\t\tif ( variant ) {\n\t\t\t\tvariant.props = mergeProps( variant.props, payload.props );\n\t\t\t} else {\n\t\t\t\tstyle.variants.push( { meta: payload.meta, props: payload.props } );\n\t\t\t}\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\n\t\tsetPristine( state ) {\n\t\t\tstate.isDirty = false;\n\t\t},\n\t},\n} );\n\n// Selectors\nconst selectOrder = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].order;\n\nexport const selectGlobalClasses = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].items;\n\nexport const selectOrderedGlobalClasses = createSelector( selectGlobalClasses, selectOrder, ( items, order ) =>\n\torder.map( ( id ) => items[ id ] )\n);\n\nexport const selectClass = ( state: SliceState< typeof slice >, id: StyleDefinitionID ) =>\n\tstate[ SLICE_NAME ].items[ id ] ?? null;\n\nexport const selectIsDirty = ( state: SliceState< typeof slice > ) => state.globalClasses.isDirty;\n\nexport const useOrderedGlobalClasses = () => {\n\tconst items = useSelector( selectOrderedGlobalClasses );\n\n\treturn items;\n};\n\nexport const useGlobalClassesOrder = () => useSelector( selectOrder );\n","import * as React from 'react';\nimport { createContext, useContext, useState } from 'react';\nimport { type StyleDefinition } from '@elementor/editor-styles';\nimport { AlertOctagonFilledIcon } from '@elementor/icons';\nimport {\n\tButton,\n\tDialog,\n\tDialogActions,\n\tDialogContent,\n\tDialogContentText,\n\tDialogTitle,\n\tTypography,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\n\ntype DeleteConfirmationDialogProps = Pick< StyleDefinition, 'id' | 'label' >;\n\ntype DeleteConfirmationContext = {\n\topenDialog: ( props: DeleteConfirmationDialogProps ) => void;\n\tcloseDialog: () => void;\n\tdialogProps: DeleteConfirmationDialogProps | null;\n};\n\nconst context = createContext< DeleteConfirmationContext | null >( null );\n\nexport const DeleteConfirmationProvider = ( { children }: React.PropsWithChildren ) => {\n\tconst [ dialogProps, setDialogProps ] = useState< DeleteConfirmationDialogProps | null >( null );\n\n\tconst openDialog = ( props: DeleteConfirmationDialogProps ) => {\n\t\tsetDialogProps( props );\n\t};\n\n\tconst closeDialog = () => {\n\t\tsetDialogProps( null );\n\t};\n\n\treturn (\n\t\t<context.Provider value={ { openDialog, closeDialog, dialogProps } }>\n\t\t\t{ children }\n\t\t\t{ !! dialogProps && <DeleteConfirmationDialog { ...dialogProps } /> }\n\t\t</context.Provider>\n\t);\n};\n\nconst TITLE_ID = 'delete-class-dialog';\n\nconst DeleteConfirmationDialog = ( { label, id }: DeleteConfirmationDialogProps ) => {\n\tconst { closeDialog } = useDeleteConfirmation();\n\n\tconst onConfirm = () => {\n\t\tglobalClassesStylesProvider.actions.delete( id );\n\n\t\tcloseDialog();\n\t};\n\n\treturn (\n\t\t<Dialog open onClose={ closeDialog } aria-labelledby={ TITLE_ID } maxWidth=\"xs\">\n\t\t\t<DialogTitle id={ TITLE_ID } display=\"flex\" alignItems=\"center\" gap={ 1 } sx={ { lineHeight: 1 } }>\n\t\t\t\t<AlertOctagonFilledIcon color=\"error\" />\n\t\t\t\t{ __( 'Delete global class', 'elementor' ) }\n\t\t\t</DialogTitle>\n\t\t\t<DialogContent>\n\t\t\t\t<DialogContentText variant=\"body2\" color=\"textPrimary\">\n\t\t\t\t\t{ __( 'Deleting', 'elementor' ) }\n\t\t\t\t\t<Typography variant=\"subtitle2\" component=\"span\">\n\t\t\t\t\t\t { label } \n\t\t\t\t\t</Typography>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'will permanently remove it from your project and may affect the design across all elements using it. This action cannot be undone.',\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</DialogContentText>\n\t\t\t</DialogContent>\n\t\t\t<DialogActions>\n\t\t\t\t<Button color=\"secondary\" onClick={ closeDialog }>\n\t\t\t\t\t{ __( 'Cancel', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t\t<Button variant=\"contained\" color=\"error\" onClick={ onConfirm }>\n\t\t\t\t\t{ __( 'Delete', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t</DialogActions>\n\t\t</Dialog>\n\t);\n};\n\nexport const useDeleteConfirmation = () => {\n\tconst contextValue = useContext( context );\n\n\tif ( ! contextValue ) {\n\t\tthrow new Error( 'useDeleteConfirmation must be used within a DeleteConfirmationProvider' );\n\t}\n\n\treturn contextValue;\n};\n","import * as React from 'react';\nimport { GripVerticalIcon } from '@elementor/icons';\nimport {\n\tBox,\n\tPaper,\n\tstyled,\n\tUnstableSortableItem,\n\ttype UnstableSortableItemProps,\n\ttype UnstableSortableItemRenderProps,\n\tUnstableSortableProvider,\n\ttype UnstableSortableProviderProps,\n} from '@elementor/ui';\n\nexport const SortableProvider = < T extends string >( props: UnstableSortableProviderProps< T > ) => (\n\t<UnstableSortableProvider restrictAxis variant=\"static\" dragPlaceholderStyle={ { opacity: '1' } } { ...props } />\n);\n\nconst SortableTrigger = ( props: React.HTMLAttributes< HTMLDivElement > ) => (\n\t<div { ...props } role=\"button\" className=\"class-item-sortable-trigger\">\n\t\t<GripVerticalIcon fontSize=\"tiny\" />\n\t</div>\n);\n\ntype ItemRenderProps = Record< string, unknown > & {\n\tisDragged: boolean;\n\tshowDropIndication: boolean;\n\tdropIndicationStyle: React.CSSProperties;\n};\n\ntype SortableItemProps = {\n\tid: UnstableSortableItemProps[ 'id' ];\n\tchildren: ( props: ItemRenderProps ) => React.ReactNode;\n};\n\nexport const SortableItem = ( { children, id }: SortableItemProps ) => {\n\treturn (\n\t\t<UnstableSortableItem\n\t\t\tid={ id }\n\t\t\trender={ ( {\n\t\t\t\titemProps,\n\t\t\t\tisDragged,\n\t\t\t\ttriggerProps,\n\t\t\t\titemStyle,\n\t\t\t\ttriggerStyle,\n\t\t\t\tdropIndicationStyle,\n\t\t\t\tshowDropIndication,\n\t\t\t}: UnstableSortableItemRenderProps ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<StyledSortableItem { ...itemProps } elevation={ 0 } sx={ itemStyle } role=\"listitem\">\n\t\t\t\t\t\t<SortableTrigger { ...triggerProps } style={ triggerStyle } />\n\t\t\t\t\t\t{ children( {\n\t\t\t\t\t\t\titemProps,\n\t\t\t\t\t\t\tisDragged,\n\t\t\t\t\t\t\ttriggerProps,\n\t\t\t\t\t\t\titemStyle,\n\t\t\t\t\t\t\ttriggerStyle,\n\t\t\t\t\t\t\tdropIndicationStyle,\n\t\t\t\t\t\t\tshowDropIndication,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</StyledSortableItem>\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst StyledSortableItem = styled( Paper )`\n\tposition: relative;\n\n\t&:hover {\n\t\t& .class-item-sortable-trigger {\n\t\t\tvisibility: visible;\n\t\t}\n\t}\n\n\t& .class-item-sortable-trigger {\n\t\tvisibility: hidden;\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 50%;\n\t\ttransform: translate( -75%, -50% );\n\t}\n`;\n\nexport const SortableItemIndicator = styled( Box )`\n\twidth: 100%;\n\theight: 3px;\n\tborder-radius: ${ ( { theme } ) => theme.spacing( 0.5 ) };\n\tbackground-color: ${ ( { theme } ) => theme.palette.text.primary };\n`;\n","import { useEffect } from 'react';\nimport { __useDispatch as useDispatch } from '@elementor/store';\n\nimport { apiClient } from '../api';\nimport { slice } from '../store';\n\nexport function PopulateStore() {\n\tconst dispatch = useDispatch();\n\n\tuseEffect( () => {\n\t\tapiClient.all().then( ( res ) => {\n\t\t\tconst { data, meta } = res.data;\n\n\t\t\tdispatch( slice.actions.init( { items: data, order: meta.order } ) );\n\t\t} );\n\t}, [ dispatch ] );\n\n\treturn null;\n}\n","import { type StyleDefinition, type StyleDefinitionsMap } from '@elementor/editor-styles';\nimport { type HttpResponse, httpService } from '@elementor/http';\n\nimport { type GlobalClassesState } from './store';\n\nconst RESOURCE_URL = '/global-classes';\n\nexport type GlobalClassesGetAllResponse = HttpResponse< StyleDefinitionsMap, { order: StyleDefinition[ 'id' ][] } >;\n\ntype UpdatePayload = Pick< GlobalClassesState, 'items' | 'order' >;\n\nexport const apiClient = {\n\tall: () => httpService().get< GlobalClassesGetAllResponse >( 'elementor/v1' + RESOURCE_URL ),\n\tupdate: ( payload: UpdatePayload ) => httpService().put( 'elementor/v1' + RESOURCE_URL, payload ),\n};\n","import { __privateRunCommandSync as runCommandSync, registerDataHook } from '@elementor/editor-v1-adapters';\nimport { __dispatch, __getState as getState, __subscribeWithSelector as subscribeWithSelector } from '@elementor/store';\n\nimport { apiClient } from './api';\nimport { type GlobalClassesState, selectIsDirty, slice } from './store';\n\nexport function syncWithDocumentSave() {\n\tconst unsubscribe = syncDirtyState();\n\n\tbindSaveAction();\n\n\treturn unsubscribe;\n}\n\nfunction syncDirtyState() {\n\treturn subscribeWithSelector( selectIsDirty, () => {\n\t\tif ( ! isDirty() ) {\n\t\t\treturn;\n\t\t}\n\n\t\trunCommandSync( 'document/save/set-is-modified', { status: true }, { internal: true } );\n\t} );\n}\n\nfunction bindSaveAction() {\n\tregisterDataHook( 'after', 'document/save/save', async () => {\n\t\tif ( ! isDirty() ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst state: GlobalClassesState = getState().globalClasses;\n\n\t\tawait apiClient.update( {\n\t\t\titems: state.items,\n\t\t\torder: state.order,\n\t\t} );\n\n\t\t__dispatch( slice.actions.setPristine() );\n\t} );\n}\n\nfunction isDirty() {\n\treturn selectIsDirty( getState() );\n}\n","import { init } from './init';\n\ninit();\n"],"mappings":"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","names":["import_editor_panels","import_editor_styles_repository","import_editor_v1_adapters","import_store","React","import_icons","import_ui","import_i18n","React","import_icons","import_ui","import_i18n","React","import_editor_ui","import_icons","import_ui","import_i18n","import_editor_styles","import_store","import_i18n","createSlice","createSelector","useSelector","getState","dispatch","subscribeWithSelector","React","import_react","import_ui","import_i18n","React","import_icons","import_ui","createPanel","import_react","import_store","dispatch","useDispatch","import_store","subscribeWithSelector","runCommandSync","getState","registerSlice","registerPanel","listenTo"]}
|
|
1
|
+
{"version":3,"sources":["../src/init.ts","../src/components/class-manager/class-manager-button.tsx","../src/components/class-manager/class-manager-panel.tsx","../src/hooks/use-dirty-state.ts","../src/store.ts","../src/errors.ts","../src/publish-global-classes.ts","../src/api.ts","../src/components/class-manager/class-manager-introduction.tsx","../src/components/class-manager/global-classes-list.tsx","../src/global-classes-styles-provider.ts","../src/hooks/use-classes-order.ts","../src/hooks/use-ordered-classes.ts","../src/components/class-manager/delete-confirmation-dialog.tsx","../src/components/class-manager/sortable.tsx","../src/components/populate-store.tsx","../src/sync-with-document-save.ts","../src/index.ts"],"sourcesContent":["import { injectIntoLogic } from '@elementor/editor';\nimport { injectIntoClassSelectorActions } from '@elementor/editor-editing-panel';\nimport { __registerPanel as registerPanel } from '@elementor/editor-panels';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\nimport { __registerSlice as registerSlice } from '@elementor/store';\n\nimport { ClassManagerButton } from './components/class-manager/class-manager-button';\nimport { panel } from './components/class-manager/class-manager-panel';\nimport { PopulateStore } from './components/populate-store';\nimport { globalClassesStylesProvider } from './global-classes-styles-provider';\nimport { slice } from './store';\nimport { syncWithDocumentSave } from './sync-with-document-save';\n\nexport function init() {\n\tregisterSlice( slice );\n\tregisterPanel( panel );\n\n\tstylesRepository.register( globalClassesStylesProvider );\n\n\tinjectIntoLogic( {\n\t\tid: 'global-classes-populate-store',\n\t\tcomponent: PopulateStore,\n\t} );\n\n\tinjectIntoClassSelectorActions( {\n\t\tid: 'global-classes-manager-button',\n\t\tcomponent: ClassManagerButton,\n\t} );\n\n\tlistenTo( v1ReadyEvent(), () => {\n\t\tsyncWithDocumentSave();\n\t} );\n}\n","import * as React from 'react';\nimport { ColorSwatchIcon } from '@elementor/icons';\nimport { IconButton, Tooltip } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { usePanelActions } from './class-manager-panel';\n\nexport const ClassManagerButton = () => {\n\tconst { open } = usePanelActions();\n\n\treturn (\n\t\t<Tooltip title={ __( 'Class manager', 'elementor' ) } placement=\"top\">\n\t\t\t<IconButton onClick={ open }>\n\t\t\t\t<ColorSwatchIcon fontSize=\"tiny\" />\n\t\t\t</IconButton>\n\t\t</Tooltip>\n\t);\n};\n","import * as React from 'react';\nimport {\n\t__createPanel as createPanel,\n\tPanel,\n\tPanelBody,\n\tPanelFooter,\n\tPanelHeader,\n\tPanelHeaderTitle,\n} from '@elementor/editor-panels';\nimport { ColorSwatchIcon, XIcon } from '@elementor/icons';\nimport { Alert, Box, Button, ErrorBoundary, IconButton, type IconButtonProps, Stack } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { useDirtyState } from '../../hooks/use-dirty-state';\nimport { publishGlobalClasses } from '../../publish-global-classes';\nimport { ClassManagerIntroduction } from './class-manager-introduction';\nimport { GlobalClassesList } from './global-classes-list';\n\nexport const { panel, usePanelActions } = createPanel( {\n\tid: 'class-manager-panel',\n\tcomponent: ClassManagerPanel,\n} );\n\nexport function ClassManagerPanel() {\n\tconst isDirty = useDirtyState();\n\n\treturn (\n\t\t<>\n\t\t\t<ErrorBoundary fallback={ <ErrorBoundaryFallback /> }>\n\t\t\t\t<Panel>\n\t\t\t\t\t<PanelHeader>\n\t\t\t\t\t\t<Stack p={ 1 } pl={ 2 } width=\"100%\" direction=\"row\" alignItems=\"center\">\n\t\t\t\t\t\t\t<PanelHeaderTitle sx={ { display: 'flex', alignItems: 'center', gap: 0.5 } }>\n\t\t\t\t\t\t\t\t<ColorSwatchIcon fontSize=\"inherit\" sx={ { transform: 'rotate(90deg)' } } />\n\t\t\t\t\t\t\t\t{ __( 'CSS Class manager', 'elementor' ) }\n\t\t\t\t\t\t\t</PanelHeaderTitle>\n\t\t\t\t\t\t\t<CloseButton sx={ { marginLeft: 'auto' } } />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</PanelHeader>\n\t\t\t\t\t<PanelBody px={ 2 }>\n\t\t\t\t\t\t<GlobalClassesList />\n\t\t\t\t\t</PanelBody>\n\t\t\t\t\t<PanelFooter>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tfullWidth\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tvariant=\"contained\"\n\t\t\t\t\t\t\tcolor=\"global\"\n\t\t\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t\t\t\tonClick={ publishGlobalClasses }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Save changes', 'elementor' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</PanelFooter>\n\t\t\t\t</Panel>\n\t\t\t</ErrorBoundary>\n\t\t\t<ClassManagerIntroduction />\n\t\t</>\n\t);\n}\n\nconst CloseButton = ( props: IconButtonProps ) => {\n\tconst { close } = usePanelActions();\n\n\treturn (\n\t\t<IconButton size=\"small\" color=\"secondary\" onClick={ close } { ...props }>\n\t\t\t<XIcon fontSize=\"small\" />\n\t\t</IconButton>\n\t);\n};\n\nconst ErrorBoundaryFallback = () => (\n\t<Box role=\"alert\" sx={ { minHeight: '100%', p: 2 } }>\n\t\t<Alert severity=\"error\" sx={ { mb: 2, maxWidth: 400, textAlign: 'center' } }>\n\t\t\t<strong>{ __( 'Something went wrong', 'elementor' ) }</strong>\n\t\t</Alert>\n\t</Box>\n);\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectIsDirty } from '../store';\n\nexport const useDirtyState = () => {\n\treturn useSelector( selectIsDirty );\n};\n","import { mergeProps, type Props } from '@elementor/editor-props';\nimport {\n\tgetVariantByMeta,\n\ttype StyleDefinition,\n\ttype StyleDefinitionID,\n\ttype StyleDefinitionVariant,\n} from '@elementor/editor-styles';\nimport { type UpdateActionPayload } from '@elementor/editor-styles-repository';\nimport {\n\t__createSelector as createSelector,\n\t__createSlice as createSlice,\n\ttype PayloadAction,\n\ttype SliceState,\n} from '@elementor/store';\n\nimport { GlobalClassNotFoundError } from './errors';\n\nexport type GlobalClassesState = {\n\titems: Record< StyleDefinitionID, StyleDefinition >;\n\torder: StyleDefinitionID[];\n\tisDirty: boolean;\n};\n\nconst initialState: GlobalClassesState = {\n\titems: {},\n\torder: [],\n\tisDirty: false,\n};\n\nexport type StateWithGlobalClasses = SliceState< typeof slice >;\n\n// Slice\nconst SLICE_NAME = 'globalClasses';\n\nexport const slice = createSlice( {\n\tname: SLICE_NAME,\n\tinitialState,\n\treducers: {\n\t\tinit( state, { payload }: PayloadAction< Pick< GlobalClassesState, 'items' | 'order' > > ) {\n\t\t\tstate.items = payload.items;\n\t\t\tstate.order = payload.order;\n\n\t\t\tstate.isDirty = false;\n\t\t},\n\t\tadd( state, { payload }: PayloadAction< StyleDefinition > ) {\n\t\t\tstate.items[ payload.id ] = payload;\n\t\t\tstate.order.unshift( payload.id );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tdelete( state, { payload }: PayloadAction< StyleDefinitionID > ) {\n\t\t\tstate.items = Object.fromEntries( Object.entries( state.items ).filter( ( [ id ] ) => id !== payload ) );\n\n\t\t\tstate.order = state.order.filter( ( id ) => id !== payload );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tsetOrder( state, { payload }: PayloadAction< StyleDefinitionID[] > ) {\n\t\t\tstate.order = payload;\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tupdate( state, { payload }: PayloadAction< { style: UpdateActionPayload } > ) {\n\t\t\tconst style = state.items[ payload.style.id ];\n\n\t\t\tconst mergedData = {\n\t\t\t\t...style,\n\t\t\t\t...payload.style,\n\t\t\t};\n\n\t\t\tstate.items[ payload.style.id ] = mergedData;\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tupdateProps(\n\t\t\tstate,\n\t\t\t{\n\t\t\t\tpayload,\n\t\t\t}: PayloadAction< { id: StyleDefinitionID; meta: StyleDefinitionVariant[ 'meta' ]; props: Props } >\n\t\t) {\n\t\t\tconst style = state.items[ payload.id ];\n\n\t\t\tif ( ! style ) {\n\t\t\t\tthrow new GlobalClassNotFoundError( { context: { styleId: payload.id } } );\n\t\t\t}\n\n\t\t\tconst variant = getVariantByMeta( style, payload.meta );\n\n\t\t\tif ( variant ) {\n\t\t\t\tvariant.props = mergeProps( variant.props, payload.props );\n\t\t\t} else {\n\t\t\t\tstyle.variants.push( { meta: payload.meta, props: payload.props } );\n\t\t\t}\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\n\t\tsetPristine( state ) {\n\t\t\tstate.isDirty = false;\n\t\t},\n\t},\n} );\n\n// Selectors\nexport const selectOrder = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].order;\n\nexport const selectGlobalClasses = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].items;\n\nexport const selectOrderedClasses = createSelector( selectGlobalClasses, selectOrder, ( items, order ) =>\n\torder.map( ( id ) => items[ id ] )\n);\n\nexport const selectClass = ( state: SliceState< typeof slice >, id: StyleDefinitionID ) =>\n\tstate[ SLICE_NAME ].items[ id ] ?? null;\n\nexport const selectIsDirty = ( state: SliceState< typeof slice > ) => state.globalClasses.isDirty;\n","import { createError } from '@elementor/utils';\n\nexport const GlobalClassNotFoundError = createError< { styleId: string } >( {\n\tcode: 'global_class_not_found',\n\tmessage: 'Global class not found.',\n} );\n\nexport const GlobalClassLabelAlreadyExistsError = createError< { label: string } >( {\n\tcode: 'global_class_label_already_exists',\n\tmessage: 'Class with this name already exists.',\n} );\n","import { __dispatch as dispatch, __getState as getState } from '@elementor/store';\n\nimport { apiClient } from './api';\nimport { type GlobalClassesState, selectIsDirty, slice } from './store';\n\nexport async function publishGlobalClasses() {\n\tif ( ! isDirty() ) {\n\t\treturn;\n\t}\n\n\tconst state: GlobalClassesState = getState().globalClasses;\n\n\tawait apiClient.update( {\n\t\titems: state.items,\n\t\torder: state.order,\n\t} );\n\n\tdispatch( slice.actions.setPristine() );\n}\n\nfunction isDirty() {\n\treturn selectIsDirty( getState() );\n}\n","import { type StyleDefinition, type StyleDefinitionsMap } from '@elementor/editor-styles';\nimport { type HttpResponse, httpService } from '@elementor/http';\n\nimport { type GlobalClassesState } from './store';\n\nconst RESOURCE_URL = '/global-classes';\n\nexport type GlobalClassesGetAllResponse = HttpResponse< StyleDefinitionsMap, { order: StyleDefinition[ 'id' ][] } >;\n\ntype UpdatePayload = Pick< GlobalClassesState, 'items' | 'order' >;\n\nexport const apiClient = {\n\tall: () => httpService().get< GlobalClassesGetAllResponse >( 'elementor/v1' + RESOURCE_URL ),\n\tupdate: ( payload: UpdatePayload ) => httpService().put( 'elementor/v1' + RESOURCE_URL, payload ),\n};\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { useSuppressedMessage } from '@elementor/editor-current-user';\nimport { IntroductionModal } from '@elementor/editor-ui';\nimport { Box, Image, Stack, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nconst MESSAGE_KEY = 'global-class-manager-4';\n\nexport const ClassManagerIntroduction = () => {\n\tconst [ isMessageSuppressed, suppressMessage ] = useSuppressedMessage( MESSAGE_KEY );\n\tconst [ shouldShowIntroduction, setShouldShowIntroduction ] = useState( ! isMessageSuppressed );\n\n\treturn (\n\t\t<IntroductionModal\n\t\t\topen={ shouldShowIntroduction }\n\t\t\ttitle={ __( 'CSS Class manager', 'elementor' ) }\n\t\t\tcontent={ <IntroductionContent /> }\n\t\t\thandleClose={ ( shouldShowAgain ) => {\n\t\t\t\tif ( ! shouldShowAgain ) {\n\t\t\t\t\tsuppressMessage();\n\t\t\t\t}\n\n\t\t\t\tsetShouldShowIntroduction( false );\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst IntroductionContent = () => {\n\treturn (\n\t\t<Stack gap={ 1.5 } padding={ 3 }>\n\t\t\t<Image sx={ { width: '100%', height: '312px' } } src=\"\" alt=\"Introduction\" />\n\t\t\t<Box>\n\t\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t\"The CSS Class Manager allows you to manage and organize your site's CSS classes efficiently. You can reorder classes to adjust their priority, rename them to maintain clarity in your design system, and delete unused classes to keep your CSS structured.\",\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</Typography>\n\t\t\t\t<br />\n\t\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Changes apply globally—any modifications will affect all elements using the class, impacting the class order and priority across your site.',\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</Typography>\n\t\t\t</Box>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { type StyleDefinitionID } from '@elementor/editor-styles';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { EditableField, EllipsisWithTooltip, useEditable } from '@elementor/editor-ui';\nimport { DotsVerticalIcon, PhotoIcon } from '@elementor/icons';\nimport {\n\tbindMenu,\n\tbindTrigger,\n\tBox,\n\tIconButton,\n\tList,\n\tListItem,\n\tListItemButton,\n\tListItemText,\n\tMenu,\n\tMenuItem,\n\tStack,\n\tstyled,\n\ttype Theme,\n\tTooltip,\n\tTypography,\n\ttype TypographyProps,\n\tusePopupState,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\nimport { useClassesOrder } from '../../hooks/use-classes-order';\nimport { useOrderedClasses } from '../../hooks/use-ordered-classes';\nimport { DeleteConfirmationProvider, useDeleteConfirmation } from './delete-confirmation-dialog';\nimport { SortableItem, SortableItemIndicator, SortableProvider } from './sortable';\n\nexport const GlobalClassesList = () => {\n\tconst cssClasses = useOrderedClasses();\n\n\tconst [ classesOrder, reorderClasses ] = useReorder();\n\n\tif ( ! cssClasses?.length ) {\n\t\treturn <EmptyState />;\n\t}\n\n\treturn (\n\t\t<DeleteConfirmationProvider>\n\t\t\t<List sx={ { display: 'flex', flexDirection: 'column', gap: 0.5 } }>\n\t\t\t\t<SortableProvider value={ classesOrder } onChange={ reorderClasses }>\n\t\t\t\t\t{ cssClasses?.map( ( { id, label } ) => {\n\t\t\t\t\t\tconst renameClass = ( newLabel: string ) => {\n\t\t\t\t\t\t\tglobalClassesStylesProvider.actions.update( { label: newLabel, id } );\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<SortableItem key={ id } id={ id }>\n\t\t\t\t\t\t\t\t{ ( { isDragged, showDropIndication, dropIndicationStyle } ) => (\n\t\t\t\t\t\t\t\t\t<ClassItem\n\t\t\t\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\t\t\t\trenameClass={ renameClass }\n\t\t\t\t\t\t\t\t\t\tselected={ isDragged }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ showDropIndication && (\n\t\t\t\t\t\t\t\t\t\t\t<SortableItemIndicator style={ dropIndicationStyle } />\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</ClassItem>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</SortableItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</SortableProvider>\n\t\t\t</List>\n\t\t</DeleteConfirmationProvider>\n\t);\n};\n\nconst useReorder = () => {\n\tconst order = useClassesOrder();\n\n\tconst reorder = ( newIds: StyleDefinitionID[] ) => {\n\t\tglobalClassesStylesProvider.actions.setOrder( newIds );\n\t};\n\n\treturn [ order, reorder ] as const;\n};\n\nconst ClassItem = ( {\n\tid,\n\tlabel,\n\trenameClass,\n\tselected,\n\tchildren,\n}: React.PropsWithChildren< {\n\tid: string;\n\tlabel: string;\n\trenameClass: ( newLabel: string ) => void;\n\tselected: boolean;\n} > ) => {\n\tconst {\n\t\tref: editableRef,\n\t\topenEditMode,\n\t\tisEditing,\n\t\terror,\n\t\tgetProps: getEditableProps,\n\t} = useEditable( {\n\t\tvalue: label,\n\t\tonSubmit: renameClass,\n\t\tvalidation: validateLabel,\n\t} );\n\n\tconst { openDialog } = useDeleteConfirmation();\n\n\tconst popupState = usePopupState( {\n\t\tvariant: 'popover',\n\t\tdisableAutoFocus: true,\n\t} );\n\n\treturn (\n\t\t<Stack direction=\"row\" alignItems=\"center\" gap={ 1 } flexGrow={ 1 } flexShrink={ 0 }>\n\t\t\t<StyledListItem\n\t\t\t\tcomponent={ 'div' }\n\t\t\t\tdisablePadding\n\t\t\t\tdisableGutters\n\t\t\t\tsecondaryAction={\n\t\t\t\t\t<Tooltip\n\t\t\t\t\t\tplacement=\"top\"\n\t\t\t\t\t\tclassName=\"class-item-more-actions\"\n\t\t\t\t\t\ttitle={ __( 'More actions', 'elementor' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<IconButton size=\"tiny\" { ...bindTrigger( popupState ) } aria-label=\"More actions\">\n\t\t\t\t\t\t\t<DotsVerticalIcon fontSize=\"tiny\" />\n\t\t\t\t\t\t</IconButton>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<ListItemButton\n\t\t\t\t\tdense\n\t\t\t\t\tdisableGutters\n\t\t\t\t\tshape=\"rounded\"\n\t\t\t\t\tonDoubleClick={ openEditMode }\n\t\t\t\t\tselected={ selected || popupState.isOpen }\n\t\t\t\t\tfocusVisibleClassName=\"visible-class-item\"\n\t\t\t\t\tsx={ {\n\t\t\t\t\t\tminHeight: '36px',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t'&.visible-class-item': {\n\t\t\t\t\t\t\tboxShadow: 'none !important',\n\t\t\t\t\t\t},\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<Indicator isActive={ isEditing } isError={ !! error }>\n\t\t\t\t\t\t{ isEditing ? (\n\t\t\t\t\t\t\t<EditableField\n\t\t\t\t\t\t\t\tref={ editableRef }\n\t\t\t\t\t\t\t\terror={ error }\n\t\t\t\t\t\t\t\tas={ Typography }\n\t\t\t\t\t\t\t\tvariant=\"caption\"\n\t\t\t\t\t\t\t\t{ ...getEditableProps() }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EllipsisWithTooltip title={ label } as={ Typography } variant=\"caption\" />\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Indicator>\n\t\t\t\t</ListItemButton>\n\t\t\t\t{ children }\n\t\t\t\t<Menu\n\t\t\t\t\t{ ...bindMenu( popupState ) }\n\t\t\t\t\tanchorOrigin={ {\n\t\t\t\t\t\tvertical: 'bottom',\n\t\t\t\t\t\thorizontal: 'right',\n\t\t\t\t\t} }\n\t\t\t\t\ttransformOrigin={ {\n\t\t\t\t\t\tvertical: 'top',\n\t\t\t\t\t\thorizontal: 'right',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tsx={ { minWidth: '160px' } }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\t\topenEditMode();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<ListItemText primary={ __( 'Rename', 'elementor' ) } />\n\t\t\t\t\t</MenuItem>\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\t\topenDialog( { id, label } );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<ListItemText primary={ __( 'Delete', 'elementor' ) } sx={ { color: 'error.light' } } />\n\t\t\t\t\t</MenuItem>\n\t\t\t\t</Menu>\n\t\t\t</StyledListItem>\n\t\t</Stack>\n\t);\n};\n\nconst StyledListItem = styled( ListItem )`\n\t.class-item-more-actions {\n\t\tvisibility: hidden;\n\t}\n\t&:hover {\n\t\t.class-item-more-actions {\n\t\t\tvisibility: visible;\n\t\t}\n\t}\n`;\n\nconst EmptyState = () => (\n\t<Stack alignItems=\"center\" gap={ 3 } pt={ 4 } px={ 0.5 }>\n\t\t<PhotoIcon fontSize=\"large\" />\n\t\t<StyledHeader variant=\"subtitle2\" component=\"h2\" color=\"text.secondary\">\n\t\t\t{ __( 'No CSS classes created yet', 'elementor' ) }\n\t\t</StyledHeader>\n\t\t<Typography align=\"center\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ __(\n\t\t\t\t'CSS classes created in the editor panel will appear here. Once they are available, you can arrange their hierarchy, rename them, or delete them as needed.',\n\t\t\t\t'elementor'\n\t\t\t) }\n\t\t</Typography>\n\t</Stack>\n);\n\n// Override panel reset styles.\nconst StyledHeader = styled( Typography )< TypographyProps >( ( { theme, variant } ) => ( {\n\t'&.MuiTypography-root': {\n\t\t...( theme.typography[ variant as keyof typeof theme.typography ] as React.CSSProperties ),\n\t},\n} ) );\n\nconst Indicator = styled( Box, {\n\tshouldForwardProp: ( prop: string ) => ! [ 'isActive', 'isError' ].includes( prop ),\n} )< { isActive: boolean; isError: boolean } >( ( { theme, isActive, isError } ) => ( {\n\tdisplay: 'flex',\n\twidth: '100%',\n\tflexGrow: 1,\n\tborderRadius: theme.spacing( 0.5 ),\n\tborder: getIndicatorBorder( { isActive, isError, theme } ),\n\tpadding: `0 ${ theme.spacing( 1 ) }`,\n\tmarginLeft: isActive ? theme.spacing( 1 ) : 0,\n} ) );\n\nconst getIndicatorBorder = ( { isActive, isError, theme }: { isActive: boolean; isError: boolean; theme: Theme } ) => {\n\tif ( isError ) {\n\t\treturn `2px solid ${ theme.palette.error.main }`;\n\t}\n\n\tif ( isActive ) {\n\t\treturn `2px solid ${ theme.palette.secondary.main }`;\n\t}\n\n\treturn 'none';\n};\n\nconst validateLabel = ( newLabel: string ) => {\n\tif ( ! stylesRepository.isLabelValid( newLabel ) ) {\n\t\treturn __( 'Format is not valid', 'elementor' );\n\t}\n\n\tif ( stylesRepository.isLabelExist( newLabel ) ) {\n\t\treturn __( 'Existing name', 'elementor' );\n\t}\n\n\treturn null;\n};\n","import { generateId } from '@elementor/editor-styles';\nimport type { StylesProvider } from '@elementor/editor-styles-repository';\nimport {\n\t__dispatch as dispatch,\n\t__getState as getState,\n\t__subscribeWithSelector as subscribeWithSelector,\n} from '@elementor/store';\nimport { __ } from '@wordpress/i18n';\n\nimport { GlobalClassLabelAlreadyExistsError } from './errors';\nimport { selectClass, selectGlobalClasses, selectOrderedClasses, slice, type StateWithGlobalClasses } from './store';\n\nexport const globalClassesStylesProvider = {\n\tkey: 'global-classes',\n\tpriority: 30,\n\tactions: {\n\t\tget: () => selectOrderedClasses( getState() ),\n\t\tgetById: ( id ) => selectClass( getState(), id ),\n\t\tcreate: ( label ) => {\n\t\t\tconst classes = selectGlobalClasses( getState() );\n\n\t\t\tconst existingLabels = Object.values( classes ).map( ( style ) => style.label );\n\n\t\t\tif ( existingLabels.includes( label ) ) {\n\t\t\t\tthrow new GlobalClassLabelAlreadyExistsError( { context: { label } } );\n\t\t\t}\n\n\t\t\tconst existingIds = Object.keys( classes );\n\t\t\tconst id = generateId( 'g-', existingIds );\n\n\t\t\tdispatch(\n\t\t\t\tslice.actions.add( {\n\t\t\t\t\tid,\n\t\t\t\t\ttype: 'class',\n\t\t\t\t\tlabel,\n\t\t\t\t\tvariants: [],\n\t\t\t\t} )\n\t\t\t);\n\n\t\t\treturn id;\n\t\t},\n\t\tupdate: ( payload ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.update( {\n\t\t\t\t\tstyle: payload,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\tdelete: ( id ) => {\n\t\t\tdispatch( slice.actions.delete( id ) );\n\t\t},\n\t\tsetOrder: ( order ) => {\n\t\t\tdispatch( slice.actions.setOrder( order ) );\n\t\t},\n\t\tupdateProps: ( args ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.updateProps( {\n\t\t\t\t\tid: args.id,\n\t\t\t\t\tmeta: args.meta,\n\t\t\t\t\tprops: args.props,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t},\n\tsubscribe: ( cb ) => subscribeWithSelector( ( state: StateWithGlobalClasses ) => state.globalClasses, cb ),\n\tlabels: {\n\t\tsingular: __( 'Global class', 'elementor' ),\n\t\tplural: __( 'Global CSS Classes', 'elementor' ),\n\t},\n} satisfies StylesProvider;\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectOrder } from '../store';\n\nexport const useClassesOrder = () => {\n\treturn useSelector( selectOrder );\n};\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectOrderedClasses } from '../store';\n\nexport const useOrderedClasses = () => {\n\treturn useSelector( selectOrderedClasses );\n};\n","import * as React from 'react';\nimport { createContext, useContext, useState } from 'react';\nimport { type StyleDefinition } from '@elementor/editor-styles';\nimport { AlertOctagonFilledIcon } from '@elementor/icons';\nimport {\n\tButton,\n\tDialog,\n\tDialogActions,\n\tDialogContent,\n\tDialogContentText,\n\tDialogTitle,\n\tTypography,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\n\ntype DeleteConfirmationDialogProps = Pick< StyleDefinition, 'id' | 'label' >;\n\ntype DeleteConfirmationContext = {\n\topenDialog: ( props: DeleteConfirmationDialogProps ) => void;\n\tcloseDialog: () => void;\n\tdialogProps: DeleteConfirmationDialogProps | null;\n};\n\nconst context = createContext< DeleteConfirmationContext | null >( null );\n\nexport const DeleteConfirmationProvider = ( { children }: React.PropsWithChildren ) => {\n\tconst [ dialogProps, setDialogProps ] = useState< DeleteConfirmationDialogProps | null >( null );\n\n\tconst openDialog = ( props: DeleteConfirmationDialogProps ) => {\n\t\tsetDialogProps( props );\n\t};\n\n\tconst closeDialog = () => {\n\t\tsetDialogProps( null );\n\t};\n\n\treturn (\n\t\t<context.Provider value={ { openDialog, closeDialog, dialogProps } }>\n\t\t\t{ children }\n\t\t\t{ !! dialogProps && <DeleteConfirmationDialog { ...dialogProps } /> }\n\t\t</context.Provider>\n\t);\n};\n\nconst TITLE_ID = 'delete-class-dialog';\n\nconst DeleteConfirmationDialog = ( { label, id }: DeleteConfirmationDialogProps ) => {\n\tconst { closeDialog } = useDeleteConfirmation();\n\n\tconst onConfirm = () => {\n\t\tglobalClassesStylesProvider.actions.delete( id );\n\n\t\tcloseDialog();\n\t};\n\n\treturn (\n\t\t<Dialog open onClose={ closeDialog } aria-labelledby={ TITLE_ID } maxWidth=\"xs\">\n\t\t\t<DialogTitle id={ TITLE_ID } display=\"flex\" alignItems=\"center\" gap={ 1 } sx={ { lineHeight: 1 } }>\n\t\t\t\t<AlertOctagonFilledIcon color=\"error\" />\n\t\t\t\t{ __( 'Delete global class', 'elementor' ) }\n\t\t\t</DialogTitle>\n\t\t\t<DialogContent>\n\t\t\t\t<DialogContentText variant=\"body2\" color=\"textPrimary\">\n\t\t\t\t\t{ __( 'Deleting', 'elementor' ) }\n\t\t\t\t\t<Typography variant=\"subtitle2\" component=\"span\">\n\t\t\t\t\t\t { label } \n\t\t\t\t\t</Typography>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'will permanently remove it from your project and may affect the design across all elements using it. This action cannot be undone.',\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</DialogContentText>\n\t\t\t</DialogContent>\n\t\t\t<DialogActions>\n\t\t\t\t<Button color=\"secondary\" onClick={ closeDialog }>\n\t\t\t\t\t{ __( 'Cancel', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t\t<Button variant=\"contained\" color=\"error\" onClick={ onConfirm }>\n\t\t\t\t\t{ __( 'Delete', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t</DialogActions>\n\t\t</Dialog>\n\t);\n};\n\nexport const useDeleteConfirmation = () => {\n\tconst contextValue = useContext( context );\n\n\tif ( ! contextValue ) {\n\t\tthrow new Error( 'useDeleteConfirmation must be used within a DeleteConfirmationProvider' );\n\t}\n\n\treturn contextValue;\n};\n","import * as React from 'react';\nimport { GripVerticalIcon } from '@elementor/icons';\nimport {\n\tBox,\n\tPaper,\n\tstyled,\n\tUnstableSortableItem,\n\ttype UnstableSortableItemProps,\n\ttype UnstableSortableItemRenderProps,\n\tUnstableSortableProvider,\n\ttype UnstableSortableProviderProps,\n} from '@elementor/ui';\n\nexport const SortableProvider = < T extends string >( props: UnstableSortableProviderProps< T > ) => (\n\t<UnstableSortableProvider restrictAxis variant=\"static\" dragPlaceholderStyle={ { opacity: '1' } } { ...props } />\n);\n\nconst SortableTrigger = ( props: React.HTMLAttributes< HTMLDivElement > ) => (\n\t<div { ...props } role=\"button\" className=\"class-item-sortable-trigger\">\n\t\t<GripVerticalIcon fontSize=\"tiny\" />\n\t</div>\n);\n\ntype ItemRenderProps = Record< string, unknown > & {\n\tisDragged: boolean;\n\tshowDropIndication: boolean;\n\tdropIndicationStyle: React.CSSProperties;\n};\n\ntype SortableItemProps = {\n\tid: UnstableSortableItemProps[ 'id' ];\n\tchildren: ( props: ItemRenderProps ) => React.ReactNode;\n};\n\nexport const SortableItem = ( { children, id }: SortableItemProps ) => {\n\treturn (\n\t\t<UnstableSortableItem\n\t\t\tid={ id }\n\t\t\trender={ ( {\n\t\t\t\titemProps,\n\t\t\t\tisDragged,\n\t\t\t\ttriggerProps,\n\t\t\t\titemStyle,\n\t\t\t\ttriggerStyle,\n\t\t\t\tdropIndicationStyle,\n\t\t\t\tshowDropIndication,\n\t\t\t}: UnstableSortableItemRenderProps ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<StyledSortableItem { ...itemProps } elevation={ 0 } sx={ itemStyle } role=\"listitem\">\n\t\t\t\t\t\t<SortableTrigger { ...triggerProps } style={ triggerStyle } />\n\t\t\t\t\t\t{ children( {\n\t\t\t\t\t\t\titemProps,\n\t\t\t\t\t\t\tisDragged,\n\t\t\t\t\t\t\ttriggerProps,\n\t\t\t\t\t\t\titemStyle,\n\t\t\t\t\t\t\ttriggerStyle,\n\t\t\t\t\t\t\tdropIndicationStyle,\n\t\t\t\t\t\t\tshowDropIndication,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</StyledSortableItem>\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst StyledSortableItem = styled( Paper )`\n\tposition: relative;\n\n\t&:hover {\n\t\t& .class-item-sortable-trigger {\n\t\t\tvisibility: visible;\n\t\t}\n\t}\n\n\t& .class-item-sortable-trigger {\n\t\tvisibility: hidden;\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 50%;\n\t\ttransform: translate( -75%, -50% );\n\t}\n`;\n\nexport const SortableItemIndicator = styled( Box )`\n\twidth: 100%;\n\theight: 3px;\n\tborder-radius: ${ ( { theme } ) => theme.spacing( 0.5 ) };\n\tbackground-color: ${ ( { theme } ) => theme.palette.text.primary };\n`;\n","import { useEffect } from 'react';\nimport { __useDispatch as useDispatch } from '@elementor/store';\n\nimport { apiClient } from '../api';\nimport { slice } from '../store';\n\nexport function PopulateStore() {\n\tconst dispatch = useDispatch();\n\n\tuseEffect( () => {\n\t\tapiClient.all().then( ( res ) => {\n\t\t\tconst { data, meta } = res.data;\n\n\t\t\tdispatch( slice.actions.init( { items: data, order: meta.order } ) );\n\t\t} );\n\t}, [ dispatch ] );\n\n\treturn null;\n}\n","import { __privateRunCommandSync as runCommandSync, registerDataHook } from '@elementor/editor-v1-adapters';\nimport { __getState as getState, __subscribeWithSelector as subscribeWithSelector } from '@elementor/store';\n\nimport { publishGlobalClasses } from './publish-global-classes';\nimport { selectIsDirty } from './store';\n\nexport function syncWithDocumentSave() {\n\tconst unsubscribe = syncDirtyState();\n\n\tbindSaveAction();\n\n\treturn unsubscribe;\n}\n\nfunction syncDirtyState() {\n\treturn subscribeWithSelector( selectIsDirty, () => {\n\t\tif ( ! isDirty() ) {\n\t\t\treturn;\n\t\t}\n\n\t\trunCommandSync( 'document/save/set-is-modified', { status: true }, { internal: true } );\n\t} );\n}\n\nfunction bindSaveAction() {\n\tregisterDataHook( 'after', 'document/save/save', publishGlobalClasses );\n}\n\nfunction isDirty() {\n\treturn selectIsDirty( getState() );\n}\n","import { init } from './init';\n\ninit();\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,oBAAgC;AAChC,kCAA+C;AAC/C,IAAAA,wBAAiD;AACjD,IAAAC,mCAAiC;AACjC,IAAAC,6BAA4D;AAC5D,IAAAC,iBAAiD;;;ACLjD,IAAAC,SAAuB;AACvB,IAAAC,gBAAgC;AAChC,IAAAC,aAAoC;AACpC,IAAAC,eAAmB;;;ACHnB,IAAAC,SAAuB;AACvB,2BAOO;AACP,IAAAC,gBAAuC;AACvC,IAAAC,aAA2F;AAC3F,IAAAC,eAAmB;;;ACXnB,IAAAC,gBAA6C;;;ACA7C,0BAAuC;AACvC,2BAKO;AAEP,mBAKO;;;ACbP,mBAA4B;AAErB,IAAM,+BAA2B,0BAAoC;AAAA,EAC3E,MAAM;AAAA,EACN,SAAS;AACV,CAAE;AAEK,IAAM,yCAAqC,0BAAkC;AAAA,EACnF,MAAM;AAAA,EACN,SAAS;AACV,CAAE;;;ADaF,IAAM,eAAmC;AAAA,EACxC,OAAO,CAAC;AAAA,EACR,OAAO,CAAC;AAAA,EACR,SAAS;AACV;AAKA,IAAM,aAAa;AAEZ,IAAM,YAAQ,aAAAC,eAAa;AAAA,EACjC,MAAM;AAAA,EACN;AAAA,EACA,UAAU;AAAA,IACT,KAAM,OAAO,EAAE,QAAQ,GAAoE;AAC1F,YAAM,QAAQ,QAAQ;AACtB,YAAM,QAAQ,QAAQ;AAEtB,YAAM,UAAU;AAAA,IACjB;AAAA,IACA,IAAK,OAAO,EAAE,QAAQ,GAAsC;AAC3D,YAAM,MAAO,QAAQ,EAAG,IAAI;AAC5B,YAAM,MAAM,QAAS,QAAQ,EAAG;AAEhC,YAAM,UAAU;AAAA,IACjB;AAAA,IACA,OAAQ,OAAO,EAAE,QAAQ,GAAwC;AAChE,YAAM,QAAQ,OAAO,YAAa,OAAO,QAAS,MAAM,KAAM,EAAE,OAAQ,CAAE,CAAE,EAAG,MAAO,OAAO,OAAQ,CAAE;AAEvG,YAAM,QAAQ,MAAM,MAAM,OAAQ,CAAE,OAAQ,OAAO,OAAQ;AAE3D,YAAM,UAAU;AAAA,IACjB;AAAA,IACA,SAAU,OAAO,EAAE,QAAQ,GAA0C;AACpE,YAAM,QAAQ;AAEd,YAAM,UAAU;AAAA,IACjB;AAAA,IACA,OAAQ,OAAO,EAAE,QAAQ,GAAqD;AAC7E,YAAM,QAAQ,MAAM,MAAO,QAAQ,MAAM,EAAG;AAE5C,YAAM,aAAa;AAAA,QAClB,GAAG;AAAA,QACH,GAAG,QAAQ;AAAA,MACZ;AAEA,YAAM,MAAO,QAAQ,MAAM,EAAG,IAAI;AAElC,YAAM,UAAU;AAAA,IACjB;AAAA,IACA,YACC,OACA;AAAA,MACC;AAAA,IACD,GACC;AACD,YAAM,QAAQ,MAAM,MAAO,QAAQ,EAAG;AAEtC,UAAK,CAAE,OAAQ;AACd,cAAM,IAAI,yBAA0B,EAAE,SAAS,EAAE,SAAS,QAAQ,GAAG,EAAE,CAAE;AAAA,MAC1E;AAEA,YAAM,cAAU,uCAAkB,OAAO,QAAQ,IAAK;AAEtD,UAAK,SAAU;AACd,gBAAQ,YAAQ,gCAAY,QAAQ,OAAO,QAAQ,KAAM;AAAA,MAC1D,OAAO;AACN,cAAM,SAAS,KAAM,EAAE,MAAM,QAAQ,MAAM,OAAO,QAAQ,MAAM,CAAE;AAAA,MACnE;AAEA,YAAM,UAAU;AAAA,IACjB;AAAA,IAEA,YAAa,OAAQ;AACpB,YAAM,UAAU;AAAA,IACjB;AAAA,EACD;AACD,CAAE;AAGK,IAAM,cAAc,CAAE,UAAuC,MAAO,UAAW,EAAE;AAEjF,IAAM,sBAAsB,CAAE,UAAuC,MAAO,UAAW,EAAE;AAEzF,IAAM,2BAAuB,aAAAC;AAAA,EAAgB;AAAA,EAAqB;AAAA,EAAa,CAAE,OAAO,UAC9F,MAAM,IAAK,CAAE,OAAQ,MAAO,EAAG,CAAE;AAClC;AAEO,IAAM,cAAc,CAAE,OAAmC,OAC/D,MAAO,UAAW,EAAE,MAAO,EAAG,KAAK;AAE7B,IAAM,gBAAgB,CAAE,UAAuC,MAAM,cAAc;;;AD/GnF,IAAM,gBAAgB,MAAM;AAClC,aAAO,cAAAC,eAAa,aAAc;AACnC;;;AGNA,IAAAC,gBAA+D;;;ACC/D,kBAA+C;AAI/C,IAAM,eAAe;AAMd,IAAM,YAAY;AAAA,EACxB,KAAK,UAAM,yBAAY,EAAE,IAAoC,iBAAiB,YAAa;AAAA,EAC3F,QAAQ,CAAE,gBAA4B,yBAAY,EAAE,IAAK,iBAAiB,cAAc,OAAQ;AACjG;;;ADTA,eAAsB,uBAAuB;AAC5C,MAAK,CAAE,QAAQ,GAAI;AAClB;AAAA,EACD;AAEA,QAAM,YAA4B,cAAAC,YAAS,EAAE;AAE7C,QAAM,UAAU,OAAQ;AAAA,IACvB,OAAO,MAAM;AAAA,IACb,OAAO,MAAM;AAAA,EACd,CAAE;AAEF,oBAAAC,YAAU,MAAM,QAAQ,YAAY,CAAE;AACvC;AAEA,SAAS,UAAU;AAClB,SAAO,kBAAe,cAAAD,YAAS,CAAE;AAClC;;;AEtBA,YAAuB;AACvB,mBAAyB;AACzB,iCAAqC;AACrC,uBAAkC;AAClC,gBAA8C;AAC9C,kBAAmB;AAEnB,IAAM,cAAc;AAEb,IAAM,2BAA2B,MAAM;AAC7C,QAAM,CAAE,qBAAqB,eAAgB,QAAI,iDAAsB,WAAY;AACnF,QAAM,CAAE,wBAAwB,yBAA0B,QAAI,uBAAU,CAAE,mBAAoB;AAE9F,SACC;AAAA,IAAC;AAAA;AAAA,MACA,MAAO;AAAA,MACP,WAAQ,gBAAI,qBAAqB,WAAY;AAAA,MAC7C,SAAU,oCAAC,yBAAoB;AAAA,MAC/B,aAAc,CAAE,oBAAqB;AACpC,YAAK,CAAE,iBAAkB;AACxB,0BAAgB;AAAA,QACjB;AAEA,kCAA2B,KAAM;AAAA,MAClC;AAAA;AAAA,EACD;AAEF;AAEA,IAAM,sBAAsB,MAAM;AACjC,SACC,oCAAC,mBAAM,KAAM,KAAM,SAAU,KAC5B,oCAAC,mBAAM,IAAK,EAAE,OAAO,QAAQ,QAAQ,QAAQ,GAAI,KAAI,IAAG,KAAI,gBAAe,GAC3E,oCAAC,qBACA,oCAAC,wBAAW,SAAU,eACnB;AAAA,IACD;AAAA,IACA;AAAA,EACD,CACD,GACA,oCAAC,UAAG,GACJ,oCAAC,wBAAW,SAAU,eACnB;AAAA,IACD;AAAA,IACA;AAAA,EACD,CACD,CACD,CACD;AAEF;;;AClDA,IAAAE,SAAuB;AAEvB,sCAAiC;AACjC,IAAAC,oBAAgE;AAChE,IAAAC,gBAA4C;AAC5C,IAAAC,aAkBO;AACP,IAAAC,eAAmB;;;ACxBnB,IAAAC,wBAA2B;AAE3B,IAAAC,gBAIO;AACP,IAAAC,eAAmB;AAKZ,IAAM,8BAA8B;AAAA,EAC1C,KAAK;AAAA,EACL,UAAU;AAAA,EACV,SAAS;AAAA,IACR,KAAK,MAAM,yBAAsB,cAAAC,YAAS,CAAE;AAAA,IAC5C,SAAS,CAAE,OAAQ,gBAAa,cAAAA,YAAS,GAAG,EAAG;AAAA,IAC/C,QAAQ,CAAE,UAAW;AACpB,YAAM,UAAU,wBAAqB,cAAAA,YAAS,CAAE;AAEhD,YAAM,iBAAiB,OAAO,OAAQ,OAAQ,EAAE,IAAK,CAAE,UAAW,MAAM,KAAM;AAE9E,UAAK,eAAe,SAAU,KAAM,GAAI;AACvC,cAAM,IAAI,mCAAoC,EAAE,SAAS,EAAE,MAAM,EAAE,CAAE;AAAA,MACtE;AAEA,YAAM,cAAc,OAAO,KAAM,OAAQ;AACzC,YAAM,SAAK,kCAAY,MAAM,WAAY;AAEzC,wBAAAC;AAAA,QACC,MAAM,QAAQ,IAAK;AAAA,UAClB;AAAA,UACA,MAAM;AAAA,UACN;AAAA,UACA,UAAU,CAAC;AAAA,QACZ,CAAE;AAAA,MACH;AAEA,aAAO;AAAA,IACR;AAAA,IACA,QAAQ,CAAE,YAAa;AACtB,wBAAAA;AAAA,QACC,MAAM,QAAQ,OAAQ;AAAA,UACrB,OAAO;AAAA,QACR,CAAE;AAAA,MACH;AAAA,IACD;AAAA,IACA,QAAQ,CAAE,OAAQ;AACjB,wBAAAA,YAAU,MAAM,QAAQ,OAAQ,EAAG,CAAE;AAAA,IACtC;AAAA,IACA,UAAU,CAAE,UAAW;AACtB,wBAAAA,YAAU,MAAM,QAAQ,SAAU,KAAM,CAAE;AAAA,IAC3C;AAAA,IACA,aAAa,CAAE,SAAU;AACxB,wBAAAA;AAAA,QACC,MAAM,QAAQ,YAAa;AAAA,UAC1B,IAAI,KAAK;AAAA,UACT,MAAM,KAAK;AAAA,UACX,OAAO,KAAK;AAAA,QACb,CAAE;AAAA,MACH;AAAA,IACD;AAAA,EACD;AAAA,EACA,WAAW,CAAE,WAAQ,cAAAC,yBAAuB,CAAE,UAAmC,MAAM,eAAe,EAAG;AAAA,EACzG,QAAQ;AAAA,IACP,cAAU,iBAAI,gBAAgB,WAAY;AAAA,IAC1C,YAAQ,iBAAI,sBAAsB,WAAY;AAAA,EAC/C;AACD;;;ACrEA,IAAAC,gBAA6C;AAItC,IAAM,kBAAkB,MAAM;AACpC,aAAO,cAAAC,eAAa,WAAY;AACjC;;;ACNA,IAAAC,iBAA6C;AAItC,IAAM,oBAAoB,MAAM;AACtC,aAAO,eAAAC,eAAa,oBAAqB;AAC1C;;;ACNA,IAAAC,SAAuB;AACvB,IAAAC,gBAAoD;AAEpD,mBAAuC;AACvC,IAAAC,aAQO;AACP,IAAAC,eAAmB;AAYnB,IAAM,cAAU,6BAAmD,IAAK;AAEjE,IAAM,6BAA6B,CAAE,EAAE,SAAS,MAAgC;AACtF,QAAM,CAAE,aAAa,cAAe,QAAI,wBAAkD,IAAK;AAE/F,QAAM,aAAa,CAAE,UAA0C;AAC9D,mBAAgB,KAAM;AAAA,EACvB;AAEA,QAAM,cAAc,MAAM;AACzB,mBAAgB,IAAK;AAAA,EACtB;AAEA,SACC,qCAAC,QAAQ,UAAR,EAAiB,OAAQ,EAAE,YAAY,aAAa,YAAY,KAC9D,UACA,CAAC,CAAE,eAAe,qCAAC,4BAA2B,GAAG,aAAc,CAClE;AAEF;AAEA,IAAM,WAAW;AAEjB,IAAM,2BAA2B,CAAE,EAAE,OAAO,GAAG,MAAsC;AACpF,QAAM,EAAE,YAAY,IAAI,sBAAsB;AAE9C,QAAM,YAAY,MAAM;AACvB,gCAA4B,QAAQ,OAAQ,EAAG;AAE/C,gBAAY;AAAA,EACb;AAEA,SACC,qCAAC,qBAAO,MAAI,MAAC,SAAU,aAAc,mBAAkB,UAAW,UAAS,QAC1E,qCAAC,0BAAY,IAAK,UAAW,SAAQ,QAAO,YAAW,UAAS,KAAM,GAAI,IAAK,EAAE,YAAY,EAAE,KAC9F,qCAAC,uCAAuB,OAAM,SAAQ,OACpC,iBAAI,uBAAuB,WAAY,CAC1C,GACA,qCAAC,gCACA,qCAAC,gCAAkB,SAAQ,SAAQ,OAAM,qBACtC,iBAAI,YAAY,WAAY,GAC9B,qCAAC,yBAAW,SAAQ,aAAY,WAAU,UAAO,QACxC,OAAO,MAChB,OACE;AAAA,IACD;AAAA,IACA;AAAA,EACD,CACD,CACD,GACA,qCAAC,gCACA,qCAAC,qBAAO,OAAM,aAAY,SAAU,mBACjC,iBAAI,UAAU,WAAY,CAC7B,GACA,qCAAC,qBAAO,SAAQ,aAAY,OAAM,SAAQ,SAAU,iBACjD,iBAAI,UAAU,WAAY,CAC7B,CACD,CACD;AAEF;AAEO,IAAM,wBAAwB,MAAM;AAC1C,QAAM,mBAAe,0BAAY,OAAQ;AAEzC,MAAK,CAAE,cAAe;AACrB,UAAM,IAAI,MAAO,wEAAyE;AAAA,EAC3F;AAEA,SAAO;AACR;;;AC/FA,IAAAC,SAAuB;AACvB,IAAAC,gBAAiC;AACjC,IAAAC,aASO;AAEA,IAAM,mBAAmB,CAAsB,UACrD,qCAAC,uCAAyB,cAAY,MAAC,SAAQ,UAAS,sBAAuB,EAAE,SAAS,IAAI,GAAM,GAAG,OAAQ;AAGhH,IAAM,kBAAkB,CAAE,UACzB,qCAAC,SAAM,GAAG,OAAQ,MAAK,UAAS,WAAU,iCACzC,qCAAC,kCAAiB,UAAS,QAAO,CACnC;AAcM,IAAM,eAAe,CAAE,EAAE,UAAU,GAAG,MAA0B;AACtE,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,QAAS,CAAE;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD,MAAwC;AACvC,eACC,qCAAC,sBAAqB,GAAG,WAAY,WAAY,GAAI,IAAK,WAAY,MAAK,cAC1E,qCAAC,mBAAkB,GAAG,cAAe,OAAQ,cAAe,GAC1D,SAAU;AAAA,UACX;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACD,CAAE,CACH;AAAA,MAEF;AAAA;AAAA,EACD;AAEF;AAEA,IAAM,yBAAqB,mBAAQ,gBAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBlC,IAAM,4BAAwB,mBAAQ,cAAI;AAAA;AAAA;AAAA,kBAG9B,CAAE,EAAE,MAAM,MAAO,MAAM,QAAS,GAAI,CAAE;AAAA,qBACnC,CAAE,EAAE,MAAM,MAAO,MAAM,QAAQ,KAAK,OAAQ;AAAA;;;ALxD3D,IAAM,oBAAoB,MAAM;AACtC,QAAM,aAAa,kBAAkB;AAErC,QAAM,CAAE,cAAc,cAAe,IAAI,WAAW;AAEpD,MAAK,CAAE,YAAY,QAAS;AAC3B,WAAO,qCAAC,gBAAW;AAAA,EACpB;AAEA,SACC,qCAAC,kCACA,qCAAC,mBAAK,IAAK,EAAE,SAAS,QAAQ,eAAe,UAAU,KAAK,IAAI,KAC/D,qCAAC,oBAAiB,OAAQ,cAAe,UAAW,kBACjD,YAAY,IAAK,CAAE,EAAE,IAAI,MAAM,MAAO;AACvC,UAAM,cAAc,CAAE,aAAsB;AAC3C,kCAA4B,QAAQ,OAAQ,EAAE,OAAO,UAAU,GAAG,CAAE;AAAA,IACrE;AAEA,WACC,qCAAC,gBAAa,KAAM,IAAK,MACtB,CAAE,EAAE,WAAW,oBAAoB,oBAAoB,MACxD;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAW;AAAA;AAAA,MAET,sBACD,qCAAC,yBAAsB,OAAQ,qBAAsB;AAAA,IAEvD,CAEF;AAAA,EAEF,CAAE,CACH,CACD,CACD;AAEF;AAEA,IAAM,aAAa,MAAM;AACxB,QAAM,QAAQ,gBAAgB;AAE9B,QAAM,UAAU,CAAE,WAAiC;AAClD,gCAA4B,QAAQ,SAAU,MAAO;AAAA,EACtD;AAEA,SAAO,CAAE,OAAO,OAAQ;AACzB;AAEA,IAAM,YAAY,CAAE;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,MAKS;AACR,QAAM;AAAA,IACL,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,EACX,QAAI,+BAAa;AAAA,IAChB,OAAO;AAAA,IACP,UAAU;AAAA,IACV,YAAY;AAAA,EACb,CAAE;AAEF,QAAM,EAAE,WAAW,IAAI,sBAAsB;AAE7C,QAAM,iBAAa,0BAAe;AAAA,IACjC,SAAS;AAAA,IACT,kBAAkB;AAAA,EACnB,CAAE;AAEF,SACC,qCAAC,oBAAM,WAAU,OAAM,YAAW,UAAS,KAAM,GAAI,UAAW,GAAI,YAAa,KAChF;AAAA,IAAC;AAAA;AAAA,MACA,WAAY;AAAA,MACZ,gBAAc;AAAA,MACd,gBAAc;AAAA,MACd,iBACC;AAAA,QAAC;AAAA;AAAA,UACA,WAAU;AAAA,UACV,WAAU;AAAA,UACV,WAAQ,iBAAI,gBAAgB,WAAY;AAAA;AAAA,QAExC,qCAAC,yBAAW,MAAK,QAAS,OAAG,wBAAa,UAAW,GAAI,cAAW,kBACnE,qCAAC,kCAAiB,UAAS,QAAO,CACnC;AAAA,MACD;AAAA;AAAA,IAGD;AAAA,MAAC;AAAA;AAAA,QACA,OAAK;AAAA,QACL,gBAAc;AAAA,QACd,OAAM;AAAA,QACN,eAAgB;AAAA,QAChB,UAAW,YAAY,WAAW;AAAA,QAClC,uBAAsB;AAAA,QACtB,IAAK;AAAA,UACJ,WAAW;AAAA,UACX,SAAS;AAAA,UACT,wBAAwB;AAAA,YACvB,WAAW;AAAA,UACZ;AAAA,QACD;AAAA;AAAA,MAEA,qCAAC,aAAU,UAAW,WAAY,SAAU,CAAC,CAAE,SAC5C,YACD;AAAA,QAAC;AAAA;AAAA,UACA,KAAM;AAAA,UACN;AAAA,UACA,IAAK;AAAA,UACL,SAAQ;AAAA,UACN,GAAG,iBAAiB;AAAA;AAAA,MACvB,IAEA,qCAAC,yCAAoB,OAAQ,OAAQ,IAAK,uBAAa,SAAQ,WAAU,CAE3E;AAAA,IACD;AAAA,IACE;AAAA,IACF;AAAA,MAAC;AAAA;AAAA,QACE,OAAG,qBAAU,UAAW;AAAA,QAC1B,cAAe;AAAA,UACd,UAAU;AAAA,UACV,YAAY;AAAA,QACb;AAAA,QACA,iBAAkB;AAAA,UACjB,UAAU;AAAA,UACV,YAAY;AAAA,QACb;AAAA;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACA,IAAK,EAAE,UAAU,QAAQ;AAAA,UACzB,SAAU,MAAM;AACf,uBAAW,MAAM;AACjB,yBAAa;AAAA,UACd;AAAA;AAAA,QAEA,qCAAC,2BAAa,aAAU,iBAAI,UAAU,WAAY,GAAI;AAAA,MACvD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,SAAU,MAAM;AACf,uBAAW,MAAM;AACjB,uBAAY,EAAE,IAAI,MAAM,CAAE;AAAA,UAC3B;AAAA;AAAA,QAEA,qCAAC,2BAAa,aAAU,iBAAI,UAAU,WAAY,GAAI,IAAK,EAAE,OAAO,cAAc,GAAI;AAAA,MACvF;AAAA,IACD;AAAA,EACD,CACD;AAEF;AAEA,IAAM,qBAAiB,mBAAQ,mBAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWxC,IAAM,aAAa,MAClB,qCAAC,oBAAM,YAAW,UAAS,KAAM,GAAI,IAAK,GAAI,IAAK,OAClD,qCAAC,2BAAU,UAAS,SAAQ,GAC5B,qCAAC,gBAAa,SAAQ,aAAY,WAAU,MAAK,OAAM,wBACpD,iBAAI,8BAA8B,WAAY,CACjD,GACA,qCAAC,yBAAW,OAAM,UAAS,SAAQ,WAAU,OAAM,wBAChD;AAAA,EACD;AAAA,EACA;AACD,CACD,CACD;AAID,IAAM,mBAAe,mBAAQ,qBAAW,EAAsB,CAAE,EAAE,OAAO,QAAQ,OAAS;AAAA,EACzF,wBAAwB;AAAA,IACvB,GAAK,MAAM,WAAY,OAAyC;AAAA,EACjE;AACD,EAAI;AAEJ,IAAM,gBAAY,mBAAQ,gBAAK;AAAA,EAC9B,mBAAmB,CAAE,SAAkB,CAAE,CAAE,YAAY,SAAU,EAAE,SAAU,IAAK;AACnF,CAAE,EAA8C,CAAE,EAAE,OAAO,UAAU,QAAQ,OAAS;AAAA,EACrF,SAAS;AAAA,EACT,OAAO;AAAA,EACP,UAAU;AAAA,EACV,cAAc,MAAM,QAAS,GAAI;AAAA,EACjC,QAAQ,mBAAoB,EAAE,UAAU,SAAS,MAAM,CAAE;AAAA,EACzD,SAAS,KAAM,MAAM,QAAS,CAAE,CAAE;AAAA,EAClC,YAAY,WAAW,MAAM,QAAS,CAAE,IAAI;AAC7C,EAAI;AAEJ,IAAM,qBAAqB,CAAE,EAAE,UAAU,SAAS,MAAM,MAA8D;AACrH,MAAK,SAAU;AACd,WAAO,aAAc,MAAM,QAAQ,MAAM,IAAK;AAAA,EAC/C;AAEA,MAAK,UAAW;AACf,WAAO,aAAc,MAAM,QAAQ,UAAU,IAAK;AAAA,EACnD;AAEA,SAAO;AACR;AAEA,IAAM,gBAAgB,CAAE,aAAsB;AAC7C,MAAK,CAAE,iDAAiB,aAAc,QAAS,GAAI;AAClD,eAAO,iBAAI,uBAAuB,WAAY;AAAA,EAC/C;AAEA,MAAK,iDAAiB,aAAc,QAAS,GAAI;AAChD,eAAO,iBAAI,iBAAiB,WAAY;AAAA,EACzC;AAEA,SAAO;AACR;;;APrPO,IAAM,EAAE,OAAO,gBAAgB,QAAI,qBAAAC,eAAa;AAAA,EACtD,IAAI;AAAA,EACJ,WAAW;AACZ,CAAE;AAEK,SAAS,oBAAoB;AACnC,QAAMC,WAAU,cAAc;AAE9B,SACC,4DACC,qCAAC,4BAAc,UAAW,qCAAC,2BAAsB,KAChD,qCAAC,kCACA,qCAAC,wCACA,qCAAC,oBAAM,GAAI,GAAI,IAAK,GAAI,OAAM,QAAO,WAAU,OAAM,YAAW,YAC/D,qCAAC,yCAAiB,IAAK,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,IAAI,KACxE,qCAAC,iCAAgB,UAAS,WAAU,IAAK,EAAE,WAAW,gBAAgB,GAAI,OACxE,iBAAI,qBAAqB,WAAY,CACxC,GACA,qCAAC,eAAY,IAAK,EAAE,YAAY,OAAO,GAAI,CAC5C,CACD,GACA,qCAAC,kCAAU,IAAK,KACf,qCAAC,uBAAkB,CACpB,GACA,qCAAC,wCACA;AAAA,IAAC;AAAA;AAAA,MACA,WAAS;AAAA,MACT,MAAK;AAAA,MACL,SAAQ;AAAA,MACR,OAAM;AAAA,MACN,UAAW,CAAEA;AAAA,MACb,SAAU;AAAA;AAAA,QAER,iBAAI,gBAAgB,WAAY;AAAA,EACnC,CACD,CACD,CACD,GACA,qCAAC,8BAAyB,CAC3B;AAEF;AAEA,IAAM,cAAc,CAAE,UAA4B;AACjD,QAAM,EAAE,MAAM,IAAI,gBAAgB;AAElC,SACC,qCAAC,yBAAW,MAAK,SAAQ,OAAM,aAAY,SAAU,OAAU,GAAG,SACjE,qCAAC,uBAAM,UAAS,SAAQ,CACzB;AAEF;AAEA,IAAM,wBAAwB,MAC7B,qCAAC,kBAAI,MAAK,SAAQ,IAAK,EAAE,WAAW,QAAQ,GAAG,EAAE,KAChD,qCAAC,oBAAM,UAAS,SAAQ,IAAK,EAAE,IAAI,GAAG,UAAU,KAAK,WAAW,SAAS,KACxE,qCAAC,oBAAS,iBAAI,wBAAwB,WAAY,CAAG,CACtD,CACD;;;ADrEM,IAAM,qBAAqB,MAAM;AACvC,QAAM,EAAE,KAAK,IAAI,gBAAgB;AAEjC,SACC,qCAAC,sBAAQ,WAAQ,iBAAI,iBAAiB,WAAY,GAAI,WAAU,SAC/D,qCAAC,yBAAW,SAAU,QACrB,qCAAC,iCAAgB,UAAS,QAAO,CAClC,CACD;AAEF;;;AcjBA,IAAAC,gBAA0B;AAC1B,IAAAC,iBAA6C;AAKtC,SAAS,gBAAgB;AAC/B,QAAMC,gBAAW,eAAAC,eAAY;AAE7B,+BAAW,MAAM;AAChB,cAAU,IAAI,EAAE,KAAM,CAAE,QAAS;AAChC,YAAM,EAAE,MAAM,KAAK,IAAI,IAAI;AAE3B,MAAAD,UAAU,MAAM,QAAQ,KAAM,EAAE,OAAO,MAAM,OAAO,KAAK,MAAM,CAAE,CAAE;AAAA,IACpE,CAAE;AAAA,EACH,GAAG,CAAEA,SAAS,CAAE;AAEhB,SAAO;AACR;;;AClBA,gCAA4E;AAC5E,IAAAE,iBAAyF;AAKlF,SAAS,uBAAuB;AACtC,QAAM,cAAc,eAAe;AAEnC,iBAAe;AAEf,SAAO;AACR;AAEA,SAAS,iBAAiB;AACzB,aAAO,eAAAC,yBAAuB,eAAe,MAAM;AAClD,QAAK,CAAEC,SAAQ,GAAI;AAClB;AAAA,IACD;AAEA,kCAAAC,yBAAgB,iCAAiC,EAAE,QAAQ,KAAK,GAAG,EAAE,UAAU,KAAK,CAAE;AAAA,EACvF,CAAE;AACH;AAEA,SAAS,iBAAiB;AACzB,kDAAkB,SAAS,sBAAsB,oBAAqB;AACvE;AAEA,SAASD,WAAU;AAClB,SAAO,kBAAe,eAAAE,YAAS,CAAE;AAClC;;;AhBhBO,SAAS,OAAO;AACtB,qBAAAC,iBAAe,KAAM;AACrB,4BAAAC,iBAAe,KAAM;AAErB,oDAAiB,SAAU,2BAA4B;AAEvD,qCAAiB;AAAA,IAChB,IAAI;AAAA,IACJ,WAAW;AAAA,EACZ,CAAE;AAEF,kEAAgC;AAAA,IAC/B,IAAI;AAAA,IACJ,WAAW;AAAA,EACZ,CAAE;AAEF,iCAAAC,uBAAU,yCAAa,GAAG,MAAM;AAC/B,yBAAqB;AAAA,EACtB,CAAE;AACH;;;AiB/BA,KAAK;","names":["import_editor_panels","import_editor_styles_repository","import_editor_v1_adapters","import_store","React","import_icons","import_ui","import_i18n","React","import_icons","import_ui","import_i18n","import_store","createSlice","createSelector","useSelector","import_store","getState","dispatch","React","import_editor_ui","import_icons","import_ui","import_i18n","import_editor_styles","import_store","import_i18n","getState","dispatch","subscribeWithSelector","import_store","useSelector","import_store","useSelector","React","import_react","import_ui","import_i18n","React","import_icons","import_ui","createPanel","isDirty","import_react","import_store","dispatch","useDispatch","import_store","subscribeWithSelector","isDirty","runCommandSync","getState","registerSlice","registerPanel","listenTo"]}
|