@elementor/editor-components 3.35.0-333 → 3.35.0-334

package/dist/index.mjs

@@ -4,7 +4,7 @@ import {
   registerElementType,
   settingsTransformersRegistry as settingsTransformersRegistry2
 } from "@elementor/editor-canvas";
-import { getV1CurrentDocument as getV1CurrentDocument2 } from "@elementor/editor-documents";
+import { getV1CurrentDocument } from "@elementor/editor-documents";
 import {
   FIELD_TYPE,
   injectIntoPanelHeaderTop,
@@ -1653,7 +1653,7 @@ var EditModeDialog = ({ lockedBy }) => {
 };
 
 // src/components/overridable-props/overridable-prop-control.tsx
-import * as React13 from "react";
+import * as React14 from "react";
 import { ControlReplacementsProvider, PropKeyProvider, PropProvider, useBoundProp } from "@elementor/editor-controls";
 import { createTopLevelObjectType, useElement } from "@elementor/editor-editing-panel";
 import { __getState as getState6 } from "@elementor/store";
@@ -1672,6 +1672,15 @@ var componentOverridablePropTypeUtil = createPropUtils(
   })
 );
 
+// src/provider/overridable-prop-context.tsx
+import * as React13 from "react";
+import { createContext as createContext2, useContext as useContext2 } from "react";
+var OverridablePropContext = createContext2(null);
+function OverridablePropProvider({ children, ...props }) {
+  return /* @__PURE__ */ React13.createElement(OverridablePropContext.Provider, { value: props }, children);
+}
+var useOverridablePropValue = () => useContext2(OverridablePropContext)?.value;
+
 // src/store/actions/update-overridable-prop-origin-value.ts
 import { __dispatch as dispatch4, __getState as getState5 } from "@elementor/store";
 function updateOverridablePropOriginValue(componentId, propValue) {
@@ -1729,7 +1738,7 @@ function OverridablePropControl({
     }
   });
   const objectPlaceholder = placeholder ? { [bind]: placeholder } : void 0;
-  return /* @__PURE__ */ React13.createElement(
+  return /* @__PURE__ */ React14.createElement(OverridablePropProvider, { value }, /* @__PURE__ */ React14.createElement(
     PropProvider,
     {
       ...propContext,
@@ -1738,14 +1747,13 @@ function OverridablePropControl({
       value: { [bind]: value.origin_value },
       placeholder: objectPlaceholder
     },
-    /* @__PURE__ */ React13.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React13.createElement(ControlReplacementsProvider, { replacements: [] }, /* @__PURE__ */ React13.createElement(OriginalControl, { ...props })))
-  );
+    /* @__PURE__ */ React14.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React14.createElement(ControlReplacementsProvider, { replacements: [] }, /* @__PURE__ */ React14.createElement(OriginalControl, { ...props })))
+  ));
 }
 
 // src/components/overridable-props/overridable-prop-indicator.tsx
-import * as React16 from "react";
+import * as React17 from "react";
 import { useBoundProp as useBoundProp2 } from "@elementor/editor-controls";
-import { getV1CurrentDocument } from "@elementor/editor-documents";
 import { useElement as useElement2 } from "@elementor/editor-editing-panel";
 import { getWidgetsCache } from "@elementor/editor-elements";
 import { __getState as getState9 } from "@elementor/store";
