Koenig - HR card with markdown text expansion

refs https://github.com/TryGhost/Ghost/issues/9311
- adds the `koenig-card-hr` card that renders a `<hr>` element
- adds text expansion to convert `---` into the new HR card
This commit is contained in:
Kevin Ansfield 2018-01-30 15:19:30 +00:00
parent 07d6aee326
commit 3ac59e5ba8
6 changed files with 46 additions and 4 deletions

View File

@ -277,14 +277,14 @@
max-width: 100%;
}
.__mobiledoc-editor hr {
margin: 0.5em 0;
}
/**
* Cards
*/
.__mobiledoc-card {
display: inline-block;
}
/**
* Tooltips
*/

View File

@ -0,0 +1,7 @@
import Component from '@ember/component';
import layout from '../templates/components/koenig-card-hr';
export default Component.extend({
tagName: '',
layout
});

View File

@ -1,4 +1,5 @@
import createComponentCard from '../utils/create-component-card';
export default [
createComponentCard('koenig-card-hr')
];

View File

@ -64,6 +64,38 @@ export default function (editor) {
}
});
editor.onTextInput({
name: 'md_hr',
match: /^---$/,
run(editor) {
let {range: {head, head: {section}}} = editor;
// Skip if cursor is not at end of section
if (!head.isTail()) {
return;
}
// Skip if section is a list item
if (section.isListItem) {
return;
}
editor.run((postEditor) => {
let card = postEditor.builder.createCardSection('koenig-card-hr');
let needsTrailingParagraph = !section.next;
postEditor.replaceSection(section, card);
// add an empty paragraph after if necessary so writing can continue
if (needsTrailingParagraph) {
let newSection = postEditor.builder.createMarkupSection('p');
postEditor.insertSectionAtEnd(newSection);
postEditor.setRange(newSection.tailPosition());
}
});
}
});
/* inline markdown ------------------------------------------------------ */
function matchStrongStar(editor, text) {

View File

@ -0,0 +1 @@
export {default} from 'koenig-editor/components/koenig-card-hr';