@orochibraru/ui

Pill tab bar of links, the current page's tab highlighted.

Usage

Example.svelte

<script lang="ts">
	import FingerprintIcon from "@lucide/svelte/icons/fingerprint";
	import PaletteIcon from "@lucide/svelte/icons/palette";
	import UserRoundIcon from "@lucide/svelte/icons/user-round";

	import TabNav from "@orochibraru/ui/blocks/tab-nav";

	const tabs = [
		{ href: "/blocks/tab-nav", label: "Profile", icon: UserRoundIcon },
		{ href: "/account/appearance", label: "Appearance", icon: PaletteIcon },
		{ href: "/account/security", label: "Security", icon: FingerprintIcon },
	];
</script>

<TabNav {tabs} />