Basic Tables

Varian tata letak tabel data dasar siap pakai dengan integrasi komponen UI kit reusable (Button, Badge, Form Input, Switch, Pagination).

Default Clean Table

Tampilan tabel data standar dengan avatar pengguna, badge label peran, switch status, dan tombol aksi kit.

Anggota Tim Peran & Divisi Tingkat Akses Status Aktivasi Aksi
AR
Ahmad Rizky
ahmad.rizky@masum.xyz
Lead Frontend Admin Organisasi Aktif
CL
Clarissa Laura
clarissa.ui@masum.xyz
Product Designer Editor UI Aktif
BP
Bagus Pratama
bagus.growth@masum.xyz
Growth Marketing Viewer Pending
DN
Dimas Nugroho
dimas.ops@masum.xyz
DevOps Engineer Infra Admin Offline
Menampilkan 1 - 4 dari 24 anggota

Striped Progress Table

Gaya baris berselang-seling (odd:bg-slate-50/70) dengan progress bar, avatar kontributor, dan badge prioritas.

Inisiatif & Proyek Tim Kontributor Prioritas Penyelesaian Task Target Deadline Status Aksi
Revamp Design System V2
UI/UX • Tailwind 4 Upgrade
AR
CL
BP
+2
Urgent
Progres 84%
15 Okt 2026 Pengerjaan
Audit Keamanan & PenTest
Infra • Compliance ISO 27001
DN
AR
High
Progres 100%
28 Sep 2026 Selesai
Mobile POS App Beta
Mobile • Flutter SDK & Offline Sync
CL
+3
Normal
Progres 42%
10 Nov 2026 Sprint 3
Integrasi Payment Gateway QRIS
Backend • Webhook & Auto Settlement
BP
+1
High
Progres 65%
25 Okt 2026 Review

Dense & Bordered Table

Tabel grid rapat dengan garis pembatas sel lengkap (border-slate-200), live pulse badge, dan toggle maintenance.

Live Monitoring
ID Instance / Host Region / DC Public IP Beban CPU Penggunaan RAM Status Node Maintenance Aksi
prod-api-sg-01 Singapore (ap-se-1) 178.128.90.41
24%
4.8 GB / 16 GB Healthy
prod-db-replica-01 Jakarta (id-jkt-1) 103.11.140.22
78%
28.4 GB / 32 GB Warning
redis-cache-cluster Singapore (ap-se-1) 178.128.90.88
12%
1.9 GB / 8 GB Healthy
edge-waf-proxy-02 Tokyo (ap-ne-1) 139.162.88.19
94%
15.2 GB / 16 GB Critical

Hoverable Financial Table

Efek sorot interaktif saat mouse melayang di atas baris data transaksi keuangan, status badge berikon, dan tombol invoice.

No. Invoice Klien / Pembeli Metode Pembayaran Waktu Transaksi Nominal Status Aksi
#INV-2026-0812
PT Nusantara Solusindo
Enterprise Cloud Subscription
Transfer Bank (BCA) 07 Sep 2026, 14:22 WIB + Rp 24.500.000 Lunas
#INV-2026-0811
Creative Studio Bali
UI/UX Kit Commercial License
QRIS Dinamis 07 Sep 2026, 11:05 WIB + Rp 1.450.000 Lunas
#INV-2026-0810
IndoMedia Perkasa
Custom Dashboard Template
Kartu Kredit 06 Sep 2026, 18:30 WIB Rp 8.900.000 Menunggu
#INV-2026-0809
Global Tech Solutions
API Gateway Dedicated Tier
Virtual Account 05 Sep 2026, 09:12 WIB Rp 5.200.000 Dibatalkan

Floating Card-Row Table

Gaya tabel baris kartu terpisah (border-spacing-y-3) dengan thumbnail item, badge ekspedisi, dan tombol pelacak pesanan.

ID Pesanan Item Belanja Penerima & Alamat Ekspedisi & Resi Total Status Pengiriman Tindakan
#ORD-94812
Hari ini, 09:15
Mechanical Keyboard RGB
1x Switch Brown • +1 item lain
Muhammad Farhan
Bandung, Jawa Barat
J&T JP88291032 Rp 1.250.000 Dalam Pengiriman
#ORD-94811
Kemarin, 19:40
Wireless Headset ANC
1x Matte Black Edition
Siti Nurhaliza
Surabaya, Jawa Timur
SiCepat 003829104 Rp 850.000 Terkirim
#ORD-94810
06 Sep 2026, 14:10
Ergonomic Mouse Stand
2x Aluminium Grey Finish
Reza Anugrah
Semarang, Jawa Tengah
JNE REG2819034 Rp 420.000 Diproses