@elementor/editor-variables 4.3.0-998 → 4.4.0-1064

package/dist/index.js

@@ -660,6 +660,18 @@ var handleWatermark = (operation, newWatermark) => {
   }
   storage.watermark(newWatermark);
 };
+var applyLocalMutation = (action, variableWithId, watermark) => {
+  const { id: variableId, ...variable } = variableWithId;
+  handleWatermark(OP_RW, watermark);
+  if (action === "create") {
+    storage.add(variableId, variable);
+  } else {
+    storage.update(variableId, variable);
+  }
+  styleVariablesRepository.update({
+    [variableId]: variable
+  });
+};
 
 // src/transformers/utils/resolve-css-variable.ts
 var resolveCssVariable = (id, variable) => {
@@ -2493,7 +2505,6 @@ function createUnlinkHandler(variable, propTypeKey, setValue) {
 // src/components/variable-selection-popover.tsx
 var React22 = __toESM(require("react"));
 var import_react21 = require("react");
-var import_editor_v1_adapters2 = require("@elementor/editor-v1-adapters");
 
 // src/context/variable-selection-popover.context.tsx
 var React15 = __toESM(require("react"));
@@ -3222,11 +3233,11 @@ var VIEW_EDIT = "edit";
 var VariableSelectionPopover = ({ closePopover, propTypeKey, selectedVariable }) => {
   const [currentView, setCurrentView] = (0, import_react21.useState)(VIEW_LIST);
   const [editId, setEditId] = (0, import_react21.useState)("");
-  const onSettingsAvailable = (0, import_editor_v1_adapters2.isExperimentActive)("e_variables_manager") ? () => {
+  const onSettingsAvailable = () => {
     window.dispatchEvent(
       new CustomEvent("elementor/toggle-design-system", { detail: { tab: "variables" } })
     );
-  } : void 0;
+  };
   return /* @__PURE__ */ React22.createElement(VariableTypeProvider, { propTypeKey }, /* @__PURE__ */ React22.createElement(PopoverContentRefContextProvider, null, RenderView({
     propTypeKey,
     currentView,
@@ -3891,7 +3902,7 @@ var import_utils3 = require("@elementor/utils");
 var MANAGE_VARIABLES_GUIDE_URI = "elementor://variables/tools/manage-global-variable-guide";
 
 // src/mcp/variables-resource.ts
-var import_editor_v1_adapters3 = require("@elementor/editor-v1-adapters");
+var import_editor_v1_adapters2 = require("@elementor/editor-v1-adapters");
 var import_http_client2 = require("@elementor/http-client");
 var MCP_PROXY_URL = "elementor/v1/mcp-proxy";
 var GLOBAL_VARIABLES_URI = "elementor://global-variables";
@@ -3923,7 +3934,7 @@ var initVariablesResource = (variablesMcpEntry, canvasMcpEntry) => {
       }
     );
     window.addEventListener(STORAGE_UPDATED_EVENT, notifyGlobalVariablesUpdated);
-    (0, import_editor_v1_adapters3.__privateListenTo)((0, import_editor_v1_adapters3.commandEndEvent)("document/save/update"), notifyGlobalVariablesUpdated);
+    (0, import_editor_v1_adapters2.__privateListenTo)((0, import_editor_v1_adapters2.commandEndEvent)("document/save/update"), notifyGlobalVariablesUpdated);
   });
 };
 
@@ -3958,14 +3969,14 @@ var initManageVariableTool = (reg) => {
   );
   addTool({
     name: TOOL_NAME,
-    description: "Manage V4 global variables (color, font, size, custom-size). Read the guide resource before use. font = font-famliy, size = measured unit, custom-size = calculated values",
+    description: "Manage V4 global variables (color, font, size, custom-size). Read the guide resource before use. font = single Google Font family name, no fallback stacks, size = measured unit, custom-size = calculated values",
     schema: {
       action: import_schema3.z.enum(["create", "update", "delete"]),
       id: import_schema3.z.string().optional().describe("Variable id \u2014 required for update/delete. Get from the global-variables resource."),
       type: import_schema3.z.enum(RUNTIME_ALLOWED_VARIABLE_TYPES),
       label: import_schema3.z.string().describe("Variable label (lowercase, dash-separated) \u2014 required for create/update."),
       value: import_schema3.z.string().optional().describe(
-        'Plain CSS value \u2014 required for create/update. Color: hex/rgba/hsl. Font: family name only. Size: value with unit e.g. "16px", or "auto" (Pro). Do NOT pass JSON.'
+        'Plain CSS value \u2014 required for create/update. Color: hex/rgba/hsl. Font: single Google Font family name only \u2014 no fallback stacks, no generic families. Size: value with unit e.g. "16px", or "auto" (Pro). Do NOT pass JSON.'
       )
     },
     outputSchema: {
@@ -3981,10 +3992,14 @@ var initManageVariableTool = (reg) => {
     ],
     isDestructive: true,
     handler: async (params) => {
-      await (0, import_http_client3.httpService)().post(MCP_PROXY_URL2, {
+      const { data } = await (0, import_http_client3.httpService)().post(MCP_PROXY_URL2, {
         tool: TOOL_NAME,
         input: params
       });
+      const payload = data.data;
+      if (payload.variable && typeof payload.watermark === "number") {
+        applyLocalMutation(params.action, payload.variable, payload.watermark);
+      }
       return { status: "ok" };
     }
   });
@@ -4206,7 +4221,7 @@ function registerVariableTypes() {
 // src/renderers/style-variables-renderer.tsx
 var React38 = __toESM(require("react"));
 var import_react29 = require("react");
-var import_editor_v1_adapters4 = require("@elementor/editor-v1-adapters");
+var import_editor_v1_adapters3 = require("@elementor/editor-v1-adapters");
 var import_ui35 = require("@elementor/ui");
 var VARIABLES_WRAPPER = ":root";
 function StyleVariablesRenderer() {
@@ -4221,7 +4236,7 @@ function StyleVariablesRenderer() {
   return /* @__PURE__ */ React38.createElement(import_ui35.Portal, { container }, /* @__PURE__ */ React38.createElement("style", { "data-e-style-id": "e-variables", key: wrappedCss }, wrappedCss));
 }
 function usePortalContainer() {
-  return (0, import_editor_v1_adapters4.__privateUseListenTo)((0, import_editor_v1_adapters4.commandEndEvent)("editor/documents/attach-preview"), () => (0, import_editor_v1_adapters4.getCanvasIframeDocument)()?.head);
+  return (0, import_editor_v1_adapters3.__privateUseListenTo)((0, import_editor_v1_adapters3.commandEndEvent)("editor/documents/attach-preview"), () => (0, import_editor_v1_adapters3.getCanvasIframeDocument)()?.head);
 }
 function useStyleVariables() {
   const [variables, setVariables] = (0, import_react29.useState)({});