Fix quotes and code block

This commit is contained in:
cyril lopez 2018-03-15 18:27:18 +01:00
parent eb3b07c592
commit feee771cc5
3 changed files with 15 additions and 8 deletions

View File

@ -17,10 +17,10 @@ export const NEW_CONTROLS = [
{label: 'OL', style: 'ordered-list-item', className: 'styleButtonOL', hideLabel: true, handler: 'addOlBlock', text: '1. innerText' },
],
[
{label: '<>', style: 'code-block', handler: 'addEntity', text: '```innerText```' },
{label: '<>', style: 'code-block', handler: 'addSimpleBlock', text: '```innerText```' },
{label: 'img', style: 'IMG', className: 'styleButtonImg', hideLabel: true, handler: 'addLinkMediaBlockWithSelection', text: '![innerText](link)' },
{label: 'Link', style: 'LINK', className: 'styleButtonLink',hideLabel: true, handler: 'addEntity', text: '[innerText](link)' },
{label: 'quotes', style: 'blockquote', className: 'styleButtonBlockQuote', hideLabel: true, handler: 'addEntity', text: '> innerText' },
{label: 'quotes', style: 'blockquote', className: 'styleButtonBlockQuote', hideLabel: true, handler: 'addSimpleBlock', text: '> innerText' },
],
];

View File

@ -29,12 +29,6 @@ export function getInnerText(style) {
case 'UNDERLINE':
innerText = '__text underlined__';
break;
case 'code-block':
innerText = '```code block```';
break;
case 'blockquote':
innerText = '> quotes';
break;
case 'LINK':
innerText = '[text](link)';
break;

View File

@ -243,6 +243,18 @@ class Wysiwyg extends React.Component {
.set('selectionAfter', contentState.getSelectionAfter())
)
addSimpleBlock = (content, style) => {
const selectedText = this.getSelectedText();
const defaultContent = style === 'code-block' ? 'code block' : 'quote';
const innerContent = selectedText === '' ? replace(content, 'innerText', defaultContent) : replace(content, 'innerText', selectedText);
const newBlock = this.createNewBlock(innerContent);
const newContentState = this.createNewContentStateFromBlock(newBlock);
const newEditorState = this.createNewEditorState(newContentState, innerContent);
return this.setState({ editorState: EditorState.moveFocusToEnd(newEditorState) });
}
addLinkMediaBlockWithSelection = () => {
const selectedText = this.getSelectedText();
const link = selectedText === '' ? '![text](link)' : `![text](${selectedText})`;
@ -384,6 +396,7 @@ class Wysiwyg extends React.Component {
addEntity: this.addEntity,
addLinkMediaBlockWithSelection: this.addLinkMediaBlockWithSelection,
addOlBlock: this.addOlBlock,
addSimpleBlock: this.addSimpleBlock,
addUlBlock: this.addUlBlock,
}}
onToggle={this.toggleInlineStyle}