Livewire HTML Directives Doesnt Work in Livewire/Filament Project

I have a multilingual Livewire/Filament project. The Livewire components wire directives don't work in the frontend (not related to Filament) .

Here is some information you might need to know:

• The livewire.js is loaded.
• mount and render lifecycle hooks work.
• The component's Blade file is wrapped in an empty element.

Note: The same issue occurs for all components.

I tried logging and adding dd to the click or submit methods (I tried both the submit and click approaches), but nothing was triggered.

composer.json:

    "name": "laravel/laravel",
    "type": "project",
    "description": "The skeleton application for the Laravel framework.",
    "keywords": ["laravel", "framework"],
    "license": "MIT",
    "require": {
        "php": "^8.2",
        "artesaos/seotools": "^1.3",
        "filament/filament": "^3.2",
        "filament/spatie-laravel-translatable-plugin": "^3.2",
        "laravel/framework": "^11.9",
        "laravel/tinker": "^2.9",
        "livewire/livewire": "^3.5"
    },
    "require-dev": {
        "fakerphp/faker": "^1.23",
        "laravel/pail": "^1.1",
        "laravel/pint": "^1.13",
        "laravel/sail": "^1.26",
        "mockery/mockery": "^1.6",
        "nunomaduro/collision": "^8.1",
        "phpunit/phpunit": "^11.0.1"
    },
    "autoload": {
        "files": [
            "app/helper.php"
        ],
        "psr-4": {
            "App\\": "app/",
            "Database\\Factories\\": "database/factories/",
            "Database\\Seeders\\": "database/seeders/"
        }
        
    },
    "autoload-dev": {
        "psr-4": {
            "Tests\\": "tests/"
        }
    },
    "scripts": {
        "post-autoload-dump": [
            "Illuminate\\Foundation\\ComposerScripts::postAutoloadDump",
            "@php artisan package:discover --ansi",
            "@php artisan filament:upgrade"
        ],
        "post-update-cmd": [
            "@php artisan vendor:publish --tag=laravel-assets --ansi --force"
        ],
        "post-root-package-install": [
            "@php -r \"file_exists('.env') || copy('.env.example', '.env');\""
        ],
        "post-create-project-cmd": [
            "@php artisan key:generate --ansi",
            "@php -r \"file_exists('database/database.sqlite') || touch('database/database.sqlite');\"",
            "@php artisan migrate --graceful --ansi"
        ],
        "dev": [
            "Composer\\Config::disableProcessTimeout",
            "npx concurrently -c \"#93c5fd,#c4b5fd,#fb7185,#fdba74\" \"php artisan serve\" \"php artisan queue:listen --tries=1\" \"php artisan pail --timeout=0\" \"npm run dev\" --names=server,queue,logs,vite"
        ]
    },
    "extra": {
        "laravel": {
            "dont-discover": []
        }
    },
    "config": {
        "optimize-autoloader": true,
        "preferred-install": "dist",
        "sort-packages": true,
        "allow-plugins": {
            "pestphp/pest-plugin": true,
            "php-http/discovery": true
        }
    },
    "minimum-stability": "dev",
    "prefer-stable": true,
    "repositories": [
    {
        "type": "github",
        "url": "https://github.com/lara-zeus/translatable"
    }
]
}

This is the component ContactUs:

<?php
declare(strict_types=1);

namespace App\Livewire;

use Illuminate\Support\Facades\Mail;
use Livewire\Component;

class ContactUs extends Component
{
    public $name = '';
    public $subject = '';
    public $email = '';

    public function submitForm()
    {
        dd("submitForm");
        $validatedData = $this->validate();


        try {
            // Here you would typically send an email or save to database
            // Example email sending (customize as needed)
            Mail::send([], [], function ($message) use ($validatedData) {
                $message->to('[email protected]')
                    ->subject($validatedData['subject'])
                    ->setBody(
                        "Name: {$validatedData['name']}\n"
                    );
            });

            session()->flash('success', 'Your message has been sent successfully!');
            $this->reset();
        } catch (\Exception $e) {
            dd("error");
            session()->flash('error', 'There was an error sending your message. Please try again.');
        }
    }

    public function render()
    {
        \Log::info('render called');
        return view('livewire.contact-us');
    }

    public function mount()
    {
        \Log::info('Mount called');
    }
}

and the blade related to it:

<div>
    <form wire:submit.prevent="submitForm">
        <div class="form-group col-md-6 mb-4">
            <input type="name" wire:model="name" class="form-control" id="name" placeholder="Enter Name">
            @error('name')
                <div class="error">
                    <ul class="">
                        <li>{{ $message }}</li>
                    </ul>
                </div>
            @enderror
        </div>
        <div class="form-group col-md-6 mb-4">
            <input type="subject" wire:model="subject" class="form-control" id="subject" placeholder="Enter Subject">
            @error('subject')
                <div class="error">
                    <ul class="">
                        <li>{{ $message }}</li>
                    </ul>
                </div>
            @enderror
        </div>
        <div class="form-group col-md-6 mb-4">
            <input type="email" wire:model="email" class="form-control" id="email" placeholder="Enter Email">
            @error('email')
                <div class="error">
                    <ul class="">
                        <li>{{ $message }}</li>
                    </ul>
                </div>
            @enderror
        </div>

        <div class="col-md-12">
            <button type="submit" id="submitFormId" class="btn-default">
                {{ __('frontend.sendMessageContactForm') }}
            </button>
        </div>
    </form>
</div>

would appreciate any help, thank you in advance.