@agent-native/core 0.172.10 → 0.173.0

package/corpus/README.md

@@ -31,4 +31,4 @@ rg -n "defineAction|useActionQuery" node_modules/@agent-native/core/corpus
 
 ## Generated Counts
 
-- template files: 8596
+- template files: 8598

package/corpus/templates/calendar/actions/view-screen.ts

@@ -55,11 +55,6 @@ async function fetchEventsForRange(
   }
 }
 
-function dateKeyFromParts(date: Date): string {
-  const pad = (value: number) => String(value).padStart(2, "0");
-  return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;
-}
-
 export default defineAction({
   description:
     "See what the user is currently looking at on screen. Returns the current view, date range, and visible events. Always call this first before taking any action.",

package/corpus/templates/calendar/app/components/calendar/CommandPalette.tsx

@@ -13,7 +13,7 @@ import {
   IconExternalLink,
 } from "@tabler/icons-react";
 import * as chrono from "chrono-node";
-import { format, parseISO, parse, isValid } from "date-fns";
+import { format, parse, isValid } from "date-fns";
 
 import { cn } from "@/lib/utils";
 

package/corpus/templates/clips/app/components/player/video-player.tsx

@@ -1629,6 +1629,8 @@ export const VideoPlayer = forwardRef<VideoPlayerHandle, VideoPlayerProps>(
     const fullscreenMenuContainer = isFullscreen ? containerRef.current : null;
 
     const showThroughoutCta = cta && cta.placement === "throughout";
+    const controlsVisible =
+      showControls || !isPlaying || isPlayPending || isBuffering;
     // Mobile Safari may defer loadeddata/canplay until playback starts. Keep
     // the paused state actionable even when those readiness events have not
     // fired yet; once the user asks to play, the pending/buffering states give
@@ -2067,7 +2069,7 @@ export const VideoPlayer = forwardRef<VideoPlayerHandle, VideoPlayerProps>(
           <div
             className={cn(
               "absolute inset-x-0 bottom-0 z-20 transition-opacity duration-200",
-              showControls ? "opacity-100" : "opacity-0 pointer-events-none",
+              controlsVisible ? "opacity-100" : "opacity-0 pointer-events-none",
             )}
           >
             <PlayerControls

package/corpus/templates/clips/changelog/2026-08-24-shared-clips-now-expose-agent-readable-transcript-and-frame-metadata-from-public-links.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-08-24
+---
+
+Shared Clips now expose agent-readable transcript and frame metadata from public links.

package/corpus/templates/clips/server/routes/[...page].get.ts

@@ -1,21 +1,190 @@
+import { verifyScopedAgentAccessToken } from "@agent-native/core/server";
 import { createH3SSRHandler } from "@agent-native/core/server/ssr-handler";
-import { defineEventHandler, setResponseHeader } from "h3";
+import {
+  injectDocumentMarkup,
+  safeJsonForHtml,
+} from "@agent-native/core/shared";
+import { eq } from "drizzle-orm";
+import {
+  defineEventHandler,
+  getQuery,
+  getRequestURL,
+  setResponseHeader,
+  type H3Event,
+} from "h3";
 
+import {
+  buildAgentApiUrls,
+  buildAgentDiscoveryPayload,
+  CLIP_AGENT_ACCESS_TOKEN_PREFIX,
+  CLIPS_AGENT_ACCESS_PARAM,
+} from "../../shared/agent-context.js";
+import { getDb, schema } from "../db/index.js";
 import {
   MEDIA_CAPTURE_PERMISSIONS_POLICY,
   withMediaCapturePermissions,
 } from "../lib/media-permissions.js";
+import {
+  getServerAppBasePath,
+  queryString,
+} from "../lib/public-agent-context.js";
+import { isRecordingExpired } from "../lib/recording-page-access.js";
 
 const ssrHandler = createH3SSRHandler(
   () => import("virtual:react-router/server-build"),
 );
 
-export default defineEventHandler(async (event) => {
-  const response = (await ssrHandler(event)) as Response;
+function stripAppBasePath(pathname: string): string {
+  const basePath = getServerAppBasePath();
+  if (!basePath) return pathname;
+  if (pathname === basePath) return "/";
+  return pathname.startsWith(`${basePath}/`)
+    ? pathname.slice(basePath.length) || "/"
+    : pathname;
+}
+
+function clipIdFromPath(pathname: string): string | null {
+  const match = stripAppBasePath(pathname).match(/^\/(?:share|r)\/([^/]+)\/?$/);
+  if (!match?.[1]) return null;
+  try {
+    return decodeURIComponent(match[1]);
+  } catch {
+    return match[1];
+  }
+}
+
+function escapeHtmlAttribute(value: string): string {
+  return value.replace(/[&<>\"']/g, (character) => {
+    switch (character) {
+      case "&":
+        return "&amp;";
+      case "<":
+        return "&lt;";
+      case ">":
+        return "&gt;";
+      case '\"':
+        return "&quot;";
+      case "'":
+        return "&#39;";
+      default:
+        return character;
+    }
+  });
+}
+
+async function buildClipAgentDiscovery(event: H3Event): Promise<{
+  markup: string;
+  noReferrer: boolean;
+} | null> {
+  const requestUrl = getRequestURL(event);
+  const recordingId = clipIdFromPath(requestUrl.pathname);
+  if (!recordingId) return null;
+
+  const [recording] = await getDb()
+    .select({
+      id: schema.recordings.id,
+      title: schema.recordings.title,
+      status: schema.recordings.status,
+      visibility: schema.recordings.visibility,
+      password: schema.recordings.password,
+      expiresAt: schema.recordings.expiresAt,
+      archivedAt: schema.recordings.archivedAt,
+      trashedAt: schema.recordings.trashedAt,
+    })
+    .from(schema.recordings)
+    .where(eq(schema.recordings.id, recordingId))
+    .limit(1);
+
+  if (
+    !recording ||
+    recording.archivedAt ||
+    recording.trashedAt ||
+    isRecordingExpired(recording.expiresAt)
+  ) {
+    return null;
+  }
+
+  const query = getQuery(event);
+  const suppliedToken =
+    queryString(query[CLIPS_AGENT_ACCESS_PARAM]) || queryString(query.t);
+  const tokenGrantsAgentAccess = suppliedToken
+    ? verifyScopedAgentAccessToken(suppliedToken, {
+        resourceKind: CLIP_AGENT_ACCESS_TOKEN_PREFIX,
+        resourceId: recording.id,
+      }).ok
+    : false;
+  const anonymousAccess =
+    recording.visibility === "public" && !recording.password;
+  if (!anonymousAccess && !tokenGrantsAgentAccess) return null;
+
+  const token = tokenGrantsAgentAccess ? suppliedToken : undefined;
+  const agentContextUrl = buildAgentApiUrls(recording.id, {
+    origin: requestUrl.origin,
+    basePath: getServerAppBasePath(),
+    token,
+  }).contextUrl;
+  const discovery = buildAgentDiscoveryPayload({
+    recordingId: recording.id,
+    title: recording.title,
+    status: recording.status,
+    agentContextUrl,
+  });
+  const contextHref = escapeHtmlAttribute(agentContextUrl);
+
+  return {
+    markup: `<link rel="alternate" type="application/json" href="${contextHref}" title="Agent-readable clip context"><script type="application/agent-native+json" id="clips-agent-context">${safeJsonForHtml(discovery)}</script>`,
+    noReferrer: tokenGrantsAgentAccess,
+  };
+}
+
+function injectClipAgentDiscovery(html: string, markup: string): string {
+  const scriptId = 'id="clips-agent-context"';
+  const scriptMarkup = html.includes(scriptId)
+    ? ""
+    : markup.slice(markup.indexOf("<script"));
+  const linkMarkup = markup.slice(0, markup.indexOf("<script"));
+  const injection = `${html.includes(linkMarkup) ? "" : linkMarkup}${scriptMarkup}`;
+  return injectDocumentMarkup(html, injection, { target: "head" });
+}
+
+function withClipsResponseHeaders(
+  event: H3Event,
+  response: Response,
+): Response {
   setResponseHeader(
     event,
     "Permissions-Policy",
     MEDIA_CAPTURE_PERMISSIONS_POLICY,
   );
   return withMediaCapturePermissions(response);
+}
+
+export default defineEventHandler(async (event) => {
+  const response = (await ssrHandler(event)) as Response;
+  const discovery = await buildClipAgentDiscovery(event);
+  if (!discovery || !response.ok)
+    return withClipsResponseHeaders(event, response);
+
+  const contentType = response.headers.get("content-type") ?? "";
+  if (!contentType.includes("text/html")) {
+    return withClipsResponseHeaders(event, response);
+  }
+
+  const headers = new Headers(response.headers);
+  headers.delete("content-length");
+  if (discovery.noReferrer) {
+    headers.set("Referrer-Policy", "no-referrer");
+    setResponseHeader(event, "Referrer-Policy", "no-referrer");
+  }
+
+  const html = await response.text();
+  const discoveredResponse = new Response(
+    injectClipAgentDiscovery(html, discovery.markup),
+    {
+      status: response.status,
+      statusText: response.statusText,
+      headers,
+    },
+  );
+  return withClipsResponseHeaders(event, discoveredResponse);
 });

package/corpus/templates/plan/app/components/layout/Header.tsx

@@ -10,7 +10,7 @@ import { useLocation } from "react-router";
 import { APP_TITLE } from "@/lib/app-config";
 
 const pageTitleKeys: Record<string, string> = {
-  "/": "header.plan",
+  "/chat": "header.plan",
   "/plans": "header.plan",
   "/agent": "settings.agentTitle",
   "/settings": "header.settings",

package/corpus/templates/plan/app/components/layout/Layout.tsx

@@ -4,6 +4,7 @@ import {
   useAgentChatHomeHandoff,
   useAgentChatHomeHandoffLinks,
 } from "@agent-native/core/client/agent-chat";
+import { useSession } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
 import { HeaderActionsProvider } from "@agent-native/toolkit/app-shell";
 import { IconMenu2 } from "@tabler/icons-react";
@@ -47,6 +48,7 @@ function isPlanDetailRoute(pathname: string): boolean {
 
 export function Layout({ children }: LayoutProps) {
   const location = useLocation();
+  const pathname = location.pathname.replace(/\/+$/, "") || "/";
   const t = useT();
   const [mobileSidebarOpen, setMobileSidebarOpen] = useState(false);
   const [sidebarCollapsed, setSidebarCollapsed] = useState(() => {
@@ -87,19 +89,22 @@ export function Layout({ children }: LayoutProps) {
 
   const ownsToolbar = routeOwnsToolbar(location.pathname);
   const planDetailRoute = isPlanDetailRoute(location.pathname);
-  const chatRoute = location.pathname === "/";
+  const chatRoute = pathname === "/chat";
+  const { session, isLoading: sessionLoading } = useSession();
   const chatHomeHandoffActive = useAgentChatHomeHandoff({
     storageKey: "plans",
-    activePath: location.pathname,
+    activePath: pathname,
     enabled: !chatRoute,
   });
   const chatHomeHandoffPending = isAgentChatHomeHandoffActive("plans");
   useAgentChatHomeHandoffLinks({
     storageKey: "plans",
-    chatPath: "/",
+    chatPath: "/chat",
+    isChatPath: (path) => (path.replace(/\/+$/, "") || "/") === "/chat",
     requireActiveHandoff: true,
   });
   const hideAppNavigation = planDetailRoute && planReaderImmersive;
+  const hideAppHeader = pathname === "/plans" && !sessionLoading && !session;
   const effectiveSidebarCollapsed = chatRoute
     ? chatSidebarCollapsed
     : sidebarCollapsed;
@@ -168,6 +173,17 @@ export function Layout({ children }: LayoutProps) {
             </button>
           </div>
         )
+      ) : hideAppHeader ? (
+        <div className="flex h-12 items-center border-b border-border px-4 md:hidden shrink-0">
+          <button
+            type="button"
+            onClick={() => setMobileSidebarOpen(true)}
+            aria-label={t("sidebar.openNavigation")}
+            className="flex h-9 w-9 cursor-pointer items-center justify-center rounded-md text-muted-foreground hover:text-foreground hover:bg-accent"
+          >
+            <IconMenu2 className="h-4 w-4" />
+          </button>
+        </div>
       ) : (
         <Header onOpenMobileSidebar={() => setMobileSidebarOpen(true)} />
       )}

package/corpus/templates/plan/app/components/layout/Sidebar.tsx

@@ -72,7 +72,7 @@ function buildBrandingCustomizationMessage(request: string) {
 }
 
 const navItems = [
-  { icon: IconMessageCircle, labelKey: "navigation.ask", href: "/" },
+  { icon: IconMessageCircle, labelKey: "navigation.ask", href: "/chat" },
   { icon: IconClipboardCheck, labelKey: "navigation.plan", href: "/plans" },
 ];
 
@@ -216,7 +216,7 @@ function PlanChatsSection({
 
   function openThread(threadId: string, options?: { isNew?: boolean }) {
     switchThread(threadId);
-    navigateWithAgentChatViewTransition(navigate, "/");
+    navigateWithAgentChatViewTransition(navigate, "/chat");
     window.requestAnimationFrame(() => {
       window.dispatchEvent(
         new CustomEvent("agent-chat:open-thread", {
@@ -536,6 +536,7 @@ export function Sidebar({
   onCollapsedChange,
 }: SidebarProps) {
   const location = useLocation();
+  const pathname = location.pathname.replace(/\/+$/, "") || "/";
   const { session, isLoading: sessionLoading } = useSession();
   const t = useT();
   const returnPath = planReturnPathFromLocation(location);
@@ -652,13 +653,13 @@ export function Sidebar({
         {navItems.map((item) => {
           const Icon = item.icon;
           const isActive =
-            item.href === "/"
-              ? location.pathname === "/"
+            item.href === "/chat"
+              ? pathname === "/chat"
               : item.href === "/plans"
-                ? location.pathname.startsWith("/plans") ||
-                  location.pathname.startsWith("/recaps") ||
-                  location.pathname.startsWith("/local-plans")
-                : location.pathname.startsWith(item.href);
+                ? pathname.startsWith("/plans") ||
+                  pathname.startsWith("/recaps") ||
+                  pathname.startsWith("/local-plans")
+                : pathname.startsWith(item.href);
           const link = (
             <Link
               to={item.href}
@@ -681,7 +682,7 @@ export function Sidebar({
           return (
             <div key={item.href}>
               {link}
-              {item.href === "/" ? (
+              {item.href === "/chat" ? (
                 <PlanChatsSection collapsed={collapsed} open={isActive} />
               ) : null}
               {item.href === "/plans" && isActive ? (
@@ -695,7 +696,7 @@ export function Sidebar({
       <nav className="grid shrink-0 gap-1 px-2 py-1">
         {bottomNavItems.map((item) => {
           const Icon = item.icon;
-          const isActive = location.pathname.startsWith(item.href);
+          const isActive = pathname.startsWith(item.href);
           const link = (
             <Link
               to={item.href}

package/corpus/templates/plan/app/hooks/use-navigation-state.ts

@@ -122,22 +122,23 @@ export function useNavigationState() {
 }
 
 function viewForPath(pathname: string): string {
+  const normalizedPathname = pathname.replace(/\/+$/, "") || "/";
   // Recaps are a kind of plan; both detail routes map to the "plan" view so the
   // agent's navigation/selection state is the same surface regardless of route.
   if (
-    pathname.startsWith("/plans/") ||
-    pathname.startsWith("/recaps/") ||
-    pathname.startsWith("/local-plans/")
+    normalizedPathname.startsWith("/plans/") ||
+    normalizedPathname.startsWith("/recaps/") ||
+    normalizedPathname.startsWith("/local-plans/")
   ) {
     return "plan";
   }
-  if (pathname === "/") {
+  if (normalizedPathname === "/chat") {
     return "chat";
   }
   if (
-    pathname.startsWith("/plans") ||
-    pathname.startsWith("/recaps") ||
-    pathname.startsWith("/local-plans")
+    normalizedPathname.startsWith("/plans") ||
+    normalizedPathname.startsWith("/recaps") ||
+    normalizedPathname.startsWith("/local-plans")
   ) {
     return "plans";
   }
@@ -187,7 +188,7 @@ function localPathFromCommandPath(value: unknown): string | null {
 function pathForView(view?: string): string {
   switch (view) {
     case "chat":
-      return "/";
+      return "/chat";
     case "plan":
     case "plans":
       return "/plans";
@@ -198,7 +199,7 @@ function pathForView(view?: string): string {
     case "team":
       return "/settings/organization";
     default:
-      return "/";
+      return "/chat";
   }
 }
 

package/corpus/templates/plan/app/pages/PlansPage.tsx

@@ -7448,7 +7448,7 @@ function LoggedOutEmptyPlan() {
   }, []);
 
   return (
-    <div className="flex min-h-full items-center justify-center overflow-auto p-4 sm:p-8">
+    <div className="flex min-h-full -translate-y-[10vh] items-center justify-center overflow-auto p-4 sm:p-8">
       <div className="flex w-full max-w-4xl flex-col items-center gap-3 py-8 text-center">
         <h2 className="text-2xl font-semibold tracking-tight">
           {t("plansPage.loggedOut.title")}

package/corpus/templates/plan/app/root.tsx

@@ -166,7 +166,7 @@ function AppContent() {
         changelogKey="plan"
       >
         <CommandMenu.Group heading={t("root.commandActions")}>
-          <CommandMenu.Item onSelect={() => go("/")}>
+          <CommandMenu.Item onSelect={() => go("/chat")}>
             {t("root.askPlan")}
           </CommandMenu.Item>
           <CommandMenu.Item onSelect={() => go("/plans")}>
@@ -223,14 +223,15 @@ function AppContent() {
 export default function Root() {
   const [queryClient] = useState(() => createAgentNativeQueryClient());
   const location = useLocation();
+  const pathname = location.pathname.replace(/\/+$/, "") || "/";
   const sessionBypass =
-    location.pathname === "/" ||
-    location.pathname === "/plans" ||
-    location.pathname.startsWith("/plans/") ||
-    location.pathname === "/recaps" ||
-    location.pathname.startsWith("/recaps/") ||
-    location.pathname === "/local-plans" ||
-    location.pathname.startsWith("/local-plans/");
+    pathname === "/chat" ||
+    pathname === "/plans" ||
+    pathname.startsWith("/plans/") ||
+    pathname === "/recaps" ||
+    pathname.startsWith("/recaps/") ||
+    pathname === "/local-plans" ||
+    pathname.startsWith("/local-plans/");
   const localPlanPrivacyRoute = !shouldCapturePlanContent(location.pathname);
   return (
     // Pass the plan-specific styled Toaster via `toaster` so only one sonner

package/corpus/templates/plan/app/routes/_index.tsx

@@ -1,34 +1,10 @@
-import { Spinner } from "@/components/ui/spinner";
-import { APP_TITLE } from "@/lib/app-config";
-import { PlanChatPage } from "@/pages/PlanChatPage";
+import { withSsrHtmlContentType } from "@agent-native/core/shared";
+import { redirect } from "react-router";
 
-const SEO_TITLE = `${APP_TITLE} - Open Source visual planning and PR recaps for coding agents`;
-const SEO_DESCRIPTION =
-  "Open Source planning workspace for coding agents with visual plans, PR recaps, diagrams, wireframes, API specs, and prototypes.";
-
-export function meta() {
-  return [
-    { title: SEO_TITLE },
-    {
-      name: "description",
-      content: SEO_DESCRIPTION,
-    },
-    { property: "og:title", content: SEO_TITLE },
-    { property: "og:description", content: SEO_DESCRIPTION },
-    { name: "twitter:card", content: "summary" },
-    { name: "twitter:title", content: SEO_TITLE },
-    { name: "twitter:description", content: SEO_DESCRIPTION },
-  ];
-}
-
-export function HydrateFallback() {
-  return (
-    <div className="flex items-center justify-center h-screen w-full">
-      <Spinner className="size-8 text-foreground" />
-    </div>
-  );
+export function loader() {
+  return withSsrHtmlContentType(redirect("/plans"));
 }
 
-export default function IndexPage() {
-  return <PlanChatPage />;
+export default function IndexRedirect() {
+  return null;
 }

package/corpus/templates/plan/app/routes/chat.tsx

@@ -0,0 +1,34 @@
+import { Spinner } from "@/components/ui/spinner";
+import { APP_TITLE } from "@/lib/app-config";
+import { PlanChatPage } from "@/pages/PlanChatPage";
+
+const SEO_TITLE = `${APP_TITLE} - Open Source visual planning and PR recaps for coding agents`;
+const SEO_DESCRIPTION =
+  "Open Source planning workspace for coding agents with visual plans, PR recaps, diagrams, wireframes, API specs, and prototypes.";
+
+export function meta() {
+  return [
+    { title: SEO_TITLE },
+    {
+      name: "description",
+      content: SEO_DESCRIPTION,
+    },
+    { property: "og:title", content: SEO_TITLE },
+    { property: "og:description", content: SEO_DESCRIPTION },
+    { name: "twitter:card", content: "summary" },
+    { name: "twitter:title", content: SEO_TITLE },
+    { name: "twitter:description", content: SEO_DESCRIPTION },
+  ];
+}
+
+export function HydrateFallback() {
+  return (
+    <div className="flex h-screen w-full items-center justify-center">
+      <Spinner className="size-8 text-foreground" />
+    </div>
+  );
+}
+
+export default function ChatRoute() {
+  return <PlanChatPage />;
+}

package/corpus/templates/plan/server/plugins/auth.ts

@@ -48,6 +48,7 @@ export default createAuthPlugin({
   // auth so the UI does not create placeholder plans for signed-out visitors.
   workspaceAppPublicPaths: [
     "/",
+    "/chat",
     "/plans",
     "/plans/plan_",
     "/recaps",

package/dist/client/AgentPanel.d.ts

@@ -264,12 +264,14 @@ export interface AgentSidebarProps {
     agentPageHref?: string;
     /** Suppress first-run onboarding while a deep-linked resource is open. */
     suppressFirstRunOnboarding?: boolean;
+    /** Pin how much model reasoning the chat shows. Omit to let the reader choose. */
+    thinkingDisplay?: AssistantChatProps["thinkingDisplay"];
 }
 /**
  * Wraps app content with a toggleable agent sidebar.
  * Use AgentToggleButton in your header to open/close it.
  */
-export declare function AgentSidebar({ children, enabled, emptyStateText, suggestions, dynamicSuggestions, composerToolbarSlot, composerSlot, onComposerTextChange, imageModelMenu, availableAgents, availableModels, modelListLoading, selectedAgent, onAgentChange, onConnectLocalRuntime, onConnectProvider, runtime, adapterReloadKey, threadFooterSlot, defaultSidebarWidth, sidebarWidth, position, defaultOpen, animateMobile, animateDesktop, chatViewTransition, chatViewTransitionHandoff, storageKey, openStorageKey, restoreActiveThread, apiUrl, agentChatSurface, desktopIdentityUnauthenticated, desktopIdentityAuthenticated, showTabBar, suppressInlineOpenApp, composerPlaceholder, openOnChatRunning, onFullscreenRequest, scope, toggleScopeId, isolateHistoryByScope, showScopeBadge, browserTabId, threadUrlSync, agentPageHref, suppressFirstRunOnboarding, }: AgentSidebarProps): React.JSX.Element;
+export declare function AgentSidebar({ children, enabled, emptyStateText, suggestions, dynamicSuggestions, composerToolbarSlot, composerSlot, onComposerTextChange, imageModelMenu, availableAgents, availableModels, modelListLoading, selectedAgent, onAgentChange, onConnectLocalRuntime, onConnectProvider, runtime, adapterReloadKey, threadFooterSlot, defaultSidebarWidth, sidebarWidth, position, defaultOpen, animateMobile, animateDesktop, chatViewTransition, chatViewTransitionHandoff, storageKey, openStorageKey, restoreActiveThread, apiUrl, agentChatSurface, desktopIdentityUnauthenticated, desktopIdentityAuthenticated, showTabBar, suppressInlineOpenApp, composerPlaceholder, openOnChatRunning, onFullscreenRequest, scope, toggleScopeId, isolateHistoryByScope, showScopeBadge, browserTabId, threadUrlSync, agentPageHref, suppressFirstRunOnboarding, thinkingDisplay, }: AgentSidebarProps): React.JSX.Element;
 /**
  * Focus the agent chat composer input.
  * Opens the sidebar if closed, then focuses the text input.