alighasami/xyflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

migrate some components

Browse Source
This commit is contained in:
peterkogo
2024-11-13 13:33:49 +01:00
parent 880ed8886b
commit 28e4fad342
31 changed files with 505 additions and 459 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/svelte/src/lib/components/edges/BezierEdge.svelte
+25 -24
View File
@@ -2,36 +2,37 @@
import { getBezierPath } from '@xyflow/system';
import type { BezierEdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
type $$Props = BezierEdgeProps;
export let id: $$Props['id'] = undefined;
export let label: $$Props['label'] = undefined;
export let labelStyle: $$Props['labelStyle'] = undefined;
export let style: $$Props['style'] = undefined;
export let markerStart: $$Props['markerStart'] = undefined;
export let markerEnd: $$Props['markerEnd'] = undefined;
export let pathOptions: $$Props['pathOptions'] = undefined;
export let interactionWidth: $$Props['interactionWidth'] = undefined;
export let sourceX: $$Props['sourceX'];
export let sourceY: $$Props['sourceY'];
export let sourcePosition: $$Props['sourcePosition'];
export let targetX: $$Props['targetX'];
export let targetY: $$Props['targetY'];
export let targetPosition: $$Props['targetPosition'];
$: [path, labelX, labelY] = getBezierPath({
let {
id,
label,
labelStyle,
style,
markerStart,
markerEnd,
pathOptions,
interactionWidth,
sourceX,
sourceY,
sourcePosition,
targetX,
targetY,
sourcePosition,
targetPosition,
curvature: pathOptions?.curvature
});
targetPosition
}: BezierEdgeProps = $props();
let [path, labelX, labelY] = $derived(
getBezierPath({
sourceX,
sourceY,
targetX,
targetY,
sourcePosition,
targetPosition,
curvature: pathOptions?.curvature
})
);
</script>
<BaseEdge
packages/svelte/src/lib/components/edges/BezierEdgeInternal.svelte
+20 -24
View File
@@ -3,35 +3,31 @@
import type { EdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
type $$Props = EdgeProps;
export let label: $$Props['label'] = undefined;
export let labelStyle: $$Props['labelStyle'] = undefined;
export let style: $$Props['style'] = undefined;
export let markerStart: $$Props['markerStart'] = undefined;
export let markerEnd: $$Props['markerEnd'] = undefined;
export let interactionWidth: $$Props['interactionWidth'] = undefined;
export let sourceX: $$Props['sourceX'];
export let sourceY: $$Props['sourceY'];
export let sourcePosition: $$Props['sourcePosition'];
export let targetX: $$Props['targetX'];
export let targetY: $$Props['targetY'];
export let targetPosition: $$Props['targetPosition'];
$: [path, labelX, labelY] = getBezierPath({
let {
sourceX,
sourceY,
sourcePosition,
targetX,
targetY,
sourcePosition,
targetPosition
});
targetPosition,
label,
labelStyle,
markerStart,
markerEnd,
interactionWidth,
style
}: EdgeProps = $props();
// this is a workaround for suppressing the warning about unused props
$$restProps;
let [path, labelX, labelY] = $derived(
getBezierPath({
sourceX,
sourceY,
targetX,
targetY,
sourcePosition,
targetPosition
})
);
</script>
<BaseEdge
packages/svelte/src/lib/components/edges/SmoothStepEdge.svelte
+25 -25
View File
@@ -4,35 +4,35 @@
import type { SmoothStepEdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
type $$Props = SmoothStepEdgeProps;
export let id: $$Props['id'] = undefined;
export let label: $$Props['label'] = undefined;
export let labelStyle: $$Props['labelStyle'] = undefined;
export let style: $$Props['style'] = undefined;
export let markerStart: $$Props['markerStart'] = undefined;
export let markerEnd: $$Props['markerEnd'] = undefined;
export let pathOptions: $$Props['pathOptions'] = undefined;
export let interactionWidth: $$Props['interactionWidth'] = undefined;
export let sourceX: $$Props['sourceX'];
export let sourceY: $$Props['sourceY'];
export let sourcePosition: $$Props['sourcePosition'];
export let targetX: $$Props['targetX'];
export let targetY: $$Props['targetY'];
export let targetPosition: $$Props['targetPosition'];
$: [path, labelX, labelY] = getSmoothStepPath({
let {
id,
label,
labelStyle,
style,
markerStart,
markerEnd,
pathOptions,
interactionWidth,
sourceX,
sourceY,
sourcePosition,
targetX,
targetY,
sourcePosition,
targetPosition,
borderRadius: pathOptions?.borderRadius,
offset: pathOptions?.offset
});
targetPosition
}: SmoothStepEdgeProps = $props();
let [path, labelX, labelY] = $derived(
getSmoothStepPath({
sourceX,
sourceY,
targetX,
targetY,
sourcePosition,
targetPosition,
borderRadius: pathOptions?.borderRadius,
offset: pathOptions?.offset
})
);
</script>
<BaseEdge
packages/svelte/src/lib/components/edges/SmoothStepEdgeInternal.svelte
+20 -23
View File
@@ -4,34 +4,31 @@
import type { EdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
type $$Props = EdgeProps;
export let label: $$Props['label'] = undefined;
export let labelStyle: $$Props['labelStyle'] = undefined;
export let style: $$Props['style'] = undefined;
export let markerStart: $$Props['markerStart'] = undefined;
export let markerEnd: $$Props['markerEnd'] = undefined;
export let interactionWidth: $$Props['interactionWidth'] = undefined;
export let sourceX: $$Props['sourceX'];
export let sourceY: $$Props['sourceY'];
export let sourcePosition: $$Props['sourcePosition'];
export let targetX: $$Props['targetX'];
export let targetY: $$Props['targetY'];
export let targetPosition: $$Props['targetPosition'];
$: [path, labelX, labelY] = getSmoothStepPath({
let {
sourceX,
sourceY,
sourcePosition,
targetX,
targetY,
sourcePosition,
targetPosition
});
targetPosition,
label,
labelStyle,
markerStart,
markerEnd,
interactionWidth,
style
}: EdgeProps = $props();
// this is a workaround for suppressing the warning about unused props
$$restProps;
let [path, labelX, labelY] = $derived(
getSmoothStepPath({
sourceX,
sourceY,
targetX,
targetY,
sourcePosition,
targetPosition
})
);
</script>
<BaseEdge
packages/svelte/src/lib/components/edges/StepEdge.svelte
+25 -25
View File
@@ -4,35 +4,35 @@
import type { StepEdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
type $$Props = StepEdgeProps;
export let id: $$Props['id'] = undefined;
export let label: $$Props['label'] = undefined;
export let labelStyle: $$Props['labelStyle'] = undefined;
export let style: $$Props['style'] = undefined;
export let markerStart: $$Props['markerStart'] = undefined;
export let markerEnd: $$Props['markerEnd'] = undefined;
export let pathOptions: $$Props['pathOptions'] = undefined;
export let interactionWidth: $$Props['interactionWidth'] = undefined;
export let sourceX: $$Props['sourceX'];
export let sourceY: $$Props['sourceY'];
export let sourcePosition: $$Props['sourcePosition'];
export let targetX: $$Props['targetX'];
export let targetY: $$Props['targetY'];
export let targetPosition: $$Props['targetPosition'];
$: [path, labelX, labelY] = getSmoothStepPath({
let {
id,
label,
labelStyle,
style,
markerStart,
markerEnd,
pathOptions,
interactionWidth,
sourceX,
sourceY,
sourcePosition,
targetX,
targetY,
sourcePosition,
targetPosition,
borderRadius: 0,
offset: pathOptions?.offset
});
targetPosition
}: StepEdgeProps = $props();
let [path, labelX, labelY] = $derived(
getSmoothStepPath({
sourceX,
sourceY,
targetX,
targetY,
sourcePosition,
targetPosition,
borderRadius: 0,
offset: pathOptions?.offset
})
);
</script>
<BaseEdge
packages/svelte/src/lib/components/edges/StepEdgeInternal.svelte
+20 -23
View File
@@ -4,35 +4,32 @@
import type { EdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
type $$Props = EdgeProps;
export let label: $$Props['label'] = undefined;
export let labelStyle: $$Props['labelStyle'] = undefined;
export let style: $$Props['style'] = undefined;
export let markerStart: $$Props['markerStart'] = undefined;
export let markerEnd: $$Props['markerEnd'] = undefined;
export let interactionWidth: $$Props['interactionWidth'] = undefined;
export let sourceX: $$Props['sourceX'];
export let sourceY: $$Props['sourceY'];
export let sourcePosition: $$Props['sourcePosition'];
export let targetX: $$Props['targetX'];
export let targetY: $$Props['targetY'];
export let targetPosition: $$Props['targetPosition'];
$: [path, labelX, labelY] = getSmoothStepPath({
let {
sourceX,
sourceY,
sourcePosition,
targetX,
targetY,
sourcePosition,
targetPosition,
borderRadius: 0
});
label,
labelStyle,
markerStart,
markerEnd,
interactionWidth,
style
}: EdgeProps = $props();
// this is a workaround for suppressing the warning about unused props
$$restProps;
let [path, labelX, labelY] = $derived(
getSmoothStepPath({
sourceX,
sourceY,
targetX,
targetY,
sourcePosition,
targetPosition,
borderRadius: 0
})
);
</script>
<BaseEdge
packages/svelte/src/lib/components/edges/StraightEdge.svelte
+18 -18
View File
@@ -4,28 +4,28 @@
import type { StraightEdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
type $$Props = StraightEdgeProps;
export let id: $$Props['id'] = undefined;
export let label: $$Props['label'] = undefined;
export let labelStyle: $$Props['labelStyle'] = undefined;
export let style: $$Props['style'] = undefined;
export let markerStart: $$Props['markerStart'] = undefined;
export let markerEnd: $$Props['markerEnd'] = undefined;
export let interactionWidth: $$Props['interactionWidth'] = undefined;
export let sourceX: $$Props['sourceX'];
export let sourceY: $$Props['sourceY'];
export let targetX: $$Props['targetX'];
export let targetY: $$Props['targetY'];
$: [path, labelX, labelY] = getStraightPath({
let {
id,
label,
labelStyle,
style,
markerStart,
markerEnd,
interactionWidth,
sourceX,
sourceY,
targetX,
targetY
});
}: StraightEdgeProps = $props();
let [path, labelX, labelY] = $derived(
getStraightPath({
sourceX,
sourceY,
targetX,
targetY
})
);
</script>
<BaseEdge
packages/svelte/src/lib/components/edges/StraightEdgeInternal.svelte
+17 -20
View File
@@ -4,30 +4,27 @@
import type { EdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
type $$Props = EdgeProps;
export let label: $$Props['label'] = undefined;
export let labelStyle: $$Props['labelStyle'] = undefined;
export let style: $$Props['style'] = undefined;
export let markerStart: $$Props['markerStart'] = undefined;
export let markerEnd: $$Props['markerEnd'] = undefined;
export let interactionWidth: $$Props['interactionWidth'] = undefined;
export let sourceX: $$Props['sourceX'];
export let sourceY: $$Props['sourceY'];
export let targetX: $$Props['targetX'];
export let targetY: $$Props['targetY'];
$: [path, labelX, labelY] = getStraightPath({
let {
sourceX,
sourceY,
targetX,
targetY
});
targetY,
label,
labelStyle,
markerStart,
markerEnd,
interactionWidth,
style
}: EdgeProps = $props();
// this is a workaround for suppressing the warning about unused props
$$restProps;
let [path, labelX, labelY] = $derived(
getStraightPath({
sourceX,
sourceY,
targetX,
targetY
})
);
</script>
<BaseEdge