# Form Builder Components

![](/files/3qn49KJjAO2zenUPdFQ0)

Components are building blocks to help you create and customize your data-driven content. For more details, please visit the **Zero Density Academy** on <https://academy.zerodensity.tv/>

### Component Toolbar

<div align="left"><img src="/files/qUbWt2Ks17QklCWWSJLb" alt="Button Component"></div>

Except for the **Action Group** component, all other components share the same buttons as shown in the image above. From left to right, component buttons represent:

* **Copy Style** allows you to copy and paste the current style into the compatible component. Single clicking on the style button turns it to blue and allows you to paste the style once. Double-clicking on the style button turns it red and lets you paste your style multiple times. To finish the multiple-paste operation, you must click on the Copy Style icon one more time.   &#x20;
* **Field Settings** opens the component setting menu. In the field setting area, you can change component-specific settings.&#x20;
* **Delete** button erases the component from the [Form Area](/docs/reality-5.3/reality-5.3/user-guide/nodegraph-actions/form-builder/form-builder-interface.md)

### Binding Info

<div align="left"><img src="/files/pwMKGVExN9h7AwSoAXhc" alt="Binding Info"></div>

If you drag and drop bounded properties/functions or components inside the Form Area, you can see its binding info on the component, as shown in the image above.&#x20;

* Binding info of the <mark style="color:purple;">**`Play`**</mark> button: *Animation Control\~Play/Stop Ball Animation//PLAY/0*&#x20;
* Binding info of the <mark style="color:purple;">**`Stop`**</mark> button: *Animation Control\~Play/Stop Ball Animation//STOP/0*

<div align="left"><img src="/files/hZt4UXrTxq5ZOI4xRHtt" alt=""></div>

The image above shows the **origin** of binding info:

1. Animation Control (Actor Name)
2. Play/Stop Ball Animation (Property Group Name)
3. Play (Button Name)


---

# 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://zerodensitydocumentation.gitbook.io/docs/reality-5.3/reality-5.3/user-guide/nodegraph-actions/form-builder/form-builder-components.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.