Guide for Developers

This guide is for working on modernGraphTool itself. To run a database with it, see the Guide for Operators instead.

Contributions are welcome — CONTRIBUTING.md has the code style and PR guidelines. The rest of this section covers:

Testing — the two Vitest projects, coverage, and the smoke test.
Build & Deployment Internals — the build outputs and how defaults/ reaches them.
Internationalization — UI strings, adding a language, and the translation flow.

Tech Stack

Language: TypeScript (strict)
Framework: SvelteKit 2 + Svelte 5 (Runes)
Styling: Tailwind CSS 4 + bits-ui (headless accessible components)
Graph Rendering: D3.js (SVG-based)
i18n: Paraglide JS (compile-time internationalization)
Testing: Vitest, with Playwright browser mode for component specs
Build Output: Static SPA via adapter-static → dist/

Project Structure

src/
├── routes/              # SvelteKit routes (single-page SPA) + layout.css (Tailwind entry)
├── lib/
│   ├── components/      # UI: atoms, controls, equalizer, features, graph, layout, panels
│   ├── stores/          # Reactive state as class instances (.svelte.ts)
│   ├── services/        # Data provider, commands, cross-site index, audio, analytics
│   ├── graph/           # D3.js graph engine and overlays
│   ├── device-peq/      # Hardware EQ: connect flow over the eqcaps bridge, push plans
│   ├── workers/         # AutoEQ off the main thread (turboEQ wasm + fallback)
│   ├── utils/           # Parsing, normalization, smoothing, URL encoding, config
│   ├── types/           # TypeScript type definitions
│   └── paraglide/       # Generated i18n functions (do not edit)
└── app.html             # HTML template (loads config.js and theme.css)
defaults/                # Operator-editable config.js, theme.css, sample data
messages/                # Paraglide sources, one JSON file per locale
cdn/                     # CDN deployment templates (thin index.html + loader.js)
scripts/                 # CDN and site-template builds, boot manifest, i18n tooling
site-template/           # Sources for the GitHub Pages template repo
docs/                    # This documentation site (Astro + Starlight)

Most directories under src/lib/ carry their own AGENTS.md with the invariants specific to that area — read it before changing code there.

Build Commands

Command	Description
`npm run dev`	Start development server (http://localhost:5173)
`npm run build`	Production build to `dist/`
`npm run build:cdn`	Build CDN-optimized distribution to `dist-cdn/`
`npm run build:site-template`	Build the GitHub Pages template to `dist-site-template/`
`npm run preview`	Preview the built output
`npm run check`	TypeScript + Svelte type checking
`npm run test`	Run all Vitest tests
`npm run lint`	Prettier + ESLint check
`npm run format`	Auto-format code