fix(chat): dispatch table rows through row component (0.0.24) (#197)

* fix(chat): dispatch table rows through component, not children

MarkdownTableComponent template used <chat-md-children [parent]="row">
which walked the row's children (cells) directly under <thead>/<tbody>,
skipping the <chat-md-table-row> wrapper entirely. Result: bare cells
appeared under thead/tbody and the row component (with its IS_HEADER_ROW
DI plumbing) was never instantiated, so cells couldn't tell whether to
render <th> or <td>.

Caught by live browser smoke testing in ~/tmp/ngaf — Chrome inspection
showed the parser produced 3 row nodes but the rendered DOM had zero
<chat-md-table-row> elements. Fixed by importing MarkdownTableRowComponent
and dispatching each row through it directly.

Synchronized version bump to 0.0.24 across all 16 @Ngaf libs.

* fix(chat): citation marker without URL renders span, not broken anchor

Live Chrome smoke caught: when a Pandoc citation def has a bare URL (no
<autolink> brackets), mdDefToCitation returns Citation { url: undefined }.
Prior template used [href]="r.citation.url ?? null" which Angular
serialized as href="" — a broken anchor that renders as a clickable link
that goes nowhere.

Fix: split the resolved branch into "with URL" (renders <a>) and
"without URL" (renders <span class="chat-citation-marker--no-url">).
The span shows the bracket marker but is non-interactive, matching the
unresolved fallback's contract.

Also switched from [href] property binding to [attr.href] for explicit
attribute removal when null.

Regression test pins both branches.

* fix(chat): chat-citations panel surfaces markdown-sidecar citations too

Live Chrome smoke caught: when citations come from Pandoc-formatted
[^id]: defs in message content (no provider metadata in
additional_kwargs.citations), inline markers resolved correctly via the
markdown sidecar but the sources panel under the message never rendered
— defeating the click-to-source affordance.

Fix: ChatCitationsComponent now optionally injects CitationsResolverService
and merges markdown-sidecar defs (via mdDefToCitation) into its citations
list, with Message.citations taking precedence by id. Behavior matches
the same precedence as inline-marker resolution.

Two new regression tests pin both behaviors: markdown-only citations
appear in the panel; Message.citations wins on id overlap.

* fix(chat): task-list checkbox aligns inline with first-paragraph text

Live Chrome smoke caught: checkbox rendered on a separate line above the
task text because <chat-md-paragraph> > <p> is block-level, pushing the
content below the input. Now uses flexbox on the .chat-md-list-item--task
container to align checkbox + content baseline, and collapses the inner
<p> margin so tight tasks read as a single line.

Multi-paragraph task items (sub-lists, additional paragraphs) still flow
correctly because flex-wrap is enabled and only direct children flex.

* fix(chat): only collapse first-paragraph margin in task items

Live Chrome smoke caught: prior fix collapsed margin on ALL paragraphs
inside task items, so multi-paragraph content ran together with no
visible break (e.g. "write reportCoral reefs are diverse..." running
into the next block when the model emitted prose immediately after a
task item without a blank line).

Refined: only the FIRST paragraph of a task item collapses its margin
(so it aligns inline with the checkbox). Subsequent blocks keep normal
vertical spacing.

Author: blove

libs/a2ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ngaf/a2ui",
-  "version": "0.0.23",
+  "version": "0.0.24",
   "license": "MIT",
   "repository": {
     "type": "git",

libs/ag-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ngaf/ag-ui",
-  "version": "0.0.23",
+  "version": "0.0.24",
   "peerDependencies": {
     "@ngaf/chat": "*",
     "@ngaf/licensing": "*",

libs/chat/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ngaf/chat",
-  "version": "0.0.23",
+  "version": "0.0.24",
   "exports": {
     ".": {
       "types": "./index.d.ts",

libs/chat/src/lib/markdown/views/markdown-citation-reference.component.spec.ts

@@ -47,4 +47,22 @@ describe('MarkdownCitationReferenceComponent', () => {
     expect(a.getAttribute('href')).toBe('https://example.com');
     expect(a.textContent).toContain('1');
   });
+
+  it('renders <span> (not <a>) when citation has no URL — bug #197 regression', () => {
+    // Live Chrome smoke caught: a Pandoc def with bare URL (no <autolink> brackets)
+    // produces a Citation with url === undefined. Prior template rendered <a href="">
+    // which is a broken link. Fix renders <span class="chat-citation-marker--no-url">.
+    const fixture = TestBed.createComponent(HostComponent);
+    const svc = fixture.debugElement.injector.get(CitationsResolverService);
+    svc.message.set({
+      id: 'm1', role: 'assistant', content: 'x',
+      citations: [{ id: 'src1', index: 1, title: 'Source title only, no URL' }],
+    });
+    fixture.componentInstance.node.set(makeNode('src1', 1, true));
+    fixture.detectChanges();
+    expect(fixture.nativeElement.querySelector('a.chat-citation-marker')).toBeNull();
+    const span = fixture.nativeElement.querySelector('span.chat-citation-marker--no-url');
+    expect(span).toBeTruthy();
+    expect(span.textContent).toContain('1');
+  });
 });

libs/chat/src/lib/markdown/views/markdown-citation-reference.component.ts

@@ -10,12 +10,19 @@ import { CitationsResolverService } from '../citations-resolver.service';
   changeDetection: ChangeDetectionStrategy.OnPush,
   template: `
     @if (resolved(); as r) {
-      <a class="chat-citation-marker"
-         [href]="r.citation.url ?? null"
-         [attr.title]="r.citation.snippet ?? r.citation.url ?? null"
-         target="_blank" rel="noopener noreferrer">
-        <sup>[{{ node().index }}]</sup>
-      </a>
+      @if (r.citation.url; as href) {
+        <a class="chat-citation-marker"
+           [attr.href]="href"
+           [attr.title]="r.citation.snippet ?? href"
+           target="_blank" rel="noopener noreferrer">
+          <sup>[{{ node().index }}]</sup>
+        </a>
+      } @else {
+        <span class="chat-citation-marker chat-citation-marker--no-url"
+              [attr.title]="r.citation.snippet ?? r.citation.title ?? null">
+          <sup>[{{ node().index }}]</sup>
+        </span>
+      }
     } @else {
       <span class="chat-citation-marker chat-citation-marker--unresolved"
             [attr.title]="'No source available'">

libs/chat/src/lib/markdown/views/markdown-table.component.spec.ts

@@ -61,4 +61,29 @@ describe('MarkdownTableComponent', () => {
     expect(fixture.nativeElement.querySelector('thead')).toBeTruthy();
     expect(fixture.nativeElement.querySelector('tbody')).toBeTruthy();
   });
+
+  it('dispatches each row through chat-md-table-row component', () => {
+    // Regression: prior impl used <chat-md-children [parent]="row"> which
+    // walked row.children (cells) directly and skipped the row wrapper. Cells
+    // appeared bare under <thead>/<tbody>, no <chat-md-table-row> elements
+    // existed. Live browser smoke caught this; the test below pins the fix.
+    const fixture = TestBed.createComponent(HostComponent);
+    fixture.componentInstance.node.set(makeTableNode({
+      alignments: [null, null],
+      children: [
+        { id: 2, type: 'table-row', status: 'complete', parent: null, index: 0,
+          isHeader: true, children: [] } as never,
+        { id: 3, type: 'table-row', status: 'complete', parent: null, index: 1,
+          isHeader: false, children: [] } as never,
+        { id: 4, type: 'table-row', status: 'complete', parent: null, index: 2,
+          isHeader: false, children: [] } as never,
+      ],
+    }));
+    fixture.detectChanges();
+    const rows = fixture.nativeElement.querySelectorAll('chat-md-table-row');
+    expect(rows.length).toBe(3);
+    // Header row goes in <thead>; body rows in <tbody>.
+    expect(fixture.nativeElement.querySelectorAll('thead chat-md-table-row').length).toBe(1);
+    expect(fixture.nativeElement.querySelectorAll('tbody chat-md-table-row').length).toBe(2);
+  });
 });

libs/chat/src/lib/markdown/views/markdown-table.component.ts

@@ -2,23 +2,23 @@
 // SPDX-License-Identifier: MIT
 import { Component, ChangeDetectionStrategy, input, computed } from '@angular/core';
 import type { MarkdownTableNode, MarkdownTableRowNode } from '@cacheplane/partial-markdown';
-import { MarkdownChildrenComponent } from '../markdown-children.component';
+import { MarkdownTableRowComponent } from './markdown-table-row.component';
 
 @Component({
   selector: 'chat-md-table',
   standalone: true,
-  imports: [MarkdownChildrenComponent],
+  imports: [MarkdownTableRowComponent],
   changeDetection: ChangeDetectionStrategy.OnPush,
   template: `
     <table class="chat-md-table">
       <thead>
         @if (headerRow(); as row) {
-          <chat-md-children [parent]="row" />
+          <chat-md-table-row [node]="row" />
         }
       </thead>
       <tbody>
         @for (row of bodyRows(); track $any(row)) {
-          <chat-md-children [parent]="row" />
+          <chat-md-table-row [node]="row" />
         }
       </tbody>
     </table>

libs/chat/src/lib/primitives/chat-citations/chat-citations.component.spec.ts

@@ -64,4 +64,62 @@ describe('ChatCitationsComponent', () => {
     expect(fixture.nativeElement.querySelector('.custom-card')?.textContent.trim()).toBe('Custom');
     expect(fixture.nativeElement.querySelector('.chat-citations-card')).toBeNull();
   });
+
+  it('merges markdown sidecar citations when resolver is available — bug #197 regression', async () => {
+    // Live Chrome smoke caught: when citations come from Pandoc-formatted
+    // [^id]: defs in content (no provider metadata), inline markers resolved
+    // correctly via the markdown sidecar but the sources panel never rendered.
+    const { CitationsResolverService } = await import('../../markdown/citations-resolver.service');
+    @Component({
+      standalone: true,
+      imports: [ChatCitationsComponent],
+      providers: [CitationsResolverService],
+      template: `<chat-citations [message]="message" />`,
+    })
+    class ResolverHost {
+      message: Message = msg(undefined); // no provider citations
+    }
+    const fixture = TestBed.createComponent(ResolverHost);
+    const resolver = fixture.debugElement.injector.get(CitationsResolverService);
+    resolver.markdownDefs.set(new Map([
+      ['src1', {
+        id: 'src1', index: 1, status: 'complete',
+        children: [
+          { id: 1, type: 'text', status: 'complete', parent: null, index: 0, text: 'Wikipedia ' },
+          { id: 2, type: 'autolink', status: 'complete', parent: null, index: 1,
+            url: 'https://en.wikipedia.org/wiki/Coral_reef',
+            text: 'https://en.wikipedia.org/wiki/Coral_reef' },
+        ],
+      } as never],
+    ]));
+    fixture.detectChanges();
+    const cards = fixture.nativeElement.querySelectorAll('.chat-citations-card');
+    expect(cards.length).toBe(1);
+    expect(fixture.nativeElement.textContent).toContain('Wikipedia');
+  });
+
+  it('Message.citations takes precedence over markdown sidecar when ids overlap', async () => {
+    const { CitationsResolverService } = await import('../../markdown/citations-resolver.service');
+    @Component({
+      standalone: true,
+      imports: [ChatCitationsComponent],
+      providers: [CitationsResolverService],
+      template: `<chat-citations [message]="message" />`,
+    })
+    class PrecedenceHost {
+      message: Message = msg([{ id: 'src1', index: 1, title: 'From message' }]);
+    }
+    const fixture = TestBed.createComponent(PrecedenceHost);
+    const resolver = fixture.debugElement.injector.get(CitationsResolverService);
+    resolver.markdownDefs.set(new Map([
+      ['src1', { id: 'src1', index: 1, status: 'complete',
+        children: [{ id: 1, type: 'text', status: 'complete', parent: null, index: 0, text: 'From markdown' }],
+      } as never],
+    ]));
+    fixture.detectChanges();
+    const cards = fixture.nativeElement.querySelectorAll('.chat-citations-card');
+    expect(cards.length).toBe(1);
+    expect(fixture.nativeElement.textContent).toContain('From message');
+    expect(fixture.nativeElement.textContent).not.toContain('From markdown');
+  });
 });

libs/chat/src/lib/primitives/chat-citations/chat-citations.component.ts

@@ -8,6 +8,7 @@ import { NgTemplateOutlet } from '@angular/common';
 import type { Message } from '../../agent/message';
 import type { Citation } from '../../agent/citation';
 import { ChatCitationsCardComponent } from './chat-citations-card.component';
+import { CitationsResolverService, mdDefToCitation } from '../../markdown/citations-resolver.service';
 
 /**
  * ContentChild template directive for custom citation card rendering.
@@ -48,8 +49,33 @@ export class ChatCitationsComponent {
 
   @ContentChild(ChatCitationCardTemplateDirective) cardTpl: ChatCitationCardTemplateDirective | null = null;
 
+  /**
+   * Optional resolver — present when chat-citations is rendered inside a
+   * chat-message that provides CitationsResolverService (the standard
+   * placement). When absent, the panel reads only Message.citations.
+   */
+  private readonly resolver = inject(CitationsResolverService, { optional: true });
+
+  /**
+   * Combined citation list:
+   *   1. Message.citations (provider-populated, takes precedence by id)
+   *   2. Markdown sidecar defs (Pandoc-formatted [^id]: lines), merged in
+   *      for any id not already present.
+   *
+   * Sorted by index ascending. This guarantees the sources panel surfaces
+   * citations whether they come from message metadata, content syntax, or
+   * both — matching the same precedence as inline-marker resolution.
+   */
   protected readonly citations = computed<Citation[]>(() => {
-    const list = this.message().citations ?? [];
-    return [...list].sort((a, b) => a.index - b.index);
+    const fromMessage = this.message().citations ?? [];
+    const seenIds = new Set(fromMessage.map(c => c.id));
+    const fromMarkdown: Citation[] = [];
+    const mdDefs = this.resolver?.markdownDefs();
+    if (mdDefs) {
+      for (const def of mdDefs.values()) {
+        if (!seenIds.has(def.id)) fromMarkdown.push(mdDefToCitation(def));
+      }
+    }
+    return [...fromMessage, ...fromMarkdown].sort((a, b) => a.index - b.index);
   });
 }

