artalk 2.6.4 → 2.7.1

package/dist/types/config.d.ts

@@ -0,0 +1,110 @@
+import { I18n } from '../src/i18n';
+import { CommentData } from './data';
+export interface ArtalkConfig {
+    /** 装载元素 */
+    el: string | HTMLElement;
+    /** 页面唯一标识（完整 URL） */
+    pageKey: string;
+    /** 页面标题 */
+    pageTitle: string;
+    /** 服务器地址 */
+    server: string;
+    /** 站点名 */
+    site: string;
+    /** 评论框占位字符 */
+    placeholder: string;
+    /** 评论为空时显示字符 */
+    noComment: string;
+    /** 发送按钮文字 */
+    sendBtn: string;
+    /** 评论框穿梭（显示在待回复评论后面） */
+    editorTravel: boolean;
+    /** 表情包 */
+    emoticons: object | any[] | string | false;
+    /** Gravatar 头像 */
+    gravatar: {
+        /** API 地址 */
+        mirror: string;
+        /** API 参数 */
+        params: string;
+    };
+    /** 头像链接生成器 */
+    avatarURLBuilder?: (comment: CommentData) => string;
+    /** 分页配置 */
+    pagination: {
+        /** 每次请求获取数量 */
+        pageSize: number;
+        /** 阅读更多模式 */
+        readMore: boolean;
+        /** 滚动到底部自动加载 */
+        autoLoad: boolean;
+    };
+    /** 内容限高 */
+    heightLimit: {
+        /** 评论内容限高 */
+        content: number;
+        /** 子评论区域限高 */
+        children: number;
+        /** 滚动限高 */
+        scrollable: boolean;
+    };
+    /** 评论投票按钮 */
+    vote: boolean;
+    /** 评论投票反对按钮 */
+    voteDown: boolean;
+    /** 评论预览功能 */
+    preview: boolean;
+    /** 评论数绑定元素 Selector */
+    countEl: string;
+    /** PV 数绑定元素 Selector */
+    pvEl: string;
+    /** 夜间模式 */
+    darkMode: boolean | 'auto';
+    /** 请求超时（单位：秒） */
+    reqTimeout: number;
+    /** 平铺模式 */
+    flatMode: boolean | 'auto';
+    /** 嵌套模式 · 最大层数 */
+    nestMax: number;
+    /** 嵌套模式 · 排序方式 */
+    nestSort: 'DATE_ASC' | 'DATE_DESC';
+    /** 显示 UA 徽标 */
+    uaBadge: boolean;
+    /** 评论列表排序功能 (显示 Dropdown) */
+    listSort: boolean;
+    /** 图片上传功能 */
+    imgUpload: boolean;
+    /** 图片上传器 */
+    imgUploader?: (file: File) => Promise<string>;
+    /** 版本检测 */
+    versionCheck: boolean;
+    /** 引用后端配置 */
+    useBackendConf: boolean;
+    /** 语言本地化 */
+    locale: I18n | string;
+    /** 后端版本 (系统数据，用户不允许更改) */
+    apiVersion?: string;
+    /** Replacer for marked */
+    markedReplacers?: ((raw: string) => string)[];
+    /** 列表请求参数修改器 */
+    listFetchParamsModifier?: (params: any) => void;
+    remoteConfModifier?: (conf: Partial<ArtalkConfig>) => void;
+    listUnreadHighlight?: boolean;
+    scrollRelativeTo?: () => HTMLElement;
+}
+/**
+ * 本地持久化用户数据
+ * @note 始终保持一层结构，不支持多层结构
+ */
+export interface LocalUser {
+    /** 昵称 */
+    nick: string;
+    /** 邮箱 */
+    email: string;
+    /** 链接 */
+    link: string;
+    /** TOKEN */
+    token: string;
+    /** 是否为管理员 */
+    isAdmin: boolean;
+}

package/dist/types/context.d.ts

