GUIDE
Installation & Setup
Langkah mudah integrasi CAUI ke proyek SvelteKit Anda dengan Tailwind CSS v4.
1. Install Package
pnpm add @cecepazhar/caui
2. Import Global Tokens & CSS
Tambahkan stylesheet tokens ke root layout (src/routes/+layout.svelte):
// src/routes/+layout.svelte
import '@cecepazhar/caui/tokens.css';
import '@cecepazhar/caui/tokens.css';
3. Setup CSS Variable Brand Accent
Secara default CAUI menggunakan Monochrome Zinc. Anda dapat mengatur aksen Pro di root CSS:
:root {
--ca-brand: #06b6d4; /* Cyan CATerm / CAMark */
}
--ca-brand: #06b6d4; /* Cyan CATerm / CAMark */
}
4. Import & Gunakan Komponen
<script lang="ts">
import { Button, Badge, Switch, PinInput } from '@cecepazhar/caui';
</script>
<Button variant="primary">Connect SSH</Button>
<Badge variant="brand">Pro Active</Badge>
import { Button, Badge, Switch, PinInput } from '@cecepazhar/caui';
</script>
<Button variant="primary">Connect SSH</Button>
<Badge variant="brand">Pro Active</Badge>