'); - } - }, - quote: { - icon: '“ ”', - title: 'Quote', - result: function result() { - return exec(formatBlock, '
');
- }
- },
- olist: {
- icon: '#',
- title: 'Ordered List',
- result: function result() {
- return exec('insertOrderedList');
- }
- },
- ulist: {
- icon: '•',
- title: 'Unordered List',
- result: function result() {
- return exec('insertUnorderedList');
- }
- },
- code: {
- icon: '</>',
- title: 'Code',
- result: function result() {
- return exec(formatBlock, '');
- }
- },
- line: {
- icon: '―',
- title: 'Horizontal Line',
- result: function result() {
- return exec('insertHorizontalRule');
- }
- },
- link: {
- icon: '🔗',
- title: 'Link',
- result: function result() {
- var url = window.prompt('Enter the link URL');
- if (url) exec('createLink', url);
- }
- },
- image: {
- icon: '📷',
- title: 'Image',
- result: function result() {
- var url = window.prompt('Enter the image URL');
- if (url) exec('insertImage', url);
- }
- }
-};
-
-var defaultClasses = {
- actionbar: 'pell-actionbar',
- button: 'pell-button',
- content: 'pell-content',
- selected: 'pell-button-selected'
-};
-
-var init = function init(settings) {
- var actions = settings.actions ? settings.actions.map(function (action) {
- if (typeof action === 'string') return defaultActions[action];else if (defaultActions[action.name]) return _extends({}, defaultActions[action.name], action);
- return action;
- }) : Object.keys(defaultActions).map(function (action) {
- return defaultActions[action];
- });
-
- var classes = _extends({}, defaultClasses, settings.classes);
-
- var defaultParagraphSeparator = settings[defaultParagraphSeparatorString] || 'div';
-
- var actionbar = createElement('div');
- actionbar.className = classes.actionbar;
- appendChild(settings.element, actionbar);
-
- var content = settings.element.content = createElement('div');
- content.contentEditable = true;
- content.className = classes.content;
- content.oninput = function (_ref) {
- var firstChild = _ref.target.firstChild;
-
- if (firstChild && firstChild.nodeType === 3) exec(formatBlock, '<' + defaultParagraphSeparator + '>');else if (content.innerHTML === '
') content.innerHTML = '';
- settings.onChange(content.innerHTML);
- };
- content.onkeydown = function (event) {
- if (event.key === 'Enter' && queryCommandValue(formatBlock) === 'blockquote') {
- setTimeout(function () {
- return exec(formatBlock, '<' + defaultParagraphSeparator + '>');
- }, 0);
- }
- };
- appendChild(settings.element, content);
-
- actions.forEach(function (action) {
- var button = createElement('button');
- button.className = classes.button;
- button.innerHTML = action.icon;
- button.title = action.title;
- button.setAttribute('type', 'button');
- button.onclick = function () {
- return action.result() && content.focus();
+ var _extends =
+ Object.assign ||
+ function (target) {
+ for (var i = 1; i < arguments.length; i++) {
+ var source = arguments[i];
+ for (var key in source) {
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
+ target[key] = source[key];
+ }
+ }
+ }
+ return target;
};
- if (action.state) {
- var handler = function handler() {
- return button.classList[action.state() ? 'add' : 'remove'](classes.selected);
+ var defaultParagraphSeparatorString = "defaultParagraphSeparator";
+ var formatBlock = "formatBlock";
+ var addEventListener = function addEventListener(parent, type, listener) {
+ return parent.addEventListener(type, listener);
+ };
+ var appendChild = function appendChild(parent, child) {
+ return parent.appendChild(child);
+ };
+ var createElement = function createElement(tag) {
+ return document.createElement(tag);
+ };
+ var queryCommandState = function queryCommandState(command) {
+ return document.queryCommandState(command);
+ };
+ var queryCommandValue = function queryCommandValue(command) {
+ return document.queryCommandValue(command);
+ };
+
+
+ var exec = function exec(command) {
+ var value =
+ arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+ return document.execCommand(command, false, value);
+ };
+
+ var defaultActions = {
+ bold: {
+ icon: "B",
+ title: "Bold",
+ state: function state() {
+ return queryCommandState("bold");
+ },
+ result: function result() {
+ return exec("bold");
+ },
+ },
+ italic: {
+ icon: "I",
+ title: "Italic",
+ state: function state() {
+ return queryCommandState("italic");
+ },
+ result: function result() {
+ return exec("italic");
+ },
+ },
+ underline: {
+ icon: "U",
+ title: "Underline",
+ state: function state() {
+ return queryCommandState("underline");
+ },
+ result: function result() {
+ return exec("underline");
+ },
+ },
+ strikethrough: {
+ icon: "S",
+ title: "Strike-through",
+ state: function state() {
+ return queryCommandState("strikeThrough");
+ },
+ result: function result() {
+ return exec("strikeThrough");
+ },
+ },
+ heading1: {
+ icon: "H1",
+ title: "Heading 1",
+ result: function result() {
+ return exec(formatBlock, "");
+ },
+ },
+ heading2: {
+ icon: "H2",
+ title: "Heading 2",
+ result: function result() {
+ return exec(formatBlock, "");
+ },
+ },
+ paragraph: {
+ icon: "¶",
+ title: "Paragraph",
+ result: function result() {
+ return exec(formatBlock, "
");
+ },
+ },
+ quote: {
+ icon: "“ ”",
+ title: "Quote",
+ result: function result() {
+ return exec(formatBlock, "
");
+ },
+ },
+ olist: {
+ icon: "#",
+ title: "Ordered List",
+ result: function result() {
+ return exec("insertOrderedList");
+ },
+ },
+ ulist: {
+ icon: "•",
+ title: "Unordered List",
+ result: function result() {
+ return exec("insertUnorderedList");
+ },
+ },
+ code: {
+ icon: "</>",
+ title: "Code",
+ result: function result() {
+ return exec(formatBlock, "");
+ },
+ },
+ line: {
+ icon: "―",
+ title: "Horizontal Line",
+ result: function result() {
+ return exec("insertHorizontalRule");
+ },
+ },
+ link: {
+ icon: "🔗",
+ title: "Link",
+ result: function result() {
+ var url = window.prompt("Enter the link URL");
+ if (url) exec("createLink", url);
+ },
+ },
+ image: {
+ icon: "📷",
+ title: "Image",
+ result: function result() {
+ var url = window.prompt("Enter the image URL");
+ if (url) exec("insertImage", url);
+ },
+ },
+ };
+
+ var defaultClasses = {
+ actionbar: "pell-actionbar",
+ button: "pell-button",
+ content: "pell-content",
+ selected: "pell-button-selected",
+ };
+
+ var init = function init(settings) {
+ var actions = settings.actions
+ ? settings.actions.map(function (action) {
+ if (typeof action === "string") return defaultActions[action];
+ else if (defaultActions[action.name])
+ return _extends({}, defaultActions[action.name], action);
+ return action;
+ })
+ : Object.keys(defaultActions).map(function (action) {
+ return defaultActions[action];
+ });
+
+ var classes = _extends({}, defaultClasses, settings.classes);
+
+ var defaultParagraphSeparator =
+ settings[defaultParagraphSeparatorString] || "div";
+
+ var actionbar = createElement("div");
+ actionbar.className = classes.actionbar;
+ appendChild(settings.element, actionbar);
+
+ var content = (settings.element.content = createElement("div"));
+ content.contentEditable = true;
+ content.className = classes.content;
+ content.oninput = function (_ref) {
+ var firstChild = _ref.target.firstChild;
+
+ if (firstChild && firstChild.nodeType === 3)
+ exec(formatBlock, "<" + defaultParagraphSeparator + ">");
+ else if (content.innerHTML === "
") content.innerHTML = "";
+ settings.onChange(content.innerHTML);
+ };
+ content.onkeydown = function (event) {
+ if (
+ event.key === "Enter" &&
+ queryCommandValue(formatBlock) === "blockquote"
+ ) {
+ setTimeout(function () {
+ return exec(formatBlock, "<" + defaultParagraphSeparator + ">");
+ }, 0);
+ }
+ };
+ appendChild(settings.element, content);
+
+ actions.forEach(function (action) {
+ var button = createElement("button");
+ button.className = classes.button;
+ button.innerHTML = action.icon;
+ button.title = action.title;
+ button.setAttribute("type", "button");
+ button.onclick = function () {
+ return action.result() && content.focus();
};
- addEventListener(content, 'keyup', handler);
- addEventListener(content, 'mouseup', handler);
- addEventListener(button, 'click', handler);
- }
- appendChild(actionbar, button);
- });
+ if (action.state) {
+ var handler = function handler() {
+ return button.classList[action.state() ? "add" : "remove"](
+ classes.selected
+ );
+ };
+ addEventListener(content, "keyup", handler);
+ addEventListener(content, "mouseup", handler);
+ addEventListener(button, "click", handler);
+ }
- if (settings.styleWithCSS) exec('styleWithCSS');
- exec(defaultParagraphSeparatorString, defaultParagraphSeparator);
+ appendChild(actionbar, button);
+ });
- return settings.element;
-};
+ if (settings.styleWithCSS) exec("styleWithCSS");
+ exec(defaultParagraphSeparatorString, defaultParagraphSeparator);
-var pell = { exec: exec, init: init };
+ return settings.element;
+ };
-exports.exec = exec;
-exports.init = init;
-exports['default'] = pell;
+ var pell = { exec: exec, init: init };
-Object.defineProperty(exports, '__esModule', { value: true });
+ exports.exec = exec;
+ exports.init = init;
+ exports["default"] = pell;
-})));
+ Object.defineProperty(exports, "__esModule", { value: true });
+});
-export default pell;
\ No newline at end of file
+export default pell;