chore(core,composables): update jsdocs

Author: bcakmakoglu

packages/core/src/composables/useConnection.ts

@@ -1,24 +1,11 @@
-import type { VueFlowStore } from '../types'
 import { useVueFlow } from './useVueFlow'
 
-export interface UseConnectionReturn {
-  startHandle: VueFlowStore['connectionStartHandle']
-  endHandle: VueFlowStore['connectionEndHandle']
-  status: VueFlowStore['connectionStatus']
-  position: VueFlowStore['connectionPosition']
-}
-
 /**
- * Hook for accessing the ongoing connection.
+ * Composable for accessing the currently ongoing connection.
  *
- * @returns ongoing connection: startHandle, endHandle, status, position
+ * @returns current connection: startHandle, endHandle, status, position
  */
-export function useConnection(): {
-  startHandle: VueFlowStore['connectionStartHandle']
-  endHandle: VueFlowStore['connectionEndHandle']
-  status: VueFlowStore['connectionStatus']
-  position: VueFlowStore['connectionPosition'] | null
-} {
+export function useConnection() {
   const {
     connectionStartHandle: startHandle,
     connectionEndHandle: endHandle,

packages/core/src/composables/useEdge.ts

@@ -5,11 +5,14 @@ import { EdgeId, EdgeRef } from '../context'
 import { useVueFlow } from './useVueFlow'
 
 /**
- * Access an edge
+ * This composable provides access to an edge object and it's dom element
  *
  * If no edge id is provided, the edge id is injected from context
  *
- * Meaning if you do not provide an id, this composable has to be called in a child of your custom edge component, or it will throw
+ * If you do not provide an id, this composable has to be called in a child of your custom edge component, or it will throw
+ *
+ * @param id - The id of the edge to access
+ * @returns the edge id, the edge and the edge dom element
  */
 export function useEdge<Data = ElementData, CustomEvents extends Record<string, CustomEvent> = any>(id?: string) {
   const edgeId = id ?? inject(EdgeId, '')

packages/core/src/composables/useHandle.ts

@@ -31,6 +31,11 @@ function alwaysValid() {
   return true
 }
 
+/**
+ * This composable provides listeners for handle events
+ *
+ * Generally it's recommended to use the `<Handle />` component instead of this composable.
+ */
 export function useHandle({
   handleId,
   nodeId,

packages/core/src/composables/useHandleConnections.ts

@@ -18,13 +18,13 @@ interface UseHandleConnectionsParams {
 /**
  * Composable that returns existing connections of a handle
  *
- * @public
  * @param UseHandleConnectionsParams
  * @param UseHandleConnectionsParams.type - handle type `source` or `target`
  * @param UseHandleConnectionsParams.nodeId - node id - if not provided, the node id from the `useNodeId` (meaning, the context-based injection) is used
  * @param UseHandleConnectionsParams.id - the handle id (this is required if the node has multiple handles of the same type)
  * @param UseHandleConnectionsParams.onConnect - gets called when a connection is created
  * @param UseHandleConnectionsParams.onDisconnect - gets called when a connection is removed
+ *
  * @returns An array of connections
  */
 export function useHandleConnections({

packages/core/src/composables/useNode.ts

@@ -6,11 +6,14 @@ import { useVueFlow } from './useVueFlow'
 import { useNodeId } from './useNodeId'
 
 /**
- * Access a node, it's parent (if one exists) and connected edges
+ * This composable provides access to a node object, parent node object, connected edges and it's dom element
  *
  * If no node id is provided, the node id is injected from context
  *
- * Meaning if you do not provide an id, this composable has to be called in a child of your custom node component, or it will throw
+ * If you do not provide an id, this composable has to be called in a child of your custom node component, or it will throw
+ *
+ * @param id - The id of the node to access
+ * @returns the node id, the node, the node dom element, it's parent and connected edges
  */
 export function useNode<Data = ElementData, CustomEvents extends Record<string, CustomEvent> = any>(id?: string) {
   const nodeId = id ?? useNodeId() ?? ''

packages/core/src/composables/useNodeId.ts

@@ -1,6 +1,13 @@
 import { inject } from 'vue'
 import { NodeId } from '../context'
 
+/**
+ * This composable returns the current node id from the ctx.
+ *
+ * It should be used inside a (custom-)node components ctx as the id is provided by the internal `NodeWrapper` component.
+ *
+ * @returns the current node id
+ */
 export function useNodeId() {
-  return inject(NodeId, null)
+  return inject(NodeId, '')
 }

packages/core/src/composables/useNodesData.ts

@@ -10,7 +10,6 @@ type NodeData<NodeType extends Node = GraphNode> = NonNullable<NodeType['data']>
 /**
  * Composable for receiving data of one or multiple nodes
  *
- * @public
  * @param nodeId - The id (or ids) of the node to get the data from
  * @param guard - Optional guard function to narrow down the node type
  * @returns An array of data objects

packages/core/src/composables/useVueFlow.ts

@@ -87,6 +87,15 @@ type Injection = VueFlowStore | null | undefined
 type Scope = (EffectScope & { vueFlowId: string }) | undefined
 
 // todo: maybe replace the storage with a context based solution; This would break calling useVueFlow outside a setup function though, which should be fine
+/**
+ * Composable that provides access to a store instance
+ *
+ * If no id is provided, the store instance is injected from context
+ *
+ * If no store instance is found in context, a new store instance is created and registered in storage
+ *
+ * @returns a vue flow store instance
+ */
 export function useVueFlow(options?: FlowProps): VueFlowStore {
   const storage = Storage.getInstance()