Tabs

You can use the Tabs and TabItem components to create tabbed interfaces. A label prop must be provided to each TabItem which will be used to display the label. Whichever tab should be active by default is specified by the value prop on the Tabs component.

Usage

		<script>
	import { Tabs, TabItem } from "@svecodocs/kit";
</script>
 
<Tabs value="First tab">
	<TabItem label="First tab">This is the first tab's content.</TabItem>
	<TabItem label="Second tab">This is the second tab's content.</TabItem>
</Tabs>
	

Examples

Simple Text

Markdown Syntax

		<script lang="ts">
	import { Button } from "@svecodocs/kit";
</script>
 
<Button onclick={() => alert("Hello!")}>Click me</Button>
	

		export async function load() {
	return {
		transactions: [],
	};
}