Models
Vizro pydantic models, typically aliased as vm using import vizro.models as vm.
pydantic-model
Accordion to be used as nav_selector in Navigation.
Usage documentation
Show JSON schema:
{
"additionalProperties": false,
"description": "Accordion to be used as `nav_selector` in [`Navigation`][vizro.models.Navigation].\n\nAbstract: Usage documentation\n [How to use an accordion](user-guides/navigation.md/#group-pages)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "accordion",
"default": "accordion",
"title": "Type",
"type": "string"
},
"pages": {
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"default": {},
"description": "Mapping from name of a pages group to a list of page IDs/titles.",
"title": "Pages",
"type": "object"
}
},
"title": "Accordion",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
pages
Mapping from name of a pages group to a list of page IDs/titles.
pydantic-model
Custom action to be inserted into actions of source component.
Usage documentation
Show JSON schema:
{
"$defs": {
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
function
Action function.
inputs
List of inputs provided to the action function. Each input can be specified as
<model_id> or <model_id>.<argument_name> or <component_id>.<property>.
❗Deprecated: inputs is deprecated and will not exist in Vizro 0.2.0.
outputs
notifications
Notifications for when an action is in progress, completes successfully or fails
pydantic-model
Wrapper for dash_ag_grid.AgGrid to visualize grids in a dashboard.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Wrapper for `dash_ag_grid.AgGrid` to visualize grids in a dashboard.\n\nAbstract: Usage documentation\n [How to use an AgGrid](user-guides/table.md/#ag-grid)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "ag_grid",
"default": "ag_grid",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `AgGrid`.",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `AgGrid.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `AgGrid`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "AgGrid",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
figure
Function that returns a Dash AG Grid.
title
Title of the AgGrid.
header
Markdown text positioned below the AgGrid.title. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.
footer
Markdown text positioned below the AgGrid. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
actions
pydantic-model
Button that can trigger actions or navigate.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Button that can trigger actions or navigate.\n\nAbstract: Usage documentation\n [How to use buttons](user-guides/button.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "button",
"default": "button",
"title": "Type",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
},
"text": {
"default": "Click me!",
"description": "Text to be displayed on button.",
"title": "Text",
"type": "string"
},
"href": {
"default": "",
"description": "URL (relative or absolute) to navigate to.",
"title": "Href",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `plain`, `filled` or `outlined`.",
"enum": [
"plain",
"filled",
"outlined"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the button text.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"title": "Button",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
icon
Icon name from Google Material icons library.
text
Text to be displayed on button.
href
URL (relative or absolute) to navigate to.
actions
variant
Predefined styles to choose from. Options are plain, filled or outlined.
description
Optional markdown string that adds an icon next to the button text. Hovering over the icon shows a tooltip with the provided description.
extra
Extra keyword arguments that are passed to dbc.Button and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dbc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Card based on Markdown syntax.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Card based on Markdown syntax.\n\nAbstract: Usage documentation\n [How to use cards](user-guides/card.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "card",
"default": "card",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown string to create card title/text that should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned above the card text. Follows the CommonMark specification. Ideal for\n adding supplementary information.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned at the bottom of the `Card`. Follows the CommonMark specification.\n Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"href": {
"default": "",
"description": "URL (relative or absolute) to navigate to. If not provided the Card serves as a text card only.",
"title": "Href",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon in the top-right corner of the Card.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"required": [
"text"
],
"title": "Card",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
text
Markdown string to create card title/text that should adhere to the CommonMark Spec.
header
Markdown text positioned above the card text. Follows the CommonMark specification. Ideal for adding supplementary information.
footer
Markdown text positioned at the bottom of the Card. Follows the CommonMark specification.
Ideal for providing further details such as sources, disclaimers, or additional notes.
href
URL (relative or absolute) to navigate to. If not provided the Card serves as a text card only.
description
Optional markdown string that adds an icon in the top-right corner of the Card. Hovering over the icon shows a tooltip with the provided description.
extra
Extra keyword arguments that are passed to dbc.Card and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dbc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
actions
pydantic-model
Cascader selector for Filter and Parameter.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Cascader selector for [`Filter`][vizro.models.Filter] and [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [Hierarchical selectors](user-guides/selectors.md#hierarchical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "cascader",
"default": "cascader",
"title": "Type",
"type": "string"
},
"options": {
"additionalProperties": true,
"default": {},
"description": "Nested tree: dict keys are branch labels; each branch is a dict or a non-empty list of scalar leaf values (str, int, float, bool, or date).",
"title": "Options",
"type": "object"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"description": "Selected leaf value, or list of leaves when multi=True. Must be valid for `options`. If omitted, the first parent node is selected.",
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to allow selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Cascader",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
options
Nested tree: dict keys are branch labels; each branch is a dict or a non-empty list of scalar leaf values (str, int, float, bool, or date).
value
Selected leaf value, or list of leaves when multi=True. Must be valid for options. If omitted, the first parent node is selected.
multi
Whether to allow selection of multiple values
title
Title to be displayed
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
actions
extra
Extra keyword arguments that are passed to vdc.Cascader and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the vdc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Categorical multi-option selector.
Can be provided to Filter or Parameter.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"_OptionsDictType": {
"additionalProperties": false,
"description": "Permissible sub-type for OptionsType. Needs to be in the format of {\"label\": XXX, \"value\": XXX}.",
"properties": {
"label": {
"title": "Label",
"type": "string"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
],
"title": "Value"
}
},
"required": [
"label",
"value"
],
"title": "_OptionsDictType",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Categorical multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "checklist",
"default": "checklist",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"show_select_all": {
"default": true,
"description": "Whether to display the 'Select All' option that enables users to select or deselect all available options with a single click.",
"title": "Show Select All",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Checklist",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
options
value
title
Title to be displayed
show_select_all
Whether to display the 'Select All' option that enables users to select or deselect all available options with a single click.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
actions
extra
Extra keyword arguments that are passed to dbc.Checklist and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dbc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Container to group together a set of components on a page.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"AgGrid": {
"additionalProperties": false,
"description": "Wrapper for `dash_ag_grid.AgGrid` to visualize grids in a dashboard.\n\nAbstract: Usage documentation\n [How to use an AgGrid](user-guides/table.md/#ag-grid)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "ag_grid",
"default": "ag_grid",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `AgGrid`.",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `AgGrid.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `AgGrid`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "AgGrid",
"type": "object"
},
"Button": {
"additionalProperties": false,
"description": "Button that can trigger actions or navigate.\n\nAbstract: Usage documentation\n [How to use buttons](user-guides/button.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "button",
"default": "button",
"title": "Type",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
},
"text": {
"default": "Click me!",
"description": "Text to be displayed on button.",
"title": "Text",
"type": "string"
},
"href": {
"default": "",
"description": "URL (relative or absolute) to navigate to.",
"title": "Href",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `plain`, `filled` or `outlined`.",
"enum": [
"plain",
"filled",
"outlined"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the button text.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"title": "Button",
"type": "object"
},
"Card": {
"additionalProperties": false,
"description": "Card based on Markdown syntax.\n\nAbstract: Usage documentation\n [How to use cards](user-guides/card.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "card",
"default": "card",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown string to create card title/text that should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned above the card text. Follows the CommonMark specification. Ideal for\n adding supplementary information.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned at the bottom of the `Card`. Follows the CommonMark specification.\n Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"href": {
"default": "",
"description": "URL (relative or absolute) to navigate to. If not provided the Card serves as a text card only.",
"title": "Href",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon in the top-right corner of the Card.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"required": [
"text"
],
"title": "Card",
"type": "object"
},
"Cascader": {
"additionalProperties": false,
"description": "Cascader selector for [`Filter`][vizro.models.Filter] and [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [Hierarchical selectors](user-guides/selectors.md#hierarchical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "cascader",
"default": "cascader",
"title": "Type",
"type": "string"
},
"options": {
"additionalProperties": true,
"default": {},
"description": "Nested tree: dict keys are branch labels; each branch is a dict or a non-empty list of scalar leaf values (str, int, float, bool, or date).",
"title": "Options",
"type": "object"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"description": "Selected leaf value, or list of leaves when multi=True. Must be valid for `options`. If omitted, the first parent node is selected.",
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to allow selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Cascader",
"type": "object"
},
"Checklist": {
"additionalProperties": false,
"description": "Categorical multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "checklist",
"default": "checklist",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"show_select_all": {
"default": true,
"description": "Whether to display the 'Select All' option that enables users to select or deselect all available options with a single click.",
"title": "Show Select All",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Checklist",
"type": "object"
},
"Container": {
"additionalProperties": false,
"description": "Container to group together a set of components on a page.\n\nAbstract: Usage documentation\n [How to use containers](user-guides/container.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "container",
"default": "container",
"title": "Type",
"type": "string"
},
"components": {
"items": {
"description": "Component that makes up part of the layout on the page.",
"discriminator": {
"mapping": {
"ag_grid": "#/$defs/AgGrid",
"button": "#/$defs/Button",
"card": "#/$defs/Card",
"container": "#/$defs/Container",
"figure": "#/$defs/Figure",
"graph": "#/$defs/Graph",
"table": "#/$defs/Table",
"tabs": "#/$defs/Tabs",
"text": "#/$defs/Text"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/AgGrid"
},
{
"$ref": "#/$defs/Button"
},
{
"$ref": "#/$defs/Card"
},
{
"$ref": "#/$defs/Container"
},
{
"$ref": "#/$defs/Figure"
},
{
"$ref": "#/$defs/Graph"
},
{
"$ref": "#/$defs/Text"
},
{
"$ref": "#/$defs/Table"
},
{
"$ref": "#/$defs/Tabs"
}
]
},
"minItems": 1,
"title": "Components",
"type": "array"
},
"title": {
"default": "",
"description": "Title of the `Container`",
"title": "Title",
"type": "string"
},
"layout": {
"anyOf": [
{
"description": "Type of layout to place components on the page.",
"oneOf": [
{
"$ref": "#/$defs/Grid"
},
{
"$ref": "#/$defs/Flex"
},
{
"$ref": "#/$defs/Layout"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Layout"
},
"collapsed": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "null"
}
],
"default": null,
"description": "Boolean flag that determines whether the container is collapsed on initial load. Set to `True` for a collapsed state, `False` for an expanded state. Defaults to `None`, meaning the container is not collapsible.",
"title": "Collapsed"
},
"variant": {
"anyOf": [
{
"enum": [
"plain",
"filled",
"outlined"
],
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Predefined styles to choose from. Options are `plain`, `filled` or `outlined`. Defaults to `plain` (or `outlined` for collapsible container). ",
"title": "Variant"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"controls": {
"default": [],
"items": {
"description": "Control that affects components on the page.",
"discriminator": {
"mapping": {
"filter": "#/$defs/Filter",
"parameter": "#/$defs/Parameter"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Filter"
},
{
"$ref": "#/$defs/Parameter"
}
]
},
"title": "Controls",
"type": "array"
}
},
"required": [
"components"
],
"title": "Container",
"type": "object"
},
"DatePicker": {
"additionalProperties": false,
"description": "Temporal single/range option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use temporal selectors](user-guides/selectors.md#temporal-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "date_picker",
"default": "date_picker",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Start date for date picker.",
"title": "Min"
},
"max": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "End date for date picker.",
"title": "Max"
},
"value": {
"anyOf": [
{
"items": {
"format": "date",
"type": "string"
},
"type": "array"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Default date/dates for date picker.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"range": {
"default": true,
"description": "Boolean flag for displaying range picker.",
"title": "Range",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "DatePicker",
"type": "object"
},
"Dropdown": {
"additionalProperties": false,
"description": "Categorical single/multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "dropdown",
"default": "dropdown",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to enable selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `filled` or `plain`.",
"enum": [
"plain",
"filled"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Dropdown",
"type": "object"
},
"Figure": {
"additionalProperties": false,
"description": "Object that is reactive to controls, for example a KPI card.\n\nAbstract: Usage documentation\n [How to use figures](user-guides/figure.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "figure",
"default": "figure",
"title": "Type",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Figure",
"type": "object"
},
"Filter": {
"additionalProperties": false,
"description": "Filter the data supplied to `targets`.\n\nAbstract: Usage documentation\n [How to use filters](user-guides/filters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Filter(column=\"species\")\n vm.Filter(column=[\"continent\", \"country\"])\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter",
"default": "filter",
"title": "Type",
"type": "string"
},
"column": {
"anyOf": [
{
"type": "string"
},
{
"items": {
"type": "string"
},
"type": "array"
}
],
"description": "Name of the column to filter, or an ordered list of column names for a hierarchical filter.",
"title": "Column"
},
"targets": {
"default": [],
"description": "Target component to be affected by filter. If none are given then target all components on the page that use `column`.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"anyOf": [
{
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the filter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific filter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the filter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"column"
],
"title": "Filter",
"type": "object"
},
"Flex": {
"additionalProperties": false,
"description": "Flex layout for components on a [`Page`][vizro.models.Page] or in a [`Container`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use the Flex layout](user-guides/layouts.md#flex-layout)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "flex",
"default": "flex",
"title": "Type",
"type": "string"
},
"direction": {
"default": "column",
"description": "Sets the direction of the flex items inside the container. Options are `row` or `column`.",
"enum": [
"row",
"column"
],
"title": "Direction",
"type": "string"
},
"gap": {
"default": "24px",
"description": "Specifies the gap between rows and columns. Allowed units: 'px', 'rem', 'em', or '%'.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Gap",
"type": "string"
},
"wrap": {
"default": false,
"description": "Determines whether flex items are forced onto a single line or can wrap onto multiple lines. If `False`, all items will be on one line. If `True`, items will wrap onto multiple lines.",
"title": "Wrap",
"type": "boolean"
}
},
"title": "Flex",
"type": "object"
},
"Graph": {
"additionalProperties": false,
"description": "Wrapper for `dcc.Graph` to visualize charts.\n\nAbstract: Usage documentation\n [How to use graphs](user-guides/graph.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "graph",
"default": "graph",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `Graph`",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `Graph.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `Graph`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Graph",
"type": "object"
},
"Grid": {
"additionalProperties": false,
"description": "Grid layout for components on a [`Page`][vizro.models.Page] or in a [`Container`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use the Grid layout](user-guides/layouts.md#grid-layout)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "grid",
"default": "grid",
"title": "Type",
"type": "string"
},
"grid": {
"description": "Grid specification to arrange components on screen.",
"items": {
"items": {
"type": "integer"
},
"type": "array"
},
"title": "Grid",
"type": "array"
},
"row_gap": {
"default": "24px",
"description": "Specifies the gap between rows. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Gap",
"type": "string"
},
"col_gap": {
"default": "24px",
"description": "Specifies the gap between columns. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Gap",
"type": "string"
},
"row_min_height": {
"default": "0px",
"description": "Minimum row height in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Min Height",
"type": "string"
},
"col_min_width": {
"default": "0px",
"description": "Minimum column width in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Min Width",
"type": "string"
}
},
"required": [
"grid"
],
"title": "Grid",
"type": "object"
},
"JsonValue": {},
"Layout": {
"additionalProperties": false,
"deprecated": true,
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "legacy_layout",
"default": "legacy_layout",
"title": "Type",
"type": "string"
},
"grid": {
"description": "Grid specification to arrange components on screen.",
"items": {
"items": {
"type": "integer"
},
"type": "array"
},
"title": "Grid",
"type": "array"
},
"row_gap": {
"default": "24px",
"description": "Specifies the gap between rows. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Gap",
"type": "string"
},
"col_gap": {
"default": "24px",
"description": "Specifies the gap between columns. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Gap",
"type": "string"
},
"row_min_height": {
"default": "0px",
"description": "Minimum row height in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Min Height",
"type": "string"
},
"col_min_width": {
"default": "0px",
"description": "Minimum column width in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Min Width",
"type": "string"
}
},
"required": [
"grid"
],
"title": "Layout",
"type": "object"
},
"Parameter": {
"additionalProperties": false,
"description": "Alter the arguments supplied to any `targets`.\n\nAbstract: Usage documentation\n [How to use parameters](user-guides/parameters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Parameter(targets=[\"scatter.x\"], selector=vm.Slider(min=0, max=1, default=0.8, title=\"Bubble opacity\"))\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "parameter",
"default": "parameter",
"title": "Type",
"type": "string"
},
"targets": {
"items": {
"description": "Targets in the form of `<target_component>.<target_argument>`.",
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
],
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the parameter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific parameter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the parameter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"targets",
"selector"
],
"title": "Parameter",
"type": "object"
},
"RadioItems": {
"additionalProperties": false,
"description": "Categorical single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md/#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "radio_items",
"default": "radio_items",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RadioItems",
"type": "object"
},
"RangeSlider": {
"additionalProperties": false,
"description": "Numeric multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "range_slider",
"default": "range_slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"items": {
"type": "number"
},
"maxItems": 2,
"minItems": 2,
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RangeSlider",
"type": "object"
},
"Slider": {
"additionalProperties": false,
"description": "Numeric single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "slider",
"default": "slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Default value for slider.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Slider",
"type": "object"
},
"Switch": {
"additionalProperties": false,
"description": "Boolean single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use boolean selectors](user-guides/selectors.md/#boolean-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "switch",
"default": "switch",
"title": "Type",
"type": "string"
},
"value": {
"default": false,
"description": "Initial state of the switch. When `True`, the switch is enabled/on.\n When `False`, the switch is disabled/off.",
"title": "Value",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title/Label to be displayed to the right of the switch.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Switch",
"type": "object"
},
"Table": {
"additionalProperties": false,
"description": "Wrapper for `dash_table.DataTable` to visualize tables in dashboard.\n\nAbstract: Usage documentation\n [How to use tables](user-guides/table.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "table",
"default": "table",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `Table`",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `Table.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `Table`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Table",
"type": "object"
},
"Tabs": {
"additionalProperties": false,
"description": "Tabs to group together a set of [`Containers`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use tabs](user-guides/tabs.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "tabs",
"default": "tabs",
"title": "Type",
"type": "string"
},
"tabs": {
"items": {
"$ref": "#/$defs/Container"
},
"minItems": 1,
"title": "Tabs",
"type": "array"
},
"title": {
"default": "",
"description": "Title displayed above Tabs.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"required": [
"tabs"
],
"title": "Tabs",
"type": "object"
},
"Text": {
"additionalProperties": false,
"description": "Text based on Markdown syntax.\n\nAbstract: Usage documentation\n [How to add text to your page](user-guides/text.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "text",
"default": "text",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown string to create text that should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
}
},
"required": [
"text"
],
"title": "Text",
"type": "object"
},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"_OptionsDictType": {
"additionalProperties": false,
"description": "Permissible sub-type for OptionsType. Needs to be in the format of {\"label\": XXX, \"value\": XXX}.",
"properties": {
"label": {
"title": "Label",
"type": "string"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
],
"title": "Value"
}
},
"required": [
"label",
"value"
],
"title": "_OptionsDictType",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"$ref": "#/$defs/Container"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
components
title
Title of the Container
layout
collapsed
Boolean flag that determines whether the container is collapsed on initial load. Set to True for a collapsed state, False for an expanded state. Defaults to None, meaning the container is not collapsible.
variant
Predefined styles to choose from. Options are plain, filled or outlined. Defaults to plain (or outlined for collapsible container).
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
controls
extra
Extra keyword arguments that are passed to dbc.Container and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dbc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Container to group together a set of controls.
Usage documentation
Example
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"Cascader": {
"additionalProperties": false,
"description": "Cascader selector for [`Filter`][vizro.models.Filter] and [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [Hierarchical selectors](user-guides/selectors.md#hierarchical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "cascader",
"default": "cascader",
"title": "Type",
"type": "string"
},
"options": {
"additionalProperties": true,
"default": {},
"description": "Nested tree: dict keys are branch labels; each branch is a dict or a non-empty list of scalar leaf values (str, int, float, bool, or date).",
"title": "Options",
"type": "object"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"description": "Selected leaf value, or list of leaves when multi=True. Must be valid for `options`. If omitted, the first parent node is selected.",
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to allow selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Cascader",
"type": "object"
},
"Checklist": {
"additionalProperties": false,
"description": "Categorical multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "checklist",
"default": "checklist",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"show_select_all": {
"default": true,
"description": "Whether to display the 'Select All' option that enables users to select or deselect all available options with a single click.",
"title": "Show Select All",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Checklist",
"type": "object"
},
"DatePicker": {
"additionalProperties": false,
"description": "Temporal single/range option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use temporal selectors](user-guides/selectors.md#temporal-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "date_picker",
"default": "date_picker",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Start date for date picker.",
"title": "Min"
},
"max": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "End date for date picker.",
"title": "Max"
},
"value": {
"anyOf": [
{
"items": {
"format": "date",
"type": "string"
},
"type": "array"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Default date/dates for date picker.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"range": {
"default": true,
"description": "Boolean flag for displaying range picker.",
"title": "Range",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "DatePicker",
"type": "object"
},
"Dropdown": {
"additionalProperties": false,
"description": "Categorical single/multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "dropdown",
"default": "dropdown",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to enable selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `filled` or `plain`.",
"enum": [
"plain",
"filled"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Dropdown",
"type": "object"
},
"Filter": {
"additionalProperties": false,
"description": "Filter the data supplied to `targets`.\n\nAbstract: Usage documentation\n [How to use filters](user-guides/filters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Filter(column=\"species\")\n vm.Filter(column=[\"continent\", \"country\"])\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter",
"default": "filter",
"title": "Type",
"type": "string"
},
"column": {
"anyOf": [
{
"type": "string"
},
{
"items": {
"type": "string"
},
"type": "array"
}
],
"description": "Name of the column to filter, or an ordered list of column names for a hierarchical filter.",
"title": "Column"
},
"targets": {
"default": [],
"description": "Target component to be affected by filter. If none are given then target all components on the page that use `column`.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"anyOf": [
{
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the filter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific filter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the filter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"column"
],
"title": "Filter",
"type": "object"
},
"JsonValue": {},
"Parameter": {
"additionalProperties": false,
"description": "Alter the arguments supplied to any `targets`.\n\nAbstract: Usage documentation\n [How to use parameters](user-guides/parameters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Parameter(targets=[\"scatter.x\"], selector=vm.Slider(min=0, max=1, default=0.8, title=\"Bubble opacity\"))\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "parameter",
"default": "parameter",
"title": "Type",
"type": "string"
},
"targets": {
"items": {
"description": "Targets in the form of `<target_component>.<target_argument>`.",
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
],
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the parameter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific parameter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the parameter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"targets",
"selector"
],
"title": "Parameter",
"type": "object"
},
"RadioItems": {
"additionalProperties": false,
"description": "Categorical single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md/#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "radio_items",
"default": "radio_items",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RadioItems",
"type": "object"
},
"RangeSlider": {
"additionalProperties": false,
"description": "Numeric multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "range_slider",
"default": "range_slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"items": {
"type": "number"
},
"maxItems": 2,
"minItems": 2,
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RangeSlider",
"type": "object"
},
"Slider": {
"additionalProperties": false,
"description": "Numeric single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "slider",
"default": "slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Default value for slider.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Slider",
"type": "object"
},
"Switch": {
"additionalProperties": false,
"description": "Boolean single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use boolean selectors](user-guides/selectors.md/#boolean-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "switch",
"default": "switch",
"title": "Type",
"type": "string"
},
"value": {
"default": false,
"description": "Initial state of the switch. When `True`, the switch is enabled/on.\n When `False`, the switch is disabled/off.",
"title": "Value",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title/Label to be displayed to the right of the switch.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Switch",
"type": "object"
},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"_OptionsDictType": {
"additionalProperties": false,
"description": "Permissible sub-type for OptionsType. Needs to be in the format of {\"label\": XXX, \"value\": XXX}.",
"properties": {
"label": {
"title": "Label",
"type": "string"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
],
"title": "Value"
}
},
"required": [
"label",
"value"
],
"title": "_OptionsDictType",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Container to group together a set of controls.\n\nAbstract: Usage documentation\n [How to group controls](user-guides/controls.md/#group-controls)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.ControlGroup(\n title=\"Control group title\",\n controls=[vm.Filter(column=\"species\"), vm.Filter(column=\"sepal_length\")],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "control_group",
"default": "control_group",
"title": "Type",
"type": "string"
},
"controls": {
"items": {
"description": "Control that affects components on the page.",
"discriminator": {
"mapping": {
"filter": "#/$defs/Filter",
"parameter": "#/$defs/Parameter"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Filter"
},
{
"$ref": "#/$defs/Parameter"
}
]
},
"minItems": 1,
"title": "Controls",
"type": "array"
},
"title": {
"default": "",
"description": "Title of the control group.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"required": [
"controls"
],
"title": "ControlGroup",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
controls
title
Title of the control group.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
extra
Extra keyword arguments that are passed to dbc.Container and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dbc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Dashboard that is supplied to Vizro.build.
Usage documentation
Show JSON schema:
{
"$defs": {
"Accordion": {
"additionalProperties": false,
"description": "Accordion to be used as `nav_selector` in [`Navigation`][vizro.models.Navigation].\n\nAbstract: Usage documentation\n [How to use an accordion](user-guides/navigation.md/#group-pages)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "accordion",
"default": "accordion",
"title": "Type",
"type": "string"
},
"pages": {
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"default": {},
"description": "Mapping from name of a pages group to a list of page IDs/titles.",
"title": "Pages",
"type": "object"
}
},
"title": "Accordion",
"type": "object"
},
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"AgGrid": {
"additionalProperties": false,
"description": "Wrapper for `dash_ag_grid.AgGrid` to visualize grids in a dashboard.\n\nAbstract: Usage documentation\n [How to use an AgGrid](user-guides/table.md/#ag-grid)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "ag_grid",
"default": "ag_grid",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `AgGrid`.",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `AgGrid.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `AgGrid`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "AgGrid",
"type": "object"
},
"Button": {
"additionalProperties": false,
"description": "Button that can trigger actions or navigate.\n\nAbstract: Usage documentation\n [How to use buttons](user-guides/button.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "button",
"default": "button",
"title": "Type",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
},
"text": {
"default": "Click me!",
"description": "Text to be displayed on button.",
"title": "Text",
"type": "string"
},
"href": {
"default": "",
"description": "URL (relative or absolute) to navigate to.",
"title": "Href",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `plain`, `filled` or `outlined`.",
"enum": [
"plain",
"filled",
"outlined"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the button text.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"title": "Button",
"type": "object"
},
"Card": {
"additionalProperties": false,
"description": "Card based on Markdown syntax.\n\nAbstract: Usage documentation\n [How to use cards](user-guides/card.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "card",
"default": "card",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown string to create card title/text that should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned above the card text. Follows the CommonMark specification. Ideal for\n adding supplementary information.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned at the bottom of the `Card`. Follows the CommonMark specification.\n Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"href": {
"default": "",
"description": "URL (relative or absolute) to navigate to. If not provided the Card serves as a text card only.",
"title": "Href",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon in the top-right corner of the Card.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"required": [
"text"
],
"title": "Card",
"type": "object"
},
"Cascader": {
"additionalProperties": false,
"description": "Cascader selector for [`Filter`][vizro.models.Filter] and [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [Hierarchical selectors](user-guides/selectors.md#hierarchical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "cascader",
"default": "cascader",
"title": "Type",
"type": "string"
},
"options": {
"additionalProperties": true,
"default": {},
"description": "Nested tree: dict keys are branch labels; each branch is a dict or a non-empty list of scalar leaf values (str, int, float, bool, or date).",
"title": "Options",
"type": "object"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"description": "Selected leaf value, or list of leaves when multi=True. Must be valid for `options`. If omitted, the first parent node is selected.",
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to allow selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Cascader",
"type": "object"
},
"Checklist": {
"additionalProperties": false,
"description": "Categorical multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "checklist",
"default": "checklist",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"show_select_all": {
"default": true,
"description": "Whether to display the 'Select All' option that enables users to select or deselect all available options with a single click.",
"title": "Show Select All",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Checklist",
"type": "object"
},
"Container": {
"additionalProperties": false,
"description": "Container to group together a set of components on a page.\n\nAbstract: Usage documentation\n [How to use containers](user-guides/container.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "container",
"default": "container",
"title": "Type",
"type": "string"
},
"components": {
"items": {
"description": "Component that makes up part of the layout on the page.",
"discriminator": {
"mapping": {
"ag_grid": "#/$defs/AgGrid",
"button": "#/$defs/Button",
"card": "#/$defs/Card",
"container": "#/$defs/Container",
"figure": "#/$defs/Figure",
"graph": "#/$defs/Graph",
"table": "#/$defs/Table",
"tabs": "#/$defs/Tabs",
"text": "#/$defs/Text"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/AgGrid"
},
{
"$ref": "#/$defs/Button"
},
{
"$ref": "#/$defs/Card"
},
{
"$ref": "#/$defs/Container"
},
{
"$ref": "#/$defs/Figure"
},
{
"$ref": "#/$defs/Graph"
},
{
"$ref": "#/$defs/Text"
},
{
"$ref": "#/$defs/Table"
},
{
"$ref": "#/$defs/Tabs"
}
]
},
"minItems": 1,
"title": "Components",
"type": "array"
},
"title": {
"default": "",
"description": "Title of the `Container`",
"title": "Title",
"type": "string"
},
"layout": {
"anyOf": [
{
"description": "Type of layout to place components on the page.",
"oneOf": [
{
"$ref": "#/$defs/Grid"
},
{
"$ref": "#/$defs/Flex"
},
{
"$ref": "#/$defs/Layout"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Layout"
},
"collapsed": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "null"
}
],
"default": null,
"description": "Boolean flag that determines whether the container is collapsed on initial load. Set to `True` for a collapsed state, `False` for an expanded state. Defaults to `None`, meaning the container is not collapsible.",
"title": "Collapsed"
},
"variant": {
"anyOf": [
{
"enum": [
"plain",
"filled",
"outlined"
],
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Predefined styles to choose from. Options are `plain`, `filled` or `outlined`. Defaults to `plain` (or `outlined` for collapsible container). ",
"title": "Variant"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"controls": {
"default": [],
"items": {
"description": "Control that affects components on the page.",
"discriminator": {
"mapping": {
"filter": "#/$defs/Filter",
"parameter": "#/$defs/Parameter"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Filter"
},
{
"$ref": "#/$defs/Parameter"
}
]
},
"title": "Controls",
"type": "array"
}
},
"required": [
"components"
],
"title": "Container",
"type": "object"
},
"ControlGroup": {
"additionalProperties": false,
"description": "Container to group together a set of controls.\n\nAbstract: Usage documentation\n [How to group controls](user-guides/controls.md/#group-controls)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.ControlGroup(\n title=\"Control group title\",\n controls=[vm.Filter(column=\"species\"), vm.Filter(column=\"sepal_length\")],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "control_group",
"default": "control_group",
"title": "Type",
"type": "string"
},
"controls": {
"items": {
"description": "Control that affects components on the page.",
"discriminator": {
"mapping": {
"filter": "#/$defs/Filter",
"parameter": "#/$defs/Parameter"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Filter"
},
{
"$ref": "#/$defs/Parameter"
}
]
},
"minItems": 1,
"title": "Controls",
"type": "array"
},
"title": {
"default": "",
"description": "Title of the control group.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"required": [
"controls"
],
"title": "ControlGroup",
"type": "object"
},
"DatePicker": {
"additionalProperties": false,
"description": "Temporal single/range option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use temporal selectors](user-guides/selectors.md#temporal-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "date_picker",
"default": "date_picker",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Start date for date picker.",
"title": "Min"
},
"max": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "End date for date picker.",
"title": "Max"
},
"value": {
"anyOf": [
{
"items": {
"format": "date",
"type": "string"
},
"type": "array"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Default date/dates for date picker.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"range": {
"default": true,
"description": "Boolean flag for displaying range picker.",
"title": "Range",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "DatePicker",
"type": "object"
},
"Dropdown": {
"additionalProperties": false,
"description": "Categorical single/multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "dropdown",
"default": "dropdown",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to enable selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `filled` or `plain`.",
"enum": [
"plain",
"filled"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Dropdown",
"type": "object"
},
"Figure": {
"additionalProperties": false,
"description": "Object that is reactive to controls, for example a KPI card.\n\nAbstract: Usage documentation\n [How to use figures](user-guides/figure.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "figure",
"default": "figure",
"title": "Type",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Figure",
"type": "object"
},
"Filter": {
"additionalProperties": false,
"description": "Filter the data supplied to `targets`.\n\nAbstract: Usage documentation\n [How to use filters](user-guides/filters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Filter(column=\"species\")\n vm.Filter(column=[\"continent\", \"country\"])\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter",
"default": "filter",
"title": "Type",
"type": "string"
},
"column": {
"anyOf": [
{
"type": "string"
},
{
"items": {
"type": "string"
},
"type": "array"
}
],
"description": "Name of the column to filter, or an ordered list of column names for a hierarchical filter.",
"title": "Column"
},
"targets": {
"default": [],
"description": "Target component to be affected by filter. If none are given then target all components on the page that use `column`.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"anyOf": [
{
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the filter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific filter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the filter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"column"
],
"title": "Filter",
"type": "object"
},
"Flex": {
"additionalProperties": false,
"description": "Flex layout for components on a [`Page`][vizro.models.Page] or in a [`Container`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use the Flex layout](user-guides/layouts.md#flex-layout)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "flex",
"default": "flex",
"title": "Type",
"type": "string"
},
"direction": {
"default": "column",
"description": "Sets the direction of the flex items inside the container. Options are `row` or `column`.",
"enum": [
"row",
"column"
],
"title": "Direction",
"type": "string"
},
"gap": {
"default": "24px",
"description": "Specifies the gap between rows and columns. Allowed units: 'px', 'rem', 'em', or '%'.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Gap",
"type": "string"
},
"wrap": {
"default": false,
"description": "Determines whether flex items are forced onto a single line or can wrap onto multiple lines. If `False`, all items will be on one line. If `True`, items will wrap onto multiple lines.",
"title": "Wrap",
"type": "boolean"
}
},
"title": "Flex",
"type": "object"
},
"Graph": {
"additionalProperties": false,
"description": "Wrapper for `dcc.Graph` to visualize charts.\n\nAbstract: Usage documentation\n [How to use graphs](user-guides/graph.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "graph",
"default": "graph",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `Graph`",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `Graph.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `Graph`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Graph",
"type": "object"
},
"Grid": {
"additionalProperties": false,
"description": "Grid layout for components on a [`Page`][vizro.models.Page] or in a [`Container`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use the Grid layout](user-guides/layouts.md#grid-layout)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "grid",
"default": "grid",
"title": "Type",
"type": "string"
},
"grid": {
"description": "Grid specification to arrange components on screen.",
"items": {
"items": {
"type": "integer"
},
"type": "array"
},
"title": "Grid",
"type": "array"
},
"row_gap": {
"default": "24px",
"description": "Specifies the gap between rows. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Gap",
"type": "string"
},
"col_gap": {
"default": "24px",
"description": "Specifies the gap between columns. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Gap",
"type": "string"
},
"row_min_height": {
"default": "0px",
"description": "Minimum row height in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Min Height",
"type": "string"
},
"col_min_width": {
"default": "0px",
"description": "Minimum column width in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Min Width",
"type": "string"
}
},
"required": [
"grid"
],
"title": "Grid",
"type": "object"
},
"JsonValue": {},
"Layout": {
"additionalProperties": false,
"deprecated": true,
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "legacy_layout",
"default": "legacy_layout",
"title": "Type",
"type": "string"
},
"grid": {
"description": "Grid specification to arrange components on screen.",
"items": {
"items": {
"type": "integer"
},
"type": "array"
},
"title": "Grid",
"type": "array"
},
"row_gap": {
"default": "24px",
"description": "Specifies the gap between rows. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Gap",
"type": "string"
},
"col_gap": {
"default": "24px",
"description": "Specifies the gap between columns. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Gap",
"type": "string"
},
"row_min_height": {
"default": "0px",
"description": "Minimum row height in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Min Height",
"type": "string"
},
"col_min_width": {
"default": "0px",
"description": "Minimum column width in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Min Width",
"type": "string"
}
},
"required": [
"grid"
],
"title": "Layout",
"type": "object"
},
"NavBar": {
"additionalProperties": false,
"description": "Navigation bar to be used as a `nav_selector` for `Navigation`.\n\nAbstract: Usage documentation\n [How to use the navigation bar](user-guides/navigation.md#use-a-navigation-bar-with-icons)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "nav_bar",
"default": "nav_bar",
"title": "Type",
"type": "string"
},
"pages": {
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"default": {},
"description": "Mapping from name of a pages group to a list of page IDs/titles.",
"title": "Pages",
"type": "object"
},
"items": {
"default": [],
"items": {
"$ref": "#/$defs/NavLink"
},
"title": "Items",
"type": "array"
},
"position": {
"default": "left",
"description": "Position of the navigation bar, either on the left sidebar or top header.",
"enum": [
"left",
"top"
],
"title": "Position",
"type": "string"
}
},
"title": "NavBar",
"type": "object"
},
"NavLink": {
"additionalProperties": false,
"description": "Icon that serves as a navigation link to be used in a [`NavBar`][vizro.models.NavBar].\n\nAbstract: Usage documentation\n [How to customize the NavBar icons](user-guides/navigation.md#change-icons)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"pages": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"type": "object"
}
],
"default": [],
"title": "Pages"
},
"label": {
"description": "Text description of the icon for use in tooltip.",
"title": "Label",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"label"
],
"title": "NavLink",
"type": "object"
},
"Navigation": {
"additionalProperties": false,
"description": "Navigation to arrange hierarchy of [`Pages`][vizro.models.Page].\n\nAbstract: Usage documentation\n [How to customize the navigation](user-guides/navigation.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"pages": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"type": "object"
}
],
"default": [],
"title": "Pages"
},
"nav_selector": {
"anyOf": [
{
"description": "Component for rendering navigation.",
"discriminator": {
"mapping": {
"accordion": "#/$defs/Accordion",
"nav_bar": "#/$defs/NavBar"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Accordion"
},
{
"$ref": "#/$defs/NavBar"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Nav Selector"
}
},
"title": "Navigation",
"type": "object"
},
"Page": {
"additionalProperties": false,
"description": "A page in [`Dashboard`][vizro.models.Dashboard] with its own URL path and place in the `Navigation`.\n\nAbstract: Usage documentation\n [How to make dashboard pages](user-guides/pages.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"components": {
"items": {
"description": "Component that makes up part of the layout on the page.",
"discriminator": {
"mapping": {
"ag_grid": "#/$defs/AgGrid",
"button": "#/$defs/Button",
"card": "#/$defs/Card",
"container": "#/$defs/Container",
"figure": "#/$defs/Figure",
"graph": "#/$defs/Graph",
"table": "#/$defs/Table",
"tabs": "#/$defs/Tabs",
"text": "#/$defs/Text"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/AgGrid"
},
{
"$ref": "#/$defs/Button"
},
{
"$ref": "#/$defs/Card"
},
{
"$ref": "#/$defs/Container"
},
{
"$ref": "#/$defs/Figure"
},
{
"$ref": "#/$defs/Graph"
},
{
"$ref": "#/$defs/Text"
},
{
"$ref": "#/$defs/Table"
},
{
"$ref": "#/$defs/Tabs"
}
]
},
"minItems": 1,
"title": "Components",
"type": "array"
},
"title": {
"description": "Title of the `Page`",
"title": "Title",
"type": "string"
},
"layout": {
"anyOf": [
{
"description": "Type of layout to place components on the page.",
"oneOf": [
{
"$ref": "#/$defs/Grid"
},
{
"$ref": "#/$defs/Flex"
},
{
"$ref": "#/$defs/Layout"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Layout"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description. This also sets the page's meta\n tags."
},
"controls": {
"default": [],
"items": {
"anyOf": [
{
"description": "Control that affects components on the page.",
"discriminator": {
"mapping": {
"filter": "#/$defs/Filter",
"parameter": "#/$defs/Parameter"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Filter"
},
{
"$ref": "#/$defs/Parameter"
}
]
},
{
"$ref": "#/$defs/ControlGroup"
}
]
},
"title": "Controls",
"type": "array"
},
"path": {
"default": "",
"description": "Path to navigate to page.",
"title": "Path",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"required": [
"components",
"title"
],
"title": "Page",
"type": "object"
},
"Parameter": {
"additionalProperties": false,
"description": "Alter the arguments supplied to any `targets`.\n\nAbstract: Usage documentation\n [How to use parameters](user-guides/parameters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Parameter(targets=[\"scatter.x\"], selector=vm.Slider(min=0, max=1, default=0.8, title=\"Bubble opacity\"))\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "parameter",
"default": "parameter",
"title": "Type",
"type": "string"
},
"targets": {
"items": {
"description": "Targets in the form of `<target_component>.<target_argument>`.",
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
],
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the parameter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific parameter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the parameter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"targets",
"selector"
],
"title": "Parameter",
"type": "object"
},
"RadioItems": {
"additionalProperties": false,
"description": "Categorical single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md/#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "radio_items",
"default": "radio_items",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RadioItems",
"type": "object"
},
"RangeSlider": {
"additionalProperties": false,
"description": "Numeric multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "range_slider",
"default": "range_slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"items": {
"type": "number"
},
"maxItems": 2,
"minItems": 2,
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RangeSlider",
"type": "object"
},
"Slider": {
"additionalProperties": false,
"description": "Numeric single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "slider",
"default": "slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Default value for slider.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Slider",
"type": "object"
},
"Switch": {
"additionalProperties": false,
"description": "Boolean single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use boolean selectors](user-guides/selectors.md/#boolean-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "switch",
"default": "switch",
"title": "Type",
"type": "string"
},
"value": {
"default": false,
"description": "Initial state of the switch. When `True`, the switch is enabled/on.\n When `False`, the switch is disabled/off.",
"title": "Value",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title/Label to be displayed to the right of the switch.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Switch",
"type": "object"
},
"Table": {
"additionalProperties": false,
"description": "Wrapper for `dash_table.DataTable` to visualize tables in dashboard.\n\nAbstract: Usage documentation\n [How to use tables](user-guides/table.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "table",
"default": "table",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `Table`",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `Table.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `Table`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Table",
"type": "object"
},
"Tabs": {
"additionalProperties": false,
"description": "Tabs to group together a set of [`Containers`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use tabs](user-guides/tabs.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "tabs",
"default": "tabs",
"title": "Type",
"type": "string"
},
"tabs": {
"items": {
"$ref": "#/$defs/Container"
},
"minItems": 1,
"title": "Tabs",
"type": "array"
},
"title": {
"default": "",
"description": "Title displayed above Tabs.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"required": [
"tabs"
],
"title": "Tabs",
"type": "object"
},
"Text": {
"additionalProperties": false,
"description": "Text based on Markdown syntax.\n\nAbstract: Usage documentation\n [How to add text to your page](user-guides/text.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "text",
"default": "text",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown string to create text that should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
}
},
"required": [
"text"
],
"title": "Text",
"type": "object"
},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"_OptionsDictType": {
"additionalProperties": false,
"description": "Permissible sub-type for OptionsType. Needs to be in the format of {\"label\": XXX, \"value\": XXX}.",
"properties": {
"label": {
"title": "Label",
"type": "string"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
],
"title": "Value"
}
},
"required": [
"label",
"value"
],
"title": "_OptionsDictType",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Dashboard that is supplied to [`Vizro.build`][vizro.Vizro.build].\n\nAbstract: Usage documentation\n [How to create a dashboard](user-guides/dashboard.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"pages": {
"items": {
"$ref": "#/$defs/Page"
},
"title": "Pages",
"type": "array"
},
"theme": {
"default": "vizro_dark",
"description": "Theme to be applied across dashboard.",
"enum": [
"vizro_dark",
"vizro_light"
],
"title": "Theme",
"type": "string"
},
"navigation": {
"anyOf": [
{
"$ref": "#/$defs/Navigation"
},
{
"type": "null"
}
],
"default": null
},
"title": {
"default": "",
"description": "Dashboard title to appear on every page on top left-side.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description. This also sets the page's meta\n tags."
}
},
"required": [
"pages"
],
"title": "Dashboard",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
pages
theme
Theme to be applied across dashboard.
navigation
title
Dashboard title to appear on every page on top left-side.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description. This also sets the page's meta tags.
pydantic-model
Temporal single/range option selector.
Can be provided to Filter or Parameter.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Temporal single/range option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use temporal selectors](user-guides/selectors.md#temporal-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "date_picker",
"default": "date_picker",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Start date for date picker.",
"title": "Min"
},
"max": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "End date for date picker.",
"title": "Max"
},
"value": {
"anyOf": [
{
"items": {
"format": "date",
"type": "string"
},
"type": "array"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Default date/dates for date picker.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"range": {
"default": true,
"description": "Boolean flag for displaying range picker.",
"title": "Range",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "DatePicker",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
min
Start date for date picker.
max
End date for date picker.
value
Default date/dates for date picker.
title
Title to be displayed.
range
Boolean flag for displaying range picker.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
actions
extra
Extra keyword arguments that are passed to dmc.DatePickerInput and overwrite
any defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dmc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Categorical single/multi-option selector.
Can be provided to Filter or
Parameter.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"_OptionsDictType": {
"additionalProperties": false,
"description": "Permissible sub-type for OptionsType. Needs to be in the format of {\"label\": XXX, \"value\": XXX}.",
"properties": {
"label": {
"title": "Label",
"type": "string"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
],
"title": "Value"
}
},
"required": [
"label",
"value"
],
"title": "_OptionsDictType",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Categorical single/multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "dropdown",
"default": "dropdown",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to enable selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `filled` or `plain`.",
"enum": [
"plain",
"filled"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Dropdown",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
options
value
multi
Whether to enable selection of multiple values
title
Title to be displayed
variant
Predefined styles to choose from. Options are filled or plain.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
actions
extra
Extra keyword arguments that are passed to dcc.Dropdown and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dcc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Object that is reactive to controls, for example a KPI card.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Object that is reactive to controls, for example a KPI card.\n\nAbstract: Usage documentation\n [How to use figures](user-guides/figure.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "figure",
"default": "figure",
"title": "Type",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Figure",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
figure
Function that returns a figure-like object.
actions
pydantic-model
Filter the data supplied to targets.
Usage documentation
Example
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"Cascader": {
"additionalProperties": false,
"description": "Cascader selector for [`Filter`][vizro.models.Filter] and [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [Hierarchical selectors](user-guides/selectors.md#hierarchical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "cascader",
"default": "cascader",
"title": "Type",
"type": "string"
},
"options": {
"additionalProperties": true,
"default": {},
"description": "Nested tree: dict keys are branch labels; each branch is a dict or a non-empty list of scalar leaf values (str, int, float, bool, or date).",
"title": "Options",
"type": "object"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"description": "Selected leaf value, or list of leaves when multi=True. Must be valid for `options`. If omitted, the first parent node is selected.",
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to allow selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Cascader",
"type": "object"
},
"Checklist": {
"additionalProperties": false,
"description": "Categorical multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "checklist",
"default": "checklist",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"show_select_all": {
"default": true,
"description": "Whether to display the 'Select All' option that enables users to select or deselect all available options with a single click.",
"title": "Show Select All",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Checklist",
"type": "object"
},
"DatePicker": {
"additionalProperties": false,
"description": "Temporal single/range option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use temporal selectors](user-guides/selectors.md#temporal-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "date_picker",
"default": "date_picker",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Start date for date picker.",
"title": "Min"
},
"max": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "End date for date picker.",
"title": "Max"
},
"value": {
"anyOf": [
{
"items": {
"format": "date",
"type": "string"
},
"type": "array"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Default date/dates for date picker.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"range": {
"default": true,
"description": "Boolean flag for displaying range picker.",
"title": "Range",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "DatePicker",
"type": "object"
},
"Dropdown": {
"additionalProperties": false,
"description": "Categorical single/multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "dropdown",
"default": "dropdown",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to enable selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `filled` or `plain`.",
"enum": [
"plain",
"filled"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Dropdown",
"type": "object"
},
"JsonValue": {},
"RadioItems": {
"additionalProperties": false,
"description": "Categorical single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md/#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "radio_items",
"default": "radio_items",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RadioItems",
"type": "object"
},
"RangeSlider": {
"additionalProperties": false,
"description": "Numeric multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "range_slider",
"default": "range_slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"items": {
"type": "number"
},
"maxItems": 2,
"minItems": 2,
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RangeSlider",
"type": "object"
},
"Slider": {
"additionalProperties": false,
"description": "Numeric single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "slider",
"default": "slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Default value for slider.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Slider",
"type": "object"
},
"Switch": {
"additionalProperties": false,
"description": "Boolean single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use boolean selectors](user-guides/selectors.md/#boolean-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "switch",
"default": "switch",
"title": "Type",
"type": "string"
},
"value": {
"default": false,
"description": "Initial state of the switch. When `True`, the switch is enabled/on.\n When `False`, the switch is disabled/off.",
"title": "Value",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title/Label to be displayed to the right of the switch.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Switch",
"type": "object"
},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"_OptionsDictType": {
"additionalProperties": false,
"description": "Permissible sub-type for OptionsType. Needs to be in the format of {\"label\": XXX, \"value\": XXX}.",
"properties": {
"label": {
"title": "Label",
"type": "string"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
],
"title": "Value"
}
},
"required": [
"label",
"value"
],
"title": "_OptionsDictType",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Filter the data supplied to `targets`.\n\nAbstract: Usage documentation\n [How to use filters](user-guides/filters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Filter(column=\"species\")\n vm.Filter(column=[\"continent\", \"country\"])\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter",
"default": "filter",
"title": "Type",
"type": "string"
},
"column": {
"anyOf": [
{
"type": "string"
},
{
"items": {
"type": "string"
},
"type": "array"
}
],
"description": "Name of the column to filter, or an ordered list of column names for a hierarchical filter.",
"title": "Column"
},
"targets": {
"default": [],
"description": "Target component to be affected by filter. If none are given then target all components on the page that use `column`.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"anyOf": [
{
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the filter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific filter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the filter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"column"
],
"title": "Filter",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
column
Name of the column to filter, or an ordered list of column names for a hierarchical filter.
targets
Target component to be affected by filter. If none are given then target all components on the page that use column.
selector
show_in_url
Whether the filter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific filter values pre-set.
visible
Whether the filter should be visible.
pydantic-model
Flex layout for components on a Page or in a Container.
Usage documentation
Show JSON schema:
{
"additionalProperties": false,
"description": "Flex layout for components on a [`Page`][vizro.models.Page] or in a [`Container`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use the Flex layout](user-guides/layouts.md#flex-layout)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "flex",
"default": "flex",
"title": "Type",
"type": "string"
},
"direction": {
"default": "column",
"description": "Sets the direction of the flex items inside the container. Options are `row` or `column`.",
"enum": [
"row",
"column"
],
"title": "Direction",
"type": "string"
},
"gap": {
"default": "24px",
"description": "Specifies the gap between rows and columns. Allowed units: 'px', 'rem', 'em', or '%'.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Gap",
"type": "string"
},
"wrap": {
"default": false,
"description": "Determines whether flex items are forced onto a single line or can wrap onto multiple lines. If `False`, all items will be on one line. If `True`, items will wrap onto multiple lines.",
"title": "Wrap",
"type": "boolean"
}
},
"title": "Flex",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
direction
Sets the direction of the flex items inside the container. Options are row or column.
gap
Specifies the gap between rows and columns. Allowed units: 'px', 'rem', 'em', or '%'.
wrap
Determines whether flex items are forced onto a single line or can wrap onto multiple lines. If False, all items will be on one line. If True, items will wrap onto multiple lines.
extra
Extra keyword arguments that are passed to dmc.Flex and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dmc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future. Defaults to {}.
pydantic-model
Wrapper for dcc.Graph to visualize charts.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Wrapper for `dcc.Graph` to visualize charts.\n\nAbstract: Usage documentation\n [How to use graphs](user-guides/graph.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "graph",
"default": "graph",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `Graph`",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `Graph.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `Graph`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Graph",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
figure
Function that returns a plotly go.Figure
title
Title of the Graph
header
Markdown text positioned below the Graph.title. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.
footer
Markdown text positioned below the Graph. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
actions
extra
Extra keyword arguments that are passed to dcc.Graph and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dcc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Grid layout for components on a Page or in a Container.
Usage documentation
Show JSON schema:
{
"additionalProperties": false,
"description": "Grid layout for components on a [`Page`][vizro.models.Page] or in a [`Container`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use the Grid layout](user-guides/layouts.md#grid-layout)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "grid",
"default": "grid",
"title": "Type",
"type": "string"
},
"grid": {
"description": "Grid specification to arrange components on screen.",
"items": {
"items": {
"type": "integer"
},
"type": "array"
},
"title": "Grid",
"type": "array"
},
"row_gap": {
"default": "24px",
"description": "Specifies the gap between rows. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Gap",
"type": "string"
},
"col_gap": {
"default": "24px",
"description": "Specifies the gap between columns. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Gap",
"type": "string"
},
"row_min_height": {
"default": "0px",
"description": "Minimum row height in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Min Height",
"type": "string"
},
"col_min_width": {
"default": "0px",
"description": "Minimum column width in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Min Width",
"type": "string"
}
},
"required": [
"grid"
],
"title": "Grid",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
grid
Grid specification to arrange components on screen.
row_gap
Specifies the gap between rows. Allowed units: px, rem, em, or %.
col_gap
Specifies the gap between columns. Allowed units: px, rem, em, or %.
row_min_height
Minimum row height in px. Allowed units: px, rem, em, or %.
col_min_width
Minimum column width in px. Allowed units: px, rem, em, or %.
deprecated
pydantic-model
Deprecated
The Layout model has been renamed Grid, and Layout will not exist in Vizro 0.2.0.
Show JSON schema:
{
"additionalProperties": false,
"deprecated": true,
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "legacy_layout",
"default": "legacy_layout",
"title": "Type",
"type": "string"
},
"grid": {
"description": "Grid specification to arrange components on screen.",
"items": {
"items": {
"type": "integer"
},
"type": "array"
},
"title": "Grid",
"type": "array"
},
"row_gap": {
"default": "24px",
"description": "Specifies the gap between rows. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Gap",
"type": "string"
},
"col_gap": {
"default": "24px",
"description": "Specifies the gap between columns. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Gap",
"type": "string"
},
"row_min_height": {
"default": "0px",
"description": "Minimum row height in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Min Height",
"type": "string"
},
"col_min_width": {
"default": "0px",
"description": "Minimum column width in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Min Width",
"type": "string"
}
},
"required": [
"grid"
],
"title": "Layout",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
grid
Grid specification to arrange components on screen.
row_gap
Specifies the gap between rows. Allowed units: px, rem, em, or %.
col_gap
Specifies the gap between columns. Allowed units: px, rem, em, or %.
row_min_height
Minimum row height in px. Allowed units: px, rem, em, or %.
col_min_width
Minimum column width in px. Allowed units: px, rem, em, or %.
pydantic-model
Navigation bar to be used as a nav_selector for Navigation.
Usage documentation
Show JSON schema:
{
"$defs": {
"NavLink": {
"additionalProperties": false,
"description": "Icon that serves as a navigation link to be used in a [`NavBar`][vizro.models.NavBar].\n\nAbstract: Usage documentation\n [How to customize the NavBar icons](user-guides/navigation.md#change-icons)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"pages": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"type": "object"
}
],
"default": [],
"title": "Pages"
},
"label": {
"description": "Text description of the icon for use in tooltip.",
"title": "Label",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"label"
],
"title": "NavLink",
"type": "object"
}
},
"additionalProperties": false,
"description": "Navigation bar to be used as a `nav_selector` for `Navigation`.\n\nAbstract: Usage documentation\n [How to use the navigation bar](user-guides/navigation.md#use-a-navigation-bar-with-icons)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "nav_bar",
"default": "nav_bar",
"title": "Type",
"type": "string"
},
"pages": {
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"default": {},
"description": "Mapping from name of a pages group to a list of page IDs/titles.",
"title": "Pages",
"type": "object"
},
"items": {
"default": [],
"items": {
"$ref": "#/$defs/NavLink"
},
"title": "Items",
"type": "array"
},
"position": {
"default": "left",
"description": "Position of the navigation bar, either on the left sidebar or top header.",
"enum": [
"left",
"top"
],
"title": "Position",
"type": "string"
}
},
"title": "NavBar",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
pages
Mapping from name of a pages group to a list of page IDs/titles.
items
position
Position of the navigation bar, either on the left sidebar or top header.
pydantic-model
Icon that serves as a navigation link to be used in a NavBar.
Usage documentation
Show JSON schema:
{
"additionalProperties": false,
"description": "Icon that serves as a navigation link to be used in a [`NavBar`][vizro.models.NavBar].\n\nAbstract: Usage documentation\n [How to customize the NavBar icons](user-guides/navigation.md#change-icons)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"pages": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"type": "object"
}
],
"default": [],
"title": "Pages"
},
"label": {
"description": "Text description of the icon for use in tooltip.",
"title": "Label",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"label"
],
"title": "NavLink",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
pages
label
Text description of the icon for use in tooltip.
icon
Icon name from Google Material icons library.
pydantic-model
Navigation to arrange hierarchy of Pages.
Usage documentation
Show JSON schema:
{
"$defs": {
"Accordion": {
"additionalProperties": false,
"description": "Accordion to be used as `nav_selector` in [`Navigation`][vizro.models.Navigation].\n\nAbstract: Usage documentation\n [How to use an accordion](user-guides/navigation.md/#group-pages)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "accordion",
"default": "accordion",
"title": "Type",
"type": "string"
},
"pages": {
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"default": {},
"description": "Mapping from name of a pages group to a list of page IDs/titles.",
"title": "Pages",
"type": "object"
}
},
"title": "Accordion",
"type": "object"
},
"NavBar": {
"additionalProperties": false,
"description": "Navigation bar to be used as a `nav_selector` for `Navigation`.\n\nAbstract: Usage documentation\n [How to use the navigation bar](user-guides/navigation.md#use-a-navigation-bar-with-icons)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "nav_bar",
"default": "nav_bar",
"title": "Type",
"type": "string"
},
"pages": {
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"default": {},
"description": "Mapping from name of a pages group to a list of page IDs/titles.",
"title": "Pages",
"type": "object"
},
"items": {
"default": [],
"items": {
"$ref": "#/$defs/NavLink"
},
"title": "Items",
"type": "array"
},
"position": {
"default": "left",
"description": "Position of the navigation bar, either on the left sidebar or top header.",
"enum": [
"left",
"top"
],
"title": "Position",
"type": "string"
}
},
"title": "NavBar",
"type": "object"
},
"NavLink": {
"additionalProperties": false,
"description": "Icon that serves as a navigation link to be used in a [`NavBar`][vizro.models.NavBar].\n\nAbstract: Usage documentation\n [How to customize the NavBar icons](user-guides/navigation.md#change-icons)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"pages": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"type": "object"
}
],
"default": [],
"title": "Pages"
},
"label": {
"description": "Text description of the icon for use in tooltip.",
"title": "Label",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"label"
],
"title": "NavLink",
"type": "object"
}
},
"additionalProperties": false,
"description": "Navigation to arrange hierarchy of [`Pages`][vizro.models.Page].\n\nAbstract: Usage documentation\n [How to customize the navigation](user-guides/navigation.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"pages": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"items": {
"type": "string"
},
"type": "array"
},
"type": "object"
}
],
"default": [],
"title": "Pages"
},
"nav_selector": {
"anyOf": [
{
"description": "Component for rendering navigation.",
"discriminator": {
"mapping": {
"accordion": "#/$defs/Accordion",
"nav_bar": "#/$defs/NavBar"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Accordion"
},
{
"$ref": "#/$defs/NavBar"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Nav Selector"
}
},
"title": "Navigation",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
pages
nav_selector
pydantic-model
A page in Dashboard with its own URL path and place in the Navigation.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"AgGrid": {
"additionalProperties": false,
"description": "Wrapper for `dash_ag_grid.AgGrid` to visualize grids in a dashboard.\n\nAbstract: Usage documentation\n [How to use an AgGrid](user-guides/table.md/#ag-grid)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "ag_grid",
"default": "ag_grid",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `AgGrid`.",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `AgGrid.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `AgGrid`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "AgGrid",
"type": "object"
},
"Button": {
"additionalProperties": false,
"description": "Button that can trigger actions or navigate.\n\nAbstract: Usage documentation\n [How to use buttons](user-guides/button.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "button",
"default": "button",
"title": "Type",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
},
"text": {
"default": "Click me!",
"description": "Text to be displayed on button.",
"title": "Text",
"type": "string"
},
"href": {
"default": "",
"description": "URL (relative or absolute) to navigate to.",
"title": "Href",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `plain`, `filled` or `outlined`.",
"enum": [
"plain",
"filled",
"outlined"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the button text.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"title": "Button",
"type": "object"
},
"Card": {
"additionalProperties": false,
"description": "Card based on Markdown syntax.\n\nAbstract: Usage documentation\n [How to use cards](user-guides/card.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "card",
"default": "card",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown string to create card title/text that should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned above the card text. Follows the CommonMark specification. Ideal for\n adding supplementary information.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned at the bottom of the `Card`. Follows the CommonMark specification.\n Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"href": {
"default": "",
"description": "URL (relative or absolute) to navigate to. If not provided the Card serves as a text card only.",
"title": "Href",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon in the top-right corner of the Card.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"required": [
"text"
],
"title": "Card",
"type": "object"
},
"Cascader": {
"additionalProperties": false,
"description": "Cascader selector for [`Filter`][vizro.models.Filter] and [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [Hierarchical selectors](user-guides/selectors.md#hierarchical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "cascader",
"default": "cascader",
"title": "Type",
"type": "string"
},
"options": {
"additionalProperties": true,
"default": {},
"description": "Nested tree: dict keys are branch labels; each branch is a dict or a non-empty list of scalar leaf values (str, int, float, bool, or date).",
"title": "Options",
"type": "object"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"description": "Selected leaf value, or list of leaves when multi=True. Must be valid for `options`. If omitted, the first parent node is selected.",
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to allow selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Cascader",
"type": "object"
},
"Checklist": {
"additionalProperties": false,
"description": "Categorical multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "checklist",
"default": "checklist",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"show_select_all": {
"default": true,
"description": "Whether to display the 'Select All' option that enables users to select or deselect all available options with a single click.",
"title": "Show Select All",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Checklist",
"type": "object"
},
"Container": {
"additionalProperties": false,
"description": "Container to group together a set of components on a page.\n\nAbstract: Usage documentation\n [How to use containers](user-guides/container.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "container",
"default": "container",
"title": "Type",
"type": "string"
},
"components": {
"items": {
"description": "Component that makes up part of the layout on the page.",
"discriminator": {
"mapping": {
"ag_grid": "#/$defs/AgGrid",
"button": "#/$defs/Button",
"card": "#/$defs/Card",
"container": "#/$defs/Container",
"figure": "#/$defs/Figure",
"graph": "#/$defs/Graph",
"table": "#/$defs/Table",
"tabs": "#/$defs/Tabs",
"text": "#/$defs/Text"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/AgGrid"
},
{
"$ref": "#/$defs/Button"
},
{
"$ref": "#/$defs/Card"
},
{
"$ref": "#/$defs/Container"
},
{
"$ref": "#/$defs/Figure"
},
{
"$ref": "#/$defs/Graph"
},
{
"$ref": "#/$defs/Text"
},
{
"$ref": "#/$defs/Table"
},
{
"$ref": "#/$defs/Tabs"
}
]
},
"minItems": 1,
"title": "Components",
"type": "array"
},
"title": {
"default": "",
"description": "Title of the `Container`",
"title": "Title",
"type": "string"
},
"layout": {
"anyOf": [
{
"description": "Type of layout to place components on the page.",
"oneOf": [
{
"$ref": "#/$defs/Grid"
},
{
"$ref": "#/$defs/Flex"
},
{
"$ref": "#/$defs/Layout"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Layout"
},
"collapsed": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "null"
}
],
"default": null,
"description": "Boolean flag that determines whether the container is collapsed on initial load. Set to `True` for a collapsed state, `False` for an expanded state. Defaults to `None`, meaning the container is not collapsible.",
"title": "Collapsed"
},
"variant": {
"anyOf": [
{
"enum": [
"plain",
"filled",
"outlined"
],
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Predefined styles to choose from. Options are `plain`, `filled` or `outlined`. Defaults to `plain` (or `outlined` for collapsible container). ",
"title": "Variant"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"controls": {
"default": [],
"items": {
"description": "Control that affects components on the page.",
"discriminator": {
"mapping": {
"filter": "#/$defs/Filter",
"parameter": "#/$defs/Parameter"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Filter"
},
{
"$ref": "#/$defs/Parameter"
}
]
},
"title": "Controls",
"type": "array"
}
},
"required": [
"components"
],
"title": "Container",
"type": "object"
},
"ControlGroup": {
"additionalProperties": false,
"description": "Container to group together a set of controls.\n\nAbstract: Usage documentation\n [How to group controls](user-guides/controls.md/#group-controls)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.ControlGroup(\n title=\"Control group title\",\n controls=[vm.Filter(column=\"species\"), vm.Filter(column=\"sepal_length\")],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "control_group",
"default": "control_group",
"title": "Type",
"type": "string"
},
"controls": {
"items": {
"description": "Control that affects components on the page.",
"discriminator": {
"mapping": {
"filter": "#/$defs/Filter",
"parameter": "#/$defs/Parameter"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Filter"
},
{
"$ref": "#/$defs/Parameter"
}
]
},
"minItems": 1,
"title": "Controls",
"type": "array"
},
"title": {
"default": "",
"description": "Title of the control group.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"required": [
"controls"
],
"title": "ControlGroup",
"type": "object"
},
"DatePicker": {
"additionalProperties": false,
"description": "Temporal single/range option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use temporal selectors](user-guides/selectors.md#temporal-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "date_picker",
"default": "date_picker",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Start date for date picker.",
"title": "Min"
},
"max": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "End date for date picker.",
"title": "Max"
},
"value": {
"anyOf": [
{
"items": {
"format": "date",
"type": "string"
},
"type": "array"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Default date/dates for date picker.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"range": {
"default": true,
"description": "Boolean flag for displaying range picker.",
"title": "Range",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "DatePicker",
"type": "object"
},
"Dropdown": {
"additionalProperties": false,
"description": "Categorical single/multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "dropdown",
"default": "dropdown",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to enable selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `filled` or `plain`.",
"enum": [
"plain",
"filled"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Dropdown",
"type": "object"
},
"Figure": {
"additionalProperties": false,
"description": "Object that is reactive to controls, for example a KPI card.\n\nAbstract: Usage documentation\n [How to use figures](user-guides/figure.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "figure",
"default": "figure",
"title": "Type",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Figure",
"type": "object"
},
"Filter": {
"additionalProperties": false,
"description": "Filter the data supplied to `targets`.\n\nAbstract: Usage documentation\n [How to use filters](user-guides/filters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Filter(column=\"species\")\n vm.Filter(column=[\"continent\", \"country\"])\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter",
"default": "filter",
"title": "Type",
"type": "string"
},
"column": {
"anyOf": [
{
"type": "string"
},
{
"items": {
"type": "string"
},
"type": "array"
}
],
"description": "Name of the column to filter, or an ordered list of column names for a hierarchical filter.",
"title": "Column"
},
"targets": {
"default": [],
"description": "Target component to be affected by filter. If none are given then target all components on the page that use `column`.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"anyOf": [
{
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the filter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific filter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the filter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"column"
],
"title": "Filter",
"type": "object"
},
"Flex": {
"additionalProperties": false,
"description": "Flex layout for components on a [`Page`][vizro.models.Page] or in a [`Container`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use the Flex layout](user-guides/layouts.md#flex-layout)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "flex",
"default": "flex",
"title": "Type",
"type": "string"
},
"direction": {
"default": "column",
"description": "Sets the direction of the flex items inside the container. Options are `row` or `column`.",
"enum": [
"row",
"column"
],
"title": "Direction",
"type": "string"
},
"gap": {
"default": "24px",
"description": "Specifies the gap between rows and columns. Allowed units: 'px', 'rem', 'em', or '%'.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Gap",
"type": "string"
},
"wrap": {
"default": false,
"description": "Determines whether flex items are forced onto a single line or can wrap onto multiple lines. If `False`, all items will be on one line. If `True`, items will wrap onto multiple lines.",
"title": "Wrap",
"type": "boolean"
}
},
"title": "Flex",
"type": "object"
},
"Graph": {
"additionalProperties": false,
"description": "Wrapper for `dcc.Graph` to visualize charts.\n\nAbstract: Usage documentation\n [How to use graphs](user-guides/graph.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "graph",
"default": "graph",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `Graph`",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `Graph.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `Graph`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Graph",
"type": "object"
},
"Grid": {
"additionalProperties": false,
"description": "Grid layout for components on a [`Page`][vizro.models.Page] or in a [`Container`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use the Grid layout](user-guides/layouts.md#grid-layout)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "grid",
"default": "grid",
"title": "Type",
"type": "string"
},
"grid": {
"description": "Grid specification to arrange components on screen.",
"items": {
"items": {
"type": "integer"
},
"type": "array"
},
"title": "Grid",
"type": "array"
},
"row_gap": {
"default": "24px",
"description": "Specifies the gap between rows. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Gap",
"type": "string"
},
"col_gap": {
"default": "24px",
"description": "Specifies the gap between columns. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Gap",
"type": "string"
},
"row_min_height": {
"default": "0px",
"description": "Minimum row height in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Min Height",
"type": "string"
},
"col_min_width": {
"default": "0px",
"description": "Minimum column width in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Min Width",
"type": "string"
}
},
"required": [
"grid"
],
"title": "Grid",
"type": "object"
},
"JsonValue": {},
"Layout": {
"additionalProperties": false,
"deprecated": true,
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "legacy_layout",
"default": "legacy_layout",
"title": "Type",
"type": "string"
},
"grid": {
"description": "Grid specification to arrange components on screen.",
"items": {
"items": {
"type": "integer"
},
"type": "array"
},
"title": "Grid",
"type": "array"
},
"row_gap": {
"default": "24px",
"description": "Specifies the gap between rows. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Gap",
"type": "string"
},
"col_gap": {
"default": "24px",
"description": "Specifies the gap between columns. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Gap",
"type": "string"
},
"row_min_height": {
"default": "0px",
"description": "Minimum row height in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Min Height",
"type": "string"
},
"col_min_width": {
"default": "0px",
"description": "Minimum column width in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Min Width",
"type": "string"
}
},
"required": [
"grid"
],
"title": "Layout",
"type": "object"
},
"Parameter": {
"additionalProperties": false,
"description": "Alter the arguments supplied to any `targets`.\n\nAbstract: Usage documentation\n [How to use parameters](user-guides/parameters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Parameter(targets=[\"scatter.x\"], selector=vm.Slider(min=0, max=1, default=0.8, title=\"Bubble opacity\"))\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "parameter",
"default": "parameter",
"title": "Type",
"type": "string"
},
"targets": {
"items": {
"description": "Targets in the form of `<target_component>.<target_argument>`.",
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
],
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the parameter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific parameter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the parameter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"targets",
"selector"
],
"title": "Parameter",
"type": "object"
},
"RadioItems": {
"additionalProperties": false,
"description": "Categorical single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md/#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "radio_items",
"default": "radio_items",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RadioItems",
"type": "object"
},
"RangeSlider": {
"additionalProperties": false,
"description": "Numeric multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "range_slider",
"default": "range_slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"items": {
"type": "number"
},
"maxItems": 2,
"minItems": 2,
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RangeSlider",
"type": "object"
},
"Slider": {
"additionalProperties": false,
"description": "Numeric single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "slider",
"default": "slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Default value for slider.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Slider",
"type": "object"
},
"Switch": {
"additionalProperties": false,
"description": "Boolean single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use boolean selectors](user-guides/selectors.md/#boolean-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "switch",
"default": "switch",
"title": "Type",
"type": "string"
},
"value": {
"default": false,
"description": "Initial state of the switch. When `True`, the switch is enabled/on.\n When `False`, the switch is disabled/off.",
"title": "Value",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title/Label to be displayed to the right of the switch.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Switch",
"type": "object"
},
"Table": {
"additionalProperties": false,
"description": "Wrapper for `dash_table.DataTable` to visualize tables in dashboard.\n\nAbstract: Usage documentation\n [How to use tables](user-guides/table.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "table",
"default": "table",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `Table`",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `Table.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `Table`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Table",
"type": "object"
},
"Tabs": {
"additionalProperties": false,
"description": "Tabs to group together a set of [`Containers`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use tabs](user-guides/tabs.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "tabs",
"default": "tabs",
"title": "Type",
"type": "string"
},
"tabs": {
"items": {
"$ref": "#/$defs/Container"
},
"minItems": 1,
"title": "Tabs",
"type": "array"
},
"title": {
"default": "",
"description": "Title displayed above Tabs.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"required": [
"tabs"
],
"title": "Tabs",
"type": "object"
},
"Text": {
"additionalProperties": false,
"description": "Text based on Markdown syntax.\n\nAbstract: Usage documentation\n [How to add text to your page](user-guides/text.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "text",
"default": "text",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown string to create text that should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
}
},
"required": [
"text"
],
"title": "Text",
"type": "object"
},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"_OptionsDictType": {
"additionalProperties": false,
"description": "Permissible sub-type for OptionsType. Needs to be in the format of {\"label\": XXX, \"value\": XXX}.",
"properties": {
"label": {
"title": "Label",
"type": "string"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
],
"title": "Value"
}
},
"required": [
"label",
"value"
],
"title": "_OptionsDictType",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "A page in [`Dashboard`][vizro.models.Dashboard] with its own URL path and place in the `Navigation`.\n\nAbstract: Usage documentation\n [How to make dashboard pages](user-guides/pages.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"components": {
"items": {
"description": "Component that makes up part of the layout on the page.",
"discriminator": {
"mapping": {
"ag_grid": "#/$defs/AgGrid",
"button": "#/$defs/Button",
"card": "#/$defs/Card",
"container": "#/$defs/Container",
"figure": "#/$defs/Figure",
"graph": "#/$defs/Graph",
"table": "#/$defs/Table",
"tabs": "#/$defs/Tabs",
"text": "#/$defs/Text"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/AgGrid"
},
{
"$ref": "#/$defs/Button"
},
{
"$ref": "#/$defs/Card"
},
{
"$ref": "#/$defs/Container"
},
{
"$ref": "#/$defs/Figure"
},
{
"$ref": "#/$defs/Graph"
},
{
"$ref": "#/$defs/Text"
},
{
"$ref": "#/$defs/Table"
},
{
"$ref": "#/$defs/Tabs"
}
]
},
"minItems": 1,
"title": "Components",
"type": "array"
},
"title": {
"description": "Title of the `Page`",
"title": "Title",
"type": "string"
},
"layout": {
"anyOf": [
{
"description": "Type of layout to place components on the page.",
"oneOf": [
{
"$ref": "#/$defs/Grid"
},
{
"$ref": "#/$defs/Flex"
},
{
"$ref": "#/$defs/Layout"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Layout"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description. This also sets the page's meta\n tags."
},
"controls": {
"default": [],
"items": {
"anyOf": [
{
"description": "Control that affects components on the page.",
"discriminator": {
"mapping": {
"filter": "#/$defs/Filter",
"parameter": "#/$defs/Parameter"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Filter"
},
{
"$ref": "#/$defs/Parameter"
}
]
},
{
"$ref": "#/$defs/ControlGroup"
}
]
},
"title": "Controls",
"type": "array"
},
"path": {
"default": "",
"description": "Path to navigate to page.",
"title": "Path",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"required": [
"components",
"title"
],
"title": "Page",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
components
title
Title of the Page
layout
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description. This also sets the page's meta tags.
controls
path
Path to navigate to page.
actions
pydantic-model
Alter the arguments supplied to any targets.
Usage documentation
Example
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"Cascader": {
"additionalProperties": false,
"description": "Cascader selector for [`Filter`][vizro.models.Filter] and [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [Hierarchical selectors](user-guides/selectors.md#hierarchical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "cascader",
"default": "cascader",
"title": "Type",
"type": "string"
},
"options": {
"additionalProperties": true,
"default": {},
"description": "Nested tree: dict keys are branch labels; each branch is a dict or a non-empty list of scalar leaf values (str, int, float, bool, or date).",
"title": "Options",
"type": "object"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"description": "Selected leaf value, or list of leaves when multi=True. Must be valid for `options`. If omitted, the first parent node is selected.",
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to allow selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Cascader",
"type": "object"
},
"Checklist": {
"additionalProperties": false,
"description": "Categorical multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "checklist",
"default": "checklist",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"show_select_all": {
"default": true,
"description": "Whether to display the 'Select All' option that enables users to select or deselect all available options with a single click.",
"title": "Show Select All",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Checklist",
"type": "object"
},
"DatePicker": {
"additionalProperties": false,
"description": "Temporal single/range option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use temporal selectors](user-guides/selectors.md#temporal-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "date_picker",
"default": "date_picker",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Start date for date picker.",
"title": "Min"
},
"max": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "End date for date picker.",
"title": "Max"
},
"value": {
"anyOf": [
{
"items": {
"format": "date",
"type": "string"
},
"type": "array"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Default date/dates for date picker.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"range": {
"default": true,
"description": "Boolean flag for displaying range picker.",
"title": "Range",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "DatePicker",
"type": "object"
},
"Dropdown": {
"additionalProperties": false,
"description": "Categorical single/multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "dropdown",
"default": "dropdown",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to enable selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `filled` or `plain`.",
"enum": [
"plain",
"filled"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Dropdown",
"type": "object"
},
"JsonValue": {},
"RadioItems": {
"additionalProperties": false,
"description": "Categorical single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md/#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "radio_items",
"default": "radio_items",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RadioItems",
"type": "object"
},
"RangeSlider": {
"additionalProperties": false,
"description": "Numeric multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "range_slider",
"default": "range_slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"items": {
"type": "number"
},
"maxItems": 2,
"minItems": 2,
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RangeSlider",
"type": "object"
},
"Slider": {
"additionalProperties": false,
"description": "Numeric single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "slider",
"default": "slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Default value for slider.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Slider",
"type": "object"
},
"Switch": {
"additionalProperties": false,
"description": "Boolean single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use boolean selectors](user-guides/selectors.md/#boolean-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "switch",
"default": "switch",
"title": "Type",
"type": "string"
},
"value": {
"default": false,
"description": "Initial state of the switch. When `True`, the switch is enabled/on.\n When `False`, the switch is disabled/off.",
"title": "Value",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title/Label to be displayed to the right of the switch.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Switch",
"type": "object"
},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"_OptionsDictType": {
"additionalProperties": false,
"description": "Permissible sub-type for OptionsType. Needs to be in the format of {\"label\": XXX, \"value\": XXX}.",
"properties": {
"label": {
"title": "Label",
"type": "string"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
],
"title": "Value"
}
},
"required": [
"label",
"value"
],
"title": "_OptionsDictType",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Alter the arguments supplied to any `targets`.\n\nAbstract: Usage documentation\n [How to use parameters](user-guides/parameters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Parameter(targets=[\"scatter.x\"], selector=vm.Slider(min=0, max=1, default=0.8, title=\"Bubble opacity\"))\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "parameter",
"default": "parameter",
"title": "Type",
"type": "string"
},
"targets": {
"items": {
"description": "Targets in the form of `<target_component>.<target_argument>`.",
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
],
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the parameter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific parameter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the parameter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"targets",
"selector"
],
"title": "Parameter",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
targets
selector
Selectors to be used inside a control.
show_in_url
Whether the parameter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific parameter values pre-set.
visible
Whether the parameter should be visible.
pydantic-model
Categorical single-option selector.
Can be provided to Filter or
Parameter.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"_OptionsDictType": {
"additionalProperties": false,
"description": "Permissible sub-type for OptionsType. Needs to be in the format of {\"label\": XXX, \"value\": XXX}.",
"properties": {
"label": {
"title": "Label",
"type": "string"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
],
"title": "Value"
}
},
"required": [
"label",
"value"
],
"title": "_OptionsDictType",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Categorical single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md/#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "radio_items",
"default": "radio_items",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RadioItems",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
options
value
title
Title to be displayed
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
actions
extra
Extra keyword arguments that are passed to dbc.RadioItems and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dbc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Numeric multi-option selector.
Can be provided to Filter or
Parameter.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Numeric multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "range_slider",
"default": "range_slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"items": {
"type": "number"
},
"maxItems": 2,
"minItems": 2,
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RangeSlider",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
min
Start value for slider.
max
End value for slider.
step
Step-size for marks on slider.
marks
Marks to be displayed on slider.
value
title
Title to be displayed.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
actions
extra
Extra keyword arguments that are passed to dcc.RangeSlider and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dcc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Numeric single-option selector.
Can be provided to Filter or
Parameter.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Numeric single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "slider",
"default": "slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Default value for slider.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Slider",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
min
Start value for slider.
max
End value for slider.
step
Step-size for marks on slider.
marks
Marks to be displayed on slider.
value
Default value for slider.
title
Title to be displayed.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
actions
extra
Extra keyword arguments that are passed to dcc.Slider and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dcc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Boolean single-option selector.
Can be provided to Filter or Parameter.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Boolean single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use boolean selectors](user-guides/selectors.md/#boolean-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "switch",
"default": "switch",
"title": "Type",
"type": "string"
},
"value": {
"default": false,
"description": "Initial state of the switch. When `True`, the switch is enabled/on.\n When `False`, the switch is disabled/off.",
"title": "Value",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title/Label to be displayed to the right of the switch.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Switch",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
value
Initial state of the switch. When True, the switch is enabled/on.
When False, the switch is disabled/off.
title
Title/Label to be displayed to the right of the switch.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
actions
extra
Extra keyword arguments that are passed to dbc.Switch and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dbc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
Wrapper for dash_table.DataTable to visualize tables in dashboard.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"JsonValue": {},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"additionalProperties": false,
"description": "Wrapper for `dash_table.DataTable` to visualize tables in dashboard.\n\nAbstract: Usage documentation\n [How to use tables](user-guides/table.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "table",
"default": "table",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `Table`",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `Table.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `Table`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Table",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
figure
Function that returns a Dash DataTable.
title
Title of the Table
header
Markdown text positioned below the Table.title. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.
footer
Markdown text positioned below the Table. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
actions
pydantic-model
Tabs to group together a set of Containers.
Usage documentation
Show JSON schema:
{
"$defs": {
"Action": {
"additionalProperties": false,
"description": "Custom action to be inserted into `actions` of source component.\n\nAbstract: Usage documentation\n [How to create custom actions](user-guides/custom-actions.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"outputs": {
"anyOf": [
{
"items": {
"type": "string"
},
"type": "array"
},
{
"additionalProperties": {
"type": "string"
},
"type": "object"
}
],
"default": [],
"title": "Outputs"
},
"notifications": {
"additionalProperties": {
"anyOf": [
{
"type": "string"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
},
{
"type": "null"
}
]
},
"description": "Notifications for when an action is in progress, completes successfully or fails",
"title": "Notifications",
"type": "object"
},
"type": {
"const": "action",
"default": "action",
"title": "Type",
"type": "string"
},
"inputs": {
"default": [],
"description": "List of inputs provided to the action function. Each input can be specified as\n `<model_id>` or `<model_id>.<argument_name>` or `<component_id>.<property>`.\n \u2757Deprecated: `inputs` is deprecated and [will not exist in Vizro 0.2.0](\n deprecations.md#action-model-inputs-argument).",
"items": {
"type": "string"
},
"title": "Inputs",
"type": "array"
}
},
"title": "Action",
"type": "object"
},
"AgGrid": {
"additionalProperties": false,
"description": "Wrapper for `dash_ag_grid.AgGrid` to visualize grids in a dashboard.\n\nAbstract: Usage documentation\n [How to use an AgGrid](user-guides/table.md/#ag-grid)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "ag_grid",
"default": "ag_grid",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `AgGrid`.",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `AgGrid.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `AgGrid`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "AgGrid",
"type": "object"
},
"Button": {
"additionalProperties": false,
"description": "Button that can trigger actions or navigate.\n\nAbstract: Usage documentation\n [How to use buttons](user-guides/button.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "button",
"default": "button",
"title": "Type",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
},
"text": {
"default": "Click me!",
"description": "Text to be displayed on button.",
"title": "Text",
"type": "string"
},
"href": {
"default": "",
"description": "URL (relative or absolute) to navigate to.",
"title": "Href",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `plain`, `filled` or `outlined`.",
"enum": [
"plain",
"filled",
"outlined"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the button text.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"title": "Button",
"type": "object"
},
"Card": {
"additionalProperties": false,
"description": "Card based on Markdown syntax.\n\nAbstract: Usage documentation\n [How to use cards](user-guides/card.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "card",
"default": "card",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown string to create card title/text that should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned above the card text. Follows the CommonMark specification. Ideal for\n adding supplementary information.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned at the bottom of the `Card`. Follows the CommonMark specification.\n Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"href": {
"default": "",
"description": "URL (relative or absolute) to navigate to. If not provided the Card serves as a text card only.",
"title": "Href",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon in the top-right corner of the Card.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"required": [
"text"
],
"title": "Card",
"type": "object"
},
"Cascader": {
"additionalProperties": false,
"description": "Cascader selector for [`Filter`][vizro.models.Filter] and [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [Hierarchical selectors](user-guides/selectors.md#hierarchical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "cascader",
"default": "cascader",
"title": "Type",
"type": "string"
},
"options": {
"additionalProperties": true,
"default": {},
"description": "Nested tree: dict keys are branch labels; each branch is a dict or a non-empty list of scalar leaf values (str, int, float, bool, or date).",
"title": "Options",
"type": "object"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"description": "Selected leaf value, or list of leaves when multi=True. Must be valid for `options`. If omitted, the first parent node is selected.",
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to allow selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Cascader",
"type": "object"
},
"Checklist": {
"additionalProperties": false,
"description": "Categorical multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "checklist",
"default": "checklist",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"show_select_all": {
"default": true,
"description": "Whether to display the 'Select All' option that enables users to select or deselect all available options with a single click.",
"title": "Show Select All",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Checklist",
"type": "object"
},
"Container": {
"additionalProperties": false,
"description": "Container to group together a set of components on a page.\n\nAbstract: Usage documentation\n [How to use containers](user-guides/container.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "container",
"default": "container",
"title": "Type",
"type": "string"
},
"components": {
"items": {
"description": "Component that makes up part of the layout on the page.",
"discriminator": {
"mapping": {
"ag_grid": "#/$defs/AgGrid",
"button": "#/$defs/Button",
"card": "#/$defs/Card",
"container": "#/$defs/Container",
"figure": "#/$defs/Figure",
"graph": "#/$defs/Graph",
"table": "#/$defs/Table",
"tabs": "#/$defs/Tabs",
"text": "#/$defs/Text"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/AgGrid"
},
{
"$ref": "#/$defs/Button"
},
{
"$ref": "#/$defs/Card"
},
{
"$ref": "#/$defs/Container"
},
{
"$ref": "#/$defs/Figure"
},
{
"$ref": "#/$defs/Graph"
},
{
"$ref": "#/$defs/Text"
},
{
"$ref": "#/$defs/Table"
},
{
"$ref": "#/$defs/Tabs"
}
]
},
"minItems": 1,
"title": "Components",
"type": "array"
},
"title": {
"default": "",
"description": "Title of the `Container`",
"title": "Title",
"type": "string"
},
"layout": {
"anyOf": [
{
"description": "Type of layout to place components on the page.",
"oneOf": [
{
"$ref": "#/$defs/Grid"
},
{
"$ref": "#/$defs/Flex"
},
{
"$ref": "#/$defs/Layout"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Layout"
},
"collapsed": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "null"
}
],
"default": null,
"description": "Boolean flag that determines whether the container is collapsed on initial load. Set to `True` for a collapsed state, `False` for an expanded state. Defaults to `None`, meaning the container is not collapsible.",
"title": "Collapsed"
},
"variant": {
"anyOf": [
{
"enum": [
"plain",
"filled",
"outlined"
],
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Predefined styles to choose from. Options are `plain`, `filled` or `outlined`. Defaults to `plain` (or `outlined` for collapsible container). ",
"title": "Variant"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"controls": {
"default": [],
"items": {
"description": "Control that affects components on the page.",
"discriminator": {
"mapping": {
"filter": "#/$defs/Filter",
"parameter": "#/$defs/Parameter"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Filter"
},
{
"$ref": "#/$defs/Parameter"
}
]
},
"title": "Controls",
"type": "array"
}
},
"required": [
"components"
],
"title": "Container",
"type": "object"
},
"DatePicker": {
"additionalProperties": false,
"description": "Temporal single/range option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use temporal selectors](user-guides/selectors.md#temporal-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "date_picker",
"default": "date_picker",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Start date for date picker.",
"title": "Min"
},
"max": {
"anyOf": [
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "End date for date picker.",
"title": "Max"
},
"value": {
"anyOf": [
{
"items": {
"format": "date",
"type": "string"
},
"type": "array"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"description": "Default date/dates for date picker.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"range": {
"default": true,
"description": "Boolean flag for displaying range picker.",
"title": "Range",
"type": "boolean"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "DatePicker",
"type": "object"
},
"Dropdown": {
"additionalProperties": false,
"description": "Categorical single/multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "dropdown",
"default": "dropdown",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
]
},
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"multi": {
"default": true,
"description": "Whether to enable selection of multiple values",
"title": "Multi",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"variant": {
"default": "filled",
"description": "Predefined styles to choose from. Options are `filled` or `plain`.",
"enum": [
"plain",
"filled"
],
"title": "Variant",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Dropdown",
"type": "object"
},
"Figure": {
"additionalProperties": false,
"description": "Object that is reactive to controls, for example a KPI card.\n\nAbstract: Usage documentation\n [How to use figures](user-guides/figure.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "figure",
"default": "figure",
"title": "Type",
"type": "string"
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Figure",
"type": "object"
},
"Filter": {
"additionalProperties": false,
"description": "Filter the data supplied to `targets`.\n\nAbstract: Usage documentation\n [How to use filters](user-guides/filters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Filter(column=\"species\")\n vm.Filter(column=[\"continent\", \"country\"])\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter",
"default": "filter",
"title": "Type",
"type": "string"
},
"column": {
"anyOf": [
{
"type": "string"
},
{
"items": {
"type": "string"
},
"type": "array"
}
],
"description": "Name of the column to filter, or an ordered list of column names for a hierarchical filter.",
"title": "Column"
},
"targets": {
"default": [],
"description": "Target component to be affected by filter. If none are given then target all components on the page that use `column`.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"anyOf": [
{
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
]
},
{
"type": "null"
}
],
"default": null,
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the filter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific filter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the filter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"column"
],
"title": "Filter",
"type": "object"
},
"Flex": {
"additionalProperties": false,
"description": "Flex layout for components on a [`Page`][vizro.models.Page] or in a [`Container`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use the Flex layout](user-guides/layouts.md#flex-layout)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "flex",
"default": "flex",
"title": "Type",
"type": "string"
},
"direction": {
"default": "column",
"description": "Sets the direction of the flex items inside the container. Options are `row` or `column`.",
"enum": [
"row",
"column"
],
"title": "Direction",
"type": "string"
},
"gap": {
"default": "24px",
"description": "Specifies the gap between rows and columns. Allowed units: 'px', 'rem', 'em', or '%'.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Gap",
"type": "string"
},
"wrap": {
"default": false,
"description": "Determines whether flex items are forced onto a single line or can wrap onto multiple lines. If `False`, all items will be on one line. If `True`, items will wrap onto multiple lines.",
"title": "Wrap",
"type": "boolean"
}
},
"title": "Flex",
"type": "object"
},
"Graph": {
"additionalProperties": false,
"description": "Wrapper for `dcc.Graph` to visualize charts.\n\nAbstract: Usage documentation\n [How to use graphs](user-guides/graph.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "graph",
"default": "graph",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `Graph`",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `Graph.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `Graph`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Graph",
"type": "object"
},
"Grid": {
"additionalProperties": false,
"description": "Grid layout for components on a [`Page`][vizro.models.Page] or in a [`Container`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use the Grid layout](user-guides/layouts.md#grid-layout)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "grid",
"default": "grid",
"title": "Type",
"type": "string"
},
"grid": {
"description": "Grid specification to arrange components on screen.",
"items": {
"items": {
"type": "integer"
},
"type": "array"
},
"title": "Grid",
"type": "array"
},
"row_gap": {
"default": "24px",
"description": "Specifies the gap between rows. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Gap",
"type": "string"
},
"col_gap": {
"default": "24px",
"description": "Specifies the gap between columns. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Gap",
"type": "string"
},
"row_min_height": {
"default": "0px",
"description": "Minimum row height in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Min Height",
"type": "string"
},
"col_min_width": {
"default": "0px",
"description": "Minimum column width in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Min Width",
"type": "string"
}
},
"required": [
"grid"
],
"title": "Grid",
"type": "object"
},
"JsonValue": {},
"Layout": {
"additionalProperties": false,
"deprecated": true,
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "legacy_layout",
"default": "legacy_layout",
"title": "Type",
"type": "string"
},
"grid": {
"description": "Grid specification to arrange components on screen.",
"items": {
"items": {
"type": "integer"
},
"type": "array"
},
"title": "Grid",
"type": "array"
},
"row_gap": {
"default": "24px",
"description": "Specifies the gap between rows. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Gap",
"type": "string"
},
"col_gap": {
"default": "24px",
"description": "Specifies the gap between columns. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Gap",
"type": "string"
},
"row_min_height": {
"default": "0px",
"description": "Minimum row height in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Row Min Height",
"type": "string"
},
"col_min_width": {
"default": "0px",
"description": "Minimum column width in px. Allowed units: `px`, `rem`, `em`, or `%`.",
"pattern": "^\\d+(px|rem|em|%)$",
"title": "Col Min Width",
"type": "string"
}
},
"required": [
"grid"
],
"title": "Layout",
"type": "object"
},
"Parameter": {
"additionalProperties": false,
"description": "Alter the arguments supplied to any `targets`.\n\nAbstract: Usage documentation\n [How to use parameters](user-guides/parameters.md)\n\nExample:\n ```python\n import vizro.models as vm\n\n vm.Parameter(targets=[\"scatter.x\"], selector=vm.Slider(min=0, max=1, default=0.8, title=\"Bubble opacity\"))\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "parameter",
"default": "parameter",
"title": "Type",
"type": "string"
},
"targets": {
"items": {
"description": "Targets in the form of `<target_component>.<target_argument>`.",
"type": "string"
},
"title": "Targets",
"type": "array"
},
"selector": {
"description": "Selectors to be used inside a control.",
"discriminator": {
"mapping": {
"cascader": "#/$defs/Cascader",
"checklist": "#/$defs/Checklist",
"date_picker": "#/$defs/DatePicker",
"dropdown": "#/$defs/Dropdown",
"radio_items": "#/$defs/RadioItems",
"range_slider": "#/$defs/RangeSlider",
"slider": "#/$defs/Slider",
"switch": "#/$defs/Switch"
},
"propertyName": "type"
},
"oneOf": [
{
"$ref": "#/$defs/Cascader"
},
{
"$ref": "#/$defs/Checklist"
},
{
"$ref": "#/$defs/DatePicker"
},
{
"$ref": "#/$defs/Dropdown"
},
{
"$ref": "#/$defs/RadioItems"
},
{
"$ref": "#/$defs/RangeSlider"
},
{
"$ref": "#/$defs/Slider"
},
{
"$ref": "#/$defs/Switch"
}
],
"title": "Selector"
},
"show_in_url": {
"default": false,
"description": "Whether the parameter should be included in the URL query string. Useful for bookmarking or sharing dashboards with specific parameter values pre-set.",
"title": "Show In Url",
"type": "boolean"
},
"visible": {
"default": true,
"description": "Whether the parameter should be visible.",
"title": "Visible",
"type": "boolean"
}
},
"required": [
"targets",
"selector"
],
"title": "Parameter",
"type": "object"
},
"RadioItems": {
"additionalProperties": false,
"description": "Categorical single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use categorical selectors](user-guides/selectors.md/#categorical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "radio_items",
"default": "radio_items",
"title": "Type",
"type": "string"
},
"options": {
"default": [],
"items": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"$ref": "#/$defs/_OptionsDictType"
}
]
},
"title": "Options",
"type": "array"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RadioItems",
"type": "object"
},
"RangeSlider": {
"additionalProperties": false,
"description": "Numeric multi-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "range_slider",
"default": "range_slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"items": {
"type": "number"
},
"maxItems": 2,
"minItems": 2,
"type": "array"
},
{
"type": "null"
}
],
"default": null,
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "RangeSlider",
"type": "object"
},
"Slider": {
"additionalProperties": false,
"description": "Numeric single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or\n[`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use numerical selectors](user-guides/selectors.md/#numerical-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "slider",
"default": "slider",
"title": "Type",
"type": "string"
},
"min": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Start value for slider.",
"title": "Min"
},
"max": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "End value for slider.",
"title": "Max"
},
"step": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Step-size for marks on slider.",
"title": "Step"
},
"marks": {
"anyOf": [
{
"additionalProperties": {
"type": "string"
},
"type": "object"
},
{
"type": "null"
}
],
"default": {},
"description": "Marks to be displayed on slider.",
"title": "Marks"
},
"value": {
"anyOf": [
{
"type": "number"
},
{
"type": "null"
}
],
"default": null,
"description": "Default value for slider.",
"title": "Value"
},
"title": {
"default": "",
"description": "Title to be displayed.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Slider",
"type": "object"
},
"Switch": {
"additionalProperties": false,
"description": "Boolean single-option selector.\n\nCan be provided to [`Filter`][vizro.models.Filter] or [`Parameter`][vizro.models.Parameter].\n\nAbstract: Usage documentation\n [How to use boolean selectors](user-guides/selectors.md/#boolean-selectors)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "switch",
"default": "switch",
"title": "Type",
"type": "string"
},
"value": {
"default": false,
"description": "Initial state of the switch. When `True`, the switch is enabled/on.\n When `False`, the switch is disabled/off.",
"title": "Value",
"type": "boolean"
},
"title": {
"default": "",
"description": "Title/Label to be displayed to the right of the switch.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Switch",
"type": "object"
},
"Table": {
"additionalProperties": false,
"description": "Wrapper for `dash_table.DataTable` to visualize tables in dashboard.\n\nAbstract: Usage documentation\n [How to use tables](user-guides/table.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "table",
"default": "table",
"title": "Type",
"type": "string"
},
"title": {
"default": "",
"description": "Title of the `Table`",
"title": "Title",
"type": "string"
},
"header": {
"default": "",
"description": "Markdown text positioned below the `Table.title`. Follows the CommonMark specification. Ideal for adding supplementary information such as subtitles, descriptions, or additional context.",
"title": "Header",
"type": "string"
},
"footer": {
"default": "",
"description": "Markdown text positioned below the `Table`. Follows the CommonMark specification. Ideal for providing further details such as sources, disclaimers, or additional notes.",
"title": "Footer",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
},
"actions": {
"default": [],
"items": {
"description": "Action.",
"oneOf": [
{
"$ref": "#/$defs/Action"
},
{
"$ref": "#/$defs/export_data"
},
{
"$ref": "#/$defs/filter_interaction"
},
{
"$ref": "#/$defs/set_control"
},
{
"$ref": "#/$defs/show_notification"
},
{
"$ref": "#/$defs/update_notification"
}
]
},
"title": "Actions",
"type": "array"
}
},
"title": "Table",
"type": "object"
},
"Tabs": {
"additionalProperties": false,
"description": "Tabs to group together a set of [`Containers`][vizro.models.Container].\n\nAbstract: Usage documentation\n [How to use tabs](user-guides/tabs.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "tabs",
"default": "tabs",
"title": "Type",
"type": "string"
},
"tabs": {
"items": {
"$ref": "#/$defs/Container"
},
"minItems": 1,
"title": "Tabs",
"type": "array"
},
"title": {
"default": "",
"description": "Title displayed above Tabs.",
"title": "Title",
"type": "string"
},
"description": {
"anyOf": [
{
"$ref": "#/$defs/Tooltip"
},
{
"type": "null"
}
],
"default": null,
"description": "Optional markdown string that adds an icon next to the title.\n Hovering over the icon shows a tooltip with the provided description."
}
},
"required": [
"tabs"
],
"title": "Tabs",
"type": "object"
},
"Text": {
"additionalProperties": false,
"description": "Text based on Markdown syntax.\n\nAbstract: Usage documentation\n [How to add text to your page](user-guides/text.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "text",
"default": "text",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown string to create text that should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
}
},
"required": [
"text"
],
"title": "Text",
"type": "object"
},
"Tooltip": {
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
},
"_OptionsDictType": {
"additionalProperties": false,
"description": "Permissible sub-type for OptionsType. Needs to be in the format of {\"label\": XXX, \"value\": XXX}.",
"properties": {
"label": {
"title": "Label",
"type": "string"
},
"value": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "number"
},
{
"type": "string"
},
{
"format": "date",
"type": "string"
}
],
"title": "Value"
}
},
"required": [
"label",
"value"
],
"title": "_OptionsDictType",
"type": "object"
},
"export_data": {
"additionalProperties": false,
"description": "Exports data of target charts, tables and figures.\n\nAbstract: Usage documentation\n [How to export data](user-guides/data-actions.md#export-data)\n\nExample:\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Export data\",\n actions=va.export_data(targets=[\"graph_id\", \"table_id\"], file_format=\"xlsx\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "export_data",
"default": "export_data",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "List of target component ids for which to download data. If none are given then download data from all components on the page.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
},
"file_format": {
"default": "csv",
"description": "Format of downloaded files.",
"enum": [
"csv",
"xlsx"
],
"title": "File Format",
"type": "string"
}
},
"title": "export_data",
"type": "object"
},
"filter_interaction": {
"additionalProperties": false,
"deprecated": true,
"description": "Filters targeted graph, tables and figures when a source graph or table is clicked.",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "filter_interaction",
"default": "filter_interaction",
"title": "Type",
"type": "string"
},
"targets": {
"default": [],
"description": "Target component IDs.",
"items": {
"type": "string"
},
"title": "Targets",
"type": "array"
}
},
"title": "filter_interaction",
"type": "object"
},
"set_control": {
"additionalProperties": false,
"description": "Sets the value of a control, which then updates its targets.\n\nAbstract: Usage documentation\n [Graph and table interactions](user-guides/graph-table-actions.md)\n\nThe following Vizro models can be a source of `set_control`:\n\n* [`AgGrid`][vizro.models.AgGrid]: triggers `set_control` when `cellClicked` or `selectedRows` changes (for example\nafter a cell click or when the row selection changes). `value` can be:\n\n * `\"cell\"`, `\"column\"`, or `\"row\"` to use the clicked cell's value, column id, or row id respectively.\n * Any other string to treat as a column name, taking values from the selected row(s).\n* [`Graph`][vizro.models.Graph]: triggers `set_control` when the user clicks on data in the graph. `value` is a\nstring that can be used in two ways to specify how to set `control`:\n\n * Column from which to take the value. This requires you to set `custom_data` in the graph's `figure` function.\n * String to [traverse a Box](https://github.com/cdgriffith/Box/wiki/Types-of-Boxes#box-dots) that contains the\n trigger data [`clickData[\"points\"][0]`](https://dash.plotly.com/interactive-graphing). This is typically\n useful for a positional variable, for example `\"x\"`, and does not require setting `custom_data`.\n\n* [`Figure`][vizro.models.Figure]: triggers `set_control` when the user clicks on the figure. `value` specifies a\nliteral value to set `control` to.\n* [`Button`][vizro.models.Button]: triggers `set_control` when the user clicks on the button. `value` specifies a\nliteral value to set `control` to.\n* [`Card`][vizro.models.Card]: triggers `set_control` when the user clicks on the card. `value` specifies a\nliteral value to set `control` to.\n\nExample: `AgGrid` as trigger\n ```python\n import vizro.actions as va\n\n vm.AgGrid(\n figure=dash_ag_grid(iris),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger with `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.scatter(iris, x=\"sepal_width\", y=\"sepal_length\", custom_data=\"species\"),\n actions=va.set_control(control=\"target_control\", value=\"species\"),\n )\n ```\n\nExample: `Graph` as trigger without `custom_data`\n ```python\n import vizro.actions as va\n\n vm.Graph(\n figure=px.box(iris, x=\"species\", y=\"sepal_length\"),\n actions=va.set_control(control=\"target_control\", value=\"x\"),\n )\n ```\n\nExample: `Figure` as trigger\n ```python\n import vizro.actions as va\n from vizro.figures import kpi_card\n\n vm.Figure(\n figure=kpi_card(tips, value_column=\"tip\", title=\"Click KPI to set control to A\"),\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Button` as trigger\n ```python\n import vizro.actions as va\n\n vm.Button(\n text=\"Click to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```\n\nExample: `Card` as trigger\n ```python\n import vizro.actions as va\n\n vm.Card(\n title=\"Click Card to set control to A\",\n actions=va.set_control(control=\"target_control\", value=\"A\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "set_control",
"default": "set_control",
"title": "Type",
"type": "string"
},
"control": {
"description": "Filter or Parameter component id to be affected by the trigger. If the control is on a different page to the trigger, then it must have `show_in_url=True`.",
"title": "Control",
"type": "string"
},
"value": {
"$ref": "#/$defs/JsonValue",
"description": "Value to take from trigger and send to the `target`. Format depends on the model that triggers `set_control`."
}
},
"required": [
"control",
"value"
],
"title": "set_control",
"type": "object"
},
"show_notification": {
"additionalProperties": false,
"description": "Shows a notification message.\n\nAbstract: Usage documentation\n [Notifications](user-guides/notification-actions.md)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=va.show_notification(\n title=\"Useful information\",\n text=\"This is some useful information that you should know.\",\n ),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "show_notification",
"default": "show_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
}
},
"required": [
"text"
],
"title": "show_notification",
"type": "object"
},
"update_notification": {
"additionalProperties": false,
"description": "Updates an existing notification message.\n\nThis action updates notifications that were previously created with\n[`show_notification`][vizro.actions.show_notification]. `notification` must match the `id` of the original\n`show_notification` action.\n\nAbstract: Usage documentation\n [Update notification](user-guides/notification-actions.md#update-existing-notification)\n\nExample:\n ```python\n import vizro.actions as va\n import vizro.models as vm\n\n vm.Button(\n text=\"Save\",\n actions=[\n va.show_notification(id=\"save_notification\", text=\"Saving data...\", variant=\"progress\"),\n va.export_data(),\n va.update_notification(\n notification=\"save_notification\", text=\"Data saved successfully!\", variant=\"success\"\n ),\n ],\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "update_notification",
"default": "update_notification",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown text for the main notification message. Follows the CommonMark specification.",
"title": "Text",
"type": "string"
},
"variant": {
"default": "info",
"description": "Variant that determines color and default icon. If `progress`, the notification will show a loading spinner instead of an icon.",
"enum": [
"info",
"success",
"warning",
"error",
"progress"
],
"title": "Variant",
"type": "string"
},
"title": {
"default": "",
"description": "Notification title. Set to `\"\"` to hide the title. Defaults to the capitalized variant name, for example `\"Info\"` for `variant=\"info\"`.",
"title": "Title",
"type": "string"
},
"icon": {
"default": "",
"description": "Icon name from the [Google Material Icon Library](https://fonts.google.com/icons). Ignored if `variant='progress'`. Defaults to the variant-specific icon, for example 'info' for 'info' variant.",
"title": "Icon",
"type": "string"
},
"auto_close": {
"anyOf": [
{
"type": "boolean"
},
{
"type": "integer"
}
],
"default": 4000,
"description": "Auto-close duration in milliseconds. Set to `False` to keep the notification open until the user closes it manually. Default value depends on variant: `4000` for info/success/warning/error, `False` for progress.",
"title": "Auto Close"
},
"notification": {
"description": "Notification to update. Must match the id of the original `show_notification` action.",
"title": "Notification",
"type": "string"
}
},
"required": [
"text",
"notification"
],
"title": "update_notification",
"type": "object"
}
},
"$ref": "#/$defs/Tabs"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
tabs
title
Title displayed above Tabs.
description
Optional markdown string that adds an icon next to the title. Hovering over the icon shows a tooltip with the provided description.
pydantic-model
Text based on Markdown syntax.
Usage documentation
Show JSON schema:
{
"additionalProperties": false,
"description": "Text based on Markdown syntax.\n\nAbstract: Usage documentation\n [How to add text to your page](user-guides/text.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"type": {
"const": "text",
"default": "text",
"title": "Type",
"type": "string"
},
"text": {
"description": "Markdown string to create text that should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
}
},
"required": [
"text"
],
"title": "Text",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
text
Markdown string to create text that should adhere to the CommonMark Spec.
extra
Extra keyword arguments that are passed to vdc.Markdown and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior.
Visit the dcc documentation
to see all available arguments. Not part of the official Vizro schema and the
underlying component may change in the future.
pydantic-model
A tooltip that displays text when hovering over an icon.
Usage documentation
Read more about usage in the guides on dashboards, pages, containers, graphs, tables, tabs, selectors and buttons.
Tooltip on a Checklist selector
Show JSON schema:
{
"additionalProperties": false,
"description": "A tooltip that displays text when hovering over an icon.\n\nAbstract: Usage documentation\n Read more about usage in the guides on [dashboards](user-guides/dashboard.md#add-a-dashboard-tooltip),\n [pages](user-guides/pages.md#add-a-tooltip),\n [containers](user-guides/container.md#add-a-tooltip),\n [graphs](user-guides/graph.md#add-a-tooltip),\n [tables](user-guides/table.md#add-a-tooltip), [tabs](user-guides/tabs.md#add-a-tooltip),\n [selectors](user-guides/selectors.md#add-a-tooltip) and\n [buttons](user-guides/button.md#add-a-tooltip).\n\nExample: `Tooltip` on a [`Checklist`][vizro.models.Checklist] selector\n ```python\n import vizro.models as vm\n\n vm.Checklist(\n title=\"Select Species\",\n description=vm.Tooltip(text=\"Select something\", icon=\"start\"),\n )\n ```",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
},
"text": {
"description": "Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.",
"title": "Text",
"type": "string"
},
"icon": {
"description": "Icon name from Google Material icons library.",
"title": "Icon",
"type": "string"
}
},
"required": [
"text",
"icon"
],
"title": "Tooltip",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
text
Markdown string for text shown when hovering over the icon. Should adhere to the CommonMark Spec.
icon
Icon name from Google Material icons library.
extra
Extra keyword arguments that are passed to dbc.Tooltip and overwrite any
defaults chosen by the Vizro team. This may have unexpected behavior. Visit the
dbc documentation
to see all available arguments. Not part of the official Vizro schema and
the underlying component may change in the future.
pydantic-model
All Vizro models inherit from this class.
Usage documentation
Show JSON schema:
{
"additionalProperties": false,
"description": "All Vizro models inherit from this class.\n\nAbstract: Usage documentation\n [Custom components](user-guides/custom-components.md)",
"properties": {
"id": {
"description": "ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.",
"title": "Id",
"type": "string"
}
},
"title": "VizroBaseModel",
"type": "object"
}
Fields:
Name
Description
id
ID to identify model. Must be unique throughout the whole dashboard. When no ID is chosen, ID will be automatically generated.
Types used in pydantic fields.
module-attribute
ActionType = (
"Action"
| "export_data"
| "filter_interaction"
| "set_control"
| "show_notification"
| "update_notification"
| SkipJsonSchema["_filter"]
| SkipJsonSchema["_parameter"]
| SkipJsonSchema["_on_page_load"]
)
Discriminated union. Type of action: Action, export_data or filter_interaction
module-attribute
ActionsType = list[ActionType]
List of actions that can be triggered by a component. Accepts either a single
ActionType or a list of ActionType.
Defaults to [].
module-attribute
module-attribute
module-attribute
module-attribute
MultiValueType: TypeAlias = list[SingleValueType]
Permissible value types for multi-value selectors. Values are displayed as default.
module-attribute
List of page IDs or a mapping from name of a group to a list of page IDs (for hierarchical sub-navigation).
module-attribute
module-attribute
OptionsType: TypeAlias = list[
SingleValueType | _OptionsDictType
]
Permissible options types for selectors. Options are available choices for user to select from.
module-attribute
List or dictionary of outputs modified by the action function. Accepts either a single string,
a list of strings, or a dictionary mapping strings to strings. Each output can be specified as
<model_id> or <model_id>.<argument_name> or <component_id>.<property>. Defaults to [].
module-attribute
SelectorType = "Cascader | Checklist | DatePicker | Dropdown | RadioItems | RangeSlider | Slider | Switch"
Discriminated union. Type of selector to be used inside a control: Cascader,
Checklist,
DatePicker, Dropdown, RadioItems,
RangeSlider, Slider or Switch.
module-attribute
SingleValueType: TypeAlias = StrictBool | float | str | date
Permissible value types for single-value selectors. Values are displayed as default.
Stores a captured function call to use in a dashboard.
Users do not need to instantiate this class directly. Instances are instead generated automatically
through the capture decorator.
Captures a function call to create a custom CapturedCallable.
Usage documentation
How to create custom actions, How to create custom charts, How to create custom tables, How to create figures.
| PARAMETER | DESCRIPTION |
|---|---|
mode
|
The mode of the captured callable.
TYPE:
|