@@ -1,142 +1,62 @@
-import ArtalkConfig from './artalk-config'
-import { CommentData, NotifyData } from './artalk-data'
-import { EventPayloadMap, Event, EventScopeType, Handler } from './event'
-import { internal as internalLocales, I18n } from '../src/i18n'
-import Api from '../src/api'
-import User from '../src/lib/user'
-import Comment from '../src/comment'
-import { SidebarShowPayload } from '../src/layer/sidebar-layer'
-import { CheckerCaptchaPayload, CheckerPayload } from '../src/lib/checker'
-import type { TMarked } from '../src/lib/marked'
-import type { TInjectedServices } from '../src/service'
-
+import type { TInjectedServices } from '../src/service';
+import type { CheckerCaptchaPayload, CheckerPayload } from '../src/components/checker';
+import type { EventManagerFuncs } from '../src/lib/event-manager';
+import type { TMarked } from '../src/lib/marked';
+import type { I18n } from '../src/i18n';
+import type Api from '../src/api';
+import type { SidebarShowPayload, EventPayloadMap, ArtalkConfig, CommentData, DataManagerApi, ListFetchParams, NotifyLevel } from '.';
 /**
  * Context 接口
  *
  * (面向接口的编程)
  */
-export default interface ContextApi {
-  /** Artalk 根元素对象 */
-  $root: HTMLElement
-
-  /** 依赖注入函数 */
-  inject<K extends keyof TInjectedServices>(depName: K, obj: TInjectedServices[K]): void
-
-  /** 获取依赖对象 */
-  get<K extends keyof TInjectedServices>(depName: K): TInjectedServices[K]
-
-  /** 配置对象 */
-  // TODO 修改为 getConf() 和 setConf()
-  conf: ArtalkConfig
-
-  /** marked 依赖对象 */
-  getMarkedInstance(): TMarked | undefined
-
-  /** marked 内容替换器 */
-  markedReplacers: ((raw: string) => string)[]
-
-  /** 获取 API 以供 HTTP 请求 */
-  getApi(): Api
-
-  /** 获取评论实例对象列表 */
-  getCommentList(): Comment[]
-
-  /** 获取评论数据列表 */
-  getCommentDataList(): CommentData[]
-
-  /** 查找评论 */
-  findComment(id: number): Comment|undefined
-
-  /** 删除评论 */
-  deleteComment(comment: number|Comment): void
-
-  /** 清空评论 */
-  clearAllComments(): void
-
-  /** 插入评论 */
-  insertComment(commentData: CommentData): void
-
-  /** 更新评论 */
-  updateComment(commentData: CommentData): void
-
-  /** 评论回复 */
-  replyComment(commentData: CommentData, $comment: HTMLElement, scroll?: boolean): void
-
-  /** 取消回复评论 */
-  cancelReplyComment(): void
-
-  /** 编辑评论 */
-  editComment(commentData: CommentData, $comment: HTMLElement): void
-
-  /** 取消编辑评论 */
-  cancelEditComment(): void
-
-  /** 更新通知数据 */
-  updateNotifies(notifies: NotifyData[]): void
-
-  /** 列表 - 重新加载数据 */
-  listReload(): void
-
-  /** 列表 - 重新加载数据 (别名) */
-  reload(): void
-
-  /** 列表 - UI 更新 */
-  listRefreshUI(): void
-
-  /** 列表 - HashGoto 功能检测 */
-  listHashGotoCheck(): void
-
-  /** 显示侧边栏 */
-  showSidebar(payload?: SidebarShowPayload): void
-
-  /** 隐藏侧边栏 */
-  hideSidebar(): void
-
-  /** 编辑器 - 关闭评论 */
-  editorClose(): void
-
-  /** 编辑器 - 打开评论 */
-  editorOpen(): void
-
-  /** 编辑器 - 显示加载 */
-  editorShowLoading(): void
-
-  /** 编辑器 - 隐藏加载 */
-  editorHideLoading(): void
-
-  /** 编辑器 - 显示提示消息 */
-  editorShowNotify(msg: string, type: "i" | "s" | "w" | "e"): void
-
-  /** 评论框 - 位置移动 */
-  editorTravel($el: HTMLElement): void
-
-  /** 评论框 - 位置回归 */
-  editorTravelBack(): void
-
-  /** 验证码检测 */
-  checkCaptcha(payload: CheckerCaptchaPayload): void
-
-  /** 管理员检测 */
-  checkAdmin(payload: CheckerPayload): void
-
-  /** 管理员显示元素可见性更新 */
-  checkAdminShowEl(): void
-
-  /** 订阅注册 */
-  on<K extends keyof EventPayloadMap>(name: K, handler: Handler<EventPayloadMap[K]>, scope?: EventScopeType): void
-
-  /** 订阅取消 */
-  off<K extends keyof EventPayloadMap>(name: K, handler?: Handler<EventPayloadMap[K]>, scope?: EventScopeType): void
-
-  /** 订阅发布 */
-  trigger<K extends keyof EventPayloadMap>(name: K, payload?: EventPayloadMap[K], scope?: EventScopeType): void
-
-  /** i18n 翻译 */
-  $t(key: keyof I18n, args?: {[key: string]: string}): string
-
-  /** 设置夜间模式 */
-  setDarkMode(darkMode: boolean): void
-
-  /** 更新配置 */
-  updateConf(conf: Partial<ArtalkConfig>): void
+export interface ContextApi extends EventManagerFuncs<EventPayloadMap> {
+    /** Artalk 根元素对象 */
+    $root: HTMLElement;
+    /** 依赖注入函数 */
+    inject<K extends keyof TInjectedServices>(depName: K, obj: TInjectedServices[K]): void;
+    /** 获取依赖对象 */
+    get<K extends keyof TInjectedServices>(depName: K): TInjectedServices[K];
+    /** 配置对象 */
+    conf: ArtalkConfig;
+    /** marked 依赖对象 */
+    getMarked(): TMarked | undefined;
+    /** 获取 API 以供 HTTP 请求 */
+    getApi(): Api;
+    /** 获取数据管理器对象 */
+    getData(): DataManagerApi;
+    /** 评论回复 */
+    replyComment(commentData: CommentData, $comment: HTMLElement): void;
+    /** 编辑评论 */
+    editComment(commentData: CommentData, $comment: HTMLElement): void;
+    /** 获取评论数据 */
+    fetch(params: Partial<ListFetchParams>): void;
+    /** 重载评论数据 */
+    reload(): void;
+    /** 列表滚动到第一个评论的位置 */
+    listGotoFirst(): void;
+    /** 显示侧边栏 */
+    showSidebar(payload?: SidebarShowPayload): void;
+    /** 隐藏侧边栏 */
+    hideSidebar(): void;
+    /** 编辑器 - 显示加载 */
+    editorShowLoading(): void;
+    /** 编辑器 - 隐藏加载 */
+    editorHideLoading(): void;
+    /** 编辑器 - 显示提示消息 */
+    editorShowNotify(msg: string, type: NotifyLevel): void;
+    /** 评论框 - 复原状态 */
+    editorResetState(): void;
+    /** 验证码检测 */
+    checkCaptcha(payload: CheckerCaptchaPayload): void;
+    /** 管理员检测 */
+    checkAdmin(payload: CheckerPayload): void;
+    /** i18n 翻译 */
+    $t(key: keyof I18n, args?: {
+        [key: string]: string;
+    }): string;
+    /** 设置夜间模式 */
+    setDarkMode(darkMode: boolean | 'auto'): void;
+    /** 更新配置 */
+    updateConf(conf: Partial<ArtalkConfig>): void;
 }

package/dist/types/data.d.ts

@@ -0,0 +1,194 @@
+export interface CommentData {
+    /** 评论 ID */
+    id: number;
+    /** 评论正文 */
+    content: string;
+    /** 用户昵称 */
+    nick: string;
+    /** 用户邮箱 (该字段仅管理员可见) */
+    email?: string;
+    /** 用户邮箱（已加密） */
+    email_encrypted: string;
+    /** 用户链接 */
+    link: string;
+    /** 回复目标评论 ID */
+    rid: number;
+    /** User Agent */
+    ua: string;
+    /** 评论日期 */
+    date: string;
+    /** 是否折叠 */
+    is_collapsed?: boolean;
+    /** 是否待审 */
+    is_pending?: boolean;
+    /** 是否置顶 */
+    is_pinned?: boolean;
+    /** 是否为管理员 */
+    is_admin?: boolean;
+    /** 徽章文字 */
+    badge_name?: string;
+    /** 徽章颜色 */
+    badge_color?: string;
+    /** IP 归属地 */
+    ip_region?: string;
+    /** 是否允许回复 */
+    is_allow_reply?: boolean;
+    /** 评论页面 key */
+    page_key: string;
+    /** 评论页面 url */
+    page_url?: string;
+    /** 是否可见 */
+    visible: boolean;
+    /** 站点名（用于隔离） */
+    site_name: string;
+    /** 赞同数 */
+    vote_up: number;
+    /** 反对数 */
+    vote_down: number;
+}
+export interface ListData {
+    /** 评论数据 */
+    comments: CommentData[];
+    /** 根评论总数 */
+    total_roots: number;
+    /** 评论总数（包括所有子评论） */
+    total: number;
+    /** 页面信息 */
+    page: PageData;
+    /** 站点信息 */
+    site: SiteData;
+    /** 未读的 Notifies */
+    unread: NotifyData[];
+    /** 未读计数 */
+    unread_count: number;
+    /** API 版本 */
+    api_version: ApiVersionData;
+    /** 后端配置 */
+    conf: any;
+}
+export interface PageData {
+    /** 页面 ID */
+    id: number;
+    /** 页面唯一标识符 */
+    key: string;
+    /** 页面标题 */
+    title: string;
+    /** 页面 url */
+    url: string;
+    /** 仅管理员可评 */
+    admin_only: boolean;
+    /** 站点名（用于隔离） */
+    site_name: string;
+    /** 赞同数 */
+    vote_up: number;
+    /** 反对数 */
+    vote_down: number;
+}
+export interface SiteData {
+    /** 站点 ID */
+    id: number;
+    /** 站点名 */
+    name: string;
+    /** 站点 URLs */
+    urls: string[];
+    /** 站点 URLs（原始字符串） */
+    urls_raw: string;
+    /** 站点主 URL */
+    first_url: string;
+}
+export interface UserData {
+    /** 用户 ID */
+    id: number;
+    /** 用户名 */
+    name: string;
+    /** 邮箱 */
+    email: string;
+    /** 链接 */
+    link: string;
+    /** 徽章名称 */
+    badge_name: string;
+    /** 徽章颜色 */
+    badge_color: string;
+    /** 是否属于管理员 */
+    is_admin: boolean;
+    /** 所属站点名 */
+    site_names: string[];
+    /** 所属站点名 (字符串) */
+    site_names_raw: string;
+    /** 是否允许接收邮件通知 */
+    receive_email: boolean;
+}
+export interface UserDataForAdmin extends UserData {
+    /** 最后一次操作 IP */
+    last_ip: string;
+    /** 最后一次操作 UA */
+    last_ua: string;
+    /** 是否存在于配置文件中 */
+    is_in_conf: boolean;
+    /** 评论数 */
+    comment_count: number;
+    /** 密码 */
+    password: string;
+}
+export interface NotifyData {
+    /** 通知 ID */
+    id: number;
+    /** 用户 ID */
+    user_id: number;
+    /** 评论 ID */
+    comment_id: number;
+    /** 是否已读 */
+    is_read: boolean;
+    /** 是否已发送邮件通知 */
+    is_emailed: boolean;
+    /** 标为已读地址 */
+    read_link: string;
+}
+export type EmoticonGrpData = {
+    name: string;
+    type: 'emoticon' | 'image' | 'emoji';
+    items: {
+        key: string;
+        val: string;
+    }[];
+};
+export type EmoticonListData = EmoticonGrpData[];
+export interface ApiVersionData {
+    /** API 程序名 */
+    app: string;
+    /** API 程序版本号 */
+    version: string;
+    /** API 程序 CommitHash */
+    commit_hash: string;
+}
+export interface ListFetchParams {
+    offset: number;
+    limit: number;
+    flatMode: boolean;
+    paramsModifier?: (p: any) => void;
+    onSuccess?: (data: ListData) => void;
+    onError?: (err: any) => void;
+}
+export interface ListLastFetchData {
+    params: ListFetchParams;
+    data?: ListData;
+}
+export interface DataManagerApi {
+    getLoading(): boolean;
+    setLoading(val: boolean): void;
+    getListLastFetch(): ListLastFetchData | undefined;
+    setListLastFetch(val: ListLastFetchData): void;
+    getComments(): CommentData[];
+    findComment(id: number): CommentData | undefined;
+    fetchComments(params: Partial<ListFetchParams>): void;
+    loadComments(comments: CommentData[]): void;
+    clearComments(): void;
+    insertComment(comment: CommentData): void;
+    updateComment(comment: CommentData): void;
+    deleteComment(id: number): void;
+    getUnreads(): NotifyData[];
+    updateUnreads(unreads: NotifyData[]): void;
+    getPage(): PageData | undefined;
+    updatePage(pageData: PageData): void;
+}
+export type NotifyLevel = "i" | "s" | "w" | "e";

package/dist/types/editor.d.ts

@@ -0,0 +1,76 @@
+import type { CommentData, NotifyLevel } from '.';
+import type Component from '../src/lib/component';
+import type { EditorUI } from '../src/editor/ui';
+export type EditorState = 'reply' | 'edit' | 'normal';
+export interface EditorApi extends Component {
+    getUI(): EditorUI;
+    /**
+     * Get the header input elements
+     */
+    getHeaderInputEls(): Record<string, HTMLInputElement>;
+    /**
+     * Set content
+     */
+    setContent(val: string): void;
+    /**
+     * Insert content
+     */
+    insertContent(val: string): void;
+    /**
+     * Get the final content
+     *
+     * This function returns the raw content or the content transformed through a plugin hook.
+     */
+    getContentFinal(): string;
+    /**
+     * Get the raw content which is inputed by user
+     */
+    getContentRaw(): string;
+    /**
+     * Get the HTML format content which is rendered by marked (a markdown parser)
+     */
+    getContentMarked(): string;
+    /**
+     * Get editor current state
+     */
+    getState(): EditorState;
+    /**
+     * Focus editor
+     */
+    focus(): void;
+    /**
+     * Reset editor
+     */
+    reset(): void;
+    /**
+     * Reset editor UI
+     *
+     * call it will move editor to the initial position
+     */
+    resetState(): void;
+    /**
+     * Submit comment
+     */
+    submit(): void;
+    /**
+     * Show notification message
+     */
+    showNotify(msg: string, type: NotifyLevel): void;
+    /**
+     * Show loading on editor
+     */
+    showLoading(): void;
+    /**
+     * Hide loading on editor
+     */
+    hideLoading(): void;
+    /**
+     * Start replaying a comment
+     */
+    setReply(commentData: CommentData, $comment: HTMLElement, scroll?: boolean): void;
+    /**
+     * Start editing a comment
+     */
+    setEditComment(commentData: CommentData, $comment: HTMLElement): void;
+}
+export default EditorApi;

package/dist/types/event.d.ts

@@ -1,28 +1,39 @@
-import { CommentData } from './artalk-data'
-import { LocalUser } from './artalk-config'
-
-/** EventName to EventPayload Type */
-export interface EventPayloadMap {
-  'list-load': undefined           // 评论加载时
-  'list-loaded': undefined         // 评论装载后
-  'list-inserted': CommentData     // 评论插入后
-  'editor-submit': undefined       // 编辑器提交时
-  'editor-submitted': undefined    // 编辑器提交后
-  'user-changed': LocalUser        // 本地用户数据变更时
-  'conf-loaded': undefined         // Artalk 配置变更时
-  'sidebar-show': undefined        // 侧边栏显示
-  'sidebar-hide': undefined        // 侧边栏隐藏
+import type Comment from '../src/comment';
+import { CommentData, ListData, ListFetchParams, NotifyData, PageData } from './data';
+import { ArtalkConfig, LocalUser } from './config';
+interface ErrorData {
+    msg: string;
+    data?: any;
 }
-
-// ============================================
-export interface Handler<P> {
-  (payload: P): void
+interface ListFetchedArgs {
+    params: Partial<ListFetchParams>;
+    data?: ListData;
+    error?: ErrorData;
 }
-
-export type EventScopeType = 'internal'|'external'
-
-export interface Event<K extends keyof EventPayloadMap = keyof EventPayloadMap> {
-  name: keyof EventPayloadMap
-  handler: Handler<EventPayloadMap[K]>
-  scope: EventScopeType
+/** EventName to EventPayload Type */
+export interface EventPayloadMap {
+    'inited': undefined;
+    'destroy': undefined;
+    'list-fetch': Partial<ListFetchParams>;
+    'list-fetched': ListFetchedArgs;
+    'list-load': CommentData[];
+    'list-loaded': CommentData[];
+    'list-error': ErrorData;
+    'list-goto-first': undefined;
+    'list-reach-bottom': undefined;
+    'comment-inserted': CommentData;
+    'comment-updated': CommentData;
+    'comment-deleted': CommentData;
+    'comment-rendered': Comment;
+    'unreads-updated': NotifyData[];
+    'list-goto': number;
+    'page-loaded': PageData;
+    'editor-submit': undefined;
+    'editor-submitted': undefined;
+    'user-changed': LocalUser;
+    'conf-loaded': ArtalkConfig;
+    'dark-mode-changed': boolean;
+    'sidebar-show': undefined;
+    'sidebar-hide': undefined;
 }
+export {};

package/dist/types/index.d.ts

@@ -0,0 +1,7 @@
+export * from './config';
+export * from './data';
+export * from './context';
+export * from './editor';
+export * from './event';
+export * from './plugin';
+export * from './sidebar';

package/dist/types/plugin.d.ts

@@ -0,0 +1,2 @@
+import { ContextApi } from './context';
+export type ArtalkPlugin = (ctx: ContextApi) => void;

package/dist/types/sidebar.d.ts

@@ -0,0 +1,3 @@
+export interface SidebarShowPayload {
+    view?: 'comments' | 'sites' | 'pages' | 'transfer';
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "artalk",
-  "version": "2.6.4",
+  "version": "2.7.1",
   "license": "MIT",
   "description": "A Selfhosted Comment System",
   "keywords": [
@@ -22,6 +22,7 @@
   "jsdelivr": "./dist/Artalk.iife.js",
   "module": "./dist/Artalk.es.js",
   "types": "./dist/src/main.d.ts",
+  "typings": "./dist/src/main.d.ts",
   "devDependencies": {
     "@types/marked": "5.0.1"
   },
@@ -41,6 +42,8 @@
     "deploy": "gh-pages -d deploy",
     "predeploy": "pnpm build && pnpm build:demo && pnpm copy:deploy",
     "copy:deploy": "cp -r dist deploy && cp CNAME deploy",
-    "lint": "eslint --ext .js,.ts src"
+    "lint": "eslint --ext .js,.ts src",
+    "test:e2e": "playwright test",
+    "test:report": "playwright show-report"
   }
 }