@levi-gemcommerce/analytics 0.0.0-test.1

package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/VersionCell.d.ts

@@ -0,0 +1,11 @@
+import { IVariantType } from '../../../../../../../components/CardPathAnalysis/stores/path-analysis-campaign';
+import type { RendererProps } from './type';
+export declare const VERSION_LABEL: {
+    A: string;
+    B: string;
+};
+export declare const VERSION_OPTIONS: {
+    label: string;
+    value: IVariantType;
+}[];
+export declare const VersionCell: ({ value, previousValue, isMergedWithPrev, columnLayout }: RendererProps) => "" | import("react/jsx-runtime").JSX.Element;

package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/VersionCell.js

@@ -0,0 +1,28 @@
+"use client"
+import { jsx } from 'react/jsx-runtime';
+import { IVariantType } from '../../../../../../../components/CardPathAnalysis/stores/path-analysis-campaign.js';
+import { WrapperCell } from './WrapperCell.js';
+import { GVariantBadge } from '../../../../../../components/GVariantBadge/GVariantBadge.js';
+import '@shopify/polaris';
+import 'react';
+import '../../../../../../../utils/dayjs.js';
+import '../../../../../../../utils/analytics.js';
+import '../../../../../../../types/template.js';
+import '../../../../../../components/GVariantBadge/types.js';
+
+const VERSION_LABEL = {
+    [IVariantType.VARIANT_A]: 'Control A',
+    [IVariantType.VARIANT_B]: 'Variant B',
+};
+const VERSION_OPTIONS = [
+    { label: VERSION_LABEL[IVariantType.VARIANT_A], value: IVariantType.VARIANT_A },
+    { label: VERSION_LABEL[IVariantType.VARIANT_B], value: IVariantType.VARIANT_B },
+];
+const VersionCell = ({ value, previousValue, isMergedWithPrev, columnLayout }) => {
+    const variantValue = VERSION_OPTIONS.find((opt) => opt.label.split(' ')[1] === value);
+    if (isMergedWithPrev)
+        return '';
+    return (jsx(WrapperCell, { previousValue: previousValue, isMergedWithPrev: isMergedWithPrev, columnLayout: columnLayout, children: variantValue && (jsx(GVariantBadge, { variant: variantValue.value, tone: variantValue.value === 'A' ? 'active' : 'inactive', size: "xs" })) }));
+};
+
+export { VERSION_LABEL, VERSION_OPTIONS, VersionCell };

package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/VersionCell.mjs

@@ -0,0 +1,28 @@
+"use client"
+import { jsx } from 'react/jsx-runtime';
+import { IVariantType } from '../../../../../../../components/CardPathAnalysis/stores/path-analysis-campaign.mjs';
+import { WrapperCell } from './WrapperCell.mjs';
+import { GVariantBadge } from '../../../../../../components/GVariantBadge/GVariantBadge.mjs';
+import '@shopify/polaris';
+import 'react';
+import '../../../../../../../utils/dayjs.mjs';
+import '../../../../../../../utils/analytics.mjs';
+import '../../../../../../../types/template.mjs';
+import '../../../../../../components/GVariantBadge/types.mjs';
+
+const VERSION_LABEL = {
+    [IVariantType.VARIANT_A]: 'Control A',
+    [IVariantType.VARIANT_B]: 'Variant B',
+};
+const VERSION_OPTIONS = [
+    { label: VERSION_LABEL[IVariantType.VARIANT_A], value: IVariantType.VARIANT_A },
+    { label: VERSION_LABEL[IVariantType.VARIANT_B], value: IVariantType.VARIANT_B },
+];
+const VersionCell = ({ value, previousValue, isMergedWithPrev, columnLayout }) => {
+    const variantValue = VERSION_OPTIONS.find((opt) => opt.label.split(' ')[1] === value);
+    if (isMergedWithPrev)
+        return '';
+    return (jsx(WrapperCell, { previousValue: previousValue, isMergedWithPrev: isMergedWithPrev, columnLayout: columnLayout, children: variantValue && (jsx(GVariantBadge, { variant: variantValue.value, tone: variantValue.value === 'A' ? 'active' : 'inactive', size: "xs" })) }));
+};
+
+export { VERSION_LABEL, VERSION_OPTIONS, VersionCell };

package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/WrapperCell.d.ts

@@ -0,0 +1,10 @@
+import type { ReportColumnLayout } from '../../../types';
+import type { ReportValueType } from '../../../../../common/Visualization/types';
+interface WrapperCellProps {
+    children: React.ReactNode;
+    previousValue?: ReportValueType;
+    isMergedWithPrev: boolean;
+    columnLayout?: ReportColumnLayout;
+}
+export declare const WrapperCell: React.FC<WrapperCellProps>;
+export {};

