Prose: support additional HTML tags

[stefankp]

https://primer.style/brand/components/Prose

Would be great to add styling support for

• <blockquote>
• <b>
• <i>
• <u>
• <sub>
• <sup>
• <pre>
• <code>

[rezrah]

👋 @stefankp - we're currently triaging this request.

We can certainly help with some of these like sub, sup, code. Others like i and u we're currently unsure around supporting in Primer Brand generally, as site design are steering away from italicisation of body copy, and instead being very intentional about where we use it. Is this required for enabling rich text editing? Can we limit usage around those styles?

[stefankp]

@rezrah awesome. This is the list of elements to complete what Contentful's Rich Text has as default options. We can certainly limit available styles. The highest priority for us are blockquote and code.

Here an example output of rich text rendered to HTML:

Rich Text

Rendered HTML

<p>Hello World</p>
<h1>Hello World</h1>
<h2>Hello World</h2>
<h3>Hello World</h3>
<h4>Hello World</h4>
<h5>Hello World</h5>
<h6>Hello World</h6>
<p><b>Hello World</b></p>
<p><i>Hello World</i></p>
<p><u>Hello World</u></p>
<p><sup>Hello World</sup></p>
<p><sub>Hello World</sub></p>
<p><code>Hello World</code></p>
<p><a href="https://www.github.com">Hello World</a></p>
<ul>
  <li>
    <p>Hello World</p>
  </li>
  <li>
    <p>Hello World</p>
  </li>
  <li>
    <p>Hello World</p>
  </li>
</ul>
<ol>
  <li>
    <p>Hello World</p>
  </li>
  <li>
    <p>Hello World</p>
  </li>
  <li>
    <p>Hello World</p>
  </li>
</ol>
<blockquote>
  <p>Hello World</p>
</blockquote>
<hr />