43 lines
1019 B
Svelte
43 lines
1019 B
Svelte
<script lang="ts">
|
|
import EdgeLabelRenderer from '$lib/components/EdgeLabelRenderer/EdgeLabelRenderer.svelte';
|
|
import type { BaseEdgeProps } from './types';
|
|
|
|
type $$Props = BaseEdgeProps;
|
|
|
|
export let path: $$Props['path'] = '';
|
|
export let label: $$Props['label'] = undefined;
|
|
export let labelX: $$Props['labelX'] = undefined;
|
|
export let labelY: $$Props['labelY'] = undefined;
|
|
export let interactionWidth: $$Props['interactionWidth'] = 20;
|
|
</script>
|
|
|
|
<path d={path} fill="none" class="react-flow__edge-path" />
|
|
|
|
{#if interactionWidth}
|
|
<path
|
|
d={path}
|
|
fill="none"
|
|
stroke-opacity={0}
|
|
stroke-width={interactionWidth}
|
|
class="react-flow__edge-interaction"
|
|
/>
|
|
{/if}
|
|
|
|
{#if label}
|
|
<EdgeLabelRenderer>
|
|
<div
|
|
class="react-flow__edge-label"
|
|
style:transform={`translate(-50%, -50%) translate(${labelX}px,${labelY}px)`}
|
|
>
|
|
{label}
|
|
</div>
|
|
</EdgeLabelRenderer>
|
|
{/if}
|
|
|
|
<style>
|
|
.react-flow__edge-label {
|
|
position: absolute;
|
|
background: white;
|
|
}
|
|
</style>
|