@levi-gemcommerce/analytics 1.0.0-dev.35 → 1.0.0-dev.37

package/dist/esm/index.js

@@ -13,8 +13,8 @@ import { create } from 'zustand';
 import { useQuery } from '@tanstack/react-query';
 import { PolarisVizProvider, LineChart, DonutChart } from '@shopify/polaris-viz';
 import chartStyle from '@shopify/polaris-viz/build/esm/styles.css?url';
-import { unstable_batchedUpdates, createPortal } from 'react-dom';
 import { t as t$1 } from 'i18next';
+import { unstable_batchedUpdates, createPortal } from 'react-dom';
 
 var EMetricKey;
 (function (EMetricKey) {
@@ -170,7 +170,7 @@ var ETrafficSourceType;
  *
  * They are duplicated here so the SDK no longer needs to import the host's
  * pricing module directly. The host can import these enums back from
- * `@gem-sdk/analytics/types` to build the value passed to `PricingProvider`,
+ * `@gem-sdk/analytics/types` to build the value passed to `PathAnalysisConfigProvider`,
  * which guarantees the string values stay in sync on both sides.
  */
 var IPlanKey;
@@ -1266,45 +1266,6 @@ const MetricChartProvider = ({ children, minHeight = CHART_MIN_HEIGHT, seriesCol
                 }, children: children })] }));
 };
 
-const DEFAULT_PRICING_CONTEXT = {
-    isLoading: false,
-    activePlanKey: IPlanKey.PAGE_OPT,
-    shopPlanState: IShopPlanState.LOADING_PLAN,
-    isPathAnalysisEnabled: false,
-    onOpenModalPricing: () => { },
-};
-const PricingContext = createContext(DEFAULT_PRICING_CONTEXT);
-const PricingProvider = ({ children, isLoading, activePlanKey, shopPlanState, isPathAnalysisEnabled, onOpenModalPricing, }) => {
-    const value = useMemo(() => ({ isLoading, activePlanKey, shopPlanState, isPathAnalysisEnabled, onOpenModalPricing }), [isLoading, activePlanKey, shopPlanState, isPathAnalysisEnabled, onOpenModalPricing]);
-    return jsx(PricingContext.Provider, { value: value, children: children });
-};
-const usePricingContext = () => useContext(PricingContext);
-/**
- * The hooks below mirror the host's `~/modules/pricing` API so existing SDK
- * components only need to swap their import path. Each one reads from the
- * injected `PricingContext`.
- */
-const usePricingPlanActive = () => {
-    const { isLoading, activePlanKey } = usePricingContext();
-    return { isLoading, activePlanKey };
-};
-const usePricingPlanActiveState = () => {
-    const { shopPlanState } = usePricingContext();
-    return { shopPlanState };
-};
-/**
- * `planKey` is kept for API compatibility with the host hook. The SDK only ever
- * checks the active plan, so the enabled flag is taken straight from context.
- */
-const useLimitPathAnalysis = (_props) => {
-    const { isPathAnalysisEnabled } = usePricingContext();
-    return { isEnabled: isPathAnalysisEnabled };
-};
-const usePricingModalMonitor = () => {
-    const { onOpenModalPricing } = usePricingContext();
-    return { onOpenModalPricing };
-};
-
 const useEnhancedEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
 
 const NONE_VALUE = 'None';
@@ -2963,19 +2924,24 @@ const GTimePicker = (props) => {
     return (jsxs(InlineStack, { gap: "200", children: [jsx(MainTimePicker, { ...timePickerProps }), isCompare && (jsx(CompareTimePicker, { rangeAddition: timePickerProps.rangeAddition, popoverProps: timePickerProps.popoverProps }))] }));
 };
 
