docs: fix ComponentProps info (#13827)

dummdidumm · web-flow · commit c603553e89a3 · 2024-10-23T18:00:54.000+01:00
* docs: fix ComponentProps info closes #13770 * fix
diff --git a/packages/svelte/src/index.d.ts b/packages/svelte/src/index.d.ts
@@ -210,9 +210,11 @@ export type ComponentEvents<Comp extends SvelteComponent> =
  * import MyComponent from './MyComponent.svelte';
  *
  * // Errors if these aren't the correct props expected by MyComponent.
- * const props: ComponentProps<MyComponent> = { foo: 'bar' };
+ * const props: ComponentProps<typeof MyComponent> = { foo: 'bar' };
  * ```
  *
+ * > [!NOTE] In Svelte 4, you would do `ComponentProps<MyComponent>` because `MyComponent` was a class.
+ *
  * Example: A generic function that accepts some component and infers the type of its props:
  *
  * ```ts
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
@@ -207,9 +207,11 @@ declare module 'svelte' {
 	 * import MyComponent from './MyComponent.svelte';
 	 *
 	 * // Errors if these aren't the correct props expected by MyComponent.
-	 * const props: ComponentProps<MyComponent> = { foo: 'bar' };
+	 * const props: ComponentProps<typeof MyComponent> = { foo: 'bar' };
 	 * ```
 	 *
+	 * > [!NOTE] In Svelte 4, you would do `ComponentProps<MyComponent>` because `MyComponent` was a class.
+	 *
 	 * Example: A generic function that accepts some component and infers the type of its props:
 	 *
 	 * ```ts

Original file line number	Diff line number	Diff line change
`@@ -210,9 +210,11 @@ export type ComponentEvents<Comp extends SvelteComponent> =`
`210`	`210`	`* import MyComponent from './MyComponent.svelte';`
`211`	`211`	`*`
`212`	`212`	`* // Errors if these aren't the correct props expected by MyComponent.`
`213`		`- * const props: ComponentProps<MyComponent> = { foo: 'bar' };`
	`213`	`+ * const props: ComponentProps<typeof MyComponent> = { foo: 'bar' };`
`214`	`214`	* ```
`215`	`215`	`*`
	`216`	+ * > [!NOTE] In Svelte 4, you would do `ComponentProps<MyComponent>` because `MyComponent` was a class.
	`217`	`+ *`
`216`	`218`	`* Example: A generic function that accepts some component and infers the type of its props:`
`217`	`219`	`*`
`218`	`220`	* ```ts
Original file line number	Diff line number	Diff line change
`@@ -207,9 +207,11 @@ declare module 'svelte' {`
`207`	`207`	`* import MyComponent from './MyComponent.svelte';`
`208`	`208`	`*`
`209`	`209`	`* // Errors if these aren't the correct props expected by MyComponent.`
`210`		`- * const props: ComponentProps<MyComponent> = { foo: 'bar' };`
	`210`	`+ * const props: ComponentProps<typeof MyComponent> = { foo: 'bar' };`
`211`	`211`	* ```
`212`	`212`	`*`
	`213`	+ * > [!NOTE] In Svelte 4, you would do `ComponentProps<MyComponent>` because `MyComponent` was a class.
	`214`	`+ *`
`213`	`215`	`* Example: A generic function that accepts some component and infers the type of its props:`
`214`	`216`	`*`
`215`	`217`	* ```ts