@trackunit/react-table-base-components 1.3.26 → 1.3.32

package/index.cjs.js

@@ -13,7 +13,7 @@ var sharedUtils = require('@trackunit/shared-utils');
  * The ButtonCell is used to render buttons in a table cell
  *
  * @param {ButtonCellProps} props - The props for the ButtonCell component
- * @returns {JSX.Element} ButtonCell component
+ * @returns {ReactElement} ButtonCell component
  */
 const ButtonCell = ({ dataTestId, children, iconName, iconColor = "primary", variant = "ghost-neutral", ...rest }) => {
     return (jsxRuntime.jsx(reactComponents.Button, { prefix: iconName ? jsxRuntime.jsx(reactComponents.Icon, { color: iconColor, name: iconName, size: "small", type: "solid" }) : null, ...rest, dataTestId: `button-cell-${dataTestId}`, variant: variant, children: children }));
@@ -26,7 +26,7 @@ const cvaCheckboxCell = cssClassVarianceUtilities.cvaMerge([""]);
  * The checkbox is not editable.
  *
  * @param {CheckboxCellProps} props - The props for the CheckboxCell component
- * @returns {JSX.Element} CheckboxCell component
+ * @returns {ReactElement} CheckboxCell component
  */
 const CheckboxCell = ({ checked, className, dataTestId }) => {
     return (jsxRuntime.jsx("div", { className: cvaCheckboxCell({ className }), "data-testid": dataTestId, children: jsxRuntime.jsx(reactFormComponents.Checkbox, { checked: checked, readOnly: true }) }));
@@ -40,7 +40,7 @@ const cvaDateTimeSince$1 = cssClassVarianceUtilities.cvaMerge(["slashed-zero", "
  * DateTimeCell is used for render a date and or time in a table cell.
  *
  * @param {DateTimeCellProps} props - The props for the DateTimeCell component
- * @returns {JSX.Element} DateTimeCell component
+ * @returns {ReactElement} DateTimeCell component
  */
 const DateTimeCell = ({ format, timeZone, locale, date, withTimeSince = true, className, dataTestId, }) => {
     if (!date) {
@@ -63,7 +63,7 @@ const TimeSince = ({ date, timeZone, locale }) => {
  * The `<ImageCell>` component is used for displaying images in a table cell.
  *
  * @param {ImageCellProps} props - The props for the Image component.
- * @returns {JSX.Element} The Image component.
+ * @returns {ReactElement} The Image component.
  */
 const ImageCell = ({ imageUrl, alt = "", width = 100, height = 100, dataTestId, ...rest }) => {
     return jsxRuntime.jsx("img", { alt: alt, "data-testid": dataTestId, height: height, src: imageUrl, width: width, ...rest });
@@ -73,7 +73,7 @@ const ImageCell = ({ imageUrl, alt = "", width = 100, height = 100, dataTestId,
  * The IndicatorCell is used for render an indicator in a table cell
  *
  * @param {IndicatorCellProps} props - The props for the LinkCell component
- * @returns {JSX.Element} LinkCell component
+ * @returns {ReactElement} LinkCell component
  */
 const IndicatorCell = ({ ...rest }) => {
     return jsxRuntime.jsx(reactComponents.Indicator, { ...rest });
@@ -83,7 +83,7 @@ const IndicatorCell = ({ ...rest }) => {
  * The LinkCell is used for render a list of tags in a table cell
  *
  * @param {LinkCellProps} props - The props for the LinkCell component
- * @returns {JSX.Element} LinkCell component
+ * @returns {ReactElement} LinkCell component
  */
 const LinkCell = ({ link, type, ...rest }) => {
     const linkPrefix = type === "LINK" ? "" : type === "PHONE" ? "tel:" : "mailto:";
@@ -102,7 +102,7 @@ const cvaSecondaryRowText = cssClassVarianceUtilities.cvaMerge(["overflow-hidden
  * The MultiRowTableCell component helps to display two rows inside a table cell.
  *
  * @param {MultiRowTableCellProps} props - The props for the MultiRowTableCell component
- * @returns {JSX.Element} MultiRowTableCell component
+ * @returns {ReactElement} MultiRowTableCell component
  */
 const MultiRowTableCell = ({ main, secondary, dataTestId, className }) => {
     return (jsxRuntime.jsx("div", { className: cvaMultiRowTableCell({ className }), children: jsxRuntime.jsxs("section", { className: cvaMultiRowTableCellSection(), "data-testid": dataTestId, children: [typeof main === "string" ? jsxRuntime.jsx("div", { className: cvaMainRowText(), children: main }) : main, secondary && typeof secondary === "string" ? (jsxRuntime.jsx("div", { className: cvaSecondaryRowText(), children: secondary })) : (secondary)] }) }));
@@ -116,7 +116,7 @@ const cvaMultiValueTextCellTooltip = cssClassVarianceUtilities.cvaMerge(["whites
  * The text content is not editable and will be truncated if the cell is too narrow.
  *
  * @param {MultiValueTextCellProps} props - The props for the MultiValueTextCell component
- * @returns {JSX.Element} MultiValueTextCell component
+ * @returns {ReactElement} MultiValueTextCell component
  */
 const MultiValueTextCell = ({ content, count, countTooltip, icon, iconTooltip, dataTestId, className, }) => {
     const [isTooltipVisible, setIsTooltipVisible] = react.useState(false);
@@ -130,7 +130,7 @@ const MultiValueTextCell = ({ content, count, countTooltip, icon, iconTooltip, d
  * The NoticeCell is used for rendering a Notice in a table cell
  *
  * @param {NoticeCellProps} props - The props for the NoticeCell component
- * @returns {JSX.Element} NoticeCell component
+ * @returns {ReactElement} NoticeCell component
  */
 const NoticeCell = ({ ...rest }) => {
     return jsxRuntime.jsx(reactComponents.Notice, { ...rest });
@@ -149,7 +149,7 @@ const cvaNumberCell = cssClassVarianceUtilities.cvaMerge([
  * The `<NumberCell>` component is used for displaying numbers with units in a table cell.
  *
  * @param {NumberCellProps} props - The props for the NumberCell component.
- * @returns {JSX.Element} A React JSX element representing the NumberCell component.
+ * @returns {ReactElement} A React JSX element representing the NumberCell component.
  */
 const NumberCell = ({ value = "", unit, className, dataTestId }) => {
     return (jsxRuntime.jsxs("div", { className: cvaNumberCell({ className }), "data-testid": dataTestId, children: [jsxRuntime.jsx("span", { children: value }), value && unit ? jsxRuntime.jsx("span", { children: unit }) : null] }));
@@ -163,7 +163,7 @@ const cvaDateTimeSince = cssClassVarianceUtilities.cvaMerge(["slashed-zero", "te
  * PlainDateCell is used for render a date and or time in a table cell.
  *
  * @param {PlainDateCellProps} props - The props for the PlainDateCell component
- * @returns {JSX.Element} PlainDateCell component
+ * @returns {ReactElement} PlainDateCell component
  */
 const PlainDateCell = ({ locale, date, withDaysSince = true, className, dataTestId }) => {
     if (!date) {
@@ -267,7 +267,7 @@ const cvaSortIndicator = cssClassVarianceUtilities.cvaMerge([
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TableRootProps} props - The props for the TableRoot component
- * @returns {JSX.Element} TableRoot component
+ * @returns {ReactElement} TableRoot component
  */
 const TableRoot = ({ dataTestId, className, children, ...rest }) => {
     return (jsxRuntime.jsx("table", { className: cvaTableRoot({ className }), "data-testid": dataTestId, ...rest, children: children }));
@@ -280,7 +280,7 @@ const cvaTagsCell = cssClassVarianceUtilities.cvaMerge(["flex", "gap-2"]);
  * The TagsCell is used for render a list of tags in a table cell
  *
  * @param {TagsCellProps} props - The props for the TagsCell component
- * @returns {JSX.Element} TagsCell component
+ * @returns {ReactElement} TagsCell component
  */
 const TagsCell = ({ className, tags, dataTestId }) => {
     return (jsxRuntime.jsx("div", { className: cvaTagsCell({ className }), "data-testid": dataTestId, children: tags.map((tag, index) => (jsxRuntime.jsx(reactComponents.Tag, { color: "primary",
@@ -296,7 +296,7 @@ const TagsCell = ({ className, tags, dataTestId }) => {
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TbodyProps} props - The props for the Tbody component
- * @returns {JSX.Element} Tbody component
+ * @returns {ReactElement} Tbody component
  */
 const Tbody = ({ dataTestId, className, children, ...rest }) => {
     return (jsxRuntime.jsx("tbody", { className: className, "data-testid": dataTestId, ...rest, children: children }));
@@ -310,7 +310,7 @@ const Tbody = ({ dataTestId, className, children, ...rest }) => {
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TdProps} props - The props for the Td component
- * @returns {JSX.Element} Td component
+ * @returns {ReactElement} Td component
  */
 const Td = ({ dataTestId, className, children, ...rest }) => {
     return (jsxRuntime.jsx("td", { className: cvaTd({ className }), "data-testid": dataTestId, ...rest, children: children }));
@@ -325,7 +325,7 @@ const cvaTextCellTooltip = cssClassVarianceUtilities.cvaMerge(["grid"]);
  * The text is not editable and will be truncated if the cell is too narrow.
  *
  * @param {TextCellProps} props - The props for the TextCell component
- * @returns {JSX.Element} TextCell component
+ * @returns {ReactElement} TextCell component
  */
 const TextCell = ({ content = "", className, dataTestId }) => {
     const [isTooltipVisible, setIsTooltipVisible] = react.useState(false);
@@ -343,7 +343,7 @@ const TextCell = ({ content = "", className, dataTestId }) => {
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TfootProps} props - The props for the Tfoot component
- * @returns {JSX.Element} Tfoot component
+ * @returns {ReactElement} Tfoot component
  */
 const Tfoot = ({ dataTestId, className, children, ...rest }) => {
     return (jsxRuntime.jsx("tfoot", { className: className, "data-testid": dataTestId, ...rest, children: children }));
@@ -357,7 +357,7 @@ const Tfoot = ({ dataTestId, className, children, ...rest }) => {
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {ThProps} props - The props for the Th component
- * @returns {JSX.Element} Th component
+ * @returns {ReactElement} Th component
  */
 const Th = ({ dataTestId, className, children, tooltipLabel, ...rest }) => {
     const [showToolTip, setShowTooltipVisible] = react.useState(false);
@@ -387,7 +387,7 @@ const cvaChildrenContainer = cssClassVarianceUtilities.cvaMerge(["max-w-full", "
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TheadProps} props - The props for the Thead component
- * @returns {JSX.Element} Thead component
+ * @returns {ReactElement} Thead component
  */
 const Thead = ({ dataTestId, className, children, sticky = true, ...rest }) => {
     return (jsxRuntime.jsx("thead", { className: cvaThead({ sticky, className }), "data-testid": dataTestId, ...rest, children: children }));
@@ -412,7 +412,7 @@ const cvaThead = cssClassVarianceUtilities.cvaMerge(["bg-neutral-100", "text-lef
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TrProps} props - The props for the Tr component
- * @returns {JSX.Element} Tr component
+ * @returns {ReactElement} Tr component
  */
 const Tr = ({ dataTestId, className, children, layout = "default", ...rest }) => {
     return (jsxRuntime.jsx("tr", { className: cvaTr({ layout, className }), "data-testid": dataTestId, role: "row", ...rest, children: children }));

package/index.esm.js

@@ -11,7 +11,7 @@ import { DateTimeFormat } from '@trackunit/shared-utils';
  * The ButtonCell is used to render buttons in a table cell
  *
  * @param {ButtonCellProps} props - The props for the ButtonCell component
- * @returns {JSX.Element} ButtonCell component
+ * @returns {ReactElement} ButtonCell component
  */
 const ButtonCell = ({ dataTestId, children, iconName, iconColor = "primary", variant = "ghost-neutral", ...rest }) => {
     return (jsx(Button, { prefix: iconName ? jsx(Icon, { color: iconColor, name: iconName, size: "small", type: "solid" }) : null, ...rest, dataTestId: `button-cell-${dataTestId}`, variant: variant, children: children }));
@@ -24,7 +24,7 @@ const cvaCheckboxCell = cvaMerge([""]);
  * The checkbox is not editable.
  *
  * @param {CheckboxCellProps} props - The props for the CheckboxCell component
- * @returns {JSX.Element} CheckboxCell component
+ * @returns {ReactElement} CheckboxCell component
  */
 const CheckboxCell = ({ checked, className, dataTestId }) => {
     return (jsx("div", { className: cvaCheckboxCell({ className }), "data-testid": dataTestId, children: jsx(Checkbox, { checked: checked, readOnly: true }) }));
@@ -38,7 +38,7 @@ const cvaDateTimeSince$1 = cvaMerge(["slashed-zero", "text-neutral-500", "text-s
  * DateTimeCell is used for render a date and or time in a table cell.
  *
  * @param {DateTimeCellProps} props - The props for the DateTimeCell component
- * @returns {JSX.Element} DateTimeCell component
+ * @returns {ReactElement} DateTimeCell component
  */
 const DateTimeCell = ({ format, timeZone, locale, date, withTimeSince = true, className, dataTestId, }) => {
     if (!date) {
@@ -61,7 +61,7 @@ const TimeSince = ({ date, timeZone, locale }) => {
  * The `<ImageCell>` component is used for displaying images in a table cell.
  *
  * @param {ImageCellProps} props - The props for the Image component.
- * @returns {JSX.Element} The Image component.
+ * @returns {ReactElement} The Image component.
  */
 const ImageCell = ({ imageUrl, alt = "", width = 100, height = 100, dataTestId, ...rest }) => {
     return jsx("img", { alt: alt, "data-testid": dataTestId, height: height, src: imageUrl, width: width, ...rest });
@@ -71,7 +71,7 @@ const ImageCell = ({ imageUrl, alt = "", width = 100, height = 100, dataTestId,
  * The IndicatorCell is used for render an indicator in a table cell
  *
  * @param {IndicatorCellProps} props - The props for the LinkCell component
- * @returns {JSX.Element} LinkCell component
+ * @returns {ReactElement} LinkCell component
  */
 const IndicatorCell = ({ ...rest }) => {
     return jsx(Indicator, { ...rest });
@@ -81,7 +81,7 @@ const IndicatorCell = ({ ...rest }) => {
  * The LinkCell is used for render a list of tags in a table cell
  *
  * @param {LinkCellProps} props - The props for the LinkCell component
- * @returns {JSX.Element} LinkCell component
+ * @returns {ReactElement} LinkCell component
  */
 const LinkCell = ({ link, type, ...rest }) => {
     const linkPrefix = type === "LINK" ? "" : type === "PHONE" ? "tel:" : "mailto:";
@@ -100,7 +100,7 @@ const cvaSecondaryRowText = cvaMerge(["overflow-hidden", "text-ellipsis", "text-
  * The MultiRowTableCell component helps to display two rows inside a table cell.
  *
  * @param {MultiRowTableCellProps} props - The props for the MultiRowTableCell component
- * @returns {JSX.Element} MultiRowTableCell component
+ * @returns {ReactElement} MultiRowTableCell component
  */
 const MultiRowTableCell = ({ main, secondary, dataTestId, className }) => {
     return (jsx("div", { className: cvaMultiRowTableCell({ className }), children: jsxs("section", { className: cvaMultiRowTableCellSection(), "data-testid": dataTestId, children: [typeof main === "string" ? jsx("div", { className: cvaMainRowText(), children: main }) : main, secondary && typeof secondary === "string" ? (jsx("div", { className: cvaSecondaryRowText(), children: secondary })) : (secondary)] }) }));
@@ -114,7 +114,7 @@ const cvaMultiValueTextCellTooltip = cvaMerge(["whitespace-no-wrap", "overflow-h
  * The text content is not editable and will be truncated if the cell is too narrow.
  *
  * @param {MultiValueTextCellProps} props - The props for the MultiValueTextCell component
- * @returns {JSX.Element} MultiValueTextCell component
+ * @returns {ReactElement} MultiValueTextCell component
  */
 const MultiValueTextCell = ({ content, count, countTooltip, icon, iconTooltip, dataTestId, className, }) => {
     const [isTooltipVisible, setIsTooltipVisible] = useState(false);
@@ -128,7 +128,7 @@ const MultiValueTextCell = ({ content, count, countTooltip, icon, iconTooltip, d
  * The NoticeCell is used for rendering a Notice in a table cell
  *
  * @param {NoticeCellProps} props - The props for the NoticeCell component
- * @returns {JSX.Element} NoticeCell component
+ * @returns {ReactElement} NoticeCell component
  */
 const NoticeCell = ({ ...rest }) => {
     return jsx(Notice, { ...rest });
@@ -147,7 +147,7 @@ const cvaNumberCell = cvaMerge([
  * The `<NumberCell>` component is used for displaying numbers with units in a table cell.
  *
  * @param {NumberCellProps} props - The props for the NumberCell component.
- * @returns {JSX.Element} A React JSX element representing the NumberCell component.
+ * @returns {ReactElement} A React JSX element representing the NumberCell component.
  */
 const NumberCell = ({ value = "", unit, className, dataTestId }) => {
     return (jsxs("div", { className: cvaNumberCell({ className }), "data-testid": dataTestId, children: [jsx("span", { children: value }), value && unit ? jsx("span", { children: unit }) : null] }));
@@ -161,7 +161,7 @@ const cvaDateTimeSince = cvaMerge(["slashed-zero", "text-neutral-500", "text-sm"
  * PlainDateCell is used for render a date and or time in a table cell.
  *
  * @param {PlainDateCellProps} props - The props for the PlainDateCell component
- * @returns {JSX.Element} PlainDateCell component
+ * @returns {ReactElement} PlainDateCell component
  */
 const PlainDateCell = ({ locale, date, withDaysSince = true, className, dataTestId }) => {
     if (!date) {
@@ -265,7 +265,7 @@ const cvaSortIndicator = cvaMerge([
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TableRootProps} props - The props for the TableRoot component
- * @returns {JSX.Element} TableRoot component
+ * @returns {ReactElement} TableRoot component
  */
 const TableRoot = ({ dataTestId, className, children, ...rest }) => {
     return (jsx("table", { className: cvaTableRoot({ className }), "data-testid": dataTestId, ...rest, children: children }));
@@ -278,7 +278,7 @@ const cvaTagsCell = cvaMerge(["flex", "gap-2"]);
  * The TagsCell is used for render a list of tags in a table cell
  *
  * @param {TagsCellProps} props - The props for the TagsCell component
- * @returns {JSX.Element} TagsCell component
+ * @returns {ReactElement} TagsCell component
  */
 const TagsCell = ({ className, tags, dataTestId }) => {
     return (jsx("div", { className: cvaTagsCell({ className }), "data-testid": dataTestId, children: tags.map((tag, index) => (jsx(Tag, { color: "primary",
@@ -294,7 +294,7 @@ const TagsCell = ({ className, tags, dataTestId }) => {
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TbodyProps} props - The props for the Tbody component
- * @returns {JSX.Element} Tbody component
+ * @returns {ReactElement} Tbody component
  */
 const Tbody = ({ dataTestId, className, children, ...rest }) => {
     return (jsx("tbody", { className: className, "data-testid": dataTestId, ...rest, children: children }));
@@ -308,7 +308,7 @@ const Tbody = ({ dataTestId, className, children, ...rest }) => {
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TdProps} props - The props for the Td component
- * @returns {JSX.Element} Td component
+ * @returns {ReactElement} Td component
  */
 const Td = ({ dataTestId, className, children, ...rest }) => {
     return (jsx("td", { className: cvaTd({ className }), "data-testid": dataTestId, ...rest, children: children }));
@@ -323,7 +323,7 @@ const cvaTextCellTooltip = cvaMerge(["grid"]);
  * The text is not editable and will be truncated if the cell is too narrow.
  *
  * @param {TextCellProps} props - The props for the TextCell component
- * @returns {JSX.Element} TextCell component
+ * @returns {ReactElement} TextCell component
  */
 const TextCell = ({ content = "", className, dataTestId }) => {
     const [isTooltipVisible, setIsTooltipVisible] = useState(false);
@@ -341,7 +341,7 @@ const TextCell = ({ content = "", className, dataTestId }) => {
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TfootProps} props - The props for the Tfoot component
- * @returns {JSX.Element} Tfoot component
+ * @returns {ReactElement} Tfoot component
  */
 const Tfoot = ({ dataTestId, className, children, ...rest }) => {
     return (jsx("tfoot", { className: className, "data-testid": dataTestId, ...rest, children: children }));
@@ -355,7 +355,7 @@ const Tfoot = ({ dataTestId, className, children, ...rest }) => {
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {ThProps} props - The props for the Th component
- * @returns {JSX.Element} Th component
+ * @returns {ReactElement} Th component
  */
 const Th = ({ dataTestId, className, children, tooltipLabel, ...rest }) => {
     const [showToolTip, setShowTooltipVisible] = useState(false);
@@ -385,7 +385,7 @@ const cvaChildrenContainer = cvaMerge(["max-w-full", "px-3", "py-table-spacing"]
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TheadProps} props - The props for the Thead component
- * @returns {JSX.Element} Thead component
+ * @returns {ReactElement} Thead component
  */
 const Thead = ({ dataTestId, className, children, sticky = true, ...rest }) => {
     return (jsx("thead", { className: cvaThead({ sticky, className }), "data-testid": dataTestId, ...rest, children: children }));
@@ -410,7 +410,7 @@ const cvaThead = cvaMerge(["bg-neutral-100", "text-left"], {
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TrProps} props - The props for the Tr component
- * @returns {JSX.Element} Tr component
+ * @returns {ReactElement} Tr component
  */
 const Tr = ({ dataTestId, className, children, layout = "default", ...rest }) => {
     return (jsx("tr", { className: cvaTr({ layout, className }), "data-testid": dataTestId, role: "row", ...rest, children: children }));

package/package.json

@@ -1,20 +1,20 @@
 {
   "name": "@trackunit/react-table-base-components",
-  "version": "1.3.26",
+  "version": "1.3.32",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
     "node": ">=20.x"
   },
   "dependencies": {
-    "react": "18.3.1",
+    "react": "19.0.0",
     "@js-temporal/polyfill": "^0.4.4",
-    "@trackunit/react-components": "1.4.21",
-    "@trackunit/ui-icons": "1.3.21",
-    "@trackunit/react-form-components": "1.3.26",
-    "@trackunit/css-class-variance-utilities": "1.3.21",
-    "@trackunit/date-and-time-utils": "1.3.21",
-    "@trackunit/shared-utils": "1.5.21"
+    "@trackunit/react-components": "1.4.27",
+    "@trackunit/ui-icons": "1.3.27",
+    "@trackunit/react-form-components": "1.3.32",
+    "@trackunit/css-class-variance-utilities": "1.3.27",
+    "@trackunit/date-and-time-utils": "1.3.27",
+    "@trackunit/shared-utils": "1.5.27"
   },
   "module": "./index.esm.js",
   "main": "./index.cjs.js",

package/src/components/ButtonCell/ButtonCell.d.ts

@@ -10,6 +10,6 @@ export interface ButtonCellProps extends ButtonCommonProps {
  * The ButtonCell is used to render buttons in a table cell
  *
  * @param {ButtonCellProps} props - The props for the ButtonCell component
- * @returns {JSX.Element} ButtonCell component
+ * @returns {ReactElement} ButtonCell component
  */
 export declare const ButtonCell: ({ dataTestId, children, iconName, iconColor, variant, ...rest }: ButtonCellProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/CheckboxCell/CheckboxCell.d.ts

@@ -7,6 +7,6 @@ export interface CheckboxCellProps extends CommonProps {
  * The checkbox is not editable.
  *
  * @param {CheckboxCellProps} props - The props for the CheckboxCell component
- * @returns {JSX.Element} CheckboxCell component
+ * @returns {ReactElement} CheckboxCell component
  */
 export declare const CheckboxCell: ({ checked, className, dataTestId }: CheckboxCellProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/DateTimeCell/DateTimeCell.d.ts

@@ -34,7 +34,7 @@ export interface DateTimeCellProps extends CommonProps {
  * DateTimeCell is used for render a date and or time in a table cell.
  *
  * @param {DateTimeCellProps} props - The props for the DateTimeCell component
- * @returns {JSX.Element} DateTimeCell component
+ * @returns {ReactElement} DateTimeCell component
  */
 export declare const DateTimeCell: ({ format, timeZone, locale, date, withTimeSince, className, dataTestId, }: DateTimeCellProps) => import("react/jsx-runtime").JSX.Element | null;
 export interface TimeSinceProps extends Pick<DateTimeCellProps, "date" | "timeZone" | "locale"> {

package/src/components/ImageCell/ImageCell.d.ts

@@ -25,6 +25,6 @@ export interface ImageCellProps extends CommonProps {
  * The `<ImageCell>` component is used for displaying images in a table cell.
  *
  * @param {ImageCellProps} props - The props for the Image component.
- * @returns {JSX.Element} The Image component.
+ * @returns {ReactElement} The Image component.
  */
 export declare const ImageCell: ({ imageUrl, alt, width, height, dataTestId, ...rest }: ImageCellProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/IndicatorCell/IndicatorCell.d.ts

@@ -1,9 +1,10 @@
 import { IndicatorProps } from "@trackunit/react-components";
+import { ReactElement } from "react";
 export interface IndicatorCellProps extends IndicatorProps, React.HTMLAttributes<HTMLTableSectionElement> {
     /**
      * The icon to be rendered inside the indicator component
      */
-    icon: JSX.Element;
+    icon: ReactElement;
     /**
      * A color token used to style the icon and the icon background
      */
@@ -29,6 +30,6 @@ export interface IndicatorCellProps extends IndicatorProps, React.HTMLAttributes
  * The IndicatorCell is used for render an indicator in a table cell
  *
  * @param {IndicatorCellProps} props - The props for the LinkCell component
- * @returns {JSX.Element} LinkCell component
+ * @returns {ReactElement} LinkCell component
  */
 export declare const IndicatorCell: ({ ...rest }: IndicatorCellProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/LinkCell/LinkCell.d.ts

@@ -1,5 +1,6 @@
 import { CommonProps } from "@trackunit/react-components";
-export interface LinkCellProps extends CommonProps, React.HTMLAttributes<HTMLTableSectionElement> {
+import { HTMLAttributes } from "react";
+export interface LinkCellProps extends CommonProps, HTMLAttributes<HTMLTableSectionElement> {
     /**
      * A id that can be used in tests to get the component
      */
@@ -21,6 +22,6 @@ export interface LinkCellProps extends CommonProps, React.HTMLAttributes<HTMLTab
  * The LinkCell is used for render a list of tags in a table cell
  *
  * @param {LinkCellProps} props - The props for the LinkCell component
- * @returns {JSX.Element} LinkCell component
+ * @returns {ReactElement} LinkCell component
  */
 export declare const LinkCell: ({ link, type, ...rest }: LinkCellProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/MultiRowTableCell/MultiRowTableCell.d.ts

@@ -1,18 +1,19 @@
 import { CommonProps } from "@trackunit/react-components";
+import { ReactNode } from "react";
 export interface MultiRowTableCellProps extends CommonProps {
     /**
      * Main row of the cell.
      */
-    main: React.ReactNode;
+    main: ReactNode;
     /**
      * Secondary row of the cell rendered below the main row.
      */
-    secondary: React.ReactNode;
+    secondary: ReactNode;
 }
 /**
  * The MultiRowTableCell component helps to display two rows inside a table cell.
  *
  * @param {MultiRowTableCellProps} props - The props for the MultiRowTableCell component
- * @returns {JSX.Element} MultiRowTableCell component
+ * @returns {ReactElement} MultiRowTableCell component
  */
 export declare const MultiRowTableCell: ({ main, secondary, dataTestId, className }: MultiRowTableCellProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/MultiValueTextCell/MultiValueTextCell.d.ts

@@ -1,7 +1,7 @@
 import { CommonProps } from "@trackunit/react-components";
-import { ReactNode } from "react";
+import { ReactElement, ReactNode } from "react";
 export interface MultiValueTextCellProps extends CommonProps {
-    icon?: JSX.Element;
+    icon?: ReactElement;
     iconTooltip?: string;
     content?: string;
     count?: number | null;
@@ -12,6 +12,6 @@ export interface MultiValueTextCellProps extends CommonProps {
  * The text content is not editable and will be truncated if the cell is too narrow.
  *
  * @param {MultiValueTextCellProps} props - The props for the MultiValueTextCell component
- * @returns {JSX.Element} MultiValueTextCell component
+ * @returns {ReactElement} MultiValueTextCell component
  */
 export declare const MultiValueTextCell: ({ content, count, countTooltip, icon, iconTooltip, dataTestId, className, }: MultiValueTextCellProps) => import("react/jsx-runtime").JSX.Element | null;

package/src/components/NoticeCell/NoticeCell.d.ts

@@ -5,6 +5,6 @@ export interface NoticeCellProps extends NoticeProps {
  * The NoticeCell is used for rendering a Notice in a table cell
  *
  * @param {NoticeCellProps} props - The props for the NoticeCell component
- * @returns {JSX.Element} NoticeCell component
+ * @returns {ReactElement} NoticeCell component
  */
 export declare const NoticeCell: ({ ...rest }: NoticeCellProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/NumberCell/NumberCell.d.ts

@@ -22,6 +22,6 @@ export interface NumberCellProps extends CommonProps {
  * The `<NumberCell>` component is used for displaying numbers with units in a table cell.
  *
  * @param {NumberCellProps} props - The props for the NumberCell component.
- * @returns {JSX.Element} A React JSX element representing the NumberCell component.
+ * @returns {ReactElement} A React JSX element representing the NumberCell component.
  */
 export declare const NumberCell: ({ value, unit, className, dataTestId }: NumberCellProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/PlainDateCell/PlainDateCell.d.ts

@@ -23,7 +23,7 @@ export interface PlainDateCellProps extends CommonProps {
  * PlainDateCell is used for render a date and or time in a table cell.
  *
  * @param {PlainDateCellProps} props - The props for the PlainDateCell component
- * @returns {JSX.Element} PlainDateCell component
+ * @returns {ReactElement} PlainDateCell component
  */
 export declare const PlainDateCell: ({ locale, date, withDaysSince, className, dataTestId }: PlainDateCellProps) => import("react/jsx-runtime").JSX.Element | null;
 export interface DaysSinceProps extends Pick<PlainDateCellProps, "date" | "locale"> {

package/src/components/TableRoot.d.ts

@@ -1,6 +1,6 @@
 import { CommonProps } from "@trackunit/react-components";
-import { ReactNode } from "react";
-export interface TableRootProps extends CommonProps, React.HTMLAttributes<HTMLTableElement> {
+import { HTMLAttributes, ReactNode } from "react";
+export interface TableRootProps extends CommonProps, HTMLAttributes<HTMLTableElement> {
     /**
      * A id that can be used in tests to get the component
      */
@@ -22,6 +22,6 @@ export interface TableRootProps extends CommonProps, React.HTMLAttributes<HTMLTa
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TableRootProps} props - The props for the TableRoot component
- * @returns {JSX.Element} TableRoot component
+ * @returns {ReactElement} TableRoot component
  */
 export declare const TableRoot: ({ dataTestId, className, children, ...rest }: TableRootProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/TagsCell/TagsCell.d.ts

@@ -1,5 +1,6 @@
 import { CommonProps, TagProps } from "@trackunit/react-components";
-export interface TagsCellProps extends CommonProps, React.HTMLAttributes<HTMLTableSectionElement> {
+import { HTMLAttributes } from "react";
+export interface TagsCellProps extends CommonProps, HTMLAttributes<HTMLTableSectionElement> {
     /**
      * A id that can be used in tests to get the component
      */
@@ -17,6 +18,6 @@ export interface TagsCellProps extends CommonProps, React.HTMLAttributes<HTMLTab
  * The TagsCell is used for render a list of tags in a table cell
  *
  * @param {TagsCellProps} props - The props for the TagsCell component
- * @returns {JSX.Element} TagsCell component
+ * @returns {ReactElement} TagsCell component
  */
 export declare const TagsCell: ({ className, tags, dataTestId }: TagsCellProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/Tbody.d.ts

@@ -1,6 +1,6 @@
 import { CommonProps } from "@trackunit/react-components";
-import { ReactNode } from "react";
-export interface TbodyProps extends CommonProps, React.HTMLAttributes<HTMLTableSectionElement> {
+import { HTMLAttributes, ReactNode } from "react";
+export interface TbodyProps extends CommonProps, HTMLAttributes<HTMLTableSectionElement> {
     /**
      * A id that can be used in tests to get the component
      */
@@ -22,6 +22,6 @@ export interface TbodyProps extends CommonProps, React.HTMLAttributes<HTMLTableS
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TbodyProps} props - The props for the Tbody component
- * @returns {JSX.Element} Tbody component
+ * @returns {ReactElement} Tbody component
  */
 export declare const Tbody: ({ dataTestId, className, children, ...rest }: TbodyProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/Td.d.ts

@@ -1,6 +1,6 @@
 import { CommonProps } from "@trackunit/react-components";
-import { ReactNode } from "react";
-export interface TdProps extends CommonProps, React.HTMLAttributes<HTMLTableCellElement> {
+import { HTMLAttributes, ReactNode } from "react";
+export interface TdProps extends CommonProps, HTMLAttributes<HTMLTableCellElement> {
     /**
      * A id that can be used in tests to get the component
      */
@@ -22,6 +22,6 @@ export interface TdProps extends CommonProps, React.HTMLAttributes<HTMLTableCell
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TdProps} props - The props for the Td component
- * @returns {JSX.Element} Td component
+ * @returns {ReactElement} Td component
  */
 export declare const Td: ({ dataTestId, className, children, ...rest }: TdProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/TextCell/TextCell.d.ts

@@ -7,6 +7,6 @@ export interface TextCellProps extends CommonProps {
  * The text is not editable and will be truncated if the cell is too narrow.
  *
  * @param {TextCellProps} props - The props for the TextCell component
- * @returns {JSX.Element} TextCell component
+ * @returns {ReactElement} TextCell component
  */
 export declare const TextCell: ({ content, className, dataTestId }: TextCellProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/Tfoot.d.ts

@@ -1,6 +1,6 @@
 import { CommonProps } from "@trackunit/react-components";
-import { ReactNode } from "react";
-export interface TfootProps extends CommonProps, React.HTMLAttributes<HTMLTableSectionElement> {
+import { HTMLAttributes, ReactNode } from "react";
+export interface TfootProps extends CommonProps, HTMLAttributes<HTMLTableSectionElement> {
     /**
      * A id that can be used in tests to get the component
      */
@@ -22,6 +22,6 @@ export interface TfootProps extends CommonProps, React.HTMLAttributes<HTMLTableS
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TfootProps} props - The props for the Tfoot component
- * @returns {JSX.Element} Tfoot component
+ * @returns {ReactElement} Tfoot component
  */
 export declare const Tfoot: ({ dataTestId, className, children, ...rest }: TfootProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/Th.d.ts

@@ -26,6 +26,6 @@ export interface ThProps extends CommonProps, React.HTMLAttributes<HTMLTableCell
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {ThProps} props - The props for the Th component
- * @returns {JSX.Element} Th component
+ * @returns {ReactElement} Th component
  */
 export declare const Th: ({ dataTestId, className, children, tooltipLabel, ...rest }: ThProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/Thead.d.ts

@@ -1,6 +1,6 @@
 import { CommonProps } from "@trackunit/react-components";
-import { ReactNode } from "react";
-export interface TheadProps extends CommonProps, React.HTMLAttributes<HTMLTableSectionElement> {
+import { HTMLAttributes, ReactNode } from "react";
+export interface TheadProps extends CommonProps, HTMLAttributes<HTMLTableSectionElement> {
     /**
      * A id that can be used in tests to get the component
      */
@@ -29,6 +29,6 @@ export interface TheadProps extends CommonProps, React.HTMLAttributes<HTMLTableS
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TheadProps} props - The props for the Thead component
- * @returns {JSX.Element} Thead component
+ * @returns {ReactElement} Thead component
  */
 export declare const Thead: ({ dataTestId, className, children, sticky, ...rest }: TheadProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/Tr.d.ts

@@ -1,6 +1,6 @@
 import { CommonProps } from "@trackunit/react-components";
-import { ReactNode } from "react";
-export interface TrProps extends CommonProps, React.HTMLAttributes<HTMLTableRowElement> {
+import { HTMLAttributes, ReactNode } from "react";
+export interface TrProps extends CommonProps, HTMLAttributes<HTMLTableRowElement> {
     /**
      * A id that can be used in tests to get the component
      */
@@ -30,6 +30,6 @@ export interface TrProps extends CommonProps, React.HTMLAttributes<HTMLTableRowE
  * However, if you need to construct a custom table, the Table Base Components can be utilized.
  *
  * @param {TrProps} props - The props for the Tr component
- * @returns {JSX.Element} Tr component
+ * @returns {ReactElement} Tr component
  */
 export declare const Tr: ({ dataTestId, className, children, layout, ...rest }: TrProps) => import("react/jsx-runtime").JSX.Element;