@hitachivantara/uikit-react-core 5.24.2 → 5.24.4

package/dist/types/index.d.ts

@@ -152,9 +152,9 @@ declare type Accessor<D extends object> = (originalRow: D, index: number, sub: {
 export declare const accordionClasses: {
     hidden: "HvAccordion-hidden";
     label: "HvAccordion-label";
+    root: "HvAccordion-root";
     container: "HvAccordion-container";
     disabled: "HvAccordion-disabled";
-    root: "HvAccordion-root";
 };
 
 export declare const actionBarClasses: {
@@ -168,8 +168,8 @@ export declare const actionClasses: {
 };
 
 export declare const actionsClasses: {
-    hide: "HvVerticalNavigationActions-hide";
     root: "HvVerticalNavigationActions-root";
+    hide: "HvVerticalNavigationActions-hide";
 };
 
 export declare const actionsGenericClasses: {
@@ -182,8 +182,8 @@ export declare const actionsGenericClasses: {
 };
 
 export declare const adornmentClasses: {
-    icon: "HvAdornment-icon";
     root: "HvAdornment-root";
+    icon: "HvAdornment-icon";
     adornment: "HvAdornment-adornment";
     adornmentButton: "HvAdornment-adornmentButton";
     adornmentIcon: "HvAdornment-adornmentIcon";
@@ -192,10 +192,10 @@ export declare const adornmentClasses: {
 
 export declare const appSwitcherActionClasses: {
     title: "HvAppSwitcher-Action-title";
+    root: "HvAppSwitcher-Action-root";
     typography: "HvAppSwitcher-Action-typography";
     icon: "HvAppSwitcher-Action-icon";
     disabled: "HvAppSwitcher-Action-disabled";
-    root: "HvAppSwitcher-Action-root";
     selected: "HvAppSwitcher-Action-selected";
     iconUrl: "HvAppSwitcher-Action-iconUrl";
     iconInfo: "HvAppSwitcher-Action-iconInfo";
@@ -204,8 +204,8 @@ export declare const appSwitcherActionClasses: {
 export declare const appSwitcherClasses: {
     title: "HvAppSwitcher-title";
     open: "HvAppSwitcher-open";
-    single: "HvAppSwitcher-single";
     root: "HvAppSwitcher-root";
+    single: "HvAppSwitcher-single";
     item: "HvAppSwitcher-item";
     itemSelected: "HvAppSwitcher-itemSelected";
     itemDisabled: "HvAppSwitcher-itemDisabled";
@@ -236,10 +236,10 @@ declare interface Attribute extends Record<string, unknown> {
 
 export declare const avatarClasses: {
     img: "HvAvatar-img";
-    status: "HvAvatar-status";
+    root: "HvAvatar-root";
     container: "HvAvatar-container";
+    status: "HvAvatar-status";
     square: "HvAvatar-square";
-    root: "HvAvatar-root";
     xs: "HvAvatar-xs";
     sm: "HvAvatar-sm";
     md: "HvAvatar-md";
@@ -270,8 +270,8 @@ export declare const bannerClasses: {
 };
 
 export declare const bannerContentClasses: {
-    default: "HvBannerContent-default";
     root: "HvBannerContent-root";
+    default: "HvBannerContent-default";
     warning: "HvBannerContent-warning";
     action: "HvBannerContent-action";
     error: "HvBannerContent-error";
@@ -282,9 +282,9 @@ export declare const bannerContentClasses: {
 };
 
 export declare const baseCheckBoxClasses: {
+    root: "HvBaseCheckBox-root";
     icon: "HvBaseCheckBox-icon";
     disabled: "HvBaseCheckBox-disabled";
-    root: "HvBaseCheckBox-root";
     focusVisible: "HvBaseCheckBox-focusVisible";
 };
 
@@ -293,8 +293,8 @@ export declare const baseDropdownClasses: {
     arrow: "HvBaseDropdown-arrow";
     anchor: "HvBaseDropdown-anchor";
     header: "HvBaseDropdown-header";
-    container: "HvBaseDropdown-container";
     root: "HvBaseDropdown-root";
+    container: "HvBaseDropdown-container";
     rootDisabled: "HvBaseDropdown-rootDisabled";
     headerOpen: "HvBaseDropdown-headerOpen";
     headerOpenUp: "HvBaseDropdown-headerOpenUp";
@@ -316,8 +316,8 @@ export declare const baseDropdownClasses: {
 
 export declare const baseInputClasses: {
     input: "HvBaseInput-input";
-    disabled: "HvBaseInput-disabled";
     root: "HvBaseInput-root";
+    disabled: "HvBaseInput-disabled";
     readOnly: "HvBaseInput-readOnly";
     invalid: "HvBaseInput-invalid";
     resizable: "HvBaseInput-resizable";
@@ -334,17 +334,17 @@ export declare const baseInputClasses: {
 };
 
 export declare const baseRadioClasses: {
+    root: "HvBaseRadio-root";
     icon: "HvBaseRadio-icon";
     disabled: "HvBaseRadio-disabled";
-    root: "HvBaseRadio-root";
     focusVisible: "HvBaseRadio-focusVisible";
 };
 
 export declare const baseSwitchClasses: {
     track: "HvBaseSwitch-track";
     switch: "HvBaseSwitch-switch";
-    disabled: "HvBaseSwitch-disabled";
     root: "HvBaseSwitch-root";
+    disabled: "HvBaseSwitch-disabled";
     checked: "HvBaseSwitch-checked";
     readOnly: "HvBaseSwitch-readOnly";
     focusVisible: "HvBaseSwitch-focusVisible";
@@ -394,9 +394,9 @@ export declare const bulkActionsClasses: {
 };
 
 export declare const buttonClasses: {
+    root: "HvButton-root";
     icon: "HvButton-icon";
     disabled: "HvButton-disabled";
-    root: "HvButton-root";
     startIcon: "HvButton-startIcon";
     endIcon: "HvButton-endIcon";
     focusVisible: "HvButton-focusVisible";
@@ -428,8 +428,8 @@ export declare const calendarHeaderClasses: {
 };
 
 export declare const cardClasses: {
-    icon: "HvCard-icon";
     root: "HvCard-root";
+    icon: "HvCard-icon";
     selected: "HvCard-selected";
     selectable: "HvCard-selectable";
     semanticContainer: "HvCard-semanticContainer";
@@ -457,8 +457,8 @@ export declare const cardMediaClasses: {
 export declare const carouselClasses: {
     title: "HvCarousel-title";
     main: "HvCarousel-main";
-    dot: "HvCarousel-dot";
     root: "HvCarousel-root";
+    dot: "HvCarousel-dot";
     controls: "HvCarousel-controls";
     xs: "HvCarousel-xs";
     actions: "HvCarousel-actions";
@@ -503,10 +503,10 @@ export declare const charCounterClasses: {
 
 export declare const checkBoxClasses: {
     label: "HvCheckBox-label";
-    checkbox: "HvCheckBox-checkbox";
+    root: "HvCheckBox-root";
     container: "HvCheckBox-container";
+    checkbox: "HvCheckBox-checkbox";
     disabled: "HvCheckBox-disabled";
-    root: "HvCheckBox-root";
     focusVisible: "HvCheckBox-focusVisible";
     invalidContainer: "HvCheckBox-invalidContainer";
     invalidCheckbox: "HvCheckBox-invalidCheckbox";
@@ -514,10 +514,10 @@ export declare const checkBoxClasses: {
 
 export declare const checkBoxGroupClasses: {
     label: "HvCheckBoxGroup-label";
+    root: "HvCheckBoxGroup-root";
     group: "HvCheckBoxGroup-group";
     horizontal: "HvCheckBoxGroup-horizontal";
     vertical: "HvCheckBoxGroup-vertical";
-    root: "HvCheckBoxGroup-root";
     error: "HvCheckBoxGroup-error";
     invalid: "HvCheckBoxGroup-invalid";
     selectAll: "HvCheckBoxGroup-selectAll";
@@ -582,8 +582,8 @@ export declare const createTheme: (props: HvCreateThemeProps) => HvTheme | HvThe
 
 export declare const datePickerClasses: {
     label: "HvDatePicker-label";
-    icon: "HvDatePicker-icon";
     root: "HvDatePicker-root";
+    icon: "HvDatePicker-icon";
     dropdown: "HvDatePicker-dropdown";
     action: "HvDatePicker-action";
     error: "HvDatePicker-error";
@@ -653,8 +653,8 @@ export declare const dialogActionClasses: {
 };
 
 export declare const dialogClasses: {
-    background: "HvDialog-background";
     root: "HvDialog-root";
+    background: "HvDialog-background";
     warning: "HvDialog-warning";
     error: "HvDialog-error";
     success: "HvDialog-success";
@@ -685,16 +685,16 @@ export declare const dialogTitleClasses: {
 };
 
 export declare const dotPaginationClasses: {
+    root: "HvDotPagination-root";
     radio: "HvDotPagination-radio";
     horizontal: "HvDotPagination-horizontal";
     icon: "HvDotPagination-icon";
-    root: "HvDotPagination-root";
     radioRoot: "HvDotPagination-radioRoot";
 };
 
 export declare const drawerClasses: {
-    background: "HvDrawer-background";
     root: "HvDrawer-root";
+    background: "HvDrawer-background";
     closeButton: "HvDrawer-closeButton";
     paper: "HvDrawer-paper";
 };
@@ -717,9 +717,9 @@ export declare const dropdownClasses: {
 };
 
 export declare const dropDownMenuClasses: {
+    root: "HvDropDownMenu-root";
     container: "HvDropDownMenu-container";
     icon: "HvDropDownMenu-icon";
-    root: "HvDropDownMenu-root";
     baseContainer: "HvDropDownMenu-baseContainer";
     iconSelected: "HvDropDownMenu-iconSelected";
     menuListRoot: "HvDropDownMenu-menuListRoot";
@@ -733,8 +733,8 @@ export { ds5 }
 export { EmotionContext }
 
 export declare const emptyStateClasses: {
-    container: "HvEmptyState-container";
     root: "HvEmptyState-root";
+    container: "HvEmptyState-container";
     actionContainer: "HvEmptyState-actionContainer";
     containerMessageOnly: "HvEmptyState-containerMessageOnly";
     iconContainer: "HvEmptyState-iconContainer";
@@ -749,9 +749,9 @@ export declare type ExtractNames<T extends (...args: any) => {
 }> = Partial<ReturnType<T>["classes"]>;
 
 export declare const fileClasses: {
+    root: "HvFile-root";
     progressbar: "HvFile-progressbar";
     icon: "HvFile-icon";
-    root: "HvFile-root";
     removeButton: "HvFile-removeButton";
     fail: "HvFile-fail";
     progressbarBack: "HvFile-progressbarBack";
@@ -802,8 +802,8 @@ export declare const findDescriptors: (children: any, descriptors?: {
 };
 
 export declare const focusClasses: {
-    disabled: "HvFocus-disabled";
     root: "HvFocus-root";
+    disabled: "HvFocus-disabled";
     selected: "HvFocus-selected";
     focus: "HvFocus-focus";
     focused: "HvFocus-focused";
@@ -814,8 +814,8 @@ export declare const focusClasses: {
 
 export declare const footerClasses: {
     small: "HvFooter-small";
-    separator: "HvFooter-separator";
     root: "HvFooter-root";
+    separator: "HvFooter-separator";
     name: "HvFooter-name";
     rightContainer: "HvFooter-rightContainer";
     copyright: "HvFooter-copyright";
@@ -913,11 +913,12 @@ export declare const globalActionsClasses: {
 };
 
 export declare const gridClasses: {
-    container: "HvGrid-container";
     root: "HvGrid-root";
+    container: "HvGrid-container";
     item: "HvGrid-item";
     zeroMinWidth: "HvGrid-zeroMinWidth";
     "direction-xs-column": "HvGrid-direction-xs-column";
+    "direction-xs-reverse": "HvGrid-direction-xs-reverse";
     "direction-xs-row-reverse": "HvGrid-direction-xs-row-reverse";
     "wrap-xs-nowrap": "HvGrid-wrap-xs-nowrap";
     "wrap-xs-wrap-reverse": "HvGrid-wrap-xs-wrap-reverse";
@@ -945,7 +946,6 @@ export declare const gridClasses: {
     "grid-xs-10": "HvGrid-grid-xs-10";
     "grid-xs-11": "HvGrid-grid-xs-11";
     "grid-xs-12": "HvGrid-grid-xs-12";
-    "direction-xs-reverse": "HvGrid-direction-xs-reverse";
 };
 
 export declare const headerActionsClasses: {
@@ -953,14 +953,14 @@ export declare const headerActionsClasses: {
 };
 
 export declare const headerBrandClasses: {
-    separator: "HvHeader-Brand-separator";
     root: "HvHeader-Brand-root";
+    separator: "HvHeader-Brand-separator";
 };
 
 export declare const headerClasses: {
     header: "HvHeader-header";
-    backgroundColor: "HvHeader-backgroundColor";
     root: "HvHeader-root";
+    backgroundColor: "HvHeader-backgroundColor";
 };
 
 export declare const headerNavigationClasses: {
@@ -985,7 +985,7 @@ export declare type HvAccentColors = Record<HvAccentColorKeys, string>;
  */
 export declare const HvAccordion: (props: HvAccordionProps) => JSX_2.Element;
 
-export declare type HvAccordionClasses = ExtractNames<typeof useClasses_13>;
+export declare type HvAccordionClasses = ExtractNames<typeof useClasses_15>;
 
 export declare interface HvAccordionProps extends HvBaseProps<HTMLDivElement, "onChange"> {
     /**
@@ -1040,14 +1040,14 @@ export declare interface HvAccordionProps extends HvBaseProps<HTMLDivElement, "o
 
 export declare const HvActionBar: (props: HvActionBarProps) => JSX_2.Element;
 
-export declare type HvActionBarClasses = ExtractNames<typeof useClasses_12>;
+export declare type HvActionBarClasses = ExtractNames<typeof useClasses_14>;
 
 export declare interface HvActionBarProps extends HvBaseProps {
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvActionBarClasses;
 }
 
-declare type HvActionContainerClasses = ExtractNames<typeof useClasses_59>;
+declare type HvActionContainerClasses = ExtractNames<typeof useClasses_69>;
 
 declare interface HvActionContainerProps extends HvBaseProps<HTMLButtonElement> {
     /** onClose function. */
@@ -1071,7 +1071,7 @@ export declare interface HvActionGeneric {
 
 export declare const HvActionsGeneric: (props: HvActionsGenericProps) => JSX_2.Element | null;
 
-export declare type HvActionsGenericClasses = ExtractNames<typeof useClasses_55>;
+export declare type HvActionsGenericClasses = ExtractNames<typeof useClasses_65>;
 
 export declare interface HvActionsGenericProps extends HvBaseProps {
     /** Button category. */
@@ -1101,7 +1101,7 @@ export declare interface HvActionsGenericProps extends HvBaseProps {
  */
 export declare const HvAdornment: ForwardRefExoticComponent<HvAdornmentProps & RefAttributes<HTMLDivElement | HTMLButtonElement>>;
 
-export declare type HvAdornmentClasses = ExtractNames<typeof useClasses_3>;
+export declare type HvAdornmentClasses = ExtractNames<typeof useClasses_5>;
 
 export declare interface HvAdornmentProps extends HvBaseProps<HTMLDivElement | HTMLButtonElement, "onMouseDown" | "onKeyDown"> {
     /** The icon to be added into the input. */
@@ -1143,7 +1143,7 @@ export declare interface HvAppSwitcherActionApplication {
     color?: string;
 }
 
-export declare type HvAppSwitcherActionClasses = ExtractNames<typeof useClasses_42>;
+export declare type HvAppSwitcherActionClasses = ExtractNames<typeof useClasses_51>;
 
 export declare interface HvAppSwitcherActionProps extends HvBaseProps {
     /** The application data to be used to render the Action object. */
@@ -1156,7 +1156,7 @@ export declare interface HvAppSwitcherActionProps extends HvBaseProps {
     classes?: HvAppSwitcherActionClasses;
 }
 
-export declare type HvAppSwitcherClasses = ExtractNames<typeof useClasses_41>;
+export declare type HvAppSwitcherClasses = ExtractNames<typeof useClasses_50>;
 
 export declare interface HvAppSwitcherProps extends HvBaseProps {
     /** Number of columns to render. One, two, or whatever fits the component's width. */
@@ -1193,7 +1193,7 @@ export declare type HvAtmosphereColors = Record<HvAtmosphereColorKeys, string>;
  */
 export declare const HvAvatar: (props: HvAvatarProps) => JSX_2.Element;
 
-export declare type HvAvatarClasses = ExtractNames<typeof useClasses_14>;
+export declare type HvAvatarClasses = ExtractNames<typeof useClasses_16>;
 
 export declare interface HvAvatarProps extends HvBaseProps {
     /** Inline styles to be applied to the root element. */
@@ -1244,7 +1244,7 @@ export declare type HvAvatarVariant = "circular" | "square";
  */
 export declare const HvBadge: (props: HvBadgeProps) => JSX_2.Element;
 
-export declare type HvBadgeClasses = ExtractNames<typeof useClasses_15>;
+export declare type HvBadgeClasses = ExtractNames<typeof useClasses_17>;
 
 export declare interface HvBadgeProps extends HvBaseProps {
     /**
@@ -1285,11 +1285,11 @@ export declare const HvBanner: (props: HvBannerProps) => JSX_2.Element;
 
 export declare type HvBannerActionPosition = "auto" | "inline" | "bottom-right";
 
-export declare type HvBannerClasses = ExtractNames<typeof useClasses_58>;
+export declare type HvBannerClasses = ExtractNames<typeof useClasses_68>;
 
 export declare const HvBannerContent: ForwardRefExoticComponent<Omit<HvBannerContentProps, "ref"> & RefAttributes<HTMLDivElement>>;
 
-export declare type HvBannerContentClasses = ExtractNames<typeof useClasses_60>;
+export declare type HvBannerContentClasses = ExtractNames<typeof useClasses_70>;
 
 export declare interface HvBannerContentProps extends Omit<SnackbarContentProps, "variant" | "classes" | "onClose">, HvBaseProps {
     /** The message to display. */
@@ -1357,7 +1357,7 @@ export declare type HvBannerVariant = "success" | "warning" | "error" | "default
  */
 export declare const HvBaseCheckBox: (props: HvBaseCheckBoxProps) => JSX_2.Element;
 
-export declare type HvBaseCheckBoxClasses = ExtractNames<typeof useClasses_39>;
+export declare type HvBaseCheckBoxClasses = ExtractNames<typeof useClasses_48>;
 
 export declare interface HvBaseCheckBoxProps extends Omit<CheckboxProps, "onChange" | "classes">, HvBaseProps<HTMLButtonElement, "onChange" | "color"> {
     /**
@@ -1432,7 +1432,7 @@ export declare type HvBaseColors = Record<HvBaseColorKeys, string>;
 
 export declare const HvBaseDropdown: (props: HvBaseDropdownProps) => JSX_2.Element;
 
-export declare type HvBaseDropdownClasses = ExtractNames<typeof useClasses_11>;
+export declare type HvBaseDropdownClasses = ExtractNames<typeof useClasses_13>;
 
 export declare interface HvBaseDropdownProps extends HvBaseProps<HTMLDivElement, "placeholder"> {
     /**
@@ -1521,7 +1521,7 @@ export declare interface HvBaseDropdownProps extends HvBaseProps<HTMLDivElement,
  */
 export declare const HvBaseInput: (props: HvBaseInputProps) => JSX_2.Element;
 
-export declare type HvBaseInputClasses = ExtractNames<typeof useClasses_10>;
+export declare type HvBaseInputClasses = ExtractNames<typeof useClasses_12>;
 
 export declare interface HvBaseInputProps extends Omit<InputProps, "onChange" | "classes">, HvBaseProps<HTMLDivElement, "onChange" | "color" | "onBlur" | "onFocus" | "onInvalid" | "onKeyDown" | "onKeyUp"> {
     /** The input name. */
@@ -1568,7 +1568,7 @@ export declare type HvBaseProps<E extends HTMLElement = HTMLDivElement, K extend
  */
 export declare const HvBaseRadio: (props: HvBaseRadioProps) => JSX_2.Element;
 
-export declare type HvBaseRadioClasses = ExtractNames<typeof useClasses_40>;
+export declare type HvBaseRadioClasses = ExtractNames<typeof useClasses_49>;
 
 export declare interface HvBaseRadioProps extends Omit<RadioProps, "onChange" | "classes">, HvBaseProps<HTMLButtonElement, "onChange" | "color"> {
     /**
@@ -1646,7 +1646,7 @@ export declare interface HvBaseRadioProps extends Omit<RadioProps, "onChange" |
  */
 export declare const HvBaseSwitch: (props: HvBaseSwitchProps) => JSX_2.Element;
 
-export declare type HvBaseSwitchClasses = ExtractNames<typeof useClasses_43>;
+export declare type HvBaseSwitchClasses = ExtractNames<typeof useClasses_52>;
 
 export declare interface HvBaseSwitchProps extends Omit<SwitchProps, "onChange" | "classes">, HvBaseProps<HTMLButtonElement, "onChange" | "color"> {
     /**
@@ -1736,7 +1736,7 @@ export declare type HvBoxProps = <C extends React.ElementType = "div">(props: Hv
  */
 export declare const HvBreadCrumb: (props: HvBreadCrumbProps) => JSX_2.Element;
 
-export declare type HvBreadCrumbClasses = ExtractNames<typeof useClasses_56>;
+export declare type HvBreadCrumbClasses = ExtractNames<typeof useClasses_66>;
 
 export declare interface HvBreadCrumbPathElement extends Record<string, any> {
     label: string;
@@ -1768,7 +1768,7 @@ export declare type HvBreakpoints = "xs" | "sm" | "md" | "lg" | "xl";
  */
 export declare const HvBulkActions: (props: HvBulkActionsProps) => JSX_2.Element;
 
-export declare type HvBulkActionsClasses = ExtractNames<typeof useClasses_64>;
+export declare type HvBulkActionsClasses = ExtractNames<typeof useClasses_74>;
 
 export declare type HvBulkActionsPropGetter<D extends object> = PropGetter<D, HvTAbleBulkActionsProps>;
 
@@ -1842,7 +1842,7 @@ export declare interface HvBulkActionsProps extends HvBaseProps {
  */
 export declare const HvButton: <C extends React_2.ElementType = "button">(props: HvButtonProps<C>) => React_2.ReactElement | null;
 
-export declare type HvButtonClasses = ExtractNames<typeof useClasses_16>;
+export declare type HvButtonClasses = ExtractNames<typeof useClasses_18>;
 
 export declare type HvButtonProps<C extends React_2.ElementType = "button"> = PolymorphicComponentRef<C, {
     /** Use the variant prop to change the visual style of the Button. */
@@ -1877,29 +1877,14 @@ export declare type HvButtonVariant = (typeof buttonVariant)[number];
 
 export declare const HvCalendar: (props: HvCalendarProps) => JSX_2.Element;
 
-export declare interface HvCalendarClasses {
-    root?: string;
-    rangeCalendarContainer?: string;
-    singleCalendar?: string;
-    focusSelection?: string;
-    calendarMonthlyCell?: string;
-    calendarMonthlyCellSelected?: string;
-}
+export declare type HvCalendarClasses = ExtractNames<typeof useClasses_89>;
 
 export declare const HvCalendarHeader: {
-    ({ id, value, locale, classes, onChange, showEndDate, showDayOfWeek, onFocus, invalidDateLabel, ...others }: HvCalendarHeaderProps): JSX_2.Element;
+    ({ id, value, locale, classes: classesProp, onChange, showEndDate, showDayOfWeek, onFocus, invalidDateLabel, ...others }: HvCalendarHeaderProps): JSX_2.Element;
     formElementType: string;
 };
 
-export declare interface HvCalendarHeaderClasses {
-    root?: string;
-    invalid?: string;
-    headerDayOfWeek?: string;
-    headerDate?: string;
-    input?: string;
-    inputBorderContainer?: string;
-    invalidMessageStyling?: string;
-}
+export declare type HvCalendarHeaderClasses = ExtractNames<typeof useClasses_90>;
 
 export declare interface HvCalendarHeaderProps {
     /**
@@ -2019,11 +2004,11 @@ export declare interface HvCalendarProps {
  */
 export declare const HvCard: (props: HvCardProps) => JSX_2.Element;
 
-export declare type HvCardClasses = ExtractNames<typeof useClasses_17>;
+export declare type HvCardClasses = ExtractNames<typeof useClasses_19>;
 
 export declare const HvCardContent: ({ id, classes: classesProp, className, children, onClick, ...others }: HvCardContentProps) => JSX_2.Element;
 
-export declare type HvCardContentClasses = ExtractNames<typeof useClasses_19>;
+export declare type HvCardContentClasses = ExtractNames<typeof useClasses_21>;
 
 export declare interface HvCardContentProps extends Omit<CardContentProps, "classes">, HvBaseProps {
     /** Id to be applied to the root node. */
@@ -2036,7 +2021,7 @@ export declare interface HvCardContentProps extends Omit<CardContentProps, "clas
 
 export declare const HvCardHeader: ({ classes: classesProp, className, title, subheader, icon, onClick, ...others }: HvCardHeaderProps) => JSX_2.Element;
 
-export declare type HvCardHeaderClasses = ExtractNames<typeof useClasses_18>;
+export declare type HvCardHeaderClasses = ExtractNames<typeof useClasses_20>;
 
 export declare interface HvCardHeaderProps extends Omit<CardHeaderProps, "classes">, HvBaseProps<HTMLDivElement, "title"> {
     /** The renderable content inside the title slot of the header. */
@@ -2053,7 +2038,7 @@ export declare interface HvCardHeaderProps extends Omit<CardHeaderProps, "classe
 
 export declare const HvCardMedia: ({ id, classes: classesProp, className, children, title, onClick, ...others }: HvCardMediaProps) => JSX_2.Element;
 
-export declare type HvCardMediaClasses = ExtractNames<typeof useClasses_20>;
+export declare type HvCardMediaClasses = ExtractNames<typeof useClasses_22>;
 
 export declare interface HvCardMediaProps extends Omit<CardMediaProps, "classes">, ImgHTMLAttributes<HTMLDivElement>, HvBaseProps<HTMLDivElement, "onClick" | "title"> {
     /** Id to be applied to the root node. */
@@ -2094,13 +2079,13 @@ export declare interface HvCardProps extends HvBaseProps {
  */
 export declare const HvCarousel: (props: HvCarouselProps) => JSX_2.Element;
 
-export declare type HvCarouselClasses = ExtractNames<typeof useClasses_90>;
+export declare type HvCarouselClasses = ExtractNames<typeof useClasses_102>;
 
 export declare const HvCarouselControls: (props: HvCarouselControlsProps) => JSX_2.Element;
 
 declare interface HvCarouselControlsProps extends HvBaseProps<HTMLDivElement>, Pick<HvPaginationProps, "page" | "pages" | "canPrevious" | "canNext"> {
     showDots?: boolean;
-    classes?: ExtractNames<typeof useClasses_90>;
+    classes?: ExtractNames<typeof useClasses_102>;
     actions?: ReactNode;
     onPreviousClick?: MouseEventHandler<HTMLButtonElement>;
     onNextClick?: MouseEventHandler<HTMLButtonElement>;
@@ -2147,7 +2132,7 @@ export declare interface HvCarouselProps extends HvBaseProps<HTMLDivElement, "ti
  */
 export declare const HvCarouselSlide: ({ classes: classesProp, className, children, size: flexBasis, src, alt, ...props }: HvCarouselSlideProps) => JSX_2.Element;
 
-export declare type HvCarouselSlideClasses = ExtractNames<typeof useClasses_91>;
+export declare type HvCarouselSlideClasses = ExtractNames<typeof useClasses_103>;
 
 export declare interface HvCarouselSlideProps extends ImgHTMLAttributes<HTMLImageElement> {
     /** A Jss Object used to override or extend the styles applied. */
@@ -2162,7 +2147,7 @@ export declare const HvCarouselThumbnails: ForwardRefExoticComponent<HvCarouselT
 
 declare interface HvCarouselThumbnailsProps extends HvBaseProps<HTMLDivElement, "children">, Pick<HvPaginationProps, "page" | "pages" | "canPrevious" | "canNext"> {
     width?: CSSProperties["width"];
-    classes?: ExtractNames<typeof useClasses_90>;
+    classes?: ExtractNames<typeof useClasses_102>;
     onThumbnailClick?: (event: MouseEvent_2<HTMLButtonElement>, index: number) => void;
     thumbnailProps?: Partial<HvButtonProps>;
     showDots?: boolean;
@@ -2196,7 +2181,7 @@ export declare interface HvCellProps<D extends object = Record<string, unknown>,
  */
 export declare const HvCharCounter: (props: HvCharCounterProps) => JSX_2.Element;
 
-export declare type HvCharCounterClasses = ExtractNames<typeof useClasses_2>;
+export declare type HvCharCounterClasses = ExtractNames<typeof useClasses_4>;
 
 export declare interface HvCharCounterProps extends HvBaseProps {
     /** The string that separates the current char quantity from the max quantity. */
@@ -2224,14 +2209,14 @@ export declare interface HvCharCounterProps extends HvBaseProps {
  */
 export declare const HvCheckBox: (props: HvCheckBoxProps) => JSX_2.Element;
 
-export declare type HvCheckBoxClasses = ExtractNames<typeof useClasses_44>;
+export declare type HvCheckBoxClasses = ExtractNames<typeof useClasses_53>;
 
 /**
  * A checkbox group is a type of selection list that allows the user to select multiple options through the use of checkboxes.
  */
 export declare const HvCheckBoxGroup: (props: HvCheckBoxGroupProps) => JSX_2.Element;
 
-export declare type HvCheckBoxGroupClasses = ExtractNames<typeof useClasses_49>;
+export declare type HvCheckBoxGroupClasses = ExtractNames<typeof useClasses_59>;
 
 export declare interface HvCheckBoxGroupProps extends HvBaseProps<HTMLDivElement, "onChange"> {
     /**
@@ -2359,7 +2344,7 @@ export declare type HvClickOutsideEvent = MouseEvent | KeyboardEvent | TouchEven
  */
 export declare const HvColorPicker: (props: HvColorPickerProps) => JSX_2.Element;
 
-export declare type HvColorPickerClasses = ExtractNames<typeof useClasses_89>;
+export declare type HvColorPickerClasses = ExtractNames<typeof useClasses_101>;
 
 export declare interface HvColorPickerProps {
     "aria-label"?: string;
@@ -2474,7 +2459,7 @@ declare type HvColumnWithStrictAccessor<D extends object = Record<string, unknow
 
 export declare const HvContainer: ForwardRefExoticComponent<Omit<HvContainerProps, "ref"> & RefAttributes<HTMLDivElement>>;
 
-export declare type HvContainerClasses = ExtractNames<typeof useClasses_21>;
+export declare type HvContainerClasses = ExtractNames<typeof useClasses_23>;
 
 export declare interface HvContainerProps extends Omit<ContainerProps, "classes">, HvBaseProps {
     /**
@@ -2503,7 +2488,7 @@ export declare interface HvContainerProps extends Omit<ContainerProps, "classes"
 
 export declare const HvControls: (props: HvControlsProps) => JSX_2.Element;
 
-export declare type HvControlsClasses = ExtractNames<typeof useClasses_76>;
+export declare type HvControlsClasses = ExtractNames<typeof useClasses_86>;
 
 export declare interface HvControlsProps extends HvBaseProps {
     /**
@@ -2588,7 +2573,7 @@ export declare interface HvDateColumnCellProp {
  */
 export declare const HvDatePicker: (props: HvDatePickerProps) => JSX_2.Element;
 
-export declare type HvDatePickerClasses = ExtractNames<typeof useClasses_81>;
+export declare type HvDatePickerClasses = ExtractNames<typeof useClasses_93>;
 
 export declare interface HvDatePickerProps extends HvBaseProps<HTMLDivElement, "onChange"> {
     /**
@@ -2762,7 +2747,7 @@ export declare type HvDatePickerStatus = HvFormStatus;
 
 export declare const HvDialog: (props: HvDialogProps) => JSX_2.Element;
 
-export declare type HvDialogActionClasses = ExtractNames<typeof useClasses_24>;
+export declare type HvDialogActionClasses = ExtractNames<typeof useClasses_26>;
 
 export declare const HvDialogActions: (props: HvDialogActionsProps) => JSX_2.Element;
 
@@ -2773,11 +2758,11 @@ export declare interface HvDialogActionsProps extends Omit<DialogActionsProps, "
     classes?: HvDialogActionClasses;
 }
 
-export declare type HvDialogClasses = ExtractNames<typeof useClasses_25>;
+export declare type HvDialogClasses = ExtractNames<typeof useClasses_27>;
 
 export declare const HvDialogContent: (props: HvDialogContentProps) => JSX_2.Element;
 
-export declare type HvDialogContentClasses = ExtractNames<typeof useClasses_23>;
+export declare type HvDialogContentClasses = ExtractNames<typeof useClasses_25>;
 
 export declare interface HvDialogContentProps extends Omit<DialogContentProps, "classes">, HvBaseProps {
     /** Content should be indented in relationship to the Dialog title. */
@@ -2817,7 +2802,7 @@ export declare interface HvDialogProps extends Omit<DialogProps, "fullScreen" |
 
 export declare const HvDialogTitle: (props: HvDialogTitleProps) => JSX_2.Element;
 
-export declare type HvDialogTitleClasses = ExtractNames<typeof useClasses_22>;
+export declare type HvDialogTitleClasses = ExtractNames<typeof useClasses_24>;
 
 export declare interface HvDialogTitleProps extends Omit<DialogTitleProps, "variant" | "classes">, HvBaseProps<HTMLSpanElement, "color"> {
     /** Variant of the dialog title. */
@@ -2838,7 +2823,7 @@ export declare type HvDialogTitleVariant = "success" | "warning" | "error" | "in
  */
 export declare const HvDotPagination: (props: HvDotPaginationProps) => JSX_2.Element;
 
-export declare type HvDotPaginationClasses = ExtractNames<typeof useClasses_57>;
+export declare type HvDotPaginationClasses = ExtractNames<typeof useClasses_67>;
 
 export declare interface HvDotPaginationProps extends Omit<HvRadioGroupProps, "classes"> {
     /**
@@ -2882,7 +2867,7 @@ export declare interface HvDotPaginationProps extends Omit<HvRadioGroupProps, "c
  */
 export declare const HvDrawer: (props: HvDrawerProps) => JSX_2.Element;
 
-export declare type HvDrawerClasses = ExtractNames<typeof useClasses_26>;
+export declare type HvDrawerClasses = ExtractNames<typeof useClasses_28>;
 
 export declare interface HvDrawerProps extends DrawerProps, Omit<DrawerProps, "classes">, HvBaseProps<HTMLDivElement> {
     /**
@@ -2926,7 +2911,7 @@ export declare interface HvDrawerProps extends DrawerProps, Omit<DrawerProps, "c
  */
 export declare const HvDropdown: (props: HvDropdownProps) => JSX_2.Element;
 
-export declare type HvDropdownClasses = ExtractNames<typeof useClasses_66>;
+export declare type HvDropdownClasses = ExtractNames<typeof useClasses_76>;
 
 export declare function hvDropdownColumn<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer>(col: HvTableColumnConfig<D, H>, id: string, placeholder: string, disabledPlaceholder: string, onChange?: (identifier: string, value: HvListValue) => void): HvTableColumnConfig<D, H>;
 
@@ -2972,7 +2957,7 @@ export declare interface HvDropdownLabelsProps {
     searchPlaceholder?: string;
 }
 
-declare type HvDropdownListClasses = ExtractNames<typeof useClasses_67>;
+declare type HvDropdownListClasses = ExtractNames<typeof useClasses_77>;
 
 declare interface HvDropdownListProps {
     /**
@@ -3047,7 +3032,7 @@ declare interface HvDropdownListProps {
  */
 export declare const HvDropDownMenu: (props: HvDropDownMenuProps) => JSX_2.Element;
 
-export declare type HvDropDownMenuClasses = ExtractNames<typeof useClasses_53>;
+export declare type HvDropDownMenuClasses = ExtractNames<typeof useClasses_63>;
 
 export declare interface HvDropDownMenuProps extends HvBaseProps<HTMLDivElement, "onClick"> {
     /** Icon. */
@@ -3312,7 +3297,7 @@ declare interface HvDropZoneLabels {
  */
 export declare const HvEmptyState: (props: HvEmptyStateProps) => JSX_2.Element;
 
-export declare type HvEmptyStateClasses = ExtractNames<typeof useClasses_27>;
+export declare type HvEmptyStateClasses = ExtractNames<typeof useClasses_29>;
 
 export declare interface HvEmptyStateProps extends HvBaseProps<HTMLDivElement, "title"> {
     /** Icon to be presented. */
@@ -3340,7 +3325,7 @@ export { HvExtraProps }
 
 export declare const HvFile: ({ id, classes: classesProp, data, onFileRemoved, removeFileButtonLabel, }: HvFileProps) => JSX_2.Element;
 
-export declare type HvFileClasses = ExtractNames<typeof useClasses_52>;
+export declare type HvFileClasses = ExtractNames<typeof useClasses_62>;
 
 export declare interface HvFileData extends Omit<File, "name" | "size"> {
     /**
@@ -3421,7 +3406,7 @@ export declare interface HvFileUploaderLabels extends HvDropZoneLabels {
  */
 export declare const HvFileUploaderPreview: ({ className, children, classes: classesProp, disableOverlay, onUnload, onClick, ...others }: HvFileUploaderPreviewProps) => JSX_2.Element;
 
-export declare type HvFileUploaderPreviewClasses = ExtractNames<typeof useClasses_51>;
+export declare type HvFileUploaderPreviewClasses = ExtractNames<typeof useClasses_61>;
 
 export declare interface HvFileUploaderPreviewProps extends Omit<HvButtonProps, "children" | "classes"> {
     /**
@@ -3496,9 +3481,9 @@ export declare interface HvFileUploaderProps extends HvBaseProps {
  */
 export declare const HvFilterGroup: (props: HvFilterGroupProps) => JSX_2.Element;
 
-export declare type HvFilterGroupClasses = ExtractNames<typeof useClasses_79>;
+export declare type HvFilterGroupClasses = ExtractNames<typeof useClasses_91>;
 
-declare type HvFilterGroupContentClasses = ExtractNames<typeof useClasses_80>;
+declare type HvFilterGroupContentClasses = ExtractNames<typeof useClasses_92>;
 
 declare interface HvFilterGroupContentProps extends Omit<HvBaseDropdownProps, "onChange"> {
     description?: React.ReactNode;
@@ -3654,7 +3639,7 @@ export declare type HvFocusStrategies = "listbox" | "menu" | "card" | "grid";
  */
 export declare const HvFooter: (props: HvFooterProps) => JSX_2.Element;
 
-export declare type HvFooterClasses = ExtractNames<typeof useClasses_28>;
+export declare type HvFooterClasses = ExtractNames<typeof useClasses_30>;
 
 declare type HvFooterPropGetter<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer> = HvPropGetter<D, H, HvUseTableFooterProps, {
     column: HvHeaderGroup<D, H>;
@@ -3677,7 +3662,7 @@ export declare const HvFormElement: {
     formElementType: string;
 };
 
-export declare type HvFormElementClasses = ExtractNames<typeof useClasses_4>;
+export declare type HvFormElementClasses = ExtractNames<typeof useClasses_6>;
 
 export declare const HvFormElementContext: React_2.Context<{
     elementId?: string | undefined;
@@ -3774,7 +3759,7 @@ export declare type HvFormStatus = "standBy" | "valid" | "invalid" | "empty";
  */
 export declare const HvGlobalActions: (props: HvGlobalActionsProps) => JSX_2.Element;
 
-export declare type HvGlobalActionsClasses = ExtractNames<typeof useClasses_65>;
+export declare type HvGlobalActionsClasses = ExtractNames<typeof useClasses_75>;
 
 export declare type HvGlobalActionsHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
 
@@ -3826,41 +3811,7 @@ export declare type HvGlobalActionsVariant = "global" | "section";
  */
 export declare const HvGrid: ForwardRefExoticComponent<Omit<HvGridProps, "ref"> & RefAttributes<HTMLDivElement>>;
 
-export declare interface HvGridClasses {
-    root?: string;
-    container?: string;
-    item?: string;
-    zeroMinWidth?: string;
-    "direction-xs-column"?: string;
-    "direction-xs-reverse"?: string;
-    "direction-xs-row-reverse"?: string;
-    "wrap-xs-nowrap"?: string;
-    "wrap-xs-wrap-reverse"?: string;
-    "spacing-xs-1"?: string;
-    "spacing-xs-2"?: string;
-    "spacing-xs-3"?: string;
-    "spacing-xs-4"?: string;
-    "spacing-xs-5"?: string;
-    "spacing-xs-6"?: string;
-    "spacing-xs-7"?: string;
-    "spacing-xs-8"?: string;
-    "spacing-xs-9"?: string;
-    "spacing-xs-10"?: string;
-    "grid-xs-auto"?: string;
-    "grid-xs-true"?: string;
-    "grid-xs-1"?: string;
-    "grid-xs-2"?: string;
-    "grid-xs-3"?: string;
-    "grid-xs-4"?: string;
-    "grid-xs-5"?: string;
-    "grid-xs-6"?: string;
-    "grid-xs-7"?: string;
-    "grid-xs-8"?: string;
-    "grid-xs-9"?: string;
-    "grid-xs-10"?: string;
-    "grid-xs-11"?: string;
-    "grid-xs-12"?: string;
-}
+export declare type HvGridClasses = ExtractNames<typeof useClasses_31>;
 
 export declare type HvGridDirection = "row" | "row-reverse" | "column" | "column-reverse";
 
@@ -3960,7 +3911,7 @@ export declare const HvHeader: (props: HvHeaderProps) => JSX_2.Element;
 
 export declare const HvHeaderActions: (props: HvHeaderActionsProps) => JSX_2.Element;
 
-export declare type HvHeaderActionsClasses = ExtractNames<typeof useClasses_30>;
+export declare type HvHeaderActionsClasses = ExtractNames<typeof useClasses_33>;
 
 export declare interface HvHeaderActionsProps extends HvBaseProps {
     classes?: HvHeaderActionsClasses;
@@ -3971,7 +3922,7 @@ export declare interface HvHeaderActionsProps extends HvBaseProps {
  */
 export declare const HvHeaderBrand: (props: HvHeaderBrandProps) => JSX_2.Element;
 
-export declare type HvHeaderBrandClasses = ExtractNames<typeof useClasses_31>;
+export declare type HvHeaderBrandClasses = ExtractNames<typeof useClasses_34>;
 
 export declare interface HvHeaderBrandProps extends HvBaseProps {
     logo?: React.ReactNode;
@@ -3979,7 +3930,7 @@ export declare interface HvHeaderBrandProps extends HvBaseProps {
     classes?: HvHeaderBrandClasses;
 }
 
-export declare type HvHeaderClasses = ExtractNames<typeof useClasses_29>;
+export declare type HvHeaderClasses = ExtractNames<typeof useClasses_32>;
 
 declare interface HvHeaderGroup<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer> extends HvColumnInstance<D, H>, Omit<UseTableHeaderGroupProps<D>, "headers"> {
     headers: Array<HvHeaderGroup<D, H>>;
@@ -3997,7 +3948,7 @@ declare interface HvHeaderMenuBarProps extends HvBaseProps<HTMLDivElement, "onCl
 
 export declare const HvHeaderMenuItem: ({ id, item, type, onClick, levels, currentLevel, classes: classesProp, className, }: HvHeaderMenuItemProps) => JSX_2.Element;
 
-declare type HvHeaderMenuItemClasses = ExtractNames<typeof useClasses_32>;
+declare type HvHeaderMenuItemClasses = ExtractNames<typeof useClasses_35>;
 
 declare interface HvHeaderMenuItemProps extends HvBaseProps<HTMLDivElement, "onClick"> {
     item: HvHeaderNavigationItemProp;
@@ -4010,7 +3961,7 @@ declare interface HvHeaderMenuItemProps extends HvBaseProps<HTMLDivElement, "onC
 
 export declare const HvHeaderNavigation: (props: HvHeaderNavigationProps) => JSX_2.Element;
 
-export declare type HvHeaderNavigationClasses = ExtractNames<typeof useClasses_33>;
+export declare type HvHeaderNavigationClasses = ExtractNames<typeof useClasses_36>;
 
 export declare interface HvHeaderNavigationItemProp {
     id: string;
@@ -4026,6 +3977,11 @@ export declare interface HvHeaderNavigationProps extends HvBaseProps<HTMLDivElem
     selected?: string;
     onClick?: (event: MouseEvent_2, selection: HvHeaderNavigationItemProp) => void;
     classes?: HvHeaderNavigationClasses;
+    /**
+     * The number of levels to show: the first level (1) or the first and second level (2).
+     *
+     * Defaults to `2`.
+     * */
     levels?: 1 | 2;
 }
 
@@ -4064,14 +4020,14 @@ export declare interface HvHooks<D extends object = Record<string, unknown>, H e
     useFinalInstance: Array<(instance: HvTableInstance<D, H>) => void>;
 }
 
-export declare type HvHorizontalScrollListItemClasses = ExtractNames<typeof useClasses_84>;
+export declare type HvHorizontalScrollListItemClasses = ExtractNames<typeof useClasses_96>;
 
 /**
  * Provides the user with additional descriptive text for the form element.
  */
 export declare const HvInfoMessage: (props: HvInfoMessageProps) => JSX_2.Element;
 
-export declare type HvInfoMessageClasses = ExtractNames<typeof useClasses_6>;
+export declare type HvInfoMessageClasses = ExtractNames<typeof useClasses_8>;
 
 export declare interface HvInfoMessageProps extends HvTypographyProps<"label"> {
     /** If `true` the label is disabled. */
@@ -4088,7 +4044,7 @@ export declare interface HvInfoMessageProps extends HvTypographyProps<"label"> {
  */
 export declare const HvInlineEditor: (props: HvInlineEditorProps) => JSX_2.Element;
 
-export declare type HvInlineEditorClasses = ExtractNames<typeof useClasses_86>;
+export declare type HvInlineEditorClasses = ExtractNames<typeof useClasses_98>;
 
 export declare interface HvInlineEditorProps extends HvBaseProps<HTMLDivElement, "onBlur" | "onChange"> {
     /** The value of the form element. */
@@ -4116,7 +4072,7 @@ export declare interface HvInlineEditorProps extends HvBaseProps<HTMLDivElement,
  */
 export declare const HvInput: React_2.ForwardRefExoticComponent<HvInputProps & React_2.RefAttributes<InputElement>>;
 
-export declare type HvInputClasses = ExtractNames<typeof useClasses_45>;
+export declare type HvInputClasses = ExtractNames<typeof useClasses_54>;
 
 export declare interface HvInputLabels {
     /** The label of the clear button. */
@@ -4275,18 +4231,7 @@ export declare interface HvKnobProperty {
  */
 export declare const HvKpi: (props: HvKpiProps) => JSX_2.Element;
 
-export declare interface HvKpiClasses {
-    root?: string;
-    visualIndicatorContainer?: string;
-    comparisons?: string;
-    comparisonContainer?: string;
-    comparisonComposition?: string;
-    indicatorsContainer?: string;
-    indicatorText?: string;
-    indicatorUnit?: string;
-    spacingToTheRight?: string;
-    trendLine?: string;
-}
+export declare type HvKpiClasses = ExtractNames<typeof useClasses_37>;
 
 export declare interface HvKpiLabelProps {
     /**
@@ -4343,7 +4288,7 @@ export declare interface HvKpiProps extends HvBaseProps<HTMLDivElement, "childre
  */
 export declare const HvLabel: (props: HvLabelProps) => JSX_2.Element;
 
-export declare type HvLabelClasses = ExtractNames<typeof useClasses_5>;
+export declare type HvLabelClasses = ExtractNames<typeof useClasses_7>;
 
 export declare interface HvLabelProps extends HvTypographyProps<"label"> {
     /** Id to be applied to the root node */
@@ -4362,7 +4307,7 @@ export declare interface HvLabelProps extends HvTypographyProps<"label"> {
 
 export declare const HvLeftControl: ({ id, classes: classesProp, className, children, placeholder, onSearch, hideSearch, searchProps, ...others }: HvLeftControlProps) => JSX_2.Element;
 
-export declare type HvLeftControlClasses = ExtractNames<typeof useClasses_77>;
+export declare type HvLeftControlClasses = ExtractNames<typeof useClasses_87>;
 
 export declare interface HvLeftControlProps extends HvBaseProps {
     /** if `true` the hide sort by dropdown is not rendered */
@@ -4379,9 +4324,7 @@ export declare interface HvLeftControlProps extends HvBaseProps {
 
 export declare const HvLink: (props: HvLinkProps) => JSX_2.Element;
 
-export declare interface HvLinkClasses {
-    a?: string;
-}
+export declare type HvLinkClasses = ExtractNames<typeof useClasses_38>;
 
 export declare interface HvLinkProps extends HvBaseProps<HTMLAnchorElement, "onClick"> {
     onClick?: (event: MouseEventHandler<HTMLAnchorElement>, data: any) => void | undefined;
@@ -4427,9 +4370,7 @@ export declare interface HvListClasses {
  */
 export declare const HvListContainer: React_2.ForwardRefExoticComponent<HvListContainerProps & React_2.RefAttributes<unknown>>;
 
-export declare interface HvListContainerClasses {
-    root?: string;
-}
+export declare type HvListContainerClasses = ExtractNames<typeof useClasses_2>;
 
 export declare interface HvListContainerProps extends HvBaseProps<HTMLUListElement> {
     /**
@@ -4450,24 +4391,11 @@ export declare interface HvListContainerProps extends HvBaseProps<HTMLUListEleme
  */
 export declare const HvListItem: (props: HvListItemProps) => JSX_2.Element;
 
-export declare interface HvListItemClasses {
-    root?: string;
-    focus?: string;
-    startAdornment?: string;
-    endAdornment?: string;
-    gutters?: string;
-    condensed?: string;
-    interactive?: string;
-    selected?: string;
-    disabled?: string;
-    withStartAdornment?: string;
-    withEndAdornment?: string;
-}
+export declare type HvListItemClasses = ExtractNames<typeof useClasses_3>;
 
 export declare interface HvListItemProps extends HvBaseProps<HTMLLIElement> {
     /**
      * Overrides the implicit list item role.
-     * It defaults to "option" if unspecified and the container list role is "listbox".
      */
     role?: string;
     /** Indicates if the list item is selected. */
@@ -4586,7 +4514,7 @@ export declare interface HvListValue extends HvExtraProps {
  */
 export declare const HvLoading: (props: HvLoadingProps) => JSX_2.Element;
 
-export declare type HvLoadingClasses = ExtractNames<typeof useClasses_34>;
+export declare type HvLoadingClasses = ExtractNames<typeof useClasses_39>;
 
 export declare interface HvLoadingProps extends HvBaseProps {
     /** Indicates if the component should be render in a small size. */
@@ -4605,7 +4533,7 @@ export declare interface HvLoadingProps extends HvBaseProps {
  */
 export declare const HvLogin: (props: HvLoginProps) => JSX_2.Element;
 
-export declare type HvLoginClasses = ExtractNames<typeof useClasses_75>;
+export declare type HvLoginClasses = ExtractNames<typeof useClasses_85>;
 
 export declare interface HvLoginProps extends HvBaseProps {
     /**
@@ -4674,12 +4602,7 @@ export declare const hvNumberFallback: (value: any) => number | "—";
  */
 export declare const HvOverflowTooltip: (props: HvOverflowTooltipProps) => JSX_2.Element;
 
-export declare interface HvOverflowTooltipClasses {
-    root?: string;
-    tooltipAnchor?: string;
-    tooltipAnchorParagraph?: string;
-    tooltipData?: string;
-}
+export declare type HvOverflowTooltipClasses = ExtractNames<typeof useClasses_47>;
 
 export declare interface HvOverflowTooltipProps extends HvBaseProps {
     /** The node that will be rendered inside the tooltip. */
@@ -4702,7 +4625,7 @@ export declare interface HvOverflowTooltipProps extends HvBaseProps {
  */
 export declare const HvPagination: (props: HvPaginationProps) => JSX_2.Element;
 
-export declare type HvPaginationClasses = ExtractNames<typeof useClasses_54>;
+export declare type HvPaginationClasses = ExtractNames<typeof useClasses_64>;
 
 export declare interface HvPaginationLabels {
     /** The show label. */
@@ -4775,7 +4698,7 @@ export declare interface HvPaginationProps extends HvBaseProps {
  */
 export declare const HvPanel: (props: HvPanelProps) => JSX_2.Element;
 
-export declare type HvPanelClasses = ExtractNames<typeof useClasses_35>;
+export declare type HvPanelClasses = ExtractNames<typeof useClasses_40>;
 
 export declare interface HvPanelProps extends HvBaseProps {
     /** A Jss Object used to override or extend the styles applied. */
@@ -4786,7 +4709,7 @@ export declare type HvPolarizedColorKeys = "positive" | "positive_120" | "positi
 
 export declare const HvProgressBar: (props: HvProgressBarProps) => JSX_2.Element;
 
-export declare type HvProgressBarClasses = ExtractNames<typeof useClasses_36>;
+export declare type HvProgressBarClasses = ExtractNames<typeof useClasses_41>;
 
 /**
  * ProgressBar provides feedback about a process that is taking place in the application.
@@ -4889,7 +4812,7 @@ export declare interface HvProviderProps {
  */
 export declare const HvQueryBuilder: (props: HvQueryBuilderProps) => JSX_2.Element;
 
-export declare type HvQueryBuilderClasses = ExtractNames<typeof useClasses_88>;
+export declare type HvQueryBuilderClasses = ExtractNames<typeof useClasses_100>;
 
 export declare interface HvQueryBuilderProps {
     attributes?: Record<string, Attribute>;
@@ -4940,7 +4863,7 @@ export declare interface HvQueryBuilderProps {
  */
 export declare const HvRadio: (props: HvRadioProps) => JSX_2.Element;
 
-export declare type HvRadioClasses = ExtractNames<typeof useClasses_47>;
+export declare type HvRadioClasses = ExtractNames<typeof useClasses_56>;
 
 /**
  * A group of radio buttons.
@@ -4949,7 +4872,7 @@ export declare type HvRadioClasses = ExtractNames<typeof useClasses_47>;
  */
 export declare const HvRadioGroup: (props: HvRadioGroupProps) => JSX_2.Element;
 
-export declare type HvRadioGroupClasses = ExtractNames<typeof useClasses_50>;
+export declare type HvRadioGroupClasses = ExtractNames<typeof useClasses_60>;
 
 export declare interface HvRadioGroupProps extends HvBaseProps<HTMLDivElement, "onChange"> {
     /**
@@ -5140,7 +5063,7 @@ export declare type HvRadioStatus = "standBy" | "valid" | "invalid";
 
 export declare const HvRightControl: ({ id, classes: classesProp, className, children, values, onSort, hideSortBy, sortProps, ...others }: HvRightControlProps) => JSX_2.Element;
 
-export declare type HvRightControlClasses = ExtractNames<typeof useClasses_78>;
+export declare type HvRightControlClasses = ExtractNames<typeof useClasses_88>;
 
 export declare interface HvRightControlProps extends HvBaseProps {
     /** if `true` the hide sort by dropdown is not rendered */
@@ -5179,7 +5102,7 @@ declare type HvRowPropGetter<D extends object = Record<string, unknown>, H exten
  */
 export declare const HvScrollToHorizontal: (props: HvScrollToHorizontalProps) => JSX_2.Element;
 
-export declare type HvScrollToHorizontalClasses = ExtractNames<typeof useClasses_85>;
+export declare type HvScrollToHorizontalClasses = ExtractNames<typeof useClasses_97>;
 
 export declare interface HvScrollToHorizontalOption {
     key?: string;
@@ -5232,7 +5155,7 @@ export declare type HvScrollToTooltipPositions = "left" | "right" | "top" | "bot
  */
 export declare const HvScrollToVertical: (props: HvScrollToVerticalProps) => JSX_2.Element;
 
-export declare type HvScrollToVerticalClasses = ExtractNames<typeof useClasses_83>;
+export declare type HvScrollToVerticalClasses = ExtractNames<typeof useClasses_95>;
 
 export declare interface HvScrollToVerticalOption {
     key?: string;
@@ -5286,7 +5209,7 @@ export declare interface HvScrollToVerticalProps extends HvBaseProps<HTMLOListEl
  */
 export declare const HvSelectionList: (props: HvSelectionListProps) => JSX_2.Element;
 
-export declare type HvSelectionListClasses = ExtractNames<typeof useClasses_8>;
+export declare type HvSelectionListClasses = ExtractNames<typeof useClasses_10>;
 
 export declare interface HvSelectionListProps extends HvBaseProps<HTMLUListElement, "onChange"> {
     /** The form element name. */
@@ -5539,11 +5462,11 @@ export declare interface HvSliderProps extends HvBaseProps<HTMLDivElement, "onCh
  */
 export declare const HvSnackbar: ({ classes: classesProp, className, id, open, onClose, label, anchorOrigin, autoHideDuration, variant, showIcon, customIcon, action, actionCallback, transitionDuration, transitionDirection, offset, snackbarContentProps, ...others }: HvSnackbarProps) => JSX_2.Element;
 
-export declare type HvSnackbarClasses = ExtractNames<typeof useClasses_61>;
+export declare type HvSnackbarClasses = ExtractNames<typeof useClasses_71>;
 
 export declare const HvSnackbarContent: ForwardRefExoticComponent<Omit<HvSnackbarContentProps, "ref"> & RefAttributes<HTMLDivElement>>;
 
-export declare type HvSnackbarContentClasses = ExtractNames<typeof useClasses_62>;
+export declare type HvSnackbarContentClasses = ExtractNames<typeof useClasses_72>;
 
 export declare interface HvSnackbarContentProps extends Omit<SnackbarContentProps, "variant" | "action" | "classes">, HvBaseProps {
     /** The message to display. */
@@ -5597,7 +5520,7 @@ export declare interface HvSnackbarProps extends Omit<SnackbarProps, "action" |
 
 export declare const HvSnackbarProvider: ({ children, notistackClassesOverride, maxSnack, autoHideDuration, anchorOrigin, classes: classesProp, className, ...others }: HvSnackbarProviderProps) => JSX_2.Element;
 
-export declare type HvSnackbarProviderClasses = ExtractNames<typeof useClasses_63>;
+export declare type HvSnackbarProviderClasses = ExtractNames<typeof useClasses_73>;
 
 export declare interface HvSnackbarProviderProps {
     /** Your component tree. */
@@ -5627,7 +5550,7 @@ export declare const HvStack: (props: HvStackProps) => JSX_2.Element;
 export declare interface HvStackBreakpoints extends Record<HvBreakpoints, string> {
 }
 
-export declare type HvStackClasses = ExtractNames<typeof useClasses_37>;
+export declare type HvStackClasses = ExtractNames<typeof useClasses_42>;
 
 export declare type HvStackDirection = "column" | "row" | Partial<HvStackBreakpoints>;
 
@@ -5660,7 +5583,7 @@ export declare interface HvSuggestion {
 
 export declare const HvSuggestions: React_2.ForwardRefExoticComponent<HvSuggestionsProps & React_2.RefAttributes<unknown>>;
 
-export declare type HvSuggestionsClasses = ExtractNames<typeof useClasses_9>;
+export declare type HvSuggestionsClasses = ExtractNames<typeof useClasses_11>;
 
 export declare interface HvSuggestionsProps extends HvBaseProps {
     /** Whether suggestions is visible. */
@@ -5689,7 +5612,7 @@ export declare type HvSupportColors = Record<HvSupportColorKeys, string>;
  */
 export declare const HvSwitch: (props: HvSwitchProps) => JSX_2.Element;
 
-export declare type HvSwitchClasses = ExtractNames<typeof useClasses_46>;
+export declare type HvSwitchClasses = ExtractNames<typeof useClasses_55>;
 
 export declare function hvSwitchColumn<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer>(col: HvTableColumnConfig<D, H>, switchLabel: string, falseLabel?: string, trueLabel?: string, switchProps?: HvBaseSwitchProps): HvTableColumnConfig<D, H>;
 
@@ -5814,12 +5737,7 @@ export declare interface HvSwitchProps extends Omit<SwitchProps_2, "onChange" |
 
 export declare const HvTab: (props: HvTabProps) => JSX_2.Element;
 
-export declare interface HvTabClasses {
-    root?: string;
-    selected?: string;
-    disabled?: string;
-    focusVisible?: string;
-}
+export declare type HvTabClasses = ExtractNames<typeof useClasses_43>;
 
 /**
  * A table gathers relational data. It displays values arranged to allow quick numerical analysis like comparison and sorting.
@@ -5839,7 +5757,7 @@ export declare const HvTable: ForwardRefExoticComponent<HvTableProps & RefAttrib
  */
 export declare const HvTableBody: React_2.ForwardRefExoticComponent<HvTableBodyProps & React_2.RefAttributes<HTMLElement>>;
 
-export declare type HvTableBodyClasses = ExtractNames<typeof useClasses_70>;
+export declare type HvTableBodyClasses = ExtractNames<typeof useClasses_80>;
 
 export declare interface HvTableBodyProps extends HvBaseProps<HTMLTableSectionElement, "children"> {
     /**
@@ -5873,7 +5791,7 @@ export declare const HvTableCell: ForwardRefExoticComponent<HvTableCellProps & R
 
 export declare type HvTableCellAlign = "center" | "inherit" | "justify" | "left" | "right";
 
-export declare type HvTableCellClasses = ExtractNames<typeof useClasses_74>;
+export declare type HvTableCellClasses = ExtractNames<typeof useClasses_84>;
 
 export declare interface HvTableCellProps extends Omit<TdHTMLAttributes<HTMLTableCellElement>, "align"> {
     /** The component used for the root node. Either a string to use a HTML element or a component. Defaults to td. */
@@ -5912,7 +5830,7 @@ export declare type HvTableCellType = "body" | "footer" | "head";
 
 export declare type HvTableCellVariant = "checkbox" | "expand" | "actions" | "default" | "none";
 
-export declare type HvTableClasses = ExtractNames<typeof useClasses_68>;
+export declare type HvTableClasses = ExtractNames<typeof useClasses_78>;
 
 export declare type HvTableColumnConfig<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer> = HvColumnGroup<D, H> | HvColumnWithLooseAccessor<D, H> | HvColumnWithStrictAccessor<D, H>;
 
@@ -5926,7 +5844,7 @@ export declare interface HvTableColumnOptions<D extends object = Record<string,
  */
 export declare const HvTableContainer: ForwardRefExoticComponent<HvTableContainerProps & RefAttributes<HTMLElement>>;
 
-export declare type HvTableContainerClasses = ExtractNames<typeof useClasses_69>;
+export declare type HvTableContainerClasses = ExtractNames<typeof useClasses_79>;
 
 export declare interface HvTableContainerProps extends HvBaseProps<HTMLDivElement, "children"> {
     /**
@@ -5950,14 +5868,14 @@ export declare type HvTableDefinitionConfig<D extends object = Record<string, un
  */
 export declare const HvTableHead: ForwardRefExoticComponent<HvTableHeadProps & RefAttributes<HTMLElement>>;
 
-export declare type HvTableHeadClasses = ExtractNames<typeof useClasses_71>;
+export declare type HvTableHeadClasses = ExtractNames<typeof useClasses_81>;
 
 /**
  * `HvTableHeader` acts as a `th` element and inherits styles from its context
  */
 export declare const HvTableHeader: ForwardRefExoticComponent<HvTableHeaderProps & RefAttributes<HTMLElement>>;
 
-export declare type HvTableHeaderClasses = ExtractNames<typeof useClasses_72>;
+export declare type HvTableHeaderClasses = ExtractNames<typeof useClasses_82>;
 
 export declare interface HvTableHeaderProps extends Omit<ThHTMLAttributes<HTMLTableCellElement>, "align"> {
     /** The component used for the root node. Either a string to use a HTML element or a component. Defaults to th. */
@@ -6096,7 +6014,7 @@ export declare interface HvTableProps extends TableHTMLAttributes<HTMLTableEleme
  */
 export declare const HvTableRow: ForwardRefExoticComponent<HvTableRowProps & RefAttributes<HTMLElement>>;
 
-export declare type HvTableRowClasses = ExtractNames<typeof useClasses_73>;
+export declare type HvTableRowClasses = ExtractNames<typeof useClasses_83>;
 
 export declare interface HvTableRowProps extends HvBaseProps<HTMLTableRowElement, "children"> {
     /** Content to be rendered */
@@ -6140,7 +6058,7 @@ export declare interface HvTabProps extends Omit<TabProps, "children">, HvBasePr
  */
 export declare const HvTabs: (props: HvTabsProps) => JSX_2.Element;
 
-export declare type HvTabsClasses = ExtractNames<typeof useClasses_38>;
+export declare type HvTabsClasses = ExtractNames<typeof useClasses_44>;
 
 export declare interface HvTabsProps extends TabsProps, HvBaseProps<HTMLButtonElement, "onChange"> {
     /**
@@ -6167,21 +6085,7 @@ export declare interface HvTabsProps extends TabsProps, HvBaseProps<HTMLButtonEl
  */
 export declare const HvTag: (props: HvTagProps) => JSX_2.Element;
 
-export declare interface HvTagClasses {
-    root?: string;
-    tagButton?: string;
-    focusVisible?: string;
-    button?: string;
-    label?: string;
-    chipRoot?: string;
-    categorical?: string;
-    disabled?: string;
-    clickable?: string;
-    categoricalFocus?: string;
-    categoricalDisabled?: string;
-    deleteIcon?: string;
-    disabledDeleteIcon?: string;
-}
+export declare type HvTagClasses = ExtractNames<typeof useClasses_45>;
 
 export declare function hvTagColumn<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer, A extends object = Record<string, unknown>>(col: HvTableColumnConfig<D, H>, valueDataKey: keyof A, colorDataKey: keyof A, textColorDataKey: keyof A, fromRowData?: boolean, tagProps?: HvTagProps): HvTableColumnConfig<D, H>;
 
@@ -6220,56 +6124,7 @@ export declare interface HvTagProps extends Omit<ChipProps, "color" | "classes">
  */
 export declare const HvTagsInput: (props: HvTagsInputProps) => JSX_2.Element;
 
-export declare interface HvTagsInputClasses {
-    /** Styles applied to the input element. */
-    input?: string;
-    /** Styles applied to the list item gutters. */
-    listItemGutters?: string;
-    /** Styles applied to the list item element. */
-    listItemRoot?: string;
-    /** Styles applied to the root container of the textarea. */
-    root?: string;
-    /** Styles applies to the tag root. */
-    chipRoot?: string;
-    /** Style applied to the root when resizable is `true`. */
-    disabled?: string;
-    /** Style applied to the root when resizable is `true`. */
-    resizable?: string;
-    /** Style applied to the root when invalid. */
-    invalid?: string;
-    /** Styles applied to text area container that holds the label, description and counter. */
-    labelContainer?: string;
-    /** Styles applied to the label element. */
-    label?: string;
-    /** Styles applied to the label element. */
-    description?: string;
-    /** Style applied on the character counter. */
-    characterCounter?: string;
-    /** Styles applied to the tags list container element. */
-    tagsList?: string;
-    /** Styles applied to the tag input container element. */
-    tagInputContainerRoot?: string;
-    /** Styles applied to the tag input element. */
-    tagInputRoot?: string;
-    /** Styles applied to a tag element when selected */
-    tagSelected?: string;
-    /** Styles applied to the input element border. */
-    tagInputBorderContainer?: string;
-    /** Styles applied to the input element when focused. */
-    tagInputRootFocused?: string;
-    /** Styled applied to the input element when empty */
-    tagInputRootEmpty?: string;
-    /** Styles applied to the container when in single line mode. */
-    singleLine?: string;
-    /** Styles applied to the tags list when an error occurred. */
-    error?: string;
-    /** Styles applied to the input extension shown when the suggestions list is visible. */
-    inputExtension?: string;
-    /** Styles applied to the container of the suggestions list. */
-    suggestionsContainer?: string;
-    /** Styles applied to the suggestions list. */
-    suggestionList?: string;
-}
+export declare type HvTagsInputClasses = ExtractNames<typeof useClasses_58>;
 
 export declare interface HvTagsInputProps extends HvBaseProps<HTMLElement, "onChange" | "onBlur" | "onFocus" | "onKeyDown" | "color" | "defaultValue"> {
     /** The form element name. */
@@ -6344,7 +6199,7 @@ export declare interface HvTagSuggestion extends HvInputSuggestion {
  */
 export declare const HvTextArea: ForwardRefExoticComponent<Omit<HvTextAreaProps, "ref"> & RefAttributes<any>>;
 
-export declare type HvTextAreaClasses = ExtractNames<typeof useClasses_48>;
+export declare type HvTextAreaClasses = ExtractNames<typeof useClasses_57>;
 
 export declare interface HvTextAreaProps extends Omit<HvBaseInputProps, "onChange" | "onBlur" | "rows" | "classes" | "onFocus"> {
     /**
@@ -6489,7 +6344,7 @@ declare interface HvThemeProviderProps {
  */
 export declare const HvTimeAgo: <C extends React.ElementType = "p">(props: HvTimeAgoProps<C>) => React.ReactElement | null;
 
-export declare type HvTimeAgoClasses = ExtractNames<typeof useClasses_87>;
+export declare type HvTimeAgoClasses = ExtractNames<typeof useClasses_99>;
 
 export declare type HvTimeAgoProps<C extends React.ElementType = "p"> = PolymorphicComponentRef<C, {
     /**
@@ -6525,7 +6380,7 @@ export declare type HvTimeAgoProps<C extends React.ElementType = "p"> = Polymorp
  */
 export declare const HvTimePicker: (props: HvTimePickerProps) => JSX_2.Element;
 
-export declare type HvTimePickerClasses = ExtractNames<typeof useClasses_92>;
+export declare type HvTimePickerClasses = ExtractNames<typeof useClasses_104>;
 
 export declare type HvTimePickerClassKey = "root" | "input" | "label" | "placeholder" | "timePopperContainer" | "separator" | "periodContainer" | "formElementRoot" | "dropdownPlaceholder" | "iconBaseRoot" | "error" | "labelContainer" | "description" | "dropdownHeaderInvalid" | "dropdownPlaceholderDisabled" | "dropdownHeaderOpen";
 
@@ -6601,30 +6456,7 @@ export declare interface HvToggleButtonProps extends HvBaseProps<HTMLButtonEleme
  */
 export declare const HvTooltip: ForwardRefExoticComponent<Omit<HvTooltipProps, "ref"> & RefAttributes<unknown>>;
 
-export declare interface HvTooltipClasses {
-    /** Styles applied to the tooltip root class. */
-    root?: string;
-    /** Styles applied to the tooltip class when it is single. */
-    tooltip?: string;
-    /** Styles applied to the tooltip class when it is multi. */
-    tooltipMulti?: string;
-    /** Styles applied to the popper component. */
-    popper?: string;
-    /** Styles applied to the title. */
-    title?: string;
-    /** Styles applied to the values container. */
-    valuesContainer?: string;
-    /** Styles applied to the values. */
-    values?: string;
-    /** Styles applied to the color. */
-    color?: string;
-    /** Styles applied to the separator between color and title. */
-    separatorColor?: string;
-    /** Styles applied to the separator. */
-    separator?: string;
-    /** Styles applied to the values wrapper. */
-    valueWrapper?: string;
-}
+export declare type HvTooltipClasses = ExtractNames<typeof useClasses_46>;
 
 export declare type HvTooltipPlacementType = TooltipProps["placement"];
 
@@ -7235,14 +7067,14 @@ export declare interface HvVerticalNavigationTreeViewProps {
     children?: React.ReactNode;
 }
 
-export declare type HvVerticalScrollListItemClasses = ExtractNames<typeof useClasses_82>;
+export declare type HvVerticalScrollListItemClasses = ExtractNames<typeof useClasses_94>;
 
 /**
  * Provides the user with a descriptive text, signaling an error, for when the form element is in an invalid state.
  */
 export declare const HvWarningText: (props: HvWarningTextProps) => JSX_2.Element;
 
-export declare type HvWarningTextClasses = ExtractNames<typeof useClasses_7>;
+export declare type HvWarningTextClasses = ExtractNames<typeof useClasses_9>;
 
 export declare interface HvWarningTextProps extends HvBaseProps {
     /** Icon to be rendered alongside the warning text. */
@@ -7279,8 +7111,8 @@ export declare const inlineEditorClasses: {
     button: "HvInlineEditor-button";
     input: "HvInlineEditor-input";
     text: "HvInlineEditor-text";
-    icon: "HvInlineEditor-icon";
     root: "HvInlineEditor-root";
+    icon: "HvInlineEditor-icon";
     inputBorderContainer: "HvInlineEditor-inputBorderContainer";
     inputRoot: "HvInlineEditor-inputRoot";
     largeText: "HvInlineEditor-largeText";
@@ -7291,8 +7123,8 @@ export declare const inlineEditorClasses: {
 export declare const inputClasses: {
     input: "HvInput-input";
     label: "HvInput-label";
-    icon: "HvInput-icon";
     root: "HvInput-root";
+    icon: "HvInput-icon";
     error: "HvInput-error";
     inputBorderContainer: "HvInput-inputBorderContainer";
     inputRoot: "HvInput-inputRoot";
@@ -7391,9 +7223,9 @@ export declare const listContainerClasses: {
 };
 
 export declare const listItemClasses: {
+    root: "HvListItem-root";
     condensed: "HvListItem-condensed";
     disabled: "HvListItem-disabled";
-    root: "HvListItem-root";
     selected: "HvListItem-selected";
     focus: "HvListItem-focus";
     interactive: "HvListItem-interactive";
@@ -7408,8 +7240,8 @@ export declare const loadingClasses: {
     hidden: "HvLoading-hidden";
     small: "HvLoading-small";
     label: "HvLoading-label";
-    overlay: "HvLoading-overlay";
     root: "HvLoading-root";
+    overlay: "HvLoading-overlay";
     blur: "HvLoading-blur";
     barContainer: "HvLoading-barContainer";
     loadingBar: "HvLoading-loadingBar";
@@ -7425,8 +7257,8 @@ export declare const loginClasses: {
 
 export declare const multiButtonClasses: {
     button: "HvMultiButton-button";
-    vertical: "HvMultiButton-vertical";
     root: "HvMultiButton-root";
+    vertical: "HvMultiButton-vertical";
     selected: "HvMultiButton-selected";
 };
 
@@ -7465,15 +7297,14 @@ export declare const outlineStyles: {
 };
 
 export declare const overflowTooltipClasses: {
-    root: "HvOverflowTooltip-root";
+    tooltipData: "HvOverflowTooltip-tooltipData";
     tooltipAnchor: "HvOverflowTooltip-tooltipAnchor";
     tooltipAnchorParagraph: "HvOverflowTooltip-tooltipAnchorParagraph";
-    tooltipData: "HvOverflowTooltip-tooltipData";
 };
 
 export declare const paginationClasses: {
-    icon: "HvPagination-icon";
     root: "HvPagination-root";
+    icon: "HvPagination-icon";
     pageSizeOptions: "HvPagination-pageSizeOptions";
     iconContainer: "HvPagination-iconContainer";
     pageSizeTextContainer: "HvPagination-pageSizeTextContainer";
@@ -7676,10 +7507,10 @@ declare type QueryRuleValue = string | number | boolean | NumericRange | DateTim
 
 export declare const radioClasses: {
     label: "HvRadio-label";
-    radio: "HvRadio-radio";
+    root: "HvRadio-root";
     container: "HvRadio-container";
+    radio: "HvRadio-radio";
     disabled: "HvRadio-disabled";
-    root: "HvRadio-root";
     focusVisible: "HvRadio-focusVisible";
     invalidContainer: "HvRadio-invalidContainer";
     invalidRadio: "HvRadio-invalidRadio";
@@ -7687,10 +7518,10 @@ export declare const radioClasses: {
 
 export declare const radioGroupClasses: {
     label: "HvRadioGroup-label";
+    root: "HvRadioGroup-root";
     group: "HvRadioGroup-group";
     horizontal: "HvRadioGroup-horizontal";
     vertical: "HvRadioGroup-vertical";
-    root: "HvRadioGroup-root";
     error: "HvRadioGroup-error";
     invalid: "HvRadioGroup-invalid";
 };
@@ -7730,10 +7561,10 @@ export declare const scrollToVerticalClasses: {
 
 export declare const selectionListClasses: {
     label: "HvSelectionList-label";
+    root: "HvSelectionList-root";
     listbox: "HvSelectionList-listbox";
     horizontal: "HvSelectionList-horizontal";
     vertical: "HvSelectionList-vertical";
-    root: "HvSelectionList-root";
     error: "HvSelectionList-error";
     invalid: "HvSelectionList-invalid";
     description: "HvSelectionList-description";
@@ -7780,8 +7611,8 @@ export declare const snackbarClasses: {
 };
 
 export declare const snackbarContentClasses: {
-    default: "HvSnackbar-Content-default";
     root: "HvSnackbar-Content-root";
+    default: "HvSnackbar-Content-default";
     warning: "HvSnackbar-Content-warning";
     action: "HvSnackbar-Content-action";
     error: "HvSnackbar-Content-error";
@@ -7799,9 +7630,9 @@ export declare const snackbarProviderClasses: {
 export declare type Spacing = "sm" | "md" | "lg" | "xl";
 
 export declare const stackClasses: {
+    root: "HvStack-root";
     row: "HvStack-row";
     column: "HvStack-column";
-    root: "HvStack-root";
     xs: "HvStack-xs";
     sm: "HvStack-sm";
     md: "HvStack-md";
@@ -7812,9 +7643,9 @@ export declare const stackClasses: {
 declare type StringKey<D> = Extract<keyof D, string>;
 
 export declare const suggestionsClasses: {
-    list: "HvSuggestions-list";
     root: "HvSuggestions-root";
     popper: "HvSuggestions-popper";
+    list: "HvSuggestions-list";
 };
 
 export declare const switchClasses: {
@@ -7828,8 +7659,8 @@ export declare const switchClasses: {
 declare type SxProps = React.CSSProperties | ((theme: HvTheme_2) => React.CSSProperties);
 
 export declare const tabClasses: {
-    disabled: "HvTab-disabled";
     root: "HvTab-root";
+    disabled: "HvTab-disabled";
     selected: "HvTab-selected";
     focusVisible: "HvTab-focusVisible";
 };
@@ -7885,8 +7716,8 @@ export declare const tableHeaderClasses: {
     body: "HvTableHeader-body";
     footer: "HvTableHeader-footer";
     head: "HvTableHeader-head";
-    resizer: "HvTableHeader-resizer";
     root: "HvTableHeader-root";
+    resizer: "HvTableHeader-resizer";
     resizable: "HvTableHeader-resizable";
     sortable: "HvTableHeader-sortable";
     sorted: "HvTableHeader-sorted";
@@ -7921,8 +7752,8 @@ export declare const tableRowClasses: {
     body: "HvTableRow-body";
     footer: "HvTableRow-footer";
     head: "HvTableRow-head";
-    expanded: "HvTableRow-expanded";
     root: "HvTableRow-root";
+    expanded: "HvTableRow-expanded";
     selected: "HvTableRow-selected";
     hover: "HvTableRow-hover";
     striped: "HvTableRow-striped";
@@ -7940,24 +7771,25 @@ export declare const tabsClasses: {
 export declare const tagClasses: {
     button: "HvTag-button";
     label: "HvTag-label";
-    disabled: "HvTag-disabled";
     root: "HvTag-root";
+    disabled: "HvTag-disabled";
     focusVisible: "HvTag-focusVisible";
-    clickable: "HvTag-clickable";
-    deleteIcon: "HvTag-deleteIcon";
-    tagButton: "HvTag-tagButton";
     chipRoot: "HvTag-chipRoot";
+    tagButton: "HvTag-tagButton";
+    deleteIcon: "HvTag-deleteIcon";
+    disabledDeleteIcon: "HvTag-disabledDeleteIcon";
     categorical: "HvTag-categorical";
+    clickable: "HvTag-clickable";
     categoricalFocus: "HvTag-categoricalFocus";
     categoricalDisabled: "HvTag-categoricalDisabled";
-    disabledDeleteIcon: "HvTag-disabledDeleteIcon";
 };
 
 export declare const tagsInputClasses: {
     input: "HvTagsInput-input";
     label: "HvTagsInput-label";
-    disabled: "HvTagsInput-disabled";
     root: "HvTagsInput-root";
+    disabled: "HvTagsInput-disabled";
+    readOnly: "HvTagsInput-readOnly";
     error: "HvTagsInput-error";
     invalid: "HvTagsInput-invalid";
     resizable: "HvTagsInput-resizable";
@@ -7983,8 +7815,8 @@ export declare const tagsInputClasses: {
 export declare const textAreaClasses: {
     input: "HvTextArea-input";
     label: "HvTextArea-label";
-    disabled: "HvTextArea-disabled";
     root: "HvTextArea-root";
+    disabled: "HvTextArea-disabled";
     baseInput: "HvTextArea-baseInput";
     error: "HvTextArea-error";
     invalid: "HvTextArea-invalid";
@@ -8008,8 +7840,8 @@ export declare type TimeFormat = "12" | "24";
 export declare const timePickerClasses: {
     placeholder: "HvTimePicker-placeholder";
     label: "HvTimePicker-label";
-    icon: "HvTimePicker-icon";
     root: "HvTimePicker-root";
+    icon: "HvTimePicker-icon";
     error: "HvTimePicker-error";
     description: "HvTimePicker-description";
     labelContainer: "HvTimePicker-labelContainer";
@@ -8024,14 +7856,14 @@ export declare const timePickerClasses: {
 export declare const tooltipClasses: {
     title: "HvTooltip-title";
     color: "HvTooltip-color";
-    separator: "HvTooltip-separator";
-    tooltip: "HvTooltip-tooltip";
     root: "HvTooltip-root";
-    values: "HvTooltip-values";
-    popper: "HvTooltip-popper";
+    tooltip: "HvTooltip-tooltip";
     tooltipMulti: "HvTooltip-tooltipMulti";
+    popper: "HvTooltip-popper";
     valuesContainer: "HvTooltip-valuesContainer";
+    values: "HvTooltip-values";
     separatorColor: "HvTooltip-separatorColor";
+    separator: "HvTooltip-separator";
     valueWrapper: "HvTooltip-valueWrapper";
 };
 
@@ -8061,6 +7893,7 @@ export declare const typographyClasses: {
     link: "HvTypography-link";
     body: "HvTypography-body";
     label: "HvTypography-label";
+    root: "HvTypography-root";
     display: "HvTypography-display";
     disabled: "HvTypography-disabled";
     noWrap: "HvTypography-noWrap";
@@ -8089,7 +7922,6 @@ export declare const typographyClasses: {
     vizText: "HvTypography-vizText";
     vizTextDisabled: "HvTypography-vizTextDisabled";
     xsInlineLink: "HvTypography-xsInlineLink";
-    root: "HvTypography-root";
     isLink: "HvTypography-isLink";
 };
 
@@ -8099,11 +7931,12 @@ export declare type UseBulkActionsProps = (<D extends object = Record<string, un
     pluginName: string;
 };
 
-declare const useClasses: (classesProp?: Partial<Record<"link" | "body" | "label" | "display" | "disabled" | "noWrap" | "title1" | "title2" | "title3" | "title4" | "caption1" | "caption2" | "5xlTitle" | "4xlTitle" | "3xlTitle" | "xxlTitle" | "xlTitle" | "lTitle" | "mTitle" | "sTitle" | "xsTitle" | "xxsTitle" | "sectionTitle" | "highlightText" | "normalText" | "placeholderText" | "disabledText" | "selectedNavText" | "vizText" | "vizTextDisabled" | "xsInlineLink" | "root" | "isLink", string>>, addStatic?: boolean) => {
+declare const useClasses: (classesProp?: Partial<Record<"link" | "body" | "label" | "root" | "display" | "disabled" | "noWrap" | "title1" | "title2" | "title3" | "title4" | "caption1" | "caption2" | "5xlTitle" | "4xlTitle" | "3xlTitle" | "xxlTitle" | "xlTitle" | "lTitle" | "mTitle" | "sTitle" | "xsTitle" | "xxsTitle" | "sectionTitle" | "highlightText" | "normalText" | "placeholderText" | "disabledText" | "selectedNavText" | "vizText" | "vizTextDisabled" | "xsInlineLink" | "isLink", string>>, addStatic?: boolean) => {
     classes: {
         link: string;
         body: string;
         label: string;
+        root: string;
         display: string;
         disabled: string;
         noWrap: string;
@@ -8132,7 +7965,6 @@ declare const useClasses: (classesProp?: Partial<Record<"link" | "body" | "label
         vizText: string;
         vizTextDisabled: string;
         xsInlineLink: string;
-        root: string;
         isLink: string;
     };
     css: {
@@ -8142,57 +7974,16 @@ declare const useClasses: (classesProp?: Partial<Record<"link" | "body" | "label
     cx: (...args: any) => string;
 };
 
-declare const useClasses_10: (classesProp?: Partial<Record<"input" | "disabled" | "root" | "readOnly" | "invalid" | "resizable" | "inputBorderContainer" | "inputRootInvalid" | "inputRootReadOnly" | "inputRoot" | "inputRootFocused" | "inputRootDisabled" | "inputRootMultiline" | "inputDisabled" | "inputReadOnly" | "inputResizable", string>>, addStatic?: boolean) => {
+declare const useClasses_10: (classesProp?: Partial<Record<"label" | "root" | "listbox" | "horizontal" | "vertical" | "error" | "invalid" | "description", string>>, addStatic?: boolean) => {
     classes: {
-        input: string;
-        disabled: string;
+        label: string;
         root: string;
-        readOnly: string;
+        listbox: string;
+        horizontal: string;
+        vertical: string;
+        error: string;
         invalid: string;
-        resizable: string;
-        inputBorderContainer: string;
-        inputRootInvalid: string;
-        inputRootReadOnly: string;
-        inputRoot: string;
-        inputRootFocused: string;
-        inputRootDisabled: string;
-        inputRootMultiline: string;
-        inputDisabled: string;
-        inputReadOnly: string;
-        inputResizable: string;
-    };
-    css: {
-        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
-        (...args: CSSInterpolation[]): string;
-    };
-    cx: (...args: any) => string;
-};
-
-declare const useClasses_11: (classesProp?: Partial<Record<"placeholder" | "arrow" | "anchor" | "header" | "container" | "root" | "rootDisabled" | "headerOpen" | "headerOpenUp" | "headerOpenDown" | "headerDisabled" | "headerReadOnly" | "arrowContainer" | "selection" | "selectionDisabled" | "panel" | "panelOpenedUp" | "panelOpenedDown" | "inputExtensionOpen" | "inputExtensionLeftPosition" | "inputExtensionOpenShadow" | "inputExtensionFloatRight" | "inputExtensionFloatLeft", string>>, addStatic?: boolean) => {
-    classes: {
-        placeholder: string;
-        arrow: string;
-        anchor: string;
-        header: string;
-        container: string;
-        root: string;
-        rootDisabled: string;
-        headerOpen: string;
-        headerOpenUp: string;
-        headerOpenDown: string;
-        headerDisabled: string;
-        headerReadOnly: string;
-        arrowContainer: string;
-        selection: string;
-        selectionDisabled: string;
-        panel: string;
-        panelOpenedUp: string;
-        panelOpenedDown: string;
-        inputExtensionOpen: string;
-        inputExtensionLeftPosition: string;
-        inputExtensionOpenShadow: string;
-        inputExtensionFloatRight: string;
-        inputExtensionFloatLeft: string;
+        description: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8201,9 +7992,23 @@ declare const useClasses_11: (classesProp?: Partial<Record<"placeholder" | "arro
     cx: (...args: any) => string;
 };
 
-declare const useClasses_12: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
+declare const useClasses_100: (classesProp?: Partial<Record<"root" | "removeButton" | "topGroup" | "subGroup" | "combinator" | "topCombinator" | "combinatorButton" | "topRemoveButton" | "topRemoveButtonDisabled" | "rulesContainer" | "subRulesContainer" | "actionButtonContainer" | "topActionButtonContainer" | "topRulesContainer" | "buttonBackground", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
+        removeButton: string;
+        topGroup: string;
+        subGroup: string;
+        combinator: string;
+        topCombinator: string;
+        combinatorButton: string;
+        topRemoveButton: string;
+        topRemoveButtonDisabled: string;
+        rulesContainer: string;
+        subRulesContainer: string;
+        actionButtonContainer: string;
+        topActionButtonContainer: string;
+        topRulesContainer: string;
+        buttonBackground: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8212,13 +8017,21 @@ declare const useClasses_12: (classesProp?: Partial<Record<"root", string>>, add
     cx: (...args: any) => string;
 };
 
-declare const useClasses_13: (classesProp?: Partial<Record<"hidden" | "label" | "container" | "disabled" | "root", string>>, addStatic?: boolean) => {
+declare const useClasses_101: (classesProp?: Partial<Record<"label" | "root" | "colorPicker" | "panel" | "description" | "labelContainer" | "headerColorValue" | "headerColorIcon" | "colorPickerIcon" | "recommendedColorsRoot" | "dropdownRootIconOnly" | "headerColorIconOnly" | "pickerFields", string>>, addStatic?: boolean) => {
     classes: {
-        hidden: string;
         label: string;
-        container: string;
-        disabled: string;
         root: string;
+        colorPicker: string;
+        panel: string;
+        description: string;
+        labelContainer: string;
+        headerColorValue: string;
+        headerColorIcon: string;
+        colorPickerIcon: string;
+        recommendedColorsRoot: string;
+        dropdownRootIconOnly: string;
+        headerColorIconOnly: string;
+        pickerFields: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8227,14 +8040,181 @@ declare const useClasses_13: (classesProp?: Partial<Record<"hidden" | "label" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_14: (classesProp?: Partial<Record<"img" | "status" | "container" | "square" | "root" | "xs" | "sm" | "md" | "lg" | "xl" | "fallback" | "avatar" | "badge" | "circular", string>>, addStatic?: boolean) => {
+declare const useClasses_102: (classesProp?: Partial<Record<"title" | "main" | "root" | "dot" | "controls" | "xs" | "actions" | "panel" | "fullscreen" | "closeButton" | "mainContainer" | "pageCounter" | "mainXs" | "mainFullscreen" | "counterContainer" | "counter" | "slideControls" | "slidesViewport" | "slidesContainer" | "dots" | "dotsXs" | "dotSelected" | "thumbnail" | "thumbnailSelected", string>>, addStatic?: boolean) => {
     classes: {
-        img: string;
-        status: string;
-        container: string;
-        square: string;
+        title: string;
+        main: string;
         root: string;
-        xs: string;
+        dot: string;
+        controls: string;
+        xs: string;
+        actions: string;
+        panel: string;
+        fullscreen: string;
+        closeButton: string;
+        mainContainer: string;
+        pageCounter: string;
+        mainXs: string;
+        mainFullscreen: string;
+        counterContainer: string;
+        counter: string;
+        slideControls: string;
+        slidesViewport: string;
+        slidesContainer: string;
+        dots: string;
+        dotsXs: string;
+        dotSelected: string;
+        thumbnail: string;
+        thumbnailSelected: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_103: (classesProp?: Partial<Record<"image" | "slide", string>>, addStatic?: boolean) => {
+    classes: {
+        image: string;
+        slide: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_104: (classesProp?: Partial<Record<"placeholder" | "label" | "root" | "icon" | "error" | "description" | "labelContainer" | "dropdownHeaderInvalid" | "dropdownHeaderOpen" | "dropdownHeader" | "placeholderDisabled" | "dropdownPanel" | "timePopperContainer", string>>, addStatic?: boolean) => {
+    classes: {
+        placeholder: string;
+        label: string;
+        root: string;
+        icon: string;
+        error: string;
+        description: string;
+        labelContainer: string;
+        dropdownHeaderInvalid: string;
+        dropdownHeaderOpen: string;
+        dropdownHeader: string;
+        placeholderDisabled: string;
+        dropdownPanel: string;
+        timePopperContainer: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_11: (classesProp?: Partial<Record<"root" | "popper" | "list", string>>, addStatic?: boolean) => {
+    classes: {
+        root: string;
+        popper: string;
+        list: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_12: (classesProp?: Partial<Record<"input" | "root" | "disabled" | "readOnly" | "invalid" | "resizable" | "inputBorderContainer" | "inputRootInvalid" | "inputRootReadOnly" | "inputRoot" | "inputRootFocused" | "inputRootDisabled" | "inputRootMultiline" | "inputDisabled" | "inputReadOnly" | "inputResizable", string>>, addStatic?: boolean) => {
+    classes: {
+        input: string;
+        root: string;
+        disabled: string;
+        readOnly: string;
+        invalid: string;
+        resizable: string;
+        inputBorderContainer: string;
+        inputRootInvalid: string;
+        inputRootReadOnly: string;
+        inputRoot: string;
+        inputRootFocused: string;
+        inputRootDisabled: string;
+        inputRootMultiline: string;
+        inputDisabled: string;
+        inputReadOnly: string;
+        inputResizable: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_13: (classesProp?: Partial<Record<"placeholder" | "arrow" | "anchor" | "header" | "root" | "container" | "rootDisabled" | "headerOpen" | "headerOpenUp" | "headerOpenDown" | "headerDisabled" | "headerReadOnly" | "arrowContainer" | "selection" | "selectionDisabled" | "panel" | "panelOpenedUp" | "panelOpenedDown" | "inputExtensionOpen" | "inputExtensionLeftPosition" | "inputExtensionOpenShadow" | "inputExtensionFloatRight" | "inputExtensionFloatLeft", string>>, addStatic?: boolean) => {
+    classes: {
+        placeholder: string;
+        arrow: string;
+        anchor: string;
+        header: string;
+        root: string;
+        container: string;
+        rootDisabled: string;
+        headerOpen: string;
+        headerOpenUp: string;
+        headerOpenDown: string;
+        headerDisabled: string;
+        headerReadOnly: string;
+        arrowContainer: string;
+        selection: string;
+        selectionDisabled: string;
+        panel: string;
+        panelOpenedUp: string;
+        panelOpenedDown: string;
+        inputExtensionOpen: string;
+        inputExtensionLeftPosition: string;
+        inputExtensionOpenShadow: string;
+        inputExtensionFloatRight: string;
+        inputExtensionFloatLeft: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_14: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
+    classes: {
+        root: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_15: (classesProp?: Partial<Record<"hidden" | "label" | "root" | "container" | "disabled", string>>, addStatic?: boolean) => {
+    classes: {
+        hidden: string;
+        label: string;
+        root: string;
+        container: string;
+        disabled: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_16: (classesProp?: Partial<Record<"img" | "root" | "container" | "status" | "square" | "xs" | "sm" | "md" | "lg" | "xl" | "fallback" | "avatar" | "badge" | "circular", string>>, addStatic?: boolean) => {
+    classes: {
+        img: string;
+        root: string;
+        container: string;
+        status: string;
+        square: string;
+        xs: string;
         sm: string;
         md: string;
         lg: string;
@@ -8251,7 +8231,7 @@ declare const useClasses_14: (classesProp?: Partial<Record<"img" | "status" | "c
     cx: (...args: any) => string;
 };
 
-declare const useClasses_15: (classesProp?: Partial<Record<"root" | "badge" | "badgeContainer" | "badgePosition" | "showCount" | "showLabel" | "badgeIcon" | "badgeOneDigit", string>>, addStatic?: boolean) => {
+declare const useClasses_17: (classesProp?: Partial<Record<"root" | "badge" | "badgeContainer" | "badgePosition" | "showCount" | "showLabel" | "badgeIcon" | "badgeOneDigit", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         badge: string;
@@ -8269,11 +8249,11 @@ declare const useClasses_15: (classesProp?: Partial<Record<"root" | "badge" | "b
     cx: (...args: any) => string;
 };
 
-declare const useClasses_16: (classesProp?: Partial<Record<"icon" | "disabled" | "root" | "startIcon" | "endIcon" | "focusVisible", string>>, addStatic?: boolean) => {
+declare const useClasses_18: (classesProp?: Partial<Record<"root" | "icon" | "disabled" | "startIcon" | "endIcon" | "focusVisible", string>>, addStatic?: boolean) => {
     classes: {
+        root: string;
         icon: string;
         disabled: string;
-        root: string;
         startIcon: string;
         endIcon: string;
         focusVisible: string;
@@ -8285,10 +8265,10 @@ declare const useClasses_16: (classesProp?: Partial<Record<"icon" | "disabled" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_17: (classesProp?: Partial<Record<"icon" | "root" | "selected" | "selectable" | "semanticContainer" | "semanticBar", string>>, addStatic?: boolean) => {
+declare const useClasses_19: (classesProp?: Partial<Record<"root" | "icon" | "selected" | "selectable" | "semanticContainer" | "semanticBar", string>>, addStatic?: boolean) => {
     classes: {
-        icon: string;
         root: string;
+        icon: string;
         selected: string;
         selectable: string;
         semanticContainer: string;
@@ -8301,14 +8281,9 @@ declare const useClasses_17: (classesProp?: Partial<Record<"icon" | "root" | "se
     cx: (...args: any) => string;
 };
 
-declare const useClasses_18: (classesProp?: Partial<Record<"title" | "content" | "root" | "action" | "titleShort" | "subheader", string>>, addStatic?: boolean) => {
+declare const useClasses_2: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
     classes: {
-        title: string;
-        content: string;
         root: string;
-        action: string;
-        titleShort: string;
-        subheader: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8317,9 +8292,14 @@ declare const useClasses_18: (classesProp?: Partial<Record<"title" | "content" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_19: (classesProp?: Partial<Record<"content", string>>, addStatic?: boolean) => {
+declare const useClasses_20: (classesProp?: Partial<Record<"title" | "content" | "root" | "action" | "titleShort" | "subheader", string>>, addStatic?: boolean) => {
     classes: {
+        title: string;
         content: string;
+        root: string;
+        action: string;
+        titleShort: string;
+        subheader: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8328,12 +8308,9 @@ declare const useClasses_19: (classesProp?: Partial<Record<"content", string>>,
     cx: (...args: any) => string;
 };
 
-declare const useClasses_2: (classesProp?: Partial<Record<"root" | "counterDisabled" | "gutter" | "overloaded", string>>, addStatic?: boolean) => {
+declare const useClasses_21: (classesProp?: Partial<Record<"content", string>>, addStatic?: boolean) => {
     classes: {
-        root: string;
-        counterDisabled: string;
-        gutter: string;
-        overloaded: string;
+        content: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8342,7 +8319,7 @@ declare const useClasses_2: (classesProp?: Partial<Record<"root" | "counterDisab
     cx: (...args: any) => string;
 };
 
-declare const useClasses_20: (classesProp?: Partial<Record<"root" | "media", string>>, addStatic?: boolean) => {
+declare const useClasses_22: (classesProp?: Partial<Record<"root" | "media", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         media: string;
@@ -8354,7 +8331,7 @@ declare const useClasses_20: (classesProp?: Partial<Record<"root" | "media", str
     cx: (...args: any) => string;
 };
 
-declare const useClasses_21: (classesProp?: Partial<Record<"fixed" | "root" | "disableGutters" | "maxWidthXs" | "maxWidthSm" | "maxWidthMd" | "maxWidthLg" | "maxWidthXl", string>>, addStatic?: boolean) => {
+declare const useClasses_23: (classesProp?: Partial<Record<"fixed" | "root" | "disableGutters" | "maxWidthXs" | "maxWidthSm" | "maxWidthMd" | "maxWidthLg" | "maxWidthXl", string>>, addStatic?: boolean) => {
     classes: {
         fixed: string;
         root: string;
@@ -8372,7 +8349,7 @@ declare const useClasses_21: (classesProp?: Partial<Record<"fixed" | "root" | "d
     cx: (...args: any) => string;
 };
 
-declare const useClasses_22: (classesProp?: Partial<Record<"root" | "fullscreen" | "messageContainer" | "textWithIcon", string>>, addStatic?: boolean) => {
+declare const useClasses_24: (classesProp?: Partial<Record<"root" | "fullscreen" | "messageContainer" | "textWithIcon", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         fullscreen: string;
@@ -8386,7 +8363,7 @@ declare const useClasses_22: (classesProp?: Partial<Record<"root" | "fullscreen"
     cx: (...args: any) => string;
 };
 
-declare const useClasses_23: (classesProp?: Partial<Record<"root" | "textContent", string>>, addStatic?: boolean) => {
+declare const useClasses_25: (classesProp?: Partial<Record<"root" | "textContent", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         textContent: string;
@@ -8398,7 +8375,7 @@ declare const useClasses_23: (classesProp?: Partial<Record<"root" | "textContent
     cx: (...args: any) => string;
 };
 
-declare const useClasses_24: (classesProp?: Partial<Record<"root" | "spacing" | "fullscreen", string>>, addStatic?: boolean) => {
+declare const useClasses_26: (classesProp?: Partial<Record<"root" | "spacing" | "fullscreen", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         spacing: string;
@@ -8411,10 +8388,10 @@ declare const useClasses_24: (classesProp?: Partial<Record<"root" | "spacing" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_25: (classesProp?: Partial<Record<"background" | "root" | "warning" | "error" | "success" | "fullscreen" | "closeButton" | "paper" | "statusBar", string>>, addStatic?: boolean) => {
+declare const useClasses_27: (classesProp?: Partial<Record<"root" | "background" | "warning" | "error" | "success" | "fullscreen" | "closeButton" | "paper" | "statusBar", string>>, addStatic?: boolean) => {
     classes: {
-        background: string;
         root: string;
+        background: string;
         warning: string;
         error: string;
         success: string;
@@ -8430,10 +8407,10 @@ declare const useClasses_25: (classesProp?: Partial<Record<"background" | "root"
     cx: (...args: any) => string;
 };
 
-declare const useClasses_26: (classesProp?: Partial<Record<"background" | "root" | "closeButton" | "paper", string>>, addStatic?: boolean) => {
+declare const useClasses_28: (classesProp?: Partial<Record<"root" | "background" | "closeButton" | "paper", string>>, addStatic?: boolean) => {
     classes: {
-        background: string;
         root: string;
+        background: string;
         closeButton: string;
         paper: string;
     };
@@ -8444,10 +8421,10 @@ declare const useClasses_26: (classesProp?: Partial<Record<"background" | "root"
     cx: (...args: any) => string;
 };
 
-declare const useClasses_27: (classesProp?: Partial<Record<"container" | "root" | "actionContainer" | "containerMessageOnly" | "iconContainer" | "titleContainer" | "textContainer" | "messageContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_29: (classesProp?: Partial<Record<"root" | "container" | "actionContainer" | "containerMessageOnly" | "iconContainer" | "titleContainer" | "textContainer" | "messageContainer", string>>, addStatic?: boolean) => {
     classes: {
-        container: string;
         root: string;
+        container: string;
         actionContainer: string;
         containerMessageOnly: string;
         iconContainer: string;
@@ -8462,11 +8439,32 @@ declare const useClasses_27: (classesProp?: Partial<Record<"container" | "root"
     cx: (...args: any) => string;
 };
 
-declare const useClasses_28: (classesProp?: Partial<Record<"small" | "separator" | "root" | "name" | "rightContainer" | "copyright", string>>, addStatic?: boolean) => {
+declare const useClasses_3: (classesProp?: Partial<Record<"root" | "condensed" | "disabled" | "selected" | "focus" | "interactive" | "endAdornment" | "startAdornment" | "gutters" | "withStartAdornment" | "withEndAdornment", string>>, addStatic?: boolean) => {
+    classes: {
+        root: string;
+        condensed: string;
+        disabled: string;
+        selected: string;
+        focus: string;
+        interactive: string;
+        endAdornment: string;
+        startAdornment: string;
+        gutters: string;
+        withStartAdornment: string;
+        withEndAdornment: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_30: (classesProp?: Partial<Record<"small" | "root" | "separator" | "name" | "rightContainer" | "copyright", string>>, addStatic?: boolean) => {
     classes: {
         small: string;
-        separator: string;
         root: string;
+        separator: string;
         name: string;
         rightContainer: string;
         copyright: string;
@@ -8478,11 +8476,41 @@ declare const useClasses_28: (classesProp?: Partial<Record<"small" | "separator"
     cx: (...args: any) => string;
 };
 
-declare const useClasses_29: (classesProp?: Partial<Record<"header" | "backgroundColor" | "root", string>>, addStatic?: boolean) => {
+declare const useClasses_31: (classesProp?: Partial<Record<"root" | "container" | "item" | "zeroMinWidth" | "direction-xs-column" | "direction-xs-reverse" | "direction-xs-row-reverse" | "wrap-xs-nowrap" | "wrap-xs-wrap-reverse" | "spacing-xs-1" | "spacing-xs-2" | "spacing-xs-3" | "spacing-xs-4" | "spacing-xs-5" | "spacing-xs-6" | "spacing-xs-7" | "spacing-xs-8" | "spacing-xs-9" | "spacing-xs-10" | "grid-xs-auto" | "grid-xs-true" | "grid-xs-1" | "grid-xs-2" | "grid-xs-3" | "grid-xs-4" | "grid-xs-5" | "grid-xs-6" | "grid-xs-7" | "grid-xs-8" | "grid-xs-9" | "grid-xs-10" | "grid-xs-11" | "grid-xs-12", string>>, addStatic?: boolean) => {
     classes: {
-        header: string;
-        backgroundColor: string;
         root: string;
+        container: string;
+        item: string;
+        zeroMinWidth: string;
+        "direction-xs-column": string;
+        "direction-xs-reverse": string;
+        "direction-xs-row-reverse": string;
+        "wrap-xs-nowrap": string;
+        "wrap-xs-wrap-reverse": string;
+        "spacing-xs-1": string;
+        "spacing-xs-2": string;
+        "spacing-xs-3": string;
+        "spacing-xs-4": string;
+        "spacing-xs-5": string;
+        "spacing-xs-6": string;
+        "spacing-xs-7": string;
+        "spacing-xs-8": string;
+        "spacing-xs-9": string;
+        "spacing-xs-10": string;
+        "grid-xs-auto": string;
+        "grid-xs-true": string;
+        "grid-xs-1": string;
+        "grid-xs-2": string;
+        "grid-xs-3": string;
+        "grid-xs-4": string;
+        "grid-xs-5": string;
+        "grid-xs-6": string;
+        "grid-xs-7": string;
+        "grid-xs-8": string;
+        "grid-xs-9": string;
+        "grid-xs-10": string;
+        "grid-xs-11": string;
+        "grid-xs-12": string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8491,14 +8519,11 @@ declare const useClasses_29: (classesProp?: Partial<Record<"header" | "backgroun
     cx: (...args: any) => string;
 };
 
-declare const useClasses_3: (classesProp?: Partial<Record<"icon" | "root" | "adornment" | "adornmentButton" | "adornmentIcon" | "hideIcon", string>>, addStatic?: boolean) => {
+declare const useClasses_32: (classesProp?: Partial<Record<"header" | "root" | "backgroundColor", string>>, addStatic?: boolean) => {
     classes: {
-        icon: string;
+        header: string;
         root: string;
-        adornment: string;
-        adornmentButton: string;
-        adornmentIcon: string;
-        hideIcon: string;
+        backgroundColor: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8507,7 +8532,7 @@ declare const useClasses_3: (classesProp?: Partial<Record<"icon" | "root" | "ado
     cx: (...args: any) => string;
 };
 
-declare const useClasses_30: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
+declare const useClasses_33: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
     };
@@ -8518,10 +8543,10 @@ declare const useClasses_30: (classesProp?: Partial<Record<"root", string>>, add
     cx: (...args: any) => string;
 };
 
-declare const useClasses_31: (classesProp?: Partial<Record<"separator" | "root", string>>, addStatic?: boolean) => {
+declare const useClasses_34: (classesProp?: Partial<Record<"root" | "separator", string>>, addStatic?: boolean) => {
     classes: {
-        separator: string;
         root: string;
+        separator: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8530,13 +8555,13 @@ declare const useClasses_31: (classesProp?: Partial<Record<"separator" | "root",
     cx: (...args: any) => string;
 };
 
-declare const useClasses_32: (classesProp?: Partial<Record<"link" | "button" | "menu" | "menubar" | "root" | "selected", string>>, addStatic?: boolean) => {
+declare const useClasses_35: (classesProp?: Partial<Record<"link" | "button" | "menu" | "root" | "menubar" | "selected", string>>, addStatic?: boolean) => {
     classes: {
         link: string;
         button: string;
         menu: string;
-        menubar: string;
         root: string;
+        menubar: string;
         selected: string;
     };
     css: {
@@ -8546,7 +8571,7 @@ declare const useClasses_32: (classesProp?: Partial<Record<"link" | "button" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_33: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
+declare const useClasses_36: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
     };
@@ -8557,13 +8582,44 @@ declare const useClasses_33: (classesProp?: Partial<Record<"root", string>>, add
     cx: (...args: any) => string;
 };
 
-declare const useClasses_34: (classesProp?: Partial<Record<"hidden" | "small" | "label" | "overlay" | "root" | "blur" | "barContainer" | "loadingBar" | "regular" | "smallColor" | "regularColor", string>>, addStatic?: boolean) => {
+declare const useClasses_37: (classesProp?: Partial<Record<"root" | "visualIndicatorContainer" | "comparisons" | "comparisonContainer" | "comparisonComposition" | "indicatorsContainer" | "indicatorText" | "indicatorUnit" | "spacingToTheRight" | "trendLine", string>>, addStatic?: boolean) => {
+    classes: {
+        root: string;
+        visualIndicatorContainer: string;
+        comparisons: string;
+        comparisonContainer: string;
+        comparisonComposition: string;
+        indicatorsContainer: string;
+        indicatorText: string;
+        indicatorUnit: string;
+        spacingToTheRight: string;
+        trendLine: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_38: (classesProp?: Partial<Record<"a", string>>, addStatic?: boolean) => {
+    classes: {
+        a: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_39: (classesProp?: Partial<Record<"hidden" | "small" | "label" | "root" | "overlay" | "blur" | "barContainer" | "loadingBar" | "regular" | "smallColor" | "regularColor", string>>, addStatic?: boolean) => {
     classes: {
         hidden: string;
         small: string;
         label: string;
-        overlay: string;
         root: string;
+        overlay: string;
         blur: string;
         barContainer: string;
         loadingBar: string;
@@ -8578,9 +8634,12 @@ declare const useClasses_34: (classesProp?: Partial<Record<"hidden" | "small" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_35: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
+declare const useClasses_4: (classesProp?: Partial<Record<"root" | "counterDisabled" | "gutter" | "overloaded", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
+        counterDisabled: string;
+        gutter: string;
+        overloaded: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8589,7 +8648,18 @@ declare const useClasses_35: (classesProp?: Partial<Record<"root", string>>, add
     cx: (...args: any) => string;
 };
 
-declare const useClasses_36: (classesProp?: Partial<Record<"progress" | "root" | "progressBar" | "progressBarLabel" | "progressContainer" | "progressDone" | "progressBarContainer" | "progressError", string>>, addStatic?: boolean) => {
+declare const useClasses_40: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
+    classes: {
+        root: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_41: (classesProp?: Partial<Record<"progress" | "root" | "progressBar" | "progressBarLabel" | "progressContainer" | "progressDone" | "progressBarContainer" | "progressError", string>>, addStatic?: boolean) => {
     classes: {
         progress: string;
         root: string;
@@ -8607,11 +8677,11 @@ declare const useClasses_36: (classesProp?: Partial<Record<"progress" | "root" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_37: (classesProp?: Partial<Record<"row" | "column" | "root" | "xs" | "sm" | "md" | "lg" | "xl", string>>, addStatic?: boolean) => {
+declare const useClasses_42: (classesProp?: Partial<Record<"root" | "row" | "column" | "xs" | "sm" | "md" | "lg" | "xl", string>>, addStatic?: boolean) => {
     classes: {
+        root: string;
         row: string;
         column: string;
-        root: string;
         xs: string;
         sm: string;
         md: string;
@@ -8625,7 +8695,21 @@ declare const useClasses_37: (classesProp?: Partial<Record<"row" | "column" | "r
     cx: (...args: any) => string;
 };
 
-declare const useClasses_38: (classesProp?: Partial<Record<"root" | "indicator" | "scroller" | "flexContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_43: (classesProp?: Partial<Record<"root" | "disabled" | "selected" | "focusVisible", string>>, addStatic?: boolean) => {
+    classes: {
+        root: string;
+        disabled: string;
+        selected: string;
+        focusVisible: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_44: (classesProp?: Partial<Record<"root" | "indicator" | "scroller" | "flexContainer", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         indicator: string;
@@ -8639,12 +8723,21 @@ declare const useClasses_38: (classesProp?: Partial<Record<"root" | "indicator"
     cx: (...args: any) => string;
 };
 
-declare const useClasses_39: (classesProp?: Partial<Record<"icon" | "disabled" | "root" | "focusVisible", string>>, addStatic?: boolean) => {
+declare const useClasses_45: (classesProp?: Partial<Record<"button" | "label" | "root" | "disabled" | "focusVisible" | "chipRoot" | "tagButton" | "deleteIcon" | "disabledDeleteIcon" | "categorical" | "clickable" | "categoricalFocus" | "categoricalDisabled", string>>, addStatic?: boolean) => {
     classes: {
-        icon: string;
-        disabled: string;
+        button: string;
+        label: string;
         root: string;
+        disabled: string;
         focusVisible: string;
+        chipRoot: string;
+        tagButton: string;
+        deleteIcon: string;
+        disabledDeleteIcon: string;
+        categorical: string;
+        clickable: string;
+        categoricalFocus: string;
+        categoricalDisabled: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8653,9 +8746,19 @@ declare const useClasses_39: (classesProp?: Partial<Record<"icon" | "disabled" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_4: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
+declare const useClasses_46: (classesProp?: Partial<Record<"title" | "color" | "root" | "tooltip" | "tooltipMulti" | "popper" | "valuesContainer" | "values" | "separatorColor" | "separator" | "valueWrapper", string>>, addStatic?: boolean) => {
     classes: {
+        title: string;
+        color: string;
         root: string;
+        tooltip: string;
+        tooltipMulti: string;
+        popper: string;
+        valuesContainer: string;
+        values: string;
+        separatorColor: string;
+        separator: string;
+        valueWrapper: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8664,11 +8767,38 @@ declare const useClasses_4: (classesProp?: Partial<Record<"root", string>>, addS
     cx: (...args: any) => string;
 };
 
-declare const useClasses_40: (classesProp?: Partial<Record<"icon" | "disabled" | "root" | "focusVisible", string>>, addStatic?: boolean) => {
+declare const useClasses_47: (classesProp?: Partial<Record<"tooltipData" | "tooltipAnchor" | "tooltipAnchorParagraph", string>>, addStatic?: boolean) => {
     classes: {
+        tooltipData: string;
+        tooltipAnchor: string;
+        tooltipAnchorParagraph: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_48: (classesProp?: Partial<Record<"root" | "icon" | "disabled" | "focusVisible", string>>, addStatic?: boolean) => {
+    classes: {
+        root: string;
         icon: string;
         disabled: string;
+        focusVisible: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_49: (classesProp?: Partial<Record<"root" | "icon" | "disabled" | "focusVisible", string>>, addStatic?: boolean) => {
+    classes: {
         root: string;
+        icon: string;
+        disabled: string;
         focusVisible: string;
     };
     css: {
@@ -8678,12 +8808,28 @@ declare const useClasses_40: (classesProp?: Partial<Record<"icon" | "disabled" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_41: (classesProp?: Partial<Record<"title" | "open" | "single" | "root" | "item" | "itemSelected" | "itemDisabled" | "itemTrigger" | "itemIcon" | "itemTitle" | "itemInfoIcon" | "actionsContainer" | "footerContainer" | "closed" | "dual" | "fluid", string>>, addStatic?: boolean) => {
+declare const useClasses_5: (classesProp?: Partial<Record<"root" | "icon" | "adornment" | "adornmentButton" | "adornmentIcon" | "hideIcon", string>>, addStatic?: boolean) => {
+    classes: {
+        root: string;
+        icon: string;
+        adornment: string;
+        adornmentButton: string;
+        adornmentIcon: string;
+        hideIcon: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_50: (classesProp?: Partial<Record<"title" | "open" | "root" | "single" | "item" | "itemSelected" | "itemDisabled" | "itemTrigger" | "itemIcon" | "itemTitle" | "itemInfoIcon" | "actionsContainer" | "footerContainer" | "closed" | "dual" | "fluid", string>>, addStatic?: boolean) => {
     classes: {
         title: string;
         open: string;
-        single: string;
         root: string;
+        single: string;
         item: string;
         itemSelected: string;
         itemDisabled: string;
@@ -8704,13 +8850,13 @@ declare const useClasses_41: (classesProp?: Partial<Record<"title" | "open" | "s
     cx: (...args: any) => string;
 };
 
-declare const useClasses_42: (classesProp?: Partial<Record<"title" | "typography" | "icon" | "disabled" | "root" | "selected" | "iconUrl" | "iconInfo", string>>, addStatic?: boolean) => {
+declare const useClasses_51: (classesProp?: Partial<Record<"title" | "root" | "typography" | "icon" | "disabled" | "selected" | "iconUrl" | "iconInfo", string>>, addStatic?: boolean) => {
     classes: {
         title: string;
+        root: string;
         typography: string;
         icon: string;
         disabled: string;
-        root: string;
         selected: string;
         iconUrl: string;
         iconInfo: string;
@@ -8722,12 +8868,12 @@ declare const useClasses_42: (classesProp?: Partial<Record<"title" | "typography
     cx: (...args: any) => string;
 };
 
-declare const useClasses_43: (classesProp?: Partial<Record<"track" | "switch" | "disabled" | "root" | "checked" | "readOnly" | "focusVisible" | "thumb" | "switchBase", string>>, addStatic?: boolean) => {
+declare const useClasses_52: (classesProp?: Partial<Record<"track" | "switch" | "root" | "disabled" | "checked" | "readOnly" | "focusVisible" | "thumb" | "switchBase", string>>, addStatic?: boolean) => {
     classes: {
         track: string;
         switch: string;
-        disabled: string;
         root: string;
+        disabled: string;
         checked: string;
         readOnly: string;
         focusVisible: string;
@@ -8741,13 +8887,13 @@ declare const useClasses_43: (classesProp?: Partial<Record<"track" | "switch" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_44: (classesProp?: Partial<Record<"label" | "checkbox" | "container" | "disabled" | "root" | "focusVisible" | "invalidContainer" | "invalidCheckbox", string>>, addStatic?: boolean) => {
+declare const useClasses_53: (classesProp?: Partial<Record<"label" | "root" | "container" | "checkbox" | "disabled" | "focusVisible" | "invalidContainer" | "invalidCheckbox", string>>, addStatic?: boolean) => {
     classes: {
         label: string;
-        checkbox: string;
+        root: string;
         container: string;
+        checkbox: string;
         disabled: string;
-        root: string;
         focusVisible: string;
         invalidContainer: string;
         invalidCheckbox: string;
@@ -8759,12 +8905,12 @@ declare const useClasses_44: (classesProp?: Partial<Record<"label" | "checkbox"
     cx: (...args: any) => string;
 };
 
-declare const useClasses_45: (classesProp?: Partial<Record<"input" | "label" | "icon" | "root" | "error" | "inputBorderContainer" | "inputRoot" | "inputRootFocused" | "inputRootDisabled" | "inputRootMultiline" | "description" | "labelContainer" | "adornmentsBox" | "adornmentButton" | "iconClear" | "hasSuggestions" | "suggestionsContainer" | "suggestionList" | "inputExtension", string>>, addStatic?: boolean) => {
+declare const useClasses_54: (classesProp?: Partial<Record<"input" | "label" | "root" | "icon" | "error" | "inputBorderContainer" | "inputRoot" | "inputRootFocused" | "inputRootDisabled" | "inputRootMultiline" | "description" | "labelContainer" | "adornmentsBox" | "adornmentButton" | "iconClear" | "hasSuggestions" | "suggestionsContainer" | "suggestionList" | "inputExtension", string>>, addStatic?: boolean) => {
     classes: {
         input: string;
         label: string;
-        icon: string;
         root: string;
+        icon: string;
         error: string;
         inputBorderContainer: string;
         inputRoot: string;
@@ -8788,7 +8934,7 @@ declare const useClasses_45: (classesProp?: Partial<Record<"input" | "label" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_46: (classesProp?: Partial<Record<"label" | "root" | "error" | "switchContainer" | "invalidSwitch", string>>, addStatic?: boolean) => {
+declare const useClasses_55: (classesProp?: Partial<Record<"label" | "root" | "error" | "switchContainer" | "invalidSwitch", string>>, addStatic?: boolean) => {
     classes: {
         label: string;
         root: string;
@@ -8803,13 +8949,13 @@ declare const useClasses_46: (classesProp?: Partial<Record<"label" | "root" | "e
     cx: (...args: any) => string;
 };
 
-declare const useClasses_47: (classesProp?: Partial<Record<"label" | "radio" | "container" | "disabled" | "root" | "focusVisible" | "invalidContainer" | "invalidRadio", string>>, addStatic?: boolean) => {
+declare const useClasses_56: (classesProp?: Partial<Record<"label" | "root" | "container" | "radio" | "disabled" | "focusVisible" | "invalidContainer" | "invalidRadio", string>>, addStatic?: boolean) => {
     classes: {
         label: string;
-        radio: string;
+        root: string;
         container: string;
+        radio: string;
         disabled: string;
-        root: string;
         focusVisible: string;
         invalidContainer: string;
         invalidRadio: string;
@@ -8821,12 +8967,12 @@ declare const useClasses_47: (classesProp?: Partial<Record<"label" | "radio" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_48: (classesProp?: Partial<Record<"input" | "label" | "disabled" | "root" | "baseInput" | "error" | "invalid" | "resizable" | "inputResizable" | "description" | "labelContainer" | "characterCounter", string>>, addStatic?: boolean) => {
+declare const useClasses_57: (classesProp?: Partial<Record<"input" | "label" | "root" | "disabled" | "baseInput" | "error" | "invalid" | "resizable" | "inputResizable" | "description" | "labelContainer" | "characterCounter", string>>, addStatic?: boolean) => {
     classes: {
         input: string;
         label: string;
-        disabled: string;
         root: string;
+        disabled: string;
         baseInput: string;
         error: string;
         invalid: string;
@@ -8843,13 +8989,48 @@ declare const useClasses_48: (classesProp?: Partial<Record<"input" | "label" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_49: (classesProp?: Partial<Record<"label" | "group" | "horizontal" | "vertical" | "root" | "error" | "invalid" | "selectAll", string>>, addStatic?: boolean) => {
+declare const useClasses_58: (classesProp?: Partial<Record<"input" | "label" | "root" | "disabled" | "readOnly" | "error" | "invalid" | "resizable" | "description" | "labelContainer" | "suggestionsContainer" | "suggestionList" | "inputExtension" | "chipRoot" | "listItemGutters" | "listItemRoot" | "characterCounter" | "tagsList" | "tagInputContainerRoot" | "tagInputRoot" | "tagSelected" | "tagInputBorderContainer" | "tagInputRootFocused" | "tagInputRootEmpty" | "singleLine", string>>, addStatic?: boolean) => {
+    classes: {
+        input: string;
+        label: string;
+        root: string;
+        disabled: string;
+        readOnly: string;
+        error: string;
+        invalid: string;
+        resizable: string;
+        description: string;
+        labelContainer: string;
+        suggestionsContainer: string;
+        suggestionList: string;
+        inputExtension: string;
+        chipRoot: string;
+        listItemGutters: string;
+        listItemRoot: string;
+        characterCounter: string;
+        tagsList: string;
+        tagInputContainerRoot: string;
+        tagInputRoot: string;
+        tagSelected: string;
+        tagInputBorderContainer: string;
+        tagInputRootFocused: string;
+        tagInputRootEmpty: string;
+        singleLine: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_59: (classesProp?: Partial<Record<"label" | "root" | "group" | "horizontal" | "vertical" | "error" | "invalid" | "selectAll", string>>, addStatic?: boolean) => {
     classes: {
         label: string;
+        root: string;
         group: string;
         horizontal: string;
         vertical: string;
-        root: string;
         error: string;
         invalid: string;
         selectAll: string;
@@ -8861,11 +9042,9 @@ declare const useClasses_49: (classesProp?: Partial<Record<"label" | "group" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_5: (classesProp?: Partial<Record<"root" | "labelDisabled" | "childGutter", string>>, addStatic?: boolean) => {
+declare const useClasses_6: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
-        labelDisabled: string;
-        childGutter: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -8874,13 +9053,13 @@ declare const useClasses_5: (classesProp?: Partial<Record<"root" | "labelDisable
     cx: (...args: any) => string;
 };
 
-declare const useClasses_50: (classesProp?: Partial<Record<"label" | "group" | "horizontal" | "vertical" | "root" | "error" | "invalid", string>>, addStatic?: boolean) => {
+declare const useClasses_60: (classesProp?: Partial<Record<"label" | "root" | "group" | "horizontal" | "vertical" | "error" | "invalid", string>>, addStatic?: boolean) => {
     classes: {
         label: string;
+        root: string;
         group: string;
         horizontal: string;
         vertical: string;
-        root: string;
         error: string;
         invalid: string;
     };
@@ -8891,7 +9070,7 @@ declare const useClasses_50: (classesProp?: Partial<Record<"label" | "group" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_51: (classesProp?: Partial<Record<"overlay" | "previewButton", string>>, addStatic?: boolean) => {
+declare const useClasses_61: (classesProp?: Partial<Record<"overlay" | "previewButton", string>>, addStatic?: boolean) => {
     classes: {
         overlay: string;
         previewButton: string;
@@ -8903,11 +9082,11 @@ declare const useClasses_51: (classesProp?: Partial<Record<"overlay" | "previewB
     cx: (...args: any) => string;
 };
 
-declare const useClasses_52: (classesProp?: Partial<Record<"progressbar" | "icon" | "root" | "removeButton" | "fail" | "progressbarBack" | "nameText" | "progressTextContainer" | "previewContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_62: (classesProp?: Partial<Record<"root" | "progressbar" | "icon" | "removeButton" | "fail" | "progressbarBack" | "nameText" | "progressTextContainer" | "previewContainer", string>>, addStatic?: boolean) => {
     classes: {
+        root: string;
         progressbar: string;
         icon: string;
-        root: string;
         removeButton: string;
         fail: string;
         progressbarBack: string;
@@ -8922,11 +9101,11 @@ declare const useClasses_52: (classesProp?: Partial<Record<"progressbar" | "icon
     cx: (...args: any) => string;
 };
 
-declare const useClasses_53: (classesProp?: Partial<Record<"container" | "icon" | "root" | "baseContainer" | "iconSelected" | "menuListRoot" | "menuList", string>>, addStatic?: boolean) => {
+declare const useClasses_63: (classesProp?: Partial<Record<"root" | "container" | "icon" | "baseContainer" | "iconSelected" | "menuListRoot" | "menuList", string>>, addStatic?: boolean) => {
     classes: {
+        root: string;
         container: string;
         icon: string;
-        root: string;
         baseContainer: string;
         iconSelected: string;
         menuListRoot: string;
@@ -8939,10 +9118,10 @@ declare const useClasses_53: (classesProp?: Partial<Record<"container" | "icon"
     cx: (...args: any) => string;
 };
 
-declare const useClasses_54: (classesProp?: Partial<Record<"icon" | "root" | "pageSizeOptions" | "iconContainer" | "pageSizeTextContainer" | "pageSizeOptionsSelect" | "pageNavigator" | "pageInfo" | "pageJump" | "pageSizeInput" | "pageSizeInputRoot" | "pageSizeInputContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_64: (classesProp?: Partial<Record<"root" | "icon" | "pageSizeOptions" | "iconContainer" | "pageSizeTextContainer" | "pageSizeOptionsSelect" | "pageNavigator" | "pageInfo" | "pageJump" | "pageSizeInput" | "pageSizeInputRoot" | "pageSizeInputContainer", string>>, addStatic?: boolean) => {
     classes: {
-        icon: string;
         root: string;
+        icon: string;
         pageSizeOptions: string;
         iconContainer: string;
         pageSizeTextContainer: string;
@@ -8961,7 +9140,7 @@ declare const useClasses_54: (classesProp?: Partial<Record<"icon" | "root" | "pa
     cx: (...args: any) => string;
 };
 
-declare const useClasses_55: (classesProp?: Partial<Record<"button" | "root" | "dropDownMenu" | "actionContainer" | "dropDownMenuButton" | "dropDownMenuButtonSelected", string>>, addStatic?: boolean) => {
+declare const useClasses_65: (classesProp?: Partial<Record<"button" | "root" | "dropDownMenu" | "actionContainer" | "dropDownMenuButton" | "dropDownMenuButtonSelected", string>>, addStatic?: boolean) => {
     classes: {
         button: string;
         root: string;
@@ -8977,7 +9156,7 @@ declare const useClasses_55: (classesProp?: Partial<Record<"button" | "root" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_56: (classesProp?: Partial<Record<"link" | "a" | "root" | "orderedList" | "currentPage" | "centerContainer" | "separatorContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_66: (classesProp?: Partial<Record<"link" | "a" | "root" | "orderedList" | "currentPage" | "centerContainer" | "separatorContainer", string>>, addStatic?: boolean) => {
     classes: {
         link: string;
         a: string;
@@ -8994,12 +9173,12 @@ declare const useClasses_56: (classesProp?: Partial<Record<"link" | "a" | "root"
     cx: (...args: any) => string;
 };
 
-declare const useClasses_57: (classesProp?: Partial<Record<"radio" | "horizontal" | "icon" | "root" | "radioRoot", string>>, addStatic?: boolean) => {
+declare const useClasses_67: (classesProp?: Partial<Record<"root" | "radio" | "horizontal" | "icon" | "radioRoot", string>>, addStatic?: boolean) => {
     classes: {
+        root: string;
         radio: string;
         horizontal: string;
         icon: string;
-        root: string;
         radioRoot: string;
     };
     css: {
@@ -9009,7 +9188,7 @@ declare const useClasses_57: (classesProp?: Partial<Record<"radio" | "horizontal
     cx: (...args: any) => string;
 };
 
-declare const useClasses_58: (classesProp?: Partial<Record<"root" | "rootClosed" | "anchorOriginTopCenter" | "anchorOriginBottomCenter", string>>, addStatic?: boolean) => {
+declare const useClasses_68: (classesProp?: Partial<Record<"root" | "rootClosed" | "anchorOriginTopCenter" | "anchorOriginBottomCenter", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         rootClosed: string;
@@ -9023,7 +9202,7 @@ declare const useClasses_58: (classesProp?: Partial<Record<"root" | "rootClosed"
     cx: (...args: any) => string;
 };
 
-declare const useClasses_59: (classesProp?: Partial<Record<"actionContainer" | "iconContainer" | "actionsInnerContainer" | "closeAction", string>>, addStatic?: boolean) => {
+declare const useClasses_69: (classesProp?: Partial<Record<"actionContainer" | "iconContainer" | "actionsInnerContainer" | "closeAction", string>>, addStatic?: boolean) => {
     classes: {
         actionContainer: string;
         iconContainer: string;
@@ -9037,11 +9216,11 @@ declare const useClasses_59: (classesProp?: Partial<Record<"actionContainer" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_6: (classesProp?: Partial<Record<"root" | "gutter" | "infoDisabled", string>>, addStatic?: boolean) => {
+declare const useClasses_7: (classesProp?: Partial<Record<"root" | "labelDisabled" | "childGutter", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
-        gutter: string;
-        infoDisabled: string;
+        labelDisabled: string;
+        childGutter: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -9050,10 +9229,10 @@ declare const useClasses_6: (classesProp?: Partial<Record<"root" | "gutter" | "i
     cx: (...args: any) => string;
 };
 
-declare const useClasses_60: (classesProp?: Partial<Record<"default" | "root" | "warning" | "action" | "error" | "success" | "message" | "baseVariant" | "outContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_70: (classesProp?: Partial<Record<"root" | "default" | "warning" | "action" | "error" | "success" | "message" | "baseVariant" | "outContainer", string>>, addStatic?: boolean) => {
     classes: {
-        default: string;
         root: string;
+        default: string;
         warning: string;
         action: string;
         error: string;
@@ -9069,7 +9248,7 @@ declare const useClasses_60: (classesProp?: Partial<Record<"default" | "root" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_61: (classesProp?: Partial<Record<"root" | "anchorOriginTopCenter" | "anchorOriginBottomCenter" | "anchorOriginTopRight" | "anchorOriginBottomRight" | "anchorOriginTopLeft" | "anchorOriginBottomLeft", string>>, addStatic?: boolean) => {
+declare const useClasses_71: (classesProp?: Partial<Record<"root" | "anchorOriginTopCenter" | "anchorOriginBottomCenter" | "anchorOriginTopRight" | "anchorOriginBottomRight" | "anchorOriginTopLeft" | "anchorOriginBottomLeft", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         anchorOriginTopCenter: string;
@@ -9086,10 +9265,10 @@ declare const useClasses_61: (classesProp?: Partial<Record<"root" | "anchorOrigi
     cx: (...args: any) => string;
 };
 
-declare const useClasses_62: (classesProp?: Partial<Record<"default" | "root" | "warning" | "action" | "error" | "success" | "message" | "messageSpan" | "messageText" | "iconVariant", string>>, addStatic?: boolean) => {
+declare const useClasses_72: (classesProp?: Partial<Record<"root" | "default" | "warning" | "action" | "error" | "success" | "message" | "messageSpan" | "messageText" | "iconVariant", string>>, addStatic?: boolean) => {
     classes: {
-        default: string;
         root: string;
+        default: string;
         warning: string;
         action: string;
         error: string;
@@ -9106,7 +9285,7 @@ declare const useClasses_62: (classesProp?: Partial<Record<"default" | "root" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_63: (classesProp?: Partial<Record<"snackItemRoot", string>>, addStatic?: boolean) => {
+declare const useClasses_73: (classesProp?: Partial<Record<"snackItemRoot", string>>, addStatic?: boolean) => {
     classes: {
         snackItemRoot: string;
     };
@@ -9117,7 +9296,7 @@ declare const useClasses_63: (classesProp?: Partial<Record<"snackItemRoot", stri
     cx: (...args: any) => string;
 };
 
-declare const useClasses_64: (classesProp?: Partial<Record<"root" | "semantic" | "actions" | "selectAllContainer" | "selectAll" | "selectAllPages" | "divider", string>>, addStatic?: boolean) => {
+declare const useClasses_74: (classesProp?: Partial<Record<"root" | "semantic" | "actions" | "selectAllContainer" | "selectAll" | "selectAllPages" | "divider", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         semantic: string;
@@ -9134,7 +9313,7 @@ declare const useClasses_64: (classesProp?: Partial<Record<"root" | "semantic" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_65: (classesProp?: Partial<Record<"root" | "name" | "global" | "wrapper" | "actions" | "positionSticky" | "positionFixed" | "globalWrapperComplement" | "globalSectionArea" | "backButton", string>>, addStatic?: boolean) => {
+declare const useClasses_75: (classesProp?: Partial<Record<"root" | "name" | "global" | "wrapper" | "actions" | "positionSticky" | "positionFixed" | "globalWrapperComplement" | "globalSectionArea" | "backButton", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         name: string;
@@ -9154,7 +9333,7 @@ declare const useClasses_65: (classesProp?: Partial<Record<"root" | "name" | "gl
     cx: (...args: any) => string;
 };
 
-declare const useClasses_66: (classesProp?: Partial<Record<"placeholder" | "arrow" | "label" | "root" | "dropdown" | "error" | "selectionDisabled" | "description" | "labelContainer" | "dropdownHeaderInvalid" | "dropdownHeaderOpen" | "dropdownHeader" | "dropdownListContainer" | "rootList", string>>, addStatic?: boolean) => {
+declare const useClasses_76: (classesProp?: Partial<Record<"placeholder" | "arrow" | "label" | "root" | "dropdown" | "error" | "selectionDisabled" | "description" | "labelContainer" | "dropdownHeaderInvalid" | "dropdownHeaderOpen" | "dropdownHeader" | "dropdownListContainer" | "rootList", string>>, addStatic?: boolean) => {
     classes: {
         placeholder: string;
         arrow: string;
@@ -9178,7 +9357,7 @@ declare const useClasses_66: (classesProp?: Partial<Record<"placeholder" | "arro
     cx: (...args: any) => string;
 };
 
-declare const useClasses_67: (classesProp?: Partial<Record<"selection" | "selectAllContainer" | "selectAll" | "dropdownListContainer" | "rootList" | "searchContainer" | "listBorderDown" | "listContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_77: (classesProp?: Partial<Record<"selection" | "selectAllContainer" | "selectAll" | "dropdownListContainer" | "rootList" | "searchContainer" | "listBorderDown" | "listContainer", string>>, addStatic?: boolean) => {
     classes: {
         selection: string;
         selectAllContainer: string;
@@ -9196,7 +9375,7 @@ declare const useClasses_67: (classesProp?: Partial<Record<"selection" | "select
     cx: (...args: any) => string;
 };
 
-declare const useClasses_68: (classesProp?: Partial<Record<"root" | "stickyHeader" | "stickyColumns" | "listRow", string>>, addStatic?: boolean) => {
+declare const useClasses_78: (classesProp?: Partial<Record<"root" | "stickyHeader" | "stickyColumns" | "listRow", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         stickyHeader: string;
@@ -9210,7 +9389,7 @@ declare const useClasses_68: (classesProp?: Partial<Record<"root" | "stickyHeade
     cx: (...args: any) => string;
 };
 
-declare const useClasses_69: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
+declare const useClasses_79: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
     };
@@ -9221,15 +9400,11 @@ declare const useClasses_69: (classesProp?: Partial<Record<"root", string>>, add
     cx: (...args: any) => string;
 };
 
-declare const useClasses_7: (classesProp?: Partial<Record<"show" | "root" | "hideText" | "defaultIcon" | "warningText" | "topGutter" | "topBorder", string>>, addStatic?: boolean) => {
+declare const useClasses_8: (classesProp?: Partial<Record<"root" | "gutter" | "infoDisabled", string>>, addStatic?: boolean) => {
     classes: {
-        show: string;
         root: string;
-        hideText: string;
-        defaultIcon: string;
-        warningText: string;
-        topGutter: string;
-        topBorder: string;
+        gutter: string;
+        infoDisabled: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -9238,7 +9413,7 @@ declare const useClasses_7: (classesProp?: Partial<Record<"show" | "root" | "hid
     cx: (...args: any) => string;
 };
 
-declare const useClasses_70: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
+declare const useClasses_80: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
     };
@@ -9249,7 +9424,7 @@ declare const useClasses_70: (classesProp?: Partial<Record<"root", string>>, add
     cx: (...args: any) => string;
 };
 
-declare const useClasses_71: (classesProp?: Partial<Record<"root" | "stickyHeader", string>>, addStatic?: boolean) => {
+declare const useClasses_81: (classesProp?: Partial<Record<"root" | "stickyHeader", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         stickyHeader: string;
@@ -9261,13 +9436,13 @@ declare const useClasses_71: (classesProp?: Partial<Record<"root" | "stickyHeade
     cx: (...args: any) => string;
 };
 
-declare const useClasses_72: (classesProp?: Partial<Record<"body" | "footer" | "head" | "resizer" | "root" | "resizable" | "sortable" | "sorted" | "stickyColumn" | "stickyColumnMostLeft" | "stickyColumnLeastRight" | "groupColumnMostLeft" | "groupColumnMostRight" | "resizing" | "alignLeft" | "alignCenter" | "alignRight" | "alignJustify" | "variantNone" | "variantCheckbox" | "variantActions" | "variantExpand" | "variantList" | "headerContent" | "headerText" | "headerParagraph" | "sortableHeaderText" | "sortButton" | "sortIcon" | "alignFlexLeft" | "alignFlexRight" | "alignFlexCenter" | "alignFlexJustify", string>>, addStatic?: boolean) => {
+declare const useClasses_82: (classesProp?: Partial<Record<"body" | "footer" | "head" | "root" | "resizer" | "resizable" | "sortable" | "sorted" | "stickyColumn" | "stickyColumnMostLeft" | "stickyColumnLeastRight" | "groupColumnMostLeft" | "groupColumnMostRight" | "resizing" | "alignLeft" | "alignCenter" | "alignRight" | "alignJustify" | "variantNone" | "variantCheckbox" | "variantActions" | "variantExpand" | "variantList" | "headerContent" | "headerText" | "headerParagraph" | "sortableHeaderText" | "sortButton" | "sortIcon" | "alignFlexLeft" | "alignFlexRight" | "alignFlexCenter" | "alignFlexJustify", string>>, addStatic?: boolean) => {
     classes: {
         body: string;
         footer: string;
         head: string;
-        resizer: string;
         root: string;
+        resizer: string;
         resizable: string;
         sortable: string;
         sorted: string;
@@ -9304,13 +9479,13 @@ declare const useClasses_72: (classesProp?: Partial<Record<"body" | "footer" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_73: (classesProp?: Partial<Record<"body" | "footer" | "head" | "expanded" | "root" | "selected" | "hover" | "striped" | "variantList" | "variantListHead", string>>, addStatic?: boolean) => {
+declare const useClasses_83: (classesProp?: Partial<Record<"body" | "footer" | "head" | "root" | "expanded" | "selected" | "hover" | "striped" | "variantList" | "variantListHead", string>>, addStatic?: boolean) => {
     classes: {
         body: string;
         footer: string;
         head: string;
-        expanded: string;
         root: string;
+        expanded: string;
         selected: string;
         hover: string;
         striped: string;
@@ -9324,7 +9499,7 @@ declare const useClasses_73: (classesProp?: Partial<Record<"body" | "footer" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_74: (classesProp?: Partial<Record<"body" | "footer" | "head" | "root" | "resizable" | "sorted" | "stickyColumn" | "stickyColumnMostLeft" | "stickyColumnLeastRight" | "groupColumnMostLeft" | "groupColumnMostRight" | "resizing" | "alignLeft" | "alignCenter" | "alignRight" | "alignJustify" | "variantNone" | "variantCheckbox" | "variantActions" | "variantExpand" | "variantList" | "variantListHead" | "variantListactions" | "variantListcheckbox", string>>, addStatic?: boolean) => {
+declare const useClasses_84: (classesProp?: Partial<Record<"body" | "footer" | "head" | "root" | "resizable" | "sorted" | "stickyColumn" | "stickyColumnMostLeft" | "stickyColumnLeastRight" | "groupColumnMostLeft" | "groupColumnMostRight" | "resizing" | "alignLeft" | "alignCenter" | "alignRight" | "alignJustify" | "variantNone" | "variantCheckbox" | "variantActions" | "variantExpand" | "variantList" | "variantListHead" | "variantListactions" | "variantListcheckbox", string>>, addStatic?: boolean) => {
     classes: {
         body: string;
         footer: string;
@@ -9358,7 +9533,7 @@ declare const useClasses_74: (classesProp?: Partial<Record<"body" | "footer" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_75: (classesProp?: Partial<Record<"root" | "formContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_85: (classesProp?: Partial<Record<"root" | "formContainer", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         formContainer: string;
@@ -9370,7 +9545,7 @@ declare const useClasses_75: (classesProp?: Partial<Record<"root" | "formContain
     cx: (...args: any) => string;
 };
 
-declare const useClasses_76: (classesProp?: Partial<Record<"section" | "root" | "rightSection" | "leftSection", string>>, addStatic?: boolean) => {
+declare const useClasses_86: (classesProp?: Partial<Record<"section" | "root" | "rightSection" | "leftSection", string>>, addStatic?: boolean) => {
     classes: {
         section: string;
         root: string;
@@ -9384,7 +9559,7 @@ declare const useClasses_76: (classesProp?: Partial<Record<"section" | "root" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_77: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
+declare const useClasses_87: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
     };
@@ -9395,7 +9570,7 @@ declare const useClasses_77: (classesProp?: Partial<Record<"root", string>>, add
     cx: (...args: any) => string;
 };
 
-declare const useClasses_78: (classesProp?: Partial<Record<"root" | "sortDropdown", string>>, addStatic?: boolean) => {
+declare const useClasses_88: (classesProp?: Partial<Record<"root" | "sortDropdown", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         sortDropdown: string;
@@ -9407,13 +9582,48 @@ declare const useClasses_78: (classesProp?: Partial<Record<"root" | "sortDropdow
     cx: (...args: any) => string;
 };
 
-declare const useClasses_79: (classesProp?: Partial<Record<"label" | "root" | "error" | "description" | "labelContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_89: (classesProp?: Partial<Record<"root" | "rangeCalendarContainer" | "singleCalendar" | "focusSelection" | "calendarMonthlyCell" | "calendarMonthlyCellSelected", string>>, addStatic?: boolean) => {
     classes: {
-        label: string;
         root: string;
-        error: string;
-        description: string;
-        labelContainer: string;
+        rangeCalendarContainer: string;
+        singleCalendar: string;
+        focusSelection: string;
+        calendarMonthlyCell: string;
+        calendarMonthlyCellSelected: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_9: (classesProp?: Partial<Record<"root" | "show" | "hideText" | "defaultIcon" | "warningText" | "topGutter" | "topBorder", string>>, addStatic?: boolean) => {
+    classes: {
+        root: string;
+        show: string;
+        hideText: string;
+        defaultIcon: string;
+        warningText: string;
+        topGutter: string;
+        topBorder: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_90: (classesProp?: Partial<Record<"input" | "root" | "invalid" | "inputBorderContainer" | "headerDayOfWeek" | "headerDate" | "invalidMessageStyling", string>>, addStatic?: boolean) => {
+    classes: {
+        input: string;
+        root: string;
+        invalid: string;
+        inputBorderContainer: string;
+        headerDayOfWeek: string;
+        headerDate: string;
+        invalidMessageStyling: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -9422,16 +9632,13 @@ declare const useClasses_79: (classesProp?: Partial<Record<"label" | "root" | "e
     cx: (...args: any) => string;
 };
 
-declare const useClasses_8: (classesProp?: Partial<Record<"label" | "listbox" | "horizontal" | "vertical" | "root" | "error" | "invalid" | "description", string>>, addStatic?: boolean) => {
+declare const useClasses_91: (classesProp?: Partial<Record<"label" | "root" | "error" | "description" | "labelContainer", string>>, addStatic?: boolean) => {
     classes: {
         label: string;
-        listbox: string;
-        horizontal: string;
-        vertical: string;
         root: string;
         error: string;
-        invalid: string;
         description: string;
+        labelContainer: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -9440,11 +9647,11 @@ declare const useClasses_8: (classesProp?: Partial<Record<"label" | "listbox" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_80: (classesProp?: Partial<Record<"header" | "space" | "root" | "actionBar" | "dropdown" | "panel" | "baseDropdownSelection" | "rightSidePanel" | "leftSidePanel" | "applyButton", string>>, addStatic?: boolean) => {
+declare const useClasses_92: (classesProp?: Partial<Record<"header" | "root" | "space" | "actionBar" | "dropdown" | "panel" | "baseDropdownSelection" | "rightSidePanel" | "leftSidePanel" | "applyButton", string>>, addStatic?: boolean) => {
     classes: {
         header: string;
-        space: string;
         root: string;
+        space: string;
         actionBar: string;
         dropdown: string;
         panel: string;
@@ -9460,11 +9667,11 @@ declare const useClasses_80: (classesProp?: Partial<Record<"header" | "space" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_81: (classesProp?: Partial<Record<"label" | "icon" | "root" | "dropdown" | "action" | "error" | "actionContainer" | "panel" | "description" | "labelContainer" | "leftContainer" | "rightContainer" | "dropdownHeaderInvalid" | "dropdownHeaderOpen", string>>, addStatic?: boolean) => {
+declare const useClasses_93: (classesProp?: Partial<Record<"label" | "root" | "icon" | "dropdown" | "action" | "error" | "actionContainer" | "panel" | "description" | "labelContainer" | "leftContainer" | "rightContainer" | "dropdownHeaderInvalid" | "dropdownHeaderOpen", string>>, addStatic?: boolean) => {
     classes: {
         label: string;
-        icon: string;
         root: string;
+        icon: string;
         dropdown: string;
         action: string;
         error: string;
@@ -9484,7 +9691,7 @@ declare const useClasses_81: (classesProp?: Partial<Record<"label" | "icon" | "r
     cx: (...args: any) => string;
 };
 
-declare const useClasses_82: (classesProp?: Partial<Record<"button" | "text" | "root" | "notSelected", string>>, addStatic?: boolean) => {
+declare const useClasses_94: (classesProp?: Partial<Record<"button" | "text" | "root" | "notSelected", string>>, addStatic?: boolean) => {
     classes: {
         button: string;
         text: string;
@@ -9498,7 +9705,7 @@ declare const useClasses_82: (classesProp?: Partial<Record<"button" | "text" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_83: (classesProp?: Partial<Record<"root" | "positionFixed" | "positionAbsolute", string>>, addStatic?: boolean) => {
+declare const useClasses_95: (classesProp?: Partial<Record<"root" | "positionFixed" | "positionAbsolute", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         positionFixed: string;
@@ -9511,7 +9718,7 @@ declare const useClasses_83: (classesProp?: Partial<Record<"root" | "positionFix
     cx: (...args: any) => string;
 };
 
-declare const useClasses_84: (classesProp?: Partial<Record<"button" | "text" | "root" | "selected", string>>, addStatic?: boolean) => {
+declare const useClasses_96: (classesProp?: Partial<Record<"button" | "text" | "root" | "selected", string>>, addStatic?: boolean) => {
     classes: {
         button: string;
         text: string;
@@ -9525,7 +9732,7 @@ declare const useClasses_84: (classesProp?: Partial<Record<"button" | "text" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_85: (classesProp?: Partial<Record<"root" | "selected" | "positionSticky" | "positionFixed" | "notSelectedRoot" | "notSelected", string>>, addStatic?: boolean) => {
+declare const useClasses_97: (classesProp?: Partial<Record<"root" | "selected" | "positionSticky" | "positionFixed" | "notSelectedRoot" | "notSelected", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         selected: string;
@@ -9541,13 +9748,13 @@ declare const useClasses_85: (classesProp?: Partial<Record<"root" | "selected" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_86: (classesProp?: Partial<Record<"button" | "input" | "text" | "icon" | "root" | "inputBorderContainer" | "inputRoot" | "largeText" | "textEmpty" | "iconVisible", string>>, addStatic?: boolean) => {
+declare const useClasses_98: (classesProp?: Partial<Record<"button" | "input" | "text" | "root" | "icon" | "inputBorderContainer" | "inputRoot" | "largeText" | "textEmpty" | "iconVisible", string>>, addStatic?: boolean) => {
     classes: {
         button: string;
         input: string;
         text: string;
-        icon: string;
         root: string;
+        icon: string;
         inputBorderContainer: string;
         inputRoot: string;
         largeText: string;
@@ -9561,139 +9768,9 @@ declare const useClasses_86: (classesProp?: Partial<Record<"button" | "input" |
     cx: (...args: any) => string;
 };
 
-declare const useClasses_87: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
-    classes: {
-        root: string;
-    };
-    css: {
-        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
-        (...args: CSSInterpolation[]): string;
-    };
-    cx: (...args: any) => string;
-};
-
-declare const useClasses_88: (classesProp?: Partial<Record<"root" | "removeButton" | "topGroup" | "subGroup" | "combinator" | "topCombinator" | "combinatorButton" | "topRemoveButton" | "topRemoveButtonDisabled" | "rulesContainer" | "subRulesContainer" | "actionButtonContainer" | "topActionButtonContainer" | "topRulesContainer" | "buttonBackground", string>>, addStatic?: boolean) => {
-    classes: {
-        root: string;
-        removeButton: string;
-        topGroup: string;
-        subGroup: string;
-        combinator: string;
-        topCombinator: string;
-        combinatorButton: string;
-        topRemoveButton: string;
-        topRemoveButtonDisabled: string;
-        rulesContainer: string;
-        subRulesContainer: string;
-        actionButtonContainer: string;
-        topActionButtonContainer: string;
-        topRulesContainer: string;
-        buttonBackground: string;
-    };
-    css: {
-        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
-        (...args: CSSInterpolation[]): string;
-    };
-    cx: (...args: any) => string;
-};
-
-declare const useClasses_89: (classesProp?: Partial<Record<"label" | "root" | "colorPicker" | "panel" | "description" | "labelContainer" | "headerColorValue" | "headerColorIcon" | "colorPickerIcon" | "recommendedColorsRoot" | "dropdownRootIconOnly" | "headerColorIconOnly" | "pickerFields", string>>, addStatic?: boolean) => {
-    classes: {
-        label: string;
-        root: string;
-        colorPicker: string;
-        panel: string;
-        description: string;
-        labelContainer: string;
-        headerColorValue: string;
-        headerColorIcon: string;
-        colorPickerIcon: string;
-        recommendedColorsRoot: string;
-        dropdownRootIconOnly: string;
-        headerColorIconOnly: string;
-        pickerFields: string;
-    };
-    css: {
-        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
-        (...args: CSSInterpolation[]): string;
-    };
-    cx: (...args: any) => string;
-};
-
-declare const useClasses_9: (classesProp?: Partial<Record<"list" | "root" | "popper", string>>, addStatic?: boolean) => {
-    classes: {
-        list: string;
-        root: string;
-        popper: string;
-    };
-    css: {
-        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
-        (...args: CSSInterpolation[]): string;
-    };
-    cx: (...args: any) => string;
-};
-
-declare const useClasses_90: (classesProp?: Partial<Record<"title" | "main" | "dot" | "root" | "controls" | "xs" | "actions" | "panel" | "fullscreen" | "closeButton" | "mainContainer" | "pageCounter" | "mainXs" | "mainFullscreen" | "counterContainer" | "counter" | "slideControls" | "slidesViewport" | "slidesContainer" | "dots" | "dotsXs" | "dotSelected" | "thumbnail" | "thumbnailSelected", string>>, addStatic?: boolean) => {
-    classes: {
-        title: string;
-        main: string;
-        dot: string;
-        root: string;
-        controls: string;
-        xs: string;
-        actions: string;
-        panel: string;
-        fullscreen: string;
-        closeButton: string;
-        mainContainer: string;
-        pageCounter: string;
-        mainXs: string;
-        mainFullscreen: string;
-        counterContainer: string;
-        counter: string;
-        slideControls: string;
-        slidesViewport: string;
-        slidesContainer: string;
-        dots: string;
-        dotsXs: string;
-        dotSelected: string;
-        thumbnail: string;
-        thumbnailSelected: string;
-    };
-    css: {
-        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
-        (...args: CSSInterpolation[]): string;
-    };
-    cx: (...args: any) => string;
-};
-
-declare const useClasses_91: (classesProp?: Partial<Record<"image" | "slide", string>>, addStatic?: boolean) => {
-    classes: {
-        image: string;
-        slide: string;
-    };
-    css: {
-        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
-        (...args: CSSInterpolation[]): string;
-    };
-    cx: (...args: any) => string;
-};
-
-declare const useClasses_92: (classesProp?: Partial<Record<"placeholder" | "label" | "icon" | "root" | "error" | "description" | "labelContainer" | "dropdownHeaderInvalid" | "dropdownHeaderOpen" | "dropdownHeader" | "placeholderDisabled" | "dropdownPanel" | "timePopperContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_99: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
     classes: {
-        placeholder: string;
-        label: string;
-        icon: string;
         root: string;
-        error: string;
-        description: string;
-        labelContainer: string;
-        dropdownHeaderInvalid: string;
-        dropdownHeaderOpen: string;
-        dropdownHeader: string;
-        placeholderDisabled: string;
-        dropdownPanel: string;
-        timePopperContainer: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -10013,7 +10090,7 @@ export declare function useSavedState<T>(defaultState: T): [T | undefined, (v?:
 
 export declare const useScrollTo: (selectedIndexProp?: number, scrollElementId?: string | undefined, href?: boolean, offset?: number, options?: HvScrollToVerticalOption[], onChange?: ((event: Event | React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>, index: number) => void) | undefined, direction?: "column" | "row") => [number, (event: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>, id: string, index: number, wrappedOnChange?: ((index: number) => void) | undefined) => void];
 
-export declare const useSelectionPath: (data: any, selectedId: any) => string[];
+export declare const useSelectionPath: (data: HvHeaderNavigationItemProp[], selectedId?: string) => string[];
 
 export declare type UseTableStylesProps = (<D extends object = Record<string, unknown>>(hooks: Hooks<D>) => void) & {
     pluginName: string;
@@ -10028,8 +10105,8 @@ export declare const useWidth: () => Breakpoint_2;
 declare type ValueOf<T> = T[keyof T];
 
 export declare const verticalNavigationClasses: {
-    slider: "HvVerticalNavigation-slider";
     root: "HvVerticalNavigation-root";
+    slider: "HvVerticalNavigation-slider";
     collapsed: "HvVerticalNavigation-collapsed";
 };
 
@@ -10064,9 +10141,9 @@ export declare const verticalNavigationSliderClasses: {
 };
 
 export declare const verticalNavigationTreeClasses: {
+    root: "HvVerticalNavigationTree-root";
     list: "HvVerticalNavigationTree-list";
     popup: "HvVerticalNavigationTree-popup";
-    root: "HvVerticalNavigationTree-root";
     listItem: "HvVerticalNavigationTree-listItem";
     collapsed: "HvVerticalNavigationTree-collapsed";
     navigationPopup: "HvVerticalNavigationTree-navigationPopup";
@@ -10082,8 +10159,8 @@ export declare const verticalScrollListItemClasses: {
 export declare type VisibilitySelectorActions = "previous_month" | "next_month" | "previous_year" | "next_year" | "month" | "month_year";
 
 export declare const warningTextClasses: {
-    show: "HvWarningText-show";
     root: "HvWarningText-root";
+    show: "HvWarningText-show";
     hideText: "HvWarningText-hideText";
     defaultIcon: "HvWarningText-defaultIcon";
     warningText: "HvWarningText-warningText";