@hitachivantara/uikit-react-core 5.81.1 → 5.82.0

package/dist/cjs/Accordion/Accordion.cjs

@@ -6,8 +6,8 @@ const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const useExpandable = require("../hooks/useExpandable.cjs");
 const Accordion_styles = require("./Accordion.styles.cjs");
-const ButtonBase = require("../ButtonBase/ButtonBase.cjs");
 const Typography = require("../Typography/Typography.cjs");
+const ButtonBase = require("../ButtonBase/ButtonBase.cjs");
 const HvAccordion = React.forwardRef(function HvAccordion2(props, ref) {
   const {
     id,
@@ -56,13 +56,7 @@ const HvAccordion = React.forwardRef(function HvAccordion2(props, ref) {
         onClick: handleClick,
         variant: labelVariant,
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            uikitReactIcons.DropUpXS,
-            {
-              color: "inherit",
-              style: { rotate: isOpen ? void 0 : "180deg" }
-            }
-          ),
+          /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropUpXS, { color: "inherit", rotate: !isOpen }),
           label
         ]
       }

package/dist/cjs/BaseInput/BaseInput.styles.cjs

@@ -46,24 +46,24 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvBaseInput
   invalid: {
     "&:not(.disabled)": {
       "& $inputBorderContainer": {
-        backgroundColor: uikitStyles.theme.colors.negative
+        backgroundColor: uikitStyles.theme.colors.negative_120
       },
       "&:hover $inputBorderContainer": {
-        backgroundColor: uikitStyles.theme.colors.negative
+        backgroundColor: uikitStyles.theme.colors.negative_120
       },
       "& $inputRootMultiline": {
         "& $input": {
-          border: `1px solid ${uikitStyles.theme.colors.negative}`
+          border: `1px solid ${uikitStyles.theme.colors.negative_120}`
         }
       },
       "&:hover $inputRootMultiline": {
         "& $input": {
-          border: `1px solid ${uikitStyles.theme.colors.negative}`
+          border: `1px solid ${uikitStyles.theme.colors.negative_120}`
         }
       },
       "&:focus-within $inputRootMultiline": {
         "& $input": {
-          border: `1px solid ${uikitStyles.theme.colors.negative}`
+          border: `1px solid ${uikitStyles.theme.colors.negative_120}`
         }
       }
     }
@@ -106,7 +106,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvBaseInput
     left: "2px",
     backgroundColor: uikitStyles.theme.colors.atmo4
   },
-  inputRootInvalid: { borderColor: uikitStyles.theme.colors.negative },
+  inputRootInvalid: { borderColor: uikitStyles.theme.colors.negative_120 },
   inputRootReadOnly: {
     borderColor: uikitStyles.theme.colors.secondary_60,
     backgroundColor: uikitStyles.theme.colors.atmo2

package/dist/cjs/Button/Button.cjs

@@ -85,7 +85,7 @@ const HvButton = generic.fixedForwardRef(function HvButton2(props, ref) {
         tabIndex: focusableWhenDisabled ? 0 : -1,
         "aria-disabled": true
       },
-      ...selected && { "aria-pressed": selected },
+      ...selected != null && { "aria-pressed": selected },
       ...others,
       children: [
         startIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: classes.startIcon, children: startIcon }),

package/dist/cjs/Button/Button.styles.cjs

@@ -4,9 +4,7 @@ const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const focusUtils = require("../utils/focusUtils.cjs");
 const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvButton", {
-  /**
-   * Classes applied to the root element
-   */
+  /** applied to the root element */
   root: {
     display: "inline-flex",
     alignItems: "center",
@@ -33,17 +31,20 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvButton",
     borderRadius: `var(--radius, ${uikitStyles.theme.radii.base})`,
     padding: uikitStyles.theme.spacing(0, "sm")
   },
+  /** applied to the _left_ icon container */
   startIcon: {
     marginLeft: uikitStyles.theme.spacing(-1),
     marginTop: -1,
     marginBottom: -1
   },
+  /** applied to the _right_ icon container */
   endIcon: {
     marginRight: uikitStyles.theme.spacing(-1),
     marginTop: -1,
     marginBottom: -1
   },
   focusVisible: {},
+  /** applied to the root element when disabled */
   disabled: {
     cursor: "not-allowed",
     color: uikitStyles.theme.colors.secondary_60,
@@ -54,6 +55,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvButton",
       borderColor: "transparent"
     }
   },
+  /** applied to the root element when is icon-only */
   icon: {
     margin: 0,
     padding: 0,
@@ -62,6 +64,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvButton",
       margin: -1
     }
   },
