@elementor/editor-components 3.33.0-181 → 3.33.0-183
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +122 -11
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +120 -9
- package/dist/index.mjs.map +1 -1
- package/package.json +15 -12
- package/src/api.ts +10 -1
- package/src/hooks/use-components.ts +1 -1
- package/src/hooks/use-create-component.ts +2 -2
- package/src/init.ts +18 -1
- package/src/populate-store.ts +1 -1
- package/src/store/components-styles-provider.ts +24 -0
- package/src/store/load-components-styles.ts +51 -0
- package/src/store/remove-component-styles.ts +9 -0
- package/src/{store.ts → store/store.ts} +23 -7
- package/src/{thunks.ts → store/thunks.ts} +1 -1
- package/src/types.ts +15 -0
- package/src/utils/get-component-ids.ts +24 -0
package/dist/index.js
CHANGED
|
@@ -36,8 +36,11 @@ module.exports = __toCommonJS(index_exports);
|
|
|
36
36
|
|
|
37
37
|
// src/init.ts
|
|
38
38
|
var import_editor = require("@elementor/editor");
|
|
39
|
+
var import_editor_documents = require("@elementor/editor-documents");
|
|
39
40
|
var import_editor_elements_panel = require("@elementor/editor-elements-panel");
|
|
40
|
-
var
|
|
41
|
+
var import_editor_styles_repository2 = require("@elementor/editor-styles-repository");
|
|
42
|
+
var import_editor_v1_adapters2 = require("@elementor/editor-v1-adapters");
|
|
43
|
+
var import_store14 = require("@elementor/store");
|
|
41
44
|
var import_i18n5 = require("@wordpress/i18n");
|
|
42
45
|
|
|
43
46
|
// src/components/components-tab/components.tsx
|
|
@@ -101,21 +104,29 @@ var import_i18n2 = require("@wordpress/i18n");
|
|
|
101
104
|
// src/hooks/use-components.ts
|
|
102
105
|
var import_store3 = require("@elementor/store");
|
|
103
106
|
|
|
104
|
-
// src/store.ts
|
|
107
|
+
// src/store/store.ts
|
|
105
108
|
var import_store2 = require("@elementor/store");
|
|
106
109
|
|
|
107
|
-
// src/thunks.ts
|
|
110
|
+
// src/store/thunks.ts
|
|
108
111
|
var import_store = require("@elementor/store");
|
|
109
112
|
|
|
110
113
|
// src/api.ts
|
|
114
|
+
var import_editor_v1_adapters = require("@elementor/editor-v1-adapters");
|
|
111
115
|
var import_http_client = require("@elementor/http-client");
|
|
112
116
|
var BASE_URL = "elementor/v1/components";
|
|
117
|
+
var getParams = (id) => ({
|
|
118
|
+
action: "get_document_config",
|
|
119
|
+
unique_id: `document-config-${id}`,
|
|
120
|
+
data: { id }
|
|
121
|
+
});
|
|
113
122
|
var apiClient = {
|
|
114
123
|
get: () => (0, import_http_client.httpService)().get(`${BASE_URL}`).then((res) => res.data.data),
|
|
115
|
-
create: (payload) => (0, import_http_client.httpService)().post(`${BASE_URL}`, payload).then((res) => res.data.data)
|
|
124
|
+
create: (payload) => (0, import_http_client.httpService)().post(`${BASE_URL}`, payload).then((res) => res.data.data),
|
|
125
|
+
getComponentConfig: (id) => import_editor_v1_adapters.ajax.load(getParams(id)),
|
|
126
|
+
invalidateComponentConfigCache: (id) => import_editor_v1_adapters.ajax.invalidateCache(getParams(id))
|
|
116
127
|
};
|
|
117
128
|
|
|
118
|
-
// src/thunks.ts
|
|
129
|
+
// src/store/thunks.ts
|
|
119
130
|
var createComponent = (0, import_store.__createAsyncThunk)(
|
|
120
131
|
"components/create",
|
|
121
132
|
async (payload) => {
|
|
@@ -128,11 +139,12 @@ var loadComponents = (0, import_store.__createAsyncThunk)("components/load", asy
|
|
|
128
139
|
return response;
|
|
129
140
|
});
|
|
130
141
|
|
|
131
|
-
// src/store.ts
|
|
142
|
+
// src/store/store.ts
|
|
132
143
|
var initialState = {
|
|
133
144
|
data: [],
|
|
134
145
|
loadStatus: "idle",
|
|
135
|
-
createStatus: "idle"
|
|
146
|
+
createStatus: "idle",
|
|
147
|
+
styles: {}
|
|
136
148
|
};
|
|
137
149
|
var SLICE_NAME = "components";
|
|
138
150
|
var slice = (0, import_store2.__createSlice)({
|
|
@@ -140,10 +152,17 @@ var slice = (0, import_store2.__createSlice)({
|
|
|
140
152
|
initialState,
|
|
141
153
|
reducers: {
|
|
142
154
|
add: (state, { payload }) => {
|
|
143
|
-
state.data
|
|
155
|
+
state.data = { ...payload };
|
|
144
156
|
},
|
|
145
157
|
load: (state, { payload }) => {
|
|
146
158
|
state.data = payload;
|
|
159
|
+
},
|
|
160
|
+
removeStyles(state, { payload }) {
|
|
161
|
+
const { [payload.id]: _, ...rest } = state.styles;
|
|
162
|
+
state.styles = rest;
|
|
163
|
+
},
|
|
164
|
+
addStyles: (state, { payload }) => {
|
|
165
|
+
state.styles = { ...state.styles, ...payload };
|
|
147
166
|
}
|
|
148
167
|
},
|
|
149
168
|
extraReducers: (builder) => {
|
|
@@ -175,11 +194,14 @@ var slice = (0, import_store2.__createSlice)({
|
|
|
175
194
|
var selectData = (state) => state[SLICE_NAME].data;
|
|
176
195
|
var selectLoadStatus = (state) => state[SLICE_NAME].loadStatus;
|
|
177
196
|
var selectCreateStatus = (state) => state[SLICE_NAME].createStatus;
|
|
197
|
+
var selectStylesDefinitions = (state) => state[SLICE_NAME].styles ?? {};
|
|
178
198
|
var selectComponents = (0, import_store2.__createSelector)(selectData, (data) => data);
|
|
179
199
|
var selectLoadIsPending = (0, import_store2.__createSelector)(selectLoadStatus, (status) => status === "pending");
|
|
180
200
|
var selectLoadIsError = (0, import_store2.__createSelector)(selectLoadStatus, (status) => status === "error");
|
|
181
201
|
var selectCreateIsPending = (0, import_store2.__createSelector)(selectCreateStatus, (status) => status === "pending");
|
|
182
202
|
var selectCreateIsError = (0, import_store2.__createSelector)(selectCreateStatus, (status) => status === "error");
|
|
203
|
+
var selectStyles = (state) => state[SLICE_NAME].styles ?? {};
|
|
204
|
+
var selectFlatStyles = (0, import_store2.__createSelector)(selectStylesDefinitions, (data) => Object.values(data).flat());
|
|
183
205
|
|
|
184
206
|
// src/hooks/use-components.ts
|
|
185
207
|
var useComponents = () => {
|
|
@@ -457,11 +479,11 @@ var import_i18n4 = require("@wordpress/i18n");
|
|
|
457
479
|
// src/hooks/use-create-component.ts
|
|
458
480
|
var import_store5 = require("@elementor/store");
|
|
459
481
|
var useCreateComponent = () => {
|
|
460
|
-
const
|
|
482
|
+
const dispatch4 = (0, import_store5.__useDispatch)();
|
|
461
483
|
const isPending = (0, import_store5.__useSelector)(selectCreateIsPending);
|
|
462
484
|
const isError = (0, import_store5.__useSelector)(selectCreateIsError);
|
|
463
485
|
const createComponentAction = async (payload) => {
|
|
464
|
-
const result = await
|
|
486
|
+
const result = await dispatch4(createComponent(payload));
|
|
465
487
|
return result.payload;
|
|
466
488
|
};
|
|
467
489
|
return {
|
|
@@ -698,9 +720,91 @@ function PopulateStore() {
|
|
|
698
720
|
return null;
|
|
699
721
|
}
|
|
700
722
|
|
|
723
|
+
// src/store/components-styles-provider.ts
|
|
724
|
+
var import_editor_styles_repository = require("@elementor/editor-styles-repository");
|
|
725
|
+
var import_store8 = require("@elementor/store");
|
|
726
|
+
var componentsStylesProvider = (0, import_editor_styles_repository.createStylesProvider)({
|
|
727
|
+
key: "components-styles",
|
|
728
|
+
priority: 100,
|
|
729
|
+
subscribe: (cb) => (0, import_store8.__subscribeWithSelector)(
|
|
730
|
+
(state) => state[SLICE_NAME],
|
|
731
|
+
() => {
|
|
732
|
+
cb();
|
|
733
|
+
}
|
|
734
|
+
),
|
|
735
|
+
actions: {
|
|
736
|
+
all: () => {
|
|
737
|
+
return selectFlatStyles((0, import_store8.__getState)());
|
|
738
|
+
},
|
|
739
|
+
get: (id) => {
|
|
740
|
+
return selectFlatStyles((0, import_store8.__getState)()).find((style) => style.id === id) ?? null;
|
|
741
|
+
}
|
|
742
|
+
}
|
|
743
|
+
});
|
|
744
|
+
|
|
745
|
+
// src/store/load-components-styles.ts
|
|
746
|
+
var import_store10 = require("@elementor/store");
|
|
747
|
+
|
|
748
|
+
// src/utils/get-component-ids.ts
|
|
749
|
+
var import_editor_props2 = require("@elementor/editor-props");
|
|
750
|
+
var getComponentIds = (elements) => {
|
|
751
|
+
return elements.flatMap((element) => {
|
|
752
|
+
const ids = [];
|
|
753
|
+
const type = element.widgetType || element.elType;
|
|
754
|
+
if (type === "e-component" && element.settings?.component_id && (0, import_editor_props2.isTransformable)(element.settings?.component_id)) {
|
|
755
|
+
ids.push(element.settings.component_id.value);
|
|
756
|
+
}
|
|
757
|
+
if (element.elements) {
|
|
758
|
+
ids.push(...getComponentIds(element.elements));
|
|
759
|
+
}
|
|
760
|
+
return ids;
|
|
761
|
+
});
|
|
762
|
+
};
|
|
763
|
+
|
|
764
|
+
// src/store/load-components-styles.ts
|
|
765
|
+
async function loadComponentsStyles(elements) {
|
|
766
|
+
const componentIds = Array.from(new Set(getComponentIds(elements)));
|
|
767
|
+
if (!componentIds.length) {
|
|
768
|
+
return;
|
|
769
|
+
}
|
|
770
|
+
const knownComponents = selectStyles((0, import_store10.__getState)());
|
|
771
|
+
const unknownComponentIds = componentIds.filter((id) => !knownComponents[id]);
|
|
772
|
+
if (!unknownComponentIds.length) {
|
|
773
|
+
return;
|
|
774
|
+
}
|
|
775
|
+
addComponentStyles(unknownComponentIds);
|
|
776
|
+
}
|
|
777
|
+
async function addComponentStyles(ids) {
|
|
778
|
+
const newComponents = await loadStyles(ids);
|
|
779
|
+
addStyles(newComponents);
|
|
780
|
+
Object.values(newComponents).forEach(([, data]) => {
|
|
781
|
+
loadComponentsStyles(data.elements);
|
|
782
|
+
});
|
|
783
|
+
}
|
|
784
|
+
async function loadStyles(ids) {
|
|
785
|
+
return Promise.all(ids.map(async (id) => [id, await apiClient.getComponentConfig(id)]));
|
|
786
|
+
}
|
|
787
|
+
function addStyles(data) {
|
|
788
|
+
const styles = Object.fromEntries(
|
|
789
|
+
data.map(([componentId, componentData]) => [componentId, extractStyles(componentData)])
|
|
790
|
+
);
|
|
791
|
+
(0, import_store10.__dispatch)(slice.actions.addStyles(styles));
|
|
792
|
+
}
|
|
793
|
+
function extractStyles(element) {
|
|
794
|
+
return [...Object.values(element.styles ?? {}), ...(element.elements ?? []).flatMap(extractStyles)];
|
|
795
|
+
}
|
|
796
|
+
|
|
797
|
+
// src/store/remove-component-styles.ts
|
|
798
|
+
var import_store12 = require("@elementor/store");
|
|
799
|
+
function removeComponentStyles(id) {
|
|
800
|
+
apiClient.invalidateComponentConfigCache(id);
|
|
801
|
+
(0, import_store12.__dispatch)(slice.actions.removeStyles({ id }));
|
|
802
|
+
}
|
|
803
|
+
|
|
701
804
|
// src/init.ts
|
|
702
805
|
function init() {
|
|
703
|
-
|
|
806
|
+
import_editor_styles_repository2.stylesRepository.register(componentsStylesProvider);
|
|
807
|
+
(0, import_store14.__registerSlice)(slice);
|
|
704
808
|
(0, import_editor_elements_panel.injectTab)({
|
|
705
809
|
id: "components",
|
|
706
810
|
label: (0, import_i18n5.__)("Components", "elementor"),
|
|
@@ -714,6 +818,13 @@ function init() {
|
|
|
714
818
|
id: "components-populate-store",
|
|
715
819
|
component: PopulateStore
|
|
716
820
|
});
|
|
821
|
+
(0, import_editor_v1_adapters2.__privateListenTo)((0, import_editor_v1_adapters2.commandStartEvent)("editor/documents/attach-preview"), () => {
|
|
822
|
+
const { id, config } = (0, import_editor_documents.getV1CurrentDocument)();
|
|
823
|
+
if (id) {
|
|
824
|
+
removeComponentStyles(id);
|
|
825
|
+
}
|
|
826
|
+
loadComponentsStyles(config?.elements ?? []);
|
|
827
|
+
});
|
|
717
828
|
}
|
|
718
829
|
// Annotate the CommonJS export names for ESM import in node:
|
|
719
830
|
0 && (module.exports = {
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/init.ts","../src/components/components-tab/components.tsx","../src/components/components-tab/component-search.tsx","../src/components/components-tab/search-provider.tsx","../src/components/components-tab/components-list.tsx","../src/hooks/use-components.ts","../src/store.ts","../src/thunks.ts","../src/api.ts","../src/components/components-tab/components-item.tsx","../src/utils/get-container-for-new-element.ts","../src/components/create-component-form/utils/replace-element-with-component.ts","../src/components/components-tab/loading-components.tsx","../src/components/create-component-form/create-component-form.tsx","../src/hooks/use-create-component.ts","../src/components/create-component-form/hooks/use-form.ts","../src/components/create-component-form/utils/component-form-schema.ts","../src/populate-store.ts"],"sourcesContent":["export { init } from './init';\n","import { injectIntoLogic, injectIntoTop } from '@elementor/editor';\nimport { injectTab } from '@elementor/editor-elements-panel';\nimport { __registerSlice as registerSlice } from '@elementor/store';\nimport { __ } from '@wordpress/i18n';\n\nimport { Components } from './components/components-tab/components';\nimport { CreateComponentForm } from './components/create-component-form/create-component-form';\nimport { PopulateStore } from './populate-store';\nimport { slice } from './store';\n\nexport function init() {\n\tregisterSlice( slice );\n\n\tinjectTab( {\n\t\tid: 'components',\n\t\tlabel: __( 'Components', 'elementor' ),\n\t\tcomponent: Components,\n\t} );\n\n\tinjectIntoTop( {\n\t\tid: 'create-component-popup',\n\t\tcomponent: CreateComponentForm,\n\t} );\n\n\tinjectIntoLogic( {\n\t\tid: 'components-populate-store',\n\t\tcomponent: PopulateStore,\n\t} );\n}\n","import * as React from 'react';\nimport { ThemeProvider } from '@elementor/editor-ui';\n\nimport { ComponentSearch } from './component-search';\nimport { ComponentsList } from './components-list';\nimport { SearchProvider } from './search-provider';\n\nexport const Components = () => {\n\treturn (\n\t\t<ThemeProvider>\n\t\t\t<SearchProvider localStorageKey=\"elementor-components-search\">\n\t\t\t\t<ComponentSearch />\n\t\t\t\t<ComponentsList />\n\t\t\t</SearchProvider>\n\t\t</ThemeProvider>\n\t);\n};\n","import * as React from 'react';\nimport { SearchIcon } from '@elementor/icons';\nimport { Box, InputAdornment, Stack, TextField } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { useSearch } from './search-provider';\n\nexport const ComponentSearch = () => {\n\tconst { inputValue, handleChange } = useSearch();\n\n\treturn (\n\t\t<Stack direction=\"row\" gap={ 0.5 } sx={ { width: '100%', px: 2, py: 1.5 } }>\n\t\t\t<Box sx={ { flexGrow: 1 } }>\n\t\t\t\t<TextField\n\t\t\t\t\trole={ 'search' }\n\t\t\t\t\tfullWidth\n\t\t\t\t\tsize={ 'tiny' }\n\t\t\t\t\tvalue={ inputValue }\n\t\t\t\t\tplaceholder={ __( 'Search', 'elementor' ) }\n\t\t\t\t\tonChange={ ( e: React.ChangeEvent< HTMLInputElement > ) => handleChange( e.target.value ) }\n\t\t\t\t\tInputProps={ {\n\t\t\t\t\t\tstartAdornment: (\n\t\t\t\t\t\t\t<InputAdornment position=\"start\">\n\t\t\t\t\t\t\t\t<SearchIcon fontSize={ 'tiny' } />\n\t\t\t\t\t\t\t</InputAdornment>\n\t\t\t\t\t\t),\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</Box>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { createContext, useContext } from 'react';\nimport { useSearchState, type UseSearchStateResult } from '@elementor/utils';\n\ntype SearchContextType = Pick< UseSearchStateResult, 'handleChange' | 'inputValue' > & {\n\tsearchValue: UseSearchStateResult[ 'debouncedValue' ];\n\tclearSearch: () => void;\n};\n\nconst SearchContext = createContext< SearchContextType | undefined >( undefined );\n\nexport const SearchProvider = ( {\n\tchildren,\n\tlocalStorageKey,\n}: {\n\tchildren: React.ReactNode;\n\tlocalStorageKey: string;\n} ) => {\n\tconst { debouncedValue, handleChange, inputValue } = useSearchState( { localStorageKey } );\n\n\tconst clearSearch = () => {\n\t\thandleChange( '' );\n\t};\n\n\treturn (\n\t\t<SearchContext.Provider value={ { handleChange, clearSearch, searchValue: debouncedValue, inputValue } }>\n\t\t\t{ children }\n\t\t</SearchContext.Provider>\n\t);\n};\n\nexport const useSearch = () => {\n\tconst context = useContext( SearchContext );\n\tif ( ! context ) {\n\t\tthrow new Error( 'useSearch must be used within a SearchProvider' );\n\t}\n\treturn context;\n};\n","import * as React from 'react';\nimport { ComponentsIcon, EyeIcon } from '@elementor/icons';\nimport { Box, Divider, Icon, Link, List, Stack, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { useComponents } from '../../hooks/use-components';\nimport { ComponentItem } from './components-item';\nimport { LoadingComponents } from './loading-components';\nimport { useSearch } from './search-provider';\n\nexport function ComponentsList() {\n\tconst { components, isLoading, searchValue } = useFilteredComponents();\n\n\tif ( isLoading ) {\n\t\treturn <LoadingComponents />;\n\t}\n\tconst isEmpty = ! components || components.length === 0;\n\tif ( isEmpty ) {\n\t\tif ( searchValue.length > 0 ) {\n\t\t\treturn <EmptySearchResult />;\n\t\t}\n\t\treturn <EmptyState />;\n\t}\n\n\treturn (\n\t\t<List sx={ { display: 'flex', flexDirection: 'column', gap: 1, px: 2 } }>\n\t\t\t{ components.map( ( component ) => (\n\t\t\t\t<ComponentItem key={ component.id } component={ component } />\n\t\t\t) ) }\n\t\t</List>\n\t);\n}\n\nconst EmptyState = () => {\n\treturn (\n\t\t<Stack\n\t\t\talignItems=\"center\"\n\t\t\tjustifyContent=\"center\"\n\t\t\theight=\"100%\"\n\t\t\tsx={ { px: 2.5, pt: 10 } }\n\t\t\tgap={ 1.75 }\n\t\t\toverflow=\"hidden\"\n\t\t>\n\t\t\t<Icon fontSize=\"large\">\n\t\t\t\t<EyeIcon fontSize=\"large\" />\n\t\t\t</Icon>\n\t\t\t<Typography align=\"center\" variant=\"subtitle2\" color=\"text.secondary\" fontWeight=\"bold\">\n\t\t\t\t{ __( 'Text that explains that there are no Components yet.', 'elementor' ) }\n\t\t\t</Typography>\n\t\t\t<Typography variant=\"caption\" align=\"center\" color=\"text.secondary\">\n\t\t\t\t{ __(\n\t\t\t\t\t'Once you have Components, this is where you can manage them—rearrange, duplicate, rename and delete irrelevant classes.',\n\t\t\t\t\t'elementor'\n\t\t\t\t) }\n\t\t\t</Typography>\n\t\t\t<Divider sx={ { width: '100%' } } color=\"text.secondary\" />\n\t\t\t<Typography align=\"left\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t\t{ __( 'To create a component, first design it, then choose one of three options:', 'elementor' ) }\n\t\t\t</Typography>\n\t\t\t<Typography\n\t\t\t\talign=\"left\"\n\t\t\t\tvariant=\"caption\"\n\t\t\t\tcolor=\"text.secondary\"\n\t\t\t\tsx={ { display: 'flex', flexDirection: 'column' } }\n\t\t\t>\n\t\t\t\t<span>{ __( '1. Right-click and select Create Component', 'elementor' ) }</span>\n\t\t\t\t<span>{ __( '2. Use the component icon in the Structure panel', 'elementor' ) }</span>\n\t\t\t\t<span>{ __( '3. Use the component icon in the Edit panel header', 'elementor' ) }</span>\n\t\t\t</Typography>\n\t\t</Stack>\n\t);\n};\n\nconst EmptySearchResult = () => {\n\tconst { searchValue, clearSearch } = useSearch();\n\treturn (\n\t\t<Stack\n\t\t\tcolor={ 'text.secondary' }\n\t\t\tpt={ 5 }\n\t\t\talignItems=\"center\"\n\t\t\tgap={ 1 }\n\t\t\toverflow={ 'hidden' }\n\t\t\tjustifySelf={ 'center' }\n\t\t>\n\t\t\t<ComponentsIcon />\n\t\t\t<Box\n\t\t\t\tsx={ {\n\t\t\t\t\twidth: '100%',\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<Typography align=\"center\" variant=\"subtitle2\" color=\"inherit\">\n\t\t\t\t\t{ __( 'Sorry, nothing matched', 'elementor' ) }\n\t\t\t\t</Typography>\n\t\t\t\t{ searchValue && (\n\t\t\t\t\t<Typography\n\t\t\t\t\t\tvariant=\"subtitle2\"\n\t\t\t\t\t\tcolor=\"inherit\"\n\t\t\t\t\t\tsx={ {\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<span>“</span>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tmaxWidth: '80%',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\ttextOverflow: 'ellipsis',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ searchValue }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<span>”.</span>\n\t\t\t\t\t</Typography>\n\t\t\t\t) }\n\t\t\t</Box>\n\t\t\t<Typography align=\"center\" variant=\"caption\" color=\"inherit\">\n\t\t\t\t{ __( 'Try something else.', 'elementor' ) }\n\t\t\t</Typography>\n\t\t\t<Typography align=\"center\" variant=\"caption\" color=\"inherit\">\n\t\t\t\t<Link color=\"secondary\" variant=\"caption\" component=\"button\" onClick={ clearSearch }>\n\t\t\t\t\t{ __( 'Clear & try again', 'elementor' ) }\n\t\t\t\t</Link>\n\t\t\t</Typography>\n\t\t</Stack>\n\t);\n};\n\nconst useFilteredComponents = () => {\n\tconst { components, isLoading } = useComponents();\n\tconst { searchValue } = useSearch();\n\n\treturn {\n\t\tcomponents: components.filter( ( component ) =>\n\t\t\tcomponent.name.toLowerCase().includes( searchValue.toLowerCase() )\n\t\t),\n\t\tisLoading,\n\t\tsearchValue,\n\t};\n};\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectComponents, selectLoadIsPending } from '../store';\n\nexport const useComponents = () => {\n\tconst components = useSelector( selectComponents );\n\tconst isLoading = useSelector( selectLoadIsPending );\n\n\treturn { components, isLoading };\n};\n","import {\n\t__createSelector as createSelector,\n\t__createSlice as createSlice,\n\ttype PayloadAction,\n\ttype SliceState,\n} from '@elementor/store';\n\nimport { createComponent, loadComponents } from './thunks';\nimport { type Component } from './types';\n\ntype GetComponentResponse = Component[];\n\ntype Status = 'idle' | 'pending' | 'error';\nexport type ComponentsState = {\n\tdata: Component[];\n\tloadStatus: Status;\n\tcreateStatus: Status;\n};\n\nexport const initialState: ComponentsState = {\n\tdata: [],\n\tloadStatus: 'idle',\n\tcreateStatus: 'idle',\n};\n\nconst SLICE_NAME = 'components';\nexport const slice = createSlice( {\n\tname: SLICE_NAME,\n\tinitialState,\n\treducers: {\n\t\tadd: ( state, { payload } ) => {\n\t\t\tstate.data.push( payload );\n\t\t},\n\t\tload: ( state, { payload } ) => {\n\t\t\tstate.data = payload;\n\t\t},\n\t},\n\textraReducers: ( builder ) => {\n\t\tbuilder.addCase( loadComponents.fulfilled, ( state, { payload }: PayloadAction< GetComponentResponse > ) => {\n\t\t\tstate.data = payload;\n\t\t\tstate.loadStatus = 'idle';\n\t\t} );\n\t\tbuilder.addCase( loadComponents.pending, ( state ) => {\n\t\t\tstate.loadStatus = 'pending';\n\t\t} );\n\t\tbuilder.addCase( loadComponents.rejected, ( state ) => {\n\t\t\tstate.loadStatus = 'error';\n\t\t} );\n\t\tbuilder.addCase( createComponent.fulfilled, ( state, { payload, meta } ) => {\n\t\t\tstate.createStatus = 'idle';\n\t\t\tstate.data.push( {\n\t\t\t\tid: payload.component_id,\n\t\t\t\tname: meta.arg.name,\n\t\t\t} );\n\t\t} );\n\t\tbuilder.addCase( createComponent.pending, ( state ) => {\n\t\t\tstate.createStatus = 'pending';\n\t\t} );\n\t\tbuilder.addCase( createComponent.rejected, ( state ) => {\n\t\t\tstate.createStatus = 'error';\n\t\t} );\n\t},\n} );\n\nconst selectData = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].data;\nconst selectLoadStatus = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].loadStatus;\nconst selectCreateStatus = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].createStatus;\n\nexport const selectComponents = createSelector( selectData, ( data: Component[] ) => data );\nexport const selectLoadIsPending = createSelector( selectLoadStatus, ( status ) => status === 'pending' );\nexport const selectLoadIsError = createSelector( selectLoadStatus, ( status ) => status === 'error' );\nexport const selectCreateIsPending = createSelector( selectCreateStatus, ( status ) => status === 'pending' );\nexport const selectCreateIsError = createSelector( selectCreateStatus, ( status ) => status === 'error' );\n","import { __createAsyncThunk as createAsyncThunk } from '@elementor/store';\n\nimport { apiClient, type CreateComponentPayload, type CreateComponentResponse } from './api';\n\nconst createComponent = createAsyncThunk< CreateComponentResponse, CreateComponentPayload >(\n\t'components/create',\n\tasync ( payload: CreateComponentPayload ) => {\n\t\tconst response = await apiClient.create( payload );\n\t\treturn { ...response, name: payload.name };\n\t}\n);\n\nconst loadComponents = createAsyncThunk( 'components/load', async () => {\n\tconst response = await apiClient.get();\n\treturn response;\n} );\n\nexport { createComponent, loadComponents };\n","import { type V1ElementModelProps } from '@elementor/editor-elements';\nimport { type HttpResponse, httpService } from '@elementor/http-client';\n\nimport { type Component } from './types';\n\nconst BASE_URL = 'elementor/v1/components';\n\nexport type CreateComponentPayload = {\n\tname: string;\n\tcontent: V1ElementModelProps[];\n};\n\ntype GetComponentResponse = Array< Component >;\n\nexport type CreateComponentResponse = {\n\tcomponent_id: number;\n};\n\nexport const apiClient = {\n\tget: () =>\n\t\thttpService()\n\t\t\t.get< HttpResponse< GetComponentResponse > >( `${ BASE_URL }` )\n\t\t\t.then( ( res ) => res.data.data ),\n\tcreate: ( payload: CreateComponentPayload ) =>\n\t\thttpService()\n\t\t\t.post< HttpResponse< CreateComponentResponse > >( `${ BASE_URL }`, payload )\n\t\t\t.then( ( res ) => res.data.data ),\n};\n","import * as React from 'react';\nimport { endDragElementFromPanel, startDragElementFromPanel } from '@elementor/editor-canvas';\nimport { dropElement, type DropElementParams } from '@elementor/editor-elements';\nimport { ComponentsIcon } from '@elementor/icons';\nimport { Box, ListItemButton, ListItemIcon, ListItemText, Typography } from '@elementor/ui';\n\nimport { type Component } from '../../types';\nimport { getContainerForNewElement } from '../../utils/get-container-for-new-element';\nimport { createComponentModel } from '../create-component-form/utils/replace-element-with-component';\n\nexport const ComponentItem = ( { component }: { component: Component } ) => {\n\tconst componentModel = createComponentModel( { id: component.id, name: component.name } );\n\n\tconst handleClick = () => {\n\t\taddComponentToPage( componentModel );\n\t};\n\n\treturn (\n\t\t<ListItemButton\n\t\t\tdraggable\n\t\t\tonDragStart={ () => startDragElementFromPanel( componentModel ) }\n\t\t\tonDragEnd={ endDragElementFromPanel }\n\t\t\tshape=\"rounded\"\n\t\t\tsx={ { border: 'solid 1px', borderColor: 'divider', py: 0.5, px: 1 } }\n\t\t>\n\t\t\t<Box sx={ { display: 'flex', width: '100%', alignItems: 'center', gap: 1 } } onClick={ handleClick }>\n\t\t\t\t<ListItemIcon size=\"tiny\">\n\t\t\t\t\t<ComponentsIcon fontSize=\"tiny\" />\n\t\t\t\t</ListItemIcon>\n\t\t\t\t<ListItemText\n\t\t\t\t\tprimary={\n\t\t\t\t\t\t<Typography variant=\"caption\" sx={ { color: 'text.primary' } }>\n\t\t\t\t\t\t\t{ component.name }\n\t\t\t\t\t\t</Typography>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</Box>\n\t\t</ListItemButton>\n\t);\n};\n\nconst addComponentToPage = ( model: DropElementParams[ 'model' ] ) => {\n\tconst { container, options } = getContainerForNewElement();\n\n\tif ( ! container ) {\n\t\tthrow new Error( `Can't find container to drop new component instance at` );\n\t}\n\n\tdropElement( {\n\t\tcontainerId: container.id,\n\t\tmodel,\n\t\toptions: { ...options, useHistory: false, scrollIntoView: true },\n\t} );\n};\n","import {\n\tgetContainer,\n\tgetCurrentDocumentContainer,\n\tgetSelectedElements,\n\ttype V1Element,\n} from '@elementor/editor-elements';\n\nexport const getContainerForNewElement = (): { container: V1Element | null; options?: { at: number } } => {\n\tconst currentDocumentContainer = getCurrentDocumentContainer();\n\tconst selectedElement = getSelectedElementContainer();\n\n\tlet container, options;\n\n\tif ( selectedElement ) {\n\t\tswitch ( selectedElement.model.get( 'elType' ) ) {\n\t\t\tcase 'widget': {\n\t\t\t\tcontainer = selectedElement?.parent;\n\n\t\t\t\tconst selectedElIndex = selectedElement.view?._index ?? -1;\n\n\t\t\t\tif ( selectedElIndex > -1 ) {\n\t\t\t\t\toptions = { at: selectedElIndex + 1 };\n\t\t\t\t}\n\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tcase 'section': {\n\t\t\t\tcontainer = selectedElement?.children?.[ 0 ];\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tdefault: {\n\t\t\t\tcontainer = selectedElement;\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t}\n\n\treturn { container: container ?? currentDocumentContainer, options };\n};\n\nfunction getSelectedElementContainer() {\n\tconst selectedElements = getSelectedElements();\n\n\tif ( selectedElements.length !== 1 ) {\n\t\treturn undefined;\n\t}\n\n\treturn getContainer( selectedElements[ 0 ].id );\n}\n","import { replaceElement, type V1Element } from '@elementor/editor-elements';\nimport { numberPropTypeUtil } from '@elementor/editor-props';\n\nimport { type Component } from '../../../types';\n\nexport const replaceElementWithComponent = async ( element: V1Element, component: Component ) => {\n\treplaceElement( {\n\t\tcurrentElement: element,\n\t\tnewElement: createComponentModel( component ),\n\t\twithHistory: false,\n\t} );\n};\n\nexport const createComponentModel = ( component: Component ) => {\n\treturn {\n\t\telType: 'widget',\n\t\twidgetType: 'e-component',\n\t\tsettings: {\n\t\t\tcomponent_id: numberPropTypeUtil.create( component.id ),\n\t\t},\n\t\teditor_settings: {\n\t\t\ttitle: component.name,\n\t\t},\n\t};\n};\n","import * as React from 'react';\nimport { Box, ListItemButton, Skeleton, Stack } from '@elementor/ui';\nconst ROWS_COUNT = 6;\n\nconst rows = Array.from( { length: ROWS_COUNT }, ( _, index ) => index );\n\nexport const LoadingComponents = () => {\n\treturn (\n\t\t<Stack\n\t\t\taria-label=\"Loading components\"\n\t\t\tgap={ 1 }\n\t\t\tsx={ {\n\t\t\t\tpointerEvents: 'none',\n\t\t\t\tposition: 'relative',\n\t\t\t\tmaxHeight: '300px',\n\t\t\t\toverflow: 'hidden',\n\t\t\t\t'&:after': {\n\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\ttop: 0,\n\t\t\t\t\tcontent: '\"\"',\n\t\t\t\t\tleft: 0,\n\t\t\t\t\twidth: '100%',\n\t\t\t\t\theight: '300px',\n\t\t\t\t\tbackground: 'linear-gradient(to top, white, transparent)',\n\t\t\t\t\tpointerEvents: 'none',\n\t\t\t\t},\n\t\t\t} }\n\t\t>\n\t\t\t{ rows.map( ( row ) => (\n\t\t\t\t<ListItemButton\n\t\t\t\t\tkey={ row }\n\t\t\t\t\tsx={ { border: 'solid 1px', borderColor: 'divider', py: 0.5, px: 1 } }\n\t\t\t\t\tshape=\"rounded\"\n\t\t\t\t>\n\t\t\t\t\t<Box display=\"flex\" gap={ 1 } width=\"100%\">\n\t\t\t\t\t\t<Skeleton variant=\"text\" width={ '24px' } height={ '36px' } />\n\t\t\t\t\t\t<Skeleton variant=\"text\" width={ '100%' } height={ '36px' } />\n\t\t\t\t\t</Box>\n\t\t\t\t</ListItemButton>\n\t\t\t) ) }\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { useEffect, useMemo, useState } from 'react';\nimport { getElementLabel, type V1Element } from '@elementor/editor-elements';\nimport { ThemeProvider } from '@elementor/editor-ui';\nimport { StarIcon } from '@elementor/icons';\nimport { Alert, Button, FormLabel, Grid, Popover, Snackbar, Stack, TextField, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { useComponents } from '../../hooks/use-components';\nimport { useCreateComponent } from '../../hooks/use-create-component';\nimport { type ComponentFormValues } from '../../types';\nimport { useForm } from './hooks/use-form';\nimport { createBaseComponentSchema, createSubmitComponentSchema } from './utils/component-form-schema';\nimport { replaceElementWithComponent } from './utils/replace-element-with-component';\n\ntype SaveAsComponentEventData = {\n\telement: V1Element;\n\tanchorPosition: { top: number; left: number };\n};\n\ntype ResultNotification = {\n\tshow: boolean;\n\tmessage: string;\n\ttype: 'success' | 'error';\n};\n\nexport function CreateComponentForm() {\n\tconst [ element, setElement ] = useState< {\n\t\telement: V1Element;\n\t\telementLabel: string;\n\t} | null >( null );\n\n\tconst [ anchorPosition, setAnchorPosition ] = useState< { top: number; left: number } >();\n\n\tconst [ resultNotification, setResultNotification ] = useState< ResultNotification | null >( null );\n\n\tconst { createComponent, isPending } = useCreateComponent();\n\tuseEffect( () => {\n\t\tconst OPEN_SAVE_AS_COMPONENT_FORM_EVENT = 'elementor/editor/open-save-as-component-form';\n\n\t\tconst openPopup = ( event: CustomEvent< SaveAsComponentEventData > ) => {\n\t\t\tsetElement( { element: event.detail.element, elementLabel: getElementLabel( event.detail.element.id ) } );\n\t\t\tsetAnchorPosition( event.detail.anchorPosition );\n\t\t};\n\n\t\twindow.addEventListener( OPEN_SAVE_AS_COMPONENT_FORM_EVENT, openPopup as EventListener );\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener( OPEN_SAVE_AS_COMPONENT_FORM_EVENT, openPopup as EventListener );\n\t\t};\n\t}, [] );\n\n\tconst handleSave = async ( values: ComponentFormValues ) => {\n\t\tif ( ! element ) {\n\t\t\tthrow new Error( `Can't save element as component: element not found` );\n\t\t}\n\n\t\ttry {\n\t\t\tconst result = await createComponent( {\n\t\t\t\tname: values.componentName,\n\t\t\t\tcontent: [ element.element.model.toJSON( { remove: [ 'default' ] } ) ],\n\t\t\t} );\n\n\t\t\tif ( ! element ) {\n\t\t\t\tthrow new Error( `Can't replace element with component: element not found` );\n\t\t\t}\n\n\t\t\treplaceElementWithComponent( element.element, {\n\t\t\t\tid: result.component_id,\n\t\t\t\tname: values.componentName,\n\t\t\t} );\n\n\t\t\tsetResultNotification( {\n\t\t\t\tshow: true,\n\t\t\t\t// Translators: %1$s: Component name, %2$s: Component ID\n\t\t\t\tmessage: __( 'Component saved successfully as: %1$s (ID: %2$s)', 'elementor' )\n\t\t\t\t\t.replace( '%1$s', values.componentName )\n\t\t\t\t\t.replace( '%2$s', result.component_id.toString() ),\n\t\t\t\ttype: 'success',\n\t\t\t} );\n\n\t\t\tresetAndClosePopup();\n\t\t} catch {\n\t\t\tconst errorMessage = __( 'Failed to save component. Please try again.', 'elementor' );\n\t\t\tsetResultNotification( {\n\t\t\t\tshow: true,\n\t\t\t\tmessage: errorMessage,\n\t\t\t\ttype: 'error',\n\t\t\t} );\n\t\t}\n\t};\n\n\tconst resetAndClosePopup = () => {\n\t\tsetElement( null );\n\t\tsetAnchorPosition( undefined );\n\t};\n\n\treturn (\n\t\t<ThemeProvider>\n\t\t\t<Popover\n\t\t\t\topen={ element !== null }\n\t\t\t\tonClose={ resetAndClosePopup }\n\t\t\t\tanchorReference=\"anchorPosition\"\n\t\t\t\tanchorPosition={ anchorPosition }\n\t\t\t>\n\t\t\t\t{ element !== null && (\n\t\t\t\t\t<Form\n\t\t\t\t\t\tinitialValues={ { componentName: element.elementLabel } }\n\t\t\t\t\t\thandleSave={ handleSave }\n\t\t\t\t\t\tisSubmitting={ isPending }\n\t\t\t\t\t\tclosePopup={ resetAndClosePopup }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</Popover>\n\t\t\t<Snackbar open={ resultNotification?.show } onClose={ () => setResultNotification( null ) }>\n\t\t\t\t<Alert\n\t\t\t\t\tonClose={ () => setResultNotification( null ) }\n\t\t\t\t\tseverity={ resultNotification?.type }\n\t\t\t\t\tsx={ { width: '100%' } }\n\t\t\t\t>\n\t\t\t\t\t{ resultNotification?.message }\n\t\t\t\t</Alert>\n\t\t\t</Snackbar>\n\t\t</ThemeProvider>\n\t);\n}\n\nconst FONT_SIZE = 'tiny';\n\nconst Form = ( {\n\tinitialValues,\n\thandleSave,\n\tisSubmitting,\n\tclosePopup,\n}: {\n\tinitialValues: ComponentFormValues;\n\thandleSave: ( values: ComponentFormValues ) => void;\n\tisSubmitting: boolean;\n\tclosePopup: () => void;\n} ) => {\n\tconst { values, errors, isValid, handleChange, validateForm } = useForm< ComponentFormValues >( initialValues );\n\n\tconst { components } = useComponents();\n\n\tconst existingComponentNames = useMemo( () => {\n\t\treturn components?.map( ( component ) => component.name ) ?? [];\n\t}, [ components ] );\n\n\tconst changeValidationSchema = useMemo(\n\t\t() => createBaseComponentSchema( existingComponentNames ),\n\t\t[ existingComponentNames ]\n\t);\n\tconst submitValidationSchema = useMemo(\n\t\t() => createSubmitComponentSchema( existingComponentNames ),\n\t\t[ existingComponentNames ]\n\t);\n\n\tconst handleSubmit = () => {\n\t\tconst { success, parsedValues } = validateForm( submitValidationSchema );\n\n\t\tif ( success ) {\n\t\t\thandleSave( parsedValues );\n\t\t}\n\t};\n\n\treturn (\n\t\t<Stack alignItems=\"start\" width=\"268px\">\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\talignItems=\"center\"\n\t\t\t\tpy={ 1 }\n\t\t\t\tpx={ 1.5 }\n\t\t\t\tsx={ { columnGap: 0.5, borderBottom: '1px solid', borderColor: 'divider', width: '100%' } }\n\t\t\t>\n\t\t\t\t<StarIcon fontSize={ FONT_SIZE } />\n\t\t\t\t<Typography variant=\"caption\" sx={ { color: 'text.primary', fontWeight: '500', lineHeight: 1 } }>\n\t\t\t\t\t{ __( 'Save as a component', 'elementor' ) }\n\t\t\t\t</Typography>\n\t\t\t</Stack>\n\t\t\t<Grid container gap={ 0.75 } alignItems=\"start\" p={ 1.5 }>\n\t\t\t\t<Grid item xs={ 12 }>\n\t\t\t\t\t<FormLabel htmlFor={ 'component-name' } size=\"tiny\">\n\t\t\t\t\t\t{ __( 'Name', 'elementor' ) }\n\t\t\t\t\t</FormLabel>\n\t\t\t\t</Grid>\n\t\t\t\t<Grid item xs={ 12 }>\n\t\t\t\t\t<TextField\n\t\t\t\t\t\tid={ 'component-name' }\n\t\t\t\t\t\tsize={ FONT_SIZE }\n\t\t\t\t\t\tfullWidth\n\t\t\t\t\t\tvalue={ values.componentName }\n\t\t\t\t\t\tonChange={ ( e: React.ChangeEvent< HTMLInputElement > ) =>\n\t\t\t\t\t\t\thandleChange( e, 'componentName', changeValidationSchema )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tinputProps={ { style: { color: 'text.primary', fontWeight: '600' } } }\n\t\t\t\t\t\terror={ Boolean( errors.componentName ) }\n\t\t\t\t\t\thelperText={ errors.componentName }\n\t\t\t\t\t/>\n\t\t\t\t</Grid>\n\t\t\t</Grid>\n\t\t\t<Stack direction=\"row\" justifyContent=\"flex-end\" alignSelf=\"end\" py={ 1 } px={ 1.5 }>\n\t\t\t\t<Button onClick={ closePopup } disabled={ isSubmitting } color=\"secondary\" variant=\"text\" size=\"small\">\n\t\t\t\t\t{ __( 'Cancel', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t\t<Button\n\t\t\t\t\tonClick={ handleSubmit }\n\t\t\t\t\tdisabled={ isSubmitting || ! isValid }\n\t\t\t\t\tvariant=\"contained\"\n\t\t\t\t\tcolor=\"primary\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t>\n\t\t\t\t\t{ isSubmitting ? __( 'Creating…', 'elementor' ) : __( 'Create', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t</Stack>\n\t\t</Stack>\n\t);\n};\n","import { __useDispatch as useDispatch, __useSelector as useSelector, type AnyAction } from '@elementor/store';\n\nimport { type CreateComponentPayload } from '../api';\nimport { selectCreateIsError, selectCreateIsPending } from '../store';\nimport { createComponent } from '../thunks';\n\nexport const useCreateComponent = () => {\n\tconst dispatch = useDispatch();\n\tconst isPending = useSelector( selectCreateIsPending );\n\tconst isError = useSelector( selectCreateIsError );\n\n\tconst createComponentAction = async ( payload: CreateComponentPayload ) => {\n\t\tconst result = await dispatch( createComponent( payload ) as unknown as AnyAction );\n\t\treturn result.payload;\n\t};\n\n\treturn {\n\t\tcreateComponent: createComponentAction,\n\t\tisPending,\n\t\tisError,\n\t};\n};\n","import { useMemo, useState } from 'react';\nimport { type z } from '@elementor/schema';\n\nexport const useForm = < TValues extends Record< string, unknown > >( initialValues: TValues ) => {\n\tconst [ values, setValues ] = useState< TValues >( initialValues );\n\tconst [ errors, setErrors ] = useState< Partial< Record< keyof TValues, string > > >( {} );\n\n\tconst isValid = useMemo( () => {\n\t\treturn ! Object.values( errors ).some( ( error ) => error );\n\t}, [ errors ] );\n\n\tconst handleChange = (\n\t\te: React.ChangeEvent< HTMLInputElement >,\n\t\tfield: keyof TValues,\n\t\tvalidationSchema: z.ZodType< TValues >\n\t) => {\n\t\tconst updated = { ...values, [ field ]: e.target.value };\n\t\tsetValues( updated );\n\n\t\tconst { success, errors: validationErrors } = validateForm( updated, validationSchema );\n\n\t\tif ( ! success ) {\n\t\t\tsetErrors( validationErrors );\n\t\t} else {\n\t\t\tsetErrors( {} );\n\t\t}\n\t};\n\n\tconst validate = (\n\t\tvalidationSchema: z.ZodType< TValues >\n\t): { success: true; parsedValues: TValues } | { success: false; parsedValues?: never } => {\n\t\tconst { success, errors: validationErrors, parsedValues } = validateForm( values, validationSchema );\n\n\t\tif ( ! success ) {\n\t\t\tsetErrors( validationErrors );\n\t\t\treturn { success };\n\t\t}\n\t\tsetErrors( {} );\n\t\treturn { success, parsedValues };\n\t};\n\n\treturn {\n\t\tvalues,\n\t\terrors,\n\t\tisValid,\n\t\thandleChange,\n\t\tvalidateForm: validate,\n\t};\n};\n\nconst validateForm = < TValues extends Record< string, unknown > >(\n\tvalues: TValues,\n\tschema: z.ZodType< TValues >\n):\n\t| { success: false; parsedValues?: never; errors: Partial< Record< keyof TValues, string > > }\n\t| { success: true; parsedValues: TValues; errors?: never } => {\n\tconst result = schema.safeParse( values );\n\n\tif ( result.success ) {\n\t\treturn { success: true, parsedValues: result.data };\n\t}\n\n\tconst errors = {} as Partial< Record< keyof TValues, string > >;\n\n\t( Object.entries( result.error.formErrors.fieldErrors ) as Array< [ keyof TValues, string[] ] > ).forEach(\n\t\t( [ field, error ] ) => {\n\t\t\terrors[ field ] = error[ 0 ];\n\t\t}\n\t);\n\n\treturn { success: false, errors };\n};\n","import { z } from '@elementor/schema';\nimport { __ } from '@wordpress/i18n';\n\nconst MIN_NAME_LENGTH = 2;\nconst MAX_NAME_LENGTH = 50;\n\nexport const createBaseComponentSchema = ( existingNames: string[] ) => {\n\treturn z.object( {\n\t\tcomponentName: z\n\t\t\t.string()\n\t\t\t.trim()\n\t\t\t.max(\n\t\t\t\tMAX_NAME_LENGTH,\n\t\t\t\t__( 'Component name is too long. Please keep it under 50 characters.', 'elementor' )\n\t\t\t)\n\t\t\t.refine( ( value ) => ! existingNames.includes( value ), {\n\t\t\t\tmessage: __( 'Component name already exists', 'elementor' ),\n\t\t\t} ),\n\t} );\n};\n\nexport const createSubmitComponentSchema = ( existingNames: string[] ) => {\n\tconst baseSchema = createBaseComponentSchema( existingNames );\n\n\treturn baseSchema.extend( {\n\t\tcomponentName: baseSchema.shape.componentName\n\t\t\t.refine( ( value ) => value.length > 0, {\n\t\t\t\tmessage: __( 'Component name is required.', 'elementor' ),\n\t\t\t} )\n\t\t\t.refine( ( value ) => value.length >= MIN_NAME_LENGTH, {\n\t\t\t\tmessage: __( 'Component name is too short. Please enter at least 2 characters.', 'elementor' ),\n\t\t\t} ),\n\t} );\n};\n","import { useEffect } from 'react';\nimport { __dispatch as dispatch } from '@elementor/store';\n\nimport { loadComponents } from './thunks';\n\nexport function PopulateStore() {\n\tuseEffect( () => {\n\t\tdispatch( loadComponents() );\n\t}, [] );\n\n\treturn null;\n}\n"],"mappings":"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","names":["import_store","import_i18n","React","React","React","import_icons","import_ui","import_i18n","import_store","import_store","createAsyncThunk","createSlice","createSelector","useSelector","React","import_editor_elements","import_icons","import_ui","import_editor_elements","React","import_ui","React","import_react","import_editor_elements","import_editor_ui","import_icons","import_ui","import_i18n","import_store","dispatch","useDispatch","useSelector","import_react","import_i18n","createComponent","validateForm","import_react","import_store","dispatch","registerSlice"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/init.ts","../src/components/components-tab/components.tsx","../src/components/components-tab/component-search.tsx","../src/components/components-tab/search-provider.tsx","../src/components/components-tab/components-list.tsx","../src/hooks/use-components.ts","../src/store/store.ts","../src/store/thunks.ts","../src/api.ts","../src/components/components-tab/components-item.tsx","../src/utils/get-container-for-new-element.ts","../src/components/create-component-form/utils/replace-element-with-component.ts","../src/components/components-tab/loading-components.tsx","../src/components/create-component-form/create-component-form.tsx","../src/hooks/use-create-component.ts","../src/components/create-component-form/hooks/use-form.ts","../src/components/create-component-form/utils/component-form-schema.ts","../src/populate-store.ts","../src/store/components-styles-provider.ts","../src/store/load-components-styles.ts","../src/utils/get-component-ids.ts","../src/store/remove-component-styles.ts"],"sourcesContent":["export { init } from './init';\n","import { injectIntoLogic, injectIntoTop } from '@elementor/editor';\nimport { getV1CurrentDocument } from '@elementor/editor-documents';\nimport { injectTab } from '@elementor/editor-elements-panel';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { __privateListenTo as listenTo, commandStartEvent } from '@elementor/editor-v1-adapters';\nimport { __registerSlice as registerSlice } from '@elementor/store';\nimport { __ } from '@wordpress/i18n';\n\nimport { Components } from './components/components-tab/components';\nimport { CreateComponentForm } from './components/create-component-form/create-component-form';\nimport { PopulateStore } from './populate-store';\nimport { componentsStylesProvider } from './store/components-styles-provider';\nimport { loadComponentsStyles } from './store/load-components-styles';\nimport { removeComponentStyles } from './store/remove-component-styles';\nimport { slice } from './store/store';\nimport { type Element } from './types';\n\nexport function init() {\n\tstylesRepository.register( componentsStylesProvider );\n\tregisterSlice( slice );\n\n\tinjectTab( {\n\t\tid: 'components',\n\t\tlabel: __( 'Components', 'elementor' ),\n\t\tcomponent: Components,\n\t} );\n\n\tinjectIntoTop( {\n\t\tid: 'create-component-popup',\n\t\tcomponent: CreateComponentForm,\n\t} );\n\n\tinjectIntoLogic( {\n\t\tid: 'components-populate-store',\n\t\tcomponent: PopulateStore,\n\t} );\n\tlistenTo( commandStartEvent( 'editor/documents/attach-preview' ), () => {\n\t\tconst { id, config } = getV1CurrentDocument();\n\n\t\tif ( id ) {\n\t\t\tremoveComponentStyles( id );\n\t\t}\n\n\t\tloadComponentsStyles( ( config?.elements as Element[] ) ?? [] );\n\t} );\n}\n","import * as React from 'react';\nimport { ThemeProvider } from '@elementor/editor-ui';\n\nimport { ComponentSearch } from './component-search';\nimport { ComponentsList } from './components-list';\nimport { SearchProvider } from './search-provider';\n\nexport const Components = () => {\n\treturn (\n\t\t<ThemeProvider>\n\t\t\t<SearchProvider localStorageKey=\"elementor-components-search\">\n\t\t\t\t<ComponentSearch />\n\t\t\t\t<ComponentsList />\n\t\t\t</SearchProvider>\n\t\t</ThemeProvider>\n\t);\n};\n","import * as React from 'react';\nimport { SearchIcon } from '@elementor/icons';\nimport { Box, InputAdornment, Stack, TextField } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { useSearch } from './search-provider';\n\nexport const ComponentSearch = () => {\n\tconst { inputValue, handleChange } = useSearch();\n\n\treturn (\n\t\t<Stack direction=\"row\" gap={ 0.5 } sx={ { width: '100%', px: 2, py: 1.5 } }>\n\t\t\t<Box sx={ { flexGrow: 1 } }>\n\t\t\t\t<TextField\n\t\t\t\t\trole={ 'search' }\n\t\t\t\t\tfullWidth\n\t\t\t\t\tsize={ 'tiny' }\n\t\t\t\t\tvalue={ inputValue }\n\t\t\t\t\tplaceholder={ __( 'Search', 'elementor' ) }\n\t\t\t\t\tonChange={ ( e: React.ChangeEvent< HTMLInputElement > ) => handleChange( e.target.value ) }\n\t\t\t\t\tInputProps={ {\n\t\t\t\t\t\tstartAdornment: (\n\t\t\t\t\t\t\t<InputAdornment position=\"start\">\n\t\t\t\t\t\t\t\t<SearchIcon fontSize={ 'tiny' } />\n\t\t\t\t\t\t\t</InputAdornment>\n\t\t\t\t\t\t),\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</Box>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { createContext, useContext } from 'react';\nimport { useSearchState, type UseSearchStateResult } from '@elementor/utils';\n\ntype SearchContextType = Pick< UseSearchStateResult, 'handleChange' | 'inputValue' > & {\n\tsearchValue: UseSearchStateResult[ 'debouncedValue' ];\n\tclearSearch: () => void;\n};\n\nconst SearchContext = createContext< SearchContextType | undefined >( undefined );\n\nexport const SearchProvider = ( {\n\tchildren,\n\tlocalStorageKey,\n}: {\n\tchildren: React.ReactNode;\n\tlocalStorageKey: string;\n} ) => {\n\tconst { debouncedValue, handleChange, inputValue } = useSearchState( { localStorageKey } );\n\n\tconst clearSearch = () => {\n\t\thandleChange( '' );\n\t};\n\n\treturn (\n\t\t<SearchContext.Provider value={ { handleChange, clearSearch, searchValue: debouncedValue, inputValue } }>\n\t\t\t{ children }\n\t\t</SearchContext.Provider>\n\t);\n};\n\nexport const useSearch = () => {\n\tconst context = useContext( SearchContext );\n\tif ( ! context ) {\n\t\tthrow new Error( 'useSearch must be used within a SearchProvider' );\n\t}\n\treturn context;\n};\n","import * as React from 'react';\nimport { ComponentsIcon, EyeIcon } from '@elementor/icons';\nimport { Box, Divider, Icon, Link, List, Stack, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { useComponents } from '../../hooks/use-components';\nimport { ComponentItem } from './components-item';\nimport { LoadingComponents } from './loading-components';\nimport { useSearch } from './search-provider';\n\nexport function ComponentsList() {\n\tconst { components, isLoading, searchValue } = useFilteredComponents();\n\n\tif ( isLoading ) {\n\t\treturn <LoadingComponents />;\n\t}\n\tconst isEmpty = ! components || components.length === 0;\n\tif ( isEmpty ) {\n\t\tif ( searchValue.length > 0 ) {\n\t\t\treturn <EmptySearchResult />;\n\t\t}\n\t\treturn <EmptyState />;\n\t}\n\n\treturn (\n\t\t<List sx={ { display: 'flex', flexDirection: 'column', gap: 1, px: 2 } }>\n\t\t\t{ components.map( ( component ) => (\n\t\t\t\t<ComponentItem key={ component.id } component={ component } />\n\t\t\t) ) }\n\t\t</List>\n\t);\n}\n\nconst EmptyState = () => {\n\treturn (\n\t\t<Stack\n\t\t\talignItems=\"center\"\n\t\t\tjustifyContent=\"center\"\n\t\t\theight=\"100%\"\n\t\t\tsx={ { px: 2.5, pt: 10 } }\n\t\t\tgap={ 1.75 }\n\t\t\toverflow=\"hidden\"\n\t\t>\n\t\t\t<Icon fontSize=\"large\">\n\t\t\t\t<EyeIcon fontSize=\"large\" />\n\t\t\t</Icon>\n\t\t\t<Typography align=\"center\" variant=\"subtitle2\" color=\"text.secondary\" fontWeight=\"bold\">\n\t\t\t\t{ __( 'Text that explains that there are no Components yet.', 'elementor' ) }\n\t\t\t</Typography>\n\t\t\t<Typography variant=\"caption\" align=\"center\" color=\"text.secondary\">\n\t\t\t\t{ __(\n\t\t\t\t\t'Once you have Components, this is where you can manage them—rearrange, duplicate, rename and delete irrelevant classes.',\n\t\t\t\t\t'elementor'\n\t\t\t\t) }\n\t\t\t</Typography>\n\t\t\t<Divider sx={ { width: '100%' } } color=\"text.secondary\" />\n\t\t\t<Typography align=\"left\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t\t{ __( 'To create a component, first design it, then choose one of three options:', 'elementor' ) }\n\t\t\t</Typography>\n\t\t\t<Typography\n\t\t\t\talign=\"left\"\n\t\t\t\tvariant=\"caption\"\n\t\t\t\tcolor=\"text.secondary\"\n\t\t\t\tsx={ { display: 'flex', flexDirection: 'column' } }\n\t\t\t>\n\t\t\t\t<span>{ __( '1. Right-click and select Create Component', 'elementor' ) }</span>\n\t\t\t\t<span>{ __( '2. Use the component icon in the Structure panel', 'elementor' ) }</span>\n\t\t\t\t<span>{ __( '3. Use the component icon in the Edit panel header', 'elementor' ) }</span>\n\t\t\t</Typography>\n\t\t</Stack>\n\t);\n};\n\nconst EmptySearchResult = () => {\n\tconst { searchValue, clearSearch } = useSearch();\n\treturn (\n\t\t<Stack\n\t\t\tcolor={ 'text.secondary' }\n\t\t\tpt={ 5 }\n\t\t\talignItems=\"center\"\n\t\t\tgap={ 1 }\n\t\t\toverflow={ 'hidden' }\n\t\t\tjustifySelf={ 'center' }\n\t\t>\n\t\t\t<ComponentsIcon />\n\t\t\t<Box\n\t\t\t\tsx={ {\n\t\t\t\t\twidth: '100%',\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<Typography align=\"center\" variant=\"subtitle2\" color=\"inherit\">\n\t\t\t\t\t{ __( 'Sorry, nothing matched', 'elementor' ) }\n\t\t\t\t</Typography>\n\t\t\t\t{ searchValue && (\n\t\t\t\t\t<Typography\n\t\t\t\t\t\tvariant=\"subtitle2\"\n\t\t\t\t\t\tcolor=\"inherit\"\n\t\t\t\t\t\tsx={ {\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<span>“</span>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tmaxWidth: '80%',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\ttextOverflow: 'ellipsis',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ searchValue }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<span>”.</span>\n\t\t\t\t\t</Typography>\n\t\t\t\t) }\n\t\t\t</Box>\n\t\t\t<Typography align=\"center\" variant=\"caption\" color=\"inherit\">\n\t\t\t\t{ __( 'Try something else.', 'elementor' ) }\n\t\t\t</Typography>\n\t\t\t<Typography align=\"center\" variant=\"caption\" color=\"inherit\">\n\t\t\t\t<Link color=\"secondary\" variant=\"caption\" component=\"button\" onClick={ clearSearch }>\n\t\t\t\t\t{ __( 'Clear & try again', 'elementor' ) }\n\t\t\t\t</Link>\n\t\t\t</Typography>\n\t\t</Stack>\n\t);\n};\n\nconst useFilteredComponents = () => {\n\tconst { components, isLoading } = useComponents();\n\tconst { searchValue } = useSearch();\n\n\treturn {\n\t\tcomponents: components.filter( ( component ) =>\n\t\t\tcomponent.name.toLowerCase().includes( searchValue.toLowerCase() )\n\t\t),\n\t\tisLoading,\n\t\tsearchValue,\n\t};\n};\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectComponents, selectLoadIsPending } from '../store/store';\n\nexport const useComponents = () => {\n\tconst components = useSelector( selectComponents );\n\tconst isLoading = useSelector( selectLoadIsPending );\n\n\treturn { components, isLoading };\n};\n","import {\n\t__createSelector as createSelector,\n\t__createSlice as createSlice,\n\ttype PayloadAction,\n\ttype SliceState,\n} from '@elementor/store';\n\nimport { type Component, type ComponentId, type StylesDefinition } from '../types';\nimport { createComponent, loadComponents } from './thunks';\n\ntype GetComponentResponse = Component[];\n\ntype Status = 'idle' | 'pending' | 'error';\n\ntype ComponentsState = {\n\tdata: Component[];\n\tloadStatus: Status;\n\tcreateStatus: Status;\n\tstyles: StylesDefinition;\n};\n\ntype ComponentsSlice = SliceState< typeof slice >;\n\nexport const initialState: ComponentsState = {\n\tdata: [],\n\tloadStatus: 'idle',\n\tcreateStatus: 'idle',\n\tstyles: {},\n};\n\nexport const SLICE_NAME = 'components';\nexport const slice = createSlice( {\n\tname: SLICE_NAME,\n\tinitialState,\n\treducers: {\n\t\tadd: ( state, { payload } ) => {\n\t\t\tstate.data = { ...payload };\n\t\t},\n\t\tload: ( state, { payload } ) => {\n\t\t\tstate.data = payload;\n\t\t},\n\t\tremoveStyles( state, { payload }: PayloadAction< { id: ComponentId } > ) {\n\t\t\tconst { [ payload.id ]: _, ...rest } = state.styles;\n\n\t\t\tstate.styles = rest;\n\t\t},\n\t\taddStyles: ( state, { payload } ) => {\n\t\t\tstate.styles = { ...state.styles, ...payload };\n\t\t},\n\t},\n\textraReducers: ( builder ) => {\n\t\tbuilder.addCase( loadComponents.fulfilled, ( state, { payload }: PayloadAction< GetComponentResponse > ) => {\n\t\t\tstate.data = payload;\n\t\t\tstate.loadStatus = 'idle';\n\t\t} );\n\t\tbuilder.addCase( loadComponents.pending, ( state ) => {\n\t\t\tstate.loadStatus = 'pending';\n\t\t} );\n\t\tbuilder.addCase( loadComponents.rejected, ( state ) => {\n\t\t\tstate.loadStatus = 'error';\n\t\t} );\n\t\tbuilder.addCase( createComponent.fulfilled, ( state, { payload, meta } ) => {\n\t\t\tstate.createStatus = 'idle';\n\t\t\tstate.data.push( {\n\t\t\t\tid: payload.component_id,\n\t\t\t\tname: meta.arg.name,\n\t\t\t} );\n\t\t} );\n\t\tbuilder.addCase( createComponent.pending, ( state ) => {\n\t\t\tstate.createStatus = 'pending';\n\t\t} );\n\t\tbuilder.addCase( createComponent.rejected, ( state ) => {\n\t\t\tstate.createStatus = 'error';\n\t\t} );\n\t},\n} );\n\nconst selectData = ( state: ComponentsSlice ) => state[ SLICE_NAME ].data;\nconst selectLoadStatus = ( state: ComponentsSlice ) => state[ SLICE_NAME ].loadStatus;\nconst selectCreateStatus = ( state: ComponentsSlice ) => state[ SLICE_NAME ].createStatus;\nconst selectStylesDefinitions = ( state: ComponentsSlice ) => state[ SLICE_NAME ].styles ?? {};\n\nexport const selectComponents = createSelector( selectData, ( data: Component[] ) => data );\nexport const selectLoadIsPending = createSelector( selectLoadStatus, ( status ) => status === 'pending' );\nexport const selectLoadIsError = createSelector( selectLoadStatus, ( status ) => status === 'error' );\nexport const selectCreateIsPending = createSelector( selectCreateStatus, ( status ) => status === 'pending' );\nexport const selectCreateIsError = createSelector( selectCreateStatus, ( status ) => status === 'error' );\nexport const selectStyles = ( state: ComponentsSlice ) => state[ SLICE_NAME ].styles ?? {};\nexport const selectFlatStyles = createSelector( selectStylesDefinitions, ( data ) => Object.values( data ).flat() );\n","import { __createAsyncThunk as createAsyncThunk } from '@elementor/store';\n\nimport { apiClient, type CreateComponentPayload, type CreateComponentResponse } from '../api';\n\nconst createComponent = createAsyncThunk< CreateComponentResponse, CreateComponentPayload >(\n\t'components/create',\n\tasync ( payload: CreateComponentPayload ) => {\n\t\tconst response = await apiClient.create( payload );\n\t\treturn { ...response, name: payload.name };\n\t}\n);\n\nconst loadComponents = createAsyncThunk( 'components/load', async () => {\n\tconst response = await apiClient.get();\n\treturn response;\n} );\n\nexport { createComponent, loadComponents };\n","import { type V1ElementData, type V1ElementModelProps } from '@elementor/editor-elements';\nimport { ajax } from '@elementor/editor-v1-adapters';\nimport { type HttpResponse, httpService } from '@elementor/http-client';\n\nimport { type Component } from './types';\n\nconst BASE_URL = 'elementor/v1/components';\n\nexport type CreateComponentPayload = {\n\tname: string;\n\tcontent: V1ElementModelProps[];\n};\n\ntype GetComponentResponse = Array< Component >;\n\nexport type CreateComponentResponse = {\n\tcomponent_id: number;\n};\n\nexport const getParams = ( id: number ) => ( {\n\taction: 'get_document_config',\n\tunique_id: `document-config-${ id }`,\n\tdata: { id },\n} );\n\nexport const apiClient = {\n\tget: () =>\n\t\thttpService()\n\t\t\t.get< HttpResponse< GetComponentResponse > >( `${ BASE_URL }` )\n\t\t\t.then( ( res ) => res.data.data ),\n\tcreate: ( payload: CreateComponentPayload ) =>\n\t\thttpService()\n\t\t\t.post< HttpResponse< CreateComponentResponse > >( `${ BASE_URL }`, payload )\n\t\t\t.then( ( res ) => res.data.data ),\n\tgetComponentConfig: ( id: number ) => ajax.load< { id: number }, V1ElementData >( getParams( id ) ),\n\tinvalidateComponentConfigCache: ( id: number ) => ajax.invalidateCache< { id: number } >( getParams( id ) ),\n};\n","import * as React from 'react';\nimport { endDragElementFromPanel, startDragElementFromPanel } from '@elementor/editor-canvas';\nimport { dropElement, type DropElementParams } from '@elementor/editor-elements';\nimport { ComponentsIcon } from '@elementor/icons';\nimport { Box, ListItemButton, ListItemIcon, ListItemText, Typography } from '@elementor/ui';\n\nimport { type Component } from '../../types';\nimport { getContainerForNewElement } from '../../utils/get-container-for-new-element';\nimport { createComponentModel } from '../create-component-form/utils/replace-element-with-component';\n\nexport const ComponentItem = ( { component }: { component: Component } ) => {\n\tconst componentModel = createComponentModel( { id: component.id, name: component.name } );\n\n\tconst handleClick = () => {\n\t\taddComponentToPage( componentModel );\n\t};\n\n\treturn (\n\t\t<ListItemButton\n\t\t\tdraggable\n\t\t\tonDragStart={ () => startDragElementFromPanel( componentModel ) }\n\t\t\tonDragEnd={ endDragElementFromPanel }\n\t\t\tshape=\"rounded\"\n\t\t\tsx={ { border: 'solid 1px', borderColor: 'divider', py: 0.5, px: 1 } }\n\t\t>\n\t\t\t<Box sx={ { display: 'flex', width: '100%', alignItems: 'center', gap: 1 } } onClick={ handleClick }>\n\t\t\t\t<ListItemIcon size=\"tiny\">\n\t\t\t\t\t<ComponentsIcon fontSize=\"tiny\" />\n\t\t\t\t</ListItemIcon>\n\t\t\t\t<ListItemText\n\t\t\t\t\tprimary={\n\t\t\t\t\t\t<Typography variant=\"caption\" sx={ { color: 'text.primary' } }>\n\t\t\t\t\t\t\t{ component.name }\n\t\t\t\t\t\t</Typography>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</Box>\n\t\t</ListItemButton>\n\t);\n};\n\nconst addComponentToPage = ( model: DropElementParams[ 'model' ] ) => {\n\tconst { container, options } = getContainerForNewElement();\n\n\tif ( ! container ) {\n\t\tthrow new Error( `Can't find container to drop new component instance at` );\n\t}\n\n\tdropElement( {\n\t\tcontainerId: container.id,\n\t\tmodel,\n\t\toptions: { ...options, useHistory: false, scrollIntoView: true },\n\t} );\n};\n","import {\n\tgetContainer,\n\tgetCurrentDocumentContainer,\n\tgetSelectedElements,\n\ttype V1Element,\n} from '@elementor/editor-elements';\n\nexport const getContainerForNewElement = (): { container: V1Element | null; options?: { at: number } } => {\n\tconst currentDocumentContainer = getCurrentDocumentContainer();\n\tconst selectedElement = getSelectedElementContainer();\n\n\tlet container, options;\n\n\tif ( selectedElement ) {\n\t\tswitch ( selectedElement.model.get( 'elType' ) ) {\n\t\t\tcase 'widget': {\n\t\t\t\tcontainer = selectedElement?.parent;\n\n\t\t\t\tconst selectedElIndex = selectedElement.view?._index ?? -1;\n\n\t\t\t\tif ( selectedElIndex > -1 ) {\n\t\t\t\t\toptions = { at: selectedElIndex + 1 };\n\t\t\t\t}\n\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tcase 'section': {\n\t\t\t\tcontainer = selectedElement?.children?.[ 0 ];\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tdefault: {\n\t\t\t\tcontainer = selectedElement;\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t}\n\n\treturn { container: container ?? currentDocumentContainer, options };\n};\n\nfunction getSelectedElementContainer() {\n\tconst selectedElements = getSelectedElements();\n\n\tif ( selectedElements.length !== 1 ) {\n\t\treturn undefined;\n\t}\n\n\treturn getContainer( selectedElements[ 0 ].id );\n}\n","import { replaceElement, type V1Element } from '@elementor/editor-elements';\nimport { numberPropTypeUtil } from '@elementor/editor-props';\n\nimport { type Component } from '../../../types';\n\nexport const replaceElementWithComponent = async ( element: V1Element, component: Component ) => {\n\treplaceElement( {\n\t\tcurrentElement: element,\n\t\tnewElement: createComponentModel( component ),\n\t\twithHistory: false,\n\t} );\n};\n\nexport const createComponentModel = ( component: Component ) => {\n\treturn {\n\t\telType: 'widget',\n\t\twidgetType: 'e-component',\n\t\tsettings: {\n\t\t\tcomponent_id: numberPropTypeUtil.create( component.id ),\n\t\t},\n\t\teditor_settings: {\n\t\t\ttitle: component.name,\n\t\t},\n\t};\n};\n","import * as React from 'react';\nimport { Box, ListItemButton, Skeleton, Stack } from '@elementor/ui';\nconst ROWS_COUNT = 6;\n\nconst rows = Array.from( { length: ROWS_COUNT }, ( _, index ) => index );\n\nexport const LoadingComponents = () => {\n\treturn (\n\t\t<Stack\n\t\t\taria-label=\"Loading components\"\n\t\t\tgap={ 1 }\n\t\t\tsx={ {\n\t\t\t\tpointerEvents: 'none',\n\t\t\t\tposition: 'relative',\n\t\t\t\tmaxHeight: '300px',\n\t\t\t\toverflow: 'hidden',\n\t\t\t\t'&:after': {\n\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\ttop: 0,\n\t\t\t\t\tcontent: '\"\"',\n\t\t\t\t\tleft: 0,\n\t\t\t\t\twidth: '100%',\n\t\t\t\t\theight: '300px',\n\t\t\t\t\tbackground: 'linear-gradient(to top, white, transparent)',\n\t\t\t\t\tpointerEvents: 'none',\n\t\t\t\t},\n\t\t\t} }\n\t\t>\n\t\t\t{ rows.map( ( row ) => (\n\t\t\t\t<ListItemButton\n\t\t\t\t\tkey={ row }\n\t\t\t\t\tsx={ { border: 'solid 1px', borderColor: 'divider', py: 0.5, px: 1 } }\n\t\t\t\t\tshape=\"rounded\"\n\t\t\t\t>\n\t\t\t\t\t<Box display=\"flex\" gap={ 1 } width=\"100%\">\n\t\t\t\t\t\t<Skeleton variant=\"text\" width={ '24px' } height={ '36px' } />\n\t\t\t\t\t\t<Skeleton variant=\"text\" width={ '100%' } height={ '36px' } />\n\t\t\t\t\t</Box>\n\t\t\t\t</ListItemButton>\n\t\t\t) ) }\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { useEffect, useMemo, useState } from 'react';\nimport { getElementLabel, type V1Element } from '@elementor/editor-elements';\nimport { ThemeProvider } from '@elementor/editor-ui';\nimport { StarIcon } from '@elementor/icons';\nimport { Alert, Button, FormLabel, Grid, Popover, Snackbar, Stack, TextField, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { useComponents } from '../../hooks/use-components';\nimport { useCreateComponent } from '../../hooks/use-create-component';\nimport { type ComponentFormValues } from '../../types';\nimport { useForm } from './hooks/use-form';\nimport { createBaseComponentSchema, createSubmitComponentSchema } from './utils/component-form-schema';\nimport { replaceElementWithComponent } from './utils/replace-element-with-component';\n\ntype SaveAsComponentEventData = {\n\telement: V1Element;\n\tanchorPosition: { top: number; left: number };\n};\n\ntype ResultNotification = {\n\tshow: boolean;\n\tmessage: string;\n\ttype: 'success' | 'error';\n};\n\nexport function CreateComponentForm() {\n\tconst [ element, setElement ] = useState< {\n\t\telement: V1Element;\n\t\telementLabel: string;\n\t} | null >( null );\n\n\tconst [ anchorPosition, setAnchorPosition ] = useState< { top: number; left: number } >();\n\n\tconst [ resultNotification, setResultNotification ] = useState< ResultNotification | null >( null );\n\n\tconst { createComponent, isPending } = useCreateComponent();\n\tuseEffect( () => {\n\t\tconst OPEN_SAVE_AS_COMPONENT_FORM_EVENT = 'elementor/editor/open-save-as-component-form';\n\n\t\tconst openPopup = ( event: CustomEvent< SaveAsComponentEventData > ) => {\n\t\t\tsetElement( { element: event.detail.element, elementLabel: getElementLabel( event.detail.element.id ) } );\n\t\t\tsetAnchorPosition( event.detail.anchorPosition );\n\t\t};\n\n\t\twindow.addEventListener( OPEN_SAVE_AS_COMPONENT_FORM_EVENT, openPopup as EventListener );\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener( OPEN_SAVE_AS_COMPONENT_FORM_EVENT, openPopup as EventListener );\n\t\t};\n\t}, [] );\n\n\tconst handleSave = async ( values: ComponentFormValues ) => {\n\t\tif ( ! element ) {\n\t\t\tthrow new Error( `Can't save element as component: element not found` );\n\t\t}\n\n\t\ttry {\n\t\t\tconst result = await createComponent( {\n\t\t\t\tname: values.componentName,\n\t\t\t\tcontent: [ element.element.model.toJSON( { remove: [ 'default' ] } ) ],\n\t\t\t} );\n\n\t\t\tif ( ! element ) {\n\t\t\t\tthrow new Error( `Can't replace element with component: element not found` );\n\t\t\t}\n\n\t\t\treplaceElementWithComponent( element.element, {\n\t\t\t\tid: result.component_id,\n\t\t\t\tname: values.componentName,\n\t\t\t} );\n\n\t\t\tsetResultNotification( {\n\t\t\t\tshow: true,\n\t\t\t\t// Translators: %1$s: Component name, %2$s: Component ID\n\t\t\t\tmessage: __( 'Component saved successfully as: %1$s (ID: %2$s)', 'elementor' )\n\t\t\t\t\t.replace( '%1$s', values.componentName )\n\t\t\t\t\t.replace( '%2$s', result.component_id.toString() ),\n\t\t\t\ttype: 'success',\n\t\t\t} );\n\n\t\t\tresetAndClosePopup();\n\t\t} catch {\n\t\t\tconst errorMessage = __( 'Failed to save component. Please try again.', 'elementor' );\n\t\t\tsetResultNotification( {\n\t\t\t\tshow: true,\n\t\t\t\tmessage: errorMessage,\n\t\t\t\ttype: 'error',\n\t\t\t} );\n\t\t}\n\t};\n\n\tconst resetAndClosePopup = () => {\n\t\tsetElement( null );\n\t\tsetAnchorPosition( undefined );\n\t};\n\n\treturn (\n\t\t<ThemeProvider>\n\t\t\t<Popover\n\t\t\t\topen={ element !== null }\n\t\t\t\tonClose={ resetAndClosePopup }\n\t\t\t\tanchorReference=\"anchorPosition\"\n\t\t\t\tanchorPosition={ anchorPosition }\n\t\t\t>\n\t\t\t\t{ element !== null && (\n\t\t\t\t\t<Form\n\t\t\t\t\t\tinitialValues={ { componentName: element.elementLabel } }\n\t\t\t\t\t\thandleSave={ handleSave }\n\t\t\t\t\t\tisSubmitting={ isPending }\n\t\t\t\t\t\tclosePopup={ resetAndClosePopup }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</Popover>\n\t\t\t<Snackbar open={ resultNotification?.show } onClose={ () => setResultNotification( null ) }>\n\t\t\t\t<Alert\n\t\t\t\t\tonClose={ () => setResultNotification( null ) }\n\t\t\t\t\tseverity={ resultNotification?.type }\n\t\t\t\t\tsx={ { width: '100%' } }\n\t\t\t\t>\n\t\t\t\t\t{ resultNotification?.message }\n\t\t\t\t</Alert>\n\t\t\t</Snackbar>\n\t\t</ThemeProvider>\n\t);\n}\n\nconst FONT_SIZE = 'tiny';\n\nconst Form = ( {\n\tinitialValues,\n\thandleSave,\n\tisSubmitting,\n\tclosePopup,\n}: {\n\tinitialValues: ComponentFormValues;\n\thandleSave: ( values: ComponentFormValues ) => void;\n\tisSubmitting: boolean;\n\tclosePopup: () => void;\n} ) => {\n\tconst { values, errors, isValid, handleChange, validateForm } = useForm< ComponentFormValues >( initialValues );\n\n\tconst { components } = useComponents();\n\n\tconst existingComponentNames = useMemo( () => {\n\t\treturn components?.map( ( component ) => component.name ) ?? [];\n\t}, [ components ] );\n\n\tconst changeValidationSchema = useMemo(\n\t\t() => createBaseComponentSchema( existingComponentNames ),\n\t\t[ existingComponentNames ]\n\t);\n\tconst submitValidationSchema = useMemo(\n\t\t() => createSubmitComponentSchema( existingComponentNames ),\n\t\t[ existingComponentNames ]\n\t);\n\n\tconst handleSubmit = () => {\n\t\tconst { success, parsedValues } = validateForm( submitValidationSchema );\n\n\t\tif ( success ) {\n\t\t\thandleSave( parsedValues );\n\t\t}\n\t};\n\n\treturn (\n\t\t<Stack alignItems=\"start\" width=\"268px\">\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\talignItems=\"center\"\n\t\t\t\tpy={ 1 }\n\t\t\t\tpx={ 1.5 }\n\t\t\t\tsx={ { columnGap: 0.5, borderBottom: '1px solid', borderColor: 'divider', width: '100%' } }\n\t\t\t>\n\t\t\t\t<StarIcon fontSize={ FONT_SIZE } />\n\t\t\t\t<Typography variant=\"caption\" sx={ { color: 'text.primary', fontWeight: '500', lineHeight: 1 } }>\n\t\t\t\t\t{ __( 'Save as a component', 'elementor' ) }\n\t\t\t\t</Typography>\n\t\t\t</Stack>\n\t\t\t<Grid container gap={ 0.75 } alignItems=\"start\" p={ 1.5 }>\n\t\t\t\t<Grid item xs={ 12 }>\n\t\t\t\t\t<FormLabel htmlFor={ 'component-name' } size=\"tiny\">\n\t\t\t\t\t\t{ __( 'Name', 'elementor' ) }\n\t\t\t\t\t</FormLabel>\n\t\t\t\t</Grid>\n\t\t\t\t<Grid item xs={ 12 }>\n\t\t\t\t\t<TextField\n\t\t\t\t\t\tid={ 'component-name' }\n\t\t\t\t\t\tsize={ FONT_SIZE }\n\t\t\t\t\t\tfullWidth\n\t\t\t\t\t\tvalue={ values.componentName }\n\t\t\t\t\t\tonChange={ ( e: React.ChangeEvent< HTMLInputElement > ) =>\n\t\t\t\t\t\t\thandleChange( e, 'componentName', changeValidationSchema )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tinputProps={ { style: { color: 'text.primary', fontWeight: '600' } } }\n\t\t\t\t\t\terror={ Boolean( errors.componentName ) }\n\t\t\t\t\t\thelperText={ errors.componentName }\n\t\t\t\t\t/>\n\t\t\t\t</Grid>\n\t\t\t</Grid>\n\t\t\t<Stack direction=\"row\" justifyContent=\"flex-end\" alignSelf=\"end\" py={ 1 } px={ 1.5 }>\n\t\t\t\t<Button onClick={ closePopup } disabled={ isSubmitting } color=\"secondary\" variant=\"text\" size=\"small\">\n\t\t\t\t\t{ __( 'Cancel', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t\t<Button\n\t\t\t\t\tonClick={ handleSubmit }\n\t\t\t\t\tdisabled={ isSubmitting || ! isValid }\n\t\t\t\t\tvariant=\"contained\"\n\t\t\t\t\tcolor=\"primary\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t>\n\t\t\t\t\t{ isSubmitting ? __( 'Creating…', 'elementor' ) : __( 'Create', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t</Stack>\n\t\t</Stack>\n\t);\n};\n","import { __useDispatch as useDispatch, __useSelector as useSelector, type AnyAction } from '@elementor/store';\n\nimport { type CreateComponentPayload } from '../api';\nimport { selectCreateIsError, selectCreateIsPending } from '../store/store';\nimport { createComponent } from '../store/thunks';\n\nexport const useCreateComponent = () => {\n\tconst dispatch = useDispatch();\n\tconst isPending = useSelector( selectCreateIsPending );\n\tconst isError = useSelector( selectCreateIsError );\n\n\tconst createComponentAction = async ( payload: CreateComponentPayload ) => {\n\t\tconst result = await dispatch( createComponent( payload ) as unknown as AnyAction );\n\t\treturn result.payload;\n\t};\n\n\treturn {\n\t\tcreateComponent: createComponentAction,\n\t\tisPending,\n\t\tisError,\n\t};\n};\n","import { useMemo, useState } from 'react';\nimport { type z } from '@elementor/schema';\n\nexport const useForm = < TValues extends Record< string, unknown > >( initialValues: TValues ) => {\n\tconst [ values, setValues ] = useState< TValues >( initialValues );\n\tconst [ errors, setErrors ] = useState< Partial< Record< keyof TValues, string > > >( {} );\n\n\tconst isValid = useMemo( () => {\n\t\treturn ! Object.values( errors ).some( ( error ) => error );\n\t}, [ errors ] );\n\n\tconst handleChange = (\n\t\te: React.ChangeEvent< HTMLInputElement >,\n\t\tfield: keyof TValues,\n\t\tvalidationSchema: z.ZodType< TValues >\n\t) => {\n\t\tconst updated = { ...values, [ field ]: e.target.value };\n\t\tsetValues( updated );\n\n\t\tconst { success, errors: validationErrors } = validateForm( updated, validationSchema );\n\n\t\tif ( ! success ) {\n\t\t\tsetErrors( validationErrors );\n\t\t} else {\n\t\t\tsetErrors( {} );\n\t\t}\n\t};\n\n\tconst validate = (\n\t\tvalidationSchema: z.ZodType< TValues >\n\t): { success: true; parsedValues: TValues } | { success: false; parsedValues?: never } => {\n\t\tconst { success, errors: validationErrors, parsedValues } = validateForm( values, validationSchema );\n\n\t\tif ( ! success ) {\n\t\t\tsetErrors( validationErrors );\n\t\t\treturn { success };\n\t\t}\n\t\tsetErrors( {} );\n\t\treturn { success, parsedValues };\n\t};\n\n\treturn {\n\t\tvalues,\n\t\terrors,\n\t\tisValid,\n\t\thandleChange,\n\t\tvalidateForm: validate,\n\t};\n};\n\nconst validateForm = < TValues extends Record< string, unknown > >(\n\tvalues: TValues,\n\tschema: z.ZodType< TValues >\n):\n\t| { success: false; parsedValues?: never; errors: Partial< Record< keyof TValues, string > > }\n\t| { success: true; parsedValues: TValues; errors?: never } => {\n\tconst result = schema.safeParse( values );\n\n\tif ( result.success ) {\n\t\treturn { success: true, parsedValues: result.data };\n\t}\n\n\tconst errors = {} as Partial< Record< keyof TValues, string > >;\n\n\t( Object.entries( result.error.formErrors.fieldErrors ) as Array< [ keyof TValues, string[] ] > ).forEach(\n\t\t( [ field, error ] ) => {\n\t\t\terrors[ field ] = error[ 0 ];\n\t\t}\n\t);\n\n\treturn { success: false, errors };\n};\n","import { z } from '@elementor/schema';\nimport { __ } from '@wordpress/i18n';\n\nconst MIN_NAME_LENGTH = 2;\nconst MAX_NAME_LENGTH = 50;\n\nexport const createBaseComponentSchema = ( existingNames: string[] ) => {\n\treturn z.object( {\n\t\tcomponentName: z\n\t\t\t.string()\n\t\t\t.trim()\n\t\t\t.max(\n\t\t\t\tMAX_NAME_LENGTH,\n\t\t\t\t__( 'Component name is too long. Please keep it under 50 characters.', 'elementor' )\n\t\t\t)\n\t\t\t.refine( ( value ) => ! existingNames.includes( value ), {\n\t\t\t\tmessage: __( 'Component name already exists', 'elementor' ),\n\t\t\t} ),\n\t} );\n};\n\nexport const createSubmitComponentSchema = ( existingNames: string[] ) => {\n\tconst baseSchema = createBaseComponentSchema( existingNames );\n\n\treturn baseSchema.extend( {\n\t\tcomponentName: baseSchema.shape.componentName\n\t\t\t.refine( ( value ) => value.length > 0, {\n\t\t\t\tmessage: __( 'Component name is required.', 'elementor' ),\n\t\t\t} )\n\t\t\t.refine( ( value ) => value.length >= MIN_NAME_LENGTH, {\n\t\t\t\tmessage: __( 'Component name is too short. Please enter at least 2 characters.', 'elementor' ),\n\t\t\t} ),\n\t} );\n};\n","import { useEffect } from 'react';\nimport { __dispatch as dispatch } from '@elementor/store';\n\nimport { loadComponents } from './store/thunks';\n\nexport function PopulateStore() {\n\tuseEffect( () => {\n\t\tdispatch( loadComponents() );\n\t}, [] );\n\n\treturn null;\n}\n","import { createStylesProvider } from '@elementor/editor-styles-repository';\nimport { __getState as getState, __subscribeWithSelector as subscribeWithSelector } from '@elementor/store';\n\nimport { selectFlatStyles, SLICE_NAME } from './store';\n\nexport const componentsStylesProvider = createStylesProvider( {\n\tkey: 'components-styles',\n\tpriority: 100,\n\tsubscribe: ( cb ) =>\n\t\tsubscribeWithSelector(\n\t\t\t( state ) => state[ SLICE_NAME ],\n\t\t\t() => {\n\t\t\t\tcb();\n\t\t\t}\n\t\t),\n\tactions: {\n\t\tall: () => {\n\t\t\treturn selectFlatStyles( getState() );\n\t\t},\n\t\tget: ( id ) => {\n\t\t\treturn selectFlatStyles( getState() ).find( ( style ) => style.id === id ) ?? null;\n\t\t},\n\t},\n} );\n","import { type V1ElementData } from '@elementor/editor-elements';\nimport { type StyleDefinition } from '@elementor/editor-styles';\nimport { __dispatch as dispatch, __getState as getState } from '@elementor/store';\n\nimport { apiClient } from '../api';\nimport { type ComponentId, type Element } from '../types';\nimport { getComponentIds } from '../utils/get-component-ids';\nimport { selectStyles, slice } from './store';\n\nexport async function loadComponentsStyles( elements: Element[] ) {\n\tconst componentIds = Array.from( new Set( getComponentIds( elements ) ) );\n\n\tif ( ! componentIds.length ) {\n\t\treturn;\n\t}\n\n\tconst knownComponents = selectStyles( getState() );\n\tconst unknownComponentIds = componentIds.filter( ( id ) => ! knownComponents[ id ] );\n\n\tif ( ! unknownComponentIds.length ) {\n\t\treturn;\n\t}\n\n\taddComponentStyles( unknownComponentIds );\n}\n\nasync function addComponentStyles( ids: ComponentId[] ) {\n\tconst newComponents = await loadStyles( ids );\n\n\taddStyles( newComponents );\n\n\tObject.values( newComponents ).forEach( ( [ , data ] ) => {\n\t\tloadComponentsStyles( data.elements as Element[] );\n\t} );\n}\n\nasync function loadStyles( ids: number[] ): Promise< [ number, V1ElementData ][] > {\n\treturn Promise.all( ids.map( async ( id ) => [ id, await apiClient.getComponentConfig( id ) ] ) );\n}\n\nfunction addStyles( data: ( readonly [ ComponentId, V1ElementData ] )[] ) {\n\tconst styles = Object.fromEntries(\n\t\tdata.map( ( [ componentId, componentData ] ) => [ componentId, extractStyles( componentData ) ] )\n\t);\n\n\tdispatch( slice.actions.addStyles( styles ) );\n}\n\nfunction extractStyles( element: V1ElementData ): Array< StyleDefinition > {\n\treturn [ ...Object.values( element.styles ?? {} ), ...( element.elements ?? [] ).flatMap( extractStyles ) ];\n}\n","import { type V1ElementData } from '@elementor/editor-elements';\nimport { isTransformable } from '@elementor/editor-props';\n\nexport const getComponentIds = ( elements: V1ElementData[] ) => {\n\treturn elements.flatMap( ( element ) => {\n\t\tconst ids: number[] = [];\n\n\t\tconst type = element.widgetType || element.elType;\n\n\t\tif (\n\t\t\ttype === 'e-component' &&\n\t\t\telement.settings?.component_id &&\n\t\t\tisTransformable( element.settings?.component_id )\n\t\t) {\n\t\t\tids.push( element.settings.component_id.value );\n\t\t}\n\n\t\tif ( element.elements ) {\n\t\t\tids.push( ...getComponentIds( element.elements ) );\n\t\t}\n\n\t\treturn ids;\n\t} );\n};\n","import { __dispatch as dispatch } from '@elementor/store';\n\nimport { apiClient } from '../api';\nimport { slice } from './store';\n\nexport function removeComponentStyles( id: number ) {\n\tapiClient.invalidateComponentConfigCache( id );\n\tdispatch( slice.actions.removeStyles( { id } ) );\n}\n"],"mappings":"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","names":["import_editor_styles_repository","import_editor_v1_adapters","import_store","import_i18n","React","React","React","import_icons","import_ui","import_i18n","import_store","import_store","createAsyncThunk","createSlice","createSelector","useSelector","React","import_editor_elements","import_icons","import_ui","import_editor_elements","React","import_ui","React","import_react","import_editor_elements","import_editor_ui","import_icons","import_ui","import_i18n","import_store","dispatch","useDispatch","useSelector","import_react","import_i18n","createComponent","validateForm","import_react","import_store","dispatch","import_store","subscribeWithSelector","getState","import_store","import_editor_props","getState","dispatch","import_store","dispatch","registerSlice","listenTo"]}
|