docs: improve all 18 docs pages to intro quality

apps/website/content/docs-v2/api/fetch-stream-transport.mdx

@@ -1,3 +1,24 @@
 # FetchStreamTransport
 
+`FetchStreamTransport` is the production-ready transport that opens a real server-sent event connection using the browser's `fetch` API and reads a `ReadableStream` response body. It is the default transport you register with `provideStreamResource` in production builds.
+
+You rarely need to interact with `FetchStreamTransport` directly — simply provide it once at the application level and every `streamResource` will use it automatically. You would reach for it explicitly only when constructing a resource outside the normal DI tree or when you need to override the transport for a single resource while keeping the global default intact.
+
+```ts
+import { inject } from '@angular/core';
+import { streamResource, FetchStreamTransport } from '@ngxp/stream-resource';
+
+// Override transport for a single resource
+const events = streamResource<Event>({
+  url: () => '/api/events',
+  transport: inject(FetchStreamTransport),
+});
+```
+
+<Callout type="tip" title="Transport interface">
+  `FetchStreamTransport` implements the `StreamTransport` interface. You can
+  create custom transports (e.g. WebSocket-backed) by implementing the same
+  interface and providing them in place of this class.
+</Callout>
+
 {/* Auto-rendered from api-docs.json — see page component */}

apps/website/content/docs-v2/api/mock-stream-transport.mdx

@@ -1,3 +1,32 @@
 # MockStreamTransport
 
+`MockStreamTransport` is a test-friendly transport that replaces real network calls with an in-memory event emitter. Use it in unit and component tests to push values on demand and assert against your component's reactive state without a running server.
+
+```ts
+import { TestBed } from '@angular/core/testing';
+import {
+  provideStreamResource,
+  MockStreamTransport,
+} from '@ngxp/stream-resource';
+
+beforeEach(() => {
+  TestBed.configureTestingModule({
+    providers: [provideStreamResource({ transport: MockStreamTransport })],
+  });
+});
+
+it('reflects streamed value', () => {
+  const transport = TestBed.inject(MockStreamTransport);
+  // Emit a value into the stream
+  transport.emit('/api/repos/42', { id: 42, name: 'my-repo' });
+  // Assert your component's signal updated accordingly
+});
+```
+
+<Callout type="tip" title="Deterministic tests">
+  Because `MockStreamTransport` is synchronous by default, you can emit values
+  and assert state changes in the same test tick — no `fakeAsync` or `tick`
+  required.
+</Callout>
+
 {/* Auto-rendered from api-docs.json — see page component */}

apps/website/content/docs-v2/api/provide-stream-resource.mdx

@@ -1,3 +1,28 @@
 # provideStreamResource()
 
+`provideStreamResource` is the provider factory that registers `stream-resource` in Angular's dependency injection system. Call it inside `bootstrapApplication` (or an `ApplicationConfig`) to configure the transport and any global defaults used by every `streamResource` in your app.
+
+```ts
+import { bootstrapApplication } from '@angular/platform-browser';
+import {
+  provideStreamResource,
+  FetchStreamTransport,
+} from '@ngxp/stream-resource';
+import { AppComponent } from './app/app.component';
+
+bootstrapApplication(AppComponent, {
+  providers: [
+    provideStreamResource({
+      transport: FetchStreamTransport,
+    }),
+  ],
+});
+```
+
+<Callout type="info" title="One provider, any transport">
+  Swap `FetchStreamTransport` for `MockStreamTransport` (or any custom class
+  implementing the `StreamTransport` interface) to change the transport for all
+  resources at once — useful for testing or SSR.
+</Callout>
+
 {/* Auto-rendered from api-docs.json — see page component */}

apps/website/content/docs-v2/api/stream-resource.mdx

@@ -1,3 +1,26 @@
 # streamResource()
 
