@levi-gemcommerce/analytics 2.1.0-test.0 → 3.0.1-dev.3

package/dist/esm/components/OrderAnalytic/constants/order-listing.js

@@ -1,7 +1,7 @@
-import { EReportColumnKey } from '../../../shared/reports/ui/ReportTable/types/report-columns.js';
 import { EReportDataType } from '../../../shared/reports/common/Visualization/types/report.js';
 import '../../../shared/reports/common/Visualization/types/chart.js';
 import '../../../shared/reports/common/Visualization/types/report-metric.js';
+import { EReportColumnKey } from '../../../shared/reports/ui/ReportTable/types/report-columns.js';
 
 const ORDER_LISTING_DIMENSION_LAYOUT = {
     width: '158px',
@@ -16,18 +16,24 @@ const ORDER_LISTING_DIMENSION_LAYOUT = {
 // Remaining space after fixed Order ID column
 const METRIC_COLUMN_MAX_WIDTH = `max(var(--column-cell-min-width), calc(100% - ${ORDER_LISTING_DIMENSION_LAYOUT.width}))`;
 const ORDER_LISTING_METRIC_LAYOUTS = {
+    [EReportColumnKey.GEMX_ID]: {
+        minWidth: '120px',
+        maxWidth: METRIC_COLUMN_MAX_WIDTH,
+        align: 'start',
+        columnWrapperWidth: '100%',
+    },
     [EReportColumnKey.ORDER_DATE]: {
-        minWidth: '180px',
+        minWidth: '170px',
         maxWidth: METRIC_COLUMN_MAX_WIDTH,
         align: 'start',
     },
     [EReportColumnKey.TOTAL]: {
-        minWidth: '120px',
+        minWidth: '96px',
         maxWidth: METRIC_COLUMN_MAX_WIDTH,
         align: 'end',
     },
     [EReportColumnKey.CAMPAIGNS]: {
-        minWidth: '246px',
+        minWidth: '128px',
         maxWidth: METRIC_COLUMN_MAX_WIDTH,
         align: 'start',
         columnWrapperWidth: '100%',
@@ -48,7 +54,7 @@ const ORDER_LISTING_METRIC_LAYOUTS = {
         align: 'start',
     },
     [EReportColumnKey.ITEMS]: {
-        minWidth: '140px',
+        minWidth: '120px',
         maxWidth: METRIC_COLUMN_MAX_WIDTH,
         align: 'start',
     },
@@ -66,6 +72,18 @@ const ORDER_LISTING_COLUMNS = [
             },
         },
     },
+    {
+        name: EReportColumnKey.GEMX_ID,
+        dataType: EReportDataType.STRING,
+        displayName: 'GemX ID',
+        tooltipCardProps: {
+            tooltip: {
+                title: 'GemX ID',
+                content: 'A tracking ID GemX attaches to the order so you can trace where it came from',
+                width: 'wide',
+            },
+        },
+    },
     {
         name: EReportColumnKey.ORDER_DATE,
         dataType: EReportDataType.DATE,
@@ -151,8 +169,9 @@ const ORDER_LISTING_COLUMNS = [
         },
     },
 ];
-const ORDER_LISTING_LATEST_COLUMNS_FOR_PAGE = ORDER_LISTING_COLUMNS.filter((column) => ![EReportColumnKey.CAMPAIGNS].includes(column.name));
+const ORDER_LISTING_LATEST_COLUMNS_FOR_PAGE = ORDER_LISTING_COLUMNS.filter((column) => ![EReportColumnKey.CAMPAIGNS, EReportColumnKey.GEMX_ID].includes(column.name));
 const ORDER_LISTING_METRICS = [
+    EReportColumnKey.GEMX_ID,
     EReportColumnKey.ORDER_DATE,
     EReportColumnKey.TOTAL,
     EReportColumnKey.CAMPAIGNS,

package/dist/esm/components/OrderAnalytic/constants/order-listing.mjs

@@ -1,7 +1,7 @@
-import { EReportColumnKey } from '../../../shared/reports/ui/ReportTable/types/report-columns.mjs';
 import { EReportDataType } from '../../../shared/reports/common/Visualization/types/report.mjs';
 import '../../../shared/reports/common/Visualization/types/chart.mjs';
 import '../../../shared/reports/common/Visualization/types/report-metric.mjs';
+import { EReportColumnKey } from '../../../shared/reports/ui/ReportTable/types/report-columns.mjs';
 
 const ORDER_LISTING_DIMENSION_LAYOUT = {
     width: '158px',
@@ -16,18 +16,24 @@ const ORDER_LISTING_DIMENSION_LAYOUT = {
 // Remaining space after fixed Order ID column
 const METRIC_COLUMN_MAX_WIDTH = `max(var(--column-cell-min-width), calc(100% - ${ORDER_LISTING_DIMENSION_LAYOUT.width}))`;
 const ORDER_LISTING_METRIC_LAYOUTS = {
+    [EReportColumnKey.GEMX_ID]: {
+        minWidth: '120px',
+        maxWidth: METRIC_COLUMN_MAX_WIDTH,
+        align: 'start',
+        columnWrapperWidth: '100%',
+    },
     [EReportColumnKey.ORDER_DATE]: {
-        minWidth: '180px',
+        minWidth: '170px',
         maxWidth: METRIC_COLUMN_MAX_WIDTH,
         align: 'start',
     },
     [EReportColumnKey.TOTAL]: {
-        minWidth: '120px',
+        minWidth: '96px',
         maxWidth: METRIC_COLUMN_MAX_WIDTH,
         align: 'end',
     },
     [EReportColumnKey.CAMPAIGNS]: {
-        minWidth: '246px',
+        minWidth: '128px',
         maxWidth: METRIC_COLUMN_MAX_WIDTH,
         align: 'start',
         columnWrapperWidth: '100%',
@@ -48,7 +54,7 @@ const ORDER_LISTING_METRIC_LAYOUTS = {
         align: 'start',
     },
     [EReportColumnKey.ITEMS]: {
-        minWidth: '140px',
+        minWidth: '120px',
         maxWidth: METRIC_COLUMN_MAX_WIDTH,
         align: 'start',
     },
@@ -66,6 +72,18 @@ const ORDER_LISTING_COLUMNS = [
             },
         },
     },
+    {
+        name: EReportColumnKey.GEMX_ID,
+        dataType: EReportDataType.STRING,
+        displayName: 'GemX ID',
+        tooltipCardProps: {
+            tooltip: {
+                title: 'GemX ID',
+                content: 'A tracking ID GemX attaches to the order so you can trace where it came from',
+                width: 'wide',
+            },
+        },
+    },
     {
         name: EReportColumnKey.ORDER_DATE,
         dataType: EReportDataType.DATE,
@@ -151,8 +169,9 @@ const ORDER_LISTING_COLUMNS = [
         },
     },
 ];
-const ORDER_LISTING_LATEST_COLUMNS_FOR_PAGE = ORDER_LISTING_COLUMNS.filter((column) => ![EReportColumnKey.CAMPAIGNS].includes(column.name));
+const ORDER_LISTING_LATEST_COLUMNS_FOR_PAGE = ORDER_LISTING_COLUMNS.filter((column) => ![EReportColumnKey.CAMPAIGNS, EReportColumnKey.GEMX_ID].includes(column.name));
 const ORDER_LISTING_METRICS = [
+    EReportColumnKey.GEMX_ID,
     EReportColumnKey.ORDER_DATE,
     EReportColumnKey.TOTAL,
     EReportColumnKey.CAMPAIGNS,

package/dist/esm/components/OrderAnalytic/helpers/order-listing.d.ts

@@ -1,5 +1,5 @@
-import type { IReportTable, ReportRowType, ReportValueType } from '../../../shared/reports/common/Visualization/types';
 import type { IOrder } from '../types';
+import type { IReportTable, ReportRowType, ReportValueType } from '../../../shared/reports/common/Visualization/types';
 export declare const convertOrderItemsToReportTableRows: (orderItems: IOrder[]) => IReportTable["rows"];
 export declare const applyTotalToSummaryRow: (rows: ReportRowType<ReportValueType>[]) => {
     [x: string]: ReportValueType | undefined;

package/dist/esm/components/OrderAnalytic/helpers/order-listing.js

@@ -8,9 +8,7 @@ const convertOrderItemsToReportTableRows = (orderItems) => {
         return {
             ...restOrderItem,
             items: typeof orderItem.items === 'string' ? JSON.parse(orderItem.items) : (orderItem.items ?? []),
-            experiments: typeof orderItem.experiments === 'string'
-                ? JSON.parse(orderItem.experiments)
-                : (orderItem.experiments ?? []),
+            experiments: typeof orderItem.experiments === 'string' ? JSON.parse(orderItem.experiments) : (orderItem.experiments ?? []),
         };
     });
 };

package/dist/esm/components/OrderAnalytic/helpers/order-listing.mjs

@@ -8,9 +8,7 @@ const convertOrderItemsToReportTableRows = (orderItems) => {
         return {
             ...restOrderItem,
             items: typeof orderItem.items === 'string' ? JSON.parse(orderItem.items) : (orderItem.items ?? []),
-            experiments: typeof orderItem.experiments === 'string'
-                ? JSON.parse(orderItem.experiments)
-                : (orderItem.experiments ?? []),
+            experiments: typeof orderItem.experiments === 'string' ? JSON.parse(orderItem.experiments) : (orderItem.experiments ?? []),
         };
     });
 };

package/dist/esm/components/OrderAnalytic/hooks/useOrderListingData.d.ts

@@ -1,11 +1,14 @@
 import type { IReportColumn } from '../../../shared/reports/common/Visualization/types';
+import type { EReportColumnKey } from '../../../shared/reports/ui/ReportTable/types/report-columns';
 import type { IOrder } from '../types';
 interface UseOrderListingDataProps {
     limitRowAmount?: number;
     orderListing?: IOrder[];
     fixedColumns?: IReportColumn['name'][];
+    selectedColumns?: EReportColumnKey[];
+    columnsOrder?: EReportColumnKey[];
 }
-export declare const useOrderListingData: ({ limitRowAmount, orderListing, fixedColumns, }: UseOrderListingDataProps) => {
+export declare const useOrderListingData: ({ limitRowAmount, orderListing, fixedColumns, selectedColumns: externalSelectedColumns, columnsOrder: externalColumnsOrder, }: UseOrderListingDataProps) => {
     showColumns: IReportColumn[];
     tableData: {
         rows: import("../../../shared/reports/common/Visualization/types").ReportRowType<import("../../../shared/reports/common/Visualization/types").ReportValueType>[];

package/dist/esm/components/OrderAnalytic/hooks/useOrderListingData.js

@@ -1,17 +1,19 @@
-import { ORDER_LISTING_COLUMNS, ORDER_LISTING_METRICS } from '../constants/order-listing.js';
-import '../constants/order-columns.js';
-import { convertOrderItemsToReportTableRows } from '../helpers/order-listing.js';
-import '../stores/order-control.js';
-import { useOrderColumnsSelectorStore } from '../stores/order-columns-selector.js';
 import { sortByArrayOrder } from '../../../utils/sort.js';
 import '../../../utils/dayjs.js';
 import '../../../utils/analytics.js';
 import '../../../types/template.js';
 import { useMemo } from 'react';
+import { ORDER_LISTING_COLUMNS, ORDER_LISTING_METRICS } from '../constants/order-listing.js';
+import '../constants/order-columns.js';
+import { convertOrderItemsToReportTableRows } from '../helpers/order-listing.js';
+import '../stores/order-control.js';
+import { useOrderColumnsSelectorStore } from '../stores/order-columns-selector.js';
 
-const useOrderListingData = ({ limitRowAmount, orderListing = [], fixedColumns, }) => {
-    const selectedColumns = useOrderColumnsSelectorStore((state) => state.selectedColumns);
-    const columnsOrder = useOrderColumnsSelectorStore((state) => state.columnsOrder);
+const useOrderListingData = ({ limitRowAmount, orderListing = [], fixedColumns, selectedColumns: externalSelectedColumns, columnsOrder: externalColumnsOrder, }) => {
+    const storeSelectedColumns = useOrderColumnsSelectorStore((state) => state.selectedColumns);
+    const storeColumnsOrder = useOrderColumnsSelectorStore((state) => state.columnsOrder);
+    const selectedColumns = externalSelectedColumns ?? storeSelectedColumns;
+    const columnsOrder = externalColumnsOrder ?? storeColumnsOrder;
     const showColumns = useMemo(() => ORDER_LISTING_COLUMNS.filter((column) => (fixedColumns ?? selectedColumns).includes(column.name)), [fixedColumns, selectedColumns]);
     const sortedMetrics = useMemo(() => sortByArrayOrder(ORDER_LISTING_METRICS ?? [], columnsOrder), [columnsOrder]);
     const tableData = useMemo(() => {

package/dist/esm/components/OrderAnalytic/hooks/useOrderListingData.mjs

@@ -1,17 +1,19 @@
-import { ORDER_LISTING_COLUMNS, ORDER_LISTING_METRICS } from '../constants/order-listing.mjs';
-import '../constants/order-columns.mjs';
-import { convertOrderItemsToReportTableRows } from '../helpers/order-listing.mjs';
-import '../stores/order-control.mjs';
-import { useOrderColumnsSelectorStore } from '../stores/order-columns-selector.mjs';
 import { sortByArrayOrder } from '../../../utils/sort.mjs';
 import '../../../utils/dayjs.mjs';
 import '../../../utils/analytics.mjs';
 import '../../../types/template.mjs';
 import { useMemo } from 'react';
+import { ORDER_LISTING_COLUMNS, ORDER_LISTING_METRICS } from '../constants/order-listing.mjs';
+import '../constants/order-columns.mjs';
+import { convertOrderItemsToReportTableRows } from '../helpers/order-listing.mjs';
+import '../stores/order-control.mjs';
+import { useOrderColumnsSelectorStore } from '../stores/order-columns-selector.mjs';
 
-const useOrderListingData = ({ limitRowAmount, orderListing = [], fixedColumns, }) => {
-    const selectedColumns = useOrderColumnsSelectorStore((state) => state.selectedColumns);
-    const columnsOrder = useOrderColumnsSelectorStore((state) => state.columnsOrder);
+const useOrderListingData = ({ limitRowAmount, orderListing = [], fixedColumns, selectedColumns: externalSelectedColumns, columnsOrder: externalColumnsOrder, }) => {
+    const storeSelectedColumns = useOrderColumnsSelectorStore((state) => state.selectedColumns);
+    const storeColumnsOrder = useOrderColumnsSelectorStore((state) => state.columnsOrder);
+    const selectedColumns = externalSelectedColumns ?? storeSelectedColumns;
+    const columnsOrder = externalColumnsOrder ?? storeColumnsOrder;
     const showColumns = useMemo(() => ORDER_LISTING_COLUMNS.filter((column) => (fixedColumns ?? selectedColumns).includes(column.name)), [fixedColumns, selectedColumns]);
     const sortedMetrics = useMemo(() => sortByArrayOrder(ORDER_LISTING_METRICS ?? [], columnsOrder), [columnsOrder]);
     const tableData = useMemo(() => {

package/dist/esm/components/OrderAnalytic/index.d.ts

@@ -1,4 +1,5 @@
-export * from './OrderListingLatestTable';
+export * from './components';
 export * from './constants';
-export * from './types';
+export * from './OrderListingLatestTable';
 export * from './stores';
+export * from './types';

package/dist/esm/components/OrderAnalytic/stores/order-control.js

@@ -1,6 +1,6 @@
+import { create } from 'zustand';
 import { EReportColumnKey } from '../../../shared/reports/ui/ReportTable/types/report-columns.js';
 import { EOrderDirectionType } from '../../../shared/reports/ui/ReportTable/types/index.js';
-import { create } from 'zustand';
 
 const useOrderControlStore = create()((set) => ({
     orderBy: { field: EReportColumnKey.ORDER_DATE, direction: EOrderDirectionType.DESC },

package/dist/esm/components/OrderAnalytic/stores/order-control.mjs

@@ -1,6 +1,6 @@
+import { create } from 'zustand';
 import { EReportColumnKey } from '../../../shared/reports/ui/ReportTable/types/report-columns.mjs';
 import { EOrderDirectionType } from '../../../shared/reports/ui/ReportTable/types/index.mjs';
-import { create } from 'zustand';
 
 const useOrderControlStore = create()((set) => ({
     orderBy: { field: EReportColumnKey.ORDER_DATE, direction: EOrderDirectionType.DESC },

package/dist/esm/components/OrderAnalytic/types/order.d.ts

@@ -16,7 +16,7 @@ export declare enum EJourneyEvent {
     SEARCH_SUBMITTED = "SEARCH_SUBMITTED"
 }
 export interface IBaseJourneyEvent {
-    orderID: string;
+    orderID?: string | null;
     date: string;
     eventType: EJourneyEvent;
 }
@@ -38,7 +38,7 @@ export interface IOrderJourneyBase {
     date: string;
     locationPath?: string | null;
     name?: string | null;
-    orderID: string;
+    orderID?: string | null;
     pageTitle?: string | null;
     shopifySessionID?: string | null;
     items?: (ILineItem | null)[] | null;
@@ -67,6 +67,7 @@ export interface IOrderExperiment {
 }
 export interface IOrder {
     order_id: string;
+    gx_id: string;
     events: IBaseJourneyEvent[];
     items: IOrderItem;
     total_price: number;

package/dist/esm/components/SingleMetricChartCard/SingleMetricChartCard.d.ts

@@ -1,7 +1,7 @@
 import type { DataSeries } from '@shopify/polaris-viz-core';
-import type { ColumnTypesMap } from '../../core/gemxql';
-import type { IMetricCardItem } from '../../types';
 import type { ReactElement } from 'react';
+import type { IMetricCardItem } from '../../types';
+import type { ColumnTypesMap } from '../../core/gemxql';
 export interface IProps {
     metricInfo: IMetricCardItem;
     isLoading?: boolean;

package/dist/esm/components/SingleMetricChartCard/SingleMetricChartCard.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Card, BlockStack } from '@shopify/polaris';
-import '@shopify/polaris-icons';
 import { useState } from 'react';
+import '@shopify/polaris-icons';
 import '../../utils/dayjs.js';
 import '../../utils/analytics.js';
 import '../../types/template.js';
@@ -14,6 +14,7 @@ import '../../shared/components/GPagination/GPagination.js';
 import '../../shared/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';
@@ -25,7 +26,6 @@ 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 '../../providers/ConvertMoneyProvider.js';
 import { MetricChart } from '../common/chart/MetricChart.js';
 import '../../constants/analytic-metric-tooltip.js';
 import '../../constants/breakdown-targets.js';

package/dist/esm/components/SingleMetricChartCard/SingleMetricChartCard.mjs

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Card, BlockStack } from '@shopify/polaris';
-import '@shopify/polaris-icons';
 import { useState } from 'react';
+import '@shopify/polaris-icons';
 import '../../utils/dayjs.mjs';
 import '../../utils/analytics.mjs';
 import '../../types/template.mjs';
@@ -14,6 +14,7 @@ import '../../shared/components/GPagination/GPagination.mjs';
 import '../../shared/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';
@@ -25,7 +26,6 @@ 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 '../../providers/ConvertMoneyProvider.mjs';
 import { MetricChart } from '../common/chart/MetricChart.mjs';
 import '../../constants/analytic-metric-tooltip.mjs';
 import '../../constants/breakdown-targets.mjs';

package/dist/esm/components/common/chart/GChartSkeleton.js

@@ -15,6 +15,7 @@ import '../../../shared/components/GPagination/GPagination.js';
 import '../../../shared/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';
@@ -26,7 +27,6 @@ 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 '../../../providers/ConvertMoneyProvider.js';
 
 const GChartSkeleton = () => {
     return jsx(GSkeletonDisplayText, { height: "188px" });

package/dist/esm/components/common/chart/GChartSkeleton.mjs

@@ -15,6 +15,7 @@ import '../../../shared/components/GPagination/GPagination.mjs';
 import '../../../shared/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';
@@ -26,7 +27,6 @@ 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 '../../../providers/ConvertMoneyProvider.mjs';
 
 const GChartSkeleton = () => {
     return jsx(GSkeletonDisplayText, { height: "188px" });

package/dist/esm/components/common/chart/MetricChart.d.ts

@@ -1,7 +1,7 @@
 import type { DataSeries } from '@shopify/polaris-viz';
+import type { ReactElement } from 'react';
 import type { ColumnTypesMap } from '../../../core/gemxql';
 import type { EMetricKey } from '../../../types';
-import type { ReactElement } from 'react';
 export interface IProps {
     lineChartData: DataSeries[];
     isLoading?: boolean;

package/dist/esm/components/common/chart/MetricChart.js

@@ -1,13 +1,11 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
-import { MetricChartTooltip } from './MetricChartTooltip.js';
-import { ANALYTICS_METRIC_TOOLTIP } from '../../../constants/analytic-metric-tooltip.js';
-import '../../../constants/breakdown-targets.js';
-import { MetricChartEmpty } from './MetricChartEmpty.js';
-import { GChartSkeleton } from './GChartSkeleton.js';
 import '../../../providers/ConvertMoneyProvider.js';
 import { MetricChartProvider } from '../../../providers/MetricChartProvider.js';
 import '../../../providers/TimezoneProvider.js';
 import { LineChart } from '@shopify/polaris-viz';
+import { GChartSkeleton } from './GChartSkeleton.js';
+import { MetricChartEmpty } from './MetricChartEmpty.js';
+import { MetricChartTooltip } from './MetricChartTooltip.js';
 import 'react';
 import '../../../stores/currencyRatesStore.js';
 import '@tanstack/react-query';
@@ -15,12 +13,11 @@ import { useFormatLineChartData } from '../../../hooks/useFormatLineChartData.js
 import '../../../utils/dayjs.js';
 import '../../../utils/analytics.js';
 import '../../../types/template.js';
+import { ANALYTICS_METRIC_TOOLTIP } from '../../../constants/analytic-metric-tooltip.js';
+import '../../../constants/breakdown-targets.js';
 
 const MetricChart = ({ lineChartData, isLoading, isEmptyMetricData, columnTypes, metricKey, }) => {
-    const { formatValue, yAxisOptions } = useFormatLineChartData({
-        metricKey,
-        columnTypes: columnTypes || {},
-    });
+    const { formatValue, yAxisOptions } = useFormatLineChartData({ metricKey, columnTypes: columnTypes || {} });
     if (!metricKey) {
         return jsx(Fragment, {});
     }

package/dist/esm/components/common/chart/MetricChart.mjs

@@ -1,13 +1,11 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
-import { MetricChartTooltip } from './MetricChartTooltip.mjs';
-import { ANALYTICS_METRIC_TOOLTIP } from '../../../constants/analytic-metric-tooltip.mjs';
-import '../../../constants/breakdown-targets.mjs';
-import { MetricChartEmpty } from './MetricChartEmpty.mjs';
-import { GChartSkeleton } from './GChartSkeleton.mjs';
 import '../../../providers/ConvertMoneyProvider.mjs';
 import { MetricChartProvider } from '../../../providers/MetricChartProvider.mjs';
 import '../../../providers/TimezoneProvider.mjs';
 import { LineChart } from '@shopify/polaris-viz';
+import { GChartSkeleton } from './GChartSkeleton.mjs';
+import { MetricChartEmpty } from './MetricChartEmpty.mjs';
+import { MetricChartTooltip } from './MetricChartTooltip.mjs';
 import 'react';
 import '../../../stores/currencyRatesStore.mjs';
 import '@tanstack/react-query';
@@ -15,12 +13,11 @@ import { useFormatLineChartData } from '../../../hooks/useFormatLineChartData.mj
 import '../../../utils/dayjs.mjs';
 import '../../../utils/analytics.mjs';
 import '../../../types/template.mjs';
+import { ANALYTICS_METRIC_TOOLTIP } from '../../../constants/analytic-metric-tooltip.mjs';
+import '../../../constants/breakdown-targets.mjs';
 
 const MetricChart = ({ lineChartData, isLoading, isEmptyMetricData, columnTypes, metricKey, }) => {
-    const { formatValue, yAxisOptions } = useFormatLineChartData({
-        metricKey,
-        columnTypes: columnTypes || {},
-    });
+    const { formatValue, yAxisOptions } = useFormatLineChartData({ metricKey, columnTypes: columnTypes || {} });
     if (!metricKey) {
         return jsx(Fragment, {});
     }

package/dist/esm/components/common/chart/MetricChartEmpty.js

@@ -17,6 +17,7 @@ import '../../../shared/components/GPagination/GPagination.js';
 import '../../../shared/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';
@@ -28,9 +29,8 @@ 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 '../../../providers/ConvertMoneyProvider.js';
 
-const MetricChartEmpty = ({ boxProps, minHeight, description, title, }) => {
+const MetricChartEmpty = ({ boxProps, minHeight, description, title }) => {
     return (jsx(Box, { minWidth: "100%", ...boxProps, children: jsx(GBlockCenter, { minHeight: minHeight, children: jsx(Box, { padding: '400', children: jsxs(BlockStack, { gap: "400", align: "center", inlineAlign: "center", children: [jsx("div", { className: "h-[80px] w-[80px]", children: jsx(GThumbnail, { source: ANALYTIC_EMPTY, width: "80px", height: "80px", alt: title, classRemoved: true }) }), jsxs(BlockStack, { gap: "200", align: "center", inlineAlign: "center", children: [jsx(Text, { as: "h4", variant: "headingSm", fontWeight: "semibold", children: title }), jsx(Text, { as: "h4", variant: "bodyMd", tone: "subdued", children: description })] })] }) }) }) }));
 };
 

package/dist/esm/components/common/chart/MetricChartEmpty.mjs

@@ -17,6 +17,7 @@ import '../../../shared/components/GPagination/GPagination.mjs';
 import '../../../shared/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';
@@ -28,9 +29,8 @@ 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 '../../../providers/ConvertMoneyProvider.mjs';
 
-const MetricChartEmpty = ({ boxProps, minHeight, description, title, }) => {
+const MetricChartEmpty = ({ boxProps, minHeight, description, title }) => {
     return (jsx(Box, { minWidth: "100%", ...boxProps, children: jsx(GBlockCenter, { minHeight: minHeight, children: jsx(Box, { padding: '400', children: jsxs(BlockStack, { gap: "400", align: "center", inlineAlign: "center", children: [jsx("div", { className: "h-[80px] w-[80px]", children: jsx(GThumbnail, { source: ANALYTIC_EMPTY, width: "80px", height: "80px", alt: title, classRemoved: true }) }), jsxs(BlockStack, { gap: "200", align: "center", inlineAlign: "center", children: [jsx(Text, { as: "h4", variant: "headingSm", fontWeight: "semibold", children: title }), jsx(Text, { as: "h4", variant: "bodyMd", tone: "subdued", children: description })] })] }) }) }) }));
 };
 

package/dist/esm/components/common/chart/MetricDonutChartSkeleton.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { MetricInfoSkeleton } from './MetricInfoSkeleton.js';
 import { Card, BlockStack } from '@shopify/polaris';
 import { GChartSkeleton } from './GChartSkeleton.js';
+import { MetricInfoSkeleton } from './MetricInfoSkeleton.js';
 
 const MetricDonutChartSkeleton = () => {
     return (jsx(Card, { children: jsxs(BlockStack, { gap: "400", children: [jsx(MetricInfoSkeleton, { isShowOneLine: true }), jsx(GChartSkeleton, {})] }) }));

package/dist/esm/components/common/chart/MetricDonutChartSkeleton.mjs

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { MetricInfoSkeleton } from './MetricInfoSkeleton.mjs';
 import { Card, BlockStack } from '@shopify/polaris';
 import { GChartSkeleton } from './GChartSkeleton.mjs';
+import { MetricInfoSkeleton } from './MetricInfoSkeleton.mjs';
 
 const MetricDonutChartSkeleton = () => {
     return (jsx(Card, { children: jsxs(BlockStack, { gap: "400", children: [jsx(MetricInfoSkeleton, { isShowOneLine: true }), jsx(GChartSkeleton, {})] }) }));

package/dist/esm/components/common/chart/MetricInfoBlock.d.ts

@@ -1,6 +1,6 @@
-import type { IMetricCardItem } from '../../../types';
 import type { TextProps } from '@shopify/polaris';
 import type { ReactElement } from 'react';
+import type { IMetricCardItem } from '../../../types';
 export interface IProps {
     item: IMetricCardItem;
     isHovered: boolean;

package/dist/esm/components/common/chart/MetricInfoBlock.js

@@ -1,10 +1,6 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { BlockStack, InlineStack, Box, Text, Icon } from '@shopify/polaris';
-import { ANALYTICS_METRIC_TOOLTIP } from '../../../constants/analytic-metric-tooltip.js';
-import '../../../constants/breakdown-targets.js';
 import { ChevronRightIcon } from '@shopify/polaris-icons';
-import { MetricValueSummary } from './MetricValueSummary.js';
-import { MetricInfoSkeleton } from './MetricInfoSkeleton.js';
 import 'react';
 import '../../../utils/dayjs.js';
 import '../../../utils/analytics.js';
@@ -18,6 +14,7 @@ import '../../../shared/components/GPagination/GPagination.js';
 import '../../../shared/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';
@@ -29,7 +26,10 @@ 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 '../../../providers/ConvertMoneyProvider.js';
+import { ANALYTICS_METRIC_TOOLTIP } from '../../../constants/analytic-metric-tooltip.js';
+import '../../../constants/breakdown-targets.js';
+import { MetricInfoSkeleton } from './MetricInfoSkeleton.js';
+import { MetricValueSummary } from './MetricValueSummary.js';
 
 const MetricInfoBlock = ({ item, isHovered, isLoading, hideComparison, titleVariant = 'headingMd', titleFontWeight, isMockData, onClickTitle, }) => {
     const { key, title, totalValue } = item;

package/dist/esm/components/common/chart/MetricInfoBlock.mjs

@@ -1,10 +1,6 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { BlockStack, InlineStack, Box, Text, Icon } from '@shopify/polaris';
-import { ANALYTICS_METRIC_TOOLTIP } from '../../../constants/analytic-metric-tooltip.mjs';
-import '../../../constants/breakdown-targets.mjs';
 import { ChevronRightIcon } from '@shopify/polaris-icons';
-import { MetricValueSummary } from './MetricValueSummary.mjs';
-import { MetricInfoSkeleton } from './MetricInfoSkeleton.mjs';
 import 'react';
 import '../../../utils/dayjs.mjs';
 import '../../../utils/analytics.mjs';
@@ -18,6 +14,7 @@ import '../../../shared/components/GPagination/GPagination.mjs';
 import '../../../shared/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';
@@ -29,7 +26,10 @@ 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 '../../../providers/ConvertMoneyProvider.mjs';
+import { ANALYTICS_METRIC_TOOLTIP } from '../../../constants/analytic-metric-tooltip.mjs';
+import '../../../constants/breakdown-targets.mjs';
+import { MetricInfoSkeleton } from './MetricInfoSkeleton.mjs';
+import { MetricValueSummary } from './MetricValueSummary.mjs';
 
 const MetricInfoBlock = ({ item, isHovered, isLoading, hideComparison, titleVariant = 'headingMd', titleFontWeight, isMockData, onClickTitle, }) => {
     const { key, title, totalValue } = item;

package/dist/esm/components/common/chart/MetricValueSummary.d.ts

@@ -1,5 +1,5 @@
-import type { IMetricControl } from '../../../types';
 import type { ReactElement } from 'react';
+import type { IMetricControl } from '../../../types';
 interface IProps {
     totalValue: IMetricControl;
     hideComparison?: boolean;