-const CardPathAnalysisSkeleton = () => {
-    return (jsxs(BlockStack, { gap: "200", children: [jsx(MetricInfoSkeleton, {}), jsx(GSkeletonDisplayText, { height: "350px" })] }));
+const DEFAULT_CONFIG = {
+    pricing: {
+        isLoading: false,
+        isPathAnalysisEnabled: false,
+        onOpenModalPricing: () => { },
+    },
+    heatmap: {
+        isEnabledV1: false,
+        isEnabledV2: false,
+        onView: () => { },
+    },
 };
-
-const getTotalSessionWithCartAdditionMetric = ({ metric }) => ({
-    value: metric?.totalSessionsWithCartAdditions ?? undefined,
-});
-const getTotalSessionReachedCheckoutMetric = ({ metric }) => ({
-    value: metric?.totalSessionsThatReachedCheckout ?? undefined,
-});
-const getTotalSessionCompletedCheckoutMetric = ({ metric }) => ({
-    value: metric?.totalSessionsThatCompletedCheckout ?? undefined,
-});
+const PathAnalysisConfigContext = createContext(DEFAULT_CONFIG);
+const PathAnalysisConfigProvider = ({ children, pricing, heatmap }) => {
+    const value = useMemo(() => ({ pricing, heatmap }), [pricing, heatmap]);
+    return jsx(PathAnalysisConfigContext.Provider, { value: value, children: children });
+};
+const usePathAnalysisConfig = () => useContext(PathAnalysisConfigContext);
 
 var IPAMetricKey;
 (function (IPAMetricKey) {
@@ -3004,10 +2970,31 @@ var IPAMetricKey;
 
 const formatMetricByFormatter = (_params) => '';
 const PA_METRIC_TOOLTIP = {};
-const useMetricsTimeFilter = () => ({
-    dateTimePicked: undefined,
-    compareDateTimePicked: undefined,
-});
+
+const METRICS_COLUMNS = {
+    [IPAMetricKey.PAGE_SESSIONS]: { label: 'Sessions' },
+    [IPAMetricKey.PAGE_BR]: { label: 'Bounce rate' },
+    [IPAMetricKey.PAGE_CTR]: { label: 'Click-through rate' },
+    [IPAMetricKey.PAGE_CR]: { label: 'Conversion rate' },
+    [IPAMetricKey.PAGE_VISITORS]: { label: 'Visitors' },
+    [IPAMetricKey.PAGE_AVG_TIME]: { label: 'Avg time on page' },
+    [IPAMetricKey.PAGE_VIEWS]: { label: 'Pageviews' },
+    [IPAMetricKey.PAGE_REVENUE]: { label: 'Revenue' },
+    [IPAMetricKey.PAGE_ADDED_TO_CART]: { label: 'Added to cart' },
+    [IPAMetricKey.PAGE_REACHED_CHECKOUT]: { label: 'Sessions that reached checkout' },
+    [IPAMetricKey.PAGE_COMPLETE_CHECKOUT]: { label: 'Sessions that completed checkout' },
+    [IPAMetricKey.PAGE_RPV]: { label: 'Revenue per visitor' },
+    [IPAMetricKey.PAGE_CART_ADDITION]: { label: 'Sessions with cart additions' },
+    [IPAMetricKey.PAGE_ADD_TO_CART_RATE]: { label: 'Add to cart rate' },
+    [IPAMetricKey.PAGE_ORDERS]: { label: 'Orders' },
+    [IPAMetricKey.PAGE_AOV]: { label: 'Average order value' },
+    [IPAMetricKey.PAGE_SESSIONS_BY_VISITOR]: { label: 'Visitor by type' },
+    [IPAMetricKey.PAGE_SESSIONS_BY_TRAFFIC]: { label: 'Sessions by traffic source' },
+    [IPAMetricKey.PAGE_PATH_ANALYSIS]: { label: 'Journey analysis' },
+    [IPAMetricKey.PAGE_SESSIONS_BY_DEVICE]: { label: 'Sessions by device type' },
+    [IPAMetricKey.PAGE_NEW_RETURNING_CUSTOMER]: { label: 'New vs returning visitors' },
+};
+const PAGE_ANALYTIC_MAPPING = Object.fromEntries(Object.values(IPAMetricKey).map((key) => [key, { heading: { title: METRICS_COLUMNS[key].label } }]));
 
 const removeDuplicates = (data, keys) => {
     if (!Array.isArray(data))
@@ -3036,11 +3023,6 @@ const buildTree = (items) => {
     return tree;
 };
 
-const LOCATION_PATH_KEY = 'location_path';
-const SHOPIFY_PAGE_TYPE_KEY = 'shopify_page_type';
-const METRICS_COLUMNS = {};
-const PAGE_ANALYTIC_MAPPING = {};
-
 const processPathAnalytics = (analyticsData, locationPath) => {
     if (!analyticsData)
         return undefined;
@@ -3105,6 +3087,49 @@ const getFunnelChartTooltip = (data) => {
     return baseInfo.concat(metricInfo);
 };
 
+const usePathAnalysisStore = create()((set) => ({
+    firstLevelLocationPath: undefined,
+    setFirstLevelLocationPath: (firstLevelLocationPath) => set({ firstLevelLocationPath }),
+}));
+
+var IVariantType;
+(function (IVariantType) {
+    IVariantType["VARIANT_A"] = "A";
+    IVariantType["VARIANT_B"] = "B";
+})(IVariantType || (IVariantType = {}));
+const usePathAnalysisCampaignStore = create()((set) => ({
+    selectedVariantType: IVariantType.VARIANT_A,
+    setSelectedVariantType: (selectedVariantType) => set({ selectedVariantType }),
+}));
+
+const useFunnelChartStore = create()((set, get) => ({
+    cachedFunnelChartData: {},
+    setCachedFunnelChartData: (key, funnelChartData) => {
+        const currentFunnelChartData = deepCopy(get().cachedFunnelChartData);
+        currentFunnelChartData[key] = {
+            ...currentFunnelChartData[key],
+            ...funnelChartData,
+        };
+        set({ cachedFunnelChartData: currentFunnelChartData });
+    },
+    resetData: () => {
+        set({ cachedFunnelChartData: {} });
+    },
+}));
+
+const MAX_FUNNEL_ADDITIONAL_LEVEL = 3;
+const FINAL_FUNNEL_FIXED_LEVEL = 3;
+
+const getTotalSessionWithCartAdditionMetric = ({ metric }) => ({
+    value: metric?.totalSessionsWithCartAdditions ?? undefined,
+});
+const getTotalSessionReachedCheckoutMetric = ({ metric }) => ({
+    value: metric?.totalSessionsThatReachedCheckout ?? undefined,
+});
+const getTotalSessionCompletedCheckoutMetric = ({ metric }) => ({
+    value: metric?.totalSessionsThatCompletedCheckout ?? undefined,
+});
+
 const calculateFunnelTrendChange = ({ currentValue, previousValue, }) => {
     const shouldSkipComparison = typeof currentValue !== 'number' || typeof previousValue !== 'number' || previousValue === 0;
     if (shouldSkipComparison)
@@ -3179,79 +3204,9 @@ const calculateConversionFunnelTrends = ({ pageWithMetric, previousPathAnalytics
     return trends;
 };
 
-const useHeatmapModalMonitor = () => ({
-    onOpenModal: () => { },
-});
-
-var EHeatmapBaseFilterType;
-(function (EHeatmapBaseFilterType) {
-    EHeatmapBaseFilterType["DATE_RANGE"] = "date_range";
-    EHeatmapBaseFilterType["URL_PATH"] = "url_path";
-    EHeatmapBaseFilterType["ANALYTIC_MODE"] = "analytic_mode";
-    EHeatmapBaseFilterType["OPERATOR"] = "operator";
-})(EHeatmapBaseFilterType || (EHeatmapBaseFilterType = {}));
-var EHeatmapFilterType;
-(function (EHeatmapFilterType) {
-    EHeatmapFilterType["VISITOR_JOURNEY"] = "visitor_journey";
-    EHeatmapFilterType["MARKET"] = "market";
-    EHeatmapFilterType["VISITOR_TYPE"] = "visitor_type";
-    EHeatmapFilterType["TRAFFIC_SOURCE"] = "traffic_source";
-    EHeatmapFilterType["PURCHASE_TYPE"] = "purchase_type";
-    EHeatmapFilterType["TIME_ON_PAGE"] = "time_on_page";
-    EHeatmapFilterType["ORDER_VALUE"] = "order_value";
-    EHeatmapFilterType["CAMPAIGN"] = "campaign_id";
-    EHeatmapFilterType["REFERRAL_SOURCE"] = "referral_source";
-})(EHeatmapFilterType || (EHeatmapFilterType = {}));
-
-const useHeatmapFilterBuildParams = () => ({
-    buildSearchParams: () => ({ toString: () => '' }),
-});
-
-const usePathAnalysisStore = create()((set) => ({
-    firstLevelLocationPath: undefined,
-    setFirstLevelLocationPath: (firstLevelLocationPath) => set({ firstLevelLocationPath }),
-}));
-
-var IVariantType;
-(function (IVariantType) {
-    IVariantType["VARIANT_A"] = "A";
-    IVariantType["VARIANT_B"] = "B";
-})(IVariantType || (IVariantType = {}));
-const usePathAnalysisCampaignStore = create()((set) => ({
-    selectedVariantType: IVariantType.VARIANT_A,
-    setSelectedVariantType: (selectedVariantType) => set({ selectedVariantType }),
-}));
-
-const useFunnelChartStore = create()((set, get) => ({
-    cachedFunnelChartData: {},
-    setCachedFunnelChartData: (key, funnelChartData) => {
-        const currentFunnelChartData = deepCopy(get().cachedFunnelChartData);
-        currentFunnelChartData[key] = {
-            ...currentFunnelChartData[key],
-            ...funnelChartData,
-        };
-        set({ cachedFunnelChartData: currentFunnelChartData });
-    },
-    resetData: () => {
-        set({ cachedFunnelChartData: {} });
-    },
-}));
-
-const MAX_FUNNEL_ADDITIONAL_LEVEL = 3;
-const FINAL_FUNNEL_FIXED_LEVEL = 3;
-
-// Framework-agnostic replacement for @remix-run/react useSearchParams.
-// Returns a read-only URLSearchParams from window.location.search so the SDK
-// works outside of a Remix/React Router context (e.g. Next.js, plain React).
-const useSearchParams = () => {
-    const params = typeof window !== 'undefined' ? new URLSearchParams(window.location.search) : new URLSearchParams();
-    return [params];
-};
-
-const usePathAnalysisFunnel = ({ pathAnalytics, pathAnalysisCacheKey, dataFirstLevels, }) => {
-    const [searchParams] = useSearchParams();
+const usePathAnalysisFunnel = ({ pathAnalytics, pathAnalysisCacheKey, dataFirstLevels, locationPath, }) => {
     const setFirstLevelLocationPath = usePathAnalysisStore((state) => state.setFirstLevelLocationPath);
-    const firstLevelLocationPath = usePathAnalysisStore((state) => state.firstLevelLocationPath) || searchParams.get(LOCATION_PATH_KEY);
+    const firstLevelLocationPath = usePathAnalysisStore((state) => state.firstLevelLocationPath) || locationPath;
     const setCachedFunnelChartData = useFunnelChartStore((state) => state.setCachedFunnelChartData);
     const resetCachedFunnelChartData = useFunnelChartStore((state) => state.resetData);
     const cachedFunnelChartData = useFunnelChartStore((state) => state.cachedFunnelChartData);
@@ -3386,330 +3341,65 @@ const usePathAnalyticsMerger = ({ pathAnalytics, dataFirstLevels }) => {
             else {
                 acc.otherLevelsData.push(item);
             }
-            return acc;
-        }, {
-            firstLevelData: {},
-            otherLevelsData: [],
-        });
-    }, [pathAnalytics]);
-    const processedPathAnalytics = useMemo(() => {
-        if (!dataFirstLevels)
-            return pathAnalytics;
-        const mergedFirstLevels = dataFirstLevels.map((item) => {
-            const firstLevelDataItem = firstLevelData[item.locationPath];
-            if (!firstLevelDataItem) {
-                return item;
-            }
-            return firstLevelDataItem;
-        });
-        return [...mergedFirstLevels, ...otherLevelsData];
-    }, [pathAnalytics, dataFirstLevels, firstLevelData, otherLevelsData]);
-    return { processedPathAnalytics };
-};
-
-const PathAnalysisContext = createContext(undefined);
-const PathAnalysisProvider = (props) => {
-    const { children, campaignID, campaignGroupID, campaignVariantID, campaignVersionID, mode, campaignPathsData, analyticsData, } = props;
-    const dataFirstLevels = campaignPathsData?.paths;
-    const isFetchingFirstLevelPaths = campaignPathsData?.isLoading ?? false;
-    const pathAnalytics = analyticsData?.pathAnalytics ?? [];
-    const previousPathAnalyticsMap = analyticsData?.previousPathAnalyticsMap ?? {};
-    const isLoadingMetric = analyticsData?.isLoading ?? false;
-    const pathAnalysisCacheKey = JSON.stringify({ mode, campaignVariantID, campaignVersionID });
-    const { processedPathAnalytics } = usePathAnalyticsMerger({ pathAnalytics, dataFirstLevels });
-    const pathAnalysisFunnelData = usePathAnalysisFunnel({
-        pathAnalytics: processedPathAnalytics,
-        pathAnalysisCacheKey,
-        dataFirstLevels,
-    });
-    const isLoading = isLoadingMetric || isFetchingFirstLevelPaths;
-    return (jsx(PathAnalysisContext.Provider, { value: {
-            mode,
-            campaignID,
-            campaignGroupID,
-            campaignVariantID,
-            campaignVersionID,
-            pathAnalytics: processedPathAnalytics,
-            previousPathAnalyticsMap,
-            isLoadingMetric: isLoading,
-            ...pathAnalysisFunnelData,
-        }, children: children }));
-};
-const usePathAnalysisContext = () => {
-    const context = useContext(PathAnalysisContext);
-    if (!context) {
-        throw new Error('usePathAnalysisContext must be used within a PathAnalysisProvider');
-    }
-    return context;
-};
-
-const buildJourneyPage = (page, index, { heatmapLevel, campaignData }) => ({
-    id: page.id,
-    path: page.locationPath || '',
-    level: index + 1,
-    isHeatmap: index === heatmapLevel,
-    ...(heatmapLevel > 0 && index === 0 && campaignData && { subFilter: { campaignData } }),
-});
-const usePathAnalysisHeatmap = () => {
-    const selectedVariantType = usePathAnalysisCampaignStore((state) => state.selectedVariantType);
-    const { dateTimePicked } = useMetricsTimeFilter();
-    const { mode, campaignID, campaignVariantID, campaignGroupID } = usePathAnalysisContext();
-    const { onOpenModal } = useHeatmapModalMonitor();
-    const { buildSearchParams } = useHeatmapFilterBuildParams();
-    const handleViewHeatmap = useCallback((level, pages) => {
-        const levelPages = pages.slice(0, level + 1);
-        const clickedPage = levelPages[level];
-        if (!clickedPage)
-            return;
-        const campaignData = campaignID
-            ? {
-                campaignId: campaignID,
-                campaignGroupId: campaignGroupID,
-                campaignVariantId: campaignVariantID || '',
-                campaignVariantType: selectedVariantType,
-            }
-            : undefined;
-        const pageType = clickedPage.pageType;
-        const locationPath = clickedPage.locationPath || '';
-        const isViewFirstLevel = level === 0;
-        const visitorJourney = {
-            value: levelPages.map((page, index) => buildJourneyPage(page, index, { heatmapLevel: level, campaignData })),
-        };
-        const data = buildSearchParams({
-            [EHeatmapFilterType.VISITOR_JOURNEY]: visitorJourney,
-            ...(isViewFirstLevel && campaignData && { [EHeatmapFilterType.CAMPAIGN]: { value: campaignData } }),
-        }, {
-            [EHeatmapBaseFilterType.ANALYTIC_MODE]: { value: mode },
-            [EHeatmapBaseFilterType.DATE_RANGE]: { value: dateTimePicked },
-            [EHeatmapBaseFilterType.URL_PATH]: {
-                value: { path: locationPath, pageType },
-            },
-        });
-        onOpenModal(data.toString());
-    }, [
-        mode,
-        campaignID,
-        dateTimePicked,
-        campaignGroupID,
-        campaignVariantID,
-        selectedVariantType,
-        onOpenModal,
-        buildSearchParams,
-    ]);
-    return {
-        handleViewHeatmap,
-    };
-};
-
-const useConvertMoneyByCurrency = () => ({
-    getTextPrice: () => '',
-});
-
-const useFeatureFlagChecker = () => ({
-    isEnabledHeatmapV1: false,
-    isEnabledHeatmapV2: false,
-});
-
-const FUNNEL_NAME = 'Conversion';
-// Checkout pages don't support heatmap viewing
-const NON_HEATMAP_PAGE_TYPES = new Set([TemplateType.CHECKOUT]);
-const usePathAnalysisChart = () => {
-    const [searchParams] = useSearchParams();
-    const { t } = useTranslation();
-    const { getTextPrice } = useConvertMoneyByCurrency();
-    const { handleViewHeatmap } = usePathAnalysisHeatmap();
-    const shopifyPageType = searchParams.get(SHOPIFY_PAGE_TYPE_KEY);
-    const { pageWithMetric, nextLevelPages, dynamicLevels, previousPathAnalyticsMap, handleAddNextLevel, handleChangeLevel, getPagesByParentID, handleDeleteLevel, } = usePathAnalysisContext();
-    const orderedPages = useMemo(() => [pageWithMetric, ...dynamicLevels].filter(Boolean), [pageWithMetric, dynamicLevels]);
-    const { isEnabledHeatmapV1, isEnabledHeatmapV2 } = useFeatureFlagChecker();
-    const chartTooltipPrimaryAction = useMemo(() => {
-        if (!isEnabledHeatmapV1)
-            return undefined;
-        return {
-            content: t('View heatmap'),
-            onClick: (item) => {
-                if (!item?.id)
-                    return;
-                const level = orderedPages.findIndex((page) => page?.id === item.id);
-                if (level === -1)
-                    return;
-                handleViewHeatmap(level, orderedPages);
-            },
-        };
-    }, [handleViewHeatmap, orderedPages, t, isEnabledHeatmapV1]);
-    const lengthDisplayedLevels = dynamicLevels.length;
-    const isDisabledAddICon = !nextLevelPages.length || lengthDisplayedLevels >= MAX_FUNNEL_ADDITIONAL_LEVEL;
-    const lastLevel = useMemo(() => {
-        return dynamicLevels[dynamicLevels.length - 1] || pageWithMetric;
-    }, [dynamicLevels, pageWithMetric]);
-    const getTooltipAction = useCallback((pageType) => {
-        if (pageType && NON_HEATMAP_PAGE_TYPES.has(pageType))
-            return undefined;
-        return chartTooltipPrimaryAction;
-    }, [chartTooltipPrimaryAction]);
-    const onDeleteFunnel = useCallback((id) => {
-        handleDeleteLevel(id);
-    }, [handleDeleteLevel]);
-    const getConversionFunnelData = useCallback((item) => {
-        const metric = item?.metric;
-        const totalAddedToCart = getTotalSessionWithCartAdditionMetric({ metric }).value;
-        const totalReachedCheckout = getTotalSessionReachedCheckoutMetric({ metric }).value;
-        const totalCompletedCheckout = getTotalSessionCompletedCheckoutMetric({ metric }).value;
-        return [
-            {
-                value: Number(totalAddedToCart ?? 0),
-                key: METRICS_COLUMNS[IPAMetricKey.PAGE_ADDED_TO_CART]?.label ?? t('Added to cart'),
-                labelTooltip: PA_METRIC_TOOLTIP[IPAMetricKey.PAGE_CART_ADDITION],
-            },
-            {
-                value: Number(totalReachedCheckout ?? 0),
-                key: t('Reached checkout'),
-                labelTooltip: PA_METRIC_TOOLTIP[IPAMetricKey.PAGE_REACHED_CHECKOUT],
-            },
-            {
-                value: Number(totalCompletedCheckout ?? 0),
-                key: t('Completed checkout'),
-                labelTooltip: PA_METRIC_TOOLTIP[IPAMetricKey.PAGE_COMPLETE_CHECKOUT],
-            },
-        ];
-    }, [t]);
-    const listFunnelDataMiddle = useMemo(() => dynamicLevels.reduce((acc, item) => {
-        const key = parseTemplateType(item?.pageType) + `-${item.id}` || 'unknown';
-        // Current data
-        acc.currentData.push({
-            value: item.metric?.totalSessions || 0,
-            key,
-            parentID: item.parentID,
-            id: item.id,
-            chartTooltip: getFunnelChartTooltip({
-                page: item,
-                getTextPrice,
-            }),
-            chartTooltipPrimaryAction: isEnabledHeatmapV2 ? getTooltipAction(item?.pageType ?? undefined) : undefined,
-            secondaryActions: [
-                {
-                    onAction: () => onDeleteFunnel(item.id),
-                    icon: SvgDeleteIcon,
-                },
-            ],
-            title: item.pageTitle ?? undefined,
-        });
-        // Previous data
-        acc.previousData.push({
-            value: previousPathAnalyticsMap[item.id]?.metric?.totalSessions || 0,
-            key,
-            title: item.pageTitle ?? undefined,
-        });
-        return acc;
-    }, { currentData: [], previousData: [] }), [dynamicLevels, previousPathAnalyticsMap, onDeleteFunnel, getTextPrice, getTooltipAction, isEnabledHeatmapV2]);
-    const lastLevelPreviousData = previousPathAnalyticsMap[lastLevel?.id ?? ''];
-    const funnelData = useMemo(() => {
-        const firstLevelKey = pageWithMetric?.pageTitle ||
-            parseTemplateType(pageWithMetric?.pageType ?? shopifyPageType) ||
-            'unknown';
-        return [
-            {
-                data: [
-                    {
-                        value: pageWithMetric?.metric?.totalSessions || 0,
-                        key: firstLevelKey,
-                        title: pageWithMetric?.pageTitle,
-                        id: pageWithMetric?.id,
-                        chartTooltip: getFunnelChartTooltip({ page: pageWithMetric, getTextPrice }),
-                        chartTooltipPrimaryAction: getTooltipAction(pageWithMetric?.pageType ?? undefined),
-                    },
-                    ...listFunnelDataMiddle.currentData,
-                    ...getConversionFunnelData(lastLevel),
-                ],
-                name: FUNNEL_NAME,
-                metadata: {
-                    trends: calculateConversionFunnelTrends({
-                        pageWithMetric,
-                        previousPathAnalyticsMap,
-                        dynamicLevels,
-                    }),
-                },
-            },
-            {
-                name: FUNNEL_NAME,
-                data: [
-                    {
-                        value: previousPathAnalyticsMap[pageWithMetric?.id || '']?.metric?.totalSessions || 0,
-                        key: firstLevelKey,
-                    },
-                    ...listFunnelDataMiddle.previousData,
-                    ...getConversionFunnelData(lastLevelPreviousData),
-                ],
-                isComparison: true,
-                isEmptyData: !lastLevelPreviousData || lastLevelPreviousData.metric?.totalSessions === 0,
-            },
-        ];
-    }, [
-        dynamicLevels,
-        pageWithMetric,
-        shopifyPageType,
-        getTextPrice,
-        previousPathAnalyticsMap,
-        listFunnelDataMiddle,
-        getConversionFunnelData,
-        lastLevel,
-        lastLevelPreviousData,
-        getTooltipAction,
-    ]);
-    const formatFunnelSelection = (item) => {
-        const childrenSessions = item.metric?.totalSessions || 0;
-        return {
-            id: item.id,
-            title: item.pageTitle || parseTemplateType(item.pageType),
-            path: item.locationPath ?? undefined,
-            percentage: numberWithCommas(childrenSessions.toString()),
-            parentID: item.parentID,
-        };
-    };
-    const sortByPercentage = (a, b) => {
-        const numericPattern = /[^0-9.-]/g;
-        const aPercentage = Number(a.percentage.replace(numericPattern, ''));
-        const bPercentage = Number(b.percentage.replace(numericPattern, ''));
-        return bPercentage - aPercentage;
-    };
-    // const sortByTitle = (a: IFunnelSelectionItem, b: IFunnelSelectionItem) => {
-    //   const aTitle = a.title || '';
-    //   const bTitle = b.title || '';
-    //   return aTitle.localeCompare(bTitle);
-    // };
-    //list funnel selection to add new funnel
-    const listFunnelSelection = useMemo(() => {
-        if (!nextLevelPages)
-            return [];
-        return nextLevelPages.map(formatFunnelSelection).sort(sortByPercentage);
-    }, [nextLevelPages]);
-    //list funnel selection to change funnel
-    const getListFunnelByID = (data) => {
-        const { level, parentID } = data;
-        const availableChildPages = getPagesByParentID({ level, parentID });
-        // if (level === 0) {
-        //   return availableChildPages.map(formatFunnelSelection).sort(sortByTitle);
-        // }
-        return availableChildPages.map(formatFunnelSelection).sort(sortByPercentage);
-    };
-    const onAddNextFunnel = (id) => {
-        handleAddNextLevel(id);
-    };
-    const onChangeFunnel = (data) => {
-        if (!data.selectedID)
-            return;
-        handleChangeLevel(data);
-    };
-    return {
-        lengthDisplayedLevels,
-        listFunnelSelection,
-        isDisabledAddICon,
-        funnelData,
-        onDeleteFunnel,
-        onAddNextFunnel,
-        onChangeFunnel,
-        getListFunnelByID,
-    };
+            return acc;
+        }, {
+            firstLevelData: {},
+            otherLevelsData: [],
+        });
+    }, [pathAnalytics]);
+    const processedPathAnalytics = useMemo(() => {
+        if (!dataFirstLevels)
+            return pathAnalytics;
+        const mergedFirstLevels = dataFirstLevels.map((item) => {
+            const firstLevelDataItem = firstLevelData[item.locationPath];
+            if (!firstLevelDataItem) {
+                return item;
+            }
+            return firstLevelDataItem;
+        });
+        return [...mergedFirstLevels, ...otherLevelsData];
+    }, [pathAnalytics, dataFirstLevels, firstLevelData, otherLevelsData]);
+    return { processedPathAnalytics };
+};
+
+const PathAnalysisContext = createContext(undefined);
+const PathAnalysisProvider = (props) => {
+    const { children, campaignID, campaignGroupID, campaignVariantID, campaignVersionID, mode, campaignPathsData, analyticsData, } = props;
+    const dataFirstLevels = campaignPathsData?.paths;
+    const isFetchingFirstLevelPaths = campaignPathsData?.isLoading ?? false;
+    const pathAnalytics = analyticsData?.pathAnalytics ?? [];
+    const previousPathAnalyticsMap = analyticsData?.previousPathAnalyticsMap ?? {};
+    const isLoadingMetric = analyticsData?.isLoading ?? false;
+    const locationPath = analyticsData?.locationPath;
+    const shopifyPageType = analyticsData?.shopifyPageType;
+    const pathAnalysisCacheKey = JSON.stringify({ mode, campaignVariantID, campaignVersionID });
+    const { processedPathAnalytics } = usePathAnalyticsMerger({ pathAnalytics, dataFirstLevels });
+    const pathAnalysisFunnelData = usePathAnalysisFunnel({
+        pathAnalytics: processedPathAnalytics,
+        pathAnalysisCacheKey,
+        dataFirstLevels,
+        locationPath,
+    });
+    const isLoading = isLoadingMetric || isFetchingFirstLevelPaths;
+    return (jsx(PathAnalysisContext.Provider, { value: {
+            mode,
+            campaignID,
+            campaignGroupID,
+            campaignVariantID,
+            campaignVersionID,
+            shopifyPageType,
+            pathAnalytics: processedPathAnalytics,
+            previousPathAnalyticsMap,
+            isLoadingMetric: isLoading,
+            ...pathAnalysisFunnelData,
+        }, children: children }));
+};
+const usePathAnalysisContext = () => {
+    const context = useContext(PathAnalysisContext);
+    if (!context) {
+        throw new Error('usePathAnalysisContext must be used within a PathAnalysisProvider');
+    }
+    return context;
 };
 
 var variables = {
@@ -23945,6 +23635,209 @@ const MOCK_DATA_PATH_ANALYSIS = [
     },
 ];
 
+const useConvertMoneyByCurrency = () => ({
+    getTextPrice: () => '',
+});
+
+const FUNNEL_NAME = 'Conversion';
+// Checkout pages don't support heatmap viewing
+const NON_HEATMAP_PAGE_TYPES = new Set([TemplateType.CHECKOUT]);
+const usePathAnalysisChart = () => {
+    const { t } = useTranslation();
+    const { getTextPrice } = useConvertMoneyByCurrency();
+    const { heatmap } = usePathAnalysisConfig();
+    const { shopifyPageType, pageWithMetric, nextLevelPages, dynamicLevels, previousPathAnalyticsMap, handleAddNextLevel, handleChangeLevel, getPagesByParentID, handleDeleteLevel, } = usePathAnalysisContext();
+    const orderedPages = useMemo(() => [pageWithMetric, ...dynamicLevels].filter(Boolean), [pageWithMetric, dynamicLevels]);
+    const chartTooltipPrimaryAction = useMemo(() => {
+        if (!heatmap.isEnabledV1)
+            return undefined;
+        return {
+            content: t('View heatmap'),
+            onClick: (item) => {
+                if (!item?.id)
+                    return;
+                const level = orderedPages.findIndex((page) => page?.id === item.id);
+                if (level === -1)
+                    return;
+                heatmap.onView(level, orderedPages);
+            },
+        };
+    }, [heatmap, orderedPages, t]);
+    const lengthDisplayedLevels = dynamicLevels.length;
+    const isDisabledAddICon = !nextLevelPages.length || lengthDisplayedLevels >= MAX_FUNNEL_ADDITIONAL_LEVEL;
+    const lastLevel = useMemo(() => {
+        return dynamicLevels[dynamicLevels.length - 1] || pageWithMetric;
+    }, [dynamicLevels, pageWithMetric]);
+    const getTooltipAction = useCallback((pageType) => {
+        if (pageType && NON_HEATMAP_PAGE_TYPES.has(pageType))
+            return undefined;
+        return chartTooltipPrimaryAction;
+    }, [chartTooltipPrimaryAction]);
+    const onDeleteFunnel = useCallback((id) => {
+        handleDeleteLevel(id);
+    }, [handleDeleteLevel]);
+    const getConversionFunnelData = useCallback((item) => {
+        const metric = item?.metric;
+        const totalAddedToCart = getTotalSessionWithCartAdditionMetric({ metric }).value;
+        const totalReachedCheckout = getTotalSessionReachedCheckoutMetric({ metric }).value;
+        const totalCompletedCheckout = getTotalSessionCompletedCheckoutMetric({ metric }).value;
+        return [
+            {
+                value: Number(totalAddedToCart ?? 0),
+                key: METRICS_COLUMNS[IPAMetricKey.PAGE_ADDED_TO_CART]?.label ?? t('Added to cart'),
+                labelTooltip: PA_METRIC_TOOLTIP[IPAMetricKey.PAGE_CART_ADDITION],
+            },
+            {
+                value: Number(totalReachedCheckout ?? 0),
+                key: t('Reached checkout'),
+                labelTooltip: PA_METRIC_TOOLTIP[IPAMetricKey.PAGE_REACHED_CHECKOUT],
+            },
+            {
+                value: Number(totalCompletedCheckout ?? 0),
+                key: t('Completed checkout'),
+                labelTooltip: PA_METRIC_TOOLTIP[IPAMetricKey.PAGE_COMPLETE_CHECKOUT],
+            },
+        ];
+    }, [t]);
+    const listFunnelDataMiddle = useMemo(() => dynamicLevels.reduce((acc, item) => {
+        const key = parseTemplateType(item?.pageType) + `-${item.id}` || 'unknown';
+        // Current data
+        acc.currentData.push({
+            value: item.metric?.totalSessions || 0,
+            key,
+            parentID: item.parentID,
+            id: item.id,
+            chartTooltip: getFunnelChartTooltip({
+                page: item,
+                getTextPrice,
+            }),
+            chartTooltipPrimaryAction: heatmap.isEnabledV2 ? getTooltipAction(item?.pageType ?? undefined) : undefined,
+            secondaryActions: [
+                {
+                    onAction: () => onDeleteFunnel(item.id),
+                    icon: SvgDeleteIcon,
+                },
+            ],
+            title: item.pageTitle ?? undefined,
+        });
+        // Previous data
+        acc.previousData.push({
+            value: previousPathAnalyticsMap[item.id]?.metric?.totalSessions || 0,
+            key,
+            title: item.pageTitle ?? undefined,
+        });
+        return acc;
+    }, { currentData: [], previousData: [] }), [dynamicLevels, previousPathAnalyticsMap, onDeleteFunnel, getTextPrice, getTooltipAction, heatmap.isEnabledV2]);
+    const lastLevelPreviousData = previousPathAnalyticsMap[lastLevel?.id ?? ''];
+    const funnelData = useMemo(() => {
+        const firstLevelKey = pageWithMetric?.pageTitle ||
+            parseTemplateType(pageWithMetric?.pageType ?? shopifyPageType) ||
+            'unknown';
+        return [
+            {
+                data: [
+                    {
+                        value: pageWithMetric?.metric?.totalSessions || 0,
+                        key: firstLevelKey,
+                        title: pageWithMetric?.pageTitle,
+                        id: pageWithMetric?.id,
+                        chartTooltip: getFunnelChartTooltip({ page: pageWithMetric, getTextPrice }),
+                        chartTooltipPrimaryAction: getTooltipAction(pageWithMetric?.pageType ?? undefined),
+                    },
+                    ...listFunnelDataMiddle.currentData,
+                    ...getConversionFunnelData(lastLevel),
+                ],
+                name: FUNNEL_NAME,
+                metadata: {
+                    trends: calculateConversionFunnelTrends({
+                        pageWithMetric,
+                        previousPathAnalyticsMap,
+                        dynamicLevels,
+                    }),
+                },
+            },
+            {
+                name: FUNNEL_NAME,
+                data: [
+                    {
+                        value: previousPathAnalyticsMap[pageWithMetric?.id || '']?.metric?.totalSessions || 0,
+                        key: firstLevelKey,
+                    },
+                    ...listFunnelDataMiddle.previousData,
+                    ...getConversionFunnelData(lastLevelPreviousData),
+                ],
+                isComparison: true,
+                isEmptyData: !lastLevelPreviousData || lastLevelPreviousData.metric?.totalSessions === 0,
+            },
+        ];
+    }, [
+        dynamicLevels,
+        pageWithMetric,
+        shopifyPageType,
+        getTextPrice,
+        previousPathAnalyticsMap,
+        listFunnelDataMiddle,
+        getConversionFunnelData,
+        lastLevel,
+        lastLevelPreviousData,
+        getTooltipAction,
+    ]);
+    const formatFunnelSelection = (item) => {
+        const childrenSessions = item.metric?.totalSessions || 0;
+        return {
+            id: item.id,
+            title: item.pageTitle || parseTemplateType(item.pageType),
+            path: item.locationPath ?? undefined,
+            percentage: numberWithCommas(childrenSessions.toString()),
+            parentID: item.parentID,
+        };
+    };
+    const sortByPercentage = (a, b) => {
+        const numericPattern = /[^0-9.-]/g;
+        const aPercentage = Number(a.percentage.replace(numericPattern, ''));
+        const bPercentage = Number(b.percentage.replace(numericPattern, ''));
+        return bPercentage - aPercentage;
+    };
+    // const sortByTitle = (a: IFunnelSelectionItem, b: IFunnelSelectionItem) => {
+    //   const aTitle = a.title || '';
+    //   const bTitle = b.title || '';
+    //   return aTitle.localeCompare(bTitle);
+    // };
+    //list funnel selection to add new funnel
+    const listFunnelSelection = useMemo(() => {
+        if (!nextLevelPages)
+            return [];
+        return nextLevelPages.map(formatFunnelSelection).sort(sortByPercentage);
+    }, [nextLevelPages]);
+    //list funnel selection to change funnel
+    const getListFunnelByID = (data) => {
+        const { level, parentID } = data;
+        const availableChildPages = getPagesByParentID({ level, parentID });
+        // if (level === 0) {
+        //   return availableChildPages.map(formatFunnelSelection).sort(sortByTitle);
+        // }
+        return availableChildPages.map(formatFunnelSelection).sort(sortByPercentage);
+    };
+    const onAddNextFunnel = (id) => {
+        handleAddNextLevel(id);
+    };
+    const onChangeFunnel = (data) => {
+        if (!data.selectedID)
+            return;
+        handleChangeLevel(data);
+    };
+    return {
+        lengthDisplayedLevels,
+        listFunnelSelection,
+        isDisabledAddICon,
+        funnelData,
+        onDeleteFunnel,
+        onAddNextFunnel,
+        onChangeFunnel,
+        getListFunnelByID,
+    };
+};
+
 const PathAnalysisChart = ({ funnelColors, isEnabled }) => {
     const { lengthDisplayedLevels, listFunnelSelection, isDisabledAddICon, funnelData, getListFunnelByID, onAddNextFunnel, onChangeFunnel, } = usePathAnalysisChart();
     const dataSeries = useMemo(() => {
@@ -23978,20 +23871,23 @@ const CardPathAnalysisEmpty = ({ funnelColors }) => {
                 }, children: jsx(CardAnalyticEmpty, { description: t('GemX is collecting data and will display it as soon as possible') }) }), jsx(PathAnalysisChart, { funnelColors: funnelColors, isEnabled: false })] }));
 };
 
