← All changes | assets/js/packages/editor-components/editor-components.js +2 -2933 4.3.0 → 3.32.3 View file →

		@@ -1,2934 +1,3 @@
1		-(function(_elementor_editor, _elementor_editor_canvas, _elementor_editor_documents, _elementor_editor_editing_panel, _elementor_editor_elements_panel, _elementor_editor_embedded_documents_manager, _elementor_editor_v1_adapters, _elementor_store, _wordpress_i18n, _elementor_http_client, react, _elementor_editor_ui, _elementor_ui, _elementor_utils, _elementor_icons, _elementor_editor_current_user, _elementor_editor_notifications, _elementor_editor_elements, _elementor_editor_props, _elementor_schema, _elementor_events, _elementor_editor_panels, _elementor_editor_controls, _elementor_editor_templates) {
2		-
3		-//#region \0rolldown/runtime.js
4		- var __create = Object.create;
5		- var __defProp$1 = Object.defineProperty;
6		- var __name = (target, value) => __defProp$1(target, "name", {
7		- value,
8		- configurable: true
9		- });
10		- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
11		- var __getOwnPropNames = Object.getOwnPropertyNames;
12		- var __getProtoOf = Object.getPrototypeOf;
13		- var __hasOwnProp = Object.prototype.hasOwnProperty;
14		- var __exportAll = (all, no_symbols) => {
15		- let target = {};
16		- for (var name in all) {
17		- __defProp$1(target, name, {
18		- get: all[name],
19		- enumerable: true
20		- });
21		- }
22		- if (!no_symbols) {
23		- __defProp$1(target, Symbol.toStringTag, { value: "Module" });
24		- }
25		- return target;
26		- };
27		- var __copyProps = (to, from, except, desc) => {
28		- if (from && typeof from === "object" || typeof from === "function") {
29		- for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
30		- key = keys[i];
31		- if (!__hasOwnProp.call(to, key) && key !== except) {
32		- __defProp$1(to, key, {
33		- get: ((k) => from[k]).bind(null, key),
34		- enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
35		- });
36		- }
37		- }
38		- }
39		- return to;
40		- };
41		- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp$1(target, "default", {
42		- value: mod,
43		- enumerable: true
44		- }) : target, mod));
45		-
46		-//#endregion
47		-react = __toESM(react);
48		-
49		-//#region packages/packages/core/editor-components/src/store/store-types.ts
50		- var initialState = {
51		- data: [],
52		- unpublishedData: [],
53		- loadStatus: "idle",
54		- createdThisSession: [],
55		- archivedThisSession: [],
56		- path: [],
57		- currentComponentId: null,
58		- updatedComponentNames: {},
59		- sanitized: {}
60		- };
61		- var SLICE_NAME = "components";
62		-
63		-//#endregion
64		-//#region packages/packages/core/editor-components/src/api.ts
65		- var BASE_URL = "elementor/v1/components";
66		- var getParams = (id) => ({
67		- action: "get_document_config",
68		- unique_id: `document-config-${id}`,
69		- data: { id }
70		- });
71		- var apiClient = {
72		- get: () => (0, _elementor_http_client.httpService)().get(`${BASE_URL}`).then((res) => res.data.data),
73		- create: (payload) => (0, _elementor_http_client.httpService)().post(`${BASE_URL}`, payload).then((res) => res.data.data),
74		- updateStatuses: (ids, status) => (0, _elementor_http_client.httpService)().put(`${BASE_URL}/status`, {
75		- ids,
76		- status
77		- }),
78		- getComponentConfig: (id) => _elementor_editor_v1_adapters.ajax.load(getParams(id)),
79		- invalidateComponentConfigCache: (id) => _elementor_editor_v1_adapters.ajax.invalidateCache(getParams(id)),
80		- getComponentLockStatus: async (componentId) => await (0, _elementor_http_client.httpService)().get(`${BASE_URL}/lock-status`, { params: { componentId } }).then((res) => {
81		- const { is_current_user_allow_to_edit: isAllowedToSwitchDocument, locked_by: lockedBy } = res.data.data;
82		- return {
83		- isAllowedToSwitchDocument,
84		- lockedBy: lockedBy || ""
85		- };
86		- }),
87		- lockComponent: async (componentId) => await (0, _elementor_http_client.httpService)().post(`${BASE_URL}/lock`, { componentId }).then((res) => res.data),
88		- unlockComponent: async (componentId) => await (0, _elementor_http_client.httpService)().post(`${BASE_URL}/unlock`, { componentId }).then((res) => res.data),
89		- getOverridableProps: async (componentIds) => await (0, _elementor_http_client.httpService)().get(`${BASE_URL}/overridable-props`, { params: { "componentIds[]": componentIds } }).then((res) => res.data),
90		- updateArchivedComponents: async (componentIds, status) => await (0, _elementor_http_client.httpService)().post(`${BASE_URL}/archive`, {
91		- componentIds,
92		- status
93		- }).then((res) => res.data.data),
94		- updateComponentTitle: (updatedComponentNames, status) => (0, _elementor_http_client.httpService)().post(`${BASE_URL}/update-titles`, {
95		- components: updatedComponentNames,
96		- status
97		- }).then((res) => res.data.data),
98		- validate: async (payload) => await (0, _elementor_http_client.httpService)().post(`${BASE_URL}/create-validate`, payload).then((res) => res.data)
99		- };
100		-
101		-//#endregion
102		-//#region packages/packages/core/editor-components/src/store/thunks.ts
103		- var loadComponents = (0, _elementor_store.__createAsyncThunk)("components/load", async () => {
104		- return await apiClient.get();
105		- });
106		-
107		-//#endregion
108		-//#region packages/packages/core/editor-components/src/store/extensible-slice.ts
109		- var extraReducersMap = /* @__PURE__ */ new Map();
110		- function registerComponentsReducer(name, reducer) {
111		- extraReducersMap.set(`${SLICE_NAME}/${name}`, reducer);
112		- }
113		- function createComponentsAction(name) {
114		- const action = (0, _elementor_store.__createAction)(`${SLICE_NAME}/${name}`);
115		- return {
116		- action,
117		- register(reducer) {
118		- registerComponentsReducer(name, reducer);
119		- },
120		- dispatch(payload) {
121		- (0, _elementor_store.__dispatch)(action(payload));
122		- }
123		- };
124		- }
125		- var baseSlice = (0, _elementor_store.__createSlice)({
126		- name: SLICE_NAME,
127		- initialState,
128		- reducers: {
129		- add: (state, { payload }) => {
130		- if (Array.isArray(payload)) state.data = [...payload, ...state.data];
131		- else state.data.unshift(payload);
132		- },
133		- load: (state, { payload }) => {
134		- state.data = payload;
135		- },
136		- addUnpublished: (state, { payload }) => {
137		- state.unpublishedData.unshift(payload);
138		- },
139		- removeUnpublished: (state, { payload }) => {
140		- const uidsToRemove = Array.isArray(payload) ? payload : [payload];
141		- state.unpublishedData = state.unpublishedData.filter((component) => !uidsToRemove.includes(component.uid));
142		- },
143		- resetUnpublished: (state) => {
144		- state.unpublishedData = [];
145		- },
146		- addCreatedThisSession: (state, { payload }) => {
147		- state.createdThisSession.push(payload);
148		- },
149		- removeCreatedThisSession: (state, { payload }) => {
150		- state.createdThisSession = state.createdThisSession.filter((uid) => uid !== payload);
151		- },
152		- archive: (state, { payload }) => {
153		- const component = state.data.find((comp) => comp.id === payload);
154		- if (component) {
155		- component.isArchived = true;
156		- state.archivedThisSession.push(payload);
157		- }
158		- },
159		- setCurrentComponentId: (state, { payload }) => {
160		- state.currentComponentId = payload;
161		- },
162		- setPath: (state, { payload }) => {
163		- state.path = payload;
164		- },
165		- setOverridableProps: (state, { payload }) => {
166		- const component = state.data.find((comp) => comp.id === payload.componentId);
167		- if (!component) return;
168		- component.overridableProps = payload.overridableProps;
169		- },
170		- loadOverridableProps: (state, { payload }) => {
171		- Object.keys(payload).forEach((id) => {
172		- const componentId = Number(id);
173		- const overridableProps = payload[componentId];
174		- const component = state.data.find((comp) => comp.id === componentId);
175		- if (!component || !overridableProps) return;
176		- component.overridableProps = overridableProps;
177		- });
178		- },
179		- rename: (state, { payload }) => {
180		- const component = state.data.find((comp) => comp.uid === payload.componentUid);
181		- if (!component) return;
182		- if (component.id) state.updatedComponentNames[component.id] = payload.name;
183		- component.name = payload.name;
184		- },
185		- cleanUpdatedComponentNames: (state) => {
186		- state.updatedComponentNames = {};
187		- },
188		- updateComponentSanitizedAttribute: (state, { payload: { componentId, attribute } }) => {
189		- if (!state.sanitized[componentId]) state.sanitized[componentId] = {};
190		- state.sanitized[componentId][attribute] = true;
191		- },
192		- resetSanitizedComponents: (state) => {
193		- state.sanitized = {};
194		- }
195		- },
196		- extraReducers: (builder) => {
197		- builder.addCase(loadComponents.fulfilled, (state, { payload }) => {
198		- state.data = payload;
199		- state.loadStatus = "idle";
200		- });
201		- builder.addCase(loadComponents.pending, (state) => {
202		- state.loadStatus = "pending";
203		- });
204		- builder.addCase(loadComponents.rejected, (state) => {
205		- state.loadStatus = "error";
206		- });
207		- }
208		- });
209		- var slice = {
210		- ...baseSlice,
211		- reducer(state, action) {
212		- const nextState = baseSlice.reducer(state, action);
213		- const extraReducer = extraReducersMap.get(action.type);
214		- if (!extraReducer || !nextState) return nextState;
215		- const clonedState = structuredClone(nextState);
216		- extraReducer(clonedState, action);
217		- return clonedState;
218		- }
219		- };
220		-
221		-//#endregion
222		-//#region packages/packages/core/editor-components/src/store/store.ts
223		- var selectData = (state) => state[SLICE_NAME].data;
224		- var selectArchivedThisSession = (state) => state[SLICE_NAME].archivedThisSession;
225		- var selectLoadStatus = (state) => state[SLICE_NAME].loadStatus;
226		- var selectUnpublishedData = (state) => state[SLICE_NAME].unpublishedData;
227		- var getCreatedThisSession = (state) => state[SLICE_NAME].createdThisSession;
228		- var getPath = (state) => state[SLICE_NAME].path;
229		- var getCurrentComponentId = (state) => state[SLICE_NAME].currentComponentId;
230		- var selectComponent = (state, componentId) => state[SLICE_NAME].data.find((component) => component.id === componentId);
231		- var useComponent = (componentId) => {
232		- return (0, _elementor_store.__useSelector)((state) => componentId ? selectComponent(state, componentId) : null);
233		- };
234		- var selectComponentByUid = (state, componentUid) => state["components"].data.find((component) => component.uid === componentUid) ?? state["components"].unpublishedData.find((component) => component.uid === componentUid);
235		- var selectComponents = (0, _elementor_store.__createSelector)(selectData, selectUnpublishedData, (data, unpublishedData) => [...unpublishedData.map((item) => ({
236		- uid: item.uid,
237		- name: item.name,
238		- overridableProps: item.overridableProps
239		- })), ...data.filter((component) => !component.isArchived)]);
240		- var selectUnpublishedComponents = (0, _elementor_store.__createSelector)(selectUnpublishedData, (unpublishedData) => unpublishedData);
241		- var selectLoadIsPending = (0, _elementor_store.__createSelector)(selectLoadStatus, (status) => status === "pending");
242		- var selectLoadIsError = (0, _elementor_store.__createSelector)(selectLoadStatus, (status) => status === "error");
243		- var selectCreatedThisSession = (0, _elementor_store.__createSelector)(getCreatedThisSession, (createdThisSession) => createdThisSession);
244		- var DEFAULT_OVERRIDABLE_PROPS = {
245		- props: {},
246		- groups: {
247		- items: {},
248		- order: []
249		- }
250		- };
251		- var selectOverridableProps = (0, _elementor_store.__createSelector)(selectComponent, (component) => {
252		- if (!component) return;
253		- return component.overridableProps ?? DEFAULT_OVERRIDABLE_PROPS;
254		- });
255		- var useOverridableProps = (componentId) => {
256		- return (0, _elementor_store.__useSelector)((state) => componentId ? selectOverridableProps(state, componentId) : null);
257		- };
258		- var selectIsOverridablePropsLoaded = (0, _elementor_store.__createSelector)(selectComponent, (component) => {
259		- return !!component?.overridableProps;
260		- });
261		- var selectPath = (0, _elementor_store.__createSelector)(getPath, (path) => path);
262		- var selectCurrentComponentId = (0, _elementor_store.__createSelector)(getCurrentComponentId, (currentComponentId) => currentComponentId);
263		- var selectCurrentComponent = (0, _elementor_store.__createSelector)(selectData, getCurrentComponentId, (data, currentComponentId) => data.find((component) => component.id === currentComponentId));
264		- var useCurrentComponentId = () => {
265		- return (0, _elementor_store.__useSelector)(selectCurrentComponentId);
266		- };
267		- var useCurrentComponent = () => {
268		- return (0, _elementor_store.__useSelector)(selectCurrentComponent);
269		- };
270		- var selectUpdatedComponentNames = (0, _elementor_store.__createSelector)((state) => state[SLICE_NAME].updatedComponentNames, (updatedComponentNames) => Object.entries(updatedComponentNames).map(([componentId, title]) => ({
271		- componentId: Number(componentId),
272		- title
273		- })));
274		- var useSanitizedComponents = () => {
275		- return (0, _elementor_store.__useSelector)((state) => state[SLICE_NAME].sanitized);
276		- };
277		- var useIsSanitizedComponent = (componentId, key) => {
278		- const sanitizedComponents = useSanitizedComponents();
279		- if (!componentId) return false;
280		- return !!sanitizedComponents[componentId]?.[key];
281		- };
282		-
283		-//#endregion
284		-//#region packages/packages/core/editor-components/src/utils/component-document-data.ts
285		- var getComponentDocumentParams = (id) => ({
286		- action: "get_document_config",
287		- unique_id: `document-${id}`,
288		- data: { id }
289		- });
290		- var pendingRequests = /* @__PURE__ */ new Map();
291		- var getComponentDocumentData = (id) => {
292		- const pendingRequest = pendingRequests.get(id);
293		- if (pendingRequest) return pendingRequest;
294		- const request = _elementor_editor_v1_adapters.ajax.load(getComponentDocumentParams(id)).catch(() => null).finally(() => pendingRequests.delete(id));
295		- pendingRequests.set(id, request);
296		- return request;
297		- };
298		-
299		-//#endregion
300		-//#region packages/packages/core/editor-components/src/component-instance-transformer.ts
301		- var componentInstanceTransformer = (0, _elementor_editor_canvas.createTransformer)(async ({ component_id: id, overrides: overridesValue }) => {
302		- const unpublishedComponent = selectUnpublishedComponents((0, _elementor_store.__getState)()).find(({ uid }) => uid === id);
303		- const overrides = overridesValue?.reduce((acc, override) => ({
304		- ...acc,
305		- ...override
306		- }), {});
307		- if (unpublishedComponent) return {
308		- elements: structuredClone(unpublishedComponent.elements),
309		- overrides
310		- };
311		- if (typeof id !== "number") throw new Error(`Component ID "${id}" not valid.`);
312		- return {
313		- elements: (await getComponentDocumentData(id))?.elements ?? [],
314		- overrides
315		- };
316		- });
317		-
318		-//#endregion
319		-//#region packages/packages/core/editor-components/src/component-overridable-transformer.ts
320		- var componentOverridableTransformer = (0, _elementor_editor_canvas.createTransformer)((value, options) => {
321		- const { overrides } = options.renderContext ?? {};
322		- const overrideValue = overrides?.[value.override_key];
323		- if (overrideValue) {
324		- if (isOriginValueOverride(value.origin_value)) return transformOverride(value, options, overrideValue);
325		- return overrideValue;
326		- }
327		- return value.origin_value;
328		- });
329		- function transformOverride(value, options, overrideValue) {
330		- const transformer = _elementor_editor_canvas.settingsTransformersRegistry.get("override");
331		- if (!transformer) return null;
332		- const transformedValue = transformer(value.origin_value.value, options);
333		- if (!transformedValue) return null;
334		- const [key] = Object.keys(transformedValue);
335		- return { [key]: overrideValue };
336		- }
337		- function isOriginValueOverride(originValue) {
338		- return originValue.$$type === "override";
339		- }
340		-
341		-//#endregion
342		-//#region packages/packages/core/editor-components/src/component-override-transformer.ts
343		- var componentOverrideTransformer = (0, _elementor_editor_canvas.createTransformer)((override) => {
344		- const { override_key: key, override_value: overrideValue } = override;
345		- return { [key]: overrideValue };
346		- });
347		-
348		-//#endregion
349		-//#region packages/packages/core/editor-components/src/hooks/use-components.ts
350		- var useComponents = () => {
351		- return {
352		- components: (0, _elementor_store.__useSelector)(selectComponents),
353		- isLoading: (0, _elementor_store.__useSelector)(selectLoadIsPending)
354		- };
355		- };
356		-
357		-//#endregion
358		-//#region packages/packages/core/editor-components/src/utils/is-pro-components-supported.ts
359		- var MIN_PRO_VERSION_FOR_COMPONENTS = "4.0";
360		- function isProComponentsSupported() {
361		- return (0, _elementor_utils.hasProInstalled)() && (0, _elementor_utils.isProAtLeast)(MIN_PRO_VERSION_FOR_COMPONENTS);
362		- }
363		- function isProOutdatedForComponents() {
364		- return (0, _elementor_utils.hasProInstalled)() && !(0, _elementor_utils.isProAtLeast)(MIN_PRO_VERSION_FOR_COMPONENTS);
365		- }
366		-
367		-//#endregion
368		-//#region packages/packages/core/editor-components/src/components/components-tab/search-provider.tsx
369		- var SearchContext = (0, react.createContext)(void 0);
370		- var SearchProvider = ({ children, localStorageKey }) => {
371		- const { debouncedValue, handleChange, inputValue } = (0, _elementor_utils.useSearchState)({ localStorageKey });
372		- const clearSearch = () => {
373		- handleChange("");
374		- };
375		- return /* @__PURE__ */ react.createElement(SearchContext.Provider, { value: {
376		- handleChange,
377		- clearSearch,
378		- searchValue: debouncedValue,
379		- inputValue
380		- } }, children);
381		- };
382		- var useSearch = () => {
383		- const context = (0, react.useContext)(SearchContext);
384		- if (!context) throw new Error("useSearch must be used within a SearchProvider");
385		- return context;
386		- };
387		-
388		-//#endregion
389		-//#region packages/packages/core/editor-components/src/components/components-tab/component-search.tsx
390		- var ComponentSearch = () => {
391		- const { inputValue, handleChange } = useSearch();
392		- return /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
393		- direction: "row",
394		- gap: .5,
395		- sx: {
396		- width: "100%",
397		- px: 2,
398		- py: 1.5
399		- }
400		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Box, { sx: { flexGrow: 1 } }, /* @__PURE__ */ react.createElement(_elementor_ui.TextField, {
401		- role: "search",
402		- fullWidth: true,
403		- size: "tiny",
404		- value: inputValue,
405		- placeholder: (0, _wordpress_i18n.__)("Search", "elementor"),
406		- onChange: (e) => handleChange(e.target.value),
407		- InputProps: { startAdornment: /* @__PURE__ */ react.createElement(_elementor_ui.InputAdornment, { position: "start" }, /* @__PURE__ */ react.createElement(_elementor_icons.SearchIcon, { fontSize: "tiny" })) }
408		- })));
409		- };
410		-
411		-//#endregion
412		-//#region packages/packages/core/editor-components/src/hooks/use-components-permissions.ts
413		- var useComponentsPermissions = () => {
414		- const { isAdmin } = (0, _elementor_editor_current_user.useCurrentUserCapabilities)();
415		- return {
416		- canCreate: isAdmin,
417		- canEdit: isAdmin,
418		- canDelete: isAdmin,
419		- canRename: isAdmin
420		- };
421		- };
422		-
423		-//#endregion
424		-//#region packages/packages/core/editor-components/src/components/components-tab/components-item.tsx
425		- var ComponentItem = (0, react.forwardRef)(({ component, disabled = true, draggable, onDragStart, onDragEnd, onClick, isEditing = false, error = null, nameSlot, endSlot, ...props }, ref) => {
426		- return /* @__PURE__ */ react.createElement(_elementor_ui.ListItemButton, {
427		- disabled,
428		- draggable,
429		- onDragStart,
430		- onDragEnd,
431		- shape: "rounded",
432		- ref,
433		- sx: {
434		- border: "solid 1px",
435		- borderColor: "divider",
436		- py: .5,
437		- px: 1,
438		- display: "flex",
439		- width: "100%",
440		- alignItems: "center",
441		- gap: 1
442		- },
443		- ...props
444		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Box, {
445		- display: "flex",
446		- alignItems: "center",
447		- gap: 1,
448		- minWidth: 0,
449		- flexGrow: 1,
450		- onClick
451		- }, /* @__PURE__ */ react.createElement(_elementor_ui.ListItemIcon, { size: "tiny" }, /* @__PURE__ */ react.createElement(_elementor_icons.ComponentsIcon, { fontSize: "tiny" })), /* @__PURE__ */ react.createElement(Indicator, {
452		- isActive: isEditing,
453		- isError: !!error
454		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Box, {
455		- display: "flex",
456		- flex: 1,
457		- minWidth: 0,
458		- flexGrow: 1
459		- }, nameSlot ?? /* @__PURE__ */ react.createElement(ComponentName, { name: component.name })))), endSlot);
460		- });
461		- var Indicator = (0, _elementor_ui.styled)(_elementor_ui.Box, { shouldForwardProp: (prop) => prop !== "isActive" && prop !== "isError" })(({ theme, isActive, isError }) => ({
462		- display: "flex",
463		- width: "100%",
464		- flexGrow: 1,
465		- borderRadius: theme.spacing(.5),
466		- border: getIndicatorBorder({
467		- isActive,
468		- isError,
469		- theme
470		- }),
471		- padding: `0 ${theme.spacing(1)}`,
472		- marginLeft: isActive ? theme.spacing(1) : 0,
473		- minWidth: 0
474		- }));
475		- var getIndicatorBorder = ({ isActive, isError, theme }) => {
476		- if (isError) return `2px solid ${theme.palette.error.main}`;
477		- if (isActive) return `2px solid ${theme.palette.secondary.main}`;
478		- return "none";
479		- };
480		- function ComponentName({ name, editable }) {
481		- if (editable?.isEditing) return /* @__PURE__ */ react.createElement(_elementor_editor_ui.EditableField, {
482		- ref: editable.ref,
483		- as: _elementor_ui.Typography,
484		- variant: "caption",
485		- ...editable.getProps()
486		- });
487		- return /* @__PURE__ */ react.createElement(_elementor_editor_ui.EllipsisWithTooltip, {
488		- title: name,
489		- as: _elementor_ui.Typography,
490		- variant: "caption",
491		- color: "text.primary"
492		- });
493		- }
494		-
495		-//#endregion
496		-//#region packages/packages/core/editor-components/src/components/components-tab/loading-components.tsx
497		- var ROWS = Array.from({ length: 3 }, (_, index) => index);
498		- var STAGGER_DELAY_MS = 80;
499		- var LoadingComponents = () => {
500		- return /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
501		- "aria-label": "Loading components",
502		- gap: 1.5,
503		- sx: {
504		- pointerEvents: "none",
505		- position: "relative",
506		- maxHeight: "300px",
507		- overflow: "hidden",
508		- px: 1,
509		- "&:after": {
510		- position: "absolute",
511		- bottom: 0,
512		- content: "\"\"",
513		- left: 0,
514		- width: "100%",
515		- height: "40%",
516		- pointerEvents: "none",
517		- zIndex: 1
518		- }
519		- }
520		- }, ROWS.map((row) => /* @__PURE__ */ react.createElement(_elementor_ui.Box, {
521		- key: row,
522		- display: "flex",
523		- alignItems: "center",
524		- gap: 1.5,
525		- sx: {
526		- py: .75,
527		- px: 1.5,
528		- opacity: 0,
529		- animation: `e-loading-fade-in 0.4s ease-out ${row * STAGGER_DELAY_MS}ms forwards`,
530		- "@keyframes e-loading-fade-in": {
531		- from: {
532		- opacity: 0,
533		- transform: "translateY(4px)"
534		- },
535		- to: {
536		- opacity: 1,
537		- transform: "translateY(0)"
538		- }
539		- }
540		- }
541		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Skeleton, {
542		- animation: "wave",
543		- variant: "rounded",
544		- width: 24,
545		- height: 24
546		- }), /* @__PURE__ */ react.createElement(_elementor_ui.Skeleton, {
547		- animation: "wave",
548		- variant: "rounded",
549		- width: "60%",
550		- height: 14
551		- }))));
552		- };
553		-
554		-//#endregion
555		-//#region packages/packages/core/editor-components/src/components/components-tab/components-list.tsx
556		- var LEARN_MORE_URL = "http://go.elementor.com/components-guide-article";
557		- var UPGRADE_URL$1 = "https://go.elementor.com/go-pro-components/";
558		- var UPDATE_PLUGINS_URL$2 = "/wp-admin/plugins.php";
559		- var SUBTITLE_OVERRIDE_SX = {
560		- fontSize: "0.875rem !important",
561		- fontWeight: "500 !important"
562		- };
563		- function ComponentsList() {
564		- const { components, isLoading, searchValue } = useFilteredComponents();
565		- if (isLoading) return /* @__PURE__ */ react.createElement(LoadingComponents, null);
566		- if (!components?.length) {
567		- if (searchValue.length) return /* @__PURE__ */ react.createElement(EmptySearchResult, null);
568		- if (isProOutdatedForComponents()) return /* @__PURE__ */ react.createElement(ProOutdatedEmptyState, null);
569		- return isProComponentsSupported() ? /* @__PURE__ */ react.createElement(EmptyState$1, null) : /* @__PURE__ */ react.createElement(ProUpgradeEmptyState, null);
570		- }
571		- return /* @__PURE__ */ react.createElement(_elementor_ui.List, { sx: {
572		- display: "flex",
573		- flexDirection: "column",
574		- gap: 1,
575		- px: 2
576		- } }, components.map((component) => /* @__PURE__ */ react.createElement(ComponentItem, {
577		- key: component.uid,
578		- component
579		- })));
580		- }
581		- var ProUpgradeEmptyState = () => {
582		- return /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
583		- alignItems: "center",
584		- justifyContent: "start",
585		- height: "100%",
586		- sx: {
587		- px: 2,
588		- py: 4
589		- },
590		- gap: 2,
591		- overflow: "hidden"
592		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
593		- alignItems: "center",
594		- gap: 1
595		- }, /* @__PURE__ */ react.createElement(_elementor_icons.ComponentsIcon, {
596		- fontSize: "large",
597		- sx: { color: "text.secondary" }
598		- }), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
599		- align: "center",
600		- variant: "subtitle2",
601		- color: "text.secondary",
602		- sx: SUBTITLE_OVERRIDE_SX
603		- }, (0, _wordpress_i18n.__)("Create Reusable Components", "elementor")), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
604		- align: "center",
605		- variant: "caption",
606		- color: "secondary",
607		- sx: { maxWidth: 200 }
608		- }, (0, _wordpress_i18n.__)("Create design elements that sync across your entire site.", "elementor"))), /* @__PURE__ */ react.createElement(_elementor_ui.Button, {
609		- variant: "contained",
610		- color: "promotion",
611		- size: "small",
612		- startIcon: /* @__PURE__ */ react.createElement(_elementor_icons.CrownFilledIcon, null),
613		- href: UPGRADE_URL$1,
614		- target: "_blank",
615		- rel: "noopener noreferrer"
616		- }, (0, _wordpress_i18n.__)("Upgrade now", "elementor")));
617		- };
618		- var ProOutdatedEmptyState = () => {
619		- return /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
620		- alignItems: "center",
621		- justifyContent: "start",
622		- height: "100%",
623		- sx: {
624		- px: 2,
625		- py: 4,
626		- maxWidth: 268,
627		- m: "auto"
628		- },
629		- gap: 2,
630		- overflow: "hidden"
631		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
632		- alignItems: "center",
633		- gap: 1
634		- }, /* @__PURE__ */ react.createElement(_elementor_icons.ComponentsIcon, {
635		- fontSize: "large",
636		- sx: { color: "text.secondary" }
637		- }), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
638		- align: "center",
639		- variant: "subtitle2",
640		- color: "text.secondary",
641		- sx: SUBTITLE_OVERRIDE_SX
642		- }, (0, _wordpress_i18n.__)("Create Reusable Components", "elementor")), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
643		- align: "center",
644		- variant: "caption",
645		- color: "secondary"
646		- }, (0, _wordpress_i18n.__)("Create design elements that sync across your entire site.", "elementor")), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
647		- align: "center",
648		- variant: "caption",
649		- color: "secondary",
650		- sx: { mt: 1 }
651		- }, (0, _wordpress_i18n.__)("To create components, update Elementor Pro to the latest version.", "elementor"))), /* @__PURE__ */ react.createElement(_elementor_ui.Button, {
652		- variant: "text",
653		- color: "info",
654		- size: "small",
655		- href: UPDATE_PLUGINS_URL$2,
656		- target: "_blank",
657		- rel: "noopener noreferrer"
658		- }, (0, _wordpress_i18n.__)("Update Elementor Pro", "elementor")));
659		- };
660		- var EmptyState$1 = /* @__PURE__ */ __name(() => {
661		- const { canCreate } = useComponentsPermissions();
662		- return /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
663		- alignItems: "center",
664		- justifyContent: "start",
665		- height: "100%",
666		- sx: {
667		- px: 2,
668		- py: 4
669		- },
670		- gap: 2,
671		- overflow: "hidden"
672		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
673		- alignItems: "center",
674		- gap: 1
675		- }, /* @__PURE__ */ react.createElement(_elementor_icons.ComponentsIcon, {
676		- fontSize: "large",
677		- sx: { color: "text.secondary" }
678		- }), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
679		- align: "center",
680		- variant: "subtitle2",
681		- color: "text.secondary",
682		- sx: SUBTITLE_OVERRIDE_SX
683		- }, (0, _wordpress_i18n.__)("No components yet", "elementor")), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
684		- align: "center",
685		- variant: "caption",
686		- color: "secondary",
687		- sx: { maxWidth: 200 }
688		- }, (0, _wordpress_i18n.__)("Components are reusable blocks that sync across your site.", "elementor"), /* @__PURE__ */ react.createElement("br", null), canCreate ? (0, _wordpress_i18n.__)("Create once, use everywhere.", "elementor") : (0, _wordpress_i18n.__)("With your current role, you cannot create components. Contact an administrator to create one.", "elementor")), /* @__PURE__ */ react.createElement(_elementor_ui.Link, {
689		- href: LEARN_MORE_URL,
690		- target: "_blank",
691		- rel: "noopener noreferrer",
692		- variant: "caption",
693		- color: "info.main"
694		- }, (0, _wordpress_i18n.__)("Learn more about components", "elementor"))), canCreate && /* @__PURE__ */ react.createElement(react.Fragment, null, /* @__PURE__ */ react.createElement(_elementor_ui.Divider, { sx: { width: "100%" } }), /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
695		- alignItems: "center",
696		- gap: 1,
697		- width: "100%"
698		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
699		- align: "center",
700		- variant: "subtitle2",
701		- color: "text.secondary",
702		- sx: SUBTITLE_OVERRIDE_SX
703		- }, (0, _wordpress_i18n.__)("Create your first one:", "elementor")), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
704		- align: "center",
705		- variant: "caption",
706		- color: "secondary",
707		- sx: { maxWidth: 228 }
708		- }, (0, _wordpress_i18n.__)("Right-click any div-block or flexbox on your canvas or structure and select \"Create component\"", "elementor")))));
709		- }, "EmptyState");
710		- var EmptySearchResult = () => {
711		- const { searchValue, clearSearch } = useSearch();
712		- return /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
713		- color: "text.secondary",
714		- pt: 5,
715		- alignItems: "center",
716		- gap: 1,
717		- overflow: "hidden",
718		- justifySelf: "center"
719		- }, /* @__PURE__ */ react.createElement(_elementor_icons.ComponentsIcon, null), /* @__PURE__ */ react.createElement(_elementor_ui.Box, { sx: { width: "100%" } }, /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
720		- align: "center",
721		- variant: "subtitle2",
722		- color: "inherit",
723		- sx: SUBTITLE_OVERRIDE_SX
724		- }, (0, _wordpress_i18n.__)("Sorry, nothing matched", "elementor")), searchValue && /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
725		- variant: "subtitle2",
726		- color: "inherit",
727		- sx: {
728		- ...SUBTITLE_OVERRIDE_SX,
729		- display: "flex",
730		- width: "100%",
731		- justifyContent: "center"
732		- }
733		- }, /* @__PURE__ */ react.createElement("span", null, "“"), /* @__PURE__ */ react.createElement("span", { style: {
734		- maxWidth: "80%",
735		- overflow: "hidden",
736		- textOverflow: "ellipsis"
737		- } }, searchValue), /* @__PURE__ */ react.createElement("span", null, "”."))), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
738		- align: "center",
739		- variant: "caption",
740		- color: "inherit"
741		- }, (0, _wordpress_i18n.__)("Try something else.", "elementor")), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
742		- align: "center",
743		- variant: "caption",
744		- color: "inherit"
745		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Link, {
746		- color: "secondary",
747		- variant: "caption",
748		- component: "button",
749		- onClick: clearSearch
750		- }, (0, _wordpress_i18n.__)("Clear & try again", "elementor"))));
751		- };
752		- var useFilteredComponents = () => {
753		- const { components, isLoading } = useComponents();
754		- const { searchValue } = useSearch();
755		- return {
756		- components: components.filter((component) => component.name.toLowerCase().includes(searchValue.toLowerCase())),
757		- isLoading,
758		- searchValue
759		- };
760		- };
761		-
762		-//#endregion
763		-//#region packages/packages/core/editor-components/src/components/components-upgrade-alert.tsx
764		- function ComponentsUpgradeAlert({ title, description, upgradeUrl }) {
765		- return /* @__PURE__ */ react.createElement(_elementor_ui.Box, { sx: {
766		- mt: "auto",
767		- position: "sticky",
768		- bottom: 0
769		- } }, /* @__PURE__ */ react.createElement(_elementor_ui.Alert, {
770		- variant: "standard",
771		- color: "promotion",
772		- icon: /* @__PURE__ */ react.createElement(_elementor_icons.CrownFilledIcon, { fontSize: "tiny" }),
773		- role: "status",
774		- size: "small",
775		- action: /* @__PURE__ */ react.createElement(_elementor_ui.AlertAction, {
776		- variant: "contained",
777		- color: "promotion",
778		- href: upgradeUrl,
779		- target: "_blank",
780		- rel: "noopener noreferrer"
781		- }, (0, _wordpress_i18n.__)("Upgrade now", "elementor")),
782		- sx: {
783		- m: 2,
784		- mt: 1
785		- }
786		- }, /* @__PURE__ */ react.createElement(_elementor_ui.AlertTitle, null, title), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, { variant: "caption" }, description)));
787		- }
788		-
789		-//#endregion
790		-//#region packages/packages/core/editor-components/src/components/components-tab/components-pro-notification.tsx
791		- var UPGRADE_URL = "https://go.elementor.com/go-pro-components-exist-footer/";
792		- function ComponentsProNotification() {
793		- return /* @__PURE__ */ react.createElement(ComponentsUpgradeAlert, {
794		- title: (0, _wordpress_i18n.__)("Create new components", "elementor"),
795		- description: (0, _wordpress_i18n.__)("Creating new components requires an active Pro subscription.", "elementor"),
796		- upgradeUrl: UPGRADE_URL
797		- });
798		- }
799		-
800		-//#endregion
801		-//#region packages/packages/core/editor-components/src/components/components-update-alert.tsx
802		- var UPDATE_PLUGINS_URL$1 = "/wp-admin/plugins.php";
803		- function ComponentsUpdateAlert({ title, description }) {
804		- return /* @__PURE__ */ react.createElement(_elementor_ui.Box, { sx: {
805		- mt: "auto",
806		- position: "sticky",
807		- bottom: 0
808		- } }, /* @__PURE__ */ react.createElement(_elementor_ui.Alert, {
809		- variant: "standard",
810		- color: "info",
811		- icon: /* @__PURE__ */ react.createElement(_elementor_icons.InfoCircleFilledIcon, { fontSize: "tiny" }),
812		- role: "status",
813		- size: "small",
814		- action: /* @__PURE__ */ react.createElement(_elementor_ui.AlertAction, {
815		- variant: "contained",
816		- color: "info",
817		- href: UPDATE_PLUGINS_URL$1,
818		- target: "_blank",
819		- rel: "noopener noreferrer"
820		- }, (0, _wordpress_i18n.__)("Upgrade Now", "elementor")),
821		- sx: {
822		- m: 2,
823		- mt: 1
824		- }
825		- }, /* @__PURE__ */ react.createElement(_elementor_ui.AlertTitle, null, title), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, { variant: "caption" }, description)));
826		- }
827		-
828		-//#endregion
829		-//#region packages/packages/core/editor-components/src/components/components-tab/components-update-notification.tsx
830		- function ComponentsUpdateNotification() {
831		- return /* @__PURE__ */ react.createElement(ComponentsUpdateAlert, {
832		- title: (0, _wordpress_i18n.__)("Create new Components", "elementor"),
833		- description: (0, _wordpress_i18n.__)("To create new components, update Elementor Pro to the latest version.", "elementor")
834		- });
835		- }
836		-
837		-//#endregion
838		-//#region packages/packages/core/editor-components/src/components/components-tab/components.tsx
839		- var FULL_HEIGHT_STYLE_ID = "components-full-height-panel";
840		- var FULL_HEIGHT_CSS = `
841		-#elementor-panel-page-elements {
842		- display: flex;
843		- flex-direction: column;
844		- height: 100%;
845		-}
846		-
847		-#elementor-panel-elements {
848		- display: flex;
849		- flex-direction: column;
850		- flex: 1;
851		- min-height: 0;
852		-}
853		-
854		-#elementor-panel-elements-wrapper {
855		- display: flex;
856		- flex-direction: column;
857		- flex: 1;
858		- min-height: 0;
859		-}
860		-`;
861		- var useFullHeightPanel = () => {
862		- (0, react.useLayoutEffect)(() => {
863		- let style = document.getElementById(FULL_HEIGHT_STYLE_ID);
864		- if (!style) {
865		- style = document.createElement("style");
866		- style.id = FULL_HEIGHT_STYLE_ID;
867		- style.textContent = FULL_HEIGHT_CSS;
868		- document.head.appendChild(style);
869		- }
870		- return () => {
871		- document.getElementById(FULL_HEIGHT_STYLE_ID)?.remove();
872		- };
873		- }, []);
874		- };
875		- var ComponentsContent = () => {
876		- const { components, isLoading } = useComponents();
877		- const hasComponents = !isLoading && components.length > 0;
878		- const showProNotification = !isProComponentsSupported() && hasComponents;
879		- const isOutdated = isProOutdatedForComponents();
880		- useFullHeightPanel();
881		- return /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
882		- justifyContent: "space-between",
883		- sx: {
884		- flex: 1,
885		- minHeight: 0
886		- }
887		- }, hasComponents && /* @__PURE__ */ react.createElement(ComponentSearch, null), /* @__PURE__ */ react.createElement(ComponentsList, null), showProNotification && (isOutdated ? /* @__PURE__ */ react.createElement(ComponentsUpdateNotification, null) : /* @__PURE__ */ react.createElement(ComponentsProNotification, null)));
888		- };
889		- var Components = () => {
890		- return /* @__PURE__ */ react.createElement(_elementor_editor_ui.ThemeProvider, null, /* @__PURE__ */ react.createElement(SearchProvider, { localStorageKey: "elementor-components-search" }, /* @__PURE__ */ react.createElement(ComponentsContent, null)));
891		- };
892		-
893		-//#endregion
894		-//#region packages/packages/core/editor-components/src/components/detach-instance-confirmation-dialog.tsx
895		- function DetachInstanceConfirmationDialog({ open, onClose, onConfirm }) {
896		- return /* @__PURE__ */ react.createElement(_elementor_editor_ui.ConfirmationDialog, {
897		- open,
898		- onClose
899		- }, /* @__PURE__ */ react.createElement(_elementor_editor_ui.ConfirmationDialog.Title, {
900		- icon: _elementor_icons.AlertTriangleFilledIcon,
901		- iconColor: "secondary"
902		- }, (0, _wordpress_i18n.__)("Detach from Component?", "elementor")), /* @__PURE__ */ react.createElement(_elementor_editor_ui.ConfirmationDialog.Content, null, /* @__PURE__ */ react.createElement(_elementor_editor_ui.ConfirmationDialog.ContentText, null, (0, _wordpress_i18n.__)("Detaching this instance will break its link to the Component. Changes to the Component will no longer apply. Continue?", "elementor"))), /* @__PURE__ */ react.createElement(_elementor_editor_ui.ConfirmationDialog.Actions, {
903		- onClose,
904		- onConfirm,
905		- confirmLabel: (0, _wordpress_i18n.__)("Detach", "elementor"),
906		- color: "primary"
907		- }));
908		- }
909		- function openDetachConfirmDialog(onConfirm) {
910		- const handleConfirm = () => {
911		- (0, _elementor_editor_ui.closeDialog)();
912		- onConfirm();
913		- };
914		- (0, _elementor_editor_ui.openDialog)({ component: /* @__PURE__ */ react.createElement(DetachInstanceConfirmationDialog, {
915		- open: true,
916		- onClose: _elementor_editor_ui.closeDialog,
917		- onConfirm: handleConfirm
918		- }) });
919		- }
920		-
921		-//#endregion
922		-//#region packages/packages/core/editor-components/src/components/in-edit-mode.tsx
923		- var openEditModeDialog = (lockedBy) => {
924		- (0, _elementor_editor_ui.openDialog)({ component: /* @__PURE__ */ react.createElement(EditModeDialog, { lockedBy }) });
925		- };
926		- var EditModeDialog = ({ lockedBy }) => {
927		- const content = (0, _wordpress_i18n.__)("%s is currently editing this document", "elementor").replace("%s", lockedBy);
928		- return /* @__PURE__ */ react.createElement(react.Fragment, null, /* @__PURE__ */ react.createElement(_elementor_ui.DialogHeader, { logo: false }, /* @__PURE__ */ react.createElement(_elementor_ui.Box, {
929		- display: "flex",
930		- alignItems: "center",
931		- gap: 1
932		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Icon, { color: "secondary" }, /* @__PURE__ */ react.createElement(_elementor_icons.InfoCircleFilledIcon, { fontSize: "medium" })), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, { variant: "subtitle1" }, content))), /* @__PURE__ */ react.createElement(_elementor_ui.DialogContent, null, /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
933		- spacing: 2,
934		- direction: "column"
935		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Typography, { variant: "body2" }, (0, _wordpress_i18n.__)("You can wait for them to finish or reach out to coordinate your changes together.", "elementor")), /* @__PURE__ */ react.createElement(_elementor_ui.DialogActions, null, /* @__PURE__ */ react.createElement(_elementor_ui.Button, {
936		- color: "secondary",
937		- variant: "contained",
938		- onClick: _elementor_editor_ui.closeDialog
939		- }, (0, _wordpress_i18n.__)("Close", "elementor"))))));
940		- };
941		-
942		-//#endregion
943		-//#region packages/packages/core/editor-components/src/provider/component-instance-context.tsx
944		- var ComponentInstanceContext = (0, react.createContext)(null);
945		- function ComponentInstanceProvider({ children, ...props }) {
946		- return /* @__PURE__ */ react.createElement(ComponentInstanceContext.Provider, { value: props }, children);
947		- }
948		- function useComponentInstanceContext() {
949		- const context = (0, react.useContext)(ComponentInstanceContext);
950		- if (!context) throw new Error("useComponentInstanceContext must be used within a ComponentInstanceProvider");
951		- return context;
952		- }
953		- var useComponentId = () => useComponentInstanceContext().componentId;
954		- var useComponentInstanceOverrides = () => useComponentInstanceContext().overrides;
955		- var useComponentOverridableProps = () => useComponentInstanceContext().overridableProps;
956		-
957		-//#endregion
958		-//#region packages/packages/core/editor-components/src/prop-types/component-instance-override-prop-type.ts
959		- var componentInstanceOverridePropTypeUtil = (0, _elementor_editor_props.createPropUtils)("override", _elementor_schema.z.object({
960		- override_key: _elementor_schema.z.string(),
961		- override_value: _elementor_schema.z.unknown(),
962		- schema_source: _elementor_schema.z.object({
963		- type: _elementor_schema.z.literal("component"),
964		- id: _elementor_schema.z.number()
965		- })
966		- }));
967		-
968		-//#endregion
969		-//#region packages/packages/core/editor-components/src/prop-types/component-overridable-prop-type.ts
970		- var componentOverridablePropTypeUtil = (0, _elementor_editor_props.createPropUtils)("overridable", _elementor_schema.z.object({
971		- override_key: _elementor_schema.z.string(),
972		- origin_value: _elementor_schema.z.object({
973		- $$type: _elementor_schema.z.string(),
974		- value: _elementor_schema.z.unknown()
975		- }).nullable()
976		- }));
977		-
978		-//#endregion
979		-//#region packages/packages/core/editor-components/src/prop-types/component-instance-overrides-prop-type.ts
980		- var componentInstanceOverridesPropTypeUtil = (0, _elementor_editor_props.createPropUtils)("overrides", _elementor_schema.z.array(_elementor_schema.z.union([componentInstanceOverridePropTypeUtil.schema, componentOverridablePropTypeUtil.schema])).optional().default([]));
981		-
982		-//#endregion
983		-//#region packages/packages/core/editor-components/src/prop-types/component-instance-prop-type.ts
984		- var componentInstancePropTypeUtil = (0, _elementor_editor_props.createPropUtils)("component-instance", _elementor_schema.z.object({
985		- component_id: _elementor_editor_props.numberPropTypeUtil.schema,
986		- overrides: _elementor_schema.z.optional(componentInstanceOverridesPropTypeUtil.schema)
987		- }));
988		-
989		-//#endregion
990		-//#region packages/packages/core/editor-components/src/utils/tracking.ts
991		- var FEATURE_NAME = "Components";
992		- var trackComponentEvent = ({ action, source, executedBy, ...data }) => {
993		- if (source === "system" || executedBy === "system") return;
994		- const { dispatchEvent, config } = (0, _elementor_events.getMixpanel)();
995		- if (!config?.names?.components?.[action]) return;
996		- const name = config.names.components[action];
997		- dispatchEvent?.(name, {
998		- ...data,
999		- executed_by: executedBy ?? source,
1000		- "Feature name": FEATURE_NAME
1001		- });
1002		- };
1003		- var onElementDrop = (_args, element) => {
1004		- if (!(element?.model?.get("widgetType") === "e-component")) return;
1005		- const editorSettings = element.model.get("editor_settings");
1006		- const componentName = editorSettings?.title;
1007		- const componentUID = editorSettings?.component_uid;
1008		- const instanceId = element.id;
1009		- const createdThisSession = selectCreatedThisSession((0, _elementor_store.__getState)());
1010		- const isSameSessionReuse = componentUID && createdThisSession.includes(componentUID);
1011		- const { locations, secondaryLocations } = window.elementorCommon.eventsManager.config;
1012		- trackComponentEvent({
1013		- action: "instanceAdded",
1014		- executedBy: "user",
1015		- instance_id: instanceId,
1016		- component_uid: componentUID,
1017		- component_name: componentName,
1018		- is_same_session_reuse: isSameSessionReuse,
1019		- location: locations.widgetPanel,
1020		- secondary_location: secondaryLocations.componentsTab
1021		- });
1022		- };
1023		-
1024		-//#endregion
1025		-//#region packages/packages/core/editor-components/src/utils/detach-component-instance/regenerate-local-style-ids.ts
1026		- function regenerateLocalStyleIds(element) {
1027		- const originalStyles = element.styles;
1028		- if (!originalStyles || Object.keys(originalStyles).length === 0) return {
1029		- styles: void 0,
1030		- settings: void 0
1031		- };
1032		- const newStyles = {};
1033		- const styleIdMapping = {};
1034		- for (const [originalStyleId, style] of Object.entries(originalStyles)) {
1035		- const newStyleId = generateLocalStyleId(element.id);
1036		- newStyles[newStyleId] = {
1037		- ...style,
1038		- id: newStyleId
1039		- };
1040		- styleIdMapping[originalStyleId] = newStyleId;
1041		- }
1042		- const settings = element.settings;
1043		- if (!settings || Object.keys(settings).length === 0) return {
1044		- styles: newStyles,
1045		- settings: void 0
1046		- };
1047		- const updatedSettings = { ...settings };
1048		- for (const [propKey, propValue] of Object.entries(updatedSettings)) if (isClassesProp(propValue) && propValue.value.length > 0) {
1049		- const updatedClasses = propValue.value.map((classId) => styleIdMapping[classId] ?? classId);
1050		- updatedSettings[propKey] = _elementor_editor_props.classesPropTypeUtil.create(updatedClasses);
1051		- }
1052		- return {
1053		- styles: newStyles,
1054		- settings: updatedSettings
1055		- };
1056		- }
1057		- function isClassesProp(prop) {
1058		- return _elementor_editor_props.classesPropTypeUtil.isValid(prop);
1059		- }
1060		- function generateLocalStyleId(elementId) {
1061		- return `e-${elementId}-${(0, _elementor_editor_elements.generateElementId)()}`;
1062		- }
1063		-
1064		-//#endregion
1065		-//#region packages/packages/core/editor-components/src/consts.ts
1066		- var COMPONENT_WIDGET_TYPE$1 = "e-component";
1067		-
1068		-//#endregion
1069		-//#region packages/packages/core/editor-components/src/utils/is-component-instance.ts
1070		- function isComponentInstance(elementModel) {
1071		- return [elementModel.widgetType, elementModel.elType].includes(COMPONENT_WIDGET_TYPE$1);
1072		- }
1073		-
1074		-//#endregion
1075		-//#region packages/packages/core/editor-components/src/utils/detach-component-instance/resolve-overridable-settings.ts
1076		- function resolveOverridableSettings(element, overrideMap) {
1077		- if (isComponentInstance({
1078		- widgetType: element.widgetType,
1079		- elType: element.elType
1080		- })) return resolveOverridableSettingsForComponentInstance(element, overrideMap);
1081		- return resolveOverridableSettingsForElement(element, overrideMap);
1082		- }
1083		- function resolveOverridableSettingsForElement(element, overrideMap) {
1084		- const updatedSettings = element.settings ? { ...element.settings } : {};
1085		- for (const [settingKey, settingValue] of Object.entries(element.settings ?? {})) updatedSettings[settingKey] = resolvePropValue(settingValue, overrideMap);
1086		- return updatedSettings;
1087		- }
1088		- function resolveOverridableSettingsForComponentInstance(element, overrideMap) {
1089		- const componentInstance = element.settings?.component_instance;
1090		- if (!componentInstancePropTypeUtil.isValid(componentInstance)) return element.settings ?? {};
1091		- const instanceOverrides = componentInstance.value.overrides?.value;
1092		- if (!instanceOverrides?.length) return element.settings ?? {};
1093		- const updatedOverrides = instanceOverrides.map((item) => resolvePropValue(item, overrideMap, { isOverridableOverride: true }));
1094		- return {
1095		- ...element.settings,
1096		- component_instance: {
1097		- ...componentInstance,
1098		- value: {
1099		- ...componentInstance.value,
1100		- overrides: {
1101		- ...componentInstance.value.overrides,
1102		- value: updatedOverrides
1103		- }
1104		- }
1105		- }
1106		- };
1107		- }
1108		- function resolvePropValue(propValue, overrideMap, options) {
1109		- const { isOverridableOverride = false } = options ?? {};
1110		- if (!componentOverridablePropTypeUtil.isValid(propValue)) return propValue;
1111		- const overridableKey = propValue.value.override_key;
1112		- const matchingOverride = overrideMap.get(overridableKey);
1113		- const originValue = componentOverridablePropTypeUtil.extract(propValue)?.origin_value;
1114		- if (!matchingOverride) return originValue;
1115		- if (isOverridableOverride) return resolveOverridableOverride(matchingOverride, originValue);
1116		- return componentInstanceOverridePropTypeUtil.extract(matchingOverride)?.override_value ?? originValue;
1117		- }
1118		- function resolveOverridableOverride(matchingOverride, originValue) {
1119		- if (!originValue || !componentInstanceOverridePropTypeUtil.isValid(originValue)) return null;
1120		- return componentInstanceOverridePropTypeUtil.create({
1121		- override_value: matchingOverride.value.override_value,
1122		- override_key: originValue.value.override_key,
1123		- schema_source: originValue.value.schema_source
1124		- });
1125		- }
1126		-
1127		-//#endregion
1128		-//#region packages/packages/core/editor-components/src/utils/detach-component-instance/resolve-detached-instance.ts
1129		- function resolveDetachedInstance(element, overrides) {
1130		- const overrideMap = createOverrideMap(overrides);
1131		- return resolveElementRecursive(structuredClone(element), overrideMap);
1132		- }
1133		- function resolveElementRecursive(element, overrideMap) {
1134		- element.id = (0, _elementor_editor_elements.generateElementId)();
1135		- if (element.styles) {
1136		- const { styles, settings } = regenerateLocalStyleIds(element);
1137		- element.styles = styles;
1138		- if (settings) element.settings = {
1139		- ...element.settings,
1140		- ...settings
1141		- };
1142		- }
1143		- if (element.settings) element.settings = resolveOverridableSettings(element, overrideMap);
1144		- if (element.elements?.length) element.elements = element.elements.map((child) => resolveElementRecursive(child, overrideMap));
1145		- return element;
1146		- }
1147		- function createOverrideMap(overrides) {
1148		- const map = /* @__PURE__ */ new Map();
1149		- overrides.forEach((item) => {
1150		- let override = null;
1151		- if (componentInstanceOverridePropTypeUtil.isValid(item)) override = item;
1152		- else if (componentOverridablePropTypeUtil.isValid(item)) override = getOverridableOverride(item);
1153		- if (override) {
1154		- const overrideKey = override.value.override_key;
1155		- map.set(overrideKey, override);
1156		- }
1157		- });
1158		- return map;
1159		- }
1160		- function getOverridableOverride(propValue) {
1161		- if (!componentOverridablePropTypeUtil.isValid(propValue)) return null;
1162		- const originValue = componentOverridablePropTypeUtil.extract(propValue)?.origin_value;
1163		- if (!componentInstanceOverridePropTypeUtil.isValid(originValue)) return null;
1164		- return originValue;
1165		- }
1166		-
1167		-//#endregion
1168		-//#region packages/packages/core/editor-components/src/utils/detach-component-instance/detach-component-instance.ts
1169		- var DETACH_EVENT = "elementor/components/detach-instance";
1170		- var DETACH_UNDO_EVENT = "elementor/components/undo-detach-instance";
1171		- var DETACH_REDO_EVENT = "elementor/components/redo-detach-instance";
1172		- async function detachComponentInstance({ instanceId, componentId, trackingInfo }) {
1173		- const instanceContainer = (0, _elementor_editor_elements.getContainer)(instanceId);
1174		- if (!instanceContainer) throw new Error(`Instance container with ID "${instanceId}" not found.`);
1175		- const componentData = await getComponentDocumentData(componentId);
1176		- if (!componentData) throw new Error(`Component with ID "${componentId}" not found.`);
1177		- const rootElement = componentData.elements?.[0];
1178		- if (!rootElement) throw new Error(`Component with ID "${componentId}" has no root element.`);
1179		- return (0, _elementor_editor_v1_adapters.undoable)({
1180		- do: () => {
1181		- const overrides = extractInstanceOverrides(instanceContainer);
1182		- const detachedInstanceElementData = resolveDetachedInstance(rootElement, overrides);
1183		- const originalInstanceModel = instanceContainer.model.toJSON();
1184		- const actionId = (/* @__PURE__ */ new Date()).getTime();
1185		- window.dispatchEvent(new CustomEvent(DETACH_EVENT, { detail: {
1186		- detachedInstanceId: instanceId,
1187		- detachActionId: actionId
1188		- } }));
1189		- const detachedElement = (0, _elementor_editor_elements.replaceElement)({
1190		- currentElementId: instanceId,
1191		- newElement: detachedInstanceElementData,
1192		- withHistory: false
1193		- });
1194		- (0, _elementor_editor_elements.selectElement)(detachedElement.id);
1195		- const componentUid = selectComponent((0, _elementor_store.__getState)(), componentId)?.uid;
1196		- trackComponentEvent({
1197		- action: "detached",
1198		- executedBy: "user",
1199		- component_uid: componentUid,
1200		- instance_id: instanceId,
1201		- location: trackingInfo.location,
1202		- secondary_location: trackingInfo.secondaryLocation,
1203		- trigger: trackingInfo.trigger
1204		- });
1205		- return {
1206		- detachedElement,
1207		- detachedInstanceElementData,
1208		- originalInstanceModel,
1209		- actionId
1210		- };
1211		- },
1212		- undo: (_, { detachedElement, originalInstanceModel, actionId }) => {
1213		- const restoredInstance = (0, _elementor_editor_elements.replaceElement)({
1214		- currentElementId: detachedElement.id,
1215		- newElement: originalInstanceModel,
1216		- withHistory: false
1217		- });
1218		- window.dispatchEvent(new CustomEvent(DETACH_UNDO_EVENT, { detail: {
1219		- restoredInstanceId: restoredInstance.id,
1220		- detachActionId: actionId
1221		- } }));
1222		- (0, _elementor_editor_canvas.doAfterRender)([restoredInstance.id], () => {
1223		- (0, _elementor_editor_elements.selectElement)(restoredInstance.id);
1224		- });
1225		- return restoredInstance;
1226		- },
1227		- redo: (_, doReturn, restoredInstance) => {
1228		- const { detachedInstanceElementData, actionId } = doReturn;
1229		- const detachedElement = (0, _elementor_editor_elements.replaceElement)({
1230		- currentElementId: restoredInstance.id,
1231		- newElement: detachedInstanceElementData,
1232		- withHistory: false
1233		- });
1234		- window.dispatchEvent(new CustomEvent(DETACH_REDO_EVENT, { detail: {
1235		- detachedInstanceId: detachedElement.id,
1236		- detachActionId: actionId
1237		- } }));
1238		- (0, _elementor_editor_elements.selectElement)(detachedElement.id);
1239		- return {
1240		- ...doReturn,
1241		- detachedElement
1242		- };
1243		- }
1244		- }, {
1245		- title: (0, _wordpress_i18n.__)("Detach from Component", "elementor"),
1246		- subtitle: (0, _wordpress_i18n.__)("Instance detached", "elementor")
1247		- })();
1248		- }
1249		- function extractInstanceOverrides(instanceContainer) {
1250		- const settings = instanceContainer.model.toJSON().settings;
1251		- const componentInstance = componentInstancePropTypeUtil.extract(settings?.component_instance);
1252		- return componentInstanceOverridesPropTypeUtil.extract(componentInstance?.overrides) ?? [];
1253		- }
1254		-
1255		-//#endregion
1256		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/instance-panel-header.tsx
1257		- function InstancePanelHeader({ componentName, actions }) {
1258		- return /* @__PURE__ */ react.createElement(_elementor_editor_panels.PanelHeader, { sx: {
1259		- justifyContent: "start",
1260		- px: 2
1261		- } }, /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
1262		- direction: "row",
1263		- alignItems: "center",
1264		- flexGrow: 1,
1265		- gap: 1,
1266		- maxWidth: "100%"
1267		- }, /* @__PURE__ */ react.createElement(_elementor_icons.ComponentsIcon, {
1268		- fontSize: "small",
1269		- sx: { color: "text.tertiary" }
1270		- }), /* @__PURE__ */ react.createElement(_elementor_editor_ui.EllipsisWithTooltip, {
1271		- title: componentName,
1272		- as: _elementor_editor_panels.PanelHeaderTitle,
1273		- sx: { flexGrow: 1 }
1274		- }), actions));
1275		- }
1276		- function EditComponentAction({ label, onClick, disabled = false, icon: Icon }) {
1277		- return /* @__PURE__ */ react.createElement(_elementor_ui.Tooltip, { title: label }, /* @__PURE__ */ react.createElement(_elementor_ui.IconButton, {
1278		- size: "tiny",
1279		- onClick,
1280		- "aria-label": label,
1281		- disabled
1282		- }, /* @__PURE__ */ react.createElement(Icon, { fontSize: "tiny" })));
1283		- }
1284		-
1285		-//#endregion
1286		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/detach-action.tsx
1287		- var DetachAction = ({ componentInstanceId, componentId }) => {
1288		- const [isDetachDialogOpen, setIsDetachDialogOpen] = (0, react.useState)(false);
1289		- const handleDetachConfirm = async () => {
1290		- setIsDetachDialogOpen(false);
1291		- try {
1292		- await detachComponentInstance({
1293		- instanceId: componentInstanceId,
1294		- componentId,
1295		- trackingInfo: getDetachTrackingInfo()
1296		- });
1297		- } catch {
1298		- (0, _elementor_editor_notifications.notify)({
1299		- type: "error",
1300		- message: (0, _wordpress_i18n.__)("Failed to detach component instance.", "elementor"),
1301		- id: "detach-component-instance-failed"
1302		- });
1303		- }
1304		- };
1305		- const handleDetachCancel = () => {
1306		- setIsDetachDialogOpen(false);
1307		- };
1308		- const handleDetachClick = () => {
1309		- setIsDetachDialogOpen(true);
1310		- };
1311		- const detachLabel = (0, _wordpress_i18n.__)("Detach from Component", "elementor");
1312		- return /* @__PURE__ */ react.createElement(react.Fragment, null, /* @__PURE__ */ react.createElement(EditComponentAction, {
1313		- label: detachLabel,
1314		- icon: _elementor_icons.DetachIcon,
1315		- onClick: handleDetachClick
1316		- }), /* @__PURE__ */ react.createElement(DetachInstanceConfirmationDialog, {
1317		- open: isDetachDialogOpen,
1318		- onClose: handleDetachCancel,
1319		- onConfirm: handleDetachConfirm
1320		- }));
1321		- };
1322		- function getDetachTrackingInfo() {
1323		- const config = window?.elementorCommon?.eventsManager?.config;
1324		- if (!config) return {
1325		- location: "",
1326		- trigger: ""
1327		- };
1328		- return {
1329		- location: config.locations.components.instanceEditingPanel,
1330		- trigger: config.triggers.click
1331		- };
1332		- }
1333		-
1334		-//#endregion
1335		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/empty-state.tsx
1336		- var EmptyState = ({ onEditComponent }) => {
1337		- const { canEdit } = useComponentsPermissions();
1338		- const message = canEdit ? (0, _wordpress_i18n.__)("Edit the component to add properties, manage them or update the design across all instances.", "elementor") : (0, _wordpress_i18n.__)("With your current role, you cannot edit this component. Contact an administrator to add properties.", "elementor");
1339		- return /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
1340		- alignItems: "center",
1341		- justifyContent: "start",
1342		- height: "100%",
1343		- color: "text.secondary",
1344		- sx: {
1345		- p: 2.5,
1346		- pt: 8,
1347		- pb: 5.5,
1348		- mt: 1
1349		- },
1350		- gap: 1.5
1351		- }, /* @__PURE__ */ react.createElement(_elementor_icons.ComponentPropListIcon, { fontSize: "large" }), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
1352		- align: "center",
1353		- variant: "subtitle2"
1354		- }, (0, _wordpress_i18n.__)("No properties yet", "elementor")), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
1355		- align: "center",
1356		- variant: "caption",
1357		- maxWidth: "170px"
1358		- }, message), canEdit && /* @__PURE__ */ react.createElement(_elementor_ui.Button, {
1359		- variant: "outlined",
1360		- color: "secondary",
1361		- size: "small",
1362		- sx: { mt: 1 },
1363		- disabled: !onEditComponent,
1364		- onClick: onEditComponent
1365		- }, /* @__PURE__ */ react.createElement(_elementor_icons.PencilIcon, { fontSize: "small" }), (0, _wordpress_i18n.__)("Edit component", "elementor")));
1366		- };
1367		-
1368		-//#endregion
1369		-//#region packages/packages/core/editor-components/src/hooks/use-controls-by-widget-type.ts
1370		- function useControlsByWidgetType(type) {
1371		- const elementType = (0, _elementor_editor_elements.getElementType)(type);
1372		- if (!elementType) return {};
1373		- return getControlsByBind(iterateControls(elementType.controls));
1374		- }
1375		- function iterateControls(controls) {
1376		- return controls.map((control) => {
1377		- if (control.type === "control" && "bind" in control.value) return control;
1378		- if (control.type === "section") return iterateControls(control.value.items);
1379		- return null;
1380		- }).filter(Boolean).flat();
1381		- }
1382		- function getControlsByBind(controls) {
1383		- return controls.reduce((controlsByBind, control) => ({
1384		- ...controlsByBind,
1385		- [control.value.bind]: control
1386		- }), {});
1387		- }
1388		-
1389		-//#endregion
1390		-//#region packages/packages/core/editor-components/src/provider/overridable-prop-context.tsx
1391		- var OverridablePropContext = (0, react.createContext)(null);
1392		- function OverridablePropProvider({ children, ...props }) {
1393		- return /* @__PURE__ */ react.createElement(OverridablePropContext.Provider, { value: props }, children);
1394		- }
1395		- var useOverridablePropValue = () => (0, react.useContext)(OverridablePropContext)?.value;
1396		- var useComponentInstanceElement = () => (0, react.useContext)(OverridablePropContext)?.componentInstanceElement;
1397		-
1398		-//#endregion
1399		-//#region packages/packages/core/editor-components/src/utils/resolve-override-prop-value.ts
1400		- var resolveOverridePropValue = (originalPropValue) => {
1401		- if (componentOverridablePropTypeUtil.isValid(originalPropValue)) return getOverridableValue(originalPropValue);
1402		- if (componentInstanceOverridePropTypeUtil.isValid(originalPropValue)) return getOverrideValue(originalPropValue);
1403		- return originalPropValue;
1404		- };
1405		- function getOverridableValue(overridableProp) {
1406		- const overridableValue = componentOverridablePropTypeUtil.extract(overridableProp);
1407		- if (!overridableValue) return null;
1408		- if (componentInstanceOverridePropTypeUtil.isValid(overridableValue.origin_value)) return getOverrideValue(overridableValue.origin_value);
1409		- return overridableValue.origin_value;
1410		- }
1411		- function getOverrideValue(overrideProp) {
1412		- const overrideValue = componentInstanceOverridePropTypeUtil.extract(overrideProp);
1413		- if (!overrideValue) return null;
1414		- return overrideValue.override_value;
1415		- }
1416		-
1417		-//#endregion
1418		-//#region packages/packages/core/editor-components/src/store/dispatchers.ts
1419		- function safeDispatch() {
1420		- return (0, _elementor_store.__getStore)()?.dispatch;
1421		- }
1422		- var componentsActions = {
1423		- add(components) {
1424		- (0, _elementor_store.__dispatch)(slice.actions.add(components));
1425		- },
1426		- load(components) {
1427		- (0, _elementor_store.__dispatch)(slice.actions.load(components));
1428		- },
1429		- addUnpublished(component) {
1430		- (0, _elementor_store.__dispatch)(slice.actions.addUnpublished(component));
1431		- },
1432		- removeUnpublished(uids) {
1433		- (0, _elementor_store.__dispatch)(slice.actions.removeUnpublished(uids));
1434		- },
1435		- resetUnpublished() {
1436		- (0, _elementor_store.__dispatch)(slice.actions.resetUnpublished());
1437		- },
1438		- addCreatedThisSession(uid) {
1439		- (0, _elementor_store.__dispatch)(slice.actions.addCreatedThisSession(uid));
1440		- },
1441		- removeCreatedThisSession(uid) {
1442		- (0, _elementor_store.__dispatch)(slice.actions.removeCreatedThisSession(uid));
1443		- },
1444		- archive(componentId) {
1445		- (0, _elementor_store.__dispatch)(slice.actions.archive(componentId));
1446		- },
1447		- setCurrentComponentId(id) {
1448		- safeDispatch()?.(slice.actions.setCurrentComponentId(id));
1449		- },
1450		- setPath(path) {
1451		- safeDispatch()?.(slice.actions.setPath(path));
1452		- },
1453		- setOverridableProps(componentId, overridableProps) {
1454		- (0, _elementor_store.__dispatch)(slice.actions.setOverridableProps({
1455		- componentId,
1456		- overridableProps
1457		- }));
1458		- },
1459		- rename(componentUid, name) {
1460		- (0, _elementor_store.__dispatch)(slice.actions.rename({
1461		- componentUid,
1462		- name
1463		- }));
1464		- },
1465		- cleanUpdatedComponentNames() {
1466		- (0, _elementor_store.__dispatch)(slice.actions.cleanUpdatedComponentNames());
1467		- },
1468		- updateComponentSanitizedAttribute(componentId, attribute) {
1469		- (0, _elementor_store.__dispatch)(slice.actions.updateComponentSanitizedAttribute({
1470		- componentId,
1471		- attribute
1472		- }));
1473		- },
1474		- resetSanitizedComponents() {
1475		- (0, _elementor_store.__dispatch)(slice.actions.resetSanitizedComponents());
1476		- }
1477		- };
1478		-
1479		-//#endregion
1480		-//#region packages/packages/core/editor-components/src/store/selectors.ts
1481		- function safeGetState() {
1482		- return (0, _elementor_store.__getStore)()?.getState();
1483		- }
1484		- var componentsSelectors = {
1485		- getOverridableProps(componentId) {
1486		- return selectOverridableProps((0, _elementor_store.__getState)(), componentId);
1487		- },
1488		- getCurrentComponent() {
1489		- return selectCurrentComponent((0, _elementor_store.__getState)());
1490		- },
1491		- getCurrentComponentId() {
1492		- const state = safeGetState();
1493		- if (!state) return null;
1494		- return selectCurrentComponentId(state);
1495		- },
1496		- getUnpublishedComponents() {
1497		- return selectUnpublishedComponents((0, _elementor_store.__getState)());
1498		- },
1499		- getUpdatedComponentNames() {
1500		- return selectUpdatedComponentNames((0, _elementor_store.__getState)());
1501		- },
1502		- getArchivedThisSession() {
1503		- return selectArchivedThisSession((0, _elementor_store.__getState)());
1504		- },
1505		- getCreatedThisSession() {
1506		- return selectCreatedThisSession((0, _elementor_store.__getState)());
1507		- },
1508		- getComponents() {
1509		- return selectComponents((0, _elementor_store.__getState)());
1510		- },
1511		- getComponentByUid(componentUid) {
1512		- return selectComponentByUid((0, _elementor_store.__getState)(), componentUid);
1513		- }
1514		- };
1515		-
1516		-//#endregion
1517		-//#region packages/packages/core/editor-components/src/store/actions/update-overridable-prop.ts
1518		- function updateOverridableProp(componentId, propValue, originPropFields) {
1519		- const overridableProps = componentsSelectors.getOverridableProps(componentId);
1520		- if (!overridableProps) return;
1521		- const existingOverridableProp = overridableProps.props[propValue.override_key];
1522		- if (!existingOverridableProp) return;
1523		- const originValue = resolveOverridePropValue(propValue.origin_value);
1524		- const newOverridableProp = originPropFields ? {
1525		- originValue,
1526		- originPropFields
1527		- } : { originValue };
1528		- const newOverridableProps = {
1529		- ...overridableProps,
1530		- props: {
1531		- ...overridableProps.props,
1532		- [existingOverridableProp.overrideKey]: {
1533		- ...existingOverridableProp,
1534		- ...newOverridableProp
1535		- }
1536		- }
1537		- };
1538		- componentsActions.setOverridableProps(componentId, newOverridableProps);
1539		- }
1540		-
1541		-//#endregion
1542		-//#region packages/packages/core/editor-components/src/utils/get-prop-type-for-component-override.ts
1543		- var getPropTypeForComponentOverride = (overridableProp) => {
1544		- if (overridableProp.originPropFields) return getPropType(overridableProp.originPropFields);
1545		- const { widgetType, propKey } = overridableProp;
1546		- return getPropType({
1547		- widgetType,
1548		- propKey
1549		- });
1550		- };
1551		- function getPropType({ widgetType, propKey }) {
1552		- return ((0, _elementor_editor_elements.getWidgetsCache)()?.[widgetType]?.atomic_props_schema)?.[propKey];
1553		- }
1554		-
1555		-//#endregion
1556		-//#region packages/packages/core/editor-components/src/utils/overridable-props-utils.ts
1557		- function getMatchingOverride(overrides, overrideKey) {
1558		- return overrides?.find((override) => {
1559		- const overridableValue = componentOverridablePropTypeUtil.extract(override);
1560		- if (overridableValue) return componentInstanceOverridePropTypeUtil.extract(overridableValue.origin_value)?.override_key === overrideKey;
1561		- return override.value.override_key === overrideKey;
1562		- }) ?? null;
1563		- }
1564		-
1565		-//#endregion
1566		-//#region packages/packages/core/editor-components/src/components/control-label.tsx
1567		- var ControlLabel = ({ children, ...props }) => {
1568		- return /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
1569		- direction: "row",
1570		- alignItems: "center",
1571		- justifyItems: "start",
1572		- gap: .25
1573		- }, /* @__PURE__ */ react.createElement(_elementor_editor_controls.ControlFormLabel, { ...props }, children), /* @__PURE__ */ react.createElement(_elementor_editor_controls.ControlAdornments, null));
1574		- };
1575		-
1576		-//#endregion
1577		-//#region packages/packages/core/editor-components/src/components/errors.ts
1578		- var OverrideControlInnerElementNotFoundError = (0, _elementor_utils.createError)({
1579		- code: "override_control_inner_element_not_found",
1580		- message: `Component inner element not found for override control. The element may have been deleted without updating the overridable props, or the component has not finished rendering yet.`
1581		- });
1582		- var OverrideControlPropTypeNotFoundError = (0, _elementor_utils.createError)({
1583		- code: "override_control_prop_type_not_found",
1584		- message: "Prop type not found for override control."
1585		- });
1586		-
1587		-//#endregion
1588		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/utils/correct-exposed-empty-override.ts
1589		- function correctExposedEmptyOverride(newPropValue, matchingOverride) {
1590		- const newOverridableValue = componentOverridablePropTypeUtil.extract(newPropValue);
1591		- if (!(newOverridableValue && matchingOverride === null)) return newPropValue;
1592		- return componentOverridablePropTypeUtil.create({
1593		- override_key: newOverridableValue.override_key,
1594		- origin_value: null
1595		- });
1596		- }
1597		-
1598		-//#endregion
1599		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/utils/resolve-element-settings.ts
1600		- function applyOverridesToSettings(elementSettings, overrides) {
1601		- const result = {};
1602		- for (const [propKey, propValue] of Object.entries(elementSettings)) {
1603		- const overridable = componentOverridablePropTypeUtil.extract(propValue);
1604		- if (!overridable) {
1605		- result[propKey] = propValue;
1606		- continue;
1607		- }
1608		- const override = overrides[overridable.override_key];
1609		- if (!override) {
1610		- result[propKey] = propValue;
1611		- continue;
1612		- }
1613		- if (override.outermostKey && override.outermostKey !== overridable.override_key) {
1614		- const originValue = overridable.origin_value;
1615		- result[propKey] = componentOverridablePropTypeUtil.create({
1616		- override_key: override.outermostKey,
1617		- origin_value: override.value ?? originValue
1618		- });
1619		- } else result[propKey] = override.value ?? propValue;
1620		- }
1621		- return result;
1622		- }
1623		- function unwrapOverridableSettings(elementSettings) {
1624		- const result = {};
1625		- for (const [propKey, propValue] of Object.entries(elementSettings)) {
1626		- const overridable = componentOverridablePropTypeUtil.extract(propValue);
1627		- if (!overridable) {
1628		- result[propKey] = propValue;
1629		- continue;
1630		- }
1631		- result[propKey] = overridable.origin_value;
1632		- }
1633		- return result;
1634		- }
1635		-
1636		-//#endregion
1637		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/utils/use-override-dependencies.ts
1638		- function useOverrideControlDependencies({ existingOverride, resolvedElementSettings, elementId, elementType, propKey }) {
1639		- return (0, react.useMemo)(() => {
1640		- const { isDisabled, isHidden } = (0, _elementor_editor_editing_panel.extractDependencyEffect)(propKey, elementType.propsSchema, resolvedElementSettings);
1641		- const existingOverrideValue = existingOverride ? resolveOverridePropValue(existingOverride) : null;
1642		- const settingsForDepsNewValuesCalculation = {
1643		- ...resolvedElementSettings,
1644		- [propKey]: existingOverrideValue
1645		- };
1646		- const resolvedSettingsWithDefaults = (0, _elementor_editor_editing_panel.getElementSettingsWithDefaults)(elementType.propsSchema, settingsForDepsNewValuesCalculation);
1647		- const dependents = (0, _elementor_editor_editing_panel.extractOrderedDependencies)(elementType.dependenciesPerTargetMapping ?? {});
1648		- return {
1649		- overrideValue: (0, _elementor_editor_editing_panel.getUpdatedValues)({ [propKey]: existingOverrideValue }, dependents, elementType.propsSchema, resolvedSettingsWithDefaults, elementId)[propKey],
1650		- isDisabled,
1651		- isHidden
1652		- };
1653		- }, [
1654		- existingOverride,
1655		- resolvedElementSettings,
1656		- propKey,
1657		- elementType.propsSchema,
1658		- elementType.dependenciesPerTargetMapping,
1659		- elementId
1660		- ]);
1661		- }
1662		-
1663		-//#endregion
1664		-//#region packages/packages/core/editor-components/src/utils/get-container-by-origin-id.ts
1665		- function getContainerByOriginId(originElementId, instanceElementId) {
1666		- if (!instanceElementId) return (0, _elementor_editor_elements.getContainer)(originElementId);
1667		- const instanceContainer = (0, _elementor_editor_elements.getContainer)(instanceElementId);
1668		- if (!instanceContainer) return null;
1669		- return window.elementor?.getContainerByKeyValue?.({
1670		- key: "originId",
1671		- value: originElementId,
1672		- parent: instanceContainer.view
1673		- }) ?? null;
1674		- }
1675		-
1676		-//#endregion
1677		-//#region packages/packages/core/editor-components/src/utils/get-overridable-prop.ts
1678		- function getOverridableProp({ componentId, overrideKey }) {
1679		- const overridableProps = selectOverridableProps((0, _elementor_store.__getState)(), componentId);
1680		- if (!overridableProps) return;
1681		- return overridableProps.props[overrideKey];
1682		- }
1683		-
1684		-//#endregion
1685		-//#region packages/packages/core/editor-components/src/utils/resolve-overrides-chain.ts
1686		- function resolveOverridesChain({ outerOverridableProp, outerInstanceId, overridesMapping = {} }) {
1687		- if (!outerOverridableProp.originPropFields) {
1688		- const innerElement = getContainerByOriginId(outerOverridableProp.elementId, outerInstanceId);
1689		- if (!innerElement) throw new Error(`Inner element not found inside instance. elementId: ${outerOverridableProp.elementId}, instanceId: ${outerInstanceId}`);
1690		- return {
1691		- isChainBroken: false,
1692		- innerElement,
1693		- overridesMapping
1694		- };
1695		- }
1696		- const currentInstance = getContainerByOriginId(outerOverridableProp.elementId, outerInstanceId);
1697		- if (!currentInstance) return { isChainBroken: true };
1698		- const { componentId, overrides } = extractComponentInstanceSettings(currentInstance);
1699		- if (!componentId) throw new Error(`Component ID not found for current instance. currentInstanceId: ${currentInstance.id}. outerInstanceId: ${outerInstanceId}`);
1700		- const mergedOverrides = buildOverridesMap(overridesMapping, overrides ?? []);
1701		- const override = findOverrideByOuterKey(overrides, outerOverridableProp.overrideKey);
1702		- const overrideKey = componentInstanceOverridePropTypeUtil.extract(override)?.override_key;
1703		- if (!override || !overrideKey) return { isChainBroken: true };
1704		- const overridableProp = getOverridableProp({
1705		- componentId,
1706		- overrideKey
1707		- });
1708		- if (!overridableProp) throw new Error(`Overridable prop not found. componentId: ${componentId}, overrideKey: ${overrideKey}`);
1709		- return resolveOverridesChain({
1710		- outerOverridableProp: overridableProp,
1711		- outerInstanceId: currentInstance.id,
1712		- overridesMapping: mergedOverrides
1713		- });
1714		- }
1715		- function buildOverridesMap(existing, levelOverrides) {
1716		- const result = { ...existing };
1717		- for (const item of levelOverrides) {
1718		- const overridableValue = componentOverridablePropTypeUtil.extract(item);
1719		- if (overridableValue) {
1720		- const override = componentInstanceOverridePropTypeUtil.extract(overridableValue.origin_value);
1721		- if (!override) continue;
1722		- const outerKey = overridableValue.override_key;
1723		- const innerKey = override.override_key;
1724		- const innerValue = override.override_value;
1725		- const higherLevelOverride = existing[outerKey];
1726		- if (higherLevelOverride) {
1727		- result[innerKey] = {
1728		- value: higherLevelOverride.value ?? innerValue,
1729		- outermostKey: higherLevelOverride.outermostKey ?? outerKey
1730		- };
1731		- continue;
1732		- }
1733		- result[innerKey] = {
1734		- value: innerValue,
1735		- outermostKey: outerKey
1736		- };
1737		- } else {
1738		- const override = componentInstanceOverridePropTypeUtil.extract(item);
1739		- if (!override) continue;
1740		- const key = override.override_key;
1741		- result[key] = { value: override.override_value };
1742		- }
1743		- }
1744		- return result;
1745		- }
1746		- function extractComponentInstanceSettings(element) {
1747		- const instanceSetting = element.settings?.get("component_instance");
1748		- const instanceValue = componentInstancePropTypeUtil.extract(instanceSetting);
1749		- return {
1750		- componentId: instanceValue?.component_id?.value,
1751		- overrides: componentInstanceOverridesPropTypeUtil.extract(instanceValue?.overrides)
1752		- };
1753		- }
1754		- function findOverrideByOuterKey(overrides, outerKey) {
1755		- if (!overrides) return null;
1756		- const overridableOverride = overrides.find((item) => {
1757		- const overridableValue = componentOverridablePropTypeUtil.extract(item);
1758		- if (!overridableValue) return false;
1759		- return overridableValue.override_key === outerKey;
1760		- });
1761		- const override = componentOverridablePropTypeUtil.extract(overridableOverride)?.origin_value;
1762		- if (!override || !componentInstanceOverridePropTypeUtil.isValid(override)) return null;
1763		- return override;
1764		- }
1765		-
1766		-//#endregion
1767		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/utils/use-resolved-inner-element.ts
1768		- function useResolvedInnerElement(overridableProp) {
1769		- const componentInstanceElement = (0, _elementor_editor_editing_panel.useElement)();
1770		- const componentId = useComponentId();
1771		- const overrides = useComponentInstanceOverrides();
1772		- const { elementId: originElementId, widgetType, elType } = overridableProp.originPropFields ?? overridableProp;
1773		- const type = elType === "widget" ? widgetType : elType;
1774		- const elementType = (0, _elementor_editor_elements.getElementType)(type);
1775		- if (!elementType) throw new Error(`Element type not found for ${type}`);
1776		- const { elementId, overridesMapping } = (0, react.useMemo)(() => {
1777		- const overridesChainResult = resolveOverridesChain({
1778		- outerOverridableProp: overridableProp,
1779		- outerInstanceId: componentInstanceElement.element.id
1780		- });
1781		- if (overridesChainResult.isChainBroken) throw new OverrideControlInnerElementNotFoundError({ context: {
1782		- componentId,
1783		- elementId: originElementId
1784		- } });
1785		- return {
1786		- elementId: overridesChainResult.innerElement.id,
1787		- overridesMapping: overridesChainResult.overridesMapping
1788		- };
1789		- }, [
1790		- overridableProp,
1791		- componentInstanceElement.element.id,
1792		- componentId,
1793		- originElementId
1794		- ]);
1795		- const settingsWithInnerOverrides = (0, react.useMemo)(() => {
1796		- return applyOverridesToSettings((0, _elementor_editor_elements.getElementSettings)(elementId, Object.keys(elementType?.propsSchema ?? {})), overridesMapping);
1797		- }, [
1798		- elementId,
1799		- elementType?.propsSchema,
1800		- overridesMapping
1801		- ]);
1802		- return {
1803		- elementId,
1804		- elementType,
1805		- resolvedOriginValues: settingsWithInnerOverrides,
1806		- resolvedElementSettings: (0, react.useMemo)(() => {
1807		- return unwrapOverridableSettings(applyOverridesToSettings(settingsWithInnerOverrides, formatOverridesToApply(overrides)));
1808		- }, [settingsWithInnerOverrides, overrides])
1809		- };
1810		- }
1811		- function formatOverridesToApply(overrides) {
1812		- if (!overrides) return {};
1813		- const result = {};
1814		- for (const item of overrides) {
1815		- const overridable = componentOverridablePropTypeUtil.extract(item);
1816		- let override = item;
1817		- if (overridable) override = overridable.origin_value;
1818		- const extractedOverride = componentInstanceOverridePropTypeUtil.extract(override);
1819		- if (!extractedOverride) continue;
1820		- result[extractedOverride.override_key] = { value: extractedOverride.override_value };
1821		- }
1822		- return result;
1823		- }
1824		-
1825		-//#endregion
1826		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/override-prop-control.tsx
1827		- function OverridePropControl({ overrideKey }) {
1828		- const overridableProp = useComponentOverridableProps().props[overrideKey];
1829		- if (!overridableProp) return null;
1830		- return /* @__PURE__ */ react.createElement(_elementor_editor_editing_panel.SettingsField, {
1831		- bind: "component_instance",
1832		- propDisplayName: overridableProp.label
1833		- }, /* @__PURE__ */ react.createElement(OverrideControl, { overridableProp }));
1834		- }
1835		- function OverrideControl({ overridableProp }) {
1836		- const componentInstanceElement = (0, _elementor_editor_editing_panel.useElement)();
1837		- const { value: instanceValue, setValue: setInstanceValue } = (0, _elementor_editor_controls.useBoundProp)(componentInstancePropTypeUtil);
1838		- const wrappingComponentId = useCurrentComponentId();
1839		- const componentId = useComponentId();
1840		- const overridableProps = useComponentOverridableProps();
1841		- const overrides = useComponentInstanceOverrides();
1842		- const controls = useControlsByWidgetType(overridableProp.originPropFields?.widgetType ?? overridableProp.widgetType);
1843		- const controlReplacements = (0, _elementor_editor_controls.getControlReplacements)();
1844		- const matchingOverride = getMatchingOverride(overrides, overridableProp.overrideKey);
1845		- const { propKey } = overridableProp.originPropFields ?? overridableProp;
1846		- const propType = getPropTypeForComponentOverride(overridableProp);
1847		- if (!propType) throw new OverrideControlPropTypeNotFoundError({ context: { overridableProp } });
1848		- const { elementId, elementType, resolvedElementSettings, resolvedOriginValues } = useResolvedInnerElement(overridableProp);
1849		- const { overrideValue, isDisabled, isHidden } = useOverrideControlDependencies({
1850		- existingOverride: matchingOverride,
1851		- resolvedElementSettings,
1852		- elementType,
1853		- elementId,
1854		- propKey
1855		- });
1856		- if (isHidden) return null;
1857		- const { propValue, baseValue: resolvedBaseValue } = resolveOverrideValues(overrideValue, resolvedOriginValues, propKey);
1858		- const value = { [overridableProp.overrideKey]: propValue };
1859		- const baseValue = { [overridableProp.overrideKey]: resolvedBaseValue };
1860		- const { control, controlProps, layout } = getControlParams(controls, overridableProp.originPropFields ?? overridableProp, overridableProp.label);
1861		- const propTypeSchema = (0, _elementor_editor_editing_panel.createTopLevelObjectType)({ schema: { [overridableProp.overrideKey]: propType } });
1862		- const setValue = (newValue, options, meta) => {
1863		- let newPropValue = getTempNewValueForDynamicProp(propType, propValue, newValue[overridableProp.overrideKey]);
1864		- newPropValue = correctExposedEmptyOverride(newPropValue, matchingOverride);
1865		- const newOverrideValue = createOverrideValue({
1866		- matchingOverride,
1867		- overrideKey: overridableProp.overrideKey,
1868		- overrideValue: newPropValue,
1869		- componentId
1870		- });
1871		- let newOverrides = (overrides ?? []).filter((override) => isValidOverride(overridableProps, override)).map((override) => override === matchingOverride ? newOverrideValue : override);
1872		- if (!matchingOverride) newOverrides = [...newOverrides, newOverrideValue];
1873		- setInstanceValue({
1874		- ...instanceValue,
1875		- overrides: componentInstanceOverridesPropTypeUtil.create(newOverrides)
1876		- }, options, meta);
1877		- const overridableValue = componentOverridablePropTypeUtil.extract(newOverrideValue);
1878		- if (overridableValue && wrappingComponentId) {
1879		- if (overridableProp.originPropFields) {
1880		- updateOverridableProp(wrappingComponentId, overridableValue, overridableProp.originPropFields);
1881		- return;
1882		- }
1883		- const originPropFields = {
1884		- elType: overridableProp.elType,
1885		- widgetType: overridableProp.widgetType,
1886		- propKey: overridableProp.propKey,
1887		- elementId: overridableProp.elementId
1888		- };
1889		- updateOverridableProp(wrappingComponentId, overridableValue, originPropFields);
1890		- }
1891		- };
1892		- return /* @__PURE__ */ react.createElement(OverridablePropProvider, {
1893		- value: componentOverridablePropTypeUtil.extract(matchingOverride) ?? void 0,
1894		- componentInstanceElement
1895		- }, /* @__PURE__ */ react.createElement(_elementor_editor_editing_panel.ElementProvider, {
1896		- element: {
1897		- id: elementId,
1898		- type: elementType.key
1899		- },
1900		- elementType,
1901		- settings: resolvedElementSettings
1902		- }, /* @__PURE__ */ react.createElement(_elementor_editor_controls.PropProvider, {
1903		- propType: propTypeSchema,
1904		- value,
1905		- setValue,
1906		- baseValue,
1907		- isDisabled
1908		- }, /* @__PURE__ */ react.createElement(_elementor_editor_controls.PropKeyProvider, { bind: overridableProp.overrideKey }, /* @__PURE__ */ react.createElement(_elementor_editor_controls.ControlReplacementsProvider, { replacements: controlReplacements }, /* @__PURE__ */ react.createElement(_elementor_ui.Box, { mb: 1.5 }, /* @__PURE__ */ react.createElement(_elementor_editor_editing_panel.ControlTypeContainer, { layout }, layout !== "custom" && /* @__PURE__ */ react.createElement(ControlLabel, null, overridableProp.label), /* @__PURE__ */ react.createElement(OriginalControl, {
1909		- control,
1910		- controlProps
1911		- }))))))));
1912		- }
1913		- function resolveOverrideValues(overrideValue, resolvedOriginValues, propKey) {
1914		- const inheritedValue = unwrapOverridableSettings(resolvedOriginValues)[propKey] ?? null;
1915		- const isInheritedDynamic = (0, _elementor_editor_editing_panel.isDynamicPropValue)(inheritedValue);
1916		- return {
1917		- propValue: isInheritedDynamic && !overrideValue ? inheritedValue : overrideValue,
1918		- baseValue: overrideValue || isInheritedDynamic ? null : inheritedValue
1919		- };
1920		- }
1921		- function getTempNewValueForDynamicProp(propType, propValue, newPropValue) {
1922		- if (newPropValue === null && (0, _elementor_editor_editing_panel.isDynamicPropValue)(propValue)) return propType.default ?? null;
1923		- return newPropValue;
1924		- }
1925		- function createOverrideValue({ matchingOverride, overrideKey, overrideValue, componentId }) {
1926		- const overridableValue = componentOverridablePropTypeUtil.extract(matchingOverride);
1927		- const anyOverridable = componentOverridablePropTypeUtil.extract(overrideValue) ?? overridableValue;
1928		- if (anyOverridable) {
1929		- const innerOverride = componentInstanceOverridePropTypeUtil.create({
1930		- override_key: overrideKey,
1931		- override_value: resolveOverridePropValue(overrideValue),
1932		- schema_source: {
1933		- type: "component",
1934		- id: componentId
1935		- }
1936		- });
1937		- return componentOverridablePropTypeUtil.create({
1938		- override_key: anyOverridable.override_key,
1939		- origin_value: innerOverride
1940		- });
1941		- }
1942		- return componentInstanceOverridePropTypeUtil.create({
1943		- override_key: overrideKey,
1944		- override_value: overrideValue,
1945		- schema_source: {
1946		- type: "component",
1947		- id: componentId
1948		- }
1949		- });
1950		- }
1951		- function getControlParams(controls, originPropFields, label) {
1952		- const control = controls[originPropFields.propKey];
1953		- const { value } = control;
1954		- const layout = getControlLayout(control);
1955		- const controlProps = populateChildControlProps(value.props);
1956		- if (layout === "custom") controlProps.label = label ?? value.label;
1957		- return {
1958		- control,
1959		- controlProps,
1960		- layout
1961		- };
1962		- }
1963		- function OriginalControl({ control, controlProps }) {
1964		- const { value } = control;
1965		- return /* @__PURE__ */ react.createElement(_elementor_editor_editing_panel.BaseControl, {
1966		- type: value.type,
1967		- props: controlProps
1968		- });
1969		- }
1970		- function getControlLayout(control) {
1971		- return control.value.meta?.layout || _elementor_editor_editing_panel.controlsRegistry.getLayout(control.value.type);
1972		- }
1973		- function populateChildControlProps(props) {
1974		- if (props.childControlType) {
1975		- const childComponent = _elementor_editor_editing_panel.controlsRegistry.get(props.childControlType);
1976		- const childPropType = _elementor_editor_editing_panel.controlsRegistry.getPropTypeUtil(props.childControlType);
1977		- props = {
1978		- ...props,
1979		- childControlConfig: {
1980		- component: childComponent,
1981		- props: props.childControlProps || {},
1982		- propTypeUtil: childPropType
1983		- }
1984		- };
1985		- }
1986		- return props;
1987		- }
1988		- function isValidOverride(overridableProps, override) {
1989		- const overridableKey = componentOverridablePropTypeUtil.isValid(override) ? override.value.origin_value?.value.override_key : override.value.override_key;
1990		- return !!overridableProps.props[overridableKey];
1991		- }
1992		-
1993		-//#endregion
1994		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/override-props-group.tsx
1995		- function OverridePropsGroup({ group }) {
1996		- const [isOpen, setIsOpen] = (0, _elementor_editor_editing_panel.useStateByElement)(group.id, true);
1997		- const handleClick = () => {
1998		- setIsOpen(!isOpen);
1999		- };
2000		- const id = (0, react.useId)();
2001		- const labelId = `label-${id}`;
2002		- const contentId = `content-${id}`;
2003		- const title = group.label;
2004		- return /* @__PURE__ */ react.createElement(_elementor_ui.Box, { "aria-label": `${title} section` }, /* @__PURE__ */ react.createElement(_elementor_ui.ListItemButton, {
2005		- id: labelId,
2006		- "aria-controls": contentId,
2007		- "aria-label": `${title} section`,
2008		- onClick: handleClick,
2009		- p: 0,
2010		- sx: { "&:hover": { backgroundColor: "transparent" } }
2011		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
2012		- direction: "row",
2013		- alignItems: "center",
2014		- justifyItems: "start",
2015		- flexGrow: 1,
2016		- gap: .5
2017		- }, /* @__PURE__ */ react.createElement(_elementor_ui.ListItemText, {
2018		- secondary: title,
2019		- secondaryTypographyProps: {
2020		- color: "text.primary",
2021		- variant: "caption",
2022		- fontWeight: "bold"
2023		- },
2024		- sx: {
2025		- flexGrow: 0,
2026		- flexShrink: 1,
2027		- marginInlineEnd: 1
2028		- }
2029		- })), /* @__PURE__ */ react.createElement(_elementor_editor_ui.CollapseIcon, {
2030		- open: isOpen,
2031		- color: "secondary",
2032		- fontSize: "tiny"
2033		- })), /* @__PURE__ */ react.createElement(_elementor_ui.Collapse, {
2034		- id: contentId,
2035		- "aria-labelledby": labelId,
2036		- in: isOpen,
2037		- timeout: "auto"
2038		- }, /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
2039		- direction: "column",
2040		- gap: 1,
2041		- p: 2
2042		- }, group.props.map((overrideKey) => /* @__PURE__ */ react.createElement(OverridePropControl, {
2043		- key: overrideKey,
2044		- overrideKey
2045		- })))));
2046		- }
2047		-
2048		-//#endregion
2049		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/instance-panel-body.tsx
2050		- function InstancePanelBody({ groups, isEmpty, emptyState, componentInstanceId }) {
2051		- return /* @__PURE__ */ react.createElement(_elementor_editor_panels.PanelBody, null, /* @__PURE__ */ react.createElement(_elementor_editor_controls.ControlAdornmentsProvider, { items: (0, _elementor_editor_editing_panel.getFieldIndicators)("settings") }, isEmpty ? emptyState : /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
2052		- direction: "column",
2053		- alignItems: "stretch"
2054		- }, groups.map((group) => /* @__PURE__ */ react.createElement(react.Fragment, { key: group.id + componentInstanceId }, /* @__PURE__ */ react.createElement(OverridePropsGroup, { group }), /* @__PURE__ */ react.createElement(_elementor_ui.Divider, null))))));
2055		- }
2056		-
2057		-//#endregion
2058		-//#region packages/packages/core/editor-components/src/utils/filter-valid-overridable-props.ts
2059		- function filterValidOverridableProps(overridableProps, instanceElementId) {
2060		- const validProps = {};
2061		- for (const [key, prop] of Object.entries(overridableProps.props)) if (isExposedPropValid(prop, instanceElementId)) validProps[key] = prop;
2062		- const validPropKeys = new Set(Object.keys(validProps));
2063		- return {
2064		- props: validProps,
2065		- groups: {
2066		- items: Object.fromEntries(Object.entries(overridableProps.groups.items).map(([groupId, group]) => [groupId, {
2067		- ...group,
2068		- props: group.props.filter((propKey) => validPropKeys.has(propKey))
2069		- }])),
2070		- order: overridableProps.groups.order
2071		- }
2072		- };
2073		- }
2074		- function isExposedPropValid(prop, instanceElementId) {
2075		- const { isChainBroken } = resolveOverridesChain({
2076		- outerOverridableProp: prop,
2077		- outerInstanceId: instanceElementId
2078		- });
2079		- return !isChainBroken;
2080		- }
2081		-
2082		-//#endregion
2083		-//#region packages/packages/core/editor-components/src/hooks/use-sanitize-overridable-props.ts
2084		- function useSanitizeOverridableProps(componentId, instanceElementId) {
2085		- const overridableProps = useOverridableProps(componentId);
2086		- const isSanitized = useIsSanitizedComponent(componentId, "overridableProps");
2087		- if (!overridableProps || !componentId) return;
2088		- if (isSanitized) return overridableProps;
2089		- return filterValidOverridableProps(overridableProps, instanceElementId);
2090		- }
2091		-
2092		-//#endregion
2093		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/use-instance-panel-data.ts
2094		- function useInstancePanelData() {
2095		- const { element, settings } = useComponentInstanceSettings();
2096		- const componentId = settings?.component_id?.value;
2097		- const overrides = settings?.overrides?.value;
2098		- const component = useComponent(componentId ?? null);
2099		- const componentInstanceId = element?.id;
2100		- const overridableProps = useSanitizeOverridableProps(componentId ?? null, componentInstanceId);
2101		- if (!componentId || !overridableProps || !component || !componentInstanceId) return null;
2102		- const isNonEmptyGroup = (group) => group !== null && group.props.length > 0;
2103		- const groups = overridableProps.groups.order.map((groupId) => overridableProps.groups.items[groupId] ?? null).filter(isNonEmptyGroup);
2104		- return {
2105		- componentId,
2106		- component,
2107		- overrides,
2108		- overridableProps,
2109		- groups,
2110		- isEmpty: groups.length === 0 || Object.keys(overridableProps.props).length === 0,
2111		- componentInstanceId
2112		- };
2113		- }
2114		- function useComponentInstanceSettings() {
2115		- const { element, settings } = (0, _elementor_editor_editing_panel.useElement)();
2116		- return {
2117		- element,
2118		- settings: componentInstancePropTypeUtil.extract(settings.component_instance)
2119		- };
2120		- }
2121		-
2122		-//#endregion
2123		-//#region packages/packages/core/editor-components/src/components/instance-editing-panel/instance-editing-panel.tsx
2124		- var EDIT_UPGRADE_URL = "https://go.elementor.com/go-pro-components-Instance-edit-footer/";
2125		- function InstanceEditingPanel() {
2126		- const { canEdit } = useComponentsPermissions();
2127		- const data = useInstancePanelData();
2128		- if (!data) return null;
2129		- const { componentId, component, overrides, overridableProps, groups, isEmpty, componentInstanceId } = data;
2130		- const panelTitle = (0, _wordpress_i18n.__)("Edit %s", "elementor").replace("%s", component.name);
2131		- const actions = /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
2132		- direction: "row",
2133		- gap: .5
2134		- }, /* @__PURE__ */ react.createElement(DetachAction, {
2135		- componentInstanceId,
2136		- componentId
2137		- }), canEdit && /* @__PURE__ */ react.createElement(EditComponentAction, {
2138		- disabled: true,
2139		- label: panelTitle,
2140		- icon: _elementor_icons.PencilIcon
2141		- }));
2142		- return /* @__PURE__ */ react.createElement(_elementor_ui.Box, {
2143		- "data-testid": "instance-editing-panel",
2144		- sx: {
2145		- display: "flex",
2146		- flexDirection: "column",
2147		- height: "100%"
2148		- }
2149		- }, /* @__PURE__ */ react.createElement(ComponentInstanceProvider, {
2150		- componentId,
2151		- overrides,
2152		- overridableProps
2153		- }, /* @__PURE__ */ react.createElement(InstancePanelHeader, {
2154		- componentName: component.name,
2155		- actions
2156		- }), /* @__PURE__ */ react.createElement(InstancePanelBody, {
2157		- groups,
2158		- isEmpty,
2159		- emptyState: /* @__PURE__ */ react.createElement(EmptyState, null),
2160		- componentInstanceId
2161		- })), !isProComponentsSupported() && (isProOutdatedForComponents() ? /* @__PURE__ */ react.createElement(ComponentsUpdateAlert, {
2162		- title: (0, _wordpress_i18n.__)("Edit Component", "elementor"),
2163		- description: (0, _wordpress_i18n.__)("To edit components, update Elementor Pro to the latest version.", "elementor")
2164		- }) : /* @__PURE__ */ react.createElement(ComponentsUpgradeAlert, {
2165		- title: (0, _wordpress_i18n.__)("Edit components", "elementor"),
2166		- description: (0, _wordpress_i18n.__)("Editing components requires an active Pro subscription.", "elementor"),
2167		- upgradeUrl: EDIT_UPGRADE_URL
2168		- })));
2169		- }
2170		-
2171		-//#endregion
2172		-//#region packages/packages/core/editor-components/src/utils/get-component-documents.ts
2173		- async function getComponentDocuments({ elements, cache = /* @__PURE__ */ new Map(), isRecursive = true }) {
2174		- return getDocumentsMap(await getComponentIds(elements, cache, isRecursive), cache);
2175		- }
2176		- async function getComponentIds(elements, cache, isRecursive) {
2177		- const results = await Promise.all(elements.filter(Boolean).map(async ({ widgetType, elType, elements: childElements, settings }) => {
2178		- const ids = [];
2179		- if (isComponentInstance({
2180		- widgetType,
2181		- elType
2182		- })) {
2183		- const componentId = settings?.component_instance?.value?.component_id.value;
2184		- if (!componentId) return ids;
2185		- ids.push(componentId);
2186		- if (!cache.has(componentId)) cache.set(componentId, getComponentDocumentData(componentId));
2187		- if (isRecursive) childElements = (await cache.get(componentId))?.elements;
2188		- }
2189		- if (childElements?.length) {
2190		- const childIds = await getComponentIds(childElements, cache, isRecursive);
2191		- ids.push(...childIds);
2192		- }
2193		- return ids;
2194		- }));
2195		- return [...new Set(results.flat())];
2196		- }
2197		- async function getDocumentsMap(ids, cache) {
2198		- const documents = await Promise.all(ids.map(async (id) => {
2199		- const document = await cache.get(id);
2200		- if (!document) return null;
2201		- return [id, document];
2202		- }));
2203		- return new Map(documents.filter((document) => document !== null));
2204		- }
2205		-
2206		-//#endregion
2207		-//#region packages/packages/core/editor-components/src/store/actions/load-components-overridable-props.ts
2208		- async function loadComponentsOverridableProps(componentIds, { force = false } = {}) {
2209		- const idsToLoad = force ? componentIds : componentIds.filter((id) => !selectIsOverridablePropsLoaded((0, _elementor_store.__getState)(), id));
2210		- if (!idsToLoad.length) return;
2211		- const { data } = await apiClient.getOverridableProps(idsToLoad);
2212		- (0, _elementor_store.__dispatch)(slice.actions.loadOverridableProps(data));
2213		- }
2214		-
2215		-//#endregion
2216		-//#region packages/packages/core/editor-components/src/store/actions/load-components-assets.ts
2217		- async function loadComponentsAssets(elements) {
2218		- if (!elements.length) return;
2219		- const documents = await getComponentDocuments({
2220		- elements,
2221		- isRecursive: false
2222		- });
2223		- updateDocumentState(documents);
2224		- documents.forEach((document, id) => {
2225		- _elementor_editor_embedded_documents_manager.embeddedDocumentsManager.setDocument(id, document);
2226		- });
2227		- await loadComponentsOverridableProps([...documents.keys()]);
2228		- }
2229		- function updateDocumentState(documents) {
2230		- if ([...documents.values()].some(_elementor_editor_documents.isDocumentDirty)) (0, _elementor_editor_documents.setDocumentModifiedStatus)(true);
2231		- }
2232		-
2233		-//#endregion
2234		-//#region packages/packages/core/editor-components/src/components/load-template-components.tsx
2235		- var LoadTemplateComponents = () => {
2236		- if ((0, _elementor_editor_templates.isHandlingTemplateStyles)()) return /* @__PURE__ */ react.createElement(LoadTemplateComponentsInternal, null);
2237		- return null;
2238		- };
2239		- function LoadTemplateComponentsInternal() {
2240		- const templates = (0, _elementor_editor_templates.useLoadedTemplates)();
2241		- (0, react.useEffect)(() => {
2242		- loadComponentsAssets(templates.flatMap((elements) => elements ?? []));
2243		- }, [templates]);
2244		- return null;
2245		- }
2246		-
2247		-//#endregion
2248		-//#region packages/packages/core/editor-components/src/utils/format-component-elements-id.ts
2249		- var ELEMENT_ID_LENGTH$1 = 7;
2250		- function formatComponentElementsId(elements, path) {
2251		- return elements.map((element) => {
2252		- const nestingPath = [...path, element.id];
2253		- const id = (0, _elementor_utils.hashString)(nestingPath.join("_"), ELEMENT_ID_LENGTH$1);
2254		- return {
2255		- ...element,
2256		- id,
2257		- originId: element.id,
2258		- elements: element.elements ? formatComponentElementsId(element.elements, nestingPath) : void 0
2259		- };
2260		- });
2261		- }
2262		-
2263		-//#endregion
2264		-//#region packages/packages/core/editor-components/src/utils/reconcile-component-instance-elements.ts
2265		- var ELEMENT_ID_LENGTH = 7;
2266		- function overridesRecordToMapping(overrides) {
2267		- const mapping = {};
2268		- for (const [key, value] of Object.entries(overrides)) mapping[key] = { value };
2269		- return mapping;
2270		- }
2271		- function getElementConfig(element) {
2272		- const type = element.elType === "widget" ? element.widgetType : element.elType;
2273		- if (!type) return;
2274		- return (0, _elementor_editor_elements.getWidgetsCache)()?.[type];
2275		- }
2276		- function deriveIds(element, seed) {
2277		- const id = (0, _elementor_utils.hashString)(seed, ELEMENT_ID_LENGTH);
2278		- return {
2279		- ...element,
2280		- id,
2281		- elements: (element.elements ?? []).map((child, index) => deriveIds(child, `${id}_${index}`))
2282		- };
2283		- }
2284		- function reconcileElementTree(element, overridesMapping) {
2285		- const elementConfig = getElementConfig(element);
2286		- const effectiveSettings = unwrapOverridableSettings(applyOverridesToSettings(element.settings ?? {}, overridesMapping));
2287		- const originalChildren = element.elements ?? [];
2288		- const originalChildIds = new Set(originalChildren.map((child) => child.id));
2289		- const attributes = {
2290		- elements: [...originalChildren],
2291		- settings: effectiveSettings
2292		- };
2293		- if (elementConfig?.children_dependencies?.length) (0, _elementor_editor_elements.reconcileInitialChildren)({
2294		- elementId: element.id,
2295		- elementConfig,
2296		- attributes
2297		- });
2298		- const reconciledChildren = (attributes.elements ?? []).map((child) => originalChildIds.has(child.id) ? child : deriveIds(child, `${element.id}_${child.elType}`)).map((child) => reconcileElementTree(child, overridesMapping));
2299		- return {
2300		- ...element,
2301		- elements: reconciledChildren
2302		- };
2303		- }
2304		- function reconcileComponentInstanceElements(elements, overrides = {}) {
2305		- const overridesMapping = overridesRecordToMapping(overrides);
2306		- return elements.map((element) => reconcileElementTree(element, overridesMapping));
2307		- }
2308		-
2309		-//#endregion
2310		-//#region packages/packages/core/editor-components/src/utils/switch-to-component.ts
2311		- async function switchToComponent(componentId, componentInstanceId, element) {
2312		- const selector = getSelector(element, componentInstanceId);
2313		- (0, _elementor_editor_documents.invalidateDocumentData)(componentId);
2314		- await (0, _elementor_editor_documents.switchToDocument)(componentId, {
2315		- selector,
2316		- mode: "autosave",
2317		- setAsInitial: false,
2318		- shouldScroll: false
2319		- });
2320		- await loadComponentsOverridableProps([componentId], { force: true });
2321		- const topLevelElement = (0, _elementor_editor_elements.getCurrentDocumentContainer)()?.children?.[0];
2322		- if (topLevelElement) {
2323		- (0, _elementor_editor_elements.selectElement)(topLevelElement.id);
2324		- expandNavigator();
2325		- }
2326		- }
2327		- async function expandNavigator() {
2328		- await (0, _elementor_editor_v1_adapters.__privateRunCommand)("navigator/expand-all");
2329		- }
2330		- function getSelector(element, componentInstanceId) {
2331		- if (element) return buildUniqueSelector(element);
2332		- if (componentInstanceId) return `[data-id="${componentInstanceId}"]`;
2333		- }
2334		- function buildUniqueSelector(element) {
2335		- const selectors = [];
2336		- let current = element.closest("[data-id]");
2337		- while (current) {
2338		- const dataId = current.dataset.id;
2339		- if (current.hasAttribute("data-elementor-id")) selectors.unshift(`[data-id="${dataId}"]`);
2340		- current = current.parentElement?.closest("[data-id]") ?? null;
2341		- }
2342		- if (selectors.length === 0) {
2343		- const closestElement = element.closest("[data-id]");
2344		- if (closestElement?.dataset?.id) return `[data-id="${closestElement.dataset.id}"]`;
2345		- }
2346		- return selectors.join(" ");
2347		- }
2348		-
2349		-//#endregion
2350		-//#region packages/packages/core/editor-components/src/create-component-type.ts
2351		- var __defProp = Object.defineProperty;
2352		- var __typeError = (msg) => {
2353		- throw TypeError(msg);
2354		- };
2355		- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {
2356		- enumerable: true,
2357		- configurable: true,
2358		- writable: true,
2359		- value
2360		- }) : obj[key] = value;
2361		- var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
2362		- var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
2363		- var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
2364		- var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
2365		- var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
2366		- var COMPONENT_WIDGET_TYPE = "e-component";
2367		- var EDIT_COMPONENT_DB_CLICK_UPGRADE_URL = "https://go.elementor.com/go-pro-components-Instance-edit-canvas-double-click/";
2368		- var EDIT_COMPONENT_CONTEXT_MENU_UPGRADE_URL = "https://go.elementor.com/go-pro-components-Instance-edit-context-menu/";
2369		- var UPDATE_PLUGINS_URL = "/wp-admin/plugins.php";
2370		- var COMPONENT_EDIT_UPGRADE_NOTIFICATION_ID = "component-edit-upgrade";
2371		- var COMPONENT_EDIT_UPDATE_NOTIFICATION_ID = "component-edit-update";
2372		- var COMPONENT_EDIT_UPGRADE_AUTO_HIDE_DURATION = 2e3;
2373		- function notifyComponentEditUpgrade() {
2374		- (0, _elementor_editor_notifications.notify)({
2375		- type: "promotion",
2376		- id: COMPONENT_EDIT_UPGRADE_NOTIFICATION_ID,
2377		- message: (0, _wordpress_i18n.__)("Editing components requires an active Pro subscription.", "elementor"),
2378		- autoHideDuration: COMPONENT_EDIT_UPGRADE_AUTO_HIDE_DURATION,
2379		- additionalActionProps: [{
2380		- size: "small",
2381		- variant: "contained",
2382		- color: "promotion",
2383		- href: EDIT_COMPONENT_DB_CLICK_UPGRADE_URL,
2384		- target: "_blank",
2385		- children: (0, _wordpress_i18n.__)("Upgrade Now", "elementor")
2386		- }]
2387		- });
2388		- }
2389		- function notifyComponentEditUpdate() {
2390		- (0, _elementor_editor_notifications.notify)({
2391		- type: "info",
2392		- id: COMPONENT_EDIT_UPDATE_NOTIFICATION_ID,
2393		- message: (0, _wordpress_i18n.__)("To edit components, update Elementor Pro to the latest version.", "elementor"),
2394		- additionalActionProps: [{
2395		- size: "small",
2396		- variant: "contained",
2397		- color: "info",
2398		- href: UPDATE_PLUGINS_URL,
2399		- target: "_blank",
2400		- children: (0, _wordpress_i18n.__)("Update Now", "elementor")
2401		- }]
2402		- });
2403		- }
2404		- var updateGroups = (groups, config) => {
2405		- const disableMap = new Map(Object.entries(config.disable ?? {}));
2406		- const addMap = new Map(Object.entries(config.add ?? {}));
2407		- return groups.map((group) => {
2408		- const disabledActions = disableMap.get(group.name) ?? [];
2409		- const addConfig = addMap.get(group.name);
2410		- const updatedActions = group.actions.map((action) => disabledActions.includes(action.name) ? {
2411		- ...action,
2412		- isEnabled: () => false
2413		- } : action);
2414		- if (addConfig) updatedActions.splice(addConfig.index, 0, ...addConfig.actions);
2415		- return {
2416		- ...group,
2417		- actions: updatedActions
2418		- };
2419		- });
2420		- };
2421		- function createComponentType(options) {
2422		- const WidgetType = window.elementor.modules.elements.types.Widget;
2423		- const view = createComponentView({ ...options });
2424		- return class extends WidgetType {
2425		- getType() {
2426		- return options.type;
2427		- }
2428		- getView() {
2429		- return view;
2430		- }
2431		- getModel() {
2432		- return createComponentModel();
2433		- }
2434		- };
2435		- }
2436		- function createComponentView(options) {
2437		- var _componentRenderContext;
2438		- var _a;
2439		- const legacyWindow = window;
2440		- return _a = class extends (0, _elementor_editor_canvas.createTemplatedElementView)(options) {
2441		- constructor() {
2442		- super(...arguments);
2443		- __publicField(this, "eventsManagerConfig", legacyWindow.elementorCommon.eventsManager.config);
2444		- __privateAdd(this, _componentRenderContext);
2445		- }
2446		- isComponentCurrentlyEdited() {
2447		- return (0, _elementor_editor_documents.getCurrentDocument)()?.id === this.getComponentId();
2448		- }
2449		- getRenderContext() {
2450		- const namespaceKey = this.getNamespaceKey();
2451		- const parentContext = this._parent?.getRenderContext?.();
2452		- const parentComponentContext = parentContext?.[namespaceKey];
2453		- if (!__privateGet(this, _componentRenderContext)) return parentContext;
2454		- const ownOverrides = __privateGet(this, _componentRenderContext).overrides ?? {};
2455		- const parentOverrides = parentComponentContext?.overrides ?? {};
2456		- return {
2457		- ...parentContext,
2458		- [namespaceKey]: { overrides: {
2459		- ...parentOverrides,
2460		- ...ownOverrides
2461		- } }
2462		- };
2463		- }
2464		- getResolverRenderContext() {
2465		- const namespaceKey = this.getNamespaceKey();
2466		- const ownContext = this.getRenderContext()?.[namespaceKey];
2467		- if (!ownContext) return this._parent?.getResolverRenderContext?.();
2468		- return {
2469		- ...this._parent?.getResolverRenderContext?.(),
2470		- ...ownContext
2471		- };
2472		- }
2473		- afterSettingsResolve(settings) {
2474		- const componentInstance = settings.component_instance;
2475		- if (componentInstance) {
2476		- __privateSet(this, _componentRenderContext, { overrides: componentInstance.overrides ?? {} });
2477		- const instanceId = this.model.get("id");
2478		- const formattedElements = formatComponentElementsId(reconcileComponentInstanceElements(componentInstance.elements ?? [], componentInstance.overrides ?? {}), [instanceId]);
2479		- this.collection = legacyWindow.elementor.createBackboneElementsCollection(formattedElements);
2480		- this.collection.models.forEach(setInactiveRecursively);
2481		- settings.component_instance = "<template data-children-placeholder></template>";
2482		- }
2483		- return settings;
2484		- }
2485		- getDomElement() {
2486		- return this.children.findByIndex(0)?.getDomElement() ?? this.$el;
2487		- }
2488		- attachBuffer(collectionView, buffer) {
2489		- const childrenPlaceholder = collectionView.$el.find("[data-children-placeholder]").get(0);
2490		- if (!childrenPlaceholder) {
2491		- super.attachBuffer(collectionView, buffer);
2492		- return;
2493		- }
2494		- childrenPlaceholder.replaceWith(buffer);
2495		- }
2496		- getComponentId() {
2497		- return (this.options?.model?.get("settings")?.get("component_instance")?.value).component_id.value;
2498		- }
2499		- getContextMenuGroups() {
2500		- const filteredGroups = super.getContextMenuGroups().filter((group) => group.name !== "save");
2501		- if (!this.getComponentId()) return filteredGroups;
2502		- return updateGroups(filteredGroups, this._getContextMenuConfig());
2503		- }
2504		- _getContextMenuConfig() {
2505		- const isAdministrator = isUserAdministrator();
2506		- const hasPro = (0, _elementor_utils.hasProInstalled)();
2507		- const isOutdated = isProOutdatedForComponents();
2508		- const editComponentAction = {
2509		- name: "edit component",
2510		- icon: "eicon-edit",
2511		- title: () => (0, _wordpress_i18n.__)("Edit Component", "elementor"),
2512		- ...!hasPro && !isOutdated && {
2513		- shortcut: `<a href="${EDIT_COMPONENT_CONTEXT_MENU_UPGRADE_URL}" target="_blank" onclick="event.stopPropagation()" class="elementor-context-menu-list__item__shortcut__promotion-badge"><i class="eicon-upgrade-crown"></i></a>`,
2514		- hasShortcutAction: true
2515		- },
2516		- isEnabled: () => isProComponentsSupported() || isOutdated,
2517		- callback: (_, eventData) => this.editComponent(eventData)
2518		- };
2519		- const detachInstanceAction = {
2520		- name: "detach instance",
2521		- icon: "eicon-chain-broken",
2522		- title: () => (0, _wordpress_i18n.__)("Detach from Component", "elementor"),
2523		- isEnabled: () => true,
2524		- callback: (_, eventData) => this.detachInstance(eventData)
2525		- };
2526		- return {
2527		- add: { general: {
2528		- index: 1,
2529		- actions: isAdministrator ? [editComponentAction, detachInstanceAction] : [detachInstanceAction]
2530		- } },
2531		- disable: { clipboard: ["pasteStyle", "resetStyle"] }
2532		- };
2533		- }
2534		- async switchDocument() {
2535		- const { isAllowedToSwitchDocument, lockedBy } = await apiClient.getComponentLockStatus(this.getComponentId());
2536		- if (!isAllowedToSwitchDocument) options.showLockedByModal?.(lockedBy || "");
2537		- else switchToComponent(this.getComponentId(), this.model.get("id"), this.el);
2538		- }
2539		- editComponent({ trigger, location, secondaryLocation }) {
2540		- if (isProOutdatedForComponents()) {
2541		- notifyComponentEditUpdate();
2542		- return;
2543		- }
2544		- if (!isProComponentsSupported() || this.isComponentCurrentlyEdited()) return;
2545		- this.switchDocument();
2546		- const editorSettings = this.model.get("editor_settings");
2547		- trackComponentEvent({
2548		- action: "edited",
2549		- executedBy: "user",
2550		- component_uid: editorSettings?.component_uid,
2551		- component_name: editorSettings?.title,
2552		- location,
2553		- secondary_location: secondaryLocation,
2554		- trigger
2555		- });
2556		- }
2557		- detachInstance({ trigger, location, secondaryLocation }) {
2558		- const componentId = this.getComponentId();
2559		- const instanceId = this.model.get("id");
2560		- if (!componentId || !instanceId) return;
2561		- const handleConfirm = async () => {
2562		- try {
2563		- await detachComponentInstance({
2564		- instanceId,
2565		- componentId,
2566		- trackingInfo: {
2567		- location,
2568		- secondaryLocation,
2569		- trigger
2570		- }
2571		- });
2572		- } catch {
2573		- (0, _elementor_editor_notifications.notify)({
2574		- type: "error",
2575		- message: (0, _wordpress_i18n.__)("Failed to detach component instance.", "elementor"),
2576		- id: "detach-component-instance-failed"
2577		- });
2578		- }
2579		- };
2580		- options.showDetachConfirmDialog?.(handleConfirm);
2581		- }
2582		- handleDblClick(e) {
2583		- e.stopPropagation();
2584		- if (!isUserAdministrator()) return;
2585		- if (isProOutdatedForComponents()) {
2586		- notifyComponentEditUpdate();
2587		- return;
2588		- }
2589		- if (!(0, _elementor_utils.hasProInstalled)()) {
2590		- notifyComponentEditUpgrade();
2591		- return;
2592		- }
2593		- const { triggers, locations, secondaryLocations } = this.eventsManagerConfig;
2594		- this.editComponent({
2595		- trigger: triggers.doubleClick,
2596		- location: locations.canvas,
2597		- secondaryLocation: secondaryLocations.canvasElement
2598		- });
2599		- }
2600		- events() {
2601		- return {
2602		- ...super.events(),
2603		- dblclick: this.handleDblClick
2604		- };
2605		- }
2606		- attributes() {
2607		- return {
2608		- ...super.attributes(),
2609		- "data-elementor-id": this.getComponentId()
2610		- };
2611		- }
2612		- }, _componentRenderContext = /* @__PURE__ */ new WeakMap(), _a;
2613		- }
2614		- function setInactiveRecursively(model) {
2615		- const editSettings = model.get("editSettings");
2616		- if (editSettings) editSettings.set("inactive", true);
2617		- const elements = model.get("elements");
2618		- if (elements) elements.forEach((childModel) => {
2619		- setInactiveRecursively(childModel);
2620		- });
2621		- }
2622		- function isUserAdministrator() {
2623		- return window.elementor.config?.user?.is_administrator ?? false;
2624		- }
2625		- function createComponentModel() {
2626		- const WidgetType = window.elementor.modules.elements.types.Widget;
2627		- const BaseWidgetModel = new WidgetType().getModel();
2628		- return BaseWidgetModel.extend({
2629		- initialize(attributes, options) {
2630		- BaseWidgetModel.prototype.initialize.call(this, attributes, options);
2631		- const componentInstance = this.get("settings")?.get("component_instance");
2632		- if (componentInstance?.value) {
2633		- const componentId = componentInstance.value.component_id?.value;
2634		- if (componentId && typeof componentId === "number") this.set("componentId", componentId);
2635		- }
2636		- this.set("isGlobal", true);
2637		- },
2638		- getTitle() {
2639		- const editorSettings = this.get("editor_settings");
2640		- const instanceTitle = editorSettings?.title;
2641		- if (instanceTitle) return instanceTitle;
2642		- const componentUid = editorSettings?.component_uid;
2643		- if (componentUid) {
2644		- const component = selectComponentByUid((0, _elementor_store.__getState)(), componentUid);
2645		- if (component?.name) return component.name;
2646		- }
2647		- return window.elementor.getElementData(this).title;
2648		- },
2649		- getComponentId() {
2650		- return this.get("componentId") || null;
2651		- },
2652		- getComponentName() {
2653		- return this.getTitle();
2654		- },
2655		- getComponentUid() {
2656		- return this.get("editor_settings")?.component_uid || null;
2657		- }
2658		- });
2659		- }
2660		-
2661		-//#endregion
2662		-//#region packages/packages/core/editor-components/src/populate-store.ts
2663		- function PopulateStore() {
2664		- (0, react.useEffect)(() => {
2665		- (0, _elementor_store.__dispatch)(loadComponents());
2666		- }, []);
2667		- return null;
2668		- }
2669		-
2670		-//#endregion
2671		-//#region packages/packages/core/editor-components/src/prevent-circular-nesting.ts
2672		- var COMPONENT_TYPE = "e-component";
2673		- var COMPONENT_CIRCULAR_NESTING_ALERT = {
2674		- type: "default",
2675		- message: (0, _wordpress_i18n.__)("Can't add this component - components that contain each other can't be nested.", "elementor"),
2676		- id: "circular-component-nesting-blocked"
2677		- };
2678		- function initCircularNestingPrevention() {
2679		- (0, _elementor_editor_v1_adapters.blockCommand)({
2680		- command: "document/elements/create",
2681		- condition: blockCircularCreate
2682		- });
2683		- (0, _elementor_editor_v1_adapters.blockCommand)({
2684		- command: "document/elements/move",
2685		- condition: blockCircularMove
2686		- });
2687		- (0, _elementor_editor_v1_adapters.blockCommand)({
2688		- command: "document/elements/paste",
2689		- condition: blockCircularPaste
2690		- });
2691		- }
2692		- function wouldCreateCircularNesting(componentIdToAdd) {
2693		- if (componentIdToAdd === void 0) return false;
2694		- const state = (0, _elementor_store.__getState)();
2695		- const currentComponentId = selectCurrentComponentId(state);
2696		- const path = selectPath(state);
2697		- if (currentComponentId === null) return false;
2698		- if (componentIdToAdd === currentComponentId) return true;
2699		- return path.some((item) => item.componentId === componentIdToAdd);
2700		- }
2701		- function extractComponentIdFromModel(model) {
2702		- if (!model) return null;
2703		- if (!(model.widgetType === COMPONENT_TYPE)) return null;
2704		- return model.settings?.component_instance?.value?.component_id?.value ?? null;
2705		- }
2706		- function extractComponentIdFromElement(element) {
2707		- if (element.widgetType !== COMPONENT_TYPE) return null;
2708		- return element.settings?.component_instance?.value?.component_id?.value ?? null;
2709		- }
2710		- function extractComponentIdsFromElements(elements) {
2711		- const ids = [];
2712		- for (const element of elements) {
2713		- const componentId = extractComponentIdFromElement(element);
2714		- if (componentId !== null) ids.push(componentId);
2715		- if (element.elements?.length) ids.push(...extractComponentIdsFromElements(element.elements));
2716		- }
2717		- return ids;
2718		- }
2719		- function extractComponentIdFromContainer(container) {
2720		- if (container.model?.get?.("widgetType") !== COMPONENT_TYPE) return null;
2721		- return ((container.model?.get?.("settings"))?.get?.("component_instance"))?.value?.component_id?.value ?? null;
2722		- }
2723		- function blockCircularCreate(args) {
2724		- const componentId = extractComponentIdFromModel(args.model);
2725		- if (componentId === null) return false;
2726		- const isBlocked = wouldCreateCircularNesting(componentId);
2727		- if (isBlocked) (0, _elementor_editor_notifications.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
2728		- return isBlocked;
2729		- }
2730		- function blockCircularMove(args) {
2731		- const { containers = [args.container] } = args;
2732		- const hasCircularComponent = containers.some((container) => {
2733		- if (!container) return false;
2734		- return (0, _elementor_editor_elements.getAllDescendants)(container).some((element) => {
2735		- const componentId = extractComponentIdFromContainer(element);
2736		- if (componentId === null) return false;
2737		- return wouldCreateCircularNesting(componentId);
2738		- });
2739		- });
2740		- if (hasCircularComponent) (0, _elementor_editor_notifications.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
2741		- return hasCircularComponent;
2742		- }
2743		- function blockCircularPaste(args) {
2744		- const { storageType } = args;
2745		- if (storageType !== "localstorage") return false;
2746		- const data = window?.elementorCommon?.storage?.get();
2747		- if (!data?.clipboard?.elements) return false;
2748		- const hasCircularComponent = extractComponentIdsFromElements(data.clipboard.elements).some(wouldCreateCircularNesting);
2749		- if (hasCircularComponent) (0, _elementor_editor_notifications.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
2750		- return hasCircularComponent;
2751		- }
2752		-
2753		-//#endregion
2754		-//#region packages/packages/core/editor-components/src/store/actions/remove-component-styles.ts
2755		- function removeComponentStyles(id) {
2756		- apiClient.invalidateComponentConfigCache(id);
2757		- }
2758		-
2759		-//#endregion
2760		-//#region packages/packages/core/editor-components/src/sync/publish-draft-components-in-page-before-save.ts
2761		- var INSUFFICIENT_PERMISSIONS_ERROR_CODE = "insufficient_permissions";
2762		- var PUBLISH_UPGRADE_URL = "https://go.elementor.com/go-pro-components-Instance-draft-failure/";
2763		- var PUBLISH_UPGRADE_NOTIFICATION_ID = "component-publish-upgrade";
2764		- async function publishDraftComponentsInPageBeforeSave({ status, elements }) {
2765		- if (status !== "publish") return;
2766		- const draftIds = [...(await getComponentDocuments({ elements })).values()].filter(_elementor_editor_documents.isDocumentDirty).map((document) => document.id);
2767		- if (draftIds.length === 0) return;
2768		- try {
2769		- await apiClient.updateStatuses(draftIds, "publish");
2770		- } catch (error) {
2771		- if (isInsufficientPermissionsError(error)) {
2772		- notifyPublishUpgrade();
2773		- return;
2774		- }
2775		- throw error;
2776		- }
2777		- draftIds.forEach((id) => (0, _elementor_editor_documents.invalidateDocumentData)(id));
2778		- }
2779		- function isInsufficientPermissionsError(error) {
2780		- return error instanceof _elementor_http_client.AxiosError && error.response?.data?.code === INSUFFICIENT_PERMISSIONS_ERROR_CODE;
2781		- }
2782		- function notifyPublishUpgrade() {
2783		- (0, _elementor_editor_notifications.notify)({
2784		- type: "promotion",
2785		- id: PUBLISH_UPGRADE_NOTIFICATION_ID,
2786		- message: (0, _wordpress_i18n.__)("You have unpublished component on this page. You need a pro version to publish it.", "elementor"),
2787		- additionalActionProps: [{
2788		- size: "small",
2789		- variant: "contained",
2790		- color: "promotion",
2791		- href: PUBLISH_UPGRADE_URL,
2792		- target: "_blank",
2793		- children: (0, _wordpress_i18n.__)("Upgrade Now", "elementor")
2794		- }]
2795		- });
2796		- }
2797		-
2798		-//#endregion
2799		-//#region packages/packages/core/editor-components/src/sync/before-save.ts
2800		- var beforeSave = ({ container, status }) => {
2801		- return publishDraftComponentsInPageBeforeSave({
2802		- elements: container?.model.get("elements").toJSON?.() ?? [],
2803		- status
2804		- });
2805		- };
2806		-
2807		-//#endregion
2808		-//#region packages/packages/core/editor-components/src/sync/load-component-data-after-instance-added.ts
2809		- function initLoadComponentDataAfterInstanceAdded() {
2810		- (0, _elementor_editor_v1_adapters.registerDataHook)("after", "document/elements/paste", (_args, result) => {
2811		- load(result);
2812		- });
2813		- (0, _elementor_editor_v1_adapters.registerDataHook)("after", "document/elements/import", (_args, result) => {
2814		- load(result);
2815		- });
2816		- }
2817		- function load(result) {
2818		- if (!result) return;
2819		- loadComponentsAssets((Array.isArray(result) ? result : [result]).map((container) => container.model?.toJSON()).filter((element) => !!element));
2820		- }
2821		-
2822		-//#endregion
2823		-//#region packages/packages/core/editor-components/src/init.ts
2824		- function init() {
2825		- (0, _elementor_store.__registerSlice)(slice);
2826		- (0, _elementor_editor_canvas.registerElementType)(COMPONENT_WIDGET_TYPE, (options) => createComponentType({
2827		- ...options,
2828		- showLockedByModal: openEditModeDialog,
2829		- showDetachConfirmDialog: openDetachConfirmDialog
2830		- }));
2831		- window.elementorCommon.__beforeSave = beforeSave;
2832		- (0, _elementor_editor_elements_panel.injectTab)({
2833		- id: "components",
2834		- label: (0, _wordpress_i18n.__)("Components", "elementor"),
2835		- component: Components,
2836		- position: 1
2837		- });
2838		- (0, _elementor_editor.injectIntoLogic)({
2839		- id: "components-populate-store",
2840		- component: PopulateStore
2841		- });
2842		- (0, _elementor_editor_v1_adapters.registerDataHook)("after", "editor/documents/attach-preview", () => {
2843		- const { id, config } = (0, _elementor_editor_documents.getV1CurrentDocument)() ?? {};
2844		- if (!id) return;
2845		- removeComponentStyles(id);
2846		- loadComponentsAssets(config?.elements ?? []);
2847		- });
2848		- _elementor_editor_embedded_documents_manager.embeddedDocumentsManager.onDocumentLoad((_documentId, data) => {
2849		- loadComponentsAssets(data.elements ?? []);
2850		- });
2851		- (0, _elementor_editor.injectIntoLogic)({
2852		- id: "templates",
2853		- component: LoadTemplateComponents
2854		- });
2855		- (0, _elementor_editor_editing_panel.registerEditingPanelReplacement)({
2856		- id: "component-instance-edit-panel",
2857		- condition: (_, elementType) => elementType.key === "e-component",
2858		- component: InstanceEditingPanel
2859		- });
2860		- _elementor_editor_canvas.settingsTransformersRegistry.register("component-instance", componentInstanceTransformer);
2861		- _elementor_editor_canvas.settingsTransformersRegistry.register("overridable", componentOverridableTransformer);
2862		- _elementor_editor_canvas.settingsTransformersRegistry.register("override", componentOverrideTransformer);
2863		- initCircularNestingPrevention();
2864		- initLoadComponentDataAfterInstanceAdded();
2865		- }
2866		-
2867		-//#endregion
2868		-//#region packages/packages/core/editor-components/src/index.ts
2869		- var src_exports = /* @__PURE__ */ __exportAll({
2870		- COMPONENT_WIDGET_TYPE: () => COMPONENT_WIDGET_TYPE,
2871		- ComponentInstanceProvider: () => ComponentInstanceProvider,
2872		- ComponentItem: () => ComponentItem,
2873		- ComponentName: () => ComponentName,
2874		- ComponentSearch: () => ComponentSearch,
2875		- ComponentsList: () => ComponentsList,
2876		- DetachAction: () => DetachAction,
2877		- EditComponentAction: () => EditComponentAction,
2878		- EmptySearchResult: () => EmptySearchResult,
2879		- InstanceEmptyState: () => EmptyState,
2880		- InstancePanelBody: () => InstancePanelBody,
2881		- InstancePanelHeader: () => InstancePanelHeader,
2882		- LoadingComponents: () => LoadingComponents,
2883		- OverridablePropProvider: () => OverridablePropProvider,
2884		- SLICE_NAME: () => SLICE_NAME,
2885		- SearchProvider: () => SearchProvider,
2886		- apiClient: () => apiClient,
2887		- componentInstanceOverridePropTypeUtil: () => componentInstanceOverridePropTypeUtil,
2888		- componentInstanceOverridesPropTypeUtil: () => componentInstanceOverridesPropTypeUtil,
2889		- componentInstancePropTypeUtil: () => componentInstancePropTypeUtil,
2890		- componentOverridablePropTypeUtil: () => componentOverridablePropTypeUtil,
2891		- componentsActions: () => componentsActions,
2892		- componentsSelectors: () => componentsSelectors,
2893		- createComponentsAction: () => createComponentsAction,
2894		- filterValidOverridableProps: () => filterValidOverridableProps,
2895		- getComponentDocumentData: () => getComponentDocumentData,
2896		- getContainerByOriginId: () => getContainerByOriginId,
2897		- getOverridableProp: () => getOverridableProp,
2898		- getPropTypeForComponentOverride: () => getPropTypeForComponentOverride,
2899		- init: () => init,
2900		- isComponentInstance: () => isComponentInstance,
2901		- loadComponentsAssets: () => loadComponentsAssets,
2902		- onElementDrop: () => onElementDrop,
2903		- publishDraftComponentsInPageBeforeSave: () => publishDraftComponentsInPageBeforeSave,
2904		- registerComponentsReducer: () => registerComponentsReducer,
2905		- resolveOverridePropValue: () => resolveOverridePropValue,
2906		- selectComponentByUid: () => selectComponentByUid,
2907		- selectCreatedThisSession: () => selectCreatedThisSession,
2908		- selectOverridableProps: () => selectOverridableProps,
2909		- selectPath: () => selectPath,
2910		- slice: () => slice,
2911		- switchToComponent: () => switchToComponent,
2912		- trackComponentEvent: () => trackComponentEvent,
2913		- updateOverridableProp: () => updateOverridableProp,
2914		- useComponentInstanceElement: () => useComponentInstanceElement,
2915		- useComponents: () => useComponents,
2916		- useComponentsPermissions: () => useComponentsPermissions,
2917		- useCurrentComponent: () => useCurrentComponent,
2918		- useCurrentComponentId: () => useCurrentComponentId,
2919		- useFilteredComponents: () => useFilteredComponents,
2920		- useInstancePanelData: () => useInstancePanelData,
2921		- useIsSanitizedComponent: () => useIsSanitizedComponent,
2922		- useOverridablePropValue: () => useOverridablePropValue,
2923		- useOverridableProps: () => useOverridableProps,
2924		- useSanitizeOverridableProps: () => useSanitizeOverridableProps
2925		- });
2926		-
2927		-//#endregion
2928		-//#region \0elementor-package-library-entry
2929		- (window.elementorV2 = window.elementorV2 || {}).editorComponents = src_exports;
2930		-
2931		-//#endregion
2932		-})(elementorV2.editor, elementorV2.editorCanvas, elementorV2.editorDocuments, elementorV2.editorEditingPanel, elementorV2.editorElementsPanel, elementorV2.editorEmbeddedDocumentsManager, elementorV2.editorV1Adapters, elementorV2.store, wp.i18n, elementorV2.httpClient, React, elementorV2.editorUi, elementorV2.ui, elementorV2.utils, elementorV2.icons, elementorV2.editorCurrentUser, elementorV2.editorNotifications, elementorV2.editorElements, elementorV2.editorProps, elementorV2.schema, elementorV2.events, elementorV2.editorPanels, elementorV2.editorControls, elementorV2.editorTemplates);
2933		-window.elementorV2.editorComponents?.init?.();
	1	+/*! For license information please see editor-components.js.LICENSE.txt */
	2	+!function(){"use strict";var e={"./packages/packages/core/editor-components/src/api.ts":function(e,t,n){n.r(t),n.d(t,{apiClient:function(){return s}});var o=n("@elementor/http-client");const r="elementor/v1/components",s={get:()=>(0,o.httpService)().get(`${r}`).then(e=>e.data.data),create:e=>(0,o.httpService)().post(`${r}`,e).then(e=>e.data.data)}},"./packages/packages/core/editor-components/src/components/components-tab.tsx":function(e,t,n){n.r(t),n.d(t,{ComponentsTab:function(){return ComponentsTab}});var o=n("react"),r=n("@elementor/ui");function ComponentsTab(){return o.createElement(r.Box,{px:2},"This is the Components tab.")}},"./packages/packages/core/editor-components/src/components/create-component-form/create-component-form.tsx":function(e,t,n){n.r(t),n.d(t,{CreateComponentForm:function(){return CreateComponentForm}});var o=n("react"),r=n("@elementor/editor-elements"),s=n("@elementor/editor-ui"),c=n("@elementor/icons"),a=n("@elementor/ui"),i=n("@wordpress/i18n"),m=n("./packages/packages/core/editor-components/src/hooks/use-components.ts"),p=n("./packages/packages/core/editor-components/src/hooks/use-create-component.ts"),l=n("./packages/packages/core/editor-components/src/components/create-component-form/hooks/use-form.ts"),u=n("./packages/packages/core/editor-components/src/components/create-component-form/utils/component-form-schema.ts"),d=n("./packages/packages/core/editor-components/src/components/create-component-form/utils/replace-element-with-component.ts");function CreateComponentForm(){const[e,t]=(0,o.useState)(null),[n,c]=(0,o.useState)(),[m,l]=(0,o.useState)(null),{mutate:u,isPending:_}=(0,p.useCreateComponentMutation)();(0,o.useEffect)(()=>{const e="elementor/editor/open-save-as-component-form",openPopup=e=>{t({element:e.detail.element,elementLabel:(0,r.getElementLabel)(e.detail.element.id)}),c(e.detail.anchorPosition)};return window.addEventListener(e,openPopup),()=>{window.removeEventListener(e,openPopup)}},[]);const resetAndClosePopup=()=>{t(null),c(void 0)};return o.createElement(s.ThemeProvider,null,o.createElement(a.Popover,{open:null!==e,onClose:resetAndClosePopup,anchorReference:"anchorPosition",anchorPosition:n},null!==e&&o.createElement(Form,{initialValues:{componentName:e.elementLabel},handleSave:async t=>{if(!e)throw new Error("Can't save element as component: element not found");u({name:t.componentName,content:[e.element.model.toJSON({remove:["default"]})]},{onSuccess:n=>{if(!e)throw new Error("Can't replace element with component: element not found");(0,d.replaceElementWithComponent)(e.element,n.component_id),l({show:!0,message:(0,i.__)("Component saved successfully as: %1$s (ID: %2$s)","elementor").replace("%1$s",t.componentName).replace("%2$s",n.component_id.toString()),type:"success"}),resetAndClosePopup()},onError:()=>{const e=(0,i.__)("Failed to save component. Please try again.","elementor");l({show:!0,message:e,type:"error"})}})},isSubmitting:_,closePopup:resetAndClosePopup})),o.createElement(a.Snackbar,{open:m?.show,onClose:()=>l(null)},o.createElement(a.Alert,{onClose:()=>l(null),severity:m?.type,sx:{width:"100%"}},m?.message)))}const _="tiny",Form=({initialValues:e,handleSave:t,isSubmitting:n,closePopup:r})=>{const{values:s,errors:p,isValid:d,handleChange:f,validateForm:g}=(0,l.useForm)(e),{data:w}=(0,m.useComponents)(),h=(0,o.useMemo)(()=>w?.map(e=>e.name)??[],[w]),k=(0,o.useMemo)(()=>(0,u.createBaseComponentSchema)(h),[h]),C=(0,o.useMemo)(()=>(0,u.createSubmitComponentSchema)(h),[h]);return o.createElement(a.Stack,{alignItems:"start",width:"268px"},o.createElement(a.Stack,{direction:"row",alignItems:"center",py:1,px:1.5,sx:{columnGap:.5,borderBottom:"1px solid",borderColor:"divider",width:"100%"}},o.createElement(c.StarIcon,{fontSize:_}),o.createElement(a.Typography,{variant:"caption",sx:{color:"text.primary",fontWeight:"500",lineHeight:1}},(0,i.__)("Save as a component","elementor"))),o.createElement(a.Grid,{container:!0,gap:.75,alignItems:"start",p:1.5},o.createElement(a.Grid,{item:!0,xs:12},o.createElement(a.FormLabel,{htmlFor:"component-name",size:"tiny"},(0,i.__)("Name","elementor"))),o.createElement(a.Grid,{item:!0,xs:12},o.createElement(a.TextField,{id:"component-name",size:_,fullWidth:!0,value:s.componentName,onChange:e=>f(e,"componentName",k),inputProps:{style:{color:"text.primary",fontWeight:"600"}},error:Boolean(p.componentName),helperText:p.componentName}))),o.createElement(a.Stack,{direction:"row",justifyContent:"flex-end",alignSelf:"end",py:1,px:1.5},o.createElement(a.Button,{onClick:r,disabled:n,color:"secondary",variant:"text",size:"small"},(0,i.__)("Cancel","elementor")),o.createElement(a.Button,{onClick:()=>{const{success:e,parsedValues:n}=g(C);e&&t(n)},disabled:n||!d,variant:"contained",color:"primary",size:"small"},n?(0,i.__)("Creating…","elementor"):(0,i.__)("Create","elementor"))))}},"./packages/packages/core/editor-components/src/components/create-component-form/hooks/use-form.ts":function(e,t,n){n.r(t),n.d(t,{useForm:function(){return useForm}});var o=n("react");const useForm=e=>{const[t,n]=(0,o.useState)(e),[r,s]=(0,o.useState)({}),c=(0,o.useMemo)(()=>!Object.values(r).some(e=>e),[r]);return{values:t,errors:r,isValid:c,handleChange:(e,o,r)=>{const c={...t,[o]:e.target.value};n(c);const{success:a,errors:i}=validateForm(c,r);s(a?{}:i)},validateForm:e=>{const{success:n,errors:o,parsedValues:r}=validateForm(t,e);return n?(s({}),{success:n,parsedValues:r}):(s(o),{success:n})}}},validateForm=(e,t)=>{const n=t.safeParse(e);if(n.success)return{success:!0,parsedValues:n.data};const o={};return Object.entries(n.error.formErrors.fieldErrors).forEach(([e,t])=>{o[e]=t[0]}),{success:!1,errors:o}}},"./packages/packages/core/editor-components/src/components/create-component-form/utils/component-form-schema.ts":function(e,t,n){n.r(t),n.d(t,{createBaseComponentSchema:function(){return createBaseComponentSchema},createSubmitComponentSchema:function(){return createSubmitComponentSchema}});var o=n("@elementor/schema"),r=n("@wordpress/i18n");const createBaseComponentSchema=e=>o.z.object({componentName:o.z.string().trim().max(50,(0,r.__)("Component name is too long. Please keep it under 50 characters.","elementor")).refine(t=>!e.includes(t),{message:(0,r.__)("Component name already exists","elementor")})}),createSubmitComponentSchema=e=>{const t=createBaseComponentSchema(e);return t.extend({componentName:t.shape.componentName.refine(e=>e.length>0,{message:(0,r.__)("Component name is required.","elementor")}).refine(e=>e.length>=2,{message:(0,r.__)("Component name is too short. Please enter at least 2 characters.","elementor")})})}},"./packages/packages/core/editor-components/src/components/create-component-form/utils/replace-element-with-component.ts":function(e,t,n){n.r(t),n.d(t,{replaceElementWithComponent:function(){return replaceElementWithComponent}});var o=n("@elementor/editor-elements"),r=n("@elementor/editor-props");const replaceElementWithComponent=async(e,t)=>{(0,o.replaceElement)({currentElement:e,newElement:{elType:"widget",widgetType:"e-component",settings:{component_id:r.numberPropTypeUtil.create(t)}},withHistory:!1})}},"./packages/packages/core/editor-components/src/hooks/use-components.ts":function(e,t,n){n.r(t),n.d(t,{COMPONENTS_QUERY_KEY:function(){return s},useComponents:function(){return useComponents}});var o=n("@elementor/query"),r=n("./packages/packages/core/editor-components/src/api.ts");const s="components",useComponents=()=>(0,o.useQuery)({queryKey:[s],queryFn:r.apiClient.get,staleTime:1/0})},"./packages/packages/core/editor-components/src/hooks/use-create-component.ts":function(e,t,n){n.r(t),n.d(t,{useCreateComponentMutation:function(){return useCreateComponentMutation}});var o=n("@elementor/query"),r=n("./packages/packages/core/editor-components/src/api.ts"),s=n("./packages/packages/core/editor-components/src/hooks/use-components.ts");const useCreateComponentMutation=()=>{const e=(0,o.useQueryClient)();return(0,o.useMutation)({mutationFn:r.apiClient.create,onSuccess:()=>e.invalidateQueries({queryKey:[s.COMPONENTS_QUERY_KEY]})})}},"./packages/packages/core/editor-components/src/init.ts":function(e,t,n){n.r(t),n.d(t,{init:function(){return init}});var o=n("@elementor/editor"),r=n("@elementor/editor-elements-panel"),s=n("@wordpress/i18n"),c=n("./packages/packages/core/editor-components/src/components/components-tab.tsx"),a=n("./packages/packages/core/editor-components/src/components/create-component-form/create-component-form.tsx");function init(){(0,r.injectTab)({id:"components",label:(0,s.__)("Components","elementor"),component:c.ComponentsTab}),(0,o.injectIntoTop)({id:"create-component-popup",component:a.CreateComponentForm})}},"@elementor/editor":function(e){e.exports=window.elementorV2.editor},"@elementor/editor-elements":function(e){e.exports=window.elementorV2.editorElements},"@elementor/editor-elements-panel":function(e){e.exports=window.elementorV2.editorElementsPanel},"@elementor/editor-props":function(e){e.exports=window.elementorV2.editorProps},"@elementor/editor-ui":function(e){e.exports=window.elementorV2.editorUi},"@elementor/http-client":function(e){e.exports=window.elementorV2.httpClient},"@elementor/icons":function(e){e.exports=window.elementorV2.icons},"@elementor/query":function(e){e.exports=window.elementorV2.query},"@elementor/schema":function(e){e.exports=window.elementorV2.schema},"@elementor/ui":function(e){e.exports=window.elementorV2.ui},"@wordpress/i18n":function(e){e.exports=window.wp.i18n},react:function(e){e.exports=window.React}},t={};function __webpack_require__(n){var o=t[n];if(void 0!==o)return o.exports;var r=t[n]={exports:{}};return e[n](r,r.exports,__webpack_require__),r.exports}__webpack_require__.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return __webpack_require__.d(t,{a:t}),t},__webpack_require__.d=function(e,t){for(var n in t)__webpack_require__.o(t,n)&&!__webpack_require__.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},__webpack_require__.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},__webpack_require__.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};!function(){__webpack_require__.r(n),__webpack_require__.d(n,{init:function(){return e.init}});var e=__webpack_require__("./packages/packages/core/editor-components/src/init.ts")}(),(window.elementorV2=window.elementorV2||{}).editorComponents=n}(),window.elementorV2.editorComponents?.init?.();
2934	3	//# sourceMappingURL=editor-components.js.map