artalk 2.2.9 → 2.2.12

package/dist/Artalk.es.js

@@ -1,4 +1,6 @@
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -14,6 +16,7 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
@@ -95,16 +98,17 @@ const defaults$3 = {
   placeholder: "\u952E\u5165\u5185\u5BB9...",
   noComment: "\u300C\u6B64\u65F6\u65E0\u58F0\u80DC\u6709\u58F0\u300D",
   sendBtn: "\u53D1\u9001\u8BC4\u8BBA",
-  darkMode: false,
+  darkMode: "auto",
   editorTravel: true,
+  flatMode: "auto",
+  nestMax: 2,
+  nestSort: "DATE_ASC",
   emoticons: "https://cdn.jsdelivr.net/gh/ArtalkJS/Emoticons/grps/default.json",
   vote: true,
   voteDown: false,
   uaBadge: true,
   listSort: true,
   pvEl: "#ArtalkPV",
-  flatMode: "auto",
-  nestMax: 3,
   gravatar: {
     default: "mp",
     mirror: "https://sdn.geekzu.org/avatar/"
@@ -3119,63 +3123,54 @@ class Dialog {
 }
 function Fetch(ctx, input, init, timeout) {
   return __async(this, null, function* () {
+    var _a, _b;
     if (ctx.user.data.token) {
-      const requestHeaders = new Headers();
-      requestHeaders.set("Authorization", `Bearer ${ctx.user.data.token}`);
-      init.headers = requestHeaders;
-    }
-    try {
-      let resp;
-      if (typeof timeout !== "number" && ctx.conf.reqTimeout === 0 || timeout === 0) {
-        resp = yield fetch(input, init);
-      } else {
-        resp = yield timeoutPromise(timeout || ctx.conf.reqTimeout || 15e3, fetch(input, init));
-      }
-      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) => {
-        Fetch(ctx, input, init).then((d) => {
-          resolve(d);
-        }).catch((err) => {
-          reject(err);
-        });
-      };
-      if (json.data && json.data.need_captcha) {
-        json = yield new Promise((resolve, reject) => {
-          ctx.trigger("checker-captcha", {
-            imgData: json.data.img_data,
-            iframe: json.data.iframe,
-            onSuccess: () => {
-              recall(resolve, reject);
-            },
-            onCancel: () => {
-              reject(json);
-            }
-          });
+      const headers = new Headers(init.headers);
+      headers.set("Authorization", `Bearer ${ctx.user.data.token}`);
+      init.headers = headers;
+    }
+    const resp = yield timeoutFetch(input, timeout || ctx.conf.reqTimeout || 15e3, init);
+    const respHttpCode = resp.status;
+    const noAccessCodes = [401, 400];
+    const isNoAccess = noAccessCodes.includes(respHttpCode);
+    if (!resp.ok && !isNoAccess)
+      throw new Error(`\u8BF7\u6C42\u54CD\u5E94 ${respHttpCode}`);
+    let json = yield resp.json();
+    const recall = (resolve, reject) => {
+      Fetch(ctx, input, init).then((d) => {
+        resolve(d);
+      }).catch((e) => {
+        reject(e);
+      });
+    };
+    if ((_a = json.data) == null ? void 0 : _a.need_captcha) {
+      json = yield new Promise((resolve, reject) => {
+        ctx.trigger("checker-captcha", {
+          imgData: json.data.img_data,
+          iframe: json.data.iframe,
+          onSuccess: () => {
+            recall(resolve, reject);
+          },
+          onCancel: () => {
+            reject(json);
+          }
         });
-      } else if (json.data && json.data.need_login || noAccessCodes.includes(resp.status)) {
-        json = yield new Promise((resolve, reject) => {
-          ctx.trigger("checker-admin", {
-            onSuccess: () => {
-              recall(resolve, reject);
-            },
-            onCancel: () => {
-              reject(json);
-            }
-          });
+      });
+    } else if (((_b = json.data) == null ? void 0 : _b.need_login) || isNoAccess) {
+      json = yield new Promise((resolve, reject) => {
+        ctx.trigger("checker-admin", {
+          onSuccess: () => {
+            recall(resolve, reject);
+          },
+          onCancel: () => {
+            reject(json);
+          }
         });
-      }
-      if (!json.success)
-        throw json;
-      return json;
-    } catch (err) {
-      console.error(err);
-      if (err instanceof TypeError)
-        throw new Error(`\u7F51\u7EDC\u9519\u8BEF`);
-      throw err;
+      });
     }
+    if (!json.success)
+      throw json;
+    return json;
   });
 }
 function POST(ctx, url, data) {
@@ -3194,20 +3189,390 @@ function ToFormData(object) {
   Object.keys(object).forEach((key) => formData.append(key, String(object[key])));
   return formData;
 }
-function timeoutPromise(ms, promise) {
-  return new Promise((resolve, reject) => {
-    const timeoutId = setTimeout(() => {
-      reject(new Error("\u8BF7\u6C42\u8D85\u65F6"));
-    }, ms);
-    promise.then((res) => {
-      clearTimeout(timeoutId);
-      resolve(res);
-    }, (err) => {
-      clearTimeout(timeoutId);
-      reject(err);
+function timeoutFetch(url, ms, opts) {
+  var _a;
+  const controller = new AbortController();
+  (_a = opts.signal) == null ? void 0 : _a.addEventListener("abort", () => controller.abort());
+  let promise = fetch(url, __spreadProps(__spreadValues({}, opts), { signal: controller.signal }));
+  if (ms > 0) {
+    const timer = setTimeout(() => controller.abort(), ms);
+    promise.finally(() => {
+      clearTimeout(timer);
     });
+  }
+  promise = promise.catch((err) => {
+    throw (err || {}).name === "AbortError" ? new Error("\u8BF7\u6C42\u8D85\u65F6\u6216\u610F\u5916\u7EC8\u6B62") : err;
   });
+  return promise;
 }
+(function(factory) {
+  factory();
+})(function() {
+  function _classCallCheck(instance, Constructor) {
+    if (!(instance instanceof Constructor)) {
+      throw new TypeError("Cannot call a class as a function");
+    }
+  }
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor)
+        descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps)
+      _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps)
+      _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+  function _inherits(subClass, superClass) {
+    if (typeof superClass !== "function" && superClass !== null) {
+      throw new TypeError("Super expression must either be null or a function");
+    }
+    subClass.prototype = Object.create(superClass && superClass.prototype, {
+      constructor: {
+        value: subClass,
+        writable: true,
+        configurable: true
+      }
+    });
+    if (superClass)
+      _setPrototypeOf(subClass, superClass);
+  }
+  function _getPrototypeOf(o) {
+    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf2(o2) {
+      return o2.__proto__ || Object.getPrototypeOf(o2);
+    };
+    return _getPrototypeOf(o);
+  }
+  function _setPrototypeOf(o, p) {
+    _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf2(o2, p2) {
+      o2.__proto__ = p2;
+      return o2;
+    };
+    return _setPrototypeOf(o, p);
+  }
+  function _isNativeReflectConstruct() {
+    if (typeof Reflect === "undefined" || !Reflect.construct)
+      return false;
+    if (Reflect.construct.sham)
+      return false;
+    if (typeof Proxy === "function")
+      return true;
+    try {
+      Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {
+      }));
+      return true;
+    } catch (e) {
+      return false;
+    }
+  }
+  function _assertThisInitialized(self2) {
+    if (self2 === void 0) {
+      throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+    }
+    return self2;
+  }
+  function _possibleConstructorReturn(self2, call) {
+    if (call && (typeof call === "object" || typeof call === "function")) {
+      return call;
+    }
+    return _assertThisInitialized(self2);
+  }
+  function _createSuper(Derived) {
+    var hasNativeReflectConstruct = _isNativeReflectConstruct();
+    return function _createSuperInternal() {
+      var Super = _getPrototypeOf(Derived), result;
+      if (hasNativeReflectConstruct) {
+        var NewTarget = _getPrototypeOf(this).constructor;
+        result = Reflect.construct(Super, arguments, NewTarget);
+      } else {
+        result = Super.apply(this, arguments);
+      }
+      return _possibleConstructorReturn(this, result);
+    };
+  }
+  function _superPropBase(object, property) {
+    while (!Object.prototype.hasOwnProperty.call(object, property)) {
+      object = _getPrototypeOf(object);
+      if (object === null)
+        break;
+    }
+    return object;
+  }
+  function _get(target, property, receiver) {
+    if (typeof Reflect !== "undefined" && Reflect.get) {
+      _get = Reflect.get;
+    } else {
+      _get = function _get2(target2, property2, receiver2) {
+        var base = _superPropBase(target2, property2);
+        if (!base)
+          return;
+        var desc = Object.getOwnPropertyDescriptor(base, property2);
+        if (desc.get) {
+          return desc.get.call(receiver2);
+        }
+        return desc.value;
+      };
+    }
+    return _get(target, property, receiver || target);
+  }
+  var Emitter = /* @__PURE__ */ function() {
+    function Emitter2() {
+      _classCallCheck(this, Emitter2);
+      Object.defineProperty(this, "listeners", {
+        value: {},
+        writable: true,
+        configurable: true
+      });
+    }
+    _createClass(Emitter2, [{
+      key: "addEventListener",
+      value: function addEventListener(type, callback, options) {
+        if (!(type in this.listeners)) {
+          this.listeners[type] = [];
+        }
+        this.listeners[type].push({
+          callback,
+          options
+        });
+      }
+    }, {
+      key: "removeEventListener",
+      value: function removeEventListener(type, callback) {
+        if (!(type in this.listeners)) {
+          return;
+        }
+        var stack = this.listeners[type];
+        for (var i = 0, l = stack.length; i < l; i++) {
+          if (stack[i].callback === callback) {
+            stack.splice(i, 1);
+            return;
+          }
+        }
+      }
+    }, {
+      key: "dispatchEvent",
+      value: function dispatchEvent(event) {
+        if (!(event.type in this.listeners)) {
+          return;
+        }
+        var stack = this.listeners[event.type];
+        var stackToCall = stack.slice();
+        for (var i = 0, l = stackToCall.length; i < l; i++) {
+          var listener = stackToCall[i];
+          try {
+            listener.callback.call(this, event);
+          } catch (e) {
+            Promise.resolve().then(function() {
+              throw e;
+            });
+          }
+          if (listener.options && listener.options.once) {
+            this.removeEventListener(event.type, listener.callback);
+          }
+        }
+        return !event.defaultPrevented;
+      }
+    }]);
+    return Emitter2;
+  }();
+  var AbortSignal = /* @__PURE__ */ function(_Emitter) {
+    _inherits(AbortSignal2, _Emitter);
+    var _super = _createSuper(AbortSignal2);
+    function AbortSignal2() {
+      var _this;
+      _classCallCheck(this, AbortSignal2);
+      _this = _super.call(this);
+      if (!_this.listeners) {
+        Emitter.call(_assertThisInitialized(_this));
+      }
+      Object.defineProperty(_assertThisInitialized(_this), "aborted", {
+        value: false,
+        writable: true,
+        configurable: true
+      });
+      Object.defineProperty(_assertThisInitialized(_this), "onabort", {
+        value: null,
+        writable: true,
+        configurable: true
+      });
+      return _this;
+    }
+    _createClass(AbortSignal2, [{
+      key: "toString",
+      value: function toString() {
+        return "[object AbortSignal]";
+      }
+    }, {
+      key: "dispatchEvent",
+      value: function dispatchEvent(event) {
+        if (event.type === "abort") {
+          this.aborted = true;
+          if (typeof this.onabort === "function") {
+            this.onabort.call(this, event);
+          }
+        }
+        _get(_getPrototypeOf(AbortSignal2.prototype), "dispatchEvent", this).call(this, event);
+      }
+    }]);
+    return AbortSignal2;
+  }(Emitter);
+  var AbortController2 = /* @__PURE__ */ function() {
+    function AbortController3() {
+      _classCallCheck(this, AbortController3);
+      Object.defineProperty(this, "signal", {
+        value: new AbortSignal(),
+        writable: true,
+        configurable: true
+      });
+    }
+    _createClass(AbortController3, [{
+      key: "abort",
+      value: function abort() {
+        var event;
+        try {
+          event = new Event("abort");
+        } catch (e) {
+          if (typeof document !== "undefined") {
+            if (!document.createEvent) {
+              event = document.createEventObject();
+              event.type = "abort";
+            } else {
+              event = document.createEvent("Event");
+              event.initEvent("abort", false, false);
+            }
+          } else {
+            event = {
+              type: "abort",
+              bubbles: false,
+              cancelable: false
+            };
+          }
+        }
+        this.signal.dispatchEvent(event);
+      }
+    }, {
+      key: "toString",
+      value: function toString() {
+        return "[object AbortController]";
+      }
+    }]);
+    return AbortController3;
+  }();
+  if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
+    AbortController2.prototype[Symbol.toStringTag] = "AbortController";
+    AbortSignal.prototype[Symbol.toStringTag] = "AbortSignal";
+  }
+  function polyfillNeeded(self2) {
+    if (self2.__FORCE_INSTALL_ABORTCONTROLLER_POLYFILL) {
+      console.log("__FORCE_INSTALL_ABORTCONTROLLER_POLYFILL=true is set, will force install polyfill");
+      return true;
+    }
+    return typeof self2.Request === "function" && !self2.Request.prototype.hasOwnProperty("signal") || !self2.AbortController;
+  }
+  function abortableFetchDecorator(patchTargets) {
+    if (typeof patchTargets === "function") {
+      patchTargets = {
+        fetch: patchTargets
+      };
+    }
+    var _patchTargets = patchTargets, fetch2 = _patchTargets.fetch, _patchTargets$Request = _patchTargets.Request, NativeRequest = _patchTargets$Request === void 0 ? fetch2.Request : _patchTargets$Request, NativeAbortController = _patchTargets.AbortController, _patchTargets$__FORCE = _patchTargets.__FORCE_INSTALL_ABORTCONTROLLER_POLYFILL, __FORCE_INSTALL_ABORTCONTROLLER_POLYFILL = _patchTargets$__FORCE === void 0 ? false : _patchTargets$__FORCE;
+    if (!polyfillNeeded({
+      fetch: fetch2,
+      Request: NativeRequest,
+      AbortController: NativeAbortController,
+      __FORCE_INSTALL_ABORTCONTROLLER_POLYFILL
+    })) {
+      return {
+        fetch: fetch2,
+        Request
+      };
+    }
+    var Request = NativeRequest;
+    if (Request && !Request.prototype.hasOwnProperty("signal") || __FORCE_INSTALL_ABORTCONTROLLER_POLYFILL) {
+      Request = function Request2(input, init) {
+        var signal;
+        if (init && init.signal) {
+          signal = init.signal;
+          delete init.signal;
+        }
+        var request = new NativeRequest(input, init);
+        if (signal) {
+          Object.defineProperty(request, "signal", {
+            writable: false,
+            enumerable: false,
+            configurable: true,
+            value: signal
+          });
+        }
+        return request;
+      };
+      Request.prototype = NativeRequest.prototype;
+    }
+    var realFetch = fetch2;
+    var abortableFetch = function abortableFetch2(input, init) {
+      var signal = Request && Request.prototype.isPrototypeOf(input) ? input.signal : init ? init.signal : void 0;
+      if (signal) {
+        var abortError;
+        try {
+          abortError = new DOMException("Aborted", "AbortError");
+        } catch (err) {
+          abortError = new Error("Aborted");
+          abortError.name = "AbortError";
+        }
+        if (signal.aborted) {
+          return Promise.reject(abortError);
+        }
+        var cancellation = new Promise(function(_, reject) {
+          signal.addEventListener("abort", function() {
+            return reject(abortError);
+          }, {
+            once: true
+          });
+        });
+        if (init && init.signal) {
+          delete init.signal;
+        }
+        return Promise.race([cancellation, realFetch(input, init)]);
+      }
+      return realFetch(input, init);
+    };
+    return {
+      fetch: abortableFetch,
+      Request
+    };
+  }
+  (function(self2) {
+    if (!polyfillNeeded(self2)) {
+      return;
+    }
+    if (!self2.fetch) {
+      console.warn("fetch() is not available, cannot install abortcontroller-polyfill");
+      return;
+    }
+    var _abortableFetch = abortableFetchDecorator(self2), fetch2 = _abortableFetch.fetch, Request = _abortableFetch.Request;
+    self2.fetch = fetch2;
+    self2.Request = Request;
+    Object.defineProperty(self2, "AbortController", {
+      writable: true,
+      enumerable: false,
+      configurable: true,
+      value: AbortController2
+    });
+    Object.defineProperty(self2, "AbortSignal", {
+      writable: true,
+      enumerable: false,
+      configurable: true,
+      value: AbortSignal
+    });
+  })(typeof self !== "undefined" ? self : commonjsGlobal);
+});
 class Api {
   constructor(ctx) {
     __publicField(this, "ctx");
@@ -3280,7 +3645,6 @@ class Api {
   }
   userGet(name, email) {
     const ctrl = new AbortController();
-    const { signal } = ctrl;
     const params = {
       name,
       email,
@@ -3289,7 +3653,7 @@ class Api {
     const req = Fetch(this.ctx, `${this.baseURL}/user-get`, {
       method: "POST",
       body: ToFormData(params),
-      signal
+      signal: ctrl.signal
     }).then((json) => ({
       user: json.data.user,
       is_login: json.data.is_login,
@@ -3461,6 +3825,8 @@ class Api {
         conf.emoticons = conf.emoticons.trim();
         if (conf.emoticons.startsWith("[") || conf.emoticons.startsWith("{")) {
           conf.emoticons = JSON.parse(conf.emoticons);
+        } else if (conf.emoticons === "false") {
+          conf.emoticons = false;
         }
       }
       return conf;
@@ -4090,6 +4456,7 @@ class Editor extends Component {
             this.user.data.link = data.user.link;
             this.getInputEl("link").value = data.user.link;
           }
+        }).catch(() => {
         }).finally(() => {
           this.queryUserInfo.abortFunc = null;
         });
@@ -4135,15 +4502,10 @@ class Editor extends Component {
     this.openedPlugName = null;
     this.$plugBtnWrap.innerHTML = "";
     this.LOADABLE_PLUG_LIST.forEach((PlugObj) => {
+      if (PlugObj.Name === "emoticons" && !this.conf.emoticons)
+        return;
       const btnElem = createElement(`<span class="atk-plug-btn" data-plug-name="${PlugObj.Name}">${PlugObj.BtnHTML}</span>`);
       this.$plugBtnWrap.appendChild(btnElem);
-      if (PlugObj.Name === "emoticons") {
-        const emoPlug = new PlugObj(this);
-        this.plugList[PlugObj.Name] = emoPlug;
-        window.setTimeout(() => {
-          emoPlug.loadEmoticonsData();
-        }, 1e3);
-      }
       btnElem.addEventListener("click", () => {
         let plug = this.plugList[PlugObj.Name];
         if (!plug) {
@@ -4178,6 +4540,13 @@ class Editor extends Component {
         btnElem.classList.add("active");
       });
     });
+    if (this.conf.emoticons) {
+      const emoPlug = new EmoticonsPlug(this);
+      this.plugList[EmoticonsPlug.Name] = emoPlug;
+      window.setTimeout(() => {
+        emoPlug.loadEmoticonsData();
+      }, 1e3);
+    }
     this.initImgUpload();
   }
   closePlug() {
@@ -4759,6 +5128,7 @@ class Comment extends Component {
     __publicField(this, "$main");
     __publicField(this, "$header");
     __publicField(this, "$headerNick");
+    __publicField(this, "$headerBadge");
     __publicField(this, "$body");
     __publicField(this, "$content");
     __publicField(this, "$children");
@@ -4852,13 +5222,14 @@ class Comment extends Component {
     } else {
       this.$headerNick.innerText = this.data.nick;
     }
-    const $badge = this.$el.querySelector(".atk-badge");
+    this.$headerBadge = this.$el.querySelector(".atk-badge");
     if (this.data.badge_name) {
-      $badge.innerText = this.data.badge_name;
+      this.$headerBadge.innerText = this.data.badge_name;
       if (this.data.badge_color)
-        $badge.style.backgroundColor = this.data.badge_color;
+        this.$headerBadge.style.backgroundColor = this.data.badge_color;
     } else {
-      $badge.remove();
+      this.$headerBadge.remove();
+      this.$headerBadge = void 0;
     }
     if (this.data.is_pinned) {
       const $pinnedBadge = createElement(`<span class="atk-item atk-pinned-badge">\u7F6E\u9876</span>`);
@@ -4917,7 +5288,8 @@ class Comment extends Component {
     this.$replyAt.onclick = () => {
       this.goToReplyComment();
     };
-    this.$headerNick.insertAdjacentElement("afterend", this.$replyAt);
+    const $after = this.$headerBadge || this.$headerNick;
+    $after.insertAdjacentElement("afterend", this.$replyAt);
   }
   renderReplyTo() {
     if (!this.flatMode)
@@ -5486,7 +5858,7 @@ function makeNestCommentNodeList(srcData, sortBy = "DATE_DESC", nestMax = 2) {
   })(nodeList);
   return nodeList;
 }
-const backendMinVersion = "2.1.4";
+const backendMinVersion = "2.1.6";
 class ListLite extends Component {
   constructor(ctx) {
     super(ctx);
@@ -5496,7 +5868,7 @@ class ListLite extends Component {
     __publicField(this, "isLoading", false);
     __publicField(this, "noCommentText", "\u65E0\u5185\u5BB9");
     __publicField(this, "flatMode", false);
-    __publicField(this, "nestSortBy", "DATE_DESC");
+    __publicField(this, "nestSortBy");
     __publicField(this, "pageMode", "pagination");
     __publicField(this, "pageSize", 20);
     __publicField(this, "scrollListenerAt");
@@ -5515,6 +5887,7 @@ class ListLite extends Component {
     this.$commentsWrap = this.$el.querySelector(".atk-list-comments-wrap");
     if (ctx.conf.noComment)
       this.noCommentText = ctx.conf.noComment;
+    this.nestSortBy = this.ctx.conf.nestSort || "DATE_ASC";
     window.setInterval(() => {
       this.$el.querySelectorAll("[data-atk-comment-date]").forEach((el) => {
         const date = el.getAttribute("data-atk-comment-date");
@@ -5580,7 +5953,7 @@ class ListLite extends Component {
     }
     this.data = data;
     const feMinVersion = ((_a = data.api_version) == null ? void 0 : _a.fe_min_version) || "0.0.0";
-    if (this.ctx.conf.versionCheck && this.versionCheck("\u524D\u7AEF", feMinVersion, "2.2.9"))
+    if (this.ctx.conf.versionCheck && this.versionCheck("\u524D\u7AEF", feMinVersion, "2.2.12"))
       return;
     if (this.ctx.conf.versionCheck && this.versionCheck("\u540E\u7AEF", backendMinVersion, (_b = data.api_version) == null ? void 0 : _b.version))
       return;
@@ -5718,6 +6091,8 @@ class ListLite extends Component {
       this.refreshUI();
     };
     comment2.replyTo = cData.rid ? ctxData.find((c) => c.id === cData.rid) : void 0;
+    comment2.render();
+    this.commentList.push(comment2);
     return comment2;
   }
   importComments(srcData) {
@@ -5733,18 +6108,14 @@ class ListLite extends Component {
     const rootNodes = makeNestCommentNodeList(srcData, this.nestSortBy, this.conf.nestMax);
     rootNodes.forEach((rootNode) => {
       const rootC = this.createComment(rootNode.comment, srcData);
-      rootC.render();
       this.$commentsWrap.appendChild(rootC.getEl());
       rootC.playFadeInAnim();
-      this.commentList.push(rootC);
       const that = this;
       (function loadChildren(parentC, parentNode) {
         parentNode.children.forEach((node) => {
           const childD = node.comment;
           const childC = that.createComment(childD, srcData);
-          childC.render();
           parentC.putChild(childC);
-          that.commentList.push(childC);
           loadChildren(childC, node);
         });
       })(rootC, rootNode);
@@ -5755,8 +6126,6 @@ class ListLite extends Component {
     if (cData.is_collapsed)
       cData.is_allow_reply = false;
     const comment2 = this.createComment(cData, ctxData);
-    comment2.render();
-    this.commentList.push(comment2);
     if (cData.visible) {
       if (insertMode === "append")
         this.$commentsWrap.append(comment2.getEl());
@@ -5771,13 +6140,10 @@ class ListLite extends Component {
     if (!this.flatMode) {
       const comment2 = this.createComment(commentData);
       if (commentData.rid === 0) {
-        comment2.render();
         this.$commentsWrap.prepend(comment2.getEl());
-        this.commentList.push(comment2);
       } else {
         const parent = this.findComment(commentData.rid);
         if (parent) {
-          comment2.render();
           parent.putChild(comment2, this.nestSortBy === "DATE_ASC" ? "append" : "prepend");
           comment2.getParents().forEach((p) => {
             if (p.$children)
@@ -5887,7 +6253,7 @@ class List extends ListLite {
     if (this.ctx.conf.listSort) {
       this.initDropdown();
     }
-    this.$el.querySelector(".atk-copyright").innerHTML = `Powered By <a href="https://artalk.js.org" target="_blank" title="Artalk v${"2.2.9"}">Artalk</a>`;
+    this.$el.querySelector(".atk-copyright").innerHTML = `Powered By <a href="https://artalk.js.org" target="_blank" title="Artalk v${"2.2.12"}">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));
@@ -6212,6 +6578,9 @@ const _Artalk = class {
     if (!this.conf.pageTitle) {
       this.conf.pageTitle = `${document.title}`;
     }
+    if (this.conf.nestMax && this.conf.nestMax <= 1) {
+      this.conf.flatMode = true;
+    }
     if (!!this.conf.el && this.conf.el instanceof HTMLElement) {
       this.$root = this.conf.el;
     } else {
@@ -6304,7 +6673,20 @@ const _Artalk = class {
     Layer.BodyOrgPaddingRight = document.body.style.paddingRight;
   }
   initDarkMode() {
+    if (this.conf.darkMode === "auto") {
+      const darkModeMedia = window.matchMedia("(prefers-color-scheme: dark)");
+      darkModeMedia.addEventListener("change", (e) => {
+        this.setDarkMode(e.matches);
+      });
+      this.setDarkMode(darkModeMedia.matches);
+    } else {
+      this.setDarkMode(this.conf.darkMode || false);
+    }
+  }
+  setDarkMode(darkMode) {
     const darkModeClassName = "atk-dark-mode";
+    this.ctx.conf.darkMode = darkMode;
+    this.ctx.trigger("conf-updated");
     if (this.conf.darkMode) {
       this.$root.classList.add(darkModeClassName);
     } else {
@@ -6319,11 +6701,6 @@ const _Artalk = class {
       }
     }
   }
-  setDarkMode(darkMode) {
-    this.ctx.conf.darkMode = darkMode;
-    this.ctx.trigger("conf-updated");
-    this.initDarkMode();
-  }
   initPV() {
     return __async(this, null, function* () {
       const pvNum = yield new Api(this.ctx).pv();