refactor(ui/types): better ArtalkType import and export (#620)

ui/packages/artalk-sidebar/src/components/PageEditor.vue

@@ -1,19 +1,19 @@
 <script setup lang="ts">
-import type { PageData } from 'artalk/types/artalk-data'
+import type { ArtalkType } from 'artalk'
 import { artalk } from '../global'
 
 const props = defineProps<{
-  page: PageData
+  page: ArtalkType.PageData
 }>()
 
 const emit = defineEmits<{
   (evt: 'close'): void
-  (evt: 'update', page: PageData): void
+  (evt: 'update', page: ArtalkType.PageData): void
   (evt: 'remove', id: number): void
 }>()
 
 const { page } = toRefs(props)
-const editFieldKey = ref<keyof PageData|null>(null)
+const editFieldKey = ref<keyof ArtalkType.PageData|null>(null)
 const editFieldVal = computed(() => String(editFieldKey ? page.value[editFieldKey.value!] || '' : ''))
 const isLoading = ref(false)
 const { t } = useI18n()
@@ -28,7 +28,7 @@ function editKey() {
 
 async function editAdminOnly() {
   isLoading.value = true
-  let p: PageData
+  let p: ArtalkType.PageData
   try {
     p = await artalk!.ctx.getApi().page.pageEdit({ ...page.value, admin_only: !page.value.admin_only })
   } catch (err: any) {
@@ -41,7 +41,7 @@ async function editAdminOnly() {
 
 async function sync() {
   isLoading.value = true
-  let p: PageData
+  let p: ArtalkType.PageData
   try {
     p = (await artalk!.ctx.getApi().page.pageFetch(page.value.id)).page
   } catch (err: any) {
@@ -76,7 +76,7 @@ function close() {
 async function onFieldEditorYes(val: string) {
   if (editFieldVal.value !== val) {
     isLoading.value = true
-    let p: PageData
+    let p: ArtalkType.PageData
     try {
       p = await artalk!.ctx.getApi().page.pageEdit({ ...page.value, [editFieldKey.value as any]: val })
     } catch (err: any) {

ui/packages/artalk-sidebar/src/components/SiteCreate.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { artalk } from '../global'
-import type { SiteData } from 'artalk/types/artalk-data'
+import type { ArtalkType } from 'artalk'
 
 const { t } = useI18n()
 
@@ -10,7 +10,7 @@ const props = defineProps<{
 
 const emit = defineEmits<{
   (evt: 'close'): void
-  (evt: 'done', siteNew: SiteData): void
+  (evt: 'done', siteNew: ArtalkType.SiteData): void
 }>()
 
 const isLoading = ref(false)
@@ -31,7 +31,7 @@ async function submit() {
   if (siteName === '') { alert('请输入站点名称'); return }
 
   isLoading.value = true
-  let s: SiteData
+  let s: ArtalkType.SiteData
   try {
     s = await artalk!.ctx.getApi().site.siteAdd(siteName, siteUrls)
   } catch (err: any) {

ui/packages/artalk-sidebar/src/components/SiteEditor.vue

@@ -1,20 +1,20 @@
 <script setup lang="ts">
-import type { SiteData } from 'artalk/types/artalk-data'
+import type { ArtalkType } from 'artalk'
 import { artalk } from '../global'
 
 const props = defineProps<{
-  site: SiteData
+  site: ArtalkType.SiteData
 }>()
 
 const emit = defineEmits<{
   (evt: 'close'): void
-  (evt: 'update', page: SiteData): void
+  (evt: 'update', page: ArtalkType.SiteData): void
   (evt: 'remove', id: number): void
 }>()
 
 const { site } = toRefs(props)
 const isLoading = ref(false)
-const editFieldKey = ref<keyof SiteData|null>(null)
+const editFieldKey = ref<keyof ArtalkType.SiteData|null>(null)
 const editFieldVal = computed(() => {
   if (editFieldKey.value === 'urls') return site.value.urls_raw || ''
   return String(editFieldKey ? site.value[editFieldKey.value!] || '' : '')
@@ -58,7 +58,7 @@ function del() {
 async function onFieldEditorYes(val: string) {
   if (editFieldVal.value !== val) {
     isLoading.value = true
-    let s: SiteData
+    let s: ArtalkType.SiteData
     try {
       s = await artalk!.ctx.getApi().site.siteEdit({ ...site.value, [editFieldKey.value as any]: val })
     } catch (err: any) {

ui/packages/artalk-sidebar/src/components/SiteSwitcher.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import type { SiteData } from 'artalk/types/artalk-data'
 import { storeToRefs } from 'pinia';
 import { useNavStore } from '../stores/nav'
 import { useUserStore } from '../stores/user'

ui/packages/artalk-sidebar/src/components/UserEditor.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { artalk, bootParams } from '../global'
-import type { UserData, UserDataForAdmin } from 'artalk/types/artalk-data'
+import type { ArtalkType } from 'artalk'
 
 const { t } = useI18n()
 
@@ -22,7 +22,7 @@ const props = defineProps<{
 
 const emit = defineEmits<{
   (evt: 'close'): void
-  (evt: 'update', user: UserDataForAdmin): void
+  (evt: 'update', user: ArtalkType.UserDataForAdmin): void
 }>()
 
 const user = ref<IUserEditData>()

ui/packages/artalk-sidebar/src/global.ts

@@ -1,5 +1,5 @@
 import Artalk from 'artalk'
-import type { LocalUser } from 'artalk/types/artalk-config'
+import type { ArtalkType } from 'artalk'
 import { useUserStore } from './stores/user'
 const { t } = useI18n()
 
@@ -13,7 +13,7 @@ export function getBootParams() {
   return {
     pageKey:    p.get('pageKey') || '',
     site:       p.get('site') || '',
-    user:       <LocalUser>JSON.parse(p.get('user') || '{}'),
+    user:       <ArtalkType.LocalUser>JSON.parse(p.get('user') || '{}'),
     view:       p.get('view') || '',
     viewParams: <any>null,
     darkMode:   p.get('darkMode') === '1',

ui/packages/artalk-sidebar/src/pages/pages.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
 import { storeToRefs } from 'pinia'
 import { artalk } from '../global'
-import type { PageData } from 'artalk/types/artalk-data'
+import type { ArtalkType } from 'artalk'
 import { useNavStore } from '../stores/nav'
 import { useUserStore } from '../stores/user'
 import Pagination from '../components/Pagination.vue'
 
 const nav = useNavStore()
 const { site: curtSite } = storeToRefs(useUserStore())
-const pages = ref<PageData[]>([])
+const pages = ref<ArtalkType.PageData[]>([])
 const curtEditPageID = ref<number|null>(null)
 const { t } = useI18n()
 
@@ -53,7 +53,7 @@ function scrollHandler() {
   showActBarBorder.value = (nav.scrollableArea!.scrollTop > 10)
 }
 
-function editPage(page: PageData) {
+function editPage(page: ArtalkType.PageData) {
   curtEditPageID.value = page.id
 }
 
@@ -73,7 +73,7 @@ function onChangePage(offset: number) {
   reqPages(offset)
 }
 
-function onPageItemUpdate(page: PageData) {
+function onPageItemUpdate(page: ArtalkType.PageData) {
   const index = pages.value.findIndex(p => p.id === page.id)
   if (index != -1) {
     const orgPage = pages.value[index]

ui/packages/artalk-sidebar/src/pages/sites.vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
 import { useNavStore } from '../stores/nav'
 import { artalk, bootParams } from '../global'
-import type { SiteData } from 'artalk/types/artalk-data'
+import type { ArtalkType } from 'artalk'
 
 const nav = useNavStore()
-const sites = ref<SiteData[]>([])
-const curtEditSite = ref<SiteData|null>(null)
+const sites = ref<ArtalkType.SiteData[]>([])
+const curtEditSite = ref<ArtalkType.SiteData|null>(null)
 const showSiteCreate = ref(false)
 const siteCreateInitVal = ref()
 const { t } = useI18n()
@@ -42,7 +42,7 @@ function create() {
 const sitesGrouped = computed(() => {
   if (sites.value.length === 0) return []
 
-  const grp: SiteData[][] = []
+  const grp: ArtalkType.SiteData[][] = []
   let j = -1
   for (let i = 0; i < sites.value.length; i++) {
     const item = sites.value[i]
@@ -55,18 +55,18 @@ const sitesGrouped = computed(() => {
   return grp
 })
 
-function edit(site: SiteData) {
+function edit(site: ArtalkType.SiteData) {
   showSiteCreate.value = false
   curtEditSite.value = site
 }
 
-function onNewSiteCreated(siteNew: SiteData) {
+function onNewSiteCreated(siteNew: ArtalkType.SiteData) {
   sites.value.push(siteNew)
   showSiteCreate.value = false
   nav.refreshSites()
 }
 
-function onSiteItemUpdate(site: SiteData) {
+function onSiteItemUpdate(site: ArtalkType.SiteData) {
   const index = sites.value.findIndex(s => s.id === site.id)
   if (index != -1) {
     const orgSite = sites.value[index]

ui/packages/artalk-sidebar/src/pages/transfer.vue

@@ -2,7 +2,6 @@
 import { useNavStore } from '../stores/nav'
 import { useUserStore } from '../stores/user'
 import { artalk } from '../global'
-import type { SiteData } from 'artalk/types/artalk-data'
 import { storeToRefs } from 'pinia';
 
 const nav = useNavStore()

ui/packages/artalk-sidebar/src/pages/users.vue

@@ -2,13 +2,13 @@
 import { useNavStore } from '../stores/nav'
 import { artalk, bootParams } from '../global'
 import Pagination from '../components/Pagination.vue'
-import type { UserDataForAdmin } from 'artalk/types/artalk-data'
+import type { ArtalkType } from 'artalk'
 import { storeToRefs } from 'pinia'
 
 const nav = useNavStore()
 const router = useRouter()
 const { curtTab } = storeToRefs(nav)
-const users = ref<UserDataForAdmin[]>([])
+const users = ref<ArtalkType.UserDataForAdmin[]>([])
 const { t } = useI18n()
 
 const pageSize = ref(30)
@@ -17,7 +17,7 @@ const pagination = ref<InstanceType<typeof Pagination>>()
 const curtType = ref('all')
 
 const addingUser = ref(false)
-const editingUser = ref<UserDataForAdmin|undefined>()
+const editingUser = ref<ArtalkType.UserDataForAdmin|undefined>()
 
 onMounted(() => {
   nav.updateTabs({
@@ -65,7 +65,7 @@ function onChangePage(offset: number) {
   reqUsers(offset)
 }
 
-function editUser(user: UserDataForAdmin) {
+function editUser(user: ArtalkType.UserDataForAdmin) {
   if (user.is_in_conf) {
     alert('暂不支持在线编辑配置文件中的用户，请手动修改配置文件')
     return
@@ -75,7 +75,7 @@ function editUser(user: UserDataForAdmin) {
   editingUser.value = user
 }
 
-function updateUser(user: UserDataForAdmin) {
+function updateUser(user: ArtalkType.UserDataForAdmin) {
   const index = users.value.findIndex(u => u.id === user.id)
   if (index != -1) {
     // 修改用户
@@ -97,7 +97,7 @@ function closeEditUser() {
   editingUser.value = undefined
 }
 
-function delUser(user: UserDataForAdmin) {
+function delUser(user: ArtalkType.UserDataForAdmin) {
   if (window.confirm(`该操作将删除 用户："${user.name}" 邮箱："${user.email}" 所有评论，包括其评论下面他人的回复评论，是否继续？`)) {
     artalk!.ctx.getApi().user.userDel(user.id)
       .then(() => {

ui/packages/artalk-sidebar/src/stores/nav.ts

@@ -1,6 +1,6 @@
 import { defineStore } from 'pinia'
 import { artalk } from '../global'
-import type { SiteData } from 'artalk/types/artalk-data'
+import type { ArtalkType } from 'artalk'
 
 type TabsObj = {[name: string]: string}
 
@@ -9,7 +9,7 @@ export const useNavStore = defineStore('nav', () => {
   const tabs = ref<TabsObj>({})
 
   const curtPage = ref('comments')
-  const sites = ref<SiteData[]>([])
+  const sites = ref<ArtalkType.SiteData[]>([])
   const siteSwitcherShow = ref(false)
 
   const isSearchEnabled = ref(false)

ui/packages/artalk/package.json

@@ -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",
   "scripts": {
     "dev": "vite",
     "build": "vite build && pnpm build:lite && pnpm build:i18n",

ui/packages/artalk/src/api/api-base.ts

@@ -1,12 +1,12 @@
-import Context from '~/types/context'
+import type { ContextApi } from '~/types'
 import Api from '.'
 import { POST, Fetch } from './request'
 
 abstract class ApiBase {
   protected api: Api
-  protected ctx: Context
+  protected ctx: ContextApi
 
-  constructor(api: Api, ctx: Context) {
+  constructor(api: Api, ctx: ContextApi) {
     this.api = api
     this.ctx = ctx
   }

ui/packages/artalk/src/api/comment.ts

@@ -1,4 +1,4 @@
-import { CommentData, ListData } from '~/types/artalk-data'
+import type { CommentData, ListData } from '~/types'
 import * as Utils from '../lib/utils'
 import ApiBase from './api-base'
 import User from '../lib/user'

ui/packages/artalk/src/api/index.ts

@@ -1,4 +1,4 @@
-import Context from '~/types/context'
+import type { ContextApi } from '~/types'
 import 'abortcontroller-polyfill/dist/polyfill-patch-fetch'
 
 import comment from './comment'
@@ -17,12 +17,12 @@ const ApiComponents = {
 }
 
 class Api {
-  protected ctx: Context
+  protected ctx: ContextApi
   public get baseURL() {
     return `${this.ctx.conf.server}/api`
   }
 
-  constructor (ctx: Context) {
+  constructor (ctx: ContextApi) {
     this.ctx = ctx
 
     Object.entries(ApiComponents).forEach(([key, ApiComponent]) => {

ui/packages/artalk/src/api/page.ts

@@ -1,4 +1,4 @@
-import { PageData, CommentData } from '~/types/artalk-data'
+import type { PageData, CommentData } from '~/types'
 import ApiBase from './api-base'
 
 /**

ui/packages/artalk/src/api/request.ts

@@ -1,9 +1,9 @@
-import Context from '~/types/context'
+import type { ContextApi } from '~/types'
 import User from '../lib/user'
 import $t from '../i18n'
 
 /** 公共请求函数 */
-export async function Fetch(ctx: Context, input: RequestInfo, init: RequestInit, timeout?: number): Promise<any> {
+export async function Fetch(ctx: ContextApi, input: RequestInfo, init: RequestInit, timeout?: number): Promise<any> {
   // JWT
   if (User.data.token) {
     const headers = new Headers(init.headers) // 保留原有 headers
@@ -61,7 +61,7 @@ export async function Fetch(ctx: Context, input: RequestInfo, init: RequestInit,
 }
 
 /** 公共 POST 请求 */
-export async function POST<T>(ctx: Context, url: string, data?: {[key: string]: any}) {
+export async function POST<T>(ctx: ContextApi, url: string, data?: {[key: string]: any}) {
   const init: RequestInit = {
     method: 'POST',
   }
@@ -88,7 +88,7 @@ export function ToFormData(object: {[key: string]: any}): FormData {
 }
 
 /** 我靠，fetch 一个 timeout，都要丑陋的实现 */
-function timeoutFetch(ctx: Context, url: RequestInfo, ms: number, opts: RequestInit) {
+function timeoutFetch(ctx: ContextApi, url: RequestInfo, ms: number, opts: RequestInit) {
   const controller = new AbortController()
   opts.signal?.addEventListener('abort', () => controller.abort()) // 保留原有 signal 功能
   let promise = fetch(url, { ...opts, signal: controller.signal })