cacheplane · blove · May 18, 2026 · May 18, 2026 · May 18, 2026 · May 18, 2026
diff --git a/examples/chat/angular/src/app/modes/welcome-suggestions.component.spec.ts b/examples/chat/angular/src/app/modes/welcome-suggestions.component.spec.ts
@@ -52,6 +52,16 @@ describe('WelcomeSuggestionsComponent', () => {
     expect(captured).toBe(FEATURED_SUGGESTIONS[0].value);
   });
 
+  // JSDOM does not cascade ::ng-deep overrides from Angular component <style>
+  // tags, so we assert against the component's compiled styles string instead
+  // of relying on getComputedStyle — same approach used for border-width above.
+  it('widens the More prompts dropdown menu in the component styles', () => {
+    const cls: any = WelcomeSuggestionsComponent;
+    const styles = ((cls['ɵcmp'] as { styles?: string[] })?.styles ?? []).join(' ');
+    expect(styles).toMatch(/chat-select__menu[^}]*min-width:\s*320px/);
+    expect(styles).toMatch(/chat-select__menu[^}]*max-width:\s*480px/);
+  });
+
   it('overrides the More prompts trigger to match the featured chip styling', () => {
     // The component's styles block must include ::ng-deep overrides for the
     // chat-select trigger so it visually matches chat-welcome-suggestion.

diff --git a/examples/chat/angular/src/app/modes/welcome-suggestions.component.ts b/examples/chat/angular/src/app/modes/welcome-suggestions.component.ts
@@ -75,6 +75,11 @@ import { FEATURED_SUGGESTIONS, MORE_SUGGESTIONS } from './welcome-suggestions';
         border-color: var(--ngaf-chat-text-muted);
         color: var(--ngaf-chat-text);
       }
+      .welcome-suggestions__row ::ng-deep chat-select .chat-select__menu {
+        min-width: 320px;
+        max-width: 480px;
+        width: max-content;
+      }
     `,
   ],
 })

diff --git a/libs/a2ui/package.json b/libs/a2ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ngaf/a2ui",
-  "version": "0.0.39",
+  "version": "0.0.40",
   "license": "MIT",
   "repository": {
     "type": "git",

diff --git a/libs/ag-ui/package.json b/libs/ag-ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ngaf/ag-ui",
-  "version": "0.0.39",
+  "version": "0.0.40",
   "peerDependencies": {
     "@ngaf/chat": "*",
     "@ngaf/licensing": "*",

diff --git a/libs/chat/package.json b/libs/chat/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ngaf/chat",
-  "version": "0.0.39",
+  "version": "0.0.40",
   "exports": {
     ".": {
       "types": "./index.d.ts",

diff --git a/libs/chat/src/lib/styles/chat-message.styles.spec.ts b/libs/chat/src/lib/styles/chat-message.styles.spec.ts
@@ -0,0 +1,18 @@
+// libs/chat/src/lib/styles/chat-message.styles.spec.ts
+// SPDX-License-Identifier: MIT
+import { describe, it, expect } from 'vitest';
+import { CHAT_MESSAGE_STYLES } from './chat-message.styles';
+
+describe('CHAT_MESSAGE_STYLES — controls positioning', () => {
+  const normalized = CHAT_MESSAGE_STYLES.replace(/\s+/g, ' ');
+  it('does NOT absolute-position the actions controls (so they flow inside .chat-message__main, indented past the gutter)', () => {
+    expect(normalized).not.toMatch(
+      /\.chat-message__controls\s*\{[^}]*position:\s*absolute/,
+    );
+  });
+  it('does NOT pin the controls to a negative bottom offset (would overlap with the next message)', () => {
+    expect(normalized).not.toMatch(
+      /\.chat-message__controls\s*\{[^}]*bottom:\s*-/,
+    );
+  });
+});
diff --git a/libs/chat/src/lib/styles/chat-message.styles.ts b/libs/chat/src/lib/styles/chat-message.styles.ts
@@ -90,9 +90,6 @@ export const CHAT_MESSAGE_STYLES = `
 
   .chat-message__controls {
     display: none;
-    position: absolute;
-    left: 0;
-    bottom: -28px;
     gap: 1rem;
     opacity: 0;
     transition: opacity 200ms ease;

diff --git a/libs/chat/src/lib/styles/chat-project-list.styles.spec.ts b/libs/chat/src/lib/styles/chat-project-list.styles.spec.ts
@@ -42,6 +42,28 @@ describe('CHAT_PROJECT_LIST_STYLES — New project button', () => {
   });
 });
 
