Add mcp, gradio, and functions

project/app.py

@@ -2,6 +2,7 @@ from fastapi import FastAPI, Request
 from fastapi.middleware.cors import CORSMiddleware
 import gradio as gr
 import uvicorn
+import re
 from dotenv import load_dotenv
 
 app = FastAPI()
@@ -34,22 +35,78 @@ def execute_blockly_logic(user_inputs):
         return "No Blockly code available"
 
     result = ""
-    
+
+    code_lines = latest_blockly_code.splitlines()
+
+    cleaned_lines = []
+    skip = False
+    for line in code_lines:
+        stripped = line.strip()
+
+        # When we reach the Interface block, start skipping until after demo.launch()
+        if stripped.startswith("demo = gr.Interface("):
+            skip = True
+            continue
+        if skip:
+            # Stop skipping after demo.launch(...) line
+            if stripped.startswith("demo.launch("):
+                skip = False
+            continue
+
+        # Keep everything else
+        cleaned_lines.append(line)
+
+    # Remove trailing blank lines
+    while cleaned_lines and not cleaned_lines[-1].strip():
+        cleaned_lines.pop()
+
+    code_to_run = "\n".join(cleaned_lines)
+
+    if len(code_lines) > 7:
+        code_to_run = "\n".join(code_lines[:-7])
+    else:
+        code_to_run = "\n".join(code_lines)
+
     def capture_result(msg):
         nonlocal result
         result = msg
 
-    env = {
-        "reply": capture_result,
-    }
+    env = {"reply": capture_result}
 
     try:
-        exec(latest_blockly_code, env)
+        exec(code_to_run, env)
         if "create_mcp" in env:
-            # If create_mcp function exists, call it with the input arguments
-            # Filter out None values and convert to list for unpacking
-            args = [arg for arg in user_inputs if arg is not None]
-            result = env["create_mcp"](*args)
+            import inspect
+            sig = inspect.signature(env["create_mcp"])
+            params = list(sig.parameters.values())
+
+            typed_args = []
+            for i, arg in enumerate(user_inputs):
+                if i >= len(params):
+                    break
+                if arg is None or arg == "":
+                    typed_args.append(None)
+                    continue
+
+                anno = params[i].annotation
+                try:
+                    # Convert using the declared type hint
+                    if anno == int:
+                        typed_args.append(int(arg))
+                    elif anno == float:
+                        typed_args.append(float(arg))
+                    elif anno == bool:
+                        typed_args.append(str(arg).lower() in ("true", "1"))
+                    elif anno == str or anno == inspect._empty:
+                        typed_args.append(str(arg))
+                    else:
+                        # Unknown or complex type — leave as-is
+                        typed_args.append(arg)
+                except Exception:
+                    # If conversion fails, pass the raw input
+                    typed_args.append(arg)
+
+            result = env["create_mcp"](*typed_args)
         elif "process_input" in env:
             env["process_input"](user_inputs)
     except Exception as e:
@@ -74,8 +131,13 @@ def build_interface():
                 txt = gr.Textbox(label=f"Input {i+1}", visible=False)
                 input_fields.append(txt)
                 input_group_items.append(txt)
+
+        output_fields = []
         
-        output_text = gr.Textbox(label="Output", interactive=False)
+        with gr.Accordion("MCP Outputs", open=True):
+            for i in range(10):
+                out = gr.Textbox(label=f"Output {i+1}", visible=False, interactive=False)
+                output_fields.append(out)
         
         with gr.Row():
             submit_btn = gr.Button("Submit")
@@ -83,14 +145,12 @@ def build_interface():
 
         def refresh_inputs():
             global latest_blockly_code
-            
-            # Parse the Python code to extract function parameters
             import re
-            
+
             # Look for the create_mcp function definition
             pattern = r'def create_mcp\((.*?)\):'
             match = re.search(pattern, latest_blockly_code)
-            
+
             params = []
             if match:
                 params_str = match.group(1)
@@ -109,38 +169,54 @@ def build_interface():
                                 'name': param,
                                 'type': 'str'
                             })
