npm - @neo4j-ndl/react-graph - Versions diffs - 1.0.47 → 1.1.1 - Mend

@neo4j-ndl/react-graph 1.0.47 → 1.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (22) hide show

package/lib/cjs/graph-visualization-buttons.js CHANGED Viewed

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DownloadButton = exports.SearchButton = exports.ToggleSidePanelButton = exports.ZoomToFitButton = exports.ZoomOutButton = exports.ZoomInButton = exports.LassoSelectButton = exports.BoxSelectButton = exports.SingleSelectButton = exports.GroupButton = void 0;
+exports.LayoutSelectButton = exports.DownloadButton = exports.SearchButton = exports.ToggleSidePanelButton = exports.ZoomToFitButton = exports.ZoomOutButton = exports.ZoomInButton = exports.LassoSelectButton = exports.BoxSelectButton = exports.SingleSelectButton = exports.GroupButton = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 /**
  *
@@ -216,4 +216,24 @@ const DownloadButton = ({ className, style, htmlAttributes, tooltipPlacement, })
                         } }) }) })] }));
 };
 exports.DownloadButton = DownloadButton;
+const DEFAULT_LAYOUT_OPTIONS = {
+    d3Force: {
+        icon: (0, jsx_runtime_1.jsx)(icons_1.ExploreIcon, {}),
+        title: 'Force-based layout',
+    },
+    hierarchical: {
+        icon: (0, jsx_runtime_1.jsx)(icons_1.HierarchyTwoIcon, {}),
+        title: 'Hierarchical layout',
+    },
+};
+const LayoutSelectButton = ({ className, style, htmlAttributes, tooltipPlacement, menuPlacement, layoutOptions = DEFAULT_LAYOUT_OPTIONS, }) => {
+    var _a, _b;
+    const anchorRef = (0, react_2.useRef)(null);
+    const [isMenuOpen, setIsMenuOpen] = (0, react_2.useState)(false);
+    const { layout, setLayout } = (0, graph_visualization_context_1.useGraphVisualizationContext)();
+    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: {
+                    root: { placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
+                }, 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: (0, jsx_runtime_1.jsx)(react_1.Menu.Items, { children: Object.entries(layoutOptions).map(([key, item]) => ((0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: item.title, leadingVisual: item.icon, onClick: () => setLayout === null || setLayout === void 0 ? void 0 : setLayout(key), trailingContent: key === layout ? ((0, jsx_runtime_1.jsx)(icons_1.CheckIconOutline, { className: "n-size-token-16" })) : undefined }, key))) }) })] }));
+};
+exports.LayoutSelectButton = LayoutSelectButton;
 //# sourceMappingURL=graph-visualization-buttons.js.map

package/lib/cjs/graph-visualization-buttons.js.map CHANGED Viewed

	@@ -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 Menu,\n TextInput,\n type Tooltip,\n} from '@neo4j-ndl/react';\nimport {\n ArrowDownTrayIconOutline,\n FitToScreenIcon,\n LassoIcon,\n MagnifyingGlassIconOutline,\n MagnifyingGlassMinusIconOutline,\n MagnifyingGlassPlusIconOutline,\n PanelRightIcon,\n SelectIcon,\n SquareDashIcon,\n XMarkIconOutline,\n} from '@neo4j-ndl/react/icons';\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 = (gesture: 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 if (upperKey === GESTURE_KEYS[gesture]) {\n setGesture(gesture);\n }\n }\n },\n [gesture, 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.Items>\n <Menu.Item\n title=\"Download as PNG\"\n onClick={() => {\n nvlInstance.current?.saveToFile({});\n closeFileMenu();\n }}\n />\n </Menu.Items>\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 Menu,\n SelectIconButton,\n TextInput,\n type Tooltip,\n} from '@neo4j-ndl/react';\nimport {\n ArrowDownTrayIconOutline,\n CheckIconOutline,\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 = (gesture: 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 if (upperKey === GESTURE_KEYS[gesture]) {\n setGesture(gesture);\n }\n }\n },\n [gesture, 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.Items>\n <Menu.Item\n title=\"Download as PNG\"\n onClick={() => {\n nvlInstance.current?.saveToFile({});\n closeFileMenu();\n }}\n />\n </Menu.Items>\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 <Menu.Items>\n {Object.entries(layoutOptions).map(([key, item]) => (\n <Menu.Item\n key={key}\n title={item.title}\n leadingVisual={item.icon}\n onClick={() => setLayout?.(key as Layout)}\n trailingContent={\n key === layout ? (\n <CheckIconOutline className=\"n-size-token-16\" />\n ) : undefined\n }\n />\n ))}\n </Menu.Items>\n </Menu>\n </>\n );\n};\n"]}

package/lib/cjs/graph-visualization-context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"graph-visualization-context.js","sourceRoot":"","sources":["../../src/graph-visualization-context.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AAIH,iCAAkD;~~AAuErC~~,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 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};\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"]}
1	+ {"version":3,"file":"graph-visualization-context.js","sourceRoot":"","sources":["../../src/graph-visualization-context.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AAIH,iCAAkD;AAyErC,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};\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"]}

package/lib/cjs/graph-visualization.js CHANGED Viewed

@@ -164,7 +164,7 @@ const DEFAULT_COMPONENTS = {
  */
 function GraphVisualization(_a) {
     var _b, _c;
-    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, 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", "selected", "setSelected", "interactionMode", "setInteractionMode", "mouseEventCallbacks", "className", "style", "htmlAttributes", "ref", "as"]);
+    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"]);
     const nvlRef = (0, react_3.useMemo)(() => rawNvlRef !== null && rawNvlRef !== void 0 ? rawNvlRef : react_3.default.createRef(), [rawNvlRef]);
     const instanceId = (0, react_3.useId)();
     // Respect NDL theme changes
@@ -186,6 +186,11 @@ function GraphVisualization(_a) {
         onChange: rawSetSelected,
         state: rawSelected !== null && rawSelected !== void 0 ? rawSelected : { nodeIds: [], relationshipIds: [] },
     });
