switch code schema to match slate-md-serializer

This commit is contained in:
Matthew Hodgson 2018-05-23 14:12:08 +01:00
parent fb5240aabd
commit b0ff61f7ef

View file

@ -95,7 +95,7 @@ const BLOCK_TAGS = {
h6: 'heading6', h6: 'heading6',
li: 'list-item', li: 'list-item',
ol: 'numbered-list', ol: 'numbered-list',
pre: 'code-block', pre: 'code',
}; };
const MARK_TAGS = { const MARK_TAGS = {
@ -103,7 +103,7 @@ const MARK_TAGS = {
b: 'bold', // deprecated b: 'bold', // deprecated
em: 'italic', em: 'italic',
i: 'italic', // deprecated i: 'italic', // deprecated
code: 'code', code: 'inline-code',
u: 'underlined', u: 'underlined',
del: 'deleted', del: 'deleted',
strike: 'deleted', // deprecated strike: 'deleted', // deprecated
@ -710,7 +710,7 @@ export default class MessageComposerInput extends React.Component {
[KeyCode.KEY_B]: 'bold', [KeyCode.KEY_B]: 'bold',
[KeyCode.KEY_I]: 'italic', [KeyCode.KEY_I]: 'italic',
[KeyCode.KEY_U]: 'underlined', [KeyCode.KEY_U]: 'underlined',
[KeyCode.KEY_J]: 'code', [KeyCode.KEY_J]: 'inline-code',
}[ev.keyCode]; }[ev.keyCode];
if (ctrlCmdCommand) { if (ctrlCmdCommand) {
@ -760,7 +760,7 @@ export default class MessageComposerInput extends React.Component {
this.hasBlock('heading4') || this.hasBlock('heading4') ||
this.hasBlock('heading5') || this.hasBlock('heading5') ||
this.hasBlock('heading6') || this.hasBlock('heading6') ||
this.hasBlock('code-block'))) this.hasBlock('code')))
{ {
return change.setBlocks(DEFAULT_NODE); return change.setBlocks(DEFAULT_NODE);
} }
@ -832,7 +832,7 @@ export default class MessageComposerInput extends React.Component {
case 'heading5': case 'heading5':
case 'heading6': case 'heading6':
case 'list-item': case 'list-item':
case 'code-block': { case 'code': {
const isActive = this.hasBlock(type); const isActive = this.hasBlock(type);
const isList = this.hasBlock('list-item'); const isList = this.hasBlock('list-item');
@ -850,7 +850,7 @@ export default class MessageComposerInput extends React.Component {
// marks: // marks:
case 'bold': case 'bold':
case 'italic': case 'italic':
case 'code': case 'inline-code':
case 'underlined': case 'underlined':
case 'deleted': { case 'deleted': {
change.toggleMark(type); change.toggleMark(type);
@ -885,8 +885,8 @@ export default class MessageComposerInput extends React.Component {
'underline': (text) => `<u>${text}</u>`, 'underline': (text) => `<u>${text}</u>`,
'strike': (text) => `<del>${text}</del>`, 'strike': (text) => `<del>${text}</del>`,
// ("code" is triggered by ctrl+j by draft-js by default) // ("code" is triggered by ctrl+j by draft-js by default)
'code': (text) => treatInlineCodeAsBlock ? textMdCodeBlock(text) : `\`${text}\``, 'inline-code': (text) => treatInlineCodeAsBlock ? textMdCodeBlock(text) : `\`${text}\``,
'code-block': textMdCodeBlock, 'code': textMdCodeBlock,
'blockquote': (text) => text.split('\n').map((line) => `> ${line}\n`).join('') + '\n', 'blockquote': (text) => text.split('\n').map((line) => `> ${line}\n`).join('') + '\n',
'unordered-list-item': (text) => text.split('\n').map((line) => `\n- ${line}`).join(''), 'unordered-list-item': (text) => text.split('\n').map((line) => `\n- ${line}`).join(''),
'ordered-list-item': (text) => text.split('\n').map((line, i) => `\n${i + 1}. ${line}`).join(''), 'ordered-list-item': (text) => text.split('\n').map((line, i) => `\n${i + 1}. ${line}`).join(''),
@ -897,8 +897,8 @@ export default class MessageComposerInput extends React.Component {
'italic': -1, 'italic': -1,
'underline': -4, 'underline': -4,
'strike': -6, 'strike': -6,
'code': treatInlineCodeAsBlock ? -5 : -1, 'inline-code': treatInlineCodeAsBlock ? -5 : -1,
'code-block': -5, 'code': -5,
'blockquote': -2, 'blockquote': -2,
}[command]; }[command];
@ -971,7 +971,7 @@ export default class MessageComposerInput extends React.Component {
} }
if (this.state.editorState.blocks.some( if (this.state.editorState.blocks.some(
block => ['code-block', 'block-quote', 'list-item'].includes(block.type) block => ['code', 'block-quote', 'list-item'].includes(block.type)
)) { )) {
// allow the user to terminate blocks by hitting return rather than sending a msg // allow the user to terminate blocks by hitting return rather than sending a msg
return; return;
@ -1369,7 +1369,7 @@ export default class MessageComposerInput extends React.Component {
return <li {...attributes}>{children}</li>; return <li {...attributes}>{children}</li>;
case 'numbered-list': case 'numbered-list':
return <ol {...attributes}>{children}</ol>; return <ol {...attributes}>{children}</ol>;
case 'code-block': case 'code':
return <pre {...attributes}><code {...attributes}>{children}</code></pre>; return <pre {...attributes}><code {...attributes}>{children}</code></pre>;
case 'link': case 'link':
return <a {...attributes} href={ node.data.get('href') }>{children}</a>; return <a {...attributes} href={ node.data.get('href') }>{children}</a>;
@ -1424,7 +1424,7 @@ export default class MessageComposerInput extends React.Component {
return <strong {...attributes}>{children}</strong>; return <strong {...attributes}>{children}</strong>;
case 'italic': case 'italic':
return <em {...attributes}>{children}</em>; return <em {...attributes}>{children}</em>;
case 'code': case 'inline-code':
return <code {...attributes}>{children}</code>; return <code {...attributes}>{children}</code>;
case 'underlined': case 'underlined':
return <u {...attributes}>{children}</u>; return <u {...attributes}>{children}</u>;