[www/blog] Allow Markdown in <Pullquote citation>

[mgienow]

Hello! I would like to request a feature to go with the component.

The <Pullquote> component, which is allowed in MDX, supports setting an optional citation like so: <Pullquote citation="Dennis Brotzky, Founding Partner, Narative">.

The feature I'm requesting is the ability to add links to the citation, e. g. if we want to link to the website of the person we attributed the quote to. In MDX this would be Dennis Brotzky, Founding Partner, [Narative](https://www.narative.co/) but putting in the markdown link does not work in the <Pullquote citation=""> context.

Thanks!

[fk]

Hey @mgienow! 🤗 🎉
Welcome, and thanks for opening this!

To add to your great issue description, here's that <Pullquote> component.

---

I can see a couple of ways enabling this, but given my very shallow understanding of MDX, I can't help but think that the easiest probably would be to use dangerouslySetInnerHTML — and just allow to write raw HTML in caption. 🤭
Or just add bespoke support for the Markdown link syntax via a regexp …

I also wouldn't be surprised if I don't see the forest for the trees! 😅

Pinging the @gatsbyjs/website superfriends for help! Is there an (easy) way to apply Markdown/MDX magic to the citation field, or … hmm, maybe nesting a <Citation> in <Pullquote>, with both rendering MDX?

/cc @gillkyle

[fk]

So turns out I didn't see that forest for those trees. 😅 🤦 🤷

@sidharthachatterjee to the rescue ❤️ — we can pass JSX to citation like so:

<Pullquote
  citation={
    <span>
      Dennis Brotzky, Founding Partner,{" "}
      <a href="https://www.narative.co/">Narative</a>
    </span>
  }
>
  “Partnering with Gatsby has been a strong driver for growth. Our clients love
  the performance benefits and our developers are happy to use tools they
  already love.”
</Pullquote>

Thank you Sid! 🤗
Follow-up PR to #25239 incoming!

[fk]

#25251

[muescha]

it can done the way like in:

• fix(blog): Gatsby Partner program - add links back to Pullquote #25414 fix(blog): Gatsby Partner program - add links back to Pullquote

but the JSX code should be in one line until remark-mdx is implemented in:

• enhancement (docs): Improvements to retext-spell #25290 enhancement (docs): Improvements to retext-spell (part: implement remark-mdx)

[github-actions]

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.
If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!
As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 💪💜

[muescha]

<Pullquote>
  “Partnering with Gatsby has been a strong driver for growth. Our clients love
  the performance benefits and our developers are happy to use tools they
  already love.”
  <PullquoteCitation>
    Dennis Brotzky, Founding Partner, [Narative](https://www.narative.co/)
  <PullquoteCitation>
</Pullquote>

maybe is this syntax possible? then inside the PullquoteCitation the text is converted as markdown?

[muescha]

related:

• RFC: Interleaving Markdown in JSX mdx-js/mdx#628 RFC: Interleaving Markdown in JSX

[fk]

Oh yes, thank you @muescha! 🙏 🤗
Was searching for something like this when we ran into this problem, but didn't find anything. Great to see it added to the v2 milestone!

[muescha]

As workaround befoee 2.0 maybe we can run the markdown convent in the component itself with the unified remark?

[github-actions]

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.
If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!
As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 💪💜

[muescha]

not stale

[LekoArts]

Since the blogposts were moved to Wordpress (including the individual components like Pullquote) we can close this issue.