artalk 2.3.4 → 2.4.0

package/src/list/list-lite.ts

@@ -7,7 +7,7 @@ import Comment from '../comment'
 import Pagination from '../components/pagination'
 import ReadMoreBtn from '../components/read-more-btn'
 import * as ListNest from './list-nest'
-import { backendMinVersion } from '../../package.json'
+import { backendMinVersion, version as ARTALK_VERSION } from '../../package.json'
 
 export default class ListLite extends Component {
   protected $commentsWrap: HTMLElement
@@ -78,40 +78,42 @@ export default class ListLite extends Component {
     return this.$commentsWrap
   }
 
+  /** 加载动画 */
+  public setLoading(val: boolean, isFirstLoad: boolean = false) {
+    this.isLoading = val
+    if (isFirstLoad) Ui.setLoading(val, this.$el)
+    else if (this.pageMode === 'read-more') this.readMoreBtn!.setLoading(val)
+    else if (this.pageMode === 'pagination') this.pagination!.setLoading(val)
+  }
+
   /** 评论获取 */
   public async fetchComments(offset: number) {
     if (this.isLoading) return
 
+    const isFirstLoad = (offset === 0)
+    const setLoading = (val: boolean) => this.setLoading(val, isFirstLoad)
+
     // 加载动画
-    const showLoading = () => {
-      this.isLoading = true
-      if (offset === 0) Ui.showLoading(this.$el)
-      else if (this.pageMode === 'read-more') this.readMoreBtn!.setLoading(true)
-      else if (this.pageMode === 'pagination') this.pagination!.setLoading(true)
-    }
-    const hideLoading = () => {
-      this.isLoading = false
-      if (offset === 0) Ui.hideLoading(this.$el)
-      else if (this.pageMode === 'read-more') this.readMoreBtn!.setLoading(false)
-      else if (this.pageMode === 'pagination') this.pagination!.setLoading(false)
-    }
-    showLoading()
+    setLoading(true)
 
     // 事件通知（开始加载评论）
     this.ctx.trigger('list-load')
 
     // 清空评论（加载按钮）
-    if (this.pageMode === 'read-more' && offset === 0) { this.ctx.clearAllComments() }
+    if (isFirstLoad && this.pageMode === 'read-more') {
+      this.ctx.clearAllComments()
+    }
 
     // 请求评论数据
     let listData: ListData
     try {
-      listData = await this.ctx.getApi().get(offset, this.pageSize, this.flatMode, this.paramsEditor)
+      listData = await this.ctx.getApi().comment
+        .get(offset, this.pageSize, this.flatMode, this.paramsEditor)
     } catch (e: any) {
       this.onError(e.msg || String(e), offset, e.data)
       throw e
     } finally {
-      hideLoading()
+      setLoading(false)
     }
 
     // 清除原有错误
@@ -124,7 +126,7 @@ export default class ListLite extends Component {
       this.onError(String(e), offset)
       throw e
     } finally {
-      hideLoading()
+      setLoading(false)
     }
   }
 
@@ -194,15 +196,13 @@ export default class ListLite extends Component {
         const at = this.scrollListenerAt || document
         if (this.autoLoadScrollEvent) at.removeEventListener('scroll', this.autoLoadScrollEvent) // 解除原有
         this.autoLoadScrollEvent = () => {
-          if (this.pageMode !== 'read-more') return
-          if (!this.readMoreBtn) return
-
-          if (!this.readMoreBtn.hasMore) return
-          if (this.isLoading) return
+          if (this.pageMode !== 'read-more'
+            || !this.readMoreBtn?.hasMore
+            || this.isLoading
+          ) return
 
           const $target = this.$el.querySelector<HTMLElement>('.atk-list-comments-wrap > .atk-comment-wrap:nth-last-child(3)') // 获取倒数第3个评论元素
-          if (!$target) return
-          if (Ui.isVisible($target, this.scrollListenerAt)) {
+          if ($target && Ui.isVisible($target, this.scrollListenerAt)) {
             this.readMoreBtn.click() // 自动点击加载更多按钮
           }
         }

package/src/list/list.ts

@@ -1,7 +1,6 @@
-import '../style/list.less'
-
 import { ListData, NotifyData } from '~/types/artalk-data'
 import Context from '~/types/context'
+import { version as ARTALK_VERSION } from '../../package.json'
 import * as Utils from '../lib/utils'
 import * as Ui from '../lib/ui'
 import ListHTML from './list.html?raw'
@@ -143,7 +142,7 @@ export default class List extends ListLite {
     // 已阅 API
     const notifyKey = Utils.getQueryParam('atk_notify_key')
     if (notifyKey) {
-      this.ctx.getApi().markRead(notifyKey)
+      this.ctx.getApi().user.markRead(notifyKey)
         .then(() => {
           this.unread = this.unread.filter(o => o.comment_id !== commentId)
           this.updateUnread(this.unread)
@@ -175,7 +174,7 @@ export default class List extends ListLite {
     if (!this.data || !this.data.page) return
 
     this.ctx.editorShowLoading()
-    this.ctx.getApi().pageEdit(this.data.page)
+    this.ctx.getApi().page.pageEdit(this.data.page)
       .then((page) => {
         if (this.data)
           this.data.page = { ...page }

package/src/main.ts

@@ -1,3 +1,6 @@
 import Artalk from './artalk'
+import ListLite from './list/list-lite'
 
 export default Artalk
+
+export { ListLite }

package/src/style/main.less

@@ -1,4 +1,9 @@
 @import "./_color.less";
+@import './comment.less';
+@import './list.less';
+@import './pagination.less';
+@import './editor.less';
+@import './sidebar-layer.less';
 
 .artalk {
   position: relative;
@@ -460,4 +465,5 @@ i.atk-icon {
 
 img[atk-emoticon] {
   max-height: 60px;
+  display: initial;
 }

package/types/context.d.ts

@@ -38,7 +38,7 @@ export default interface ContextApi {
   /* 设置持有的同事类 (中介者模式) */
   setApi(api: Api): void
   setEditor(editor: Editor): void
-  setList(list: ListLite): void
+  setList(list?: ListLite): void
   setSidebarLayer(list: SidebarLayer): void
   setCheckerLauncher(checkerLauncher: CheckerLauncher): void
 
@@ -90,6 +90,9 @@ export default interface ContextApi {
   /** 列表 - UI 更新 */
   listRefreshUI(): void
 
+  /** 列表 - HashGoto 功能检测 */
+  listHashGotoCheck(): void
+
   /** 显示侧边栏 */
   showSidebar(payload?: SidebarShowPayload): void
 

package/types/global.d.ts

@@ -1,2 +0,0 @@
-declare const ARTALK_VERSION: string
-declare const ARTALK_LITE: boolean

package/vite-base.config.ts

@@ -1,11 +1,9 @@
 import { defineConfig } from 'vite'
 import tsconfigPaths from 'vite-tsconfig-paths'
-import { version } from './package.json'
+import { resolve } from 'path'
+import dts from 'vite-plugin-dts'
 
 export default defineConfig({
-  define: {
-    ARTALK_VERSION: JSON.stringify(version),
-  },
   css: {
     preprocessorOptions: {
       less: {
@@ -13,5 +11,11 @@ export default defineConfig({
      },
     },
   },
-  plugins: [tsconfigPaths()],
+  resolve: {
+    alias: {
+      '@': resolve(__dirname, 'src'),
+      '~': resolve(__dirname),
+    }
+  },
+  plugins: [tsconfigPaths(), dts()],
 })

package/vite.config.ts

@@ -17,7 +17,11 @@ export default Utils.mergeDeep(baseConf, defineConfig({
     },
     rollupOptions: {
       output: {
-        assetFileNames: (assetInfo) => (/\.css$/.test(assetInfo.name) ? "Artalk.css" : "[name].[ext]")
+        assetFileNames: (assetInfo) => (/\.css$/.test(assetInfo.name || '') ? "Artalk.css" : "[name].[ext]"),
+
+        // Entry module "src/main.ts" is using named and default exports together.
+        // Consumers of your bundle will have to use `Artalk["default"]` to access the default export
+        exports: 'named'
       }
     }
   },

package/types/index.d.ts

@@ -1,3 +0,0 @@
-import Artalk from '../src/artalk'
-
-export default Artalk