feat: add menu item to change path of leader-line

3 files changed, 26 insertions, 1 deletions

diff --git a/src/Link.mjs b/src/Link.mjs
index 031b125..590942c 100644
--- a/src/Link.mjs
+++ b/src/Link.mjs
@@ -64,6 +64,7 @@ export const GeoLink = (link) => {
         hide: true,
         middleLabel: labelText,
         path: 'magnet',
+        path: link.dataset.linePath ?? 'magnet',
       })
       line.show('draw', { duration: 300 })
 
@@ -181,7 +182,7 @@ export const DocLink = (link) => {
           fontWeight: 'bold',
         }),
         hide: true,
-        path: 'magnet',
+        path: link.dataset.linePath ?? 'magnet',
       })
       link.lines.push(line)
       line.show('draw', { duration: 300 })
diff --git a/src/MenuItem.mjs b/src/MenuItem.mjs
index 4769817..7c617cc 100644
--- a/src/MenuItem.mjs
+++ b/src/MenuItem.mjs
@@ -474,3 +474,22 @@ export const setGeoLinkType = (link) => new Folder({
       })
     }),
 })
+
+/**
+ * set type of leader-line
+ *
+ * @param {GeoLink | DocLink} link
+ */
+export const setLeaderLineType = (link) => new Folder({
+  text: 'Line Type',
+  items: ['magnet', 'straight', 'grid', 'fluid']
+    .map(path => new Item({
+      text: path,
+      className: ['keep-menu'],
+      onclick: () => {
+        link.dataset.linePath = path
+        removeLeaderLines(link)
+        link.onmouseover()
+      },
+    })),
+})
diff --git a/src/dumbymap.mjs b/src/dumbymap.mjs
index f1e971b..3315a03 100644
--- a/src/dumbymap.mjs
+++ b/src/dumbymap.mjs
@@ -532,6 +532,7 @@ export const generateMaps = (container, {
     const map = e.target.closest('.mapclay')
     const block = e.target.closest('.dumby-block')
     const geoLink = e.target.closest('.geolink')
+    const linkWithLine = e.target.closest('.with-leader-line')
     if (!block && !map && !geoLink) return
     e.preventDefault()
 
@@ -551,6 +552,10 @@ export const generateMaps = (container, {
     }).observe(menu, { childList: true })
     menu.timer = setTimeout(() => menu.remove(), 100)
 
+    if (linkWithLine) {
+      menu.appendChild(menuItem.setLeaderLineType(linkWithLine))
+    }
+
     // Menu Items for GeoLink
     if (geoLink) {
       if (geoLink.classList.contains('from-text')) {