diff --git a/editors/editoria/src/EditorConfig.js b/editors/editoria/src/EditorConfig.js new file mode 100644 index 0000000000000000000000000000000000000000..e6f8538187f71702143dd497d824706f9a850078 --- /dev/null +++ b/editors/editoria/src/EditorConfig.js @@ -0,0 +1,86 @@ +import { + toggleMark, + wrapIn, + setBlockType, + exitCode, + joinUp, + joinDown, + lift, + selectParentNode +} from "prosemirror-commands"; + +import { goToNextCell } from "prosemirror-tables"; + +import { + wrapInList, + splitListItem, + liftListItem, + sinkListItem +} from "prosemirror-schema-list"; + +import { emDash, ellipsis } from "prosemirror-inputrules"; + +import invisibles, { + space, + hardBreak, + paragraph +} from "@guardian/prosemirror-invisibles"; + +import { CreateSchema, CreateShortCuts } from "wax-prosemirror-core"; +import { LinkToolTipPlugin, TrackChangePlugin } from "wax-prosemirror-plugins"; +import { tableNodes, columnResizing, tableEditing } from "prosemirror-tables"; +import { EditoriaSchema } from "wax-prosemirror-schema"; + +const extraNodes = { + ...tableNodes({ + tableGroup: "block", + cellContent: "block+" + }) +}; + +// CreateSchema +EditoriaSchema.nodes = { ...EditoriaSchema.nodes, ...extraNodes }; +const schema = new CreateSchema(EditoriaSchema); + +const shortCuts = { + "Mod-b": toggleMark(schema.marks.strong), + "Mod-i": toggleMark(schema.marks.em), + "Mod-u": toggleMark(schema.marks.underline), + "Mod-`": toggleMark(schema.marks.code), + "Ctrl->": wrapIn(schema.nodes.blockquote), + Enter: splitListItem(schema.nodes.list_item), + "Mod-[": liftListItem(schema.nodes.list_item), + "Mod-]": sinkListItem(schema.nodes.list_item), + "Alt-ArrowUp": joinUp, + "Alt-ArrowDown": joinDown, + "Mod-BracketLeft": lift, + Tab: goToNextCell(1), + "Shift-Tab": goToNextCell(-1), + "Shift-Ctrl-0": setBlockType(schema.nodes.paragraph), + "Shift-Ctrl-\\": setBlockType(schema.nodes.code_block), + "Shift-Ctrl-8": wrapInList(schema.nodes.bullet_list), + "Shift-Ctrl-9": wrapInList(schema.nodes.ordered_list), + "Shift-Ctrl-1": setBlockType(schema.nodes.heading, { level: 1 }), + "Shift-Ctrl-2": setBlockType(schema.nodes.heading, { level: 2 }), + "Shift-Ctrl-3": setBlockType(schema.nodes.heading, { level: 3 }), + "Shift-Ctrl-4": setBlockType(schema.nodes.heading, { level: 4 }), + "Shift-Ctrl-5": setBlockType(schema.nodes.heading, { level: 5 }), + "Shift-Ctrl-6": setBlockType(schema.nodes.heading, { level: 6 }) +}; + +// Create shortCuts +const keys = new CreateShortCuts({ schema, shortCuts }); + +// Add Plugins +const plugins = [ + columnResizing(), + tableEditing(), + // LinkToolTipPlugin, + TrackChangePlugin({ options: {} }), + invisibles([hardBreak()]) +]; + +// Add Rules +const rules = [emDash, ellipsis]; + +export { schema, keys, plugins, rules }; diff --git a/editors/editoria/src/Editoria.js b/editors/editoria/src/Editoria.js index 6d3908bad419177023ee547df367b7ef51ef61da..062d88535d988eddeb08c81ac1b7021ad4d237b1 100644 --- a/editors/editoria/src/Editoria.js +++ b/editors/editoria/src/Editoria.js @@ -1,65 +1,14 @@ import React, { Component } from "react"; import styled, { createGlobalStyle } from "styled-components"; -import { - wrapInList, - splitListItem, - liftListItem, - sinkListItem -} from "prosemirror-schema-list"; -import { - tableNodes, - columnResizing, - tableEditing, - goToNextCell -} from "prosemirror-tables"; - -import { emDash, ellipsis } from "prosemirror-inputrules"; -import invisibles, { - space, - hardBreak, - paragraph -} from "@guardian/prosemirror-invisibles"; - -import { Wax, CreateSchema, CreateShortCuts } from "wax-prosemirror-core"; -import { EditoriaSchema } from "wax-prosemirror-schema"; -import { LinkToolTipPlugin, TrackChangePlugin } from "wax-prosemirror-plugins"; +import { Wax } from "wax-prosemirror-core"; import { MainMenuBar, SideMenuBar } from "wax-prosemirror-components"; import "wax-prosemirror-layouts/layouts/editoria-layout.css"; import "wax-prosemirror-layouts/vars/wax-editoria-vars.css"; import "wax-prosemirror-themes/themes/editoria-theme.css"; -const extraNodes = { - ...tableNodes({ - tableGroup: "block", - cellContent: "block+" - }) -}; - -EditoriaSchema.nodes = { ...EditoriaSchema.nodes, ...extraNodes }; -const schema = new CreateSchema(EditoriaSchema); - -const plugins = [ - columnResizing(), - tableEditing(), - // LinkToolTipPlugin, - TrackChangePlugin({ options: {} }), - invisibles([hardBreak()]) -]; +import { schema, keys, plugins, rules } from "./EditorConfig"; -const shortCuts = { - Tab: goToNextCell(1), - "Shift-Tab": goToNextCell(-1), - Enter: splitListItem(schema.nodes.list_item), - "Mod-[": liftListItem(schema.nodes.list_item), - "Mod-]": sinkListItem(schema.nodes.list_item), - "Shift-Ctrl-8": wrapInList(schema.nodes.bullet_list), - "Shift-Ctrl-9": wrapInList(schema.nodes.ordered_list) -}; - -const keys = new CreateShortCuts({ schema, shortCuts }); - -const rules = [emDash, ellipsis]; const options = { schema, plugins, @@ -78,6 +27,7 @@ const GlobalStyle = createGlobalStyle` } } `; + const StyledWax = styled(Wax)` .wax-surface-scroll { height: ${props => (props.debug ? "50vh" : "100%")}; diff --git a/wax-prosemirror-core/src/config/classes/CreateShortCuts.js b/wax-prosemirror-core/src/config/classes/CreateShortCuts.js index e602b2453e55f2bbf0409f82ab919032c47d23a9..98986fb1c11e1aebd17baa76ef4075454bcbb666 100644 --- a/wax-prosemirror-core/src/config/classes/CreateShortCuts.js +++ b/wax-prosemirror-core/src/config/classes/CreateShortCuts.js @@ -4,14 +4,9 @@ import { undo, redo } from "prosemirror-history"; import { baseKeymap, - toggleMark, - wrapIn, setBlockType, chainCommands, exitCode, - joinUp, - joinDown, - lift, selectParentNode } from "prosemirror-commands"; @@ -55,26 +50,10 @@ class CreateShortCuts { "Shift-Mod-z": redo, Backspace: undoInputRule, "Mod-y": redo, - "Alt-ArrowUp": joinUp, - "Alt-ArrowDown": joinDown, - "Mod-BracketLeft": lift, Escape: selectParentNode, - "Mod-b": toggleMark(this.schema.marks.strong), - "Mod-i": toggleMark(this.schema.marks.em), - "Mod-u": toggleMark(this.schema.marks.underline), - "Mod-`": toggleMark(this.schema.marks.code), - "Ctrl->": wrapIn(this.schema.nodes.blockquote), "Mod-Enter": chainCommands(exitCode, this.insertBreak), "Shift-Enter": chainCommands(exitCode, this.insertBreak), "Ctrl-Enter": chainCommands(exitCode, this.insertBreak), // mac-only? - "Shift-Ctrl-0": setBlockType(this.schema.nodes.paragraph), - "Shift-Ctrl-\\": setBlockType(this.schema.nodes.code_block), - "Shift-Ctrl-1": setBlockType(this.schema.nodes.heading, { level: 1 }), - "Shift-Ctrl-2": setBlockType(this.schema.nodes.heading, { level: 2 }), - "Shift-Ctrl-3": setBlockType(this.schema.nodes.heading, { level: 3 }), - "Shift-Ctrl-4": setBlockType(this.schema.nodes.heading, { level: 4 }), - "Shift-Ctrl-5": setBlockType(this.schema.nodes.heading, { level: 5 }), - "Shift-Ctrl-6": setBlockType(this.schema.nodes.heading, { level: 6 }), "Mod-_": this.insertRule }; }