Trino Monaco SQL Editor
A Monaco-based React SQL editor component for Trino, delivering an IDE-grade editing experience with ANTLR grammar analysis and live cluster metadata.
Key Strengths
Trino language support
Registers the trino language with a Monarch tokenizer and ships keywords, functions, and types derived from the Trino documentation.
ANTLR-powered SQL intelligence
Flags syntax errors in real time with the TrinoSql grammar and suggests cursor-aware completions via antlr4-c3.
Live cluster integration
Autocompletes catalogs, schemas, tables, and columns via SHOW queries, with TTL caching, deduplication, and request cancellation.
Smooth editing experience
Heavy parsing runs off the main thread in a Web Worker (Comlink) so typing stays fluid, with light and dark themes included.
Core Features
Everything needed for IDE-grade SQL editing, packaged as a single React component.
Autocompletion
Built-in keywords, functions, and types, plus optional asynchronous metadata providers.
Context-aware completion
The contextAware mode analyzes the cursor position with antlr4-c3 to offer precise suggestions.
Real-time syntax validation
The ANTLR parser surfaces grammar errors as editor markers as you type.
Editor actions
Run queries with Ctrl/Cmd+Enter, explain from the context menu, and format with Shift+Alt+F.
Metadata providers
Plug in a custom async provider, or use createTrinoMetadataProvider to connect directly to a Trino cluster.
Themes & layout
Light/dark Trino themes with SQL-friendly defaults such as a disabled minimap.
Architecture
The Monaco editing layer, ANTLR language intelligence, worker layer, and cluster integration are cleanly separated.
Get started on GitHub
An MIT-licensed React component — the demo and usage guide live in the repository.