adapter types (#5386)

* adapter types

* rename ambient.d.ts -> placeholders.d.ts

* add ambient types to adapter-cloudflare-workers

* update README

* import ambient types

* changeset

.changeset/rude-grapes-perform.md

@@ -0,0 +1,6 @@
+---
+'@sveltejs/adapter-cloudflare': patch
+'@sveltejs/adapter-cloudflare-workers': patch
+---
+
+Expose App interfaces

packages/adapter-cloudflare-workers/README.md

@@ -69,6 +69,34 @@ Then, you can build your app and deploy it:
 wrangler publish
 ```
 
+## Environment variables
+
+The [`env`](https://developers.cloudflare.com/workers/runtime-apis/fetch-event#parameters) object, containing KV/DO namespaces etc, is passed to SvelteKit via the `platform` property along with `context` and `caches`, meaning you can access it in hooks and endpoints:
+
+```js
+export async function post({ request, platform }) {
+  const x = platform.env.YOUR_DURABLE_OBJECT_NAMESPACE.idFromName('x');
+}
+```
+
+To make these types available to your app, reference them in your `src/app.d.ts`:
+
+```diff
+/// <reference types="@sveltejs/kit" />
++/// <reference types="@sveltejs/adapter-cloudflare-workers" />
+
+declare namespace App {
+	interface Platform {
++		env?: {
++			YOUR_KV_NAMESPACE: KVNamespace;
++			YOUR_DURABLE_OBJECT_NAMESPACE: DurableObjectNamespace;
++		};
+	}
+}
+```
+
+> `platform.env` is only available in the production build. Use [wrangler](https://developers.cloudflare.com/workers/cli-wrangler) to test it locally
+
 ## Changelog
 
 [The Changelog for this package is available on GitHub](https://github.com/sveltejs/kit/blob/master/packages/adapter-cloudflare-workers/CHANGELOG.md).

packages/adapter-cloudflare-workers/ambient.d.ts

@@ -1,15 +1,10 @@
-declare module 'SERVER' {
-	export { Server } from '@sveltejs/kit';
-}
-
-declare module 'MANIFEST' {
-	import { SSRManifest } from '@sveltejs/kit';
-
-	export const manifest: SSRManifest;
-	export const prerendered: Map<string, { file: string }>;
-}
+/// <reference types="@cloudflare/workers-types" />
 
-declare module '__STATIC_CONTENT_MANIFEST' {
-	const json: string;
-	export default json;
+declare namespace App {
+	export interface Platform {
+		context?: {
+			waitUntil(promise: Promise<any>): void;
+		};
+		caches?: CacheStorage & { default: Cache };
+	}
 }

packages/adapter-cloudflare-workers/package.json

@@ -29,6 +29,7 @@
 		"check-format": "prettier --check . --config ../../.prettierrc --ignore-path .gitignore"
 	},
 	"dependencies": {
+		"@cloudflare/workers-types": "^3.14.0",
 		"@iarna/toml": "^2.2.5",
 		"esbuild": "^0.14.42"
 	},

packages/adapter-cloudflare-workers/placeholders.d.ts

@@ -0,0 +1,15 @@
+declare module 'SERVER' {
+	export { Server } from '@sveltejs/kit';
+}
+
+declare module 'MANIFEST' {
+	import { SSRManifest } from '@sveltejs/kit';
+
+	export const manifest: SSRManifest;
+	export const prerendered: Map<string, { file: string }>;
+}
+
+declare module '__STATIC_CONTENT_MANIFEST' {
+	const json: string;
+	export default json;
+}

packages/adapter-cloudflare-workers/tsconfig.json

@@ -12,5 +12,5 @@
 			"@sveltejs/kit": ["../kit/types/index"]
 		}
 	},
-	"include": ["**/*.js", "ambient.d.ts"]
+	"include": ["**/*.js", "placeholders.d.ts"]
 }

packages/adapter-cloudflare/README.md

@@ -53,32 +53,27 @@ When configuring your project settings, you must use the following settings:
 
 ## Environment variables
 
-The [`env`](https://developers.cloudflare.com/workers/runtime-apis/fetch-event#parameters) object, containing KV namespaces etc, is passed to SvelteKit via the `platform` property along with `context` and `caches`, meaning you can access it in hooks and endpoints:
+The [`env`](https://developers.cloudflare.com/workers/runtime-apis/fetch-event#parameters) object, containing KV/DO namespaces etc, is passed to SvelteKit via the `platform` property along with `context` and `caches`, meaning you can access it in hooks and endpoints:
 
-```diff
-// src/app.d.ts
-declare namespace App {
-	interface Locals {}
-
-+	interface Platform {
-+		env: {
-+			COUNTER: DurableObjectNamespace;
-+		};
-+		context: {
-+			waitUntil(promise: Promise<any>): void;
-+		};
-+		caches: CacheStorage & { default: Cache }
-+	}
-
-	interface Session {}
-
-	interface Stuff {}
+```js
+export async function post({ request, platform }) {
+  const x = platform.env.YOUR_DURABLE_OBJECT_NAMESPACE.idFromName('x');
 }
 ```
 
-```js
-export async function post({ request, platform }) {
-  const counter = platform.env.COUNTER.idFromName('A');
+To make these types available to your app, reference them in your `src/app.d.ts`:
+
+```diff
+/// <reference types="@sveltejs/kit" />
++/// <reference types="@sveltejs/adapter-cloudflare" />
+
+declare namespace App {
+	interface Platform {
++		env?: {
++			YOUR_KV_NAMESPACE: KVNamespace;
++			YOUR_DURABLE_OBJECT_NAMESPACE: DurableObjectNamespace;
++		};
+	}
 }
 ```
 

packages/adapter-cloudflare/ambient.d.ts

@@ -1,10 +1,10 @@
-declare module 'SERVER' {
-	export { Server } from '@sveltejs/kit';
-}
-
-declare module 'MANIFEST' {
-	import { SSRManifest } from '@sveltejs/kit';
+/// <reference types="@cloudflare/workers-types" />
 
-	export const manifest: SSRManifest;
-	export const prerendered: Set<string>;
+declare namespace App {
+	export interface Platform {
+		context?: {
+			waitUntil(promise: Promise<any>): void;
+		};
+		caches?: CacheStorage & { default: Cache };
+	}
 }

packages/adapter-cloudflare/index.d.ts

@@ -1,3 +1,4 @@
 import { Adapter } from '@sveltejs/kit';
+import './ambient.js';
 
 export default function plugin(): Adapter;

packages/adapter-cloudflare/package.json

@@ -32,6 +32,7 @@
 		"prepublishOnly": "npm run build"
 	},
 	"dependencies": {
+		"@cloudflare/workers-types": "^3.14.0",
 		"esbuild": "^0.14.42",
 		"worktop": "0.8.0-next.14"
 	},

packages/adapter-cloudflare/placeholders.ts

@@ -0,0 +1,10 @@
+declare module 'SERVER' {
+	export { Server } from '@sveltejs/kit';
+}
+
+declare module 'MANIFEST' {
+	import { SSRManifest } from '@sveltejs/kit';
+
+	export const manifest: SSRManifest;
+	export const prerendered: Set<string>;
+}

packages/adapter-cloudflare/tsconfig.json

@@ -11,5 +11,5 @@
 			"@sveltejs/kit": ["../kit/types/index"]
 		}
 	},
-	"include": ["index.js", "ambient.d.ts", "src/worker.ts"]
+	"include": ["index.js", "placeholders.ts", "src/worker.ts"]
 }

packages/adapter-netlify/index.d.ts

@@ -1,3 +1,4 @@
 import { Adapter } from '@sveltejs/kit';
+import './ambient.js';
 
 export default function plugin(opts?: { split?: boolean; edge?: boolean }): Adapter;