Skip to content

port node, edges and connector for shape#103

Merged
meetzaveri merged 4 commits into
devfrom
ux-port-edges
Jun 12, 2026
Merged

port node, edges and connector for shape#103
meetzaveri merged 4 commits into
devfrom
ux-port-edges

Conversation

@meetzaveri

Copy link
Copy Markdown
Collaborator

Add Port node to rectangle shape so that connector can be drawn from one shape to another.

Each port node acts as a radar , to which if there is arrow's tail/head endpoint if it founds nearby port, it can be placed there with automatic magnetic pull + port-glow animation. User can ignore the magnetic pull and can place arrow's tail/head at desired x,y coordinates.

While arrow's head/tail is being drawn, it activates nearbyPort radar search and if it's in radius of that nearby port's radar, it signals user to connect arrow over that port, essentially connecting arrow to specific shape.

Shape has four ports, as of today rectangle only supports this. Will add more shapes to support this port connectivity.

@netlify

netlify Bot commented Jun 12, 2026

Copy link
Copy Markdown

Deploy Preview for craftbase ready!

Name Link
🔨 Latest commit 7b40c06
🔍 Latest deploy log https://app.netlify.com/projects/craftbase/deploys/6a2c3b76ba8d61000838f371
😎 Deploy Preview https://deploy-preview-103--craftbase.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@meetzaveri meetzaveri merged commit d8e4735 into dev Jun 12, 2026
5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant