breaking: remove Component type, keep using SvelteComponent instead (#9413)

I came to the conclusion that when we're making up arbitrary types, we might as well keep the old class. That way:
- one less thing to worry about (language tools and other tooling basically can continue to spit out SvelteComponent )
- we can more clearly mark $set , the constructor etc as being deprecated and no longer functioning unless you use that legacy compatibility mode
- much more ergonomic to type for the user:
  - const someInstance: SvelteComponent<..> instead of const someInstance: ReturnType<typeof Component<..>>
  - If you're using generics, you can do export class MyComponent<T> extends SvelteComponent<{ prop: T }> {} instead of having to type out the whole function in a way that I'm not even sure how to do with generics

Author: dummdidumm

.changeset/small-papayas-laugh.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+breaking: remove Component type, keep using SvelteComponent instead

packages/svelte/scripts/build.js

@@ -27,7 +27,7 @@ await createBundle({
 		[`${pkg.name}/animate`]: `${dir}/src/animate/public.d.ts`,
 		[`${pkg.name}/compiler`]: `${dir}/src/compiler/index.js`,
 		[`${pkg.name}/easing`]: `${dir}/src/easing/index.js`,
-		[`${pkg.name}/legacy`]: `${dir}/src/legacy/public.d.ts`,
+		[`${pkg.name}/legacy`]: `${dir}/src/legacy/legacy-client.js`,
 		[`${pkg.name}/motion`]: `${dir}/src/motion/public.d.ts`,
 		[`${pkg.name}/server`]: `${dir}/src/server/index.js`,
 		[`${pkg.name}/store`]: `${dir}/src/store/public.d.ts`,

packages/svelte/src/internal/client/render.js

@@ -3020,7 +3020,7 @@ export function unwrap(value) {
  * @template {Record<string, any>} Props
  * @template {Record<string, any> | undefined} Exports
  * @template {Record<string, any>} Events
- * @param {import('../../main/public.js').Component<Props, Exports, Events>} component
+ * @param {import('../../main/public.js').SvelteComponent<Props, Events>} component
  * @param {{
  * 		target: Node;
  * 		props?: Props;
@@ -3139,7 +3139,7 @@ export function createRoot(component, options) {
  * @template {Record<string, any>} Props
  * @template {Record<string, any> | undefined} Exports
  * @template {Record<string, any>} Events
- * @param {import('../../main/public.js').Component<Props, Exports, Events>} component
+ * @param {import('../../main/public.js').SvelteComponent<Props, Events>} component
  * @param {{
  * 		target: Node;
  * 		props?: Props;

packages/svelte/src/legacy/legacy-client.js

@@ -11,12 +11,12 @@ import * as $ from '../internal/index.js';
  * @template {Record<string, any>} Events
  * @template {Record<string, any>} Slots
  *
- * @param {import('./public.js').ComponentConstructorOptions<Props> & {
- * 	component: import('../main/public.js').Component<Props, Exports, Events, Slots>;
+ * @param {import('../main/public.js').ComponentConstructorOptions<Props> & {
+ * 	component: import('../main/public.js').SvelteComponent<Props, Events, Slots>;
  * 	immutable?: boolean;
  * 	recover?: false;
  * }} options
- * @returns {import('./public.js').SvelteComponent<Props & Exports, Events, Slots>}
+ * @returns {import('../main/public.js').SvelteComponent<Props, Events, Slots> & Exports}
  */
 export function createClassComponent(options) {
 	// @ts-expect-error $$prop_def etc are not actually defined
@@ -33,8 +33,8 @@ export function createClassComponent(options) {
  * @template {Record<string, any>} Events
  * @template {Record<string, any>} Slots
  *
- * @param {import('../main/public.js').Component<Props, Exports, Events, Slots>} component
- * @returns {typeof import('./public.js').SvelteComponent<Props & Exports, Events, Slots>}
+ * @param {import('../main/public.js').SvelteComponent<Props, Events, Slots>} component
+ * @returns {typeof import('../main/public.js').SvelteComponent<Props, Events, Slots> & Exports}
  */
 export function asClassComponent(component) {
 	// @ts-expect-error $$prop_def etc are not actually defined
@@ -57,7 +57,7 @@ class Svelte4Component {
 	#instance;
 
 	/**
-	 * @param {import('./public.js').ComponentConstructorOptions & {
+	 * @param {import('../main/public.js').ComponentConstructorOptions & {
 	 *  component: any;
 	 * 	immutable?: boolean;
 	 * 	recover?: false;

packages/svelte/src/legacy/legacy-server.js

@@ -6,7 +6,7 @@ import { render } from '../internal/server/index.js';
 export { createClassComponent };
 
 /**
- * Takes the component function and returns a Svelte 4 compatible component constructor.
+ * Takes a Svelte 5 component and returns a Svelte 4 compatible component constructor.
  *
  * @deprecated Use this only as a temporary solution to migrate your imperative component code to Svelte 5.
  *
@@ -15,8 +15,8 @@ export { createClassComponent };
  * @template {Record<string, any>} Events
  * @template {Record<string, any>} Slots
  *
- * @param {import('../main/public.js').Component<Props, Exports, Events, Slots>} component
- * @returns {typeof import('./public.js').SvelteComponent<Props & Exports, Events, Slots>}
+ * @param {import('../main/public.js').SvelteComponent<Props, Events, Slots>} component
+ * @returns {typeof import('../main/public.js').SvelteComponent<Props, Events, Slots> & Exports}
  */
 export function asClassComponent(component) {
 	const component_constructor = as_class_component(component);
@@ -30,8 +30,9 @@ export function asClassComponent(component) {
 			html: result.html
 		};
 	};
-	// @ts-expect-error this is present for SSR
+	// this is present for SSR
 	component_constructor.render = _render;
 
+	// @ts-ignore
 	return component_constructor;
 }

packages/svelte/src/legacy/public.d.ts

@@ -1,5 +1,5 @@
 declare module '*.svelte' {
-	export { Component as default } from 'svelte';
+	export { SvelteComponent as default } from 'svelte';
 }
 
 /**