# Interactions

Jet Admin's Component Designer allows you to add interactions to layers, enhancing user engagement and functionality. Five types of interactions can be added to any layer:

1. **Track Hover State:**
   * Monitors the hover state of the layer, allowing you to change its appearance or behavior when a user hovers over it.
2. **Track Pressed State:**
   * Detects when a layer is pressed or clicked, enabling you to modify its appearance or trigger specific actions.
3. **Click Action:**
   * Defines an action to be performed when the layer is clicked, such as navigating to another page or executing a custom script.
4. **Cursor:**
   * Customizes the cursor style when hovering over the layer, enhancing the user interface and experience.
5. **Text Selection:**
   * Allows text layers to be selectable, enabling users to copy text from your application.

**Usage Examples**

1. **Hover State:**
   * Change the background color of a button when a user hovers over it to provide visual feedback.
2. **Pressed State:**
   * Trigger an effect when a button is pressed to simulate a realistic button press.
3. **Click Action:**
   * Set up navigation to a detailed view when an image or item is clicked.
4. **Cursor:**
   * Change the cursor to a pointer to indicate clickable elements or to a custom icon for specific interactions.
5. **Text Selection:**
   * Enable users to copy text from informational panels or data tables for convenience.

#### Implementation

To add interactions in Jet Admin:

1. **Select the Layer:**
   * Choose the layer you want to add an interaction to.
2. **Choose Interaction Type:**
   * Click on the interaction menu and select the desired interaction type (e.g., Track Hover State).
3. **Configure Interaction:**
   * Define the specific behavior or action for the interaction. For example, set the hover state to change the background color to a specific value.
4. **Apply and Test:**
   * Apply the interaction settings and test them to ensure they work as intended.

{% @arcade/embed flowId="RiyaMWEzBwbikjAe3xyB" url="<https://app.arcade.software/share/RiyaMWEzBwbikjAe3xyB>" %}

By utilizing these interactions, you can create a more interactive and engaging user interface in Jet Admin, improving the overall user experience.


---

# 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.jetadmin.io/component-designer/right-sidebar/interactions.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.