some linting and tidying

easing.mjs

@@ -6,39 +6,39 @@ Distributed under MIT License https://github.com/mattdesl/eases/blob/master/LICE
 export { identity as linear } from './internal';
 
 export function backInOut(t) {
-	var s = 1.70158 * 1.525;
+	const s = 1.70158 * 1.525;
 	if ((t *= 2) < 1) return 0.5 * (t * t * ((s + 1) * t - s));
 	return 0.5 * ((t -= 2) * t * ((s + 1) * t + s) + 2);
 }
 
 export function backIn(t) {
-	var s = 1.70158;
+	const s = 1.70158;
 	return t * t * ((s + 1) * t - s);
 }
 
 export function backOut(t) {
-	var s = 1.70158;
+	const s = 1.70158;
 	return --t * t * ((s + 1) * t + s) + 1;
 }
 
 export function bounceOut(t) {
-	var a = 4.0 / 11.0;
-	var b = 8.0 / 11.0;
-	var c = 9.0 / 10.0;
+	const a = 4.0 / 11.0;
+	const b = 8.0 / 11.0;
+	const c = 9.0 / 10.0;
 
-	var ca = 4356.0 / 361.0;
-	var cb = 35442.0 / 1805.0;
-	var cc = 16061.0 / 1805.0;
+	const ca = 4356.0 / 361.0;
+	const cb = 35442.0 / 1805.0;
+	const cc = 16061.0 / 1805.0;
 
-	var t2 = t * t;
+	const t2 = t * t;
 
 	return t < a
 		? 7.5625 * t2
 		: t < b
-		? 9.075 * t2 - 9.9 * t + 3.4
-		: t < c
-		? ca * t2 - cb * t + cc
-		: 10.8 * t * t - 20.52 * t + 10.72;
+			? 9.075 * t2 - 9.9 * t + 3.4
+			: t < c
+				? ca * t2 - cb * t + cc
+				: 10.8 * t * t - 20.52 * t + 10.72;
 }
 
 export function bounceInOut(t) {
@@ -73,7 +73,7 @@ export function cubicIn(t) {
 }
 
 export function cubicOut(t) {
-	var f = t - 1.0;
+	const f = t - 1.0;
 	return f * f * f + 1.0;
 }
 
@@ -102,8 +102,8 @@ export function expoInOut(t) {
 	return t === 0.0 || t === 1.0
 		? t
 		: t < 0.5
-		? +0.5 * Math.pow(2.0, 20.0 * t - 10.0)
-		: -0.5 * Math.pow(2.0, 10.0 - t * 20.0) + 1.0;
+			? +0.5 * Math.pow(2.0, 20.0 * t - 10.0)
+			: -0.5 * Math.pow(2.0, 10.0 - t * 20.0) + 1.0;
 }
 
 export function expoIn(t) {
@@ -161,7 +161,7 @@ export function sineInOut(t) {
 }
 
 export function sineIn(t) {
-	var v = Math.cos(t * Math.PI * 0.5);
+	const v = Math.cos(t * Math.PI * 0.5);
 	if (Math.abs(v) < 1e-14) return 1;
 	else return 1 - v;
 }

register.js

@@ -2,7 +2,7 @@ const fs = require('fs');
 const path = require('path');
 const { compile } = require('./compiler.js');
 
-let extensions = ['.svelte', '.html'];
+const extensions = ['.svelte', '.html'];
 let compileOptions = {};
 
 function capitalise(name) {

site/.eslintrc.json

@@ -35,7 +35,7 @@
 	],
 	"plugins": ["svelte3"],
 	"parserOptions": {
-		"ecmaVersion": 8,
+		"ecmaVersion": 9,
 		"sourceType": "module"
 	},
 	"settings": {

site/rollup.config.js

@@ -53,9 +53,6 @@ export default {
 				module: true
 			})
 		],
-
-		// temporary, pending Rollup 1.0
-		experimentalCodeSplitting: true
 	},
 
 	server: {
@@ -81,9 +78,6 @@ export default {
 				require('module').builtinModules || Object.keys(process.binding('natives'))
 			)
 		],
