Merge pull request modelcontextprotocol#55 from modelcontextprotocol/justin/multiline-tool-inputs

Support multiline tool inputs

Author: jspahrsummers

client/src/components/ToolsTab.tsx

@@ -3,7 +3,12 @@ import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { TabsContent } from "@/components/ui/tabs";
-import { CallToolResult, ListToolsResult, Tool } from "@modelcontextprotocol/sdk/types.js";
+import { Textarea } from "@/components/ui/textarea";
+import {
+  CallToolResult,
+  ListToolsResult,
+  Tool,
+} from "@modelcontextprotocol/sdk/types.js";
 import { AlertCircle, Send } from "lucide-react";
 import { useState } from "react";
 import ListPane from "./ListPane";
@@ -123,24 +128,44 @@ const ToolsTab = ({
                     >
                       {key}
                     </Label>
-                    <Input
-                      // @ts-expect-error value type is currently unknown
-                      type={value.type === "number" ? "number" : "text"}
-                      id={key}
-                      name={key}
-                      // @ts-expect-error value type is currently unknown
-                      placeholder={value.description}
-                      onChange={(e) =>
-                        setParams({
-                          ...params,
-                          [key]:
-                            // @ts-expect-error value type is currently unknown
-                            value.type === "number"
-                              ? Number(e.target.value)
-                              : e.target.value,
-                        })
-                      }
-                    />
+                    {
+                      /* @ts-expect-error value type is currently unknown */
+                      value.type === "string" ? (
+                        <Textarea
+                          id={key}
+                          name={key}
+                          // @ts-expect-error value type is currently unknown
+                          placeholder={value.description}
+                          onChange={(e) =>
+                            setParams({
+                              ...params,
+                              [key]: e.target.value,
+                            })
+                          }
+                          className="mt-1"
+                        />
+                      ) : (
+                        <Input
+                          // @ts-expect-error value type is currently unknown
+                          type={value.type === "number" ? "number" : "text"}
+                          id={key}
+                          name={key}
+                          // @ts-expect-error value type is currently unknown
+                          placeholder={value.description}
+                          onChange={(e) =>
+                            setParams({
+                              ...params,
+                              [key]:
+                                // @ts-expect-error value type is currently unknown
+                                value.type === "number"
+                                  ? Number(e.target.value)
+                                  : e.target.value,
+                            })
+                          }
+                          className="mt-1"
+                        />
+                      )
+                    }
                   </div>
                 ),
               )}