libs/chat/src/lib/styles/chat-markdown.styles.ts

@@ -114,9 +114,32 @@ export const CHAT_MARKDOWN_STYLES = `
   chat-streaming-md chat-md-table { display: contents; }
   chat-streaming-md chat-md-table-row { display: contents; }
   chat-streaming-md chat-md-table-cell { display: contents; }
-  /* Task-list items */
-  chat-streaming-md li.chat-md-list-item--task { list-style: none; margin-left: -1.25rem; }
-  chat-streaming-md li.chat-md-list-item--task > input[type="checkbox"] { margin-right: 0.5rem; vertical-align: middle; }
+  /* Task-list items: checkbox + first paragraph render inline; subsequent
+     blocks (sub-lists, multi-paragraph items) flow normally below. */
+  chat-streaming-md li.chat-md-list-item--task {
+    list-style: none;
+    margin-left: -1.25rem;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: baseline;
+    gap: 0.5rem;
+  }
+  chat-streaming-md li.chat-md-list-item--task > input[type="checkbox"] {
+    margin: 0;
+    flex: 0 0 auto;
+    transform: translateY(2px);
+  }
+  /* The chat-md-children wrapper around list-item content takes remaining width */
+  chat-streaming-md li.chat-md-list-item--task > chat-md-children {
+    flex: 1 1 auto;
+    min-width: 0;
+  }
+  /* Tight task items: only the FIRST paragraph aligns inline with the
+     checkbox (margin collapsed). Subsequent paragraphs/blocks keep their
+     normal vertical spacing so multi-block items render readably. */
+  chat-streaming-md li.chat-md-list-item--task > chat-md-children > chat-md-paragraph:first-child > p {
+    margin: 0;
+  }
 
   /* Media */
   chat-streaming-md img { max-width: 100%; height: auto; border-radius: 6px; }