@hitachivantara/uikit-react-core 5.73.2 → 5.75.0

package/dist/esm/DatePicker/DatePicker.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.styles.js","sources":["../../../src/DatePicker/DatePicker.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvDatePicker\", {\n  root: {\n    position: \"relative\",\n  },\n  actionContainer: {\n    justifyContent: \"space-between\",\n  },\n  leftContainer: {},\n  rightContainer: {},\n\n  labelContainer: {\n    display: \"flex\",\n    alignItems: \"flex-start\",\n  },\n  label: {\n    paddingBottom: \"6px\",\n    display: \"block\",\n  },\n  description: {},\n  error: {},\n\n  dropdown: {\n    display: \"block\",\n  },\n  panel: {},\n\n  dropdownHeaderInvalid: {\n    border: `1px solid ${theme.colors.negative}`,\n    \"&:hover\": {\n      border: `1px solid ${theme.colors.negative}`,\n    },\n  },\n  dropdownHeaderOpen: {},\n  icon: {},\n  action: {\n    \"&:first-of-type\": {\n      marginRight: theme.space.xs,\n    },\n  },\n  inputText: {},\n  dateText: {\n    color: \"inherit\",\n    fontWeight: theme.typography.label.fontWeight,\n  },\n});\n"],"names":[],"mappings":";;AAGO,MAAM,EAAE,eAAe,eAAe,cAAc,gBAAgB;AAAA,EACzE,MAAM;AAAA,IACJ,UAAU;AAAA,EACZ;AAAA,EACA,iBAAiB;AAAA,IACf,gBAAgB;AAAA,EAClB;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,gBAAgB,CAAC;AAAA,EAEjB,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,IACL,eAAe;AAAA,IACf,SAAS;AAAA,EACX;AAAA,EACA,aAAa,CAAC;AAAA,EACd,OAAO,CAAC;AAAA,EAER,UAAU;AAAA,IACR,SAAS;AAAA,EACX;AAAA,EACA,OAAO,CAAC;AAAA,EAER,uBAAuB;AAAA,IACrB,QAAQ,aAAa,MAAM,OAAO,QAAQ;AAAA,IAC1C,WAAW;AAAA,MACT,QAAQ,aAAa,MAAM,OAAO,QAAQ;AAAA,IAC5C;AAAA,EACF;AAAA,EACA,oBAAoB,CAAC;AAAA,EACrB,MAAM,CAAC;AAAA,EACP,QAAQ;AAAA,IACN,mBAAmB;AAAA,MACjB,aAAa,MAAM,MAAM;AAAA,IAC3B;AAAA,EACF;AAAA,EACA,WAAW,CAAC;AAAA,EACZ,UAAU;AAAA,IACR,OAAO;AAAA,IACP,YAAY,MAAM,WAAW,MAAM;AAAA,EACrC;AACF,CAAC;"}
+{"version":3,"file":"DatePicker.styles.js","sources":["../../../src/DatePicker/DatePicker.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvDatePicker\", {\n  root: {\n    position: \"relative\",\n  },\n  actionContainer: {\n    justifyContent: \"space-between\",\n  },\n  leftContainer: {},\n  rightContainer: {},\n\n  labelContainer: {\n    display: \"flex\",\n    alignItems: \"flex-start\",\n  },\n  label: {\n    paddingBottom: \"6px\",\n    display: \"block\",\n  },\n  description: {},\n  error: {},\n\n  dropdown: {\n    display: \"block\",\n  },\n  panel: {},\n\n  dropdownHeaderInvalid: {\n    border: `1px solid ${theme.colors.negative}`,\n    \"&:hover\": {\n      border: `1px solid ${theme.colors.negative}`,\n    },\n  },\n  dropdownHeaderOpen: {},\n  icon: {},\n  action: {\n    \"&:first-of-type\": {\n      marginRight: theme.space.xs,\n    },\n  },\n  inputText: {},\n  dateText: {\n    color: \"inherit\",\n    fontWeight: theme.typography.label.fontWeight,\n  },\n  container: {},\n});\n"],"names":[],"mappings":";;AAGO,MAAM,EAAE,eAAe,eAAe,cAAc,gBAAgB;AAAA,EACzE,MAAM;AAAA,IACJ,UAAU;AAAA,EACZ;AAAA,EACA,iBAAiB;AAAA,IACf,gBAAgB;AAAA,EAClB;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,gBAAgB,CAAC;AAAA,EAEjB,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,IACL,eAAe;AAAA,IACf,SAAS;AAAA,EACX;AAAA,EACA,aAAa,CAAC;AAAA,EACd,OAAO,CAAC;AAAA,EAER,UAAU;AAAA,IACR,SAAS;AAAA,EACX;AAAA,EACA,OAAO,CAAC;AAAA,EAER,uBAAuB;AAAA,IACrB,QAAQ,aAAa,MAAM,OAAO,QAAQ;AAAA,IAC1C,WAAW;AAAA,MACT,QAAQ,aAAa,MAAM,OAAO,QAAQ;AAAA,IAC5C;AAAA,EACF;AAAA,EACA,oBAAoB,CAAC;AAAA,EACrB,MAAM,CAAC;AAAA,EACP,QAAQ;AAAA,IACN,mBAAmB;AAAA,MACjB,aAAa,MAAM,MAAM;AAAA,IAC3B;AAAA,EACF;AAAA,EACA,WAAW,CAAC;AAAA,EACZ,UAAU;AAAA,IACR,OAAO;AAAA,IACP,YAAY,MAAM,WAAW,MAAM;AAAA,EACrC;AAAA,EACA,WAAW,CAAC;AACd,CAAC;"}

package/dist/esm/InlineEditor/InlineEditor.js

@@ -1,8 +1,9 @@
 import { jsx } from "react/jsx-runtime";
-import { useState, useRef, useLayoutEffect } from "react";
+import { useState, useRef } from "react";
 import { Edit } from "@hitachivantara/uikit-react-icons";
 import { useDefaultProps, useTheme } from "@hitachivantara/uikit-react-utils";
 import { useControlled } from "../hooks/useControlled.js";
+import { useEnhancedEffect } from "../hooks/useEnhancedEffect.js";
 import { fixedForwardRef } from "../types/generic.js";
 import { isKey } from "../utils/keyboardUtils.js";
 import { useClasses } from "./InlineEditor.styles.js";
