How utubmir/flint works
Flint combines a browser game editor, a TypeScript game runtime, and a project CLI. The main workflow is to open and edit a project, build or bundle it, load its scene and assets into the runtime, then run and render the game. Separate branches cover asset/file management, physics and render components, and live preview with hot reload. Several editor and runtime relationships are supported by the source index or README rather than sampled implementation; uncertain links are omitted.
Main entry points: project.ts Project manager · project-loader.ts Scene loader · editor.ts Editor shell · live-preview-bridge.ts Runtime preview bridge
Components 22
Browser editor
- Editor shell
src/flint/editor/editor.ts - Editor layout
src/flint/editor/layout.ts - Code editor
src/flint/editor/ui/code-editor.ts - Window services
src/flint/editor/ui/window-services.ts
Project workflow
- Project manager
src/flint/editor/project/project.ts - Project config
src/flint/editor/project/project-config.ts - Project builder
src/flint/editor/project/builder.ts - Project bundler
src/flint/editor/project/bundler.ts
Game runtime
- Asset registry
packages/engine/src/runtime/assets.ts - Scene loader
packages/engine/src/runtime/project-loader.ts - Runtime system
packages/engine/src/runtime/system.ts - World
packages/engine/src/runtime/world.ts - Game objects
packages/engine/src/runtime/game-object.ts
Game components
- Component lifecycle
packages/engine/src/runtime/component.ts - Transforms
packages/engine/src/runtime/transform.ts - Camera rendering
packages/engine/src/runtime/components/camera.ts - Physics world
packages/engine/src/runtime/physics-world.ts
Live preview and CLI
- Preview server
src/flint/editor/live-preview/preview-server.ts - Preview client
src/flint/editor/live-preview/preview-client.ts - Runtime preview bridge
packages/engine/src/runtime/live-preview-bridge.ts - Project CLI
packages/cli/src/main.ts
Other components
- Developer
Connections 25
- Developer → Editor shell: edits projects
- Editor shell → Project manager: manages projects
src/flint/editor/project/project.ts - Project manager → Project config: uses config
src/flint/editor/project/project.ts - Project manager → Project builder: builds project
src/flint/editor/project/project.ts - Project manager → Project bundler: bundles code
src/flint/editor/project/project.ts - Project manager → Scene loader: loads scenes
src/flint/editor/project/project.ts - Editor shell → Editor layout: coordinates UI
- Editor shell → Code editor: edits code
- Window services → Editor layout: shares window state
- Scene loader → Asset registry: requests assets
packages/engine/src/runtime/project-loader.ts - Scene loader → Game objects: creates objects
packages/engine/src/runtime/project-loader.ts - Scene loader → Component lifecycle: restores components
packages/engine/src/runtime/project-loader.ts - Runtime system → World: starts world
packages/engine/src/runtime/system.ts - Runtime system → Camera rendering: uses cameras
packages/engine/src/runtime/system.ts - Game objects → Component lifecycle: attaches components
packages/engine/src/runtime/game-object.ts - Game objects → Transforms: owns transform
packages/engine/src/runtime/game-object.ts - Camera rendering → World: queries layers
packages/engine/src/runtime/components/camera.ts - Camera rendering → Physics world: uses physics
packages/engine/src/runtime/components/camera.ts - Preview server → Project builder: builds preview
src/flint/editor/live-preview/preview-server.ts - Preview server → Project config: reads settings
src/flint/editor/live-preview/preview-server.ts - Preview client → Runtime preview bridge: sends preview data
- Runtime preview bridge → Scene loader: uses project data
packages/engine/src/runtime/live-preview-bridge.ts - Runtime preview bridge → Asset registry: updates asset URLs
packages/engine/src/runtime/live-preview-bridge.ts - Runtime preview bridge → Component lifecycle: applies hot reload
- Developer → Project CLI: runs commands
packages/cli/src/main.ts