Schema
{
"$schema": "http://json-schema.org/draft-07/schema#",
"title": "Modal",
"description": "Displays a modal containing either a child presentation or a fetched URL.",
"type": "object",
"examples": [
{
"title": "Open an inline modal",
"description": "Modal renders any widget in a dialog. Pass a Child (inline JSON) or a Url that fetches another presentation. The user dismisses with the scrim or a close action inside.",
"document": {
"PresentationType": "Button",
"Text": "Open dialog",
"BorderRadius": 6,
"Color": "#FFFFFF",
"BackgroundColor": "#2F6FED",
"OnClick": {
"Handler": "Modal",
"MaxWidth": 420,
"Child": {
"PresentationType": "Column",
"Children": [
{
"PresentationType": "Text",
"Text": "Are you sure?",
"FontWeight": "bold",
"FontSize": 18
},
{
"PresentationType": "SizedBox",
"Height": 8
},
{
"PresentationType": "Text",
"SoftWrap": true,
"Text": "This is a Zero modal — any presentation JSON can go here.",
"Color": "#5A6473"
}
]
}
}
}
}
],
"x-version": "1.0",
"required": [
"Handler"
],
"properties": {
"Handler": {
"const": "Modal"
},
"MaxWidth": {
"type": "number"
},
"Width": {
"type": "number"
},
"Duration": {
"type": "integer"
},
"AnimationDuration": {
"type": "integer"
},
"Animation": {
"type": "string"
},
"AnimationStyle": {
"type": "string"
},
"AutoDismiss": {
"type": "integer"
},
"AutoClose": {
"type": "integer"
},
"BackgroundColor": {
"type": "string"
},
"Child": {
"$ref": "/schema/shared/Widget/1.0/index.json"
},
"Url": {
"type": "string"
},
"OnSuccess": {
"$ref": "/schema/Actions/Action/1.0/index.json"
},
"OnFailure": {
"$ref": "/schema/Actions/Action/1.0/index.json"
}
},
"additionalProperties": false,
"x-icon": "<svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.7\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/><rect x=\"7\" y=\"8\" width=\"10\" height=\"8\" rx=\"1\"/></svg>",
"$id": "/schema/Actions/Modal/1.0/index.json",
"x-family": "Actions",
"x-name": "Modal",
"x-source-package": "zero-schema"
}
Modal renders any widget in a dialog. Pass a Child (inline JSON) or a Url that fetches another presentation. The user dismisses with the scrim or a close action inside.
{
"PresentationType": "Button",
"Text": "Open dialog",
"BorderRadius": 6,
"Color": "#FFFFFF",
"BackgroundColor": "#2F6FED",
"OnClick": {
"Handler": "Modal",
"MaxWidth": 420,
"Child": {
"PresentationType": "Column",
"Children": [
{
"PresentationType": "Text",
"Text": "Are you sure?",
"FontWeight": "bold",
"FontSize": 18
},
{
"PresentationType": "SizedBox",
"Height": 8
},
{
"PresentationType": "Text",
"SoftWrap": true,
"Text": "This is a Zero modal — any presentation JSON can go here.",
"Color": "#5A6473"
}
]
}
}
}