+    const [layout, setLayout] = (0, use_semi_controlled_state_1.useSemicontrolledState)({
+        isControlled: rawLayout !== undefined,
+        onChange: rawSetLayout,
+        state: rawLayout !== null && rawLayout !== void 0 ? rawLayout : 'd3Force',
+    });
     const nvlGraph = (0, react_3.useMemo)(() => (0, map_to_nvl_graph_1.mapToNvlGraph)(rawNodes, rawRels), [rawNodes, rawRels]);
     const { nodesWithState, relsWithState, wrappedMouseEventCallbacks } = (0, use_managed_node_state_1.useManagedNodeState)({
         gesture,
@@ -230,12 +235,14 @@ function GraphVisualization(_a) {
     return ((0, jsx_runtime_1.jsx)(Component, Object.assign({ ref: ref, className: (0, classnames_1.default)('ndl-graph-visualization-container', className), style: style }, htmlAttributes, { children: (0, jsx_runtime_1.jsxs)(graph_visualization_context_1.GraphVisualizationContext.Provider, { value: {
                 gesture,
                 interactionMode,
+                layout,
                 nvlGraph,
                 nvlInstance: nvlRef,
                 selected,
                 setGesture,
+                setLayout,
                 sidepanel,
-            }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "ndl-graph-visualization", children: [(0, jsx_runtime_1.jsx)(react_2.InteractiveNvlWrapper, Object.assign({ layout: "d3Force", nodes: nodesWithState, rels: relsWithState, nvlOptions: Object.assign(Object.assign(Object.assign({}, exports.DEFAULT_NVL_OPTIONS), { instanceId, styling: {
+            }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "ndl-graph-visualization", children: [(0, jsx_runtime_1.jsx)(react_2.InteractiveNvlWrapper, Object.assign({ layout: layout, nodes: nodesWithState, rels: relsWithState, nvlOptions: Object.assign(Object.assign(Object.assign({}, exports.DEFAULT_NVL_OPTIONS), { instanceId, styling: {
                                     defaultRelationshipColor: border.strongest,
                                     disabledItemColor: bg.strong,
                                     disabledItemFontColor: text.weakest,
@@ -350,4 +357,18 @@ GraphVisualization.SearchButton = graph_visualization_buttons_1.SearchButton;
  */
 GraphVisualization.SingleSelectionSidePanelContents =
     single_selection_sidepanel_contents_1.SingleSelectionSidepanelContents;
+/**
+ * Layout selection button for use within a GraphVisualization component.
+ *
+ * @remarks
+ * Opens a menu to select different graph layout algorithms.
+ *
+ * By default, the menu includes the **force-based** (`d3Force`) and
+ * **hierarchical** layouts. Additional layouts can be enabled via configuration.
+ *
+ * @see {@link LayoutSelectOption} for the full set of layout options supported by NVL.
+ *
+ * @alpha
+ */
+GraphVisualization.LayoutSelectButton = graph_visualization_buttons_1.LayoutSelectButton;
 //# sourceMappingURL=graph-visualization.js.map

package/lib/cjs/graph-visualization.js.map CHANGED Viewed

	@@ -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 {\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 LassoSelectButton,\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>\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\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 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\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 nvlGraph,\n nvlInstance: nvlRef,\n selected,\n setGesture,\n sidepanel,\n }}\n >\n <div className=\"ndl-graph-visualization\">\n <InteractiveNvlWrapper\n key={key}\n layout=\"d3Force\"\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"]}
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 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>\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"]}

package/lib/cjs/stories/graph-visualization-maximalist.story.js CHANGED Viewed

@@ -91,7 +91,9 @@ exports.containerClasses = 'n-w-full n-border-neutral-border-weak n-mx-2 n-round
 const Component = () => {
     const [isOpen, setIsOpen] = (0, react_2.useState)(true);
     const [gesture, setGesture] = (0, react_2.useState)('box');
-    return ((0, jsx_runtime_1.jsx)("div", { style: { height: '600px' }, children: (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization, { gesture: gesture, setGesture: setGesture, bottomLeftIsland: (0, jsx_runtime_1.jsxs)(react_1.IconButtonArray, { children: [(0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.LassoSelectButton, {}), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.SingleSelectButton, {}), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.BoxSelectButton, {})] }), bottomRightIsland: (0, jsx_runtime_1.jsxs)(react_1.IconButtonArray, { children: [(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, {})] }), nodes: nodes, rels: rels, sidepanel: {
+    // Hierarchical layout not working properly with storybook
+    const [layout, setLayout] = (0, react_2.useState)('hierarchical');
+    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, bottomLeftIsland: (0, jsx_runtime_1.jsxs)(react_1.IconButtonArray, { children: [(0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.LassoSelectButton, {}), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.SingleSelectButton, {}), (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.BoxSelectButton, {})] }), bottomRightIsland: (0, jsx_runtime_1.jsxs)(react_1.IconButtonArray, { children: [(0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.LayoutSelectButton, { 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, {})] }), nodes: nodes, rels: rels, sidepanel: {
                 children: (0, jsx_runtime_1.jsx)(graph_visualization_1.GraphVisualization.SingleSelectionSidePanelContents, {}),
                 isSidePanelOpen: isOpen,
                 onSidePanelResize: () => {

package/lib/cjs/stories/graph-visualization-maximalist.story.js.map CHANGED Viewed

	@@ -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,~~4CAAmD~~;~~AACnD~~,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;~~IAEvD~~,OAAO,CACL,gCAAK,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,YAC7B,uBAAC,wCAAkB,IACjB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,gBAAgB,EACd,wBAAC,uBAAe,eACd,uBAAC,wCAAkB,CAAC,iBAAiB,KAAG,EACxC,uBAAC,wCAAkB,CAAC,kBAAkB,KAAG,EACzC,uBAAC,wCAAkB,CAAC,eAAe,KAAG,IACtB,EAEpB,iBAAiB,EACf,wBAAC,uBAAe,eACd,uBAAC,wCAAkB,CAAC,YAAY,KAAG,EACnC,uBAAC,wCAAkB,CAAC,aAAa,KAAG,EACpC,uBAAC,wCAAkB,CAAC,eAAe,KAAG,IACtB,EAEpB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,SAAS,EAAE;gBACT,QAAQ,EAAE,uBAAC,wCAAkB,CAAC,gCAAgC,KAAG;gBACjE,eAAe,EAAE,MAAM;gBACvB,iBAAiB,EAAE,GAAG,EAAE;oBACtB,WAAW;gBACb,CAAC;gBACD,kBAAkB,EAAE,SAAS;gBAC7B,cAAc,EAAE,GAAG;aACpB,EACD,aAAa,EAAE,uBAAC,wCAAkB,CAAC,cAAc,KAAG,EACpD,cAAc,EAAE,uBAAC,wCAAkB,CAAC,qBAAqB,KAAG,EAC5D,SAAS,EAAE,wBAAgB,GAC3B,GACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,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 { IconButtonArray } from '@neo4j-ndl/react';\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\n return (\n <div style={{ height: '600px' }}>\n <GraphVisualization\n gesture={gesture}\n setGesture={setGesture}\n bottomLeftIsland={\n <IconButtonArray>\n <GraphVisualization.LassoSelectButton />\n <GraphVisualization.SingleSelectButton />\n <GraphVisualization.BoxSelectButton />\n </IconButtonArray>\n }\n bottomRightIsland={\n <IconButtonArray>\n <GraphVisualization.ZoomInButton />\n <GraphVisualization.ZoomOutButton />\n <GraphVisualization.ZoomToFitButton />\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	+ {"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 bottomLeftIsland={\n <IconButtonArray>\n <GraphVisualization.LassoSelectButton />\n <GraphVisualization.SingleSelectButton />\n <GraphVisualization.BoxSelectButton />\n </IconButtonArray>\n }\n bottomRightIsland={\n <IconButtonArray>\n <GraphVisualization.LayoutSelectButton menuPlacement=\"top-end-bottom-end\" />\n <Divider orientation=\"vertical\" />\n <GraphVisualization.ZoomInButton />\n <GraphVisualization.ZoomOutButton />\n <GraphVisualization.ZoomToFitButton />\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"]}

package/lib/esm/graph-visualization-buttons.js CHANGED Viewed

@@ -19,8 +19,8 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
  *  You should have received a copy of the GNU General Public License
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
-import { CleanIconButton, IconButton, Menu, TextInput, } from '@neo4j-ndl/react';
-import { ArrowDownTrayIconOutline, FitToScreenIcon, LassoIcon, MagnifyingGlassIconOutline, MagnifyingGlassMinusIconOutline, MagnifyingGlassPlusIconOutline, PanelRightIcon, SelectIcon, SquareDashIcon, XMarkIconOutline, } from '@neo4j-ndl/react/icons';
+import { CleanIconButton, IconButton, Menu, SelectIconButton, TextInput, } from '@neo4j-ndl/react';
+import { ArrowDownTrayIconOutline, CheckIconOutline, ExploreIcon, FitToScreenIcon, HierarchyTwoIcon, LassoIcon, MagnifyingGlassIconOutline, MagnifyingGlassMinusIconOutline, MagnifyingGlassPlusIconOutline, PanelRightIcon, SelectIcon, SquareDashIcon, XMarkIconOutline, } from '@neo4j-ndl/react/icons';
 import { default as cx } from 'classnames';
 import { useCallback, useEffect, useRef, useState, } from 'react';
 import { useGraphVisualizationContext, } from './graph-visualization-context';
@@ -200,4 +200,23 @@ export const DownloadButton = ({ className, style, htmlAttributes, tooltipPlacem
                             closeFileMenu();
                         } }) }) })] }));
 };
+const DEFAULT_LAYOUT_OPTIONS = {
+    d3Force: {
+        icon: _jsx(ExploreIcon, {}),
+        title: 'Force-based layout',
+    },
+    hierarchical: {
+        icon: _jsx(HierarchyTwoIcon, {}),
+        title: 'Hierarchical layout',
+    },
+};
+export const LayoutSelectButton = ({ className, style, htmlAttributes, tooltipPlacement, menuPlacement, layoutOptions = DEFAULT_LAYOUT_OPTIONS, }) => {
+    var _a, _b;
+    const anchorRef = useRef(null);
+    const [isMenuOpen, setIsMenuOpen] = useState(false);
+    const { layout, setLayout } = useGraphVisualizationContext();
+    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: {
+                    root: { placement: tooltipPlacement !== null && tooltipPlacement !== void 0 ? tooltipPlacement : 'bottom' },
+                }, 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: _jsx(Menu.Items, { children: Object.entries(layoutOptions).map(([key, item]) => (_jsx(Menu.Item, { title: item.title, leadingVisual: item.icon, onClick: () => setLayout === null || setLayout === void 0 ? void 0 : setLayout(key), trailingContent: key === layout ? (_jsx(CheckIconOutline, { className: "n-size-token-16" })) : undefined }, key))) }) })] }));
+};
 //# sourceMappingURL=graph-visualization-buttons.js.map

package/lib/esm/graph-visualization-buttons.js.map CHANGED Viewed

	@@ -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 Menu,\n TextInput,\n type Tooltip,\n} from '@neo4j-ndl/react';\nimport {\n ArrowDownTrayIconOutline,\n FitToScreenIcon,\n LassoIcon,\n MagnifyingGlassIconOutline,\n MagnifyingGlassMinusIconOutline,\n MagnifyingGlassPlusIconOutline,\n PanelRightIcon,\n SelectIcon,\n SquareDashIcon,\n XMarkIconOutline,\n} from '@neo4j-ndl/react/icons';\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 = (gesture: 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 if (upperKey === GESTURE_KEYS[gesture]) {\n setGesture(gesture);\n }\n }\n },\n [gesture, 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.Items>\n <Menu.Item\n title=\"Download as PNG\"\n onClick={() => {\n nvlInstance.current?.saveToFile({});\n closeFileMenu();\n }}\n />\n </Menu.Items>\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 Menu,\n SelectIconButton,\n TextInput,\n type Tooltip,\n} from '@neo4j-ndl/react';\nimport {\n ArrowDownTrayIconOutline,\n CheckIconOutline,\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 = (gesture: 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 if (upperKey === GESTURE_KEYS[gesture]) {\n setGesture(gesture);\n }\n }\n },\n [gesture, 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.Items>\n <Menu.Item\n title=\"Download as PNG\"\n onClick={() => {\n nvlInstance.current?.saveToFile({});\n closeFileMenu();\n }}\n />\n </Menu.Items>\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 <Menu.Items>\n {Object.entries(layoutOptions).map(([key, item]) => (\n <Menu.Item\n key={key}\n title={item.title}\n leadingVisual={item.icon}\n onClick={() => setLayout?.(key as Layout)}\n trailingContent={\n key === layout ? (\n <CheckIconOutline className=\"n-size-token-16\" />\n ) : undefined\n }\n />\n ))}\n </Menu.Items>\n </Menu>\n </>\n );\n};\n"]}

package/lib/esm/graph-visualization-context.js.map CHANGED Viewed

	@@ -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;~~AAuElD~~,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 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};\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"]}
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;AAyElD,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};\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"]}

package/lib/esm/graph-visualization.js CHANGED Viewed

@@ -35,7 +35,7 @@ import { IconButtonArray, useNeedleTheme } from '@neo4j-ndl/react';
 import { InteractiveNvlWrapper, } from '@neo4j-nvl/react';
 import { default as cx } from 'classnames';
 import React, { useEffect, useId, useMemo, useState } from 'react';
-import { BoxSelectButton, DownloadButton, LassoSelectButton, SearchButton, SingleSelectButton, ToggleSidePanelButton, ZoomInButton, ZoomOutButton, ZoomToFitButton, } from './graph-visualization-buttons';
+import { BoxSelectButton, DownloadButton, LassoSelectButton, LayoutSelectButton, SearchButton, SingleSelectButton, ToggleSidePanelButton, ZoomInButton, ZoomOutButton, ZoomToFitButton, } from './graph-visualization-buttons';
 import { GraphVisualizationContext, } from './graph-visualization-context';
 import { GraphVisualizationSidepanel } from './graph-visualization-sidepanel';
 import { mapToNvlGraph } from './map-to-nvl-graph';
@@ -124,7 +124,7 @@ const DEFAULT_COMPONENTS = {
  */
 export function GraphVisualization(_a) {
     var _b, _c;
-    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, 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", "selected", "setSelected", "interactionMode", "setInteractionMode", "mouseEventCallbacks", "className", "style", "htmlAttributes", "ref", "as"]);
+    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"]);
     const nvlRef = useMemo(() => rawNvlRef !== null && rawNvlRef !== void 0 ? rawNvlRef : React.createRef(), [rawNvlRef]);
     const instanceId = useId();
     // Respect NDL theme changes
@@ -146,6 +146,11 @@ export function GraphVisualization(_a) {
         onChange: rawSetSelected,
         state: rawSelected !== null && rawSelected !== void 0 ? rawSelected : { nodeIds: [], relationshipIds: [] },
     });
+    const [layout, setLayout] = useSemicontrolledState({
+        isControlled: rawLayout !== undefined,
+        onChange: rawSetLayout,
+        state: rawLayout !== null && rawLayout !== void 0 ? rawLayout : 'd3Force',
+    });
     const nvlGraph = useMemo(() => mapToNvlGraph(rawNodes, rawRels), [rawNodes, rawRels]);
     const { nodesWithState, relsWithState, wrappedMouseEventCallbacks } = useManagedNodeState({
         gesture,
@@ -190,12 +195,14 @@ export function GraphVisualization(_a) {
     return (_jsx(Component, Object.assign({ ref: ref, className: cx('ndl-graph-visualization-container', className), style: style }, htmlAttributes, { children: _jsxs(GraphVisualizationContext.Provider, { value: {
                 gesture,
                 interactionMode,
+                layout,
                 nvlGraph,
                 nvlInstance: nvlRef,
                 selected,
                 setGesture,
+                setLayout,
                 sidepanel,
-            }, children: [_jsxs("div", { className: "ndl-graph-visualization", children: [_jsx(InteractiveNvlWrapper, Object.assign({ layout: "d3Force", nodes: nodesWithState, rels: relsWithState, nvlOptions: Object.assign(Object.assign(Object.assign({}, DEFAULT_NVL_OPTIONS), { instanceId, styling: {
+            }, children: [_jsxs("div", { className: "ndl-graph-visualization", children: [_jsx(InteractiveNvlWrapper, Object.assign({ layout: layout, nodes: nodesWithState, rels: relsWithState, nvlOptions: Object.assign(Object.assign(Object.assign({}, DEFAULT_NVL_OPTIONS), { instanceId, styling: {
                                     defaultRelationshipColor: border.strongest,
                                     disabledItemColor: bg.strong,
                                     disabledItemFontColor: text.weakest,
@@ -310,4 +317,18 @@ GraphVisualization.SearchButton = SearchButton;
  */
 GraphVisualization.SingleSelectionSidePanelContents =
     SingleSelectionSidepanelContents;
+/**
+ * Layout selection button for use within a GraphVisualization component.
+ *
+ * @remarks
+ * Opens a menu to select different graph layout algorithms.
+ *
+ * By default, the menu includes the **force-based** (`d3Force`) and
+ * **hierarchical** layouts. Additional layouts can be enabled via configuration.
+ *
+ * @see {@link LayoutSelectOption} for the full set of layout options supported by NVL.
+ *
+ * @alpha
+ */
+GraphVisualization.LayoutSelectButton = LayoutSelectButton;
 //# sourceMappingURL=graph-visualization.js.map

package/lib/esm/graph-visualization.js.map CHANGED Viewed

	@@ -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 {\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 LassoSelectButton,\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>\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\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 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\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 nvlGraph,\n nvlInstance: nvlRef,\n selected,\n setGesture,\n sidepanel,\n }}\n >\n <div className=\"ndl-graph-visualization\">\n <InteractiveNvlWrapper\n key={key}\n layout=\"d3Force\"\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"]}
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 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>\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"]}

package/lib/esm/stories/graph-visualization-maximalist.story.js CHANGED Viewed

@@ -19,7 +19,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  *  You should have received a copy of the GNU General Public License
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
-import { IconButtonArray } from '@neo4j-ndl/react';
+import { Divider, IconButtonArray } from '@neo4j-ndl/react';
 import { useState } from 'react';
 import { GraphVisualization } from '../graph-visualization';
 const nodes = [
@@ -88,7 +88,9 @@ export const containerClasses = 'n-w-full n-border-neutral-border-weak n-mx-2 n-
 const Component = () => {
     const [isOpen, setIsOpen] = useState(true);
     const [gesture, setGesture] = useState('box');
-    return (_jsx("div", { style: { height: '600px' }, children: _jsx(GraphVisualization, { gesture: gesture, setGesture: setGesture, bottomLeftIsland: _jsxs(IconButtonArray, { children: [_jsx(GraphVisualization.LassoSelectButton, {}), _jsx(GraphVisualization.SingleSelectButton, {}), _jsx(GraphVisualization.BoxSelectButton, {})] }), bottomRightIsland: _jsxs(IconButtonArray, { children: [_jsx(GraphVisualization.ZoomInButton, {}), _jsx(GraphVisualization.ZoomOutButton, {}), _jsx(GraphVisualization.ZoomToFitButton, {})] }), nodes: nodes, rels: rels, sidepanel: {
+    // Hierarchical layout not working properly with storybook
+    const [layout, setLayout] = useState('hierarchical');
+    return (_jsx("div", { style: { height: '600px' }, children: _jsx(GraphVisualization, { gesture: gesture, setGesture: setGesture, layout: layout, setLayout: setLayout, bottomLeftIsland: _jsxs(IconButtonArray, { children: [_jsx(GraphVisualization.LassoSelectButton, {}), _jsx(GraphVisualization.SingleSelectButton, {}), _jsx(GraphVisualization.BoxSelectButton, {})] }), bottomRightIsland: _jsxs(IconButtonArray, { children: [_jsx(GraphVisualization.LayoutSelectButton, { menuPlacement: "top-end-bottom-end" }), _jsx(Divider, { orientation: "vertical" }), _jsx(GraphVisualization.ZoomInButton, {}), _jsx(GraphVisualization.ZoomOutButton, {}), _jsx(GraphVisualization.ZoomToFitButton, {})] }), nodes: nodes, rels: rels, sidepanel: {
                 children: _jsx(GraphVisualization.SingleSelectionSidePanelContents, {}),
                 isSidePanelOpen: isOpen,
                 onSidePanelResize: () => {

package/lib/esm/stories/graph-visualization-maximalist.story.js.map CHANGED Viewed

	@@ -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,eAAe,EAAE,MAAM,kBAAkB,CAAC;~~AACnD~~,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;~~IAEvD~~,OAAO,CACL,cAAK,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,YAC7B,KAAC,kBAAkB,IACjB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,gBAAgB,EACd,MAAC,eAAe,eACd,KAAC,kBAAkB,CAAC,iBAAiB,KAAG,EACxC,KAAC,kBAAkB,CAAC,kBAAkB,KAAG,EACzC,KAAC,kBAAkB,CAAC,eAAe,KAAG,IACtB,EAEpB,iBAAiB,EACf,MAAC,eAAe,eACd,KAAC,kBAAkB,CAAC,YAAY,KAAG,EACnC,KAAC,kBAAkB,CAAC,aAAa,KAAG,EACpC,KAAC,kBAAkB,CAAC,eAAe,KAAG,IACtB,EAEpB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,SAAS,EAAE;gBACT,QAAQ,EAAE,KAAC,kBAAkB,CAAC,gCAAgC,KAAG;gBACjE,eAAe,EAAE,MAAM;gBACvB,iBAAiB,EAAE,GAAG,EAAE;oBACtB,WAAW;gBACb,CAAC;gBACD,kBAAkB,EAAE,SAAS;gBAC7B,cAAc,EAAE,GAAG;aACpB,EACD,aAAa,EAAE,KAAC,kBAAkB,CAAC,cAAc,KAAG,EACpD,cAAc,EAAE,KAAC,kBAAkB,CAAC,qBAAqB,KAAG,EAC5D,SAAS,EAAE,gBAAgB,GAC3B,GACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,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 { IconButtonArray } from '@neo4j-ndl/react';\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\n return (\n <div style={{ height: '600px' }}>\n <GraphVisualization\n gesture={gesture}\n setGesture={setGesture}\n bottomLeftIsland={\n <IconButtonArray>\n <GraphVisualization.LassoSelectButton />\n <GraphVisualization.SingleSelectButton />\n <GraphVisualization.BoxSelectButton />\n </IconButtonArray>\n }\n bottomRightIsland={\n <IconButtonArray>\n <GraphVisualization.ZoomInButton />\n <GraphVisualization.ZoomOutButton />\n <GraphVisualization.ZoomToFitButton />\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	+ {"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 bottomLeftIsland={\n <IconButtonArray>\n <GraphVisualization.LassoSelectButton />\n <GraphVisualization.SingleSelectButton />\n <GraphVisualization.BoxSelectButton />\n </IconButtonArray>\n }\n bottomRightIsland={\n <IconButtonArray>\n <GraphVisualization.LayoutSelectButton menuPlacement=\"top-end-bottom-end\" />\n <Divider orientation=\"vertical\" />\n <GraphVisualization.ZoomInButton />\n <GraphVisualization.ZoomOutButton />\n <GraphVisualization.ZoomToFitButton />\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"]}

package/lib/types/graph-visualization-buttons.d.ts CHANGED Viewed

@@ -18,7 +18,8 @@
  *  You should have received a copy of the GNU General Public License
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
-import { CleanIconButton, type Tooltip } from '@neo4j-ndl/react';
+import { CleanIconButton, Menu, type Tooltip } from '@neo4j-ndl/react';
+import { type Layout } from '@neo4j-nvl/base';
 import { type PropsWithChildren } from 'react';
 type GraphVisualizationButtonProps = {
     tooltipPlacement?: React.ComponentProps<typeof Tooltip>['placement'];
@@ -63,5 +64,13 @@ type SearchButtonProps = GraphVisualizationButtonProps & {
 };
 export declare const SearchButton: ({ className, style, htmlAttributes, tooltipPlacement, open: rawOpen, setOpen: rawSetOpen, searchTerm: rawSearchTerm, setSearchTerm: rawSetSearchTerm, onSearch, }: SearchButtonProps) => import("react/jsx-runtime").JSX.Element;
 export declare const DownloadButton: ({ className, style, htmlAttributes, tooltipPlacement, }: GraphVisualizationButtonProps) => import("react/jsx-runtime").JSX.Element;
+export type LayoutSelectOption = Record<Layout, {
+    icon: React.ReactNode;
+    title: string;
+}>;
+export declare const LayoutSelectButton: ({ className, style, htmlAttributes, tooltipPlacement, menuPlacement, layoutOptions, }: GraphVisualizationButtonProps & {
+    menuPlacement?: React.ComponentProps<typeof Menu>["placement"];
+    layoutOptions?: Partial<LayoutSelectOption>;
+}) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=graph-visualization-buttons.d.ts.map

package/lib/types/graph-visualization-buttons.d.ts.map CHANGED Viewed

	@@ -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,~~EAIf~~,KAAK,OAAO,EACb,MAAM,kBAAkB,CAAC;~~AAc1B~~,OAAO,EACL,KAAK,iBAAiB,EAKvB,MAAM,OAAO,CAAC;AASf,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;AA6CF,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,4CA2EnB,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,yDAK5B,6BAA6B,4CAyC/B,CAAC"}
1	+ {"version":3,"file":"graph-visualization-buttons.d.ts","sourceRoot":"","sources":["../../src/graph-visualization-buttons.tsx"],"names":[],"mappings":"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"}

package/lib/types/graph-visualization-context.d.ts CHANGED Viewed

@@ -19,7 +19,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import type NVL from '@neo4j-nvl/base';
-import { type Node, type Relationship } from '@neo4j-nvl/base';
+import { type Layout, type Node, type Relationship } from '@neo4j-nvl/base';
 export type GraphSelection = {
     nodeIds: string[];
     relationshipIds: string[];
@@ -87,6 +87,8 @@ export type GraphVisualizationContextData = {
     interactionMode: InteractionMode;
     nvlGraph: NvlGraph;
     selected: GraphSelection;
+    layout: Layout;
+    setLayout?: (layout: Layout) => void;
 };
 export declare const GraphVisualizationContext: import("react").Context<GraphVisualizationContextData | undefined>;
 /**

package/lib/types/graph-visualization-context.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"graph-visualization-context.d.ts","sourceRoot":"","sources":["../../src/graph-visualization-context.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,KAAK,GAAG,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;~~AAG/D~~,MAAM,MAAM,cAAc,GAAG;IAAE,OAAO,EAAE,MAAM,EAAE,CAAC;IAAC,eAAe,EAAE,MAAM,EAAE,CAAA;CAAE,CAAC;AAC9E,MAAM,MAAM,SAAS,GAAG;IACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,eAAe,EAAE,OAAO,CAAC;IACzB,kBAAkB,CAAC,EAAE,CAAC,eAAe,EAAE,OAAO,KAAK,IAAI,CAAC;IACxD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACrB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,IAAI,EAAE,YAAY,EAAE,CAAC;IACrB,eAAe,EAAE,eAAe,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,eAAe,EAAE,MAAM,CAAA;CAAE,CAAC;AAChF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IAChC,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACvC,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC;IACjD,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC;CACjD,CAAC;AAKF,MAAM,MAAM,gBAAgB,GAAG;IAAE,WAAW,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAErE,MAAM,MAAM,QAAQ,GAAG;IACrB,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAC7C,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AACF,MAAM,MAAM,OAAO,GAAG;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAC7C,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAEF,MAAM,MAAM,OAAO,GAAG,IAAI,GAAG;IAC3B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAC7C,MAAM,EAAE,MAAM,EAAE,CAAC;CAClB,CAAC;AACF,MAAM,MAAM,MAAM,GAAG,YAAY,GAAG;IAClC,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAC7C,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,6BAA6B,GAAG;IAC1C,WAAW,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,GAAG,IAAI,CAAC,CAAC;IAChD,SAAS,EAAE,SAAS,GAAG,IAAI,CAAC;IAC5B,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,eAAe,EAAE,eAAe,CAAC;IACjC,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,cAAc,CAAC;~~CAC1B~~,CAAC;AAEF,eAAO,MAAM,yBAAyB,oEAE1B,CAAC;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,eAAO,MAAM,4BAA4B,qCAQxC,CAAC;AAEF,MAAM,MAAM,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,OAAO,CAAC;AAEjD,MAAM,MAAM,eAAe,GACvB,QAAQ,GACR,MAAM,GACN,WAAW,GACX,KAAK,GACL,MAAM,GACN,MAAM,CAAC"}
1	+ {"version":3,"file":"graph-visualization-context.d.ts","sourceRoot":"","sources":["../../src/graph-visualization-context.tsx"],"names":[],"mappings":"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"}

package/lib/types/graph-visualization.d.ts CHANGED Viewed

@@ -19,6 +19,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import type NVL from '@neo4j-nvl/base';
+import { type Layout } from '@neo4j-nvl/base';
 import { type InteractiveNvlWrapperProps } from '@neo4j-nvl/react';
 import React from 'react';
 import { type Gesture, type GraphSelection, type InteractionMode, type NeoNode, type NeoRel, type Sidepanel } from './graph-visualization-context';
@@ -44,6 +45,8 @@ export type GraphVisualizationProps<T extends React.ElementType = 'div'> = {
     setSelected?: (newSelection: GraphSelection) => void;
     interactionMode?: InteractionMode;
     setInteractionMode?: (interactionMode: InteractionMode) => void;
+    layout?: Layout;
+    setLayout?: (layout: Layout) => void;
     nodes: NeoNode[];
     rels: NeoRel[];
     highlightedNodeIds?: string[];
@@ -110,7 +113,7 @@ export type GraphVisualizationProps<T extends React.ElementType = 'div'> = {
  *
  * @alpha
  */
-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, selected: rawSelected, setSelected: rawSetSelected, interactionMode: rawInteractionMode, setInteractionMode: rawSetInteractionMode, mouseEventCallbacks, className, style, htmlAttributes, ref, as, ...restProps }: GraphVisualizationProps<T>): import("react/jsx-runtime").JSX.Element;
+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;
 export declare namespace GraphVisualization {
     var ZoomInButton: ({ className, style, htmlAttributes, tooltipPlacement, }: {
         tooltipPlacement?: React.ComponentProps<{
@@ -362,5 +365,42 @@ export declare namespace GraphVisualization {
         onSearch?: (nodeIds: string[] | undefined, relationshipIds: string[] | undefined) => void;
     }) => import("react/jsx-runtime").JSX.Element;
     var SingleSelectionSidePanelContents: () => import("react/jsx-runtime").JSX.Element;
+    var LayoutSelectButton: ({ className, style, htmlAttributes, tooltipPlacement, menuPlacement, layoutOptions, }: {
+        tooltipPlacement?: React.ComponentProps<{
+            ({ children, isDisabled, type, isInitialOpen, placement, isOpen, onOpenChange, isPortaled: isPortaledProp, floatingStrategy: strategyProp, hoverDelay, shouldCloseOnReferenceClick, autoUpdateOptions, }: import("@neo4j-ndl/react/lib/types/tooltip").TooltipProps): import("react/jsx-runtime").JSX.Element;
+            displayName: string;
+        } & {
+            Actions: ({ children, className, style, htmlAttributes, ref, ...restProps }: import("@neo4j-ndl/react/lib/types/_common/types").CommonProps<"div", {
+                children: React.ReactNode;
+            }>) => import("react/jsx-runtime").JSX.Element | null;
+            Body: ({ children, className, style, htmlAttributes, passThroughProps, ref, ...restProps }: import("@neo4j-ndl/react/lib/types/_common/types").CommonProps<"span", import("@neo4j-ndl/react/lib/types/tooltip").TooltipBodyProps>) => import("react/jsx-runtime").JSX.Element | null;
+            Content: ({ children, style, htmlAttributes, className, ref, ...restProps }: import("@neo4j-ndl/react/lib/types/_common/types").CommonProps<"div", {
+                children: React.ReactNode;
+            }>) => import("react/jsx-runtime").JSX.Element | null;
+            Header: ({ children, passThroughProps, typographyVariant, className, style, htmlAttributes, ref, ...restProps }: import("@neo4j-ndl/react/lib/types/_common/types").CommonProps<"span", {
+                children: React.ReactNode;
+                passThroughProps?: Partial<React.ComponentPropsWithoutRef<typeof import("@neo4j-ndl/react").Typography>>;
+                typographyVariant?: import("@neo4j-ndl/react/lib/types/typography").TypographyVariants;
+            }>) => import("react/jsx-runtime").JSX.Element | null;
+            Trigger: ({ children, hasButtonWrapper, htmlAttributes, className, style, ref, ...restProps }: import("@neo4j-ndl/react/lib/types/_common/types").CommonProps<"button", {
+                children: React.ReactNode;
+                hasButtonWrapper?: boolean;
+            }>) => import("react/jsx-runtime").JSX.Element;
+        }>["placement"];
+        className?: string;
+        style?: React.CSSProperties;
+        htmlAttributes?: React.ComponentPropsWithRef<typeof import("@neo4j-ndl/react").CleanIconButton>["htmlAttributes"];
+        ref?: React.ComponentPropsWithRef<"button">["ref"];
+    } & {
+        menuPlacement?: React.ComponentProps<((props: React.ComponentProps<(<T extends React.ElementType = "div">({ children, isOpen: controlledOpen, onClose, isRoot, anchorRef, as, className, placement, minWidth, title, isDisabled, description, icon, isPortaled, portalTarget, htmlAttributes, strategy, ref: forwardedRef, }: import("@neo4j-ndl/react/lib/types/_common/types").PolymorphicCommonProps<T, import("@neo4j-ndl/react/lib/types/menu/menu-types").MenuProps>) => import("react/jsx-runtime").JSX.Element)>) => import("react/jsx-runtime").JSX.Element) & {
+            CategoryItem: <T extends React.ElementType = "button">({ children, className, style, as, htmlAttributes, ref, ...restProps }: import("@neo4j-ndl/react/lib/types/_common/types").PolymorphicCommonProps<T, import("@neo4j-ndl/react/lib/types/menu/menu-types").CategoryItemProps>) => import("react/jsx-runtime").JSX.Element;
+            Divider: <T extends React.ElementType = "div">({ orientation, as, style, className, htmlAttributes, ref, ...restProps }: import("@neo4j-ndl/react/lib/types/_common/types").PolymorphicCommonProps<T, {
+                orientation?: "horizontal" | "vertical";
+            }>) => import("react/jsx-runtime").JSX.Element;
+            Item: <T extends React.ElementType = "button">({ title, className, style, leadingVisual, trailingContent, description, isDisabled, as, onClick, onFocus, htmlAttributes, id, ref, }: import("@neo4j-ndl/react/lib/types/_common/types").PolymorphicCommonProps<T, import("@neo4j-ndl/react/lib/types/menu/menu-types").MenuItemProps>) => import("react/jsx-runtime").JSX.Element;
+            Items: <T extends React.ElementType = "div">({ as, children, className, htmlAttributes, style, ref, ...restProps }: import("@neo4j-ndl/react/lib/types/_common/types").PolymorphicCommonProps<T, import("@neo4j-ndl/react/lib/types/menu/menu-types").MenuItemsProps>) => import("react/jsx-runtime").JSX.Element;
+        }>["placement"];
+        layoutOptions?: Partial<import("./graph-visualization-buttons").LayoutSelectOption>;
+    }) => import("react/jsx-runtime").JSX.Element;
 }
 //# sourceMappingURL=graph-visualization.d.ts.map

package/lib/types/graph-visualization.d.ts.map CHANGED Viewed

	@@ -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,EAEL,KAAK,0BAA0B,EAChC,MAAM,kBAAkB,CAAC;AAE1B,OAAO,KAA8C,MAAM,OAAO,CAAC;~~AAanE~~,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;~~IAEhE~~,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,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,~~2CA8J5B~~;~~yBAxLe~~,kBAAkB;;;;;;~~yEA9DO~~,~~GAAI~~;;;~~wFAKwD~~,GAAI;~~yEAIzD~~,GAAI;;;~~6GAGqC~~,GAAI;;;;;~~2FAM9E~~,GAAI;;;;;;;;;;;;;;;~~yEAlBsB~~,~~GAAI~~;;;~~wFAKwD~~,GAAI;~~yEAIzD~~,GAAI;;;~~6GAGqC~~,GAAI;;;;;~~2FAM9E~~,GAAI;;;;;;;;;;;;;;;~~yEAlBsB~~,~~GAAI~~;;;~~wFAKwD~~,GAAI;~~yEAIzD~~,GAAI;;;~~6GAGqC~~,GAAI;;;;;~~2FAM9E~~,GAAI;;;;;;;;;;;;;;;~~yEAlBsB~~,~~GAAI~~;;;~~wFAKwD~~,GAAI;~~yEAIzD~~,GAAI;;;~~6GAGqC~~,GAAI;;;;;~~2FAM9E~~,GAAI;;;;;;;;;;;;;;;~~yEAlBsB~~,~~GAAI~~;;;~~wFAKwD~~,GAAI;~~yEAIzD~~,GAAI;;;~~6GAGqC~~,GAAI;;;;;~~2FAM9E~~,GAAI;;;;;;;;;;;;;;;~~yEAlBsB~~,~~GAAI~~;;;~~wFAKwD~~,GAAI;~~yEAIzD~~,GAAI;;;~~6GAGqC~~,GAAI;;;;;~~2FAM9E~~,GAAI;;;;;;;;;;;;;;;~~yEAlBsB~~,~~GAAI~~;;;~~wFAKwD~~,GAAI;~~yEAIzD~~,GAAI;;;~~6GAGqC~~,GAAI;;;;;~~2FAM9E~~,GAAI;;;;;;;;;;;;;;;~~yEAlBsB~~,~~GAAI~~;;;~~wFAKwD~~,GAAI;~~yEAIzD~~,GAAI;;;~~6GAGqC~~,GAAI;;;;;~~2FAM9E~~,GAAI;;;;;;;;;;;;;;;~~yEAlBsB~~,GAAI;;;~~wFAKwD~~,GAAI;~~yEAIzD~~,GAAI;;;~~6GAGqC~~,GAAI;;;;;~~2FAM9E~~,GAAI"}
1	+ {"version":3,"file":"graph-visualization.d.ts","sourceRoot":"","sources":["../../src/graph-visualization.tsx"],"names":[],"mappings":"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"}

package/lib/types/stories/graph-visualization-maximalist.story.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"graph-visualization-maximalist.story.d.ts","sourceRoot":"","sources":["../../../src/stories/graph-visualization-maximalist.story.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;~~AAwEH~~,eAAO,MAAM,gBAAgB,uEACyC,CAAC;AAEvE,QAAA,MAAM,SAAS,+~~CAwCd~~,CAAC;AAEF,eAAe,SAAS,CAAC"}
1	+ {"version":3,"file":"graph-visualization-maximalist.story.d.ts","sourceRoot":"","sources":["../../../src/stories/graph-visualization-maximalist.story.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAyEH,eAAO,MAAM,gBAAgB,uEACyC,CAAC;AAEvE,QAAA,MAAM,SAAS,+CA8Cd,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@neo4j-ndl/react-graph",
-  "version": "1.0.47",
+  "version": "1.1.1",
   "sideEffects": false,
   "description": "React implementation of the graph visualization from Neo4j Design System",
   "keywords": [
@@ -55,8 +55,8 @@
     "@neo4j-nvl/base": "^1.0.0",
     "@neo4j-nvl/interaction-handlers": "^1.0.0",
     "@neo4j-nvl/react": "^1.0.0",
-    "@neo4j-ndl/base": "^4.3.0",
-    "@neo4j-ndl/react": "^4.3.0"
+    "@neo4j-ndl/base": "^4.3.2",
+    "@neo4j-ndl/react": "^4.3.2"
   },
   "dependencies": {
     "classnames": "2.5.1",