@elementor/editor-components 4.0.0-633 → 4.0.0-635

package/dist/index.js

@@ -30,7 +30,77 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
-  init: () => init
+  COMPONENT_WIDGET_TYPE: () => COMPONENT_WIDGET_TYPE,
+  ComponentInstanceProvider: () => ComponentInstanceProvider,
+  ComponentItem: () => ComponentItem,
+  ComponentName: () => ComponentName,
+  ComponentSearch: () => ComponentSearch,
+  ComponentsEmptyState: () => EmptyState,
+  ComponentsList: () => ComponentsList,
+  EditComponentAction: () => EditComponentAction,
+  EmptySearchResult: () => EmptySearchResult,
+  InstanceEmptyState: () => EmptyState2,
+  InstancePanelBody: () => InstancePanelBody,
+  InstancePanelHeader: () => InstancePanelHeader,
+  LoadingComponents: () => LoadingComponents,
+  OverridablePropProvider: () => OverridablePropProvider,
+  SLICE_NAME: () => SLICE_NAME,
+  SearchProvider: () => SearchProvider,
+  apiClient: () => apiClient,
+  componentInstanceOverridePropTypeUtil: () => componentInstanceOverridePropTypeUtil,
+  componentInstanceOverridesPropTypeUtil: () => componentInstanceOverridesPropTypeUtil,
+  componentInstancePropTypeUtil: () => componentInstancePropTypeUtil,
+  componentOverridablePropTypeUtil: () => componentOverridablePropTypeUtil,
+  componentsActions: () => componentsActions,
+  componentsSelectors: () => componentsSelectors,
+  filterValidOverridableProps: () => filterValidOverridableProps,
+  getContainerByOriginId: () => getContainerByOriginId,
+  getOverridableProp: () => getOverridableProp,
+  getPropTypeForComponentOverride: () => getPropTypeForComponentOverride,
+  init: () => init,
+  isComponentInstance: () => isComponentInstance,
+  isExposedPropValid: () => isExposedPropValid,
+  loadComponentsAssets: () => loadComponentsAssets,
+  onElementDrop: () => onElementDrop,
+  publishDraftComponentsInPageBeforeSave: () => publishDraftComponentsInPageBeforeSave,
+  resolveOverridePropValue: () => resolveOverridePropValue,
+  selectArchivedThisSession: () => selectArchivedThisSession,
+  selectComponent: () => selectComponent,
+  selectComponentByUid: () => selectComponentByUid,
+  selectComponents: () => selectComponents,
+  selectCreatedThisSession: () => selectCreatedThisSession,
+  selectCurrentComponent: () => selectCurrentComponent,
+  selectCurrentComponentId: () => selectCurrentComponentId,
+  selectData: () => selectData,
+  selectFlatStyles: () => selectFlatStyles,
+  selectIsOverridablePropsLoaded: () => selectIsOverridablePropsLoaded,
+  selectLoadIsError: () => selectLoadIsError,
+  selectLoadIsPending: () => selectLoadIsPending,
+  selectOverridableProps: () => selectOverridableProps,
+  selectPath: () => selectPath,
+  selectStyles: () => selectStyles,
+  selectUnpublishedComponents: () => selectUnpublishedComponents,
+  selectUpdatedComponentNames: () => selectUpdatedComponentNames,
+  slice: () => slice,
+  switchToComponent: () => switchToComponent,
+  trackComponentEvent: () => trackComponentEvent,
+  updateOverridableProp: () => updateOverridableProp,
+  useComponent: () => useComponent,
+  useComponentId: () => useComponentId,
+  useComponentInstanceElement: () => useComponentInstanceElement,
+  useComponentInstanceOverrides: () => useComponentInstanceOverrides,
+  useComponentOverridableProps: () => useComponentOverridableProps,
+  useComponents: () => useComponents,
+  useComponentsPermissions: () => useComponentsPermissions,
+  useCurrentComponent: () => useCurrentComponent,
+  useCurrentComponentId: () => useCurrentComponentId,
+  useFilteredComponents: () => useFilteredComponents,
+  useInstancePanelData: () => useInstancePanelData,
+  useIsSanitizedComponent: () => useIsSanitizedComponent,
+  useOverridablePropValue: () => useOverridablePropValue,
+  useOverridableProps: () => useOverridableProps,
+  useSanitizeOverridableProps: () => useSanitizeOverridableProps,
+  useSearch: () => useSearch
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -42,7 +112,7 @@ var import_editor_editing_panel9 = require("@elementor/editor-editing-panel");
 var import_editor_elements_panel2 = require("@elementor/editor-elements-panel");
 var import_editor_styles_repository2 = require("@elementor/editor-styles-repository");
 var import_editor_v1_adapters13 = require("@elementor/editor-v1-adapters");
-var import_store86 = require("@elementor/store");
+var import_store44 = require("@elementor/store");
 var import_i18n33 = require("@wordpress/i18n");
 
 // src/component-instance-transformer.ts
