@absolutejs/absolute 0.20.0-beta.167 → 0.20.0-beta.168

package/CHANGELOG.md

@@ -6,6 +6,17 @@ This file is generated by `absolute-changelog` from the entries in
 `changelog/`. Edit an entry, not this file — and add new ones under
 `changelog/unreleased/`.
 
+## 0.20.0-beta.168 — 2026-11-12
+
+### Fixed
+
+- **Pages build without the frameworks they don't use installed**
+  A project with Svelte pages but no Vue or Angular installed couldn't build any Svelte page, in dev or with `absolute build`: the non-React client pass failed with `Could not resolve: "vue"`, then `@angular/core`, `@angular/platform-browser` and `@angular/compiler`. The Svelte hydration index imports `@absolutejs/absolute/client`, whose island runtime lazily imports a hydrator per framework, and only the React client pass left frameworks the project doesn't have unresolved. The non-React, island and worker client passes, and the dev rebuilds of Svelte and Vue pages, now resolve a framework the project neither configures nor installs to a stub that throws only if that framework's hydrator runs. A bare external wouldn't do: dev island bundles aren't code-split, so Bun hoists the import and the browser can't load the bundle. An installed framework is bundled as before. Verified with a Svelte-only, a Vue-only, and an HTML project with a React island, each in `absolute dev`, `absolute start` and `absolute compile`.
+- **Static-page islands hydrate with only `islands.registry`, or a bootstrap file of any name** (`createIslandManifestResolver`)
+  Islands on HTML and HTMX pages server-rendered but never hydrated unless the islands bootstrap file happened to compile to the manifest key `BootstrapClient`, the only key the server looked for. A configured `islands.bootstrap` is now recorded under a reserved manifest key whatever its file name. With only `islands: { registry }` set, the build generates a default bootstrap that loads each island's chunk from the manifest, so no bootstrap file is needed. `createIslandManifestResolver()` defaults to the manifest the server injects. React islands now share one React vendor with the bootstrap even without a `reactDirectory`; before, a separately bundled bootstrap brought a second React and hydration failed on `useState`. A page with islands but no bootstrap now logs a warning outside production. Verified in Chromium: `load`, `idle` and `visible` hydrate, `none` doesn't, and React, Svelte and Vue islands hydrate on HTML and HTMX pages.
+- **Svelte page props are type-checked in server files**
+  `handleSveltePageRequest<typeof Page>({ props })` accepted any props in a server file. Svelte's ambient `*.svelte` module types every import as `LegacyComponentType`, whose props are `Record<string, any>`, and svelte-check only covers the Svelte directory. `absolute typecheck` now generates a declaration per component with svelte2tsx, the engine svelte-check uses, under `.absolutejs/types/svelte/`, and resolves server imports to them through `rootDirs`. A missing prop now fails with TS2741, a wrong type with TS2322 and an unknown prop with TS2353, as for React. `absolute dev` keeps the declarations current as components change. For editor squiggles, add `"rootDirs": [".", ".absolutejs/types/svelte"]` to tsconfig.json (typecheck prints this hint when it's missing). The check needs `svelte2tsx` installed (`bun add -d svelte2tsx`), and typecheck says so when it isn't. Unchanged projects reuse the last declarations. Vue pages were already checked by vue-tsc, and Angular's `requestContext` by its `Ctx` generic.
+
 ## 0.20.0-beta.167 — 2026-11-09
 
 ### Fixed

package/README.md

@@ -105,6 +105,87 @@ export const server = new Elysia()
 2. Route handlers (`handleReactPageRequest`, `handleSveltePageRequest`, …) stream HTML and inject scripts/assets based on that manifest.
 3. The static plugin serves all compiled files from `/build`.
 
