@elementor/editor-components 4.0.0-604 → 4.0.0-607

package/dist/index.mjs

@@ -1,5 +1,5 @@
 // src/init.ts
-import { injectIntoLogic } from "@elementor/editor";
+import { injectIntoLogic as injectIntoLogic2 } from "@elementor/editor";
 import {
   registerElementType,
   settingsTransformersRegistry as settingsTransformersRegistry2
@@ -1529,406 +1529,65 @@ import { PanelBody, PanelHeader, PanelHeaderTitle } from "@elementor/editor-pane
 import { EllipsisWithTooltip as EllipsisWithTooltip2 } from "@elementor/editor-ui";
 import { ComponentsIcon as ComponentsIcon3, PencilIcon as PencilIcon2 } from "@elementor/icons";
 import { Box as Box8, Divider as Divider2, IconButton as IconButton2, Stack as Stack10, Tooltip } from "@elementor/ui";
-import { __ as __12 } from "@wordpress/i18n";
-
-// src/extended/store/actions/delete-overridable-prop.ts
-import { __dispatch as dispatch5, __getState as getState7 } from "@elementor/store";
-
-// src/extended/utils/revert-overridable-settings.ts
-import {
-  getAllDescendants as getAllDescendants2,
-  getContainer as getContainer2,
-  getElementSetting,
-  updateElementSettings
-} from "@elementor/editor-elements";
-
-// src/prop-types/component-instance-override-prop-type.ts
-import { createPropUtils } from "@elementor/editor-props";
-import { z as z2 } from "@elementor/schema";
-var componentInstanceOverridePropTypeUtil = createPropUtils(
-  "override",
-  z2.object({
-    override_key: z2.string(),
-    override_value: z2.unknown(),
-    schema_source: z2.object({
-      type: z2.literal("component"),
-      id: z2.number()
-    })
-  })
-);
-
-// src/prop-types/component-instance-overrides-prop-type.ts
-import { createPropUtils as createPropUtils3 } from "@elementor/editor-props";
-import { z as z4 } from "@elementor/schema";
-
-// src/prop-types/component-overridable-prop-type.ts
-import { createPropUtils as createPropUtils2 } from "@elementor/editor-props";
-import { z as z3 } from "@elementor/schema";
-var componentOverridablePropTypeUtil = createPropUtils2(
-  "overridable",
-  z3.object({
-    override_key: z3.string(),
-    origin_value: z3.object({
-      $$type: z3.string(),
-      value: z3.unknown()
-    }).nullable()
-  })
-);
-
-// src/prop-types/component-instance-overrides-prop-type.ts
-var componentInstanceOverridesPropTypeUtil = createPropUtils3(
-  "overrides",
-  z4.array(z4.union([componentInstanceOverridePropTypeUtil.schema, componentOverridablePropTypeUtil.schema])).optional().default([])
-);
-
-// src/prop-types/component-instance-prop-type.ts
-import { createPropUtils as createPropUtils4, numberPropTypeUtil } from "@elementor/editor-props";
-import { z as z5 } from "@elementor/schema";
-var componentInstancePropTypeUtil = createPropUtils4(
-  "component-instance",
-  z5.object({
-    component_id: numberPropTypeUtil.schema,
-    overrides: z5.optional(componentInstanceOverridesPropTypeUtil.schema)
-  })
-);
-
-// src/extended/utils/revert-overridable-settings.ts
-function revertElementOverridableSetting(elementId, settingKey, originValue, overrideKey) {
-  const container = getContainer2(elementId);
-  if (!container) {
-    return;
-  }
-  if (isComponentInstance(container.model.toJSON())) {
-    revertComponentInstanceOverridableSetting(elementId, overrideKey);
-    return;
-  }
-  updateElementSettings({
-    id: elementId,
-    props: { [settingKey]: originValue ?? null },
-    withHistory: false
-  });
-}
-function revertComponentInstanceOverridableSetting(elementId, overrideKey) {
-  const setting = getElementSetting(elementId, "component_instance");
-  const componentInstance = componentInstancePropTypeUtil.extract(setting);
-  const overrides = componentInstanceOverridesPropTypeUtil.extract(componentInstance?.overrides);
-  if (!overrides?.length) {
-    return;
-  }
-  const revertedOverrides = revertComponentInstanceOverrides(overrides, overrideKey);
-  const updatedSetting = componentInstancePropTypeUtil.create({
-    ...componentInstance,
-    overrides: componentInstanceOverridesPropTypeUtil.create(revertedOverrides)
-  });
-  updateElementSettings({
-    id: elementId,
-    props: { component_instance: updatedSetting },
-    withHistory: false
-  });
-}
-function revertComponentInstanceOverrides(overrides, filterByKey) {
-  return overrides.map((item) => {
-    if (!componentOverridablePropTypeUtil.isValid(item)) {
-      return item;
-    }
-    if (!componentInstanceOverridePropTypeUtil.isValid(item.value.origin_value)) {
-      return null;
-    }
-    if (filterByKey && item.value.override_key !== filterByKey) {
-      return item;
-    }
-    return item.value.origin_value;
-  }).filter((item) => item !== null);
-}
-function revertOverridablePropsFromSettings(settings) {
-  let hasChanges = false;
-  const revertedSettings = {};
-  for (const [key, value] of Object.entries(settings)) {
-    if (componentOverridablePropTypeUtil.isValid(value)) {
-      revertedSettings[key] = value.value.origin_value;
-      hasChanges = true;
-    } else {
-      revertedSettings[key] = value;
-    }
-  }
-  return { hasChanges, settings: revertedSettings };
-}
-function revertAllOverridablesInElementData(elementData) {
-  const revertedElement = { ...elementData };
-  if (isComponentInstance({ widgetType: elementData.widgetType, elType: elementData.elType })) {
-    revertedElement.settings = revertComponentInstanceSettings(elementData.settings);
-  } else if (revertedElement.settings) {
-    const { settings } = revertOverridablePropsFromSettings(revertedElement.settings);
-    revertedElement.settings = settings;
-  }
-  if (revertedElement.elements) {
-    revertedElement.elements = revertedElement.elements.map(revertAllOverridablesInElementData);
-  }
-  return revertedElement;
-}
-function revertComponentInstanceSettings(settings) {
-  if (!settings?.component_instance) {
-    return settings;
-  }
-  const componentInstance = componentInstancePropTypeUtil.extract(settings.component_instance);
-  const overrides = componentInstanceOverridesPropTypeUtil.extract(componentInstance?.overrides);
-  if (!overrides?.length) {
-    return settings;
-  }
-  const revertedOverrides = revertComponentInstanceOverrides(overrides);
-  return {
-    ...settings,
-    component_instance: componentInstancePropTypeUtil.create({
-      ...componentInstance,
-      overrides: componentInstanceOverridesPropTypeUtil.create(revertedOverrides)
-    })
-  };
-}
-function revertAllOverridablesInContainer(container) {
-  getAllDescendants2(container).forEach((element) => {
-    if (element.model.get("widgetType") === COMPONENT_WIDGET_TYPE) {
-      revertComponentInstanceOverridesInElement(element);
-    } else {
-      revertElementSettings(element);
-    }
-  });
-}
-function revertComponentInstanceOverridesInElement(element) {
-  const settings = element.settings?.toJSON() ?? {};
-  const componentInstance = componentInstancePropTypeUtil.extract(settings.component_instance);
-  const overrides = componentInstanceOverridesPropTypeUtil.extract(componentInstance?.overrides);
-  if (!overrides?.length) {
-    return;
-  }
-  const revertedOverrides = revertComponentInstanceOverrides(overrides);
-  const updatedSetting = componentInstancePropTypeUtil.create({
-    ...componentInstance,
-    overrides: componentInstanceOverridesPropTypeUtil.create(revertedOverrides)
-  });
-  updateElementSettings({
-    id: element.id,
-    props: { component_instance: updatedSetting },
-    withHistory: false
-  });
-}
-function revertElementSettings(element) {
-  const settings = element.settings?.toJSON() ?? {};
-  const { hasChanges, settings: revertedSettings } = revertOverridablePropsFromSettings(settings);
-  if (!hasChanges) {
-    return;
-  }
-  updateElementSettings({
-    id: element.id,
-    props: revertedSettings,
-    withHistory: false
-  });
-}
-
-// src/extended/store/utils/groups-transformers.ts
-import { generateUniqueId } from "@elementor/utils";
-import { __ as __10 } from "@wordpress/i18n";
-function removePropFromAllGroups(groups, propKey) {
-  const propKeys = Array.isArray(propKey) ? propKey : [propKey];
-  return {
-    ...groups,
-    items: Object.fromEntries(
-      Object.entries(groups.items).map(([groupId, group]) => [
-        groupId,
-        {
-          ...group,
-          props: group.props.filter((p) => !propKeys.includes(p))
-        }
-      ])
-    )
-  };
-}
-function addPropToGroup(groups, groupId, propKey) {
-  const group = groups.items[groupId];
-  if (!group) {
-    return groups;
-  }
-  if (group.props.includes(propKey)) {
-    return groups;
-  }
-  return {
-    ...groups,
-    items: {
-      ...groups.items,
-      [groupId]: {
-        ...group,
-        props: [...group.props, propKey]
-      }
-    }
-  };
-}
-function movePropBetweenGroups(groups, propKey, fromGroupId, toGroupId) {
-  if (fromGroupId === toGroupId) {
-    return groups;
-  }
-  const withoutProp = removePropFromGroup(groups, fromGroupId, propKey);
-  return addPropToGroup(withoutProp, toGroupId, propKey);
-}
-function removePropFromGroup(groups, groupId, propKey) {
-  const group = groups.items[groupId];
-  if (!group) {
-    return groups;
-  }
-  return {
-    ...groups,
-    items: {
-      ...groups.items,
-      [groupId]: {
-        ...group,
-        props: group.props.filter((p) => p !== propKey)
-      }
-    }
-  };
-}
-function resolveOrCreateGroup(groups, requestedGroupId) {
-  if (requestedGroupId && groups.items[requestedGroupId]) {
-    return { groups, groupId: requestedGroupId };
-  }
-  if (!requestedGroupId && groups.order.length > 0) {
-    return { groups, groupId: groups.order[0] };
-  }
-  return createGroup(groups, requestedGroupId);
-}
-function createGroup(groups, groupId, label) {
-  const newGroupId = groupId || generateUniqueId("group");
-  const newLabel = label || __10("Default", "elementor");
-  return {
-    groups: {
-      ...groups,
-      items: {
-        ...groups.items,
-        [newGroupId]: {
-          id: newGroupId,
-          label: newLabel,
-          props: []
-        }
-      },
-      order: [...groups.order, newGroupId]
-    },
-    groupId: newGroupId
-  };
-}
-function removePropsFromState(overridableProps, propsToRemove) {
-  const overrideKeysToRemove = propsToRemove.map((prop) => prop.overrideKey);
-  const remainingProps = Object.fromEntries(
-    Object.entries(overridableProps.props).filter(([, prop]) => !propsToRemove.includes(prop))
-  );
-  const updatedGroupItems = Object.fromEntries(
-    Object.entries(overridableProps.groups.items).map(
-      ([groupId, group]) => [
-        groupId,
-        {
-          ...group,
-          props: group.props.filter((prop) => !overrideKeysToRemove.includes(prop))
-        }
-      ]
-    )
-  );
-  return {
-    props: remainingProps,
-    groups: {
-      items: updatedGroupItems,
-      order: overridableProps.groups.order.filter((groupId) => !overrideKeysToRemove.includes(groupId))
-    }
-  };
-}
-function ensureGroupInOrder(groups, groupId) {
-  if (groups.order.includes(groupId)) {
-    return groups;
-  }
-  return {
-    ...groups,
-    order: [...groups.order, groupId]
-  };
-}
-function deleteGroup(groups, groupId) {
-  const { [groupId]: removed, ...remainingItems } = groups.items;
-  return {
-    items: remainingItems,
-    order: groups.order.filter((id2) => id2 !== groupId)
-  };
-}
-function renameGroup(groups, groupId, newLabel) {
-  const group = groups.items[groupId];
-  if (!group) {
-    return groups;
-  }
-  return {
-    ...groups,
-    items: {
-      ...groups.items,
-      [groupId]: {
-        ...group,
-        label: newLabel
-      }
-    }
-  };
-}
+import { __ as __11 } from "@wordpress/i18n";
 
-// src/extended/store/actions/delete-overridable-prop.ts
-function deleteOverridableProp({ componentId, propKey, source }) {
-  const overridableProps = selectOverridableProps(getState7(), componentId);
-  if (!overridableProps || Object.keys(overridableProps.props).length === 0) {
-    return;
-  }
-  const propKeysToDelete = Array.isArray(propKey) ? propKey : [propKey];
-  const deletedProps = [];
-  for (const key of propKeysToDelete) {
-    const prop = overridableProps.props[key];
-    if (!prop) {
-      continue;
-    }
-    deletedProps.push(prop);
-    revertElementOverridableSetting(prop.elementId, prop.propKey, prop.originValue, key);
-  }
-  if (deletedProps.length === 0) {
-    return;
-  }
-  const remainingProps = Object.fromEntries(
-    Object.entries(overridableProps.props).filter(([key]) => !propKeysToDelete.includes(key))
-  );
-  const updatedGroups = removePropFromAllGroups(overridableProps.groups, propKey);
-  dispatch5(
-    slice.actions.setOverridableProps({
-      componentId,
-      overridableProps: {
-        ...overridableProps,
-        props: remainingProps,
-        groups: updatedGroups
-      }
+// src/prop-types/component-instance-overrides-prop-type.ts
+import { createPropUtils as createPropUtils3 } from "@elementor/editor-props";
+import { z as z4 } from "@elementor/schema";
+
+// src/prop-types/component-instance-override-prop-type.ts
+import { createPropUtils } from "@elementor/editor-props";
+import { z as z2 } from "@elementor/schema";
+var componentInstanceOverridePropTypeUtil = createPropUtils(
+  "override",
+  z2.object({
+    override_key: z2.string(),
+    override_value: z2.unknown(),
+    schema_source: z2.object({
+      type: z2.literal("component"),
+      id: z2.number()
     })
-  );
-  const currentComponent = selectCurrentComponent(getState7());
-  for (const prop of deletedProps) {
-    trackComponentEvent({
-      action: "propertyRemoved",
-      source,
-      component_uid: currentComponent?.uid,
-      property_id: prop.overrideKey,
-      property_path: prop.propKey,
-      property_name: prop.label,
-      element_type: prop.widgetType ?? prop.elType
-    });
-  }
-}
+  })
+);
 
-// src/extended/store/actions/update-component-sanitized-attribute.ts
-import { __dispatch as dispatch6 } from "@elementor/store";
-function updateComponentSanitizedAttribute(componentId, attribute) {
-  dispatch6(slice.actions.updateComponentSanitizedAttribute({ componentId, attribute }));
-}
+// src/prop-types/component-overridable-prop-type.ts
+import { createPropUtils as createPropUtils2 } from "@elementor/editor-props";
+import { z as z3 } from "@elementor/schema";
+var componentOverridablePropTypeUtil = createPropUtils2(
+  "overridable",
+  z3.object({
+    override_key: z3.string(),
+    origin_value: z3.object({
+      $$type: z3.string(),
+      value: z3.unknown()
+    }).nullable()
+  })
+);
+
+// src/prop-types/component-instance-overrides-prop-type.ts
+var componentInstanceOverridesPropTypeUtil = createPropUtils3(
+  "overrides",
+  z4.array(z4.union([componentInstanceOverridePropTypeUtil.schema, componentOverridablePropTypeUtil.schema])).optional().default([])
+);
+
+// src/prop-types/component-instance-prop-type.ts
+import { createPropUtils as createPropUtils4, numberPropTypeUtil } from "@elementor/editor-props";
+import { z as z5 } from "@elementor/schema";
+var componentInstancePropTypeUtil = createPropUtils4(
+  "component-instance",
+  z5.object({
+    component_id: numberPropTypeUtil.schema,
+    overrides: z5.optional(componentInstanceOverridesPropTypeUtil.schema)
+  })
+);
 
 // src/utils/get-container-by-origin-id.ts
-import { getContainer as getContainer3 } from "@elementor/editor-elements";
+import { getContainer as getContainer2 } from "@elementor/editor-elements";
 function getContainerByOriginId(originElementId, instanceElementId) {
   if (!instanceElementId) {
-    return getContainer3(originElementId);
+    return getContainer2(originElementId);
   }
-  const instanceContainer = getContainer3(instanceElementId);
+  const instanceContainer = getContainer2(instanceElementId);
   if (!instanceContainer) {
     return null;
   }
@@ -1941,12 +1600,12 @@ function getContainerByOriginId(originElementId, instanceElementId) {
 }
 
 // src/utils/get-overridable-prop.ts
-import { __getState as getState8 } from "@elementor/store";
+import { __getState as getState7 } from "@elementor/store";
 function getOverridableProp({
   componentId,
   overrideKey
 }) {
-  const overridableProps = selectOverridableProps(getState8(), componentId);
+  const overridableProps = selectOverridableProps(getState7(), componentId);
   if (!overridableProps) {
     return void 0;
   }
@@ -2054,14 +1713,7 @@ function useSanitizeOverridableProps(componentId, instanceElementId) {
   if (isSanitized) {
     return overridableProps;
   }
-  const filteredOverridableProps = filterValidOverridableProps(overridableProps, instanceElementId);
-  const originalPropsArray = Object.entries(overridableProps.props ?? {});
-  const propsToDelete = originalPropsArray.filter(([key]) => !filteredOverridableProps.props[key]);
-  propsToDelete.forEach(([key]) => {
-    deleteOverridableProp({ componentId, propKey: key, source: "system" });
-  });
-  updateComponentSanitizedAttribute(componentId, "overridableProps");
-  return filteredOverridableProps;
+  return filterValidOverridableProps(overridableProps, instanceElementId);
 }
 
 // src/provider/component-instance-context.tsx
@@ -2079,13 +1731,13 @@ var useComponentOverridableProps = () => useContext2(ComponentInstanceContext)?.
 import * as React11 from "react";
 import { ComponentPropListIcon, PencilIcon } from "@elementor/icons";
 import { Button as Button2, Stack as Stack6, Typography as Typography5 } from "@elementor/ui";
-import { __ as __11 } from "@wordpress/i18n";
+import { __ as __10 } from "@wordpress/i18n";
 var EmptyState2 = ({ onEditComponent }) => {
   const { canEdit } = useComponentsPermissions();
-  const message = canEdit ? __11(
+  const message = canEdit ? __10(
     "Edit the component to add properties, manage them or update the design across all instances.",
     "elementor"
-  ) : __11(
+  ) : __10(
     "With your current role, you cannot edit this component. Contact an administrator to add properties.",
     "elementor"
   );
@@ -2100,9 +1752,9 @@ var EmptyState2 = ({ onEditComponent }) => {
       gap: 1.5
     },
     /* @__PURE__ */ React11.createElement(ComponentPropListIcon, { fontSize: "large" }),
-    /* @__PURE__ */ React11.createElement(Typography5, { align: "center", variant: "subtitle2" }, __11("No properties yet", "elementor")),
+    /* @__PURE__ */ React11.createElement(Typography5, { align: "center", variant: "subtitle2" }, __10("No properties yet", "elementor")),
     /* @__PURE__ */ React11.createElement(Typography5, { align: "center", variant: "caption", maxWidth: "170px" }, message),
-    canEdit && /* @__PURE__ */ React11.createElement(Button2, { variant: "outlined", color: "secondary", size: "small", sx: { mt: 1 }, onClick: onEditComponent }, /* @__PURE__ */ React11.createElement(PencilIcon, { fontSize: "small" }), __11("Edit component", "elementor"))
+    canEdit && /* @__PURE__ */ React11.createElement(Button2, { variant: "outlined", color: "secondary", size: "small", sx: { mt: 1 }, onClick: onEditComponent }, /* @__PURE__ */ React11.createElement(PencilIcon, { fontSize: "small" }), __10("Edit component", "elementor"))
   );
 };
 
@@ -2176,7 +1828,7 @@ var useOverridablePropValue = () => useContext3(OverridablePropContext)?.value;
 var useComponentInstanceElement = () => useContext3(OverridablePropContext)?.componentInstanceElement;
 
 // src/store/actions/update-overridable-prop.ts
-import { __dispatch as dispatch7, __getState as getState9 } from "@elementor/store";
+import { __dispatch as dispatch5, __getState as getState8 } from "@elementor/store";
 
 // src/utils/resolve-override-prop-value.ts
 var resolveOverridePropValue = (originalPropValue) => {
@@ -2211,7 +1863,7 @@ function getOverrideValue(overrideProp) {
 
 // src/store/actions/update-overridable-prop.ts
 function updateOverridableProp(componentId, propValue, originPropFields) {
-  const overridableProps = selectOverridableProps(getState9(), componentId);
+  const overridableProps = selectOverridableProps(getState8(), componentId);
   if (!overridableProps) {
     return;
   }
@@ -2236,7 +1888,7 @@ function updateOverridableProp(componentId, propValue, originPropFields) {
       }
     }
   };
-  dispatch7(
+  dispatch5(
     slice.actions.setOverridableProps({
       componentId,
       overridableProps: newOverridableProps
@@ -2597,7 +2249,7 @@ function InstanceEditingPanel() {
   if (!componentId || !overridableProps || !component) {
     return null;
   }
-  const panelTitle = __12("Edit %s", "elementor").replace("%s", component.name);
+  const panelTitle = __11("Edit %s", "elementor").replace("%s", component.name);
   const handleEditComponent = () => switchToComponent(componentId, componentInstanceId);
   const isNonEmptyGroup = (group) => group !== null && group.props.length > 0;
   const groups = overridableProps.groups.order.map((groupId) => overridableProps.groups.items[groupId] ?? null).filter(isNonEmptyGroup);
@@ -2631,7 +2283,7 @@ var LoadTemplateComponents = () => {
 };
 
 // src/extended/init.ts
-import { injectIntoTop } from "@elementor/editor";
+import { injectIntoLogic, injectIntoTop } from "@elementor/editor";
 import { registerControlReplacement } from "@elementor/editor-controls";
 import { getV1CurrentDocument } from "@elementor/editor-documents";
 import { FIELD_TYPE, injectIntoPanelHeaderTop, registerFieldIndicator } from "@elementor/editor-editing-panel";
@@ -2671,7 +2323,7 @@ import * as React17 from "react";
 import { PopoverContent } from "@elementor/editor-controls";
 import { PopoverHeader } from "@elementor/editor-ui";
 import { Box as Box9, Button as Button3, Image, Link as Link2, Popover, Stack as Stack11, Typography as Typography6 } from "@elementor/ui";
-import { __ as __13 } from "@wordpress/i18n";
+import { __ as __12 } from "@wordpress/i18n";
 var ComponentIntroduction = ({
   anchorRef,
   shouldShowIntroduction,
@@ -2695,17 +2347,17 @@ var ComponentIntroduction = ({
       },
       onClose
     },
-    /* @__PURE__ */ React17.createElement(Box9, { sx: { width: "296px" } }, /* @__PURE__ */ React17.createElement(PopoverHeader, { title: __13("Add your first property", "elementor"), onClose }), /* @__PURE__ */ React17.createElement(
+    /* @__PURE__ */ React17.createElement(Box9, { sx: { width: "296px" } }, /* @__PURE__ */ React17.createElement(PopoverHeader, { title: __12("Add your first property", "elementor"), onClose }), /* @__PURE__ */ React17.createElement(
       Image,
       {
         sx: { width: "296px", height: "160px" },
         src: "https://assets.elementor.com/packages/v1/images/components-properties-intro.png",
         alt: ""
       }
-    ), /* @__PURE__ */ React17.createElement(PopoverContent, null, /* @__PURE__ */ React17.createElement(Stack11, { sx: { p: 2 } }, /* @__PURE__ */ React17.createElement(Typography6, { variant: "body2" }, __13("Properties make instances flexible.", "elementor")), /* @__PURE__ */ React17.createElement(Typography6, { variant: "body2" }, __13(
+    ), /* @__PURE__ */ React17.createElement(PopoverContent, null, /* @__PURE__ */ React17.createElement(Stack11, { sx: { p: 2 } }, /* @__PURE__ */ React17.createElement(Typography6, { variant: "body2" }, __12("Properties make instances flexible.", "elementor")), /* @__PURE__ */ React17.createElement(Typography6, { variant: "body2" }, __12(
       "Select any Element, then in the General tab, click next to any setting you want users to customize - like text, images, or links.",
       "elementor"
-    )), /* @__PURE__ */ React17.createElement(Typography6, { variant: "body2", sx: { mt: 2 } }, __13(
+    )), /* @__PURE__ */ React17.createElement(Typography6, { variant: "body2", sx: { mt: 2 } }, __12(
       "Your properties will appear in the Properties panel, where you can organize and manage them anytime.",
       "elementor"
     )), /* @__PURE__ */ React17.createElement(
@@ -2717,8 +2369,8 @@ var ComponentIntroduction = ({
         color: "info.main",
         variant: "body2"
       },
-      __13("Learn more", "elementor")
-    ), /* @__PURE__ */ React17.createElement(Stack11, { direction: "row", alignItems: "center", justifyContent: "flex-end", sx: { pt: 1 } }, /* @__PURE__ */ React17.createElement(Button3, { size: "medium", variant: "contained", onClick: onClose }, __13("Got it", "elementor"))))))
+      __12("Learn more", "elementor")
+    ), /* @__PURE__ */ React17.createElement(Stack11, { direction: "row", alignItems: "center", justifyContent: "flex-end", sx: { pt: 1 } }, /* @__PURE__ */ React17.createElement(Button3, { size: "medium", variant: "contained", onClick: onClose }, __12("Got it", "elementor"))))))
   );
 };
 
@@ -2741,75 +2393,410 @@ import { Divider as Divider3, IconButton as IconButton5, List as List3, Stack as
 import { generateUniqueId as generateUniqueId2 } from "@elementor/utils";
 import { __ as __20 } from "@wordpress/i18n";
 
-// src/extended/store/actions/add-overridable-group.ts
-import { __dispatch as dispatch8, __getState as getState10 } from "@elementor/store";
-function addOverridableGroup({
-  componentId,
-  groupId,
-  label,
-  source
-}) {
-  const currentComponent = selectCurrentComponent(getState10());
+// src/extended/store/actions/add-overridable-group.ts
+import { __dispatch as dispatch6, __getState as getState9 } from "@elementor/store";
+function addOverridableGroup({
+  componentId,
+  groupId,
+  label,
+  source
+}) {
+  const currentComponent = selectCurrentComponent(getState9());
+  const overridableProps = selectOverridableProps(getState9(), componentId);
+  if (!overridableProps) {
+    return;
+  }
+  const newGroup = {
+    id: groupId,
+    label,
+    props: []
+  };
+  dispatch6(
+    slice.actions.setOverridableProps({
+      componentId,
+      overridableProps: {
+        ...overridableProps,
+        groups: {
+          ...overridableProps.groups,
+          items: {
+            ...overridableProps.groups.items,
+            [groupId]: newGroup
+          },
+          order: [groupId, ...overridableProps.groups.order]
+        }
+      }
+    })
+  );
+  trackComponentEvent({
+    action: "propertiesGroupCreated",
+    source,
+    component_uid: currentComponent?.uid,
+    group_name: label
+  });
+  return newGroup;
+}
+
+// src/extended/store/actions/delete-overridable-group.ts
+import { __dispatch as dispatch7, __getState as getState10 } from "@elementor/store";
+
+// src/extended/store/utils/groups-transformers.ts
+import { generateUniqueId } from "@elementor/utils";
+import { __ as __13 } from "@wordpress/i18n";
+function removePropFromAllGroups(groups, propKey) {
+  const propKeys = Array.isArray(propKey) ? propKey : [propKey];
+  return {
+    ...groups,
+    items: Object.fromEntries(
+      Object.entries(groups.items).map(([groupId, group]) => [
+        groupId,
+        {
+          ...group,
+          props: group.props.filter((p) => !propKeys.includes(p))
+        }
+      ])
+    )
+  };
+}
+function addPropToGroup(groups, groupId, propKey) {
+  const group = groups.items[groupId];
+  if (!group) {
+    return groups;
+  }
+  if (group.props.includes(propKey)) {
+    return groups;
+  }
+  return {
+    ...groups,
+    items: {
+      ...groups.items,
+      [groupId]: {
+        ...group,
+        props: [...group.props, propKey]
+      }
+    }
+  };
+}
+function movePropBetweenGroups(groups, propKey, fromGroupId, toGroupId) {
+  if (fromGroupId === toGroupId) {
+    return groups;
+  }
+  const withoutProp = removePropFromGroup(groups, fromGroupId, propKey);
+  return addPropToGroup(withoutProp, toGroupId, propKey);
+}
+function removePropFromGroup(groups, groupId, propKey) {
+  const group = groups.items[groupId];
+  if (!group) {
+    return groups;
+  }
+  return {
+    ...groups,
+    items: {
+      ...groups.items,
+      [groupId]: {
+        ...group,
+        props: group.props.filter((p) => p !== propKey)
+      }
+    }
+  };
+}
+function resolveOrCreateGroup(groups, requestedGroupId) {
+  if (requestedGroupId && groups.items[requestedGroupId]) {
+    return { groups, groupId: requestedGroupId };
+  }
+  if (!requestedGroupId && groups.order.length > 0) {
+    return { groups, groupId: groups.order[0] };
+  }
+  return createGroup(groups, requestedGroupId);
+}
+function createGroup(groups, groupId, label) {
+  const newGroupId = groupId || generateUniqueId("group");
+  const newLabel = label || __13("Default", "elementor");
+  return {
+    groups: {
+      ...groups,
+      items: {
+        ...groups.items,
+        [newGroupId]: {
+          id: newGroupId,
+          label: newLabel,
+          props: []
+        }
+      },
+      order: [...groups.order, newGroupId]
+    },
+    groupId: newGroupId
+  };
+}
+function removePropsFromState(overridableProps, propsToRemove) {
+  const overrideKeysToRemove = propsToRemove.map((prop) => prop.overrideKey);
+  const remainingProps = Object.fromEntries(
+    Object.entries(overridableProps.props).filter(([, prop]) => !propsToRemove.includes(prop))
+  );
+  const updatedGroupItems = Object.fromEntries(
+    Object.entries(overridableProps.groups.items).map(
+      ([groupId, group]) => [
+        groupId,
+        {
+          ...group,
+          props: group.props.filter((prop) => !overrideKeysToRemove.includes(prop))
+        }
+      ]
+    )
+  );
+  return {
+    props: remainingProps,
+    groups: {
+      items: updatedGroupItems,
+      order: overridableProps.groups.order.filter((groupId) => !overrideKeysToRemove.includes(groupId))
+    }
+  };
+}
+function ensureGroupInOrder(groups, groupId) {
+  if (groups.order.includes(groupId)) {
+    return groups;
+  }
+  return {
+    ...groups,
+    order: [...groups.order, groupId]
+  };
+}
+function deleteGroup(groups, groupId) {
+  const { [groupId]: removed, ...remainingItems } = groups.items;
+  return {
+    items: remainingItems,
+    order: groups.order.filter((id2) => id2 !== groupId)
+  };
+}
+function renameGroup(groups, groupId, newLabel) {
+  const group = groups.items[groupId];
+  if (!group) {
+    return groups;
+  }
+  return {
+    ...groups,
+    items: {
+      ...groups.items,
+      [groupId]: {
+        ...group,
+        label: newLabel
+      }
+    }
+  };
+}
+
+// src/extended/store/actions/delete-overridable-group.ts
+function deleteOverridableGroup({ componentId, groupId }) {
   const overridableProps = selectOverridableProps(getState10(), componentId);
   if (!overridableProps) {
-    return;
+    return false;
   }
-  const newGroup = {
-    id: groupId,
-    label,
-    props: []
-  };
-  dispatch8(
+  const group = overridableProps.groups.items[groupId];
+  if (!group || group.props.length > 0) {
+    return false;
+  }
+  const updatedGroups = deleteGroup(overridableProps.groups, groupId);
+  dispatch7(
     slice.actions.setOverridableProps({
       componentId,
       overridableProps: {
         ...overridableProps,
-        groups: {
-          ...overridableProps.groups,
-          items: {
-            ...overridableProps.groups.items,
-            [groupId]: newGroup
-          },
-          order: [groupId, ...overridableProps.groups.order]
-        }
+        groups: updatedGroups
       }
     })
   );
-  trackComponentEvent({
-    action: "propertiesGroupCreated",
-    source,
-    component_uid: currentComponent?.uid,
-    group_name: label
+  return true;
+}
+
+// src/extended/store/actions/delete-overridable-prop.ts
+import { __dispatch as dispatch8, __getState as getState11 } from "@elementor/store";
+
+// src/extended/utils/revert-overridable-settings.ts
+import {
+  getAllDescendants as getAllDescendants2,
+  getContainer as getContainer3,
+  getElementSetting,
+  updateElementSettings
+} from "@elementor/editor-elements";
+function revertElementOverridableSetting(elementId, settingKey, originValue, overrideKey) {
+  const container = getContainer3(elementId);
+  if (!container) {
+    return;
+  }
+  if (isComponentInstance(container.model.toJSON())) {
+    revertComponentInstanceOverridableSetting(elementId, overrideKey);
+    return;
+  }
+  updateElementSettings({
+    id: elementId,
+    props: { [settingKey]: originValue ?? null },
+    withHistory: false
+  });
+}
+function revertComponentInstanceOverridableSetting(elementId, overrideKey) {
+  const setting = getElementSetting(elementId, "component_instance");
+  const componentInstance = componentInstancePropTypeUtil.extract(setting);
+  const overrides = componentInstanceOverridesPropTypeUtil.extract(componentInstance?.overrides);
+  if (!overrides?.length) {
+    return;
+  }
+  const revertedOverrides = revertComponentInstanceOverrides(overrides, overrideKey);
+  const updatedSetting = componentInstancePropTypeUtil.create({
+    ...componentInstance,
+    overrides: componentInstanceOverridesPropTypeUtil.create(revertedOverrides)
+  });
+  updateElementSettings({
+    id: elementId,
+    props: { component_instance: updatedSetting },
+    withHistory: false
+  });
+}
+function revertComponentInstanceOverrides(overrides, filterByKey) {
+  return overrides.map((item) => {
+    if (!componentOverridablePropTypeUtil.isValid(item)) {
+      return item;
+    }
+    if (!componentInstanceOverridePropTypeUtil.isValid(item.value.origin_value)) {
+      return null;
+    }
+    if (filterByKey && item.value.override_key !== filterByKey) {
+      return item;
+    }
+    return item.value.origin_value;
+  }).filter((item) => item !== null);
+}
+function revertOverridablePropsFromSettings(settings) {
+  let hasChanges = false;
+  const revertedSettings = {};
+  for (const [key, value] of Object.entries(settings)) {
+    if (componentOverridablePropTypeUtil.isValid(value)) {
+      revertedSettings[key] = value.value.origin_value;
+      hasChanges = true;
+    } else {
+      revertedSettings[key] = value;
+    }
+  }
+  return { hasChanges, settings: revertedSettings };
+}
+function revertAllOverridablesInElementData(elementData) {
+  const revertedElement = { ...elementData };
+  if (isComponentInstance({ widgetType: elementData.widgetType, elType: elementData.elType })) {
+    revertedElement.settings = revertComponentInstanceSettings(elementData.settings);
+  } else if (revertedElement.settings) {
+    const { settings } = revertOverridablePropsFromSettings(revertedElement.settings);
+    revertedElement.settings = settings;
+  }
+  if (revertedElement.elements) {
+    revertedElement.elements = revertedElement.elements.map(revertAllOverridablesInElementData);
+  }
+  return revertedElement;
+}
+function revertComponentInstanceSettings(settings) {
+  if (!settings?.component_instance) {
+    return settings;
+  }
+  const componentInstance = componentInstancePropTypeUtil.extract(settings.component_instance);
+  const overrides = componentInstanceOverridesPropTypeUtil.extract(componentInstance?.overrides);
+  if (!overrides?.length) {
+    return settings;
+  }
+  const revertedOverrides = revertComponentInstanceOverrides(overrides);
+  return {
+    ...settings,
+    component_instance: componentInstancePropTypeUtil.create({
+      ...componentInstance,
+      overrides: componentInstanceOverridesPropTypeUtil.create(revertedOverrides)
+    })
+  };
+}
+function revertAllOverridablesInContainer(container) {
+  getAllDescendants2(container).forEach((element) => {
+    if (element.model.get("widgetType") === COMPONENT_WIDGET_TYPE) {
+      revertComponentInstanceOverridesInElement(element);
+    } else {
+      revertElementSettings(element);
+    }
+  });
+}
+function revertComponentInstanceOverridesInElement(element) {
+  const settings = element.settings?.toJSON() ?? {};
+  const componentInstance = componentInstancePropTypeUtil.extract(settings.component_instance);
+  const overrides = componentInstanceOverridesPropTypeUtil.extract(componentInstance?.overrides);
+  if (!overrides?.length) {
+    return;
+  }
+  const revertedOverrides = revertComponentInstanceOverrides(overrides);
+  const updatedSetting = componentInstancePropTypeUtil.create({
+    ...componentInstance,
+    overrides: componentInstanceOverridesPropTypeUtil.create(revertedOverrides)
+  });
+  updateElementSettings({
+    id: element.id,
+    props: { component_instance: updatedSetting },
+    withHistory: false
+  });
+}
+function revertElementSettings(element) {
+  const settings = element.settings?.toJSON() ?? {};
+  const { hasChanges, settings: revertedSettings } = revertOverridablePropsFromSettings(settings);
+  if (!hasChanges) {
+    return;
+  }
+  updateElementSettings({
+    id: element.id,
+    props: revertedSettings,
+    withHistory: false
   });
-  return newGroup;
 }
 
-// src/extended/store/actions/delete-overridable-group.ts
-import { __dispatch as dispatch9, __getState as getState11 } from "@elementor/store";
-function deleteOverridableGroup({ componentId, groupId }) {
+// src/extended/store/actions/delete-overridable-prop.ts
+function deleteOverridableProp({ componentId, propKey, source }) {
   const overridableProps = selectOverridableProps(getState11(), componentId);
-  if (!overridableProps) {
-    return false;
+  if (!overridableProps || Object.keys(overridableProps.props).length === 0) {
+    return;
   }
-  const group = overridableProps.groups.items[groupId];
-  if (!group || group.props.length > 0) {
-    return false;
+  const propKeysToDelete = Array.isArray(propKey) ? propKey : [propKey];
+  const deletedProps = [];
+  for (const key of propKeysToDelete) {
+    const prop = overridableProps.props[key];
+    if (!prop) {
+      continue;
+    }
+    deletedProps.push(prop);
+    revertElementOverridableSetting(prop.elementId, prop.propKey, prop.originValue, key);
   }
-  const updatedGroups = deleteGroup(overridableProps.groups, groupId);
-  dispatch9(
+  if (deletedProps.length === 0) {
+    return;
+  }
+  const remainingProps = Object.fromEntries(
+    Object.entries(overridableProps.props).filter(([key]) => !propKeysToDelete.includes(key))
+  );
+  const updatedGroups = removePropFromAllGroups(overridableProps.groups, propKey);
+  dispatch8(
     slice.actions.setOverridableProps({
       componentId,
       overridableProps: {
         ...overridableProps,
+        props: remainingProps,
         groups: updatedGroups
       }
     })
   );
-  return true;
+  const currentComponent = selectCurrentComponent(getState11());
+  for (const prop of deletedProps) {
+    trackComponentEvent({
+      action: "propertyRemoved",
+      source,
+      component_uid: currentComponent?.uid,
+      property_id: prop.overrideKey,
+      property_path: prop.propKey,
+      property_name: prop.label,
+      element_type: prop.widgetType ?? prop.elType
+    });
+  }
 }
 
 // src/extended/store/actions/reorder-group-props.ts
-import { __dispatch as dispatch10, __getState as getState12 } from "@elementor/store";
+import { __dispatch as dispatch9, __getState as getState12 } from "@elementor/store";
 function reorderGroupProps({ componentId, groupId, newPropsOrder }) {
   const overridableProps = selectOverridableProps(getState12(), componentId);
   if (!overridableProps) {
@@ -2819,7 +2806,7 @@ function reorderGroupProps({ componentId, groupId, newPropsOrder }) {
   if (!group) {
     return;
   }
-  dispatch10(
+  dispatch9(
     slice.actions.setOverridableProps({
       componentId,
       overridableProps: {
@@ -2840,13 +2827,13 @@ function reorderGroupProps({ componentId, groupId, newPropsOrder }) {
 }
 
 // src/extended/store/actions/reorder-overridable-groups.ts
-import { __dispatch as dispatch11, __getState as getState13 } from "@elementor/store";
+import { __dispatch as dispatch10, __getState as getState13 } from "@elementor/store";
 function reorderOverridableGroups({ componentId, newOrder }) {
   const overridableProps = selectOverridableProps(getState13(), componentId);
   if (!overridableProps) {
     return;
   }
-  dispatch11(
+  dispatch10(
     slice.actions.setOverridableProps({
       componentId,
       overridableProps: {
@@ -2861,7 +2848,7 @@ function reorderOverridableGroups({ componentId, newOrder }) {
 }
 
 // src/extended/store/actions/update-overridable-prop-params.ts
-import { __dispatch as dispatch12, __getState as getState14 } from "@elementor/store";
+import { __dispatch as dispatch11, __getState as getState14 } from "@elementor/store";
 function updateOverridablePropParams({
   componentId,
   overrideKey,
@@ -2884,7 +2871,7 @@ function updateOverridablePropParams({
     groupId: newGroupId
   };
   const updatedGroups = movePropBetweenGroups(overridableProps.groups, overrideKey, oldGroupId, newGroupId);
-  dispatch12(
+  dispatch11(
     slice.actions.setOverridableProps({
       componentId,
       overridableProps: {
@@ -3399,7 +3386,7 @@ import { useEditable as useEditable2 } from "@elementor/editor-ui";
 import { __ as __19 } from "@wordpress/i18n";
 
 // src/extended/store/actions/rename-overridable-group.ts
-import { __dispatch as dispatch13, __getState as getState15 } from "@elementor/store";
+import { __dispatch as dispatch12, __getState as getState15 } from "@elementor/store";
 function renameOverridableGroup({ componentId, groupId, label }) {
   const overridableProps = selectOverridableProps(getState15(), componentId);
   if (!overridableProps) {
@@ -3410,7 +3397,7 @@ function renameOverridableGroup({ componentId, groupId, label }) {
     return false;
   }
   const updatedGroups = renameGroup(overridableProps.groups, groupId, label);
-  dispatch13(
+  dispatch12(
     slice.actions.setOverridableProps({
       componentId,
       overridableProps: {
@@ -3768,7 +3755,7 @@ import { __ as __26 } from "@wordpress/i18n";
 // src/extended/store/actions/create-unpublished-component.ts
 import { createElements, deleteElement, getContainer as getContainer4 } from "@elementor/editor-elements";
 import { __privateRunCommand as runCommand2 } from "@elementor/editor-v1-adapters";
-import { __dispatch as dispatch14 } from "@elementor/store";
+import { __dispatch as dispatch13 } from "@elementor/store";
 import { generateUniqueId as generateUniqueId3 } from "@elementor/utils";
 import { __ as __24 } from "@wordpress/i18n";
 
@@ -3801,14 +3788,14 @@ async function createUnpublishedComponent({
     parentId: container?.parent?.id ?? "",
     index: container?.view?._index ?? 0
   };
-  dispatch14(
+  dispatch13(
     slice.actions.addUnpublished({
       ...componentBase,
       elements: [elementDataWithOverridablesReverted],
       overridableProps
     })
   );
-  dispatch14(slice.actions.addCreatedThisSession(generatedUid));
+  dispatch13(slice.actions.addCreatedThisSession(generatedUid));
   const componentInstance = await replaceElementWithComponent(element, componentBase);
   trackComponentEvent({
     action: "created",
@@ -3821,8 +3808,8 @@ async function createUnpublishedComponent({
     await runCommand2("document/save/auto");
   } catch (error) {
     restoreOriginalElement(originalElement, componentInstance.id);
-    dispatch14(slice.actions.removeUnpublished(generatedUid));
-    dispatch14(slice.actions.removeCreatedThisSession(generatedUid));
+    dispatch13(slice.actions.removeUnpublished(generatedUid));
+    dispatch13(slice.actions.removeCreatedThisSession(generatedUid));
     throw error;
   }
   return { uid: generatedUid, instanceId: componentInstance.id };
@@ -4242,9 +4229,9 @@ var OVERRIDABLE_PROP_REPLACEMENT_ID = "overridable-prop";
 var COMPONENT_DOCUMENT_TYPE = "elementor_component";
 
 // src/extended/store/actions/reset-sanitized-components.ts
-import { __dispatch as dispatch15 } from "@elementor/store";
+import { __dispatch as dispatch14 } from "@elementor/store";
 function resetSanitizedComponents() {
-  dispatch15(slice.actions.resetSanitizedComponents());
+  dispatch14(slice.actions.resetSanitizedComponents());
 }
 
 // src/extended/store/actions/update-current-component.ts
@@ -4627,7 +4614,7 @@ import { bindPopover as bindPopover2, bindTrigger as bindTrigger4, Popover as Po
 import { __ as __29 } from "@wordpress/i18n";
 
 // src/extended/store/actions/set-overridable-prop.ts
-import { __dispatch as dispatch16, __getState as getState18 } from "@elementor/store";
+import { __dispatch as dispatch15, __getState as getState18 } from "@elementor/store";
 import { generateUniqueId as generateUniqueId4 } from "@elementor/utils";
 function setOverridableProp({
   componentId,
@@ -4679,7 +4666,7 @@ function setOverridableProp({
   if (isChangingGroups) {
     groups = removePropFromGroup(groups, existingOverridableProp.groupId, overridableProp.overrideKey);
   }
-  dispatch16(
+  dispatch15(
     slice.actions.setOverridableProps({
       componentId,
       overridableProps: {
@@ -5287,7 +5274,7 @@ var updateArchivedComponentBeforeSave = async (status) => {
 };
 
 // src/extended/sync/update-component-title-before-save.ts
-import { __dispatch as dispatch17, __getState as getState21 } from "@elementor/store";
+import { __dispatch as dispatch16, __getState as getState21 } from "@elementor/store";
 var updateComponentTitleBeforeSave = async (status) => {
   const updatedComponentNames = selectUpdatedComponentNames(getState21());
   if (!updatedComponentNames.length) {
@@ -5295,13 +5282,13 @@ var updateComponentTitleBeforeSave = async (status) => {
   }
   const result = await apiClient.updateComponentTitle(updatedComponentNames, status);
   if (result.failedIds.length === 0) {
-    dispatch17(slice.actions.cleanUpdatedComponentNames());
+    dispatch16(slice.actions.cleanUpdatedComponentNames());
   }
 };
 
 // src/extended/sync/create-components-before-save.ts
 import { updateElementSettings as updateElementSettings2 } from "@elementor/editor-elements";
-import { __dispatch as dispatch18, __getState as getState22 } from "@elementor/store";
+import { __dispatch as dispatch17, __getState as getState22 } from "@elementor/store";
 async function createComponentsBeforeSave({
   elements,
   status
@@ -5313,7 +5300,7 @@ async function createComponentsBeforeSave({
   try {
     const uidToComponentId = await createComponents(unpublishedComponents, status);
     updateComponentInstances(elements, uidToComponentId);
-    dispatch18(
+    dispatch17(
       slice.actions.add(
         unpublishedComponents.map((component) => ({
           id: uidToComponentId.get(component.uid),
@@ -5323,10 +5310,10 @@ async function createComponentsBeforeSave({
         }))
       )
     );
-    dispatch18(slice.actions.resetUnpublished());
+    dispatch17(slice.actions.resetUnpublished());
   } catch (error) {
     const failedUids = unpublishedComponents.map((component) => component.uid);
-    dispatch18(slice.actions.removeUnpublished(failedUids));
+    dispatch17(slice.actions.removeUnpublished(failedUids));
     throw new Error(`Failed to publish components: ${error}`);
   }
 }
@@ -5561,6 +5548,36 @@ function revertOverridablesInStorage(storageKey) {
   });
 }
 
+// src/extended/sync/sanitize-overridable-props.ts
+import { useEffect as useEffect7 } from "react";
+
+// src/extended/store/actions/update-component-sanitized-attribute.ts
+import { __dispatch as dispatch18 } from "@elementor/store";
+function updateComponentSanitizedAttribute(componentId, attribute) {
+  dispatch18(slice.actions.updateComponentSanitizedAttribute({ componentId, attribute }));
+}
+
+// src/extended/sync/sanitize-overridable-props.ts
+function SanitizeOverridableProps() {
+  const currentComponentId = useCurrentComponentId();
+  const overridableProps = useOverridableProps(currentComponentId);
+  const isSanitized = useIsSanitizedComponent(currentComponentId, "overridableProps");
+  useEffect7(() => {
+    if (isSanitized || !overridableProps || !currentComponentId) {
+      return;
+    }
+    const filtered = filterValidOverridableProps(overridableProps);
+    const propsToDelete = Object.keys(overridableProps.props ?? {}).filter((key) => !filtered.props[key]);
+    if (propsToDelete.length > 0) {
+      propsToDelete.forEach((key) => {
+        deleteOverridableProp({ componentId: currentComponentId, propKey: key, source: "system" });
+      });
+    }
+    updateComponentSanitizedAttribute(currentComponentId, "overridableProps");
+  }, [currentComponentId, isSanitized, overridableProps]);
+  return null;
+}
+
 // src/extended/init.ts
 function initExtended() {
   registerPanel(panel);
@@ -5601,13 +5618,17 @@ function initExtended() {
   initNonAtomicNestingPrevention();
   initHandleComponentEditModeContainer();
   initRevertOverridablesOnCopyOrDuplicate();
+  injectIntoLogic({
+    id: "sanitize-overridable-props",
+    component: SanitizeOverridableProps
+  });
 }
 
 // src/populate-store.ts
-import { useEffect as useEffect7 } from "react";
+import { useEffect as useEffect8 } from "react";
 import { __dispatch as dispatch19 } from "@elementor/store";
 function PopulateStore() {
-  useEffect7(() => {
+  useEffect8(() => {
     dispatch19(loadComponents());
   }, []);
   return null;
@@ -5805,7 +5826,7 @@ function init() {
     component: Components,
     position: 1
   });
-  injectIntoLogic({
+  injectIntoLogic2({
     id: "components-populate-store",
     component: PopulateStore
   });
@@ -5816,7 +5837,7 @@ function init() {
     }
     await loadComponentsAssets(config?.elements ?? []);
   });
-  injectIntoLogic({
+  injectIntoLogic2({
     id: "templates",
     component: LoadTemplateComponents
   });