diff --git a/docs/resources/control-flow/functions/action-flow-editor.md b/docs/resources/control-flow/functions/action-flow-editor.md index 87b85f7f..fe0339eb 100644 --- a/docs/resources/control-flow/functions/action-flow-editor.md +++ b/docs/resources/control-flow/functions/action-flow-editor.md @@ -16,7 +16,7 @@ Designing interactivity involves two steps: 1. Listening for Interaction (**Action Triggers**) 2. Responding to Interaction (**Actions**) -Action Triggers represent a specific event, while Actions are functions executed in response to the +**Action Triggers** represent a specific event, while **Actions** are functions executed in response to the triggered event. Common triggers are: - **On Tap**: Triggered on tapping on a widget or specifically buttons. @@ -30,20 +30,45 @@ Actions are tasks or operations that are performed in response to an event detec The Action Flow Editor is a visual, node-based editor used to configure the functions that run in response to a trigger. This editor simplifies the process of creating and managing business logic. -![Action Flow Editor](../../../../static/img/action-flow-editor.avif) +![Action Flow Editor](img/actions.avif) ### Action Triggers -The **Action Triggers** toolbar, located at the top of the editor, displays a list of available -triggers. Each trigger has its own separate node editor, allowing you to create distinct logic -flows for different events. When you switch between triggers, the node editor updates to display -the logic specific to the selected action trigger. +When you open the Action Flow Editor, no triggers are added by default. To add a trigger, simply search for and select the desired one from the available options. The Action Triggers bar, located at the left of the editor, displays all added triggers. -![Triggers](../../../../static/img/action-flow-editor-triggers.avif) +:::info +To learn more about **Action Triggers** and its types, refer [**here**](action-triggers.md). +::: + +
+ +
+

:::warning[Exposed by FlutterFlow] -Please note that Action Triggers are provided by FlutterFlow and are not user-generated. You can -only work with the ones provided by FlutterFlow. +Please note that Action Triggers are exposed by FlutterFlow and are not user-generated. You can +only work with the ones provided in the Action Flow Editor. ::: Each trigger has its own separate node-editor, allowing you to create distinct logic flows for @@ -57,7 +82,7 @@ specific to the selected trigger. width: '100%' }}> - +![Issues](img/action-errors.avif) ### Action Blocks @@ -229,7 +230,7 @@ The diamond icon in the Action Flow Editor opens a menu where you can create and **Action Blocks** are reusable action flows that can accept parameters and return values, promoting code reusability and modularity. -![action-block.avif](../../../../static/img/action-block.avif) +![action-block.avif](img/action-block-icon.avif) :::tip[Deep Dive on Action Blocks] Learn more about different types of **[Action Blocks](action-blocks.md)** and their scopes. @@ -246,7 +247,7 @@ Here's a quick demo of how you can add an action or multiple sequential actions width: '100%' }}> + +

+ +### Widget Specific Triggers + +Widget specific triggers are available on certain widgets. Here are they: + +- **On Submit**: Triggered on the TextField widget when the user presses "submit" or "done," finalizing text entry. +- **On Page Load**: Available on the page widget, this trigger activates as soon as the page loads, useful for tasks like data fetching or content updates. +- **On Phone Shake**: Specific to the page widget, this trigger responds to physical shaking of the device, commonly used in games for actions like rolling dice. +- **On Selected**: Found on widgets like Dropdowns, CheckboxGroups, Sliders, RadioButtons, ChoiceChips, and RatingBars, this trigger activates upon any change in selection. +- **On Page Swipe**: Available on the PageView widget to trigger actions when the page is swiped. +- **On Toggle**: Available on the ToggleIcon widget, this trigger responds each time the toggle is activated. +- **On Completed, On Change**: Specific to the PinCode widget, these triggers activate when the user completes or alters a pin entry. +- **On Count Changed**: Present in the CountController widget, this trigger responds to changes in the count. + +## Gesture Detector Triggers + +Gesture Detector Triggers enable you to respond to user gestures, such as taps, drags, swipes, and pinches. These triggers are invoked based on specific gestures and allow you to add actions in response to user interactions. For example, the `onDoubleTap` trigger is invoked whenever a user quickly taps twice on a widget, which can be used to toggle a 'like' state or zoom in on content. + +These triggers are accesible when you add an action onto a `Container`. + +### Lifecycle stages + +The lifecycle of gesture triggers involves four key stages: **Start**, **Update**, **End/Stop**, and **Cancel**. These stages dictate how gestures are detected and handled, from the initial interaction to completion or cancellation. Understanding this lifecycle is crucial for building intuitive gesture-based interactions in your app. + +#### Tap Gesture Lifecycle + +Tap gestures have a simpler lifecycle, focusing primarily on detecting taps and whether they complete or get canceled. Here's how the tap lifecycle works: + +1. **Start**: This stage begins when the user places their finger on the screen to initiate a tap. For example: `onTapDown` is triggered when the user touches the screen to start a tap. +2. **End/Stop**: The tap gesture is completed when the user lifts their finger from the screen. For example: `onTapUp` is triggered when the user completes the tap by lifting their finger. +3. **Cancel**: If the user moves their finger too much before lifting it, the tap is canceled, preventing the completion of the action. For example: `onTapCancel` is triggered when a tap gesture is canceled. + +Here’s how the lifecycle flows for tap gestures: + +![tap-gesture-lifecycle](img/tap-gesture-lifecycle.avif) + +#### Drag Gesture Lifecycle + +Drag gestures are more complex, involving continuous tracking of movement across the screen. The drag lifecycle involves the following stages: + +1. **Start**: This stage occurs when the user begins dragging their finger on the screen. For example: `onHorizontalDragStart` is triggered when a horizontal drag is initiated. +2. **Update**: During the drag, the gesture’s movement is tracked, allowing you to capture real-time data like the pointer's position or delta values. For example: `onHorizontalDragUpdate` is triggered as the user drags their finger, enabling the app to track the drag’s progress. +3. **End/Stop**: The drag gesture is completed when the user lifts their finger, finalizing the interaction. For example: `onHorizontalDragEnd` is triggered when the user finishes dragging and lifts their finger off the screen. +4. **Cancel**: If the drag gesture is interrupted before it completes (for instance, by another gesture), it will be canceled. For example: `onHorizontalDragCancel` is triggered if the drag is interrupted before finishing. + +Here’s how the lifecycle flows for drag gestures: + +![lifecycle-stage.avif](img/lifecycle-stage.avif) + +##### Drag Gesture Cancellation + +For drag gestures, lifecycle doesn't always strictly follow the sequence of **Start**, **Update**, **End/Stop**. The **Cancel** stage can occur at any point, even before **End/Stop**, depending on the interaction. This is different from tap gestures because a drag can be canceled after it has started or even while it is being updated. + +For example, If a horizontal drag is interrupted before the drag completes (for example, if another gesture takes precedence), `onHorizontalDragCancel` is triggered instead of `onHorizontalDragEnd`. + +![lifecycle-stage-cancel.avif](img/lifecycle-stage-cancel.avif) + + + +### Available Gesture Detector Triggers + +Below is a complete list of available gesture detector triggers in FlutterFlow to enhance the capabilities of gesture-based interactions. + +- **onDoubleTapCancel**: Triggered when a double-tap gesture is recognized but does not complete successfully. +- **onDoubleTapDown**: Triggered when the user presses down on the screen for the first tap in a double-tap sequence. +- **onForcePressEnd**: Triggered when the user releases a press that exceeds a certain force threshold. +- **onForcePressPeak**: Triggered when the force of a press reaches its peak. +- **onForcePressStart**: Triggered when the user begins pressing with enough force to pass a defined threshold. +- **onForcePressUpdate**: Triggered when the user changes the amount of pressure applied during a press. +- **onHorizontalDragCancel**: Triggered when a horizontal drag gesture is interrupted or canceled. +- **onHorizontalDragDown**: Triggered when the user first touches the screen and initiates a horizontal drag. +- **onHorizontalDragEnd**: Triggered when the user ends a horizontal drag gesture. +- **onHorizontalDragStart**: Triggered when the user begins a horizontal drag gesture. +- **onHorizontalDragUpdate**: Triggered continuously as the user drags horizontally. +- **onLongPressCancel**: Triggered when a long press gesture is recognized but doesn't complete. +- **onLongPressDown**: Triggered when the user first presses down on the screen with the intention of a long press. +- **onLongPressEnd**: Triggered when the user releases a long press. +- **onLongPressMoveUpdate**: Triggered as the user moves their finger while holding down during a long press. +- **onLongPressStart**: Triggered when the long press gesture starts after the user holds down for the required duration. +- **onLongPressUp**: Triggered when the user releases a long press after the hold duration. +- **onPanCancel**: Triggered when a pan gesture (general dragging) is interrupted or canceled. +- **onPanDown**: Triggered when the user first touches the screen with the intention of panning. +- **onPanEnd**: Triggered when the user ends a pan gesture. +- **onPanStart**: Triggered when the user begins a pan gesture. +- **onPanUpdate**: Triggered continuously as the user drags their finger across the screen. +- **onScaleEnd**: Triggered when the user ends a scaling gesture, such as pinch-to-zoom. +- **onScaleStart**: Triggered when the user begins a scaling gesture. +- **onScaleUpdate**: Triggered continuously as the user changes the scale (e.g., zooms in or out). +- **onSecondaryLongPress**: Triggered when the user presses and holds with a secondary pointer (e.g., two-finger press). +- **onSecondaryLongPressCancel**: Triggered when a secondary long press gesture is recognized but does not complete. +- **onSecondaryLongPressDown**: Triggered when the user first touches the screen with a secondary pointer intending to long press. +- **onSecondaryLongPressEnd**: Triggered when the user releases a secondary long press. +- **onSecondaryLongPressMoveUpdate**: Triggered as the user moves a secondary pointer while holding down during a long press. +- **onSecondaryLongPressStart**: Triggered when the secondary long press gesture starts after holding down for the required duration. +- **onSecondaryLongPressUp**: Triggered when the user releases a secondary long press after the hold duration. +- **onSecondaryTap**: Triggered when the user taps with a secondary pointer (e.g., two-finger tap). +- **onSecondaryTapCancel**: Triggered when a secondary tap gesture is recognized but does not complete. +- **onSecondaryTapDown**: Triggered when the user first touches the screen with a secondary pointer intending to tap. +- **onSecondaryTapUp**: Triggered when the user releases the screen after a secondary tap. +- **onTapCancel**: Triggered when a tap gesture is recognized but does not complete successfully. +- **onTapDown**: Triggered when the user first touches the screen with the intention of tapping. +- **onTapUp**: Triggered when the user releases the screen after a tap. +- **onTertiaryLongPress**: Triggered when the user presses and holds with a tertiary pointer (e.g., three-finger press). +- **onTertiaryLongPressCancel**: Triggered when a tertiary long press gesture is recognized but does not complete. +- **onTertiaryLongPressDown**: Triggered when the user first touches the screen with a tertiary pointer intending to long press. +- **onTertiaryLongPressEnd**: Triggered when the user releases a tertiary long press. +- **onTertiaryLongPressMoveUpdate**: Triggered as the user moves a tertiary pointer while holding down during a long press. +- **onTertiaryLongPressStart**: Triggered when the tertiary long press gesture starts after holding down for the required duration. +- **onTertiaryLongPressUp**: Triggered when the user releases a tertiary long press after the hold duration. +- **onTertiaryTapCancel**: Triggered when a tertiary tap gesture is recognized but does not complete successfully. +- **onTertiaryTapDown**: Triggered when the user first touches the screen with a tertiary pointer intending to tap. +- **onTertiaryTapUp**: Triggered when the user releases the screen after a tertiary tap. +- **onVerticalDragCancel**: Triggered when a vertical drag gesture is interrupted or canceled. +- **onVerticalDragDown**: Triggered when the user first touches the screen and initiates a vertical drag. +- **onVerticalDragEnd**: Triggered when the user ends a vertical drag gesture. +- **onVerticalDragStart**: Triggered when the user begins a vertical drag gesture. +- **onVerticalDragUpdate**: Triggered continuously as the user drags vertically. + +### Accessing Gesture Detector Data + +Gesture detectors not only recognize types of gestures but also provide relevant data based on the trigger. For example, the exact location (XY coordinates) where a drag event occurs. + +Examples of using gesture data include: + +- **Custom Slider:** Use the coordinates to update the position of the thumb of a custom slider on its track. +- **Interactive Zoom:** Used the data provided by the scale gesture to appropriately zoom in or out. +- **Dynamic Interfaces:** Create effects that react to touch, like animations that start from where the user taps the screen. + +You can access the Gesture Detector data after adding the relevant gesture detector triggers. Once added, you can retrieve this data via the **Set from Variable** menu inside the **Action Flow Editor**. Depending on your specific needs, you can choose from the following options: + +- **Global Position X**: The x-coordinate of the pointer relative to the left edge of the screen when the gesture was triggered. +- **Global Position Y**: The y-coordinate of the pointer relative to the top edge of the screen when the gesture was triggered. +- **Local Position X**: The x-coordinate of the pointer relative to the left edge of the widget that detected the gesture. +- **Local Position Y**: The y-coordinate of the pointer relative to the top edge of the widget that detected the gesture. +- **Delta X**: The horizontal distance the pointer moved during the gesture. +- **Delta Y**: The vertical distance the pointer moved during the gesture. + +![access-xy-data](img/access-xy-data.png) + +See how to effectively use gesture detector triggers and access XY data in the following example. + +### Example: Swipe to delete cart items + +Let's walk through an example that demonstrates how to implement a "Swipe to Delete" feature for cart items **entirely** using Gesture Detectors. Here's a preview of how it works: + + +
+ +
+

+Here’s how you do it: + +1. First, we create a variable called `offsetX` to track the horizontal drag distance of the cart item. Since the cart item is displayed in a **ListView** and is built as a reusable component, we'll define `offsetX` as a **component state variable**. This ensures that each cart item independently tracks its own drag position. + + ![component-state-variable.avif](img/component-state-variable.avif) + +2. Now, to make the item move as the user drags it, we add a **slide animation** (under **On Action Trigger**) to the Container that holds the item's layout. While configuring the animation, set the **Duration** to 0 and the **Final Position** to the `offsetX` variable. This ensures that the item follows the user's finger as they swipe. + + :::info + We'll trigger this animation every time the user swipes by listening to the `onHorizontalDragUpdate` event (see how to do it in next step). + ::: + + ![add-animation.avif](img/add-animation.avif) + +3. On the main Container, we add the `onHorizontalDragUpdate` action trigger. This will called continuously as the user drags the item horizontally. On this event, we update the `offsetX` variable with the new position based on the swipe movement (using **Delta X** Data) and trigger the animation. This real-time update makes the item slide on the screen. + +
+ +
+

+ +4. Now we need to check if the swipe meets the threshold to delete the item or reset the item's position back to its original location. For that, we add the `onHorizontalDragEnd` trigger. In the `onHorizontalDragEnd` trigger, we check if the `offsetX` value exceeds 100. If it does, we send the item index back to the page or component (via execute callback action) to delete the item from the list. If not, we reverse the slide animation. Lastly, we reset the `offsetX` value to 0 to ensure it's ready for the next interaction. + +
+ +
+

