EuiCodeEditor: make it take a custom mode #935
Conversation
| /** | ||
| * Use string for a built-in mode or object for a custom mode | ||
| */ | ||
| mode: PropTypes.oneOfType([ |
There was a problem hiding this comment.
When passing mode as an object, react-ace's own proptype fails: Failed prop type: Invalid prop mode of type object supplied to ReactAce, expected string. The code editor's render function should be updated to pass mode as undefined if it is custom.
There was a problem hiding this comment.
Fixed in 8b6523e.
| this.aceEditor.editor.getSession().setMode(this.props.mode); | ||
| } | ||
|
|
||
| componentDidMount() { |
There was a problem hiding this comment.
should also add componentDidUpdate and compare old props.mode with new props.mode, updating the session if the old & new modes differ and if the new mode is a custom object (switching to a string is handled internally by react-ace).
There was a problem hiding this comment.
Fixed in 1b1b3db.
Otherwise, AceEditor will complain about wanting a string mode prop.
|
@chandlerprall Thanks for catching those issues. I've fixed both of them now and this PR is ready for your 👀 again. |
|
Thanks @ycombinator for the change! |
Resolves #933.
Allows the
modeprop in theEuiCodeEditorcomponent to take anobjectrepresenting a custom Ace mode.To test this PR
Run this PR along with EUIFication: Grok Debugger kibana#20027.
In Kibana, open Dev Tools > Grok Debugger
In the Grok Pattern field (which uses a custom mode), enter:
Verify that the syntax highlighting changes once you finish typing.