mirror of
https://github.com/noodlapp/noodl-docs.git
synced 2026-01-12 23:32:54 +01:00
* chore: Upgrade Docusaurus from v2 to v3 * chore: Update "Test build" GH workflow * fix: build All markdown is processed as MDX * fix: Broken links
67 lines
4.4 KiB
Markdown
67 lines
4.4 KiB
Markdown
---
|
|
hide_title: true
|
|
hide_table_of_contents: true
|
|
title: Show Popup node
|
|
---
|
|
|
|
{/*##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>
|