chore(dependencies): add nuxt-lucide-icons@2.1.0 to pnpm-lock.yaml and import Button component in BaseCard.vue for enhanced UI functionality

.gitea/workflows/lint.yaml

@@ -13,10 +13,11 @@ jobs:
                   node-version: '24'
             - uses: pnpm/action-setup@v4
               with:
-                cache: true
+                  version: latest
+                  cache: true
             - name: Install dependencies
               run: |
-                pnpm install --frozen-lockfile
+                  pnpm install --frozen-lockfile
             - name: Run frontend lint
               run: pnpm lint:front
 

front/components/About/AboutBaseInfo.vue

@@ -8,6 +8,9 @@ import Progress from '~/components/ui/progress/Progress.vue'
 import renderI18n from '~/lib/renderI18n'
 import { I18nT } from 'vue-i18n'
 import { calcNativeHash } from '~/lib/calcFileHash'
+import { Avatar, AvatarImage, AvatarFallback } from '@/components/ui/avatar'
+import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from '@/components/ui/accordion'
+import MarkdownRender from '@/components/MarkdownRender.vue'
 
 const { locale } = useI18n()
 const appConfig = useMyAppConfig()

front/components/BaseCard.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { Button } from '@/components/ui/button'
 const props = defineProps<{
     title?: string
     showBackButton?: boolean

front/components/CopyButton.vue

@@ -2,7 +2,7 @@
 import { Button } from '@/components/ui/button'
 import asyncWait from '~/lib/asyncWait'
 import { toast } from 'vue-sonner'
-import { LucideCheck, LucideCopy } from 'lucide-vue-next'
+import { LucideCheck, LucideCopy } from '@lucide/vue'
 
 const isCopy = ref(false)
 const props = defineProps<{

front/components/Field/FileUploadField.vue

@@ -3,7 +3,7 @@ import FileUpload from '@/components/FileUpload.vue'
 import { cx } from 'class-variance-authority'
 import type { RuleExpression } from 'vee-validate'
 import Button from '../ui/button/Button.vue'
-import { PlusIcon } from 'lucide-vue-next'
+import { PlusIcon } from '@lucide/vue'
 import { isEmpty } from 'lodash-es'
 
 const props = defineProps<{

front/components/FileIcon/File.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { LucideFileAudio, LucideFileVideo, LucideFile, LucideFileCode, LucideFileArchive, LucideFileText } from 'lucide-vue-next'
+import { LucideFileAudio, LucideFileVideo, LucideFile, LucideFileCode, LucideFileArchive, LucideFileText } from '@lucide/vue'
 import type { filePreview } from './Index.vue'
 
 const props = defineProps<{

front/components/Home/File/FileUploadProgressView/index.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { LucideSquare, LucideInfo, LucideFolders, LucideArrowUpFromLine, LucideCircleX, LucideCheckCircle, LucideLoaderCircle } from 'lucide-vue-next'
+import { LucideSquare, LucideInfo, LucideFolders, LucideArrowUpFromLine, LucideCircleX, LucideCheckCircle, LucideLoaderCircle } from '@lucide/vue'
 import Button from '@/components/ui/button/Button.vue'
 
 import getFileSize from '~/lib/getFileSize'

front/components/Navbar.vue

@@ -22,9 +22,8 @@
 
 <script setup lang="ts">
 import { cx } from 'class-variance-authority'
-import { LucideClipboardType, LucidePaperclip } from '#components'
 import { motion } from 'motion-v'
-import { LucideGlobe } from 'lucide-vue-next'
+import { LucideGlobe, LucideClipboardType, LucidePaperclip } from '@lucide/vue'
 import showDrawer from '@/lib/showDrawer'
 import I18nSwitchDrawer from './Drawer/I18nSwitchDrawer.vue'
 const { t } = useI18n()

front/components/Share/FileShareView.vue

@@ -4,7 +4,7 @@ import dayjs from 'dayjs'
 import duration from 'dayjs/plugin/duration'
 import relativeTime from 'dayjs/plugin/relativeTime'
 import { isBoolean } from 'lodash-es'
-import { LucideCheck, LucideX } from 'lucide-vue-next'
+import { LucideCheck, LucideX } from '@lucide/vue'
 import { useQueryClient } from '@tanstack/vue-query'
 import showDrawer from '~/lib/showDrawer'
 import { toast } from 'vue-sonner'

front/components/Share/TextShareView.vue

@@ -4,7 +4,7 @@ import AsyncButton from '@/components/ui/button/AsyncButton.vue'
 import duration from 'dayjs/plugin/duration'
 import relativeTime from 'dayjs/plugin/relativeTime'
 import { isBoolean } from 'lodash-es'
-import { LucideCheck, LucideX } from 'lucide-vue-next'
+import { LucideCheck, LucideX } from '@lucide/vue'
 import { cx } from 'class-variance-authority'
 import { toast } from 'vue-sonner'
 import MarkdownRender from '@/components/MarkdownRender.vue'

front/components/ui/accordion/AccordionTrigger.vue

@@ -2,7 +2,7 @@
 import type { AccordionTriggerProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { ChevronDown } from 'lucide-vue-next'
+import { ChevronDown } from '@lucide/vue'
 import { AccordionHeader, AccordionTrigger } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/components/ui/command/CommandInput.vue

@@ -2,7 +2,7 @@
 import type { ListboxFilterProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { Search } from 'lucide-vue-next'
+import { Search } from '@lucide/vue'
 import { ListboxFilter, useForwardProps } from 'reka-ui'
 import { cn } from '@/lib/utils'
 import { useCommand } from '.'

front/components/ui/dialog/DialogContent.vue

@@ -2,7 +2,7 @@
 import type { DialogContentEmits, DialogContentProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { X } from 'lucide-vue-next'
+import { X } from '@lucide/vue'
 import { DialogClose, DialogContent, DialogPortal, useForwardPropsEmits } from 'reka-ui'
 import { cn } from '@/lib/utils'
 import DialogOverlay from './DialogOverlay.vue'

front/components/ui/dialog/DialogScrollContent.vue

@@ -2,7 +2,7 @@
 import type { DialogContentEmits, DialogContentProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { X } from 'lucide-vue-next'
+import { X } from '@lucide/vue'
 import { DialogClose, DialogContent, DialogOverlay, DialogPortal, useForwardPropsEmits } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/components/ui/dropdown-menu/DropdownMenuCheckboxItem.vue

@@ -2,7 +2,7 @@
 import type { DropdownMenuCheckboxItemEmits, DropdownMenuCheckboxItemProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { Check } from 'lucide-vue-next'
+import { Check } from '@lucide/vue'
 import { DropdownMenuCheckboxItem, DropdownMenuItemIndicator, useForwardPropsEmits } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/components/ui/dropdown-menu/DropdownMenuRadioItem.vue

@@ -2,7 +2,7 @@
 import type { DropdownMenuRadioItemEmits, DropdownMenuRadioItemProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { Circle } from 'lucide-vue-next'
+import { Circle } from '@lucide/vue'
 import { DropdownMenuItemIndicator, DropdownMenuRadioItem, useForwardPropsEmits } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/components/ui/dropdown-menu/DropdownMenuSubTrigger.vue

@@ -2,7 +2,7 @@
 import type { DropdownMenuSubTriggerProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { ChevronRight } from 'lucide-vue-next'
+import { ChevronRight } from '@lucide/vue'
 import { DropdownMenuSubTrigger, useForwardProps } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/components/ui/menubar/MenubarCheckboxItem.vue

@@ -2,7 +2,7 @@
 import type { MenubarCheckboxItemEmits, MenubarCheckboxItemProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { Check } from 'lucide-vue-next'
+import { Check } from '@lucide/vue'
 import { MenubarCheckboxItem, MenubarItemIndicator, useForwardPropsEmits } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/components/ui/menubar/MenubarRadioItem.vue

@@ -2,7 +2,7 @@
 import type { MenubarRadioItemEmits, MenubarRadioItemProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { Circle } from 'lucide-vue-next'
+import { Circle } from '@lucide/vue'
 import { MenubarItemIndicator, MenubarRadioItem, useForwardPropsEmits } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/components/ui/menubar/MenubarSubTrigger.vue

@@ -2,7 +2,7 @@
 import type { MenubarSubTriggerProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { ChevronRight } from 'lucide-vue-next'
+import { ChevronRight } from '@lucide/vue'
 import { MenubarSubTrigger, useForwardProps } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/components/ui/pin-input/PinInputSeparator.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Minus } from 'lucide-vue-next'
+import { Minus } from '@lucide/vue'
 import { Primitive, type PrimitiveProps, useForwardProps } from 'reka-ui'
 
 const props = defineProps<PrimitiveProps>()
@@ -7,12 +7,9 @@ const forwardedProps = useForwardProps(props)
 </script>
 
 <template>
-  <Primitive
-    data-slot="pin-input-separator"
-    v-bind="forwardedProps"
-  >
-    <slot>
-      <Minus />
-    </slot>
-  </Primitive>
+    <Primitive data-slot="pin-input-separator" v-bind="forwardedProps">
+        <slot>
+            <Minus />
+        </slot>
+    </Primitive>
 </template>

front/components/ui/select/SelectItem.vue

@@ -2,7 +2,7 @@
 import type { SelectItemProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { Check } from 'lucide-vue-next'
+import { Check } from '@lucide/vue'
 import { SelectItem, SelectItemIndicator, SelectItemText, useForwardProps } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/components/ui/select/SelectScrollDownButton.vue

@@ -2,7 +2,7 @@
 import type { SelectScrollDownButtonProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { ChevronDown } from 'lucide-vue-next'
+import { ChevronDown } from '@lucide/vue'
 import { SelectScrollDownButton, useForwardProps } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/components/ui/select/SelectScrollUpButton.vue

@@ -2,7 +2,7 @@
 import type { SelectScrollUpButtonProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { ChevronUp } from 'lucide-vue-next'
+import { ChevronUp } from '@lucide/vue'
 import { SelectScrollUpButton, useForwardProps } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/components/ui/select/SelectTrigger.vue

@@ -2,7 +2,7 @@
 import type { SelectTriggerProps } from 'reka-ui'
 import type { HTMLAttributes } from 'vue'
 import { reactiveOmit } from '@vueuse/core'
-import { ChevronDown } from 'lucide-vue-next'
+import { ChevronDown } from '@lucide/vue'
 import { SelectIcon, SelectTrigger, useForwardProps } from 'reka-ui'
 import { cn } from '@/lib/utils'
 

front/composables/useFeatureMeta.ts

@@ -1,4 +1,4 @@
-import { LucideShare, LucideImageMinus, LucideArrowRightLeft, LucideLanguages } from 'lucide-vue-next'
+import { LucideShare, LucideImageMinus, LucideArrowRightLeft, LucideLanguages } from '@lucide/vue'
 import useMyAppConfig from '@/composables/useMyAppConfig'
 import type { FileHandleKey, TextHandleKey } from '../components/Preprocessing/types'
 import generateRandomColors from '@/lib/generateRandomColors'

front/layouts/default.vue

@@ -11,9 +11,9 @@ const enableBg = computed(() => appConfig.value?.site_enable_bg ?? true)
         <GlobalDrawer />
         <GlobalDayjs />
         <Toaster position="top-center" richColors closeButton />
-        <div class="w-full h-full absolute inset-0 z-[-1] bg-linear-to-bl from-primary/40 to-primary">
-            <img v-if="enableBg" class="w-full h-full object-cover" :src="bgUrl" />
-        </div>
+        <p class="absolute inset-0 z-[-1] bg-linear-to-bl from-primary/40 to-primary">
+            <img v-if="enableBg" class="w-full h-full block object-cover" :src="bgUrl" />
+        </p>
         <div class="h-full w-full flex flex-col items-center lg:p-10 p-5 overflow-y-auto">
             <Navbar />
             <slot />

front/nuxt.config.ts

@@ -1,4 +1,5 @@
 import tailwindcss from '@tailwindcss/vite'
+import { defineNuxtConfig } from 'nuxt/config'
 import getApiBaseUrl from './lib/getApiBaseUrl'
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
@@ -9,13 +10,13 @@ export default defineNuxtConfig({
         // '@serwist/nuxt',
         '@vueuse/nuxt',
         'motion-v/nuxt',
-        'nuxt-lucide-icons',
         'shadcn-nuxt',
         '@vee-validate/nuxt',
         '@pinia/nuxt',
         '@nuxt/image',
         '@nuxtjs/i18n',
         'vue3-pixi-nuxt',
+        'nuxt-lucide-icons',
     ],
     // serwist: {},
     i18n: {

front/package.json

@@ -10,12 +10,13 @@
         "postinstall": "nuxt prepare"
     },
     "dependencies": {
+        "@lucide/vue": "^1.16.0",
         "@nuxt/image": "^2.0.0",
         "@nuxtjs/i18n": "^10.4.0",
         "@pinia/nuxt": "^0.11.3",
         "@tailwindcss/postcss": "^4.3.0",
         "@tailwindcss/vite": "^4.3.0",
-        "@tanstack/vue-query": "^5.100.13",
+        "@tanstack/vue-query": "^5.100.12",
         "@tiptap/extension-blockquote": "^3.23.6",
         "@tiptap/extension-bold": "^3.23.6",
         "@tiptap/extension-bubble-menu": "^3.23.6",
@@ -37,21 +38,19 @@
         "clsx": "^2.1.1",
         "dayjs": "^1.11.20",
         "file-type": "^22.0.1",
-        "filesize": "^10.1.6",
+        "filesize": "^11.0.17",
         "hash-wasm": "^4.12.0",
         "heic-to": "^1.4.3",
         "lodash-es": "^4.18.1",
-        "lucide-vue-next": "^0.542.0",
         "markdown-it": "^14.1.1",
-        "motion-v": "^1.10.3",
+        "motion-v": "^2.2.1",
         "nanoid": "^5.1.11",
-        "nuxt": "4.4.2",
-        "nuxt-lucide-icons": "1.0.5",
+        "nuxt": "4.4.6",
+        "nuxt-lucide-icons": "2.1.0",
         "pinia": "^3.0.4",
         "pixi.js": "^8.18.1",
         "qrcode": "^1.5.4",
         "reka-ui": "^2.9.8",
-        "shadcn-nuxt": "2.0.1",
         "sweet-curl-parser": "^1.0.4",
         "tailwind-merge": "^3.6.0",
         "tailwindcss": "^4.3.0",
@@ -59,9 +58,8 @@
         "tw-animate-css": "^1.4.0",
         "vaul-vue": "^0.4.1",
         "vue": "^3.5.34",
-        "vue-router": "^4.6.4",
-        "vue-sonner": "^1.3.2",
-        "vue3-pixi": "1.0.0-beta.2"
+        "vue-sonner": "^2.0.9",
+        "vue3-pixi": "^1.0.1"
     },
     "resolutions": {
         "esbuild": "0.25.6"
@@ -71,10 +69,11 @@
         "@types/lodash-es": "^4.17.12",
         "@types/markdown-it": "^14.1.2",
         "@types/qrcode": "^1.5.6",
-        "@vueuse/core": "^13.9.0",
-        "@vueuse/nuxt": "^13.9.0",
-        "typescript": "^5.9.3",
+        "@vueuse/core": "^14.3.0",
+        "@vueuse/nuxt": "^14.3.0",
+        "shadcn-nuxt": "^2.7.3",
+        "typescript": "^6.0.3",
         "vitest": "^4.1.7",
-        "vue3-pixi-nuxt": "1.0.0-beta.2"
+        "vue3-pixi-nuxt": "^1.0.1"
     }
 }

front/pages/s/[id].vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { LucideAlertCircle } from 'lucide-vue-next'
+import { LucideAlertCircle } from '@lucide/vue'
 import { Button } from '@/components/ui/button'
 import { Skeleton } from '@/components/ui/skeleton'
 import dayjs from 'dayjs'

pnpm-workspace.yaml

@@ -1,11 +1,11 @@
 packages:
-  # all packages in direct subdirs of packages/
-  - 'front'
-  - 'pkg/*'
-  # - '*'
+    # all packages in direct subdirs of packages/
+    - 'front'
+    - 'pkg/*'
+    # - '*'
 allowBuilds:
-  '@parcel/watcher': true
-  esbuild: true
-  maplibre-gl: true
-  sharp: true
-  vue-demi: true
+    '@parcel/watcher': true
+    esbuild: true
+    maplibre-gl: true
+    sharp: true
+    vue-demi: true