diff --git a/app/Enums/FormBlockInteractionType.php b/app/Enums/FormBlockInteractionType.php
index 2aacebb2..7a829b7c 100644
--- a/app/Enums/FormBlockInteractionType.php
+++ b/app/Enums/FormBlockInteractionType.php
@@ -8,6 +8,7 @@ enum FormBlockInteractionType: string
     case textarea = 'textarea';
     case button = 'button';
     case consent = 'consent';
+    case file = 'file';
 
     case range = 'range';
 
diff --git a/app/Enums/FormBlockType.php b/app/Enums/FormBlockType.php
index 1139e8a2..85f5ea32 100644
--- a/app/Enums/FormBlockType.php
+++ b/app/Enums/FormBlockType.php
@@ -12,6 +12,8 @@ enum FormBlockType: string
     case checkbox = 'checkbox';
     case radio = 'radio';
 
+    case file = 'input-file';
+
     case long = 'input-long';
     case short = 'input-short';
     case email = 'input-email';
diff --git a/app/Http/Controllers/Api/FormSubmitController.php b/app/Http/Controllers/Api/FormSubmitController.php
index e710ab6c..a8ffb1b4 100644
--- a/app/Http/Controllers/Api/FormSubmitController.php
+++ b/app/Http/Controllers/Api/FormSubmitController.php
@@ -37,16 +37,22 @@ public function __invoke(Request $request, Form $form)
     {
         $request->validate([
             'token' => 'required|string',
-            'payload' => 'array',
+            'is_uploading' => 'boolean',
+            'payload' => 'array|nullable',
         ]);
 
         $session = $form->formSessions()
             ->where('token', $request->input('token'))
-            ->firstOrFail()
-            ->submit($request->input('payload'));
+            ->firstOrFail();
 
-        event(new FormSessionCompletedEvent($session));
+        if (!is_null($request->payload)) {
+            $session->submit($request->input('payload'));
+        }
 
-        return response()->json($session, 200);
+        if (!$request->input('is_uploading', false)) {
+            event(new FormSessionCompletedEvent($session));
+        }
+
+        return response()->json($session->setHidden(['form']), 200);
     }
 }
diff --git a/app/Http/Controllers/Api/FormUploadController.php b/app/Http/Controllers/Api/FormUploadController.php
new file mode 100644
index 00000000..66ba6f09
--- /dev/null
+++ b/app/Http/Controllers/Api/FormUploadController.php
@@ -0,0 +1,38 @@
+<?php
+
+namespace App\Http\Controllers\Api;
+
+use App\Http\Controllers\Controller;
+use App\Models\Form;
+use App\Models\FormBlockInteraction;
+use Illuminate\Http\Request;
+
+class FormUploadController extends Controller
+{
+    public function __invoke(Request $request, Form $form)
+    {
+        $request->validate([
+            'token' => 'required|string',
+            'actionId' => 'required|string',
+            'file' => 'file',
+        ]);
+
+        $interaction = FormBlockInteraction::withUuid($request->input('actionId'))
+            ->firstOrFail();
+
+        // Validate that action belongs to the form
+        if ($interaction->formBlock->form->id !== $form->id) {
+            abort(404, 'Action not found');
+        }
+
+        $session = $form->formSessions()
+            ->where('token', $request->input('token'))
+            ->firstOrFail();
+
+        $sessionResponse = $session->formSessionResponses->where('form_block_interaction_id', $interaction->id)->first();
+
+        $upload = $sessionResponse->saveUpload($request->file('file'));
+
+        return response()->json($upload, 201);
+    }
+}
diff --git a/app/Http/Controllers/Api/PurgeFormSubmissionsController.php b/app/Http/Controllers/Api/PurgeFormSubmissionsController.php
index a12870b6..516166fe 100644
--- a/app/Http/Controllers/Api/PurgeFormSubmissionsController.php
+++ b/app/Http/Controllers/Api/PurgeFormSubmissionsController.php
@@ -18,7 +18,7 @@ public function __invoke(Form $form)
     {
         $this->authorize('update', $form);
 
-        $form->formSessions()->delete();
+        $form->formSessions->each(fn ($session) => $session->delete());
 
         return response()->json(null, 204);
     }
diff --git a/app/Http/Controllers/FormUploadsDownloadController.php b/app/Http/Controllers/FormUploadsDownloadController.php
new file mode 100644
index 00000000..1fc6f65a
--- /dev/null
+++ b/app/Http/Controllers/FormUploadsDownloadController.php
@@ -0,0 +1,21 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+use App\Models\FormSessionUpload;
+use Illuminate\Support\Facades\Storage;
+
+class FormUploadsDownloadController extends Controller
+{
+    public function __invoke(Request $request, $upload)
+    {
+        $upload = FormSessionUpload::whereUuid($upload)->firstOrFail();
+
+        if (!Storage::fileExists($upload->path)) {
+            abort(404);
+        }
+
+        return Storage::download($upload->path, $upload->name);
+    }
+}
diff --git a/app/Http/Kernel.php b/app/Http/Kernel.php
index 4bdb5c2c..3b04ebd5 100644
--- a/app/Http/Kernel.php
+++ b/app/Http/Kernel.php
@@ -71,6 +71,7 @@ class Kernel extends HttpKernel
         'throttle' => \Illuminate\Routing\Middleware\ThrottleRequests::class,
         'verified' => \Illuminate\Auth\Middleware\EnsureEmailIsVerified::class,
         'check-user-setup' => CheckUserSetup::class,
