Merge branch 'main' into david/migrate-widget-issues

Author: PoojaB26

docs/ff-concepts/design-system/design-system.md

@@ -256,7 +256,7 @@ Here are all the properties you can customize:
 
     ![main-axis-margin](../imgs/main-axis-margin.avif)
 
-6. **Cross Axis Maring:** This refers to the space or gap along the cross direction of the scrollbar. For instance, in a vertically scrolling list, it refers to the left and right spacing, and in a horizontally scrolling list, it refers to the top and bottom spacing.
+6. **Cross Axis Margin:** This refers to the space or gap along the cross direction of the scrollbar. For instance, in a vertically scrolling list, it refers to the left and right spacing, and in a horizontally scrolling list, it refers to the top and bottom spacing.
 
     ![cross-axis-margin](../imgs/cross-axis-margin.avif)
 

docs/ff-integrations/database/cloud-firestore/getting-started.md

@@ -95,3 +95,39 @@ com/embed/v_hR4K4auoQ" frameborder="0" allow="accelerometer; autoplay; clipboard
 
 :::
 
+## Manage Databases
+
+You can also create multiple Firestore databases within a single Firebase project. This is especially useful for enterprise use cases, for example, when managing region-based databases or supporting multiple clients with isolated data stores.
+
+Additionally, you can use multiple databases to simulate different environments such as development, staging, and production. **However, note that** this setup is not directly related to the [Development Environments](../../../testing-deployment-publishing/development-environments/development-environments.md) in FlutterFlow, which operates independently of Firebase's multi-database configuration. This means that you’ll need to manually switch Firestore Database ID when switching Development Environments.
+
+To create a new database, go to the **Firebase Console > Firestore Database** section. Click the button next to the default database, i.e, **Add database**. Choose a region and configure your security rules. Once the new database is created, you can switch between databases using the dropdown.
+
+Next, copy the new **Database ID** and navigate to **FlutterFlow > Settings and Integrations > Firebase > Advanced Settings**. Paste the ID into the **Firestore Database ID** input field. Finally, regenerate the config file. Your app will now use the newly created database.
+
+
+<div style={{
+    position: 'relative',
+    paddingBottom: 'calc(56.67989417989418% + 41px)', // Keeps the aspect ratio and additional padding
+    height: 0,
+    width: '100%'}}>
+    <iframe 
+        src="https://demo.arcade.software/f2lDuL0yk5UlrjkNnfRF?embed&show_copy_link=true"
+        title=""
+        style={{
+            position: 'absolute',
+            top: 0,
+            left: 0,
+            width: '100%',
+            height: '100%',
+            colorScheme: 'light'
+        }}
+        frameborder="0"
+        loading="lazy"
+        webkitAllowFullScreen
+        mozAllowFullScreen
+        allowFullScreen
+        allow="clipboard-write">
+    </iframe>
+</div>
+<p></p>

docs/resources/control-flow/user-interactivity/forms/form-widgets/text-field.md

@@ -410,6 +410,15 @@ To autofocus a TextField, select the TextField widget, move to the **Properties
 </div>
 <p></p>
 
+### Enable Interactive Selection
+
+The **Enable Interactive Selection** toggle controls whether users can interact with the text selection features, such as long-press selection, copy/paste menus, and selection handles.
+
+By default, this property is set to **True**, allowing users to select, copy, and paste text using the platform's built-in text selection controls. Disabling this can help prevent unintended text copying or editing, especially in sensitive fields.
+
+
+![interactive-selection](../imgs/interactive-selection.avif)
+
 ### Autocomplete a TextField
 
 You might want to allow users to enter the text by suggesting them a list of items. The suggested items are shown if it contains the currently entered text from TextField. For example, using autocomplete to get the *Country* *name*, *Fruit* *name*, etc.

docs/resources/control-flow/user-interactivity/forms/imgs/interactive-selection.avif

@@ -253,17 +253,17 @@ You can easily upgrade to newer versions of the libraries as they become availab
 
 ## Library Pages
 