package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/WrapperCell.js

@@ -0,0 +1,37 @@
+"use client"
+import { jsxs, jsx } from 'react/jsx-runtime';
+import '@shopify/polaris';
+import '@shopify/polaris-icons';
+import 'react';
+import '../../../../../../../utils/dayjs.js';
+import '../../../../../../../utils/analytics.js';
+import '../../../../../../../types/template.js';
+import '../../../../../../components/GTooltip/components/GTooltipCard.js';
+import '../../../../../../components/GDiv/GDiv.js';
+import 'react-i18next';
+import '../../../../../../components/GFeatureLocked/constants.js';
+import '../../../../../../components/GFeatureLocked/types.js';
+import '../../../../../../components/GPagination/GPagination.js';
+import { GInlineCenter } from '../../../../../../components/GInlineCenter/GInlineCenter.js';
+import '../../../../../../charts/components/GPolarisViz/hooks/useResizeObserver.js';
+import '../../../../../../../stores/currencyRatesStore.js';
+import '@tanstack/react-query';
+import '../../../../../../../providers/ConvertMoneyProvider.js';
+import '../../../../../../../core/gemxql/constants/row-reader-mode.js';
+import '../../../../../../../core/gemxql/types/analytic-data.js';
+import '../../../../../../../core/gemxql/types/analytic-source.js';
+import '../../../../../../../core/gemxql/types/extra-condition.js';
+import '../../../../../../../core/gemxql/types/field-filters.js';
+import '../../../../../../../core/gemxql/types/field-operators.js';
+import '../../../../../../../core/gemxql/types/group-with-clause.js';
+import '../../../../../../../core/gemxql/types/order-by.js';
+import '../../../../../../../core/gemxql/types/page-fields.js';
+import '../../../../../../../core/gemxql/types/row-reader-mode.js';
+import '../../../../../../../core/gemxql/types/time-dimension.js';
+import { PreviousCell } from './PreviousCell.js';
+
+const WrapperCell = ({ children, previousValue, isMergedWithPrev, columnLayout, }) => {
+    return (jsxs(GInlineCenter, { flexDirection: "column", align: columnLayout?.align, gap: "100", paddingBlock: "200", width: columnLayout?.columnWrapperWidth, children: [children, jsx(PreviousCell, { previousValue: previousValue, isMergedWithPrev: isMergedWithPrev })] }));
+};
+
+export { WrapperCell };

package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/WrapperCell.mjs

@@ -0,0 +1,37 @@
+"use client"
+import { jsxs, jsx } from 'react/jsx-runtime';
+import '@shopify/polaris';
+import '@shopify/polaris-icons';
+import 'react';
+import '../../../../../../../utils/dayjs.mjs';
+import '../../../../../../../utils/analytics.mjs';
+import '../../../../../../../types/template.mjs';
+import '../../../../../../components/GTooltip/components/GTooltipCard.mjs';
+import '../../../../../../components/GDiv/GDiv.mjs';
+import 'react-i18next';
+import '../../../../../../components/GFeatureLocked/constants.mjs';
+import '../../../../../../components/GFeatureLocked/types.mjs';
+import '../../../../../../components/GPagination/GPagination.mjs';
+import { GInlineCenter } from '../../../../../../components/GInlineCenter/GInlineCenter.mjs';
+import '../../../../../../charts/components/GPolarisViz/hooks/useResizeObserver.mjs';
+import '../../../../../../../stores/currencyRatesStore.mjs';
+import '@tanstack/react-query';
+import '../../../../../../../providers/ConvertMoneyProvider.mjs';
+import '../../../../../../../core/gemxql/constants/row-reader-mode.mjs';
+import '../../../../../../../core/gemxql/types/analytic-data.mjs';
+import '../../../../../../../core/gemxql/types/analytic-source.mjs';
+import '../../../../../../../core/gemxql/types/extra-condition.mjs';
+import '../../../../../../../core/gemxql/types/field-filters.mjs';
+import '../../../../../../../core/gemxql/types/field-operators.mjs';
+import '../../../../../../../core/gemxql/types/group-with-clause.mjs';
+import '../../../../../../../core/gemxql/types/order-by.mjs';
+import '../../../../../../../core/gemxql/types/page-fields.mjs';
+import '../../../../../../../core/gemxql/types/row-reader-mode.mjs';
+import '../../../../../../../core/gemxql/types/time-dimension.mjs';
+import { PreviousCell } from './PreviousCell.mjs';
+
+const WrapperCell = ({ children, previousValue, isMergedWithPrev, columnLayout, }) => {
+    return (jsxs(GInlineCenter, { flexDirection: "column", align: columnLayout?.align, gap: "100", paddingBlock: "200", width: columnLayout?.columnWrapperWidth, children: [children, jsx(PreviousCell, { previousValue: previousValue, isMergedWithPrev: isMergedWithPrev })] }));
+};
+
+export { WrapperCell };