+### Type-checked Svelte page props
+
+`handleSveltePageRequest<typeof Page>({ props })` checks `props` against the
+component's `$props()` type, like `handleReactPageRequest`. `absolute typecheck`
+generates a declaration per Svelte component with svelte2tsx
+(`bun add -d svelte2tsx`), and `absolute dev` keeps them current. To see the
+same errors in your editor, add the declarations to `rootDirs`:
+
+```jsonc
+// tsconfig.json
+{
+	"compilerOptions": {
+		"rootDirs": [".", ".absolutejs/types/svelte"]
+	}
+}
+```
+
+### Islands on HTML and HTMX pages
+
+Static HTML and HTMX pages can embed components of any framework as islands.
+Register the components once:
+
+```ts
+// src/islands/registry.ts
+import { defineIslandRegistry } from '@absolutejs/absolute/islands';
+import { PriceChart } from './PriceChart'; // React
+import Ticker from './Ticker.svelte';
+
+export const islandRegistry = defineIslandRegistry({
+	react: { PriceChart },
+	svelte: { Ticker }
+});
+```
+
+```ts
+// absolute.config.ts
+export default defineConfig({
+	htmlDirectory: 'src/html',
+	islands: { registry: 'src/islands/registry.ts' },
+	svelteDirectory: 'src/svelte' // needed to compile Svelte islands; same for Vue
+});
+```
+
+Then place islands in a page with `<absolute-island>` (or the `<island>` alias):
+
+```html
+<absolute-island
+	framework="react"
+	component="PriceChart"
+	hydrate="idle"
+	props='{"symbol":"BTC"}'
+></absolute-island>
+```
+
+Islands are server-rendered at build time. With `islands.registry` set, the
+build also generates an islands bootstrap, and `handleHTMLPageRequest` /
+`handleHTMXPageRequest` inject it into any page that contains islands. Each
+island's code loads only when that island hydrates. `hydrate` is `load` (the
+default), `idle`, `visible` (when scrolled into view) or `none` (server HTML
+only, never hydrated).
+
+To run your own client code, point `islands.bootstrap` at a file that calls
+`startIslands`. The file can have any name, and it replaces the generated one:
+
+```ts
+// src/islands/main.ts  →  islands: { registry: '…', bootstrap: 'src/islands/main.ts' }
+import {
+	createIslandManifestResolver,
+	startIslands
+} from '@absolutejs/absolute/client';
+
+startIslands({
+	registry: {},
+	// Loads each island's chunk from the manifest the server injects.
+	resolveComponent: createIslandManifestResolver()
+});
+```
+
+If a page has islands but the build produced no bootstrap, the dev server logs
+a warning instead of serving islands that never hydrate.
+
 ### Installable PWA and offline Sync
 
 Enable the web-app shell once in `absolutejs.config.ts`. AbsoluteJS generates a

package/changelog.json

