# Plain Text / Code Editor

The `aceeditor` element is great for editing HTML, CSS, JSON, or any other type of code in your app. This is the same element that is used by throughout the BetterForms interface.

|         Key |   Value(s)  |            Type           | Description                                                                                                                                                 |
| ----------: | :---------: | :-----------------------: | ----------------------------------------------------------------------------------------------------------------------------------------------------------- |
|      `type` | `aceeditor` |          *string*         |                                                                                                                                                             |
|      `lang` |             |          *string*         | code language options: html, javascript, markdown, plain\_text, css, json                                                                                   |
|     `model` |             | *string, object or array* | the field or JSON node of the model used for the source                                                                                                     |
| `getAsJSON` |  *optional* |         *boolean*         | if true, the model is stringified for editing. This allows you to edit the JSON directly in the MODEL (vs it being stored as a string (all other languages) |
|    `height` |  *optional* |          *string*         | default of 700px else element height can be specified `300px`, `70%` are valid values.                                                                      |
|     `theme` |  *optional* |          *string*         | The theme used in the editor                                                                                                                                |

TODO add support for options {}

## Example

```yaml
// Sample JSON editor ( will put stringified json text into the model field )
{
  "getAsJSON": false,
  "height": "500px",
  "label": "EDIT Some JSON",
  "lang": "json",
  "model": "sourceCode",
  "styleClasses": "col-md-12",
  "type": "aceeditor"
}
```


---

# Agent Instructions: 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:

```
GET https://docs.klai.studio/v1/reference/components-overview/misc-elements/aceeditor.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.