@elementor/editor-variables 3.35.0-372 → 3.35.0-374

package/dist/index.d.mts

@@ -1,6 +1,7 @@
 import * as _elementor_editor_props from '@elementor/editor-props';
 import { PropType } from '@elementor/editor-props';
 import { z } from '@elementor/schema';
+import * as _elementor_editor_canvas from '@elementor/editor-canvas';
 import * as react from 'react';
 import { RefObject } from 'react';
 import * as _mui_material from '@mui/material';
@@ -106,7 +107,7 @@ type ValueFieldProps = {
     ref?: RefObject<HTMLElement | null>;
 };
 
-declare const registerVariableType: ({ key, icon, startIcon, valueField, propTypeUtil, variableType, defaultValue, selectionFilter, valueTransformer, fallbackPropTypeUtil, isCompatible, emptyState, }: {
+declare const registerVariableType: ({ key, icon, startIcon, valueField, propTypeUtil, variableType, defaultValue, selectionFilter, valueTransformer, styleTransformer, fallbackPropTypeUtil, isCompatible, emptyState, }: {
     icon: react.ForwardRefExoticComponent<Omit<_mui_material.SvgIconProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
     startIcon?: ({ value }: {
         value: string;
@@ -115,6 +116,7 @@ declare const registerVariableType: ({ key, icon, startIcon, valueField, propTyp
     variableType: string;
     key?: string;
     defaultValue?: string;
+    styleTransformer?: _elementor_editor_canvas.AnyTransformer;
     fallbackPropTypeUtil: any;
     propTypeUtil: _elementor_editor_props.PropTypeUtil<string, string>;
     selectionFilter?: (variables: NormalizedVariable[], propType: _elementor_editor_props.PropType) => NormalizedVariable[];

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 import * as _elementor_editor_props from '@elementor/editor-props';
 import { PropType } from '@elementor/editor-props';
 import { z } from '@elementor/schema';
+import * as _elementor_editor_canvas from '@elementor/editor-canvas';
 import * as react from 'react';
 import { RefObject } from 'react';
 import * as _mui_material from '@mui/material';
@@ -106,7 +107,7 @@ type ValueFieldProps = {
     ref?: RefObject<HTMLElement | null>;
 };
 
-declare const registerVariableType: ({ key, icon, startIcon, valueField, propTypeUtil, variableType, defaultValue, selectionFilter, valueTransformer, fallbackPropTypeUtil, isCompatible, emptyState, }: {
+declare const registerVariableType: ({ key, icon, startIcon, valueField, propTypeUtil, variableType, defaultValue, selectionFilter, valueTransformer, styleTransformer, fallbackPropTypeUtil, isCompatible, emptyState, }: {
     icon: react.ForwardRefExoticComponent<Omit<_mui_material.SvgIconProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
     startIcon?: ({ value }: {
         value: string;
@@ -115,6 +116,7 @@ declare const registerVariableType: ({ key, icon, startIcon, valueField, propTyp
     variableType: string;
     key?: string;
     defaultValue?: string;
+    styleTransformer?: _elementor_editor_canvas.AnyTransformer;
     fallbackPropTypeUtil: any;
     propTypeUtil: _elementor_editor_props.PropTypeUtil<string, string>;
     selectionFilter?: (variables: NormalizedVariable[], propType: _elementor_editor_props.PropType) => NormalizedVariable[];

package/dist/index.js

@@ -685,6 +685,7 @@ function createVariableTypeRegistry() {
     defaultValue,
     selectionFilter,
     valueTransformer,
+    styleTransformer,
     fallbackPropTypeUtil,
     isCompatible,
     emptyState
@@ -713,11 +714,11 @@ function createVariableTypeRegistry() {
       isCompatible,
       emptyState
     };
-    registerTransformer(propTypeUtil.key);
+    registerTransformer(propTypeUtil.key, styleTransformer);
     registerInheritanceTransformer(propTypeUtil.key);
   };
-  const registerTransformer = (key) => {
-    import_editor_canvas3.styleTransformersRegistry.register(key, variableTransformer);
+  const registerTransformer = (key, transformer) => {
+    import_editor_canvas3.styleTransformersRegistry.register(key, transformer ?? variableTransformer);
   };
   const registerInheritanceTransformer = (key) => {
     import_editor_editing_panel.stylesInheritanceTransformersRegistry.register(key, inheritanceTransformer);
@@ -3710,6 +3711,12 @@ var import_editor_props4 = require("@elementor/editor-props");
 var import_schema6 = require("@elementor/schema");
 var sizeVariablePropTypeUtil = (0, import_editor_props4.createPropUtils)("global-size-variable", import_schema6.z.string());
 
+// src/transformers/empty-transformer.tsx
+var import_editor_canvas4 = require("@elementor/editor-canvas");
+var EmptyTransformer = (0, import_editor_canvas4.createTransformer)((_value) => {
+  return null;
+});
+
 // src/register-variable-types.tsx
 function registerVariableTypes() {
   registerVariableType({
@@ -3731,14 +3738,22 @@ function registerVariableTypes() {
     variableType: "font",
     defaultValue: "Roboto"
   });
-  registerVariableType({
-    key: sizeVariablePropTypeUtil.key,
+  const sizePromotions = {
     icon: import_icons17.ExpandDiagonalIcon,
     propTypeUtil: sizeVariablePropTypeUtil,
     fallbackPropTypeUtil: import_editor_props5.sizePropTypeUtil,
+    styleTransformer: EmptyTransformer,
     variableType: "size",
     selectionFilter: () => [],
     emptyState: /* @__PURE__ */ React35.createElement(import_editor_ui9.UpgradeButton, { size: "small", href: "https://go.elementor.com/go-pro-panel-size-variable/" })
+  };
+  registerVariableType({
+    ...sizePromotions,
+    key: sizeVariablePropTypeUtil.key
+  });
+  registerVariableType({
+    ...sizePromotions,
+    key: "global-custom-size-variable"
   });
 }