@gemx-dev/heatmap-react 3.5.92-dev.32 → 3.5.92-dev.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,9 @@
1
+ import type { IHeatmapRef } from '../../types';
2
+ interface ScrollMarkersProps {
3
+ iframeRef: IHeatmapRef['Iframe'];
4
+ wrapperRef: IHeatmapRef['Wrapper'];
5
+ visualRef: IHeatmapRef['Visual'];
6
+ }
7
+ export declare const ScrollMarkersTest: React.FC<ScrollMarkersProps>;
8
+ export {};
9
+ //# sourceMappingURL=ScrollMarkersTest.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ScrollMarkersTest.d.ts","sourceRoot":"","sources":["../../../src/components/VizScrollmap/ScrollMarkersTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAK/C,UAAU,kBAAkB;IAC1B,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IACjC,UAAU,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACnC,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;CAClC;AAcD,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAwB1D,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"VizScrollMap.d.ts","sourceRoot":"","sources":["../../../src/components/VizScrollmap/VizScrollMap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAQ/C,UAAU,iBAAiB;IACzB,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IACjC,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IACjC,UAAU,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;CACpC;AAGD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAwBpD,CAAC"}
1
+ {"version":3,"file":"VizScrollMap.d.ts","sourceRoot":"","sources":["../../../src/components/VizScrollmap/VizScrollMap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAS/C,UAAU,iBAAiB;IACzB,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IACjC,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IACjC,UAAU,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;CACpC;AAGD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAyBpD,CAAC"}
package/dist/esm/index.js CHANGED
@@ -8771,6 +8771,30 @@ const ScrollMarkers = ({ iframeRef, wrapperRef, visualRef }) => {
8771
8771
  }) }));
8772
8772
  };
8773
8773
 
8774
+ const getMarkerColor = (percent) => {
8775
+ if (percent <= 25)
8776
+ return 'rgba(239, 68, 68, 0.4)'; // red
8777
+ if (percent <= 50)
8778
+ return 'rgba(245, 158, 11, 0.4)'; // amber
8779
+ if (percent <= 75)
8780
+ return 'rgba(59, 130, 246, 0.4)'; // blue
8781
+ return 'rgba(16, 185, 129, 0.4)'; // green
8782
+ };
8783
+ const MOCK_BOUNDARIES = Array.from({ length: 20 }, (_, index) => (index + 1) * 5).map((percent) => {
8784
+ const color = getMarkerColor(percent);
8785
+ return { percent, label: `${percent}%`, bgColor: color, lineColor: color, labelColor: 'rgba(0, 0, 0, 0.5)' };
8786
+ });
8787
+ const ScrollMarkersTest = ({ iframeRef, wrapperRef, visualRef }) => {
8788
+ const { getZonePosition } = useZonePositions();
8789
+ useHeatmapScroll({ visualRef });
8790
+ return (jsx(Fragment, { children: MOCK_BOUNDARIES.map((boundary) => {
8791
+ const position = getZonePosition({ startY: boundary.percent, endY: boundary.percent });
8792
+ if (!position)
8793
+ return null;
8794
+ return (jsx(MarkerLine, { top: position.top, label: boundary.label, bgColor: boundary.bgColor, lineColor: boundary.lineColor, labelColor: boundary.labelColor }, boundary.label));
8795
+ }) }));
8796
+ };
8797
+
8774
8798
  const SCROLL_TYPES = [EHeatmapType.Scroll];
8775
8799
  const VizScrollMap = ({ iframeRef, wrapperRef, visualRef }) => {
8776
8800
  const heatmapType = useHeatmapSettingContext((s) => s.heatmapType);
@@ -8786,7 +8810,7 @@ const VizScrollMap = ({ iframeRef, wrapperRef, visualRef }) => {
8786
8810
  height: '100%',
8787
8811
  transform: 'translateZ(0)',
8788
8812
  zIndex: 2,
8789
- }, children: [jsx(ScrollMarkers, { iframeRef: iframeRef, wrapperRef: wrapperRef, visualRef: visualRef }), jsx(AverageFold, { iframeRef: iframeRef, wrapperRef: wrapperRef }), jsx(ScrollOverlay, { iframeRef: iframeRef, wrapperRef: wrapperRef })] }));
8813
+ }, children: [jsx(ScrollMarkersTest, { iframeRef: iframeRef, wrapperRef: wrapperRef, visualRef: visualRef }), jsx(ScrollMarkers, { iframeRef: iframeRef, wrapperRef: wrapperRef, visualRef: visualRef }), jsx(AverageFold, { iframeRef: iframeRef, wrapperRef: wrapperRef }), jsx(ScrollOverlay, { iframeRef: iframeRef, wrapperRef: wrapperRef })] }));
8790
8814
  };
8791
8815
 