+        'signed' => \Illuminate\Routing\Middleware\ValidateSignature::class,
     ];
 
     /**
diff --git a/app/Http/Resources/FormSessionResponseResource.php b/app/Http/Resources/FormSessionResponseResource.php
index 3b1a78eb..0a464eae 100644
--- a/app/Http/Resources/FormSessionResponseResource.php
+++ b/app/Http/Resources/FormSessionResponseResource.php
@@ -21,7 +21,8 @@ public function toArray($request)
                 'message' => strip_tags($this->formBlock->message),
                 'name' => $this->formBlock->title ?? $this->formBlock->uuid,
                 'value' => $this->formatValue($this->value),
-                'original' => $this->value,
+                'original' => $this->formBlock->type === FormBlockType::file ? $this->appendFiles() : $this->value,
+                'type' => $this->formBlock->type,
             ];
         } catch (\Exception $e) {
             return [
@@ -29,6 +30,7 @@ public function toArray($request)
                 'value' => '',
                 'original' => '',
                 'message' => '',
+                'type' => '',
             ];
         }
     }
@@ -50,13 +52,28 @@ protected function formatValue($value)
         if ($this->formBlock->type === FormBlockType::consent) {
             $accepted = $value['accepted'] ? 'yes' : 'no';
 
-            return $value['consent'].': '.$accepted;
+            return $value['consent'] . ': ' . $accepted;
         }
 
         if ($this->formBlock->type === FormBlockType::rating || $this->formBlock->type === FormBlockType::scale) {
             return $value;
         }
 
+        if ($this->formBlock->type === FormBlockType::file) {
+            return $this->formSessionUploads->map(fn ($upload) => $upload->downloadUrl)->join(', ');
+        }
+
         return 'Unsupported value type';
     }
+
+    protected function appendFiles()
+    {
+        return $this->formSessionUploads->map(function ($upload) {
+            return [
+                'uuid' => $upload->uuid,
+                'name' => $upload->name,
+                'url' => $upload->downloadUrl,
+            ];
+        });
+    }
 }
diff --git a/app/Models/FormBlock.php b/app/Models/FormBlock.php
index f448e008..48bd9ccd 100644
--- a/app/Models/FormBlock.php
+++ b/app/Models/FormBlock.php
@@ -124,6 +124,9 @@ public function getInteractionType(): ?FormBlockInteractionType
             case FormBlockType::long:
                 return FormBlockInteractionType::textarea;
 
+            case FormBlockType::file:
+                return FormBlockInteractionType::file;
+
             case FormBlockType::checkbox:
             case FormBlockType::radio:
                 return FormBlockInteractionType::button;
diff --git a/app/Models/FormSession.php b/app/Models/FormSession.php
index a2dd5cdb..54f23a98 100644
--- a/app/Models/FormSession.php
+++ b/app/Models/FormSession.php
@@ -5,6 +5,7 @@
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Support\Carbon;
+use Illuminate\Support\Facades\Storage;
 
 class FormSession extends Model
 {
@@ -26,6 +27,17 @@ class FormSession extends Model
         'is_completed',
     ];
 
+    protected static function booted(): void
+    {
+        static::deleting(function (FormSession $session) {
+            $session->responses->each(function (FormSessionResponse $response) {
+                $response->formSessionUploads->each(function (FormSessionUpload $upload) {
+                    Storage::delete($upload->path);
+                });
+            });
+        });
+    }
+
     public function form()
     {
         return $this->belongsTo(Form::class, 'form_id', 'id');
@@ -36,6 +48,11 @@ public function webhooks()
         return $this->hasMany(FormSessionWebhook::class);
     }
 
+    public function responses()
+    {
+        return $this->hasMany(FormSessionResponse::class);
+    }
+
     public static function getByTokenAndForm(string $token, Form $form)
     {
         return self::where('token', $token)->where('form_id', $form->id)->first();
diff --git a/app/Models/FormSessionResponse.php b/app/Models/FormSessionResponse.php
index 97e05500..b5b0ae06 100644
--- a/app/Models/FormSessionResponse.php
+++ b/app/Models/FormSessionResponse.php
@@ -4,6 +4,8 @@
 
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
+use Illuminate\Http\UploadedFile;
+use Illuminate\Support\Str;
 
 class FormSessionResponse extends Model
 {
@@ -38,17 +40,33 @@ public function formSession()
         return $this->belongsTo(FormSession::class, 'form_session_id');
     }
 
+    public function formSessionUploads()
+    {
+        return $this->hasMany(FormSessionUpload::class);
+    }
+
     public function setValueAttribute($new)
     {
-        $this->attributes['value'] = encrypt($new);
+        $this->attributes['value'] = config('app.debug') ? json_encode($new) : encrypt($new);
     }
 
     public function getValueAttribute()
     {
         try {
-            return decrypt($this->attributes['value']);
+            return config('app.debug') ? json_decode($this->attributes['value'], true) : decrypt($this->attributes['value']);
         } catch (\Throwable $th) {
             return $this->attributes['value'];
         }
     }
+
+    public function saveUpload(UploadedFile $file)
+    {
+        return $this->formSessionUploads()->create([
+            'uuid' => Str::uuid(),
+            'name' => $file->getClientOriginalName(),
+            'path' => $file->store(implode('/', ['uploads', $this->id])),
+            'type' => $file->getClientMimeType(),
+            'size' => $file->getSize(),
+        ]);
+    }
 }
diff --git a/app/Models/FormSessionUpload.php b/app/Models/FormSessionUpload.php
new file mode 100644
index 00000000..e5a2ba84
--- /dev/null
+++ b/app/Models/FormSessionUpload.php
@@ -0,0 +1,29 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Support\Facades\URL;
+use Illuminate\Database\Eloquent\Model;
+use Illuminate\Database\Eloquent\Casts\Attribute;
+use Illuminate\Database\Eloquent\Factories\HasFactory;
+
+class FormSessionUpload extends Model
+{
+    use HasFactory;
+
+    protected $guarded = [];
+
+    protected $appends = ['download_url'];
+
+    public function formSessionResponse()
+    {
+        return $this->belongsTo(FormSessionResponse::class);
+    }
+
+    public function downloadUrl(): Attribute
+    {
+        return Attribute::make(
+            get: fn (mixed $value, array $attributes) => URL::temporarySignedRoute('forms.submission-uploads.download', now()->addDays(7), $attributes['uuid'])
+        );
+    }
+}
diff --git a/app/Providers/AppServiceProvider.php b/app/Providers/AppServiceProvider.php
index 1d7ccce7..7c5c0f9b 100644
--- a/app/Providers/AppServiceProvider.php
+++ b/app/Providers/AppServiceProvider.php
@@ -22,7 +22,11 @@ public function register()
         $this->app->bind(
             HttpClientInterface::class,
             function ($app) {
-                return new NoPrivateNetworkHttpClient(HttpClient::create());
+                return new NoPrivateNetworkHttpClient(HttpClient::create([
+                    'headers' => [
+                        'user-agent' => 'Input-App/1.0',
+                    ],
+                ]));
             }
         );
 
diff --git a/database/migrations/2024_02_22_142342_create_form_session_uploads_table.php b/database/migrations/2024_02_22_142342_create_form_session_uploads_table.php
new file mode 100644
index 00000000..b74e0710
--- /dev/null
+++ b/database/migrations/2024_02_22_142342_create_form_session_uploads_table.php
@@ -0,0 +1,33 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::create('form_session_uploads', function (Blueprint $table) {
+            $table->id();
+            $table->uuid('uuid');
+            $table->string('name');
+            $table->string('path');
+            $table->string('type');
+            $table->string('size');
+            $table->unsignedBigInteger('form_session_response_id');
+            $table->timestamps();
+        });
+
+        Schema::table('form_session_uploads', function (Blueprint $table) {
+            if (DB::getDriverName() !== 'sqlite') {
+                $table->foreign('form_session_response_id')
+                    ->references('id')->on('form_session_responses')
+                    ->onDelete('CASCADE');
+            }
+        });
+    }
+};
diff --git a/docker-compose.yml b/docker-compose.yml
index 72b6bae9..48915125 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -79,10 +79,10 @@ services:
       MINIO_ROOT_USER: "sail"
       MINIO_ROOT_PASSWORD: "password"
     volumes:
-      - "./storage/minio:/data/export"
+      - "sail-minio:/data/minio"
     networks:
       - sail
-    command: minio server /data/export --console-address ":8900"
+    command: minio server /data/minio --console-address ":8900"
     healthcheck:
       test: ["CMD", "curl", "-f", "http://localhost:9000/minio/health/live"]
       retries: 3
diff --git a/package-lock.json b/package-lock.json
index 325ac156..8ba0a418 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,58 +9,57 @@
             "version": "1.5.0",
             "license": "GNU Affero General Public License v3.0",
             "dependencies": {
-                "@deck9/ui": "^0.14.6",
-                "@headlessui/vue": "^1.7.17",
+                "@deck9/ui": "^0.14.10",
+                "@headlessui/vue": "^1.7.22",
                 "@highlightjs/vue-plugin": "^2.1.0",
                 "@inertiajs/inertia": "^0.11.1",
                 "@inertiajs/inertia-vue3": "^0.6.0",
                 "@inertiajs/progress": "^0.2.7",
                 "@pinia/plugin-debounce": "^0.1.0",
                 "@tailwindcss/forms": "^0.5.7",
-                "@tailwindcss/typography": "^0.5.10",
+                "@tailwindcss/typography": "^0.5.13",
                 "@tiptap/extension-link": "^2.0.0-beta.36",
                 "@tiptap/starter-kit": "^2.0.0-beta.181",
                 "@tiptap/vue-3": "^2.0.0-beta.90",
-                "@types/lodash": "^4.14.202",
-                "@types/node": "^20.11.10",
-                "@types/ziggy-js": "^1.8.0",
+                "@types/lodash": "^4.17.6",
+                "@types/node": "^20.14.10",
                 "@typescript-eslint/eslint-plugin": "^6.19.1",
                 "@typescript-eslint/parser": "^6.19.1",
                 "@vitejs/plugin-vue": "^4.5.0",
                 "@vitest/coverage-v8": "^0.34.6",
-                "@vueuse/core": "^10.7.2",
-                "autoprefixer": "^10.4.17",
-                "axios": "^1.6.7",
+                "@vueuse/core": "^10.11.0",
+                "autoprefixer": "^10.4.19",
+                "axios": "^1.7.2",
                 "copy-text-to-clipboard": "^3.2.0",
                 "eslint": "^8.56.0",
-                "eslint-plugin-vue": "^9.20.1",
+                "eslint-plugin-vue": "^9.27.0",
                 "floating-vue": "^2.0.0-beta.20",
-                "highlight.js": "^11.9.0",
+                "highlight.js": "^11.10.0",
                 "laravel-vite-plugin": "^0.8.1",
                 "lodash": "^4.17.19",
                 "pinia": "^2.1.7",
-                "postcss": "^8.4.33",
+                "postcss": "^8.4.39",
                 "postcss-import": "^15.1.0",
                 "striptags": "^3.2.0",
-                "tailwindcss": "^3.4.1",
-                "typescript": "^5.3.3",
-                "vite-plugin-css-injected-by-js": "^3.3.1",
-                "vue": "^3.4.15",
-                "vue-i18n": "^9.9.0",
-                "vue-tsc": "^1.8.27",
+                "tailwindcss": "^3.4.4",
+                "typescript": "^5.5.3",
+                "vite-plugin-css-injected-by-js": "^3.5.1",
+                "vue": "^3.4.38",
+                "vue-i18n": "^9.13.1",
+                "vue-tsc": "^2.0.26",
                 "vue3-smooth-dnd": "^0.0.6",
-                "yup": "^1.3.3",
+                "yup": "^1.4.0",
                 "ziggy-js": "^1.8.1"
             },
             "devDependencies": {
                 "@pinia/testing": "^0.1.3",
                 "@vitest/coverage-c8": "^0.33.0",
-                "@vue/test-utils": "^2.4.4",
+                "@vue/test-utils": "^2.4.6",
                 "browser-sync": "^2.29.3",
                 "jsdom": "^23.0.0",
-                "prettier": "^3.2.4",
+                "prettier": "^3.3.2",
                 "prettier-eslint": "^16.3.0",
-                "prettier-plugin-tailwindcss": "^0.5.11",
+                "prettier-plugin-tailwindcss": "^0.6.5",
                 "puppeteer": "^21.9.0",
                 "tailwind-config-viewer": "^1.7.3",
                 "vite": "^4.5.0",
@@ -176,11 +175,20 @@
                 "node": ">=4"
             }
         },
+        "node_modules/@babel/helper-string-parser": {
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.8.tgz",
+            "integrity": "sha512-pO9KhhRcuUyGnJWwyEgnRJTSIZHiT+vMD0kPeD+so0l7mxkMT19g3pjY9GTnHySck/hDzq+dtW/4VgnMkippsQ==",
+            "license": "MIT",
+            "engines": {
+                "node": ">=6.9.0"
+            }
+        },
         "node_modules/@babel/helper-validator-identifier": {
-            "version": "7.22.20",
-            "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz",
-            "integrity": "sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==",
-            "dev": true,
+            "version": "7.24.7",
+            "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.24.7.tgz",
+            "integrity": "sha512-rR+PBcQ1SMQDDyF6X0wxtG8QyLCgUB0eRAGguqRLfkCA87l7yAP7ehq8SNj96OOGTO8OBV70KhuFYcIkHXOg0w==",
+            "license": "MIT",
             "engines": {
                 "node": ">=6.9.0"
             }
@@ -262,9 +270,13 @@
             }
         },
         "node_modules/@babel/parser": {
-            "version": "7.23.9",
-            "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.9.tgz",
-            "integrity": "sha512-9tcKgqKbs3xGJ+NtKF2ndOBBLVwPjl1SHxPQkd36r3Dlirw3xWUeGaTbqr7uGZcTaxkVNwc+03SVP7aCdWrTlA==",
+            "version": "7.25.3",
+            "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.25.3.tgz",
+            "integrity": "sha512-iLTJKDbJ4hMvFPgQwwsVoxtHyWpKKPBrxkANrSYewDPaPpT5py5yeVkgPIJ7XYXhndxJpaA3PyALSXQ7u8e/Dw==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/types": "^7.25.2"
+            },
             "bin": {
                 "parser": "bin/babel-parser.js"
             },
@@ -272,6 +284,20 @@
                 "node": ">=6.0.0"
             }
         },
+        "node_modules/@babel/types": {
+            "version": "7.25.2",
+            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.25.2.tgz",
+            "integrity": "sha512-YTnYtra7W9e6/oAZEHj0bJehPRUlLH9/fbpT5LfB0NhQXyALCRkRs3zH9v07IYhkgpqX6Z78FnuccZr/l4Fs4Q==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/helper-string-parser": "^7.24.8",
+                "@babel/helper-validator-identifier": "^7.24.7",
+                "to-fast-properties": "^2.0.0"
+            },
+            "engines": {
+                "node": ">=6.9.0"
+            }
+        },
         "node_modules/@bcoe/v8-coverage": {
             "version": "0.2.3",
             "resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz",
@@ -286,9 +312,9 @@
             }
         },
         "node_modules/@deck9/ui": {
-            "version": "0.14.6",
-            "resolved": "https://registry.npmjs.org/@deck9/ui/-/ui-0.14.6.tgz",
-            "integrity": "sha512-h5unBL0SFOwvYBkq50STYnQXyDO45XAlRaadP9ngwY+myG6r38jtDP8BZF/MSR5V/mBhYvm4NTmsIT+sxMgSZw==",
+            "version": "0.14.10",
+            "resolved": "https://registry.npmjs.org/@deck9/ui/-/ui-0.14.10.tgz",
+            "integrity": "sha512-DxIAP0jObGhlcYasZphjdft2gRxhHg0+kIDPgOeKv62SzT0DU0v2pmRKv+KTML2RO6IZt1ekhUBnq769AyUoKQ==",
             "dependencies": {
                 "@deck9/tailwindcss-recursive-font-helper": "^1.0.1",
                 "@floating-ui/vue": "^1.0.4",
@@ -730,18 +756,18 @@
             }
         },
         "node_modules/@floating-ui/vue/node_modules/@floating-ui/dom": {
-            "version": "1.6.1",
-            "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.1.tgz",
-            "integrity": "sha512-iA8qE43/H5iGozC3W0YSnVSW42Vh522yyM1gj+BqRwVsTNOyr231PsXDaV04yT39PsO0QL2QpbI/M0ZaLUQgRQ==",
+            "version": "1.6.3",
+            "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.3.tgz",
+            "integrity": "sha512-RnDthu3mzPlQ31Ss/BTwQ1zjzIhr3lk1gZB1OC56h/1vEtaXkESrOqL5fQVMfXpwGtRwX+YsZBdyHtJMQnkArw==",
             "dependencies": {
-                "@floating-ui/core": "^1.6.0",
-                "@floating-ui/utils": "^0.2.1"
+                "@floating-ui/core": "^1.0.0",
+                "@floating-ui/utils": "^0.2.0"
             }
         },
         "node_modules/@floating-ui/vue/node_modules/vue-demi": {
-            "version": "0.14.6",
-            "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.6.tgz",
-            "integrity": "sha512-8QA7wrYSHKaYgUxDA5ZC24w+eHm3sYCbp0EzcDwKqN3p6HqtTCGR/GVsPyZW92unff4UlcSh++lmqDWN3ZIq4w==",
+            "version": "0.14.7",
+            "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.7.tgz",
+            "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
             "hasInstallScript": true,
             "bin": {
                 "vue-demi-fix": "bin/vue-demi-fix.js",
@@ -764,75 +790,75 @@
             }
         },
         "node_modules/@fortawesome/fontawesome-common-types": {
-            "version": "6.4.2",
-            "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.4.2.tgz",
-            "integrity": "sha512-1DgP7f+XQIJbLFCTX1V2QnxVmpLdKdzzo2k8EmvDOePfchaIGQ9eCHj2up3/jNEbZuBqel5OxiaOJf37TWauRA==",
+            "version": "6.5.1",
+            "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.1.tgz",
+            "integrity": "sha512-GkWzv+L6d2bI5f/Vk6ikJ9xtl7dfXtoRu3YGE6nq0p/FFqA1ebMOAWg3XgRyb0I6LYyYkiAo+3/KrwuBp8xG7A==",
             "hasInstallScript": true,
             "engines": {
                 "node": ">=6"
             }
         },
         "node_modules/@fortawesome/fontawesome-svg-core": {
-            "version": "6.4.2",
-            "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.4.2.tgz",
-            "integrity": "sha512-gjYDSKv3TrM2sLTOKBc5rH9ckje8Wrwgx1CxAPbN5N3Fm4prfi7NsJVWd1jklp7i5uSCVwhZS5qlhMXqLrpAIg==",
+            "version": "6.5.1",
+            "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.1.tgz",
+            "integrity": "sha512-MfRCYlQPXoLlpem+egxjfkEuP9UQswTrlCOsknus/NcMoblTH2g0jPrapbcIb04KGA7E2GZxbAccGZfWoYgsrQ==",
             "hasInstallScript": true,
             "dependencies": {
-                "@fortawesome/fontawesome-common-types": "6.4.2"
+                "@fortawesome/fontawesome-common-types": "6.5.1"
             },
             "engines": {
                 "node": ">=6"
             }
         },
         "node_modules/@fortawesome/free-brands-svg-icons": {
-            "version": "6.4.2",
-            "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.4.2.tgz",
-            "integrity": "sha512-LKOwJX0I7+mR/cvvf6qIiqcERbdnY+24zgpUSouySml+5w8B4BJOx8EhDR/FTKAu06W12fmUIcv6lzPSwYKGGg==",
+            "version": "6.5.1",
+            "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.5.1.tgz",
+            "integrity": "sha512-093l7DAkx0aEtBq66Sf19MgoZewv1zeY9/4C7vSKPO4qMwEsW/2VYTUTpBtLwfb9T2R73tXaRDPmE4UqLCYHfg==",
             "hasInstallScript": true,
             "dependencies": {
-                "@fortawesome/fontawesome-common-types": "6.4.2"
+                "@fortawesome/fontawesome-common-types": "6.5.1"
             },
             "engines": {
                 "node": ">=6"
             }
         },
         "node_modules/@fortawesome/free-regular-svg-icons": {
-            "version": "6.4.2",
-            "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.4.2.tgz",
-            "integrity": "sha512-0+sIUWnkgTVVXVAPQmW4vxb9ZTHv0WstOa3rBx9iPxrrrDH6bNLsDYuwXF9b6fGm+iR7DKQvQshUH/FJm3ed9Q==",
+            "version": "6.5.1",
+            "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.5.1.tgz",
+            "integrity": "sha512-m6ShXn+wvqEU69wSP84coxLbNl7sGVZb+Ca+XZq6k30SzuP3X4TfPqtycgUh9ASwlNh5OfQCd8pDIWxl+O+LlQ==",
             "hasInstallScript": true,
             "dependencies": {
-                "@fortawesome/fontawesome-common-types": "6.4.2"
+                "@fortawesome/fontawesome-common-types": "6.5.1"
             },
             "engines": {
                 "node": ">=6"
             }
         },
         "node_modules/@fortawesome/free-solid-svg-icons": {
-            "version": "6.4.2",
-            "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.4.2.tgz",
-            "integrity": "sha512-sYwXurXUEQS32fZz9hVCUUv/xu49PEJEyUOsA51l6PU/qVgfbTb2glsTEaJngVVT8VqBATRIdh7XVgV1JF1LkA==",
+            "version": "6.5.1",
+            "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.1.tgz",
+            "integrity": "sha512-S1PPfU3mIJa59biTtXJz1oI0+KAXW6bkAb31XKhxdxtuXDiUIFsih4JR1v5BbxY7hVHsD1RKq+jRkVRaf773NQ==",
             "hasInstallScript": true,
             "dependencies": {
-                "@fortawesome/fontawesome-common-types": "6.4.2"
+                "@fortawesome/fontawesome-common-types": "6.5.1"
             },
             "engines": {
                 "node": ">=6"
             }
         },
         "node_modules/@fortawesome/vue-fontawesome": {
-            "version": "3.0.5",
-            "resolved": "https://registry.npmjs.org/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.0.5.tgz",
-            "integrity": "sha512-isZZ4+utQH9qg9cWxWYHQ9GwI3r5FeO7GnmzKYV+gbjxcptQhh+F99iZXi1Y9AvFUEgy8kRpAdvDlbb3drWFrw==",
+            "version": "3.0.6",
+            "resolved": "https://registry.npmjs.org/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.0.6.tgz",
+            "integrity": "sha512-akrL7lTroyNpPkoHtvK2UpsMzJr6jXdHaQ0YdcwqDsB8jdwlpNHZYijpOUd9KJsARr+VB3WXY4EyObepqJ4ytQ==",
             "peerDependencies": {
                 "@fortawesome/fontawesome-svg-core": "~1 || ~6",
                 "vue": ">= 3.0.0 < 4"
             }
         },
         "node_modules/@headlessui/vue": {
-            "version": "1.7.17",
-            "resolved": "https://registry.npmjs.org/@headlessui/vue/-/vue-1.7.17.tgz",
-            "integrity": "sha512-hmJChv8HzKorxd9F70RGnECAwZfkvmmwOqreuKLWY/19d5qbWnSdw+DNbuA/Uo6X5rb4U5B3NrT+qBKPmjhRqw==",
+            "version": "1.7.22",
+            "resolved": "https://registry.npmjs.org/@headlessui/vue/-/vue-1.7.22.tgz",
+            "integrity": "sha512-Hoffjoolq1rY+LOfJ+B/OvkhuBXXBFgd8oBlN+l1TApma2dB0En0ucFZrwQtb33SmcCqd32EQd0y07oziXWNYg==",
             "dependencies": {
                 "@tanstack/vue-virtual": "^3.0.0-beta.60"
             },
@@ -925,12 +951,12 @@
             }
         },
         "node_modules/@intlify/core-base": {
-            "version": "9.9.0",
-            "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.9.0.tgz",
-            "integrity": "sha512-C7UXPymDIOlMGSNjAhNLtKgzITc/8BjINK5gNKXg8GiWCTwL6n3MWr55czksxn8RM5wTMz0qcLOFT+adtaVQaA==",
+            "version": "9.13.1",
+            "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.13.1.tgz",
+            "integrity": "sha512-+bcQRkJO9pcX8d0gel9ZNfrzU22sZFSA0WVhfXrf5jdJOS24a+Bp8pozuS9sBI9Hk/tGz83pgKfmqcn/Ci7/8w==",
             "dependencies": {
-                "@intlify/message-compiler": "9.9.0",
-                "@intlify/shared": "9.9.0"
+                "@intlify/message-compiler": "9.13.1",
+                "@intlify/shared": "9.13.1"
             },
             "engines": {
                 "node": ">= 16"
@@ -940,11 +966,11 @@
             }
         },
         "node_modules/@intlify/message-compiler": {
-            "version": "9.9.0",
-            "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.9.0.tgz",
-            "integrity": "sha512-yDU/jdUm9KuhEzYfS+wuyja209yXgdl1XFhMlKtXEgSFTxz4COZQCRXXbbH8JrAjMsaJ7bdoPSLsKlY6mXG2iA==",
+            "version": "9.13.1",
+            "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.13.1.tgz",
+            "integrity": "sha512-SKsVa4ajYGBVm7sHMXd5qX70O2XXjm55zdZB3VeMFCvQyvLew/dLvq3MqnaIsTMF1VkkOb9Ttr6tHcMlyPDL9w==",
             "dependencies": {
-                "@intlify/shared": "9.9.0",
+                "@intlify/shared": "9.13.1",
                 "source-map-js": "^1.0.2"
             },
             "engines": {
@@ -955,9 +981,9 @@
             }
         },
         "node_modules/@intlify/shared": {
-            "version": "9.9.0",
-            "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.9.0.tgz",
-            "integrity": "sha512-1ECUyAHRrzOJbOizyGufYP2yukqGrWXtkmTu4PcswVnWbkcjzk3YQGmJ0bLkM7JZ0ZYAaohLGdYvBYnTOGYJ9g==",
+            "version": "9.13.1",
+            "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.13.1.tgz",
+            "integrity": "sha512-u3b6BKGhE6j/JeRU6C/RL2FgyJfy6LakbtfeVF8fJXURpZZTzfh3e05J0bu0XPw447Q6/WUp3C4ajv4TMS4YsQ==",
             "engines": {
                 "node": ">= 16"
             },
@@ -1125,12 +1151,12 @@
             "integrity": "sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw=="
         },
         "node_modules/@jridgewell/trace-mapping": {
-            "version": "0.3.17",
-            "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.17.tgz",
-            "integrity": "sha512-MCNzAp77qzKca9+W/+I0+sEpaUnZoeasnghNeVc41VZCEKaCH73Vq3BZZ/SzWIgrqE4H4ceI+p+b6C0mHf9T4g==",
+            "version": "0.3.22",
+            "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.22.tgz",
+            "integrity": "sha512-Wf963MzWtA2sjrNt+g18IAln9lKnlRp+K2eH4jjIoF1wYeq3aMREpG09xhlhdzS0EjwU7qmUJYangWa+151vZw==",
             "dependencies": {
-                "@jridgewell/resolve-uri": "3.1.0",
-                "@jridgewell/sourcemap-codec": "1.4.14"
+                "@jridgewell/resolve-uri": "^3.1.0",
+                "@jridgewell/sourcemap-codec": "^1.4.14"
             }
         },
         "node_modules/@koa/router": {
@@ -1342,9 +1368,9 @@
             }
         },
         "node_modules/@storybook/node-logger": {
-            "version": "7.5.3",
-            "resolved": "https://registry.npmjs.org/@storybook/node-logger/-/node-logger-7.5.3.tgz",
-            "integrity": "sha512-7ZZDw/q3hakBj1FngsBjaHNIBguYAWojp7R1fFTvwkeunCi21EUzZjRBcqp10kB6BP3/NLX32bIQknsCWD76rQ==",
+            "version": "7.6.16",
+            "resolved": "https://registry.npmjs.org/@storybook/node-logger/-/node-logger-7.6.16.tgz",
+            "integrity": "sha512-s18wgtLynLWnunz47lkVIpjk8J6LxT/OmfzkggieU8cG2XYRbf//t7/EOUpOqK77+Xqm3epSwgDAxOXGfjOjAA==",
             "funding": {
                 "type": "opencollective",
                 "url": "https://opencollective.com/storybook"
@@ -1362,9 +1388,10 @@
             }
         },
         "node_modules/@tailwindcss/typography": {
-            "version": "0.5.10",
-            "resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.10.tgz",
-            "integrity": "sha512-Pe8BuPJQJd3FfRnm6H0ulKIGoMEQS+Vq01R6M5aCrFB/ccR/shT+0kXLjouGC1gFLm9hopTFN+DMP0pfwRWzPw==",
+            "version": "0.5.13",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.13.tgz",
+            "integrity": "sha512-ADGcJ8dX21dVVHIwTRgzrcunY6YY9uSlAHHGVKvkA+vLc5qLwEszvKts40lx7z0qc4clpjclwLeK5rVCV2P/uw==",
+            "license": "MIT",
             "dependencies": {
                 "lodash.castarray": "^4.4.0",
                 "lodash.isplainobject": "^4.0.6",
@@ -1796,9 +1823,9 @@
             "dev": true
         },
         "node_modules/@types/eslint": {
-            "version": "8.44.7",
-            "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.44.7.tgz",
-            "integrity": "sha512-f5ORu2hcBbKei97U73mf+l9t4zTGl74IqZ0GQk4oVea/VS8tQZYkUveSYojk+frraAVYId0V2WC9O4PTNru2FQ==",
+            "version": "8.56.2",
+            "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.56.2.tgz",
+            "integrity": "sha512-uQDwm1wFHmbBbCZCqAlq6Do9LYwByNZHWzXppSnay9SuwJ+VRbjkbLABer54kcPnMSlG6Fdiy2yaFXm/z9Z5gw==",
             "peer": true,
             "dependencies": {
                 "@types/estree": "*",
@@ -1832,14 +1859,15 @@
             "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA=="
         },
         "node_modules/@types/lodash": {
-            "version": "4.14.202",
-            "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.202.tgz",
-            "integrity": "sha512-OvlIYQK9tNneDlS0VN54LLd5uiPCBOp7gS5Z0f1mjoJYBrtStzgmJBxONW3U6OZqdtNzZPmn9BS/7WI7BFFcFQ=="
+            "version": "4.17.6",
+            "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.6.tgz",
+            "integrity": "sha512-OpXEVoCKSS3lQqjx9GGGOapBeuW5eUboYHRlHP9urXPX25IKZ6AnP5ZRxtVf63iieUbsHxLn8NQ5Nlftc6yzAA=="
         },
         "node_modules/@types/node": {
-            "version": "20.11.10",
-            "resolved": "https://registry.npmjs.org/@types/node/-/node-20.11.10.tgz",
-            "integrity": "sha512-rZEfe/hJSGYmdfX9tvcPMYeYPW2sNl50nsw4jZmRcaG0HIAb0WYEpsB05GOb53vjqpyE9GUhlDQ4jLSoB5q9kg==",
+            "version": "20.14.10",
+            "resolved": "https://registry.npmjs.org/@types/node/-/node-20.14.10.tgz",
+            "integrity": "sha512-MdiXf+nDuMvY0gJKxyfZ7/6UFsETO7mGKF54MVD/ekJS6HdFtpZFBgrh6Pseu64XTb2MLyFPlbW6hj8HYRQNOQ==",
+            "license": "MIT",
             "dependencies": {
                 "undici-types": "~5.26.4"
             }
@@ -1967,15 +1995,6 @@
                 "@types/node": "*"
             }
         },
-        "node_modules/@types/ziggy-js": {
-            "version": "1.8.0",
-            "resolved": "https://registry.npmjs.org/@types/ziggy-js/-/ziggy-js-1.8.0.tgz",
-            "integrity": "sha512-5MIf/vogCutjZLjSqyizK/KLWKRe+ulnMdUZqrdEkG3K6/6k/UQhCGfM6WC4aGM8BQpEc+55fwSGAtEMqesDAQ==",
-            "deprecated": "This is a stub types definition. ziggy-js provides its own type definitions, so you do not need this installed.",
-            "dependencies": {
-                "ziggy-js": "*"
-            }
-        },
         "node_modules/@typescript-eslint/eslint-plugin": {
             "version": "6.19.1",
             "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-6.19.1.tgz",
@@ -2305,74 +2324,79 @@
             }
         },
         "node_modules/@volar/language-core": {
-            "version": "1.11.1",
-            "resolved": "https://registry.npmjs.org/@volar/language-core/-/language-core-1.11.1.tgz",
-            "integrity": "sha512-dOcNn3i9GgZAcJt43wuaEykSluAuOkQgzni1cuxLxTV0nJKanQztp7FxyswdRILaKH+P2XZMPRp2S4MV/pElCw==",
+            "version": "2.4.0-alpha.15",
+            "resolved": "https://registry.npmjs.org/@volar/language-core/-/language-core-2.4.0-alpha.15.tgz",
+            "integrity": "sha512-mt8z4Fm2WxfQYoQHPcKVjLQV6PgPqyKLbkCVY2cr5RSaamqCHjhKEpsFX66aL4D/7oYguuaUw9Bx03Vt0TpIIA==",
+            "license": "MIT",
             "dependencies": {
-                "@volar/source-map": "1.11.1"
+                "@volar/source-map": "2.4.0-alpha.15"
             }
         },
         "node_modules/@volar/source-map": {
-            "version": "1.11.1",
-            "resolved": "https://registry.npmjs.org/@volar/source-map/-/source-map-1.11.1.tgz",
-            "integrity": "sha512-hJnOnwZ4+WT5iupLRnuzbULZ42L7BWWPMmruzwtLhJfpDVoZLjNBxHDi2sY2bgZXCKlpU5XcsMFoYrsQmPhfZg==",
-            "dependencies": {
-                "muggle-string": "^0.3.1"
-            }
+            "version": "2.4.0-alpha.15",
+            "resolved": "https://registry.npmjs.org/@volar/source-map/-/source-map-2.4.0-alpha.15.tgz",
+            "integrity": "sha512-8Htngw5TmBY4L3ClDqBGyfLhsB8EmoEXUH1xydyEtEoK0O6NX5ur4Jw8jgvscTlwzizyl/wsN1vn0cQXVbbXYg==",
+            "license": "MIT"
         },
         "node_modules/@volar/typescript": {
-            "version": "1.11.1",
-            "resolved": "https://registry.npmjs.org/@volar/typescript/-/typescript-1.11.1.tgz",
-            "integrity": "sha512-iU+t2mas/4lYierSnoFOeRFQUhAEMgsFuQxoxvwn5EdQopw43j+J27a4lt9LMInx1gLJBC6qL14WYGlgymaSMQ==",
+            "version": "2.4.0-alpha.15",
+            "resolved": "https://registry.npmjs.org/@volar/typescript/-/typescript-2.4.0-alpha.15.tgz",
+            "integrity": "sha512-U3StRBbDuxV6Woa4hvGS4kz3XcOzrWUKgFdEFN+ba1x3eaYg7+ytau8ul05xgA+UNGLXXsKur7fTUhDFyISk0w==",
+            "license": "MIT",
             "dependencies": {
-                "@volar/language-core": "1.11.1",
-                "path-browserify": "^1.0.1"
+                "@volar/language-core": "2.4.0-alpha.15",
+                "path-browserify": "^1.0.1",
+                "vscode-uri": "^3.0.8"
             }
         },
         "node_modules/@vue/compiler-core": {
-            "version": "3.4.15",
-            "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.15.tgz",
-            "integrity": "sha512-XcJQVOaxTKCnth1vCxEChteGuwG6wqnUHxAm1DO3gCz0+uXKaJNx8/digSz4dLALCy8n2lKq24jSUs8segoqIw==",
+            "version": "3.4.38",
+            "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.38.tgz",
+            "integrity": "sha512-8IQOTCWnLFqfHzOGm9+P8OPSEDukgg3Huc92qSG49if/xI2SAwLHQO2qaPQbjCWPBcQoO1WYfXfTACUrWV3c5A==",
+            "license": "MIT",
             "dependencies": {
-                "@babel/parser": "^7.23.6",
-                "@vue/shared": "3.4.15",
+                "@babel/parser": "^7.24.7",
+                "@vue/shared": "3.4.38",
                 "entities": "^4.5.0",
                 "estree-walker": "^2.0.2",
-                "source-map-js": "^1.0.2"
+                "source-map-js": "^1.2.0"
             }
         },
         "node_modules/@vue/compiler-dom": {
-            "version": "3.4.15",
-            "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.15.tgz",
-            "integrity": "sha512-wox0aasVV74zoXyblarOM3AZQz/Z+OunYcIHe1OsGclCHt8RsRm04DObjefaI82u6XDzv+qGWZ24tIsRAIi5MQ==",
+            "version": "3.4.38",
+            "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.38.tgz",
+            "integrity": "sha512-Osc/c7ABsHXTsETLgykcOwIxFktHfGSUDkb05V61rocEfsFDcjDLH/IHJSNJP+/Sv9KeN2Lx1V6McZzlSb9EhQ==",
+            "license": "MIT",
             "dependencies": {
-                "@vue/compiler-core": "3.4.15",
-                "@vue/shared": "3.4.15"
+                "@vue/compiler-core": "3.4.38",
+                "@vue/shared": "3.4.38"
             }
         },
         "node_modules/@vue/compiler-sfc": {
-            "version": "3.4.15",
-            "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.15.tgz",
-            "integrity": "sha512-LCn5M6QpkpFsh3GQvs2mJUOAlBQcCco8D60Bcqmf3O3w5a+KWS5GvYbrrJBkgvL1BDnTp+e8q0lXCLgHhKguBA==",
-            "dependencies": {
-                "@babel/parser": "^7.23.6",
-                "@vue/compiler-core": "3.4.15",
-                "@vue/compiler-dom": "3.4.15",
-                "@vue/compiler-ssr": "3.4.15",
-                "@vue/shared": "3.4.15",
+            "version": "3.4.38",
+            "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.38.tgz",
+            "integrity": "sha512-s5QfZ+9PzPh3T5H4hsQDJtI8x7zdJaew/dCGgqZ2630XdzaZ3AD8xGZfBqpT8oaD/p2eedd+pL8tD5vvt5ZYJQ==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/parser": "^7.24.7",
+                "@vue/compiler-core": "3.4.38",
+                "@vue/compiler-dom": "3.4.38",
+                "@vue/compiler-ssr": "3.4.38",
+                "@vue/shared": "3.4.38",
                 "estree-walker": "^2.0.2",
-                "magic-string": "^0.30.5",
-                "postcss": "^8.4.33",
-                "source-map-js": "^1.0.2"
+                "magic-string": "^0.30.10",
+                "postcss": "^8.4.40",
+                "source-map-js": "^1.2.0"
             }
         },
         "node_modules/@vue/compiler-ssr": {
-            "version": "3.4.15",
-            "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.15.tgz",
-            "integrity": "sha512-1jdeQyiGznr8gjFDadVmOJqZiLNSsMa5ZgqavkPZ8O2wjHv0tVuAEsw5hTdUoUW4232vpBbL/wJhzVW/JwY1Uw==",
+            "version": "3.4.38",
+            "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.38.tgz",
+            "integrity": "sha512-YXznKFQ8dxYpAz9zLuVvfcXhc31FSPFDcqr0kyujbOwNhlmaNvL2QfIy+RZeJgSn5Fk54CWoEUeW+NVBAogGaw==",
+            "license": "MIT",
             "dependencies": {
-                "@vue/compiler-dom": "3.4.15",
-                "@vue/shared": "3.4.15"
+                "@vue/compiler-dom": "3.4.38",
+                "@vue/shared": "3.4.38"
             }
         },
         "node_modules/@vue/devtools-api": {
@@ -2381,17 +2405,17 @@
             "integrity": "sha512-o9KfBeaBmCKl10usN4crU53fYtC1r7jJwdGKjPT24t348rHxgfpZ0xL3Xm/gLUYnc0oTp8LAmrxOeLyu6tbk2Q=="
         },
         "node_modules/@vue/language-core": {
-            "version": "1.8.27",
-            "resolved": "https://registry.npmjs.org/@vue/language-core/-/language-core-1.8.27.tgz",
-            "integrity": "sha512-L8Kc27VdQserNaCUNiSFdDl9LWT24ly8Hpwf1ECy3aFb9m6bDhBGQYOujDm21N7EW3moKIOKEanQwe1q5BK+mA==",
-            "dependencies": {
-                "@volar/language-core": "~1.11.1",
-                "@volar/source-map": "~1.11.1",
-                "@vue/compiler-dom": "^3.3.0",
-                "@vue/shared": "^3.3.0",
+            "version": "2.0.26",
+            "resolved": "https://registry.npmjs.org/@vue/language-core/-/language-core-2.0.26.tgz",
+            "integrity": "sha512-/lt6SfQ3O1yDAhPsnLv9iSUgXd1dMHqUm/t3RctfqjuwQf1LnftZ414X3UBn6aXT4MiwXWtbNJ4Z0NZWwDWgJQ==",
+            "license": "MIT",
+            "dependencies": {
+                "@volar/language-core": "~2.4.0-alpha.15",
+                "@vue/compiler-dom": "^3.4.0",
+                "@vue/shared": "^3.4.0",
                 "computeds": "^0.0.1",
                 "minimatch": "^9.0.3",
-                "muggle-string": "^0.3.1",
+                "muggle-string": "^0.4.1",
                 "path-browserify": "^1.0.1",
                 "vue-template-compiler": "^2.7.14"
             },
@@ -2408,14 +2432,16 @@
             "version": "2.0.1",
             "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
             "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+            "license": "MIT",
             "dependencies": {
                 "balanced-match": "^1.0.0"
             }
         },
         "node_modules/@vue/language-core/node_modules/minimatch": {
-            "version": "9.0.3",
-            "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
-            "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
+            "version": "9.0.5",
+            "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+            "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+            "license": "ISC",
             "dependencies": {
                 "brace-expansion": "^2.0.1"
             },
@@ -2427,86 +2453,83 @@
             }
         },
         "node_modules/@vue/reactivity": {
-            "version": "3.4.15",
-            "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.15.tgz",
-            "integrity": "sha512-55yJh2bsff20K5O84MxSvXKPHHt17I2EomHznvFiJCAZpJTNW8IuLj1xZWMLELRhBK3kkFV/1ErZGHJfah7i7w==",
+            "version": "3.4.38",
+            "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.38.tgz",
+            "integrity": "sha512-4vl4wMMVniLsSYYeldAKzbk72+D3hUnkw9z8lDeJacTxAkXeDAP1uE9xr2+aKIN0ipOL8EG2GPouVTH6yF7Gnw==",
+            "license": "MIT",
             "dependencies": {
-                "@vue/shared": "3.4.15"
+                "@vue/shared": "3.4.38"
             }
         },
         "node_modules/@vue/runtime-core": {
-            "version": "3.4.15",
-            "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.15.tgz",
-            "integrity": "sha512-6E3by5m6v1AkW0McCeAyhHTw+3y17YCOKG0U0HDKDscV4Hs0kgNT5G+GCHak16jKgcCDHpI9xe5NKb8sdLCLdw==",
+            "version": "3.4.38",
+            "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.38.tgz",
+            "integrity": "sha512-21z3wA99EABtuf+O3IhdxP0iHgkBs1vuoCAsCKLVJPEjpVqvblwBnTj42vzHRlWDCyxu9ptDm7sI2ZMcWrQqlA==",
+            "license": "MIT",
             "dependencies": {
-                "@vue/reactivity": "3.4.15",
-                "@vue/shared": "3.4.15"
+                "@vue/reactivity": "3.4.38",
+                "@vue/shared": "3.4.38"
             }
         },
         "node_modules/@vue/runtime-dom": {
-            "version": "3.4.15",
-            "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.15.tgz",
-            "integrity": "sha512-EVW8D6vfFVq3V/yDKNPBFkZKGMFSvZrUQmx196o/v2tHKdwWdiZjYUBS+0Ez3+ohRyF8Njwy/6FH5gYJ75liUw==",
-            "dependencies": {
-                "@vue/runtime-core": "3.4.15",
-                "@vue/shared": "3.4.15",
+            "version": "3.4.38",
+            "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.38.tgz",
+            "integrity": "sha512-afZzmUreU7vKwKsV17H1NDThEEmdYI+GCAK/KY1U957Ig2NATPVjCROv61R19fjZNzMmiU03n79OMnXyJVN0UA==",
+            "license": "MIT",
+            "dependencies": {
+                "@vue/reactivity": "3.4.38",
+                "@vue/runtime-core": "3.4.38",
+                "@vue/shared": "3.4.38",
                 "csstype": "^3.1.3"
             }
         },
         "node_modules/@vue/server-renderer": {
-            "version": "3.4.15",
-            "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.15.tgz",
-            "integrity": "sha512-3HYzaidu9cHjrT+qGUuDhFYvF/j643bHC6uUN9BgM11DVy+pM6ATsG6uPBLnkwOgs7BpJABReLmpL3ZPAsUaqw==",
+            "version": "3.4.38",
+            "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.38.tgz",
+            "integrity": "sha512-NggOTr82FbPEkkUvBm4fTGcwUY8UuTsnWC/L2YZBmvaQ4C4Jl/Ao4HHTB+l7WnFCt5M/dN3l0XLuyjzswGYVCA==",
+            "license": "MIT",
             "dependencies": {
-                "@vue/compiler-ssr": "3.4.15",
-                "@vue/shared": "3.4.15"
+                "@vue/compiler-ssr": "3.4.38",
+                "@vue/shared": "3.4.38"
             },
             "peerDependencies": {
-                "vue": "3.4.15"
+                "vue": "3.4.38"
             }
         },
         "node_modules/@vue/shared": {
-            "version": "3.4.15",
-            "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.15.tgz",
-            "integrity": "sha512-KzfPTxVaWfB+eGcGdbSf4CWdaXcGDqckoeXUh7SB3fZdEtzPCK2Vq9B/lRRL3yutax/LWITz+SwvgyOxz5V75g=="
+            "version": "3.4.38",
+            "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.38.tgz",
+            "integrity": "sha512-q0xCiLkuWWQLzVrecPb0RMsNWyxICOjPrcrwxTUEHb1fsnvni4dcuyG7RT/Ie7VPTvnjzIaWzRMUBsrqNj/hhw==",
+            "license": "MIT"
         },
         "node_modules/@vue/test-utils": {
-            "version": "2.4.4",
-            "resolved": "https://registry.npmjs.org/@vue/test-utils/-/test-utils-2.4.4.tgz",
-            "integrity": "sha512-8jkRxz8pNhClAf4Co4ZrpAoFISdvT3nuSkUlY6Ys6rmTpw3DMWG/X3mw3gQ7QJzgCZO9f+zuE2kW57fi09MW7Q==",
+            "version": "2.4.6",
+            "resolved": "https://registry.npmjs.org/@vue/test-utils/-/test-utils-2.4.6.tgz",
+            "integrity": "sha512-FMxEjOpYNYiFe0GkaHsnJPXFHxQ6m4t8vI/ElPGpMWxZKpmRvQ33OIrvRXemy6yha03RxhOlQuy+gZMC3CQSow==",
             "dev": true,
             "dependencies": {
                 "js-beautify": "^1.14.9",
-                "vue-component-type-helpers": "^1.8.21"
-            },
-            "peerDependencies": {
-                "@vue/server-renderer": "^3.0.1",
-                "vue": "^3.0.1"
-            },
-            "peerDependenciesMeta": {
-                "@vue/server-renderer": {
-                    "optional": true
-                }
+                "vue-component-type-helpers": "^2.0.0"
             }
         },
         "node_modules/@vueuse/core": {
-            "version": "10.7.2",
-            "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.7.2.tgz",
-            "integrity": "sha512-AOyAL2rK0By62Hm+iqQn6Rbu8bfmbgaIMXcE3TSr7BdQ42wnSFlwIdPjInO62onYsEMK/yDMU8C6oGfDAtZ2qQ==",
+            "version": "10.11.0",
+            "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.11.0.tgz",
+            "integrity": "sha512-x3sD4Mkm7PJ+pcq3HX8PLPBadXCAlSDR/waK87dz0gQE+qJnaaFhc/dZVfJz+IUYzTMVGum2QlR7ImiJQN4s6g==",
             "dependencies": {
                 "@types/web-bluetooth": "^0.0.20",
-                "@vueuse/metadata": "10.7.2",
-                "@vueuse/shared": "10.7.2",
-                "vue-demi": ">=0.14.6"
+                "@vueuse/metadata": "10.11.0",
+                "@vueuse/shared": "10.11.0",
+                "vue-demi": ">=0.14.8"
             },
             "funding": {
                 "url": "https://github.com/sponsors/antfu"
             }
         },
         "node_modules/@vueuse/core/node_modules/vue-demi": {
-            "version": "0.14.6",
-            "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.6.tgz",
-            "integrity": "sha512-8QA7wrYSHKaYgUxDA5ZC24w+eHm3sYCbp0EzcDwKqN3p6HqtTCGR/GVsPyZW92unff4UlcSh++lmqDWN3ZIq4w==",
+            "version": "0.14.8",
+            "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.8.tgz",
+            "integrity": "sha512-Uuqnk9YE9SsWeReYqK2alDI5YzciATE0r2SkA6iMAtuXvNTMNACJLJEXNXaEy94ECuBe4Sk6RzRU80kjdbIo1Q==",
             "hasInstallScript": true,
             "bin": {
                 "vue-demi-fix": "bin/vue-demi-fix.js",
@@ -2529,28 +2552,28 @@
             }
         },
         "node_modules/@vueuse/metadata": {
-            "version": "10.7.2",
-            "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.7.2.tgz",
-            "integrity": "sha512-kCWPb4J2KGrwLtn1eJwaJD742u1k5h6v/St5wFe8Quih90+k2a0JP8BS4Zp34XUuJqS2AxFYMb1wjUL8HfhWsQ==",
+            "version": "10.11.0",
+            "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.0.tgz",
+            "integrity": "sha512-kQX7l6l8dVWNqlqyN3ePW3KmjCQO3ZMgXuBMddIu83CmucrsBfXlH+JoviYyRBws/yLTQO8g3Pbw+bdIoVm4oQ==",
             "funding": {
                 "url": "https://github.com/sponsors/antfu"
             }
         },
         "node_modules/@vueuse/shared": {
-            "version": "10.7.2",
-            "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.7.2.tgz",
-            "integrity": "sha512-qFbXoxS44pi2FkgFjPvF4h7c9oMDutpyBdcJdMYIMg9XyXli2meFMuaKn+UMgsClo//Th6+beeCgqweT/79BVA==",
+            "version": "10.11.0",
+            "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.0.tgz",
+            "integrity": "sha512-fyNoIXEq3PfX1L3NkNhtVQUSRtqYwJtJg+Bp9rIzculIZWHTkKSysujrOk2J+NrRulLTQH9+3gGSfYLWSEWU1A==",
             "dependencies": {
-                "vue-demi": ">=0.14.6"
+                "vue-demi": ">=0.14.8"
             },
             "funding": {
                 "url": "https://github.com/sponsors/antfu"
             }
         },
         "node_modules/@vueuse/shared/node_modules/vue-demi": {
-            "version": "0.14.6",
-            "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.6.tgz",
-            "integrity": "sha512-8QA7wrYSHKaYgUxDA5ZC24w+eHm3sYCbp0EzcDwKqN3p6HqtTCGR/GVsPyZW92unff4UlcSh++lmqDWN3ZIq4w==",
+            "version": "0.14.8",
+            "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.8.tgz",
+            "integrity": "sha512-Uuqnk9YE9SsWeReYqK2alDI5YzciATE0r2SkA6iMAtuXvNTMNACJLJEXNXaEy94ECuBe4Sk6RzRU80kjdbIo1Q==",
             "hasInstallScript": true,
             "bin": {
                 "vue-demi-fix": "bin/vue-demi-fix.js",
@@ -2934,9 +2957,9 @@
             }
         },
         "node_modules/autoprefixer": {
-            "version": "10.4.17",
-            "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.17.tgz",
-            "integrity": "sha512-/cpVNRLSfhOtcGflT13P2794gVSgmPgTR+erw5ifnMLZb0UnSlkK4tquLmkd3BhA+nLo5tX8Cu0upUsGKvKbmg==",
+            "version": "10.4.19",
+            "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.19.tgz",
+            "integrity": "sha512-BaENR2+zBZ8xXhM4pUaKUxlVdxZ0EZhjvbopwnXmxRUfqDmwSpC2lAi/QXvx7NRdPCo1WKEcEF6mV64si1z4Ew==",
             "funding": [
                 {
                     "type": "opencollective",
@@ -2952,8 +2975,8 @@
                 }
             ],
             "dependencies": {
-                "browserslist": "^4.22.2",
-                "caniuse-lite": "^1.0.30001578",
+                "browserslist": "^4.23.0",
+                "caniuse-lite": "^1.0.30001599",
                 "fraction.js": "^4.3.7",
                 "normalize-range": "^0.1.2",
                 "picocolors": "^1.0.0",
@@ -2970,11 +2993,11 @@
             }
         },
         "node_modules/axios": {
-            "version": "1.6.7",
-            "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.7.tgz",
-            "integrity": "sha512-/hDJGff6/c7u0hDkvkGxR/oy6CbCs8ziCsC7SqmhjfozqiJGc8Z11wrv9z9lYfY4K8l+H9TpjcMDX0xOZmx+RA==",
+            "version": "1.7.2",
+            "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.2.tgz",
+            "integrity": "sha512-2A8QhOMrbomlDuiLeK9XibIBzuHeRcqqNOHp0Cyp5EoJ1IFDh+XZH3A6BkXtv0K4gFGCI0Y4BM7B1wOEi0Rmgw==",
             "dependencies": {
-                "follow-redirects": "^1.15.4",
+                "follow-redirects": "^1.15.6",
                 "form-data": "^4.0.0",
                 "proxy-from-env": "^1.1.0"
             }
@@ -3268,9 +3291,9 @@
             }
         },
         "node_modules/browserslist": {
-            "version": "4.22.3",
-            "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.3.tgz",
-            "integrity": "sha512-UAp55yfwNv0klWNapjs/ktHoguxuQNGnOzxYmfnXIS+8AsRDZkSDxg7R1AX3GKzn078SBI5dzwzj/Yx0Or0e3A==",
+            "version": "4.23.1",
+            "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.23.1.tgz",
+            "integrity": "sha512-TUfofFo/KsK/bWZ9TWQ5O26tsWW4Uhmt8IYklbnUa70udB6P2wA7w7o4PY4muaEPBQaAX+CEnmmIA41NVHtPVw==",
             "funding": [
                 {
                     "type": "opencollective",
@@ -3286,10 +3309,10 @@
                 }
             ],
             "dependencies": {
-                "caniuse-lite": "^1.0.30001580",
-                "electron-to-chromium": "^1.4.648",
+                "caniuse-lite": "^1.0.30001629",
+                "electron-to-chromium": "^1.4.796",
                 "node-releases": "^2.0.14",
-                "update-browserslist-db": "^1.0.13"
+                "update-browserslist-db": "^1.0.16"
             },
             "bin": {
                 "browserslist": "cli.js"
@@ -3446,9 +3469,9 @@
             }
         },
         "node_modules/caniuse-lite": {
-            "version": "1.0.30001581",
-            "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001581.tgz",
-            "integrity": "sha512-whlTkwhqV2tUmP3oYhtNfaWGYHDdS3JYFQBKXxcUR9qqPWsRhFHhoISO2Xnl/g0xyKzht9mI1LZpiNWfMzHixQ==",
+            "version": "1.0.30001636",
+            "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001636.tgz",
+            "integrity": "sha512-bMg2vmr8XBsbL6Lr0UHXy/21m84FTxDLWn2FSqMd5PrlbMxwJlQnC2YWYxVgp66PZE+BBNF2jYQUBKCo1FDeZg==",
             "funding": [
                 {
                     "type": "opencollective",
@@ -3635,7 +3658,8 @@
         "node_modules/computeds": {
             "version": "0.0.1",
             "resolved": "https://registry.npmjs.org/computeds/-/computeds-0.0.1.tgz",
-            "integrity": "sha512-7CEBgcMjVmitjYo5q8JTJVra6X5mQ20uTThdK+0kR7UEaDrAWEQcRiBtWJzga4eRpP6afNwwLsX2SET2JhVB1Q=="
+            "integrity": "sha512-7CEBgcMjVmitjYo5q8JTJVra6X5mQ20uTThdK+0kR7UEaDrAWEQcRiBtWJzga4eRpP6afNwwLsX2SET2JhVB1Q==",
+            "license": "MIT"
         },
         "node_modules/concat-map": {
             "version": "0.0.1",
@@ -3873,7 +3897,8 @@
         "node_modules/csstype": {
             "version": "3.1.3",
             "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
-            "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
+            "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
+            "license": "MIT"
         },
         "node_modules/data-uri-to-buffer": {
             "version": "6.0.1",
@@ -3900,7 +3925,8 @@
         "node_modules/de-indent": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
-            "integrity": "sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg=="
+            "integrity": "sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==",
+            "license": "MIT"
         },
         "node_modules/debug": {
             "version": "4.3.4",
@@ -4143,9 +4169,9 @@
             "dev": true
         },
         "node_modules/electron-to-chromium": {
-            "version": "1.4.648",
-            "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.648.tgz",
-            "integrity": "sha512-EmFMarXeqJp9cUKu/QEciEApn0S/xRcpZWuAm32U7NgoZCimjsilKXHRO9saeEW55eHZagIDg6XTUOv32w9pjg=="
+            "version": "1.4.806",
+            "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.806.tgz",
+            "integrity": "sha512-nkoEX2QIB8kwCOtvtgwhXWy2IHVcOLQZu9Qo36uaGB835mdX/h8uLRlosL6QIhLVUnAiicXRW00PwaPZC74Nrg=="
         },
         "node_modules/emoji-regex": {
             "version": "8.0.0",
@@ -4344,9 +4370,9 @@
             }
         },
         "node_modules/escalade": {
-            "version": "3.1.1",
-            "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz",
-            "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
+            "version": "3.1.2",
+            "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
+            "integrity": "sha512-ErCHMCae19vR8vQGe50xIsVomy19rg6gFu3+r3jkEO46suLMWBksvVyoGgQV+jOfl84ZSOSlmv6Gxa89PmTGmA==",
             "engines": {
                 "node": ">=6"
             }
@@ -4442,29 +4468,30 @@
             }
         },
         "node_modules/eslint-plugin-vue": {
-            "version": "9.20.1",
-            "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.20.1.tgz",
-            "integrity": "sha512-GyCs8K3lkEvoyC1VV97GJhP1SvqsKCiWGHnbn0gVUYiUhaH2+nB+Dv1uekv1THFMPbBfYxukrzQdltw950k+LQ==",
+            "version": "9.27.0",
+            "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.27.0.tgz",
+            "integrity": "sha512-5Dw3yxEyuBSXTzT5/Ge1X5kIkRTQ3nvBn/VwPwInNiZBSJOO/timWMUaflONnFBzU6NhB68lxnCda7ULV5N7LA==",
             "dependencies": {
                 "@eslint-community/eslint-utils": "^4.4.0",
+                "globals": "^13.24.0",
                 "natural-compare": "^1.4.0",
                 "nth-check": "^2.1.1",
-                "postcss-selector-parser": "^6.0.13",
-                "semver": "^7.5.4",
-                "vue-eslint-parser": "^9.4.0",
+                "postcss-selector-parser": "^6.0.15",
+                "semver": "^7.6.0",
+                "vue-eslint-parser": "^9.4.3",
                 "xml-name-validator": "^4.0.0"
             },
             "engines": {
                 "node": "^14.17.0 || >=16.0.0"
             },
             "peerDependencies": {
-                "eslint": "^6.2.0 || ^7.0.0 || ^8.0.0"
+                "eslint": "^6.2.0 || ^7.0.0 || ^8.0.0 || ^9.0.0"
             }
         },
         "node_modules/eslint-plugin-vue/node_modules/postcss-selector-parser": {
-            "version": "6.0.13",
-            "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz",
-            "integrity": "sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==",
+            "version": "6.1.0",
+            "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.0.tgz",
+            "integrity": "sha512-UMz42UD0UY0EApS0ZL9o1XnLhSTtvvvLe5Dc2H2O56fvRZi+KulDyf5ctDhhtYJBGKStV2FL1fy6253cmLgqVQ==",
             "dependencies": {
                 "cssesc": "^3.0.0",
                 "util-deprecate": "^1.0.2"
@@ -4583,7 +4610,8 @@
         "node_modules/estree-walker": {
             "version": "2.0.2",
             "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz",
-            "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="
+            "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
+            "license": "MIT"
         },
         "node_modules/esutils": {
             "version": "2.0.3",
@@ -4757,9 +4785,9 @@
             }
         },
         "node_modules/follow-redirects": {
-            "version": "1.15.5",
-            "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.5.tgz",
-            "integrity": "sha512-vSFWUON1B+yAw1VN4xMfxgn5fTUiaOzAJCKBwIIgT/+7CuGy9+r+5gITvP62j3RmaD5Ph65UaERdOSRGUzZtgw==",
+            "version": "1.15.6",
+            "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
+            "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
             "funding": [
                 {
                     "type": "individual",
@@ -5086,14 +5114,16 @@
             "version": "1.2.0",
             "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
             "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
+            "license": "MIT",
             "bin": {
                 "he": "bin/he"
             }
         },
         "node_modules/highlight.js": {
-            "version": "11.9.0",
-            "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.9.0.tgz",
-            "integrity": "sha512-fJ7cW7fQGCYAkgv4CPfwFHrfd/cLS4Hau96JuJ+ZTOWhjnhoeN1ub1tFmALm/+lW5z4WCAuAV9bm05AP0mS6Gw==",
+            "version": "11.10.0",
+            "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.10.0.tgz",
+            "integrity": "sha512-SYVnVFswQER+zu1laSya563s+F8VDGt7o35d4utbamowvUNLLMovFqwCLSocpZTz3MgaSRA1IbqRWZv97dtErQ==",
+            "license": "BSD-3-Clause",
             "engines": {
                 "node": ">=12.0.0"
             }
@@ -6125,14 +6155,11 @@
             }
         },
         "node_modules/magic-string": {
-            "version": "0.30.5",
-            "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.5.tgz",
-            "integrity": "sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==",
+            "version": "0.30.10",
+            "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.10.tgz",
+            "integrity": "sha512-iIRwTIf0QKV3UAnYK4PU8uiEc4SRh5jX0mwpIwETPpHdhVM4f53RSwS/vXvN1JhGX+Cs7B8qIq3d6AH49O5fAQ==",
             "dependencies": {
                 "@jridgewell/sourcemap-codec": "^1.4.15"
-            },
-            "engines": {
-                "node": ">=12"
             }
         },
         "node_modules/magic-string/node_modules/@jridgewell/sourcemap-codec": {
@@ -6292,9 +6319,10 @@
             "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
         },
         "node_modules/muggle-string": {
-            "version": "0.3.1",
-            "resolved": "https://registry.npmjs.org/muggle-string/-/muggle-string-0.3.1.tgz",
-            "integrity": "sha512-ckmWDJjphvd/FvZawgygcUeQCxzvohjFO5RxTjj4eq8kw359gFF3E1brjfI+viLMxss5JrHTDRHZvu2/tuy0Qg=="
+            "version": "0.4.1",
+            "resolved": "https://registry.npmjs.org/muggle-string/-/muggle-string-0.4.1.tgz",
+            "integrity": "sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==",
+            "license": "MIT"
         },
         "node_modules/mz": {
             "version": "2.7.0",
@@ -6689,7 +6717,8 @@
         "node_modules/path-browserify": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-1.0.1.tgz",
-            "integrity": "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g=="
+            "integrity": "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==",
+            "license": "MIT"
         },
         "node_modules/path-exists": {
             "version": "4.0.0",
@@ -6770,9 +6799,9 @@
             "dev": true
         },
         "node_modules/picocolors": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
-            "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ=="
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.1.tgz",
+            "integrity": "sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew=="
         },
         "node_modules/picomatch": {
             "version": "2.3.1",
@@ -6899,9 +6928,9 @@
             }
         },
         "node_modules/postcss": {
-            "version": "8.4.33",
-            "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.33.tgz",
-            "integrity": "sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==",
+            "version": "8.4.41",
+            "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.41.tgz",
+            "integrity": "sha512-TesUflQ0WKZqAvg52PWL6kHgLKP6xB6heTOdoYM0Wt2UHyxNa4K25EZZMgKns3BH1RLVbZCREPpLY0rhnNoHVQ==",
             "funding": [
                 {
                     "type": "opencollective",
@@ -6916,10 +6945,11 @@
                     "url": "https://github.com/sponsors/ai"
                 }
             ],
+            "license": "MIT",
             "dependencies": {
                 "nanoid": "^3.3.7",
-                "picocolors": "^1.0.0",
-                "source-map-js": "^1.0.2"
+                "picocolors": "^1.0.1",
+                "source-map-js": "^1.2.0"
             },
             "engines": {
                 "node": "^10 || ^12 || >=14"
@@ -7043,9 +7073,9 @@
             }
         },
         "node_modules/prettier": {
-            "version": "3.2.4",
-            "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.2.4.tgz",
-            "integrity": "sha512-FWu1oLHKCrtpO1ypU6J0SbK2d9Ckwysq6bHj/uaCP26DxrPpppCLQRGVuqAxSTvhF00AcvDRyYrLNW7ocBhFFQ==",
+            "version": "3.3.2",
+            "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.2.tgz",
+            "integrity": "sha512-rAVeHYMcv8ATV5d508CFdn+8/pHPpXeIid1DdrPwXnaAdH7cqjVbpJaT5eq4yRAFU/lsbwYwSF/n5iNrdJHPQA==",
             "dev": true,
             "bin": {
                 "prettier": "bin/prettier.cjs"
@@ -7093,10 +7123,11 @@
             }
         },
         "node_modules/prettier-plugin-tailwindcss": {
-            "version": "0.5.11",
-            "resolved": "https://registry.npmjs.org/prettier-plugin-tailwindcss/-/prettier-plugin-tailwindcss-0.5.11.tgz",
-            "integrity": "sha512-AvI/DNyMctyyxGOjyePgi/gqj5hJYClZ1avtQvLlqMT3uDZkRbi4HhGUpok3DRzv9z7Lti85Kdj3s3/1CeNI0w==",
+            "version": "0.6.5",
+            "resolved": "https://registry.npmjs.org/prettier-plugin-tailwindcss/-/prettier-plugin-tailwindcss-0.6.5.tgz",
+            "integrity": "sha512-axfeOArc/RiGHjOIy9HytehlC0ZLeMaqY09mm8YCkMzznKiDkwFzOpBvtuhuv3xG5qB73+Mj7OCe2j/L1ryfuQ==",
             "dev": true,
+            "license": "MIT",
             "engines": {
                 "node": ">=14.21.3"
             },
@@ -7105,6 +7136,7 @@
                 "@prettier/plugin-pug": "*",
                 "@shopify/prettier-plugin-liquid": "*",
                 "@trivago/prettier-plugin-sort-imports": "*",
+                "@zackad/prettier-plugin-twig-melody": "*",
                 "prettier": "^3.0",
                 "prettier-plugin-astro": "*",
                 "prettier-plugin-css-order": "*",
@@ -7113,6 +7145,7 @@
                 "prettier-plugin-marko": "*",
                 "prettier-plugin-organize-attributes": "*",
                 "prettier-plugin-organize-imports": "*",
+                "prettier-plugin-sort-imports": "*",
                 "prettier-plugin-style-order": "*",
                 "prettier-plugin-svelte": "*"
             },
@@ -7129,6 +7162,9 @@
                 "@trivago/prettier-plugin-sort-imports": {
                     "optional": true
                 },
+                "@zackad/prettier-plugin-twig-melody": {
+                    "optional": true
+                },
                 "prettier-plugin-astro": {
                     "optional": true
                 },
@@ -7150,13 +7186,13 @@
                 "prettier-plugin-organize-imports": {
                     "optional": true
                 },
-                "prettier-plugin-style-order": {
+                "prettier-plugin-sort-imports": {
                     "optional": true
                 },
-                "prettier-plugin-svelte": {
+                "prettier-plugin-style-order": {
                     "optional": true
                 },
-                "prettier-plugin-twig-melody": {
+                "prettier-plugin-svelte": {
                     "optional": true
                 }
             }
@@ -7779,12 +7815,9 @@
             }
         },
         "node_modules/semver": {
-            "version": "7.5.4",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-            "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-            "dependencies": {
-                "lru-cache": "^6.0.0"
-            },
+            "version": "7.6.2",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
+            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
             "bin": {
                 "semver": "bin/semver.js"
             },
@@ -7792,26 +7825,10 @@
                 "node": ">=10"
             }
         },
-        "node_modules/semver/node_modules/lru-cache": {
-            "version": "6.0.0",
-            "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-            "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-            "dependencies": {
-                "yallist": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=10"
-            }
-        },
-        "node_modules/semver/node_modules/yallist": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-            "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
-        },
         "node_modules/serialize-javascript": {
-            "version": "6.0.1",
-            "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.1.tgz",
-            "integrity": "sha512-owoXEFjWRllis8/M1Q+Cw5k8ZH40e3zhp/ovX+Xr/vi1qj6QesbyXXViFbpNvWvPNAD62SutwEXavefrLJWj7w==",
+            "version": "6.0.2",
+            "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz",
+            "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==",
             "peer": true,
             "dependencies": {
                 "randombytes": "^2.1.0"
@@ -8063,9 +8080,9 @@
             }
         },
         "node_modules/source-map-js": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
-            "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
+            "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
             "engines": {
                 "node": ">=0.10.0"
             }
@@ -8346,9 +8363,9 @@
             }
         },
         "node_modules/tailwindcss": {
-            "version": "3.4.1",
-            "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.1.tgz",
-            "integrity": "sha512-qAYmXRfk3ENzuPBakNK0SRrUDipP8NQnEY6772uDhflcQz5EhRdD7JNZxyrFHVQNCwULPBn6FNPp9brpO7ctcA==",
+            "version": "3.4.4",
+            "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.4.tgz",
+            "integrity": "sha512-ZoyXOdJjISB7/BcLTR6SEsLgKtDStYyYZVLsUtWChO4Ps20CBad7lfJKVDiejocV4ME1hLmyY0WJE3hSDcmQ2A==",
             "dependencies": {
                 "@alloc/quick-lru": "^5.2.0",
                 "arg": "^5.0.2",
@@ -8358,7 +8375,7 @@
                 "fast-glob": "^3.3.0",
                 "glob-parent": "^6.0.2",
                 "is-glob": "^4.0.3",
-                "jiti": "^1.19.1",
+                "jiti": "^1.21.0",
                 "lilconfig": "^2.1.0",
                 "micromatch": "^4.0.5",
                 "normalize-path": "^3.0.0",
@@ -8448,9 +8465,9 @@
             }
         },
         "node_modules/terser": {
-            "version": "5.24.0",
-            "resolved": "https://registry.npmjs.org/terser/-/terser-5.24.0.tgz",
-            "integrity": "sha512-ZpGR4Hy3+wBEzVEnHvstMvqpD/nABNelQn/z2r0fjVWGQsN3bpOLzQlqDxmb4CDZnXq5lpjnQ+mHQLAOpfM5iw==",
+            "version": "5.27.1",
+            "resolved": "https://registry.npmjs.org/terser/-/terser-5.27.1.tgz",
+            "integrity": "sha512-29wAr6UU/oQpnTw5HoadwjUZnFQXGdOfj0LjZ4sVxzqwHh/QVkvr7m8y9WoR4iN3FRitVduTc6KdjcW38Npsug==",
             "peer": true,
             "dependencies": {
                 "@jridgewell/source-map": "^0.3.3",
@@ -8466,16 +8483,16 @@
             }
         },
         "node_modules/terser-webpack-plugin": {
-            "version": "5.3.9",
-            "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.3.9.tgz",
-            "integrity": "sha512-ZuXsqE07EcggTWQjXUj+Aot/OMcD0bMKGgF63f7UxYcu5/AJF53aIpK1YoP5xR9l6s/Hy2b+t1AM0bLNPRuhwA==",
+            "version": "5.3.10",
+            "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.3.10.tgz",
+            "integrity": "sha512-BKFPWlPDndPs+NGGCr1U59t0XScL5317Y0UReNrHaw9/FwhPENlq6bfgs+4yPfyP51vqC1bQ4rp1EfXW5ZSH9w==",
             "peer": true,
             "dependencies": {
-                "@jridgewell/trace-mapping": "^0.3.17",
+                "@jridgewell/trace-mapping": "^0.3.20",
                 "jest-worker": "^27.4.5",
                 "schema-utils": "^3.1.1",
                 "serialize-javascript": "^6.0.1",
-                "terser": "^5.16.8"
+                "terser": "^5.26.0"
             },
             "engines": {
                 "node": ">= 10.13.0"
@@ -8582,6 +8599,15 @@
                 "@popperjs/core": "^2.9.0"
             }
         },
+        "node_modules/to-fast-properties": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
+            "integrity": "sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==",
+            "license": "MIT",
+            "engines": {
+                "node": ">=4"
+            }
+        },
         "node_modules/to-regex-range": {
             "version": "5.0.1",
             "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
@@ -8718,9 +8744,9 @@
             }
         },
         "node_modules/typescript": {
-            "version": "5.3.3",
-            "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.3.tgz",
-            "integrity": "sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==",
+            "version": "5.5.3",
+            "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.5.3.tgz",
+            "integrity": "sha512-/hreyEujaB0w76zKo6717l3L0o/qEUtRgdvUBvlkhoWeOVMjMuHNHk0BRBzikzuGDqNmPQbg5ifMEqsHLiIUcQ==",
             "bin": {
                 "tsc": "bin/tsc",
                 "tsserver": "bin/tsserver"
@@ -8787,9 +8813,9 @@
             }
         },
         "node_modules/update-browserslist-db": {
-            "version": "1.0.13",
-            "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz",
-            "integrity": "sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==",
+            "version": "1.0.16",
+            "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.16.tgz",
+            "integrity": "sha512-KVbTxlBYlckhF5wgfyZXTWnMn7MMZjMu9XG8bPlliUOP9ThaF4QnhP8qrjrH7DRzHfSk0oQv1wToW+iA5GajEQ==",
             "funding": [
                 {
                     "type": "opencollective",
@@ -8805,8 +8831,8 @@
                 }
             ],
             "dependencies": {
-                "escalade": "^3.1.1",
-                "picocolors": "^1.0.0"
+                "escalade": "^3.1.2",
+                "picocolors": "^1.0.1"
             },
             "bin": {
                 "update-browserslist-db": "cli.js"
@@ -8964,9 +8990,9 @@
             }
         },
         "node_modules/vite-plugin-css-injected-by-js": {
-            "version": "3.3.1",
-            "resolved": "https://registry.npmjs.org/vite-plugin-css-injected-by-js/-/vite-plugin-css-injected-by-js-3.3.1.tgz",
-            "integrity": "sha512-PjM/X45DR3/V1K1fTRs8HtZHEQ55kIfdrn+dzaqNBFrOYO073SeSNCxp4j7gSYhV9NffVHaEnOL4myoko0ePAg==",
+            "version": "3.5.1",
+            "resolved": "https://registry.npmjs.org/vite-plugin-css-injected-by-js/-/vite-plugin-css-injected-by-js-3.5.1.tgz",
+            "integrity": "sha512-9ioqwDuEBxW55gNoWFEDhfLTrVKXEEZgl5adhWmmqa88EQGKfTmexy4v1Rh0pAS6RhKQs2bUYQArprB32JpUZQ==",
             "peerDependencies": {
                 "vite": ">2.0.0-0"
             }
@@ -9056,16 +9082,23 @@
                 }
             }
         },
+        "node_modules/vscode-uri": {
+            "version": "3.0.8",
+            "resolved": "https://registry.npmjs.org/vscode-uri/-/vscode-uri-3.0.8.tgz",
+            "integrity": "sha512-AyFQ0EVmsOZOlAnxoFOGOq1SQDWAB7C6aqMGS23svWAllfOaxbuFvcT8D1i8z3Gyn8fraVeZNNmN6e9bxxXkKw==",
+            "license": "MIT"
+        },
         "node_modules/vue": {
-            "version": "3.4.15",
-            "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.15.tgz",
-            "integrity": "sha512-jC0GH4KkWLWJOEQjOpkqU1bQsBwf4R1rsFtw5GQJbjHVKWDzO6P0nWWBTmjp1xSemAioDFj1jdaK1qa3DnMQoQ==",
+            "version": "3.4.38",
+            "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.38.tgz",
+            "integrity": "sha512-f0ZgN+mZ5KFgVv9wz0f4OgVKukoXtS3nwET4c2vLBGQR50aI8G0cqbFtLlX9Yiyg3LFGBitruPHt2PxwTduJEw==",
+            "license": "MIT",
             "dependencies": {
-                "@vue/compiler-dom": "3.4.15",
-                "@vue/compiler-sfc": "3.4.15",
-                "@vue/runtime-dom": "3.4.15",
-                "@vue/server-renderer": "3.4.15",
-                "@vue/shared": "3.4.15"
+                "@vue/compiler-dom": "3.4.38",
+                "@vue/compiler-sfc": "3.4.38",
+                "@vue/runtime-dom": "3.4.38",
+                "@vue/server-renderer": "3.4.38",
+                "@vue/shared": "3.4.38"
             },
             "peerDependencies": {
                 "typescript": "*"
@@ -9077,15 +9110,15 @@
             }
         },
         "node_modules/vue-component-type-helpers": {
-            "version": "1.8.22",
-            "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-1.8.22.tgz",
-            "integrity": "sha512-LK3wJHs3vJxHG292C8cnsRusgyC5SEZDCzDCD01mdE/AoREFMl2tzLRuzwyuEsOIz13tqgBcnvysN3Lxsa14Fw==",
+            "version": "2.0.21",
+            "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-2.0.21.tgz",
+            "integrity": "sha512-3NaicyZ7N4B6cft4bfb7dOnPbE9CjLcx+6wZWAg5zwszfO4qXRh+U52dN5r5ZZfc6iMaxKCEcoH9CmxxoFZHLg==",
             "dev": true
         },
         "node_modules/vue-eslint-parser": {
-            "version": "9.4.2",
-            "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.4.2.tgz",
-            "integrity": "sha512-Ry9oiGmCAK91HrKMtCrKFWmSFWvYkpGglCeFAIqDdr9zdXmMMpJOmUJS7WWsW7fX81h6mwHmUZCQQ1E0PkSwYQ==",
+            "version": "9.4.3",
+            "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.4.3.tgz",
+            "integrity": "sha512-2rYRLWlIpaiN8xbPiDyXZXRgLGOtWxERV7ND5fFAv5qo1D2N9Fu9MNajBNc6o13lZ+24DAWCkQCvj4klgmcITg==",
             "dependencies": {
                 "debug": "^4.3.4",
                 "eslint-scope": "^7.1.1",
@@ -9106,12 +9139,12 @@
             }
         },
         "node_modules/vue-i18n": {
-            "version": "9.9.0",
-            "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.9.0.tgz",
-            "integrity": "sha512-xQ5SxszUAqK5n84N+uUyHH/PiQl9xZ24FOxyAaNonmOQgXeN+rD9z/6DStOpOxNFQn4Cgcquot05gZc+CdOujA==",
+            "version": "9.13.1",
+            "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.13.1.tgz",
+            "integrity": "sha512-mh0GIxx0wPtPlcB1q4k277y0iKgo25xmDPWioVVYanjPufDBpvu5ySTjP5wOrSvlYQ2m1xI+CFhGdauv/61uQg==",
             "dependencies": {
-                "@intlify/core-base": "9.9.0",
-                "@intlify/shared": "9.9.0",
+                "@intlify/core-base": "9.13.1",
+                "@intlify/shared": "9.13.1",
                 "@vue/devtools-api": "^6.5.0"
             },
             "engines": {
@@ -9136,25 +9169,27 @@
             "version": "2.7.16",
             "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.16.tgz",
             "integrity": "sha512-AYbUWAJHLGGQM7+cNTELw+KsOG9nl2CnSv467WobS5Cv9uk3wFcnr1Etsz2sEIHEZvw1U+o9mRlEO6QbZvUPGQ==",
+            "license": "MIT",
             "dependencies": {
                 "de-indent": "^1.0.2",
                 "he": "^1.2.0"
             }
         },
         "node_modules/vue-tsc": {
-            "version": "1.8.27",
-            "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-1.8.27.tgz",
-            "integrity": "sha512-WesKCAZCRAbmmhuGl3+VrdWItEvfoFIPXOvUJkjULi+x+6G/Dy69yO3TBRJDr9eUlmsNAwVmxsNZxvHKzbkKdg==",
+            "version": "2.0.26",
+            "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-2.0.26.tgz",
+            "integrity": "sha512-tOhuwy2bIXbMhz82ef37qeiaQHMXKQkD6mOF6CCPl3/uYtST3l6fdNyfMxipudrQTxTfXVPlgJdMENBFfC1CfQ==",
+            "license": "MIT",
             "dependencies": {
-                "@volar/typescript": "~1.11.1",
-                "@vue/language-core": "1.8.27",
+                "@volar/typescript": "~2.4.0-alpha.15",
+                "@vue/language-core": "2.0.26",
                 "semver": "^7.5.4"
             },
             "bin": {
                 "vue-tsc": "bin/vue-tsc.js"
             },
             "peerDependencies": {
-                "typescript": "*"
+                "typescript": ">=5.0.0"
             }
         },
         "node_modules/vue3-smooth-dnd": {
@@ -9217,19 +9252,19 @@
             }
         },
         "node_modules/webpack": {
-            "version": "5.89.0",
-            "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.89.0.tgz",
-            "integrity": "sha512-qyfIC10pOr70V+jkmud8tMfajraGCZMBWJtrmuBymQKCrLTRejBI8STDp1MCyZu/QTdZSeacCQYpYNQVOzX5kw==",
+            "version": "5.90.2",
+            "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.90.2.tgz",
+            "integrity": "sha512-ziXu8ABGr0InCMEYFnHrYweinHK2PWrMqnwdHk2oK3rRhv/1B+2FnfwYv5oD+RrknK/Pp/Hmyvu+eAsaMYhzCw==",
             "peer": true,
             "dependencies": {
                 "@types/eslint-scope": "^3.7.3",
-                "@types/estree": "^1.0.0",
+                "@types/estree": "^1.0.5",
                 "@webassemblyjs/ast": "^1.11.5",
                 "@webassemblyjs/wasm-edit": "^1.11.5",
                 "@webassemblyjs/wasm-parser": "^1.11.5",
                 "acorn": "^8.7.1",
                 "acorn-import-assertions": "^1.9.0",
-                "browserslist": "^4.14.5",
+                "browserslist": "^4.21.10",
                 "chrome-trace-event": "^1.0.2",
                 "enhanced-resolve": "^5.15.0",
                 "es-module-lexer": "^1.2.1",
@@ -9243,7 +9278,7 @@
                 "neo-async": "^2.6.2",
                 "schema-utils": "^3.2.0",
                 "tapable": "^2.1.1",
-                "terser-webpack-plugin": "^5.3.7",
+                "terser-webpack-plugin": "^5.3.10",
                 "watchpack": "^2.4.0",
                 "webpack-sources": "^3.2.3"
             },
@@ -9551,9 +9586,9 @@
             }
         },
         "node_modules/yup": {
-            "version": "1.3.3",
-            "resolved": "https://registry.npmjs.org/yup/-/yup-1.3.3.tgz",
-            "integrity": "sha512-v8QwZSsHH2K3/G9WSkp6mZKO+hugKT1EmnMqLNUcfu51HU9MDyhlETT/JgtzprnrnQHPWsjc6MUDMBp/l9fNnw==",
+            "version": "1.4.0",
+            "resolved": "https://registry.npmjs.org/yup/-/yup-1.4.0.tgz",
+            "integrity": "sha512-wPbgkJRCqIf+OHyiTBQoJiP5PFuAXaWiJK6AmYkzQAh5/c2K9hzSApBZG5wV9KoKSePF7sAxmNSvh/13YHkFDg==",
             "dependencies": {
                 "property-expr": "^2.0.5",
                 "tiny-case": "^1.0.3",
diff --git a/package.json b/package.json
index abf866c6..d13b71db 100644
--- a/package.json
+++ b/package.json
@@ -20,59 +20,58 @@
     "devDependencies": {
         "@pinia/testing": "^0.1.3",
         "@vitest/coverage-c8": "^0.33.0",
-        "@vue/test-utils": "^2.4.4",
+        "@vue/test-utils": "^2.4.6",
         "browser-sync": "^2.29.3",
         "jsdom": "^23.0.0",
-        "prettier": "^3.2.4",
+        "prettier": "^3.3.2",
         "prettier-eslint": "^16.3.0",
-        "prettier-plugin-tailwindcss": "^0.5.11",
+        "prettier-plugin-tailwindcss": "^0.6.5",
         "puppeteer": "^21.9.0",
         "tailwind-config-viewer": "^1.7.3",
         "vite": "^4.5.0",
         "vitest": "^0.34.6"
     },
     "dependencies": {
-        "@deck9/ui": "^0.14.6",
-        "@headlessui/vue": "^1.7.17",
+        "@deck9/ui": "^0.14.10",
+        "@headlessui/vue": "^1.7.22",
         "@highlightjs/vue-plugin": "^2.1.0",
         "@inertiajs/inertia": "^0.11.1",
         "@inertiajs/inertia-vue3": "^0.6.0",
         "@inertiajs/progress": "^0.2.7",
         "@pinia/plugin-debounce": "^0.1.0",
         "@tailwindcss/forms": "^0.5.7",
-        "@tailwindcss/typography": "^0.5.10",
+        "@tailwindcss/typography": "^0.5.13",
         "@tiptap/extension-link": "^2.0.0-beta.36",
         "@tiptap/starter-kit": "^2.0.0-beta.181",
         "@tiptap/vue-3": "^2.0.0-beta.90",
-        "@types/lodash": "^4.14.202",
-        "@types/node": "^20.11.10",
-        "@types/ziggy-js": "^1.8.0",
+        "@types/lodash": "^4.17.6",
+        "@types/node": "^20.14.10",
         "@typescript-eslint/eslint-plugin": "^6.19.1",
         "@typescript-eslint/parser": "^6.19.1",
         "@vitejs/plugin-vue": "^4.5.0",
         "@vitest/coverage-v8": "^0.34.6",
-        "@vueuse/core": "^10.7.2",
-        "autoprefixer": "^10.4.17",
-        "axios": "^1.6.7",
+        "@vueuse/core": "^10.11.0",
+        "autoprefixer": "^10.4.19",
+        "axios": "^1.7.2",
         "copy-text-to-clipboard": "^3.2.0",
         "eslint": "^8.56.0",
-        "eslint-plugin-vue": "^9.20.1",
+        "eslint-plugin-vue": "^9.27.0",
         "floating-vue": "^2.0.0-beta.20",
-        "highlight.js": "^11.9.0",
+        "highlight.js": "^11.10.0",
         "laravel-vite-plugin": "^0.8.1",
         "lodash": "^4.17.19",
         "pinia": "^2.1.7",
-        "postcss": "^8.4.33",
+        "postcss": "^8.4.39",
         "postcss-import": "^15.1.0",
         "striptags": "^3.2.0",
-        "tailwindcss": "^3.4.1",
-        "typescript": "^5.3.3",
-        "vite-plugin-css-injected-by-js": "^3.3.1",
-        "vue": "^3.4.15",
-        "vue-i18n": "^9.9.0",
-        "vue-tsc": "^1.8.27",
+        "tailwindcss": "^3.4.4",
+        "typescript": "^5.5.3",
+        "vite-plugin-css-injected-by-js": "^3.5.1",
+        "vue": "^3.4.38",
+        "vue-i18n": "^9.13.1",
+        "vue-tsc": "^2.0.26",
         "vue3-smooth-dnd": "^0.0.6",
-        "yup": "^1.3.3",
+        "yup": "^1.4.0",
         "ziggy-js": "^1.8.1"
     }
 }
diff --git a/resources/js/api/conversation.ts b/resources/js/api/conversation.ts
index 8e1772e2..4fc79934 100644
--- a/resources/js/api/conversation.ts
+++ b/resources/js/api/conversation.ts
@@ -1,10 +1,10 @@
 /* eslint-disable no-async-promise-executor */
