@jobber/components 4.90.2 → 4.90.3

package/dist/DataListSortingOptions-DpPwd-YR.js

@@ -0,0 +1,35 @@
+import React, { useEffect } from 'react';
+import { u as useOnKeyDown_2 } from './useOnKeyDown-BBUzTpsM.js';
+import { u as useRefocusOnActivator_2 } from './useRefocusOnActivator-JhjmSWbr.js';
+import { I as Icon } from './Icon-Cprfa6DH.js';
+
+var styles = {"optionsList":"thBUfVNaigs-","option":"QaXuqbVjG04-"};
+
+function DataListSortingOptions({ options, selectedOption, onSelectChange, onClose, optionsListRef, dataListHeaderTileRef, }) {
+    useRefocusOnActivator_2(!optionsListRef.current);
+    useOnKeyDown_2(() => onClose(), "Escape");
+    useEffect(() => {
+        document.addEventListener("mousedown", handleClickOutside);
+        return () => {
+            document.removeEventListener("mousedown", handleClickOutside);
+        };
+    }, [optionsListRef, dataListHeaderTileRef, onClose]);
+    return (React.createElement("ul", { className: styles.optionsList, ref: optionsListRef }, options.map(option => (React.createElement("li", { className: styles.option, key: `${option.id}${option.order}`, onClick: () => onSelectChange(option), onKeyDown: event => handleKeyDown(event, option), tabIndex: 0, "data-value": option.id },
+        option.label,
+        option.label === (selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.label) && (React.createElement(Icon, { name: "checkmark", color: "blue" })))))));
+    function handleKeyDown(event, option) {
+        if (event.key === "Enter") {
+            onSelectChange(option);
+        }
+    }
+    function handleClickOutside(event) {
+        var _a, _b;
+        const isClickInside = ((_a = optionsListRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.target)) ||
+            ((_b = dataListHeaderTileRef.current) === null || _b === void 0 ? void 0 : _b.contains(event.target));
+        if (!isClickInside) {
+            onClose();
+        }
+    }
+}
+
+export { DataListSortingOptions as D };

package/dist/DataListSortingOptions-nk9dclSJ.js

@@ -0,0 +1,37 @@
+'use strict';
+
+var React = require('react');
+var useOnKeyDown = require('./useOnKeyDown-ClBoAl9o.js');
+var useRefocusOnActivator = require('./useRefocusOnActivator-DhXYZbJ2.js');
+var Icon = require('./Icon-DN6zZdoZ.js');
+
+var styles = {"optionsList":"thBUfVNaigs-","option":"QaXuqbVjG04-"};
+
+function DataListSortingOptions({ options, selectedOption, onSelectChange, onClose, optionsListRef, dataListHeaderTileRef, }) {
+    useRefocusOnActivator.useRefocusOnActivator_2(!optionsListRef.current);
+    useOnKeyDown.useOnKeyDown_2(() => onClose(), "Escape");
+    React.useEffect(() => {
+        document.addEventListener("mousedown", handleClickOutside);
+        return () => {
+            document.removeEventListener("mousedown", handleClickOutside);
+        };
+    }, [optionsListRef, dataListHeaderTileRef, onClose]);
+    return (React.createElement("ul", { className: styles.optionsList, ref: optionsListRef }, options.map(option => (React.createElement("li", { className: styles.option, key: `${option.id}${option.order}`, onClick: () => onSelectChange(option), onKeyDown: event => handleKeyDown(event, option), tabIndex: 0, "data-value": option.id },
+        option.label,
+        option.label === (selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.label) && (React.createElement(Icon.Icon, { name: "checkmark", color: "blue" })))))));
+    function handleKeyDown(event, option) {
+        if (event.key === "Enter") {
+            onSelectChange(option);
+        }
+    }
+    function handleClickOutside(event) {
+        var _a, _b;
+        const isClickInside = ((_a = optionsListRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.target)) ||
+            ((_b = dataListHeaderTileRef.current) === null || _b === void 0 ? void 0 : _b.contains(event.target));
+        if (!isClickInside) {
+            onClose();
+        }
+    }
+}
+
+exports.DataListSortingOptions = DataListSortingOptions;

