Properly handling task list markdown

[StCyr]

Hi,

Thanks for your component :-)

I'm using it with the markdown-it-task-lists component to show task list items in github style.

However, I've some difficulties to style it properly. As you can see in the screenshot hereunder, your component still renders the task list as a bullet list in addition to the task list rendering I've implemented.

I think the proper way to fix this is probably to update your component so that it doesn't create a bullet list when it's in fact a task list (ie: when the "-" of the bullet list is followed by a " [(\s|x|X)]" regexp); I believe it would be very difficult for me to implement that in my task list rule (All in all my implementation is already a bit hacky). Don't you think so?

Here's the code I use to render the task list items:

		<Markdown
                            rules={{
                                html_inline: (node, children, parent, styles, inheritedStyles = {}) => (
                                    <BouncyCheckbox key={node.key}
                                        disableText={true}
                                        isChecked={node.content.match(/checked=/)}
                                        size={16}
                                        onPress={() => {
                                            const text = parent[0].children[1].content
                                            updateCardDescriptionTaskListItem(text)
                                        }}
                                    />
                                )
                            }}
			    styles={theme.markdown}
                            mergeStyle={true}
                            markdownit={mdParser}
		>
			    {card.description}
		</Markdown>