Filament•2mo ago

Filament Docs; original code.

There's a process for automatically generating the doc-assets for use in the astro docs. It involves creating the actual Filament form used, rendering it, then Playwrite is used to take the actual screenshot that's used in the AutoScreenshot component. I'm looking for where the original Filament code is stored.

Solution:

So for example this here: https://github.com/filamentphp/filament/blob/3.x/docs-assets/app/app/Livewire/TablesDemo.php#L1227

Jump to solution

18 Replies

Dennis Koch•2mo ago

https://github.com/filamentphp/filament/tree/3.x/docs-assets/app

GitHub

filament/docs-assets/app at 3.x · filamentphp/filament

A collection of beautiful full-stack components for Laravel. The perfect starting point for your next app. Using Livewire, Alpine.js and Tailwind CSS. - filamentphp/filament

Matthew•2mo ago

Oh sorry. We were talking about screenshots before and Is sort of missed the code part 😅 I think its done here: https://github.com/filamentphp/filament/blob/3.x/docs-assets/app/app/Livewire/TablesDemo.php

GitHub

filament/docs-assets/app/app/Livewire/TablesDemo.php at 3.x · filam...

A collection of beautiful full-stack components for Laravel. The perfect starting point for your next app. Using Livewire, Alpine.js and Tailwind CSS. - filamentphp/filament

Matthew•2mo ago

At least the table part

IllizianOP•2mo ago

ah ha... so:

<AutoScreenshot name="tables/summaries" alt="Table with summaries" version="3.x" />

<AutoScreenshot name="tables/summaries" alt="Table with summaries" version="3.x" />

is here https://github.com/filamentphp/filament/blob/3.x/docs-assets/app/app/Livewire/TablesDemo.php#L1227

Solution

Matthew•2mo ago

So for example this here: https://github.com/filamentphp/filament/blob/3.x/docs-assets/app/app/Livewire/TablesDemo.php#L1227

Matthew•2mo ago

Ahahah yeah

IllizianOP•2mo ago

legend

IllizianOP•2mo ago

thanks both

Matthew•2mo ago

so summaries() is converted to tables/summaries

IllizianOP•2mo ago

all of this, was trying to work out how to do this haha

IllizianOP•2mo ago

LOL! Which is the second entry on TextColumn doc :Picardfacepalm: ....

Dennis Koch•2mo ago

It's called a "BADGE" 😅 Btw. you know the demo? https://demo.filamentphp.com/ The code is here: https://github.com/filamentphp/demo

IllizianOP•2mo ago

For some reason I was looking for a Badge column, and then I assumed it was an Icon. I'm blaming Monday :modCheck:

IllizianOP•2mo ago

https://tenor.com/bDNWE.gif

Tenor

IllizianOP•2mo ago

let's just say.... I was aware? that's beautiful. No-one share that with my PM haha :allTheThings:

Matthew•2mo ago

@Dennis Koch COuld you help with smth please? Im working on some final things on this PR. Whats left is generating the screenshots. What Ive done so far: 1) Cloned the branch locally, run npm run build and composer install 2) Under app/ I also ran npm run build and composer install and php artisan filament:assets 3) Under docs-assets/app/app/Livewire/Forms/FieldsDemo.php I added my Slider class. For example:

Group::make()
    ->id('sliderSimple')
    ->extraAttributes([
        'class' => 'p-16 max-w-xl',
    ])
    ->schema([
        Slider::make('sliderSimple')
            ->label('Slider'),
    ]),

Group::make()
    ->id('sliderSimple')
    ->extraAttributes([
        'class' => 'p-16 max-w-xl',
    ])
    ->schema([
        Slider::make('sliderSimple')
            ->label('Slider'),
    ]),

4) Under docs-assets/screenshots/schema.js I also added the path:

'forms/fields/slider/simple': {
    url: 'forms/fields',
    selector: '#sliderSimple',
    viewport: {
        width: 1920,
        height: 640,
        deviceScaleFactor: 3,
    },
},

'forms/fields/slider/simple': {
    url: 'forms/fields',
    selector: '#sliderSimple',
    viewport: {
        width: 1920,
        height: 640,
        deviceScaleFactor: 3,
    },
},

5) When I run the laravel server, I see all groups under in http://localhost:8000/forms/fields, but the Slider field is empty! The slider works fine locally Am I missing a step?

Dennis Koch•2mo ago

I have no idea. Sorry.

Matthew•2mo ago

It's oke thank you anyways. I will ratrace my commits, and see if I broke something Maybe something changed internally within filament

Gaming

Programming

Filament Docs; original code.

Did you find this page helpful?