package/dist/DataListStatusBar-Cq2c6T6R.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import { g as getCompoundComponent } from './DataList.utils-DhJ6Bzfb.js';
+import { u as useDataListContext } from './DataListContext-BQjPQQPp.js';
+
+// This component is meant to capture the props of the DataList.Filters
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+function DataListStatusBar(_) {
+    return null;
+}
+/**
+ * Renders the DataList.StatusBar component
+ */
+function InternalDataListStatusBar() {
+    const { children: parentChildren } = useDataListContext();
+    const component = getCompoundComponent(parentChildren, DataListStatusBar);
+    if (!component)
+        return null;
+    const children = component === null || component === void 0 ? void 0 : component.props.children;
+    return React.createElement(React.Fragment, null, children);
+}
+
+export { DataListStatusBar as D, InternalDataListStatusBar as I };

package/dist/DataListStatusBar-DoDXKGHi.js

@@ -0,0 +1,25 @@
+'use strict';
+
+var React = require('react');
+var DataList_utils = require('./DataList.utils-nlVavDa-.js');
+var DataListContext = require('./DataListContext-54s0cQ2-.js');
+
+// This component is meant to capture the props of the DataList.Filters
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+function DataListStatusBar(_) {
+    return null;
+}
+/**
+ * Renders the DataList.StatusBar component
+ */
+function InternalDataListStatusBar() {
+    const { children: parentChildren } = DataListContext.useDataListContext();
+    const component = DataList_utils.getCompoundComponent(parentChildren, DataListStatusBar);
+    if (!component)
+        return null;
+    const children = component === null || component === void 0 ? void 0 : component.props.children;
+    return React.createElement(React.Fragment, null, children);
+}
+
+exports.DataListStatusBar = DataListStatusBar;
+exports.InternalDataListStatusBar = InternalDataListStatusBar;

package/dist/DataListStickyHeader-6xUwJJD7.js

@@ -0,0 +1,23 @@
+import classnames from 'classnames';
+import React, { useState, useRef, useCallback, useEffect } from 'react';
+import { a as DATA_LIST_STICKY_HEADER_TEST_ID } from './DataList.const-D7NaHwv2.js';
+
+var styles = {"header":"PGOHzrMh374-","stuck":"PGjWc5ocjpI-"};
+
+function DataListStickyHeader({ children }) {
+    const [isStuck, setIsStuck] = useState(false);
+    const ref = useRef(null);
+    const handleObserver = useCallback(([e]) => setIsStuck(e.intersectionRatio < 1), [setIsStuck]);
+    useEffect(() => {
+        if (!window.IntersectionObserver)
+            return;
+        const observer = new IntersectionObserver(handleObserver, { threshold: 1 });
+        ref.current && observer.observe(ref.current);
+        return () => {
+            ref.current && observer.unobserve(ref.current);
+        };
+    }, [handleObserver, ref.current]);
+    return (React.createElement("div", { "data-testid": DATA_LIST_STICKY_HEADER_TEST_ID, ref: ref, className: classnames(styles.header, { [styles.stuck]: isStuck }) }, children));
+}
+
+export { DataListStickyHeader as D };

package/dist/DataListStickyHeader-xrbxWP2I.js

@@ -0,0 +1,25 @@
+'use strict';
+
+var classnames = require('classnames');
+var React = require('react');
+var DataList_const = require('./DataList.const-DD8VmZp1.js');
+
+var styles = {"header":"PGOHzrMh374-","stuck":"PGjWc5ocjpI-"};
+
+function DataListStickyHeader({ children }) {
+    const [isStuck, setIsStuck] = React.useState(false);
+    const ref = React.useRef(null);
+    const handleObserver = React.useCallback(([e]) => setIsStuck(e.intersectionRatio < 1), [setIsStuck]);
+    React.useEffect(() => {
+        if (!window.IntersectionObserver)
+            return;
+        const observer = new IntersectionObserver(handleObserver, { threshold: 1 });
+        ref.current && observer.observe(ref.current);
+        return () => {
+            ref.current && observer.unobserve(ref.current);
+        };
+    }, [handleObserver, ref.current]);
+    return (React.createElement("div", { "data-testid": DataList_const.DATA_LIST_STICKY_HEADER_TEST_ID, ref: ref, className: classnames(styles.header, { [styles.stuck]: isStuck }) }, children));
+}
+
+exports.DataListStickyHeader = DataListStickyHeader;

package/dist/DataListTags-69zAArZ2.js

