Skip to content
gStack

ADR-GDS-001 — Monorepo design-system cu sursă vizuală unică

  • Status: Acceptat (implementat)
  • Data: 2026-07-09
  • Context bloc: C (dezvoltare), aplicație GDS

Context

Section titled “Context”

Sarcina „GDS Constructor” cere ca (a) canvas-ul să fie preview 1:1 cu componentele reale @gstack/gds-angular, iar (b) exportul HTML standalone să arate identic cu canvas-ul, fără JS de framework. Pachetele @gstack/gds-core și @gstack/gds-angular și GDS Portal.dc.html nu existau în repo la momentul dezvoltării.

Decizie

Section titled “Decizie”

Construim un monorepo Angular 20 cu trei proiecte:

  • @gstack/gds-core — token-uri (4 accente, IBM Plex, paletă slate), contractele de date ale blocurilor, CSS-ul design-system-ului (GDS_CSS) și rendereri statici pure (render.ts) care produc HTML din document.
  • @gstack/gds-angular — componentele reale gds-*, cu ViewEncapsulation.None ca să folosească aceleași clase globale din GDS_CSS.
  • constructor — aplicația.

Sursa vizuală unică: atât componentele Angular, cât și rendererele statice folosesc EXACT aceleași clase CSS și aceleași helper-e de prezentare (statusMeta, deltaDir, chartBarHeights, isHighlighted, initials) exportate din gds-core. Astfel canvas-ul live (componente) și fișierul exportat (HTML static) sunt themate de aceeași foaie de stil.

Limbajul vizual (indigo/slate, IBM Plex Sans/Mono, carduri cu bordură subtilă) e ancorat în design-urile GStack existente (vault/0-inbox/GStack/*.dc.html).

Consecințe

Section titled “Consecințe”
  • (+) Paritate vizuală canvas↔export garantată de CSS partajat.
  • (+) Componentele rămân „reale” (nu copii), conform briefului.
  • (−) Structura markup e ținută sincron manual între templates Angular și render.ts; mitigat prin teste (snapshot render + DOM component) și helper-e partajate. Un test de paritate DOM-vs-string exact e follow-up (fragil din cauza ancorelor Angular).
  • (−) ng build pe gds-angular cu ng-packagr eșuează cât timp path-ul e mapat la sursă; aplicația și testele consumă librăriile din sursă (esbuild) fără problemă. Publicarea reală a pachetelor = follow-up (mapare la dist).