@agent-native/core 0.153.8 → 0.153.10

package/docs/content/client-routing.mdx

@@ -0,0 +1,121 @@
+---
+title: "Routing"
+description: "File-based routing for agent-native apps with React Router v8: pages, dynamic params, and navigation."
+---
+
+# Routing
+
+Agent-native apps use **React Router v8** with file-based routing via `flatRoutes()` from `@react-router/fs-routes`. Every file in `app/routes/` becomes a URL. Templates use the dot-notation convention. Dots separate URL segments inside a single filename.
+
+This page covers client routes, the pages rendered in the browser from `app/routes/`. Server routes are a separate system: Nitro file routes under `server/routes/`, plus the framework's own `/_agent-native/*` endpoints. Those live on the [Routes](/docs/server-routes) page. The two don't share a directory, a naming convention, or a router, so a `server/routes/` file never becomes a page here and an `app/routes/` file never becomes a server endpoint.
+
+<Diagram id="doc-block-client-routing-1" title="File name → URL" summary="Each file in app/routes/ becomes a URL. Dots become slashes, and a $ segment becomes a dynamic param.">
+
+```html
+<div class="diagram-filemap">
+  <div class="diagram-filemap-row">
+    <span class="diagram-node">_index.tsx</span>
+    <span class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</span>
+    <span class="diagram-pill accent">/</span>
+  </div>
+  <div class="diagram-filemap-row">
+    <span class="diagram-node">dashboard.tsx</span>
+    <span class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</span>
+    <span class="diagram-pill accent">/dashboard</span>
+  </div>
+  <div class="diagram-filemap-row">
+    <span class="diagram-node">dashboard_.$ticketId.tsx</span>
+    <span class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</span>
+    <span class="diagram-pill accent">/dashboard/:ticketId</span>
+  </div>
+</div>
+```
+
+```css
+.diagram-filemap {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+.diagram-filemap-row {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  flex-wrap: wrap;
+}
+.diagram-filemap-row .diagram-arrow {
+  font-size: 18px;
+  line-height: 1;
+}
+```
+
+</Diagram>
+
+## File-based routing {#file-based-routing}
+
+### File → URL mapping
+
+| File                       | URL                    | Notes                                                                     |
+| -------------------------- | ---------------------- | ------------------------------------------------------------------------- |
+| `_index.tsx`               | `/`                    | Index route                                                               |
+| `dashboard.tsx`            | `/dashboard`           | Simple page                                                               |
+| `extensions.$id.tsx`       | `/extensions/:id`      | Nests inside `extensions.tsx`'s `<Outlet/>`. `$` is a dynamic param       |
+| `dashboard_.$ticketId.tsx` | `/dashboard/:ticketId` | Trailing `_` skips nesting under `dashboard.tsx`, so this is its own page |
+| `_app.tsx`                 | (no URL segment)       | Pathless layout. Prefix with `_`                                          |
+| `inbox/route.tsx`          | `/inbox`               | Folder form. `route.tsx` is the index                                     |
+
+Prefix a segment with `$` for a dynamic param. Prefix with `_` to make it a pathless layout route (no URL segment), or add a trailing `_` before a dot to opt a nested-looking path out of nesting under its parent's layout. Templates use `flatRoutes()`. The dot-notation file above is primary. The nested-folder form `inbox/route.tsx` also works.
+
+## Adding a new page {#adding-a-page}
+
+Create the file and export a default component:
+
+```tsx filename="app/routes/settings.tsx"
+export function meta() {
+  return [{ title: "Settings" }];
+}
+
+export default function SettingsPage() {
+  return <div>Settings</div>;
+}
+```
+
+That's it. The dev server reads route files at startup. If `pnpm dev` is already running, restart it after adding the file. No registration is needed.
+
+## Dynamic params {#dynamic-params}
+
+```tsx filename="app/routes/dashboard_.$ticketId.tsx"
+import { useParams } from "react-router";
+
+export default function TicketDetailPage() {
+  const { ticketId } = useParams();
+  return <div>Ticket: {ticketId}</div>;
+}
+```
+
+The trailing `_` before the dot keeps this page from nesting inside `dashboard.tsx`'s `<Outlet/>`, so it renders as its own full page at `/dashboard/:ticketId` instead of appearing inside the ticket queue's layout.
+
+## Navigation {#navigation}
+
+Use `<Link>` for client-side navigation and `useNavigate()` for programmatic navigation:
+
+```tsx
+import { Link, useNavigate } from "react-router";
+
+// In JSX
+<Link to="/dashboard">Dashboard</Link>;
+
+// Programmatic
+const navigate = useNavigate();
+navigate(`/dashboard/${ticketId}`);
+```
+
+Neither of these tells the agent what the user is looking at on their own. That's a separate concern, handled by `useAgentRouteState()` writing the current route into application state. See [Context Awareness](/docs/context-awareness).
+
+## What's next
+
+- [**Overview**](/docs/client-overview) — where `app/routes/` fits among the rest of `app/` and `public/`
+- [**Data & Sync**](/docs/client-data) — reading and writing data from inside a route
+- [**Agent Chat**](/docs/client-agent-chat) — sending prompts and staging context from a route
+- [**Routes**](/docs/server-routes) — the separate server-routing system: file routes under `server/routes/` and the framework's `/_agent-native/` namespace
+- [**Context Awareness**](/docs/context-awareness) — how the agent learns the current route and selection

