Override code block about markdown-to-jsx

[quantizor]

I think I understand now. Here's what I would suggest: make an interim component that translates normal JSX into the format that AceEditor needs. For example:

const CodeToAceEditor = (props) => (
    <AceEditor
        height="6em"
        mode={props.className.replace('lang-', '')}
        value={props.children}
    />
);

And feed that in as an override:

overrides: {
    code: {
        component: CodeToAceEditor,
    }
}

[quantizor]

Haven't tried this, but what if you change "value" to "children"?

…

On Apr 11, 2017 10:32 AM, "Moe Shaaban" ***@***.***> wrote: This is pretty cool 👍 I am trying to override the code blocks in markdown, but i need the value of that code block to be passed in a prop for a component. is that possible ? <Markdown options={{ overrides: { code: { component: AceEditor, props: { height: '6em', mode:'jsx', value: 'CODE VALUE GOES HERE' } } } }}> {zComponents['readme']} </Markdown> — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#98>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAiy1gH0W3KXQFnL2JPHEWqG59NqVHexks5ru47-gaJpZM4M6LxO> .

[mshaaban0]

AceEditor it's a third party dependency, doesn't support that.

[mshaaban0]

That would be cool i guess, i'll try to open a PR

overrides: {
    code: (val) => {
        // Whatever
    }
}

[mshaaban0]

👍 perfect, appreciate the help. thanks

[prmichaelsen]

Hey, as a follow up, this works for codeBlock but breaks codeInline. Would it be possible to add the ability to override each parsed type, ie, codeBlock and codeInline separately, as opposed to the rendered HTML? Or does this feature already exist and I am just missing it?