Architecture

Dharmalib is a Svelte 5 and SvelteKit 2 site for exploring parsed Sanskrit texts. It is a static-data application with server-rendered routes and client-side interactions.

Runtime stack

svelte.config.js forces runes for application Svelte files. Use $props, $state, $derived, and $effect; do not introduce legacy export let, $: reactivity, or $app/stores.

Rendering model

Routes use SvelteKit’s normal SSR and CSR behavior. A page loader fetches only the generated JSON required for that route, then hands a small projection to a component. The browser may continue navigation and interaction client-side, but a route must not depend on a private filesystem or an eager whole-corpus download.

Shared navigation state

src/lib/stores/navigation.svelte.ts owns cross-pane state: open panes, selected text classes, and the active word. Reader tokens set the active word; context-lens.svelte reacts to it and loads the corresponding lemma bucket on demand.

Keep page-local state local. Use the navigation store only for information that genuinely coordinates multiple visible regions.

Styling model

Shared SASS is under src/lib/styles. Start with _tokens.sass, _primitives.sass, _spacing.sass, and _typography.sass. The interface relies on composition classes such as .box, .row, .grid, .gap16, .text-sm, .col2, and .w500.

Use single-tab indented SASS only. Avoid creating a private component style system when shared primitives already express the layout, spacing, and typography. Components should have a scoped style block only for a genuinely component-specific visual behavior.

Deployment boundary

kit.files.assets points to static-runtime, not static. This prevents canonical build inputs from being deployed. The app publishes generated runtime artifacts, fonts, and images from static-runtime; static/data remains a build-time source tree.