Mapping canvas

The canvas is where designers and developers bind live data to layouts without writing Liquid by hand.

Layout of the canvas

Centre — the frame as rendered from Figma.
Left — frame tree (IR view) with binding badges.
Right — Dataverse tables (filtered) and column types.
Top bar — Generate, Save, fidelity preview, undo/redo.

Binding types

Text → column — single string value. Type-coerced from numbers, dates, choices.
Image → image column / URL column — emitted as <img> with alt text from a sibling string column.
Repeating list → table — bind a group/frame as the template for a FetchXML loop.
Form → table — bind a form frame with submit. The generator emits a Power Pages Web API call.

Type coercion

Before generation runs, the canvas validates every binding:

Number → Text becomes {{ value | round: 0 }}.
DateTime → Text becomes {{ value | date: 'd MMM yyyy' }} (workspace locale).
Choice → Text uses the choice label, not the integer value.
Lookup → Text uses the primary-name field of the related row.
Unmappable bindings (e.g. binary → number) are flagged and block generation.

Mapping templates

Save a mapping to the workspace template library and re-apply it to a similar frame in another project. The matcher uses node names, types, and structure — perfect 1:1 isn't required.

Bindings are reversible

Every binding writes to a mapping_bindings row keyed by frame_id + node_path. Re-ingesting Figma keeps the same row whenever the node id survives.

Skip bindings for static frames

For "About" pages and other static content, click Skip bindings. The generator emits the layout with placeholder text from the Figma source.

Was this page helpful?Send feedback →