@elementor/editor-variables 3.35.0-342 → 3.35.0-344

package/dist/index.d.mts

@@ -1,5 +1,6 @@
 import * as _elementor_editor_props from '@elementor/editor-props';
 import { PropType } from '@elementor/editor-props';
+import { z } from '@elementor/schema';
 import * as react from 'react';
 import { RefObject } from 'react';
 import * as _mui_material from '@mui/material';
@@ -8,6 +9,30 @@ declare function init(): void;
 
 declare function registerVariableTypes(): void;
 
+declare const sizeVariablePropTypeUtil: {
+    extract: (prop: unknown) => string | null;
+    isValid: (prop: unknown) => prop is _elementor_editor_props.TransformablePropValue<"global-size-variable", string>;
+    create: {
+        (value: string): _elementor_editor_props.TransformablePropValue<"global-size-variable", string>;
+        (value: string, createOptions?: _elementor_editor_props.CreateOptions): _elementor_editor_props.TransformablePropValue<"global-size-variable", string>;
+        (value: (prev?: string | undefined) => string, createOptions: _elementor_editor_props.CreateOptions): _elementor_editor_props.TransformablePropValue<"global-size-variable", string>;
+    };
+    schema: z.ZodObject<{
+        $$type: z.ZodLiteral<"global-size-variable">;
+        value: z.ZodType<string, z.ZodTypeDef, string>;
+        disabled: z.ZodOptional<z.ZodBoolean>;
+    }, "strict", z.ZodTypeAny, {
+        value: string;
+        $$type: "global-size-variable";
+        disabled?: boolean | undefined;
+    }, {
+        value: string;
+        $$type: "global-size-variable";
+        disabled?: boolean | undefined;
+    }>;
+    key: "global-size-variable";
+};
+
 type TVariable = {
     type: string;
     label: string;
@@ -77,12 +102,12 @@ type ValueFieldProps = {
     ref?: RefObject<HTMLElement | null>;
 };
 
-declare const registerVariableType: ({ key, icon, startIcon, valueField, propTypeUtil, variableType, defaultValue, selectionFilter, valueTransformer, fallbackPropTypeUtil, isCompatible, }: {
+declare const registerVariableType: ({ key, icon, startIcon, valueField, propTypeUtil, variableType, defaultValue, selectionFilter, valueTransformer, fallbackPropTypeUtil, isCompatible, emptyState, }: {
     icon: react.ForwardRefExoticComponent<Omit<_mui_material.SvgIconProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
     startIcon?: ({ value }: {
         value: string;
     }) => react.JSX.Element;
-    valueField: (props: ValueFieldProps) => react.JSX.Element;
+    valueField?: (props: ValueFieldProps) => react.JSX.Element;
     variableType: string;
     key?: string;
     defaultValue?: string;
@@ -91,6 +116,7 @@ declare const registerVariableType: ({ key, icon, startIcon, valueField, propTyp
     selectionFilter?: (variables: NormalizedVariable[], propType: _elementor_editor_props.PropType) => NormalizedVariable[];
     valueTransformer?: (value: string, type?: string) => _elementor_editor_props.PropValue;
     isCompatible?: (propType: _elementor_editor_props.PropType, variable: Variable) => boolean;
+    emptyState?: react.JSX.Element;
 }) => void;
 
 declare const GLOBAL_VARIABLES_URI = "elementor://global-variables";
@@ -112,4 +138,4 @@ declare const Utils: {
     };
 };
 
-export { GLOBAL_VARIABLES_URI, Utils, init, registerVariableType, registerVariableTypes, service };
+export { GLOBAL_VARIABLES_URI, Utils, init, registerVariableType, registerVariableTypes, service, sizeVariablePropTypeUtil };

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 import * as _elementor_editor_props from '@elementor/editor-props';
 import { PropType } from '@elementor/editor-props';
+import { z } from '@elementor/schema';
 import * as react from 'react';
 import { RefObject } from 'react';
 import * as _mui_material from '@mui/material';
@@ -8,6 +9,30 @@ declare function init(): void;
 
 declare function registerVariableTypes(): void;
 
+declare const sizeVariablePropTypeUtil: {
+    extract: (prop: unknown) => string | null;
+    isValid: (prop: unknown) => prop is _elementor_editor_props.TransformablePropValue<"global-size-variable", string>;
+    create: {
+        (value: string): _elementor_editor_props.TransformablePropValue<"global-size-variable", string>;
+        (value: string, createOptions?: _elementor_editor_props.CreateOptions): _elementor_editor_props.TransformablePropValue<"global-size-variable", string>;
+        (value: (prev?: string | undefined) => string, createOptions: _elementor_editor_props.CreateOptions): _elementor_editor_props.TransformablePropValue<"global-size-variable", string>;
+    };
+    schema: z.ZodObject<{
+        $$type: z.ZodLiteral<"global-size-variable">;
+        value: z.ZodType<string, z.ZodTypeDef, string>;
+        disabled: z.ZodOptional<z.ZodBoolean>;
+    }, "strict", z.ZodTypeAny, {
+        value: string;
+        $$type: "global-size-variable";
+        disabled?: boolean | undefined;
+    }, {
+        value: string;
+        $$type: "global-size-variable";
+        disabled?: boolean | undefined;
+    }>;
+    key: "global-size-variable";
+};
+
 type TVariable = {
     type: string;
     label: string;
@@ -77,12 +102,12 @@ type ValueFieldProps = {
     ref?: RefObject<HTMLElement | null>;
 };
 
-declare const registerVariableType: ({ key, icon, startIcon, valueField, propTypeUtil, variableType, defaultValue, selectionFilter, valueTransformer, fallbackPropTypeUtil, isCompatible, }: {
+declare const registerVariableType: ({ key, icon, startIcon, valueField, propTypeUtil, variableType, defaultValue, selectionFilter, valueTransformer, fallbackPropTypeUtil, isCompatible, emptyState, }: {
     icon: react.ForwardRefExoticComponent<Omit<_mui_material.SvgIconProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
     startIcon?: ({ value }: {
         value: string;
     }) => react.JSX.Element;
-    valueField: (props: ValueFieldProps) => react.JSX.Element;
+    valueField?: (props: ValueFieldProps) => react.JSX.Element;
     variableType: string;
     key?: string;
     defaultValue?: string;
@@ -91,6 +116,7 @@ declare const registerVariableType: ({ key, icon, startIcon, valueField, propTyp
     selectionFilter?: (variables: NormalizedVariable[], propType: _elementor_editor_props.PropType) => NormalizedVariable[];
     valueTransformer?: (value: string, type?: string) => _elementor_editor_props.PropValue;
     isCompatible?: (propType: _elementor_editor_props.PropType, variable: Variable) => boolean;
+    emptyState?: react.JSX.Element;
 }) => void;
 
 declare const GLOBAL_VARIABLES_URI = "elementor://global-variables";
@@ -112,4 +138,4 @@ declare const Utils: {
     };
 };
 
-export { GLOBAL_VARIABLES_URI, Utils, init, registerVariableType, registerVariableTypes, service };
+export { GLOBAL_VARIABLES_URI, Utils, init, registerVariableType, registerVariableTypes, service, sizeVariablePropTypeUtil };

package/dist/index.js

@@ -35,7 +35,8 @@ __export(index_exports, {
   init: () => init,
   registerVariableType: () => registerVariableType,
   registerVariableTypes: () => registerVariableTypes,
-  service: () => service
+  service: () => service,
+  sizeVariablePropTypeUtil: () => sizeVariablePropTypeUtil
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -43,7 +44,7 @@ module.exports = __toCommonJS(index_exports);
 var import_editor = require("@elementor/editor");
 var import_editor_editing_panel8 = require("@elementor/editor-editing-panel");
 var import_editor_panels2 = require("@elementor/editor-panels");
-var import_editor_props6 = require("@elementor/editor-props");
+var import_editor_props7 = require("@elementor/editor-props");
 
 // src/components/variables-manager/variables-manager-panel.tsx
 var React12 = __toESM(require("react"));
@@ -681,7 +682,8 @@ function createVariableTypeRegistry() {
     selectionFilter,
     valueTransformer,
     fallbackPropTypeUtil,
-    isCompatible
+    isCompatible,
+    emptyState
   }) => {
     const variableTypeKey = key ?? propTypeUtil.key;
     if (!isCompatible) {
@@ -704,7 +706,8 @@ function createVariableTypeRegistry() {
       selectionFilter,
       valueTransformer,
       fallbackPropTypeUtil,
-      isCompatible
+      isCompatible,
+      emptyState
     };
     registerTransformer(propTypeUtil.key);
     registerInheritanceTransformer(propTypeUtil.key);
@@ -771,8 +774,13 @@ var usePermissions = () => {
 };
 
 // src/components/ui/empty-state.tsx
-var EmptyState = ({ icon, title, message, onAdd }) => {
+var EmptyState = ({ icon, title, message, onAdd, children }) => {
   const canAdd = usePermissions().canAdd();
+  const displayTitle = canAdd ? title : (0, import_i18n5.__)("There are no variables", "elementor");
+  const displayMessage = canAdd ? message : (0, import_i18n5.__)("With your current role, you can only connect and detach variables.", "elementor");
+  return /* @__PURE__ */ React3.createElement(Content, { title: displayTitle, message: displayMessage, icon }, children || onAdd && /* @__PURE__ */ React3.createElement(import_ui4.Button, { variant: "outlined", color: "secondary", size: "small", onClick: onAdd }, (0, import_i18n5.__)("Create a variable", "elementor")));
+};
+function Content({ title, message, icon, children }) {
   return /* @__PURE__ */ React3.createElement(
     import_ui4.Stack,
     {
@@ -784,17 +792,10 @@ var EmptyState = ({ icon, title, message, onAdd }) => {
       sx: { p: 2.5, pt: 8, pb: 5.5 }
     },
     icon,
-    canAdd ? /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(Content, { title, message }), onAdd && /* @__PURE__ */ React3.createElement(import_ui4.Button, { variant: "outlined", color: "secondary", size: "small", onClick: onAdd }, (0, import_i18n5.__)("Create a variable", "elementor"))) : /* @__PURE__ */ React3.createElement(
-      Content,
-      {
-        title: (0, import_i18n5.__)("There are no variables", "elementor"),
-        message: (0, import_i18n5.__)("With your current role, you can only connect and detach variables.", "elementor")
-      }
-    )
+    /* @__PURE__ */ React3.createElement(import_ui4.Typography, { align: "center", variant: "subtitle2" }, title),
+    /* @__PURE__ */ React3.createElement(import_ui4.Typography, { align: "center", variant: "caption", maxWidth: "180px" }, message),
+    children
   );
-};
-function Content({ title, message }) {
-  return /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(import_ui4.Typography, { align: "center", variant: "subtitle2" }, title), /* @__PURE__ */ React3.createElement(import_ui4.Typography, { align: "center", variant: "caption", maxWidth: "180px" }, message));
 }
 
 // src/components/ui/no-search-results.tsx
@@ -1617,7 +1618,7 @@ var VariablesManagerTable = ({
                   onChange,
                   onValidationChange,
                   error
-                }) => row.valueField({
+                }) => row.valueField?.({
                   ref: {
                     current: variableRowRefs.current.get(
                       "table-ref-" + row.id
@@ -1637,7 +1638,7 @@ var VariablesManagerTable = ({
                     onFieldError?.(!!errorMsg);
                   },
                   error
-                }),
+                }) ?? /* @__PURE__ */ React11.createElement(React11.Fragment, null),
                 onRowRef: handleRowRef(row.id),
                 gap: 0.25,
                 fieldType: "value"
@@ -2002,6 +2003,25 @@ var usePopoverContentRef = () => {
   return (0, import_react12.useContext)(PopoverContentRefContext);
 };
 
+// src/sync/license-info.ts
+function getLicenseInfo() {
+  const extendedWindow = window;
+  return {
+    hasPro: !!extendedWindow.elementorPro
+  };
+}
+
+// src/hooks/use-quota-permissions.ts
+var useQuotaPermissions = (variableType) => {
+  const quotaConfig = window.ElementorVariablesQuotaConfig || {};
+  const limit = quotaConfig[variableType] || 0;
+  const hasQuota = limit > 0;
+  return {
+    canAdd: () => hasQuota || getLicenseInfo().hasPro,
+    canEdit: () => hasQuota || getLicenseInfo().hasPro
+  };
+};
+
 // src/components/variable-creation.tsx
 var React15 = __toESM(require("react"));
 var import_react13 = require("react");
@@ -2154,7 +2174,7 @@ var VariableCreation = ({ onGoBack, onClose }) => {
         }
       }
     )
-  ), /* @__PURE__ */ React15.createElement(FormField, { errorMsg: valueFieldError, label: (0, import_i18n10.__)("Value", "elementor") }, /* @__PURE__ */ React15.createElement(import_ui15.Typography, { variant: "h5", id: "variable-value-wrapper" }, /* @__PURE__ */ React15.createElement(
+  ), ValueField && /* @__PURE__ */ React15.createElement(FormField, { errorMsg: valueFieldError, label: (0, import_i18n10.__)("Value", "elementor") }, /* @__PURE__ */ React15.createElement(import_ui15.Typography, { variant: "h5", id: "variable-value-wrapper" }, /* @__PURE__ */ React15.createElement(
     ValueField,
     {
       value,
@@ -2373,7 +2393,7 @@ var VariableEdit = ({ onClose, onGoBack, onSubmit, editId }) => {
         }
       }
     )
-  ), /* @__PURE__ */ React17.createElement(FormField, { errorMsg: valueFieldError, label: (0, import_i18n12.__)("Value", "elementor") }, /* @__PURE__ */ React17.createElement(import_ui17.Typography, { variant: "h5" }, /* @__PURE__ */ React17.createElement(
+  ), ValueField && /* @__PURE__ */ React17.createElement(FormField, { errorMsg: valueFieldError, label: (0, import_i18n12.__)("Value", "elementor") }, /* @__PURE__ */ React17.createElement(import_ui17.Typography, { variant: "h5" }, /* @__PURE__ */ React17.createElement(
     ValueField,
     {
       propTypeKey: variable.type,
@@ -2506,8 +2526,8 @@ var VariablesStyledMenuList = (0, import_ui19.styled)(import_ui19.MenuList)(({ t
 var SIZE5 = "tiny";
 var CREATE_LABEL = (0, import_i18n14.__)("Create variable", "elementor");
 var MANAGER_LABEL = (0, import_i18n14.__)("Variables Manager", "elementor");
-var VariablesSelection = ({ closePopover, onAdd, onEdit, onSettings }) => {
-  const { icon: VariableIcon, startIcon, variableType, propTypeUtil } = useVariableType();
+var VariablesSelection = ({ closePopover, onAdd, onEdit, onSettings, disabled = false }) => {
+  const { icon: VariableIcon, startIcon, variableType, propTypeUtil, emptyState } = useVariableType();
   const { value: variable, setValue: setVariable, path } = useVariableBoundProp();
   const [searchValue, setSearchValue] = (0, import_react16.useState)("");
   const {
@@ -2536,16 +2556,17 @@ var VariablesSelection = ({ closePopover, onAdd, onEdit, onSettings }) => {
   const actions = [];
   if (onAdd) {
     actions.push(
-      /* @__PURE__ */ React19.createElement(import_ui20.Tooltip, { key: "add", placement: "top", title: CREATE_LABEL }, /* @__PURE__ */ React19.createElement(
+      /* @__PURE__ */ React19.createElement(import_ui20.Tooltip, { key: "add", placement: "top", title: CREATE_LABEL }, /* @__PURE__ */ React19.createElement("span", null, /* @__PURE__ */ React19.createElement(
         import_ui20.IconButton,
         {
           id: "add-variable-button",
           size: SIZE5,
           onClick: onAddAndTrack,
-          "aria-label": CREATE_LABEL
+          "aria-label": CREATE_LABEL,
+          disabled
         },
         /* @__PURE__ */ React19.createElement(import_icons11.PlusIcon, { fontSize: SIZE5 })
-      ))
+      )))
     );
   }
   if (onSettings) {
@@ -2585,11 +2606,23 @@ var VariablesSelection = ({ closePopover, onAdd, onEdit, onSettings }) => {
   const handleClearSearch = () => {
     setSearchValue("");
   };
-  const noVariableTitle = (0, import_i18n14.sprintf)(
+  const noVariableTitle = disabled ? (0, import_i18n14.sprintf)(
+    /* translators: %s: Variable Type. */
+    (0, import_i18n14.__)("No %s variables yet", "elementor"),
+    variableType
+  ) : (0, import_i18n14.sprintf)(
     /* translators: %s: Variable Type. */
     (0, import_i18n14.__)("Create your first %s variable", "elementor"),
     variableType
   );
+  const noVariableMessage = disabled ? (0, import_i18n14.sprintf)(
+    /* translators: %s: Variable Type. */
+    (0, import_i18n14.__)(
+      "Start by creating your first %s variable to apply consistent sizing across elements.",
+      "elementor"
+    ),
+    variableType
+  ) : (0, import_i18n14.__)("Variables are saved attributes that you can apply anywhere on your site.", "elementor");
   return /* @__PURE__ */ React19.createElement(import_editor_editing_panel4.PopoverBody, null, /* @__PURE__ */ React19.createElement(
     import_editor_ui7.PopoverHeader,
     {
@@ -2628,13 +2661,11 @@ var VariablesSelection = ({ closePopover, onAdd, onEdit, onSettings }) => {
     EmptyState,
     {
       title: noVariableTitle,
-      message: (0, import_i18n14.__)(
-        "Variables are saved attributes that you can apply anywhere on your site.",
-        "elementor"
-      ),
+      message: noVariableMessage,
       icon: /* @__PURE__ */ React19.createElement(VariableIcon, { fontSize: "large" }),
-      onAdd
-    }
+      onAdd: disabled ? void 0 : onAdd
+    },
+    emptyState
   ), hasNoCompatibleVariables && /* @__PURE__ */ React19.createElement(
     EmptyState,
     {
@@ -2644,8 +2675,9 @@ var VariablesSelection = ({ closePopover, onAdd, onEdit, onSettings }) => {
         "elementor"
       ),
       icon: /* @__PURE__ */ React19.createElement(VariableIcon, { fontSize: "large" }),
-      onAdd
-    }
+      onAdd: disabled ? void 0 : onAdd
+    },
+    emptyState
   ));
 };
 
@@ -2673,6 +2705,7 @@ var VariableSelectionPopover = ({ closePopover, propTypeKey, selectedVariable })
 };
 function RenderView(props) {
   const userPermissions = usePermissions();
+  const userQuotaPremissions = useQuotaPermissions(props.propTypeKey);
   const handlers = {
     onClose: () => {
       props.closePopover();
@@ -2712,7 +2745,8 @@ function RenderView(props) {
         closePopover: handlers.onClose,
         onAdd: handlers.onAdd,
         onEdit: handlers.onEdit,
-        onSettings: handlers.onSettings
+        onSettings: handlers.onSettings,
+        disabled: !userQuotaPremissions.canAdd()
       }
     );
   }
@@ -2901,7 +2935,7 @@ var VariableRestore = ({ variableId, onClose, onSubmit }) => {
         }
       }
     )
-  ), /* @__PURE__ */ React23.createElement(FormField, { errorMsg: valueFieldError, label: (0, import_i18n16.__)("Value", "elementor") }, /* @__PURE__ */ React23.createElement(import_ui23.Typography, { variant: "h5" }, /* @__PURE__ */ React23.createElement(
+  ), ValueField && /* @__PURE__ */ React23.createElement(FormField, { errorMsg: valueFieldError, label: (0, import_i18n16.__)("Value", "elementor") }, /* @__PURE__ */ React23.createElement(import_ui23.Typography, { variant: "h5" }, /* @__PURE__ */ React23.createElement(
     ValueField,
     {
       value,
@@ -3527,7 +3561,8 @@ function initMcp() {
 
 // src/register-variable-types.tsx
 var React35 = __toESM(require("react"));
-var import_editor_props4 = require("@elementor/editor-props");
+var import_editor_props5 = require("@elementor/editor-props");
+var import_editor_ui9 = require("@elementor/editor-ui");
 var import_icons17 = require("@elementor/icons");
 
 // src/components/fields/color-field.tsx
@@ -3644,6 +3679,11 @@ var FontField = ({ value, onChange, onValidationChange }) => {
   ));
 };
 
+// src/prop-types/size-variable-prop-type.ts
+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/register-variable-types.tsx
 function registerVariableTypes() {
   registerVariableType({
@@ -3651,7 +3691,7 @@ function registerVariableTypes() {
     valueField: ColorField,
     icon: import_icons17.BrushIcon,
     propTypeUtil: colorVariablePropTypeUtil,
-    fallbackPropTypeUtil: import_editor_props4.colorPropTypeUtil,
+    fallbackPropTypeUtil: import_editor_props5.colorPropTypeUtil,
     variableType: "color",
     startIcon: ({ value }) => /* @__PURE__ */ React35.createElement(ColorIndicator, { size: "inherit", component: "span", value }),
     defaultValue: "#ffffff"
@@ -3661,10 +3701,19 @@ function registerVariableTypes() {
     valueField: FontField,
     icon: import_icons17.TextIcon,
     propTypeUtil: fontVariablePropTypeUtil,
-    fallbackPropTypeUtil: import_editor_props4.stringPropTypeUtil,
+    fallbackPropTypeUtil: import_editor_props5.stringPropTypeUtil,
     variableType: "font",
     defaultValue: "Roboto"
   });
+  registerVariableType({
+    key: sizeVariablePropTypeUtil.key,
+    icon: import_icons17.ExpandDiagonalIcon,
+    propTypeUtil: sizeVariablePropTypeUtil,
+    fallbackPropTypeUtil: import_editor_props5.sizePropTypeUtil,
+    variableType: "size",
+    selectionFilter: () => [],
+    emptyState: /* @__PURE__ */ React35.createElement(import_editor_ui9.UpgradeButton, { size: "small", href: "https://go.elementor.com/go-pro-panel-size-variable/" })
+  });
 }
 
 // src/renderers/style-variables-renderer.tsx
@@ -3717,7 +3766,7 @@ function convertToCssVariables(variables) {
 
 // src/repeater-injections.ts
 var import_editor_controls13 = require("@elementor/editor-controls");
-var import_editor_props5 = require("@elementor/editor-props");
+var import_editor_props6 = require("@elementor/editor-props");
 
 // src/components/variables-repeater-item-slot.tsx
 var React37 = __toESM(require("react"));
@@ -3744,21 +3793,21 @@ function registerRepeaterInjections() {
     id: "color-variables-background-icon",
     component: BackgroundRepeaterColorIndicator,
     condition: ({ value: prop }) => {
-      return hasAssignedColorVariable(import_editor_props5.backgroundColorOverlayPropTypeUtil.extract(prop)?.color);
+      return hasAssignedColorVariable(import_editor_props6.backgroundColorOverlayPropTypeUtil.extract(prop)?.color);
     }
   });
   (0, import_editor_controls13.injectIntoRepeaterItemIcon)({
     id: "color-variables-icon",
     component: BoxShadowRepeaterColorIndicator,
     condition: ({ value: prop }) => {
-      return hasAssignedColorVariable(import_editor_props5.shadowPropTypeUtil.extract(prop)?.color);
+      return hasAssignedColorVariable(import_editor_props6.shadowPropTypeUtil.extract(prop)?.color);
     }
   });
   (0, import_editor_controls13.injectIntoRepeaterItemLabel)({
     id: "color-variables-label",
     component: BackgroundRepeaterLabel,
     condition: ({ value: prop }) => {
-      return hasAssignedColorVariable(import_editor_props5.backgroundColorOverlayPropTypeUtil.extract(prop)?.color);
+      return hasAssignedColorVariable(import_editor_props6.backgroundColorOverlayPropTypeUtil.extract(prop)?.color);
     }
   });
 }
@@ -3789,7 +3838,7 @@ function init() {
   (0, import_editor_panels2.__registerPanel)(panel);
 }
 function hasVariable(value) {
-  if ((0, import_editor_props6.isTransformable)(value)) {
+  if ((0, import_editor_props7.isTransformable)(value)) {
     return hasVariableType(value.$$type);
   }
   return false;
@@ -3831,6 +3880,7 @@ var Utils = {
   init,
   registerVariableType,
   registerVariableTypes,
-  service
+  service,
+  sizeVariablePropTypeUtil
 });
 //# sourceMappingURL=index.js.map