Skip to content

Commit 7c6b230

Browse files
authored
Merge branch 'main' into fix/responsive-values
2 parents e7f679e + 2109be4 commit 7c6b230

File tree

82 files changed

+1244
-9
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

82 files changed

+1244
-9
lines changed

docs/accounts-billing/new-pricing-comparison.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -380,7 +380,7 @@ export const PricingToggles = () => {
380380
</tr>
381381
<tr>
382382
<td>Cloud Functions<br/><span className="feature-description">Write and deploy Firebase Cloud Functions directly from FlutterFlow</span></td>
383-
<td></td>
383+
<td></td>
384384
<td>✅</td>
385385
<td>✅</td>
386386
<td>✅</td>

docs/ff-concepts/adding-customization/custom-code.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,9 @@ necessary code.
6868
This can significantly speed up the building process and reduce the need for in-depth programming
6969
knowledge, making it especially useful for custom functions and actions.
7070

71-
**Limitation:** The prompts are limited to 100 characters currently.
71+
:::info[Limitation]
72+
Your prompt must be at least 3 words and no more than 500 characters.
73+
:::
7274

7375
<div style={{
7476
position: 'relative',
Binary file not shown.

docs/resources/control-flow/functions/utility-functions.md

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -100,6 +100,10 @@ To add inline function, open the Set from Variable dialog wherever it's possible
100100

101101
For example, we may want to quickly calculate the discount amount of a product where the discount is 18% of the MRP of the product. The expression would be `cost - (cost * discount)`.
102102

103+
:::tip
104+
Looking for more power and flexibility? Use the new [**Custom Code Expression**](#custom-code-expression). It’s a more advanced version of Inline Functions that lets you access FlutterFlow generated resources without passing them as arguments. You also get real-time autocomplete and inline error checking for faster, more accurate logic.
105+
:::
106+
103107
**Precedence of operations**
104108

105109
Inline Function for math operations follow typical precedence (e.g., multiplication/division before addition/subtraction), but parentheses can change the order.
@@ -162,6 +166,79 @@ Here are some common expressions you can use for your business logic:
162166
| `int.parse(s)` | Convert the **String** into an **integer.** | `int.parse(stringValue)` | `int` |
163167

164168

169+
## Custom Code Expression
170+
171+
**Custom Code Expression** lets you write short Dart code directly in widget property fields and action flows in FlutterFlow. It’s a more powerful version of [**Inline Function**](#inline-function-code-expressions), allowing you to directly access FlutterFlow generated classes, global variables, widget properties, parameters, and more without needing to manually pass them as inputs.
172+
173+
Custom Code Expressions also support real-time autocomplete, making it easy to discover available fields as you type. For example, when you type `FFAppState().`, it will suggest all available app state variables along with their types.
174+
175+
In addition, inline validation provides immediate feedback as you write, helping you catch syntax errors or invalid property references.
176+
177+
:::info
178+
To use Custom Code Expression, you must have an active [**FlutterFlow paid plan**](https://www.flutterflow.io/pricing).
179+
:::
180+
181+
:::tip
182+
- To explore what you can access within a Custom code expression, refer to the [**Common Examples**](../../../ff-concepts/adding-customization/common-examples.md) page.
183+
- Press `^ + Space` (or `Ctrl + Space`) while typing to see suggestions for what you can access in your Custom code expression.
184+
- You can access values inside custom structs. For example, you can use `FFAppState().localDeviceInfo.osVersion` if that field exists in your app state.
185+
- To use Custom code expressions better, it's helpful to understand how FlutterFlow builds your project behind the scenes. You can check the [**State Management**](../../../generated-code/state-mgmt-gen-code.md) page and other **Generated Code** sections to learn how everything is set up.
186+
187+
:::
188+
189+
Here are a couple of examples showing how to access App State and Page State within a Custom code expression:
190+
191+
- **App State Access:** For example, to check if dark mode is enabled using an App State variable:
192+
193+
```jsx
194+
FFAppState().enableDarkMode ? 'Dark Mode On' : 'Light Mode Off'
195+
```
196+
197+
This accesses the global `enableDarkMode` boolean stored in `FFAppState`, and returns a string based on its value.
198+
199+
- **Page and Component State Access:** For example, to access a page or component state variable like `searchText`, you start with `_model.` and then select the variable from the autocomplete suggestions.
200+
201+
```jsx
202+
_model.searchText.isEmpty ? '' : 'Searching for "${_model.searchText}"'
203+
```
204+
205+
This expression checks if the `searchText` variable (defined as a page state) is empty, and returns an appropriate message. The `_model` object refers to the current page’s generated state model.
206+
207+
Here's an example of adding a Custom Code Expression:
208+
209+
<div style={{
210+
position: 'relative',
211+
paddingBottom: 'calc(56.67989417989418% + 41px)', // Keeps the aspect ratio and additional padding
212+
height: 0,
213+
width: '100%'}}>
214+
<iframe
215+
src="https://demo.arcade.software/6RV03v2ByVqRgCTeg3QF?embed&show_copy_link=true"
216+
title=""
217+
style={{
218+
position: 'absolute',
219+
top: 0,
220+
left: 0,
221+
width: '100%',
222+
height: '100%',
223+
colorScheme: 'light'
224+
}}
225+
frameborder="0"
226+
loading="lazy"
227+
webkitAllowFullScreen
228+
mozAllowFullScreen
229+
allowFullScreen
230+
allow="clipboard-write">
231+
</iframe>
232+
</div>
233+
<p></p>
234+
235+
### Execute Custom Code [Action]
236+
237+
To use a Custom Code Expression when triggering actions in FlutterFlow (i.e., inside an Action Flow), you can use the **Execute Custom Code** action. This allows you to run a Dart expression when something happens, such as tapping a button or after a page loads.
238+
239+
![execute-custom-code.avif](img/execute-custom-code.avif)
240+
241+
The Execute Custom Code action can be really helpful in scenarios where the home page is removed early from the navigation stack and standard navigation using the local context may fail. To prevent this, you can [use the global navigator context](../../../ff-concepts/navigation-routing/deep-dynamic-linking.md#using-global-context-to-navigate) inside a code expression.
165242
166243
## Custom Functions
167244
@@ -170,3 +247,18 @@ You can also use custom functions to handle slightly more complex calculations o
170247
:::info
171248
Learn more about [**Custom Functions**](../../../ff-concepts/adding-customization/custom-functions.md).
172249
:::
250+
251+
## FAQS
252+
<details>
253+
<summary>
254+
How is a Custom Code Expression different from an Inline Function?
255+
</summary>
256+
<p>
257+
Custom Code Expression is a more advanced and flexible version of Inline Function.
258+
259+
With Inline Functions, you had to manually pass values as arguments. In contrast, Custom Code Expressions let you directly reference FlutterFlow generated resources (such as `FFAppState()`, `_model`, context, and more) without needing to pass them in.
260+
261+
You can write any valid Dart expression in a Custom code expression, even multi-line logic using anonymous functions. Plus, Custom Code Expressions support real-time autocomplete and inline error validation, making it much easier to discover available variables and avoid mistakes.
262+
263+
</p>
264+
</details>

docs/resources/data-representation/app-state.md

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -114,3 +114,17 @@ Here's a quick guide to updating the app state variable. We need to add an actio
114114
</iframe>
115115
</div>
116116

117+
## FAQs
118+
119+
<details>
120+
<summary>
121+
Why are some variable types not available in App State?
122+
</summary>
123+
<p>
124+
Certain variable types, e.g., **Firestore Documents** and **Supabase Row**, can be used in Page State or Component State, but not in App State. This is because App State variables are designed to be global, meaning they stay in memory throughout the app. When App State variables are marked as persisted, the variable’s value is saved to the device’s local storage.
125+
126+
Storing large or complex data types like documents in App State could lead to **performance or size issues**, especially on lower-end devices. For this reason, FlutterFlow limits App State to lightweight types, while Page/Component State allows for more flexibility since their scope is smaller and temporary.
127+
128+
If you need to work with such data types, it's recommended to store them in Page or Component state instead.
129+
</p>
130+
</details>

docs/resources/data-representation/custom-data-types.md

Lines changed: 36 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,42 @@ When naming custom data types, always use **UpperCamelCase**, as recommended by
6868

6969
## Accessing Custom Data Type
7070

71-
After creating the custom data type, you can use it to create variables, such as an app state variable, and then access them. Here's an [example](app-state.md#app-state-variables).
71+
After creating a custom data type, it’s treated internally as a [Dart class](https://dart.dev/language/classes). However, just defining the custom data type doesn’t hold any real data. To work with actual data, such as storing a user profile or a review, you need to create an **instance** of custom data type.
72+
73+
Creating an instance allows you to:
74+
75+
- Assign specific values to each field in your custom data type.
76+
- Store the instance in app state, page state, or pass it between widgets.
77+
- Access individual fields wherever needed.
78+
79+
To create an instance of a custom data type, first you need to [create a state variable](../../ff-concepts/state-management/state-variables.md#creating-state-variables) (of type **Data Type**) that will hold the instance. Then, to create and add the instance to the state variable, open the **Set from Variable** dialog and select **Create Data Type Object > Project Data Type**. Choose the data type you want to use. After that, set values for each of the required fields.
80+
81+
82+
<div style={{
83+
position: 'relative',
84+
paddingBottom: 'calc(56.67989417989418% + 41px)', // Keeps the aspect ratio and additional padding
85+
height: 0,
86+
width: '100%'}}>
87+
<iframe
88+
src="https://demo.arcade.software/qNNwqEm7vrvuWszmhf9R?embed&show_copy_link=true"
89+
title=""
90+
style={{
91+
position: 'absolute',
92+
top: 0,
93+
left: 0,
94+
width: '100%',
95+
height: '100%',
96+
colorScheme: 'light'
97+
}}
98+
frameborder="0"
99+
loading="lazy"
100+
webkitAllowFullScreen
101+
mozAllowFullScreen
102+
allowFullScreen
103+
allow="clipboard-write">
104+
</iframe>
105+
</div>
106+
<p></p>
72107

73108
### Custom Data Type in Custom Code
74109
Sometimes, you might want to access the custom data type in your custom code. Our custom code editor allows you to receive and pass data into a variable of a custom data type. For example, you could manipulate or analyze the data as needed, and then return the modified result in the custom data type.

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

Lines changed: 81 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -105,10 +105,11 @@ Below is a list of available API endpoints with their methods and usage descript
105105

106106
| Endpoint | Method | Purpose |
107107
| --------------------------- | ------ | --------------------------------------------- |
108-
| `/listPartitionedFileNames` | GET | List available YAML file names for a project |
109-
| `/projectYamls` | GET | Export/download YAML files from a project |
110-
| `/validateProjectYaml` | POST | Validate YAML content before applying changes |
111-
| `/updateProjectYaml` | POST | Update project configuration via YAML |
108+
| `/listPartitionedFileNames` | GET | List available YAML file names for a project. |
109+
| `/l/listProjects` | POST | Retrieve metadata for all projects. |
110+
| `/projectYamls` | GET | Export/download YAML files from a project. |
111+
| `/validateProjectYaml` | POST | Validate YAML content before applying changes. |
112+
| `/updateProjectYaml` | POST | Update project configuration via YAML. |
112113

113114

114115
### List File Names
@@ -152,7 +153,83 @@ curl -X GET \
152153
-H 'Authorization: Bearer YOUR_API_TOKEN'
153154
```
154155

156+
### List Projects
155157

158+
This endpoint retrieves a list of FlutterFlow projects associated with your account, including detailed metadata such as project name, owner email, team info, collaboration settings, and versioning data.
159+
160+
#### Endpoint
161+
162+
`POST /l/listProjects`
163+
164+
#### Request Body
165+
166+
```jsx
167+
{
168+
"project_type": "ALL",
169+
"deserialize_response": true
170+
}
171+
```
172+
- **`project_type: "ALL"`**: Use "ALL" to include personal, team, and shared projects, or "TEAM_RESOURCE" to include only team-associated projects.
173+
174+
- **`deserialize_response: true`**: Ensures the response is returned as human-readable JSON instead of a base64-encoded protobuf.
175+
176+
:::tip
177+
It’s recommended to use the default options: `"ALL"` for `project_type` and `true` for `deserialize_response` for the most complete and readable results.
178+
:::
179+
180+
#### Response
181+
182+
Returns a JSON object containing an array of projects under the `entries` key. Each entry contains the project ID and rich metadata, including collaborators, app icons, sessions, and branching information.
183+
184+
```jsx
185+
{
186+
"success": true,
187+
"reason": null,
188+
"value": {
189+
"entries": [
190+
{
191+
"id": "XXXXXXXXXXXXXXX",
192+
"project": {
193+
"name": "Sample Project A",
194+
"ownerEmail": "[email protected]",
195+
"createdAt": "2024-08-08T11:01:12.427Z",
196+
"updatedAt": "2024-08-08T11:01:18.669Z",
197+
"teamRef": {
198+
"path": "teams/TEAM_ID_1"
199+
},
200+
"mainBranchRef": {
201+
"path": "projects/sample-project-id"
202+
},
203+
"numBranches": 2,
204+
"otherMembers": {
205+
"USER_XYZ": {
206+
"email": "[email protected]",
207+
"accessLevel": "EDITOR"
208+
}
209+
},
210+
"activeSessions": {
211+
"SESSION_ID_1": {
212+
"lastSuccessfulUpdate": "2024-08-06T18:41:56.569Z"
213+
}
214+
},
215+
"totalNumUpdates": 2177
216+
}
217+
}
218+
]
219+
}
220+
}
221+
```
222+
223+
#### Example Usage
224+
225+
```jsx
226+
curl 'https://api.flutterflow.io/v2/l/listProjects' \
227+
-H 'authorization: Bearer YOUR_API_TOKEN' \
228+
--data-raw '{
229+
"project_type": "ALL",
230+
"deserialize_response": true
231+
}'
232+
```
156233

157234
### Download Project YAML
158235

docs/resources/ui/widgets/built-in-widgets/tooltip.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -151,7 +151,7 @@ By default, the *Tooltip* appears below the target widget. You can change this s
151151

152152
### Customize tail size
153153

154-
To change the tail's size, you can use the **Tail Width** and **Tail Lenght** properties.
154+
To change the tail's size, you can use the **Tail Width** and **Tail Length** properties.
155155

156156
<div style={{
157157
position: 'relative',
@@ -269,4 +269,4 @@ To change the default duration, move to the **Properties Panel >** set the **Sho
269269
allowFullScreen
270270
allow="clipboard-write">
271271
</iframe>
272-
</div>
272+
</div>
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"label": "Apple Store Deployment"
3+
}
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"label": "Fetching Signing Files"
3+
}

0 commit comments

Comments
 (0)