package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/index.d.ts

@@ -0,0 +1 @@
+export { Cell } from './Cell';

package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/type.d.ts

@@ -0,0 +1,16 @@
+import type { IMetricFormatter } from '../../../../../../../modules/analytics';
+import type { CampaignsCellProps, OrderCellProps, ReportColumnLayout } from '../../../types';
+import type { ReportValueType } from '../../../../../common/Visualization/types';
+export type RendererProps<T = ReportValueType> = {
+    value: T;
+    campaignsCellProps?: CampaignsCellProps;
+    name?: string;
+    isMergedWithPrev: boolean;
+    formatter?: IMetricFormatter;
+    previousValue?: T;
+    columnLayout?: ReportColumnLayout;
+    orderCellProps?: OrderCellProps;
+    isTotalRow?: ReportValueType;
+    isDimensionCol?: boolean;
+    isMockData?: boolean;
+};

package/dist/esm/shared/reports/ui/ReportTable/components/Body/Row.d.ts

@@ -0,0 +1,16 @@
+import type { ReportRowType, IReportColumn } from '../../../../common/Visualization/types';
+import type { OrderCellProps, ReportColumnLayoutMap } from '../../types';
+interface RowProps {
+    row: ReportRowType;
+    rowIndex: number;
+    columns: IReportColumn[];
+    dimensions: string[];
+    prevRow?: ReportRowType;
+    columnLayoutMap: ReportColumnLayoutMap;
+    orderCellProps?: OrderCellProps;
+    isHideCampaignContent: boolean;
+    minWidth?: number;
+    isMockData?: boolean;
+}
+export declare const Row: ({ row, rowIndex, columns, dimensions, prevRow, columnLayoutMap, orderCellProps, isHideCampaignContent, minWidth, isMockData, }: RowProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/shared/reports/ui/ReportTable/components/Body/Row.js

@@ -0,0 +1,34 @@
+"use client"
+import { jsx } from 'react/jsx-runtime';
+import '../../../../common/Visualization/constants/version.js';
+import { getMetricPreviousValue } from '../../../../common/Visualization/utils/visualization.js';
+import '../../constants/order.js';
+import { IS_TOTAL_ROW_FIELD } from '../../constants/table.js';
+import { Cell } from './Cell/Cell.js';
+import { EReportColumnKey } from '../../types/report-columns.js';
+
+const Row = ({ row, rowIndex, columns, dimensions, prevRow, columnLayoutMap, orderCellProps, isHideCampaignContent, minWidth, isMockData, }) => {
+    const checkMergedWithPrev = (col) => {
+        const isDimensionCol = dimensions.includes(col);
+        let isMergedWithPrev = false;
+        if (isDimensionCol && rowIndex > 0 && prevRow) {
+            const dimIndex = dimensions.indexOf(col);
+            const allMatch = dimensions.slice(0, dimIndex + 1).every((d) => row[d] === prevRow[d]);
+            isMergedWithPrev = allMatch;
+        }
+        return isMergedWithPrev;
+    };
+    const customOrderCellProps = orderCellProps
+        ? {
+            ...orderCellProps,
+            onClickOrderCell: (data) => orderCellProps?.onClickOrderCell({ row, isPrevious: data.isPrevious }),
+        }
+        : orderCellProps;
+    return (jsx("div", { className: "GReportTable__Row group/GReportTable__Row", style: { minWidth }, children: columns.map((col) => {
+            const hasTooltipCard = !!col.tooltipCardProps;
+            const orderId = row[EReportColumnKey.ORDER_ID]?.toString() ?? '';
+            return (jsx(Cell, { value: row[col.name], isTotalRow: row[IS_TOTAL_ROW_FIELD], previousValue: getMetricPreviousValue(row, col.name), isMergedWithPrev: checkMergedWithPrev(col.name), columnLayout: columnLayoutMap[col.name], name: col.name, campaignsCellProps: { orderId, isHideCampaignContent }, isDimensionCol: dimensions.includes(col.name), formatter: col.dataType, hasTooltipCard: hasTooltipCard, orderCellProps: customOrderCellProps, isMockData: isMockData }, col.name));
+        }) }));
+};
+
+export { Row };

package/dist/esm/shared/reports/ui/ReportTable/components/Body/Row.mjs

@@ -0,0 +1,34 @@
+"use client"
+import { jsx } from 'react/jsx-runtime';
+import '../../../../common/Visualization/constants/version.mjs';
+import { getMetricPreviousValue } from '../../../../common/Visualization/utils/visualization.mjs';
+import '../../constants/order.mjs';
+import { IS_TOTAL_ROW_FIELD } from '../../constants/table.mjs';
+import { Cell } from './Cell/Cell.mjs';
+import { EReportColumnKey } from '../../types/report-columns.mjs';
+
+const Row = ({ row, rowIndex, columns, dimensions, prevRow, columnLayoutMap, orderCellProps, isHideCampaignContent, minWidth, isMockData, }) => {
+    const checkMergedWithPrev = (col) => {
+        const isDimensionCol = dimensions.includes(col);
+        let isMergedWithPrev = false;
+        if (isDimensionCol && rowIndex > 0 && prevRow) {
+            const dimIndex = dimensions.indexOf(col);
+            const allMatch = dimensions.slice(0, dimIndex + 1).every((d) => row[d] === prevRow[d]);
+            isMergedWithPrev = allMatch;
+        }
+        return isMergedWithPrev;
+    };
+    const customOrderCellProps = orderCellProps
+        ? {
+            ...orderCellProps,
+            onClickOrderCell: (data) => orderCellProps?.onClickOrderCell({ row, isPrevious: data.isPrevious }),
+        }
+        : orderCellProps;
+    return (jsx("div", { className: "GReportTable__Row group/GReportTable__Row", style: { minWidth }, children: columns.map((col) => {
+            const hasTooltipCard = !!col.tooltipCardProps;
+            const orderId = row[EReportColumnKey.ORDER_ID]?.toString() ?? '';
+            return (jsx(Cell, { value: row[col.name], isTotalRow: row[IS_TOTAL_ROW_FIELD], previousValue: getMetricPreviousValue(row, col.name), isMergedWithPrev: checkMergedWithPrev(col.name), columnLayout: columnLayoutMap[col.name], name: col.name, campaignsCellProps: { orderId, isHideCampaignContent }, isDimensionCol: dimensions.includes(col.name), formatter: col.dataType, hasTooltipCard: hasTooltipCard, orderCellProps: customOrderCellProps, isMockData: isMockData }, col.name));
+        }) }));
+};
+
+export { Row };

package/dist/esm/shared/reports/ui/ReportTable/components/Body/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Cell';
+export * from './Row';

package/dist/esm/shared/reports/ui/ReportTable/components/Footer/Pagination.d.ts

@@ -0,0 +1,12 @@
+import type { GPaginationProps } from '../../../../../components';
+interface PaginationProps {
+    totalRows?: number;
+    itemCount?: number;
+    viewAllMetricContent?: string;
+    showViewAllButton: boolean;
+    paginationProps?: GPaginationProps;
+    isPaginationHidden: boolean;
+    isMockData?: boolean;
+}
+export declare const Pagination: ({ totalRows, itemCount, viewAllMetricContent, showViewAllButton, paginationProps, isPaginationHidden, isMockData, }: PaginationProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/esm/shared/reports/ui/ReportTable/components/Footer/Pagination.js

@@ -0,0 +1,61 @@
+"use client"
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useReportTableActionsContext } from '../../context/ReportTableActionsContext.js';
+import { Text, Button } from '@shopify/polaris';
+import '@shopify/polaris-icons';
+import 'react';
+import { cls } from '../../../../../../utils/cls.js';
+import '../../../../../../utils/dayjs.js';
+import '../../../../../../utils/analytics.js';
+import '../../../../../../types/template.js';
+import '../../../../../components/GTooltip/components/GTooltipCard.js';
+import '../../../../../components/GDiv/GDiv.js';
+import { useTranslation } from 'react-i18next';
+import '../../../../../components/GFeatureLocked/constants.js';
+import '../../../../../components/GFeatureLocked/types.js';
+import { GPagination } from '../../../../../components/GPagination/GPagination.js';
+import '../../../../../charts/components/GPolarisViz/hooks/useResizeObserver.js';
+import '../../../../../../stores/currencyRatesStore.js';
+import '@tanstack/react-query';
+import '../../../../../../providers/ConvertMoneyProvider.js';
+import '../../../../../../core/gemxql/constants/row-reader-mode.js';
+import '../../../../../../core/gemxql/types/analytic-data.js';
+import '../../../../../../core/gemxql/types/analytic-source.js';
+import '../../../../../../core/gemxql/types/extra-condition.js';
+import '../../../../../../core/gemxql/types/field-filters.js';
+import '../../../../../../core/gemxql/types/field-operators.js';
+import '../../../../../../core/gemxql/types/group-with-clause.js';
+import '../../../../../../core/gemxql/types/order-by.js';
+import '../../../../../../core/gemxql/types/page-fields.js';
+import '../../../../../../core/gemxql/types/row-reader-mode.js';
+import '../../../../../../core/gemxql/types/time-dimension.js';
+import { GMockDataTooltip } from '../../../../../components/GMockDataTooltip/GMockDataTooltip.js';
+
+const Pagination = ({ totalRows, itemCount, viewAllMetricContent = 'order', showViewAllButton, paginationProps, isPaginationHidden, isMockData, }) => {
+    const { t } = useTranslation();
+    const { onViewAllStoreOrders } = useReportTableActionsContext();
+    const isHasTotalRows = Boolean(totalRows && totalRows > 0);
+    const isHasTotalStoreOrders = Boolean(itemCount && itemCount > 0);
+    const isShowViewAllStoreOrders = isHasTotalStoreOrders && showViewAllButton;
+    const handleClickViewAllStoreOrders = () => {
+        onViewAllStoreOrders?.();
+    };
+    if (isPaginationHidden)
+        return null;
+    return (jsxs("div", { className: cls('GReportTable__Pagination', {
+            'justify-end': isShowViewAllStoreOrders,
+            'justify-center': isHasTotalRows,
+            'justify-between': (isHasTotalRows || paginationProps) && isShowViewAllStoreOrders,
+        }), children: [paginationProps && jsx(GPagination, { ...paginationProps }), isHasTotalRows && (jsx(Text, { variant: "bodyMd", as: "span", children: t('{{count}} rows', { count: totalRows }) })), isShowViewAllStoreOrders && (jsx(GMockDataTooltip, { isMockData: isMockData, children: jsx(Button, { variant: "plain", disabled: isMockData, onClick: handleClickViewAllStoreOrders, children: getViewAllStoreOrdersText() }) }))] }));
+    function getViewAllStoreOrdersText() {
+        if (itemCount && itemCount > 1) {
+            return t('View all store {{metric}}s by date range ({{itemCount}})', {
+                itemCount,
+                metric: viewAllMetricContent,
+            });
+        }
+        return t('View all store {{metric}} by date range(1)', { metric: viewAllMetricContent });
+    }
+};
+
+export { Pagination };

package/dist/esm/shared/reports/ui/ReportTable/components/Footer/Pagination.mjs

@@ -0,0 +1,61 @@
+"use client"
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useReportTableActionsContext } from '../../context/ReportTableActionsContext.mjs';
+import { Text, Button } from '@shopify/polaris';
+import '@shopify/polaris-icons';
+import 'react';
+import { cls } from '../../../../../../utils/cls.mjs';
+import '../../../../../../utils/dayjs.mjs';
+import '../../../../../../utils/analytics.mjs';
+import '../../../../../../types/template.mjs';
+import '../../../../../components/GTooltip/components/GTooltipCard.mjs';
+import '../../../../../components/GDiv/GDiv.mjs';
+import { useTranslation } from 'react-i18next';
+import '../../../../../components/GFeatureLocked/constants.mjs';
+import '../../../../../components/GFeatureLocked/types.mjs';
+import { GPagination } from '../../../../../components/GPagination/GPagination.mjs';
+import '../../../../../charts/components/GPolarisViz/hooks/useResizeObserver.mjs';
+import '../../../../../../stores/currencyRatesStore.mjs';
+import '@tanstack/react-query';
+import '../../../../../../providers/ConvertMoneyProvider.mjs';
+import '../../../../../../core/gemxql/constants/row-reader-mode.mjs';
+import '../../../../../../core/gemxql/types/analytic-data.mjs';
+import '../../../../../../core/gemxql/types/analytic-source.mjs';
+import '../../../../../../core/gemxql/types/extra-condition.mjs';
+import '../../../../../../core/gemxql/types/field-filters.mjs';
+import '../../../../../../core/gemxql/types/field-operators.mjs';
+import '../../../../../../core/gemxql/types/group-with-clause.mjs';
+import '../../../../../../core/gemxql/types/order-by.mjs';
+import '../../../../../../core/gemxql/types/page-fields.mjs';
+import '../../../../../../core/gemxql/types/row-reader-mode.mjs';
+import '../../../../../../core/gemxql/types/time-dimension.mjs';
+import { GMockDataTooltip } from '../../../../../components/GMockDataTooltip/GMockDataTooltip.mjs';
+
+const Pagination = ({ totalRows, itemCount, viewAllMetricContent = 'order', showViewAllButton, paginationProps, isPaginationHidden, isMockData, }) => {
+    const { t } = useTranslation();
+    const { onViewAllStoreOrders } = useReportTableActionsContext();
+    const isHasTotalRows = Boolean(totalRows && totalRows > 0);
+    const isHasTotalStoreOrders = Boolean(itemCount && itemCount > 0);
+    const isShowViewAllStoreOrders = isHasTotalStoreOrders && showViewAllButton;
+    const handleClickViewAllStoreOrders = () => {
+        onViewAllStoreOrders?.();
+    };
+    if (isPaginationHidden)
+        return null;
+    return (jsxs("div", { className: cls('GReportTable__Pagination', {
+            'justify-end': isShowViewAllStoreOrders,
+            'justify-center': isHasTotalRows,
+            'justify-between': (isHasTotalRows || paginationProps) && isShowViewAllStoreOrders,
+        }), children: [paginationProps && jsx(GPagination, { ...paginationProps }), isHasTotalRows && (jsx(Text, { variant: "bodyMd", as: "span", children: t('{{count}} rows', { count: totalRows }) })), isShowViewAllStoreOrders && (jsx(GMockDataTooltip, { isMockData: isMockData, children: jsx(Button, { variant: "plain", disabled: isMockData, onClick: handleClickViewAllStoreOrders, children: getViewAllStoreOrdersText() }) }))] }));
+    function getViewAllStoreOrdersText() {
+        if (itemCount && itemCount > 1) {
+            return t('View all store {{metric}}s by date range ({{itemCount}})', {
+                itemCount,
+                metric: viewAllMetricContent,
+            });
+        }
+        return t('View all store {{metric}} by date range(1)', { metric: viewAllMetricContent });
+    }
+};
+
+export { Pagination };

