diff --git a/packages/svelte/src/lib/components/Handle/Handle.svelte b/packages/svelte/src/lib/components/Handle/Handle.svelte
index 044b387a..a275e81b 100644
--- a/packages/svelte/src/lib/components/Handle/Handle.svelte
+++ b/packages/svelte/src/lib/components/Handle/Handle.svelte
@@ -13,12 +13,17 @@
   export let type: $$Props['type'] = 'source';
   export let position: $$Props['position'] = Position.Top;
   export let style: $$Props['style'] = undefined;
+  export let isConnectable: $$Props['isConnectable'] = true;
+  export let isConnectableStart: $$Props['isConnectableStart'] = true;
+  export let isConnectableEnd: $$Props['isConnectableEnd'] = true;
+
+
   let className: $$Props['class'] = undefined;
   export { className as class };
 
   const isTarget = type === 'target';
   const nodeId = getContext<string>('svelteflow__node_id');
-  const connectable = getContext<string>('svelteflow__node_connectable');
+  // const connectable = getContext<string>('svelteflow__node_connectable');
 
   const handleId = id || null;
   const dispatch = createEventDispatcher();
@@ -87,7 +92,9 @@
   ])}
   class:source={!isTarget}
   class:target={isTarget}
-  class:connectable
+  class:connectableStart={isConnectableStart}
+  class:isConnectableEnd={isConnectableEnd}
+  class:connectable={isConnectable}
   on:mousedown={onPointerDown}
   on:touchstart={onPointerDown}
   {style}
diff --git a/packages/svelte/src/lib/types/general.ts b/packages/svelte/src/lib/types/general.ts
index 918547e6..c7a9bb92 100644
--- a/packages/svelte/src/lib/types/general.ts
+++ b/packages/svelte/src/lib/types/general.ts
@@ -26,6 +26,9 @@ export type HandleComponentProps = {
   id?: string;
   class?: string;
   style?: string;
+  isConnectable?: boolean;,
+  isConnectableStart?: boolean;,
+  isConnectableEnd?: boolean;,
 };
 
 export type FitViewOptions = FitViewOptionsBase<Node>;
diff --git a/packages/utils/src/xyhandle/index.ts b/packages/utils/src/xyhandle/index.ts
index 69e35938..f5360180 100644
--- a/packages/utils/src/xyhandle/index.ts
+++ b/packages/utils/src/xyhandle/index.ts
@@ -266,8 +266,6 @@ function isValidHandle(
     endHandle: null,
   };
 
-  console.log(1, result);
-
   if (handleToCheck) {
     const handleType = getHandleType(undefined, handleToCheck);
     const handleNodeId = handleToCheck.getAttribute('data-nodeid');