fix(svelte) backup connection line now renders correctly

This commit is contained in:
Peter
2023-09-27 15:53:17 +02:00
parent 2e6c5d9191
commit 1d8fc1bfaf
3 changed files with 11 additions and 5 deletions

View File

@@ -26,7 +26,7 @@
<div style="height:100vh;">
<SvelteFlow {nodeTypes} {nodes} {edges} fitView>
<ConnectionLine slot="connectionLineComponent" />
<ConnectionLine slot="connectionLine" />
<Background variant={BackgroundVariant.Lines} />
</SvelteFlow>
</div>

View File

@@ -5,16 +5,18 @@
export let containerStyle: string = '';
export let style: string = '';
export let usingCustomLine: boolean = false;
const { width, height, connection } = useStore();
</script>
{#if $connection.path}
<svg width={$width} height={$height} class="svelte-flow__connectionline" style={containerStyle}>
<slot name="connectionLineComponent">
<slot name="connectionLine" />
{#if !usingCustomLine}
<g class={cc(['svelte-flow__connection', $connection.status])} {style}>
<path d={$connection.path} fill="none" class="svelte-flow__connection-path" />
</g>
</slot>
{/if}
</svg>
{/if}

View File

@@ -162,8 +162,12 @@
<Pane on:paneclick panOnDrag={panOnDrag === undefined ? true : panOnDrag}>
<ViewportComponent>
<EdgeRenderer on:edgeclick on:edgecontextmenu {defaultEdgeOptions} />
<ConnectionLine containerStyle={connectionLineContainerStyle} style={connectionLineStyle}>
<slot name="connectionLineComponent" slot="connectionLineComponent" />
<ConnectionLine
containerStyle={connectionLineContainerStyle}
style={connectionLineStyle}
usingCustomLine={$$slots.connectionLine}
>
<slot name="connectionLine" slot="connectionLine" />
</ConnectionLine>
<div class="svelte-flow__edgelabel-renderer" />
<NodeRenderer