@@ -2,6 +2,30 @@
 	"contract": 1,
 	"name": "@absolutejs/absolute",
 	"releases": [
+		{
+			"changes": [
+				{
+					"detail": "A project with Svelte pages but no Vue or Angular installed couldn't build any Svelte page, in dev or with `absolute build`: the non-React client pass failed with `Could not resolve: \"vue\"`, then `@angular/core`, `@angular/platform-browser` and `@angular/compiler`. The Svelte hydration index imports `@absolutejs/absolute/client`, whose island runtime lazily imports a hydrator per framework, and only the React client pass left frameworks the project doesn't have unresolved. The non-React, island and worker client passes, and the dev rebuilds of Svelte and Vue pages, now resolve a framework the project neither configures nor installs to a stub that throws only if that framework's hydrator runs. A bare external wouldn't do: dev island bundles aren't code-split, so Bun hoists the import and the browser can't load the bundle. An installed framework is bundled as before. Verified with a Svelte-only, a Vue-only, and an HTML project with a React island, each in `absolute dev`, `absolute start` and `absolute compile`.",
+					"kind": "fixed",
+					"summary": "Pages build without the frameworks they don't use installed"
+				},
+				{
+					"detail": "Islands on HTML and HTMX pages server-rendered but never hydrated unless the islands bootstrap file happened to compile to the manifest key `BootstrapClient`, the only key the server looked for. A configured `islands.bootstrap` is now recorded under a reserved manifest key whatever its file name. With only `islands: { registry }` set, the build generates a default bootstrap that loads each island's chunk from the manifest, so no bootstrap file is needed. `createIslandManifestResolver()` defaults to the manifest the server injects. React islands now share one React vendor with the bootstrap even without a `reactDirectory`; before, a separately bundled bootstrap brought a second React and hydration failed on `useState`. A page with islands but no bootstrap now logs a warning outside production. Verified in Chromium: `load`, `idle` and `visible` hydrate, `none` doesn't, and React, Svelte and Vue islands hydrate on HTML and HTMX pages.",
+					"kind": "fixed",
+					"summary": "Static-page islands hydrate with only `islands.registry`, or a bootstrap file of any name",
+					"symbols": [
+						"createIslandManifestResolver"
+					]
+				},
+				{
+					"detail": "`handleSveltePageRequest<typeof Page>({ props })` accepted any props in a server file. Svelte's ambient `*.svelte` module types every import as `LegacyComponentType`, whose props are `Record<string, any>`, and svelte-check only covers the Svelte directory. `absolute typecheck` now generates a declaration per component with svelte2tsx, the engine svelte-check uses, under `.absolutejs/types/svelte/`, and resolves server imports to them through `rootDirs`. A missing prop now fails with TS2741, a wrong type with TS2322 and an unknown prop with TS2353, as for React. `absolute dev` keeps the declarations current as components change. For editor squiggles, add `\"rootDirs\": [\".\", \".absolutejs/types/svelte\"]` to tsconfig.json (typecheck prints this hint when it's missing). The check needs `svelte2tsx` installed (`bun add -d svelte2tsx`), and typecheck says so when it isn't. Unchanged projects reuse the last declarations. Vue pages were already checked by vue-tsc, and Angular's `requestContext` by its `Ctx` generic.",
+					"kind": "fixed",
+					"summary": "Svelte page props are type-checked in server files"
+				}
+			],
+			"date": "2026-11-12",
+			"version": "0.20.0-beta.168"
+		},
 		{
 			"changes": [
 				{

package/dist/angular/browser.js

@@ -88,7 +88,7 @@ var ABSOLUTE_HTTP_TRANSFER_CACHE_SKIP_HEADER = "x-skip-transfer-cache", buildAbs
 };
 
 // src/core/islandManifest.ts
-var toIslandFrameworkSegment = (framework) => framework[0]?.toUpperCase() + framework.slice(1), collectFrameworkIslands = (manifest, prefix) => {
+var ISLAND_BOOTSTRAP_MANIFEST_KEY = "AbsoluteIslandBootstrap", LEGACY_ISLAND_BOOTSTRAP_MANIFEST_KEY = "BootstrapClient", toIslandFrameworkSegment = (framework) => framework[0]?.toUpperCase() + framework.slice(1), collectFrameworkIslands = (manifest, prefix) => {
   const entries = {};
   let found = false;
   for (const [key, value] of Object.entries(manifest)) {
@@ -101,7 +101,7 @@ var toIslandFrameworkSegment = (framework) => framework[0]?.toUpperCase() + fram
     found = true;
   }
   return found ? entries : undefined;
-}, getIslandManifestEntries = (manifest) => {
+}, getIslandBootstrapPath = (manifest) => manifest[ISLAND_BOOTSTRAP_MANIFEST_KEY] ?? manifest[LEGACY_ISLAND_BOOTSTRAP_MANIFEST_KEY], getIslandManifestEntries = (manifest) => {
   const islands = {};
   const frameworks = ["react", "svelte", "vue", "angular"];
   for (const framework of frameworks) {
@@ -10358,5 +10358,5 @@ export {
   withPendingTask
 };
 
-//# debugId=BEDC2BC3159D507E64756E2164756E21
+//# debugId=43DEF2DFD2D62F7064756E2164756E21
 //# sourceMappingURL=browser.js.map