@gemx-dev/heatmap-react 3.5.64 → 3.5.66
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.
- package/dist/esm/hooks/view-context/index.d.ts +1 -0
- package/dist/esm/hooks/view-context/index.d.ts.map +1 -1
- package/dist/esm/index.js +92 -92
- package/dist/esm/index.mjs +92 -92
- package/dist/umd/hooks/view-context/index.d.ts +1 -0
- package/dist/umd/hooks/view-context/index.d.ts.map +1 -1
- package/dist/umd/index.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/view-context/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,qBAAqB,CAAC;AAEpC,cAAc,sBAAsB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/view-context/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,qBAAqB,CAAC;AAEpC,cAAc,sBAAsB,CAAC"}
|
package/dist/esm/index.js
CHANGED
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
3
3
|
import { useNodesState, ReactFlow, Controls, Background } from '@xyflow/react';
|
|
4
4
|
import { useEffect, useRef, useCallback, createContext, useContext, useMemo, useState, forwardRef, memo, Fragment as Fragment$1 } from 'react';
|
|
5
|
+
import { useShallow } from 'zustand/react/shallow';
|
|
5
6
|
import { create } from 'zustand';
|
|
6
7
|
import { subscribeWithSelector } from 'zustand/middleware';
|
|
7
|
-
import { useShallow } from 'zustand/react/shallow';
|
|
8
8
|
import { decode } from '@gemx-dev/clarity-decode';
|
|
9
9
|
import { Visualizer } from '@gemx-dev/clarity-visualize';
|
|
10
10
|
import { createPortal } from 'react-dom';
|
|
@@ -190,6 +190,90 @@ var IScrollType;
|
|
|
190
190
|
IScrollType["Revenue"] = "revenue-scroll";
|
|
191
191
|
})(IScrollType || (IScrollType = {}));
|
|
192
192
|
|
|
193
|
+
const ViewIdContext = createContext(undefined);
|
|
194
|
+
const useViewIdContext = () => {
|
|
195
|
+
const viewId = useContext(ViewIdContext);
|
|
196
|
+
return viewId || DEFAULT_VIEW_ID;
|
|
197
|
+
};
|
|
198
|
+
|
|
199
|
+
// ===========================
|
|
200
|
+
// Factory Function
|
|
201
|
+
// ===========================
|
|
202
|
+
/**
|
|
203
|
+
* Creates a view-context aware hook with selector support
|
|
204
|
+
*
|
|
205
|
+
* Features:
|
|
206
|
+
* - Automatic viewId injection from context
|
|
207
|
+
* - Selector pattern for granular subscriptions
|
|
208
|
+
* - Full type safety
|
|
209
|
+
* - Optimized re-renders with useShallow
|
|
210
|
+
*
|
|
211
|
+
* @example
|
|
212
|
+
* ```ts
|
|
213
|
+
* const useMyHook = createViewContextHook({
|
|
214
|
+
* useStore: useMyStore,
|
|
215
|
+
* getState: (store, viewId) => ({
|
|
216
|
+
* data: store.data.get(viewId) ?? null,
|
|
217
|
+
* count: store.count.get(viewId) ?? 0,
|
|
218
|
+
* }),
|
|
219
|
+
* getActions: (store, viewId) => ({
|
|
220
|
+
* setData: (data) => store.setData(data, viewId),
|
|
221
|
+
* increment: () => store.increment(viewId),
|
|
222
|
+
* }),
|
|
223
|
+
* });
|
|
224
|
+
*
|
|
225
|
+
* // Usage
|
|
226
|
+
* const data = useMyHook(s => s.data);
|
|
227
|
+
* const { setData } = useMyHook(s => ({ setData: s.setData }));
|
|
228
|
+
* const everything = useMyHook();
|
|
229
|
+
* ```
|
|
230
|
+
*/
|
|
231
|
+
function createViewContextHook(config) {
|
|
232
|
+
function useViewContextHook(selectorOrProps, propsOverload) {
|
|
233
|
+
const isSelector = typeof selectorOrProps === 'function';
|
|
234
|
+
const selector = isSelector ? selectorOrProps : undefined;
|
|
235
|
+
const props = isSelector ? propsOverload : selectorOrProps;
|
|
236
|
+
const contextViewId = useViewIdContext();
|
|
237
|
+
const viewId = props?.viewId || contextViewId;
|
|
238
|
+
// Build actions - memoized for stable references
|
|
239
|
+
const actions = useActions(config, viewId);
|
|
240
|
+
// Subscribe to store with selector
|
|
241
|
+
return config.useStore(useShallow((store) => {
|
|
242
|
+
const state = config.getState(store, viewId);
|
|
243
|
+
const fullResult = { ...state, ...actions };
|
|
244
|
+
return selector ? selector(fullResult) : fullResult;
|
|
245
|
+
}));
|
|
246
|
+
}
|
|
247
|
+
return useViewContextHook;
|
|
248
|
+
}
|
|
249
|
+
// ===========================
|
|
250
|
+
// Helper: Build Actions
|
|
251
|
+
// ===========================
|
|
252
|
+
/**
|
|
253
|
+
* Internal helper to build and memoize actions
|
|
254
|
+
*/
|
|
255
|
+
function useActions(config, viewId) {
|
|
256
|
+
// Get the raw store state to extract action references
|
|
257
|
+
const store = config.useStore.getState();
|
|
258
|
+
// Build actions bound to viewId
|
|
259
|
+
return useMemo(() => config.getActions(store, viewId),
|
|
260
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
261
|
+
[viewId, ...Object.values(extractActionRefs(config.useStore))]);
|
|
262
|
+
}
|
|
263
|
+
/**
|
|
264
|
+
* Extract action function references from store for dependency tracking
|
|
265
|
+
*/
|
|
266
|
+
function extractActionRefs(useStore) {
|
|
267
|
+
const store = useStore.getState();
|
|
268
|
+
const refs = {};
|
|
269
|
+
for (const [key, value] of Object.entries(store)) {
|
|
270
|
+
if (typeof value === 'function') {
|
|
271
|
+
refs[key] = value;
|
|
272
|
+
}
|
|
273
|
+
}
|
|
274
|
+
return refs;
|
|
275
|
+
}
|
|
276
|
+
|
|
193
277
|
const useHeatmapControlStore = create()((set, get) => {
|
|
194
278
|
return {
|
|
195
279
|
controls: {
|
|
@@ -968,90 +1052,6 @@ const useHeatmapVizRectStore = create()(subscribeWithSelector((set) => {
|
|
|
968
1052
|
};
|
|
969
1053
|
}));
|
|
970
1054
|
|
|
971
|
-
const ViewIdContext = createContext(undefined);
|
|
972
|
-
const useViewIdContext = () => {
|
|
973
|
-
const viewId = useContext(ViewIdContext);
|
|
974
|
-
return viewId || DEFAULT_VIEW_ID;
|
|
975
|
-
};
|
|
976
|
-
|
|
977
|
-
// ===========================
|
|
978
|
-
// Factory Function
|
|
979
|
-
// ===========================
|
|
980
|
-
/**
|
|
981
|
-
* Creates a view-context aware hook with selector support
|
|
982
|
-
*
|
|
983
|
-
* Features:
|
|
984
|
-
* - Automatic viewId injection from context
|
|
985
|
-
* - Selector pattern for granular subscriptions
|
|
986
|
-
* - Full type safety
|
|
987
|
-
* - Optimized re-renders with useShallow
|
|
988
|
-
*
|
|
989
|
-
* @example
|
|
990
|
-
* ```ts
|
|
991
|
-
* const useMyHook = createViewContextHook({
|
|
992
|
-
* useStore: useMyStore,
|
|
993
|
-
* getState: (store, viewId) => ({
|
|
994
|
-
* data: store.data.get(viewId) ?? null,
|
|
995
|
-
* count: store.count.get(viewId) ?? 0,
|
|
996
|
-
* }),
|
|
997
|
-
* getActions: (store, viewId) => ({
|
|
998
|
-
* setData: (data) => store.setData(data, viewId),
|
|
999
|
-
* increment: () => store.increment(viewId),
|
|
1000
|
-
* }),
|
|
1001
|
-
* });
|
|
1002
|
-
*
|
|
1003
|
-
* // Usage
|
|
1004
|
-
* const data = useMyHook(s => s.data);
|
|
1005
|
-
* const { setData } = useMyHook(s => ({ setData: s.setData }));
|
|
1006
|
-
* const everything = useMyHook();
|
|
1007
|
-
* ```
|
|
1008
|
-
*/
|
|
1009
|
-
function createViewContextHook(config) {
|
|
1010
|
-
function useViewContextHook(selectorOrProps, propsOverload) {
|
|
1011
|
-
const isSelector = typeof selectorOrProps === 'function';
|
|
1012
|
-
const selector = isSelector ? selectorOrProps : undefined;
|
|
1013
|
-
const props = isSelector ? propsOverload : selectorOrProps;
|
|
1014
|
-
const contextViewId = useViewIdContext();
|
|
1015
|
-
const viewId = props?.viewId || contextViewId;
|
|
1016
|
-
// Build actions - memoized for stable references
|
|
1017
|
-
const actions = useActions(config, viewId);
|
|
1018
|
-
// Subscribe to store with selector
|
|
1019
|
-
return config.useStore(useShallow((store) => {
|
|
1020
|
-
const state = config.getState(store, viewId);
|
|
1021
|
-
const fullResult = { ...state, ...actions };
|
|
1022
|
-
return selector ? selector(fullResult) : fullResult;
|
|
1023
|
-
}));
|
|
1024
|
-
}
|
|
1025
|
-
return useViewContextHook;
|
|
1026
|
-
}
|
|
1027
|
-
// ===========================
|
|
1028
|
-
// Helper: Build Actions
|
|
1029
|
-
// ===========================
|
|
1030
|
-
/**
|
|
1031
|
-
* Internal helper to build and memoize actions
|
|
1032
|
-
*/
|
|
1033
|
-
function useActions(config, viewId) {
|
|
1034
|
-
// Get the raw store state to extract action references
|
|
1035
|
-
const store = config.useStore.getState();
|
|
1036
|
-
// Build actions bound to viewId
|
|
1037
|
-
return useMemo(() => config.getActions(store, viewId),
|
|
1038
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1039
|
-
[viewId, ...Object.values(extractActionRefs(config.useStore))]);
|
|
1040
|
-
}
|
|
1041
|
-
/**
|
|
1042
|
-
* Extract action function references from store for dependency tracking
|
|
1043
|
-
*/
|
|
1044
|
-
function extractActionRefs(useStore) {
|
|
1045
|
-
const store = useStore.getState();
|
|
1046
|
-
const refs = {};
|
|
1047
|
-
for (const [key, value] of Object.entries(store)) {
|
|
1048
|
-
if (typeof value === 'function') {
|
|
1049
|
-
refs[key] = value;
|
|
1050
|
-
}
|
|
1051
|
-
}
|
|
1052
|
-
return refs;
|
|
1053
|
-
}
|
|
1054
|
-
|
|
1055
1055
|
const useHeatmapAreaClick = createViewContextHook({
|
|
1056
1056
|
useStore: useHeatmapVizClickAreaStore,
|
|
1057
1057
|
getState: (store, viewId) => ({
|
|
@@ -1254,11 +1254,11 @@ const useHeatmapCopyView = () => {
|
|
|
1254
1254
|
const copyDataView = useHeatmapDataStore((state) => state.copyView);
|
|
1255
1255
|
const copySettingView = useHeatmapSettingStore((state) => state.copyView);
|
|
1256
1256
|
const copyVizView = useHeatmapVizStore((state) => state.copyView);
|
|
1257
|
-
const copyVizRectView = useHeatmapVizRectStore((state) => state.copyView);
|
|
1258
1257
|
const copyVizClickView = useHeatmapVizClickStore((state) => state.copyView);
|
|
1259
|
-
const copyVizHoverView = useHeatmapVizHoverStore((state) => state.copyView);
|
|
1260
1258
|
const copyVizAreaClickView = useHeatmapVizClickAreaStore((state) => state.copyView);
|
|
1261
|
-
const
|
|
1259
|
+
// const copyVizRectView = useHeatmapVizRectStore((state) => state.copyView);
|
|
1260
|
+
// const copyVizHoverView = useHeatmapVizHoverStore((state) => state.copyView);
|
|
1261
|
+
// const copyVizScrollView = useHeatmapVizScrollStore((state) => state.copyView);
|
|
1262
1262
|
const clearDataView = useHeatmapDataStore((state) => state.clearView);
|
|
1263
1263
|
const clearSettingView = useHeatmapSettingStore((state) => state.clearView);
|
|
1264
1264
|
const clearVizView = useHeatmapVizStore((state) => state.clearView);
|
|
@@ -1279,10 +1279,10 @@ const useHeatmapCopyView = () => {
|
|
|
1279
1279
|
copyDataView(fromViewId, toViewId);
|
|
1280
1280
|
copySettingView(fromViewId, toViewId);
|
|
1281
1281
|
copyVizView(fromViewId, toViewId);
|
|
1282
|
-
copyVizRectView(fromViewId, toViewId);
|
|
1282
|
+
// copyVizRectView(fromViewId, toViewId);
|
|
1283
1283
|
copyVizClickView(fromViewId, toViewId);
|
|
1284
|
-
copyVizHoverView(fromViewId, toViewId);
|
|
1285
|
-
copyVizScrollView(fromViewId, toViewId);
|
|
1284
|
+
// copyVizHoverView(fromViewId, toViewId);
|
|
1285
|
+
// copyVizScrollView(fromViewId, toViewId);
|
|
1286
1286
|
copyVizAreaClickView(fromViewId, toViewId);
|
|
1287
1287
|
};
|
|
1288
1288
|
const copyViewToMultiple = (fromViewId, toViewIds) => {
|
|
@@ -8740,4 +8740,4 @@ const HeatmapLayout = ({ data, clickmap, clickAreas, scrollmap, controls, dataIn
|
|
|
8740
8740
|
}
|
|
8741
8741
|
};
|
|
8742
8742
|
|
|
8743
|
-
export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO, ELM_CALLOUT_CONFIG, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, IClickMode, IClickRankType, IClickType, IDeviceType, IHeatmapType, IScrollType, ViewIdContext, Z_INDEX, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, downloadPerformanceReport, getCompareViewId, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClick, useHeatmapCanvas, useHeatmapClick, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapData, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHover, useHeatmapLiveStore, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapSetting, useHeatmapViz, useHeatmapVizRect, useHeatmapWidthByDevice, useHoveredElement, useIframeHeight, useIframeHeightProcessor, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };
|
|
8743
|
+
export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO, ELM_CALLOUT_CONFIG, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, IClickMode, IClickRankType, IClickType, IDeviceType, IHeatmapType, IScrollType, ViewIdContext, Z_INDEX, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, createViewContextHook, downloadPerformanceReport, getCompareViewId, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClick, useHeatmapCanvas, useHeatmapClick, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapData, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHover, useHeatmapLiveStore, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapSetting, useHeatmapViz, useHeatmapVizRect, useHeatmapWidthByDevice, useHoveredElement, useIframeHeight, useIframeHeightProcessor, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };
|
package/dist/esm/index.mjs
CHANGED
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
3
3
|
import { useNodesState, ReactFlow, Controls, Background } from '@xyflow/react';
|
|
4
4
|
import { useEffect, useRef, useCallback, createContext, useContext, useMemo, useState, forwardRef, memo, Fragment as Fragment$1 } from 'react';
|
|
5
|
+
import { useShallow } from 'zustand/react/shallow';
|
|
5
6
|
import { create } from 'zustand';
|
|
6
7
|
import { subscribeWithSelector } from 'zustand/middleware';
|
|
7
|
-
import { useShallow } from 'zustand/react/shallow';
|
|
8
8
|
import { decode } from '@gemx-dev/clarity-decode';
|
|
9
9
|
import { Visualizer } from '@gemx-dev/clarity-visualize';
|
|
10
10
|
import { createPortal } from 'react-dom';
|
|
@@ -190,6 +190,90 @@ var IScrollType;
|
|
|
190
190
|
IScrollType["Revenue"] = "revenue-scroll";
|
|
191
191
|
})(IScrollType || (IScrollType = {}));
|
|
192
192
|
|
|
193
|
+
const ViewIdContext = createContext(undefined);
|
|
194
|
+
const useViewIdContext = () => {
|
|
195
|
+
const viewId = useContext(ViewIdContext);
|
|
196
|
+
return viewId || DEFAULT_VIEW_ID;
|
|
197
|
+
};
|
|
198
|
+
|
|
199
|
+
// ===========================
|
|
200
|
+
// Factory Function
|
|
201
|
+
// ===========================
|
|
202
|
+
/**
|
|
203
|
+
* Creates a view-context aware hook with selector support
|
|
204
|
+
*
|
|
205
|
+
* Features:
|
|
206
|
+
* - Automatic viewId injection from context
|
|
207
|
+
* - Selector pattern for granular subscriptions
|
|
208
|
+
* - Full type safety
|
|
209
|
+
* - Optimized re-renders with useShallow
|
|
210
|
+
*
|
|
211
|
+
* @example
|
|
212
|
+
* ```ts
|
|
213
|
+
* const useMyHook = createViewContextHook({
|
|
214
|
+
* useStore: useMyStore,
|
|
215
|
+
* getState: (store, viewId) => ({
|
|
216
|
+
* data: store.data.get(viewId) ?? null,
|
|
217
|
+
* count: store.count.get(viewId) ?? 0,
|
|
218
|
+
* }),
|
|
219
|
+
* getActions: (store, viewId) => ({
|
|
220
|
+
* setData: (data) => store.setData(data, viewId),
|
|
221
|
+
* increment: () => store.increment(viewId),
|
|
222
|
+
* }),
|
|
223
|
+
* });
|
|
224
|
+
*
|
|
225
|
+
* // Usage
|
|
226
|
+
* const data = useMyHook(s => s.data);
|
|
227
|
+
* const { setData } = useMyHook(s => ({ setData: s.setData }));
|
|
228
|
+
* const everything = useMyHook();
|
|
229
|
+
* ```
|
|
230
|
+
*/
|
|
231
|
+
function createViewContextHook(config) {
|
|
232
|
+
function useViewContextHook(selectorOrProps, propsOverload) {
|
|
233
|
+
const isSelector = typeof selectorOrProps === 'function';
|
|
234
|
+
const selector = isSelector ? selectorOrProps : undefined;
|
|
235
|
+
const props = isSelector ? propsOverload : selectorOrProps;
|
|
236
|
+
const contextViewId = useViewIdContext();
|
|
237
|
+
const viewId = props?.viewId || contextViewId;
|
|
238
|
+
// Build actions - memoized for stable references
|
|
239
|
+
const actions = useActions(config, viewId);
|
|
240
|
+
// Subscribe to store with selector
|
|
241
|
+
return config.useStore(useShallow((store) => {
|
|
242
|
+
const state = config.getState(store, viewId);
|
|
243
|
+
const fullResult = { ...state, ...actions };
|
|
244
|
+
return selector ? selector(fullResult) : fullResult;
|
|
245
|
+
}));
|
|
246
|
+
}
|
|
247
|
+
return useViewContextHook;
|
|
248
|
+
}
|
|
249
|
+
// ===========================
|
|
250
|
+
// Helper: Build Actions
|
|
251
|
+
// ===========================
|
|
252
|
+
/**
|
|
253
|
+
* Internal helper to build and memoize actions
|
|
254
|
+
*/
|
|
255
|
+
function useActions(config, viewId) {
|
|
256
|
+
// Get the raw store state to extract action references
|
|
257
|
+
const store = config.useStore.getState();
|
|
258
|
+
// Build actions bound to viewId
|
|
259
|
+
return useMemo(() => config.getActions(store, viewId),
|
|
260
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
261
|
+
[viewId, ...Object.values(extractActionRefs(config.useStore))]);
|
|
262
|
+
}
|
|
263
|
+
/**
|
|
264
|
+
* Extract action function references from store for dependency tracking
|
|
265
|
+
*/
|
|
266
|
+
function extractActionRefs(useStore) {
|
|
267
|
+
const store = useStore.getState();
|
|
268
|
+
const refs = {};
|
|
269
|
+
for (const [key, value] of Object.entries(store)) {
|
|
270
|
+
if (typeof value === 'function') {
|
|
271
|
+
refs[key] = value;
|
|
272
|
+
}
|
|
273
|
+
}
|
|
274
|
+
return refs;
|
|
275
|
+
}
|
|
276
|
+
|
|
193
277
|
const useHeatmapControlStore = create()((set, get) => {
|
|
194
278
|
return {
|
|
195
279
|
controls: {
|
|
@@ -968,90 +1052,6 @@ const useHeatmapVizRectStore = create()(subscribeWithSelector((set) => {
|
|
|
968
1052
|
};
|
|
969
1053
|
}));
|
|
970
1054
|
|
|
971
|
-
const ViewIdContext = createContext(undefined);
|
|
972
|
-
const useViewIdContext = () => {
|
|
973
|
-
const viewId = useContext(ViewIdContext);
|
|
974
|
-
return viewId || DEFAULT_VIEW_ID;
|
|
975
|
-
};
|
|
976
|
-
|
|
977
|
-
// ===========================
|
|
978
|
-
// Factory Function
|
|
979
|
-
// ===========================
|
|
980
|
-
/**
|
|
981
|
-
* Creates a view-context aware hook with selector support
|
|
982
|
-
*
|
|
983
|
-
* Features:
|
|
984
|
-
* - Automatic viewId injection from context
|
|
985
|
-
* - Selector pattern for granular subscriptions
|
|
986
|
-
* - Full type safety
|
|
987
|
-
* - Optimized re-renders with useShallow
|
|
988
|
-
*
|
|
989
|
-
* @example
|
|
990
|
-
* ```ts
|
|
991
|
-
* const useMyHook = createViewContextHook({
|
|
992
|
-
* useStore: useMyStore,
|
|
993
|
-
* getState: (store, viewId) => ({
|
|
994
|
-
* data: store.data.get(viewId) ?? null,
|
|
995
|
-
* count: store.count.get(viewId) ?? 0,
|
|
996
|
-
* }),
|
|
997
|
-
* getActions: (store, viewId) => ({
|
|
998
|
-
* setData: (data) => store.setData(data, viewId),
|
|
999
|
-
* increment: () => store.increment(viewId),
|
|
1000
|
-
* }),
|
|
1001
|
-
* });
|
|
1002
|
-
*
|
|
1003
|
-
* // Usage
|
|
1004
|
-
* const data = useMyHook(s => s.data);
|
|
1005
|
-
* const { setData } = useMyHook(s => ({ setData: s.setData }));
|
|
1006
|
-
* const everything = useMyHook();
|
|
1007
|
-
* ```
|
|
1008
|
-
*/
|
|
1009
|
-
function createViewContextHook(config) {
|
|
1010
|
-
function useViewContextHook(selectorOrProps, propsOverload) {
|
|
1011
|
-
const isSelector = typeof selectorOrProps === 'function';
|
|
1012
|
-
const selector = isSelector ? selectorOrProps : undefined;
|
|
1013
|
-
const props = isSelector ? propsOverload : selectorOrProps;
|
|
1014
|
-
const contextViewId = useViewIdContext();
|
|
1015
|
-
const viewId = props?.viewId || contextViewId;
|
|
1016
|
-
// Build actions - memoized for stable references
|
|
1017
|
-
const actions = useActions(config, viewId);
|
|
1018
|
-
// Subscribe to store with selector
|
|
1019
|
-
return config.useStore(useShallow((store) => {
|
|
1020
|
-
const state = config.getState(store, viewId);
|
|
1021
|
-
const fullResult = { ...state, ...actions };
|
|
1022
|
-
return selector ? selector(fullResult) : fullResult;
|
|
1023
|
-
}));
|
|
1024
|
-
}
|
|
1025
|
-
return useViewContextHook;
|
|
1026
|
-
}
|
|
1027
|
-
// ===========================
|
|
1028
|
-
// Helper: Build Actions
|
|
1029
|
-
// ===========================
|
|
1030
|
-
/**
|
|
1031
|
-
* Internal helper to build and memoize actions
|
|
1032
|
-
*/
|
|
1033
|
-
function useActions(config, viewId) {
|
|
1034
|
-
// Get the raw store state to extract action references
|
|
1035
|
-
const store = config.useStore.getState();
|
|
1036
|
-
// Build actions bound to viewId
|
|
1037
|
-
return useMemo(() => config.getActions(store, viewId),
|
|
1038
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1039
|
-
[viewId, ...Object.values(extractActionRefs(config.useStore))]);
|
|
1040
|
-
}
|
|
1041
|
-
/**
|
|
1042
|
-
* Extract action function references from store for dependency tracking
|
|
1043
|
-
*/
|
|
1044
|
-
function extractActionRefs(useStore) {
|
|
1045
|
-
const store = useStore.getState();
|
|
1046
|
-
const refs = {};
|
|
1047
|
-
for (const [key, value] of Object.entries(store)) {
|
|
1048
|
-
if (typeof value === 'function') {
|
|
1049
|
-
refs[key] = value;
|
|
1050
|
-
}
|
|
1051
|
-
}
|
|
1052
|
-
return refs;
|
|
1053
|
-
}
|
|
1054
|
-
|
|
1055
1055
|
const useHeatmapAreaClick = createViewContextHook({
|
|
1056
1056
|
useStore: useHeatmapVizClickAreaStore,
|
|
1057
1057
|
getState: (store, viewId) => ({
|
|
@@ -1254,11 +1254,11 @@ const useHeatmapCopyView = () => {
|
|
|
1254
1254
|
const copyDataView = useHeatmapDataStore((state) => state.copyView);
|
|
1255
1255
|
const copySettingView = useHeatmapSettingStore((state) => state.copyView);
|
|
1256
1256
|
const copyVizView = useHeatmapVizStore((state) => state.copyView);
|
|
1257
|
-
const copyVizRectView = useHeatmapVizRectStore((state) => state.copyView);
|
|
1258
1257
|
const copyVizClickView = useHeatmapVizClickStore((state) => state.copyView);
|
|
1259
|
-
const copyVizHoverView = useHeatmapVizHoverStore((state) => state.copyView);
|
|
1260
1258
|
const copyVizAreaClickView = useHeatmapVizClickAreaStore((state) => state.copyView);
|
|
1261
|
-
const
|
|
1259
|
+
// const copyVizRectView = useHeatmapVizRectStore((state) => state.copyView);
|
|
1260
|
+
// const copyVizHoverView = useHeatmapVizHoverStore((state) => state.copyView);
|
|
1261
|
+
// const copyVizScrollView = useHeatmapVizScrollStore((state) => state.copyView);
|
|
1262
1262
|
const clearDataView = useHeatmapDataStore((state) => state.clearView);
|
|
1263
1263
|
const clearSettingView = useHeatmapSettingStore((state) => state.clearView);
|
|
1264
1264
|
const clearVizView = useHeatmapVizStore((state) => state.clearView);
|
|
@@ -1279,10 +1279,10 @@ const useHeatmapCopyView = () => {
|
|
|
1279
1279
|
copyDataView(fromViewId, toViewId);
|
|
1280
1280
|
copySettingView(fromViewId, toViewId);
|
|
1281
1281
|
copyVizView(fromViewId, toViewId);
|
|
1282
|
-
copyVizRectView(fromViewId, toViewId);
|
|
1282
|
+
// copyVizRectView(fromViewId, toViewId);
|
|
1283
1283
|
copyVizClickView(fromViewId, toViewId);
|
|
1284
|
-
copyVizHoverView(fromViewId, toViewId);
|
|
1285
|
-
copyVizScrollView(fromViewId, toViewId);
|
|
1284
|
+
// copyVizHoverView(fromViewId, toViewId);
|
|
1285
|
+
// copyVizScrollView(fromViewId, toViewId);
|
|
1286
1286
|
copyVizAreaClickView(fromViewId, toViewId);
|
|
1287
1287
|
};
|
|
1288
1288
|
const copyViewToMultiple = (fromViewId, toViewIds) => {
|
|
@@ -8740,4 +8740,4 @@ const HeatmapLayout = ({ data, clickmap, clickAreas, scrollmap, controls, dataIn
|
|
|
8740
8740
|
}
|
|
8741
8741
|
};
|
|
8742
8742
|
|
|
8743
|
-
export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO, ELM_CALLOUT_CONFIG, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, IClickMode, IClickRankType, IClickType, IDeviceType, IHeatmapType, IScrollType, ViewIdContext, Z_INDEX, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, downloadPerformanceReport, getCompareViewId, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClick, useHeatmapCanvas, useHeatmapClick, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapData, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHover, useHeatmapLiveStore, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapSetting, useHeatmapViz, useHeatmapVizRect, useHeatmapWidthByDevice, useHoveredElement, useIframeHeight, useIframeHeightProcessor, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };
|
|
8743
|
+
export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO, ELM_CALLOUT_CONFIG, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, IClickMode, IClickRankType, IClickType, IDeviceType, IHeatmapType, IScrollType, ViewIdContext, Z_INDEX, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, createViewContextHook, downloadPerformanceReport, getCompareViewId, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClick, useHeatmapCanvas, useHeatmapClick, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapData, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHover, useHeatmapLiveStore, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapSetting, useHeatmapViz, useHeatmapVizRect, useHeatmapWidthByDevice, useHoveredElement, useIframeHeight, useIframeHeightProcessor, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/view-context/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,qBAAqB,CAAC;AAEpC,cAAc,sBAAsB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/view-context/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,qBAAqB,CAAC;AAEpC,cAAc,sBAAsB,CAAC"}
|