@@ -916,9 +986,6 @@ function OverridablePropProvider({ children, ...props }) {
 var useOverridablePropValue = () => (0, import_react4.useContext)(OverridablePropContext)?.value;
 var useComponentInstanceElement = () => (0, import_react4.useContext)(OverridablePropContext)?.componentInstanceElement;
 
-// src/store/actions/update-overridable-prop.ts
-var import_store7 = require("@elementor/store");
-
 // src/utils/resolve-override-prop-value.ts
 var resolveOverridePropValue = (originalPropValue) => {
   const isOverridable = componentOverridablePropTypeUtil.isValid(originalPropValue);
@@ -950,9 +1017,104 @@ function getOverrideValue(overrideProp) {
   return overrideValue.override_value;
 }
 
+// src/store/dispatchers.ts
+var import_store7 = require("@elementor/store");
+function safeDispatch() {
+  return (0, import_store7.__getStore)()?.dispatch;
+}
+var componentsActions = {
+  add(components) {
+    (0, import_store7.__dispatch)(slice.actions.add(components));
+  },
+  load(components) {
+    (0, import_store7.__dispatch)(slice.actions.load(components));
+  },
+  addUnpublished(component) {
+    (0, import_store7.__dispatch)(slice.actions.addUnpublished(component));
+  },
+  removeUnpublished(uids) {
+    (0, import_store7.__dispatch)(slice.actions.removeUnpublished(uids));
+  },
+  resetUnpublished() {
+    (0, import_store7.__dispatch)(slice.actions.resetUnpublished());
+  },
+  removeStyles(id2) {
+    (0, import_store7.__dispatch)(slice.actions.removeStyles({ id: id2 }));
+  },
+  addStyles(styles) {
+    (0, import_store7.__dispatch)(slice.actions.addStyles(styles));
+  },
+  addCreatedThisSession(uid) {
+    (0, import_store7.__dispatch)(slice.actions.addCreatedThisSession(uid));
+  },
+  removeCreatedThisSession(uid) {
+    (0, import_store7.__dispatch)(slice.actions.removeCreatedThisSession(uid));
+  },
+  archive(componentId) {
+    (0, import_store7.__dispatch)(slice.actions.archive(componentId));
+  },
+  setCurrentComponentId(id2) {
+    safeDispatch()?.(slice.actions.setCurrentComponentId(id2));
+  },
+  setPath(path) {
+    safeDispatch()?.(slice.actions.setPath(path));
+  },
+  setOverridableProps(componentId, overridableProps) {
+    (0, import_store7.__dispatch)(slice.actions.setOverridableProps({ componentId, overridableProps }));
+  },
+  rename(componentUid, name) {
+    (0, import_store7.__dispatch)(slice.actions.rename({ componentUid, name }));
+  },
+  cleanUpdatedComponentNames() {
+    (0, import_store7.__dispatch)(slice.actions.cleanUpdatedComponentNames());
+  },
+  updateComponentSanitizedAttribute(componentId, attribute) {
+    (0, import_store7.__dispatch)(slice.actions.updateComponentSanitizedAttribute({ componentId, attribute }));
+  },
+  resetSanitizedComponents() {
+    (0, import_store7.__dispatch)(slice.actions.resetSanitizedComponents());
+  }
+};
+
+// src/store/selectors.ts
+var import_store9 = require("@elementor/store");
+function safeGetState() {
+  return (0, import_store9.__getStore)()?.getState();
+}
+var componentsSelectors = {
+  getOverridableProps(componentId) {
+    return selectOverridableProps((0, import_store9.__getState)(), componentId);
+  },
+  getCurrentComponent() {
+    return selectCurrentComponent((0, import_store9.__getState)());
+  },
+  getCurrentComponentId() {
+    const state = safeGetState();
+    if (!state) {
+      return null;
+    }
+    return selectCurrentComponentId(state);
+  },
+  getUnpublishedComponents() {
+    return selectUnpublishedComponents((0, import_store9.__getState)());
+  },
+  getUpdatedComponentNames() {
+    return selectUpdatedComponentNames((0, import_store9.__getState)());
+  },
+  getArchivedThisSession() {
+    return selectArchivedThisSession((0, import_store9.__getState)());
+  },
+  getComponents() {
+    return selectComponents((0, import_store9.__getState)());
+  },
+  getComponentByUid(componentUid) {
+    return selectComponentByUid((0, import_store9.__getState)(), componentUid);
+  }
+};
+
 // src/store/actions/update-overridable-prop.ts
 function updateOverridableProp(componentId, propValue, originPropFields) {
-  const overridableProps = selectOverridableProps((0, import_store7.__getState)(), componentId);
+  const overridableProps = componentsSelectors.getOverridableProps(componentId);
   if (!overridableProps) {
     return;
   }
@@ -977,12 +1139,7 @@ function updateOverridableProp(componentId, propValue, originPropFields) {
       }
     }
   };
-  (0, import_store7.__dispatch)(
-    slice.actions.setOverridableProps({
-      componentId,
-      overridableProps: newOverridableProps
-    })
-  );
+  componentsActions.setOverridableProps(componentId, newOverridableProps);
 }
 
 // src/utils/get-container-by-origin-id.ts
@@ -1068,15 +1225,15 @@ var OverrideControlInnerElementNotFoundError = (0, import_utils2.createError)({
 });
 
 // src/components/instance-editing-panel/use-resolved-origin-value.tsx
-var import_store11 = require("@elementor/store");
+var import_store13 = require("@elementor/store");
 
 // src/utils/get-overridable-prop.ts
