@neo4j-ndl/react-graph 2.1.1 → 2.1.2
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/lib/cjs/graph-visualization-buttons.js +85 -20
- package/lib/cjs/graph-visualization-buttons.js.map +1 -1
- package/lib/esm/graph-visualization-buttons.js +85 -20
- package/lib/esm/graph-visualization-buttons.js.map +1 -1
- package/lib/types/graph-visualization-buttons.d.ts +13 -5
- package/lib/types/graph-visualization-buttons.d.ts.map +1 -1
- package/lib/types/graph-visualization.d.ts +58 -3
- package/lib/types/graph-visualization.d.ts.map +1 -1
- package/package.json +1 -1
- package/lib/cjs/stories/graph-visualization-barebones.story.js +0 -93
- package/lib/cjs/stories/graph-visualization-barebones.story.js.map +0 -1
- package/lib/cjs/stories/graph-visualization-custom.story.js +0 -77
- package/lib/cjs/stories/graph-visualization-custom.story.js.map +0 -1
- package/lib/cjs/stories/graph-visualization-default.story.js +0 -93
- package/lib/cjs/stories/graph-visualization-default.story.js.map +0 -1
- package/lib/cjs/stories/graph-visualization-highlighting.story.js +0 -30
- package/lib/cjs/stories/graph-visualization-highlighting.story.js.map +0 -1
- package/lib/cjs/stories/graph-visualization-maximalist.story.js +0 -107
- package/lib/cjs/stories/graph-visualization-maximalist.story.js.map +0 -1
- package/lib/cjs/stories/graph-visualization-range-styling.story.js +0 -100
- package/lib/cjs/stories/graph-visualization-range-styling.story.js.map +0 -1
- package/lib/cjs/stories/graph-visualization-rule-based-styling-advanced.story.js +0 -270
- package/lib/cjs/stories/graph-visualization-rule-based-styling-advanced.story.js.map +0 -1
- package/lib/cjs/stories/graph-visualization-rule-based-styling-datetime.story.js +0 -181
- package/lib/cjs/stories/graph-visualization-rule-based-styling-datetime.story.js.map +0 -1
- package/lib/cjs/stories/graph-visualization-rule-based-styling.story.js +0 -81
- package/lib/cjs/stories/graph-visualization-rule-based-styling.story.js.map +0 -1
- package/lib/cjs/stories/graph-visualization-search.story.js +0 -36
- package/lib/cjs/stories/graph-visualization-search.story.js.map +0 -1
- package/lib/cjs/stories/graph-visualization-simple-styling.story.js +0 -59
- package/lib/cjs/stories/graph-visualization-simple-styling.story.js.map +0 -1
- package/lib/cjs/stories/graph-visualization-unique-colors-styling.story.js +0 -71
- package/lib/cjs/stories/graph-visualization-unique-colors-styling.story.js.map +0 -1
- package/lib/cjs/stories/index.js +0 -80
- package/lib/cjs/stories/index.js.map +0 -1
- package/lib/cjs/stories/preview-graph-visualization.story.js +0 -68
- package/lib/cjs/stories/preview-graph-visualization.story.js.map +0 -1
- package/lib/cjs/stories/story-data.js +0 -992
- package/lib/cjs/stories/story-data.js.map +0 -1
- package/lib/esm/stories/graph-visualization-barebones.story.js +0 -90
- package/lib/esm/stories/graph-visualization-barebones.story.js.map +0 -1
- package/lib/esm/stories/graph-visualization-custom.story.js +0 -74
- package/lib/esm/stories/graph-visualization-custom.story.js.map +0 -1
- package/lib/esm/stories/graph-visualization-default.story.js +0 -90
- package/lib/esm/stories/graph-visualization-default.story.js.map +0 -1
- package/lib/esm/stories/graph-visualization-highlighting.story.js +0 -28
- package/lib/esm/stories/graph-visualization-highlighting.story.js.map +0 -1
- package/lib/esm/stories/graph-visualization-maximalist.story.js +0 -104
- package/lib/esm/stories/graph-visualization-maximalist.story.js.map +0 -1
- package/lib/esm/stories/graph-visualization-range-styling.story.js +0 -97
- package/lib/esm/stories/graph-visualization-range-styling.story.js.map +0 -1
- package/lib/esm/stories/graph-visualization-rule-based-styling-advanced.story.js +0 -267
- package/lib/esm/stories/graph-visualization-rule-based-styling-advanced.story.js.map +0 -1
- package/lib/esm/stories/graph-visualization-rule-based-styling-datetime.story.js +0 -178
- package/lib/esm/stories/graph-visualization-rule-based-styling-datetime.story.js.map +0 -1
- package/lib/esm/stories/graph-visualization-rule-based-styling.story.js +0 -78
- package/lib/esm/stories/graph-visualization-rule-based-styling.story.js.map +0 -1
- package/lib/esm/stories/graph-visualization-search.story.js +0 -34
- package/lib/esm/stories/graph-visualization-search.story.js.map +0 -1
- package/lib/esm/stories/graph-visualization-simple-styling.story.js +0 -56
- package/lib/esm/stories/graph-visualization-simple-styling.story.js.map +0 -1
- package/lib/esm/stories/graph-visualization-unique-colors-styling.story.js +0 -69
- package/lib/esm/stories/graph-visualization-unique-colors-styling.story.js.map +0 -1
- package/lib/esm/stories/index.js +0 -61
- package/lib/esm/stories/index.js.map +0 -1
- package/lib/esm/stories/preview-graph-visualization.story.js +0 -66
- package/lib/esm/stories/preview-graph-visualization.story.js.map +0 -1
- package/lib/esm/stories/story-data.js +0 -989
- package/lib/esm/stories/story-data.js.map +0 -1
- package/lib/types/stories/graph-visualization-barebones.story.d.ts +0 -24
- package/lib/types/stories/graph-visualization-barebones.story.d.ts.map +0 -1
- package/lib/types/stories/graph-visualization-custom.story.d.ts +0 -24
- package/lib/types/stories/graph-visualization-custom.story.d.ts.map +0 -1
- package/lib/types/stories/graph-visualization-default.story.d.ts +0 -24
- package/lib/types/stories/graph-visualization-default.story.d.ts.map +0 -1
- package/lib/types/stories/graph-visualization-highlighting.story.d.ts +0 -23
- package/lib/types/stories/graph-visualization-highlighting.story.d.ts.map +0 -1
- package/lib/types/stories/graph-visualization-maximalist.story.d.ts +0 -24
- package/lib/types/stories/graph-visualization-maximalist.story.d.ts.map +0 -1
- package/lib/types/stories/graph-visualization-range-styling.story.d.ts +0 -25
- package/lib/types/stories/graph-visualization-range-styling.story.d.ts.map +0 -1
- package/lib/types/stories/graph-visualization-rule-based-styling-advanced.story.d.ts +0 -33
- package/lib/types/stories/graph-visualization-rule-based-styling-advanced.story.d.ts.map +0 -1
- package/lib/types/stories/graph-visualization-rule-based-styling-datetime.story.d.ts +0 -25
- package/lib/types/stories/graph-visualization-rule-based-styling-datetime.story.d.ts.map +0 -1
- package/lib/types/stories/graph-visualization-rule-based-styling.story.d.ts +0 -25
- package/lib/types/stories/graph-visualization-rule-based-styling.story.d.ts.map +0 -1
- package/lib/types/stories/graph-visualization-search.story.d.ts +0 -23
- package/lib/types/stories/graph-visualization-search.story.d.ts.map +0 -1
- package/lib/types/stories/graph-visualization-simple-styling.story.d.ts +0 -25
- package/lib/types/stories/graph-visualization-simple-styling.story.d.ts.map +0 -1
- package/lib/types/stories/graph-visualization-unique-colors-styling.story.d.ts +0 -23
- package/lib/types/stories/graph-visualization-unique-colors-styling.story.d.ts.map +0 -1
- package/lib/types/stories/index.d.ts +0 -47
- package/lib/types/stories/index.d.ts.map +0 -1
- package/lib/types/stories/preview-graph-visualization.story.d.ts +0 -23
- package/lib/types/stories/preview-graph-visualization.story.d.ts.map +0 -1
- package/lib/types/stories/story-data.d.ts +0 -31
- package/lib/types/stories/story-data.d.ts.map +0 -1
|
@@ -33,11 +33,11 @@ const graph_visualization_context_1 = require("./graph-visualization-context");
|
|
|
33
33
|
const use_semi_controlled_state_1 = require("./use-semi-controlled-state");
|
|
34
34
|
const utils_1 = require("./utils");
|
|
35
35
|
const GroupButton = (props) => {
|
|
36
|
-
const { isActive, ariaLabel, isDisabled, description, onClick, onMouseDown, tooltipPlacement, className, style, htmlAttributes, children, } = props;
|
|
36
|
+
const { isActive, ariaLabel, isDisabled, description, onClick, onMouseDown, tooltipPlacement, className, style, htmlAttributes, children, descriptionKbdProps, } = props;
|
|
37
37
|
return ((0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: description !== null && description !== void 0 ? description : ariaLabel, tooltipProps: {
|
|
38
38
|
content: { style: { whiteSpace: 'nowrap' } },
|
|
39
39
|
root: { isPortaled: false, placement: tooltipPlacement },
|
|
40
|
-
}, size: "small", className: className, style: style, isActive: isActive, isDisabled: isDisabled, onClick: onClick, htmlAttributes: Object.assign({ onMouseDown }, htmlAttributes), children: children }));
|
|
40
|
+
}, size: "small", className: className, style: style, isActive: isActive, isDisabled: isDisabled, descriptionKbdProps: descriptionKbdProps, onClick: onClick, htmlAttributes: Object.assign({ onMouseDown }, htmlAttributes), children: children }));
|
|
41
41
|
};
|
|
42
42
|
exports.GroupButton = GroupButton;
|
|
43
43
|
const targetIsTextInput = (target) => {
|
|
@@ -49,23 +49,46 @@ const targetIsTextInput = (target) => {
|
|
|
49
49
|
const isEditingText = (e) => {
|
|
50
50
|
return targetIsTextInput(e.target);
|
|
51
51
|
};
|
|
52
|
-
const
|
|
52
|
+
const GESTURE_KEYS_DEFAULT = {
|
|
53
53
|
box: 'B',
|
|
54
54
|
lasso: 'L',
|
|
55
55
|
single: 'S',
|
|
56
56
|
};
|
|
57
|
-
const
|
|
57
|
+
const GESTURE_KEYS_DEFAULT_ICONS = {
|
|
58
|
+
box: (0, jsx_runtime_1.jsx)(icons_1.SquareDashIcon, {}),
|
|
59
|
+
lasso: (0, jsx_runtime_1.jsx)(icons_1.LassoIcon, {}),
|
|
60
|
+
single: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}),
|
|
61
|
+
};
|
|
62
|
+
const GESTURE_KEYS_DEFAULT_TITLES = {
|
|
63
|
+
box: 'Box',
|
|
64
|
+
lasso: 'Lasso',
|
|
65
|
+
single: 'Single',
|
|
66
|
+
};
|
|
67
|
+
const getShortcutModifierKeys = (shortcutKey) => [
|
|
68
|
+
...((shortcutKey === null || shortcutKey === void 0 ? void 0 : shortcutKey.isMetaKey) ? ['meta'] : []),
|
|
69
|
+
...((shortcutKey === null || shortcutKey === void 0 ? void 0 : shortcutKey.isShiftKey) ? ['shift'] : []),
|
|
70
|
+
];
|
|
71
|
+
const isShortcutMatch = (evt, shortcutKey) => {
|
|
72
|
+
if (shortcutKey === undefined || shortcutKey.keys.length !== 1) {
|
|
73
|
+
return false;
|
|
74
|
+
}
|
|
75
|
+
return (evt.key.toUpperCase() === shortcutKey.keys[0].toUpperCase() &&
|
|
76
|
+
evt.metaKey === shortcutKey.isMetaKey &&
|
|
77
|
+
evt.shiftKey === shortcutKey.isShiftKey &&
|
|
78
|
+
!evt.altKey &&
|
|
79
|
+
!evt.ctrlKey);
|
|
80
|
+
};
|
|
81
|
+
const useRegisterKeyboardGestureSwitcher = (gestureShortcuts) => {
|
|
58
82
|
const { setGesture } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
|
|
59
83
|
const handleKeyDown = (0, react_2.useCallback)((evt) => {
|
|
60
84
|
if (!isEditingText(evt) && setGesture !== undefined) {
|
|
61
|
-
const
|
|
62
|
-
|
|
63
|
-
if (upperKey === GESTURE_KEYS[gesture]) {
|
|
85
|
+
for (const { gesture, shortcutKey } of gestureShortcuts) {
|
|
86
|
+
if (isShortcutMatch(evt, shortcutKey)) {
|
|
64
87
|
setGesture(gesture);
|
|
65
88
|
}
|
|
66
89
|
}
|
|
67
90
|
}
|
|
68
|
-
}, [
|
|
91
|
+
}, [gestureShortcuts, setGesture]);
|
|
69
92
|
(0, react_2.useEffect)(() => {
|
|
70
93
|
document.addEventListener('keydown', handleKeyDown);
|
|
71
94
|
return () => {
|
|
@@ -73,27 +96,47 @@ const useRegisterKeyboardGestureSwitcher = (gestures) => {
|
|
|
73
96
|
};
|
|
74
97
|
}, [handleKeyDown]);
|
|
75
98
|
};
|
|
76
|
-
const
|
|
77
|
-
|
|
99
|
+
const SingleSelectButton = ({ className, style, htmlAttributes, tooltipPlacement, shortcutKey = {
|
|
100
|
+
keys: [GESTURE_KEYS_DEFAULT.single],
|
|
101
|
+
isMetaKey: false,
|
|
102
|
+
isShiftKey: false,
|
|
103
|
+
}, }) => {
|
|
78
104
|
const { gesture, setGesture, interactionMode } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
|
|
79
|
-
useRegisterKeyboardGestureSwitcher(['single']);
|
|
80
|
-
return ((0, jsx_runtime_1.jsx)(exports.GroupButton, { isActive: gesture === 'single', isDisabled: interactionMode !== 'select', ariaLabel: "Individual Select Button", description:
|
|
105
|
+
useRegisterKeyboardGestureSwitcher([{ gesture: 'single', shortcutKey }]);
|
|
106
|
+
return ((0, jsx_runtime_1.jsx)(exports.GroupButton, { isActive: gesture === 'single', isDisabled: interactionMode !== 'select', ariaLabel: "Individual Select Button", description: "Individual Select", descriptionKbdProps: {
|
|
107
|
+
keys: shortcutKey.keys,
|
|
108
|
+
modifierKeys: getShortcutModifierKeys(shortcutKey),
|
|
109
|
+
}, onClick: () => {
|
|
81
110
|
setGesture === null || setGesture === void 0 ? void 0 : setGesture('single');
|
|
82
111
|
}, tooltipPlacement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'right', htmlAttributes: Object.assign({ 'data-testid': 'gesture-individual-select' }, htmlAttributes), className: className, style: style, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, { "aria-label": "Individual Select" }) }));
|
|
83
112
|
};
|
|
84
113
|
exports.SingleSelectButton = SingleSelectButton;
|
|
85
|
-
const BoxSelectButton = ({ className, style, htmlAttributes, tooltipPlacement,
|
|
114
|
+
const BoxSelectButton = ({ className, style, htmlAttributes, tooltipPlacement, shortcutKey = {
|
|
115
|
+
keys: [GESTURE_KEYS_DEFAULT.box],
|
|
116
|
+
isMetaKey: false,
|
|
117
|
+
isShiftKey: false,
|
|
118
|
+
}, }) => {
|
|
86
119
|
const { gesture, setGesture, interactionMode } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
|
|
87
|
-
useRegisterKeyboardGestureSwitcher(['box']);
|
|
88
|
-
return ((0, jsx_runtime_1.jsx)(exports.GroupButton, { isDisabled: interactionMode !== 'select' || setGesture === undefined, isActive: gesture === 'box', ariaLabel: "Box Select Button", description:
|
|
120
|
+
useRegisterKeyboardGestureSwitcher([{ gesture: 'box', shortcutKey }]);
|
|
121
|
+
return ((0, jsx_runtime_1.jsx)(exports.GroupButton, { isDisabled: interactionMode !== 'select' || setGesture === undefined, isActive: gesture === 'box', ariaLabel: "Box Select Button", description: "Box Select", descriptionKbdProps: {
|
|
122
|
+
keys: shortcutKey.keys,
|
|
123
|
+
modifierKeys: getShortcutModifierKeys(shortcutKey),
|
|
124
|
+
}, onClick: () => {
|
|
89
125
|
setGesture === null || setGesture === void 0 ? void 0 : setGesture('box');
|
|
90
126
|
}, tooltipPlacement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'right', htmlAttributes: Object.assign({ 'data-testid': 'gesture-box-select' }, htmlAttributes), className: className, style: style, children: (0, jsx_runtime_1.jsx)(icons_1.SquareDashIcon, { "aria-label": "Box select" }) }));
|
|
91
127
|
};
|
|
92
128
|
exports.BoxSelectButton = BoxSelectButton;
|
|
93
|
-
const LassoSelectButton = ({ className, style, htmlAttributes, tooltipPlacement,
|
|
129
|
+
const LassoSelectButton = ({ className, style, htmlAttributes, tooltipPlacement, shortcutKey = {
|
|
130
|
+
keys: [GESTURE_KEYS_DEFAULT.lasso],
|
|
131
|
+
isMetaKey: false,
|
|
132
|
+
isShiftKey: false,
|
|
133
|
+
}, }) => {
|
|
94
134
|
const { gesture, setGesture, interactionMode } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
|
|
95
|
-
useRegisterKeyboardGestureSwitcher(['lasso']);
|
|
96
|
-
return ((0, jsx_runtime_1.jsx)(exports.GroupButton, { isDisabled: interactionMode !== 'select' || setGesture === undefined, isActive: gesture === 'lasso', ariaLabel: "Lasso Select Button", description:
|
|
135
|
+
useRegisterKeyboardGestureSwitcher([{ gesture: 'lasso', shortcutKey }]);
|
|
136
|
+
return ((0, jsx_runtime_1.jsx)(exports.GroupButton, { isDisabled: interactionMode !== 'select' || setGesture === undefined, isActive: gesture === 'lasso', ariaLabel: "Lasso Select Button", description: "Lasso Select", descriptionKbdProps: {
|
|
137
|
+
keys: shortcutKey.keys,
|
|
138
|
+
modifierKeys: getShortcutModifierKeys(shortcutKey),
|
|
139
|
+
}, onClick: () => {
|
|
97
140
|
setGesture === null || setGesture === void 0 ? void 0 : setGesture('lasso');
|
|
98
141
|
}, tooltipPlacement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'right', htmlAttributes: Object.assign({ 'data-testid': 'gesture-lasso-select' }, htmlAttributes), className: className, style: style, children: (0, jsx_runtime_1.jsx)(icons_1.LassoIcon, { "aria-label": "Lasso select" }) }));
|
|
99
142
|
};
|
|
@@ -247,14 +290,29 @@ exports.LayoutSelectButton = LayoutSelectButton;
|
|
|
247
290
|
const DEFAULT_GESTURE_OPTIONS = {
|
|
248
291
|
single: {
|
|
249
292
|
icon: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}),
|
|
293
|
+
shortcutKey: {
|
|
294
|
+
keys: [GESTURE_KEYS_DEFAULT.single],
|
|
295
|
+
isMetaKey: false,
|
|
296
|
+
isShiftKey: false,
|
|
297
|
+
},
|
|
250
298
|
title: 'Individual',
|
|
251
299
|
},
|
|
252
300
|
box: {
|
|
253
301
|
icon: (0, jsx_runtime_1.jsx)(icons_1.SquareDashIcon, {}),
|
|
302
|
+
shortcutKey: {
|
|
303
|
+
keys: [GESTURE_KEYS_DEFAULT.box],
|
|
304
|
+
isMetaKey: false,
|
|
305
|
+
isShiftKey: false,
|
|
306
|
+
},
|
|
254
307
|
title: 'Box',
|
|
255
308
|
},
|
|
256
309
|
lasso: {
|
|
257
310
|
icon: (0, jsx_runtime_1.jsx)(icons_1.LassoIcon, {}),
|
|
311
|
+
shortcutKey: {
|
|
312
|
+
keys: [GESTURE_KEYS_DEFAULT.lasso],
|
|
313
|
+
isMetaKey: false,
|
|
314
|
+
isShiftKey: false,
|
|
315
|
+
},
|
|
258
316
|
title: 'Lasso',
|
|
259
317
|
},
|
|
260
318
|
};
|
|
@@ -263,10 +321,17 @@ const GestureSelectButton = ({ className, style, htmlAttributes, tooltipPlacemen
|
|
|
263
321
|
const anchorRef = (0, react_2.useRef)(null);
|
|
264
322
|
const [isMenuOpen, setIsMenuOpen] = (0, react_2.useState)(false);
|
|
265
323
|
const { gesture, setGesture, portalTarget } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
|
|
266
|
-
useRegisterKeyboardGestureSwitcher(Object.
|
|
324
|
+
useRegisterKeyboardGestureSwitcher(Object.entries(gestureOptions).map(([gesture, item]) => ({
|
|
325
|
+
gesture: gesture,
|
|
326
|
+
shortcutKey: item.shortcutKey,
|
|
327
|
+
})));
|
|
328
|
+
const gestureIcon = (_b = (_a = gestureOptions[gesture]) === null || _a === void 0 ? void 0 : _a.icon) !== null && _b !== void 0 ? _b : GESTURE_KEYS_DEFAULT_ICONS[gesture];
|
|
267
329
|
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select gesture", isOpen: isMenuOpen, onClick: () => setIsMenuOpen((old) => !old), ref: anchorRef, className: className, style: style, htmlAttributes: htmlAttributes, size: "small", tooltipProps: {
|
|
268
330
|
root: { isPortaled: false, placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
269
|
-
}, children:
|
|
331
|
+
}, children: gestureOptions[gesture] ? gestureIcon : (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Menu, { isOpen: isMenuOpen, anchorRef: anchorRef, onClose: () => setIsMenuOpen(false), placement: menuPlacement, portalTarget: portalTarget, children: Object.entries(gestureOptions).map(([key, item]) => {
|
|
332
|
+
var _a, _b;
|
|
333
|
+
return ((0, jsx_runtime_1.jsx)(react_1.Menu.RadioItem, { title: (_a = item.title) !== null && _a !== void 0 ? _a : GESTURE_KEYS_DEFAULT_TITLES[key], leadingVisual: item.icon, trailingContent: (0, jsx_runtime_1.jsx)(react_1.Kbd, { keys: (_b = item.shortcutKey) === null || _b === void 0 ? void 0 : _b.keys, modifierKeys: getShortcutModifierKeys(item.shortcutKey) }), isChecked: key === gesture, onClick: () => setGesture === null || setGesture === void 0 ? void 0 : setGesture(key) }, key));
|
|
334
|
+
}) })] }));
|
|
270
335
|
};
|
|
271
336
|
exports.GestureSelectButton = GestureSelectButton;
|
|
272
337
|
//# sourceMappingURL=graph-visualization-buttons.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"graph-visualization-buttons.js","sourceRoot":"","sources":["../../src/graph-visualization-buttons.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport {\n CleanIconButton,\n IconButton,\n Kbd,\n Menu,\n SelectIconButton,\n TextInput,\n type Tooltip,\n} from '@neo4j-ndl/react';\nimport {\n ArrowDownTrayIconOutline,\n DocumentTextIconOutline,\n ExploreIcon,\n FitToScreenIcon,\n HierarchyTwoIcon,\n LassoIcon,\n MagnifyingGlassIconOutline,\n MagnifyingGlassMinusIconOutline,\n MagnifyingGlassPlusIconOutline,\n SelectIcon,\n SquareDashIcon,\n XMarkIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { type Layout } from '@neo4j-nvl/base';\nimport { default as cx } from 'classnames';\nimport {\n type PropsWithChildren,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nimport {\n type Gesture,\n useGraphVisualizationContext,\n} from './graph-visualization-context';\nimport { useSemicontrolledState } from './use-semi-controlled-state';\nimport { searchNodes, searchRels } from './utils';\n\ntype GraphVisualizationButtonProps = {\n tooltipPlacement?: React.ComponentProps<typeof Tooltip>['placement'];\n className?: string;\n /**\n * Additional css styling. Will be applied to the root element.\n */\n style?: React.CSSProperties;\n\n /**\n * Html attributes to apply to the root element. This will override any default html attributes, use with caution.\n */\n htmlAttributes?: React.ComponentPropsWithRef<\n typeof CleanIconButton\n >['htmlAttributes'];\n\n /**\n * A ref to apply to the root element.\n */\n ref?: React.ComponentPropsWithRef<'button'>['ref'];\n};\n\ntype BaseProperties = GraphVisualizationButtonProps & {\n description: string;\n testid?: string;\n ariaLabel?: string;\n isActive?: boolean;\n isDisabled?: boolean;\n onClick?: () => void;\n onMouseDown?: () => void;\n};\n\nexport type GraphVisualizationGroupButton = PropsWithChildren<BaseProperties>;\n\nexport const GroupButton = (props: GraphVisualizationGroupButton) => {\n const {\n isActive,\n ariaLabel,\n isDisabled,\n description,\n onClick,\n onMouseDown,\n tooltipPlacement,\n className,\n style,\n htmlAttributes,\n children,\n } = props;\n return (\n <CleanIconButton\n description={description ?? ariaLabel}\n tooltipProps={{\n content: { style: { whiteSpace: 'nowrap' } },\n root: { isPortaled: false, placement: tooltipPlacement },\n }}\n size=\"small\"\n className={className}\n style={style}\n isActive={isActive}\n isDisabled={isDisabled}\n onClick={onClick}\n htmlAttributes={{\n onMouseDown,\n ...htmlAttributes,\n }}\n >\n {children}\n </CleanIconButton>\n );\n};\n\nconst targetIsTextInput = (target: EventTarget | null): boolean => {\n if (!(target instanceof HTMLElement)) {\n return false;\n }\n return (\n target.isContentEditable || ['INPUT', 'TEXTAREA'].includes(target.tagName)\n );\n};\n\nconst isEditingText = (e: KeyboardEvent): boolean => {\n return targetIsTextInput(e.target);\n};\n\nconst GESTURE_KEYS: Record<Gesture, string> = {\n box: 'B',\n lasso: 'L',\n single: 'S',\n};\n\nconst useRegisterKeyboardGestureSwitcher = (gestures: Gesture[]) => {\n const { setGesture } = useGraphVisualizationContext();\n const handleKeyDown = useCallback(\n (evt: KeyboardEvent) => {\n if (!isEditingText(evt) && setGesture !== undefined) {\n const upperKey = evt.key.toUpperCase();\n for (const gesture of gestures) {\n if (upperKey === GESTURE_KEYS[gesture]) {\n setGesture(gesture);\n }\n }\n }\n },\n [gestures, setGesture],\n );\n\n useEffect(() => {\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [handleKeyDown]);\n};\n\nconst NON_BREAKING_SPACE = '\\u00A0';\n\nexport const SingleSelectButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { gesture, setGesture, interactionMode } =\n useGraphVisualizationContext();\n useRegisterKeyboardGestureSwitcher(['single']);\n\n return (\n <GroupButton\n isActive={gesture === 'single'}\n isDisabled={interactionMode !== 'select'}\n ariaLabel=\"Individual Select Button\"\n description={`Individual Select ${NON_BREAKING_SPACE} ${GESTURE_KEYS.single}`}\n onClick={() => {\n setGesture?.('single');\n }}\n tooltipPlacement={tooltipPlacement ?? 'right'}\n htmlAttributes={{\n 'data-testid': 'gesture-individual-select',\n ...htmlAttributes,\n }}\n className={className}\n style={style}\n >\n <SelectIcon aria-label=\"Individual Select\" />\n </GroupButton>\n );\n};\n\nexport const BoxSelectButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { gesture, setGesture, interactionMode } =\n useGraphVisualizationContext();\n useRegisterKeyboardGestureSwitcher(['box']);\n\n return (\n <GroupButton\n isDisabled={interactionMode !== 'select' || setGesture === undefined}\n isActive={gesture === 'box'}\n ariaLabel=\"Box Select Button\"\n description={`Box Select ${NON_BREAKING_SPACE} ${GESTURE_KEYS.box}`}\n onClick={() => {\n setGesture?.('box');\n }}\n tooltipPlacement={tooltipPlacement ?? 'right'}\n htmlAttributes={{\n 'data-testid': 'gesture-box-select',\n ...htmlAttributes,\n }}\n className={className}\n style={style}\n >\n <SquareDashIcon aria-label=\"Box select\" />\n </GroupButton>\n );\n};\n\nexport const LassoSelectButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { gesture, setGesture, interactionMode } =\n useGraphVisualizationContext();\n useRegisterKeyboardGestureSwitcher(['lasso']);\n\n return (\n <GroupButton\n isDisabled={interactionMode !== 'select' || setGesture === undefined}\n isActive={gesture === 'lasso'}\n ariaLabel=\"Lasso Select Button\"\n description={`Lasso Select ${NON_BREAKING_SPACE} ${GESTURE_KEYS.lasso}`}\n onClick={() => {\n setGesture?.('lasso');\n }}\n tooltipPlacement={tooltipPlacement ?? 'right'}\n htmlAttributes={{\n 'data-testid': 'gesture-lasso-select',\n ...htmlAttributes,\n }}\n className={className}\n style={style}\n >\n <LassoIcon aria-label=\"Lasso select\" />\n </GroupButton>\n );\n};\n\nexport const ZoomInButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { nvlInstance } = useGraphVisualizationContext();\n\n const handleZoomIn = useCallback(() => {\n nvlInstance.current?.setZoom(nvlInstance.current?.getScale() * 1.3);\n }, [nvlInstance]);\n\n return (\n <GroupButton\n onClick={handleZoomIn}\n description=\"Zoom in\"\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n tooltipPlacement={tooltipPlacement ?? 'left'}\n >\n <MagnifyingGlassPlusIconOutline />\n </GroupButton>\n );\n};\n\nexport const ZoomOutButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { nvlInstance } = useGraphVisualizationContext();\n\n const handleZoomOut = useCallback(() => {\n nvlInstance.current?.setZoom(nvlInstance.current?.getScale() * 0.7);\n }, [nvlInstance]);\n\n return (\n <GroupButton\n onClick={handleZoomOut}\n description=\"Zoom out\"\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n tooltipPlacement={tooltipPlacement ?? 'left'}\n >\n <MagnifyingGlassMinusIconOutline />\n </GroupButton>\n );\n};\n\nexport const ZoomToFitButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { nvlInstance } = useGraphVisualizationContext();\n\n const getNodesToFit = useCallback(() => {\n const instance = nvlInstance.current;\n if (!instance) {\n return [];\n }\n\n const selectedNodes = instance.getSelectedNodes();\n const selectedRels = instance.getSelectedRelationships();\n const nodeIds = new Set<string>();\n\n if (selectedNodes.length || selectedRels.length) {\n selectedNodes.forEach((n) => nodeIds.add(n.id));\n selectedRels.forEach((r) => nodeIds.add(r.from).add(r.to));\n return [...nodeIds];\n }\n\n const allNodes = instance.getNodes();\n const allRels = instance.getRelationships();\n\n allNodes.forEach((n) => n.disabled !== true && nodeIds.add(n.id));\n allRels.forEach(\n (r) => r.disabled !== true && nodeIds.add(r.from).add(r.to),\n );\n\n if (nodeIds.size > 0) {\n return [...nodeIds];\n }\n\n return allNodes.map((node) => node.id);\n }, [nvlInstance]);\n\n const handleZoomToFit = useCallback(() => {\n nvlInstance.current?.fit(getNodesToFit());\n }, [getNodesToFit, nvlInstance]);\n\n return (\n <GroupButton\n onClick={handleZoomToFit}\n description=\"Zoom to fit\"\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n tooltipPlacement={tooltipPlacement ?? 'left'}\n >\n <FitToScreenIcon />\n </GroupButton>\n );\n};\n\nexport const ToggleSidePanelButton = ({\n className,\n htmlAttributes,\n style,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { sidepanel } = useGraphVisualizationContext();\n if (!sidepanel) {\n throw new Error(\n 'Using the ToggleSidePanelButton requires having a sidepanel',\n );\n }\n const { isSidePanelOpen, setIsSidePanelOpen } = sidepanel;\n return (\n <IconButton\n size=\"small\"\n onClick={() => setIsSidePanelOpen?.(!isSidePanelOpen)}\n isFloating\n description=\"Details\"\n isActive={isSidePanelOpen}\n tooltipProps={{\n content: { style: { whiteSpace: 'nowrap' } },\n root: {\n isPortaled: false,\n placement: tooltipPlacement ?? 'bottom',\n shouldCloseOnReferenceClick: true,\n },\n }}\n className={cx('ndl-graph-visualization-toggle-sidepanel', className)}\n style={style}\n htmlAttributes={{\n 'aria-label': 'Toggle graph details panel',\n ...htmlAttributes,\n }}\n >\n <DocumentTextIconOutline className=\"ndl-graph-visualization-toggle-icon\" />\n </IconButton>\n );\n};\n\ntype SearchButtonProps = GraphVisualizationButtonProps & {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n open?: boolean;\n setOpen?: React.Dispatch<React.SetStateAction<boolean>>;\n searchTerm?: string;\n setSearchTerm?: React.Dispatch<React.SetStateAction<string>>;\n onSearch?: (\n nodeIds: string[] | undefined,\n relationshipIds: string[] | undefined,\n ) => void;\n};\n\nexport const SearchButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n open: rawOpen,\n setOpen: rawSetOpen,\n searchTerm: rawSearchTerm,\n setSearchTerm: rawSetSearchTerm,\n onSearch = () => {\n // no-op\n },\n}: SearchButtonProps) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const [isOpen, setIsOpen] = useSemicontrolledState({\n isControlled: rawOpen !== undefined,\n onChange: rawSetOpen,\n state: rawOpen ?? false,\n });\n const [searchTerm, setSearchTerm] = useSemicontrolledState({\n isControlled: rawSearchTerm !== undefined,\n onChange: rawSetSearchTerm,\n state: rawSearchTerm ?? '',\n });\n const { nvlGraph } = useGraphVisualizationContext();\n\n const handleSearchChange = (newValue: string) => {\n setSearchTerm(newValue);\n if (newValue === '') {\n onSearch(undefined, undefined);\n return;\n }\n\n onSearch(searchNodes(nvlGraph, newValue), searchRels(nvlGraph, newValue));\n };\n\n return (\n <>\n {isOpen ? (\n <TextInput\n ref={inputRef}\n size=\"small\"\n leadingElement={<MagnifyingGlassIconOutline />}\n trailingElement={\n <CleanIconButton\n onClick={() => {\n handleSearchChange('');\n inputRef.current?.focus();\n }}\n description=\"Clear search\"\n >\n <XMarkIconOutline />\n </CleanIconButton>\n }\n placeholder=\"Search...\"\n value={searchTerm}\n onChange={(e) => handleSearchChange(e.target.value)}\n htmlAttributes={{\n autoFocus: true,\n onBlur: () => {\n if (searchTerm === '') {\n setIsOpen(false);\n }\n },\n }}\n />\n ) : (\n <IconButton\n size=\"small\"\n isFloating\n onClick={() => setIsOpen((o) => !o)}\n description=\"Search\"\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n tooltipProps={{\n root: {\n isPortaled: false,\n placement: tooltipPlacement ?? 'bottom',\n },\n }}\n >\n <MagnifyingGlassIconOutline />\n </IconButton>\n )}\n </>\n );\n};\n\nexport const DownloadButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { nvlInstance, portalTarget } = useGraphVisualizationContext();\n\n const [isDownloadMenuOpen, setOpen] = useState(false);\n const closeFileMenu = () => setOpen(false);\n const downloadButtonRef = useRef<HTMLButtonElement>(null);\n return (\n <>\n <IconButton\n ref={downloadButtonRef}\n size=\"small\"\n isFloating\n onClick={() => setOpen((o) => !o)}\n description=\"Download\"\n tooltipProps={{\n root: { isPortaled: false, placement: tooltipPlacement ?? 'bottom' },\n }}\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n >\n <ArrowDownTrayIconOutline />\n </IconButton>\n\n <Menu\n isOpen={isDownloadMenuOpen}\n onClose={closeFileMenu}\n anchorRef={downloadButtonRef}\n portalTarget={portalTarget}\n >\n <Menu.Item\n title=\"Download as PNG\"\n onClick={() => {\n nvlInstance.current?.saveToFile({});\n closeFileMenu();\n }}\n />\n <Menu.Item\n title=\"Download as SVG\"\n onClick={() => {\n nvlInstance.current?.saveToSvg({});\n closeFileMenu();\n }}\n />\n </Menu>\n </>\n );\n};\n\nexport type LayoutSelectOption = Record<\n Layout,\n {\n icon: React.ReactNode;\n title: string;\n }\n>;\n\nconst DEFAULT_LAYOUT_OPTIONS: Partial<LayoutSelectOption> = {\n d3Force: {\n icon: <ExploreIcon />,\n title: 'Force-based layout',\n },\n hierarchical: {\n icon: <HierarchyTwoIcon />,\n title: 'Hierarchical layout',\n },\n};\n\nexport const LayoutSelectButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n menuPlacement,\n layoutOptions = DEFAULT_LAYOUT_OPTIONS,\n}: GraphVisualizationButtonProps & {\n menuPlacement?: React.ComponentProps<typeof Menu>['placement'];\n layoutOptions?: Partial<LayoutSelectOption>;\n}) => {\n const anchorRef = useRef<HTMLButtonElement | null>(null);\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n const { layout, setLayout, portalTarget } = useGraphVisualizationContext();\n\n return (\n <>\n <SelectIconButton\n description=\"Select layout\"\n isOpen={isMenuOpen}\n onClick={() => setIsMenuOpen((old) => !old)}\n ref={anchorRef}\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n size=\"small\"\n tooltipProps={{\n root: { isPortaled: false, placement: tooltipPlacement ?? 'bottom' },\n }}\n >\n {layoutOptions[layout]?.icon ?? <SelectIcon />}\n </SelectIconButton>\n <Menu\n isOpen={isMenuOpen}\n anchorRef={anchorRef}\n onClose={() => setIsMenuOpen(false)}\n placement={menuPlacement}\n portalTarget={portalTarget}\n >\n {Object.entries(layoutOptions).map(([key, item]) => (\n <Menu.RadioItem\n key={key}\n title={item.title}\n leadingVisual={item.icon}\n isChecked={key === layout}\n onClick={() => setLayout?.(key as Layout)}\n />\n ))}\n </Menu>\n </>\n );\n};\n\nexport type GestureSelectOption = Record<\n Gesture,\n {\n icon: React.ReactNode;\n title: string;\n }\n>;\n\n// oxlint-disable-next-line sort-keys\nconst DEFAULT_GESTURE_OPTIONS: Partial<GestureSelectOption> = {\n single: {\n icon: <SelectIcon />,\n title: 'Individual',\n },\n box: {\n icon: <SquareDashIcon />,\n title: 'Box',\n },\n lasso: {\n icon: <LassoIcon />,\n title: 'Lasso',\n },\n};\n\nexport const GestureSelectButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n menuPlacement,\n gestureOptions = DEFAULT_GESTURE_OPTIONS,\n}: GraphVisualizationButtonProps & {\n menuPlacement?: React.ComponentProps<typeof Menu>['placement'];\n gestureOptions?: Partial<GestureSelectOption>;\n}) => {\n const anchorRef = useRef<HTMLButtonElement | null>(null);\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n const { gesture, setGesture, portalTarget } = useGraphVisualizationContext();\n useRegisterKeyboardGestureSwitcher(Object.keys(gestureOptions) as Gesture[]);\n\n return (\n <>\n <SelectIconButton\n description=\"Select gesture\"\n isOpen={isMenuOpen}\n onClick={() => setIsMenuOpen((old) => !old)}\n ref={anchorRef}\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n size=\"small\"\n tooltipProps={{\n root: { isPortaled: false, placement: tooltipPlacement ?? 'bottom' },\n }}\n >\n {gestureOptions[gesture]?.icon ?? <SelectIcon />}\n </SelectIconButton>\n <Menu\n isOpen={isMenuOpen}\n anchorRef={anchorRef}\n onClose={() => setIsMenuOpen(false)}\n placement={menuPlacement}\n portalTarget={portalTarget}\n >\n {Object.entries(gestureOptions).map(([key, item]) => (\n <Menu.RadioItem\n key={key}\n title={item.title}\n leadingVisual={item.icon}\n trailingContent={<Kbd keys={[GESTURE_KEYS[key as Gesture]]} />}\n isChecked={key === gesture}\n onClick={() => setGesture?.(key as Gesture)}\n />\n ))}\n </Menu>\n </>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"graph-visualization-buttons.js","sourceRoot":"","sources":["../../src/graph-visualization-buttons.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport {\n CleanIconButton,\n IconButton,\n Kbd,\n Menu,\n SelectIconButton,\n TextInput,\n type Tooltip,\n} from '@neo4j-ndl/react';\nimport {\n ArrowDownTrayIconOutline,\n DocumentTextIconOutline,\n ExploreIcon,\n FitToScreenIcon,\n HierarchyTwoIcon,\n LassoIcon,\n MagnifyingGlassIconOutline,\n MagnifyingGlassMinusIconOutline,\n MagnifyingGlassPlusIconOutline,\n SelectIcon,\n SquareDashIcon,\n XMarkIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { type Layout } from '@neo4j-nvl/base';\nimport { default as cx } from 'classnames';\nimport type React from 'react';\nimport {\n type PropsWithChildren,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nimport {\n type Gesture,\n useGraphVisualizationContext,\n} from './graph-visualization-context';\nimport { useSemicontrolledState } from './use-semi-controlled-state';\nimport { searchNodes, searchRels } from './utils';\n\ntype GraphVisualizationButtonProps = {\n tooltipPlacement?: React.ComponentProps<typeof Tooltip>['placement'];\n className?: string;\n /**\n * Additional css styling. Will be applied to the root element.\n */\n style?: React.CSSProperties;\n\n /**\n * Html attributes to apply to the root element. This will override any default html attributes, use with caution.\n */\n htmlAttributes?: React.ComponentPropsWithRef<\n typeof CleanIconButton\n >['htmlAttributes'];\n\n /**\n * A ref to apply to the root element.\n */\n ref?: React.ComponentPropsWithRef<'button'>['ref'];\n shortcutKey?: {\n keys: string[];\n isMetaKey: boolean;\n isShiftKey: boolean;\n };\n};\n\ntype BaseProperties = GraphVisualizationButtonProps & {\n description: string;\n testid?: string;\n ariaLabel?: string;\n isActive?: boolean;\n isDisabled?: boolean;\n onClick?: () => void;\n onMouseDown?: () => void;\n descriptionKbdProps?: React.ComponentPropsWithRef<\n typeof CleanIconButton\n >['descriptionKbdProps'];\n};\n\nexport type GraphVisualizationGroupButton = PropsWithChildren<BaseProperties>;\n\nexport const GroupButton = (props: GraphVisualizationGroupButton) => {\n const {\n isActive,\n ariaLabel,\n isDisabled,\n description,\n onClick,\n onMouseDown,\n tooltipPlacement,\n className,\n style,\n htmlAttributes,\n children,\n descriptionKbdProps,\n } = props;\n return (\n <CleanIconButton\n description={description ?? ariaLabel}\n tooltipProps={{\n content: { style: { whiteSpace: 'nowrap' } },\n root: { isPortaled: false, placement: tooltipPlacement },\n }}\n size=\"small\"\n className={className}\n style={style}\n isActive={isActive}\n isDisabled={isDisabled}\n descriptionKbdProps={descriptionKbdProps}\n onClick={onClick}\n htmlAttributes={{\n onMouseDown,\n ...htmlAttributes,\n }}\n >\n {children}\n </CleanIconButton>\n );\n};\n\nconst targetIsTextInput = (target: EventTarget | null): boolean => {\n if (!(target instanceof HTMLElement)) {\n return false;\n }\n return (\n target.isContentEditable || ['INPUT', 'TEXTAREA'].includes(target.tagName)\n );\n};\n\nconst isEditingText = (e: KeyboardEvent): boolean => {\n return targetIsTextInput(e.target);\n};\n\nconst GESTURE_KEYS_DEFAULT: Record<Gesture, string> = {\n box: 'B',\n lasso: 'L',\n single: 'S',\n};\n\nconst GESTURE_KEYS_DEFAULT_ICONS: Record<Gesture, React.ReactNode> = {\n box: <SquareDashIcon />,\n lasso: <LassoIcon />,\n single: <SelectIcon />,\n};\n\nconst GESTURE_KEYS_DEFAULT_TITLES: Record<Gesture, string> = {\n box: 'Box',\n lasso: 'Lasso',\n single: 'Single',\n};\n\ntype ShortcutKey = NonNullable<GraphVisualizationButtonProps['shortcutKey']>;\n\nconst getShortcutModifierKeys = (\n shortcutKey: Pick<ShortcutKey, 'isMetaKey' | 'isShiftKey'> | undefined,\n): NonNullable<React.ComponentProps<typeof Kbd>['modifierKeys']> => [\n ...(shortcutKey?.isMetaKey ? (['meta'] as const) : []),\n ...(shortcutKey?.isShiftKey ? (['shift'] as const) : []),\n];\n\nconst isShortcutMatch = (\n evt: KeyboardEvent,\n shortcutKey: GraphVisualizationButtonProps['shortcutKey'],\n): boolean => {\n if (shortcutKey === undefined || shortcutKey.keys.length !== 1) {\n return false;\n }\n\n return (\n evt.key.toUpperCase() === shortcutKey.keys[0].toUpperCase() &&\n evt.metaKey === shortcutKey.isMetaKey &&\n evt.shiftKey === shortcutKey.isShiftKey &&\n !evt.altKey &&\n !evt.ctrlKey\n );\n};\n\nconst useRegisterKeyboardGestureSwitcher = (\n gestureShortcuts: ReadonlyArray<{\n gesture: Gesture;\n shortcutKey: GraphVisualizationButtonProps['shortcutKey'];\n }>,\n) => {\n const { setGesture } = useGraphVisualizationContext();\n const handleKeyDown = useCallback(\n (evt: KeyboardEvent) => {\n if (!isEditingText(evt) && setGesture !== undefined) {\n for (const { gesture, shortcutKey } of gestureShortcuts) {\n if (isShortcutMatch(evt, shortcutKey)) {\n setGesture(gesture);\n }\n }\n }\n },\n [gestureShortcuts, setGesture],\n );\n\n useEffect(() => {\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [handleKeyDown]);\n};\n\nexport const SingleSelectButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n shortcutKey = {\n keys: [GESTURE_KEYS_DEFAULT.single],\n isMetaKey: false,\n isShiftKey: false,\n },\n}: GraphVisualizationButtonProps) => {\n const { gesture, setGesture, interactionMode } =\n useGraphVisualizationContext();\n useRegisterKeyboardGestureSwitcher([{ gesture: 'single', shortcutKey }]);\n\n return (\n <GroupButton\n isActive={gesture === 'single'}\n isDisabled={interactionMode !== 'select'}\n ariaLabel=\"Individual Select Button\"\n description=\"Individual Select\"\n descriptionKbdProps={{\n keys: shortcutKey.keys,\n modifierKeys: getShortcutModifierKeys(shortcutKey),\n }}\n onClick={() => {\n setGesture?.('single');\n }}\n tooltipPlacement={tooltipPlacement ?? 'right'}\n htmlAttributes={{\n 'data-testid': 'gesture-individual-select',\n ...htmlAttributes,\n }}\n className={className}\n style={style}\n >\n <SelectIcon aria-label=\"Individual Select\" />\n </GroupButton>\n );\n};\n\nexport const BoxSelectButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n shortcutKey = {\n keys: [GESTURE_KEYS_DEFAULT.box],\n isMetaKey: false,\n isShiftKey: false,\n },\n}: GraphVisualizationButtonProps) => {\n const { gesture, setGesture, interactionMode } =\n useGraphVisualizationContext();\n useRegisterKeyboardGestureSwitcher([{ gesture: 'box', shortcutKey }]);\n\n return (\n <GroupButton\n isDisabled={interactionMode !== 'select' || setGesture === undefined}\n isActive={gesture === 'box'}\n ariaLabel=\"Box Select Button\"\n description=\"Box Select\"\n descriptionKbdProps={{\n keys: shortcutKey.keys,\n modifierKeys: getShortcutModifierKeys(shortcutKey),\n }}\n onClick={() => {\n setGesture?.('box');\n }}\n tooltipPlacement={tooltipPlacement ?? 'right'}\n htmlAttributes={{\n 'data-testid': 'gesture-box-select',\n ...htmlAttributes,\n }}\n className={className}\n style={style}\n >\n <SquareDashIcon aria-label=\"Box select\" />\n </GroupButton>\n );\n};\n\nexport const LassoSelectButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n shortcutKey = {\n keys: [GESTURE_KEYS_DEFAULT.lasso],\n isMetaKey: false,\n isShiftKey: false,\n },\n}: GraphVisualizationButtonProps) => {\n const { gesture, setGesture, interactionMode } =\n useGraphVisualizationContext();\n useRegisterKeyboardGestureSwitcher([{ gesture: 'lasso', shortcutKey }]);\n\n return (\n <GroupButton\n isDisabled={interactionMode !== 'select' || setGesture === undefined}\n isActive={gesture === 'lasso'}\n ariaLabel=\"Lasso Select Button\"\n description=\"Lasso Select\"\n descriptionKbdProps={{\n keys: shortcutKey.keys,\n modifierKeys: getShortcutModifierKeys(shortcutKey),\n }}\n onClick={() => {\n setGesture?.('lasso');\n }}\n tooltipPlacement={tooltipPlacement ?? 'right'}\n htmlAttributes={{\n 'data-testid': 'gesture-lasso-select',\n ...htmlAttributes,\n }}\n className={className}\n style={style}\n >\n <LassoIcon aria-label=\"Lasso select\" />\n </GroupButton>\n );\n};\n\nexport const ZoomInButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { nvlInstance } = useGraphVisualizationContext();\n\n const handleZoomIn = useCallback(() => {\n nvlInstance.current?.setZoom(nvlInstance.current?.getScale() * 1.3);\n }, [nvlInstance]);\n\n return (\n <GroupButton\n onClick={handleZoomIn}\n description=\"Zoom in\"\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n tooltipPlacement={tooltipPlacement ?? 'left'}\n >\n <MagnifyingGlassPlusIconOutline />\n </GroupButton>\n );\n};\n\nexport const ZoomOutButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { nvlInstance } = useGraphVisualizationContext();\n\n const handleZoomOut = useCallback(() => {\n nvlInstance.current?.setZoom(nvlInstance.current?.getScale() * 0.7);\n }, [nvlInstance]);\n\n return (\n <GroupButton\n onClick={handleZoomOut}\n description=\"Zoom out\"\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n tooltipPlacement={tooltipPlacement ?? 'left'}\n >\n <MagnifyingGlassMinusIconOutline />\n </GroupButton>\n );\n};\n\nexport const ZoomToFitButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { nvlInstance } = useGraphVisualizationContext();\n\n const getNodesToFit = useCallback(() => {\n const instance = nvlInstance.current;\n if (!instance) {\n return [];\n }\n\n const selectedNodes = instance.getSelectedNodes();\n const selectedRels = instance.getSelectedRelationships();\n const nodeIds = new Set<string>();\n\n if (selectedNodes.length || selectedRels.length) {\n selectedNodes.forEach((n) => nodeIds.add(n.id));\n selectedRels.forEach((r) => nodeIds.add(r.from).add(r.to));\n return [...nodeIds];\n }\n\n const allNodes = instance.getNodes();\n const allRels = instance.getRelationships();\n\n allNodes.forEach((n) => n.disabled !== true && nodeIds.add(n.id));\n allRels.forEach(\n (r) => r.disabled !== true && nodeIds.add(r.from).add(r.to),\n );\n\n if (nodeIds.size > 0) {\n return [...nodeIds];\n }\n\n return allNodes.map((node) => node.id);\n }, [nvlInstance]);\n\n const handleZoomToFit = useCallback(() => {\n nvlInstance.current?.fit(getNodesToFit());\n }, [getNodesToFit, nvlInstance]);\n\n return (\n <GroupButton\n onClick={handleZoomToFit}\n description=\"Zoom to fit\"\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n tooltipPlacement={tooltipPlacement ?? 'left'}\n >\n <FitToScreenIcon />\n </GroupButton>\n );\n};\n\nexport const ToggleSidePanelButton = ({\n className,\n htmlAttributes,\n style,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { sidepanel } = useGraphVisualizationContext();\n if (!sidepanel) {\n throw new Error(\n 'Using the ToggleSidePanelButton requires having a sidepanel',\n );\n }\n const { isSidePanelOpen, setIsSidePanelOpen } = sidepanel;\n return (\n <IconButton\n size=\"small\"\n onClick={() => setIsSidePanelOpen?.(!isSidePanelOpen)}\n isFloating\n description=\"Details\"\n isActive={isSidePanelOpen}\n tooltipProps={{\n content: { style: { whiteSpace: 'nowrap' } },\n root: {\n isPortaled: false,\n placement: tooltipPlacement ?? 'bottom',\n shouldCloseOnReferenceClick: true,\n },\n }}\n className={cx('ndl-graph-visualization-toggle-sidepanel', className)}\n style={style}\n htmlAttributes={{\n 'aria-label': 'Toggle graph details panel',\n ...htmlAttributes,\n }}\n >\n <DocumentTextIconOutline className=\"ndl-graph-visualization-toggle-icon\" />\n </IconButton>\n );\n};\n\ntype SearchButtonProps = GraphVisualizationButtonProps & {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n open?: boolean;\n setOpen?: React.Dispatch<React.SetStateAction<boolean>>;\n searchTerm?: string;\n setSearchTerm?: React.Dispatch<React.SetStateAction<string>>;\n onSearch?: (\n nodeIds: string[] | undefined,\n relationshipIds: string[] | undefined,\n ) => void;\n};\n\nexport const SearchButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n open: rawOpen,\n setOpen: rawSetOpen,\n searchTerm: rawSearchTerm,\n setSearchTerm: rawSetSearchTerm,\n onSearch = () => {\n // no-op\n },\n}: SearchButtonProps) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const [isOpen, setIsOpen] = useSemicontrolledState({\n isControlled: rawOpen !== undefined,\n onChange: rawSetOpen,\n state: rawOpen ?? false,\n });\n const [searchTerm, setSearchTerm] = useSemicontrolledState({\n isControlled: rawSearchTerm !== undefined,\n onChange: rawSetSearchTerm,\n state: rawSearchTerm ?? '',\n });\n const { nvlGraph } = useGraphVisualizationContext();\n\n const handleSearchChange = (newValue: string) => {\n setSearchTerm(newValue);\n if (newValue === '') {\n onSearch(undefined, undefined);\n return;\n }\n\n onSearch(searchNodes(nvlGraph, newValue), searchRels(nvlGraph, newValue));\n };\n\n return (\n <>\n {isOpen ? (\n <TextInput\n ref={inputRef}\n size=\"small\"\n leadingElement={<MagnifyingGlassIconOutline />}\n trailingElement={\n <CleanIconButton\n onClick={() => {\n handleSearchChange('');\n inputRef.current?.focus();\n }}\n description=\"Clear search\"\n >\n <XMarkIconOutline />\n </CleanIconButton>\n }\n placeholder=\"Search...\"\n value={searchTerm}\n onChange={(e) => handleSearchChange(e.target.value)}\n htmlAttributes={{\n autoFocus: true,\n onBlur: () => {\n if (searchTerm === '') {\n setIsOpen(false);\n }\n },\n }}\n />\n ) : (\n <IconButton\n size=\"small\"\n isFloating\n onClick={() => setIsOpen((o) => !o)}\n description=\"Search\"\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n tooltipProps={{\n root: {\n isPortaled: false,\n placement: tooltipPlacement ?? 'bottom',\n },\n }}\n >\n <MagnifyingGlassIconOutline />\n </IconButton>\n )}\n </>\n );\n};\n\nexport const DownloadButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n}: GraphVisualizationButtonProps) => {\n const { nvlInstance, portalTarget } = useGraphVisualizationContext();\n\n const [isDownloadMenuOpen, setOpen] = useState(false);\n const closeFileMenu = () => setOpen(false);\n const downloadButtonRef = useRef<HTMLButtonElement>(null);\n return (\n <>\n <IconButton\n ref={downloadButtonRef}\n size=\"small\"\n isFloating\n onClick={() => setOpen((o) => !o)}\n description=\"Download\"\n tooltipProps={{\n root: { isPortaled: false, placement: tooltipPlacement ?? 'bottom' },\n }}\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n >\n <ArrowDownTrayIconOutline />\n </IconButton>\n\n <Menu\n isOpen={isDownloadMenuOpen}\n onClose={closeFileMenu}\n anchorRef={downloadButtonRef}\n portalTarget={portalTarget}\n >\n <Menu.Item\n title=\"Download as PNG\"\n onClick={() => {\n nvlInstance.current?.saveToFile({});\n closeFileMenu();\n }}\n />\n <Menu.Item\n title=\"Download as SVG\"\n onClick={() => {\n nvlInstance.current?.saveToSvg({});\n closeFileMenu();\n }}\n />\n </Menu>\n </>\n );\n};\n\nexport type LayoutSelectOption = Record<\n Layout,\n {\n icon: React.ReactNode;\n title: string;\n }\n>;\n\nconst DEFAULT_LAYOUT_OPTIONS: Partial<LayoutSelectOption> = {\n d3Force: {\n icon: <ExploreIcon />,\n title: 'Force-based layout',\n },\n hierarchical: {\n icon: <HierarchyTwoIcon />,\n title: 'Hierarchical layout',\n },\n};\n\nexport const LayoutSelectButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n menuPlacement,\n layoutOptions = DEFAULT_LAYOUT_OPTIONS,\n}: GraphVisualizationButtonProps & {\n menuPlacement?: React.ComponentProps<typeof Menu>['placement'];\n layoutOptions?: Partial<LayoutSelectOption>;\n}) => {\n const anchorRef = useRef<HTMLButtonElement | null>(null);\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n const { layout, setLayout, portalTarget } = useGraphVisualizationContext();\n\n return (\n <>\n <SelectIconButton\n description=\"Select layout\"\n isOpen={isMenuOpen}\n onClick={() => setIsMenuOpen((old) => !old)}\n ref={anchorRef}\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n size=\"small\"\n tooltipProps={{\n root: { isPortaled: false, placement: tooltipPlacement ?? 'bottom' },\n }}\n >\n {layoutOptions[layout]?.icon ?? <SelectIcon />}\n </SelectIconButton>\n <Menu\n isOpen={isMenuOpen}\n anchorRef={anchorRef}\n onClose={() => setIsMenuOpen(false)}\n placement={menuPlacement}\n portalTarget={portalTarget}\n >\n {Object.entries(layoutOptions).map(([key, item]) => (\n <Menu.RadioItem\n key={key}\n title={item.title}\n leadingVisual={item.icon}\n isChecked={key === layout}\n onClick={() => setLayout?.(key as Layout)}\n />\n ))}\n </Menu>\n </>\n );\n};\n\nexport type GestureSelectOption = Record<\n Gesture,\n {\n icon?: React.ReactNode;\n title?: string;\n shortcutKey?: GraphVisualizationButtonProps['shortcutKey'];\n }\n>;\n\n// oxlint-disable-next-line sort-keys\nconst DEFAULT_GESTURE_OPTIONS: Partial<GestureSelectOption> = {\n single: {\n icon: <SelectIcon />,\n shortcutKey: {\n keys: [GESTURE_KEYS_DEFAULT.single],\n isMetaKey: false,\n isShiftKey: false,\n },\n title: 'Individual',\n },\n box: {\n icon: <SquareDashIcon />,\n shortcutKey: {\n keys: [GESTURE_KEYS_DEFAULT.box],\n isMetaKey: false,\n isShiftKey: false,\n },\n title: 'Box',\n },\n lasso: {\n icon: <LassoIcon />,\n shortcutKey: {\n keys: [GESTURE_KEYS_DEFAULT.lasso],\n isMetaKey: false,\n isShiftKey: false,\n },\n title: 'Lasso',\n },\n};\n\nexport const GestureSelectButton = ({\n className,\n style,\n htmlAttributes,\n tooltipPlacement,\n menuPlacement,\n gestureOptions = DEFAULT_GESTURE_OPTIONS,\n}: GraphVisualizationButtonProps & {\n menuPlacement?: React.ComponentProps<typeof Menu>['placement'];\n gestureOptions?: Partial<GestureSelectOption>;\n}) => {\n const anchorRef = useRef<HTMLButtonElement | null>(null);\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n const { gesture, setGesture, portalTarget } = useGraphVisualizationContext();\n useRegisterKeyboardGestureSwitcher(\n Object.entries(gestureOptions).map(([gesture, item]) => ({\n gesture: gesture as Gesture,\n shortcutKey: item.shortcutKey,\n })),\n );\n\n const gestureIcon =\n gestureOptions[gesture]?.icon ?? GESTURE_KEYS_DEFAULT_ICONS[gesture];\n return (\n <>\n <SelectIconButton\n description=\"Select gesture\"\n isOpen={isMenuOpen}\n onClick={() => setIsMenuOpen((old) => !old)}\n ref={anchorRef}\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n size=\"small\"\n tooltipProps={{\n root: { isPortaled: false, placement: tooltipPlacement ?? 'bottom' },\n }}\n >\n {gestureOptions[gesture] ? gestureIcon : <SelectIcon />}\n </SelectIconButton>\n <Menu\n isOpen={isMenuOpen}\n anchorRef={anchorRef}\n onClose={() => setIsMenuOpen(false)}\n placement={menuPlacement}\n portalTarget={portalTarget}\n >\n {Object.entries(gestureOptions).map(([key, item]) => (\n <Menu.RadioItem\n key={key}\n title={item.title ?? GESTURE_KEYS_DEFAULT_TITLES[key as Gesture]}\n leadingVisual={item.icon}\n trailingContent={\n <Kbd\n keys={item.shortcutKey?.keys}\n modifierKeys={getShortcutModifierKeys(item.shortcutKey)}\n />\n }\n isChecked={key === gesture}\n onClick={() => setGesture?.(key as Gesture)}\n />\n ))}\n </Menu>\n </>\n );\n};\n"]}
|
|
@@ -27,11 +27,11 @@ import { useGraphVisualizationContext, } from './graph-visualization-context';
|
|
|
27
27
|
import { useSemicontrolledState } from './use-semi-controlled-state';
|
|
28
28
|
import { searchNodes, searchRels } from './utils';
|
|
29
29
|
export const GroupButton = (props) => {
|
|
30
|
-
const { isActive, ariaLabel, isDisabled, description, onClick, onMouseDown, tooltipPlacement, className, style, htmlAttributes, children, } = props;
|
|
30
|
+
const { isActive, ariaLabel, isDisabled, description, onClick, onMouseDown, tooltipPlacement, className, style, htmlAttributes, children, descriptionKbdProps, } = props;
|
|
31
31
|
return (_jsx(CleanIconButton, { description: description !== null && description !== void 0 ? description : ariaLabel, tooltipProps: {
|
|
32
32
|
content: { style: { whiteSpace: 'nowrap' } },
|
|
33
33
|
root: { isPortaled: false, placement: tooltipPlacement },
|
|
34
|
-
}, size: "small", className: className, style: style, isActive: isActive, isDisabled: isDisabled, onClick: onClick, htmlAttributes: Object.assign({ onMouseDown }, htmlAttributes), children: children }));
|
|
34
|
+
}, size: "small", className: className, style: style, isActive: isActive, isDisabled: isDisabled, descriptionKbdProps: descriptionKbdProps, onClick: onClick, htmlAttributes: Object.assign({ onMouseDown }, htmlAttributes), children: children }));
|
|
35
35
|
};
|
|
36
36
|
const targetIsTextInput = (target) => {
|
|
37
37
|
if (!(target instanceof HTMLElement)) {
|
|
@@ -42,23 +42,46 @@ const targetIsTextInput = (target) => {
|
|
|
42
42
|
const isEditingText = (e) => {
|
|
43
43
|
return targetIsTextInput(e.target);
|
|
44
44
|
};
|
|
45
|
-
const
|
|
45
|
+
const GESTURE_KEYS_DEFAULT = {
|
|
46
46
|
box: 'B',
|
|
47
47
|
lasso: 'L',
|
|
48
48
|
single: 'S',
|
|
49
49
|
};
|
|
50
|
-
const
|
|
50
|
+
const GESTURE_KEYS_DEFAULT_ICONS = {
|
|
51
|
+
box: _jsx(SquareDashIcon, {}),
|
|
52
|
+
lasso: _jsx(LassoIcon, {}),
|
|
53
|
+
single: _jsx(SelectIcon, {}),
|
|
54
|
+
};
|
|
55
|
+
const GESTURE_KEYS_DEFAULT_TITLES = {
|
|
56
|
+
box: 'Box',
|
|
57
|
+
lasso: 'Lasso',
|
|
58
|
+
single: 'Single',
|
|
59
|
+
};
|
|
60
|
+
const getShortcutModifierKeys = (shortcutKey) => [
|
|
61
|
+
...((shortcutKey === null || shortcutKey === void 0 ? void 0 : shortcutKey.isMetaKey) ? ['meta'] : []),
|
|
62
|
+
...((shortcutKey === null || shortcutKey === void 0 ? void 0 : shortcutKey.isShiftKey) ? ['shift'] : []),
|
|
63
|
+
];
|
|
64
|
+
const isShortcutMatch = (evt, shortcutKey) => {
|
|
65
|
+
if (shortcutKey === undefined || shortcutKey.keys.length !== 1) {
|
|
66
|
+
return false;
|
|
67
|
+
}
|
|
68
|
+
return (evt.key.toUpperCase() === shortcutKey.keys[0].toUpperCase() &&
|
|
69
|
+
evt.metaKey === shortcutKey.isMetaKey &&
|
|
70
|
+
evt.shiftKey === shortcutKey.isShiftKey &&
|
|
71
|
+
!evt.altKey &&
|
|
72
|
+
!evt.ctrlKey);
|
|
73
|
+
};
|
|
74
|
+
const useRegisterKeyboardGestureSwitcher = (gestureShortcuts) => {
|
|
51
75
|
const { setGesture } = useGraphVisualizationContext();
|
|
52
76
|
const handleKeyDown = useCallback((evt) => {
|
|
53
77
|
if (!isEditingText(evt) && setGesture !== undefined) {
|
|
54
|
-
const
|
|
55
|
-
|
|
56
|
-
if (upperKey === GESTURE_KEYS[gesture]) {
|
|
78
|
+
for (const { gesture, shortcutKey } of gestureShortcuts) {
|
|
79
|
+
if (isShortcutMatch(evt, shortcutKey)) {
|
|
57
80
|
setGesture(gesture);
|
|
58
81
|
}
|
|
59
82
|
}
|
|
60
83
|
}
|
|
61
|
-
}, [
|
|
84
|
+
}, [gestureShortcuts, setGesture]);
|
|
62
85
|
useEffect(() => {
|
|
63
86
|
document.addEventListener('keydown', handleKeyDown);
|
|
64
87
|
return () => {
|
|
@@ -66,25 +89,45 @@ const useRegisterKeyboardGestureSwitcher = (gestures) => {
|
|
|
66
89
|
};
|
|
67
90
|
}, [handleKeyDown]);
|
|
68
91
|
};
|
|
69
|
-
const
|
|
70
|
-
|
|
92
|
+
export const SingleSelectButton = ({ className, style, htmlAttributes, tooltipPlacement, shortcutKey = {
|
|
93
|
+
keys: [GESTURE_KEYS_DEFAULT.single],
|
|
94
|
+
isMetaKey: false,
|
|
95
|
+
isShiftKey: false,
|
|
96
|
+
}, }) => {
|
|
71
97
|
const { gesture, setGesture, interactionMode } = useGraphVisualizationContext();
|
|
72
|
-
useRegisterKeyboardGestureSwitcher(['single']);
|
|
73
|
-
return (_jsx(GroupButton, { isActive: gesture === 'single', isDisabled: interactionMode !== 'select', ariaLabel: "Individual Select Button", description:
|
|
98
|
+
useRegisterKeyboardGestureSwitcher([{ gesture: 'single', shortcutKey }]);
|
|
99
|
+
return (_jsx(GroupButton, { isActive: gesture === 'single', isDisabled: interactionMode !== 'select', ariaLabel: "Individual Select Button", description: "Individual Select", descriptionKbdProps: {
|
|
100
|
+
keys: shortcutKey.keys,
|
|
101
|
+
modifierKeys: getShortcutModifierKeys(shortcutKey),
|
|
102
|
+
}, onClick: () => {
|
|
74
103
|
setGesture === null || setGesture === void 0 ? void 0 : setGesture('single');
|
|
75
104
|
}, tooltipPlacement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'right', htmlAttributes: Object.assign({ 'data-testid': 'gesture-individual-select' }, htmlAttributes), className: className, style: style, children: _jsx(SelectIcon, { "aria-label": "Individual Select" }) }));
|
|
76
105
|
};
|
|
77
|
-
export const BoxSelectButton = ({ className, style, htmlAttributes, tooltipPlacement,
|
|
106
|
+
export const BoxSelectButton = ({ className, style, htmlAttributes, tooltipPlacement, shortcutKey = {
|
|
107
|
+
keys: [GESTURE_KEYS_DEFAULT.box],
|
|
108
|
+
isMetaKey: false,
|
|
109
|
+
isShiftKey: false,
|
|
110
|
+
}, }) => {
|
|
78
111
|
const { gesture, setGesture, interactionMode } = useGraphVisualizationContext();
|
|
79
|
-
useRegisterKeyboardGestureSwitcher(['box']);
|
|
80
|
-
return (_jsx(GroupButton, { isDisabled: interactionMode !== 'select' || setGesture === undefined, isActive: gesture === 'box', ariaLabel: "Box Select Button", description:
|
|
112
|
+
useRegisterKeyboardGestureSwitcher([{ gesture: 'box', shortcutKey }]);
|
|
113
|
+
return (_jsx(GroupButton, { isDisabled: interactionMode !== 'select' || setGesture === undefined, isActive: gesture === 'box', ariaLabel: "Box Select Button", description: "Box Select", descriptionKbdProps: {
|
|
114
|
+
keys: shortcutKey.keys,
|
|
115
|
+
modifierKeys: getShortcutModifierKeys(shortcutKey),
|
|
116
|
+
}, onClick: () => {
|
|
81
117
|
setGesture === null || setGesture === void 0 ? void 0 : setGesture('box');
|
|
82
118
|
}, tooltipPlacement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'right', htmlAttributes: Object.assign({ 'data-testid': 'gesture-box-select' }, htmlAttributes), className: className, style: style, children: _jsx(SquareDashIcon, { "aria-label": "Box select" }) }));
|
|
83
119
|
};
|
|
84
|
-
export const LassoSelectButton = ({ className, style, htmlAttributes, tooltipPlacement,
|
|
120
|
+
export const LassoSelectButton = ({ className, style, htmlAttributes, tooltipPlacement, shortcutKey = {
|
|
121
|
+
keys: [GESTURE_KEYS_DEFAULT.lasso],
|
|
122
|
+
isMetaKey: false,
|
|
123
|
+
isShiftKey: false,
|
|
124
|
+
}, }) => {
|
|
85
125
|
const { gesture, setGesture, interactionMode } = useGraphVisualizationContext();
|
|
86
|
-
useRegisterKeyboardGestureSwitcher(['lasso']);
|
|
87
|
-
return (_jsx(GroupButton, { isDisabled: interactionMode !== 'select' || setGesture === undefined, isActive: gesture === 'lasso', ariaLabel: "Lasso Select Button", description:
|
|
126
|
+
useRegisterKeyboardGestureSwitcher([{ gesture: 'lasso', shortcutKey }]);
|
|
127
|
+
return (_jsx(GroupButton, { isDisabled: interactionMode !== 'select' || setGesture === undefined, isActive: gesture === 'lasso', ariaLabel: "Lasso Select Button", description: "Lasso Select", descriptionKbdProps: {
|
|
128
|
+
keys: shortcutKey.keys,
|
|
129
|
+
modifierKeys: getShortcutModifierKeys(shortcutKey),
|
|
130
|
+
}, onClick: () => {
|
|
88
131
|
setGesture === null || setGesture === void 0 ? void 0 : setGesture('lasso');
|
|
89
132
|
}, tooltipPlacement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'right', htmlAttributes: Object.assign({ 'data-testid': 'gesture-lasso-select' }, htmlAttributes), className: className, style: style, children: _jsx(LassoIcon, { "aria-label": "Lasso select" }) }));
|
|
90
133
|
};
|
|
@@ -230,14 +273,29 @@ export const LayoutSelectButton = ({ className, style, htmlAttributes, tooltipPl
|
|
|
230
273
|
const DEFAULT_GESTURE_OPTIONS = {
|
|
231
274
|
single: {
|
|
232
275
|
icon: _jsx(SelectIcon, {}),
|
|
276
|
+
shortcutKey: {
|
|
277
|
+
keys: [GESTURE_KEYS_DEFAULT.single],
|
|
278
|
+
isMetaKey: false,
|
|
279
|
+
isShiftKey: false,
|
|
280
|
+
},
|
|
233
281
|
title: 'Individual',
|
|
234
282
|
},
|
|
235
283
|
box: {
|
|
236
284
|
icon: _jsx(SquareDashIcon, {}),
|
|
285
|
+
shortcutKey: {
|
|
286
|
+
keys: [GESTURE_KEYS_DEFAULT.box],
|
|
287
|
+
isMetaKey: false,
|
|
288
|
+
isShiftKey: false,
|
|
289
|
+
},
|
|
237
290
|
title: 'Box',
|
|
238
291
|
},
|
|
239
292
|
lasso: {
|
|
240
293
|
icon: _jsx(LassoIcon, {}),
|
|
294
|
+
shortcutKey: {
|
|
295
|
+
keys: [GESTURE_KEYS_DEFAULT.lasso],
|
|
296
|
+
isMetaKey: false,
|
|
297
|
+
isShiftKey: false,
|
|
298
|
+
},
|
|
241
299
|
title: 'Lasso',
|
|
242
300
|
},
|
|
243
301
|
};
|
|
@@ -246,9 +304,16 @@ export const GestureSelectButton = ({ className, style, htmlAttributes, tooltipP
|
|
|
246
304
|
const anchorRef = useRef(null);
|
|
247
305
|
const [isMenuOpen, setIsMenuOpen] = useState(false);
|
|
248
306
|
const { gesture, setGesture, portalTarget } = useGraphVisualizationContext();
|
|
249
|
-
useRegisterKeyboardGestureSwitcher(Object.
|
|
307
|
+
useRegisterKeyboardGestureSwitcher(Object.entries(gestureOptions).map(([gesture, item]) => ({
|
|
308
|
+
gesture: gesture,
|
|
309
|
+
shortcutKey: item.shortcutKey,
|
|
310
|
+
})));
|
|
311
|
+
const gestureIcon = (_b = (_a = gestureOptions[gesture]) === null || _a === void 0 ? void 0 : _a.icon) !== null && _b !== void 0 ? _b : GESTURE_KEYS_DEFAULT_ICONS[gesture];
|
|
250
312
|
return (_jsxs(_Fragment, { children: [_jsx(SelectIconButton, { description: "Select gesture", isOpen: isMenuOpen, onClick: () => setIsMenuOpen((old) => !old), ref: anchorRef, className: className, style: style, htmlAttributes: htmlAttributes, size: "small", tooltipProps: {
|
|
251
313
|
root: { isPortaled: false, placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
252
|
-
}, children:
|
|
314
|
+
}, children: gestureOptions[gesture] ? gestureIcon : _jsx(SelectIcon, {}) }), _jsx(Menu, { isOpen: isMenuOpen, anchorRef: anchorRef, onClose: () => setIsMenuOpen(false), placement: menuPlacement, portalTarget: portalTarget, children: Object.entries(gestureOptions).map(([key, item]) => {
|
|
315
|
+
var _a, _b;
|
|
316
|
+
return (_jsx(Menu.RadioItem, { title: (_a = item.title) !== null && _a !== void 0 ? _a : GESTURE_KEYS_DEFAULT_TITLES[key], leadingVisual: item.icon, trailingContent: _jsx(Kbd, { keys: (_b = item.shortcutKey) === null || _b === void 0 ? void 0 : _b.keys, modifierKeys: getShortcutModifierKeys(item.shortcutKey) }), isChecked: key === gesture, onClick: () => setGesture === null || setGesture === void 0 ? void 0 : setGesture(key) }, key));
|
|
317
|
+
}) })] }));
|
|
253
318
|
};
|
|
254
319
|
//# sourceMappingURL=graph-visualization-buttons.js.map
|