@waline/client 2.15.5 → 2.15.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@waline/client",
-  "version": "2.15.5",
+  "version": "2.15.7",
   "description": "client for waline comment system",
   "keywords": [
     "valine",
@@ -16,7 +16,7 @@
   "author": {
     "name": "Mr.Hope",
     "email": "mister-hope@outlook.com",
-    "url": "https://mrhope.site"
+    "url": "https://mister-hope.com"
   },
   "exports": {
     ".": {
@@ -31,7 +31,8 @@
       "default": "./dist/api.mjs"
     },
     "./component": {
-      "default": "./dist/component.mjs"
+      "default": "./dist/component.mjs",
+      "types": "./dist/component.d.ts"
     },
     "./full": {
       "types": "./dist/waline.d.ts",
@@ -59,7 +60,8 @@
       "default": "./dist/api.mjs"
     },
     "./dist/component": {
-      "default": "./dist/component.mjs"
+      "default": "./dist/component.mjs",
+      "types": "./dist/component.d.ts"
     },
     "./dist/comment": {
       "types": "./dist/comment.d.ts",
@@ -122,21 +124,21 @@
     ]
   },
   "dependencies": {
-    "@vueuse/core": "^10.1.2",
+    "@vueuse/core": "^10.4.1",
     "autosize": "^6.0.1",
     "marked": "^4.3.0",
-    "vue": "^3.3.2"
+    "vue": "^3.3.4"
   },
   "devDependencies": {
-    "@babel/core": "7.21.8",
-    "@babel/preset-env": "7.21.5",
+    "@babel/core": "7.22.11",
+    "@babel/preset-env": "7.22.10",
     "@giphy/js-types": "4.4.0",
     "@types/autosize": "4.0.1",
-    "@types/marked": "4.3.0",
-    "@vitejs/plugin-vue": "4.2.3",
+    "@types/marked": "4.3.1",
+    "@vitejs/plugin-vue": "4.3.3",
     "recaptcha-v3": "1.10.0",
     "user-agent-data-types": "0.3.1",
-    "vite": "4.3.6"
+    "vite": "4.4.9"
   },
   "engines": {
     "node": ">=14"

package/src/api/articleCounter.ts

@@ -38,9 +38,9 @@ export const getArticleCounter = ({
 }: GetArticleCounterOptions): Promise<GetArticleCounterResponse> =>
   fetch(
     `${serverURL}/article?path=${encodeURIComponent(
-      paths.join(',')
+      paths.join(','),
     )}&type=${encodeURIComponent(type.join(','))}&lang=${lang}`,
-    { signal }
+    { signal },
   ).then((resp) => <Promise<GetArticleCounterResponse>>resp.json());
 
 export interface UpdateArticleCounterOptions extends BaseAPIOptions {

package/src/api/comment.ts

@@ -106,9 +106,9 @@ export const getComment = ({
 
   return fetch(
     `${serverURL}/comment?path=${encodeURIComponent(
-      path
+      path,
     )}&pageSize=${pageSize}&page=${page}&lang=${lang}&sortBy=${sortBy}`,
-    { signal, headers }
+    { signal, headers },
   )
     .then((resp) => <Promise<GetCommentResponse>>resp.json())
     .then((data) => errorCheck(data, 'Get comment data'));

package/src/api/commentCount.ts

@@ -24,9 +24,9 @@ export const fetchCommentCount = ({
 }: GetCommentCountOptions): Promise<number[]> =>
   fetch(
     `${serverURL}/comment?type=count&url=${encodeURIComponent(
-      paths.join(',')
+      paths.join(','),
     )}&lang=${lang}`,
-    { signal }
+    { signal },
   )
     .then((resp) => <Promise<number | number[]>>resp.json())
     // TODO: Improve this API

package/src/api/login.ts

@@ -72,7 +72,7 @@ export const login = ({
   const handler = window.open(
     `${serverURL}/ui/login?lng=${encodeURIComponent(lang)}`,
     '_blank',
-    `width=${width},height=${height},left=${left},top=${top},scrollbars=no,resizable=no,status=no,location=no,toolbar=no,menubar=no`
+    `width=${width},height=${height},left=${left},top=${top},scrollbars=no,resizable=no,status=no,location=no,toolbar=no,menubar=no`,
   );
 
   handler?.postMessage({ type: 'TOKEN', data: null }, '*');

package/src/api/pageview.ts

@@ -45,7 +45,7 @@ export interface UpdatePageviewOptions extends BaseAPIOptions {
 }
 
 export const updatePageview = (
-  options: UpdatePageviewOptions
+  options: UpdatePageviewOptions,
 ): Promise<number> =>
   updateArticleCounter({
     ...options,

package/src/api/utils.ts

@@ -37,7 +37,7 @@ export const JSON_HEADERS: Record<string, string> = {
 
 export const errorCheck = <T extends ErrorStatusResponse>(
   data: T,
-  name = ''
+  name = '',
 ): T => {
   if (typeof data === 'object' && data.errno)
     throw new TypeError(`${name} failed with ${data.errno}: ${data.errmsg}`);

package/src/comment.ts

@@ -53,7 +53,7 @@ export const commentCount = ({
     void fetchCommentCount({
       serverURL: getServerURL(serverURL),
       paths: Array.from(elements).map((element) =>
-        decodePath(element.dataset.path || element.getAttribute('id') || path)
+        decodePath(element.dataset.path || element.getAttribute('id') || path),
       ),
       lang,
       signal: controller.signal,

package/src/compact/convert.ts

@@ -4,12 +4,13 @@ import {
 } from './dropped.js';
 import { warning } from './logger.js';
 import { type DeprecatedWalineOptions } from './v1.js';
-import { resolveOldEmojiMap } from './valine.js';
-import { type DeprecatedValineOptions } from './valine.js';
+import { resolveOldEmojiMap, type DeprecatedValineOptions } from './valine.js';
 import { type WalineInitOptions } from '../typings/index.js';
 
 export const covertOptions = (
-  options: WalineInitOptions & DeprecatedValineOptions & DeprecatedWalineOptions
+  options: WalineInitOptions &
+    DeprecatedValineOptions &
+    DeprecatedWalineOptions,
 ): WalineInitOptions => {
   const {
     // Options which needs to be polyfilled
@@ -45,18 +46,18 @@ export const covertOptions = (
 
   // error with those which can no longer be handled
   DROPPED_OPTIONS_WHICH_CAN_NOT_BE_POLYFILLED.filter((item) =>
-    Object.keys(options).includes(item)
+    Object.keys(options).includes(item),
   ).forEach((item) =>
-    warning(`Option "${item}" is REMOVED and CAN NOT be polyfilled!`)
+    warning(`Option "${item}" is REMOVED and CAN NOT be polyfilled!`),
   );
 
   // warnings with those which is being polyfilled
   DROPPED_OPTIONS_WHICH_CAN_STILL_BE_POLYFILLED.filter(([oldOption]) =>
-    Object.keys(options).includes(oldOption)
+    Object.keys(options).includes(oldOption),
   ).forEach(([oldOption, newOption]) =>
     warning(
-      `Deprecated option "${oldOption}" is currently being polyfilled, Please switch to option "${newOption}" in v2!`
-    )
+      `Deprecated option "${oldOption}" is currently being polyfilled, Please switch to option "${newOption}" in v2!`,
+    ),
   );
 
   if (placeholder) locale.placeholder = placeholder;

package/src/compact/logger.ts

@@ -1,5 +1,5 @@
 export const warning = (content: string): void =>
   console.warn(
     `%c ${content}`,
-    'background:#ff0;color:red;font-size:36px;font-weight:bold;'
+    'background:#ff0;color:red;font-size:36px;font-weight:bold;',
   );

package/src/compact/v1.ts

@@ -1,7 +1,7 @@
 import {
   type WalineHighlighter,
   type WalineImageUploader,
-  type WalineTexRenderer,
+  type WalineTeXRenderer,
 } from '../typings/index.js';
 
 export interface DeprecatedWalineOptions {
@@ -80,11 +80,11 @@ export interface DeprecatedWalineOptions {
   /**
    * @deprecated Use `texRenderer` instead, dropped in V2
    *
-   * 自定义 Tex 处理方法，用于预览。
+   * 自定义 TeX 处理方法，用于预览。
    *
    * Custom math formula parse callback for preview.
    */
-  previewMath?: WalineTexRenderer | false;
+  previewMath?: WalineTeXRenderer | false;
 
   /**
    * @deprecated use `copyright` instead, dropped in V2

package/src/compact/valine.ts

@@ -112,7 +112,7 @@ export interface DeprecatedValineOptions {
 // TODO: remove
 export const resolveOldEmojiMap = (
   emojiMaps: DeprecatedEmojiMaps,
-  emojiCDN = ''
+  emojiCDN = '',
 ): WalineEmojiInfo[] => {
   const resolvedEmojiMaps: WalineEmojiMaps = {};
 

package/src/components/ArticleReaction.vue

@@ -32,8 +32,15 @@
 </template>
 
 <script setup lang="ts">
-import { type ComputedRef } from 'vue';
-import { computed, inject, onMounted, onUnmounted, ref, watch } from 'vue';
+import {
+  type ComputedRef,
+  computed,
+  inject,
+  onMounted,
+  onUnmounted,
+  ref,
+  watch,
+} from 'vue';
 
 import { LoadingIcon } from './Icons.js';
 import { getArticleCounter, updateArticleCounter } from '../api/index.js';
@@ -89,7 +96,7 @@ const fetchReaction = async (): Promise<void> => {
     if (Array.isArray(resp) || typeof resp === 'number') return;
 
     voteNumbers.value = reaction.map(
-      (_reaction, index) => resp[`reaction${index}`]
+      (_reaction, index) => resp[`reaction${index}`],
     );
   }
 };
@@ -115,7 +122,7 @@ const vote = async (index: number): Promise<void> => {
 
       voteNumbers.value[currentVoteItemIndex] = Math.max(
         voteNumbers.value[currentVoteItemIndex] - 1,
-        0
+        0,
       );
     }
 
@@ -145,7 +152,7 @@ onMounted(() => {
     () => {
       void fetchReaction();
     },
-    { immediate: true }
+    { immediate: true },
   );
 });
 onUnmounted(() => abort?.());

package/src/components/CommentBox.vue

@@ -361,7 +361,7 @@ const props = withDefaults(
     rootId: '',
     replyId: '',
     replyUser: '',
-  }
+  },
 );
 
 const emit = defineEmits<{
@@ -449,7 +449,7 @@ const uploadImage = (file: File): Promise<void> => {
     .then((url) => {
       editor.value = editor.value.replace(
         uploadText,
-        `\r\n![${file.name}](${url})`
+        `\r\n![${file.name}](${url})`,
       );
     })
     .catch((err: Error) => {
@@ -549,7 +549,7 @@ const submitComment = async (): Promise<void> => {
       locale.value.wordHint
         .replace('$0', (wordLimit as [number, number])[0].toString())
         .replace('$1', (wordLimit as [number, number])[1].toString())
-        .replace('$2', wordNumber.value.toString())
+        .replace('$2', wordNumber.value.toString()),
     );
 
   comment.comment = parseEmoji(comment.comment, emoji.value.map);
@@ -564,9 +564,8 @@ const submitComment = async (): Promise<void> => {
 
   try {
     if (recaptchaV3Key)
-      comment.recaptchaV3 = await useReCaptcha(recaptchaV3Key).execute(
-        'social'
-      );
+      comment.recaptchaV3 =
+        await useReCaptcha(recaptchaV3Key).execute('social');
 
     if (turnstileKey)
       comment.turnstile = await useTurnstile(turnstileKey).execute('social');
@@ -615,7 +614,7 @@ const onLogin = (event: Event): void => {
     userInfo.value = data;
     (data.remember ? localStorage : sessionStorage).setItem(
       'WALINE_USER',
-      JSON.stringify(data)
+      JSON.stringify(data),
     );
     emit('log');
   });
@@ -644,7 +643,7 @@ const onProfile = (event: Event): void => {
   const handler = window.open(
     `${serverURL}/ui/profile?${query.toString()}`,
     '_blank',
-    `width=${width},height=${height},left=${left},top=${top},scrollbars=no,resizable=no,status=no,location=no,toolbar=no,menubar=no`
+    `width=${width},height=${height},left=${left},top=${top},scrollbars=no,resizable=no,status=no,location=no,toolbar=no,menubar=no`,
   );
 
   handler?.postMessage({ type: 'TOKEN', data: userInfo.value.token }, '*');
@@ -724,7 +723,7 @@ watch(
       isWordNumberLegal.value = true;
     }
   },
-  { immediate: true }
+  { immediate: true },
 );
 
 const onMessageReceive = ({
@@ -783,7 +782,7 @@ onMounted(() => {
       if (value) autosize(editorRef.value!);
       else autosize.destroy(editorRef.value!);
     },
-    { immediate: true }
+    { immediate: true },
   );
 
   // watch emoji value change
@@ -793,7 +792,7 @@ onMounted(() => {
       getEmojis(emojiConfig).then((config) => {
         emoji.value = config;
       }),
-    { immediate: true }
+    { immediate: true },
   );
 });
 

package/src/components/CommentCard.vue

@@ -216,7 +216,7 @@ const props = withDefaults(
   {
     edit: null,
     reply: null,
-  }
+  },
 );
 
 defineEmits<{
@@ -227,7 +227,7 @@ defineEmits<{
   (event: 'like', comment: WalineComment): void;
   (
     event: 'status',
-    statusInfo: { status: WalineCommentStatus; comment: WalineComment }
+    statusInfo: { status: WalineCommentStatus; comment: WalineComment },
   ): void;
   (event: 'sticky', comment: WalineComment): void;
   (event: 'reply', comment: WalineComment | null): void;
@@ -251,21 +251,21 @@ const link = computed(() => {
 const like = computed(() => likes.value.includes(props.comment.objectId));
 
 const time = computed(() =>
-  getTimeAgo(props.comment.insertedAt, now.value, locale.value)
+  getTimeAgo(props.comment.insertedAt, now.value, locale.value),
 );
 
 const isAdmin = computed(() => userInfo.value.type === 'administrator');
 
 const isOwner = computed(
   () =>
-    props.comment.user_id && userInfo.value.objectId === props.comment.user_id
+    props.comment.user_id && userInfo.value.objectId === props.comment.user_id,
 );
 
 const isReplyingCurrent = computed(
-  () => props.comment.objectId === props.reply?.objectId
+  () => props.comment.objectId === props.reply?.objectId,
 );
 
 const isEditingCurrent = computed(
-  () => props.comment.objectId === props.edit?.objectId
+  () => props.comment.objectId === props.edit?.objectId,
 );
 </script>

package/src/components/Icons.ts

@@ -18,7 +18,7 @@ export const CloseIcon: FunctionalComponent<{ size: number }> = ({ size }) =>
         d: 'm640.683 587.52-75.947-75.861 75.904-75.862a37.29 37.29 0 0 0 0-52.778 37.205 37.205 0 0 0-52.779 0l-75.946 75.818-75.862-75.946a37.419 37.419 0 0 0-52.821 0 37.419 37.419 0 0 0 0 52.821l75.947 75.947-75.776 75.733a37.29 37.29 0 1 0 52.778 52.821l75.776-75.776 75.947 75.947a37.376 37.376 0 0 0 52.779-52.821z',
         fill: '#888',
       }),
-    ]
+    ],
   );
 
 export const DeleteIcon: FunctionalComponent = () =>
@@ -28,7 +28,7 @@ export const DeleteIcon: FunctionalComponent = () =>
     h('path', {
       d: 'm341.013 394.667 27.755 393.45h271.83l27.733-393.45h64.106l-28.01 397.952a64 64 0 0 1-63.83 59.498H368.768a64 64 0 0 1-63.83-59.52l-28.053-397.93h64.128zm139.307 19.818v298.667h-64V414.485h64zm117.013 0v298.667h-64V414.485h64zM181.333 288h640v64h-640v-64zm453.483-106.667v64h-256v-64h256z',
       fill: 'red',
-    })
+    }),
   );
 
 export const EmojiIcon: FunctionalComponent = () =>
@@ -38,7 +38,7 @@ export const EmojiIcon: FunctionalComponent = () =>
     h('path', {
       d: 'M563.2 463.3 677 540c1.7 1.2 3.7 1.8 5.8 1.8.7 0 1.4-.1 2-.2 2.7-.5 5.1-2.1 6.6-4.4l25.3-37.8c1.5-2.3 2.1-5.1 1.6-7.8s-2.1-5.1-4.4-6.6l-73.6-49.1 73.6-49.1c2.3-1.5 3.9-3.9 4.4-6.6.5-2.7 0-5.5-1.6-7.8l-25.3-37.8a10.1 10.1 0 0 0-6.6-4.4c-.7-.1-1.3-.2-2-.2-2.1 0-4.1.6-5.8 1.8l-113.8 76.6c-9.2 6.2-14.7 16.4-14.7 27.5.1 11 5.5 21.3 14.7 27.4zM387 348.8h-45.5c-5.7 0-10.4 4.7-10.4 10.4v153.3c0 5.7 4.7 10.4 10.4 10.4H387c5.7 0 10.4-4.7 10.4-10.4V359.2c0-5.7-4.7-10.4-10.4-10.4zm333.8 241.3-41-20a10.3 10.3 0 0 0-8.1-.5c-2.6.9-4.8 2.9-5.9 5.4-30.1 64.9-93.1 109.1-164.4 115.2-5.7.5-9.9 5.5-9.5 11.2l3.9 45.5c.5 5.3 5 9.5 10.3 9.5h.9c94.8-8 178.5-66.5 218.6-152.7 2.4-5 .3-11.2-4.8-13.6zm186-186.1c-11.9-42-30.5-81.4-55.2-117.1-24.1-34.9-53.5-65.6-87.5-91.2-33.9-25.6-71.5-45.5-111.6-59.2-41.2-14-84.1-21.1-127.8-21.1h-1.2c-75.4 0-148.8 21.4-212.5 61.7-63.7 40.3-114.3 97.6-146.5 165.8-32.2 68.1-44.3 143.6-35.1 218.4 9.3 74.8 39.4 145 87.3 203.3.1.2.3.3.4.5l36.2 38.4c1.1 1.2 2.5 2.1 3.9 2.6 73.3 66.7 168.2 103.5 267.5 103.5 73.3 0 145.2-20.3 207.7-58.7 37.3-22.9 70.3-51.5 98.1-85 27.1-32.7 48.7-69.5 64.2-109.1 15.5-39.7 24.4-81.3 26.6-123.8 2.4-43.6-2.5-87-14.5-129zm-60.5 181.1c-8.3 37-22.8 72-43 104-19.7 31.1-44.3 58.6-73.1 81.7-28.8 23.1-61 41-95.7 53.4-35.6 12.7-72.9 19.1-110.9 19.1-82.6 0-161.7-30.6-222.8-86.2l-34.1-35.8c-23.9-29.3-42.4-62.2-55.1-97.7-12.4-34.7-18.8-71-19.2-107.9-.4-36.9 5.4-73.3 17.1-108.2 12-35.8 30-69.2 53.4-99.1 31.7-40.4 71.1-72 117.2-94.1 44.5-21.3 94-32.6 143.4-32.6 49.3 0 97 10.8 141.8 32 34.3 16.3 65.3 38.1 92 64.8 26.1 26 47.5 56 63.6 89.2 16.2 33.2 26.6 68.5 31 105.1 4.6 37.5 2.7 75.3-5.6 112.3z',
       fill: 'currentColor',
-    })
+    }),
   );
 
 export const ImageIcon: FunctionalComponent = () =>
@@ -88,7 +88,7 @@ export const MarkdownIcon: FunctionalComponent = () =>
     h('path', {
       d: 'M14.85 3H1.15C.52 3 0 3.52 0 4.15v7.69C0 12.48.52 13 1.15 13h13.69c.64 0 1.15-.52 1.15-1.15v-7.7C16 3.52 15.48 3 14.85 3zM9 11H7V8L5.5 9.92 4 8v3H2V5h2l1.5 2L7 5h2v6zm2.99.5L9.5 8H11V5h2v3h1.5l-2.51 3.5z',
       fill: 'currentColor',
-    })
+    }),
   );
 
 export const ReplyIcon: FunctionalComponent = () =>
@@ -98,7 +98,7 @@ export const ReplyIcon: FunctionalComponent = () =>
     h('path', {
       d: 'M810.667 213.333a64 64 0 0 1 64 64V704a64 64 0 0 1-64 64H478.336l-146.645 96.107a21.333 21.333 0 0 1-33.024-17.856V768h-85.334a64 64 0 0 1-64-64V277.333a64 64 0 0 1 64-64h597.334zm0 64H213.333V704h149.334v63.296L459.243 704h351.424V277.333zm-271.36 213.334v64h-176.64v-64h176.64zm122.026-128v64H362.667v-64h298.666z',
       fill: 'currentColor',
-    })
+    }),
   );
 
 export const EditIcon: FunctionalComponent = () =>
@@ -108,7 +108,7 @@ export const EditIcon: FunctionalComponent = () =>
     h('path', {
       d: 'M813.039 318.772L480.53 651.278H360.718V531.463L693.227 198.961C697.904 194.284 704.027 192 710.157 192C716.302 192 722.436 194.284 727.114 198.961L813.039 284.88C817.72 289.561 820 295.684 820 301.825C820 307.95 817.72 314.093 813.039 318.772ZM710.172 261.888L420.624 551.431V591.376H460.561L750.109 301.825L710.172 261.888ZM490.517 291.845H240.906V771.09H720.156V521.479C720.156 504.947 733.559 491.529 750.109 491.529C766.653 491.529 780.063 504.947 780.063 521.479V791.059C780.063 813.118 762.18 831 740.125 831H220.937C198.882 831 181 813.118 181 791.059V271.872C181 249.817 198.882 231.935 220.937 231.935H490.517C507.06 231.935 520.47 245.352 520.47 261.888C520.47 278.424 507.06 291.845 490.517 291.845Z',
       fill: 'currentColor',
-    })
+    }),
   );
 
 export const VerifiedIcon: FunctionalComponent = () =>
@@ -123,7 +123,7 @@ export const VerifiedIcon: FunctionalComponent = () =>
     h('path', {
       d: 'm894.4 461.56-54.4-63.2c-10.4-12-18.8-34.4-18.8-50.4v-68c0-42.4-34.8-77.2-77.2-77.2h-68c-15.6 0-38.4-8.4-50.4-18.8l-63.2-54.4c-27.6-23.6-72.8-23.6-100.8 0l-62.8 54.8c-12 10-34.8 18.4-50.4 18.4h-69.2c-42.4 0-77.2 34.8-77.2 77.2v68.4c0 15.6-8.4 38-18.4 50l-54 63.6c-23.2 27.6-23.2 72.4 0 100l54 63.6c10 12 18.4 34.4 18.4 50v68.4c0 42.4 34.8 77.2 77.2 77.2h69.2c15.6 0 38.4 8.4 50.4 18.8l63.2 54.4c27.6 23.6 72.8 23.6 100.8 0l63.2-54.4c12-10.4 34.4-18.8 50.4-18.8h68c42.4 0 77.2-34.8 77.2-77.2v-68c0-15.6 8.4-38.4 18.8-50.4l54.4-63.2c23.2-27.6 23.2-73.2-.4-100.8zm-216-25.2-193.2 193.2a30 30 0 0 1-42.4 0l-96.8-96.8a30.16 30.16 0 0 1 0-42.4c11.6-11.6 30.8-11.6 42.4 0l75.6 75.6 172-172c11.6-11.6 30.8-11.6 42.4 0 11.6 11.6 11.6 30.8 0 42.4z',
       fill: '#27ae60',
-    })
+    }),
   );
 
 export const LoadingIcon: FunctionalComponent<{ size?: number }> = ({
@@ -156,8 +156,8 @@ export const LoadingIcon: FunctionalComponent<{ size?: number }> = ({
         dur: '1s',
         values: '0 50 50;360 50 50',
         keyTimes: '0;1',
-      })
-    )
+      }),
+    ),
   );
 
 export const GifIcon: FunctionalComponent = () =>
@@ -177,5 +177,5 @@ export const GifIcon: FunctionalComponent = () =>
       h('path', {
         d: 'M18.5 3H5.75C3.6875 3 2 4.6875 2 6.75V18C2 20.0625 3.6875 21.75 5.75 21.75H18.5C20.5625 21.75 22.25 20.0625 22.25 18V6.75C22.25 4.6875 20.5625 3 18.5 3ZM20.75 18C20.75 19.2375 19.7375 20.25 18.5 20.25H5.75C4.5125 20.25 3.5 19.2375 3.5 18V6.75C3.5 5.5125 4.5125 4.5 5.75 4.5H18.5C19.7375 4.5 20.75 5.5125 20.75 6.75V18Z',
       }),
-    ]
+    ],
   );

package/src/components/ImageWall.vue

@@ -82,7 +82,7 @@ const props = withDefaults(
     items: () => [] as WalineSearchResult,
     columnWidth: 300,
     gap: 0,
-  }
+  },
 );
 
 defineEmits<{
@@ -99,7 +99,7 @@ const columns = ref<Column[]>([]);
 const getColumnCount = (): number => {
   const count = Math.floor(
     (wall.value!.getBoundingClientRect().width + props.gap) /
-      (props.columnWidth + props.gap)
+      (props.columnWidth + props.gap),
   );
 
   return count > 0 ? count : 1;
@@ -118,7 +118,7 @@ const fillColumns = async (itemIndex: number): Promise<void> => {
   const target = columnDivs.reduce((prev, curr) =>
     curr.getBoundingClientRect().height < prev.getBoundingClientRect().height
       ? curr
-      : prev
+      : prev,
   );
 
   columns.value[Number(target.dataset.index)].push(itemIndex);
@@ -155,13 +155,13 @@ onMounted(() => {
     () => {
       state.value = {};
       void redraw(true);
-    }
+    },
   );
   watch(
     () => [props.columnWidth, props.gap],
     () => {
       void redraw();
-    }
+    },
   );
 });
 

package/src/components/WalineComment.vue

@@ -14,7 +14,7 @@
         <li
           v-for="item in sortingMethods"
           :key="item"
-          :class="[item === commentSorting ? 'active' : '']"
+          :class="[item === commentSortingRef ? 'active' : '']"
           @click="onSortByChange(item)"
         >
           {{ i18n[item] }}
@@ -150,7 +150,7 @@ const totalPages = ref(0);
 const config = computed(() => getConfig(props as WalineProps));
 
 // eslint-disable-next-line vue/no-ref-object-destructure
-const commentSorting = ref(config.value.commentSorting);
+const commentSortingRef = ref(config.value.commentSorting);
 
 const data = ref<WalineComment[]>([]);
 const reply = ref<WalineComment | null>(null);
@@ -177,7 +177,7 @@ const getCommentData = (pageNumber: number): void => {
     lang: config.value.lang,
     path,
     pageSize,
-    sortBy: sortKeyMap[commentSorting.value],
+    sortBy: sortKeyMap[commentSortingRef.value],
     page: pageNumber,
     signal: controller.signal,
     token: userInfo.value?.token,
@@ -208,8 +208,8 @@ const refresh = (): void => {
 };
 
 const onSortByChange = (item: WalineCommentSorting): void => {
-  if (commentSorting.value !== item) {
-    commentSorting.value = item;
+  if (commentSortingRef.value !== item) {
+    commentSortingRef.value = item;
     refresh();
   }
 };
@@ -228,7 +228,7 @@ const onSubmit = (comment: WalineComment): void => {
     edit.value.orig = comment.orig;
   } else if (comment.rid) {
     const repliedComment = data.value.find(
-      ({ objectId }) => objectId === comment.rid
+      ({ objectId }) => objectId === comment.rid,
     );
 
     if (!repliedComment) return;
@@ -303,7 +303,7 @@ const onDelete = async ({ objectId }: WalineComment): Promise<void> => {
     return item.children.some((child, childIndex) => {
       if (child.objectId === objectId) {
         data.value[index].children = item.children.filter(
-          (_item, i) => i !== childIndex
+          (_item, i) => i !== childIndex,
         );
 
         return true;
@@ -346,7 +346,7 @@ onMounted(() => {
     // eslint-disable-next-line @typescript-eslint/no-unsafe-return
     () => [props.serverURL, props.path],
     () => refresh(),
-    { immediate: true }
+    { immediate: true },
   );
 });
 onUnmounted(() => abort?.());

package/src/composables/turnstile.ts

@@ -8,6 +8,7 @@ interface TurnstileOptions {
 }
 interface TurnstileInstance {
   ready: (fn: () => void) => void;
+  excute: (className: string, options?: TurnstileOptions) => void;
   render: (className: string, options?: TurnstileOptions) => void;
 }
 
@@ -22,31 +23,28 @@ interface Turnstile {
 }
 
 export const useTurnstile = (key: string): Turnstile => {
-  const execute = (action: string): Promise<string> =>
-    new Promise((resolve) => {
-      useScriptTag(
-        'https://challenges.cloudflare.com/turnstile/v0/api.js',
-        () => {
-          const turnstile = window?.turnstile;
-
-          const options: TurnstileOptions = {
-            sitekey: key,
-            action,
-            size: 'compact',
-            callback(token: string): void {
-              resolve(token);
-            },
-          };
-
-          turnstile?.ready(() =>
-            turnstile?.render('.wl-captcha-container', options)
-          );
-        },
-        {
-          async: false,
-        }
-      );
+  const execute = async (action: string): Promise<string> => {
+    const { load } = useScriptTag(
+      'https://challenges.cloudflare.com/turnstile/v0/api.js',
+      undefined,
+      { async: false },
+    );
+
+    await load();
+
+    const turnstile = window?.turnstile;
+
+    return new Promise((resolve) => {
+      turnstile?.ready(() => {
+        turnstile?.render('.wl-captcha-container', {
+          sitekey: key,
+          action,
+          size: 'compact',
+          callback: resolve,
+        });
+      });
     });
+  };
 
   return { execute };
 };

package/src/composables/userInfo.ts

@@ -12,5 +12,5 @@ let userInfoStorage: UserInfoRef | null = null;
 export const useUserInfo = (): UserInfoRef =>
   (userInfoStorage ??= useStorage<UserInfo | Record<string, never>>(
     USER_KEY,
-    {}
+    {},
   ));