diff --git a/.github/workflows/publish-packages.yml b/.github/workflows/publish-packages.yml
index 456f164..e955be5 100644
--- a/.github/workflows/publish-packages.yml
+++ b/.github/workflows/publish-packages.yml
@@ -215,7 +215,7 @@ jobs:
${VERSION}
jar
LombokCSS
- Token-first component CSS framework — webjar distribution
+ Token-first component CSS framework — webjar distribution. Part of Lombok Ecosystem.
https://github.com/codinglombok/LombokCSS
@@ -269,7 +269,7 @@ jobs:
codinglombok.LombokCSS
${VERSION}
codinglombok
- Token-first component CSS framework — one markup, five design styles, dark mode + RTL, ~10KB gzipped
+ Token-first component CSS framework — one markup, five design styles, dark mode + RTL, ~10KB gzipped. Part of Lombok Ecosystem.
MIT
https://github.com/codinglombok/LombokCSS
https://github.com/codinglombok/LombokCSS
diff --git a/CLAUDE.md b/CLAUDE.md
new file mode 100644
index 0000000..6a87a99
--- /dev/null
+++ b/CLAUDE.md
@@ -0,0 +1,48 @@
+# CLAUDE.md — memori proyek LombokCSS
+
+Berkas ini adalah memori lintas sesi untuk Claude Code. Baca dulu sebelum bekerja,
+perbarui di akhir setiap sesi (bagian "Status & lanjutan").
+
+## Konteks
+
+- Repo `codinglombok/LombokCSS`, katalog ekosistem **01.01**, tingkat **L0**, status 🟢 LIVE, versi **0.1.9**, lisensi **MIT**.
+- Acuan normatif: **MASTERPLAN_UTAMA v3.4** (2026-09-29) — Prinsip #11 "Universal tanpa klaim aplikasi", **ADR-019**, 9 dimensi D1–D9, 12 dokumen standar per repo.
+- Dokumen standar repo: `docs/*_LombokCSS_v0.1.9.md` (masterplan, architecture, changelog, map, structure_repo, full_summary_project, guide_how_to_use, how_to_dist, development_ide, API, Lang, SPEC).
+
+## Aturan wajib (v3.4)
+
+- DILARANG di README/manifest/dokumen: "Part of Lombok", "Library #…", "component of …", "for LombokRAG/PDF/Agentic". Yang boleh: "Part of Lombok Ecosystem", "Dipakai oleh X" (bagian terpisah).
+- Audit cepat: `grep -n -i -E "part of Lombok[A-Z]|library #|component of|for Lombok(RAG|PDF|Agentic)" README.md package.json composer.json bower.json lombokcss.gemspec`
+- README wajib punya "Why this library? (Mengapa library ini?)" dan "Standards implemented".
+- Checklist D1–D9 di `docs/masterplan_…` minimal 6/9 ✅ untuk rilis publik (saat ini 6/9).
+
+## Perintah
+
+```bash
+npm ci && npm run build # dist/ dari src/
+npm test # anggaran ukuran (CSS ≤15 KB, JS ≤4 KB gzip) + SSR guard
+npx playwright test tests/behavior.spec.js # 44 test perilaku
+npm run lint # Prettier
+cp dist/lombok.js docs/assets/lombok.js # sinkron aset situs bila JS berubah
+```
+
+- `CHANGELOG.md` ditulis release-please — jangan diedit tangan; catatan masterplan masuk ke `docs/changelog_LombokCSS_v.md`.
+- Perubahan perilaku JS: perbarui `docs/SPEC_…` + test di `tests/behavior.spec.js`.
+
+## Status & lanjutan
+
+Sesi 2026-09-30 (branch `claude/affectionate-sagan-o4rxmx`) — penyelarasan v3.4:
+
+- [x] 12 dokumen standar + checklist universalitas (6/9)
+- [x] README: Why this library, Standards implemented, ekosistem = peer
+- [x] Deskripsi manifest npm/Composer/Bower/gem/NuGet/Maven + "Part of Lombok Ecosystem"
+- [x] `lombok.js`: sortir tabel via `Intl.Collator` dari `lang` terdekat (+2 test)
+
+Belum selesai (lanjutkan di sesi berikut):
+
+- [ ] Pemilik: ubah deskripsi GitHub About (teks ada di `docs/masterplan_…` §6)
+- [ ] C-02: email kontak nyata di `SECURITY.md` (masih placeholder) — butuh keputusan pemilik
+- [ ] C-03: hapus folder `package/` (salinan lama, tidak dipublikasikan)
+- [ ] C-04: SBOM + provenance npm di workflow rilis (target 0.2.0)
+- [ ] C-06: rename `docs/*_v0.1.9.md` saat versi minor naik
+- [ ] D8: tooltip & validasi form opsional; D5 → ✅ setelah C-02 + C-04
diff --git a/README.md b/README.md
index 1818bb8..4fe0afc 100644
--- a/README.md
+++ b/README.md
@@ -4,6 +4,9 @@
> A modern, **token-first** component CSS framework. Drop a class, get a working
> component — like Bootstrap. Re-theme everything by changing **one attribute** —
> like a design system. Ships at **~9.7 KB gzipped** (full build, minified).
+>
+> Universal CSS framework for any web UI, on any device — part of the
+> [Lombok Ecosystem](https://github.com/codinglombok).
```text
Component-based (Bootstrap) + Token-driven theming (design systems) + Tiny (Pico/UnoCSS)
@@ -43,7 +46,7 @@ Component-based (Bootstrap) + Token-driven theming (design systems) + Tiny (
[](https://github.com/codinglombok/LombokCSS/actions/workflows/ci.yml)
[](https://github.com/codinglombok/LombokCSS/actions/workflows/linter.yml)
[](https://github.com/codinglombok/LombokCSS/actions/workflows/visual.yml)
-[](https://github.com/codinglombok/LombokCSS/tree/main/tests)
+[](https://github.com/codinglombok/LombokCSS/tree/main/tests)
[](https://github.com/codinglombok/LombokCSS/blob/main/package.json)
[](https://conventionalcommits.org)
[](https://prettier.io)
@@ -64,6 +67,10 @@ Component-based (Bootstrap) + Token-driven theming (design systems) + Tiny (
## Lombok Ecosystem
+Libraries that work well alongside LombokCSS — optional peers, not owners.
+LombokCSS has zero runtime dependencies and is a standalone library that
+belongs to no single application or framework.
+
[](https://github.com/codinglombok/LombokClarion)
[](https://github.com/codinglombok/LombokCharts)
[](https://github.com/codinglombok/LombokQRCode)
@@ -77,6 +84,35 @@ Component-based (Bootstrap) + Token-driven theming (design systems) + Tiny (
---
+## Why this library?
+
+**For whom:** web developers, designers, agencies, product teams and hardware
+makers who ship a browser UI — from a one-page landing site or a router/IoT
+admin panel served from flash, to a SaaS dashboard, an e-government form or an
+enterprise design system.
+
+**The problem:** most CSS frameworks bake one look into every component, so a
+rebrand, a dark mode or an RTL locale means overriding hundreds of rules or
+rewriting markup. Utility-first frameworks avoid that, but move the styling
+into every HTML attribute and need a build step.
+
+**Why LombokCSS instead:**
+
+- **One markup, five design styles** — switch the whole look with a single
+ `data-style` attribute; dark mode (`data-theme`) and RTL (`dir`) compose
+ independently with every style.
+- **Tiny and dependency-free** — ~9.7 KB gzipped CSS plus an optional ~3 KB JS;
+ works from a CDN, npm, Composer, RubyGems or a plain file copy, with no build
+ step.
+- **Runs anywhere a browser engine runs** — desktop and mobile browsers,
+ WebViews in iOS/Android apps, Electron/Tauri desktop apps, SSR frameworks,
+ kiosks and embedded device panels.
+- **Standards-based** — CSS logical properties, native ``/``,
+ WAI-ARIA patterns, `prefers-color-scheme` / `prefers-reduced-motion`, and
+ BCP-47 `lang` / `dir` (see [Standards implemented](#standards-implemented)).
+
+---
+
## Documentation
| | |
@@ -343,6 +379,17 @@ Modern CSS used with graceful fallbacks: `:has()`, `:user-invalid`,
properties, native ``/``. Components ship with visible
`:focus-visible` rings, ARIA hooks, and respect `prefers-reduced-motion`.
+## Standards implemented
+
+| Area | Standard |
+| --------------------- | -------------------------------------------------------------------------------------------- |
+| Accessibility | WCAG 2.2 level AA colour contrast for built-in styles; WAI-ARIA 1.2 roles and states |
+| Interaction patterns | WAI-ARIA Authoring Practices: tabs, dialog (modal), disclosure, sortable table |
+| Layout & writing mode | CSS Logical Properties and Values (RTL via `dir`) |
+| User preferences | Media Queries Level 5: `prefers-color-scheme`, `prefers-reduced-motion` |
+| Language | BCP 47 language tags — table sort collates by the nearest `lang` attribute (`Intl.Collator`) |
+| HTML | WHATWG HTML Living Standard: native ``, ``, form validation states |
+
## Testing
Visual-regression + behavior tests run via Playwright in CI:
diff --git a/bower.json b/bower.json
index 0ed567d..525e817 100644
--- a/bower.json
+++ b/bower.json
@@ -1,6 +1,6 @@
{
"name": "lombokcss",
- "description": "Token-first component CSS framework. One markup, five design styles, dark mode + RTL.",
+ "description": "Token-first component CSS framework. One markup, five design styles, dark mode + RTL. Part of Lombok Ecosystem.",
"main": "dist/lombok.min.css",
"license": "MIT",
"homepage": "https://github.com/codinglombok/lombokcss",
diff --git a/composer.json b/composer.json
index e4f46b7..814d809 100644
--- a/composer.json
+++ b/composer.json
@@ -1,6 +1,6 @@
{
"name": "codinglombok/lombokcss",
- "description": "Token-first component CSS framework. One markup, five design styles, dark mode + RTL. ~9.7KB gzipped.",
+ "description": "Token-first component CSS framework. One markup, five design styles, dark mode + RTL. ~9.7KB gzipped. Part of Lombok Ecosystem.",
"type": "library",
"license": "MIT",
"keywords": [
diff --git a/dist/lombok.js b/dist/lombok.js
index 983ce31..fbdc472 100644
--- a/dist/lombok.js
+++ b/dist/lombok.js
@@ -216,11 +216,26 @@
);
});
+ /* Collator for the BCP-47 language nearest to el (lang="sv", "de", …), so
+ text sorts the way readers of that language expect; numeric: true orders
+ "Item 2" before "Item 10". An unknown or malformed tag falls back to the
+ runtime default instead of throwing a RangeError. */
+ function collator(el) {
+ var host = el.closest("[lang]"),
+ opts = { numeric: true };
+ try {
+ return new Intl.Collator((host && host.getAttribute("lang")) || undefined, opts);
+ } catch {
+ return new Intl.Collator(undefined, opts);
+ }
+ }
+
/* Table sort: click sorts its column (string/number aware) */
d.querySelectorAll("table.table thead th[aria-sort]").forEach(function (th) {
th.addEventListener("click", function () {
var table = th.closest("table"),
- tbody = table.tBodies[0];
+ tbody = table.tBodies[0],
+ cmp = collator(table).compare;
var idx = Array.prototype.indexOf.call(th.parentNode.children, th);
var asc = th.getAttribute("aria-sort") !== "ascending";
th.parentNode.querySelectorAll("th[aria-sort]").forEach(function (o) {
@@ -233,7 +248,7 @@
y = b.cells[idx].textContent.trim();
var nx = parseFloat(x),
ny = parseFloat(y);
- var r = !isNaN(nx) && !isNaN(ny) ? nx - ny : x.localeCompare(y);
+ var r = !isNaN(nx) && !isNaN(ny) ? nx - ny : cmp(x, y);
return asc ? r : -r;
});
rows.forEach(function (r) {
diff --git a/docs/API_LombokCSS_v0.1.9.md b/docs/API_LombokCSS_v0.1.9.md
new file mode 100644
index 0000000..51dca4c
--- /dev/null
+++ b/docs/API_LombokCSS_v0.1.9.md
@@ -0,0 +1,61 @@
+# API Reference — LombokCSS v0.1.9
+
+| Atribut | Nilai |
+| --- | --- |
+| Repo | [codinglombok/LombokCSS](https://github.com/codinglombok/LombokCSS) |
+| Versi library | 0.1.9 |
+| Tingkat / cluster | L0 · 01 Frontend, UI & Visualisasi Data (katalog 01.01) |
+| Acuan | MASTERPLAN_UTAMA v3.4 (2026-09-29) · ARCHITECTURE_UTAMA v3.4 · ADR-019 |
+| Tanggal dokumen | 2026-09-30 |
+| Lisensi | MIT (kebijakan §10: framework CSS) |
+
+Dokumen standar: [Masterplan](masterplan_LombokCSS_v0.1.9.md) · [Architecture](architecture_LombokCSS_v0.1.9.md) · [Changelog](changelog_LombokCSS_v0.1.9.md) · [Map](map_LombokCSS_v0.1.9.md) · [Structure Repo](structure_repo_LombokCSS_v0.1.9.md) · [Full Summary Project](full_summary_project_LombokCSS_v0.1.9.md) · [Guide How to Use](guide_how_to_use_LombokCSS_v0.1.9.md) · [How to Dist](how_to_dist_LombokCSS_v0.1.9.md) · [Development Ide](development_ide_LombokCSS_v0.1.9.md) · [API Reference](API_LombokCSS_v0.1.9.md) · [Bahasa (i18n)](Lang_LombokCSS_v0.1.9.md) · [Behavioral Specification](SPEC_LombokCSS_v0.1.9.md)
+
+---
+
+## 1. Atribut global
+
+| Atribut | Elemen | Nilai |
+| --- | --- | --- |
+| `data-style` | `` atau kontainer | `modern-corporate-flat` · `resonant-stark` · `neo-brutalism` · `semantic-minimalist` · `glassmorphism` |
+| `data-theme` | `` atau kontainer | `light` · `dark` |
+| `dir` | `` | `ltr` · `rtl` |
+| `lang` | elemen mana pun | Tag BCP 47 (collation sortir tabel) |
+
+## 2. Token (CSS custom properties)
+
+| Kelompok | Token |
+| --- | --- |
+| Warna permukaan & teks | `--lc-bg` `--lc-surface` `--lc-surface-2` `--lc-text` `--lc-text-muted` `--lc-text-faint` `--lc-border` `--lc-border-strong` `--lc-border-width` |
+| Aksen | `--lc-accent` `--lc-accent-hover` `--lc-accent-active` `--lc-accent-text` `--lc-accent-soft` `--lc-accent-soft-text` `--lc-ring` |
+| Status | `--lc-{success,warning,danger,info}` + `-soft` + `-text` |
+| Bentuk & efek | `--lc-radius-sm` `--lc-radius` `--lc-radius-lg` `--lc-radius-full` `--lc-shadow-sm` `--lc-shadow` `--lc-shadow-lg` `--lc-shadow-hard` `--lc-blur` `--lc-glass-tint` `--lc-glass-border` `--lc-transition` |
+| Tipografi | `--lc-font-sans` `--lc-font-display` `--lc-font-mono` `--lc-text-{xs,sm,base,lg,xl,2xl,3xl,4xl}` `--lc-weight-{normal,medium,semibold,bold}` `--lc-leading-{tight,normal,relaxed}` `--lc-tracking` |
+| Ruang & tata letak | `--lc-space-{0,1,2,3,4,5,6,8,10,12}` `--lc-container` `--lc-navbar-h` |
+| Lapisan | `--lc-z-{base,dropdown,sticky,modal,toast,tooltip}` |
+
+## 3. Kelas komponen
+
+Lihat [Full Summary](full_summary_project_LombokCSS_v0.1.9.md) §2 dan situs docs
+(`components.html`, `forms.html`, `utilities.html`). Status visual: `.is-open`, `.is-active`, `.is-valid`, `.is-invalid`.
+
+## 4. JavaScript (`dist/lombok.js`)
+
+| Hook | Perilaku |
+| --- | --- |
+| `[data-dropdown-toggle]` dalam `.dropdown` | Toggle `.is-open`, `aria-expanded`; Esc & klik luar menutup |
+| `[role=tablist] [role=tab][aria-controls]` | `aria-selected`, panel `hidden` |
+| `[data-modal-open="id"]` / `[data-modal-close]` | `showModal()` / `close()` pada ``; klik backdrop menutup |
+| `[data-drawer-open="id"]` / `[data-drawer-close]` | Drawer/offcanvas |
+| `[data-popover-toggle]` dalam `.popover` | Toggle `.is-open`; Esc menutup |
+| `.navbar-toggle` dalam `.navbar` | Toggle `.is-open` |
+| `.carousel` (`.carousel-track`, `.carousel-prev/next`, `.carousel-dots`) | Geser per slide, sadar RTL |
+| `table.table thead th[aria-sort]` | Sortir kolom: angka numerik, teks via `Intl.Collator(lang terdekat, {numeric:true})` |
+
+```ts
+Lombok.toast(msg: string, opts?: { variant?: "success"|"warning"|"danger"|"info"; timeout?: number /* ms, default 3500 */ }): HTMLElement
+```
+
+## 5. Ekspor paket npm
+
+`lombokcss` → `dist/lombok.js` · `lombokcss/css` → `dist/lombok.min.css` · `lombokcss/css-full` → `dist/lombok.css` · `lombokcss/js` · `lombokcss/src/*`.
diff --git a/docs/Lang_LombokCSS_v0.1.9.md b/docs/Lang_LombokCSS_v0.1.9.md
new file mode 100644
index 0000000..320751c
--- /dev/null
+++ b/docs/Lang_LombokCSS_v0.1.9.md
@@ -0,0 +1,39 @@
+# Bahasa (i18n) — LombokCSS v0.1.9
+
+| Atribut | Nilai |
+| --- | --- |
+| Repo | [codinglombok/LombokCSS](https://github.com/codinglombok/LombokCSS) |
+| Versi library | 0.1.9 |
+| Tingkat / cluster | L0 · 01 Frontend, UI & Visualisasi Data (katalog 01.01) |
+| Acuan | MASTERPLAN_UTAMA v3.4 (2026-09-29) · ARCHITECTURE_UTAMA v3.4 · ADR-019 |
+| Tanggal dokumen | 2026-09-30 |
+| Lisensi | MIT (kebijakan §10: framework CSS) |
+
+Dokumen standar: [Masterplan](masterplan_LombokCSS_v0.1.9.md) · [Architecture](architecture_LombokCSS_v0.1.9.md) · [Changelog](changelog_LombokCSS_v0.1.9.md) · [Map](map_LombokCSS_v0.1.9.md) · [Structure Repo](structure_repo_LombokCSS_v0.1.9.md) · [Full Summary Project](full_summary_project_LombokCSS_v0.1.9.md) · [Guide How to Use](guide_how_to_use_LombokCSS_v0.1.9.md) · [How to Dist](how_to_dist_LombokCSS_v0.1.9.md) · [Development Ide](development_ide_LombokCSS_v0.1.9.md) · [API Reference](API_LombokCSS_v0.1.9.md) · [Bahasa (i18n)](Lang_LombokCSS_v0.1.9.md) · [Behavioral Specification](SPEC_LombokCSS_v0.1.9.md)
+
+---
+
+## 1. Ringkasan i18n
+
+LombokCSS **tidak mengirim string UI sendiri**: semua teks (label tombol, isi toast,
+judul) ditulis pemakai di HTML/JS. Karena itu katalog pesan Core-20 (Prinsip #6) tidak
+berlaku untuk library ini; yang berlaku adalah dukungan tata tulis dan urutan bahasa.
+
+| Kemampuan | Status |
+| --- | --- |
+| Arah tulisan RTL (Arab, Ibrani, Persia, Urdu) | ✅ CSS logical properties; carousel sadar `dir` |
+| Urutan alfabet per bahasa (sortir tabel) | ✅ `Intl.Collator` dari atribut `lang` terdekat (BCP 47) |
+| Angka dalam teks ("Item 2" < "Item 10") | ✅ `numeric: true` |
+| Font skrip non-Latin | ⏳ pakai `--lc-font-sans`; tidak ada font bawaan |
+| Katalog pesan | N/A — tidak ada pesan bawaan |
+
+## 2. Contoh
+
+```html
+
+
+```
+
+## 3. Aturan fallback
+
+Tag `lang` kosong, tidak ada, atau tidak valid → collation default runtime (tidak melempar error).
diff --git a/docs/SPEC_LombokCSS_v0.1.9.md b/docs/SPEC_LombokCSS_v0.1.9.md
new file mode 100644
index 0000000..f225de7
--- /dev/null
+++ b/docs/SPEC_LombokCSS_v0.1.9.md
@@ -0,0 +1,32 @@
+# Behavioral Specification — LombokCSS v0.1.9
+
+| Atribut | Nilai |
+| --- | --- |
+| Repo | [codinglombok/LombokCSS](https://github.com/codinglombok/LombokCSS) |
+| Versi library | 0.1.9 |
+| Tingkat / cluster | L0 · 01 Frontend, UI & Visualisasi Data (katalog 01.01) |
+| Acuan | MASTERPLAN_UTAMA v3.4 (2026-09-29) · ARCHITECTURE_UTAMA v3.4 · ADR-019 |
+| Tanggal dokumen | 2026-09-30 |
+| Lisensi | MIT (kebijakan §10: framework CSS) |
+
+Dokumen standar: [Masterplan](masterplan_LombokCSS_v0.1.9.md) · [Architecture](architecture_LombokCSS_v0.1.9.md) · [Changelog](changelog_LombokCSS_v0.1.9.md) · [Map](map_LombokCSS_v0.1.9.md) · [Structure Repo](structure_repo_LombokCSS_v0.1.9.md) · [Full Summary Project](full_summary_project_LombokCSS_v0.1.9.md) · [Guide How to Use](guide_how_to_use_LombokCSS_v0.1.9.md) · [How to Dist](how_to_dist_LombokCSS_v0.1.9.md) · [Development Ide](development_ide_LombokCSS_v0.1.9.md) · [API Reference](API_LombokCSS_v0.1.9.md) · [Bahasa (i18n)](Lang_LombokCSS_v0.1.9.md) · [Behavioral Specification](SPEC_LombokCSS_v0.1.9.md)
+
+---
+
+Kontrak normatif perilaku `dist/lombok.js` (ADR-015). Kata **HARUS/TIDAK BOLEH** bersifat
+normatif. Setiap butir diuji di `tests/behavior.spec.js` (kolom Test = blok `describe`).
+
+| ID | Aturan | Test |
+| --- | --- | --- |
+| S-01 | Mengimpor skrip tanpa `document` (SSR) TIDAK BOLEH melempar dan TIDAK BOLEH menyentuh API browser | `scripts/ssr-check.mjs` |
+| S-02 | Skrip TIDAK BOLEH melakukan permintaan jaringan atau memakai storage | tinjauan kode |
+| S-03 | Dropdown: klik `[data-dropdown-toggle]` HARUS men-toggle `.is-open` pada `.dropdown` terdekat dan menyetel `aria-expanded`; klik di luar dan `Escape` HARUS menutup | dropdown |
+| S-04 | Tabs: klik tab HARUS menyetel `aria-selected="true"` padanya, `"false"` pada lainnya, dan hanya panel `aria-controls`-nya yang tidak `hidden` | tabs |
+| S-05 | Modal: `[data-modal-open=id]` HARUS memanggil `showModal()` pada ``; `[data-modal-close]` dan klik backdrop HARUS menutup | modal |
+| S-06 | Drawer, popover, navbar: toggle `.is-open` pada kontainer terdekat; popover HARUS tertutup oleh `Escape` | drawer / popover / navbar |
+| S-07 | Carousel HARUS bergerak ke indeks slide target (bukan delta), dibatasi [0, n−1], dan membalik arah bila `dir="rtl"` | carousel |
+| S-08 | Sortir tabel: klik `th[aria-sort]` HARUS mengurutkan `tBodies[0]` naik, klik kedua turun; `th` lain direset ke `none`; sel satu baris tetap bersama | table sort |
+| S-09 | Sortir tabel: bila kedua nilai numerik HARUS dibandingkan sebagai angka; selain itu HARUS memakai `Intl.Collator` untuk `lang` terdekat dengan `numeric: true` | table sort |
+| S-10 | Tag `lang` tidak valid TIDAK BOLEH melempar; HARUS jatuh ke collation default | table sort |
+| S-11 | `Lombok.toast(msg, opts)` HARUS membuat `.toast-region[aria-live=polite]` bila belum ada, menambah elemen `role=status` berisi `msg` sebagai teks (bukan HTML), dan menghapusnya setelah `opts.timeout` (default 3500 ms) | toast |
+| S-12 | Tidak ada exception tak tertangkap selama interaksi mana pun | `afterEach` global |
diff --git a/docs/architecture_LombokCSS_v0.1.9.md b/docs/architecture_LombokCSS_v0.1.9.md
new file mode 100644
index 0000000..be8664c
--- /dev/null
+++ b/docs/architecture_LombokCSS_v0.1.9.md
@@ -0,0 +1,64 @@
+# Architecture — LombokCSS v0.1.9
+
+| Atribut | Nilai |
+| --- | --- |
+| Repo | [codinglombok/LombokCSS](https://github.com/codinglombok/LombokCSS) |
+| Versi library | 0.1.9 |
+| Tingkat / cluster | L0 · 01 Frontend, UI & Visualisasi Data (katalog 01.01) |
+| Acuan | MASTERPLAN_UTAMA v3.4 (2026-09-29) · ARCHITECTURE_UTAMA v3.4 · ADR-019 |
+| Tanggal dokumen | 2026-09-30 |
+| Lisensi | MIT (kebijakan §10: framework CSS) |
+
+Dokumen standar: [Masterplan](masterplan_LombokCSS_v0.1.9.md) · [Architecture](architecture_LombokCSS_v0.1.9.md) · [Changelog](changelog_LombokCSS_v0.1.9.md) · [Map](map_LombokCSS_v0.1.9.md) · [Structure Repo](structure_repo_LombokCSS_v0.1.9.md) · [Full Summary Project](full_summary_project_LombokCSS_v0.1.9.md) · [Guide How to Use](guide_how_to_use_LombokCSS_v0.1.9.md) · [How to Dist](how_to_dist_LombokCSS_v0.1.9.md) · [Development Ide](development_ide_LombokCSS_v0.1.9.md) · [API Reference](API_LombokCSS_v0.1.9.md) · [Bahasa (i18n)](Lang_LombokCSS_v0.1.9.md) · [Behavioral Specification](SPEC_LombokCSS_v0.1.9.md)
+
+---
+
+## 1. Prinsip
+
+- **Token dulu:** komponen hanya membaca token semantik (`--lc-surface`, `--lc-text`, `--lc-accent`, …). Gaya desain = kumpulan nilai token.
+- **Tiga sumbu independen:** `data-style` (identitas), `data-theme` (terang/gelap), `dir` (LTR/RTL). Semua kombinasi valid.
+- **Zero dependency runtime** (Prinsip #7); JS opsional dan degradasi mulus.
+- **Dependensi searah & tanpa klaim** (Prinsip #9, #11): L0, tidak bergantung pada library, framework, maupun aplikasi apa pun.
+
+## 2. Lapisan sumber
+
+Urutan konkatenasi di `scripts/build-css.mjs` (urutan = kaskade):
+
+| # | Berkas | Isi |
+| --- | --- | --- |
+| 1 | `src/variables.css` | Token primitif & semantik, default terang, `prefers-color-scheme` |
+| 2 | `src/core.css` | Reset, tipografi classless, fokus, `prefers-reduced-motion` |
+| 3 | `src/themes.css` | Lima gaya desain + override gelap per gaya |
+| 4 | `src/components.css` | Komponen (hanya membaca token) |
+| 5 | `src/utilities.css` | Kelas utilitas |
+| 6 | `src/print.css` | Lapisan cetak |
+
+`dist/lombok.css` = konkatenasi; `dist/lombok.min.css` = minifikasi `lightningcss` (Node API).
+`src/lombok.js` disalin apa adanya ke `dist/lombok.js`.
+
+## 3. JavaScript opsional
+
+IIFE tanpa dependensi; keluar lebih awal bila `document` tidak ada (aman untuk SSR).
+Dua pola wiring:
+
+- **Delegasi di `document`** (bekerja untuk markup yang ditambahkan kemudian): dropdown, modal, drawer, popover, navbar.
+- **Sekali saat parse** (`querySelectorAll`): tabs, carousel, sortir tabel, backdrop dialog.
+
+API global satu-satunya: `window.Lombok.toast()`.
+
+## 4. Anggaran & kualitas
+
+| Gerbang | Alat | Batas |
+| --- | --- | --- |
+| Ukuran | `scripts/size-check.mjs` | CSS ≤ 15 KB gzip, JS ≤ 4 KB gzip |
+| SSR | `scripts/ssr-check.mjs` | Impor tanpa DOM tidak melempar |
+| Perilaku | `tests/behavior.spec.js` (Playwright) | 44 test |
+| Visual | `tests/visual.spec.js` | Baseline per gaya × tema |
+| Lint | Super-Linter, Prettier | CSS, JS, JSON, YAML, Markdown |
+
+## 5. Keputusan arsitektur yang relevan
+
+| ADR | Dampak pada LombokCSS |
+| --- | --- |
+| ADR-015 | Perilaku JS dinormatifkan di [SPEC](SPEC_LombokCSS_v0.1.9.md) dan diuji `behavior.spec.js` |
+| ADR-019 | README/manifest tanpa klaim kepemilikan aplikasi; checklist D1–D9 di masterplan |
diff --git a/docs/assets/lombok.js b/docs/assets/lombok.js
index 983ce31..fbdc472 100644
--- a/docs/assets/lombok.js
+++ b/docs/assets/lombok.js
@@ -216,11 +216,26 @@
);
});
+ /* Collator for the BCP-47 language nearest to el (lang="sv", "de", …), so
+ text sorts the way readers of that language expect; numeric: true orders
+ "Item 2" before "Item 10". An unknown or malformed tag falls back to the
+ runtime default instead of throwing a RangeError. */
+ function collator(el) {
+ var host = el.closest("[lang]"),
+ opts = { numeric: true };
+ try {
+ return new Intl.Collator((host && host.getAttribute("lang")) || undefined, opts);
+ } catch {
+ return new Intl.Collator(undefined, opts);
+ }
+ }
+
/* Table sort: click sorts its column (string/number aware) */
d.querySelectorAll("table.table thead th[aria-sort]").forEach(function (th) {
th.addEventListener("click", function () {
var table = th.closest("table"),
- tbody = table.tBodies[0];
+ tbody = table.tBodies[0],
+ cmp = collator(table).compare;
var idx = Array.prototype.indexOf.call(th.parentNode.children, th);
var asc = th.getAttribute("aria-sort") !== "ascending";
th.parentNode.querySelectorAll("th[aria-sort]").forEach(function (o) {
@@ -233,7 +248,7 @@
y = b.cells[idx].textContent.trim();
var nx = parseFloat(x),
ny = parseFloat(y);
- var r = !isNaN(nx) && !isNaN(ny) ? nx - ny : x.localeCompare(y);
+ var r = !isNaN(nx) && !isNaN(ny) ? nx - ny : cmp(x, y);
return asc ? r : -r;
});
rows.forEach(function (r) {
diff --git a/docs/changelog_LombokCSS_v0.1.9.md b/docs/changelog_LombokCSS_v0.1.9.md
new file mode 100644
index 0000000..0326b13
--- /dev/null
+++ b/docs/changelog_LombokCSS_v0.1.9.md
@@ -0,0 +1,28 @@
+# Changelog — LombokCSS v0.1.9
+
+| Atribut | Nilai |
+| --- | --- |
+| Repo | [codinglombok/LombokCSS](https://github.com/codinglombok/LombokCSS) |
+| Versi library | 0.1.9 |
+| Tingkat / cluster | L0 · 01 Frontend, UI & Visualisasi Data (katalog 01.01) |
+| Acuan | MASTERPLAN_UTAMA v3.4 (2026-09-29) · ARCHITECTURE_UTAMA v3.4 · ADR-019 |
+| Tanggal dokumen | 2026-09-30 |
+| Lisensi | MIT (kebijakan §10: framework CSS) |
+
+Dokumen standar: [Masterplan](masterplan_LombokCSS_v0.1.9.md) · [Architecture](architecture_LombokCSS_v0.1.9.md) · [Changelog](changelog_LombokCSS_v0.1.9.md) · [Map](map_LombokCSS_v0.1.9.md) · [Structure Repo](structure_repo_LombokCSS_v0.1.9.md) · [Full Summary Project](full_summary_project_LombokCSS_v0.1.9.md) · [Guide How to Use](guide_how_to_use_LombokCSS_v0.1.9.md) · [How to Dist](how_to_dist_LombokCSS_v0.1.9.md) · [Development Ide](development_ide_LombokCSS_v0.1.9.md) · [API Reference](API_LombokCSS_v0.1.9.md) · [Bahasa (i18n)](Lang_LombokCSS_v0.1.9.md) · [Behavioral Specification](SPEC_LombokCSS_v0.1.9.md)
+
+---
+
+Catatan rilis resmi yang ditulis release-please ada di [`CHANGELOG.md`](../CHANGELOG.md).
+Dokumen ini mencatat perubahan terkait masterplan, entri terbaru di depan.
+
+## Belum dirilis — penyelarasan MASTERPLAN_UTAMA v3.4
+
+- `docs/`: 12 dokumen standar `*_LombokCSS_v0.1.9.md` (§5.1) dengan checklist universalitas D1–D9, skor 6/9 (§5.2).
+- README: bagian "Why this library? (Mengapa library ini?)", "Standards implemented", label ekosistem sebagai peer (ADR-019).
+- Manifest (`package.json`, `composer.json`, `bower.json`, `lombokcss.gemspec`, NuGet/Maven di `publish-packages.yml`): "Part of Lombok Ecosystem".
+- `lombok.js`: sortir tabel memakai `Intl.Collator` dari atribut `lang` terdekat (BCP 47), `numeric: true`, fallback aman; +2 test perilaku.
+
+## 0.1.9 — 2026-08-24
+
+- Sinkronisasi pipeline publish semua registry GitHub Packages.
diff --git a/docs/development_ide_LombokCSS_v0.1.9.md b/docs/development_ide_LombokCSS_v0.1.9.md
new file mode 100644
index 0000000..d281fa0
--- /dev/null
+++ b/docs/development_ide_LombokCSS_v0.1.9.md
@@ -0,0 +1,38 @@
+# Development Ide / Arah Pengembangan — LombokCSS v0.1.9
+
+| Atribut | Nilai |
+| --- | --- |
+| Repo | [codinglombok/LombokCSS](https://github.com/codinglombok/LombokCSS) |
+| Versi library | 0.1.9 |
+| Tingkat / cluster | L0 · 01 Frontend, UI & Visualisasi Data (katalog 01.01) |
+| Acuan | MASTERPLAN_UTAMA v3.4 (2026-09-29) · ARCHITECTURE_UTAMA v3.4 · ADR-019 |
+| Tanggal dokumen | 2026-09-30 |
+| Lisensi | MIT (kebijakan §10: framework CSS) |
+
+Dokumen standar: [Masterplan](masterplan_LombokCSS_v0.1.9.md) · [Architecture](architecture_LombokCSS_v0.1.9.md) · [Changelog](changelog_LombokCSS_v0.1.9.md) · [Map](map_LombokCSS_v0.1.9.md) · [Structure Repo](structure_repo_LombokCSS_v0.1.9.md) · [Full Summary Project](full_summary_project_LombokCSS_v0.1.9.md) · [Guide How to Use](guide_how_to_use_LombokCSS_v0.1.9.md) · [How to Dist](how_to_dist_LombokCSS_v0.1.9.md) · [Development Ide](development_ide_LombokCSS_v0.1.9.md) · [API Reference](API_LombokCSS_v0.1.9.md) · [Bahasa (i18n)](Lang_LombokCSS_v0.1.9.md) · [Behavioral Specification](SPEC_LombokCSS_v0.1.9.md)
+
+---
+
+## 1. Lingkungan
+
+- Node ≥ 18, npm; Python 3 untuk `build_docs.py`.
+- Editor: `.editorconfig` + Prettier (`npm run format`).
+- Chromium Playwright untuk test (`npx playwright test`).
+
+## 2. Konvensi
+
+- Komponen **hanya** membaca token semantik `--lc-*`; nilai mentah hanya di `variables.css`/`themes.css`.
+- Pakai logical properties (`margin-inline-start`, bukan `margin-left`) agar RTL gratis.
+- Gaya gelap wajib meng-override token status `*-soft` dan `*-text`.
+- Perilaku JS baru wajib: tercatat di [SPEC](SPEC_LombokCSS_v0.1.9.md), punya test di `behavior.spec.js`, muat anggaran 4 KB.
+- Commit: Conventional Commits.
+
+## 3. Arah pengembangan
+
+| Arah | Alasan (dimensi) |
+| --- | --- |
+| SBOM + provenance npm di rilis | D5, Prinsip #8 |
+| Paket token W3C Design Tokens (JSON) | D3/D4 — alat desain & library lain (mis. LombokCharts) dapat membaca token yang sama |
+| Tooltip, validasi form opsional | D8 — menutup gap vs Bootstrap |
+| Gaya ke-6 bertema aksesibilitas kontras tinggi (`forced-colors`) | D9 |
+| Hapus folder `package/` | Kebersihan repo (C-03) |
diff --git a/docs/full_summary_project_LombokCSS_v0.1.9.md b/docs/full_summary_project_LombokCSS_v0.1.9.md
new file mode 100644
index 0000000..9584e1b
--- /dev/null
+++ b/docs/full_summary_project_LombokCSS_v0.1.9.md
@@ -0,0 +1,58 @@
+# Full Summary Project — LombokCSS v0.1.9
+
+| Atribut | Nilai |
+| --- | --- |
+| Repo | [codinglombok/LombokCSS](https://github.com/codinglombok/LombokCSS) |
+| Versi library | 0.1.9 |
+| Tingkat / cluster | L0 · 01 Frontend, UI & Visualisasi Data (katalog 01.01) |
+| Acuan | MASTERPLAN_UTAMA v3.4 (2026-09-29) · ARCHITECTURE_UTAMA v3.4 · ADR-019 |
+| Tanggal dokumen | 2026-09-30 |
+| Lisensi | MIT (kebijakan §10: framework CSS) |
+
+Dokumen standar: [Masterplan](masterplan_LombokCSS_v0.1.9.md) · [Architecture](architecture_LombokCSS_v0.1.9.md) · [Changelog](changelog_LombokCSS_v0.1.9.md) · [Map](map_LombokCSS_v0.1.9.md) · [Structure Repo](structure_repo_LombokCSS_v0.1.9.md) · [Full Summary Project](full_summary_project_LombokCSS_v0.1.9.md) · [Guide How to Use](guide_how_to_use_LombokCSS_v0.1.9.md) · [How to Dist](how_to_dist_LombokCSS_v0.1.9.md) · [Development Ide](development_ide_LombokCSS_v0.1.9.md) · [API Reference](API_LombokCSS_v0.1.9.md) · [Bahasa (i18n)](Lang_LombokCSS_v0.1.9.md) · [Behavioral Specification](SPEC_LombokCSS_v0.1.9.md)
+
+---
+
+## 1. Ringkasan
+
+LombokCSS menggabungkan pendekatan komponen (seperti Bootstrap) dengan theming berbasis
+token (seperti design system) dalam paket kecil (seperti Pico). Satu atribut mengganti
+identitas visual seluruh halaman tanpa menyentuh HTML.
+
+| Metrik | Nilai |
+| --- | --- |
+| Versi | 0.1.9 |
+| CSS min + gzip | ~9,7 KB (anggaran 15 KB) |
+| JS gzip | ~3,1 KB (anggaran 4 KB) |
+| Dependensi runtime | 0 |
+| Gaya desain | 5 |
+| Test perilaku | 44 (Playwright) |
+| Skor universalitas | 6/9 |
+
+## 2. Fitur
+
+Komponen: accordion, alert, avatar, badge, breadcrumb, button (+group), card, carousel,
+checkbox/switch, drawer/offcanvas, dropdown, field/input/select/textarea/file, input-group,
+list-group, modal (``), navbar, pagination, popover, progress, sidebar, skeleton,
+spinner, stat, steps, table (striped/hover/bordered/sortable), tabs, timeline, toast.
+Ditambah utilitas, mode classless, lapisan cetak, mode gelap, RTL.
+
+## 3. Tabel gap vs pembanding
+
+| Kemampuan | LombokCSS | Bootstrap 5 | Pico | Bulma | DaisyUI |
+| --- | --- | --- | --- | --- | --- |
+| Ganti identitas visual tanpa ubah HTML | ✅ 5 gaya | ❌ | ❌ | ❌ | ✅ (butuh Tailwind build) |
+| Mode gelap | ✅ | ✅ | ✅ | ✅ | ✅ |
+| RTL tanpa build terpisah | ✅ logical props | ❌ (CSS RTL terpisah) | ✅ | ❌ | ✅ |
+| Tanpa build step | ✅ | ✅ | ✅ | ✅ | ❌ |
+| Ukuran gzip | ~10 KB | ~25 KB + JS | ~10 KB | ~25 KB | tergantung |
+| Tooltip JS | ❌ (popover saja) | ✅ | ❌ | ❌ | ✅ CSS |
+| Scrollspy | ❌ | ✅ | ❌ | ❌ | ❌ |
+| Validasi form JS | ❌ (state CSS saja) | ✅ | ❌ | ❌ | ❌ |
+| Sortir tabel sadar-bahasa | ✅ | ❌ | ❌ | ❌ | ❌ |
+| Lapisan cetak | ✅ | sebagian | ❌ | ❌ | ❌ |
+
+## 4. Status
+
+🟢 LIVE di npm dan GitHub Packages; kepatuhan MASTERPLAN_UTAMA v3.4 diselaraskan pada
+branch ini. Temuan terbuka: lihat [Masterplan](masterplan_LombokCSS_v0.1.9.md) §5.
diff --git a/docs/guide_how_to_use_LombokCSS_v0.1.9.md b/docs/guide_how_to_use_LombokCSS_v0.1.9.md
new file mode 100644
index 0000000..d4494d5
--- /dev/null
+++ b/docs/guide_how_to_use_LombokCSS_v0.1.9.md
@@ -0,0 +1,75 @@
+# Guide How to Use — LombokCSS v0.1.9
+
+| Atribut | Nilai |
+| --- | --- |
+| Repo | [codinglombok/LombokCSS](https://github.com/codinglombok/LombokCSS) |
+| Versi library | 0.1.9 |
+| Tingkat / cluster | L0 · 01 Frontend, UI & Visualisasi Data (katalog 01.01) |
+| Acuan | MASTERPLAN_UTAMA v3.4 (2026-09-29) · ARCHITECTURE_UTAMA v3.4 · ADR-019 |
+| Tanggal dokumen | 2026-09-30 |
+| Lisensi | MIT (kebijakan §10: framework CSS) |
+
+Dokumen standar: [Masterplan](masterplan_LombokCSS_v0.1.9.md) · [Architecture](architecture_LombokCSS_v0.1.9.md) · [Changelog](changelog_LombokCSS_v0.1.9.md) · [Map](map_LombokCSS_v0.1.9.md) · [Structure Repo](structure_repo_LombokCSS_v0.1.9.md) · [Full Summary Project](full_summary_project_LombokCSS_v0.1.9.md) · [Guide How to Use](guide_how_to_use_LombokCSS_v0.1.9.md) · [How to Dist](how_to_dist_LombokCSS_v0.1.9.md) · [Development Ide](development_ide_LombokCSS_v0.1.9.md) · [API Reference](API_LombokCSS_v0.1.9.md) · [Bahasa (i18n)](Lang_LombokCSS_v0.1.9.md) · [Behavioral Specification](SPEC_LombokCSS_v0.1.9.md)
+
+---
+
+## 1. Pasang
+
+```html
+Simpan
+Tersimpan.
+
+```
+
+## 4. Rebrand dengan token
+
+```css
+:root { --lc-accent: #0f766e; --lc-radius: 0.25rem; --lc-font-sans: "Inter", system-ui; }
+```
+
+## 5. Komponen interaktif (butuh `lombok.js`)
+
+```html
+Buka
+Tutup .md` (temuan C-06).
+
+## 4. Deskripsi registry (ADR-019)
+
+Semua field deskripsi menyebut fungsi universal + "Part of Lombok Ecosystem" dan tidak
+boleh menyebut aplikasi/framework sebagai pemilik.
diff --git a/docs/map_LombokCSS_v0.1.9.md b/docs/map_LombokCSS_v0.1.9.md
new file mode 100644
index 0000000..1c9727a
--- /dev/null
+++ b/docs/map_LombokCSS_v0.1.9.md
@@ -0,0 +1,57 @@
+# Map — LombokCSS v0.1.9
+
+| Atribut | Nilai |
+| --- | --- |
+| Repo | [codinglombok/LombokCSS](https://github.com/codinglombok/LombokCSS) |
+| Versi library | 0.1.9 |
+| Tingkat / cluster | L0 · 01 Frontend, UI & Visualisasi Data (katalog 01.01) |
+| Acuan | MASTERPLAN_UTAMA v3.4 (2026-09-29) · ARCHITECTURE_UTAMA v3.4 · ADR-019 |
+| Tanggal dokumen | 2026-09-30 |
+| Lisensi | MIT (kebijakan §10: framework CSS) |
+
+Dokumen standar: [Masterplan](masterplan_LombokCSS_v0.1.9.md) · [Architecture](architecture_LombokCSS_v0.1.9.md) · [Changelog](changelog_LombokCSS_v0.1.9.md) · [Map](map_LombokCSS_v0.1.9.md) · [Structure Repo](structure_repo_LombokCSS_v0.1.9.md) · [Full Summary Project](full_summary_project_LombokCSS_v0.1.9.md) · [Guide How to Use](guide_how_to_use_LombokCSS_v0.1.9.md) · [How to Dist](how_to_dist_LombokCSS_v0.1.9.md) · [Development Ide](development_ide_LombokCSS_v0.1.9.md) · [API Reference](API_LombokCSS_v0.1.9.md) · [Bahasa (i18n)](Lang_LombokCSS_v0.1.9.md) · [Behavioral Specification](SPEC_LombokCSS_v0.1.9.md)
+
+---
+
+## 1. Posisi di peta ekosistem
+
+```text
+A Aplikasi ── boleh menyatakan "menggunakan LombokCSS"
+P Framework ── boleh menyatakan "menggunakan LombokCSS"
+L1 LombokUI ── dependensi wajib: LombokCSS, LombokIcons, LombokAnimate
+══ BATAS KLAIM (ADR-019) ══
+L0 LombokCSS ── tanpa dependensi; tidak mengaku milik entitas di atasnya
+```
+
+## 2. Dependensi
+
+| Jenis | Daftar |
+| --- | --- |
+| Wajib (runtime) | — (nol) |
+| Opsional (runtime) | — |
+| Dev | `lightningcss`, `prettier`, `@playwright/test` |
+| Peer yang bekerja berdampingan | LombokIcons, LombokAnimate, LombokCharts, LombokTableSheet (tanpa integrasi kode) |
+
+## 3. Contoh dependen (bukan pemilik)
+
+| Repo | Tingkat | Hubungan |
+| --- | --- | --- |
+| LombokUI | L1 | Katalog v3.4 mencantumkan LombokCSS sebagai dependensi wajib |
+
+## 4. Peta distribusi
+
+| Kanal | Nama |
+| --- | --- |
+| npm | `lombokcss` |
+| CDN | jsDelivr / unpkg `lombokcss` |
+| Packagist | `codinglombok/lombokcss` |
+| RubyGems (GPR) | `lombokcss` |
+| Bower | `lombokcss` |
+| NuGet (GPR) | `codinglombok.LombokCSS` |
+| Maven (GPR) | `com.github.codinglombok:lombokcss` |
+| Container (GHCR) | `ghcr.io/codinglombok/lombokcss` |
+| SourceForge | mirror `lombokcss` |
+
+## 5. Peta platform
+
+Browser desktop/mobile evergreen · WebView iOS/Android · Electron/Tauri · SSR (Node) · panel web perangkat embedded (kiosk, router, gateway IoT).
diff --git a/docs/masterplan_LombokCSS_v0.1.9.md b/docs/masterplan_LombokCSS_v0.1.9.md
new file mode 100644
index 0000000..58ddb1d
--- /dev/null
+++ b/docs/masterplan_LombokCSS_v0.1.9.md
@@ -0,0 +1,94 @@
+# Masterplan — LombokCSS v0.1.9
+
+| Atribut | Nilai |
+| --- | --- |
+| Repo | [codinglombok/LombokCSS](https://github.com/codinglombok/LombokCSS) |
+| Versi library | 0.1.9 |
+| Tingkat / cluster | L0 · 01 Frontend, UI & Visualisasi Data (katalog 01.01) |
+| Acuan | MASTERPLAN_UTAMA v3.4 (2026-09-29) · ARCHITECTURE_UTAMA v3.4 · ADR-019 |
+| Tanggal dokumen | 2026-09-30 |
+| Lisensi | MIT (kebijakan §10: framework CSS) |
+
+Dokumen standar: [Masterplan](masterplan_LombokCSS_v0.1.9.md) · [Architecture](architecture_LombokCSS_v0.1.9.md) · [Changelog](changelog_LombokCSS_v0.1.9.md) · [Map](map_LombokCSS_v0.1.9.md) · [Structure Repo](structure_repo_LombokCSS_v0.1.9.md) · [Full Summary Project](full_summary_project_LombokCSS_v0.1.9.md) · [Guide How to Use](guide_how_to_use_LombokCSS_v0.1.9.md) · [How to Dist](how_to_dist_LombokCSS_v0.1.9.md) · [Development Ide](development_ide_LombokCSS_v0.1.9.md) · [API Reference](API_LombokCSS_v0.1.9.md) · [Bahasa (i18n)](Lang_LombokCSS_v0.1.9.md) · [Behavioral Specification](SPEC_LombokCSS_v0.1.9.md)
+
+---
+
+## 1. Identitas & posisi
+
+**LombokCSS** adalah framework CSS komponen berbasis token yang universal: satu markup,
+lima gaya desain (`modern-corporate-flat`, `resonant-stark`, `neo-brutalism`,
+`semantic-minimalist`, `glassmorphism`), mode gelap dan RTL sebagai sumbu independen.
+Ukuran ~9,7 KB gzip (CSS) + JS opsional ~3 KB gzip; nol dependensi runtime.
+
+Posisi (netral-domain): lapisan presentasi untuk UI berbasis mesin browser apa pun.
+LombokCSS adalah produk mandiri — **bukan komponen dari aplikasi atau framework mana pun**
+(Prinsip #11, ADR-019). Aplikasi/framework yang memakainya dicatat hanya sebagai
+*contoh pemakai* di [Map](map_LombokCSS_v0.1.9.md).
+
+## 2. Skenario pemakaian (Prinsip #1)
+
+| # | Skenario | Pemakai |
+| --- | --- | --- |
+| 1 | Situs landing/marketing & dokumentasi statis tanpa build step (CDN) | Indie developer, agensi |
+| 2 | Dasbor SaaS / panel admin dengan rebrand via token dan mode gelap | Startup, tim produk |
+| 3 | Formulir layanan publik bilingual, termasuk bahasa RTL (Arab) | E-government |
+| 4 | Panel web perangkat (router, gateway IoT, kiosk/HMI) yang disajikan dari flash terbatas | Pembuat hardware |
+| 5 | Aplikasi hibrid di WebView iOS/Android, Electron/Tauri | Tim mobile/desktop |
+| 6 | Design system perusahaan: satu set komponen, beberapa merek (gaya kustom) | Enterprise |
+| 7 | Dokumen cetak (invoice, laporan) lewat lapisan `print.css` | Semua |
+
+## 3. Checklist Universalitas (ADR-019)
+
+| Dimensi | Status | Keterangan |
+| --- | --- | --- |
+| D1 — Multi-kebutuhan | ✅ | 7 skenario di §2: landing, dasbor, e-gov RTL, panel perangkat, WebView, design system, cetak |
+| D2 — Multi-platform | ✅ | Browser desktop & mobile evergreen, WebView iOS/Android, Electron/Tauri, SSR (Next/Nuxt/Astro/SvelteKit — impor aman tanpa DOM, diuji `scripts/ssr-check.mjs`), panel web perangkat embedded |
+| D3 — Multi-bahasa | ✅ | Aset CSS/JS bahasa-agnostik; distribusi identik (byte sama) lewat npm, Composer, RubyGems, Bower, NuGet & Maven (GitHub Packages), container, CDN jsDelivr/unpkg |
+| D4 — Ekosistem Lombok | N/A | L0 zero-dependency by design; tidak memakai library Lombok lain. Bekerja berdampingan (peer opsional) dengan LombokIcons, LombokAnimate, LombokCharts, LombokTableSheet |
+| D5 — Keamanan | ⏳ | CodeQL, OSSAR, Defender for DevOps, dependency-review, action di-pin SHA, JS tanpa jaringan/storage. Belum ada SBOM rilis; kontak email di `SECURITY.md` masih placeholder (temuan C-02) |
+| D6 — Keunikan (SOTA) | ✅ | Satu markup → lima gaya desain via satu atribut `data-style`, dikomposisi dengan `data-theme` dan `dir`; pembanding (Bootstrap, Bulma, Pico, DaisyUI) mengikat tampilan ke komponen atau ke build step |
+| D7 — Skala pengguna | ✅ | Indie (CDN satu baris) → startup (npm) → enterprise (override token/gaya kustom, paket GitHub Packages) |
+| D8 — Kelengkapan | ⏳ | 40+ komponen, utilitas, mode classless, lapisan cetak, tabel sortir sadar-bahasa. Gap vs Bootstrap: tooltip JS, scrollspy, validasi form JS, date picker (lihat [Full Summary](full_summary_project_LombokCSS_v0.1.9.md) §3) |
+| D9 — Standar internasional | ✅ | WCAG 2.2 AA (kontras gaya bawaan), WAI-ARIA 1.2 + APG (tabs, dialog, disclosure, sortable table), CSS Logical Properties, Media Queries L5, BCP 47 (`lang` → `Intl.Collator`), WHATWG HTML (``, ``) |
+
+Skor: **6/9 ✅** (D1, D2, D3, D6, D7, D9) — memenuhi ambang rilis registry publik (≥6/9).
+Penilaian mandiri; belum ada review independen.
+
+## 4. Kepatuhan dokumen & README (MASTERPLAN_UTAMA v3.4 §5)
+
+| Syarat | Status |
+| --- | --- |
+| 12 dokumen standar (§5.1) | ✅ `docs/*_LombokCSS_v0.1.9.md` |
+| Checklist universalitas (§5.2) | ✅ §3 dokumen ini |
+| README "Why this library? (Mengapa library ini?)" (§5.3) | ✅ |
+| README "Standards implemented" | ✅ |
+| README "Lombok Ecosystem" berlabel peer, bukan pemilik | ✅ |
+| Deskripsi manifest (npm, Composer, gem, Bower, NuGet, Maven) tanpa klaim aplikasi + "Part of Lombok Ecosystem" | ✅ |
+| Deskripsi GitHub (About) | ⏳ Perlu diubah manual oleh pemilik (lihat §6) |
+| Audit pola terlarang (ARCHITECTURE v3.4 §4) | ✅ nol kecocokan (`part of Lombok[A-Z]`, `library #`, `component of`, `for Lombok(RAG\|PDF\|Agentic)`) |
+
+## 5. Temuan audit repo (v3.4)
+
+| ID | Temuan | Severity | Status |
+| --- | --- | --- | --- |
+| C-01 | README belum memuat bagian "Mengapa library ini?" & "Standar" (U-004) | 🟡 Rendah | ✅ Diperbaiki |
+| C-02 | `SECURITY.md` memakai email placeholder `security@your-domain.example` | 🟠 Sedang | ❌ OPEN — pemilik perlu menetapkan alamat nyata |
+| C-03 | Folder `package/` adalah salinan lama (README & dist tidak sinkron dengan root) dan tidak dipakai `files` npm | 🟡 Rendah | ❌ OPEN — usul dihapus |
+| C-04 | Belum ada SBOM di rilis (Prinsip #8) | 🟡 Rendah | ❌ OPEN — target 0.2.0 |
+| C-05 | Sortir tabel memakai `localeCompare()` tanpa locale → urutan tidak sesuai bahasa halaman (Prinsip #6, D9) | 🟡 Rendah | ✅ Diperbaiki: `Intl.Collator` dari `lang` terdekat, `numeric: true`, fallback aman untuk tag rusak (+2 test) |
+| C-06 | Nama dokumen standar mengikat versi; release-please tidak mengganti nama berkas | 🟡 Rendah | ❌ OPEN — rename manual saat rilis minor |
+
+## 6. Tindakan manual pemilik
+
+1. GitHub → Settings → About, deskripsi:
+ `Universal token-first CSS framework — one markup, five design styles, dark mode + RTL, ~10 KB gzip, zero dependencies. Part of Lombok Ecosystem. MIT.`
+2. Isi alamat kontak keamanan nyata di `SECURITY.md` (C-02).
+
+## 7. Roadmap
+
+| Versi | Fokus |
+| --- | --- |
+| 0.1.x | Kepatuhan v3.4 (dokumen, README, manifest), perbaikan bug |
+| 0.2.0 | SBOM + provenance di rilis; hapus `package/`; tooltip & validasi form opsional; dokumen di-rename ke v0.2.0 |
+| 0.3.0 | Paket token (JSON, W3C Design Tokens format) untuk dikonsumsi alat desain & library lain |
+| 1.0.0 | API kelas & token dibekukan (semver penuh) |
diff --git a/docs/structure_repo_LombokCSS_v0.1.9.md b/docs/structure_repo_LombokCSS_v0.1.9.md
new file mode 100644
index 0000000..3b415a6
--- /dev/null
+++ b/docs/structure_repo_LombokCSS_v0.1.9.md
@@ -0,0 +1,35 @@
+# Structure Repo — LombokCSS v0.1.9
+
+| Atribut | Nilai |
+| --- | --- |
+| Repo | [codinglombok/LombokCSS](https://github.com/codinglombok/LombokCSS) |
+| Versi library | 0.1.9 |
+| Tingkat / cluster | L0 · 01 Frontend, UI & Visualisasi Data (katalog 01.01) |
+| Acuan | MASTERPLAN_UTAMA v3.4 (2026-09-29) · ARCHITECTURE_UTAMA v3.4 · ADR-019 |
+| Tanggal dokumen | 2026-09-30 |
+| Lisensi | MIT (kebijakan §10: framework CSS) |
+
+Dokumen standar: [Masterplan](masterplan_LombokCSS_v0.1.9.md) · [Architecture](architecture_LombokCSS_v0.1.9.md) · [Changelog](changelog_LombokCSS_v0.1.9.md) · [Map](map_LombokCSS_v0.1.9.md) · [Structure Repo](structure_repo_LombokCSS_v0.1.9.md) · [Full Summary Project](full_summary_project_LombokCSS_v0.1.9.md) · [Guide How to Use](guide_how_to_use_LombokCSS_v0.1.9.md) · [How to Dist](how_to_dist_LombokCSS_v0.1.9.md) · [Development Ide](development_ide_LombokCSS_v0.1.9.md) · [API Reference](API_LombokCSS_v0.1.9.md) · [Bahasa (i18n)](Lang_LombokCSS_v0.1.9.md) · [Behavioral Specification](SPEC_LombokCSS_v0.1.9.md)
+
+---
+
+```text
+LombokCSS/
+├── README.md · CHANGELOG.md · LICENSE (MIT) · SECURITY.md · SUPPORT.md
+├── CONTRIBUTING.md · CODE_OF_CONDUCT.md · GITHUB_SETUP.md · CLAUDE.md (memori sesi)
+├── package.json · package-lock.json · composer.json · bower.json
+├── lombokcss.gemspec · lib/lombokcss(.rb, /version.rb) # RubyGem
+├── release-please-config.json · .release-please-manifest.json
+├── playwright.config.js · build_docs.py (generator situs docs/)
+├── src/ variables · core · themes · components · utilities · print (.css) · lombok.js
+├── dist/ lombok.css · lombok.min.css · lombok.js (hasil build, di-commit)
+├── scripts/ build-css.mjs · size-check.mjs · ssr-check.mjs
+├── tests/ behavior.spec.js · visual.spec.js · visual.spec.js-snapshots/
+├── docs/ situs GitHub Pages (*.html, assets/) + 12 dokumen standar *_LombokCSS_v0.1.9.md
+├── examples/ demo.html
+├── package/ salinan lama paket (tidak dipublikasikan; temuan C-03)
+└── .github/ workflows/ · linters/ · ISSUE_TEMPLATE/ · dependabot.yml · CODEOWNERS
+```
+
+Catatan: `demo.html` di root adalah halaman demo mandiri; `docs/assets/lombok.js` dan
+`docs/assets/lombok.min.css` disinkronkan dari `dist/` oleh `npm run build:docs`.
diff --git a/lombokcss.gemspec b/lombokcss.gemspec
index a741d68..18e6406 100644
--- a/lombokcss.gemspec
+++ b/lombokcss.gemspec
@@ -6,7 +6,7 @@ Gem::Specification.new do |spec|
spec.name = "lombokcss"
spec.version = Lombokcss::VERSION
spec.authors = ["codinglombok"]
- spec.summary = "Token-first component CSS framework. One markup, five design styles, dark + RTL."
+ spec.summary = "Token-first component CSS framework. One markup, five design styles, dark + RTL. Part of Lombok Ecosystem."
spec.description = "LombokCSS compiled assets packaged as a RubyGem for Rails/Sprockets and Ruby projects."
spec.homepage = "https://github.com/codinglombok/lombokcss"
spec.license = "MIT"
diff --git a/package.json b/package.json
index 6df6305..9e8a96a 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "lombokcss",
"version": "0.1.9",
- "description": "Token-first component CSS framework. One markup, five design styles (Corporate Flat, Resonant Stark, Neo-Brutalism, Semantic Minimalist, Glassmorphism), dark mode + RTL. ~9.7KB gzipped.",
+ "description": "Token-first component CSS framework. One markup, five design styles (Corporate Flat, Resonant Stark, Neo-Brutalism, Semantic Minimalist, Glassmorphism), dark mode + RTL. ~9.7KB gzipped. Universal, zero-dependency; part of Lombok Ecosystem.",
"license": "MIT",
"author": "codinglombok",
"homepage": "https://github.com/codinglombok/lombokcss#readme",
diff --git a/src/lombok.js b/src/lombok.js
index 983ce31..fbdc472 100644
--- a/src/lombok.js
+++ b/src/lombok.js
@@ -216,11 +216,26 @@
);
});
+ /* Collator for the BCP-47 language nearest to el (lang="sv", "de", …), so
+ text sorts the way readers of that language expect; numeric: true orders
+ "Item 2" before "Item 10". An unknown or malformed tag falls back to the
+ runtime default instead of throwing a RangeError. */
+ function collator(el) {
+ var host = el.closest("[lang]"),
+ opts = { numeric: true };
+ try {
+ return new Intl.Collator((host && host.getAttribute("lang")) || undefined, opts);
+ } catch {
+ return new Intl.Collator(undefined, opts);
+ }
+ }
+
/* Table sort: click sorts its column (string/number aware) */
d.querySelectorAll("table.table thead th[aria-sort]").forEach(function (th) {
th.addEventListener("click", function () {
var table = th.closest("table"),
- tbody = table.tBodies[0];
+ tbody = table.tBodies[0],
+ cmp = collator(table).compare;
var idx = Array.prototype.indexOf.call(th.parentNode.children, th);
var asc = th.getAttribute("aria-sort") !== "ascending";
th.parentNode.querySelectorAll("th[aria-sort]").forEach(function (o) {
@@ -233,7 +248,7 @@
y = b.cells[idx].textContent.trim();
var nx = parseFloat(x),
ny = parseFloat(y);
- var r = !isNaN(nx) && !isNaN(ny) ? nx - ny : x.localeCompare(y);
+ var r = !isNaN(nx) && !isNaN(ny) ? nx - ny : cmp(x, y);
return asc ? r : -r;
});
rows.forEach(function (r) {
diff --git a/tests/behavior.spec.js b/tests/behavior.spec.js
index ef3f2e3..0be9772 100644
--- a/tests/behavior.spec.js
+++ b/tests/behavior.spec.js
@@ -538,6 +538,33 @@ test.describe("table sort", () => {
expect(await column(page, 0)).toEqual(["apple", "Banana", "Cherry"]);
});
+ test("sorts text by the nearest lang (BCP-47) collation", async ({ page }) => {
+ const words = (lang) => `
+ `;
+ // Swedish sorts "Ä" after "Z"; German and English sort it with "A"
+ await mount(page, words("sv"));
+ await page.locator("#th-w").click();
+ expect(await column(page, 0)).toEqual(["Zebra", "Äpple"]);
+ await mount(page, words("de"));
+ await page.locator("#th-w").click();
+ expect(await column(page, 0)).toEqual(["Äpple", "Zebra"]);
+ });
+
+ test("sorts embedded numbers naturally and survives a malformed lang", async ({ page }) => {
+ await mount(
+ page,
+ `
+ Item Item 10 Item 2 Item 1
`,
+ );
+ await page.locator("#th-i").click();
+ expect(await column(page, 0)).toEqual(["Item 1", "Item 2", "Item 10"]);
+ });
+
test("sorting another column resets the previous aria-sort", async ({ page }) => {
await mount(page, TABLE);
await page.locator("#th-qty").click();