package/dist/esm/shared/reports/ui/ReportTable/components/Footer/ScrollBar.d.ts

@@ -0,0 +1,3 @@
+export declare const ScrollBar: import("react").ForwardRefExoticComponent<{
+    isPaginationHidden: boolean;
+} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/esm/shared/reports/ui/ReportTable/components/Footer/ScrollBar.js

@@ -0,0 +1,16 @@
+"use client"
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { cls } from '../../../../../../utils/cls.js';
+import '../../../../../../utils/dayjs.js';
+import '../../../../../../utils/analytics.js';
+import '../../../../../../types/template.js';
+
+const ScrollBar = forwardRef(({ isPaginationHidden }, ref) => {
+    return (jsx("div", { className: cls('GReportTable__ScrollBarContainer', {
+            'GReportTable__ScrollBarContainer--pagination-hidden': isPaginationHidden,
+        }), ref: ref, children: jsx("div", { className: "GReportTable__ScrollBar", children: jsx("div", { className: "GReportTable__ScrollBarContent" }) }) }));
+});
+ScrollBar.displayName = 'ScrollBar';
+
+export { ScrollBar };

package/dist/esm/shared/reports/ui/ReportTable/components/Footer/ScrollBar.mjs

@@ -0,0 +1,16 @@
+"use client"
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { cls } from '../../../../../../utils/cls.mjs';
+import '../../../../../../utils/dayjs.mjs';
+import '../../../../../../utils/analytics.mjs';
+import '../../../../../../types/template.mjs';
+
+const ScrollBar = forwardRef(({ isPaginationHidden }, ref) => {
+    return (jsx("div", { className: cls('GReportTable__ScrollBarContainer', {
+            'GReportTable__ScrollBarContainer--pagination-hidden': isPaginationHidden,
+        }), ref: ref, children: jsx("div", { className: "GReportTable__ScrollBar", children: jsx("div", { className: "GReportTable__ScrollBarContent" }) }) }));
+});
+ScrollBar.displayName = 'ScrollBar';
+
+export { ScrollBar };

