feat(config): Add autofix workflow and update CI/release

.github/workflows/autofix.yml

@@ -0,0 +1,36 @@
+name: autofix.ci
+
+on:
+  pull_request:
+  push:
+    branches:
+      - main
+      - develop
+
+jobs:
+  autofix:
+    runs-on: ubuntu-latest
+
+    permissions:
+      contents: write
+
+    steps:
+      - uses: actions/checkout@v7
+
+      - uses: pnpm/action-setup@v6
+        with:
+          version: 10.34.5
+
+      - uses: actions/setup-node@v7
+        with:
+          node-version: 22.23.1
+          cache: pnpm
+
+      - run: node -v
+      - run: pnpm -v
+
+      - run: pnpm install
+
+      - run: pnpm lint
+
+      - uses: autofix-ci/action@v1.3.4

.github/workflows/ci.yml

@@ -16,16 +16,16 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v6
+      - uses: actions/checkout@v7
 
       - name: Setup pnpm
-        uses: pnpm/action-setup@v4
+        uses: pnpm/action-setup@v6
         with:
-          version: 10
+          version: 10.34.5
 
-      - uses: actions/setup-node@v6
+      - uses: actions/setup-node@v7
         with:
-          node-version: 20
+          node-version: 20.20.2
           cache: 'pnpm'
 
       - name: Install dependencies
@@ -38,10 +38,10 @@ jobs:
         run: cd playground && npx nuxi prepare
 
       - name: 🚀 Iniciar Nuxt no Playground
-        run: cd playground && pnpm dev &  # Roda em segundo plano
+        run: cd playground && pnpm dev & # Roda em segundo plano
 
       - name: ⏳ Aguardar o servidor estar pronto
-        run: sleep 10  # Ajuste o tempo conforme necessário
+        run: sleep 10 # Ajuste o tempo conforme necessário
 
       - name: Run Unit Tests
-        run: pnpm test
+        run: pnpm test

.github/workflows/release.yml

@@ -11,25 +11,25 @@ jobs:
 
     permissions:
       contents: write
-      id-token: write  # necessário para --provenance
+      id-token: write # necessário para --provenance
 
     steps:
       # 📥 Checkout repository
       - name: 📥 Checkout repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
       # 📦 Enable pnpm
-      - uses: pnpm/action-setup@v4
+      - uses: pnpm/action-setup@v6
         with:
-          version: 10
+          version: 10.34.5
 
       # 🟢 Setup Node.js
       - name: 🟢 Setup Node.js
-        uses: actions/setup-node@v5
+        uses: actions/setup-node@v7
         with:
-          node-version: 20
+          node-version: 20.20.2
           cache: 'pnpm'
           registry-url: 'https://registry.npmjs.org/' # Importante!
 
@@ -48,14 +48,14 @@ jobs:
           TAG_FULL="${GITHUB_REF_NAME#refs/tags/}"  # v1.3.0
           TAG_VERSION="${TAG_FULL#v}"               # 1.3.0
           PACKAGE_VERSION=$(node -p "require('./package.json').version")
-          
+
           echo "Tag version: $TAG_VERSION"
           echo "Package version: $PACKAGE_VERSION"
-          
+
           if [ "$TAG_VERSION" != "$PACKAGE_VERSION" ]; then
             echo "❌ Tag version does not match package.json version"
             exit 1
-          fi   
+          fi
 
       # ✅ Verify CHANGELOG exists
       - name: ✅ Verify CHANGELOG.md
@@ -71,7 +71,7 @@ jobs:
         run: |
           VERSION="${GITHUB_REF_NAME#refs/tags/}"
           VERSION_NUMBER="${VERSION#v}"
-          
+
           awk -v ver="$VERSION_NUMBER" '
             /^## / {
               heading = $0
@@ -84,12 +84,12 @@ jobs:
             }
             flag
           ' CHANGELOG.md > temp_changelog.md
-          
+
           if [ ! -s temp_changelog.md ]; then
             echo "❌ No changelog section found for version ${VERSION} in CHANGELOG.md"
             exit 1
           fi
-          
+
           echo "BODY<<EOF" >> $GITHUB_ENV
           cat temp_changelog.md >> $GITHUB_ENV
           echo "EOF" >> $GITHUB_ENV
@@ -102,12 +102,12 @@ jobs:
 
       # 🚀 Create GitHub Release
       - name: 🚀 Create GitHub Release
