Plugin

Flutter Monaco

Name: Flutter Monaco
Author: omar-hanafy

Configure, troubleshoot, and maintain flutter_monaco, a Monaco Editor integration for Flutter apps, including LSP, migration tracking, and bridge contract verification.

What's Inside

Agents1

bridge-contract-reviewer

/bridge-contract-reviewer

Read-only reviewer for Dart-to-JavaScript contract drift in the flutter_monaco package itself. Delegate when a change touches MonacoProtocol, bridge assets, controller commands, events, errors, platform hosting, or bundled Monaco assets. Not for consumer app integration, general Flutter review, or making fixes.

Skills6

configure-flutter-monaco-lsp

/configure-flutter-monaco-lsp

Configure or troubleshoot Language Server Protocol support in a flutter_monaco 3.x application using WebSocket, desktop stdio bridge, or custom transport. Use for connectLanguageServer, transport selection, CSP, stable document URIs, reconnect policy, and LSP lifecycle. Do not use for general editor integration or unrelated completion providers.

diagnose-flutter-monaco

/diagnose-flutter-monaco

Diagnose unknown or cross-layer failures where flutter_monaco is on the failing path, including boot, assets, Web mounting, protocol, Monaco focus, overlays, page reload, LSP, or scroll handoff. Use when the package's failing layer is not yet established or a MonacoException crosses boundaries. Route an already-localized LSP transport, CSP, URI, or lifecycle problem to configure-flutter-monaco-lsp. Do not use for routine integration or a standard Flutter TextField or form issue that does not render or import flutter_monaco.

integrate-flutter-monaco

/integrate-flutter-monaco

Integrate flutter_monaco 3.x into a Flutter application, including editor lifecycle, documents, platform setup, focus, overlays, and disposal. Use when adding MonacoEditor or MonacoController, designing an editor screen, or reviewing a new flutter_monaco integration. Do not use for a 2.x migration, LSP-only work, package bridge maintenance, or a bundled Monaco engine upgrade.

maintain-flutter-monaco-bridge

/maintain-flutter-monaco-bridge

Change or review flutter_monaco's internal Dart-to-JavaScript bridge, command/event envelopes, generated page, platform WebView adapters, or typed public wrappers. Use inside the flutter_monaco package when adding a command, event, capability, bridge module, or protocol behavior. Do not use for ordinary consuming-app integration or arbitrary JavaScript escape-hatch code.

migrate-flutter-monaco-v2-to-v3

/migrate-flutter-monaco-v2-to-v3

Migrate an application from flutter_monaco 2.x to 3.x using the complete API and lifecycle map, or migrate 1.7.1 after its toolchain and Windows prerequisites are verified. Use when pubspec or source still uses legacy content methods, model APIs, full-state options, old focus/events, old readiness, or page configuration. Do not use when the app is already fully on 3.x or when upgrading the bundled Monaco engine inside this package.

Stats

Version3.4.2

ReleasedJul 19, 2026

LanguageDart

Stars34

Forks14

MaintenanceGood

LicenseMIT

Last CommitJul 19, 2026

AddedJul 21, 2026

Actions

View on GitHub View README Plugin Marketplace JSON Homepage

Available In

flutter-monaco-plugins34

Flutter Monaco

A Flutter plugin for integrating the Monaco Editor (VS Code's editor) into Flutter applications via WebView.

Check the live demo here to try Flutter Monaco in your browser.

AI coding-assistant support

This repository ships an optional, package-specific plugin for Claude Code and OpenAI Codex. It contains six skills for integrating, migrating, diagnosing, configuring LSP, maintaining the bridge, and upgrading the bundled Monaco engine. The plugin runs no background service, hook, executable, or MCP server, and it does not require credentials. dart pub add flutter_monaco installs only the runtime Flutter package, not this repository-hosted assistant plugin.

Claude Code

claude plugin marketplace add omar-hanafy/flutter_monaco --sparse .claude-plugin plugins
claude plugin install flutter-monaco@flutter-monaco-plugins --scope user

Run /reload-plugins in an active Claude Code session or start a new session, then invoke a skill explicitly when useful:

/flutter-monaco:integrate-flutter-monaco
/flutter-monaco:diagnose-flutter-monaco

The commands above were validated with Claude Code CLI 2.1.215. Claude Code's VS Code extension and Desktop Code local or SSH sessions are documented plugin surfaces, but were not smoke-tested for this release. Local user plugins do not transfer automatically to Claude Code on the web.

OpenAI Codex

codex plugin marketplace add omar-hanafy/flutter_monaco --sparse .agents --sparse plugins
codex plugin add flutter-monaco@flutter-monaco

Start a new Codex session, then invoke a skill explicitly when useful. In Codex CLI, you can also enter /plugins to browse the configured marketplace and manage the plugin interactively:

$integrate-flutter-monaco
$diagnose-flutter-monaco

These repository commands configure Claude Code and Codex CLI. A clone opened in the ChatGPT desktop app can expose its repo marketplace in Work mode or Codex after an app restart. ChatGPT web can install only plugins available through its curated or workspace-shared catalog; this repository release is not a public-directory submission. Plugins are not available in Chat mode, Codex IDE integrations, or mobile. Codex project agents require a checkout of this repository. See AI assistant support for the full inventory, compatibility, updates, removal, security model, validation, and example prompts.

The consumer skills target flutter_monaco 3.x after inspecting the resolved dependency; the dedicated migration skill covers released 2.x applications and 1.7.1 applications after a toolchain/platform prerequisite audit. Useful natural-language requests include "Integrate flutter_monaco with three tabs and stable file URIs" and "Diagnose why this Web editor never becomes ready."

Update or remove the Claude Code installation:

claude plugin marketplace update flutter-monaco-plugins
claude plugin update flutter-monaco@flutter-monaco-plugins
claude plugin uninstall flutter-monaco@flutter-monaco-plugins --scope user
claude plugin marketplace remove flutter-monaco-plugins

After an update, run /reload-plugins or start a new Claude Code session.

Update or remove the Codex installation:

codex plugin marketplace upgrade flutter-monaco
codex plugin add flutter-monaco@flutter-monaco
codex plugin remove flutter-monaco@flutter-monaco
codex plugin marketplace remove flutter-monaco

Start a new Codex session after updating or reinstalling the plugin.

Flutter Monaco

What's Inside

Flutter Monaco

Popularity

What's Inside

Confidence

README

Flutter Monaco

AI coding-assistant support

Claude Code

OpenAI Codex

Features

Similar Plugins

flutter-mobile-app-dev

Dart and Flutter

framework-mobile-dev

flutter-mcp-toolkit

flutter-mobile

context7

More by omar-hanafy

Flutter Helper Utils

Dart Helper Utils

ScrollSpy Assistant

GlyphPact

Cached Video Thumbnail

Flutter Monaco

AI coding-assistant support

Claude Code

OpenAI Codex

Features

Popularity

Health & Quality

More by omar-hanafy

Flutter Helper Utils

Dart Helper Utils

ScrollSpy Assistant

GlyphPact

Cached Video Thumbnail

Similar Plugins

flutter-mobile-app-dev

Dart and Flutter

framework-mobile-dev

flutter-mcp-toolkit

flutter-mobile

context7