-
-		// temporary, pending Rollup 1.0
-		experimentalCodeSplitting: true
 	},
 
 	serviceworker: {

site/src/components/PreloadingIndicator.svelte

@@ -4,11 +4,7 @@
 	let p = 0;
 	let visible = false;
 
-	const sleep = ms => new Promise(f => setTimeout(f, ms));
-
 	onMount(() => {
-		let running = true;
-
 		function next() {
 			visible = true;
 			p += 0.1;
@@ -18,10 +14,6 @@
 		}
 
 		setTimeout(next, 250);
-
-		return () => {
-			running = false;
-		};
 	});
 </script>
 

site/src/components/Repl/ReplWidget.svelte

@@ -29,7 +29,7 @@
 
 		if (gist) {
 			fetch(`repl/${gist}.json`).then(r => r.json()).then(data => {
-				const { id, description, files } = data;
+				const { description, files } = data;
 
 				name = description;
 

site/src/routes/_error.svelte

@@ -7,7 +7,7 @@
 	// we don't want to use <svelte:window bind:online> here,
 	// because we only care about the online state when
 	// the page first loads
-	let online = typeof navigator !== 'undefined'
+	const online = typeof navigator !== 'undefined'
 		? navigator.onLine
 		: true;
 </script>

site/src/routes/docs/_GuideContents.svelte

@@ -1,140 +0,0 @@
-<script>
-	import { onMount, afterUpdate } from 'svelte';
-	import Icon from '../../components/Icon.svelte';
-
-	export let sections = [];
-	export let active_section = null;
-	export let show_contents;
-	export let prevent_sidebar_scroll = false;
-
-	let ul;
-
-	afterUpdate(() => {
-		// bit of a hack — prevent sidebar scrolling if
-		// TOC is open on mobile, or scroll came from within sidebar
-		if (prevent_sidebar_scroll || show_contents && window.innerWidth < 832) return;
-
-		const active = ul.querySelector('.active');
-
-		if (active) {
-			const { top, bottom } = active.getBoundingClientRect();
-
-			const min = 200;
-			const max = window.innerHeight - 200;
-
-			if (top > max) {
-				ul.parentNode.scrollBy({
-					top: top - max,
-					left: 0,
-					behavior: 'smooth'
-				});
-			} else if (bottom < min) {
-				ul.parentNode.scrollBy({
-					top: bottom - min,
-					left: 0,
-					behavior: 'smooth'
-				});
-			}
-		}
-	});
-</script>
-
-<style>
-	.reference-toc li {
-		display: block;
-		line-height: 1.2;
-		margin: 0 0 4rem 0;
-	}
-
-	a {
-		position: relative;
-		transition: color 0.2s;
-		border-bottom: none;
-		padding: 0;
-		color: var(--second);
-	}
-
-	.section {
-		display: block;
-		padding: 0 0 .8rem 0;
-		font-size: var(--h6);
-		text-transform: uppercase;
-		letter-spacing: 0.1em;
-		font-weight: 600;
-	}
-
-	.subsection {
-		display: block;
-		font-size: 1.6rem;
-		font-family: var(--font);
-		padding: 0 0 0.6em 0;
-	}
-
-	.section:hover,
-	.subsection:hover,
-	.active {
-		color: var(--flash);
-	}
-
-	.subsection[data-level="4"] {
-		padding-left: 1.2rem;
-	}
-
-	.icon-container {
-		position: absolute;
-		top: -.2rem;
-		right: 2.4rem;
-	}
-
-	@media (min-width: 832px) {
-		a {
-			color: var(--sidebar-text);
-		}
-
-		a:hover,
-		.section:hover,
-		.subsection:hover,
-		.active {
-			color: white
-		}
-	}
-</style>
-
-<ul
-	bind:this={ul}
-	class="reference-toc"
-	on:mouseenter="{() => prevent_sidebar_scroll = true}"
-	on:mouseleave="{() => prevent_sidebar_scroll = false}"
->
-	{#each sections as section}
-		<li>
-			<a class="section" class:active="{section.slug === active_section}" href="docs#{section.slug}">
-				{section.metadata.title}
-
-				{#if section.slug === active_section}
-					<div class="icon-container">
-						<Icon name="arrow-right" />
-					</div>
-				{/if}
-			</a>
-
-			{#each section.subsections as subsection}
-				<!-- see <script> below: on:click='scrollTo(event, subsection.slug)' -->
-				<a
-					class="subsection"
-					class:active="{subsection.slug === active_section}"
-					href="docs#{subsection.slug}"
-					data-level="{subsection.level}"
-				>
-					{subsection.title}
-
-					{#if subsection.slug === active_section}
-						<div class="icon-container">
-							<Icon name="arrow-right" />
-						</div>
-					{/if}
-				</a>
-			{/each}
-		</li>
-	{/each}
-</ul>

site/src/routes/docs/index.svelte

@@ -6,7 +6,7 @@
 </script>
 
 <script>
-	import { Docs } from '@sveltejs/site-kit'
+	import { Docs } from '@sveltejs/site-kit';
 
 	export let sections;
 </script>

site/src/routes/examples/index.svelte

@@ -37,7 +37,7 @@
 	let offset = 1;
 	let repl;
 	let isLoading = false;
-	let cache = {};
+	const cache = {};
 
 	$: title = title_by_slug[active_slug] || '';
 	$: first_slug = sections[0].examples[0].slug;
@@ -50,21 +50,21 @@
 		} else {
 			isLoading = true;
 			fetch(`examples/${active_slug}.json`)
-			.then(async response => {
-				if (response.ok) {
-					const {files} = await response.json();
-					return process_example(files);
-				}
-			})
-			.then(components => {
-				cache[active_slug] = components;
- 				repl.set({components});
-				offset = 1;
-				isLoading = false;
-			})
-			.catch(function(error) {
-				isLoading = false;
-			});
+				.then(async response => {
+					if (response.ok) {
+						const {files} = await response.json();
+						return process_example(files);
+					}
+				})
+				.then(components => {
+					cache[active_slug] = components;
+					repl.set({components});
+					offset = 1;
+					isLoading = false;
+				})
+				.catch(() => {
+					isLoading = false;
+				});
 		}
 	}
 

site/src/routes/index.svelte

@@ -13,7 +13,7 @@
 </script>
 
 <style>
-	/* darken text for accesibility */
+	/* darken text for accessibility */
 	/* TODO does this belong elsewhere? */
 	:global(.back-light) {
 		--text: hsl(36, 3%, 44%);

site/src/routes/repl/[id]/_components/AppControls/index.svelte

@@ -107,7 +107,6 @@
 		try {
 			// Send all files back to API
 			// ~> Any missing files are considered deleted!
-			const files = {};
 			const { components } = repl.toJSON();
 
 			const r = await fetch(`repl/${gist.uid}.json`, {
@@ -127,7 +126,7 @@
 				throw new Error(`Received an HTTP ${r.status} response: ${error}`);
 			}
 
-			const result = await r.json();
+			await r.json();
 
 			justSaved = true;
 			await wait(600);
@@ -155,7 +154,7 @@
 			const pkg = JSON.parse(files[idx].data);
 			const deps = {};
 			imports.forEach(mod => {
-				const match = /^(@[^\/]+\/)?[^@\/]+/.exec(mod);
+				const match = /^(@[^/]+\/)?[^@/]+/.exec(mod);
 				deps[match[0]] = 'latest';
 			});
 			pkg.dependencies = deps;

site/src/routes/repl/[id]/index.json.js

@@ -1,5 +1,4 @@
 import send from '@polka/send';
-import redirect from '@polka/redirect';
 import body from '../_utils/body.js';
 import * as httpie from 'httpie';
 import { query, find } from '../../../utils/db';

site/src/routes/repl/[id]/index.svelte

@@ -11,7 +11,6 @@
 	import Repl from '@sveltejs/svelte-repl';
 	import { onMount } from 'svelte';
 	import { goto } from '@sapper/app';
-	import { process_example } from '../../../utils/examples';
 	import { user } from '../../../user.js';
 	import InputOutputToggle from '../../../components/Repl/InputOutputToggle.svelte';
 	import AppControls from './_components/AppControls/index.svelte';
@@ -56,7 +55,6 @@
 
 					is_relaxed_gist = data.relaxed;
 
-					const rgx = /(js|svelte)$/i;
 					const components = data.files.map(file => {
 						let [name, type] = file.name.split('.');
 						if (type === 'html') type = 'svelte'; // TODO do this on the server
@@ -75,7 +73,7 @@
 					repl.set({ components });
 				});
 			} else {
-				console.warn('TODO: 404 Gist')
+				console.warn('TODO: 404 Gist');
 			}
 		});
 	}

site/src/service-worker.js

@@ -1,4 +1,4 @@
-import { timestamp, files, shell, routes } from '@sapper/service-worker';
+import { timestamp, files, shell } from '@sapper/service-worker';
 
 const ASSETS = `cache${timestamp}`;
 

site/src/utils/slug.js

@@ -13,8 +13,8 @@ export const urlsafeSlugProcessor = string =>
 		decamelize: false,
 		lowercase: false
 	})
-	.replace(/DOLLAR/g, '$')
-	.replace(/DASH/g, '-');
+		.replace(/DOLLAR/g, '$')
+		.replace(/DASH/g, '-');
 
 /* unicode-preserver processor */
 
@@ -25,35 +25,35 @@ const isNonAlphaNumUnicode =
 
 export const unicodeSafeProcessor = string =>
 	string.split('')
-	.reduce((accum, char, index, array) => {
-		const type = isNonAlphaNumUnicode(char) ? 'pass' : 'process';
-
-		if (index === 0) {
-			accum.current = {type, string: char};
-		} else if (type === accum.current.type) {
-			accum.current.string += char;
-		} else {
-			accum.chunks.push(accum.current);
-			accum.current = {type, string: char}
-		}
-
-		if (index === array.length - 1) {
-			accum.chunks.push(accum.current);
-		}
-
-		return accum;
-	}, {chunks: [], current: {type: '', string: ''}})
-	.chunks
-	.reduce((accum, chunk) => {
-		const processed = chunk.type === 'process'
-			? urlsafeSlugProcessor(chunk.string)
-			: chunk.string;
-
-		processed.length > 0 && accum.push(processed);
-
-		return accum;
-	}, [])
-	.join(SLUG_SEPARATOR);
+		.reduce((accum, char, index, array) => {
+			const type = isNonAlphaNumUnicode(char) ? 'pass' : 'process';
+
+			if (index === 0) {
+				accum.current = {type, string: char};
+			} else if (type === accum.current.type) {
+				accum.current.string += char;
+			} else {
+				accum.chunks.push(accum.current);
+				accum.current = {type, string: char};
+			}
+
+			if (index === array.length - 1) {
+				accum.chunks.push(accum.current);
+			}
+
+			return accum;
+		}, {chunks: [], current: {type: '', string: ''}})
+		.chunks
+		.reduce((accum, chunk) => {
+			const processed = chunk.type === 'process'
+				? urlsafeSlugProcessor(chunk.string)
+				: chunk.string;
+
+			processed.length > 0 && accum.push(processed);
+
+			return accum;
+		}, [])
+		.join(SLUG_SEPARATOR);
 
 /* processor */
 
@@ -74,5 +74,5 @@ export const makeSessionSlugProcessor = (preserveUnicode = false) => {
 		seen.add(slug);
 
 		return slug;
-	}
-}
+	};
+};

