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.
| 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).
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. |
chandlerprall
left a comment
chandlerprall
left a comment
There was a problem hiding this comment.
LGTM; pulled branch & debugged the existing and new code editor examples to ensure values & program flow were as expected.
|
Thanks @ycombinator for the change! |
chandlerprall
left a comment
chandlerprall
left a comment
There was a problem hiding this comment.
ha, real quick could you modify the CHANGELOG.md to include this feature add?
chandlerprall
left a comment
chandlerprall
left a comment
There was a problem hiding this comment.
still LGTM, changelog was part of the original PR... I was blind
2 participants
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.