-var import_store9 = require("@elementor/store");
+var import_store11 = require("@elementor/store");
 function getOverridableProp({
   componentId,
   overrideKey
 }) {
-  const overridableProps = selectOverridableProps((0, import_store9.__getState)(), componentId);
+  const overridableProps = selectOverridableProps((0, import_store11.__getState)(), componentId);
   if (!overridableProps) {
     return void 0;
   }
@@ -1085,7 +1242,7 @@ function getOverridableProp({
 
 // src/components/instance-editing-panel/use-resolved-origin-value.tsx
 function useResolvedOriginValue(override, overridableProp) {
-  const components = (0, import_store11.__useSelector)(selectData);
+  const components = (0, import_store13.__useSelector)(selectData);
   return resolveOriginValue(components, override, overridableProp);
 }
 function resolveOriginValue(components, matchingOverride, overridableProp) {
@@ -1550,7 +1707,7 @@ var import_editor_documents4 = require("@elementor/editor-documents");
 // src/create-component-type.ts
 var import_editor_canvas4 = require("@elementor/editor-canvas");
 var import_editor_documents3 = require("@elementor/editor-documents");
-var import_store18 = require("@elementor/store");
+var import_store20 = require("@elementor/store");
 var import_utils4 = require("@elementor/utils");
 var import_i18n7 = require("@wordpress/i18n");
 
@@ -1624,7 +1781,7 @@ function buildUniqueSelector(element) {
 
 // src/utils/tracking.ts
 var import_events = require("@elementor/events");
-var import_store16 = require("@elementor/store");
+var import_store18 = require("@elementor/store");
 var FEATURE_NAME = "Components";
 var trackComponentEvent = ({ action, source, ...data }) => {
   if (source === "system") {
@@ -1645,7 +1802,7 @@ var onElementDrop = (_args, element) => {
   const componentName = editorSettings?.title;
   const componentUID = editorSettings?.component_uid;
   const instanceId = element.id;
-  const createdThisSession = selectCreatedThisSession((0, import_store16.__getState)());
+  const createdThisSession = selectCreatedThisSession((0, import_store18.__getState)());
   const isSameSessionReuse = componentUID && createdThisSession.includes(componentUID);
   const eventsManagerConfig = window.elementorCommon.eventsManager.config;
   const { locations, secondaryLocations } = eventsManagerConfig;
@@ -1888,7 +2045,7 @@ function createComponentModel() {
       }
       const componentUid = editorSettings?.component_uid;
       if (componentUid) {
-        const component = selectComponentByUid((0, import_store18.__getState)(), componentUid);
+        const component = selectComponentByUid((0, import_store20.__getState)(), componentUid);
         if (component?.name) {
           return component.name;
         }
@@ -1957,7 +2114,7 @@ async function getDocumentsMap(ids, cache) {
 }
 
 // src/store/actions/load-components-overridable-props.ts
-var import_store20 = require("@elementor/store");
+var import_store22 = require("@elementor/store");
 function loadComponentsOverridableProps(componentIds) {
   if (!componentIds.length) {
     return;
@@ -1965,7 +2122,7 @@ function loadComponentsOverridableProps(componentIds) {
   return Promise.all(componentIds.map(loadComponentOverrides));
 }
 async function loadComponentOverrides(componentId) {
-  const isOverridablePropsLoaded = selectIsOverridablePropsLoaded((0, import_store20.__getState)(), componentId);
+  const isOverridablePropsLoaded = selectIsOverridablePropsLoaded((0, import_store22.__getState)(), componentId);
   if (isOverridablePropsLoaded) {
     return;
   }
@@ -1973,7 +2130,7 @@ async function loadComponentOverrides(componentId) {
   if (!overridableProps) {
     return;
   }
-  (0, import_store20.__dispatch)(
+  (0, import_store22.__dispatch)(
     slice.actions.setOverridableProps({
       componentId,
       overridableProps
@@ -1982,12 +2139,12 @@ async function loadComponentOverrides(componentId) {
 }
 
 // src/store/actions/load-components-styles.ts
-var import_store22 = require("@elementor/store");
+var import_store24 = require("@elementor/store");
 function loadComponentsStyles(documents) {
   if (!documents.size) {
     return;
   }
-  const knownComponents = selectStyles((0, import_store22.__getState)());
+  const knownComponents = selectStyles((0, import_store24.__getState)());
   const unknownDocuments = new Map([...documents.entries()].filter(([id2]) => !knownComponents[id2]));
   if (!unknownDocuments.size) {
     return;
@@ -1998,7 +2155,7 @@ function addStyles(documents) {
   const styles = Object.fromEntries(
     [...documents.entries()].map(([id2, document]) => [id2, extractStylesFromDocument(document)])
   );
-  (0, import_store22.__dispatch)(slice.actions.addStyles(styles));
+  (0, import_store24.__dispatch)(slice.actions.addStyles(styles));
 }
 function extractStylesFromDocument(document) {
   if (!document.elements?.length) {
@@ -2053,16 +2210,16 @@ var import_editor_documents8 = require("@elementor/editor-documents");
 var import_editor_panels5 = require("@elementor/editor-panels");
 var import_editor_ui12 = require("@elementor/editor-ui");
 var import_icons14 = require("@elementor/icons");
-var import_store42 = require("@elementor/store");
+var import_store30 = require("@elementor/store");
 var import_ui23 = require("@elementor/ui");
 var import_i18n19 = require("@wordpress/i18n");
 
 // src/extended/hooks/use-navigate-back.ts
 var import_react7 = require("react");
 var import_editor_documents5 = require("@elementor/editor-documents");
-var import_store24 = require("@elementor/store");
+var import_store26 = require("@elementor/store");
 function useNavigateBack() {
-  const path = (0, import_store24.__useSelector)(selectPath);
+  const path = (0, import_store26.__useSelector)(selectPath);
   const documentsManager = (0, import_editor_documents5.getV1DocumentsManager)();
   return (0, import_react7.useCallback)(() => {
     const { componentId: prevComponentId, instanceId: prevComponentInstanceId } = path.at(-2) ?? {};
@@ -2149,15 +2306,14 @@ var import_utils6 = require("@elementor/utils");
 var import_i18n16 = require("@wordpress/i18n");
 
 // src/extended/store/actions/add-overridable-group.ts
-var import_store26 = require("@elementor/store");
 function addOverridableGroup({
   componentId,
   groupId,
   label,
   source
 }) {
-  const currentComponent = selectCurrentComponent((0, import_store26.__getState)());
-  const overridableProps = selectOverridableProps((0, import_store26.__getState)(), componentId);
+  const currentComponent = componentsSelectors.getCurrentComponent();
+  const overridableProps = componentsSelectors.getOverridableProps(componentId);
   if (!overridableProps) {
     return;
   }
@@ -2166,22 +2322,17 @@ function addOverridableGroup({
     label,
     props: []
   };
-  (0, import_store26.__dispatch)(
-    slice.actions.setOverridableProps({
-      componentId,
-      overridableProps: {
-        ...overridableProps,
-        groups: {
-          ...overridableProps.groups,
-          items: {
-            ...overridableProps.groups.items,
-            [groupId]: newGroup
-          },
-          order: [groupId, ...overridableProps.groups.order]
-        }
-      }
-    })
-  );
+  componentsActions.setOverridableProps(componentId, {
+    ...overridableProps,
+    groups: {
+      ...overridableProps.groups,
+      items: {
+        ...overridableProps.groups.items,
+        [groupId]: newGroup
+      },
+      order: [groupId, ...overridableProps.groups.order]
+    }
+  });
   trackComponentEvent({
     action: "propertiesGroupCreated",
     source,
@@ -2191,9 +2342,6 @@ function addOverridableGroup({
   return newGroup;
 }
 
-// src/extended/store/actions/delete-overridable-group.ts
-var import_store28 = require("@elementor/store");
-
 // src/extended/store/utils/groups-transformers.ts
 var import_utils5 = require("@elementor/utils");
 var import_i18n9 = require("@wordpress/i18n");
@@ -2341,7 +2489,7 @@ function renameGroup(groups, groupId, newLabel) {
 
 // src/extended/store/actions/delete-overridable-group.ts
 function deleteOverridableGroup({ componentId, groupId }) {
-  const overridableProps = selectOverridableProps((0, import_store28.__getState)(), componentId);
+  const overridableProps = componentsSelectors.getOverridableProps(componentId);
   if (!overridableProps) {
     return false;
   }
@@ -2350,21 +2498,13 @@ function deleteOverridableGroup({ componentId, groupId }) {
     return false;
   }
   const updatedGroups = deleteGroup(overridableProps.groups, groupId);
-  (0, import_store28.__dispatch)(
-    slice.actions.setOverridableProps({
-      componentId,
-      overridableProps: {
-        ...overridableProps,
-        groups: updatedGroups
-      }
-    })
-  );
+  componentsActions.setOverridableProps(componentId, {
+    ...overridableProps,
+    groups: updatedGroups
+  });
   return true;
 }
 
-// src/extended/store/actions/delete-overridable-prop.ts
-var import_store30 = require("@elementor/store");
-
 // src/extended/utils/revert-overridable-settings.ts
 var import_editor_elements6 = require("@elementor/editor-elements");
 function revertElementOverridableSetting(elementId, settingKey, originValue, overrideKey) {
@@ -2500,7 +2640,7 @@ function revertElementSettings(element) {
 
 // src/extended/store/actions/delete-overridable-prop.ts
 function deleteOverridableProp({ componentId, propKey, source }) {
-  const overridableProps = selectOverridableProps((0, import_store30.__getState)(), componentId);
+  const overridableProps = componentsSelectors.getOverridableProps(componentId);
   if (!overridableProps || Object.keys(overridableProps.props).length === 0) {
     return;
   }
@@ -2521,17 +2661,12 @@ function deleteOverridableProp({ componentId, propKey, source }) {
     Object.entries(overridableProps.props).filter(([key]) => !propKeysToDelete.includes(key))
   );
   const updatedGroups = removePropFromAllGroups(overridableProps.groups, propKey);
-  (0, import_store30.__dispatch)(
-    slice.actions.setOverridableProps({
-      componentId,
-      overridableProps: {
-        ...overridableProps,
-        props: remainingProps,
-        groups: updatedGroups
-      }
-    })
-  );
-  const currentComponent = selectCurrentComponent((0, import_store30.__getState)());
+  componentsActions.setOverridableProps(componentId, {
+    ...overridableProps,
+    props: remainingProps,
+    groups: updatedGroups
+  });
+  const currentComponent = componentsSelectors.getCurrentComponent();
   for (const prop of deletedProps) {
     trackComponentEvent({
       action: "propertyRemoved",
@@ -2546,9 +2681,8 @@ function deleteOverridableProp({ componentId, propKey, source }) {
 }
 
 // src/extended/store/actions/reorder-group-props.ts
-var import_store32 = require("@elementor/store");
 function reorderGroupProps({ componentId, groupId, newPropsOrder }) {
-  const overridableProps = selectOverridableProps((0, import_store32.__getState)(), componentId);
+  const overridableProps = componentsSelectors.getOverridableProps(componentId);
   if (!overridableProps) {
     return;
   }
@@ -2556,56 +2690,44 @@ function reorderGroupProps({ componentId, groupId, newPropsOrder }) {
   if (!group) {
     return;
   }
-  (0, import_store32.__dispatch)(
-    slice.actions.setOverridableProps({
-      componentId,
-      overridableProps: {
-        ...overridableProps,
-        groups: {
-          ...overridableProps.groups,
-          items: {
-            ...overridableProps.groups.items,
-            [groupId]: {
-              ...group,
-              props: newPropsOrder
-            }
-          }
+  componentsActions.setOverridableProps(componentId, {
+    ...overridableProps,
+    groups: {
+      ...overridableProps.groups,
+      items: {
+        ...overridableProps.groups.items,
+        [groupId]: {
+          ...group,
+          props: newPropsOrder
         }
       }
-    })
-  );
+    }
+  });
 }
 
 // src/extended/store/actions/reorder-overridable-groups.ts
-var import_store34 = require("@elementor/store");
 function reorderOverridableGroups({ componentId, newOrder }) {
-  const overridableProps = selectOverridableProps((0, import_store34.__getState)(), componentId);
+  const overridableProps = componentsSelectors.getOverridableProps(componentId);
   if (!overridableProps) {
     return;
   }
-  (0, import_store34.__dispatch)(
-    slice.actions.setOverridableProps({
-      componentId,
-      overridableProps: {
-        ...overridableProps,
-        groups: {
-          ...overridableProps.groups,
-          order: newOrder
-        }
-      }
-    })
-  );
+  componentsActions.setOverridableProps(componentId, {
+    ...overridableProps,
+    groups: {
+      ...overridableProps.groups,
+      order: newOrder
+    }
+  });
 }
 
 // src/extended/store/actions/update-overridable-prop-params.ts
-var import_store36 = require("@elementor/store");
 function updateOverridablePropParams({
   componentId,
   overrideKey,
   label,
   groupId
 }) {
-  const overridableProps = selectOverridableProps((0, import_store36.__getState)(), componentId);
+  const overridableProps = componentsSelectors.getOverridableProps(componentId);
   if (!overridableProps) {
     return;
   }
@@ -2621,19 +2743,14 @@ function updateOverridablePropParams({
     groupId: newGroupId
   };
   const updatedGroups = movePropBetweenGroups(overridableProps.groups, overrideKey, oldGroupId, newGroupId);
-  (0, import_store36.__dispatch)(
-    slice.actions.setOverridableProps({
-      componentId,
-      overridableProps: {
-        ...overridableProps,
-        props: {
-          ...overridableProps.props,
-          [overrideKey]: updatedProp
-        },
-        groups: updatedGroups
-      }
-    })
-  );
+  componentsActions.setOverridableProps(componentId, {
+    ...overridableProps,
+    props: {
+      ...overridableProps.props,
+      [overrideKey]: updatedProp
+    },
+    groups: updatedGroups
+  });
   return updatedProp;
 }
 
@@ -3120,9 +3237,8 @@ var import_editor_ui10 = require("@elementor/editor-ui");
 var import_i18n15 = require("@wordpress/i18n");
 
 // src/extended/store/actions/rename-overridable-group.ts
-var import_store38 = require("@elementor/store");
 function renameOverridableGroup({ componentId, groupId, label }) {
-  const overridableProps = selectOverridableProps((0, import_store38.__getState)(), componentId);
+  const overridableProps = componentsSelectors.getOverridableProps(componentId);
   if (!overridableProps) {
     return false;
   }
@@ -3131,15 +3247,10 @@ function renameOverridableGroup({ componentId, groupId, label }) {
     return false;
   }
   const updatedGroups = renameGroup(overridableProps.groups, groupId, label);
-  (0, import_store38.__dispatch)(
-    slice.actions.setOverridableProps({
-      componentId,
-      overridableProps: {
-        ...overridableProps,
-        groups: updatedGroups
-      }
-    })
-  );
+  componentsActions.setOverridableProps(componentId, {
+    ...overridableProps,
+    groups: updatedGroups
+  });
   return true;
 }
 
@@ -3460,7 +3571,7 @@ var ComponentPanelHeader = () => {
   ));
 };
 function getComponentName() {
-  const state = (0, import_store42.__getState)();
+  const state = (0, import_store30.__getState)();
   const path = state[SLICE_NAME].path;
   const { instanceTitle } = path.at(-1) ?? {};
   if (instanceTitle) {
@@ -3489,7 +3600,6 @@ var import_i18n23 = require("@wordpress/i18n");
 // src/extended/store/actions/archive-component.ts
 var import_editor_documents9 = require("@elementor/editor-documents");
 var import_editor_notifications = require("@elementor/editor-notifications");
-var import_store44 = require("@elementor/store");
 var import_i18n20 = require("@wordpress/i18n");
 var successNotification = (componentId, componentName) => ({
   type: "success",
@@ -3498,7 +3608,7 @@ var successNotification = (componentId, componentName) => ({
   id: `success-archived-components-notification-${componentId}`
 });
 var archiveComponent = (componentId, componentName) => {
-  (0, import_store44.__dispatch)(slice.actions.archive(componentId));
+  componentsActions.archive(componentId);
   (0, import_editor_documents9.setDocumentModifiedStatus)(true);
   (0, import_editor_notifications.notify)(successNotification(componentId, componentName));
 };
@@ -3506,10 +3616,9 @@ var archiveComponent = (componentId, componentName) => {
 // src/extended/store/actions/rename-component.ts
 var import_editor_documents10 = require("@elementor/editor-documents");
 var import_editor_elements8 = require("@elementor/editor-elements");
-var import_store46 = require("@elementor/store");
 var TITLE_EXTERNAL_CHANGE_COMMAND = "title_external_change";
 var renameComponent = (componentUid, newName) => {
-  (0, import_store46.__dispatch)(slice.actions.rename({ componentUid, name: newName }));
+  componentsActions.rename(componentUid, newName);
   (0, import_editor_documents10.setDocumentModifiedStatus)(true);
   refreshComponentInstanceTitles(componentUid);
 };
@@ -3537,9 +3646,6 @@ function findComponentInstancesByUid(documentContainer, componentUid) {
   });
 }
 
-// src/extended/utils/component-name-validation.ts
-var import_store48 = require("@elementor/store");
-
 // src/extended/utils/component-form-schema.ts
 var import_schema5 = require("@elementor/schema");
 var import_i18n21 = require("@wordpress/i18n");
@@ -3566,7 +3672,7 @@ var createSubmitComponentSchema = (existingNames) => {
 
 // src/extended/utils/component-name-validation.ts
 function validateComponentName(label) {
-  const existingComponentTitles = selectComponents((0, import_store48.__getState)())?.map(({ name }) => name) ?? [];
+  const existingComponentTitles = componentsSelectors.getComponents()?.map(({ name }) => name) ?? [];
   const schema = createSubmitComponentSchema(existingComponentTitles);
   const result = schema.safeParse({ componentName: label.toLowerCase() });
   if (result.success) {
@@ -3817,14 +3923,12 @@ var import_editor_elements14 = require("@elementor/editor-elements");
 var import_editor_notifications3 = require("@elementor/editor-notifications");
 var import_editor_ui16 = require("@elementor/editor-ui");
 var import_icons16 = require("@elementor/icons");
-var import_store54 = require("@elementor/store");
 var import_ui26 = require("@elementor/ui");
 var import_i18n26 = require("@wordpress/i18n");
 
 // src/extended/store/actions/create-unpublished-component.ts
 var import_editor_elements12 = require("@elementor/editor-elements");
 var import_editor_v1_adapters3 = require("@elementor/editor-v1-adapters");
-var import_store50 = require("@elementor/store");
 var import_utils7 = require("@elementor/utils");
 var import_i18n24 = require("@wordpress/i18n");
 
@@ -3857,14 +3961,12 @@ async function createUnpublishedComponent({
     parentId: container?.parent?.id ?? "",
     index: container?.view?._index ?? 0
   };
-  (0, import_store50.__dispatch)(
-    slice.actions.addUnpublished({
-      ...componentBase,
-      elements: [elementDataWithOverridablesReverted],
-      overridableProps
-    })
-  );
-  (0, import_store50.__dispatch)(slice.actions.addCreatedThisSession(generatedUid));
+  componentsActions.addUnpublished({
+    ...componentBase,
+    elements: [elementDataWithOverridablesReverted],
+    overridableProps
+  });
+  componentsActions.addCreatedThisSession(generatedUid);
   const componentInstance = await replaceElementWithComponent(element, componentBase);
   trackComponentEvent({
     action: "created",
@@ -3877,8 +3979,8 @@ async function createUnpublishedComponent({
     await (0, import_editor_v1_adapters3.__privateRunCommand)("document/save/auto");
   } catch (error) {
     restoreOriginalElement(originalElement, componentInstance.id);
-    (0, import_store50.__dispatch)(slice.actions.removeUnpublished(generatedUid));
-    (0, import_store50.__dispatch)(slice.actions.removeCreatedThisSession(generatedUid));
+    componentsActions.removeUnpublished(generatedUid);
+    componentsActions.removeCreatedThisSession(generatedUid);
     throw error;
   }
   return { uid: generatedUid, instanceId: componentInstance.id };
@@ -3913,13 +4015,8 @@ var import_editor_v1_adapters4 = require("@elementor/editor-v1-adapters");
 var import_i18n25 = require("@wordpress/i18n");
 
 // src/extended/utils/is-editing-component.ts
-var import_store52 = require("@elementor/store");
 function isEditingComponent() {
-  const state = (0, import_store52.__getStore)()?.getState();
-  if (!state) {
-    return false;
-  }
-  return selectCurrentComponentId(state) !== null;
+  return componentsSelectors.getCurrentComponentId() !== null;
 }
 
 // src/extended/sync/prevent-non-atomic-nesting.ts
@@ -4141,7 +4238,7 @@ function CreateComponentForm() {
         eventData: eventData.current,
         source: "user"
       });
-      const publishedComponentId = selectComponentByUid((0, import_store54.__getState)(), uid)?.id;
+      const publishedComponentId = componentsSelectors.getComponentByUid(uid)?.id;
       if (publishedComponentId) {
         switchToComponent(publishedComponentId, instanceId);
       } else {
@@ -4290,7 +4387,7 @@ var React33 = __toESM(require("react"));
 var import_react18 = require("react");
 var import_editor_documents11 = require("@elementor/editor-documents");
 var import_editor_v1_adapters6 = require("@elementor/editor-v1-adapters");
-var import_store60 = require("@elementor/store");
+var import_store32 = require("@elementor/store");
 var import_utils9 = require("@elementor/utils");
 
 // src/extended/consts.ts
@@ -4298,23 +4395,14 @@ var OVERRIDABLE_PROP_REPLACEMENT_ID = "overridable-prop";
 var COMPONENT_DOCUMENT_TYPE = "elementor_component";
 
 // src/extended/store/actions/reset-sanitized-components.ts
-var import_store56 = require("@elementor/store");
 function resetSanitizedComponents() {
-  (0, import_store56.__dispatch)(slice.actions.resetSanitizedComponents());
+  componentsActions.resetSanitizedComponents();
 }
 
 // src/extended/store/actions/update-current-component.ts
-var import_store58 = require("@elementor/store");
-function updateCurrentComponent({
-  path,
-  currentComponentId
-}) {
-  const dispatch21 = (0, import_store58.__getStore)()?.dispatch;
-  if (!dispatch21) {
-    return;
-  }
-  dispatch21(slice.actions.setPath(path));
-  dispatch21(slice.actions.setCurrentComponentId(currentComponentId));
+function updateCurrentComponent(params) {
+  componentsActions.setPath(params.path);
+  componentsActions.setCurrentComponentId(params.currentComponentId);
 }
 
 // src/extended/components/edit-component/component-modal.tsx
@@ -4505,7 +4593,7 @@ function EditComponent() {
 function useHandleDocumentSwitches() {
   const documentsManager = (0, import_editor_documents11.getV1DocumentsManager)();
   const currentComponentId = useCurrentComponentId();
-  const path = (0, import_store60.__useSelector)(selectPath);
+  const path = (0, import_store32.__useSelector)(selectPath);
   (0, import_react18.useEffect)(() => {
     return (0, import_editor_v1_adapters6.__privateListenTo)((0, import_editor_v1_adapters6.commandEndEvent)("editor/documents/open"), () => {
       const nextDocument = documentsManager.getCurrent();
@@ -4719,7 +4807,6 @@ var import_ui29 = require("@elementor/ui");
 var import_i18n30 = require("@wordpress/i18n");
 
 // src/extended/store/actions/set-overridable-prop.ts
-var import_store63 = require("@elementor/store");
 var import_utils10 = require("@elementor/utils");
 function setOverridableProp({
   componentId,
@@ -4734,7 +4821,7 @@ function setOverridableProp({
   originPropFields,
   source
 }) {
-  const overridableProps = selectOverridableProps((0, import_store63.__getState)(), componentId);
+  const overridableProps = componentsSelectors.getOverridableProps(componentId);
   if (!overridableProps) {
     return;
   }
@@ -4771,18 +4858,10 @@ function setOverridableProp({
   if (isChangingGroups) {
     groups = removePropFromGroup(groups, existingOverridableProp.groupId, overridableProp.overrideKey);
   }
-  (0, import_store63.__dispatch)(
-    slice.actions.setOverridableProps({
-      componentId,
-      overridableProps: {
-        props,
-        groups
-      }
-    })
-  );
+  componentsActions.setOverridableProps(componentId, { props, groups });
   const isNewProperty = !existingOverridableProp;
   if (isNewProperty) {
-    const currentComponent = selectCurrentComponent((0, import_store63.__getState)());
+    const currentComponent = componentsSelectors.getCurrentComponent();
     trackComponentEvent({
       action: "propertyExposed",
       source,
@@ -5340,7 +5419,6 @@ async function publishDraftComponentsInPageBeforeSave({ status, elements }) {
 }
 
 // src/extended/sync/set-component-overridable-props-settings-before-save.ts
-var import_store66 = require("@elementor/store");
 var setComponentOverridablePropsSettingsBeforeSave = ({
   container
 }) => {
@@ -5348,7 +5426,7 @@ var setComponentOverridablePropsSettingsBeforeSave = ({
   if (!currentDocument || currentDocument.config.type !== COMPONENT_DOCUMENT_TYPE) {
     return;
   }
-  const overridableProps = selectOverridableProps((0, import_store66.__getState)(), currentDocument.id);
+  const overridableProps = componentsSelectors.getOverridableProps(currentDocument.id);
   if (overridableProps) {
     container.settings.set("overridable_props", overridableProps);
   }
@@ -5356,7 +5434,6 @@ var setComponentOverridablePropsSettingsBeforeSave = ({
 
 // src/extended/sync/update-archived-component-before-save.ts
 var import_editor_notifications4 = require("@elementor/editor-notifications");
-var import_store68 = require("@elementor/store");
 var failedNotification = (message) => ({
   type: "error",
   message: `Failed to archive components: ${message}`,
@@ -5364,7 +5441,7 @@ var failedNotification = (message) => ({
 });
 var updateArchivedComponentBeforeSave = async (status) => {
   try {
-    const archivedComponents = selectArchivedThisSession((0, import_store68.__getState)());
+    const archivedComponents = componentsSelectors.getArchivedThisSession();
     if (!archivedComponents.length) {
       return;
     }
@@ -5379,46 +5456,42 @@ var updateArchivedComponentBeforeSave = async (status) => {
 };
 
 // src/extended/sync/update-component-title-before-save.ts
-var import_store70 = require("@elementor/store");
 var updateComponentTitleBeforeSave = async (status) => {
-  const updatedComponentNames = selectUpdatedComponentNames((0, import_store70.__getState)());
+  const updatedComponentNames = componentsSelectors.getUpdatedComponentNames();
   if (!updatedComponentNames.length) {
     return;
   }
   const result = await apiClient.updateComponentTitle(updatedComponentNames, status);
   if (result.failedIds.length === 0) {
-    (0, import_store70.__dispatch)(slice.actions.cleanUpdatedComponentNames());
+    componentsActions.cleanUpdatedComponentNames();
   }
 };
 
 // src/extended/sync/create-components-before-save.ts
 var import_editor_elements17 = require("@elementor/editor-elements");
-var import_store72 = require("@elementor/store");
 async function createComponentsBeforeSave({
   elements,
   status
 }) {
-  const unpublishedComponents = selectUnpublishedComponents((0, import_store72.__getState)());
+  const unpublishedComponents = componentsSelectors.getUnpublishedComponents();
   if (!unpublishedComponents.length) {
     return;
   }
   try {
     const uidToComponentId = await createComponents(unpublishedComponents, status);
     updateComponentInstances(elements, uidToComponentId);
-    (0, import_store72.__dispatch)(
-      slice.actions.add(
-        unpublishedComponents.map((component) => ({
-          id: uidToComponentId.get(component.uid),
-          name: component.name,
-          uid: component.uid,
-          overridableProps: component.overridableProps ? component.overridableProps : void 0
-        }))
-      )
+    componentsActions.add(
+      unpublishedComponents.map((component) => ({
+        id: uidToComponentId.get(component.uid),
+        name: component.name,
+        uid: component.uid,
+        overridableProps: component.overridableProps ? component.overridableProps : void 0
+      }))
     );
-    (0, import_store72.__dispatch)(slice.actions.resetUnpublished());
+    componentsActions.resetUnpublished();
   } catch (error) {
     const failedUids = unpublishedComponents.map((component) => component.uid);
-    (0, import_store72.__dispatch)(slice.actions.removeUnpublished(failedUids));
+    componentsActions.removeUnpublished(failedUids);
     throw new Error(`Failed to publish components: ${error}`);
   }
 }
@@ -5500,21 +5573,16 @@ var updateExistingComponentsBeforeSave = async ({
 // src/extended/sync/cleanup-overridable-props-on-delete.ts
 var import_editor_elements18 = require("@elementor/editor-elements");
 var import_editor_v1_adapters7 = require("@elementor/editor-v1-adapters");
-var import_store74 = require("@elementor/store");
 function initCleanupOverridablePropsOnDelete() {
   (0, import_editor_v1_adapters7.registerDataHook)("dependency", "document/elements/delete", (args, options) => {
     if (isPartOfMoveCommand(options)) {
       return true;
     }
-    const state = (0, import_store74.__getState)();
-    if (!state) {
-      return true;
-    }
-    const currentComponentId = selectCurrentComponentId(state);
+    const currentComponentId = componentsSelectors.getCurrentComponentId();
     if (!currentComponentId) {
       return true;
     }
-    const overridableProps = selectOverridableProps(state, currentComponentId);
+    const overridableProps = componentsSelectors.getOverridableProps(currentComponentId);
     if (!overridableProps || Object.keys(overridableProps.props).length === 0) {
       return true;
     }
@@ -5657,9 +5725,8 @@ function revertOverridablesInStorage(storageKey) {
 var import_react20 = require("react");
 
 // src/extended/store/actions/update-component-sanitized-attribute.ts
-var import_store76 = require("@elementor/store");
 function updateComponentSanitizedAttribute(componentId, attribute) {
-  (0, import_store76.__dispatch)(slice.actions.updateComponentSanitizedAttribute({ componentId, attribute }));
+  componentsActions.updateComponentSanitizedAttribute(componentId, attribute);
 }
 
 // src/extended/sync/sanitize-overridable-props.ts
@@ -5684,16 +5751,19 @@ function SanitizeOverridableProps() {
 }
 
 // src/extended/init.ts
+var PRIORITY = 1;
 function initExtended() {
   (0, import_editor_editing_panel8.registerEditingPanelReplacement)({
-    id: "component-instance-edit-panel",
+    id: "extended-component-instance-edit-panel",
+    priority: PRIORITY,
     condition: (_, elementType) => elementType.key === "e-component",
     component: ExtendedInstanceEditingPanel
   });
   (0, import_editor_elements_panel.registerTab)({
     id: "components",
     label: (0, import_i18n31.__)("Components", "elementor"),
-    component: ExtendedComponents
+    component: ExtendedComponents,
+    priority: PRIORITY
   });
   (0, import_editor_panels6.__registerPanel)(panel);
   (0, import_editor_v1_adapters10.registerDataHook)("dependency", "editor/documents/close", (args) => {
@@ -5741,10 +5811,10 @@ function initExtended() {
 
 // src/populate-store.ts
 var import_react21 = require("react");
-var import_store79 = require("@elementor/store");
+var import_store37 = require("@elementor/store");
 function PopulateStore() {
   (0, import_react21.useEffect)(() => {
-    (0, import_store79.__dispatch)(loadComponents());
+    (0, import_store37.__dispatch)(loadComponents());
   }, []);
   return null;
 }
@@ -5753,7 +5823,7 @@ function PopulateStore() {
 var import_editor_elements20 = require("@elementor/editor-elements");
 var import_editor_notifications5 = require("@elementor/editor-notifications");
 var import_editor_v1_adapters11 = require("@elementor/editor-v1-adapters");
-var import_store80 = require("@elementor/store");
+var import_store38 = require("@elementor/store");
 var import_i18n32 = require("@wordpress/i18n");
 var COMPONENT_TYPE = "e-component";
 var COMPONENT_CIRCULAR_NESTING_ALERT = {
@@ -5779,7 +5849,7 @@ function wouldCreateCircularNesting(componentIdToAdd) {
   if (componentIdToAdd === void 0) {
     return false;
   }
-  const state = (0, import_store80.__getState)();
+  const state = (0, import_store38.__getState)();
   const currentComponentId = selectCurrentComponentId(state);
   const path = selectPath(state);
   if (currentComponentId === null) {
@@ -5877,19 +5947,19 @@ function blockCircularPaste(args) {
 }
 
 // src/store/actions/remove-component-styles.ts
-var import_store82 = require("@elementor/store");
+var import_store40 = require("@elementor/store");
 function removeComponentStyles(id2) {
   apiClient.invalidateComponentConfigCache(id2);
-  (0, import_store82.__dispatch)(slice.actions.removeStyles({ id: id2 }));
+  (0, import_store40.__dispatch)(slice.actions.removeStyles({ id: id2 }));
 }
 
 // src/store/components-styles-provider.ts
 var import_editor_styles_repository = require("@elementor/editor-styles-repository");
-var import_store84 = require("@elementor/store");
+var import_store42 = require("@elementor/store");
 var componentsStylesProvider = (0, import_editor_styles_repository.createStylesProvider)({
   key: "components-styles",
   priority: 100,
-  subscribe: (cb) => (0, import_store84.__subscribeWithSelector)(
+  subscribe: (cb) => (0, import_store42.__subscribeWithSelector)(
     (state) => state[SLICE_NAME],
     () => {
       cb();
@@ -5897,10 +5967,10 @@ var componentsStylesProvider = (0, import_editor_styles_repository.createStylesP
   ),
   actions: {
     all: () => {
-      return selectFlatStyles((0, import_store84.__getState)());
+      return selectFlatStyles((0, import_store42.__getState)());
     },
     get: (id2) => {
-      return selectFlatStyles((0, import_store84.__getState)()).find((style) => style.id === id2) ?? null;
+      return selectFlatStyles((0, import_store42.__getState)()).find((style) => style.id === id2) ?? null;
     }
   }
 });
@@ -5929,7 +5999,7 @@ function load(result) {
 // src/init.ts
 function init() {
   import_editor_styles_repository2.stylesRepository.register(componentsStylesProvider);
-  (0, import_store86.__registerSlice)(slice);
+  (0, import_store44.__registerSlice)(slice);
   (0, import_editor_canvas8.registerElementType)(
     COMPONENT_WIDGET_TYPE,
     (options) => createComponentType({ ...options, showLockedByModal: openEditModeDialog })
@@ -5970,6 +6040,76 @@ function init() {
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  init
+  COMPONENT_WIDGET_TYPE,
+  ComponentInstanceProvider,
+  ComponentItem,
+  ComponentName,
+  ComponentSearch,
+  ComponentsEmptyState,
+  ComponentsList,
+  EditComponentAction,
+  EmptySearchResult,
+  InstanceEmptyState,
+  InstancePanelBody,
+  InstancePanelHeader,
+  LoadingComponents,
+  OverridablePropProvider,
+  SLICE_NAME,
+  SearchProvider,
+  apiClient,
+  componentInstanceOverridePropTypeUtil,
+  componentInstanceOverridesPropTypeUtil,
+  componentInstancePropTypeUtil,
+  componentOverridablePropTypeUtil,
+  componentsActions,
+  componentsSelectors,
+  filterValidOverridableProps,
+  getContainerByOriginId,
+  getOverridableProp,
+  getPropTypeForComponentOverride,
+  init,
+  isComponentInstance,
+  isExposedPropValid,
+  loadComponentsAssets,
+  onElementDrop,
+  publishDraftComponentsInPageBeforeSave,
+  resolveOverridePropValue,
+  selectArchivedThisSession,
+  selectComponent,
+  selectComponentByUid,
+  selectComponents,
+  selectCreatedThisSession,
+  selectCurrentComponent,
+  selectCurrentComponentId,
+  selectData,
+  selectFlatStyles,
+  selectIsOverridablePropsLoaded,
+  selectLoadIsError,
+  selectLoadIsPending,
+  selectOverridableProps,
+  selectPath,
+  selectStyles,
+  selectUnpublishedComponents,
+  selectUpdatedComponentNames,
+  slice,
+  switchToComponent,
+  trackComponentEvent,
+  updateOverridableProp,
+  useComponent,
+  useComponentId,
+  useComponentInstanceElement,
+  useComponentInstanceOverrides,
+  useComponentOverridableProps,
+  useComponents,
+  useComponentsPermissions,
+  useCurrentComponent,
+  useCurrentComponentId,
+  useFilteredComponents,
+  useInstancePanelData,
+  useIsSanitizedComponent,
+  useOverridablePropValue,
+  useOverridableProps,
+  useSanitizeOverridableProps,
+  useSearch
 });
 //# sourceMappingURL=index.js.map