Slate Codesandbox SlateFunctions.CallFunction?

[AtWorkDS]

If I have imported a function in Slate; can i use in codesandbox? and how would I call in a javascript in CodeSandbox?

[drusak]

Hey @AtWorkDS !

Can you please clarify what type of function you have in mind?

1. a function from external javascript library - if so, you can import the library directly into CodeSandbox using Library Locations input in the widget editor. You need to upload the javascript file with the library into foundry and then select it using “Add JavaScript library” button. You should then be able to use any function exported from such library inside Code Sandbox
   

   

2. A Slate function (say f_function_1) - you can trigger a function to run from inside Code Sandbox by using SlateFunctions.triggerEvent syntax. You will have to first create a custom Event inside CodeSandbox, trigger it by its name, and have an Event/Action pair set up in your Slate app to trigger f_function_1.run action in response.

In the example below:

• first we add the name of the custom event to Events input under Interactions tab
• then we add an Event/Action pair in Slate to trigger f_function_1.run in response to w_code_sandbox_1.custom.run_function (note the prefix is autocreated and run_function, i.e. your custom name appended to it)
• now in CodeSandbox’s javascript, we can run SlateFunctions.triggerEvent("run_function"); and it will cause f_function_1 to run

[AtWorkDS]

@drusak, thank you for your feedback! I created my function in TypeScript and then imported it into the Slate environment using the Slate function editor. This function—let’s call it f_function_1—takes a user prompt and returns a string, which is the LLM model’s response. As a parameter, I’m passing "{w_codesandbox1_state.input}", which is defined in my CodeSandbox JS script using SlateFunctions.setState("input", text);. When I use {{f_function_1}} inside a widget text box or input, I can display the function’s result.

My question is: once f_function_1 has been triggered, how can I programmatically access its result from within the codesandbox? My app being developed in the codesandox is a chatbot, so the result of the function will be displayed in the chat.

[drusak]

Hello,

in order to pass the return value of the function into CodeSandbox you can use Actions configuration setting in Widget editor (say, function_was_run), then trigger said action upon the f_function_1.ran event in Slate - if you return {{f_function_1}} inside the event body, the return value of the function will be passed to the CodeSandbox action function_was_run.

What remains is to set a SlateFunctions.onAction handler in your sandbox javascript to access the value like:

SlateFunctions.onAction("function_was_run", value => {
	document.getElementById("title").innerHTML = value;
});

(in this example we just set the return value to be the title for visibility, but of course you can do whatever you need with it inside the javascript)

[AtWorkDS]

@drusak thank you for detailed feedback. After implementing your approach, playing around with it along with some vibe coding, I was able to achieve a conversational chatbot.