8792
8816
  const VizLoadingCanvas = () => {
@@ -8771,6 +8771,30 @@ const ScrollMarkers = ({ iframeRef, wrapperRef, visualRef }) => {
8771
8771
  }) }));
8772
8772
  };
8773
8773
 
8774
+ const getMarkerColor = (percent) => {
8775
+ if (percent <= 25)
8776
+ return 'rgba(239, 68, 68, 0.4)'; // red
8777
+ if (percent <= 50)
8778
+ return 'rgba(245, 158, 11, 0.4)'; // amber
8779
+ if (percent <= 75)
8780
+ return 'rgba(59, 130, 246, 0.4)'; // blue
8781
+ return 'rgba(16, 185, 129, 0.4)'; // green
8782
+ };
8783
+ const MOCK_BOUNDARIES = Array.from({ length: 20 }, (_, index) => (index + 1) * 5).map((percent) => {
8784
+ const color = getMarkerColor(percent);
8785
+ return { percent, label: `${percent}%`, bgColor: color, lineColor: color, labelColor: 'rgba(0, 0, 0, 0.5)' };
8786
+ });
8787
+ const ScrollMarkersTest = ({ iframeRef, wrapperRef, visualRef }) => {
8788
+ const { getZonePosition } = useZonePositions();
8789
+ useHeatmapScroll({ visualRef });
8790
+ return (jsx(Fragment, { children: MOCK_BOUNDARIES.map((boundary) => {
8791
+ const position = getZonePosition({ startY: boundary.percent, endY: boundary.percent });
8792
+ if (!position)
8793
+ return null;
8794
+ return (jsx(MarkerLine, { top: position.top, label: boundary.label, bgColor: boundary.bgColor, lineColor: boundary.lineColor, labelColor: boundary.labelColor }, boundary.label));
8795
+ }) }));
8796
+ };
8797
+
8774
8798
  const SCROLL_TYPES = [EHeatmapType.Scroll];
8775
8799
  const VizScrollMap = ({ iframeRef, wrapperRef, visualRef }) => {
8776
8800
  const heatmapType = useHeatmapSettingContext((s) => s.heatmapType);
@@ -8786,7 +8810,7 @@ const VizScrollMap = ({ iframeRef, wrapperRef, visualRef }) => {
8786
8810
  height: '100%',
8787
8811
  transform: 'translateZ(0)',
8788
8812
  zIndex: 2,
8789
- }, children: [jsx(ScrollMarkers, { iframeRef: iframeRef, wrapperRef: wrapperRef, visualRef: visualRef }), jsx(AverageFold, { iframeRef: iframeRef, wrapperRef: wrapperRef }), jsx(ScrollOverlay, { iframeRef: iframeRef, wrapperRef: wrapperRef })] }));
8813
+ }, children: [jsx(ScrollMarkersTest, { iframeRef: iframeRef, wrapperRef: wrapperRef, visualRef: visualRef }), jsx(ScrollMarkers, { iframeRef: iframeRef, wrapperRef: wrapperRef, visualRef: visualRef }), jsx(AverageFold, { iframeRef: iframeRef, wrapperRef: wrapperRef }), jsx(ScrollOverlay, { iframeRef: iframeRef, wrapperRef: wrapperRef })] }));
8790
8814
  };
8791
8815
 
8792
8816
  const VizLoadingCanvas = () => {
@@ -0,0 +1,9 @@
1
+ import type { IHeatmapRef } from '../../types';
2
+ interface ScrollMarkersProps {
3
+ iframeRef: IHeatmapRef['Iframe'];
4
+ wrapperRef: IHeatmapRef['Wrapper'];
5
+ visualRef: IHeatmapRef['Visual'];
6
+ }
7
+ export declare const ScrollMarkersTest: React.FC<ScrollMarkersProps>;
8
+ export {};
9
+ //# sourceMappingURL=ScrollMarkersTest.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ScrollMarkersTest.d.ts","sourceRoot":"","sources":["../../../src/components/VizScrollmap/ScrollMarkersTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAK/C,UAAU,kBAAkB;IAC1B,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IACjC,UAAU,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACnC,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;CAClC;AAcD,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAwB1D,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"VizScrollMap.d.ts","sourceRoot":"","sources":["../../../src/components/VizScrollmap/VizScrollMap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAQ/C,UAAU,iBAAiB;IACzB,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IACjC,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IACjC,UAAU,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;CACpC;AAGD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAwBpD,CAAC"}
1
+ {"version":3,"file":"VizScrollMap.d.ts","sourceRoot":"","sources":["../../../src/components/VizScrollmap/VizScrollMap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAS/C,UAAU,iBAAiB;IACzB,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IACjC,SAAS,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IACjC,UAAU,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;CACpC;AAGD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAyBpD,CAAC"}