Tabs

# Basics

To create tabs, you can use the moonshine::tabs component.

<x-moonshine::tabs
    :tabs="[
        'tab_1' => 'Tab 1',
        'tab_2' => 'Tab 2'
    ]"
    :contents="[
        'tab_1' => fake()->text(),
        'tab_2' => fake()->text()
    ]"
/>

<x-moonshine::tabs
    :tabs="[
        'tab_1' => 'Tab 1',
        'tab_2' => 'Tab 2'
    ]"
    :contents="[
        'tab_1' => fake()->text(),
        'tab_2' => fake()->text()
    ]"
/>

Sint est vero et ab enim. Consequuntur iure qui distinctio dolore. Consequatur et adipisci eaque laudantium molestias non. Consequatur atque aut odio voluptates repellat placeat vitae voluptas.

Adipisci consequatur et magnam. Odio corporis maxime magnam. Provident est id expedita qui nam. Ut aut iste similique consequatur ullam a eos.

# Active tab

You can specify the default active tab by specifying active.

<x-moonshine::tabs
    :tabs="[
        'tab_1' => 'Tab 1',
        'tab_2' => 'Tab 2'
    ]"
    :contents="[
        'tab_1' => fake()->text(),
        'tab_2' => fake()->text()
    ]"
    active="tab_2"
/>

<x-moonshine::tabs
    :tabs="[
        'tab_1' => 'Tab 1',
        'tab_2' => 'Tab 2'
    ]"
    :contents="[
        'tab_1' => fake()->text(),
        'tab_2' => fake()->text()
    ]"
    active="tab_2"
/>

Dolores ea eos hic. Cum non laudantium quis libero. Et aut eius debitis laborum et magni. Impedit alias et consequatur. Tempore aut porro ex officiis reprehenderit cupiditate.

Sint ea odit vel. Eos suscipit explicabo delectus est et. Itaque et quidem expedita veniam sapiente et illum.