@hitachivantara/uikit-react-core 5.1.0 → 5.1.2

package/dist/types/index.d.ts

@@ -172,12 +172,12 @@ export declare const baseSwitchClasses: HvBaseSwitchClasses;
 
 export declare const breadCrumbClasses: HvBreadCrumbClasses;
 
-export declare type Breakpoint = {
+export declare interface Breakpoint {
     cols?: number;
     maxWidth?: number;
     minWidth?: number;
     spacing?: Spacing;
-};
+}
 
 export declare const buildAriaPropsFromContext: (props: any, context: any, isInvalid: any, inputId: any) => {
     "aria-labelledby": any;
@@ -267,10 +267,10 @@ export declare const defaultGetToggleAllRowsSelectedProps: (props: any, { instan
 
 export declare const defaultGetToggleRowSelectedProps: (props: any, meta: any) => any[];
 
-declare type Descriptor = {
+declare interface Descriptor {
     id?: string;
     htmlFor?: string;
-};
+}
 
 export declare const dialogActionClasses: HvDialogActionClasses;
 
@@ -558,35 +558,21 @@ export declare interface HvActionsGenericProps extends HvBaseProps {
  * As such, its functionality, if any, for accessibility purposes must be provided through an alternative mean,
  * or by using a regular icon button or toggle button instead.
  */
-export declare const HvAdornment: ForwardRefExoticComponent<HvBaseProps<HTMLDivElement | HTMLButtonElement, {
-    onMouseDown: any;
-    onKeyDown: any;
-}> & {
-    /** The icon to be added into the input. */
-    icon: React.ReactNode;
-    /** When the adornment should be displayed. */
-    showWhen?: HvFormStatus | undefined;
-    /** Function to be executed when this element is clicked. */
-    onClick?: MouseEventHandler<HTMLButtonElement> | undefined;
-    /** If this property is defined the adornment visibility will be exclusively controlled by this value. */
-    isVisible?: boolean | undefined;
-    /** A Jss Object used to override or extend the styles applied to the component. */
-    classes?: HvAdornmentClasses | undefined;
-} & RefAttributes<HTMLDivElement | HTMLButtonElement>>;
+export declare const HvAdornment: ForwardRefExoticComponent<HvAdornmentProps & RefAttributes<HTMLDivElement | HTMLButtonElement>>;
 
-export declare type HvAdornmentClasses = {
+export declare interface HvAdornmentClasses {
     root?: string;
     icon?: string;
     adornment?: string;
     adornmentIcon?: string;
     hideIcon?: string;
     adornmentButton?: string;
-};
+}
 
-export declare type HvAdornmentProps = HvBaseProps<HTMLDivElement | HTMLButtonElement, {
+export declare interface HvAdornmentProps extends HvBaseProps<HTMLDivElement | HTMLButtonElement, {
     onMouseDown: any;
     onKeyDown: any;
-}> & {
+}> {
     /** The icon to be added into the input. */
     icon: React.ReactNode;
     /** When the adornment should be displayed. */
@@ -597,7 +583,7 @@ export declare type HvAdornmentProps = HvBaseProps<HTMLDivElement | HTMLButtonEl
     isVisible?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvAdornmentClasses;
-};
+}
 
 export declare const HvAppSwitcher: ({ id, className, classes, layout, title, applications, onActionClickedCallback, isActionSelectedCallback, header, footer, isOpen, }: HvAppSwitcherProps) => JSX_2.Element;
 
@@ -846,7 +832,7 @@ export declare interface HvBannerContentClasses {
 
 export declare interface HvBannerContentProps extends Omit<SnackbarContentProps, "variant" | "classes" | "onClose">, HvBaseProps {
     /** The message to display. */
-    content?: React.ReactNode;
+    content?: string;
     /** Variant of the snackbar. */
     variant?: HvBannerVariant;
     /** Controls if the associated icon to the variant should be shown. */
@@ -875,7 +861,7 @@ export declare interface HvBannerProps extends Omit<SnackbarProps, "anchorOrigin
     /** Callback fired when the component requests to be closed. Typically onClose is used to set state in the parent component, which is used to control the Snackbar open prop. The reason parameter can optionally be used to control the response to onClose, for example ignoring clickaway. */
     onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;
     /** The message to display. */
-    label?: React.ReactNode;
+    label?: string;
     /** The anchor of the Snackbar. */
     anchorOrigin?: "top" | "bottom";
     /** Variant of the snackbar. */
@@ -1683,44 +1669,44 @@ export declare interface HvCalendarProps {
  */
 export declare const HvCard: ({ classes, className, children, icon, selectable, selected, statusColor, bgcolor, ...others }: HvCardProps) => JSX_2.Element;
 
-export declare type HvCardClasses = {
+export declare interface HvCardClasses {
     root?: string;
     selectable?: string;
     selected?: string;
     semanticBar?: string;
     semanticContainer?: string;
     icon?: string;
-};
+}
 
 export declare const HvCardContent: ({ id, classes, className, children, onClick, ...others }: HvCardContentProps) => JSX_2.Element;
 
-export declare type HvCardContentClasses = {
+export declare interface HvCardContentClasses {
     content?: string;
-};
+}
 
-export declare type HvCardContentProps = Omit<CardContentProps, "classes"> & HvBaseProps & {
+export declare interface HvCardContentProps extends Omit<CardContentProps, "classes">, HvBaseProps {
     /** Id to be applied to the root node. */
     id?: string;
     /** The function that will be executed when this section is clicked. */
     onClick?: (event: React.SyntheticEvent) => void;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvCardContentClasses;
-};
+}
 
 export declare const HvCardHeader: ({ classes, className, title, subheader, icon, onClick, ...others }: HvCardHeaderProps) => JSX_2.Element;
 
-export declare type HvCardHeaderClasses = {
+export declare interface HvCardHeaderClasses {
     root?: string;
     title?: string;
     titleShort?: string;
     subheader?: string;
     action?: string;
     content?: string;
-};
+}
 
-export declare type HvCardHeaderProps = Omit<CardHeaderProps, "classes"> & HvBaseProps<HTMLDivElement, {
+export declare interface HvCardHeaderProps extends Omit<CardHeaderProps, "classes">, HvBaseProps<HTMLDivElement, {
     title: any;
-}> & {
+}> {
     /** The renderable content inside the title slot of the header. */
     title: React.ReactNode;
     /** The renderable content inside the subheader slot of the header. */
@@ -1731,19 +1717,19 @@ export declare type HvCardHeaderProps = Omit<CardHeaderProps, "classes"> & HvBas
     onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvCardHeaderClasses;
-};
+}
 
 export declare const HvCardMedia: ({ id, classes, className, children, title, onClick, ...others }: HvCardMediaProps) => JSX_2.Element;
 
-export declare type HvCardMediaClasses = {
+export declare interface HvCardMediaClasses {
     root?: string;
     media?: string;
-};
+}
 
-export declare type HvCardMediaProps = Omit<CardMediaProps, "classes"> & ImgHTMLAttributes<HTMLImageElement> & HvBaseProps<HTMLDivElement, {
+export declare interface HvCardMediaProps extends Omit<CardMediaProps, "classes">, ImgHTMLAttributes<HTMLDivElement>, HvBaseProps<HTMLDivElement, {
     onClick: any;
     title: any;
-}> & {
+}> {
     /** Id to be applied to the root node. */
     id?: string;
     /** The title of the media. */
@@ -1756,9 +1742,9 @@ export declare type HvCardMediaProps = Omit<CardMediaProps, "classes"> & ImgHTML
     image?: string;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvCardMediaClasses;
-};
+}
 
-export declare type HvCardProps = HvBaseProps & {
+export declare interface HvCardProps extends HvBaseProps {
     /** The renderable content inside the icon slot of the header. */
     icon?: React.ReactNode;
     /** Whether the card is selectable. */
@@ -1774,7 +1760,7 @@ export declare type HvCardProps = HvBaseProps & {
     statusColor?: "sema0" | HvSemanticColorKeys | HvAtmosphereColorKeys;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvCardClasses;
-};
+}
 
 export declare type HvCategoricalColorKeys = "cat1" | "cat1_180" | "cat1_160" | "cat1_140" | "cat1_120" | "cat1_80" | "cat1_60" | "cat1_40" | "cat1_20" | "cat2" | "cat2_180" | "cat2_160" | "cat2_140" | "cat2_120" | "cat2_80" | "cat2_60" | "cat2_40" | "cat2_20" | "cat3" | "cat3_180" | "cat3_160" | "cat3_140" | "cat3_120" | "cat3_80" | "cat3_60" | "cat3_40" | "cat3_20" | "cat4" | "cat4_180" | "cat4_160" | "cat4_140" | "cat4_120" | "cat4_80" | "cat4_60" | "cat4_40" | "cat4_20" | "cat5" | "cat5_180" | "cat5_160" | "cat5_140" | "cat5_120" | "cat5_80" | "cat5_60" | "cat5_40" | "cat5_20" | "cat6" | "cat6_180" | "cat6_160" | "cat6_140" | "cat6_120" | "cat6_80" | "cat6_60" | "cat6_40" | "cat6_20" | "cat7" | "cat7_180" | "cat7_160" | "cat7_140" | "cat7_120" | "cat7_80" | "cat7_60" | "cat7_40" | "cat7_20" | "cat8" | "cat8_180" | "cat8_160" | "cat8_140" | "cat8_120" | "cat8_80" | "cat8_60" | "cat8_40" | "cat8_20" | "cat9" | "cat9_180" | "cat9_160" | "cat9_140" | "cat9_120" | "cat9_80" | "cat9_60" | "cat9_40" | "cat9_20" | "cat10" | "cat10_180" | "cat10_160" | "cat10_140" | "cat10_120" | "cat10_80" | "cat10_60" | "cat10_40" | "cat10_20" | "cat11" | "cat11_180" | "cat11_160" | "cat11_140" | "cat11_120" | "cat11_80" | "cat11_60" | "cat11_40" | "cat11_20" | "cat12" | "cat12_180" | "cat12_160" | "cat12_140" | "cat12_120" | "cat12_80" | "cat12_60" | "cat12_40" | "cat12_20" | "cat13" | "cat14" | "cat15" | "cat16" | "cat17" | "cat18" | "cat19" | "cat20";
 
@@ -1803,14 +1789,14 @@ export declare interface HvCellProps<D extends object = Record<string, unknown>,
  */
 export declare const HvCharCounter: ({ separator, maxCharQuantity, currentCharQuantity, classes, className, id, disabled, disableGutter, ...others }: HvCharCounterProps) => JSX_2.Element;
 
-export declare type HvCharCounterClasses = {
+export declare interface HvCharCounterClasses {
     root?: string;
     counterDisabled?: string;
     gutter?: string;
     overloaded?: string;
-};
+}
 
-export declare type HvCharCounterProps = HvBaseProps & {
+export declare interface HvCharCounterProps extends HvBaseProps {
     /** The string that separates the current char quantity from the max quantity. */
     separator?: string;
     /** The maximum allowed length of the characters. */
@@ -1823,7 +1809,7 @@ export declare type HvCharCounterProps = HvBaseProps & {
     disableGutter?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvCharCounterClasses;
-};
+}
 
 /**
  * A Checkbox is a mechanism that allows the user to select one or more options.
@@ -1836,7 +1822,7 @@ export declare type HvCharCounterProps = HvBaseProps & {
  */
 export declare const HvCheckBox: ({ id, classes, className, name, checked, status, indeterminate, statusMessage, label, labelProps, inputProps, value, required, readOnly, disabled, semantic, defaultChecked, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-errormessage": ariaErrorMessage, onChange, onFocusVisible, onBlur, ...others }: HvCheckBoxProps) => JSX_2.Element;
 
-export declare type HvCheckBoxClasses = {
+export declare interface HvCheckBoxClasses {
     root?: string;
     container?: string;
     disabled?: string;
@@ -1845,14 +1831,14 @@ export declare type HvCheckBoxClasses = {
     checkbox?: string;
     invalidCheckbox?: string;
     label?: string;
-};
+}
 
 /**
  * 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: ({ id, classes, className, children, name, label, description, status, statusMessage, defaultValue, value: valueProp, required, readOnly, disabled, showSelectAll, orientation, selectAllLabel, selectAllConjunctionLabel, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-errormessage": ariaErrorMessage, onChange, ...others }: HvCheckBoxGroupProps) => JSX_2.Element;
 
-export declare type HvCheckBoxGroupClasses = {
+export declare interface HvCheckBoxGroupClasses {
     root?: string;
     label?: string;
     group?: string;
@@ -1861,11 +1847,11 @@ export declare type HvCheckBoxGroupClasses = {
     invalid?: string;
     selectAll?: string;
     error?: string;
-};
+}
 
-export declare type HvCheckBoxGroupProps = HvBaseProps<HTMLDivElement, {
+export declare interface HvCheckBoxGroupProps extends HvBaseProps<HTMLDivElement, {
     onChange: any;
-}> & {
+}> {
     /**
      * The form element name.
      *
@@ -1948,9 +1934,9 @@ export declare type HvCheckBoxGroupProps = HvBaseProps<HTMLDivElement, {
      * A Jss Object used to override or extend the component styles applied.
      */
     classes?: HvCheckBoxGroupClasses;
-};
+}
 
-export declare type HvCheckBoxProps = Omit<HvBaseCheckBoxProps, "classes"> & {
+export declare interface HvCheckBoxProps extends Omit<HvBaseCheckBoxProps, "classes"> {
     /**
      * The label of the form element.
      *
@@ -1981,7 +1967,7 @@ export declare type HvCheckBoxProps = Omit<HvBaseCheckBoxProps, "classes"> & {
      * A Jss Object used to override or extend the styles applied to the checkbox.
      */
     classes?: HvCheckBoxClasses;
-};
+}
 
 export declare type HvClickOutsideEvent = MouseEvent | KeyboardEvent | TouchEvent;
 
@@ -2030,7 +2016,7 @@ declare type HvColumnWithStrictAccessor<D extends object = Record<string, unknow
 
 export declare const HvContainer: ForwardRefExoticComponent<Omit<HvContainerProps, "ref"> & RefAttributes<HTMLDivElement>>;
 
-export declare type HvContainerClasses = {
+export declare interface HvContainerClasses {
     root?: string;
     disableGutters?: string;
     fixed?: string;
@@ -2039,9 +2025,9 @@ export declare type HvContainerClasses = {
     maxWidthMd?: string;
     maxWidthLg?: string;
     maxWidthXl?: string;
-};
+}
 
-export declare type HvContainerProps = Omit<ContainerProps, "classes"> & HvBaseProps & {
+export declare interface HvContainerProps extends Omit<ContainerProps, "classes">, HvBaseProps {
     /**
      * The component used for the root node.
      * Either a string to use a DOM element or a component.
@@ -2064,18 +2050,18 @@ export declare type HvContainerProps = Omit<ContainerProps, "classes"> & HvBaseP
     fixed?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvContainerClasses;
-};
+}
 
 export declare const HvControls: ({ id, className, classes, views, callbacks, selectedView, defaultView, children, hideViewSwitcher, onViewChange, }: HvControlsProps) => JSX_2.Element;
 
-export declare type HvControlsClasses = {
+export declare interface HvControlsClasses {
     root: string;
     section: string;
     rightSection: string;
     leftSection: string;
-};
+}
 
-export declare type HvControlsProps = HvBaseProps & {
+export declare interface HvControlsProps extends HvBaseProps {
     /**
      * An instance of useHvTable or useTable used to manage the data
      * if this is not provided data sorting and search must be handled externally
@@ -2108,18 +2094,18 @@ export declare type HvControlsProps = HvBaseProps & {
     hideViewSwitcher?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvControlsClasses;
-};
+}
 
-export declare type HvControlsViewConfiguration = {
+export declare interface HvControlsViewConfiguration extends HvExtraProps {
     id?: string;
     label?: string;
     icon?: React.ReactNode;
-} & HvExtraProps;
+}
 
 /**
  * Create theme props
  */
-export declare type HvCreateThemeProps = {
+export declare interface HvCreateThemeProps extends HvThemeCustomizationProps {
     /**
      * The name used for the theme.
      *
@@ -2139,7 +2125,7 @@ export declare type HvCreateThemeProps = {
      * By default the color modes are inherited.
      */
     inheritColorModes?: boolean;
-} & HvThemeCustomizationProps;
+}
 
 export declare function hvDateColumn<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer>(col: HvTableColumnConfig<D, H>, dateFormat?: string): HvTableColumnConfig<D, H>;
 
@@ -2154,42 +2140,42 @@ declare interface HvDateColumnCellProp {
 
 export declare const HvDialog: ({ classes, className, id, children, open, onClose, firstFocusable, buttonTitle, fullscreen, disableBackdropClick, ...others }: HvDialogProps) => JSX_2.Element;
 
-export declare type HvDialogActionClasses = {
+export declare interface HvDialogActionClasses {
     root?: string;
     fullscreen?: string;
     spacing?: string;
-};
+}
 
 export declare const HvDialogActions: ({ classes, className, children, fullscreen, ...others }: HvDialogActionsProps) => JSX_2.Element;
 
-export declare type HvDialogActionsProps = Omit<DialogActionsProps, "classes"> & HvBaseProps & {
+export declare interface HvDialogActionsProps extends Omit<DialogActionsProps, "classes">, HvBaseProps {
     /** Set the dialog to fullscreen mode. */
     fullscreen?: boolean;
     classes?: HvDialogActionClasses;
-};
+}
 
-export declare type HvDialogClasses = {
+export declare interface HvDialogClasses {
     root?: string;
     closeButton?: string;
     fullscreen?: string;
     background?: string;
     paper?: string;
-};
+}
 
 export declare const HvDialogContent: ({ classes, className, children, indentContent, }: HvDialogContentProps) => JSX_2.Element;
 
-export declare type HvDialogContentClasses = {
+export declare interface HvDialogContentClasses {
     root?: string;
     textContent?: string;
-};
+}
 
-export declare type HvDialogContentProps = Omit<DialogContentProps, "classes"> & HvBaseProps & {
+export declare interface HvDialogContentProps extends Omit<DialogContentProps, "classes">, HvBaseProps {
     /** Content should be indented in relationship to the Dialog title. */
     indentContent?: boolean;
     classes?: HvDialogContentClasses;
-};
+}
 
-export declare type HvDialogProps = Omit<DialogProps, "fullScreen" | "classes"> & HvBaseProps & {
+export declare interface HvDialogProps extends Omit<DialogProps, "fullScreen" | "classes" | "open">, HvBaseProps {
     /** Id to be applied to the root node. */
     id?: string;
     /** Current state of the Dialog. */
@@ -2206,18 +2192,20 @@ export declare type HvDialogProps = Omit<DialogProps, "fullScreen" | "classes">
     disableBackdropClick?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvDialogClasses;
-};
+}
 
 export declare const HvDialogTitle: ({ classes, className, children, variant, showIcon, customIcon, ...others }: HvDialogTitleProps) => JSX_2.Element;
 
-export declare type HvDialogTitleClasses = {
+export declare interface HvDialogTitleClasses {
     root?: string;
     fullscreen?: string;
     messageContainer?: string;
     textWithIcon?: string;
-};
+}
 
-export declare type HvDialogTitleProps = Omit<DialogTitleProps, "variant" | "classes"> & HvBaseProps & {
+export declare interface HvDialogTitleProps extends Omit<DialogTitleProps, "variant" | "classes">, HvBaseProps<HTMLSpanElement, {
+    color: any;
+}> {
     /** Variant of the Dialog. */
     variant?: HvDialogTitleVariant;
     /** Controls if the associated icon to the variant should be shown. */
@@ -2225,7 +2213,7 @@ export declare type HvDialogTitleProps = Omit<DialogTitleProps, "variant" | "cla
     /** Custom icon to replace the variant default. */
     customIcon?: React.ReactNode;
     classes?: HvDialogTitleClasses;
-};
+}
 
 export declare type HvDialogTitleVariant = "success" | "warning" | "error" | "info" | "default";
 
@@ -2235,15 +2223,15 @@ export declare type HvDialogTitleVariant = "success" | "warning" | "error" | "in
  */
 export declare const HvDotPagination: ({ className, classes, unselectedIcon, selectedIcon, pages, page, onPageChange, getItemAriaLabel, ...others }: HvDotPaginationProps) => JSX_2.Element;
 
-export declare type HvDotPaginationClasses = {
+export declare interface HvDotPaginationClasses {
     root?: string;
     horizontal?: string;
     radioRoot?: string;
     radio?: string;
     icon?: string;
-};
+}
 
-export declare type HvDotPaginationProps = Omit<HvRadioGroupProps, "classes"> & {
+export declare interface HvDotPaginationProps extends Omit<HvRadioGroupProps, "classes"> {
     /**
      * Icon to override the default one used for the unselected state.
      *
@@ -2276,14 +2264,14 @@ export declare type HvDotPaginationProps = Omit<HvRadioGroupProps, "classes"> &
      * A Jss Object used to override or extend the styles applied.
      */
     classes?: HvDotPaginationClasses;
-};
+}
 
 /**
  * A dropdown list is a graphical control element, similar to a list box, that allows the user to choose one value from a list.
  */
 export declare const HvDropdown: (props: HvDropdownProps) => JSX_2.Element;
 
-export declare type HvDropdownClasses = {
+export declare interface HvDropdownClasses {
     root?: string;
     labelContainer?: string;
     label?: string;
@@ -2298,7 +2286,7 @@ export declare type HvDropdownClasses = {
     dropdownHeaderOpen?: string;
     dropdownListContainer?: string;
     rootList?: string;
-};
+}
 
 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>;
 
@@ -2317,7 +2305,7 @@ declare interface HvDropdownColumnCellProp {
     dropdownProps?: HvDropdownProps;
 }
 
-export declare type HvDropdownLabelsProps = {
+export declare interface HvDropdownLabelsProps {
     /**
      * Label for overwrite the default header behavior.
      */
@@ -2342,9 +2330,9 @@ export declare type HvDropdownLabelsProps = {
      * The label used in search.
      */
     searchPlaceholder?: string;
-};
+}
 
-declare type HvDropdownListClasses = {
+declare interface HvDropdownListClasses {
     rootList?: string;
     dropdownListContainer?: string;
     searchContainer?: string;
@@ -2353,9 +2341,9 @@ declare type HvDropdownListClasses = {
     selectAllContainer?: string;
     selection?: string;
     selectAll?: string;
-};
+}
 
-declare type HvDropdownListProps = {
+declare interface HvDropdownListProps {
     /**
      * Id to be applied to the root node.
      */
@@ -2413,14 +2401,14 @@ declare type HvDropdownListProps = {
      * Experimental. Uses dropdown in a virtualized form, where not all options are rendered initially. Good for use cases with a lot of options.
      */
     virtualized?: boolean;
-};
+}
 
 export declare const HvDropDownMenu: {
     ({ id, ...others }: WithIdProps): JSX_2.Element;
     Naked: any;
 };
 
-export declare type HvDropDownMenuClasses = {
+export declare interface HvDropDownMenuClasses {
     /** Styles applied to the root. */
     root?: string;
     /** Styles applied to the container. */
@@ -2433,11 +2421,11 @@ export declare type HvDropDownMenuClasses = {
     iconSelected?: string;
     /** Styles applied to the list. */
     menuList?: string;
-};
+}
 
-export declare type HvDropDownMenuProps = HvBaseProps<HTMLDivElement, {
+export declare interface HvDropDownMenuProps extends HvBaseProps<HTMLDivElement, {
     onClick: any;
-}> & {
+}> {
     /** Icon. */
     icon?: React.ReactElement;
     /**
@@ -2470,11 +2458,11 @@ export declare type HvDropDownMenuProps = HvBaseProps<HTMLDivElement, {
     category?: HvButtonVariant;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvDropDownMenuClasses;
-};
+}
 
-export declare type HvDropdownProps = HvBaseProps<HTMLDivElement, {
+export declare interface HvDropdownProps extends HvBaseProps<HTMLDivElement, {
     onChange: any;
-}> & {
+}> {
     /**
      * Class names to be applied.
      */
@@ -2658,11 +2646,11 @@ export declare type HvDropdownProps = HvBaseProps<HTMLDivElement, {
      * Extra props passed to the list.
      */
     listProps?: HvDropdownListProps;
-};
+}
 
 export declare type HvDropdownStatus = "standBy" | "valid" | "invalid";
 
-declare type HvDropZoneLabels = {
+declare interface HvDropZoneLabels {
     /**
      * Extensions of the accepted file types
      */
@@ -2695,14 +2683,14 @@ declare type HvDropZoneLabels = {
      * Message to display when file type is greater than allowed
      * */
     fileTypeError?: string;
-};
+}
 
 /**
  * Empty states communicate that there’s no information, data or values to display in a given context.
  */
 export declare const HvEmptyState: (props: HvEmptyStateProps) => JSX_2.Element;
 
-export declare type HvEmptyStateClasses = {
+export declare interface HvEmptyStateClasses {
     root?: string;
     container?: string;
     containerMessageOnly?: string;
@@ -2711,11 +2699,11 @@ export declare type HvEmptyStateClasses = {
     textContainer?: string;
     messageContainer?: string;
     actionContainer?: string;
-};
+}
 
-export declare type HvEmptyStateProps = HvBaseProps<HTMLDivElement, {
+export declare interface HvEmptyStateProps extends HvBaseProps<HTMLDivElement, {
     title: any;
-}> & {
+}> {
     /** Icon to be presented. */
     icon: React_2.ReactNode;
     /** The title to be shown. */
@@ -2726,7 +2714,7 @@ export declare type HvEmptyStateProps = HvBaseProps<HTMLDivElement, {
     action?: string | React_2.ReactNode;
     /** A Jss Object used to override or extend the styles applied to the empty state component. */
     classes?: HvEmptyStateClasses;
-};
+}
 
 export declare function hvExpandColumn<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer>(col: HvTableColumnConfig<D, H>, expandRowButtonAriaLabel: string, collapseRowButtonAriaLabel: string, getCanRowExpand?: (row: HvRowInstance<D, H>) => boolean): HvTableColumnConfig<D, H>;
 
@@ -2740,7 +2728,7 @@ export { HvExtraProps }
 
 export declare const HvFile: ({ id, classes, data, onFileRemoved, removeFileButtonLabel, }: HvFileProps) => JSX_2.Element;
 
-export declare type HvFileClasses = {
+export declare interface HvFileClasses {
     root?: string;
     progressbar?: string;
     progressbarBack?: string;
@@ -2750,9 +2738,9 @@ export declare type HvFileClasses = {
     previewContainer?: string;
     icon?: string;
     fail?: string;
-};
+}
 
-export declare type HvFileData = File & {
+export declare interface HvFileData extends Omit<File, "name" | "size"> {
     /**
      * The file id.
      */
@@ -2781,7 +2769,7 @@ export declare type HvFileData = File & {
      * Error message when the upload failed.
      */
     errorMessage?: string;
-};
+}
 
 export declare type HvFileProps = {
     /**
@@ -2818,12 +2806,12 @@ export declare type HvFilesAddedEvent = (files: HvFileData[]) => void;
  */
 export declare const HvFileUploader: ({ id, className, labels: labelsProp, fileList, multiple, disabled, hideLabels, maxFileSize, inputProps, acceptedFiles, onFilesAdded, onFileRemoved, ...others }: HvFileUploaderProps) => JSX_2.Element;
 
-export declare type HvFileUploaderLabels = HvDropZoneLabels & {
+export declare interface HvFileUploaderLabels extends HvDropZoneLabels {
     /**
      * Value of aria-label to apply to remove file button in FileList
      * */
     removeFileButtonLabel?: string;
-};
+}
 
 /**
  * The `HvFileUploaderPreview` component is available to facilitate the styling
@@ -2831,12 +2819,12 @@ export declare type HvFileUploaderLabels = HvDropZoneLabels & {
  */
 export declare const HvFileUploaderPreview: ({ className, children, classes, disableOverlay, onUnload, onClick, ...others }: HvFileUploaderPreviewProps) => JSX_2.Element;
 
-export declare type HvFileUploaderPreviewClasses = {
+export declare interface HvFileUploaderPreviewClasses {
     previewButton?: string;
     overlay?: string;
-};
+}
 
-export declare type HvFileUploaderPreviewProps = Omit<HvButtonProps, "children" | "classes"> & {
+export declare interface HvFileUploaderPreviewProps extends Omit<HvButtonProps, "children" | "classes"> {
     /**
      * Content that represents the preview of an uploaded file.
      */
@@ -2857,9 +2845,9 @@ export declare type HvFileUploaderPreviewProps = Omit<HvButtonProps, "children"
      * A Jss Object used to override or extend the styles applied to the component.
      */
     classes?: HvFileUploaderPreviewClasses;
-};
+}
 
-export declare type HvFileUploaderProps = HvBaseProps & {
+export declare interface HvFileUploaderProps extends HvBaseProps {
     /**
      * An object containing all the labels.
      */
@@ -2900,11 +2888,11 @@ export declare type HvFileUploaderProps = HvBaseProps & {
      * Attributes applied to the input element.
      */
     inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
-};
+}
 
 export declare const HvFocus: ({ classes, children, configuration, disabledClass, selected, disabled, rootRef, focusOnClick, focusDisabled, strategy, useFalseFocus, filterClass, navigationJump, }: HvFocusProps) => JSX_2.Element;
 
-export declare type HvFocusClasses = {
+export declare interface HvFocusClasses {
     root?: string;
     selected?: string;
     focused?: string;
@@ -2913,11 +2901,11 @@ export declare type HvFocusClasses = {
     externalReference?: string;
     falseFocus?: string;
     focusDisabled?: string;
-};
+}
 
-export declare type HvFocusProps = HvBaseProps<HTMLElement, {
+export declare interface HvFocusProps extends HvBaseProps<HTMLElement, {
     children: any;
-}> & {
+}> {
     children: React_2.ReactElement;
     /** Extra configuration for the child element. */
     configuration?: {
@@ -2947,7 +2935,7 @@ export declare type HvFocusProps = HvBaseProps<HTMLElement, {
     navigationJump?: number;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvFocusClasses;
-};
+}
 
 export declare type HvFocusStrategies = "listbox" | "menu" | "card" | "grid";
 
@@ -2956,25 +2944,25 @@ export declare type HvFocusStrategies = "listbox" | "menu" | "card" | "grid";
  */
 export declare const HvFooter: (props: HvFooterProps) => JSX_2.Element;
 
-export declare type HvFooterClasses = {
+export declare interface HvFooterClasses {
     root?: string;
     name?: string;
     copyright?: string;
     separator?: string;
     rightContainer?: string;
-};
+}
 
 declare type HvFooterPropGetter<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer> = HvPropGetter<D, H, HvUseTableFooterProps, {
     column: HvHeaderGroup<D, H>;
 }>;
 
-export declare type HvFooterProps = HvBaseProps & {
+export declare interface HvFooterProps extends HvBaseProps {
     name?: React.ReactNode;
     copyright?: React.ReactNode;
     links?: React.ReactNode;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvFooterClasses;
-};
+}
 
 declare type HvFooterProps_2<D extends object = Record<string, unknown>> = HvTableInstance<D> & {
     column: HvColumnInstance<D>;
@@ -2985,9 +2973,9 @@ export declare const HvFormElement: {
     formElementType: string;
 };
 
-export declare type HvFormElementClasses = {
+export declare interface HvFormElementClasses {
     root?: string;
-};
+}
 
 export declare const HvFormElementContext: React_2.Context<{
     elementId?: string | undefined;
@@ -3025,9 +3013,9 @@ export declare const HvFormElementDescriptorsContextProvider: React_2.Provider<{
     label?: any;
 }>;
 
-export declare type HvFormElementProps = HvBaseProps<HTMLDivElement, {
+export declare interface HvFormElementProps extends HvBaseProps<HTMLDivElement, {
     onChange: any;
-}> & {
+}> {
     /**
      * Name of the form element.
      *
@@ -3070,7 +3058,7 @@ export declare type HvFormElementProps = HvBaseProps<HTMLDivElement, {
     onChange?: (event: React.FormEvent<HTMLDivElement>) => void;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvFormElementClasses;
-};
+}
 
 export declare const HvFormElementValueContext: React_2.Context<undefined>;
 
@@ -3086,7 +3074,7 @@ export declare type HvFormStatus = "standBy" | "valid" | "invalid" | "empty";
  */
 export declare const HvGlobalActions: ({ children, classes, className, title, variant, backButton, headingLevel, position: positionProp, ...others }: HvGlobalActionsProps) => JSX_2.Element;
 
-export declare type HvGlobalActionsClasses = {
+export declare interface HvGlobalActionsClasses {
     root?: string;
     global?: string;
     backButton?: string;
@@ -3097,15 +3085,15 @@ export declare type HvGlobalActionsClasses = {
     positionFixed?: string;
     positionSticky?: string;
     globalWrapperComplement?: string;
-};
+}
 
 export declare type HvGlobalActionsHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
 
 export declare type HvGlobalActionsPosition = "sticky" | "fixed" | "relative";
 
-export declare type HvGlobalActionsProps = HvBaseProps<HTMLDivElement, {
+export declare interface HvGlobalActionsProps extends HvBaseProps<HTMLDivElement, {
     title: any;
-}> & {
+}> {
     /** Text to display in the component. */
     title?: React.ReactNode;
     /** Denotes if this is a global or section component. */
@@ -3121,7 +3109,7 @@ export declare type HvGlobalActionsProps = HvBaseProps<HTMLDivElement, {
     position?: HvGlobalActionsPosition;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvGlobalActionsClasses;
-};
+}
 
 export declare type HvGlobalActionsVariant = "global" | "section";
 
@@ -3129,7 +3117,7 @@ export declare type HvGlobalActionsVariant = "global" | "section";
  * The grid creates visual consistency between layouts while allowing flexibility
  * across a wide variety of designs. This component is based in a 12-column grid layout.
  *
- * It is is based in the [Material UI Grid]https://mui.com/material-ui/react-grid/).
+ * It is is based in the [Material UI Grid](https://mui.com/material-ui/react-grid/).
  *
  * The definitions were set following the Design System directives:
  *
@@ -3144,7 +3132,7 @@ export declare type HvGlobalActionsVariant = "global" | "section";
  */
 export declare const HvGrid: ForwardRefExoticComponent<Omit<HvGridProps, "ref"> & RefAttributes<HTMLDivElement>>;
 
-export declare type HvGridClasses = {
+export declare interface HvGridClasses {
     root?: string;
     container?: string;
     item?: string;
@@ -3178,11 +3166,13 @@ export declare type HvGridClasses = {
     "grid-xs-10"?: string;
     "grid-xs-11"?: string;
     "grid-xs-12"?: string;
-};
+}
 
 export declare type HvGridDirection = "row" | "row-reverse" | "column" | "column-reverse";
 
-export declare type HvGridProps = Omit<GridProps, "classes"> & HvBaseProps & {
+export declare interface HvGridProps extends Omit<GridProps, "classes">, HvBaseProps<HTMLDivElement, {
+    color: any;
+}> {
     /**
      * If `true`, the component will have the flex *container* behavior.
      * You should be wrapping *items* with a *container*.
@@ -3246,7 +3236,7 @@ export declare type HvGridProps = Omit<GridProps, "classes"> & HvBaseProps & {
     zeroMinWidth?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvGridClasses;
-};
+}
 
 export declare type HvGridSpacing = "xs" | "sm" | "md" | "lg" | "xl" | "auto" | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10;
 
@@ -3257,35 +3247,35 @@ export declare const HvHeader: (props: HvHeaderProps) => JSX_2.Element;
 
 export declare const HvHeaderActions: ({ classes, className, children, ...others }: HvHeaderActionsProps) => JSX_2.Element;
 
-export declare type HvHeaderActionsClasses = {
+export declare interface HvHeaderActionsClasses {
     root?: string;
-};
+}
 
-export declare type HvHeaderActionsProps = HvBaseProps & {
+export declare interface HvHeaderActionsProps extends HvBaseProps {
     classes?: HvHeaderActionsClasses;
-};
+}
 
 /**
  * Header component is used to render a header bar with logo and brand name, navigation and actions.
  */
 export declare const HvHeaderBrand: ({ classes, logo, name, className, ...others }: HvHeaderBrandProps) => JSX_2.Element;
 
-export declare type HvHeaderBrandClasses = {
+export declare interface HvHeaderBrandClasses {
     root?: string;
     separator?: string;
-};
+}
 
-export declare type HvHeaderBrandProps = HvBaseProps & {
+export declare interface HvHeaderBrandProps extends HvBaseProps {
     logo?: React.ReactNode;
     name?: string;
     classes?: HvHeaderBrandClasses;
-};
+}
 
-export declare type HvHeaderClasses = {
+export declare interface HvHeaderClasses {
     root?: string;
     header?: string;
     backgroundColor?: string;
-};
+}
 
 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>>;
@@ -3297,9 +3287,9 @@ export declare const HvHeaderMenuItem: ({ id, item, type, onClick }: MenuItemPro
 
 export declare const HvHeaderNavigation: ({ data, selected, onClick, className, classes, ...others }: HvHeaderNavigationProps) => JSX_2.Element;
 
-export declare type HvHeaderNavigationClasses = {
+export declare interface HvHeaderNavigationClasses {
     root?: string;
-};
+}
 
 export declare interface HvHeaderNavigationItemProp {
     id: string;
@@ -3310,14 +3300,14 @@ export declare interface HvHeaderNavigationItemProp {
     data?: HvHeaderNavigationItemProp[];
 }
 
-export declare type HvHeaderNavigationProps = HvBaseProps<HTMLDivElement, {
+export declare interface HvHeaderNavigationProps extends HvBaseProps<HTMLDivElement, {
     onClick: any;
-}> & {
+}> {
     data: HvHeaderNavigationItemProp[];
     selected?: string;
     onClick?: (event: MouseEvent_2, selection: HvHeaderNavigationItemProp) => void;
     classes?: HvHeaderNavigationClasses;
-};
+}
 
 export declare type HvHeaderPosition = "fixed" | "absolute" | "sticky" | "static" | "relative";
 
@@ -3325,12 +3315,12 @@ declare type HvHeaderPropGetter<D extends object = Record<string, unknown>, H ex
     column: HvHeaderGroup<D, H>;
 }>;
 
-export declare type HvHeaderProps = HvBaseProps & {
+export declare interface HvHeaderProps extends HvBaseProps {
     /** The position of the header bar */
     position?: HvHeaderPosition;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvHeaderClasses;
-};
+}
 
 declare type HvHeaderProps_2<D extends object = Record<string, unknown>> = HvTableInstance<D> & {
     column: HvColumnInstance<D>;
@@ -3359,27 +3349,27 @@ export declare interface HvHooks<D extends object = Record<string, unknown>, H e
  */
 export declare const HvInfoMessage: ({ id, classes, className, children, disabled, disableGutter, ...others }: HvInfoMessageProps) => JSX_2.Element;
 
-export declare type HvInfoMessageClasses = {
+export declare interface HvInfoMessageClasses {
     root?: string;
     infoDisabled?: string;
     gutter?: string;
-};
+}
 
-export declare type HvInfoMessageProps = HvBaseProps & {
+export declare interface HvInfoMessageProps extends HvBaseProps {
     /** If `true` the label is disabled. */
     disabled?: boolean;
     /** If `true` the info message won't have margins. */
     disableGutter?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvInfoMessageClasses;
-};
+}
 
 /**
  * A text input box is a graphical control element intended to enable the user to input text information to be used by the software.
  */
 export declare const HvInput: ({ classes, className, id, name, value: valueProp, defaultValue, required, readOnly, disabled, label, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, description, "aria-describedby": ariaDescribedBy, onChange, onEnter, status, statusMessage, "aria-errormessage": ariaErrorMessage, type, placeholder, autoFocus, labels: labelsProp, validationMessages, disableClear, disableRevealPassword, disableSearchButton, endAdornment, maxCharQuantity, minCharQuantity, validation, showValidationIcon, suggestionListCallback, inputRef: inputRefProp, onBlur, onFocus, onKeyDown, inputProps, ...others }: HvInputProps) => JSX_2.Element;
 
-export declare type HvInputClasses = {
+export declare interface HvInputClasses {
     /** Styles applied to the root container of the input. */
     root?: string;
     /** Styles applied to the root container when the suggestion list is open. */
@@ -3418,9 +3408,9 @@ export declare type HvInputClasses = {
     suggestionsContainer?: string;
     /** Styles applied to the suggestions list. */
     suggestionList?: string;
-};
+}
 
-export declare type HvInputLabels = {
+export declare interface HvInputLabels {
     /** The label of the clear button. */
     clearButtonLabel?: string;
     /** The label of the reveal password button. */
@@ -3431,15 +3421,15 @@ export declare type HvInputLabels = {
     revealPasswordButtonClickToHideTooltip?: string;
     /** The label of the search button. */
     searchButtonLabel?: string;
-};
+}
 
-export declare type HvInputProps = HvBaseProps<HTMLElement, {
+export declare interface HvInputProps extends HvBaseProps<HTMLElement, {
     onChange: any;
     onBlur: any;
     onFocus: any;
     onKeyDown: any;
     color: any;
-}> & {
+}> {
     /** The form element name. */
     name?: string;
     /** The value of the form element. */
@@ -3541,13 +3531,13 @@ export declare type HvInputProps = HvBaseProps<HTMLElement, {
     minCharQuantity?: number;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvInputClasses;
-};
+}
 
-export declare type HvInputSuggestion = {
+export declare interface HvInputSuggestion {
     id: string;
     label: string;
     value?: string;
-};
+}
 
 declare type HvInputValidity = {
     valid?: boolean;
@@ -3580,7 +3570,7 @@ export declare interface HvKnobProperty {
  */
 export declare const HvKpi: ({ trendIndicator, visualIndicator, visualComparison, indicatorUnitTextVariant, indicatorTextVariant, labels, classes, className, ...others }: HvKpiProps) => JSX_2.Element;
 
-export declare type HvKpiClasses = {
+export declare interface HvKpiClasses {
     root?: string;
     visualIndicatorContainer?: string;
     comparisons?: string;
@@ -3591,9 +3581,9 @@ export declare type HvKpiClasses = {
     indicatorUnit?: string;
     spacingToTheRight?: string;
     trendLine?: string;
-};
+}
 
-export declare type HvKpiLabelProps = {
+export declare interface HvKpiLabelProps {
     /**
      * The text at the top of the kpi.
      */
@@ -3610,11 +3600,11 @@ export declare type HvKpiLabelProps = {
      * The text to the right of the visual comparison.
      */
     comparisonIndicatorInfo?: string;
-};
+}
 
-export declare type HvKpiProps = HvBaseProps<HTMLDivElement, {
+export declare interface HvKpiProps extends HvBaseProps<HTMLDivElement, {
     children: any;
-}> & {
+}> {
     /**
      * An Element that will be rendered to the left of the kpi indicator text.
      */
@@ -3643,20 +3633,20 @@ export declare type HvKpiProps = HvBaseProps<HTMLDivElement, {
      * A Jss Object used to override or extend the component styles applied.
      */
     classes?: HvKpiClasses;
-};
+}
 
 /**
  * Provides the user with a recognizable name for a given form element.
  */
 export declare const HvLabel: ({ id, classes, className, children, label, disabled, required, htmlFor: htmlForProp, ...others }: HvLabelProps) => JSX_2.Element;
 
-export declare type HvLabelClasses = {
+export declare interface HvLabelClasses {
     root?: string;
     labelDisabled?: string;
     childGutter?: string;
-};
+}
 
-export declare type HvLabelProps = HvBaseProps & {
+export declare interface HvLabelProps extends HvBaseProps {
     /** The text to be shown by the label. */
     label?: React.ReactNode;
     /** The id of the form element the label is bound to. */
@@ -3667,15 +3657,15 @@ export declare type HvLabelProps = HvBaseProps & {
     required?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvLabelClasses;
-};
+}
 
 export declare const HvLeftControl: ({ id, classes, className, children, placeholder, onSearch, hideSearch, searchProps, ...others }: HvLeftControlProps) => JSX_2.Element;
 
-export declare type HvLeftControlClasses = {
+export declare interface HvLeftControlClasses {
     root: string;
-};
+}
 
-export declare type HvLeftControlProps = HvBaseProps & {
+export declare interface HvLeftControlProps extends HvBaseProps {
     /** if `true` the hide sort by dropdown is not rendered */
     hideSearch?: boolean;
     /** placeholder of the input */
@@ -3686,31 +3676,31 @@ export declare type HvLeftControlProps = HvBaseProps & {
     searchProps?: HvInputProps;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvLeftControlClasses;
-};
+}
 
 export declare const HvLink: ({ onClick, classes, className, route, data, children, ...others }: HvLinkProps) => JSX_2.Element;
 
-export declare type HvLinkClasses = {
+export declare interface HvLinkClasses {
     a?: string;
-};
+}
 
-export declare type HvLinkProps = HvBaseProps<HTMLAnchorElement, {
+export declare interface HvLinkProps extends HvBaseProps<HTMLAnchorElement, {
     onClick: any;
-}> & {
+}> {
     onClick?: (event: MouseEventHandler<HTMLAnchorElement>, data: any) => void | undefined;
     route?: string;
     data?: any;
     children: any;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvLinkClasses;
-};
+}
 
 /**
  * Component used to show a set of related data to the user.
  */
 export declare const HvList: ({ id, classes, className, multiSelect, hasTooltips, showSelectAll, labels, useSelector, selectable, singleSelectionToggle, condensed, onChange, onClick, values: valuesProp, height, virtualized, ...others }: HvListProps) => JSX_2.Element;
 
-export declare type HvListClasses = {
+export declare interface HvListClasses {
     /** Styles applied to the component root class. */
     root?: string;
     /** Styles applied to the component root class in virtualized form. */
@@ -3731,32 +3721,20 @@ export declare type HvListClasses = {
     link?: string;
     /** Styles applied to the select all selector. */
     selectAllSelector?: string;
-};
+}
 
 /**
  * A <b>list</b> is any enumeration of a set of items.
  * The simple list is for continuous <b>vertical indexes of text or icons+text</b>. The content of these lists must be simple: ideally simples fields.
  * This pattern is ideal for <b>selections</b>. It should be used inside a HvPanel.
  */
-export declare const HvListContainer: React_2.ForwardRefExoticComponent<HvBaseProps<HTMLUListElement, {}> & {
-    /**
-     * If the list items should be focusable and react to mouse over events.
-     * Defaults to true if the list is selectable, false otherwise.
-     */
-    interactive?: boolean | undefined;
-    /** If `true` compact the vertical spacing between list items. */
-    condensed?: boolean | undefined;
-    /** If `true`, the list items' left and right padding is removed. */
-    disableGutters?: boolean | undefined;
-    /** A Jss Object used to override or extend the styles applied to the component. */
-    classes?: HvListContainerClasses | undefined;
-} & React_2.RefAttributes<unknown>>;
+export declare const HvListContainer: React_2.ForwardRefExoticComponent<HvListContainerProps & React_2.RefAttributes<unknown>>;
 
-export declare type HvListContainerClasses = {
+export declare interface HvListContainerClasses {
     root?: string;
-};
+}
 
-export declare type HvListContainerProps = HvBaseProps<HTMLUListElement> & {
+export declare interface HvListContainerProps extends HvBaseProps<HTMLUListElement> {
     /**
      * If the list items should be focusable and react to mouse over events.
      * Defaults to true if the list is selectable, false otherwise.
@@ -3768,14 +3746,14 @@ export declare type HvListContainerProps = HvBaseProps<HTMLUListElement> & {
     disableGutters?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvListContainerClasses;
-};
+}
 
 /**
  * ListItem description/documentation paragraph
  */
 export declare const HvListItem: ({ id, classes, className, role, value, selected, disabled, interactive: interactiveProp, condensed: condensedProp, disableGutters: disableGuttersProp, startAdornment, endAdornment, onClick, children, tabIndex, ...others }: HvListItemProps) => JSX_2.Element;
 
-export declare type HvListItemClasses = {
+export declare interface HvListItemClasses {
     root?: string;
     focus?: string;
     startAdornment?: string;
@@ -3787,11 +3765,11 @@ export declare type HvListItemClasses = {
     disabled?: string;
     withStartAdornment?: string;
     withEndAdornment?: string;
-};
+}
 
-export declare type HvListItemProps = HvBaseProps<HTMLLIElement, {
+export declare interface HvListItemProps extends HvBaseProps<HTMLLIElement, {
     role: any;
-}> & {
+}> {
     /**
      * Overrides the implicit list item role.
      * It defaults to "option" if unspecified and the container list role is "listbox".
@@ -3837,19 +3815,19 @@ export declare type HvListItemProps = HvBaseProps<HTMLLIElement, {
     value?: any;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvListItemClasses;
-};
+}
 
-export declare type HvListLabels = {
+export declare interface HvListLabels {
     /** The label used for the All checkbox action. */
     selectAll?: string;
     /** The label used in the middle of the multi-selection count. */
     selectionConjunction?: string;
-};
+}
 
-export declare type HvListProps = HvBaseProps<HTMLUListElement, {
+export declare interface HvListProps extends HvBaseProps<HTMLUListElement, {
     onChange: any;
     onClick: any;
-}> & {
+}> {
     /**
      * A list containing the elements to be rendered.
      *
@@ -3892,9 +3870,9 @@ export declare type HvListProps = HvBaseProps<HTMLUListElement, {
     virtualized?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvListClasses;
-};
+}
 
-export declare type HvListValue = {
+export declare interface HvListValue extends HvExtraProps {
     id?: string | number;
     label: React.ReactNode;
     searchValue?: string;
@@ -3909,14 +3887,14 @@ export declare type HvListValue = {
     path?: string;
     params?: object;
     tabIndex?: number;
-} & HvExtraProps;
+}
 
 /**
  * Loading provides feedback about a process that is taking place in the application.
  */
 export declare const HvLoading: (props: HvLoadingProps) => JSX_2.Element;
 
-export declare type HvLoadingClasses = {
+export declare interface HvLoadingClasses {
     root?: string;
     barContainer?: string;
     loadingBar?: string;
@@ -3928,9 +3906,9 @@ export declare type HvLoadingClasses = {
     regular?: string;
     smallColor?: string;
     regularColor?: string;
-};
+}
 
-export declare type HvLoadingProps = HvBaseProps<HTMLDivElement> & {
+export declare interface HvLoadingProps extends HvBaseProps<HTMLDivElement> {
     /** Indicates if the component should be render in a small size. */
     small?: boolean;
     /** The label to be displayed.  */
@@ -3940,19 +3918,19 @@ export declare type HvLoadingProps = HvBaseProps<HTMLDivElement> & {
     /** Color applied to the bars. */
     color?: string;
     classes?: HvLoadingClasses;
-};
+}
 
 /**
  * Container layout for the login form.
  */
 export declare const HvLogin: ({ id, className, classes, children, background, ...others }: HvLoginProps) => JSX_2.Element;
 
-export declare type HvLoginClasses = {
+export declare interface HvLoginClasses {
     root?: string;
     formContainer?: string;
-};
+}
 
-export declare type HvLoginProps = HvBaseProps & {
+export declare interface HvLoginProps extends HvBaseProps {
     /**
      *  The path for the background image.
      */
@@ -3961,20 +3939,20 @@ export declare type HvLoginProps = HvBaseProps & {
      * Class names to be applied.
      */
     classes?: HvLoginClasses;
-};
+}
 
 export declare interface HvMarkProperty {
     position?: number;
     label?: string;
 }
 
-declare type HvMenuBarProps = HvBaseProps<"div", {
+declare interface HvMenuBarProps extends HvBaseProps<"div", {
     onClick: any;
-}> & {
+}> {
     data: HvHeaderNavigationItemProp[];
     type: string;
     onClick?: (event: MouseEvent, selection: HvHeaderNavigationItemProp) => void;
-};
+}
 
 export declare type HvMeta<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer, Extension = never, M = HvMetaBase<D, H>> = [Extension] extends [never] ? M : M & Extension;
 
@@ -3985,14 +3963,14 @@ declare interface HvMetaBase<D extends object = Record<string, unknown>, H exten
 
 export declare const HvMultiButton: ({ className, children, classes, disabled, vertical, variant, ...others }: HvMultiButtonProps) => JSX_2.Element;
 
-export declare type HvMultiButtonClasses = {
+export declare interface HvMultiButtonClasses {
     root?: string;
     button?: string;
     vertical?: string;
     selected?: string;
-};
+}
 
-export declare type HvMultiButtonProps = HvBaseProps & {
+export declare interface HvMultiButtonProps extends HvBaseProps {
     /** If all the buttons are disabled. */
     disabled?: boolean;
     /** If the MultiButton is to be displayed vertically. */
@@ -4001,11 +3979,11 @@ export declare type HvMultiButtonProps = HvBaseProps & {
     variant?: HvButtonVariant;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvMultiButtonClasses;
-};
+}
 
 export declare const hvNodeFallback: (value: any) => any;
 
-export declare type HvNotistackSnackMessageProps = {
+export declare interface HvNotistackSnackMessageProps {
     /** Id to be applied to the root node. */
     id?: string;
     /** Classname to apply on the root node */
@@ -4016,7 +3994,7 @@ export declare type HvNotistackSnackMessageProps = {
     variant?: HvSnackbarVariant;
     /** Extra values to pass to the snackbar. */
     snackbarContentProps?: HvSnackbarContentProps;
-};
+}
 
 export declare function hvNumberColumn<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer>(col: HvTableColumnConfig<D, H>): HvTableColumnConfig<D, H>;
 
@@ -4027,14 +4005,14 @@ export declare const hvNumberFallback: (value: any) => number | "—";
  */
 export declare const HvOverflowTooltip: ({ id, classes, className, data, open, paragraphOverflow, placement, tooltipsProps, }: HvOverflowTooltipProps) => JSX_2.Element;
 
-export declare type HvOverflowTooltipClasses = {
+export declare interface HvOverflowTooltipClasses {
     root?: string;
     tooltipAnchor?: string;
     tooltipAnchorParagraph?: string;
     tooltipData?: string;
-};
+}
 
-export declare type HvOverflowTooltipProps = HvBaseProps & {
+export declare interface HvOverflowTooltipProps extends HvBaseProps {
     /** The node that will be rendered inside the tooltip. */
     data: React.ReactNode;
     /** If true, the tooltip is shown. */
@@ -4047,7 +4025,7 @@ export declare type HvOverflowTooltipProps = HvBaseProps & {
     tooltipsProps?: HvTooltipProps;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvOverflowTooltipClasses;
-};
+}
 
 /**
  * Pagination is the process of dividing a document into discrete pages. It relates to how users interact
@@ -4055,7 +4033,7 @@ export declare type HvOverflowTooltipProps = HvBaseProps & {
  */
 export declare const HvPagination: ({ classes, className, id, pages, page, showPageSizeOptions, pageSizeOptions, pageSize, showPageJump, canPrevious, canNext, onPageChange, onPageSizeChange, labels: labelsProp, showPageProps, navigationProps, currentPageInputProps, ...others }: HvPaginationProps) => JSX_2.Element;
 
-export declare type HvPaginationClasses = {
+export declare interface HvPaginationClasses {
     /** Styles applied to the component root class. */
     root?: string;
     /** Styles applied to the page size selector container. */
@@ -4080,9 +4058,9 @@ export declare type HvPaginationClasses = {
     iconContainer?: string;
     /** Styles applied to each navigation icon. */
     icon?: string;
-};
+}
 
-export declare type HvPaginationLabels = {
+export declare interface HvPaginationLabels {
     /** The show label. */
     pageSizePrev?: string;
     /** Indicate the units of the page size selection. */
@@ -4109,11 +4087,11 @@ export declare type HvPaginationLabels = {
     nextPage?: string;
     /** Aria-label of the last page button */
     lastPage?: string;
-};
+}
 
 export declare type HvPaginationPropGetter<D extends object> = PropGetter<D, HvTablePaginationProps>;
 
-export declare type HvPaginationProps = HvBaseProps & {
+export declare interface HvPaginationProps extends HvBaseProps {
     /** The number of pages the component has. */
     pages?: number;
     /** The currently selected page (0-indexed). */
@@ -4144,7 +4122,7 @@ export declare type HvPaginationProps = HvBaseProps & {
     currentPageInputProps?: HvInputProps;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvPaginationClasses;
-};
+}
 
 /**
  * A panel is a container used in a variety of patterns (e.g. dropdown, filter group, details section).
@@ -4153,21 +4131,21 @@ export declare type HvPaginationProps = HvBaseProps & {
  */
 export declare const HvPanel: ({ id, className, classes, children, ...others }: HvPanelProps) => JSX_2.Element;
 
-export declare type HvPanelClasses = {
+export declare interface HvPanelClasses {
     /** Styles applied to the component root class. */
     root?: string;
-};
+}
 
-export declare type HvPanelProps = HvBaseProps & {
+export declare interface HvPanelProps extends HvBaseProps {
     /** A Jss Object used to override or extend the styles applied. */
     classes?: HvPanelClasses;
-};
+}
 
 export declare type HvPolarizedColorKeys = "positive" | "positive_120" | "positive_80" | "warning" | "warning_120" | "warning_140" | "negative" | "cat21" | "cat22" | "cat23" | "cat24" | "cat25" | "cat26" | "cat27" | "cat28" | "catastrophic";
 
 export declare const HvProgressBar: (props: HvProgressBarProps) => JSX_2.Element;
 
-export declare type HvProgressBarClasses = {
+export declare interface HvProgressBarClasses {
     root?: string;
     progress?: string;
     progressBar?: string;
@@ -4176,12 +4154,12 @@ export declare type HvProgressBarClasses = {
     progressDone?: string;
     progressBarContainer?: string;
     progressError?: string;
-};
+}
 
 /**
  * ProgressBar provides feedback about a process that is taking place in the application.
  */
-export declare type HvProgressBarProps = HvBaseProps & {
+export declare interface HvProgressBarProps extends HvBaseProps {
     /** The value of the progress bar. */
     value: number;
     /**
@@ -4196,7 +4174,7 @@ export declare type HvProgressBarProps = HvBaseProps & {
     labelProps?: HvTypographyProps;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvProgressBarClasses;
-};
+}
 
 export declare type HvProgressBarStatus = "inProgress" | "completed" | "error";
 
@@ -4284,7 +4262,7 @@ export declare interface HvProviderProps {
  */
 export declare const HvRadio: (props: HvRadioProps) => JSX_2.Element;
 
-export declare type HvRadioClasses = {
+export declare interface HvRadioClasses {
     /** Styles applied to the component. */
     root?: string;
     /** Styles applied to the radio button+label container (only when a label is provided). */
@@ -4301,7 +4279,7 @@ export declare type HvRadioClasses = {
     label?: string;
     /** Class applied to the root element if keyboard focused. */
     focusVisible?: string;
-};
+}
 
 /**
  * A group of radio buttons.
@@ -4310,7 +4288,7 @@ export declare type HvRadioClasses = {
  */
 export declare const HvRadioGroup: ({ id, classes, className, children, name, value: valueProp, defaultValue, label, description, status, statusMessage, required, readOnly, disabled, orientation, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-errormessage": ariaErrorMessage, onChange, ...others }: HvRadioGroupProps) => JSX_2.Element;
 
-export declare type HvRadioGroupClasses = {
+export declare interface HvRadioGroupClasses {
     root?: string;
     label?: string;
     group?: string;
@@ -4318,11 +4296,11 @@ export declare type HvRadioGroupClasses = {
     horizontal?: string;
     invalid?: string;
     error?: string;
-};
+}
 
-export declare type HvRadioGroupProps = HvBaseProps<HTMLDivElement, {
+export declare interface HvRadioGroupProps extends HvBaseProps<HTMLDivElement, {
     onChange: any;
-}> & {
+}> {
     /**
      * The form element name.
      *
@@ -4392,11 +4370,12 @@ export declare type HvRadioGroupProps = HvBaseProps<HTMLDivElement, {
      * A Jss Object used to override or extend the component styles applied.
      */
     classes?: HvRadioGroupClasses;
-};
+}
 
-export declare type HvRadioProps = Omit<RadioProps, "onChange" | "classes"> & HvBaseProps<HTMLInputElement, {
+export declare interface HvRadioProps extends Omit<RadioProps, "onChange" | "classes">, HvBaseProps<HTMLButtonElement, {
     onChange: any;
-}> & {
+    color: any;
+}> {
     /**
      * Class names to be applied.
      */
@@ -4507,18 +4486,18 @@ export declare type HvRadioProps = Omit<RadioProps, "onChange" | "classes"> & Hv
      * @ignore
      */
     onBlur?: (event: React_2.FocusEvent<any>) => void;
-};
+}
 
 export declare type HvRadioStatus = "standBy" | "valid" | "invalid";
 
 export declare const HvRightControl: ({ id, classes, className, children, values, onSort, hideSortBy, sortProps, ...others }: HvRightControlProps) => JSX_2.Element;
 
-export declare type HvRightControlClasses = {
+export declare interface HvRightControlClasses {
     root?: string;
     sortDropdown?: string;
-};
+}
 
-export declare type HvRightControlProps = HvBaseProps & {
+export declare interface HvRightControlProps extends HvBaseProps {
     /** if `true` the hide sort by dropdown is not rendered */
     hideSortBy?: boolean;
     /** options for the dropdown to sort */
@@ -4529,12 +4508,12 @@ export declare type HvRightControlProps = HvBaseProps & {
     sortProps?: HvDropdownProps;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvRightControlClasses;
-};
+}
 
-export declare type HvRightListControls = HvListValue & {
+export declare interface HvRightListControls extends HvListValue {
     accessor: string;
     desc: boolean;
-};
+}
 
 export declare interface HvRowInstance<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer> extends Omit<Row<D>, "cells" | "allCells" | "subRows" | "getRowProps">, Partial<Omit<UseGroupByRowProps<D>, "subRows" | "values">>, Partial<UseRowStateRowProps<D>>, Partial<Omit<UseHvRowExpandRowInstance<D>, "subRows">>, Partial<UseHvRowSelectionRowInstance> {
     cells: Array<HvCellInstance<D, H>>;
@@ -4558,7 +4537,7 @@ declare type HvRowPropGetter<D extends object = Record<string, unknown>, H exten
  */
 export declare const HvSelectionList: ({ id, classes, className, children, name, value: valueProp, defaultValue, required, readOnly, disabled, label, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, description, "aria-describedby": ariaDescribedBy, onChange, status, statusMessage, "aria-errormessage": ariaErrorMessage, orientation, multiple, singleSelectionToggle, ...others }: HvSelectionListProps) => JSX_2.Element;
 
-export declare type HvSelectionListClasses = {
+export declare interface HvSelectionListClasses {
     root?: string;
     error?: string;
     listbox?: string;
@@ -4567,11 +4546,11 @@ export declare type HvSelectionListClasses = {
     horizontal?: string;
     vertical?: string;
     invalid?: string;
-};
+}
 
-export declare type HvSelectionListProps = HvBaseProps<HTMLUListElement, {
+export declare interface HvSelectionListProps extends HvBaseProps<HTMLUListElement, {
     onChange: any;
-}> & {
+}> {
     /** The form element name. */
     name?: string;
     /**
@@ -4625,7 +4604,7 @@ export declare type HvSelectionListProps = HvBaseProps<HTMLUListElement, {
     onChange?: (event: React_2.MouseEvent, value: any) => void;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvSelectionListClasses;
-};
+}
 
 export declare type HvSemanticColorKeys = "positive" | "neutral" | "warning" | "negative" | "catastrophic" | "sema6" | "neutral_20" | "positive_80" | "positive_120" | "positive_20" | "negative_20" | "negative_120" | "negative_80" | "sema10" | "sema11" | "sema12" | "sema13" | "sema14" | "sema15" | "sema16" | "sema17" | "sema18" | "sema19" | "warning_20" | "warning_140" | "warning_120";
 
@@ -4635,7 +4614,7 @@ export declare type HvSequentialColorKeys = "cat1" | "cat1_100" | "cat1_200" | "
 
 export declare const HvSimpleGrid: ({ children, breakpoints, spacing, cols, ...others }: HvSimpleGridProps) => JSX_2.Element;
 
-export declare type HvSimpleGridProps = HvBaseProps & {
+export declare interface HvSimpleGridProps extends HvBaseProps {
     /**
      * Spacing with pre-defined values according the values defined in the theme
      */
@@ -4654,7 +4633,7 @@ export declare type HvSimpleGridProps = HvBaseProps & {
      * Number of how many columns the content will be displayed
      */
     cols?: number;
-};
+}
 
 /**
  * Sliders reflect a range of values along a bar, from which users may select a single value. They are ideal for adjusting settings such as volume, brightness, or applying image filters.
@@ -4825,7 +4804,7 @@ export declare interface HvSliderProps extends HvBaseProps<HTMLDivElement, {
  */
 export declare const HvSnackbar: ({ classes, 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 = {
+export declare interface HvSnackbarClasses {
     root?: string;
     /** Styles applied to the component when define as top right.  */
     anchorOriginTopRight?: string;
@@ -4839,11 +4818,11 @@ export declare type HvSnackbarClasses = {
     anchorOriginBottomLeft?: string;
     /** Styles applied to the component when define as bottom right.  */
     anchorOriginBottomRight?: string;
-};
+}
 
 export declare const HvSnackbarContent: ForwardRefExoticComponent<Omit<HvSnackbarContentProps, "ref"> & RefAttributes<HTMLDivElement>>;
 
-export declare type HvSnackbarContentClasses = {
+export declare interface HvSnackbarContentClasses {
     root?: string;
     message?: string;
     messageSpan?: string;
@@ -4854,9 +4833,9 @@ export declare type HvSnackbarContentClasses = {
     success?: string;
     warning?: string;
     error?: string;
-};
+}
 
-export declare type HvSnackbarContentProps = Omit<SnackbarContentProps, "variant" | "action" | "classes"> & HvBaseProps & {
+export declare interface HvSnackbarContentProps extends Omit<SnackbarContentProps, "variant" | "action" | "classes">, HvBaseProps {
     /** The message to display. */
     label?: React.ReactNode;
     /** Variant of the snackbar. */
@@ -4871,9 +4850,9 @@ export declare type HvSnackbarContentProps = Omit<SnackbarContentProps, "variant
     actionCallback?: (event: React.SyntheticEvent, id: string, action: HvActionGeneric) => void;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvSnackbarContentClasses;
-};
+}
 
-export declare type HvSnackbarProps = Omit<SnackbarProps, "action" | "classes"> & HvBaseProps & {
+export declare interface HvSnackbarProps extends Omit<SnackbarProps, "action" | "classes">, Omit<HvBaseProps, "children"> {
     /** If true, Snackbar is open. */
     open?: boolean;
     /** Callback fired when the component requests to be closed. Typically onClose is used to set state in the parent component, which is used to control the Snackbar open prop. The reason parameter can optionally be used to control the response to onClose, for example ignoring clickaway. */
@@ -4904,7 +4883,7 @@ export declare type HvSnackbarProps = Omit<SnackbarProps, "action" | "classes">
     snackbarContentProps?: HvSnackbarContentProps;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvSnackbarClasses;
-};
+}
 
 export declare const HvSnackbarProvider: ({ children, notistackClassesOverride, maxSnack, autoHideDuration, anchorOrigin, ...others }: {
     [x: string]: any;
@@ -4918,7 +4897,7 @@ export declare const HvSnackbarProvider: ({ children, notistackClassesOverride,
     } | undefined;
 }) => JSX_2.Element;
 
-export declare type HvSnackbarProviderProps = {
+export declare interface HvSnackbarProviderProps {
     /** Your component tree. */
     children: React.ReactNode;
     /** Max visible snackbars. */
@@ -4929,7 +4908,7 @@ export declare type HvSnackbarProviderProps = {
     anchorOrigin?: SnackbarOrigin;
     /** Class object used to override notistack classes. */
     notistackClassesOverride?: object;
-};
+}
 
 export declare type HvSnackbarVariant = "default" | "success" | "warning" | "error";
 
@@ -4940,15 +4919,16 @@ export declare type HvSnackbarVariant = "default" | "success" | "warning" | "err
  */
 export declare const HvStack: ({ classes, className, children, direction, spacing, divider, withNavigation, dividerProps, ...others }: HvStackProps) => JSX_2.Element;
 
-export declare type HvStackBreakpoints = Record<HvBreakpoints, string>;
+export declare interface HvStackBreakpoints extends Record<HvBreakpoints, string> {
+}
 
-export declare type HvStackClasses = {
+export declare interface HvStackClasses {
     root?: string;
-};
+}
 
 export declare type HvStackDirection = "column" | "row" | Partial<HvStackBreakpoints>;
 
-export declare type HvStackProps = HvBaseProps & {
+export declare interface HvStackProps extends HvBaseProps {
     /** The direction of the stack. Can be either a string or an object that states the direction for each breakpoint. */
     direction?: HvStackDirection;
     /** The spacing between elements of the stack. */
@@ -4964,26 +4944,26 @@ export declare type HvStackProps = HvBaseProps & {
     withNavigation?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvStackClasses;
-};
+}
 
 export declare const hvStringFallback: (value: any) => string;
 
-export declare type HvSuggestion = {
+export declare interface HvSuggestion {
     id?: string;
     label: React_2.ReactNode;
     value?: string;
     disabled?: boolean;
-};
+}
 
 export declare const HvSuggestions: ({ id, className, classes, expanded, anchorEl, suggestionValues, onClose, onSuggestionSelected, ...others }: HvSuggestionsProps) => JSX_2.Element;
 
-export declare type HvSuggestionsClasses = {
+export declare interface HvSuggestionsClasses {
     root?: string;
     list?: string;
     popper?: string;
-};
+}
 
-export declare type HvSuggestionsProps = HvBaseProps & {
+export declare interface HvSuggestionsProps extends HvBaseProps {
     /** Whether suggestions is visible. */
     expanded?: boolean;
     /** The HTML element Suggestions attaches to. */
@@ -4996,7 +4976,7 @@ export declare type HvSuggestionsProps = HvBaseProps & {
     onClose?: (event: HvClickOutsideEvent) => void;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvSuggestionsClasses;
-};
+}
 
 export declare type HvSupportColorKeys = "supp1" | "supp2" | "supp3" | "supp4" | "supp5";
 
@@ -5010,7 +4990,7 @@ export declare type HvSupportColors = Record<HvSupportColorKeys, string>;
  */
 export declare const HvSwitch: (props: HvSwitchProps) => JSX_2.Element;
 
-export declare type HvSwitchClasses = {
+export declare interface HvSwitchClasses {
     /** Styles applied to the component. */
     root?: string;
     /** Styles applied to the label. */
@@ -5021,7 +5001,7 @@ export declare type HvSwitchClasses = {
     switchContainer?: string;
     /** Styles applied to the switch container when the validations status is invalid. */
     invalidSwitch?: string;
-};
+}
 
 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>;
 
@@ -5042,9 +5022,10 @@ declare interface HvSwitchColumnCellProp {
     switchProps?: HvBaseSwitchProps;
 }
 
-export declare type HvSwitchProps = Omit<SwitchProps, "onChange" | "classes"> & HvBaseProps<HTMLInputElement, {
+export declare interface HvSwitchProps extends Omit<SwitchProps, "onChange" | "classes">, HvBaseProps<HTMLButtonElement, {
     onChange: any;
-}> & {
+    color: any;
+}> {
     /**
      * Class names to be applied.
      */
@@ -5144,16 +5125,16 @@ export declare type HvSwitchProps = Omit<SwitchProps, "onChange" | "classes"> &
      * Properties passed on to the input element.
      */
     inputProps?: React_2.InputHTMLAttributes<HTMLInputElement>;
-};
+}
 
 export declare const HvTab: ({ classes, iconPosition, disabled, ...others }: HvTabProps) => JSX_2.Element;
 
-export declare type HvTabClasses = {
+export declare interface HvTabClasses {
     root?: string;
     selected?: string;
     disabled?: string;
     focusVisible?: string;
-};
+}
 
 /**
  * A table gathers relational data. It displays values arranged to allow quick numerical analysis like comparison and sorting.
@@ -5622,9 +5603,9 @@ export declare interface HvTableState<D extends object = Record<string, unknown>
 
 export declare type HvTableVariant = "listrow" | "default";
 
-export declare type HvTabProps = Omit<TabProps, "children"> & HvBaseProps<HTMLDivElement, {
+export declare interface HvTabProps extends Omit<TabProps, "children">, HvBaseProps<HTMLDivElement, {
     children: any;
-}> & {
+}> {
     /** If `true`, the tab will be disabled. */
     disabled?: boolean;
     /** The icon element. */
@@ -5635,7 +5616,7 @@ export declare type HvTabProps = Omit<TabProps, "children"> & HvBaseProps<HTMLDi
     iconPosition?: "bottom" | "end" | "start" | "top";
     /** A Jss Object used to override or extend the component styles. */
     classes?: HvTabClasses;
-};
+}
 
 /**
  * A Tab is a graphical control element that allows multiple documents or panels to be contained within a single window.
@@ -5643,16 +5624,16 @@ export declare type HvTabProps = Omit<TabProps, "children"> & HvBaseProps<HTMLDi
  */
 export declare const HvTabs: ({ classes, ...others }: HvTabsProps) => JSX_2.Element;
 
-export declare type HvTabsClasses = {
+export declare interface HvTabsClasses {
     root?: string;
     flexContainer?: string;
     indicator?: string;
     scroller?: string;
-};
+}
 
-export declare type HvTabsProps = TabsProps & HvBaseProps<HTMLButtonElement, {
+export declare interface HvTabsProps extends TabsProps, HvBaseProps<HTMLButtonElement, {
     onChange: any;
-}> & {
+}> {
     /**
      * The value of the currently selected Tab. If you don't want any selected Tab, you can set this property to `false`.
      */
@@ -5665,7 +5646,7 @@ export declare type HvTabsProps = TabsProps & HvBaseProps<HTMLButtonElement, {
      * A Jss Object used to override or extend the component styles.
      */
     classes?: HvTabsClasses;
-};
+}
 
 /**
  * A Tag is one word that describes a specific aspect of an asset. A single asset can have
@@ -5677,7 +5658,7 @@ export declare type HvTabsProps = TabsProps & HvBaseProps<HTMLButtonElement, {
  */
 export declare const HvTag: ({ classes, className, style, label, disabled, type, color, deleteIcon, onDelete, onClick, role, deleteButtonArialLabel, deleteButtonProps, ...others }: HvTagProps) => JSX_2.Element;
 
-export declare type HvTagClasses = {
+export declare interface HvTagClasses {
     root?: string;
     tagButton?: string;
     focusVisible?: string;
@@ -5691,13 +5672,13 @@ export declare type HvTagClasses = {
     categoricalDisabled?: string;
     deleteIcon?: string;
     disabledDeleteIcon?: string;
-};
+}
 
 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>;
 
-export declare type HvTagProps = Omit<ChipProps, "color" | "classes"> & HvBaseProps<HTMLDivElement, {
+export declare interface HvTagProps extends Omit<ChipProps, "color" | "classes">, HvBaseProps<HTMLDivElement, {
     children: any;
-}> & {
+}> {
     /** Inline styles to be applied to the root element. */
     style?: CSSProperties;
     /** The label of the tag element. */
@@ -5725,14 +5706,14 @@ export declare type HvTagProps = Omit<ChipProps, "color" | "classes"> & HvBasePr
     deleteButtonProps?: HvButtonProps;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvTagClasses;
-};
+}
 
 /**
  * A tags input is a single or multiline control that allows the input of tags.
  */
 export declare const HvTagsInput: ({ classes, className, id, name, value: valueProp, defaultValue, readOnly, disabled, required, label: textAreaLabel, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, description, "aria-describedby": ariaDescribedBy, onChange, onAdd, onDelete, onBlur, onFocus, placeholder, hideCounter, middleCountLabel, maxTagsQuantity, autoFocus, resizable, inputProps, countCharProps, multiline, status, statusMessage, validationMessages, commitTagOn, commitOnBlur, suggestionListCallback, ...others }: HvTagsInputProps) => JSX_2.Element;
 
-export declare type HvTagsInputClasses = {
+export declare interface HvTagsInputClasses {
     /** Styles applied to the input element. */
     input?: string;
     /** Styles applied to the list item gutters. */
@@ -5781,15 +5762,16 @@ export declare type HvTagsInputClasses = {
     suggestionsContainer?: string;
     /** Styles applied to the suggestions list. */
     suggestionList?: string;
-};
+}
 
-export declare type HvTagsInputProps = HvBaseProps<HTMLElement, {
+export declare interface HvTagsInputProps extends HvBaseProps<HTMLElement, {
     onChange: any;
     onBlur: any;
     onFocus: any;
     onKeyDown: any;
     color: any;
-}> & {
+    defaultValue: any;
+}> {
     /** The form element name. */
     name?: string;
     /** The value of the form element. */
@@ -5852,16 +5834,17 @@ export declare type HvTagsInputProps = HvBaseProps<HTMLElement, {
     suggestionListCallback?: (value: string) => HvTagSuggestion[] | null;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvTagsInputClasses;
-};
+}
 
-export declare type HvTagSuggestion = HvInputSuggestion;
+export declare interface HvTagSuggestion extends HvInputSuggestion {
+}
 
 /**
  * A text area is a multiline text input box, with an optional character counter when there is a length limit.
  */
 export declare const HvTextArea: ({ id, className, classes, name, label, description, placeholder, status, statusMessage, validationMessages, maxCharQuantity, minCharQuantity, value: valueProp, inputRef: inputRefProp, rows, defaultValue, middleCountLabel, countCharProps, inputProps, required, readOnly, disabled, autoFocus, resizable, autoScroll, hideCounter, blockMax, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-errormessage": ariaErrorMessage, validation, onChange, onBlur, onFocus, ...others }: HvTextAreaProps) => JSX_2.Element;
 
-export declare type HvTextAreaClasses = {
+export declare interface HvTextAreaClasses {
     root?: string;
     disabled?: string;
     resizable?: string;
@@ -5874,9 +5857,9 @@ export declare type HvTextAreaClasses = {
     description?: string;
     characterCounter?: string;
     error?: string;
-};
+}
 
-export declare type HvTextAreaProps = Omit<HvBaseInputProps, "onChange" | "onBlur" | "rows" | "classes" | "onFocus"> & {
+export declare interface HvTextAreaProps extends Omit<HvBaseInputProps, "onChange" | "onBlur" | "rows" | "classes" | "onFocus"> {
     /**
      * The label of the form element.
      *
@@ -5971,7 +5954,7 @@ export declare type HvTextAreaProps = Omit<HvBaseInputProps, "onChange" | "onBlu
      * A Jss Object used to override or extend the component styles applied.
      */
     classes?: HvTextAreaClasses;
-};
+}
 
 export declare function hvTextColumn<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer>(col: HvTableColumnConfig<D, H>): HvTableColumnConfig<D, H>;
 
@@ -6013,26 +5996,11 @@ declare interface HvThemeProviderProps {
     themeRootId?: string;
 }
 
-export declare const HvToggleButton: ForwardRefExoticComponent<HvBaseProps<HTMLButtonElement, {
-    onClick: any;
-}> & {
-    /** When uncontrolled, defines the initial selected state. */
-    defaultSelected?: boolean | undefined;
-    /** Defines if the button is selected. When defined the button state becomes controlled. */
-    selected?: boolean | undefined;
-    /** Defines if the button is disabled. */
-    disabled?: boolean | undefined;
-    /** Icon for when not selected. Ignored if the component has children. */
-    notSelectedIcon?: React.ReactNode;
-    /** Icon for when selected. Ignored if the component has children. */
-    selectedIcon?: React.ReactNode;
-    /** Function called when icon is clicked. */
-    onClick?: ((event: React.MouseEvent<HTMLButtonElement>, selected: boolean) => void) | undefined;
-} & RefAttributes<HTMLButtonElement>>;
+export declare const HvToggleButton: ForwardRefExoticComponent<HvToggleButtonProps & RefAttributes<HTMLButtonElement>>;
 
-export declare type HvToggleButtonProps = HvBaseProps<HTMLButtonElement, {
+export declare interface HvToggleButtonProps extends HvBaseProps<HTMLButtonElement, {
     onClick: any;
-}> & {
+}> {
     /** When uncontrolled, defines the initial selected state. */
     defaultSelected?: boolean;
     /** Defines if the button is selected. When defined the button state becomes controlled. */
@@ -6045,14 +6013,14 @@ export declare type HvToggleButtonProps = HvBaseProps<HTMLButtonElement, {
     selectedIcon?: React.ReactNode;
     /** Function called when icon is clicked. */
     onClick?: (event: React.MouseEvent<HTMLButtonElement>, selected: boolean) => void;
-};
+}
 
 /**
  * Tooltips display informative text when users hover over, focus on, or tap an element.
  */
 export declare const HvTooltip: ForwardRefExoticComponent<Omit<HvTooltipProps, "ref"> & RefAttributes<unknown>>;
 
-export declare type HvTooltipClasses = {
+export declare interface HvTooltipClasses {
     /** Styles applied to the tooltip root class. */
     root?: string;
     /** Styles applied to the tooltip class when it is single. */
@@ -6075,11 +6043,11 @@ export declare type HvTooltipClasses = {
     separator?: string;
     /** Styles applied to the values wrapper. */
     valueWrapper?: string;
-};
+}
 
 export declare type HvTooltipPlacementType = "bottom-end" | "bottom-start" | "bottom" | "left-end" | "left-start" | "left" | "right-end" | "right-start" | "right" | "top-end" | "top-start" | "top";
 
-export declare type HvTooltipProps = Omit<TooltipProps, "classes"> & {
+export declare interface HvTooltipProps extends Omit<TooltipProps, "classes" | "title"> {
     /**
      * Class names to be applied.
      */
@@ -6123,7 +6091,7 @@ export declare type HvTooltipProps = Omit<TooltipProps, "classes"> & {
      * Node to apply the tooltip.
      */
     children: ReactElement;
-};
+}
 
 /**
  * Typography component is used to render text and paragraphs within an interface.
@@ -6208,7 +6176,7 @@ export declare interface HvUseTableProps extends Omit<TableProps, "role">, UseHv
 export declare interface HvUseTableRowProps extends Omit<TableRowProps, "role">, UseHvTableStylesTableRowProps, UseHvRowSelectionTableRowProps, UseHvRowExpandTableRowProps, HvTableRowProps {
 }
 
-export declare type HvValidationMessages = {
+export declare interface HvValidationMessages {
     /** The value when a validation fails. */
     error?: string;
     /** The message that appears when there are too many characters. */
@@ -6219,7 +6187,7 @@ export declare type HvValidationMessages = {
     requiredError?: string;
     /** The message that appears when the input is value is incompatible with the expected type. */
     typeMismatchError?: string;
-};
+}
 
 /**
  * Navigation enables users to move through an app to complete tasks.
@@ -6241,13 +6209,13 @@ export declare const HvVerticalNavigation: ({ id, className, classes, children,
 
 export declare const HvVerticalNavigationAction: ({ className, classes, id, label, icon, onClick, ...others }: HvVerticalNavigationActionProps) => JSX_2.Element;
 
-export declare type HvVerticalNavigationActionClasses = {
+export declare interface HvVerticalNavigationActionClasses {
     action?: string;
     noIcon?: string;
     minimized?: string;
-};
+}
 
-export declare type HvVerticalNavigationActionProps = {
+export declare interface HvVerticalNavigationActionProps {
     /**
      * Class names to be applied.
      */
@@ -6272,16 +6240,16 @@ export declare type HvVerticalNavigationActionProps = {
      * Callback called when clicked.
      */
     onClick?: MouseEventHandler<HTMLElement>;
-};
+}
 
 export declare const HvVerticalNavigationActions: ({ className, classes, id, children, ...others }: HvVerticalNavigationActionsProps) => JSX_2.Element;
 
-export declare type HvVerticalNavigationActionsClasses = {
+export declare interface HvVerticalNavigationActionsClasses {
     root?: string;
     hide?: string;
-};
+}
 
-export declare type HvVerticalNavigationActionsProps = {
+export declare interface HvVerticalNavigationActionsProps {
     /**
      * Class names to be applied.
      */
@@ -6298,25 +6266,25 @@ export declare type HvVerticalNavigationActionsProps = {
      * Node to be rendered
      */
     children?: React.ReactNode;
-};
+}
 
-export declare type HvVerticalNavigationClasses = {
+export declare interface HvVerticalNavigationClasses {
     /** Style applied to the root of the component. */
     root?: string;
     /** Style applied to the root of the component when its collapsed. */
     collapsed?: string;
     /** Style applied to the root of the component when its in slider mode. */
     slider?: any;
-};
+}
 
 export declare const HvVerticalNavigationHeader: ({ title, openIcon, closeIcon, collapseButtonProps, backButtonProps, className, classes, onCollapseButtonClick, ...others }: HvVerticalNavigationHeaderProps) => JSX_2.Element;
 
-export declare type HvVerticalNavigationHeaderClasses = {
+export declare interface HvVerticalNavigationHeaderClasses {
     root?: string;
     minimized?: string;
-};
+}
 
-export declare type HvVerticalNavigationHeaderProps = {
+export declare interface HvVerticalNavigationHeaderProps {
     /**
      * Id to be applied to the root node.
      */
@@ -6353,13 +6321,13 @@ export declare type HvVerticalNavigationHeaderProps = {
      * Handler for the collapse button.
      */
     onCollapseButtonClick?: MouseEventHandler<HTMLElement>;
-};
+}
 
 export declare type HvVerticalNavigationMode = "icon" | "simple";
 
 export declare type HvVerticalNavigationPosition = "static" | "relative" | "fixed" | "absolute";
 
-export declare type HvVerticalNavigationProps = {
+export declare interface HvVerticalNavigationProps {
     /**
      * Id to be applied to the root node.
      */
@@ -6388,16 +6356,16 @@ export declare type HvVerticalNavigationProps = {
      * The content inside the actions container.
      */
     children?: React.ReactNode;
-};
+}
 
 export declare const HvVerticalNavigationSlider: ({ id, classes, data, selected, onNavigateToTarget, onNavigateToChild, }: HvVerticalNavigationSliderProps) => JSX_2.Element;
 
-export declare type HvVerticalNavigationSliderClasses = {
+export declare interface HvVerticalNavigationSliderClasses {
     root?: string;
     listItemSelected?: string;
-};
+}
 
-export declare type HvVerticalNavigationSliderProps = {
+export declare interface HvVerticalNavigationSliderProps {
     /**
      * Id to be applied to the root node of the panel.
      */
@@ -6429,21 +6397,21 @@ export declare type HvVerticalNavigationSliderProps = {
      * Triggered when the navigate to child button is clicked.
      */
     onNavigateToChild?: (event: React.MouseEvent<HTMLButtonElement>, item: NavigationData) => void;
-};
+}
 
 export declare const HvVerticalNavigationTree: ({ id, className, classes, data, mode, collapsible, expanded: expandedProp, defaultExpanded, onToggle, selected: selectedProp, defaultSelected, onChange, ...others }: HvVerticalNavigationTreeProps) => JSX_2.Element;
 
-export declare type HvVerticalNavigationTreeClasses = {
+export declare interface HvVerticalNavigationTreeClasses {
     root?: string;
     list?: string;
     listItem?: string;
     collapsed?: string;
     popup?: string;
-};
+}
 
-export declare type HvVerticalNavigationTreeProps = HvBaseProps<HTMLDivElement, {
+export declare interface HvVerticalNavigationTreeProps extends HvBaseProps<HTMLDivElement, {
     onChange: any;
-}> & {
+}> {
     /**
      * Id to be applied to the root node.
      */
@@ -6509,17 +6477,17 @@ export declare type HvVerticalNavigationTreeProps = HvBaseProps<HTMLDivElement,
      * target - the behavior when opening an url.
      */
     data?: NavigationData[];
-};
+}
 
 export declare const HvVerticalNavigationTreeView: ForwardRefExoticComponent<HvVerticalNavigationTreeViewProps & RefAttributes<unknown>>;
 
-export declare type HvVerticalNavigationTreeViewClasses = {
+export declare interface HvVerticalNavigationTreeViewClasses {
     root?: string;
-};
+}
 
 export declare const HvVerticalNavigationTreeViewItem: ForwardRefExoticComponent<HvVerticalNavigationTreeViewItemProps & RefAttributes<unknown>>;
 
-export declare type HvVerticalNavigationTreeViewItemClasses = {
+export declare interface HvVerticalNavigationTreeViewItemClasses {
     /** Style applied to the root of the component. */
     node?: string;
     /** Style applied to the content. */
@@ -6549,9 +6517,9 @@ export declare type HvVerticalNavigationTreeViewItemClasses = {
     /** Styled applied when navigation open is false */
     minimized?: string;
     hide?: string;
-};
+}
 
-export declare type HvVerticalNavigationTreeViewItemProps = {
+export declare interface HvVerticalNavigationTreeViewItemProps {
     /**
      * Id to be applied to the root node.
      */
@@ -6620,9 +6588,9 @@ export declare type HvVerticalNavigationTreeViewItemProps = {
      * Disables the appearence of a tooltip on hovering an element ( Only applicable when the in collapsed mode)
      */
     disableTooltip?: boolean;
-};
+}
 
-export declare type HvVerticalNavigationTreeViewProps = {
+export declare interface HvVerticalNavigationTreeViewProps {
     /**
      * Id to be applied to the root node.
      */
@@ -6710,14 +6678,14 @@ export declare type HvVerticalNavigationTreeViewProps = {
      * The content of the component.
      */
     children?: React.ReactNode;
-};
+}
 
 /**
  * Provides the user with a descriptive text, signaling an error, for when the form element is in an invalid state.
  */
 export declare const HvWarningText: ({ children, adornment, isVisible, classes, className, id, disabled, disableGutter, disableBorder, disableAdornment, hideText, ...others }: HvWarningTextProps) => JSX_2.Element;
 
-export declare type HvWarningTextClasses = {
+export declare interface HvWarningTextClasses {
     root?: string;
     defaultIcon?: string;
     warningText?: string;
@@ -6725,9 +6693,9 @@ export declare type HvWarningTextClasses = {
     topGutter?: string;
     hideText?: string;
     topBorder?: string;
-};
+}
 
-export declare type HvWarningTextProps = HvBaseProps & {
+export declare interface HvWarningTextProps extends HvBaseProps {
     /** Icon to be rendered alongside the warning text. */
     adornment?: React.ReactNode;
     /** If `true` the text is not rendered. */
@@ -6744,7 +6712,7 @@ export declare type HvWarningTextProps = HvBaseProps & {
     hideText?: boolean;
     /** A Jss Object used to override or extend the styles applied to the component. */
     classes?: HvWarningTextClasses;
-};
+}
 
 export declare const iconVariant: (variant: any, color: any, semantic: any) => JSX_2.Element | null;
 
@@ -6900,13 +6868,13 @@ export declare const loadingClasses: HvLoadingClasses;
 
 export declare const loginClasses: HvLoginClasses;
 
-declare type MenuItemProps = HvBaseProps<HTMLDivElement, {
+declare interface MenuItemProps extends HvBaseProps<HTMLDivElement, {
     onClick: any;
-}> & {
+}> {
     item: HvHeaderNavigationItemProp;
     type?: string;
     onClick?: (event: MouseEvent, selection: HvHeaderNavigationItemProp) => void;
-};
+}
 
 export declare const multiButtonClasses: HvMultiButtonClasses;