+  /** applied to the root element when using the `contained` variant */
   contained: {
     color: uikitStyles.theme.colors.atmo1,
     // `color-contrast(var(--color) vs ${colors.atmo1}, ${colors.base_light}, ${colors.base_dark})`,
@@ -75,10 +78,13 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvButton",
       }
     }
   },
+  /** applied to the root element when using the `subtle` variant */
   subtle: {
     borderColor: "currentcolor"
   },
+  /** applied to the root element when using the `ghost` variant */
   ghost: {},
+  /** applied to the root element when using the `semantic` variant */
   semantic: {
     color: uikitStyles.theme.colors.base_dark,
     backgroundColor: "transparent",

package/dist/cjs/Card/Card.cjs

@@ -5,7 +5,7 @@ const React = require("react");
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const Card_styles = require("./Card.styles.cjs");
-const HvCard = React.forwardRef((props) => {
+const HvCard = React.forwardRef((props, ref) => {
   const {
     classes: classesProp,
     style,
@@ -23,6 +23,7 @@ const HvCard = React.forwardRef((props) => {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
+      ref,
       style: uikitReactUtils.mergeStyles(style, {
         "--bg-color": uikitStyles.getColor(bgcolor),
         "--bar-height": `${selected ? 4 : 2}px`,

package/dist/cjs/CheckBox/CheckBox.styles.cjs

@@ -30,7 +30,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvCheckBox"
     }
   },
   invalidContainer: {
-    borderBottom: `1px solid ${uikitStyles.theme.colors.negative}`,
+    borderBottom: `1px solid ${uikitStyles.theme.colors.negative_120}`,
     "&:hover": {
       borderBottomLeftRadius: "0px",
       borderBottomRightRadius: "0px"
@@ -38,7 +38,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvCheckBox"
   },
   checkbox: { height: "32px" },
   invalidCheckbox: {
-    borderBottom: `1px solid ${uikitStyles.theme.colors.negative}`,
+    borderBottom: `1px solid ${uikitStyles.theme.colors.negative_120}`,
     borderBottomLeftRadius: "0px",
     borderBottomRightRadius: "0px"
   },

package/dist/cjs/CheckBoxGroup/CheckBoxGroup.styles.cjs

@@ -28,7 +28,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvCheckBoxG
   },
   invalid: {
     paddingBottom: uikitStyles.theme.space.xs,
-    borderBottom: `1px solid ${uikitStyles.theme.colors.negative}`
+    borderBottom: `1px solid ${uikitStyles.theme.colors.negative_120}`
   },
   selectAll: {},
   error: {}

package/dist/cjs/DatePicker/DatePicker.styles.cjs

@@ -26,9 +26,9 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvDatePicke
   },
   panel: {},
   dropdownHeaderInvalid: {
-    border: `1px solid ${uikitStyles.theme.colors.negative}`,
+    border: `1px solid ${uikitStyles.theme.colors.negative_120}`,
     "&:hover": {
-      border: `1px solid ${uikitStyles.theme.colors.negative}`
+      border: `1px solid ${uikitStyles.theme.colors.negative_120}`
     }
   },
   dropdownHeaderOpen: {},

package/dist/cjs/Dropdown/Dropdown.styles.cjs

@@ -28,7 +28,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvDropdown"
     width: "100%",
     borderRadius: uikitStyles.theme.radii.base,
     "& $dropdownHeaderInvalid": {
-      border: `1px solid ${uikitStyles.theme.colors.negative}`
+      border: `1px solid ${uikitStyles.theme.colors.negative_120}`
     }
   },
   arrow: {},

package/dist/cjs/DropdownButton/DropdownButton.cjs

@@ -20,7 +20,7 @@ const HvDropdownButton = React.forwardRef(function HvDropdownButton2(props, ref)
     ...others
   } = uikitReactUtils.useDefaultProps("HvDropdownButton", props);
   const { classes, cx } = DropdownButton_styles.useClasses(classesProp);
-  const endIcon = icon ? void 0 : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropDownXS, { iconSize: "XS", style: { rotate: open ? "180deg" : void 0 } });
+  const endIcon = icon ? void 0 : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropDownXS, { size: "XS", rotate: open });
   return /* @__PURE__ */ jsxRuntime.jsx(
     Button.HvButton,
     {

package/dist/cjs/Forms/Adornment/Adornment.cjs

@@ -2,13 +2,15 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const Adornment_styles = require("./Adornment.styles.cjs");
 const FormElementDescriptorsContext = require("../FormElement/context/FormElementDescriptorsContext.cjs");
+const ButtonBase = require("../../ButtonBase/ButtonBase.cjs");
 const FormElementContext = require("../FormElement/context/FormElementContext.cjs");
 const noop = () => {
 };
-const HvAdornment = React.forwardRef(
-  ({
+const HvAdornment = React.forwardRef((props, ref) => {
+  const {
     id,
     classes: classesProp,
     className,
@@ -17,59 +19,58 @@ const HvAdornment = React.forwardRef(
     onClick,
     isVisible = void 0,
     ...others
-  }, ref) => {
-    const { classes, cx } = Adornment_styles.useClasses(classesProp);
-    const { elementStatus = "", elementDisabled } = React.useContext(FormElementContext.HvFormElementContext);
-    const { input } = React.useContext(FormElementDescriptorsContext.HvFormElementDescriptorsContext);
-    const displayIcon = isVisible ?? (showWhen === void 0 || elementStatus === showWhen);
-    const isClickable = !!onClick;
-    return isClickable ? /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        id,
-        ref,
-        type: "button",
-        tabIndex: -1,
-        "aria-controls": input?.[0]?.id,
-        className: cx(
-          classes.root,
-          classes.adornment,
-          classes.adornmentButton,
-          {
-            [classes.hideIcon]: !displayIcon,
-            [classes.disabled]: elementDisabled
-          },
-          className
-        ),
-        onClick,
-        onMouseDown: (event) => event.preventDefault(),
-        onKeyDown: noop,
-        disabled: elementDisabled,
-        "aria-disabled": elementDisabled,
-        ...others,
-        children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.icon, children: icon })
-      }
-    ) : /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        id,
-        ref,
-        className: cx(
-          classes.root,
-          classes.adornment,
-          classes.adornmentIcon,
-          {
-            [classes.hideIcon]: !displayIcon,
-            [classes.disabled]: elementDisabled
-          },
-          className
-        ),
-        role: "presentation",
-        ...others,
-        children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.icon, children: icon })
-      }
-    );
-  }
-);
+  } = uikitReactUtils.useDefaultProps("HvAdornment", props);
+  const { classes, cx } = Adornment_styles.useClasses(classesProp);
+  const { elementStatus = "", elementDisabled } = React.useContext(FormElementContext.HvFormElementContext);
+  const { input } = React.useContext(FormElementDescriptorsContext.HvFormElementDescriptorsContext);
+  const displayIcon = isVisible ?? (showWhen === void 0 || elementStatus === showWhen);
+  const isClickable = !!onClick;
+  return isClickable ? /* @__PURE__ */ jsxRuntime.jsx(
+    ButtonBase.HvButtonBase,
+    {
+      id,
+      focusableWhenDisabled: true,
+      ref,
+      type: "button",
+      tabIndex: -1,
+      "aria-controls": input?.[0]?.id,
+      className: cx(
+        classes.root,
+        classes.adornment,
+        classes.adornmentButton,
+        {
+          [classes.hideIcon]: !displayIcon,
+          [classes.disabled]: elementDisabled
+        },
+        className
+      ),
+      onClick,
+      onMouseDown: (event) => event.preventDefault(),
+      onKeyDown: noop,
+      disabled: elementDisabled,
+      ...others,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.icon, children: icon })
+    }
+  ) : /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      id,
+      ref,
+      className: cx(
+        classes.root,
+        classes.adornment,
+        classes.adornmentIcon,
+        {
+          [classes.hideIcon]: !displayIcon,
+          [classes.disabled]: elementDisabled
+        },
+        className
+      ),
+      role: "presentation",
+      ...others,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.icon, children: icon })
+    }
+  );
+});
 exports.adornmentClasses = Adornment_styles.staticClasses;
 exports.HvAdornment = HvAdornment;