-            
-            # Generate visibility and label updates for each input field
+
+            # Detect output count (out_amt = N)
+            out_amt_match = re.search(r'out_amt\s*=\s*(\d+)', latest_blockly_code)
+            out_amt = int(out_amt_match.group(1)) if out_amt_match else 0
+
+            # Update visibility + clear output fields
+            output_updates = []
+            for i, field in enumerate(output_fields):
+                if i < out_amt:
+                    output_updates.append(gr.update(visible=True, label=f"Output {i+1}", value=""))
+                else:
+                    output_updates.append(gr.update(visible=False, value=""))
+
+            # Update visibility + clear input fields
             updates = []
             for i, field in enumerate(input_fields):
                 if i < len(params):
-                    # Show this field and update its label
                     param = params[i]
                     updates.append(gr.update(
                         visible=True,
-                        label=f"{param['name']} ({param['type']})"
+                        label=f"{param['name']} ({param['type']})",
+                        value=""
                     ))
                 else:
-                    # Hide this field
-                    updates.append(gr.update(visible=False))
-            
-            return updates
+                    updates.append(gr.update(visible=False, value=""))
+
+            return updates + output_updates
 
         def process_input(*args):
-            # Get the input values from Gradio fields
-            return execute_blockly_logic(args)
+            result = execute_blockly_logic(args)
+
+            # If the result is a tuple or list, pad it to length 10
+            if isinstance(result, (tuple, list)):
+                return list(result) + [""] * (10 - len(result))
+            # If it's a single value, repeat it in the first slot and pad the rest
+            return [result] + [""] * 9
 
         # When refresh is clicked, update input field visibility and labels
         refresh_btn.click(
             refresh_inputs,
-            outputs=input_fields,
+            outputs=input_fields + output_fields,
             queue=False
         )
         
         submit_btn.click(
             process_input,
             inputs=input_fields,
-            outputs=[output_text]
+            outputs=output_fields
         )
 
     return demo

project/src/blocks/text.js