@@ -36,7 +37,7 @@ const HvInlineEditor = fixedForwardRef(function HvInlineEditor2(props, ref) {
   const { activeTheme } = useTheme();
   const typographyStyles = activeTheme?.typography[variant] || {};
   const { lineHeight } = typographyStyles;
-  useLayoutEffect(() => {
+  useEnhancedEffect(() => {
     const input = inputRef.current;
     if (editMode && input) {
       input.focus();

package/dist/esm/InlineEditor/InlineEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineEditor.js","sources":["../../../src/InlineEditor/InlineEditor.tsx"],"sourcesContent":["import React, { useLayoutEffect, useRef, useState } from \"react\";\nimport { Edit } from \"@hitachivantara/uikit-react-icons\";\nimport {\n  useDefaultProps,\n  useTheme,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvButton, HvButtonProps } from \"../Button\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { HvInput, HvInputProps } from \"../Input\";\nimport {\n  fixedForwardRef,\n  PolymorphicComponentRef,\n  PolymorphicRef,\n} from \"../types/generic\";\nimport {\n  HvTypography,\n  HvTypographyProps,\n  HvTypographyVariants,\n} from \"../Typography\";\nimport { isKey } from \"../utils/keyboardUtils\";\nimport { staticClasses, useClasses } from \"./InlineEditor.styles\";\n\nexport { staticClasses as inlineEditorClasses };\n\nexport type HvInlineEditorClasses = ExtractNames<typeof useClasses>;\n\nexport type HvInlineEditorProps<C extends React.ElementType = typeof HvInput> =\n  PolymorphicComponentRef<\n    C,\n    {\n      /** The value of the form element. */\n      value?: string;\n      /** The default value of the form element. */\n      defaultValue?: string;\n      /** Whether the Edit icon should always be visible */\n      showIcon?: boolean;\n      /** Variant of the HvTypography to display */\n      variant?: HvTypographyVariants;\n      /** Called when the input is blurred. */\n      onBlur?: (\n        event: React.FocusEvent<HTMLTextAreaElement | HTMLInputElement>,\n        value: string,\n      ) => void;\n      /** Called when the input value changes. */\n      onChange?: (event: React.SyntheticEvent, value: string) => void;\n      /** Props passed to the HvButton component */\n      buttonProps?: HvButtonProps;\n      /** Props passed to the HvTypography text component */\n      typographyProps?: HvTypographyProps;\n      /** Whether the editor is disabled or not. */\n      disabled?: boolean;\n      /** A Jss Object used to override or extend the styles applied to the empty state component. */\n      classes?: HvInlineEditorClasses;\n      /** The placeholder value of the input. */\n      placeholder?: string;\n    }\n  >;\n\n/**\n * An Inline Editor allows the user to edit a record without making a major switch\n * between viewing and editing, making it an efficient method of updating a record.\n */\nexport const HvInlineEditor = fixedForwardRef(function HvInlineEditor<\n  C extends React.ElementType = typeof HvInput,\n>(props: HvInlineEditorProps<C>, ref: PolymorphicRef<C>) {\n  const {\n    className,\n    classes: classesProp,\n    value: valueProp,\n    defaultValue = \"\",\n    showIcon,\n    component: InputComponent = HvInput,\n    variant = \"body\",\n    placeholder = \"Enter text\",\n    onBlur,\n    onChange,\n    onKeyDown,\n    buttonProps,\n    typographyProps,\n    disabled,\n    ...others\n  } = useDefaultProps(\"HvInlineEditor\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n  const [editMode, setEditMode] = useState(false);\n  const [cachedValue, setCachedValue] = useState(value);\n  const inputRef = useRef<HTMLInputElement>();\n  const { activeTheme } = useTheme();\n\n  const typographyStyles = activeTheme?.typography[variant] || {};\n  const { lineHeight } = typographyStyles;\n\n  useLayoutEffect(() => {\n    const input = inputRef.current;\n    if (editMode && input) {\n      input.focus();\n      input.select();\n    }\n  }, [editMode]);\n\n  const handleClick = () => {\n    setEditMode(true);\n    setCachedValue(value);\n  };\n\n  const handleBlur: HvInputProps[\"onBlur\"] = (event) => {\n    setEditMode(false);\n\n    const newValue = value || cachedValue; // empty values should be ignored\n    setValue(newValue);\n    onBlur?.(event, newValue);\n  };\n\n  const handleKeyDown: HvInputProps[\"onKeyDown\"] = (event) => {\n    if (isKey(event, \"Esc\")) {\n      setEditMode(false);\n      setValue(cachedValue);\n    }\n    onKeyDown?.(event as any);\n  };\n\n  const handleChange: HvInputProps[\"onChange\"] = (event, val) => {\n    setValue(val);\n    onChange?.(event, val);\n  };\n\n  return (\n    <div className={cx(classes.root, className)}>\n      {editMode && !disabled ? (\n        <InputComponent\n          ref={ref}\n          inputRef={inputRef}\n          classes={{\n            root: classes.inputRoot,\n            input: classes.input,\n            inputBorderContainer: classes.inputBorderContainer,\n          }}\n          inputProps={{\n            style: {\n              ...typographyStyles,\n              height: InputComponent === HvInput ? lineHeight : undefined,\n            },\n          }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          {...others}\n        />\n      ) : (\n        <HvButton\n          variant=\"secondaryGhost\"\n          overrideIconColors={false}\n          endIcon={\n            <Edit\n              color=\"secondary_60\"\n              className={cx(classes.icon, {\n                [classes.iconVisible]: showIcon,\n              })}\n            />\n          }\n          className={cx(classes.button, {\n            [classes.largeText]: parseInt(lineHeight as string, 10) >= 28,\n          })}\n          onClick={handleClick}\n          disabled={disabled}\n          {...buttonProps}\n        >\n          <HvTypography\n            variant={variant}\n            noWrap\n            className={cx(classes.text, { [classes.textEmpty]: !value })}\n            {...typographyProps}\n          >\n            {value || placeholder}\n          </HvTypography>\n        </HvButton>\n      )}\n    </div>\n  );\n});\n"],"names":["HvInlineEditor"],"mappings":"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"}
+{"version":3,"file":"InlineEditor.js","sources":["../../../src/InlineEditor/InlineEditor.tsx"],"sourcesContent":["import React, { useRef, useState } from \"react\";\nimport { Edit } from \"@hitachivantara/uikit-react-icons\";\nimport {\n  useDefaultProps,\n  useTheme,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvButton, HvButtonProps } from \"../Button\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useEnhancedEffect } from \"../hooks/useEnhancedEffect\";\nimport { HvInput, HvInputProps } from \"../Input\";\nimport {\n  fixedForwardRef,\n  PolymorphicComponentRef,\n  PolymorphicRef,\n} from \"../types/generic\";\nimport {\n  HvTypography,\n  HvTypographyProps,\n  HvTypographyVariants,\n} from \"../Typography\";\nimport { isKey } from \"../utils/keyboardUtils\";\nimport { staticClasses, useClasses } from \"./InlineEditor.styles\";\n\nexport { staticClasses as inlineEditorClasses };\n\nexport type HvInlineEditorClasses = ExtractNames<typeof useClasses>;\n\nexport type HvInlineEditorProps<C extends React.ElementType = typeof HvInput> =\n  PolymorphicComponentRef<\n    C,\n    {\n      /** The value of the form element. */\n      value?: string;\n      /** The default value of the form element. */\n      defaultValue?: string;\n      /** Whether the Edit icon should always be visible */\n      showIcon?: boolean;\n      /** Variant of the HvTypography to display */\n      variant?: HvTypographyVariants;\n      /** Called when the input is blurred. */\n      onBlur?: (\n        event: React.FocusEvent<HTMLTextAreaElement | HTMLInputElement>,\n        value: string,\n      ) => void;\n      /** Called when the input value changes. */\n      onChange?: (event: React.SyntheticEvent, value: string) => void;\n      /** Props passed to the HvButton component */\n      buttonProps?: HvButtonProps;\n      /** Props passed to the HvTypography text component */\n      typographyProps?: HvTypographyProps;\n      /** Whether the editor is disabled or not. */\n      disabled?: boolean;\n      /** A Jss Object used to override or extend the styles applied to the empty state component. */\n      classes?: HvInlineEditorClasses;\n      /** The placeholder value of the input. */\n      placeholder?: string;\n    }\n  >;\n\n/**\n * An Inline Editor allows the user to edit a record without making a major switch\n * between viewing and editing, making it an efficient method of updating a record.\n */\nexport const HvInlineEditor = fixedForwardRef(function HvInlineEditor<\n  C extends React.ElementType = typeof HvInput,\n>(props: HvInlineEditorProps<C>, ref: PolymorphicRef<C>) {\n  const {\n    className,\n    classes: classesProp,\n    value: valueProp,\n    defaultValue = \"\",\n    showIcon,\n    component: InputComponent = HvInput,\n    variant = \"body\",\n    placeholder = \"Enter text\",\n    onBlur,\n    onChange,\n    onKeyDown,\n    buttonProps,\n    typographyProps,\n    disabled,\n    ...others\n  } = useDefaultProps(\"HvInlineEditor\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n  const [editMode, setEditMode] = useState(false);\n  const [cachedValue, setCachedValue] = useState(value);\n  const inputRef = useRef<HTMLInputElement>();\n  const { activeTheme } = useTheme();\n\n  const typographyStyles = activeTheme?.typography[variant] || {};\n  const { lineHeight } = typographyStyles;\n\n  useEnhancedEffect(() => {\n    const input = inputRef.current;\n    if (editMode && input) {\n      input.focus();\n      input.select();\n    }\n  }, [editMode]);\n\n  const handleClick = () => {\n    setEditMode(true);\n    setCachedValue(value);\n  };\n\n  const handleBlur: HvInputProps[\"onBlur\"] = (event) => {\n    setEditMode(false);\n\n    const newValue = value || cachedValue; // empty values should be ignored\n    setValue(newValue);\n    onBlur?.(event, newValue);\n  };\n\n  const handleKeyDown: HvInputProps[\"onKeyDown\"] = (event) => {\n    if (isKey(event, \"Esc\")) {\n      setEditMode(false);\n      setValue(cachedValue);\n    }\n    onKeyDown?.(event as any);\n  };\n\n  const handleChange: HvInputProps[\"onChange\"] = (event, val) => {\n    setValue(val);\n    onChange?.(event, val);\n  };\n\n  return (\n    <div className={cx(classes.root, className)}>\n      {editMode && !disabled ? (\n        <InputComponent\n          ref={ref}\n          inputRef={inputRef}\n          classes={{\n            root: classes.inputRoot,\n            input: classes.input,\n            inputBorderContainer: classes.inputBorderContainer,\n          }}\n          inputProps={{\n            style: {\n              ...typographyStyles,\n              height: InputComponent === HvInput ? lineHeight : undefined,\n            },\n          }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          {...others}\n        />\n      ) : (\n        <HvButton\n          variant=\"secondaryGhost\"\n          overrideIconColors={false}\n          endIcon={\n            <Edit\n              color=\"secondary_60\"\n              className={cx(classes.icon, {\n                [classes.iconVisible]: showIcon,\n              })}\n            />\n          }\n          className={cx(classes.button, {\n            [classes.largeText]: parseInt(lineHeight as string, 10) >= 28,\n          })}\n          onClick={handleClick}\n          disabled={disabled}\n          {...buttonProps}\n        >\n          <HvTypography\n            variant={variant}\n            noWrap\n            className={cx(classes.text, { [classes.textEmpty]: !value })}\n            {...typographyProps}\n          >\n            {value || placeholder}\n          </HvTypography>\n        </HvButton>\n      )}\n    </div>\n  );\n});\n"],"names":["HvInlineEditor"],"mappings":"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"}

package/dist/esm/Loading/Loading.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { useDefaultProps, mergeStyles } from "@hitachivantara/uikit-react-utils";
 import { getColor } from "@hitachivantara/uikit-styles";
 import { range } from "../utils/helpers.js";
 import { useClasses } from "./Loading.styles.js";
@@ -12,20 +12,21 @@ const HvLoading = (props) => {
     small,
     label,
     classes: classesProp,
+    style,
     className,
     ...others
   } = useDefaultProps("HvLoading", props);
   const { classes, cx } = useClasses(classesProp);
   const size = small ? "small" : "regular";
-  const colorVariant = color ? "Color" : "";
-  const variant = `${size}${colorVariant}`;
-  const inline = {
-    backgroundColor: getColor(color, small ? "secondary" : "brand")
-  };
+  const colorVariant = color && `${size}Color`;
   return /* @__PURE__ */ jsxs(
     "div",
     {
       hidden: !!hidden,
+      style: mergeStyles(style, {
+        color: getColor(color, small ? "secondary" : "brand"),
+        "--customColor": getColor(color)
+      }),
       className: cx(
         classes.root,
         {
@@ -38,8 +39,12 @@ const HvLoading = (props) => {
         /* @__PURE__ */ jsx("div", { className: classes.barContainer, children: range(3).map((e) => /* @__PURE__ */ jsx(
           "div",
           {
-            style: inline,
-            className: cx(classes.loadingBar, classes[variant])
+            className: cx(
+              classes.loadingBar,
+              // TODO: hoist to parent & remove unused `colorVariant` in v6
+              classes[size],
+              classes[colorVariant]
+            )
           },
           e
         )) }),

package/dist/esm/Loading/Loading.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loading.js","sources":["../../../src/Loading/Loading.tsx"],"sourcesContent":["import {\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\nimport { getColor, HvColorAny } from \"@hitachivantara/uikit-styles\";\n\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTypography } from \"../Typography\";\nimport { range } from \"../utils/helpers\";\nimport { staticClasses, useClasses } from \"./Loading.styles\";\n\nexport { staticClasses as loadingClasses };\n\nexport type HvLoadingClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingProps extends HvBaseProps {\n  /** Indicates if the component should be render in a small size. */\n  small?: boolean;\n  /** The label to be displayed.  */\n  label?: React.ReactNode;\n  /** Whether the loading animation is hidden. */\n  hidden?: boolean;\n  /** Color applied to the bars. */\n  color?: HvColorAny;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvLoadingClasses;\n}\n\n/**\n * Loading provides feedback about a process that is taking place in the application.\n */\nexport const HvLoading = (props: HvLoadingProps) => {\n  const {\n    color,\n    hidden,\n    small,\n    label,\n    classes: classesProp,\n    className,\n    ...others\n  } = useDefaultProps(\"HvLoading\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const size = small ? \"small\" : \"regular\";\n  const colorVariant = color ? \"Color\" : \"\";\n  const variant = `${size}${colorVariant}` as const;\n\n  const inline = {\n    backgroundColor: getColor(color, small ? \"secondary\" : \"brand\"),\n  };\n  return (\n    <div\n      hidden={!!hidden}\n      className={cx(\n        classes.root,\n        {\n          [classes.hidden]: hidden,\n        },\n        className,\n      )}\n      {...others}\n    >\n      <div className={classes.barContainer}>\n        {range(3).map((e) => (\n          <div\n            key={e}\n            style={inline}\n            className={cx(classes.loadingBar, classes[variant])}\n          />\n        ))}\n      </div>\n      {label && (\n        <HvTypography variant=\"caption1\" className={classes.label}>\n          {label}\n        </HvTypography>\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AA+Ba,MAAA,YAAY,CAAC,UAA0B;AAC5C,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,aAAa,KAAK;AAEtC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,OAAO,QAAQ,UAAU;AACzB,QAAA,eAAe,QAAQ,UAAU;AACvC,QAAM,UAAU,GAAG,IAAI,GAAG,YAAY;AAEtC,QAAM,SAAS;AAAA,IACb,iBAAiB,SAAS,OAAO,QAAQ,cAAc,OAAO;AAAA,EAAA;AAG9D,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,QAAQ,CAAC,CAAC;AAAA,MACV,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,MAAM,GAAG;AAAA,QACpB;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAC,oBAAA,OAAA,EAAI,WAAW,QAAQ,cACrB,gBAAM,CAAC,EAAE,IAAI,CAAC,MACb;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,OAAO;AAAA,YACP,WAAW,GAAG,QAAQ,YAAY,QAAQ,OAAO,CAAC;AAAA,UAAA;AAAA,UAF7C;AAAA,QAIR,CAAA,GACH;AAAA,QACC,6BACE,cAAa,EAAA,SAAQ,YAAW,WAAW,QAAQ,OACjD,UACH,MAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"Loading.js","sources":["../../../src/Loading/Loading.tsx"],"sourcesContent":["import {\n  mergeStyles,\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\nimport { getColor, HvColorAny } from \"@hitachivantara/uikit-styles\";\n\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTypography } from \"../Typography\";\nimport { range } from \"../utils/helpers\";\nimport { staticClasses, useClasses } from \"./Loading.styles\";\n\nexport { staticClasses as loadingClasses };\n\nexport type HvLoadingClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingProps extends HvBaseProps {\n  /** Indicates if the component should be render in a small size. */\n  small?: boolean;\n  /** The label to be displayed.  */\n  label?: React.ReactNode;\n  /** Whether the loading animation is hidden. */\n  hidden?: boolean;\n  /** Color applied to the bars. */\n  color?: HvColorAny;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvLoadingClasses;\n}\n\n/**\n * Loading provides feedback about a process that is taking place in the application.\n */\nexport const HvLoading = (props: HvLoadingProps) => {\n  const {\n    color,\n    hidden,\n    small,\n    label,\n    classes: classesProp,\n    style,\n    className,\n    ...others\n  } = useDefaultProps(\"HvLoading\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const size = small ? \"small\" : \"regular\";\n  const colorVariant = color && (`${size}Color` as const);\n\n  return (\n    <div\n      hidden={!!hidden}\n      style={mergeStyles(style, {\n        color: getColor(color, small ? \"secondary\" : \"brand\"),\n        \"--customColor\": getColor(color),\n      })}\n      className={cx(\n        classes.root,\n        {\n          [classes.hidden]: hidden,\n        },\n        className,\n      )}\n      {...others}\n    >\n      <div className={classes.barContainer}>\n        {range(3).map((e) => (\n          <div\n            key={e}\n            className={cx(\n              classes.loadingBar,\n              // TODO: hoist to parent & remove unused `colorVariant` in v6\n              classes[size],\n              classes[colorVariant!],\n            )}\n          />\n        ))}\n      </div>\n      {label && (\n        <HvTypography variant=\"caption1\" className={classes.label}>\n          {label}\n        </HvTypography>\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAgCa,MAAA,YAAY,CAAC,UAA0B;AAC5C,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,aAAa,KAAK;AAEtC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,OAAO,QAAQ,UAAU;AACzB,QAAA,eAAe,SAAU,GAAG,IAAI;AAGpC,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,QAAQ,CAAC,CAAC;AAAA,MACV,OAAO,YAAY,OAAO;AAAA,QACxB,OAAO,SAAS,OAAO,QAAQ,cAAc,OAAO;AAAA,QACpD,iBAAiB,SAAS,KAAK;AAAA,MAAA,CAChC;AAAA,MACD,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,MAAM,GAAG;AAAA,QACpB;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAC,oBAAA,OAAA,EAAI,WAAW,QAAQ,cACrB,gBAAM,CAAC,EAAE,IAAI,CAAC,MACb;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,WAAW;AAAA,cACT,QAAQ;AAAA;AAAA,cAER,QAAQ,IAAI;AAAA,cACZ,QAAQ,YAAa;AAAA,YACvB;AAAA,UAAA;AAAA,UANK;AAAA,QAQR,CAAA,GACH;AAAA,QACC,6BACE,cAAa,EAAA,SAAQ,YAAW,WAAW,QAAQ,OACjD,UACH,MAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/esm/Loading/Loading.styles.js

@@ -1,102 +1,53 @@
-import { keyframes } from "@emotion/react";
 import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const interval = 0.11;
-const bars = {
-  "&:nth-of-type(1)": {
-    animationDelay: "0"
-  },
-  "&:nth-of-type(2)": {
-    animationDelay: `${interval * 2}s`
-  },
-  "&:nth-of-type(3)": {
-    animationDelay: `${interval * 4}s`
-  }
-};
-const small = {
-  width: "2px",
-  height: "18px",
-  margin: "0px 2px",
-  ...bars
-};
-const regular = {
-  width: "4px",
-  height: "30px",
-  margin: "0 3px",
-  ...bars
-};
-const regularAnimation = keyframes`
-  0% { 
-    transform: scale(1);
-    background-color: ${theme.colors.brand};
-  }
-  50% { 
-    transform: scale(1, 0.6); 
-    background-color: ${theme.colors.secondary};
-  }
-`;
-const regularColorAnimation = keyframes`
-  0% { 
-    transform: scale(1);
-  }
-  50% { 
-    transform: scale(1, 0.6); 
-  }
-`;
-const smallAnimation = keyframes`
-  0% { 
-    transform: scale(1);
-  }
-  50% { 
-    transform: scale(1, 0.223); 
-  }
-  100%: {},
-`;
-const smallColorAnimation = keyframes`
-  0% { 
-    transform: scale(1);
-  }
-  50% { 
-    transform: scale(1, 0.223); 
-  }
-`;
 const { staticClasses, useClasses } = createClasses("HvLoading", {
   root: {
     display: "flex",
     flexDirection: "column",
     alignItems: "center",
-    justifyContent: "center"
+    justifyContent: "center",
+    gap: theme.space.xs
+  },
+  barContainer: {
+    display: "flex",
+    justifyContent: "space-around",
+    ":has($regular)": {
+      width: 30,
+      height: 30
+    },
+    ":has($small)": {
+      "--scaleY": "0.223",
+      width: 18,
+      height: 18
+    }
   },
-  barContainer: { display: "flex" },
   loadingBar: {
+    backgroundColor: "currentcolor",
     display: "inline-block",
-    "@keyframes loading-small": {
-      "0%": {
-        transform: "scale(1)"
-      },
+    animation: "loading 1s ease-in-out infinite",
+    // TODO: make this the default when it has better support
+    width: "round(up, 0.11em, 2px)",
+    "@keyframes loading": {
       "50%": {
-        transform: "scale(1,0.223)"
-      },
-      "100%": {}
-    }
+        transform: "scale(1, var(--scaleY, 0.6))",
+        backgroundColor: `var(--customColor, ${theme.colors.secondary})`
+      }
+    },
+    ":nth-of-type(2)": { animationDelay: "0.22s" },
+    ":nth-of-type(3)": { animationDelay: "0.44s" }
   },
-  label: { marginTop: "15px" },
+  label: {},
   overlay: {},
   blur: {},
   hidden: { display: "none" },
-  small: { animation: `${smallAnimation} 1s ease-in-out infinite`, ...small },
-  regular: {
-    animation: `${regularAnimation} 1s ease-in-out infinite`,
-    ...regular
+  small: {
+    width: 2
   },
-  smallColor: {
-    animation: `${smallColorAnimation} 1s ease-in-out infinite`,
-    ...small
+  regular: {
+    width: 4
   },
-  regularColor: {
-    animation: `${regularColorAnimation} 1s ease-in-out infinite`,
-    ...regular
-  }
+  smallColor: {},
+  regularColor: {}
 });
 export {
   staticClasses,

package/dist/esm/Loading/Loading.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loading.styles.js","sources":["../../../src/Loading/Loading.styles.tsx"],"sourcesContent":["import { keyframes } from \"@emotion/react\";\nimport { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nconst interval = 0.11;\n\nconst bars = {\n  \"&:nth-of-type(1)\": {\n    animationDelay: \"0\",\n  },\n  \"&:nth-of-type(2)\": {\n    animationDelay: `${interval * 2}s`,\n  },\n  \"&:nth-of-type(3)\": {\n    animationDelay: `${interval * 4}s`,\n  },\n};\n\nconst small = {\n  width: \"2px\",\n  height: \"18px\",\n  margin: \"0px 2px\",\n  ...bars,\n};\n\nconst regular = {\n  width: \"4px\",\n  height: \"30px\",\n  margin: \"0 3px\",\n  ...bars,\n};\n\nconst regularAnimation = keyframes`\n  0% { \n    transform: scale(1);\n    background-color: ${theme.colors.brand};\n  }\n  50% { \n    transform: scale(1, 0.6); \n    background-color: ${theme.colors.secondary};\n  }\n`;\n\nconst regularColorAnimation = keyframes`\n  0% { \n    transform: scale(1);\n  }\n  50% { \n    transform: scale(1, 0.6); \n  }\n`;\n\nconst smallAnimation = keyframes`\n  0% { \n    transform: scale(1);\n  }\n  50% { \n    transform: scale(1, 0.223); \n  }\n  100%: {},\n`;\n\nconst smallColorAnimation = keyframes`\n  0% { \n    transform: scale(1);\n  }\n  50% { \n    transform: scale(1, 0.223); \n  }\n`;\n\nexport const { staticClasses, useClasses } = createClasses(\"HvLoading\", {\n  root: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n  },\n  barContainer: { display: \"flex\" },\n  loadingBar: {\n    display: \"inline-block\",\n\n    \"@keyframes loading-small\": {\n      \"0%\": {\n        transform: \"scale(1)\",\n      },\n      \"50%\": {\n        transform: \"scale(1,0.223)\",\n      },\n      \"100%\": {},\n    },\n  },\n  label: { marginTop: \"15px\" },\n  overlay: {},\n  blur: {},\n  hidden: { display: \"none\" },\n  small: { animation: `${smallAnimation} 1s ease-in-out infinite`, ...small },\n  regular: {\n    animation: `${regularAnimation} 1s ease-in-out infinite`,\n    ...regular,\n  },\n  smallColor: {\n    animation: `${smallColorAnimation} 1s ease-in-out infinite`,\n    ...small,\n  },\n  regularColor: {\n    animation: `${regularColorAnimation} 1s ease-in-out infinite`,\n    ...regular,\n  },\n});\n"],"names":[],"mappings":";;;AAIA,MAAM,WAAW;AAEjB,MAAM,OAAO;AAAA,EACX,oBAAoB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,oBAAoB;AAAA,IAClB,gBAAgB,GAAG,WAAW,CAAC;AAAA,EACjC;AAAA,EACA,oBAAoB;AAAA,IAClB,gBAAgB,GAAG,WAAW,CAAC;AAAA,EACjC;AACF;AAEA,MAAM,QAAQ;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,GAAG;AACL;AAEA,MAAM,UAAU;AAAA,EACd,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,GAAG;AACL;AAEA,MAAM,mBAAmB;AAAA;AAAA;AAAA,wBAGD,MAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA,wBAIlB,MAAM,OAAO,SAAS;AAAA;AAAA;AAI9C,MAAM,wBAAwB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS9B,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUvB,MAAM,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASrB,MAAM,EAAE,eAAe,eAAe,cAAc,aAAa;AAAA,EACtE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,gBAAgB;AAAA,EAClB;AAAA,EACA,cAAc,EAAE,SAAS,OAAO;AAAA,EAChC,YAAY;AAAA,IACV,SAAS;AAAA,IAET,4BAA4B;AAAA,MAC1B,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,MACA,OAAO;AAAA,QACL,WAAW;AAAA,MACb;AAAA,MACA,QAAQ,CAAC;AAAA,IACX;AAAA,EACF;AAAA,EACA,OAAO,EAAE,WAAW,OAAO;AAAA,EAC3B,SAAS,CAAC;AAAA,EACV,MAAM,CAAC;AAAA,EACP,QAAQ,EAAE,SAAS,OAAO;AAAA,EAC1B,OAAO,EAAE,WAAW,GAAG,cAAc,4BAA4B,GAAG,MAAM;AAAA,EAC1E,SAAS;AAAA,IACP,WAAW,GAAG,gBAAgB;AAAA,IAC9B,GAAG;AAAA,EACL;AAAA,EACA,YAAY;AAAA,IACV,WAAW,GAAG,mBAAmB;AAAA,IACjC,GAAG;AAAA,EACL;AAAA,EACA,cAAc;AAAA,IACZ,WAAW,GAAG,qBAAqB;AAAA,IACnC,GAAG;AAAA,EACL;AACF,CAAC;"}
+{"version":3,"file":"Loading.styles.js","sources":["../../../src/Loading/Loading.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvLoading\", {\n  root: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    gap: theme.space.xs,\n  },\n  barContainer: {\n    display: \"flex\",\n    justifyContent: \"space-around\",\n\n    \":has($regular)\": {\n      width: 30,\n      height: 30,\n    },\n\n    \":has($small)\": {\n      \"--scaleY\": \"0.223\",\n      width: 18,\n      height: 18,\n    },\n  },\n  loadingBar: {\n    backgroundColor: \"currentcolor\",\n    display: \"inline-block\",\n    animation: \"loading 1s ease-in-out infinite\",\n    // TODO: make this the default when it has better support\n    width: \"round(up, 0.11em, 2px)\",\n\n    \"@keyframes loading\": {\n      \"50%\": {\n        transform: \"scale(1, var(--scaleY, 0.6))\",\n        backgroundColor: `var(--customColor, ${theme.colors.secondary})`,\n      },\n    },\n\n    \":nth-of-type(2)\": { animationDelay: \"0.22s\" },\n    \":nth-of-type(3)\": { animationDelay: \"0.44s\" },\n  },\n  label: {},\n  overlay: {},\n  blur: {},\n  hidden: { display: \"none\" },\n  small: {\n    width: 2,\n  },\n  regular: {\n    width: 4,\n  },\n  smallColor: {},\n  regularColor: {},\n});\n"],"names":[],"mappings":";;AAGO,MAAM,EAAE,eAAe,eAAe,cAAc,aAAa;AAAA,EACtE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,KAAK,MAAM,MAAM;AAAA,EACnB;AAAA,EACA,cAAc;AAAA,IACZ,SAAS;AAAA,IACT,gBAAgB;AAAA,IAEhB,kBAAkB;AAAA,MAChB,OAAO;AAAA,MACP,QAAQ;AAAA,IACV;AAAA,IAEA,gBAAgB;AAAA,MACd,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,iBAAiB;AAAA,IACjB,SAAS;AAAA,IACT,WAAW;AAAA;AAAA,IAEX,OAAO;AAAA,IAEP,sBAAsB;AAAA,MACpB,OAAO;AAAA,QACL,WAAW;AAAA,QACX,iBAAiB,sBAAsB,MAAM,OAAO,SAAS;AAAA,MAC/D;AAAA,IACF;AAAA,IAEA,mBAAmB,EAAE,gBAAgB,QAAQ;AAAA,IAC7C,mBAAmB,EAAE,gBAAgB,QAAQ;AAAA,EAC/C;AAAA,EACA,OAAO,CAAC;AAAA,EACR,SAAS,CAAC;AAAA,EACV,MAAM,CAAC;AAAA,EACP,QAAQ,EAAE,SAAS,OAAO;AAAA,EAC1B,OAAO;AAAA,IACL,OAAO;AAAA,EACT;AAAA,EACA,SAAS;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA,YAAY,CAAC;AAAA,EACb,cAAc,CAAC;AACjB,CAAC;"}

package/dist/esm/LoadingContainer/LoadingContainer.js

@@ -16,7 +16,7 @@ const HvLoadingContainer = (props) => {
     ...others
   } = useDefaultProps("HvLoadingContainer", props);
   const { classes, cx } = useClasses(classesProp);
-  const ariaLabel = ariaLabelProp || typeof label === "string" && label ? label : "Loading";
+  const ariaLabel = ariaLabelProp || typeof label === "string" && label || "Loading";
   return /* @__PURE__ */ jsxs("div", { className: cx(classes.root, className), ...others, children: [
     /* @__PURE__ */ jsx(
       HvLoading,
@@ -27,7 +27,9 @@ const HvLoadingContainer = (props) => {
         label,
         hidden,
         "aria-label": ariaLabel,
-        style: mergeStyles({}, { "--opacity": opacity })
+        style: mergeStyles(void 0, {
+          "--opacity": opacity && `${opacity * 100}%`
+        })
       }
     ),
     children

package/dist/esm/LoadingContainer/LoadingContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingContainer.js","sources":["../../../src/LoadingContainer/LoadingContainer.tsx"],"sourcesContent":["import {\n  mergeStyles,\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvLoading, HvLoadingProps } from \"../Loading\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { staticClasses, useClasses } from \"./LoadingContainer.styles\";\n\nexport { staticClasses as loadingContainerClasses };\n\nexport type HvLoadingContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingContainerProps\n  extends HvBaseProps<HTMLDivElement>,\n    Pick<HvLoadingProps, \"label\" | \"small\" | \"hidden\"> {\n  opacity?: number;\n  classes?: HvLoadingContainerClasses;\n}\n\n/**\n * A component that wraps `children` with an `HvLoading` component and\n * and an overlay background with opacity.\n *\n * @example\n * <HvLoadingContainer label=\"Loading...\" hidden={!isLoading}>\n *  <MyComponent>\n * </HvLoadingContainer>\n * */\nexport const HvLoadingContainer = (props: HvLoadingContainerProps) => {\n  const {\n    children,\n    className,\n    classes: classesProp,\n    hidden,\n    small,\n    label,\n    \"aria-label\": ariaLabelProp,\n    opacity,\n    ...others\n  } = useDefaultProps(\"HvLoadingContainer\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const ariaLabel =\n    ariaLabelProp || (typeof label === \"string\" && label)\n      ? (label as string)\n      : \"Loading\";\n\n  return (\n    <div className={cx(classes.root, className)} {...others}>\n      <HvLoading\n        className={classes.loading}\n        role=\"progressbar\"\n        small={small}\n        label={label}\n        hidden={hidden}\n        aria-label={ariaLabel}\n        style={mergeStyles({}, { \"--opacity\": opacity })}\n      />\n      {children}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;AA8Ba,MAAA,qBAAqB,CAAC,UAAmC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,sBAAsB,KAAK;AAC/C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,YACJ,iBAAkB,OAAO,UAAU,YAAY,QAC1C,QACD;AAGJ,SAAA,qBAAC,SAAI,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QAC/C,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,MAAK;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,OAAO,YAAY,CAAA,GAAI,EAAE,aAAa,SAAS;AAAA,MAAA;AAAA,IACjD;AAAA,IACC;AAAA,EACH,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"LoadingContainer.js","sources":["../../../src/LoadingContainer/LoadingContainer.tsx"],"sourcesContent":["import {\n  mergeStyles,\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvLoading, HvLoadingProps } from \"../Loading\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { staticClasses, useClasses } from \"./LoadingContainer.styles\";\n\nexport { staticClasses as loadingContainerClasses };\n\nexport type HvLoadingContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingContainerProps\n  extends HvBaseProps<HTMLDivElement>,\n    Pick<HvLoadingProps, \"label\" | \"small\" | \"hidden\"> {\n  opacity?: number;\n  classes?: HvLoadingContainerClasses;\n}\n\n/**\n * A component that wraps `children` with an `HvLoading` component and\n * and an overlay background with opacity.\n *\n * @example\n * <HvLoadingContainer label=\"Loading...\" hidden={!isLoading}>\n *  <MyComponent>\n * </HvLoadingContainer>\n * */\nexport const HvLoadingContainer = (props: HvLoadingContainerProps) => {\n  const {\n    children,\n    className,\n    classes: classesProp,\n    hidden,\n    small,\n    label,\n    \"aria-label\": ariaLabelProp,\n    opacity,\n    ...others\n  } = useDefaultProps(\"HvLoadingContainer\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const ariaLabel =\n    ariaLabelProp || (typeof label === \"string\" && label) || \"Loading\";\n\n  return (\n    <div className={cx(classes.root, className)} {...others}>\n      <HvLoading\n        className={classes.loading}\n        role=\"progressbar\"\n        small={small}\n        label={label}\n        hidden={hidden}\n        aria-label={ariaLabel}\n        style={mergeStyles(undefined, {\n          \"--opacity\": opacity && `${opacity * 100}%`,\n        })}\n      />\n      {children}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;AA8Ba,MAAA,qBAAqB,CAAC,UAAmC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,sBAAsB,KAAK;AAC/C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,YACJ,iBAAkB,OAAO,UAAU,YAAY,SAAU;AAGzD,SAAA,qBAAC,SAAI,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QAC/C,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,MAAK;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,OAAO,YAAY,QAAW;AAAA,UAC5B,aAAa,WAAW,GAAG,UAAU,GAAG;AAAA,QAAA,CACzC;AAAA,MAAA;AAAA,IACH;AAAA,IACC;AAAA,EACH,EAAA,CAAA;AAEJ;"}

package/dist/esm/LoadingContainer/LoadingContainer.styles.js

@@ -11,7 +11,7 @@ const { staticClasses, useClasses } = createClasses("HvLoadingContainer", {
     inset: 0,
     zIndex: theme.zIndices.overlay,
     transition: "background-color .2s ease",
-    backgroundColor: theme.alpha("atmo1", "var(--opacity, 0.8)")
+    backgroundColor: theme.alpha("atmo1", "var(--opacity, 80%)")
   }
 });
 export {

package/dist/esm/LoadingContainer/LoadingContainer.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingContainer.styles.js","sources":["../../../src/LoadingContainer/LoadingContainer.styles.ts"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nconst { staticClasses, useClasses } = createClasses(\"HvLoadingContainer\", {\n  root: {\n    position: \"relative\",\n    height: \"inherit\",\n  },\n  loading: {\n    position: \"absolute\",\n    userSelect: \"none\",\n    inset: 0,\n    zIndex: theme.zIndices.overlay,\n    transition: \"background-color .2s ease\",\n    backgroundColor: theme.alpha(\"atmo1\", \"var(--opacity, 0.8)\"),\n  },\n});\n\nexport { staticClasses, useClasses };\n"],"names":[],"mappings":";;AAGA,MAAM,EAAE,eAAe,eAAe,cAAc,sBAAsB;AAAA,EACxE,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,QAAQ;AAAA,EACV;AAAA,EACA,SAAS;AAAA,IACP,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,QAAQ,MAAM,SAAS;AAAA,IACvB,YAAY;AAAA,IACZ,iBAAiB,MAAM,MAAM,SAAS,qBAAqB;AAAA,EAC7D;AACF,CAAC;"}
+{"version":3,"file":"LoadingContainer.styles.js","sources":["../../../src/LoadingContainer/LoadingContainer.styles.ts"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nconst { staticClasses, useClasses } = createClasses(\"HvLoadingContainer\", {\n  root: {\n    position: \"relative\",\n    height: \"inherit\",\n  },\n  loading: {\n    position: \"absolute\",\n    userSelect: \"none\",\n    inset: 0,\n    zIndex: theme.zIndices.overlay,\n    transition: \"background-color .2s ease\",\n    backgroundColor: theme.alpha(\"atmo1\", \"var(--opacity, 80%)\"),\n  },\n});\n\nexport { staticClasses, useClasses };\n"],"names":[],"mappings":";;AAGA,MAAM,EAAE,eAAe,eAAe,cAAc,sBAAsB;AAAA,EACxE,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,QAAQ;AAAA,EACV;AAAA,EACA,SAAS;AAAA,IACP,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,QAAQ,MAAM,SAAS;AAAA,IACvB,YAAY;AAAA,IACZ,iBAAiB,MAAM,MAAM,SAAS,qBAAqB;AAAA,EAC7D;AACF,CAAC;"}

package/dist/esm/Section/Section.js

@@ -1,10 +1,8 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { Up, Down } from "@hitachivantara/uikit-react-icons";
+import { Down } from "@hitachivantara/uikit-react-icons";
 import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
-import { useControlled } from "../hooks/useControlled.js";
-import { useUniqueId } from "../hooks/useUniqueId.js";
-import { setId } from "../utils/setId.js";
+import { useExpandable } from "../hooks/useExpandable.js";
 import { useClasses } from "./Section.styles.js";
 import { staticClasses } from "./Section.styles.js";
 import { HvButton } from "../Button/Button.js";
@@ -27,18 +25,17 @@ const HvSection = forwardRef(
       ...others
     } = useDefaultProps("HvSection", props);
     const { classes, cx } = useClasses(classesProp);
-    const [isOpen, setIsOpen] = useControlled(
+    const { isOpen, toggleOpen, buttonProps, regionProps } = useExpandable({
+      id,
       expanded,
-      Boolean(defaultExpanded)
-    );
-    const elementId = useUniqueId(id);
-    const contentId = setId(elementId, "content");
+      defaultExpanded
+    });
     const showContent = expandable ? !!isOpen : true;
     return /* @__PURE__ */ jsxs(
       "div",
       {
         ref,
-        id: elementId,
+        id,
         className: cx(classes.root, className),
         ...others,
         children: [
@@ -54,14 +51,13 @@ const HvSection = forwardRef(
                   {
                     icon: true,
                     onClick: (event) => {
-                      setIsOpen((o) => !o);
+                      toggleOpen();
                       onToggle?.(event, !isOpen);
                     },
-                    "aria-expanded": isOpen,
-                    "aria-controls": contentId,
                     "aria-label": isOpen ? "Collapse" : "Expand",
+                    ...buttonProps,
                     ...expandButtonProps,
-                    children: isOpen ? /* @__PURE__ */ jsx(Up, {}) : /* @__PURE__ */ jsx(Down, {})
+                    children: /* @__PURE__ */ jsx(Down, { style: { rotate: isOpen ? "180deg" : void 0 } })
                   }
                 ),
                 title,
@@ -73,12 +69,12 @@ const HvSection = forwardRef(
             "div",
             {
               ref: contentRef,
-              id: contentId,
               hidden: !isOpen,
               className: cx(classes.content, {
                 [classes.hidden]: !showContent,
                 [classes.spaceTop]: !(title || actions || expandable)
               }),
+              ...expandable && regionProps,
               children
             }
           )

package/dist/esm/Section/Section.js.map

@@ -1 +1 @@
-{"version":3,"file":"Section.js","sources":["../../../src/Section/Section.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Down, Up } from \"@hitachivantara/uikit-react-icons\";\nimport {\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvButton, HvButtonProps } from \"../Button\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./Section.styles\";\n\nexport { staticClasses as sectionClasses };\n\nexport type HvSectionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSectionProps\n  extends Omit<HvBaseProps<HTMLDivElement>, \"title\" | \"onToggle\"> {\n  /** The title of the section */\n  title?: React.ReactNode;\n  /** Whether or not the section is expandable.  */\n  expandable?: boolean;\n  /** Whether the section is open or not, if this property is defined the accordion must be fully controlled. */\n  expanded?: boolean;\n  /** When uncontrolled, defines the initial expanded state. */\n  defaultExpanded?: boolean;\n  /** Section actions */\n  actions?: React.ReactNode;\n  /** Section onExpand callback */\n  onToggle?: (\n    event: React.MouseEvent<HTMLButtonElement>,\n    open: boolean,\n  ) => void;\n  /** Props to be passed to the expand button */\n  expandButtonProps?: HvButtonProps;\n  /** Determines whether or not the header has a shadow on the bottom border. */\n  raisedHeader?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the empty state component. */\n  classes?: HvSectionClasses;\n  /** Content container ref. */\n  contentRef?: React.Ref<HTMLDivElement>;\n}\n\n/**\n * Sections allow grouping information on a page under the same topic.\n */\nexport const HvSection = forwardRef<HTMLDivElement, HvSectionProps>(\n  (props, ref) => {\n    const {\n      id,\n      classes: classesProp,\n      className,\n      title,\n      expandable,\n      expanded,\n      defaultExpanded = true,\n      actions,\n      onToggle,\n      expandButtonProps,\n      raisedHeader,\n      contentRef,\n      children,\n      ...others\n    } = useDefaultProps(\"HvSection\", props);\n\n    const { classes, cx } = useClasses(classesProp);\n\n    const [isOpen, setIsOpen] = useControlled(\n      expanded,\n      Boolean(defaultExpanded),\n    );\n\n    const elementId = useUniqueId(id);\n    const contentId = setId(elementId, \"content\");\n\n    const showContent = expandable ? !!isOpen : true;\n\n    return (\n      <div\n        ref={ref}\n        id={elementId}\n        className={cx(classes.root, className)}\n        {...others}\n      >\n        {(title || actions || expandable) && (\n          <div\n            className={cx(classes.header, {\n              [classes.raisedHeader]: raisedHeader && isOpen,\n            })}\n          >\n            {expandable && (\n              <HvButton\n                icon\n                onClick={(event) => {\n                  setIsOpen((o) => !o);\n                  onToggle?.(event, !isOpen);\n                }}\n                aria-expanded={isOpen}\n                aria-controls={contentId}\n                aria-label={isOpen ? \"Collapse\" : \"Expand\"}\n                {...expandButtonProps}\n              >\n                {isOpen ? <Up /> : <Down />}\n              </HvButton>\n            )}\n            {title}\n            <div className={classes.actions}>{actions}</div>\n          </div>\n        )}\n        <div\n          ref={contentRef}\n          id={contentId}\n          hidden={!isOpen}\n          className={cx(classes.content, {\n            [classes.hidden]: !showContent,\n            [classes.spaceTop]: !(title || actions || expandable),\n          })}\n        >\n          {children}\n        </div>\n      </div>\n    );\n  },\n);\n"],"names":[],"mappings":";;;;;;;;;;AAgDO,MAAM,YAAY;AAAA,EACvB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ;AAAA,MACA,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,kBAAkB;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IAAA,IACD,gBAAgB,aAAa,KAAK;AAEtC,UAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,UAAA,CAAC,QAAQ,SAAS,IAAI;AAAA,MAC1B;AAAA,MACA,QAAQ,eAAe;AAAA,IAAA;AAGnB,UAAA,YAAY,YAAY,EAAE;AAC1B,UAAA,YAAY,MAAM,WAAW,SAAS;AAE5C,UAAM,cAAc,aAAa,CAAC,CAAC,SAAS;AAG1C,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,IAAI;AAAA,QACJ,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,QACpC,GAAG;AAAA,QAEF,UAAA;AAAA,WAAA,SAAS,WAAW,eACpB;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,GAAG,QAAQ,QAAQ;AAAA,gBAC5B,CAAC,QAAQ,YAAY,GAAG,gBAAgB;AAAA,cAAA,CACzC;AAAA,cAEA,UAAA;AAAA,gBACC,cAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAI;AAAA,oBACJ,SAAS,CAAC,UAAU;AACR,gCAAA,CAAC,MAAM,CAAC,CAAC;AACR,iCAAA,OAAO,CAAC,MAAM;AAAA,oBAC3B;AAAA,oBACA,iBAAe;AAAA,oBACf,iBAAe;AAAA,oBACf,cAAY,SAAS,aAAa;AAAA,oBACjC,GAAG;AAAA,oBAEH,UAAS,SAAA,oBAAC,IAAG,CAAA,CAAA,wBAAM,MAAK,EAAA;AAAA,kBAAA;AAAA,gBAC3B;AAAA,gBAED;AAAA,gBACA,oBAAA,OAAA,EAAI,WAAW,QAAQ,SAAU,UAAQ,SAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UAC5C;AAAA,UAEF;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAK;AAAA,cACL,IAAI;AAAA,cACJ,QAAQ,CAAC;AAAA,cACT,WAAW,GAAG,QAAQ,SAAS;AAAA,gBAC7B,CAAC,QAAQ,MAAM,GAAG,CAAC;AAAA,gBACnB,CAAC,QAAQ,QAAQ,GAAG,EAAE,SAAS,WAAW;AAAA,cAAA,CAC3C;AAAA,cAEA;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}
+{"version":3,"file":"Section.js","sources":["../../../src/Section/Section.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Down } from \"@hitachivantara/uikit-react-icons\";\nimport {\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvButton, HvButtonProps } from \"../Button\";\nimport { useExpandable } from \"../hooks/useExpandable\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { staticClasses, useClasses } from \"./Section.styles\";\n\nexport { staticClasses as sectionClasses };\n\nexport type HvSectionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSectionProps\n  extends Omit<HvBaseProps<HTMLDivElement>, \"title\" | \"onToggle\"> {\n  /** The title of the section */\n  title?: React.ReactNode;\n  /** Whether or not the section is expandable.  */\n  expandable?: boolean;\n  /** Whether the section is open or not, if this property is defined the accordion must be fully controlled. */\n  expanded?: boolean;\n  /** When uncontrolled, defines the initial expanded state. */\n  defaultExpanded?: boolean;\n  /** Section actions */\n  actions?: React.ReactNode;\n  /** Section onExpand callback */\n  onToggle?: (\n    event: React.MouseEvent<HTMLButtonElement>,\n    open: boolean,\n  ) => void;\n  /** Props to be passed to the expand button */\n  expandButtonProps?: HvButtonProps;\n  /** Determines whether or not the header has a shadow on the bottom border. */\n  raisedHeader?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the empty state component. */\n  classes?: HvSectionClasses;\n  /** Content container ref. */\n  contentRef?: React.Ref<HTMLDivElement>;\n}\n\n/**\n * Sections allow grouping information on a page under the same topic.\n */\nexport const HvSection = forwardRef<HTMLDivElement, HvSectionProps>(\n  (props, ref) => {\n    const {\n      id,\n      classes: classesProp,\n      className,\n      title,\n      expandable,\n      expanded,\n      defaultExpanded = true,\n      actions,\n      onToggle,\n      expandButtonProps,\n      raisedHeader,\n      contentRef,\n      children,\n      ...others\n    } = useDefaultProps(\"HvSection\", props);\n    const { classes, cx } = useClasses(classesProp);\n\n    const { isOpen, toggleOpen, buttonProps, regionProps } = useExpandable({\n      id,\n      expanded,\n      defaultExpanded,\n    });\n\n    const showContent = expandable ? !!isOpen : true;\n\n    return (\n      <div\n        ref={ref}\n        id={id}\n        className={cx(classes.root, className)}\n        {...others}\n      >\n        {(title || actions || expandable) && (\n          <div\n            className={cx(classes.header, {\n              [classes.raisedHeader]: raisedHeader && isOpen,\n            })}\n          >\n            {expandable && (\n              <HvButton\n                icon\n                onClick={(event) => {\n                  toggleOpen();\n                  onToggle?.(event, !isOpen);\n                }}\n                aria-label={isOpen ? \"Collapse\" : \"Expand\"}\n                {...buttonProps}\n                {...expandButtonProps}\n              >\n                <Down style={{ rotate: isOpen ? \"180deg\" : undefined }} />\n              </HvButton>\n            )}\n            {title}\n            <div className={classes.actions}>{actions}</div>\n          </div>\n        )}\n        <div\n          ref={contentRef}\n          hidden={!isOpen}\n          className={cx(classes.content, {\n            [classes.hidden]: !showContent,\n            [classes.spaceTop]: !(title || actions || expandable),\n          })}\n          {...(expandable && regionProps)}\n        >\n          {children}\n        </div>\n      </div>\n    );\n  },\n);\n"],"names":[],"mappings":";;;;;;;;AA8CO,MAAM,YAAY;AAAA,EACvB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ;AAAA,MACA,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,kBAAkB;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IAAA,IACD,gBAAgB,aAAa,KAAK;AACtC,UAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,UAAM,EAAE,QAAQ,YAAY,aAAa,YAAA,IAAgB,cAAc;AAAA,MACrE;AAAA,MACA;AAAA,MACA;AAAA,IAAA,CACD;AAED,UAAM,cAAc,aAAa,CAAC,CAAC,SAAS;AAG1C,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,QACpC,GAAG;AAAA,QAEF,UAAA;AAAA,WAAA,SAAS,WAAW,eACpB;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,GAAG,QAAQ,QAAQ;AAAA,gBAC5B,CAAC,QAAQ,YAAY,GAAG,gBAAgB;AAAA,cAAA,CACzC;AAAA,cAEA,UAAA;AAAA,gBACC,cAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAI;AAAA,oBACJ,SAAS,CAAC,UAAU;AACP;AACA,iCAAA,OAAO,CAAC,MAAM;AAAA,oBAC3B;AAAA,oBACA,cAAY,SAAS,aAAa;AAAA,oBACjC,GAAG;AAAA,oBACH,GAAG;AAAA,oBAEJ,UAAA,oBAAC,QAAK,OAAO,EAAE,QAAQ,SAAS,WAAW,UAAa;AAAA,kBAAA;AAAA,gBAC1D;AAAA,gBAED;AAAA,gBACA,oBAAA,OAAA,EAAI,WAAW,QAAQ,SAAU,UAAQ,SAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UAC5C;AAAA,UAEF;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAK;AAAA,cACL,QAAQ,CAAC;AAAA,cACT,WAAW,GAAG,QAAQ,SAAS;AAAA,gBAC7B,CAAC,QAAQ,MAAM,GAAG,CAAC;AAAA,gBACnB,CAAC,QAAQ,QAAQ,GAAG,EAAE,SAAS,WAAW;AAAA,cAAA,CAC3C;AAAA,cACA,GAAI,cAAc;AAAA,cAElB;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}

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

@@ -89,8 +89,7 @@ const useBulkActions = (hooks) => {
   hooks.useInstance.push(useInstanceHook);
 };
 useBulkActions.pluginName = "useHvBulkActions";
-const useBulkActions$1 = useBulkActions;
 export {
-  useBulkActions$1 as default,
+  useBulkActions as default,
   defaultgetHvBulkActionsProps
 };

package/dist/esm/Table/hooks/useBulkActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBulkActions.js","sources":["../../../../src/Table/hooks/useBulkActions.ts"],"sourcesContent":["import { useCallback } from \"react\";\nimport {\n  ensurePluginOrder,\n  Hooks,\n  makePropGetter,\n  PropGetter,\n  TableCommonProps,\n  useGetLatest,\n} from \"react-table\";\n\n// #region ##### TYPES #####\n\n// TODO: fix typo in v6\nexport interface HvTAbleBulkActionsProps extends TableCommonProps {\n  numTotal: number;\n  numSelected: number;\n  showSelectAllPages: boolean;\n  onSelectAll: () => void;\n  onSelectAllPages: () => void;\n  labels?: Record<string, string>;\n}\n\nexport type HvBulkActionsPropGetter<D extends object> = PropGetter<\n  D,\n  HvTAbleBulkActionsProps\n>;\n\nexport interface UseHvBulkActionsHooks<D extends object> {\n  getHvBulkActionsProps: Array<HvBulkActionsPropGetter<D>>;\n}\n\nexport type UseHvBulkActionsTableOptions = {\n  // TODO: fix typo in v6\n  /** Controls whether the \"Select all\" should _select_ or _unselect_ the rows, in a partial selection state. */\n  aditivePageBulkSelection?: boolean;\n  /** Controls whether _only the current page_ or _all pages_ should be unselected */\n  subtractivePageBulkDeselection?: boolean;\n  showSelectAllPages?: boolean;\n};\n\nexport interface UseHvBulkActionsTableInstanceProps<D extends object> {\n  getHvBulkActionsProps: (\n    propGetter?: HvBulkActionsPropGetter<D>,\n  ) => HvTAbleBulkActionsProps;\n  invertedToggleAllRowsSelected: () => void;\n}\n\nexport type UseBulkActionsProps = (<D extends object = Record<string, unknown>>(\n  hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useInstanceHook = (instance: any) => {\n  const { plugins, page, toggleAllPageRowsSelected, toggleAllRowsSelected } =\n    instance;\n\n  ensurePluginOrder(plugins, [\"useHvRowSelection\"], \"useHvBulkActions\");\n\n  const getInstance = useGetLatest(instance);\n\n  const getHvBulkActionsProps = makePropGetter(\n    instance.getHooks().getHvBulkActionsProps,\n    {\n      instance: getInstance(),\n    },\n  );\n\n  const isPaginated = !!page;\n\n  const invertedToggleAllRowsSelected = useCallback(() => {\n    if (!isPaginated) return toggleAllRowsSelected();\n\n    const {\n      aditivePageBulkSelection: additivePageBulkSelection,\n      subtractivePageBulkDeselection,\n      isNoRowsSelected,\n      isNoPageRowsSelected,\n      isAllSelectablePageRowsSelected,\n      isAllSelectablePageRowsUnselected,\n    } = getInstance();\n\n    if (additivePageBulkSelection && subtractivePageBulkDeselection) {\n      return toggleAllPageRowsSelected(!isAllSelectablePageRowsSelected);\n    }\n\n    if (additivePageBulkSelection && !subtractivePageBulkDeselection) {\n      if (!isAllSelectablePageRowsSelected) {\n        return toggleAllPageRowsSelected(true);\n      }\n\n      return toggleAllRowsSelected(false);\n    }\n\n    if (!additivePageBulkSelection && !subtractivePageBulkDeselection) {\n      if (isNoRowsSelected) {\n        return toggleAllPageRowsSelected(true);\n      }\n\n      return toggleAllRowsSelected(false);\n    }\n\n    if (!additivePageBulkSelection && subtractivePageBulkDeselection) {\n      if (isNoRowsSelected) {\n        return toggleAllPageRowsSelected(true);\n      }\n      if (!isAllSelectablePageRowsUnselected) {\n        return toggleAllPageRowsSelected(false);\n      }\n      if (!isNoPageRowsSelected) {\n        return toggleAllPageRowsSelected(false);\n      }\n\n      return toggleAllRowsSelected(false);\n    }\n\n    return toggleAllPageRowsSelected();\n  }, [\n    getInstance,\n    isPaginated,\n    toggleAllPageRowsSelected,\n    toggleAllRowsSelected,\n  ]);\n\n  Object.assign(instance, {\n    getHvBulkActionsProps,\n    invertedToggleAllRowsSelected,\n    aditivePageBulkSelection: !!instance.aditivePageBulkSelection,\n    subtractivePageBulkDeselection: !!instance.subtractivePageBulkDeselection,\n  });\n};\n\n// TODO: fix typo in v6\nexport const defaultgetHvBulkActionsProps = (props: any, { instance }: any) => {\n  const {\n    rows,\n    initialRows,\n    selectedFlatRows,\n    state: { selectedRowIds = {} } = {},\n    page,\n    toggleAllRowsSelected,\n    invertedToggleAllRowsSelected,\n    showSelectAllPages = true,\n    applyToggleAllRowsSelectedToPrefilteredRows,\n  } = instance;\n\n  const isPaginated = !!page;\n\n  const nextProps: HvTAbleBulkActionsProps = {\n    numTotal: applyToggleAllRowsSelectedToPrefilteredRows\n      ? initialRows.length\n      : rows.length,\n    numSelected: applyToggleAllRowsSelectedToPrefilteredRows\n      ? Object.keys(selectedRowIds).length\n      : selectedFlatRows.length,\n    showSelectAllPages: showSelectAllPages && isPaginated,\n    onSelectAll: invertedToggleAllRowsSelected,\n    onSelectAllPages: toggleAllRowsSelected,\n  };\n\n  return [props, nextProps];\n};\n\nconst useBulkActions: UseBulkActionsProps = (hooks) => {\n  hooks.getHvBulkActionsProps = [defaultgetHvBulkActionsProps];\n\n  hooks.useInstance.push(useInstanceHook);\n};\n\nuseBulkActions.pluginName = \"useHvBulkActions\";\n\nexport default useBulkActions;\n"],"names":[],"mappings":";;AAqDA,MAAM,kBAAkB,CAAC,aAAkB;AACzC,QAAM,EAAE,SAAS,MAAM,2BAA2B,0BAChD;AAEF,oBAAkB,SAAS,CAAC,mBAAmB,GAAG,kBAAkB;AAE9D,QAAA,cAAc,aAAa,QAAQ;AAEzC,QAAM,wBAAwB;AAAA,IAC5B,SAAS,WAAW;AAAA,IACpB;AAAA,MACE,UAAU,YAAY;AAAA,IACxB;AAAA,EAAA;AAGI,QAAA,cAAc,CAAC,CAAC;AAEhB,QAAA,gCAAgC,YAAY,MAAM;AAClD,QAAA,CAAC,YAAa,QAAO;AAEnB,UAAA;AAAA,MACJ,0BAA0B;AAAA,MAC1B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,YAAY;AAEhB,QAAI,6BAA6B,gCAAgC;AACxD,aAAA,0BAA0B,CAAC,+BAA+B;AAAA,IACnE;AAEI,QAAA,6BAA6B,CAAC,gCAAgC;AAChE,UAAI,CAAC,iCAAiC;AACpC,eAAO,0BAA0B,IAAI;AAAA,MACvC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEI,QAAA,CAAC,6BAA6B,CAAC,gCAAgC;AACjE,UAAI,kBAAkB;AACpB,eAAO,0BAA0B,IAAI;AAAA,MACvC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEI,QAAA,CAAC,6BAA6B,gCAAgC;AAChE,UAAI,kBAAkB;AACpB,eAAO,0BAA0B,IAAI;AAAA,MACvC;AACA,UAAI,CAAC,mCAAmC;AACtC,eAAO,0BAA0B,KAAK;AAAA,MACxC;AACA,UAAI,CAAC,sBAAsB;AACzB,eAAO,0BAA0B,KAAK;AAAA,MACxC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEA,WAAO,0BAA0B;AAAA,EAAA,GAChC;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AAED,SAAO,OAAO,UAAU;AAAA,IACtB;AAAA,IACA;AAAA,IACA,0BAA0B,CAAC,CAAC,SAAS;AAAA,IACrC,gCAAgC,CAAC,CAAC,SAAS;AAAA,EAAA,CAC5C;AACH;AAGO,MAAM,+BAA+B,CAAC,OAAY,EAAE,eAAoB;AACvE,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,iBAAiB,CAAC,EAAA,IAAM,CAAC;AAAA,IAClC;AAAA,IACA;AAAA,IACA;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA,EACE,IAAA;AAEE,QAAA,cAAc,CAAC,CAAC;AAEtB,QAAM,YAAqC;AAAA,IACzC,UAAU,8CACN,YAAY,SACZ,KAAK;AAAA,IACT,aAAa,8CACT,OAAO,KAAK,cAAc,EAAE,SAC5B,iBAAiB;AAAA,IACrB,oBAAoB,sBAAsB;AAAA,IAC1C,aAAa;AAAA,IACb,kBAAkB;AAAA,EAAA;AAGb,SAAA,CAAC,OAAO,SAAS;AAC1B;AAEA,MAAM,iBAAsC,CAAC,UAAU;AAC/C,QAAA,wBAAwB,CAAC,4BAA4B;AAErD,QAAA,YAAY,KAAK,eAAe;AACxC;AAEA,eAAe,aAAa;AAE5B,MAAA,mBAAe;"}
+{"version":3,"file":"useBulkActions.js","sources":["../../../../src/Table/hooks/useBulkActions.ts"],"sourcesContent":["import { useCallback } from \"react\";\nimport {\n  ensurePluginOrder,\n  Hooks,\n  makePropGetter,\n  PropGetter,\n  TableCommonProps,\n  useGetLatest,\n} from \"react-table\";\n\n// #region ##### TYPES #####\n\n// TODO: fix typo in v6\nexport interface HvTAbleBulkActionsProps extends TableCommonProps {\n  numTotal: number;\n  numSelected: number;\n  showSelectAllPages: boolean;\n  onSelectAll: () => void;\n  onSelectAllPages: () => void;\n  labels?: Record<string, string>;\n}\n\nexport type HvBulkActionsPropGetter<D extends object> = PropGetter<\n  D,\n  HvTAbleBulkActionsProps\n>;\n\nexport interface UseHvBulkActionsHooks<D extends object> {\n  getHvBulkActionsProps: Array<HvBulkActionsPropGetter<D>>;\n}\n\nexport type UseHvBulkActionsTableOptions = {\n  // TODO: fix typo in v6\n  /** Controls whether the \"Select all\" should _select_ or _unselect_ the rows, in a partial selection state. */\n  aditivePageBulkSelection?: boolean;\n  /** Controls whether _only the current page_ or _all pages_ should be unselected */\n  subtractivePageBulkDeselection?: boolean;\n  showSelectAllPages?: boolean;\n};\n\nexport interface UseHvBulkActionsTableInstanceProps<D extends object> {\n  getHvBulkActionsProps: (\n    propGetter?: HvBulkActionsPropGetter<D>,\n  ) => HvTAbleBulkActionsProps;\n  invertedToggleAllRowsSelected: () => void;\n}\n\nexport type UseBulkActionsProps = (<D extends object = Record<string, unknown>>(\n  hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useInstanceHook = (instance: any) => {\n  const { plugins, page, toggleAllPageRowsSelected, toggleAllRowsSelected } =\n    instance;\n\n  ensurePluginOrder(plugins, [\"useHvRowSelection\"], \"useHvBulkActions\");\n\n  const getInstance = useGetLatest(instance);\n\n  const getHvBulkActionsProps = makePropGetter(\n    instance.getHooks().getHvBulkActionsProps,\n    {\n      instance: getInstance(),\n    },\n  );\n\n  const isPaginated = !!page;\n\n  const invertedToggleAllRowsSelected = useCallback(() => {\n    if (!isPaginated) return toggleAllRowsSelected();\n\n    const {\n      aditivePageBulkSelection: additivePageBulkSelection,\n      subtractivePageBulkDeselection,\n      isNoRowsSelected,\n      isNoPageRowsSelected,\n      isAllSelectablePageRowsSelected,\n      isAllSelectablePageRowsUnselected,\n    } = getInstance();\n\n    if (additivePageBulkSelection && subtractivePageBulkDeselection) {\n      return toggleAllPageRowsSelected(!isAllSelectablePageRowsSelected);\n    }\n\n    if (additivePageBulkSelection && !subtractivePageBulkDeselection) {\n      if (!isAllSelectablePageRowsSelected) {\n        return toggleAllPageRowsSelected(true);\n      }\n\n      return toggleAllRowsSelected(false);\n    }\n\n    if (!additivePageBulkSelection && !subtractivePageBulkDeselection) {\n      if (isNoRowsSelected) {\n        return toggleAllPageRowsSelected(true);\n      }\n\n      return toggleAllRowsSelected(false);\n    }\n\n    if (!additivePageBulkSelection && subtractivePageBulkDeselection) {\n      if (isNoRowsSelected) {\n        return toggleAllPageRowsSelected(true);\n      }\n      if (!isAllSelectablePageRowsUnselected) {\n        return toggleAllPageRowsSelected(false);\n      }\n      if (!isNoPageRowsSelected) {\n        return toggleAllPageRowsSelected(false);\n      }\n\n      return toggleAllRowsSelected(false);\n    }\n\n    return toggleAllPageRowsSelected();\n  }, [\n    getInstance,\n    isPaginated,\n    toggleAllPageRowsSelected,\n    toggleAllRowsSelected,\n  ]);\n\n  Object.assign(instance, {\n    getHvBulkActionsProps,\n    invertedToggleAllRowsSelected,\n    aditivePageBulkSelection: !!instance.aditivePageBulkSelection,\n    subtractivePageBulkDeselection: !!instance.subtractivePageBulkDeselection,\n  });\n};\n\n// TODO: fix typo in v6\nexport const defaultgetHvBulkActionsProps = (props: any, { instance }: any) => {\n  const {\n    rows,\n    initialRows,\n    selectedFlatRows,\n    state: { selectedRowIds = {} } = {},\n    page,\n    toggleAllRowsSelected,\n    invertedToggleAllRowsSelected,\n    showSelectAllPages = true,\n    applyToggleAllRowsSelectedToPrefilteredRows,\n  } = instance;\n\n  const isPaginated = !!page;\n\n  const nextProps: HvTAbleBulkActionsProps = {\n    numTotal: applyToggleAllRowsSelectedToPrefilteredRows\n      ? initialRows.length\n      : rows.length,\n    numSelected: applyToggleAllRowsSelectedToPrefilteredRows\n      ? Object.keys(selectedRowIds).length\n      : selectedFlatRows.length,\n    showSelectAllPages: showSelectAllPages && isPaginated,\n    onSelectAll: invertedToggleAllRowsSelected,\n    onSelectAllPages: toggleAllRowsSelected,\n  };\n\n  return [props, nextProps];\n};\n\nconst useBulkActions: UseBulkActionsProps = (hooks) => {\n  hooks.getHvBulkActionsProps = [defaultgetHvBulkActionsProps];\n\n  hooks.useInstance.push(useInstanceHook);\n};\n\nuseBulkActions.pluginName = \"useHvBulkActions\";\n\nexport default useBulkActions;\n"],"names":[],"mappings":";;AAqDA,MAAM,kBAAkB,CAAC,aAAkB;AACzC,QAAM,EAAE,SAAS,MAAM,2BAA2B,0BAChD;AAEF,oBAAkB,SAAS,CAAC,mBAAmB,GAAG,kBAAkB;AAE9D,QAAA,cAAc,aAAa,QAAQ;AAEzC,QAAM,wBAAwB;AAAA,IAC5B,SAAS,WAAW;AAAA,IACpB;AAAA,MACE,UAAU,YAAY;AAAA,IACxB;AAAA,EAAA;AAGI,QAAA,cAAc,CAAC,CAAC;AAEhB,QAAA,gCAAgC,YAAY,MAAM;AAClD,QAAA,CAAC,YAAa,QAAO;AAEnB,UAAA;AAAA,MACJ,0BAA0B;AAAA,MAC1B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,YAAY;AAEhB,QAAI,6BAA6B,gCAAgC;AACxD,aAAA,0BAA0B,CAAC,+BAA+B;AAAA,IACnE;AAEI,QAAA,6BAA6B,CAAC,gCAAgC;AAChE,UAAI,CAAC,iCAAiC;AACpC,eAAO,0BAA0B,IAAI;AAAA,MACvC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEI,QAAA,CAAC,6BAA6B,CAAC,gCAAgC;AACjE,UAAI,kBAAkB;AACpB,eAAO,0BAA0B,IAAI;AAAA,MACvC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEI,QAAA,CAAC,6BAA6B,gCAAgC;AAChE,UAAI,kBAAkB;AACpB,eAAO,0BAA0B,IAAI;AAAA,MACvC;AACA,UAAI,CAAC,mCAAmC;AACtC,eAAO,0BAA0B,KAAK;AAAA,MACxC;AACA,UAAI,CAAC,sBAAsB;AACzB,eAAO,0BAA0B,KAAK;AAAA,MACxC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEA,WAAO,0BAA0B;AAAA,EAAA,GAChC;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AAED,SAAO,OAAO,UAAU;AAAA,IACtB;AAAA,IACA;AAAA,IACA,0BAA0B,CAAC,CAAC,SAAS;AAAA,IACrC,gCAAgC,CAAC,CAAC,SAAS;AAAA,EAAA,CAC5C;AACH;AAGO,MAAM,+BAA+B,CAAC,OAAY,EAAE,eAAoB;AACvE,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,iBAAiB,CAAC,EAAA,IAAM,CAAC;AAAA,IAClC;AAAA,IACA;AAAA,IACA;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA,EACE,IAAA;AAEE,QAAA,cAAc,CAAC,CAAC;AAEtB,QAAM,YAAqC;AAAA,IACzC,UAAU,8CACN,YAAY,SACZ,KAAK;AAAA,IACT,aAAa,8CACT,OAAO,KAAK,cAAc,EAAE,SAC5B,iBAAiB;AAAA,IACrB,oBAAoB,sBAAsB;AAAA,IAC1C,aAAa;AAAA,IACb,kBAAkB;AAAA,EAAA;AAGb,SAAA,CAAC,OAAO,SAAS;AAC1B;AAEM,MAAA,iBAAsC,CAAC,UAAU;AAC/C,QAAA,wBAAwB,CAAC,4BAA4B;AAErD,QAAA,YAAY,KAAK,eAAe;AACxC;AAEA,eAAe,aAAa;"}

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

@@ -1,7 +1,6 @@
 import { useFilters } from "react-table";
 const useHvFilters = useFilters.bind({});
 useHvFilters.pluginName = "useHvFilters";
-const useHvFilters$1 = useHvFilters;
 export {
-  useHvFilters$1 as default
+  useHvFilters as default
 };

package/dist/esm/Table/hooks/useFilters.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFilters.js","sources":["../../../../src/Table/hooks/useFilters.ts"],"sourcesContent":["import { Hooks, useFilters } from \"react-table\";\n\nexport type UseFiltersProps = (<D extends object = Record<string, unknown>>(\n  hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvFilters = useFilters.bind({});\n(useHvFilters.pluginName as string) = \"useHvFilters\";\n\nexport default useHvFilters as UseFiltersProps;\n"],"names":[],"mappings":";AAQA,MAAM,eAAe,WAAW,KAAK,CAAA,CAAE;AACtC,aAAa,aAAwB;AAEtC,MAAA,iBAAe;"}
+{"version":3,"file":"useFilters.js","sources":["../../../../src/Table/hooks/useFilters.ts"],"sourcesContent":["import { Hooks, useFilters } from \"react-table\";\n\nexport type UseFiltersProps = (<D extends object = Record<string, unknown>>(\n  hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvFilters = useFilters.bind({});\n(useHvFilters.pluginName as string) = \"useHvFilters\";\n\nexport default useHvFilters as UseFiltersProps;\n"],"names":[],"mappings":";AAQA,MAAM,eAAe,WAAW,KAAK,EAAE;AACtC,aAAa,aAAwB;"}

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

@@ -1,7 +1,6 @@
 import { useGlobalFilter } from "react-table";
 const useHvGlobalFilter = useGlobalFilter.bind({});
 useHvGlobalFilter.pluginName = "useHvGlobalFilter";
-const useHvGlobalFilter$1 = useHvGlobalFilter;
 export {
-  useHvGlobalFilter$1 as default
+  useHvGlobalFilter as default
 };

package/dist/esm/Table/hooks/useGlobalFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"useGlobalFilter.js","sources":["../../../../src/Table/hooks/useGlobalFilter.ts"],"sourcesContent":["import { Hooks, useGlobalFilter } from \"react-table\";\n\nexport type UseGlobalFilterProps = (<\n  D extends object = Record<string, unknown>,\n>(\n  hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvGlobalFilter = useGlobalFilter.bind({});\n(useHvGlobalFilter.pluginName as string) = \"useHvGlobalFilter\";\n\nexport default useHvGlobalFilter as UseGlobalFilterProps;\n"],"names":[],"mappings":";AAUA,MAAM,oBAAoB,gBAAgB,KAAK,CAAA,CAAE;AAChD,kBAAkB,aAAwB;AAE3C,MAAA,sBAAe;"}
+{"version":3,"file":"useGlobalFilter.js","sources":["../../../../src/Table/hooks/useGlobalFilter.ts"],"sourcesContent":["import { Hooks, useGlobalFilter } from \"react-table\";\n\nexport type UseGlobalFilterProps = (<\n  D extends object = Record<string, unknown>,\n>(\n  hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvGlobalFilter = useGlobalFilter.bind({});\n(useHvGlobalFilter.pluginName as string) = \"useHvGlobalFilter\";\n\nexport default useHvGlobalFilter as UseGlobalFilterProps;\n"],"names":[],"mappings":";AAUA,MAAM,oBAAoB,gBAAgB,KAAK,EAAE;AAChD,kBAAkB,aAAwB;"}

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

@@ -85,7 +85,6 @@ const useHeaderGroups = (hooks) => {
   hooks.getCellProps.push(getCellPropsHook);
 };
 useHeaderGroups.pluginName = "useHvHeaderGroups";
-const useHeaderGroups$1 = useHeaderGroups;
 export {
-  useHeaderGroups$1 as default
+  useHeaderGroups as default
 };

package/dist/esm/Table/hooks/useHeaderGroups.js.map

@@ -1 +1 @@
-{"version":3,"file":"useHeaderGroups.js","sources":["../../../../src/Table/hooks/useHeaderGroups.ts"],"sourcesContent":["import { Hooks } from \"react-table\";\n\n// #region ##### TYPES #####\n\nexport interface UseHvHeaderGroupsInstance {\n  hasGroupedColumns?: boolean;\n}\n\n// props target: <table><thead><tr><th>\nexport interface UseHvHeaderGroupsColumnProps {\n  style?: React.CSSProperties;\n  groupColumnMostLeft?: boolean;\n  groupColumnMostRight?: boolean;\n}\n\n// props target: <table><tbody><tr><td>\nexport interface UseHvHeaderGroupsCellProps {\n  groupColumnMostLeft?: boolean;\n  groupColumnMostRight?: boolean;\n}\n\nexport type UseHvHeaderGroupsProps = (<\n  D extends object = Record<string, unknown>,\n>(\n  hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\n/**\n * Moving non grouped headers to the top level,\n * by placing them in the position of their top level placeholder.\n *\n * By default the header groups are built bottom top,\n * that results in non grouped headers to be placed\n * at the bottom row in the table head.\n *\n * @param {Array.<Object>} headerGroups - table header groups\n */\nconst replaceHeaderPlaceholders = (headerGroups: any) => {\n  const [headerGroup] = headerGroups;\n\n  const hasPlaceholderHeaders = headerGroup.headers.some(\n    (h: any) => h.placeholderOf != null,\n  );\n  if (!hasPlaceholderHeaders) {\n    return; // no placeholder header found to replace\n  }\n\n  const maxDepth = headerGroups.length - 1;\n  const leafGroup = headerGroups[maxDepth];\n\n  headerGroup.headers.forEach((header: any, position: any) => {\n    const { placeholderOf } = header;\n\n    const isPlaceholderHeader = placeholderOf != null;\n    if (isPlaceholderHeader) {\n      // is placeholder header\n      const leafIndex =\n        leafGroup.headers\n          .slice(position)\n          .findIndex(({ id }: any) => id === placeholderOf.id) + position;\n\n      // store leaf placeholder header\n      header.variant = placeholderOf.variant;\n      header.depth = maxDepth;\n      leafGroup.headers[leafIndex] = header;\n\n      // replace placeholder with leaf header\n      placeholderOf.rowSpan = maxDepth + 1;\n      headerGroup.headers[position] = placeholderOf;\n    }\n  });\n};\n\nconst getCellProps = (column: any, isHeaderCell = false) => ({\n  groupColumnMostLeft: column.isGroupLeftColumn,\n  groupColumnMostRight: column.isGroupRightColumn,\n  rowSpan: isHeaderCell && column.rowSpan != null ? column.rowSpan : 1,\n});\n\n// props target: <table><thead><tr><th>\nconst getHeaderPropsHook = (props: any, { instance, column }: any) => {\n  const nextProps: UseHvHeaderGroupsColumnProps = instance.hasGroupedColumns\n    ? getCellProps(column, true)\n    : {};\n\n  if (instance.hasGroupedColumns) {\n    const isPlaceholder = column.placeholderOf != null;\n\n    nextProps.style = {\n      display: isPlaceholder ? \"none\" : props.style?.display,\n    };\n\n    if (instance.hasStickyColumns) {\n      if (isPlaceholder) {\n        nextProps.style.display = \"inline-flex\";\n        nextProps.style.visibility = \"hidden\";\n      }\n\n      if (column.parent || isPlaceholder) {\n        nextProps.style.marginTop = `calc(var(--cell-height) * -1)`;\n      }\n\n      if (column.rowSpan > 1) {\n        // rowSpan doesn't work with flex, so we need to simulate it by adjusting the height value manually\n        nextProps.style.height = `calc(var(--first-row-cell-height) + var(--cell-height) * ${\n          column.rowSpan - 1\n        })`;\n      }\n    }\n  }\n\n  return [props, nextProps];\n};\n\n// props target: <table><tbody><tr><td>\nconst getCellPropsHook = (props: any, { instance, cell }: any) => {\n  const nextProps: UseHvHeaderGroupsCellProps = instance.hasGroupedColumns\n    ? getCellProps(cell.column)\n    : {};\n\n  return [props, nextProps];\n};\n\nconst visibleColumnsHook = (visibleColumns: any, { instance }: any) => {\n  const parentList = new Set();\n\n  visibleColumns.forEach(({ parent }: { parent: any }) => {\n    if (parent != null && !parentList.has(parent)) {\n      parentList.add(parent);\n    }\n  });\n\n  const hasGroupedColumns = parentList.size > 0;\n  if (hasGroupedColumns) {\n    parentList.forEach((parent: any) => {\n      parent.align = \"center\";\n      parent.isGroupLeftColumn = true;\n      parent.isGroupRightColumn = true;\n\n      const { columns } = parent;\n      columns[0].isGroupLeftColumn = true;\n      columns[columns.length - 1].isGroupRightColumn = true;\n    });\n  }\n\n  Object.assign(instance, { hasGroupedColumns });\n\n  return visibleColumns;\n};\n\nconst useInstanceHook = (instance: any) => {\n  if (instance.hasGroupedColumns) {\n    replaceHeaderPlaceholders(instance.headerGroups);\n  }\n};\n\nconst useHeaderGroups: UseHvHeaderGroupsProps = (hooks) => {\n  hooks.visibleColumns.push(visibleColumnsHook);\n  hooks.useInstance.push(useInstanceHook);\n\n  // props target: <table><thead><tr><th>\n  hooks.getHeaderProps.push(getHeaderPropsHook);\n  // props target: <table><tbody><tr><td>\n  hooks.getCellProps.push(getCellPropsHook);\n};\n\nuseHeaderGroups.pluginName = \"useHvHeaderGroups\";\n\nexport default useHeaderGroups;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useHeaderGroups.js","sources":["../../../../src/Table/hooks/useHeaderGroups.ts"],"sourcesContent":["import { Hooks } from \"react-table\";\n\n// #region ##### TYPES #####\n\nexport interface UseHvHeaderGroupsInstance {\n  hasGroupedColumns?: boolean;\n}\n\n// props target: <table><thead><tr><th>\nexport interface UseHvHeaderGroupsColumnProps {\n  style?: React.CSSProperties;\n  groupColumnMostLeft?: boolean;\n  groupColumnMostRight?: boolean;\n}\n\n// props target: <table><tbody><tr><td>\nexport interface UseHvHeaderGroupsCellProps {\n  groupColumnMostLeft?: boolean;\n  groupColumnMostRight?: boolean;\n}\n\nexport type UseHvHeaderGroupsProps = (<\n  D extends object = Record<string, unknown>,\n>(\n  hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\n/**\n * Moving non grouped headers to the top level,\n * by placing them in the position of their top level placeholder.\n *\n * By default the header groups are built bottom top,\n * that results in non grouped headers to be placed\n * at the bottom row in the table head.\n *\n * @param {Array.<Object>} headerGroups - table header groups\n */\nconst replaceHeaderPlaceholders = (headerGroups: any) => {\n  const [headerGroup] = headerGroups;\n\n  const hasPlaceholderHeaders = headerGroup.headers.some(\n    (h: any) => h.placeholderOf != null,\n  );\n  if (!hasPlaceholderHeaders) {\n    return; // no placeholder header found to replace\n  }\n\n  const maxDepth = headerGroups.length - 1;\n  const leafGroup = headerGroups[maxDepth];\n\n  headerGroup.headers.forEach((header: any, position: any) => {\n    const { placeholderOf } = header;\n\n    const isPlaceholderHeader = placeholderOf != null;\n    if (isPlaceholderHeader) {\n      // is placeholder header\n      const leafIndex =\n        leafGroup.headers\n          .slice(position)\n          .findIndex(({ id }: any) => id === placeholderOf.id) + position;\n\n      // store leaf placeholder header\n      header.variant = placeholderOf.variant;\n      header.depth = maxDepth;\n      leafGroup.headers[leafIndex] = header;\n\n      // replace placeholder with leaf header\n      placeholderOf.rowSpan = maxDepth + 1;\n      headerGroup.headers[position] = placeholderOf;\n    }\n  });\n};\n\nconst getCellProps = (column: any, isHeaderCell = false) => ({\n  groupColumnMostLeft: column.isGroupLeftColumn,\n  groupColumnMostRight: column.isGroupRightColumn,\n  rowSpan: isHeaderCell && column.rowSpan != null ? column.rowSpan : 1,\n});\n\n// props target: <table><thead><tr><th>\nconst getHeaderPropsHook = (props: any, { instance, column }: any) => {\n  const nextProps: UseHvHeaderGroupsColumnProps = instance.hasGroupedColumns\n    ? getCellProps(column, true)\n    : {};\n\n  if (instance.hasGroupedColumns) {\n    const isPlaceholder = column.placeholderOf != null;\n\n    nextProps.style = {\n      display: isPlaceholder ? \"none\" : props.style?.display,\n    };\n\n    if (instance.hasStickyColumns) {\n      if (isPlaceholder) {\n        nextProps.style.display = \"inline-flex\";\n        nextProps.style.visibility = \"hidden\";\n      }\n\n      if (column.parent || isPlaceholder) {\n        nextProps.style.marginTop = `calc(var(--cell-height) * -1)`;\n      }\n\n      if (column.rowSpan > 1) {\n        // rowSpan doesn't work with flex, so we need to simulate it by adjusting the height value manually\n        nextProps.style.height = `calc(var(--first-row-cell-height) + var(--cell-height) * ${\n          column.rowSpan - 1\n        })`;\n      }\n    }\n  }\n\n  return [props, nextProps];\n};\n\n// props target: <table><tbody><tr><td>\nconst getCellPropsHook = (props: any, { instance, cell }: any) => {\n  const nextProps: UseHvHeaderGroupsCellProps = instance.hasGroupedColumns\n    ? getCellProps(cell.column)\n    : {};\n\n  return [props, nextProps];\n};\n\nconst visibleColumnsHook = (visibleColumns: any, { instance }: any) => {\n  const parentList = new Set();\n\n  visibleColumns.forEach(({ parent }: { parent: any }) => {\n    if (parent != null && !parentList.has(parent)) {\n      parentList.add(parent);\n    }\n  });\n\n  const hasGroupedColumns = parentList.size > 0;\n  if (hasGroupedColumns) {\n    parentList.forEach((parent: any) => {\n      parent.align = \"center\";\n      parent.isGroupLeftColumn = true;\n      parent.isGroupRightColumn = true;\n\n      const { columns } = parent;\n      columns[0].isGroupLeftColumn = true;\n      columns[columns.length - 1].isGroupRightColumn = true;\n    });\n  }\n\n  Object.assign(instance, { hasGroupedColumns });\n\n  return visibleColumns;\n};\n\nconst useInstanceHook = (instance: any) => {\n  if (instance.hasGroupedColumns) {\n    replaceHeaderPlaceholders(instance.headerGroups);\n  }\n};\n\nconst useHeaderGroups: UseHvHeaderGroupsProps = (hooks) => {\n  hooks.visibleColumns.push(visibleColumnsHook);\n  hooks.useInstance.push(useInstanceHook);\n\n  // props target: <table><thead><tr><th>\n  hooks.getHeaderProps.push(getHeaderPropsHook);\n  // props target: <table><tbody><tr><td>\n  hooks.getCellProps.push(getCellPropsHook);\n};\n\nuseHeaderGroups.pluginName = \"useHvHeaderGroups\";\n\nexport default useHeaderGroups;\n"],"names":[],"mappings":"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"}

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

@@ -50,8 +50,7 @@ const usePagination = (hooks) => {
   hooks.useInstance.push(useInstanceHook);
 };
 usePagination.pluginName = "useHvPagination";
-const usePagination$1 = usePagination;
 export {
-  usePagination$1 as default,
+  usePagination as default,
   defaultGetHvPaginationProps
 };