@elementor/editor-variables 3.35.0-441 → 3.35.0-443

package/dist/index.d.mts

@@ -3,7 +3,7 @@ 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 { RefObject, KeyboardEvent } from 'react';
 import * as _mui_material from '@mui/material';
 
 declare function init(): void;
@@ -105,6 +105,7 @@ type ValueFieldProps = {
         message: string;
     };
     ref?: RefObject<HTMLElement | null>;
+    onKeyDown?: (event: KeyboardEvent<HTMLElement>) => void;
 };
 
 declare const registerVariableType: ({ key, icon, startIcon, valueField, propTypeUtil, variableType, defaultValue, selectionFilter, valueTransformer, styleTransformer, fallbackPropTypeUtil, isCompatible, emptyState, }: {

package/dist/index.d.ts

@@ -3,7 +3,7 @@ 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 { RefObject, KeyboardEvent } from 'react';
 import * as _mui_material from '@mui/material';
 
 declare function init(): void;
@@ -105,6 +105,7 @@ type ValueFieldProps = {
         message: string;
     };
     ref?: RefObject<HTMLElement | null>;
+    onKeyDown?: (event: KeyboardEvent<HTMLElement>) => void;
 };
 
 declare const registerVariableType: ({ key, icon, startIcon, valueField, propTypeUtil, variableType, defaultValue, selectionFilter, valueTransformer, styleTransformer, fallbackPropTypeUtil, isCompatible, emptyState, }: {

package/dist/index.js

@@ -1230,7 +1230,8 @@ var LabelField = ({
   focusOnShow = false,
   selectOnShow = false,
   showWarningInfotip = false,
-  variables
+  variables,
+  onKeyDown
 }) => {
   const [label, setLabel] = (0, import_react7.useState)(value);
   const [errorMessage, setErrorMessage] = (0, import_react7.useState)("");
@@ -1260,7 +1261,8 @@ var LabelField = ({
       inputProps: {
         maxLength: VARIABLE_LABEL_MAX_LENGTH,
         ...selectOnShow && { onFocus: (e) => e.target.select() },
-        "aria-label": "Name"
+        "aria-label": "Name",
+        onKeyDown
       },
       autoFocus: focusOnShow
     }
@@ -2180,6 +2182,12 @@ var VariableCreation = ({ onGoBack, onClose }) => {
     return !!errorMessage;
   };
   const isSubmitDisabled = hasEmptyFields() || hasErrors();
+  const handleKeyDown = (event) => {
+    if (event.key === "Enter" && !isSubmitDisabled) {
+      event.preventDefault();
+      handleCreateAndTrack();
+    }
+  };
   return /* @__PURE__ */ React15.createElement(import_editor_editing_panel2.PopoverBody, { height: "auto" }, /* @__PURE__ */ React15.createElement(
     import_editor_ui6.PopoverHeader,
     {
@@ -2210,7 +2218,8 @@ var VariableCreation = ({ onGoBack, onClose }) => {
             value: label,
             message: errorMsg
           });
-        }
+        },
+        onKeyDown: handleKeyDown
       }
     )
   ), 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(
@@ -2224,7 +2233,8 @@ var VariableCreation = ({ onGoBack, onClose }) => {
         setValueFieldError("");
       },
       onValidationChange: setValueFieldError,
-      propType
+      propType,
+      onKeyDown: handleKeyDown
     }
   ))), errorMessage && /* @__PURE__ */ React15.createElement(import_ui15.FormHelperText, { error: true }, errorMessage)), /* @__PURE__ */ React15.createElement(import_ui15.CardActions, { sx: { pt: 0.5, pb: 1 } }, /* @__PURE__ */ React15.createElement(
     import_ui15.Button,
@@ -2390,6 +2400,12 @@ var VariableEdit = ({ onClose, onGoBack, onSubmit, editId }) => {
     return !!errorMessage;
   };
   const isSubmitDisabled = noValueChanged() || hasEmptyFields() || hasErrors();
+  const handleKeyDown = (event) => {
+    if (event.key === "Enter" && !isSubmitDisabled) {
+      event.preventDefault();
+      handleUpdate();
+    }
+  };
   return /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(import_editor_editing_panel3.PopoverBody, { height: "auto" }, /* @__PURE__ */ React17.createElement(
     import_editor_ui7.PopoverHeader,
     {
@@ -2429,7 +2445,8 @@ var VariableEdit = ({ onClose, onGoBack, onSubmit, editId }) => {
             value: label,
             message: errorMsg
           });
-        }
+        },
+        onKeyDown: handleKeyDown
       }
     )
   ), ValueField && /* @__PURE__ */ React17.createElement(FormField, { errorMsg: valueFieldError, label: (0, import_i18n12.__)("Value", "elementor") }, /* @__PURE__ */ React17.createElement(import_ui17.Typography, { variant: "h5" }, /* @__PURE__ */ React17.createElement(
@@ -2443,6 +2460,7 @@ var VariableEdit = ({ onClose, onGoBack, onSubmit, editId }) => {
         setErrorMessage("");
         setValueFieldError("");
       },
+      onKeyDown: handleKeyDown,
       onValidationChange: setValueFieldError,
       propType
     }
@@ -2949,6 +2967,12 @@ var VariableRestore = ({ variableId, onClose, onSubmit }) => {
     return !!errorMessage;
   };
   const isSubmitDisabled = noValueChanged() || hasEmptyFields() || hasErrors();
+  const handleKeyDown = (event) => {
+    if (event.key === "Enter" && !isSubmitDisabled) {
+      event.preventDefault();
+      handleRestore();
+    }
+  };
   return /* @__PURE__ */ React23.createElement(PopoverContentRefContextProvider, null, /* @__PURE__ */ React23.createElement(import_editor_editing_panel5.PopoverBody, { height: "auto" }, /* @__PURE__ */ React23.createElement(
     import_editor_ui10.PopoverHeader,
     {
@@ -2979,7 +3003,8 @@ var VariableRestore = ({ variableId, onClose, onSubmit }) => {
             value: label,
             message: errorMsg
           });
-        }
+        },
+        onKeyDown: handleKeyDown
       }
     )
   ), ValueField && /* @__PURE__ */ React23.createElement(FormField, { errorMsg: valueFieldError, label: (0, import_i18n16.__)("Value", "elementor") }, /* @__PURE__ */ React23.createElement(import_ui23.Typography, { variant: "h5" }, /* @__PURE__ */ React23.createElement(
@@ -2994,7 +3019,8 @@ var VariableRestore = ({ variableId, onClose, onSubmit }) => {
         setValueFieldError("");
       },
       onValidationChange: setValueFieldError,
-      propType
+      propType,
+      onKeyDown: handleKeyDown
     }
   ))), errorMessage && /* @__PURE__ */ React23.createElement(import_ui23.FormHelperText, { error: true }, errorMessage)), /* @__PURE__ */ React23.createElement(import_ui23.CardActions, { sx: { pt: 0.5, pb: 1 } }, /* @__PURE__ */ React23.createElement(import_ui23.Button, { size: "small", variant: "contained", disabled: isSubmitDisabled, onClick: handleRestore }, (0, import_i18n16.__)("Restore", "elementor")))));
 };