How to get rid of External Link icon in Excalidraw sketches?

[kalmir]

I know that I can change how links are displayed in the sketches via the plugin's settings - and I like that and want to use it. But at the moment I also get the Obsidian-default "external link" icon attached to links (at the top right edge). Anyone knows how to get rid of it just for Excalidraw drawings?

If I was to do it Obsidian-wide, I could use the following CSS but that is not what I am after.

.external-link {
  background-image: none;
  padding-right: 0px;
}

Thanks, any help is much appreciated.

[Dmytro-Shulha]

This is going to be a big comment.

So, I've been trying to find a way to stylize and remove a link icon that is rendered for each element of type: 'embeddable' in excalidraw file.
It turned out that this icon is not a DOM component, but a part of canvas, and is rendered programmatically by Excalidraw internal JS code.

The workaround that I've managed to accomplish is complicated and by all means is not a good solution. But it worked for me, so I will do my best to describe steps to reproduce it, so other users may do the same, and developers - get an idea of a possible feature implementation.

First: while the link component itself cannot be seen from Dev Tools Elements view - there is a tooltip component div.excalidraw-tooltip at the bottom of html page, which becomes div.excalidraw-tooltip--visible when mouse is hovering over embeddable link:

To find the code that renders embeddable link, I decided to put a breakpoint on a tooltip element:

With breakpoint added, each hover on embbeddable link will lead us to this line of code in one of js files:

This file seems to be a minified excalidraw build, and the reason I think so is because after looking through the sources of both obsidian-excalidraw-plugin and excalidraw itself - I've found the function responsible for embeddable link render, which is renderLinkIcon() function in staticScene.ts file (source)

This part can be found in the same file breakpoint has stopped in by searching (Ctrl+F) for "elementLink":

Put a breakpoint here (it is important for a breakpoint to be in this function before e.drawImage() execution). Breakpoint on div.excalidraw-tooltip can be taken off, it will only be an unnecessary step at this point. Also, let current breakpoint pause to proceed (F8), so the next iteration will be fresh, so to speak.

That new breakpoint will be triggered on zoom, so either pitch your trackpad or do a Ctrl+Mouse Wheel Up/Down and you should be in the right place.

So, the workaround is to redefine e.drawImage function using console (click mouse in a source area, then Esc and Console menu should appear; switch to Console next to Sources tab in case it didn't), so that it would do nothing instead of rendering a link:

e.drawImage = ()=>{}

Note: namings in a minified files may vary across versions, so make sure to refer to the variable you find, in case there will be something different than e.drawImage().

As you should be able to see at this point, there is nothing rendered where the embeddable link previously was.

---

How to use it:

1. press Ctrl+F8 to temporarily deactivate breakpoints (last icon with a crossed pointy brick on a breakpoint control panel)
2. move your excalidraw canvas in a position suitable for a screenshot
3. activate breakpoints, zoom a bit
4. do the function thing e.drawImage = ()=>{} in the console
5. make a screenshot

If you remove all breakpoints and zoom again - links will reset back to normal.

PDF export has it's own problems with embeddables, but links weems to not appear there regardless of the workaround.

---

For the developers:
If you were to implement a "disable/hide embeddable links" feature - that workaround is definitely not best the way to approach it, by far :)
But in a form of contribution to excalidraw codebase, adding a 'hide those links' parameter to settings/config/etc., and using it in a renderLinkIcon() function to only render on false should do.
That would also require forwarding such param through obsidian-excalidraw-plugin settings.

I won't be able to make it myself for the time being, and I hope these notes will help whomever will decide to implement it.

[Dmytro-Shulha]

However, you might prefer easy way and set opacity to zero
in Settings > Excalidraw > Links,Transclusion and TODOs > Opacity of link icon
which I've only found after I was done with the workaround.

Truly, hours of debuggind can save you minutes of reading documentation looking at settings :)