@edsis/component

Angular library ini berada di library/component dan dipublikasikan dengan nama paket @edsis/component.

Library ini menggunakan pola secondary entry point per folder. Import yang disarankan adalah langsung ke subpath yang dibutuhkan, misalnya @edsis/component/button atau @edsis/chart/bar.

Build

Jalankan build library dengan perintah berikut:

bunx ng build component

Artefak build akan ditulis ke dist/component.

Penggunaan Lokal

Untuk import dari workspace ini, gunakan path berikut:

@edsis/component

Untuk komponen atau utilitas spesifik, gunakan subpath secondary entry point:

@edsis/component/button
@edsis/chart/bar
@edsis/component/icon
@edsis/theme/styles

Unit Test

Jalankan unit test library dengan perintah berikut:

bunx ng test component --watch=false

Runner test di workspace ini menggunakan Vitest melalui Angular build tooling.

Konvensi Selector

Aturan baku agar semua tim memakai mental model yang sama:

| Jenis primitif | Selector | Contoh | | ------------------------------------------------------------------------- | ---------------------------- | ---------------------------------- | | Menempel ke elemen HTML semantik (button, input, label, textarea, select) | Attribute selector | <button Button>, <input Input> | | Container/komposit tanpa padanan elemen native | Element selector | <Card>, <Dialog>, <Tabs> | | Behavior tanpa render (trigger, content marker) | Directive [Xxx] PascalCase | [PopoverTrigger], [Tooltip] |

Beberapa komponen menyediakan keduanya (Label, label[Label]) untuk markup fleksibel — gunakan bentuk attribute bila elemen native tersedia karena semantik & aksesibilitasnya gratis dari browser.

Status Dependensi @angular/material

@angular/material kini peer dependency opsional. Hanya tiga entry point yang masih memakainya:

• @edsis/component/select (MatSelect)
• @edsis/component/calendar (MatCalendar)
• @edsis/component/date-picker (MatDatepicker)

Aplikasi yang tidak mengimpor ketiganya tidak perlu menginstal @angular/material dan tidak membayar byte Material sama sekali (tree-shaking per entry point). Komponen lain (checkbox, switch, radio, toast, tooltip) sudah native/CDK.

Jalur migrasi yang direncanakan (lihat issue tracker):

1. Calendar → grid tanggal native (role="grid", navigasi panah, token locale via DI) tanpa date adapter Material.
2. DatePicker → komposisi Input + popover + Calendar.
3. SelectField → listbox di atas primitif popover/Command (pola yang sama dengan Combobox).

Migrasi ini disengaja bertahap: implementasi listbox/calendar yang terburu-buru berisiko menurunkan kualitas aksesibilitas di bawah implementasi Material yang sudah matang.