-        uses: softprops/action-gh-release@v2
+        uses: softprops/action-gh-release@v3
         with:
           tag_name: ${{ github.ref_name }}
           name: 🚀 Release ${{ github.ref_name }}
           body: ${{ env.BODY }}
           draft: false
           prerelease: false
         env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

package.json

@@ -44,7 +44,8 @@
   "dependencies": {
     "@nuxt/kit": "^4.4.8",
     "@nuxt/schema": "^4.4.8",
-    "nuxt": "^4.4.8"
+    "nuxt": "^4.4.8",
+    "vue-advanced-cropper": "^2.8.9"
   },
   "devDependencies": {
     "@nuxt/eslint-config": "^1.16.0",

playground/app/components/ImageCropper.vue

@@ -4,7 +4,10 @@ import {Cropper} from 'vue-advanced-cropper'
 import 'vue-advanced-cropper/dist/style.css'
 
 const props = defineProps({
-  src: String,
+  src: {
+    type: String,
+    default: ''
+  },
 })
 const showDeleteConfirm = ref(false)
 const emit = defineEmits(['cropped', 'close'])
@@ -31,12 +34,12 @@ const confirmDelete = () => {
 }
 
 const emitCrop = () => {
-  if (!cropperRef.value) return
+  if (!cropperRef.value) {return}
   const result = cropperRef.value.getResult()
-  if (!result || !result.canvas) return
+  if (!result || !result.canvas) {return}
 
   result.canvas.toBlob((blob) => {
-    if (!blob) return
+    if (!blob) {return}
 
     const reader = new FileReader()
     reader.onloadend = () => {
@@ -68,7 +71,8 @@ watch(zoomLevel, (newZoom) => {
         <label class="zoom-label">Zoom</label>
         <div class="zoom-controls">
           <button @click="decreaseZoom" class="zoom-btn">−</button>
-          <input type="range" :min="minZoom" :max="maxZoom" step="0.1" v-model="zoomLevel" @input="applyZoom"
+          <input
+type="range" :min="minZoom" :max="maxZoom" step="0.1" v-model="zoomLevel" @input="applyZoom"
                  class="zoom-slider"/>
           <button @click="increaseZoom" class="zoom-btn">+</button>
         </div>

playground/app/pages/index.vue

@@ -94,7 +94,7 @@ const applyCroppedMultiple = (file, index) => {
         :accept="['image/png', 'image/jpeg']"
         :drop-mounted="url"
     >
-      <template v-slot:icon>
+      <template #icon>
         <div style="color:white">X</div>
       </template>
     </SixDropzone>
@@ -108,8 +108,7 @@ const applyCroppedMultiple = (file, index) => {
           @update:model-value="modelValueFileMultiple"
           :drop-mounted="urlsMultiple"
           multiple
-      >
-      </SixDropzone>
+      />
       <button @click="$refs.eltMultiple.addFile()">Add File</button>
       <button @click="$refs.eltMultiple.clearFile()">clear File</button>
     </div>
@@ -119,10 +118,9 @@ const applyCroppedMultiple = (file, index) => {
       <SixDropzone
           id="dropCropper"
           v-model="photoFileCropper"
-          @update:modelValue="(files) => openCropper(files)"
+          @update:model-value="(files) => openCropper(files)"
           :accept="['image/png', 'image/jpeg']"
-      >
-      </SixDropzone>
+      />
       <div v-if="cropperModal" class="--overlay">
         <div class="--modal">
           <ImageCropper :src="imageToCrop" @cropped="applyCropped" @close="cropperModal = false"/>
@@ -134,12 +132,11 @@ const applyCroppedMultiple = (file, index) => {
           ref="eltMultipleCropper"
           id="dropCropperMultiple"
           v-model="photoFileCropperMultiple"
-          @update:modelValue="(files) => openCropperMultiple(files)"
+          @update:model-value="(files) => openCropperMultiple(files)"
           :accept="['image/png', 'image/jpeg']"
           multiple
-      >
-      </SixDropzone>
-      <template v-for="(item, index) in photoFileCropperMultiple">
+      />
+      <template v-for="(item, index) in photoFileCropperMultiple" :key="index">
         <div v-if="cropperModalMultiple[index]" class="--overlay">
           <div class="--modal">
             <ImageCropper