package/dist/cjs/Forms/Suggestions/Suggestions.cjs

@@ -24,6 +24,7 @@ const HvSuggestions = React.forwardRef((props, extRef) => {
     suggestionValues = [],
     onClose,
     onSuggestionSelected,
+    popperProps,
     ...others
   } = props;
   const { classes, cx } = Suggestions_styles.useClasses(classesProp);
@@ -64,6 +65,7 @@ const HvSuggestions = React.forwardRef((props, extRef) => {
               className: cx(classes.popper, {
                 [classes.portal]: enablePortal
               }),
+              ...popperProps,
               children: /* @__PURE__ */ jsxRuntime.jsx(
                 SelectionList.HvSelectionList,
                 {

package/dist/cjs/Forms/WarningText/WarningText.cjs

@@ -7,16 +7,15 @@ const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const setId = require("../../utils/setId.cjs");
 const WarningText_styles = require("./WarningText.styles.cjs");
 const FormElementContext = require("../FormElement/context/FormElementContext.cjs");
-const Typography = require("../../Typography/Typography.cjs");
 const HvWarningText = (props) => {
   const {
     children,
-    adornment,
-    isVisible,
+    adornment: adornmentProp,
+    isVisible: isVisibleProp,
     classes: classesProp,
     className,
-    id,
-    disabled,
+    id: idProp,
+    disabled: disabledProp,
     disableGutter = false,
     disableBorder = false,
     disableAdornment = false,
@@ -25,12 +24,11 @@ const HvWarningText = (props) => {
   } = uikitReactUtils.useDefaultProps("HvWarningText", props);
   const { classes, cx } = WarningText_styles.useClasses(classesProp);
   const { elementId, elementStatus, elementDisabled } = React.useContext(FormElementContext.HvFormElementContext);
-  const localDisabled = disabled || elementDisabled;
-  const localVisible = isVisible ?? elementStatus === "invalid";
-  const localId = id ?? setId.setId(elementId, "error");
-  const showWarning = localVisible && !localDisabled;
-  const content = showWarning ? children : "";
-  const localAdornment = adornment || /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Fail, { iconSize: "XS", className: classes.defaultIcon, color: "negative" });
+  const disabled = disabledProp || elementDisabled;
+  const visible = isVisibleProp ?? elementStatus === "invalid";
+  const id = idProp ?? setId.setId(elementId, "error");
+  const showWarning = visible && !disabled;
+  const adornment = adornmentProp || /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Fail, { size: "xs", className: classes.defaultIcon });
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -43,21 +41,20 @@ const HvWarningText = (props) => {
         className
       ),
       children: [
-        !disableAdornment && localAdornment,
+        !disableAdornment && adornment,
         /* @__PURE__ */ jsxRuntime.jsx(
-          Typography.HvTypography,
+          "span",
           {
-            id: localId,
+            id,
             className: cx(classes.warningText, {
               [classes.topGutter]: !disableGutter,
               [classes.hideText]: hideText
             }),
-            variant: "caption1",
             role: "status",
             "aria-live": "polite",
             "aria-relevant": "additions text",
             ...others,
-            children: showWarning && content
+            children: showWarning && children
           }
         )
       ]

package/dist/cjs/Forms/WarningText/WarningText.styles.cjs

@@ -3,10 +3,14 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvWarningText", {
-  root: { display: "none" },
+  root: {
+    display: "none",
+    color: uikitStyles.theme.colors.negative_120
+  },
   defaultIcon: { minWidth: "24px", width: "24px", height: "24px" },
   warningText: {
-    color: uikitStyles.theme.colors.negative_120,
+    ...uikitStyles.theme.typography.caption1,
+    color: "inherit",
     paddingRight: uikitStyles.theme.space.xs
   },
   show: { display: "flex" },
@@ -20,7 +24,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvWarningTe
     margin: 0,
     overflow: "hidden"
   },
-  topBorder: { borderTop: `solid 1px ${uikitStyles.theme.colors.negative}` }
+  topBorder: { borderTop: "1px solid currentcolor" }
 });
 exports.staticClasses = staticClasses;
 exports.useClasses = useClasses;

package/dist/cjs/Input/Input.cjs

@@ -485,7 +485,6 @@ const HvInput = React.forwardRef(function HvInput2(props, ref) {
           /* @__PURE__ */ jsxRuntime.jsx(
             Suggestions.HvSuggestions,
             {
-              ref: suggestionsRef,
               id: setId.setId(elementId, "suggestions"),
               classes: {
                 root: classes.suggestionsContainer,
@@ -497,7 +496,8 @@ const HvInput = React.forwardRef(function HvInput2(props, ref) {
               onKeyDown: onSuggestionKeyDown,
               onSuggestionSelected: suggestionSelectedHandler,
               suggestionValues,
-              enablePortal
+              enablePortal,
+              popperProps: { ref: suggestionsRef }
             }
           )
         ] }),

package/dist/cjs/Input/Input.styles.cjs

@@ -18,11 +18,9 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvInput", {
   },
   icon: { width: "30px", height: "30px" },
   adornmentButton: {
-    backgroundColor: "transparent",
-    border: "none",
-    padding: 0,
-    margin: 0,
-    cursor: "pointer"
+    ":focus-visible,:hover": {
+      backgroundColor: "transparent"
+    }
   },
   iconClear: { display: "none" },
   hasSuggestions: {},

package/dist/cjs/MultiButton/MultiButton.styles.cjs

@@ -17,11 +17,10 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvMultiButt
     borderRadius: uikitStyles.theme.radii.base,
     "& $button": {
       minWidth: 32,
-      minHeight: 32,
       width: "100%",
       maxWidth: 200,
       padding: 0,
-      flex: 1,
+      flex: "1 1 auto",
       borderColor: "inherit",
       borderRadius: 0,
       fontWeight: uikitStyles.theme.typography.body.fontWeight,

package/dist/cjs/Radio/Radio.styles.cjs

@@ -19,7 +19,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvRadio", {
     }
   },
   invalidContainer: {
-    borderBottom: `1px solid ${uikitStyles.theme.colors.negative}`,
+    borderBottom: `1px solid ${uikitStyles.theme.colors.negative_120}`,
     "&:hover": {
       borderBottomLeftRadius: "0px",
       borderBottomRightRadius: "0px"
@@ -37,7 +37,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvRadio", {
     }
   },
   invalidRadio: {
-    borderBottom: `1px solid ${uikitStyles.theme.colors.negative}`,
+    borderBottom: `1px solid ${uikitStyles.theme.colors.negative_120}`,
     "&:hover": {
       borderBottomLeftRadius: "0px",
       borderBottomRightRadius: "0px"

package/dist/cjs/RadioGroup/RadioGroup.styles.cjs

@@ -28,7 +28,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvRadioGrou
   },
   invalid: {
     paddingBottom: uikitStyles.theme.space.xs,
-    borderBottom: `1px solid ${uikitStyles.theme.colors.negative}`
+    borderBottom: `1px solid ${uikitStyles.theme.colors.negative_120}`
   },
   error: {}
 });

package/dist/cjs/Section/Section.cjs

@@ -54,7 +54,7 @@ const HvSection = React.forwardRef(
                 "aria-label": isOpen ? "Collapse" : "Expand",
                 ...buttonProps,
                 ...expandButtonProps,
-                children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Down, { style: { rotate: isOpen ? "180deg" : void 0 } })
+                children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Down, { rotate: isOpen })
               }
             ),
             title,

