diff --git a/src/bindgen/typescript/demo/input-parameters-demo-html.js b/src/bindgen/typescript/demo/input-parameters-demo-html.js
index 9b8659ac6..13817cf06 100644
--- a/src/bindgen/typescript/demo/input-parameters-demo-html.js
+++ b/src/bindgen/typescript/demo/input-parameters-demo-html.js
@@ -26,6 +26,8 @@ function inputParametersDemoHtml (functionName, prefix, indent, parameter, requi
     }
       break
     case 'TEXT':
+    case 'OUTPUT_TEXT_FILE':
+    case 'OUTPUT_BINARY_FILE':
       result += `${prefix}${indent}<sl-input ${requiredAttr}name="${parameter.name}" type="text" label="${label}" help-text="${description}"></sl-input>\n`
       break
     case 'INT':
diff --git a/src/bindgen/typescript/demo/input-parameters-demo-typescript.js b/src/bindgen/typescript/demo/input-parameters-demo-typescript.js
index 91224982b..eeeaf7f3a 100644
--- a/src/bindgen/typescript/demo/input-parameters-demo-typescript.js
+++ b/src/bindgen/typescript/demo/input-parameters-demo-typescript.js
@@ -54,9 +54,16 @@ function inputParametersDemoTypeScript(functionName, indent, parameter, required
       result += `${indent}})\n\n`
       break
     case 'TEXT':
+    case 'OUTPUT_TEXT_FILE':
+    case 'OUTPUT_BINARY_FILE':
       result += `${indent}const ${inputIdentifier} = document.querySelector('#${functionName}Inputs sl-input[name=${parameter.name}]')\n`
       result += `${indent}${inputIdentifier}.addEventListener('sl-change', (event) => {\n`
-      result += `${indent}${indent}model.${modelProperty}.set("${parameterName}", ${inputIdentifier}.value)\n`
+      if (parameter.itemsExpectedMax > 1) {
+        result += `${indent}${indent}const values = ${inputIdentifier}.value.split(',').map(s => s.trim())\n`
+        result += `${indent}${indent}model.${modelProperty}.set("${parameterName}", values)\n`
+      } else {
+        result += `${indent}${indent}model.${modelProperty}.set("${parameterName}", ${inputIdentifier}.value)\n`
+      }
       result += `${indent}})\n\n`
       break
     case 'BOOL':
diff --git a/src/bindgen/typescript/demo/interface-functions-demo-html.js b/src/bindgen/typescript/demo/interface-functions-demo-html.js
index c48034685..55e2b41b2 100644
--- a/src/bindgen/typescript/demo/interface-functions-demo-html.js
+++ b/src/bindgen/typescript/demo/interface-functions-demo-html.js
@@ -31,6 +31,11 @@ function interfaceFunctionsDemoHtml(interfaceJson, functionName, useCamelCase) {
       result += inputParametersDemoHtml(functionName, prefix, indent, parameter, false, useCamelCase)
     })
   }
+  interfaceJson.outputs.forEach((output) => {
+    if (output.type.includes('FILE')) {
+      result += inputParametersDemoHtml(functionName, prefix, indent, output, true, useCamelCase)
+    }
+  })
 
   result += `${prefix}<sl-divider></sl-divider>\n`
   const loadSampleInputsId = useCamelCase ? 'loadSampleInputs' : 'load-sample-inputs'
diff --git a/src/bindgen/typescript/demo/interface-functions-demo-typescript.js b/src/bindgen/typescript/demo/interface-functions-demo-typescript.js
index 24d42192c..e13c53fa5 100644
--- a/src/bindgen/typescript/demo/interface-functions-demo-typescript.js
+++ b/src/bindgen/typescript/demo/interface-functions-demo-typescript.js
@@ -128,6 +128,12 @@ class ${functionNamePascalCase}Model {
     })
   }
 
+  interfaceJson.outputs.forEach((output) => {
+    if (output.type.includes('FILE')) {
+      result += inputParametersDemoTypeScript(functionName, indent, output, true, 'options')
+    }
+  })
+
   result += `${indent}// ----------------------------------------------\n${indent}// Outputs`
   interfaceJson.outputs.forEach((output) => {
     result += outputDemoTypeScript(functionName, '', indent, output)