New option "Wrap only text-like links."

Created on 12 November 2024, 3 days ago

Problem/Motivation

Change from 📌 Prevent extlink icons from breaking into new lines Needs work created problems for our sites due to different extlink behaviour and new html. This is especially bad because we have card like elements that can also have external links and new prevention of extlink icons from breaking into new lines is breaking design more and changing of inner html code is not something we want.

New issue 🐛 Remove wrapping the last word in extlink span. Needs review that is making wrapping optional is fixing our problems because it is basically reverting extlink behaviour as it was working in 1.x. However we also had various problems with extlink icon wrapping for "normal" links and we tried to solve it internally with various approaches, all with limited success. Approach that 2.x branch is doing looks better and it gives us far more flexibility because it is introducing span elements for easy wrapping control.

So ideally we want both behaviors. @berdir got an idea to actually allow new text wrapping for regular links and disable wrapping for more complex like links (like above card links).

Proposed resolution

Introduce a new option "Wrap only text-like links." which if turned on will prevent wrapping for simple/regular links and will not prevent wrapping for complex links (with complex inner html structure).

We are defining a text-like link as a link that starts with a text and ends with a text and may contain simple HTML elements (such as bold or italic tags) between the text, provided these elements contain no nested children.

NOTE that MR from this issue will be build on top of MR !42 which is still not merged into 2.x.

User interface changes

A new settting UI option "Wrap only text-like links." is introduced as a checkbox. This checkbox is visible only if previous checkbox "Try to prevent text wrapping separating the last word from the icon." is checked.

API changes

None.

Data model changes

None.

Feature request
Status

Active

Version

2.0

Component

Code

Created by

🇷🇸Serbia pivica

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

  • Issue created by @pivica
  • Merge request !49Draft: Resolve #3487095 "New option wrap" → (Open) created by pivica
  • Pipeline finished with Success
    2 days ago
    Total: 611s
    #337222
  • 🇷🇸Serbia pivica

    This is ready for a full review/test. One thing that needs additional thinking is handling of text like links - this are the links that starts and ends with text and that can have simple html elements between text. Simple html elements are elements that do not have additional child elements inside. The idea is that wrapping should work for links like

    <a>link with just some text</a>
    <a>link with some <strong>bold</strong> formatting</a>
    

    But complex links like

    <a><div class="card"><div class="title">link card title</div><div class="body">link card</div></div></a>
    

    will not be wrapped.

    The questions are edge cases like

    <a><span>link</span> with just some text</a>
    <a>link with just some <span>text</span></a>
    

    Is this a text like link or not, current assumption is that it is not because there are elements on start or end.

    Maybe we should just say, link is text like if there is no elements inside of it or it has only elements that have text and no additional inner elements?

  • 🇺🇸United States smustgrave

    Definitely should have test coverage, but general approach seems fine. Though kinda would like to land New option "Wrap only text-like links." Active first since it seems to cover more usages.

  • 🇨🇭Switzerland berdir Switzerland

    It needs to land first, this builds on the other issue.

  • 🇫🇮Finland heikkiy Oulu

    Just a small note but the comment from #6 is referencing this issue itself which might confuse users landing directly to this issue. :) I guess it should reference 🐛 Remove wrapping the last word in extlink span. Needs review .

    Agreed that this approach seems very useful for card like components etc.

Production build 0.71.5 2024