+`streamResource` is the core primitive of the library. It creates a reactive resource that opens a server-sent event stream, tracks loading and error states, and exposes the latest emitted value — all within Angular's signal-based reactivity model.
+
+```ts
+import { streamResource } from '@ngxp/stream-resource';
+
+// Inside a component or service with injection context
+const repo = streamResource<Repository>({
+  url: () => `/api/repos/${this.repoId()}`,
+  transport: inject(FetchStreamTransport),
+});
+
+// Use in template
+// repo.value() — latest emitted value (or undefined)
+// repo.status() — 'idle' | 'loading' | 'streaming' | 'error'
+```
+
+<Callout type="warning" title="Injection context required">
+  `streamResource` must be called during construction, inside an injection
+  context (e.g. a component constructor, field initializer, or a function
+  passed to `runInInjectionContext`). Calling it outside an injection context
+  will throw.
+</Callout>
+
 {/* Auto-rendered from api-docs.json — see page component */}

apps/website/content/docs-v2/concepts/agent-architecture.mdx

@@ -53,3 +53,17 @@ streamResource() supports these patterns through the `subagents()` and `activeSu
 <Callout type="tip" title="Start simple">
 Most applications only need a single agent with tools. Add subagents when you need true task delegation with isolated state.
 </Callout>
+
+## What's Next
+
+<CardGroup cols={2}>
+  <Card title="LangGraph Basics" href="/docs/concepts/langgraph-basics">
+    Learn the graph, node, and edge model that agents are built on.
+  </Card>
+  <Card title="Subgraphs" href="/docs/guides/subgraphs">
+    Compose agents into multi-agent pipelines using subgraphs.
+  </Card>
+  <Card title="Interrupts" href="/docs/guides/interrupts">
+    Pause agent execution and wait for human approval mid-run.
+  </Card>
+</CardGroup>

apps/website/content/docs-v2/concepts/angular-signals.mdx

@@ -59,3 +59,17 @@ Unlike traditional Angular HTTP patterns, streamResource doesn't use Observables
 <Callout type="tip" title="Why Signals over RxJS?">
 Signals are simpler for UI state. They synchronously read the latest value, compose with computed(), and integrate with Angular's template syntax. streamResource handles the async SSE connection internally and surfaces results as Signals.
 </Callout>
+
+## What's Next
+
+<CardGroup cols={2}>
+  <Card title="State Management" href="/docs/concepts/state-management">
+    Understand how LangGraph agent state flows into Angular Signals.
+  </Card>
+  <Card title="Streaming" href="/docs/guides/streaming">
+    See Signals in action with token-by-token streaming responses.
+  </Card>
+  <Card title="API Reference" href="/docs/api/stream-resource">
+    Full reference for every Signal exposed by streamResource.
+  </Card>
+</CardGroup>

apps/website/content/docs-v2/concepts/langgraph-basics.mdx

@@ -49,3 +49,17 @@ streamResource<AgentState>({ ... })
 <Callout type="info" title="Learn more">
 For deeper LangGraph concepts (persistence, interrupts, memory), see the individual guide pages.
 </Callout>
+
+## What's Next
+
+<CardGroup cols={2}>
+  <Card title="Agent Architecture" href="/docs/concepts/agent-architecture">
+    Understand the planning, tool-calling, and execution lifecycle.
+  </Card>
+  <Card title="Streaming" href="/docs/guides/streaming">
+    Stream token-by-token responses from your LangGraph agent.
+  </Card>
+  <Card title="Angular Signals" href="/docs/concepts/angular-signals">
+    Learn how streamResource exposes agent state as Angular Signals.
+  </Card>
+</CardGroup>

apps/website/content/docs-v2/concepts/state-management.mdx

@@ -66,4 +66,18 @@ Every state update from the agent creates a new signal value. Angular's change d
 const hasErrors = computed(() =>
   agent.value().analysis.issues.length > 0
 );
+
+## What's Next
+
+<CardGroup cols={2}>
+  <Card title="Angular Signals" href="/docs/concepts/angular-signals">
+    Learn how streamResource uses Signals for reactive rendering.
+  </Card>
+  <Card title="Persistence" href="/docs/guides/persistence">
+    Persist thread state so users can resume conversations later.
+  </Card>
+  <Card title="Memory" href="/docs/guides/memory">
+    Preserve context across sessions with LangGraph's memory store.
+  </Card>
+</CardGroup>
 ```

