Tabs

# Основы

Для создания вкладок можно воспользоваться компонентом moonshine::tabs.

<x-moonshine::tabs
:tabs="[
'tab_1' => 'Tab 1',
'tab_2' => 'Tab 2'
]"
:contents="[
'tab_1' => fake()->text(),
'tab_2' => fake()->text()
]"
/>
Est in ipsam blanditiis vel voluptates maiores. Vero ea non aliquam et. Voluptate earum quo fugit deserunt quidem. Nulla vero qui voluptates velit earum.
Commodi asperiores omnis aliquid optio sunt itaque perspiciatis. Quia eos corporis odio vel. Est quia asperiores rem illum rerum aliquid omnis. Ex neque et deserunt facere et debitis aut.
Через slots
<x-moonshine::tabs
:tabs="[
'tab_1' => 'Tab 1',
'tab_2' => 'Tab 2'
]"
>
<x-slot:tab_1>
{{ fake()->text() }}
</x-slot:tab_1>
<x-slot:tab_2>
{{ fake()->text() }}
</x-slot:tab_2>
</x-moonshine::tabs>
Amet error quia voluptatem quos. Dolores exercitationem eligendi dicta sit et deleniti quo. Quidem perspiciatis incidunt ad aliquam at dignissimos.
Placeat debitis assumenda magni est. Veniam omnis corrupti commodi porro possimus. Aut aut nam in veniam.

# Активная вкладка

Указать активную вкладку по умолчанию, можно задав 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"
/>
Cumque est quibusdam aut animi et libero voluptatem. Rerum ut adipisci quis dolores et. Enim id et est repellendus qui ut tempore natus.
Ullam placeat harum consequatur ad corrupti. Doloribus accusamus voluptatem aliquid voluptates ducimus. Consequuntur iste odit est magni qui accusamus.