Display blocks

Show information: text, images, charts, cards, indicators. They do not take input.

This page is generated from the block registry, so it lists exactly what the Page Designer accepts. 80 blocks.

Block	What it is for
core.activity-feed	A reverse-chronological "who did what" feed.
core.agenda	Agenda list of dated items; fires selected.
core.alert	Message box with a title, severity and icon; can be dismissed (dismissed).
core.approval-history	History of an approval's decisions.
core.approval-stamp	Stamp that shows an approval status (such as Approved or Rejected) with text and rotation.
core.approval-timeline	Timeline of an approval's stages and decisions; fires select.
core.audio-player	Plays an audio clip inline — voicemail recordings, podcast-style briefings, recorded call snippets — using the browser's native HTML5 <audio> element, with no third-party player dependency.
core.avatar	Render a user/entity avatar — an image (src) or fallback initials — and emit a click event for opening a related menu/dropdown.
core.avatar-group	Row of overlapping avatars, collapsed after a maximum with a +n count.
core.badge	Render a small notification/count badge overlaid on an icon (e.g.
core.barcode	Renders a scannable linear (1D) barcode encoding a bound string value — e.g.
core.boxplot-chart	Box plot showing spread and outliers for each group.
core.calendar	Displays a month-grid calendar with bindable dated events, for use cases like a company holiday calendar, a leave calendar, or a shift schedule.
core.call-log	List of calls with outcome and time.
core.caption	Small caption text with alignment; accepts a translation key.
core.carousel	Rotating slides, optionally advancing on a timer; fires changed.
core.chart	Render a multi-series chart (categories on one axis, one or more named numeric series) from authored or bound JSON data.
core.chip	Render a compact pill/tag with a label, optional delete affordance, and click/delete events — also covers the platform taxonomy's "Tag" entry (same pill, no separate block type).
core.clock	Live clock, optionally with the date.
core.cohort-chart	Cohort retention table with periods as columns and cohorts as rows.
core.comments	A comment thread with a compose box.
core.communication-timeline	Timeline of messages and calls with a contact; fires select.
core.conversion-funnel	Funnel showing drop-off between conversion stages.
core.dashboard-header	Banner for the top of a dashboard with a title, subtitle and gradient.
core.distance	Shows the distance between two coordinates in a chosen unit.
core.donut-chart	Shows parts-of-a-whole as a ring (pie with a hole), leaving the center free for a total/label — the common "status breakdown" visualization.
core.emoji	Single emoji at a chosen size; fires clicked.
core.file-preview	Preview of a file by URL, name and type; fires opened.
core.funnel-chart	Shows a sequence of decreasing stages (e.g.
core.gauge	Shows a single numeric value against a min/max range as a dial — useful for a single KPI read at a glance (e.g.
core.heading	Render a semantic heading (h1–h6) with the accessibility role of a heading.
core.heatmap	Shows a row × column grid of values as color intensity — useful for attendance patterns, activity density, or any two-dimensional value matrix.
core.hero-header	A branded gradient banner with a title/subtitle — a mobile-specific widget ("wave header is also should be a block") for a page's top welcome/branding band.
core.histogram-chart	Histogram of numeric values in a chosen number of bins.
core.html-viewer	Displays a read-only block of HTML content — e.g.
core.icon	Render a single named icon glyph.
core.iframe	Embeds an external URL in a sandboxed frame.
core.image	Render a single image from a URL, with optional alt text and fixed width/height.
core.image-gallery	Displays a browsable set of images with optional captions — a single carousel-style widget for product photos, employee ID cards, document attachments, or any bound array of images, instead of authoring N separate core.image blocks.
core.json-viewer	Displays a formatted, read-only dump of a JSON value — useful for debugging screens, "raw data" inspector panels, webhook payload previews, or any place an author wants to show structured data verbatim rather than through custom formatted fields.
core.kpi-card	Shows a single headline metric with an optional label and a trend indicator against a previous value — the standard "big number" dashboard tile.
core.kpi-comparison	Side-by-side comparison of several KPI values.
core.label	Render a single line (or short run) of static, expression-derived, or bound text — the simplest text-display primitive in the widget catalog.
core.link	Render a hyperlink with configurable target text, destination, and open-target behavior, and emit a click event.
core.location-picker	Map for choosing a location with markers (optionally clustered), zoom and height; fires mapClicked and polygonDrawn.
core.map	An interactive map with markers.
core.markdown-viewer	Displays read-only, formatted markdown content — release notes, help text, policy documents authored in markdown — as rendered rich text, without an edit surface (contrast with core.markdown-editor).
core.notifications	A notification list with read/unread state.
core.org-chart	Renders a company/team hierarchy from a flat manager-reference list.
core.paragraph	Render a block of body text with paragraph semantics.
core.pareto-chart	Pareto chart: bars sorted by size with a cumulative line.
core.pdf-viewer	Embeds a PDF document inline on a Page/Form/Container/Dashboard — e.g.
core.pending-approval	Notice that an approval is pending, with content, icon and colour.
core.pie-chart	Shows parts-of-a-whole as a full pie, with each slice sized by its share of the total.
core.progress-bar	Render a horizontal (linear) progress indicator for a 0–100 value, with an optional caption — the linear counterpart to core.progress-ring.
core.progress-ring	Render a circular ("donut") progress indicator for a 0–100 value, with an optional caption.
core.qr-code	Renders a scannable QR code encoding a bound string value — e.g.
core.radar-chart	Compares one or more series across several shared axes (dimensions) on a polar grid — useful for multi-factor comparisons like skill assessments or vendor scorecards.
core.ranking-list	Ranked list of items by value, limited to a number of rows, in a chosen variant and format.
core.receipt-preview	Preview of a point-of-sale receipt with lines, subtotal, discount, tax and total.
core.sales-funnel	Funnel of sales stages with counts.
core.sales-territory-map	Map for sales territories with markers (optionally clustered), zoom and height; fires mapClicked and polygonDrawn.
core.sankey-chart	Sankey diagram of flows between nodes.
core.shopping-cart	Mini cart preview with a link to checkout; fires checkoutClicked.
core.sla-indicator	Indicator of time left to a due date, warning before the threshold and marking escalation.
core.sparkline	Shows a compact, axis-free line trend from a series of numbers — a small inline visual, typically paired with a KPI value in a dashboard card.
core.stat	Single figure with a label, number or currency format and an optional count-up animation.
core.status-display	Coloured status label with text and variant.
core.target-vs-actual	Shows an actual value against its target, with number or currency format.
core.territory-map	Map for territories with markers (optionally clustered), zoom and height; fires mapClicked and polygonDrawn.
core.timeline	Shows a chronological sequence of events.
core.tooltip	Render an inline help-icon trigger that shows a hint/explanation text — a leaf hint affordance, not a children-wrapping overlay around other content.
core.tree-view	A generic expandable/selectable tree — for core.org-chart's people-hierarchy card visualization, this widget is the generic-node-tree alternative.
core.treemap-chart	Treemap where area shows the size of each node.
core.video-player	Plays a video inline — training clips, product demos, recorded meetings — using the browser's native HTML5 <video> element, with no third-party player dependency.
core.warehouse-map	Map for warehouse locations with markers (optionally clustered), zoom and height; fires mapClicked and polygonDrawn.
core.waterfall-chart	Waterfall chart showing how steps add up to a total.
core.workflow-history	History of a workflow's events.
core.workflow-status	A read-only visual indicator of a workflow instance's current step.
core.workflow-timeline	Timeline of the steps a workflow has taken; fires select.

core.activity-feed

A reverse-chronological "who did what" feed.

Property	Type	Set from	Default
items	json	static, expression, binding	[{"id":"1","actor":"Jane Doe","action":"updated...

{ "blockType": "core.activity-feed", "instanceId": "onboarding-activity", "blockVersion": "1.0.0", "contractVersion": 1,
  "properties": { "items": {"source":"binding","binding":{"scope":"page","key":"recentActivity"}} } }

• Purely presentational, read-only — for interactive comment threads, use core.comments instead.

core.agenda

Property	Type	Set from	Default
items	json	static, expression, binding	[{"title":"Team Sync","date":"2026-09-05"},{"ti...
primaryPath	string	static	title
secondaryPath	string	static	description
datePath	string	static	date

Events: selected

core.alert

Property	Type	Set from	Default
title	string	static, expression, binding
message	string	static, expression, binding	This is an informational message.
severity	string	static, expression, binding	info
dismissible	boolean	static	true
icon	string	static

Events: dismissed

core.approval-history

Property	Type	Set from	Default
items	json	static, expression, binding	[{"id":"1","actor":"Jane Doe","action":"approve...

core.approval-stamp

Property	Type	Set from	Default
status	string	static, expression, binding	approved
text	string	static, expression, binding
rotation	number	static	-8

core.approval-timeline

Property	Type	Set from	Default
items	json	static, expression, binding	[{"id":"1","label":"Requested — Sam Patel","tim...

Events: select

core.audio-player

Plays an audio clip inline — voicemail recordings, podcast-style briefings, recorded call snippets — using the browser's native HTML5 <audio> element, with no third-party player dependency.

Property	Type	Set from	Default
url	string	static, expression, binding
fileId	string	static, expression, binding
allowDownload	boolean	static	true
adaptive	boolean	static	true
autoplay	boolean	static	false
loop	boolean	static	false

Events: played, paused, ended

{
  "instanceId": "audio-voicemail-playback",
  "blockType": "core.audio-player",
  "blockVersion": "1.0.0",
  "contractVersion": 1,
  "properties": {
    "url": { "source": "binding", "value": { "scope": "block", "key": "selectedVoicemailUrl" } }
  }
}

• Reserve autoplay: true for genuinely user-initiated contexts (e.g. opening a specific voicemail record) — most browsers will still require a prior user gesture.
• Wire ended for "did the user listen through" tracking rather than paused.
• Prefer core.video-player instead when a poster/visual thumbnail matters to the UX — core.audio-player has no visual surface beyond the native controls bar.

core.avatar

Render a user/entity avatar — an image (src) or fallback initials — and emit a click event for opening a related menu/dropdown.

Property	Type	Set from	Default
src	string	static, expression, binding
initials	string	static, expression, binding
alt	string	static, expression

Events: clicked

{
  "instanceId": "avt-current-user",
  "blockType": "core.avatar",
  "blockVersion": "1.0.0",
  "properties": {
    "src": { "source": "binding", "binding": { "scope": "session", "key": "user.photoUrl" } },
    "initials": { "source": "expression", "expression": "session.user.firstName[0] + session.user.lastName[0]" },
    "alt": { "source": "expression", "expression": "session.user.fullName" }
  },
  "events": {
    "clicked": {
      "source": "action-chain",
      "actions": [{ "type": "ui.openMenu", "menuId": "account-menu" }]
    }
  }
}

• Always author initials as a fallback alongside src, so the avatar degrades gracefully when the image URL is broken/unset.
• Author alt with the person/entity's name, not a generic string like "avatar".
• Wire clicked only when there is a real menu/action to open — a purely decorative avatar (e.g. inside a read-only list row) can leave the event unwired.

core.avatar-group

Property	Type	Set from	Default
items	json	static, expression, binding	[{"initials":"AB","alt":"Alex Brown"},{"initial...
max	number	static	5

core.badge

Render a small notification/count badge overlaid on an icon (e.g. an unread-count indicator).

Property	Type	Set from	Default
content	string	static, expression, binding
icon	string	static	notifications
color	string	static	error

{
  "instanceId": "badge-unread-notifications",
  "blockType": "core.badge",
  "blockVersion": "1.0.0",
  "properties": {
    "content": { "source": "binding", "binding": { "scope": "session", "key": "notifications.unreadCount" } },
    "icon": { "source": "static", "value": "notifications" },
    "color": { "source": "static", "value": "error" }
  }
}

• Keep content short (a count or a single short word) — the badge is a small overlay, not a text container.
• Reserve color: "error" (the default) for genuinely urgent/attention-needed counts; use info/primary for neutral counts.
• Author an a11yLabelKey describing what the count means (e.g. "unread notifications") since the raw number alone is a weak accessible name.

core.barcode

Renders a scannable linear (1D) barcode encoding a bound string value — e.g. a SKU, order number, or asset serial.

Property	Type	Set from	Default
value	string	static, expression, binding
height	number	static	60
moduleColor	string	static	#000000
backgroundColor	string	static	#ffffff

{
  "instanceId": "barcode-asset-tag",
  "blockType": "core.barcode",
  "blockVersion": "1.0.0",
  "contractVersion": 1,
  "properties": {
    "value": { "source": "binding", "value": { "scope": "record", "key": "assetSerial" } },
    "height": { "source": "static", "value": 50 }
  }
}

• Keep encoded values to printable ASCII (letters, digits, common punctuation) — Code Set B is the only mode supported.
• Use core.qr-code instead when the payload needs to carry more data (e.g. a full URL) than a linear barcode comfortably encodes.
• Ensure sufficient height and contrasting moduleColor/backgroundColor for reliable scanning, especially on printed labels.

core.boxplot-chart

Property	Type	Set from	Default
boxes	json	static, expression, binding	[{"category":"Team A","min":42,"q1":58,"median"...
label	string	static, expression, binding

core.calendar

Displays a month-grid calendar with bindable dated events, for use cases like a company holiday calendar, a leave calendar, or a shift schedule.

Property	Type	Set from	Default
events	json	static, expression, binding	[{"date":"2026-07-05","title":"Team Sync"},{"da...
initialMonth	string	static

Events: dateSelected, monthChanged

{
  "instanceId": "cal-company-holidays",
  "blockType": "core.calendar",
  "blockVersion": "1.0.0",
  "contractVersion": 1,
  "properties": {
    "events": { "source": "binding", "value": { "scope": "page", "key": "companyHolidays" } },
    "initialMonth": { "source": "static", "value": "2026-07" }
  }
}

• Supply events via a binding or expression bound to a real data source rather than a large static list, so the calendar reflects live data.
• Use initialMonth to land the calendar on a business-relevant month (e.g. the current payroll or leave cycle) rather than always defaulting to "now".
• Listen to dateSelected to drive a detail panel or side list showing that day's full event detail, since the calendar cell itself only shows compact event titles.

core.call-log

Property	Type	Set from	Default
items	json	static, expression, binding	[{"id":"1","actor":"Jane Doe","action":"called"...

core.caption

Property	Type	Set from	Default
text	string	static, expression, binding
textKey	string	static
align	string	static	left

core.carousel

Property	Type	Set from	Default
slides	json	static, expression, binding	[{"image":"data:image/svg+xml,%3Csvg xmlns='htt...
autoAdvanceMs	number	static	0

Events: changed

core.chart

Render a multi-series chart (categories on one axis, one or more named numeric series) from authored or bound JSON data.

Property	Type	Set from	Default
series	json	static, expression, binding	[{"name":"Sales","points":[12,19,14,22,18]},{"n...
categories	json	static, expression, binding	["Mon","Tue","Wed","Thu","Fri"]
label	string	static, expression, binding
kind	string	static	line
stacked	boolean	static	false
orientation	string	static	vertical
legend	boolean	static

{
  "instanceId": "chart-monthly-sales",
  "blockType": "core.chart",
  "blockVersion": "1.0.0",
  "properties": {
    "categories": { "source": "static", "value": ["Jan", "Feb", "Mar", "Apr"] },
    "series": {
      "source": "static",
      "value": [
        { "name": "Revenue", "color": "#2E7D32", "points": [12000, 15500, 14200, 18300] }
      ]
    },
    "label": { "source": "static", "value": "Monthly Revenue" }
  }
}

• Keep categories and every series' points array the same length — the adapter aligns by index, not by any label matching.
• Author explicit per-series color for brand consistency instead of relying on theme-default fallback across many series.
• Bind series/categories to a real query/aggregation result rather than hand-authoring large static JSON blocks.

core.chip

Render a compact pill/tag with a label, optional delete affordance, and click/delete events — also covers the platform taxonomy's "Tag" entry (same pill, no separate block type).

Property	Type	Set from	Default
label	string	static, expression, binding
labelKey	string	static
color	string	static	default
variant	string	static	filled
deletable	boolean	static	false

Events: clicked, deleted

{
  "instanceId": "chip-status-open",
  "blockType": "core.chip",
  "blockVersion": "1.0.0",
  "properties": {
    "label": { "source": "static", "value": "Open" },
    "color": { "source": "static", "value": "info" },
    "variant": { "source": "static", "value": "filled" },
    "deletable": { "source": "static", "value": false }
  }
}

• Set deletable: true only for chips representing a removable selection/filter, not for static status indicators.
• Choose color semantically (e.g. error for blocked/critical, success for completed) rather than for decoration alone.
• Use variant: "outlined" for lower-emphasis tags (e.g. secondary metadata) and filled (default) for primary status chips.

core.clock

Property	Type	Set from	Default
showDate	boolean	static

core.cohort-chart

Property	Type	Set from	Default
periodLabels	json	static, expression, binding	["Month 0","Month 1","Month 2","Month 3"]
cohorts	json	static, expression, binding	[{"label":"Jan Cohort","values":[100,62,48,40]}...
label	string	static, expression, binding

core.comments

A comment thread with a compose box.

Property	Type	Set from	Default
items	json	static, expression, binding	[{"id":"1","author":"Jane Doe","text":"Looks go...

Events: commentSubmitted

{ "blockType": "core.comments", "instanceId": "leave-request-comments", "blockVersion": "1.0.0", "contractVersion": 1,
  "properties": { "items": {"source":"binding","binding":{"scope":"page","key":"comments"}} } }

• Wire commentSubmitted to a callApi action that appends the comment server-side, then refetches items.

core.communication-timeline

Property	Type	Set from	Default
items	json	static, expression, binding	[{"id":"1","label":"Email sent","timestamp":"20...

Events: select

core.conversion-funnel

Property	Type	Set from	Default
stages	json	static, expression, binding	[{"label":"Visitors","value":12000},{"label":"S...
height	number	static

core.dashboard-header

Property	Type	Set from	Default
title	string	static, expression, binding	Sales Overview
subtitle	string	static, expression, binding	Last updated a few minutes ago
colorFrom	string	static	#2563EB
colorTo	string	static	#1E40AF
height	number	static	140

core.distance

Property	Type	Set from	Default
fromLatitude	number	static, binding	37.7749
fromLongitude	number	static, binding	-122.4194
toLatitude	number	static, binding	34.0522
toLongitude	number	static, binding	-118.2437
unit	string	static	km

core.donut-chart

Shows parts-of-a-whole as a ring (pie with a hole), leaving the center free for a total/label — the common "status breakdown" visualization.

Property	Type	Set from	Default
series	json	static, expression, binding	[{"label":"Completed","value":62},{"label":"In ...
label	string	static, expression, binding
innerRadiusPercent	number	static	60
height	number	static
showLegend	boolean	static	true

{
  "contractVersion": 1,
  "instanceId": "onboarding-status-donut",
  "blockType": "core.donut-chart",
  "blockVersion": "1.0.0",
  "properties": {
    "series": {
      "source": "binding",
      "binding": { "scope": "page", "key": "onboardingTaskStatusCounts" }
    },
    "label": { "source": "static", "value": "Onboarding Tasks" },
    "innerRadiusPercent": { "source": "static", "value": 65 }
  }
}

• Use the freed center (via a low innerRadiusPercent) to show a total or
• Keep slice count small (3–6 typical) for a status breakdown.
• Prefer semantic colors (green=completed, red=blocked, etc.) via explicit

core.emoji

Property	Type	Set from	Default
value	string	static, expression, binding	🙂
size	number	static	24
label	string	static, expression

Events: clicked

core.file-preview

Property	Type	Set from	Default
fileUrl	string	static, expression, binding
fileName	string	static, expression, binding
mimeType	string	static, expression, binding
fileSize	number	static, expression, binding

Events: opened

core.funnel-chart

Shows a sequence of decreasing stages (e.g. a conversion or hiring pipeline) as progressively narrower bands, unlike a pie's parts-of-a-whole framing.

Property	Type	Set from	Default
stages	json	static, expression, binding	[{"label":"Visitors","value":1000},{"label":"Si...
height	number	static

{
  "contractVersion": 1,
  "instanceId": "hiring-pipeline-funnel",
  "blockType": "core.funnel-chart",
  "blockVersion": "1.0.0",
  "properties": {
    "stages": {
      "source": "binding",
      "binding": "page.hiringPipelineCounts"
    }
  }
}

• Author stages in the actual pipeline order (largest/first stage first)
• Use consistent, semantically meaningful color per stage when the same
• Bind stages to a live aggregated query (already reduced to

core.gauge

Shows a single numeric value against a min/max range as a dial — useful for a single KPI read at a glance (e.g. capacity, score, completion).

Property	Type	Set from	Default
value	number	static, expression, binding
min	number	static	0
max	number	static	100
label	string	static, expression, binding
height	number	static
color	string	static

{
  "contractVersion": 1,
  "instanceId": "headcount-gauge",
  "blockType": "core.gauge",
  "blockVersion": "1.0.0",
  "properties": {
    "value": { "source": "binding", "binding": "page.currentHeadcount" },
    "min": { "source": "static", "value": 0 },
    "max": { "source": "static", "value": 250 },
    "label": { "source": "static", "value": "Headcount Capacity" }
  }
}

• Always author min/max to match the real domain of value (e.g.
• Set label so the dial is self-explanatory when placed on a dashboard
• Prefer a binding source for value when it reflects a live metric

core.heading

Render a semantic heading (h1–h6) with the accessibility role of a heading.

Property	Type	Set from	Default
text	string	static, expression, binding
textKey	string	static
level	string	static	h2

{
  "instanceId": "hdg-page-title",
  "blockType": "core.heading",
  "blockVersion": "1.0.0",
  "properties": {
    "text": { "source": "static", "value": "Employee Directory" },
    "level": { "source": "static", "value": "h1" }
  }
}

• Choose level to reflect real document structure (one h1 per page, nested h2/h3 sections) rather than for visual size alone — use theming/typography for pure visual sizing.
• Prefer core.heading over a styled core.label whenever the text is structurally a section/page title, so screen readers see correct heading semantics.
• Keep heading text authored via text (or a bound/expression value) short and scannable; use core.paragraph for supporting body copy underneath.

core.heatmap

Shows a row × column grid of values as color intensity — useful for attendance patterns, activity density, or any two-dimensional value matrix.

Property	Type	Set from	Default
rows	json	static, expression, binding	["Mon","Tue","Wed"]
columns	json	static, expression, binding	["AM","PM"]
cells	json	static, expression, binding	[{"row":"Mon","column":"AM","value":12},{"row":...

{
  "contractVersion": 1,
  "instanceId": "attendance-heatmap",
  "blockType": "core.heatmap",
  "blockVersion": "1.0.0",
  "properties": {
    "rows": {
      "source": "static",
      "value": ["Mon", "Tue", "Wed", "Thu", "Fri"]
    },
    "columns": {
      "source": "static",
      "value": ["Morning", "Afternoon", "Evening"]
    },
    "cells": {
      "source": "binding",
      "binding": "page.weeklyAttendanceDensity"
    }
  }
}

• Ensure every cells entry's row/column exactly matches an entry in
• Bind cells to an aggregated query (already reduced to row/column/value
• Keep both axes to a reasonable size (a handful of rows/columns) so

core.hero-header

A branded gradient banner with a title/subtitle — a mobile-specific widget ("wave header is also should be a block") for a page's top welcome/branding band.

Property	Type	Set from	Default
title	string	static, expression, binding	Welcome back
subtitle	string	static, expression, binding
colorFrom	string	static	#2563EB
colorTo	string	static	#1E40AF
height	number	static	220

{
  "instanceId": "hero-mobile-home",
  "blockType": "core.hero-header",
  "blockVersion": "1.0.0",
  "contractVersion": 1,
  "properties": {
    "title": { "source": "expression", "expression": "'Welcome back, ' + session.user.firstName" },
    "subtitle": { "source": "static", "value": "Here's what's happening today." }
  }
}

• Reserve for a page's/dashboard's top-of-page branding band, not repeated throughout a page.
• Keep title short — this is a banner, not a paragraph block (use core.paragraph for body copy).
• Stay within the declared 120–480 height range when authoring — it is a validated constraint, not a runtime clamp.

core.histogram-chart

Property	Type	Set from	Default
values	json	static, expression, binding	[12,15,14,18,22,25,19,21,30,28,17,16,24,26,20]
binCount	number	static	6
label	string	static, expression, binding

core.html-viewer

Displays a read-only block of HTML content — e.g. a rendered email template preview, a legal clause, or any HTML string produced upstream — without letting the author edit it in place (contrast with core.rich-text, which is the editable counterpart).

Property	Type	Set from	Default
value	string	static, expression, binding	Sample HTML content.

{
  "instanceId": "html-viewer-email-preview",
  "blockType": "core.html-viewer",
  "blockVersion": "1.0.0",
  "contractVersion": 1,
  "properties": {
    "value": { "source": "binding", "value": { "scope": "page", "key": "renderedEmailPreviewHtml" } }
  }
}

• Never assume upstream content is pre-sanitized — this block re-sanitizes regardless, so authoring against it is safe by default, but don't rely on it as your only defense if the value also flows elsewhere unsanitized.
• Use core.html-viewer only for genuinely HTML-shaped content; for hand-authored formatted text, prefer core.markdown-viewer, which is easier for a non-technical author to hand-edit.
• Don't expect <script>/<iframe>/embedded media to survive — the allow-list strips them; this block is for formatted text, not for embedding executable or third-party widget content (use core.iframe for that instead).

core.icon

Render a single named icon glyph.

Property	Type	Set from	Default
icon	string	static, expression, binding	star
colorToken	string	static
badge	boolean	static	false

{
  "instanceId": "icn-star",
  "blockType": "core.icon",
  "blockVersion": "1.0.0",
  "properties": {
    "icon": { "source": "static", "value": "star" }
  }
}

• Use a name from the render adapter's actual icon set (e.g. MUI icon names for the reference adapter) — an unresolvable name degrades silently at render, not at validation time.
• Author an a11yLabelKey when the icon conveys meaning on its own (e.g. an unlabeled status flag); leave it unset for purely decorative icons next to already-labeled text.
• Prefer core.badge instead of composing core.icon + core.label when the intent is a notification-count affordance.

core.iframe

Embeds an external URL in a sandboxed frame.

Property	Type	Set from	Default
url	string	static, expression, binding
height	string	static	480px

{ "blockType": "core.iframe", "instanceId": "external-report", "blockVersion": "1.0.0", "contractVersion": 1,
  "properties": { "url": {"source":"static","value":"https://example.com/dashboard"}, "height": {"source":"static","value":"600px"} } }

• Only embed trusted URLs — an iframe has no content sanitization of its own.

core.image

Render a single image from a URL, with optional alt text and fixed width/height.

Property	Type	Set from	Default
src	string	static, expression, binding
alt	string	static, expression
width	string	static
height	string	static
shape	string	static	none
tooltip	string	static
transform	string	static
filter	string	static	none

{
  "instanceId": "img-logo",
  "blockType": "core.image",
  "blockVersion": "1.0.0",
  "properties": {
    "src": { "source": "static", "value": "https://cdn.example.com/tenant/logo.png" },
    "alt": { "source": "static", "value": "Company logo" },
    "width": { "source": "static", "value": "160px" },
    "height": { "source": "static", "value": "48px" }
  }
}

• Always author alt (even an empty string for purely decorative images) — it is the widget's sole accessible-name source.
• Prefer binding src to a stable, tenant-hosted URL (e.g. a File Management attachment) rather than an external third-party host.
• Set both width and height when the layout needs a stable image footprint to avoid content reflow while the image loads.

core.image-gallery

Displays a browsable set of images with optional captions — a single carousel-style widget for product photos, employee ID cards, document attachments, or any bound array of images, instead of authoring N separate core.image blocks.

Property	Type	Set from	Default
images	json	static, expression, binding	[{"src":"data:image/svg+xml,%3Csvg xmlns='http:...

Events: changed

{
  "instanceId": "gallery-product-photos",
  "blockType": "core.image-gallery",
  "blockVersion": "1.0.0",
  "contractVersion": 1,
  "properties": {
    "images": {
      "source": "static",
      "value": [
        { "src": "https://cdn.example.com/products/sku-1001-front.jpg", "alt": "Front view", "caption": "Front" },
        { "src": "https://cdn.example.com/products/sku-1001-side.jpg", "alt": "Side view", "caption": "Side" }
      ]
    }
  }
}

• Always supply alt text per image — the widget carries no fallback alt-text generation.
• Bind images to a real Data Source query result rather than authoring large static arrays inline.
• Use caption for short, human-readable context (e.g. "Front", "Damage close-up") — it is rendered as-is, not sanitized as markup (it flows through as plain data, same as any other JSON property value).

core.json-viewer

Displays a formatted, read-only dump of a JSON value — useful for debugging screens, "raw data" inspector panels, webhook payload previews, or any place an author wants to show structured data verbatim rather than through custom formatted fields.

Property	Type	Set from	Default
value	json	static, expression, binding

{
  "instanceId": "json-viewer-webhook-payload",
  "blockType": "core.json-viewer",
  "blockVersion": "1.0.0",
  "contractVersion": 1,
  "properties": {
    "value": { "source": "binding", "value": { "scope": "page", "key": "lastWebhookPayload" } }
  }
}

• Use for developer/admin-facing debug and inspector screens, not as an end-user data display — it shows raw keys, not translated/business-friendly labels.
• Prefer purpose-built display blocks (grid, cards, labels) for anything an end user is meant to read routinely; reserve core.json-viewer for "show me the raw thing" contexts.
• Bind to a scoped/filtered slice of data rather than an entire record tree when only part of it is relevant.

core.kpi-card

Shows a single headline metric with an optional label and a trend indicator against a previous value — the standard "big number" dashboard tile.

Property	Type	Set from	Default
value	number	static, expression, binding	128400
previousValue	number	static, expression, binding
label	string	static, expression, binding	Monthly Revenue
labelKey	string	static
format	string	static	number
currencyCode	string	static	USD
icon	string	static, expression, binding
colorToken	string	static
trendFormat	string	static	percent
trendLabel	string	static, expression, binding

{
  "contractVersion": 1,
  "instanceId": "headcount-kpi",
  "blockType": "core.kpi-card",
  "blockVersion": "1.0.0",
  "properties": {
    "value": { "source": "binding", "binding": { "scope": "page", "key": "currentHeadcount" } },
    "previousValue": { "source": "binding", "binding": { "scope": "page", "key": "previousMonthHeadcount" } },
    "labelKey": { "source": "static", "value": "hcm.headcount.kpi.total" },
    "format": { "source": "static", "value": "number" },
    "icon": { "source": "static", "value": "users" },
    "colorToken": { "source": "static", "value": "info" }
  }
}

• Set format/currencyCode to match the metric's real domain (e.g.
• Supply previousValue whenever a trend is meaningful — omitting it
• Pair with a core.sparkline in the same card/container for a headline

core.kpi-comparison

Property	Type	Set from	Default
items	json	static, expression, binding	[{"label":"This Quarter","value":482000,"format...
label	string	static, expression, binding

core.label

Render a single line (or short run) of static, expression-derived, or bound text — the simplest text-display primitive in the widget catalog.

Property	Type	Set from	Default
text	string	static, expression, binding
textKey	string	static
format	string	static	none
currencyCode	string	static	USD
hidden	boolean	static, expression, binding	false

{
  "instanceId": "lbl-welcome",
  "blockType": "core.label",
  "blockVersion": "1.0.0",
  "properties": {
    "text": { "source": "static", "value": "Welcome back!" }
  }
}

• Prefer textKey over text for any label that needs translation; author text as a static fallback for untranslated tenants.
• Use binding/expression sources for record-derived text rather than composing strings in a parent container's own static text.
• For headings, prefer core.heading (which carries a semantic level and role: heading) rather than styling a core.label to look like one.

core.link

Render a hyperlink with configurable target text, destination, and open-target behavior, and emit a click event.

Property	Type	Set from	Default
text	string	static, expression, binding
textKey	string	static
href	string	static, expression, binding
target	string	static	_self

Events: clicked

{
  "instanceId": "lnk-view-profile",
  "blockType": "core.link",
  "blockVersion": "1.0.0",
  "properties": {
    "text": { "source": "static", "value": "View full profile" },
    "href": { "source": "expression", "expression": "'/hcm/employees/' + employee.id" },
    "target": { "source": "static", "value": "_self" }
  }
}

• Use _blank only for links leaving the current tenant application (external docs, third-party portals); keep in-app navigation on _self.
• Build href from an expression/binding for record-scoped deep links rather than hardcoding a static path with a placeholder id.
• Wire clicked to an action chain only when there is real side-effecting behavior to run (analytics, audit log) beyond native browser navigation — the navigation itself does not require an action chain.

core.location-picker

Property	Type	Set from	Default
latitude	number	static, binding	37.7749
longitude	number	static, binding	-122.4194
zoom	number	static, binding	13
markers	json	static, expression, binding	[{"lat":37.7749,"lng":-122.4194,"label":"HQ"}]
height	number	static	220
clusterMarkers	boolean	static	false
clusterGridFactor	number	static	1
pickMode	boolean	static	true
polygons	json	static, expression, binding	[]
drawPolygon	boolean	static	false

Events: mapClicked, polygonDrawn

core.map

An interactive map with markers.

Property	Type	Set from	Default
latitude	number	static, binding	37.7749
longitude	number	static, binding	-122.4194
zoom	number	static, binding	13
markers	json	static, expression, binding	[{"lat":37.7749,"lng":-122.4194,"label":"HQ"}]
height	number	static	300
clusterMarkers	boolean	static	false
clusterGridFactor	number	static	1
pickMode	boolean	static	false
polygons	json	static, expression, binding	[]
drawPolygon	boolean	static	false

Events: mapClicked, polygonDrawn

{ "blockType": "core.map", "instanceId": "map-1", "blockVersion": "1.0.0", "contractVersion": 1,
  "properties": { "latitude": {"source":"static","value":40.7128}, "longitude": {"source":"static","value":-74.0060}, "zoom": {"source":"static","value":11}, "markers": {"source":"static","value":[{"lat":40.7128,"lng":-74.0060,"label":"NYC Office"}]} } }

• Bind markers to real location data rather than hardcoding.

core.markdown-viewer

Displays read-only, formatted markdown content — release notes, help text, policy documents authored in markdown — as rendered rich text, without an edit surface (contrast with core.markdown-editor).

Property	Type	Set from	Default
value	string	static, expression, binding	# Sample Heading This is sample markdown c...

{
  "instanceId": "markdown-viewer-release-notes",
  "blockType": "core.markdown-viewer",
  "blockVersion": "1.0.0",
  "contractVersion": 1,
  "properties": {
    "value": { "source": "binding", "value": { "scope": "page", "key": "releaseNotesMarkdown" } }
  }
}

• Prefer core.markdown-viewer over core.html-viewer for author-hand-edited content — markdown source is easier for a non-technical author to write/review than raw HTML.
• Don't rely on advanced markdown features (tables, footnotes, nested blockquotes) — the in-house converter only supports the subset listed in Description.
• Pair with core.markdown-editor for the editable counterpart in an authoring screen; use core.markdown-viewer for the read-only display context (e.g. a detail page).

core.notifications

A notification list with read/unread state.

Property	Type	Set from	Default
items	json	static, expression, binding	[{"id":"1","title":"New comment on your report"...

Events: select

{ "blockType": "core.notifications", "instanceId": "notif-bell", "blockVersion": "1.0.0", "contractVersion": 1,
  "properties": { "items": {"source":"binding","binding":{"scope":"session","key":"notifications"}} } }

• Wire select to also call a mark-as-read API for durable persistence — the local readIds state doesn't survive a full page reload without one.

core.org-chart

Renders a company/team hierarchy from a flat manager-reference list.

Property	Type	Set from	Default
people	json	static, expression, binding	[{"id":"ceo","label":"Alex Morgan","title":"CEO...

Events: select

{ "blockType": "core.org-chart", "instanceId": "company-org-chart", "blockVersion": "1.0.0", "contractVersion": 1,
  "properties": { "people": {"source":"binding","binding":{"scope":"page","key":"employees"}} } }

• Bind people to a real employee query mapped to {id, label, title, managerId}.

core.paragraph

Render a block of body text with paragraph semantics.

Property	Type	Set from	Default
text	string	static, expression, binding

{
  "instanceId": "para-intro",
  "blockType": "core.paragraph",
  "blockVersion": "1.0.0",
  "properties": {
    "text": { "source": "static", "value": "This page summarizes your team's onboarding progress for the current quarter." }
  }
}

• Use for plain-text body copy only; reach for the rich-text widget when authors need bold/lists/links inline.
• Keep bound/expression text values reasonably sized — this widget renders the whole string as one block, with no truncation/clamping property of its own.
• Pair with a preceding core.heading for scannable page structure rather than relying on visual size alone.

core.pareto-chart

Property	Type	Set from	Default
items	json	static, expression, binding	[{"label":"Shipping Delay","value":42},{"label"...
label	string	static, expression, binding

core.pdf-viewer

Embeds a PDF document inline on a Page/Form/Container/Dashboard — e.g. a payslip, an invoice, a signed contract — using the browser's own native PDF rendering, with no PDF-parsing dependency of this platform's own.

Property	Type	Set from	Default
url	string	static, expression, binding
height	string	static	600px

{
  "instanceId": "pdf-payslip-viewer",
  "blockType": "core.pdf-viewer",
  "blockVersion": "1.0.0",
  "contractVersion": 1,
  "properties": {
    "url": { "source": "binding", "value": { "scope": "page", "key": "selectedPayslipUrl" } },
    "height": { "source": "static", "value": "700px" }
  }
}

• Bind url to tenant-controlled document storage (e.g. the DMS module's file URLs), never to arbitrary user-supplied links.
• Set an explicit height sized to the expected document — the widget does not auto-fit content height.
• Pair with a "no document selected" empty state upstream (the widget already shows one when url is blank, but a surrounding page can also gate visibility).

core.pending-approval

Property	Type	Set from	Default
content	string	static, expression, binding	Pending Approval
icon	string	static	pending-actions
color	string	static	warning

core.pie-chart

Shows parts-of-a-whole as a full pie, with each slice sized by its share of the total.

Property	Type	Set from	Default
series	json	static, expression, binding	[{"label":"Direct","value":40},{"label":"Referr...
label	string	static, expression, binding

{
  "contractVersion": 1,
  "instanceId": "recruitment-source-pie",
  "blockType": "core.pie-chart",
  "blockVersion": "1.0.0",
  "properties": {
    "series": {
      "source": "binding",
      "binding": "page.candidateSourceBreakdown"
    },
    "label": { "source": "static", "value": "Candidates by Source" }
  }
}

• Keep the slice count small (roughly 3–8) — a pie is for comparing a few
• Only set explicit color per slice when a specific palette (e.g. brand
• Always set label when the chart appears without surrounding context

core.progress-bar

Render a horizontal (linear) progress indicator for a 0–100 value, with an optional caption — the linear counterpart to core.progress-ring.

Property	Type	Set from	Default
value	number	static, expression, binding
label	string	static, expression, binding
color	string	static, expression, binding

{
  "instanceId": "bar-upload-progress",
  "blockType": "core.progress-bar",
  "blockVersion": "1.0.0",
  "properties": {
    "value": { "source": "binding", "binding": { "scope": "block", "key": "upload.percentComplete" } },
    "label": { "source": "static", "value": "Uploading..." }
  }
}

• Always author label — as a progressbar-role element it needs a real accessible name, not just visual context.
• Bind value to an already-computed 0–100 percentage; the widget does not itself normalize a raw fraction/ratio.
• Prefer core.progress-bar over core.progress-ring inside narrow horizontal spaces (table rows, list items, form footers).

core.progress-ring

Render a circular ("donut") progress indicator for a 0–100 value, with an optional caption.

Property	Type	Set from	Default
value	number	static, expression, binding
label	string	static, expression, binding

{
  "instanceId": "ring-onboarding-progress",
  "blockType": "core.progress-ring",
  "blockVersion": "1.0.0",
  "properties": {
    "value": { "source": "static", "value": 65 },
    "label": { "source": "static", "value": "Onboarding" }
  }
}

• Always author label for dashboard tiles — it is both the visible caption and the accessible name source.
• Bind value to an already-computed 0–100 percentage; the widget does not itself normalize a raw ratio or fraction.
• Use core.progress-bar instead when horizontal space is more available than vertical (e.g. inside a table row or narrow card).

core.qr-code

Renders a scannable QR code encoding a bound string value — e.g. an employee badge ID, an asset tag, or a URL.

Property	Type	Set from	Default
value	string	static, expression, binding
size	number	static	200
ecLevel	string	static	M
moduleColor	string	static	#000000
backgroundColor	string	static	#ffffff

{
  "instanceId": "qr-employee-badge",
  "blockType": "core.qr-code",
  "blockVersion": "1.0.0",
  "contractVersion": 1,
  "properties": {
    "value": { "source": "binding", "value": { "scope": "record", "key": "employeeId" } },
    "size": { "source": "static", "value": 120 },
    "ecLevel": { "source": "static", "value": "Q" }
  }
}

• Use a higher ecLevel ("Q" or "H") for badges/labels that may get scratched, printed small, or partially obscured.
• Keep encoded value short (IDs, short URLs) — QR codes for very long text become dense and harder to scan reliably.
• Bind value to a stable identifier (not a mutable display name) when the QR code is meant for long-term physical use (e.g. printed badges).

core.radar-chart

Compares one or more series across several shared axes (dimensions) on a polar grid — useful for multi-factor comparisons like skill assessments or vendor scorecards.

Property	Type	Set from	Default
axes	json	static, expression, binding	["Speed","Quality","Cost","Support","Scale"]
series	json	static, expression, binding	[{"name":"Product","values":[80,60,70,90,50]}]
maxValue	number	static

{
  "contractVersion": 1,
  "instanceId": "competency-radar",
  "blockType": "core.radar-chart",
  "blockVersion": "1.0.0",
  "properties": {
    "axes": {
      "source": "static",
      "value": ["Communication", "Technical Skill", "Leadership", "Reliability", "Collaboration"]
    },
    "series": {
      "source": "binding",
      "binding": "form.employeeCompetencyScores"
    },
    "maxValue": { "source": "static", "value": 100 }
  }
}

• Keep every series' values array the same length as axes, in the same
• Set an explicit maxValue (e.g. 100 for percentage-scored data) rather
• Give each series a distinct color when comparing more than one, so

core.ranking-list

Property	Type	Set from	Default
items	json	static, expression, binding	[{"label":"Priya Sharma","value":128400},{"labe...
variant	string	static	ranking
limit	number	static
format	string	static	number
currencyCode	string	static	USD

core.receipt-preview

Property	Type	Set from	Default
storeName	string	static, binding	Store
saleNumber	string	static, binding
lines	json	static, binding	[]
subtotal	number	static, binding	0
discountTotal	number	static, binding	0
taxTotal	number	static, binding	0
grandTotal	number	static, binding	0
footerMessage	string	static, binding	Thank you!

core.sales-funnel

Property	Type	Set from	Default
stages	json	static, expression, binding	[{"label":"Leads","value":850},{"label":"Qualif...
height	number	static

core.sales-territory-map

Property	Type	Set from	Default
latitude	number	static, binding	37.7749
longitude	number	static, binding	-122.4194
zoom	number	static, binding	13
markers	json	static, expression, binding	[{"lat":37.7749,"lng":-122.4194,"label":"Territ...
height	number	static	300
clusterMarkers	boolean	static	false
clusterGridFactor	number	static	1
pickMode	boolean	static	false
polygons	json	static, expression, binding	[{"points":[{"lat":37.85,"lng":-122.55},{"lat":...
drawPolygon	boolean	static	false

Events: mapClicked, polygonDrawn

core.sankey-chart

Property	Type	Set from	Default
nodes	json	static, expression, binding	[{"name":"Visitors"},{"name":"Signups"},{"name"...
links	json	static, expression, binding	[{"source":"Visitors","target":"Signups","value...
label	string	static, expression, binding

core.shopping-cart

Property	Type	Set from	Default
previewItems	json	static, binding	[{"name":"Sample product","price":19.99,"quanti...
checkoutRoute	string	static	/checkout

Events: checkoutClicked

core.sla-indicator

Property	Type	Set from	Default
dueAt	string	static, expression, binding
escalated	boolean	static, expression, binding	false
warningThresholdMinutes	number	static	60

core.sparkline

Shows a compact, axis-free line trend from a series of numbers — a small inline visual, typically paired with a KPI value in a dashboard card.

Property	Type	Set from	Default
points	json	static, expression, binding	[5,9,4,12,8,15,10]
color	string	static	#3b82f6

{
  "contractVersion": 1,
  "instanceId": "attrition-trend-sparkline",
  "blockType": "core.sparkline",
  "blockVersion": "1.0.0",
  "properties": {
    "points": {
      "source": "binding",
      "binding": "page.monthlyAttritionRateSeries"
    },
    "color": { "source": "static", "value": "#c62828" }
  }
}

• Pair a sparkline next to a core.kpi-card to show recent trend alongside
• Use a semantic color (e.g. red for a rising cost/attrition metric,
• Keep points reasonably short (weeks, not years, of daily data) since the

core.stat

Property	Type	Set from	Default
value	number	static, expression, binding	42
label	string	static, expression, binding	Active Users
labelKey	string	static
variant	string	static	metric
format	string	static	number
currencyCode	string	static	USD
animationDurationMs	number	static	800

core.status-display

Property	Type	Set from	Default
text	string	static, expression, binding	Active
textKey	string	static
status	string	static, expression, binding	neutral
variant	string	static	filled

core.target-vs-actual

Property	Type	Set from	Default
target	number	static, expression, binding	100000
actual	number	static, expression, binding	82000
label	string	static, expression, binding
format	string	static	number
currencyCode	string	static	USD

core.territory-map

Property	Type	Set from	Default
latitude	number	static, binding	37.7749
longitude	number	static, binding	-122.4194
zoom	number	static, binding	13
markers	json	static, expression, binding	[{"lat":37.7749,"lng":-122.4194,"label":"Territ...
height	number	static	300
clusterMarkers	boolean	static	false
clusterGridFactor	number	static	1
pickMode	boolean	static	false
polygons	json	static, expression, binding	[{"points":[{"lat":37.85,"lng":-122.55},{"lat":...
drawPolygon	boolean	static	false

Events: mapClicked, polygonDrawn

core.timeline

Shows a chronological sequence of events.

Property	Type	Set from	Default
items	json	static, expression, binding	[{"id":"1","label":"Order placed","timestamp":"...

Events: select

{ "blockType": "core.timeline", "instanceId": "onboarding-timeline", "blockVersion": "1.0.0", "contractVersion": 1,
  "properties": { "items": {"source":"binding","binding":{"scope":"page","key":"onboardingSteps"}} } }

• Use status to communicate progress visually (done/active/pending/error).

core.tooltip

Render an inline help-icon trigger that shows a hint/explanation text — a leaf hint affordance, not a children-wrapping overlay around other content.

Property	Type	Set from	Default
text	string	static, expression, binding
icon	string	static	info

{
  "instanceId": "tip-field-help",
  "blockType": "core.tooltip",
  "blockVersion": "1.0.0",
  "properties": {
    "text": { "source": "static", "value": "Your Employee ID is assigned automatically and cannot be changed." },
    "icon": { "source": "static", "value": "info" }
  }
}

• Place adjacent to (not nested around) the control it explains — core.tooltip has no children slot.
• Keep text concise; it is a hover/focus hint, not a substitute for core.paragraph body copy.
• Choose icon to match severity/intent (info for neutral help, warning for cautionary hints).

core.tree-view

A generic expandable/selectable tree — for core.org-chart's people-hierarchy card visualization, this widget is the generic-node-tree alternative.

Property	Type	Set from	Default
nodes	json	static, expression, binding	[{"id":"root","label":"Documents","children":[{...

Events: select

{ "blockType": "core.tree-view", "instanceId": "org-structure-tree", "blockVersion": "1.0.0", "contractVersion": 1,
  "properties": { "nodes": {"source":"binding","binding":{"scope":"page","key":"orgUnitTree"}} } }

• Use for Org Structure Manager-style hierarchies (a real, shipped HCM screen uses this pattern).

core.treemap-chart

Property	Type	Set from	Default
nodes	json	static, expression, binding	[{"name":"Engineering","value":42},{"name":"Sal...
label	string	static, expression, binding

core.video-player

Plays a video inline — training clips, product demos, recorded meetings — using the browser's native HTML5 <video> element, with no third-party player dependency.

Property	Type	Set from	Default
url	string	static, expression, binding
fileId	string	static, expression, binding
allowDownload	boolean	static	true
adaptive	boolean	static	true
poster	string	static, expression, binding
autoplay	boolean	static	false
loop	boolean	static	false

Events: played, paused, ended

{
  "instanceId": "video-onboarding-welcome",
  "blockType": "core.video-player",
  "blockVersion": "1.0.0",
  "contractVersion": 1,
  "properties": {
    "url": { "source": "static", "value": "https://cdn.example.com/onboarding/welcome.mp4" },
    "poster": { "source": "static", "value": "https://cdn.example.com/onboarding/welcome-poster.jpg" },
    "autoplay": { "source": "static", "value": false }
  }
}

• Always set poster for above-the-fold videos so the layout doesn't jump once metadata loads.
• Wire ended (not paused) when you need a "the user actually finished this" signal, since paused also fires on manual pause partway through.
• Avoid loop: true combined with autoplay: true for long-form content — reserve looping for short ambient/background clips.

core.warehouse-map

Property	Type	Set from	Default
latitude	number	static, binding	37.7749
longitude	number	static, binding	-122.4194
zoom	number	static, binding	13
markers	json	static, expression, binding	[{"lat":37.78,"lng":-122.42,"label":"Warehouse ...
height	number	static	300
clusterMarkers	boolean	static	false
clusterGridFactor	number	static	1
pickMode	boolean	static	false
polygons	json	static, expression, binding	[{"points":[{"lat":37.79,"lng":-122.43},{"lat":...
drawPolygon	boolean	static	false

Events: mapClicked, polygonDrawn

core.waterfall-chart

Property	Type	Set from	Default
steps	json	static, expression, binding	[{"label":"Starting Revenue","value":100,"isTot...
label	string	static, expression, binding

core.workflow-history

Property	Type	Set from	Default
items	json	static, expression, binding	[{"id":"1","actor":"Sam Patel","action":"submit...

core.workflow-status

A read-only visual indicator of a workflow instance's current step.

Property	Type	Set from	Default
steps	json	static, expression, binding	[{"id":"1","label":"Submitted","status":"done"}...

{ "blockType": "core.workflow-status", "instanceId": "leave-request-status", "blockVersion": "1.0.0", "contractVersion": 1,
  "properties": { "steps": {"source":"binding","binding":{"scope":"page","key":"workflowSteps"}} } }

• Read-only status display; use core.approval-panel if the user needs to act on the workflow.

core.workflow-timeline

Property	Type	Set from	Default
items	json	static, expression, binding	[{"id":"1","label":"Submitted","timestamp":"202...

Events: select