feat(network): add orthogonal edge routing option
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -31,6 +31,7 @@ function getEdgePath(routing: string | null | undefined, props: EdgeProps) {
|
||||
}
|
||||
if (routing === 'curved') return getBezierPath(base)
|
||||
if (routing === 'step') return getSmoothStepPath(base)
|
||||
if (routing === 'orthogonal') return getSmoothStepPath({ ...base, borderRadius: 0 })
|
||||
return getStraightPath(base)
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { useCallback, useState, useEffect } from 'react'
|
||||
import {
|
||||
Trash2, Minus, Spline, GitBranch, BringToFront, SendToBack,
|
||||
Trash2, Minus, Spline, GitBranch, CornerUpRight, BringToFront, SendToBack,
|
||||
AlignStartVertical, AlignCenterHorizontal, AlignEndVertical,
|
||||
AlignStartHorizontal, AlignCenterVertical, AlignEndHorizontal,
|
||||
AlignHorizontalSpaceAround, AlignVerticalSpaceAround,
|
||||
@@ -264,6 +264,7 @@ export function PropertiesPanel({
|
||||
{ value: null, icon: Minus, label: 'Straight' },
|
||||
{ value: 'curved', icon: Spline, label: 'Curved' },
|
||||
{ value: 'step', icon: GitBranch, label: 'Step' },
|
||||
{ value: 'orthogonal', icon: CornerUpRight, label: 'Ortho' },
|
||||
] as const).map(({ value, icon: Icon, label }) => {
|
||||
const routing = (edgeData.routing as string | null | undefined) ?? null
|
||||
const active = routing === value
|
||||
|
||||
@@ -28,7 +28,7 @@ export interface DiagramEdge {
|
||||
connectionType: string
|
||||
speed: string | null
|
||||
notes: string | null
|
||||
routing?: string | null
|
||||
routing?: 'curved' | 'step' | 'orthogonal' | null
|
||||
}
|
||||
|
||||
export interface DeviceTypeResponse {
|
||||
|
||||
Reference in New Issue
Block a user