Filament•3mo ago

How can I use Filament styles?

Sorry - I just started using Filament today. I want to create a custom blade view for rendering a form component. The field in question is a JSON field that stores an array of strings. I want this rendered as multiple input fields. How can I make it so the input fields match the default Filament styles? Is there a component or partial I can use? Surely I don't just to manually copy all the Tailwind strings from a filament input to match the styling? Here's my code so far:

{{-- filament.forms.components.json-array-as-html-list.blade.php --}}
<x-dynamic-component
    :component="$getFieldWrapperView()"
    :field="$field"
>

<div x-data="{ state: $wire.$entangle('data.comments') }")>
    <template x-for="(item, idx) in state" :key="idx">
        <input x-model="state[idx]" type="text" class="form-input" />
    </template>
</div>
</x-dynamic-component>

{{-- filament.forms.components.json-array-as-html-list.blade.php --}}
<x-dynamic-component
    :component="$getFieldWrapperView()"
    :field="$field"
>

<div x-data="{ state: $wire.$entangle('data.comments') }")>
    <template x-for="(item, idx) in state" :key="idx">
        <input x-model="state[idx]" type="text" class="form-input" />
    </template>
</div>
</x-dynamic-component>

// app/Filament/Resources/FeedbackResource.php
ViewField::make('comments')->view('filament.forms.components.json-array-as-html-list'),

// app/Filament/Resources/FeedbackResource.php
ViewField::make('comments')->view('filament.forms.components.json-array-as-html-list'),

Solution:

there is blade components: https://filamentphp.com/docs/3.x/support/blade-components/overview...

Jump to solution

2 Replies

Solution

Lara Zeus•3mo ago

there is blade components: https://filamentphp.com/docs/3.x/support/blade-components/overview

jamespickardOP•3mo ago

Ah, thank you. I suspect that actually wiring it in this way is going to be difficult or impossible, though.

Gaming

Programming

How can I use Filament styles?