YaiTabs - Quick Start

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@yaijs/core@latest/tabs/yai-tabs.css">

<div data-yai-tabs data-theme="default">
    <nav data-controller>
        <button data-tab-action="open" data-open="1">Tab 1</button>
        <button data-tab-action="open" data-open="2">Tab 2</button>
    </nav>
    <div data-content>
        <div data-tab="1">Content 1</div>
        <div data-tab="2">Content 2</div>
    </div>
</div>

JavaScript

import { YaiTabs } from 'https://cdn.jsdelivr.net/npm/@yaijs/core@latest/dist/yai-bundle.js';
new YaiTabs();