apps/website/content/docs-v2/guides/deployment.mdx

@@ -88,3 +88,20 @@ Store threadId in localStorage or a backend so users can resume conversations.
 Set `throttle` option if token-by-token updates are too frequent for your UI.
 </Step>
 </Steps>
+
+## What's Next
+
+<CardGroup cols={2}>
+  <Card title="Testing" href="/docs/guides/testing">
+    Test agent interactions deterministically before deploying.
+  </Card>
+  <Card title="Persistence" href="/docs/guides/persistence">
+    Store thread IDs so users can resume conversations across sessions.
+  </Card>
+  <Card title="Streaming" href="/docs/guides/streaming">
+    Tune streaming options like throttle for production performance.
+  </Card>
+  <Card title="API Reference" href="/docs/api/provide-stream-resource">
+    Full reference for provideStreamResource configuration options.
+  </Card>
+</CardGroup>

apps/website/content/docs-v2/guides/interrupts.mdx

@@ -76,3 +76,20 @@ interruptCount = computed(() => agent.interrupts().length);
 <Callout type="warning" title="Typed interrupts">
 Use the BagTemplate generic parameter to type your interrupt payloads for full TypeScript safety.
 </Callout>
+
+## What's Next
+
+<CardGroup cols={2}>
+  <Card title="Persistence" href="/docs/guides/persistence">
+    Resume conversations across page refreshes with thread persistence.
+  </Card>
+  <Card title="Streaming" href="/docs/guides/streaming">
+    Stream token-by-token responses and tool progress in real time.
+  </Card>
+  <Card title="Testing" href="/docs/guides/testing">
+    Script interrupt events deterministically with MockStreamTransport.
+  </Card>
+  <Card title="API Reference" href="/docs/api/stream-resource">
+    Full reference for streamResource options and returned signals.
+  </Card>
+</CardGroup>

apps/website/content/docs-v2/guides/memory.mdx

@@ -63,3 +63,20 @@ const agent = streamResource<AgentState>({
 <Callout type="tip" title="Memory is server-side">
 The agent controls what gets stored in memory. streamResource() just surfaces the current state. Design your agent's state schema to include the fields you want to persist.
 </Callout>
+
+## What's Next
+
+<CardGroup cols={2}>
+  <Card title="Persistence" href="/docs/guides/persistence">
+    Save thread IDs and resume conversations across sessions.
+  </Card>
+  <Card title="Time Travel" href="/docs/guides/time-travel">
+    Replay and branch agent runs from any past checkpoint.
+  </Card>
+  <Card title="State Management" href="/docs/concepts/state-management">
+    Understand how agent state flows into Angular Signals.
+  </Card>
+  <Card title="Testing" href="/docs/guides/testing">
+    Test memory and state behavior with MockStreamTransport.
+  </Card>
+</CardGroup>

apps/website/content/docs-v2/guides/persistence.mdx

@@ -87,3 +87,20 @@ When a connection drops, streamResource() can rejoin an in-progress run.
 await chat.joinStream(runId, lastEventId);
 // Picks up from where the connection was lost
 ```
+
+## What's Next
+
+<CardGroup cols={2}>
+  <Card title="Interrupts" href="/docs/guides/interrupts">
+    Pause agent execution and wait for human input with interrupt signals.
+  </Card>
+  <Card title="Memory" href="/docs/guides/memory">
+    Preserve context across sessions using LangGraph's memory store.
+  </Card>
+  <Card title="Streaming" href="/docs/guides/streaming">
+    Stream token-by-token responses and tool progress in real time.
+  </Card>
+  <Card title="Testing" href="/docs/guides/testing">
+    Test agent interactions deterministically with MockStreamTransport.
+  </Card>
+</CardGroup>