@widergy/energy-ui 3.24.0 → 3.26.0

package/dist/components/UTPhoneInput/versions/V1/index.js

@@ -0,0 +1,166 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = require("prop-types");
+var _utils = require("../../../UTValidation/utils");
+var _inputs = require("../../../../constants/inputs");
+var _UTBaseInputField = _interopRequireDefault(require("../../../UTBaseInputField"));
+var _UTFieldLabel = _interopRequireDefault(require("../../../UTFieldLabel"));
+var _UTLabel = _interopRequireDefault(require("../../../UTLabel"));
+var _UTValidation = _interopRequireWildcard(require("../../../UTValidation"));
+var _constants = require("./constants");
+var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const UTPhoneInput = _ref => {
+  let {
+    areaCodePlaceholder,
+    countryCode,
+    areaCodeDataTestId,
+    phoneNumberDataTestId,
+    disabled,
+    error,
+    helpText,
+    maxLength = 10,
+    onBlur,
+    onChange,
+    onFocus,
+    placeholder,
+    readOnly,
+    required,
+    RightIcon,
+    title,
+    titleVariant,
+    translations = {
+      areaCodeWithoutZeroError: 'Ingrese el código sin 0',
+      invalidAreaCodeError: 'Código de área inválido'
+    },
+    validations,
+    value,
+    withAreaCode = true
+  } = _ref;
+  const [areaCode, setAreaCode] = (0, _react.useState)('');
+  const [phoneNumber, setPhoneNumber] = (0, _react.useState)('');
+  const [areaCodeError, setAreaCodeError] = (0, _react.useState)('');
+  const [isValidCode, setIsValidCode] = (0, _react.useState)(false);
+  (0, _react.useEffect)(() => {
+    if (value && withAreaCode) {
+      const [code, phone] = value.split('-');
+      setAreaCode(code || '');
+      setPhoneNumber(phone || '');
+    } else if (value && !withAreaCode) {
+      setPhoneNumber(value);
+    }
+  }, [value, withAreaCode]);
+  (0, _react.useEffect)(() => {
+    const {
+      areaCodeWithoutZeroError,
+      invalidAreaCodeError
+    } = translations;
+    if (areaCode) {
+      if (areaCode.startsWith('0')) {
+        setAreaCodeError(areaCodeWithoutZeroError);
+        setIsValidCode(false);
+      } else {
+        const code = _constants.AREA_CODES.find(element => element.code === areaCode);
+        setIsValidCode(!!code);
+        setAreaCodeError(!code ? invalidAreaCodeError : '');
+      }
+    }
+  }, [areaCode, translations]);
+  const handleChangeAreaCode = (0, _react.useCallback)(areaCodeValue => {
+    setAreaCode(areaCodeValue);
+  }, []);
+  const handleChangePhoneNumber = (0, _react.useCallback)(phoneNumberValue => {
+    setPhoneNumber(phoneNumberValue);
+  }, []);
+  (0, _react.useEffect)(() => {
+    if (areaCode !== '' || phoneNumber !== '') {
+      const newValue = withAreaCode ? "".concat(areaCode, "-").concat(phoneNumber) : phoneNumber;
+      if (newValue !== value) {
+        onChange(newValue);
+      }
+    }
+  }, [areaCode, phoneNumber, withAreaCode, onChange, value]);
+  const validationData = validations || areaCodeError && (0, _utils.formatErrorToValidation)(areaCodeError) || error && (0, _utils.formatErrorToValidation)(error);
+  const hasError = (validationData === null || validationData === void 0 ? void 0 : validationData.length) > 0;
+  const titleColorTheme = readOnly ? 'gray' : 'dark';
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _stylesModule.default.container
+  }, title && /*#__PURE__*/_react.default.createElement(_UTFieldLabel.default, {
+    colorTheme: titleColorTheme,
+    required: required,
+    variant: _inputs.TITLE_VARIANTS[titleVariant]
+  }, title), /*#__PURE__*/_react.default.createElement("div", {
+    className: _stylesModule.default.inputsContainer
+  }, withAreaCode && /*#__PURE__*/_react.default.createElement("div", {
+    className: _stylesModule.default.areaCodeContainer
+  }, /*#__PURE__*/_react.default.createElement(_UTBaseInputField.default, {
+    type: "numeric",
+    alwaysShowPlaceholder: true,
+    dataTestId: areaCodeDataTestId,
+    disabled: disabled,
+    error: hasError,
+    maxLength: 4,
+    onBlur: onBlur,
+    onChange: handleChangeAreaCode,
+    onFocus: onFocus,
+    placeholder: areaCodePlaceholder,
+    readOnly: readOnly,
+    RightIcon: RightIcon,
+    value: areaCode
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: _stylesModule.default.phoneContainer
+  }, /*#__PURE__*/_react.default.createElement(_UTBaseInputField.default, {
+    type: "numeric",
+    alwaysShowPlaceholder: true,
+    dataTestId: phoneNumberDataTestId,
+    disabled: withAreaCode && !isValidCode || disabled || readOnly,
+    error: hasError && !areaCodeError,
+    maxLength: withAreaCode ? maxLength - ((areaCode === null || areaCode === void 0 ? void 0 : areaCode.length) || 0) : maxLength,
+    onBlur: onBlur,
+    onChange: handleChangePhoneNumber,
+    onFocus: onFocus,
+    placeholder: placeholder,
+    prefix: countryCode,
+    RightIcon: RightIcon,
+    value: phoneNumber
+  }))), helpText && /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+    colorTheme: "gray",
+    variant: "small"
+  }, helpText), validationData && /*#__PURE__*/_react.default.createElement(_UTValidation.default, {
+    validationData: validationData
+  }));
+};
+UTPhoneInput.propTypes = {
+  areaCodeDataTestId: _propTypes.string,
+  areaCodePlaceholder: _propTypes.string,
+  countryCode: _propTypes.string,
+  disabled: _propTypes.bool,
+  error: _propTypes.string,
+  helpText: _propTypes.string,
+  maxLength: _propTypes.number,
+  onBlur: _propTypes.func,
+  onChange: _propTypes.func,
+  onFocus: _propTypes.func,
+  phoneNumberDataTestId: _propTypes.string,
+  placeholder: _propTypes.string,
+  readOnly: _propTypes.bool,
+  required: _propTypes.bool,
+  RightIcon: _propTypes.elementType,
+  title: _propTypes.string,
+  titleVariant: _propTypes.string,
+  translations: (0, _propTypes.shape)({
+    areaCodeWithoutZeroError: _propTypes.string,
+    invalidAreaCodeError: _propTypes.string
+  }),
+  validations: _UTValidation.validationDataProptypes,
+  value: _propTypes.string,
+  withAreaCode: _propTypes.bool
+};
+var _default = exports.default = UTPhoneInput;

