Popup
Any actor can be displayed using a popup and can interact with other actors.
When the actionType of an action is ‘context’, it can have the popup attribute. When the action is clicked, a non-blocking popup shows up. The popup can include content and actions defined in the same actor.
Usage: menu button with dropdown options.
Popup Specification
Code JSON
"componentActions": [{
"name": "foo",
"actionType": "context",
"popup": {
"direction": "bottom",
"anchor": "cursor",
"width": 200,
"height": 100,
"margin": 50,
"borderColor": "#48ce94",
"backgroundColor": "#ffffff",
"content": "Lorem ipsum dolor sit amet consectetur."
}
}, ...] Actions in Popup
Code JSON
"componentActions": [{
"name": "foo",
"actionType": "context",
"popup": {...}
}, ... {
"name": "baz",
"actionType": "normal",
"context": "foo"
}]Popup Configuration
| Popup | Action |
|---|---|
"AccountPopup": {
"mode": "popup",
"category": "component",
"type": "queue-view",
…
"generalHandlers": {
"clickRecord": {
"assignments": [{
"field": "$state(LoanPanel).attr(account);",
"value": "$this.attr(Name);"
}],
"updates": [{
"name": "$popup.remove;",
"value": "AccountPopup"
}]
}
}
| “LoanPanel”: {
...
"componentActions": [{
"name": "searchAccount",
"actionType": "normal",
"appearance": {
"label": "...",
"style": "..."
},
"handler": {
"updates": [{
"name": "$popup.add;",
"value": "AccountPopup"
}]
}
}]
}
}
|
Features
Overlay Dimension
Default Value
General
Dimension works for layout as well (both Mui and Mint)
width(recommended),minWidth, andmaxWidth- height, minHeight, and
maxHeight
Code JSON
"overlays": [
{
"name": "...",
"children": [...],
"width": "400px",
"maxHeight": "300px" }
]Status
| Release Available | Status | Framework Name |
|---|---|---|
| 3.6 | Current | Mui and Mint |