artalk 2.1.3 → 2.1.6

package/dist/Artalk.es.js

@@ -102,6 +102,7 @@ const defaults$3 = {
   vote: true,
   voteDown: false,
   uaBadge: true,
+  pvEl: "#ArtalkPV",
   flatMode: "auto",
   maxNesting: 3,
   gravatar: {
@@ -109,7 +110,7 @@ const defaults$3 = {
     mirror: "https://sdn.geekzu.org/avatar/"
   },
   pagination: {
-    pageSize: 15,
+    pageSize: 20,
     readMore: true,
     autoLoad: true
   },
@@ -194,7 +195,7 @@ function unescape(html) {
 }
 const caret = /(^|[^\[])\^/g;
 function edit(regex, opt) {
-  regex = regex.source || regex;
+  regex = typeof regex === "string" ? regex : regex.source;
   opt = opt || "";
   const obj = {
     replace: (name, val) => {
@@ -290,7 +291,7 @@ function splitCells(tableRow, count) {
   if (!cells[0].trim()) {
     cells.shift();
   }
-  if (!cells[cells.length - 1].trim()) {
+  if (cells.length > 0 && !cells[cells.length - 1].trim()) {
     cells.pop();
   }
   if (cells.length > count) {
@@ -320,7 +321,7 @@ function rtrim(str, c, invert) {
       break;
     }
   }
-  return str.substr(0, l - suffLen);
+  return str.slice(0, l - suffLen);
 }
 function findClosingBracket(str, b) {
   if (str.indexOf(b[1]) === -1) {
@@ -411,14 +412,11 @@ class Tokenizer {
   }
   space(src) {
     const cap = this.rules.block.newline.exec(src);
-    if (cap) {
-      if (cap[0].length > 1) {
-        return {
-          type: "space",
-          raw: cap[0]
-        };
-      }
-      return { raw: "\n" };
+    if (cap && cap[0].length > 0) {
+      return {
+        type: "space",
+        raw: cap[0]
+      };
     }
   }
   code(src) {
@@ -481,7 +479,7 @@ class Tokenizer {
   blockquote(src) {
     const cap = this.rules.block.blockquote.exec(src);
     if (cap) {
-      const text = cap[0].replace(/^ *> ?/gm, "");
+      const text = cap[0].replace(/^ *>[ \t]?/gm, "");
       return {
         type: "blockquote",
         raw: cap[0],
@@ -493,7 +491,7 @@ class Tokenizer {
   list(src) {
     let cap = this.rules.block.list.exec(src);
     if (cap) {
-      let raw, istask, ischecked, indent, i, blankLine, endsWithBlankLine, line, lines, itemContents;
+      let raw, istask, ischecked, indent, i, blankLine, endsWithBlankLine, line, nextLine, rawLine, itemContents, endEarly;
       let bull = cap[1].trim();
       const isordered = bull.length > 1;
       const list2 = {
@@ -508,57 +506,57 @@ class Tokenizer {
       if (this.options.pedantic) {
         bull = isordered ? bull : "[*+-]";
       }
-      const itemRegex = new RegExp(`^( {0,3}${bull})((?: [^\\n]*| *)(?:\\n[^\\n]*)*(?:\\n|$))`);
+      const itemRegex = new RegExp(`^( {0,3}${bull})((?:[	 ][^\\n]*)?(?:\\n|$))`);
       while (src) {
-        if (this.rules.block.hr.test(src)) {
+        endEarly = false;
+        if (!(cap = itemRegex.exec(src))) {
           break;
         }
-        if (!(cap = itemRegex.exec(src))) {
+        if (this.rules.block.hr.test(src)) {
           break;
         }
-        lines = cap[2].split("\n");
+        raw = cap[0];
+        src = src.substring(raw.length);
+        line = cap[2].split("\n", 1)[0];
+        nextLine = src.split("\n", 1)[0];
         if (this.options.pedantic) {
           indent = 2;
-          itemContents = lines[0].trimLeft();
+          itemContents = line.trimLeft();
         } else {
           indent = cap[2].search(/[^ ]/);
-          indent = cap[1].length + (indent > 4 ? 1 : indent);
-          itemContents = lines[0].slice(indent - cap[1].length);
+          indent = indent > 4 ? 1 : indent;
+          itemContents = line.slice(indent);
+          indent += cap[1].length;
         }
         blankLine = false;
-        raw = cap[0];
-        if (!lines[0] && /^ *$/.test(lines[1])) {
-          raw = cap[1] + lines.slice(0, 2).join("\n") + "\n";
-          list2.loose = true;
-          lines = [];
+        if (!line && /^ *$/.test(nextLine)) {
+          raw += nextLine + "\n";
+          src = src.substring(nextLine.length + 1);
+          endEarly = true;
         }
-        const nextBulletRegex = new RegExp(`^ {0,${Math.min(3, indent - 1)}}(?:[*+-]|\\d{1,9}[.)])`);
-        for (i = 1; i < lines.length; i++) {
-          line = lines[i];
-          if (this.options.pedantic) {
-            line = line.replace(/^ {1,4}(?=( {4})*[^ ])/g, "  ");
-          }
-          if (nextBulletRegex.test(line)) {
-            raw = cap[1] + lines.slice(0, i).join("\n") + "\n";
-            break;
-          }
-          if (!blankLine) {
-            if (!line.trim()) {
-              blankLine = true;
+        if (!endEarly) {
+          const nextBulletRegex = new RegExp(`^ {0,${Math.min(3, indent - 1)}}(?:[*+-]|\\d{1,9}[.)])`);
+          while (src) {
+            rawLine = src.split("\n", 1)[0];
+            line = rawLine;
+            if (this.options.pedantic) {
+              line = line.replace(/^ {1,4}(?=( {4})*[^ ])/g, "  ");
+            }
+            if (nextBulletRegex.test(line)) {
+              break;
             }
-            if (line.search(/[^ ]/) >= indent) {
+            if (line.search(/[^ ]/) >= indent || !line.trim()) {
               itemContents += "\n" + line.slice(indent);
-            } else {
+            } else if (!blankLine) {
               itemContents += "\n" + line;
+            } else {
+              break;
             }
-            continue;
-          }
-          if (line.search(/[^ ]/) >= indent || !line.trim()) {
-            itemContents += "\n" + line.slice(indent);
-            continue;
-          } else {
-            raw = cap[1] + lines.slice(0, i).join("\n") + "\n";
-            break;
+            if (!blankLine && !line.trim()) {
+              blankLine = true;
+            }
+            raw += rawLine + "\n";
+            src = src.substring(rawLine.length + 1);
           }
         }
         if (!list2.loose) {
@@ -584,7 +582,6 @@ class Tokenizer {
           text: itemContents
         });
         list2.raw += raw;
-        src = src.slice(raw.length);
       }
       list2.items[list2.items.length - 1].raw = raw.trimRight();
       list2.items[list2.items.length - 1].text = itemContents.trimRight();
@@ -593,7 +590,21 @@ class Tokenizer {
       for (i = 0; i < l; i++) {
         this.lexer.state.top = false;
         list2.items[i].tokens = this.lexer.blockTokens(list2.items[i].text, []);
-        if (list2.items[i].tokens.some((t) => t.type === "space")) {
+        const spacers = list2.items[i].tokens.filter((t) => t.type === "space");
+        const hasMultipleLineBreaks = spacers.every((t) => {
+          const chars = t.raw.split("");
+          let lineBreaks = 0;
+          for (const char of chars) {
+            if (char === "\n") {
+              lineBreaks += 1;
+            }
+            if (lineBreaks > 1) {
+              return true;
+            }
+          }
+          return false;
+        });
+        if (!list2.loose && spacers.length && hasMultipleLineBreaks) {
           list2.loose = true;
           list2.items[i].loose = true;
         }
@@ -643,7 +654,7 @@ class Tokenizer {
           return { text: c };
         }),
         align: cap[2].replace(/^ *|\| *$/g, "").split(/ *\| */),
-        rows: cap[3] ? cap[3].replace(/\n$/, "").split("\n") : []
+        rows: cap[3] && cap[3].trim() ? cap[3].replace(/\n[ \t]*$/, "").split("\n") : []
       };
       if (item.header.length === item.align.length) {
         item.raw = cap[0];
@@ -987,18 +998,18 @@ const block = {
   newline: /^(?: *(?:\n|$))+/,
   code: /^( {4}[^\n]+(?:\n(?: *(?:\n|$))*)?)+/,
   fences: /^ {0,3}(`{3,}(?=[^`\n]*\n)|~{3,})([^\n]*)\n(?:|([\s\S]*?)\n)(?: {0,3}\1[~`]* *(?=\n|$)|$)/,
-  hr: /^ {0,3}((?:- *){3,}|(?:_ *){3,}|(?:\* *){3,})(?:\n+|$)/,
+  hr: /^ {0,3}((?:-[\t ]*){3,}|(?:_[ \t]*){3,}|(?:\*[ \t]*){3,})(?:\n+|$)/,
   heading: /^ {0,3}(#{1,6})(?=\s|$)(.*)(?:\n+|$)/,
   blockquote: /^( {0,3}> ?(paragraph|[^\n]*)(?:\n|$))+/,
-  list: /^( {0,3}bull)( [^\n]+?)?(?:\n|$)/,
+  list: /^( {0,3}bull)([ \t][^\n]+?)?(?:\n|$)/,
   html: "^ {0,3}(?:<(script|pre|style|textarea)[\\s>][\\s\\S]*?(?:</\\1>[^\\n]*\\n+|$)|comment[^\\n]*(\\n+|$)|<\\?[\\s\\S]*?(?:\\?>\\n*|$)|<![A-Z][\\s\\S]*?(?:>\\n*|$)|<!\\[CDATA\\[[\\s\\S]*?(?:\\]\\]>\\n*|$)|</?(tag)(?: +|\\n|/?>)[\\s\\S]*?(?:(?:\\n *)+\\n|$)|<(?!script|pre|style|textarea)([a-z][\\w-]*)(?:attribute)*? */?>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n *)+\\n|$)|</(?!script|pre|style|textarea)[a-z][\\w-]*\\s*>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n *)+\\n|$))",
-  def: /^ {0,3}\[(label)\]: *\n? *<?([^\s>]+)>?(?:(?: +\n? *| *\n *)(title))? *(?:\n+|$)/,
+  def: /^ {0,3}\[(label)\]: *(?:\n *)?<?([^\s>]+)>?(?:(?: +(?:\n *)?| *\n *)(title))? *(?:\n+|$)/,
   table: noopTest,
   lheading: /^([^\n]+)\n {0,3}(=+|-+) *(?:\n+|$)/,
-  _paragraph: /^([^\n]+(?:\n(?!hr|heading|lheading|blockquote|fences|list|html| +\n)[^\n]+)*)/,
+  _paragraph: /^([^\n]+(?:\n(?!hr|heading|lheading|blockquote|fences|list|html|table| +\n)[^\n]+)*)/,
   text: /^[^\n]+/
 };
-block._label = /(?!\s*\])(?:\\[\[\]]|[^\[\]])+/;
+block._label = /(?!\s*\])(?:\\.|[^\[\]\\])+/;
 block._title = /(?:"(?:\\"?|[^"\\])*"|'[^'\n]*(?:\n[^'\n]+)*\n?'|\([^()]*\))/;
 block.def = edit(block.def).replace("label", block._label).replace("title", block._title).getRegex();
 block.bullet = /(?:[*+-]|\d{1,9}[.)])/;
@@ -1007,13 +1018,14 @@ block.list = edit(block.list).replace(/bull/g, block.bullet).replace("hr", "\\n+
 block._tag = "address|article|aside|base|basefont|blockquote|body|caption|center|col|colgroup|dd|details|dialog|dir|div|dl|dt|fieldset|figcaption|figure|footer|form|frame|frameset|h[1-6]|head|header|hr|html|iframe|legend|li|link|main|menu|menuitem|meta|nav|noframes|ol|optgroup|option|p|param|section|source|summary|table|tbody|td|tfoot|th|thead|title|tr|track|ul";
 block._comment = /<!--(?!-?>)[\s\S]*?(?:-->|$)/;
 block.html = edit(block.html, "i").replace("comment", block._comment).replace("tag", block._tag).replace("attribute", / +[a-zA-Z:_][\w.:-]*(?: *= *"[^"\n]*"| *= *'[^'\n]*'| *= *[^\s"'=<>`]+)?/).getRegex();
-block.paragraph = edit(block._paragraph).replace("hr", block.hr).replace("heading", " {0,3}#{1,6} ").replace("|lheading", "").replace("blockquote", " {0,3}>").replace("fences", " {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list", " {0,3}(?:[*+-]|1[.)]) ").replace("html", "</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag", block._tag).getRegex();
+block.paragraph = edit(block._paragraph).replace("hr", block.hr).replace("heading", " {0,3}#{1,6} ").replace("|lheading", "").replace("|table", "").replace("blockquote", " {0,3}>").replace("fences", " {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list", " {0,3}(?:[*+-]|1[.)]) ").replace("html", "</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag", block._tag).getRegex();
 block.blockquote = edit(block.blockquote).replace("paragraph", block.paragraph).getRegex();
 block.normal = merge({}, block);
 block.gfm = merge({}, block.normal, {
   table: "^ *([^\\n ].*\\|.*)\\n {0,3}(?:\\| *)?(:?-+:? *(?:\\| *:?-+:? *)*)(?:\\| *)?(?:\\n((?:(?! *\\n|hr|heading|blockquote|code|fences|list|html).*(?:\\n|$))*)\\n*|$)"
 });
 block.gfm.table = edit(block.gfm.table).replace("hr", block.hr).replace("heading", " {0,3}#{1,6} ").replace("blockquote", " {0,3}>").replace("code", " {4}[^\\n]").replace("fences", " {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list", " {0,3}(?:[*+-]|1[.)]) ").replace("html", "</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag", block._tag).getRegex();
+block.gfm.paragraph = edit(block._paragraph).replace("hr", block.hr).replace("heading", " {0,3}#{1,6} ").replace("|lheading", "").replace("table", block.gfm.table).replace("blockquote", " {0,3}>").replace("fences", " {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list", " {0,3}(?:[*+-]|1[.)]) ").replace("html", "</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag", block._tag).getRegex();
 block.pedantic = merge({}, block.normal, {
   html: edit(`^ *(?:comment *(?:\\n|\\s*$)|<(tag)[\\s\\S]+?</\\1> *(?:\\n{2,}|\\s*$)|<tag(?:"[^"]*"|'[^']*'|\\s[^'"/>\\s]*)*?/?> *(?:\\n{2,}|\\s*$))`).replace("comment", block._comment).replace(/tag/g, "(?!(?:a|em|strong|small|s|cite|q|dfn|abbr|data|time|code|var|samp|kbd|sub|sup|i|b|u|mark|ruby|rt|rp|bdi|bdo|span|br|wbr|ins|del|img)\\b)\\w+(?!:|[^\\w\\s@]*@)\\b").getRegex(),
   def: /^ *\[([^\]]+)\]: *<?([^\s>]+)>?(?: +(["(][^\n]+[")]))? *(?:\n+|$)/,
@@ -1027,13 +1039,13 @@ const inline = {
   url: noopTest,
   tag: "^comment|^</[a-zA-Z][\\w:-]*\\s*>|^<[a-zA-Z][\\w-]*(?:attribute)*?\\s*/?>|^<\\?[\\s\\S]*?\\?>|^<![a-zA-Z]+\\s[\\s\\S]*?>|^<!\\[CDATA\\[[\\s\\S]*?\\]\\]>",
   link: /^!?\[(label)\]\(\s*(href)(?:\s+(title))?\s*\)/,
-  reflink: /^!?\[(label)\]\[(?!\s*\])((?:\\[\[\]]?|[^\[\]\\])+)\]/,
-  nolink: /^!?\[(?!\s*\])((?:\[[^\[\]]*\]|\\[\[\]]|[^\[\]])*)\](?:\[\])?/,
+  reflink: /^!?\[(label)\]\[(ref)\]/,
+  nolink: /^!?\[(ref)\](?:\[\])?/,
   reflinkSearch: "reflink|nolink(?!\\()",
   emStrong: {
     lDelim: /^(?:\*+(?:([punct_])|[^\s*]))|^_+(?:([punct*])|([^\s_]))/,
-    rDelimAst: /^[^_*]*?\_\_[^_*]*?\*[^_*]*?(?=\_\_)|[punct_](\*+)(?=[\s]|$)|[^punct*_\s](\*+)(?=[punct_\s]|$)|[punct_\s](\*+)(?=[^punct*_\s])|[\s](\*+)(?=[punct_])|[punct_](\*+)(?=[punct_])|[^punct*_\s](\*+)(?=[^punct*_\s])/,
-    rDelimUnd: /^[^_*]*?\*\*[^_*]*?\_[^_*]*?(?=\*\*)|[punct*](\_+)(?=[\s]|$)|[^punct*_\s](\_+)(?=[punct*\s]|$)|[punct*\s](\_+)(?=[^punct*_\s])|[\s](\_+)(?=[punct*])|[punct*](\_+)(?=[punct*])/
+    rDelimAst: /^[^_*]*?\_\_[^_*]*?\*[^_*]*?(?=\_\_)|[^*]+(?=[^*])|[punct_](\*+)(?=[\s]|$)|[^punct*_\s](\*+)(?=[punct_\s]|$)|[punct_\s](\*+)(?=[^punct*_\s])|[\s](\*+)(?=[punct_])|[punct_](\*+)(?=[punct_])|[^punct*_\s](\*+)(?=[^punct*_\s])/,
+    rDelimUnd: /^[^_*]*?\*\*[^_*]*?\_[^_*]*?(?=\*\*)|[^_]+(?=[^_])|[punct*](\_+)(?=[\s]|$)|[^punct*_\s](\_+)(?=[punct*\s]|$)|[punct*\s](\_+)(?=[^punct*_\s])|[\s](\_+)(?=[punct*])|[punct*](\_+)(?=[punct*])/
   },
   code: /^(`+)([^`]|[^`][\s\S]*?[^`])\1(?!`)/,
   br: /^( {2,}|\\)\n(?!\s*$)/,
@@ -1059,7 +1071,8 @@ inline._label = /(?:\[(?:\\.|[^\[\]\\])*\]|\\.|`[^`]*`|[^\[\]\\`])*?/;
 inline._href = /<(?:\\.|[^\n<>\\])+>|[^\s\x00-\x1f]*/;
 inline._title = /"(?:\\"?|[^"\\])*"|'(?:\\'?|[^'\\])*'|\((?:\\\)?|[^)\\])*\)/;
 inline.link = edit(inline.link).replace("label", inline._label).replace("href", inline._href).replace("title", inline._title).getRegex();
-inline.reflink = edit(inline.reflink).replace("label", inline._label).getRegex();
+inline.reflink = edit(inline.reflink).replace("label", inline._label).replace("ref", block._label).getRegex();
+inline.nolink = edit(inline.nolink).replace("ref", block._label).getRegex();
 inline.reflinkSearch = edit(inline.reflinkSearch, "g").replace("reflink", inline.reflink).replace("nolink", inline.nolink).getRegex();
 inline.normal = merge({}, inline);
 inline.pedantic = merge({}, inline.normal, {
@@ -1153,7 +1166,7 @@ class Lexer {
     return lexer.inlineTokens(src);
   }
   lex(src) {
-    src = src.replace(/\r\n|\r/g, "\n").replace(/\t/g, "    ");
+    src = src.replace(/\r\n|\r/g, "\n");
     this.blockTokens(src, this.tokens);
     let next;
     while (next = this.inlineQueue.shift()) {
@@ -1163,7 +1176,11 @@ class Lexer {
   }
   blockTokens(src, tokens = []) {
     if (this.options.pedantic) {
-      src = src.replace(/^ +$/gm, "");
+      src = src.replace(/\t/g, "    ").replace(/^ +$/gm, "");
+    } else {
+      src = src.replace(/^( *)(\t+)/gm, (_, leading, tabs) => {
+        return leading + "    ".repeat(tabs.length);
+      });
     }
     let token, lastToken, cutSrc, lastParagraphClipped;
     while (src) {
@@ -1179,7 +1196,9 @@ class Lexer {
       }
       if (token = this.tokenizer.space(src)) {
         src = src.substring(token.raw.length);
-        if (token.type) {
+        if (token.raw.length === 1 && tokens.length > 0) {
+          tokens[tokens.length - 1].raw += "\n";
+        } else {
           tokens.push(token);
         }
         continue;
@@ -1470,16 +1489,21 @@ class Renderer {
     return '<pre><code class="' + this.options.langPrefix + escape(lang, true) + '">' + (escaped ? code : escape(code, true)) + "</code></pre>\n";
   }
   blockquote(quote) {
-    return "<blockquote>\n" + quote + "</blockquote>\n";
+    return `<blockquote>
+${quote}</blockquote>
+`;
   }
   html(html) {
     return html;
   }
   heading(text, level, raw, slugger) {
     if (this.options.headerIds) {
-      return "<h" + level + ' id="' + this.options.headerPrefix + slugger.slug(raw) + '">' + text + "</h" + level + ">\n";
+      const id = this.options.headerPrefix + slugger.slug(raw);
+      return `<h${level} id="${id}">${text}</h${level}>
+`;
     }
-    return "<h" + level + ">" + text + "</h" + level + ">\n";
+    return `<h${level}>${text}</h${level}>
+`;
   }
   hr() {
     return this.options.xhtml ? "<hr/>\n" : "<hr>\n";
@@ -1489,41 +1513,46 @@ class Renderer {
     return "<" + type + startatt + ">\n" + body + "</" + type + ">\n";
   }
   listitem(text) {
-    return "<li>" + text + "</li>\n";
+    return `<li>${text}</li>
+`;
   }
   checkbox(checked) {
     return "<input " + (checked ? 'checked="" ' : "") + 'disabled="" type="checkbox"' + (this.options.xhtml ? " /" : "") + "> ";
   }
   paragraph(text) {
-    return "<p>" + text + "</p>\n";
+    return `<p>${text}</p>
+`;
   }
   table(header, body) {
     if (body)
-      body = "<tbody>" + body + "</tbody>";
+      body = `<tbody>${body}</tbody>`;
     return "<table>\n<thead>\n" + header + "</thead>\n" + body + "</table>\n";
   }
   tablerow(content) {
-    return "<tr>\n" + content + "</tr>\n";
+    return `<tr>
+${content}</tr>
+`;
   }
   tablecell(content, flags) {
     const type = flags.header ? "th" : "td";
-    const tag = flags.align ? "<" + type + ' align="' + flags.align + '">' : "<" + type + ">";
-    return tag + content + "</" + type + ">\n";
+    const tag = flags.align ? `<${type} align="${flags.align}">` : `<${type}>`;
+    return tag + content + `</${type}>
+`;
   }
   strong(text) {
-    return "<strong>" + text + "</strong>";
+    return `<strong>${text}</strong>`;
   }
   em(text) {
-    return "<em>" + text + "</em>";
+    return `<em>${text}</em>`;
   }
   codespan(text) {
-    return "<code>" + text + "</code>";
+    return `<code>${text}</code>`;
   }
   br() {
     return this.options.xhtml ? "<br/>" : "<br>";
   }
   del(text) {
-    return "<del>" + text + "</del>";
+    return `<del>${text}</del>`;
   }
   link(href, title, text) {
     href = cleanUrl(this.options.sanitize, this.options.baseUrl, href);
@@ -1542,9 +1571,9 @@ class Renderer {
     if (href === null) {
       return text;
     }
-    let out = '<img src="' + href + '" alt="' + text + '"';
+    let out = `<img src="${href}" alt="${text}"`;
     if (title) {
-      out += ' title="' + title + '"';
+      out += ` title="${title}"`;
     }
     out += this.options.xhtml ? "/>" : ">";
     return out;
@@ -2584,6 +2613,8 @@ function timeAgo(date) {
   }
 }
 function onImagesLoaded($container, event) {
+  if (!$container)
+    return;
   const images = $container.getElementsByTagName("img");
   if (!images.length)
     return;
@@ -2655,6 +2686,30 @@ function marked(ctx, src) {
   }
   return markedInstance.parse(src);
 }
+function getCorrectUserAgent() {
+  return __async(this, null, function* () {
+    const uaRaw = navigator.userAgent;
+    const uaData = navigator.userAgentData;
+    if (!uaData || !uaData.getHighEntropyValues) {
+      return uaRaw;
+    }
+    let uaGot = null;
+    try {
+      uaGot = yield uaData.getHighEntropyValues(["platformVersion"]);
+    } catch (err) {
+      console.error(err);
+      return uaRaw;
+    }
+    if (uaData.platform !== "Windows") {
+      return uaRaw;
+    }
+    const majorPlatformVersion = Number(uaGot.platformVersion.split(".")[0]);
+    if (majorPlatformVersion >= 13) {
+      return uaRaw.replace(/Windows\W+NT\W+10.0/, "Windows NT 11.0");
+    }
+    return uaRaw;
+  });
+}
 function showLoading(parentElem) {
   if (parentElem instanceof Context)
     parentElem = parentElem.$root;
@@ -2948,7 +3003,8 @@ function Fetch(ctx, input, init, timeout) {
       } else {
         resp = yield timeoutPromise(timeout || ctx.conf.reqTimeout || 15e3, fetch(input, init));
       }
-      if (!resp.ok && resp.status !== 401)
+      const noAccessCodes = [401, 400];
+      if (!resp.ok && !noAccessCodes.includes(resp.status))
         throw new Error(`\u8BF7\u6C42\u54CD\u5E94 ${resp.status}`);
       let json = yield resp.json();
       const recall = (resolve, reject) => {
@@ -2970,7 +3026,7 @@ function Fetch(ctx, input, init, timeout) {
             }
           });
         });
-      } else if (json.data && json.data.need_login || resp.status === 401) {
+      } else if (json.data && json.data.need_login || noAccessCodes.includes(resp.status)) {
         json = yield new Promise((resolve, reject) => {
           ctx.trigger("checker-admin", {
             onSuccess: () => {
@@ -3038,16 +3094,13 @@ class Api {
     this.ctx = ctx;
     this.baseURL = ctx.conf.server;
   }
-  get(offset, type, flatMode, paramsEditor) {
-    var _a;
+  get(offset, pageSize, flatMode, paramsEditor) {
     const params = {
       page_key: this.ctx.conf.pageKey,
       site_name: this.ctx.conf.site || "",
-      limit: ((_a = this.ctx.conf.pagination) == null ? void 0 : _a.pageSize) || 15,
+      limit: pageSize,
       offset
     };
-    if (type)
-      params.type = type;
     if (flatMode)
       params.flat_mode = flatMode;
     if (this.ctx.user.checkHasBasicUserInfo()) {
@@ -3066,7 +3119,8 @@ class Api {
         link: comment2.link,
         content: comment2.content,
         rid: comment2.rid,
-        page_key: comment2.page_key
+        page_key: comment2.page_key,
+        ua: yield getCorrectUserAgent()
       };
       if (comment2.page_title)
         params.page_title = comment2.page_title;
@@ -3235,6 +3289,17 @@ class Api {
     }
     return POST(this.ctx, `${this.baseURL}/mark-read`, params);
   }
+  pv() {
+    return __async(this, null, function* () {
+      const params = {
+        site_name: this.ctx.conf.site || "",
+        page_key: this.ctx.conf.pageKey || "",
+        page_title: this.ctx.conf.pageTitle || ""
+      };
+      const p = yield POST(this.ctx, `${this.baseURL}/pv`, params);
+      return p.pv;
+    });
+  }
   captchaGet() {
     return __async(this, null, function* () {
       const data = yield GET(this.ctx, `${this.baseURL}/captcha/refresh`);
@@ -3381,7 +3446,7 @@ class CheckerLauncher {
   }
 }
 var editor = "";
-var EditorHTML = '<div class="atk-main-editor">\n  <div class="atk-editor-header">\n    <input name="nick" placeholder="\u6635\u79F0" class="atk-nick" type="text" required="required">\n    <input name="email" placeholder="\u90AE\u7BB1" class="atk-email" type="email" required="required">\n    <input name="link" placeholder="\u7F51\u5740 (https://)" class="atk-link" type="url">\n  </div>\n  <div class="atk-editor-textarea-wrap">\n    <div class="atk-close-comment" style="display: none;"><span>\u4EC5\u7BA1\u7406\u5458\u53EF\u8BC4\u8BBA</span></div>\n    <textarea id="atk-editor-textarea" class="atk-editor-textarea" placeholder=""></textarea>\n  </div>\n  <div class="atk-editor-plug-wrap" style="display: none;"></div>\n  <div class="atk-editor-bottom">\n    <div class="atk-editor-bottom-part atk-left atk-editor-plug-switcher-wrap"></div>\n    <div class="atk-editor-bottom-part atk-right">\n      <button type="button" class="atk-send-btn"></button>\n    </div>\n  </div>\n  <div class="atk-editor-notify-wrap"></div>\n</div>\n';
+var EditorHTML = '<div class="atk-main-editor">\n  <div class="atk-header">\n    <input name="nick" placeholder="\u6635\u79F0" class="atk-nick" type="text" required="required">\n    <input name="email" placeholder="\u90AE\u7BB1" class="atk-email" type="email" required="required">\n    <input name="link" placeholder="\u7F51\u5740 (https://)" class="atk-link" type="url">\n  </div>\n  <div class="atk-textarea-wrap">\n    <textarea class="atk-textarea" placeholder=""></textarea>\n  </div>\n  <div class="atk-plug-wrap" style="display: none;"></div>\n  <div class="atk-bottom">\n    <div class="atk-item atk-plug-btn-wrap"></div>\n    <div class="atk-item">\n      <button type="button" class="atk-send-btn"></button>\n    </div>\n  </div>\n  <div class="atk-notify-wrap"></div>\n</div>\n';
 var emoticonsPlug = "";
 class EditorPlug {
   constructor(editor2) {
@@ -3398,8 +3463,8 @@ class EmoticonsPlug extends EditorPlug {
     super(editor2);
     __publicField(this, "$el");
     __publicField(this, "emoticons", []);
-    __publicField(this, "$listWrap");
-    __publicField(this, "$types");
+    __publicField(this, "$grpWrap");
+    __publicField(this, "$grpSwitcher");
     this.editor = editor2;
     this.$el = createElement(`<div class="atk-editor-plug-emoticons"></div>`);
     this.init();
@@ -3527,17 +3592,17 @@ class EmoticonsPlug extends EditorPlug {
     return dest;
   }
   initEmoticonsList() {
-    this.$listWrap = createElement(`<div class="atk-emoticons-list-wrap"></div>`);
-    this.$el.append(this.$listWrap);
+    this.$grpWrap = createElement(`<div class="atk-grp-wrap"></div>`);
+    this.$el.append(this.$grpWrap);
     this.emoticons.forEach((grp, index) => {
-      const emoticonsEl = createElement(`<div class="atk-emoticons-list" style="display: none;"></div>`);
-      this.$listWrap.append(emoticonsEl);
-      emoticonsEl.setAttribute("data-index", String(index));
-      emoticonsEl.setAttribute("data-grp-name", grp.name);
-      emoticonsEl.setAttribute("data-type", grp.type);
+      const $grp = createElement(`<div class="atk-grp" style="display: none;"></div>`);
+      this.$grpWrap.append($grp);
+      $grp.setAttribute("data-index", String(index));
+      $grp.setAttribute("data-grp-name", grp.name);
+      $grp.setAttribute("data-type", grp.type);
       grp.items.forEach((item) => {
-        const $item = createElement(`<span class="atk-emoticons-item"></span>`);
-        emoticonsEl.append($item);
+        const $item = createElement(`<span class="atk-item"></span>`);
+        $grp.append($item);
         if (!!item.key && !new RegExp(`^(${grp.name})?\\s?[0-9]+$`).test(item.key))
           $item.setAttribute("title", item.key);
         if (grp.type === "image") {
@@ -3557,21 +3622,21 @@ class EmoticonsPlug extends EditorPlug {
         };
       });
     });
-    this.$types = createElement(`<div class="atk-emoticons-types"></div>`);
-    this.$el.append(this.$types);
+    this.$grpSwitcher = createElement(`<div class="atk-grp-switcher"></div>`);
+    this.$el.append(this.$grpSwitcher);
     this.emoticons.forEach((grp, index) => {
       const $item = createElement("<span />");
       $item.innerText = grp.name;
       $item.setAttribute("data-index", String(index));
       $item.onclick = () => this.openGrp(index);
-      this.$types.append($item);
+      this.$grpSwitcher.append($item);
     });
     if (this.emoticons.length > 0)
       this.openGrp(0);
   }
   openGrp(index) {
     var _a;
-    Array.from(this.$listWrap.children).forEach((item) => {
+    Array.from(this.$grpWrap.children).forEach((item) => {
       const el = item;
       if (el.getAttribute("data-index") !== String(index)) {
         el.style.display = "none";
@@ -3579,8 +3644,8 @@ class EmoticonsPlug extends EditorPlug {
         el.style.display = "";
       }
     });
-    this.$types.querySelectorAll("span.active").forEach((item) => item.classList.remove("active"));
-    (_a = this.$types.querySelector(`span[data-index="${index}"]`)) == null ? void 0 : _a.classList.add("active");
+    this.$grpSwitcher.querySelectorAll("span.active").forEach((item) => item.classList.remove("active"));
+    (_a = this.$grpSwitcher.querySelector(`span[data-index="${index}"]`)) == null ? void 0 : _a.classList.add("active");
     this.changeListHeight();
   }
   getEl() {
@@ -3655,12 +3720,9 @@ class Editor extends Component {
     __publicField(this, "$header");
     __publicField(this, "$textareaWrap");
     __publicField(this, "$textarea");
-    __publicField(this, "$closeComment");
     __publicField(this, "$plugWrap");
     __publicField(this, "$bottom");
-    __publicField(this, "$bottomPartLeft");
-    __publicField(this, "$plugSwitcherWrap");
-    __publicField(this, "$bottomPartRight");
+    __publicField(this, "$plugBtnWrap");
     __publicField(this, "$submitBtn");
     __publicField(this, "$notifyWrap");
     __publicField(this, "replyComment", null);
@@ -3672,17 +3734,14 @@ class Editor extends Component {
     });
     __publicField(this, "openedPlugName", null);
     this.$el = createElement(EditorHTML);
-    this.$header = this.$el.querySelector(".atk-editor-header");
-    this.$textareaWrap = this.$el.querySelector(".atk-editor-textarea-wrap");
-    this.$textarea = this.$el.querySelector(".atk-editor-textarea");
-    this.$closeComment = this.$el.querySelector(".atk-close-comment");
-    this.$plugWrap = this.$el.querySelector(".atk-editor-plug-wrap");
-    this.$bottom = this.$el.querySelector(".atk-editor-bottom");
-    this.$bottomPartLeft = this.$el.querySelector(".atk-editor-bottom-part.atk-left");
-    this.$plugSwitcherWrap = this.$el.querySelector(".atk-editor-plug-switcher-wrap");
-    this.$bottomPartRight = this.$el.querySelector(".atk-editor-bottom-part.atk-right");
+    this.$header = this.$el.querySelector(".atk-header");
+    this.$textareaWrap = this.$el.querySelector(".atk-textarea-wrap");
+    this.$textarea = this.$el.querySelector(".atk-textarea");
+    this.$plugWrap = this.$el.querySelector(".atk-plug-wrap");
+    this.$bottom = this.$el.querySelector(".atk-bottom");
+    this.$plugBtnWrap = this.$el.querySelector(".atk-plug-btn-wrap");
     this.$submitBtn = this.$el.querySelector(".atk-send-btn");
-    this.$notifyWrap = this.$el.querySelector(".atk-editor-notify-wrap");
+    this.$notifyWrap = this.$el.querySelector(".atk-notify-wrap");
     this.initLocalStorage();
     this.initHeader();
     this.initTextarea();
@@ -3793,17 +3852,17 @@ class Editor extends Component {
     this.$plugWrap.innerHTML = "";
     this.$plugWrap.style.display = "none";
     this.openedPlugName = null;
-    this.$plugSwitcherWrap.innerHTML = "";
+    this.$plugBtnWrap.innerHTML = "";
     this.LOADABLE_PLUG_LIST.forEach((PlugObj) => {
-      const btnElem = createElement(`<span class="atk-editor-action atk-editor-plug-switcher">${PlugObj.BtnHTML}</span>`);
-      this.$plugSwitcherWrap.appendChild(btnElem);
+      const btnElem = createElement(`<span class="atk-plug-btn">${PlugObj.BtnHTML}</span>`);
+      this.$plugBtnWrap.appendChild(btnElem);
       btnElem.addEventListener("click", () => {
         let plug = this.plugList[PlugObj.Name];
         if (!plug) {
           plug = new PlugObj(this);
           this.plugList[PlugObj.Name] = plug;
         }
-        this.$plugSwitcherWrap.querySelectorAll(".active").forEach((item) => item.classList.remove("active"));
+        this.$plugBtnWrap.querySelectorAll(".active").forEach((item) => item.classList.remove("active"));
         if (PlugObj.Name === this.openedPlugName) {
           plug.onHide();
           this.$plugWrap.style.display = "none";
@@ -3965,7 +4024,8 @@ class Editor extends Component {
     showNotify(this.$notifyWrap, msg, type);
   }
   close() {
-    this.$closeComment.style.display = "";
+    if (!this.$textareaWrap.querySelector(".atk-comment-closed"))
+      this.$textareaWrap.prepend(createElement('<div class="atk-comment-closed">\u4EC5\u7BA1\u7406\u5458\u53EF\u8BC4\u8BBA</div>'));
     if (!this.user.data.isAdmin) {
       this.$textarea.style.display = "none";
       this.closePlug();
@@ -3976,7 +4036,8 @@ class Editor extends Component {
     }
   }
   open() {
-    this.$closeComment.style.display = "none";
+    var _a;
+    (_a = this.$textareaWrap.querySelector(".atk-comment-closed")) == null ? void 0 : _a.remove();
     this.$textarea.style.display = "";
     this.$bottom.style.display = "";
   }
@@ -4000,7 +4061,7 @@ class Editor extends Component {
   }
 }
 var list = "";
-var ListHTML = '<div class="atk-list">\n  <div class="atk-list-header">\n    <div class="atk-comment-count">\n      <span class="atk-comment-count-num">0</span>\n      \u6761\u8BC4\u8BBA\n    </div>\n    <div class="atk-right-action">\n      <span data-action="admin-close-comment" class="atk-hide" atk-only-admin-show>\u5173\u95ED\u8BC4\u8BBA</span>\n      <span data-action="open-sidebar" class="atk-hide atk-on">\n        <span class="atk-unread-badge" style="display: none;"></span>\n        \u901A\u77E5\u4E2D\u5FC3\n      </span>\n    </div>\n  </div>\n  <div class="atk-list-body"></div>\n  <div class="atk-list-footer">\n    <div class="atk-copyright"></div>\n  </div>\n</div>\n';
+var ListHTML = '<div class="atk-list">\n  <div class="atk-list-header">\n    <div class="atk-comment-count">\n      <span class="atk-comment-count-num">0</span>\n      \u6761\u8BC4\u8BBA\n    </div>\n    <div class="atk-right-action">\n      <span data-action="admin-close-comment" class="atk-hide" atk-only-admin-show>\u5173\u95ED\u8BC4\u8BBA</span>\n      <span data-action="open-sidebar" class="atk-hide atk-on">\n        <span class="atk-unread-badge" style="display: none;"></span>\n        <div class="atk-text">\u901A\u77E5\u4E2D\u5FC3</div>\n      </span>\n    </div>\n  </div>\n  <div class="atk-list-body"></div>\n  <div class="atk-list-footer">\n    <div class="atk-copyright"></div>\n  </div>\n</div>\n';
 var comment = "";
 var win = window || {};
 var nav = navigator || {};
@@ -4099,7 +4160,9 @@ function Detect(userAgent) {
         "6.0": "Vista",
         5.2: "XP",
         5.1: "XP",
-        "5.0": "2000"
+        "5.0": "2000",
+        "10.0": "10",
+        "11.0": "11"
       };
       return hash2[v] || v;
     },
@@ -4243,7 +4306,7 @@ function Detect(userAgent) {
 function detectFactory(u) {
   return new Detect(u);
 }
-var CommentHTML = '<div class="atk-comment-wrap" data-comment-id="">\n  <div class="atk-comment">\n\n    <div class="atk-avatar"></div>\n\n    <div class="atk-comment-main">\n\n      <div class="atk-header">\n        <span class="atk-nick"></span>\n        <span class="atk-badge"></span>\n        <span class="atk-date"></span>\n      </div>\n\n      <div class="atk-body">\n        <div class="atk-content"></div>\n      </div>\n\n      <div class="atk-footer">\n        <div class="atk-comment-actions"></div>\n      </div>\n\n    </div>\n\n  </div>\n</div>\n';
+var CommentHTML = '<div class="atk-comment-wrap">\n  <div class="atk-comment">\n    <div class="atk-avatar"></div>\n    <div class="atk-main">\n      <div class="atk-header">\n        <span class="atk-item atk-nick"></span>\n        <span class="atk-item atk-badge"></span>\n        <span class="atk-item atk-date"></span>\n      </div>\n      <div class="atk-body">\n        <div class="atk-content"></div>\n      </div>\n      <div class="atk-footer">\n        <div class="atk-actions"></div>\n      </div>\n    </div>\n  </div>\n</div>\n';
 class ActionBtn {
   constructor(conf) {
     __publicField(this, "conf");
@@ -4306,7 +4369,7 @@ class ActionBtn {
     this.setLoading(false);
     this.$el.innerText = this.getText();
   }
-  setLoading(value = true, loadingText) {
+  setLoading(value, loadingText) {
     if (this.isLoading === value)
       return;
     this.isLoading = value;
@@ -4393,11 +4456,11 @@ class Comment extends Component {
   }
   render() {
     this.$el = createElement(CommentHTML);
-    this.$main = this.$el.querySelector(".atk-comment-main");
+    this.$main = this.$el.querySelector(".atk-main");
     this.$header = this.$el.querySelector(".atk-header");
     this.$body = this.$el.querySelector(".atk-body");
     this.$content = this.$body.querySelector(".atk-content");
-    this.$actions = this.$el.querySelector(".atk-comment-actions");
+    this.$actions = this.$el.querySelector(".atk-actions");
     this.$children = null;
     this.$el.setAttribute("data-comment-id", `${this.data.id}`);
     this.renderCheckUnread();
@@ -4540,7 +4603,7 @@ class Comment extends Component {
       }
     }
     if (this.data.is_allow_reply) {
-      const replyBtn = createElement(`<span data-atk-action="comment-reply">\u56DE\u590D</span>`);
+      const replyBtn = createElement(`<span>\u56DE\u590D</span>`);
       this.$actions.append(replyBtn);
       replyBtn.addEventListener("click", (e) => {
         e.stopPropagation();
@@ -4612,6 +4675,7 @@ class Comment extends Component {
     this.children.push(childC);
     this.getChildrenEl().appendChild(childC.getEl());
     childC.playFadeInAnim();
+    childC.checkHeightLimitArea("content");
   }
   getChildrenEl() {
     if (this.$children === null) {
@@ -4727,6 +4791,76 @@ class Comment extends Component {
     this.openURL = url;
     this.$el.classList.add("atk-openable");
   }
+  checkHeightLimit() {
+    this.checkHeightLimitArea("content");
+    this.checkHeightLimitArea("children");
+  }
+  checkHeightLimitArea(area) {
+    var _a, _b;
+    const childrenMaxH = (_a = this.ctx.conf.heightLimit) == null ? void 0 : _a.children;
+    const contentMaxH = (_b = this.ctx.conf.heightLimit) == null ? void 0 : _b.content;
+    if (area === "children" && !childrenMaxH)
+      return;
+    if (area === "content" && !contentMaxH)
+      return;
+    let maxHeight;
+    if (area === "children")
+      maxHeight = childrenMaxH;
+    if (area === "content")
+      maxHeight = contentMaxH;
+    const checkEl = ($el) => {
+      if (!$el)
+        return;
+      if (getHeight($el) > maxHeight) {
+        this.heightLimitAdd($el, maxHeight);
+      }
+    };
+    if (area === "children") {
+      checkEl(this.$children);
+    } else if (area === "content") {
+      checkEl(this.$content);
+      checkEl(this.$replyTo);
+      onImagesLoaded(this.$content, () => {
+        checkEl(this.$content);
+      });
+      if (this.$replyTo) {
+        onImagesLoaded(this.$replyTo, () => {
+          checkEl(this.$replyTo);
+        });
+      }
+    }
+  }
+  heightLimitRemove($el) {
+    if (!$el)
+      return;
+    if (!$el.classList.contains("atk-height-limit"))
+      return;
+    $el.classList.remove("atk-height-limit");
+    Array.from($el.children).forEach((e) => {
+      if (e.classList.contains("atk-height-limit-btn"))
+        e.remove();
+    });
+    $el.style.height = "";
+    $el.style.overflow = "";
+  }
+  heightLimitAdd($el, maxHeight) {
+    if (!$el)
+      return;
+    if ($el.classList.contains("atk-height-limit"))
+      return;
+    $el.classList.add("atk-height-limit");
+    $el.style.height = `${maxHeight}px`;
+    $el.style.overflow = "hidden";
+    const $hideMoreOpenBtn = createElement(`<div class="atk-height-limit-btn">\u9605\u8BFB\u66F4\u591A</span>`);
+    $hideMoreOpenBtn.onclick = (e) => {
+      e.stopPropagation();
+      this.heightLimitRemove($el);
+      const children = this.getChildren();
+      if (children.length === 1)
+        children[0].heightLimitRemove(children[0].$content);
+    };
+    $el.append($hideMoreOpenBtn);
+  }
 }
 var pagination = "";
 class Pagination {
@@ -4759,7 +4893,7 @@ class Pagination {
     this.checkDisabled();
   }
   get pageSize() {
-    return this.conf.pageSize || 15;
+    return this.conf.pageSize;
   }
   get offset() {
     return this.pageSize * (this.page - 1);
@@ -4869,19 +5003,28 @@ class ReadMoreBtn {
     __publicField(this, "$el");
     __publicField(this, "$loading");
     __publicField(this, "$text");
+    __publicField(this, "offset", 0);
+    __publicField(this, "total", 0);
     this.conf = conf;
     this.$el = createElement(`<div class="atk-list-read-more" style="display: none;">
       <div class="atk-list-read-more-inner">
         <div class="atk-loading-icon" style="display: none;"></div>
-        <span class="atk-text">\u67E5\u770B\u66F4\u591A</span>
+        <span class="atk-text">\u52A0\u8F7D\u66F4\u591A</span>
       </div>
     </div>`);
     this.$loading = this.$el.querySelector(".atk-loading-icon");
     this.$text = this.$el.querySelector(".atk-text");
-    this.$el.onclick = () => this.click();
+    this.$el.onclick = () => {
+      this.click();
+    };
+  }
+  get hasMore() {
+    return this.total > this.offset + this.conf.pageSize;
   }
   click() {
-    this.conf.onClick();
+    if (this.hasMore)
+      this.conf.onClick(this.offset + this.conf.pageSize);
+    this.checkDisabled();
   }
   show() {
     this.$el.style.display = "";
@@ -4902,38 +5045,43 @@ class ReadMoreBtn {
       this.$el.classList.remove("atk-err");
     }, 2e3);
   }
+  update(offset, total) {
+    this.offset = offset;
+    this.total = total;
+    this.checkDisabled();
+  }
+  checkDisabled() {
+    if (this.hasMore)
+      this.show();
+    else
+      this.hide();
+  }
 }
 class ListLite extends Component {
-  constructor(ctx, $parent) {
+  constructor(ctx) {
     super(ctx);
-    __publicField(this, "$parent");
     __publicField(this, "$commentsWrap");
     __publicField(this, "comments", []);
     __publicField(this, "data");
-    __publicField(this, "pageSize", 15);
-    __publicField(this, "offset", 0);
-    __publicField(this, "type");
-    __publicField(this, "noCommentText");
-    __publicField(this, "renderComment");
-    __publicField(this, "paramsEditor");
-    __publicField(this, "onAfterLoad");
     __publicField(this, "isLoading", false);
-    __publicField(this, "isFirstLoad", true);
-    __publicField(this, "flatMode");
+    __publicField(this, "noCommentText", "\u65E0\u5185\u5BB9");
+    __publicField(this, "flatMode", false);
     __publicField(this, "pageMode", "pagination");
+    __publicField(this, "pageSize", 20);
+    __publicField(this, "scrollListenerAt");
+    __publicField(this, "repositionAt");
     __publicField(this, "pagination");
     __publicField(this, "readMoreBtn");
     __publicField(this, "autoLoadScrollEvent");
-    __publicField(this, "autoLoadListenerAt");
+    __publicField(this, "renderComment");
+    __publicField(this, "paramsEditor");
+    __publicField(this, "onAfterLoad");
     __publicField(this, "unread", []);
-    __publicField(this, "unreadHighlight", false);
-    this.$parent = $parent;
+    __publicField(this, "unreadHighlight");
     this.$el = createElement(`<div class="atk-list-lite">
       <div class="atk-list-comments-wrap"></div>
     </div>`);
     this.$commentsWrap = this.$el.querySelector(".atk-list-comments-wrap");
-    this.pageSize = this.conf.pagination ? this.conf.pagination.pageSize || this.pageSize : this.pageSize;
-    this.noCommentText = this.conf.noComment || "\u65E0\u8BC4\u8BBA";
     window.setInterval(() => {
       this.$el.querySelectorAll("[data-atk-comment-date]").forEach((el) => {
         const date = el.getAttribute("data-atk-comment-date");
@@ -4942,11 +5090,10 @@ class ListLite extends Component {
     }, 30 * 1e3);
     this.ctx.on("unread-update", (data) => this.updateUnread(data.notifies));
   }
-  reqComments(offset = 0) {
+  fetchComments(offset) {
     return __async(this, null, function* () {
-      if (offset === 0 && this.pageMode !== "pagination") {
-        this.clearAllComments();
-      }
+      if (this.isLoading)
+        return;
       const showLoading$1 = () => {
         this.isLoading = true;
         if (offset === 0)
@@ -4967,28 +5114,23 @@ class ListLite extends Component {
       };
       showLoading$1();
       this.ctx.trigger("comments-load");
+      if (this.pageMode === "read-more" && offset === 0) {
+        this.clearAllComments();
+      }
       let listData;
       try {
-        listData = yield new Api(this.ctx).get(offset, this.type, this.flatMode, this.paramsEditor);
+        listData = yield new Api(this.ctx).get(offset, this.pageSize, this.flatMode, this.paramsEditor);
       } catch (e) {
-        this.onError(e.msg || String(e));
+        this.onError(e.msg || String(e), offset);
         throw e;
       } finally {
         hideLoading$1();
       }
-      if (this.ctx.conf.versionCheck) {
-        const needUpdate = this.apiVersionCheck(listData.api_version || {});
-        if (needUpdate)
-          return;
-      }
-      this.offset = offset;
+      setError(this.$el, null);
       try {
         this.onLoad(listData, offset);
-        if (this.onAfterLoad) {
-          this.onAfterLoad(listData);
-        }
       } catch (e) {
-        this.onError(String(e));
+        this.onError(String(e), offset);
         throw e;
       } finally {
         hideLoading$1();
@@ -4996,128 +5138,116 @@ class ListLite extends Component {
     });
   }
   onLoad(data, offset) {
-    var _a;
-    setError(this.$el, null);
     if (this.pageMode === "pagination") {
       this.clearAllComments();
     }
     this.data = data;
+    if (this.ctx.conf.versionCheck && this.versionCheck(data.api_version))
+      return;
     this.importComments(data.comments);
-    if (this.isFirstLoad) {
-      this.onLoadInit();
-    }
-    if (this.pageMode === "pagination") {
-      this.pagination.update(offset, ((_a = this.data) == null ? void 0 : _a.total_parents) || 0);
-    }
-    if (this.pageMode === "read-more") {
-      if (this.hasMoreComments)
-        this.readMoreBtn.show();
-      else
-        this.readMoreBtn.hide();
-    }
+    this.refreshPagination(offset, this.flatMode ? data.total : data.total_roots);
+    this.refreshUI();
     this.ctx.trigger("unread-update", { notifies: data.unread || [] });
-    this.isFirstLoad = false;
-  }
-  onLoadInit() {
+    this.ctx.trigger("comments-loaded");
+    if (this.onAfterLoad)
+      this.onAfterLoad(data);
+  }
+  refreshPagination(offset, total) {
+    const modePagination = this.pageMode === "pagination";
+    const modeReadMoreBtn = this.pageMode === "read-more";
+    const initialized = modePagination ? !!this.pagination : !!this.readMoreBtn;
+    if (!initialized) {
+      this.initPagination();
+    }
+    if (modePagination)
+      this.pagination.update(offset, total);
+    if (modeReadMoreBtn)
+      this.readMoreBtn.update(offset, total);
+  }
+  initPagination() {
     var _a;
-    if (this.autoLoadScrollEvent) {
-      const at = this.autoLoadListenerAt || document;
-      at.removeEventListener("scroll", this.autoLoadScrollEvent);
-    }
     if (this.pageMode === "read-more") {
-      const readMoreBtn = new ReadMoreBtn({
-        onClick: () => __async(this, null, function* () {
-          const offset = this.offset + this.pageSize;
-          yield this.reqComments(offset);
+      this.readMoreBtn = new ReadMoreBtn({
+        pageSize: this.pageSize,
+        onClick: (o) => __async(this, null, function* () {
+          yield this.fetchComments(o);
         })
       });
-      if (this.readMoreBtn)
-        this.readMoreBtn.$el.replaceWith(readMoreBtn.$el);
-      else
-        this.$el.append(readMoreBtn.$el);
-      this.readMoreBtn = readMoreBtn;
+      this.$el.append(this.readMoreBtn.$el);
       if ((_a = this.conf.pagination) == null ? void 0 : _a.autoLoad) {
+        const at = this.scrollListenerAt || document;
+        if (this.autoLoadScrollEvent)
+          at.removeEventListener("scroll", this.autoLoadScrollEvent);
         this.autoLoadScrollEvent = () => {
           if (this.pageMode !== "read-more")
             return;
-          if (!this.hasMoreComments)
+          if (!this.readMoreBtn)
+            return;
+          if (!this.readMoreBtn.hasMore)
             return;
           if (this.isLoading)
             return;
           const $target = this.$el.querySelector(".atk-list-comments-wrap > .atk-comment-wrap:nth-last-child(3)");
           if (!$target)
             return;
-          if (isVisible($target, this.autoLoadListenerAt)) {
+          if (isVisible($target, this.scrollListenerAt)) {
             this.readMoreBtn.click();
           }
         };
-        const at = this.autoLoadListenerAt || document;
         at.addEventListener("scroll", this.autoLoadScrollEvent);
       }
-    } else if (this.pageMode === "pagination") {
-      const pagination2 = new Pagination(this.parentCommentsCount, {
+    }
+    if (this.pageMode === "pagination") {
+      this.pagination = new Pagination(!this.flatMode ? this.data.total_roots : this.data.total, {
         pageSize: this.pageSize,
-        onChange: (offset) => __async(this, null, function* () {
+        onChange: (o) => __async(this, null, function* () {
           if (this.ctx.conf.editorTravel === true) {
             this.ctx.trigger("editor-travel-back");
           }
-          yield this.reqComments(offset);
-          if (this.$parent) {
-            let topPos = 0;
-            if (!this.autoLoadListenerAt && this.$parent) {
-              topPos = getOffset(this.$parent).top;
-            }
-            const at = this.autoLoadListenerAt || window;
+          yield this.fetchComments(o);
+          if (this.repositionAt) {
+            const at = this.scrollListenerAt || window;
             at.scroll({
-              top: topPos,
+              top: this.repositionAt ? getOffset(this.repositionAt).top : 0,
               left: 0
             });
           }
         })
       });
-      if (this.pagination)
-        this.pagination.$el.replaceWith(pagination2.$el);
-      else
-        this.$el.append(pagination2.$el);
-      this.pagination = pagination2;
+      this.$el.append(this.pagination.$el);
     }
   }
-  onError(msg) {
+  onError(msg, offset) {
     var _a;
     msg = String(msg);
     console.error(msg);
-    if (this.isFirstLoad || this.pageMode === "pagination") {
-      const errEl = createElement(`<span>${msg}\uFF0C\u65E0\u6CD5\u83B7\u53D6\u8BC4\u8BBA\u5217\u8868\u6570\u636E<br/></span>`);
-      const retryBtn = createElement('<span style="cursor:pointer;">\u70B9\u51FB\u91CD\u65B0\u83B7\u53D6</span>');
-      retryBtn.onclick = () => {
-        this.reqComments(this.offset);
-      };
-      errEl.appendChild(retryBtn);
-      const adminBtn = createElement('<span atk-only-admin-show> | <span style="cursor:pointer;">\u6253\u5F00\u63A7\u5236\u53F0</span></span>');
-      adminBtn.onclick = () => {
-        this.ctx.trigger("sidebar-show");
-      };
-      if (!this.ctx.user.data.isAdmin) {
-        adminBtn.classList.add("atk-hide");
-      }
-      errEl.appendChild(adminBtn);
-      setError(this.$el, errEl);
-    } else {
+    if (offset !== 0 && this.pageMode === "read-more") {
       (_a = this.readMoreBtn) == null ? void 0 : _a.showErr(`\u83B7\u53D6\u5931\u8D25`);
+      return;
     }
+    const $err = createElement(`<span>${msg}\uFF0C\u65E0\u6CD5\u83B7\u53D6\u8BC4\u8BBA\u5217\u8868\u6570\u636E<br/></span>`);
+    const $retryBtn = createElement('<span style="cursor:pointer;">\u70B9\u51FB\u91CD\u65B0\u83B7\u53D6</span>');
+    $retryBtn.onclick = () => this.fetchComments(0);
+    $err.appendChild($retryBtn);
+    const adminBtn = createElement('<span atk-only-admin-show> | <span style="cursor:pointer;">\u6253\u5F00\u63A7\u5236\u53F0</span></span>');
+    adminBtn.onclick = () => this.ctx.trigger("sidebar-show");
+    if (!this.ctx.user.data.isAdmin)
+      adminBtn.classList.add("atk-hide");
+    $err.appendChild(adminBtn);
+    setError(this.$el, $err);
   }
   refreshUI() {
-    const noComment = this.comments.length <= 0;
-    let noCommentEl = this.$commentsWrap.querySelector(".atk-list-no-comment");
-    if (noComment) {
-      if (!noCommentEl) {
-        noCommentEl = createElement('<div class="atk-list-no-comment"></div>');
-        this.$commentsWrap.appendChild(noCommentEl);
-        noCommentEl.innerHTML = this.noCommentText;
+    const isNoComment = this.comments.length <= 0;
+    let $noComment = this.$commentsWrap.querySelector(".atk-list-no-comment");
+    if (isNoComment) {
+      if (!$noComment) {
+        $noComment = createElement('<div class="atk-list-no-comment"></div>');
+        $noComment.innerHTML = this.noCommentText;
+        this.$commentsWrap.appendChild($noComment);
       }
+    } else {
+      $noComment == null ? void 0 : $noComment.remove();
     }
-    if (!noComment && noCommentEl)
-      noCommentEl.remove();
     this.ctx.trigger("check-admin-show-el");
   }
   createComment(data) {
@@ -5132,66 +5262,58 @@ class ListLite extends Component {
     };
     return comment2;
   }
-  importComments(rawData) {
-    const queryImportChildren = (parentC) => {
-      const children = rawData.filter((o) => o.rid === parentC.data.id);
-      if (children.length === 0)
-        return;
-      children.forEach((itemData) => {
-        itemData.is_allow_reply = parentC.data.is_allow_reply;
-        const childC = this.createComment(itemData);
+  importComments(srcData) {
+    if (this.flatMode) {
+      srcData.forEach((commentData) => {
+        this.putCommentFlatMode(commentData, srcData, "append");
+      });
+    } else {
+      this.importCommentsNesting(srcData);
+    }
+  }
+  importCommentsNesting(srcData) {
+    const loadChildren = (parentC) => {
+      const children = srcData.filter((o) => o.rid === parentC.data.id);
+      children.forEach((childData) => {
+        const childC = this.createComment(childData);
         childC.render();
         parentC.putChild(childC);
-        queryImportChildren(childC);
+        loadChildren(childC);
       });
     };
-    if (!this.flatMode) {
-      rawData.filter((o) => o.rid === 0).forEach((rootCommentData) => {
-        if (rootCommentData.is_collapsed)
-          rootCommentData.is_allow_reply = false;
-        const rootComment = this.createComment(rootCommentData);
-        rootComment.render();
-        this.comments.push(rootComment);
-        this.$commentsWrap.appendChild(rootComment.getEl());
-        rootComment.playFadeInAnim();
-        queryImportChildren(rootComment);
-      });
-    } else {
-      rawData.forEach((commentData) => {
-        this.putCommentFlatMode(commentData, rawData, "append");
-      });
-    }
-    this.eachComment(this.comments, (c) => {
-      if (c.getIsRoot())
-        this.checkMoreHide(c);
+    const rootComments = srcData.filter((o) => o.rid === 0);
+    rootComments.forEach((rootData) => {
+      const rootC = this.createComment(rootData);
+      rootC.render();
+      this.$commentsWrap.appendChild(rootC.getEl());
+      rootC.playFadeInAnim();
+      this.comments.push(rootC);
+      loadChildren(rootC);
+      rootC.checkHeightLimit();
     });
-    this.refreshUI();
-    this.ctx.trigger("comments-loaded");
   }
-  putCommentFlatMode(commentItem, comments, insertMode) {
-    if (commentItem.is_collapsed)
-      commentItem.is_allow_reply = false;
-    const comment2 = this.createComment(commentItem);
-    if (commentItem.rid !== 0) {
-      const rComment = comments.find((o) => o.id === commentItem.rid);
+  putCommentFlatMode(cData, srcData, insertMode) {
+    if (cData.is_collapsed)
+      cData.is_allow_reply = false;
+    const comment2 = this.createComment(cData);
+    if (cData.rid !== 0) {
+      const rComment = srcData.find((o) => o.id === cData.rid);
       if (rComment)
         comment2.replyTo = rComment;
     }
     comment2.render();
-    if (insertMode === "append") {
+    if (insertMode === "append")
       this.comments.push(comment2);
-    } else {
+    if (insertMode === "prepend")
       this.comments.unshift(comment2);
-    }
-    if (commentItem.visible) {
-      if (insertMode === "append") {
-        this.$commentsWrap.appendChild(comment2.getEl());
-      } else {
+    if (cData.visible) {
+      if (insertMode === "append")
+        this.$commentsWrap.append(comment2.getEl());
+      if (insertMode === "prepend")
         this.$commentsWrap.prepend(comment2.getEl());
-      }
       comment2.playFadeInAnim();
     }
-    this.checkMoreHide(comment2);
+    comment2.checkHeightLimit();
     return comment2;
   }
   insertComment(commentData) {
@@ -5201,18 +5323,17 @@ class ListLite extends Component {
       if (commentData.rid === 0) {
         this.$commentsWrap.prepend(comment2.getEl());
         this.comments.unshift(comment2);
-        this.checkMoreHide(comment2);
       } else {
         const parent = this.findComment(commentData.rid);
         if (parent) {
           parent.putChild(comment2);
-          if (parent.$children)
-            this.removeHideMore(parent.$children);
-          this.eachComment(parent.children, (c) => {
-            this.checkMoreHide(c);
+          comment2.getParents().forEach((p) => {
+            if (p.$children)
+              p.heightLimitRemove(p.$children);
           });
         }
       }
+      comment2.checkHeightLimit();
       scrollIntoView(comment2.getEl());
       comment2.playFadeInAnim();
     } else {
@@ -5224,92 +5345,6 @@ class ListLite extends Component {
     this.refreshUI();
     this.ctx.trigger("comments-loaded");
   }
-  checkMoreHide(c) {
-    const check = () => {
-      this.checkMoreHideEl(c, "children");
-      this.checkMoreHideEl(c, "content");
-      if (c.$replyTo)
-        this.checkMoreHideEl(c, "replyTo");
-    };
-    check();
-    if (c.$content.querySelectorAll("img").length) {
-      onImagesLoaded(c.$content, () => {
-        check();
-      });
-    }
-  }
-  checkMoreHideEl(comment2, area, allowHeight = 300) {
-    var _a, _b;
-    const childrenH = (_a = this.ctx.conf.heightLimit) == null ? void 0 : _a.children;
-    const contentH = (_b = this.ctx.conf.heightLimit) == null ? void 0 : _b.content;
-    if (area === "children" && !childrenH)
-      return;
-    if ((area === "content" || area === "replyTo") && !contentH)
-      return;
-    if (area === "children")
-      allowHeight = childrenH || 300;
-    else
-      allowHeight = contentH || 200;
-    let $target;
-    if (area === "children")
-      $target = comment2.$children;
-    else if (area === "content")
-      $target = comment2.$content;
-    else if (area === "replyTo")
-      $target = comment2.$replyTo;
-    if (!$target)
-      return;
-    let $hideMoreOpenBtn = $target.querySelector(".atk-more-hide-open-btn");
-    const removeHideMore = () => {
-      $target.classList.remove("atk-comment-more-hide");
-      if ($hideMoreOpenBtn)
-        $hideMoreOpenBtn.remove();
-      $target.style.height = "";
-      $target.style.overflow = "";
-    };
-    if (getHeight($target) > allowHeight) {
-      $target.classList.add("atk-comment-more-hide");
-      $target.style.height = `${allowHeight}px`;
-      $target.style.overflow = "hidden";
-      if (!$hideMoreOpenBtn) {
-        $hideMoreOpenBtn = createElement(`<div class="atk-more-hide-open-btn">\u9605\u8BFB\u66F4\u591A</span>`);
-        $hideMoreOpenBtn.onclick = (e) => {
-          e.stopPropagation();
-          removeHideMore();
-          if (comment2.getIsRoot()) {
-            const children = comment2.getChildren();
-            if (children.length > 1) {
-              this.eachComment(children, (c) => {
-                this.checkMoreHideEl(c, "content", contentH || 200);
-              });
-            }
-          }
-        };
-        $target.append($hideMoreOpenBtn);
-      }
-    }
-  }
-  removeHideMore($target) {
-    const $hideMoreOpenBtn = $target.querySelector(".atk-more-hide-open-btn");
-    $target.classList.remove("atk-comment-more-hide");
-    if ($hideMoreOpenBtn)
-      $hideMoreOpenBtn.remove();
-    $target.style.height = "";
-    $target.style.overflow = "";
-  }
-  get commentsCount() {
-    var _a;
-    return Number((_a = this.data) == null ? void 0 : _a.total) || 0;
-  }
-  get parentCommentsCount() {
-    var _a;
-    return Number((_a = this.data) == null ? void 0 : _a.total_parents) || 0;
-  }
-  get hasMoreComments() {
-    if (!this.data)
-      return false;
-    return (!this.flatMode ? this.data.total_parents : this.data.total) > this.offset + this.pageSize;
-  }
   eachComment(commentList, action) {
     if (commentList.length === 0)
       return;
@@ -5333,13 +5368,6 @@ class ListLite extends Component {
     });
     return comment2;
   }
-  getCommentCount() {
-    let count = 0;
-    this.eachComment(this.comments, () => {
-      count++;
-    });
-    return count;
-  }
   deleteComment(comment2) {
     let findComment;
     if (typeof comment2 === "number") {
@@ -5367,7 +5395,7 @@ class ListLite extends Component {
   }
   updateUnread(notifies) {
     this.unread = notifies;
-    if (this.unreadHighlight) {
+    if (this.unreadHighlight === true) {
       this.eachComment(this.comments, (comment2) => {
         const notify = this.unread.find((o) => o.comment_id === comment2.data.id);
         if (notify) {
@@ -5385,16 +5413,16 @@ class ListLite extends Component {
       });
     }
   }
-  apiVersionCheck(versionData) {
+  versionCheck(versionData) {
     const needVersion = (versionData == null ? void 0 : versionData.fe_min_version) || "0.0.0";
-    const needUpdate = versionCompare(needVersion, "2.1.3") === 1;
+    const needUpdate = versionCompare(needVersion, "2.1.6") === 1;
     if (needUpdate) {
-      const errEl = createElement(`<div>\u524D\u7AEF Artalk \u7248\u672C\u5DF2\u8FC7\u65F6\uFF0C\u8BF7\u66F4\u65B0\u4EE5\u83B7\u5F97\u5B8C\u6574\u4F53\u9A8C<br/>\u82E5\u60A8\u662F\u7AD9\u70B9\u7BA1\u7406\u5458\uFF0C\u8BF7\u524D\u5F80 \u201C<a href="https://artalk.js.org/" target="_blank">\u5B98\u65B9\u6587\u6863</a>\u201D \u83B7\u53D6\u5E2E\u52A9<br/><br/><span style="color: var(--at-color-meta);">\u524D\u7AEF\u7248\u672C ${"2.1.3"}\uFF0C\u9700\u6C42\u7248\u672C >= ${needVersion}</span><br/><br/></div>`);
+      const errEl = createElement(`<div>\u524D\u7AEF Artalk \u7248\u672C\u5DF2\u8FC7\u65F6\uFF0C\u8BF7\u66F4\u65B0\u4EE5\u83B7\u5F97\u5B8C\u6574\u4F53\u9A8C<br/>\u82E5\u60A8\u662F\u7AD9\u70B9\u7BA1\u7406\u5458\uFF0C\u8BF7\u524D\u5F80 \u201C<a href="https://artalk.js.org/" target="_blank">\u5B98\u65B9\u6587\u6863</a>\u201D \u83B7\u53D6\u5E2E\u52A9<br/><br/><span style="color: var(--at-color-meta);">\u524D\u7AEF\u7248\u672C ${"2.1.6"}\uFF0C\u9700\u6C42\u7248\u672C >= ${needVersion}</span><br/><br/></div>`);
       const ignoreBtn = createElement('<span style="cursor:pointer;">\u5FFD\u7565</span>');
       ignoreBtn.onclick = () => {
         setError(this.ctx, null);
         this.ctx.conf.versionCheck = false;
-        this.reqComments(0);
+        this.fetchComments(0);
       };
       errEl.append(ignoreBtn);
       setError(this.ctx, errEl, '<span class="atk-warn-title">Artalk Warn</span>');
@@ -5404,9 +5432,9 @@ class ListLite extends Component {
 }
 class List extends ListLite {
   constructor(ctx) {
-    var _a;
+    var _a, _b;
     const el = createElement(ListHTML);
-    super(ctx, el);
+    super(ctx);
     __publicField(this, "$closeCommentBtn");
     __publicField(this, "$openSidebarBtn");
     __publicField(this, "$unreadBadge");
@@ -5421,9 +5449,11 @@ class List extends ListLite {
     }
     this.flatMode = flatMode;
     this.pageMode = ((_a = this.conf.pagination) == null ? void 0 : _a.readMore) ? "read-more" : "pagination";
+    this.pageSize = ((_b = this.conf.pagination) == null ? void 0 : _b.pageSize) || 20;
+    this.repositionAt = this.$el;
     this.initListActionBtn();
-    this.$el.querySelector(".atk-copyright").innerHTML = `Powered By <a href="https://artalk.js.org" target="_blank" title="Artalk v${"2.1.3"}">Artalk</a>`;
-    this.ctx.on("list-reload", () => this.reqComments(0));
+    this.$el.querySelector(".atk-copyright").innerHTML = `Powered By <a href="https://artalk.js.org" target="_blank" title="Artalk v${"2.1.6"}">Artalk</a>`;
+    this.ctx.on("list-reload", () => this.fetchComments(0));
     this.ctx.on("list-refresh-ui", () => this.refreshUI());
     this.ctx.on("list-import", (data) => this.importComments(data));
     this.ctx.on("list-insert", (data) => this.insertComment(data));
@@ -5452,15 +5482,16 @@ class List extends ListLite {
     });
   }
   refreshUI() {
+    var _a;
     super.refreshUI();
-    this.$el.querySelector(".atk-comment-count-num").innerText = String(this.commentsCount);
+    this.$el.querySelector(".atk-comment-count-num").innerText = String(Number((_a = this.data) == null ? void 0 : _a.total) || 0);
     if (!!this.ctx.user.data.nick && !!this.ctx.user.data.email) {
       this.$openSidebarBtn.classList.remove("atk-hide");
     } else {
       this.$openSidebarBtn.classList.add("atk-hide");
     }
     this.ctx.trigger("check-admin-show-el");
-    this.$openSidebarBtn.innerText = !this.ctx.user.data.isAdmin ? "\u901A\u77E5\u4E2D\u5FC3" : "\u63A7\u5236\u4E2D\u5FC3";
+    this.$openSidebarBtn.querySelector(".atk-text").innerText = !this.ctx.user.data.isAdmin ? "\u901A\u77E5\u4E2D\u5FC3" : "\u63A7\u5236\u4E2D\u5FC3";
     if (!!this.data && !!this.data.page && this.data.page.admin_only === true) {
       this.ctx.trigger("editor-close");
       this.$closeCommentBtn.innerHTML = "\u6253\u5F00\u8BC4\u8BBA";
@@ -5525,1036 +5556,22 @@ class List extends ListLite {
     }
   }
 }
-var sidebar = "";
-var MD5 = function(d) {
-  var r = M(V(Y(X(d), 8 * d.length)));
-  return r.toLowerCase();
-};
-function M(d) {
-  for (var _, m = "0123456789ABCDEF", f = "", r = 0; r < d.length; r++)
-    _ = d.charCodeAt(r), f += m.charAt(_ >>> 4 & 15) + m.charAt(15 & _);
-  return f;
-}
-function X(d) {
-  for (var _ = Array(d.length >> 2), m = 0; m < _.length; m++)
-    _[m] = 0;
-  for (m = 0; m < 8 * d.length; m += 8)
-    _[m >> 5] |= (255 & d.charCodeAt(m / 8)) << m % 32;
-  return _;
-}
-function V(d) {
-  for (var _ = "", m = 0; m < 32 * d.length; m += 8)
-    _ += String.fromCharCode(d[m >> 5] >>> m % 32 & 255);
-  return _;
-}
-function Y(d, _) {
-  d[_ >> 5] |= 128 << _ % 32, d[14 + (_ + 64 >>> 9 << 4)] = _;
-  for (var m = 1732584193, f = -271733879, r = -1732584194, i = 271733878, n = 0; n < d.length; n += 16) {
-    var h = m, t = f, g = r, e = i;
-    f = md5_ii(f = md5_ii(f = md5_ii(f = md5_ii(f = md5_hh(f = md5_hh(f = md5_hh(f = md5_hh(f = md5_gg(f = md5_gg(f = md5_gg(f = md5_gg(f = md5_ff(f = md5_ff(f = md5_ff(f = md5_ff(f, r = md5_ff(r, i = md5_ff(i, m = md5_ff(m, f, r, i, d[n + 0], 7, -680876936), f, r, d[n + 1], 12, -389564586), m, f, d[n + 2], 17, 606105819), i, m, d[n + 3], 22, -1044525330), r = md5_ff(r, i = md5_ff(i, m = md5_ff(m, f, r, i, d[n + 4], 7, -176418897), f, r, d[n + 5], 12, 1200080426), m, f, d[n + 6], 17, -1473231341), i, m, d[n + 7], 22, -45705983), r = md5_ff(r, i = md5_ff(i, m = md5_ff(m, f, r, i, d[n + 8], 7, 1770035416), f, r, d[n + 9], 12, -1958414417), m, f, d[n + 10], 17, -42063), i, m, d[n + 11], 22, -1990404162), r = md5_ff(r, i = md5_ff(i, m = md5_ff(m, f, r, i, d[n + 12], 7, 1804603682), f, r, d[n + 13], 12, -40341101), m, f, d[n + 14], 17, -1502002290), i, m, d[n + 15], 22, 1236535329), r = md5_gg(r, i = md5_gg(i, m = md5_gg(m, f, r, i, d[n + 1], 5, -165796510), f, r, d[n + 6], 9, -1069501632), m, f, d[n + 11], 14, 643717713), i, m, d[n + 0], 20, -373897302), r = md5_gg(r, i = md5_gg(i, m = md5_gg(m, f, r, i, d[n + 5], 5, -701558691), f, r, d[n + 10], 9, 38016083), m, f, d[n + 15], 14, -660478335), i, m, d[n + 4], 20, -405537848), r = md5_gg(r, i = md5_gg(i, m = md5_gg(m, f, r, i, d[n + 9], 5, 568446438), f, r, d[n + 14], 9, -1019803690), m, f, d[n + 3], 14, -187363961), i, m, d[n + 8], 20, 1163531501), r = md5_gg(r, i = md5_gg(i, m = md5_gg(m, f, r, i, d[n + 13], 5, -1444681467), f, r, d[n + 2], 9, -51403784), m, f, d[n + 7], 14, 1735328473), i, m, d[n + 12], 20, -1926607734), r = md5_hh(r, i = md5_hh(i, m = md5_hh(m, f, r, i, d[n + 5], 4, -378558), f, r, d[n + 8], 11, -2022574463), m, f, d[n + 11], 16, 1839030562), i, m, d[n + 14], 23, -35309556), r = md5_hh(r, i = md5_hh(i, m = md5_hh(m, f, r, i, d[n + 1], 4, -1530992060), f, r, d[n + 4], 11, 1272893353), m, f, d[n + 7], 16, -155497632), i, m, d[n + 10], 23, -1094730640), r = md5_hh(r, i = md5_hh(i, m = md5_hh(m, f, r, i, d[n + 13], 4, 681279174), f, r, d[n + 0], 11, -358537222), m, f, d[n + 3], 16, -722521979), i, m, d[n + 6], 23, 76029189), r = md5_hh(r, i = md5_hh(i, m = md5_hh(m, f, r, i, d[n + 9], 4, -640364487), f, r, d[n + 12], 11, -421815835), m, f, d[n + 15], 16, 530742520), i, m, d[n + 2], 23, -995338651), r = md5_ii(r, i = md5_ii(i, m = md5_ii(m, f, r, i, d[n + 0], 6, -198630844), f, r, d[n + 7], 10, 1126891415), m, f, d[n + 14], 15, -1416354905), i, m, d[n + 5], 21, -57434055), r = md5_ii(r, i = md5_ii(i, m = md5_ii(m, f, r, i, d[n + 12], 6, 1700485571), f, r, d[n + 3], 10, -1894986606), m, f, d[n + 10], 15, -1051523), i, m, d[n + 1], 21, -2054922799), r = md5_ii(r, i = md5_ii(i, m = md5_ii(m, f, r, i, d[n + 8], 6, 1873313359), f, r, d[n + 15], 10, -30611744), m, f, d[n + 6], 15, -1560198380), i, m, d[n + 13], 21, 1309151649), r = md5_ii(r, i = md5_ii(i, m = md5_ii(m, f, r, i, d[n + 4], 6, -145523070), f, r, d[n + 11], 10, -1120210379), m, f, d[n + 2], 15, 718787259), i, m, d[n + 9], 21, -343485551), m = safe_add(m, h), f = safe_add(f, t), r = safe_add(r, g), i = safe_add(i, e);
-  }
-  return Array(m, f, r, i);
-}
-function md5_cmn(d, _, m, f, r, i) {
-  return safe_add(bit_rol(safe_add(safe_add(_, d), safe_add(f, i)), r), m);
-}
-function md5_ff(d, _, m, f, r, i, n) {
-  return md5_cmn(_ & m | ~_ & f, d, _, r, i, n);
-}
-function md5_gg(d, _, m, f, r, i, n) {
-  return md5_cmn(_ & f | m & ~f, d, _, r, i, n);
-}
-function md5_hh(d, _, m, f, r, i, n) {
-  return md5_cmn(_ ^ m ^ f, d, _, r, i, n);
-}
-function md5_ii(d, _, m, f, r, i, n) {
-  return md5_cmn(m ^ (_ | ~f), d, _, r, i, n);
-}
-function safe_add(d, _) {
-  var m = (65535 & d) + (65535 & _);
-  return (d >> 16) + (_ >> 16) + (m >> 16) << 16 | 65535 & m;
-}
-function bit_rol(d, _) {
-  return d << _ | d >>> 32 - _;
-}
-var SidebarHTML = '<div class="atk-sidebar">\n  <div class="atk-sidebar-inner">\n    <div class="atk-sidebar-header">\n      <span class="atk-avatar">\n        <span class="atk-site-logo"></span>\n      </span>\n      <span class="atk-menu">\n        <span class="atk-item atk-active atk-sidebar-title">\u63A7\u5236\u4E2D\u5FC3</span>\n      </span>\n      <div class="atk-sidebar-close"><i class="atk-icon atk-icon-close"></i></div>\n    </div>\n    <div class="atk-sidebar-nav">\n      <div class="akt-curt-view-btn">\n        <div class="atk-icon"><span></span><span></span><span></span></div>\n        <div class="atk-text"></div>\n      </div>\n      <div class="atk-tabs"></div>\n      <div class="atk-tabs atk-views" style="display: none;"></div>\n    </div>\n    <div class="atk-sidebar-view-wrap"></div>\n  </div>\n</div>\n';
-class SidebarView extends Component {
-  constructor(ctx, $parent) {
-    super(ctx);
-    __publicField(this, "viewTabs", {});
-    __publicField(this, "viewActiveTab", "");
-    __publicField(this, "$parent");
-    this.$parent = $parent;
-    this.$el = createElement(`<div class="atk-sidebar-view"></div>`);
-  }
-  mount(siteName) {
-  }
-  switchTab(tab, siteName) {
-  }
-}
-__publicField(SidebarView, "viewName", "");
-__publicField(SidebarView, "viewTitle", "");
-__publicField(SidebarView, "viewAdminOnly", false);
-class MessageView extends SidebarView {
-  constructor() {
-    super(...arguments);
-    __publicField(this, "viewTabs", {});
-    __publicField(this, "viewActiveTab", "");
-    __publicField(this, "list");
-  }
-  mount(siteName) {
-    if (this.ctx.user.data.isAdmin) {
-      this.viewTabs = {
-        admin_all: "\u5168\u90E8",
-        admin_pending: "\u5F85\u5BA1",
-        all: "\u4E2A\u4EBA"
-      };
-      this.viewActiveTab = "admin_all";
-    } else {
-      this.viewTabs = {
-        mentions: "\u63D0\u53CA",
-        all: "\u5168\u90E8",
-        mine: "\u6211\u7684",
-        pending: "\u5F85\u5BA1"
-      };
-      this.viewActiveTab = "mentions";
-    }
-    this.list = new ListLite(this.ctx, this.$el);
-    this.list.flatMode = true;
-    this.list.unreadHighlight = true;
-    this.list.autoLoadListenerAt = this.$parent;
-    this.list.pageMode = "pagination";
-    this.list.noCommentText = '<div class="atk-sidebar-no-content">\u65E0\u5185\u5BB9</div>';
-    this.list.renderComment = (comment2) => {
-      comment2.setOpenURL(`${comment2.data.page_key}#atk-comment-${comment2.data.id}`);
-      comment2.onReplyBtnClick = () => {
-        if (this.ctx.conf.editorTravel === true) {
-          this.ctx.trigger("editor-reply", { data: comment2.data, $el: comment2.$el, scroll: false });
-        } else {
-          this.ctx.trigger("sidebar-hide");
-          this.ctx.trigger("editor-reply", { data: comment2.data, $el: comment2.$el, scroll: true });
-        }
-      };
-    };
-    this.list.paramsEditor = (params) => {
-      params.site_name = siteName;
-    };
-    this.$el.innerHTML = "";
-    this.$el.append(this.list.$el);
-    this.switchTab(this.viewActiveTab, siteName);
-  }
-  switchTab(tab, siteName) {
-    this.viewActiveTab = tab;
-    this.list.type = tab;
-    this.list.isFirstLoad = true;
-    this.list.paramsEditor = (params) => {
-      params.site_name = siteName;
-    };
-    this.list.reqComments();
-    return true;
-  }
-}
-__publicField(MessageView, "viewName", "comments");
-__publicField(MessageView, "viewTitle", "\u8BC4\u8BBA");
-var pageList = "";
-var itemTextEditor = "";
-class ItemTextEditor {
-  constructor(conf) {
-    __publicField(this, "conf");
-    __publicField(this, "$el");
-    __publicField(this, "$input");
-    __publicField(this, "$yesBtn");
-    __publicField(this, "$noBtn");
-    __publicField(this, "value", "");
-    __publicField(this, "allowSubmit", true);
-    this.conf = conf;
-    this.$el = createElement(`<div class="atk-item-text-editor-layer">
-      <div class="atk-edit-form">
-        <input class="atk-main-input" type="text" placeholder="\u8F93\u5165\u5185\u5BB9..." autocomplete="off" autofocus>
-      </div>
-      <div class="atk-actions">
-        <div class="atk-item atk-yes-btn">
-          <i class="atk-icon atk-icon-yes"></i>
-        </div>
-        <div class="atk-item atk-no-btn">
-          <i class="atk-icon atk-icon-no"></i>
-        </div>
-      </div>
-    </div>`);
-    this.$input = this.$el.querySelector(".atk-main-input");
-    this.$yesBtn = this.$el.querySelector(".atk-yes-btn");
-    this.$noBtn = this.$el.querySelector(".atk-no-btn");
-    this.$input.value = conf.initValue || "";
-    this.value = conf.initValue || "";
-    if (this.conf.placeholder)
-      this.$input.placeholder = this.conf.placeholder;
-    this.$input.oninput = () => this.onInput();
-    this.$input.onkeyup = (evt) => {
-      if (evt.key === "Enter" || evt.keyCode === 13) {
-        evt.preventDefault();
-        this.submit();
-      }
-    };
-    window.setTimeout(() => this.$input.focus(), 80);
-    this.$yesBtn.onclick = () => {
-      this.submit();
-    };
-    this.$noBtn.onclick = () => {
-      this.cancel();
-    };
-  }
-  appendTo(parentDOM) {
-    parentDOM.append(this.$el);
-    return this;
-  }
-  onInput() {
-    this.value = this.$input.value;
-    if (this.conf.validator) {
-      const ok = this.conf.validator(this.value);
-      this.setAllowSubmit(ok);
-      if (!ok) {
-        this.$input.classList.add("atk-invalid");
-      } else {
-        this.$input.classList.remove("atk-invalid");
-      }
-    }
-  }
-  setAllowSubmit(allow) {
-    if (this.allowSubmit === allow)
-      return;
-    this.allowSubmit = allow;
-    if (!allow) {
-      this.$yesBtn.classList.add(".atk-disabled");
-    } else {
-      this.$yesBtn.classList.remove(".atk-disabled");
-    }
-  }
-  submit() {
-    return __async(this, null, function* () {
-      if (!this.allowSubmit)
-        return;
-      if (this.conf.onYes) {
-        let isContinue;
-        if (this.conf.onYes instanceof (() => __async(this, null, function* () {
-        })).constructor) {
-          isContinue = yield this.conf.onYes(this.value);
-        } else {
-          isContinue = this.conf.onYes(this.value);
-        }
-        if (isContinue === void 0 || isContinue === true) {
-          this.closeEditor();
-        }
-      } else {
-        this.closeEditor();
-      }
-    });
-  }
-  cancel() {
-    return __async(this, null, function* () {
-      if (this.conf.onNo) {
-        let isContinue;
-        if (this.conf.onNo instanceof (() => __async(this, null, function* () {
-        })).constructor) {
-          isContinue = yield this.conf.onNo();
-        } else {
-          isContinue = this.conf.onNo();
-        }
-        if (isContinue === void 0 || isContinue === true) {
-          this.closeEditor();
-        }
-      } else {
-        this.closeEditor();
-      }
-    });
-  }
-  closeEditor() {
-    this.$el.remove();
-  }
-}
-class PageList extends Component {
-  constructor(ctx) {
-    super(ctx);
-    __publicField(this, "$editor");
-    __publicField(this, "$inputer");
-    __publicField(this, "pages", []);
-    this.$el = createElement(`<div class="atk-page-list"></div>`);
-  }
-  clearAll() {
-    this.pages = [];
-    this.$el.innerHTML = "";
-  }
-  importPages(pages) {
-    this.pages.push(...pages);
-    pages.forEach((page) => {
-      const $page = this.renderPage(page);
-      this.$el.append($page);
-    });
-  }
-  renderPage(page) {
-    const $page = createElement(`<div class="atk-page-item">
-        <div class="atk-page-main">
-          <div class="atk-title"></div>
-          <div class="atk-sub"></div>
-        </div>
-        <div class="atk-page-actions">
-          <div class="atk-item atk-edit-btn">
-            <i class="atk-icon atk-icon-edit"></i>
-          </div>
-        </div>
-      </div>`);
-    const $main = $page.querySelector(".atk-page-main");
-    const $title = $main.querySelector(".atk-title");
-    const $sub = $main.querySelector(".atk-sub");
-    const $editBtn = $page.querySelector(".atk-edit-btn");
-    $title.innerText = page.title;
-    $sub.innerText = page.url || page.key;
-    $editBtn.onclick = () => this.showEditor(page, $page);
-    return $page;
-  }
-  showEditor(page, $page) {
-    this.closeEditor();
-    this.$editor = createElement(`<div class="atk-page-edit-layer">
-      <div class="atk-page-main-actions">
-        <div class="atk-item atk-title-edit-btn">\u6807\u9898\u4FEE\u6539</div>
-        <div class="atk-item atk-key-edit-btn">KEY \u53D8\u66F4</div>
-        <div class="atk-item atk-admin-only-btn"></div>
-      </div>
-      <div class="atk-page-actions">
-        <div class="atk-item atk-sync-btn">
-          <i class="atk-icon atk-icon-sync"></i>
-        </div>
-        <div class="atk-item atk-del-btn">
-          <i class="atk-icon atk-icon-del"></i>
-        </div>
-        <div class="atk-item atk-close-btn">
-          <i class="atk-icon atk-icon-close"></i>
-        </div>
-      </div>
-    </div>`);
-    $page.prepend(this.$editor);
-    const $titleEditBtn = this.$editor.querySelector(".atk-title-edit-btn");
-    const $keyEditBtn = this.$editor.querySelector(".atk-key-edit-btn");
-    const $adminOnlyBtn = this.$editor.querySelector(".atk-admin-only-btn");
-    const $syncBtn = this.$editor.querySelector(".atk-sync-btn");
-    const $delBtn = this.$editor.querySelector(".atk-del-btn");
-    const $closeBtn = this.$editor.querySelector(".atk-close-btn");
-    const showLoading$1 = () => {
-      showLoading(this.$editor);
-    };
-    const hideLoading$1 = () => {
-      hideLoading(this.$editor);
-    };
-    const showError = (msg) => {
-      window.alert(msg);
-    };
-    $closeBtn.onclick = () => this.closeEditor();
-    const openTextEditor = (key) => {
-      const textEditor = new ItemTextEditor({
-        initValue: page[key] || "",
-        onYes: (val) => __async(this, null, function* () {
-          showLoading(textEditor.$el);
-          let p;
-          try {
-            p = yield new Api(this.ctx).pageEdit(__spreadProps(__spreadValues({}, page), { [key]: val }));
-          } catch (err) {
-            showError(`\u4FEE\u6539\u5931\u8D25\uFF1A${err.msg || "\u672A\u77E5\u9519\u8BEF"}`);
-            console.error(err);
-            return false;
-          } finally {
-            hideLoading(textEditor.$el);
-          }
-          $page.replaceWith(this.renderPage(p));
-          return true;
-        })
-      });
-      textEditor.appendTo(this.$editor);
-    };
-    $titleEditBtn.onclick = () => openTextEditor("title");
-    $keyEditBtn.onclick = () => openTextEditor("key");
-    const adminOnlyActionBtn = new ActionBtn({
-      text: () => {
-        $adminOnlyBtn.classList.remove("atk-green", "atk-yellow");
-        $adminOnlyBtn.classList.add(!page.admin_only ? "atk-green" : "atk-yellow");
-        return !page.admin_only ? "\u6240\u6709\u4EBA\u53EF\u8BC4" : "\u7BA1\u7406\u5458\u53EF\u8BC4";
-      }
-    }).appendTo($adminOnlyBtn);
-    $adminOnlyBtn.onclick = () => __async(this, null, function* () {
-      showLoading$1();
-      let p;
-      try {
-        p = yield new Api(this.ctx).pageEdit(__spreadProps(__spreadValues({}, page), { admin_only: !page.admin_only }));
-      } catch (err) {
-        showError(`\u4FEE\u6539\u5931\u8D25\uFF1A${err.msg || "\u672A\u77E5\u9519\u8BEF"}`);
-        console.log(err);
-        return;
-      } finally {
-        hideLoading$1();
-      }
-      page.admin_only = p.admin_only;
-      adminOnlyActionBtn.updateText();
-    });
-    $syncBtn.onclick = () => __async(this, null, function* () {
-      showLoading$1();
-      let p;
-      try {
-        p = yield new Api(this.ctx).pageFetch(page.id);
-      } catch (err) {
-        showError(`\u540C\u6B65\u5931\u8D25\uFF1A${err.msg || "\u672A\u77E5\u9519\u8BEF"}`);
-        console.log(err);
-        return;
-      } finally {
-        hideLoading$1();
-      }
-      $page.replaceWith(this.renderPage(p));
-    });
-    $delBtn.onclick = () => {
-      const del = () => __async(this, null, function* () {
-        showLoading$1();
-        try {
-          yield new Api(this.ctx).pageDel(page.key, page.site_name);
-        } catch (err) {
-          console.log(err);
-          showError(`\u5220\u9664\u5931\u8D25 ${String(err)}`);
-          return;
-        } finally {
-          hideLoading$1();
-        }
-        $page.remove();
-      });
-      if (window.confirm(`\u786E\u8BA4\u5220\u9664\u9875\u9762 "${page.title || page.key}"\uFF1F\u5C06\u4F1A\u5220\u9664\u6240\u6709\u76F8\u5173\u6570\u636E`))
-        del();
-    };
-  }
-  closeEditor() {
-    if (!this.$editor)
-      return;
-    this.$editor.remove();
-  }
-}
-const PAGE_SIZE = 20;
-class PagesView extends SidebarView {
-  constructor() {
-    super(...arguments);
-    __publicField(this, "viewTabs", {});
-    __publicField(this, "viewActiveTab", "");
-    __publicField(this, "pageList");
-    __publicField(this, "pagination");
-  }
-  mount(siteName) {
-    if (!this.pageList) {
-      this.pageList = new PageList(this.ctx);
-      this.$el.append(this.pageList.$el);
-    }
-    this.switchTab(this.viewActiveTab, siteName);
-  }
-  switchTab(tab, siteName) {
-    this.reqPages(siteName, 0);
-  }
-  reqPages(siteName, offset) {
-    return __async(this, null, function* () {
-      var _a;
-      this.pageList.clearAll();
-      (_a = this.$el.parentNode) == null ? void 0 : _a.scrollTo(0, 0);
-      showLoading(this.$el);
-      const data = yield new Api(this.ctx).pageGet(siteName, offset, PAGE_SIZE);
-      this.pageList.importPages(data.pages || []);
-      hideLoading(this.$el);
-      if (!this.pagination) {
-        this.pagination = new Pagination(data.total, {
-          pageSize: PAGE_SIZE,
-          onChange: (o) => {
-            this.reqPages(siteName, o);
-          }
-        });
-        this.$el.append(this.pagination.$el);
-      }
-      if (this.pagination && offset === 0)
-        this.pagination.update(offset, data.total);
-    });
-  }
-}
-__publicField(PagesView, "viewName", "pages");
-__publicField(PagesView, "viewTitle", "\u9875\u9762");
-__publicField(PagesView, "viewAdminOnly", true);
-var siteList = "";
-class SiteList extends Component {
-  constructor(ctx) {
-    super(ctx);
-    __publicField(this, "sites", []);
-    __publicField(this, "$header");
-    __publicField(this, "$headerTitle");
-    __publicField(this, "$headerActions");
-    __publicField(this, "$rowsWrap");
-    __publicField(this, "$editor");
-    __publicField(this, "activeSite", "");
-    __publicField(this, "$add");
-    this.$el = createElement(`<div class="atk-site-list">
-      <div class="atk-header">
-        <div class="atk-title"></div>
-        <div class="atk-actions">
-          <div class="atk-item atk-site-add-btn"><i class="atk-icon atk-icon-plus"></i></div>
-        </div>
-      </div>
-      <div class="atk-site-rows-wrap"></div>
-    </div>`);
-    this.$header = this.$el.querySelector(".atk-header");
-    this.$headerTitle = this.$header.querySelector(".atk-title");
-    this.$headerActions = this.$header.querySelector(".atk-actions");
-    this.$rowsWrap = this.$el.querySelector(".atk-site-rows-wrap");
-    this.$headerTitle.innerText = `\u5171 0 \u4E2A\u7AD9\u70B9`;
-    const $addBtn = this.$headerActions.querySelector(".atk-site-add-btn");
-    $addBtn.onclick = () => {
-      this.closeEditor();
-      this.showAdd();
-    };
-  }
-  loadSites(sites) {
-    this.sites = sites;
-    this.activeSite = "";
-    this.$rowsWrap.innerHTML = "";
-    this.$headerTitle.innerText = `\u5171 0 \u4E2A\u7AD9\u70B9`;
-    let $row;
-    for (let i = 0; i < sites.length; i++) {
-      const site = sites[i];
-      if (i % 4 === 0) {
-        $row = createElement('<div class="atk-site-row">');
-        this.$rowsWrap.append($row);
-      }
-      const $site = this.renderSite(site, $row);
-      $row.append($site);
-    }
-    this.$headerTitle.innerText = `\u5171 ${sites.length} \u4E2A\u7AD9\u70B9`;
-  }
-  renderSite(site, $row) {
-    const $site = createElement(`<div class="atk-site-item">
-        <div class="atk-site-logo"></div>
-        <div class="atk-site-name"></div>
-      </div>`);
-    const $siteLogo = $site.querySelector(".atk-site-logo");
-    const $siteName = $site.querySelector(".atk-site-name");
-    const setActive = () => {
-      $site.classList.add("atk-active");
-    };
-    $siteLogo.innerText = site.name.substr(0, 1);
-    $siteName.innerText = site.name;
-    $site.onclick = () => {
-      this.closeEditor();
-      this.closeAdd();
-      setActive();
-      this.showEditor(site, $site, $row);
-    };
-    if (this.activeSite === site.name) {
-      setActive();
-    }
-    return $site;
-  }
-  showEditor(site, $site, $row) {
-    this.activeSite = site.name;
-    this.$editor = createElement(`
-    <div class="atk-site-edit">
-    <div class="atk-header">
-      <div class="atk-site-info">
-        <span class="atk-site-name"></span>
-        <span class="atk-site-urls"></span>
-      </div>
-      <div class="atk-close-btn">
-        <i class="atk-icon atk-icon-close"></i>
-      </div>
-    </div>
-    <div class="atk-main">
-      <div class="atk-site-text-actions">
-        <div class="atk-item atk-rename-btn">\u91CD\u547D\u540D</div>
-        <div class="atk-item atk-edit-url-btn">\u4FEE\u6539 URL</div>
-        <!--<div class="atk-item atk-export-btn">\u5BFC\u51FA</div>
-        <div class="atk-item atk-import-btn">\u5BFC\u5165</div>-->
-      </div>
-      <div class="atk-site-btn-actions">
-        <div class="atk-item atk-del-btn">
-          <i class="atk-icon atk-icon-del"></i>
-        </div>
-      </div>
-    </div>
-    </div>`);
-    $row.before(this.$editor);
-    const $siteName = this.$editor.querySelector(".atk-site-name");
-    const $siteUrls = this.$editor.querySelector(".atk-site-urls");
-    const $closeBtn = this.$editor.querySelector(".atk-close-btn");
-    $closeBtn.onclick = () => this.closeEditor();
-    const update = (s) => {
-      var _a;
-      site = s;
-      $siteName.innerText = site.name;
-      $siteName.onclick = () => {
-        if (site.first_url)
-          window.open(site.first_url);
-      };
-      $siteUrls.innerHTML = "";
-      (_a = site.urls) == null ? void 0 : _a.forEach((u) => {
-        const $item = createElement('<span class="atk-url-item"></span>');
-        $siteUrls.append($item);
-        $item.innerText = (u || "").replace(/\/$/, "");
-        $item.onclick = () => {
-          window.open(u);
-        };
-      });
-    };
-    update(site);
-    const $main = this.$editor.querySelector(".atk-main");
-    const $actions = this.$editor.querySelector(".atk-site-text-actions");
-    const $renameBtn = $actions.querySelector(".atk-rename-btn");
-    const $editUrlBtn = $actions.querySelector(".atk-edit-url-btn");
-    const $delBtn = this.$editor.querySelector(".atk-del-btn");
-    const showLoading$1 = () => {
-      showLoading(this.$editor);
-    };
-    const hideLoading$1 = () => {
-      hideLoading(this.$editor);
-    };
-    const showError = (msg) => {
-      window.alert(msg);
-    };
-    const openTextEditor = (key) => {
-      let initValue = site[key] || "";
-      if (key === "urls")
-        initValue = site.urls_raw || "";
-      const textEditor = new ItemTextEditor({
-        initValue,
-        onYes: (val) => __async(this, null, function* () {
-          showLoading(textEditor.$el);
-          let s;
-          try {
-            s = yield new Api(this.ctx).siteEdit(__spreadProps(__spreadValues({}, site), { [key]: val }));
-          } catch (err) {
-            showError(`\u4FEE\u6539\u5931\u8D25\uFF1A${err.msg || "\u672A\u77E5\u9519\u8BEF"}`);
-            console.error(err);
-            return false;
-          } finally {
-            hideLoading(textEditor.$el);
-          }
-          $site.replaceWith(this.renderSite(s, $row));
-          update(s);
-          return true;
-        })
-      });
-      textEditor.appendTo($main);
-    };
-    $renameBtn.onclick = () => openTextEditor("name");
-    $editUrlBtn.onclick = () => openTextEditor("urls");
-    $delBtn.onclick = () => {
-      const del = () => __async(this, null, function* () {
-        showLoading$1();
-        try {
-          yield new Api(this.ctx).siteDel(site.id, true);
-        } catch (err) {
-          console.log(err);
-          showError(`\u5220\u9664\u5931\u8D25 ${String(err)}`);
-          return;
-        } finally {
-          hideLoading$1();
-        }
-        this.closeEditor();
-        $site.remove();
-        this.sites = this.sites.filter((s) => s.name !== site.name);
-      });
-      if (window.confirm(`\u786E\u8BA4\u5220\u9664\u7AD9\u70B9 "${site.name}"\uFF1F\u5C06\u4F1A\u5220\u9664\u6240\u6709\u76F8\u5173\u6570\u636E`))
-        del();
-    };
-  }
-  closeEditor() {
-    if (!this.$editor)
-      return;
-    this.$editor.remove();
-    this.$rowsWrap.querySelectorAll(".atk-site-item").forEach((e) => e.classList.remove("atk-active"));
-    this.activeSite = "";
-  }
-  showAdd() {
-    this.closeAdd();
-    this.$add = createElement(`
-    <div class="atk-site-add">
-    <div class="atk-header">
-      <div class="atk-title">\u65B0\u589E\u7AD9\u70B9</div>
-      <div class="atk-close-btn">
-        <i class="atk-icon atk-icon-close"></i>
-      </div>
-    </div>
-    <div class="atk-form">
-      <input type="text" name="AtkSiteName" placeholder="\u7AD9\u70B9\u540D\u79F0" autocomplete="off">
-      <input type="text" name="AtkSiteUrls" placeholder="\u7AD9\u70B9 URL\uFF08\u591A\u4E2A\u7528\u9017\u53F7\u9694\u5F00\uFF09" autocomplete="off">
-      <button class="atk-btn" name="AtkSubmit">\u521B\u5EFA</button>
-    </div>
-    </div>`);
-    this.$header.after(this.$add);
-    const $closeBtn = this.$add.querySelector(".atk-close-btn");
-    $closeBtn.onclick = () => this.closeAdd();
-    const $siteName = this.$add.querySelector('[name="AtkSiteName"]');
-    const $siteUrls = this.$add.querySelector('[name="AtkSiteUrls"]');
-    const $submitBtn = this.$add.querySelector('[name="AtkSubmit"]');
-    $submitBtn.onclick = () => __async(this, null, function* () {
-      const siteName = $siteName.value.trim();
-      const siteUrls = $siteUrls.value.trim();
-      if (siteName === "") {
-        $siteName.focus();
-        return;
-      }
-      showLoading(this.$add);
-      let s;
-      try {
-        s = yield new Api(this.ctx).siteAdd(siteName, siteUrls);
-      } catch (err) {
-        window.alert(`\u521B\u5EFA\u5931\u8D25\uFF1A${err.msg || ""}`);
-        console.error(err);
-        return;
-      } finally {
-        hideLoading(this.$add);
-      }
-      this.sites.push(s);
-      this.loadSites(this.sites);
-      this.closeAdd();
-    });
-    const keyDown = (evt) => {
-      if (evt.key === "Enter") {
-        $submitBtn.click();
-      }
-    };
-    $siteName.onkeyup = (evt) => keyDown(evt);
-    $siteUrls.onkeyup = (evt) => keyDown(evt);
-  }
-  closeAdd() {
-    var _a;
-    (_a = this.$add) == null ? void 0 : _a.remove();
-  }
-}
-class SitesView extends SidebarView {
-  constructor() {
-    super(...arguments);
-    __publicField(this, "viewTabs", {});
-    __publicField(this, "viewActiveTab", "");
-    __publicField(this, "siteList");
-  }
-  mount(siteName) {
-    if (!this.siteList) {
-      this.siteList = new SiteList(this.ctx);
-      this.$el.append(this.siteList.$el);
-    }
-    this.reqSites();
-  }
-  switchTab(tab, siteName) {
-    this.reqSites();
-  }
-  reqSites() {
-    return __async(this, null, function* () {
-      const sites = yield new Api(this.ctx).siteGet();
-      this.siteList.loadSites(sites);
-    });
-  }
-}
-__publicField(SitesView, "viewName", "sites");
-__publicField(SitesView, "viewTitle", "\u7AD9\u70B9");
-__publicField(SitesView, "viewAdminOnly", true);
-class TransferView extends SidebarView {
-  constructor() {
-    super(...arguments);
-    __publicField(this, "\xDF");
-    __publicField(this, "viewTabs", {
-      "import": "\u5BFC\u5165",
-      "export": "\u5BFC\u51FA"
-    });
-    __publicField(this, "viewActiveTab", "import");
-  }
-  mount(siteName) {
-    this.switchTab("import", siteName);
-  }
-  switchTab(tab, siteName) {
-    if (tab === "import") {
-      this.initImport();
-    } else if (tab === "export") {
-      this.initExport();
-      return false;
-    }
-    return true;
-  }
-  initImport() {
-    this.$el.innerHTML = `<div class="atk-log-wrap" style="display: none;">
-      <div class="atk-log-back-btn">\u8FD4\u56DE</div>
-      <div class="atk-log"></div>
-    </div>
-    <div class="atk-form">
-    <div class="atk-label">\u6570\u636E\u7C7B\u578B</div>
-    <select name="AtkDataType">
-      <option value="artrans">Artrans (\u6570\u636E\u884C\u56CA)</option>
-      <option value="artalk_v1">Artalk v1 (PHP \u65E7\u7248)</option>
-      <option value="typecho">Typecho</option>
-      <option value="wordpress">WordPress</option>
-      <option value="disqus">Disqus</option>
-      <option value="commento">Commento</option>
-      <option value="valine">Valine</option>
-      <option value="twikoo">Twikoo</option>
-    </select>
-    <div class="atk-label atk-data-file-label">\u6570\u636E\u6587\u4EF6</div>
-    <input type="file" name="AtkDataFile" accept="text/plain,.json">
-    <div class="atk-label">\u76EE\u6807\u7AD9\u70B9\u540D</div>
-    <input type="text" name="AtkSiteName" placeholder="\u8F93\u5165\u5185\u5BB9..." autocomplete="off">
-    <div class="atk-label">\u76EE\u6807\u7AD9\u70B9 URL</div>
-    <input type="text" name="AtkSiteURL" placeholder="\u8F93\u5165\u5185\u5BB9..." autocomplete="off">
-    <div class="atk-label">\u542F\u52A8\u53C2\u6570\uFF08\u53EF\u9009\uFF09</div>
-    <textarea name="AtkPayload"></textarea>
-    <span class="atk-desc">\u542F\u52A8\u53C2\u6570\u67E5\u9605\uFF1A\u201C<a href="https://artalk.js.org/guide/transfer.html" target="_blank">\u6587\u6863 \xB7 \u6570\u636E\u642C\u5BB6</a>\u201D</span>
-    <button class="atk-btn" name="AtkSubmit">\u5BFC\u5165</button>
-    </div>`;
-    const $form = this.$el.querySelector(".atk-form");
-    const $dataType = $form.querySelector('[name="AtkDataType"]');
-    const $dataFile = $form.querySelector('[name="AtkDataFile"]');
-    const $dataFileLabel = $form.querySelector(".atk-data-file-label");
-    const $siteName = $form.querySelector('[name="AtkSiteName"]');
-    const $siteURL = $form.querySelector('[name="AtkSiteURL"]');
-    const $payload = $form.querySelector('[name="AtkPayload"]');
-    const $submitBtn = $form.querySelector('[name="AtkSubmit"]');
-    const setError2 = (msg) => window.alert(msg);
-    $dataType.onchange = () => {
-      if (["typecho"].includes($dataType.value)) {
-        $dataFile.style.display = "none";
-        $dataFileLabel.style.display = "none";
-      } else {
-        $dataFile.style.display = "";
-        $dataFileLabel.style.display = "";
-      }
-    };
-    $submitBtn.onclick = () => {
-      var _a;
-      const dataType = $dataType.value.trim();
-      const siteName = $siteName.value.trim();
-      const siteURL = $siteURL.value.trim();
-      const payload = $payload.value.trim();
-      if (dataType === "") {
-        setError2("\u8BF7\u9009\u62E9\u6570\u636E\u7C7B\u578B");
-        return;
-      }
-      let rData = {};
-      if (payload) {
-        try {
-          rData = JSON.parse(payload);
-        } catch (err) {
-          setError2(`Payload JSON \u683C\u5F0F\u6709\u8BEF\uFF1A${String(err)}`);
-          return;
-        }
-        if (rData instanceof Object) {
-          setError2(`Payload \u9700\u4E3A JSON \u5BF9\u8C61`);
-          return;
-        }
-      }
-      if (siteName)
-        rData.t_name = siteName;
-      if (siteURL)
-        rData.t_url = siteURL;
-      const createSession = (dataStr) => {
-        const $logWrap = this.$el.querySelector(".atk-log-wrap");
-        const $log = $logWrap.querySelector(".atk-log");
-        const $backBtn = this.$el.querySelector(".atk-log-back-btn");
-        $logWrap.style.display = "";
-        $form.style.display = "none";
-        $backBtn.onclick = () => {
-          $logWrap.style.display = "none";
-          $form.style.display = "";
-        };
-        if (dataStr)
-          rData.json_data = dataStr;
-        const frameName = `f_${+new Date()}`;
-        const $frame = document.createElement("iframe");
-        $frame.className = "atk-iframe";
-        $frame.name = frameName;
-        $log.innerHTML = "";
-        $log.append($frame);
-        const formParams = {
-          type: dataType,
-          payload: JSON.stringify(rData),
-          token: this.ctx.user.data.token || ""
-        };
-        const $formTmp = document.createElement("form");
-        $formTmp.style.display = "none";
-        $formTmp.setAttribute("method", "post");
-        $formTmp.setAttribute("action", `${this.ctx.conf.server}/admin/import`);
-        $formTmp.setAttribute("target", frameName);
-        Object.entries(formParams).forEach(([key, val]) => {
-          const $inputTmp = document.createElement("input");
-          $inputTmp.setAttribute("type", "hidden");
-          $inputTmp.setAttribute("name", key);
-          $inputTmp.value = val;
-          $formTmp.appendChild($inputTmp);
-        });
-        $logWrap.append($formTmp);
-        $formTmp.submit();
-        $formTmp.remove();
-      };
-      const reader = new FileReader();
-      reader.onload = () => {
-        const data = String(reader.result);
-        createSession(data);
-      };
-      if ((_a = $dataFile.files) == null ? void 0 : _a.length) {
-        reader.readAsText($dataFile.files[0]);
-      } else {
-        createSession();
-      }
-    };
-  }
-  initExport() {
-    return __async(this, null, function* () {
-      showLoading(this.$el);
-      try {
-        const d = yield new Api(this.ctx).export();
-        this.download(`artrans-${this.getYmdHisFilename()}.json`, d);
-      } catch (err) {
-        console.log(err);
-        window.alert(`${String(err)}`);
-        return;
-      } finally {
-        hideLoading(this.$el);
-      }
-    });
-  }
-  download(filename, text) {
-    const el = document.createElement("a");
-    el.setAttribute("href", `data:text/json;charset=utf-8,${encodeURIComponent(text)}`);
-    el.setAttribute("download", filename);
-    el.style.display = "none";
-    document.body.appendChild(el);
-    el.click();
-    document.body.removeChild(el);
-  }
-  getYmdHisFilename() {
-    const date = new Date();
-    const year = date.getFullYear();
-    const month = date.getMonth() + 1;
-    const day = date.getDate();
-    const hours = date.getHours();
-    const minutes = date.getMinutes();
-    const seconds = date.getSeconds();
-    return `${year}${month}${day}-${hours}${padWithZeros(minutes, 2)}${padWithZeros(seconds, 2)}`;
-  }
-}
-__publicField(TransferView, "viewName", "transfer");
-__publicField(TransferView, "viewTitle", "\u8FC1\u79FB");
-__publicField(TransferView, "viewAdminOnly", true);
-class SiteListFloater {
-  constructor(ctx, conf) {
-    __publicField(this, "ctx");
-    __publicField(this, "conf");
-    __publicField(this, "$el");
-    __publicField(this, "sites", []);
-    __publicField(this, "$sites");
-    __publicField(this, "outsideChecker");
-    this.ctx = ctx;
-    this.conf = conf;
-    this.$el = createElement(`<div class="atk-site-list-floater" style="display: none;">
-      <div class="atk-sites"></div>
-    </div>`);
-    this.$sites = this.$el.querySelector(".atk-sites");
-  }
-  load(selectedSite) {
-    return __async(this, null, function* () {
-      this.$sites.innerHTML = "";
-      const renderSiteItem = (siteName, siteLogo, siteTarget, onclick) => {
-        const $site = createElement(`<div class="atk-site-item">
-          <div class="atk-site-logo"></div>
-          <div class="atk-site-name"></div>
-        </div>`);
-        $site.onclick = !onclick ? () => this.switch(siteTarget || siteName) : () => onclick();
-        $site.setAttribute("data-name", siteTarget || siteName);
-        const $siteLogo = $site.querySelector(".atk-site-logo");
-        const $siteName = $site.querySelector(".atk-site-name");
-        $siteLogo.innerText = siteLogo;
-        $siteName.innerText = siteName;
-        if (selectedSite === (siteTarget || siteName))
-          $site.classList.add("atk-active");
-        this.$sites.append($site);
-      };
-      renderSiteItem("\u6240\u6709\u7AD9\u70B9", "_", "__ATK_SITE_ALL");
-      const sites = yield new Api(this.ctx).siteGet();
-      sites.forEach((site) => {
-        renderSiteItem(site.name, site.name.substr(0, 1));
-      });
-      renderSiteItem("\u7AD9\u70B9\u7BA1\u7406", "+", "", () => {
-        this.conf.onClickSitesViewBtn();
-        this.hide();
-      });
-    });
-  }
-  switch(siteName) {
-    if (this.conf.onSwitchSite(siteName) === false) {
-      return;
-    }
-    this.$sites.querySelectorAll(".atk-site-item").forEach((e) => {
-      if (e.getAttribute("data-name") !== siteName) {
-        e.classList.remove("atk-active");
-      } else {
-        e.classList.add("atk-active");
-      }
-    });
-    this.hide();
-  }
-  show($trigger) {
-    this.$el.style.display = "";
-    if ($trigger) {
-      this.outsideChecker = (evt) => {
-        const isClickInside = $trigger.contains(evt.target) || this.$el.contains(evt.target);
-        if (!isClickInside) {
-          this.hide();
-        }
-      };
-      document.addEventListener("click", this.outsideChecker);
-    }
-  }
-  hide() {
-    this.$el.style.display = "none";
-    if (this.outsideChecker)
-      document.removeEventListener("click", this.outsideChecker);
-  }
-}
-const DEFAULT_VIEW = "comments";
-const REGISTER_VIEWS = [
-  MessageView,
-  PagesView,
-  SitesView,
-  TransferView
-];
-class Sidebar extends Component {
+var sidebarLayer = "";
+var SidebarHTML = '<div class="atk-sidebar-layer">\n  <div class="atk-sidebar-inner">\n    <div class="atk-sidebar-header">\n      <div class="atk-sidebar-close"><i class="atk-icon atk-icon-close"></i></div>\n    </div>\n    <div class="atk-sidebar-iframe-wrap"></div>\n  </div>\n</div>\n';
+class SidebarLayer extends Component {
   constructor(ctx) {
     super(ctx);
     __publicField(this, "layer");
     __publicField(this, "$header");
-    __publicField(this, "$headerMenu");
-    __publicField(this, "$title");
-    __publicField(this, "$avatar");
-    __publicField(this, "$siteLogo");
     __publicField(this, "$closeBtn");
-    __publicField(this, "$nav");
-    __publicField(this, "$curtViewBtn");
-    __publicField(this, "$curtViewBtnIcon");
-    __publicField(this, "$curtViewBtnText");
-    __publicField(this, "$navTabs");
-    __publicField(this, "$navViews");
-    __publicField(this, "$viewWrap");
-    __publicField(this, "siteSwitcher");
-    __publicField(this, "curtSite");
-    __publicField(this, "curtView", DEFAULT_VIEW);
-    __publicField(this, "curtTab");
-    __publicField(this, "viewInstances", {});
-    __publicField(this, "viewSwitcherShow", false);
+    __publicField(this, "$iframeWrap");
+    __publicField(this, "$iframe");
     __publicField(this, "firstShow", true);
+    __publicField(this, "loadingTimer", null);
     this.$el = createElement(SidebarHTML);
     this.$header = this.$el.querySelector(".atk-sidebar-header");
-    this.$headerMenu = this.$header.querySelector(".atk-menu");
-    this.$title = this.$header.querySelector(".atk-sidebar-title");
-    this.$avatar = this.$header.querySelector(".atk-avatar");
     this.$closeBtn = this.$header.querySelector(".atk-sidebar-close");
-    this.$nav = this.$el.querySelector(".atk-sidebar-nav");
-    this.$curtViewBtn = this.$nav.querySelector(".akt-curt-view-btn");
-    this.$curtViewBtnIcon = this.$curtViewBtn.querySelector(".atk-icon");
-    this.$curtViewBtnText = this.$curtViewBtn.querySelector(".atk-text");
-    this.$navTabs = this.$nav.querySelector(".atk-tabs");
-    this.$navViews = this.$nav.querySelector(".atk-views");
-    this.$viewWrap = this.$el.querySelector(".atk-sidebar-view-wrap");
-    this.initViewSwitcher();
+    this.$iframeWrap = this.$el.querySelector(".atk-sidebar-iframe-wrap");
     this.$closeBtn.onclick = () => {
       this.hide();
     };
@@ -6564,111 +5581,36 @@ class Sidebar extends Component {
       this.firstShow = true;
     });
   }
-  get isAdmin() {
-    return this.ctx.user.data.isAdmin;
-  }
-  get curtViewInstance() {
-    return this.curtView ? this.viewInstances[this.curtView] : void 0;
-  }
-  initViewSwitcher() {
-    this.$curtViewBtn.onclick = () => {
-      this.toggleViewSwitcher();
-    };
-    this.$navViews.innerHTML = "";
-    REGISTER_VIEWS.forEach((view) => {
-      const $item = createElement(`<div class="atk-tab-item"></div>`);
-      this.$navViews.append($item);
-      $item.setAttribute("data-name", view.viewName);
-      $item.innerText = view.viewTitle;
-      if (view.viewName === this.curtView) {
-        $item.classList.add("atk-active");
-        this.$curtViewBtnText.innerText = view.viewTitle;
-      }
-      $item.onclick = () => {
-        this.switchView(view.viewName);
-        this.toggleViewSwitcher();
-      };
-    });
-  }
-  toggleViewSwitcher() {
-    if (!this.viewSwitcherShow) {
-      this.$navViews.style.display = "";
-      this.$navTabs.style.display = "none";
-      this.$curtViewBtnIcon.classList.add("atk-arrow");
-    } else {
-      this.$navViews.style.display = "none";
-      this.$navTabs.style.display = "";
-      this.$curtViewBtnIcon.classList.remove("atk-arrow");
-    }
-    this.viewSwitcherShow = !this.viewSwitcherShow;
-  }
   show() {
     return __async(this, null, function* () {
       this.$el.style.transform = "";
-      this.layer = new Layer(this.ctx, "sidebar", this.$el);
-      this.layer.afterHide = () => {
-        if (this.ctx.conf.editorTravel === true) {
-          this.ctx.trigger("editor-travel-back");
-        }
-      };
+      if (this.layer == null) {
+        this.layer = new Layer(this.ctx, "sidebar", this.$el);
+        this.layer.afterHide = () => {
+          if (this.ctx.conf.editorTravel === true) {
+            this.ctx.trigger("editor-travel-back");
+          }
+        };
+      }
       this.layer.show();
-      this.$viewWrap.scrollTo(0, 0);
       setTimeout(() => {
         this.$el.style.transform = "translate(0, 0)";
       }, 20);
       if (this.firstShow) {
-        if (this.isAdmin) {
-          this.$title.innerText = "\u63A7\u5236\u4E2D\u5FC3";
-          this.$curtViewBtn.style.display = "";
-          if (!this.siteSwitcher) {
-            this.siteSwitcher = new SiteListFloater(this.ctx, {
-              onSwitchSite: (siteName) => {
-                this.switchSite(siteName);
-              },
-              onClickSitesViewBtn: () => {
-                this.switchView("sites");
-              }
-            });
-            this.$viewWrap.before(this.siteSwitcher.$el);
-            this.$avatar.onclick = (evt) => {
-              var _a;
-              if (!this.isAdmin)
-                return;
-              (_a = this.siteSwitcher) == null ? void 0 : _a.show(evt.target);
-            };
-          }
-          this.curtSite = this.conf.site;
-          showLoading(this.$el);
-          try {
-            yield this.siteSwitcher.load(this.curtSite);
-          } catch (err) {
-            const $err = createElement(`<span>\u52A0\u8F7D\u5931\u8D25\uFF1A${err.msg || "\u7F51\u7EDC\u9519\u8BEF"}<br/></span>`);
-            const $retryBtn = createElement('<span style="cursor:pointer;">\u70B9\u51FB\u91CD\u65B0\u83B7\u53D6</span>');
-            $err.appendChild($retryBtn);
-            $retryBtn.onclick = () => {
-              setError(this.$el, null);
-              this.show();
-            };
-            setError(this.$el, $err);
-            return;
-          } finally {
-            hideLoading(this.$el);
-          }
-          this.$avatar.innerHTML = "";
-          this.$siteLogo = createElement('<div class="atk-site-logo"></div>');
-          this.$siteLogo.innerText = (this.curtSite || "").substr(0, 1);
-          this.$avatar.append(this.$siteLogo);
-        } else {
-          this.$title.innerText = "\u901A\u77E5\u4E2D\u5FC3";
-          this.$curtViewBtn.style.display = "none";
-          this.curtSite = this.conf.site;
-          const $avatarImg = document.createElement("img");
-          $avatarImg.src = getGravatarURL(this.ctx, MD5(this.ctx.user.data.email.toLowerCase()));
-          this.$avatar.innerHTML = "";
-          this.$avatar.append($avatarImg);
-        }
-        this.switchView(DEFAULT_VIEW);
+        this.$iframeWrap.innerHTML = "";
+        this.$iframe = createElement("<iframe></iframe>");
+        const baseURL = `${this.conf.server.replace(/\/$/, "")}/../sidebar/`;
+        const userData = encodeURIComponent(JSON.stringify(this.ctx.user.data));
+        this.iframeLoad(`${baseURL}?pageKey=${encodeURIComponent(this.conf.pageKey)}&site=${encodeURIComponent(this.conf.site || "")}&user=${userData}${this.conf.darkMode ? `&darkMode=1` : ``}`);
+        this.$iframeWrap.append(this.$iframe);
         this.firstShow = false;
+      } else {
+        if (this.conf.darkMode && !this.$iframe.src.match(/darkMode=1$/)) {
+          this.iframeLoad(`${this.$iframe.src}&darkMode=1`);
+        }
+        if (!this.conf.darkMode && this.$iframe.src.match(/darkMode=1$/)) {
+          this.iframeLoad(this.$iframe.src.replace(/&darkMode=1$/, ""));
+        }
       }
     });
   }
@@ -6677,58 +5619,39 @@ class Sidebar extends Component {
     this.$el.style.transform = "";
     (_a = this.layer) == null ? void 0 : _a.hide();
   }
-  switchView(viewName) {
-    let view = this.viewInstances[viewName];
-    if (!view) {
-      const View = REGISTER_VIEWS.find((o) => o.viewName === viewName);
-      view = new View(this.ctx, this.$viewWrap);
-      this.viewInstances[viewName] = view;
-    }
-    view.mount(this.curtSite);
-    this.curtView = viewName;
-    this.curtTab = view.viewActiveTab;
-    this.$curtViewBtnText.innerText = view.constructor.viewTitle;
-    this.$navViews.querySelectorAll(".atk-tab-item").forEach((e) => {
-      if (e.getAttribute("data-name") === viewName) {
-        e.classList.add("atk-active");
-      } else {
-        e.classList.remove("atk-active");
-      }
-    });
-    this.loadViewTabs(view);
-    this.$viewWrap.innerHTML = "";
-    this.$viewWrap.append(view.$el);
-    this.$viewWrap.classList.forEach((c) => {
-      if (c.startsWith("atk-view-name-"))
-        this.$viewWrap.classList.remove(c);
-    });
-    this.$viewWrap.classList.add(`atk-view-name-${view.constructor.viewName}`);
-  }
-  loadViewTabs(view) {
-    this.$navTabs.innerHTML = "";
-    Object.entries(view.viewTabs).forEach(([tabName, label]) => {
-      const $tab = createElement(`<div class="atk-tab-item"></div>`);
-      this.$navTabs.append($tab);
-      $tab.innerText = label;
-      if (view.viewActiveTab === tabName)
-        $tab.classList.add("atk-active");
-      $tab.onclick = () => {
-        if (view.switchTab(tabName, this.curtSite) === false) {
-          return;
+  iframeLoad(src) {
+    if (!this.$iframe)
+      return;
+    this.$iframe.src = src;
+    showLoading(this.$iframeWrap);
+    this.$iframe.onload = () => {
+      hideLoading(this.$iframeWrap);
+    };
+  }
+  checkReqStatus(url) {
+    return __async(this, null, function* () {
+      if (this.loadingTimer !== null)
+        window.clearTimeout(this.loadingTimer);
+      this.loadingTimer = window.setTimeout(() => __async(this, null, function* () {
+        try {
+          yield fetch(url);
+        } catch (err) {
+          console.log(err);
+          const $errAlert = createElement(`<div class="atk-err-alert">  <div class="atk-title">\u4FA7\u8FB9\u680F\u4F3C\u4E4E\u6253\u5F00\u5931\u8D25</div>  <div class="atk-text"><span id="AtkReload">\u91CD\u65B0\u52A0\u8F7D</span> / <span id="AtkCancel">\u53D6\u6D88</span></div></div>`);
+          const $reloadBtn = $errAlert.querySelector("#AtkReload");
+          const $cancelBtn = $errAlert.querySelector("#AtkCancel");
+          $reloadBtn.onclick = () => {
+            this.iframeLoad(url);
+            $errAlert.remove();
+          };
+          $cancelBtn.onclick = () => {
+            $errAlert.remove();
+          };
+          this.$iframeWrap.append($errAlert);
         }
-        this.$navTabs.querySelectorAll(".atk-active").forEach((e) => e.classList.remove("atk-active"));
-        $tab.classList.add("atk-active");
-        this.curtTab = tabName;
-      };
+      }), 2e3);
     });
   }
-  switchSite(siteName) {
-    this.curtSite = siteName;
-    const curtView = this.curtViewInstance;
-    curtView == null ? void 0 : curtView.switchTab(this.curtTab, siteName);
-    if (this.$siteLogo)
-      this.$siteLogo.innerText = this.curtSite.substr(0, 1);
-  }
 }
 const _Artalk = class {
   constructor(customConf) {
@@ -6738,7 +5661,7 @@ const _Artalk = class {
     __publicField(this, "checkerLauncher");
     __publicField(this, "editor");
     __publicField(this, "list");
-    __publicField(this, "sidebar");
+    __publicField(this, "sidebarLayer");
     this.conf = __spreadValues(__spreadValues({}, _Artalk.defaults), customConf);
     this.conf.server = this.conf.server.replace(/\/$/, "");
     if (!this.conf.pageKey) {
@@ -6762,10 +5685,11 @@ const _Artalk = class {
     this.$root.appendChild(this.editor.$el);
     this.list = new List(this.ctx);
     this.$root.appendChild(this.list.$el);
-    this.sidebar = new Sidebar(this.ctx);
-    this.$root.appendChild(this.sidebar.$el);
-    this.list.reqComments();
+    this.sidebarLayer = new SidebarLayer(this.ctx);
+    this.$root.appendChild(this.sidebarLayer.$el);
+    this.list.fetchComments(0);
     this.initEventBind();
+    this.initPV();
   }
   initEventBind() {
     window.addEventListener("hashchange", () => {
@@ -6777,6 +5701,9 @@ const _Artalk = class {
       const { $wrap: $layerWrap } = GetLayerWrap(this.ctx);
       if ($layerWrap)
         $layerWrap.querySelectorAll(`[atk-only-admin-show]`).forEach((item) => items.push(item));
+      const $sidebarEl = document.querySelector(".atk-sidebar");
+      if ($sidebarEl)
+        $sidebarEl.querySelectorAll(`[atk-only-admin-show]`).forEach((item) => items.push(item));
       items.forEach(($item) => {
         if (this.ctx.user.data.isAdmin)
           $item.classList.remove("atk-hide");
@@ -6790,7 +5717,7 @@ const _Artalk = class {
     });
   }
   reload() {
-    this.list.reqComments();
+    this.list.fetchComments(0);
   }
   initDarkMode() {
     const darkModeClassName = "atk-dark-mode";
@@ -6812,6 +5739,17 @@ const _Artalk = class {
     this.ctx.conf.darkMode = darkMode;
     this.initDarkMode();
   }
+  initPV() {
+    return __async(this, null, function* () {
+      if (!this.conf.pvEl || !document.querySelector(this.conf.pvEl))
+        return;
+      const $pv = document.querySelector(this.conf.pvEl);
+      const pvNum = yield new Api(this.ctx).pv();
+      if (Number.isNaN(Number(pvNum)))
+        return;
+      $pv.innerText = String(pvNum);
+    });
+  }
   on(name, handler) {
     this.ctx.on(name, handler, "external");
   }