mirror of
https://github.com/noodlapp/noodl-docs.git
synced 2026-01-11 23:02:54 +01:00
Initial commit
Co-Authored-By: kotte <14197736+mrtamagotchi@users.noreply.github.com> Co-Authored-By: mikaeltellhed <2311083+mikaeltellhed@users.noreply.github.com> Co-Authored-By: Tore Knudsen <18231882+torekndsn@users.noreply.github.com> Co-Authored-By: Michael Cartner <32543275+michaelcartner@users.noreply.github.com>
This commit is contained in:
Eric Tuvesson
68
nodes/popups/close-popup.md
Normal file
68
nodes/popups/close-popup.md
Normal file
@@ -0,0 +1,68 @@
|
||||
---
|
||||
hide_title: true
|
||||
hide_table_of_contents: true
|
||||
title: Close Popup
|
||||
---
|
||||
|
||||
<##head##>
|
||||
|
||||
# Close Popup
|
||||
|
||||
This node is used to close a popup that have previously been shown with the <span className="ndl-node">Show Popup</span> node. Sending a signal to the <span className="ndl-signal">Close</span> input will close the popup and remove the component instance.
|
||||
|
||||
<div className="ndl-image-with-background l">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
You can also pass data back to the component that triggered the popup by adding <span className="ndl-data">Result</span> values and <span className="ndl-signal">Close Action</span> signals. This is typically used for popups that propmt the user for some kind of input or action, like **Name**, **Confirm** or **Cancel**.
|
||||
|
||||
<##head##>
|
||||
|
||||
### Results and close actions
|
||||
|
||||
Sending data back to the triggering component is done by adding **Result** values and **Close Action** signals. The result values become inputs where you can pass data back, and the actions become signal inputs that can be used to send signals back. This is typically useful for popups that take some sort of input, e.g. **Name** and where the user can perform different actions, e.g. **Confirm** or **Cancel**.
|
||||
|
||||
<div className="ndl-image-with-background">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
After specifying results and close actions in the properties the corresponding inputs become available on the **Close Popup** node.
|
||||
|
||||
:::info
|
||||
|
||||
**Close Popup** has to be called in the same component that **Open Popup** opened.
|
||||
|
||||
:::
|
||||
|
||||
<div className="ndl-image-with-background l">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
These **Result** values and **Close Actions** will also become available as outputs on the [Show Popup](/nodes/popups/show-popup) nodes that have the component containing the **Close Popup** node as target.
|
||||
|
||||
<div className="ndl-image-with-background l">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
## Inputs
|
||||
|
||||
| Signal | Description |
|
||||
| ------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Close</span> | <##input:close##>Send a signal here to close the popup. If no close actions are specified this should be used.<##input##> |
|
||||
| <span className="ndl-signal">Close Actions</span> | All close actions specified on this node will become available as signal inputs. See above for more details. |
|
||||
|
||||
<span className="hidden-props-for-editor"><##input:closeAction-\*##>When the **Popup** is closed using this custom **Close Action**, the same signal be triggered on the **Show Popup** node that was used to open the **Popup**.<##input##></span>
|
||||
|
||||
| Data | Description |
|
||||
| ----------------------------------------------- | ----------------------------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-data">Result Values</span> | All result values specified on this node will become available as inputs. See above for more details. |
|
||||
|
||||
<span className="hidden-props-for-editor"><##input:result-\*##>When the **Popup** is closed, this result parameter will be forwarded as an output on the **Show Popup** node that was used to open the **Popup**.<##input##></span>
|
||||
66
nodes/popups/show-popup.md
Normal file
66
nodes/popups/show-popup.md
Normal file
@@ -0,0 +1,66 @@
|
||||
---
|
||||
hide_title: true
|
||||
hide_table_of_contents: true
|
||||
title: Show Popup
|
||||
---
|
||||
|
||||
<##head##>
|
||||
|
||||
# Show Popup
|
||||
|
||||
This node is used to display a component as a modal popup on top of the entire window.
|
||||
|
||||
<div className="ndl-image-with-background">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
The <span className="ndl-node">Show Popup</span> node lets you specify which component will be popped up when signaled with the <span className="ndl-signal">Show</span> input. Any <span className="ndl-node">Component Inputs</span> that the specified component has will be available as inputs to the <span className="ndl-node">Show Popup</span> node.
|
||||
|
||||
<div className="ndl-image-with-background l">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<##head##>
|
||||
|
||||
When a popup is closed with the [Close Popup](/nodes/popups/close-popup) node it is possible to send back signals and values via **Results** and **Close Actions**. These will become available as outputs for the **Show Popup** node if the target popup component contains **Close Popup** nodes.
|
||||
|
||||
<div className="ndl-image-with-background l">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
## Inputs
|
||||
|
||||
| Data | Description |
|
||||
| ---------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-data">Target</span> | <##input:target##>A component that will be cloned and put on top of the entire window when the **Show** signals is received.<##input##> |
|
||||
|
||||
| Signal | Description |
|
||||
| ---------------------------------------- | ---------------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Show</span> | <##input:show##>Send a signal here to show the popup.<##input##> |
|
||||
|
||||
| Mixed | Description |
|
||||
| -------------------- | ----------------------------------------------------------------------------------- |
|
||||
| **Component Inputs** | Any **Component Inputs** that the popup component have will be available as inputs. |
|
||||
|
||||
<span className="hidden-props-for-editor"><##input:popupParam-\*##>A parameter input originating from a **Component Input** in the **Target** component. It's value will be forwarded to the component.<##input##></span>
|
||||
|
||||
## Outputs
|
||||
|
||||
| Signal | Description |
|
||||
| ------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Closed</span> | <##output:closed##>This output sends a signal when the popup is closed with a **Close Popup** node.<##output##> See [Close Popup](/nodes/popups/close-popup/) for more information. |
|
||||
| <span className="ndl-signal">Close Actions</span> | Any close action signals provided via the [Close Popup](/nodes/popups/close-popup/) node from the target popup component will become available here. |
|
||||
|
||||
<span className="hidden-props-for-editor"><##output:closeAction-\*##>A result signal originating from the **Target** components **Close Popup** node.<##output##></span>
|
||||
|
||||
| Data | Description |
|
||||
| ----------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-data">Close Results</span> | Any result values provided via the [Close Popup](/nodes/popups/close-popup/) node from the target popup component will become available here. |
|
||||
|
||||
<span className="hidden-props-for-editor"><##output:closeResult-\*##>A result output originating from the **Target** components **Close Popup** node.<##output##></span>
|
||||
Reference in New Issue
Block a user