@@ -1895,7 +1903,7 @@ function removeProps({
 }
 
 // src/components/overridable-props/indicator.tsx
-import * as React14 from "react";
+import * as React15 from "react";
 import { forwardRef } from "react";
 import { CheckIcon, PlusIcon } from "@elementor/icons";
 import { Box as Box8, styled as styled2 } from "@elementor/ui";
@@ -1955,17 +1963,17 @@ var Content = styled2(Box8)`
 		}
 	}
 `;
-var Indicator = forwardRef(({ isOpen, isOverridable, ...props }, ref) => /* @__PURE__ */ React14.createElement(Content, { ref, ...props, className: isOpen || isOverridable ? "enlarged" : "" }, /* @__PURE__ */ React14.createElement(
+var Indicator = forwardRef(({ isOpen, isOverridable, ...props }, ref) => /* @__PURE__ */ React15.createElement(Content, { ref, ...props, className: isOpen || isOverridable ? "enlarged" : "" }, /* @__PURE__ */ React15.createElement(
   IconContainer,
   {
     className: "icon",
     "aria-label": isOverridable ? __12("Overridable property", "elementor") : __12("Make prop overridable", "elementor")
   },
-  isOverridable ? /* @__PURE__ */ React14.createElement(CheckIcon, { fontSize: SIZE }) : /* @__PURE__ */ React14.createElement(PlusIcon, { fontSize: SIZE })
+  isOverridable ? /* @__PURE__ */ React15.createElement(CheckIcon, { fontSize: SIZE }) : /* @__PURE__ */ React15.createElement(PlusIcon, { fontSize: SIZE })
 )));
 
 // src/components/overridable-props/overridable-prop-form.tsx
-import * as React15 from "react";
+import * as React16 from "react";
 import { useState as useState4 } from "react";
 import { Form as Form2, MenuListItem as MenuListItem2 } from "@elementor/editor-ui";
 import { Button as Button3, FormLabel as FormLabel2, Grid as Grid2, Select, Stack as Stack7, TextField as TextField3, Typography as Typography6 } from "@elementor/ui";
@@ -1980,7 +1988,7 @@ function OverridablePropForm({ onSubmit, groups, currentValue }) {
   const isCreate = currentValue === void 0;
   const title = isCreate ? __13("Create new property", "elementor") : __13("Update property", "elementor");
   const ctaLabel = isCreate ? __13("Create", "elementor") : __13("Update", "elementor");
-  return /* @__PURE__ */ React15.createElement(Form2, { onSubmit: () => onSubmit({ label: propLabel ?? "", group }) }, /* @__PURE__ */ React15.createElement(Stack7, { alignItems: "start", width: "268px" }, /* @__PURE__ */ React15.createElement(
+  return /* @__PURE__ */ React16.createElement(Form2, { onSubmit: () => onSubmit({ label: propLabel ?? "", group }) }, /* @__PURE__ */ React16.createElement(Stack7, { alignItems: "start", width: "268px" }, /* @__PURE__ */ React16.createElement(
     Stack7,
     {
       direction: "row",
@@ -1989,8 +1997,8 @@ function OverridablePropForm({ onSubmit, groups, currentValue }) {
       px: 1.5,
       sx: { columnGap: 0.5, borderBottom: "1px solid", borderColor: "divider", width: "100%", mb: 1.5 }
     },
-    /* @__PURE__ */ React15.createElement(Typography6, { variant: "caption", sx: { color: "text.primary", fontWeight: "500", lineHeight: 1 } }, title)
-  ), /* @__PURE__ */ React15.createElement(Grid2, { container: true, gap: 0.75, alignItems: "start", px: 1.5, mb: 1.5 }, /* @__PURE__ */ React15.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React15.createElement(FormLabel2, { size: "tiny" }, name)), /* @__PURE__ */ React15.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React15.createElement(
+    /* @__PURE__ */ React16.createElement(Typography6, { variant: "caption", sx: { color: "text.primary", fontWeight: "500", lineHeight: 1 } }, title)
+  ), /* @__PURE__ */ React16.createElement(Grid2, { container: true, gap: 0.75, alignItems: "start", px: 1.5, mb: 1.5 }, /* @__PURE__ */ React16.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React16.createElement(FormLabel2, { size: "tiny" }, name)), /* @__PURE__ */ React16.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React16.createElement(
     TextField3,
     {
       name,
@@ -2000,7 +2008,7 @@ function OverridablePropForm({ onSubmit, groups, currentValue }) {
       value: propLabel ?? "",
       onChange: (e) => setPropLabel(e.target.value)
     }
-  ))), /* @__PURE__ */ React15.createElement(Grid2, { container: true, gap: 0.75, alignItems: "start", px: 1.5, mb: 1.5 }, /* @__PURE__ */ React15.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React15.createElement(FormLabel2, { size: "tiny" }, groupName)), /* @__PURE__ */ React15.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React15.createElement(
+  ))), /* @__PURE__ */ React16.createElement(Grid2, { container: true, gap: 0.75, alignItems: "start", px: 1.5, mb: 1.5 }, /* @__PURE__ */ React16.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React16.createElement(FormLabel2, { size: "tiny" }, groupName)), /* @__PURE__ */ React16.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React16.createElement(
     Select,
     {
       name: groupName,
@@ -2017,8 +2025,8 @@ function OverridablePropForm({ onSubmit, groups, currentValue }) {
         return groups?.find(({ value }) => value === selectedValue)?.label ?? selectedValue;
       }
     },
-    (groups ?? [DEFAULT_GROUP]).map(({ label: groupLabel, ...props }) => /* @__PURE__ */ React15.createElement(MenuListItem2, { key: props.value, ...props, value: props.value ?? "" }, groupLabel))
-  ))), /* @__PURE__ */ React15.createElement(Stack7, { direction: "row", justifyContent: "flex-end", alignSelf: "end", mt: 1.5, py: 1, px: 1.5 }, /* @__PURE__ */ React15.createElement(Button3, { type: "submit", disabled: !propLabel, variant: "contained", color: "primary", size: "small" }, ctaLabel))));
+    (groups ?? [DEFAULT_GROUP]).map(({ label: groupLabel, ...props }) => /* @__PURE__ */ React16.createElement(MenuListItem2, { key: props.value, ...props, value: props.value ?? "" }, groupLabel))
+  ))), /* @__PURE__ */ React16.createElement(Stack7, { direction: "row", justifyContent: "flex-end", alignSelf: "end", mt: 1.5, py: 1, px: 1.5 }, /* @__PURE__ */ React16.createElement(Button3, { type: "submit", disabled: !propLabel, variant: "contained", color: "primary", size: "small" }, ctaLabel))));
 }
 
 // src/components/overridable-props/utils/get-overridable-prop.ts
