add soft line breaks

[DeanWay]

This PR proposes to add the ability to insert "soft" line breaks. A "soft" line break is defined as a line break that continues the current block formatting.

So, to use markdown as an example, the first bullet point here includes a soft line break, whereas there is a hard line break between the first and second bullet blocks:

• this is the first bullet block
• this is the second bullet block

This implementation represents soft breaks in 2 ways:

• in the data layer, soft breaks are represented in Deltas as regular text, with each soft break being a single \u2028 character. This character was chosen because a line break within a paragraph seems to be its intended use (see https://codepoints.net/U+2028?lang=en), and given this character exists, a special case embed insert shape for soft line breaks is not necessary in a Delta. Using a character also allows for inserts to be combined more often, resulting in less duplication of attributes, and less overall operations for the same delta. This mirrors the use of \n in Deltas to represent hard line breaks.
• in the view layer, soft breaks are represented as <br class="soft-break" />.

So, for example, the Delta:

[{insert: "Hello\u2028World"}, {insert: "\n", attributes: {list: 'ordered'}}]

would be rendered as:

<ol>
  <li data-list="ordered">
    Hello
    <br class="soft-break">
    World
   </li>
</ol>

In order to represent soft breaks as <br class="soft-break" /> in the DOM, this implementation introduces a new SoftBreak blot, and changes the definition of the existing Break blot. The existing Break blot is still a zero-length blot that exists only for rendering purposes. The current Break blot is only rendered when a block is empty. This PR changes that to also include the case when a block ends with a soft break. This allows a soft break at the end of a block to be properly rendered, since the browser always ignores an "end of line-breaking element" <br /> tag.

This PR also adds a keyboard binding of SHIFT+ENTER to insert a soft line break. This keyboard binding is consistent with many text editors and with many of the feature request issues made on this subject.

[jason-nabooki]

This would resolve the following issues (possibly many more)

https://github.com/slab/quill/issues/4248 https://github.com/slab/quill/issues/4412 https://github.com/slab/quill/issues/2872 https://github.com/slab/quill/issues/2469 https://github.com/slab/quill/issues/2872

It would be amazing if this gets merged, it's such an important feature for an editor.

[Anisy91]

It would be great to have this as soon as possible. A lot of frustration in not being able to have list items with content in between them :(

[brusch]

Great addition 👍♥️

[MevenIDM]

Hello Dean,

Thank you for your PR. I struggled all day to recreate a line break while keeping all other functionalities working (undo, redo, paste, etc.). I found some other examples that recreate the <br> behavior, but they all start to break when using undo/redo. Your PR manages to handle all of this. For now, I'll be compiling your branch until it is merged to master. Thank you again.

[VictoriaVasys]

any updates here? would be very helpful to have semantic line breaks 🙏🏼

[vincentdchan]

Hi! @DeanWay This PR is awesome! Would you like to change the target to my fork version: https://github.com/vincentdchan/quill-next which published as quill-next I'll keep maintaining Quill and adding new features.

[xcrap]

I've just tried quill (after some years) to replace ckeditor, but without this is pointless. I see this was debated over years.. is the project still going on or should i find an alternative?!

[DeanWay]

any updates here?

It appears that the maintainers of this project have been working on other things, and haven't focused on contributions here in a while. This is waiting for their review.

I have merged this change into my company's fork of Quill. It's been working for us in production without any known issues.

Would you like to change the target to my fork version

@vincentdchan I'm not currently interested in contributing to any other fork, but if you want to clone this change and add it to your fork, you're welcome to do so 🙂

[vincentdchan]

Sounds good to me. Thanks @DeanWay This change has been merged to quill-next package and published as [email protected] thanks to @kozi in 32 For anyone interested in using this feature, this package is worth checking out!