Markdown

Renders GitHub-flavoured Markdown as rich text — headings, lists, tables, task lists and highlighted code. Bind the content to a tag and the text becomes live.

Reach for it when you need:

• Work instructions beside the equipment they describe
• A live status summary written by a script

Component name: Markdown · Category: Display

In the palette: Renders Markdown (GitHub-Flavored) as rich text — headings, lists, tables, task lists and syntax-highlighted code. Bind the content to a tag to drive it live. Safe by default; raw HTML is opt-in and sanitised.

Properties

Any property can be bound to a tag, another component's property, or a query.

Property	Type	Default	Description
content	string	# Markdown Render rich text from a static string or a *… (truncated)	The Markdown source. Bindable — bind a tag/expression yielding a string (e.g. a work-order note or SOP) to swap the rendered content at runtime.
enableGfm	boolean	true	GitHub-Flavored Markdown: tables, task lists, strikethrough and autolinks. Turn off for strict CommonMark.
enableEmoji	boolean	true	Convert :shortcode: emoji (e.g. 🎉 → 🎉, 🚀 → 🚀). Unicode emoji always render regardless.
enableSyntaxHighlight	boolean	true	Syntax-highlight fenced code blocks (lazy-loads the highlighter). Off = plain monospace block.
showCodeCopyButton	boolean	true	Show a copy-to-clipboard button on code blocks.
allowHtml	boolean	false	Render raw HTML embedded in the Markdown. OFF (default) = HTML is inert text, the safest option for tag-bound content. ON = HTML is rendered through a sanitiser that strips <script>, <iframe>, event handlers and javascript: URLs.
linkTarget	enum	_blank	Where links open. Options: _blank · _self.
align	enum	left	Horizontal text alignment. Options: left · center · right · justify.
fontSize	number	14	Root font size in px; the content scales relative to it.
padding	number	12	Inner padding in px.
emptyText	string	""	Placeholder shown when the content resolves to empty (e.g. before a tag first reports).
style	style	{}	Custom CSS properties

Events

Attach event actions to these in the Event Manager.

Event	Label	Group	Payload
click	Click	Mouse	The DOM event.
dblclick	Double click	Mouse	The DOM event.
contextmenu	Right click	Mouse	The DOM event.
mouseenter	Mouse enter	Mouse	The DOM event.
mouseleave	Mouse leave	Mouse	The DOM event.

Right-click behaves differently in the Designer

contextmenu fires your configured actions at runtime only — in LiveView and in preview. On the Designer canvas the right-click is captured to open the Event Manager, so testing it there will not run your actions. Test right-click in preview.

Notes

Raw HTML is opt-in and sanitised. Leave it off unless you have a specific need.