@trackunit/react-components 1.10.48 → 1.10.51

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-components",
-  "version": "1.10.48",
+  "version": "1.10.51",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
@@ -15,10 +15,10 @@
     "@floating-ui/react": "^0.26.25",
     "string-ts": "^2.0.0",
     "tailwind-merge": "^2.0.0",
-    "@trackunit/ui-design-tokens": "1.7.74",
-    "@trackunit/css-class-variance-utilities": "1.7.74",
-    "@trackunit/shared-utils": "1.9.74",
-    "@trackunit/ui-icons": "1.7.75",
+    "@trackunit/ui-design-tokens": "1.7.77",
+    "@trackunit/css-class-variance-utilities": "1.7.77",
+    "@trackunit/shared-utils": "1.9.77",
+    "@trackunit/ui-icons": "1.7.78",
     "@tanstack/react-router": "1.114.29",
     "es-toolkit": "^1.39.10",
     "@tanstack/react-virtual": "3.13.12"

package/src/common/CommonProps.d.ts

@@ -6,5 +6,5 @@ export interface CommonProps {
     /**
      * A id that can be used in tests to get the component
      */
-    dataTestId?: string;
+    "data-testid"?: string;
 }

package/src/components/Alert/Alert.d.ts

@@ -50,4 +50,4 @@ export interface AlertProps extends CommonProps {
  * @param {AlertProps} props - The props for the Alert component
  * @returns {ReactElement} Alert component
  */
-export declare const Alert: ({ color, title, className, children, primaryAction, secondaryAction, onClose, dataTestId, autoScroll, actionsInline, }: AlertProps) => ReactElement;
+export declare const Alert: ({ color, title, className, children, primaryAction, secondaryAction, onClose, "data-testid": dataTestId, autoScroll, actionsInline, }: AlertProps) => ReactElement;

package/src/components/Badge/Badge.d.ts

@@ -48,5 +48,5 @@ export type BadgeProps = BaseBadgeProps;
  * @param {BadgeProps} props - The props for the Badge component
  * @returns {ReactElement} Badge component
  */
-export declare const Badge: ({ color, size, compact, className, count, max, hideZero, dataTestId, }: BadgeProps) => ReactElement | null;
+export declare const Badge: ({ color, size, compact, className, count, max, hideZero, "data-testid": dataTestId, }: BadgeProps) => ReactElement | null;
 export {};

package/src/components/Breadcrumb/Breadcrumb.d.ts

@@ -13,10 +13,10 @@ import { BreadcrumbContainerProps, BreadcrumbProps } from "./utils/types";
  * @param {BreadcrumbProps} props - The props for the Breadcrumb component
  * @returns {ReactElement} Breadcrumb component
  */
-export declare const Breadcrumb: ({ className, dataTestId, breadcrumbItems, back }: BreadcrumbProps) => ReactElement;
+export declare const Breadcrumb: ({ className, "data-testid": dataTestId, breadcrumbItems, back, }: BreadcrumbProps) => ReactElement;
 /**
  * BreadcrumbContainer is a helper component that renders the breadcrumb items based on the screen size.
  *
  * @param {BreadcrumbContainerProps} props - The props for the BreadcrumbContainer component
  */
-export declare const BreadcrumbContainer: ({ dataTestId, breadcrumbItems }: BreadcrumbContainerProps) => ReactElement;
+export declare const BreadcrumbContainer: ({ "data-testid": dataTestId, breadcrumbItems, }: BreadcrumbContainerProps) => ReactElement;

package/src/components/Breadcrumb/BreadcrumbForLargeScreen.d.ts

@@ -3,4 +3,4 @@ import { BreadcrumbContainerProps } from "./utils/types";
 /**
  * BreadcrumbForLargeScreen is a helper component that renders the breadcrumb items for large screens.
  */
-export declare const BreadcrumbForLargeScreen: ({ dataTestId, breadcrumbItems }: BreadcrumbContainerProps) => ReactElement;
+export declare const BreadcrumbForLargeScreen: ({ "data-testid": dataTestId, breadcrumbItems, }: BreadcrumbContainerProps) => ReactElement;

package/src/components/Breadcrumb/BreadcrumbForMediumScreen.d.ts

@@ -3,4 +3,4 @@ import { BreadcrumbContainerProps } from "./utils/types";
 /**
  * BreadcrumbForMediumScreen is a helper component that renders the breadcrumb items for medium screens.
  */
-export declare const BreadcrumbForMediumScreen: ({ dataTestId, breadcrumbItems }: BreadcrumbContainerProps) => ReactElement;
+export declare const BreadcrumbForMediumScreen: ({ "data-testid": dataTestId, breadcrumbItems, }: BreadcrumbContainerProps) => ReactElement;

package/src/components/Breadcrumb/BreadcrumbForSmallScreen.d.ts

@@ -3,4 +3,4 @@ import { BreadcrumbContainerProps } from "./utils/types";
 /**
  * BreadcrumbForSmallScreen is a helper component that renders the breadcrumb items for small screens.
  */
-export declare const BreadcrumbForSmallScreen: ({ dataTestId, breadcrumbItems }: BreadcrumbContainerProps) => ReactElement;
+export declare const BreadcrumbForSmallScreen: ({ "data-testid": dataTestId, breadcrumbItems, }: BreadcrumbContainerProps) => ReactElement;

package/src/components/Breadcrumb/BreadcrumbItem.d.ts

@@ -3,4 +3,4 @@ import { BreadcrumbItemRenderProps } from "./utils/types";
 /**
  * BreadcrumbItem is a helper component that renders the individual breadcrumb item.
  */
-export declare const BreadcrumbItem: ({ item, dataTestId }: BreadcrumbItemRenderProps) => ReactElement;
+export declare const BreadcrumbItem: ({ item, "data-testid": dataTestId }: BreadcrumbItemRenderProps) => ReactElement;

package/src/components/Card/CardBody.d.ts

@@ -30,4 +30,4 @@ export interface CardBodyProps extends CommonProps {
  * @param {CardBodyProps} props - The props for the CardBody component
  * @returns {ReactElement} CardBody component
  */
-export declare const CardBody: ({ density, children, dataTestId, className, direction, disableGap, id, }: CardBodyProps) => ReactElement;
+export declare const CardBody: ({ density, children, "data-testid": dataTestId, className, direction, disableGap, id, }: CardBodyProps) => ReactElement;

package/src/components/Card/CardFooter.d.ts

@@ -22,4 +22,4 @@ export interface CardFooterProps extends CommonProps {
  * @param {CardFooterProps} props - The props for the CardFooter component
  * @returns {ReactElement} CardFooter component
  */
-export declare const CardFooter: ({ dataTestId, className, children, density, hideSeparator, }: CardFooterProps) => ReactElement;
+export declare const CardFooter: ({ "data-testid": dataTestId, className, children, density, hideSeparator, }: CardFooterProps) => ReactElement;

package/src/components/Card/CardHeader.d.ts

@@ -44,4 +44,4 @@ export interface CardHeaderProps extends CommonProps {
  * @param {CardHeaderProps} props - The props for the CardHeader component
  * @returns {ReactElement} CardHeader component
  */
-export declare const CardHeader: ({ heading, headingVariant, subHeading, onClose, dataTestId, className, children, accessories, actions, density, hideSeparator, }: CardHeaderProps) => ReactElement;
+export declare const CardHeader: ({ heading, headingVariant, subHeading, onClose, "data-testid": dataTestId, className, children, accessories, actions, density, hideSeparator, }: CardHeaderProps) => ReactElement;

package/src/components/Collapse/Collapse.d.ts

@@ -54,4 +54,4 @@ export interface CollapseProps extends CommonProps {
  * @param {CollapseProps} props - The props for the Collapse component
  * @returns {ReactElement} Collapse component
  */
-export declare const Collapse: ({ id, variant, initialExpanded, onToggle, label, children, className, headerClassName, headerAddon, dataTestId, animate, extraPadding, }: CollapseProps) => ReactElement;
+export declare const Collapse: ({ id, variant, initialExpanded, onToggle, label, children, className, headerClassName, headerAddon, "data-testid": dataTestId, animate, extraPadding, }: CollapseProps) => ReactElement;

package/src/components/CopyableText/CopyableText.d.ts

@@ -18,4 +18,4 @@ export interface CopyableTextProps extends CommonProps {
  * @param {CopyableTextProps} props - The props for the CopyableText component
  * @returns {ReactElement} CopyableText component
  */
-export declare const CopyableText: ({ text, alternativeText, dataTestId, className }: CopyableTextProps) => ReactElement;
+export declare const CopyableText: ({ text, alternativeText, "data-testid": dataTestId, className, }: CopyableTextProps) => ReactElement;

package/src/components/EmptyState/EmptyState.d.ts

@@ -31,5 +31,5 @@ export interface EmptyStateProps extends CommonProps {
  * - For guidance purposes (e.g., onboarding, adjusting filters, exploring alternative approaches).
  * - In celebratory instances (e.g., no new notifications, services up to date).
  */
-export declare const EmptyState: ({ description, altText, image, customImageSrc, loading, dataTestId, className, primaryAction, secondaryAction, additionalHelpAction, }: EmptyStateProps) => ReactElement;
+export declare const EmptyState: ({ description, altText, image, customImageSrc, loading, "data-testid": dataTestId, className, primaryAction, secondaryAction, additionalHelpAction, }: EmptyStateProps) => ReactElement;
 export {};

package/src/components/EmptyValue/EmptyValue.d.ts

@@ -7,4 +7,4 @@ export type EmptyValueProps = CommonProps;
  * @param {EmptyValueProps} props - The props for the EmptyValue component
  * @returns {ReactElement} EmptyValue component
  */
-export declare const EmptyValue: ({ className, dataTestId }: EmptyValueProps) => ReactElement;
+export declare const EmptyValue: ({ className, "data-testid": dataTestId }: EmptyValueProps) => ReactElement;

package/src/components/ExternalLink/ExternalLink.d.ts

@@ -33,4 +33,4 @@ export interface ExternalLinkProps extends CommonProps {
  * @param {ExternalLinkProps} props - The props for the external link component
  * @returns {ReactElement} External Link component
  */
-export declare const ExternalLink: ({ rel, target, href, className, children, title, dataTestId, onClick, color, }: ExternalLinkProps) => ReactElement;
+export declare const ExternalLink: ({ rel, target, href, className, children, title, "data-testid": dataTestId, onClick, color, }: ExternalLinkProps) => ReactElement;

package/src/components/Heading/Heading.d.ts

@@ -25,4 +25,4 @@ export interface HeadingProps extends CommonProps {
  * @param {HeadingProps} props - The props for the Heading component
  * @returns {ReactElement} Heading component
  */
-export declare const Heading: ({ variant, inverted, subtle, className, dataTestId, ...rest }: HeadingProps) => ReactElement;
+export declare const Heading: ({ variant, inverted, subtle, className, "data-testid": dataTestId, ...rest }: HeadingProps) => ReactElement;

package/src/components/Highlight/Highlight.d.ts

@@ -31,6 +31,6 @@ export interface HighlightProps extends CommonProps {
  * @returns {ReactElement} highlight component
  */
 export declare const Highlight: {
-    ({ className, dataTestId, children, size, color, ref, }: HighlightProps): ReactElement;
+    ({ className, "data-testid": dataTestId, children, size, color, ref, }: HighlightProps): ReactElement;
     displayName: string;
 };

package/src/components/HorizontalOverflowScroller/HorizontalOverflowScroller.d.ts

@@ -19,8 +19,8 @@ export interface HorizontalOverflowScrollerProps extends CommonProps, Styleable
  * @param props - Component properties
  * @param props.children - The content to display in the horizontal scroller
  * @param props.className - Optional CSS class name for styling
- * @param props.dataTestId - Optional test ID for testing purposes
+ * @param props."data-testid" - Optional test ID for testing purposes
  * @param props.onScrollStateChange - Optional callback fired when scroll state changes
  * @returns {ReactElement} A horizontal overflow scroller component with visual indicators
  */
-export declare const HorizontalOverflowScroller: ({ className, dataTestId, children, onScrollStateChange, }: HorizontalOverflowScrollerProps) => ReactElement;
+export declare const HorizontalOverflowScroller: ({ className, "data-testid": dataTestId, children, onScrollStateChange, }: HorizontalOverflowScrollerProps) => ReactElement;

package/src/components/HorizontalOverflowScroller/OverflowIndicator.d.ts

@@ -18,5 +18,5 @@ export interface OverflowIndicatorProps extends CommonProps {
  * @param {OverflowIndicatorProps} props - The props for the component
  * @returns {ReactElement} OverflowIndicator component
  */
-export declare const OverflowIndicator: ({ className, dataTestId, direction, onClickScroll, }: OverflowIndicatorProps) => ReactElement;
+export declare const OverflowIndicator: ({ className, "data-testid": dataTestId, direction, onClickScroll, }: OverflowIndicatorProps) => ReactElement;
 export {};

package/src/components/Icon/Icon.d.ts

@@ -305,5 +305,5 @@ export type IconProps = DiscriminatedIconProps & CommonProps & AriaProps & {
  * @param {IconProps} props - The props for the Icon component
  * @returns {ReactElement} Icon component
  */
-export declare const Icon: ({ name, size, className, dataTestId, color, onClick, type, style, forwardedRef, ariaLabel, fontSize, ariaLabelledBy, ariaDescribedBy, ariaHidden, }: IconProps) => ReactElement;
+export declare const Icon: ({ name, size, className, "data-testid": dataTestId, color, onClick, type, style, forwardedRef, ariaLabel, fontSize, ariaLabelledBy, ariaDescribedBy, ariaHidden, }: IconProps) => ReactElement;
 export {};

package/src/components/Indicator/Indicator.d.ts

@@ -47,4 +47,4 @@ export interface IndicatorProps extends CommonProps {
  * @param {IndicatorProps} props - The props for the Indicator component
  * @returns {ReactElement} Indicator component
  */
-export declare const Indicator: ({ dataTestId, icon, label, color, withBackground, withLabel, ping, size, weight, className, ...rest }: IndicatorProps) => ReactElement;
+export declare const Indicator: ({ "data-testid": dataTestId, icon, label, color, withBackground, withLabel, ping, size, weight, className, ...rest }: IndicatorProps) => ReactElement;

package/src/components/KPI/KPI.d.ts

@@ -58,4 +58,4 @@ export interface KPIProps extends CommonProps, Styleable {
  * @param {KPIProps} props - The props for the KPI component
  * @returns {ReactElement} KPI component
  */
-export declare const KPI: ({ title, value, loading, unit, className, dataTestId, tooltipLabel, variant, trend, style, ...rest }: KPIProps) => ReactElement;
+export declare const KPI: ({ title, value, loading, unit, className, "data-testid": dataTestId, tooltipLabel, variant, trend, style, ...rest }: KPIProps) => ReactElement;

package/src/components/KPICard/KPICard.d.ts

@@ -30,4 +30,4 @@ export interface KPICardProps extends MappedOmit<KPIProps, "variant"> {
  * @param {KPICardProps} props - The props for the KPICard component
  * @returns {ReactElement} KPICard component
  */
-export declare const KPICard: ({ isActive, onClick, className, dataTestId, children, iconName, iconColor, loading, ...rest }: KPICardProps) => ReactElement;
+export declare const KPICard: ({ isActive, onClick, className, "data-testid": dataTestId, children, iconName, iconColor, loading, ...rest }: KPICardProps) => ReactElement;

package/src/components/List/List.d.ts

@@ -89,4 +89,4 @@ export interface ListProps<TItem = unknown> extends CommonProps, UseListResult<T
  * );
  * ```
  */
-export declare const List: <TItem = unknown>({ children, className, dataTestId, containerRef, listRef, rows, getListItemProps, header, loadingIndicator, shouldShowLoaderAtIndex, count, isScrolling, separator, topSeparatorOnScroll, isAtTop, contentFillsContainer, scrollOffset: _scrollOffset, getTotalSize: _getTotalSize, getVirtualItems: _getVirtualItems, scrollToOffset: _scrollToOffset, scrollToIndex: _scrollToIndex, measure: _measure, }: ListProps<TItem>) => ReactElement;
+export declare const List: <TItem = unknown>({ children, className, "data-testid": dataTestId, containerRef, listRef, rows, getListItemProps, header, loadingIndicator, shouldShowLoaderAtIndex, count, isScrolling, separator, topSeparatorOnScroll, isAtTop, contentFillsContainer, scrollOffset: _scrollOffset, getTotalSize: _getTotalSize, getVirtualItems: _getVirtualItems, scrollToOffset: _scrollToOffset, scrollToIndex: _scrollToIndex, measure: _measure, }: ListProps<TItem>) => ReactElement;

package/src/components/ListItem/ListItem.d.ts

@@ -41,5 +41,5 @@ export interface ListItemProps extends CommonProps, ListItemVirtualizationProps,
  * @param { ListItemProps} props - The props for the ListItem component
  * @returns {Element}  ListItem component
  */
-export declare const ListItem: ({ className, dataTestId, onClick, details, title, description, meta, thumbnail, thumbnailColor, thumbnailBackground, ...rest }: ListItemProps) => ReactElement;
+export declare const ListItem: ({ className, "data-testid": dataTestId, onClick, details, title, description, meta, thumbnail, thumbnailColor, thumbnailBackground, ...rest }: ListItemProps) => ReactElement;
 export {};

package/src/components/Menu/MenuItem/MenuItem.d.ts

@@ -90,4 +90,4 @@ export interface MenuItemProps extends CommonProps {
  * @param {MenuItemProps} props - The props for the MenuItem component
  * @returns {ReactElement} MenuItem component
  */
-export declare const MenuItem: ({ className, dataTestId, label, children, selected, focused, prefix, suffix, disabled, onClick, stopPropagation, id, tabIndex, optionLabelDescription, optionPrefix, fieldSize, variant, }: MenuItemProps) => ReactElement;
+export declare const MenuItem: ({ className, "data-testid": dataTestId, label, children, selected, focused, prefix, suffix, disabled, onClick, stopPropagation, id, tabIndex, optionLabelDescription, optionPrefix, fieldSize, variant, }: MenuItemProps) => ReactElement;

package/src/components/Menu/MenuList/MenuList.d.ts

@@ -33,4 +33,4 @@ export interface MenuListProps extends CommonProps {
  * @param {MenuListProps} props - The props for the MenuList component
  * @returns {ReactElement} MenuList component
  */
-export declare const MenuList: ({ dataTestId, className, children, isMulti, selectedItems: controlledSelectedItems, onSelectionChange, ...args }: MenuListProps) => ReactElement;
+export declare const MenuList: ({ "data-testid": dataTestId, className, children, isMulti, selectedItems: controlledSelectedItems, onSelectionChange, ...args }: MenuListProps) => ReactElement;

package/src/components/Menu/MoreMenu/MoreMenu.d.ts

@@ -22,5 +22,5 @@ export interface MoreMenuProps extends CommonProps {
  * @param {MoreMenuProps} props - The props for the MoreMenu component
  * @returns {ReactElement} MoreMenu component
  */
-export declare const MoreMenu: ({ className, dataTestId, popoverProps, iconProps, iconButtonProps, customButton, customPortalId, children, }: MoreMenuProps) => ReactElement;
+export declare const MoreMenu: ({ className, "data-testid": dataTestId, popoverProps, iconProps, iconButtonProps, customButton, customPortalId, children, }: MoreMenuProps) => ReactElement;
 export {};

package/src/components/Notice/Notice.d.ts

@@ -41,4 +41,4 @@ export interface NoticeProps extends CommonProps {
  * @param {NoticeProps} props - The props for the Notice component
  * @returns {ReactElement} Notice component
  */
-export declare const Notice: ({ dataTestId, icon, label, color, withLabel, className, tooltipLabel, withTooltip, size, ...rest }: NoticeProps) => ReactElement;
+export declare const Notice: ({ "data-testid": dataTestId, icon, label, color, withLabel, className, tooltipLabel, withTooltip, size, ...rest }: NoticeProps) => ReactElement;

package/src/components/Page/Page.d.ts

@@ -12,9 +12,9 @@ export type Layout = VariantProps<typeof cvaPage>["layout"];
 export interface PageProps extends CommonProps {
     layout: Layout;
     children?: ReactNode;
-    dataTestId?: string;
+    "data-testid"?: string;
 }
 /**
  * Renders the page component. Adds padding and layout to the page.
  */
-export declare const Page: ({ layout, className, children, dataTestId }: PageProps) => ReactElement;
+export declare const Page: ({ layout, className, children, "data-testid": dataTestId }: PageProps) => ReactElement;

package/src/components/Page/PageContent.d.ts

@@ -20,5 +20,5 @@ interface PageContentProps extends CommonProps {
  * @param {PageContentProps} props - The component props.
  * @returns {ReactNode} - The rendered component.
  */
-export declare const PageContent: ({ className, children, dataTestId, layout }: PageContentProps) => ReactElement;
+export declare const PageContent: ({ className, children, "data-testid": dataTestId, layout, }: PageContentProps) => ReactElement;
 export {};

package/src/components/PageHeader/PageHeader.d.ts

@@ -10,4 +10,4 @@ import { PageHeaderProps } from "./types";
  * @param {PageHeaderProps} props - The props for the PageHeader component
  * @returns {ReactElement} PageHeader component
  */
-export declare const PageHeader: ({ className, dataTestId, showLoading, description, title, tagLabel, backTo, tagColor, tabsList, descriptionIcon, tagTooltipLabel, ...discriminatedProps }: PageHeaderProps) => ReactElement;
+export declare const PageHeader: ({ className, "data-testid": dataTestId, showLoading, description, title, tagLabel, backTo, tagColor, tabsList, descriptionIcon, tagTooltipLabel, ...discriminatedProps }: PageHeaderProps) => ReactElement;

package/src/components/PageHeader/components/PageHeaderTitle.d.ts

@@ -1,13 +1,19 @@
 import { ReactElement } from "react";
+import { CommonProps } from "../../../common";
+interface PageHeaderTitleProps extends CommonProps {
+    /**
+     * The title of the page header
+     */
+    title: string;
+}
 /**
  * The PageHeaderTitle component is used to display the title of the page header.
  *
  * @param {object} props - The props for the PageHeaderTitle component
  * @param {string} props.title - The title of the page header
- * @param {string} [props.dataTestId] - The data test id of the page header title
+ * @param {string} props.className - The class name of the page header title
+ * @param {string} [props."data-testid"] - The data test id of the page header title
  * @returns {ReactElement} PageHeaderTitle component
  */
-export declare const PageHeaderTitle: ({ title, dataTestId }: {
-    title: string;
-    dataTestId?: string;
-}) => ReactElement;
+export declare const PageHeaderTitle: ({ title, "data-testid": dataTestId, className, }: PageHeaderTitleProps) => ReactElement;
+export {};

package/src/components/Pagination/Pagination.d.ts

@@ -35,7 +35,7 @@ export interface PaginationProps {
     /**
      * A data test id
      */
-    dataTestId?: string;
+    "data-testid"?: string;
     /**
      * An helper to get translation for count.
      */
@@ -59,4 +59,4 @@ export interface PaginationProps {
  * @param {PaginationProps} props - The props for the Pagination component
  * @returns {ReactElement} Pagination component
  */
-export declare const Pagination: ({ previousPage, nextPage, canPreviousPage, canNextPage, pageCount, pageIndex, loading, className, dataTestId, getTranslatedCount, onPageChange, cursorBase, }: PaginationProps) => ReactElement;
+export declare const Pagination: ({ previousPage, nextPage, canPreviousPage, canNextPage, pageCount, pageIndex, loading, className, "data-testid": dataTestId, getTranslatedCount, onPageChange, cursorBase, }: PaginationProps) => ReactElement;

package/src/components/Polygon/Polygon.d.ts

@@ -13,5 +13,5 @@ export interface PolygonProps extends CommonProps {
  * @param { PolygonProps} props - The props for the  Polygon component
  * @returns {ReactElement}  Polygon component
  */
-export declare const Polygon: ({ points, size, color, opaque, className, dataTestId, }: PolygonProps) => ReactElement;
+export declare const Polygon: ({ points, size, color, opaque, className, "data-testid": dataTestId, }: PolygonProps) => ReactElement;
 export {};

package/src/components/Popover/PopoverContent.d.ts

@@ -45,4 +45,4 @@ export interface PopoverContentProps extends Omit<HTMLProps<HTMLDivElement>, "ch
  * @param {PopoverContentProps} props - The props for the PopoverContent component
  * @returns {ReactElement} The popover content element
  */
-export declare const PopoverContent: ({ className, dataTestId, children, portalId, ref: propRef, ...props }: PopoverContentProps) => ReactElement;
+export declare const PopoverContent: ({ className, "data-testid": dataTestId, children, portalId, ref: propRef, ...props }: PopoverContentProps) => ReactElement;

package/src/components/Popover/PopoverTitle.d.ts

@@ -17,4 +17,4 @@ export interface PopoverTitleProps extends CommonProps {
  * @param {PopoverTitleProps} props - The props for the PopoverTitle component
  * @returns {ReactElement} PopoverTitle component
  */
-export declare const PopoverTitle: ({ children, action, divider, className, dataTestId, }: PopoverTitleProps) => ReactElement;
+export declare const PopoverTitle: ({ children, action, divider, className, "data-testid": dataTestId, }: PopoverTitleProps) => ReactElement;

package/src/components/SectionHeader/SectionHeader.d.ts

@@ -20,4 +20,4 @@ export interface SectionHeaderProps extends CommonProps {
  * @param {SectionHeaderProps} props - The props for the section header component
  * @returns {ReactElement} SectionHeader component
  */
-export declare const SectionHeader: ({ title, subtitle, dataTestId, addons }: SectionHeaderProps) => ReactElement;
+export declare const SectionHeader: ({ title, subtitle, "data-testid": dataTestId, addons, }: SectionHeaderProps) => ReactElement;

package/src/components/Sidebar/Sidebar.d.ts

@@ -54,4 +54,4 @@ export interface SidebarProps extends CommonProps {
  * @param {SidebarProps} props - The props for the Sidebar component
  * @returns {ReactElement} Sidebar component
  */
-export declare const Sidebar: ({ childContainerClassName, children, breakpoint, className, dataTestId, moreMenuProps, menuListProps, overflowThreshold, }: SidebarProps) => ReactElement;
+export declare const Sidebar: ({ childContainerClassName, children, breakpoint, className, "data-testid": dataTestId, moreMenuProps, menuListProps, overflowThreshold, }: SidebarProps) => ReactElement;

package/src/components/Spacer/Spacer.d.ts

@@ -17,4 +17,4 @@ export interface SpacerProps extends CommonProps {
  * @param {SpacerProps} props - The props for the Spacer component
  * @returns {ReactElement} Spacer component
  */
-export declare const Spacer: ({ size, border, dataTestId, className }: SpacerProps) => ReactElement;
+export declare const Spacer: ({ size, border, "data-testid": dataTestId, className, }: SpacerProps) => ReactElement;

package/src/components/Spinner/Spinner.d.ts

@@ -40,5 +40,5 @@ export interface SpinnerProps extends CommonProps {
  * @param {SpinnerProps} props - The props for the Spinner component
  * @returns {ReactElement} Spinner component
  */
-export declare const Spinner: ({ mode, size, centering, className, containerClassName, dataTestId, label, }: SpinnerProps) => ReactElement;
+export declare const Spinner: ({ mode, size, centering, className, containerClassName, "data-testid": dataTestId, label, }: SpinnerProps) => ReactElement;
 export {};

package/src/components/Tabs/Tab.d.ts

@@ -13,7 +13,7 @@ export interface TabProps extends TabsTriggerProps {
     /**
      * A data-testid attribute for testing purposes.
      */
-    dataTestId?: string;
+    "data-testid"?: string;
     /**
      * The text content of the tab.
      */
@@ -43,4 +43,4 @@ export interface TabProps extends TabsTriggerProps {
  * Wrapper for radix tab component.
  * We add a custom implementation of the asChild prop to make it easy to make the child element look like other tabs.
  */
-export declare const Tab: ({ value, isFullWidth, iconName, dataTestId, className, children, suffix, asChild, appendTabStylesToChildIfAsChild, ...rest }: TabProps) => ReactElement;
+export declare const Tab: ({ value, isFullWidth, iconName, "data-testid": dataTestId, className, children, suffix, asChild, appendTabStylesToChildIfAsChild, ...rest }: TabProps) => ReactElement;

package/src/components/Tabs/TabContent.d.ts

@@ -3,7 +3,7 @@ import { IconName } from "@trackunit/ui-icons";
 import { ReactElement, ReactNode } from "react";
 export interface TabContentProps extends TabsContentProps {
     className?: string;
-    dataTestId?: string;
+    "data-testid"?: string;
     children?: ReactNode;
     suffix?: ReactNode;
     iconName?: IconName;
@@ -11,4 +11,4 @@ export interface TabContentProps extends TabsContentProps {
 /**
  * Wrapper for radix tab content component.
  */
-export declare const TabContent: ({ className, dataTestId, children, ...rest }: TabContentProps) => ReactElement;
+export declare const TabContent: ({ className, "data-testid": dataTestId, children, ...rest }: TabContentProps) => ReactElement;

package/src/components/Tabs/TabList.d.ts

@@ -13,7 +13,7 @@ export interface TabListProps extends TabsListProps {
     /**
      * An ID that can be used in tests to locate the component.
      */
-    dataTestId?: string;
+    "data-testid"?: string;
     /**
      * If set to true, automatically scrolls the active tab into view when changed.
      *
@@ -24,4 +24,4 @@ export interface TabListProps extends TabsListProps {
 /**
  * Wrapper for radix tab list component.
  */
-export declare const TabList: ({ className, dataTestId, children, autoScrollToActive, ...rest }: TabListProps) => ReactElement;
+export declare const TabList: ({ className, "data-testid": dataTestId, children, autoScrollToActive, ...rest }: TabListProps) => ReactElement;

package/src/components/Tabs/Tabs.d.ts

@@ -20,9 +20,9 @@ export interface TabsProps extends TabsRootProps {
     /**
      * An ID that can be used in tests to locate the component.
      */
-    dataTestId?: string;
+    "data-testid"?: string;
 }
 /**
  * Tabs are used to group different but related content, allowing users to navigate views without leaving the page. They always contain at least two items and one tab is active at a time. Tabs can be used on full page layouts or in components such as modals or tables.
  */
-export declare const Tabs: ({ children, forceRender, className, dataTestId, fullWidth, ...rest }: TabsProps) => ReactElement;
+export declare const Tabs: ({ children, forceRender, className, "data-testid": dataTestId, fullWidth, ...rest }: TabsProps) => ReactElement;

package/src/components/Tag/Tag.d.ts

@@ -58,6 +58,6 @@ export interface TagProps extends CommonProps {
  * @returns {ReactElement} The rendered Tag component.
  */
 export declare const Tag: {
-    ({ className, dataTestId, children, size, onClose, color, disabled, ref, icon, onMouseEnter, }: TagProps): ReactElement;
+    ({ className, "data-testid": dataTestId, children, size, onClose, color, disabled, ref, icon, onMouseEnter, }: TagProps): ReactElement;
     displayName: string;
 };

package/src/components/Text/Text.d.ts

@@ -72,6 +72,6 @@ export interface TextProps extends CommonProps {
  * @returns {ReactElement} Text component
  */
 export declare const Text: {
-    ({ children, type, size, align, weight, underline, inverted, subtle, italicize, uppercase, disabled, className, dataTestId, ref, ...rest }: TextProps): ReactElement;
+    ({ children, type, size, align, weight, underline, inverted, subtle, italicize, uppercase, disabled, className, "data-testid": dataTestId, ref, ...rest }: TextProps): ReactElement;
     displayName: string;
 };

package/src/components/ToggleGroup/ToggleGroup.d.ts

@@ -62,7 +62,7 @@ export type ToggleGroupProps<TSelectedId extends string = string> = CommonProps
  * @param {ToggleGroupProps} props - The props for the ToggleGroup component
  * @returns {ReactElement} ToggleGroup component
  */
-export declare const ToggleGroup: <TSelectedId extends string = string>({ list, selected, setSelected, onChange, disabled, size, isIconOnly, className, dataTestId, }: ToggleGroupProps<TSelectedId>) => ReactElement;
+export declare const ToggleGroup: <TSelectedId extends string = string>({ list, selected, setSelected, onChange, disabled, size, isIconOnly, className, "data-testid": dataTestId, }: ToggleGroupProps<TSelectedId>) => ReactElement;
 export interface ToggleItemProps extends CommonProps, MappedOmit<BasicToggleGroupListProps<string>, "id"> {
     title: string;
     text?: {
@@ -80,6 +80,6 @@ export interface ToggleItemProps extends CommonProps, MappedOmit<BasicToggleGrou
     isIconOnly: boolean;
     iconName?: IconName;
     className?: string;
-    dataTestId?: string;
+    "data-testid"?: string;
     ref?: (el: HTMLButtonElement | null) => void;
 }

package/src/components/Tooltip/Tooltip.d.ts

@@ -45,4 +45,4 @@ export interface TooltipProps extends CommonProps, Styleable {
  * @param {TooltipProps} props - The props for the Tooltip component
  * @returns {ReactElement} Tooltip component
  */
-export declare const Tooltip: ({ children, dataTestId, disabled, className, label, placement, mode, iconProps, id, style, }: TooltipProps) => ReactElement;
+export declare const Tooltip: ({ children, "data-testid": dataTestId, disabled, className, label, placement, mode, iconProps, id, style, }: TooltipProps) => ReactElement;

package/src/components/ValueBar/ValueBar.d.ts

@@ -48,5 +48,5 @@ export interface ValueBarProps extends CommonProps {
  * @param {ValueBarProps} props - The props for the ValueBar component
  * @returns {ReactElement} ValueBar component
  */
-export declare const ValueBar: ({ value, min, max, unit, size, levelColors, valueColor, showValue, className, dataTestId, zeroScoreAllowed, }: ValueBarProps) => ReactElement;
+export declare const ValueBar: ({ value, min, max, unit, size, levelColors, valueColor, showValue, className, "data-testid": dataTestId, zeroScoreAllowed, }: ValueBarProps) => ReactElement;
 export {};

package/src/components/ZStack/ZStack.d.ts

@@ -10,4 +10,4 @@ export type ZStackProps = CommonProps & {
  * @param { ZStackProps} props - The props for the  ZStack component
  * @returns {Element}  ZStack component
  */
-export declare const ZStack: ({ children, className, dataTestId }: ZStackProps) => ReactElement;
+export declare const ZStack: ({ children, className, "data-testid": dataTestId }: ZStackProps) => ReactElement;

package/src/components/buttons/Button/Button.d.ts

@@ -57,6 +57,6 @@ export interface ButtonProps extends Omit<ButtonCommonProps, "size"> {
  * @returns {ReactElement} Button component
  */
 export declare const Button: {
-    ({ onClick, children, loading, disabled, className, fullWidth, prefix, suffix, variant, type, size, square, dataTestId, title, role, tabIndex, asChild, ref, ...rest }: ButtonProps): ReactElement;
+    ({ onClick, children, loading, disabled, className, fullWidth, prefix, suffix, variant, type, size, square, "data-testid": dataTestId, title, role, tabIndex, asChild, ref, ...rest }: ButtonProps): ReactElement;
     displayName: string;
 };