> For the complete documentation index, see [llms.txt](https://docs.myshell.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.myshell.ai/ko/create/pro-config-mode/api-reference/module/anywidget-module/code-runner-widget.md).

# Code Runner Widget

### Widgets in Workshop

![Code Runner Widget](/files/dg18Mz73Z4pxBhvCgB3b)

{% hint style="info" %}
Currently we only provide JavaScript code runner. The supported syntax remains consistent with [공통](/ko/create/pro-config-mode/basic/common.md#expression), including ECMAScript 5.1 and certain 6+ features.\
We don't support third-party libraries or host-environment-specific API like `fetch.`
{% endhint %}

### Config

Fields besides `widget_id` and `output_name`

| Field's Name | JSON Type (Required/Optional) | Description                                                                        | Example                                                                                    |
| ------------ | ----------------------------- | ---------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------ |
| code         | string (Required)             | A stringified code snippet. It should contain one or more function definitions.    | "function main(params) {\n const { a, b } = params;\n const sum = a + b;\n return sum;\n}" |
| function     | string (Optional)             | The name of the function you want to call in the code snippet. Defaults to `main`. | 'main'                                                                                     |
| params       | Object (Optional)             | The parameters you pass to the calling function.                                   | ‘Hello.’                                                                                   |

{% hint style="info" %}
You can use the widget's 'Copy' button to get a stringified code snippet for `code` field.
{% endhint %}

<figure><img src="/files/FeP7L11RJDaDcuAb9rE3" alt=""><figcaption><p>Copy code</p></figcaption></figure>

### Example

{% code overflow="wrap" %}

```json
{
  "id": "code_widget_template",
  "initial": "home_state",
  "states": {
    "home_state": {
      "tasks": [
        {
          "name": "code_widget_example_task",
          "module_type": "AnyWidgetModule",
          "module_config": {
            "widget_id": "1751859390353202447",
            "params": {
              "a": "{{1}}",
              "b": "{{2}}"
            },
            "code": "function main(params) {\n const { a, b } = params;\n const sum = a + b;\n return sum;\n}",  // the text inputted into prompt widget, you can get it from user input or upper state
            "output_name": "result"
          }
        }
      ],
      "render": {
        "text": "{{result}}", // it's a string produced by prompt widget.
        "buttons": [
          {
            "content": "Run Again",
            "description": "",
            "on_click": "rerun"
          }
        ]
      },
      "transitions": {
        "rerun": "home_state",
        "CHAT": "home_state"
      }
    }
  }
}
```

{% endcode %}