Implementazione del sistema visivo Outreach4City: 4 layer ortogonali (Tenant, Surface, Domain, Status), Tailwind v4 + cascade CSS native. Phase 01-03 + 07-10 in produzione, Phase 04 Forms in attesa di review. AI-renderable registry con 7 componenti / 34 presentations pronto per Generative UI L3.
Buttons, inputs, status badges (stage / intent / countdown), AI-aware (engine, confidence, suggested action, reasoning), safety banners, toast, avatar, attachment.
TopBar, SideNav, TabBar (Chrome-style), Breadcrumb, LensFrame + LensBar + LensTitle + ScopeChip. Esempio di lens composta (today no-domain + lead-explorer PA).
LeadCard × 9 presentations (explorer-grid · list · today-focus · inbox-side · kanban-cell · notebook-embed · calendar-pip · cmdk-row · bando-match). Block builder pattern + 18 sub-blocks atomici.
ContactCard (4) · CampaignCard (4) · BandoCard (5) · TaskRow (4) · ThreadRow (4) · KPICard (4) — tutte le presentations live.
Pattern globali in azione: sidebar + toolbar layout, hover-bar quick actions, sticky bottom multi-select, chips + popover filter strip. Grid/list view switch.
FormField primitive + 6 field types · DatePicker (react-aria) · CadenceEditor (linear + drag dnd-kit) · PredicateBuilder (react-querybuilder + Lenses style). State via react-hook-form + Zod.
Stesso ExplorerShell di Lead Explorer · 3 view mode (grid · chrono · saved), Bando drawer con tab Overview/Qualified leads/Files/AI summary. 9 bandi sample (PNRR · FESR · Regione · UE · CDP).
Vertical-zones layout (cadence · reply · task · campagne · scadenze) con tutte le today-* presentations live. Sequential Mode toggle (J/K nav) come mode-toggle. Surface tokens via data-surface=today.
2-pane Gmail-style (decisione 03b § E): thread list a sinistra · detail con composer reply + right rail di lead contestuali a destra. Surface tokens via data-surface=inbox.
Lista task raggruppata per priorità · filter chips (Aperti / Oggi / Alta priorità / Completati / Tutti) · multi-select con SelectionBar. Surface tokens via data-surface=tasks (44px densità).
BlockNote editor reale con custom inline @lead → LeadCard.notebook-embed. Sidebar pages tree · right rail TOC + block hints. Typography Fraunces.
Schedule-X (MIT) · 4 views (day/week/month-grid/month-agenda). 3 calendari (Leads / Bandi / Internal) con OKLCH tokens custom. Right rail con calendar-pip + calendar-ribbon presentations live.