@@ -0,0 +1,64 @@
+'use strict';
+
+var React = require('react');
+var classnames = require('classnames');
+var InlineLabel = require('./InlineLabel-DpGHWyZ1.js');
+var Text = require('./Text-Bopx9dUr.js');
+
+var styles = {"tagWrapper":"_8MYxAQYdZzM-","tags":"WRV-UmQmPzo-","tagsMask":"ND-cN-mX5-c-","tagCount":"liQeWCMenD0-"};
+
+function DataListTags({ items }) {
+    const ref = React.useRef(null);
+    const [visibleIndex, setVisibleIndex] = React.useState([]);
+    const visibleItems = visibleIndex.filter(Boolean).length;
+    const shouldShowTagCount = Boolean(visibleItems);
+    React.useEffect(() => {
+        var _a;
+        if (!window.IntersectionObserver)
+            return;
+        setVisibleIndex([]);
+        const observer = new IntersectionObserver(handleIntersection, {
+            root: ref.current,
+            threshold: buildIntersectionThreshold(items),
+        });
+        const elements = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.querySelectorAll("[data-tag-element]");
+        elements === null || elements === void 0 ? void 0 : elements.forEach(element => observer.observe(element));
+        return () => {
+            elements === null || elements === void 0 ? void 0 : elements.forEach(element => observer.unobserve(element));
+        };
+    }, [items]);
+    return (React.createElement("div", { className: styles.tagWrapper, ref: ref },
+        React.createElement("div", { className: classnames(styles.tags, {
+                [styles.tagsMask]: shouldShowTagCount,
+            }) }, items.filter(Boolean).map((tag, index) => (React.createElement("div", { key: tag, "data-tag-element": index },
+            React.createElement(InlineLabel.InlineLabel, null, tag))))),
+        shouldShowTagCount && (React.createElement("div", { className: styles.tagCount },
+            React.createElement(Text.Text, null,
+                "+",
+                visibleItems)))));
+    function handleIntersection(...[entries]) {
+        entries.forEach(entry => {
+            const index = entry.target.getAttribute("data-tag-element");
+            const indexNumber = Number(index);
+            if (!index || isNaN(indexNumber))
+                return;
+            setVisibleIndex(prevState => {
+                const newState = [...prevState];
+                newState[indexNumber] = entry.intersectionRatio !== 1;
+                return newState;
+            });
+        });
+    }
+}
+function buildIntersectionThreshold(items) {
+    const thresholds = [];
+    const totalItems = items.length;
+    for (let i = 1.0; i <= totalItems; i++) {
+        const ratio = i / totalItems;
+        thresholds.push(ratio);
+    }
+    thresholds.push(0);
+    return thresholds;
+}
+
+exports.DataListTags = DataListTags;

package/dist/DataListTags-Ck_VOCzy.js

@@ -0,0 +1,62 @@
+import React, { useRef, useState, useEffect } from 'react';
+import classnames from 'classnames';
+import { I as InlineLabel } from './InlineLabel-DjcM6md2.js';
+import { T as Text } from './Text-DALHhxHl.js';
+
+var styles = {"tagWrapper":"_8MYxAQYdZzM-","tags":"WRV-UmQmPzo-","tagsMask":"ND-cN-mX5-c-","tagCount":"liQeWCMenD0-"};
+
+function DataListTags({ items }) {
+    const ref = useRef(null);
+    const [visibleIndex, setVisibleIndex] = useState([]);
+    const visibleItems = visibleIndex.filter(Boolean).length;
+    const shouldShowTagCount = Boolean(visibleItems);
+    useEffect(() => {
+        var _a;
+        if (!window.IntersectionObserver)
+            return;
+        setVisibleIndex([]);
+        const observer = new IntersectionObserver(handleIntersection, {
+            root: ref.current,
+            threshold: buildIntersectionThreshold(items),
+        });
+        const elements = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.querySelectorAll("[data-tag-element]");
+        elements === null || elements === void 0 ? void 0 : elements.forEach(element => observer.observe(element));
+        return () => {
+            elements === null || elements === void 0 ? void 0 : elements.forEach(element => observer.unobserve(element));
+        };
+    }, [items]);
+    return (React.createElement("div", { className: styles.tagWrapper, ref: ref },
+        React.createElement("div", { className: classnames(styles.tags, {
+                [styles.tagsMask]: shouldShowTagCount,
+            }) }, items.filter(Boolean).map((tag, index) => (React.createElement("div", { key: tag, "data-tag-element": index },
+            React.createElement(InlineLabel, null, tag))))),
+        shouldShowTagCount && (React.createElement("div", { className: styles.tagCount },
+            React.createElement(Text, null,
+                "+",
+                visibleItems)))));
+    function handleIntersection(...[entries]) {
+        entries.forEach(entry => {
+            const index = entry.target.getAttribute("data-tag-element");
+            const indexNumber = Number(index);
+            if (!index || isNaN(indexNumber))
+                return;
+            setVisibleIndex(prevState => {
+                const newState = [...prevState];
+                newState[indexNumber] = entry.intersectionRatio !== 1;
+                return newState;
+            });
+        });
+    }
+}
+function buildIntersectionThreshold(items) {
+    const thresholds = [];
+    const totalItems = items.length;
+    for (let i = 1.0; i <= totalItems; i++) {
+        const ratio = i / totalItems;
+        thresholds.push(ratio);
+    }
+    thresholds.push(0);
+    return thresholds;
+}
+
+export { DataListTags as D };

