@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.
293 lines (292 loc) • 10.1 kB
JavaScript
;
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const Quill = require("quill");
const editor_utils = require("../../config/editor.utils.cjs.js");
const table = require("../formats/table.cjs.js");
const tableConfig = require("../table-config.cjs.js");
const Delta = Quill.imports.delta;
const InlineBlot = Quill.imports.parchment.InlineBlot;
function matchTableCell(node, delta) {
if (node.style.height.indexOf("pt")) {
node.removeAttribute("style");
}
const row = node.parentNode;
let rowId = row.dataset.row;
if (!rowId) {
rowId = row.dataset.row = table.rowId();
}
let cellId = node.dataset.cell;
if (!cellId || cellId === "undefined") {
cellId = table.cellId();
}
const colspan = node.getAttribute("colspan") || 1;
const rowspan = node.getAttribute("rowspan") || 1;
if (delta.length() === 0) {
delta = new Delta().insert("\n", {
"table-cell-line": { row: rowId, cell: cellId, rowspan, colspan }
});
return delta;
}
delta = delta.reduce((newDelta, op) => {
if (op.insert && typeof op.insert === "string") {
const lines = editor_utils.splitWithBreak(op.insert);
lines.forEach((text) => {
if (text === "\n") {
let attributes = {};
const cellAttributes = {
row: rowId,
cell: cellId,
rowspan,
colspan
};
if (op.attributes.table) {
delete op.attributes.table;
}
switch (true) {
case !!op.attributes.header:
attributes = Object.assign(op.attributes.header, cellAttributes);
break;
case !!op.attributes.list:
attributes = { list: Object.assign(op.attributes.list, cellAttributes) };
break;
default:
attributes = { "table-cell-line": cellAttributes };
}
if (op.attributes.background && attributes["table-cell-line"]) {
attributes["table-cell-line"].tdBgColor = op.attributes.background;
}
newDelta.insert("\n", Object.assign(op.attributes, attributes));
} else {
newDelta.insert(text, editor_utils.omit(op.attributes, ["table", "table-cell-line", "header", "list"]));
}
});
} else {
newDelta.insert(op.insert, op.attributes);
}
return newDelta;
}, new Delta());
const regexp = /^[\n]+$/;
const firstDelta = delta.ops[0];
if (delta.ops.length >= 3) {
const lastDelta = delta.ops[delta.ops.length - 1];
if (regexp.test(firstDelta.insert) && firstDelta.attributes["table-cell-line"]) {
delta.ops.splice(0, 1);
}
if (regexp.test(lastDelta.insert) && lastDelta.attributes["table-cell-line"]) {
delta.ops[delta.ops.length - 1].insert = "\n";
}
} else if (delta.ops.length === 1 && regexp.test(firstDelta.insert) && firstDelta.attributes["table-cell-line"]) {
delta.ops[0].insert = "\n";
}
return delta;
}
function matchTableHeader(node, delta, _scroll) {
const row = node.parentNode;
const cells = Array.from(row.querySelectorAll("th"));
let rowId = row.dataset.row;
if (!rowId) {
rowId = row.dataset.row = table.rowId();
}
const cellId = cells.indexOf(node) + 1;
const colspan = node.getAttribute("colspan") || false;
const rowspan = node.getAttribute("rowspan") || false;
if (delta.length() === 0) {
delta = new Delta().insert("\n", {
"table-cell-line": { row: rowId, cell: cellId, rowspan, colspan }
});
return delta;
}
delta = delta.reduce((newDelta, op) => {
if (op.insert && typeof op.insert === "string") {
const lines = editor_utils.splitWithBreak(op.insert);
if (lines[lines.length - 1] !== "\n") {
lines.push("\n");
}
lines.forEach((text) => {
text === "\n" ? newDelta.insert("\n", { "table-cell-line": { row: rowId, cell: cellId, rowspan, colspan } }) : newDelta.insert(text, op.attributes);
});
} else {
newDelta.insert(op.insert, op.attributes);
}
return newDelta;
}, new Delta());
delta = delta.reduce((newDelta, op) => {
if (op.insert && typeof op.insert === "string" && op.insert.startsWith("\n")) {
newDelta.insert(op.insert, { "table-cell-line": { row: rowId, cell: cellId, rowspan, colspan } });
} else {
newDelta.insert(op.insert, { ...editor_utils.omit(op.attributes, ["table", "table-cell-line"]) });
}
return newDelta;
}, new Delta());
return delta;
}
function matchTable(node, delta, scroll) {
const isWordTable = node.children.length === 1;
if (!(node instanceof Element)) {
return;
}
const getMaxColNumber = (tds) => {
if (isWordTable) {
return tds.length;
}
let colsNumber2 = 0;
tds.forEach((td) => {
colsNumber2 += td.colSpan;
});
return Math.max(tds.length, colsNumber2);
};
const checkMinWidth = (width) => {
if (Number.isNaN(width)) {
return { "table-col": { width: "auto" } };
} else if (width < tableConfig.CELL_MIN_WIDTH) {
return { "table-col": true };
} else {
return { "table-col": { width } };
}
};
const rows = node.querySelectorAll("tr");
const topRow = rows[0];
const onlyEmptyTr = rows.length === 1 && !topRow.querySelector("td");
if (!topRow || onlyEmptyTr) {
return new Delta().insert("\n");
}
const colsNumber = node.querySelectorAll("col").length;
let maxCellsNumber = 0;
let maxCells;
Array.prototype.slice.call(rows).forEach((row) => {
const tds = row.querySelectorAll("td");
maxCellsNumber = Math.max(getMaxColNumber(tds), maxCellsNumber);
maxCells = tds;
});
let colCount = 0;
delta = delta.reduce((newDelta, op) => {
if (colCount === colsNumber) {
const fillNumber = maxCellsNumber - colCount;
const outset = colCount;
for (let i = 0; i < fillNumber; i++) {
const index = outset + i;
const colWidth = Number.parseInt(
index < maxCells.length ? maxCells[index].width : maxCells[maxCells.length - 1].width,
10
);
newDelta.insert("\n", checkMinWidth(colWidth));
colCount++;
}
}
const attr = op.attributes || {};
switch (true) {
case !!attr["table-col"]:
if (colCount < maxCellsNumber) {
const insert = op.insert.slice(0, maxCellsNumber);
const colWidth = Number.parseInt(attr["table-col"].width, 10);
newDelta.insert(insert, checkMinWidth(colWidth));
colCount += insert.length;
}
break;
case !!attr.notFilled: {
const rowId = table.rowId();
for (let x = 0; x < maxCellsNumber; x++) {
newDelta.insert("\n", { "table-cell-line": { row: rowId, cell: table.cellId(), rowspan: 1, colspan: 1 } });
}
break;
}
default:
newDelta.insert(op.insert, op.attributes);
}
return newDelta;
}, new Delta());
const tableItem = node.closest(".quill-better-table-wrapper") || node;
const prevBlot = tableItem.previousElementSibling && scroll.query(tableItem.previousElementSibling);
const nextBlot = tableItem.nextElementSibling && scroll.query(tableItem.nextElementSibling);
if (!nextBlot || nextBlot.prototype instanceof InlineBlot) {
delta = delta.insert("\n");
}
if (!prevBlot || prevBlot.prototype instanceof InlineBlot) {
const newLine = new Delta().insert("\n");
delta = newLine.concat(delta);
}
if (nextBlot === table.TableViewWrapper) {
delta = delta.insert("\n");
}
return delta;
}
function matchTableRow(_node, delta) {
if (delta.ops.length === 1 && !delta.ops[0].attributes) {
delta = new Delta().insert("\n", { notFilled: true });
}
return delta;
}
function matchHeader(node, delta) {
const newDelta = new Delta();
const fontSize = node.style.fontSize;
delta.forEach((op) => {
newDelta.insert(
op.insert,
Object.assign({}, op.attributes, {
size: fontSize
})
);
});
return newDelta;
}
function matchList(node, delta) {
const value = node.tagName === "UL" ? "bullet" : "ordered";
delta.forEach((op) => {
if (typeof op.attributes.list === "string") {
delete op.attributes.list;
} else if (typeof op.attributes.list === "object" && !op.attributes.list.value) {
op.attributes.list.value = value;
}
});
return delta;
}
function matchInline(node, delta, scroll) {
const quill = Quill.find(scroll.domNode.parentNode);
const currentRange = quill.getSelection();
const formats = currentRange && quill.getFormat(currentRange);
if (formats && formats["table-cell-line"] && node.nextElementSibling) {
const match = scroll.query(node);
const nodeHtml = node.nextElementSibling.innerHTML;
const nodeText = node.nextElementSibling.textContent;
if (match && match.prototype instanceof InlineBlot || node.tagName === "P" && nodeHtml !== nodeText) {
delta.forEach((op) => {
op.insert += "\n";
});
}
}
return delta;
}
function matchWordShapeImage(node, delta) {
var _a;
if (node) {
const imageUrl = (_a = node.attributes.src) == null ? void 0 : _a.nodeValue;
delta = new Delta().insert({ image: imageUrl });
}
return delta;
}
function matchMentionLink(node, delta, scroll) {
const name = node.dataset.mentionId;
if (name) {
const quill = Quill.find(scroll.domNode.parentNode);
const mention = quill.getModule("mention");
if (mention) {
mention.options.search(name).then((res) => {
const [item] = res;
if (item) {
mention.options.select(item);
}
});
}
}
return delta;
}
exports.matchHeader = matchHeader;
exports.matchInline = matchInline;
exports.matchList = matchList;
exports.matchMentionLink = matchMentionLink;
exports.matchTable = matchTable;
exports.matchTableCell = matchTableCell;
exports.matchTableHeader = matchTableHeader;
exports.matchTableRow = matchTableRow;
exports.matchWordShapeImage = matchWordShapeImage;
//# sourceMappingURL=node-matchers.cjs.js.map