@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.
Files changed (99) hide show
  1. package/lib/cjs/graph-visualization-buttons.js +85 -20
  2. package/lib/cjs/graph-visualization-buttons.js.map +1 -1
  3. package/lib/esm/graph-visualization-buttons.js +85 -20
  4. package/lib/esm/graph-visualization-buttons.js.map +1 -1
  5. package/lib/types/graph-visualization-buttons.d.ts +13 -5
  6. package/lib/types/graph-visualization-buttons.d.ts.map +1 -1
  7. package/lib/types/graph-visualization.d.ts +58 -3
  8. package/lib/types/graph-visualization.d.ts.map +1 -1
  9. package/package.json +1 -1
  10. package/lib/cjs/stories/graph-visualization-barebones.story.js +0 -93
  11. package/lib/cjs/stories/graph-visualization-barebones.story.js.map +0 -1
  12. package/lib/cjs/stories/graph-visualization-custom.story.js +0 -77
  13. package/lib/cjs/stories/graph-visualization-custom.story.js.map +0 -1
  14. package/lib/cjs/stories/graph-visualization-default.story.js +0 -93
  15. package/lib/cjs/stories/graph-visualization-default.story.js.map +0 -1
  16. package/lib/cjs/stories/graph-visualization-highlighting.story.js +0 -30
  17. package/lib/cjs/stories/graph-visualization-highlighting.story.js.map +0 -1
  18. package/lib/cjs/stories/graph-visualization-maximalist.story.js +0 -107
  19. package/lib/cjs/stories/graph-visualization-maximalist.story.js.map +0 -1
  20. package/lib/cjs/stories/graph-visualization-range-styling.story.js +0 -100
  21. package/lib/cjs/stories/graph-visualization-range-styling.story.js.map +0 -1
  22. package/lib/cjs/stories/graph-visualization-rule-based-styling-advanced.story.js +0 -270
  23. package/lib/cjs/stories/graph-visualization-rule-based-styling-advanced.story.js.map +0 -1
  24. package/lib/cjs/stories/graph-visualization-rule-based-styling-datetime.story.js +0 -181
  25. package/lib/cjs/stories/graph-visualization-rule-based-styling-datetime.story.js.map +0 -1
  26. package/lib/cjs/stories/graph-visualization-rule-based-styling.story.js +0 -81
  27. package/lib/cjs/stories/graph-visualization-rule-based-styling.story.js.map +0 -1
  28. package/lib/cjs/stories/graph-visualization-search.story.js +0 -36
  29. package/lib/cjs/stories/graph-visualization-search.story.js.map +0 -1
  30. package/lib/cjs/stories/graph-visualization-simple-styling.story.js +0 -59
  31. package/lib/cjs/stories/graph-visualization-simple-styling.story.js.map +0 -1
  32. package/lib/cjs/stories/graph-visualization-unique-colors-styling.story.js +0 -71
  33. package/lib/cjs/stories/graph-visualization-unique-colors-styling.story.js.map +0 -1
  34. package/lib/cjs/stories/index.js +0 -80
  35. package/lib/cjs/stories/index.js.map +0 -1
  36. package/lib/cjs/stories/preview-graph-visualization.story.js +0 -68
  37. package/lib/cjs/stories/preview-graph-visualization.story.js.map +0 -1
  38. package/lib/cjs/stories/story-data.js +0 -992
  39. package/lib/cjs/stories/story-data.js.map +0 -1
  40. package/lib/esm/stories/graph-visualization-barebones.story.js +0 -90
  41. package/lib/esm/stories/graph-visualization-barebones.story.js.map +0 -1
  42. package/lib/esm/stories/graph-visualization-custom.story.js +0 -74
  43. package/lib/esm/stories/graph-visualization-custom.story.js.map +0 -1
  44. package/lib/esm/stories/graph-visualization-default.story.js +0 -90
  45. package/lib/esm/stories/graph-visualization-default.story.js.map +0 -1
  46. package/lib/esm/stories/graph-visualization-highlighting.story.js +0 -28
  47. package/lib/esm/stories/graph-visualization-highlighting.story.js.map +0 -1
  48. package/lib/esm/stories/graph-visualization-maximalist.story.js +0 -104
  49. package/lib/esm/stories/graph-visualization-maximalist.story.js.map +0 -1
  50. package/lib/esm/stories/graph-visualization-range-styling.story.js +0 -97
  51. package/lib/esm/stories/graph-visualization-range-styling.story.js.map +0 -1
  52. package/lib/esm/stories/graph-visualization-rule-based-styling-advanced.story.js +0 -267
  53. package/lib/esm/stories/graph-visualization-rule-based-styling-advanced.story.js.map +0 -1
  54. package/lib/esm/stories/graph-visualization-rule-based-styling-datetime.story.js +0 -178
  55. package/lib/esm/stories/graph-visualization-rule-based-styling-datetime.story.js.map +0 -1
  56. package/lib/esm/stories/graph-visualization-rule-based-styling.story.js +0 -78
  57. package/lib/esm/stories/graph-visualization-rule-based-styling.story.js.map +0 -1
  58. package/lib/esm/stories/graph-visualization-search.story.js +0 -34
  59. package/lib/esm/stories/graph-visualization-search.story.js.map +0 -1
  60. package/lib/esm/stories/graph-visualization-simple-styling.story.js +0 -56
  61. package/lib/esm/stories/graph-visualization-simple-styling.story.js.map +0 -1
  62. package/lib/esm/stories/graph-visualization-unique-colors-styling.story.js +0 -69
  63. package/lib/esm/stories/graph-visualization-unique-colors-styling.story.js.map +0 -1
  64. package/lib/esm/stories/index.js +0 -61
  65. package/lib/esm/stories/index.js.map +0 -1
  66. package/lib/esm/stories/preview-graph-visualization.story.js +0 -66
  67. package/lib/esm/stories/preview-graph-visualization.story.js.map +0 -1
  68. package/lib/esm/stories/story-data.js +0 -989
  69. package/lib/esm/stories/story-data.js.map +0 -1
  70. package/lib/types/stories/graph-visualization-barebones.story.d.ts +0 -24
  71. package/lib/types/stories/graph-visualization-barebones.story.d.ts.map +0 -1
  72. package/lib/types/stories/graph-visualization-custom.story.d.ts +0 -24
  73. package/lib/types/stories/graph-visualization-custom.story.d.ts.map +0 -1
  74. package/lib/types/stories/graph-visualization-default.story.d.ts +0 -24
  75. package/lib/types/stories/graph-visualization-default.story.d.ts.map +0 -1
  76. package/lib/types/stories/graph-visualization-highlighting.story.d.ts +0 -23
  77. package/lib/types/stories/graph-visualization-highlighting.story.d.ts.map +0 -1
  78. package/lib/types/stories/graph-visualization-maximalist.story.d.ts +0 -24
  79. package/lib/types/stories/graph-visualization-maximalist.story.d.ts.map +0 -1
  80. package/lib/types/stories/graph-visualization-range-styling.story.d.ts +0 -25
  81. package/lib/types/stories/graph-visualization-range-styling.story.d.ts.map +0 -1
  82. package/lib/types/stories/graph-visualization-rule-based-styling-advanced.story.d.ts +0 -33
  83. package/lib/types/stories/graph-visualization-rule-based-styling-advanced.story.d.ts.map +0 -1
  84. package/lib/types/stories/graph-visualization-rule-based-styling-datetime.story.d.ts +0 -25
  85. package/lib/types/stories/graph-visualization-rule-based-styling-datetime.story.d.ts.map +0 -1
  86. package/lib/types/stories/graph-visualization-rule-based-styling.story.d.ts +0 -25
  87. package/lib/types/stories/graph-visualization-rule-based-styling.story.d.ts.map +0 -1
  88. package/lib/types/stories/graph-visualization-search.story.d.ts +0 -23
  89. package/lib/types/stories/graph-visualization-search.story.d.ts.map +0 -1
  90. package/lib/types/stories/graph-visualization-simple-styling.story.d.ts +0 -25
  91. package/lib/types/stories/graph-visualization-simple-styling.story.d.ts.map +0 -1
  92. package/lib/types/stories/graph-visualization-unique-colors-styling.story.d.ts +0 -23
  93. package/lib/types/stories/graph-visualization-unique-colors-styling.story.d.ts.map +0 -1
  94. package/lib/types/stories/index.d.ts +0 -47
  95. package/lib/types/stories/index.d.ts.map +0 -1
  96. package/lib/types/stories/preview-graph-visualization.story.d.ts +0 -23
  97. package/lib/types/stories/preview-graph-visualization.story.d.ts.map +0 -1
  98. package/lib/types/stories/story-data.d.ts +0 -31
  99. 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 GESTURE_KEYS = {
52
+ const GESTURE_KEYS_DEFAULT = {
53
53
  box: 'B',
54
54
  lasso: 'L',
55
55
  single: 'S',
56
56
  };
57
- const useRegisterKeyboardGestureSwitcher = (gestures) => {
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 upperKey = evt.key.toUpperCase();
62
- for (const gesture of gestures) {
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
- }, [gestures, setGesture]);
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 NON_BREAKING_SPACE = '\u00A0';
77
- const SingleSelectButton = ({ className, style, htmlAttributes, tooltipPlacement, }) => {
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: `Individual Select ${NON_BREAKING_SPACE} ${GESTURE_KEYS.single}`, onClick: () => {
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: `Box Select ${NON_BREAKING_SPACE} ${GESTURE_KEYS.box}`, onClick: () => {
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: `Lasso Select ${NON_BREAKING_SPACE} ${GESTURE_KEYS.lasso}`, onClick: () => {
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.keys(gestureOptions));
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: (_b = (_a = gestureOptions[gesture]) === null || _a === void 0 ? void 0 : _a.icon) !== null && _b !== void 0 ? _b : (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]) => ((0, jsx_runtime_1.jsx)(react_1.Menu.RadioItem, { title: item.title, leadingVisual: item.icon, trailingContent: (0, jsx_runtime_1.jsx)(react_1.Kbd, { keys: [GESTURE_KEYS[key]] }), isChecked: key === gesture, onClick: () => setGesture === null || setGesture === void 0 ? void 0 : setGesture(key) }, key))) })] }));
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 GESTURE_KEYS = {
45
+ const GESTURE_KEYS_DEFAULT = {
46
46
  box: 'B',
47
47
  lasso: 'L',
48
48
  single: 'S',
49
49
  };
50
- const useRegisterKeyboardGestureSwitcher = (gestures) => {
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 upperKey = evt.key.toUpperCase();
55
- for (const gesture of gestures) {
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
- }, [gestures, setGesture]);
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 NON_BREAKING_SPACE = '\u00A0';
70
- export const SingleSelectButton = ({ className, style, htmlAttributes, tooltipPlacement, }) => {
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: `Individual Select ${NON_BREAKING_SPACE} ${GESTURE_KEYS.single}`, onClick: () => {
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: `Box Select ${NON_BREAKING_SPACE} ${GESTURE_KEYS.box}`, onClick: () => {
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: `Lasso Select ${NON_BREAKING_SPACE} ${GESTURE_KEYS.lasso}`, onClick: () => {
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.keys(gestureOptions));
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: (_b = (_a = gestureOptions[gesture]) === null || _a === void 0 ? void 0 : _a.icon) !== null && _b !== void 0 ? _b : _jsx(SelectIcon, {}) }), _jsx(Menu, { isOpen: isMenuOpen, anchorRef: anchorRef, onClose: () => setIsMenuOpen(false), placement: menuPlacement, portalTarget: portalTarget, children: Object.entries(gestureOptions).map(([key, item]) => (_jsx(Menu.RadioItem, { title: item.title, leadingVisual: item.icon, trailingContent: _jsx(Kbd, { keys: [GESTURE_KEYS[key]] }), isChecked: key === gesture, onClick: () => setGesture === null || setGesture === void 0 ? void 0 : setGesture(key) }, key))) })] }));
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