Tutorials

Tutorials

These step‑by‑step guides focus on practical UI tasks using the default React + MobX implementation. They assume you are a developer comfortable editing TypeScript/React. There is no no‑code flow.

What these tutorials emphasize

• Reading platform/game data via RPGBridge.GetPlatformData()

• Reactively rendering UI with mobx + mobx-react-lite observers

• Keeping engine updates as the source of truth; your components simply observe

Prerequisites

• You’ve built the UI at least once (menus/ → yarn install + yarn build)

• Plugin enabled in your MZ project, React overlay shows on boot

Conventions

• Paths are relative to the project root unless stated otherwise

• UI source lives under menus/src

Available tutorials

• Build a Map HUD — Render player/map stats on the Map screen using platform data

• Using BaseMenuScreen — Create a new screen with shared props and focus handling

• Using Chooser and ActorChooser — Build selectable lists and party pickers

• Using BaseModal — Show modal windows with backdrop and CANCEL key support

• Using Confirm — Global confirm dialogs via ConfirmProvider and useConfirm

• InputContext — Route gamepad/keyboard to your widgets with addEventListener

• PartyMemberFull vs PartyMemberCompact — Render party members in different styles

• Messages, Typewriter, and SpecialCodeRenderer — Rich message text with effects