package/dist/esm/shared/reports/ui/ReportTable/components/Footer/WrapperFooter.d.ts

@@ -0,0 +1,12 @@
+import type { GPaginationProps } from '../../../../../components';
+interface WrapperFooterProps {
+    scrollbarContainerRef?: React.RefObject<HTMLDivElement>;
+    totalPaginationRows: number;
+    itemCount?: number;
+    showViewAllButton: boolean;
+    paginationProps?: GPaginationProps;
+    isPaginationHidden: boolean;
+    isMockData?: boolean;
+}
+export declare const WrapperFooter: ({ scrollbarContainerRef, itemCount, totalPaginationRows, showViewAllButton, paginationProps, isPaginationHidden, isMockData, }: WrapperFooterProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/shared/reports/ui/ReportTable/components/Footer/WrapperFooter.js

@@ -0,0 +1,10 @@
+"use client"
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Pagination } from './Pagination.js';
+import { ScrollBar } from './ScrollBar.js';
+
+const WrapperFooter = ({ scrollbarContainerRef, itemCount, totalPaginationRows, showViewAllButton, paginationProps, isPaginationHidden, isMockData, }) => {
+    return (jsxs("div", { className: "GReportTable__FooterWrapper", children: [scrollbarContainerRef && jsx(ScrollBar, { ref: scrollbarContainerRef, isPaginationHidden: isPaginationHidden }), jsx(Pagination, { totalRows: totalPaginationRows, itemCount: itemCount, showViewAllButton: showViewAllButton, paginationProps: paginationProps, isPaginationHidden: isPaginationHidden, isMockData: isMockData })] }));
+};
+
+export { WrapperFooter };

