Project Structure
A guided tour of the OpenGPEX monorepo layout and where key components live.
Monorepo Overview
The project uses a pnpm workspace monorepo with two main packages:
gpex-projects/
├── opengpex/ # The editor application
├── gpex-cloud/ # The cloud service (SaaS backend + marketing site)
├── pnpm-workspace.yaml
└── package.json
Editor Package: opengpex/
opengpex/
├── src/
│ ├── app/ # Next.js app layer (pages, API routes)
│ ├── components/ # Shared React components (theme, etc.)
│ └── lib/
│ └── opengpex/ # ⭐ The editor library (core engine)
│ ├── core/ # Engine internals
│ │ ├── engine/ # Rendering engine (backends, workers, cache)
│ │ ├── state/ # Store, reducer, selectors
│ │ ├── types/ # TypeScript type definitions
│ │ ├── plugin/ # Plugin registry & utilities
│ │ ├── storage/ # Asset & state persistence (IndexedDB, CAS)
│ │ ├── geometry/ # Matrix math, coordinate transforms
│ │ ├── layer/ # LayerFactory, layer utilities
│ │ ├── motion/ # Animation system (tweens)
│ │ ├── cloud/ # Cloud service integration protocol
│ │ ├── clipboard/ # Copy/paste service
│ │ ├── context/ # React context providers
│ │ ├── helpers/ # Utility functions (filters, format, etc.)
│ │ └── advanced/ # Advanced commands facade
│ ├── plugins/ # All editor plugins
│ │ ├── base/ # Official built-in plugins
│ │ │ ├── drawers/ # Sidebar tool panels
│ │ │ ├── options/ # Top option bar plugins
│ │ │ ├── overlays/ # Viewport overlay plugins
│ │ │ ├── panels/ # Info/layer panels
│ │ │ ├── backstage/ # Hidden service plugins
│ │ │ └── xtends/ # Extension plugins
│ │ ├── community/ # Pre-installed community plugins
│ │ └── user/ # User-developed plugins (local dev)
│ ├── stage/ # Viewport & interaction layer
│ │ ├── interaction/ # Gesture dispatcher, transactions
│ │ ├── layers/ # Stage layer rendering
│ │ └── viewport/ # Camera & viewport management
│ ├── widgets/ # Shared UI widget library
│ └── workspace/ # Editor workspace layout shell
├── scripts/ # Build tools
│ ├── sync-plugins.mjs # Generates plugin registry from source
│ ├── scan-plugins.mjs # Scans user plugins for dev mode
│ └── pack-plugin.mjs # Packages plugins for distribution
├── public/ # Static assets
│ ├── wasm/ # WebAssembly binaries (AVIF encoder, etc.)
│ └── plugins/ # Dynamic plugin assets
└── data/ # Runtime data (uploaded plugins, etc.)
Key Entry Points
| Purpose | Path |
|---|---|
| Editor application page | src/app/page.tsx |
| Core editor library | src/lib/opengpex/ |
| Plugin base directory | src/lib/opengpex/plugins/base/ |
| Type definitions | src/lib/opengpex/core/types/ |
| State store | src/lib/opengpex/core/state/useEditorStore.ts |
| Rendering engine | src/lib/opengpex/core/engine/ |
| Plugin registry (generated) | src/lib/opengpex/core/plugin/registry.ts |
Scripts
| Command | Description |
|---|---|
pnpm dev |
Start dev server (auto-runs scan-plugins) |
pnpm build |
Production build |
pnpm sync-plugins |
Regenerate base plugin registry |
pnpm scan-plugins |
Scan & register user plugins |
pnpm pack-plugin <Name> |
Package a plugin for distribution |
Last updated: 2026-06-14