Parsing Custom Markdown with React - Handling Nested Lists and Custom Syntax
I'm a bit lost with This might be a silly question, but I'm trying to build a custom Markdown parser in a React application that supports nested lists and some specific syntax unique to our use case. I started with the `marked` library, but I ran into issues when trying to render nested lists correctly. Here's a snippet of what I'm trying to parse: ``` - Main Item 1 - Sub Item 1.1 - Sub Item 1.2 - Main Item 2 - Sub Item 2.1 - Sub Item 2.1.1 ``` I expected the nested structure to be rendered as HTML lists, but I noticed that the second-level items aren't being indented properly. The output is rendering all items at the same level, like so: ```html <ul> <li>Main Item 1</li> <li>Sub Item 1.1</li> <li>Sub Item 1.2</li> <li>Main Item 2</li> <li>Sub Item 2.1</li> <li>Sub Item 2.1.1</li> </ul> ``` I've already ensured that the indentation in the input is correct, and I've tried using `marked.parse(inputString, { gfm: true })`, but it doesn't seem to respect the nested structure. I also considered using the `react-markdown` library which supports plugins, but Iām unsure how to extend its functionality to accommodate our custom syntax requirements. Has anyone else encountered this scenario with nested parsing, or can you suggest how I might resolve the indentation question? Any guidance on best practices for implementing custom Markdown parsing in React would be greatly appreciated! This is part of a larger CLI tool I'm building. I'd really appreciate any guidance on this. Is there a better approach? For context: I'm using Javascript on Windows 11. Hoping someone can shed some light on this.