DBLink leading/trailing whitespace when using icons

[nfellinger]

Which generators are impacted?

• All
• HTML
• React
• Angular
• Vue
• Web components
• Power Apps

Reproduction case

Using the vanilla db-link component with the default icon causes whitespace to appear after the link text which becomes visible through the underline. Additonally, when using a data-icon, this also happens at the start of the link text. This problem can be seen in "Test Link 1-3" in the attached screenshot. This Problem doesn't occur if no icons are present like in "Test Link 4"

<div>
  <db-link data-icon="question_mark_circle">
    Test Link 1
  </db-link>
</div>
<div>
  <db-link>
    Test Link 2
  </db-link>
</div>
<div>
  <db-link data-icon="question_mark_circle" [showIcon]="false">
    Test Link 3
  </db-link>
</div>
<div>
  <db-link [showIcon]="false">
    Test Link 4
  </db-link>
</div>nk>
</div>

Expected Behaviour

There should be no leading or trailing whitespace around the link text when using icons.

Screenshots

No response

Browser version

Chrome

Add any other context about the problem here.

No response

[michaelmkraus]

Unfortunately, we need BuilderIO/mitosis#1750 to be merged to solve this issue.