chore: upgrade deps

package.json

@@ -5,7 +5,7 @@
   "private": true,
   "scripts": {
     "dev": "vite",
-    "build": "vue-tsc -b && vite build",
+    "build": "vue-tsc --noEmit && vite build",
     "preview": "vite preview",
     "lint": "eslint --fix",
     "tauri": "tauri"
@@ -34,7 +34,6 @@
     "@unocss/preset-mini": "^0.64.1",
     "@vitejs/plugin-vue": "^5.2.1",
     "eslint": "^9.15.0",
-    "typescript": "^5.7.2",
     "unocss": "^0.64.1",
     "vite": "^6.0.1",
     "vue-tsc": "^2.1.10"

src/components/Button.vue

@@ -1,8 +1,8 @@
 <script lang="ts" setup>
-import { ref } from 'vue'
+import { defineEmits, defineProps, ref } from 'vue'
 
 const props = defineProps<{
-  class?: string
+  className?: string
   anim?: boolean
   onClick?: () => void
 }>()
@@ -22,7 +22,7 @@ function onClick() {
 </script>
 
 <template>
-  <button :class="`${animate ? 'animate' : ''} ${props.class}`" type="button" @animationend="animate = false" @click="onClick">
+  <button :class="`${animate ? 'animate' : ''} ${props.className}`" type="button" @animationend="animate = false" @click="onClick">
     <slot />
   </button>
 </template>

src/components/Screenshot.vue

@@ -90,19 +90,19 @@ onMounted(async () => {
 <template>
   <div>
     <div>
-      <Button class="btn-solid" @click="capture_screen">
+      <Button class-name="btn-solid" @click="capture_screen">
         Capture Screen
       </Button>
-      <Button class="btn-solid" @click="capture_select">
+      <Button class-name="btn-solid" @click="capture_select">
         Capture Select
       </Button>
-      <Button class="btn-solid" @click="capture_window">
+      <Button class-name="btn-solid" @click="capture_window">
         Capture Window
       </Button>
-      <Button class="btn-solid" @click="take_capture_screen">
+      <Button class-name="btn-solid" @click="take_capture_screen">
         Take Capture Screen
       </Button>
-      <Button class="btn-solid" @click="take_capture_monitor">
+      <Button class-name="btn-solid" @click="take_capture_monitor">
         Take Capture Monitor
       </Button>
     </div>

src/components/SnapVault.vue

@@ -44,7 +44,7 @@ onMounted(async () => {
         </div>
       </div>
     </div>
-    <div class="flex flex-row flex-wrap gap-4">
+    <div class="grid grid-cols-3 gap-4">
       <SnapVaultItem v-for="item in list" :key="item.id" :item="item" @change="loadData" />
     </div>
   </div>

src/components/SnapVaultItem.vue

@@ -38,7 +38,7 @@ async function handleDelete(path: string) {
   <div ref="snapHoverableElement" class="relative rounded-md bg-card p-2">
     <PictureReview :image-path="item.image" />
     <div v-if="isHovered" class="absolute right-3 top-3 z-11 flex flex-row gap-2">
-      <Button class="btn-action-icon" anim @click="() => handleDelete(item.image)">
+      <Button class-name="btn-action-icon" anim @click="() => handleDelete(item.image)">
         <i class="h-4 w-4">
           <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32"><path d="M12 12h2v12h-2z" fill="currentColor" /><path d="M18 12h2v12h-2z" fill="currentColor" /><path d="M4 6v2h2v20a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8h2V6zm4 22V8h16v20z" fill="currentColor" /><path d="M12 2h8v2h-8z" fill="currentColor" /></svg>
         </i>

src/pages/preview/App.vue

@@ -9,7 +9,6 @@ import { useElementHover } from '@vueuse/core'
 import { onMounted, ref } from 'vue'
 import Button from '~/components/Button.vue'
 import PictureReview from '~/components/PictureReview.vue'
-import Editboard from './Editboard.vue'
 // Import Pintura styles
 import '@pqina/pintura/pintura.css'
 
@@ -63,25 +62,25 @@ onMounted(async () => {
 
 <template>
   <div ref="snapHoverableElement" :class="`preview ${!isEdit ? 'cursor-move' : ''}`" @mousedown="dragStart">
-    <Editboard v-if="isEdit" />
     <div v-if="isEdit && imagePath" style="height: 70vh">
       <PinturaEditor
         v-bind="getEditorDefaults()"
         :src="imageSrc"
+        :imageCropAspectRatio="1"
       />
     </div>
     <div v-if="!isEdit" class="h-100vh flex select-none items-center justify-center rounded-md text-12">
       <!-- img -->
       <PictureReview v-if="imagePath" :image-path="imagePath" />
     </div>
     <div v-if="isHovered && !isEdit" class="absolute bottom-0 left-0 right-0 top-0 flex items-center justify-around bg-#0000002F">
-      <Button class="btn-solid" :anim="true" @click="onEdit">
+      <Button class-name="btn-solid" :anim="true" @click="onEdit">
         Edit
       </Button>
-      <Button class="btn-solid" :anim="true" @click="onCopy">
+      <Button class-name="btn-solid" :anim="true" @click="onCopy">
         Copy
       </Button>
-      <Button class="btn-solid" :anim="true" @click="onSave">
+      <Button class-name="btn-solid" :anim="true" @click="onSave">
         Save
       </Button>
     </div>

src/pages/preview/Editboard.vue

@@ -16,16 +16,16 @@ function handleShare() {
 
 <template>
   <div class="flex gap-1">
-    <Button class="btn-solid" anim @click="handleRevert">
+    <Button class-name="btn-solid" anim @click="handleRevert">
       Revert
     </Button>
-    <Button class="btn-solid" anim @click="handleDelete">
+    <Button class-name="btn-solid" anim @click="handleDelete">
       Delete
     </Button>
-    <Button class="btn-solid" anim @click="handleDone">
+    <Button class-name="btn-solid" anim @click="handleDone">
       Done
     </Button>
-    <Button class="btn-solid" anim @click="handleShare">
+    <Button class-name="btn-solid" anim @click="handleShare">
       Share
     </Button>
   </div>

src/pages/startup/App.vue

@@ -34,7 +34,7 @@ onMounted(async () => {
       <div class="text-base text-secondary">
         请授予 Ddu 截屏功能权限
       </div>
-      <Button class="btn-solid" anim @click="openScreenCapturePreferences">
+      <Button class-name="btn-solid" anim @click="openScreenCapturePreferences">
         授权
       </Button>
     </div>

vite.config.ts

@@ -3,7 +3,6 @@ import vue from '@vitejs/plugin-vue'
 import UnoCSS from 'unocss/vite'
 import { defineConfig } from 'vite'
 
-// @ts-expect-error process is a nodejs global
 const host = process.env.TAURI_DEV_HOST
 
 // https://vitejs.dev/config/