copilotkit 2.0.3 → 2.0.4

package/index.js

@@ -63,9 +63,9 @@ function setOpsFrontendUrl(url2) {
 }
 function getBuildInfo() {
   return {
-    version: "2.0.3",
-    buildNumber: "25387853955",
-    commitSha: "6a568f521454b79698cc96223bf7bc7a6bb0c819"
+    version: "2.0.4",
+    buildNumber: "25565986307",
+    commitSha: "b30c431cac977de7dc0637d19bbe914b6bb1248d"
   };
 }
 var opsApiUrlOverride, opsFrontendUrlOverride;
@@ -50395,7 +50395,7 @@ var require_backend = __commonJS({
                     });
                     return value;
                   },
-                  useEffect: function useEffect13(create3) {
+                  useEffect: function useEffect14(create3) {
                     nextHook();
                     hookLog.push({
                       displayName: null,
@@ -50441,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({
@@ -50483,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({
@@ -60118,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) {
@@ -60174,7 +60174,7 @@ var require_backend = __commonJS({
                   case HostPortal:
                   case HostText:
                     return null;
-                  case Fragment:
+                  case Fragment2:
                     return "Fragment";
                   case LazyComponent:
                     return "Lazy";
@@ -60329,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";
@@ -60690,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);
@@ -60764,7 +60764,7 @@ var require_backend = __commonJS({
                     return ElementTypeHostComponent;
                   case HostPortal:
                   case HostText:
-                  case Fragment:
+                  case Fragment2:
                     return ElementTypeOtherOrUnknown;
                   case MemoComponent:
                   case SimpleMemoComponent:
@@ -72062,6 +72062,285 @@ var init_build3 = __esm({
   }
 });
 
+// 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) {
@@ -72368,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_react30.useState)(0);
-  (0, import_react30.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_react30, 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_react30 = __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}     ",
@@ -72412,11 +72854,11 @@ function BrowserLoginProvider({
   loginRunner = login,
   isInteractive
 }) {
-  const [state, setState] = (0, import_react31.useState)(idleState);
-  const pendingConfirmationRef = (0, import_react31.useRef)(null);
-  const pendingManualTokenRef = (0, import_react31.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_react31.useCallback)(() => {
+  const confirmBrowserLoginStart = (0, import_react32.useCallback)(() => {
     const pendingConfirmation = pendingConfirmationRef.current;
     if (pendingConfirmation === null) {
       return void 0;
@@ -72425,7 +72867,7 @@ function BrowserLoginProvider({
     pendingConfirmation.resolve(void 0);
     return void 0;
   }, []);
-  const submitManualClerkToken = (0, import_react31.useCallback)((clerkToken) => {
+  const submitManualClerkToken = (0, import_react32.useCallback)((clerkToken) => {
     const pendingManualToken = pendingManualTokenRef.current;
     if (pendingManualToken === null) {
       return void 0;
@@ -72438,7 +72880,7 @@ function BrowserLoginProvider({
     pendingManualToken.resolve(trimmed);
     return void 0;
   }, []);
-  const runLogin2 = (0, import_react31.useCallback)(async (passthroughOptions) => {
+  const runLogin2 = (0, import_react32.useCallback)(async (passthroughOptions) => {
     if (pendingConfirmationRef.current !== null) {
       throw new Error("Browser login is already waiting for confirmation.");
     }
@@ -72508,7 +72950,7 @@ function BrowserLoginProvider({
       throw concreteError;
     }
   }, [loginRunner, shouldConfirm]);
-  (0, import_react31.useEffect)(() => {
+  (0, import_react32.useEffect)(() => {
     return () => {
       const pendingConfirmation = pendingConfirmationRef.current;
       if (pendingConfirmation !== null) {
@@ -72526,7 +72968,7 @@ function BrowserLoginProvider({
       }
     };
   }, []);
-  const value = (0, import_react31.useMemo)(
+  const value = (0, import_react32.useMemo)(
     () => ({
       runLogin: runLogin2,
       state,
@@ -72535,10 +72977,10 @@ function BrowserLoginProvider({
     }),
     [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_react31.useContext)(BrowserLoginContext);
+  const context = (0, import_react32.useContext)(BrowserLoginContext);
   if (context === null) {
     throw new Error("useBrowserLogin must be used inside BrowserLoginProvider.");
   }
@@ -72546,7 +72988,7 @@ function useBrowserLogin() {
 }
 function BrowserLoginConfirmation() {
   const { state, confirmBrowserLoginStart, submitManualClerkToken } = useBrowserLogin();
-  const [manualTokenInput, setManualTokenInput] = (0, import_react31.useState)("");
+  const [manualTokenInput, setManualTokenInput] = (0, import_react32.useState)("");
   use_input_default((_input, key) => {
     if (state.phase === "confirming" && key.return) {
       confirmBrowserLoginStart();
@@ -72556,22 +72998,22 @@ 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.jsxs)(Box_default, { flexDirection: "column", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Spinner, { label: "\u{1FA81} Waiting for browser sign-in\u2026" }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Box_default, { marginTop: 1, flexDirection: "column", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text, { color: "gray", children: BROWSER_LOGIN_MANUAL_PASTE_LABEL }),
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Box_default, { children: [
-          /* @__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)(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_runtime2.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
             build_default,
             {
               value: manualTokenInput,
@@ -72584,52 +73026,55 @@ function BrowserLoginConfirmation() {
             }
           )
         ] })
-      ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CliTip, {})
     ] });
   }
   if (state.phase === "finalizing" && 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 })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Spinner, { label: "Wrapping up..." }) })
+      /* @__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_react31, import_jsx_runtime2, BROWSER_LOGIN_CONFIRMATION_MESSAGE, BROWSER_LOGIN_CONFIRMATION_PROMPT, MANUAL_PASTE_FINALIZING_MS, idleState, BrowserLoginContext, BROWSER_LOGIN_MANUAL_PASTE_LABEL;
+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_react31 = __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;
@@ -72638,7 +73083,7 @@ var init_browser_login = __esm({
       identity: null,
       errorMessage: ""
     };
-    BrowserLoginContext = (0, import_react31.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:";
   }
 });
@@ -72646,8 +73091,12 @@ var init_browser_login = __esm({
 // 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;
@@ -72745,10 +73194,10 @@ function formatLicenseList(scope, licenses) {
 function LicenseCreateApp({ onIssued }) {
   const { exit } = use_app_default();
   const browserLogin = useBrowserLogin();
-  const [phase, setPhase] = (0, import_react32.useState)("auth");
-  const [errorMessage, setErrorMessage] = (0, import_react32.useState)("");
-  const [authMessage, setAuthMessage] = (0, import_react32.useState)("");
-  (0, import_react32.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");
@@ -72796,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
   ] }) });
@@ -72851,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;
     } }) })
   );
@@ -72861,11 +73310,11 @@ async function runLicense(command) {
 `);
   }
 }
-var import_react32, import_jsx_runtime3;
+var import_react33, import_jsx_runtime4;
 var init_license = __esm({
   async "apps/cli/src/commands/license.tsx"() {
     "use strict";
-    import_react32 = __toESM(require_react(), 1);
+    import_react33 = __toESM(require_react(), 1);
     await init_build2();
     await init_build2();
     init_auth_service();
@@ -72874,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);
   }
 });
 
@@ -73637,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
@@ -73967,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_react33.default.createElement(Box_default, { marginRight: 1 }, isSelected ? import_react33.default.createElement(Text, { color: "blue" }, figures_default.pointer) : import_react33.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_react33, 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_react33 = __toESM(require_react(), 1);
+    import_react34 = __toESM(require_react(), 1);
     await init_build2();
     init_figures();
     Indicator_default = Indicator;
@@ -74027,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_react34.useState)(initialIndex > lastIndex ? lastIndex - initialIndex : 0);
-  const [selectedIndex, setSelectedIndex] = (0, import_react34.useState)(initialIndex ? initialIndex > lastIndex ? lastIndex : initialIndex : 0);
-  const previousItems = (0, import_react34.useRef)(items);
-  (0, import_react34.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_react34.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;
@@ -74089,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_react34.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_react34.default.createElement(
+      import_react35.default.createElement(
         Box_default,
         { key: item.key ?? item.value },
-        import_react34.default.createElement(indicatorComponent, { isSelected }),
-        import_react34.default.createElement(itemComponent, { ...item, isSelected })
+        import_react35.default.createElement(indicatorComponent, { isSelected }),
+        import_react35.default.createElement(itemComponent, { ...item, isSelected })
       )
     );
   }));
 }
-var import_react34, 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_react34 = __toESM(require_react(), 1);
+    import_react35 = __toESM(require_react(), 1);
     init_to_rotated();
     await init_build2();
     await init_Indicator();
@@ -74141,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";
@@ -74154,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({
@@ -74230,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,
@@ -74249,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_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" },
@@ -74283,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);
 }
@@ -74463,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(
@@ -74517,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, index) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text, { color: "gray", children: step }, `step-${index}`))
+      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;
@@ -74572,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) {
@@ -74607,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,
@@ -74618,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();
@@ -74632,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,
@@ -74676,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) => {
@@ -74688,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);
   }
 });
 
@@ -74708,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) => {
@@ -74726,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);
   }
 });
 
@@ -89304,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;
@@ -89325,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;
     }
@@ -89374,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));
     };
@@ -89407,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;
@@ -89429,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);
   }
 });