package/dist/DataListTotalCount-CJZ9FD36.js

@@ -0,0 +1,27 @@
+'use strict';
+
+var React = require('react');
+var Text = require('./Text-Bopx9dUr.js');
+var Glimmer = require('./Glimmer-CnsLTogn.js');
+
+var styles = {"results":"F56prQsXm3A-"};
+
+const DATALIST_TOTALCOUNT_TEST_ID = "ATL-DataList-TotalCount";
+function DataListTotalCount({ totalCount, loading, }) {
+    if (totalCount === undefined)
+        return null;
+    let output = null;
+    if (totalCount === null && loading) {
+        output = React.createElement(Glimmer.Glimmer, { size: "auto", shape: "rectangle" });
+    }
+    if (typeof totalCount === "number") {
+        output = (React.createElement(Text.Text, { variation: "subdued" },
+            "(",
+            totalCount.toLocaleString(),
+            " results)"));
+    }
+    return (React.createElement("div", { className: styles.results, "data-testid": DATALIST_TOTALCOUNT_TEST_ID }, output));
+}
+
+exports.DATALIST_TOTALCOUNT_TEST_ID = DATALIST_TOTALCOUNT_TEST_ID;
+exports.DataListTotalCount = DataListTotalCount;

package/dist/DataListTotalCount-Cns_GwAL.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import { T as Text } from './Text-DALHhxHl.js';
+import { G as Glimmer } from './Glimmer-CVTrhX52.js';
+
+var styles = {"results":"F56prQsXm3A-"};
+
+const DATALIST_TOTALCOUNT_TEST_ID = "ATL-DataList-TotalCount";
+function DataListTotalCount({ totalCount, loading, }) {
+    if (totalCount === undefined)
+        return null;
+    let output = null;
+    if (totalCount === null && loading) {
+        output = React.createElement(Glimmer, { size: "auto", shape: "rectangle" });
+    }
+    if (typeof totalCount === "number") {
+        output = (React.createElement(Text, { variation: "subdued" },
+            "(",
+            totalCount.toLocaleString(),
+            " results)"));
+    }
+    return (React.createElement("div", { className: styles.results, "data-testid": DATALIST_TOTALCOUNT_TEST_ID }, output));
+}
+
+export { DATALIST_TOTALCOUNT_TEST_ID as D, DataListTotalCount as a };

package/dist/DataTable/index.cjs

@@ -0,0 +1,36 @@
+'use strict';
+
+var DataTable = require('../DataTable-CNVDhnqd.js');
+var helpers = require('../helpers-QJ7YD42d.js');
+var reactTable = require('@tanstack/react-table');
+require('classnames');
+require('react');
+require('../useResizeObserver-Bt-giwIv.js');
+require('../_commonjsHelpers-vq2WA-uE.js');
+require('../debounce-DNEaQL1N.js');
+require('../isObjectLike-BLBufvwS.js');
+require('../isSymbol-MYvz4htB.js');
+require('../Glimmer-CnsLTogn.js');
+require('../tslib.es6-v7P0Y776.js');
+require('../Content-BfbXarkv.js');
+require('../Option-c12Y1Noe.js');
+require('../FormField-DgvKr2RR.js');
+require('react-hook-form');
+require('../Button-C6SHw1kI.js');
+require('react-router-dom');
+require('../Icon-DN6zZdoZ.js');
+require('@jobber/design');
+require('../Typography-WLLQxuNl.js');
+require('../Text-Bopx9dUr.js');
+require('../InputValidation-CA3D4HMZ.js');
+require('framer-motion');
+require('../Spinner-L0bWOO6S.js');
+
+
+
+exports.DataTable = DataTable.DataTable;
+exports.mockContainerWidth = helpers.mockContainerWidth;
+Object.defineProperty(exports, "createColumnHelper", {
+	enumerable: true,
+	get: function () { return reactTable.createColumnHelper; }
+});

