Skip to content

feat: added React Native Renderer#42

Merged
gitsad merged 1 commit into
mainfrom
feat/react-native-renderer
Jul 7, 2026
Merged

feat: added React Native Renderer#42
gitsad merged 1 commit into
mainfrom
feat/react-native-renderer

Conversation

@gitsad

@gitsad gitsad commented Jul 7, 2026

Copy link
Copy Markdown
Member

What does this PR do?

Adds @mobile-reality/mdma-renderer-react-native — a React Native rendering layer for MDMA, a sibling to @mobile-reality/mdma-renderer-react. It renders all 9 MDMA component types plus inline Markdown as native iOS/Android UI, reusing the existing headless stack (spec + runtime) unchanged and reimplementing only the view layer with RN primitives (dispatch, bindings, component state, policy, audit, and PII redaction all come from runtime).

Also adds demo-native/ — an Expo (SDK 54) example app: a provider-agnostic MDMA agent built on the Vercel AI SDK (OpenRouter / Anthropic / OpenAI, keys via .env). It mirrors the web Agent Chat's sub-agent/brief flow — the conversation model calls a generate_mdma tool with a brief, a separate author call produces the document, and it's rendered with renderer-react-native. Runs in Expo Go (core RN components only, no custom native modules).

Closes #

Type of Change

  • Bug fix (non-breaking change that fixes an issue)
  • New feature (non-breaking change that adds functionality)
  • Breaking change (fix or feature that would cause existing behavior to change)
  • Refactor (no functional change)
  • Documentation
  • CI / tooling

Packages Affected

  • @mobile-reality/mdma-spec
  • @mobile-reality/mdma-parser
  • @mobile-reality/mdma-runtime
  • @mobile-reality/mdma-attachables-core
  • @mobile-reality/mdma-renderer-react
  • @mobile-reality/mdma-prompt-pack
  • New package: @mobile-reality/mdma-renderer-react-native (depends on spec + runtime only; no changes to existing packages)
  • New example (private, unpublished): @mobile-reality/mdma-demo-native

Checklist

  • I have read the CONTRIBUTING guide.
  • My code follows the existing code style (pnpm lint passes for the new package).
  • I have added or updated tests that cover my changes.
  • All tests pass (pnpm test).
  • Type-checking passes (pnpm typecheck).
  • I have added a changeset (pnpm changeset) if this change affects published packages.
  • New or changed MDMA schemas are backwards-compatible (or marked as breaking). (No schema changes — renderer only.)
  • Sensitive fields are marked with sensitive: true where appropriate. (Renderer honors sensitive from the spec — form inputs use secureTextEntry, table cells mask.)

How to Test

Renderer package

  1. pnpm --filter @mobile-reality/mdma-renderer-react-native build
  2. pnpm --filter @mobile-reality/mdma-renderer-react-native typecheck
  3. pnpm --filter @mobile-reality/mdma-renderer-react-native test

Expo demo app (real agent, needs an API key)

  1. cp demo-native/.env.example demo-native/.env and set one key (e.g. EXPO_PUBLIC_OPENROUTER_API_KEY=…).
  2. pnpm --filter @mobile-reality/mdma-demo-native start --clear
  3. Scan the QR with Expo Go (or press i / a for a simulator).
  4. Ask "make me a contact form" — the agent replies conversationally and renders the form inline as native UI. Fill fields, toggle tasks, approve a gate to see store state update. Switch provider/model in ⚙️.

TODO

Add wider test coverage

@gitsad gitsad merged commit 0d2cefe into main Jul 7, 2026
1 check passed
@gitsad gitsad deleted the feat/react-native-renderer branch July 7, 2026 09:39
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants