Building Your Own Extensions
Build your own Nimbalyst extension with custom editors, AI tools, panels, and themes, packaged with a manifest that declares what it adds.
Last updated
Build your own Nimbalyst extension with custom editors, AI tools, panels, and themes, packaged with a manifest that declares what it adds.
Build extensions that add new capabilities to Nimbalyst -- custom editors, AI tools, panels, themes, and more. Extensions are self-contained packages with a manifest that declares their contributions.
Nimbalyst is open source, and the built-in extensions live alongside the app source in github.com/nimbalyst. The fastest way to learn the extension API is to read those built-in extensions.
The extensions feature page covers what extensions can contribute to the app.
Custom Editors -- New ways to view and edit file types (spreadsheets, diagrams, 3D models)
AI Tools -- Tools that Claude can use to interact with your extension
AI Completions -- Call chat models (Claude, OpenAI, LM Studio) directly from your extension
Panels -- Sidebar panels, fullscreen views, or floating windows
Settings Pages -- Application- or Project-scoped settings with repository context
Project Filesystem Access -- Read and update related project files from a custom editor
Tracker References -- Add typed item pickers and live tracker reference chips
Themes -- Custom color themes
Slash Commands -- Commands users can invoke from the chat
File Icons -- Custom icons for file types in the sidebar
New File Types -- Add entries to the "New File" menu
The recommended workflow is to create and iterate on extensions from inside Nimbalyst:
Enable Extension Dev Tools in Settings > Application > Advanced
Use File > New Extension Project or ask Claude to run /new-extension
Describe the extension you want Claude to build from the starter scaffold
Ask Claude to build and install the extension with extension_build and extension_install
Use extension_reload for rebuild + reinstall during iteration
See Getting Started for a step-by-step walkthrough.
A typical extension project:
Create -- Use /new-extension inside Nimbalyst or copy a starter project
Develop -- Edit files in your extension project
Build -- Claude uses extension_build to compile
Install -- Claude uses extension_install to load it
Test -- Open a file with your extension's file type
Iterate -- Claude uses extension_reload for hot updates
Every extension needs a manifest.json that describes what it provides. At minimum:
See Manifest Reference for the complete schema.
Custom editors receive a host prop that handles all communication with Nimbalyst -- loading and saving files, tracking dirty state, theme changes, and AI diff mode. The useEditorLifecycle hook wraps the host into a single, clean API.
See Custom Editors for the full guide.
AI tools let Claude interact with your editor programmatically. Define tools with a name, description, input schema, and handler function. Claude reads the description to decide when to call your tool.
See AI Tools for examples and best practices.
Extensions declare the capabilities they need:
filesystem
Read and write files in the workspace
ai
Register AI tools and call chat/completion models directly
network
Make HTTP requests to external services
Create your first extension in 10 minutes
Build editors for new file types
Add tools that Claude can use
Complete manifest.json schema
TypeScript types and interfaces
Nimbalyst with Extension Dev Tools enabled (Settings > Application > Advanced)
Node.js 18+
Basic knowledge of React and TypeScript
Study the built-in extensions for patterns and best practices:
Excalidraw
.excalidraw
Imperative API via refs, 19 AI tools
CSV Spreadsheet
.csv, .tsv
RevoGrid with custom save, formula support
DataModelLM
.datamodel
Zustand store, screenshot export
MockupLM
.mockup.html
iframe preview, AI generation
SQLite Browser
.db, .sqlite
Panel-based with Jotai, 9 AI tools
These are all in packages/extensions/ in the Nimbalyst repository on GitHub.
Last updated
my-extension/
manifest.json # Extension metadata and contributions
package.json # npm dependencies
tsconfig.json # TypeScript configuration
vite.config.ts # Build configuration
src/
index.ts # Extension entry point (activate/deactivate)
components/ # React components
styles.css # Scoped styles{
"id": "com.example.my-editor",
"name": "My Editor",
"version": "1.0.0",
"main": "dist/index.js"
}