fix!: prop typings

* remove wrapper exports from library

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>

src/container/EdgeRenderer/EdgeRenderer.vue

@@ -43,7 +43,7 @@ const props = withDefaults(defineProps<EdgeRendererProps>(), {
   edgeUpdaterRadius: 10,
 })
 
-const getType = (type: string) => {
+const getType = (type?: string) => {
   const t = type ?? 'default'
   let edgeType = props.edgeTypes[t]
   if (!edgeType) {
@@ -124,10 +124,10 @@ export default {
       </EdgeWrapper>
       <ConnectionLine
         v-if="connectionLineVisible && sourceNode"
+        :vf="sourceNode?.__vf"
         :connection-line-style="props.connectionLineStyle"
         :connection-line-type="props.connectionLineType"
         :connection-handle-id="props.connectionHandleId"
-        :vf="sourceNode?.__vf"
         :connection-node-id="props.connectionNodeId"
         :connection-handle-type="props.connectionHandleType"
         :connection-position="props.connectionPosition"

src/container/NodeRenderer/NodeRenderer.vue

@@ -23,7 +23,7 @@ const props = withDefaults(defineProps<NodeRendererProps>(), {
   snapGrid: () => [15, 15],
 })
 
-const getType = (type: string) => {
+const getType = (type?: string) => {
   const t = type ?? 'default'
   let nodeType = props.nodeTypes[t]
   if (!nodeType) {

src/container/SelectionPane/SelectionPane.vue

@@ -7,7 +7,7 @@ import UserSelection from '../../components/UserSelection/UserSelection.vue'
 
 interface SelectionPaneProps {
   edges: Edge[]
-  selectedElements: FlowElements
+  selectedElements?: FlowElements
   selectionKeyCode?: KeyCode
   deleteKeyCode?: KeyCode
   multiSelectionKeyCode?: KeyCode
@@ -20,6 +20,7 @@ const props = withDefaults(defineProps<SelectionPaneProps>(), {
   deleteKeyCode: 'Backspace',
   multiSelectionKeyCode: 'Meta',
   elementsSelectable: true,
+  selectedElements: () => [],
 })
 
 const store = useStore()

src/container/VueFlow/VueFlow.vue

@@ -224,7 +224,7 @@ const transitionName = computed(() => {
                       #[`node-${nodeName}`]="nodeProps"
                       :key="`node-${nodeName}-${store.$id}`"
                     >
-                      <slot :name="`node-${nodeName}`" v-bind="nodeProps"></slot>
+                      <slot :name="`node-${nodeName}`" v-bind="nodeProps" />
                     </template>
                   </NodeRenderer>
                 </slot>
@@ -253,14 +253,14 @@ const transitionName = computed(() => {
                       #[`edge-${edgeName}`]="edgeProps"
                       :key="`edge-${edgeName}-${store.$id}`"
                     >
-                      <slot :name="`edge-${edgeName}`" v-bind="edgeProps"></slot>
+                      <slot :name="`edge-${edgeName}`" v-bind="edgeProps" />
                     </template>
                     <template #custom-connection-line="customConnectionLineProps">
                       <slot
                         :key="`connection-line-${store.$id}`"
                         name="custom-connection-line"
                         v-bind="customConnectionLineProps"
-                      ></slot>
+                      />
                     </template>
                   </EdgeRenderer>
                 </slot>

src/container/ZoomPane/ZoomPane.vue

@@ -209,7 +209,11 @@ export default {
   <div ref="zoomPane" class="vue-flow__renderer vue-flow__zoompane">
     <slot
       v-bind="{
-        transform,
+        transform: [
+          clamp(transform.x, store.translateExtent[0][0], store.translateExtent[1][0]),
+          clamp(transform.y, store.translateExtent[0][0], store.translateExtent[1][0]),
+          clamp(transform.zoom, store.translateExtent[0][0], store.translateExtent[1][0]),
+        ],
         dimensions: { width, height },
       }"
     />