khwarizmi-ui

CLI buat menyalin komponen Khwarizmi UI ke project kamu.

Komponennya bukan library yang kamu import sebagai paket runtime — source file-nya disalin ke project supaya bebas kamu ubah. Project tetap membutuhkan Svelte 5, Tailwind CSS v4, dan dependency eksternal komponen yang relevan.

Pakai

Untuk memasang semua komponen dari npm:

npx khwarizmi-ui@latest add --all

Perintah di atas membuat file-file berikut di src/lib/components/khwarizmi-ui/, mis.:

src/lib/components/khwarizmi-ui/Button.svelte
src/lib/components/khwarizmi-ui/Card.svelte
src/lib/components/khwarizmi-ui/Input.svelte
src/lib/components/khwarizmi-ui/Select.svelte

Dependency yang dibutuhkan, termasuk lucide-svelte, dipasang otomatis. CLI juga memasang stylesheet global Khwarizmi UI dan mengimpornya otomatis ke src/app.css atau src/routes/app.css. Jika tidak terdeteksi, CLI meminta path-nya.

Atau pasang komponen tertentu:

npx khwarizmi-ui add button

Beberapa sekaligus:

npx khwarizmi-ui add button card input select

Semuanya sekaligus:

npx khwarizmi-ui add --all

Lihat semua yang tersedia:

npx khwarizmi-ui list

Perintah

| Perintah | Fungsi | | --- | --- | | add <komponen...> | Pasang satu atau beberapa komponen | | add --all | Pasang semua komponen yang ada di registry | | list | Daftar komponen yang tersedia |

Opsi

| Opsi | Fungsi | | --- | --- | | --all, -a | Pasang semua komponen yang ada di registry | | --overwrite | Timpa file yang sudah ada tanpa nanya | | --cwd <path> | Jalankan di folder lain | | --no-deps | Jangan pasang dependency npm | | --help, --version | |

Cara kerjanya

1. Ambil definisi komponen dari registry.
2. Pasang stylesheet global dan import-nya sekali.
3. Tulis file ke path tujuannya, mis. src/lib/components/khwarizmi-ui/Button.svelte.
4. Pasang dependency npm yang belum ada, pakai package manager yang terdeteksi dari lockfile project kamu (npm, pnpm, yarn, atau bun).

File yang sudah ada tidak ditimpa diam-diam — kamu akan ditanya dulu, kecuali memakai --overwrite. Kalau dijalankan bukan di terminal interaktif (mis. CI), file yang sudah ada dilewati supaya aman.

Prasyarat

Komponennya dibuat untuk Svelte 5 (runes) dan Tailwind CSS v4. Sebagian komponen memakai lucide-svelte; dependency ini dipasang otomatis oleh CLI.

Catatan versi npx

Sesaat setelah rilis baru, registry npm mungkin masih menyebarkan versi terbaru. Kalau npx khwarizmi-ui masih menjalankan versi lama atau hasilnya belum sesuai, coba @latest:

npx khwarizmi-ui@latest add --all

Registry sendiri

KHWARIZMI_UI_REGISTRY=http://localhost:5173 npx khwarizmi-ui add button

Lisensi

MIT