@hitachivantara/uikit-react-core 6.4.1 → 6.4.3

package/dist/AvatarGroup/AvatarGroupContext.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { useContext, createContext, useMemo } from "react";
+import { useContext, useMemo, createContext } from "react";
 const HvAvatarGroupContext = createContext(null);
 const HvAvatarGroupProvider = ({
   size,

package/dist/BaseCheckBox/CheckBoxIcon.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
-import { useDefaultProps, createClasses, mergeStyles } from "@hitachivantara/uikit-react-utils";
+import { useDefaultProps, mergeStyles, createClasses } from "@hitachivantara/uikit-react-utils";
 import { getColor, theme } from "@hitachivantara/uikit-styles";
 import { SvgBase } from "../icons.js";
 const { useClasses } = createClasses("HvCheckBoxIcon", {

package/dist/BaseRadio/RadioIcon.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { useDefaultProps, createClasses, mergeStyles } from "@hitachivantara/uikit-react-utils";
+import { useDefaultProps, mergeStyles, createClasses } from "@hitachivantara/uikit-react-utils";
 import { getColor, theme } from "@hitachivantara/uikit-styles";
 import { SvgBase } from "../icons.js";
 const { useClasses } = createClasses("HvRadioIcon", {

package/dist/Calendar/SingleCalendar/CalendarCell.js

@@ -82,6 +82,5 @@ const HvCalendarCell = (props) => {
 };
 export {
   HvCalendarCell,
-  staticClasses as calendarCellClasses,
-  HvCalendarCell as default
+  staticClasses as calendarCellClasses
 };

package/dist/Calendar/model.js

@@ -62,6 +62,5 @@ const generateCalendarModel = (seedValue, visibleMonth, visibleYear) => {
   return calendarModel;
 };
 export {
-  CalendarModel as default,
   generateCalendarModel
 };

package/dist/ColorPicker/Swatch.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { useDefaultProps, createClasses, mergeStyles } from "@hitachivantara/uikit-react-utils";
+import { useDefaultProps, mergeStyles, createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
 import { HvButtonBase } from "../ButtonBase/ButtonBase.js";
 const { useClasses } = createClasses("HvColorPickerSwatch", {

package/dist/Controls/context/ControlsContext.js

@@ -4,6 +4,5 @@ const HvControlsContextProvider = HvControlsContext.Provider;
 HvControlsContext.Consumer;
 export {
   HvControlsContext,
-  HvControlsContextProvider,
-  HvControlsContext as default
+  HvControlsContextProvider
 };

package/dist/DatePicker/DatePicker.js

@@ -17,8 +17,8 @@ import { getDateLabel } from "./utils.js";
 import { HvCalendar } from "../Calendar/Calendar.js";
 import { HvFormElement } from "../FormElement/FormElement.js";
 import { HvBaseDropdown } from "../BaseDropdown/BaseDropdown.js";
-import { isInvalid } from "../FormElement/utils.js";
 import { HvWarningText } from "../FormElement/WarningText/WarningText.js";
+import { isInvalid } from "../FormElement/utils.js";
 import { HvActionBar } from "../ActionBar/ActionBar.js";
 import { HvButton } from "../Button/Button.js";
 const DEFAULT_LABELS = {

package/dist/DatePicker/utils.js

@@ -1,4 +1,4 @@
-import { getFormattedDate, isDate, isSameMonth, getMonthName } from "../Calendar/utils.js";
+import { isDate, isSameMonth, getFormattedDate, getMonthName } from "../Calendar/utils.js";
 const validateDate = (date) => isDate(date) && date || /* @__PURE__ */ new Date();
 const getFormattedDateRange = (date, locale) => {
   const { startDate, endDate } = date;

package/dist/Dialog/context.js

@@ -1,4 +1,4 @@
-import { useContext, createContext } from "react";
+import { createContext, useContext } from "react";
 const DialogContext = createContext({ fullScreen: false });
 const useDialogContext = () => useContext(DialogContext);
 export {

package/dist/Dropdown/Dropdown.js

@@ -15,9 +15,9 @@ import { getSelectionLabel, getSelected } from "./utils.js";
 import { HvDropdownList } from "./List/List.js";
 import { HvFormElement } from "../FormElement/FormElement.js";
 import { HvBaseDropdown } from "../BaseDropdown/BaseDropdown.js";
-import { isInvalid } from "../FormElement/utils.js";
 import { HvWarningText } from "../FormElement/WarningText/WarningText.js";
 import { HvTypography } from "../Typography/Typography.js";
+import { isInvalid } from "../FormElement/utils.js";
 const DEFAULT_LABELS = {
   /** Label for overwrite the default header behavior. */
   select: void 0,

package/dist/Dropdown/List/List.js

@@ -9,9 +9,9 @@ import { useClasses } from "./List.styles.js";
 import { staticClasses } from "./List.styles.js";
 import { HvActionBar } from "../../ActionBar/ActionBar.js";
 import { HvList } from "../../List/List.js";
-import { HvButton } from "../../Button/Button.js";
 import { HvInput } from "../../Input/Input.js";
 import { HvCheckBox } from "../../CheckBox/CheckBox.js";
+import { HvButton } from "../../Button/Button.js";
 const clone = (values) => values.map((value) => ({ ...value }));
 const cleanHidden = (lst) => lst.map((item) => ({ ...item, isHidden: false }));
 const valuesExist = (values) => values != null && values?.length > 0;

package/dist/FilterGroup/FilterContent/FilterContent.js

@@ -1,11 +1,12 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { forwardRef, useState, useContext, useRef, useMemo } from "react";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { useDefaultProps, useTheme } from "@hitachivantara/uikit-react-utils";
 import { HvIcon } from "../../icons.js";
 import { setId } from "../../utils/setId.js";
 import { HvFilterGroupContext } from "../FilterGroupContext.js";
 import { useClasses } from "./FilterContent.styles.js";
 import { staticClasses } from "./FilterContent.styles.js";
+import { HvHeaderButton } from "./HeaderButton.js";
 import { HvFilterGroupLeftPanel } from "../LeftPanel/LeftPanel.js";
 import { HvFilterGroupRightPanel } from "../RightPanel/RightPanel.js";
 import { HvTypography } from "../../Typography/Typography.js";
@@ -32,11 +33,13 @@ const HvFilterGroupContent = forwardRef(function HvFilterGroupContent2(props, re
     height,
     leftEmptyElement,
     rightEmptyElement,
+    iconOnly,
     classes: classesProp,
     ...others
   } = useDefaultProps("HvFilterGroupContent", props);
-  const { classes } = useClasses(classesProp);
   const [filterGroupOpen, setFilterGroupOpen] = useState(false);
+  const { classes } = useClasses(classesProp);
+  const { activeTheme } = useTheme();
   const {
     defaultValue,
     filterValues,
@@ -90,13 +93,13 @@ const HvFilterGroupContent = forwardRef(function HvFilterGroupContent2(props, re
       disabled,
       disablePortal,
       variableWidth: true,
-      placement: horizontalPlacement,
       expanded: filterGroupOpen,
+      placement: horizontalPlacement,
       onToggle: handleToggle,
       onClickOutside: onCancelHandler,
       onContainerCreation: focusOnContainer,
-      placeholder: Header,
-      adornment: /* @__PURE__ */ jsx(HvFilterGroupCounter, {}),
+      placeholder: activeTheme?.name === "pentahoPlus" ? void 0 : Header,
+      adornment: activeTheme?.name === "pentahoPlus" ? void 0 : /* @__PURE__ */ jsx(HvFilterGroupCounter, {}),
       popperProps: {
         modifiers: [{ name: "preventOverflow", enabled: escapeWithReference }]
       },
@@ -106,6 +109,12 @@ const HvFilterGroupContent = forwardRef(function HvFilterGroupContent2(props, re
       "aria-invalid": status === "invalid" ? true : void 0,
       "aria-errormessage": status === "invalid" ? setId(id, "error") : void 0,
       "aria-describedby": [description && setId(id, "description"), ariaDescribedBy].join(" ").trim() || void 0,
+      ...activeTheme?.name === "pentahoPlus" && {
+        headerComponent: HvHeaderButton,
+        iconOnly,
+        title: labels?.placeholder,
+        count: filterValues?.flat().length ?? 0
+      },
       ...others,
       children: [
         /* @__PURE__ */ jsx("div", { ref: focusTarget, tabIndex: -1 }),

package/dist/FilterGroup/FilterContent/HeaderButton.js

@@ -0,0 +1,104 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { useDefaultProps, createClasses } from "@hitachivantara/uikit-react-utils";
+import { theme } from "@hitachivantara/uikit-styles";
+import { HvIcon } from "../../icons.js";
+import { HvBadge } from "../../Badge/Badge.js";
+import { HvIconButton } from "../../IconButton/IconButton.js";
+import { HvButton } from "../../Button/Button.js";
+import { HvTypography } from "../../Typography/Typography.js";
+const { useClasses } = createClasses("HvHeaderButton", {
+  iconOnly: {
+    "& > .HvBadge-badge": {
+      minWidth: "unset !important",
+      minHeight: "unset !important"
+    }
+  },
+  button: {
+    border: `1px solid ${theme.colors.primaryDimmed}`,
+    borderRadius: theme.radii.full
+  },
+  headerContent: {
+    display: "flex",
+    alignItems: "center",
+    gap: theme.space.xxs
+  },
+  badgeRoot: {
+    width: 0,
+    marginRight: theme.space.sm
+  },
+  badge: {
+    position: "relative"
+  },
+  badgeIconOnly: {
+    "&&>div:last-of-type": {
+      minWidth: "unset",
+      minHeight: "unset"
+    }
+  },
+  badgeIcon: {
+    minHeight: 0,
+    minWidth: 0
+  }
+});
+const HvHeaderButton = forwardRef((props, ref) => {
+  const {
+    onClick,
+    iconOnly,
+    count = 0,
+    disabled,
+    title = "Filter",
+    classes: classesProp,
+    ...others
+  } = useDefaultProps("HvHeaderButton", props);
+  const { classes } = useClasses(classesProp, false);
+  return iconOnly ? /* @__PURE__ */ jsx(
+    HvBadge,
+    {
+      ref,
+      label: count,
+      showCount: true,
+      className: classes.badgeIconOnly,
+      icon: /* @__PURE__ */ jsx(
+        HvIconButton,
+        {
+          onClick,
+          title,
+          disabled,
+          className: classes.button,
+          ...others,
+          children: /* @__PURE__ */ jsx(HvIcon, { name: "Filters" })
+        }
+      )
+    }
+  ) : /* @__PURE__ */ jsx(
+    HvButton,
+    {
+      ref,
+      disabled,
+      variant: "secondarySubtle",
+      onClick,
+      startIcon: /* @__PURE__ */ jsx(HvIcon, { name: "Filters" }),
+      ...others,
+      role: "combobox",
+      children: /* @__PURE__ */ jsxs("div", { className: classes.headerContent, children: [
+        /* @__PURE__ */ jsx(HvTypography, { variant: "label", children: title }),
+        /* @__PURE__ */ jsx(
+          HvBadge,
+          {
+            showCount: true,
+            label: count,
+            classes: {
+              root: classes.badgeRoot,
+              badge: classes.badge,
+              badgeIcon: classes.badgeIcon
+            }
+          }
+        )
+      ] })
+    }
+  );
+});
+export {
+  HvHeaderButton
+};

package/dist/FilterGroup/LeftPanel/LeftPanel.js

@@ -1,5 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { useContext } from "react";
+import { useTheme } from "@hitachivantara/uikit-react-utils";
+import { HvIcon } from "../../icons.js";
 import { HvFilterGroupContext } from "../FilterGroupContext.js";
 import { useClasses } from "./LeftPanel.styles.js";
 import { staticClasses } from "./LeftPanel.styles.js";
@@ -14,6 +16,7 @@ const HvFilterGroupLeftPanel = ({
   classes: classesProp
 }) => {
   const { classes } = useClasses(classesProp);
+  const { activeTheme } = useTheme();
   const { filterOptions, activeGroup, setActiveGroup } = useContext(HvFilterGroupContext);
   return /* @__PURE__ */ jsx(HvPanel, { className, children: filterOptions.length > 0 ? /* @__PURE__ */ jsx(HvListContainer, { condensed: true, interactive: true, children: filterOptions.map((group, index) => /* @__PURE__ */ jsx(
     HvListItem,
@@ -21,7 +24,7 @@ const HvFilterGroupLeftPanel = ({
       className: classes.listItem,
       onClick: () => setActiveGroup(index),
       selected: filterOptions[activeGroup].id === group.id,
-      endAdornment: /* @__PURE__ */ jsx(HvFilterGroupCounter, { groupId: group.id }),
+      endAdornment: activeTheme?.name === "pentahoPlus" ? /* @__PURE__ */ jsx(HvIcon, { name: "CaretRight" }) : /* @__PURE__ */ jsx(HvFilterGroupCounter, { groupId: group.id }),
       children: /* @__PURE__ */ jsx(HvOverflowTooltip, { data: group.name })
     },
     group.id || group.name

package/dist/Header/Header.styles.js

@@ -18,6 +18,7 @@ const { staticClasses, useClasses } = createClasses("HvHeader", {
     alignItems: "center",
     width: "100%",
     height: "100%",
+    position: "relative",
     padding: theme.spacing(0, "sm"),
     "& > *:not(nav)": {
       zIndex: 2

package/dist/IconContainer/IconContainer.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { createClasses, useDefaultProps, mergeStyles } from "@hitachivantara/uikit-react-utils";
+import { useDefaultProps, mergeStyles, createClasses } from "@hitachivantara/uikit-react-utils";
 import { getColor } from "@hitachivantara/uikit-styles";
 const { staticClasses, useClasses } = createClasses("HvIconContainer", {
   root: {

package/dist/OverflowTooltip/OverflowTooltip.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
+import { useState, useMemo } from "react";
 import { useResizeDetector } from "react-resize-detector";
 import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { useClasses } from "./OverflowTooltip.styles.js";
@@ -8,39 +8,31 @@ import { HvTooltip } from "../Tooltip/Tooltip.js";
 const isParagraph = (children = "") => /\s/.test(children);
 const HvOverflowTooltip = (props) => {
   const {
-    id,
     classes: classesProp,
     className,
     data,
-    open,
     paragraphOverflow,
-    placement = "top-start",
-    tooltipsProps
+    tooltipsProps,
+    ...others
   } = useDefaultProps("HvOverflowTooltip", props);
   const { classes, cx } = useClasses(classesProp);
-  const {
-    height = 0,
-    width = 0,
-    ref
-  } = useResizeDetector({
-    refreshMode: "debounce",
-    refreshOptions: {
-      trailing: true
-    },
-    handleHeight: false
-  });
+  const [isOverflowing, setIsOverflowing] = useState(false);
   const isParag = useMemo(
     () => paragraphOverflow && isParagraph(data?.toString()),
     [data, paragraphOverflow]
   );
-  const isOverflowing = useMemo(() => {
-    if (isParag) {
-      const scrollHeight = ref.current?.scrollHeight || 0;
-      return scrollHeight - height >= 1;
+  const { ref } = useResizeDetector({
+    refreshMode: "throttle",
+    disableRerender: true,
+    refreshRate: 100,
+    refreshOptions: { trailing: true, leading: true },
+    onResize({ width, height, entry }) {
+      const { scrollHeight = 0, scrollWidth = 0 } = entry?.target || {};
+      setIsOverflowing(
+        isParag ? scrollHeight - (height || 0) >= 1 : scrollWidth - (width || 0) >= 1
+      );
     }
-    const scrollWidth = ref.current?.scrollWidth || 0;
-    return scrollWidth - width >= 1;
-  }, [height, isParag, ref, width]);
+  });
   const content = useMemo(
     () => /* @__PURE__ */ jsx(
       "div",
@@ -69,15 +61,13 @@ const HvOverflowTooltip = (props) => {
   return /* @__PURE__ */ jsx(
     HvTooltip,
     {
-      id,
       disableHoverListener: !isOverflowing,
-      open,
-      placement,
       classes: { tooltip: classes.tooltipData },
       title: data,
       "aria-label": null,
       "aria-labelledby": null,
       ...tooltipsProps,
+      ...others,
       children: content
     }
   );

package/dist/QueryBuilder/utils/index.js

@@ -1,4 +1,4 @@
-import { uniqueId, isEqual } from "../../utils/helpers.js";
+import { isEqual, uniqueId } from "../../utils/helpers.js";
 const isBigList = (values) => values != null && values?.length > 10;
 const ID_PREFIX = "@hv_";
 const createId = () => uniqueId(ID_PREFIX);

package/dist/Radio/Radio.js

@@ -7,10 +7,10 @@ import { setId } from "../utils/setId.js";
 import { useClasses } from "./Radio.styles.js";
 import { staticClasses } from "./Radio.styles.js";
 import { HvBaseRadio } from "../BaseRadio/BaseRadio.js";
-import { isInvalid } from "../FormElement/utils.js";
 import { HvFormElement } from "../FormElement/FormElement.js";
 import { HvLabel } from "../FormElement/Label/Label.js";
 import { HvWarningText } from "../FormElement/WarningText/WarningText.js";
+import { isInvalid } from "../FormElement/utils.js";
 const HvRadio = forwardRef(
   function HvRadio2(props, ref) {
     const {

package/dist/Select/OptionGroup.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { OptionGroup } from "@mui/base";
-import { createClasses, useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { useDefaultProps, createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
 const { staticClasses, useClasses } = createClasses("HvOptionGroup", {
   root: {

package/dist/SnackbarProvider/SnackbarProvider.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
-import { useCallback, forwardRef, useMemo } from "react";
-import { useSnackbar, SnackbarProvider, SnackbarContent } from "notistack";
+import { useCallback, useMemo, forwardRef } from "react";
+import { SnackbarProvider, useSnackbar, SnackbarContent } from "notistack";
 import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { useClasses } from "./SnackbarProvider.styles.js";
 import { staticClasses } from "./SnackbarProvider.styles.js";

package/dist/Switch/Switch.js

@@ -9,8 +9,8 @@ import { staticClasses } from "./Switch.styles.js";
 import { HvBaseSwitch } from "../BaseSwitch/BaseSwitch.js";
 import { HvFormElement } from "../FormElement/FormElement.js";
 import { HvLabel } from "../FormElement/Label/Label.js";
-import { isInvalid } from "../FormElement/utils.js";
 import { HvWarningText } from "../FormElement/WarningText/WarningText.js";
+import { isInvalid } from "../FormElement/utils.js";
 const HvSwitch = forwardRef(
   function HvSwitch2(props, ref) {
     const {

package/dist/Table/TableHeader/TableHeader.js

@@ -7,7 +7,7 @@ import TableContext from "../TableContext.js";
 import { TableSectionContext } from "../TableSectionContext.js";
 import { useClasses } from "./TableHeader.styles.js";
 import { staticClasses } from "./TableHeader.styles.js";
-import { isParagraph, getSortIconName } from "./utils.js";
+import { getSortIconName, isParagraph } from "./utils.js";
 import { HvTypography } from "../../Typography/Typography.js";
 import { HvButtonBase } from "../../ButtonBase/ButtonBase.js";
 const defaultComponent = "th";

package/dist/Table/hooks/useHvRowSelection.js

@@ -35,6 +35,7 @@ const visibleColumnsHook = (columns) => {
     // this will only work when using useHvTableSticky
     // but ensures it stays left of any sticky column
     sticky: "left",
+    disableGlobalFilter: true,
     Cell: CellWithCheckBox
   };
   return [selectionColumn, ...columns];

package/dist/Table/renderers/renderers.js

@@ -1,4 +1,4 @@
-import { jsx, Fragment, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { ClassNames } from "@emotion/react";
 import { HvIcon } from "../../icons.js";
 import { setId } from "../../utils/setId.js";
@@ -7,8 +7,8 @@ import { HvDropdownColumnCell } from "./DropdownColumnCell.js";
 import { HvProgressColumnCell } from "./ProgressColumnCell.js";
 import { HvSwitchColumnCell } from "./SwitchColumnCell.js";
 import { HvTag } from "../../Tag/Tag.js";
-import { HvOverflowTooltip } from "../../OverflowTooltip/OverflowTooltip.js";
 import { HvButton } from "../../Button/Button.js";
+import { HvOverflowTooltip } from "../../OverflowTooltip/OverflowTooltip.js";
 const EM_DASH = "—";
 const hvStringFallback = (value) => {
   return typeof value === "string" && value !== "" ? value : EM_DASH;

package/dist/TextArea/TextArea.js

@@ -12,9 +12,9 @@ import { staticClasses } from "./TextArea.styles.js";
 import { HvFormElement } from "../FormElement/FormElement.js";
 import { HvCharCounter } from "../FormElement/CharCounter/CharCounter.js";
 import { HvBaseInput } from "../BaseInput/BaseInput.js";
-import { isInvalid } from "../FormElement/utils.js";
 import { HvWarningText } from "../FormElement/WarningText/WarningText.js";
 import { HvInfoMessage } from "../FormElement/InfoMessage/InfoMessage.js";
+import { isInvalid } from "../FormElement/utils.js";
 const HvTextArea = forwardRef(function HvTextArea2(props, ref) {
   const {
     id,

package/dist/TreeView/TreeItem/DefaultContent.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { createClasses, useCss } from "@hitachivantara/uikit-react-utils";
+import { useCss, createClasses } from "@hitachivantara/uikit-react-utils";
 import { useHvTreeItem } from "./useHvTreeItem.js";
 const { useClasses } = createClasses("HvTreeContent", {
   root: {},