<script>
import SlowTab from "./SlowTab.svelte"
let name = 'world';
let currentTab;
const tabs = ["1", "2", "3"];
</script>
<div>
<div class="tabs">
{#each tabs as tab}
<button class="tab-button" class:active={currentTab === tab} on:click={() => currentTab = tab}>Tab {tab}</button>
{/each}
<div>
{#if currentTab === "1"}
<div>Tab 1 Content</div>
{/if}
{#if currentTab === "2"}
<SlowTab />
{/if}
{#if currentTab === "3"}
<div>Tab 3 Content</div>
{/if}
</div>
</div>
</div>
<style>
.tab-button {
border: 0;
border-bottom: 2px solid #ccc;
background: white;
}
.tab-button.active {
border-color: blue;