diff --git a/docs-assets/app/app/Livewire/Schemas/LayoutDemo.php b/docs-assets/app/app/Livewire/Schemas/LayoutDemo.php index e6752b0857..650f8e2208 100644 --- a/docs-assets/app/app/Livewire/Schemas/LayoutDemo.php +++ b/docs-assets/app/app/Livewire/Schemas/LayoutDemo.php @@ -199,6 +199,35 @@ class LayoutDemo extends Component implements HasActions, HasSchemas Tab::make('Meta'), ]), ]), + Group::make() + ->id('tabsVertical') + ->extraAttributes([ + 'class' => 'p-16 max-w-2xl', + ]) + ->schema([ + Tabs::make('Tabs') + ->statePath('tabsVertical') + ->schema([ + Tab::make('Rate Limiting') + ->schema([ + TextInput::make('hits') + ->default(30), + Select::make('period') + ->default('hour') + ->options([ + 'hour' => 'Hour', + ]), + TextInput::make('maximum') + ->default(100), + Textarea::make('notes') + ->columnSpanFull(), + ]) + ->columns(3), + Tab::make('Proxy'), + Tab::make('Meta'), + ]) + ->vertical(), + ]), Group::make() ->id('wizard') ->extraAttributes([ diff --git a/docs-assets/screenshots/images/dark/schemas/layout/tabs/vertical.jpg b/docs-assets/screenshots/images/dark/schemas/layout/tabs/vertical.jpg new file mode 100644 index 0000000000..fe01603ec2 Binary files /dev/null and b/docs-assets/screenshots/images/dark/schemas/layout/tabs/vertical.jpg differ diff --git a/docs-assets/screenshots/images/light/schemas/layout/tabs/vertical.jpg b/docs-assets/screenshots/images/light/schemas/layout/tabs/vertical.jpg new file mode 100644 index 0000000000..1b8c6052aa Binary files /dev/null and b/docs-assets/screenshots/images/light/schemas/layout/tabs/vertical.jpg differ diff --git a/docs-assets/screenshots/schema.js b/docs-assets/screenshots/schema.js index 60df2b286b..5c28e33b25 100644 --- a/docs-assets/screenshots/schema.js +++ b/docs-assets/screenshots/schema.js @@ -1542,6 +1542,15 @@ export default { deviceScaleFactor: 3, }, }, + 'schemas/layout/tabs/vertical': { + url: 'schemas/layout', + selector: '#tabsVertical', + viewport: { + width: 1920, + height: 640, + deviceScaleFactor: 3, + }, + }, 'schemas/layout/wizard/simple': { url: 'schemas/layout', selector: '#wizard', diff --git a/docs/12-components/03-tabs.md b/docs/12-components/03-tabs.md index ab3f24979a..34b4cd69c3 100644 --- a/docs/12-components/03-tabs.md +++ b/docs/12-components/03-tabs.md @@ -131,3 +131,23 @@ By default, a tab's underlying HTML tag is `