#Filament layout to livewire component

25 messages · Page 1 of 1 (latest)

opaque basin
#

hi, i've a Livewire component like this:

class InviteRegister extends Component implements HasForms
{
    use InteractsWithForms;

    public $token;

    public function mount($token)
    {
        $this->token = $token;
    }

    public function form(Form $form): Form
    {
        return $form
            ->schema([
                TextInput::make('email')
                    ->email()
                    ->required()
                    ->autocomplete(),
            ]);
    }
    

    public function render()
    {
        return view('livewire.invite-register'); 

    }
}

and iside livewire.invite-register i want to set a x-filament-panels layout.base

<div>

    Do your work, then step back. {{ $token }}

    {{ $this->form }}
    
</div>

How can i do?

Thanks

mellow fogBOT
#

To help others find answers, you can mark your question as solved via Right click solution message -> Apps -> ✅ Mark Solution

somber kernel
#

try something like: <x-filament::panels-page>

#

this is not the right one but this how to use all of the filament blade views and components

wide mortar
#

Hello, @opaque basin

#

I can help you, please DM

opaque basin
somber kernel
#

Are you rendering your custom view inside a filament panel or outside panels builder?

opaque basin
#

outside

long dagger
#

probably because the component is not extending the Page class.

opaque basin
# long dagger probably because the component is not extending the Page class.

i've not Page class here. I 've a controller and a route bindend in web.php like this:

Route::get('/invites/register/{token}', [InviteController::class, 'show'])->name('invites.register');

in the show method of controller i do this:

    function show($token)
    {
        return view('invite.show', compact('token'));
    }

and inside invite.show

<livewire:invite-register :token="$token" />
#

when i navigate the link it all works but i can't use a layout because i've the errors before

long dagger
#

I know, but you gotta keep in mind that FIlament uses livewire and not the other way around. So you have a standalone livewire component outside of the filament ecosystem.

#

You can use the forms, actions, tables packages because you can import them, but the layouts I think its confined to the filament

opaque basin
long dagger
#

create a custom page

opaque basin
#

that page should be outside the admin login

opaque basin
long dagger
#

Then you have to use css+tailwind. Create a custom theme

opaque basin
#

ok i'll try tomorrow and i give a feedback. Thanks a lot for now

long dagger
#

no prob

opaque basin
# long dagger no prob

hi Bruno! i've just create a Custom Page but it can be possibile only inside a panel. I want this page outside the login. I need this like a landing page, a register page. Not under login protection. I don't know if i'm explaing well sorry

long dagger
#

I understood perfectly, in this case you need to manually style the page, you'll need to install tailwind globally in the project (filament uses tailwind but it's style is locked inside the filament ecosystem) and build it from scratch. Imagine that you dont have filament installed.