package/dist/cjs/Select/Select.styles.cjs

@@ -12,7 +12,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvSelect",
   disabled: {},
   readOnly: {},
   invalid: {
-    border: `1px solid ${uikitStyles.theme.colors.negative}`
+    border: `1px solid ${uikitStyles.theme.colors.negative_120}`
   },
   labelContainer: {
     display: "flex",

package/dist/cjs/SelectionList/SelectionList.styles.cjs

@@ -32,7 +32,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvSelection
       zIndex: 1
     }
   },
-  invalid: { borderBottom: `1px solid ${uikitStyles.theme.colors.negative}` }
+  invalid: { borderBottom: `1px solid ${uikitStyles.theme.colors.negative_120}` }
 });
 exports.staticClasses = staticClasses;
 exports.useClasses = useClasses;

package/dist/cjs/Switch/Switch.styles.cjs

@@ -19,7 +19,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvSwitch",
   },
   invalidSwitch: {
     paddingBottom: "1px",
-    borderBottom: `1px solid ${uikitStyles.theme.colors.negative}`
+    borderBottom: `1px solid ${uikitStyles.theme.colors.negative_120}`
   }
 });
 exports.staticClasses = staticClasses;

package/dist/cjs/Table/hooks/useRowExpand.cjs

@@ -24,7 +24,7 @@ const CellWithExpandButton = ({
         "aria-label": row.isExpanded ? labels.collapseRowButtonAriaLabel : labels.expandRowButtonAriaLabel,
         "aria-expanded": row.isExpanded,
         onClick: rowProps?.onClick,
-        children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropDownXS, { style: { rotate: row.isExpanded ? "180deg" : void 0 } })
+        children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropDownXS, { rotate: row.isExpanded })
       }
     ),
     cell?.value && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { variant: "label", component: "span", children: cell.value })

package/dist/cjs/TagsInput/TagsInput.styles.cjs

@@ -96,10 +96,10 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvTagsInput
       paddingTop: 0
     },
     "&$error": {
-      border: `1px solid ${uikitStyles.theme.colors.negative}`
+      border: `1px solid ${uikitStyles.theme.colors.negative_120}`
     },
     "&$invalid": {
-      border: `1px solid ${uikitStyles.theme.colors.negative}`
+      border: `1px solid ${uikitStyles.theme.colors.negative_120}`
     }
   },
   tagInputContainerRoot: {

package/dist/cjs/TimePicker/TimePicker.styles.cjs

@@ -25,9 +25,9 @@ const { useClasses, staticClasses } = uikitReactUtils.createClasses("HvTimePicke
   dropdownHeader: {},
   dropdownHeaderOpen: {},
   dropdownHeaderInvalid: {
-    border: `1px solid ${uikitStyles.theme.colors.negative}`,
+    border: `1px solid ${uikitStyles.theme.colors.negative_120}`,
     "&:hover": {
-      border: `1px solid ${uikitStyles.theme.colors.negative}`
+      border: `1px solid ${uikitStyles.theme.colors.negative_120}`
     }
   },
   dropdownPanel: {},