PAG release UI recommender

content/en/docs/refguide/modeling/mendix-ai-assistance/_index.md

@@ -29,6 +29,7 @@ Recommenders:
 
 * **Best Practice Recommender** – helps you inspect your app against Mendix development best practice detecting and pinpointing development anti-patterns and, in some cases, automatically fixing them. For more information, see [Best Practice Recommender](/refguide/best-practice-recommender/).
 * **Logic Recommender** – helps you model and configure microflows, nanoflows, and rules in Mendix Studio Pro. It gives you contextualized recommendations on the next best activity based on the activities and parameters that are already configured in your application. For more information, see [Logic Recommender](/refguide/logic-recommender/).
+* **UI Recommender** (available in Studio Pro 10.18 and above) – helps you easily add new widgets to a page in Mendix Studio Pro without losing the context of what you are currently working on. For more information, see [UI Recommender](/refguide/ui-recommender/).
 * **Workflow Recommender** (available in Studio Pro 10.12 and above) – helps you model and configure workflows in Mendix Studio Pro. It gives you contextualized recommendations on the next best activity in your workflow based on context-related information. For more information, see [Workflow Recommender](/refguide/workflow-recommender/).
 
 Generators:
@@ -52,6 +53,7 @@ The table below presents all the third-party services each Maia capability uses
 | Maia Chat | [Mistral 7B](https://mistral.ai/news/announcing-mistral-7b/) hosted in Mendix AWS environment | User prompts and the generated answers |
 | Best Practice Recommender | No third-party services used | N/A |
 | Logic Recommender | No third-party services used | N/A |
+| UI Recommender | No third-party services used | N/A |
 | Workflow Recommender | No third-party services used | N/A |
 | Domain Model Generator | [Claude in Amazon Bedrock](https://aws.amazon.com/bedrock/claude/) | User prompts and the generated content |
 | Translation Generator | [Amazon Translate](https://aws.amazon.com/translate/) | All translatable texts in the application, for example, labels, button names, and menu items |

content/en/docs/refguide/modeling/mendix-ai-assistance/ui-recommender.md

@@ -0,0 +1,55 @@
+---
+title: "UI Recommender"
+url: /refguide/ui-recommender/
+weight: 20
+description: "Describes UI Recommender in Mendix Studio Pro."
+---
+
+## Introduction
+
+{{% alert color="info" %}}
+ UI Recommender is available in Studio Pro 10.18 and above. 
+
+ UI Recommender is enabled by default. You can disable it via **Edit** > **Preferences** > **Maia** > **In-Editor Recommender** > **Enable for Page Editor**. 
+{{% /alert %}}
+
+UI Recommender allows you to easily add new widgets to a page in Mendix Studio Pro without losing the context of what you are currently working on.
+
+## Using UI Recommender
+
+UI Recommender is only available in **Design Mode**. It is displayed as a small blue plus sign in the page editor. To use UI Recommender, do the following:
+
+1. Open the UI Recommender dialog box in the following way:
+
+    1. Go to **Design Mode** if you are not in this mode.
+    1. Hover over an element on the page and a blue plus sign that represents UI Recommender appears:
+
+        {{< figure src="/attachments/refguide/modeling/mendix-ai-assistance/ui-recommender/blue-plus-sign.png" alt="UI Recommender sign">}}
+
+        * It appears at the closest border of the widget (top/bottom or left/right for inline widgets).
+        * Its position relates to where an element will be inserted (for example, selecting the sign at the top or left will insert an element before the current widget).
+
+    1. Click the blue plus sign to open the UI Recommender dialog box:
+
+        {{< figure src="/attachments/refguide/modeling/mendix-ai-assistance/ui-recommender/dialog.png" alt="UI Recommender dialog" >}}
+
+    Alternatively, you can open the UI Recommender dialog box using keyboard shortcuts:
+
+    1. Go to **Design Mode** if you are not in this mode.
+    1. Click an element to select it on the page.
+    1. Press <kbd>Ctrl</kbd> + <kbd>,</kbd> on Windows (or <kbd>Command</kbd> + <kbd>,</kbd> on Mac) to open UI Recommender at the top or left of the element. Or press <kbd>Ctrl</kbd> + <kbd>.</kbd> on Windows (or <kbd>Command</kbd> + <kbd>.</kbd> on Mac) to open UI Recommender at the bottom or right of the element.
+
+2. To add an element, do the following:
+
+    1. In the UI Recommender dialog box, search for the element you would like to add:
+
+        {{< figure src="/attachments/refguide/modeling/mendix-ai-assistance/ui-recommender/search-in-dialog.png" alt="Search in UI Recommender" >}}
+
+    1. Navigate the list using the <kbd>↑</kbd> or <kbd>↓</kbd> arrow keys.
+    1. Add the selected element by pressing <kbd>Enter</kbd> or by clicking on the element from the list.
+    1. The added element is highlighted and selected, and the dialog closes automatically. When no element is added, the dialog can also be closed by pressing <kbd>Esc</kbd>.
+
+## Read More
+
+* [Adding Elements on a Page](/refguide/page/#add-elements)
+* [Mendix AI Assistance (Maia)](/refguide/mendix-ai-assistance/)

content/en/docs/refguide/modeling/pages/page/_index.md

@@ -69,35 +69,39 @@ The way you can add an element on a page depends on a mode you are editing your
 
 In **Structure mode**, there are several ways to add an element on a page:
 
-1. Through the **Toolbox**:
+* Through the **Toolbox**:
 
-    1. Open the **Toolbox** and select **Widgets** or **Building blocks** tab there.   
-    2. Select an element you would like to add and drag this element onto your page.
+    1. Open the **Toolbox**, and select the **Widgets** or **Building blocks** tab.   
+    1. Select an element you would like to add and drag this element onto your page.
 
-2. Through the menu at the top of the page:
+* Through the menu at the top of the page:
 
     1. Do one of the following:
 
-        1. Select frequently-used widgets (a data view, a data grid, a template grid, or a list view).
-        1. Click **Add widget**  or **Add building block**, find an element in a list and click **Select**.
+        * Select frequently-used widgets (a data view, a data grid, a template grid, or a list view).
+        * Click **Add widget**  or **Add building block**, find an element in a list, and click **Select**:
 
         {{< figure src="/attachments/refguide/modeling/pages/page/top-menu.png" class="no-border" >}}
 
     2. Click a drop-zone on a page to position an element.
 
-3. By right-clicking a drop-zone:<br/>
+* By right-clicking a drop-zone:<br/>
 
-    1. Right-click a drop-zone you want to insert an element in.<br/>
-    1. Select between adding a widget or a building block.<br/>
+    1. Right-click a drop-zone you want to insert an element into.<br/>
+    1. Select between adding a **widget** or a **building block**.<br/>
 
         {{< figure src="/attachments/refguide/modeling/pages/page/adding-widget-in-drop-zone.png"   width="400"  class="no-border" >}}<br/>
 
     1. Select an element you would like to add and confirm your choice by clicking **Select**.
 
-In **Design mode**, you can add elements though the Toolbox. Do the following:
+In **Design mode**, you can add elements though the **Toolbox**. Do the following:
 
-1. Open the **Toolbox** and select **Widgets** or **Building blocks** tab there. 
-2. Select an element you would like to add and drag this element onto your page.
+1. Open the **Toolbox**, and select the **Widgets** or **Building blocks** tab. 
+1. Select an element you would like to add and drag this element onto your page.
+
+{{% alert color="info" %}}
+In Studio Pro 10.18 and above, you can also add elements through UI Recommender in **Design mode**. It allows you to easily add new widgets to a page without losing the context of what you are currently working on. For more information, see [UI Recommender](/refguide/ui-recommender/).
+{{% /alert %}}
 
 ### Viewing Element Properties {#view-properties}
 
@@ -217,3 +221,4 @@ Here is the same page with **X-ray mode** enabled:
 * [Pages](/refguide/pages/)
 * [Page Properties](/refguide/page-properties/)
 * [Page Explorer](/refguide/page-explorer/)
+* [UI Recommender](/refguide/ui-recommender/)