package/dist/DataTable/index.mjs

@@ -0,0 +1,25 @@
+export { D as DataTable } from '../DataTable-Bt0NOwH4.js';
+export { m as mockContainerWidth } from '../helpers-cJmOwx3u.js';
+export { createColumnHelper } from '@tanstack/react-table';
+import 'classnames';
+import 'react';
+import '../useResizeObserver-D7zJHmH-.js';
+import '../_commonjsHelpers-COf7qtKz.js';
+import '../debounce-DgeBwtKp.js';
+import '../isObjectLike-CqUyaiWM.js';
+import '../isSymbol-_Iyy_jRJ.js';
+import '../Glimmer-CVTrhX52.js';
+import '../tslib.es6-CQnq_FvL.js';
+import '../Content-DcpJaJjo.js';
+import '../Option-DLsUvwdO.js';
+import '../FormField-CevGrDGm.js';
+import 'react-hook-form';
+import '../Button-Cfp4SFrN.js';
+import 'react-router-dom';
+import '../Icon-Cprfa6DH.js';
+import '@jobber/design';
+import '../Typography-D6YoQOGF.js';
+import '../Text-DALHhxHl.js';
+import '../InputValidation-D4MvsPKI.js';
+import 'framer-motion';
+import '../Spinner-gZOK7Pbk.js';

package/dist/DataTable/test-utilities/index.cjs

