@opentiny/fluent-editor 3.18.2 → 3.18.3

package/index.es.js

@@ -14939,8 +14939,9 @@ class TableCellLine extends Block$1 {
       const identityMaker = key === "row" ? rowId : cellId;
       node.setAttribute(`data-${key}`, value[key] || identityMaker());
     });
-    CELL_ATTRIBUTES.forEach((attrName) => {
-      node.setAttribute(`data-${attrName}`, value[attrName] || CELL_DEFAULT[attrName]);
+    [...CELL_ATTRIBUTES, "cell-bg"].forEach((attrName) => {
+      const keyValue = value[attrName] || CELL_DEFAULT[attrName];
+      keyValue && node.setAttribute(`data-${attrName}`, keyValue);
     });
     if (value.height) {
       node.setAttribute("height", value.height);
@@ -14952,7 +14953,7 @@ class TableCellLine extends Block$1 {
     if (formats["list"]) {
       formats["list"] = domNode.classList.item(0);
     }
-    return reduceFormats(domNode, formats);
+    return reduceFormats(domNode, formats, ["cell-bg"]);
   }
   toggleAttribute(name, value) {
     if (value) {
@@ -14999,22 +15000,22 @@ class TableCellLine extends Block$1 {
     switch (true) {
       case name === "cell-bg": {
         this.toggleAttribute("data-cell-bg", value);
-        this.formatChildren(name, value);
       }
     }
   }
   optimize(context) {
     super.optimize(context);
-    const { row, cell, rowspan, colspan } = this.domNode.dataset;
+    const { row, cell, rowspan, colspan, cellBg } = this.domNode.dataset;
     const formats = TableCellLine.formats(this.domNode);
     const parentFormats = this.parent.formats();
     if (this.statics.requiredContainer && !(this.parent instanceof this.statics.requiredContainer)) {
-      this.wrap(this.statics.requiredContainer.blotName, { row, cell, rowspan, colspan });
+      this.wrap(this.statics.requiredContainer.blotName, { row, cell, rowspan, colspan, cellBg });
     } else if (!compare(formats, parentFormats)) {
       this.parent.format("row", formats.row);
       this.parent.format("cell", formats.cell);
       this.parent.format("rowspan", formats.rowspan);
       this.parent.format("colspan", formats.colspan);
+      formats["cell-bg"] && this.parent.setCellBg(formats["cell-bg"]);
     }
     const parentHeight = this.domNode.getAttribute("height");
     if (parentHeight) {
@@ -15108,6 +15109,13 @@ class TableCell extends Container {
       child.format(name, value);
     });
   }
+  setCellBg(value) {
+    if (value) {
+      this.domNode.style.backgroundColor = value;
+    } else {
+      this.domNode.style.backgroundColor = "initial";
+    }
+  }
   format(name, value) {
     const quill = Quill.find(this.scroll.domNode.parentNode);
     switch (true) {
@@ -15137,11 +15145,7 @@ class TableCell extends Container {
         this.toggleAttribute("data-cell-bg", value);
         this.toggleAttribute("data-parent-bg", value);
         this.formatChildren(name, value);
-        if (value) {
-          this.domNode.style.backgroundColor = value;
-        } else {
-          this.domNode.style.backgroundColor = "initial";
-        }
+        this.setCellBg(value);
       }
     }
   }
@@ -15855,8 +15859,8 @@ function cellId() {
   const id = Math.random().toString(36).slice(2, 6);
   return `cell-${id}`;
 }
-function reduceFormats(domNode, formats) {
-  return CELL_ATTRIBUTES.concat(CELL_IDENTITY_KEYS).reduce((tableFormats, attribute) => {
+function reduceFormats(domNode, formats, extraFormat = []) {
+  return [...CELL_ATTRIBUTES, ...CELL_IDENTITY_KEYS, ...extraFormat].reduce((tableFormats, attribute) => {
     if (domNode.hasAttribute(`data-${attribute}`)) {
       tableFormats[attribute] = domNode.getAttribute(`data-${attribute}`) || void 0;
     }