Skip to content

Changelog

v0.1.0-beta.2 (2026-08-20)

TL;DR

Perubahan:

  • ✨ New: SimpleDisclosure (High) — kartu disclosure tanpa baris trigger terpisah, seluruh body jadi trigger
  • ✨ New: useDisclosure diekspor publik (High) — composable headless untuk membangun UI disclosure custom penuh
  • 🔧 Improved: childrenColor / color.children (Medium) — region children kini bisa diberi warna family independen dari body
  • 🔵 Low: Penyesuaian konvensi family (@/ import alias, CSS rhythm variables, icon sizing berbasis font-size) — internal, tanpa perubahan visual
  • 🔵 Low: Restrukturisasi dokumentasi internal (.claude/rules.md, .claude/architecture.md), Histoire dev preview kini pakai Tailwind preflight

Impact: 🟡 High: 2 | 🟢 Medium: 1 | 🔵 Low: 2

Backward Compatible: ✅ Ya

✨ New

SimpleDisclosure

Component disclosure baru yang menyederhanakan pola Disclosure — alih-alih baris trigger terpisah, seluruh region body itu sendiri jadi area klik, cocok dipakai saat konten body sudah cukup jelas sebagai penanda "klik untuk buka". Punya icon caret bawaan yang posisinya bisa diatur (caretPosition) atau diganti penuh lewat slot, dan bisa dicampur bebas dengan Disclosure di dalam satu Accordion yang sama.

Poin utama:

  • Trigger adalah seluruh body, bukan baris terpisah
  • caretPosition: 'left' | 'right' | 'none' | false plus slot #caret untuk override penuh
  • Kompatibel penuh dengan Accordion (single-open maupun multi-open)

Lihat: Dokumentasi SimpleDisclosure

useDisclosure — Headless API Publik

Composable state buka/tutup + ARIA props yang selama ini jadi dasar internal Disclosure kini diekspor langsung, untuk yang butuh membangun UI disclosure custom sepenuhnya tanpa markup/CSS bawaan library ini sama sekali.

Poin utama:

  • isOpen/toggle()/open()/close() plus triggerProps/panelProps siap di-spread ke elemen apa pun
  • Mendukung mode controlled (controlledOpen/onToggle) — mekanisme yang sama dipakai Disclosure/SimpleDisclosure saat nested di Accordion
  • Tidak ada dependency Card sama sekali

Lihat: Dokumentasi useDisclosure

🟢 Medium Impact

Peningkatan:

  • childrenColor/color.children tersedia di semua component dengan region children (BasicCard, Disclosure, SimpleDisclosure, NotificationCard, LoadingCard) — default tetap mengikuti family body seperti sebelumnya kalau tidak diset, jadi tidak ada perubahan visual pada pemakaian yang sudah ada

🔵 Low Impact

Perubahan:

  • Import internal dikonversi ke alias @/ di seluruh src/
  • CSS rhythm variables (--sa-gb--pad-x/-pad-y/-gap) diadopsi untuk padding/gap default — nilai sama persis, tanpa perubahan visual
  • Icon bawaan (NotificationCard, LoadingCard) kini di-size lewat font-size (mengikuti .sa-ly--root svg { width/height: 1em }), bukan width/height tetap — ukuran render tetap sama persis
  • coverage/ ditambahkan ke .gitignore
  • Histoire dev preview kini memuat Tailwind preflight (box-sizing: border-box) — memperbaiki tampilan preview yang sebelumnya sedikit meleset dari tampilan production
  • Dokumentasi internal (.claude/rules.md, .claude/architecture.md) ditambahkan; CLAUDE.md dipadatkan jadi index

v0.1.0-beta.1 (2026-07-28)

TL;DR

Perubahan:

  • ✨ New: Rilis awal (High) — BasicCard, Disclosure, Accordion, NotificationCard, LoadingCard, ProgressBar

Impact: 🟡 High: 1

Backward Compatible: ✅ Ya (rilis pertama)

✨ New

Rilis Awal

Rilis pertama vue-salayout: enam component layout siap pakai dengan styling self-contained (ter-compile penuh, tidak bergantung class dari project konsumen), palet warna berbasis CSS custom property dengan dark mode otomatis, dan region system (header/footer/tag/leftSide/rightSide/body/children) yang konsisten di seluruh component.

Poin utama:

  • BasicCard — kartu dasar dengan 7 region opsional
  • Disclosure/Accordion — kartu collapsible yang bisa dikoordinasikan single- atau multi-open
  • NotificationCard — kartu status dengan icon badge + title pill, menerima FontAwesome icon object tanpa dependency FontAwesome
  • LoadingCard/ProgressBar — indikator loading dan progress bar liquid-tube

Lihat: Dokumentasi vue-salayout