> For the complete documentation index, see [llms.txt](https://docs.codelessly.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.codelessly.com/codelessly-cloudui/calling-functions.md).

# Calling Functions

## *"Call Function"* Action

Actions are meant to make the UI more functional. Using actions, you can navigate to a different page, change state of a widget, launch URLs, etc. In this case, we need to call a custom function in the SDK. So, we use the *Call Function* action.

Head over to *Develop Tab* located in the app bar.

<figure><img src="/files/vZcF6xwQA4c4L0QLQD5k" alt=""><figcaption><p>Develop Tab</p></figcaption></figure>

You should see the *Actions Panel* in the right. Now, select the node you wish to add the action to.

<figure><img src="/files/TLpL9KfjVo64Hy3TM2dt" alt=""><figcaption><p>Node selected</p></figcaption></figure>

To add an action, tap on the *add icon* and select *"Call Function Action"* from the dropdown.

<figure><img src="/files/XE7kq4OAQaeYkaBXtJbQ" alt=""><figcaption><p>Adding Call Function Action</p></figcaption></figure>

Next, tap on the *settings icon* to open the settings window.

<figure><img src="/files/K0mDoqsTdk92Jciop6C1" alt=""><figcaption><p>Action Settings Window</p></figcaption></figure>

Enter the custom function's name in the *Function Name Field*.

<figure><img src="/files/foOR9RyOJQlLjeYCRj6y" alt=""><figcaption><p>Function Name Field</p></figcaption></figure>

Action to call a custom function is now added to the node. Now, we need to provide the function in the SDK.

## Functions Field

We can provide custom functions to the `CodelesslyWidget` using its `functions` parameter which is of type `Map<String, CodelesslyFunction<T>>`. Map's key is the name of the function and value is `CodelesslyFunction` class that takes in the function itself in its constructor.

`CodelesslyFunction` has a parameter `call` which is a function with generic return type `T`. Here's an example of how we can declare functions in the widget.

```dart
CodelesslyWidget(
  functions: {
    'expandForecastPage': CodelesslyFunction((context, ref, params) {...}),
  }
);
```

`ref` is an instance of `CodelesslyContext` that you may use to access data and other functions from the SDK.

`params` is a Map that contains any parameters passed by the function when it is called. These parameters can be defined on the function call from the Editor.

<figure><img src="/files/9ptzICXl8kUJDwnVdZIr" alt=""><figcaption></figcaption></figure>

Now, node can access the function and call it on relevant trigger (*click* in this case).