hexo-component-inferno 4.0.0 → 4.2.0

package/lib/view/comment/giscus.js

@@ -2,9 +2,6 @@
 
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 var _inferno = require("inferno");
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
 function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
 function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
@@ -25,6 +22,11 @@ var _require = require('inferno'),
   Component = _require.Component;
 var _require2 = require('../../util/cache'),
   cacheComponent = _require2.cacheComponent;
+var _require3 = require('../../util/script'),
+  appendScript = _require3.appendScript,
+  toJs = _require3.toJs;
+var _require4 = require('../../util/appearance'),
+  isDark = _require4.isDark;
 
 /**
  * Giscus comment JSX component.
@@ -42,6 +44,7 @@ var _require2 = require('../../util/cache'),
  *     emitMetadata={0}
  *     inputPosition="******"
  *     theme="******"
+ *     darkTheme="******"
  *     lang="******"
  *     lazy="******" />
  */
@@ -66,6 +69,7 @@ var Giscus = /*#__PURE__*/function (_Component) {
         emitMetadata = _this$props.emitMetadata,
         inputPosition = _this$props.inputPosition,
         theme = _this$props.theme,
+        darkTheme = _this$props.darkTheme,
         customThemeCss = _this$props.customThemeCss,
         lang = _this$props.lang,
         lazy = _this$props.lazy;
@@ -75,9 +79,7 @@ var Giscus = /*#__PURE__*/function (_Component) {
       if ((mapping === 'specific' || mapping === 'number') && !term) {
         return (0, _inferno.createVNode)(1, "div", "notification is-danger", [(0, _inferno.createTextVNode)("You set "), (0, _inferno.createVNode)(1, "code", null, "mapping", 16), (0, _inferno.createTextVNode)(" to "), (0, _inferno.createVNode)(1, "code", null, "specific", 16), (0, _inferno.createTextVNode)(" or "), (0, _inferno.createVNode)(1, "code", null, "number", 16), (0, _inferno.createTextVNode)(", but did not set "), (0, _inferno.createVNode)(1, "code", null, "term", 16), (0, _inferno.createTextVNode)(" for Giscus. Please set "), (0, _inferno.createVNode)(1, "code", null, "term", 16), (0, _inferno.createTextVNode)(" in "), (0, _inferno.createVNode)(1, "code", null, "_config.yml", 16), (0, _inferno.createTextVNode)(".")], 4);
       }
-      var config = {
-        repo: repo
-      };
+      var config = {};
       config['data-repo'] = repo;
       config['data-repo-id'] = repoId;
       config['data-category-id'] = categoryId;
@@ -91,6 +93,9 @@ var Giscus = /*#__PURE__*/function (_Component) {
       } else {
         config['data-mapping'] = 'pathname';
       }
+      if (term) {
+        config['data-term'] = term;
+      }
       if (strict) {
         config['data-strict'] = 1;
       } else {
@@ -111,18 +116,16 @@ var Giscus = /*#__PURE__*/function (_Component) {
       } else {
         config['data-input-position'] = 'top';
       }
-      if (theme) {
-        if (theme === 'custom') {
-          if (customThemeCss) {
-            config['data-theme'] = customThemeCss;
-          } else {
-            return (0, _inferno.createVNode)(1, "div", "notification is-danger", [(0, _inferno.createTextVNode)("You set "), (0, _inferno.createVNode)(1, "code", null, "theme", 16), (0, _inferno.createTextVNode)(" to "), (0, _inferno.createVNode)(1, "code", null, "custom", 16), (0, _inferno.createTextVNode)(", but did not apply a"), (0, _inferno.createTextVNode)(' '), (0, _inferno.createVNode)(1, "code", null, "customThemeCss", 16), (0, _inferno.createTextVNode)(" for Giscus. Please set it in "), (0, _inferno.createVNode)(1, "code", null, "_config.yml", 16), (0, _inferno.createTextVNode)(".")], 0);
-          }
+      // Use the dark theme when the page looks dark, unless the theme is custom
+      var dynamicConfig = {};
+      if (theme === 'custom') {
+        if (customThemeCss) {
+          config['data-theme'] = customThemeCss;
         } else {
-          config['data-theme'] = theme;
+          return (0, _inferno.createVNode)(1, "div", "notification is-danger", [(0, _inferno.createTextVNode)("You set "), (0, _inferno.createVNode)(1, "code", null, "theme", 16), (0, _inferno.createTextVNode)(" to "), (0, _inferno.createVNode)(1, "code", null, "custom", 16), (0, _inferno.createTextVNode)(", but did not apply a"), (0, _inferno.createTextVNode)(' '), (0, _inferno.createVNode)(1, "code", null, "customThemeCss", 16), (0, _inferno.createTextVNode)(" for Giscus. Please set it in "), (0, _inferno.createVNode)(1, "code", null, "_config.yml", 16), (0, _inferno.createTextVNode)(".")], 0);
         }
       } else {
-        config['data-theme'] = 'noborder_light';
+        dynamicConfig['data-theme'] = "".concat(isDark(), " ? ").concat(toJs(darkTheme || 'noborder_dark'), " : ").concat(toJs(theme || 'noborder_light'));
       }
       if (lang) {
         config['data-lang'] = lang;
@@ -132,12 +135,17 @@ var Giscus = /*#__PURE__*/function (_Component) {
       if (lazy) {
         config['data-loading'] = 'lazy';
       }
-      return (0, _inferno.normalizeProps)((0, _inferno.createVNode)(1, "script", null, null, 1, _objectSpread(_objectSpread({
-        "src": "https://giscus.app/client.js"
-      }, config), {}, {
-        "crossorigin": "anonymous",
-        "async": true
-      })));
+      config.crossorigin = 'anonymous';
+      // Giscus puts its iframe into the element with the giscus class, so add its script to <head> to
+      // keep the number of scripts in the comment section the same for PJAX
+      var js = appendScript('head', 'https://giscus.app/client.js', config, dynamicConfig);
+      return (0, _inferno.createFragment)([(0, _inferno.createVNode)(1, "div", "giscus", null, 1, {
+        "id": "giscus-thread"
+      }), (0, _inferno.createVNode)(1, "script", null, null, 1, {
+        "dangerouslySetInnerHTML": {
+          __html: js
+        }
+      })], 4);
     }
   }]);
 }(Component);
@@ -161,6 +169,7 @@ var Giscus = /*#__PURE__*/function (_Component) {
  *         emitMetadata: {false}
  *         inputPosition: "******"
  *         theme: "******"
+ *         darkTheme: "******"
  *         lang: "******"
  *         lazy: "******"
  *     }} />
@@ -178,6 +187,7 @@ Giscus.Cacheable = cacheComponent(Giscus, 'comment.giscus', function (props) {
     emitMetadata = _props$comment.emitMetadata,
     inputPosition = _props$comment.inputPosition,
     theme = _props$comment.theme,
+    darkTheme = _props$comment.darkTheme,
     customThemeCss = _props$comment.customThemeCss,
     lang = _props$comment.lang,
     lazy = _props$comment.lazy;
@@ -193,6 +203,7 @@ Giscus.Cacheable = cacheComponent(Giscus, 'comment.giscus', function (props) {
     emitMetadata: emitMetadata,
     inputPosition: inputPosition,
     theme: theme,
+    darkTheme: darkTheme,
     customThemeCss: customThemeCss,
     lang: lang,
     lazy: lazy

package/lib/view/comment/gitalk.js

@@ -24,6 +24,7 @@ var _require = require('inferno'),
 var _require2 = require('../../util/cache'),
   cacheComponent = _require2.cacheComponent;
 var loadScripts = require('../../util/script');
+var toJs = loadScripts.toJs;
 
 /**
  * Gitalk comment JSX component.
@@ -74,14 +75,15 @@ var Gitalk = /*#__PURE__*/function (_Component) {
         perPage = _this$props$perPage === void 0 ? 10 : _this$props$perPage,
         proxy = _this$props.proxy,
         flipMoveOptions = _this$props.flipMoveOptions,
-        enableHotKey = _this$props.enableHotKey,
+        _this$props$enableHot = _this$props.enableHotKey,
+        enableHotKey = _this$props$enableHot === void 0 ? true : _this$props$enableHot,
         language = _this$props.language,
         jsUrl = _this$props.jsUrl,
         cssUrl = _this$props.cssUrl;
       if (!id || !repo || !owner || !admin || !clientId || !clientSecret) {
         return (0, _inferno.createVNode)(1, "div", "notification is-danger", [(0, _inferno.createTextVNode)("You forgot to set the "), (0, _inferno.createVNode)(1, "code", null, "owner", 16), (0, _inferno.createTextVNode)(", "), (0, _inferno.createVNode)(1, "code", null, "admin", 16), (0, _inferno.createTextVNode)(", "), (0, _inferno.createVNode)(1, "code", null, "repo", 16), (0, _inferno.createTextVNode)(","), (0, _inferno.createVNode)(1, "code", null, "client_id", 16), (0, _inferno.createTextVNode)(", or "), (0, _inferno.createVNode)(1, "code", null, "client_secret", 16), (0, _inferno.createTextVNode)(" for Gitalk. Please set it in"), (0, _inferno.createTextVNode)(' '), (0, _inferno.createVNode)(1, "code", null, "_config.yml", 16), (0, _inferno.createTextVNode)(".")], 0);
       }
-      var js = "var gitalk = new Gitalk({\n            id: ".concat(JSON.stringify(id), ",\n            repo: ").concat(JSON.stringify(repo), ",\n            owner: ").concat(JSON.stringify(owner), ",\n            clientID: ").concat(JSON.stringify(clientId), ",\n            clientSecret: ").concat(JSON.stringify(clientSecret), ",\n            admin: ").concat(JSON.stringify(admin), ",\n            createIssueManually: ").concat(!!createIssueManually, ",\n            distractionFreeMode: ").concat(!!distractionFreeMode, ",\n            perPage: ").concat(JSON.stringify(perPage), ",\n            pagerDirection: ").concat(JSON.stringify(pagerDirection), ",\n            ").concat(proxy ? "proxy: ".concat(JSON.stringify(proxy), ",") : '', "\n            ").concat(flipMoveOptions ? "flipMoveOptions: ".concat(JSON.stringify(flipMoveOptions), ",") : '', "\n            enableHotKey: ").concat(enableHotKey ? !!enableHotKey : true, ",\n            ").concat(language ? "language: ".concat(JSON.stringify(language), ",") : '', "\n        })\n        gitalk.render('comment-container')");
+      var js = "var gitalk = new Gitalk({\n            id: ".concat(toJs(id), ",\n            repo: ").concat(toJs(repo), ",\n            owner: ").concat(toJs(owner), ",\n            clientID: ").concat(toJs(clientId), ",\n            clientSecret: ").concat(toJs(clientSecret), ",\n            admin: ").concat(toJs(admin), ",\n            createIssueManually: ").concat(!!createIssueManually, ",\n            distractionFreeMode: ").concat(!!distractionFreeMode, ",\n            perPage: ").concat(toJs(perPage), ",\n            pagerDirection: ").concat(toJs(pagerDirection), ",\n            ").concat(proxy ? "proxy: ".concat(toJs(proxy), ",") : '', "\n            ").concat(flipMoveOptions ? "flipMoveOptions: ".concat(toJs(flipMoveOptions), ",") : '', "\n            enableHotKey: ").concat(!!enableHotKey, ",\n            ").concat(language ? "language: ".concat(toJs(language), ",") : '', "\n        })\n        gitalk.render('comment-container')");
       return (0, _inferno.createFragment)([(0, _inferno.createVNode)(1, "div", null, null, 1, {
         "id": "comment-container"
       }), (0, _inferno.createVNode)(1, "link", null, null, 1, {

package/lib/view/comment/gitment.js

@@ -25,11 +25,15 @@ var _require = require('inferno'),
 var _require2 = require('../../util/cache'),
   cacheComponent = _require2.cacheComponent;
 var loadScripts = require('../../util/script');
+var toJs = loadScripts.toJs;
+var _require3 = require('../../util/deprecate'),
+  deprecate = _require3.deprecate;
 
 /**
  * Gitment comment JSX component.
  *
- * @deprecated
+ * @deprecated Gitment is no longer maintained, and the GitHub sign-in proxy it uses no longer works. Use
+ *     Giscus, Utterances or Gitalk instead.
  * @see https://github.com/imsun/gitment
  * @example
  * <Gitment
@@ -50,6 +54,7 @@ var Gitment = /*#__PURE__*/function (_Component) {
   return _createClass(Gitment, [{
     key: "render",
     value: function render() {
+      deprecate('comment.gitment', 'Gitment is no longer maintained, and the GitHub sign-in proxy it uses no longer works. Use Giscus, Utterances or Gitalk instead.');
       var _this$props = this.props,
         id = _this$props.id,
         repo = _this$props.repo,
@@ -63,7 +68,7 @@ var Gitment = /*#__PURE__*/function (_Component) {
       if (!id || !repo || !owner || !clientId || !clientSecret) {
         return (0, _inferno.createVNode)(1, "div", "notification is-danger", [(0, _inferno.createTextVNode)("You forgot to set the "), (0, _inferno.createVNode)(1, "code", null, "owner", 16), (0, _inferno.createTextVNode)(", "), (0, _inferno.createVNode)(1, "code", null, "repo", 16), (0, _inferno.createTextVNode)(", "), (0, _inferno.createVNode)(1, "code", null, "clientId", 16), (0, _inferno.createTextVNode)(", or"), (0, _inferno.createTextVNode)(' '), (0, _inferno.createVNode)(1, "code", null, "clientSecret", 16), (0, _inferno.createTextVNode)(" for Gitment. Please set it in "), (0, _inferno.createVNode)(1, "code", null, "_config.yml", 16), (0, _inferno.createTextVNode)(".")], 0);
       }
-      var js = "var gitment = new Gitment({\n            id: '".concat(id, "',\n            repo: '").concat(repo, "',\n            owner: '").concat(owner, "',\n            oauth: {\n                client_id: '").concat(clientId, "',\n                client_secret: '").concat(clientSecret, "',\n            },\n            perPage: ").concat(perPage, ",\n            maxCommentHeight: ").concat(maxCommentHeight, "\n        })\n        gitment.render('comment-container')");
+      var js = "var gitment = new Gitment({\n            id: ".concat(toJs(id), ",\n            repo: ").concat(toJs(repo), ",\n            owner: ").concat(toJs(owner), ",\n            oauth: {\n                client_id: ").concat(toJs(clientId), ",\n                client_secret: ").concat(toJs(clientSecret), ",\n            },\n            perPage: ").concat(toJs(perPage), ",\n            maxCommentHeight: ").concat(toJs(maxCommentHeight), "\n        })\n        gitment.render('comment-container')");
       return (0, _inferno.createFragment)([(0, _inferno.createVNode)(1, "div", null, null, 1, {
         "id": "comment-container"
       }), (0, _inferno.createVNode)(1, "link", null, null, 1, {

package/lib/view/comment/isso.js

@@ -22,6 +22,8 @@ var _require = require('inferno'),
   Component = _require.Component;
 var _require2 = require('../../util/cache'),
   cacheComponent = _require2.cacheComponent;
+var _require3 = require('../../util/script'),
+  toJs = _require3.toJs;
 
 /**
  * Isso comment JSX component.
@@ -43,9 +45,11 @@ var Isso = /*#__PURE__*/function (_Component) {
       if (!url) {
         return (0, _inferno.createVNode)(1, "div", "notification is-danger", [(0, _inferno.createTextVNode)("You forgot to set the "), (0, _inferno.createVNode)(1, "code", null, "url", 16), (0, _inferno.createTextVNode)(" for Isso. Please set it in "), (0, _inferno.createVNode)(1, "code", null, "_config.yml", 16), (0, _inferno.createTextVNode)(".")], 4);
       }
+      // The URL can be given with or without the protocol
+      var host = url.replace(/^(https?:)?\/\//i, '').replace(/\/+$/, '');
       // Isso renders the thread as soon as its script runs, so add a new script every time this code
       // runs (e.g., again by PJAX after switching pages) instead of loading it only once.
-      var js = "(function () {\n      var script = document.createElement('script');\n      script.src = ".concat(JSON.stringify("//".concat(url, "/js/embed.min.js")), ";\n      script.async = true;\n      script.setAttribute('data-isso', ").concat(JSON.stringify('//' + url), ");\n      document.head.appendChild(script);\n    })();");
+      var js = "(function () {\n      var script = document.createElement('script');\n      script.src = ".concat(toJs("//".concat(host, "/js/embed.min.js")), ";\n      script.async = true;\n      script.setAttribute('data-isso', ").concat(toJs('//' + host), ");\n      document.head.appendChild(script);\n    })();");
       return (0, _inferno.createFragment)([(0, _inferno.createVNode)(1, "div", null, null, 1, {
         "id": "isso-thread"
       }), (0, _inferno.createVNode)(1, "script", null, null, 1, {

package/lib/view/comment/twikoo.js

@@ -24,6 +24,7 @@ var _require = require('inferno'),
 var _require2 = require('../../util/cache'),
   cacheComponent = _require2.cacheComponent;
 var loadScripts = require('../../util/script');
+var toJs = loadScripts.toJs;
 
 /**
  * Twikoo comment JSX component.
@@ -50,7 +51,10 @@ var Twikoo = /*#__PURE__*/function (_Component) {
         region = _this$props.region,
         lang = _this$props.lang,
         jsUrl = _this$props.jsUrl;
-      var js = "twikoo.init({\n            envId: '".concat(envId, "',\n            ").concat(region ? "region: ".concat(JSON.stringify(region), ",") : '', "\n            ").concat(lang ? "lang: ".concat(JSON.stringify(lang), ",") : '', "\n        });");
+      if (!envId) {
+        return (0, _inferno.createVNode)(1, "div", "notification is-danger", [(0, _inferno.createTextVNode)("You forgot to set the "), (0, _inferno.createVNode)(1, "code", null, "env_id", 16), (0, _inferno.createTextVNode)(" for Twikoo. Please set it in"), (0, _inferno.createTextVNode)(' '), (0, _inferno.createVNode)(1, "code", null, "_config.yml", 16), (0, _inferno.createTextVNode)(".")], 0);
+      }
+      var js = "twikoo.init({\n            envId: ".concat(toJs(envId), ",\n            ").concat(region ? "region: ".concat(toJs(region), ",") : '', "\n            ").concat(lang ? "lang: ".concat(toJs(lang), ",") : '', "\n        });");
       return (0, _inferno.createFragment)([(0, _inferno.createVNode)(1, "div", "content twikoo", null, 1, {
         "id": "twikoo"
       }), (0, _inferno.createVNode)(1, "script", null, null, 1, {

package/lib/view/comment/utterances.js

@@ -2,9 +2,6 @@
 
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 var _inferno = require("inferno");
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
 function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
 function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
@@ -25,6 +22,11 @@ var _require = require('inferno'),
   Component = _require.Component;
 var _require2 = require('../../util/cache'),
   cacheComponent = _require2.cacheComponent;
+var _require3 = require('../../util/script'),
+  appendScript = _require3.appendScript,
+  toJs = _require3.toJs;
+var _require4 = require('../../util/appearance'),
+  isDark = _require4.isDark;
 
 /**
  * Utterances comment JSX component.
@@ -36,7 +38,8 @@ var _require2 = require('../../util/cache'),
  *     issueTerm="******"
  *     issueNumber={123}
  *     label="******"
- *     theme="******" />
+ *     theme="******"
+ *     darkTheme="******" />
  */
 var Utterances = /*#__PURE__*/function (_Component) {
   function Utterances() {
@@ -52,7 +55,8 @@ var Utterances = /*#__PURE__*/function (_Component) {
         issueTerm = _this$props.issueTerm,
         issueNumber = _this$props.issueNumber,
         label = _this$props.label,
-        theme = _this$props.theme;
+        theme = _this$props.theme,
+        darkTheme = _this$props.darkTheme;
       if (!repo || !issueTerm && !issueNumber) {
         return (0, _inferno.createVNode)(1, "div", "notification is-danger", [(0, _inferno.createTextVNode)("You forgot to set the "), (0, _inferno.createVNode)(1, "code", null, "repo", 16), (0, _inferno.createTextVNode)(", "), (0, _inferno.createVNode)(1, "code", null, "issue_term", 16), (0, _inferno.createTextVNode)(", or"), (0, _inferno.createTextVNode)(' '), (0, _inferno.createVNode)(1, "code", null, "issue_number", 16), (0, _inferno.createTextVNode)(" for Utterances. Please set it in "), (0, _inferno.createVNode)(1, "code", null, "_config.yml", 16), (0, _inferno.createTextVNode)(".")], 0);
       }
@@ -67,15 +71,18 @@ var Utterances = /*#__PURE__*/function (_Component) {
       if (label) {
         config.label = label;
       }
-      if (theme) {
-        config.theme = theme;
-      }
-      return (0, _inferno.normalizeProps)((0, _inferno.createVNode)(1, "script", null, null, 1, _objectSpread(_objectSpread({
-        "src": "https://utteranc.es/client.js"
-      }, config), {}, {
-        "crossorigin": "anonymous",
-        "async": true
-      })));
+      config.crossorigin = 'anonymous';
+      // Use the dark theme when the page looks dark
+      var js = appendScript('#utterances-thread', 'https://utteranc.es/client.js', config, {
+        theme: "".concat(isDark(), " ? ").concat(toJs(darkTheme || 'github-dark'), " : ").concat(toJs(theme || 'github-light'))
+      });
+      return (0, _inferno.createFragment)([(0, _inferno.createVNode)(1, "div", null, null, 1, {
+        "id": "utterances-thread"
+      }), (0, _inferno.createVNode)(1, "script", null, null, 1, {
+        "dangerouslySetInnerHTML": {
+          __html: js
+        }
+      })], 4);
     }
   }]);
 }(Component);
@@ -94,6 +101,7 @@ var Utterances = /*#__PURE__*/function (_Component) {
  *         issue_number: {123}
  *         label: "******"
  *         theme: "******"
+ *         dark_theme: "******"
  *     }} />
  */
 Utterances.Cacheable = cacheComponent(Utterances, 'comment.utterances', function (props) {
@@ -102,13 +110,15 @@ Utterances.Cacheable = cacheComponent(Utterances, 'comment.utterances', function
     issue_term = _props$comment.issue_term,
     issue_number = _props$comment.issue_number,
     label = _props$comment.label,
-    theme = _props$comment.theme;
+    theme = _props$comment.theme,
+    dark_theme = _props$comment.dark_theme;
   return {
     repo: repo,
     issueTerm: issue_term,
     issueNumber: issue_number,
     label: label,
-    theme: theme
+    theme: theme,
+    darkTheme: dark_theme
   };
 });
 module.exports = Utterances;

package/lib/view/comment/valine.js

@@ -23,10 +23,15 @@ var _require = require('inferno'),
 var _require2 = require('../../util/cache'),
   cacheComponent = _require2.cacheComponent;
 var loadScripts = require('../../util/script');
+var toJs = loadScripts.toJs;
+var _require3 = require('../../util/deprecate'),
+  deprecate = _require3.deprecate;
 
 /**
  * Valine comment JSX component.
  *
+ * @deprecated LeanCloud, where Valine stores the comments, shuts down on January 12, 2027. Use Waline,
+ *     Twikoo or another comment system instead.
  * @see https://valine.js.org/quickstart.html
  * @example
  * <Valine
@@ -57,6 +62,7 @@ var Valine = /*#__PURE__*/function (_Component) {
   return _createClass(Valine, [{
     key: "render",
     value: function render() {
+      deprecate('comment.valine', 'LeanCloud, where Valine stores the comments, shuts down on January 12, 2027. Use Waline, Twikoo or another comment system instead.');
       var _this$props = this.props,
         appId = _this$props.appId,
         appKey = _this$props.appKey,
@@ -91,7 +97,7 @@ var Valine = /*#__PURE__*/function (_Component) {
       if (!appId || !appKey) {
         return (0, _inferno.createVNode)(1, "div", "notification is-danger", [(0, _inferno.createTextVNode)("You forgot to set the "), (0, _inferno.createVNode)(1, "code", null, "app_id", 16), (0, _inferno.createTextVNode)(" or "), (0, _inferno.createVNode)(1, "code", null, "app_key", 16), (0, _inferno.createTextVNode)(" for Valine. Please set it in "), (0, _inferno.createVNode)(1, "code", null, "_config.yml", 16), (0, _inferno.createTextVNode)(".")], 4);
       }
-      var js = "new Valine({\n            el: '#valine-thread',\n            appId: ".concat(JSON.stringify(appId), ",\n            appKey: ").concat(JSON.stringify(appKey), ",\n            ").concat(placeholder ? "placeholder: ".concat(JSON.stringify(placeholder), ",") : '', "\n            ").concat(avatar ? "avatar: ".concat(JSON.stringify(avatar), ",") : '', "\n            ", "avatarForce: ".concat(JSON.stringify(avatarForce), ","), "\n            ").concat(meta ? "meta: ".concat(JSON.stringify(meta), ",") : '', "\n            ").concat(pageSize ? "pageSize: ".concat(JSON.stringify(pageSize), ",") : '', "\n            ").concat(lang ? "lang: ".concat(JSON.stringify(lang), ",") : '', "\n            ", "visitor: ".concat(JSON.stringify(visitor), ","), "\n            ", "highlight: ".concat(JSON.stringify(highlight), ","), "\n            ", "recordIP: ".concat(JSON.stringify(recordIP), ","), "\n            ").concat(serverURLs ? "serverURLs: ".concat(JSON.stringify(serverURLs), ",") : '', "\n            ").concat(emojiCDN ? "emojiCDN: ".concat(JSON.stringify(emojiCDN), ",") : '', "\n            ").concat(emojiMaps ? "emojiMaps: ".concat(JSON.stringify(emojiMaps), ",") : '', "\n            ", "enableQQ: ".concat(JSON.stringify(enableQQ), ","), "\n            ").concat(Array.isArray(fields) ? "requiredFields: ".concat(JSON.stringify(fields), ",") : '', "\n        });");
+      var js = "new Valine({\n            el: '#valine-thread',\n            appId: ".concat(toJs(appId), ",\n            appKey: ").concat(toJs(appKey), ",\n            ").concat(placeholder ? "placeholder: ".concat(toJs(placeholder), ",") : '', "\n            ").concat(avatar ? "avatar: ".concat(toJs(avatar), ",") : '', "\n            ", "avatarForce: ".concat(toJs(avatarForce), ","), "\n            ").concat(meta ? "meta: ".concat(toJs(meta), ",") : '', "\n            ").concat(pageSize ? "pageSize: ".concat(toJs(pageSize), ",") : '', "\n            ").concat(lang ? "lang: ".concat(toJs(lang), ",") : '', "\n            ", "visitor: ".concat(toJs(visitor), ","), "\n            ", "highlight: ".concat(toJs(highlight), ","), "\n            ", "recordIP: ".concat(toJs(recordIP), ","), "\n            ").concat(serverURLs ? "serverURLs: ".concat(toJs(serverURLs), ",") : '', "\n            ").concat(emojiCDN ? "emojiCDN: ".concat(toJs(emojiCDN), ",") : '', "\n            ").concat(emojiMaps ? "emojiMaps: ".concat(toJs(emojiMaps), ",") : '', "\n            ", "enableQQ: ".concat(toJs(enableQQ), ","), "\n            ").concat(Array.isArray(fields) ? "requiredFields: ".concat(toJs(fields), ",") : '', "\n        });");
       return (0, _inferno.createFragment)([(0, _inferno.createVNode)(1, "div", "content", null, 1, {
         "id": "valine-thread"
       }), (0, _inferno.createVNode)(1, "script", null, null, 1, {

package/lib/view/comment/waline.js

@@ -22,6 +22,10 @@ var _require = require('inferno'),
   Component = _require.Component;
 var _require2 = require('../../util/cache'),
   cacheComponent = _require2.cacheComponent;
+var _require3 = require('../../util/script'),
+  toJs = _require3.toJs;
+var _require4 = require('../../util/appearance'),
+  getAppearance = _require4.getAppearance;
 
 /**
  * Waline comment JSX component.
@@ -61,15 +65,13 @@ var Waline = /*#__PURE__*/function (_Component) {
     value: function render() {
       var _this$props = this.props,
         serverURL = _this$props.serverURL,
-        _this$props$path = _this$props.path,
-        path = _this$props$path === void 0 ? 'window.location.pathname' : _this$props$path,
+        path = _this$props.path,
         _this$props$lang = _this$props.lang,
         lang = _this$props$lang === void 0 ? 'zh-CN' : _this$props$lang,
         locale = _this$props.locale,
         _this$props$emoji = _this$props.emoji,
         emoji = _this$props$emoji === void 0 ? ['https://cdn.jsdelivr.net/gh/walinejs/emojis/weibo'] : _this$props$emoji,
-        _this$props$dark = _this$props.dark,
-        dark = _this$props$dark === void 0 ? '' : _this$props$dark,
+        dark = _this$props.dark,
         _this$props$meta = _this$props.meta,
         meta = _this$props$meta === void 0 ? ['nick', 'mail', 'link'] : _this$props$meta,
         _this$props$requiredM = _this$props.requiredMeta,
@@ -80,14 +82,10 @@ var Waline = /*#__PURE__*/function (_Component) {
         wordLimit = _this$props$wordLimit === void 0 ? 0 : _this$props$wordLimit,
         _this$props$pageSize = _this$props.pageSize,
         pageSize = _this$props$pageSize === void 0 ? 10 : _this$props$pageSize,
-        _this$props$imageUplo = _this$props.imageUploader,
-        imageUploader = _this$props$imageUplo === void 0 ? false : _this$props$imageUplo,
-        _this$props$highlight = _this$props.highlighter,
-        highlighter = _this$props$highlight === void 0 ? false : _this$props$highlight,
-        _this$props$texRender = _this$props.texRenderer,
-        texRenderer = _this$props$texRender === void 0 ? false : _this$props$texRender,
-        _this$props$search = _this$props.search,
-        search = _this$props$search === void 0 ? false : _this$props$search,
+        imageUploader = _this$props.imageUploader,
+        highlighter = _this$props.highlighter,
+        texRenderer = _this$props.texRenderer,
+        search = _this$props.search,
         _this$props$pageview = _this$props.pageview,
         pageview = _this$props$pageview === void 0 ? false : _this$props$pageview,
         _this$props$comment = _this$props.comment,
@@ -99,7 +97,18 @@ var Waline = /*#__PURE__*/function (_Component) {
       if (!serverURL) {
         return (0, _inferno.createVNode)(1, "div", "notification is-danger", [(0, _inferno.createTextVNode)("You forgot to set the "), (0, _inferno.createVNode)(1, "code", null, "server_url", 16), (0, _inferno.createTextVNode)(" for Waline. Please set it in"), (0, _inferno.createTextVNode)(' '), (0, _inferno.createVNode)(1, "code", null, "_config.yml", 16), (0, _inferno.createTextVNode)(".")], 0);
       }
-      var js = "import { init } from \"".concat(jsUrl, "\";\n        init({\n            el: '#waline-thread',\n            serverURL: ").concat(JSON.stringify(serverURL), ",\n            path: ").concat(path, ",\n            ").concat(lang ? "lang: ".concat(JSON.stringify(lang), ",") : '', "\n            ").concat(locale ? "locale: ".concat(JSON.stringify(locale), ",") : '', "\n            ").concat(emoji ? "emoji: ".concat(JSON.stringify(emoji), ",") : '', "\n            ").concat(dark ? "dark: ".concat(JSON.stringify(dark), ",") : '', "\n            ").concat(meta ? "meta: ".concat(JSON.stringify(meta), ",") : '', "\n            ").concat(Array.isArray(requiredMeta) ? "requiredMeta: ".concat(JSON.stringify(requiredMeta), ",") : '', "\n            ").concat(login ? "login: ".concat(JSON.stringify(login), ",") : '', "\n            ").concat(wordLimit ? "wordLimit: ".concat(JSON.stringify(wordLimit), ",") : '', "\n            ").concat(pageSize ? "pageSize: ".concat(JSON.stringify(pageSize), ",") : '', "\n            ").concat(imageUploader === false ? "imageUploader: false," : '', "\n            ").concat(highlighter === false ? "highlighter: false," : '', "\n            ").concat(texRenderer === false ? "texRenderer: false," : '', "\n            ").concat(search === false ? "search: false," : '', "\n            ").concat(typeof pageview !== 'undefined' ? "pageview: ".concat(JSON.stringify(pageview), ",") : '', "\n            ").concat(typeof comment !== 'undefined' ? "comment: ".concat(JSON.stringify(comment), ",") : '', "\n            ", "copyright: ".concat(JSON.stringify(copyright), ","), "\n        });");
+      // Without the dark option, follow the appearance of the page: the system color scheme for the auto
+      // appearance, or the data-appearance="dark" attribute of <html> otherwise
+      var darkOption = dark === null || typeof dark === 'undefined' || dark === '' ? "".concat(getAppearance(), " === 'auto' ? 'auto' : 'html[data-appearance=\"dark\"]'") : toJs(dark);
+      // A path, such as /posts/hello/, or a JavaScript expression, such as window.location.pathname
+      var pathCode = path || 'window.location.pathname';
+      if (pathCode.startsWith('/')) {
+        pathCode = toJs(pathCode);
+      }
+      // Use a classic script with a dynamic import instead of a module script, so that PJAX, which only
+      // runs classic scripts, initializes Waline again after switching pages. The previous instance,
+      // whose element PJAX has replaced, is destroyed first.
+      var js = "import(".concat(toJs(jsUrl), ").then(function (Waline) {\n        if (window.__walineInstance) {\n            window.__walineInstance.destroy();\n        }\n        window.__walineInstance = Waline.init({\n            el: '#waline-thread',\n            serverURL: ").concat(toJs(serverURL), ",\n            path: ").concat(pathCode, ",\n            ").concat(lang ? "lang: ".concat(toJs(lang), ",") : '', "\n            ").concat(locale ? "locale: ".concat(toJs(locale), ",") : '', "\n            ").concat(emoji ? "emoji: ".concat(toJs(emoji), ",") : '', "\n            dark: ").concat(darkOption, ",\n            ").concat(meta ? "meta: ".concat(toJs(meta), ",") : '', "\n            ").concat(Array.isArray(requiredMeta) ? "requiredMeta: ".concat(toJs(requiredMeta), ",") : '', "\n            ").concat(login ? "login: ".concat(toJs(login), ",") : '', "\n            ").concat(wordLimit ? "wordLimit: ".concat(toJs(wordLimit), ",") : '', "\n            ").concat(pageSize ? "pageSize: ".concat(toJs(pageSize), ",") : '', "\n            ").concat(imageUploader === false ? "imageUploader: false," : '', "\n            ").concat(highlighter === false ? "highlighter: false," : '', "\n            ").concat(texRenderer === false ? "texRenderer: false," : '', "\n            ").concat(search === false ? "search: false," : '', "\n            ").concat(typeof pageview !== 'undefined' ? "pageview: ".concat(toJs(pageview), ",") : '', "\n            ").concat(typeof comment !== 'undefined' ? "comment: ".concat(toJs(comment), ",") : '', "\n            ", "copyright: ".concat(toJs(copyright), ","), "\n        });\n    });");
       return (0, _inferno.createFragment)([(0, _inferno.createVNode)(1, "div", "content", null, 1, {
         "id": "waline-thread"
       }), (0, _inferno.createVNode)(1, "link", null, null, 1, {
@@ -108,7 +117,6 @@ var Waline = /*#__PURE__*/function (_Component) {
         "media": "print",
         "onload": "this.media='all'"
       }), (0, _inferno.createVNode)(1, "script", null, null, 1, {
-        "type": "module",
         "dangerouslySetInnerHTML": {
           __html: js
         }
@@ -137,10 +145,10 @@ var Waline = /*#__PURE__*/function (_Component) {
  *         login: false,
  *         word_limit: 0,
  *         page_size: 10,
- *         image_uploader: true,
- *         highlighter: true,
+ *         image_uploader: false,
+ *         highlighter: false,
  *         tex_renderer: false,
- *         search: true,
+ *         search: false,
  *         pageview: false,
  *         comment: false,
  *         copyright: true,
@@ -164,10 +172,12 @@ Waline.Cacheable = cacheComponent(Waline, 'comment.waline', function (props) {
     login: comment.login,
     wordLimit: comment.word_limit,
     pageSize: comment.page_size,
-    imageUploader: comment.image_uploader,
-    highlighter: comment.highlighter,
-    texRenderer: comment.tex_renderer,
-    search: comment.search,
+    // These options of the theme config disable the features when they are true, which Waline does
+    // when its options are false
+    imageUploader: comment.image_uploader === true ? false : undefined,
+    highlighter: comment.highlighter === true ? false : undefined,
+    texRenderer: comment.tex_renderer === true ? false : undefined,
+    search: comment.search === true ? false : undefined,
     pageview: comment.pageview,
     comment: comment.comment,
     copyright: comment.copyright,

package/lib/view/donate/afdian.js

@@ -75,7 +75,7 @@ Afdian.Cacheable = cacheComponent(Afdian, 'donate.afdian', function (props) {
     helper = props.helper;
   return {
     title: helper.__('donate.' + donate.type),
-    url: helper.url_for(donate.url)
+    url: donate.url ? helper.url_for(donate.url) : null
   };
 });
 module.exports = Afdian;

package/lib/view/donate/alipay.js

@@ -75,7 +75,7 @@ Alipay.Cacheable = cacheComponent(Alipay, 'donate.alipay', function (props) {
     helper = props.helper;
   return {
     title: helper.__('donate.' + donate.type),
-    qrcode: helper.url_for(donate.qrcode)
+    qrcode: donate.qrcode ? helper.url_for(donate.qrcode) : null
   };
 });
 module.exports = Alipay;

package/lib/view/donate/buymeacoffee.js

@@ -74,7 +74,7 @@ BuyMeACoffee.Cacheable = cacheComponent(BuyMeACoffee, 'donate.buymeacoffee', fun
   var donate = props.donate,
     helper = props.helper;
   return {
-    url: helper.url_for(donate.url),
+    url: donate.url ? helper.url_for(donate.url) : null,
     title: helper.__('donate.' + donate.type)
   };
 });

package/lib/view/donate/patreon.js

@@ -74,7 +74,7 @@ Patreon.Cacheable = cacheComponent(Patreon, 'donate.petreon', function (props) {
   var donate = props.donate,
     helper = props.helper;
   return {
-    url: helper.url_for(donate.url),
+    url: donate.url ? helper.url_for(donate.url) : null,
     title: helper.__('donate.' + donate.type)
   };
 });

package/lib/view/donate/wechat.js

@@ -74,7 +74,7 @@ Wechat.Cacheable = cacheComponent(Wechat, 'donate.wechat', function (props) {
   var donate = props.donate,
     helper = props.helper;
   return {
-    qrcode: helper.url_for(donate.qrcode),
+    qrcode: donate.qrcode ? helper.url_for(donate.qrcode) : null,
     title: helper.__('donate.' + donate.type)
   };
 });

package/lib/view/misc/meta.js

@@ -26,6 +26,11 @@ var _require = require('inferno'),
 function trim(str) {
   return str.trim().replace(/^"(.*)"$/, '$1').replace(/^'(.*)'$/, '$1');
 }
+
+// Remove the backslashes that escape ";" and "="
+function unescape(str) {
+  return str.replace(/\\(.)/g, '$1');
+}
 function split(str, sep) {
   var result = [];
   var matched = null;
@@ -63,11 +68,12 @@ module.exports = /*#__PURE__*/function (_Component) {
         return typeof entry === 'string';
       }).map(function (entry) {
         var props = split(entry, /(?:[^\\;]+|\\.)+/g).map(function (property) {
-          var entry = split(property, /(?:[^\\=]+|\\.)+/g);
-          if (entry.length < 2) {
+          // Split at the first "=" that is not escaped, so that the value can contain "="
+          var entry = /^((?:[^\\=]|\\[^])*)=([^]*)$/.exec(property);
+          if (!entry) {
             return null;
           }
-          return _defineProperty({}, trim(entry[0]), trim(entry[1]));
+          return _defineProperty({}, unescape(trim(entry[1])), unescape(trim(entry[2])));
         }).filter(function (property) {
           return property !== null;
         }).reduce(function (prev, current) {