\ No newline at end of file diff --git a/docs/resources/control-flow/functions/conditional-logic.md b/docs/resources/control-flow/functions/conditional-logic.md index 0058ebcf..5fcaa817 100644 --- a/docs/resources/control-flow/functions/conditional-logic.md +++ b/docs/resources/control-flow/functions/conditional-logic.md @@ -4,7 +4,7 @@ title: Conditional Logic description: Learn how to implement conditional logic in your FlutterFlow app to control the flow of actions or generate properties based on certain conditions. tags: [Conditional Logic, Backend Query, Backend Logic, Control Flow, FlutterFlow] -sidebar_position: 3 +sidebar_position: 4 keywords: [Conditional Logic, Backend Query, Backend Logic, Control Flow, FlutterFlow] --- diff --git a/docs/resources/control-flow/functions/img/access-xy-data.png b/docs/resources/control-flow/functions/img/access-xy-data.png new file mode 100644 index 00000000..d045d70b Binary files /dev/null and b/docs/resources/control-flow/functions/img/access-xy-data.png differ diff --git a/docs/resources/control-flow/functions/img/action-block-icon.avif b/docs/resources/control-flow/functions/img/action-block-icon.avif new file mode 100644 index 00000000..fad012bb Binary files /dev/null and b/docs/resources/control-flow/functions/img/action-block-icon.avif differ diff --git a/docs/resources/control-flow/functions/img/action-errors.avif b/docs/resources/control-flow/functions/img/action-errors.avif new file mode 100644 index 00000000..da4afe6d Binary files /dev/null and b/docs/resources/control-flow/functions/img/action-errors.avif differ diff --git a/docs/resources/control-flow/functions/img/action-triggers.avif b/docs/resources/control-flow/functions/img/action-triggers.avif new file mode 100644 index 00000000..017ed3ce Binary files /dev/null and b/docs/resources/control-flow/functions/img/action-triggers.avif differ diff --git a/docs/resources/control-flow/functions/img/actions.avif b/docs/resources/control-flow/functions/img/actions.avif new file mode 100644 index 00000000..00dab30b Binary files /dev/null and b/docs/resources/control-flow/functions/img/actions.avif differ diff --git a/docs/resources/control-flow/functions/img/add-animation.avif b/docs/resources/control-flow/functions/img/add-animation.avif new file mode 100644 index 00000000..072ada4a Binary files /dev/null and b/docs/resources/control-flow/functions/img/add-animation.avif differ diff --git a/docs/resources/control-flow/functions/img/component-state-variable.avif b/docs/resources/control-flow/functions/img/component-state-variable.avif new file mode 100644 index 00000000..22ac3020 Binary files /dev/null and b/docs/resources/control-flow/functions/img/component-state-variable.avif differ diff --git a/docs/resources/control-flow/functions/img/lifecycle-stage-cancel.avif b/docs/resources/control-flow/functions/img/lifecycle-stage-cancel.avif new file mode 100644 index 00000000..883d634c Binary files /dev/null and b/docs/resources/control-flow/functions/img/lifecycle-stage-cancel.avif differ diff --git a/docs/resources/control-flow/functions/img/lifecycle-stage.avif b/docs/resources/control-flow/functions/img/lifecycle-stage.avif new file mode 100644 index 00000000..b325ef1f Binary files /dev/null and b/docs/resources/control-flow/functions/img/lifecycle-stage.avif differ diff --git a/docs/resources/control-flow/functions/img/tap-gesture-lifecycle.avif b/docs/resources/control-flow/functions/img/tap-gesture-lifecycle.avif new file mode 100644 index 00000000..d16b6b09 Binary files /dev/null and b/docs/resources/control-flow/functions/img/tap-gesture-lifecycle.avif differ diff --git a/docs/resources/control-flow/functions/img/widget-binding.avif b/docs/resources/control-flow/functions/img/widget-binding.avif new file mode 100644 index 00000000..d9ad4c96 Binary files /dev/null and b/docs/resources/control-flow/functions/img/widget-binding.avif differ diff --git a/docs/resources/control-flow/functions/loops.md b/docs/resources/control-flow/functions/loops.md index 72147031..5b112ad9 100644 --- a/docs/resources/control-flow/functions/loops.md +++ b/docs/resources/control-flow/functions/loops.md @@ -3,7 +3,7 @@ slug: /resources/functions/loops title: Loops description: Learn how to implement loops in your FlutterFlow app to iterate over data and perform repeated actions. tags: [Loops, Backend Query, Backend Logic, Control Flow, FlutterFlow] -sidebar_position: 4 +sidebar_position: 5 keywords: [Loops, Backend Query, Backend Logic, Control Flow, FlutterFlow] --- diff --git a/docs/resources/control-flow/functions/utility-actions.md b/docs/resources/control-flow/functions/utility-actions.md index 1fce8adb..f1daf252 100644 --- a/docs/resources/control-flow/functions/utility-actions.md +++ b/docs/resources/control-flow/functions/utility-actions.md @@ -3,7 +3,7 @@ slug: /resources/functions/utility-actions title: Utility Actions description: Learn about the built-in utility Actions available in FlutterFlow to enhance your app's UI logic. tags: [Functions] -sidebar_position: 5 +sidebar_position: 6 keywords: [Built-in Functions, Backend Query, Backend Logic, Control Flow, FlutterFlow, pub.dev] --- import Tabs from '@theme/Tabs'; diff --git a/docs/resources/imgs/import-specific-library-version.avif b/docs/resources/imgs/import-specific-library-version.avif new file mode 100644 index 00000000..c9c796ca Binary files /dev/null and b/docs/resources/imgs/import-specific-library-version.avif differ diff --git a/docs/resources/projects/imgs/access-library-resources.avif b/docs/resources/projects/imgs/access-library-resources.avif new file mode 100644 index 00000000..fdb6c578 Binary files /dev/null and b/docs/resources/projects/imgs/access-library-resources.avif differ diff --git a/docs/resources/projects/imgs/dependency-conflict.avif b/docs/resources/projects/imgs/dependency-conflict.avif new file mode 100644 index 00000000..e4515d49 Binary files /dev/null and b/docs/resources/projects/imgs/dependency-conflict.avif differ diff --git a/docs/resources/projects/imgs/libraries.avif b/docs/resources/projects/imgs/libraries.avif new file mode 100644 index 00000000..0ba5d2a6 Binary files /dev/null and b/docs/resources/projects/imgs/libraries.avif differ diff --git a/docs/resources/projects/imgs/update-library.avif b/docs/resources/projects/imgs/update-library.avif new file mode 100644 index 00000000..7939a2b6 Binary files /dev/null and b/docs/resources/projects/imgs/update-library.avif differ diff --git a/docs/resources/projects/libraries.md b/docs/resources/projects/libraries.md new file mode 100644 index 00000000..90cfd671 --- /dev/null +++ b/docs/resources/projects/libraries.md @@ -0,0 +1,206 @@ +--- +slug: libraries +title: Libraries +tags: [Libraries] +keywords: [Libraries, Share, Reuse, Collaborate, Modularize, Dependency] +description: Learn how to share and reuse entire FlutterFlow projects using libraries. +sidebar_position: 6 +--- +import Tabs from '@theme/Tabs'; +import TabItem from '@theme/TabItem'; + +# Libraries + +In FlutterFlow, a project can either be used to create an App or used to create a Library. A library allows you to share and reuse resources created in FlutterFlow across multiple projects. More specifically, with libraries, you can publish components, API calls, custom code, and more - all with version control. By using libraries, development becomes more efficient and scalable. + +Imagine you're building an e-commerce app, and different teams are working on various features. One team develops a complex payment system. By using libraries, they can publish the payment system as a reusable library and allow other teams to easily import and integrate it into multiple projects without duplicating development efforts. + +![libraries.avif](imgs/libraries.avif) + +:::tip[possible usecases] + +- **Modular Development**: Build large-scale apps by separating them into smaller, independently managed projects (e.g., UI library, backend integrations, etc.). +- **Team Collaboration**: Share reusable UI components, custom functions, or API integrations across multiple apps +- **Community Sharing**: Publish libraries that can be imported and reused by the broader FlutterFlow community - like UI Kits or utility functions. + +::: + +### What’s Included When Importing a Library + +When you import a library into a FlutterFlow project, the following resources are accessible for use: + +- [Components](../resources/ui/components/intro-components.md) +- [Data Types & Enums](../resources/data-representation/custom-data-types.md) +- [App State Variables](../resources/data-representation/app-state.md) +- [Constants](../resources/data-representation/constants.md) +- [API Endpoints](../resources/control-flow/backend-logic/api/rest-api.md) +- [Action Blocks](../resources/control-flow/functions/action-blocks.md) +- [Custom Functions](../ff-concepts/adding-customization/custom-functions.md), [Actions](../resources/control-flow/functions/action-flow-editor.md), and [Widgets](../resources/ui/widgets/intro-widgets.md) +- [Assets](../resources/projects/settings/general-settings.md#app-assets) (Note: These are not versioned) + +:::note + +Pages and Firestore Collections are still being worked on and may come in future updates. + +::: + +## Publishing a Library + +To publish a project as a library, start by creating a FlutterFlow project as you normally would. Next, go to the **Publish as a Library** page in **App Settings**. Here you can specify the version number and message for the version you are publishing. + +
+ +
+

+ +:::info +- You can only publish libraries if you have access to branching, which is available to Pro+ users. +- Libraries can only be published from the main branch, and each published version is linked to a specific commit, ensuring robust version control. +- You must commit your changes before publishing a new version of the library. +- It's recommended to include a message that tells users what has changed in the version your are publishing. +::: + +## Importing a Library + +To import a library project into another FlutterFlow project, you must go to the **Project Dependencies** page in **App Settings**. Here you can specify the library project and version you are importing. + +
+ +
+

+ +:::info + +- You can only select a library if you have at least read access on the library project. +- For a library project to show in the drop down, you must be added as a collaborator on the project and the library project must have a published version. +- You can import publicly accessible libraries by specifying the project ID in the text field when adding a library dependency. +- By default, the latest published version of the library is imported, but you can choose to depend on an earlier version if needed. +- You can also import the `current` version of the library to use the latest state of the library on the main branch - however, this is not recommended. +- You must have a paid plan to import a library. + +::: + + +You can easily upgrade to newer versions of the libraries as they become available. If a new update causes issues with your existing implementation, you also have the option to revert to a previous version. + +![update-library.avif](imgs/update-library.avif) + +## Access Library Resources + +Once the library is imported, components and resources are accessible within the project. It's important to note that these resources show up where they are instantiated. For example: + +- **Components** appear in the widget palette. +- **API calls** appear when making API calls in the action flow editor. +- **App State variables** appear where you can update app state in an action or leverage app state in a widget property. +- **Custom functions** are available when setting up actions or functions within the app. + +This ensures that only relevant resources are shown where they are needed, optimizing performance and discoverability. + +![access-library-resources.avif](imgs/access-library-resources.avif) + + +### Manage Dependency Conflict while Import + +A **Dependency Conflict** occurs when two or more libraries added by a project depend on different versions of the same dependency. This creates a situation where the project cannot resolve which version to use, leading to a project error. + +![dependency-conflict.avif](imgs/dependency-conflict.avif) + +Let's say you are building an eCommerce app that uses multiple libraries for different purposes: + +- **User Auth Library** is used for handling user authentication. +- **Payment Gateway Library** is used for managing the payment gateway. + +Both library projects depend on a common library called **Components Library** but imports different versions respectively: + +- **User Auth Library** depends on `Components Library v1.5.0`. +- **Payment Gateway Library** depends on `Components Library v2.0.0`. + +In this scenario, the eCommerce project will detect the dependency conflict because it can't add both `v1.5.0` and `v2.0.0` of the Components Library at the same time. + +#### Fixing Dependency Conflicts + +Follow these steps to ensure both libraries rely on the same version of Components Library: + +1. **Upgrade both libraries**: If updates are available, start by upgrading both the User Auth Library and Payment Gateway Library to their latest versions. Often, newer versions of libraries are designed to use the latest version of the Components Library, which can help resolve conflicts. +2. **Modify Libraries**: If you have access to the library projects, adjust the dependencies of either User Auth Library or Payment Gateway Library (or both) to use the same version of the Components Library. +3. **Contact Library Maintainers**: If you do not own the library yourself, reach out to the maintainers of the library projects. They may provide guidance, suggest workarounds, or release a version that addresses the conflict. + + +## FAQs + +
+What will happen to existing team libraries? +

+Team code and API libraries will be migrated to library Projects. These projects will be imported as a library with the latest version specified as the version. The components within team design systems will move into their own projects, while design systems will continue to exist but only containing the theme settings. +

+
+ +
+Will libraries work with Marketplace? +

+We plan to allow users to import a marketplace project as a library, making it easier to integrate marketplace resources into your projects. +

+
+ +
+How do libraries work with themes? +

+The parent project's design system takes precedence over the imported library's design system. For example, if a library uses the standard FlutterFlow color scheme, the values defined in the parent project will override those in the library. However, if the library project has a custom color that the parent project does not have, it will be used as-is in the parent project. +

+
+ +
+How are API keys shared? +

+We're working on Library Values, which will allow users to set specific values when they import a library. This feature will be available soon. +

+
+ +
+How does nested dependencies work? +

+Projects can import libraries that themselves have imported other Libraries as dependencies. However, if the project and the library share the same dependency, the version must match exactly to avoid conflicts. +

