@elementor/editor-controls 3.33.0-177 → 3.33.0-179

package/dist/index.d.mts

@@ -14,19 +14,21 @@ type ImageControlProps = {
 };
 declare const ImageControl: ControlComponent<({ sizes, showMode }: ImageControlProps) => React$1.JSX.Element>;
 
-declare const TextControl: ControlComponent<({ placeholder, error, inputValue, inputDisabled, helperText, sx, }: {
+declare const TextControl: ControlComponent<({ placeholder, error, inputValue, inputDisabled, helperText, sx, ariaLabel, }: {
     placeholder?: string;
     error?: boolean;
     inputValue?: string;
     inputDisabled?: boolean;
     helperText?: string;
     sx?: SxProps;
+    ariaLabel?: string;
 }) => React$1.JSX.Element>;
 
 type Props$7 = {
     placeholder?: string;
+    ariaLabel?: string;
 };
-declare const TextAreaControl: ControlComponent<({ placeholder }: Props$7) => React$1.JSX.Element>;
+declare const TextAreaControl: ControlComponent<({ placeholder, ariaLabel }: Props$7) => React$1.JSX.Element>;
 
 declare const lengthUnits: readonly ["px", "%", "em", "rem", "vw", "vh"];
 declare const angleUnits: readonly ["deg", "rad", "grad", "turn"];
@@ -85,8 +87,9 @@ type SelectControlProps = {
     options: SelectOption$1[];
     onChange?: (newValue: string | null, previousValue: string | null | undefined) => void;
     MenuProps?: SelectProps['MenuProps'];
+    ariaLabel?: string;
 };
-declare const SelectControl: ControlComponent<({ options, onChange, MenuProps }: SelectControlProps) => React$1.JSX.Element>;
+declare const SelectControl: ControlComponent<({ options, onChange, MenuProps, ariaLabel }: SelectControlProps) => React$1.JSX.Element>;
 
 declare const collectionMethods: {
     readonly 'off-canvas': () => SelectOption$1[];
@@ -214,8 +217,9 @@ type ItemSelectorProps = {
 };
 declare const ItemSelector: ({ itemsList, selectedItem, onItemChange, onClose, sectionWidth, title, itemStyle, onDebounce, icon, disabledItems, id, }: ItemSelectorProps) => React$1.JSX.Element;
 
-declare const UrlControl: ControlComponent<({ placeholder }: {
+declare const UrlControl: ControlComponent<({ placeholder, ariaLabel }: {
     placeholder?: string;
+    ariaLabel?: string;
 }) => React$1.JSX.Element>;
 
 type ControlProps<TControlProps = unknown> = TControlProps & {
@@ -233,6 +237,7 @@ type Props$3 = ControlProps<{
     minInputLength?: number;
     placeholder?: string;
     label?: string;
+    ariaLabel?: string;
 }>;
 type DestinationProp = LinkPropValue['value']['destination'];
 declare const LinkControl: ControlComponent<(props: Props$3) => React$1.JSX.Element>;
@@ -258,6 +263,7 @@ type Props$1 = {
     minInputLength?: number;
     placeholder?: string;
     onSetValue?: (value: DestinationProp | null) => void;
+    ariaLabel?: string;
 };
 declare const QueryControl: ControlComponent<(props: Props$1) => React$1.JSX.Element>;
 

package/dist/index.d.ts

@@ -14,19 +14,21 @@ type ImageControlProps = {
 };
 declare const ImageControl: ControlComponent<({ sizes, showMode }: ImageControlProps) => React$1.JSX.Element>;
 
-declare const TextControl: ControlComponent<({ placeholder, error, inputValue, inputDisabled, helperText, sx, }: {
+declare const TextControl: ControlComponent<({ placeholder, error, inputValue, inputDisabled, helperText, sx, ariaLabel, }: {
     placeholder?: string;
     error?: boolean;
     inputValue?: string;
     inputDisabled?: boolean;
     helperText?: string;
     sx?: SxProps;
+    ariaLabel?: string;
 }) => React$1.JSX.Element>;
 
 type Props$7 = {
     placeholder?: string;
+    ariaLabel?: string;
 };
-declare const TextAreaControl: ControlComponent<({ placeholder }: Props$7) => React$1.JSX.Element>;
+declare const TextAreaControl: ControlComponent<({ placeholder, ariaLabel }: Props$7) => React$1.JSX.Element>;
 
 declare const lengthUnits: readonly ["px", "%", "em", "rem", "vw", "vh"];
 declare const angleUnits: readonly ["deg", "rad", "grad", "turn"];
@@ -85,8 +87,9 @@ type SelectControlProps = {
     options: SelectOption$1[];
     onChange?: (newValue: string | null, previousValue: string | null | undefined) => void;
     MenuProps?: SelectProps['MenuProps'];
+    ariaLabel?: string;
 };
-declare const SelectControl: ControlComponent<({ options, onChange, MenuProps }: SelectControlProps) => React$1.JSX.Element>;
+declare const SelectControl: ControlComponent<({ options, onChange, MenuProps, ariaLabel }: SelectControlProps) => React$1.JSX.Element>;
 
 declare const collectionMethods: {
     readonly 'off-canvas': () => SelectOption$1[];
@@ -214,8 +217,9 @@ type ItemSelectorProps = {
 };
 declare const ItemSelector: ({ itemsList, selectedItem, onItemChange, onClose, sectionWidth, title, itemStyle, onDebounce, icon, disabledItems, id, }: ItemSelectorProps) => React$1.JSX.Element;
 
-declare const UrlControl: ControlComponent<({ placeholder }: {
+declare const UrlControl: ControlComponent<({ placeholder, ariaLabel }: {
     placeholder?: string;
+    ariaLabel?: string;
 }) => React$1.JSX.Element>;
 
 type ControlProps<TControlProps = unknown> = TControlProps & {
@@ -233,6 +237,7 @@ type Props$3 = ControlProps<{
     minInputLength?: number;
     placeholder?: string;
     label?: string;
+    ariaLabel?: string;
 }>;
 type DestinationProp = LinkPropValue['value']['destination'];
 declare const LinkControl: ControlComponent<(props: Props$3) => React$1.JSX.Element>;
@@ -258,6 +263,7 @@ type Props$1 = {
     minInputLength?: number;
     placeholder?: string;
     onSetValue?: (value: DestinationProp | null) => void;
+    ariaLabel?: string;
 };
 declare const QueryControl: ControlComponent<(props: Props$1) => React$1.JSX.Element>;
 

package/dist/index.js

@@ -476,7 +476,7 @@ var React10 = __toESM(require("react"));
 var import_editor_props2 = require("@elementor/editor-props");
 var import_editor_ui = require("@elementor/editor-ui");
 var import_ui5 = require("@elementor/ui");
-var SelectControl = createControl(({ options, onChange, MenuProps }) => {
+var SelectControl = createControl(({ options, onChange, MenuProps, ariaLabel }) => {
   const { value, setValue, disabled, placeholder } = useBoundProp(import_editor_props2.stringPropTypeUtil);
   const handleChange = (event) => {
     const newValue = event.target.value || null;
@@ -491,6 +491,7 @@ var SelectControl = createControl(({ options, onChange, MenuProps }) => {
       displayEmpty: true,
       size: "tiny",
       MenuProps,
+      "aria-label": ariaLabel || placeholder,
       renderValue: (selectedValue) => {
         const findOptionByValue = (searchValue) => options.find((opt) => opt.value === searchValue);
         if (!selectedValue || selectedValue === "") {
@@ -550,7 +551,8 @@ var TextControl = createControl(
     inputValue,
     inputDisabled,
     helperText,
-    sx
+    sx,
+    ariaLabel
   }) => {
     const { value, setValue, disabled } = useBoundProp(import_editor_props4.stringPropTypeUtil);
     const handleChange = (event) => setValue(event.target.value);
@@ -565,7 +567,10 @@ var TextControl = createControl(
         placeholder,
         error,
         helperText,
-        sx
+        sx,
+        inputProps: {
+          ...ariaLabel ? { "aria-label": ariaLabel } : {}
+        }
       }
     ));
   }
@@ -575,7 +580,7 @@ var TextControl = createControl(
 var React13 = __toESM(require("react"));
 var import_editor_props5 = require("@elementor/editor-props");
 var import_ui8 = require("@elementor/ui");
-var TextAreaControl = createControl(({ placeholder }) => {
+var TextAreaControl = createControl(({ placeholder, ariaLabel }) => {
   const { value, setValue, disabled } = useBoundProp(import_editor_props5.stringPropTypeUtil);
   const handleChange = (event) => {
     setValue(event.target.value);
@@ -590,7 +595,10 @@ var TextAreaControl = createControl(({ placeholder }) => {
       disabled,
       value: value ?? "",
       onChange: handleChange,
-      placeholder
+      placeholder,
+      inputProps: {
+        ...ariaLabel ? { "aria-label": ariaLabel } : {}
+      }
     }
   ));
 });
@@ -3026,21 +3034,26 @@ var FontFamilyControl = createControl(({ fontFamilies, sectionWidth }) => {
 var React58 = __toESM(require("react"));
 var import_editor_props21 = require("@elementor/editor-props");
 var import_ui43 = require("@elementor/ui");
-var UrlControl = createControl(({ placeholder }) => {
-  const { value, setValue, disabled } = useBoundProp(import_editor_props21.urlPropTypeUtil);
-  const handleChange = (event) => setValue(event.target.value);
-  return /* @__PURE__ */ React58.createElement(ControlActions, null, /* @__PURE__ */ React58.createElement(
-    import_ui43.TextField,
-    {
-      size: "tiny",
-      fullWidth: true,
-      value: value ?? "",
-      disabled,
-      onChange: handleChange,
-      placeholder
-    }
-  ));
-});
+var UrlControl = createControl(
+  ({ placeholder, ariaLabel }) => {
+    const { value, setValue, disabled } = useBoundProp(import_editor_props21.urlPropTypeUtil);
+    const handleChange = (event) => setValue(event.target.value);
+    return /* @__PURE__ */ React58.createElement(ControlActions, null, /* @__PURE__ */ React58.createElement(
+      import_ui43.TextField,
+      {
+        size: "tiny",
+        fullWidth: true,
+        value: value ?? "",
+        disabled,
+        onChange: handleChange,
+        placeholder,
+        inputProps: {
+          ...ariaLabel ? { "aria-label": ariaLabel } : {}
+        }
+      }
+    ));
+  }
+);
 
 // src/controls/link-control.tsx
 var React63 = __toESM(require("react"));
@@ -3135,6 +3148,7 @@ var Autocomplete = (0, import_react28.forwardRef)((props, ref) => {
     minInputLength = 2,
     value = "",
     startAdornment,
+    disablePortal = true,
     ...restProps
   } = props;
   const optionKeys = factoryFilter(value, options, minInputLength).map(({ id }) => id);
@@ -3151,8 +3165,8 @@ var Autocomplete = (0, import_react28.forwardRef)((props, ref) => {
       ...restProps,
       ref,
       forcePopupIcon: false,
+      disablePortal,
       disableClearable: true,
-      disablePortal: true,
       freeSolo: allowCustomValues,
       openOnFocus: false,
       open: shouldOpen,
@@ -3175,7 +3189,8 @@ var Autocomplete = (0, import_react28.forwardRef)((props, ref) => {
           allowClear,
           placeholder,
           hasSelectedValue: isValueFromOptions,
-          startAdornment
+          startAdornment,
+          extraInputProps: restProps.inputProps
         }
       )
     }
@@ -3187,7 +3202,8 @@ var TextInput = ({
   placeholder,
   handleChange,
   hasSelectedValue,
-  startAdornment
+  startAdornment,
+  extraInputProps
 }) => {
   const onChange = (event) => {
     handleChange(event.target.value);
@@ -3198,6 +3214,7 @@ var TextInput = ({
       ...params,
       placeholder,
       onChange,
+      inputProps: { ...params.inputProps ?? {}, ...extraInputProps ?? {} },
       sx: {
         "& .MuiInputBase-input": {
           cursor: hasSelectedValue ? "default" : void 0
@@ -3248,7 +3265,8 @@ var QueryControl = createControl((props) => {
     queryOptions: { url, params = {} },
     placeholder,
     minInputLength = 2,
-    onSetValue
+    onSetValue,
+    ariaLabel
   } = props || {};
   const normalizedPlaceholder = placeholder || (0, import_i18n22.__)("Search", "elementor");
   const [options, setOptions] = (0, import_react29.useState)(
@@ -3308,7 +3326,11 @@ var QueryControl = createControl((props) => {
       value: value?.value?.id?.value || value?.value,
       onOptionChange,
       onTextChange,
-      minInputLength
+      minInputLength,
+      disablePortal: false,
+      inputProps: {
+        ...ariaLabel ? { "aria-label": ariaLabel } : {}
+      }
     }
   ));
 });
@@ -3376,7 +3398,8 @@ var LinkControl = createControl((props) => {
     placeholder,
     minInputLength = 2,
     context: { elementId },
-    label = (0, import_i18n23.__)("Link", "elementor")
+    label = (0, import_i18n23.__)("Link", "elementor"),
+    ariaLabel
   } = props || {};
   const [linkInLinkRestriction, setLinkInLinkRestriction] = (0, import_react30.useState)((0, import_editor_elements2.getLinkInLinkRestriction)(elementId));
   const shouldDisableAddingLink = !isActive && linkInLinkRestriction.shouldRestrict;
@@ -3432,7 +3455,8 @@ var LinkControl = createControl((props) => {
       allowCustomValues,
       minInputLength,
       placeholder,
-      onSetValue: onSaveValueToSession
+      onSetValue: onSaveValueToSession,
+      ariaLabel: ariaLabel || label
     }
   )), /* @__PURE__ */ React63.createElement(PropKeyProvider, { bind: "isTargetBlank" }, /* @__PURE__ */ React63.createElement(import_ui47.Grid, { container: true, alignItems: "center", flexWrap: "nowrap", justifyContent: "space-between" }, /* @__PURE__ */ React63.createElement(import_ui47.Grid, { item: true }, /* @__PURE__ */ React63.createElement(ControlFormLabel, null, (0, import_i18n23.__)("Open in a new tab", "elementor"))), /* @__PURE__ */ React63.createElement(import_ui47.Grid, { item: true, sx: { marginInlineEnd: -1 } }, /* @__PURE__ */ React63.createElement(SwitchControl, null))))))));
 });