Improve TSDoc comments for useNodesData, useReactFlow, isNode and isEdge
This commit is contained in:
5
.changeset/afraid-schools-beg.md
Normal file
5
.changeset/afraid-schools-beg.md
Normal file
@@ -0,0 +1,5 @@
|
||||
---
|
||||
'@xyflow/react': patch
|
||||
---
|
||||
|
||||
Improve TSDoc comments for `useNodesData`, `useReactFlow`, `isNode` and `isEdge`
|
||||
@@ -8,11 +8,9 @@ import type { Node } from '../types';
|
||||
* This hook lets you subscribe to changes of a specific nodes `data` object.
|
||||
*
|
||||
* @public
|
||||
* @param nodeId - The id (or ids) of the node to get the data from
|
||||
* @returns An object (or array of object) with {id, type, data} representing each node
|
||||
* @returns An object (or array of object) with `id`, `type`, `data` representing each node.
|
||||
*
|
||||
* @example
|
||||
*
|
||||
*```jsx
|
||||
*import { useNodesData } from '@xyflow/react';
|
||||
*
|
||||
@@ -25,9 +23,13 @@ import type { Node } from '../types';
|
||||
*```
|
||||
*/
|
||||
export function useNodesData<NodeType extends Node = Node>(
|
||||
/** The id of the node to get the data from. */
|
||||
nodeId: string
|
||||
): Pick<NodeType, 'id' | 'type' | 'data'> | null;
|
||||
export function useNodesData<NodeType extends Node = Node>(nodeIds: string[]): Pick<NodeType, 'id' | 'type' | 'data'>[];
|
||||
export function useNodesData<NodeType extends Node = Node>(
|
||||
/** The ids of the nodes to get the data from. */
|
||||
nodeIds: string[]
|
||||
): Pick<NodeType, 'id' | 'type' | 'data'>[];
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
export function useNodesData(nodeIds: any): any {
|
||||
const nodesData = useStore(
|
||||
|
||||
@@ -31,8 +31,6 @@ const selector = (s: ReactFlowState) => !!s.panZoom;
|
||||
* This hook returns a ReactFlowInstance that can be used to update nodes and edges, manipulate the viewport, or query the current state of the flow.
|
||||
*
|
||||
* @public
|
||||
* @returns ReactFlowInstance
|
||||
*
|
||||
* @example
|
||||
* ```jsx
|
||||
*import { useCallback, useState } from 'react';
|
||||
|
||||
@@ -4,21 +4,23 @@ import { isNodeBase, isEdgeBase } from '@xyflow/system';
|
||||
import type { Edge, Node } from '../types';
|
||||
|
||||
/**
|
||||
* Test whether an object is useable as an [`Node`](/api-reference/types/node).
|
||||
* Test whether an object is usable as an [`Node`](/api-reference/types/node).
|
||||
* In TypeScript this is a type guard that will narrow the type of whatever you pass in to
|
||||
* [`Node`](/api-reference/types/node) if it returns `true`.
|
||||
*
|
||||
* @public
|
||||
* @remarks In TypeScript this is a type guard that will narrow the type of whatever you pass in to Node if it returns true
|
||||
* @param element - The element to test
|
||||
* @returns A boolean indicating whether the element is an Node
|
||||
* @param element - The element to test.
|
||||
* @returns Tests whether the provided value can be used as a `Node`. If you're using TypeScript,
|
||||
* this function acts as a type guard and will narrow the type of the value to `Node` if it returns
|
||||
* `true`.
|
||||
*
|
||||
* @example
|
||||
* ```js
|
||||
*import { isNode } from '@xyflow/react';
|
||||
*
|
||||
*if (isNode(node)) {
|
||||
* // ..
|
||||
* // ...
|
||||
*}
|
||||
*```
|
||||
*/
|
||||
@@ -26,21 +28,23 @@ export const isNode = <NodeType extends Node = Node>(element: unknown): element
|
||||
isNodeBase<NodeType>(element);
|
||||
|
||||
/**
|
||||
* Test whether an object is useable as an [`Edge`](/api-reference/types/edge).
|
||||
* Test whether an object is usable as an [`Edge`](/api-reference/types/edge).
|
||||
* In TypeScript this is a type guard that will narrow the type of whatever you pass in to
|
||||
* [`Edge`](/api-reference/types/edge) if it returns `true`.
|
||||
*
|
||||
* @public
|
||||
* @remarks In TypeScript this is a type guard that will narrow the type of whatever you pass in to Edge if it returns true
|
||||
* @param element - The element to test
|
||||
* @returns A boolean indicating whether the element is an Edge
|
||||
* @returns Tests whether the provided value can be used as an `Edge`. If you're using TypeScript,
|
||||
* this function acts as a type guard and will narrow the type of the value to `Edge` if it returns
|
||||
* `true`.
|
||||
*
|
||||
* @example
|
||||
* ```js
|
||||
*import { isEdge } from '@xyflow/react';
|
||||
*
|
||||
*if (isEdge(edge)) {
|
||||
* // ..
|
||||
* // ...
|
||||
*}
|
||||
*```
|
||||
*/
|
||||
|
||||
Reference in New Issue
Block a user