diff --git a/src/hooks/useNodeDimensions.ts b/src/hooks/useNodeBounds.ts similarity index 58% rename from src/hooks/useNodeDimensions.ts rename to src/hooks/useNodeBounds.ts index 9cd512bb..e5f73d3f 100644 --- a/src/hooks/useNodeDimensions.ts +++ b/src/hooks/useNodeBounds.ts @@ -1,11 +1,11 @@ import { useCallback } from 'react'; import shallow from 'zustand/shallow'; -import { Rect } from '../types'; +import { NodeBounds } from '../types'; import { useStore } from '../store'; -function useNodeDimensions(id: string): Rect | null { - const nodeDimensions = useStore( +function useNodeBounds(id: string): NodeBounds | null { + const nodeBounds = useStore( useCallback( (s) => { const nodeItem = s.nodeInternals.get(id); @@ -16,8 +16,8 @@ function useNodeDimensions(id: string): Rect | null { return { ...nodeItem.positionAbsolute, - width: nodeItem.width ?? 0, - height: nodeItem.height ?? 0, + width: nodeItem.width ?? null, + height: nodeItem.height ?? null, }; }, [id] @@ -25,7 +25,7 @@ function useNodeDimensions(id: string): Rect | null { shallow ); - return nodeDimensions; + return nodeBounds; } -export default useNodeDimensions; +export default useNodeBounds; diff --git a/src/index.ts b/src/index.ts index 71856c24..ab8ee442 100644 --- a/src/index.ts +++ b/src/index.ts @@ -27,6 +27,7 @@ export { applyNodeChanges, applyEdgeChanges } from './utils/changes'; export { default as useZoomPanHelper } from './hooks/useZoomPanHelper'; export { default as useUpdateNodeInternals } from './hooks/useUpdateNodeInternals'; +export { default as useNodeBounds } from './hooks/useNodeBounds'; export * from './hooks/useNodesEdgesState'; export * from './additional-components'; diff --git a/src/types/nodes.ts b/src/types/nodes.ts index 9b876467..d1e25896 100644 --- a/src/types/nodes.ts +++ b/src/types/nodes.ts @@ -111,3 +111,8 @@ export type NodeInternalsItem = Node & { }; export type NodeInternals = Map; + +export type NodeBounds = XYPosition & { + width: number | null; + height: number | null; +};