question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Provide an example of styled Interweave component

See original GitHub issue

Hello there,

First of all, thank you so much for this awesome plugin.

I’m using it on a Gatsby site, and with most of my components I’m applying a styled-components approach. However I wasn’t able to figure out how to make it work with Interweave. Could you provide an example?


I think it happens because Interweave by default strips off all attributes, including className, and styled library actually passes down a random class name every run, so it is just never applied. I know that Interweave can accept a class name prop inside of attributes object, however there’s probably no way to make styled to pass it down this way.

Currently I am using css modules as a workaround, so I import the css, get the class names, and then pass it down to Interweave. But this is really inconvenient, and I would love to be able to only use styled components.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:5 (3 by maintainers)

github_iconTop GitHub Comments

2reactions
milesjcommented, Jul 10, 2021

Is added in next version.

1reaction
milesjcommented, Jun 30, 2021

Ok makes sense. I’ll add a className prop to support this.

Read more comments on GitHub >

github_iconTop Results From Across the Web

milesj/interweave - GitHub
GitHub - milesj/interweave: React library to safely render HTML, filter attributes, autowrap text with matchers, render emoji characters, and much more.
Read more >
Getting started | Interweave
Interweave is a robust React library that can... Safely render HTML without using dangerouslySetInnerHTML . Safely strip HTML tags. Automatic XSS and injection ......
Read more >
Interweave v6.1.0 - npm
React library to safely render HTML, filter attributes, autowrap text, autolink, and much more.. Latest version: 13.0.0, last published: 9 ...
Read more >
Is there a way to render color using the interweave library in ...
I would use the transform prop provided by interweave, a quick example to highlight text within <b> tags below:
Read more >
interweave | Yarn - Package Manager
React library to safely render HTML, filter attributes, autowrap text, autolink, and much more. interweave, inject, interpolate, react. readme. Interweave.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found