> For the complete documentation index, see [llms.txt](https://docs.trymito.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.trymito.io/how-to/custom-editors-autogenerate-ui-from-any-function.md).

# Custom Editors: Autogenerate UI from Any Function

{% hint style="info" %}
 This is a [Mito Enterprise](https://trymito.io/plans) feature. [Upgrade](https://www.trymito.io/plans) to extend your spreadsheet with additional  functionality.
{% endhint %}

The Mito spreadsheet is built to be extensible for your team's use case. Mito users or infrastructure administrators can extend Mito with custom dataframe editing capabilities, like proprietary algorithms, calculations, and domain-specific knowledge.

Stop your internal Python code from rotting on the shelf, and get it to end users in the most intuitive interface -- a spreadsheet. 

## How to Write Custom Editor 

Adding custom editing functionality to the Mito spreadsheet is very simple:

1. Define a Python function that takes a `pd.DataFrame` and returns a `pd.DataFrame`. 
2. Pass this function to the `editors` parameter when creating the Mito sheet.
3. Use the `Custom Edits` dropdown in the Mito sheet to access this functionality - with an auto-generated UI!

### Example: Calculating Moving Average 

Imagine we're a financial institution that has implemented the following Python function, and we want to expose it to our users:

```python
import pandas as pd

def calculate_moving_average(df, column_to_average, window_size, exponential=False):
    """
    Calculate moving average for a given financial time series data.
    """
    if exponential:
        df['EMA'] = df[column_to_average].ewm(span=window_size, adjust=False).mean()
    else:
        df['SMA'] = df[column_to_average].rolling(window=window_size).mean()
    return df
```

#### Step 1: Add types to the function

First, we must add types to the parameters of the function. This ensures that Mito can correctly generate a UI for each of these parameters. In this case, we type this function in the following way:

```python
import pandas as pd
from mitosheet.extensions.v1 import ColumnHeader

def calculate_moving_average(df: pd.DataFrame, column_to_average: ColumnHeader, window_size: int, exponential: bool=False):
   """
    Calculate moving average for a given financial time series data.
    """
    if exponential:
        df['EMA'] = df[column_to_average].ewm(span=window_size, adjust=False).mean()
    else:
        df['SMA'] = df[column_to_average].rolling(window=window_size).mean()
    return df
```

#### Step 2: Pass this function to the `editors` parameter

Then, pass this function to the `editors` parameter. 

{% tabs %}
{% tab title="Jupyter" %}
Pass this custom editor with:

```python
mitosheet.sheet(editors=[calculate_moving_average])
```

{% endtab %}

{% tab title="Streamlit" %}
Pass this custom editor with:

```python
spreadsheet(editors=[calculate_moving_average])
```

{% endtab %}

{% tab title="Dash" %}
Pass this custom editor with:

```python
Spreadsheet(editors=[calculate_moving_average])
```

{% endtab %}
{% endtabs %}

#### Step 3: Pass some good testing data to the Mito sheet

Pass the following data to the Mito spreadsheet, so that we can test our new custom editor:

```python
import pandas as pd

data = {'Date': ['2023-01-01', '2023-01-02', '2023-01-03', '2023-01-04', '2023-01-05'],
        'Price': [100, 102, 105, 101, 98]}
df1 = pd.DataFrame(data)
```

#### Step 4: Access the functionality in Mito with the `Custom Edits` dropdown

In the toolbar, a `Custom Edits` tab option will appear, with the Calculate Moving Average function beneath it:

<figure><img src="/files/5cnfxQW6k56B3eKQ3zWI" alt=""><figcaption></figcaption></figure>

Selecting this option will open a taskpane that allows you to configure this function, and calculate the moving average!

<figure><img src="/files/m1fhljlld0biAjFRtG8a" alt=""><figcaption></figcaption></figure>

## Supported Types

To see all the valid parameter types, check out the [Supported Types](/how-to/custom-editors-autogenerate-ui-from-any-function.md#supported-types) section of the custom importers page.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.trymito.io/how-to/custom-editors-autogenerate-ui-from-any-function.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.