@atlaskit/editor-core
Version:
A package contains Atlassian editor core functionality
129 lines • 6.49 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var styles_1 = require("./styles");
var keymaps = require("../../keymaps");
var prosemirror_1 = require("../../prosemirror");
var ToolbarButton_1 = require("../ToolbarButton");
var close_1 = require("@atlaskit/icon/glyph/editor/close");
exports.formatting = [{
name: 'Bold',
keymap: keymaps.toggleBold,
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeLg, null, "**Bold**")); }
}, {
name: 'Italic',
keymap: keymaps.toggleItalic,
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeLg, null, "*Italic*")); },
}, {
name: 'Underline',
keymap: keymaps.toggleUnderline,
}, {
name: 'Strikethrough',
keymap: keymaps.toggleStrikethrough,
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeLg, null, "~~strikethrough~~")); },
}, {
name: 'Heading 1',
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeSm, null, "#"),
" + ",
React.createElement(styles_1.CodeLg, null, "space")); },
}, {
name: 'Heading 5',
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeLg, null, "#####"),
" + ",
React.createElement(styles_1.CodeLg, null, "space")); },
}, {
name: 'Numbered list',
keymap: keymaps.toggleOrderedList,
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeSm, null, "1."),
" + ",
React.createElement(styles_1.CodeLg, null, "space")); },
}, {
name: 'Bulleted list',
keymap: keymaps.toggleBulletList,
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeSm, null, "*"),
" + ",
React.createElement(styles_1.CodeLg, null, "space")); },
}, {
name: 'Quote',
keymap: keymaps.toggleBlockQuote,
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeLg, null, ">"),
" + ",
React.createElement(styles_1.CodeLg, null, "space")); },
}, {
name: 'Code block',
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeLg, null, "```"),
" + ",
React.createElement(styles_1.CodeLg, null, "space")); },
}, {
name: 'Divider',
keymap: keymaps.insertRule,
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeLg, null, "---")); },
}, {
name: 'Link',
keymap: keymaps.addLink,
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeLg, null, "[Link](http://a.com)")); },
}, {
name: 'Code',
keymap: keymaps.toggleCode,
autoFormatting: function () { return React.createElement("span", null,
React.createElement(styles_1.CodeLg, null, "`code`")); },
},
];
exports.getComponentFromKeymap = function (keymap) {
var currentMap = keymap[prosemirror_1.browser.mac ? 'mac' : 'windows'];
var keyParts = currentMap.replace(/\-(?=.)/g, ' + ').split(' ');
return (React.createElement("span", null, keyParts.map(function (part, index) {
if (part === '+') {
return React.createElement("span", { key: currentMap + "-" + index }, ' + ');
}
else if (part === 'Cmd') {
return React.createElement(styles_1.CodeSm, { key: currentMap + "-" + index }, "\u2318");
}
else if (['ctrl', 'alt', 'opt', 'shift'].indexOf(part.toLowerCase()) >= 0) {
return React.createElement(styles_1.CodeMd, { key: currentMap + "-" + index }, part.toLowerCase());
}
return React.createElement(styles_1.CodeSm, { key: currentMap + "-" + index }, part);
})));
};
var stopPropagation = function (e) { return e.stopPropagation(); };
exports.default = function (_a) {
var onClick = _a.onClick;
return (React.createElement(styles_1.Container, { onClick: onClick },
React.createElement(styles_1.Wrapper, null),
React.createElement(styles_1.Dialog, { onClick: stopPropagation },
React.createElement(styles_1.Header, null,
"Keyboard shortcuts",
React.createElement(styles_1.IconWrapper, null,
React.createElement(ToolbarButton_1.default, { onClick: onClick, title: "Close help dialog", iconBefore: React.createElement(close_1.default, { label: "Close help dialog", size: "large" }) }))),
React.createElement(styles_1.ContentWrapper, null,
React.createElement(styles_1.Line, null),
React.createElement(styles_1.Content, null,
React.createElement(styles_1.ColumnLeft, null,
React.createElement(styles_1.Title, null, "Text Formatting"),
React.createElement("div", null, exports.formatting.map(function (form) {
return form.keymap &&
React.createElement(styles_1.Row, { key: "textFormatting-" + form.name },
React.createElement("span", null, form.name),
exports.getComponentFromKeymap(form.keymap));
}))),
React.createElement(styles_1.ColumnRight, null,
React.createElement(styles_1.Title, null, "Markdown"),
React.createElement("div", null, exports.formatting.map(function (form) {
return form.autoFormatting &&
React.createElement(styles_1.Row, { key: "autoFormatting-" + form.name },
React.createElement("span", null, form.name),
form.autoFormatting());
}))))))));
};
//# sourceMappingURL=index.js.map