package/docs/content/client-sync-internals.mdx

@@ -0,0 +1,124 @@
+---
+title: "Sync Internals"
+description: "The change-version mechanism behind useDbSync: useChangeVersion/useChangeVersions for syncing a raw useQuery, and the two latency paths a refetch can take."
+---
+
+# Sync Internals
+
+[Live Sync](/docs/key-concepts#polling-sync) covers the mental model: an agent write becomes a change event, `useDbSync()` picks it up, and affected queries refetch. This page covers the mechanism underneath that most apps never touch directly: the change-version counters `useDbSync()` bumps, and how to fold them into a raw `useQuery()` call that isn't going through `useActionQuery()`.
+
+`useActionQuery()` already refetches automatically when a mutating action completes (see [Data & Sync](/docs/client-data#fetching-mutating)). Reach for `useChangeVersion()`/`useChangeVersions()` only when you're syncing a raw `useQuery()` call outside that path, such as a low-level client helper reading integration status.
+
+## How change versions work {#how-it-works}
+
+When a server-side database mutation occurs, the server records a change event tagged with a `source` key. `useDbSync()` receives that event and bumps a local counter for that source. Folding the counter into a React Query key makes the query refetch automatically whenever the backend reports new activity for that source.
+
+## useChangeVersion / useChangeVersions {#use-change-version}
+
+<Signature
+  id="doc-block-client-sync-internals-1"
+  name="useChangeVersion"
+  params={[
+    {
+      name: "source",
+      type: "string",
+      description: 'The change-event source to watch, e.g. `"dashboards"`.',
+    },
+  ]}
+  returns={{
+    type: "number",
+    description:
+      "A counter that increments whenever the given source is mutated.",
+  }}
+/>
+
+<Signature
+  id="doc-block-client-sync-internals-2"
+  name="useChangeVersions"
+  params={[
+    {
+      name: "sources",
+      type: "readonly string[]",
+      description: "Multiple change-event sources to watch at once.",
+    },
+  ]}
+  returns={{
+    type: "number",
+    description: "The sum of the version counters for every given source.",
+  }}
+/>
+
+In the example below, a raw `useQuery()` call reads a dashboard directly, folding the `"dashboards"` source's version counter into its query key so it refetches whenever that source changes:
+
+```tsx
+import { useQuery } from "@tanstack/react-query";
+import { useChangeVersion } from "@agent-native/core/client/hooks";
+
+function DashboardView({ id }) {
+  const version = useChangeVersion("dashboards");
+
+  const { data } = useQuery({
+    queryKey: ["dashboard", id, version],
+    queryFn: () => fetchDashboard(id),
+    placeholderData: (prev) => prev,
+  });
+
+  return <div>{data?.title}</div>;
+}
+```
+
+`placeholderData: (prev) => prev` keeps the previous data on screen during the refetch, so the view doesn't flicker to a loading state.
+
+## Two paths to a refetch {#latency-models}
+
+A mutation reaches the UI one of two ways, and they have different latency.
+
+A local mutation, one your own `useActionMutation()` call just made, fires a `source: "action"` event as soon as it succeeds. Every query depending on that action refetches immediately. There's no round-trip delay, since the tab that made the write already knows about it.
+
+A remote mutation, from the agent, a webhook, another tab, or another user, has to reach this tab first. `useDbSync()` picks it up over SSE almost immediately, or over the polling fallback within about two seconds if SSE isn't available. Only once that event arrives does the relevant version counter bump and the query refetch in the background.
+
+<Diagram id="doc-block-client-sync-internals-3" title="Two paths to a refetch" summary="A local mutation invalidates its own caches instantly. A remote write reaches this tab over SSE, or the polling tick as a fallback.">
+
+```html
+<div class="diagram-latency">
+  <div class="diagram-col">
+    <div class="diagram-card" data-rough>
+      <span class="diagram-pill ok">This tab</span
+      ><strong>useActionMutation</strong
+      ><small class="diagram-muted"
+        >fires source: "action" on success &rarr; instant local refetch</small
+      >
+    </div>
+    <div class="diagram-card" data-rough>
+      <span class="diagram-pill accent">Agent · webhook · other tab</span
+      ><strong>Remote write</strong
+      ><small class="diagram-muted"
+        >SSE push, or the ~2s polling tick as fallback &rarr; version bumps
+        &rarr; background refetch</small
+      >
+    </div>
+  </div>
+</div>
+```
+
+```css
+.diagram-latency .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+.diagram-latency .diagram-card {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  padding: 14px 16px;
+}
+```
+
+</Diagram>
+
+## What's next
+
+- [**Live Sync**](/docs/key-concepts#polling-sync) — the conceptual mental model this page goes underneath
+- [**Data & Sync**](/docs/client-data) — `useActionQuery`/`useDbSync`, which most pages should use instead of these primitives
+- [**Advanced**](/docs/client-advanced) — the other lower-level client primitives and escape hatches

package/docs/content/context-awareness.mdx

@@ -486,5 +486,5 @@ How it works:
 - [**Agent Mentions**](/docs/agent-mentions) — `@`-mention files and agents into a turn instead of relying on ambient context
 - [**Drop-in Agent**](/docs/drop-in-agent) — mount the panel that reads and writes this state
 - [**Real-Time Collaboration**](/docs/real-time-collaboration) — keep app state in sync when the agent and users edit together
-- [**Client Methods**](/docs/client) — the full `application-state` and client helper reference
+- [**Application State**](/docs/client-advanced#application-state) — the full `application-state` and client helper reference
 - [**Toolkit piece: Context & Knowledge**](/docs/toolkit-context-knowledge) — the Context X-Ray presentation built on this state

package/docs/content/docs-components.mdx

@@ -330,6 +330,204 @@ Add more `###` sections to get 3 or 4 columns (max 4). The red/green label accen
 
 ---
 
+## Image
+
+<Image
+  src="/screenshots/dispatch.png"
+  alt="Dispatch app screenshot showing the run history sidebar"
+  align="left"
+  width={320}
+  caption="Dispatch's run history sidebar."
+>
+
+Aligning an image left or right turns it into a two-column row. The image sits on that side, and this markdown is the paired text on the other side. Leave `align` unset, or set it to `"full"`, for a normal full-width image with no paired text.
+
+</Image>
+
+```mdx
+<Image
+  src="/screenshots/dispatch.png"
+  alt="Dispatch app screenshot showing the run history sidebar"
+  align="left"
+  width={320}
+  caption="Dispatch's run history sidebar."
+>
+
+Aligning an image left or right turns it into a two-column row. The image sits on that side, and this markdown is the paired text on the other side. Leave `align` unset, or set it to `"full"`, for a normal full-width image with no paired text.
+
+</Image>
+```
+
+`alt` is required. `align` is `"full"` (the default), `"left"`, or `"right"`. `width` is an optional pixel hint for the image column when aligned, and has no effect on `"full"`. `caption` renders in small muted text under the image. Anything between the open and close tags is markdown, and becomes the paired text next to the image when aligned, or plain content below it when full width. Omit the children entirely for a self-closing `<Image ... />` with no paired text.
+
+Hovering the image reveals a top-right expand button that opens it in a larger popup. If the image has paired text (or a caption), the popup stacks it below the image instead of beside it, since the two-column layout only makes sense at the inline aligned size.
+
+For a plain full-width image with no paired text, omit `align` (or set it to `"full"`) and skip the children entirely:
+
+<Image
+  src="/screenshots/mail.png"
+  alt="Mail app screenshot showing the inbox and reading pane"
+  caption="The default inbox view."
+/>
+
+```mdx
+<Image
+  src="/screenshots/mail.png"
+  alt="Mail app screenshot showing the inbox and reading pane"
+  caption="The default inbox view."
+/>
+```
+
+---
+
+## Video
+
+No sample video ships in this repo, so this section shows syntax only rather than a live-rendered example. Swap `src` for a real `.mp4`/`.webm` file under `public/` to see it rendered.
+
+```mdx
+<Video
+  src="/videos/product-tour.mp4"
+  alt="A short screen recording of creating a new action from the CLI"
+  align="right"
+  width={320}
+  caption="Creating an action from the CLI."
+>
+
+Same shape as `Image`, aligned the other way this time. The video sits on the right, and this text sits on the left. `src` must be a direct video file, mp4 or webm. Third-party embed links like YouTube or Loom aren't supported, since that would need an `<iframe>`, which the docs system doesn't allow for security reasons.
+
+</Video>
+```
+
+Identical attributes to `Image` (`src`, `alt`, `align`, `width`, `caption`, and paired markdown children), except `src` must point to a direct video file rather than an embed link. `alt` becomes the video's `aria-label`, since `<video>` has no native `alt` attribute.
+
+Pass `autoplay` to play the video automatically once it's visible. It always forces `muted` alongside it, since browsers block autoplay with sound regardless of the attribute. It also never autoplays for a viewer with `prefers-reduced-motion: reduce` set. That viewer instead gets a normal paused player, and pressing play themselves gives them full, unmuted playback rather than a silently-muted one.
+
+Pass `loop` to restart the video from the beginning once it ends. It's independent of `autoplay`, so a looping video that isn't set to autoplay just loops once the viewer presses play themselves.
+
+The same full-width form applies here too, omit `align` and the children for a plain full-width video:
+
+```mdx
+<Video
+  src="/videos/product-tour.mp4"
+  alt="A full walkthrough recording of building an action end to end"
+  caption="Building an action end to end."
+/>
+```
+
+---
+
+## Signature
+
+<Signature
+  id="docs-components-signature"
+  name="askUserQuestion"
+  params={[
+    {
+      name: "input",
+      type: "AskUserQuestionInput",
+      description: "The question, its options, and how it should behave.",
+      fields: [
+        {
+          name: "question",
+          type: "string",
+          description:
+            "The complete question. Clear, specific, ends with a question mark.",
+        },
+        {
+          name: "header",
+          type: "string",
+          optional: true,
+          description:
+            'Very short chip/heading, about 12 characters, e.g. `"Date range"`.',
+        },
+        {
+          name: "options",
+          type: "AskUserQuestionOption[]",
+          description: "2-4 distinct options.",
+        },
+        {
+          name: "allowFreeText",
+          type: "boolean",
+          optional: true,
+          default: "true",
+          description: 'Adds a free-text "Other" option.',
+        },
+        {
+          name: "allowMultiple",
+          type: "boolean",
+          optional: true,
+          default: "false",
+          description: "Multi-select instead of single-select.",
+        },
+      ],
+    },
+  ]}
+  returns={{
+    type: "Promise<AskUserQuestionResult>",
+    description:
+      'The picked value, `value[]` when `allowMultiple`, the typed "Other" text, or `null` if skipped.',
+  }}
+/>
+
+```mdx
+<Signature
+  id="docs-components-signature"
+  name="askUserQuestion"
+  params={[
+    {
+      name: "input",
+      type: "AskUserQuestionInput",
+      description: "The question, its options, and how it should behave.",
+      fields: [
+        {
+          name: "question",
+          type: "string",
+          description:
+            "The complete question. Clear, specific, ends with a question mark.",
+        },
+        {
+          name: "header",
+          type: "string",
+          optional: true,
+          description:
+            'Very short chip/heading, about 12 characters, e.g. `"Date range"`.',
+        },
+        {
+          name: "options",
+          type: "AskUserQuestionOption[]",
+          description: "2-4 distinct options.",
+        },
+        {
+          name: "allowFreeText",
+          type: "boolean",
+          optional: true,
+          default: "true",
+          description: 'Adds a free-text "Other" option.',
+        },
+        {
+          name: "allowMultiple",
+          type: "boolean",
+          optional: true,
+          default: "false",
+          description: "Multi-select instead of single-select.",
+        },
+      ],
+    },
+  ]}
+  returns={{
+    type: "Promise<AskUserQuestionResult>",
+    description:
+      'The picked value, `value[]` when `allowMultiple`, the typed "Other" text, or `null` if skipped.',
+  }}
+/>
+```
+
+`Signature` is self-closing. `name` plus `params` build the code-style call line shown at the top (an optional param renders as `name?: type`). Each param is `{ name, type, optional?, default?, description }`, matching a plain field. An object-shaped param (like `input` above) can add a nested `fields` array of the same shape to break down its properties, so one block replaces both a hand-written signature line and a separate options table. `returns` is optional and takes the same `{ type, description? }` shape. Descriptions render through the normal markdown pipeline, so backticks and bold work.
+
+Use this over a hand-written `ts` fence plus a prose bullet list whenever a reference page documents a specific function, hook, or action's call shape, per the `writing-reference-docs` skill.
+
+---
+
 ## kbd — keyboard shortcut
 
 Press [[⌘K]] to open the command palette. Save with [[Ctrl+S]] before running the dev server. Navigate fields with [[Tab]] and [[Shift+Tab]].
@@ -606,5 +804,8 @@ Like `TabsBlock`, `Columns` is self-closing with a single JSON `columns` attribu
 | Same task in multiple tools or frameworks             | `Tabs`                               |
 | Side-by-side code (labeled columns)                   | `Columns`                            |
 | Project directory structure                           | `FileTree`                           |
+| A function/hook/action's call shape                   | `Signature`                          |
+| An image, full width or with paired text              | `Image`                              |
+| A video, full width or with paired text               | `Video`                              |
 | Inline keyboard shortcut                              | `[[Key]]`                            |
 | Architecture or flow diagram                          | Mermaid fence                        |

package/docs/content/drop-in-agent.mdx

@@ -237,7 +237,7 @@ conversation itself belongs in the AgentSidebar composer.
 
 When the same route is embedded as an MCP App, submitted
 `sendToAgentChat()` calls are forwarded to the host chat where supported; see
-[Client](/docs/client#sendtoagentchat) for the MCP App bridge behavior.
+[Agent Chat](/docs/client-agent-chat#sendtoagentchat) for the MCP App bridge behavior.
 
 If you want a loading state, use the `useSendToAgentChat()` hook — it returns both `send` and `isGenerating`:
 

package/docs/content/internationalization.mdx

@@ -148,6 +148,6 @@ names.
 
 ## What's next
 
-- [**Client**](/docs/client) — the `AppProviders` wrapper and other browser hooks i18n builds on
+- [**Overview**](/docs/client-overview#app-shell) — the `AppProviders` wrapper and other browser hooks i18n builds on
 - [**Toolkit: Settings**](/docs/toolkit-settings) — put `<LanguagePicker>` on the standard settings page
 - [**Getting Started**](/docs/getting-started) — build your first app on a template that already ships localized catalogs

package/docs/content/key-concepts.mdx

@@ -511,6 +511,10 @@ The vision and philosophy behind these rules.
 
 Navigation state, view-screen, and navigate commands in depth.
 
+### [Sync Internals](/docs/client-sync-internals)
+
+The change-version mechanism behind live sync, for syncing a raw `useQuery`.
+
 ### [Skills Guide](/docs/skills-guide)
 
 Framework skills, domain skills, and creating custom skills.

package/docs/content/notifications.mdx

@@ -366,7 +366,7 @@ Automations can chain off this — e.g. _"if a critical notification fires, also
 ## How it works {#internals}
 
 - **Owner scoping** — every row has an `owner` column; every query filters on it; every route uses the authenticated session's email. Users never see each other's notifications.
-- **Poll integration** — every mutation calls `recordChange()` so templates using [`useDbSync`](/docs/client) auto-invalidate without any extra wiring.
+- **Poll integration** — every mutation calls `recordChange()` so templates using [`useDbSync`](/docs/client-data#usedbsync) auto-invalidate without any extra wiring.
 - **Best-effort fan-out** — channel errors are caught and logged; one failing channel does not block others or the inbox write.
 - **Fire-and-forget** — `notify()` returns after the inbox write completes; custom channels run in the background.
 

package/docs/content/progress.mdx

@@ -244,7 +244,7 @@ Notify me that run {{runId}} has failed.
 ## How it works {#internals}
 
 - **Owner scoping** — every row has an `owner` column; every query filters on it. Users see only their own runs.
-- **Poll integration** — every mutation calls `recordChange()` so templates using [`useDbSync`](/docs/client) auto-invalidate without any extra wiring.
+- **Poll integration** — every mutation calls `recordChange()` so templates using [`useDbSync`](/docs/client-data#usedbsync) auto-invalidate without any extra wiring.
 - **Table name** — the framework also has an `agent_runs` table for internal agent-chat turn lifecycle tracking. The progress primitive uses `progress_runs` to keep the two concerns separate.
 - **Percent clamping** — values are clamped to `[0, 100]` and rounded to an integer on write.
 
@@ -252,4 +252,4 @@ Notify me that run {{runId}} has failed.
 
 - [**Notifications**](/docs/notifications) — pair with `manage-progress` (`action=complete`) to tell the user when work finishes
 - [**Automations**](/docs/automations) — watchdog slow runs via `run.progress.updated`
-- [**Client**](/docs/client) — `useDbSync` for real-time cache invalidation
+- [**Data & Sync**](/docs/client-data) — `useDbSync` for real-time cache invalidation

package/docs/content/real-time-collaboration.mdx

@@ -39,7 +39,7 @@ deployment environments including serverless and edge).
 
 <Callout tone="info">
 
-**Just need the UI to refresh, not character-level co-editing?** Use [`useDbSync`](/docs/client#usedbsync) instead — it's for reacting to SQL writes from the agent or other users. This page covers real-time character-level co-editing of a single rich-text document (shared cursors, conflict-free merging). Both ride the same `/_agent-native/poll` channel.
+**Just need the UI to refresh, not character-level co-editing?** Use [`useDbSync`](/docs/client-data#usedbsync) instead — it's for reacting to SQL writes from the agent or other users. This page covers real-time character-level co-editing of a single rich-text document (shared cursors, conflict-free merging). Both ride the same `/_agent-native/poll` channel.
 
 </Callout>
 
@@ -780,7 +780,7 @@ Key properties:
 
 ## What's next {#whats-next}
 
-- [Real-Time Sync](/docs/client#usedbsync) — the `useDbSync` + `useChangeVersion`
+- [Sync Internals](/docs/client-sync-internals) — the `useDbSync` + `useChangeVersion`
   system that delivers the `updatedAt` bump driving editor reconciliation.
 - [Security](/docs/security) — `registerShareableResource`, `resolveAccess`,
   and `assertAccess` for resource-scoped collaboration.

package/docs/content/template-chat-developers.mdx

@@ -11,7 +11,7 @@ This page is for developers who need to know what runs under the hood in [Chat](
 
 Chat adds no domain tables of its own (see [What's not in it](/docs/template-chat#not-in-it)). It runs entirely on the framework's core tables: chat threads and messages, `application_state`, `settings`, sessions, resources, and run history.
 
-`useDbSync()` is already wired into the app shell: when the agent (or anyone else) writes to SQL, the client receives the change over SSE, or the 2-second polling fallback, and invalidates the matching React Query caches — no manual refresh, no websocket you have to manage yourself. See [`useDbSync`](/docs/client#usedbsync) for the full hook API.
+`useDbSync()` is already wired into the app shell: when the agent (or anyone else) writes to SQL, the client receives the change over SSE, or the 2-second polling fallback, and invalidates the matching React Query caches — no manual refresh, no websocket you have to manage yourself. See [`useDbSync`](/docs/client-data#usedbsync) for the full hook API.
 
 `server/plugins/agent-chat.ts` is where the chat runtime itself is configured: it registers every action in `actions/` as a callable tool (`loadActionsFromStaticRegistry`), resolves the current org for scoping (`resolveOrgId`), sets the system prompt, and declares which tools the model sees on the very first turn (`initialToolNames`) — see [Your first feature in Chat](/docs/template-chat-first-edits#first-edits) for what that last part means when you add a new action.
 

package/docs/content/toolkit-command-navigation.mdx

@@ -104,7 +104,7 @@ Use a small predictable route set:
 
 ## What's next
 
-- [**Routing**](/docs/routing) — the file-route conventions the route standard
+- [**Routing**](/docs/client-routing) — the file-route conventions the route standard
   builds on.
 - [**Context Awareness**](/docs/context-awareness) — how `view-screen` and
   navigation state stay in sync.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agent-native/core",
-  "version": "0.153.8",
+  "version": "0.153.10",
   "description": "Framework for agent-native application development — where AI agents and UI share SQL state, actions, and context",
   "homepage": "https://github.com/BuilderIO/agent-native#readme",
   "bugs": {
@@ -421,8 +421,8 @@
     "y-protocols": "^1.0.7",
     "yjs": "^13.6.31",
     "zod": "^4.3.6",
-    "@agent-native/recap-cli": "0.5.4",
-    "@agent-native/toolkit": "^0.14.1"
+    "@agent-native/toolkit": "^0.14.1",
+    "@agent-native/recap-cli": "0.5.4"
   },
   "devDependencies": {
     "@ai-sdk/anthropic": "^3.0.71",

package/src/templates/default/app/routes/_index.tsx

@@ -1,5 +1,6 @@
 import { useActionQuery } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
+import { docsUrl } from "@agent-native/core/shared";
 import { useTheme } from "next-themes";
 import { Link } from "react-router";
 
@@ -41,7 +42,7 @@ export default function IndexPage() {
 
         <div className="grid grid-cols-2 gap-3 text-left">
           <a
-            href="https://agent-native.com/docs"
+            href={docsUrl("getting-started")}
             target="_blank"
             rel="noopener noreferrer"
             className="group rounded-lg border border-border/50 px-4 py-3 hover:bg-accent/50 transition-colors"