Frontend Rikat UI Komponen

Komponen Web Reaktif Mandiri (Rikat UI)

Rikat UI adalah pustaka komponen web reaktif ultra-ringan (hanya 14.7 KB tanpa dependensi) yang disertakan langsung di njobo/js/rikat.js.

Rikat UI memungkinkan Anda membangun antarmuka interaktif yang reaktif tanpa memerlukan framework raksasa seperti React atau Vue.

Sintaksis Deklaratif

• [(model)]="namaVariabel": Two-way data binding dua arah otomatis antara input formulir dan status komponen.
• (click)="namaFungsi()": Event binding untuk menangani klik mouse, perubahan form, atau input keyboard.
• [disabled]="kondisi": Binding atribut properti HTML reaktif.

Komponen Enterprise Siap Pakai

1. Tabel Data Cerdas (<l-table>)

Menyediakan pagination, sorting kolom, dan pencarian cepat secara otomatis di sisi klien:

<l-table 
    [src]="'/api/pengguna'" 
    columns="id:ID,nama:Nama Lengkap,email:Email Pengguna,status:Status" 
    per-page="10" 
    searchable="true">
</l-table>

2. Modal Dialog Interaktif (<l-dialog>)

Komponen modal yang mudah dipicu tanpa menulis JavaScript manual:

<button (click)="bukaModal()" class="btn-primary">Buka Modal</button>

<l-dialog id="modalKonfirmasi" title="Konfirmasi Penghapusan">
    <p>Apakah Anda yakin ingin menghapus catatan ini?</p>
    <div class="flex justify-end gap-2 mt-4">
        <button class="btn-batal" (click)="tutupModal()">Batal</button>
        <button class="btn-bahaya" (click)="eksekusiHapus()">Ya, Hapus</button>
    </div>
</l-dialog>