-import { AxiosResponse } from "axios";
+import { AxiosProgressEvent, AxiosResponse } from "axios";
 import handler from "./handler";
 import { useRoutes } from "@/utils/useRoutes";
 
 export function callGetForm(
-    uuid: string
+    uuid: string,
 ): Promise<AxiosResponse<PublicFormModel>> {
     return new Promise(async (resolve, reject) => {
         try {
@@ -27,7 +27,7 @@ export function callGetForm(
 }
 
 export function callGetFormStoryboard(
-    uuid: string
+    uuid: string,
 ): Promise<AxiosResponse<FormStoryboard>> {
     return new Promise(async (resolve, reject) => {
         try {
@@ -51,7 +51,7 @@ export function callGetFormStoryboard(
 
 export function callCreateFormSession(
     uuid: string,
-    params: Record<string, string>
+    params: Record<string, string>,
 ): Promise<AxiosResponse<FormSessionModel>> {
     return new Promise(async (resolve, reject) => {
         try {
@@ -78,7 +78,8 @@ export function callCreateFormSession(
 export function callSubmitForm(
     uuid: string,
     token: string,
-    payload: FormSubmitPayload
+    payload: FormSubmitPayload | null,
+    is_uploading: boolean = false,
 ): Promise<AxiosResponse<null>> {
     return new Promise(async (resolve, reject) => {
         try {
@@ -92,6 +93,7 @@ export function callSubmitForm(
                 const response = await handler.post(resolvedRoute, {
                     token,
                     payload,
+                    is_uploading,
                 });
                 resolve(response as AxiosResponse<null>);
             } else {
@@ -102,3 +104,51 @@ export function callSubmitForm(
         }
     });
 }
+
+export async function callUploadFiles(
+    uuid: string,
+    token: string,
+    payload: FormSubmitPayload,
+    progressCallback: (file, axiosProgressEvent: AxiosProgressEvent) => void,
+): Promise<AxiosResponse[]> {
+    const { route } = await useRoutes();
+
+    const resolvedRoute = route("api.public.forms.file-upload", {
+        uuid,
+    });
+
+    if (!resolvedRoute) {
+        return Promise.reject("route not found");
+    }
+
+    const requests: Promise<AxiosResponse>[] = [];
+
+    Object.values(payload).forEach((value) => {
+        if (Array.isArray(value)) {
+            return;
+        }
+
+        value.payload.forEach((file: any, index: number) => {
+            const formData = new FormData();
+            formData.append("file", file);
+            formData.append("token", token);
+            formData.append("actionId", value.actionId);
+
+            requests.push(
+                handler.post(resolvedRoute, formData, {
+                    headers: {
+                        "Content-Type": "multipart/form-data",
+                    },
+                    onUploadProgress: (progressEvent) => {
+                        progressCallback(
+                            `${value.actionId}[${index}]`,
+                            progressEvent,
+                        );
+                    },
+                }),
+            );
+        });
+    });
+
+    return await Promise.all(requests);
+}
diff --git a/resources/js/components/AdvancedSettings.vue b/resources/js/components/AdvancedSettings.vue
index 4393ab1f..db5d9cc2 100644
--- a/resources/js/components/AdvancedSettings.vue
+++ b/resources/js/components/AdvancedSettings.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <button class="text-xs text-grey-400" @click="open = !open">
+    <button class="text-xs font-medium text-grey-800" @click="open = !open">
       {{ title }}
       <D9Icon size="xs" :name="open ? 'chevron-down' : 'chevron-right'" />
     </button>
diff --git a/resources/js/components/Factory/Main/BlockInteractions.vue b/resources/js/components/Factory/Main/BlockInteractions.vue
index a6af4573..36828819 100644
--- a/resources/js/components/Factory/Main/BlockInteractions.vue
+++ b/resources/js/components/Factory/Main/BlockInteractions.vue
@@ -8,6 +8,7 @@
     <ConfigureInput v-if="workbench.usesInteractionType === 'input'" />
     <ConfigureRange v-if="workbench.usesInteractionType === 'range'" />
     <ConfigureTextarea v-if="workbench.usesInteractionType === 'textarea'" />
+    <ConfigureFile v-if="workbench.usesInteractionType === 'file'" />
   </div>
 </template>
 
@@ -19,6 +20,7 @@ import ConfigureDate from "./ConfigureDate.vue";
 import ConfigureInput from "./ConfigureInput.vue";
 import ConfigureRange from "./ConfigureRange.vue";
 import ConfigureTextarea from "./ConfigureTextarea.vue";
+import ConfigureFile from "./ConfigureFile.vue";
 
 const workbench = useWorkbench();
 </script>
diff --git a/resources/js/components/Factory/Main/BlockType.vue b/resources/js/components/Factory/Main/BlockType.vue
index 2af6f70e..48e3d2f8 100644
--- a/resources/js/components/Factory/Main/BlockType.vue
+++ b/resources/js/components/Factory/Main/BlockType.vue
@@ -10,7 +10,7 @@
       icon="chevron-right"
     />
 
-    <AdvancedSettings title="Block Settings">
+    <AdvancedSettings title="More Settings">
       <div>
         <D9Label
           label="Identifier"
diff --git a/resources/js/components/Factory/Main/ConfigureFile.vue b/resources/js/components/Factory/Main/ConfigureFile.vue
new file mode 100644
index 00000000..d93df2b5
--- /dev/null
+++ b/resources/js/components/Factory/Main/ConfigureFile.vue
@@ -0,0 +1,106 @@
+<template>
+  <div class="mb-4">
+    <D9Label label="Allowed File Types" />
+    <div v-for="fileType in availableFileTypes" :key="fileType.key">
+      <D9Checkbox
+        :id="'check' + fileType.key"
+        v-model="allowedFileTypes[fileType.key]"
+        :label="fileType.label"
+      />
+    </div>
+  </div>
+
+  <div class="mb-4">
+    <D9Label
+      label="Max Files"
+      :description="`The maximum number of allowed files to upload (max. ${maxFiles})`"
+    />
+    <D9Input
+      :placeholder="`The maximum number of allowed files to upload (max. ${maxFiles})`"
+      type="number"
+      min="1"
+      :max="maxFiles"
+      step="1"
+      block
+      v-model="allowedFiles"
+    />
+  </div>
+
+  <div class="mb-4">
+    <D9Label
+      label="Max Filesize"
+      :description="`The maximum file size in MB (max. ${maxFileSize} MB per file)`"
+    />
+    <D9Input
+      :placeholder="`The maximum file size in MB (max. ${maxFileSize} MB per file)`"
+      type="number"
+      min="1"
+      :max="maxFileSize"
+      step="1"
+      block
+      v-model="allowedFileSize"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { useWorkbench } from "@/stores";
+import { D9Label, D9Checkbox, D9Input } from "@deck9/ui";
+import { watchEffect, Ref, ref, onMounted } from "vue";
+import { useInteractionsUtils } from "../utils/useInteractionsUtils";
+
+const workbench = useWorkbench();
+const { findOrCreate } = useInteractionsUtils();
+
+const maxFiles = 10;
+const maxFileSize = 16;
+
+const availableFileTypes = [
+  { label: "Image", key: "image" },
+  { label: "Audio", key: "audio" },
+  { label: "Video", key: "video" },
+  { label: "Document", key: "text" },
+];
+
+const label: Ref<FormBlockInteractionModel["label"]> = ref("");
+const allowedFileTypes = ref<Record<string, boolean>>({});
+const allowedFiles = ref(1);
+const allowedFileSize = ref(4);
+const interaction = ref(null) as unknown as Ref<FormBlockInteractionModel>;
+
+onMounted(async () => {
+  if (workbench.block?.interactions) {
+    interaction.value = await findOrCreate("file", workbench);
+
+    label.value = interaction.value.label;
+    allowedFileTypes.value =
+      interaction.value.options?.allowedFileTypes &&
+      !Array.isArray(interaction.value.options?.allowedFileTypes)
+        ? interaction.value.options?.allowedFileTypes
+        : {};
+    allowedFiles.value = interaction.value.options?.allowedFiles ?? 1;
+    allowedFileSize.value = interaction.value.options?.allowedFileSize ?? 4;
+  }
+});
+
+watchEffect(() => {
+  if (!interaction.value) {
+    return;
+  }
+
+  workbench.updateInteraction({
+    id: interaction.value.id,
+    label: label.value,
+    options: {
+      allowedFileTypes: {
+        image: allowedFileTypes.value.image,
+        video: allowedFileTypes.value.video,
+        audio: allowedFileTypes.value.audio,
+        text: allowedFileTypes.value.text,
+      },
+      allowedFiles: allowedFiles.value,
+      allowedFileSize: allowedFileSize.value,
+    },
+  });
+});
+</script>
diff --git a/resources/js/components/Factory/Main/ConfigureTextarea.vue b/resources/js/components/Factory/Main/ConfigureTextarea.vue
index 14924497..f91c3d24 100644
--- a/resources/js/components/Factory/Main/ConfigureTextarea.vue
+++ b/resources/js/components/Factory/Main/ConfigureTextarea.vue
@@ -45,9 +45,9 @@ import { useInteractionsUtils } from "../utils/useInteractionsUtils";
 const workbench = useWorkbench();
 const { findOrCreate } = useInteractionsUtils();
 
-const label: Ref<FormBlockInteractionModel["label"]> = ref("");
-const rows = <Ref<number>>ref(5);
-const maxChars = <Ref<number>>ref(500);
+const label = ref<FormBlockInteractionModel["label"]>("");
+const rows = ref<number>(5);
+const maxChars = ref<number>(500);
 const interaction = ref(null) as unknown as Ref<FormBlockInteractionModel>;
 
 onMounted(async () => {
diff --git a/resources/js/components/Factory/Main/Interactions/ClickInteraction.vue b/resources/js/components/Factory/Main/Interactions/ClickInteraction.vue
index b154c529..fe166c1f 100644
--- a/resources/js/components/Factory/Main/Interactions/ClickInteraction.vue
+++ b/resources/js/components/Factory/Main/Interactions/ClickInteraction.vue
@@ -58,7 +58,7 @@ const props = withDefaults(
   }>(),
   {
     showReply: false,
-  }
+  },
 );
 
 const emit = defineEmits<{
@@ -68,11 +68,11 @@ const emit = defineEmits<{
   (e: "onDelete", index: number): void;
 }>();
 
-const labelElement = ref(null) as unknown as Ref<HTMLElement>;
+const labelElement = ref<D9Input | null>(null);
 
 const label: Ref<FormBlockInteractionModel["label"]> = ref(props.item.label);
 const message: Ref<FormBlockInteractionModel["label"]> = ref(
-  props.item.message
+  props.item.message,
 );
 
 watch([label, message], (newValues) => {
@@ -111,7 +111,13 @@ const keyboardCommands = async (event: KeyboardEvent) => {
 };
 
 const focus = () => {
-  labelElement.value.focus();
+  if (labelElement.value) {
+    try {
+      labelElement.value.$el.querySelector("input").focus();
+    } catch (e) {
+      console.error("Could not focus ClickInteraction input", e);
+    }
+  }
 };
 
 defineExpose({
diff --git a/resources/js/components/Factory/Settings/partials/ImageUpload.vue b/resources/js/components/Factory/Settings/partials/ImageUpload.vue
index 1c78ecd5..3241e496 100644
--- a/resources/js/components/Factory/Settings/partials/ImageUpload.vue
+++ b/resources/js/components/Factory/Settings/partials/ImageUpload.vue
@@ -13,18 +13,14 @@
         />
         <div v-else class="text-sm text-grey-600">max 4MB</div>
       </div>
+
       <D9Button
         label="Upload"
-        @click="initUpload"
+        @click="open"
         :is-disabled="isSelecting"
         :is-loading="isSelecting"
       />
-      <input
-        type="file"
-        class="hidden"
-        ref="uploadInput"
-        @change="selectFiles"
-      />
+
       <D9Button
         label="Remove"
         color="dark"
@@ -45,8 +41,9 @@
 import { useForm } from "@/stores";
 import { D9Button, D9Label } from "@deck9/ui";
 import ValidationErrors from "@/components/ValidationErrors.vue";
-import { computed, Ref, ref } from "vue";
+import { computed, ref } from "vue";
 import { AxiosError } from "axios";
+import { useFileDialog } from "@vueuse/core";
 
 const props = defineProps<{
   label: string;
@@ -54,11 +51,15 @@ const props = defineProps<{
 }>();
 
 const store = useForm();
-const uploadInput = ref(null) as unknown as Ref<HTMLElement>;
 const isSelecting = ref(false);
 const isDeleting = ref(false);
 const uploadErrors = ref<string[]>([]);
 
+const { open, onChange } = useFileDialog({
+  accept: "image/png,image/jpeg,image/jpg,image/gif",
+  multiple: false,
+});
+
 // computed property to retrieve the image url base on the type
 const imageUrl = computed(() => {
   if (!store.form) return false;
@@ -72,18 +73,8 @@ const imageUrl = computed(() => {
     : false;
 });
 
-const initUpload = () => {
+onChange(async (files) => {
   isSelecting.value = true;
-  uploadInput.value?.click();
-
-  setTimeout(() => {
-    isSelecting.value = false;
-  }, 2000);
-};
-
-const selectFiles = async (payload: Event) => {
-  const files = (payload?.target as HTMLInputElement).files;
-
   if (files && files.length > 0) {
     const file = files[0];
     try {
@@ -94,7 +85,8 @@ const selectFiles = async (payload: Event) => {
       }
     }
   }
-};
+  isSelecting.value = false;
+});
 
 const deleteImage = async () => {
   isDeleting.value = true;
diff --git a/resources/js/components/Factory/Submissions/SubmissionTableItem.vue b/resources/js/components/Factory/Submissions/SubmissionTableItem.vue
index f7ed98e6..d63ee562 100644
--- a/resources/js/components/Factory/Submissions/SubmissionTableItem.vue
+++ b/resources/js/components/Factory/Submissions/SubmissionTableItem.vue
@@ -42,14 +42,26 @@
       v-for="header in headers"
       :key="submission.id + header.id"
     >
-      <span class="block space-x-2" v-if="submission.responses[header.id]">
-        <span
-          class="inline-block rounded bg-grey-100 px-2 py-1"
+      <span class="flex flex-wrap gap-2" v-if="submission.responses[header.id]">
+        <template
           v-for="response in submission.responses[header.id].data"
           :key="response.id"
         >
-          {{ response.value }}
-        </span>
+          <template v-if="response.type === 'input-file'">
+            <a
+              class="inline-block rounded bg-grey-100 px-2 py-1 hover:bg-grey-200"
+              :href="upload.url"
+              v-for="upload in response.original"
+              :key="upload.uuid"
+            >
+              <span class="inline-block">{{ upload.name }}</span>
+              <D9Icon class="ml-1" name="cloud-download" />
+            </a>
+          </template>
+          <span class="inline-block rounded bg-grey-100 px-2 py-1" v-else>
+            {{ response.value }}
+          </span>
+        </template>
       </span>
       <span v-else>-</span>
     </td>
@@ -60,7 +72,7 @@
 import FormattedDate from "@/forms/common/LocaleDate.vue";
 import SubmissionParams from "@/components/Factory/Submissions/SubmissionParams.vue";
 import SubmissionWebhookStatus from "@/components/Factory/Submissions/SubmissionWebhookStatus.vue";
-import { D9Button } from "@deck9/ui";
+import { D9Button, D9Icon } from "@deck9/ui";
 import { callDeleteFormSubmission } from "@/api/forms";
 import { useForm } from "@/stores";
 import { useClipboard } from "@vueuse/core";
@@ -96,7 +108,7 @@ const deleteSubmission = async () => {
     try {
       await callDeleteFormSubmission(
         store.form,
-        props.submission as FormSessionModel
+        props.submission as FormSessionModel,
       );
 
       emits("deleted", props.submission.id);
diff --git a/resources/js/components/Factory/utils/useBlockTypes.ts b/resources/js/components/Factory/utils/useBlockTypes.ts
index 75b6d264..92372995 100644
--- a/resources/js/components/Factory/utils/useBlockTypes.ts
+++ b/resources/js/components/Factory/utils/useBlockTypes.ts
@@ -17,6 +17,7 @@ export const useBlockTypes = (): {
         { label: "Rating", value: "rating", icon: "star" },
         { label: "Scale", value: "scale", icon: "signal" },
         { label: "Date", value: "date", icon: "calendar" },
+        { label: "File", value: "input-file", icon: "cloud-arrow-up" },
         { label: "Consent", value: "consent", icon: "user-shield" },
     ];
 
diff --git a/resources/js/forms/classic/ClassicForm.vue b/resources/js/forms/classic/ClassicForm.vue
index 0a33211e..42df8e37 100644
--- a/resources/js/forms/classic/ClassicForm.vue
+++ b/resources/js/forms/classic/ClassicForm.vue
@@ -42,6 +42,7 @@
           v-bind="{
             hideNavigation: flags.hideNavigation,
             block: store.currentBlock,
+            key: store.currentBlock?.id,
           }"
           :class="{
             'pointer-events-none opacity-0': store.isSubmitted,
diff --git a/resources/js/forms/classic/components/UploadFileItem.vue b/resources/js/forms/classic/components/UploadFileItem.vue
new file mode 100644
index 00000000..624f0531
--- /dev/null
+++ b/resources/js/forms/classic/components/UploadFileItem.vue
@@ -0,0 +1,79 @@
+<template>
+  <div
+    class="flex items-center justify-between gap-x-3 bg-grey-100 px-2 py-1 rounded"
+  >
+    <div class="w-10 h-10 shrink-0" v-if="hasRenderablePreview">
+      <img
+        class="object-cover w-full h-full rounded"
+        :src="renderableImageUrl"
+        alt="Preview"
+      />
+    </div>
+    <div
+      v-else
+      class="h-10 w-10 shrink-0 inline-flex items-center justify-center"
+    >
+      <D9Icon size="lg" :name="iconName" />
+    </div>
+    <div class="flex items-center justify-between w-full">
+      <div class="truncate max-w-72">
+        {{ file.name }}
+      </div>
+
+      <div class="flex items-center">
+        <div class="whitespace-nowrap text-xs font-mono">{{ fileSize }}</div>
+        <button type="button" @click="emits('remove')" class="px-2">
+          <D9Icon name="times" />
+        </button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { computed } from "vue";
+import { D9Icon } from "@deck9/ui";
+
+const props = defineProps<{
+  file: File;
+}>();
+
+const emits = defineEmits(["remove"]);
+
+const fileSize = computed(() => {
+  let size = props.file.size;
+  const units = ["B", "KB", "MB", "GB", "TB"];
+  let unitIndex = 0;
+
+  while (size > 1024) {
+    size /= 1024;
+    unitIndex++;
+  }
+
+  return `${size.toFixed(2)} ${units[unitIndex]}`;
+});
+
+const hasRenderablePreview = computed(() => {
+  return ["image"].includes(props.file.type.split("/")[0]);
+});
+
+const renderableImageUrl = computed(() => {
+  return URL.createObjectURL(props.file);
+});
+
+const iconName = computed(() => {
+  if (props.file.type === "application/pdf") {
+    return "file-pdf";
+  }
+
+  if (props.file.type.includes("audio")) {
+    return "file-waveform";
+  }
+
+  if (props.file.type.includes("video")) {
+    return "file-video";
+  }
+
+  return "file-lines";
+});
+</script>
diff --git a/resources/js/forms/classic/interactions/ButtonAction.vue b/resources/js/forms/classic/interactions/ButtonAction.vue
index 3c45178a..738f9589 100644
--- a/resources/js/forms/classic/interactions/ButtonAction.vue
+++ b/resources/js/forms/classic/interactions/ButtonAction.vue
@@ -29,15 +29,13 @@
         @keydown.enter="stopEditing($event, true)"
         type="text"
         :placeholder="
-          isChecked && !otherValue
-            ? t('Type your answer')
-            : action.label ?? t('Other')
+          isChecked && !otherValue ? t('type') : action.label ?? t('other')
         "
         v-model="otherValue"
         class="block w-full border-0 focus:ring-0"
         :class="{ 'pointer-events-none': !isChecked }"
       />
-      <span data-testid="button-label" v-else class="inline-block">{{
+      <span v-else class="inline-block" data-testid="button-label">{{
         action.label
       }}</span>
       <div
@@ -54,7 +52,9 @@
             <code class="rounded bg-content/10 px-1 py-px">e</code>
           </i18n-t>
           <i18n-t v-else keypath="hints.confirm" tag="span" scope="global">
-            <code class="rounded bg-content/10 px-1 py-px">Enter</code>
+            <code class="rounded bg-content/10 px-1 py-px">{{
+              t("enter")
+            }}</code>
           </i18n-t>
         </template>
       </div>
@@ -94,6 +94,7 @@ const props = defineProps<{
 const disableFocus: ComputedRef<boolean> | undefined = inject("disableFocus");
 const buttonElement = ref<HTMLInputElement | null>(null);
 const otherInput = ref<HTMLInputElement | null>(null);
+const otherValue = ref<string>("");
 const inputType = props.block.type === "checkbox" ? "checkbox" : "radio";
 const shortcutKey = (props.index + 1).toString();
 
@@ -115,8 +116,6 @@ const isOtherOption = computed<boolean>(() => {
   return props.action.name === "alt_response";
 });
 
-const otherValue = ref<string>("");
-
 const isVisible = computed<boolean>(() => {
   return (
     !isOtherOption.value ||
diff --git a/resources/js/forms/classic/interactions/FileAction.vue b/resources/js/forms/classic/interactions/FileAction.vue
new file mode 100644
index 00000000..4e66d4d8
--- /dev/null
+++ b/resources/js/forms/classic/interactions/FileAction.vue
@@ -0,0 +1,189 @@
+<template>
+  <div class="relative">
+    <div
+      v-if="!hasMaxFiles"
+      class="border-2 border-dashed rounded px-4 text-center transition-all"
+      :class="[
+        isOverDropZone ? 'border-content/20 py-10' : 'border-primary',
+        !isOverDropZone && !!currentFiles ? 'py-2' : 'py-10',
+      ]"
+      ref="dropZoneRef"
+    >
+      <button
+        @click="open()"
+        type="button"
+        class="underline text-primary px-5 py-1 rounded"
+      >
+        {{ t("files_choose") }}
+      </button>
+      <span class="block text-xs text-content/80 leading-0">{{
+        t("files_drop")
+      }}</span>
+    </div>
+
+    <div v-if="currentFiles" class="my-4 space-y-2">
+      <TransitionGroup
+        appear
+        enter-from-class="-translate-x-8 opacity-0"
+        enter-to-class="translate-x-0"
+        enter-active-class="transition-all duration-300"
+        leave-from-class="translate-x-0"
+        leave-to-class="translate-x-8 opacity-0"
+        leave-active-class="transition-all duration-200"
+      >
+        <UploadFileItem
+          v-for="(file, index) in currentFiles"
+          @remove="removeFile(index)"
+          :key="file.name"
+          :file="file"
+        />
+      </TransitionGroup>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { useConversation } from "@/stores/conversation";
+import { useFileDialog, useDropZone } from "@vueuse/core";
+import UploadFileItem from "@/forms/classic/components/UploadFileItem.vue";
+import { computed, ref } from "vue";
+import { useI18n } from "vue-i18n";
+
+const store = useConversation();
+const { t } = useI18n();
+
+const props = defineProps<{
+  index: number;
+  block: PublicFormBlockModel;
+  action: PublicFormBlockInteractionModel;
+}>();
+
+const emit = defineEmits<{
+  (event: "update"): void;
+}>();
+
+const dropZoneRef = ref<HTMLDivElement>();
+
+const currentFiles = computed<File[] | false>(() => {
+  if (
+    !Array.isArray(store.currentPayload) &&
+    store.currentPayload?.payload.length > 0
+  ) {
+    return store.currentPayload?.payload;
+  }
+
+  return false;
+});
+
+const setFiles = (files: File[] | FileList | null) => {
+  const currentFiles: File[] = [];
+
+  // first load the current files if any. that are files that have been selected before
+  if (!Array.isArray(store.currentPayload) && store.currentPayload?.payload) {
+    for (const file of store.currentPayload.payload) {
+      currentFiles.push(file);
+    }
+  }
+
+  // add the new files, that are valid
+  if (files) {
+    for (const file of files) {
+      // validate first if file type is allowed
+      // validate second that files names are unique
+      if (
+        currentFiles.every(
+          (currentFile) =>
+            currentFile.name !== file.name ||
+            currentFile.type !== file.type ||
+            currentFile.size !== file.size,
+        ) &&
+        allowedFileTypes.value
+          .split(",")
+          .some(
+            (mimeType) =>
+              mimeType === "*" ||
+              file.type === mimeType ||
+              (mimeType.endsWith("/*") &&
+                file.type.startsWith(mimeType.slice(0, -1))),
+          )
+      ) {
+        currentFiles.push(file);
+      } else {
+        // if validation fails, log an error and show it to the user
+        console.error("File type not allowed");
+      }
+    }
+  }
+
+  // set them as response
+  store.setResponse(props.action, currentFiles);
+  emit("update");
+};
+
+const { isOverDropZone } = useDropZone(dropZoneRef, {
+  onDrop: setFiles,
+});
+
+const allowedFileTypes = computed<string>(() => {
+  const types = props.action?.options?.allowedFileTypes;
+
+  const map = {
+    image: "image/*",
+    video: "video/*",
+    audio: "audio/*",
+    text: "application/*,text/*",
+  };
+
+  if (types) {
+    let accept: string[] = [];
+    Object.keys(types).forEach((key) => {
+      if (key in types && types[key] === true && key in map) {
+        accept.push(map[key]);
+      }
+    });
+
+    if (accept.length === 0) {
+      return "*";
+    }
+
+    return accept.join(", ");
+  }
+
+  return "*";
+});
+
+const hasMaxFiles = computed<boolean>(() => {
+  if (props.action?.options?.allowedFiles) {
+    return (
+      currentFiles.value &&
+      currentFiles.value.length >= props.action.options.allowedFiles
+    );
+  }
+
+  return false;
+});
+
+const { open, onChange } = useFileDialog({
+  multiple: true,
+  accept: allowedFileTypes.value,
+});
+
+onChange(setFiles);
+
+const removeFile = (index: number) => {
+  const currentFiles: File[] = [];
+
+  // first load the current files
+  if (!Array.isArray(store.currentPayload) && store.currentPayload?.payload) {
+    for (const file of store.currentPayload.payload) {
+      currentFiles.push(file);
+    }
+  }
+
+  // then remove the file
+  currentFiles.splice(index, 1);
+
+  // set them as response
+  store.setResponse(props.action, currentFiles);
+};
+</script>
diff --git a/resources/js/forms/classic/interactions/__snapshots__/ButtonAction.test.ts.snap b/resources/js/forms/classic/interactions/__snapshots__/ButtonAction.test.ts.snap
index 85c31362..213baf4f 100644
--- a/resources/js/forms/classic/interactions/__snapshots__/ButtonAction.test.ts.snap
+++ b/resources/js/forms/classic/interactions/__snapshots__/ButtonAction.test.ts.snap
@@ -2,7 +2,7 @@
 
 exports[`ButtonAction > should mount correctly 1`] = `
 "<label for=\\"1\\" class=\\"relative block cursor-pointer rounded border py-2 pl-6 pr-3 bg-background brightness-user border-content/20\\">
-  <div class=\\"absolute inset-y-0 left-2 flex items-center\\"><span data-testid=\\"button-action-index\\" class=\\"flex h-5 w-5 items-center justify-center rounded-sm text-xs font-medium bg-content/70 text-background\\">1</span></div><span class=\\"block w-full pl-4 pr-6\\"><span data-testid=\\"button-label\\" class=\\"inline-block\\">Test Button</span>
+  <div class=\\"absolute inset-y-0 left-2 flex items-center\\"><span data-testid=\\"button-action-index\\" class=\\"flex h-5 w-5 items-center justify-center rounded-sm text-xs font-medium bg-content/70 text-background\\">1</span></div><span class=\\"block w-full pl-4 pr-6\\"><span class=\\"inline-block\\" data-testid=\\"button-label\\">Test Button</span>
   <!--v-if--></span>
   <div class=\\"absolute inset-y-0 right-4 flex items-center\\"><input class=\\"border-grey-300 bg-transparent checked:border-primary checked:bg-primary checked:hover:bg-primary focus:ring-primary focus:checked:bg-primary focus:checked:outline-none focus:checked:ring-0 focus:checked:ring-offset-0\\" type=\\"radio\\" name=\\"1\\" id=\\"1\\" value=\\"Test Button\\"></div>
 </label>"
diff --git a/resources/js/forms/classic/interactions/useButtonAction.ts b/resources/js/forms/classic/interactions/useButtonAction.ts
index d2e4018d..ef6e5263 100644
--- a/resources/js/forms/classic/interactions/useButtonAction.ts
+++ b/resources/js/forms/classic/interactions/useButtonAction.ts
@@ -1,10 +1,12 @@
 import ButtonAction from "@/forms/classic/interactions/ButtonAction.vue";
+import { useI18n } from "vue-i18n";
 
 export function useButtonAction(block: PublicFormBlockModel) {
+    const { t } = useI18n();
     const useThis = ["radio", "checkbox"].includes(block.type);
 
     const validator = (input: any) => {
-        const validationMessage = "Please select an option.";
+        const validationMessage = t("validation.option_required");
 
         if (block.is_required) {
             if (!input) {
diff --git a/resources/js/forms/classic/interactions/useDateAction.ts b/resources/js/forms/classic/interactions/useDateAction.ts
index fe318993..9f2e1ff1 100644
--- a/resources/js/forms/classic/interactions/useDateAction.ts
+++ b/resources/js/forms/classic/interactions/useDateAction.ts
@@ -1,12 +1,14 @@
 import DateAction from "@/forms/classic/interactions/DateAction.vue";
+import { useI18n } from "vue-i18n";
 
 export function useDateAction(block: PublicFormBlockModel) {
+    const { t } = useI18n();
     const useThis = ["date"].includes(block.type);
 
     const validator = (input: any) => {
         return {
             valid: block.is_required ? input?.payload.length > 0 : true,
-            message: "This field is required",
+            message: t("validation.field_required"),
         };
     };
 
diff --git a/resources/js/forms/classic/interactions/useFileAction.ts b/resources/js/forms/classic/interactions/useFileAction.ts
new file mode 100644
index 00000000..80e3a00b
--- /dev/null
+++ b/resources/js/forms/classic/interactions/useFileAction.ts
@@ -0,0 +1,66 @@
+import FileAction from "@/forms/classic/interactions/FileAction.vue";
+import { useI18n } from "vue-i18n";
+
+export function useFileAction(block: PublicFormBlockModel) {
+    const { t } = useI18n();
+    const useThis = [
+        "input-file",
+    ].includes(block.type);
+
+    const validator = (input: any) => {
+
+        // check if the block is required
+        if (block.is_required && (!input?.payload || input?.payload.length === 0)) {
+            return {
+                valid: false,
+                message: t("validation.field_required"),
+            }
+        }
+
+        // get constraints from block file interaction
+        const interaction = block.interactions.find((interaction) => {
+            return interaction.type === "file";
+        })
+
+        if (!interaction) {
+            return {
+                valid: false,
+                message: t("validation.no_file_interaction"),
+            }
+        }
+
+        const maxFiles = interaction.options?.allowedFiles;
+        const maxFileSize = interaction.options?.allowedFileSize ? interaction.options?.allowedFileSize * Math.pow(10,6) : 0;
+
+        // check for max files constrains
+        if (maxFiles && input?.payload.length > maxFiles) {
+            return {
+                valid: false,
+                message: t(`validation.too_many_files`, { maxFiles }),
+            }
+        }
+
+        // check for file size constraints
+        if (input?.payload && input.payload.length > 0) {
+            for (const file of input.payload) {
+                // check for max file size
+                if (maxFileSize && file.size > maxFileSize) {
+                    return {
+                        valid: false,
+                        message: t(`validation.file_size`, {
+                            fileName: file.name,
+                            maxFileSize: interaction.options?.allowedFileSize
+                        }),
+                    }
+                }
+            }
+        }
+
+        return {
+            valid: true,
+            message: "",
+        }
+    };
+
+    return { useThis, component: FileAction, validator, props: {} };
+}
diff --git a/resources/js/forms/classic/interactions/useInputAction.ts b/resources/js/forms/classic/interactions/useInputAction.ts
index 30251e11..44c961b0 100644
--- a/resources/js/forms/classic/interactions/useInputAction.ts
+++ b/resources/js/forms/classic/interactions/useInputAction.ts
@@ -1,7 +1,9 @@
 import InputAction from "@/forms/classic/interactions/InputAction.vue";
 import { string, number } from "yup";
+import { useI18n } from "vue-i18n";
 
 export function useInputAction(block: PublicFormBlockModel) {
+    const { t } = useI18n();
     const useThis = [
         "input-short",
         "input-email",
@@ -28,35 +30,35 @@ export function useInputAction(block: PublicFormBlockModel) {
                     valid:
                         (!block.is_required && !input?.payload) ||
                         emailValidator.isValidSync(input?.payload),
-                    message: "Please enter a valid email.",
+                    message: t("validation.valid_email"),
                 };
             case "input-number":
                 return {
                     valid:
                         (!block.is_required && !input?.payload) ||
                         numberValidator.isValidSync(input?.payload),
-                    message: "Please enter a valid number.",
+                    message: t("validation.valid_number"),
                 };
             case "input-link":
                 return {
                     valid:
                         (!block.is_required && !input?.payload) ||
                         linkValidator.isValidSync(input?.payload),
-                    message: "Please enter a valid link.",
+                    message: t("validation.valid_link"),
                 };
             case "input-phone":
                 return {
                     valid:
                         (!block.is_required && !input?.payload) ||
                         phoneValidator.isValidSync(input?.payload),
-                    message: "Please enter a valid phone number.",
+                    message: t("validation.valid_phone")
                 };
             default:
                 return {
                     valid:
                         (!block.is_required && !input?.payload) ||
                         defaultValidator.isValidSync(input?.payload),
-                    message: "Please enter a valid short text.",
+                    message: t("validation.field_required"),
                 };
         }
     };
diff --git a/resources/js/forms/classic/interactions/useRangeAction.ts b/resources/js/forms/classic/interactions/useRangeAction.ts
index b47e1c98..09dd22b4 100644
--- a/resources/js/forms/classic/interactions/useRangeAction.ts
+++ b/resources/js/forms/classic/interactions/useRangeAction.ts
@@ -1,10 +1,11 @@
 import RangeAction from "@/forms/classic/interactions/RangeAction.vue";
-
+import { useI18n } from "vue-i18n";
 export function useRangeAction(block: PublicFormBlockModel) {
+    const { t } = useI18n();
     const useThis = ["rating", "scale"].includes(block.type);
 
     const validator = (input: any) => {
-        const validationMessage = "Please choose a rating.";
+        const validationMessage = t("validation.rating_required");
 
         if (block.is_required) {
             if (!input) {
diff --git a/resources/js/forms/classic/interactions/useTextareaAction.ts b/resources/js/forms/classic/interactions/useTextareaAction.ts
index b816bbe4..cede6432 100644
--- a/resources/js/forms/classic/interactions/useTextareaAction.ts
+++ b/resources/js/forms/classic/interactions/useTextareaAction.ts
@@ -1,6 +1,8 @@
 import TextareaAction from "@/forms/classic/interactions/TextareaAction.vue";
+import { useI18n } from "vue-i18n";
 
 export function useTextareaAction(block: PublicFormBlockModel) {
+    const { t } = useI18n();
     const useThis = ["input-long"].includes(block.type);
 
     const validator = (input: any) => {
@@ -8,7 +10,7 @@ export function useTextareaAction(block: PublicFormBlockModel) {
             block.is_required &&
             (!input || input?.payload?.trim().length === 0)
         ) {
-            return { valid: false, message: "This field is required" };
+            return { valid: false, message: t("validation.field_required") };
         }
 
         const action = block.interactions[0];
@@ -22,7 +24,7 @@ export function useTextareaAction(block: PublicFormBlockModel) {
                 return {
                     valid: false,
                     message:
-                        "You have exceeded the maximum number of characters allowed.",
+                        t("validation.max_characters"),
                 };
             }
         }
diff --git a/resources/js/forms/classic/layout/Block.vue b/resources/js/forms/classic/layout/Block.vue
index 3665e3f8..939dc531 100644
--- a/resources/js/forms/classic/layout/Block.vue
+++ b/resources/js/forms/classic/layout/Block.vue
@@ -10,6 +10,7 @@
       >
         <component
           :is="actionComponent"
+          @update="showValidationMessage = true"
           v-bind="{
             block,
             index,
@@ -26,6 +27,7 @@
     <FormButton
       :isDisabled="!validator.valid"
       :isProcessing="store.isProcessing"
+      :uploadProgress="store.uploadProgress"
       ref="submitButton"
       :label="submitButtonLabel"
       v-bind="{ ...actionProps }"
@@ -77,12 +79,12 @@ const showValidationMessage = ref(false);
 const submitButtonLabel = computed(() => {
   if (store.currentBlock?.type === "consent") {
     if (!store.hasRequiredFields && store.countCurrentSelections === 0) {
-      return store.isLastBlock ? t("Submit") : t("Continue");
+      return store.isLastBlock ? t("submit") : t("continue");
     } else {
-      return store.isLastBlock ? t("Accept & Submit") : t("Accept");
+      return store.isLastBlock ? t("accept_submit") : t("accept");
     }
   } else {
-    return store.isLastBlock ? t("Submit") : t("Next");
+    return store.isLastBlock ? t("submit") : t("next");
   }
 });
 
diff --git a/resources/js/forms/classic/layout/FooterNavigation.vue b/resources/js/forms/classic/layout/FooterNavigation.vue
index fa8b1f60..f451cbef 100644
--- a/resources/js/forms/classic/layout/FooterNavigation.vue
+++ b/resources/js/forms/classic/layout/FooterNavigation.vue
@@ -5,14 +5,14 @@
       v-if="form?.privacy_link"
       :href="form?.privacy_link"
       target="_blank"
-      >{{ t("Privacy Policy") }}</a
+      >{{ t("privacy_policy") }}</a
     >
     <a
       class="hover:text-content"
       v-if="form?.legal_notice_link"
       :href="form?.legal_notice_link"
       target="_blank"
-      >{{ t("Legal Notice") }}</a
+      >{{ t("legal_notice") }}</a
     >
   </div>
 </template>
diff --git a/resources/js/forms/classic/layout/FormButton.vue b/resources/js/forms/classic/layout/FormButton.vue
index 08186435..b24140a5 100644
--- a/resources/js/forms/classic/layout/FormButton.vue
+++ b/resources/js/forms/classic/layout/FormButton.vue
@@ -16,6 +16,9 @@
           class="absolute inset-0 flex items-center justify-center"
         >
           <D9Icon class="animate-spin" icon="circle-notch" />
+          <span v-if="uploadProgress" class="text-xs ml-2"
+            >{{ uploadProgress }}%</span
+          >
         </span>
       </button>
 
@@ -24,7 +27,7 @@
         :class="{ 'pointer-events-none opacity-0': isDisabled }"
         class="ml-4 inline-flex items-center justify-center text-xs font-bold leading-none text-content/80 transition duration-150"
       >
-        {{ t("Enter") }}
+        {{ t("enter") }}
         <D9Icon class="ml-1 rotate-90" icon="turn-down" />
       </span>
     </div>
@@ -39,6 +42,7 @@ import { useI18n } from "vue-i18n";
 defineProps<{
   isDisabled?: boolean;
   isProcessing?: boolean;
+  uploadProgress?: number | false;
   label: string;
   enableInputMode?: boolean;
 }>();
diff --git a/resources/js/forms/classic/layout/FormSubmittedPage.vue b/resources/js/forms/classic/layout/FormSubmittedPage.vue
index 1e05f894..c07d553c 100644
--- a/resources/js/forms/classic/layout/FormSubmittedPage.vue
+++ b/resources/js/forms/classic/layout/FormSubmittedPage.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <h2 class="text-lg font-medium">
-      {{ store.form?.eoc_headline || t("Form Submitted") }}
+      {{ store.form?.eoc_headline || t("form_submitted") }}
     </h2>
     <p v-if="store.form?.eoc_text" class="mt-2 text-base leading-6">
       {{ store.form?.eoc_text }}
@@ -9,7 +9,7 @@
     <CallToActionButton
       v-if="store.form?.show_cta_link && store.callToActionUrl"
       :href="store.callToActionUrl"
-      :label="store.form?.cta_label ?? t('Close')"
+      :label="store.form?.cta_label ?? t('close')"
     />
 
     <SocialLinks v-if="store.form?.show_social_links" class="mt-8" />
diff --git a/resources/js/forms/classic/layout/Navigator.vue b/resources/js/forms/classic/layout/Navigator.vue
index fdc1c8f8..3a09ab8e 100644
--- a/resources/js/forms/classic/layout/Navigator.vue
+++ b/resources/js/forms/classic/layout/Navigator.vue
@@ -9,7 +9,7 @@
         type="button"
         class="inline-flex items-center justify-center border-r border-content/10 py-1 hover:bg-content/10"
         :class="[{ 'pointer-events-none opacity-25': store.isFirstBlock }]"
-        :aria-label="t('Go to previous Page')"
+        :aria-label="t('page_previous')"
         :aria-disabled="store.isFirstBlock"
         :disabled="store.isFirstBlock"
         @click="store.back()"
@@ -29,7 +29,7 @@
           },
         ]"
         :disabled="!validator.valid || store.isLastBlock"
-        :aria-label="t('Go to next Page')"
+        :aria-label="t('page_next')"
         @click="!store.isLastBlock ? store.next() : false"
       >
         <D9Icon icon="chevron-right" />
diff --git a/resources/js/forms/classic/layout/SocialLinks.vue b/resources/js/forms/classic/layout/SocialLinks.vue
index 9e69e69f..b0f4289d 100644
--- a/resources/js/forms/classic/layout/SocialLinks.vue
+++ b/resources/js/forms/classic/layout/SocialLinks.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <h3 class="font-bold">{{ t("Find us here") }}:</h3>
+    <h3 class="font-bold">{{ t("find_us") }}:</h3>
     <ul class="mt-1 flex space-x-3">
       <li v-for="provider in socialLinkProviders" :key="provider">
         <a
diff --git a/resources/js/forms/classic/useActions.ts b/resources/js/forms/classic/useActions.ts
index 28a931b4..7ac254ef 100644
--- a/resources/js/forms/classic/useActions.ts
+++ b/resources/js/forms/classic/useActions.ts
@@ -4,8 +4,25 @@ import { useConsentAction } from "./interactions/useConsentAction";
 import { useTextareaAction } from "./interactions/useTextareaAction";
 import { useRangeAction } from "./interactions/useRangeAction";
 import { useDateAction } from "./interactions/useDateAction";
+import { useFileAction } from "./interactions/useFileAction";
 
-export function useActions(block: PublicFormBlockModel) {
+export type ActionValidatorType =
+    | ((input: any) =>
+          | {
+                valid: any;
+                message: string;
+            }
+          | {
+                valid: boolean;
+                message?: undefined;
+            })
+    | undefined;
+
+export function useActions(block: PublicFormBlockModel): {
+    actionValidator: ActionValidatorType;
+    actionComponent: any;
+    actionProps: any;
+} {
     const actionTypes = [
         useButtonAction(block),
         useConsentAction(block),
@@ -13,6 +30,7 @@ export function useActions(block: PublicFormBlockModel) {
         useTextareaAction(block),
         useRangeAction(block),
         useDateAction(block),
+        useFileAction(block),
     ];
 
     // return the component which is required based on type
diff --git a/resources/js/stores/conversation.ts b/resources/js/stores/conversation.ts
index 9d7d75b8..7b6a18d5 100644
--- a/resources/js/stores/conversation.ts
+++ b/resources/js/stores/conversation.ts
@@ -4,6 +4,7 @@ import {
     callGetFormStoryboard,
     callSubmitForm,
     callGetForm,
+    callUploadFiles,
 } from "@/api/conversation";
 import { Ref, ref } from "vue";
 
@@ -17,6 +18,7 @@ type ConversationStore = {
     isProcessing: boolean;
     isSubmitted: boolean;
     isInputMode: boolean;
+    uploads: FormFileUploads;
 };
 
 export const useConversation = defineStore("form", {
@@ -31,6 +33,7 @@ export const useConversation = defineStore("form", {
             isProcessing: false,
             isSubmitted: false,
             isInputMode: false,
+            uploads: {},
         };
     },
 
@@ -60,7 +63,7 @@ export const useConversation = defineStore("form", {
         },
 
         currentPayload(
-            state
+            state,
         ): FormBlockInteractionPayload | FormBlockInteractionPayload[] | null {
             if (!this.currentBlock) return null;
 
@@ -71,6 +74,32 @@ export const useConversation = defineStore("form", {
             return null;
         },
 
+        submittablePayload(): FormSubmitPayload {
+            const submittablePayload = Object.assign({}, this.payload);
+
+            for (const block in this.payload) {
+                const blockPayload = this.payload[block];
+
+                if (Array.isArray(blockPayload)) {
+                    continue;
+                }
+
+                if (
+                    Array.isArray(blockPayload.payload) &&
+                    blockPayload.payload.some((f) => f instanceof File)
+                ) {
+                    submittablePayload[block] = {
+                        ...blockPayload,
+                        payload: blockPayload.payload
+                            .map((f) => f.name)
+                            .join(", "),
+                    };
+                }
+            }
+
+            return submittablePayload;
+        },
+
         countCurrentSelections(): number {
             if (!this.currentPayload) return 0;
 
@@ -109,7 +138,7 @@ export const useConversation = defineStore("form", {
                 !state.isSubmitted &&
                     state.payload &&
                     Object.keys(state.payload).length > 0 &&
-                    state.current > 0
+                    state.current > 0,
             );
         },
 
@@ -149,12 +178,61 @@ export const useConversation = defineStore("form", {
 
             return state.form.cta_link;
         },
+
+        uploadsPayload(state): Record<string, FormBlockUploadPayload> {
+            const uploads = {};
+
+            for (const block in state.payload) {
+                const blockPayload = state.payload[block];
+
+                if (Array.isArray(blockPayload)) {
+                    continue;
+                }
+
+                if (
+                    Array.isArray(blockPayload.payload) &&
+                    blockPayload.payload.some((f) => f instanceof File)
+                ) {
+                    uploads[block] = blockPayload;
+                }
+            }
+
+            return uploads;
+        },
+
+        hasFileUploads(state): boolean {
+            return Object.values(state.payload).some((block) => {
+                if (!Array.isArray(block) && Array.isArray(block.payload)) {
+                    return block.payload.some((p) => {
+                        return p instanceof File;
+                    });
+                }
+            });
+        },
+
+        uploadProgress(state): number | false {
+            if (Object.values(state.uploads).length === 0) {
+                return false;
+            }
+
+            const total = Object.values(state.uploads).reduce(
+                (acc, val) => acc + val.total,
+                0,
+            );
+
+            const loaded = Object.values(state.uploads).reduce(
+                (acc, val) => acc + val.loaded,
+                0,
+            );
+
+            return Math.min(100, Math.round((loaded / total) * 100));
+        },
     },
 
     actions: {
         async initForm(
             initialPayload: string | PublicFormModel,
-            params: Record<string, string>
+            params: Record<string, string>,
         ) {
             const id =
                 typeof initialPayload === "string"
@@ -195,7 +273,7 @@ export const useConversation = defineStore("form", {
 
         setResponse(
             action: PublicFormBlockInteractionModel,
-            value: string | boolean | number | null
+            value: string | boolean | number | File[] | null,
         ) {
             if (!this.currentBlock) return;
 
@@ -211,7 +289,7 @@ export const useConversation = defineStore("form", {
                 | Record<string, string | boolean | null>
                 | string
                 | boolean
-                | null
+                | null,
         ) {
             if (!this.currentBlock) return;
 
@@ -225,7 +303,7 @@ export const useConversation = defineStore("form", {
                 this.payload[this.currentBlock.id] = [givenPayload];
             } else {
                 const foundIndex = currentPayload.findIndex(
-                    (p) => p.actionId === action.id
+                    (p) => p.actionId === action.id,
                 );
 
                 foundIndex === -1
@@ -253,15 +331,47 @@ export const useConversation = defineStore("form", {
          */
         async next(): Promise<boolean> {
             if (this.isLastBlock) {
+                this.uploads = {};
                 this.isProcessing = true;
 
                 if (this.form?.uuid && this.session?.token) {
                     await callSubmitForm(
                         this.form.uuid,
                         this.session.token,
-                        this.payload
+                        this.submittablePayload,
+                        this.hasFileUploads,
                     );
 
+                    if (this.hasFileUploads) {
+                        // init file upload state
+                        this.initFileUpload();
+
+                        // upload files
+                        await callUploadFiles(
+                            this.form.uuid,
+                            this.session.token,
+                            this.uploadsPayload,
+                            (action, progressEvent) => {
+                                try {
+                                    this.uploads[action].loaded =
+                                        progressEvent.loaded;
+                                } catch (e) {
+                                    console.warn(
+                                        "could not update upload progress",
+                                        e,
+                                    );
+                                }
+                            },
+                        );
+
+                        await callSubmitForm(
+                            this.form.uuid,
+                            this.session.token,
+                            null,
+                            false,
+                        );
+                    }
+
                     // If a redirect is configured, we redirect the user to the given url
                     if (this.form.use_cta_redirect && this.callToActionUrl) {
                         window.location.href = this.callToActionUrl;
@@ -292,6 +402,17 @@ export const useConversation = defineStore("form", {
             }
         },
 
+        initFileUpload() {
+            Object.values(this.uploadsPayload).forEach((value) => {
+                value.payload.forEach((file: File, index: number) => {
+                    this.uploads[`${value.actionId}[${index}]`] = {
+                        total: file.size,
+                        loaded: 0,
+                    };
+                });
+            });
+        },
+
         evaluateGroupBlock(currentBlock: PublicFormBlockModel) {
             // we first should remove all blocks related to that group
             this.queue =
diff --git a/resources/js/types/models.d.ts b/resources/js/types/models.d.ts
index 7e0d0422..f66a0c5a 100644
--- a/resources/js/types/models.d.ts
+++ b/resources/js/types/models.d.ts
@@ -92,6 +92,7 @@ type FormBlockType =
     | "input-link"
     | "input-phone"
     | "input-secret"
+    | "input-file"
     | "scale"
     | "rating"
     | "date";
@@ -102,6 +103,7 @@ type FormBlockInteractionType =
     | "textarea"
     | "consent"
     | "range"
+    | "file"
     | "date";
 
 type FormBlockInteractionSettings = {
@@ -119,6 +121,9 @@ type FormBlockInteractionSettings = {
     labelRight?: string;
     decimalPlaces?: number;
     useSymbol?: string;
+    allowedFiles ?: number;
+    allowedFileSize ?: number;
+    allowedFileTypes ?: Record<string, boolean>;
 };
 
 interface FormBlockInteractionModel extends BaseModel {
@@ -229,14 +234,24 @@ type FormSessionWebhookModel = {
 
 type FormSubmitPayload = Record<
     string,
-    FormBlockInteractionPayload | FormBlockInteractionPayload[]
+    FormBlockInteractionPayload | FormBlockInteractionPayload[] | FormBlockUploadPayload
 >;
 
+type FormFileUploads = Record<string, {
+    total: number;
+    loaded: number;
+}>;
+
 type FormBlockInteractionPayload = {
     payload: any;
     actionId: string;
 };
 
+type FormBlockUploadPayload = {
+    payload: File[];
+    actionId: string;
+}
+
 type EmbedFlags = {
     hideTitle?: boolean;
     hideNavigation?: boolean;
diff --git a/resources/locales/de.json b/resources/locales/de.json
index 81208d81..90695e9c 100644
--- a/resources/locales/de.json
+++ b/resources/locales/de.json
@@ -1,32 +1,42 @@
 {
-    "Accept & Submit": "Akzeptieren & Absenden",
-    "Accept": "Akzeptieren",
-    "Close": "Schliessen",
-    "Enter": "Enter",
-    "Find us here": "Finde uns hier",
-    "Form Submitted": "Formular abgeschickt",
-    "Go to next Page": "Zur nächsten Seite",
-    "Go to previous Page": "Zur vorherigen Seite",
-    "Legal Notice": "Impressum",
-    "Next": "Weiter",
-    "Other": "Andere",
-    "Please enter a valid email.": "Bitte gib eine gültige E-Mail-Adresse ein.",
-    "Please enter a valid link.": "Bitte gib einen gültigen Link ein.",
-    "Please enter a valid number.": "Bitte gib eine gültige Zahl ein.",
-    "Please enter a valid phone number.": "Bitte gib eine gültige Telefonnummer ein.",
-    "Please select an option.": "Bitte wähle eine Option aus.",
-    "Privacy Policy": "Datenschutzerklärung",
     "required": "Pflichtfeld",
-    "Something went wrong validating your input": "Beim Validieren deiner Eingabe ist etwas schief gelaufen.",
-    "Submit": "Absenden",
-    "This field is required.": "Dieses Feld ist erforderlich.",
-    "Type your answer": "Gib deine Antwort ein",
-    "You have exceeded the maximum number of characters allowed.": "Du hast die maximale Anzahl von Zeichen überschritten.",
     "hints": {
         "edit": "Drücke {0} um zu bearbeiten",
         "confirm": "{0} um zu bestätigen"
     },
     "validation": {
-        "consent_required": "Um fortzufahren, musst Du den Bedingungen zustimmen."
-    }
+        "consent_required": "Um fortzufahren, musst Du den Bedingungen zustimmen.",
+        "field_required": "Dieses Feld ist erforderlich.",
+        "valid_email": "Bitte gib eine gültige E-Mail-Adresse ein.",
+        "valid_link": "Bitte gib einen gültigen Link ein.",
+        "valid_number": "Bitte gib eine gültige Zahl ein.",
+        "valid_phone": "Bitte gib eine gültige Telefonnummer ein.",
+        "option_required": "Bitte wähle eine Option aus.",
+        "error": "Beim Validieren deiner Eingabe ist etwas schief gelaufen.",
+        "max_characters": "Du hast die maximale Anzahl von Zeichen überschritten.",
+        "no_file_interaction": "Es gibt keine gültige Konfiguration, um Dateien zu akzeptieren.",
+        "too_many_files": "Du hast zu viele Dateien hochgeladen. Du kannst bis zu {maxFiles} Dateien hochladen.",
+        "file_size": "Die Datei '{fileName}' überschreitet die maximale Größe von {maxFileSize} MB.",
+        "rating_required": "Bitte wählen Sie eine Bewertung aus."
+    },
+    "admin": {
+        "blocks": "keine Blöcke | 1 Block | {n} Blöcke"
+    },
+    "accept_submit": "Akzeptieren & Absenden",
+    "accept": "Akzeptieren",
+    "close": "Schliessen",
+    "type": "Gib deine Antwort ein",
+    "submit": "Absenden",
+    "privacy_policy": "Datenschutzerklärung",
+    "other": "Andere",
+    "next": "Weiter",
+    "legal_notice": "Impressum",
+    "page_previous": "Zur vorherigen Seite",
+    "page_next": "Zur nächsten Seite",
+    "form_submitted": "Formular abgeschickt",
+    "find_us": "Finde uns hier",
+    "enter": "Enter",
+    "continue": "Weiter",
+    "files_choose": "Wählen Sie Dateien aus",
+    "files_drop": "oder hier ablegen"
 }
diff --git a/resources/locales/en.json b/resources/locales/en.json
index 5c4e4902..05c8add3 100644
--- a/resources/locales/en.json
+++ b/resources/locales/en.json
@@ -2,34 +2,41 @@
     "admin": {
         "blocks": "no blocks | 1 block | {n} blocks"
     },
-    "Accept & Submit": "Accept & Submit",
-    "Accept": "Accept",
-    "Close": "Close",
-    "Enter": "Enter",
-    "Find us here": "Find us here",
-    "Form Submitted": "Form Submitted",
-    "Go to next Page": "Go to next Page",
-    "Go to previous Page": "Go to previous Page",
-    "Legal Notice": "Legal Notice",
-    "Next": "Next",
-    "Other": "Other",
-    "Please enter a valid email.": "Please enter a valid email.",
-    "Please enter a valid link.": "Please enter a valid link.",
-    "Please enter a valid number.": "Please enter a valid number.",
-    "Please enter a valid phone number.": "Please enter a valid phone number.",
-    "Please select an option.": "Please select an option.",
-    "Privacy Policy": "Privacy Policy",
     "required": "required",
-    "Something went wrong validating your input": "Something went wrong validating your input",
-    "Submit": "Submit",
-    "This field is required.": "This field is required.",
-    "Type your answer": "Type your answer",
-    "You have exceeded the maximum number of characters allowed.": "You have exceeded the maximum number of characters allowed.",
     "hints": {
         "edit": "Press {0} to edit",
         "confirm": "{0} to confirm"
     },
     "validation": {
-        "consent_required": "To continue, you must agree to the terms and conditions."
-    }
+        "consent_required": "To continue, you must agree to the terms and conditions.",
+        "field_required": "This field is required.",
+        "valid_email": "Please enter a valid email.",
+        "valid_link": "Please enter a valid link.",
+        "valid_number": "Please enter a valid number.",
+        "valid_phone": "Please enter a valid phone number.",
+        "option_required": "Please select an option.",
+        "error": "Something went wrong validating your input",
+        "max_characters": "You have exceeded the maximum number of characters allowed.",
+        "no_file_interaction": "There is no valid configuration to accept files",
+        "too_many_files": "You have uploaded too many files. You can upload up to {maxFiles} files.",
+        "file_size": "The file '{fileName}' exceeds the maximum size of {maxFileSize} MB.",
+        "rating_required": "Please choose a rating"
+    },
+    "accept_submit": "Accept & Submit",
+    "accept": "Accept",
+    "close": "Close",
+    "type": "Type your answer",
+    "submit": "Submit",
+    "privacy_policy": "Privacy Policy",
+    "other": "Other",
+    "next": "Next",
+    "legal_notice": "Legal Notice",
+    "page_previous": "Go to previous Page",
+    "page_next": "Go to next Page",
+    "form_submitted": "Form Submitted",
+    "find_us": "Find us here",
+    "enter": "Enter",
+    "continue": "Continue",
+    "files_choose": "Choose files",
+    "files_drop": "or drop here"
 }
diff --git a/resources/locales/fr.json b/resources/locales/fr.json
index a88e5ca8..a1ec8102 100644
--- a/resources/locales/fr.json
+++ b/resources/locales/fr.json
@@ -2,34 +2,41 @@
     "admin": {
         "blocks": "pas de blocs | 1 bloc | {n} blocs"
     },
-    "Accept & Submit": "Accepter et soumettre",
-    "Accept": "Accepter",
-    "Close": "Fermer",
-    "Enter": "Entrer",
-    "Find us here": "Retrouvez-nous ici",
-    "Form Submitted": "Formulaire soumis",
-    "Go to next Page": "Aller à la page suivante",
-    "Go to previous Page": "Aller à la page précédente",
-    "Legal Notice": "Mention légale",
-    "Next": "Suivant",
-    "Other": "Autre",
-    "Please enter a valid email.": "Veuillez saisir un email valide.",
-    "Please enter a valid link.": "Veuillez entrer un lien valide.",
-    "Please enter a valid number.": "S'il vous plait, entrez un nombre valide.",
-    "Please enter a valid phone number.": "S'il vous plaît entrer un numéro de téléphone valide.",
-    "Please select an option.": "Veuillez sélectionner une option.",
-    "Privacy Policy": "Politique de confidentialité",
     "required": "obligatoire",
-    "Something went wrong validating your input": "Une erreur s'est produite lors de la validation de votre saisie",
-    "Submit": "Soumettre",
-    "This field is required.": "Ce champ est obligatoire.",
-    "Type your answer": "Tapez votre réponse",
-    "You have exceeded the maximum number of characters allowed.": "Vous avez dépassé le nombre maximum de caractères autorisés.",
     "hints": {
         "edit": "Appuyez sur {0} pour modifier",
         "confirm": "{0} pour confirmer"
     },
     "validation": {
-        "consent_required": "Pour continuer, vous devez accepter les termes et conditions."
-    }
+        "consent_required": "Pour continuer, vous devez accepter les termes et conditions.",
+        "field_required": "Ce champ est obligatoire.",
+        "valid_email": "Veuillez saisir un email valide.",
+        "valid_link": "Veuillez entrer un lien valide.",
+        "valid_number": "S'il vous plait, entrez un nombre valide.",
+        "valid_phone": "S'il vous plaît entrer un numéro de téléphone valide.",
+        "option_required": "Veuillez sélectionner une option.",
+        "error": "Une erreur s'est produite lors de la validation de votre saisie",
+        "max_characters": "Vous avez dépassé le nombre maximum de caractères autorisés.",
+        "no_file_interaction": "Il n'y a aucune configuration valide pour accepter les fichiers",
+        "too_many_files": "Vous avez téléchargé trop de fichiers. Vous pouvez télécharger jusqu'à {maxFiles} fichiers.",
+        "file_size": "Le fichier '{fileName}' dépasse la taille maximale de {maxFileSize} Mo.",
+        "rating_required": "Veuillez choisir une note"
+    },
+    "accept_submit": "Accepter et soumettre",
+    "accept": "Accepter",
+    "close": "Fermer",
+    "type": "Tapez votre réponse",
+    "submit": "Soumettre",
+    "privacy_policy": "Politique de confidentialité",
+    "other": "Autre",
+    "next": "Suivant",
+    "legal_notice": "Mention légale",
+    "page_previous": "Aller à la page précédente",
+    "page_next": "Aller à la page suivante",
+    "form_submitted": "Formulaire soumis",
+    "find_us": "Retrouvez-nous ici",
+    "enter": "Entrer",
+    "continue": "Continuer",
+    "files_choose": "Choisir des fichiers",
+    "files_drop": "ou déposez ici"
 }
diff --git a/resources/locales/no.json b/resources/locales/no.json
index 5bf0de1b..f0c8deb7 100644
--- a/resources/locales/no.json
+++ b/resources/locales/no.json
@@ -2,34 +2,41 @@
     "admin": {
         "blocks": "ingen blokker | 1 blokk | {n} blokker"
     },
-    "Accept & Submit": "Godkjenn og send inn",
-    "Accept": "Godkjenn",
-    "Close": "Lukk",
-    "Enter": "Legg inn",
-    "Find us here": "Finn oss her",
-    "Form Submitted": "Skjema sendt inn",
-    "Go to next Page": "Gå til neste side",
-    "Go to previous Page": "Gå til forrige side",
-    "Legal Notice": "Juridisk merknad",
-    "Next": "Neste",
-    "Other": "Annet",
-    "Please enter a valid email.": "Vennligst skriv inn en gyldig e-postadresse.",
-    "Please enter a valid link.": "Vennligst skriv inn en gyldig lenke.",
-    "Please enter a valid number.": "Vennligst skriv inn et gyldig nummer.",
-    "Please enter a valid phone number.": "Vennligst skriv inn et gyldig telefonnummer.",
-    "Please select an option.": "Vennligst velg et alternativ.",
-    "Privacy Policy": "Personvern",
     "required": "påkrevd",
-    "Something went wrong validating your input": "Noe gikk galt under validering av inndataene dine",
-    "Submit": "Send inn",
-    "This field is required.": "Dette feltet er påkrevd.",
-    "Type your answer": "Skriv svaret ditt",
-    "You have exceeded the maximum number of characters allowed.": "Du har overskredet det maksimale antallet tegn som er tillatt.",
     "hints": {
         "edit": "Trykk {0} for å redigere",
         "confirm": "{0} for å bekrefte"
     },
     "validation": {
-        "consent_required": "For å fortsette, må du godta vilkårene."
-    }
+        "consent_required": "For å fortsette, må du godta vilkårene.",
+        "field_required": "Dette feltet er påkrevd.",
+        "valid_email": "Vennligst skriv inn en gyldig e-postadresse.",
+        "valid_link": "Vennligst skriv inn en gyldig lenke.",
+        "valid_number": "Vennligst skriv inn et gyldig nummer.",
+        "valid_phone": "Vennligst skriv inn et gyldig telefonnummer.",
+        "option_required": "Vennligst velg et alternativ.",
+        "error": "Noe gikk galt under validering av inndataene dine",
+        "max_characters": "Du har overskredet det maksimale antallet tegn som er tillatt.",
+        "no_file_interaction": "Det er ingen gyldig konfigurasjon for å akseptere filer",
+        "too_many_files": "Du har lastet opp for mange filer. Du kan laste opp opptil {maxFiles} filer.",
+        "file_size": "Filen '{fileName}' overskrider maksimal størrelse på {maxFileSize} MB.",
+        "rating_required": "Vennligst velg en vurdering"
+    },
+    "accept_submit": "Godkjenn og send inn",
+    "accept": "Godkjenn",
+    "close": "Lukk",
+    "type": "Skriv svaret ditt",
+    "submit": "Send inn",
+    "privacy_policy": "Personvern",
+    "other": "Annet",
+    "next": "Neste",
+    "legal_notice": "Juridisk merknad",
+    "page_previous": "Gå til forrige side",
+    "page_next": "Gå til neste side",
+    "form_submitted": "Skjema sendt inn",
+    "find_us": "Finn oss her",
+    "enter": "Legg inn",
+    "continue": "Fortsett",
+    "files_choose": "Velg filer",
+    "files_drop": "eller slipp her"
 }
diff --git a/resources/locales/pl.json b/resources/locales/pl.json
index 8bf7b500..6c5f7a5c 100644
--- a/resources/locales/pl.json
+++ b/resources/locales/pl.json
@@ -2,34 +2,41 @@
     "admin": {
         "blocks": "brak bloków | 1 blok | {n} bloków"
     },
-    "Accept & Submit": "Zaakceptuj i wyślij",
-    "Accept": "Akceptuj",
-    "Close": "Zamknij",
-    "Enter": "Enter",
-    "Find us here": "Znajdziesz nas tutaj",
-    "Form Submitted": "Formularz przesłany",
-    "Go to next Page": "Idź do następnej Strony",
-    "Go to previous Page": "Idź do poprzedniej Strony",
-    "Legal Notice": "Informacje Prawne",
-    "Next": "Następny",
-    "Other": "Inne",
-    "Please enter a valid email.": "Proszę wprowadzić prawidłowy adres e-mail.",
-    "Please enter a valid link.": "Proszę wprowadzić prawidłowy link.",
-    "Please enter a valid number.": "Proszę wprowadzić prawidłową liczbę.",
-    "Please enter a valid phone number.": "Proszę wprowadzić prawidłowy numer telefonu.",
-    "Please select an option.": "Proszę wybrać opcję.",
-    "Privacy Policy": "Polityka Prywatności",
     "required": "wymagane",
-    "Something went wrong validating your input": "Coś poszło nie tak podczas sprawdzania poprawności danych wejściowych",
-    "Submit": "Wyślij",
-    "This field is required.": "Tol pole jest wymagane.",
-    "Type your answer": "Wprowadź swoją odpowiedź",
-    "You have exceeded the maximum number of characters allowed.": "Przekroczyłeś maksymalną dozwoloną liczbę znaków.",
     "hints": {
         "edit": "Naciśnij {0} aby edytować",
         "confirm": "{0} aby potwierdzić"
     },
     "validation": {
-        "consent_required": "Aby kontynuować, musisz zaakceptować warunki."
-    }
+        "consent_required": "Aby kontynuować, musisz zaakceptować warunki.",
+        "field_required": "Tol pole jest wymagane.",
+        "valid_email": "Proszę wprowadzić prawidłowy adres e-mail.",
+        "valid_link": "Proszę wprowadzić prawidłowy link.",
+        "valid_number": "Proszę wprowadzić prawidłową liczbę.",
+        "valid_phone": "Proszę wprowadzić prawidłowy numer telefonu.",
+        "option_required": "Proszę wybrać opcję.",
+        "error": "Coś poszło nie tak podczas sprawdzania poprawności danych wejściowych",
+        "max_characters": "Przekroczyłeś maksymalną dozwoloną liczbę znaków.",
+        "no_file_interaction": "Nie ma poprawnej konfiguracji do akceptowania plików",
+        "too_many_files": "Przesłałeś zbyt wiele plików. Możesz przesłać maksymalnie {maxFiles} plików.",
+        "file_size": "Plik '{fileName}' przekracza maksymalny rozmiar {maxFileSize} MB.",
+        "rating_required": "Proszę wybrać ocenę."
+    },
+    "accept_submit": "Zaakceptuj i wyślij",
+    "accept": "Akceptuj",
+    "close": "Zamknij",
+    "type": "Wprowadź swoją odpowiedź",
+    "submit": "Wyślij",
+    "privacy_policy": "Polityka Prywatności",
+    "other": "Inne",
+    "next": "Następny",
+    "legal_notice": "Informacje Prawne",
+    "page_previous": "Idź do poprzedniej Strony",
+    "page_next": "Idź do następnej Strony",
+    "form_submitted": "Formularz przesłany",
+    "find_us": "Znajdziesz nas tutaj",
+    "enter": "Enter",
+    "continue": "Kontynuuj",
+    "files_choose": "Wybierz pliki",
+    "files_drop": "lub upuść tutaj"
 }
diff --git a/resources/locales/sk.json b/resources/locales/sk.json
index 477adbaa..210e1818 100644
--- a/resources/locales/sk.json
+++ b/resources/locales/sk.json
@@ -1,32 +1,42 @@
 {
-    "Accept & Submit": "Akceptovať a odoslať",
-    "Accept": "Akceptovať",
-    "Close": "Zavrieť",
-    "Enter": "Enter",
-    "Find us here": "Nájdete nás tu",
-    "Form Submitted": "Formulár odoslaný",
-    "Go to next Page": "Na ďalšiu stránku",
-    "Go to previous Page": "Na predošlú stránku",
-    "Legal Notice": "Pravidlá používania",
-    "Next": "Ďalej",
-    "Other": "Iné",
-    "Please enter a valid email.": "Prosíme, zadajte správnu e-mailovú adresu.",
-    "Please enter a valid link.": "Prosíme, zadajte sprvány link.",
-    "Please enter a valid number.": "Prosíme, zadajte správne číslo.",
-    "Please enter a valid phone number.": "Prosíme, zadajte správne telefónne číslo.",
-    "Please select an option.": "Prosíme, vyberte nejakú možnosť.",
-    "Privacy Policy": "Ochrana osobných údajov",
     "required": "Povinné",
-    "Something went wrong validating your input": "Niečo sa nepodarilo pri overení Vašich údajov",
-    "Submit": "Odoslať",
-    "This field is required.": "Toto pole je povinné.",
-    "Type your answer": "Zadajte Vašu odpoveď",
-    "You have exceeded the maximum number of characters allowed.": "Prekročili ste maximálny povolený počet znakov.",
     "hints": {
         "edit": "Stlač {0} pre úpravu",
         "confirm": "{0} pre potvrdenie"
     },
     "validation": {
-        "consent_required": "Pre pokračovanie je potrebný súhlas."
-    }
+        "consent_required": "Pre pokračovanie je potrebný súhlas.",
+        "field_required": "Toto pole je povinné.",
+        "valid_email": "Prosíme, zadajte správnu e-mailovú adresu.",
+        "valid_link": "Prosíme, zadajte sprvány link.",
+        "valid_number": "Prosíme, zadajte správne číslo.",
+        "valid_phone": "Prosíme, zadajte správne telefónne číslo.",
+        "option_required": "Prosíme, vyberte nejakú možnosť.",
+        "error": "Niečo sa nepodarilo pri overení Vašich údajov",
+        "max_characters": "Prekročili ste maximálny povolený počet znakov.",
+        "no_file_interaction": "Neexistuje platná konfigurácia na prijímanie súborov.",
+        "too_many_files": "Nahrali ste príliš veľa súborov. Môžete nahrať až {maxFiles} súborov.",
+        "file_size": "Súbor '{fileName}' prekračuje maximálnu veľkosť {maxFileSize} MB.",
+        "rating_required": "Prosím, vyberte si hodnotenie."
+    },
+    "admin": {
+        "blocks": "žiadne bloky | 1 blok | {n} blokov"
+    },
+    "accept_submit": "Akceptovať a odoslať",
+    "accept": "Akceptovať",
+    "close": "Zavrieť",
+    "type": "Zadajte Vašu odpoveď",
+    "submit": "Odoslať",
+    "privacy_policy": "Ochrana osobných údajov",
+    "other": "Iné",
+    "next": "Ďalej",
+    "legal_notice": "Pravidlá používania",
+    "page_previous": "Na predošlú stránku",
+    "page_next": "Na ďalšiu stránku",
+    "form_submitted": "Formulár odoslaný",
+    "find_us": "Nájdete nás tu",
+    "enter": "Enter",
+    "continue": "Pokračovať",
+    "files_choose": "Vyberte súbory",
+    "files_drop": "alebo sem spustiť"
 }
diff --git a/resources/locales/uk.json b/resources/locales/uk.json
index 362d3f83..29da7384 100644
--- a/resources/locales/uk.json
+++ b/resources/locales/uk.json
@@ -2,34 +2,41 @@
     "admin": {
         "blocks": "немає блоків | 1 блок | {n} блоків"
     },
-    "Accept & Submit": "Прийняти та відправити",
-    "Accept": "Прийняти",
-    "Close": "Закрити",
-    "Enter": "Ввести",
-    "Find us here": "Знайдіть нас тут",
-    "Form Submitted": "Форма надіслана",
-    "Go to next Page": "Перейти на наступну сторінку",
-    "Go to previous Page": "Повернутись на минулу сторінку",
-    "Legal Notice": "Юридичне повідомлення",
-    "Next": "Наступне",
-    "Other": "Інше",
-    "Please enter a valid email.": "Будь ласка, введіть правильну email адресу.",
-    "Please enter a valid link.": "Будь ласка, введіть правильне посилання.",
-    "Please enter a valid number.": "Будь ласка, введіть правильний номер.",
-    "Please enter a valid phone number.": "Будь ласка, введіть правильний номер телефона.",
-    "Please select an option.": "Будь ласка, оберіть варіант.",
-    "Privacy Policy": "Політика конфіденційності",
     "required": "необхідно",
-    "Something went wrong validating your input": "Щось пішло не так під час перевірки ваших даних",
-    "Submit": "Надіслати",
-    "This field is required.": "Це поле обов'язкове для заповнення.",
-    "Type your answer": "Введіть свою відповідь",
-    "You have exceeded the maximum number of characters allowed.": "Ви перевищили максимально допустиму кількість символів.",
     "hints": {
         "edit": "Натисніть {0} щоб відредагувати",
         "confirm": "{0} щоб підтвердити"
     },
     "validation": {
-        "consent_required": "Щоб продовжити, ви повинні погодитися з умовами та положеннями."
-    }
+        "consent_required": "Щоб продовжити, ви повинні погодитися з умовами та положеннями.",
+        "field_required": "Це поле обов'язкове для заповнення.",
+        "valid_email": "Будь ласка, введіть правильну email адресу.",
+        "valid_link": "Будь ласка, введіть правильне посилання.",
+        "valid_number": "Будь ласка, введіть правильний номер.",
+        "valid_phone": "Будь ласка, введіть правильний номер телефона.",
+        "option_required": "Будь ласка, оберіть варіант.",
+        "error": "Щось пішло не так під час перевірки ваших даних",
+        "max_characters": "Ви перевищили максимально допустиму кількість символів.",
+        "no_file_interaction": "Немає дійсної конфігурації для прийняття файлів",
+        "too_many_files": "Ви завантажили забагато файлів. Ви можете завантажити до {maxFiles} файлів.",
+        "file_size": "Файл '{fileName}' перевищує максимальний розмір {maxFileSize} МБ.",
+        "rating_required": "Будь ласка, оберіть рейтинг."
+    },
+    "accept_submit": "Прийняти та відправити",
+    "accept": "Прийняти",
+    "close": "Закрити",
+    "type": "Введіть свою відповідь",
+    "submit": "Надіслати",
+    "privacy_policy": "Політика конфіденційності",
+    "other": "Інше",
+    "next": "Наступне",
+    "legal_notice": "Юридичне повідомлення",
+    "page_previous": "Повернутись на минулу сторінку",
+    "page_next": "Перейти на наступну сторінку",
+    "form_submitted": "Форма надіслана",
+    "find_us": "Знайдіть нас тут",
+    "enter": "Ввести",
+    "continue": "Продовжуйте",
+    "files_choose": "Виберіть файли",
+    "files_drop": "або впустіть сюди"
 }
diff --git a/resources/locales/zh.json b/resources/locales/zh.json
index d4d832c3..047dd7d4 100644
--- a/resources/locales/zh.json
+++ b/resources/locales/zh.json
@@ -2,34 +2,41 @@
     "admin": {
         "blocks": "没有内容块 | 1 内容块 | {n} 内容块"
     },
-    "Accept & Submit": "接受并提交",
-    "Accept": "接受",
-    "Close": "关闭",
-    "Enter": "输入",
-    "Find us here": "在这里找到我们",
-    "Form Submitted": "表单已提交",
-    "Go to next Page": "前往下一页",
-    "Go to previous Page": "返回上一页",
-    "Legal Notice": "法律声明",
-    "Next": "下一步",
-    "Other": "其他",
-    "Please enter a valid email.": "请输入有效的邮箱。",
-    "Please enter a valid link.": "请输入有效的链接。",
-    "Please enter a valid number.": "请输入有效的数字。",
-    "Please enter a valid phone number.": "请输入有效的电话号码。",
-    "Please select an option.": "请选择一个选项。",
-    "Privacy Policy": "隐私政策",
     "required": "必填",
-    "Something went wrong validating your input": "验证您的输入时出错",
-    "Submit": "提交",
-    "This field is required.": "此字段为必填项。",
-    "Type your answer": "输入您的答案",
-    "You have exceeded the maximum number of characters allowed.": "您已超过允许的最大字符数。",
     "hints": {
         "edit": "按 {0} 进行编辑",
         "confirm": "按 {0} 确认"
     },
     "validation": {
-        "consent_required": "继续操作前，您必须同意条款和条件。"
-    }
+        "consent_required": "继续操作前，您必须同意条款和条件。",
+        "field_required": "此字段为必填项。",
+        "valid_email": "请输入有效的邮箱。",
+        "valid_link": "请输入有效的链接。",
+        "valid_number": "请输入有效的数字。",
+        "valid_phone": "请输入有效的电话号码。",
+        "option_required": "请选择一个选项。",
+        "error": "验证您的输入时出错",
+        "max_characters": "您已超过允许的最大字符数。",
+        "no_file_interaction": "没有有效的配置来接受文件",
+        "too_many_files": "您已上传了太多文件。您最多可以上传 {maxFiles} 个文件。",
+        "file_size": "文件“{fileName}”超过了 {maxFileSize} MB 的最大大小。",
+        "rating_required": "请您选择一个评分"
+    },
+    "accept_submit": "接受并提交",
+    "accept": "接受",
+    "close": "关闭",
+    "type": "输入您的答案",
+    "submit": "提交",
+    "privacy_policy": "隐私政策",
+    "other": "其他",
+    "next": "下一步",
+    "legal_notice": "法律声明",
+    "page_previous": "返回上一页",
+    "page_next": "前往下一页",
+    "form_submitted": "表单已提交",
+    "find_us": "在这里找到我们",
+    "enter": "输入",
+    "continue": "继续",
+    "files_choose": "选择文件",
+    "files_drop": "或者拖放到这里"
 }
diff --git a/routes/api.php b/routes/api.php
index 36c647d7..e5ad8107 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -14,6 +14,7 @@
 use App\Http\Controllers\Api\FormSubmitController;
 use App\Http\Controllers\Api\FormTemplateExportController;
 use App\Http\Controllers\Api\FormTemplateImportController;
+use App\Http\Controllers\Api\FormUploadController;
 use App\Http\Controllers\Api\FormWebhookController;
 use App\Http\Controllers\Api\GetFormStoryboardController;
 use App\Http\Controllers\Api\PublishFormController;
@@ -54,6 +55,7 @@
 $router->get('public/forms/{form}/storyboard', GetFormStoryboardController::class)->name('api.public.forms.storyboard');
 $router->post('public/forms/{form}/session', CreateFormSessionController::class)->name('api.public.forms.session.create');
 $router->post('public/forms/{form}', FormSubmitController::class)->name('api.public.forms.submit');
+$router->post('public/forms/{form}/upload', FormUploadController::class)->name('api.public.forms.file-upload');
 
 $router->get('routes', ZiggyController::class);
 
diff --git a/routes/web.php b/routes/web.php
index 7040e395..02c6dcef 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -1,17 +1,18 @@
 <?php
 
-use App\Http\Controllers\DashboardController;
-use App\Http\Controllers\FormDownloadTemplateController;
+use Illuminate\Routing\Router;
+use App\Http\Controllers\ImageController;
 use App\Http\Controllers\FormEditController;
-use App\Http\Controllers\FormIntegrationsController;
+use App\Http\Controllers\ViewFormController;
+use App\Http\Controllers\DashboardController;
+use App\Http\Controllers\MetaPreviewController;
+use App\Http\Controllers\MissingTeamController;
 use App\Http\Controllers\FormSettingsController;
 use App\Http\Controllers\FormSubmissionsController;
+use App\Http\Controllers\FormIntegrationsController;
+use App\Http\Controllers\FormUploadsDownloadController;
+use App\Http\Controllers\FormDownloadTemplateController;
 use App\Http\Controllers\FormSubmissionsExportController;
-use App\Http\Controllers\ImageController;
-use App\Http\Controllers\MetaPreviewController;
-use App\Http\Controllers\MissingTeamController;
-use App\Http\Controllers\ViewFormController;
-use Illuminate\Routing\Router;
 
 $router->middleware(['auth:sanctum', 'verified'])->group(function (Router $router) {
     $router->get('/', [DashboardController::class, 'show'])->name('dashboard');
@@ -28,6 +29,8 @@
     $router->get('forms/{form}/submissions-export', FormSubmissionsExportController::class)->name('forms.submissions-export');
 
     $router->get('team-missing', MissingTeamController::class)->name('teams.missing');
+
+    $router->get('/uploads/{upload}', FormUploadsDownloadController::class)->name('forms.submission-uploads.download')->middleware('signed');
 });
 
 $router->get('/images/{path}', [ImageController::class, 'show'])->where('path', '.*')->name('images.show');
diff --git a/storage/database.sqlite b/storage/database.sqlite
new file mode 100644
index 00000000..d07e00a3
Binary files /dev/null and b/storage/database.sqlite differ
diff --git a/tests/Feature/FormSessionFileUploadTest.php b/tests/Feature/FormSessionFileUploadTest.php
new file mode 100644
index 00000000..62ee8368
--- /dev/null
+++ b/tests/Feature/FormSessionFileUploadTest.php
@@ -0,0 +1,50 @@
+<?php
+
+namespace Tests\Feature;
+
+use App\Models\Form;
+use App\Models\FormSession;
+use Illuminate\Foundation\Testing\RefreshDatabase;
+use Illuminate\Http\UploadedFile;
+
+uses(RefreshDatabase::class);
+
+dataset('uploadForm', [
+    '{"description":null,"language":"en","avatar_path":null,"background_path":null,"brand_color":"#1f2937","text_color":null,"background_color":null,"eoc_text":null,"eoc_headline":null,"data_retention_days":null,"is_auto_delete_enabled":false,"legal_notice_link":null,"privacy_link":null,"cta_label":null,"cta_link":null,"cta_append_params":false,"cta_redirect_delay":0,"use_cta_redirect":false,"cta_append_session_id":false,"linkedin":null,"github":null,"instagram":null,"facebook":null,"twitter":null,"show_cta_link":false,"show_social_links":false,"use_brighter_inputs":false,"show_form_progress":false,"blocks":[{"type":"input-file","message":"<p>File Upload Test<\/p>","title":null,"options":null,"is_required":false,"is_disabled":false,"parent_block":null,"sequence":0,"formBlockInteractions":[{"type":"input","name":null,"is_editable":true,"is_disabled":false,"label":null,"options":{"allowedFileTypes":[],"allowedFiles":10,"allowedFileSize":4},"message":null,"sequence":0},{"type":"file","name":null,"is_editable":true,"is_disabled":false,"label":null,"options":{"allowedFileTypes":{"image":true,"video":true,"audio":true,"text":true},"allowedFiles":"2","allowedFileSize":"4"},"message":null,"sequence":1}]}]}',
+]);
+
+test('can upload a file through special endpoint and attach it to the session', function ($template) {
+    $form = Form::factory()->create();
+    $form->applyTemplate($template);
+
+    $session = FormSession::factory()->create(['form_id' => $form->id]);
+
+    $this->json('POST', route('api.public.forms.submit', [
+        'form' => $form->uuid,
+    ]), [
+        'token' => $session->token,
+        'payload' => [
+            ...$form->formBlocks[0]->getSubmitPayload(1),
+        ],
+    ])->assertStatus(200);
+
+    $file = UploadedFile::fake()->image('face.png');
+
+    $response = $this->json('POST', route('api.public.forms.file-upload', [
+        'form' => $form->uuid,
+    ]), [
+        'token' => $session->token,
+        'actionId' => $form->formBlocks[0]->formBlockInteractions[0]->uuid,
+        'file' => $file,
+    ])->assertStatus(201);
+
+    $form->refresh();
+
+    $this->assertCount(
+        1,
+        $form->formBlocks[0]
+            ->formBlockInteractions[0]
+            ->formSessionResponses[0]
+            ->formSessionUploads
+    );
+})->with('uploadForm');
diff --git a/tests/Feature/FormSessionTest.php b/tests/Feature/FormSessionTest.php
index d7fc7786..76fd9adb 100644
--- a/tests/Feature/FormSessionTest.php
+++ b/tests/Feature/FormSessionTest.php
@@ -75,7 +75,7 @@
     ]), [
         'token' => $session->token,
         'payload' => [
-            ...$form->formBlocks[0]->getSubmitPayload('tester@getubozt,ci'),
+            ...$form->formBlocks[0]->getSubmitPayload('tester@example.com'),
             ...$form->formBlocks[2]->getSubmitPayload([0]),
             ...$form->formBlocks[3]->getSubmitPayload([0, 1]),
         ],
@@ -105,7 +105,7 @@
     $request = [
         'token' => $session->token,
         'payload' => [
-            ...$form->formBlocks[0]->getSubmitPayload('tester@getubozt,ci'),
+            ...$form->formBlocks[0]->getSubmitPayload('tester@example.com'),
             ...$form->formBlocks[2]->getSubmitPayload([0]),
             ...$form->formBlocks[3]->getSubmitPayload([0, 1]),
         ],
@@ -173,6 +173,23 @@
     Event::assertListening(FormSessionCompletedEvent::class, FormSubmitWebhookListener::class);
 });
 
+
+test('when submitting a form with is_uploading set to true the form webhook listener is not fired', function () {
+    Event::fake();
+
+    $session = FormSession::factory()->create();
+
+    $this->json('POST', route('api.public.forms.submit', [
+        'form' => $session->form->uuid,
+    ]), [
+        'token' => $session->token,
+        'payload' => [],
+        'is_uploading' => true,
+    ])->assertStatus(200);
+
+    Event::assertNotDispatched(FormSessionCompletedEvent::class);
+});
+
 it('should delete old submissions if auto delete is enabled for the form after specified time', function ($template) {
     $form = Form::factory()->create([
         'is_auto_delete_enabled' => true,
@@ -188,7 +205,7 @@
     ]), [
         'token' => $session->token,
         'payload' => [
-            ...$form->formBlocks[0]->getSubmitPayload('tester@getubozt,ci'),
+            ...$form->formBlocks[0]->getSubmitPayload('tester@example.com'),
             ...$form->formBlocks[2]->getSubmitPayload([0]),
             ...$form->formBlocks[3]->getSubmitPayload([0, 1]),
         ],
@@ -220,7 +237,7 @@
     ]), [
         'token' => $session->token,
         'payload' => [
-            ...$form->formBlocks[0]->getSubmitPayload('tester@getubozt,ci'),
+            ...$form->formBlocks[0]->getSubmitPayload('tester@example.com'),
             ...$form->formBlocks[2]->getSubmitPayload([0]),
             ...$form->formBlocks[3]->getSubmitPayload([0, 1]),
         ],
diff --git a/tests/Feature/Interactions/FileTest.php b/tests/Feature/Interactions/FileTest.php
new file mode 100644
index 00000000..d5a88cc2
--- /dev/null
+++ b/tests/Feature/Interactions/FileTest.php
@@ -0,0 +1,39 @@
+<?php
+
+use App\Enums\FormBlockInteractionType;
+use App\Models\FormBlockInteraction;
+use Illuminate\Foundation\Testing\RefreshDatabase;
+
+uses(RefreshDatabase::class);
+
+test('can_change_settings_for_allowed_files', function () {
+    $interaction = FormBlockInteraction::factory()->create([
+        'type' => FormBlockInteractionType::file->value,
+    ]);
+
+    $response = $this->actingAs($interaction->formBlock->form->user)
+        ->json('post', route('api.interactions.update', $interaction), [
+            'options' => [
+                'allowedFiles' => 1,
+                'allowedFileSize' => 16,
+                'allowedFileTypes' => [
+                    'image' => true,
+                    'audio' => true,
+                    'video' => true,
+                    'text' => true,
+                ],
+            ],
+        ])
+        ->assertStatus(200);
+
+    $response->assertJsonFragment([
+        'allowedFiles' => 1,
+        'allowedFileSize' => 16,
+        'allowedFileTypes' => [
+            'image' => true,
+            'audio' => true,
+            'video' => true,
+            'text' => true,
+        ],
+    ]);
+});
diff --git a/tests/Feature/Interactions/InteractionsTest.php b/tests/Feature/Interactions/InteractionsTest.php
index 1e67045e..5b17d30d 100644
--- a/tests/Feature/Interactions/InteractionsTest.php
+++ b/tests/Feature/Interactions/InteractionsTest.php
@@ -22,6 +22,7 @@
     [FormBlockType::radio->value, FormBlockInteractionType::button->value],
     [FormBlockType::rating->value, FormBlockInteractionType::range->value],
     [FormBlockType::scale->value, FormBlockInteractionType::range->value],
+    [FormBlockType::file->value, FormBlockInteractionType::file->value],
 ]);
 
 test('can_create_an_interaction_for_block_type', function ($blockType, $interactionType) {
diff --git a/tests/Feature/RetrieveFormBlockMappingTest.php b/tests/Feature/RetrieveFormBlockMappingTest.php
index 55913235..15afc9c0 100644
--- a/tests/Feature/RetrieveFormBlockMappingTest.php
+++ b/tests/Feature/RetrieveFormBlockMappingTest.php
@@ -26,5 +26,6 @@
         'rating' => 'range',
         'scale' => 'range',
         'date' => 'date',
+        'input-file' => 'file',
     ]);
 });