docs(showcase/shell-docs): HITL as proper sub-section + better titles + gate residual LangGraph code

Three follow-ups to the previous HITL nav restoration after visual review:

1. Make Human-in-the-Loop a proper collapsible subsection (matches the
   prebuilt-components / custom-look-and-feel pattern):
   - Move human-in-the-loop.mdx -> human-in-the-loop/index.mdx
   - Add human-in-the-loop/meta.json with title + page order
   - Root meta.json: collapse the three flat entries to a single
     'human-in-the-loop' line (the section's own meta.json drives
     children)

2. Rename useInterrupt page title from 'useInterrupt' (a React hook
   name, framework-implementation-leaky) to 'Pausing the agent for
   input' — describes the action, neutral across native and
   promise-based patterns. Description tightened to match.

3. Gate the residual 'Key props', 'Multiple interrupts', and 'Preprocess
   with handler' sections in useInterrupt.mdx behind <WhenFrameworkHas
   equals="native">. Those code blocks reference useInterrupt({...})
   directly — they only make sense on LangGraph. On promise-based
   frameworks they would have rendered alongside the gated promise
   intro, leaving readers with mixed-framework code on the same page.

Note: 'Missing snippet' yellow boxes still render on the hub page for
12 frameworks where hitl-in-chat cell is unshipped (ms-agent-{python,
dotnet}, agno, google-adk, pydantic-ai, llamaindex, claude-sdk-{python,
typescript}, langgraph-{typescript,fastapi}, langroid, spring-ai). That's
the dashboard's D-unshipped class — engineering work tracked in the
post-PR snippet-coverage audit Notion doc, not a docs-side gap.

Author: samjulien

showcase/shell-docs/src/content/docs/human-in-the-loop/headless.mdx

@@ -1,5 +1,5 @@
 ---
-title: Headless interrupts
+title: Headless Interrupts
 icon: "lucide/SquareDashedBottomCode"
 description: Resolve agent interrupts from any UI, without a useInterrupt render slot.
 hideTOC: true

…s/src/content/docs/human-in-the-loop.mdx …content/docs/human-in-the-loop/index.mdxshowcase/shell-docs/src/content/docs/human-in-the-loop.mdx renamed to showcase/shell-docs/src/content/docs/human-in-the-loop/index.mdx showcase/shell-docs/src/content/docs/human-in-the-loop.mdx renamed to showcase/shell-docs/src/content/docs/human-in-the-loop/index.mdx

@@ -1,5 +1,5 @@
 ---
-title: Human-in-the-Loop
+title: HITL Overview
 icon: "lucide/User"
 description: Allow your agent and users to collaborate on complex tasks.
 hideTOC: true
@@ -15,7 +15,7 @@ into a collaborative one: the agent keeps its context, the user keeps
 the steering wheel.
 
 <video
-  src="https://cdn.copilotkit.ai/docs/copilotkit/images/langgraph/human-in-the-loop-example.mp4"
+  src="https://cdn.copilotkit.ai/docs/copilotkit/images/coagents/human-in-the-loop-example.mp4"
   className="rounded-lg shadow-xl"
   loop
   playsInline

showcase/shell-docs/src/content/docs/human-in-the-loop/meta.json

@@ -0,0 +1,5 @@
+{
+  "title": "Human-in-the-Loop",
+  "icon": "lucide/User",
+  "pages": ["index", "useInterrupt", "headless"]
+}

showcase/shell-docs/src/content/docs/human-in-the-loop/useInterrupt.mdx

@@ -1,7 +1,7 @@
 ---
-title: useInterrupt
+title: Pausing the Agent for Input
 icon: "lucide/CirclePause"
-description: Pause an agent run for user input, then resume with their answer.
+description: Pause an agent run mid-tool, hand control to a custom React component, and resume with the user's answer.
 hideTOC: true
 snippet_cell: gen-ui-interrupt
 ---
@@ -113,6 +113,8 @@ the Promise-returning handler takes over:
 
 </WhenFrameworkHas>
 
+<WhenFrameworkHas flag="interrupt_pattern" equals="native">
+
 ### Key props
 
 - **`agentId`** — must match a runtime-registered agent. If omitted, the
@@ -176,6 +178,8 @@ useInterrupt({
 });
 ```
 
+</WhenFrameworkHas>
+
 ## Going further
 
 - [Tool-based HITL with `useHumanInTheLoop`](../human-in-the-loop) — for

showcase/shell-docs/src/content/docs/meta.json

@@ -16,8 +16,6 @@
     "frontend-tools",
     "shared-state",
     "human-in-the-loop",
-    "human-in-the-loop/useInterrupt",
-    "human-in-the-loop/headless",
     "multi-agent/subagents",
     "programmatic-control",
     "---Agents & Backends---",