artalk 2.6.4 → 2.7.0

package/src/comment/renders/actions.ts

@@ -1,114 +1,114 @@
 import * as Utils from '../../lib/utils'
 import ActionBtn from '../../components/action-btn'
-import RenderCtx from '../render-ctx'
+import type Render from '../render'
 
 /**
  * 评论操作按钮界面
  */
-export default function renderActions(ctx: RenderCtx) {
+export default function renderActions(r: Render) {
   Object.entries({
     renderVote, renderReply,
     // 管理员操作
     renderCollapse, renderModerator, renderPin, renderEdit, renderDel
   }).forEach(([name, render]) => {
-    render(ctx)
+    render(r)
   })
 }
 
 
 // 操作按钮 - 投票
-function renderVote(ctx: RenderCtx) {
-  if (!ctx.ctx.conf.vote) return // 关闭投票功能
+function renderVote(r: Render) {
+  if (!r.ctx.conf.vote) return // 关闭投票功能
 
   // 赞同按钮
-  ctx.voteBtnUp = new ActionBtn(ctx.ctx, () => `${ctx.ctx.$t('voteUp')} (${ctx.data.vote_up || 0})`).appendTo(ctx.$actions)
-  ctx.voteBtnUp.setClick(() => {
-    ctx.comment.getActions().vote('up')
+  r.voteBtnUp = new ActionBtn(() => `${r.ctx.$t('voteUp')} (${r.data.vote_up || 0})`).appendTo(r.$actions)
+  r.voteBtnUp.setClick(() => {
+    r.comment.getActions().vote('up')
   })
 
   // 反对按钮
-  if (ctx.ctx.conf.voteDown) {
-    ctx.voteBtnDown = new ActionBtn(ctx.ctx, () => `${ctx.ctx.$t('voteDown')} (${ctx.data.vote_down || 0})`).appendTo(ctx.$actions)
-    ctx.voteBtnDown.setClick(() => {
-      ctx.comment.getActions().vote('down')
+  if (r.ctx.conf.voteDown) {
+    r.voteBtnDown = new ActionBtn(() => `${r.ctx.$t('voteDown')} (${r.data.vote_down || 0})`).appendTo(r.$actions)
+    r.voteBtnDown.setClick(() => {
+      r.comment.getActions().vote('down')
     })
   }
 }
 
 // 操作按钮 - 回复
-function renderReply(ctx: RenderCtx) {
-  if (!ctx.data.is_allow_reply) return // 不允许回复
+function renderReply(r: Render) {
+  if (!r.data.is_allow_reply) return // 不允许回复
 
-  const replyBtn = Utils.createElement(`<span>${ctx.ctx.$t('reply')}</span>`)
-  ctx.$actions.append(replyBtn)
+  const replyBtn = Utils.createElement(`<span>${r.ctx.$t('reply')}</span>`)
+  r.$actions.append(replyBtn)
   replyBtn.addEventListener('click', (e) => {
     e.stopPropagation() // 防止穿透
-    if (!ctx.cConf.onReplyBtnClick) {
-      ctx.ctx.replyComment(ctx.data, ctx.$el)
+    if (!r.cConf.onReplyBtnClick) {
+      r.ctx.replyComment(r.data, r.$el)
     } else {
-      ctx.cConf.onReplyBtnClick()
+      r.cConf.onReplyBtnClick()
     }
   })
 }
 
 // 操作按钮 - 折叠
-function renderCollapse(ctx: RenderCtx) {
-  const collapseBtn = new ActionBtn(ctx.ctx, {
-    text: () => (ctx.data.is_collapsed ? ctx.ctx.$t('expand') : ctx.ctx.$t('collapse')),
+function renderCollapse(r: Render) {
+  const collapseBtn = new ActionBtn({
+    text: () => (r.data.is_collapsed ? r.ctx.$t('expand') : r.ctx.$t('collapse')),
     adminOnly: true
   })
-  collapseBtn.appendTo(ctx.$actions)
+  collapseBtn.appendTo(r.$actions)
   collapseBtn.setClick(() => {
-    ctx.comment.getActions().adminEdit('collapsed', collapseBtn)
+    r.comment.getActions().adminEdit('collapsed', collapseBtn)
   })
 }
 
 // 操作按钮 - 审核
-function renderModerator(ctx: RenderCtx) {
-  const pendingBtn = new ActionBtn(ctx.ctx, {
-    text: () => (ctx.data.is_pending ? ctx.ctx.$t('pending') : ctx.ctx.$t('approved')),
+function renderModerator(r: Render) {
+  const pendingBtn = new ActionBtn({
+    text: () => (r.data.is_pending ? r.ctx.$t('pending') : r.ctx.$t('approved')),
     adminOnly: true
   })
-  pendingBtn.appendTo(ctx.$actions)
+  pendingBtn.appendTo(r.$actions)
   pendingBtn.setClick(() => {
-    ctx.comment.getActions().adminEdit('pending', pendingBtn)
+    r.comment.getActions().adminEdit('pending', pendingBtn)
   })
 }
 
 // 操作按钮 - 置顶
-function renderPin(ctx: RenderCtx) {
-  const pinnedBtn = new ActionBtn(ctx.ctx, {
-    text: () => (ctx.data.is_pinned ? ctx.ctx.$t('unpin') : ctx.ctx.$t('pin')),
+function renderPin(r: Render) {
+  const pinnedBtn = new ActionBtn({
+    text: () => (r.data.is_pinned ? r.ctx.$t('unpin') : r.ctx.$t('pin')),
     adminOnly: true
   })
-  pinnedBtn.appendTo(ctx.$actions)
+  pinnedBtn.appendTo(r.$actions)
   pinnedBtn.setClick(() => {
-    ctx.comment.getActions().adminEdit('pinned', pinnedBtn)
+    r.comment.getActions().adminEdit('pinned', pinnedBtn)
   })
 }
 
 // 操作按钮 - 编辑
-function renderEdit(ctx: RenderCtx) {
-  const editBtn = new ActionBtn(ctx.ctx, {
-    text: ctx.ctx.$t('edit'),
+function renderEdit(r: Render) {
+  const editBtn = new ActionBtn({
+    text: r.ctx.$t('edit'),
     adminOnly: true
   })
-  editBtn.appendTo(ctx.$actions)
+  editBtn.appendTo(r.$actions)
   editBtn.setClick(() => {
-    ctx.ctx.editComment(ctx.data, ctx.$el)
+    r.ctx.editComment(r.data, r.$el)
   })
 }
 
 // 操作按钮 - 删除
-function renderDel(ctx: RenderCtx) {
-  const delBtn = new ActionBtn(ctx.ctx, {
-    text: ctx.ctx.$t('delete'),
+function renderDel(r: Render) {
+  const delBtn = new ActionBtn({
+    text: r.ctx.$t('delete'),
     confirm: true,
-    confirmText: ctx.ctx.$t('deleteConfirm'),
+    confirmText: r.ctx.$t('deleteConfirm'),
     adminOnly: true,
   })
-  delBtn.appendTo(ctx.$actions)
+  delBtn.appendTo(r.$actions)
   delBtn.setClick(() => {
-    ctx.comment.getActions().adminDelete(delBtn)
+    r.comment.getActions().adminDelete(delBtn)
   })
 }

package/src/comment/renders/avatar.ts

@@ -1,19 +1,19 @@
 import * as Utils from '../../lib/utils'
-import RenderCtx from '../render-ctx'
+import type Render from '../render'
 
 /**
  * 评论头像界面
  */
-export default function renderAvatar(ctx: RenderCtx) {
-  const $avatar = ctx.$el.querySelector<HTMLElement>('.atk-avatar')!
+export default function renderAvatar(r: Render) {
+  const $avatar = r.$el.querySelector<HTMLElement>('.atk-avatar')!
   const $avatarImg = Utils.createElement<HTMLImageElement>('<img />')
 
-  const avatarURLBuilder = ctx.conf.avatarURLBuilder
-  $avatarImg.src = avatarURLBuilder ? avatarURLBuilder(ctx.data) : ctx.comment.getGravatarURL()
+  const avatarURLBuilder = r.conf.avatarURLBuilder
+  $avatarImg.src = avatarURLBuilder ? avatarURLBuilder(r.data) : r.comment.getGravatarURL()
 
-  if (ctx.data.link) {
+  if (r.data.link) {
     const $avatarA = Utils.createElement<HTMLLinkElement>('<a target="_blank" rel="noreferrer noopener nofollow"></a>')
-    $avatarA.href = Utils.isValidURL(ctx.data.link) ? ctx.data.link : `https://${ctx.data.link}`
+    $avatarA.href = Utils.isValidURL(r.data.link) ? r.data.link : `https://${r.data.link}`
     $avatarA.append($avatarImg)
     $avatar.append($avatarA)
   } else {

package/src/comment/renders/content.ts

@@ -1,39 +1,39 @@
 import * as Utils from '../../lib/utils'
 import * as Ui from '../../lib/ui'
-import RenderCtx from '../render-ctx'
+import type Render from '../render'
 
 /**
  * 评论内容界面
  */
-export default function renderContent(ctx: RenderCtx) {
-  if (!ctx.data.is_collapsed) {
-    ctx.$content.innerHTML = ctx.comment.getContentMarked()
-    ctx.$content.classList.remove('atk-hide', 'atk-collapsed')
+export default function renderContent(r: Render) {
+  if (!r.data.is_collapsed) {
+    r.$content.innerHTML = r.comment.getContentMarked()
+    r.$content.classList.remove('atk-hide', 'atk-collapsed')
     return
   }
 
   // 内容 & 折叠
-  ctx.$content.classList.add('atk-hide', 'atk-type-collapsed')
+  r.$content.classList.add('atk-hide', 'atk-type-collapsed')
   const collapsedInfoEl = Utils.createElement(`
     <div class="atk-collapsed">
-      <span class="atk-text">${ctx.ctx.$t('collapsedMsg')}</span>
-      <span class="atk-show-btn">${ctx.ctx.$t('expand')}</span>
+      <span class="atk-text">${r.ctx.$t('collapsedMsg')}</span>
+      <span class="atk-show-btn">${r.ctx.$t('expand')}</span>
     </div>`)
-  ctx.$body.insertAdjacentElement('beforeend', collapsedInfoEl)
+  r.$body.insertAdjacentElement('beforeend', collapsedInfoEl)
 
-  const contentShowBtn = collapsedInfoEl.querySelector('.atk-show-btn')!
+  const contentShowBtn = collapsedInfoEl.querySelector<HTMLElement>('.atk-show-btn')!
   contentShowBtn.addEventListener('click', (e) => {
     e.stopPropagation() // 防止穿透
 
-    if (ctx.$content.classList.contains('atk-hide')) {
-      ctx.$content.innerHTML = ctx.comment.getContentMarked()
-      ctx.$content.classList.remove('atk-hide')
-      Ui.playFadeInAnim(ctx.$content)
-      contentShowBtn.innerHTML = ctx.ctx.$t('collapse')
+    if (r.$content.classList.contains('atk-hide')) {
+      r.$content.innerHTML = r.comment.getContentMarked()
+      r.$content.classList.remove('atk-hide')
+      Ui.playFadeInAnim(r.$content)
+      contentShowBtn.innerText = r.ctx.$t('collapse')
     } else {
-      ctx.$content.innerHTML = ''
-      ctx.$content.classList.add('atk-hide')
-      contentShowBtn.innerHTML = ctx.ctx.$t('expand')
+      r.$content.innerHTML = ''
+      r.$content.classList.add('atk-hide')
+      contentShowBtn.innerText = r.ctx.$t('expand')
     }
   })
 }

package/src/comment/renders/header.ts

@@ -1,31 +1,31 @@
 import * as Utils from '../../lib/utils'
-import RenderCtx from '../render-ctx'
+import type Render from '../render'
 
 /**
  * 评论头部界面
  */
-export default function renderHeader(ctx: RenderCtx) {
+export default function renderHeader(r: Render) {
   Object.entries({
     renderNick, renderVerifyBadge, renderDate, renderUABadge
   }).forEach(([name, render]) => {
-    render(ctx)
+    render(r)
   })
 }
 
-function renderNick(ctx: RenderCtx) {
-  ctx.$headerNick = ctx.$el.querySelector<HTMLElement>('.atk-nick')!
+function renderNick(r: Render) {
+  r.$headerNick = r.$el.querySelector<HTMLElement>('.atk-nick')!
 
-  if (ctx.data.link) {
+  if (r.data.link) {
     const $nickA = Utils.createElement<HTMLLinkElement>('<a target="_blank" rel="noreferrer noopener nofollow"></a>')
-    $nickA.innerText = ctx.data.nick
-    $nickA.href = Utils.isValidURL(ctx.data.link) ? ctx.data.link : `https://${ctx.data.link}`
-    ctx.$headerNick.append($nickA)
+    $nickA.innerText = r.data.nick
+    $nickA.href = Utils.isValidURL(r.data.link) ? r.data.link : `https://${r.data.link}`
+    r.$headerNick.append($nickA)
   } else {
-    ctx.$headerNick.innerText = ctx.data.nick
+    r.$headerNick.innerText = r.data.nick
   }
 }
 
-function renderVerifyBadge(ctx: RenderCtx) {
+function renderVerifyBadge(ctx: Render) {
   ctx.$headerBadgeWrap = ctx.$el.querySelector<HTMLElement>('.atk-badge-wrap')!
   ctx.$headerBadgeWrap.innerHTML = ''
 
@@ -44,13 +44,13 @@ function renderVerifyBadge(ctx: RenderCtx) {
   }
 }
 
-function renderDate(ctx: RenderCtx) {
+function renderDate(ctx: Render) {
   const $date = ctx.$el.querySelector<HTMLElement>('.atk-date')!
   $date.innerText = ctx.comment.getDateFormatted()
   $date.setAttribute('data-atk-comment-date', String(+new Date(ctx.data.date)))
 }
 
-function renderUABadge(ctx: RenderCtx) {
+function renderUABadge(ctx: Render) {
   if (!ctx.ctx.conf.uaBadge && !ctx.data.ip_region) return
 
   let $uaWrap = ctx.$header.querySelector('atk-ua-wrap')

package/src/comment/renders/index.ts

@@ -1,4 +1,4 @@
-import RenderCtx from '../render-ctx'
+import type Render from '../render'
 import Avatar from './avatar'
 import Header from './header'
 import Content from './content'
@@ -12,8 +12,8 @@ const Renders = {
   ReplyTo, Pending, Actions
 }
 
-export default function loadRenders(ctx: RenderCtx) {
+export default function loadRenders(r: Render) {
   Object.entries(Renders).forEach(([ name, render ]) => {
-    render(ctx)
+    render(r)
   })
 }

package/src/comment/renders/pending.ts

@@ -1,12 +1,12 @@
 import * as Utils from '../../lib/utils'
-import RenderCtx from '../render-ctx'
+import type Render from '../render'
 
 /**
  * 待审核状态界面
  */
-export default function renderPending(ctx: RenderCtx) {
-  if (!ctx.data.is_pending) return
+export default function renderPending(r: Render) {
+  if (!r.data.is_pending) return
 
-  const pendingEl = Utils.createElement(`<div class="atk-pending">${ctx.ctx.$t('pendingMsg')}</div>`)
-  ctx.$body.prepend(pendingEl)
+  const pendingEl = Utils.createElement(`<div class="atk-pending">${r.ctx.$t('pendingMsg')}</div>`)
+  r.$body.prepend(pendingEl)
 }

package/src/comment/renders/reply-at.ts

@@ -1,16 +1,16 @@
 import * as Utils from '../../lib/utils'
-import RenderCtx from '../render-ctx'
+import type Render from '../render'
 
 /**
  * 层级嵌套模式显示 AT 界面
  */
-export default function renderReplyAt(ctx: RenderCtx) {
-  if (ctx.cConf.isFlatMode || ctx.data.rid === 0) return // not 平铺模式 或 根评论
-  if (!ctx.cConf.replyTo) return
+export default function renderReplyAt(r: Render) {
+  if (r.cConf.isFlatMode || r.data.rid === 0) return // not 平铺模式 或 根评论
+  if (!r.cConf.replyTo) return
 
-  ctx.$replyAt = Utils.createElement(`<span class="atk-item atk-reply-at"><span class="atk-arrow"></span><span class="atk-nick"></span></span>`)
-  ctx.$replyAt.querySelector<HTMLElement>('.atk-nick')!.innerText = `${ctx.cConf.replyTo.nick}`
-  ctx.$replyAt.onclick = () => { ctx.comment.getActions().goToReplyComment() }
+  r.$replyAt = Utils.createElement(`<span class="atk-item atk-reply-at"><span class="atk-arrow"></span><span class="atk-nick"></span></span>`)
+  r.$replyAt.querySelector<HTMLElement>('.atk-nick')!.innerText = `${r.cConf.replyTo.nick}`
+  r.$replyAt.onclick = () => { r.comment.getActions().goToReplyComment() }
 
-  ctx.$headerBadgeWrap.insertAdjacentElement('afterend', ctx.$replyAt)
+  r.$headerBadgeWrap.insertAdjacentElement('afterend', r.$replyAt)
 }

package/src/comment/renders/reply-to.ts

@@ -1,24 +1,24 @@
 import * as Utils from '../../lib/utils'
 import marked from '../../lib/marked'
-import RenderCtx from '../render-ctx'
+import type Render from '../render'
 
 /**
  * 回复的对象界面
  */
-export default function renderReplyTo(ctx: RenderCtx) {
-  if (!ctx.cConf.isFlatMode) return // 仅平铺模式显示
-  if (!ctx.cConf.replyTo) return
+export default function renderReplyTo(r: Render) {
+  if (!r.cConf.isFlatMode) return // 仅平铺模式显示
+  if (!r.cConf.replyTo) return
 
-  ctx.$replyTo = Utils.createElement(`
+  r.$replyTo = Utils.createElement(`
     <div class="atk-reply-to">
-      <div class="atk-meta">${ctx.ctx.$t('reply')} <span class="atk-nick"></span>:</div>
+      <div class="atk-meta">${r.ctx.$t('reply')} <span class="atk-nick"></span>:</div>
       <div class="atk-content"></div>
     </div>`)
-  const $nick = ctx.$replyTo.querySelector<HTMLElement>('.atk-nick')!
-  $nick.innerText = `@${ctx.cConf.replyTo.nick}`
-  $nick.onclick = () => { ctx.comment.getActions().goToReplyComment() }
-  let replyContent = marked(ctx.ctx, ctx.cConf.replyTo.content)
-  if (ctx.cConf.replyTo.is_collapsed) replyContent = `[${ctx.ctx.$t('collapsed')}]`
-  ctx.$replyTo.querySelector<HTMLElement>('.atk-content')!.innerHTML = replyContent
-  ctx.$body.prepend(ctx.$replyTo)
+  const $nick = r.$replyTo.querySelector<HTMLElement>('.atk-nick')!
+  $nick.innerText = `@${r.cConf.replyTo.nick}`
+  $nick.onclick = () => { r.comment.getActions().goToReplyComment() }
+  let replyContent = marked(r.cConf.replyTo.content)
+  if (r.cConf.replyTo.is_collapsed) replyContent = `[${Utils.htmlEncode(r.ctx.$t('collapsed'))}]`
+  r.$replyTo.querySelector<HTMLElement>('.atk-content')!.innerHTML = replyContent
+  r.$body.prepend(r.$replyTo)
 }

package/src/components/action-btn.ts

@@ -1,7 +1,7 @@
-import Context from '~/types/context'
+import $t from '@/i18n'
 import * as Utils from '../lib/utils'
 
-interface ActionBtnConf {
+interface ActionBtnOptions {
   /** 按钮文字 (动态/静态) */
   text: (() => string) | string
 
@@ -19,8 +19,7 @@ interface ActionBtnConf {
  * 通用操作按钮
  */
 export default class ActionBtn {
-  private ctx: Context
-  private conf: ActionBtnConf
+  private opts: ActionBtnOptions
   public $el: HTMLElement
 
   public isLoading = false // 正在加载
@@ -33,15 +32,14 @@ export default class ActionBtn {
   public confirmRecTimer?: number // 确认消息复原定时器
 
   /** 构造函数 */
-  constructor(ctx: Context, conf: ActionBtnConf|string|(() => string)) {
-    this.ctx = ctx
+  constructor(opts: ActionBtnOptions|string|(() => string)) {
     this.$el = Utils.createElement(`<span class="atk-common-action-btn"></span>`)
 
-    this.conf = (typeof conf !== 'object') ? ({ text: conf }) : conf
+    this.opts = (typeof opts !== 'object') ? ({ text: opts }) : opts
     this.$el.innerText = this.getText()
 
     // 仅管理员可操作
-    if (this.conf.adminOnly) this.$el.setAttribute('atk-only-admin-show', '')
+    if (this.opts.adminOnly) this.$el.setAttribute('atk-only-admin-show', '')
   }
 
   /** 将按钮装载到指定元素 */
@@ -52,7 +50,7 @@ export default class ActionBtn {
 
   /** 获取按钮文字（动态/静态） */
   private getText() {
-    return (typeof this.conf.text === 'string') ? this.conf.text : this.conf.text()
+    return (typeof this.opts.text === 'string') ? this.opts.text : this.opts.text()
   }
 
   /** 设置点击事件 */
@@ -66,7 +64,7 @@ export default class ActionBtn {
       }
 
       // 操作确认
-      if (this.conf.confirm && !this.isMessaging) {
+      if (this.opts.confirm && !this.isMessaging) {
         const confirmRestore = () => {
           this.isConfirming = false
           this.$el.classList.remove('atk-btn-confirm')
@@ -76,7 +74,7 @@ export default class ActionBtn {
         if (!this.isConfirming) {
           this.isConfirming = true
           this.$el.classList.add('atk-btn-confirm')
-          this.$el.innerText = this.conf.confirmText || this.ctx.$t('actionConfirm')
+          this.$el.innerText = this.opts.confirmText || $t('actionConfirm')
           this.confirmRecTimer = window.setTimeout(() => confirmRestore(), 5000)
           return
         }
@@ -99,7 +97,7 @@ export default class ActionBtn {
 
   /** 文字刷新（动态/静态） */
   public updateText(text?: (() => string) | string) {
-    if (text) this.conf.text = text
+    if (text) this.opts.text = text
     this.setLoading(false)
     this.$el.innerText = this.getText()
   }
@@ -110,7 +108,7 @@ export default class ActionBtn {
     this.isLoading = value
     if (value) {
       this.$el.classList.add('atk-btn-loading')
-      this.$el.innerText = loadingText || `${this.ctx.$t('loading')}...`
+      this.$el.innerText = loadingText || `${$t('loading')}...`
     } else {
       this.$el.classList.remove('atk-btn-loading')
       this.$el.innerText = this.getText()

package/src/{lib → components}/checker/admin.ts

@@ -1,6 +1,7 @@
-import * as Utils from '../utils'
-import User from '../user'
-import { Checker } from '.'
+import $t from '@/i18n'
+import * as Utils from '@/lib/utils'
+import User from '@/lib/user'
+import type { Checker } from '.'
 
 const AdminChecker: Checker = {
   inputType: 'password',
@@ -19,7 +20,7 @@ const AdminChecker: Checker = {
   },
 
   body(checker) {
-    return Utils.createElement(`<span>${checker.getCtx().$t('adminCheck')}</span>`)
+    return Utils.createElement(`<span>${$t('adminCheck')}</span>`)
   },
 
   onSuccess(checker, userToken, inputVal, formEl) {
@@ -27,8 +28,7 @@ const AdminChecker: Checker = {
       isAdmin: true,
       token: userToken
     })
-    checker.getCtx().trigger('user-changed', User.data)
-    checker.getCtx().listReload()
+    checker.getOpts().onReload()
   },
 
   onError(checker, err, inputVal, formEl) {}

package/src/{lib → components}/checker/captcha-renders.ts

@@ -1,12 +1,13 @@
-import * as Utils from '../utils'
-import * as Ui from '../ui'
-import { CheckerCtx } from '.'
+import $t from '@/i18n'
+import * as Utils from '@/lib/utils'
+import * as Ui from '@/lib/ui'
+import type { CheckerCtx } from '.'
 
 /** 图片验证码 */
 export function imgBody(checker: CheckerCtx) {
   // 图片验证方式
   const elem = Utils.createElement(
-    `<span><img class="atk-captcha-img" src="${checker.get('img_data') || ''}">${checker.getCtx().$t('captchaCheck')}</span>`
+    `<span><img class="atk-captcha-img" src="${checker.get('img_data') || ''}">${$t('captchaCheck')}</span>`
   );
 
   // 刷新验证码
@@ -29,7 +30,7 @@ export function iframeBody(checker: CheckerCtx) {
   const $iframe = Utils.createElement<HTMLIFrameElement>(`<iframe class="atk-fade-in"></iframe>`)
   $iframe.style.display = 'none'
   Ui.showLoading($iframeWrap, { transparentBg: true })
-  $iframe.src = `${checker.getCtx().conf.server}/api/captcha/get?t=${+new Date()}`
+  $iframe.src = `${checker.getOpts().getIframeURLBase() || ''}/api/captcha/get?t=${+new Date()}`
   $iframe.onload = () => {
     $iframe.style.display = ''
     Ui.hideLoading($iframeWrap)
@@ -49,7 +50,7 @@ export function iframeBody(checker: CheckerCtx) {
     if (stop) return
     let isPass = false
     try {
-      const resp = await checker.getCtx().getApi().captcha.captchaStatus()
+      const resp = await checker.getApi().captcha.captchaStatus()
       isPass = resp.is_pass
     } catch { isPass = false }
     if (isPass) {

package/src/{lib → components}/checker/captcha.ts

@@ -1,5 +1,5 @@
 
-import { Checker } from '.'
+import type { Checker } from '.'
 import * as render from './captcha-renders'
 
 const CaptchaChecker: Checker = {