Skip to main content

<Miro />

The <Miro /> component renders a Miro board in your documentation.

Each Miro board embedded can also be loaded in a full screen mode, letting your teams edit the board live (view demo).

Support

The <Miro /> component is supported in domains, services, all messages and custom documentation.

Usage

  1. Include the <Miro /> component inside the markdown
    • e.g /events/MyEvent/index.mdx

Basic Example

---
#event frontmatter
---

<Miro boardId="uXjVIHCImos=/" edit={false} />

Example with edit enabled and scroll to default widget in Miro

---
#event frontmatter
---

<Miro boardId="uXjVIHCImos=/" moveToWidget="3074457347671667709" edit={false} />

Output example in EventCatalog

Example output

Props

NameTypeDefaultRequiredDescription
boardIdstringYesThe ID of the Miro board to embed. (miro docs)
editbooleanfalseNoWhether to enable edit mode for the Miro board.
moveToViewportstringNoThe ID of the widget to scroll to. (miro docs)
moveToWidgetstringNoThe ID of the widget to scroll to. (miro docs)
heightstring500NoThe height of the Miro board.
titlestringNoThe title of the Miro board.
autoplaybooleantrueNoWhether to skip the preloader of the miro board. (miro docs)