filament tabs from blade dont have content
How can I add content to the tabs directly from blade? As it is now, Its just the tab items themselves
<x-filament::tabs x-data="{ activeTab: 'tab1' }">
<x-filament::tabs.item alpine-active="activeTab === 'tab1'" x-on:click="activeTab = 'tab1'">
Details
</x-filament::tabs.item>
<x-filament::tabs.item alpine-active="activeTab === 'tab2'" x-on:click="activeTab = 'tab2'">
Cast
</x-filament::tabs.item>
</x-filament::tabs> <x-filament::tabs x-data="{ activeTab: 'tab1' }">
<x-filament::tabs.item alpine-active="activeTab === 'tab1'" x-on:click="activeTab = 'tab1'">
Details
</x-filament::tabs.item>
<x-filament::tabs.item alpine-active="activeTab === 'tab2'" x-on:click="activeTab = 'tab2'">
Cast
</x-filament::tabs.item>
</x-filament::tabs>Solution
<div class="rounded-xl bg-white shadow-sm ring-1 ring-gray-950/5 dark:bg-gray-900 dark:ring-white/10"
x-data="{ tab: 'tab1' }">
<x-filament::tabs label="Content tabs" contained="true">
<x-filament::tabs.item @click="tab = 'tab1'" :alpine-active="'tab === \'tab1\''">
Tab 1
</x-filament::tabs.item>
<x-filament::tabs.item @click="tab = 'tab2'" :alpine-active="'tab === \'tab2\''">
Tab 2
</x-filament::tabs.item>
</x-filament::tabs>
<div class="fi-fo-tabs-tab p-6">
<div x-show="tab === 'tab1'">
content 1...
</div>
<div x-show="tab === 'tab2'">
content 2...
</div>
</div>
</div><div class="rounded-xl bg-white shadow-sm ring-1 ring-gray-950/5 dark:bg-gray-900 dark:ring-white/10"
x-data="{ tab: 'tab1' }">
<x-filament::tabs label="Content tabs" contained="true">
<x-filament::tabs.item @click="tab = 'tab1'" :alpine-active="'tab === \'tab1\''">
Tab 1
</x-filament::tabs.item>
<x-filament::tabs.item @click="tab = 'tab2'" :alpine-active="'tab === \'tab2\''">
Tab 2
</x-filament::tabs.item>
</x-filament::tabs>
<div class="fi-fo-tabs-tab p-6">
<div x-show="tab === 'tab1'">
content 1...
</div>
<div x-show="tab === 'tab2'">
content 2...
</div>
</div>
</div>
