Hey there,
Currently I’m about to refactor the UI of my plugin, I read a few blogs where some developer use react to implement the UI, which inspiried me to do it as well. Actually it works pretty fine, but I have an issue when I try to implement a RTE (Rich-Text-Editor).
First of all, I implemented a component for the RTE based on the atlaskit component
In my view, the RTE is rendered just like I expected and it actually works good.
Now, when I’m typping into the RTE and hit the ‘c’ key, the “Create-an-Issue”-View will pop up…So every key which is an actual shortcut will open a new dialog. Does anyone knows how to use the editor-core component so that it will be rendered as a valid input-field?
Here is my react-component:
export default class EditorTest extends Component{
render(){
return (
<EditorContext>
<div>
<div style={{ padding: '20px' }}>
<Editor
className="editor"
appearance="comment"
placeholder="What do you want to say?"
analyticsHandler={analyticsHandler}
allowCodeBlocks={true}
allowLists={true}
allowRule={true}
allowTables={{
allowColumnResizing: true,
allowMergeCells: true,
allowNumberColumn: true,
allowBackgroundColor: true,
allowHeaderRow: true,
allowHeaderColumn: true,
permittedLayouts: 'all',
stickToolbarToBottom: true,
}}
allowDate={true}
contentTransformerProvider={schema =>
new JIRATransformer(schema)
}
/>
</div>
</div>
</EditorContext>
);
}
}
regards