v2.3.3

Signed-off-by: qwqcode <qwqcode@gmail.com>

.github/workflows/npm.yml

@@ -16,7 +16,7 @@ jobs:
       uses: actions/checkout@v3
 
     - name: Use pnpm
-      uses: pnpm/action-setup@v2.2.1
+      uses: pnpm/action-setup@v2.2.2
       with:
         version: 7.1.2
 

.github/workflows/pages.yml

@@ -14,7 +14,7 @@ jobs:
       uses: actions/checkout@v3
 
     - name: Use pnpm
-      uses: pnpm/action-setup@v2.2.1
+      uses: pnpm/action-setup@v2.2.2
       with:
         version: 7.1.2
 

package.json

@@ -12,10 +12,10 @@
   "devDependencies": {
     "@rollup/plugin-dynamic-import-vars": "1.4.3",
     "@types/node": "16.11.36",
-    "@typescript-eslint/eslint-plugin": "5.25.0",
-    "@typescript-eslint/parser": "5.25.0",
+    "@typescript-eslint/eslint-plugin": "5.26.0",
+    "@typescript-eslint/parser": "5.26.0",
     "autoprefixer": "10.4.7",
-    "eslint": "8.15.0",
+    "eslint": "8.16.0",
     "eslint-config-airbnb-base": "15.0.0",
     "eslint-config-airbnb-typescript": "17.0.0",
     "eslint-config-prettier": "8.5.0",
@@ -25,10 +25,10 @@
     "less": "4.1.2",
     "postcss": "8.4.14",
     "prettier": "2.6.2",
-    "rollup": "2.74.0",
-    "typescript": "4.6.4",
+    "rollup": "2.75.3",
+    "typescript": "4.7.2",
     "vite": "2.9.9",
-    "vite-tsconfig-paths": "3.4.1"
+    "vite-tsconfig-paths": "3.5.0"
   },
   "browserslist": [
     "supports es6 and supports es6-class and supports es6-generators and supports es6-module-dynamic-import and supports es6-module and supports es6-number and supports es6-string-includes"

packages/artalk-sidebar/src/style/_variables.less

@@ -1,4 +1,4 @@
 @font-family: "Helvetica Neue", "PingFangSC-Light", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
 @font-size: 14px;
 @line-height: 1.6em;
-@block-radius: 4px;
+@block-radius: 6px;

packages/artalk-sidebar/src/style/sidebar.less

@@ -1,6 +1,10 @@
 @header-height: 60px;
 @nav-height: 40px;
 
+.artalk, .atk-layer-wrap {
+  font-family: @font-family;
+}
+
 .atk-sidebar {
   @width: 430px;
   position: fixed;
@@ -469,6 +473,10 @@
 .atk-view-name-pages, .atk-view-name-comments {
   padding-bottom: 55px;
 
+  .atk-comment-wrap {
+    border-bottom: 1px solid var(--at-color-border);
+  }
+
   .atk-pagination-wrap {
     z-index: 200;
     position: fixed;

packages/artalk/package.json

@@ -1,6 +1,6 @@
 {
   "name": "artalk",
-  "version": "2.3.0",
+  "version": "2.3.3",
   "backendMinVersion": "2.1.7",
   "license": "LGPL-3.0",
   "description": "A Selfhosted Comment System",

packages/artalk/src/artalk.ts

@@ -2,9 +2,11 @@ import './style/main.less'
 
 import ArtalkConfig from '~/types/artalk-config'
 import { EventPayloadMap, Handler } from '~/types/event'
+import ArtalkPlug from '~/types/plug'
 import Context from '~/types/context'
 import ConcreteContext from './context'
 import defaults from './defaults'
+import { internal as internalLocales } from './i18n'
 
 import CheckerLauncher from './lib/checker'
 import Editor from './editor'
@@ -12,9 +14,9 @@ import List from './list'
 import SidebarLayer from './layer/sidebar-layer'
 
 import Layer, { GetLayerWrap } from './layer'
-import Api from './api'
 import * as Utils from './lib/utils'
 import * as Ui from './lib/ui'
+import * as Stat from './lib/stat'
 
 /**
  * Artalk
@@ -24,90 +26,45 @@ import * as Ui from './lib/ui'
 export default class Artalk {
   public static readonly defaults: ArtalkConfig = defaults
 
-  public ctx!: Context
   public conf!: ArtalkConfig
+  public ctx!: Context
   public $root!: HTMLElement
 
-  public api!: Api
   public checkerLauncher!: CheckerLauncher
   public editor!: Editor
   public list!: List
   public sidebarLayer!: SidebarLayer
 
+  protected static Plugins: ArtalkPlug[] = [
+    Stat.PvCountWidget
+  ]
+
   constructor(customConf: Partial<ArtalkConfig>) {
-    // 配置
-    this.conf = Utils.mergeDeep(Artalk.defaults, customConf)
-    this.conf.server = this.conf.server.replace(/\/$/, '').replace(/\/api\/?$/, '')
+    /* 初始化基本配置 */
+    this.conf = Artalk.HandelBaseConf(customConf)
+    if (this.conf.el instanceof HTMLElement) this.$root = this.conf.el
 
-    // 默认 pageKey
-    if (!this.conf.pageKey) {
-      // @link http://bl.ocks.org/abernier/3070589
-      this.conf.pageKey = `${window.location.pathname}`
-    }
+    /* 初始化 Context */
+    this.ctx = new ConcreteContext(this.conf, this.$root)
 
-    // 默认 pageTitle
-    if (!this.conf.pageTitle) {
-      this.conf.pageTitle = `${document.title}`
-    }
+    // @ts-ignore 远程加载引用后端的配置
+    if (this.conf.useBackendConf) return this.loadConfRemoteAndInitComponents()
 
-    // 列表显示模式
-    if (this.conf.nestMax && this.conf.nestMax <= 1) {
-      this.conf.flatMode = true
-    }
-
-    // 装载元素
-    this.conf.el = this.conf.el || document.createElement('div') // 允许 this.conf.el 为空
-
-    if (this.conf.el instanceof HTMLElement) {
-      this.$root = this.conf.el
-    } else {
-      try {
-        const $root = document.querySelector<HTMLElement>(this.conf.el)
-        if (!$root) throw Error(`Target element "${this.conf.el}" was not found.`)
-        this.$root = $root
-      } catch (e) {
-        console.error(e)
-        throw new Error('Please check your Artalk `el` config.')
-      }
-    }
-
-    // Context 初始化
-    this.ctx = new ConcreteContext(this.$root, this.conf)
-
-    // API 初始化
-    this.api = new Api(this.ctx)
-    this.ctx.setApi(this.api)
-
-    // 界面初始化
-    this.$root.classList.add('artalk')
-    this.$root.innerHTML = ''
-
-    // 初始化组件
-    if (this.conf.useBackendConf) {
-      // 复用后端的配置
-      // @ts-ignore
-      return (async () => {
-        await this.loadConfRemote()
-        this.initCore()
-        return this // Promise<Artalk>
-      })()
-    }
-
-    this.initCore()
+    /* 初始化组件 */
+    this.initComponents()
   }
 
-  private initCore() {
-    /* 组件初始化 */
+  /** 组件初始化 */
+  private initComponents() {
+    this.initLocale()
     this.initLayer()
     this.initDarkMode()
+    Utils.initMarked(this.ctx)
 
     // CheckerLauncher
     this.checkerLauncher = new CheckerLauncher(this.ctx)
     this.ctx.setCheckerLauncher(this.checkerLauncher)
 
-    // 初始化 marked
-    Utils.initMarked(this.ctx)
-
     // 编辑器
     this.editor = new Editor(this.ctx)
     this.ctx.setEditor(this.editor)
@@ -129,18 +86,55 @@ export default class Artalk {
     // 事件绑定初始化
     this.initEventBind()
 
-    // 其他
-    this.initCountAndPV()
-
     // 插件初始化
     Artalk.Plugins.forEach(plugin => {
-      if (typeof plugin === 'function') {
+      if (typeof plugin === 'function')
         plugin(this.ctx)
-      }
     })
   }
 
-  /** 获取远程配置 */
+  /** 基本配置初始化 */
+  private static HandelBaseConf(customConf: Partial<ArtalkConfig>): ArtalkConfig {
+    // 合并默认配置
+    const conf: ArtalkConfig = Utils.mergeDeep(Artalk.defaults, customConf)
+
+    // 绑定元素
+    if (typeof conf.el === 'string' && !!conf.el) {
+      try {
+        const findEl = document.querySelector<HTMLElement>(conf.el)
+        if (!findEl) throw Error(`Target element "${conf.el}" was not found.`)
+        conf.el = findEl
+      } catch (e) {
+        console.error(e)
+        throw new Error('Please check your Artalk `el` config.')
+      }
+    }
+
+    // 服务器配置
+    conf.server = conf.server.replace(/\/$/, '').replace(/\/api\/?$/, '')
+
+    // 默认 pageKey
+    if (!conf.pageKey) {
+      // @link http://bl.ocks.org/abernier/3070589
+      conf.pageKey = `${window.location.pathname}`
+    }
+
+    // 默认 pageTitle
+    if (!conf.pageTitle) {
+      conf.pageTitle = `${document.title}`
+    }
+
+    return conf
+  }
+
+  /** 初始化组件根据远程加载的配置 */
+  private async loadConfRemoteAndInitComponents() {
+    await this.loadConfRemote()
+    this.initComponents()
+    return this
+  }
+
+  /** 远程加载配置 */
   private async loadConfRemote() {
     Ui.showLoading(this.$root)
     let backendConf = {}
@@ -151,7 +145,7 @@ export default class Artalk {
     Ui.hideLoading(this.$root)
   }
 
-  /** 事件绑定 · 初始化 */
+  /** 事件绑定初始化 */
   private initEventBind() {
     // 锚点快速跳转评论
     window.addEventListener('hashchange', () => {
@@ -166,20 +160,34 @@ export default class Artalk {
     })
   }
 
-  /** 重新加载 */
-  public reload() {
-    this.list.fetchComments(0)
+  /** 语言初始化 */
+  private initLocale() {
+    if (typeof this.conf.locale === 'string') {
+      if (this.conf.locale === 'auto') { // 自动切换
+        this.conf.locale = ((navigator.languages) ? navigator.languages[0] : navigator.language)
+      }
+
+      this.conf.locale = this.conf.locale.replace(
+        /^([a-zA-Z]+)(-[a-zA-Z]+)?$/,
+        (_, p1: string, p2: string) => (p1.toLowerCase() + (p2 || '').toUpperCase())
+      )
+
+      if (!internalLocales[this.conf.locale]) { // 语言不存在时，使用 en
+        console.log(`Locale "${this.conf.locale}" not found.`)
+        this.conf.locale = 'en'
+      }
+    }
   }
 
   /** Layer 初始化 */
-  initLayer() {
+  private initLayer() {
     // 记录页面原始 Styles
     Layer.BodyOrgOverflow = document.body.style.overflow
     Layer.BodyOrgPaddingRight = document.body.style.paddingRight
   }
 
-  /** 暗黑模式 · 初始化 */
-  public initDarkMode() {
+  /** 暗黑模式初始化 */
+  private initDarkMode() {
     if (this.conf.darkMode === 'auto') {
       // 自动切换暗黑模式，事件监听
       const darkModeMedia = window.matchMedia('(prefers-color-scheme: dark)')
@@ -190,7 +198,7 @@ export default class Artalk {
     }
   }
 
-  /** 暗黑模式 · 设定 */
+  /** 设置暗黑模式 */
   public setDarkMode(darkMode: boolean) {
     const darkModeClassName = 'atk-dark-mode'
 
@@ -214,45 +222,6 @@ export default class Artalk {
     }
   }
 
-  /** 初始化评论数和 PV 数量展示元素 */
-  public async initCountAndPV() {
-    // 评论数
-    const countEl = this.conf.countEl
-    if (countEl && document.querySelector(countEl)) {
-      this.handleStatCount({ api: 'page_comment', countEl })
-    }
-
-    // PV
-    const curtPagePvNum = await this.ctx.getApi().pv()
-    const pvEl = this.conf.pvEl
-    if (pvEl && document.querySelector(pvEl)) {
-      this.handleStatCount({ api: 'page_pv', countEl: pvEl, curtPageCount: curtPagePvNum })
-    }
-  }
-
-  private async handleStatCount(args: { api: 'page_pv'|'page_comment', countEl: string, curtPageCount?: number }) {
-    let pageCounts: {[key: string]: number} = {}
-
-    // 当前页面的统计数
-    const curtPageKey = this.ctx.conf.pageKey
-    if (args.curtPageCount) pageCounts[curtPageKey] = args.curtPageCount
-
-    // 查询其他页面的统计数
-    let queryPageKeys = Array.from(document.querySelectorAll(args.countEl))
-      .map(e => e.getAttribute('data-page-key') || curtPageKey)
-      .filter(pageKey => pageCounts[pageKey] === undefined)
-    queryPageKeys = [...new Set(queryPageKeys)] // 去重
-    if (queryPageKeys.length > 0) {
-      const counts: any = await this.ctx.getApi().stat(args.api, queryPageKeys)
-      pageCounts = { ...pageCounts, ...counts }
-    }
-
-    document.querySelectorAll(args.countEl).forEach((el) => {
-      const pageKey = el.getAttribute('data-page-key') || curtPageKey
-      el.innerHTML = `${Number(pageCounts[pageKey] || 0)}`
-    })
-  }
-
   /** 监听事件 */
   public on<K extends keyof EventPayloadMap>(name: K, handler: Handler<EventPayloadMap[K]>) {
     this.ctx.on(name, handler, 'external')
@@ -268,11 +237,20 @@ export default class Artalk {
     this.ctx.trigger(name, payload, 'external')
   }
 
-  /** Plugins */
-  protected static Plugins: ((ctx: Context) => void)[] = []
+  /** 重新加载 */
+  public reload() {
+    this.ctx.listReload()
+  }
 
-  /** Enable Plugin */
-  public static Use(plugin: ((ctx: Context) => void)) {
+  /** Use Plugin */
+  public static Use(plugin: ArtalkPlug) {
     this.Plugins.push(plugin)
   }
+
+  /** 装载数量统计元素 */
+  public static LoadCountWidget(customConf: Partial<ArtalkConfig>) {
+    const conf = this.HandelBaseConf(customConf)
+    const ctx = new ConcreteContext(conf)
+    Stat.initCountWidget({ ctx, pvAdd: false })
+  }
 }

packages/artalk/src/comment/actions.ts

@@ -1,4 +1,3 @@
-import Api from '../api'
 import Comment from './comment'
 import ActionBtn from '../components/action-btn'
 

packages/artalk/src/context.ts

@@ -37,13 +37,17 @@ export default class Context implements ContextApi {
   /* 订阅者模式 */
   private eventList: Event[] = []
 
-  public constructor($root: HTMLElement, conf: ArtalkConfig) {
+  public constructor(conf: ArtalkConfig, $root?: HTMLElement) {
     this.cid = +new Date()
     this.conf = conf
     this.user = new User(this)
 
-    this.$root = $root
+    this.$root = $root || document.createElement('div')
     this.$root.setAttribute('atk-run-id', this.cid.toString())
+    this.$root.classList.add('artalk')
+    this.$root.innerHTML = ''
+
+    this.api = new Api(this)
   }
 
   /* 设置持有的同事类 */

packages/artalk/src/editor/editor.ts

@@ -5,7 +5,6 @@ import Context from '~/types/context'
 import Component from '../lib/component'
 import * as Utils from '../lib/utils'
 import * as Ui from '../lib/ui'
-import Api from '../api'
 
 import EditorHTML from './editor.html?raw'
 

packages/artalk/src/editor/plugs/emoticons-plug.less

@@ -27,7 +27,7 @@
         padding: 5px;
         cursor: pointer;
         user-select: none;
-        border-radius: 2px;
+        border-radius: (@block-radius / 2);
         font-size: 16px;
         min-width: 35px;
 

packages/artalk/src/editor/plugs/emoticons-plug.ts

@@ -265,8 +265,8 @@ export default class EmoticonsPlug extends EditorPlug {
       }
     })
 
-    this.$grpSwitcher.querySelectorAll('span.active').forEach(item => item.classList.remove('active'))
-    this.$grpSwitcher.querySelector(`span[data-index="${index}"]`)?.classList.add('active')
+    this.$grpSwitcher?.querySelectorAll('span.active').forEach(item => item.classList.remove('active'))
+    this.$grpSwitcher?.querySelector(`span[data-index="${index}"]`)?.classList.add('active')
 
     this.changeListHeight()
   }

packages/artalk/src/editor/plugs/header-input-plug.ts

@@ -1,4 +1,3 @@
-import Api from '@/api'
 import Editor from '../editor'
 import EditorPlug from './editor-plug'
 

packages/artalk/src/editor/plugs/upload-plug.ts

@@ -1,5 +1,4 @@
 import * as Utils from '@/lib/utils'
-import Api from '@/api'
 import Editor from '../editor'
 import EditorPlug from './editor-plug'
 
@@ -83,7 +82,7 @@ export default class UploadPlug extends EditorPlug {
 
     // 未登录提示
     if (!this.ctx.user.checkHasBasicUserInfo()) {
-      this.editor.showNotify('填入你的名字邮箱才能上传哦', 'w')
+      this.editor.showNotify(this.ctx.$t('uploadLoginMsg'), 'w')
       return
     }
 
@@ -103,7 +102,7 @@ export default class UploadPlug extends EditorPlug {
         resp = await this.ctx.getApi().imgUpload(file)
       } else {
         // 使用自定义的图片上传器
-        resp = await this.ctx.conf.imgUploader(file)
+        resp = {img_url: await this.ctx.conf.imgUploader(file)}
       }
     } catch (err: any) {
       console.error(err)

packages/artalk/src/i18n/en.ts

@@ -13,6 +13,7 @@ export default {
   commentFail: 'Failed to comment',
   restoredMsg: 'Content has been restored',
   onlyAdminCanReply: 'Only admin can reply',
+  uploadLoginMsg: 'Please fill in your name and email to upload',
 
   /* List */
   counter: '{count} Comments',

packages/artalk/src/i18n/zh-CN.ts

@@ -6,7 +6,7 @@ const zhCN: I18n = {
   noComment: '「此时无声胜有声」',
   send: '发送评论',
   nick: '昵称',
-  email: '邮件',
+  email: '邮箱',
   link: '网址',
   emoticon: '表情',
   preview: '预览',
@@ -15,6 +15,7 @@ const zhCN: I18n = {
   commentFail: '评论失败',
   restoredMsg: '内容已自动恢复',
   onlyAdminCanReply: '仅管理员可评论',
+  uploadLoginMsg: '填入你的名字邮箱才能上传哦',
 
   /* List */
   counter: '{count} 条评论',

packages/artalk/src/layer/sidebar-layer.ts

@@ -6,7 +6,6 @@ import * as Utils from '@/lib/utils'
 import * as Ui from '@/lib/ui'
 import SidebarHTML from './sidebar-layer.html?raw'
 import Layer from './layer'
-import Api from '../api'
 
 export interface SidebarShowPayload {
   view?: 'comments'|'sites'|'pages'|'transfer'

packages/artalk/src/lib/checker/admin-checker.ts

@@ -1,4 +1,3 @@
-import Api from '@/api'
 import * as Utils from '../utils'
 import { Checker } from '.'
 

packages/artalk/src/lib/checker/captcha-checker.ts

@@ -1,4 +1,3 @@
-import Api from '@/api'
 import * as Utils from '../utils'
 import * as Ui from '../ui'
 import { Checker } from '.'

packages/artalk/src/lib/stat.ts

@@ -0,0 +1,63 @@
+import ContextApi from '~/types/context'
+import ArtalkPlug from '~/types/plug'
+
+export interface CountConf {
+  ctx: ContextApi
+
+  /** 是否增加当前页面 PV 数 */
+  pvAdd?: boolean
+}
+
+export const PvCountWidget: ArtalkPlug = (ctx: ContextApi) => {
+  initCountWidget({ ctx, pvAdd: true })
+}
+
+/** 初始化评论数和 PV 数量展示元素 */
+export async function initCountWidget(p: CountConf) {
+  // 评论数
+  const countEl = p.ctx.conf.countEl
+  if (countEl && document.querySelector(countEl)) {
+    handleStatCount(p, { api: 'page_comment', countEl })
+  }
+
+  // PV
+  const curtPagePvNum = p.pvAdd ? await p.ctx.getApi().pv() : undefined
+  const pvEl = p.ctx.conf.pvEl
+  if (pvEl && document.querySelector(pvEl)) {
+    handleStatCount(p, {
+      api: 'page_pv',
+      countEl: pvEl,
+      curtPageCount: curtPagePvNum,
+    })
+  }
+}
+
+export async function handleStatCount(
+  p: CountConf,
+  args: {
+    api: 'page_pv' | 'page_comment'
+    countEl: string
+    curtPageCount?: number
+  }
+) {
+  let pageCounts: { [key: string]: number } = {}
+
+  // 当前页面的统计数
+  const curtPageKey = p.ctx.conf.pageKey
+  if (args.curtPageCount) pageCounts[curtPageKey] = args.curtPageCount
+
+  // 查询其他页面的统计数
+  let queryPageKeys = Array.from(document.querySelectorAll(args.countEl))
+    .map((e) => e.getAttribute('data-page-key') || curtPageKey)
+    .filter((pageKey) => pageCounts[pageKey] === undefined)
+  queryPageKeys = [...new Set(queryPageKeys)] // 去重
+  if (queryPageKeys.length > 0) {
+    const counts: any = await p.ctx.getApi().stat(args.api, queryPageKeys)
+    pageCounts = { ...pageCounts, ...counts }
+  }
+
+  document.querySelectorAll(args.countEl).forEach((el) => {
+    const pageKey = el.getAttribute('data-page-key') || curtPageKey
+    el.innerHTML = `${Number(pageCounts[pageKey] || 0)}`
+  })
+}

packages/artalk/src/lib/ui.ts

@@ -2,7 +2,8 @@ import * as Utils from './utils'
 
 /** 显示加载 */
 export function showLoading(parentElem: HTMLElement, conf?: { transparentBg?: boolean }) {
-  let $loading = parentElem.querySelector<HTMLElement>('.atk-loading')
+  // Use :scope https://developer.mozilla.org/en-US/docs/Web/CSS/:scope
+  let $loading = parentElem.querySelector<HTMLElement>(':scope > .atk-loading')
   if (!$loading) {
     $loading = Utils.createElement(
     `<div class="atk-loading atk-fade-in" style="display: none;">
@@ -27,7 +28,7 @@ export function showLoading(parentElem: HTMLElement, conf?: { transparentBg?: bo
 
 /** 隐藏加载 */
 export function hideLoading(parentElem: HTMLElement) {
-  const $loading = parentElem.querySelector<HTMLElement>('.atk-loading')
+  const $loading = parentElem.querySelector<HTMLElement>(':scope > .atk-loading')
   if ($loading) $loading.style.display = 'none'
 }
 

packages/artalk/src/list/list-lite.ts

@@ -3,7 +3,6 @@ import Context from '~/types/context'
 import Component from '../lib/component'
 import * as Utils from '../lib/utils'
 import * as Ui from '../lib/ui'
-import Api from '../api'
 import Comment from '../comment'
 import Pagination from '../components/pagination'
 import ReadMoreBtn from '../components/read-more-btn'

packages/artalk/src/list/list.ts

@@ -4,7 +4,6 @@ import { ListData, NotifyData } from '~/types/artalk-data'
 import Context from '~/types/context'
 import * as Utils from '../lib/utils'
 import * as Ui from '../lib/ui'
-import Api from '../api'
 import ListHTML from './list.html?raw'
 import ListLite from './list-lite'
 
@@ -26,14 +25,15 @@ export default class List extends ListLite {
     this.$el = el
 
     // 平铺模式
-    let flatMode = false
-    if (this.ctx.conf.flatMode === 'auto') {
+    if (this.ctx.conf.flatMode === true) {
+      this.flatMode = true // 遵循配置总是开启平铺模式
+    } else if (this.conf.nestMax && this.conf.nestMax <= 1) {
+      this.flatMode = true // 嵌套层数值无效时，强制开启平铺模式
+    } else if (this.ctx.conf.flatMode === 'auto') {
+      // 自动判断启用平铺模式
       if (window.matchMedia("(max-width: 768px)").matches)
-        flatMode = true
-    } else if (this.ctx.conf.flatMode === true) {
-      flatMode = true
+        this.flatMode = true
     }
-    this.flatMode = flatMode
 
     // 分页模式
     this.pageMode = this.conf.pagination.readMore ? 'read-more' : 'pagination'

packages/artalk/src/style/_variables.less

@@ -1,4 +1,3 @@
-@font-family: "Helvetica Neue", "PingFangSC-Light", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
 @font-size: 14px;
 @line-height: 1.6em;
-@block-radius: 4px;
+@block-radius: 6px;

packages/artalk/src/style/comment.less

@@ -51,7 +51,7 @@
     img {
       width: 50px;
       height: 50px;
-      border-radius: 3px;
+      border-radius: (@block-radius / 2);
     }
   }
 
@@ -62,7 +62,7 @@
     & > .atk-header {
       line-height: 1;
       font-size: 13px;
-      margin-bottom: 3px;
+      margin-bottom: .5em;
       overflow: hidden;
       position: relative;
       display: flex;
@@ -114,7 +114,7 @@
         background: var(--at-color-bg-grey);
         padding: 0px 6px;
         line-height: 17px;
-        border-radius: 3px;
+        border-radius: (@block-radius / 2);
 
         &:not(:last-child) {
           margin-right: 6px;

packages/artalk/src/style/editor.less

@@ -23,7 +23,7 @@
       font-size: 14px;
       background: transparent;
       border: 2px solid transparent;
-      border-radius: calc(@block-radius / 2);
+      border-radius: (@block-radius / 2);
       padding: 6px 5px;
       resize: none;
       outline: none;
@@ -44,7 +44,7 @@
       font-size: 15px;
       background-color: var(--at-color-bg);
       border: 2px solid transparent;
-      border-radius: calc(@block-radius / 2);
+      border-radius: (@block-radius / 2);
       width: 100%;
       min-height: 120px;
       margin-top: 2px;
@@ -61,6 +61,7 @@
       background-color: var(--at-color-bg);
       border-top: 1px solid var(--at-color-border);
       padding: 5px 15px;
+      margin-top: 10px;
       // background: repeating-linear-gradient(145deg, #f2f2f2, #f2f2f2 15px, #fff 0, #fff 30px);
     }
 
@@ -68,8 +69,8 @@
       z-index: 2;
       position: absolute;
       right: 7px;
-      bottom: 8px;
-      max-width: calc(100% - 20px);
+      bottom: 2px;
+      max-width: (100% - 20px);
       height: 30px;
       line-height: 30px;
       font-size: 14px;
@@ -79,7 +80,7 @@
       text-overflow: ellipsis;
       white-space: nowrap;
       cursor: pointer;
-      border-radius: @block-radius;
+      border-radius: (@block-radius / 2);
 
       .atk-text {
       }
@@ -125,11 +126,12 @@
 
     .atk-plug-btn {
       padding: 0 8px;
+      line-height: 24px;
       cursor: pointer;
       color: var(--at-color-grey);
       font-size: @font-size;
       user-select: none;
-      border-radius: @block-radius;
+      border-radius: (@block-radius / 2);
 
       &:not(:last-child) {
         margin-right: 2px;
@@ -169,7 +171,7 @@
       cursor: pointer;
       transition: opacity 0.3s ease-in-out;
       outline: none;
-      border-radius: @block-radius;
+      border-radius: (@block-radius / 2);
 
       &:active {
         opacity: 0.9;

packages/artalk/src/style/list.less

@@ -22,7 +22,7 @@
         border-left: 3px solid transparent;
         border-right: 3px solid transparent;
         margin-top: -1px;
-        margin-left: 0.4rem;
+        margin-left: 0.8rem;
         display: inline-block;
       }
 
@@ -46,7 +46,7 @@
         padding: 0.6rem 0;
         border: 1px solid var(--at-color-border);
         text-align: center;
-        border-radius: 0.25rem;
+        border-radius: @block-radius;
         white-space: nowrap;
         margin: 0;
         list-style: none;

packages/artalk/src/style/main.less

@@ -7,9 +7,7 @@
 }
 
 .artalk, .atk-layer-wrap {
-  line-height: @line-height;
   color: var(--at-color-font);
-  font-family: @font-family;
   word-wrap: break-word;
   word-break: break-all;
 
@@ -64,6 +62,7 @@
     padding: 10px 20px 10px 20px;
     background: var(--at-color-bg-grey);
     border-left: 4px solid #687a86;
+    color: var(--at-color-font);
   }
 
   p:first-child {
@@ -311,10 +310,10 @@ i.atk-icon {
 
       input {
         width: 100%;
-        line-height: calc(@formInputHeight + 4px);
+        line-height: (@formInputHeight + 4px);
         background-color: var(--at-color-bg);
         border: 1px solid var(--at-color-border);
-        border-radius: calc(@block-radius / 2);
+        border-radius: (@block-radius / 2);
         outline: none;
         padding: 0 6px;
         display: block;
@@ -335,7 +334,7 @@ i.atk-icon {
         border: 1px solid var(--at-color-main);
         background: transparent;
         color: var(--at-color-main);
-        border-radius: calc(@block-radius / 2);
+        border-radius: (@block-radius / 2);
         padding: 0 15px;
         line-height: @formInputHeight;
         outline: none;
@@ -405,10 +404,10 @@ i.atk-icon {
   overflow: hidden;
   background-color: #2c2c2c;
   color: #FFF;
-  border-radius: 2px;
+  border-radius: (@block-radius / 2);
   cursor: pointer;
   font-size: 14px;
-  padding: 4px 15px;
+  padding: 5px 15px;
 
   &:not(:last-child) {
     margin-bottom: 3px;

packages/artalk/test/ArtalkCount.html

@@ -0,0 +1,16 @@
+<script src="../dist/Artalk.js"></script>
+
+<div class="pv" data-page-key="https://artalk.js.org/">0</div>
+<div class="pv" data-page-key="https://artalk.js.org/guide/intro.html">0</div>
+
+<div class="count" data-page-key="https://artalk.js.org/">0</div>
+<div class="count" data-page-key="https://artalk.js.org/guide/intro.html">0</div>
+
+<script>
+  var artalk = Artalk.LoadCountWidget({
+    server: 'http://localhost:23366',
+    site: 'ArtalkDocs',
+    pvEl: '.pv',
+    countEl: ".count",
+  });
+</script>

packages/artalk/test/ArtalkI18n.html

@@ -0,0 +1,15 @@
+<link rel="stylesheet" href="../dist/Artalk.css">
+<script src="../dist/Artalk.js"></script>
+
+<div id="comments"></div>
+
+<script>
+  var artalk = new Artalk({
+    el: '#comments',
+    pageKey: 'https://artalk.js.org/',
+    pageTitle: 'Artalk Home',
+    server: 'http://localhost:23366',
+    site: 'ArtalkDocs',
+    locale: 'auto',
+  });
+</script>

packages/artalk/test/ArtalkLite.html

@@ -1,15 +1,15 @@
-<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
+<!-- <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script> -->
 <link rel="stylesheet" href="../dist/ArtalkLite.css">
 <script src="../dist/ArtalkLite.js"></script>
 
 <div id="comments"></div>
 
 <script>
-    var artalk = new Artalk({
-      el: '#comments',
-      pageKey: 'https://artalk.js.org/',
-      pageTitle: 'Artalk Home',
-      server: 'http://localhost:23366',
-      site: 'ArtalkDocs',
-    });
+  var artalk = new Artalk({
+    el: '#comments',
+    pageKey: 'https://artalk.js.org/',
+    pageTitle: 'Artalk Home',
+    server: 'http://localhost:23366',
+    site: 'ArtalkDocs',
+  });
 </script>

packages/artalk/types/artalk-config.d.ts

@@ -98,7 +98,7 @@ export default interface ArtalkConfig {
   imgUpload: boolean
 
   /** 图片上传器 */
-  imgUploader?: (file: File) => Promise<{ img_url: string }>
+  imgUploader?: (file: File) => Promise<string>
 
   /** 版本检测 */
   versionCheck: boolean

packages/artalk/types/plug.d.ts

@@ -0,0 +1,4 @@
+import ContextApi from './context'
+
+type ArtalkPlug = (ctx: ContextApi) => void
+export default ArtalkPlug

packages/plugin-katex/package.json

@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "artalk": "workspace: *",
-    "katex": "^0.15.3"
+    "katex": "^0.15.6"
   },
   "devDependencies": {
     "@types/katex": "0.14.0"

pnpm-lock.yaml

@@ -6,10 +6,10 @@ importers:
     specifiers:
       '@rollup/plugin-dynamic-import-vars': 1.4.3
       '@types/node': 16.11.36
-      '@typescript-eslint/eslint-plugin': 5.25.0
-      '@typescript-eslint/parser': 5.25.0
+      '@typescript-eslint/eslint-plugin': 5.26.0
+      '@typescript-eslint/parser': 5.26.0
       autoprefixer: 10.4.7
-      eslint: 8.15.0
+      eslint: 8.16.0
       eslint-config-airbnb-base: 15.0.0
       eslint-config-airbnb-typescript: 17.0.0
       eslint-config-prettier: 8.5.0
@@ -19,30 +19,30 @@ importers:
       less: 4.1.2
       postcss: 8.4.14
       prettier: 2.6.2
-      rollup: 2.74.0
-      typescript: 4.6.4
+      rollup: 2.75.3
+      typescript: 4.7.2
       vite: 2.9.9
-      vite-tsconfig-paths: 3.4.1
+      vite-tsconfig-paths: 3.5.0
     devDependencies:
-      '@rollup/plugin-dynamic-import-vars': 1.4.3_rollup@2.74.0
+      '@rollup/plugin-dynamic-import-vars': 1.4.3_rollup@2.75.3
       '@types/node': 16.11.36
-      '@typescript-eslint/eslint-plugin': 5.25.0_qo2hgs5jt7x2a3p77h2rutcdae
-      '@typescript-eslint/parser': 5.25.0_hcfsmds2fshutdssjqluwm76uu
+      '@typescript-eslint/eslint-plugin': 5.26.0_hzuh7e2up357pvq3mkokjvu2lq
+      '@typescript-eslint/parser': 5.26.0_xztl6dhthcahlo6akmb2bmjmle
       autoprefixer: 10.4.7_postcss@8.4.14
-      eslint: 8.15.0
-      eslint-config-airbnb-base: 15.0.0_gwd37gqv3vjv3xlpl7ju3ag2qu
-      eslint-config-airbnb-typescript: 17.0.0_j24moc6fxpksz6plqhrv2fyfqe
-      eslint-config-prettier: 8.5.0_eslint@8.15.0
-      eslint-import-resolver-typescript: 2.7.1_gwd37gqv3vjv3xlpl7ju3ag2qu
-      eslint-plugin-compat: 4.0.2_eslint@8.15.0
-      eslint-plugin-import: 2.26.0_cubvsak2fflmoxzlyy3qtfibly
+      eslint: 8.16.0
+      eslint-config-airbnb-base: 15.0.0_btspkuwbqkl4adpiufzbathtpi
+      eslint-config-airbnb-typescript: 17.0.0_omfmjsp36rj32txxzmcgovksfy
+      eslint-config-prettier: 8.5.0_eslint@8.16.0
+      eslint-import-resolver-typescript: 2.7.1_btspkuwbqkl4adpiufzbathtpi
+      eslint-plugin-compat: 4.0.2_eslint@8.16.0
+      eslint-plugin-import: 2.26.0_ztbftnvu57zhg5cuougx2imeci
       less: 4.1.2
       postcss: 8.4.14
       prettier: 2.6.2
-      rollup: 2.74.0
-      typescript: 4.6.4
+      rollup: 2.75.3
+      typescript: 4.7.2
       vite: 2.9.9_less@4.1.2
-      vite-tsconfig-paths: 3.4.1_vite@2.9.9
+      vite-tsconfig-paths: 3.5.0_vite@2.9.9
 
   packages/artalk:
     specifiers:
@@ -69,10 +69,10 @@ importers:
     specifiers:
       '@types/katex': 0.14.0
       artalk: 'workspace: *'
-      katex: ^0.15.3
+      katex: ^0.15.6
     dependencies:
       artalk: link:../artalk
-      katex: 0.15.3
+      katex: 0.15.6
     devDependencies:
       '@types/katex': 0.14.0
 
@@ -82,14 +82,14 @@ packages:
     resolution: {integrity: sha512-RpfLEtTlyIxeNPGKcokS+p3BZII/Q3bYxryFRglh5H3A3T8q9fsLYm72VYAMEOOIBLEa8o93kFLiBDUWKrwXZA==}
     dev: true
 
-  /@eslint/eslintrc/1.2.3:
-    resolution: {integrity: sha512-uGo44hIwoLGNyduRpjdEpovcbMdd+Nv7amtmJxnKmI8xj6yd5LncmSwDa5NgX/41lIFJtkjD6YdVfgEzPfJ5UA==}
+  /@eslint/eslintrc/1.3.0:
+    resolution: {integrity: sha512-UWW0TMTmk2d7hLcWD1/e2g5HDM/HQ3csaLSqXCfqwh4uNDuNqlaKWXmEsL4Cs41Z0KnILNvwbHAah3C2yt06kw==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     dependencies:
       ajv: 6.12.6
       debug: 4.3.4
       espree: 9.3.2
-      globals: 13.13.0
+      globals: 13.15.0
       ignore: 5.2.0
       import-fresh: 3.3.0
       js-yaml: 4.1.0
@@ -143,7 +143,7 @@ packages:
       fastq: 1.13.0
     dev: true
 
-  /@rollup/plugin-dynamic-import-vars/1.4.3_rollup@2.74.0:
+  /@rollup/plugin-dynamic-import-vars/1.4.3_rollup@2.75.3:
     resolution: {integrity: sha512-VYP9BBVI0pcYpLp/DkFT8YP+EmqmWFMmWXoTObDH6OouERxJyPsIj0tC3HxhjNBOKgcRc7eV75IQItzELt7QSg==}
     engines: {node: '>= 10.0.0'}
     peerDependencies:
@@ -153,7 +153,7 @@ packages:
       estree-walker: 2.0.2
       fast-glob: 3.2.11
       magic-string: 0.25.9
-      rollup: 2.74.0
+      rollup: 2.75.3
     dev: true
 
   /@rollup/pluginutils/4.2.1:
@@ -184,8 +184,8 @@ packages:
     resolution: {integrity: sha512-FR5QJe+TaoZ2GsMHkjuwoNabr+UrJNRr2HNOo+r/7vhcuntM6Ee/pRPOnRhhL2XE9OOvX9VLEq+BcXl3VjNoWA==}
     dev: true
 
-  /@typescript-eslint/eslint-plugin/5.25.0_qo2hgs5jt7x2a3p77h2rutcdae:
-    resolution: {integrity: sha512-icYrFnUzvm+LhW0QeJNKkezBu6tJs9p/53dpPLFH8zoM9w1tfaKzVurkPotEpAqQ8Vf8uaFyL5jHd0Vs6Z0ZQg==}
+  /@typescript-eslint/eslint-plugin/5.26.0_hzuh7e2up357pvq3mkokjvu2lq:
+    resolution: {integrity: sha512-oGCmo0PqnRZZndr+KwvvAUvD3kNE4AfyoGCwOZpoCncSh4MVD06JTE8XQa2u9u+NX5CsyZMBTEc2C72zx38eYA==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
       '@typescript-eslint/parser': ^5.0.0
@@ -195,24 +195,24 @@ packages:
       typescript:
         optional: true
     dependencies:
-      '@typescript-eslint/parser': 5.25.0_hcfsmds2fshutdssjqluwm76uu
-      '@typescript-eslint/scope-manager': 5.25.0
-      '@typescript-eslint/type-utils': 5.25.0_hcfsmds2fshutdssjqluwm76uu
-      '@typescript-eslint/utils': 5.25.0_hcfsmds2fshutdssjqluwm76uu
+      '@typescript-eslint/parser': 5.26.0_xztl6dhthcahlo6akmb2bmjmle
+      '@typescript-eslint/scope-manager': 5.26.0
+      '@typescript-eslint/type-utils': 5.26.0_xztl6dhthcahlo6akmb2bmjmle
+      '@typescript-eslint/utils': 5.26.0_xztl6dhthcahlo6akmb2bmjmle
       debug: 4.3.4
-      eslint: 8.15.0
+      eslint: 8.16.0
       functional-red-black-tree: 1.0.1
       ignore: 5.2.0
       regexpp: 3.2.0
       semver: 7.3.7
-      tsutils: 3.21.0_typescript@4.6.4
-      typescript: 4.6.4
+      tsutils: 3.21.0_typescript@4.7.2
+      typescript: 4.7.2
     transitivePeerDependencies:
       - supports-color
     dev: true
 
-  /@typescript-eslint/parser/5.25.0_hcfsmds2fshutdssjqluwm76uu:
-    resolution: {integrity: sha512-r3hwrOWYbNKP1nTcIw/aZoH+8bBnh/Lh1iDHoFpyG4DnCpvEdctrSl6LOo19fZbzypjQMHdajolxs6VpYoChgA==}
+  /@typescript-eslint/parser/5.26.0_xztl6dhthcahlo6akmb2bmjmle:
+    resolution: {integrity: sha512-n/IzU87ttzIdnAH5vQ4BBDnLPly7rC5VnjN3m0xBG82HK6rhRxnCb3w/GyWbNDghPd+NktJqB/wl6+YkzZ5T5Q==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
       eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
@@ -221,26 +221,26 @@ packages:
       typescript:
         optional: true
     dependencies:
-      '@typescript-eslint/scope-manager': 5.25.0
-      '@typescript-eslint/types': 5.25.0
-      '@typescript-eslint/typescript-estree': 5.25.0_typescript@4.6.4
+      '@typescript-eslint/scope-manager': 5.26.0
+      '@typescript-eslint/types': 5.26.0
+      '@typescript-eslint/typescript-estree': 5.26.0_typescript@4.7.2
       debug: 4.3.4
-      eslint: 8.15.0
-      typescript: 4.6.4
+      eslint: 8.16.0
+      typescript: 4.7.2
     transitivePeerDependencies:
       - supports-color
     dev: true
 
-  /@typescript-eslint/scope-manager/5.25.0:
-    resolution: {integrity: sha512-p4SKTFWj+2VpreUZ5xMQsBMDdQ9XdRvODKXN4EksyBjFp2YvQdLkyHqOffakYZPuWJUDNu3jVXtHALDyTv3cww==}
+  /@typescript-eslint/scope-manager/5.26.0:
+    resolution: {integrity: sha512-gVzTJUESuTwiju/7NiTb4c5oqod8xt5GhMbExKsCTp6adU3mya6AGJ4Pl9xC7x2DX9UYFsjImC0mA62BCY22Iw==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     dependencies:
-      '@typescript-eslint/types': 5.25.0
-      '@typescript-eslint/visitor-keys': 5.25.0
+      '@typescript-eslint/types': 5.26.0
+      '@typescript-eslint/visitor-keys': 5.26.0
     dev: true
 
-  /@typescript-eslint/type-utils/5.25.0_hcfsmds2fshutdssjqluwm76uu:
-    resolution: {integrity: sha512-B6nb3GK3Gv1Rsb2pqalebe/RyQoyG/WDy9yhj8EE0Ikds4Xa8RR28nHz+wlt4tMZk5bnAr0f3oC8TuDAd5CPrw==}
+  /@typescript-eslint/type-utils/5.26.0_xztl6dhthcahlo6akmb2bmjmle:
+    resolution: {integrity: sha512-7ccbUVWGLmcRDSA1+ADkDBl5fP87EJt0fnijsMFTVHXKGduYMgienC/i3QwoVhDADUAPoytgjbZbCOMj4TY55A==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
       eslint: '*'
@@ -249,22 +249,22 @@ packages:
       typescript:
         optional: true
     dependencies:
-      '@typescript-eslint/utils': 5.25.0_hcfsmds2fshutdssjqluwm76uu
+      '@typescript-eslint/utils': 5.26.0_xztl6dhthcahlo6akmb2bmjmle
       debug: 4.3.4
-      eslint: 8.15.0
-      tsutils: 3.21.0_typescript@4.6.4
-      typescript: 4.6.4
+      eslint: 8.16.0
+      tsutils: 3.21.0_typescript@4.7.2
+      typescript: 4.7.2
     transitivePeerDependencies:
       - supports-color
     dev: true
 
-  /@typescript-eslint/types/5.25.0:
-    resolution: {integrity: sha512-7fWqfxr0KNHj75PFqlGX24gWjdV/FDBABXL5dyvBOWHpACGyveok8Uj4ipPX/1fGU63fBkzSIycEje4XsOxUFA==}
+  /@typescript-eslint/types/5.26.0:
+    resolution: {integrity: sha512-8794JZFE1RN4XaExLWLI2oSXsVImNkl79PzTOOWt9h0UHROwJedNOD2IJyfL0NbddFllcktGIO2aOu10avQQyA==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     dev: true
 
-  /@typescript-eslint/typescript-estree/5.25.0_typescript@4.6.4:
-    resolution: {integrity: sha512-MrPODKDych/oWs/71LCnuO7NyR681HuBly2uLnX3r5i4ME7q/yBqC4hW33kmxtuauLTM0OuBOhhkFaxCCOjEEw==}
+  /@typescript-eslint/typescript-estree/5.26.0_typescript@4.7.2:
+    resolution: {integrity: sha512-EyGpw6eQDsfD6jIqmXP3rU5oHScZ51tL/cZgFbFBvWuCwrIptl+oueUZzSmLtxFuSOQ9vDcJIs+279gnJkfd1w==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
       typescript: '*'
@@ -272,41 +272,41 @@ packages:
       typescript:
         optional: true
     dependencies:
-      '@typescript-eslint/types': 5.25.0
-      '@typescript-eslint/visitor-keys': 5.25.0
+      '@typescript-eslint/types': 5.26.0
+      '@typescript-eslint/visitor-keys': 5.26.0
       debug: 4.3.4
       globby: 11.1.0
       is-glob: 4.0.3
       semver: 7.3.7
-      tsutils: 3.21.0_typescript@4.6.4
-      typescript: 4.6.4
+      tsutils: 3.21.0_typescript@4.7.2
+      typescript: 4.7.2
     transitivePeerDependencies:
       - supports-color
     dev: true
 
-  /@typescript-eslint/utils/5.25.0_hcfsmds2fshutdssjqluwm76uu:
-    resolution: {integrity: sha512-qNC9bhnz/n9Kba3yI6HQgQdBLuxDoMgdjzdhSInZh6NaDnFpTUlwNGxplUFWfY260Ya0TRPvkg9dd57qxrJI9g==}
+  /@typescript-eslint/utils/5.26.0_xztl6dhthcahlo6akmb2bmjmle:
+    resolution: {integrity: sha512-PJFwcTq2Pt4AMOKfe3zQOdez6InIDOjUJJD3v3LyEtxHGVVRK3Vo7Dd923t/4M9hSH2q2CLvcTdxlLPjcIk3eg==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
       eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
     dependencies:
       '@types/json-schema': 7.0.11
-      '@typescript-eslint/scope-manager': 5.25.0
-      '@typescript-eslint/types': 5.25.0
-      '@typescript-eslint/typescript-estree': 5.25.0_typescript@4.6.4
-      eslint: 8.15.0
+      '@typescript-eslint/scope-manager': 5.26.0
+      '@typescript-eslint/types': 5.26.0
+      '@typescript-eslint/typescript-estree': 5.26.0_typescript@4.7.2
+      eslint: 8.16.0
       eslint-scope: 5.1.1
-      eslint-utils: 3.0.0_eslint@8.15.0
+      eslint-utils: 3.0.0_eslint@8.16.0
     transitivePeerDependencies:
       - supports-color
       - typescript
     dev: true
 
-  /@typescript-eslint/visitor-keys/5.25.0:
-    resolution: {integrity: sha512-yd26vFgMsC4h2dgX4+LR+GeicSKIfUvZREFLf3DDjZPtqgLx5AJZr6TetMNwFP9hcKreTTeztQYBTNbNoOycwA==}
+  /@typescript-eslint/visitor-keys/5.26.0:
+    resolution: {integrity: sha512-wei+ffqHanYDOQgg/fS6Hcar6wAWv0CUPQ3TZzOWd2BLfgP539rb49bwua8WRAs7R6kOSLn82rfEu2ro6Llt8Q==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     dependencies:
-      '@typescript-eslint/types': 5.25.0
+      '@typescript-eslint/types': 5.26.0
       eslint-visitor-keys: 3.3.0
     dev: true
 
@@ -867,7 +867,7 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
-  /eslint-config-airbnb-base/15.0.0_gwd37gqv3vjv3xlpl7ju3ag2qu:
+  /eslint-config-airbnb-base/15.0.0_btspkuwbqkl4adpiufzbathtpi:
     resolution: {integrity: sha512-xaX3z4ZZIcFLvh2oUNvcX5oEofXda7giYmuplVxoOg5A7EXJMrUyqRgR+mhDhPK8LZ4PttFOBvCYDbX3sUoUig==}
     engines: {node: ^10.12.0 || >=12.0.0}
     peerDependencies:
@@ -875,14 +875,14 @@ packages:
       eslint-plugin-import: ^2.25.2
     dependencies:
       confusing-browser-globals: 1.0.11
-      eslint: 8.15.0
-      eslint-plugin-import: 2.26.0_cubvsak2fflmoxzlyy3qtfibly
+      eslint: 8.16.0
+      eslint-plugin-import: 2.26.0_ztbftnvu57zhg5cuougx2imeci
       object.assign: 4.1.2
       object.entries: 1.1.5
       semver: 6.3.0
     dev: true
 
-  /eslint-config-airbnb-typescript/17.0.0_j24moc6fxpksz6plqhrv2fyfqe:
+  /eslint-config-airbnb-typescript/17.0.0_omfmjsp36rj32txxzmcgovksfy:
     resolution: {integrity: sha512-elNiuzD0kPAPTXjFWg+lE24nMdHMtuxgYoD30OyMD6yrW1AhFZPAg27VX7d3tzOErw+dgJTNWfRSDqEcXb4V0g==}
     peerDependencies:
       '@typescript-eslint/eslint-plugin': ^5.13.0
@@ -890,20 +890,20 @@ packages:
       eslint: ^7.32.0 || ^8.2.0
       eslint-plugin-import: ^2.25.3
     dependencies:
-      '@typescript-eslint/eslint-plugin': 5.25.0_qo2hgs5jt7x2a3p77h2rutcdae
-      '@typescript-eslint/parser': 5.25.0_hcfsmds2fshutdssjqluwm76uu
-      eslint: 8.15.0
-      eslint-config-airbnb-base: 15.0.0_gwd37gqv3vjv3xlpl7ju3ag2qu
-      eslint-plugin-import: 2.26.0_cubvsak2fflmoxzlyy3qtfibly
+      '@typescript-eslint/eslint-plugin': 5.26.0_hzuh7e2up357pvq3mkokjvu2lq
+      '@typescript-eslint/parser': 5.26.0_xztl6dhthcahlo6akmb2bmjmle
+      eslint: 8.16.0
+      eslint-config-airbnb-base: 15.0.0_btspkuwbqkl4adpiufzbathtpi
+      eslint-plugin-import: 2.26.0_ztbftnvu57zhg5cuougx2imeci
     dev: true
 
-  /eslint-config-prettier/8.5.0_eslint@8.15.0:
+  /eslint-config-prettier/8.5.0_eslint@8.16.0:
     resolution: {integrity: sha512-obmWKLUNCnhtQRKc+tmnYuQl0pFU1ibYJQ5BGhTVB08bHe9wC8qUeG7c08dj9XX+AuPj1YSGSQIHl1pnDHZR0Q==}
     hasBin: true
     peerDependencies:
       eslint: '>=7.0.0'
     dependencies:
-      eslint: 8.15.0
+      eslint: 8.16.0
     dev: true
 
   /eslint-import-resolver-node/0.3.6:
@@ -915,7 +915,7 @@ packages:
       - supports-color
     dev: true
 
-  /eslint-import-resolver-typescript/2.7.1_gwd37gqv3vjv3xlpl7ju3ag2qu:
+  /eslint-import-resolver-typescript/2.7.1_btspkuwbqkl4adpiufzbathtpi:
     resolution: {integrity: sha512-00UbgGwV8bSgUv34igBDbTOtKhqoRMy9bFjNehT40bXg6585PNIct8HhXZ0SybqB9rWtXj9crcku8ndDn/gIqQ==}
     engines: {node: '>=4'}
     peerDependencies:
@@ -923,8 +923,8 @@ packages:
       eslint-plugin-import: '*'
     dependencies:
       debug: 4.3.4
-      eslint: 8.15.0
-      eslint-plugin-import: 2.26.0_cubvsak2fflmoxzlyy3qtfibly
+      eslint: 8.16.0
+      eslint-plugin-import: 2.26.0_ztbftnvu57zhg5cuougx2imeci
       glob: 7.2.0
       is-glob: 4.0.3
       resolve: 1.22.0
@@ -933,7 +933,7 @@ packages:
       - supports-color
     dev: true
 
-  /eslint-module-utils/2.7.3_rak4pgp43wdbzd6xmlhzgag4yu:
+  /eslint-module-utils/2.7.3_yxrttxwxgn5axzfjkhhzgts2eq:
     resolution: {integrity: sha512-088JEC7O3lDZM9xGe0RerkOMd0EjFl+Yvd1jPWIkMT5u3H9+HC34mWWPnqPrN13gieT9pBOO+Qt07Nb/6TresQ==}
     engines: {node: '>=4'}
     peerDependencies:
@@ -951,16 +951,16 @@ packages:
       eslint-import-resolver-webpack:
         optional: true
     dependencies:
-      '@typescript-eslint/parser': 5.25.0_hcfsmds2fshutdssjqluwm76uu
+      '@typescript-eslint/parser': 5.26.0_xztl6dhthcahlo6akmb2bmjmle
       debug: 3.2.7
       eslint-import-resolver-node: 0.3.6
-      eslint-import-resolver-typescript: 2.7.1_gwd37gqv3vjv3xlpl7ju3ag2qu
+      eslint-import-resolver-typescript: 2.7.1_btspkuwbqkl4adpiufzbathtpi
       find-up: 2.1.0
     transitivePeerDependencies:
       - supports-color
     dev: true
 
-  /eslint-plugin-compat/4.0.2_eslint@8.15.0:
+  /eslint-plugin-compat/4.0.2_eslint@8.16.0:
     resolution: {integrity: sha512-xqvoO54CLTVaEYGMzhu35Wzwk/As7rCvz/2dqwnFiWi0OJccEtGIn+5qq3zqIu9nboXlpdBN579fZcItC73Ycg==}
     engines: {node: '>=9.x'}
     peerDependencies:
@@ -971,13 +971,13 @@ packages:
       browserslist: 4.20.2
       caniuse-lite: 1.0.30001332
       core-js: 3.22.4
-      eslint: 8.15.0
+      eslint: 8.16.0
       find-up: 5.0.0
       lodash.memoize: 4.1.2
       semver: 7.3.5
     dev: true
 
-  /eslint-plugin-import/2.26.0_cubvsak2fflmoxzlyy3qtfibly:
+  /eslint-plugin-import/2.26.0_ztbftnvu57zhg5cuougx2imeci:
     resolution: {integrity: sha512-hYfi3FXaM8WPLf4S1cikh/r4IxnO6zrhZbEGz2b660EJRbuxgpDS5gkCuYgGWg2xxh2rBuIr4Pvhve/7c31koA==}
     engines: {node: '>=4'}
     peerDependencies:
@@ -987,14 +987,14 @@ packages:
       '@typescript-eslint/parser':
         optional: true
     dependencies:
-      '@typescript-eslint/parser': 5.25.0_hcfsmds2fshutdssjqluwm76uu
+      '@typescript-eslint/parser': 5.26.0_xztl6dhthcahlo6akmb2bmjmle
       array-includes: 3.1.4
       array.prototype.flat: 1.3.0
       debug: 2.6.9
       doctrine: 2.1.0
-      eslint: 8.15.0
+      eslint: 8.16.0
       eslint-import-resolver-node: 0.3.6
-      eslint-module-utils: 2.7.3_rak4pgp43wdbzd6xmlhzgag4yu
+      eslint-module-utils: 2.7.3_yxrttxwxgn5axzfjkhhzgts2eq
       has: 1.0.3
       is-core-module: 2.9.0
       is-glob: 4.0.3
@@ -1024,13 +1024,13 @@ packages:
       estraverse: 5.3.0
     dev: true
 
-  /eslint-utils/3.0.0_eslint@8.15.0:
+  /eslint-utils/3.0.0_eslint@8.16.0:
     resolution: {integrity: sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==}
     engines: {node: ^10.0.0 || ^12.0.0 || >= 14.0.0}
     peerDependencies:
       eslint: '>=5'
     dependencies:
-      eslint: 8.15.0
+      eslint: 8.16.0
       eslint-visitor-keys: 2.1.0
     dev: true
 
@@ -1044,12 +1044,12 @@ packages:
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     dev: true
 
-  /eslint/8.15.0:
-    resolution: {integrity: sha512-GG5USZ1jhCu8HJkzGgeK8/+RGnHaNYZGrGDzUtigK3BsGESW/rs2az23XqE0WVwDxy1VRvvjSSGu5nB0Bu+6SA==}
+  /eslint/8.16.0:
+    resolution: {integrity: sha512-MBndsoXY/PeVTDJeWsYj7kLZ5hQpJOfMYLsF6LicLHQWbRDG19lK5jOix4DPl8yY4SUFcE3txy86OzFLWT+yoA==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     hasBin: true
     dependencies:
-      '@eslint/eslintrc': 1.2.3
+      '@eslint/eslintrc': 1.3.0
       '@humanwhocodes/config-array': 0.9.5
       ajv: 6.12.6
       chalk: 4.1.2
@@ -1058,7 +1058,7 @@ packages:
       doctrine: 3.0.0
       escape-string-regexp: 4.0.0
       eslint-scope: 7.1.1
-      eslint-utils: 3.0.0_eslint@8.15.0
+      eslint-utils: 3.0.0_eslint@8.16.0
       eslint-visitor-keys: 3.3.0
       espree: 9.3.2
       esquery: 1.4.0
@@ -1067,7 +1067,7 @@ packages:
       file-entry-cache: 6.0.1
       functional-red-black-tree: 1.0.1
       glob-parent: 6.0.2
-      globals: 13.13.0
+      globals: 13.15.0
       ignore: 5.2.0
       import-fresh: 3.3.0
       imurmurhash: 0.1.4
@@ -1269,8 +1269,8 @@ packages:
       path-is-absolute: 1.0.1
     dev: true
 
-  /globals/13.13.0:
-    resolution: {integrity: sha512-EQ7Q18AJlPwp3vUDL4mKA0KXrXyNIQyWon6T6XQiBQF0XHvRsiCSrWmmeATpUzdJN2HhWZU6Pdl0a9zdep5p6A==}
+  /globals/13.15.0:
+    resolution: {integrity: sha512-bpzcOlgDhMG070Av0Vy5Owklpv1I6+j96GhUI7Rh7IzDCKLzboflLrrfqMu8NquDbiR4EOQk7XzJwqVJxicxog==}
     engines: {node: '>=8'}
     dependencies:
       type-fest: 0.20.2
@@ -1357,7 +1357,7 @@ packages:
     dev: true
 
   /image-size/0.5.5:
-    resolution: {integrity: sha1-Cd/Uq50g4p6xw+gLiZA3jfnjy5w=}
+    resolution: {integrity: sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==}
     engines: {node: '>=0.10.0'}
     hasBin: true
     requiresBuild: true
@@ -1529,8 +1529,14 @@ packages:
       minimist: 1.2.6
     dev: true
 
-  /katex/0.15.3:
-    resolution: {integrity: sha512-Al6V7RJsmjklT9QItyHWGaQCt+NYTle1bZwB1e9MR/tLoIT1MXaHy9UpfGSB7eaqDgjjqqRxQOaQGrALCrEyBQ==}
+  /json5/2.2.1:
+    resolution: {integrity: sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA==}
+    engines: {node: '>=6'}
+    hasBin: true
+    dev: true
+
+  /katex/0.15.6:
+    resolution: {integrity: sha512-UpzJy4yrnqnhXvRPhjEuLA4lcPn6eRngixW7Q3TJErjg3Aw2PuLFBzTkdUb89UtumxjhHTqL3a5GDGETMSwgJA==}
     hasBin: true
     dependencies:
       commander: 8.3.0
@@ -1914,8 +1920,8 @@ packages:
       glob: 7.2.0
     dev: true
 
-  /rollup/2.74.0:
-    resolution: {integrity: sha512-RRwXTX5+ObPJhcMV6zP3RdHvy90/lBOUfbzL7IKkFjMJGAqeBGZiv9nZWm/DoTESaTE3GBkkzbU9QVN2AuCkjw==}
+  /rollup/2.75.3:
+    resolution: {integrity: sha512-YA29fLU6MAYSaDxIQYrGGOcbXlDmG96h0krGGYObroezcQ0KgEPM3+7MtKD/qeuUbFuAJXvKZee5dA1dpwq1PQ==}
     engines: {node: '>=10.0.0'}
     hasBin: true
     optionalDependencies:
@@ -2069,6 +2075,14 @@ packages:
       strip-bom: 3.0.0
     dev: true
 
+  /tsconfig-paths/4.0.0:
+    resolution: {integrity: sha512-SLBg2GBKlR6bVtMgJJlud/o3waplKtL7skmLkExomIiaAtLGtVsoXIqP3SYdjbcH9lq/KVv7pMZeCBpLYOit6Q==}
+    dependencies:
+      json5: 2.2.1
+      minimist: 1.2.6
+      strip-bom: 3.0.0
+    dev: true
+
   /tslib/1.14.1:
     resolution: {integrity: sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==}
     dev: true
@@ -2077,14 +2091,14 @@ packages:
     resolution: {integrity: sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==}
     dev: true
 
-  /tsutils/3.21.0_typescript@4.6.4:
+  /tsutils/3.21.0_typescript@4.7.2:
     resolution: {integrity: sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==}
     engines: {node: '>= 6'}
     peerDependencies:
       typescript: '>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta'
     dependencies:
       tslib: 1.14.1
-      typescript: 4.6.4
+      typescript: 4.7.2
     dev: true
 
   /type-check/0.4.0:
@@ -2099,8 +2113,8 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
-  /typescript/4.6.4:
-    resolution: {integrity: sha512-9ia/jWHIEbo49HfjrLGfKbZSuWo9iTMwXO+Ca3pRsSpbsMbc7/IU8NKdCZVRRBafVPGnoJeFL76ZOAA84I9fEg==}
+  /typescript/4.7.2:
+    resolution: {integrity: sha512-Mamb1iX2FDUpcTRzltPxgWMKy3fhg0TN378ylbktPGPK/99KbDtMQ4W1hwgsbPAsG3a0xKa1vmw4VKZQbkvz5A==}
     engines: {node: '>=4.2.0'}
     hasBin: true
     dev: true
@@ -2124,15 +2138,15 @@ packages:
     resolution: {integrity: sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==}
     dev: true
 
-  /vite-tsconfig-paths/3.4.1_vite@2.9.9:
-    resolution: {integrity: sha512-SgK3/pnTuJ3i+gMSAWLR6VCPSw26bnxawrmXGvCDjJgk8MAQgmbCrFrAzfwbwZBXSqSuvWEuX04Wt73qJKx8fQ==}
+  /vite-tsconfig-paths/3.5.0_vite@2.9.9:
+    resolution: {integrity: sha512-NKIubr7gXgh/3uniQaOytSg+aKWPrjquP6anAy+zCWEn6h9fB8z2/qdlfQrTgZWaXJ2pHVlllrSdRZltHn9P4g==}
     peerDependencies:
       vite: '>2.0.0-0'
     dependencies:
       debug: 4.3.4
       globrex: 0.1.2
       recrawl-sync: 2.2.2
-      tsconfig-paths: 3.14.1
+      tsconfig-paths: 4.0.0
       vite: 2.9.9_less@4.1.2
     transitivePeerDependencies:
       - supports-color
@@ -2158,7 +2172,7 @@ packages:
       less: 4.1.2
       postcss: 8.4.14
       resolve: 1.22.0
-      rollup: 2.74.0
+      rollup: 2.75.3
     optionalDependencies:
       fsevents: 2.3.2
     dev: true