@hitachivantara/uikit-react-core 5.96.2 → 5.97.0

package/dist/cjs/AppSwitcher/Action/Action.cjs

@@ -45,7 +45,7 @@ const HvAppSwitcherAction = ({
       );
     }
     const brokenTitle = name.split(" ");
-    const initials = brokenTitle[0].substring(0, 1) + (brokenTitle[1] ? brokenTitle[1].substring(0, 1) : "");
+    const initials = brokenTitle[0].slice(0, 1) + (brokenTitle[1] ? brokenTitle[1].slice(0, 1) : "");
     return /* @__PURE__ */ jsxRuntime.jsx(Avatar.HvAvatar, { size: "sm", backgroundColor: color, variant: "square", "aria-hidden": true, children: initials });
   };
   const isSelected = isSelectedCallback(application);

package/dist/cjs/BaseInput/validations.cjs

@@ -1,24 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const isNumeric = (num) => (
-  // to prevent Number( <spaces> ) = 0
-  num.trim().length > 0 && !Number.isNaN(Number(num))
-);
-const isEmail = (email) => {
-  const regexp = /^[^\\s]+[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?[.])+[a-z0-9](?:[a-z0-9-]*[a-z0-9])$/i;
-  return regexp.test(email);
+const isTypeValidationIgnored = (type) => {
+  return type === "text" || type === "password";
 };
-const computeValidationType = (type) => {
-  switch (type) {
-    case "number":
-      return "number";
-    case "email":
-      return "email";
-    default:
-      return "none";
-  }
-};
-const hasBuiltInValidations = (required, validationType, minCharQuantity, maxCharQuantity, validation, inputProps) => required || validationType !== "none" || minCharQuantity != null || maxCharQuantity != null || validation != null || inputProps?.required != null || inputProps?.minLength != null || inputProps?.maxLength != null || inputProps?.min != null || inputProps?.max != null || inputProps?.type != null && inputProps?.type !== "text" && inputProps?.type !== "password" || inputProps?.pattern != null;
+const hasBuiltInValidations = (required, inputType, minCharQuantity, maxCharQuantity, validation, inputProps) => required || !isTypeValidationIgnored(inputType) || minCharQuantity != null || maxCharQuantity != null || validation != null || inputProps?.required != null || inputProps?.minLength != null || inputProps?.maxLength != null || inputProps?.min != null || inputProps?.max != null || inputProps?.type && !isTypeValidationIgnored(inputProps.type) || inputProps?.pattern != null;
 const computeValidationState = (inputValidity, isEmptyValue) => {
   if (inputValidity.valid && isEmptyValue) {
     return "standBy";
@@ -43,19 +28,10 @@ const computeValidationMessage = (inputValidity, errorMessages) => {
   }
   return errorMessages.error;
 };
-const validateInput = (input, required, minCharQuantity, maxCharQuantity, validationType, validation) => {
+const validateInput = (input, required, minCharQuantity, maxCharQuantity, validation) => {
   const inputValidity = {
-    valid: input?.validity?.valid ?? true,
-    badInput: input?.validity?.badInput,
-    customError: input?.validity?.customError,
-    patternMismatch: input?.validity?.patternMismatch,
-    rangeOverflow: input?.validity?.rangeOverflow,
-    rangeUnderflow: input?.validity?.rangeUnderflow,
-    stepMismatch: input?.validity?.stepMismatch,
-    tooLong: input?.validity?.tooLong,
-    tooShort: input?.validity?.tooShort,
-    typeMismatch: input?.validity?.typeMismatch,
-    valueMissing: input?.validity?.valueMissing
+    ...input?.validity,
+    valid: input?.validity?.valid ?? true
   };
   const value = input?.value;
   if (!value) {
@@ -72,20 +48,6 @@ const validateInput = (input, required, minCharQuantity, maxCharQuantity, valida
       inputValidity.tooLong = true;
       inputValidity.valid = false;
     }
-    switch (validationType) {
-      case "number":
-        if (!isNumeric(value)) {
-          inputValidity.typeMismatch = true;
-          inputValidity.valid = false;
-        }
-        break;
-      case "email":
-        if (!isEmail(value)) {
-          inputValidity.typeMismatch = true;
-          inputValidity.valid = false;
-        }
-        break;
-    }
     if (validation != null && !validation(value)) {
       inputValidity.customError = true;
       inputValidity.valid = false;
@@ -94,15 +56,19 @@ const validateInput = (input, required, minCharQuantity, maxCharQuantity, valida
   return inputValidity;
 };
 const DEFAULT_ERROR_MESSAGES = {
+  /** The value when a validation fails. */
   error: "Invalid value",
-  requiredError: "The value is required",
-  minCharError: "The value is too short",
+  /** The message that appears when there are too many characters. */
   maxCharError: "The value is too long",
+  /** The message that appears when there are too few characters. */
+  minCharError: "The value is too short",
+  /** The message that appears when the input is empty and required. */
+  requiredError: "The value is required",
+  /** The message that appears when the input is value is incompatible with the expected type. */
   typeMismatchError: "Invalid value"
 };
 exports.DEFAULT_ERROR_MESSAGES = DEFAULT_ERROR_MESSAGES;
 exports.computeValidationMessage = computeValidationMessage;
 exports.computeValidationState = computeValidationState;
-exports.computeValidationType = computeValidationType;
 exports.hasBuiltInValidations = hasBuiltInValidations;
 exports.validateInput = validateInput;

package/dist/cjs/BreadCrumb/utils.cjs

@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const icons = require("../icons.cjs");
 const setId = require("../utils/setId.cjs");
 const DropDownMenu = require("../DropDownMenu/DropDownMenu.cjs");
-const removeExtension = (label) => label.includes(".") ? label.substring(0, label.lastIndexOf(".")) : label;
+const removeExtension = (label) => label.includes(".") ? label.slice(0, label.lastIndexOf(".")) : label;
 const pathWithSubMenu = (id, listRoute, maxVisible, onClick, dropDownMenuProps) => {
   const nbrElemToSubMenu = listRoute.length - maxVisible;
   const subMenuList = listRoute.slice(1, nbrElemToSubMenu + 1);

package/dist/cjs/FilterGroup/Counter/Counter.cjs

@@ -26,7 +26,7 @@ const HvFilterGroupCounter = (props) => {
     filterValues = [],
     appliedFilters = []
   } = React.useContext(FilterGroupContext.HvFilterGroupContext);
-  const options = groupId && filterOptions.find((option) => option.id === groupId) ? [filterOptions.find((option) => option.id === groupId)] : filterOptions;
+  const options = groupId && filterOptions.some((option) => option.id === groupId) ? [filterOptions.find((option) => option.id === groupId)] : filterOptions;
   const optionIdx = filterOptions.findIndex((option) => option.id === groupId);
   let groupsCounter = 0;
   appliedFilters.forEach((fg, i) => {

package/dist/cjs/Header/Navigation/MenuBar/Bar.cjs

@@ -17,7 +17,7 @@ const Bar = (props) => {
   const { classes, cx } = Bar_styles.useClasses(classesProp);
   const selectionPath = React.useContext(SelectionContext.SelectionContext);
   const isMenu = type === "menu";
-  const isActive = isMenu && data.filter((item) => item.id === selectionPath?.[1]).length > 0;
+  const isActive = isMenu && data.some((item) => item.id === selectionPath?.[1]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {

package/dist/cjs/InlineEditor/InlineEditor.cjs

@@ -111,7 +111,7 @@ const HvInlineEditor = generic.fixedForwardRef(function HvInlineEditor2(props, r
         }
       ),
       className: cx(classes.button, {
-        [classes.largeText]: parseInt(lineHeight, 10) >= 28
+        [classes.largeText]: Number(lineHeight) >= 28
       }),
       onClick: handleClick,
       disabled,

package/dist/cjs/Input/Input.cjs

@@ -115,19 +115,17 @@ const HvInput = generic.fixedForwardRef(function HvInput2(props, ref) {
       validationMessages?.typeMismatchError
     ]
   );
-  const validationType = React.useMemo(() => validations.computeValidationType(type), [type]);
   const performValidation = React.useCallback(() => {
     const inputValidity = validations.validateInput(
       inputRef.current,
       required,
       minCharQuantity,
       maxCharQuantity,
-      validationType,
       validation
     );
     setValidationState(validations.computeValidationState(inputValidity, isEmptyValue));
     setValidationMessage(
-      validations.computeValidationMessage(inputValidity, errorMessages)
+      validations.computeValidationMessage(inputValidity, errorMessages) || ""
     );
     return inputValidity;
   }, [
@@ -138,12 +136,11 @@ const HvInput = generic.fixedForwardRef(function HvInput2(props, ref) {
     required,
     setValidationMessage,
     setValidationState,
-    validation,
-    validationType
+    validation
   ]);
   const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && validations.hasBuiltInValidations(
     required,
-    validationType,
+    type,
     minCharQuantity,
     maxCharQuantity,
     validation,
@@ -157,12 +154,7 @@ const HvInput = generic.fixedForwardRef(function HvInput2(props, ref) {
     if (type === "password") {
       return revealPassword ? "text" : "password";
     }
-    if (type === "search") {
-      return "search";
-    }
-    if (type === "number") {
-      return "number";
-    }
+    if (["search", "number", "email"].includes(type)) return type;
     return "text";
   }, [revealPassword, type]);
   const [suggestionValues, setSuggestionValues] = React.useState(null);

package/dist/cjs/List/List.cjs

@@ -177,9 +177,9 @@ const HvList = (props) => {
     return renderListItem(item, index, {
       style: {
         ...style,
-        top: `${parseFloat(style.top) + 5}px`,
-        left: `${parseFloat(style.left) + 5}px`,
-        width: `calc(${parseFloat(style.width)}% - 10px)`
+        top: `${Number.parseFloat(style.top) + 5}px`,
+        left: `${Number.parseFloat(style.left) + 5}px`,
+        width: `calc(${Number.parseFloat(style.width)}% - 10px)`
       },
       tabIndex,
       interactive: true,

package/dist/cjs/Table/hooks/useHvRowSelection.cjs

@@ -123,7 +123,7 @@ function reducer(state, action, previousState, instance) {
       applyToggleAllRowsSelectedToPrefilteredRows
     } = instance;
     const rowsToSelect = applyToggleAllRowsSelectedToPrefilteredRows ? initialRowsById : nonGroupedRowsById;
-    const selectAll = typeof setSelected !== "undefined" ? setSelected : !isAllRowsSelected;
+    const selectAll = setSelected ?? !isAllRowsSelected;
     const selectedRowIds = { ...state.selectedRowIds };
     if (selectAll) {
       Object.keys(rowsToSelect).forEach((rowId) => {
@@ -153,7 +153,7 @@ function reducer(state, action, previousState, instance) {
     }
     const { rowsById, selectSubRows = true, getSubRows } = instance;
     const isSelected = state.selectedRowIds[id];
-    const shouldExist = typeof setSelected !== "undefined" ? setSelected : !isSelected;
+    const shouldExist = setSelected ?? !isSelected;
     if (isSelected === shouldExist) {
       return state;
     }
@@ -188,7 +188,7 @@ function reducer(state, action, previousState, instance) {
       isAllPageRowsSelected,
       getSubRows
     } = instance;
-    const selectAll = typeof setSelected !== "undefined" ? setSelected : !isAllPageRowsSelected;
+    const selectAll = setSelected ?? !isAllPageRowsSelected;
     const newSelectedRowIds = { ...state.selectedRowIds };
     const handleRowById = (rowId) => {
       const row = rowsById[rowId];
@@ -222,7 +222,7 @@ function reducer(state, action, previousState, instance) {
     const { id, value: setLockedSelection } = action;
     const { rowsById, selectSubRows = true, getSubRows } = instance;
     const isLockedSelection = state.lockedSelectionRowIds[id];
-    const shouldExist = typeof setLockedSelection !== "undefined" ? setLockedSelection : !isLockedSelection;
+    const shouldExist = setLockedSelection ?? !isLockedSelection;
     if (isLockedSelection === shouldExist) {
       return state;
     }

package/dist/cjs/TagsInput/TagsInput.cjs

@@ -93,7 +93,7 @@ const HvTagsInput = React.forwardRef(
       (currValue) => {
         if (maxTagsQuantity !== null && maxTagsQuantity !== void 0 && currValue.length > maxTagsQuantity) {
           setValidationState("invalid");
-          setValidationMessage(errorMessages.maxCharError);
+          setValidationMessage(errorMessages.maxCharError || "");
           setStateValid(false);
         } else {
           setValidationState("valid");

package/dist/cjs/TextArea/TextArea.cjs

@@ -88,12 +88,11 @@ const HvTextArea = React.forwardRef(function HvTextArea2(props, ref) {
       required,
       minCharQuantity,
       maxCharQuantity,
-      "none",
       validation
     );
     setValidationState(validations.computeValidationState(inputValidity, isEmptyValue));
     setValidationMessage(
-      validations.computeValidationMessage(inputValidity, errorMessages)
+      validations.computeValidationMessage(inputValidity, errorMessages) || ""
     );
     return inputValidity;
   }, [
@@ -110,7 +109,7 @@ const HvTextArea = React.forwardRef(function HvTextArea2(props, ref) {
   const limitValue = (currentValue) => {
     if (currentValue === void 0 || !blockMax) return currentValue;
     const isOverflow = maxCharQuantity == null ? false : currentValue.length > maxCharQuantity;
-    return !isOverflow ? currentValue : currentValue.substring(0, maxCharQuantity);
+    return !isOverflow ? currentValue : currentValue.slice(0, maxCharQuantity);
   };
   const onContainerBlurHandler = (event) => {
     setFocused(false);
@@ -164,7 +163,7 @@ const HvTextArea = React.forwardRef(function HvTextArea2(props, ref) {
   }, [focused, isEmptyValue, performValidation]);
   const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && validations.hasBuiltInValidations(
     required,
-    "none",
+    "text",
     minCharQuantity,
     // If blockMax is true maxCharQuantity will never produce an error
     // unless the value is controlled, so we can't prevent it to overflow maxCharQuantity

package/dist/cjs/TimePicker/Placeholder.cjs

@@ -36,14 +36,14 @@ const Placeholder = React.forwardRef(
         ...others,
         children: [
           name && /* @__PURE__ */ jsxRuntime.jsx("input", { type: "hidden", name, value: getDateValue(value) }),
-          segments.map((segment, i) => /* @__PURE__ */ jsxRuntime.jsx(
+          segments.map((segment) => /* @__PURE__ */ jsxRuntime.jsx(
             PlaceholderSegment,
             {
               segment,
               state,
               placeholder: placeholders[segment.type]
             },
-            i
+            segment.type
           ))
         ]
       }

package/dist/cjs/TimePicker/TimePicker.cjs

@@ -183,7 +183,7 @@ const HvTimePicker = React.forwardRef(
                 ]
               },
               ...otherDropdownProps,
-              children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref: timeFieldRef, className: classes.timePopperContainer, children: state.segments.map((segment, i) => /* @__PURE__ */ jsxRuntime.jsx(
+              children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref: timeFieldRef, className: classes.timePopperContainer, children: state.segments.map((segment) => /* @__PURE__ */ jsxRuntime.jsx(
                 Unit.Unit,
                 {
                   state,
@@ -195,7 +195,7 @@ const HvTimePicker = React.forwardRef(
                     state.setSegment(segment.type, Number(val));
                   }
                 },
-                i
+                segment.type
               )) })
             }
           ),

package/dist/cjs/TreeView/TreeItem/TreeItem.cjs

@@ -73,7 +73,7 @@ const HvTreeItem = React.forwardRef(
       if (instance && label) {
         return instance.mapFirstChar(
           nodeId,
-          (contentRef.current?.textContent ?? "").substring(0, 1).toLowerCase()
+          (contentRef.current?.textContent ?? "").slice(0, 1).toLowerCase()
         );
       }
       return void 0;

package/dist/cjs/TreeView/TreeItem/useHvTreeItem.cjs

@@ -3,27 +3,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const DescendantProvider = require("../internals/DescendantProvider.cjs");
 const TreeViewProvider = require("../internals/TreeViewProvider.cjs");
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
-  if (e) {
-    for (const k in e) {
-      if (k !== "default") {
-        const d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: () => e[k]
-        });
-      }
-    }
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-const React__namespace = /* @__PURE__ */ _interopNamespace(React);
 function useHvTreeItem(nodeId) {
   const { instance, multiSelect } = TreeViewProvider.useTreeViewContext();
-  const { level = 0 } = React__namespace.useContext(DescendantProvider.DescendantContext);
+  const { level = 0 } = React.useContext(DescendantProvider.DescendantContext);
   const expandable = instance ? instance.isNodeExpandable(nodeId) : false;
   const expanded = instance ? instance.isNodeExpanded(nodeId) : false;
   const focused = instance ? instance.isNodeFocused(nodeId) : false;

package/dist/cjs/VerticalNavigation/TreeView/TreeViewItem.cjs

@@ -120,7 +120,7 @@ const HvVerticalNavigationTreeViewItem = React.forwardRef(
       if (mapFirstChar && unMapFirstChar && label && contentRef.current?.textContent) {
         mapFirstChar(
           nodeId,
-          contentRef.current?.textContent.substring(0, 1).toLowerCase()
+          contentRef.current?.textContent.slice(0, 1).toLowerCase()
         );
         return () => {
           unMapFirstChar(nodeId);
@@ -311,7 +311,7 @@ const HvVerticalNavigationTreeViewItem = React.forwardRef(
                       variant: "square",
                       size: "xs",
                       backgroundColor: "textSubtle",
-                      children: payload?.label?.substring(0, 1)
+                      children: payload?.label?.slice(0, 1)
                     }
                   ) : useIcons && icon,
                   hasChildren && !isOpen ? /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "Forwards", size: "xs", compact: true }) : hasAnyChildWithData && !isOpen && /* @__PURE__ */ jsxRuntime.jsx("div", {})

package/dist/cjs/hooks/useForkRef.cjs

@@ -1,24 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
-  if (e) {
-    for (const k in e) {
-      if (k !== "default") {
-        const d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: () => e[k]
-        });
-      }
-    }
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-const React__namespace = /* @__PURE__ */ _interopNamespace(React);
 const setRef = (ref, value) => {
   if (typeof ref === "function") {
     ref(value);
@@ -27,7 +9,7 @@ const setRef = (ref, value) => {
   }
 };
 const useForkRef = (refA, refB) => {
-  return React__namespace.useMemo(() => {
+  return React.useMemo(() => {
     if (refA == null && refB == null) {
       return null;
     }

package/dist/cjs/hooks/useImageLoaded.cjs

@@ -4,24 +4,18 @@ const React = require("react");
 const useImageLoaded = (src, srcSet) => {
   const [imageLoaded, setImageLoaded] = React.useState(false);
   React.useEffect(() => {
-    if (!src && !srcSet) {
-      return void 0;
-    }
+    if (!src && !srcSet) return;
     setImageLoaded(false);
     let active = true;
     const image = new Image();
     image.src = src || "";
     image.srcset = srcSet || "";
     image.onload = () => {
-      if (!active) {
-        return;
-      }
+      if (!active) return;
       setImageLoaded("loaded");
     };
     image.onerror = () => {
-      if (!active) {
-        return;
-      }
+      if (!active) return;
       setImageLoaded("error");
     };
     return () => {

package/dist/cjs/themes/pentahoPlus.cjs

@@ -51,7 +51,7 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
           Object.entries(notificationMap).map(([variant, color]) => [
             variant,
             {
-              backgroundColor: uikitStyles.theme.colors[`${color}Dimmed`],
+              backgroundColor: uikitStyles.theme.mix(`${color}Dimmed`, 0.5, "dimmer"),
               "--icolor": uikitStyles.theme.colors[color],
               "--outline": uikitStyles.theme.colors[`${color}Border`],
               "--bg": uikitStyles.theme.colors[`${color}Subtle`],

package/dist/esm/AppSwitcher/Action/Action.js

@@ -44,7 +44,7 @@ const HvAppSwitcherAction = ({
       );
     }
     const brokenTitle = name.split(" ");
-    const initials = brokenTitle[0].substring(0, 1) + (brokenTitle[1] ? brokenTitle[1].substring(0, 1) : "");
+    const initials = brokenTitle[0].slice(0, 1) + (brokenTitle[1] ? brokenTitle[1].slice(0, 1) : "");
     return /* @__PURE__ */ jsx(HvAvatar, { size: "sm", backgroundColor: color, variant: "square", "aria-hidden": true, children: initials });
   };
   const isSelected = isSelectedCallback(application);

package/dist/esm/BaseInput/validations.js

@@ -1,22 +1,7 @@
-const isNumeric = (num) => (
-  // to prevent Number( <spaces> ) = 0
-  num.trim().length > 0 && !Number.isNaN(Number(num))
-);
-const isEmail = (email) => {
-  const regexp = /^[^\\s]+[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?[.])+[a-z0-9](?:[a-z0-9-]*[a-z0-9])$/i;
-  return regexp.test(email);
+const isTypeValidationIgnored = (type) => {
+  return type === "text" || type === "password";
 };
-const computeValidationType = (type) => {
-  switch (type) {
-    case "number":
-      return "number";
-    case "email":
-      return "email";
-    default:
-      return "none";
-  }
-};
-const hasBuiltInValidations = (required, validationType, minCharQuantity, maxCharQuantity, validation, inputProps) => required || validationType !== "none" || minCharQuantity != null || maxCharQuantity != null || validation != null || inputProps?.required != null || inputProps?.minLength != null || inputProps?.maxLength != null || inputProps?.min != null || inputProps?.max != null || inputProps?.type != null && inputProps?.type !== "text" && inputProps?.type !== "password" || inputProps?.pattern != null;
+const hasBuiltInValidations = (required, inputType, minCharQuantity, maxCharQuantity, validation, inputProps) => required || !isTypeValidationIgnored(inputType) || minCharQuantity != null || maxCharQuantity != null || validation != null || inputProps?.required != null || inputProps?.minLength != null || inputProps?.maxLength != null || inputProps?.min != null || inputProps?.max != null || inputProps?.type && !isTypeValidationIgnored(inputProps.type) || inputProps?.pattern != null;
 const computeValidationState = (inputValidity, isEmptyValue) => {
   if (inputValidity.valid && isEmptyValue) {
     return "standBy";
@@ -41,19 +26,10 @@ const computeValidationMessage = (inputValidity, errorMessages) => {
   }
   return errorMessages.error;
 };
-const validateInput = (input, required, minCharQuantity, maxCharQuantity, validationType, validation) => {
+const validateInput = (input, required, minCharQuantity, maxCharQuantity, validation) => {
   const inputValidity = {
-    valid: input?.validity?.valid ?? true,
-    badInput: input?.validity?.badInput,
-    customError: input?.validity?.customError,
-    patternMismatch: input?.validity?.patternMismatch,
-    rangeOverflow: input?.validity?.rangeOverflow,
-    rangeUnderflow: input?.validity?.rangeUnderflow,
-    stepMismatch: input?.validity?.stepMismatch,
-    tooLong: input?.validity?.tooLong,
-    tooShort: input?.validity?.tooShort,
-    typeMismatch: input?.validity?.typeMismatch,
-    valueMissing: input?.validity?.valueMissing
+    ...input?.validity,
+    valid: input?.validity?.valid ?? true
   };
   const value = input?.value;
   if (!value) {
@@ -70,20 +46,6 @@ const validateInput = (input, required, minCharQuantity, maxCharQuantity, valida
       inputValidity.tooLong = true;
       inputValidity.valid = false;
     }
-    switch (validationType) {
-      case "number":
-        if (!isNumeric(value)) {
-          inputValidity.typeMismatch = true;
-          inputValidity.valid = false;
-        }
-        break;
-      case "email":
-        if (!isEmail(value)) {
-          inputValidity.typeMismatch = true;
-          inputValidity.valid = false;
-        }
-        break;
-    }
     if (validation != null && !validation(value)) {
       inputValidity.customError = true;
       inputValidity.valid = false;
@@ -92,17 +54,21 @@ const validateInput = (input, required, minCharQuantity, maxCharQuantity, valida
   return inputValidity;
 };
 const DEFAULT_ERROR_MESSAGES = {
+  /** The value when a validation fails. */
   error: "Invalid value",
-  requiredError: "The value is required",
-  minCharError: "The value is too short",
+  /** The message that appears when there are too many characters. */
   maxCharError: "The value is too long",
+  /** The message that appears when there are too few characters. */
+  minCharError: "The value is too short",
+  /** The message that appears when the input is empty and required. */
+  requiredError: "The value is required",
+  /** The message that appears when the input is value is incompatible with the expected type. */
   typeMismatchError: "Invalid value"
 };
 export {
   DEFAULT_ERROR_MESSAGES,
   computeValidationMessage,
   computeValidationState,
-  computeValidationType,
   hasBuiltInValidations,
   validateInput
 };

package/dist/esm/BreadCrumb/utils.js

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { HvIcon } from "../icons.js";
 import { setId } from "../utils/setId.js";
 import { HvDropDownMenu } from "../DropDownMenu/DropDownMenu.js";
-const removeExtension = (label) => label.includes(".") ? label.substring(0, label.lastIndexOf(".")) : label;
+const removeExtension = (label) => label.includes(".") ? label.slice(0, label.lastIndexOf(".")) : label;
 const pathWithSubMenu = (id, listRoute, maxVisible, onClick, dropDownMenuProps) => {
   const nbrElemToSubMenu = listRoute.length - maxVisible;
   const subMenuList = listRoute.slice(1, nbrElemToSubMenu + 1);

package/dist/esm/FilterGroup/Counter/Counter.js

@@ -25,7 +25,7 @@ const HvFilterGroupCounter = (props) => {
     filterValues = [],
     appliedFilters = []
   } = useContext(HvFilterGroupContext);
-  const options = groupId && filterOptions.find((option) => option.id === groupId) ? [filterOptions.find((option) => option.id === groupId)] : filterOptions;
+  const options = groupId && filterOptions.some((option) => option.id === groupId) ? [filterOptions.find((option) => option.id === groupId)] : filterOptions;
   const optionIdx = filterOptions.findIndex((option) => option.id === groupId);
   let groupsCounter = 0;
   appliedFilters.forEach((fg, i) => {

package/dist/esm/Header/Navigation/MenuBar/Bar.js

@@ -16,7 +16,7 @@ const Bar = (props) => {
   const { classes, cx } = useClasses(classesProp);
   const selectionPath = useContext(SelectionContext);
   const isMenu = type === "menu";
-  const isActive = isMenu && data.filter((item) => item.id === selectionPath?.[1]).length > 0;
+  const isActive = isMenu && data.some((item) => item.id === selectionPath?.[1]);
   return /* @__PURE__ */ jsx(
     "div",
     {

package/dist/esm/InlineEditor/InlineEditor.js

@@ -110,7 +110,7 @@ const HvInlineEditor = fixedForwardRef(function HvInlineEditor2(props, ref) {
         }
       ),
       className: cx(classes.button, {
-        [classes.largeText]: parseInt(lineHeight, 10) >= 28
+        [classes.largeText]: Number(lineHeight) >= 28
       }),
       onClick: handleClick,
       disabled,

package/dist/esm/Input/Input.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useRef, useState, useMemo, useCallback, useEffect } from "react";
 import { useForkRef } from "@mui/material/utils";
 import { useDefaultProps, useTheme } from "@hitachivantara/uikit-react-utils";
-import { DEFAULT_ERROR_MESSAGES, computeValidationType, validateInput, computeValidationState, computeValidationMessage, hasBuiltInValidations } from "../BaseInput/validations.js";
+import { DEFAULT_ERROR_MESSAGES, validateInput, computeValidationState, computeValidationMessage, hasBuiltInValidations } from "../BaseInput/validations.js";
 import { HvLabelContainer } from "../FormElement/LabelContainer.js";
 import { HvSuggestions } from "../FormElement/Suggestions/Suggestions.js";
 import { useControlled } from "../hooks/useControlled.js";
@@ -114,19 +114,17 @@ const HvInput = fixedForwardRef(function HvInput2(props, ref) {
       validationMessages?.typeMismatchError
     ]
   );
-  const validationType = useMemo(() => computeValidationType(type), [type]);
   const performValidation = useCallback(() => {
     const inputValidity = validateInput(
       inputRef.current,
       required,
       minCharQuantity,
       maxCharQuantity,
-      validationType,
       validation
     );
     setValidationState(computeValidationState(inputValidity, isEmptyValue));
     setValidationMessage(
-      computeValidationMessage(inputValidity, errorMessages)
+      computeValidationMessage(inputValidity, errorMessages) || ""
     );
     return inputValidity;
   }, [
@@ -137,12 +135,11 @@ const HvInput = fixedForwardRef(function HvInput2(props, ref) {
     required,
     setValidationMessage,
     setValidationState,
-    validation,
-    validationType
+    validation
   ]);
   const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && hasBuiltInValidations(
     required,
-    validationType,
+    type,
     minCharQuantity,
     maxCharQuantity,
     validation,
@@ -156,12 +153,7 @@ const HvInput = fixedForwardRef(function HvInput2(props, ref) {
     if (type === "password") {
       return revealPassword ? "text" : "password";
     }
-    if (type === "search") {
-      return "search";
-    }
-    if (type === "number") {
-      return "number";
-    }
+    if (["search", "number", "email"].includes(type)) return type;
     return "text";
   }, [revealPassword, type]);
   const [suggestionValues, setSuggestionValues] = useState(null);

package/dist/esm/List/List.js

@@ -176,9 +176,9 @@ const HvList = (props) => {
     return renderListItem(item, index, {
       style: {
         ...style,
-        top: `${parseFloat(style.top) + 5}px`,
-        left: `${parseFloat(style.left) + 5}px`,
-        width: `calc(${parseFloat(style.width)}% - 10px)`
+        top: `${Number.parseFloat(style.top) + 5}px`,
+        left: `${Number.parseFloat(style.left) + 5}px`,
+        width: `calc(${Number.parseFloat(style.width)}% - 10px)`
       },
       tabIndex,
       interactive: true,

package/dist/esm/Table/hooks/useHvRowSelection.js

@@ -121,7 +121,7 @@ function reducer(state, action, previousState, instance) {
       applyToggleAllRowsSelectedToPrefilteredRows
     } = instance;
     const rowsToSelect = applyToggleAllRowsSelectedToPrefilteredRows ? initialRowsById : nonGroupedRowsById;
-    const selectAll = typeof setSelected !== "undefined" ? setSelected : !isAllRowsSelected;
+    const selectAll = setSelected ?? !isAllRowsSelected;
     const selectedRowIds = { ...state.selectedRowIds };
     if (selectAll) {
       Object.keys(rowsToSelect).forEach((rowId) => {
@@ -151,7 +151,7 @@ function reducer(state, action, previousState, instance) {
     }
     const { rowsById, selectSubRows = true, getSubRows } = instance;
     const isSelected = state.selectedRowIds[id];
-    const shouldExist = typeof setSelected !== "undefined" ? setSelected : !isSelected;
+    const shouldExist = setSelected ?? !isSelected;
     if (isSelected === shouldExist) {
       return state;
     }
@@ -186,7 +186,7 @@ function reducer(state, action, previousState, instance) {
       isAllPageRowsSelected,
       getSubRows
     } = instance;
-    const selectAll = typeof setSelected !== "undefined" ? setSelected : !isAllPageRowsSelected;
+    const selectAll = setSelected ?? !isAllPageRowsSelected;
     const newSelectedRowIds = { ...state.selectedRowIds };
     const handleRowById = (rowId) => {
       const row = rowsById[rowId];
@@ -220,7 +220,7 @@ function reducer(state, action, previousState, instance) {
     const { id, value: setLockedSelection } = action;
     const { rowsById, selectSubRows = true, getSubRows } = instance;
     const isLockedSelection = state.lockedSelectionRowIds[id];
-    const shouldExist = typeof setLockedSelection !== "undefined" ? setLockedSelection : !isLockedSelection;
+    const shouldExist = setLockedSelection ?? !isLockedSelection;
     if (isLockedSelection === shouldExist) {
       return state;
     }

package/dist/esm/TagsInput/TagsInput.js

@@ -92,7 +92,7 @@ const HvTagsInput = forwardRef(
       (currValue) => {
         if (maxTagsQuantity !== null && maxTagsQuantity !== void 0 && currValue.length > maxTagsQuantity) {
           setValidationState("invalid");
-          setValidationMessage(errorMessages.maxCharError);
+          setValidationMessage(errorMessages.maxCharError || "");
           setStateValid(false);
         } else {
           setValidationState("valid");

package/dist/esm/TextArea/TextArea.js

@@ -87,12 +87,11 @@ const HvTextArea = forwardRef(function HvTextArea2(props, ref) {
       required,
       minCharQuantity,
       maxCharQuantity,
-      "none",
       validation
     );
     setValidationState(computeValidationState(inputValidity, isEmptyValue));
     setValidationMessage(
-      computeValidationMessage(inputValidity, errorMessages)
+      computeValidationMessage(inputValidity, errorMessages) || ""
     );
     return inputValidity;
   }, [
@@ -109,7 +108,7 @@ const HvTextArea = forwardRef(function HvTextArea2(props, ref) {
   const limitValue = (currentValue) => {
     if (currentValue === void 0 || !blockMax) return currentValue;
     const isOverflow = maxCharQuantity == null ? false : currentValue.length > maxCharQuantity;
-    return !isOverflow ? currentValue : currentValue.substring(0, maxCharQuantity);
+    return !isOverflow ? currentValue : currentValue.slice(0, maxCharQuantity);
   };
   const onContainerBlurHandler = (event) => {
     setFocused(false);
@@ -163,7 +162,7 @@ const HvTextArea = forwardRef(function HvTextArea2(props, ref) {
   }, [focused, isEmptyValue, performValidation]);
   const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && hasBuiltInValidations(
     required,
-    "none",
+    "text",
     minCharQuantity,
     // If blockMax is true maxCharQuantity will never produce an error
     // unless the value is controlled, so we can't prevent it to overflow maxCharQuantity

package/dist/esm/TimePicker/Placeholder.js

@@ -34,14 +34,14 @@ const Placeholder = forwardRef(
         ...others,
         children: [
           name && /* @__PURE__ */ jsx("input", { type: "hidden", name, value: getDateValue(value) }),
-          segments.map((segment, i) => /* @__PURE__ */ jsx(
+          segments.map((segment) => /* @__PURE__ */ jsx(
             PlaceholderSegment,
             {
               segment,
               state,
               placeholder: placeholders[segment.type]
             },
-            i
+            segment.type
           ))
         ]
       }

package/dist/esm/TimePicker/TimePicker.js

@@ -182,7 +182,7 @@ const HvTimePicker = forwardRef(
                 ]
               },
               ...otherDropdownProps,
-              children: /* @__PURE__ */ jsx("div", { ref: timeFieldRef, className: classes.timePopperContainer, children: state.segments.map((segment, i) => /* @__PURE__ */ jsx(
+              children: /* @__PURE__ */ jsx("div", { ref: timeFieldRef, className: classes.timePopperContainer, children: state.segments.map((segment) => /* @__PURE__ */ jsx(
                 Unit,
                 {
                   state,
@@ -194,7 +194,7 @@ const HvTimePicker = forwardRef(
                     state.setSegment(segment.type, Number(val));
                   }
                 },
-                i
+                segment.type
               )) })
             }
           ),

package/dist/esm/TreeView/TreeItem/TreeItem.js

@@ -70,7 +70,7 @@ const HvTreeItem = forwardRef(
       if (instance && label) {
         return instance.mapFirstChar(
           nodeId,
-          (contentRef.current?.textContent ?? "").substring(0, 1).toLowerCase()
+          (contentRef.current?.textContent ?? "").slice(0, 1).toLowerCase()
         );
       }
       return void 0;

package/dist/esm/TreeView/TreeItem/useHvTreeItem.js

@@ -1,9 +1,9 @@
-import * as React from "react";
+import { useContext } from "react";
 import { DescendantContext } from "../internals/DescendantProvider.js";
 import { useTreeViewContext } from "../internals/TreeViewProvider.js";
 function useHvTreeItem(nodeId) {
   const { instance, multiSelect } = useTreeViewContext();
-  const { level = 0 } = React.useContext(DescendantContext);
+  const { level = 0 } = useContext(DescendantContext);
   const expandable = instance ? instance.isNodeExpandable(nodeId) : false;
   const expanded = instance ? instance.isNodeExpanded(nodeId) : false;
   const focused = instance ? instance.isNodeFocused(nodeId) : false;

package/dist/esm/VerticalNavigation/TreeView/TreeViewItem.js

@@ -119,7 +119,7 @@ const HvVerticalNavigationTreeViewItem = forwardRef(
       if (mapFirstChar && unMapFirstChar && label && contentRef.current?.textContent) {
         mapFirstChar(
           nodeId,
-          contentRef.current?.textContent.substring(0, 1).toLowerCase()
+          contentRef.current?.textContent.slice(0, 1).toLowerCase()
         );
         return () => {
           unMapFirstChar(nodeId);
@@ -310,7 +310,7 @@ const HvVerticalNavigationTreeViewItem = forwardRef(
                       variant: "square",
                       size: "xs",
                       backgroundColor: "textSubtle",
-                      children: payload?.label?.substring(0, 1)
+                      children: payload?.label?.slice(0, 1)
                     }
                   ) : useIcons && icon,
                   hasChildren && !isOpen ? /* @__PURE__ */ jsx(HvIcon, { name: "Forwards", size: "xs", compact: true }) : hasAnyChildWithData && !isOpen && /* @__PURE__ */ jsx("div", {})

package/dist/esm/hooks/useForkRef.js

@@ -1,4 +1,4 @@
-import * as React from "react";
+import { useMemo } from "react";
 const setRef = (ref, value) => {
   if (typeof ref === "function") {
     ref(value);
@@ -7,7 +7,7 @@ const setRef = (ref, value) => {
   }
 };
 const useForkRef = (refA, refB) => {
-  return React.useMemo(() => {
+  return useMemo(() => {
     if (refA == null && refB == null) {
       return null;
     }

package/dist/esm/hooks/useImageLoaded.js

@@ -2,24 +2,18 @@ import { useState, useEffect } from "react";
 const useImageLoaded = (src, srcSet) => {
   const [imageLoaded, setImageLoaded] = useState(false);
   useEffect(() => {
-    if (!src && !srcSet) {
-      return void 0;
-    }
+    if (!src && !srcSet) return;
     setImageLoaded(false);
     let active = true;
     const image = new Image();
     image.src = src || "";
     image.srcset = srcSet || "";
     image.onload = () => {
-      if (!active) {
-        return;
-      }
+      if (!active) return;
       setImageLoaded("loaded");
     };
     image.onerror = () => {
-      if (!active) {
-        return;
-      }
+      if (!active) return;
       setImageLoaded("error");
     };
     return () => {

package/dist/esm/themes/pentahoPlus.js

@@ -49,7 +49,7 @@ const pentahoPlus = mergeTheme(pentahoPlus$1, {
           Object.entries(notificationMap).map(([variant, color]) => [
             variant,
             {
-              backgroundColor: theme.colors[`${color}Dimmed`],
+              backgroundColor: theme.mix(`${color}Dimmed`, 0.5, "dimmer"),
               "--icolor": theme.colors[color],
               "--outline": theme.colors[`${color}Border`],
               "--bg": theme.colors[`${color}Subtle`],

package/dist/types/index.d.ts

@@ -625,6 +625,19 @@ export declare type DeepPartial<T> = T extends {} ? Partial<{
     [P in keyof T]: DeepPartial<T[P]>;
 }> : T;
 
+declare const DEFAULT_ERROR_MESSAGES: {
+    /** The value when a validation fails. */
+    error: string;
+    /** The message that appears when there are too many characters. */
+    maxCharError: string;
+    /** The message that appears when there are too few characters. */
+    minCharError: string;
+    /** The message that appears when the input is empty and required. */
+    requiredError: string;
+    /** The message that appears when the input is value is incompatible with the expected type. */
+    typeMismatchError: string;
+};
+
 declare const DEFAULT_LABELS: {
     dropdownMenu: string;
 };
@@ -6749,11 +6762,7 @@ export { HvThemeContextValue }
 
 export declare type HvThemeCustomizationProps = HvExtraDeepPartialProps<Omit<HvThemeStructure, "colors" | "name" | "base">> & {
     colors?: {
-        modes?: {
-            [key: string]: Partial<HvThemeColorModeStructure> & {
-                [key: string]: string;
-            };
-        };
+        modes?: Record<string, Partial<HvThemeColorModeStructure> & Record<string, string>>;
     };
 };
 
@@ -7174,18 +7183,7 @@ export declare interface HvUseTableProps extends Omit<TableProps, "role">, UseHv
 export declare interface HvUseTableRowProps extends Omit<TableRowProps, "role">, UseHvTableStylesTableRowProps, UseHvRowSelectionTableRowProps, UseHvRowExpandTableRowProps, HvTableRowProps {
 }
 
-export declare interface HvValidationMessages {
-    /** The value when a validation fails. */
-    error?: string;
-    /** The message that appears when there are too many characters. */
-    maxCharError?: string;
-    /** The message that appears when there are too few characters. */
-    minCharError?: string;
-    /** The message that appears when the input is empty and required. */
-    requiredError?: string;
-    /** The message that appears when the input is value is incompatible with the expected type. */
-    typeMismatchError?: string;
-}
+export declare type HvValidationMessages = Partial<typeof DEFAULT_ERROR_MESSAGES>;
 
 /**
  * Use a vertical layout for global navigation on wide screens. treeview mode provides structured hierarchy but overrides standard keyboard navigation.
@@ -10628,9 +10626,9 @@ export declare function useHvTreeItem(nodeId: string): {
     expanded: boolean;
     selected: boolean;
     focused: boolean;
-    handleExpansion: (event: React_2.MouseEvent) => void;
-    handleSelection: (event: React_2.MouseEvent) => void;
-    preventSelection: (event: React_2.MouseEvent) => void;
+    handleExpansion: (event: React.MouseEvent) => void;
+    handleSelection: (event: React.MouseEvent) => void;
+    preventSelection: (event: React.MouseEvent) => void;
 };
 
 export declare const useImageLoaded: (src?: string, srcSet?: string) => string | boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/uikit-react-core",
-  "version": "5.96.2",
+  "version": "5.97.0",
   "private": false,
   "author": "Hitachi Vantara UI Kit Team",
   "description": "Core React components for the NEXT Design System.",
@@ -32,8 +32,8 @@
   "dependencies": {
     "@emotion/cache": "^11.11.0",
     "@emotion/serialize": "^1.1.2",
-    "@hitachivantara/uikit-react-shared": "^5.4.6",
-    "@hitachivantara/uikit-react-utils": "^0.2.39",
+    "@hitachivantara/uikit-react-shared": "^5.5.0",
+    "@hitachivantara/uikit-react-utils": "^0.2.40",
     "@hitachivantara/uikit-styles": "^5.48.2",
     "@internationalized/date": "^3.2.0",
     "@mui/base": "5.0.0-beta.68",
@@ -61,7 +61,7 @@
     "access": "public",
     "directory": "package"
   },
-  "gitHead": "7c14c1cfb05319faf3d647bb806d25655363cbc5",
+  "gitHead": "acfc9b4224682aaebdf1c171e80eb1bfc2632a47",
   "exports": {
     ".": {
       "types": "./dist/types/index.d.ts",