-You can also add and manage pages within a library, making it easy to reuse those pages across multiple projects. These pages function like any regular project page in your app; they support navigation, parameters, state management, and transitions. 
+When you publish a library, all the pages included in the library become available for use in the consumer project. These pages function like any regular project page in your app; they support navigation, parameters, state management, and transitions. 
 
-Including pages with libraries offers a modular approach to development, making it ideal for large teams and complex, multi-feature apps. For example, instead of recreating common flows like onboarding and payment flows, you can build them in a library once and use them wherever needed.
+Library Pages offers a modular approach to development, making it ideal for large teams and complex, multi-feature apps. For example, instead of recreating common flows like onboarding and payment flows, you can build them in a library once and use them wherever needed.
 
 :::tip[Possible Use Cases]
 - **Super Apps** like Gojek and Uber with distinct modules such as ride booking, shopping, and payments. Each module can be developed as a separate library and imported into a single main project.
 - **Enterprise Apps** with isolated user journeys for different roles, such as admin and customer. Each role-based flow can be built as its own library and integrated into the core app as needed.
 - **White-labeled Apps** that share common onboarding flows can benefit from libraries. The onboarding process can be built once as a library and reused across all branded versions of the app.
 :::
 
-The library author selects which pages to include and publishes the library. When users import or update the library, they can override the default route names to prevent conflicts between the library and their project. Library pages then appear in navigation actions just like any regular page.
+When users import or update the library, they can override the default route names to prevent conflicts between the library and their project. Library pages then appear in navigation actions just like any regular page.
 
 <div style={{
     position: 'relative',
@@ -291,7 +291,50 @@ The library author selects which pages to include and publishes the library. Whe
 </div>
 <p></p>
 
+### Library Pages in NavBar
 
+Library pages can also be used in the NavBar, allowing users to add reusable flows into the app’s primary navigation structure. For example, in a Super App, you can import ride booking, food delivery, or payment pages from separate libraries and add them directly to the bottom navigation, giving users quick access to each module.
+
+:::tip
+Want to learn more about building modular Super Apps using libraries? Check out our [**blog post**](https://blog.flutterflow.io/scaling-super-apps-modular-architecture-with-flutterflow-libraries/).
+:::
+
+To display a library page on the NavBar, navigate to **Project Dependencies > FlutterFlow Libraries**, then click on **Pages** for the relevant library to open its details. In the list of pages, locate the desired page and click **Nav Bar Settings**, then enable **Show on NavBar**. You can also customize additional settings, such as label and icon, as needed.
+
+To confirm, go to the **Nav Bar & App Bar** section, where you’ll see the library page listed as part of the NavBar items.
+
+:::info
+NavBar settings for regular pages are available directly within the Page Settings panel in the builder. However, for Library pages, these settings are managed through the Library Details dialog.
+
+![NavBar-settings-for-regular-and-library-page](imgs/NavBar-settings-for-regular-and-library-page.avif)
+:::
+
+
+<div style={{
+    position: 'relative',
+    paddingBottom: 'calc(56.67989417989418% + 41px)', // Keeps the aspect ratio and additional padding
+    height: 0,
+    width: '100%'}}>
+    <iframe 
+        src="https://demo.arcade.software/BDac382RQTHTKFhtZcsc?embed&show_copy_link=true"
+        title=""
+        style={{
+            position: 'absolute',
+            top: 0,
+            left: 0,
+            width: '100%',
+            height: '100%',
+            colorScheme: 'light'
+        }}
+        frameborder="0"
+        loading="lazy"
+        webkitAllowFullScreen
+        mozAllowFullScreen
+        allowFullScreen
+        allow="clipboard-write">
+    </iframe>
+</div>
+<p></p>
 
 ## Library Values
 

docs/resources/projects/imgs/NavBar-settings-for-regular-and-library-page.avif

@@ -103,13 +103,13 @@ Authorization: Bearer YOUR_API_TOKEN_HERE
 ## API Endpoints
 Below is a list of available API endpoints with their methods and usage descriptions.
 
-| Endpoint                    | Method | Purpose                                       |
-| --------------------------- | ------ | --------------------------------------------- |
-| `/listPartitionedFileNames` | GET    | List available YAML file names for a project.  |
-| `/l/listProjects`           | POST   | Retrieve metadata for all projects.            |
-| `/projectYamls`             | GET    | Export/download YAML files from a project.     |
-| `/validateProjectYaml`      | POST   | Validate YAML content before applying changes. |
-| `/updateProjectYaml`        | POST   | Update project configuration via YAML.         |
+| Endpoint                      | Method | Purpose                                       |
+| ---------------------------   | ------ | --------------------------------------------- |
+| `/listPartitionedFileNames`   | GET    | List available YAML file names for a project.  |
+| `/l/listProjects`             | POST   | Retrieve metadata for all projects.            |
+| `/projectYamls`               | GET    | Export/download YAML files from a project.     |
+| `/validateProjectYaml`        | POST   | Validate YAML content before applying changes. |
+| `/updateProjectByYaml`        | POST   | Update project configuration via YAML.         |
 
 
 ### List File Names
@@ -358,7 +358,7 @@ curl -X POST \
 This endpoint allows you to overwrite existing files in your FlutterFlow project by submitting updated YAML content.
 
 #### Endpoint
-`POST /updateProjectYaml`
+`POST /updateProjectByYaml`
 
 #### Request Body
 ```jsx
@@ -413,7 +413,7 @@ This example updates the `ad-mob` file and adds/updates app state variables.
 
 ```jsx
 curl -X POST \
-  'https://api.flutterflow.io/v2/updateProjectYaml' \
+  'https://api.flutterflow.io/v2/updateProjectByYaml' \
   -H 'Authorization: Bearer YOUR_API_TOKEN' \
   -H 'Content-Type: application/json' \
   -d '{
@@ -462,7 +462,7 @@ First, we use the `/listPartitionedFileNames` endpoint to check if the `app-stat
 </div>
 <p></p>
 
-Next, we open the `app-state.yaml` file and update the `enableDarkMode` variable by setting its `persisted` value to `true`. We then convert the updated YAML into a properly escaped single line string and validate it using the `/validateProjectYaml` endpoint. If validation succeeds, we send the final update using the `/updateProjectYaml` endpoint.
+Next, we open the `app-state.yaml` file and update the `enableDarkMode` variable by setting its `persisted` value to `true`. We then convert the updated YAML into a properly escaped single line string and validate it using the `/validateProjectYaml` endpoint. If validation succeeds, we send the final update using the `/updateProjectByYaml` endpoint.
 
 
 <div style={{
@@ -535,7 +535,7 @@ When YAML validation fails, you'll receive detailed error information:
     -d '{"projectId": "project-id", "fileKey": "ad-mob", "fileContent": "showTestAds: false"}'
 
   # 2. If validation passes, apply the changes
-  curl -X POST 'https://api.flutterflow.io/v2/updateProjectYaml' \
+  curl -X POST 'https://api.flutterflow.io/v2/updateProjectByYaml' \
     -H 'Authorization: Bearer YOUR_API_KEY' \
     -H 'Content-Type: application/json' \
     -d '{"projectId": "project-id", "fileKeyToContent": {"ad-mob": "showTestAds: false"}}'

docs/resources/projects/libraries.md

@@ -117,6 +117,12 @@ Here’s exactly how you do it:
 
 On touch devices, the *Tooltip* opens on tap. To make it open on long press instead, use the **Trigger Mode** property.
 
+### Show Tooltip on Focus
+
+The **Show Tooltip on Focus** toggle controls whether the tooltip is displayed when the child widget receives keyboard focus. This is particularly useful for improving accessibility and keyboard navigation, as it ensures users see helpful information when they tab through form fields, interactive elements or any important information.
+
+![tooltip-on-focus](imgs/tooltip-on-focus.avif)
+
 ### Change tooltip alignment
 
 By default, the *Tooltip* appears below the target widget. You can change this setting using the **Preferred Direction** property. This allows you to open the Tooltip **Above**, **Left,** and **Right** directions in addition to the **Below**.

docs/resources/projects/settings/project-apis.md

@@ -11,7 +11,7 @@ toc_max_heading_level: 4
 # Branching
 Branching creates a separate copy of your work, so you can add new features without disrupting your current progress. It enables multiple developers or teams to work simultaneously on different features without interfering with each other.
 
-Suppose you have an eCommerce app and you want to add a new feature, such as a product recommendation system. Instead of incorporating it directly into your `main` branch and potentially causing problems, you can create a branch to work on this new feature in isolation. Once it's complete, you can integrate it back into the `main` branch.
+Suppose you have an eCommerce app and you want to add a new feature, such as a product recommendation system. Instead of incorporating it directly into your existing `main` branch and potentially causing problems, you can create a branch to work on this new feature in isolation. Once it's complete, you can integrate it back into the `main` branch.
 
 :::info
 While all users can access the branching menu and create commits, only **Pro**, **Teams**, and **Enterprise** plans support creating new branches.
@@ -28,12 +28,18 @@ FlutterFlow. You can also learn more about
 ## Branching Overview
 Before you create and merge a branch, it is essential to understand the general workflow. Here's what it looks like:
 
-![branching](../imgs/branching.avif)
+![branching](imgs/branching-overview.avif)
 
-First, create a new branch from the `main` branch. After making your changes and finalizing the 
-feature, merge this new branch back into the `main` branch. If there are any conflicts, 
+First, create a new branch from the `main` branch. After making your changes in a new branch and finalizing the feature, merge this new branch back into the `main` branch. If there are any conflicts, 
 you must resolve them first.
 
+:::note
+It’s important to understand what merging actually means. Merging does not perform a "union" of data between branches. Instead, Git merge reconciles differences (diffs) between the branches. When you merge, Git compares the changes made in the new branch with the main branch and applies these changes directly.
+
+For instance, if a branch is created and all existing data is deleted before new content is added, Git interprets this as a replacement. When the branch is merged back into the main branch, those deletions will also be applied removing the original data. This behaviour can be surprising to those expecting Git to automatically preserve all content from both branches. Learn more about [**Merging**](#merging).
+
+To avoid accidental data loss, ensure that your branch workflow involves incremental and intentional changes rather than deleting and replacing all existing content unless that's specifically your goal.
+:::
 
 ## Creating a New Branch
 To create a new branch from the current branch, simply go to the **Branching Options** button next to current branch in the **Branching menu.**
@@ -177,12 +183,12 @@ You can also merge changes from the parent branch, into the current branch. For
 
 ![after-merging-2](../imgs/after-merging-2.png)
 
-During a merge, FlutterFlow compares the changes made in both branches, if the changes don't overlap or conflict then the branches are automatically combined. If there are conflicts (for example, both branches modified the same widget property) you'll need to resolve these before the merge can be completed.
+During a merge, Git compares the changes made in both branches, if the changes don't overlap or conflict then the branches are automatically combined. If there are conflicts (for example, both branches modified the same widget property) you'll need to resolve these before the merge can be completed.
 
 :::note Few things to note here
 
-- At the moment, FlutterFlow only supports merging into the parent branch, or the branch that the current branch was created from (usually `main`)
-- Only the user who initiated the merge can access both the `main` branch and the branch during an ongoing merge.
+- At the moment, FlutterFlow only supports merging into the parent branch, or the branch that the current branch was created from.
+- Only the user who initiated the merge can access both the branches during an ongoing merge.
 - Merges result in a merge [commit](#commits), which means you can undo a merge by restoring the branch to a prior commit
 - If you leave the project during the merge and come back, the progress you have made on the merge will be preserved.