@@ -43,6 +43,9 @@ Blockly.Extensions.registerMutator(
         this.inputNames_ = [];
         this.inputTypes_ = [];
         this.inputRefBlocks_ = new Map();
+        this.outputCount_ = 0;
+        this.outputNames_ = [];
+        this.outputTypes_ = [];
         this.initialized_ = true;
         // Mark all reference blocks with their owner for later identification
         this._ownerBlockId = this.id;
@@ -57,6 +60,9 @@ Blockly.Extensions.registerMutator(
       this.inputCount_ = this.inputCount_ || 0;
       this.inputNames_ = this.inputNames_ || [];
       this.inputTypes_ = this.inputTypes_ || [];
+      this.outputCount_ = this.outputCount_ || 0;
+      this.outputNames_ = this.outputNames_ || [];
+      this.outputTypes_ = this.outputTypes_ || [];
 
       // Restore dynamically added input items
       for (let i = 0; i < this.inputCount_; i++) {
@@ -76,6 +82,20 @@ Blockly.Extensions.registerMutator(
         connection = itemBlock.nextConnection;
       }
 
+      // Restore dynamically added output items
+      let connection2 = containerBlock.getInput('STACK2').connection;
+      for (let i = 0; i < this.outputCount_; i++) {
+        const itemBlock = workspace.newBlock('container_output');
+        itemBlock.initSvg();
+        const typeVal = this.outputTypes_[i] || 'string';
+        const nameVal = this.outputNames_[i] || typeVal;
+        itemBlock.setFieldValue(typeVal, 'TYPE');
+        itemBlock.setFieldValue(nameVal, 'NAME');
+
+        connection2.connect(itemBlock.previousConnection);
+        connection2 = itemBlock.nextConnection;
+      }
+
       return containerBlock;
     },
 
@@ -85,7 +105,9 @@ Blockly.Extensions.registerMutator(
         if (!this.initialized_) this.initialize();
 
         const oldNames = [...(this.inputNames_ || [])];
+        const oldOutputNames = [...(this.outputNames_ || [])];
         const connections = [];
+        const returnConnections = [];
         let itemBlock = containerBlock.getInputTargetBlock('STACK');
 
         // Collect all child connections from mutator stack
@@ -94,10 +116,34 @@ Blockly.Extensions.registerMutator(
           itemBlock = itemBlock.nextConnection && itemBlock.nextConnection.targetBlock();
         }
 
+        // Save existing return connections before removing them
+        let rIdx = 0;
+        while (this.getInput('R' + rIdx)) {
+          const returnInput = this.getInput('R' + rIdx);
+          if (returnInput && returnInput.connection && returnInput.connection.targetConnection) {
+            returnConnections.push(returnInput.connection.targetConnection);
+          } else {
+            returnConnections.push(null);
+          }
+          rIdx++;
+        }
+
+        // Collect output specifications from STACK2
+        const outputSpecs = [];
+        let outputBlock = containerBlock.getInputTargetBlock('STACK2');
+        while (outputBlock) {
+          outputSpecs.push(outputBlock);
+          outputBlock = outputBlock.nextConnection && outputBlock.nextConnection.targetBlock();
+        }
+
         const newCount = connections.length;
+        const newOutputCount = outputSpecs.length;
         this.inputCount_ = newCount;
+        this.outputCount_ = newOutputCount;
         this.inputNames_ = this.inputNames_ || [];
         this.inputTypes_ = this.inputTypes_ || [];
+        this.outputNames_ = this.outputNames_ || [];
+        this.outputTypes_ = this.outputTypes_ || [];
 
         // Rebuild the new list of input names and types
         let idx = 0;
@@ -111,6 +157,16 @@ Blockly.Extensions.registerMutator(
           idx++;
         }
 
+        // Rebuild the new list of output names and types
+        let oidx = 0;
+        const newOutputNames = [];
+        for (const outBlock of outputSpecs) {
+          this.outputTypes_[oidx] = outBlock.getFieldValue('TYPE') || 'string';
+          this.outputNames_[oidx] = outBlock.getFieldValue('NAME') || 'output' + oidx;
+          newOutputNames.push(this.outputNames_[oidx]);
+          oidx++;
+        }
+
         // Dispose of removed input reference blocks when inputs shrink
         if (newCount < oldNames.length) {
           for (let i = newCount; i < oldNames.length; i++) {
@@ -182,9 +238,11 @@ Blockly.Extensions.registerMutator(
         // Remove all dynamic and temporary inputs before reconstruction
         let i = 0;
         while (this.getInput('X' + i)) this.removeInput('X' + i++);
+        let r = 0;
+        while (this.getInput('R' + r)) this.removeInput('R' + r++);
         let t = 0;
         while (this.getInput('T' + t)) this.removeInput('T' + t++);
-        ['INPUTS_TEXT', 'TOOLS_TEXT'].forEach(name => {
+        ['INPUTS_TEXT', 'RETURNS_TEXT', 'TOOLS_TEXT'].forEach(name => {
           if (this.getInput(name)) this.removeInput(name);
         });
 
@@ -239,6 +297,39 @@ Blockly.Extensions.registerMutator(
           }
         }
 
+        // Handle return inputs based on outputs
+        if (newOutputCount > 0) {
+          // Remove the default RETURN input if it exists
+          if (this.getInput('RETURN')) {
+            this.removeInput('RETURN');
+          }
+
+          // Add the "and return" label
+          const returnsText = this.appendDummyInput('RETURNS_TEXT');
+          returnsText.appendField('and return');
+
+          // Add each return value input slot
+          for (let j = 0; j < newOutputCount; j++) {
+            const type = this.outputTypes_[j] || 'string';
+            const name = this.outputNames_[j] || ('output' + j);
+            let check = null;
+            if (type === 'integer') check = 'Number';
+            if (type === 'string') check = 'String';
+
+            const returnInput = this.appendValueInput('R' + j);
+            if (check) returnInput.setCheck(check);
+            returnInput.appendField(type);
+            returnInput.appendField('"' + name + '":');
+
+            // Reconnect previous connection if it exists
+            if (returnConnections[j]) {
+              try {
+                returnInput.connection.connect(returnConnections[j]);
+              } catch { }
+            }
+          }
+        }
+
         this.workspace.render();
       } finally {
         Blockly.Events.enable();
@@ -250,6 +341,9 @@ Blockly.Extensions.registerMutator(
         inputCount: this.inputCount_,
         inputNames: this.inputNames_,
         inputTypes: this.inputTypes_,
+        outputCount: this.outputCount_,
+        outputNames: this.outputNames_,
+        outputTypes: this.outputTypes_,
         toolCount: this.toolCount_ || 0
       };
     },
@@ -258,6 +352,9 @@ Blockly.Extensions.registerMutator(
       this.inputCount_ = state.inputCount;
       this.inputNames_ = state.inputNames || [];
       this.inputTypes_ = state.inputTypes || [];
+      this.outputCount_ = state.outputCount || 0;
+      this.outputNames_ = state.outputNames || [];
+      this.outputTypes_ = state.outputTypes || [];
       this.toolCount_ = state.toolCount || 0;
     }
   },
@@ -268,10 +365,12 @@ Blockly.Extensions.registerMutator(
 // Base block definitions
 const container = {
   type: "container",
-  message0: "inputs %1 %2",
+  message0: "inputs %1 %2 outputs %3 %4",
   args0: [
     { type: "input_dummy", name: "title" },
     { type: "input_statement", name: "STACK" },
+    { type: "input_dummy", name: "title2" },
+    { type: "input_statement", name: "STACK2" },
   ],
   colour: 160,
   inputsInline: false
@@ -279,7 +378,27 @@ const container = {
 
 const container_input = {
   type: "container_input",
-  message0: "input %1 %2",
+  message0: "%1 %2",
+  args0: [
+    {
+      type: "field_dropdown",
+      name: "TYPE",
+      options: [
+        ["String", "string"],
+        ["Integer", "integer"],
+        ["List", "list"],
+      ]
+    },
+    { type: "field_input", name: "NAME" },
+  ],
+  previousStatement: null,
+  nextStatement: null,
+  colour: 210,
+};
+
+const container_output = {
+  type: "container_output",
+  message0: "%1 %2",
   args0: [
     {
       type: "field_dropdown",
@@ -320,11 +439,10 @@ const llm_call = {
 
 const create_mcp = {
   type: "create_mcp",
-  message0: "create MCP %1 %2 and return %3",
+  message0: "create MCP %1 %2",
   args0: [
     { type: "input_dummy" },
     { type: "input_statement", name: "BODY" },
-    { type: "input_value", name: "RETURN" },
   ],
   colour: 160,
   inputsInline: true,
@@ -336,12 +454,11 @@ const create_mcp = {
 
 const tool_def = {
   type: "tool_def",
-  message0: "function %1 %2 %3 and return %4",
+  message0: "function %1 %2 %3",
   args0: [
     { type: "field_input", name: "NAME", text: "newFunction" },
     { type: "input_dummy" },
     { type: "input_statement", name: "BODY" },
-    { type: "input_value", name: "RETURN" },
   ],
   colour: 160,
   inputsInline: true,
@@ -390,18 +507,35 @@ function generateUniqueToolName(workspace, excludeBlock) {
   return name;
 }
 
+// Register create_mcp block separately to include custom init logic  
+Blockly.Blocks['create_mcp'] = {
+  init: function () {
+    this.jsonInit(create_mcp);
+    // Apply extensions
+    Blockly.Extensions.apply('test_cleanup_extension', this, false);
+    // Initialize mutator state
+    if (this.initialize) {
+      this.initialize();
+    }
+  }
+};
+
 // Register tool_def block separately to include custom init logic
 Blockly.Blocks['tool_def'] = {
   init: function () {
     this.jsonInit(tool_def);
     // Apply extensions
     Blockly.Extensions.apply('test_cleanup_extension', this, false);
+    // Initialize mutator state
+    if (this.initialize) {
+      this.initialize();
+    }
   }
 };
 
 export const blocks = Blockly.common.createBlockDefinitionsFromJsonArray([
-  create_mcp,
   container,
   container_input,
+  container_output,
   llm_call,
 ]);

project/src/generators/python.js

@@ -32,44 +32,107 @@ forBlock['create_mcp'] = function (block, generator) {
     i++;
   }
 
-  // Gather any tool definitions connected to this block
-  let toolDefs = [];
-  let t = 0;
-  while (block.getInput('T' + t)) {
-    const toolCode = generator.valueToCode(block, 'T' + t, Order.NONE);
-    if (toolCode) {
-      toolDefs.push(toolCode);
-    }
-    t++;
-  }
-
-  // Main function body and return value
+  // Main function body and return value(s)
   let body = generator.statementToCode(block, 'BODY');
-  let returnValue = generator.valueToCode(block, 'RETURN', Order.ATOMIC);
+  let returnStatement = '';
 
-  // Replace placeholder args (arg0, arg1...) with actual names in return statement
-  if (returnValue && block.inputNames_) {
-    for (let j = 0; j < block.inputNames_.length; j++) {
-      const paramName = block.inputNames_[j];
-      returnValue = returnValue.replace(new RegExp(`arg${j}\\b`, 'g'), paramName);
-    }
-  }
+  const returnValues = [];
 
-  let returnStatement = returnValue ? `  return ${returnValue}\n` : '  return\n';
-  let code = '';
+  // Check if we have outputs defined and the R inputs exist
+  if (block.outputCount_ && block.outputCount_ > 0 && block.getInput('R0')) {
+    for (let r = 0; r < block.outputCount_; r++) {
+      let returnValue = generator.valueToCode(block, 'R' + r, Order.ATOMIC);
+
+      // Replace placeholder args with actual names
+      if (returnValue && block.inputNames_) {
+        for (let j = 0; j < block.inputNames_.length; j++) {
+          const paramName = block.inputNames_[j];
+          returnValue = returnValue.replace(new RegExp(`arg${j}\\b`, 'g'), paramName);
+        }
+      }
 
-  // Tool definitions come before main function
-  if (toolDefs.length > 0) {
-    code += toolDefs.join('\n') + '\n\n';
+      // Type-cast numeric returns to ensure proper Gradio compatibility
+      const outputType = block.outputTypes_[r] || 'string';
+      if (outputType === 'integer' && returnValue) {
+        returnValue = `int(${returnValue})`;
+      }
+
+      returnValues.push(returnValue || 'None');
+    }
+
+    if (returnValues.length === 1) {
+      returnStatement = `  return ${returnValues[0]}\n`;
+    } else {
+      returnStatement = `  return (${returnValues.join(', ')})\n`;
+    }
+  } else {
+    // No outputs defined, return empty dict for MCP
+    returnStatement = '  return {}\n';
   }
+  let code = '';
 
   // Create the main function definition
   if (typedInputs.length > 0) {
-    code += `def create_mcp(${typedInputs.join(', ')}):\n${body}${returnStatement}\n`;
+    code += `def create_mcp(${typedInputs.join(', ')}):\n  out_amt = ${returnValues.length}\n\n${body}${returnStatement}\n`;
   } else {
-    code += `def create_mcp():\n${body}${returnStatement}`;
+    code += `def create_mcp():\n  out_amt = ${returnValues.length}\n\n${body || ''}${returnStatement}`;
+  }
+
+  // Map Python types to Gradio components for inputs
+  const gradioInputs = [];
+  if (block.inputTypes_) {
+    for (let k = 0; k < block.inputTypes_.length; k++) {
+      const type = block.inputTypes_[k];
+      switch (type) {
+        case 'integer':
+          gradioInputs.push('gr.Number()');
+          break;
+        case 'string':
+          gradioInputs.push('gr.Textbox()');
+          break;
+        case 'list':
+          gradioInputs.push('gr.Dataframe()');
+          break;
+        default:
+          gradioInputs.push('gr.Textbox()');
+      }
+    }
+  }
+
+  // Map Python types to Gradio components for outputs
+  const gradioOutputs = [];
+  // Only add outputs if they actually exist in the block (R0, R1, etc.)
+  if (block.outputTypes_ && block.outputCount_ > 0 && block.getInput('R0')) {
+    // Use outputCount_ to ensure we only process actual outputs
+    for (let k = 0; k < block.outputCount_; k++) {
+      const type = block.outputTypes_[k];
+      switch (type) {
+        case 'integer':
+          gradioOutputs.push('gr.Number()');
+          break;
+        case 'string':
+          gradioOutputs.push('gr.Textbox()');
+          break;
+        case 'list':
+          gradioOutputs.push('gr.Dataframe()');
+          break;
+        default:
+          gradioOutputs.push('gr.Textbox()');
+      }
+    }
   }
 
+  // Create Gradio Interface with dynamic I/O
+  // Always include outputs parameter, use empty list if no outputs
+  code += `\ndemo = gr.Interface(
+  fn=create_mcp,
+  inputs=[${gradioInputs.join(', ')}],
+  outputs=[${gradioOutputs.join(', ')}],
+  )
+
+demo.launch(mcp_server=True)
+`;
+
   return code;
 };
 
@@ -105,24 +168,76 @@ forBlock['tool_def'] = function (block, generator) {
   }
 
   let body = generator.statementToCode(block, 'BODY');
-  let returnValue = generator.valueToCode(block, 'RETURN', Order.ATOMIC);
+  let returnStatement = '';
+
+  // Check if we have outputs defined and the R inputs exist
+  if (block.outputCount_ && block.outputCount_ > 0 && block.getInput('R0')) {
+    const returnValues = [];
+    for (let r = 0; r < block.outputCount_; r++) {
+      let returnValue = generator.valueToCode(block, 'R' + r, Order.ATOMIC);
+
+      // Replace placeholder args with actual names
+      if (returnValue && block.inputNames_) {
+        for (let j = 0; j < block.inputNames_.length; j++) {
+          const paramName = block.inputNames_[j];
+          returnValue = returnValue.replace(new RegExp(`arg${j}\\b`, 'g'), paramName);
+        }
+      }
 
-  // Ensure return expression uses correct parameter names
-  if (returnValue && block.inputNames_) {
-    for (let j = 0; j < block.inputNames_.length; j++) {
-      const paramName = block.inputNames_[j];
-      returnValue = returnValue.replace(new RegExp(`arg${j}\\b`, 'g'), paramName);
+      // Type-cast numeric returns to ensure proper Gradio compatibility
+      const outputType = block.outputTypes_[r] || 'string';
+      if (outputType === 'integer' && returnValue) {
+        returnValue = `int(${returnValue})`;
+      }
+
+      returnValues.push(returnValue || 'None');
     }
-  }
 
-  let returnStatement = returnValue ? `  return ${returnValue}\n` : '  return\n';
+    if (returnValues.length === 1) {
+      returnStatement = `  return ${returnValues[0]}\n`;
+    } else {
+      returnStatement = `  return (${returnValues.join(', ')})\n`;
+    }
+  } else {
+    // No outputs defined, add pass only if body is empty
+    if (!body || body.trim() === '') {
+      returnStatement = '  pass\n';
+    } else {
+      returnStatement = '';
+    }
+  }
 
   // Construct the function definition
   let code;
   if (typedInputs.length > 0) {
     code = `def ${name}(${typedInputs.join(', ')}):\n${body}${returnStatement}`;
   } else {
-    code = `def ${name}():\n${body}${returnStatement}`;
+    code = `def ${name}():\n${body || '  pass\n'}${returnStatement}`;
+  }
+
+  // Add output type hints as comments if outputs are defined
+  if (block.outputTypes_ && block.outputTypes_.length > 0) {
+    let outputTypes = [];
+    for (let k = 0; k < block.outputTypes_.length; k++) {
+      const type = block.outputTypes_[k];
+      const outName = block.outputNames_[k] || ('output' + k);
+      let pyType;
+      switch (type) {
+        case 'integer':
+          pyType = 'int';
+          break;
+        case 'string':
+          pyType = 'str';
+          break;
+        case 'list':
+          pyType = 'list';
+          break;
+        default:
+          pyType = 'Any';
+      }
+      outputTypes.push(`${outName}: ${pyType}`);
+    }
+    code = code.slice(0, -1) + `  # Returns: ${outputTypes.join(', ')}\n`;
   }
 
   // Return function definition as a string value (not executed immediately)

project/src/index.js

@@ -78,6 +78,8 @@ const updateCode = () => {
     code = call + code;
   }
 
+  code = "import gradio as gr\n\n" + code
+
   if (codeEl) {
     codeEl.textContent = code;
   }