Custom Renderers: Pass down additional props?

[devidw]

Hey, thanks creating this. 🎉

When using custom renderers, is there a way to add custom props to those?

A use case would be to render multiple instances in a loop, and each renderer should have access to the item of the current loop iteration.

{#each items as item}
        <SvelteMarkdown source={item.value} renderers={{ code: CodeRenderer }} />
{/each}

In the above example, I would like to use the data of item in the CodeRenderer component.

I played around with a local fork of this package and modified the entry point component and parser component to pass down the {...$$restProps} to the components that are created by the parser.

This way, it would be possible to pass down the prop via:

{#each items as item}
        <SvelteMarkdown source={item.value} renderers={{ code: CodeRenderer }} {item} />
{/each}

However, I am wondering if there might be a better way to do this, or if you would welcome a PR to add these modifications?

Wdyt? Thanks 🙌

[devidw]

Never mind, just figured out that the Svelte Context API is a great use for this case.

Wrapping each svelte-markdown component into a separate component that receives the prop and sets it to the context, which can then be received by the custom renderer.