@cairn214/fluent-editor
Version:
A rich text editor based on Quill 2.0, which extends rich modules and formats on the basis of Quill. It's powerful and out-of-the-box.
142 lines (141 loc) • 5.59 kB
JavaScript
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const Quill = require("quill");
const editor_utils = require("../config/editor.utils.cjs.js");
require("./better-picker.cjs.js");
const toolbarTip = require("./toolbar-tip.cjs.js");
const Delta = Quill.import("delta");
const Parchment = Quill.import("parchment");
const levels = ["error", "warn", "log", "info"];
let level = "warn";
function debuglogger(method, ...args) {
if (levels.indexOf(method) <= levels.indexOf(level)) {
console[method](...args);
}
}
function namespace(ns) {
return levels.reduce((logger, method) => {
logger[method] = debuglogger.bind(console, method, ns);
return logger;
}, {});
}
namespace.level = (newLevel) => {
level = newLevel;
};
debuglogger.level = namespace.level;
const debug = namespace("quill:toolbar");
const Toolbar = Quill.import("modules/toolbar");
class BetterToolbar extends Toolbar {
update(range) {
const formats = editor_utils.isNullOrUndefined(range) ? {} : this.quill.getFormat(range);
this.controls.forEach((pair) => {
const [format, input] = pair;
if (input.tagName === "SELECT") {
const select = input;
let option;
if (editor_utils.isNullOrUndefined(range)) {
option = null;
} else if (editor_utils.isNullOrUndefined(formats[format])) {
option = select.querySelector("option[selected]");
} else if (!Array.isArray(formats[format])) {
let value = format === "header" ? formats[format].value : formats[format];
if (typeof value === "string") {
value = value.replace(/"/g, '\\"');
}
option = select.querySelector(`option[value="${value}"]`);
}
if (editor_utils.isNullOrUndefined(option)) {
select.value = "";
select.selectedIndex = -1;
} else {
option.selected = true;
}
} else if (editor_utils.isNullOrUndefined(range)) {
input.classList.remove("ql-active");
} else if (input.hasAttribute("value")) {
let isActive = formats[format] === input.getAttribute("value") || !editor_utils.isNullOrUndefined(formats[format]) && (formats[format].value === input.getAttribute("value") || formats[format].toString() === input.getAttribute("value")) || editor_utils.isNullOrUndefined(formats[format]) && !input.getAttribute("value");
if (!isActive) {
const checkFormat = formats[format];
if (checkFormat === "checked" || checkFormat === "unchecked") {
isActive = input.getAttribute("value") === "check";
}
}
if (isActive) {
input.classList.add("ql-active");
} else {
input.classList.remove("ql-active");
}
} else {
if (!editor_utils.isNullOrUndefined(formats[format])) {
input.classList.add("ql-active");
} else {
input.classList.remove("ql-active");
}
}
});
}
attach(input) {
let format = Array.from(input.classList).find((className) => {
return className.indexOf("ql-") === 0;
});
if (!format) return;
format = format.slice("ql-".length);
if (input.tagName === "BUTTON") {
input.setAttribute("type", "button");
}
if (this.handlers[format] == null && this.quill.scroll.query(format) == null) {
debug.warn("ignoring attaching to nonexistent format", format, input);
return;
}
const eventName = input.tagName === "SELECT" ? "change" : "click";
input.addEventListener(eventName, (e) => {
let value;
if (input.tagName === "SELECT") {
const select = input;
if (select.selectedIndex < 0) return;
const selected = select.options[select.selectedIndex];
if (selected.hasAttribute("selected")) {
value = false;
} else {
value = selected.value || false;
}
} else {
const button = input;
if (button.classList.contains("ql-active")) {
value = false;
} else {
value = button.value || !button.hasAttribute("value");
}
e.preventDefault();
}
this.quill.focus({ preventScroll: format === "screenshot" });
const [range] = this.quill.selection.getRange();
if (this.handlers[format] != null) {
if (!editor_utils.isNullOrUndefined(window.quillIsIntable) && window.quillIsIntable === true && (format === "blockquote" || format === "code-block" || format === "list" || format === "indent" || format === "clean")) {
return;
}
this.handlers[format].call(this, value);
} else if (
// @ts-ignore
this.quill.scroll.query(format).prototype instanceof Parchment.EmbedBlot
) {
value = prompt(`Enter ${format}`);
if (!value) return;
this.quill.updateContents(
new Delta().retain(range.index).delete(range.length).insert({ [format]: value }),
Quill.sources.USER
);
} else {
if (!editor_utils.isNullOrUndefined(window.quillIsIntable) && window.quillIsIntable === true && (format === "blockquote" || format === "code-block" || format === "list" || format === "indent" || format === "clean")) {
return;
}
this.quill.format(format, value, Quill.sources.USER);
}
this.update(range);
});
this.controls.push([format, input]);
}
}
exports.ToolbarTip = toolbarTip.ToolbarTip;
exports.default = BetterToolbar;
//# sourceMappingURL=index.cjs.js.map
;