F
Filament•16mo ago
Prodex

How to display loading indicator in widget

Hi, is it possible to render a loading indicator for widgets while they're still loading? I tried it like this: 
<x-filament-widgets::widget>
    <x-filament::section>
      ...
    </x-filament::section>
    <div wire:loading>
        <x-filament::loading-indicator class="h-10 w-10 mx-auto" />
    </div>
</x-filament-widgets::widget>
<x-filament-widgets::widget>
    <x-filament::section>
      ...
    </x-filament::section>
    <div wire:loading>
        <x-filament::loading-indicator class="h-10 w-10 mx-auto" />
    </div>
</x-filament-widgets::widget>
3 Replies
Timster8989
Timster8989•14mo ago
Even figure this one out? Page with many widgets looks terrible when loading 😦
Prodex
ProdexOP•14mo ago
Yeah I did it like that: 
<x-filament-widgets::widget>
    <x-filament::section>
        <div wire:loading.inline>
            <x-filament::loading-indicator class="h-10 w-10 mx-auto" />
        </div>
    <!-- my widget stuff -->
    </x-filament::section>
</x-filament-widgets::widget>
<x-filament-widgets::widget>
    <x-filament::section>
        <div wire:loading.inline>
            <x-filament::loading-indicator class="h-10 w-10 mx-auto" />
        </div>
    <!-- my widget stuff -->
    </x-filament::section>
</x-filament-widgets::widget>
Timster8989
Timster8989•14mo ago
Awesome, thank you so much!

Did you find this page helpful?