> For the complete documentation index, see [llms.txt](https://docs.avonnicomponents.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.avonnicomponents.com/dynamic-components/component-builder/configuring-components/properties.md).

# Properties

The **Properties Panel** is your central hub for configuring and customizing individual Avonni components within the Dynamic Component Builder. It's where you control a component's appearance, behavior, data connections, and interactions.

## Location and Behavior

* **Location:** The Properties Panel is located on the *right-hand side* of the Component Builder interface when an Avonni Component is selected.
* **Context-Sensitive:** The Properties Panel is *dynamic*. It changes to display the settings for the *currently selected component* on the canvas. If you don't have a component selected, the Properties Panel might be blank or show general Dynamic Component settings.

<figure><img src="/files/8xHe5QdqzIPXLrTzbdXF" alt=""><figcaption><p>Location of the Properties Panel</p></figcaption></figure>

***

## What You Can Do with the Properties Panel

The Properties Panel lets you:

* **Configure Behavior:** Define how the component functions, such as setting data limits, enabling sorting/filtering, or controlling visibility.
* **Connect to Data:** Specify the component's *Data Source* (e.g., Avonni Query, Manual Data, Picklist) and map data fields to the component's display elements.
* **Set Component-Specific Options:** Each Avonni component has its unique properties. The Properties Panel displays only the relevant options for the selected component.

***

## How to Use the Properties Panel

1. **Select a Component:** In the Component Builder canvas, *click on* the component you want to configure. The Properties Panel will update to show that component's settings.
2. **Find the Property:** Browse or search within the Properties Panel to find the specific property you want to modify (e.g., "Label," "Value," "Data Source," "Visible"). Properties are often grouped into logical sections (e.g., "Display," "Data," "Interactions").
3. **Modify the Property:** Change the property's value using the provided input field, dropdown, selection list, or other control.
4. **Preview (Optional):** Click the "Preview" button to see the effect of your changes.
5. **Save:** Remember to save your Dynamic Component to persist your changes.

***

## Common Property Types

While specific properties vary by component, here are some *common types* of properties you'll encounter:

* **Text Fields:** For entering text (e.g., labels, messages, URLs).
* **Dropdown Lists/Picklists:** For selecting from a predefined list of options.
* **Checkboxes:** For boolean (true/false) settings.
* **Number Fields:** For entering numeric values.
* **Color Pickers:** For selecting colors.
* **Data Source Selectors:** For choosing a Data Source (e.g., Query, Picklist, Manual).
* **Resource Selectors:** For linking to Variables, Constants, or Formulas.
* **Textarea**: For adding multiple lines of text.

***

## Finding Help

* **Component-Specific Documentation:** Each Avonni component has a documentation page that describes its specific properties in detail. *Refer to* [*the component's documentation*](/dynamic-components/components/explore-all-components.md) *for the most accurate and complete information.*
* **Tooltips:** Hover your mouse cursor over a property in the Properties Panel. A tooltip might appear, providing a brief description of the property.

***

## **In Summary**

The Properties Panel is where all specific component settings are. All components settings will be available from there.


---

# 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.avonnicomponents.com/dynamic-components/component-builder/configuring-components/properties.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.