more accurate types

Author: dummdidumm

packages/svelte/scripts/generate-types.js

@@ -30,7 +30,7 @@ await createBundle({
 		[`${pkg.name}/legacy`]: `${dir}/src/legacy/legacy-client.js`,
 		[`${pkg.name}/motion`]: `${dir}/src/motion/public.d.ts`,
 		[`${pkg.name}/reactivity`]: `${dir}/src/reactivity/index-client.js`,
-		[`${pkg.name}/server`]: `${dir}/src/server/index.js`,
+		[`${pkg.name}/server`]: `${dir}/src/server/index.d.ts`,
 		[`${pkg.name}/store`]: `${dir}/src/store/public.d.ts`,
 		[`${pkg.name}/transition`]: `${dir}/src/transition/public.d.ts`,
 		[`${pkg.name}/events`]: `${dir}/src/events/index.js`,

packages/svelte/src/server/index.d.ts

@@ -0,0 +1,21 @@
+import type { RenderOutput } from '#server';
+import type { ComponentProps, Component, SvelteComponent, ComponentType } from 'svelte';
+
+/**
+ * Only available on the server and when compiling with the `server` option.
+ * Takes a component and returns an object with `body` and `head` properties on it, which you can use to populate the HTML when server-rendering your app.
+ */
+export function render<
+	Comp extends SvelteComponent<any> | Component<any>,
+	Props extends ComponentProps<Comp> = ComponentProps<Comp>
+>(
+	...args: {} extends Props
+		? [
+				component: Comp extends SvelteComponent<any> ? ComponentType<Comp> : Comp,
+				options?: { props?: Omit<Props, '$$slots' | '$$events'>; context?: Map<any, any> }
+			]
+		: [
+				component: Comp extends SvelteComponent<any> ? ComponentType<Comp> : Comp,
+				options: { props: Omit<Props, '$$slots' | '$$events'>; context?: Map<any, any> }
+			]
+): RenderOutput;

packages/svelte/tests/types/component.ts

@@ -156,6 +156,14 @@ render(NewComponent, {
 		x: ''
 	}
 });
+// @ts-expect-error
+render(NewComponent);
+render(NewComponent, {
+	props: {
+		// @ts-expect-error
+		prop: 1
+	}
+});
 
 // --------------------------------------------------------------------------- interop
 
@@ -276,9 +284,22 @@ hydrate(functionComponent, {
 render(functionComponent, {
 	props: {
 		binding: true,
-		readonly: 'foo',
+		readonly: 'foo'
+	}
+});
+// @ts-expect-error
+render(functionComponent);
+render(functionComponent, {
+	// @ts-expect-error
+	props: {
+		binding: true
+	}
+});
+render(functionComponent, {
+	props: {
+		binding: true,
 		// @ts-expect-error
-		x: ''
+		readonly: 1
 	}
 });
 

packages/svelte/tsconfig.json

@@ -23,7 +23,7 @@
 			"svelte/internal/client": ["./src/internal/client/index.js"],
 			"svelte/legacy": ["./src/legacy/legacy-client.js"],
 			"svelte/motion": ["./src/motion/public.d.ts"],
-			"svelte/server": ["./src/server/index.js"],
+			"svelte/server": ["./src/server/index.d.ts"],
 			"svelte/store": ["./src/store/public.d.ts"],
 			"#compiler": ["./src/compiler/types/index.d.ts"],
 			"#client": ["./src/internal/client/types.d.ts"],

packages/svelte/types/index.d.ts

@@ -2110,14 +2110,25 @@ declare module 'svelte/reactivity' {
 }
 
 declare module 'svelte/server' {
+	import type { ComponentProps, Component, SvelteComponent, ComponentType } from 'svelte';
 	/**
 	 * Only available on the server and when compiling with the `server` option.
 	 * Takes a component and returns an object with `body` and `head` properties on it, which you can use to populate the HTML when server-rendering your app.
-	 * */
-	export function render<Props extends Record<string, any>>(component: import("svelte").Component<Props, any, string> | import("svelte").ComponentType<import("svelte").SvelteComponent<Props, any, any>>, options?: {
-		props?: Omit<Props, "$$slots" | "$$events"> | undefined;
-		context?: Map<any, any> | undefined;
-	} | undefined): RenderOutput;
+	 */
+	export function render<
+		Comp extends SvelteComponent<any> | Component<any>,
+		Props extends ComponentProps<Comp> = ComponentProps<Comp>
+	>(
+		...args: {} extends Props
+			? [
+					component: Comp extends SvelteComponent<any> ? ComponentType<Comp> : Comp,
+					options?: { props?: Omit<Props, '$$slots' | '$$events'>; context?: Map<any, any> }
+				]
+			: [
+					component: Comp extends SvelteComponent<any> ? ComponentType<Comp> : Comp,
+					options: { props: Omit<Props, '$$slots' | '$$events'>; context?: Map<any, any> }
+				]
+	): RenderOutput;
 	interface RenderOutput {
 		/** HTML that goes into the `<head>` */
 		head: string;