@neo4j-ndl/react-graph 1.2.34 → 1.2.36
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 +13 -10
- package/lib/cjs/graph-visualization-buttons.js.map +1 -1
- package/lib/cjs/graph-visualization-context.js.map +1 -1
- package/lib/cjs/graph-visualization.js +2 -1
- package/lib/cjs/graph-visualization.js.map +1 -1
- package/lib/cjs/stories/graph-visualization-maximalist.story.js +1 -1
- package/lib/cjs/stories/graph-visualization-maximalist.story.js.map +1 -1
- package/lib/esm/graph-visualization-buttons.js +13 -10
- package/lib/esm/graph-visualization-buttons.js.map +1 -1
- package/lib/esm/graph-visualization-context.js.map +1 -1
- package/lib/esm/graph-visualization.js +2 -1
- package/lib/esm/graph-visualization.js.map +1 -1
- package/lib/esm/stories/graph-visualization-maximalist.story.js +1 -1
- package/lib/esm/stories/graph-visualization-maximalist.story.js.map +1 -1
- package/lib/types/graph-visualization-buttons.d.ts.map +1 -1
- package/lib/types/graph-visualization-context.d.ts +1 -0
- package/lib/types/graph-visualization-context.d.ts.map +1 -1
- package/lib/types/graph-visualization.d.ts +2 -1
- package/lib/types/graph-visualization.d.ts.map +1 -1
- package/package.json +3 -3
|
@@ -200,18 +200,21 @@ const SearchButton = ({ className, style, htmlAttributes, tooltipPlacement, open
|
|
|
200
200
|
}
|
|
201
201
|
},
|
|
202
202
|
} })) : ((0, jsx_runtime_1.jsx)(react_1.IconButton, { size: "small", isFloating: true, onClick: () => setIsOpen((o) => !o), description: "Search", className: className, style: style, htmlAttributes: htmlAttributes, tooltipProps: {
|
|
203
|
-
root: {
|
|
203
|
+
root: {
|
|
204
|
+
isPortaled: false,
|
|
205
|
+
placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom',
|
|
206
|
+
},
|
|
204
207
|
}, children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) })) }));
|
|
205
208
|
};
|
|
206
209
|
exports.SearchButton = SearchButton;
|
|
207
210
|
const DownloadButton = ({ className, style, htmlAttributes, tooltipPlacement, }) => {
|
|
208
|
-
const { nvlInstance } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
|
|
211
|
+
const { nvlInstance, portalTarget } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
|
|
209
212
|
const [isDownloadMenuOpen, setOpen] = (0, react_2.useState)(false);
|
|
210
213
|
const closeFileMenu = () => setOpen(false);
|
|
211
214
|
const downloadButtonRef = (0, react_2.useRef)(null);
|
|
212
215
|
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_1.IconButton, { ref: downloadButtonRef, size: "small", isFloating: true, onClick: () => setOpen((o) => !o), description: "Download", tooltipProps: {
|
|
213
|
-
root: { placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
214
|
-
}, className: className, style: style, htmlAttributes: htmlAttributes, children: (0, jsx_runtime_1.jsx)(icons_1.ArrowDownTrayIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Menu, { isOpen: isDownloadMenuOpen, onClose: closeFileMenu, anchorRef: downloadButtonRef, children: (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Download as PNG", onClick: () => {
|
|
216
|
+
root: { isPortaled: false, placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
217
|
+
}, className: className, style: style, htmlAttributes: htmlAttributes, children: (0, jsx_runtime_1.jsx)(icons_1.ArrowDownTrayIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Menu, { isOpen: isDownloadMenuOpen, onClose: closeFileMenu, anchorRef: downloadButtonRef, portalTarget: portalTarget, children: (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Download as PNG", onClick: () => {
|
|
215
218
|
var _a;
|
|
216
219
|
(_a = nvlInstance.current) === null || _a === void 0 ? void 0 : _a.saveToFile({});
|
|
217
220
|
closeFileMenu();
|
|
@@ -232,10 +235,10 @@ const LayoutSelectButton = ({ className, style, htmlAttributes, tooltipPlacement
|
|
|
232
235
|
var _a, _b;
|
|
233
236
|
const anchorRef = (0, react_2.useRef)(null);
|
|
234
237
|
const [isMenuOpen, setIsMenuOpen] = (0, react_2.useState)(false);
|
|
235
|
-
const { layout, setLayout } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
|
|
238
|
+
const { layout, setLayout, portalTarget } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
|
|
236
239
|
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select layout", isOpen: isMenuOpen, onClick: () => setIsMenuOpen((old) => !old), ref: anchorRef, className: className, style: style, htmlAttributes: htmlAttributes, size: "small", tooltipProps: {
|
|
237
|
-
root: { placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
238
|
-
}, children: (_b = (_a = layoutOptions[layout]) === 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, children: Object.entries(layoutOptions).map(([key, item]) => ((0, jsx_runtime_1.jsx)(react_1.Menu.RadioItem, { title: item.title, leadingVisual: item.icon, isChecked: key === layout, onClick: () => setLayout === null || setLayout === void 0 ? void 0 : setLayout(key) }, key))) })] }));
|
|
240
|
+
root: { isPortaled: false, placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
241
|
+
}, children: (_b = (_a = layoutOptions[layout]) === 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(layoutOptions).map(([key, item]) => ((0, jsx_runtime_1.jsx)(react_1.Menu.RadioItem, { title: item.title, leadingVisual: item.icon, isChecked: key === layout, onClick: () => setLayout === null || setLayout === void 0 ? void 0 : setLayout(key) }, key))) })] }));
|
|
239
242
|
};
|
|
240
243
|
exports.LayoutSelectButton = LayoutSelectButton;
|
|
241
244
|
// oxlint-disable-next-line sort-keys
|
|
@@ -257,11 +260,11 @@ const GestureSelectButton = ({ className, style, htmlAttributes, tooltipPlacemen
|
|
|
257
260
|
var _a, _b;
|
|
258
261
|
const anchorRef = (0, react_2.useRef)(null);
|
|
259
262
|
const [isMenuOpen, setIsMenuOpen] = (0, react_2.useState)(false);
|
|
260
|
-
const { gesture, setGesture } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
|
|
263
|
+
const { gesture, setGesture, portalTarget } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
|
|
261
264
|
useRegisterKeyboardGestureSwitcher(Object.keys(gestureOptions));
|
|
262
265
|
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: {
|
|
263
|
-
root: { placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
264
|
-
}, 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, 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))) })] }));
|
|
266
|
+
root: { isPortaled: false, placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
267
|
+
}, 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))) })] }));
|
|
265
268
|
};
|
|
266
269
|
exports.GestureSelectButton = GestureSelectButton;
|
|
267
270
|
//# 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 ExploreIcon,\n FitToScreenIcon,\n HierarchyTwoIcon,\n LassoIcon,\n MagnifyingGlassIconOutline,\n MagnifyingGlassMinusIconOutline,\n MagnifyingGlassPlusIconOutline,\n PanelRightIcon,\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={isSidePanelOpen ? 'Close' : 'Open'}\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 node properties panel',\n ...htmlAttributes,\n }}\n >\n <PanelRightIcon className=\"ndl-graph-visualization-toggle-icon\" />\n </IconButton>\n );\n};\n\ntype SearchButtonProps = GraphVisualizationButtonProps & {\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 const rawNodes = Object.values(nvlGraph.dataLookupTable.nodes);\n const rawRels = Object.values(nvlGraph.dataLookupTable.relationships);\n\n onSearch(searchNodes(rawNodes, newValue), searchRels(rawRels, 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: { placement: tooltipPlacement ?? 'bottom' },\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 } = 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: { 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 >\n <Menu.Item\n title=\"Download as PNG\"\n onClick={() => {\n nvlInstance.current?.saveToFile({});\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 } = 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: { 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 >\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 } = 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: { 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 >\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 ExploreIcon,\n FitToScreenIcon,\n HierarchyTwoIcon,\n LassoIcon,\n MagnifyingGlassIconOutline,\n MagnifyingGlassMinusIconOutline,\n MagnifyingGlassPlusIconOutline,\n PanelRightIcon,\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={isSidePanelOpen ? 'Close' : 'Open'}\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 node properties panel',\n ...htmlAttributes,\n }}\n >\n <PanelRightIcon className=\"ndl-graph-visualization-toggle-icon\" />\n </IconButton>\n );\n};\n\ntype SearchButtonProps = GraphVisualizationButtonProps & {\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 const rawNodes = Object.values(nvlGraph.dataLookupTable.nodes);\n const rawRels = Object.values(nvlGraph.dataLookupTable.relationships);\n\n onSearch(searchNodes(rawNodes, newValue), searchRels(rawRels, 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>\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 +1 @@
|
|
|
1
|
-
{"version":3,"file":"graph-visualization-context.js","sourceRoot":"","sources":["../../src/graph-visualization-context.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AAIH,iCAAkD;
|
|
1
|
+
{"version":3,"file":"graph-visualization-context.js","sourceRoot":"","sources":["../../src/graph-visualization-context.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AAIH,iCAAkD;AA0ErC,QAAA,yBAAyB,GAAG,IAAA,qBAAa,EAEpD,SAAS,CAAC,CAAC;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACI,MAAM,4BAA4B,GAAG,GAAG,EAAE;IAC/C,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,iCAAyB,CAAC,CAAC;IACtD,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,MAAM,IAAI,KAAK,CACb,8EAA8E,CAC/E,CAAC;IACJ,CAAC;IACD,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AARW,QAAA,4BAA4B,gCAQvC","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 type NVL from '@neo4j-nvl/base';\nimport { type Layout, type Node, type Relationship } from '@neo4j-nvl/base';\nimport { createContext, useContext } from 'react';\n\nexport type GraphSelection = { nodeIds: string[]; relationshipIds: string[] };\nexport type Sidepanel = {\n children: React.ReactNode;\n isSidePanelOpen: boolean;\n setIsSidePanelOpen?: (isSidePanelOpen: boolean) => void;\n sidePanelWidth?: number;\n onSidePanelResize: (width: number) => void;\n minWidth?: number;\n};\n\nexport type NvlGraph = {\n nodes: Node[];\n rels: Relationship[];\n dataLookupTable: DataLookupTable;\n};\n\nexport type GraphItemMetaData = { totalCount: number; mostCommonColor: string };\nexport type DataLookupTable = {\n nodes: Record<string, NodeData>;\n relationships: Record<string, RelData>;\n labels: string[];\n types: string[];\n labelMetaData: Record<string, GraphItemMetaData>;\n typeMetaData: Record<string, GraphItemMetaData>;\n};\n\n// We use this type to avoid coupling the graph visualization component to the neo4j driver types\n// The tradeoff is that it's limited to displaying values and not manipulating them\n// and that it's harder to pass to the graph visualization component from the raw driver result\nexport type PortableProperty = { stringified: string; type: string };\n\nexport type NodeData = {\n labelsSorted: string[];\n properties: Record<string, PortableProperty>;\n color: string;\n id: string;\n};\nexport type RelData = {\n type: string;\n properties: Record<string, PortableProperty>;\n color: string;\n id: string;\n};\n\nexport type NeoNode = Node & {\n properties: Record<string, PortableProperty>;\n labels: string[];\n};\nexport type NeoRel = Relationship & {\n properties: Record<string, PortableProperty>;\n type: string;\n};\n\n/**\n * Data that is shared across the graph visualization component.\n *\n * @see {@link useGraphVisualizationContext}\n * @alpha\n */\nexport type GraphVisualizationContextData = {\n nvlInstance: React.MutableRefObject<NVL | null>;\n sidepanel: Sidepanel | null;\n gesture: Gesture;\n setGesture?: (gesture: Gesture) => void;\n interactionMode: InteractionMode;\n nvlGraph: NvlGraph;\n selected: GraphSelection;\n layout: Layout;\n setLayout?: (layout: Layout) => void;\n portalTarget?: HTMLElement | null;\n};\n\nexport const GraphVisualizationContext = createContext<\n GraphVisualizationContextData | undefined\n>(undefined);\n\n/**\n * Hook to access the graph visualization context.\n *\n * This hook is used to implement custom UI components like buttons, panels, and controls\n * that need access to data and functionality from the graph visualization component.\n * @see {@link GraphVisualizationContextData}\n *\n * @returns The graph visualization context containing NVL instance, sidepanel, gestures, and graph data\n * @throws Error if used outside of a GraphVisualizationContext provider\n *\n * @example\n * ```tsx\n * const NodeLoggerButton = () => {\n * const { selected } = useGraphVisualizationContext();\n *\n * const handleClick = () => {\n * console.log('Selected nodes:', selected.nodeIds);\n * };\n *\n * return (\n * <button onClick={handleClick}>\n * Log Selected Nodes ({selected.nodeIds.length})\n * </button>\n * );\n * };\n * ```\n * @alpha\n */\nexport const useGraphVisualizationContext = () => {\n const context = useContext(GraphVisualizationContext);\n if (!context) {\n throw new Error(\n 'useGraphVisualizationContext must be used within a GraphVisualizationContext',\n );\n }\n return context;\n};\n\nexport type Gesture = 'single' | 'box' | 'lasso';\n\nexport type InteractionMode =\n | 'select'\n | 'draw'\n | 'edit-text'\n | 'pan'\n | 'drag'\n | 'none';\n"]}
|
|
@@ -164,7 +164,7 @@ const DEFAULT_COMPONENTS = {
|
|
|
164
164
|
*/
|
|
165
165
|
function GraphVisualization(_a) {
|
|
166
166
|
var _b, _c;
|
|
167
|
-
var { nvlRef: rawNvlRef, nvlCallbacks, nvlOptions, sidepanel: rawSidepanel, nodes: rawNodes, rels: rawRels, highlightedNodeIds, highlightedRelationshipIds, topLeftIsland = DEFAULT_COMPONENTS.topLeftIsland, topRightIsland = DEFAULT_COMPONENTS.topRightIsland, bottomLeftIsland = DEFAULT_COMPONENTS.bottomLeftIsland, bottomRightIsland = DEFAULT_COMPONENTS.bottomRightIsland, gesture = 'single', setGesture, layout: rawLayout, setLayout: rawSetLayout, selected: rawSelected, setSelected: rawSetSelected, interactionMode: rawInteractionMode, setInteractionMode: rawSetInteractionMode, mouseEventCallbacks = {}, className, style, htmlAttributes, ref, as } = _a, restProps = __rest(_a, ["nvlRef", "nvlCallbacks", "nvlOptions", "sidepanel", "nodes", "rels", "highlightedNodeIds", "highlightedRelationshipIds", "topLeftIsland", "topRightIsland", "bottomLeftIsland", "bottomRightIsland", "gesture", "setGesture", "layout", "setLayout", "selected", "setSelected", "interactionMode", "setInteractionMode", "mouseEventCallbacks", "className", "style", "htmlAttributes", "ref", "as"]);
|
|
167
|
+
var { nvlRef: rawNvlRef, nvlCallbacks, nvlOptions, sidepanel: rawSidepanel, nodes: rawNodes, rels: rawRels, highlightedNodeIds, highlightedRelationshipIds, topLeftIsland = DEFAULT_COMPONENTS.topLeftIsland, topRightIsland = DEFAULT_COMPONENTS.topRightIsland, bottomLeftIsland = DEFAULT_COMPONENTS.bottomLeftIsland, bottomRightIsland = DEFAULT_COMPONENTS.bottomRightIsland, gesture = 'single', setGesture, layout: rawLayout, setLayout: rawSetLayout, portalTarget, selected: rawSelected, setSelected: rawSetSelected, interactionMode: rawInteractionMode, setInteractionMode: rawSetInteractionMode, mouseEventCallbacks = {}, className, style, htmlAttributes, ref, as } = _a, restProps = __rest(_a, ["nvlRef", "nvlCallbacks", "nvlOptions", "sidepanel", "nodes", "rels", "highlightedNodeIds", "highlightedRelationshipIds", "topLeftIsland", "topRightIsland", "bottomLeftIsland", "bottomRightIsland", "gesture", "setGesture", "layout", "setLayout", "portalTarget", "selected", "setSelected", "interactionMode", "setInteractionMode", "mouseEventCallbacks", "className", "style", "htmlAttributes", "ref", "as"]);
|
|
168
168
|
const nvlRef = (0, react_3.useMemo)(() => rawNvlRef !== null && rawNvlRef !== void 0 ? rawNvlRef : react_3.default.createRef(), [rawNvlRef]);
|
|
169
169
|
const instanceId = (0, react_3.useId)();
|
|
170
170
|
// Respect NDL theme changes
|
|
@@ -238,6 +238,7 @@ function GraphVisualization(_a) {
|
|
|
238
238
|
layout,
|
|
239
239
|
nvlGraph,
|
|
240
240
|
nvlInstance: nvlRef,
|
|
241
|
+
portalTarget,
|
|
241
242
|
selected,
|
|
242
243
|
setGesture,
|
|
243
244
|
setLayout,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"graph-visualization.js","sourceRoot":"","sources":["../../src/graph-visualization.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 { tokens } from '@neo4j-ndl/base';\nimport { IconButtonArray, useNeedleTheme } from '@neo4j-ndl/react';\nimport type NVL from '@neo4j-nvl/base';\nimport { type Layout } from '@neo4j-nvl/base';\nimport {\n InteractiveNvlWrapper,\n type InteractiveNvlWrapperProps,\n} from '@neo4j-nvl/react';\nimport { default as cx } from 'classnames';\nimport React, { useEffect, useId, useMemo, useState } from 'react';\n\nimport {\n BoxSelectButton,\n DownloadButton,\n GestureSelectButton,\n LassoSelectButton,\n LayoutSelectButton,\n SearchButton,\n SingleSelectButton,\n ToggleSidePanelButton,\n ZoomInButton,\n ZoomOutButton,\n ZoomToFitButton,\n} from './graph-visualization-buttons';\nimport {\n type Gesture,\n type GraphSelection,\n GraphVisualizationContext,\n type InteractionMode,\n type NeoNode,\n type NeoRel,\n type NvlGraph,\n type Sidepanel,\n} from './graph-visualization-context';\nimport { GraphVisualizationSidepanel } from './graph-visualization-sidepanel';\nimport { mapToNvlGraph } from './map-to-nvl-graph';\nimport { SingleSelectionSidepanelContents } from './sidepanel-components/single-selection-sidepanel-contents';\nimport { useManagedNodeState } from './use-managed-node-state';\nimport { useSemicontrolledState } from './use-semi-controlled-state';\n\ntype Placement = 'top-right' | 'bottom-right' | 'top-left' | 'bottom-left';\n\nconst PLACEMENTS: Record<Placement, string> = {\n 'bottom-left': 'ndl-graph-visualization-interaction-island ndl-bottom-left',\n 'bottom-right': 'ndl-graph-visualization-interaction-island ndl-bottom-right',\n 'top-left': 'ndl-graph-visualization-interaction-island ndl-top-left',\n 'top-right': 'ndl-graph-visualization-interaction-island ndl-top-right',\n};\n\nconst InteractionIsland = ({\n children,\n className,\n placement,\n}: {\n children: React.ReactNode;\n placement: Placement;\n className?: string;\n}) => {\n return <div className={cx(PLACEMENTS[placement], className)}>{children}</div>;\n};\n\nexport const DEFAULT_NVL_OPTIONS = {\n disableTelemetry: true,\n disableWebGL: true,\n maxZoom: 3,\n minZoom: 0.05,\n relationshipThreshold: 0.55,\n};\n\nconst DEFAULT_COMPONENTS = {\n bottomLeftIsland: null,\n bottomRightIsland: (\n <IconButtonArray orientation=\"vertical\" isFloating size=\"small\">\n <ZoomInButton /> <ZoomOutButton /> <ZoomToFitButton />\n </IconButtonArray>\n ),\n topLeftIsland: null,\n topRightIsland: (\n <div className=\"ndl-graph-visualization-default-download-group\">\n <DownloadButton /> <ToggleSidePanelButton />\n </div>\n ),\n};\n\nexport type GraphVisualizationProps<T extends React.ElementType = 'div'> = {\n nvlRef?: React.RefObject<NVL | null>;\n sidepanel?: Sidepanel | null;\n bottomLeftIsland?: React.ReactNode;\n bottomRightIsland?: React.ReactNode;\n topLeftIsland?: React.ReactNode;\n topRightIsland?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n\n gesture?: Gesture;\n setGesture?: (gesture: Gesture) => void;\n selected?: GraphSelection;\n setSelected?: (newSelection: GraphSelection) => void;\n interactionMode?: InteractionMode;\n setInteractionMode?: (interactionMode: InteractionMode) => void;\n layout?: Layout;\n setLayout?: (layout: Layout) => void;\n\n nodes: NeoNode[];\n rels: NeoRel[];\n\n highlightedNodeIds?: string[];\n highlightedRelationshipIds?: string[];\n\n as?: T;\n ref?: React.ComponentPropsWithRef<T>['ref'];\n htmlAttributes?: React.HTMLAttributes<T>;\n} & InteractiveNvlWrapperProps;\n\n/**\n * A comprehensive graph visualization component for rendering Neo4j-style graphs with interactive features.\n *\n * @remarks\n * This component provides a complete graph visualization solution with built-in interaction modes,\n * selection handling, zoom controls, and an optional sidepanel. It wraps the NVL (Neo4j Visualization Library)\n * with additional UI controls and state management.\n *\n * The component supports various interaction modes including single selection, box selection, and lasso selection.\n * It also provides customizable UI islands for placing controls at different corners of the visualization.\n *\n * @example\n * Basic usage:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * selected={selection}\n * setSelected={setSelection}\n * />\n * ```\n *\n * @example\n * With custom controls:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * topRightIsland={<CustomControls />}\n * sidepanel={{\n * contents: <CustomSidepanel />,\n * isSidePanelOpen: true,\n * setIsSidePanelOpen: setSidepanelOpen\n * sidePanelWidth: 400,\n * onSidePanelResize: setSidepanelWidth,\n * }}\n * />\n * ```\n *\n * @example\n * With highlighting:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * // undefined = no highlighting (default behavior)\n * // empty array = no search matches (dims all nodes)\n * // array with IDs = highlight only those items\n * highlightedNodeIds={searchResults.nodeIds}\n * highlightedRelationshipIds={searchResults.relationshipIds}\n * />\n * ```\n *\n * @param props - {@link GraphVisualizationProps}\n * @returns A React component that renders an interactive graph visualization\n *\n * @alpha\n */\nexport function GraphVisualization<T extends React.ElementType = 'div'>({\n nvlRef: rawNvlRef,\n nvlCallbacks,\n nvlOptions,\n sidepanel: rawSidepanel,\n nodes: rawNodes,\n rels: rawRels,\n highlightedNodeIds,\n highlightedRelationshipIds,\n topLeftIsland = DEFAULT_COMPONENTS.topLeftIsland,\n topRightIsland = DEFAULT_COMPONENTS.topRightIsland,\n bottomLeftIsland = DEFAULT_COMPONENTS.bottomLeftIsland,\n bottomRightIsland = DEFAULT_COMPONENTS.bottomRightIsland,\n gesture = 'single',\n setGesture,\n layout: rawLayout,\n setLayout: rawSetLayout,\n selected: rawSelected,\n setSelected: rawSetSelected,\n interactionMode: rawInteractionMode,\n setInteractionMode: rawSetInteractionMode,\n mouseEventCallbacks = {},\n className,\n style,\n htmlAttributes,\n ref,\n as,\n ...restProps\n}: GraphVisualizationProps<T>) {\n const nvlRef = useMemo(\n () => rawNvlRef ?? React.createRef<NVL>(),\n [rawNvlRef],\n );\n\n const instanceId = useId();\n\n // Respect NDL theme changes\n const { theme } = useNeedleTheme();\n const { bg, border, text } = tokens.theme[theme].color.neutral;\n\n // key required for nvl react responsiveness\n const [key, setKey] = useState(0);\n useEffect(() => {\n setKey((prevKey) => prevKey + 1);\n }, [theme]);\n\n // Semi-control interaction mode and selection state\n const [interactionMode, setInteractionMode] = useSemicontrolledState({\n isControlled: rawInteractionMode !== undefined,\n onChange: rawSetInteractionMode,\n state: rawInteractionMode ?? 'select',\n });\n const [selected, setSelected] = useSemicontrolledState({\n isControlled: rawSelected !== undefined,\n onChange: rawSetSelected,\n state: rawSelected ?? { nodeIds: [], relationshipIds: [] },\n });\n const [layout, setLayout] = useSemicontrolledState({\n isControlled: rawLayout !== undefined,\n onChange: rawSetLayout,\n state: rawLayout ?? 'd3Force',\n });\n\n const nvlGraph = useMemo(\n (): NvlGraph => mapToNvlGraph(rawNodes, rawRels),\n [rawNodes, rawRels],\n );\n\n const { nodesWithState, relsWithState, wrappedMouseEventCallbacks } =\n useManagedNodeState({\n gesture,\n highlightedNodeIds,\n highlightedRelationshipIds,\n interactionMode,\n mouseEventCallbacks,\n nvlGraph,\n selected,\n setInteractionMode,\n setSelected,\n });\n\n const [isSidePanelOpen, setIsSidePanelOpen] = useSemicontrolledState({\n isControlled: rawSidepanel?.isSidePanelOpen !== undefined,\n onChange: rawSidepanel?.setIsSidePanelOpen,\n state: rawSidepanel?.isSidePanelOpen ?? true,\n });\n const [sidePanelWidth, setSidePanelWidth] = useSemicontrolledState({\n isControlled: rawSidepanel?.sidePanelWidth !== undefined,\n onChange: rawSidepanel?.onSidePanelResize,\n state: rawSidepanel?.sidePanelWidth ?? 400,\n });\n\n const sidepanel = useMemo((): Sidepanel | null => {\n if (rawSidepanel === undefined) {\n return {\n children: <GraphVisualization.SingleSelectionSidePanelContents />,\n isSidePanelOpen,\n onSidePanelResize: setSidePanelWidth,\n setIsSidePanelOpen,\n sidePanelWidth,\n };\n }\n return rawSidepanel;\n }, [\n rawSidepanel,\n isSidePanelOpen,\n setIsSidePanelOpen,\n sidePanelWidth,\n setSidePanelWidth,\n ]);\n\n const Component: React.ElementType = as ?? 'div';\n return (\n <Component\n ref={ref}\n className={cx('ndl-graph-visualization-container', className)}\n style={style}\n {...htmlAttributes}\n >\n <GraphVisualizationContext.Provider\n value={{\n gesture,\n interactionMode,\n layout,\n nvlGraph,\n nvlInstance: nvlRef,\n selected,\n setGesture,\n setLayout,\n sidepanel,\n }}\n >\n <div className=\"ndl-graph-visualization\">\n <InteractiveNvlWrapper\n key={key}\n layout={layout}\n nodes={nodesWithState}\n rels={relsWithState}\n nvlOptions={{\n ...DEFAULT_NVL_OPTIONS,\n instanceId,\n styling: {\n defaultRelationshipColor: border.strongest,\n disabledItemColor: bg.strong,\n disabledItemFontColor: text.weakest,\n dropShadowColor: border.weak,\n selectedInnerBorderColor: bg.default,\n },\n ...nvlOptions,\n }}\n nvlCallbacks={{\n onLayoutComputing(isComputing) {\n if (!isComputing) {\n nvlRef.current?.fit(\n nvlRef.current.getNodes().map((neighbors) => neighbors.id),\n { noPan: true },\n );\n }\n },\n ...nvlCallbacks,\n }}\n mouseEventCallbacks={wrappedMouseEventCallbacks}\n ref={nvlRef}\n {...restProps}\n />\n {topLeftIsland !== null && (\n <InteractionIsland placement=\"top-left\">\n {topLeftIsland}\n </InteractionIsland>\n )}\n\n {topRightIsland !== null && (\n <InteractionIsland placement=\"top-right\">\n {topRightIsland}\n </InteractionIsland>\n )}\n\n {bottomLeftIsland !== null && (\n <InteractionIsland placement=\"bottom-left\">\n {bottomLeftIsland}\n </InteractionIsland>\n )}\n\n {bottomRightIsland !== null && (\n <InteractionIsland placement=\"bottom-right\">\n {bottomRightIsland}\n </InteractionIsland>\n )}\n </div>\n {sidepanel && <GraphVisualizationSidepanel sidepanel={sidepanel} />}\n </GraphVisualizationContext.Provider>\n </Component>\n );\n}\n\n/**\n * Zoom in button for use within a GraphVisualization component.\n *\n * @remarks\n * Increases zoom level by 1.3x\n *\n * @alpha\n */\nGraphVisualization.ZoomInButton = ZoomInButton;\n\n/**\n * Zoom out button for use within a GraphVisualization component.\n *\n * @remarks\n * Decreases zoom level by 0.7x\n *\n * @alpha\n */\nGraphVisualization.ZoomOutButton = ZoomOutButton;\n\n/**\n * Zoom to fit button for use within a GraphVisualization component.\n *\n * @remarks\n * Automatically adjusts zoom and pan to show all nodes and relationships\n *\n * @alpha\n */\nGraphVisualization.ZoomToFitButton = ZoomToFitButton;\n\n/**\n * Sidepanel toggle button for use within a GraphVisualization component.\n *\n * @remarks\n * Shows or hides the sidepanel containing node and relationship details.\n * Requires a sidepanel to be configured in the GraphVisualization component.\n *\n * @throws Error when used without a configured sidepanel\n *\n * @alpha\n */\nGraphVisualization.ToggleSidePanelButton = ToggleSidePanelButton;\n\n/**\n * Download button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a dropdown menu with download options. Currently supports PNG format.\n * Captures the current visualization state including zoom level.\n *\n * @alpha\n */\nGraphVisualization.DownloadButton = DownloadButton;\n\n/**\n * Box selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables box selection mode where dragging creates a rectangular selection area.\n * Disabled unless the `setGesture` callback is passed.\n * Shows active state when enabled and supports keyboard shortcut 'B'.\n *\n * @alpha\n */\nGraphVisualization.BoxSelectButton = BoxSelectButton;\n\n/**\n * Lasso selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables lasso selection mode where dragging creates a free-form selection area.\n * Disabled unless the `setGesture` callback is passed.\n * Shows active state when enabled and supports keyboard shortcut 'L'.\n *\n * @alpha\n */\nGraphVisualization.LassoSelectButton = LassoSelectButton;\n\n/**\n * Single node selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables single selection mode where clicking selects individual nodes or relationships.\n * Shows active state when enabled and supports keyboard shortcut 'S'.\n *\n * @alpha\n */\nGraphVisualization.SingleSelectButton = SingleSelectButton;\n\n/**\n * Search button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables search mode where clicking opens a search input for filtering nodes and relationships.\n *\n * @alpha\n */\nGraphVisualization.SearchButton = SearchButton;\n\n/**\n * Single node selection side panel for use within a GraphVisualization component.\n *\n * @remarks\n * Displays detailed information about the selected node or relationship.\n * Panel is automatically opened when a node or relationship is selected.\n * Also when user click on the show panel button in the top right corner.\n *\n * @alpha\n */\nGraphVisualization.SingleSelectionSidePanelContents =\n SingleSelectionSidepanelContents;\n\n/**\n * Layout selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a menu to select different graph layout algorithms.\n *\n * By default, the menu includes the **force-based** (`d3Force`) and\n * **hierarchical** layouts. Additional layouts can be enabled via configuration.\n *\n * @see {@link LayoutSelectOption} for the full set of layout options supported by NVL.\n *\n * @alpha\n */\nGraphVisualization.LayoutSelectButton = LayoutSelectButton;\n\n/**\n * Gesture selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a menu to select different interaction gestures.\n *\n * By default, the menu includes **single**, **box**, and **lasso** selection gestures.\n *\n * @see {@link GestureSelectOption} for the full set of gesture options supported by NVL.\n *\n * @alpha\n */\nGraphVisualization.GestureSelectButton = GestureSelectButton;\n"]}
|
|
1
|
+
{"version":3,"file":"graph-visualization.js","sourceRoot":"","sources":["../../src/graph-visualization.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 { tokens } from '@neo4j-ndl/base';\nimport { IconButtonArray, useNeedleTheme } from '@neo4j-ndl/react';\nimport type NVL from '@neo4j-nvl/base';\nimport { type Layout } from '@neo4j-nvl/base';\nimport {\n InteractiveNvlWrapper,\n type InteractiveNvlWrapperProps,\n} from '@neo4j-nvl/react';\nimport { default as cx } from 'classnames';\nimport React, { useEffect, useId, useMemo, useState } from 'react';\n\nimport {\n BoxSelectButton,\n DownloadButton,\n GestureSelectButton,\n LassoSelectButton,\n LayoutSelectButton,\n SearchButton,\n SingleSelectButton,\n ToggleSidePanelButton,\n ZoomInButton,\n ZoomOutButton,\n ZoomToFitButton,\n} from './graph-visualization-buttons';\nimport {\n type Gesture,\n type GraphSelection,\n GraphVisualizationContext,\n type InteractionMode,\n type NeoNode,\n type NeoRel,\n type NvlGraph,\n type Sidepanel,\n} from './graph-visualization-context';\nimport { GraphVisualizationSidepanel } from './graph-visualization-sidepanel';\nimport { mapToNvlGraph } from './map-to-nvl-graph';\nimport { SingleSelectionSidepanelContents } from './sidepanel-components/single-selection-sidepanel-contents';\nimport { useManagedNodeState } from './use-managed-node-state';\nimport { useSemicontrolledState } from './use-semi-controlled-state';\n\ntype Placement = 'top-right' | 'bottom-right' | 'top-left' | 'bottom-left';\n\nconst PLACEMENTS: Record<Placement, string> = {\n 'bottom-left': 'ndl-graph-visualization-interaction-island ndl-bottom-left',\n 'bottom-right': 'ndl-graph-visualization-interaction-island ndl-bottom-right',\n 'top-left': 'ndl-graph-visualization-interaction-island ndl-top-left',\n 'top-right': 'ndl-graph-visualization-interaction-island ndl-top-right',\n};\n\nconst InteractionIsland = ({\n children,\n className,\n placement,\n}: {\n children: React.ReactNode;\n placement: Placement;\n className?: string;\n}) => {\n return <div className={cx(PLACEMENTS[placement], className)}>{children}</div>;\n};\n\nexport const DEFAULT_NVL_OPTIONS = {\n disableTelemetry: true,\n disableWebGL: true,\n maxZoom: 3,\n minZoom: 0.05,\n relationshipThreshold: 0.55,\n};\n\nconst DEFAULT_COMPONENTS = {\n bottomLeftIsland: null,\n bottomRightIsland: (\n <IconButtonArray orientation=\"vertical\" isFloating size=\"small\">\n <ZoomInButton /> <ZoomOutButton /> <ZoomToFitButton />\n </IconButtonArray>\n ),\n topLeftIsland: null,\n topRightIsland: (\n <div className=\"ndl-graph-visualization-default-download-group\">\n <DownloadButton /> <ToggleSidePanelButton />\n </div>\n ),\n};\n\nexport type GraphVisualizationProps<T extends React.ElementType = 'div'> = {\n nvlRef?: React.RefObject<NVL | null>;\n sidepanel?: Sidepanel | null;\n bottomLeftIsland?: React.ReactNode;\n bottomRightIsland?: React.ReactNode;\n topLeftIsland?: React.ReactNode;\n topRightIsland?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n\n gesture?: Gesture;\n setGesture?: (gesture: Gesture) => void;\n selected?: GraphSelection;\n setSelected?: (newSelection: GraphSelection) => void;\n interactionMode?: InteractionMode;\n setInteractionMode?: (interactionMode: InteractionMode) => void;\n layout?: Layout;\n setLayout?: (layout: Layout) => void;\n\n portalTarget?: HTMLElement | null;\n\n nodes: NeoNode[];\n rels: NeoRel[];\n\n highlightedNodeIds?: string[];\n highlightedRelationshipIds?: string[];\n\n as?: T;\n ref?: React.ComponentPropsWithRef<T>['ref'];\n htmlAttributes?: React.HTMLAttributes<T>;\n} & InteractiveNvlWrapperProps;\n\n/**\n * A comprehensive graph visualization component for rendering Neo4j-style graphs with interactive features.\n *\n * @remarks\n * This component provides a complete graph visualization solution with built-in interaction modes,\n * selection handling, zoom controls, and an optional sidepanel. It wraps the NVL (Neo4j Visualization Library)\n * with additional UI controls and state management.\n *\n * The component supports various interaction modes including single selection, box selection, and lasso selection.\n * It also provides customizable UI islands for placing controls at different corners of the visualization.\n *\n * @example\n * Basic usage:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * selected={selection}\n * setSelected={setSelection}\n * />\n * ```\n *\n * @example\n * With custom controls:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * topRightIsland={<CustomControls />}\n * sidepanel={{\n * contents: <CustomSidepanel />,\n * isSidePanelOpen: true,\n * setIsSidePanelOpen: setSidepanelOpen\n * sidePanelWidth: 400,\n * onSidePanelResize: setSidepanelWidth,\n * }}\n * />\n * ```\n *\n * @example\n * With highlighting:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * // undefined = no highlighting (default behavior)\n * // empty array = no search matches (dims all nodes)\n * // array with IDs = highlight only those items\n * highlightedNodeIds={searchResults.nodeIds}\n * highlightedRelationshipIds={searchResults.relationshipIds}\n * />\n * ```\n *\n * @param props - {@link GraphVisualizationProps}\n * @returns A React component that renders an interactive graph visualization\n *\n * @alpha\n */\nexport function GraphVisualization<T extends React.ElementType = 'div'>({\n nvlRef: rawNvlRef,\n nvlCallbacks,\n nvlOptions,\n sidepanel: rawSidepanel,\n nodes: rawNodes,\n rels: rawRels,\n highlightedNodeIds,\n highlightedRelationshipIds,\n topLeftIsland = DEFAULT_COMPONENTS.topLeftIsland,\n topRightIsland = DEFAULT_COMPONENTS.topRightIsland,\n bottomLeftIsland = DEFAULT_COMPONENTS.bottomLeftIsland,\n bottomRightIsland = DEFAULT_COMPONENTS.bottomRightIsland,\n gesture = 'single',\n setGesture,\n layout: rawLayout,\n setLayout: rawSetLayout,\n portalTarget,\n selected: rawSelected,\n setSelected: rawSetSelected,\n interactionMode: rawInteractionMode,\n setInteractionMode: rawSetInteractionMode,\n mouseEventCallbacks = {},\n className,\n style,\n htmlAttributes,\n ref,\n as,\n ...restProps\n}: GraphVisualizationProps<T>) {\n const nvlRef = useMemo(\n () => rawNvlRef ?? React.createRef<NVL>(),\n [rawNvlRef],\n );\n\n const instanceId = useId();\n\n // Respect NDL theme changes\n const { theme } = useNeedleTheme();\n const { bg, border, text } = tokens.theme[theme].color.neutral;\n\n // key required for nvl react responsiveness\n const [key, setKey] = useState(0);\n useEffect(() => {\n setKey((prevKey) => prevKey + 1);\n }, [theme]);\n\n // Semi-control interaction mode and selection state\n const [interactionMode, setInteractionMode] = useSemicontrolledState({\n isControlled: rawInteractionMode !== undefined,\n onChange: rawSetInteractionMode,\n state: rawInteractionMode ?? 'select',\n });\n const [selected, setSelected] = useSemicontrolledState({\n isControlled: rawSelected !== undefined,\n onChange: rawSetSelected,\n state: rawSelected ?? { nodeIds: [], relationshipIds: [] },\n });\n const [layout, setLayout] = useSemicontrolledState({\n isControlled: rawLayout !== undefined,\n onChange: rawSetLayout,\n state: rawLayout ?? 'd3Force',\n });\n\n const nvlGraph = useMemo(\n (): NvlGraph => mapToNvlGraph(rawNodes, rawRels),\n [rawNodes, rawRels],\n );\n\n const { nodesWithState, relsWithState, wrappedMouseEventCallbacks } =\n useManagedNodeState({\n gesture,\n highlightedNodeIds,\n highlightedRelationshipIds,\n interactionMode,\n mouseEventCallbacks,\n nvlGraph,\n selected,\n setInteractionMode,\n setSelected,\n });\n\n const [isSidePanelOpen, setIsSidePanelOpen] = useSemicontrolledState({\n isControlled: rawSidepanel?.isSidePanelOpen !== undefined,\n onChange: rawSidepanel?.setIsSidePanelOpen,\n state: rawSidepanel?.isSidePanelOpen ?? true,\n });\n const [sidePanelWidth, setSidePanelWidth] = useSemicontrolledState({\n isControlled: rawSidepanel?.sidePanelWidth !== undefined,\n onChange: rawSidepanel?.onSidePanelResize,\n state: rawSidepanel?.sidePanelWidth ?? 400,\n });\n\n const sidepanel = useMemo((): Sidepanel | null => {\n if (rawSidepanel === undefined) {\n return {\n children: <GraphVisualization.SingleSelectionSidePanelContents />,\n isSidePanelOpen,\n onSidePanelResize: setSidePanelWidth,\n setIsSidePanelOpen,\n sidePanelWidth,\n };\n }\n return rawSidepanel;\n }, [\n rawSidepanel,\n isSidePanelOpen,\n setIsSidePanelOpen,\n sidePanelWidth,\n setSidePanelWidth,\n ]);\n\n const Component: React.ElementType = as ?? 'div';\n return (\n <Component\n ref={ref}\n className={cx('ndl-graph-visualization-container', className)}\n style={style}\n {...htmlAttributes}\n >\n <GraphVisualizationContext.Provider\n value={{\n gesture,\n interactionMode,\n layout,\n nvlGraph,\n nvlInstance: nvlRef,\n portalTarget,\n selected,\n setGesture,\n setLayout,\n sidepanel,\n }}\n >\n <div className=\"ndl-graph-visualization\">\n <InteractiveNvlWrapper\n key={key}\n layout={layout}\n nodes={nodesWithState}\n rels={relsWithState}\n nvlOptions={{\n ...DEFAULT_NVL_OPTIONS,\n instanceId,\n styling: {\n defaultRelationshipColor: border.strongest,\n disabledItemColor: bg.strong,\n disabledItemFontColor: text.weakest,\n dropShadowColor: border.weak,\n selectedInnerBorderColor: bg.default,\n },\n ...nvlOptions,\n }}\n nvlCallbacks={{\n onLayoutComputing(isComputing) {\n if (!isComputing) {\n nvlRef.current?.fit(\n nvlRef.current.getNodes().map((neighbors) => neighbors.id),\n { noPan: true },\n );\n }\n },\n ...nvlCallbacks,\n }}\n mouseEventCallbacks={wrappedMouseEventCallbacks}\n ref={nvlRef}\n {...restProps}\n />\n {topLeftIsland !== null && (\n <InteractionIsland placement=\"top-left\">\n {topLeftIsland}\n </InteractionIsland>\n )}\n\n {topRightIsland !== null && (\n <InteractionIsland placement=\"top-right\">\n {topRightIsland}\n </InteractionIsland>\n )}\n\n {bottomLeftIsland !== null && (\n <InteractionIsland placement=\"bottom-left\">\n {bottomLeftIsland}\n </InteractionIsland>\n )}\n\n {bottomRightIsland !== null && (\n <InteractionIsland placement=\"bottom-right\">\n {bottomRightIsland}\n </InteractionIsland>\n )}\n </div>\n {sidepanel && <GraphVisualizationSidepanel sidepanel={sidepanel} />}\n </GraphVisualizationContext.Provider>\n </Component>\n );\n}\n\n/**\n * Zoom in button for use within a GraphVisualization component.\n *\n * @remarks\n * Increases zoom level by 1.3x\n *\n * @alpha\n */\nGraphVisualization.ZoomInButton = ZoomInButton;\n\n/**\n * Zoom out button for use within a GraphVisualization component.\n *\n * @remarks\n * Decreases zoom level by 0.7x\n *\n * @alpha\n */\nGraphVisualization.ZoomOutButton = ZoomOutButton;\n\n/**\n * Zoom to fit button for use within a GraphVisualization component.\n *\n * @remarks\n * Automatically adjusts zoom and pan to show all nodes and relationships\n *\n * @alpha\n */\nGraphVisualization.ZoomToFitButton = ZoomToFitButton;\n\n/**\n * Sidepanel toggle button for use within a GraphVisualization component.\n *\n * @remarks\n * Shows or hides the sidepanel containing node and relationship details.\n * Requires a sidepanel to be configured in the GraphVisualization component.\n *\n * @throws Error when used without a configured sidepanel\n *\n * @alpha\n */\nGraphVisualization.ToggleSidePanelButton = ToggleSidePanelButton;\n\n/**\n * Download button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a dropdown menu with download options. Currently supports PNG format.\n * Captures the current visualization state including zoom level.\n *\n * @alpha\n */\nGraphVisualization.DownloadButton = DownloadButton;\n\n/**\n * Box selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables box selection mode where dragging creates a rectangular selection area.\n * Disabled unless the `setGesture` callback is passed.\n * Shows active state when enabled and supports keyboard shortcut 'B'.\n *\n * @alpha\n */\nGraphVisualization.BoxSelectButton = BoxSelectButton;\n\n/**\n * Lasso selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables lasso selection mode where dragging creates a free-form selection area.\n * Disabled unless the `setGesture` callback is passed.\n * Shows active state when enabled and supports keyboard shortcut 'L'.\n *\n * @alpha\n */\nGraphVisualization.LassoSelectButton = LassoSelectButton;\n\n/**\n * Single node selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables single selection mode where clicking selects individual nodes or relationships.\n * Shows active state when enabled and supports keyboard shortcut 'S'.\n *\n * @alpha\n */\nGraphVisualization.SingleSelectButton = SingleSelectButton;\n\n/**\n * Search button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables search mode where clicking opens a search input for filtering nodes and relationships.\n *\n * @alpha\n */\nGraphVisualization.SearchButton = SearchButton;\n\n/**\n * Single node selection side panel for use within a GraphVisualization component.\n *\n * @remarks\n * Displays detailed information about the selected node or relationship.\n * Panel is automatically opened when a node or relationship is selected.\n * Also when user click on the show panel button in the top right corner.\n *\n * @alpha\n */\nGraphVisualization.SingleSelectionSidePanelContents =\n SingleSelectionSidepanelContents;\n\n/**\n * Layout selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a menu to select different graph layout algorithms.\n *\n * By default, the menu includes the **force-based** (`d3Force`) and\n * **hierarchical** layouts. Additional layouts can be enabled via configuration.\n *\n * @see {@link LayoutSelectOption} for the full set of layout options supported by NVL.\n *\n * @alpha\n */\nGraphVisualization.LayoutSelectButton = LayoutSelectButton;\n\n/**\n * Gesture selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a menu to select different interaction gestures.\n *\n * By default, the menu includes **single**, **box**, and **lasso** selection gestures.\n *\n * @see {@link GestureSelectOption} for the full set of gesture options supported by NVL.\n *\n * @alpha\n */\nGraphVisualization.GestureSelectButton = GestureSelectButton;\n"]}
|
|
@@ -93,7 +93,7 @@ const Component = () => {
|
|
|
93
93
|
const [gesture, setGesture] = (0, react_2.useState)('box');
|
|
94
94
|
// Hierarchical layout not working properly with storybook
|
|
95
95
|
const [layout, setLayout] = (0, react_2.useState)('hierarchical');
|
|
96
|
-
return ((0, jsx_runtime_1.jsx)("div", { style: { height: '600px' }, children: (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization, { gesture: gesture, setGesture: setGesture, layout: layout, setLayout: setLayout, bottomRightIsland: (0, jsx_runtime_1.jsxs)(react_1.IconButtonArray, { size: "medium", children: [(0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.GestureSelectButton, { menuPlacement: "top-end-bottom-end" }), (0, jsx_runtime_1.jsx)(react_1.Divider, { orientation: "vertical" }), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.ZoomInButton, {}), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.ZoomOutButton, {}), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.ZoomToFitButton, {}), (0, jsx_runtime_1.jsx)(react_1.Divider, { orientation: "vertical" }), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.LayoutSelectButton, { menuPlacement: "top-end-bottom-end" })] }), nodes: nodes, rels: rels, sidepanel: {
|
|
96
|
+
return ((0, jsx_runtime_1.jsx)("div", { style: { height: '600px' }, children: (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization, { gesture: gesture, setGesture: setGesture, layout: layout, setLayout: setLayout, bottomRightIsland: (0, jsx_runtime_1.jsxs)(react_1.IconButtonArray, { size: "medium", children: [(0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.GestureSelectButton, { menuPlacement: "top-end-bottom-end" }), (0, jsx_runtime_1.jsx)(react_1.Divider, { orientation: "vertical" }), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.ZoomInButton, { tooltipPlacement: "top" }), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.ZoomOutButton, { tooltipPlacement: "top" }), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.ZoomToFitButton, { tooltipPlacement: "top" }), (0, jsx_runtime_1.jsx)(react_1.Divider, { orientation: "vertical" }), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.LayoutSelectButton, { menuPlacement: "top-end-bottom-end" })] }), nodes: nodes, rels: rels, sidepanel: {
|
|
97
97
|
children: (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.SingleSelectionSidePanelContents, {}),
|
|
98
98
|
isSidePanelOpen: isOpen,
|
|
99
99
|
onSidePanelResize: () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"graph-visualization-maximalist.story.js","sourceRoot":"","sources":["../../../src/stories/graph-visualization-maximalist.story.tsx"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,4CAA4D;AAE5D,iCAAiC;AAEjC,gEAA4D;AAG5D,MAAM,KAAK,GAAc;IACvB;QACE,EAAE,EAAE,OAAO;QACX,MAAM,EAAE,CAAC,SAAS,EAAE,WAAW,CAAC;QAChC,UAAU,EAAE;YACV,mBAAmB,EAAE;gBACnB,WAAW,EAAE,oBAAoB;gBACjC,IAAI,EAAE,UAAU;aACjB;YACD,cAAc,EAAE;gBACd,WAAW,EAAE,0BAA0B;gBACvC,IAAI,EAAE,MAAM;aACb;YACD,UAAU,EAAE;gBACV,WAAW,EAAE,MAAM;gBACnB,IAAI,EAAE,MAAM;aACb;YACD,SAAS,EAAE;gBACT,WAAW,EAAE,MAAM;gBACnB,IAAI,EAAE,SAAS;aAChB;YACD,QAAQ,EAAE;gBACR,WAAW,EAAE,sCAAsC;gBACnD,IAAI,EAAE,OAAO;aACd;YACD,IAAI,EAAE;gBACJ,WAAW,EAAE,YAAY;gBACzB,IAAI,EAAE,QAAQ;aACf;YACD,MAAM,EAAE;gBACN,WAAW,EAAE,OAAO;gBACpB,IAAI,EAAE,OAAO;aACd;SACF;KACF;IACD;QACE,EAAE,EAAE,OAAO;QACX,MAAM,EAAE,CAAC,MAAM,CAAC;QAChB,UAAU,EAAE,EAAE,IAAI,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;KAChE;IACD;QACE,EAAE,EAAE,OAAO;QACX,MAAM,EAAE,CAAC,MAAM,CAAC;QAChB,UAAU,EAAE,EAAE,IAAI,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;KAChE;CACF,CAAC;AAEF,MAAM,IAAI,GAAG;IACX;QACE,IAAI,EAAE,OAAO;QACb,EAAE,EAAE,MAAM;QACV,UAAU,EAAE,EAAE;QACd,EAAE,EAAE,OAAO;QACX,IAAI,EAAE,UAAU;KACjB;IACD;QACE,IAAI,EAAE,OAAO;QACb,EAAE,EAAE,MAAM;QACV,UAAU,EAAE,EAAE;QACd,EAAE,EAAE,OAAO;QACX,IAAI,EAAE,UAAU;KACjB;CACF,CAAC;AAEW,QAAA,gBAAgB,GAC3B,oEAAoE,CAAC;AAEvE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,IAAI,CAAC,CAAC;IAC3C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAU,KAAK,CAAC,CAAC;IACvD,0DAA0D;IAC1D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAS,cAAc,CAAC,CAAC;IAE7D,OAAO,CACL,gCAAK,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,YAC7B,uBAAC,wCAAkB,IACjB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,iBAAiB,EACf,wBAAC,uBAAe,IAAC,IAAI,EAAC,QAAQ,aAC5B,uBAAC,wCAAkB,CAAC,mBAAmB,IAAC,aAAa,EAAC,oBAAoB,GAAG,EAC7E,uBAAC,eAAO,IAAC,WAAW,EAAC,UAAU,GAAG,EAClC,uBAAC,wCAAkB,CAAC,YAAY,
|
|
1
|
+
{"version":3,"file":"graph-visualization-maximalist.story.js","sourceRoot":"","sources":["../../../src/stories/graph-visualization-maximalist.story.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 { Divider, IconButtonArray } from '@neo4j-ndl/react';\nimport { type Layout } from '@neo4j-nvl/base';\nimport { useState } from 'react';\n\nimport { GraphVisualization } from '../graph-visualization';\nimport { type Gesture, type NeoNode } from '../graph-visualization-context';\n\nconst nodes: NeoNode[] = [\n {\n id: 'node1',\n labels: ['Pokemon', 'Legendary'],\n properties: {\n durationToWinBattle: {\n stringified: 'P0M0DT0.000000001S',\n type: 'duration',\n },\n favoriteColors: {\n stringified: '[\"red\", \"blue\", \"green\"]',\n type: 'list',\n },\n getsBeatBy: {\n stringified: 'null',\n type: 'null',\n },\n isAwesome: {\n stringified: 'true',\n type: 'boolean',\n },\n location: {\n stringified: 'point({srid:1, x:100, y:200, z:300})',\n type: 'point',\n },\n name: {\n stringified: '\"Rayquaza\"',\n type: 'string',\n },\n weight: {\n stringified: '392.0',\n type: 'float',\n },\n },\n },\n {\n id: 'node2',\n labels: ['Type'],\n properties: { name: { stringified: 'Dragon', type: 'String' } },\n },\n {\n id: 'node3',\n labels: ['Type'],\n properties: { name: { stringified: 'Flying', type: 'String' } },\n },\n];\n\nconst rels = [\n {\n from: 'node1',\n id: 'rel1',\n properties: {},\n to: 'node2',\n type: 'HAS_TYPE',\n },\n {\n from: 'node1',\n id: 'rel2',\n properties: {},\n to: 'node3',\n type: 'HAS_TYPE',\n },\n];\n\nexport const containerClasses =\n 'n-w-full n-border-neutral-border-weak n-mx-2 n-rounded-lg n-border';\n\nconst Component = () => {\n const [isOpen, setIsOpen] = useState(true);\n const [gesture, setGesture] = useState<Gesture>('box');\n // Hierarchical layout not working properly with storybook\n const [layout, setLayout] = useState<Layout>('hierarchical');\n\n return (\n <div style={{ height: '600px' }}>\n <GraphVisualization\n gesture={gesture}\n setGesture={setGesture}\n layout={layout}\n setLayout={setLayout}\n bottomRightIsland={\n <IconButtonArray size=\"medium\">\n <GraphVisualization.GestureSelectButton menuPlacement=\"top-end-bottom-end\" />\n <Divider orientation=\"vertical\" />\n <GraphVisualization.ZoomInButton tooltipPlacement=\"top\" />\n <GraphVisualization.ZoomOutButton tooltipPlacement=\"top\" />\n <GraphVisualization.ZoomToFitButton tooltipPlacement=\"top\" />\n <Divider orientation=\"vertical\" />\n <GraphVisualization.LayoutSelectButton menuPlacement=\"top-end-bottom-end\" />\n </IconButtonArray>\n }\n nodes={nodes}\n rels={rels}\n sidepanel={{\n children: <GraphVisualization.SingleSelectionSidePanelContents />,\n isSidePanelOpen: isOpen,\n onSidePanelResize: () => {\n /* no op */\n },\n setIsSidePanelOpen: setIsOpen,\n sidePanelWidth: 300,\n }}\n topLeftIsland={<GraphVisualization.DownloadButton />}\n topRightIsland={<GraphVisualization.ToggleSidePanelButton />}\n className={containerClasses}\n />\n </div>\n );\n};\n\nexport default Component;\n"]}
|
|
@@ -186,17 +186,20 @@ export const SearchButton = ({ className, style, htmlAttributes, tooltipPlacemen
|
|
|
186
186
|
}
|
|
187
187
|
},
|
|
188
188
|
} })) : (_jsx(IconButton, { size: "small", isFloating: true, onClick: () => setIsOpen((o) => !o), description: "Search", className: className, style: style, htmlAttributes: htmlAttributes, tooltipProps: {
|
|
189
|
-
root: {
|
|
189
|
+
root: {
|
|
190
|
+
isPortaled: false,
|
|
191
|
+
placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom',
|
|
192
|
+
},
|
|
190
193
|
}, children: _jsx(MagnifyingGlassIconOutline, {}) })) }));
|
|
191
194
|
};
|
|
192
195
|
export const DownloadButton = ({ className, style, htmlAttributes, tooltipPlacement, }) => {
|
|
193
|
-
const { nvlInstance } = useGraphVisualizationContext();
|
|
196
|
+
const { nvlInstance, portalTarget } = useGraphVisualizationContext();
|
|
194
197
|
const [isDownloadMenuOpen, setOpen] = useState(false);
|
|
195
198
|
const closeFileMenu = () => setOpen(false);
|
|
196
199
|
const downloadButtonRef = useRef(null);
|
|
197
200
|
return (_jsxs(_Fragment, { children: [_jsx(IconButton, { ref: downloadButtonRef, size: "small", isFloating: true, onClick: () => setOpen((o) => !o), description: "Download", tooltipProps: {
|
|
198
|
-
root: { placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
199
|
-
}, className: className, style: style, htmlAttributes: htmlAttributes, children: _jsx(ArrowDownTrayIconOutline, {}) }), _jsx(Menu, { isOpen: isDownloadMenuOpen, onClose: closeFileMenu, anchorRef: downloadButtonRef, children: _jsx(Menu.Item, { title: "Download as PNG", onClick: () => {
|
|
201
|
+
root: { isPortaled: false, placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
202
|
+
}, className: className, style: style, htmlAttributes: htmlAttributes, children: _jsx(ArrowDownTrayIconOutline, {}) }), _jsx(Menu, { isOpen: isDownloadMenuOpen, onClose: closeFileMenu, anchorRef: downloadButtonRef, portalTarget: portalTarget, children: _jsx(Menu.Item, { title: "Download as PNG", onClick: () => {
|
|
200
203
|
var _a;
|
|
201
204
|
(_a = nvlInstance.current) === null || _a === void 0 ? void 0 : _a.saveToFile({});
|
|
202
205
|
closeFileMenu();
|
|
@@ -216,10 +219,10 @@ export const LayoutSelectButton = ({ className, style, htmlAttributes, tooltipPl
|
|
|
216
219
|
var _a, _b;
|
|
217
220
|
const anchorRef = useRef(null);
|
|
218
221
|
const [isMenuOpen, setIsMenuOpen] = useState(false);
|
|
219
|
-
const { layout, setLayout } = useGraphVisualizationContext();
|
|
222
|
+
const { layout, setLayout, portalTarget } = useGraphVisualizationContext();
|
|
220
223
|
return (_jsxs(_Fragment, { children: [_jsx(SelectIconButton, { description: "Select layout", isOpen: isMenuOpen, onClick: () => setIsMenuOpen((old) => !old), ref: anchorRef, className: className, style: style, htmlAttributes: htmlAttributes, size: "small", tooltipProps: {
|
|
221
|
-
root: { placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
222
|
-
}, children: (_b = (_a = layoutOptions[layout]) === 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, children: Object.entries(layoutOptions).map(([key, item]) => (_jsx(Menu.RadioItem, { title: item.title, leadingVisual: item.icon, isChecked: key === layout, onClick: () => setLayout === null || setLayout === void 0 ? void 0 : setLayout(key) }, key))) })] }));
|
|
224
|
+
root: { isPortaled: false, placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
225
|
+
}, children: (_b = (_a = layoutOptions[layout]) === 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(layoutOptions).map(([key, item]) => (_jsx(Menu.RadioItem, { title: item.title, leadingVisual: item.icon, isChecked: key === layout, onClick: () => setLayout === null || setLayout === void 0 ? void 0 : setLayout(key) }, key))) })] }));
|
|
223
226
|
};
|
|
224
227
|
// oxlint-disable-next-line sort-keys
|
|
225
228
|
const DEFAULT_GESTURE_OPTIONS = {
|
|
@@ -240,10 +243,10 @@ export const GestureSelectButton = ({ className, style, htmlAttributes, tooltipP
|
|
|
240
243
|
var _a, _b;
|
|
241
244
|
const anchorRef = useRef(null);
|
|
242
245
|
const [isMenuOpen, setIsMenuOpen] = useState(false);
|
|
243
|
-
const { gesture, setGesture } = useGraphVisualizationContext();
|
|
246
|
+
const { gesture, setGesture, portalTarget } = useGraphVisualizationContext();
|
|
244
247
|
useRegisterKeyboardGestureSwitcher(Object.keys(gestureOptions));
|
|
245
248
|
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: {
|
|
246
|
-
root: { placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
247
|
-
}, 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, 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))) })] }));
|
|
249
|
+
root: { isPortaled: false, placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
|
|
250
|
+
}, 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))) })] }));
|
|
248
251
|
};
|
|
249
252
|
//# 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 ExploreIcon,\n FitToScreenIcon,\n HierarchyTwoIcon,\n LassoIcon,\n MagnifyingGlassIconOutline,\n MagnifyingGlassMinusIconOutline,\n MagnifyingGlassPlusIconOutline,\n PanelRightIcon,\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={isSidePanelOpen ? 'Close' : 'Open'}\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 node properties panel',\n ...htmlAttributes,\n }}\n >\n <PanelRightIcon className=\"ndl-graph-visualization-toggle-icon\" />\n </IconButton>\n );\n};\n\ntype SearchButtonProps = GraphVisualizationButtonProps & {\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 const rawNodes = Object.values(nvlGraph.dataLookupTable.nodes);\n const rawRels = Object.values(nvlGraph.dataLookupTable.relationships);\n\n onSearch(searchNodes(rawNodes, newValue), searchRels(rawRels, 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: { placement: tooltipPlacement ?? 'bottom' },\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 } = 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: { 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 >\n <Menu.Item\n title=\"Download as PNG\"\n onClick={() => {\n nvlInstance.current?.saveToFile({});\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 } = 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: { 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 >\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 } = 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: { 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 >\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 ExploreIcon,\n FitToScreenIcon,\n HierarchyTwoIcon,\n LassoIcon,\n MagnifyingGlassIconOutline,\n MagnifyingGlassMinusIconOutline,\n MagnifyingGlassPlusIconOutline,\n PanelRightIcon,\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={isSidePanelOpen ? 'Close' : 'Open'}\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 node properties panel',\n ...htmlAttributes,\n }}\n >\n <PanelRightIcon className=\"ndl-graph-visualization-toggle-icon\" />\n </IconButton>\n );\n};\n\ntype SearchButtonProps = GraphVisualizationButtonProps & {\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 const rawNodes = Object.values(nvlGraph.dataLookupTable.nodes);\n const rawRels = Object.values(nvlGraph.dataLookupTable.relationships);\n\n onSearch(searchNodes(rawNodes, newValue), searchRels(rawRels, 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>\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 +1 @@
|
|
|
1
|
-
{"version":3,"file":"graph-visualization-context.js","sourceRoot":"","sources":["../../src/graph-visualization-context.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAIH,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"graph-visualization-context.js","sourceRoot":"","sources":["../../src/graph-visualization-context.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAIH,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AA0ElD,MAAM,CAAC,MAAM,yBAAyB,GAAG,aAAa,CAEpD,SAAS,CAAC,CAAC;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,GAAG,EAAE;IAC/C,MAAM,OAAO,GAAG,UAAU,CAAC,yBAAyB,CAAC,CAAC;IACtD,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,MAAM,IAAI,KAAK,CACb,8EAA8E,CAC/E,CAAC;IACJ,CAAC;IACD,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC","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 type NVL from '@neo4j-nvl/base';\nimport { type Layout, type Node, type Relationship } from '@neo4j-nvl/base';\nimport { createContext, useContext } from 'react';\n\nexport type GraphSelection = { nodeIds: string[]; relationshipIds: string[] };\nexport type Sidepanel = {\n children: React.ReactNode;\n isSidePanelOpen: boolean;\n setIsSidePanelOpen?: (isSidePanelOpen: boolean) => void;\n sidePanelWidth?: number;\n onSidePanelResize: (width: number) => void;\n minWidth?: number;\n};\n\nexport type NvlGraph = {\n nodes: Node[];\n rels: Relationship[];\n dataLookupTable: DataLookupTable;\n};\n\nexport type GraphItemMetaData = { totalCount: number; mostCommonColor: string };\nexport type DataLookupTable = {\n nodes: Record<string, NodeData>;\n relationships: Record<string, RelData>;\n labels: string[];\n types: string[];\n labelMetaData: Record<string, GraphItemMetaData>;\n typeMetaData: Record<string, GraphItemMetaData>;\n};\n\n// We use this type to avoid coupling the graph visualization component to the neo4j driver types\n// The tradeoff is that it's limited to displaying values and not manipulating them\n// and that it's harder to pass to the graph visualization component from the raw driver result\nexport type PortableProperty = { stringified: string; type: string };\n\nexport type NodeData = {\n labelsSorted: string[];\n properties: Record<string, PortableProperty>;\n color: string;\n id: string;\n};\nexport type RelData = {\n type: string;\n properties: Record<string, PortableProperty>;\n color: string;\n id: string;\n};\n\nexport type NeoNode = Node & {\n properties: Record<string, PortableProperty>;\n labels: string[];\n};\nexport type NeoRel = Relationship & {\n properties: Record<string, PortableProperty>;\n type: string;\n};\n\n/**\n * Data that is shared across the graph visualization component.\n *\n * @see {@link useGraphVisualizationContext}\n * @alpha\n */\nexport type GraphVisualizationContextData = {\n nvlInstance: React.MutableRefObject<NVL | null>;\n sidepanel: Sidepanel | null;\n gesture: Gesture;\n setGesture?: (gesture: Gesture) => void;\n interactionMode: InteractionMode;\n nvlGraph: NvlGraph;\n selected: GraphSelection;\n layout: Layout;\n setLayout?: (layout: Layout) => void;\n portalTarget?: HTMLElement | null;\n};\n\nexport const GraphVisualizationContext = createContext<\n GraphVisualizationContextData | undefined\n>(undefined);\n\n/**\n * Hook to access the graph visualization context.\n *\n * This hook is used to implement custom UI components like buttons, panels, and controls\n * that need access to data and functionality from the graph visualization component.\n * @see {@link GraphVisualizationContextData}\n *\n * @returns The graph visualization context containing NVL instance, sidepanel, gestures, and graph data\n * @throws Error if used outside of a GraphVisualizationContext provider\n *\n * @example\n * ```tsx\n * const NodeLoggerButton = () => {\n * const { selected } = useGraphVisualizationContext();\n *\n * const handleClick = () => {\n * console.log('Selected nodes:', selected.nodeIds);\n * };\n *\n * return (\n * <button onClick={handleClick}>\n * Log Selected Nodes ({selected.nodeIds.length})\n * </button>\n * );\n * };\n * ```\n * @alpha\n */\nexport const useGraphVisualizationContext = () => {\n const context = useContext(GraphVisualizationContext);\n if (!context) {\n throw new Error(\n 'useGraphVisualizationContext must be used within a GraphVisualizationContext',\n );\n }\n return context;\n};\n\nexport type Gesture = 'single' | 'box' | 'lasso';\n\nexport type InteractionMode =\n | 'select'\n | 'draw'\n | 'edit-text'\n | 'pan'\n | 'drag'\n | 'none';\n"]}
|
|
@@ -124,7 +124,7 @@ const DEFAULT_COMPONENTS = {
|
|
|
124
124
|
*/
|
|
125
125
|
export function GraphVisualization(_a) {
|
|
126
126
|
var _b, _c;
|
|
127
|
-
var { nvlRef: rawNvlRef, nvlCallbacks, nvlOptions, sidepanel: rawSidepanel, nodes: rawNodes, rels: rawRels, highlightedNodeIds, highlightedRelationshipIds, topLeftIsland = DEFAULT_COMPONENTS.topLeftIsland, topRightIsland = DEFAULT_COMPONENTS.topRightIsland, bottomLeftIsland = DEFAULT_COMPONENTS.bottomLeftIsland, bottomRightIsland = DEFAULT_COMPONENTS.bottomRightIsland, gesture = 'single', setGesture, layout: rawLayout, setLayout: rawSetLayout, selected: rawSelected, setSelected: rawSetSelected, interactionMode: rawInteractionMode, setInteractionMode: rawSetInteractionMode, mouseEventCallbacks = {}, className, style, htmlAttributes, ref, as } = _a, restProps = __rest(_a, ["nvlRef", "nvlCallbacks", "nvlOptions", "sidepanel", "nodes", "rels", "highlightedNodeIds", "highlightedRelationshipIds", "topLeftIsland", "topRightIsland", "bottomLeftIsland", "bottomRightIsland", "gesture", "setGesture", "layout", "setLayout", "selected", "setSelected", "interactionMode", "setInteractionMode", "mouseEventCallbacks", "className", "style", "htmlAttributes", "ref", "as"]);
|
|
127
|
+
var { nvlRef: rawNvlRef, nvlCallbacks, nvlOptions, sidepanel: rawSidepanel, nodes: rawNodes, rels: rawRels, highlightedNodeIds, highlightedRelationshipIds, topLeftIsland = DEFAULT_COMPONENTS.topLeftIsland, topRightIsland = DEFAULT_COMPONENTS.topRightIsland, bottomLeftIsland = DEFAULT_COMPONENTS.bottomLeftIsland, bottomRightIsland = DEFAULT_COMPONENTS.bottomRightIsland, gesture = 'single', setGesture, layout: rawLayout, setLayout: rawSetLayout, portalTarget, selected: rawSelected, setSelected: rawSetSelected, interactionMode: rawInteractionMode, setInteractionMode: rawSetInteractionMode, mouseEventCallbacks = {}, className, style, htmlAttributes, ref, as } = _a, restProps = __rest(_a, ["nvlRef", "nvlCallbacks", "nvlOptions", "sidepanel", "nodes", "rels", "highlightedNodeIds", "highlightedRelationshipIds", "topLeftIsland", "topRightIsland", "bottomLeftIsland", "bottomRightIsland", "gesture", "setGesture", "layout", "setLayout", "portalTarget", "selected", "setSelected", "interactionMode", "setInteractionMode", "mouseEventCallbacks", "className", "style", "htmlAttributes", "ref", "as"]);
|
|
128
128
|
const nvlRef = useMemo(() => rawNvlRef !== null && rawNvlRef !== void 0 ? rawNvlRef : React.createRef(), [rawNvlRef]);
|
|
129
129
|
const instanceId = useId();
|
|
130
130
|
// Respect NDL theme changes
|
|
@@ -198,6 +198,7 @@ export function GraphVisualization(_a) {
|
|
|
198
198
|
layout,
|
|
199
199
|
nvlGraph,
|
|
200
200
|
nvlInstance: nvlRef,
|
|
201
|
+
portalTarget,
|
|
201
202
|
selected,
|
|
202
203
|
setGesture,
|
|
203
204
|
setLayout,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"graph-visualization.js","sourceRoot":"","sources":["../../src/graph-visualization.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 { tokens } from '@neo4j-ndl/base';\nimport { IconButtonArray, useNeedleTheme } from '@neo4j-ndl/react';\nimport type NVL from '@neo4j-nvl/base';\nimport { type Layout } from '@neo4j-nvl/base';\nimport {\n InteractiveNvlWrapper,\n type InteractiveNvlWrapperProps,\n} from '@neo4j-nvl/react';\nimport { default as cx } from 'classnames';\nimport React, { useEffect, useId, useMemo, useState } from 'react';\n\nimport {\n BoxSelectButton,\n DownloadButton,\n GestureSelectButton,\n LassoSelectButton,\n LayoutSelectButton,\n SearchButton,\n SingleSelectButton,\n ToggleSidePanelButton,\n ZoomInButton,\n ZoomOutButton,\n ZoomToFitButton,\n} from './graph-visualization-buttons';\nimport {\n type Gesture,\n type GraphSelection,\n GraphVisualizationContext,\n type InteractionMode,\n type NeoNode,\n type NeoRel,\n type NvlGraph,\n type Sidepanel,\n} from './graph-visualization-context';\nimport { GraphVisualizationSidepanel } from './graph-visualization-sidepanel';\nimport { mapToNvlGraph } from './map-to-nvl-graph';\nimport { SingleSelectionSidepanelContents } from './sidepanel-components/single-selection-sidepanel-contents';\nimport { useManagedNodeState } from './use-managed-node-state';\nimport { useSemicontrolledState } from './use-semi-controlled-state';\n\ntype Placement = 'top-right' | 'bottom-right' | 'top-left' | 'bottom-left';\n\nconst PLACEMENTS: Record<Placement, string> = {\n 'bottom-left': 'ndl-graph-visualization-interaction-island ndl-bottom-left',\n 'bottom-right': 'ndl-graph-visualization-interaction-island ndl-bottom-right',\n 'top-left': 'ndl-graph-visualization-interaction-island ndl-top-left',\n 'top-right': 'ndl-graph-visualization-interaction-island ndl-top-right',\n};\n\nconst InteractionIsland = ({\n children,\n className,\n placement,\n}: {\n children: React.ReactNode;\n placement: Placement;\n className?: string;\n}) => {\n return <div className={cx(PLACEMENTS[placement], className)}>{children}</div>;\n};\n\nexport const DEFAULT_NVL_OPTIONS = {\n disableTelemetry: true,\n disableWebGL: true,\n maxZoom: 3,\n minZoom: 0.05,\n relationshipThreshold: 0.55,\n};\n\nconst DEFAULT_COMPONENTS = {\n bottomLeftIsland: null,\n bottomRightIsland: (\n <IconButtonArray orientation=\"vertical\" isFloating size=\"small\">\n <ZoomInButton /> <ZoomOutButton /> <ZoomToFitButton />\n </IconButtonArray>\n ),\n topLeftIsland: null,\n topRightIsland: (\n <div className=\"ndl-graph-visualization-default-download-group\">\n <DownloadButton /> <ToggleSidePanelButton />\n </div>\n ),\n};\n\nexport type GraphVisualizationProps<T extends React.ElementType = 'div'> = {\n nvlRef?: React.RefObject<NVL | null>;\n sidepanel?: Sidepanel | null;\n bottomLeftIsland?: React.ReactNode;\n bottomRightIsland?: React.ReactNode;\n topLeftIsland?: React.ReactNode;\n topRightIsland?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n\n gesture?: Gesture;\n setGesture?: (gesture: Gesture) => void;\n selected?: GraphSelection;\n setSelected?: (newSelection: GraphSelection) => void;\n interactionMode?: InteractionMode;\n setInteractionMode?: (interactionMode: InteractionMode) => void;\n layout?: Layout;\n setLayout?: (layout: Layout) => void;\n\n nodes: NeoNode[];\n rels: NeoRel[];\n\n highlightedNodeIds?: string[];\n highlightedRelationshipIds?: string[];\n\n as?: T;\n ref?: React.ComponentPropsWithRef<T>['ref'];\n htmlAttributes?: React.HTMLAttributes<T>;\n} & InteractiveNvlWrapperProps;\n\n/**\n * A comprehensive graph visualization component for rendering Neo4j-style graphs with interactive features.\n *\n * @remarks\n * This component provides a complete graph visualization solution with built-in interaction modes,\n * selection handling, zoom controls, and an optional sidepanel. It wraps the NVL (Neo4j Visualization Library)\n * with additional UI controls and state management.\n *\n * The component supports various interaction modes including single selection, box selection, and lasso selection.\n * It also provides customizable UI islands for placing controls at different corners of the visualization.\n *\n * @example\n * Basic usage:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * selected={selection}\n * setSelected={setSelection}\n * />\n * ```\n *\n * @example\n * With custom controls:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * topRightIsland={<CustomControls />}\n * sidepanel={{\n * contents: <CustomSidepanel />,\n * isSidePanelOpen: true,\n * setIsSidePanelOpen: setSidepanelOpen\n * sidePanelWidth: 400,\n * onSidePanelResize: setSidepanelWidth,\n * }}\n * />\n * ```\n *\n * @example\n * With highlighting:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * // undefined = no highlighting (default behavior)\n * // empty array = no search matches (dims all nodes)\n * // array with IDs = highlight only those items\n * highlightedNodeIds={searchResults.nodeIds}\n * highlightedRelationshipIds={searchResults.relationshipIds}\n * />\n * ```\n *\n * @param props - {@link GraphVisualizationProps}\n * @returns A React component that renders an interactive graph visualization\n *\n * @alpha\n */\nexport function GraphVisualization<T extends React.ElementType = 'div'>({\n nvlRef: rawNvlRef,\n nvlCallbacks,\n nvlOptions,\n sidepanel: rawSidepanel,\n nodes: rawNodes,\n rels: rawRels,\n highlightedNodeIds,\n highlightedRelationshipIds,\n topLeftIsland = DEFAULT_COMPONENTS.topLeftIsland,\n topRightIsland = DEFAULT_COMPONENTS.topRightIsland,\n bottomLeftIsland = DEFAULT_COMPONENTS.bottomLeftIsland,\n bottomRightIsland = DEFAULT_COMPONENTS.bottomRightIsland,\n gesture = 'single',\n setGesture,\n layout: rawLayout,\n setLayout: rawSetLayout,\n selected: rawSelected,\n setSelected: rawSetSelected,\n interactionMode: rawInteractionMode,\n setInteractionMode: rawSetInteractionMode,\n mouseEventCallbacks = {},\n className,\n style,\n htmlAttributes,\n ref,\n as,\n ...restProps\n}: GraphVisualizationProps<T>) {\n const nvlRef = useMemo(\n () => rawNvlRef ?? React.createRef<NVL>(),\n [rawNvlRef],\n );\n\n const instanceId = useId();\n\n // Respect NDL theme changes\n const { theme } = useNeedleTheme();\n const { bg, border, text } = tokens.theme[theme].color.neutral;\n\n // key required for nvl react responsiveness\n const [key, setKey] = useState(0);\n useEffect(() => {\n setKey((prevKey) => prevKey + 1);\n }, [theme]);\n\n // Semi-control interaction mode and selection state\n const [interactionMode, setInteractionMode] = useSemicontrolledState({\n isControlled: rawInteractionMode !== undefined,\n onChange: rawSetInteractionMode,\n state: rawInteractionMode ?? 'select',\n });\n const [selected, setSelected] = useSemicontrolledState({\n isControlled: rawSelected !== undefined,\n onChange: rawSetSelected,\n state: rawSelected ?? { nodeIds: [], relationshipIds: [] },\n });\n const [layout, setLayout] = useSemicontrolledState({\n isControlled: rawLayout !== undefined,\n onChange: rawSetLayout,\n state: rawLayout ?? 'd3Force',\n });\n\n const nvlGraph = useMemo(\n (): NvlGraph => mapToNvlGraph(rawNodes, rawRels),\n [rawNodes, rawRels],\n );\n\n const { nodesWithState, relsWithState, wrappedMouseEventCallbacks } =\n useManagedNodeState({\n gesture,\n highlightedNodeIds,\n highlightedRelationshipIds,\n interactionMode,\n mouseEventCallbacks,\n nvlGraph,\n selected,\n setInteractionMode,\n setSelected,\n });\n\n const [isSidePanelOpen, setIsSidePanelOpen] = useSemicontrolledState({\n isControlled: rawSidepanel?.isSidePanelOpen !== undefined,\n onChange: rawSidepanel?.setIsSidePanelOpen,\n state: rawSidepanel?.isSidePanelOpen ?? true,\n });\n const [sidePanelWidth, setSidePanelWidth] = useSemicontrolledState({\n isControlled: rawSidepanel?.sidePanelWidth !== undefined,\n onChange: rawSidepanel?.onSidePanelResize,\n state: rawSidepanel?.sidePanelWidth ?? 400,\n });\n\n const sidepanel = useMemo((): Sidepanel | null => {\n if (rawSidepanel === undefined) {\n return {\n children: <GraphVisualization.SingleSelectionSidePanelContents />,\n isSidePanelOpen,\n onSidePanelResize: setSidePanelWidth,\n setIsSidePanelOpen,\n sidePanelWidth,\n };\n }\n return rawSidepanel;\n }, [\n rawSidepanel,\n isSidePanelOpen,\n setIsSidePanelOpen,\n sidePanelWidth,\n setSidePanelWidth,\n ]);\n\n const Component: React.ElementType = as ?? 'div';\n return (\n <Component\n ref={ref}\n className={cx('ndl-graph-visualization-container', className)}\n style={style}\n {...htmlAttributes}\n >\n <GraphVisualizationContext.Provider\n value={{\n gesture,\n interactionMode,\n layout,\n nvlGraph,\n nvlInstance: nvlRef,\n selected,\n setGesture,\n setLayout,\n sidepanel,\n }}\n >\n <div className=\"ndl-graph-visualization\">\n <InteractiveNvlWrapper\n key={key}\n layout={layout}\n nodes={nodesWithState}\n rels={relsWithState}\n nvlOptions={{\n ...DEFAULT_NVL_OPTIONS,\n instanceId,\n styling: {\n defaultRelationshipColor: border.strongest,\n disabledItemColor: bg.strong,\n disabledItemFontColor: text.weakest,\n dropShadowColor: border.weak,\n selectedInnerBorderColor: bg.default,\n },\n ...nvlOptions,\n }}\n nvlCallbacks={{\n onLayoutComputing(isComputing) {\n if (!isComputing) {\n nvlRef.current?.fit(\n nvlRef.current.getNodes().map((neighbors) => neighbors.id),\n { noPan: true },\n );\n }\n },\n ...nvlCallbacks,\n }}\n mouseEventCallbacks={wrappedMouseEventCallbacks}\n ref={nvlRef}\n {...restProps}\n />\n {topLeftIsland !== null && (\n <InteractionIsland placement=\"top-left\">\n {topLeftIsland}\n </InteractionIsland>\n )}\n\n {topRightIsland !== null && (\n <InteractionIsland placement=\"top-right\">\n {topRightIsland}\n </InteractionIsland>\n )}\n\n {bottomLeftIsland !== null && (\n <InteractionIsland placement=\"bottom-left\">\n {bottomLeftIsland}\n </InteractionIsland>\n )}\n\n {bottomRightIsland !== null && (\n <InteractionIsland placement=\"bottom-right\">\n {bottomRightIsland}\n </InteractionIsland>\n )}\n </div>\n {sidepanel && <GraphVisualizationSidepanel sidepanel={sidepanel} />}\n </GraphVisualizationContext.Provider>\n </Component>\n );\n}\n\n/**\n * Zoom in button for use within a GraphVisualization component.\n *\n * @remarks\n * Increases zoom level by 1.3x\n *\n * @alpha\n */\nGraphVisualization.ZoomInButton = ZoomInButton;\n\n/**\n * Zoom out button for use within a GraphVisualization component.\n *\n * @remarks\n * Decreases zoom level by 0.7x\n *\n * @alpha\n */\nGraphVisualization.ZoomOutButton = ZoomOutButton;\n\n/**\n * Zoom to fit button for use within a GraphVisualization component.\n *\n * @remarks\n * Automatically adjusts zoom and pan to show all nodes and relationships\n *\n * @alpha\n */\nGraphVisualization.ZoomToFitButton = ZoomToFitButton;\n\n/**\n * Sidepanel toggle button for use within a GraphVisualization component.\n *\n * @remarks\n * Shows or hides the sidepanel containing node and relationship details.\n * Requires a sidepanel to be configured in the GraphVisualization component.\n *\n * @throws Error when used without a configured sidepanel\n *\n * @alpha\n */\nGraphVisualization.ToggleSidePanelButton = ToggleSidePanelButton;\n\n/**\n * Download button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a dropdown menu with download options. Currently supports PNG format.\n * Captures the current visualization state including zoom level.\n *\n * @alpha\n */\nGraphVisualization.DownloadButton = DownloadButton;\n\n/**\n * Box selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables box selection mode where dragging creates a rectangular selection area.\n * Disabled unless the `setGesture` callback is passed.\n * Shows active state when enabled and supports keyboard shortcut 'B'.\n *\n * @alpha\n */\nGraphVisualization.BoxSelectButton = BoxSelectButton;\n\n/**\n * Lasso selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables lasso selection mode where dragging creates a free-form selection area.\n * Disabled unless the `setGesture` callback is passed.\n * Shows active state when enabled and supports keyboard shortcut 'L'.\n *\n * @alpha\n */\nGraphVisualization.LassoSelectButton = LassoSelectButton;\n\n/**\n * Single node selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables single selection mode where clicking selects individual nodes or relationships.\n * Shows active state when enabled and supports keyboard shortcut 'S'.\n *\n * @alpha\n */\nGraphVisualization.SingleSelectButton = SingleSelectButton;\n\n/**\n * Search button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables search mode where clicking opens a search input for filtering nodes and relationships.\n *\n * @alpha\n */\nGraphVisualization.SearchButton = SearchButton;\n\n/**\n * Single node selection side panel for use within a GraphVisualization component.\n *\n * @remarks\n * Displays detailed information about the selected node or relationship.\n * Panel is automatically opened when a node or relationship is selected.\n * Also when user click on the show panel button in the top right corner.\n *\n * @alpha\n */\nGraphVisualization.SingleSelectionSidePanelContents =\n SingleSelectionSidepanelContents;\n\n/**\n * Layout selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a menu to select different graph layout algorithms.\n *\n * By default, the menu includes the **force-based** (`d3Force`) and\n * **hierarchical** layouts. Additional layouts can be enabled via configuration.\n *\n * @see {@link LayoutSelectOption} for the full set of layout options supported by NVL.\n *\n * @alpha\n */\nGraphVisualization.LayoutSelectButton = LayoutSelectButton;\n\n/**\n * Gesture selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a menu to select different interaction gestures.\n *\n * By default, the menu includes **single**, **box**, and **lasso** selection gestures.\n *\n * @see {@link GestureSelectOption} for the full set of gesture options supported by NVL.\n *\n * @alpha\n */\nGraphVisualization.GestureSelectButton = GestureSelectButton;\n"]}
|
|
1
|
+
{"version":3,"file":"graph-visualization.js","sourceRoot":"","sources":["../../src/graph-visualization.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 { tokens } from '@neo4j-ndl/base';\nimport { IconButtonArray, useNeedleTheme } from '@neo4j-ndl/react';\nimport type NVL from '@neo4j-nvl/base';\nimport { type Layout } from '@neo4j-nvl/base';\nimport {\n InteractiveNvlWrapper,\n type InteractiveNvlWrapperProps,\n} from '@neo4j-nvl/react';\nimport { default as cx } from 'classnames';\nimport React, { useEffect, useId, useMemo, useState } from 'react';\n\nimport {\n BoxSelectButton,\n DownloadButton,\n GestureSelectButton,\n LassoSelectButton,\n LayoutSelectButton,\n SearchButton,\n SingleSelectButton,\n ToggleSidePanelButton,\n ZoomInButton,\n ZoomOutButton,\n ZoomToFitButton,\n} from './graph-visualization-buttons';\nimport {\n type Gesture,\n type GraphSelection,\n GraphVisualizationContext,\n type InteractionMode,\n type NeoNode,\n type NeoRel,\n type NvlGraph,\n type Sidepanel,\n} from './graph-visualization-context';\nimport { GraphVisualizationSidepanel } from './graph-visualization-sidepanel';\nimport { mapToNvlGraph } from './map-to-nvl-graph';\nimport { SingleSelectionSidepanelContents } from './sidepanel-components/single-selection-sidepanel-contents';\nimport { useManagedNodeState } from './use-managed-node-state';\nimport { useSemicontrolledState } from './use-semi-controlled-state';\n\ntype Placement = 'top-right' | 'bottom-right' | 'top-left' | 'bottom-left';\n\nconst PLACEMENTS: Record<Placement, string> = {\n 'bottom-left': 'ndl-graph-visualization-interaction-island ndl-bottom-left',\n 'bottom-right': 'ndl-graph-visualization-interaction-island ndl-bottom-right',\n 'top-left': 'ndl-graph-visualization-interaction-island ndl-top-left',\n 'top-right': 'ndl-graph-visualization-interaction-island ndl-top-right',\n};\n\nconst InteractionIsland = ({\n children,\n className,\n placement,\n}: {\n children: React.ReactNode;\n placement: Placement;\n className?: string;\n}) => {\n return <div className={cx(PLACEMENTS[placement], className)}>{children}</div>;\n};\n\nexport const DEFAULT_NVL_OPTIONS = {\n disableTelemetry: true,\n disableWebGL: true,\n maxZoom: 3,\n minZoom: 0.05,\n relationshipThreshold: 0.55,\n};\n\nconst DEFAULT_COMPONENTS = {\n bottomLeftIsland: null,\n bottomRightIsland: (\n <IconButtonArray orientation=\"vertical\" isFloating size=\"small\">\n <ZoomInButton /> <ZoomOutButton /> <ZoomToFitButton />\n </IconButtonArray>\n ),\n topLeftIsland: null,\n topRightIsland: (\n <div className=\"ndl-graph-visualization-default-download-group\">\n <DownloadButton /> <ToggleSidePanelButton />\n </div>\n ),\n};\n\nexport type GraphVisualizationProps<T extends React.ElementType = 'div'> = {\n nvlRef?: React.RefObject<NVL | null>;\n sidepanel?: Sidepanel | null;\n bottomLeftIsland?: React.ReactNode;\n bottomRightIsland?: React.ReactNode;\n topLeftIsland?: React.ReactNode;\n topRightIsland?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n\n gesture?: Gesture;\n setGesture?: (gesture: Gesture) => void;\n selected?: GraphSelection;\n setSelected?: (newSelection: GraphSelection) => void;\n interactionMode?: InteractionMode;\n setInteractionMode?: (interactionMode: InteractionMode) => void;\n layout?: Layout;\n setLayout?: (layout: Layout) => void;\n\n portalTarget?: HTMLElement | null;\n\n nodes: NeoNode[];\n rels: NeoRel[];\n\n highlightedNodeIds?: string[];\n highlightedRelationshipIds?: string[];\n\n as?: T;\n ref?: React.ComponentPropsWithRef<T>['ref'];\n htmlAttributes?: React.HTMLAttributes<T>;\n} & InteractiveNvlWrapperProps;\n\n/**\n * A comprehensive graph visualization component for rendering Neo4j-style graphs with interactive features.\n *\n * @remarks\n * This component provides a complete graph visualization solution with built-in interaction modes,\n * selection handling, zoom controls, and an optional sidepanel. It wraps the NVL (Neo4j Visualization Library)\n * with additional UI controls and state management.\n *\n * The component supports various interaction modes including single selection, box selection, and lasso selection.\n * It also provides customizable UI islands for placing controls at different corners of the visualization.\n *\n * @example\n * Basic usage:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * selected={selection}\n * setSelected={setSelection}\n * />\n * ```\n *\n * @example\n * With custom controls:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * topRightIsland={<CustomControls />}\n * sidepanel={{\n * contents: <CustomSidepanel />,\n * isSidePanelOpen: true,\n * setIsSidePanelOpen: setSidepanelOpen\n * sidePanelWidth: 400,\n * onSidePanelResize: setSidepanelWidth,\n * }}\n * />\n * ```\n *\n * @example\n * With highlighting:\n * ```tsx\n * <GraphVisualization\n * nodes={nodes}\n * rels={relationships}\n * // undefined = no highlighting (default behavior)\n * // empty array = no search matches (dims all nodes)\n * // array with IDs = highlight only those items\n * highlightedNodeIds={searchResults.nodeIds}\n * highlightedRelationshipIds={searchResults.relationshipIds}\n * />\n * ```\n *\n * @param props - {@link GraphVisualizationProps}\n * @returns A React component that renders an interactive graph visualization\n *\n * @alpha\n */\nexport function GraphVisualization<T extends React.ElementType = 'div'>({\n nvlRef: rawNvlRef,\n nvlCallbacks,\n nvlOptions,\n sidepanel: rawSidepanel,\n nodes: rawNodes,\n rels: rawRels,\n highlightedNodeIds,\n highlightedRelationshipIds,\n topLeftIsland = DEFAULT_COMPONENTS.topLeftIsland,\n topRightIsland = DEFAULT_COMPONENTS.topRightIsland,\n bottomLeftIsland = DEFAULT_COMPONENTS.bottomLeftIsland,\n bottomRightIsland = DEFAULT_COMPONENTS.bottomRightIsland,\n gesture = 'single',\n setGesture,\n layout: rawLayout,\n setLayout: rawSetLayout,\n portalTarget,\n selected: rawSelected,\n setSelected: rawSetSelected,\n interactionMode: rawInteractionMode,\n setInteractionMode: rawSetInteractionMode,\n mouseEventCallbacks = {},\n className,\n style,\n htmlAttributes,\n ref,\n as,\n ...restProps\n}: GraphVisualizationProps<T>) {\n const nvlRef = useMemo(\n () => rawNvlRef ?? React.createRef<NVL>(),\n [rawNvlRef],\n );\n\n const instanceId = useId();\n\n // Respect NDL theme changes\n const { theme } = useNeedleTheme();\n const { bg, border, text } = tokens.theme[theme].color.neutral;\n\n // key required for nvl react responsiveness\n const [key, setKey] = useState(0);\n useEffect(() => {\n setKey((prevKey) => prevKey + 1);\n }, [theme]);\n\n // Semi-control interaction mode and selection state\n const [interactionMode, setInteractionMode] = useSemicontrolledState({\n isControlled: rawInteractionMode !== undefined,\n onChange: rawSetInteractionMode,\n state: rawInteractionMode ?? 'select',\n });\n const [selected, setSelected] = useSemicontrolledState({\n isControlled: rawSelected !== undefined,\n onChange: rawSetSelected,\n state: rawSelected ?? { nodeIds: [], relationshipIds: [] },\n });\n const [layout, setLayout] = useSemicontrolledState({\n isControlled: rawLayout !== undefined,\n onChange: rawSetLayout,\n state: rawLayout ?? 'd3Force',\n });\n\n const nvlGraph = useMemo(\n (): NvlGraph => mapToNvlGraph(rawNodes, rawRels),\n [rawNodes, rawRels],\n );\n\n const { nodesWithState, relsWithState, wrappedMouseEventCallbacks } =\n useManagedNodeState({\n gesture,\n highlightedNodeIds,\n highlightedRelationshipIds,\n interactionMode,\n mouseEventCallbacks,\n nvlGraph,\n selected,\n setInteractionMode,\n setSelected,\n });\n\n const [isSidePanelOpen, setIsSidePanelOpen] = useSemicontrolledState({\n isControlled: rawSidepanel?.isSidePanelOpen !== undefined,\n onChange: rawSidepanel?.setIsSidePanelOpen,\n state: rawSidepanel?.isSidePanelOpen ?? true,\n });\n const [sidePanelWidth, setSidePanelWidth] = useSemicontrolledState({\n isControlled: rawSidepanel?.sidePanelWidth !== undefined,\n onChange: rawSidepanel?.onSidePanelResize,\n state: rawSidepanel?.sidePanelWidth ?? 400,\n });\n\n const sidepanel = useMemo((): Sidepanel | null => {\n if (rawSidepanel === undefined) {\n return {\n children: <GraphVisualization.SingleSelectionSidePanelContents />,\n isSidePanelOpen,\n onSidePanelResize: setSidePanelWidth,\n setIsSidePanelOpen,\n sidePanelWidth,\n };\n }\n return rawSidepanel;\n }, [\n rawSidepanel,\n isSidePanelOpen,\n setIsSidePanelOpen,\n sidePanelWidth,\n setSidePanelWidth,\n ]);\n\n const Component: React.ElementType = as ?? 'div';\n return (\n <Component\n ref={ref}\n className={cx('ndl-graph-visualization-container', className)}\n style={style}\n {...htmlAttributes}\n >\n <GraphVisualizationContext.Provider\n value={{\n gesture,\n interactionMode,\n layout,\n nvlGraph,\n nvlInstance: nvlRef,\n portalTarget,\n selected,\n setGesture,\n setLayout,\n sidepanel,\n }}\n >\n <div className=\"ndl-graph-visualization\">\n <InteractiveNvlWrapper\n key={key}\n layout={layout}\n nodes={nodesWithState}\n rels={relsWithState}\n nvlOptions={{\n ...DEFAULT_NVL_OPTIONS,\n instanceId,\n styling: {\n defaultRelationshipColor: border.strongest,\n disabledItemColor: bg.strong,\n disabledItemFontColor: text.weakest,\n dropShadowColor: border.weak,\n selectedInnerBorderColor: bg.default,\n },\n ...nvlOptions,\n }}\n nvlCallbacks={{\n onLayoutComputing(isComputing) {\n if (!isComputing) {\n nvlRef.current?.fit(\n nvlRef.current.getNodes().map((neighbors) => neighbors.id),\n { noPan: true },\n );\n }\n },\n ...nvlCallbacks,\n }}\n mouseEventCallbacks={wrappedMouseEventCallbacks}\n ref={nvlRef}\n {...restProps}\n />\n {topLeftIsland !== null && (\n <InteractionIsland placement=\"top-left\">\n {topLeftIsland}\n </InteractionIsland>\n )}\n\n {topRightIsland !== null && (\n <InteractionIsland placement=\"top-right\">\n {topRightIsland}\n </InteractionIsland>\n )}\n\n {bottomLeftIsland !== null && (\n <InteractionIsland placement=\"bottom-left\">\n {bottomLeftIsland}\n </InteractionIsland>\n )}\n\n {bottomRightIsland !== null && (\n <InteractionIsland placement=\"bottom-right\">\n {bottomRightIsland}\n </InteractionIsland>\n )}\n </div>\n {sidepanel && <GraphVisualizationSidepanel sidepanel={sidepanel} />}\n </GraphVisualizationContext.Provider>\n </Component>\n );\n}\n\n/**\n * Zoom in button for use within a GraphVisualization component.\n *\n * @remarks\n * Increases zoom level by 1.3x\n *\n * @alpha\n */\nGraphVisualization.ZoomInButton = ZoomInButton;\n\n/**\n * Zoom out button for use within a GraphVisualization component.\n *\n * @remarks\n * Decreases zoom level by 0.7x\n *\n * @alpha\n */\nGraphVisualization.ZoomOutButton = ZoomOutButton;\n\n/**\n * Zoom to fit button for use within a GraphVisualization component.\n *\n * @remarks\n * Automatically adjusts zoom and pan to show all nodes and relationships\n *\n * @alpha\n */\nGraphVisualization.ZoomToFitButton = ZoomToFitButton;\n\n/**\n * Sidepanel toggle button for use within a GraphVisualization component.\n *\n * @remarks\n * Shows or hides the sidepanel containing node and relationship details.\n * Requires a sidepanel to be configured in the GraphVisualization component.\n *\n * @throws Error when used without a configured sidepanel\n *\n * @alpha\n */\nGraphVisualization.ToggleSidePanelButton = ToggleSidePanelButton;\n\n/**\n * Download button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a dropdown menu with download options. Currently supports PNG format.\n * Captures the current visualization state including zoom level.\n *\n * @alpha\n */\nGraphVisualization.DownloadButton = DownloadButton;\n\n/**\n * Box selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables box selection mode where dragging creates a rectangular selection area.\n * Disabled unless the `setGesture` callback is passed.\n * Shows active state when enabled and supports keyboard shortcut 'B'.\n *\n * @alpha\n */\nGraphVisualization.BoxSelectButton = BoxSelectButton;\n\n/**\n * Lasso selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables lasso selection mode where dragging creates a free-form selection area.\n * Disabled unless the `setGesture` callback is passed.\n * Shows active state when enabled and supports keyboard shortcut 'L'.\n *\n * @alpha\n */\nGraphVisualization.LassoSelectButton = LassoSelectButton;\n\n/**\n * Single node selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables single selection mode where clicking selects individual nodes or relationships.\n * Shows active state when enabled and supports keyboard shortcut 'S'.\n *\n * @alpha\n */\nGraphVisualization.SingleSelectButton = SingleSelectButton;\n\n/**\n * Search button for use within a GraphVisualization component.\n *\n * @remarks\n * Enables search mode where clicking opens a search input for filtering nodes and relationships.\n *\n * @alpha\n */\nGraphVisualization.SearchButton = SearchButton;\n\n/**\n * Single node selection side panel for use within a GraphVisualization component.\n *\n * @remarks\n * Displays detailed information about the selected node or relationship.\n * Panel is automatically opened when a node or relationship is selected.\n * Also when user click on the show panel button in the top right corner.\n *\n * @alpha\n */\nGraphVisualization.SingleSelectionSidePanelContents =\n SingleSelectionSidepanelContents;\n\n/**\n * Layout selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a menu to select different graph layout algorithms.\n *\n * By default, the menu includes the **force-based** (`d3Force`) and\n * **hierarchical** layouts. Additional layouts can be enabled via configuration.\n *\n * @see {@link LayoutSelectOption} for the full set of layout options supported by NVL.\n *\n * @alpha\n */\nGraphVisualization.LayoutSelectButton = LayoutSelectButton;\n\n/**\n * Gesture selection button for use within a GraphVisualization component.\n *\n * @remarks\n * Opens a menu to select different interaction gestures.\n *\n * By default, the menu includes **single**, **box**, and **lasso** selection gestures.\n *\n * @see {@link GestureSelectOption} for the full set of gesture options supported by NVL.\n *\n * @alpha\n */\nGraphVisualization.GestureSelectButton = GestureSelectButton;\n"]}
|
|
@@ -90,7 +90,7 @@ const Component = () => {
|
|
|
90
90
|
const [gesture, setGesture] = useState('box');
|
|
91
91
|
// Hierarchical layout not working properly with storybook
|
|
92
92
|
const [layout, setLayout] = useState('hierarchical');
|
|
93
|
-
return (_jsx("div", { style: { height: '600px' }, children: _jsx(GraphVisualization, { gesture: gesture, setGesture: setGesture, layout: layout, setLayout: setLayout, bottomRightIsland: _jsxs(IconButtonArray, { size: "medium", children: [_jsx(GraphVisualization.GestureSelectButton, { menuPlacement: "top-end-bottom-end" }), _jsx(Divider, { orientation: "vertical" }), _jsx(GraphVisualization.ZoomInButton, {}), _jsx(GraphVisualization.ZoomOutButton, {}), _jsx(GraphVisualization.ZoomToFitButton, {}), _jsx(Divider, { orientation: "vertical" }), _jsx(GraphVisualization.LayoutSelectButton, { menuPlacement: "top-end-bottom-end" })] }), nodes: nodes, rels: rels, sidepanel: {
|
|
93
|
+
return (_jsx("div", { style: { height: '600px' }, children: _jsx(GraphVisualization, { gesture: gesture, setGesture: setGesture, layout: layout, setLayout: setLayout, bottomRightIsland: _jsxs(IconButtonArray, { size: "medium", children: [_jsx(GraphVisualization.GestureSelectButton, { menuPlacement: "top-end-bottom-end" }), _jsx(Divider, { orientation: "vertical" }), _jsx(GraphVisualization.ZoomInButton, { tooltipPlacement: "top" }), _jsx(GraphVisualization.ZoomOutButton, { tooltipPlacement: "top" }), _jsx(GraphVisualization.ZoomToFitButton, { tooltipPlacement: "top" }), _jsx(Divider, { orientation: "vertical" }), _jsx(GraphVisualization.LayoutSelectButton, { menuPlacement: "top-end-bottom-end" })] }), nodes: nodes, rels: rels, sidepanel: {
|
|
94
94
|
children: _jsx(GraphVisualization.SingleSelectionSidePanelContents, {}),
|
|
95
95
|
isSidePanelOpen: isOpen,
|
|
96
96
|
onSidePanelResize: () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"graph-visualization-maximalist.story.js","sourceRoot":"","sources":["../../../src/stories/graph-visualization-maximalist.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAE5D,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAG5D,MAAM,KAAK,GAAc;IACvB;QACE,EAAE,EAAE,OAAO;QACX,MAAM,EAAE,CAAC,SAAS,EAAE,WAAW,CAAC;QAChC,UAAU,EAAE;YACV,mBAAmB,EAAE;gBACnB,WAAW,EAAE,oBAAoB;gBACjC,IAAI,EAAE,UAAU;aACjB;YACD,cAAc,EAAE;gBACd,WAAW,EAAE,0BAA0B;gBACvC,IAAI,EAAE,MAAM;aACb;YACD,UAAU,EAAE;gBACV,WAAW,EAAE,MAAM;gBACnB,IAAI,EAAE,MAAM;aACb;YACD,SAAS,EAAE;gBACT,WAAW,EAAE,MAAM;gBACnB,IAAI,EAAE,SAAS;aAChB;YACD,QAAQ,EAAE;gBACR,WAAW,EAAE,sCAAsC;gBACnD,IAAI,EAAE,OAAO;aACd;YACD,IAAI,EAAE;gBACJ,WAAW,EAAE,YAAY;gBACzB,IAAI,EAAE,QAAQ;aACf;YACD,MAAM,EAAE;gBACN,WAAW,EAAE,OAAO;gBACpB,IAAI,EAAE,OAAO;aACd;SACF;KACF;IACD;QACE,EAAE,EAAE,OAAO;QACX,MAAM,EAAE,CAAC,MAAM,CAAC;QAChB,UAAU,EAAE,EAAE,IAAI,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;KAChE;IACD;QACE,EAAE,EAAE,OAAO;QACX,MAAM,EAAE,CAAC,MAAM,CAAC;QAChB,UAAU,EAAE,EAAE,IAAI,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;KAChE;CACF,CAAC;AAEF,MAAM,IAAI,GAAG;IACX;QACE,IAAI,EAAE,OAAO;QACb,EAAE,EAAE,MAAM;QACV,UAAU,EAAE,EAAE;QACd,EAAE,EAAE,OAAO;QACX,IAAI,EAAE,UAAU;KACjB;IACD;QACE,IAAI,EAAE,OAAO;QACb,EAAE,EAAE,MAAM;QACV,UAAU,EAAE,EAAE;QACd,EAAE,EAAE,OAAO;QACX,IAAI,EAAE,UAAU;KACjB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAC3B,oEAAoE,CAAC;AAEvE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC3C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IACvD,0DAA0D;IAC1D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAS,cAAc,CAAC,CAAC;IAE7D,OAAO,CACL,cAAK,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,YAC7B,KAAC,kBAAkB,IACjB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,iBAAiB,EACf,MAAC,eAAe,IAAC,IAAI,EAAC,QAAQ,aAC5B,KAAC,kBAAkB,CAAC,mBAAmB,IAAC,aAAa,EAAC,oBAAoB,GAAG,EAC7E,KAAC,OAAO,IAAC,WAAW,EAAC,UAAU,GAAG,EAClC,KAAC,kBAAkB,CAAC,YAAY,
|
|
1
|
+
{"version":3,"file":"graph-visualization-maximalist.story.js","sourceRoot":"","sources":["../../../src/stories/graph-visualization-maximalist.story.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 { Divider, IconButtonArray } from '@neo4j-ndl/react';\nimport { type Layout } from '@neo4j-nvl/base';\nimport { useState } from 'react';\n\nimport { GraphVisualization } from '../graph-visualization';\nimport { type Gesture, type NeoNode } from '../graph-visualization-context';\n\nconst nodes: NeoNode[] = [\n {\n id: 'node1',\n labels: ['Pokemon', 'Legendary'],\n properties: {\n durationToWinBattle: {\n stringified: 'P0M0DT0.000000001S',\n type: 'duration',\n },\n favoriteColors: {\n stringified: '[\"red\", \"blue\", \"green\"]',\n type: 'list',\n },\n getsBeatBy: {\n stringified: 'null',\n type: 'null',\n },\n isAwesome: {\n stringified: 'true',\n type: 'boolean',\n },\n location: {\n stringified: 'point({srid:1, x:100, y:200, z:300})',\n type: 'point',\n },\n name: {\n stringified: '\"Rayquaza\"',\n type: 'string',\n },\n weight: {\n stringified: '392.0',\n type: 'float',\n },\n },\n },\n {\n id: 'node2',\n labels: ['Type'],\n properties: { name: { stringified: 'Dragon', type: 'String' } },\n },\n {\n id: 'node3',\n labels: ['Type'],\n properties: { name: { stringified: 'Flying', type: 'String' } },\n },\n];\n\nconst rels = [\n {\n from: 'node1',\n id: 'rel1',\n properties: {},\n to: 'node2',\n type: 'HAS_TYPE',\n },\n {\n from: 'node1',\n id: 'rel2',\n properties: {},\n to: 'node3',\n type: 'HAS_TYPE',\n },\n];\n\nexport const containerClasses =\n 'n-w-full n-border-neutral-border-weak n-mx-2 n-rounded-lg n-border';\n\nconst Component = () => {\n const [isOpen, setIsOpen] = useState(true);\n const [gesture, setGesture] = useState<Gesture>('box');\n // Hierarchical layout not working properly with storybook\n const [layout, setLayout] = useState<Layout>('hierarchical');\n\n return (\n <div style={{ height: '600px' }}>\n <GraphVisualization\n gesture={gesture}\n setGesture={setGesture}\n layout={layout}\n setLayout={setLayout}\n bottomRightIsland={\n <IconButtonArray size=\"medium\">\n <GraphVisualization.GestureSelectButton menuPlacement=\"top-end-bottom-end\" />\n <Divider orientation=\"vertical\" />\n <GraphVisualization.ZoomInButton tooltipPlacement=\"top\" />\n <GraphVisualization.ZoomOutButton tooltipPlacement=\"top\" />\n <GraphVisualization.ZoomToFitButton tooltipPlacement=\"top\" />\n <Divider orientation=\"vertical\" />\n <GraphVisualization.LayoutSelectButton menuPlacement=\"top-end-bottom-end\" />\n </IconButtonArray>\n }\n nodes={nodes}\n rels={rels}\n sidepanel={{\n children: <GraphVisualization.SingleSelectionSidePanelContents />,\n isSidePanelOpen: isOpen,\n onSidePanelResize: () => {\n /* no op */\n },\n setIsSidePanelOpen: setIsOpen,\n sidePanelWidth: 300,\n }}\n topLeftIsland={<GraphVisualization.DownloadButton />}\n topRightIsland={<GraphVisualization.ToggleSidePanelButton />}\n className={containerClasses}\n />\n </div>\n );\n};\n\nexport default Component;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"graph-visualization-buttons.d.ts","sourceRoot":"","sources":["../../src/graph-visualization-buttons.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EACL,eAAe,EAGf,IAAI,EAGJ,KAAK,OAAO,EACb,MAAM,kBAAkB,CAAC;AAe1B,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAE9C,OAAO,EACL,KAAK,iBAAiB,EAKvB,MAAM,OAAO,CAAC;AAEf,OAAO,EACL,KAAK,OAAO,EAEb,MAAM,+BAA+B,CAAC;AAIvC,KAAK,6BAA6B,GAAG;IACnC,gBAAgB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,CAAC;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAE5B;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,qBAAqB,CAC1C,OAAO,eAAe,CACvB,CAAC,gBAAgB,CAAC,CAAC;IAEpB;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,qBAAqB,CAAC,QAAQ,CAAC,CAAC,KAAK,CAAC,CAAC;CACpD,CAAC;AAEF,KAAK,cAAc,GAAG,6BAA6B,GAAG;IACpD,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,6BAA6B,GAAG,iBAAiB,CAAC,cAAc,CAAC,CAAC;AAE9E,eAAO,MAAM,WAAW,GAAI,OAAO,6BAA6B,4CAmC/D,CAAC;AA+CF,eAAO,MAAM,kBAAkB,GAAI,yDAKhC,6BAA6B,4CAyB/B,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,yDAK7B,6BAA6B,4CAyB/B,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,yDAK/B,6BAA6B,4CAyB/B,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,yDAK1B,6BAA6B,4CAmB/B,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,yDAK3B,6BAA6B,4CAmB/B,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,yDAK7B,6BAA6B,4CAkD/B,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,yDAKnC,6BAA6B,4CAiC/B,CAAC;AAEF,KAAK,iBAAiB,GAAG,6BAA6B,GAAG;IACvD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACxD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IAC7D,QAAQ,CAAC,EAAE,CACT,OAAO,EAAE,MAAM,EAAE,GAAG,SAAS,EAC7B,eAAe,EAAE,MAAM,EAAE,GAAG,SAAS,KAClC,IAAI,CAAC;CACX,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,mKAY1B,iBAAiB,
|
|
1
|
+
{"version":3,"file":"graph-visualization-buttons.d.ts","sourceRoot":"","sources":["../../src/graph-visualization-buttons.tsx"],"names":[],"mappings":"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"}
|
|
@@ -89,6 +89,7 @@ export type GraphVisualizationContextData = {
|
|
|
89
89
|
selected: GraphSelection;
|
|
90
90
|
layout: Layout;
|
|
91
91
|
setLayout?: (layout: Layout) => void;
|
|
92
|
+
portalTarget?: HTMLElement | null;
|
|
92
93
|
};
|
|
93
94
|
export declare const GraphVisualizationContext: import("react").Context<GraphVisualizationContextData | undefined>;
|
|
94
95
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"graph-visualization-context.d.ts","sourceRoot":"","sources":["../../src/graph-visualization-context.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"graph-visualization-context.d.ts","sourceRoot":"","sources":["../../src/graph-visualization-context.tsx"],"names":[],"mappings":"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"}
|
|
@@ -47,6 +47,7 @@ export type GraphVisualizationProps<T extends React.ElementType = 'div'> = {
|
|
|
47
47
|
setInteractionMode?: (interactionMode: InteractionMode) => void;
|
|
48
48
|
layout?: Layout;
|
|
49
49
|
setLayout?: (layout: Layout) => void;
|
|
50
|
+
portalTarget?: HTMLElement | null;
|
|
50
51
|
nodes: NeoNode[];
|
|
51
52
|
rels: NeoRel[];
|
|
52
53
|
highlightedNodeIds?: string[];
|
|
@@ -113,7 +114,7 @@ export type GraphVisualizationProps<T extends React.ElementType = 'div'> = {
|
|
|
113
114
|
*
|
|
114
115
|
* @alpha
|
|
115
116
|
*/
|
|
116
|
-
export declare function GraphVisualization<T extends React.ElementType = 'div'>({ nvlRef: rawNvlRef, nvlCallbacks, nvlOptions, sidepanel: rawSidepanel, nodes: rawNodes, rels: rawRels, highlightedNodeIds, highlightedRelationshipIds, topLeftIsland, topRightIsland, bottomLeftIsland, bottomRightIsland, gesture, setGesture, layout: rawLayout, setLayout: rawSetLayout, selected: rawSelected, setSelected: rawSetSelected, interactionMode: rawInteractionMode, setInteractionMode: rawSetInteractionMode, mouseEventCallbacks, className, style, htmlAttributes, ref, as, ...restProps }: GraphVisualizationProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
117
|
+
export declare function GraphVisualization<T extends React.ElementType = 'div'>({ nvlRef: rawNvlRef, nvlCallbacks, nvlOptions, sidepanel: rawSidepanel, nodes: rawNodes, rels: rawRels, highlightedNodeIds, highlightedRelationshipIds, topLeftIsland, topRightIsland, bottomLeftIsland, bottomRightIsland, gesture, setGesture, layout: rawLayout, setLayout: rawSetLayout, portalTarget, selected: rawSelected, setSelected: rawSetSelected, interactionMode: rawInteractionMode, setInteractionMode: rawSetInteractionMode, mouseEventCallbacks, className, style, htmlAttributes, ref, as, ...restProps }: GraphVisualizationProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
117
118
|
export declare namespace GraphVisualization {
|
|
118
119
|
var ZoomInButton: ({ className, style, htmlAttributes, tooltipPlacement, }: {
|
|
119
120
|
tooltipPlacement?: React.ComponentProps<{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"graph-visualization.d.ts","sourceRoot":"","sources":["../../src/graph-visualization.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAIH,OAAO,KAAK,GAAG,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAEL,KAAK,0BAA0B,EAChC,MAAM,kBAAkB,CAAC;AAE1B,OAAO,KAA8C,MAAM,OAAO,CAAC;AAenE,OAAO,EACL,KAAK,OAAO,EACZ,KAAK,cAAc,EAEnB,KAAK,eAAe,EACpB,KAAK,OAAO,EACZ,KAAK,MAAM,EAEX,KAAK,SAAS,EACf,MAAM,+BAA+B,CAAC;AA4BvC,eAAO,MAAM,mBAAmB;;;;;;CAM/B,CAAC;AAiBF,MAAM,MAAM,uBAAuB,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI;IACzE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,GAAG,IAAI,CAAC,CAAC;IACrC,SAAS,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAC7B,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACpC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAE5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,WAAW,CAAC,EAAE,CAAC,YAAY,EAAE,cAAc,KAAK,IAAI,CAAC;IACrD,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,kBAAkB,CAAC,EAAE,CAAC,eAAe,EAAE,eAAe,KAAK,IAAI,CAAC;IAChE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAErC,KAAK,EAAE,OAAO,EAAE,CAAC;IACjB,IAAI,EAAE,MAAM,EAAE,CAAC;IAEf,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC9B,0BAA0B,CAAC,EAAE,MAAM,EAAE,CAAC;IAEtC,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,GAAG,CAAC,EAAE,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IAC5C,cAAc,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;CAC1C,GAAG,0BAA0B,CAAC;AAE/B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyDG;AACH,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,EAAE,EACtE,MAAM,EAAE,SAAS,EACjB,YAAY,EACZ,UAAU,EACV,SAAS,EAAE,YAAY,EACvB,KAAK,EAAE,QAAQ,EACf,IAAI,EAAE,OAAO,EACb,kBAAkB,EAClB,0BAA0B,EAC1B,aAAgD,EAChD,cAAkD,EAClD,gBAAsD,EACtD,iBAAwD,EACxD,OAAkB,EAClB,UAAU,EACV,MAAM,EAAE,SAAS,EACjB,SAAS,EAAE,YAAY,EACvB,QAAQ,EAAE,WAAW,EACrB,WAAW,EAAE,cAAc,EAC3B,eAAe,EAAE,kBAAkB,EACnC,kBAAkB,EAAE,qBAAqB,EACzC,mBAAwB,EACxB,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,EACH,EAAE,EACF,GAAG,SAAS,EACb,EAAE,uBAAuB,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"graph-visualization.d.ts","sourceRoot":"","sources":["../../src/graph-visualization.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neo4j-ndl/react-graph",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.36",
|
|
4
4
|
"sideEffects": false,
|
|
5
5
|
"description": "React implementation of the graph visualization from Neo4j Design System",
|
|
6
6
|
"keywords": [
|
|
@@ -55,8 +55,8 @@
|
|
|
55
55
|
"@neo4j-nvl/base": "^1.0.0",
|
|
56
56
|
"@neo4j-nvl/interaction-handlers": "^1.0.0",
|
|
57
57
|
"@neo4j-nvl/react": "^1.0.0",
|
|
58
|
-
"@neo4j-ndl/base": "^4.9.
|
|
59
|
-
"@neo4j-ndl/react": "^4.9.
|
|
58
|
+
"@neo4j-ndl/base": "^4.9.8",
|
|
59
|
+
"@neo4j-ndl/react": "^4.9.18"
|
|
60
60
|
},
|
|
61
61
|
"dependencies": {
|
|
62
62
|
"classnames": "2.5.1",
|