+describe('CHAT_PROJECT_LIST_STYLES — New project button font', () => {
+  const normalized = CHAT_PROJECT_LIST_STYLES.replace(/\s+/g, ' ');
+
+  it('uses font-family: inherit (matches sidenav action buttons)', () => {
+    expect(normalized).toMatch(
+      /\.chat-project-list__new\s*\{[^}]*font-family:\s*inherit\s*;/,
+    );
+  });
+
+  it('uses font-size: var(--ngaf-chat-font-size-sm) (not hard-coded 12px)', () => {
+    expect(normalized).toMatch(
+      /\.chat-project-list__new\s*\{[^}]*font-size:\s*var\(--ngaf-chat-font-size-sm\)\s*;/,
+    );
+  });
+
+  it('does NOT use hard-coded 12px for font-size', () => {
+    expect(normalized).not.toMatch(
+      /\.chat-project-list__new\s*\{[^}]*font-size:\s*12px/,
+    );
+  });
+});
+
 describe('CHAT_PROJECT_LIST_STYLES — active item', () => {
   const normalized = CHAT_PROJECT_LIST_STYLES.replace(/\s+/g, ' ');
   it('does NOT use a left-accent box-shadow for the active item (symmetric bg-only indication)', () => {

diff --git a/libs/chat/src/lib/styles/chat-project-list.styles.ts b/libs/chat/src/lib/styles/chat-project-list.styles.ts
@@ -79,7 +79,9 @@ export const CHAT_PROJECT_LIST_STYLES = `
     border: 0;
     padding: 10px 16px;
     border-radius: 8px;
-    font-size: 12px;
+    font-family: inherit;
+    font-size: var(--ngaf-chat-font-size-sm);
+    font-weight: 400;
     display: flex;
     align-items: center;
     gap: 8px;

diff --git a/libs/chat/src/lib/styles/chat-sidenav.styles.spec.ts b/libs/chat/src/lib/styles/chat-sidenav.styles.spec.ts
@@ -42,6 +42,43 @@ describe('CHAT_SIDENAV_STYLES — New chat button', () => {
   });
 });
 
+describe('CHAT_SIDENAV_STYLES — header chrome', () => {
+  const normalized = CHAT_SIDENAV_STYLES.replace(/\s+/g, ' ');
+  it('does NOT draw a border-bottom on .chat-sidenav__header (removes the line above New chat)', () => {
+    expect(normalized).not.toMatch(
+      /\.chat-sidenav__header\s*\{[^}]*border-bottom:/,
+    );
+  });
+});
+
+describe('CHAT_SIDENAV_STYLES — action button font', () => {
+  const normalized = CHAT_SIDENAV_STYLES.replace(/\s+/g, ' ');
+
+  it('generic .chat-sidenav__action has font-family: inherit', () => {
+    expect(normalized).toMatch(
+      /\.chat-sidenav__action\s*\{[^}]*font-family:\s*inherit\s*;/,
+    );
+  });
+
+  it('generic .chat-sidenav__action has font-size: var(--ngaf-chat-font-size-sm)', () => {
+    expect(normalized).toMatch(
+      /\.chat-sidenav__action\s*\{[^}]*font-size:\s*var\(--ngaf-chat-font-size-sm\)\s*;/,
+    );
+  });
+
+  it('late-cascade New chat uses font-size: var(--ngaf-chat-font-size-sm) (not 13px)', () => {
+    expect(normalized).toMatch(
+      /\.chat-sidenav__action\.chat-sidenav__action--new\s*\{[^}]*font-size:\s*var\(--ngaf-chat-font-size-sm\)\s*;/,
+    );
+  });
+
+  it('does NOT use hard-coded 13px for New chat font-size', () => {
+    expect(normalized).not.toMatch(
+      /\.chat-sidenav__action\.chat-sidenav__action--new\s*\{[^}]*font-size:\s*13px/,
+    );
+  });
+});
+
 describe('CHAT_SIDENAV_STYLES — Archived disclosure', () => {
   const normalized = CHAT_SIDENAV_STYLES.replace(/\s+/g, ' ');
 

diff --git a/libs/chat/src/lib/styles/chat-sidenav.styles.ts b/libs/chat/src/lib/styles/chat-sidenav.styles.ts
@@ -70,7 +70,6 @@ export const CHAT_SIDENAV_STYLES = `
   .chat-sidenav__header {
     flex-shrink: 0;
     padding: var(--ngaf-chat-space-3);
-    border-bottom: 1px solid var(--ngaf-chat-separator);
   }
   .chat-sidenav__topbar {
     flex-shrink: 0;
@@ -105,7 +104,7 @@ export const CHAT_SIDENAV_STYLES = `
     border: 0;
     padding: 12px 18px;
     border-radius: 8px;
-    font-size: 13px;
+    font-size: var(--ngaf-chat-font-size-sm);
     font-weight: 600;
     display: flex;
     align-items: center;
@@ -150,7 +149,9 @@ export const CHAT_SIDENAV_STYLES = `
     color: var(--ngaf-chat-text);
     border-radius: 8px;
     cursor: pointer;
-    font: inherit;
+    font-family: inherit;
+    font-size: var(--ngaf-chat-font-size-sm);
+    font-weight: 400;
     text-align: left;
   }
   .chat-sidenav__action:hover { background: var(--ngaf-chat-surface-alt); }
@@ -178,7 +179,7 @@ export const CHAT_SIDENAV_STYLES = `
     border-radius: 8px;
     padding: 12px 18px;
     font-weight: 600;
-    font-size: 13px;
+    font-size: var(--ngaf-chat-font-size-sm);
   }
   .chat-sidenav__action.chat-sidenav__action--new:hover {
     background: var(--ngaf-chat-text);

diff --git a/libs/langgraph/package.json b/libs/langgraph/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ngaf/langgraph",
-  "version": "0.0.39",
+  "version": "0.0.40",
   "peerDependencies": {
     "@ngaf/chat": "*",
     "@ngaf/licensing": "*",

diff --git a/libs/licensing/package.json b/libs/licensing/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ngaf/licensing",
-  "version": "0.0.39",
+  "version": "0.0.40",
   "license": "MIT",
   "repository": {
     "type": "git",

diff --git a/libs/render/package.json b/libs/render/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ngaf/render",
-  "version": "0.0.39",
+  "version": "0.0.40",
   "peerDependencies": {
     "@angular/core": "^20.0.0 || ^21.0.0",
     "@angular/common": "^20.0.0 || ^21.0.0",

diff --git a/libs/telemetry/package.json b/libs/telemetry/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ngaf/telemetry",
-  "version": "0.0.39",
+  "version": "0.0.40",
   "license": "MIT",
   "publishConfig": {
     "access": "public"