@@ -2038,15 +2046,12 @@ function getOverridableProp({
 var FORBIDDEN_KEYS = ["_cssid", "attributes"];
 function OverridablePropIndicator() {
   const { bind } = useBoundProp2();
-  const currentDocument = getV1CurrentDocument();
-  if (currentDocument.config.type !== COMPONENT_DOCUMENT_TYPE || !currentDocument.id) {
-    return null;
-  }
-  if (!isPropAllowed(bind)) {
+  const componentId = selectCurrentComponentId(getState9());
+  if (!isPropAllowed(bind) || !componentId) {
     return null;
   }
-  const overridableProps = selectOverridableProps(getState9(), currentDocument.id);
-  return /* @__PURE__ */ React16.createElement(Content2, { componentId: currentDocument.id, overridableProps });
+  const overridableProps = selectOverridableProps(getState9(), componentId);
+  return /* @__PURE__ */ React17.createElement(Content2, { componentId, overridableProps });
 }
 function Content2({ componentId, overridableProps }) {
   const {
@@ -2054,7 +2059,11 @@ function Content2({ componentId, overridableProps }) {
     elementType
   } = useElement2();
   const { value, bind, propType } = useBoundProp2();
-  const { value: overridableValue, setValue: setOverridableValue } = useBoundProp2(componentOverridablePropTypeUtil);
+  const contextOverridableValue = useOverridablePropValue();
+  const { value: boundPropOverridableValue, setValue: setOverridableValue } = useBoundProp2(
+    componentOverridablePropTypeUtil
+  );
+  const overridableValue = boundPropOverridableValue ?? contextOverridableValue;
   const popupState = usePopupState2({
     variant: "popover"
   });
@@ -2083,7 +2092,7 @@ function Content2({ componentId, overridableProps }) {
     popupState.close();
   };
   const overridableConfig = overridableValue ? getOverridableProp({ componentId, overrideKey: overridableValue.override_key }) : void 0;
-  return /* @__PURE__ */ React16.createElement(React16.Fragment, null, /* @__PURE__ */ React16.createElement(Tooltip2, { placement: "top", title: __14("Override Property", "elementor") }, /* @__PURE__ */ React16.createElement(Indicator, { ...triggerProps, isOpen: !!popoverProps.open, isOverridable: !!overridableValue })), /* @__PURE__ */ React16.createElement(
+  return /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(Tooltip2, { placement: "top", title: __14("Override Property", "elementor") }, /* @__PURE__ */ React17.createElement(Indicator, { ...triggerProps, isOpen: !!popoverProps.open, isOverridable: !!overridableValue })), /* @__PURE__ */ React17.createElement(
     Popover2,
     {
       disableScrollLock: true,
@@ -2100,7 +2109,7 @@ function Content2({ componentId, overridableProps }) {
       },
       ...popoverProps
     },
-    /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React17.createElement(
       OverridablePropForm,
       {
         onSubmit: handleSubmit,
@@ -2404,7 +2413,7 @@ function init() {
     (options) => createComponentType({ ...options, showLockedByModal: openEditModeDialog })
   );
   registerDataHook("dependency", "editor/documents/close", (args) => {
-    const document = getV1CurrentDocument2();
+    const document = getV1CurrentDocument();
     if (document.config.type === COMPONENT_DOCUMENT_TYPE) {
       args.mode = "autosave";
     }
@@ -2434,7 +2443,7 @@ function init() {
     component: ComponentPanelHeader
   });
   registerDataHook("after", "editor/documents/attach-preview", async () => {
-    const { id, config } = getV1CurrentDocument2();
+    const { id, config } = getV1CurrentDocument();
     if (id) {
       removeComponentStyles(id);
     }