@alexleekt/pi-ask-user-glimpse 0.3.0 → 0.3.2

package/index.ts

@@ -284,6 +284,45 @@ function buildDebugParams(mode: string): AskUserParams | null {
                 ],
                 allowComment: true,
             };
+        case "long-question":
+            return {
+                question: "This is a very long question that exceeds one hundred and twenty characters so it should trigger the auto-split behavior. The first sentence becomes the dialog title, and the rest flows to the context panel.",
+                options: [
+                    { title: "Split worked", description: "Title is short, context has the rest" },
+                    { title: "Not split", description: "Everything is still in the title" },
+                ],
+                allowComment: true,
+            };
+        case "mermaid":
+            return {
+                question: "Test: Mermaid Diagrams",
+                context: `This prompt includes Mermaid diagrams to test rendering in the left context panel.
+
+\`\`\`mermaid
+graph TD
+    A[User asks question] --> B{Has context?}
+    B -->|Yes| C[Show left panel]
+    B -->|No| D[Single panel]
+    C --> E[Render markdown + diagrams]
+    D --> E
+\`\`\`
+
+The diagram above should render as an SVG. Below is a sequence diagram:
+
+\`\`\`mermaid
+sequenceDiagram
+    participant Agent
+    participant User
+    Agent->>User: Ask question
+    User->>Agent: Submit answer
+\`\`\`
+`,
+                options: [
+                    { title: "Looks good", description: "Diagrams render correctly" },
+                    { title: "Broken", description: "Something is wrong" },
+                ],
+                allowComment: true,
+            };
         default:
             return null;
     }
@@ -293,21 +332,23 @@ const askUserTool = defineTool({
     name: "ask_user",
     label: "Ask User",
     description:
-        "Ask the user a question with optional multiple-choice answers. Use this to gather information interactively. Ask exactly one focused question per call. Before calling, gather context with tools (read/web/ref) and pass a short summary via the context field.",
+        "Ask the user a question with optional multiple-choice answers. Use this to gather information interactively. Ask exactly one focused question per call. Before calling, gather context with tools (read/web/ref) and pass a short summary via the context field. The context panel supports Mermaid diagrams (flowcharts, sequence diagrams, etc.) — include them when visualizing architecture, flows, or relationships would aid understanding.",
     promptSnippet:
         "Ask the user one focused question with optional multiple-choice answers to gather information interactively",
     promptGuidelines: [
         "Always use ask_user instead of guessing when user input would improve the answer.",
+        "Keep the question field short and focused (ideally one sentence). Put background, examples, or elaboration in the context field.",
+        "Include Mermaid diagrams in the context field when visualizing architecture, data flows, or decision trees would help the user understand the question.",
         "Pass a concise question and, when applicable, a list of options with short titles and optional longer descriptions.",
         "Set allowMultiple: true when more than one choice is valid.",
         "Set allowFreeform: true (default) when the user might want to answer in their own words.",
     ],
     parameters: Type.Object({
-        question: Type.String({ description: "The question to ask the user" }),
+        question: Type.String({ description: "A short, focused question (ideally one sentence). Put background detail in context." }),
         context: Type.Optional(
             Type.String({
                 description:
-                    "Additional context to help the user understand the question",
+                    "Background, examples, or elaboration that helps the user understand the question. Shown in a side panel, so keep the question itself concise. Supports Mermaid diagrams (flowcharts, sequence diagrams, etc.) — wrap them in ```mermaid code blocks.",
             }),
         ),
         options: Type.Optional(
@@ -542,6 +583,8 @@ export default function (pi: ExtensionAPI) {
                 "multi-select",
                 "freeform",
                 "questionnaire",
+                "long-question",
+                "mermaid",
             ]);
             if (!mode) return;
 

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alexleekt/pi-ask-user-glimpse",
-    "version": "0.3.0",
+    "version": "0.3.2",
     "description": "Pi extension that replaces ask_user with rich native WebView dialogs via glimpseui and shadcn/ui",
     "type": "module",
     "keywords": [
@@ -61,6 +61,7 @@
         "@vitejs/plugin-react": "^4.3.0",
         "autoprefixer": "^10.4.20",
         "marked": "^15.0.12",
+        "mermaid": "^11.15.0",
         "playwright": "^1.60.0",
         "postcss": "^8.4.47",
         "react": "^18.3.1",
@@ -71,8 +72,8 @@
         "vite-plugin-singlefile": "^2.0.0"
     },
     "peerDependencies": {
-        "@earendil-works/pi-coding-agent": "*",
-        "@earendil-works/pi-ai": "*"
+        "@earendil-works/pi-ai": "*",
+        "@earendil-works/pi-coding-agent": "*"
     },
     "engines": {
         "node": ">=18.0.0"

package/tool/ask-user.ts

@@ -397,10 +397,22 @@ export async function askUserHandler(
         payloadType = "single-select";
     }
 
+    // If the question is long and no separate context was provided, auto-split
+    // the first sentence into the question and the rest into context.
+    let question = params.question;
+    let context = params.context;
+    if (!context && params.question.length > 120) {
+        const match = params.question.match(/^(.+?[.?!])(\s+|$)/);
+        if (match && match[0].length < params.question.length) {
+            question = match[1].trim();
+            context = params.question.slice(match[0].length).trim();
+        }
+    }
+
     const payload: AskUserPayload = {
         type: payloadType,
-        question: params.question,
-        context: params.context,
+        question,
+        context,
         options: normalizedOptions,
         questions: params.questions,
         allowMultiple,

package/tool/response-formatter.ts

@@ -11,6 +11,7 @@ export interface AskResponse {
         kind: "selection" | "freeform";
         comment?: string;
     }[];
+    additionalComments?: string;
 }
 
 export interface AskToolDetails {
@@ -22,6 +23,10 @@ export interface AskToolDetails {
     error?: string;
 }
 
+function pickString(raw: unknown): string | undefined {
+    return raw ? String(raw) : undefined;
+}
+
 function normalizeKind(raw: unknown): AskResponse["kind"] {
     if (raw === "freeform" || raw === "questionnaire") return raw;
     return "selection";
@@ -51,9 +56,7 @@ function buildResponse(
                               entry.kind === "freeform"
                                   ? "freeform"
                                   : "selection",
-                          comment: entry.comment
-                              ? String(entry.comment)
-                              : undefined,
+                          comment: pickString(entry.comment),
                       };
                   })
                 : [],
@@ -69,7 +72,8 @@ function buildResponse(
     return {
         kind,
         selections,
-        comment: result.comment ? String(result.comment) : undefined,
+        comment: pickString(result.comment),
+        additionalComments: pickString(result.additionalComments),
     };
 }
 
@@ -77,12 +81,12 @@ function responseToText(response: AskResponse): string {
     if (response.kind === "freeform") {
         return response.text ?? "";
     }
+    const lines: string[] = [];
     const selections = response.selections ?? [];
-    let text = selections.join(", ");
-    if (response.comment) {
-        text += `\n\nComment: ${response.comment}`;
-    }
-    return text;
+    if (selections.length > 0) lines.push(selections.join(", "));
+    if (response.comment) lines.push(`Comment: ${response.comment}`);
+    if (response.additionalComments) lines.push(`Additional Comments: ${response.additionalComments}`);
+    return lines.join("\n\n");
 }
 
 export function formatResponse(