+
\ No newline at end of file diff --git a/docs/resources/projects/settings/project-setup.md b/docs/resources/projects/settings/project-setup.md index 0961f026..f5a58ff5 100644 --- a/docs/resources/projects/settings/project-setup.md +++ b/docs/resources/projects/settings/project-setup.md @@ -2,7 +2,7 @@ slug: project-setup title: Project Setup tags: [Setup, Permissions, Multiple Languages] -keywords: [permission message, enabling platforms, support multiple languages, adding custom permissions, walkthrough] +keywords: [permission message, enabling platforms, support multiple languages, adding custom permissions, walkthrough, development environments] description: Learn how to setup your project in FlutterFlow. sidebar_position: 0 --- @@ -532,4 +532,5 @@ To resolve this, simply add a delay ([Wait](../../../resources/control-flow/time

We are aware of a limitation where widgets that are not visible on a page (i.e., you need to scroll down to see them) may not be highlighted. We are actively working to resolve this issue. As a temporary workaround, you can try placing the widget in an area that is visible without scrolling. We appreciate your patience and hope to have a fix soon!

- \ No newline at end of file + + diff --git a/docs/resources/ui/components/built-in-components/_category_.json b/docs/resources/ui/components/built-in-components/_category_.json deleted file mode 100644 index 8a9ccc22..00000000 --- a/docs/resources/ui/components/built-in-components/_category_.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "label": "Built-in Components", - "position": 4 -} \ No newline at end of file diff --git a/docs/resources/ui/components/built-in-components/img.png b/docs/resources/ui/components/built-in-components/img.png deleted file mode 100644 index fd0e18ac..00000000 Binary files a/docs/resources/ui/components/built-in-components/img.png and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/img_1.png b/docs/resources/ui/components/built-in-components/img_1.png deleted file mode 100644 index ca1f9af3..00000000 Binary files a/docs/resources/ui/components/built-in-components/img_1.png and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/img_2.png b/docs/resources/ui/components/built-in-components/img_2.png deleted file mode 100644 index ec0e1790..00000000 Binary files a/docs/resources/ui/components/built-in-components/img_2.png and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/imgs/changing-blur-strength.webp b/docs/resources/ui/components/built-in-components/imgs/changing-blur-strength.webp deleted file mode 100644 index e3e480c7..00000000 Binary files a/docs/resources/ui/components/built-in-components/imgs/changing-blur-strength.webp and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/imgs/img.png b/docs/resources/ui/components/built-in-components/imgs/img.png deleted file mode 100644 index 8789c54b..00000000 Binary files a/docs/resources/ui/components/built-in-components/imgs/img.png and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/imgs/img_1.png b/docs/resources/ui/components/built-in-components/imgs/img_1.png deleted file mode 100644 index 528d3759..00000000 Binary files a/docs/resources/ui/components/built-in-components/imgs/img_1.png and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/imgs/img_2.png b/docs/resources/ui/components/built-in-components/imgs/img_2.png deleted file mode 100644 index a0ee1ea6..00000000 Binary files a/docs/resources/ui/components/built-in-components/imgs/img_2.png and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/imgs/img_3.png b/docs/resources/ui/components/built-in-components/imgs/img_3.png deleted file mode 100644 index 6e56d965..00000000 Binary files a/docs/resources/ui/components/built-in-components/imgs/img_3.png and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/imgs/img_4.png b/docs/resources/ui/components/built-in-components/imgs/img_4.png deleted file mode 100644 index 64e59f49..00000000 Binary files a/docs/resources/ui/components/built-in-components/imgs/img_4.png and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/imgs/show-hide-blur.webp b/docs/resources/ui/components/built-in-components/imgs/show-hide-blur.webp deleted file mode 100644 index aade7f08..00000000 Binary files a/docs/resources/ui/components/built-in-components/imgs/show-hide-blur.webp and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/imgs/styling-selected-date.png b/docs/resources/ui/components/built-in-components/imgs/styling-selected-date.png deleted file mode 100644 index d66ce946..00000000 Binary files a/docs/resources/ui/components/built-in-components/imgs/styling-selected-date.png and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/imgs/styling-unselected-date.png b/docs/resources/ui/components/built-in-components/imgs/styling-unselected-date.png deleted file mode 100644 index 48699393..00000000 Binary files a/docs/resources/ui/components/built-in-components/imgs/styling-unselected-date.png and /dev/null differ diff --git a/docs/resources/ui/components/callbacks.md b/docs/resources/ui/components/callbacks.md new file mode 100644 index 00000000..0feeecaf --- /dev/null +++ b/docs/resources/ui/components/callbacks.md @@ -0,0 +1,55 @@ +--- +title: Action Parameters (Callbacks) +sidebar_position: 4 +--- + +# Action Parameters (Callbacks) + +In FlutterFlow, callbacks are a way to pass down actions from parent entities (like pages or other +components) to child entities (such as custom widgets or components). This allows the parent to +define specific behaviors that the child entity should execute when certain events occur. + +It enables dynamic and interactive behavior in child components, allowing them to perform actions +defined by the parent, such as navigation, data updates, or displaying dialogs. + +:::tip[Benefits of Using Callbacks in FlutterFlow] + +- **Modularity:** Separate the logic of what happens when an event occurs from the child component, + making your component widget more modular and reusable. +- **Reusability:** Use the same child component in different contexts with different behaviors, + simply by passing different callbacks. + ::: + + +## Creating a Callback Parameter +In order to create a component that will execute a callback, you must create a component with a parameter of type Action. + +When you create an action parameter, you can also specify parameters that will get passed into the action. For example, +you might have a button that allows your app to add an item to a user's cart. + +You can create a parameter called `onAddToBag` which represents the action that will be executed when the button is tapped. + +The action that will be executed will likely need to know which item is being added to the cart. So, you can also specify an action parameter - +`item`. Now, the page or component that leverages this button can use this parameter in its own action flow. You can see an example of that below. + +![action-parameters.png](imgs/action-parameters.png) + +## Executing a Callback + +You can execute the action that is passed into the component by using the **Execute Callback** action in the component's action flows. + +For example, you may want to execute the above callback when the button is tapped. + +![execute-callback.png](imgs/execute-callback.png) + +## Passing in an Action to a Component + +When you add a component to the widget tree of a page or another component, you can set values for its parameters. + +This holds true for action parameters as well. For example, when you create an instance of the button component mentioned above, you can specify the action flows that should be used when the callback is executed. + +![execute-callback.png](imgs/set-action-callback.png) + + + + diff --git a/docs/resources/ui/components/component-lifecycle.md b/docs/resources/ui/components/component-lifecycle.md index 64fa62b7..4140954e 100644 --- a/docs/resources/ui/components/component-lifecycle.md +++ b/docs/resources/ui/components/component-lifecycle.md @@ -1,10 +1,10 @@ --- -title: Component Lifecycle +title: Component Actions & Lifecycle sidebar_position: 3 toc_max_heading_level: 5 --- -# Component Lifecycle +# Component Actions & Lifecycle In FlutterFlow, knowing component lifecycle is crucial for managing state and optimizing your app's performance. @@ -66,6 +66,11 @@ setup tasks are re-executed. For dynamically generated components, such as those a query, each instance will trigger the actions under `On Initialization` action trigger when it is created. +### On Shortcut Press [Action Trigger] + +Your component can also respond to certain keypress events. For more details on setting this up, see [this section on +keyboard shortcuts](/resources/ui/pages/page-lifecycle#on-shortcut-press-action-trigger). + ## Component state :::note[STATE VARIABLES] diff --git a/docs/resources/ui/components/creating-components.md b/docs/resources/ui/components/creating-components.md index 193fd029..babea309 100644 --- a/docs/resources/ui/components/creating-components.md +++ b/docs/resources/ui/components/creating-components.md @@ -5,16 +5,17 @@ slug: creating-components keywords: [Custom Components] tags: [Components] --- +import setComponentParam from '@site/static/img/set-component-parameter.png'; +import levComponentParam from '@site/static/img/leverage-component-parameter.png'; # Components -Custom Components or just user-defined Components in FlutterFlow are custom widgets you create to meet specific needs in your app. These components can be designed using FlutterFlow's drag-and-drop interface, allowing you to -create reusable UI elements. This approach ensures consistency, saves +Components are reusable widgets you create to meet the specific needs of your app. This approach ensures consistency, saves time, and simplifies maintenance across your project. ## Creating a component from scratch -To create a component from scratch, you can do the following: +To create a component from scratch, click the **Add Button** in the **Page Selector** or **Widget Tree** tab. Then choose **New Component.**
+ +
+ +### Bind the Parameter + +Once you have created a component parameter, you can link data from the parent entity to your +component. + +Here's a small example of how we can bind the parameters created in `ProfileListItem` to their +respective widgets and action triggers. + +
+ +
+ + +Aside from standard data types used throughout FlutterFlow, you can also create parameters that are of type: + +- **Action (callback)**: This allows component users to pass in actions into the component. The component can then invoke the action, usually referred to as a callback, in its own action flows. Callbacks are often using to handle events, like updating a parent's state when a button has been pressed. [You can learn more about how to use callbacks here.](/resources/ui/components/callbacks) + +- **Widget Builders**: Widget builders allow the component users to pass in widgets to be used within the component's widget tree. This is especially useful when you want users to dynamically subsitute content for some part of a component - like displaying an item in a custom dropdown, or creating a component for some consistent layout. [You can learn more about how to use Widget Builders here.](/resources/ui/components/widget-builder-parameters) -:::info -Learn [**how to add a component to an entity,**](using-components.md) such as a page or another -component, and how to pass parameters. -::: ### Actions diff --git a/docs/resources/ui/components/imgs/action-parameters.png b/docs/resources/ui/components/imgs/action-parameters.png new file mode 100644 index 00000000..c2c99073 Binary files /dev/null and b/docs/resources/ui/components/imgs/action-parameters.png differ diff --git a/docs/resources/ui/components/imgs/execute-callback.png b/docs/resources/ui/components/imgs/execute-callback.png new file mode 100644 index 00000000..d86059c4 Binary files /dev/null and b/docs/resources/ui/components/imgs/execute-callback.png differ diff --git a/docs/resources/ui/components/imgs/preview-component.png b/docs/resources/ui/components/imgs/preview-component.png new file mode 100644 index 00000000..d8a7bc36 Binary files /dev/null and b/docs/resources/ui/components/imgs/preview-component.png differ diff --git a/docs/resources/ui/components/imgs/set-action-callback.png b/docs/resources/ui/components/imgs/set-action-callback.png new file mode 100644 index 00000000..ee9fadf9 Binary files /dev/null and b/docs/resources/ui/components/imgs/set-action-callback.png differ diff --git a/docs/resources/ui/components/imgs/widget-builder-as-parameter-example.avif b/docs/resources/ui/components/imgs/widget-builder-as-parameter-example.avif new file mode 100644 index 00000000..907f950a Binary files /dev/null and b/docs/resources/ui/components/imgs/widget-builder-as-parameter-example.avif differ diff --git a/docs/resources/ui/components/intro-components.md b/docs/resources/ui/components/intro-components.md index c2a474b5..eddb18bf 100644 --- a/docs/resources/ui/components/intro-components.md +++ b/docs/resources/ui/components/intro-components.md @@ -6,13 +6,13 @@ slug: /resources/ui/components # Components -Components in FlutterFlow are reusable widgets. You design the widget once and utilize throughout your app -to save time, ensure consistency, and simplify maintenance. +Components in FlutterFlow are reusable widgets. You design the widget once and can use it throughout your app +to save time, ensure consistency, and make it easier to maintain. Components help in the following ways: - **Consistency:** Components provide a consistent look and behavior, reducing the likelihood of - discrepancies that can occur when the same UI elements are recreated multiple times. + discrepancies that can occur when the same UI elements are created multiple times. - **Centralized Updates:** By creating a component once and reusing it across different parts of your app, you ensure that any design or functionality changes are made in @@ -40,26 +40,6 @@ Components help in the following ways: Leveraging components effectively helps you build a consistent, efficient, and maintainable app. -## Types of Components in FlutterFlow - -- **Built-in Components:** FlutterFlow - includes a variety of built-in pre-defined widgets that - serve as ready-made components, such as the `CreditCard` or `Signature` widget. These are - out-of-the-box solutions provided by FlutterFlow that can be directly integrated into any project - to offer specific functionalities. - -- **[Custom Components](creating-components.md)**: You can also build your own - components by assembling multiple widgets using FlutterFlow’s drag-and-drop interface. This method involves strategically positioning atomic widgets such as `TextField`, `Button`s, or `Image`s, etc within the molecular - widgets like `Row`, `Column`, or `Stack` to create a combined widget that serve a specific - function, like a `LoginComponent` or a `SearchBar`. - -- **[Custom Widgets](../../../ff-concepts/adding-customization/custom-widgets.md)**: For scenarios where more complex functionalities are required, FlutterFlow - allows you to develop their own Custom Widgets. This involves writing Flutter code from - scratch, offering the highest level of customization and flexibility. - -- **[Themed Widgets](../../../ff-concepts/design-system/design-system.md#theme-widgets)**: Themed widgets can be reused across your app, making it easy to update styles - universally. If you decide to change any properties, such as color schemes or fonts, you can - update the theme widget instead of modifying each widget individually. ## Common Use-cases diff --git a/docs/resources/ui/components/using-components.md b/docs/resources/ui/components/using-components.md index 234c8014..69693e0f 100644 --- a/docs/resources/ui/components/using-components.md +++ b/docs/resources/ui/components/using-components.md @@ -5,114 +5,16 @@ sidebar_position: 2 # Using Components -Components in FlutterFlow can be added to either a page or another component. They help streamline +Components in FlutterFlow can be added to the widget tree of a page or another component. They help streamline development by allowing you to reuse design and functionality throughout your app. Components can -accept parameters, making them adaptable to specific contexts. Additionally, you can use callbacks -to pass actions from parent entities to child components, enabling dynamic and interactive behavior. +accept parameters, making them adaptable to specific contexts. Additionally, you can use [callbacks](/resources/ui/components/callbacks) +to pass actions from parent entities to child components, enabling dynamic and interactive behavior. You can also use [widget builders](/resources/ui/components/widget-builder-parameters) to subsitute dynamic content into the component's widget tree. -## Callbacks +To learn more about creating components, see [this page](/resources/ui/components/creating-components). -In FlutterFlow, callbacks are a way to pass down actions from parent entities (like pages or other -components) to child entities (such as custom widgets or components). This allows the parent to -define specific behaviors that the child entity should execute when certain events occur, ensuring -modular and reusable code. - -It enables dynamic and interactive behavior in child components, allowing them to perform actions -defined by the parent, such as navigation, data updates, or displaying dialogs. - -:::tip[Benefits of Using Callbacks in FlutterFlow] - -- **Modularity:** Separate the logic of what happens when an event occurs from the child component, - making your component widget more modular and reusable. -- **Reusability:** Use the same child component in different contexts with different behaviors, - simply by passing different callbacks. - ::: - - -### Execute Callback [Action] - -Using this action, you can execute any action passed as a parameter to the component. This is -particularly useful for triggering actions defined in a parent page (outside the component) from -within a widget inside the component. For example, you can pass a navigation action from the page to -a button component, allowing the button to trigger the navigation action when clicked. - -## Component Parameters - -Component parameters are values that a component receives from its parent entity, such as a page or -another component. These parameters allow the component to be dynamic and adaptable based on the -context in which it is used. By using parameters, you can customize components for different -scenarios without altering the base design or functionality. - -### To add a Parameter - -You can choose to pass primitive data, a custom data type object, or an action for the component to -execute. To add a parameter, select the component and follow the steps below: - -
- -
- -### Bind the Parameter - -Once you have created a component parameter, you can link data from the parent entity to your -component. - -Here's a small example of how we can bind the parameters created in `ProfileListItem` to their -respective widgets and action triggers. - -
- -
- -## To add a Component to Page - -To add a component to a Page, choose the Page where you want to add the new component, and follow -the steps: +## To add a Component to a Widget Tree +To add a component to thr widget tree of a page or another component, choose the parent entity where you want to add the new component. Next, you can see the component appear in the widgete palette, under the **Components** section.
-### Pass down values +### Specify Parameter Values -In FlutterFlow, each component instance can receive unique values from its parent entity, allowing -for dynamic and context-specific customization. This process involves passing parameters from the -parent entity (such as a page or another component) to the component, ensuring that each instance -can adapt to different data and behavior. +In FlutterFlow, each component instance can receive unique values from its parent entity. +When you add a component to the widget tree, you can set the parameter values by clicking on the instance of the component and going to the **Property Panel.**
- ## Recursive Components -You can create a recursive component, meaning the component can include an instance of itself within its own widget tree. Using the recursive component, you can build complex and dynamic user interfaces. +You can create a recursive component, meaning the component can include an instance of itself within its own widget tree. This is especially useful for nested content. For example, in social media applications or forums, comments can have replies, and each reply can have further replies. A recursive component can display this nested structure effectively. diff --git a/docs/resources/ui/components/widget-builder-parameters.md b/docs/resources/ui/components/widget-builder-parameters.md new file mode 100644 index 00000000..ffe5cd4a --- /dev/null +++ b/docs/resources/ui/components/widget-builder-parameters.md @@ -0,0 +1,155 @@ +--- +title: Widget Builder Parameters +sidebar_position: 5 +slug: widget-builder +--- + +# Widget Builder Parameters + +Sometimes, you want to create a component that offers some consistent design, while also allowing for customization. This is where passing widget builder as parameters becomes valuable. + +Widget builder parameters allow component authors to subsitute in dynamic content within the widget tree of the component. This means that when someone uses the component, they can dynamically pass in pieces of UI to be used within the component. + +For example, consider a custom dropdown component. While the overall structure of the dropdown remains the same, you might need to change the style or content of the dropdown items based on different use cases. By passing the dropdown item widget as a parameter, you can use the dropdown's appearance and behavior without creating new components for each variation. + +:::tip[possible use casses] +- **Custom Cards**: Imagine you need to display product cards in an e-commerce app. You can build a reusable card component with parameters for the image, header, content, and call-to-action button. This card can be reused across multiple pages but with different content. +- **Dynamic Forms**: Build a form component where different fields (TextFields, Dropdowns, or Checkboxes) are passed in as parameters. This allows you to reuse the same form structure but adapt to various input fields. +- **Modular Layouts**: Create a consistent layout structure with areas like headers and footers that remain the same while passing in different body content as parameters to adapt to different pages. +::: + +Let’s see an example from an eCommerce app. On the shipping address page, you may want to maintain a consistent design for the various input fields (where the user can specify their name, email, etc). However, you may want to allow some customization different inputs - for example, you want to use a `TextField` to allow the user to type their name, and a `DropDown` to allow the user to select their country. + +![widget-builder-as-parameter-example.avif](imgs/widget-builder-as-parameter-example.avif) + +## Creating Widget Builders as Parameters + +To create a component with a widget builder as a parameter, use the steps outlined below. + +### Create a Parameter of Type Widget Builder +Create a new component and add the base widgets that will be unmodified. Next, define a parameter and set its type to **Widget Builder**. To [pass data from the current component to the widget builder](#pass-parameter-from-component-to-widget-builder), you can specify a parameter for the widget builder. + +
+ +
+

+ +### Add the Widget Builder to the Widget Tree +Add the widget builder placeholder into the desired spot in the component’s widget tree where the dynamic element should appear. Widget Builders appear in the **Components** section of the **Widget Palette** when adding a widget to the widget tree. + +
+ +
+

+ +### Pass Parameters to the Widget Builder + +Sometimes, you need to pass data from the component to the widget builder. For example, on the shipping address page, you might want the hint text in an input field to change depending on some configuration. In this case, you can pass the hint as a parameter into the widget builder. +Here’s how you do it: + +
+ +
+

+ +#### Preview the Widget Builder using Different Components +You can select different components to use as a preview while building the component that has a widget builder parameter. + +To select a component to use in the preview, select the Widget Builder, then go to the **Widget Builder UI Properties** section of the **Property Panel**. + +![preview-component.png](imgs/preview-component.png) + +## Using Components with Widget Builders as Parameters +When you use a component that has a widget builder as a parameter, you can pass in [components](/resources/ui/components) to customize the content according to your needs. + +In this example, we create two additional components for `TextField` and `Dropdown` — and pass them as widget builders. + +
+ +
+

+ diff --git a/docs/resources/ui/pages/page-lifecycle.md b/docs/resources/ui/pages/page-lifecycle.md index fb3bac25..d16ba8d0 100644 --- a/docs/resources/ui/pages/page-lifecycle.md +++ b/docs/resources/ui/pages/page-lifecycle.md @@ -1,5 +1,5 @@ --- -title: Page Lifecycle +title: Page Actions & Lifecycle slug: page-lifecycle sidebar_position: 5 toc_max_heading_level: 5 @@ -29,13 +29,10 @@ In FlutterFlow, most of these lifecycle phases are handled internally by Flutter However, we expose some of the methods so that you, as a developer, can decide what additional configurations to load upon initialization and when to re-render the UI based on interactions. -Let's read more about them in the following sections: -## Initialization Action Triggers +## Page-Level Action Triggers -During the initialization of a **Page**, we provide several **[Action Triggers](../../control-flow/functions/action-flow-editor.md#action-triggers)** that assist you in -loading resources or initializing data. These triggers ensure that all necessary data is prepared -and ready for use by the time the first frame of the **Page** is rendered. +There are several **[Action Triggers](../../control-flow/functions/action-flow-editor.md#action-triggers)** that are accessible at the root-level of a page. :::info[What are Action Triggers?] **Action Triggers** serve as event listeners or handlers that respond to @@ -72,7 +69,6 @@ loads. certain UI elements on the page. ::: -#### Adding an Action To add an action to **On Page Load** action trigger, follow the steps: @@ -96,6 +92,64 @@ trigger specific actions in response to a phone shake gesture. fields, or return to the app's home screen. ::: +### On Shortcut Press [Action Trigger] + +This action trigger allows you to bind keyboard shortcuts to actions. This is incredibly helpful for improving accessibility and enhancing user experience, especially in web and desktop apps. + +:::tip[Possible usecases] + +- **Create New Issues in Project Management Apps:** In project management apps like Linear, users can press `C` to quickly open a form for creating a new issue or task. +- **Form Submission:** Users can press a key combination (e.g., `Ctrl + Enter`) to submit a form. +- **Navigating Between Pages:** Use shortcuts like `Ctrl + Right Arrow` to navigate between pages without using the mouse. +::: + +:::info[important] +- When a keyboard shortcut is created at the page level, it won't trigger if a TextField is in focus, and you also won’t be able to type the shortcut key into the TextField. +- When a keyboard shortcut is created at the component level, it also won't trigger if a TextField is in focus, but you’ll still be able to type the shortcut key into the TextField. +- **To avoid conflicts, it's recommended to use shortcuts that users are unlikely to type, such as Command + S, instead of a single key like 'S'.** +- There’s currently a known issue with Flutter's autofocus functionality. If a TextField inside a component has autofocus enabled, and the component has a keyboard shortcut, the TextField will not autofocus as expected. +::: + + +Implementing keyboard shortcuts is a straightforward process in FlutterFlow. You can define as many shortcuts as you want, each mapped to specific actions that will trigger when the corresponding key combination is pressed. Let’s see an example of an eCommerce web app where users can quickly access the cart page by pressing the `C` key. + + +To create a shortcut, use the **On Shorcut Press** action trigger, then type the keys that you want your app to listen for. + +
+ +
+

+ +:::warning[Keyboard Shorcuts & Text Fields] +When implementing keyboard shortcuts on a page or component with a text field, you may need to ensure the text field ignores those shortcuts. + +For instance, if you have a shortcut assigned to the letter "C" and a user tries to type "C" in the text field, you likely want the input to capture the keypress without triggering the shortcut. + +To handle this, you can enable the option on the `TextField` widget to bypass keyboard shortcuts. However, it’s generally better to assign more unique combinations, like Cmd + C, which are less likely to conflict with normal typing in a text field. +::: + ## Page state :::note[State Variables] diff --git a/docs/resources/ui/widgets/basic-widgets/container.md b/docs/resources/ui/widgets/basic-widgets/container.md index 81296b29..bb0a8773 100644 --- a/docs/resources/ui/widgets/basic-widgets/container.md +++ b/docs/resources/ui/widgets/basic-widgets/container.md @@ -204,7 +204,7 @@ useful for ensuring good visibility and interactivity across different devices. To enable the safe area, navigate to the properties panel and turn on the Safe Area toggle. -![img_1.png](../built-in-widgets/imgs/img_1.png) +![safe-area.png](imgs/safe-area.png) :::tip[Watch the video tutorial] If you prefer watching a video tutorial, here is the guide for you: diff --git a/docs/resources/ui/widgets/basic-widgets/imgs/safe-area.png b/docs/resources/ui/widgets/basic-widgets/imgs/safe-area.png new file mode 100644 index 00000000..0d3b7e47 Binary files /dev/null and b/docs/resources/ui/widgets/basic-widgets/imgs/safe-area.png differ diff --git a/docs/resources/ui/widgets/built-in-widgets/img_1.png b/docs/resources/ui/widgets/basic-widgets/imgs/text-overflow.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_1.png rename to docs/resources/ui/widgets/basic-widgets/imgs/text-overflow.png diff --git a/docs/resources/ui/widgets/basic-widgets/text.md b/docs/resources/ui/widgets/basic-widgets/text.md index ab4850e9..c4c71c52 100644 --- a/docs/resources/ui/widgets/basic-widgets/text.md +++ b/docs/resources/ui/widgets/basic-widgets/text.md @@ -118,7 +118,7 @@ value for **Max character** to limit the number of characters. 2. Set the **Text Overflow Replacement** to either **Clip/Cutoff** or **Ellipsis (...)** -![img_1.png](../built-in-widgets/img_1.png) +![text-overflow.png](imgs/text-overflow.png) ### Adding Gradient color diff --git a/docs/resources/ui/widgets/built-in-widgets/_category_.json b/docs/resources/ui/widgets/built-in-widgets/_category_.json index aab870be..f6ea2521 100644 --- a/docs/resources/ui/widgets/built-in-widgets/_category_.json +++ b/docs/resources/ui/widgets/built-in-widgets/_category_.json @@ -1,4 +1,4 @@ { - "label": "Built-in Widgets", + "label": "Other Built-in Widgets", "position": 6 } \ No newline at end of file diff --git a/docs/resources/ui/components/built-in-components/badge.md b/docs/resources/ui/widgets/built-in-widgets/badge.md similarity index 99% rename from docs/resources/ui/components/built-in-components/badge.md rename to docs/resources/ui/widgets/built-in-widgets/badge.md index c912f7fe..5f481660 100644 --- a/docs/resources/ui/components/built-in-components/badge.md +++ b/docs/resources/ui/widgets/built-in-widgets/badge.md @@ -8,7 +8,7 @@ The Badget widget indicates the number of items that need your attention. Typica For example, You could use the badge widget to show the number of unread notifications and items in your shopping cart. -![img_3.png](img_3.png) +![img_3.png](imgs/img_3.png) ## Adding Badge widget diff --git a/docs/resources/ui/components/built-in-components/barcode.md b/docs/resources/ui/widgets/built-in-widgets/barcode.md similarity index 100% rename from docs/resources/ui/components/built-in-components/barcode.md rename to docs/resources/ui/widgets/built-in-widgets/barcode.md diff --git a/docs/resources/ui/components/built-in-components/blur.md b/docs/resources/ui/widgets/built-in-widgets/blur.md similarity index 100% rename from docs/resources/ui/components/built-in-components/blur.md rename to docs/resources/ui/widgets/built-in-widgets/blur.md diff --git a/docs/resources/ui/components/built-in-components/calendar.md b/docs/resources/ui/widgets/built-in-widgets/calendar.md similarity index 100% rename from docs/resources/ui/components/built-in-components/calendar.md rename to docs/resources/ui/widgets/built-in-widgets/calendar.md diff --git a/docs/resources/ui/components/built-in-components/carousel.md b/docs/resources/ui/widgets/built-in-widgets/carousel.md similarity index 100% rename from docs/resources/ui/components/built-in-components/carousel.md rename to docs/resources/ui/widgets/built-in-widgets/carousel.md diff --git a/docs/resources/ui/components/built-in-components/chart/_category_.json b/docs/resources/ui/widgets/built-in-widgets/chart/_category_.json similarity index 58% rename from docs/resources/ui/components/built-in-components/chart/_category_.json rename to docs/resources/ui/widgets/built-in-widgets/chart/_category_.json index f1f949d5..a6fb5dd0 100644 --- a/docs/resources/ui/components/built-in-components/chart/_category_.json +++ b/docs/resources/ui/widgets/built-in-widgets/chart/_category_.json @@ -1,4 +1,4 @@ { "label": "Chart", - "position": 1 + "position": 4 } \ No newline at end of file diff --git a/docs/resources/ui/components/built-in-components/chart/bar-chart.md b/docs/resources/ui/widgets/built-in-widgets/chart/bar-chart.md similarity index 100% rename from docs/resources/ui/components/built-in-components/chart/bar-chart.md rename to docs/resources/ui/widgets/built-in-widgets/chart/bar-chart.md diff --git a/docs/resources/ui/components/built-in-components/chart/chart.md b/docs/resources/ui/widgets/built-in-widgets/chart/chart.md similarity index 100% rename from docs/resources/ui/components/built-in-components/chart/chart.md rename to docs/resources/ui/widgets/built-in-widgets/chart/chart.md diff --git a/docs/resources/ui/components/built-in-components/chart/line-chart.md b/docs/resources/ui/widgets/built-in-widgets/chart/line-chart.md similarity index 100% rename from docs/resources/ui/components/built-in-components/chart/line-chart.md rename to docs/resources/ui/widgets/built-in-widgets/chart/line-chart.md diff --git a/docs/resources/ui/components/built-in-components/chart/pie-chart.md b/docs/resources/ui/widgets/built-in-widgets/chart/pie-chart.md similarity index 100% rename from docs/resources/ui/components/built-in-components/chart/pie-chart.md rename to docs/resources/ui/widgets/built-in-widgets/chart/pie-chart.md diff --git a/docs/resources/ui/components/built-in-components/count-controller.md b/docs/resources/ui/widgets/built-in-widgets/count-controller.md similarity index 100% rename from docs/resources/ui/components/built-in-components/count-controller.md rename to docs/resources/ui/widgets/built-in-widgets/count-controller.md diff --git a/docs/resources/ui/components/built-in-components/creditcardform.md b/docs/resources/ui/widgets/built-in-widgets/creditcardform.md similarity index 100% rename from docs/resources/ui/components/built-in-components/creditcardform.md rename to docs/resources/ui/widgets/built-in-widgets/creditcardform.md diff --git a/docs/resources/ui/components/built-in-components/datatable.md b/docs/resources/ui/widgets/built-in-widgets/datatable.md similarity index 100% rename from docs/resources/ui/components/built-in-components/datatable.md rename to docs/resources/ui/widgets/built-in-widgets/datatable.md diff --git a/docs/resources/ui/components/built-in-components/draggable.md b/docs/resources/ui/widgets/built-in-widgets/draggable.md similarity index 99% rename from docs/resources/ui/components/built-in-components/draggable.md rename to docs/resources/ui/widgets/built-in-widgets/draggable.md index 24a7c6ea..0a403af2 100644 --- a/docs/resources/ui/components/built-in-components/draggable.md +++ b/docs/resources/ui/widgets/built-in-widgets/draggable.md @@ -38,7 +38,7 @@ Therefore, named `isShelfFull` with the datatype *Boolean* and set its default value to *False*.
- ![img_1.png](img_1.png) + ![img_1.png](imgs/img_1.png)
Control image display based on page state variable
@@ -120,5 +120,5 @@ com/embed/53acd90e5f394581951173d4626c68a9?sid=0438be54-ed23-46e8-9f45-2cc369740
On Drag Exit -![img_2.png](img_2.png) +![img_2.png](imgs/img_2.png)
\ No newline at end of file diff --git a/docs/resources/ui/components/built-in-components/expandable.md b/docs/resources/ui/widgets/built-in-widgets/expandable.md similarity index 100% rename from docs/resources/ui/components/built-in-components/expandable.md rename to docs/resources/ui/widgets/built-in-widgets/expandable.md diff --git a/docs/resources/ui/components/built-in-components/flippablecard.md b/docs/resources/ui/widgets/built-in-widgets/flippablecard.md similarity index 100% rename from docs/resources/ui/components/built-in-components/flippablecard.md rename to docs/resources/ui/widgets/built-in-widgets/flippablecard.md diff --git a/docs/resources/ui/widgets/built-in-widgets/img.png b/docs/resources/ui/widgets/built-in-widgets/img.png deleted file mode 100644 index 345ed702..00000000 Binary files a/docs/resources/ui/widgets/built-in-widgets/img.png and /dev/null differ diff --git a/docs/resources/ui/components/built-in-components/imgs/add-dividers.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/add-dividers.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/add-dividers.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/add-dividers.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/adjust-row-border.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/adjust-row-border.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/adjust-row-border.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/adjust-row-border.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/app-state-variable-2.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/app-state-variable-2.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/app-state-variable-2.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/app-state-variable-2.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/app-state-variable-calendar.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/app-state-variable-calendar.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/app-state-variable-calendar.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/app-state-variable-calendar.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/app-state-variable.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/app-state-variable.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/app-state-variable.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/app-state-variable.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/app-state-variables.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/app-state-variables.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/app-state-variables.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/app-state-variables.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/bar-collection-to-document.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/bar-collection-to-document.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/bar-collection-to-document.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/bar-collection-to-document.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/calendar-prepare-data.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/calendar-prepare-data.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/calendar-prepare-data.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/calendar-prepare-data.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/chart-with-axis-bound.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/chart-with-axis-bound.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/chart-with-axis-bound.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/chart-with-axis-bound.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/chart-without-axis-bound.png b/docs/resources/ui/widgets/built-in-widgets/imgs/chart-without-axis-bound.png similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/chart-without-axis-bound.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/chart-without-axis-bound.png diff --git a/docs/resources/ui/components/built-in-components/imgs/collection-to-document.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/collection-to-document.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/collection-to-document.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/collection-to-document.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/data-table-header.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/data-table-header.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/data-table-header.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/data-table-header.avif diff --git a/docs/resources/ui/widgets/built-in-widgets/img_7.png b/docs/resources/ui/widgets/built-in-widgets/imgs/elevate-tooltip.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_7.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/elevate-tooltip.png diff --git a/docs/resources/ui/components/built-in-components/imgs/expandable-widget-tree.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/expandable-widget-tree.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/expandable-widget-tree.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/expandable-widget-tree.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/firestore-data-to-chart.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/firestore-data-to-chart.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/firestore-data-to-chart.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/firestore-data-to-chart.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/firestore-data.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/firestore-data.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/firestore-data.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/firestore-data.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/frosted-glass-example.png b/docs/resources/ui/widgets/built-in-widgets/imgs/frosted-glass-example.png similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/frosted-glass-example.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/frosted-glass-example.png diff --git a/docs/resources/ui/components/built-in-components/imgs/get-notified-on-row-changed-per-page.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/get-notified-on-row-changed-per-page.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/get-notified-on-row-changed-per-page.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/get-notified-on-row-changed-per-page.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/image-path-field.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/image-path-field.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/image-path-field.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/image-path-field.avif diff --git a/docs/resources/ui/widgets/built-in-widgets/imgs/img.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img.png index 4cfab5be..fd0e18ac 100644 Binary files a/docs/resources/ui/widgets/built-in-widgets/imgs/img.png and b/docs/resources/ui/widgets/built-in-widgets/imgs/img.png differ diff --git a/docs/resources/ui/widgets/built-in-widgets/imgs/img_1.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_1.png index 0d3b7e47..ca1f9af3 100644 Binary files a/docs/resources/ui/widgets/built-in-widgets/imgs/img_1.png and b/docs/resources/ui/widgets/built-in-widgets/imgs/img_1.png differ diff --git a/docs/resources/ui/widgets/built-in-widgets/img_10.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_10.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_10.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/img_10.png diff --git a/docs/resources/ui/widgets/built-in-widgets/img_11.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_11.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_11.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/img_11.png diff --git a/docs/resources/ui/widgets/built-in-widgets/img_12.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_12.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_12.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/img_12.png diff --git a/docs/resources/ui/widgets/built-in-widgets/imgs/img_2.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_2.png index 4ebb0ad8..ec0e1790 100644 Binary files a/docs/resources/ui/widgets/built-in-widgets/imgs/img_2.png and b/docs/resources/ui/widgets/built-in-widgets/imgs/img_2.png differ diff --git a/docs/resources/ui/components/built-in-components/img_3.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_3.png similarity index 100% rename from docs/resources/ui/components/built-in-components/img_3.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/img_3.png diff --git a/docs/resources/ui/widgets/built-in-widgets/img_4.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_4.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_4.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/img_4.png diff --git a/docs/resources/ui/widgets/built-in-widgets/img_5.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_5.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_5.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/img_5.png diff --git a/docs/resources/ui/widgets/built-in-widgets/img_6.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_6.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_6.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/img_6.png diff --git a/docs/resources/ui/widgets/built-in-widgets/imgs/img_7.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_7.png new file mode 100644 index 00000000..c6fcc959 Binary files /dev/null and b/docs/resources/ui/widgets/built-in-widgets/imgs/img_7.png differ diff --git a/docs/resources/ui/widgets/built-in-widgets/img_8.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_8.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_8.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/img_8.png diff --git a/docs/resources/ui/widgets/built-in-widgets/img_9.png b/docs/resources/ui/widgets/built-in-widgets/imgs/img_9.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_9.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/img_9.png diff --git a/docs/resources/ui/widgets/built-in-widgets/imgs/internal-padding.png b/docs/resources/ui/widgets/built-in-widgets/imgs/internal-padding.png new file mode 100644 index 00000000..7e6f4424 Binary files /dev/null and b/docs/resources/ui/widgets/built-in-widgets/imgs/internal-padding.png differ diff --git a/docs/resources/ui/components/built-in-components/imgs/legend.webp b/docs/resources/ui/widgets/built-in-widgets/imgs/legend.webp similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/legend.webp rename to docs/resources/ui/widgets/built-in-widgets/imgs/legend.webp diff --git a/docs/resources/ui/components/built-in-components/imgs/loopcard.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/loopcard.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/loopcard.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/loopcard.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/numbers-to-chart.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/numbers-to-chart.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/numbers-to-chart.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/numbers-to-chart.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/paginated-data-table-fi.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/paginated-data-table-fi.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/paginated-data-table-fi.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/paginated-data-table-fi.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/pie-app-state-variable-2.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/pie-app-state-variable-2.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/pie-app-state-variable-2.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/pie-app-state-variable-2.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/pie-app-state-variable.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/pie-app-state-variable.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/pie-app-state-variable.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/pie-app-state-variable.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/pie-collection-document.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/pie-collection-document.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/pie-collection-document.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/pie-collection-document.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/pie-firestored-data.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/pie-firestored-data.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/pie-firestored-data.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/pie-firestored-data.avif diff --git a/docs/resources/ui/components/built-in-components/imgs/pie-single-value.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/pie-single-value.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/pie-single-value.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/pie-single-value.avif diff --git a/docs/resources/ui/widgets/built-in-widgets/imgs/radius.png b/docs/resources/ui/widgets/built-in-widgets/imgs/radius.png new file mode 100644 index 00000000..d1c9cebf Binary files /dev/null and b/docs/resources/ui/widgets/built-in-widgets/imgs/radius.png differ diff --git a/docs/resources/ui/components/built-in-components/imgs/searching-through-table.avif b/docs/resources/ui/widgets/built-in-widgets/imgs/searching-through-table.avif similarity index 100% rename from docs/resources/ui/components/built-in-components/imgs/searching-through-table.avif rename to docs/resources/ui/widgets/built-in-widgets/imgs/searching-through-table.avif diff --git a/docs/resources/ui/widgets/built-in-widgets/imgs/tooltip-bckgrnd.png b/docs/resources/ui/widgets/built-in-widgets/imgs/tooltip-bckgrnd.png new file mode 100644 index 00000000..87b410f1 Binary files /dev/null and b/docs/resources/ui/widgets/built-in-widgets/imgs/tooltip-bckgrnd.png differ diff --git a/docs/resources/ui/widgets/built-in-widgets/imgs/tooltip-offset.png b/docs/resources/ui/widgets/built-in-widgets/imgs/tooltip-offset.png new file mode 100644 index 00000000..a2474b82 Binary files /dev/null and b/docs/resources/ui/widgets/built-in-widgets/imgs/tooltip-offset.png differ diff --git a/docs/resources/ui/widgets/built-in-widgets/img_3.png b/docs/resources/ui/widgets/built-in-widgets/imgs/tooltip.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_3.png rename to docs/resources/ui/widgets/built-in-widgets/imgs/tooltip.png diff --git a/docs/resources/ui/widgets/built-in-widgets/imgs/transform.png b/docs/resources/ui/widgets/built-in-widgets/imgs/transform.png new file mode 100644 index 00000000..d0cffba3 Binary files /dev/null and b/docs/resources/ui/widgets/built-in-widgets/imgs/transform.png differ diff --git a/docs/resources/ui/components/built-in-components/markdown.md b/docs/resources/ui/widgets/built-in-widgets/markdown.md similarity index 100% rename from docs/resources/ui/components/built-in-components/markdown.md rename to docs/resources/ui/widgets/built-in-widgets/markdown.md diff --git a/docs/resources/ui/components/built-in-components/media-display.md b/docs/resources/ui/widgets/built-in-widgets/media-display.md similarity index 100% rename from docs/resources/ui/components/built-in-components/media-display.md rename to docs/resources/ui/widgets/built-in-widgets/media-display.md diff --git a/docs/resources/ui/widgets/built-in-widgets/mouse-region.md b/docs/resources/ui/widgets/built-in-widgets/mouse-region.md index 790e2fd7..5fc271a1 100644 --- a/docs/resources/ui/widgets/built-in-widgets/mouse-region.md +++ b/docs/resources/ui/widgets/built-in-widgets/mouse-region.md @@ -95,7 +95,7 @@ Note that we wrapped the menu icon and its options inside the MouseRegion widget the next step, we will add the same actions for both MouseRegion widgets so that the menu options stay visible as long as you hover over them. ::: -![img_9.png](img_9.png) +![img_9.png](imgs/img_9.png) 3. Create a boolean [App State variable](../../../../resources/data-representation/app-state.md) and use it diff --git a/docs/resources/ui/components/built-in-components/pincode.md b/docs/resources/ui/widgets/built-in-widgets/pincode.md similarity index 100% rename from docs/resources/ui/components/built-in-components/pincode.md rename to docs/resources/ui/widgets/built-in-widgets/pincode.md diff --git a/docs/resources/ui/components/built-in-components/progressbar.md b/docs/resources/ui/widgets/built-in-widgets/progressbar.md similarity index 100% rename from docs/resources/ui/components/built-in-components/progressbar.md rename to docs/resources/ui/widgets/built-in-widgets/progressbar.md diff --git a/docs/resources/ui/components/built-in-components/ratingbar.md b/docs/resources/ui/widgets/built-in-widgets/ratingbar.md similarity index 100% rename from docs/resources/ui/components/built-in-components/ratingbar.md rename to docs/resources/ui/widgets/built-in-widgets/ratingbar.md diff --git a/docs/resources/ui/components/built-in-components/signature.md b/docs/resources/ui/widgets/built-in-widgets/signature.md similarity index 100% rename from docs/resources/ui/components/built-in-components/signature.md rename to docs/resources/ui/widgets/built-in-widgets/signature.md diff --git a/docs/resources/ui/components/built-in-components/slider.md b/docs/resources/ui/widgets/built-in-widgets/slider.md similarity index 100% rename from docs/resources/ui/components/built-in-components/slider.md rename to docs/resources/ui/widgets/built-in-widgets/slider.md diff --git a/docs/resources/ui/components/built-in-components/sticky-header.md b/docs/resources/ui/widgets/built-in-widgets/sticky-header.md similarity index 100% rename from docs/resources/ui/components/built-in-components/sticky-header.md rename to docs/resources/ui/widgets/built-in-widgets/sticky-header.md diff --git a/docs/resources/ui/components/built-in-components/swipeablestack.md b/docs/resources/ui/widgets/built-in-widgets/swipeablestack.md similarity index 100% rename from docs/resources/ui/components/built-in-components/swipeablestack.md rename to docs/resources/ui/widgets/built-in-widgets/swipeablestack.md diff --git a/docs/resources/ui/widgets/built-in-widgets/tooltip.md b/docs/resources/ui/widgets/built-in-widgets/tooltip.md index 473c71e1..475475b3 100644 --- a/docs/resources/ui/widgets/built-in-widgets/tooltip.md +++ b/docs/resources/ui/widgets/built-in-widgets/tooltip.md @@ -10,7 +10,7 @@ The Tooltip widget provides a textual description of a widget in a small popup b It is not frequently used on touch devices where tapping or long-pressing can initiate other actions. But they can be incredibly useful in the desktop environment where hover functionality is available. ::: -![img_3.png](img_3.png) +![tooltip.png](imgs/tooltip.png) ## Adding *Tooltip* widget @@ -121,31 +121,31 @@ To change the tail's size, you can use the **Tail Width** and **Tail Lenght** pr You can change the Tooltip's background color using the **Background Color** property. -![img_4.png](img_4.png) +![tooltip-bckgrnd.png](imgs/tooltip-bckgrnd.png) ### Set tooltip offset By setting the tooltip offset, you can adjust the space between the tooltip and the target widget. To do so, move to the **Properties Panel >** set the **Offset** value. -![img_5.png](img_5.png) +![tooltip-offset.png](imgs/tooltip-offset.png) ### Customize border radius To change the rounded corner of the Tooltip widget, move to the **Properties Panel >** set the **Border Radius** property. -![img_6.png](img_6.png) +![radius.png](imgs/radius.png) ### Elevate tooltip To add a shadow or to create a sense of depth on this widget, you can use the **Elevation** property. It allows a widget to stand out, making it appear like it's floating above the surface of the UI, ultimately making the tooltip more noticeable. -![img_7.png](img_7.png) - +![elevate-tooltip.png](imgs/elevate-tooltip.png) +toolt ### Set internal padding In case you want to add some space around the tooltip message, navigate to the **Properties Panel >** set the **Padding** property. -![img_8.png](img_8.png) +![internal-padding.png](imgs/internal-padding.png) ### Change wait duration diff --git a/docs/resources/ui/widgets/built-in-widgets/transform.md b/docs/resources/ui/widgets/built-in-widgets/transform.md index 874110d0..de6754c3 100644 --- a/docs/resources/ui/widgets/built-in-widgets/transform.md +++ b/docs/resources/ui/widgets/built-in-widgets/transform.md @@ -6,7 +6,7 @@ tags: [Base Elements] The `Transform` widget applies graphic transformations such as skew (or tilt), rotate, scale, and translate (or slide) to its child widget. You could use this widget in combination with animations to build visually engaging apps. -![img_10.png](img_10.png) +![transform.png](imgs/transform.png) ## Adding Transform widget diff --git a/docs/resources/ui/widgets/built-in-widgets/img_2.png b/docs/resources/ui/widgets/composing-widgets/imgs/gridview.png similarity index 100% rename from docs/resources/ui/widgets/built-in-widgets/img_2.png rename to docs/resources/ui/widgets/composing-widgets/imgs/gridview.png diff --git a/docs/resources/ui/widgets/composing-widgets/list-grid.md b/docs/resources/ui/widgets/composing-widgets/list-grid.md index 2be58a3c..356df57a 100644 --- a/docs/resources/ui/widgets/composing-widgets/list-grid.md +++ b/docs/resources/ui/widgets/composing-widgets/list-grid.md @@ -232,7 +232,7 @@ GridView provides a two-dimensional array of children. It is the widget of choic Like [ListView](#listview-widget), GridView only renders the visible items, making it efficient for displaying large collections of elements. GridView supports multiple configurations for column count, spacing, aspect ratio, and scroll directions, offering robust customization options for diverse layout needs. -![img_2.png](../built-in-widgets/img_2.png) +![gridview.png](imgs/gridview.png) Here's a quick demo to show how to add a GridView widget and modify its properties: diff --git a/docs/resources/ui/widgets/intro-widgets.md b/docs/resources/ui/widgets/intro-widgets.md index 6db3365f..7967c14f 100644 --- a/docs/resources/ui/widgets/intro-widgets.md +++ b/docs/resources/ui/widgets/intro-widgets.md @@ -13,8 +13,20 @@ Widgets are the building blocks of your app's user interface in FlutterFlow. Eac Understanding the parent-child relationship between widgets is crucial, as it forms the foundation of the [**Widget Tree**](#widget-tree), which defines the structure and hierarchy of your app's UI. +## Types of Widgets in FlutterFlow + +- **Built-in Widgets**: You can choose from a variety of built-in widgets in FlutterFlow. These are discussed throughout this section. + +- **[Components](creating-components.md)**: You can also build your own reusable widgets, or + Components by assembling multiple widgets using FlutterFlow’s drag-and-drop interface. + +- **[Custom Widgets](../../../ff-concepts/adding-customization/custom-widgets.md)**: For scenarios where more complex functionalities are required, FlutterFlow + allows you to develop your own Custom Widgets using code. + +- **[Theme Widgets](../../../ff-concepts/design-system/design-system.md#theme-widgets)**: Themed widgets can be reused across your app, making it easy to update styles universally. If you decide to change any properties, such as color schemes or fonts, you can update the theme widget instead of modifying each widget individually. + ## Widget Tree -Widget Tree is a visual and structural representation of how widgets—ranging from [atomic elements](../overview.md) like Text and Button to more [complex molecules and organisms](../overview.md)—organized within a Page. It outlines the parent-child relationships that define the layout and functionality of your UI. This hierarchy is similar to the concept of atomic design, where atoms and molecules combine to form more complex structures, ultimately creating a cohesive interface. +The Widget Tree is a structural representation of how widgets—ranging from [atomic elements](../overview.md) like Text and Button to more [complex molecules and organisms](../overview.md)—organized within a Page. It outlines the parent-child relationships that define the layout and functionality of your UI. This hierarchy is similar to the concept of atomic design, where atoms and molecules combine to form more complex structures, ultimately creating a cohesive interface. :::info[WIDGET TREE BREAKDOWN] ![tree.png](../imgs/tree.png) diff --git a/docs/resources/ui/widgets/widget-commonalities.md b/docs/resources/ui/widgets/widget-commonalities.md index 6bdb22d3..74df796c 100644 --- a/docs/resources/ui/widgets/widget-commonalities.md +++ b/docs/resources/ui/widgets/widget-commonalities.md @@ -1,6 +1,6 @@ --- title: Common Widget Properties -sidebar_position: 4 +sidebar_position: 6 --- # Common Widget Properties diff --git a/docs/testing-deployment-publishing/branching-collaboration/branching.md b/docs/testing-deployment-publishing/branching-collaboration/branching.md index 587f4ae2..ac8e303f 100644 --- a/docs/testing-deployment-publishing/branching-collaboration/branching.md +++ b/docs/testing-deployment-publishing/branching-collaboration/branching.md @@ -10,10 +10,10 @@ keywords: [Branching, Collaboration, FlutterFlow, Concepts] # 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 app and potentially causing problems, you create a branch to work on this new feature. Once it's completed, you can integrate it back into the main app. +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. :::info -This feature is only available for teams and enterprise users. +This feature is only available for Pro, Teams and Enterprise users. ::: @@ -22,48 +22,110 @@ This feature is only available for teams and enterprise users. Creating a branch here doesn't create one on GitHub. Branches stay and are managed solely within FlutterFlow. You can also learn more about [**managing custom code on GitHub**](../exporting-code/push-to-github.md#manage-custom-code-on-github). - ::: -## Create and merge branch +## 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) -First, create a new branch from the 'main' branch. After making your changes and finalizing the -feature, proceed to merge this new branch back into the main branch. If there are any conflicts, -you must resolve them first, and then you'll be able to merge the new branch into the main branch -successfully. +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, +you must resolve them first. -:::note Few things to note here -- At the moment, FlutterFlow only supports merging into `main`. -- Only the user who initiated the merge can access both the `main` branch and the branch during an ongoing merge. -- Changes that don't conflict are resolved automatically. -- You cannot currently undo a merge, but a merge can be aborted if you want to start over. -- If you leave the project during the merging and come back, the progress you have made on the merge will be preserved. +## 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.** + +
+ +
+

+ + +:::tip + +You can create a new branch from any existing branch, however it's most common to create new branches from `main` ::: -Let's see how to create, merge branches, and resolve conflicts with a practical example. Here's how you do it. -1. Create a new branch from the `main` branch. +## Commits -:::tip +A commit is essentially a saved snapshot of your project at a particular point in time. When you make changes to your project (such as adding new widgets, modifying actions, or configuring integrations), you can create a commit to save these changes. Each commit stores a record of what has been modified and serves as a version history for your branch, making it easy to see what has changed and roll back to previous versions if needed. -You can also create a new branch from any existing branch. +### Create Commits +To create a commit, follow these steps: + +
+ +
+

+ +:::tip[Best Practices for Commits] +- **Commit Frequently:** Save your work often to ensure that changes are tracked, and you have a detailed version history. You can use the keyboard shortcut (cmd + enter) for faster iteration! +- **Use Clear Messages:** Always provide meaningful commit messages that explain what was done. +- **Test Before Committing:** Ensure that the project works as expected before committing significant changes. ::: +### View Commit Changes + +Once the commit is created, you can see the list of all commits under the **Branch History** section. Here, each commit is displayed with a timestamp, the user who made the changes, and a commit message. You can also search and filter through commits by specific users and date range. + +To see the commit changes, simply click on the commit. +
+ width: '100%'}}> +
+

