{% clickable %}

Attributes

Parameter	Type	Required	Description
from	string	✓	Source element in {surfaceId}.{elementId} format — e.g., 'bm-library.open-btn'
target	string	✓	Bare surface id of the destination screen
transition	enum	—	none (default) | fade | slide | slide-back

Valid Parent Contexts

This tag is valid inside: {% interactions %}

Self-closing tag. To make a DSL element clickable, give it an id in the Pug block: button(id="open-btn"), then reference it as from="surfaceId.open-btn".

Navigation with slide-back transition

tagclickableinteractions clickable-tag-transition

{% clickable from="bm-detail.back-btn" target="bm-library" transition="slide-back" /%}