@gemx-dev/heatmap-react 3.5.92-dev.35 → 3.5.92-dev.37

package/dist/esm/hooks/viz-canvas/useScrollmap.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useScrollmap.d.ts","sourceRoot":"","sources":["../../../src/hooks/viz-canvas/useScrollmap.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,YAAY;;CAuDxB,CAAC"}
+{"version":3,"file":"useScrollmap.d.ts","sourceRoot":"","sources":["../../../src/hooks/viz-canvas/useScrollmap.ts"],"names":[],"mappings":"AAYA,eAAO,MAAM,YAAY;;CAwDxB,CAAC"}

package/dist/esm/hooks/viz-render/useHeatmapIframeProcessor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useHeatmapIframeProcessor.d.ts","sourceRoot":"","sources":["../../../src/hooks/viz-render/useHeatmapIframeProcessor.ts"],"names":[],"mappings":"AAgCA,MAAM,WAAW,6BAA6B;IAC5C,GAAG,EAAE,CAAC,MAAM,EAAE,iBAAiB,EAAE,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC7E,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,eAAO,MAAM,yBAAyB,QAAO,6BAwE5C,CAAC"}
+{"version":3,"file":"useHeatmapIframeProcessor.d.ts","sourceRoot":"","sources":["../../../src/hooks/viz-render/useHeatmapIframeProcessor.ts"],"names":[],"mappings":"AAgCA,MAAM,WAAW,6BAA6B;IAC5C,GAAG,EAAE,CAAC,MAAM,EAAE,iBAAiB,EAAE,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC7E,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,eAAO,MAAM,yBAAyB,QAAO,6BA2E5C,CAAC"}

package/dist/esm/hooks/viz-render/useHeatmapRenderDom.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useHeatmapRenderDom.d.ts","sourceRoot":"","sources":["../../../src/hooks/viz-render/useHeatmapRenderDom.ts"],"names":[],"mappings":"AAmBA,MAAM,WAAW,uBAAuB;IACtC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;CACtD;AAED,eAAO,MAAM,mBAAmB,QAAO,uBA0EtC,CAAC"}
+{"version":3,"file":"useHeatmapRenderDom.d.ts","sourceRoot":"","sources":["../../../src/hooks/viz-render/useHeatmapRenderDom.ts"],"names":[],"mappings":"AAmBA,MAAM,WAAW,uBAAuB;IACtC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;CACtD;AAED,eAAO,MAAM,mBAAmB,QAAO,uBAwFtC,CAAC"}

package/dist/esm/index.d.ts

@@ -5,6 +5,6 @@ export * from './hooks';
 export * from './types';
 export { decodeArrayClarity, decodeClarity, serializeAreas } from './helpers';
 export { useHeatmapCompareStore, useHeatmapConfigStore } from './stores';
-export { getElementAtPoint, getElementHash } from './utils';
+export { buildBuckets, getElementAtPoint, getElementHash } from './utils';
 export * from './performance';
 //# sourceMappingURL=index.d.ts.map

package/dist/esm/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAC9E,OAAO,EAAE,sBAAsB,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAC;AACzE,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE5D,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAC9E,OAAO,EAAE,sBAAsB,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAC;AACzE,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE1E,cAAc,eAAe,CAAC"}

package/dist/esm/index.js

@@ -1971,6 +1971,21 @@ function createObservable(initialValue) {
     return observable;
 }
 
+/**
+ * Given a list of items where each item represents the START of a bucket,
+ * returns each item enriched with `startY` (= position) and `endY` (= next position, or 100 for the last bucket).
+ *
+ * Works for any scroll data shape (depth, attention, revenue).
+ */
+function buildBuckets(items, getPosition) {
+    const sorted = [...items].sort((a, b) => getPosition(a) - getPosition(b));
+    return sorted.map((item, i) => ({
+        ...item,
+        startY: getPosition(item),
+        endY: sorted[i + 1] !== undefined ? getPosition(sorted[i + 1]) : 100,
+    }));
+}
+
 function sortEvents(a, b) {
     return a.time - b.time;
 }
