recap_mobileview 0.0.4 → 0.0.5
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.
|
@@ -33,6 +33,7 @@ const reactflow_1 = __importStar(require("reactflow"));
|
|
|
33
33
|
const FlashCardNode_1 = __importDefault(require("../FlashCardNode/FlashCardNode"));
|
|
34
34
|
const MobileAccordionView_1 = require("../FlashCardNode/MobileAccordionView");
|
|
35
35
|
const useRecapGraphLogic_1 = require("./useRecapGraphLogic");
|
|
36
|
+
const MIN_ZOOM = 0.8;
|
|
36
37
|
const RecapGraph = ({ jsonData = null, contentMap = {}, iconConfig = [], onContentUpdate, onIconDataUpdate, isAdmin = false, isMobile = false, playicon = {}, }) => {
|
|
37
38
|
const [layout, setLayout] = (0, react_1.useState)({
|
|
38
39
|
nodes: [],
|
|
@@ -49,21 +50,23 @@ const RecapGraph = ({ jsonData = null, contentMap = {}, iconConfig = [], onConte
|
|
|
49
50
|
const nodes = logic.buildNodes(jsonData);
|
|
50
51
|
const edges = logic.buildEdges(jsonData, nodes);
|
|
51
52
|
return { nodes, edges };
|
|
52
|
-
}, [jsonData, logic
|
|
53
|
-
const computeBounds = (nodes) => {
|
|
53
|
+
}, [jsonData, logic.activeExpandedNodeId]);
|
|
54
|
+
const computeBounds = (nodes, minZoom = MIN_ZOOM) => {
|
|
54
55
|
if (!nodes || nodes.length === 0) {
|
|
56
|
+
const BASE = 2000 / minZoom;
|
|
55
57
|
return {
|
|
56
|
-
minX: -
|
|
57
|
-
minY: -
|
|
58
|
-
maxX:
|
|
59
|
-
maxY:
|
|
58
|
+
minX: -BASE,
|
|
59
|
+
minY: -BASE,
|
|
60
|
+
maxX: BASE,
|
|
61
|
+
maxY: BASE,
|
|
60
62
|
};
|
|
61
63
|
}
|
|
62
64
|
const minX = Math.min(...nodes.map((n) => n.position.x));
|
|
63
65
|
const maxX = Math.max(...nodes.map((n) => n.position.x + (n.width || 260)));
|
|
64
66
|
const minY = Math.min(...nodes.map((n) => n.position.y));
|
|
65
67
|
const maxY = Math.max(...nodes.map((n) => n.position.y + (n.height || 150)));
|
|
66
|
-
const
|
|
68
|
+
const BASE_PAD = 400;
|
|
69
|
+
const PAD = BASE_PAD / minZoom;
|
|
67
70
|
return {
|
|
68
71
|
minX: minX - PAD,
|
|
69
72
|
minY: minY - PAD,
|
|
@@ -73,14 +76,14 @@ const RecapGraph = ({ jsonData = null, contentMap = {}, iconConfig = [], onConte
|
|
|
73
76
|
};
|
|
74
77
|
(0, react_1.useEffect)(() => {
|
|
75
78
|
const res = logic.computeCustomLayout(graphData.nodes, graphData.edges);
|
|
76
|
-
setLayout(
|
|
79
|
+
setLayout({
|
|
77
80
|
nodes: graphData.nodes.map((n) => ({
|
|
78
81
|
...n,
|
|
79
82
|
position: res.nodes.find((m) => m.id === n.id)?.position || n.position,
|
|
80
83
|
})),
|
|
81
84
|
edges: graphData.edges,
|
|
82
85
|
bounds: computeBounds(res.nodes),
|
|
83
|
-
})
|
|
86
|
+
});
|
|
84
87
|
}, [logic.expandedNodeId, logic.expandedNodeHeight]);
|
|
85
88
|
const bounds = layout.bounds || {
|
|
86
89
|
minX: -2000,
|
|
@@ -92,7 +95,7 @@ const RecapGraph = ({ jsonData = null, contentMap = {}, iconConfig = [], onConte
|
|
|
92
95
|
width: isAdmin ? "100vw" : "100%",
|
|
93
96
|
height: isAdmin ? "100vh" : "90%",
|
|
94
97
|
backgroundColor: "#f8fafc",
|
|
95
|
-
}, children: isMobile ? ((0, jsx_runtime_1.jsx)(MobileAccordionView_1.MobileAccordionView, { jsonData: jsonData, contentMap: contentMap, iconConfig: iconConfig, onContentUpdate: onContentUpdate, onIconDataUpdate: onIconDataUpdate, isAdmin: isAdmin, playicon: playicon })) : ((0, jsx_runtime_1.jsxs)(reactflow_1.default, { nodes: layout.nodes, edges: layout.edges, nodeTypes: nodeTypes, proOptions: { hideAttribution: true }, panOnScroll: true, panOnScrollMode: "free", zoomOnPinch: true, zoomOnScroll: false, panOnDrag: true, minZoom:
|
|
98
|
+
}, children: isMobile ? ((0, jsx_runtime_1.jsx)(MobileAccordionView_1.MobileAccordionView, { jsonData: jsonData, contentMap: contentMap, iconConfig: iconConfig, onContentUpdate: onContentUpdate, onIconDataUpdate: onIconDataUpdate, isAdmin: isAdmin, playicon: playicon })) : ((0, jsx_runtime_1.jsxs)(reactflow_1.default, { nodes: layout.nodes, edges: layout.edges, nodeTypes: nodeTypes, proOptions: { hideAttribution: true }, fitView: true, panOnScroll: true, panOnScrollMode: "free", zoomOnPinch: true, zoomOnScroll: false, panOnDrag: true, minZoom: MIN_ZOOM, maxZoom: 1.6, translateExtent: [
|
|
96
99
|
[bounds.minX, bounds.minY],
|
|
97
100
|
[bounds.maxX, bounds.maxY],
|
|
98
101
|
], children: [(0, jsx_runtime_1.jsx)(reactflow_1.Controls, { showFitView: false, showInteractive: false }), (0, jsx_runtime_1.jsx)(reactflow_1.Background, { variant: "none" })] })) }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Reactgraphflow.js","sourceRoot":"","sources":["../../../../src/components/Organisms/RecapGraph/Reactgraphflow.jsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA4D;AAC5D,uDAA4D;AAC5D,qCAAqC;
|
|
1
|
+
{"version":3,"file":"Reactgraphflow.js","sourceRoot":"","sources":["../../../../src/components/Organisms/RecapGraph/Reactgraphflow.jsx"],"names":[],"mappings":"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"}
|