@dxc-technology/halstack-react 0.0.0-646cad5 → 0.0.0-648c007

package/dist/index.d.mts

@@ -111,10 +111,10 @@ type NonIndependentProps = CommonProps$9 & {
      */
     onActiveChange?: (index: number[]) => void;
 };
-type Props$J = IndependentProps | NonIndependentProps;
+type Props$I = IndependentProps | NonIndependentProps;
 
 declare const DxcAccordion: {
-    (props: Props$J): JSX.Element;
+    (props: Props$I): JSX.Element;
     AccordionItem: ({ label, subLabel, badge, statusLight, icon, assistiveText, disabled, children, tabIndex, }: AccordionItemProps) => JSX.Element;
 };
 
@@ -197,9 +197,9 @@ type ModeSpecificProps = {
      */
     mode: "modal";
 };
-type Props$I = CommonProps$8 & ModeSpecificProps;
+type Props$H = CommonProps$8 & ModeSpecificProps;
 
-declare function DxcAlert({ closable, message, mode, primaryAction, secondaryAction, semantic, title, }: Props$I): react_jsx_runtime.JSX.Element;
+declare function DxcAlert({ closable, message, mode, primaryAction, secondaryAction, semantic, title, }: Props$H): react_jsx_runtime.JSX.Element;
 
 type SidenavTitlePropsType = {
     /**
@@ -264,7 +264,7 @@ type SidenavLinkPropsType = {
      */
     tabIndex?: number;
 };
