Release Note

Catatan Rilis

Simak setiap pembaruan, penambahan fitur, serta perbaikan bug dan peningkatan performa INA Digital Design System (IDDS) di sini.

1.4.13

Release Date: Desember 2025

Versi 1.4.13 menghadirkan berbagai refinement dan perbaikan pada komponen Modal, DatePicker, dan TabHorizontal untuk meningkatkan stabilitas, konsistensi, dan pengalaman pengguna.

Perbaikan & Peningkatan

Updated Modal - Perbaikan handling overflow konten dengan implementasi word-break dan overflow-wrap untuk mencegah konten melebihi width dialog. Konten panjang tanpa spasi sekarang akan ter-wrap dengan benar sesuai dengan size variant yang ditentukan (sm, md, lg, xl)
Updated DatePicker - Perbaikan sizing dan spacing pada komponen DatePicker untuk meningkatkan konsistensi visual dan kemudahan penggunaan
Updated TabHorizontal - Refinement pada outline dan styling komponen TabHorizontal untuk meningkatkan konsistensi visual dan aksesibilitas

Perbaikan Bug

Fixed Perbaikan bug pada Modal dimana konten dengan text panjang tanpa spasi dapat melebihi width dialog dan menyebabkan overflow horizontal
Fixed Perbaikan sizing issue pada DatePicker yang mempengaruhi layout dan spacing
Fixed Perbaikan outline styling pada TabHorizontal untuk konsistensi visual yang lebih baik

Breaking Changes

Tidak ada breaking changes di versi ini. Semua perubahan bersifat backward compatible.

Migration Guide

Untuk migrasi dari versi sebelumnya, tidak diperlukan perubahan kode. Semua komponen tetap kompatibel dengan versi sebelumnya.

1.4.0

Release Date: Desember 2025

Versi 1.4.0 menghadirkan berbagai perbaikan dan peningkatan pada komponen DatePicker, ButtonGroup, dan TabHorizontal untuk meningkatkan stabilitas dan pengalaman pengguna.

Perbaikan & Peningkatan

Updated DatePicker - Peningkatan fungsionalitas dan perbaikan bug pada komponen DatePicker untuk memastikan pengalaman yang lebih baik dalam pemilihan tanggal
Updated ButtonGroup - Perbaikan dan peningkatan pada komponen ButtonGroup untuk meningkatkan konsistensi dan kemudahan penggunaan
Updated TabHorizontal - Peningkatan pada komponen TabHorizontal dengan perbaikan navigasi dan interaksi yang lebih responsif

Perbaikan Bug

Fixed Perbaikan bug pada DatePicker yang terkait dengan validasi tanggal dan format input
Fixed Perbaikan masalah pada ButtonGroup terkait dengan alignment dan spacing antar button
Fixed Perbaikan bug pada TabHorizontal yang mempengaruhi navigasi dan state management

Breaking Changes

Tidak ada breaking changes di versi ini. Semua perubahan bersifat backward compatible.

Migration Guide

Untuk migrasi dari versi sebelumnya, tidak diperlukan perubahan kode. Semua komponen tetap kompatibel dengan versi sebelumnya.

1.3.0

Release Date: November 2025

Versi 1.3.0 menghadirkan penambahan komponen baru yaitu Breadcrumb dan CardContent untuk memperluas ketersediaan komponen dalam INA Digital Design System.

Komponen Baru

Added Breadcrumb - Komponen navigasi breadcrumb yang membantu pengguna memahami lokasi mereka dalam hierarki halaman dan memudahkan navigasi kembali ke halaman sebelumnya
Added CardContent - Komponen card content yang menyediakan container fleksibel untuk menampilkan konten dengan berbagai varian dan styling options

Perbaikan & Peningkatan

Tidak ada perbaikan atau peningkatan di versi ini. Fokus utama pada penambahan komponen baru.

Perbaikan Bug

Tidak ada perbaikan bug di versi ini.

Breaking Changes

Tidak ada breaking changes di versi ini. Semua perubahan bersifat backward compatible.

Migration Guide

Untuk migrasi dari versi sebelumnya, tidak diperlukan perubahan kode. Semua komponen tetap kompatibel dengan versi sebelumnya.

1.2.2

Release Date: November 2025

Versi terbaru IDDS dengan dukungan penuh untuk React dan Vue, mencakup lebih dari 50 komponen yang siap digunakan untuk membangun aplikasi digital pemerintah Indonesia yang modern dan konsisten.

Komponen yang Tersedia

IDDS 1.2.2 menyediakan komponen-komponen berikut untuk framework React dan Vue:

Layout & Navigation:

Added Accordion, AccordionCard, AccordionGroup - Komponen accordion dengan dukungan nested dan grouping
Added Breadcrumb - Navigasi breadcrumb untuk membantu user memahami lokasi mereka
Added Drawer - Side drawer untuk navigasi dan menu
Added TabHorizontal, TabVertical - Sistem tab horizontal dan vertikal dengan berbagai varian

Data Display:

Added Avatar - Komponen avatar dengan berbagai ukuran dan varian
Added Badge - Badge untuk menampilkan status, label, atau notifikasi
Added Card - Container card dengan berbagai varian dan shadow
Added Chip - Komponen chip untuk tag, filter, dan selection
Added Table, TableProgressBar - Tabel data dengan fitur sorting, pagination, dan progress indicator
Added Skeleton - Loading skeleton untuk meningkatkan UX saat data dimuat
Added Spinner - Indikator loading dengan berbagai ukuran

Feedback:

Added Alert - Komponen alert untuk menampilkan pesan penting
Added Toast, ToastProvider (Vue) - Notifikasi toast dengan sistem provider
Added Tooltip - Tooltip untuk memberikan informasi tambahan
Added Modal - Modal dialog dengan berbagai ukuran dan varian
Added BottomSheet - Bottom sheet untuk mobile-first interactions
Added ProgressBar, LinearProgressIndicator - Indikator progress untuk proses yang sedang berjalan

Form Controls:

Added TextField, TextArea, PasswordInput - Input field dengan validasi, security config, dan berbagai fitur keamanan
Added Checkbox, RadioInput - Kontrol form untuk single dan multiple selection
Added Toggle - Switch toggle dengan berbagai ukuran dan varian
Added SelectDropdown - Dropdown select dengan search dan custom options
Added DatePicker, MonthPicker, YearPicker, TimePicker - Picker untuk tanggal dan waktu dengan berbagai format
Added PhoneInput - Input khusus untuk nomor telepon dengan validasi format
Added OneTimePassword - Input OTP dengan auto-focus dan validation
Added FileUpload, SingleFileUpload - Upload file dengan drag & drop, preview, dan validasi
Added InputSearch - Search input dengan icon dan clear button
Added Stepper - Stepper untuk multi-step form dengan validasi per step
Added MultipleChoiceGrid - Grid untuk multiple choice dengan layout yang fleksibel
Added FieldInputTable - Tabel dengan input field yang dapat diedit inline

Actions:

Added Button, ButtonGroup - Button dengan berbagai varian, ukuran, dan state
Added ActionDropdown - Dropdown untuk action menu
Added Dropdown - Dropdown menu dengan berbagai positioning options
Added Pagination - Pagination dengan berbagai ukuran dan varian

Utilities:

Added Divider - Divider untuk memisahkan konten
Added Collapse - Collapse untuk show/hide konten
Added ThemeToggle - Toggle untuk dark/light mode
Added List, ListItem, ListItemAvatar, ListItemButton, ListItemIcon, ListItemText, ListSubheader - Komponen list dengan berbagai varian

Fitur Utama

Added Dual Framework Support - Dukungan penuh untuk React dan Vue dengan API yang konsisten
Added TypeScript Support - Type definitions lengkap untuk semua komponen
Added Security Features - Built-in XSS protection dan input validation untuk TextField dan TextArea
Added Accessibility - Komponen mengikuti standar WCAG dengan ARIA attributes yang lengkap
Added Theme System - Sistem tema yang fleksibel dengan dukungan multiple brand (INAgov, PANRB, LAN, BKN, dll)
Added Responsive Design - Semua komponen dirancang mobile-first dan responsive
Added Form Validation - Sistem validasi yang powerful dengan custom rules dan real-time feedback

Perbaikan & Peningkatan

Updated Toggle Component - Perbaikan koneksi label dengan input menggunakan id prop yang dapat dikustomisasi
Updated Skeleton Component - Sinkronisasi props antara React dan Vue untuk konsistensi (rounded, color, className)
Updated TextField & TextArea - Peningkatan security config dengan sanitization dan threat detection
Updated Documentation - Dokumentasi props lengkap untuk TextField, TextArea, dan PasswordInput
Updated Brand Selector - Komponen reusable untuk memilih brand theme dengan persistensi di localStorage

Perbaikan Bug

Fixed Perbaikan Toggle di variant-two yang tidak berfungsi karena mismatch antara label for dan input id
Fixed Perbaikan props table yang tidak ter-render di halaman Text Input documentation
Fixed Perbaikan konsistensi props Skeleton antara React dan Vue untuk mendukung rounded-full
Fixed Perbaikan import order dan linter errors di berbagai file komponen

Breaking Changes

Tidak ada breaking changes di versi ini. Semua perubahan bersifat backward compatible.

Migration Guide

Untuk migrasi dari versi sebelumnya, tidak diperlukan perubahan kode. Semua komponen tetap kompatibel dengan versi sebelumnya.

1.1.0

Release Date: Oktober 2025

Added Empty State Pattern (Mobile + Desktop) - Ditambahkan versi mobile dengan dua varian CTA
Added Error State Pattern (Mobile + Desktop) - Menerapkan desain untuk keadaan kesalahan dengan pesan yang jelas
Added Loading State Pattern (Mobile + Desktop) - Menambahkan indikator loading untuk meningkatkan pengalaman pengguna
Updated Footer Section Pattern
Updated Header Pattern
Fixed Perbaikan jarak antar elemen pada Stepper (Horizontal)
Fixed Penyesuaian warna focus state pada Radio Button

IDDS 1.2.2 menyediakan komponen-komponen berikut untuk framework React dan Vue:

Layout & Navigation:

Added Accordion, AccordionCard, AccordionGroup - Komponen accordion dengan dukungan nested dan grouping
Added Breadcrumb - Navigasi breadcrumb untuk membantu user memahami lokasi mereka
Added Drawer - Side drawer untuk navigasi dan menu
Added TabHorizontal, TabVertical - Sistem tab horizontal dan vertikal dengan berbagai varian

Data Display:

Added Avatar - Komponen avatar dengan berbagai ukuran dan varian
Added Badge - Badge untuk menampilkan status, label, atau notifikasi
Added Card - Container card dengan berbagai varian dan shadow
Added Chip - Komponen chip untuk tag, filter, dan selection
Added Table, TableProgressBar - Tabel data dengan fitur sorting, pagination, dan progress indicator
Added Skeleton - Loading skeleton untuk meningkatkan UX saat data dimuat
Added Spinner - Indikator loading dengan berbagai ukuran

Feedback:

Added Alert - Komponen alert untuk menampilkan pesan penting
Added Toast, ToastProvider (Vue) - Notifikasi toast dengan sistem provider
Added Tooltip - Tooltip untuk memberikan informasi tambahan
Added Modal - Modal dialog dengan berbagai ukuran dan varian
Added BottomSheet - Bottom sheet untuk mobile-first interactions
Added ProgressBar, LinearProgressIndicator - Indikator progress untuk proses yang sedang berjalan

Form Controls:

Added TextField, TextArea, PasswordInput - Input field dengan validasi, security config, dan berbagai fitur keamanan
Added Checkbox, RadioInput - Kontrol form untuk single dan multiple selection
Added Toggle - Switch toggle dengan berbagai ukuran dan varian
Added SelectDropdown - Dropdown select dengan search dan custom options
Added DatePicker, MonthPicker, YearPicker, TimePicker - Picker untuk tanggal dan waktu dengan berbagai format
Added PhoneInput - Input khusus untuk nomor telepon dengan validasi format
Added OneTimePassword - Input OTP dengan auto-focus dan validation
Added FileUpload, SingleFileUpload - Upload file dengan drag & drop, preview, dan validasi
Added InputSearch - Search input dengan icon dan clear button
Added Stepper - Stepper untuk multi-step form dengan validasi per step
Added MultipleChoiceGrid - Grid untuk multiple choice dengan layout yang fleksibel
Added FieldInputTable - Tabel dengan input field yang dapat diedit inline

Actions:

Added Button, ButtonGroup - Button dengan berbagai varian, ukuran, dan state
Added ActionDropdown - Dropdown untuk action menu
Added Dropdown - Dropdown menu dengan berbagai positioning options
Added Pagination - Pagination dengan berbagai ukuran dan varian

Utilities:

Added Divider - Divider untuk memisahkan konten
Added Collapse - Collapse untuk show/hide konten
Added ThemeToggle - Toggle untuk dark/light mode
Added List, ListItem, ListItemAvatar, ListItemButton, ListItemIcon, ListItemText, ListSubheader - Komponen list dengan berbagai varian

Fitur Utama

Added Dual Framework Support - Dukungan penuh untuk React dan Vue dengan API yang konsisten
Added TypeScript Support - Type definitions lengkap untuk semua komponen
Added Security Features - Built-in XSS protection dan input validation untuk TextField dan TextArea
Added Accessibility - Komponen mengikuti standar WCAG dengan ARIA attributes yang lengkap
Added Theme System - Sistem tema yang fleksibel dengan dukungan multiple brand (INAgov, PANRB, LAN, BKN, dll)
Added Responsive Design - Semua komponen dirancang mobile-first dan responsive
Added Form Validation - Sistem validasi yang powerful dengan custom rules dan real-time feedback

Perbaikan & Peningkatan

Updated Toggle Component - Perbaikan koneksi label dengan input menggunakan id prop yang dapat dikustomisasi
Updated Skeleton Component - Sinkronisasi props antara React dan Vue untuk konsistensi (rounded, color, className)
Updated TextField & TextArea - Peningkatan security config dengan sanitization dan threat detection
Updated Documentation - Dokumentasi props lengkap untuk TextField, TextArea, dan PasswordInput
Updated Brand Selector - Komponen reusable untuk memilih brand theme dengan persistensi di localStorage

Perbaikan Bug

Fixed Perbaikan Toggle di variant-two yang tidak berfungsi karena mismatch antara label for dan input id
Fixed Perbaikan props table yang tidak ter-render di halaman Text Input documentation
Fixed Perbaikan konsistensi props Skeleton antara React dan Vue untuk mendukung rounded-full
Fixed Perbaikan import order dan linter errors di berbagai file komponen

Breaking Changes

Tidak ada breaking changes di versi ini. Semua perubahan bersifat backward compatible.

Migration Guide

Untuk migrasi dari versi sebelumnya, tidak diperlukan perubahan kode. Semua komponen tetap kompatibel dengan versi sebelumnya.

1.0.0

Inisial Release INA Digital Design System

Added Rilis Dokumentasi INA Digital Design System - Peluncuran tahap awal dokumentasi INA Digital Design System