refactor(hooks): rename useNodeDimensions to useNodeBounds

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 {
+function useNodeBounds(id: string): NodeBounds | null {
-  const nodeDimensions = useStore(
+  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,
+          width: nodeItem.width ?? null,
-          height: nodeItem.height ?? 0,
+          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;

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';

src/types/nodes.ts

@@ -111,3 +111,8 @@ export type NodeInternalsItem = Node & {
 };
 
 export type NodeInternals = Map<string, NodeInternalsItem>;
+
+export type NodeBounds = XYPosition & {
+  width: number | null;
+  height: number | null;
+};