Skip to content

SaTabs — Changelog

v0.1.10 (2026-06-25)

TL;DR

Perubahan:

  • ✨ New: Scoped slot #button pada Tab (High) — kustomisasi konten tombol tab dengan akses ke object tab dan index-nya
  • ✨ New: Field badge pada TabItem + prop pulsingBadge pada Tab (High) — notification badge dot atau pill, opsional animasi ping
  • 🐛 Fix: FontAwesomeIcon dijadikan reactive object secara tidak sengaja (Low) — menyebabkan Vue warning dan overhead performa
  • 🐛 Fix: TabPanel di dalam v-for tidak terdeteksi (Low) — slot VNode dari v-for dibungkus Fragment sehingga panel tidak muncul

Impact: ✨ New: 2 | 🟡 High: 2 | 🔵 Low: 2

Backward Compatible: ✅ Ya


✨ New

Scoped Slot #button

Slot #button pada Tab memungkinkan kustomisasi penuh konten di dalam tombol tab — menggantikan default icon + label — tanpa menyentuh button element itu sendiri (ARIA, keyboard, class tetap dikelola library). Slot menerima { tab, index } sehingga kamu bisa render apapun berdasarkan data tab.

Poin utama:

  • Ganti konten tombol (icon, label, atau elemen apapun) tanpa kehilangan aksesibilitas
  • Scoped dengan tab (TabItem) dan index (posisi tombol)
  • Jika slot tidak di-pass, fallback ke rendering default (icon FontAwesome + label)

Lihat: Contoh #button Slot


Notification Badge (badge + pulsingBadge)

Field badge pada TabItem menambahkan notification badge di pojok kanan atas tombol tab. true menampilkan dot merah kecil; string menampilkan pill dengan teks tersebut. Prop pulsingBadge pada Tab mengaktifkan animasi ping pada semua badge sekaligus. Warna badge bisa di-override dari host via CSS custom property --tab-badge-bg.

Poin utama:

  • badge: true → dot, badge: 'string' → pill dengan teks
  • pulsingBadge mengontrol animasi ping secara global per instance Tab
  • Remappable via fieldMap.badge seperti field lainnya

Lihat: Contoh Notification Badge


🔵 Low Impact

Perubahan:

  • Fix: FontAwesomeIcon disimpan di shallowRef — mencegah Vue warning dan overhead reactive proxy
  • Fix: TabPanel dari v-for kini terdeteksi — Fragment VNode di-flatten sebelum filter slot children

v0.1.9 (2026-06-25)

TL;DR

Perubahan:

  • ✨ New: Prop fieldMap untuk custom field mapping (High) — support array data struktur apapun, IDE autocomplete dari tipe array

Impact: ✨ New: 1 | 🟡 High: 1

Backward Compatible: ✅ Ya


✨ New

Prop fieldMap & Generic Component

Prop fieldMap memungkinkan penggunaan array data dengan field name apapun langsung ke Tab tanpa transform manual. Component sekarang generic atas T — ketika tabs di-pass, IDE akan autocomplete nilai fieldMap dari key tipe array tersebut.

Lihat: Custom Field Mapping


v0.1.8 (2026-06-25)

TL;DR

Perubahan:

  • 🔧 Improved: Prop query-param sekarang menerima boolean (Medium) — true atau string kosong otomatis pakai key tab

Impact: 🟢 Medium: 1

Backward Compatible: ✅ Ya


🟢 Medium Impact

Peningkatan:

  • Prop query-param sekarang menerima string | booleantrue atau "" otomatis resolve ke key 'tab', tidak perlu menulis query-param="tab" secara eksplisit