@@ -3550,10 +3565,11 @@ const useScrollmap = () => {
     const renderScrollBucket = useCallback(() => {
         if (!vizRef || !scrollmap || scrollmap.length === 0 || !isDomLoaded)
             return;
-        const bucketData = scrollmap.map((point) => ({
-            position: point.scrollReachY,
-            value: point.cumulativeSum,
-            percent: point.percUsers,
+        const bucketData = buildBuckets(scrollmap, (p) => p.scrollReachY).map((b) => ({
+            startY: b.startY,
+            endY: b.endY,
+            value: b.cumulativeSum,
+            percent: b.percUsers,
         }));
         try {
             requestIdleCallback(() => vizRef?.scrollBucket?.(bucketData), { timeout: 300 });
@@ -4415,7 +4431,7 @@ async function processHeightChange(ctx, newHeight) {
     }
 }
 function handleHeightChange(ctx) {
-    if (!ctx.running || isBlocked(ctx))
+    if (!ctx.running || !ctx.observerCleanup || isBlocked(ctx))
         return;
     scheduleThrottledCheck(ctx);
 }
@@ -6256,23 +6272,9 @@ class ScrollBucketRenderer {
         context.fillStyle = gradient;
         context.fillRect(0, 0, canvas.width, canvas.height);
     };
-    /**
-     * Convert flat position markers → structured buckets with startY/endY.
-     *
-     * Input positions: [0, 5, 10, 15, ..., 95]
-     *   position=0  → { startY: 0,  endY: 5  }
-     *   position=5  → { startY: 5,  endY: 10 }
-     *   position=95 → { startY: 95, endY: 100 }
-     * Each position is the START of its bucket; end = next position (or 100 for last).
-     */
     mapToBuckets = (data) => {
-        const sorted = [...data].sort((a, b) => a.position - b.position);
-        return sorted.map((current, i) => ({
-            startY: current.position,
-            endY: sorted[i + 1]?.position ?? 100,
-            value: current.value,
-            percent: current.percent,
-        }));
+        // Implement
+        return data;
     };
 }
 
@@ -6434,29 +6436,32 @@ var ShortCircuitStrategy;
 function isShadowDomNode(tag) {
     return tag === Constant.ShadowDomTag || tag === Constant.PolyfillShadowDomTag;
 }
-/** Scan the rendered DOM (including nested shadow roots) to collect tag names of shadow host elements. */
-function collectShadowHostTags(root, tags = new Set()) {
-    root.querySelectorAll('*').forEach((el) => {
-        if (el.shadowRoot) {
-            tags.add(el.tagName);
-            collectShadowHostTags(el.shadowRoot, tags);
-        }
-    });
-    return tags;
-}
-/** Build a shadow subtree ID set from all DOM events.
- *  Two-pass cascade to handle any event ordering:
- *  Pass 1 — seed *S/*P node IDs.
- *  Pass 2 — cascade: any node whose parent is in the set is also in the set (repeat until stable). */
-function buildShadowSubtreeIds(allDomEvents) {
+/**
+ * Two-step collection of all shadow-related node IDs across dom + mutation events.
+ *
+ * Step 1 — scan dom + all mutations to find *S/*P nodes and their direct host parents.
+ * Step 2 — cascade: any node whose parent is already in subtreeIds is also included.
+ *
+ * Using IDs (not tag names) makes host detection precise and avoids false positives
+ * from elements that share a tag name with a shadow host but aren't one.
+ */
+function collectShadowNodeIds(dom, events) {
+    const mutationEvents = events.filter((e) => e.event === Event.Mutation);
+    const allDomEvents = [dom, ...mutationEvents];
     const subtreeIds = new Set();
+    const hostIds = new Set();
+    // Step 1: seed *S/*P node IDs and collect their direct host parent IDs
     for (const e of allDomEvents) {
         const data = e.data;
         for (const node of data ?? []) {
-            if (isShadowDomNode(node.tag))
+            if (isShadowDomNode(node.tag)) {
                 subtreeIds.add(node.id);
+                if (node.parent)
+                    hostIds.add(node.parent);
+            }
         }
     }
+    // Step 2: cascade — descendants of shadow nodes are also part of the shadow subtree
     let changed = true;
     while (changed) {
         changed = false;
@@ -6470,29 +6475,24 @@ function buildShadowSubtreeIds(allDomEvents) {
             }
         }
     }
-    return subtreeIds;
+    return { subtreeIds, hostIds };
 }
-function filterShadowNodes(data, subtreeIds, shadowHostTags) {
-    return (data?.filter((node) => {
-        if (isShadowDomNode(node.tag))
-            return true;
-        if (shadowHostTags.has(node.tag ?? ''))
-            return true;
-        return subtreeIds.has(node.id);
-    }) ?? []);
+function isShadowRelated(node, ids) {
+    return ids.subtreeIds.has(node.id) || ids.hostIds.has(node.id);
 }
-/** Extract shadow DOM nodes from merged.dom (initial Discover event, processed by setup()).
- *  Returns a filtered copy of the dom event, or null if no shadow DOM present. */
-function extractSpecialDom(dom, events, shadowHostTags) {
-    const mutationEvents = events.filter((e) => e.event === Event.Mutation);
-    const subtreeIds = buildShadowSubtreeIds([dom, ...mutationEvents]);
-    const shadowNodes = filterShadowNodes(dom.data, subtreeIds, shadowHostTags);
+/**
+ * Extract shadow DOM nodes from merged.dom (initial Discover event).
+ * Includes both shadow host elements (hostIds) and shadow subtree nodes (subtreeIds).
+ */
+function extractSpecialDom(dom, ids) {
+    const shadowNodes = dom.data?.filter((node) => isShadowRelated(node, ids)) ?? [];
     return shadowNodes.length ? { ...dom, data: shadowNodes } : null;
 }
-/** Extract shadow DOM mutations + StyleSheet + CustomElement events from merged.events. */
-function extractSpecialEvents(events, dom, shadowHostTags) {
-    const mutationEvents = events.filter((e) => e.event === Event.Mutation);
-    const subtreeIds = buildShadowSubtreeIds([dom, ...mutationEvents]);
+/**
+ * Extract shadow DOM mutations + StyleSheet + CustomElement events from merged.events.
+ * Mutation events are filtered to only include shadow-related nodes.
+ */
+function extractSpecialEvents(events, ids) {
     const result = [];
     for (const e of events) {
         const ev = e.event;
@@ -6503,7 +6503,7 @@ function extractSpecialEvents(events, dom, shadowHostTags) {
             continue;
         }
         if (ev === Event.Mutation) {
-            const shadowNodes = filterShadowNodes(e.data, subtreeIds, shadowHostTags);
+            const shadowNodes = e.data?.filter((node) => isShadowRelated(node, ids)) ?? [];
             if (shadowNodes.length)
                 result.push({ ...e, data: shadowNodes });
         }
@@ -6706,9 +6706,9 @@ class GXVisualizer extends Visualizer {
             const timestamp = Date.now();
             const version = decoded[0].envelope.version;
             const html = doc.documentElement.outerHTML;
-            const shadowHostTags = collectShadowHostTags(doc);
-            const specialDom = extractSpecialDom(merged.dom, merged.events, shadowHostTags);
-            const specialEvents = extractSpecialEvents(merged.events, merged.dom, shadowHostTags);
+            const shadowNodeIds = collectShadowNodeIds(merged.dom, merged.events);
+            const specialDom = extractSpecialDom(merged.dom, shadowNodeIds);
+            const specialEvents = extractSpecialEvents(merged.events, shadowNodeIds);
             void htmlCache.set({ key: cacheKey, html, specialDom, specialEvents, version, timestamp });
         }
         catch (e) {
@@ -6768,8 +6768,10 @@ const useHeatmapIframeProcessor = () => {
                     onHeightChange: (data) => {
                         if (abort.signal.aborted)
                             return;
-                        if (data.height)
+                        if (data.height) {
                             setIframeHeight(data.height);
+                            iframe.style.height = `${data.height}px`;
+                        }
                     },
                 });
             },
@@ -6841,15 +6843,19 @@ const useHeatmapRenderDom = () => {
     const heatmapType = useHeatmapSettingContext((s) => s.heatmapType);
     const elementToShow = useHeatmapDataContext((s) => s.dataInfo?.elementToShow);
     const dataHash = useHeatmapDataContext((s) => s.dataHash);
+    const isLoadingDom = useHeatmapSettingContext((state) => state.isLoadingDom);
     const iframeRef = useRef(null);
     const abortRef = useRef(null);
     const elementToShowRef = useRef(null);
     const dataHashRef = useRef(null);
     const heatmapTypeRef = useRef(heatmapType);
+    const lastRenderKeyRef = useRef(null);
     elementToShowRef.current = elementToShow ?? null;
     dataHashRef.current = dataHash ?? null;
     heatmapTypeRef.current = heatmapType;
     const { run: runIframeSetup, reset: resetIframeSetup } = useHeatmapIframeProcessor();
+    const runIframeSetupRef = useRef(runIframeSetup);
+    runIframeSetupRef.current = runIframeSetup;
     const renderHeatmap = useCallback(async (payloads) => {
         if (!payloads || payloads.length === 0)
             return;
@@ -6881,13 +6887,24 @@ const useHeatmapRenderDom = () => {
         if (abort.signal.aborted)
             return;
         // Phase 2: iframe setup — deferred to useIframeSetup (handles dims dependency)
-        runIframeSetup(iframe, t0, abort);
-    }, [deviceType]);
+        runIframeSetupRef.current(iframe, t0, abort);
+    }, []);
     useEffect(() => {
+        if (isLoadingDom)
+            return;
         if (!data || data.length === 0)
             return;
-        renderHeatmap(decodeArrayClarity(data));
-    }, [data, renderHeatmap]);
+        const renderKey = `${dataHash}-${deviceType}`;
+        if (renderKey === lastRenderKeyRef.current)
+            return;
+        const timer = setTimeout(() => {
+            if (renderKey !== `${dataHashRef.current}-${deviceType}`)
+                return;
+            lastRenderKeyRef.current = renderKey;
+            renderHeatmap(decodeArrayClarity(data));
+        }, 50);
+        return () => clearTimeout(timer);
+    }, [data, deviceType, isLoadingDom]); // eslint-disable-line react-hooks/exhaustive-deps
     return { iframeRef };
 };
 
@@ -9022,4 +9039,4 @@ const HeatmapLayout = ({ shopId, data, clickmap, clickAreas, scrollmap, attentio
     }
 };
 
-export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO, EClickMode, EClickRankType, EClickType, EDeviceType, EHeatmapDataSource, EHeatmapMode, EHeatmapType, ELM_CALLOUT_CONFIG, EScrollType, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, ViewIdContext, Z_INDEX$1 as Z_INDEX, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, createViewContextHook, decodeArrayClarity, decodeClarity, downloadPerformanceReport, getCompareViewId, getElementAtPoint, getElementHash, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, isElmInDataInfo, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClickContext, useHeatmapCanvas, useHeatmapClickContext, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapDataContext, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHoverContext, useHeatmapLiveContext, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapScrollContext, useHeatmapSettingContext, useHeatmapViewportByDevice, useHeatmapVizContext, useHeatmapVizRectContext, useHoveredElement, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };
+export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO, EClickMode, EClickRankType, EClickType, EDeviceType, EHeatmapDataSource, EHeatmapMode, EHeatmapType, ELM_CALLOUT_CONFIG, EScrollType, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, ViewIdContext, Z_INDEX$1 as Z_INDEX, buildBuckets, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, createViewContextHook, decodeArrayClarity, decodeClarity, downloadPerformanceReport, getCompareViewId, getElementAtPoint, getElementHash, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, isElmInDataInfo, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClickContext, useHeatmapCanvas, useHeatmapClickContext, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapDataContext, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHoverContext, useHeatmapLiveContext, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapScrollContext, useHeatmapSettingContext, useHeatmapViewportByDevice, useHeatmapVizContext, useHeatmapVizRectContext, useHoveredElement, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };

package/dist/esm/index.mjs

@@ -1971,6 +1971,21 @@ function createObservable(initialValue) {
     return observable;
 }
 
+/**
+ * Given a list of items where each item represents the START of a bucket,
+ * returns each item enriched with `startY` (= position) and `endY` (= next position, or 100 for the last bucket).
+ *
+ * Works for any scroll data shape (depth, attention, revenue).
+ */
+function buildBuckets(items, getPosition) {
+    const sorted = [...items].sort((a, b) => getPosition(a) - getPosition(b));
+    return sorted.map((item, i) => ({
+        ...item,
+        startY: getPosition(item),
+        endY: sorted[i + 1] !== undefined ? getPosition(sorted[i + 1]) : 100,
+    }));
+}
+
 function sortEvents(a, b) {
     return a.time - b.time;
 }
@@ -3550,10 +3565,11 @@ const useScrollmap = () => {
     const renderScrollBucket = useCallback(() => {
         if (!vizRef || !scrollmap || scrollmap.length === 0 || !isDomLoaded)
             return;
-        const bucketData = scrollmap.map((point) => ({
-            position: point.scrollReachY,
-            value: point.cumulativeSum,
-            percent: point.percUsers,
+        const bucketData = buildBuckets(scrollmap, (p) => p.scrollReachY).map((b) => ({
+            startY: b.startY,
+            endY: b.endY,
+            value: b.cumulativeSum,
+            percent: b.percUsers,
         }));
         try {
             requestIdleCallback(() => vizRef?.scrollBucket?.(bucketData), { timeout: 300 });
@@ -4415,7 +4431,7 @@ async function processHeightChange(ctx, newHeight) {
     }
 }
 function handleHeightChange(ctx) {
-    if (!ctx.running || isBlocked(ctx))
+    if (!ctx.running || !ctx.observerCleanup || isBlocked(ctx))
         return;
     scheduleThrottledCheck(ctx);
 }
@@ -6256,23 +6272,9 @@ class ScrollBucketRenderer {
         context.fillStyle = gradient;
         context.fillRect(0, 0, canvas.width, canvas.height);
     };
-    /**
-     * Convert flat position markers → structured buckets with startY/endY.
-     *
-     * Input positions: [0, 5, 10, 15, ..., 95]
-     *   position=0  → { startY: 0,  endY: 5  }
-     *   position=5  → { startY: 5,  endY: 10 }
-     *   position=95 → { startY: 95, endY: 100 }
-     * Each position is the START of its bucket; end = next position (or 100 for last).
-     */
     mapToBuckets = (data) => {
-        const sorted = [...data].sort((a, b) => a.position - b.position);
-        return sorted.map((current, i) => ({
-            startY: current.position,
-            endY: sorted[i + 1]?.position ?? 100,
-            value: current.value,
-            percent: current.percent,
-        }));
+        // Implement
+        return data;
     };
 }
 
@@ -6434,29 +6436,32 @@ var ShortCircuitStrategy;
 function isShadowDomNode(tag) {
     return tag === Constant.ShadowDomTag || tag === Constant.PolyfillShadowDomTag;
 }
-/** Scan the rendered DOM (including nested shadow roots) to collect tag names of shadow host elements. */
-function collectShadowHostTags(root, tags = new Set()) {
-    root.querySelectorAll('*').forEach((el) => {
-        if (el.shadowRoot) {
-            tags.add(el.tagName);
-            collectShadowHostTags(el.shadowRoot, tags);
-        }
-    });
-    return tags;
-}
-/** Build a shadow subtree ID set from all DOM events.
- *  Two-pass cascade to handle any event ordering:
- *  Pass 1 — seed *S/*P node IDs.
- *  Pass 2 — cascade: any node whose parent is in the set is also in the set (repeat until stable). */
-function buildShadowSubtreeIds(allDomEvents) {
+/**
+ * Two-step collection of all shadow-related node IDs across dom + mutation events.
+ *
+ * Step 1 — scan dom + all mutations to find *S/*P nodes and their direct host parents.
+ * Step 2 — cascade: any node whose parent is already in subtreeIds is also included.
+ *
+ * Using IDs (not tag names) makes host detection precise and avoids false positives
+ * from elements that share a tag name with a shadow host but aren't one.
+ */
+function collectShadowNodeIds(dom, events) {
+    const mutationEvents = events.filter((e) => e.event === Event.Mutation);
+    const allDomEvents = [dom, ...mutationEvents];
     const subtreeIds = new Set();
+    const hostIds = new Set();
+    // Step 1: seed *S/*P node IDs and collect their direct host parent IDs
     for (const e of allDomEvents) {
         const data = e.data;
         for (const node of data ?? []) {
-            if (isShadowDomNode(node.tag))
+            if (isShadowDomNode(node.tag)) {
                 subtreeIds.add(node.id);
+                if (node.parent)
+                    hostIds.add(node.parent);
+            }
         }
     }
+    // Step 2: cascade — descendants of shadow nodes are also part of the shadow subtree
     let changed = true;
     while (changed) {
         changed = false;
@@ -6470,29 +6475,24 @@ function buildShadowSubtreeIds(allDomEvents) {
             }
         }
     }
-    return subtreeIds;
+    return { subtreeIds, hostIds };
 }
-function filterShadowNodes(data, subtreeIds, shadowHostTags) {
-    return (data?.filter((node) => {
-        if (isShadowDomNode(node.tag))
-            return true;
-        if (shadowHostTags.has(node.tag ?? ''))
-            return true;
-        return subtreeIds.has(node.id);
-    }) ?? []);
+function isShadowRelated(node, ids) {
+    return ids.subtreeIds.has(node.id) || ids.hostIds.has(node.id);
 }
-/** Extract shadow DOM nodes from merged.dom (initial Discover event, processed by setup()).
- *  Returns a filtered copy of the dom event, or null if no shadow DOM present. */
-function extractSpecialDom(dom, events, shadowHostTags) {
-    const mutationEvents = events.filter((e) => e.event === Event.Mutation);
-    const subtreeIds = buildShadowSubtreeIds([dom, ...mutationEvents]);
-    const shadowNodes = filterShadowNodes(dom.data, subtreeIds, shadowHostTags);
+/**
+ * Extract shadow DOM nodes from merged.dom (initial Discover event).
+ * Includes both shadow host elements (hostIds) and shadow subtree nodes (subtreeIds).
+ */
+function extractSpecialDom(dom, ids) {
+    const shadowNodes = dom.data?.filter((node) => isShadowRelated(node, ids)) ?? [];
     return shadowNodes.length ? { ...dom, data: shadowNodes } : null;
 }
-/** Extract shadow DOM mutations + StyleSheet + CustomElement events from merged.events. */
-function extractSpecialEvents(events, dom, shadowHostTags) {
-    const mutationEvents = events.filter((e) => e.event === Event.Mutation);
-    const subtreeIds = buildShadowSubtreeIds([dom, ...mutationEvents]);
+/**
+ * Extract shadow DOM mutations + StyleSheet + CustomElement events from merged.events.
+ * Mutation events are filtered to only include shadow-related nodes.
+ */
+function extractSpecialEvents(events, ids) {
     const result = [];
     for (const e of events) {
         const ev = e.event;
@@ -6503,7 +6503,7 @@ function extractSpecialEvents(events, dom, shadowHostTags) {
             continue;
         }
         if (ev === Event.Mutation) {
-            const shadowNodes = filterShadowNodes(e.data, subtreeIds, shadowHostTags);
+            const shadowNodes = e.data?.filter((node) => isShadowRelated(node, ids)) ?? [];
             if (shadowNodes.length)
                 result.push({ ...e, data: shadowNodes });
         }
@@ -6706,9 +6706,9 @@ class GXVisualizer extends Visualizer {
             const timestamp = Date.now();
             const version = decoded[0].envelope.version;
             const html = doc.documentElement.outerHTML;
-            const shadowHostTags = collectShadowHostTags(doc);
-            const specialDom = extractSpecialDom(merged.dom, merged.events, shadowHostTags);
-            const specialEvents = extractSpecialEvents(merged.events, merged.dom, shadowHostTags);
+            const shadowNodeIds = collectShadowNodeIds(merged.dom, merged.events);
+            const specialDom = extractSpecialDom(merged.dom, shadowNodeIds);
+            const specialEvents = extractSpecialEvents(merged.events, shadowNodeIds);
             void htmlCache.set({ key: cacheKey, html, specialDom, specialEvents, version, timestamp });
         }
         catch (e) {
@@ -6768,8 +6768,10 @@ const useHeatmapIframeProcessor = () => {
                     onHeightChange: (data) => {
                         if (abort.signal.aborted)
                             return;
-                        if (data.height)
+                        if (data.height) {
                             setIframeHeight(data.height);
+                            iframe.style.height = `${data.height}px`;
+                        }
                     },
                 });
             },
@@ -6841,15 +6843,19 @@ const useHeatmapRenderDom = () => {
     const heatmapType = useHeatmapSettingContext((s) => s.heatmapType);
     const elementToShow = useHeatmapDataContext((s) => s.dataInfo?.elementToShow);
     const dataHash = useHeatmapDataContext((s) => s.dataHash);
+    const isLoadingDom = useHeatmapSettingContext((state) => state.isLoadingDom);
     const iframeRef = useRef(null);
     const abortRef = useRef(null);
     const elementToShowRef = useRef(null);
     const dataHashRef = useRef(null);
     const heatmapTypeRef = useRef(heatmapType);
+    const lastRenderKeyRef = useRef(null);
     elementToShowRef.current = elementToShow ?? null;
     dataHashRef.current = dataHash ?? null;
     heatmapTypeRef.current = heatmapType;
     const { run: runIframeSetup, reset: resetIframeSetup } = useHeatmapIframeProcessor();
+    const runIframeSetupRef = useRef(runIframeSetup);
+    runIframeSetupRef.current = runIframeSetup;
     const renderHeatmap = useCallback(async (payloads) => {
         if (!payloads || payloads.length === 0)
             return;
@@ -6881,13 +6887,24 @@ const useHeatmapRenderDom = () => {
         if (abort.signal.aborted)
             return;
         // Phase 2: iframe setup — deferred to useIframeSetup (handles dims dependency)
-        runIframeSetup(iframe, t0, abort);
-    }, [deviceType]);
+        runIframeSetupRef.current(iframe, t0, abort);
+    }, []);
     useEffect(() => {
+        if (isLoadingDom)
+            return;
         if (!data || data.length === 0)
             return;
-        renderHeatmap(decodeArrayClarity(data));
-    }, [data, renderHeatmap]);
+        const renderKey = `${dataHash}-${deviceType}`;
+        if (renderKey === lastRenderKeyRef.current)
+            return;
+        const timer = setTimeout(() => {
+            if (renderKey !== `${dataHashRef.current}-${deviceType}`)
+                return;
+            lastRenderKeyRef.current = renderKey;
+            renderHeatmap(decodeArrayClarity(data));
+        }, 50);
+        return () => clearTimeout(timer);
+    }, [data, deviceType, isLoadingDom]); // eslint-disable-line react-hooks/exhaustive-deps
     return { iframeRef };
 };
 
@@ -9022,4 +9039,4 @@ const HeatmapLayout = ({ shopId, data, clickmap, clickAreas, scrollmap, attentio
     }
 };
 
-export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO, EClickMode, EClickRankType, EClickType, EDeviceType, EHeatmapDataSource, EHeatmapMode, EHeatmapType, ELM_CALLOUT_CONFIG, EScrollType, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, ViewIdContext, Z_INDEX$1 as Z_INDEX, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, createViewContextHook, decodeArrayClarity, decodeClarity, downloadPerformanceReport, getCompareViewId, getElementAtPoint, getElementHash, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, isElmInDataInfo, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClickContext, useHeatmapCanvas, useHeatmapClickContext, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapDataContext, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHoverContext, useHeatmapLiveContext, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapScrollContext, useHeatmapSettingContext, useHeatmapViewportByDevice, useHeatmapVizContext, useHeatmapVizRectContext, useHoveredElement, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };
+export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO, EClickMode, EClickRankType, EClickType, EDeviceType, EHeatmapDataSource, EHeatmapMode, EHeatmapType, ELM_CALLOUT_CONFIG, EScrollType, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, ViewIdContext, Z_INDEX$1 as Z_INDEX, buildBuckets, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, createViewContextHook, decodeArrayClarity, decodeClarity, downloadPerformanceReport, getCompareViewId, getElementAtPoint, getElementHash, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, isElmInDataInfo, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClickContext, useHeatmapCanvas, useHeatmapClickContext, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapDataContext, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHoverContext, useHeatmapLiveContext, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapScrollContext, useHeatmapSettingContext, useHeatmapViewportByDevice, useHeatmapVizContext, useHeatmapVizRectContext, useHoveredElement, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };

package/dist/esm/libs/visualizer/GXVisualizer.d.ts

@@ -1,11 +1,11 @@
-import type { AttentionData, ScrollBucketInput } from './renderers';
+import type { AttentionData, IScrollBucket } from './renderers';
 import type { IRenderHtmlOptions } from './types';
 import { Visualizer } from '@gemx-dev/clarity-visualize';
 interface GXVisualizerInterface extends Visualizer {
     htmlRender: (props: IRenderHtmlOptions) => Promise<GXVisualizer>;
     htmlCached: (cacheKey: string, options: IRenderHtmlOptions) => Promise<GXVisualizer>;
     attention: (attentionData: AttentionData[], avgFold: number, isSecondary?: boolean) => void;
-    scrollBucket: (data: ScrollBucketInput[]) => Promise<void>;
+    scrollBucket: (data: IScrollBucket[]) => Promise<void>;
 }
 export declare class GXVisualizer extends Visualizer implements GXVisualizerInterface {
     private attentionMap;
@@ -28,7 +28,7 @@ export declare class GXVisualizer extends Visualizer implements GXVisualizerInte
      * Render discrete color bands for scrollRevenue / scrollAttention data.
      * @param data - Array of bucket inputs with position markers (0, 5, 10, ..., 95) and percent values
      */
-    scrollBucket: (data: ScrollBucketInput[]) => Promise<void>;
+    scrollBucket: (data: IScrollBucket[]) => Promise<void>;
     private scrollmapOverride;
     private clickmapOverride;
     private buildHtmlByCached;

package/dist/esm/libs/visualizer/GXVisualizer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GXVisualizer.d.ts","sourceRoot":"","sources":["../../../src/libs/visualizer/GXVisualizer.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AACpE,OAAO,KAAK,EAAE,kBAAkB,EAA0B,MAAM,SAAS,CAAC;AAG1E,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAmCzD,UAAU,qBAAsB,SAAQ,UAAU;IAChD,UAAU,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,OAAO,CAAC,YAAY,CAAC,CAAC;IACjE,UAAU,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,kBAAkB,KAAK,OAAO,CAAC,YAAY,CAAC,CAAC;IACrF,SAAS,EAAE,CAAC,aAAa,EAAE,aAAa,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5F,YAAY,EAAE,CAAC,IAAI,EAAE,iBAAiB,EAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAC5D;AAED,qBAAa,YAAa,SAAQ,UAAW,YAAW,qBAAqB;IAC3E,OAAO,CAAC,YAAY,CAAuB;IAC3C,OAAO,CAAC,eAAe,CAAuB;IAC9C,OAAO,CAAC,gBAAgB,CAAyB;IACjD,OAAO,CAAC,aAAa,CAAsB;IAC3C,OAAO,CAAC,iBAAiB,CAA0B;IACnD,OAAO,CAAC,gBAAgB,CAAyB;;IAkBjD,UAAU,GAAU,OAAO,kBAAkB,KAAG,OAAO,CAAC,YAAY,CAAC,CAcnE;IAEF,UAAU,GAAU,UAAU,MAAM,EAAE,SAAS,kBAAkB,KAAG,OAAO,CAAC,YAAY,CAAC,CAmBvF;IAEF;;;;;OAKG;IACH,SAAS,GAAI,eAAe,aAAa,EAAE,EAAE,SAAS,MAAM,EAAE,qBAAmB,KAAG,IAAI,CAGtF;IAEF;;;OAGG;IACH,YAAY,GAAU,MAAM,iBAAiB,EAAE,KAAG,OAAO,CAAC,IAAI,CAAC,CAG7D;IAEF,OAAO,CAAC,iBAAiB,CAGvB;IAEF,OAAO,CAAC,gBAAgB,CAGtB;IAEF,OAAO,CAAC,iBAAiB,CAgCvB;IAEF,OAAO,CAAC,iBAAiB,CA6BvB;IAEF,OAAO,CAAC,UAAU,CAEhB;IAEF,OAAO,CAAC,aAAa,CASnB;IAEF,OAAO,CAAC,gBAAgB,CAItB;CACH"}
+{"version":3,"file":"GXVisualizer.d.ts","sourceRoot":"","sources":["../../../src/libs/visualizer/GXVisualizer.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAChE,OAAO,KAAK,EAAE,kBAAkB,EAA0B,MAAM,SAAS,CAAC;AAG1E,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAmCzD,UAAU,qBAAsB,SAAQ,UAAU;IAChD,UAAU,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,OAAO,CAAC,YAAY,CAAC,CAAC;IACjE,UAAU,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,kBAAkB,KAAK,OAAO,CAAC,YAAY,CAAC,CAAC;IACrF,SAAS,EAAE,CAAC,aAAa,EAAE,aAAa,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5F,YAAY,EAAE,CAAC,IAAI,EAAE,aAAa,EAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACxD;AAED,qBAAa,YAAa,SAAQ,UAAW,YAAW,qBAAqB;IAC3E,OAAO,CAAC,YAAY,CAAuB;IAC3C,OAAO,CAAC,eAAe,CAAuB;IAC9C,OAAO,CAAC,gBAAgB,CAAyB;IACjD,OAAO,CAAC,aAAa,CAAsB;IAC3C,OAAO,CAAC,iBAAiB,CAA0B;IACnD,OAAO,CAAC,gBAAgB,CAAyB;;IAkBjD,UAAU,GAAU,OAAO,kBAAkB,KAAG,OAAO,CAAC,YAAY,CAAC,CAcnE;IAEF,UAAU,GAAU,UAAU,MAAM,EAAE,SAAS,kBAAkB,KAAG,OAAO,CAAC,YAAY,CAAC,CAmBvF;IAEF;;;;;OAKG;IACH,SAAS,GAAI,eAAe,aAAa,EAAE,EAAE,SAAS,MAAM,EAAE,qBAAmB,KAAG,IAAI,CAGtF;IAEF;;;OAGG;IACH,YAAY,GAAU,MAAM,aAAa,EAAE,KAAG,OAAO,CAAC,IAAI,CAAC,CAGzD;IAEF,OAAO,CAAC,iBAAiB,CAGvB;IAEF,OAAO,CAAC,gBAAgB,CAGtB;IAEF,OAAO,CAAC,iBAAiB,CAgCvB;IAEF,OAAO,CAAC,iBAAiB,CA6BvB;IAEF,OAAO,CAAC,UAAU,CAEhB;IAEF,OAAO,CAAC,aAAa,CASnB;IAEF,OAAO,CAAC,gBAAgB,CAItB;CACH"}

package/dist/esm/libs/visualizer/index.d.ts

@@ -1,4 +1,4 @@
+export type { IScrollBucket } from './renderers';
 export { htmlCache } from './cache';
 export { GXVisualizer } from './GXVisualizer';
-export type { ScrollBucketInput } from './renderers';
 //# sourceMappingURL=index.d.ts.map

package/dist/esm/libs/visualizer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/libs/visualizer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/libs/visualizer/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAEjD,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/esm/libs/visualizer/renderers/ScrollBucketRenderer.d.ts

@@ -1,17 +1,6 @@
 import type { HeatmapHelper } from '@gemx-dev/clarity-visualize';
-export interface ScrollBucketInput {
-    /** Position marker (0, 5, 10, ..., 95).
-     *  - position=0  → bucket range 0–5%
-     *  - position=10 → bucket range 5–10%
-     *  - position=15 → bucket range 10–15%
-     *  Each non-zero position is the END of its bucket; 0 is the special start marker.
-     */
-    position: number;
-    /** Absolute value (e.g. revenue, attention time) */
-    value: number;
-    /** Relative percentage: value / total * 100. Used for color scale. */
-    percent: number;
-}
+import type { IScrollBucket } from '../../../types';
+export type { IScrollBucket };
 export declare class ScrollBucketRenderer {
     private heatmap;
     private lastData;
@@ -29,17 +18,8 @@ export declare class ScrollBucketRenderer {
      * duplicate portal canvas management.
      * Stores data so the canvas can be redrawn when iframe height changes.
      */
-    renderBucket: (data: ScrollBucketInput[]) => Promise<void>;
+    renderBucket: (data: IScrollBucket[]) => Promise<void>;
     private draw;
-    /**
-     * Convert flat position markers → structured buckets with startY/endY.
-     *
-     * Input positions: [0, 5, 10, 15, ..., 95]
-     *   position=0  → { startY: 0,  endY: 5  }
-     *   position=5  → { startY: 5,  endY: 10 }
-     *   position=95 → { startY: 95, endY: 100 }
-     * Each position is the START of its bucket; end = next position (or 100 for last).
-     */
     private mapToBuckets;
 }
 //# sourceMappingURL=ScrollBucketRenderer.d.ts.map

package/dist/esm/libs/visualizer/renderers/ScrollBucketRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollBucketRenderer.d.ts","sourceRoot":"","sources":["../../../../src/libs/visualizer/renderers/ScrollBucketRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAEjE,MAAM,WAAW,iBAAiB;IAChC;;;;;OAKG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB,oDAAoD;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,sEAAsE;IACtE,OAAO,EAAE,MAAM,CAAC;CACjB;AAYD,qBAAa,oBAAoB;IAC/B,OAAO,CAAC,OAAO,CAAuB;IACtC,OAAO,CAAC,QAAQ,CAAoC;IACpD,OAAO,CAAC,kBAAkB,CAAqC;IAC/D,OAAO,CAAC,aAAa,CAA8C;gBAEvD,OAAO,EAAE,aAAa,GAAG,IAAI;IAKzC,OAAO,CAAC,MAAM,CAIZ;IAEF,OAAO,CAAC,wBAAwB,CAI9B;IAEF,OAAO,CAAC,wBAAwB,CAS9B;IAEF,KAAK,QAAO,IAAI,CAEd;IAEF,KAAK,QAAO,IAAI,CAGd;IAEF;;;;;OAKG;IACH,YAAY,GAAU,MAAM,iBAAiB,EAAE,KAAG,OAAO,CAAC,IAAI,CAAC,CAQ7D;IAEF,OAAO,CAAC,IAAI,CAuDV;IAEF;;;;;;;;OAQG;IACH,OAAO,CAAC,YAAY,CASlB;CACH"}
+{"version":3,"file":"ScrollBucketRenderer.d.ts","sourceRoot":"","sources":["../../../../src/libs/visualizer/renderers/ScrollBucketRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAEpD,YAAY,EAAE,aAAa,EAAE,CAAC;AAK9B,qBAAa,oBAAoB;IAC/B,OAAO,CAAC,OAAO,CAAuB;IACtC,OAAO,CAAC,QAAQ,CAAgC;IAChD,OAAO,CAAC,kBAAkB,CAAqC;IAC/D,OAAO,CAAC,aAAa,CAA8C;gBAEvD,OAAO,EAAE,aAAa,GAAG,IAAI;IAKzC,OAAO,CAAC,MAAM,CAIZ;IAEF,OAAO,CAAC,wBAAwB,CAI9B;IAEF,OAAO,CAAC,wBAAwB,CAS9B;IAEF,KAAK,QAAO,IAAI,CAEd;IAEF,KAAK,QAAO,IAAI,CAGd;IAEF;;;;;OAKG;IACH,YAAY,GAAU,MAAM,aAAa,EAAE,KAAG,OAAO,CAAC,IAAI,CAAC,CAQzD;IAEF,OAAO,CAAC,IAAI,CAuDV;IAEF,OAAO,CAAC,YAAY,CAGlB;CACH"}