[chore] upgrade eslint packages (#6769)

package.json

@@ -114,17 +114,17 @@
     "@sveltejs/eslint-config": "github:sveltejs/eslint-config#v5.7.0",
     "@types/mocha": "^7.0.0",
     "@types/node": "^8.10.53",
-    "@typescript-eslint/eslint-plugin": "^4.9.0",
-    "@typescript-eslint/parser": "^4.9.0",
+    "@typescript-eslint/eslint-plugin": "^4.31.2",
+    "@typescript-eslint/parser": "^4.31.2",
     "acorn": "^8.4.1",
     "agadoo": "^1.1.0",
     "c8": "^5.0.1",
     "code-red": "^0.2.2",
     "codecov": "^3.5.0",
     "css-tree": "^1.1.2",
-    "eslint": "^7.15.0",
-    "eslint-plugin-import": "^2.22.1",
-    "eslint-plugin-svelte3": "^2.7.3",
+    "eslint": "^7.32.0",
+    "eslint-plugin-import": "^2.24.2",
+    "eslint-plugin-svelte3": "^3.2.1",
     "estree-walker": "^3.0.0",
     "is-reference": "^3.0.0",
     "jsdom": "^15.2.1",

src/compiler/compile/css/Stylesheet.ts

@@ -155,7 +155,7 @@ class Declaration {
 
 class Atrule {
 	node: CssNode;
-	children: Array<Atrule|Rule>;
+	children: Array<Atrule | Rule>;
 	declarations: Declaration[];
 
 	constructor(node: CssNode) {
@@ -290,7 +290,7 @@ export default class Stylesheet {
 	has_styles: boolean;
 	id: string;
 
-	children: Array<Rule|Atrule> = [];
+	children: Array<Rule | Atrule> = [];
 	keyframes: Map<string, string> = new Map();
 
 	nodes_with_css_class: Set<CssNode> = new Set();
@@ -415,7 +415,7 @@ export default class Stylesheet {
 
 		if (should_transform_selectors) {
 			const max = Math.max(...this.children.map(rule => rule.get_max_amount_class_specificity_increased()));
-			this.children.forEach((child: (Atrule|Rule)) => {
+			this.children.forEach((child: (Atrule | Rule)) => {
 				child.transform(code, this.id, this.keyframes, max);
 			});
 		}

src/compiler/compile/css/gather_possible_values.ts

@@ -2,7 +2,7 @@ import { Node } from 'estree';
 
 export const UNKNOWN = {};
 
-export function gather_possible_values(node: Node, set: Set<string|{}>) {
+export function gather_possible_values(node: Node, set: Set<string | {}>) {
 	if (node.type === 'Literal') {
 		set.add(node.value);
 	} else if (node.type === 'ConditionalExpression') {

src/compiler/compile/nodes/Let.ts

@@ -25,7 +25,7 @@ export default class Let extends Node {
 			this.value = info.expression;
 
 			walk(info.expression, {
-				enter(node: Identifier|BasePattern) {
+				enter(node: Identifier | BasePattern) {
 					if (!applicable.has(node.type)) {
 						return component.error(node as any, compiler_errors.invalid_let);
 					}

src/compiler/compile/render_dom/wrappers/EachBlock.ts

@@ -57,8 +57,8 @@ export default class EachBlockWrapper extends Wrapper {
 		get_each_context: Identifier;
 		iterations: Identifier;
 		fixed_length: number;
-		data_length: Node|number;
-		view_length: Node|number;
+		data_length: Node | number;
+		view_length: Node | number;
 	}
 
 	context_props: Array<Node | Node[]>;

src/compiler/compile/render_dom/wrappers/Element/StyleAttribute.ts

@@ -10,7 +10,7 @@ import Text from '../../../nodes/Text';
 
 export interface StyleProp {
 	key: string;
-	value: Array<Text|Expression>;
+	value: Array<Text | Expression>;
 	important: boolean;
 }
 
@@ -69,7 +69,7 @@ export default class StyleAttributeWrapper extends AttributeWrapper {
 	}
 }
 
-function optimize_style(value: Array<Text|Expression>) {
+function optimize_style(value: Array<Text | Expression>) {
 	const props: StyleProp[] = [];
 	let chunks = value.slice();
 
@@ -107,7 +107,7 @@ function optimize_style(value: Array<Text|Expression>) {
 }
 
 function get_style_value(chunks: Array<Text | Expression>) {
-	const value: Array<Text|Expression> = [];
+	const value: Array<Text | Expression> = [];
 
 	let in_url = false;
 	let quote_mark = null;
@@ -185,6 +185,6 @@ function get_style_value(chunks: Array<Text | Expression>) {
 	};
 }
 
-function is_dynamic(value: Array<Text|Expression>) {
+function is_dynamic(value: Array<Text | Expression>) {
 	return value.length > 1 || value[0].type !== 'Text';
 }

src/runtime/internal/Component.ts

@@ -8,7 +8,7 @@ import { transition_in } from './transitions';
  * INTERNAL, DO NOT USE. Code may change at any time.
  */
 export interface Fragment {
-	key: string|null;
+	key: string | null;
 	first: null;
 	/* create  */ c: () => void;
 	/* claim   */ l: (nodes: any) => void;
@@ -20,17 +20,17 @@ export interface Fragment {
 	/* animate */ a: () => void;
 	/* intro   */ i: (local: any) => void;
 	/* outro   */ o: (local: any) => void;
-	/* destroy */ d: (detaching: 0|1) => void;
+	/* destroy */ d: (detaching: 0 | 1) => void;
 }
 interface T$$ {
 	dirty: number[];
-	ctx: null|any;
+	ctx: null | any;
 	bound: any;
 	update: () => void;
 	callbacks: any;
 	after_update: any[];
 	props: Record<string, 0 | string>;
-	fragment: null|false|Fragment;
+	fragment: null | false | Fragment;
 	not_equal: any;
 	before_update: any[];
 	context: Map<any, any>;
@@ -38,7 +38,7 @@ interface T$$ {
 	on_destroy: any[];
 	skip_bound: boolean;
 	on_disconnect: any[];
-	root:Element|ShadowRoot
+	root:Element | ShadowRoot
 }
 
 export function bind(component, name, callback) {

src/runtime/internal/animations.ts

@@ -6,7 +6,7 @@ import { AnimationConfig } from '../animate';
 
 
 //todo: documentation says it is DOMRect, but in IE it would be ClientRect
-type PositionRect = DOMRect|ClientRect;
+type PositionRect = DOMRect | ClientRect;
 
 type AnimationFn = (node: Element, { from, to }: { from: PositionRect; to: PositionRect }, params: any) => AnimationConfig;
 

src/runtime/internal/dev.ts

@@ -115,7 +115,7 @@ export interface SvelteComponentDev {
 	[accessor: string]: any;
 }
 interface IComponentOptions<Props extends Record<string, any> = Record<string, any>> {
-	target: Element|ShadowRoot;
+	target: Element | ShadowRoot;
 	anchor?: Element;
 	props?: Props;
 	context?: Map<any, any>;

src/runtime/internal/transitions.ts

@@ -7,7 +7,7 @@ import { add_render_callback } from './scheduler';
 import { TransitionConfig } from '../transition';
 import { Fragment } from './Component';
 
-let promise: Promise<void>|null;
+let promise: Promise<void> | null;
 type INTRO = 1;
 type OUTRO = 0;
 interface Outro {