copilotkit 2.0.2 → 2.0.4

package/index.js

@@ -63,9 +63,9 @@ function setOpsFrontendUrl(url2) {
 }
 function getBuildInfo() {
   return {
-    version: "2.0.2",
-    buildNumber: "25375859015",
-    commitSha: "e3187072e0586422d8de0d64ce08406f77df265e"
+    version: "2.0.4",
+    buildNumber: "25565986307",
+    commitSha: "b30c431cac977de7dc0637d19bbe914b6bb1248d"
   };
 }
 var opsApiUrlOverride, opsFrontendUrlOverride;
@@ -16841,6 +16841,7 @@ __export(auth_service_exports, {
   isTerminalSessionInvalidationError: () => isTerminalSessionInvalidationError,
   login: () => login,
   logout: () => logout,
+  raceForClerkToken: () => raceForClerkToken,
   startCallbackServer: () => startCallbackServer,
   verifyAndRefresh: () => verifyAndRefresh
 });
@@ -16977,7 +16978,26 @@ function startCallbackServer(expectedState) {
     });
   });
 }
-async function login() {
+async function raceForClerkToken(resultPromise, manualClerkToken) {
+  const callbackBranch = resultPromise.then((result) => ({
+    clerkToken: result.clerkToken,
+    source: "callback"
+  }));
+  if (!manualClerkToken) {
+    return await callbackBranch;
+  }
+  const manualBranch = manualClerkToken.then((clerkToken) => ({
+    clerkToken,
+    source: "manual"
+  }));
+  const swallow = (promise2) => {
+    promise2.catch(() => void 0);
+  };
+  swallow(callbackBranch);
+  swallow(manualBranch);
+  return await Promise.race([callbackBranch, manualBranch]);
+}
+async function login(options = {}) {
   const state = crypto2.randomBytes(16).toString("hex");
   const diagnostics = createCliAuthDiagnostics(state);
   diagnostics.logPhase("login.start", {
@@ -16986,6 +17006,7 @@ async function login() {
     state: summarizeState(state)
   });
   const { port, resultPromise, server } = await startCallbackServer(state);
+  let tokenSource = null;
   try {
     const callbackUrl = `http://127.0.0.1:${port}/callback`;
     const loginParams = new URLSearchParams({
@@ -17017,9 +17038,14 @@ async function login() {
       );
     }
     diagnostics.logPhase("login.waiting-for-callback");
-    const { clerkToken } = await resultPromise;
+    const { clerkToken, source } = await raceForClerkToken(
+      resultPromise,
+      options.manualClerkToken
+    );
+    tokenSource = source;
     diagnostics.logPhase("login.callback-complete", {
-      clerkTokenReceived: true
+      clerkTokenReceived: true,
+      tokenSource: source
     });
     const apiClient = createApiClient(getOpsApiUrl());
     let authPayload;
@@ -17067,15 +17093,27 @@ async function login() {
       email: authPayload.user.email,
       organizationId: authPayload.organization.clerkOrgId
     });
-    return { user: authPayload.user, organization: authPayload.organization };
+    return {
+      user: authPayload.user,
+      organization: authPayload.organization,
+      source
+    };
   } catch (error48) {
     diagnostics.logError("login.failed", error48);
     throw error48;
   } finally {
     diagnostics.logPhase("login.cleanup-start");
-    server.close();
-    server.closeAllConnections();
-    diagnostics.logPhase("login.cleanup-complete");
+    if (tokenSource === "manual") {
+      setTimeout(() => {
+        server.close();
+        server.closeAllConnections();
+        diagnostics.logPhase("login.cleanup-complete", { deferred: true });
+      }, MANUAL_PASTE_SERVER_LINGER_MS);
+    } else {
+      server.close();
+      server.closeAllConnections();
+      diagnostics.logPhase("login.cleanup-complete", { deferred: false });
+    }
   }
 }
 function isTerminalSessionInvalidationError(error48) {
@@ -17125,7 +17163,7 @@ async function logout() {
   }
   authStore.clear();
 }
-var TERMINAL_SESSION_INVALID_MESSAGE;
+var MANUAL_PASTE_SERVER_LINGER_MS, TERMINAL_SESSION_INVALID_MESSAGE;
 var init_auth_service = __esm({
   "apps/cli/src/services/auth.service.ts"() {
     "use strict";
@@ -17133,6 +17171,7 @@ var init_auth_service = __esm({
     init_api_client();
     init_cli_auth_diagnostics();
     init_config();
+    MANUAL_PASTE_SERVER_LINGER_MS = 6e3;
     TERMINAL_SESSION_INVALID_MESSAGE = "Existing CLI sessions are invalid after the Clerk cutover. Please log in again.";
   }
 });
@@ -50356,7 +50395,7 @@ var require_backend = __commonJS({
                     });
                     return value;
                   },
-                  useEffect: function useEffect13(create3) {
+                  useEffect: function useEffect14(create3) {
                     nextHook();
                     hookLog.push({
                       displayName: null,
@@ -50402,7 +50441,7 @@ var require_backend = __commonJS({
                       dispatcherHookName: "InsertionEffect"
                     });
                   },
-                  useMemo: function useMemo7(nextCreate) {
+                  useMemo: function useMemo8(nextCreate) {
                     var hook = nextHook();
                     nextCreate = null !== hook ? hook.memoizedState[0] : nextCreate();
                     hookLog.push({
@@ -50444,7 +50483,7 @@ var require_backend = __commonJS({
                     });
                     return initialValue;
                   },
-                  useState: function useState11(initialState) {
+                  useState: function useState12(initialState) {
                     var hook = nextHook();
                     initialState = null !== hook ? hook.memoizedState : "function" === typeof initialState ? initialState() : initialState;
                     hookLog.push({
@@ -60079,7 +60118,7 @@ var require_backend = __commonJS({
                 var symbolOrNumber = renderer_typeof(type) === "object" && type !== null ? type.$$typeof : type;
                 return renderer_typeof(symbolOrNumber) === "symbol" ? symbolOrNumber.toString() : symbolOrNumber;
               }
-              var _ReactTypeOfWork = ReactTypeOfWork, CacheComponent = _ReactTypeOfWork.CacheComponent, ClassComponent = _ReactTypeOfWork.ClassComponent, IncompleteClassComponent = _ReactTypeOfWork.IncompleteClassComponent, IncompleteFunctionComponent = _ReactTypeOfWork.IncompleteFunctionComponent, FunctionComponent = _ReactTypeOfWork.FunctionComponent, IndeterminateComponent = _ReactTypeOfWork.IndeterminateComponent, ForwardRef = _ReactTypeOfWork.ForwardRef, HostRoot = _ReactTypeOfWork.HostRoot, HostHoistable = _ReactTypeOfWork.HostHoistable, HostSingleton = _ReactTypeOfWork.HostSingleton, HostComponent = _ReactTypeOfWork.HostComponent, HostPortal = _ReactTypeOfWork.HostPortal, HostText = _ReactTypeOfWork.HostText, Fragment = _ReactTypeOfWork.Fragment, LazyComponent = _ReactTypeOfWork.LazyComponent, LegacyHiddenComponent = _ReactTypeOfWork.LegacyHiddenComponent, MemoComponent = _ReactTypeOfWork.MemoComponent, OffscreenComponent = _ReactTypeOfWork.OffscreenComponent, Profiler = _ReactTypeOfWork.Profiler, ScopeComponent = _ReactTypeOfWork.ScopeComponent, SimpleMemoComponent = _ReactTypeOfWork.SimpleMemoComponent, SuspenseComponent = _ReactTypeOfWork.SuspenseComponent, SuspenseListComponent = _ReactTypeOfWork.SuspenseListComponent, TracingMarkerComponent = _ReactTypeOfWork.TracingMarkerComponent, Throw = _ReactTypeOfWork.Throw, ViewTransitionComponent = _ReactTypeOfWork.ViewTransitionComponent, ActivityComponent = _ReactTypeOfWork.ActivityComponent;
+              var _ReactTypeOfWork = ReactTypeOfWork, CacheComponent = _ReactTypeOfWork.CacheComponent, ClassComponent = _ReactTypeOfWork.ClassComponent, IncompleteClassComponent = _ReactTypeOfWork.IncompleteClassComponent, IncompleteFunctionComponent = _ReactTypeOfWork.IncompleteFunctionComponent, FunctionComponent = _ReactTypeOfWork.FunctionComponent, IndeterminateComponent = _ReactTypeOfWork.IndeterminateComponent, ForwardRef = _ReactTypeOfWork.ForwardRef, HostRoot = _ReactTypeOfWork.HostRoot, HostHoistable = _ReactTypeOfWork.HostHoistable, HostSingleton = _ReactTypeOfWork.HostSingleton, HostComponent = _ReactTypeOfWork.HostComponent, HostPortal = _ReactTypeOfWork.HostPortal, HostText = _ReactTypeOfWork.HostText, Fragment2 = _ReactTypeOfWork.Fragment, LazyComponent = _ReactTypeOfWork.LazyComponent, LegacyHiddenComponent = _ReactTypeOfWork.LegacyHiddenComponent, MemoComponent = _ReactTypeOfWork.MemoComponent, OffscreenComponent = _ReactTypeOfWork.OffscreenComponent, Profiler = _ReactTypeOfWork.Profiler, ScopeComponent = _ReactTypeOfWork.ScopeComponent, SimpleMemoComponent = _ReactTypeOfWork.SimpleMemoComponent, SuspenseComponent = _ReactTypeOfWork.SuspenseComponent, SuspenseListComponent = _ReactTypeOfWork.SuspenseListComponent, TracingMarkerComponent = _ReactTypeOfWork.TracingMarkerComponent, Throw = _ReactTypeOfWork.Throw, ViewTransitionComponent = _ReactTypeOfWork.ViewTransitionComponent, ActivityComponent = _ReactTypeOfWork.ActivityComponent;
               function resolveFiberType(type) {
                 var typeSymbol = getTypeSymbol(type);
                 switch (typeSymbol) {
@@ -60135,7 +60174,7 @@ var require_backend = __commonJS({
                   case HostPortal:
                   case HostText:
                     return null;
-                  case Fragment:
+                  case Fragment2:
                     return "Fragment";
                   case LazyComponent:
                     return "Lazy";
@@ -60290,7 +60329,7 @@ var require_backend = __commonJS({
             function renderer_attach(hook, rendererID, renderer2, global2, shouldStartProfilingNow, profilingSettings) {
               var version2 = renderer2.reconcilerVersion || renderer2.version;
               var _getInternalReactCons = getInternalReactConstants(version2), getDisplayNameForFiber = _getInternalReactCons.getDisplayNameForFiber, getTypeSymbol = _getInternalReactCons.getTypeSymbol, ReactPriorityLevels = _getInternalReactCons.ReactPriorityLevels, ReactTypeOfWork = _getInternalReactCons.ReactTypeOfWork, StrictModeBits = _getInternalReactCons.StrictModeBits, SuspenseyImagesMode = _getInternalReactCons.SuspenseyImagesMode;
-              var ActivityComponent = ReactTypeOfWork.ActivityComponent, ClassComponent = ReactTypeOfWork.ClassComponent, ContextConsumer = ReactTypeOfWork.ContextConsumer, DehydratedSuspenseComponent = ReactTypeOfWork.DehydratedSuspenseComponent, ForwardRef = ReactTypeOfWork.ForwardRef, Fragment = ReactTypeOfWork.Fragment, FunctionComponent = ReactTypeOfWork.FunctionComponent, HostRoot = ReactTypeOfWork.HostRoot, HostHoistable = ReactTypeOfWork.HostHoistable, HostSingleton = ReactTypeOfWork.HostSingleton, HostPortal = ReactTypeOfWork.HostPortal, HostComponent = ReactTypeOfWork.HostComponent, HostText = ReactTypeOfWork.HostText, IncompleteClassComponent = ReactTypeOfWork.IncompleteClassComponent, IncompleteFunctionComponent = ReactTypeOfWork.IncompleteFunctionComponent, IndeterminateComponent = ReactTypeOfWork.IndeterminateComponent, LegacyHiddenComponent = ReactTypeOfWork.LegacyHiddenComponent, MemoComponent = ReactTypeOfWork.MemoComponent, OffscreenComponent = ReactTypeOfWork.OffscreenComponent, SimpleMemoComponent = ReactTypeOfWork.SimpleMemoComponent, SuspenseComponent = ReactTypeOfWork.SuspenseComponent, SuspenseListComponent = ReactTypeOfWork.SuspenseListComponent, TracingMarkerComponent = ReactTypeOfWork.TracingMarkerComponent, Throw = ReactTypeOfWork.Throw, ViewTransitionComponent = ReactTypeOfWork.ViewTransitionComponent;
+              var ActivityComponent = ReactTypeOfWork.ActivityComponent, ClassComponent = ReactTypeOfWork.ClassComponent, ContextConsumer = ReactTypeOfWork.ContextConsumer, DehydratedSuspenseComponent = ReactTypeOfWork.DehydratedSuspenseComponent, ForwardRef = ReactTypeOfWork.ForwardRef, Fragment2 = ReactTypeOfWork.Fragment, FunctionComponent = ReactTypeOfWork.FunctionComponent, HostRoot = ReactTypeOfWork.HostRoot, HostHoistable = ReactTypeOfWork.HostHoistable, HostSingleton = ReactTypeOfWork.HostSingleton, HostPortal = ReactTypeOfWork.HostPortal, HostComponent = ReactTypeOfWork.HostComponent, HostText = ReactTypeOfWork.HostText, IncompleteClassComponent = ReactTypeOfWork.IncompleteClassComponent, IncompleteFunctionComponent = ReactTypeOfWork.IncompleteFunctionComponent, IndeterminateComponent = ReactTypeOfWork.IndeterminateComponent, LegacyHiddenComponent = ReactTypeOfWork.LegacyHiddenComponent, MemoComponent = ReactTypeOfWork.MemoComponent, OffscreenComponent = ReactTypeOfWork.OffscreenComponent, SimpleMemoComponent = ReactTypeOfWork.SimpleMemoComponent, SuspenseComponent = ReactTypeOfWork.SuspenseComponent, SuspenseListComponent = ReactTypeOfWork.SuspenseListComponent, TracingMarkerComponent = ReactTypeOfWork.TracingMarkerComponent, Throw = ReactTypeOfWork.Throw, ViewTransitionComponent = ReactTypeOfWork.ViewTransitionComponent;
               var ImmediatePriority = ReactPriorityLevels.ImmediatePriority, UserBlockingPriority = ReactPriorityLevels.UserBlockingPriority, NormalPriority = ReactPriorityLevels.NormalPriority, LowPriority = ReactPriorityLevels.LowPriority, IdlePriority = ReactPriorityLevels.IdlePriority, NoPriority = ReactPriorityLevels.NoPriority;
               var getLaneLabelMap = renderer2.getLaneLabelMap, injectProfilingHooks = renderer2.injectProfilingHooks, overrideHookState = renderer2.overrideHookState, overrideHookStateDeletePath = renderer2.overrideHookStateDeletePath, overrideHookStateRenamePath = renderer2.overrideHookStateRenamePath, overrideProps = renderer2.overrideProps, overridePropsDeletePath = renderer2.overridePropsDeletePath, overridePropsRenamePath = renderer2.overridePropsRenamePath, scheduleRefresh = renderer2.scheduleRefresh, setErrorHandler = renderer2.setErrorHandler, setSuspenseHandler = renderer2.setSuspenseHandler, scheduleUpdate = renderer2.scheduleUpdate, scheduleRetry = renderer2.scheduleRetry, getCurrentFiber = renderer2.getCurrentFiber;
               var supportsTogglingError = typeof setErrorHandler === "function" && typeof scheduleUpdate === "function";
@@ -60651,7 +60690,7 @@ var require_backend = __commonJS({
                     return true;
                   case HostRoot:
                     return false;
-                  case Fragment:
+                  case Fragment2:
                     return key === null;
                   default:
                     var typeSymbol = getTypeSymbol(type);
@@ -60725,7 +60764,7 @@ var require_backend = __commonJS({
                     return ElementTypeHostComponent;
                   case HostPortal:
                   case HostText:
-                  case Fragment:
+                  case Fragment2:
                     return ElementTypeOtherOrUnknown;
                   case MemoComponent:
                   case SimpleMemoComponent:
@@ -71925,6 +71964,383 @@ var init_build2 = __esm({
   }
 });
 
+// node_modules/.pnpm/ink-text-input@6.0.0_ink@6.8.0_@types+react@19.2.14_react-devtools-core@7.0.1_react@19.2.4__react@19.2.4/node_modules/ink-text-input/build/index.js
+function TextInput({ value: originalValue, placeholder = "", focus = true, mask, highlightPastedText = false, showCursor = true, onChange, onSubmit }) {
+  const [state, setState] = (0, import_react29.useState)({
+    cursorOffset: (originalValue || "").length,
+    cursorWidth: 0
+  });
+  const { cursorOffset, cursorWidth } = state;
+  (0, import_react29.useEffect)(() => {
+    setState((previousState) => {
+      if (!focus || !showCursor) {
+        return previousState;
+      }
+      const newValue = originalValue || "";
+      if (previousState.cursorOffset > newValue.length - 1) {
+        return {
+          cursorOffset: newValue.length,
+          cursorWidth: 0
+        };
+      }
+      return previousState;
+    });
+  }, [originalValue, focus, showCursor]);
+  const cursorActualWidth = highlightPastedText ? cursorWidth : 0;
+  const value = mask ? mask.repeat(originalValue.length) : originalValue;
+  let renderedValue = value;
+  let renderedPlaceholder = placeholder ? source_default.grey(placeholder) : void 0;
+  if (showCursor && focus) {
+    renderedPlaceholder = placeholder.length > 0 ? source_default.inverse(placeholder[0]) + source_default.grey(placeholder.slice(1)) : source_default.inverse(" ");
+    renderedValue = value.length > 0 ? "" : source_default.inverse(" ");
+    let i = 0;
+    for (const char of value) {
+      renderedValue += i >= cursorOffset - cursorActualWidth && i <= cursorOffset ? source_default.inverse(char) : char;
+      i++;
+    }
+    if (value.length > 0 && cursorOffset === value.length) {
+      renderedValue += source_default.inverse(" ");
+    }
+  }
+  use_input_default((input, key) => {
+    if (key.upArrow || key.downArrow || key.ctrl && input === "c" || key.tab || key.shift && key.tab) {
+      return;
+    }
+    if (key.return) {
+      if (onSubmit) {
+        onSubmit(originalValue);
+      }
+      return;
+    }
+    let nextCursorOffset = cursorOffset;
+    let nextValue = originalValue;
+    let nextCursorWidth = 0;
+    if (key.leftArrow) {
+      if (showCursor) {
+        nextCursorOffset--;
+      }
+    } else if (key.rightArrow) {
+      if (showCursor) {
+        nextCursorOffset++;
+      }
+    } else if (key.backspace || key.delete) {
+      if (cursorOffset > 0) {
+        nextValue = originalValue.slice(0, cursorOffset - 1) + originalValue.slice(cursorOffset, originalValue.length);
+        nextCursorOffset--;
+      }
+    } else {
+      nextValue = originalValue.slice(0, cursorOffset) + input + originalValue.slice(cursorOffset, originalValue.length);
+      nextCursorOffset += input.length;
+      if (input.length > 1) {
+        nextCursorWidth = input.length;
+      }
+    }
+    if (cursorOffset < 0) {
+      nextCursorOffset = 0;
+    }
+    if (cursorOffset > originalValue.length) {
+      nextCursorOffset = originalValue.length;
+    }
+    setState({
+      cursorOffset: nextCursorOffset,
+      cursorWidth: nextCursorWidth
+    });
+    if (nextValue !== originalValue) {
+      onChange(nextValue);
+    }
+  }, { isActive: focus });
+  return import_react29.default.createElement(Text, null, placeholder ? value.length > 0 ? renderedValue : renderedPlaceholder : renderedValue);
+}
+var import_react29, build_default;
+var init_build3 = __esm({
+  async "node_modules/.pnpm/ink-text-input@6.0.0_ink@6.8.0_@types+react@19.2.14_react-devtools-core@7.0.1_react@19.2.4__react@19.2.4/node_modules/ink-text-input/build/index.js"() {
+    "use strict";
+    import_react29 = __toESM(require_react(), 1);
+    await init_build2();
+    init_source2();
+    build_default = TextInput;
+  }
+});
+
+// apps/cli/src/services/cli-tips.ts
+function rankCliTips(tips = CLI_TIPS) {
+  return [...tips].sort((firstTip, secondTip) => {
+    const relevancyDifference = secondTip.relevancy - firstTip.relevancy;
+    if (relevancyDifference !== 0) {
+      return relevancyDifference;
+    }
+    const insightDifference = secondTip.insight - firstTip.insight;
+    if (insightDifference !== 0) {
+      return insightDifference;
+    }
+    return firstTip.id.localeCompare(secondTip.id);
+  });
+}
+function selectCliTips(options = {}) {
+  const {
+    tips = CLI_TIPS,
+    limit = tips.length,
+    minimumRelevancy = Number.NEGATIVE_INFINITY,
+    minimumInsight = Number.NEGATIVE_INFINITY
+  } = options;
+  const normalizedLimit = Number.isFinite(limit) ? Math.max(0, Math.floor(limit)) : tips.length;
+  return rankCliTips(tips).filter((tip) => tip.relevancy >= minimumRelevancy && tip.insight >= minimumInsight).slice(0, normalizedLimit);
+}
+var CLI_TIPS;
+var init_cli_tips = __esm({
+  "apps/cli/src/services/cli-tips.ts"() {
+    "use strict";
+    CLI_TIPS = Object.freeze([
+      {
+        id: "examples-as-full-stack-starters",
+        text: "Treat CopilotKit examples as full-stack starters, not isolated snippets, because frontend, runtime, and agent code usually depend on each other.",
+        relevancy: 85,
+        insight: 68
+      },
+      {
+        id: "runtime-info-before-react-state",
+        text: "If your frontend cannot find an agent, check the runtime `/info` endpoint and try `127.0.0.1` before debugging React state.",
+        relevancy: 92,
+        insight: 94
+      },
+      {
+        id: "runtime-for-production-boundaries",
+        text: "Use Copilot Runtime for production auth, middleware, routing, threads, and observability; direct AG-UI connections are best kept for prototyping.",
+        relevancy: 96,
+        insight: 93
+      },
+      {
+        id: "default-agent-before-agent-ids",
+        text: "Register a `default` agent for simple apps, then pass matching `agentId` values once your app has multiple agents.",
+        relevancy: 94,
+        insight: 88
+      },
+      {
+        id: "debug-ag-ui-event-stream",
+        text: "AG-UI streams lifecycle, message, tool, state, and activity events over SSE, so debug the event stream instead of scraping chat text.",
+        relevancy: 82,
+        insight: 90
+      },
+      {
+        id: "built-in-agent-before-factory-mode",
+        text: "Use `BuiltInAgent` for fast in-process chat and tools, and switch to factory mode only when you need full control of the model stream.",
+        relevancy: 78,
+        insight: 82
+      },
+      {
+        id: "mcp-servers-vs-clients",
+        text: "Use `mcpServers` for runtime-managed MCP connections and `mcpClients` when you need custom auth, caching, or lifecycle control.",
+        relevancy: 72,
+        insight: 89
+      },
+      {
+        id: "mcp-apps-stable-server-ids",
+        text: "For MCP Apps, configure runtime `mcpApps.servers` and pin stable `serverId` values so restored conversations keep their UI.",
+        relevancy: 65,
+        insight: 92
+      },
+      {
+        id: "use-threads-for-resume",
+        text: "Use `useThreads` for persistent conversation lists and pass `threadId` to `CopilotChat` when resuming a specific thread.",
+        relevancy: 80,
+        insight: 88
+      },
+      {
+        id: "archive-vs-delete-threads",
+        text: "Remember that archived threads are recoverable but deleted threads are not, so add your own confirmation UX for destructive thread actions.",
+        relevancy: 76,
+        insight: 84
+      },
+      {
+        id: "dev-console-and-production-errors",
+        text: "Use `showDevConsole` only during local development and wire `onError` for production error handling.",
+        relevancy: 91,
+        insight: 91
+      },
+      {
+        id: "server-debug-for-missing-events",
+        text: "Enable server `debug: true` when events, state, or tool calls disappear, then use the Inspector or `/cpk-debug-events` for live AG-UI details.",
+        relevancy: 82,
+        insight: 90
+      },
+      {
+        id: "react-core-v2-imports",
+        text: "Import the provider from `@copilotkit/react-core`, v2 APIs from `@copilotkit/react-core/v2`, and load v2 styles once.",
+        relevancy: 95,
+        insight: 86
+      },
+      {
+        id: "built-in-chat-surfaces-first",
+        text: "Reach for `CopilotChat`, `CopilotSidebar`, or `CopilotPopup` before building a chat shell from scratch.",
+        relevancy: 93,
+        insight: 72
+      },
+      {
+        id: "customize-before-replacing-chat",
+        text: "Customize copy with labels, structure with slots, and visuals with scoped CSS before replacing built-in chat components wholesale.",
+        relevancy: 88,
+        insight: 86
+      },
+      {
+        id: "slots-before-headless",
+        text: "Use slots before going headless because v2 slots support class strings, prop overrides, and full component replacement.",
+        relevancy: 90,
+        insight: 84
+      },
+      {
+        id: "use-agent-for-custom-chat",
+        text: "For custom chat UIs, use `useAgent` for messages, state, and running status, then call `copilotkit.runAgent({ agent })`.",
+        relevancy: 86,
+        insight: 94
+      },
+      {
+        id: "throttle-custom-message-lists",
+        text: "Add `throttleMs` to `useAgent` when token-by-token streaming causes hot re-renders in custom message lists.",
+        relevancy: 78,
+        insight: 84
+      },
+      {
+        id: "proxied-agent-for-isolated-state",
+        text: "Use `registerProxiedAgent` when multiple chat windows share one runtime agent but need isolated frontend state.",
+        relevancy: 55,
+        insight: 88
+      },
+      {
+        id: "chat-configuration-provider-context",
+        text: "Use `CopilotChatConfigurationProvider` when custom chat pieces need shared labels, `agentId`, `threadId`, or modal state.",
+        relevancy: 60,
+        insight: 78
+      },
+      {
+        id: "agent-context-for-serializable-state",
+        text: "Use `useAgentContext` in v2 to expose serializable app state such as selected rows, filters, or preferences to the agent.",
+        relevancy: 88,
+        insight: 84
+      },
+      {
+        id: "frontend-tools-with-dependencies",
+        text: "Register browser-side actions with `useFrontendTool`, include dependencies for captured state, and use `runTool` for button-triggered tools.",
+        relevancy: 86,
+        insight: 93
+      },
+      {
+        id: "capability-gated-controls",
+        text: "Use `useCapabilities` to hide controls for features the current agent did not declare.",
+        relevancy: 62,
+        insight: 79
+      },
+      {
+        id: "component-rendering-from-typed-params",
+        text: "Use `useComponent` when the agent should render one of your React components from typed parameters.",
+        relevancy: 73,
+        insight: 80
+      },
+      {
+        id: "render-tool-names-match-backend",
+        text: "Use `useRenderTool` for backend tool-call UI, and keep renderer names identical to backend tool names.",
+        relevancy: 84,
+        insight: 87
+      },
+      {
+        id: "wildcard-tool-renderers",
+        text: "Add wildcard or default tool renderers during development to reveal unexpected tool calls and unhandled MCP tools.",
+        relevancy: 76,
+        insight: 88
+      },
+      {
+        id: "tool-progress-from-status",
+        text: "Render tool progress from `ToolCallStatus` instead of guessing from partial arguments.",
+        relevancy: 72,
+        insight: 84
+      },
+      {
+        id: "human-in-loop-and-interrupts",
+        text: "Use `useHumanInTheLoop` for model-initiated approvals and `useInterrupt` for graph-enforced checkpoints on supported runtimes.",
+        relevancy: 76,
+        insight: 91
+      },
+      {
+        id: "agent-scoped-suggestions",
+        text: "Use `useConfigureSuggestions` and `useSuggestions` for agent-scoped prompt pills instead of hard-coded static chips.",
+        relevancy: 72,
+        insight: 82
+      },
+      {
+        id: "suggestions-by-provider-and-consumer",
+        text: "Scope suggestions by provider and consumer agent when multiple agents share a page.",
+        relevancy: 64,
+        insight: 84
+      },
+      {
+        id: "welcome-screen-render-prop",
+        text: "Use the `welcomeScreen` render prop to customize the empty state while preserving default input and suggestions.",
+        relevancy: 68,
+        insight: 73
+      },
+      {
+        id: "open-generative-ui-sandbox",
+        text: "Use Open Generative UI for sandboxed ad hoc UI, and expose only deliberate host callbacks through `sandboxFunctions`.",
+        relevancy: 55,
+        insight: 89
+      },
+      {
+        id: "a2ui-for-catalog-backed-ui",
+        text: "Use A2UI when you want declarative, catalog-backed generative UI with runtime middleware and frontend theming.",
+        relevancy: 55,
+        insight: 84
+      },
+      {
+        id: "mcp-apps-inline-ui",
+        text: "Use MCP Apps when remote MCP-provided UI resources should render inline inside normal CopilotKit chat.",
+        relevancy: 62,
+        insight: 88
+      },
+      {
+        id: "langgraph-for-ag-ui-bridges",
+        text: "Use LangGraph integration when you need subgraph streaming, state/context injection, frontend tool interception, or graph interrupts bridged into AG-UI.",
+        relevancy: 86,
+        insight: 92
+      },
+      {
+        id: "backend-aligned-starters",
+        text: "Pick the starter closest to your backend, whether LangGraph, CrewAI, Mastra, LlamaIndex, PydanticAI, ADK, Strands, Microsoft Agent Framework, or A2A.",
+        relevancy: 83,
+        insight: 68
+      },
+      {
+        id: "ag-ui-at-a2a-boundary",
+        text: "For A2A systems, keep AG-UI at the app boundary and let A2A middleware coordinate agents behind it.",
+        relevancy: 70,
+        insight: 88
+      },
+      {
+        id: "canvas-shared-state-source",
+        text: "In canvas-style apps, make shared state the source of truth and expose narrow frontend actions for each operation the agent can perform.",
+        relevancy: 82,
+        insight: 90
+      },
+      {
+        id: "canvas-card-type-coordination",
+        text: "When adding a new canvas card type, update the frontend schema, renderer, agent schema, and matching actions together.",
+        relevancy: 78,
+        insight: 89
+      },
+      {
+        id: "production-observability-hooks",
+        text: "Use production observability hooks when you need structured chat, error, and runtime signals in Sentry, Datadog, New Relic, OpenTelemetry, or analytics tools.",
+        relevancy: 84,
+        insight: 87
+      },
+      {
+        id: "enterprise-intelligence-platform",
+        text: "Use the Enterprise Intelligence Platform when you need persistent threads, observability, and production operations beyond local debugging.",
+        relevancy: 82,
+        insight: 79
+      }
+    ]);
+  }
+});
+
 // node_modules/.pnpm/react@19.2.4/node_modules/react/cjs/react-jsx-runtime.production.js
 var require_react_jsx_runtime_production = __commonJS({
   "node_modules/.pnpm/react@19.2.4/node_modules/react/cjs/react-jsx-runtime.production.js"(exports) {
@@ -72231,28 +72647,191 @@ var require_jsx_runtime = __commonJS({
   }
 });
 
+// apps/cli/src/ui/cli-tip.tsx
+function normalizeCliTipSelectionIndex(selectionIndex = 0) {
+  return Number.isFinite(selectionIndex) ? Math.max(0, Math.floor(selectionIndex)) : 0;
+}
+function normalizeCliTipLimit(limit, fallback) {
+  return Number.isFinite(limit) ? Math.max(0, Math.floor(limit)) : fallback;
+}
+function normalizeCliTipRandomValue(randomValue) {
+  if (!Number.isFinite(randomValue)) {
+    return 0;
+  }
+  return Math.min(Math.max(randomValue, 0), 1 - Number.EPSILON);
+}
+function shuffleCliTips(tips, rng = Math.random) {
+  const shuffledTips = [...tips];
+  for (let index = shuffledTips.length - 1; index > 0; index -= 1) {
+    const swapIndex = Math.floor(normalizeCliTipRandomValue(rng()) * (index + 1));
+    const currentTip = shuffledTips[index];
+    const swapTip = shuffledTips[swapIndex];
+    if (currentTip !== void 0 && swapTip !== void 0) {
+      shuffledTips[index] = swapTip;
+      shuffledTips[swapIndex] = currentTip;
+    }
+  }
+  return shuffledTips;
+}
+function selectCliTipRotationSubset(tips, options = {}) {
+  const {
+    rotationLimit = CLI_TIP_DEFAULT_ROTATION_LIMIT,
+    rotationPoolLimit = CLI_TIP_DEFAULT_ROTATION_POOL_LIMIT,
+    randomize = false,
+    rng = Math.random
+  } = typeof options === "number" ? { rotationLimit: options } : options;
+  const normalizedLimit = normalizeCliTipLimit(
+    rotationLimit,
+    CLI_TIP_DEFAULT_ROTATION_LIMIT
+  );
+  const normalizedPoolLimit = normalizeCliTipLimit(
+    rotationPoolLimit,
+    CLI_TIP_DEFAULT_ROTATION_POOL_LIMIT
+  );
+  const rankedPool = selectCliTips({
+    tips,
+    limit: Math.max(normalizedLimit, normalizedPoolLimit)
+  }).slice(0, normalizedPoolLimit);
+  if (!randomize) {
+    return rankedPool.slice(0, normalizedLimit);
+  }
+  return shuffleCliTips(rankedPool, rng).slice(0, normalizedLimit);
+}
+function parseCliTipText(text) {
+  const segments = [];
+  let cursor = 0;
+  while (cursor < text.length) {
+    const openingBacktick = text.indexOf("`", cursor);
+    if (openingBacktick === -1) {
+      segments.push({ kind: "text", text: text.slice(cursor) });
+      break;
+    }
+    const closingBacktick = text.indexOf("`", openingBacktick + 1);
+    if (closingBacktick === -1) {
+      segments.push({ kind: "text", text: text.slice(cursor) });
+      break;
+    }
+    if (openingBacktick > cursor) {
+      segments.push({
+        kind: "text",
+        text: text.slice(cursor, openingBacktick)
+      });
+    }
+    segments.push({
+      kind: "code",
+      text: text.slice(openingBacktick + 1, closingBacktick)
+    });
+    cursor = closingBacktick + 1;
+  }
+  return segments;
+}
+function CliTip({
+  tips,
+  selectionIndex = 0,
+  delayMs = CLI_TIP_DEFAULT_DELAY_MS,
+  rotationMs = CLI_TIP_DEFAULT_ROTATION_MS,
+  rotationLimit = CLI_TIP_DEFAULT_ROTATION_LIMIT,
+  rotationPoolLimit = CLI_TIP_DEFAULT_ROTATION_POOL_LIMIT,
+  randomize = true,
+  rng = Math.random
+}) {
+  const [visible, setVisible] = (0, import_react30.useState)(delayMs <= 0);
+  const selectedTips = (0, import_react30.useMemo)(
+    () => selectCliTipRotationSubset(tips, {
+      rotationLimit,
+      rotationPoolLimit,
+      randomize,
+      rng
+    }),
+    [tips, rotationLimit, rotationPoolLimit, randomize, rng]
+  );
+  const initialSelectionIndex = (0, import_react30.useMemo)(
+    () => selectedTips.length === 0 ? 0 : normalizeCliTipSelectionIndex(selectionIndex) % selectedTips.length,
+    [selectedTips.length, selectionIndex]
+  );
+  const [selectedIndex, setSelectedIndex] = (0, import_react30.useState)(initialSelectionIndex);
+  const selectedTip = selectedTips[selectedIndex] ?? null;
+  const textSegments = (0, import_react30.useMemo)(
+    () => selectedTip === null ? [] : parseCliTipText(selectedTip.text),
+    [selectedTip]
+  );
+  (0, import_react30.useEffect)(() => {
+    if (delayMs <= 0) {
+      setVisible(true);
+      return;
+    }
+    setVisible(false);
+    const timer = setTimeout(() => {
+      setVisible(true);
+    }, delayMs);
+    return () => {
+      clearTimeout(timer);
+    };
+  }, [delayMs]);
+  (0, import_react30.useEffect)(() => {
+    setSelectedIndex(initialSelectionIndex);
+  }, [initialSelectionIndex, selectedTips]);
+  (0, import_react30.useEffect)(() => {
+    if (!visible || selectedTips.length <= 1 || rotationMs <= 0) {
+      return;
+    }
+    const timer = setInterval(() => {
+      setSelectedIndex(
+        (currentIndex) => (currentIndex + 1) % selectedTips.length
+      );
+    }, rotationMs);
+    return () => {
+      clearInterval(timer);
+    };
+  }, [rotationMs, selectedTips.length, visible]);
+  if (!visible || selectedTip === null) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { color: "gray", children: [
+    "Tip:",
+    " ",
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { color: "cyan", children: textSegments.map(
+      (segment, index) => segment.kind === "code" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { bold: true, color: "white", children: segment.text }, `${segment.kind}-${index}`) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { color: "cyan", children: segment.text }, `${segment.kind}-${index}`)
+    ) })
+  ] }) });
+}
+var import_react30, import_jsx_runtime, CLI_TIP_DEFAULT_DELAY_MS, CLI_TIP_DEFAULT_ROTATION_MS, CLI_TIP_DEFAULT_ROTATION_LIMIT, CLI_TIP_DEFAULT_ROTATION_POOL_LIMIT;
+var init_cli_tip = __esm({
+  async "apps/cli/src/ui/cli-tip.tsx"() {
+    "use strict";
+    import_react30 = __toESM(require_react(), 1);
+    await init_build2();
+    init_cli_tips();
+    import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
+    CLI_TIP_DEFAULT_DELAY_MS = 2500;
+    CLI_TIP_DEFAULT_ROTATION_MS = 12e3;
+    CLI_TIP_DEFAULT_ROTATION_LIMIT = 5;
+    CLI_TIP_DEFAULT_ROTATION_POOL_LIMIT = 20;
+  }
+});
+
 // apps/cli/src/ui/spinner.tsx
 function Spinner({ label }) {
-  const [frame, setFrame] = (0, import_react29.useState)(0);
-  (0, import_react29.useEffect)(() => {
+  const [frame, setFrame] = (0, import_react31.useState)(0);
+  (0, import_react31.useEffect)(() => {
     const id = setInterval(() => {
       setFrame((prev) => (prev + 1) % KITE_FRAMES.length);
     }, FRAME_INTERVAL_MS);
     return () => clearInterval(id);
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { color: "magenta", children: KITE_FRAMES[frame] }),
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Text, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text, { color: "magenta", children: KITE_FRAMES[frame] }),
     " ",
     label
   ] });
 }
-var import_react29, import_jsx_runtime, KITE_FRAMES, FRAME_INTERVAL_MS;
+var import_react31, import_jsx_runtime2, KITE_FRAMES, FRAME_INTERVAL_MS;
 var init_spinner = __esm({
   async "apps/cli/src/ui/spinner.tsx"() {
     "use strict";
-    import_react29 = __toESM(require_react(), 1);
+    import_react31 = __toESM(require_react(), 1);
     await init_build2();
-    import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
+    import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1);
     KITE_FRAMES = [
       "\u{1FA81}      ",
       "~\u{1FA81}     ",
@@ -72275,10 +72854,11 @@ function BrowserLoginProvider({
   loginRunner = login,
   isInteractive
 }) {
-  const [state, setState] = (0, import_react30.useState)(idleState);
-  const pendingConfirmationRef = (0, import_react30.useRef)(null);
+  const [state, setState] = (0, import_react32.useState)(idleState);
+  const pendingConfirmationRef = (0, import_react32.useRef)(null);
+  const pendingManualTokenRef = (0, import_react32.useRef)(null);
   const shouldConfirm = isInteractive ?? isBrowserLoginConfirmationInteractive();
-  const confirmBrowserLoginStart = (0, import_react30.useCallback)(() => {
+  const confirmBrowserLoginStart = (0, import_react32.useCallback)(() => {
     const pendingConfirmation = pendingConfirmationRef.current;
     if (pendingConfirmation === null) {
       return void 0;
@@ -72287,7 +72867,20 @@ function BrowserLoginProvider({
     pendingConfirmation.resolve(void 0);
     return void 0;
   }, []);
-  const runLogin2 = (0, import_react30.useCallback)(async () => {
+  const submitManualClerkToken = (0, import_react32.useCallback)((clerkToken) => {
+    const pendingManualToken = pendingManualTokenRef.current;
+    if (pendingManualToken === null) {
+      return void 0;
+    }
+    const trimmed = clerkToken.trim();
+    if (trimmed.length === 0) {
+      return void 0;
+    }
+    pendingManualTokenRef.current = null;
+    pendingManualToken.resolve(trimmed);
+    return void 0;
+  }, []);
+  const runLogin2 = (0, import_react32.useCallback)(async (passthroughOptions) => {
     if (pendingConfirmationRef.current !== null) {
       throw new Error("Browser login is already waiting for confirmation.");
     }
@@ -72304,15 +72897,42 @@ function BrowserLoginProvider({
       });
     }
     setState({ ...idleState, phase: "waiting" });
+    const manualClerkToken = new Promise((resolve2, reject) => {
+      pendingManualTokenRef.current = {
+        resolve: resolve2,
+        reject: (reason) => {
+          reject(reason);
+          return void 0;
+        }
+      };
+    });
+    manualClerkToken.catch(() => void 0);
     try {
-      const result = await loginRunner();
+      const result = await loginRunner({
+        ...passthroughOptions ?? {},
+        manualClerkToken
+      });
       const organizationName = result.organization.organizationName ?? result.organization.clerkOrgId;
+      pendingManualTokenRef.current = null;
+      const identity = {
+        email: result.user.email,
+        organizationName
+      };
+      if (result.source === "manual") {
+        setState({
+          phase: "finalizing",
+          identity,
+          errorMessage: ""
+        });
+        await new Promise((resolve2) => {
+          setTimeout(() => {
+            resolve2(void 0);
+          }, MANUAL_PASTE_FINALIZING_MS);
+        });
+      }
       setState({
         phase: "success",
-        identity: {
-          email: result.user.email,
-          organizationName
-        },
+        identity,
         errorMessage: ""
       });
       return result;
@@ -72321,6 +72941,7 @@ function BrowserLoginProvider({
         error48,
         "An unexpected error occurred."
       );
+      pendingManualTokenRef.current = null;
       setState({
         phase: "error",
         identity: null,
@@ -72329,37 +72950,45 @@ function BrowserLoginProvider({
       throw concreteError;
     }
   }, [loginRunner, shouldConfirm]);
-  (0, import_react30.useEffect)(() => {
+  (0, import_react32.useEffect)(() => {
     return () => {
       const pendingConfirmation = pendingConfirmationRef.current;
-      if (pendingConfirmation === null) {
-        return;
+      if (pendingConfirmation !== null) {
+        pendingConfirmationRef.current = null;
+        pendingConfirmation.reject(
+          new Error("Browser login confirmation was interrupted.")
+        );
+      }
+      const pendingManualToken = pendingManualTokenRef.current;
+      if (pendingManualToken !== null) {
+        pendingManualTokenRef.current = null;
+        pendingManualToken.reject(
+          new Error("Browser login manual paste was interrupted.")
+        );
       }
-      pendingConfirmationRef.current = null;
-      pendingConfirmation.reject(
-        new Error("Browser login confirmation was interrupted.")
-      );
     };
   }, []);
-  const value = (0, import_react30.useMemo)(
+  const value = (0, import_react32.useMemo)(
     () => ({
       runLogin: runLogin2,
       state,
-      confirmBrowserLoginStart
+      confirmBrowserLoginStart,
+      submitManualClerkToken
     }),
-    [confirmBrowserLoginStart, runLogin2, state]
+    [confirmBrowserLoginStart, runLogin2, state, submitManualClerkToken]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(BrowserLoginContext.Provider, { value, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(BrowserLoginContext.Provider, { value, children });
 }
 function useBrowserLogin() {
-  const context = (0, import_react30.useContext)(BrowserLoginContext);
+  const context = (0, import_react32.useContext)(BrowserLoginContext);
   if (context === null) {
     throw new Error("useBrowserLogin must be used inside BrowserLoginProvider.");
   }
   return context;
 }
 function BrowserLoginConfirmation() {
-  const { state, confirmBrowserLoginStart } = useBrowserLogin();
+  const { state, confirmBrowserLoginStart, submitManualClerkToken } = useBrowserLogin();
+  const [manualTokenInput, setManualTokenInput] = (0, import_react32.useState)("");
   use_input_default((_input, key) => {
     if (state.phase === "confirming" && key.return) {
       confirmBrowserLoginStart();
@@ -72369,58 +72998,105 @@ function BrowserLoginConfirmation() {
     return null;
   }
   if (state.phase === "confirming") {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Box_default, { flexDirection: "column", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text, { children: BROWSER_LOGIN_CONFIRMATION_MESSAGE }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text, { color: "gray", children: BROWSER_LOGIN_CONFIRMATION_PROMPT })
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { children: BROWSER_LOGIN_CONFIRMATION_MESSAGE }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "gray", children: BROWSER_LOGIN_CONFIRMATION_PROMPT })
     ] });
   }
   if (state.phase === "waiting") {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Spinner, { label: "\u{1FA81} Waiting for browser sign-in\u2026" }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Spinner, { label: "\u{1FA81} Waiting for browser sign-in\u2026" }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { marginTop: 1, flexDirection: "column", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "gray", children: BROWSER_LOGIN_MANUAL_PASTE_LABEL }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { children: [
+            ">",
+            " "
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            build_default,
+            {
+              value: manualTokenInput,
+              onChange: setManualTokenInput,
+              onSubmit: (value) => {
+                submitManualClerkToken(value);
+                setManualTokenInput("");
+              },
+              placeholder: "paste code and press Enter"
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CliTip, {})
+    ] });
+  }
+  if (state.phase === "finalizing" && state.identity !== null) {
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "green", children: "Logged in successfully!" }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { children: [
+        "Email: ",
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { bold: true, children: state.identity.email })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { children: [
+        "Organization: ",
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { bold: true, children: state.identity.organizationName })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Spinner, { label: "Wrapping up..." }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CliTip, {})
+    ] });
   }
   if (state.phase === "success" && state.identity !== null) {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Box_default, { flexDirection: "column", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text, { color: "green", children: "Logged in successfully!" }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Text, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "green", children: "Logged in successfully!" }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { children: [
         "Email: ",
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text, { bold: true, children: state.identity.email })
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { bold: true, children: state.identity.email })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Text, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { children: [
         "Organization: ",
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text, { bold: true, children: state.identity.organizationName })
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { bold: true, children: state.identity.organizationName })
       ] })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Text, { color: "red", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "red", children: [
     "Login failed: ",
     state.errorMessage
   ] }) });
 }
-var import_react30, import_jsx_runtime2, BROWSER_LOGIN_CONFIRMATION_MESSAGE, BROWSER_LOGIN_CONFIRMATION_PROMPT, idleState, BrowserLoginContext;
+var import_react32, import_jsx_runtime3, BROWSER_LOGIN_CONFIRMATION_MESSAGE, BROWSER_LOGIN_CONFIRMATION_PROMPT, MANUAL_PASTE_FINALIZING_MS, idleState, BrowserLoginContext, BROWSER_LOGIN_MANUAL_PASTE_LABEL;
 var init_browser_login = __esm({
   async "apps/cli/src/ui/browser-login.tsx"() {
     "use strict";
-    import_react30 = __toESM(require_react(), 1);
+    import_react32 = __toESM(require_react(), 1);
     await init_build2();
+    await init_build3();
     init_auth_service();
     init_cli_auth_diagnostics();
+    await init_cli_tip();
     await init_spinner();
-    import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1);
+    import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1);
     BROWSER_LOGIN_CONFIRMATION_MESSAGE = "Sign in to your \u{1FA81} CopilotKit account in your browser.";
     BROWSER_LOGIN_CONFIRMATION_PROMPT = "Press Enter to continue...";
+    MANUAL_PASTE_FINALIZING_MS = 6e3;
     idleState = {
       phase: "idle",
       identity: null,
       errorMessage: ""
     };
-    BrowserLoginContext = (0, import_react30.createContext)(null);
+    BrowserLoginContext = (0, import_react32.createContext)(null);
+    BROWSER_LOGIN_MANUAL_PASTE_LABEL = "If your browser finished sign-in but the CLI didn't notice, paste the code shown in the browser:";
   }
 });
 
 // apps/cli/src/commands/license.tsx
 var license_exports = {};
 __export(license_exports, {
-  runLicense: () => runLicense
+  runLicense: () => runLicense,
+  shouldRenderLicenseCreateBrowserLoginConfirmation: () => shouldRenderLicenseCreateBrowserLoginConfirmation
 });
+function shouldRenderLicenseCreateBrowserLoginConfirmation(phase) {
+  return phase === "confirming" || phase === "waiting" || phase === "finalizing";
+}
 async function ensureCliToken(loginRunner = login, onTerminalSessionInvalidation) {
   const storedToken = authStore.getToken();
   let session;
@@ -72518,10 +73194,10 @@ function formatLicenseList(scope, licenses) {
 function LicenseCreateApp({ onIssued }) {
   const { exit } = use_app_default();
   const browserLogin = useBrowserLogin();
-  const [phase, setPhase] = (0, import_react31.useState)("auth");
-  const [errorMessage, setErrorMessage] = (0, import_react31.useState)("");
-  const [authMessage, setAuthMessage] = (0, import_react31.useState)("");
-  (0, import_react31.useEffect)(() => {
+  const [phase, setPhase] = (0, import_react33.useState)("auth");
+  const [errorMessage, setErrorMessage] = (0, import_react33.useState)("");
+  const [authMessage, setAuthMessage] = (0, import_react33.useState)("");
+  (0, import_react33.useEffect)(() => {
     let cancelled = false;
     async function run() {
       setPhase("auth");
@@ -72569,32 +73245,32 @@ function LicenseCreateApp({ onIssued }) {
       cancelled = true;
     };
   }, [browserLogin.runLogin, onIssued, exit]);
-  if (browserLogin.state.phase === "confirming" || browserLogin.state.phase === "waiting") {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(BrowserLoginConfirmation, {});
+  if (shouldRenderLicenseCreateBrowserLoginConfirmation(browserLogin.state.phase)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(BrowserLoginConfirmation, {});
   }
   if (phase === "auth") {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", children: [
-      authMessage ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "yellow", children: authMessage }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Spinner, { label: "Verifying authentication\u2026" })
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { flexDirection: "column", children: [
+      authMessage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "yellow", children: authMessage }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Spinner, { label: "Verifying authentication\u2026" })
     ] });
   }
   if (phase === "issue") {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", children: [
-      authMessage ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "yellow", children: authMessage }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Spinner, { label: "Issuing license key\u2026" })
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { flexDirection: "column", children: [
+      authMessage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "yellow", children: authMessage }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Spinner, { label: "Issuing license key\u2026" })
     ] });
   }
   if (phase === "success") {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", gap: 1, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "green", children: "License key issued." }),
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { flexDirection: "column", gap: 1, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "green", children: "License key issued." }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { children: [
         "Add the line printed below to your ",
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { bold: true, children: ".env" }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { bold: true, children: ".env" }),
         " file:"
       ] })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "red", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: "red", children: [
     "License failed: ",
     errorMessage
   ] }) });
@@ -72624,7 +73300,7 @@ async function runLicense(command) {
   }
   let issuedKey = null;
   const { waitUntilExit } = render_default(
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(BrowserLoginProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(LicenseCreateApp, { onIssued: (k) => {
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(BrowserLoginProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(LicenseCreateApp, { onIssued: (k) => {
       issuedKey = k;
     } }) })
   );
@@ -72634,11 +73310,11 @@ async function runLicense(command) {
 `);
   }
 }
-var import_react31, import_jsx_runtime3;
+var import_react33, import_jsx_runtime4;
 var init_license = __esm({
   async "apps/cli/src/commands/license.tsx"() {
     "use strict";
-    import_react31 = __toESM(require_react(), 1);
+    import_react33 = __toESM(require_react(), 1);
     await init_build2();
     await init_build2();
     init_auth_service();
@@ -72647,7 +73323,7 @@ var init_license = __esm({
     await init_browser_login();
     await init_spinner();
     init_config();
-    import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1);
+    import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1);
   }
 });
 
@@ -73410,17 +74086,17 @@ var init_project_scaffold = __esm({
 
 // apps/cli/src/ui/banner.tsx
 function Banner() {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { flexDirection: "column", marginBottom: 1, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "magenta", children: KITE }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "magenta", children: "~ Welcome to CopilotKit! ~" })
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Box_default, { flexDirection: "column", marginBottom: 1, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text, { color: "magenta", children: KITE }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text, { color: "magenta", children: "~ Welcome to CopilotKit! ~" })
   ] });
 }
-var import_jsx_runtime4, KITE;
+var import_jsx_runtime5, KITE;
 var init_banner = __esm({
   async "apps/cli/src/ui/banner.tsx"() {
     "use strict";
     await init_build2();
-    import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1);
+    import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1);
     KITE = `\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF
 \u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u281F\u2819\u28FF\u285B\u283B\u283F\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF
 \u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u28FF\u280B\u2800\u2800\u2808\u28BF\u2844\u2800\u2800\u2800\u2808\u2809\u2819\u28FB\u28FF\u28FF\u28FF
@@ -73740,13 +74416,13 @@ var init_figures = __esm({
 
 // node_modules/.pnpm/ink-select-input@6.2.0_ink@6.8.0_@types+react@19.2.14_react-devtools-core@7.0.1_react@19.2.4__react@19.2.4/node_modules/ink-select-input/build/Indicator.js
 function Indicator({ isSelected = false }) {
-  return import_react32.default.createElement(Box_default, { marginRight: 1 }, isSelected ? import_react32.default.createElement(Text, { color: "blue" }, figures_default.pointer) : import_react32.default.createElement(Text, null, " "));
+  return import_react34.default.createElement(Box_default, { marginRight: 1 }, isSelected ? import_react34.default.createElement(Text, { color: "blue" }, figures_default.pointer) : import_react34.default.createElement(Text, null, " "));
 }
-var import_react32, Indicator_default;
+var import_react34, Indicator_default;
 var init_Indicator = __esm({
   async "node_modules/.pnpm/ink-select-input@6.2.0_ink@6.8.0_@types+react@19.2.14_react-devtools-core@7.0.1_react@19.2.4__react@19.2.4/node_modules/ink-select-input/build/Indicator.js"() {
     "use strict";
-    import_react32 = __toESM(require_react(), 1);
+    import_react34 = __toESM(require_react(), 1);
     await init_build2();
     init_figures();
     Indicator_default = Indicator;
@@ -73755,13 +74431,13 @@ var init_Indicator = __esm({
 
 // node_modules/.pnpm/ink-select-input@6.2.0_ink@6.8.0_@types+react@19.2.14_react-devtools-core@7.0.1_react@19.2.4__react@19.2.4/node_modules/ink-select-input/build/Item.js
 function Item({ isSelected = false, label }) {
-  return React12.createElement(Text, { color: isSelected ? "blue" : void 0 }, label);
+  return React13.createElement(Text, { color: isSelected ? "blue" : void 0 }, label);
 }
-var React12, Item_default;
+var React13, Item_default;
 var init_Item = __esm({
   async "node_modules/.pnpm/ink-select-input@6.2.0_ink@6.8.0_@types+react@19.2.14_react-devtools-core@7.0.1_react@19.2.4__react@19.2.4/node_modules/ink-select-input/build/Item.js"() {
     "use strict";
-    React12 = __toESM(require_react(), 1);
+    React13 = __toESM(require_react(), 1);
     await init_build2();
     Item_default = Item;
   }
@@ -73800,17 +74476,17 @@ function SelectInput({ items = [], isFocused = true, initialIndex = 0, indicator
   const hasLimit = typeof customLimit === "number" && items.length > customLimit;
   const limit = hasLimit ? Math.min(customLimit, items.length) : items.length;
   const lastIndex = limit - 1;
-  const [rotateIndex, setRotateIndex] = (0, import_react33.useState)(initialIndex > lastIndex ? lastIndex - initialIndex : 0);
-  const [selectedIndex, setSelectedIndex] = (0, import_react33.useState)(initialIndex ? initialIndex > lastIndex ? lastIndex : initialIndex : 0);
-  const previousItems = (0, import_react33.useRef)(items);
-  (0, import_react33.useEffect)(() => {
+  const [rotateIndex, setRotateIndex] = (0, import_react35.useState)(initialIndex > lastIndex ? lastIndex - initialIndex : 0);
+  const [selectedIndex, setSelectedIndex] = (0, import_react35.useState)(initialIndex ? initialIndex > lastIndex ? lastIndex : initialIndex : 0);
+  const previousItems = (0, import_react35.useRef)(items);
+  (0, import_react35.useEffect)(() => {
     if (!isDeepStrictEqual2(previousItems.current.map((item) => item.value), items.map((item) => item.value))) {
       setRotateIndex(0);
       setSelectedIndex(0);
     }
     previousItems.current = items;
   }, [items]);
-  use_input_default((0, import_react33.useCallback)((input, key) => {
+  use_input_default((0, import_react35.useCallback)((input, key) => {
     if (input === "k" || key.upArrow) {
       const lastIndex2 = (hasLimit ? limit : items.length) - 1;
       const atFirstIndex = selectedIndex === 0;
@@ -73862,24 +74538,24 @@ function SelectInput({ items = [], isFocused = true, initialIndex = 0, indicator
     onHighlight
   ]), { isActive: isFocused });
   const slicedItems = hasLimit ? toRotated(items, rotateIndex).slice(0, limit) : items;
-  return import_react33.default.createElement(Box_default, { flexDirection: "column" }, slicedItems.map((item, index) => {
+  return import_react35.default.createElement(Box_default, { flexDirection: "column" }, slicedItems.map((item, index) => {
     const isSelected = index === selectedIndex;
     return (
       // @ts-expect-error - `key` can't be optional but `item.value` is generic T
-      import_react33.default.createElement(
+      import_react35.default.createElement(
         Box_default,
         { key: item.key ?? item.value },
-        import_react33.default.createElement(indicatorComponent, { isSelected }),
-        import_react33.default.createElement(itemComponent, { ...item, isSelected })
+        import_react35.default.createElement(indicatorComponent, { isSelected }),
+        import_react35.default.createElement(itemComponent, { ...item, isSelected })
       )
     );
   }));
 }
-var import_react33, SelectInput_default;
+var import_react35, SelectInput_default;
 var init_SelectInput = __esm({
   async "node_modules/.pnpm/ink-select-input@6.2.0_ink@6.8.0_@types+react@19.2.14_react-devtools-core@7.0.1_react@19.2.4__react@19.2.4/node_modules/ink-select-input/build/SelectInput.js"() {
     "use strict";
-    import_react33 = __toESM(require_react(), 1);
+    import_react35 = __toESM(require_react(), 1);
     init_to_rotated();
     await init_build2();
     await init_Indicator();
@@ -73889,7 +74565,7 @@ var init_SelectInput = __esm({
 });
 
 // node_modules/.pnpm/ink-select-input@6.2.0_ink@6.8.0_@types+react@19.2.14_react-devtools-core@7.0.1_react@19.2.4__react@19.2.4/node_modules/ink-select-input/build/index.js
-var init_build3 = __esm({
+var init_build4 = __esm({
   async "node_modules/.pnpm/ink-select-input@6.2.0_ink@6.8.0_@types+react@19.2.14_react-devtools-core@7.0.1_react@19.2.4__react@19.2.4/node_modules/ink-select-input/build/index.js"() {
     "use strict";
     await init_Indicator();
@@ -73898,104 +74574,6 @@ var init_build3 = __esm({
   }
 });
 
-// node_modules/.pnpm/ink-text-input@6.0.0_ink@6.8.0_@types+react@19.2.14_react-devtools-core@7.0.1_react@19.2.4__react@19.2.4/node_modules/ink-text-input/build/index.js
-function TextInput({ value: originalValue, placeholder = "", focus = true, mask, highlightPastedText = false, showCursor = true, onChange, onSubmit }) {
-  const [state, setState] = (0, import_react34.useState)({
-    cursorOffset: (originalValue || "").length,
-    cursorWidth: 0
-  });
-  const { cursorOffset, cursorWidth } = state;
-  (0, import_react34.useEffect)(() => {
-    setState((previousState) => {
-      if (!focus || !showCursor) {
-        return previousState;
-      }
-      const newValue = originalValue || "";
-      if (previousState.cursorOffset > newValue.length - 1) {
-        return {
-          cursorOffset: newValue.length,
-          cursorWidth: 0
-        };
-      }
-      return previousState;
-    });
-  }, [originalValue, focus, showCursor]);
-  const cursorActualWidth = highlightPastedText ? cursorWidth : 0;
-  const value = mask ? mask.repeat(originalValue.length) : originalValue;
-  let renderedValue = value;
-  let renderedPlaceholder = placeholder ? source_default.grey(placeholder) : void 0;
-  if (showCursor && focus) {
-    renderedPlaceholder = placeholder.length > 0 ? source_default.inverse(placeholder[0]) + source_default.grey(placeholder.slice(1)) : source_default.inverse(" ");
-    renderedValue = value.length > 0 ? "" : source_default.inverse(" ");
-    let i = 0;
-    for (const char of value) {
-      renderedValue += i >= cursorOffset - cursorActualWidth && i <= cursorOffset ? source_default.inverse(char) : char;
-      i++;
-    }
-    if (value.length > 0 && cursorOffset === value.length) {
-      renderedValue += source_default.inverse(" ");
-    }
-  }
-  use_input_default((input, key) => {
-    if (key.upArrow || key.downArrow || key.ctrl && input === "c" || key.tab || key.shift && key.tab) {
-      return;
-    }
-    if (key.return) {
-      if (onSubmit) {
-        onSubmit(originalValue);
-      }
-      return;
-    }
-    let nextCursorOffset = cursorOffset;
-    let nextValue = originalValue;
-    let nextCursorWidth = 0;
-    if (key.leftArrow) {
-      if (showCursor) {
-        nextCursorOffset--;
-      }
-    } else if (key.rightArrow) {
-      if (showCursor) {
-        nextCursorOffset++;
-      }
-    } else if (key.backspace || key.delete) {
-      if (cursorOffset > 0) {
-        nextValue = originalValue.slice(0, cursorOffset - 1) + originalValue.slice(cursorOffset, originalValue.length);
-        nextCursorOffset--;
-      }
-    } else {
-      nextValue = originalValue.slice(0, cursorOffset) + input + originalValue.slice(cursorOffset, originalValue.length);
-      nextCursorOffset += input.length;
-      if (input.length > 1) {
-        nextCursorWidth = input.length;
-      }
-    }
-    if (cursorOffset < 0) {
-      nextCursorOffset = 0;
-    }
-    if (cursorOffset > originalValue.length) {
-      nextCursorOffset = originalValue.length;
-    }
-    setState({
-      cursorOffset: nextCursorOffset,
-      cursorWidth: nextCursorWidth
-    });
-    if (nextValue !== originalValue) {
-      onChange(nextValue);
-    }
-  }, { isActive: focus });
-  return import_react34.default.createElement(Text, null, placeholder ? value.length > 0 ? renderedValue : renderedPlaceholder : renderedValue);
-}
-var import_react34, build_default;
-var init_build4 = __esm({
-  async "node_modules/.pnpm/ink-text-input@6.0.0_ink@6.8.0_@types+react@19.2.14_react-devtools-core@7.0.1_react@19.2.4__react@19.2.4/node_modules/ink-text-input/build/index.js"() {
-    "use strict";
-    import_react34 = __toESM(require_react(), 1);
-    await init_build2();
-    init_source2();
-    build_default = TextInput;
-  }
-});
-
 // apps/cli/src/ui/init-flow.tsx
 function validateName(name) {
   if (name.length === 0)
@@ -74012,8 +74590,8 @@ function InitFlow({
   initialFramework,
   onComplete
 }) {
-  const [name, setName] = (0, import_react35.useState)(initialName ?? "");
-  const [nameError, setNameError] = (0, import_react35.useState)(null);
+  const [name, setName] = (0, import_react36.useState)(initialName ?? "");
+  const [nameError, setNameError] = (0, import_react36.useState)(null);
   function firstStep() {
     if (initialName === null)
       return "name";
@@ -74025,8 +74603,8 @@ function InitFlow({
       return "framework";
     return "intelligence";
   }
-  const [step, setStep] = (0, import_react35.useState)(firstStep);
-  (0, import_react35.useEffect)(() => {
+  const [step, setStep] = (0, import_react36.useState)(firstStep);
+  (0, import_react36.useEffect)(() => {
     if (step === "done") {
       if (initialFramework !== null) {
         onComplete({
@@ -74101,16 +74679,16 @@ function InitFlow({
       framework: chosen
     });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Box_default, { flexDirection: "column", children: [
-    step === "name" && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Box_default, { flexDirection: "column", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text, { bold: true, children: "Project name" }),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text, { color: "gray", children: "Lowercase letters, numbers, hyphens \u2014 max 30 chars" }),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Box_default, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Text, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Box_default, { flexDirection: "column", children: [
+    step === "name" && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Box_default, { flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text, { bold: true, children: "Project name" }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text, { color: "gray", children: "Lowercase letters, numbers, hyphens \u2014 max 30 chars" }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Box_default, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Text, { children: [
           ">",
           " "
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
           build_default,
           {
             value: name,
@@ -74120,29 +74698,29 @@ function InitFlow({
           }
         )
       ] }),
-      nameError !== null && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text, { color: "red", children: nameError })
+      nameError !== null && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text, { color: "red", children: nameError })
     ] }),
-    step === "intelligence" && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Box_default, { flexDirection: "column", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text, { bold: true, children: "Do you want to use CopilotKit Intelligence?" }),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text, { color: "gray", children: "Intelligence adds durable threads, state persistence, and insights." }),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SelectInput_default, { items: INTELLIGENCE_CHOICES, onSelect: handleIntelligenceSelect })
+    step === "intelligence" && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Box_default, { flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text, { bold: true, children: "Do you want to use CopilotKit Intelligence?" }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text, { color: "gray", children: "Intelligence adds durable threads, state persistence, and insights." }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectInput_default, { items: INTELLIGENCE_CHOICES, onSelect: handleIntelligenceSelect })
     ] }),
-    step === "framework" && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Box_default, { flexDirection: "column", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text, { bold: true, children: "Select agent framework" }),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SelectInput_default, { items: FRAMEWORK_CHOICES, onSelect: handleFrameworkSelect })
+    step === "framework" && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Box_default, { flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text, { bold: true, children: "Select agent framework" }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectInput_default, { items: FRAMEWORK_CHOICES, onSelect: handleFrameworkSelect })
     ] })
   ] });
 }
-var import_react35, import_jsx_runtime5, PROJECT_NAME_RE, INTELLIGENCE_CHOICES;
+var import_react36, import_jsx_runtime6, PROJECT_NAME_RE, INTELLIGENCE_CHOICES;
 var init_init_flow = __esm({
   async "apps/cli/src/ui/init-flow.tsx"() {
     "use strict";
-    import_react35 = __toESM(require_react(), 1);
+    import_react36 = __toESM(require_react(), 1);
     await init_build2();
-    await init_build3();
     await init_build4();
+    await init_build3();
     init_types();
-    import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1);
+    import_jsx_runtime6 = __toESM(require_jsx_runtime(), 1);
     PROJECT_NAME_RE = /^[a-z0-9-]{1,30}$/;
     INTELLIGENCE_CHOICES = [
       { label: "Yes \u2014 enable Intelligence (threads, persistence, insights)", value: "yes" },
@@ -74154,14 +74732,20 @@ var init_init_flow = __esm({
 // apps/cli/src/commands/init.tsx
 var init_exports = {};
 __export(init_exports, {
+  InitApp: () => InitApp,
   buildInitNextSteps: () => buildInitNextSteps,
   commandExists: () => commandExists,
+  resolvePrefilledOptions: () => resolvePrefilledOptions,
   runInit: () => runInit,
-  scaffoldInitProject: () => scaffoldInitProject
+  scaffoldInitProject: () => scaffoldInitProject,
+  shouldRenderInitBrowserLoginConfirmation: () => shouldRenderInitBrowserLoginConfirmation
 });
 import { accessSync, constants as constants2 } from "node:fs";
 import * as path10 from "node:path";
 import { execSync as execSync2 } from "node:child_process";
+function shouldRenderInitBrowserLoginConfirmation(phase) {
+  return phase === "confirming" || phase === "waiting" || phase === "finalizing";
+}
 function writeLicenseKey(projectDir, licenseKey) {
   writeEnvLicenseKey(projectDir, licenseKey);
 }
@@ -74199,42 +74783,33 @@ function buildInitNextSteps(templateDefinition, projectName, result) {
     const envTarget = result.envCreatedFromExample || result.licenseWritten ? "the scaffolded .env file" : ".env";
     return `Set ${envKey.key} in ${envTarget}. ${envKey.note}`;
   });
-  const commandPrefix = `cd ${projectName}`;
-  const steps = [`Directory: ${result.projectDir}`];
   const setupMissing = missingPrerequisites.filter(
     (prerequisite) => prerequisite.phase === "setup"
   );
-  if (missingPrerequisites.length > 0) {
-    for (const prerequisite of missingPrerequisites) {
-      steps.push(`Missing ${prerequisite.label}: ${prerequisite.installHint}`);
-    }
-  }
-  if (setupMissing.length > 0) {
-    steps.push(
-      `After installing setup prerequisites, run: ${commandPrefix} && ${templateDefinition.installCommand}`
-    );
-  } else {
-    steps.push(
-      `Install: ${commandPrefix} && ${templateDefinition.installCommand}`
-    );
-  }
-  for (const postInstallCommand of templateDefinition.postInstallCommands ?? []) {
-    const label = setupMissing.length > 0 ? "Then run" : "Setup";
-    steps.push(`${label}: ${commandPrefix} && ${postInstallCommand}`);
+  const runtimeMissing = missingPrerequisites.filter(
+    (prerequisite) => prerequisite.phase === "runtime"
+  );
+  const steps = [`Directory: ${result.projectDir}`];
+  for (const prerequisite of missingPrerequisites) {
+    steps.push(`Missing ${prerequisite.label}: ${prerequisite.installHint}`);
   }
   for (const envNote of envNotes) {
     steps.push(envNote);
   }
-  const runtimeMissing = missingPrerequisites.filter(
-    (prerequisite) => prerequisite.phase === "runtime"
-  );
-  if (runtimeMissing.length === 0) {
-    steps.push(`Run: ${commandPrefix} && ${templateDefinition.runCommand}`);
-  } else {
-    steps.push(
-      `After runtime prerequisites are ready, run: ${commandPrefix} && ${templateDefinition.runCommand}`
-    );
+  let header = "Run these commands:";
+  if (setupMissing.length > 0) {
+    header = "After installing setup prerequisites, run:";
+  } else if (runtimeMissing.length > 0) {
+    header = "After runtime prerequisites are ready, run:";
+  }
+  steps.push(header);
+  steps.push(`  cd ${projectName}`);
+  steps.push(`  ${templateDefinition.installCommand}`);
+  for (const postInstallCommand of templateDefinition.postInstallCommands ?? []) {
+    const formatted = postInstallCommand.startsWith("cd ") ? `(${postInstallCommand})` : postInstallCommand;
+    steps.push(`  ${formatted}`);
   }
+  steps.push(`  ${templateDefinition.runCommand}`);
   return steps;
 }
 async function ensureCliToken2(dependencies, onTerminalSessionInvalidation) {
@@ -74343,25 +74918,25 @@ function ScaffoldProgress({ options }) {
   const { exit } = use_app_default();
   const browserLogin = useBrowserLogin();
   const templateDefinition = resolveInitTemplate(options);
-  const [phase, setPhase] = (0, import_react36.useState)(
+  const [phase, setPhase] = (0, import_react37.useState)(
     templateDefinition.requiresLicense ? "auth" : "scaffold"
   );
-  const [errorMessage, setErrorMessage] = (0, import_react36.useState)("");
-  const [authMessage, setAuthMessage] = (0, import_react36.useState)("");
-  const [nextSteps, setNextSteps] = (0, import_react36.useState)([]);
-  const scaffoldDependencies = (0, import_react36.useMemo)(
+  const [errorMessage, setErrorMessage] = (0, import_react37.useState)("");
+  const [authMessage, setAuthMessage] = (0, import_react37.useState)("");
+  const [nextSteps, setNextSteps] = (0, import_react37.useState)([]);
+  const scaffoldDependencies = (0, import_react37.useMemo)(
     () => ({
       ...defaultInitScaffoldDependencies,
       login: browserLogin.runLogin
     }),
     [browserLogin.runLogin]
   );
-  (0, import_react36.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
     if (phase === "success" || phase === "error") {
       exit();
     }
   }, [phase, exit]);
-  (0, import_react36.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
     let cancelled = false;
     async function run() {
       const result = await scaffoldInitProject(
@@ -74397,43 +74972,46 @@ function ScaffoldProgress({ options }) {
       cancelled = true;
     };
   }, [options, scaffoldDependencies]);
-  if (browserLogin.state.phase === "confirming" || browserLogin.state.phase === "waiting") {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(BrowserLoginConfirmation, {});
+  if (shouldRenderInitBrowserLoginConfirmation(browserLogin.state.phase)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BrowserLoginConfirmation, {});
   }
   if (phase === "auth") {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Box_default, { flexDirection: "column", children: [
-      authMessage ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text, { color: "yellow", children: authMessage }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Spinner, { label: "\u{1FA81} Verifying authentication\u2026" })
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(Box_default, { flexDirection: "column", children: [
+      authMessage ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Text, { color: "yellow", children: authMessage }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Spinner, { label: "\u{1FA81} Verifying authentication\u2026" })
     ] });
   }
   if (phase === "license") {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Box_default, { flexDirection: "column", children: [
-      authMessage ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text, { color: "yellow", children: authMessage }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Spinner, { label: "\u{1FA81} Issuing license key\u2026" })
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(Box_default, { flexDirection: "column", children: [
+      authMessage ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Text, { color: "yellow", children: authMessage }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Spinner, { label: "\u{1FA81} Issuing license key\u2026" })
     ] });
   }
   if (phase === "scaffold") {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Spinner, { label: "\u{1FA81} Downloading template\u2026" }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Spinner, { label: "\u{1FA81} Downloading template\u2026" }) });
   }
   if (phase === "git") {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Spinner, { label: "Initializing git repository\u2026" }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Spinner, { label: "Initializing git repository\u2026" }) });
   }
   if (phase === "success") {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Box_default, { flexDirection: "column", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Text, { color: "green", children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(Box_default, { flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(Text, { color: "green", children: [
         templateDefinition.successEmoji,
         ' Project "',
         options.name,
         '" created successfully!'
       ] }),
-      nextSteps.map((step) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text, { color: "gray", children: step }, step))
+      nextSteps.map((step, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Text, { color: "gray", children: step }, `step-${index}`))
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Text, { color: "red", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(Text, { color: "red", children: [
     "Init failed: ",
     errorMessage
   ] }) });
 }
+function renderDefaultScaffoldProgress(options) {
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ScaffoldProgress, { options });
+}
 function resolvePrefilledOptions(name, intelligence, framework) {
   if (name === null)
     return null;
@@ -74452,29 +75030,33 @@ function resolvePrefilledOptions(name, intelligence, framework) {
 function InitApp({
   initialName,
   initialIntelligence,
-  initialFramework
+  initialFramework,
+  renderScaffoldProgress = renderDefaultScaffoldProgress
 }) {
   const prefilled = resolvePrefilledOptions(
     initialName,
     initialIntelligence,
     initialFramework
   );
-  const [options, setOptions] = (0, import_react36.useState)(prefilled);
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Box_default, { flexDirection: "column", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Banner, {}),
-    options !== null ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ScaffoldProgress, { options }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      InitFlow,
-      {
-        initialName,
-        initialIntelligence,
-        initialFramework,
-        onComplete: (resolved) => {
-          if (resolved !== null) {
-            setOptions(resolved);
+  const [options, setOptions] = (0, import_react37.useState)(prefilled);
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(Box_default, { flexDirection: "column", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Banner, {}),
+    options !== null ? renderScaffoldProgress(options) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        InitFlow,
+        {
+          initialName,
+          initialIntelligence,
+          initialFramework,
+          onComplete: (resolved) => {
+            if (resolved !== null) {
+              setOptions(resolved);
+            }
           }
         }
-      }
-    )
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CliTip, {})
+    ] })
   ] });
 }
 async function runInit(flags) {
@@ -74487,7 +75069,7 @@ async function runInit(flags) {
   }
   const initialFramework = frameworkFlag;
   const { waitUntilExit } = render_default(
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(BrowserLoginProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BrowserLoginProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       InitApp,
       {
         initialName,
@@ -74498,11 +75080,11 @@ async function runInit(flags) {
   );
   await waitUntilExit();
 }
-var import_react36, import_jsx_runtime6, defaultInitScaffoldDependencies;
+var import_react37, import_jsx_runtime7, defaultInitScaffoldDependencies;
 var init_init = __esm({
   async "apps/cli/src/commands/init.tsx"() {
     "use strict";
-    import_react36 = __toESM(require_react(), 1);
+    import_react37 = __toESM(require_react(), 1);
     await init_build2();
     await init_build2();
     init_types();
@@ -74512,10 +75094,11 @@ var init_init = __esm({
     init_config_service();
     await init_banner();
     await init_browser_login();
+    await init_cli_tip();
     await init_init_flow();
     await init_spinner();
     init_config();
-    import_jsx_runtime6 = __toESM(require_jsx_runtime(), 1);
+    import_jsx_runtime7 = __toESM(require_jsx_runtime(), 1);
     defaultInitScaffoldDependencies = {
       verifyAndRefresh,
       login,
@@ -74556,7 +75139,7 @@ var init_version = __esm({
 // apps/cli/src/ui/login-flow.tsx
 function LoginFlow({ onComplete }) {
   const { runLogin: runLogin2 } = useBrowserLogin();
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     runLogin2().then(() => {
       onComplete({ success: true });
     }).catch((error48) => {
@@ -74568,15 +75151,15 @@ function LoginFlow({ onComplete }) {
       onComplete({ error: fallbackError, success: false });
     });
   }, [onComplete, runLogin2]);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BrowserLoginConfirmation, {});
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(BrowserLoginConfirmation, {});
 }
-var import_react37, import_jsx_runtime7;
+var import_react38, import_jsx_runtime8;
 var init_login_flow = __esm({
   async "apps/cli/src/ui/login-flow.tsx"() {
     "use strict";
-    import_react37 = __toESM(require_react(), 1);
+    import_react38 = __toESM(require_react(), 1);
     await init_browser_login();
-    import_jsx_runtime7 = __toESM(require_jsx_runtime(), 1);
+    import_jsx_runtime8 = __toESM(require_jsx_runtime(), 1);
   }
 });
 
@@ -74588,7 +75171,7 @@ __export(login_exports, {
 async function runLogin() {
   return await new Promise((resolve2, reject) => {
     const { unmount } = render_default(
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(BrowserLoginProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(BrowserLoginProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
         LoginFlow,
         {
           onComplete: (result) => {
@@ -74606,14 +75189,14 @@ async function runLogin() {
     );
   });
 }
-var import_jsx_runtime8;
+var import_jsx_runtime9;
 var init_login = __esm({
   async "apps/cli/src/commands/login.tsx"() {
     "use strict";
     await init_build2();
     await init_login_flow();
     await init_browser_login();
-    import_jsx_runtime8 = __toESM(require_jsx_runtime(), 1);
+    import_jsx_runtime9 = __toESM(require_jsx_runtime(), 1);
   }
 });
 
@@ -89184,16 +89767,16 @@ function KiteGame({
   const { stdout } = use_stdout_default();
   const terminalWidth = useTerminalWidth(stdout);
   const playableWidth = getPlayableWidth(terminalWidth);
-  const rngRef = (0, import_react38.useRef)(rng);
-  const [highScore, setHighScore] = (0, import_react38.useState)(() => readKiteGameHighScore());
-  const [state, setState] = (0, import_react38.useState)(
+  const rngRef = (0, import_react39.useRef)(rng);
+  const [highScore, setHighScore] = (0, import_react39.useState)(() => readKiteGameHighScore());
+  const [state, setState] = (0, import_react39.useState)(
     () => createKiteGame({ width: playableWidth, rng: rngRef.current })
   );
-  const rows = (0, import_react38.useMemo)(() => renderKiteGameRows(state), [state]);
-  (0, import_react38.useEffect)(() => {
+  const rows = (0, import_react39.useMemo)(() => renderKiteGameRows(state), [state]);
+  (0, import_react39.useEffect)(() => {
     rngRef.current = rng;
   }, [rng]);
-  (0, import_react38.useEffect)(() => {
+  (0, import_react39.useEffect)(() => {
     setState((currentState) => {
       if (currentState.width === playableWidth) {
         return currentState;
@@ -89205,13 +89788,13 @@ function KiteGame({
       });
     });
   }, [playableWidth]);
-  (0, import_react38.useEffect)(() => {
+  (0, import_react39.useEffect)(() => {
     if (!state.crashed) {
       return;
     }
     setHighScore(saveKiteGameHighScore(state.score));
   }, [state.crashed, state.score]);
-  (0, import_react38.useEffect)(() => {
+  (0, import_react39.useEffect)(() => {
     if (!state.started || state.crashed) {
       return void 0;
     }
@@ -89254,23 +89837,23 @@ function KiteGame({
       setState((currentState) => flapKite(currentState));
     }
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Box_default, { flexDirection: "column", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Text, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(Box_default, { flexDirection: "column", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(Text, { children: [
       "CopilotKit Kite Score ",
       state.score,
       " High",
       " ",
       Math.max(highScore, state.score)
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Box_default, { flexDirection: "column", borderStyle: "single", children: rows.map((row, index) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Text, { children: row }, `${index}-${row}`)) }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Text, { children: state.crashed ? "Crashed. Enter/r to reset. Space to restart. q/Esc to quit." : state.started ? "Space/up to send wind. q/Esc to quit." : "Ready. Space/up to start. q/Esc to quit." })
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Box_default, { flexDirection: "column", borderStyle: "single", children: rows.map((row, index) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Text, { children: row }, `${index}-${row}`)) }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Text, { children: state.crashed ? "Crashed. Enter/r to reset. Space to restart. q/Esc to quit." : state.started ? "Space/up to send wind. q/Esc to quit." : "Ready. Space/up to start. q/Esc to quit." })
   ] });
 }
 function useTerminalWidth(stdout) {
-  const [terminalWidth, setTerminalWidth] = (0, import_react38.useState)(
+  const [terminalWidth, setTerminalWidth] = (0, import_react39.useState)(
     () => getStdoutColumns(stdout)
   );
-  (0, import_react38.useEffect)(() => {
+  (0, import_react39.useEffect)(() => {
     const updateTerminalWidth = () => {
       setTerminalWidth(getStdoutColumns(stdout));
     };
@@ -89287,15 +89870,15 @@ function getStdoutColumns(stdout) {
 function getPlayableWidth(terminalWidth) {
   return Math.max(MIN_PLAYABLE_WIDTH, terminalWidth - BORDER_COLUMNS);
 }
-var import_react38, import_jsx_runtime9, DEFAULT_TICK_MS, MIN_PLAYABLE_WIDTH, BORDER_COLUMNS;
+var import_react39, import_jsx_runtime10, DEFAULT_TICK_MS, MIN_PLAYABLE_WIDTH, BORDER_COLUMNS;
 var init_kite_game = __esm({
   async "apps/cli/src/ui/kite-game.tsx"() {
     "use strict";
     await init_build2();
-    import_react38 = __toESM(require_react(), 1);
+    import_react39 = __toESM(require_react(), 1);
     init_kite_game_engine();
     init_kite_game_score();
-    import_jsx_runtime9 = __toESM(require_jsx_runtime(), 1);
+    import_jsx_runtime10 = __toESM(require_jsx_runtime(), 1);
     DEFAULT_TICK_MS = 75;
     MIN_PLAYABLE_WIDTH = 32;
     BORDER_COLUMNS = 2;
@@ -89309,19 +89892,19 @@ __export(kite_exports, {
 });
 async function runKite() {
   return await new Promise((resolve2, reject) => {
-    const { waitUntilExit } = render_default(/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(KiteGame, { onExit: resolve2 }));
+    const { waitUntilExit } = render_default(/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(KiteGame, { onExit: resolve2 }));
     waitUntilExit().then(() => {
       resolve2();
     }).catch(reject);
   });
 }
-var import_jsx_runtime10;
+var import_jsx_runtime11;
 var init_kite = __esm({
   async "apps/cli/src/commands/kite.tsx"() {
     "use strict";
     await init_build2();
     await init_kite_game();
-    import_jsx_runtime10 = __toESM(require_jsx_runtime(), 1);
+    import_jsx_runtime11 = __toESM(require_jsx_runtime(), 1);
   }
 });