clean up BaseEdge, fix store functions

This commit is contained in:
peterkogo
2024-12-10 12:12:21 +01:00
parent 9199cbd278
commit 0cd68914c1
16 changed files with 91 additions and 169 deletions
@@ -1 +0,0 @@
export { default as BaseEdge } from './BaseEdge.svelte';
@@ -1,23 +0,0 @@
import type { EdgeProps } from '$lib/types';
export type BaseEdgeProps = Pick<
EdgeProps,
'interactionWidth' | 'label' | 'labelStyle' | 'style'
> & {
id?: string;
/** SVG path of the edge */
path: string;
/** The x coordinate of the label */
labelX?: number;
/** The y coordinate of the label */
labelY?: number;
/** Marker at start of edge
* @example 'url(#arrow)'
*/
markerStart?: string;
/** Marker at end of edge
* @example 'url(#arrow)'
*/
markerEnd?: string;
class?: string;
};
@@ -4,7 +4,6 @@
import { getMarkerId } from '@xyflow/system';
import { useStore } from '$lib/store';
import { BezierEdgeInternal } from '$lib/components/edges';
import { useHandleEdgeSelect } from '$lib/hooks/useHandleEdgeSelect';
@@ -1,6 +1,6 @@
<script lang="ts">
import cc from 'classcat';
import type { BaseEdgeProps } from './types';
import type { BaseEdgeProps } from '../../types';
import EdgeLabel from '../EdgeLabel/EdgeLabel.svelte';
let {
@@ -1,25 +1,24 @@
<script lang="ts">
import { getBezierPath } from '@xyflow/system';
import BaseEdge from './BaseEdge.svelte';
import type { BezierEdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
let {
id,
interactionWidth,
label,
labelStyle,
style,
markerStart,
markerEnd,
markerStart,
pathOptions,
interactionWidth,
sourcePosition,
sourceX,
sourceY,
sourcePosition,
style,
targetPosition,
targetX,
targetY,
targetPosition
targetY
}: BezierEdgeProps = $props();
let [path, labelX, labelY] = $derived(
@@ -1,21 +1,22 @@
<script lang="ts">
import { getBezierPath } from '@xyflow/system';
import BaseEdge from './BaseEdge.svelte';
import type { EdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
let {
sourceX,
sourceY,
sourcePosition,
targetX,
targetY,
targetPosition,
interactionWidth,
label,
labelStyle,
markerStart,
markerEnd,
interactionWidth,
style
markerStart,
sourcePosition,
sourceX,
sourceY,
style,
targetPosition,
targetX,
targetY
}: EdgeProps = $props();
let [path, labelX, labelY] = $derived(
@@ -1,24 +1,24 @@
<script lang="ts">
import { getSmoothStepPath } from '@xyflow/system';
import BaseEdge from './BaseEdge.svelte';
import type { SmoothStepEdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
let {
id,
interactionWidth,
label,
labelStyle,
style,
markerStart,
markerEnd,
markerStart,
pathOptions,
interactionWidth,
sourcePosition,
sourceX,
sourceY,
sourcePosition,
targetPosition,
targetX,
targetY,
targetPosition
targetY
}: SmoothStepEdgeProps = $props();
let [path, labelX, labelY] = $derived(
@@ -1,22 +1,22 @@
<script lang="ts">
import { getSmoothStepPath } from '@xyflow/system';
import BaseEdge from './BaseEdge.svelte';
import type { EdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
let {
sourceX,
sourceY,
sourcePosition,
targetX,
targetY,
targetPosition,
interactionWidth,
label,
labelStyle,
markerStart,
style,
markerEnd,
interactionWidth,
style
markerStart,
sourcePosition,
sourceX,
sourceY,
targetPosition,
targetX,
targetY
}: EdgeProps = $props();
let [path, labelX, labelY] = $derived(
@@ -1,8 +1,8 @@
<script lang="ts">
import { getSmoothStepPath } from '@xyflow/system';
import BaseEdge from './BaseEdge.svelte';
import type { StepEdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
let {
id,
@@ -1,8 +1,8 @@
<script lang="ts">
import { getSmoothStepPath } from '@xyflow/system';
import BaseEdge from './BaseEdge.svelte';
import type { EdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
let {
sourceX,
@@ -1,8 +1,8 @@
<script lang="ts">
import { getStraightPath } from '@xyflow/system';
import BaseEdge from './BaseEdge.svelte';
import type { StraightEdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
let {
id,
@@ -1,8 +1,8 @@
<script lang="ts">
import { getStraightPath } from '@xyflow/system';
import BaseEdge from './BaseEdge.svelte';
import type { EdgeProps } from '$lib/types';
import { BaseEdge } from '$lib/components/BaseEdge';
let {
sourceX,
@@ -5,7 +5,7 @@
// @todo: how can we prevent this duplication in ...Edge/ ...EdgeInternal?
// both are quite similar, it's just about 1-2 props that are different
export { default as BezierEdge } from './BezierEdge.svelte';
export { default as BezierEdgeInternal } from './BezierEdgeInternal.svelte';
export { default as BezierEdgeInternal } from './BezierEdge.svelte';
export { default as SmoothStepEdge } from './SmoothStepEdge.svelte';
export { default as SmoothStepEdgeInternal } from './SmoothStepEdgeInternal.svelte';
@@ -15,3 +15,5 @@ export { default as StraightEdgeInternal } from './StraightEdgeInternal.svelte';
export { default as StepEdge } from './StepEdge.svelte';
export { default as StepEdgeInternal } from './StepEdgeInternal.svelte';
export { default as BaseEdge } from './BaseEdge.svelte';