+ +The selected environment is used to generate the proper app code when you run, test, deploy or export your app. The only things that change between environment are the [Firebase Project](#configuring-firebase-for-each-environment) or variables that are tied to [Environment Values](#use-environment-values) + + +### Use Environment Values +Environment Values can be used to dynamically change parts of your app's code based on the environment that is being used. + +For example, in an e-commerce app, you might define an `apiUrl` Environment Value that points to different API URLs for Development, Staging, and Production. This allows you to test new features without affecting the live production environment, where real customer orders are processed. + +Let's see an example of creating and using `apiUrl`: + +
+ +
+

+ +:::info +After switching to an environment, FlutterFlow generates code specific to that environment, for any of the following interactions: +- Test / Run mode sessions +- Local Run +- Code export +- Deployment + +You also may see different project errors depending on which environment you have selected. +::: + +### Configuring Firebase for each Environment +A single FlutterFlow project can have **multiple environments**, each mapped to its **own Firebase project**. This ensures that environments like `Development`, `Staging`, and `Production` remain independent, giving you better control over your app's data and behavior throughout different stages of development. + +![flutterflow-environment](../imgs/flutterflow-environment.avif) + +If your project uses Firebase, you'll need to [**manually configure a new Firebase project**](../../../ff-integrations/firebase/connect-to-firebase-setup.md#connect-an-existing-firebase-project-manually) for each environment. This requires setting up a new project in the Firebase console and linking it to the selected environment in FlutterFlow. + +:::info +- You must complete the Firebase setup for the new environment before you can test your app using that environment. However, this doesn't stop you from continuing to run and test your app in other environments. Just switch back to production, and you can keep testing while finishing the setup for the new environment. +- You must manually set up [**Firebase rules**](../../../ff-integrations/database/cloud-firestore/firestore-rules.md) and [**collections**](../../../ff-integrations/database/cloud-firestore/creating-collections.md) for the new environment. +- Data that you add to Firebase through the Content Manager is specific to the Firebase project, and environment, that you have selected +::: + + + +### FAQ + +
+How can you push code from one environment to another? +

+It’s important to note that the **Development Environments** feature in FlutterFlow is primarily designed to configure different backends for testing + +If you are building new features, you should consider using [**Branching**](../../../testing-deployment-publishing/branching-collaboration/branching.md). You can develop and test new features on a new branch by selecting a development environment. Once tested, you can merge the branch into `main` and switch to the `Production` Environment to go live. +

+
+ +
+Are you using Flutter flavors under the hood? +

+ +No, FlutterFlow does not use Flutter flavors. Instead, it generates code based on the environment selected in FlutterFlow. The environment-specific code is generated and applied for the following actions: + +- Test / Run mode sessions +- Local Run +- Code export +- Deployment +

+
+ diff --git a/docs/testing-deployment-publishing/exporting-code/_category_.json b/docs/testing-deployment-publishing/exporting-code/_category_.json index 534f30fd..92d23d3c 100644 --- a/docs/testing-deployment-publishing/exporting-code/_category_.json +++ b/docs/testing-deployment-publishing/exporting-code/_category_.json @@ -1,4 +1,4 @@ { "label": "Exporting Code", - "position": 1 + "position": 5 } \ No newline at end of file diff --git a/docs/testing-deployment-publishing/imgs/after-merge.avif b/docs/testing-deployment-publishing/imgs/after-merge.avif deleted file mode 100644 index cfa6c6aa..00000000 Binary files a/docs/testing-deployment-publishing/imgs/after-merge.avif and /dev/null differ diff --git a/docs/testing-deployment-publishing/imgs/after-merging-2.png b/docs/testing-deployment-publishing/imgs/after-merging-2.png new file mode 100644 index 00000000..8c9a9a70 Binary files /dev/null and b/docs/testing-deployment-publishing/imgs/after-merging-2.png differ diff --git a/docs/testing-deployment-publishing/imgs/after-merging.avif b/docs/testing-deployment-publishing/imgs/after-merging.avif deleted file mode 100644 index 979db71d..00000000 Binary files a/docs/testing-deployment-publishing/imgs/after-merging.avif and /dev/null differ diff --git a/docs/testing-deployment-publishing/imgs/after-merging.png b/docs/testing-deployment-publishing/imgs/after-merging.png new file mode 100644 index 00000000..7dfdd3a1 Binary files /dev/null and b/docs/testing-deployment-publishing/imgs/after-merging.png differ diff --git a/docs/testing-deployment-publishing/imgs/branch-permission.png b/docs/testing-deployment-publishing/imgs/branch-permission.png new file mode 100644 index 00000000..ff927924 Binary files /dev/null and b/docs/testing-deployment-publishing/imgs/branch-permission.png differ diff --git a/docs/testing-deployment-publishing/imgs/dev-env-firebase.avif b/docs/testing-deployment-publishing/imgs/dev-env-firebase.avif new file mode 100644 index 00000000..d52d4d64 Binary files /dev/null and b/docs/testing-deployment-publishing/imgs/dev-env-firebase.avif differ diff --git a/docs/testing-deployment-publishing/imgs/flutterflow-environment.avif b/docs/testing-deployment-publishing/imgs/flutterflow-environment.avif new file mode 100644 index 00000000..ac54ca59 Binary files /dev/null and b/docs/testing-deployment-publishing/imgs/flutterflow-environment.avif differ diff --git a/docs/testing-deployment-publishing/publishing/_category_.json b/docs/testing-deployment-publishing/publishing/_category_.json index f5604294..80a95fdb 100644 --- a/docs/testing-deployment-publishing/publishing/_category_.json +++ b/docs/testing-deployment-publishing/publishing/_category_.json @@ -1,4 +1,4 @@ { "label": "Publishing", - "position": 5 + "position": 6 } \ No newline at end of file diff --git a/docs/testing-deployment-publishing/running-your-app/_category_.json b/docs/testing-deployment-publishing/running-your-app/_category_.json index 9d5ceea8..97aee821 100644 --- a/docs/testing-deployment-publishing/running-your-app/_category_.json +++ b/docs/testing-deployment-publishing/running-your-app/_category_.json @@ -1,4 +1,4 @@ { "label": "Running your App", - "position": 4 + "position": 3 } \ No newline at end of file diff --git a/docs/testing-deployment-publishing/testing/_category_.json b/docs/testing-deployment-publishing/testing/_category_.json index a614146a..c920a2e3 100644 --- a/docs/testing-deployment-publishing/testing/_category_.json +++ b/docs/testing-deployment-publishing/testing/_category_.json @@ -1,4 +1,4 @@ { "label": "Testing", - "position": 3 + "position": 4 } \ No newline at end of file diff --git a/static/img/leverage-component-parameter.png b/static/img/leverage-component-parameter.png new file mode 100644 index 00000000..f32b856b Binary files /dev/null and b/static/img/leverage-component-parameter.png differ diff --git a/static/img/set-component-parameter.png b/static/img/set-component-parameter.png new file mode 100644 index 00000000..644102f8 Binary files /dev/null and b/static/img/set-component-parameter.png differ diff --git a/yarn.lock b/yarn.lock index f03da678..7223a46f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -84,7 +84,7 @@ "@algolia/requester-common" "4.24.0" "@algolia/transporter" "4.24.0" -"@algolia/client-search@>= 4.9.1 < 6", "@algolia/client-search@4.24.0": +"@algolia/client-search@4.24.0": version "4.24.0" resolved "https://registry.npmjs.org/@algolia/client-search/-/client-search-4.24.0.tgz" integrity sha512-uRW6EpNapmLAD0mW47OXqTP8eiIx5F6qN9/x/7HHO6owL3N1IXqydGwW5nhDFBrV+ldouro2W1VX3XlcUXEFCA== @@ -176,7 +176,7 @@ resolved "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.24.7.tgz" integrity sha512-qJzAIcv03PyaWqxRgO4mSU3lihncDT296vnyuE2O8uA4w3UHWI4S3hgeZd1L8W1Bft40w9JxJ2b412iDUFFRhw== -"@babel/core@^7.0.0", "@babel/core@^7.0.0-0", "@babel/core@^7.0.0-0 || ^8.0.0-0 <8.0.0", "@babel/core@^7.12.0", "@babel/core@^7.13.0", "@babel/core@^7.21.3", "@babel/core@^7.23.3", "@babel/core@^7.4.0 || ^8.0.0-0 <8.0.0": +"@babel/core@^7.21.3", "@babel/core@^7.23.3": version "7.24.7" resolved "https://registry.npmjs.org/@babel/core/-/core-7.24.7.tgz" integrity sha512-nykK+LEK86ahTkX/3TgauT0ikKoNCfKHEaZYTUVupJdTLzGNvrblu4u6fa7DhZONAltdf8e662t/abY8idrd/g== @@ -1228,7 +1228,7 @@ resolved "https://registry.npmjs.org/@discoveryjs/json-ext/-/json-ext-0.5.7.tgz" integrity sha512-dBVuXR082gk3jsFp7Rd/JI4kytwGHecnCoTtXFb7DB6CNHp4rg5k1bhg0nWdLGLnOV71lmDzGQaLMy8iPLY0pw== -"@docsearch/css@^3.6.1", "@docsearch/css@3.6.1": +"@docsearch/css@3.6.1", "@docsearch/css@^3.6.1": version "3.6.1" resolved "https://registry.npmjs.org/@docsearch/css/-/css-3.6.1.tgz" integrity sha512-VtVb5DS+0hRIprU2CO6ZQjK2Zg4QU5HrDM1+ix6rT0umsYvFvatMAnf97NHZlVWDaaLlx7GRfR/7FikANiM2Fg== @@ -1241,7 +1241,7 @@ "@docsearch/react" "3.6.1" preact "^10.0.0" -"@docsearch/react@^3.5.2", "@docsearch/react@3.6.1": +"@docsearch/react@3.6.1", "@docsearch/react@^3.5.2": version "3.6.1" resolved "https://registry.npmjs.org/@docsearch/react/-/react-3.6.1.tgz" integrity sha512-qXZkEPvybVhSXj0K7U3bXc233tk5e8PfhoZ6MhPOiik/qUQxYC+Dn9DnoS7CxHQQhHfCvTiN0eY9M12oRghEXw== @@ -1251,7 +1251,7 @@ "@docsearch/css" "3.6.1" algoliasearch "^4.19.1" -"@docusaurus/core@^3.4.0", "@docusaurus/core@3.4.0": +"@docusaurus/core@3.4.0", "@docusaurus/core@^3.4.0": version "3.4.0" resolved "https://registry.npmjs.org/@docusaurus/core/-/core-3.4.0.tgz" integrity sha512-g+0wwmN2UJsBqy2fQRQ6fhXruoEa62JDeEa5d8IdTJlMoaDaEDfHh7WjwGRn4opuTQWpjAwP/fbcgyHKlE+64w== @@ -1423,7 +1423,7 @@ utility-types "^3.10.0" webpack "^5.88.1" -"@docusaurus/plugin-content-docs@^3.4.0", "@docusaurus/plugin-content-docs@3.4.0": +"@docusaurus/plugin-content-docs@3.4.0", "@docusaurus/plugin-content-docs@^3.4.0": version "3.4.0" resolved "https://registry.npmjs.org/@docusaurus/plugin-content-docs/-/plugin-content-docs-3.4.0.tgz" integrity sha512-HkUCZffhBo7ocYheD9oZvMcDloRnGhBMOZRyVcAQRFmZPmNqSyISlXA1tQCIxW+r478fty97XXAGjNYzBjpCsg== @@ -1481,7 +1481,7 @@ "@docusaurus/utils-validation" "3.4.0" tslib "^2.6.0" -"@docusaurus/plugin-google-gtag@^3.4.0", "@docusaurus/plugin-google-gtag@3.4.0": +"@docusaurus/plugin-google-gtag@3.4.0", "@docusaurus/plugin-google-gtag@^3.4.0": version "3.4.0" resolved "https://registry.npmjs.org/@docusaurus/plugin-google-gtag/-/plugin-google-gtag-3.4.0.tgz" integrity sha512-Dsgg6PLAqzZw5wZ4QjUYc8Z2KqJqXxHxq3vIoyoBWiLEEfigIs7wHR+oiWUQy3Zk9MIk6JTYj7tMoQU0Jm3nqA== @@ -1536,7 +1536,7 @@ "@docusaurus/theme-search-algolia" "3.4.0" "@docusaurus/types" "3.4.0" -"@docusaurus/react-loadable@5.5.2": +"@docusaurus/react-loadable@5.5.2", "react-loadable@npm:@docusaurus/react-loadable@5.5.2": version "5.5.2" resolved "https://registry.npmjs.org/@docusaurus/react-loadable/-/react-loadable-5.5.2.tgz" integrity sha512-A3dYjdBGuy0IGT+wyLIGIKLRE+sAk1iNk0f1HjNDysO7u8lhL4N3VEm+FAubmJbAztn94F7MxBTPmnixbiyFdQ== @@ -1631,7 +1631,7 @@ resolved "https://registry.npmjs.org/@docusaurus/tsconfig/-/tsconfig-3.1.1.tgz" integrity sha512-FTBuY3KvaHfMVBgvlPmDQ+KS9Q/bYtVftq2ugou3PgBDJoQmw2aUZ4Sg15HKqLGbfIkxoy9t6cqE4Yw1Ta8Q1A== -"@docusaurus/types@*", "@docusaurus/types@3.1.1": +"@docusaurus/types@3.1.1": version "3.1.1" resolved "https://registry.npmjs.org/@docusaurus/types/-/types-3.1.1.tgz" integrity sha512-grBqOLnubUecgKFXN9q3uit2HFbCxTWX4Fam3ZFbMN0sWX9wOcDoA7lwdX/8AmeL20Oc4kQvWVgNrsT8bKRvzg== @@ -1828,7 +1828,7 @@ "@nodelib/fs.stat" "2.0.5" run-parallel "^1.1.9" -"@nodelib/fs.stat@^2.0.2", "@nodelib/fs.stat@2.0.5": +"@nodelib/fs.stat@2.0.5", "@nodelib/fs.stat@^2.0.2": version "2.0.5" resolved "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz" integrity sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A== @@ -1962,7 +1962,7 @@ "@svgr/babel-plugin-transform-react-native-svg" "8.1.0" "@svgr/babel-plugin-transform-svg-component" "8.0.0" -"@svgr/core@*", "@svgr/core@8.1.0": +"@svgr/core@8.1.0": version "8.1.0" resolved "https://registry.npmjs.org/@svgr/core/-/core-8.1.0.tgz" integrity sha512-8QqtOQT5ACVlmsvKOJNEaWmRPmcojMOzCz4Hs2BGG/toAp/K38LcsMRyLp349glq5AzJbCEeimEoxaX6v/fLrA== @@ -2273,7 +2273,7 @@ "@types/history" "^4.7.11" "@types/react" "*" -"@types/react@*", "@types/react@>= 16.8.0 < 19.0.0", "@types/react@>=16": +"@types/react@*": version "18.3.3" resolved "https://registry.npmjs.org/@types/react/-/react-18.3.3.tgz" integrity sha512-hti/R0pS0q1/xx+TsI73XIqk26eBsISZ2R0wUijXIngRK9R/e7Xw/cXVxQK7R5JjW+SV4zGcn5hXjudkN/pLIw== @@ -2358,7 +2358,7 @@ resolved "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.2.0.tgz" integrity sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ== -"@webassemblyjs/ast@^1.12.1", "@webassemblyjs/ast@1.12.1": +"@webassemblyjs/ast@1.12.1", "@webassemblyjs/ast@^1.12.1": version "1.12.1" resolved "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.12.1.tgz" integrity sha512-EKfMUOPRRUTy5UII4qJDGPpqfwjOmZ5jeGFwid9mnoqIFK+e0vqoi1qH56JpmZSzEL53jKnNzScdmftJyG5xWg== @@ -2459,7 +2459,7 @@ "@webassemblyjs/wasm-gen" "1.12.1" "@webassemblyjs/wasm-parser" "1.12.1" -"@webassemblyjs/wasm-parser@^1.12.1", "@webassemblyjs/wasm-parser@1.12.1": +"@webassemblyjs/wasm-parser@1.12.1", "@webassemblyjs/wasm-parser@^1.12.1": version "1.12.1" resolved "https://registry.npmjs.org/@webassemblyjs/wasm-parser/-/wasm-parser-1.12.1.tgz" integrity sha512-xikIi7c2FHXysxXe3COrVUPSheuBtpcfhbpFj4gmu7KRLYOzANztwUU0IbsqvMqzuNK2+glRGWCEqZo1WCLyAQ== @@ -2514,7 +2514,7 @@ acorn-walk@^8.0.0: dependencies: acorn "^8.11.0" -"acorn@^6.0.0 || ^7.0.0 || ^8.0.0", acorn@^8, acorn@^8.0.0, acorn@^8.0.4, acorn@^8.11.0, acorn@^8.7.1, acorn@^8.8.2: +acorn@^8.0.0, acorn@^8.0.4, acorn@^8.11.0, acorn@^8.7.1, acorn@^8.8.2: version "8.12.0" resolved "https://registry.npmjs.org/acorn/-/acorn-8.12.0.tgz" integrity sha512-RTvkC4w+KNXrM39/lWCUaG0IbRkWdCv7W/IOW9oU6SawyxulvkQy5HQPVTKxEjczcUvapcrw3cFx/60VN/NRNw== @@ -2539,12 +2539,7 @@ ajv-formats@^2.1.1: dependencies: ajv "^8.0.0" -ajv-keywords@^3.4.1: - version "3.5.2" - resolved "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz" - integrity sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ== - -ajv-keywords@^3.5.2: +ajv-keywords@^3.4.1, ajv-keywords@^3.5.2: version "3.5.2" resolved "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz" integrity sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ== @@ -2556,7 +2551,7 @@ ajv-keywords@^5.1.0: dependencies: fast-deep-equal "^3.1.3" -ajv@^6.12.2, ajv@^6.12.5, ajv@^6.9.1: +ajv@^6.12.2, ajv@^6.12.5: version "6.12.6" resolved "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz" integrity sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g== @@ -2566,7 +2561,7 @@ ajv@^6.12.2, ajv@^6.12.5, ajv@^6.9.1: json-schema-traverse "^0.4.1" uri-js "^4.2.2" -ajv@^8.0.0, ajv@^8.8.2, ajv@^8.9.0: +ajv@^8.0.0, ajv@^8.9.0: version "8.16.0" resolved "https://registry.npmjs.org/ajv/-/ajv-8.16.0.tgz" integrity sha512-F0twR8U1ZU67JIEtekUcLkXkoO5mMMmgGD8sK/xUFzJ805jxHQl92hImFAqqXMyMYjSPOyUPAwHYhB72g5sTXw== @@ -2583,7 +2578,7 @@ algoliasearch-helper@^3.13.3: dependencies: "@algolia/events" "^4.0.1" -algoliasearch@^4.18.0, algoliasearch@^4.19.1, "algoliasearch@>= 3.1 < 6", "algoliasearch@>= 4.9.1 < 6": +algoliasearch@^4.18.0, algoliasearch@^4.19.1: version "4.24.0" resolved "https://registry.npmjs.org/algoliasearch/-/algoliasearch-4.24.0.tgz" integrity sha512-bf0QV/9jVejssFBmz2HQLxUadxk574t4iwjCKp5E7NBzwKkrDEhKPISIIjAU/p6K5qDx3qoeh4+26zWN1jmw3g== @@ -2840,7 +2835,7 @@ braces@^3.0.3, braces@~3.0.2: dependencies: fill-range "^7.1.1" -browserslist@^4.0.0, browserslist@^4.18.1, browserslist@^4.21.10, browserslist@^4.22.2, browserslist@^4.23.0, "browserslist@>= 4.21.0": +browserslist@^4.0.0, browserslist@^4.18.1, browserslist@^4.21.10, browserslist@^4.22.2, browserslist@^4.23.0: version "4.23.1" resolved "https://registry.npmjs.org/browserslist/-/browserslist-4.23.1.tgz" integrity sha512-TUfofFo/KsK/bWZ9TWQ5O26tsWW4Uhmt8IYklbnUa70udB6P2wA7w7o4PY4muaEPBQaAX+CEnmmIA41NVHtPVw== @@ -3093,16 +3088,16 @@ color-convert@^2.0.1: dependencies: color-name "~1.1.4" -color-name@~1.1.4: - version "1.1.4" - resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz" - integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA== - color-name@1.1.3: version "1.1.3" resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz" integrity sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw== +color-name@~1.1.4: + version "1.1.4" + resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz" + integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA== + colord@^2.9.3: version "2.9.3" resolved "https://registry.npmjs.org/colord/-/colord-2.9.3.tgz" @@ -3473,27 +3468,20 @@ debounce@^1.2.1: resolved "https://registry.npmjs.org/debounce/-/debounce-1.2.1.tgz" integrity sha512-XRRe6Glud4rd/ZGQfiV1ruXSfbvfJedlV9Y6zOlP+2K04vBYiJEte6stfFkCP03aMnY5tsipamumUjL14fofug== -debug@^2.6.0: +debug@2.6.9, debug@^2.6.0: version "2.6.9" resolved "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz" integrity sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA== dependencies: ms "2.0.0" -debug@^4.0.0, debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@4: +debug@4, debug@^4.0.0, debug@^4.1.0, debug@^4.1.1, debug@^4.3.1: version "4.3.5" resolved "https://registry.npmjs.org/debug/-/debug-4.3.5.tgz" integrity sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg== dependencies: ms "2.1.2" -debug@2.6.9: - version "2.6.9" - resolved "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz" - integrity sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA== - dependencies: - ms "2.0.0" - decode-named-character-reference@^1.0.0: version "1.0.2" resolved "https://registry.npmjs.org/decode-named-character-reference/-/decode-named-character-reference-1.0.2.tgz" @@ -3567,16 +3555,16 @@ del@^6.1.1: rimraf "^3.0.2" slash "^3.0.0" -depd@~1.1.2: - version "1.1.2" - resolved "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz" - integrity sha512-7emPTl6Dpo6JRXOXjLRxck+FlLRX5847cLKEn00PLAgc3g2hTZZgr+e4c2v6QpSmLeFP3n5yUo7ft6avBK/5jQ== - depd@2.0.0: version "2.0.0" resolved "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz" integrity sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw== +depd@~1.1.2: + version "1.1.2" + resolved "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz" + integrity sha512-7emPTl6Dpo6JRXOXjLRxck+FlLRX5847cLKEn00PLAgc3g2hTZZgr+e4c2v6QpSmLeFP3n5yUo7ft6avBK/5jQ== + dequal@^2.0.0: version "2.0.3" resolved "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz" @@ -4065,7 +4053,7 @@ feed@^4.2.2: dependencies: xml-js "^1.6.11" -file-loader@*, file-loader@^6.2.0: +file-loader@^6.2.0: version "6.2.0" resolved "https://registry.npmjs.org/file-loader/-/file-loader-6.2.0.tgz" integrity sha512-qo3glqyTa61Ytg4u73GultjHGjdRyig3tG6lPtyX/jOEJvHif9uB0/OCI2Kif6ctF3caQTW2G5gym21oAsI4pw== @@ -4359,16 +4347,16 @@ got@^12.1.0: p-cancelable "^3.0.0" responselike "^3.0.0" -graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.11, graceful-fs@^4.2.4, graceful-fs@^4.2.6, graceful-fs@^4.2.9: - version "4.2.11" - resolved "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz" - integrity sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ== - graceful-fs@4.2.10: version "4.2.10" resolved "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.10.tgz" integrity sha512-9ByhssR2fPVsNZj478qUUbKfmL0+t5BDVyjShtyZZLiK7ZDAArFFfopyOTj0M05wE2tJPisA4iTnnXl2YoPvOA== +graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.11, graceful-fs@^4.2.4, graceful-fs@^4.2.6, graceful-fs@^4.2.9: + version "4.2.11" + resolved "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz" + integrity sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ== + gray-matter@^4.0.3: version "4.0.3" resolved "https://registry.npmjs.org/gray-matter/-/gray-matter-4.0.3.tgz" @@ -4665,16 +4653,6 @@ http-deceiver@^1.2.7: resolved "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz" integrity sha512-LmpOGxTfbpgtGVxJrj5k7asXHCgNZp5nLfp+hWc8QQRqtb7fUy6kRY3BO1h9ddF6yIPYUARgxGOwB42DnxIaNw== -http-errors@~1.6.2: - version "1.6.3" - resolved "https://registry.npmjs.org/http-errors/-/http-errors-1.6.3.tgz" - integrity sha512-lks+lVC8dgGyh97jxvxeYTWQFvh4uw4yC12gVl63Cg30sjPX4wuGcdkICVXDAESr6OJGjqGA8Iz5mkeN6zlD7A== - dependencies: - depd "~1.1.2" - inherits "2.0.3" - setprototypeof "1.1.0" - statuses ">= 1.4.0 < 2" - http-errors@2.0.0: version "2.0.0" resolved "https://registry.npmjs.org/http-errors/-/http-errors-2.0.0.tgz" @@ -4686,6 +4664,16 @@ http-errors@2.0.0: statuses "2.0.1" toidentifier "1.0.1" +http-errors@~1.6.2: + version "1.6.3" + resolved "https://registry.npmjs.org/http-errors/-/http-errors-1.6.3.tgz" + integrity sha512-lks+lVC8dgGyh97jxvxeYTWQFvh4uw4yC12gVl63Cg30sjPX4wuGcdkICVXDAESr6OJGjqGA8Iz5mkeN6zlD7A== + dependencies: + depd "~1.1.2" + inherits "2.0.3" + setprototypeof "1.1.0" + statuses ">= 1.4.0 < 2" + http-parser-js@>=0.5.1: version "0.5.8" resolved "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.8.tgz" @@ -4789,7 +4777,7 @@ inflight@^1.0.4: once "^1.3.0" wrappy "1" -inherits@^2.0.1, inherits@^2.0.3, inherits@~2.0.3, inherits@2, inherits@2.0.4: +inherits@2, inherits@2.0.4, inherits@^2.0.1, inherits@^2.0.3, inherits@~2.0.3: version "2.0.4" resolved "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz" integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ== @@ -4799,16 +4787,16 @@ inherits@2.0.3: resolved "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz" integrity sha512-x00IRNXNy63jwGkJmzPigoySHbaqpNuzKbBOmzK+g2OdZpQ9w+sxCN+VSB3ja7IAge2OP2qpfxTjeNcyjmW1uw== -ini@^1.3.4, ini@^1.3.5, ini@~1.3.0: - version "1.3.8" - resolved "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz" - integrity sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew== - ini@2.0.0: version "2.0.0" resolved "https://registry.npmjs.org/ini/-/ini-2.0.0.tgz" integrity sha512-7PnF4oN3CvZF23ADhA5wRaYEQpJ8qygSkbtTXWBeXWXmEVRXK+1ITciHWwHhsjv1TmW0MgacIv6hEi5pX5NQdA== +ini@^1.3.4, ini@^1.3.5, ini@~1.3.0: + version "1.3.8" + resolved "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz" + integrity sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew== + inline-style-parser@0.1.1: version "0.1.1" resolved "https://registry.npmjs.org/inline-style-parser/-/inline-style-parser-0.1.1.tgz" @@ -4831,16 +4819,16 @@ invariant@^2.2.4: dependencies: loose-envify "^1.0.0" -ipaddr.js@^2.0.1: - version "2.2.0" - resolved "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.2.0.tgz" - integrity sha512-Ag3wB2o37wslZS19hZqorUnrnzSkpOVy+IiiDEiTqNubEYpYuHWIf6K4psgN2ZWKExS4xhVCrRVfb/wfW8fWJA== - ipaddr.js@1.9.1: version "1.9.1" resolved "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz" integrity sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g== +ipaddr.js@^2.0.1: + version "2.2.0" + resolved "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.2.0.tgz" + integrity sha512-Ag3wB2o37wslZS19hZqorUnrnzSkpOVy+IiiDEiTqNubEYpYuHWIf6K4psgN2ZWKExS4xhVCrRVfb/wfW8fWJA== + is-alphabetical@^2.0.0: version "2.0.1" resolved "https://registry.npmjs.org/is-alphabetical/-/is-alphabetical-2.0.1.tgz" @@ -5011,16 +4999,16 @@ is-yarn-global@^0.4.0: resolved "https://registry.npmjs.org/is-yarn-global/-/is-yarn-global-0.4.1.tgz" integrity sha512-/kppl+R+LO5VmhYSEWARUFjodS25D68gvj8W7z0I7OWhUla5xWu8KL6CtB2V0R6yqhnRgbcaREMr4EEM6htLPQ== -isarray@~1.0.0: - version "1.0.0" - resolved "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz" - integrity sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ== - isarray@0.0.1: version "0.0.1" resolved "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz" integrity sha512-D2S+3GLxWH+uhrNEcoh/fnmYeP8E8/zHl644d/jdA0g2uyXvy3sb0qxotE+ne0LtccHknQzWwZEzhak7oJ0COQ== +isarray@~1.0.0: + version "1.0.0" + resolved "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz" + integrity sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ== + isexe@^2.0.0: version "2.0.0" resolved "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz" @@ -5974,7 +5962,7 @@ micromatch@^4.0.2, micromatch@^4.0.4, micromatch@^4.0.5: braces "^3.0.3" picomatch "^2.3.1" -"mime-db@>= 1.43.0 < 2": +mime-db@1.52.0, "mime-db@>= 1.43.0 < 2": version "1.52.0" resolved "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz" integrity sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg== @@ -5984,40 +5972,14 @@ mime-db@~1.33.0: resolved "https://registry.npmjs.org/mime-db/-/mime-db-1.33.0.tgz" integrity sha512-BHJ/EKruNIqJf/QahvxwQZXKygOQ256myeN/Ew+THcAa5q+PjyTTMMeNQC4DZw5AwfvelsUrA6B67NKMqXDbzQ== -mime-db@1.52.0: - version "1.52.0" - resolved "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz" - integrity sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg== - -mime-types@^2.1.27: - version "2.1.35" - resolved "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz" - integrity sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw== - dependencies: - mime-db "1.52.0" - -mime-types@^2.1.31: - version "2.1.35" - resolved "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz" - integrity sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw== - dependencies: - mime-db "1.52.0" - -mime-types@~2.1.17, mime-types@2.1.18: +mime-types@2.1.18, mime-types@~2.1.17: version "2.1.18" resolved "https://registry.npmjs.org/mime-types/-/mime-types-2.1.18.tgz" integrity sha512-lc/aahn+t4/SWV/qcmumYjymLsWfN3ELhpmVuUFjgsORruuZPVSwAQryq+HHGvO/SI2KVX26bx+En+zhM8g8hQ== dependencies: mime-db "~1.33.0" -mime-types@~2.1.24: - version "2.1.35" - resolved "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz" - integrity sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw== - dependencies: - mime-db "1.52.0" - -mime-types@~2.1.34: +mime-types@^2.1.27, mime-types@^2.1.31, mime-types@~2.1.24, mime-types@~2.1.34: version "2.1.35" resolved "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz" integrity sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw== @@ -6057,7 +6019,7 @@ minimalistic-assert@^1.0.0: resolved "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz" integrity sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A== -minimatch@^3.0.4, minimatch@^3.0.5, minimatch@^3.1.1, minimatch@3.1.2: +minimatch@3.1.2, minimatch@^3.0.4, minimatch@^3.0.5, minimatch@^3.1.1: version "3.1.2" resolved "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz" integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw== @@ -6428,13 +6390,6 @@ path-parse@^1.0.7: resolved "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz" integrity sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw== -path-to-regexp@^1.7.0: - version "1.8.0" - resolved "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz" - integrity sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA== - dependencies: - isarray "0.0.1" - path-to-regexp@0.1.7: version "0.1.7" resolved "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz" @@ -6445,6 +6400,13 @@ path-to-regexp@2.2.1: resolved "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-2.2.1.tgz" integrity sha512-gu9bD6Ta5bwGrrU8muHzVOBFFREpp2iRkVfhBJahwJ6p6Xw20SjT0MxLnwkjOibQmGSYhiUnf2FLe7k+jcFmGQ== +path-to-regexp@^1.7.0: + version "1.8.0" + resolved "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz" + integrity sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA== + dependencies: + isarray "0.0.1" + path-type@^4.0.0: version "4.0.0" resolved "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz" @@ -6763,7 +6725,7 @@ postcss-zindex@^6.0.2: resolved "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-6.0.2.tgz" integrity sha512-5BxW9l1evPB/4ZIc+2GobEBoKC+h8gPGCMi+jxsYvd2x0mjq7wazk6DrP71pStqxE9Foxh5TVnonbWpFZzXaYg== -"postcss@^7.0.0 || ^8.0.1", postcss@^8.0.9, postcss@^8.1.0, postcss@^8.2.2, postcss@^8.4.21, postcss@^8.4.23, postcss@^8.4.24, postcss@^8.4.26, postcss@^8.4.31, postcss@^8.4.33, postcss@^8.4.38: +postcss@^8.4.21, postcss@^8.4.24, postcss@^8.4.26, postcss@^8.4.33, postcss@^8.4.38: version "8.4.38" resolved "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz" integrity sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A== @@ -6891,21 +6853,16 @@ randombytes@^2.1.0: dependencies: safe-buffer "^5.1.0" -range-parser@^1.2.1: - version "1.2.1" - resolved "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz" - integrity sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg== - -range-parser@~1.2.1: - version "1.2.1" - resolved "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz" - integrity sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg== - range-parser@1.2.0: version "1.2.0" resolved "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz" integrity sha512-kA5WQoNVo4t9lNx2kQNFCxKeBl5IbbSNBl1M/tLkw9WCn+hxNBAW5Qh8gdhs63CJnhjJ2zQWFoqPJP2sK1AV5A== +range-parser@^1.2.1, range-parser@~1.2.1: + version "1.2.1" + resolved "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz" + integrity sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg== + raw-body@2.5.2: version "2.5.2" resolved "https://registry.npmjs.org/raw-body/-/raw-body-2.5.2.tgz" @@ -6956,7 +6913,7 @@ react-dev-utils@^12.0.1: strip-ansi "^6.0.1" text-table "^0.2.0" -react-dom@*, "react-dom@^16.6.0 || ^17.0.0 || ^18.0.0", react-dom@^18.0.0, "react-dom@>= 16.8.0 < 19.0.0", react-dom@>=18.0.0: +react-dom@^18.0.0: version "18.3.1" resolved "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz" integrity sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw== @@ -7002,14 +6959,6 @@ react-loadable-ssr-addon-v5-slorber@^1.0.1: dependencies: "@babel/runtime" "^7.10.3" -react-loadable@*, "react-loadable@npm:@docusaurus/react-loadable@5.5.2": - version "5.5.2" - resolved "https://registry.npmjs.org/@docusaurus/react-loadable/-/react-loadable-5.5.2.tgz" - integrity sha512-A3dYjdBGuy0IGT+wyLIGIKLRE+sAk1iNk0f1HjNDysO7u8lhL4N3VEm+FAubmJbAztn94F7MxBTPmnixbiyFdQ== - dependencies: - "@types/react" "*" - prop-types "^15.6.2" - "react-loadable@npm:@docusaurus/react-loadable@6.0.0": version "6.0.0" resolved "https://registry.npmjs.org/@docusaurus/react-loadable/-/react-loadable-6.0.0.tgz" @@ -7037,7 +6986,7 @@ react-router-dom@^5.3.4: tiny-invariant "^1.0.2" tiny-warning "^1.0.0" -react-router@^5.3.4, react-router@>=5, react-router@5.3.4: +react-router@5.3.4, react-router@^5.3.4: version "5.3.4" resolved "https://registry.npmjs.org/react-router/-/react-router-5.3.4.tgz" integrity sha512-Ys9K+ppnJah3QuaRiLxk+jDWOR1MekYQrlytiXxC1RyfbdsZkS5pvKAzCCr031xHixZwpnsYNT5xysdFHQaYsA== @@ -7057,7 +7006,7 @@ react-simple-star-rating@^5.1.7: resolved "https://registry.npmjs.org/react-simple-star-rating/-/react-simple-star-rating-5.1.7.tgz" integrity sha512-NTFkW8W3uwvI82Fv7JW5i7gmDjEZKxJmj+Z9vn+BjYIXT6ILdnU9qnSUP2cWrWN/WAUlue81f9SgM4CQcenltQ== -react@*, "react@^16.13.1 || ^17.0.0 || ^18.0.0", "react@^16.6.0 || ^17.0.0 || ^18.0.0", react@^18.0.0, react@^18.3.1, "react@>= 16.8.0 < 19.0.0", react@>=15, react@>=16, react@>=16.0.0, react@>=18.0.0: +react@^18.0.0: version "18.3.1" resolved "https://registry.npmjs.org/react/-/react-18.3.1.tgz" integrity sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ== @@ -7360,20 +7309,15 @@ run-parallel@^1.1.9: dependencies: queue-microtask "^1.2.2" -safe-buffer@^5.1.0, safe-buffer@>=5.1.0, safe-buffer@~5.2.0, safe-buffer@5.2.1: - version "5.2.1" - resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz" - integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ== - -safe-buffer@~5.1.0, safe-buffer@~5.1.1: +safe-buffer@5.1.2, safe-buffer@~5.1.0, safe-buffer@~5.1.1: version "5.1.2" resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz" integrity sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g== -safe-buffer@5.1.2: - version "5.1.2" - resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz" - integrity sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g== +safe-buffer@5.2.1, safe-buffer@>=5.1.0, safe-buffer@^5.1.0, safe-buffer@~5.2.0: + version "5.2.1" + resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz" + integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ== "safer-buffer@>= 2.1.2 < 3": version "2.1.2" @@ -7392,25 +7336,16 @@ scheduler@^0.23.2: dependencies: loose-envify "^1.1.0" -schema-utils@^3.0.0: - version "3.3.0" - resolved "https://registry.npmjs.org/schema-utils/-/schema-utils-3.3.0.tgz" - integrity sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg== - dependencies: - "@types/json-schema" "^7.0.8" - ajv "^6.12.5" - ajv-keywords "^3.5.2" - -schema-utils@^3.1.1: - version "3.3.0" - resolved "https://registry.npmjs.org/schema-utils/-/schema-utils-3.3.0.tgz" - integrity sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg== +schema-utils@2.7.0: + version "2.7.0" + resolved "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.0.tgz" + integrity sha512-0ilKFI6QQF5nxDZLFn2dMjvc4hjg/Wkg7rHd3jK6/A4a1Hl9VFdQWvgB1UMGoU94pad1P/8N7fMcEnLnSiju8A== dependencies: - "@types/json-schema" "^7.0.8" - ajv "^6.12.5" - ajv-keywords "^3.5.2" + "@types/json-schema" "^7.0.4" + ajv "^6.12.2" + ajv-keywords "^3.4.1" -schema-utils@^3.2.0: +schema-utils@^3.0.0, schema-utils@^3.1.1, schema-utils@^3.2.0: version "3.3.0" resolved "https://registry.npmjs.org/schema-utils/-/schema-utils-3.3.0.tgz" integrity sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg== @@ -7429,20 +7364,6 @@ schema-utils@^4.0.0, schema-utils@^4.0.1: ajv-formats "^2.1.1" ajv-keywords "^5.1.0" -schema-utils@2.7.0: - version "2.7.0" - resolved "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.0.tgz" - integrity sha512-0ilKFI6QQF5nxDZLFn2dMjvc4hjg/Wkg7rHd3jK6/A4a1Hl9VFdQWvgB1UMGoU94pad1P/8N7fMcEnLnSiju8A== - dependencies: - "@types/json-schema" "^7.0.4" - ajv "^6.12.2" - ajv-keywords "^3.4.1" - -"search-insights@>= 1 < 3": - version "2.15.0" - resolved "https://registry.npmjs.org/search-insights/-/search-insights-2.15.0.tgz" - integrity sha512-ch2sPCUDD4sbPQdknVl9ALSi9H7VyoeVbsxznYz6QV55jJ8CI3EtwpO1i84keN4+hF5IeHWIeGvc08530JkVXQ== - section-matter@^1.0.0: version "1.0.0" resolved "https://registry.npmjs.org/section-matter/-/section-matter-1.0.0.tgz" @@ -7695,7 +7616,7 @@ source-map-support@~0.5.20: buffer-from "^1.0.0" source-map "^0.6.0" -source-map@^0.6.0: +source-map@^0.6.0, source-map@~0.6.0: version "0.6.1" resolved "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz" integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g== @@ -7705,11 +7626,6 @@ source-map@^0.7.0: resolved "https://registry.npmjs.org/source-map/-/source-map-0.7.4.tgz" integrity sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA== -source-map@~0.6.0: - version "0.6.1" - resolved "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz" - integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g== - space-separated-tokens@^2.0.0: version "2.0.2" resolved "https://registry.npmjs.org/space-separated-tokens/-/space-separated-tokens-2.0.2.tgz" @@ -7748,45 +7664,22 @@ srcset@^4.0.0: resolved "https://registry.npmjs.org/srcset/-/srcset-4.0.0.tgz" integrity sha512-wvLeHgcVHKO8Sc/H/5lkGreJQVeYMm9rlmt8PuR1xE31rIuXhuzznUUqAt8MqLhB3MqJdFzlNAfpcWnxiFUcPw== -"statuses@>= 1.4.0 < 2": - version "1.5.0" - resolved "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz" - integrity sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA== - statuses@2.0.1: version "2.0.1" resolved "https://registry.npmjs.org/statuses/-/statuses-2.0.1.tgz" integrity sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ== +"statuses@>= 1.4.0 < 2": + version "1.5.0" + resolved "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz" + integrity sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA== + std-env@^3.0.1: version "3.7.0" resolved "https://registry.npmjs.org/std-env/-/std-env-3.7.0.tgz" integrity sha512-JPbdCEQLj1w5GilpiHAx3qJvFndqybBysA3qUOnznweH4QbNYUsW/ea8QzSrnh0vNsezMMw5bcVool8lM0gwzg== -string_decoder@^1.1.1: - version "1.3.0" - resolved "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz" - integrity sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA== - dependencies: - safe-buffer "~5.2.0" - -string_decoder@~1.1.1: - version "1.1.1" - resolved "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz" - integrity sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg== - dependencies: - safe-buffer "~5.1.0" - -string-width@^4.1.0: - version "4.2.3" - resolved "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz" - integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== - dependencies: - emoji-regex "^8.0.0" - is-fullwidth-code-point "^3.0.0" - strip-ansi "^6.0.1" - -string-width@^4.2.0: +string-width@^4.1.0, string-width@^4.2.0: version "4.2.3" resolved "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz" integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== @@ -7804,6 +7697,20 @@ string-width@^5.0.1, string-width@^5.1.2: emoji-regex "^9.2.2" strip-ansi "^7.0.1" +string_decoder@^1.1.1: + version "1.3.0" + resolved "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz" + integrity sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA== + dependencies: + safe-buffer "~5.2.0" + +string_decoder@~1.1.1: + version "1.1.1" + resolved "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz" + integrity sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg== + dependencies: + safe-buffer "~5.1.0" + stringify-entities@^4.0.0: version "4.0.4" resolved "https://registry.npmjs.org/stringify-entities/-/stringify-entities-4.0.4.tgz" @@ -8034,7 +7941,7 @@ typedarray-to-buffer@^3.1.5: dependencies: is-typedarray "^1.0.0" -"typescript@>= 2.7", typescript@>=4.9.5, typescript@~5.2.2: +typescript@~5.2.2: version "5.2.2" resolved "https://registry.npmjs.org/typescript/-/typescript-5.2.2.tgz" integrity sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w== @@ -8150,7 +8057,7 @@ universalify@^2.0.0: resolved "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz" integrity sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw== -unpipe@~1.0.0, unpipe@1.0.0: +unpipe@1.0.0, unpipe@~1.0.0: version "1.0.0" resolved "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz" integrity sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ== @@ -8358,7 +8265,7 @@ webpack-sources@^3.2.3: resolved "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz" integrity sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w== -"webpack@^4.0.0 || ^5.0.0", "webpack@^4.37.0 || ^5.0.0", webpack@^5.0.0, webpack@^5.1.0, webpack@^5.20.0, webpack@^5.88.1, "webpack@>= 4", "webpack@>=4.41.1 || 5.x", webpack@>=5, "webpack@3 || 4 || 5": +webpack@^5.88.1: version "5.92.0" resolved "https://registry.npmjs.org/webpack/-/webpack-5.92.0.tgz" integrity sha512-Bsw2X39MYIgxouNATyVpCNVWBCuUwDgWtN78g6lSdPJRLaQ/PUVm/oXcaRAyY/sMFoKFQrsPeqvTizWtq7QPCA== @@ -8398,7 +8305,7 @@ webpackbar@^5.0.2: pretty-time "^1.1.0" std-env "^3.0.1" -websocket-driver@^0.7.4, websocket-driver@>=0.5.1: +websocket-driver@>=0.5.1, websocket-driver@^0.7.4: version "0.7.4" resolved "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz" integrity sha512-b17KeDIQVjvb0ssuSDF2cYXSg2iztliJ4B9WdsuB6J952qCPKmnVq4DyW5motImXHDC1cBT/1UezrJVsKw5zjg==