search

scniro / react-codemirror2

Codemirror integrated components for React
MIT License
1.65k stars 192 forks source link

Add codeMirrorInstance prop to editors #240

Open zachkirsch opened 3 years ago

zachkirsch commented 3 years ago

This PR adds a codeMirrorInstance prop to the editor, as inspired by the same prop in react-codemirror.

I'm trying to migrate my company from react-codemirror to react-codemirror2, but without this prop (or another way of defining codemirror extensions) I'm not yet able to.

coveralls commented 3 years ago

Coverage Status

Coverage decreased (-0.03%) to 79.836% when pulling 4c22705320241b283fcbcf956214503733d5a2b5 on zachkirsch:codeMirrorInstance-prop into 3d490109229e8592772db922e9028c9a1dee3336 on scniro:master.

zachkirsch commented 3 years ago

@scniro are you able to take a look here when you have a chance?

davidwinter commented 2 years ago

@zachkirsch depending on what you're trying to achieve, I was able to use a React ref and pass that into the react-codemirror2 component, for example:

const editorInput = useRef(null);

...

<ReactCodeMirror ref={inputref} options={options} value={content} onBeforeChange={handleChange}/>

Then elsewhere in my code, I could access the codemirror instance like so:

editorInput.current.editor.focus();

You may be able to do the same in order to setup extensions?

zachkirsch commented 2 years ago

Thanks @davidwinter! The feature I wanted to use was CodeMirrorInstance.defineExtension, which I couldn't figure out how to do with this package. But I actually figured out a workaround yesterday for our use case (custom search bar) so I'm no longer blocked on this!