Customize template with theme.

In this screencast we will let users customize template with setting up a theme.

Lifecycle

Themes are array of UI options bind to data properties specifically related to UI rendering.
When an option value is selected, we assign data property with selected value. For example:

{
    "name": "Jane Doe",
    "counter": "10",
    "shape": ""
}

When user selects theme options, change event will assign value to data and trigger document update.

Can't we do this with an integration?

Yes, you can achieve exact same functionality with an integration.

When to use a theme?

Themes are best for templates working with big document objects. When document data gets large, providing possible template options on a seperate dedicated place can help users use editor faster. Our goal by introducing theme is to decouple complex document data from basic template options.