site/static/repl-runner.js

@@ -19,7 +19,7 @@
 		let pending_imports = missing_imports.length;
 
 		if (missing_imports.length) {
-			let promise = Promise.all(
+			const promise = Promise.all(
 				missing_imports.map(id => fetch_import(id).then(() => {
 					pending_imports -= 1;
 					if (progress_func) progress_func(pending_imports);
@@ -33,7 +33,7 @@
 	}
 
 	function handle_message(ev) {
-		let { action, cmd_id } = ev.data;
+		const { action, cmd_id } = ev.data;
 		const send_message = (payload) => parent.postMessage( { ...payload }, ev.origin);
 		const send_reply = (payload) => send_message({ ...payload, cmd_id });
 		const send_ok = () => send_reply({ action: 'cmd_ok' });
@@ -77,7 +77,7 @@
 					window.open(el.href, '_blank');
 				});
 				send_ok();
-			} catch(e) {
+			} catch (e) {
 				send_error(e.message, e.stack);
 			}
 		}
@@ -87,17 +87,17 @@
 			fetch_imports(imports, (remaining) => {
 				send_message({action: 'fetch_progress', args: { remaining }});
 			})
-			.then(() => {
-				imports.forEach(x=> {
-					const module = import_cache[x];
-					const name = import_map.get(x);
-					window[name] = module;
+				.then(() => {
+					imports.forEach(x => {
+						const module = import_cache[x];
+						const name = import_map.get(x);
+						window[name] = module;
+					});
+					send_ok();
+				})
+				.catch(e => {
+					send_error(e.message, e.stack);
 				});
-				send_ok();
-			})
-			.catch(e => {
-				send_error(e.message, e.stack);
-			});
 		}
 	}
 

src/compile/css/Selector.ts

@@ -1,8 +1,8 @@
 import MagicString from 'magic-string';
 import Stylesheet from './Stylesheet';
 import { gather_possible_values, UNKNOWN } from './gather_possible_values';
-import { Node } from '../interfaces';
-import Component from '../compile/Component';
+import { Node } from '../../interfaces';
+import Component from '../Component';
 
 export default class Selector {
 	node: Node;

src/compile/css/gather_possible_values.ts

@@ -1,4 +1,4 @@
-import { Node } from '../interfaces';
+import { Node } from '../../interfaces';
 
 export const UNKNOWN = {};
 

src/compile/render-ssr/handlers/Element.ts

@@ -1,5 +1,6 @@
 import { is_void, quote_prop_if_necessary, quote_name_if_necessary } from '../../../utils/names';
 import Attribute from '../../nodes/Attribute';
+import Class from '../../nodes/Class';
 import Node from '../../nodes/shared/Node';
 import { snip } from '../../utils/snip';
 import { stringify_attribute } from '../../utils/stringify_attribute';