package/dist/components/UTPhoneInput/versions/V1/styles.module.scss

@@ -0,0 +1,20 @@
+.container {
+  display: flex;
+  flex-direction: column;
+  grid-gap: 12px;
+}
+
+.inputsContainer {
+  display: flex;
+  align-items: flex-start;
+  flex-direction: row;
+  grid-gap: 8px;
+}
+
+.areaCodeContainer {
+  width: 110px;
+}
+
+.phoneContainer {
+  width: 209px;
+}

package/dist/components/UTStatus/index.js

@@ -20,6 +20,7 @@ const UTStatus = _ref => {
     classes,
     className,
     Icon,
+    labelDataTestId,
     size,
     title,
     type,
@@ -34,6 +35,7 @@ const UTStatus = _ref => {
     className: classes.icon
   }), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
     className: classes.label,
+    dataTestId: labelDataTestId,
     variant: _constants.SIZES[size] || _constants.SIZES[_constants.DEFAULT_PROPS.size],
     colorTheme: (0, _theme.getLabelTheme)((0, _theme.validateProps)({
       type,
@@ -47,6 +49,7 @@ UTStatus.propTypes = {
   classes: (0, _propTypes.objectOf)(_propTypes.string),
   className: _propTypes.string,
   Icon: _propTypes.elementType,
+  labelDataTestId: _propTypes.string,
   size: _propTypes.string,
   title: _propTypes.string,
   type: _propTypes.string,

package/dist/components/UTTable/index.js

@@ -57,6 +57,7 @@ const UTTable = _ref => {
     initialSelectedRows = [],
     integrationType = _UTTable.INTEGRATION_TYPES.INTERNAL,
     loading,
+    noResultDataTestId,
     noResultsLabel = _constants.NO_RESULTS_LABEL,
     onOrderChange,
     onPageChange,
@@ -199,7 +200,8 @@ const UTTable = _ref => {
       width: tableWidth
     }
   }, /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    className: classes.noResultsLabel
+    className: classes.noResultsLabel,
+    dataTestId: noResultDataTestId
   }, noResultsLabel)) : currentRows.map((row, index) => {
     const isSelected = selectedRows.includes(row[rowKey]);
     const selectedClassNames = isSelected ? classes.selectedRow : rowSpacing === _constants.ROW_SPACING_NAMES.NONE && index < currentRows.length - 1 ? _stylesModule.default.unselectedSmallRow : undefined;
@@ -336,6 +338,7 @@ UTTable.propTypes = {
   initialSelectedRows: (0, _propTypes.arrayOf)((0, _propTypes.oneOfType)([_propTypes.number, _propTypes.string])),
   integrationType: (0, _propTypes.oneOf)([...Object.values(_UTTable.INTEGRATION_TYPES)]),
   loading: _propTypes.bool,
+  noResultDataTestId: _propTypes.string,
   noResultsLabel: _propTypes.string,
   onOrderChange: _propTypes.func,
   onPageChange: _propTypes.func,

package/dist/components/UTTextArea/versions/V0/index.js

@@ -21,6 +21,7 @@ const UTTextArea = _ref => {
   let {
     classes,
     classNames = {},
+    dataTestId,
     disabled,
     field,
     HelpIcon,
@@ -62,6 +63,7 @@ const UTTextArea = _ref => {
     className: _stylesModule.default.componentWrapper
   }, /*#__PURE__*/_react.default.createElement("textarea", _extends({}, inputProps, {
     className: "".concat(_stylesModule.default.textarea, " ").concat(textarea, " ").concat(classes.textarea),
+    "data-testid": dataTestId,
     onChange: handleOnChange,
     onBlur: onBlur,
     onFocus: onFocus,
@@ -87,6 +89,7 @@ UTTextArea.propTypes = {
     textarea: _propTypes.string,
     textAreaContainer: _propTypes.string
   }),
+  dataTestId: _propTypes.string,
   disabled: _propTypes.bool,
   field: _formTypes.fieldType,
   HelpIcon: _propTypes.elementType,

package/dist/components/UTTextInput/versions/V0/index.js

@@ -52,6 +52,7 @@ class UTTextInput extends _react.PureComponent {
       captionLabel,
       classes,
       containerClassName,
+      dataTestId,
       disabled,
       field,
       id,
@@ -141,6 +142,9 @@ class UTTextInput extends _react.PureComponent {
       autoComplete: "off",
       InputProps: {
         id: fieldId,
+        inputProps: {
+          'data-testid': dataTestId
+        },
         endAdornment: endAction && /*#__PURE__*/_react.default.createElement(_InputAdornment.default, {
           position: "end",
           className: "".concat(adornmentInside && _stylesModule.default.adornmentInside)
@@ -178,6 +182,7 @@ UTTextInput.propTypes = {
   captionLabel: _propTypes.string,
   classes: (0, _propTypes.objectOf)(_propTypes.string),
   containerClassName: _propTypes.string,
+  dataTestId: _propTypes.string,
   disabled: _propTypes.bool,
   field: _propTypes.object,
   id: _propTypes.string,

package/dist/components/UTTextInput/versions/V1/README.md

@@ -12,6 +12,7 @@
 | alwaysShowPlaceholder | bool                                                      | false   | Whether the placeholder should always be displayed, even when the input is focused.                      |
 | blurOnSubmit          | bool                                                      | false   | Whether the input should lose focus after submitting (e.g., after pressing "Enter").                     |
 | classNames            | objectOf(string)                                          |         | Additional classes for customizing the component, independent of Material-UI.                            |
+| dataTestId            | string                                                    |         | Identifier for the input field, useful for testing purposes.                                             |
 | disabled              | bool                                                      | false   | Disables the input field.                                                                                |
 | error                 | string                                                    |         | Error message displayed below the input field.                                                           |
 | helpText              | string                                                    |         | Help text displayed below the input field.                                                               |
@@ -23,7 +24,6 @@
 | onBlur                | func                                                      |         | Function called when the input field loses focus.                                                        |
 | onChange              | func                                                      |         | Function called when the input field value changes.                                                      |
 | onFocus               | func                                                      |         | Function called when the input field gains focus.                                                        |
-| onSubmitEditing       | func                                                      |         | Function called when the input field is submitted (e.g., pressing Enter on a keyboard).                  |
 | placeholder           | string                                                    |         | Placeholder text displayed when the input field is empty.                                                |
 | prefix                | string                                                    |         | Text displayed before the entered value in the input field.                                              |
 | readOnly              | bool                                                      | false   | Makes the input field read-only.                                                                         |

package/dist/components/UTTextInput/versions/V1/index.js

@@ -6,20 +6,13 @@ Object.defineProperty(exports, "__esModule", {
 exports.propTypes = exports.default = void 0;
 var _propTypes = require("prop-types");
 var _react = _interopRequireWildcard(require("react"));
-var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));
 var _utils = require("../../../UTValidation/utils");
-var _classesUtils = require("../../../../utils/classesUtils");
-var _UTValidation = _interopRequireWildcard(require("../../../UTValidation"));
+var _inputs = require("../../../../constants/inputs.js");
+var _UTBaseInputField = _interopRequireDefault(require("../../../UTBaseInputField"));
 var _UTFieldLabel = _interopRequireDefault(require("../../../UTFieldLabel"));
 var _UTLabel = _interopRequireDefault(require("../../../UTLabel"));
-var _WithTheme = _interopRequireDefault(require("../../../WithTheme"));
-var _theme = require("./theme");
-var _ActionAdornment = _interopRequireDefault(require("./components/ActionAdornment"));
-var _IconAdornment = _interopRequireDefault(require("./components/IconAdornment"));
-var _PrefixAdornment = _interopRequireDefault(require("./components/PrefixAdornment"));
+var _UTValidation = _interopRequireWildcard(require("../../../UTValidation"));
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
-var _SuffixAdornment = _interopRequireDefault(require("./components/SuffixAdornment"));
-var _TooltipAdornment = _interopRequireDefault(require("./components/TooltipAdornment"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -27,12 +20,13 @@ const UTTextInput = _ref => {
   let {
     action,
     alwaysShowPlaceholder,
-    classes: theme,
     classNames = {},
+    dataTestId,
     disabled,
     error,
     helpText,
     id,
+    inputSize,
     LeftIcon,
     maxLength,
     maxRows = 1,
@@ -53,90 +47,38 @@ const UTTextInput = _ref => {
     validations,
     value = null
   } = _ref;
-  const classes = (0, _react.useMemo)(() => (0, _classesUtils.mergeClasses)(theme, classNames), [classNames, theme]);
-  const [focused, setFocused] = (0, _react.useState)(false);
-  const handleFocus = event => {
-    setFocused(true);
-    onFocus === null || onFocus === void 0 || onFocus(event);
-  };
-  const handleBlur = event => {
-    setFocused(false);
-    onBlur === null || onBlur === void 0 || onBlur(event);
-  };
-  const handleChange = event => {
-    onChange === null || onChange === void 0 || onChange(event.target.value);
-  };
   const titleColorTheme = readOnly ? 'gray' : 'dark';
-  const titleComponentVariant = titleVariant === 'small' ? 'small' : 'body';
-  const shouldShowPlaceholder = alwaysShowPlaceholder || focused;
   const validationData = (0, _react.useMemo)(() => validations || error && (0, _utils.formatErrorToValidation)(error), [error, validations]);
-  const multiline = maxRows > 1;
-  const hasStartAdornments = LeftIcon || prefix;
-  const hasCharactersCount = showCharacterCount && maxLength && !disabled && !readOnly;
-  const hasEndAdornments = suffix || RightIcon || action || tooltip || error;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "".concat(_stylesModule.default.container, " ").concat(classes.container)
+    className: "".concat(_stylesModule.default.container, " ").concat(classNames.container)
   }, title && /*#__PURE__*/_react.default.createElement(_UTFieldLabel.default, {
     colorTheme: titleColorTheme,
-    variant: titleComponentVariant,
+    variant: _inputs.TITLE_VARIANTS[titleVariant],
     required: required
-  }, title), /*#__PURE__*/_react.default.createElement(_TextField.default, {
-    margin: "none",
-    autoComplete: "new-password" // in the new MUI's version, the autocomplete='off' doesn't work for Chrome, please use this instead
-    ,
-    disabled: disabled || readOnly,
+  }, title), /*#__PURE__*/_react.default.createElement(_UTBaseInputField.default, {
+    action: action,
+    alwaysShowPlaceholder: alwaysShowPlaceholder,
+    classNames: classNames,
+    dataTestId: dataTestId,
+    disabled: disabled,
     error: error,
     id: id,
+    inputSize: inputSize,
+    LeftIcon: LeftIcon,
+    maxLength: maxLength,
     maxRows: maxRows,
-    minRows: maxRows,
-    multiline: multiline,
-    onBlur: handleBlur,
-    onChange: handleChange,
-    onFocus: handleFocus,
-    placeholder: shouldShowPlaceholder ? placeholder : '',
+    onBlur: onBlur,
+    onChange: onChange,
+    onFocus: onFocus,
+    placeholder: placeholder,
+    prefix: prefix,
+    readOnly: readOnly,
+    RightIcon: RightIcon,
+    showCharacterCount: showCharacterCount,
+    suffix: suffix,
+    tooltip: tooltip,
     type: type,
-    value: value,
-    variant: "outlined",
-    InputProps: {
-      inputProps: {
-        maxLength
-      },
-      classes: {
-        notchedOutline: "".concat(classes.inputContainer, " ").concat(focused && classes.focusedInputContainer),
-        adornedStart: _stylesModule.default.elementsContainer,
-        adornedEnd: _stylesModule.default.elementsContainer,
-        input: classes.input,
-        root: classes.root
-      },
-      startAdornment: hasStartAdornments ? /*#__PURE__*/_react.default.createElement("div", {
-        className: _stylesModule.default.adornmentsContainer
-      }, LeftIcon && /*#__PURE__*/_react.default.createElement(_IconAdornment.default, {
-        Icon: LeftIcon
-      }), prefix && /*#__PURE__*/_react.default.createElement(_PrefixAdornment.default, {
-        text: prefix
-      })) : hasCharactersCount && /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-        className: classes.charactersCount,
-        colorTheme: "gray",
-        variant: "small"
-      }, (value === null || value === void 0 ? void 0 : value.length) || 0, "/", maxLength),
-      endAdornment: hasEndAdornments && /*#__PURE__*/_react.default.createElement("div", {
-        className: "".concat(_stylesModule.default.adornmentsContainer, " ").concat(multiline && _stylesModule.default.multilineAdornmentsContainer)
-      }, suffix && /*#__PURE__*/_react.default.createElement(_SuffixAdornment.default, {
-        text: suffix
-      }), RightIcon && /*#__PURE__*/_react.default.createElement(_IconAdornment.default, {
-        changeOnError: true,
-        error: error,
-        Icon: RightIcon
-      }), action && /*#__PURE__*/_react.default.createElement(_ActionAdornment.default, {
-        action: action,
-        classNames: {
-          root: _stylesModule.default.actionButton
-        },
-        disabled: disabled && !readOnly
-      }), tooltip && /*#__PURE__*/_react.default.createElement(_TooltipAdornment.default, {
-        tooltip: tooltip
-      }))
-    }
+    value: value
   }), helpText && /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
     colorTheme: "gray",
     variant: "small"
@@ -147,12 +89,13 @@ const UTTextInput = _ref => {
 const propTypes = exports.propTypes = {
   action: _propTypes.elementType,
   alwaysShowPlaceholder: _propTypes.bool,
-  classes: (0, _propTypes.objectOf)(_propTypes.string),
   classNames: (0, _propTypes.objectOf)(_propTypes.string),
+  dataTestId: _propTypes.string,
   disabled: _propTypes.bool,
   error: _propTypes.bool,
   helpText: _propTypes.string,
   id: _propTypes.string,
+  inputSize: _propTypes.string,
   LeftIcon: _propTypes.elementType,
   maxLength: _propTypes.number,
   maxRows: _propTypes.number,
@@ -174,4 +117,4 @@ const propTypes = exports.propTypes = {
   value: _propTypes.string
 };
 UTTextInput.propTypes = propTypes;
-var _default = exports.default = (0, _WithTheme.default)(_theme.retrieveStyle)(UTTextInput);
+var _default = exports.default = UTTextInput;

package/dist/components/UTTextInput/versions/V1/styles.module.scss

@@ -1,29 +1,5 @@
-.actionButton {
-  margin: -4px !important;
-}
-
-.adornmentsContainer {
-  align-items: center;
-  display: flex;
-  flex-shrink: 0;
-  grid-gap: 16px;
-}
-
 .container {
   display: flex;
   flex-direction: column;
   grid-gap: 8px;
 }
-
-.elementsContainer {
-  grid-gap: 16px;
-}
-
-.multilineAdornmentsContainer {
-  place-self: start;
-}
-
-.startAdornments {
-  display: flex;
-  flex-direction: column;
-}

package/dist/constants/inputs.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TITLE_VARIANTS = void 0;
+const TITLE_VARIANTS = exports.TITLE_VARIANTS = {
+  large: 'body',
+  small: 'small'
+};

package/dist/types/googleMapsTypes.js

@@ -41,6 +41,7 @@ const UTGoogleAutocompletePropTypes = exports.UTGoogleAutocompletePropTypes = {
   alert: _propTypes.string,
   apikey: _propTypes.string,
   classes: (0, _propTypes.objectOf)(_propTypes.string),
+  dataTestId: _propTypes.string,
   detailErrorLabel: _propTypes.string,
   inputProps: _propTypes.object,
   minChar: _propTypes.number,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@widergy/energy-ui",
-  "version": "3.24.0",
+  "version": "3.26.0",
   "description": "Widergy Web Components",
   "author": "widergy",
   "license": "MIT",
@@ -92,7 +92,8 @@
   },
   "resolutions": {
     "@babel/preset-env": "^7.8.7",
-    "caniuse-lite": "1.0.30001632"
+    "caniuse-lite": "1.0.30001632",
+    "react-error-overlay": "6.0.9"
   },
   "browserslist": [
     ">0.2%",