Client setup

Point the @kolektiv npm scope at Nexus releases and install the router plus a framework adapter.

Keel ships a framework-neutral router (@kolektiv/keel) and seven pack adapters: Svelte 5, React 18/19, Vue 3, Solid 1.9, Preact 10, Lit 3, and Angular 19. Svelte is the default in the examples, not the only option, see Framework adapters.

Client packages live in the hosted keel-npm repository on Nexus at repo.yuri.capital. Put this in .npmrc at the pack root (or your user ~/.npmrc):

# .npmrc
@kolektiv:registry=https://repo.yuri.capital/repository/keel-npm/

Resolving does not require Nexus credentials; publishing does.

Releases (recommended)

Current release: 0.1.0. Every adapter is versioned in lockstep with @kolektiv/keel, so pin the same version everywhere. Pick your framework:

package.json, by framework

{
"dependencies": {
  "@kolektiv/keel": "0.1.0",
  "@kolektiv/keel-svelte": "0.1.0",
  "svelte": "^5.16.0"
},
"devDependencies": {
  "@kolektiv/keel-pack": "0.1.0",
  "@sveltejs/vite-plugin-svelte": "^5.0.3",
  "vite": "^6.2.0"
}
}

{
"dependencies": {
  "@kolektiv/keel": "0.1.0",
  "@kolektiv/keel-react": "0.1.0",
  "@tanstack/react-query": "^5.66.0",
  "react": "^19.0.0",
  "react-dom": "^19.0.0"
},
"devDependencies": {
  "@kolektiv/keel-pack": "0.1.0",
  "@types/react": "^19.0.0",
  "@types/react-dom": "^19.0.0",
  "@vitejs/plugin-react": "^4.3.4",
  "vite": "^6.2.0"
}
}

{
"dependencies": {
  "@kolektiv/keel": "0.1.0",
  "@kolektiv/keel-vue": "0.1.0",
  "@tanstack/vue-query": "^5.66.0",
  "vue": "^3.5.13"
},
"devDependencies": {
  "@kolektiv/keel-pack": "0.1.0",
  "@vitejs/plugin-vue": "^5.2.1",
  "vite": "^6.2.0",
  "vue-tsc": "^2.2.0"
}
}

{
"dependencies": {
  "@kolektiv/keel": "0.1.0",
  "@kolektiv/keel-solid": "0.1.0",
  "@tanstack/solid-query": "^5.66.0",
  "solid-js": "^1.9.4"
},
"devDependencies": {
  "@kolektiv/keel-pack": "0.1.0",
  "vite": "^6.2.0",
  "vite-plugin-solid": "^2.11.1"
}
}

{
"dependencies": {
  "@kolektiv/keel": "0.1.0",
  "@kolektiv/keel-preact": "0.1.0",
  "@tanstack/preact-query": "^5.66.0",
  "preact": "^10.25.4"
},
"devDependencies": {
  "@kolektiv/keel-pack": "0.1.0",
  "@preact/preset-vite": "^2.10.1",
  "vite": "^6.2.0"
}
}

{
"dependencies": {
  "@kolektiv/keel": "0.1.0",
  "@kolektiv/keel-lit": "0.1.0",
  "@tanstack/query-core": "^5.66.0",
  "lit": "^3.2.1"
},
"devDependencies": {
  "@kolektiv/keel-pack": "0.1.0",
  "vite": "^6.2.0"
}
}

{
"dependencies": {
  "@angular/common": "^19.0.0",
  "@angular/core": "^19.0.0",
  "@angular/platform-browser": "^19.0.0",
  "@kolektiv/keel": "0.1.0",
  "@kolektiv/keel-angular": "0.1.0",
  "@tanstack/angular-query-experimental": "^5.66.0",
  "@tanstack/query-core": "^5.66.0",
  "rxjs": "^7.8.0"
},
"devDependencies": {
  "@analogjs/vite-plugin-angular": "^1.10.0",
  "@angular/build": "^19.0.0",
  "@angular/compiler-cli": "^19.0.0",
  "@kolektiv/keel-pack": "0.1.0",
  "typescript": "~5.8.3",
  "vite": "^6.2.0"
}
}

TanStack Query ships as the framework-specific package (@tanstack/react-query, @tanstack/vue-query, and so on). Pin it with the adapter above.

Lit and Angular take @tanstack/query-core directly because those adapters build their own controllers/injectables over it.

@kolektiv/keel is the host router (visits, history, prefetch, action()). The adapter package is the framework binding. @kolektiv/keel-pack is the toolchain: keel-scaffold from a live host schema, a Vite plugin (keelPack) that discovers pages and writes a .feb, and keel-pack to zip a dist by hand.

Bootstrap

Scaffold writes src/bootstrap.ts. It reads #__keel_seed, hydrates the TanStack query cache, and mounts the pack entry. The import is the only difference between frameworks:

src/bootstrap.ts

import { bootstrap } from "@kolektiv/keel-svelte"

void bootstrap()

import { bootstrap } from "@kolektiv/keel-react"

void bootstrap()

import { bootstrap } from "@kolektiv/keel-vue"

void bootstrap()

import { bootstrap } from "@kolektiv/keel-solid"

void bootstrap()

import { bootstrap } from "@kolektiv/keel-preact"

void bootstrap()

import { bootstrap } from "@kolektiv/keel-lit"

void bootstrap()

import { bootstrap } from "@kolektiv/keel-angular"

void bootstrap()

bootstrap(options?) accepts the core RouterConfig (onSeed, onError, and the visit defaults). Each adapter’s onSeed hydrates the query cache under ["keel", "page"] first, then calls your onSeed for the initial seed and every applied visit. Angular’s bootstrap also creates the pack-wide zoneless application before core applies the seed.

Pre-releases

Current pre-release: 0.0.2-SNAPSHOT.4. The -SNAPSHOT.4 suffix is part of a literal, unique version, and the same keel-npm registry serves it. Swap the 0.1.0 pins above for 0.0.2-SNAPSHOT.4 to track the pre-release line. all seven adapter packages share the version.

Next: scaffold a pack. The host half is Host (Ktor).