chore(pkg): remove "private" interfaces from components

docs/src/.vuepress/auto-imports.d.ts

@@ -112,6 +112,7 @@ declare global {
   const useCssModule: typeof import('vue')['useCssModule']
   const useCssVar: typeof import('@vueuse/core')['useCssVar']
   const useCssVars: typeof import('vue')['useCssVars']
+  const useCurrentElement: typeof import('@vueuse/core')['useCurrentElement']
   const useCycleList: typeof import('@vueuse/core')['useCycleList']
   const useDark: typeof import('@vueuse/core')['useDark']
   const useDateFormat: typeof import('@vueuse/core')['useDateFormat']
@@ -178,6 +179,7 @@ declare global {
   const useRafFn: typeof import('@vueuse/core')['useRafFn']
   const useRefHistory: typeof import('@vueuse/core')['useRefHistory']
   const useResizeObserver: typeof import('@vueuse/core')['useResizeObserver']
+  const useScreenOrientation: typeof import('@vueuse/core')['useScreenOrientation']
   const useScreenSafeArea: typeof import('@vueuse/core')['useScreenSafeArea']
   const useScriptTag: typeof import('@vueuse/core')['useScriptTag']
   const useScroll: typeof import('@vueuse/core')['useScroll']

package/src/auto-imports.d.ts

@@ -119,6 +119,7 @@ declare global {
   const useCssModule: typeof import('vue')['useCssModule']
   const useCssVar: typeof import('@vueuse/core')['useCssVar']
   const useCssVars: typeof import('vue')['useCssVars']
+  const useCurrentElement: typeof import('@vueuse/core')['useCurrentElement']
   const useCycleList: typeof import('@vueuse/core')['useCycleList']
   const useDark: typeof import('@vueuse/core')['useDark']
   const useDateFormat: typeof import('@vueuse/core')['useDateFormat']
@@ -185,6 +186,7 @@ declare global {
   const useRafFn: typeof import('@vueuse/core')['useRafFn']
   const useRefHistory: typeof import('@vueuse/core')['useRefHistory']
   const useResizeObserver: typeof import('@vueuse/core')['useResizeObserver']
+  const useScreenOrientation: typeof import('@vueuse/core')['useScreenOrientation']
   const useScreenSafeArea: typeof import('@vueuse/core')['useScreenSafeArea']
   const useScriptTag: typeof import('@vueuse/core')['useScriptTag']
   const useScroll: typeof import('@vueuse/core')['useScroll']

package/src/components/ConnectionLine/ConnectionLine.vue

@@ -5,11 +5,9 @@ import { ConnectionLineType, Position } from '../../types'
 import { useVueFlow } from '../../composables'
 import { Slots } from '../../context'
 
-interface ConnectionLineProps {
+const { sourceNode } = defineProps<{
   sourceNode: GraphNode
-}
+}>()
-
-const { sourceNode } = defineProps<ConnectionLineProps>()
 
 const {
   getNodes,

package/src/components/Edges/EdgeWrapper.vue

@@ -6,16 +6,14 @@ import { ConnectionMode, Position } from '../../types'
 import { connectionExists, getEdgePositions, getHandle, getMarkerId } from '../../utils'
 import EdgeAnchor from './EdgeAnchor'
 
-interface EdgeWrapper {
+const { id, edge, name, selectable, updatable, type } = defineProps<{
   id: string
   edge: GraphEdge
   selectable?: boolean
   updatable?: boolean
   type: EdgeComponent | Function | Object | false
   name: string
-}
+}>()
-
-const { id, edge, name, selectable, updatable, type } = defineProps<EdgeWrapper>()
 
 const { emits, connectionMode, edgeUpdaterRadius, noPanClassName, setState, getEdges, getEdge, getNode, addSelectedEdges } = $(
   useVueFlow(),

package/src/components/Nodes/NodeWrapper.vue

@@ -6,7 +6,7 @@ import type { GraphNode, NodeComponent, SnapGrid } from '../../types'
 import { NodeId } from '../../context'
 import { getHandleBounds, getXYZPos } from '../../utils'
 
-interface NodeWrapperProps {
+const { id, type, name, node, parentNode, draggable, selectable, connectable, snapGrid } = defineProps<{
   id: string
   node: GraphNode
   parentNode?: GraphNode
@@ -16,9 +16,7 @@ interface NodeWrapperProps {
   snapGrid?: SnapGrid
   type: NodeComponent | Function | Object | false
   name: string
-}
+}>()
-
-const { id, type, name, node, parentNode, draggable, selectable, connectable, snapGrid } = defineProps<NodeWrapperProps>()
 
 provide(NodeId, id)
 

package/src/components/UserSelection/SelectionRect.vue

@@ -1,12 +1,10 @@
 <script lang="ts" setup>
-interface SelectionRectProps {
+const { width, height, x, y } = defineProps<{
   width: number
   height: number
   x: number
   y: number
-}
+}>()
-
-const { width, height, x, y } = defineProps<SelectionRectProps>()
 </script>
 
 <script lang="ts">

package/src/container/EdgeRenderer/MarkerDefinitions.vue

@@ -4,11 +4,9 @@ import type { MarkerProps, MarkerType } from '../../types/edge'
 import { getMarkerId } from '../../utils'
 import Marker from './Marker.vue'
 
-interface MarkerDefinitionsProps {
+const { defaultColor = '' } = defineProps<{
   defaultColor: string
-}
+}>()
-
-const { defaultColor = '' } = defineProps<MarkerDefinitionsProps>()
 
 const { edges } = $(useVueFlow())