@ones-editor/editor 2.8.23 → 2.8.25-beta.1

package/dist/index.js

@@ -4319,6 +4319,21 @@ div.editor-root.readonly div.editor-content div[data-type=editor-container] div[
   will-change: width;
   font-family: var(--editor-font-family);
 }
+.editor-web-comment-root[list-type=resolved] .comment-groups-container {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+  padding-left: 8px;
+  padding-top: 60px;
+}
+.editor-web-comment-root[list-type=resolved] .comment-groups-container .comment-group-item-root {
+  position: inherit;
+  transform: none;
+}
+.editor-web-comment-root[list-type=resolved] .comment-groups-container .comment-group-item-root::before {
+  left: 8px;
+  right: 8px;
+}
 .editor-web-comment-root .comment-groups-container .comment-group-item-root {
   position: absolute;
   left: 50%;
@@ -4332,8 +4347,17 @@ div.editor-root.readonly div.editor-content div[data-type=editor-container] div[
   box-shadow: var(--editor-box-shadow);
   padding-bottom: 10px;
 }
+.editor-web-comment-root .comment-groups-container .comment-group-item-root.resolved .item-head-switch .editor-text-button.resolved {
+  display: none;
+}
+.editor-web-comment-root .comment-groups-container .comment-group-item-root.resolved .item-head-tools {
+  display: none;
+}
+.editor-web-comment-root .comment-groups-container .comment-group-item-root.resolved .comment-quick-reply {
+  display: none;
+}
 .editor-web-comment-root .comment-groups-container .comment-group-item-root:not(.no-animation) {
-  transition: top 0.2s ease-in, opacity 0.35s ease-in;
+  transition: top 0.2s ease-in, opacity 0.2s ease-in;
 }
 .editor-web-comment-root .comment-groups-container .comment-group-item-root::before {
   content: "";
@@ -4391,6 +4415,12 @@ div.editor-root.readonly div.editor-content div[data-type=editor-container] div[
 .editor-web-comment-root .comment-groups-container .comment-group-item-root .comment-item-head .item-head-switch .editor-text-button[data-button-id=switch-up] {
   margin-right: 16px;
 }
+.editor-web-comment-root .comment-groups-container .comment-group-item-root .comment-item-head .item-head-switch .editor-text-button[data-button-id=switch-down] {
+  margin-right: 16px;
+}
+.editor-web-comment-root .comment-groups-container .comment-group-item-root .comment-item-head .item-head-switch .editor-text-button[data-button-id=resolve].resolved {
+  color: green;
+}
 .editor-web-comment-root .comment-groups-container .comment-group-item-root .comment-item-head .item-head-switch .editor-text-button:not(.disabled):hover {
   color: var(--text-button-color-hover);
 }
@@ -4398,6 +4428,32 @@ div.editor-root.readonly div.editor-content div[data-type=editor-container] div[
   color: rgba(96, 96, 96, 0.5019607843);
   cursor: not-allowed;
 }
+.editor-web-comment-root .comment-groups-container .comment-group-item-root .comment-item-footer {
+  font-size: 12px;
+  line-height: 20px;
+  color: #87888A;
+  margin-top: 10px;
+}
+.editor-web-comment-root .comment-groups-container .comment-group-item-root .comment-item-footer .comment-actions {
+  display: flex;
+  align-items: center;
+}
+.editor-web-comment-root .comment-groups-container .comment-group-item-root .comment-item-footer .comment-actions .comment-date {
+  flex: 1;
+}
+.editor-web-comment-root .comment-groups-container .comment-group-item-root .comment-item-footer .comment-actions .removed-tips {
+  color: #87888A;
+}
+.editor-web-comment-root .comment-groups-container .comment-group-item-root .comment-item-footer .comment-actions .comment-reopen {
+  background: none;
+  border: none;
+  cursor: pointer;
+  color: #575859;
+  font-size: 12px;
+}
+.editor-web-comment-root .comment-groups-container .comment-group-item-root .comment-item-footer .comment-actions .comment-reopen:hover {
+  color: #0064FF;
+}
 .editor-web-comment-root .comment-groups-container .comment-group-item-root.active::before {
   background-color: #f59300;
 }
@@ -4407,6 +4463,14 @@ div.editor-root.readonly div.editor-content div[data-type=editor-container] div[
 .editor-web-comment-root .comment-groups-container .comment-group-item-root.readonly .comment-quick-reply .quick-reply-button.invisible {
   display: none;
 }
+.editor-web-comment-root .comment-switcher-container {
+  position: absolute;
+  z-index: 1;
+  top: 0;
+  left: 0;
+  right: 0;
+  font-size: 14px;
+}
 .editor-mobile-comments-root {
   position: fixed;
   left: 0;
@@ -4508,6 +4572,82 @@ div.editor-root.readonly div.editor-content div[data-type=editor-container] div[
 }
 :is(.editor-web-comment-root, .editor-mobile-comments-root, .editor-mini-comment-root).hidden {
   display: none;
+}.resolved-comment-list .resolved-comment-group-item-root {
+  padding: 10px 20px;
+  border-bottom: 1px solid #f0f0f0;
+  margin-right: 10px;
+}
+.resolved-comment-list .resolved-comment-group-item-root .comment-group-head {
+  margin-bottom: 5px;
+}
+.resolved-comment-list .resolved-comment-group-item-root .comment-group-head span {
+  padding: 0 5px;
+  display: inline-block;
+  line-height: 2;
+  background-color: #FFF0D9;
+}
+.resolved-comment-list .resolved-comment-group-item-root .comment-children-container,
+.resolved-comment-list .resolved-comment-group-item-root .comment-container {
+  padding-left: 10px;
+}
+.resolved-comment-list .resolved-comment-group-item-root .comment-children-container .resolved-comment-item-root,
+.resolved-comment-list .resolved-comment-group-item-root .comment-container .resolved-comment-item-root {
+  position: relative;
+}
+.resolved-comment-list .resolved-comment-group-item-root .comment-children-container .resolved-comment-item-root:not(.no-children)::before,
+.resolved-comment-list .resolved-comment-group-item-root .comment-container .resolved-comment-item-root:not(.no-children)::before {
+  content: " ";
+  display: block;
+  position: absolute;
+  left: 10px;
+  width: 1px;
+  background-color: #DFE1E5;
+  overflow: hidden;
+  opacity: 0.8;
+  top: 21px;
+  bottom: -12px;
+  transform: scaleX(0.5);
+}
+.resolved-comment-list .resolved-comment-group-item-root .comment-children-container .resolved-comment-item-root .comment-head,
+.resolved-comment-list .resolved-comment-group-item-root .comment-container .resolved-comment-item-root .comment-head {
+  padding: 0;
+  position: relative;
+  display: flex;
+  align-items: center;
+}
+.resolved-comment-list .resolved-comment-group-item-root .comment-children-container .resolved-comment-item-root .comment-head .comment-avatar,
+.resolved-comment-list .resolved-comment-group-item-root .comment-container .resolved-comment-item-root .comment-head .comment-avatar {
+  margin-right: 5px;
+  width: var(--editor-comment-avatar-width, 22px);
+  height: var(--editor-comment-avatar-width, 22px);
+  border-radius: 100%;
+}
+.resolved-comment-list .resolved-comment-group-item-root .comment-children-container .resolved-comment-item-root .comment-head .comment-username,
+.resolved-comment-list .resolved-comment-group-item-root .comment-container .resolved-comment-item-root .comment-head .comment-username {
+  font-size: var(--editor-comment-username-font-size, 12px);
+  color: #2d2d2e;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.resolved-comment-list .resolved-comment-group-item-root .comment-children-container .resolved-comment-item-root .comment-head .comment-modified,
+.resolved-comment-list .resolved-comment-group-item-root .comment-container .resolved-comment-item-root .comment-head .comment-modified {
+  margin-left: 10px;
+  font-size: 12px;
+  color: #87888a;
+  flex-grow: 1;
+  white-space: nowrap;
+}
+.resolved-comment-list .resolved-comment-group-item-root .comment-children-container .resolved-comment-item-root .comment-editor,
+.resolved-comment-list .resolved-comment-group-item-root .comment-container .resolved-comment-item-root .comment-editor {
+  border: none;
+  padding-top: 0;
+  margin-top: 0;
+  padding-left: 10px;
+  margin-left: 0;
+}
+.resolved-comment-list .resolved-comment-group-item-root .comment-children-container .resolved-comment-item-root:last-child::before {
+  display: none;
 }div[data-type=editor-block].table-block {
   --table-bar-width: 6px;
   --table-bar-left: -6px;
@@ -4842,17 +4982,17 @@ div[data-type=editor-block].table-block.child-focused div[data-type=table-conten
   border-color: #b9bfc8;
 }
 div[data-type=editor-block].table-block.full-selected > div[data-type=block-content] > .scroll-container-root > .scroll-container > .scroll-area > div[data-type=table-content] > table {
-  background-color: var(--background-selection);
+  background-color: var(--background-selection) !important;
 }
 div[data-type=editor-block].table-block.full-selected > div[data-type=block-content] > .scroll-container-root > .scroll-container > .scroll-area > div[data-type=table-content] > table td,
 div[data-type=editor-block].table-block.full-selected > div[data-type=block-content] > .scroll-container-root > .scroll-container > .scroll-area > div[data-type=table-content] > table th,
 div[data-type=editor-block].table-block.full-selected > div[data-type=block-content] > .scroll-container-root > .scroll-container > .scroll-area > div[data-type=table-content] > table tr {
-  background-color: transparent;
+  background-color: transparent !important;
 }
 div[data-type=editor-block].table-block div[data-type=table-content] > table tbody tr td.selected,
 div[data-type=editor-block].table-block div[data-type=table-content] > table.row-title tbody tr td.selected,
 div[data-type=editor-block].table-block div[data-type=table-content] > table.col-title tbody tr td.selected {
-  background-color: var(--background-selection);
+  background-color: var(--background-selection) !important;
 }
 div[data-type=editor-block].table-block div[data-type=table-content] > table td div[data-type=editor-block].table-block div[data-type=table-content] > table {
   max-width: 100%;
@@ -9207,22 +9347,22 @@ var __publicField = (obj, key, value) => {
   function toFloat(value) {
     return parseFloat(value) || 0;
   }
-  function getBordersSize(styles) {
+  function getBordersSize(styles2) {
     var positions = [];
     for (var _i = 1; _i < arguments.length; _i++) {
       positions[_i - 1] = arguments[_i];
     }
     return positions.reduce(function(size, position) {
-      var value = styles["border-" + position + "-width"];
+      var value = styles2["border-" + position + "-width"];
       return size + toFloat(value);
     }, 0);
   }
-  function getPaddings(styles) {
+  function getPaddings(styles2) {
     var positions = ["top", "right", "bottom", "left"];
     var paddings = {};
     for (var _i = 0, positions_1 = positions; _i < positions_1.length; _i++) {
       var position = positions_1[_i];
-      var value = styles["padding-" + position];
+      var value = styles2["padding-" + position];
       paddings[position] = toFloat(value);
     }
     return paddings;
@@ -9236,17 +9376,17 @@ var __publicField = (obj, key, value) => {
     if (!clientWidth && !clientHeight) {
       return emptyRect;
     }
-    var styles = getWindowOf(target).getComputedStyle(target);
-    var paddings = getPaddings(styles);
+    var styles2 = getWindowOf(target).getComputedStyle(target);
+    var paddings = getPaddings(styles2);
     var horizPad = paddings.left + paddings.right;
     var vertPad = paddings.top + paddings.bottom;
-    var width = toFloat(styles.width), height = toFloat(styles.height);
-    if (styles.boxSizing === "border-box") {
+    var width = toFloat(styles2.width), height = toFloat(styles2.height);
+    if (styles2.boxSizing === "border-box") {
       if (Math.round(width + horizPad) !== clientWidth) {
-        width -= getBordersSize(styles, "left", "right") + horizPad;
+        width -= getBordersSize(styles2, "left", "right") + horizPad;
       }
       if (Math.round(height + vertPad) !== clientHeight) {
-        height -= getBordersSize(styles, "top", "bottom") + vertPad;
+        height -= getBordersSize(styles2, "top", "bottom") + vertPad;
       }
     }
     if (!isDocumentElement(target)) {
@@ -9901,8 +10041,8 @@ var __publicField = (obj, key, value) => {
       el.setAttribute(key, value);
     });
   }
-  function setStyles(el, styles) {
-    Object.entries(styles).forEach(([key, value]) => {
+  function setStyles(el, styles2) {
+    Object.entries(styles2).forEach(([key, value]) => {
       el.style.setProperty(key, value);
     });
   }
@@ -12322,12 +12462,12 @@ var __publicField = (obj, key, value) => {
       return blockClass.getBlockStyles(editor, block);
     }
     const data2 = editor.getBlockData(block);
-    const styles = Object.fromEntries(Object.entries(data2).filter(([key]) => key.startsWith("style-")));
-    Object.entries(styles).forEach(([, value]) => {
+    const styles2 = Object.fromEntries(Object.entries(data2).filter(([key]) => key.startsWith("style-")));
+    Object.entries(styles2).forEach(([, value]) => {
       const type = typeof value;
       assert(logger$4B, type === "string" || type === "number" || type === "boolean", "invalid style value");
     });
-    return styles;
+    return styles2;
   }
   function getContainerWidth(container, options) {
     const ret = container.getBoundingClientRect().width;
@@ -24916,7 +25056,7 @@ var __publicField = (obj, key, value) => {
       if (attributes) {
         let string = op.insert;
         const tags = [];
-        let styles = "";
+        let styles2 = "";
         if (attributes["style-bold"]) {
           tags.push("strong");
         }
@@ -24934,25 +25074,25 @@ var __publicField = (obj, key, value) => {
         }
         const fontBgColor = Object.keys(attributes).find((k) => k.startsWith("style-bg-color-"));
         if (fontBgColor) {
-          styles += `background-color: ${styleBackgroundColorToHighlight$1(fontBgColor)};`;
+          styles2 += `background-color: ${styleBackgroundColorToHighlight$1(fontBgColor)};`;
         }
         const fontColor = Object.keys(attributes).find((k) => k.startsWith("style-color-"));
         if (fontColor) {
-          styles += `color: ${styleColorToColor$1(fontColor)};`;
+          styles2 += `color: ${styleColorToColor$1(fontColor)};`;
         }
         if (attributes.link) {
           string = `<a href="${attributes.link}">${string}</a>`;
         }
         let prefix = tags.map((s) => `<${s}>`).join("");
         let suffix = tags.reverse().map((s) => `</${s}>`).join("");
-        if (styles) {
+        if (styles2) {
           if (attributes.link) {
-            string = `<a href="${attributes.link}" style="${styles}">${op.insert}</a>`;
+            string = `<a href="${attributes.link}" style="${styles2}">${op.insert}</a>`;
           } else {
             if (prefix) {
-              prefix = prefix.replace(">", ` style="${styles}">`);
+              prefix = prefix.replace(">", ` style="${styles2}">`);
             } else {
-              prefix = `<span style="${styles}">`;
+              prefix = `<span style="${styles2}">`;
               suffix = "</span>";
             }
           }
@@ -25395,6 +25535,9 @@ var __publicField = (obj, key, value) => {
       __publicField(this, "renders", []);
       this.editor = editor;
     }
+    getRenderers() {
+      return this.renders;
+    }
     registerRender(render) {
       this.renders.push(render);
     }
@@ -25632,8 +25775,8 @@ var __publicField = (obj, key, value) => {
     renderBlock(editor, path, blockData) {
       var _a, _b;
       const attributes = {};
-      const styles = Object.entries(blockData).filter((k) => k[0].startsWith("style-"));
-      styles.forEach(([key, value]) => {
+      const styles2 = Object.entries(blockData).filter((k) => k[0].startsWith("style-"));
+      styles2.forEach(([key, value]) => {
         attributes[`data-${key}`] = `${value}`;
       });
       const classes = [];
@@ -38661,6 +38804,12 @@ ${codeText}
         commentId
       });
     }
+    onUpdateCommentResolver(commentId) {
+      this.pushActions({
+        type: "updateCommentResolved",
+        commentId
+      });
+    }
     end() {
       const actions2 = this.actions;
       const deletedBlocks = /* @__PURE__ */ new Set();
@@ -38735,6 +38884,9 @@ ${codeText}
         } else if (action.type === "updateComment") {
           const a = action;
           this.outerHandler.onUpdateComment(a.commentId, this.local);
+        } else if (action.type === "updateCommentResolved") {
+          const a = action;
+          this.outerHandler.onUpdateCommentResolver(a.commentId, this.local);
         }
       });
       Array.from(updatingBlockDataDeltaMap.entries()).forEach(([blockId, objectData]) => {
@@ -38912,7 +39064,14 @@ ${codeText}
     assert(logger$2V, commentId, `invalid comment op, no commentId: ${JSON.stringify(ops)}`);
     assert(logger$2V, actions2, `invalid comment op, no actions: ${JSON.stringify(ops)}`);
     if (typeof actions2 === "string") {
-      logger$2V.error(`unknown comment op, ${JSON.stringify(ops)}`);
+      const data2 = ops[3];
+      if (actions2 === "resolver" && typeof data2 === "object") {
+        if (parseType === "upsert") {
+          handler.onUpdateCommentResolver(commentId);
+        }
+      } else {
+        logger$2V.error(`unknown comment op, ${JSON.stringify(ops)}`);
+      }
     } else {
       if (actions2.i && actions2.r) {
         if (parseType === "upsert") {
@@ -39022,7 +39181,8 @@ ${codeText}
       avatarUrl,
       abstract,
       created,
-      modified
+      modified,
+      resolver: resolved
     } = shareDBComment;
     return {
       id,
@@ -39032,7 +39192,8 @@ ${codeText}
       avatarUrl,
       abstract,
       created,
-      modified
+      modified,
+      resolver: resolved
     };
   }
   function commentToShareDbComment(comment, doc2) {
@@ -39504,6 +39665,21 @@ ${codeText}
       const op = ["comments", comment.id, { r: true, i: shareDBComment }];
       return this.submitOp(op);
     }
+    localUpdateCommentResolver(commentId, resolver) {
+      const oldComment = this.getComment(commentId);
+      const oldResolved = oldComment.resolver;
+      const op = ["comments", commentId, "resolver", {}];
+      if (!oldResolved && !resolver) {
+        return Promise.resolve(true);
+      }
+      if (oldResolved !== void 0) {
+        op[3] = { r: true };
+      }
+      if (resolver) {
+        op[3].i = resolver;
+      }
+      return this.submitOp(op);
+    }
     destroy() {
       var _a;
       this.destroyed = true;
@@ -39580,6 +39756,13 @@ ${codeText}
         return (_a = cb.onUpdateComment) == null ? void 0 : _a.call(cb, commentId, local);
       });
     }
+    onUpdateCommentResolver(commentId, local) {
+      assert(logger$2S, this.callbacks.length > 0, "no callbacks");
+      this.callbacks.forEach((cb) => {
+        var _a;
+        return (_a = cb.onUpdateCommentResolver) == null ? void 0 : _a.call(cb, commentId, local);
+      });
+    }
     onCustomMessage(msg) {
       const message = msg;
       if ((message == null ? void 0 : message.type) === "custom" && (message == null ? void 0 : message.clientId) !== this.client.clientId) {
@@ -50514,7 +50697,7 @@ ${codeText}
     });
     return !!ret;
   }
-  function addBlockClasses(from, to, styles) {
+  function addBlockClasses(from, to, styles2) {
     const container = getParentContainer(from);
     if (to) {
       const container2 = getParentContainer(to);
@@ -50525,18 +50708,18 @@ ${codeText}
       const toIndex = getBlockIndex(to);
       assert(logger$24, fromIndex <= toIndex, "invalid block index");
     }
-    addClass(from, ...styles);
+    addClass(from, ...styles2);
     if (!to || to === from) {
       return;
     }
     let next2 = getNextBlock(from);
     while (next2 !== to) {
       assert(logger$24, next2, "no next button");
-      addClass(next2, ...styles);
+      addClass(next2, ...styles2);
       next2 = getNextBlock(next2);
     }
     if (next2) {
-      addClass(next2, ...styles);
+      addClass(next2, ...styles2);
     }
   }
   async function requestMindmapFullscreen(editor, block, mindmapTools) {
@@ -51524,7 +51707,7 @@ ${codeText}
         html = `<input type="checkbox" disabled="disabled" /> ${html}`;
       }
       let listTag = "ul";
-      let styles = "";
+      let styles2 = "";
       if (list2.ordered) {
         html = `<li value="${list2.start}">${html}</li>`;
         listTag = "ol";
@@ -51532,18 +51715,18 @@ ${codeText}
           case 2:
           case 5:
           case 8:
-            styles = "list-style-type: lower-alpha;";
+            styles2 = "list-style-type: lower-alpha;";
             break;
           case 3:
           case 6:
-            styles = "list-style-type: lower-roman;";
+            styles2 = "list-style-type: lower-roman;";
             break;
         }
       } else {
         html = `<li>${html}</li>`;
       }
       if (isFirstListItem(editor, blockData, doc2, path)) {
-        html = `<${listTag}${styles ? ` style="${styles}"` : ""}>${html}`;
+        html = `<${listTag}${styles2 ? ` style="${styles2}"` : ""}>${html}`;
       }
       if (isLastListItem(editor, blockData, doc2, path)) {
         html = `${html}</${listTag}>`;
@@ -62359,13 +62542,13 @@ $$${mathData.mathjaxText}$$
       if (!op.attributes) {
         return /* @__PURE__ */ new Map();
       }
-      const styles = Object.entries(op.attributes).filter(([key]) => {
+      const styles2 = Object.entries(op.attributes).filter(([key]) => {
         if (key.startsWith("style-")) {
           return true;
         }
         return false;
       });
-      return new Map(styles);
+      return new Map(styles2);
     };
     if (text2.length === 0) {
       return /* @__PURE__ */ new Map();
@@ -62409,11 +62592,11 @@ $$${mathData.mathjaxText}$$
     if (getTextLength(text2) === 0) {
       return textStyles;
     }
-    let styles = getIntersectionStyles(text2);
-    styles = mergeActiveStyle(editor, styles);
+    let styles2 = getIntersectionStyles(text2);
+    styles2 = mergeActiveStyle(editor, styles2);
     function getTextStyle(item) {
       const { id, icon, desc, name } = item;
-      const value = styles.get(id);
+      const value = styles2.get(id);
       if (value !== void 0) {
         return {
           id,
@@ -63009,6 +63192,7 @@ $$${mathData.mathjaxText}$$
     GroupItemActions2["QuickReply"] = "quick-reply";
     GroupItemActions2["QuickReplyOk"] = "quick-reply-ok";
     GroupItemActions2["QuickReplyCancel"] = "quick-reply-cancel";
+    GroupItemActions2["Resolve"] = "resolve";
     return GroupItemActions2;
   })(GroupItemActions || {});
   const GROUP_ITEM_ACTION_MARK = "group-item-action";
@@ -63056,7 +63240,7 @@ $$${mathData.mathjaxText}$$
     return attributes.filter((attribute) => attribute.startsWith("comment-")).map((attribute) => attribute.replace("comment-", ""));
   }
   const logger$1G = getLogger("doc-comments");
-  function addBlockComments(doc2, block, result, resultSet) {
+  function addBlockComments$1(doc2, block, result, resultSet) {
     if (block.comments) {
       const blockComments = block.comments;
       if (Array.isArray(blockComments)) {
@@ -63092,7 +63276,7 @@ $$${mathData.mathjaxText}$$
     children.forEach((childContainerId) => {
       const childBlocks = doc2.blocks[childContainerId];
       childBlocks.forEach((subBlock) => {
-        addBlockComments(doc2, subBlock, result, resultSet);
+        addBlockComments$1(doc2, subBlock, result, resultSet);
       });
     });
   }
@@ -63100,7 +63284,7 @@ $$${mathData.mathjaxText}$$
     const result = [];
     const resultSet = /* @__PURE__ */ new Set();
     doc2.blocks.root.forEach((block) => {
-      addBlockComments(doc2, block, result, resultSet);
+      addBlockComments$1(doc2, block, result, resultSet);
     });
     const resultMap = /* @__PURE__ */ new Map();
     result.forEach((commentId, index2) => resultMap.set(commentId, index2));
@@ -63156,6 +63340,26 @@ $$${mathData.mathjaxText}$$
     });
     return result;
   }
+  function getUnresolvedCommentsGroupFromDoc(editor, commentsProvider) {
+    return getCommentsGroupFromDoc(editor, commentsProvider).filter((group) => !group.resolver);
+  }
+  function getResolvedCommentsGroupFromDoc(editor, commentsProvider) {
+    const doc2 = editor.doc.toJSON();
+    const commentsMap = getCommentsFromDoc(doc2);
+    const commentGroup = getCommentsGroup(commentsProvider.getComments());
+    const result = commentGroup.filter((group) => group.resolver).sort((group1, group2) => {
+      var _a, _b, _c, _d;
+      const date1 = (_b = (_a = group1.resolver) == null ? void 0 : _a.date) != null ? _b : 0;
+      const date2 = (_d = (_c = group2.resolver) == null ? void 0 : _c.date) != null ? _d : 0;
+      return date2 - date1;
+    });
+    result.forEach((group) => {
+      if (!commentsMap.has(group.id)) {
+        group.removedFromDoc = true;
+      }
+    });
+    return result;
+  }
   function flattenCommentGroup(comment) {
     const { children, ...raw } = comment;
     const comments = [raw];
@@ -63212,6 +63416,18 @@ $$${mathData.mathjaxText}$$
     const commentIds = intersection__default.default(comments1, comments2);
     return commentIds;
   }
+  function removeUnresolvedComments(commentProvider, commentIds) {
+    return commentIds.filter((commentId) => {
+      const comment = commentProvider.getComment(commentId);
+      return !!comment.resolver;
+    });
+  }
+  function removeResolvedComments(commentProvider, commentIds) {
+    return commentIds.filter((commentId) => {
+      const comment = commentProvider.getComment(commentId);
+      return !comment.resolver;
+    });
+  }
   const logger$1F = getLogger("active-comments");
   function inactiveComment(editor, commentId) {
     const activeCommentElements = editor.rootContainer.querySelectorAll(`span.comment[comment-${commentId}],[data-type=editor-block].comment[comment-${commentId}]`);
@@ -63267,6 +63483,11 @@ $$${mathData.mathjaxText}$$
       }
     }
   }
+  function getElementsByCommentId(editor, commentId) {
+    const lowerCommentId = commentId.toLocaleLowerCase();
+    const elements = editor.rootContainer.querySelectorAll(`span.comment[comment-${lowerCommentId}],[data-type=editor-block].comment[comment-${lowerCommentId}]`);
+    return Array.from(elements);
+  }
   function isImageBlock(block) {
     return getBlockType(block) === "embed" && getEmbedType(block) === "image";
   }
@@ -68986,8 +69207,9 @@ ${codeText}
       return items;
     }
     reloadList(data2) {
+      this._items.forEach((item) => item.destroy());
       this.container.innerHTML = "";
-      this.createList(data2);
+      this._items = this.createList(data2);
     }
     insertItem(data2) {
       const index2 = this.findInsertPos(data2);
@@ -69184,6 +69406,9 @@ ${codeText}
       __publicField(this, "quickReply");
       __publicField(this, "createRoot", () => {
         const root2 = createElement("div", ["comment-group-item-root"], null);
+        if (this.comment.resolver) {
+          addClass(root2, "resolved");
+        }
         return root2;
       });
       __publicField(this, "createChildrenList", () => {
@@ -69240,6 +69465,7 @@ ${codeText}
       this.mainItem = this.createItem();
       this.childrenList = this.createChildrenList();
       this.quickReply = this.createQuickReply();
+      this.createFooter();
       this.editor.on("readonlyChanged", this.handleReadonlyChanged);
       this.resizeObserver = new index$g(this.handleResize);
       this.resizeObserver.observe(this.root);
@@ -69249,6 +69475,29 @@ ${codeText}
       const count = getCommentItemCountInGroupItem(this.root);
       return count;
     }
+    createFooter() {
+      if (!this.comment.resolver) {
+        return null;
+      }
+      const footer = createElement("div", ["comment-item-footer"], this.root);
+      const modified = createElement("span", ["comment-modified"], footer);
+      const date = new Date(this.comment.modified);
+      const resolver = this.comment.resolver;
+      assert(logger$1h, resolver, "resolver should not be null");
+      const text2 = i18n$1.t("comment.resolvedBy", { name: resolver.displayName, date: fromNowString(date) });
+      modified.innerText = text2;
+      const actions2 = createElement("div", ["comment-actions"], footer);
+      createElement("span", ["comment-date"], actions2, fromNowString(new Date(resolver.date)));
+      if (this.comment.removedFromDoc) {
+        createElement("span", ["removed-tips"], actions2, i18n$1.t("comment.removedFromDoc"));
+      } else {
+        const reopen = createElement("button", ["comment-reopen"], actions2, i18n$1.t("comment.reopen"));
+        reopen.onclick = () => {
+          this.commentsProvider.localUpdateCommentResolver(this.comment.id, void 0);
+        };
+      }
+      return footer;
+    }
     createQuickReply() {
       const { editor, commentsProvider, comment } = this;
       const commentQuickReply = new CommentQuickReply(editor, commentsProvider, comment, this);
@@ -69263,8 +69512,13 @@ ${codeText}
       const switchContainer = createElement("span", ["item-head-switch"], head);
       const switchUp = createTextButton(switchContainer, GroupItemActions.SwitchUp, "up", switchUpIcon);
       const switchDown = createTextButton(switchContainer, GroupItemActions.SwitchDown, "down", switchDownIcon);
+      const resolve = createTextButton(switchContainer, GroupItemActions.Resolve, "resolve", CheckMarkIcon);
       addGroupActionToElement(switchUp, GroupItemActions.SwitchUp);
       addGroupActionToElement(switchDown, GroupItemActions.SwitchDown);
+      addGroupActionToElement(resolve, GroupItemActions.Resolve);
+      if (comment.resolver) {
+        addClass(resolve, "resolved");
+      }
       return head;
     }
     createItem() {
@@ -69497,6 +69751,16 @@ ${codeText}
         this.commentsProvider.localDeleteComment(comment.id);
         quickReply.show();
       });
+      __publicField(this, "handleResolve", (groupItem) => {
+        const { commentsProvider } = this;
+        const comment = commentsProvider.getComment(groupItem.comment.id);
+        const user = this.groupList.editor.doc.getUser();
+        commentsProvider.localUpdateCommentResolver(comment.id, {
+          userId: user.userId,
+          displayName: user.displayName,
+          date: Date.now()
+        });
+      });
       __publicField(this, "execute", (element, groupItem, commentId, itemIndex) => {
         const actionElement = getClosestGroupItemActionElement(element);
         if (!actionElement)
@@ -69536,6 +69800,9 @@ ${codeText}
           case GroupItemActions.QuickReplyCancel:
             this.handleQuickReplyCancel(groupItem);
             break;
+          case GroupItemActions.Resolve:
+            this.handleResolve(groupItem);
+            break;
           default:
             const exhaustiveCheck = actionId;
             logger$1f.debug(`not implement handler for ${exhaustiveCheck}`);
@@ -69549,8 +69816,8 @@ ${codeText}
   }
   const logger$1e = getLogger("comment-group-list");
   class CommentGroupList extends ListBase {
-    constructor(editor, commentsProvider, parent) {
-      super(editor, commentsProvider, parent, getCommentsGroupFromDoc(editor, commentsProvider), {});
+    constructor(editor, commentsProvider, parent, type) {
+      super(editor, commentsProvider, parent, getUnresolvedCommentsGroupFromDoc(editor, commentsProvider), {});
       __publicField(this, "groupItemHandlers");
       __publicField(this, "dispatchScroll", debounce__default.default(() => {
         this.editor.scrollContainer.dispatchEvent(new Event("scroll"));
@@ -69637,7 +69904,7 @@ ${codeText}
       __publicField(this, "handleSelectionChanged", () => {
         setTimeout(() => {
           var _a;
-          const commentIds = getCommentsFromSelection(this.editor);
+          const commentIds = this.type === "current" ? removeResolvedComments(this.commentsProvider, getCommentsFromSelection(this.editor)) : removeUnresolvedComments(this.commentsProvider, getCommentsFromSelection(this.editor));
           if (commentIds.length > 0) {
             if (((_a = this.activeItem) == null ? void 0 : _a.comment.id) && commentIds.includes(this.activeItem.comment.id)) {
               return;
@@ -69678,7 +69945,9 @@ ${codeText}
         const top = Number.parseFloat(firstItem.style.top);
         const targetTop = Number.parseFloat(firstItem.getAttribute("data-target-top") || "0");
         if (!Number.isNaN(top) && !Number.isNaN(targetTop) && top < targetTop) {
-          arrangeItems(this.editor, this.items, null, Math.min(top + (0 - event.deltaY) * 3, targetTop));
+          if (this.type === "current") {
+            arrangeItems(this.editor, this.items, null, Math.min(top + (0 - event.deltaY) * 3, targetTop));
+          }
         }
       });
       __publicField(this, "updateGroupItemSwitch", () => {
@@ -69687,7 +69956,7 @@ ${codeText}
         activeItem.updateSwitchButton();
       });
       __publicField(this, "updateComments", debounce__default.default(() => {
-        const commentsGroup = getCommentsGroupFromDoc(this.editor, this.commentsProvider);
+        const commentsGroup = this.type === "current" ? getUnresolvedCommentsGroupFromDoc(this.editor, this.commentsProvider) : getResolvedCommentsGroupFromDoc(this.editor, this.commentsProvider);
         let hasBeenChanged = false;
         for (let i = 0; i < commentsGroup.length; i++) {
           const comment = commentsGroup[i];
@@ -69710,6 +69979,8 @@ ${codeText}
           this.emit("commentCountChanged");
         }
       }, 100));
+      this.editor = editor;
+      this.type = type;
       this.updateItemsLayout();
       this.bindEvents();
       this.editor.addListener("selectionChanged", this.handleSelectionChanged);
@@ -69730,7 +70001,9 @@ ${codeText}
       document.removeEventListener("click", this.handleDocumentClick);
     }
     updateItemsLayout(dispatchScroll = true) {
-      arrangeItems(this.editor, this.items, this.activeItem);
+      if (this.type === "current") {
+        arrangeItems(this.editor, this.items, this.activeItem);
+      }
       if (dispatchScroll) {
         this.dispatchScroll();
       }
@@ -69754,7 +70027,7 @@ ${codeText}
       return item;
     }
     findInsertPos(data2) {
-      const commentsMap = getCommentsGroupFromDoc(this.editor, this.commentsProvider);
+      const commentsMap = getUnresolvedCommentsGroupFromDoc(this.editor, this.commentsProvider);
       const index2 = commentsMap.findIndex((group) => group.id === data2.id);
       if (index2 === -1) {
         return -1;
@@ -69889,6 +70162,217 @@ ${codeText}
         item.handleUpdateMainComment(comment);
       }
     }
+    changeType(type) {
+      this.type = type;
+      const comments = this.type === "current" ? getUnresolvedCommentsGroupFromDoc(this.editor, this.commentsProvider) : getResolvedCommentsGroupFromDoc(this.editor, this.commentsProvider);
+      this.reloadList(comments);
+      if (this.type === "current") {
+        setTimeout(() => {
+          arrangeItems(this.editor, this.items, null);
+        });
+      }
+    }
+  }
+  function addBlockComments(doc2, block, resultMap) {
+    if (block.comments) {
+      const blockComments = block.comments;
+      if (Array.isArray(blockComments)) {
+        blockComments.forEach((commentId) => {
+          const commentIds = resultMap.get(block.id);
+          if (commentIds) {
+            commentIds.add(commentId);
+          } else {
+            resultMap.set(block.id, /* @__PURE__ */ new Set([commentId]));
+          }
+        });
+      }
+    }
+    if (block.text) {
+      const text2 = block.text;
+      text2.forEach((op) => {
+        if (op.attributes) {
+          const prefix = "comment-";
+          Object.entries(op.attributes).forEach(([key, value]) => {
+            if (key.startsWith(prefix)) {
+              const commentId = value;
+              const commentIds = resultMap.get(block.id);
+              if (commentIds) {
+                commentIds.add(commentId);
+              } else {
+                resultMap.set(block.id, /* @__PURE__ */ new Set([commentId]));
+              }
+            }
+          });
+        }
+      });
+    }
+    const children = block.children;
+    if (!children) {
+      return;
+    }
+    children.forEach((childContainerId) => {
+      const childBlocks = doc2.blocks[childContainerId];
+      childBlocks.forEach((subBlock) => {
+        addBlockComments(doc2, subBlock, resultMap);
+      });
+    });
+  }
+  function getBlockCommentsFromDoc(doc2) {
+    const resultMap = /* @__PURE__ */ new Map();
+    doc2.blocks.root.forEach((block) => {
+      addBlockComments(doc2, block, resultMap);
+    });
+    return resultMap;
+  }
+  class OnesEditorCommentsRender {
+    constructor(type = "current") {
+      __publicField(this, "updateUnknownCommentsDelayed", debounce__default.default((editor) => {
+        const comments = editor.doc.toJSON().comments;
+        const invisibleComments = Object.values(comments).filter((comment) => {
+          if (comment.id !== comment.groupId) {
+            return false;
+          }
+          const ret = this.type === "current" ? !!comment.resolver : !comment.resolver;
+          return ret;
+        });
+        const root2 = editor.rootContainer;
+        const effectedElements = /* @__PURE__ */ new Set();
+        invisibleComments.forEach((comment) => {
+          const key = `comment-${comment.id.toLocaleLowerCase()}`;
+          const elements = root2.querySelectorAll(`[${key}]`);
+          elements.forEach((elem) => {
+            elem.removeAttribute(key);
+            effectedElements.add(elem);
+          });
+        });
+        effectedElements.forEach((elem) => {
+          const commentAttributes = Array.from(elem.attributes).filter((a) => a.name.startsWith("comment-"));
+          if (commentAttributes.length === 0) {
+            elem.classList.remove("comment");
+          }
+        });
+      }));
+      this.type = type;
+    }
+    renderText(editor, path, attributes) {
+      const classes = [];
+      const textAttributes = {};
+      Object.entries(attributes).forEach(([key, value]) => {
+        if (key.startsWith("comment-")) {
+          this.renderCommentElement(editor, key, value, classes, textAttributes);
+        }
+      });
+      return { classes, attributes: textAttributes };
+    }
+    renderBox(editor, path, attributes) {
+      const classes = [];
+      const textAttributes = {};
+      Object.entries(attributes).forEach(([key, value]) => {
+        if (key.startsWith("comment-")) {
+          this.renderCommentElement(editor, key, value, classes, textAttributes);
+        }
+      });
+      return { classes, attributes: textAttributes };
+    }
+    renderBlock(editor, path, blockData) {
+      const comments = blockData.comments;
+      if (!comments || comments.length === 0) {
+        return {};
+      }
+      const classes = [];
+      const attributes = {};
+      comments.forEach((commentId) => {
+        const key = `comment-${commentId.toLocaleLowerCase()}`;
+        this.renderCommentElement(editor, key, commentId, classes, attributes);
+      });
+      return {
+        classes,
+        attributes
+      };
+    }
+    updateBlock(editor, path, blockElement, blockData) {
+      const comments = blockData.comments;
+      removeClass(blockElement, "comment");
+      Array.from(blockElement.attributes).forEach((a) => {
+        if (a.name.startsWith("comment-")) {
+          blockElement.removeAttribute(a.name);
+        }
+      });
+      if (!comments || comments.length === 0) {
+        return;
+      }
+      addClass(blockElement, "comment");
+      const classList = [];
+      comments.forEach((commentId) => {
+        const key = `comment-${commentId.toLocaleLowerCase()}`;
+        this.renderCommentElement(editor, key, commentId, classList, {});
+      });
+      if (classList.length > 0) {
+        addClass(blockElement, ...classList);
+      }
+    }
+    getCommentStatus(editor, commentId) {
+      const comments = editor.findCustom("editor-comments");
+      if (!comments) {
+        return "unknown";
+      }
+      const commentsProvider = comments.commentProvider;
+      const comment = commentsProvider.getComment(commentId);
+      if (!comment) {
+        return "unknown";
+      }
+      if (comment.resolver) {
+        return "resolved";
+      }
+      return "unresolved";
+    }
+    renderCommentElement(editor, key, commentId, classes, textAttributes) {
+      const status = this.getCommentStatus(editor, commentId);
+      if (this.type === "current") {
+        if (status === "resolved") {
+          return;
+        }
+      } else {
+        if (status === "unresolved") {
+          return;
+        }
+      }
+      classes.push("comment");
+      textAttributes[key] = commentId;
+      if (status === "unknown") {
+        this.updateUnknownCommentsDelayed(editor);
+      }
+    }
+    changeType(editor, type) {
+      this.type = type;
+      const elements = editor.rootContainer.querySelectorAll(".comment");
+      elements.forEach((elem) => {
+        elem.classList.remove("comment");
+        Array.from(elem.attributes).forEach((a) => {
+          if (a.name.startsWith("comment-")) {
+            elem.removeAttribute(a.name);
+          }
+        });
+      });
+      const doc2 = editor.doc.toJSON();
+      const visibleComments = Object.values(doc2.comments).filter((comment) => {
+        if (comment.id !== comment.groupId) {
+          return false;
+        }
+        const ret = this.type === "current" ? !comment.resolver : !!comment.resolver;
+        return ret;
+      });
+      const visibleCommentsId = new Set(visibleComments.map((c) => c.id));
+      const commentsFromDoc = getBlockCommentsFromDoc(doc2);
+      commentsFromDoc.forEach((commentIds, blockId) => {
+        if (Array.from(commentIds).some((c) => visibleCommentsId.has(c))) {
+          const block = editor.findBlockById(blockId);
+          if (block) {
+            editor.reloadBlock(block);
+          }
+        }
+      });
+    }
   }
   const COMMENT_MINI_CLS = "comment-mini";
   getLogger("comment-list");
@@ -69898,6 +70382,41 @@ ${codeText}
       __publicField(this, "root");
       __publicField(this, "groupsContainer");
       __publicField(this, "list");
+      __publicField(this, "listType", "current");
+      __publicField(this, "switcherItem", {
+        id: "switch-comment",
+        name: i18n$1.t("comment.currentComment"),
+        dropdown: true,
+        manualShowChildren: true,
+        childrenPlacement: "bottom-start",
+        children: [{
+          id: "current-comment",
+          name: i18n$1.t("comment.currentComment"),
+          states: ["checked"]
+        }, {
+          id: "resolved-comment",
+          name: i18n$1.t("comment.resolvedComment")
+        }]
+      });
+      __publicField(this, "switcherBar");
+      __publicField(this, "handleSwitchType", (bar2, item) => {
+        if (item.id === "current-comment") {
+          this.listType = "current";
+        } else {
+          this.listType = "resolved";
+        }
+        this.root.setAttribute("list-type", this.listType);
+        this.switcherItem.name = this.listType === "current" ? i18n$1.t("comment.currentComment") : i18n$1.t("comment.resolvedComment");
+        const children = this.switcherItem.children;
+        children[0].states = this.listType === "current" ? ["checked"] : [];
+        children[1].states = this.listType === "resolved" ? ["checked"] : [];
+        this.switcherBar.updateItems([this.switcherItem]);
+        this.list.changeType(this.listType);
+        const renderer = this.editor.editorBlockRenders.getRenderers().find((r) => r instanceof OnesEditorCommentsRender);
+        if (renderer) {
+          renderer.changeType(this.editor, this.listType);
+        }
+      });
       __publicField(this, "handleSelectionOnComment", () => {
         this.emit("onSelectComment");
       });
@@ -69923,8 +70442,10 @@ ${codeText}
       this.editor = editor;
       this.commentsProvider = commentsProvider;
       this.root = createElement("div", ["editor-web-comment-root"], null);
+      this.root.setAttribute("list-type", this.listType);
       this.groupsContainer = createElement("div", ["comment-groups-container"], this.root);
       this.list = this.createList();
+      this.switcherBar = this.createSwitcher();
       this.commentsProvider.addListener(this);
       this.list.addListener("activeItemChanged", this.handleActiveItemChanged);
       this.list.addListener("itemLayoutUpdated", this.handleItemLayoutUpdated);
@@ -69941,6 +70462,7 @@ ${codeText}
       this.commentsProvider.removeListener(this);
       this.list.destroy();
       this.root.remove();
+      this.switcherBar.destroy();
     }
     onCreateComment(commentId, local) {
       const comment = this.commentsProvider.getComment(commentId);
@@ -69955,8 +70477,53 @@ ${codeText}
       const comment = this.commentsProvider.getComment(commentId);
       this.list.handleUpdateComment(comment);
     }
+    onUpdateCommentResolver(commentId, local) {
+      const comment = this.commentsProvider.getComment(commentId);
+      const groupItem = this.list.findGroupItem(comment.groupId);
+      if (!groupItem) {
+        return;
+      }
+      setTimeout(() => {
+        if (this.listType === "current") {
+          if (comment.resolver) {
+            this.list.handleDeleteComment(commentId);
+          } else {
+            this.list.handleCreateComment(comment, local);
+          }
+        } else {
+          if (comment.resolver) {
+            this.list.handleCreateComment(comment, local);
+          } else {
+            this.list.handleDeleteComment(commentId);
+          }
+        }
+      }, 300);
+      this.updateCommentCount();
+      const blocks = /* @__PURE__ */ new Set();
+      getElementsByCommentId(this.editor, groupItem.comment.id).forEach((element) => {
+        if (isBlock$1(element)) {
+          blocks.add(element);
+        } else {
+          const block = getParentBlock(element);
+          if (block) {
+            blocks.add(block);
+          }
+        }
+      });
+      blocks.forEach((block) => {
+        this.editor.reloadBlock(block);
+      });
+    }
     createList() {
-      return new CommentGroupList(this.editor, this.commentsProvider, this.groupsContainer);
+      return new CommentGroupList(this.editor, this.commentsProvider, this.groupsContainer, this.listType);
+    }
+    createSwitcher() {
+      const container = createElement("div", ["comment-switcher-container"], this.root);
+      const commandBar2 = new FixedToolbar(container, [this.switcherItem], {
+        id: "comment-switcher"
+      });
+      commandBar2.addListener("click", this.handleSwitchType);
+      return commandBar2;
     }
     isEditing(includeEmpty) {
       return this.list.isEditing(includeEmpty);
@@ -70099,7 +70666,7 @@ ${codeText}
   const logger$1c = getLogger("mobile-group-list");
   class MobileGroupList extends ListBase {
     constructor(editor, commentsProvider, parent, scrollElement) {
-      super(editor, commentsProvider, parent, getCommentsGroupFromDoc(editor, commentsProvider), {});
+      super(editor, commentsProvider, parent, getUnresolvedCommentsGroupFromDoc(editor, commentsProvider), {});
       __publicField(this, "scroller");
       __publicField(this, "refreshScroller", () => {
         this.scroller.refresh();
@@ -70147,7 +70714,7 @@ ${codeText}
         this.updateComments();
       });
       __publicField(this, "updateComments", debounce__default.default(() => {
-        const commentsGroup = getCommentsGroupFromDoc(this.editor, this.commentsProvider);
+        const commentsGroup = getUnresolvedCommentsGroupFromDoc(this.editor, this.commentsProvider);
         for (let i = 0; i < commentsGroup.length; i++) {
           const comment = commentsGroup[i];
           const groupItem = this.findGroupItem(comment.groupId);
@@ -70181,7 +70748,7 @@ ${codeText}
       return item;
     }
     findInsertPos(data2) {
-      const commentsMap = getCommentsGroupFromDoc(this.editor, this.commentsProvider);
+      const commentsMap = getUnresolvedCommentsGroupFromDoc(this.editor, this.commentsProvider);
       const index2 = commentsMap.findIndex((group) => group.id === data2.id);
       if (index2 === -1) {
         return -1;
@@ -70317,6 +70884,8 @@ ${codeText}
       const comment = this.commentsProvider.getComment(commentId);
       this.list.handleUpdateComment(comment);
     }
+    onUpdateCommentResolver(commentId, local) {
+    }
     get commentOptions() {
       const commentOptions = this.editor.getComponentOptions("comment");
       return commentOptions;
@@ -70342,7 +70911,7 @@ ${codeText}
     }
   }
   function getMiniCommentsGroupFromDoc(editor, commentsProvider) {
-    const commentsGroupFromDoc = getCommentsGroupFromDoc(editor, commentsProvider);
+    const commentsGroupFromDoc = getUnresolvedCommentsGroupFromDoc(editor, commentsProvider);
     const miniCommentGroups = /* @__PURE__ */ new Map();
     for (const commentGroup of commentsGroupFromDoc) {
       const blockId = getBlockIdByGroupId(editor, commentGroup.groupId);
@@ -70489,6 +71058,9 @@ ${codeText}
     }
     onUpdateComment(commentId, local) {
     }
+    onUpdateCommentResolver(commentId, local) {
+      this.list.updateMiniCommentsGroup();
+    }
     show() {
       removeClass(this.root, "hidden");
     }
@@ -70805,7 +71377,12 @@ ${codeText}
       more: "\u66F4\u591A",
       comment: "\u6DFB\u52A0\u6279\u6CE8",
       command: "\u6DFB\u52A0\u6279\u6CE8",
-      quickMenuCommand: "\u6DFB\u52A0\u6279\u6CE8"
+      quickMenuCommand: "\u6DFB\u52A0\u6279\u6CE8",
+      resolvedBy: "\u5DF2\u7531 {name} \u6210\u5458\u89E3\u51B3",
+      reopen: "\u91CD\u65B0\u6253\u5F00",
+      currentComment: "\u5F53\u524D\u6279\u6CE8",
+      resolvedComment: "\u5DF2\u89E3\u51B3\u6279\u6CE8",
+      removedFromDoc: "\u5F15\u7528\u5185\u5BB9\u5DF2\u5220\u9664"
     }
   };
   const enUS$k = {
@@ -70828,7 +71405,12 @@ ${codeText}
       more: "More",
       comment: "Add annotation",
       command: "Add annotation",
-      quickMenuCommand: "Add annotation"
+      quickMenuCommand: "Add annotation",
+      resolvedBy: "Resolved by {name}",
+      reopen: "Reopen",
+      currentComment: "Current Annotations",
+      resolvedComment: "Resolved Annotations",
+      removedFromDoc: "This annotation has been removed from the document"
     }
   };
   const jaJP$k = {
@@ -70851,7 +71433,12 @@ ${codeText}
       more: "\u305D\u306E\u4ED6",
       comment: "\u6CE8\u91C8\u3092\u8FFD\u52A0",
       command: "\u6CE8\u91C8\u3092\u8FFD\u52A0",
-      quickMenuCommand: "\u6CE8\u91C8\u3092\u8FFD\u52A0"
+      quickMenuCommand: "\u6CE8\u91C8\u3092\u8FFD\u52A0",
+      resolvedBy: "{name} \u306B\u3088\u3063\u3066\u89E3\u6C7A\u6E08\u307F",
+      reopen: "\u518D\u958B",
+      currentComment: "\u73FE\u5728\u306E\u6CE8\u91C8",
+      resolvedComment: "\u89E3\u6C7A\u6E08\u307F\u306E\u6CE8\u91C8",
+      removedFromDoc: "\u3053\u306E\u6CE8\u91C8\u306F\u6587\u66F8\u304B\u3089\u524A\u9664\u3055\u308C\u307E\u3057\u305F"
     }
   };
   i18n$1.mergeLang({
@@ -70859,61 +71446,6 @@ ${codeText}
     "en-US": enUS$k,
     "ja-JP": jaJP$k
   });
-  class OnesEditorCommentsRender {
-    renderText(editor, path, attributes) {
-      const classes = [];
-      const textAttributes = {};
-      Object.entries(attributes).forEach(([key, value]) => {
-        if (key.startsWith("comment-")) {
-          classes.push("comment");
-          textAttributes[key] = value;
-        }
-      });
-      return { classes, attributes: textAttributes };
-    }
-    renderBox(editor, path, attributes) {
-      const classes = [];
-      const textAttributes = {};
-      Object.entries(attributes).forEach(([key, value]) => {
-        if (key.startsWith("comment-")) {
-          classes.push("comment");
-          textAttributes[key] = value;
-        }
-      });
-      return { classes, attributes: textAttributes };
-    }
-    renderBlock(editor, path, blockData) {
-      const comments = blockData.comments;
-      if (!comments || comments.length === 0) {
-        return {};
-      }
-      const classes = ["comment"];
-      const attributes = {};
-      comments.forEach((commentId) => {
-        attributes[`comment-${commentId.toLocaleLowerCase()}`] = commentId;
-      });
-      return {
-        classes,
-        attributes
-      };
-    }
-    updateBlock(editor, path, blockElement, blockData) {
-      const comments = blockData.comments;
-      removeClass(blockElement, "comment");
-      Array.from(blockElement.attributes).forEach((a) => {
-        if (a.name.startsWith("comment-")) {
-          blockElement.removeAttribute(a.name);
-        }
-      });
-      if (!comments || comments.length === 0) {
-        return;
-      }
-      addClass(blockElement, "comment");
-      comments.forEach((commentId) => {
-        blockElement.setAttribute(`comment-${commentId.toLocaleLowerCase()}`, commentId);
-      });
-    }
-  }
   class OnesEditorCommentPlaceholderHandler {
     constructor(editor) {
       __publicField(this, "handleUpdateCompositionText", (editor, containerId, blockIndex, offset, end) => {
@@ -71065,6 +71597,8 @@ ${codeText}
       method: "delete"
     });
   }
+  getLogger("resolved-comment-item");
+  const styles = "";
   const isAllContainersSelected = (editor) => {
     var _a;
     const range = editor.selection.range;
@@ -71139,6 +71673,8 @@ ${codeText}
         await updateCommentToOldDoc(this.editor, this.version, commentId, comments.commentProvider.getCommentDoc(commentId));
       }
     }
+    onUpdateCommentResolver(commentId, local) {
+    }
     hideToolbar(editor) {
       const toolbar2 = editor.findCustom("toolbar-handler");
       toolbar2 == null ? void 0 : toolbar2.disableTextToolbar();
@@ -72017,8 +72553,8 @@ ${codeText}
       const blockData = this.editor.getBlockData(this.activeTableBlock);
       const containerId = focus.childContainerId;
       const bkg = blockData[`${containerId}_background`];
-      if (bkg) {
-        return Number.parseInt((_a = bkg.substring(BACKGROUND_COLOR_PREFIX.length)) != null ? _a : "0", 10);
+      if (bkg && bkg.startsWith(BACKGROUND_COLOR_PREFIX)) {
+        return Number.parseInt((_a = bkg.substring(BACKGROUND_COLOR_PREFIX.length)) != null ? _a : "0", 10) || -1;
       }
       return -1;
     }
@@ -72481,8 +73017,12 @@ ${codeText}
             cellElem.rowSpan = cell.rowSpan;
           }
           const backgroundClass = tableData[getCellBkgColorKey(subContainerId)];
-          if (backgroundClass) {
-            addClass(cellElem, backgroundClass);
+          if (backgroundClass && typeof backgroundClass === "string") {
+            if (backgroundClass.startsWith("style-bg-")) {
+              addClass(cellElem, backgroundClass);
+            } else {
+              cellElem.style.backgroundColor = backgroundClass;
+            }
           }
           if (col === 0 && tableData.hasColTitle) {
             addClass(cellElem, TABLE_CLASS.COL_TITLE_ITEM);
@@ -76447,14 +76987,14 @@ ${docStr}
   }
   function isList(elem) {
     var _a;
-    const styles = Array.from(((_a = elem.getAttribute("style")) != null ? _a : "").split(" "));
-    return styles.findIndex((style2) => style2.startsWith("level")) !== -1;
+    const styles2 = Array.from(((_a = elem.getAttribute("style")) != null ? _a : "").split(" "));
+    return styles2.findIndex((style2) => style2.startsWith("level")) !== -1;
   }
   function getOfficeListGroupId(elem) {
     var _a;
-    const styles = Array.from(((_a = elem.getAttribute("style")) != null ? _a : "").split(" "));
-    for (let i = 0; i < styles.length; i++) {
-      const name = styles[i];
+    const styles2 = Array.from(((_a = elem.getAttribute("style")) != null ? _a : "").split(" "));
+    for (let i = 0; i < styles2.length; i++) {
+      const name = styles2[i];
       if (name.startsWith("mso-list:")) {
         return name;
       }
@@ -76463,9 +77003,9 @@ ${docStr}
   }
   function getLevel(elem) {
     var _a, _b;
-    const styles = Array.from(((_a = elem.getAttribute("style")) != null ? _a : "").split(" "));
-    for (let i = 0; i < styles.length; i++) {
-      const name = styles[i];
+    const styles2 = Array.from(((_a = elem.getAttribute("style")) != null ? _a : "").split(" "));
+    for (let i = 0; i < styles2.length; i++) {
+      const name = styles2[i];
       if (name.startsWith("level")) {
         const level = (_b = Number.parseInt(name.substring(5), 10)) != null ? _b : void 0;
         if (level) {
@@ -80069,6 +80609,8 @@ ${docStr}
     }
     onUpdateComment() {
     }
+    onUpdateCommentResolver(commentId, local) {
+    }
   }
   async function playHistoryData(doc2, versionHelper, historyData) {
     for (const data2 of historyData) {
@@ -85011,7 +85553,7 @@ ${data2.flowchartText}
   };
   const drawioIframeUrl = "https://embed.diagrams.net/?embed=1";
   const DrawioJsUrl = "https://www.draw.io/embed.js";
-  const PakoJsUrl = "https://cdn.jsdelivr.net/npm/pako@2.0.3/dist/pako.es5.min.js";
+  const PakoJsUrl = "https://cdn.jsdelivr.net/npm/pako@2.0.3/dist/pako.es5.js";
   const EmptyIcon = '<svg width="48" height="49" viewBox="0 0 48 49" fill="none" xmlns="http://www.w3.org/2000/svg">\n<rect x="27" y="18.5" width="18" height="9" stroke="#C7C7C7" stroke-width="3"/>\n<rect x="12" y="18.5" width="9" height="9" transform="rotate(45 12 18.5)" stroke="#C7C7C7" stroke-width="3"/>\n<rect x="27" y="36.5" width="18" height="9" stroke="#C7C7C7" stroke-width="3"/>\n<path d="M27 24.5L18 24.5" stroke="#C7C7C7" stroke-width="3"/>\n<path d="M28.5 41H18" stroke="#C7C7C7" stroke-width="3"/>\n<path d="M18 41H12L12 30.5" stroke="#C7C7C7" stroke-width="3"/>\n<path d="M12 21.5L12 12.5" stroke="#C7C7C7" stroke-width="3"/>\n<rect x="7.5" y="3.5" width="9" height="9" rx="4.5" stroke="#C7C7C7" stroke-width="3"/>\n</svg>\n';
   const DEFAULT_STYLES = `
 <mxStylesheet>
@@ -85433,7 +85975,7 @@ ${data2.flowchartText}
   async function initDrawIo(editor) {
     var _a, _b;
     const option = getDrawioOptions(editor);
-    const drawIoUrl = ((_a = option.cdn) == null ? void 0 : _a.drawioJs) || DrawioJsUrl;
+    const drawIoUrl = ((_a = option.cdn) == null ? void 0 : _a.drawio) || DrawioJsUrl;
     const pakoUrl = ((_b = option.cdn) == null ? void 0 : _b.pako) || PakoJsUrl;
     await loadJsPromise(pakoUrl, "editor-pako");
     await loadJsPromise(drawIoUrl, "editor-drawio");
@@ -90231,6 +90773,9 @@ ${data2.plantumlText}
     localUpdateComment(comment, doc2) {
       this.doc.localUpdateComment(comment, doc2);
     }
+    localUpdateCommentResolver(commentId, resolver) {
+      this.doc.localUpdateCommentResolver(commentId, resolver);
+    }
     onCreateComment(commentId, local) {
       Array.from(this.listeners.values()).forEach((listener) => listener.onCreateComment(commentId, local));
     }
@@ -90240,6 +90785,9 @@ ${data2.plantumlText}
     onUpdateComment(commentId, local) {
       Array.from(this.listeners.values()).forEach((listener) => listener.onUpdateComment(commentId, local));
     }
+    onUpdateCommentResolver(commentId, local) {
+      Array.from(this.listeners.values()).forEach((listener) => listener.onUpdateCommentResolver(commentId, local));
+    }
     addListener(callback) {
       this.listeners.add(callback);
     }
@@ -90322,6 +90870,13 @@ ${data2.plantumlText}
       this._doc.comments[id] = shareDBComment;
       Array.from(this._listeners.values()).forEach((listener) => listener.onUpdateComment(id, true));
     }
+    localUpdateCommentResolver(commentId, resolver) {
+      const comment = this.getComment(commentId);
+      if (comment) {
+        comment.resolver = resolver;
+        this.localUpdateComment(comment, this.getCommentDoc(commentId));
+      }
+    }
     createCommentEditor(parent, childDoc) {
       const commentEditor = createCommentEditor(this.editor, {
         root: parent,
@@ -91059,8 +91614,8 @@ ${data2.plantumlText}
     const inlineStyles = attributesOfText(text2, "inlineStyle");
     if (inlineStyles == null)
       return;
-    const styles = inlineStyles.split(";");
-    for (const style2 of styles) {
+    const styles2 = inlineStyles.split(";");
+    for (const style2 of styles2) {
       const pair = style2.split(":");
       if (pair.length !== 2)
         continue;
@@ -93113,7 +93668,7 @@ ${data2.plantumlText}
         }
       }
     });
-    editor.version = "2.8.23";
+    editor.version = "2.8.25-beta.1";
     return editor;
   }
   function isDoc(doc2) {
@@ -93226,7 +93781,7 @@ ${data2.plantumlText}
       }
     });
     OnesEditorToolbar.register(editor);
-    editor.version = "2.8.23";
+    editor.version = "2.8.25-beta.1";
     return editor;
   }
   async function showDocVersions(editor, options, serverUrl) {