Code Monkey home page Code Monkey logo

Comments (10)

christianalfoni avatar christianalfoni commented on August 27, 2024

Hm, this only happens when the blockquote is the first thing in the markdown string. So that is handled differently by the "marked" converter... which I suppose it should not.

You agree it is a "marked" bug?

from markdown-to-react-components.

bebraw avatar bebraw commented on August 27, 2024

I'm not sure. Demo:

const marked = require('marked');

console.log(marked('> Demo'));

gives

<blockquote>
<p>Demo</p>
</blockquote>

which looks ok to me.

The input is the same. It's possible I'm missing some nuance here. MTRC goes through marked parser after all so maybe the demo needs to be expanded.

from markdown-to-react-components.

christianalfoni avatar christianalfoni commented on August 27, 2024

Hm, I am thinking that maybe we should use the lexer instead: https://github.com/chjj/marked

from markdown-to-react-components.

bebraw avatar bebraw commented on August 27, 2024

Yeah. That's a possibility. I know markdown-it is an alternative.

mdast-react actually does more or less the same as MTRC but it seems unmaintained at the moment. Spectacle uses the version I linked to.

from markdown-to-react-components.

christianalfoni avatar christianalfoni commented on August 27, 2024

Thanks for the info Juho :-) I need a weekend mini project, looks fun using the lexer to build the components instead. Also seems a lot safer, as I am doing some crazy trickery with shared state between the constructors.

By the end of the weekend I should have something ;-)

from markdown-to-react-components.

bebraw avatar bebraw commented on August 27, 2024

Ok, cool. One interesting option would be simply to fork mdast-react by jjt and then move from there based on your needs. That could save significant effort.

I also love the fact that there are nice plugins, like remark-toc, for mdast.

from markdown-to-react-components.

christianalfoni avatar christianalfoni commented on August 27, 2024

Hm, does it have any missing features compared to this project? I only built this because I could not find any markdown react projects that actually built react components :-)

from markdown-to-react-components.

bebraw avatar bebraw commented on August 27, 2024

It looks somewhat feature complete to me. The only part I'm a little unsure of is highlighting. I guess you'll know better by trying it out. πŸ‘

from markdown-to-react-components.

christianalfoni avatar christianalfoni commented on August 27, 2024

Okay, let me check it out this weekend. It looks like fun to play around with the lexer thingy. Typical "beer project" :-) But if the other one is feature complete I do not see any reason to have "yet another" markdown to react components project. But good point on highlighting, that is an important feature.

from markdown-to-react-components.

wooorm avatar wooorm commented on August 27, 2024

A note about highlighting: remark combined with remark-html has support for injecting HTML by plug-ins, e.g., mdast-highlight.js, however, when injecting into a (virtual) DOM on the client it’s often a bad (unsafe) idea due to having to depend on dangerouslySetInnerHTML.

It would be better to pass in custom components, e.g., a quick search gave me react-highlight. Which, should be possible to use in mdast-react (and otherwise we should build it!)

from markdown-to-react-components.

Related Issues (14)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.