+const CardPathAnalysisSkeleton = () => {
+    return (jsxs(BlockStack, { gap: "200", children: [jsx(MetricInfoSkeleton, {}), jsx(GSkeletonDisplayText, { height: "350px" })] }));
+};
+
 const CardPathAnalysisContent = ({ showBadge = true, funnelColors }) => {
     const { pathAnalytics, isLoadingMetric } = usePathAnalysisContext();
-    usePricingPlanActive();
-    const { isEnabled } = useLimitPathAnalysis();
-    if (!isEnabled)
+    const { pricing } = usePathAnalysisConfig();
+    if (!pricing.isPathAnalysisEnabled)
         return jsx(CardPathAnalysisLocked, { funnelColors: funnelColors });
     if (isLoadingMetric || !pathAnalytics)
         return jsx(CardPathAnalysisSkeleton, {});
     if (!pathAnalytics.length)
         return jsx(CardPathAnalysisEmpty, { funnelColors: funnelColors });
-    return (jsx("div", { className: cls('relative pr-1', { 'GAnalytic-Badge-Logo GPath-Badge-Logo': showBadge }), children: jsx(PathAnalysisChart, { funnelColors: funnelColors, isEnabled: isEnabled }) }));
+    return (jsx("div", { className: cls('relative pr-1', { 'GAnalytic-Badge-Logo GPath-Badge-Logo': showBadge }), children: jsx(PathAnalysisChart, { funnelColors: funnelColors, isEnabled: pricing.isPathAnalysisEnabled }) }));
 };
 const CardPathAnalysisLocked = ({ funnelColors }) => {
-    const { onOpenModalPricing } = usePricingModalMonitor();
+    const { pricing } = usePathAnalysisConfig();
     return (jsxs("div", { className: cls('relative pr-1'), children: [jsx("div", { className: "absolute z-[1000] h-full w-full", children: jsx(GFeatureLocked, { title: t$1('See your customer journey and where they leave'), description: t$1('Upgrade to {{planName}} to focus on key steps in the journey', {
                         planName: 'Funnel Optimize',
                     }), inlineAlign: "end", type: IGFeatureLocked.PathAnalysis, boxProps: {
@@ -24005,7 +23901,7 @@ const CardPathAnalysisLocked = ({ funnelColors }) => {
                         width: '635px',
                         maxWidth: '100%',
                     }, buttonProps: {
-                        onClick: onOpenModalPricing,
+                        onClick: pricing.onOpenModalPricing,
                     } }) }), jsx(PathAnalysisChart, { funnelColors: funnelColors, isEnabled: false })] }));
 };
 
@@ -24015,15 +23911,15 @@ const CardPathAnalysisWrapper = ({ children, campaignID, campaignGroupID, campai
 
 const CardPathAnalysis = (props) => {
     const { campaignID, campaignGroupID, campaignVariantID, analyticMode, children, campaignPathsData, campaignVersionID, analyticsData, } = props;
-    const { isLoading } = usePricingPlanActive();
-    if (isLoading)
+    const { pricing } = usePathAnalysisConfig();
+    if (pricing.isLoading)
         return null;
     return (jsxs(CardPathAnalysisWrapper, { campaignID: campaignID, campaignGroupID: campaignGroupID, campaignVariantID: campaignVariantID, analyticMode: analyticMode, campaignPathsData: campaignPathsData, campaignVersionID: campaignVersionID, analyticsData: analyticsData, children: [jsx(Box, { children: children }), jsx(CardPathAnalysisContent, { ...props })] }));
 };
 
-const CardJourneyAnalysis = ({ analyticMode, ...props }) => {
+const CardJourneyAnalysis = ({ analyticMode, config, ...props }) => {
     const { t } = useTranslation();
-    return (jsx(CardPathAnalysis, { analyticMode: analyticMode || EAnalyticMode.ALL_SESSION, ...props, children: jsx(InlineStack, { gap: "200", children: jsx(GTooltipCard, { tooltip: ANALYTICS_METRIC_TOOLTIP[EMetricKey.PAGE_PATH_ANALYSIS], children: jsx(Text, { as: "h3", variant: "headingMd", children: t('Journey analysis') }) }) }) }));
+    return (jsx(PathAnalysisConfigProvider, { ...config, children: jsx(CardPathAnalysis, { analyticMode: analyticMode || EAnalyticMode.ALL_SESSION, ...props, children: jsx(InlineStack, { gap: "200", children: jsx(GTooltipCard, { tooltip: ANALYTICS_METRIC_TOOLTIP[EMetricKey.PAGE_PATH_ANALYSIS], children: jsx(Text, { as: "h3", variant: "headingMd", children: t('Journey analysis') }) }) }) }) }));
 };
 
 function isBrowser() {
@@ -24069,4 +23965,4 @@ const useStickyFilterBoxProps = ({ id }) => {
     };
 };
 
-export { ANALYTICS_METRIC_TOOLTIP, AnalyticModeSelector, CAMPAIGN_BACKGROUND_MAIN, CHART_MIN_HEIGHT, COMPARE_DATE_TIME_FILTERS_MAP, CardJourneyAnalysis, CardPathAnalysis, CompareDateTimePickerAlias, ConvertMoneyProvider, CurrencySelector, DATE_TIME_COMPARISON_FILTERS, DEFAULT_CURRENCY_ANALYTIC, DEFAULT_CURRENT_PERIOD_LABEL, DEFAULT_PREVIOUS_PERIOD_LABEL, DateTimeFilterInputs, DateTimeFilters, DateTimePickerContext, DateTimePickerProvider, FUNNEL_POPOVER_KEY, GSelectableMetricChartCard, GTimePicker, IVariantType, MOCK_DATA_PATH_ANALYSIS, MainDateTimePickerAlias, MetricChartProvider, MetricDonutChartCard, PLACEHOLDER_VALUE$1 as PLACEHOLDER_VALUE, PREVIOUS_PERIOD_FILTER, PathAnalysisContext, PathAnalysisProvider, PricingProvider, SERIES_COLORS, SingleMetricChartCard, TARGET_CHANNEL, TARGET_DEVICES, TARGET_VISITOR, THUMB_PRODUCT_DEFAULT, TREND_TONE, convertDateToTz, convertToDateTimeFilters, createLastDaysRange, dayjsTz, dayjsTzToDate, dayjsTzToLocalTZ, formatDate, formatDateTimeRange, formatDayjs, formatMs, formatTime, formatTimeRange, getDateRangeTitle, getDateTimeFilterBase, getDateTimeFilterByAlias, getDateTimeFilterMapping, getEndOfDayBy, getInitialTimezone, getLast12Months, getLast30Days, getLast365Days, getLast7Days, getLast90Days, getLastMonth, getLastYear, getMonthAndYearByDateFilter, getNoComparison, getPreviousMonth, getPreviousPeriod, getPreviousQuarter, getPreviousWeek, getPreviousYear, getToday, getVersionDateDescription, getVersionDateRangeTitle, getYesterday, isDate, isMidnight, isSameDayTimestamp, isValidDate, isValidYearMonthDayDateString, parseYearMonthDayDateString, setTz, useConvertMoneyContext, useCurrencyRatesStore, useDateTimeFilter, useDateTimePicker, useDateTimePickerContext, useFunnelChartStore, useIsStickyById, useLimitPathAnalysis, usePathAnalysisCampaignStore, usePathAnalysisContext, usePathAnalysisStore, usePricingContext, usePricingModalMonitor, usePricingPlanActive, usePricingPlanActiveState, useStickyFilterBoxProps, useVersionDateTimeFilters };
+export { ANALYTICS_METRIC_TOOLTIP, AnalyticModeSelector, CAMPAIGN_BACKGROUND_MAIN, CHART_MIN_HEIGHT, COMPARE_DATE_TIME_FILTERS_MAP, CardJourneyAnalysis, CardPathAnalysis, CompareDateTimePickerAlias, ConvertMoneyProvider, CurrencySelector, DATE_TIME_COMPARISON_FILTERS, DEFAULT_CURRENCY_ANALYTIC, DEFAULT_CURRENT_PERIOD_LABEL, DEFAULT_PREVIOUS_PERIOD_LABEL, DateTimeFilterInputs, DateTimeFilters, DateTimePickerContext, DateTimePickerProvider, FUNNEL_POPOVER_KEY, GSelectableMetricChartCard, GTimePicker, IVariantType, MOCK_DATA_PATH_ANALYSIS, MainDateTimePickerAlias, MetricChartProvider, MetricDonutChartCard, PLACEHOLDER_VALUE$1 as PLACEHOLDER_VALUE, PREVIOUS_PERIOD_FILTER, PathAnalysisConfigProvider, PathAnalysisContext, PathAnalysisProvider, SERIES_COLORS, SingleMetricChartCard, TARGET_CHANNEL, TARGET_DEVICES, TARGET_VISITOR, THUMB_PRODUCT_DEFAULT, TREND_TONE, convertDateToTz, convertToDateTimeFilters, createLastDaysRange, dayjsTz, dayjsTzToDate, dayjsTzToLocalTZ, formatDate, formatDateTimeRange, formatDayjs, formatMs, formatTime, formatTimeRange, getDateRangeTitle, getDateTimeFilterBase, getDateTimeFilterByAlias, getDateTimeFilterMapping, getEndOfDayBy, getInitialTimezone, getLast12Months, getLast30Days, getLast365Days, getLast7Days, getLast90Days, getLastMonth, getLastYear, getMonthAndYearByDateFilter, getNoComparison, getPreviousMonth, getPreviousPeriod, getPreviousQuarter, getPreviousWeek, getPreviousYear, getToday, getVersionDateDescription, getVersionDateRangeTitle, getYesterday, isDate, isMidnight, isSameDayTimestamp, isValidDate, isValidYearMonthDayDateString, parseYearMonthDayDateString, setTz, useConvertMoneyContext, useCurrencyRatesStore, useDateTimeFilter, useDateTimePicker, useDateTimePickerContext, useFunnelChartStore, useIsStickyById, usePathAnalysisCampaignStore, usePathAnalysisConfig, usePathAnalysisContext, usePathAnalysisStore, useStickyFilterBoxProps, useVersionDateTimeFilters };