package/dist/esm/shared/reports/ui/ReportTable/components/Footer/WrapperFooter.mjs

@@ -0,0 +1,10 @@
+"use client"
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Pagination } from './Pagination.mjs';
+import { ScrollBar } from './ScrollBar.mjs';
+
+const WrapperFooter = ({ scrollbarContainerRef, itemCount, totalPaginationRows, showViewAllButton, paginationProps, isPaginationHidden, isMockData, }) => {
+    return (jsxs("div", { className: "GReportTable__FooterWrapper", children: [scrollbarContainerRef && jsx(ScrollBar, { ref: scrollbarContainerRef, isPaginationHidden: isPaginationHidden }), jsx(Pagination, { totalRows: totalPaginationRows, itemCount: itemCount, showViewAllButton: showViewAllButton, paginationProps: paginationProps, isPaginationHidden: isPaginationHidden, isMockData: isMockData })] }));
+};
+
+export { WrapperFooter };

package/dist/esm/shared/reports/ui/ReportTable/components/Footer/index.d.ts

@@ -0,0 +1 @@
+export * from './WrapperFooter';

package/dist/esm/shared/reports/ui/ReportTable/components/Header/Header.d.ts

@@ -0,0 +1,12 @@
+import type { IReportColumn } from '../../../../common/Visualization/types';
+import type { OrderByFields, ReportColumnLayoutMap } from '../../types';
+interface HeaderProps {
+    columns: IReportColumn[];
+    columnLayoutMap: ReportColumnLayoutMap;
+    activeColumn?: string;
+    orderBy?: OrderByFields;
+    showSummary?: boolean;
+    onChangeOrderBy?: (field: string) => void;
+}
+export declare const Header: ({ columns, columnLayoutMap, activeColumn, orderBy, showSummary, onChangeOrderBy, }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/shared/reports/ui/ReportTable/components/Header/Header.js

@@ -0,0 +1,48 @@
+"use client"
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { SortableHeaderWithTooltip } from './SortableHeaderWithTooltip.js';
+import { getColumnLayoutStyles } from '../../utils/table.js';
+import '../../types/index.js';
+import { cls } from '../../../../../../utils/cls.js';
+import '../../../../../../utils/dayjs.js';
+import '../../../../../../utils/analytics.js';
+import '../../../../../../types/template.js';
+import '../../../../../../core/gemxql/constants/row-reader-mode.js';
+import '../../../../../../core/gemxql/builder/configs/keywords.js';
+import '../../../../../../core/gemxql/builder/filters/build-extra-conditions.js';
+import '../../../../../../core/gemxql/builder/filters/build-filter-conditions.js';
+import '../../../../../../core/gemxql/types/analytic-data.js';
+import '../../../../../../core/gemxql/types/analytic-source.js';
+import '../../../../../../core/gemxql/types/extra-condition.js';
+import '../../../../../../core/gemxql/types/field-filters.js';
+import '../../../../../../core/gemxql/types/field-operators.js';
+import '../../../../../../core/gemxql/types/group-with-clause.js';
+import '../../../../../../core/gemxql/types/order-by.js';
+import '../../../../../../core/gemxql/types/page-fields.js';
+import '../../../../../../core/gemxql/types/row-reader-mode.js';
+import '../../../../../../core/gemxql/types/time-dimension.js';
+import '../../../../../../core/gemxql/api/useCustomGemXQlQuery.js';
+import '../../../../../../core/gemxql/api/useGemxQlNamedQuery.js';
+import '../../../../../../providers/ConvertMoneyProvider.js';
+import '../../../../../components/GPagination/GPagination.js';
+import { useState } from 'react';
+import '../../types/report-columns.js';
+import '../../../../common/Visualization/types/report.js';
+import '../../../../common/Visualization/types/chart.js';
+import '../../../../common/Visualization/types/report-metric.js';
+import { CheckIcon } from '@shopify/polaris-icons';
+import { SortableHeader } from './SortableHeader.js';
+import { Box, Icon } from '@shopify/polaris';
+
+const Header = ({ columns, columnLayoutMap, activeColumn, orderBy, showSummary, onChangeOrderBy, }) => {
+    const [itemHovering, setItemHovering] = useState();
+    return (jsx("div", { className: cls('GReportTable__Header', {
+            'GReportTable__Header--hide-summary': !showSummary,
+        }), children: columns.map((item) => {
+            const isTooltipCard = !!item.tooltipCardProps;
+            const SortableHeaderComponent = isTooltipCard ? SortableHeaderWithTooltip : SortableHeader;
+            return (jsxs("div", { className: "GReportTable__Header-Cell", style: getColumnLayoutStyles(columnLayoutMap[item.name]), onMouseEnter: () => setItemHovering(item.name), onMouseLeave: () => setItemHovering(undefined), children: [activeColumn === item.name && (jsx(Box, { children: jsx(Icon, { source: CheckIcon }) })), jsx(SortableHeaderComponent, { item: item, orderBy: orderBy, itemHovering: itemHovering, onChangeOrderBy: onChangeOrderBy, ...item.tooltipCardProps })] }, item.name));
+        }) }));
+};
+
+export { Header };

package/dist/esm/shared/reports/ui/ReportTable/components/Header/Header.mjs

@@ -0,0 +1,48 @@
+"use client"
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { SortableHeaderWithTooltip } from './SortableHeaderWithTooltip.mjs';
+import { getColumnLayoutStyles } from '../../utils/table.mjs';
+import '../../types/index.mjs';
+import { cls } from '../../../../../../utils/cls.mjs';
+import '../../../../../../utils/dayjs.mjs';
+import '../../../../../../utils/analytics.mjs';
+import '../../../../../../types/template.mjs';
+import '../../../../../../core/gemxql/constants/row-reader-mode.mjs';
+import '../../../../../../core/gemxql/builder/configs/keywords.mjs';
+import '../../../../../../core/gemxql/builder/filters/build-extra-conditions.mjs';
+import '../../../../../../core/gemxql/builder/filters/build-filter-conditions.mjs';
+import '../../../../../../core/gemxql/types/analytic-data.mjs';
+import '../../../../../../core/gemxql/types/analytic-source.mjs';
+import '../../../../../../core/gemxql/types/extra-condition.mjs';
+import '../../../../../../core/gemxql/types/field-filters.mjs';
+import '../../../../../../core/gemxql/types/field-operators.mjs';
+import '../../../../../../core/gemxql/types/group-with-clause.mjs';
+import '../../../../../../core/gemxql/types/order-by.mjs';
+import '../../../../../../core/gemxql/types/page-fields.mjs';
+import '../../../../../../core/gemxql/types/row-reader-mode.mjs';
+import '../../../../../../core/gemxql/types/time-dimension.mjs';
+import '../../../../../../core/gemxql/api/useCustomGemXQlQuery.mjs';
+import '../../../../../../core/gemxql/api/useGemxQlNamedQuery.mjs';
+import '../../../../../../providers/ConvertMoneyProvider.mjs';
+import '../../../../../components/GPagination/GPagination.mjs';
+import { useState } from 'react';
+import '../../types/report-columns.mjs';
+import '../../../../common/Visualization/types/report.mjs';
+import '../../../../common/Visualization/types/chart.mjs';
+import '../../../../common/Visualization/types/report-metric.mjs';
+import { CheckIcon } from '@shopify/polaris-icons';
+import { SortableHeader } from './SortableHeader.mjs';
+import { Box, Icon } from '@shopify/polaris';
+
+const Header = ({ columns, columnLayoutMap, activeColumn, orderBy, showSummary, onChangeOrderBy, }) => {
+    const [itemHovering, setItemHovering] = useState();
+    return (jsx("div", { className: cls('GReportTable__Header', {
+            'GReportTable__Header--hide-summary': !showSummary,
+        }), children: columns.map((item) => {
+            const isTooltipCard = !!item.tooltipCardProps;
+            const SortableHeaderComponent = isTooltipCard ? SortableHeaderWithTooltip : SortableHeader;
+            return (jsxs("div", { className: "GReportTable__Header-Cell", style: getColumnLayoutStyles(columnLayoutMap[item.name]), onMouseEnter: () => setItemHovering(item.name), onMouseLeave: () => setItemHovering(undefined), children: [activeColumn === item.name && (jsx(Box, { children: jsx(Icon, { source: CheckIcon }) })), jsx(SortableHeaderComponent, { item: item, orderBy: orderBy, itemHovering: itemHovering, onChangeOrderBy: onChangeOrderBy, ...item.tooltipCardProps })] }, item.name));
+        }) }));
+};
+
+export { Header };