@@ -0,0 +1,246 @@
+'use strict';
+
+var helpers = require('../../helpers-QJ7YD42d.js');
+require('../../useResizeObserver-Bt-giwIv.js');
+require('../../_commonjsHelpers-vq2WA-uE.js');
+require('react');
+require('../../debounce-DNEaQL1N.js');
+require('../../isObjectLike-BLBufvwS.js');
+require('../../isSymbol-MYvz4htB.js');
+
+const data = [
+    {
+        name: "Eddard",
+        house: "Stark",
+        region: "North",
+        sigil: "Direwolf",
+        isAlive: "No",
+    },
+    {
+        name: "Catelyn",
+        house: "Stark",
+        region: "North",
+        sigil: "Direwolf",
+        isAlive: "No",
+    },
+    {
+        name: "Jon Snow",
+        house: "Stark",
+        region: "North",
+        sigil: "Direwolf",
+        isAlive: "Yes",
+    },
+    {
+        name: "Robert",
+        house: "Stark",
+        region: "North",
+        sigil: "Direwolf",
+        isAlive: "No",
+    },
+    {
+        name: "Rickon",
+        house: "Stark",
+        region: "North",
+        sigil: "Direwolf",
+        isAlive: "No",
+    },
+    {
+        name: "Robert",
+        house: "Baratheon",
+        region: "Stormlands",
+        sigil: "Black Stag",
+        isAlive: "No",
+    },
+    {
+        name: "Cercei",
+        house: "Lannister",
+        region: "Westerlands",
+        sigil: "Golden Lion",
+        isAlive: "Yes",
+    },
+    {
+        name: "Sansa",
+        house: "Stark",
+        region: "North",
+        sigil: "Direwolf",
+        isAlive: "Yes",
+    },
+    {
+        name: "Arya",
+        house: "Stark",
+        region: "North",
+        sigil: "Direwolf",
+        isAlive: "Yes",
+    },
+    {
+        name: "Bran",
+        house: "Stark",
+        region: "North",
+        sigil: "Direwolf",
+        isAlive: "Yes",
+    },
+    {
+        name: "Joffrey",
+        house: "Baratheon",
+        region: "Stormlands",
+        sigil: "Black Stag",
+        isAlive: "No",
+    },
+    {
+        name: "Myrcella",
+        house: "Baratheon",
+        region: "Stormlands",
+        sigil: "Black Stag",
+        isAlive: "Yes",
+    },
+    {
+        name: "Tommen",
+        house: "Baratheon",
+        region: "Stormlands",
+        sigil: "Black Stag",
+        isAlive: "Yes",
+    },
+];
+const columns = [
+    {
+        accessorKey: "name",
+        cell: info => info.getValue(),
+        header: "Name",
+    },
+    {
+        accessorKey: "house",
+        cell: info => info.getValue(),
+        header: "House",
+    },
+    {
+        accessorKey: "region",
+        cell: info => info.getValue(),
+        header: "Region",
+    },
+    {
+        accessorKey: "sigil",
+        cell: info => info.getValue(),
+        header: "Sigil",
+    },
+    {
+        accessorKey: "isAlive",
+        accessorFn: row => (row.name === "Jon Snow" ? "Resurrected" : row.isAlive),
+        cell: info => info.getValue(),
+        header: "Alive",
+    },
+];
+const royaltyReportColumns = [
+    {
+        id: "franchiseName",
+        accessorKey: "franchiseName",
+        header: "Franchise Name",
+        footer: "Report Totals ($)",
+    },
+    {
+        id: "payment",
+        accessorKey: "payment",
+        header: "Payment ($)",
+        footer: "10,050,400",
+    },
+    {
+        id: "royaltyRate",
+        accessorKey: "royaltyRate",
+        header: "Royalty Rate (%)",
+    },
+    {
+        id: "royaltyAmount",
+        accessorKey: "royaltyAmount",
+        header: "Royalty Amount ($)",
+        footer: "300,000",
+    },
+];
+const royaltyReportData = [
+    {
+        franchiseName: "The Patch Boys of Macon and Warner Robins",
+        payment: "1,000,000",
+        royaltyRate: 5,
+        royaltyAmount: "50,000",
+    },
+    {
+        franchiseName: "The Patch Boys of San Antonio",
+        payment: "2,000,000",
+        royaltyRate: 5,
+        royaltyAmount: "40,000",
+    },
+    {
+        franchiseName: "The Patch Boys of Phoenix",
+        payment: "1,250,000",
+        royaltyRate: 8,
+        royaltyAmount: "20,000",
+    },
+];
+const columnSizeData = [
+    {
+        name: "Daenerys Stormborn of House Targaryen, the First of Her Name, Queen of the Andals and the First Men, Protector of the Seven Kingdoms, the Mother of Dragons, the Khaleesi of the Great Grass Sea, the Unburnt, the Breaker of Chains.",
+        points: "1,000,000",
+        chance: 5,
+        power: "50,000",
+    },
+    {
+        name: "Aegon “The Conqueror” Targaryen and Rhaenys Targaryen",
+        points: "2,000,000",
+        chance: 5,
+        power: "40,000",
+    },
+    {
+        name: "Jaehaerys “The Old King” Targaryen and Alysanne Targaryen",
+        points: "1,250,000",
+        chance: 8,
+        power: "20,000",
+    },
+];
+const columSizeColumns = [
+    {
+        id: "name",
+        accessorKey: "name",
+        header: "Name",
+        footer: "Totals",
+        enableResizing: false,
+        cell: (info) => info.getValue(),
+        size: 538,
+        minSize: 438,
+        maxSize: 538,
+    },
+    {
+        id: "points",
+        accessorKey: "points",
+        header: "Points",
+        footer: "10,050,400",
+        cell: (info) => info.getValue(),
+        size: 268,
+        minSize: 168,
+        maxSize: 268,
+    },
+    {
+        id: "chance",
+        accessorKey: "chance",
+        header: "Chance (%)",
+        cell: (info) => info.getValue(),
+        size: 268,
+        minSize: 168,
+        maxSize: 268,
+    },
+    {
+        id: "power",
+        accessorKey: "power",
+        header: "Power",
+        footer: "300,000",
+        cell: (info) => info.getValue(),
+        size: 268,
+        minSize: 168,
+        maxSize: 268,
+    },
+];
+
+exports.mockContainerWidth = helpers.mockContainerWidth;
+exports.columSizeColumns = columSizeColumns;
+exports.columnSizeData = columnSizeData;
+exports.columns = columns;
+exports.data = data;
+exports.royaltyReportColumns = royaltyReportColumns;
+exports.royaltyReportData = royaltyReportData;