# Components

Components let builders save and recycle elements within a room. When an element is saved as a component, you can easily duplicate that element while maintaining its assigned properties - including hitboxes, z-indexes and interactions. 

## Creating and Using Components

To turn an element into a component, select the element and click **Create Component**. Once an element is converted to a component, its selection box will turn from blue to purple for easy identification.

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

{% hint style="info" %}
If your element has any interactions applied, those will automatically apply to your component settings.
{% endhint %}

One your component is created, you can use it across your room. You can view, add and edit all your room's components by navigating to [**Asset Manager**](/buenoverse/fundamentals/asset-manager.md) **> Components**.&#x20;

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

You can access component from other rooms in your world by typing in that room's slug in the **Room** field.

You can grab a component you created from the asset manager and place it in a room, **or duplicate it by holding `Option+Drag (MacOS) / Alt+Drag (PC)`.**

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

To unlink a component and make it a regular element again,  you can select **Detach** from the tool bar or quick edit menu on the right.&#x20;

<div><figure><img src="/files/5MJafzO9V86UrItnAxPR" alt="" width="375"><figcaption></figcaption></figure> <figure><img src="/files/1E18E8ZJUOUgwBOzLfUH" alt="" width="375"><figcaption></figcaption></figure></div>

## Edit components

Once an element is a component, new interactions and properties can be edited from the component editor menu. To edit a single component, select your element and navigate to **Edit Component**.&#x20;

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

This will bring up the **Edit Component** menu, isolating your component for more precise editing.&#x20;

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

In this menu, you can add or remove additional interactions, as well as edit the hitbox/z-index and other properties.&#x20;

{% hint style="info" %}
Any changes to the component will automatically apply to all existing instances of that component. Give your new components **detailed names** if you plan to make variations with the same element!
{% endhint %}


---

# 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.bueno.art/buenoverse/fundamentals/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.