-type Props$H = {
+type Props$G = {
     /**
      * The area assigned to render the sidenav title. It is highly recommended to use the sidenav title.
      */
@@ -276,7 +276,7 @@ type Props$H = {
 };
 
 type Size$4 = "small" | "medium" | "large" | "fillParent" | "fitContent";
-type Option$1 = {
+type Option$2 = {
     /**
      * Option display value.
      */
@@ -290,11 +290,11 @@ type Option$1 = {
      */
     value: string;
 };
-type Props$G = {
+type Props$F = {
     /**
      * An array of objects representing the options.
      */
-    options: Option$1[];
+    options: Option$2[];
     /**
      * In case options include icons, whether the icon should appear
      * after or before the label.
@@ -350,7 +350,21 @@ type Props$G = {
     title?: string;
 };
 
-type Props$F = {
+type Logo = {
+    /**
+     * URL to navigate when the logo is clicked.
+     */
+    href?: string;
+    /**
+     * Source of the logo image.
+     */
+    src: string;
+    /**
+     * Alternative text for the logo image.
+     */
+    title?: string;
+};
+type Props$E = {
     /**
      * Whether a contrast line should appear at the bottom of the header.
      */
@@ -367,13 +381,17 @@ type Props$F = {
      */
     responsiveContent?: (closeHandler: () => void) => ReactNode;
     /**
-     * This function will be called when the user clicks the header logo.
+     * Logo to be displayed inside the header
      */
-    onClick?: () => void;
+    logo?: Logo;
     /**
      * Size of the bottom margin to be applied to the header.
      */
     margin?: Space$1;
+    /**
+     * This function will be called when the user clicks the header logo.
+     */
+    onClick?: () => void;
     /**
      * Value of the tabindex for all interactive elements, except those inside the
      * custom area.
@@ -476,12 +494,12 @@ declare const DxcApplicationLayout: {
     ({ visibilityToggleLabel, header, sidenav, footer, children, }: ApplicationLayoutPropsType): JSX.Element;
     Footer: ({ socialLinks, bottomLinks, copyright, children, margin, tabIndex, mode, }: FooterPropsType) => JSX.Element;
     Header: {
-        ({ underlined, content, responsiveContent, onClick, margin, tabIndex, }: Props$F): JSX.Element;
-        Dropdown: (props: react.ComponentProps<({ options, optionsIconPosition, icon, iconPosition, label, caretHidden, disabled, expandOnHover, onSelectOption, margin, size, tabIndex, title, }: Props$G) => JSX.Element>) => react_jsx_runtime.JSX.Element;
+        ({ underlined, content, responsiveContent, logo, margin, onClick, tabIndex, }: Props$E): JSX.Element;
+        Dropdown: (props: react.ComponentProps<({ options, optionsIconPosition, icon, iconPosition, label, caretHidden, disabled, expandOnHover, onSelectOption, margin, size, tabIndex, title, }: Props$F) => react_jsx_runtime.JSX.Element>) => react_jsx_runtime.JSX.Element;
     };
     Main: ({ children }: AppLayoutMainPropsType) => JSX.Element;
     SideNav: {
-        ({ title, children }: Props$H): JSX.Element;
+        ({ title, children }: Props$G): JSX.Element;
         Section: ({ children }: SidenavSectionPropsType) => JSX.Element;
         Group: ({ title, collapsable, icon, children }: SidenavGroupPropsType) => JSX.Element;
         Link: react.ForwardRefExoticComponent<SidenavLinkPropsType & react.RefAttributes<HTMLAnchorElement>>;
@@ -540,144 +558,52 @@ type CommonProps$7 = {
      */
     size?: "small" | "medium" | "large";
 };
-type Props$E = (ContextualProps | NotificationProps) & CommonProps$7;
+type Props$D = (ContextualProps | NotificationProps) & CommonProps$7;
 
-declare const DxcBadge: ({ label, title, mode, color, icon, notificationLimit, size, }: Props$E) => JSX.Element;
-
-/**
- * Halstack Color Palette
- * @link https://developer.dxc.com/halstack/next/principles/color/#color-tokens-core-color-tokens
- */
-declare const CoreColorTokens: {
-    color_black: string;
-    color_white: string;
-    color_transparent: string;
-    color_grey_50: string;
-    color_grey_100: string;
-    color_grey_200: string;
-    color_grey_300: string;
-    color_grey_400: string;
-    color_grey_500: string;
-    color_grey_600: string;
-    color_grey_700: string;
-    color_grey_800: string;
-    color_grey_900: string;
-    color_grey_50_a: string;
-    color_grey_100_a: string;
-    color_grey_200_a: string;
-    color_grey_300_a: string;
-    color_grey_400_a: string;
-    color_grey_500_a: string;
-    color_grey_600_a: string;
-    color_grey_700_a: string;
-    color_grey_800_a: string;
-    color_grey_900_a: string;
-    color_purple_50: string;
-    color_purple_100: string;
-    color_purple_200: string;
-    color_purple_300: string;
-    color_purple_400: string;
-    color_purple_500: string;
-    color_purple_600: string;
-    color_purple_700: string;
-    color_purple_800: string;
-    color_purple_900: string;
-    color_blue_50: string;
-    color_blue_100: string;
-    color_blue_200: string;
-    color_blue_300: string;
-    color_blue_400: string;
-    color_blue_500: string;
-    color_blue_600: string;
-    color_blue_700: string;
-    color_blue_800: string;
-    color_blue_900: string;
-    color_red_50: string;
-    color_red_100: string;
-    color_red_200: string;
-    color_red_300: string;
-    color_red_400: string;
-    color_red_500: string;
-    color_red_600: string;
-    color_red_700: string;
-    color_red_800: string;
-    color_red_900: string;
-    color_green_50: string;
-    color_green_100: string;
-    color_green_200: string;
-    color_green_300: string;
-    color_green_400: string;
-    color_green_500: string;
-    color_green_600: string;
-    color_green_700: string;
-    color_green_800: string;
-    color_green_900: string;
-    color_yellow_50: string;
-    color_yellow_100: string;
-    color_yellow_200: string;
-    color_yellow_300: string;
-    color_yellow_400: string;
-    color_yellow_500: string;
-    color_yellow_600: string;
-    color_yellow_700: string;
-    color_yellow_800: string;
-    color_yellow_900: string;
-    color_orange_50: string;
-    color_orange_100: string;
-    color_orange_200: string;
-    color_orange_300: string;
-    color_orange_400: string;
-    color_orange_500: string;
-    color_orange_600: string;
-    color_orange_700: string;
-    color_orange_800: string;
-    color_orange_900: string;
-};
-type CoreColorTokensType = keyof typeof CoreColorTokens;
-type CoreSpacingTokensType = "0rem" | "0.125rem" | "0.25rem" | "0.5rem" | "0.75rem" | "1rem" | "1.5rem" | "2rem" | "2.5rem" | "3rem" | "3.5rem" | "4rem" | "5rem" | "6rem" | "7rem";
+declare const DxcBadge: ({ label, title, mode, color, icon, notificationLimit, size, }: Props$D) => JSX.Element;
 
-type Props$D = {
+type Props$C = {
     /**
      * Applies the spacing scale to all sides.
      */
-    space?: CoreSpacingTokensType;
+    space?: string;
     /**
      * Applies the spacing scale to the left and right sides.
      */
-    horizontal?: CoreSpacingTokensType;
+    horizontal?: string;
     /**
      * Applies the spacing scale to the top and bottom sides.
      */
-    vertical?: CoreSpacingTokensType;
+    vertical?: string;
     /**
      * Applies the spacing scale to the top side.
      */
-    top?: CoreSpacingTokensType;
+    top?: string;
     /**
      * Applies the spacing scale to the right side.
      */
-    right?: CoreSpacingTokensType;
+    right?: string;
     /**
      * Applies the spacing scale to the bottom side.
      */
-    bottom?: CoreSpacingTokensType;
+    bottom?: string;
     /**
      * Applies the spacing scale to the left side.
      */
-    left?: CoreSpacingTokensType;
+    left?: string;
     /**
      * Custom content inside the bleed.
      */
     children: ReactNode;
 };
 
-declare const Bleed: ({ space, horizontal, vertical, top, right, bottom, left, children }: Props$D) => react_jsx_runtime.JSX.Element;
+declare function DxcBleed({ space, horizontal, vertical, top, right, bottom, left, children }: Props$C): react_jsx_runtime.JSX.Element;
 
 type Item$1 = {
     href?: string;
     label: string;
 };
-type Props$C = {
+type Props$B = {
     /**
      * Provides a label that describes the type of navigation enabled by
      * the component.
@@ -709,7 +635,7 @@ type Props$C = {
     showRoot?: boolean;
 };
 
-declare const DxcBreadcrumbs: ({ ariaLabel, items, itemsBeforeCollapse, onItemClick, showRoot, }: Props$C) => react_jsx_runtime.JSX.Element;
+declare const DxcBreadcrumbs: ({ ariaLabel, items, itemsBeforeCollapse, onItemClick, showRoot, }: Props$B) => react_jsx_runtime.JSX.Element;
 
 type IconProps = {
     /**
@@ -739,7 +665,7 @@ type OtherProps = {
      */
     children: ReactNode;
 };
-type Props$B = IconProps | OtherProps;
+type Props$A = IconProps | OtherProps;
 
 type BulletedListItemPropsType = {
     /**
@@ -749,7 +675,7 @@ type BulletedListItemPropsType = {
 };
 
 declare const DxcBulletedList: {
-    ({ children, type, icon }: Props$B): JSX.Element;
+    ({ children, type, icon }: Props$A): JSX.Element;
     Item: ({ children }: BulletedListItemPropsType) => JSX.Element;
 };
 
@@ -762,7 +688,7 @@ type Size$3 = {
     height?: "small" | "medium" | "large";
     width?: "small" | "medium" | "large" | "fillParent" | "fitContent";
 };
-type Props$A = {
+type Props$z = {
     /**
      * Text to be placed in the button.
      */
@@ -814,7 +740,7 @@ type Props$A = {
     tabIndex?: number;
 };
 
-declare const DxcButton: ({ disabled, icon, iconPosition, label, margin, mode, onClick, semantic, size, tabIndex, title, type, }: Props$A) => JSX.Element;
+declare const DxcButton: ({ disabled, icon, iconPosition, label, margin, mode, onClick, semantic, size, tabIndex, title, type, }: Props$z) => JSX.Element;
 
 type Size$2 = {
     top?: Space$1;
@@ -822,7 +748,7 @@ type Size$2 = {
     left?: Space$1;
     right?: Space$1;
 };
-type Props$z = {
+type Props$y = {
     /**
      * URL of the image that will be placed in the card component.
      * In case of omission, the image container will not appear and
@@ -876,23 +802,26 @@ type Props$z = {
     children?: ReactNode;
 };
 
-declare const DxcCard: ({ imageSrc, imageBgColor, imagePadding, imagePosition, linkHref, onClick, imageCover, margin, tabIndex, outlined, children, }: Props$z) => JSX.Element;
+declare const DxcCard: ({ imageSrc, imageBgColor, imagePadding, imagePosition, linkHref, onClick, imageCover, margin, tabIndex, outlined, children, }: Props$y) => react_jsx_runtime.JSX.Element;
 
-type Props$y = {
+type Props$x = {
     /**
-     * Initial state of the checkbox, only when it is uncontrolled.
+     * Specifies a string to be used as the name for the checkbox element when no `label` is provided.
      */
-    defaultChecked?: boolean;
+    ariaLabel?: string;
     /**
      * If true, the component is checked. If undefined the component will be
      * uncontrolled and the value will be managed internally by the component.
      */
     checked?: boolean;
     /**
-     * Will be passed to the value attribute of the html input element.
-     * When inside a form, this value will be only submitted if the checkbox is checked.
+     * Initial state of the checkbox, only when it is uncontrolled.
      */
-    value?: string;
+    defaultChecked?: boolean;
+    /**
+     * If true, the component will be disabled.
+     */
+    disabled?: boolean;
     /**
      * Text to be placed next to the checkbox.
      */
@@ -901,14 +830,22 @@ type Props$y = {
      * Whether the label should appear after or before the checkbox.
      */
     labelPosition?: "before" | "after";
+    /**
+     * Size of the margin to be applied to the component
+     * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
+     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties
+     * in order to specify different margin sizes.
+     */
+    margin?: Space$1 | Margin;
     /**
      * Name attribute of the input element.
      */
     name?: string;
     /**
-     * If true, the component will be disabled.
+     * This function will be called when the user clicks the checkbox.
+     * The new value will be passed as a parameter.
      */
-    disabled?: boolean;
+    onChange?: (value: boolean) => void;
     /**
      * If true, the component will display '(Optional)' next to the label.
      */
@@ -917,18 +854,6 @@ type Props$y = {
      * If true, the component will not be mutable, meaning the user can not edit the control.
      */
     readOnly?: boolean;
-    /**
-     * This function will be called when the user clicks the checkbox.
-     * The new value will be passed as a parameter.
-     */
-    onChange?: (value: boolean) => void;
-    /**
-     * Size of the margin to be applied to the component
-     * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
-     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties
-     * in order to specify different margin sizes.
-     */
-    margin?: Space$1 | Margin;
     /**
      * Size of the component.
      */
@@ -938,14 +863,15 @@ type Props$y = {
      */
     tabIndex?: number;
     /**
-     * Specifies a string to be used as the name for the checkbox element when no `label` is provided.
+     * Will be passed to the value attribute of the html input element.
+     * When inside a form, this value will be only submitted if the checkbox is checked.
      */
-    ariaLabel?: string;
+    value?: string;
 };
 
-declare const DxcCheckbox: react.ForwardRefExoticComponent<Props$y & react.RefAttributes<HTMLDivElement>>;
+declare const DxcCheckbox: react.ForwardRefExoticComponent<Props$x & react.RefAttributes<HTMLDivElement>>;
 
-type Props$x = {
+type Props$w = {
     /**
      * Text to be placed on the chip.
      */
@@ -981,15 +907,15 @@ type Props$x = {
     tabIndex?: number;
 };
 
-declare const DxcChip: ({ label, suffixIcon, prefixIcon, onClickSuffix, onClickPrefix, disabled, margin, tabIndex, }: Props$x) => react_jsx_runtime.JSX.Element;
+declare const DxcChip: ({ label, suffixIcon, prefixIcon, onClickSuffix, onClickPrefix, disabled, margin, tabIndex, }: Props$w) => react_jsx_runtime.JSX.Element;
 
-type Space = Space$1 | {
-    top?: Space$1;
-    right?: Space$1;
-    bottom?: Space$1;
-    left?: Space$1;
+type Space = {
+    top?: string;
+    right?: string;
+    bottom?: string;
+    left?: string;
 };
-type Inset$1 = {
+type Inset = {
     top?: string;
     right?: string;
     bottom?: string;
@@ -998,7 +924,7 @@ type Inset$1 = {
 type Background = {
     attachment?: string;
     clip?: string;
-    color?: CoreColorTokensType;
+    color?: string;
     image?: string;
     origin?: string;
     position?: string;
@@ -1007,8 +933,8 @@ type Background = {
 };
 type BorderProperties = {
     width?: string;
-    style?: "none" | "dotted" | "dashed" | "solid" | "double" | "groove" | "ridge" | "inset" | "outset";
-    color?: CoreColorTokensType;
+    style?: string;
+    color?: string;
 };
 type Border = BorderProperties | {
     top?: BorderProperties;
@@ -1024,7 +950,7 @@ type Overflow = OverflowValues | {
     x?: OverflowValues;
     y?: OverflowValues;
 };
-type Props$w = {
+type Props$v = {
     /**
      * Based on the CSS property background allows configuring all properties related to the background of a container.
      *
@@ -1056,7 +982,7 @@ type Props$w = {
     /**
      * Custom content inside the container.
      */
-    children: ReactNode;
+    children?: ReactNode;
     /**
      * Sets the display CSS property.
      * The set of values is limited to the ones related to the outer display type.
@@ -1082,19 +1008,11 @@ type Props$w = {
      * Based on the CSS property inset this prop is a shorthand that corresponds
      * to the top, right, bottom, and/or left properties.
      */
-    inset?: Inset$1;
-    /**
-     * Size of the margin to be applied to the component.
-     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties
-     * in order to specify different margin sizes.
-     */
-    margin?: Space;
+    inset?: Inset;
     /**
-     * Sets the max-height CSS property.
-     *
-     * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/max-height
+     * Size of the margin to be applied to the container.
      */
-    maxWidth?: string;
+    margin?: string | Space;
     /**
      * Sets the max-width CSS property.
      *
@@ -1102,17 +1020,23 @@ type Props$w = {
      */
     maxHeight?: string;
     /**
-     * Sets the min-height CSS property.
+     * Sets the max-height CSS property.
      *
-     * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/min-height
+     * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/max-height
      */
-    minWidth?: string;
+    maxWidth?: string;
     /**
      * Sets the min-width CSS property.
      *
      * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/min-width
      */
     minHeight?: string;
+    /**
+     * Sets the min-height CSS property.
+     *
+     * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/min-height
+     */
+    minWidth?: string;
     /**
      * Based on the CSS property outline allows configuring all properties related
      * to the outline of a container.
@@ -1125,11 +1049,9 @@ type Props$w = {
      */
     overflow?: Overflow;
     /**
-     * Size of the margin to be applied to the component.
-     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties
-     * in order to specify different margin sizes.
+     * Size of the padding to be applied to the container.
      */
-    padding?: Space;
+    padding?: string | Space;
     /**
      * Sets the position CSS property.
      *
@@ -1150,7 +1072,7 @@ type Props$w = {
     zIndex?: "auto" | number;
 };
 
-declare function DxcContainer({ display, width, height, overflow, ...props }: Props$w): react_jsx_runtime.JSX.Element;
+declare function DxcContainer({ display, width, height, overflow, ...props }: Props$v): react_jsx_runtime.JSX.Element;
 
 type CommonItemProps = {
     badge?: ReactElement;
@@ -1168,7 +1090,7 @@ type Section = {
     items: (Item | GroupItem)[];
     title?: string;
 };
-type Props$v = {
+type Props$u = {
     /**
      * Array of items to be displayed in the Contextual menu.
      * Each item can be a single/simple item, a group item or a section.
@@ -1176,27 +1098,32 @@ type Props$v = {
     items: (Item | GroupItem)[] | Section[];
 };
 
-declare function DxcContextualMenu({ items }: Props$v): react_jsx_runtime.JSX.Element;
+declare function DxcContextualMenu({ items }: Props$u): react_jsx_runtime.JSX.Element;
 
-type ActionCellsPropsType = {
-    actions: ActionsPropsType;
+type BaseActionCell = {
+    disabled?: boolean;
+    tabIndex?: number;
+    title: string;
 };
-type ActionsPropsType = Array<{
+type ActionCell = BaseActionCell & ({
     icon: string | SVG;
-    title: string;
     onClick: () => void;
-    disabled?: boolean;
-    tabIndex?: number;
     options?: never;
 } | {
     icon?: never;
-    title: string;
     onClick: (value?: string) => void;
-    disabled?: boolean;
-    tabIndex?: number;
-    options: Option$1[];
-}>;
-type Props$u = {
+    options: Option$2[];
+});
+type ActionsCellPropsType = {
+    /**
+     * It represents a list of interactive elements that will work as buttons or as a dropdown. Those with an icon from Material Symbols
+     * or a SVG are treated as buttons. If any element lacks an icon and includes options, it is interpreted as a dropdown.
+     * Only the first action with options will be displayed and only up to 3 actions.
+     * In the case of the dropdown the click function will pass the value assigned to the option.
+     */
+    actions: ActionCell[];
+};
+type Props$t = {
     /**
      * The center section of the table. Can be used to render custom
      * content in this area.
@@ -1265,6 +1192,7 @@ type HierarchyGridRow = GridRow & {
 type ExpandableGridRow = GridRow & {
     expandedContent?: ReactNode;
     expandedContentHeight?: number;
+    contentIsExpanded?: boolean;
 };
 type ExpandableRows = {
     rows: ExpandableGridRow[];
@@ -1341,6 +1269,10 @@ type PaginatedProps$1 = {
      * Function called whenever the current page is changed.
      */
     onPageChange?: (_page: number) => void;
+    /**
+     * Default page in which the datagrid is rendered
+     */
+    defaultPage?: number;
 };
 type NonPaginatedProps$1 = {
     /**
@@ -1372,6 +1304,10 @@ type NonPaginatedProps$1 = {
      * Function called whenever the current page is changed.
      */
     onPageChange?: never;
+    /**
+     * Default page in which the datagrid is rendered
+     */
+    defaultPage?: never;
 };
 type CommonProps$6 = {
     columns: GridColumn[];
@@ -1396,14 +1332,14 @@ type BasicGridProps = {
      */
     expandable?: false;
 };
-type Props$t = CommonProps$6 & (PaginatedProps$1 | NonPaginatedProps$1) & ((BasicGridProps & SelectableGridProps) | (ExpandableRows & SelectableGridProps) | (HierarchyRows & SelectableGridProps));
+type Props$s = CommonProps$6 & (PaginatedProps$1 | NonPaginatedProps$1) & ((BasicGridProps & SelectableGridProps) | (ExpandableRows & SelectableGridProps) | (HierarchyRows & SelectableGridProps));
 
 declare const DxcDataGrid: {
-    ({ columns, rows, selectable, expandable, onSelectRows, selectedRows, uniqueRowId, summaryRow, onGridRowsChange, showPaginator, showGoToPage, itemsPerPage, itemsPerPageOptions, itemsPerPageFunction, onSort, onPageChange, totalItems, }: Props$t): JSX.Element;
-    ActionsCell: ({ actions }: ActionCellsPropsType) => JSX.Element;
+    ({ columns, rows, selectable, expandable, onSelectRows, selectedRows, uniqueRowId, summaryRow, onGridRowsChange, showPaginator, showGoToPage, itemsPerPage, itemsPerPageOptions, itemsPerPageFunction, onSort, onPageChange, totalItems, defaultPage, }: Props$s): JSX.Element;
+    ActionsCell: ({ actions }: ActionsCellPropsType) => react_jsx_runtime.JSX.Element;
 };
 
-type Props$s = {
+type Props$r = {
     /**
      * Initial value of the input element, only when it is uncontrolled.
      */
@@ -1509,9 +1445,9 @@ type Props$s = {
     ariaLabel?: string;
 };
 
-declare const DxcDateInput: react.ForwardRefExoticComponent<Props$s & react.RefAttributes<HTMLDivElement>>;
+declare const DxcDateInput: react.ForwardRefExoticComponent<Props$r & react.RefAttributes<HTMLDivElement>>;
 
-type Props$r = {
+type Props$q = {
     /**
      * If true, the close button will be visible.
      */
@@ -1546,9 +1482,9 @@ type Props$r = {
     tabIndex?: number;
 };
 
-declare const DxcDialog: ({ children, closable, onBackgroundClick, onCloseClick, overlay, tabIndex, }: Props$r) => JSX.Element;
+declare const DxcDialog: ({ children, closable, onBackgroundClick, onCloseClick, overlay, tabIndex, }: Props$q) => JSX.Element;
 
-type Props$q = {
+type Props$p = {
     /**
      * The divider can be shown in horizontal or vertical.
      */
@@ -1569,9 +1505,9 @@ type Props$q = {
     decorative?: boolean;
 };
 
-declare const DxcDivider: ({ orientation, weight, color, decorative, }: Props$q) => react_jsx_runtime.JSX.Element;
+declare function DxcDivider({ color, decorative, orientation, weight, }: Props$p): react_jsx_runtime.JSX.Element;
 
-declare const DxcDropdown: ({ options, optionsIconPosition, icon, iconPosition, label, caretHidden, disabled, expandOnHover, onSelectOption, margin, size, tabIndex, title, }: Props$G) => JSX.Element;
+declare const DxcDropdown: ({ options, optionsIconPosition, icon, iconPosition, label, caretHidden, disabled, expandOnHover, onSelectOption, margin, size, tabIndex, title, }: Props$F) => react_jsx_runtime.JSX.Element;
 
 type FileData = {
     /**
@@ -1672,17 +1608,17 @@ type FileModeProps = CommonProps$5 & {
      */
     dropAreaLabel?: never;
 };
-type Props$p = DropModeProps | FileModeProps;
+type Props$o = DropModeProps | FileModeProps;
 
-declare const DxcFileInput: react.ForwardRefExoticComponent<Props$p & react.RefAttributes<HTMLDivElement>>;
+declare const DxcFileInput: react.ForwardRefExoticComponent<Props$o & react.RefAttributes<HTMLDivElement>>;
 
 type Gap$1 = {
-    rowGap: CoreSpacingTokensType;
-    columnGap?: CoreSpacingTokensType;
+    rowGap: string;
+    columnGap?: string;
 } | {
-    rowGap?: CoreSpacingTokensType;
-    columnGap: CoreSpacingTokensType;
-} | CoreSpacingTokensType;
+    rowGap?: string;
+    columnGap: string;
+} | string;
 type CommonProps$4 = {
     /**
      * Sets the justify-content CSS property.
@@ -1709,7 +1645,7 @@ type CommonProps$4 = {
      */
     alignSelf?: "auto" | "flex-start" | "flex-end" | "center" | "baseline" | "stretch";
 };
-type Props$o = CommonProps$4 & {
+type Props$n = CommonProps$4 & {
     /**
      * Sets the flex-direction CSS property.
      *
@@ -1762,49 +1698,51 @@ type Props$o = CommonProps$4 & {
     children: ReactNode;
 };
 
-declare const DxcFlex: ({ basis, direction, gap, grow, order, shrink, wrap, ...props }: Props$o) => react_jsx_runtime.JSX.Element;
+declare const DxcFlex: ({ basis, direction, gap, grow, order, shrink, wrap, ...props }: Props$n) => react_jsx_runtime.JSX.Element;
 
-type Gap = {
-    rowGap: CoreSpacingTokensType;
-    columnGap?: CoreSpacingTokensType;
+type Gap = string | {
+    columnGap?: string;
+    rowGap: string;
 } | {
-    rowGap?: CoreSpacingTokensType;
-    columnGap: CoreSpacingTokensType;
-} | CoreSpacingTokensType;
+    columnGap: string;
+    rowGap?: string;
+};
 type GridCell = {
-    start: number | string;
     end: number | string;
+    start: number | string;
 };
-type PlaceSelfValues = "auto" | "start" | "end" | "center" | "stretch" | "baseline";
-type PlaceContentValues = "normal" | "start" | "end" | "center" | "stretch" | "space-between" | "space-around" | "space-evenly" | "baseline";
-type PlaceItemsValues = "normal" | "start" | "end" | "center" | "stretch" | "baseline";
+type PlaceSelfValues = "auto" | "baseline" | "center" | "end" | "start" | "stretch";
+type PlaceContentValues = "baseline" | "center" | "end" | "normal" | "space-around" | "space-between" | "space-evenly" | "start" | "stretch";
+type PlaceItemsValues = "baseline" | "center" | "end" | "normal" | "start" | "stretch";
 type PlaceObject<Type, Suffix extends string> = {
     [Property in keyof Type as `${string & Property}${Capitalize<string & Suffix>}`]: Type[Property];
 };
 type PlaceGeneric<PlaceValues, Element extends string> = PlaceObject<{
-    justify?: PlaceValues;
     align: PlaceValues;
+    justify?: PlaceValues;
 }, Element> | PlaceObject<{
-    justify: PlaceValues;
     align?: PlaceValues;
+    justify: PlaceValues;
 }, Element> | PlaceValues;
 type GridItemProps = {
     /**
      * Sets the name of an item so that it can be referenced by a template created with the grid-template-areas property.
      */
     areaName?: string;
+    /**
+     * Sets a custom HTML tag.
+     */
+    as?: keyof HTMLElementTagNameMap;
+    /**
+     * Custom content inside the grid container.
+     */
+    children: ReactNode;
     /**
      * Sets the grid-column CSS property.
      *
      * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column
      */
     column?: number | string | GridCell;
-    /**
-     * Sets the grid-row CSS property.
-     *
-     * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row
-     */
-    row?: number | string | GridCell;
     /**
      * Sets the place-self CSS property.
      *
@@ -1812,15 +1750,13 @@ type GridItemProps = {
      */
     placeSelf?: PlaceGeneric<PlaceSelfValues, "self">;
     /**
-     * Sets a custom HTML tag.
-     */
-    as?: keyof HTMLElementTagNameMap;
-    /**
-     * Custom content inside the grid container.
+     * Sets the grid-row CSS property.
+     *
+     * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row
      */
-    children: ReactNode;
+    row?: number | string | GridCell;
 };
-type Props$n = GridItemProps & {
+type Props$m = GridItemProps & {
     /**
      * Sets the grid-auto-columns CSS property.
      *
@@ -1844,7 +1780,7 @@ type Props$n = GridItemProps & {
      *
      * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/gap
      */
-    gap?: CoreSpacingTokensType | Gap;
+    gap?: Gap;
     /**
      * Sets the place-content CSS property.
      *
@@ -1878,17 +1814,17 @@ type Props$n = GridItemProps & {
 };
 
 declare const DxcGrid: {
-    (props: Props$n): react_jsx_runtime.JSX.Element;
+    (props: Props$m): react_jsx_runtime.JSX.Element;
     Item: styled_components.StyledComponent<"div", any, GridItemProps, never>;
 };
 
-type Props$m = {
+type Props$l = {
     /**
      * Defines the heading level from 1 to 5. The styles of the heading are applied according to the level.
      * The html tag of the heading will be the one specified in the 'as' prop.
      * If 'as' is not specified, the html tag of the heading is the one specified in the 'level' prop.
      */
-    level?: 1 | 2 | 3 | 4 | 5;
+    level?: 1 | 2 | 3 | 4 | 5 | 6;
     /**
      * Heading text.
      */
@@ -1896,11 +1832,11 @@ type Props$m = {
     /**
      * Modifies the default weight of the heading.
      */
-    weight?: "light" | "normal" | "bold";
+    weight?: "light" | "default" | "regular";
     /**
      * Specifies the HTML tag of the heading.
      */
-    as?: "h1" | "h2" | "h3" | "h4" | "h5";
+    as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
     /**
      * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
      * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
@@ -1908,9 +1844,9 @@ type Props$m = {
     margin?: Space$1 | Margin;
 };
 
-declare const DxcHeading: ({ level, text, as, weight, margin }: Props$m) => JSX.Element;
+declare function DxcHeading({ as, level, margin, text, weight }: Props$l): react_jsx_runtime.JSX.Element;
 
-type Props$l = {
+type Props$k = {
     /**
      * Alternative text description displayed when the specified image is not loaded.
      *
@@ -1923,21 +1859,35 @@ type Props$l = {
      * which is required regardless of the presence of the caption or not.
      */
     caption?: string;
+    /**
+     * Sets the rendered height of the image.
+     */
+    height?: string;
     /**
      * If true, the image will be loaded only when it is visible on the screen (lazy loading).
      * Otherwise and by default, the image will be loaded as soon as the component is mounted (eager loading).
      */
     lazyLoading?: boolean;
     /**
-     * URL of the image. This prop is required and must be valid.
+     * Sets the object-fit CSS property.
+     *
+     * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit
      */
-    src: string;
+    objectFit?: "contain" | "cover" | "fill" | "none" | "scale-down";
     /**
-     * List of one or more strings separated by commas indicating a set of possible images for the user agent to use.
+     * Sets the object-position CSS property.
      *
-     * See MDN: https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/srcset
+     * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/object-position
      */
-    srcSet?: string;
+    objectPosition?: string;
+    /**
+     * This function will be called when the image fails to load.
+     */
+    onError?: ReactEventHandler<HTMLImageElement>;
+    /**
+     * This function will be called when the image is loaded.
+     */
+    onLoad?: ReactEventHandler<HTMLImageElement>;
     /**
      * One or more strings separated by commas, indicating a set of source sizes.
      * If the srcSet attribute is absent or contains no values with a width descriptor,
@@ -1947,73 +1897,59 @@ type Props$l = {
      */
     sizes?: string;
     /**
-     * Sets the rendered width of the image.
-     */
-    width?: string;
-    /**
-     * Sets the rendered height of the image.
-     */
-    height?: string;
-    /**
-     * Sets the object-fit CSS property.
-     *
-     * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit
+     * URL of the image. This prop is required and must be valid.
      */
-    objectFit?: "contain" | "cover" | "fill" | "none" | "scale-down";
+    src: string;
     /**
-     * Sets the object-position CSS property.
+     * List of one or more strings separated by commas indicating a set of possible images for the user agent to use.
      *
-     * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/object-position
-     */
-    objectPosition?: string;
-    /**
-     * This function will be called when the image is loaded.
+     * See MDN: https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/srcset
      */
-    onLoad?: ReactEventHandler<HTMLImageElement>;
+    srcSet?: string;
     /**
-     * This function will be called when the image fails to load.
+     * Sets the rendered width of the image.
      */
-    onError?: ReactEventHandler<HTMLImageElement>;
+    width?: string;
 };
 
-declare function DxcImage({ alt, caption, lazyLoading, src, srcSet, sizes, width, height, objectFit, objectPosition, onLoad, onError, }: Props$l): react_jsx_runtime.JSX.Element;
+declare function DxcImage({ alt, caption, height, lazyLoading, objectFit, objectPosition, onError, onLoad, sizes, src, srcSet, width, }: Props$k): react_jsx_runtime.JSX.Element;
 
-type Props$k = {
+type Props$j = {
     /**
-     * Applies the spacing scale to all sides.
+     * Applies the spacing scale to the bottom side.
      */
-    space?: CoreSpacingTokensType;
+    bottom?: string;
     /**
-     * Applies the spacing scale to the left and right sides.
+     * Custom content inside the inset.
      */
-    horizontal?: CoreSpacingTokensType;
+    children: ReactNode;
     /**
-     * Applies the spacing scale to the top and bottom sides.
+     * Applies the spacing scale to the left and right sides.
      */
-    vertical?: CoreSpacingTokensType;
+    horizontal?: string;
     /**
-     * Applies the spacing scale to the top side.
+     * Applies the spacing scale to the left side.
      */
-    top?: CoreSpacingTokensType;
+    left?: string;
     /**
      * Applies the spacing scale to the right side.
      */
-    right?: CoreSpacingTokensType;
+    right?: string;
     /**
-     * Applies the spacing scale to the bottom side.
+     * Applies the spacing scale to all sides.
      */
-    bottom?: CoreSpacingTokensType;
+    space?: string;
     /**
-     * Applies the spacing scale to the left side.
+     * Applies the spacing scale to the top side.
      */
-    left?: CoreSpacingTokensType;
+    top?: string;
     /**
-     * Custom content inside the inset.
+     * Applies the spacing scale to the top and bottom sides.
      */
-    children: ReactNode;
+    vertical?: string;
 };
 
-declare const Inset: ({ space, horizontal, vertical, top, right, bottom, left, children }: Props$k) => react_jsx_runtime.JSX.Element;
+declare function DxcInset({ bottom, children, horizontal, left, right, space, top, vertical }: Props$j): react_jsx_runtime.JSX.Element;
 
 type LinkProps = {
     /**
@@ -2092,7 +2028,7 @@ type TabProps$1 = {
      */
     children: string;
 };
-type Props$j = {
+type Props$i = {
     /**
      * Whether the icon should appear above or to the left of the label.
      */
@@ -2108,11 +2044,11 @@ type Props$j = {
 };
 
 declare const DxcNavTabs: {
-    ({ iconPosition, tabIndex, children }: Props$j): JSX.Element;
+    ({ iconPosition, tabIndex, children }: Props$i): JSX.Element;
     Tab: react.ForwardRefExoticComponent<TabProps$1 & react.RefAttributes<HTMLAnchorElement>>;
 };
 
-type Props$i = {
+type Props$h = {
     /**
      * Text to be placed above the number.
      */
@@ -2239,9 +2175,9 @@ type Props$i = {
     showControls?: boolean;
 };
 
-declare const DxcNumberInput: react.ForwardRefExoticComponent<Props$i & react.RefAttributes<HTMLDivElement>>;
+declare const DxcNumberInput: react.ForwardRefExoticComponent<Props$h & react.RefAttributes<HTMLDivElement>>;
 
-type Props$h = {
+type Props$g = {
     /**
      * Number of the current selected page.
      */
@@ -2279,13 +2215,13 @@ type Props$h = {
     tabIndex?: number;
 };
 
-declare const DxcPaginator: ({ currentPage, itemsPerPage, itemsPerPageOptions, totalItems, showGoToPage, onPageChange, itemsPerPageFunction, tabIndex, }: Props$h) => JSX.Element;
+declare const DxcPaginator: ({ currentPage, itemsPerPage, itemsPerPageOptions, totalItems, showGoToPage, onPageChange, itemsPerPageFunction, tabIndex, }: Props$g) => JSX.Element;
 
 declare function DxcParagraph({ children }: {
     children: ReactNode;
 }): react_jsx_runtime.JSX.Element;
 
-type Props$g = {
+type Props$f = {
     /**
      * Text to be placed above the password input.
      */
@@ -2389,7 +2325,7 @@ type Props$g = {
     ariaLabel?: string;
 };
 
-declare const DxcPasswordInput: react.ForwardRefExoticComponent<Props$g & react.RefAttributes<HTMLDivElement>>;
+declare const DxcPasswordInput: react.ForwardRefExoticComponent<Props$f & react.RefAttributes<HTMLDivElement>>;
 
 type Size$1 = {
     top?: Space$1;
@@ -2397,7 +2333,7 @@ type Size$1 = {
     left?: Space$1;
     right?: Space$1;
 };
-type Props$f = {
+type Props$e = {
     /**
      * Text to be placed above the progress bar.
      */
@@ -2431,7 +2367,7 @@ type Props$f = {
     ariaLabel?: string;
 };
 
-declare const DxcProgressBar: ({ label, helperText, overlay, value, showValue, margin, ariaLabel, }: Props$f) => JSX.Element;
+declare const DxcProgressBar: ({ label, helperText, overlay, value, showValue, margin, ariaLabel, }: Props$e) => JSX.Element;
 
 type Link = {
     /**
@@ -2443,7 +2379,7 @@ type Link = {
      */
     links?: Link[];
 };
-type Props$e = {
+type Props$d = {
     /**
      * Title of the quick nav component.
      */
@@ -2454,9 +2390,9 @@ type Props$e = {
     links: Link[];
 };
 
-declare const DxcQuickNav: ({ title, links }: Props$e) => JSX.Element;
+declare function DxcQuickNav({ links, title }: Props$d): react_jsx_runtime.JSX.Element;
 
-type RadioOption = {
+type Option$1 = {
     /**
      * Label of the option placed next to the radio input.
      */
@@ -2474,26 +2410,39 @@ type RadioOption = {
 };
 type RadioGroupProps = {
     /**
-     * Text to be placed above the radio group.
+     * Specifies a string to be used as the name for the radio group when no `label` is provided.
      */
-    label?: string;
+    ariaLabel?: string;
     /**
-     * Name attribute of the input element. This attribute will allow users
-     * to find the component's value during the submit event.
+     * Initial value of the radio group, only when it is uncontrolled.
      */
-    name?: string;
+    defaultValue?: string;
+    /**
+     * If true, the component will be disabled.
+     */
+    disabled?: boolean;
+    /**
+     * If it is a defined value and also a truthy string, the component will
+     * change its appearance, showing the error below the radio group. If the
+     * defined value is an empty string, it will reserve a space below the
+     * component for a future error, but it would not change its look. In
+     * case of being undefined or null, both the appearance and the space for
+     * the error message would not be modified.
+     */
+    error?: string;
     /**
      * Helper text to be placed above the radio group.
      */
     helperText?: string;
     /**
-     * An array of objects representing the selectable options.
+     * Text to be placed above the radio group.
      */
-    options: RadioOption[];
+    label?: string;
     /**
-     * If true, the component will be disabled.
+     * Name attribute of the input element. This attribute will allow users
+     * to find the component's value during the submit event.
      */
-    disabled?: boolean;
+    name?: string;
     /**
      * If true, the radio group will be optional, showing
      * (Optional) next to the label and adding a default last
@@ -2507,28 +2456,9 @@ type RadioGroupProps = {
      */
     optionalItemLabel?: string;
     /**
-     * If true, the component will not be mutable, meaning the user can not edit the control.
-     */
-    readOnly?: boolean;
-    /**
-     * Sets the orientation of the options within the radio group.
-     */
-    stacking?: "row" | "column";
-    /**
-     * Initial value of the radio group, only when it is uncontrolled.
-     */
-    defaultValue?: string;
-    /**
-     * Value of the radio group. If undefined, the component will be
-     * uncontrolled and the value will be managed internally by the
-     * component.
-     */
-    value?: string;
-    /**
-     * This function will be called when the user chooses an option. The new
-     * value will be passed to this function.
+     * An array of objects representing the selectable options.
      */
-    onChange?: (value: string) => void;
+    options: Option$1[];
     /**
      * This function will be called when the radio group loses the focus. An
      * object including the value and the error will be passed to this
@@ -2539,22 +2469,28 @@ type RadioGroupProps = {
         error?: string;
     }) => void;
     /**
-     * If it is a defined value and also a truthy string, the component will
-     * change its appearance, showing the error below the radio group. If the
-     * defined value is an empty string, it will reserve a space below the
-     * component for a future error, but it would not change its look. In
-     * case of being undefined or null, both the appearance and the space for
-     * the error message would not be modified.
+     * This function will be called when the user chooses an option. The new
+     * value will be passed to this function.
      */
-    error?: string;
+    onChange?: (value: string) => void;
+    /**
+     * If true, the component will not be mutable, meaning the user can not edit the control.
+     */
+    readOnly?: boolean;
+    /**
+     * Sets the orientation of the options within the radio group.
+     */
+    stacking?: "row" | "column";
     /**
      * Value of the tabindex attribute.
      */
     tabIndex?: number;
     /**
-     * Specifies a string to be used as the name for the radio group when no `label` is provided.
+     * Value of the radio group. If undefined, the component will be
+     * uncontrolled and the value will be managed internally by the
+     * component.
      */
-    ariaLabel?: string;
+    value?: string;
 };
 
 declare const DxcRadioGroup: react.ForwardRefExoticComponent<RadioGroupProps & react.RefAttributes<HTMLDivElement>>;
@@ -2650,23 +2586,13 @@ type NonPaginatedProps = CommonProps$3 & {
      */
     itemsPerPageFunction?: never;
 };
-type Props$d = PaginatedProps | NonPaginatedProps;
+type Props$c = PaginatedProps | NonPaginatedProps;
 
 declare const DxcResultsetTable: {
-    ({ columns, rows, hidePaginator, showGoToPage, itemsPerPage, itemsPerPageOptions, itemsPerPageFunction, margin, tabIndex, mode, }: Props$d): JSX.Element;
-    ActionsCell: ({ actions }: ActionCellsPropsType) => JSX.Element;
+    ({ columns, hidePaginator, itemsPerPage, itemsPerPageFunction, itemsPerPageOptions, margin, mode, rows, showGoToPage, tabIndex, }: Props$c): react_jsx_runtime.JSX.Element;
+    ActionsCell: ({ actions }: ActionsCellPropsType) => react_jsx_runtime.JSX.Element;
 };
 
-type ListOptionGroupType = {
-    /**
-     * Label of the group to be shown in the select's listbox.
-     */
-    label: string;
-    /**
-     * List of the grouped options.
-     */
-    options: ListOptionType[];
-};
 type ListOptionType = {
     /**
      * Element used as the icon that will be placed before the option label.
@@ -2686,6 +2612,16 @@ type ListOptionType = {
      */
     value: string;
 };
+type ListOptionGroupType = {
+    /**
+     * Label of the group to be shown in the select's listbox.
+     */
+    label: string;
+    /**
+     * List of the grouped options.
+     */
+    options: ListOptionType[];
+};
 type CommonProps$2 = {
     /**
      * Text to be placed above the select.
@@ -2755,6 +2691,10 @@ type CommonProps$2 = {
     ariaLabel?: string;
 };
 type SingleSelect = CommonProps$2 & {
+    /**
+     * Enables users to select multiple items from the list.
+     */
+    enableSelectAll?: never;
     /**
      * If true, the select component will support multiple selected options.
      * In that case, value will be an array of strings with each selected
@@ -2791,6 +2731,10 @@ type SingleSelect = CommonProps$2 & {
     }) => void;
 };
 type MultipleSelect = CommonProps$2 & {
+    /**
+     * Enables users to select multiple items from the list.
+     */
+    enableSelectAll?: boolean;
     /**
      * If true, the select component will support multiple selected options.
      * In that case, value will be an array of strings with each selected
@@ -2826,59 +2770,57 @@ type MultipleSelect = CommonProps$2 & {
         error?: string;
     }) => void;
 };
-type Props$c = SingleSelect | MultipleSelect;
+type Props$b = SingleSelect | MultipleSelect;
 
-declare const DxcSelect: react.ForwardRefExoticComponent<Props$c & react.RefAttributes<HTMLDivElement>>;
+declare const DxcSelect: react.ForwardRefExoticComponent<Props$b & react.RefAttributes<HTMLDivElement>>;
 
-type Props$b = {
-    /**
-     * Text to be placed above the slider.
-     */
-    label?: string;
+type Props$a = {
     /**
-     * Name attribute of the input element.
+     * Specifies a string to be used as the name for the slider element when no `label` is provided.
      */
-    name?: string;
+    ariaLabel?: string;
     /**
      * Initial value of the slider, only when it is uncontrolled.
      */
     defaultValue?: number;
     /**
-     * The selected value. If undefined, the component will be uncontrolled and the value will be managed internally by the component.
+     * If true, the component will be disabled.
      */
-    value?: number;
+    disabled?: boolean;
     /**
      * Helper text to be placed above the slider.
      */
     helperText?: string;
     /**
-     * The minimum value available for selection.
+     * Text to be placed above the slider.
      */
-    minValue?: number;
+    label?: string;
     /**
-     * The maximum value available for selection.
+     * This function will be used to format the labels displayed next to the slider.
+     * The value will be passed as parameter and the function must return the formatted value.
      */
-    maxValue?: number;
+    labelFormatCallback?: (value: number) => string;
     /**
-     * The step interval between values available for selection.
+     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
+     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
      */
-    step?: number;
+    margin?: Space$1 | Margin;
     /**
-     * Whether the min/max value labels should be displayed next to the slider
+     * Whether the marks between each step should be shown or not.
      */
-    showLimitsValues?: boolean;
+    marks?: boolean;
     /**
-     * Whether the input element for displaying/controlling the slider value should be displayed next to the slider.
+     * The maximum value available for selection.
      */
-    showInput?: boolean;
+    maxValue?: number;
     /**
-     * If true, the component will be disabled.
+     * The minimum value available for selection.
      */
-    disabled?: boolean;
+    minValue?: number;
     /**
-     * Whether the marks between each step should be shown or not.
+     * Name attribute of the input element.
      */
-    marks?: boolean;
+    name?: string;
     /**
      * This function will be called when the slider changes its value, as it's being dragged.
      * The new value will be passed as a parameter when this function is executed.
@@ -2890,61 +2832,68 @@ type Props$b = {
      */
     onDragEnd?: (value: number) => void;
     /**
-     * This function will be used to format the labels displayed next to the slider.
-     * The value will be passed as parameter and the function must return the formatted value.
+     * Whether the input element for displaying/controlling the slider value should be displayed next to the slider.
      */
-    labelFormatCallback?: (value: number) => string;
+    showInput?: boolean;
     /**
-     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
-     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
+     * Whether the min/max value labels should be displayed next to the slider
      */
-    margin?: Space$1 | Margin;
+    showLimitsValues?: boolean;
     /**
      * Size of the component.
      */
     size?: "medium" | "large" | "fillParent";
     /**
-     * Specifies a string to be used as the name for the slider element when no `label` is provided.
+     * The step interval between values available for selection.
      */
-    ariaLabel?: string;
+    step?: number;
+    /**
+     * The selected value. If undefined, the component will be uncontrolled and the value will be managed internally by the component.
+     */
+    value?: number;
 };
 
-declare const DxcSlider: react.ForwardRefExoticComponent<Props$b & react.RefAttributes<HTMLDivElement>>;
+declare const DxcSlider: react.ForwardRefExoticComponent<Props$a & react.RefAttributes<HTMLDivElement>>;
 
-type Props$a = {
+type Props$9 = {
     /**
-     * Text to be placed inside the spinner.
+     * Specifies a string to be used as the name for the spinner element when no `label` is provided or the `mode` is set to small.
      */
-    label?: string;
+    ariaLabel?: string;
     /**
-     * The value of the progress indicator. If it's received the
-     * component is determinate, otherwise is indeterminate.
+     * If true, the color is inherited from the closest parent with a defined color. This allows users to adapt the spinner
+     * to the semantic color of the use case in which it is used.
      */
-    value?: number;
+    inheritColor?: boolean;
     /**
-     * If true, the value is displayed inside the spinner..
+     * Text to be placed inside the spinner.
      */
-    showValue?: boolean;
+    label?: string;
+    /**
+     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
+     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
+     */
+    margin?: Space$1 | Margin;
     /**
      * Available modes of the spinner.
      */
     mode?: "large" | "small" | "overlay";
     /**
-     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
-     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
+     * If true, the value is displayed inside the spinner..
      */
-    margin?: Space$1 | Margin;
+    showValue?: boolean;
     /**
-     * Specifies a string to be used as the name for the spinner element when no `label` is provided or the `mode` is set to small.
+     * The value of the progress indicator. If it's received the
+     * component is determinate, otherwise is indeterminate.
      */
-    ariaLabel?: string;
+    value?: number;
 };
 
-declare const DxcSpinner: ({ label, value, showValue, mode, margin, ariaLabel, }: Props$a) => JSX.Element;
+declare const DxcSpinner: ({ ariaLabel, inheritColor, label, margin, mode, showValue, value, }: Props$9) => react_jsx_runtime.JSX.Element;
 
 type Mode = "default" | "info" | "success" | "warning" | "error";
 type Size = "small" | "medium" | "large";
-type Props$9 = {
+type Props$8 = {
     /**
      * It will define the color of the light based on its semantic meaning.
      */
@@ -2959,23 +2908,26 @@ type Props$9 = {
     size?: Size;
 };
 
-declare const DxcStatusLight: ({ mode, label, size }: Props$9) => JSX.Element;
+declare function DxcStatusLight({ label, mode, size }: Props$8): react_jsx_runtime.JSX.Element;
 
-type Props$8 = {
+type Props$7 = {
     /**
-     * Initial state of the switch, only when it is uncontrolled.
+     * Specifies a string to be used as the name for the switch element when no `label` is provided.
      */
-    defaultChecked?: boolean;
+    ariaLabel?: string;
     /**
      * If true, the component is checked. If undefined, the component will be uncontrolled
      * and the checked attribute will be managed internally by the component.
      */
     checked?: boolean;
     /**
-     * Will be passed to the value attribute of the html input element. When inside a form,
-     * this value will be only submitted if the switch is checked.
+     * Initial state of the switch, only when it is uncontrolled.
      */
-    value?: string;
+    defaultChecked?: boolean;
+    /**
+     * If true, the component will be disabled.
+     */
+    disabled?: boolean;
     /**
      * Text to be placed next to the switch.
      */
@@ -2985,13 +2937,14 @@ type Props$8 = {
      */
     labelPosition?: "before" | "after";
     /**
-     * Name attribute of the input element.
+     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
+     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
      */
-    name?: string;
+    margin?: Space$1 | Margin;
     /**
-     * If true, the component will be disabled.
+     * Name attribute of the input element.
      */
-    disabled?: boolean;
+    name?: string;
     /**
      * This function will be called when the user changes the state of the switch.
      * The new value of the checked attribute will be passed as a parameter.
@@ -3001,11 +2954,6 @@ type Props$8 = {
      * If true, the component will display '(Optional)' next to the label.
      */
     optional?: boolean;
-    /**
-     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
-     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
-     */
-    margin?: Space$1 | Margin;
     /**
      * Size of the component.
      */
@@ -3015,16 +2963,17 @@ type Props$8 = {
      */
     tabIndex?: number;
     /**
-     * Specifies a string to be used as the name for the switch element when no `label` is provided.
+     * Will be passed to the value attribute of the html input element. When inside a form,
+     * this value will be only submitted if the switch is checked.
      */
-    ariaLabel?: string;
+    value?: string;
 };
 
-declare const DxcSwitch: react.ForwardRefExoticComponent<Props$8 & react.RefAttributes<HTMLDivElement>>;
+declare const DxcSwitch: react.ForwardRefExoticComponent<Props$7 & react.RefAttributes<HTMLDivElement>>;
 
 declare const DxcTable: {
-    ({ children, margin, mode }: Props$u): JSX.Element;
-    ActionsCell: ({ actions }: ActionCellsPropsType) => JSX.Element;
+    ({ children, margin, mode }: Props$t): react_jsx_runtime.JSX.Element;
+    ActionsCell: ({ actions }: ActionsCellPropsType) => react_jsx_runtime.JSX.Element;
 };
 
 type TabCommonProps = {
@@ -3041,7 +2990,7 @@ type TabCommonProps = {
      */
     notificationNumber?: boolean | number;
 };
-type TabLabelProps = TabCommonProps & {
+type TabLabelProps = {
     /**
      * Tab label.
      */
@@ -3051,7 +3000,7 @@ type TabLabelProps = TabCommonProps & {
      */
     icon?: string | SVG;
 };
-type TabIconProps = TabCommonProps & {
+type TabIconProps = {
     /**
      * Tab label.
      */
@@ -3064,52 +3013,56 @@ type TabIconProps = TabCommonProps & {
 type TabProps = {
     defaultActive?: boolean;
     active?: boolean;
-    icon?: string | SVG;
-    label: string;
     title?: string;
+    tabId?: string;
     disabled?: boolean;
     notificationNumber?: boolean | number;
     children: ReactNode;
     onClick?: () => void;
     onHover?: () => void;
-};
+} & (TabLabelProps | TabIconProps);
 type LegacyProps = {
     /**
-     * Initially active tab, only when it is uncontrolled.
-     */
-    defaultActiveTabIndex?: number;
-    /**
+     * @deprecated This prop is deprecated and will be removed in future versions. Use the children prop instead.
      * The index of the active tab. If undefined, the component will be
      * uncontrolled and the active tab will be managed internally by the component.
      */
     activeTabIndex?: number;
     /**
-     * An array of objects representing the tabs.
+     * @deprecated This prop is deprecated and will be removed in future versions.
+     * Initially active tab, only when it is uncontrolled.
      */
-    tabs?: (TabLabelProps | TabIconProps)[];
+    defaultActiveTabIndex?: number;
     /**
      * Whether the icon should appear above or to the left of the label.
      */
     iconPosition?: "top" | "left";
     /**
+     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
+     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
+     */
+    margin?: Space$1 | Margin;
+    /**
+     * @deprecated This prop is deprecated and will be removed in future versions.
      * This function will be called when the user clicks on a tab. The index of the
      * clicked tab will be passed as a parameter.
      */
     onTabClick?: (index: number) => void;
     /**
+     * @deprecated This prop is deprecated and will be removed in future versions.
      * This function will be called when the user hovers a tab.The index of the
      * hovered tab will be passed as a parameter.
      */
     onTabHover?: (index: number | null) => void;
-    /**
-     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
-     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
-     */
-    margin?: Space$1 | Margin;
     /**
      * Value of the tabindex attribute applied to each tab.
      */
     tabIndex?: number;
+    /**
+     * @deprecated This prop is deprecated and will be removed in future versions.
+     * An array of objects representing the tabs.
+     */
+    tabs?: (TabCommonProps & (TabLabelProps | TabIconProps))[];
 };
 type NewProps = {
     /**
@@ -3130,129 +3083,87 @@ type NewProps = {
      */
     children?: ReactNode;
 };
-type Props$7 = LegacyProps & NewProps;
+type Props$6 = LegacyProps & NewProps;
 
 declare const DxcTabs: {
-    ({ defaultActiveTabIndex, activeTabIndex, tabs, onTabClick, onTabHover, margin, iconPosition, tabIndex, children, }: Props$7): false | react_jsx_runtime.JSX.Element;
+    ({ activeTabIndex, children, defaultActiveTabIndex, iconPosition, margin, onTabClick, onTabHover, tabIndex, tabs, }: Props$6): false | react_jsx_runtime.JSX.Element;
     Tab: react.ForwardRefExoticComponent<TabProps & react.RefAttributes<HTMLButtonElement>>;
 };
 
-type TagCommonProps = {
-    /**
-     * If defined, the tag will be displayed as an anchor, using this prop as "href".
-     * Component will show some visual feedback on hover.
-     */
-    linkHref?: string;
-    /**
-     * If defined, the tag will be displayed as a button. This function will
-     * be called when the user clicks the tag. Component will show some
-     * visual feedback on hover.
-     */
-    onClick?: () => void;
-    /**
-     * Background color of the icon section of the tag.
-     */
-    iconBgColor?: string;
-    /**
-     * Whether the label should appear after or before the icon.
-     */
-    labelPosition?: "before" | "after";
-    /**
-     * If true, the page is opened in a new browser tab.
-     */
-    newWindow?: boolean;
-    /**
-     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
-     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
-     */
-    margin?: Space$1 | Margin;
-    /**
-     * Size of the component.
-     */
-    size?: "small" | "medium" | "large" | "fillParent" | "fitContent";
-    /**
-     * Value of the tabindex attribute.
-     */
-    tabIndex?: number;
-};
-type TagLabelProps = TagCommonProps & {
-    /**
-     * Material Symbol name or SVG element used as the icon that will be placed next to the label.
-     */
-    icon?: string | SVG;
-    /**
-     * Text to be placed next inside the tag.
-     */
-    label: string;
-};
-type TagIconProps = TagCommonProps & {
-    /**
-     * Material Symbol name or SVG element used as the icon that will be placed next to the label.
-     */
-    icon: string | SVG;
-    /**
-     * Text to be placed next inside the tag.
-     */
-    label?: string;
-};
-type Props$6 = TagLabelProps | TagIconProps;
-
-/**
- * @deprecated
- */
-declare const DxcTag: ({ icon, label, linkHref, onClick, iconBgColor, labelPosition, newWindow, margin, size, tabIndex, }: Props$6) => JSX.Element;
-
 type Props$5 = {
     /**
-     * Text to be placed above the textarea.
+     * Specifies a string to be used as the name for the textarea element when no `label` is provided.
      */
-    label?: string;
+    ariaLabel?: string;
     /**
-     * Name attribute of the textarea element.
+     * HTML autocomplete attribute. Lets the user specify if any permission the user agent has to provide automated assistance in filling out the textarea value.
+     * Its value must be one of all the possible values of the HTML autocomplete attribute: 'on', 'off', 'email', 'username', 'new-password', ...
      */
-    name?: string;
+    autocomplete?: string;
+    /**
+     * If true, the component will be disabled.
+     */
+    disabled?: boolean;
     /**
      * Initial value of the textarea, only when it is uncontrolled.
      */
     defaultValue?: string;
     /**
-     * Value of the textarea. If undefined, the component will be uncontrolled and the value will be managed internally.
+     * If it is a defined value and also a truthy string, the component will
+     * change its appearance, showing the error below the textarea. If the
+     * defined value is an empty string, it will reserve a space below the
+     * component for a future error, but it would not change its look. In
+     * case of being undefined or null, both the appearance and the space for
+     * the error message would not be modified.
      */
-    value?: string;
+    error?: string;
     /**
      * Helper text to be placed above the textarea.
      */
     helperText?: string;
     /**
-     * Text to be put as placeholder of the textarea.
+     * Text to be placed above the textarea.
      */
-    placeholder?: string;
+    label?: string;
     /**
-     * If true, the component will be disabled.
+     * Specifies the maximum length allowed by the textarea.
+     * This will be checked both when the textarea loses the
+     * focus and while typing within it. If the string entered does not
+     * comply the maximum length, the onBlur and onChange functions will be called
+     * with the current value and an internal error informing that the value
+     * length does not comply the specified range. If a valid length is
+     * reached, the error parameter of both events will not be defined.
      */
-    disabled?: boolean;
+    maxLength?: number;
     /**
-     * If true, the component will not be mutable, meaning the user can not edit the control.
+     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
+     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
      */
-    readOnly?: boolean;
+    margin?: Space$1 | Margin;
     /**
-     * If true, the textarea will be optional, showing '(Optional)'
-     * next to the label. Otherwise, the field will be considered required
-     * and an error will be passed as a parameter to the OnBlur and onChange functions
-     * when it has not been filled.
+     * Specifies the minimum length allowed by the textarea.
+     * This will be checked both when the textarea loses the
+     * focus and while typing within it. If the string entered does not
+     * comply the minimum length, the onBlur and onChange functions will be called
+     * with the current value and an internal error informing that the value
+     * length does not comply the specified range. If a valid length is
+     * reached, the error parameter of both events will not be defined.
      */
-    optional?: boolean;
+    minLength?: number;
     /**
-     * Defines the textarea's ability to resize vertically. It can be:
-     *    - 'auto': The textarea grows or shrinks automatically in order to fit the content.
-     *    - 'manual': The height of the textarea is enabled to be manually modified.
-     *    - 'none': The textarea has a fixed height and can't be modified.
+     * Name attribute of the textarea element.
      */
-    verticalGrow?: "auto" | "manual" | "none";
+    name?: string;
     /**
-     * Number of rows of the textarea.
+     * This function will be called when the textarea loses the focus. An
+     * object including the textarea value and the error (if the value entered
+     * is not valid) will be passed to this function. If there is no error,
+     * error will not be defined.
      */
-    rows?: number;
+    onBlur?: (val: {
+        value: string;
+        error?: string;
+    }) => void;
     /**
      * This function will be called when the user types within the textarea.
      * An object including the current value and the error (if the value
@@ -3264,24 +3175,12 @@ type Props$5 = {
         error?: string;
     }) => void;
     /**
-     * This function will be called when the textarea loses the focus. An
-     * object including the textarea value and the error (if the value entered
-     * is not valid) will be passed to this function. If there is no error,
-     * error will not be defined.
-     */
-    onBlur?: (val: {
-        value: string;
-        error?: string;
-    }) => void;
-    /**
-     * If it is a defined value and also a truthy string, the component will
-     * change its appearance, showing the error below the textarea. If the
-     * defined value is an empty string, it will reserve a space below the
-     * component for a future error, but it would not change its look. In
-     * case of being undefined or null, both the appearance and the space for
-     * the error message would not be modified.
+     * If true, the textarea will be optional, showing '(Optional)'
+     * next to the label. Otherwise, the field will be considered required
+     * and an error will be passed as a parameter to the OnBlur and onChange functions
+     * when it has not been filled.
      */
-    error?: string;
+    optional?: boolean;
     /**
      * Regular expression that defines the valid format allowed by the
      * textarea. This will be checked both when the textarea loses the focus
@@ -3293,35 +3192,17 @@ type Props$5 = {
      */
     pattern?: string;
     /**
-     * Specifies the minimum length allowed by the textarea.
-     * This will be checked both when the textarea loses the
-     * focus and while typing within it. If the string entered does not
-     * comply the minimum length, the onBlur and onChange functions will be called
-     * with the current value and an internal error informing that the value
-     * length does not comply the specified range. If a valid length is
-     * reached, the error parameter of both events will not be defined.
-     */
-    minLength?: number;
-    /**
-     * Specifies the maximum length allowed by the textarea.
-     * This will be checked both when the textarea loses the
-     * focus and while typing within it. If the string entered does not
-     * comply the maximum length, the onBlur and onChange functions will be called
-     * with the current value and an internal error informing that the value
-     * length does not comply the specified range. If a valid length is
-     * reached, the error parameter of both events will not be defined.
+     * Text to be put as placeholder of the textarea.
      */
-    maxLength?: number;
+    placeholder?: string;
     /**
-     * HTML autocomplete attribute. Lets the user specify if any permission the user agent has to provide automated assistance in filling out the textarea value.
-     * Its value must be one of all the possible values of the HTML autocomplete attribute: 'on', 'off', 'email', 'username', 'new-password', ...
+     * If true, the component will not be mutable, meaning the user can not edit the control.
      */
-    autocomplete?: string;
+    readOnly?: boolean;
     /**
-     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
-     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
+     * Number of rows of the textarea.
      */
-    margin?: Space$1 | Margin;
+    rows?: number;
     /**
      * Size of the component.
      */
@@ -3331,9 +3212,16 @@ type Props$5 = {
      */
     tabIndex?: number;
     /**
-     * Specifies a string to be used as the name for the textarea element when no `label` is provided.
+     * Value of the textarea. If undefined, the component will be uncontrolled and the value will be managed internally.
      */
-    ariaLabel?: string;
+    value?: string;
+    /**
+     * Defines the textarea's ability to resize vertically. It can be:
+     *    - 'auto': The textarea grows or shrinks automatically in order to fit the content.
+     *    - 'manual': The height of the textarea is enabled to be manually modified.
+     *    - 'none': The textarea has a fixed height and can't be modified.
+     */
+    verticalGrow?: "auto" | "manual" | "none";
 };
 
 declare const DxcTextarea: react.ForwardRefExoticComponent<Props$5 & react.RefAttributes<HTMLDivElement>>;
@@ -3547,28 +3435,28 @@ type SemanticToast = CommonProps$1 & {
     hideSemanticIcon?: boolean;
 };
 type ToastsQueuePropsType = {
+    /**
+     * Tree of components from which the useToast hook can be triggered.
+     */
+    children: ReactNode;
     /**
      * Duration in milliseconds before a toast automatically hides itself.
      * The range goes from 3000ms to 5000ms, any other value will not be taken into consideration.
      */
     duration?: number;
-    /**
-     * Tree of components from which the useToast hook can be triggered.
-     */
-    children: ReactNode;
 };
 
-declare const DxcToastsQueue: ({ children, duration }: ToastsQueuePropsType) => react_jsx_runtime.JSX.Element;
+declare function DxcToastsQueue({ children, duration }: ToastsQueuePropsType): react_jsx_runtime.JSX.Element;
 
 type OptionIcon = {
-    /**
-     * String with the option display value.
-     */
-    label?: never;
     /**
      * Material Symbols icon or SVG element. Icon and label can't be used at same time.
      */
     icon: string | SVG;
+    /**
+     * String with the option display value.
+     */
+    label?: never;
     /**
      * Value for the HTML properties title and aria-label.
      * When a label is defined, this prop can not be use.
@@ -3576,14 +3464,14 @@ type OptionIcon = {
     title: string;
 };
 type OptionLabel = {
-    /**
-     * String with the option display value.
-     */
-    label: string;
     /**
      * Material Symbols icon or SVG element. Icon and label can't be used at same time.
      */
     icon?: string | SVG;
+    /**
+     * String with the option display value.
+     */
+    label: string;
     /**
      * Value for the HTML properties title and aria-label.
      * When a label is defined, this prop can not be use.
@@ -3591,6 +3479,10 @@ type OptionLabel = {
     title?: never;
 };
 type Option = {
+    /**
+     * If true, the option will be disabled.
+     */
+    disabled?: boolean;
     /**
      * Number with the option inner value.
      */
@@ -3598,88 +3490,80 @@ type Option = {
 } & (OptionIcon | OptionLabel);
 type CommonProps = {
     /**
-     * Text to be placed above the component.
-     */
-    label?: string;
-    /**
-     * Helper text to be placed above the component.
-     */
-    helperText?: string;
-    /**
-     * If true, the component will be disabled.
+     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
+     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
      */
-    disabled?: boolean;
+    margin?: Space$1 | Margin;
     /**
      * An array of objects representing the selectable options.
      */
     options: Option[];
     /**
-     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
-     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
+     * The orientation of the toggle group.
      */
-    margin?: Space$1 | Margin;
+    orientation?: "horizontal" | "vertical";
     /**
      * Value of the tabindex.
      */
     tabIndex?: number;
 };
-type SingleSelectionToggleGroup = CommonProps & {
+type MultipleSelectionToggleGroup = {
+    /**
+     * The array of keys with the initially selected values.
+     */
+    defaultValue?: number[];
     /**
      * If true, the toggle group will support multiple selection. In that case, value must be an array of numbers with the keys of the selected values.
      */
-    multiple?: false;
+    multiple: true;
     /**
-     * The key of the initially selected value.
+     * This function will be called every time the selection changes. An array with the key of
+     * the selected values will be passed as a parameter to this function.
      */
-    defaultValue?: number;
+    onChange?: (optionIndex: number[]) => void;
     /**
-     * The key of the selected value. If the component allows multiple selection, value must be an array.
+     * An array with the keys of the selected values.
      * If undefined, the component will be uncontrolled and the value will be managed internally by the component.
      */
-    value?: number;
+    value?: number[];
+};
+type SingleSelectionToggleGroup = {
     /**
-     * This function will be called every time the selection changes. The number with the key of the selected
-     * value will be passed as a parameter to this function.
+     * The key of the initially selected value.
      */
-    onChange?: (optionIndex: number) => void;
-};
-type MultipleSelectionToggleGroup = CommonProps & {
+    defaultValue?: number;
     /**
      * If true, the toggle group will support multiple selection. In that case, value must be an array of numbers with the keys of the selected values.
      */
-    multiple: true;
+    multiple?: false;
     /**
-     * The array of keys with the initially selected values.
+     * This function will be called every time the selection changes. The number with the key of the selected
+     * value will be passed as a parameter to this function.
      */
-    defaultValue?: number[];
+    onChange?: (optionIndex: number) => void;
     /**
-     * An array with the keys of the selected values.
+     * The key of the selected value. If the component allows multiple selection, value must be an array.
      * If undefined, the component will be uncontrolled and the value will be managed internally by the component.
      */
-    value?: number[];
-    /**
-     * This function will be called every time the selection changes. An array with the key of
-     * the selected values will be passed as a parameter to this function.
-     */
-    onChange?: (optionIndex: number[]) => void;
+    value?: number;
 };
-type Props$3 = SingleSelectionToggleGroup | MultipleSelectionToggleGroup;
+type Props$3 = CommonProps & (MultipleSelectionToggleGroup | SingleSelectionToggleGroup);
 
-declare const DxcToggleGroup: ({ label, helperText, defaultValue, value, onChange, disabled, options, margin, multiple, tabIndex, }: Props$3) => JSX.Element;
+declare function DxcToggleGroup({ defaultValue, margin, multiple, onChange, options, orientation, tabIndex, value, }: Props$3): react_jsx_runtime.JSX.Element;
 
 type Props$2 = {
     /**
-     * Preferred position for displaying the tooltip. It may adjust automatically based on available space.
+     * Content in which the Tooltip will be displayed.
      */
-    position?: "bottom" | "top" | "left" | "right";
+    children: ReactNode;
     /**
      * Text to be displayed inside the tooltip.
      */
     label?: string;
     /**
-     * Content in which the Tooltip will be displayed.
+     * Preferred position for displaying the tooltip. It may adjust automatically based on available space.
      */
-    children: ReactNode;
+    position?: "bottom" | "top" | "left" | "right";
 };
 
 declare function DxcTooltip(props: Props$2): react_jsx_runtime.JSX.Element;
@@ -3758,7 +3642,7 @@ type Props = {
     tabIndex?: number;
 };
 
-declare const DxcWizard: ({ mode, defaultCurrentStep, currentStep, onStepClick, steps, margin, tabIndex, }: Props) => JSX.Element;
+declare function DxcWizard({ currentStep, defaultCurrentStep, margin, mode, onStepClick, steps, tabIndex, }: Props): react_jsx_runtime.JSX.Element;
 
 declare const componentTokens: {
     accordion: {
@@ -4804,23 +4688,6 @@ declare const componentTokens: {
         focusOutline: string;
         scrollButtonsWidth: string;
     };
-    tag: {
-        fontFamily: string;
-        fontColor: string;
-        fontSize: string;
-        fontStyle: string;
-        fontWeight: string;
-        labelPaddingTop: string;
-        labelPaddingBottom: string;
-        labelPaddingLeft: string;
-        labelPaddingRight: string;
-        height: string;
-        iconColor: string;
-        iconSectionWidth: string;
-        iconHeight: string;
-        iconWidth: string;
-        focusColor: string;
-    };
     textarea: {
         fontFamily: string;
         enabledBorderColor: string;
@@ -5168,10 +5035,6 @@ type OpinionatedTheme = {
     tabs: {
         baseColor: string;
     };
-    tag: {
-        fontColor: string;
-        iconColor: string;
-    };
     textarea: {
         fontColor: string;
         hoverBorderColor: string;
@@ -5262,9 +5125,10 @@ declare const defaultTranslatedComponentLabels: {
         optionalItemLabelDefault: string;
     };
     select: {
-        noMatchesErrorMessage: string;
         actionClearSelectionTitle: string;
         actionClearSearchTitle: string;
+        noMatchesErrorMessage: string;
+        selectAllLabel: string;
     };
     tabs: {
         scrollLeft: string;
@@ -6332,23 +6196,6 @@ declare const HalstackContext: react.Context<{
         focusOutline: string;
         scrollButtonsWidth: string;
     };
-    tag: {
-        fontFamily: string;
-        fontColor: string;
-        fontSize: string;
-        fontStyle: string;
-        fontWeight: string;
-        labelPaddingTop: string;
-        labelPaddingBottom: string;
-        labelPaddingLeft: string;
-        labelPaddingRight: string;
-        height: string;
-        iconColor: string;
-        iconSectionWidth: string;
-        iconHeight: string;
-        iconWidth: string;
-        focusColor: string;
-    };
     textarea: {
         fontFamily: string;
         enabledBorderColor: string;
@@ -6634,9 +6481,10 @@ declare const HalstackLanguageContext: react.Context<{
         optionalItemLabelDefault: string;
     };
     select: {
-        noMatchesErrorMessage: string;
         actionClearSelectionTitle: string;
         actionClearSearchTitle: string;
+        noMatchesErrorMessage: string;
+        selectAllLabel: string;
     };
     tabs: {
         scrollLeft: string;
@@ -6659,7 +6507,7 @@ type HalstackProviderPropsType = {
 };
 declare const HalstackProvider: ({ theme, advancedTheme, labels, children }: HalstackProviderPropsType) => JSX.Element;
 
-declare const useToast: () => {
+declare function useToast(): {
     default: (toast: DefaultToast) => (() => void) | undefined;
     success: (toast: SemanticToast) => (() => void) | undefined;
     warning: (toast: SemanticToast) => (() => void) | undefined;
@@ -6667,4 +6515,4 @@ declare const useToast: () => {
     loading: (toast: Omit<LoadingToast, "loading">) => (() => void) | undefined;
 };
 
-export { DxcAccordion, DxcAlert, DxcApplicationLayout, DxcBadge, Bleed as DxcBleed, DxcBreadcrumbs, DxcBulletedList, DxcButton, DxcCard, DxcCheckbox, DxcChip, DxcContainer, DxcContextualMenu, DxcDataGrid, DxcDateInput, DxcDialog, DxcDivider, DxcDropdown, DxcFileInput, DxcFlex, DxcGrid, DxcHeading, DxcImage, Inset as DxcInset, DxcLink, DxcNavTabs, DxcNumberInput, DxcPaginator, DxcParagraph, DxcPasswordInput, DxcProgressBar, DxcQuickNav, DxcRadioGroup, DxcResultsetTable, DxcSelect, DxcSlider, DxcSpinner, DxcStatusLight, DxcSwitch, DxcTable, DxcTabs, DxcTag, DxcTextInput, DxcTextarea, DxcToastsQueue, DxcToggleGroup, DxcTooltip, DxcTypography, DxcWizard, HalstackContext, HalstackLanguageContext, HalstackProvider, useToast };
+export { DxcAccordion, DxcAlert, DxcApplicationLayout, DxcBadge, DxcBleed, DxcBreadcrumbs, DxcBulletedList, DxcButton, DxcCard, DxcCheckbox, DxcChip, DxcContainer, DxcContextualMenu, DxcDataGrid, DxcDateInput, DxcDialog, DxcDivider, DxcDropdown, DxcFileInput, DxcFlex, DxcGrid, DxcHeading, DxcImage, DxcInset, DxcLink, DxcNavTabs, DxcNumberInput, DxcPaginator, DxcParagraph, DxcPasswordInput, DxcProgressBar, DxcQuickNav, DxcRadioGroup, DxcResultsetTable, DxcSelect, DxcSlider, DxcSpinner, DxcStatusLight, DxcSwitch, DxcTable, DxcTabs, DxcTextInput, DxcTextarea, DxcToastsQueue, DxcToggleGroup, DxcTooltip, DxcTypography, DxcWizard, HalstackContext, HalstackLanguageContext, HalstackProvider, useToast };