Revert typed SvelteComponent, add SvelteComponentTyped instead

`const a: typeof SvelteComponent = ASubclassOfSvelteComponent` throws errors, which means existing usages are broken. To prevent this, the changes to a typed `SvelteComponent` are reverted. Instead a new `SvelteComponentTyped` class is added, which should be used for typing instead.

site/content/blog/2020-12-01-whats-new-in-svelte-december-2020.md

@@ -11,7 +11,7 @@ It's the last "What's new in Svelte" of the year and there's lots to celebrate!
 
 1. `$$props`, `$$restProps`, and `$$slots` are all now supported in custom web components (**3.29.5**, [Example](https://svelte.dev/repl/ad8e6f39cd20403dacd1be84d71e498d?version=3.29.5)) and  `slot` components now support spread props: `<slot {...foo} />` (**3.30.0**)
 2. A new `hasContext` lifecycle function makes it easy to check whether a `key` has been set in the context of a parent component (**3.30.0** & **3.30.1**, [Docs](https://svelte.dev/docs#hasContext))
-3. `SvelteComponent` is now typed which makes it easier to add typed classes that extend base Svelte Components. Component library and framework authors rejoice! An example: `export class YourComponent extends SvelteComponent<{aProp: boolean}, {click: MouseEvent}, {default: {aSlot: string}}> {}` (**3.30.0**, [RFC](https://github.com/sveltejs/rfcs/pull/37))
+3. There is now a new `SvelteComponentTyped` class which makes it easier to add strongly typed components that extend base Svelte components. Component library and framework authors rejoice! An example: `export class YourComponent extends SvelteComponentTyped<{aProp: boolean}, {click: MouseEvent}, {default: {aSlot: string}}> {}` (**3.30.0**, [RFC](https://github.com/sveltejs/rfcs/pull/37))
 4. Transitions within `{:else}` blocks should now complete successfully (**3.29.5**, [Example](https://svelte.dev/repl/49cef205e5da459594ef2eafcbd41593?version=3.29.5))
 5. Svelte now includes an export map, which explicitly states which files can be imported from its npm package (**3.29.5** with some fixes in **3.29.6**, **3.29.7** and **3.30.0**)
 6. `rollup-plugin-svelte` had a new [7.0.0 release](https://github.com/sveltejs/rollup-plugin-svelte/blob/master/CHANGELOG.md). The biggest change is that the `css` option was removed. Users who were using that option should add another plugin like `rollup-plugin-css-only` as demonstrated [in the template](https://github.com/sveltejs/template/blob/5b1135c286f7a649daa99825a077586655051649/rollup.config.js#L48)

src/runtime/index.ts

@@ -10,5 +10,6 @@ export {
 	hasContext,
 	tick,
 	createEventDispatcher,
-	SvelteComponentDev as SvelteComponent
+	SvelteComponentDev as SvelteComponent,
+	SvelteComponentTyped
 } from 'svelte/internal';

src/runtime/internal/Component.ts

@@ -212,19 +212,16 @@ if (typeof HTMLElement === 'function') {
 	};
 }
 
-export class SvelteComponent<
-	Props extends Record<string, any> = any,
-	Events extends Record<string, any> = any
-> {
+export class SvelteComponent {
 	$$: T$$;
-	$$set?: ($$props: Partial<Props>) => void;
+	$$set?: ($$props: any) => void;
 
 	$destroy() {
 		destroy_component(this, 1);
 		this.$destroy = noop;
 	}
 
-	$on<K extends Extract<keyof Events, string>>(type: K, callback: (e: Events[K]) => void) {
+	$on(type, callback) {
 		const callbacks = (this.$$.callbacks[type] || (this.$$.callbacks[type] = []));
 		callbacks.push(callback);
 
@@ -234,7 +231,7 @@ export class SvelteComponent<
 		};
 	}
 
-	$set($$props: Partial<Props>) {
+	$set($$props) {
 		if (this.$$set && !is_empty($$props)) {
 			this.$$.skip_bound = true;
 			this.$$set($$props);

src/runtime/internal/dev.ts

@@ -97,22 +97,15 @@ export function validate_slots(name, slot, keys) {
 	}
 }
 
-export interface SvelteComponentDev<
-	Props extends Record<string, any> = any,
-	Events extends Record<string, any> = any,
-	Slots extends Record<string, any> = any
-> {
-	$set(props?: Partial<Props>): void;
-	$on<K extends Extract<keyof Events, string>>(type: K, callback: (e: Events[K]) => void): () => void;
+type Props = Record<string, any>;
+export interface SvelteComponentDev {
+	$set(props?: Props): void;
+	$on(event: string, callback: (event: any) => void): () => void;
 	$destroy(): void;
 	[accessor: string]: any;
 }
 
-export class SvelteComponentDev<
-	Props extends Record<string, any> = any,
-	Events extends Record<string, any> = any,
-	Slots extends Record<string, any> = any
-> extends SvelteComponent<Props, Events> {
+export class SvelteComponentDev extends SvelteComponent {
 	/**
 	 * @private
 	 * For type checking capabilities only.
@@ -120,20 +113,6 @@ export class SvelteComponentDev<
 	 * ### DO NOT USE!
 	 */
 	$$prop_def: Props;
-	/**
-	 * @private
-	 * For type checking capabilities only.
-	 * Does not exist at runtime.
-	 * ### DO NOT USE!
-	 */
-	$$events_def: Events;
-	/**
-	 * @private
-	 * For type checking capabilities only.
-	 * Does not exist at runtime.
-	 * ### DO NOT USE!
-	 */
-	$$slot_def: Slots;
 
 	constructor(options: {
 		target: Element;
@@ -162,6 +141,48 @@ export class SvelteComponentDev<
 	$inject_state() {}
 }
 
+export declare class SvelteComponentTyped<
+	Props extends Record<string, any> = any,
+	Events extends Record<string, any> = any,
+	Slots extends Record<string, any> = any
+> extends SvelteComponentDev {
+	/**
+	 * @private
+	 * For type checking capabilities only.
+	 * Does not exist at runtime.
+	 * ### DO NOT USE!
+	 */
+	$$prop_def: Props;
+	/**
+	 * @private
+	 * For type checking capabilities only.
+	 * Does not exist at runtime.
+	 * ### DO NOT USE!
+	 */
+	$$events_def: Events;
+	/**
+	 * @private
+	 * For type checking capabilities only.
+	 * Does not exist at runtime.
+	 * ### DO NOT USE!
+	 */
+	$$slot_def: Slots;
+
+	constructor(options: {
+		target: Element;
+		anchor?: Element;
+		props?: Props;
+		hydrate?: boolean;
+		intro?: boolean;
+		$$inline?: boolean;
+    })
+
+	$set(props?: Partial<Props>): void;
+	$on<K extends Extract<keyof Events, string>>(type: K, callback: (e: Events[K]) => void): () => void;
+	$destroy(): void;
+	[accessor: string]: any;
+}
+
 export function loop_guard(timeout) {
 	const start = Date.now();
 	return () => {