@sveltejs/kit 1.0.0-next.304 → 1.0.0-next.307

package/assets/client/start.js

@@ -269,7 +269,7 @@ function parse_route_id(id) {
 			? /^\/$/
 			: new RegExp(
 					`^${decodeURIComponent(id)
-						.split('/')
+						.split(/(?:@[a-zA-Z0-9_-]+)?(?:\/|$)/)
 						.map((segment, i, segments) => {
 							// special case — /[...rest]/ could contain zero segments
 							const match = /^\[\.\.\.(\w+)(?:=(\w+))?\]$/.exec(segment);
@@ -282,40 +282,41 @@ function parse_route_id(id) {
 							const is_last = i === segments.length - 1;
 
 							return (
+								segment &&
 								'/' +
-								segment
-									.split(/\[(.+?)\]/)
-									.map((content, i) => {
-										if (i % 2) {
-											const [, rest, name, type] = /** @type {RegExpMatchArray} */ (
-												param_pattern.exec(content)
-											);
-											names.push(name);
-											types.push(type);
-											return rest ? '(.*?)' : '([^/]+?)';
-										}
-
-										if (is_last && content.includes('.')) add_trailing_slash = false;
-
-										return (
-											content // allow users to specify characters on the file system in an encoded manner
-												.normalize()
-												// We use [ and ] to denote parameters, so users must encode these on the file
-												// system to match against them. We don't decode all characters since others
-												// can already be epressed and so that '%' can be easily used directly in filenames
-												.replace(/%5[Bb]/g, '[')
-												.replace(/%5[Dd]/g, ']')
-												// '#', '/', and '?' can only appear in URL path segments in an encoded manner.
-												// They will not be touched by decodeURI so need to be encoded here, so
-												// that we can match against them.
-												// We skip '/' since you can't create a file with it on any OS
-												.replace(/#/g, '%23')
-												.replace(/\?/g, '%3F')
-												// escape characters that have special meaning in regex
-												.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
-										); // TODO handle encoding
-									})
-									.join('')
+									segment
+										.split(/\[(.+?)\]/)
+										.map((content, i) => {
+											if (i % 2) {
+												const [, rest, name, type] = /** @type {RegExpMatchArray} */ (
+													param_pattern.exec(content)
+												);
+												names.push(name);
+												types.push(type);
+												return rest ? '(.*?)' : '([^/]+?)';
+											}
+
+											if (is_last && content.includes('.')) add_trailing_slash = false;
+
+											return (
+												content // allow users to specify characters on the file system in an encoded manner
+													.normalize()
+													// We use [ and ] to denote parameters, so users must encode these on the file
+													// system to match against them. We don't decode all characters since others
+													// can already be epressed and so that '%' can be easily used directly in filenames
+													.replace(/%5[Bb]/g, '[')
+													.replace(/%5[Dd]/g, ']')
+													// '#', '/', and '?' can only appear in URL path segments in an encoded manner.
+													// They will not be touched by decodeURI so need to be encoded here, so
+													// that we can match against them.
+													// We skip '/' since you can't create a file with it on any OS
+													.replace(/#/g, '%23')
+													.replace(/\?/g, '%3F')
+													// escape characters that have special meaning in regex
+													.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+											); // TODO handle encoding
+										})
+										.join('')
 							);
 						})
 						.join('')}${add_trailing_slash ? '/?' : ''}$`

package/assets/server/index.js

@@ -2081,38 +2081,46 @@ async function respond_with_error({
 	resolve_opts
 }) {
 	try {
-		const default_layout = await options.manifest._.nodes[0](); // 0 is always the root layout
-		const default_error = await options.manifest._.nodes[1](); // 1 is always the root error
+		const branch = [];
+		let stuff = {};
+
+		if (resolve_opts.ssr) {
+			const default_layout = await options.manifest._.nodes[0](); // 0 is always the root layout
+			const default_error = await options.manifest._.nodes[1](); // 1 is always the root error
+
+			const layout_loaded = /** @type {Loaded} */ (
+				await load_node({
+					event,
+					options,
+					state,
+					route: null,
+					node: default_layout,
+					$session,
+					stuff: {},
+					is_error: false,
+					is_leaf: false
+				})
+			);
 
-		const layout_loaded = /** @type {Loaded} */ (
-			await load_node({
-				event,
-				options,
-				state,
-				route: null,
-				node: default_layout,
-				$session,
-				stuff: {},
-				is_error: false,
-				is_leaf: false
-			})
-		);
+			const error_loaded = /** @type {Loaded} */ (
+				await load_node({
+					event,
+					options,
+					state,
+					route: null,
+					node: default_error,
+					$session,
+					stuff: layout_loaded ? layout_loaded.stuff : {},
+					is_error: true,
+					is_leaf: false,
+					status,
+					error
+				})
+			);
 
-		const error_loaded = /** @type {Loaded} */ (
-			await load_node({
-				event,
-				options,
-				state,
-				route: null,
-				node: default_error,
-				$session,
-				stuff: layout_loaded ? layout_loaded.stuff : {},
-				is_error: true,
-				is_leaf: false,
-				status,
-				error
-			})
-		);
+			branch.push(layout_loaded, error_loaded);
+			stuff = error_loaded.stuff;
+		}
 
 		return await render_response({
 			options,
@@ -2122,10 +2130,10 @@ async function respond_with_error({
 				hydrate: options.hydrate,
 				router: options.router
 			},
-			stuff: error_loaded.stuff,
+			stuff,
 			status,
 			error,
-			branch: [layout_loaded, error_loaded],
+			branch,
 			event,
 			resolve_opts
 		});
@@ -2181,7 +2189,8 @@ async function respond$1(opts) {
 
 	try {
 		nodes = await Promise.all(
-			route.a.map((n) => options.manifest._.nodes[n] && options.manifest._.nodes[n]())
+			// we use == here rather than === because [undefined] serializes as "[null]"
+			route.a.map((n) => (n == undefined ? n : options.manifest._.nodes[n]()))
 		);
 	} catch (err) {
 		const error = coalesce_to_error(err);
@@ -2280,7 +2289,8 @@ async function respond$1(opts) {
 				if (error) {
 					while (i--) {
 						if (route.b[i]) {
-							const error_node = await options.manifest._.nodes[route.b[i]]();
+							const index = /** @type {number} */ (route.b[i]);
+							const error_node = await options.manifest._.nodes[index]();
 
 							/** @type {Loaded} */
 							let node_loaded;

package/dist/chunks/index.js

@@ -12,6 +12,7 @@ import { getRequest, setResponse } from '../node.js';
 import { sequence } from '../hooks.js';
 import { p as posixify } from './filesystem.js';
 import { p as parse_route_id } from './misc.js';
+import { n as normalize_path } from './url.js';
 import 'sade';
 import 'child_process';
 import 'net';
@@ -131,8 +132,8 @@ async function create_plugin(config, cwd) {
 												return await vite.ssrLoadModule(url, { fixStacktrace: false });
 										  }
 										: null,
-									a: route.a.map((id) => manifest_data.components.indexOf(id)),
-									b: route.b.map((id) => manifest_data.components.indexOf(id))
+									a: route.a.map((id) => (id ? manifest_data.components.indexOf(id) : undefined)),
+									b: route.b.map((id) => (id ? manifest_data.components.indexOf(id) : undefined))
 								};
 							}
 
@@ -214,7 +215,13 @@ async function create_plugin(config, cwd) {
 
 						if (req.url === '/favicon.ico') return not_found(res);
 
-						if (!decoded.startsWith(config.kit.paths.base)) return not_found(res);
+						if (!decoded.startsWith(config.kit.paths.base)) {
+							const suggestion = normalize_path(
+								config.kit.paths.base + req.url,
+								config.kit.trailingSlash
+							);
+							return not_found(res, `Not found (did you mean ${suggestion}?)`);
+						}
 
 						/** @type {Partial<import('types').Hooks>} */
 						const user_hooks = resolve_entry(config.kit.files.hooks)
@@ -370,9 +377,9 @@ async function create_plugin(config, cwd) {
 }
 
 /** @param {import('http').ServerResponse} res */
-function not_found(res) {
+function not_found(res, message = 'Not found') {
 	res.statusCode = 404;
-	res.end('Not found');
+	res.end(message);
 }
 
 /**

package/dist/chunks/index2.js

@@ -71,6 +71,7 @@ async function build_service_worker(
 
 			export const files = [
 				${manifest_data.assets
+					.filter((asset) => config.kit.serviceWorker.files(asset.file))
 					.map((asset) => `${s(`${config.kit.paths.base}/${asset.file}`)}`)
 					.join(',\n\t\t\t\t')}
 			];

package/dist/chunks/index3.js

@@ -54,7 +54,7 @@ function generate_manifest({ build_data, relative_path, routes, format = 'esm' }
 		assets.push(build_data.service_worker);
 	}
 
-	/** @param {string} id */
+	/** @param {string | undefined} id */
 	const get_index = (id) => id && /** @type {LookupEntry} */ (bundled_nodes.get(id)).index;
 
 	const matchers = new Set();

package/dist/chunks/misc.js

@@ -17,7 +17,7 @@ function parse_route_id(id) {
 			? /^\/$/
 			: new RegExp(
 					`^${decodeURIComponent(id)
-						.split('/')
+						.split(/(?:@[a-zA-Z0-9_-]+)?(?:\/|$)/)
 						.map((segment, i, segments) => {
 							// special case — /[...rest]/ could contain zero segments
 							const match = /^\[\.\.\.(\w+)(?:=(\w+))?\]$/.exec(segment);
@@ -30,40 +30,41 @@ function parse_route_id(id) {
 							const is_last = i === segments.length - 1;
 
 							return (
+								segment &&
 								'/' +
-								segment
-									.split(/\[(.+?)\]/)
-									.map((content, i) => {
-										if (i % 2) {
-											const [, rest, name, type] = /** @type {RegExpMatchArray} */ (
-												param_pattern.exec(content)
-											);
-											names.push(name);
-											types.push(type);
-											return rest ? '(.*?)' : '([^/]+?)';
-										}
+									segment
+										.split(/\[(.+?)\]/)
+										.map((content, i) => {
+											if (i % 2) {
+												const [, rest, name, type] = /** @type {RegExpMatchArray} */ (
+													param_pattern.exec(content)
+												);
+												names.push(name);
+												types.push(type);
+												return rest ? '(.*?)' : '([^/]+?)';
+											}
 
-										if (is_last && content.includes('.')) add_trailing_slash = false;
+											if (is_last && content.includes('.')) add_trailing_slash = false;
 
-										return (
-											content // allow users to specify characters on the file system in an encoded manner
-												.normalize()
-												// We use [ and ] to denote parameters, so users must encode these on the file
-												// system to match against them. We don't decode all characters since others
-												// can already be epressed and so that '%' can be easily used directly in filenames
-												.replace(/%5[Bb]/g, '[')
-												.replace(/%5[Dd]/g, ']')
-												// '#', '/', and '?' can only appear in URL path segments in an encoded manner.
-												// They will not be touched by decodeURI so need to be encoded here, so
-												// that we can match against them.
-												// We skip '/' since you can't create a file with it on any OS
-												.replace(/#/g, '%23')
-												.replace(/\?/g, '%3F')
-												// escape characters that have special meaning in regex
-												.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
-										); // TODO handle encoding
-									})
-									.join('')
+											return (
+												content // allow users to specify characters on the file system in an encoded manner
+													.normalize()
+													// We use [ and ] to denote parameters, so users must encode these on the file
+													// system to match against them. We don't decode all characters since others
+													// can already be epressed and so that '%' can be easily used directly in filenames
+													.replace(/%5[Bb]/g, '[')
+													.replace(/%5[Dd]/g, ']')
+													// '#', '/', and '?' can only appear in URL path segments in an encoded manner.
+													// They will not be touched by decodeURI so need to be encoded here, so
+													// that we can match against them.
+													// We skip '/' since you can't create a file with it on any OS
+													.replace(/#/g, '%23')
+													.replace(/\?/g, '%3F')
+													// escape characters that have special meaning in regex
+													.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+											); // TODO handle encoding
+										})
+										.join('')
 							);
 						})
 						.join('')}${add_trailing_slash ? '/?' : ''}$`

package/dist/chunks/sync.js

@@ -121,18 +121,39 @@ var mime = new Mime(standard, other);
  *   rest: boolean;
  *   type: string | null;
  * }} Part
+ */
+
+/**
+ * A route, consisting of an endpoint module and/or an array of components
+ * (n layouts and one leaf) for successful navigations and an array of
+ * n error components to render if navigation fails
  * @typedef {{
- *   name: string;
- *   parts: Part[],
- *   file: string;
- *   is_dir: boolean;
- *   is_index: boolean;
- *   is_page: boolean;
- *   route_suffix: string
- * }} Item
+ *   id: string;
+ *   pattern: RegExp;
+ *   segments: Part[][];
+ *   page?: {
+ *     a: Array<string | undefined>;
+ *     b: Array<string | undefined>;
+ *   };
+ *   endpoint?: string;
+ * }} Unit
  */
 
-const specials = new Set(['__layout', '__layout.reset', '__error', '__tests__', '__test__']);
+/**
+ * @typedef {{
+ *   error: string | undefined;
+ *   layouts: Record<string, { file: string, name: string }>
+ * }} Node
+ */
+
+/**
+ * @typedef {Map<string, Node>} Tree
+ */
+
+const layout_pattern = /^__layout(?:-([a-zA-Z0-9_-]+))?(?:@([a-zA-Z0-9_-]+))?$/;
+const dunder_pattern = /(^|\/)__(?!tests?__)/; // forbid __-prefixed files/directories except __error, __layout[-...], __test__, __tests__
+
+const DEFAULT = 'default';
 
 /**
  * @param {{
@@ -147,172 +168,201 @@ function create_manifest_data({
 	fallback = `${get_runtime_path(config)}/components`,
 	cwd = process.cwd()
 }) {
-	/**
-	 * @param {string} file_name
-	 * @param {string} dir
-	 */
-	function find_layout(file_name, dir) {
-		const files = config.extensions.map((ext) => posixify(path__default.join(dir, `${file_name}${ext}`)));
-		return files.find((file) => fs__default.existsSync(path__default.resolve(cwd, file)));
-	}
-
-	/** @type {string[]} */
-	const components = [];
-
 	/** @type {import('types').RouteData[]} */
 	const routes = [];
 
-	const default_layout = posixify(path__default.relative(cwd, `${fallback}/layout.svelte`));
-	const default_error = posixify(path__default.relative(cwd, `${fallback}/error.svelte`));
-
-	/**
-	 * @param {string} dir
-	 * @param {string[]} parent_id
-	 * @param {Array<string|undefined>} layout_stack // accumulated __layout.svelte components
-	 * @param {Array<string|undefined>} error_stack // accumulated __error.svelte components
-	 */
-	function walk(dir, parent_id, layout_stack, error_stack) {
-		/** @type {Item[]} */
-		const items = [];
+	/** @type {Map<string, Unit>} */
+	const units = new Map();
 
-		fs__default.readdirSync(dir).forEach((basename) => {
-			const resolved = path__default.join(dir, basename);
-			const file = posixify(path__default.relative(cwd, resolved));
-			const is_dir = fs__default.statSync(resolved).isDirectory();
+	/** @type {Tree} */
+	const tree = new Map();
 
-			const ext = is_dir
-				? ''
-				: config.extensions.find((ext) => basename.endsWith(ext)) ||
-				  config.kit.endpointExtensions.find((ext) => basename.endsWith(ext));
+	const default_layout = {
+		file: posixify(path__default.relative(cwd, `${fallback}/layout.svelte`)),
+		name: DEFAULT
+	};
 
-			if (ext === undefined) return;
+	// set default root layout/error
+	tree.set('', {
+		error: posixify(path__default.relative(cwd, `${fallback}/error.svelte`)),
+		layouts: { [DEFAULT]: default_layout }
+	});
 
-			const name = basename.slice(0, basename.length - ext.length);
+	const routes_base = posixify(path__default.relative(cwd, config.kit.files.routes));
+	const valid_extensions = [...config.extensions, ...config.kit.endpointExtensions];
 
-			if (name.startsWith('__') && !specials.has(name)) {
-				throw new Error(`Files and directories prefixed with __ are reserved (saw ${file})`);
-			}
+	list_files(config.kit.files.routes).forEach((file) => {
+		const extension = valid_extensions.find((ext) => file.endsWith(ext));
+		if (!extension) return;
 
-			if (!config.kit.routes(file)) return;
+		const id = file
+			.slice(0, -extension.length)
+			.replace(/(?:^|\/)index((?:@[a-zA-Z0-9_-]+)?(?:\.[a-z]+)?)?$/, '$1');
+		const project_relative = `${routes_base}/${file}`;
 
-			items.push({
-				file,
-				name,
-				parts: get_parts(name, file),
-				route_suffix: basename.slice(basename.indexOf('.'), -ext.length),
-				is_dir,
-				is_index: !is_dir && basename.startsWith('index.'),
-				is_page: config.extensions.includes(ext)
-			});
-		});
+		const segments = id.split('/');
+		const name = /** @type {string} */ (segments.pop());
 
-		items.sort(comparator);
+		if (name === '__layout.reset') {
+			throw new Error(
+				'__layout.reset has been removed in favour of named layouts: https://kit.svelte.dev/docs/layouts#named-layouts'
+			);
+		}
 
-		items.forEach((item) => {
-			const id_parts = parent_id.slice();
+		if (name === '__error' || layout_pattern.test(name)) {
+			const dir = segments.join('/');
 
-			if (item.is_index) {
-				if (item.route_suffix && id_parts.length > 0) {
-					id_parts[id_parts.length - 1] += item.route_suffix;
-				}
-			} else {
-				id_parts.push(item.name);
+			if (!tree.has(dir)) {
+				tree.set(dir, {
+					error: undefined,
+					layouts: {}
+				});
 			}
 
-			if (item.is_dir) {
-				const layout_reset = find_layout('__layout.reset', item.file);
-				const layout = find_layout('__layout', item.file);
-				const error = find_layout('__error', item.file);
+			const group = /** @type {Node} */ (tree.get(dir));
 
-				if (layout_reset && layout) {
-					throw new Error(`Cannot have __layout next to __layout.reset: ${layout_reset}`);
+			if (name === '__error') {
+				group.error = project_relative;
+			} else {
+				const match = /** @type {RegExpMatchArray} */ (layout_pattern.exec(name));
+
+				if (match[1] === DEFAULT) {
+					throw new Error(`${project_relative} cannot use reserved "${DEFAULT}" name`);
 				}
 
-				if (layout_reset) components.push(layout_reset);
-				if (layout) components.push(layout);
-				if (error) components.push(error);
+				const layout_id = match[1] || DEFAULT;
 
-				walk(
-					path__default.join(dir, item.name),
-					id_parts,
-					layout_reset ? [layout_reset] : layout_stack.concat(layout),
-					layout_reset ? [error] : error_stack.concat(error)
-				);
-			} else {
-				const id = id_parts.join('/');
-				const { pattern } = parse_route_id(id);
+				const defined = group.layouts[layout_id];
+				if (defined && defined !== default_layout) {
+					throw new Error(
+						`Duplicate layout ${project_relative} already defined at ${defined.file}`
+					);
+				}
 
-				if (item.is_page) {
-					components.push(item.file);
+				group.layouts[layout_id] = {
+					file: project_relative,
+					name
+				};
+			}
 
-					const concatenated = layout_stack.concat(item.file);
-					const errors = error_stack.slice();
+			return;
+		} else if (dunder_pattern.test(file)) {
+			throw new Error(
+				`Files and directories prefixed with __ are reserved (saw ${project_relative})`
+			);
+		}
 
-					let i = concatenated.length;
-					while (i--) {
-						if (!errors[i] && !concatenated[i]) {
-							errors.splice(i, 1);
-							concatenated.splice(i, 1);
-						}
-					}
+		if (!config.kit.routes(file)) return;
 
-					i = errors.length;
-					while (i--) {
-						if (errors[i]) break;
-					}
+		if (/\]\[/.test(id)) {
+			throw new Error(`Invalid route ${project_relative} — parameters must be separated`);
+		}
 
-					errors.splice(i + 1);
+		if (count_occurrences('[', id) !== count_occurrences(']', id)) {
+			throw new Error(`Invalid route ${project_relative} — brackets are unbalanced`);
+		}
 
-					const path = id.includes('[') ? '' : `/${id}`;
+		if (!units.has(id)) {
+			units.set(id, {
+				id,
+				pattern: parse_route_id(id).pattern,
+				segments: id
+					.split('/')
+					.filter(Boolean)
+					.map((segment) => {
+						/** @type {Part[]} */
+						const parts = [];
+						segment.split(/\[(.+?)\]/).map((content, i) => {
+							const dynamic = !!(i % 2);
+
+							if (!content) return;
+
+							parts.push({
+								content,
+								dynamic,
+								rest: dynamic && content.startsWith('...'),
+								type: (dynamic && content.split('=')[1]) || null
+							});
+						});
+						return parts;
+					}),
+				page: undefined,
+				endpoint: undefined
+			});
+		}
 
-					routes.push({
-						type: 'page',
-						id,
-						pattern,
-						path,
-						shadow: null,
-						a: /** @type {string[]} */ (concatenated),
-						b: /** @type {string[]} */ (errors)
-					});
-				} else {
-					routes.push({
-						type: 'endpoint',
-						id,
-						pattern,
-						file: item.file
-					});
-				}
-			}
-		});
-	}
+		const unit = /** @type {Unit} */ (units.get(id));
 
-	const routes_base = path__default.relative(cwd, config.kit.files.routes);
+		if (config.extensions.find((ext) => file.endsWith(ext))) {
+			const { layouts, errors } = trace(project_relative, file, tree, config.extensions);
+			unit.page = {
+				a: layouts.concat(project_relative),
+				b: errors
+			};
+		} else {
+			unit.endpoint = project_relative;
+		}
+	});
 
-	const layout = find_layout('__layout', routes_base) || default_layout;
-	const error = find_layout('__error', routes_base) || default_error;
+	/** @type {string[]} */
+	const components = [];
 
-	components.push(layout, error);
+	tree.forEach(({ layouts, error }) => {
+		// we do [default, error, ...other_layouts] so that components[0] and [1]
+		// are the root layout/error. kinda janky, there's probably a nicer way
+		if (layouts[DEFAULT]) {
+			components.push(layouts[DEFAULT].file);
+		}
 
-	walk(config.kit.files.routes, [], [layout], [error]);
+		if (error) {
+			components.push(error);
+		}
 
-	const lookup = new Map();
-	for (const route of routes) {
-		if (route.type === 'page') {
-			lookup.set(route.id, route);
+		for (const id in layouts) {
+			if (id !== DEFAULT) components.push(layouts[id].file);
 		}
-	}
+	});
 
-	let i = routes.length;
-	while (i--) {
-		const route = routes[i];
-		if (route.type === 'endpoint' && lookup.has(route.id)) {
-			lookup.get(route.id).shadow = route.file;
-			routes.splice(i, 1);
+	units.forEach((unit) => {
+		if (unit.page) {
+			const leaf = /** @type {string} */ (unit.page.a[unit.page.a.length - 1]);
+			components.push(leaf);
 		}
-	}
+	});
+
+	Array.from(units.values())
+		.sort(compare)
+		.forEach((unit) => {
+			// TODO when we introduce layout endpoints and scoped middlewares, we
+			// will probably want to have a single unified route type here
+			// (created in the list_files(...).forEach(...) callback)
+			if (unit.page) {
+				routes.push({
+					type: 'page',
+					id: unit.id,
+					pattern: unit.pattern,
+					path: unit.id.includes('[') ? '' : `/${unit.id.replace(/@(?:[a-zA-Z0-9_-]+)/g, '')}`,
+					shadow: unit.endpoint || null,
+					a: unit.page.a,
+					b: unit.page.b
+				});
+			} else if (unit.endpoint) {
+				routes.push({
+					type: 'endpoint',
+					id: unit.id,
+					pattern: unit.pattern,
+					file: unit.endpoint
+				});
+			}
+		});
 
+	/** @type {import('types').Asset[]} */
 	const assets = fs__default.existsSync(config.kit.files.assets)
-		? list_files({ config, dir: config.kit.files.assets, path: '' })
+		? list_files(config.kit.files.assets).map((file) => ({
+				file,
+				size: fs__default.statSync(`${config.kit.files.assets}/${file}`).size,
+				type: mime.getType(file)
+		  }))
 		: [];
 
 	const params_base = path__default.relative(cwd, config.kit.files.params);
@@ -336,8 +386,6 @@ function create_manifest_data({
 
 	return {
 		assets,
-		layout,
-		error,
 		components,
 		routes,
 		matchers
@@ -345,142 +393,162 @@ function create_manifest_data({
 }
 
 /**
- * @param {string} needle
- * @param {string} haystack
+ * @param {string} file
+ * @param {string} path
+ * @param {Tree} tree
+ * @param {string[]} extensions
  */
-function count_occurrences(needle, haystack) {
-	let count = 0;
-	for (let i = 0; i < haystack.length; i += 1) {
-		if (haystack[i] === needle) count += 1;
-	}
-	return count;
-}
-
-const spread_pattern = /\[\.{3}/;
+function trace(file, path, tree, extensions) {
+	/** @type {Array<string | undefined>} */
+	const layouts = [];
+
+	/** @type {Array<string | undefined>} */
+	const errors = [];
+
+	const parts = path.split('/');
+	const filename = /** @type {string} */ (parts.pop());
+	const extension = /** @type {string} */ (extensions.find((ext) => path.endsWith(ext)));
+	const base = filename.slice(0, -extension.length);
+
+	let layout_id = base.includes('@') ? base.split('@')[1] : DEFAULT;
+
+	// walk up the tree, find which __layout and __error components
+	// apply to this page
+	// eslint-disable-next-line
+	while (true) {
+		const node = tree.get(parts.join('/'));
+		const layout = node?.layouts[layout_id];
+
+		// any segment that has neither a __layout nor an __error can be discarded.
+		// in other words these...
+		//  layouts: [a, , b, c]
+		//  errors:  [d, , e,  ]
+		//
+		// ...can be compacted to these:
+		//  layouts: [a, b, c]
+		//  errors:  [d, e,  ]
+		if (node?.error || layout?.file) {
+			errors.unshift(node?.error);
+			layouts.unshift(layout?.file);
+		}
 
-/**
- * @param {Item} a
- * @param {Item} b
- */
-function comparator(a, b) {
-	if (a.is_index !== b.is_index) {
-		if (a.is_index) return spread_pattern.test(a.file) ? 1 : -1;
-		return spread_pattern.test(b.file) ? -1 : 1;
+		if (layout?.name.includes('@')) {
+			layout_id = layout.name.split('@')[1];
+		} else {
+			if (layout) layout_id = DEFAULT;
+			if (parts.length === 0) break;
+			parts.pop();
+		}
 	}
 
-	const max = Math.max(a.parts.length, b.parts.length);
+	if (layout_id !== DEFAULT) {
+		throw new Error(`${file} references missing layout "${layout_id}"`);
+	}
 
-	for (let i = 0; i < max; i += 1) {
-		const a_sub_part = a.parts[i];
-		const b_sub_part = b.parts[i];
+	// trim empty space off the end of the errors array
+	let i = errors.length;
+	while (i--) if (errors[i]) break;
+	errors.length = i + 1;
 
-		if (!a_sub_part) return 1; // b is more specific, so goes first
-		if (!b_sub_part) return -1;
+	return { layouts, errors };
+}
 
-		if (a_sub_part.rest && b_sub_part.rest) {
-			if (a.is_page !== b.is_page) {
-				return a.is_page ? 1 : -1;
+/**
+ * @param {Unit} a
+ * @param {Unit} b
+ */
+function compare(a, b) {
+	const max_segments = Math.max(a.segments.length, b.segments.length);
+	for (let i = 0; i < max_segments; i += 1) {
+		const sa = a.segments[i];
+		const sb = b.segments[i];
+
+		// /x < /x/y, but /[...x]/y < /[...x]
+		if (!sa) return a.id.includes('[...') ? +1 : -1;
+		if (!sb) return b.id.includes('[...') ? -1 : +1;
+
+		const max_parts = Math.max(sa.length, sb.length);
+		for (let i = 0; i < max_parts; i += 1) {
+			const pa = sa[i];
+			const pb = sb[i];
+
+			// xy < x[y], but [x].json < [x]
+			if (pa === undefined) return pb.dynamic ? -1 : +1;
+			if (pb === undefined) return pa.dynamic ? +1 : -1;
+
+			// x < [x]
+			if (pa.dynamic !== pb.dynamic) {
+				return pa.dynamic ? +1 : -1;
 			}
-			// sort alphabetically
-			return a_sub_part.content < b_sub_part.content ? -1 : 1;
-		}
-
-		// If one is ...rest order it later
-		if (a_sub_part.rest !== b_sub_part.rest) return a_sub_part.rest ? 1 : -1;
-
-		if (a_sub_part.dynamic !== b_sub_part.dynamic) {
-			return a_sub_part.dynamic ? 1 : -1;
-		}
 
-		if (a_sub_part.dynamic && !!a_sub_part.type !== !!b_sub_part.type) {
-			return a_sub_part.type ? -1 : 1;
-		}
+			if (pa.dynamic) {
+				// [x] < [...x]
+				if (pa.rest !== pb.rest) {
+					return pa.rest ? +1 : -1;
+				}
 
-		if (!a_sub_part.dynamic && a_sub_part.content !== b_sub_part.content) {
-			return (
-				b_sub_part.content.length - a_sub_part.content.length ||
-				(a_sub_part.content < b_sub_part.content ? -1 : 1)
-			);
+				// [x=type] < [x]
+				if (!!pa.type !== !!pb.type) {
+					return pa.type ? -1 : +1;
+				}
+			}
 		}
 	}
 
-	if (a.is_page !== b.is_page) {
-		return a.is_page ? 1 : -1;
+	const a_is_endpoint = !a.page && a.endpoint;
+	const b_is_endpoint = !b.page && b.endpoint;
+
+	if (a_is_endpoint !== b_is_endpoint) {
+		return a_is_endpoint ? -1 : +1;
 	}
 
-	// otherwise sort alphabetically
-	return a.file < b.file ? -1 : 1;
+	return a < b ? -1 : 1;
 }
 
 /**
- * @param {string} part
- * @param {string} file
+ * @param {string} needle
+ * @param {string} haystack
  */
-function get_parts(part, file) {
-	if (/\]\[/.test(part)) {
-		throw new Error(`Invalid route ${file} — parameters must be separated`);
-	}
-
-	if (count_occurrences('[', part) !== count_occurrences(']', part)) {
-		throw new Error(`Invalid route ${file} — brackets are unbalanced`);
+function count_occurrences(needle, haystack) {
+	let count = 0;
+	for (let i = 0; i < haystack.length; i += 1) {
+		if (haystack[i] === needle) count += 1;
 	}
-
-	/** @type {Part[]} */
-	const result = [];
-	part.split(/\[(.+?\(.+?\)|.+?)\]/).map((str, i) => {
-		if (!str) return;
-		const dynamic = i % 2 === 1;
-
-		const [, content, type] = dynamic
-			? /^((?:\.\.\.)?[a-zA-Z_][a-zA-Z0-9_]*)(?:=([a-zA-Z_][a-zA-Z0-9_]*))?$/.exec(str) || [
-					null,
-					null,
-					null
-			  ]
-			: [null, str, null];
-
-		if (!content) {
-			throw new Error(
-				`Invalid route ${file} — parameter name and type must match /^[a-zA-Z_][a-zA-Z0-9_]*$/`
-			);
-		}
-
-		result.push({
-			content,
-			dynamic,
-			rest: dynamic && /^\.{3}.+$/.test(content),
-			type
-		});
-	});
-
-	return result;
+	return count;
 }
 
 /**
- * @param {{
- *  config: import('types').ValidatedConfig;
- * 	dir: string;
- * 	path: string;
- * 	files?: import('types').Asset[]
- * }} args
+ * @param {string} dir
+ * @param {string} [path]
+ * @param {string[]} [files]
  */
-function list_files({ config, dir, path, files = [] }) {
-	fs__default.readdirSync(dir).forEach((file) => {
-		const full = `${dir}/${file}`;
-
-		const stats = fs__default.statSync(full);
-		const joined = path ? `${path}/${file}` : file;
-
-		if (stats.isDirectory()) {
-			list_files({ config, dir: full, path: joined, files });
-		} else if (config.kit.serviceWorker.files(joined)) {
-			files.push({
-				file: joined,
-				size: stats.size,
-				type: mime.getType(joined)
-			});
-		}
-	});
+function list_files(dir, path = '', files = []) {
+	fs__default.readdirSync(dir, { withFileTypes: true })
+		.sort(({ name: a }, { name: b }) => {
+			// sort each directory in (__layout, __error, everything else) order
+			// so that we can trace layouts/errors immediately
+
+			if (a.startsWith('__layout')) {
+				if (!b.startsWith('__layout')) return -1;
+			} else if (b.startsWith('__layout')) {
+				return 1;
+			} else if (a.startsWith('__')) {
+				if (!b.startsWith('__')) return -1;
+			} else if (b.startsWith('__')) {
+				return 1;
+			}
+
+			return a < b ? -1 : 1;
+		})
+		.forEach((file) => {
+			const joined = path ? `${path}/${file.name}` : file.name;
+
+			if (file.isDirectory()) {
+				list_files(`${dir}/${file.name}`, joined, files);
+			} else {
+				files.push(joined);
+			}
+		});
 
 	return files;
 }
@@ -549,7 +617,7 @@ function write_manifest(manifest_data, base, output) {
 			.join(',\n\t\t\t\t\t')}
 	]`.replace(/^\t/gm, '');
 
-	/** @param {string[]} parts */
+	/** @param {Array<string | undefined>} parts */
 	const get_indices = (parts) =>
 		`[${parts.map((part) => (part ? component_indexes[part] : '')).join(', ')}]`;
 
@@ -833,21 +901,6 @@ function write_types(config, manifest_data) {
 	/** @type {Map<string, { params: string[], type: 'page' | 'endpoint' | 'both' }>} */
 	const shadow_types = new Map();
 
-	/** @param {string} key */
-	function extract_params(key) {
-		/** @type {string[]} */
-		const params = [];
-
-		const pattern = /\[(?:\.{3})?([^\]]+)\]/g;
-		let match;
-
-		while ((match = pattern.exec(key))) {
-			params.push(match[1]);
-		}
-
-		return params;
-	}
-
 	manifest_data.routes.forEach((route) => {
 		const file = route.type === 'endpoint' ? route.file : route.shadow;
 
@@ -857,7 +910,7 @@ function write_types(config, manifest_data) {
 			);
 			const key = file.slice(0, -ext.length);
 			shadow_types.set(key, {
-				params: extract_params(key),
+				params: parse_route_id(key).names,
 				type: route.type === 'endpoint' ? 'endpoint' : 'both'
 			});
 		}
@@ -870,7 +923,7 @@ function write_types(config, manifest_data) {
 		const key = component.slice(0, -ext.length);
 
 		if (!shadow_types.has(key)) {
-			shadow_types.set(key, { params: extract_params(key), type: 'page' });
+			shadow_types.set(key, { params: parse_route_id(key).names, type: 'page' });
 		}
 	});
 

package/dist/cli.js

@@ -853,8 +853,9 @@ function handle_error(e) {
 /**
  * @param {number} port
  * @param {boolean} https
+ * @param {string} base
  */
-async function launch(port, https) {
+async function launch(port, https, base) {
 	const { exec } = await import('child_process');
 	let cmd = 'open';
 	if (process.platform == 'win32') {
@@ -866,10 +867,10 @@ async function launch(port, https) {
 			cmd = 'xdg-open';
 		}
 	}
-	exec(`${cmd} ${https ? 'https' : 'http'}://localhost:${port}`);
+	exec(`${cmd} ${https ? 'https' : 'http'}://localhost:${port}${base}`);
 }
 
-const prog = sade('svelte-kit').version('1.0.0-next.304');
+const prog = sade('svelte-kit').version('1.0.0-next.307');
 
 prog
 	.command('dev')
@@ -903,6 +904,7 @@ prog
 				host: address_info.address,
 				https: !!(https || server_config.https),
 				open: open || !!server_config.open,
+				base: config.kit.paths.base,
 				loose: server_config.fs.strict === false,
 				allow: server_config.fs.allow,
 				cwd
@@ -970,7 +972,7 @@ prog
 
 			await preview({ port, host, config, https });
 
-			welcome({ port, host, https, open });
+			welcome({ port, host, https, open, base: config.kit.paths.base });
 		} catch (error) {
 			handle_error(error);
 		}
@@ -979,7 +981,6 @@ prog
 prog
 	.command('package')
 	.describe('Create a package')
-	.option('-d, --dir', 'Destination directory', 'package')
 	.action(async () => {
 		try {
 			const config = await load_config();
@@ -1039,15 +1040,16 @@ async function check_port(port) {
  *   host: string;
  *   https: boolean;
  *   port: number;
+ *   base: string;
  *   loose?: boolean;
  *   allow?: string[];
  *   cwd?: string;
  * }} param0
  */
-function welcome({ port, host, https, open, loose, allow, cwd }) {
-	if (open) launch(port, https);
+function welcome({ port, host, https, open, base, loose, allow, cwd }) {
+	if (open) launch(port, https, base);
 
-	console.log($.bold().cyan(`\n  SvelteKit v${'1.0.0-next.304'}\n`));
+	console.log($.bold().cyan(`\n  SvelteKit v${'1.0.0-next.307'}\n`));
 
 	const protocol = https ? 'https:' : 'http:';
 	const exposed = typeof host !== 'undefined' && host !== 'localhost' && host !== '127.0.0.1';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sveltejs/kit",
-  "version": "1.0.0-next.304",
+  "version": "1.0.0-next.307",
   "repository": {
     "type": "git",
     "url": "https://github.com/sveltejs/kit",
@@ -15,7 +15,7 @@
     "vite": "^2.9.0"
   },
   "devDependencies": {
-    "@playwright/test": "^1.19.1",
+    "@playwright/test": "^1.20.2",
     "@rollup/plugin-replace": "^4.0.0",
     "@types/amphtml-validator": "^1.0.1",
     "@types/cookie": "^0.4.1",

package/types/index.d.ts

@@ -184,7 +184,7 @@ export interface HandleError {
 }
 
 /**
- * The type of a `load` function exported from `<script context="module">` in a page or layout.
+ * The `(input: LoadInput) => LoadOutput` `load` function exported from `<script context="module">` in a page or layout.
  *
  * Note that you can use [generated types](/docs/types#generated-types) instead of manually specifying the Params generic argument.
  */
@@ -215,26 +215,22 @@ export interface ParamMatcher {
 }
 
 /**
- * A function exported from an endpoint that corresponds to an
- * HTTP verb (`get`, `put`, `patch`, etc) and handles requests with
- * that method. Note that since 'delete' is a reserved word in
- * JavaScript, delete handles are called `del` instead.
+ * A `(event: RequestEvent) => RequestHandlerOutput` function exported from an endpoint that corresponds to an HTTP verb (`get`, `put`, `patch`, etc) and handles requests with that method. Note that since 'delete' is a reserved word in JavaScript, delete handles are called `del` instead.
  *
- * Note that you can use [generated types](/docs/types#generated-types)
- * instead of manually specifying the `Params` generic argument.
+ * Note that you can use [generated types](/docs/types#generated-types) instead of manually specifying the `Params` generic argument.
  */
 export interface RequestHandler<
 	Params extends Record<string, string> = Record<string, string>,
 	Output extends ResponseBody = ResponseBody
 > {
-	(event: RequestEvent<Params>): RequestHandlerOutput<Output>;
+	(event: RequestEvent<Params>): MaybePromise<RequestHandlerOutput<Output>>;
 }
 
-export type RequestHandlerOutput<Output extends ResponseBody = ResponseBody> = MaybePromise<{
+export interface RequestHandlerOutput<Output extends ResponseBody = ResponseBody> {
 	status?: number;
 	headers?: Headers | Partial<ResponseHeaders>;
 	body?: Output;
-}>;
+}
 
 export type ResponseBody = JSONValue | Uint8Array | ReadableStream | import('stream').Readable;
 

package/types/internal.d.ts

@@ -101,8 +101,6 @@ export class InternalServer extends Server {
 
 export interface ManifestData {
 	assets: Asset[];
-	layout: string;
-	error: string;
 	components: string[];
 	routes: RouteData[];
 	matchers: Record<string, string>;
@@ -128,8 +126,8 @@ export interface PageData {
 	shadow: string | null;
 	pattern: RegExp;
 	path: string;
-	a: string[];
-	b: string[];
+	a: Array<string | undefined>;
+	b: Array<string | undefined>;
 }
 
 export type PayloadScriptAttributes =
@@ -285,12 +283,12 @@ export interface SSRPage {
 	/**
 	 * plan a is to render 1 or more layout components followed by a leaf component.
 	 */
-	a: number[];
+	a: Array<number | undefined>;
 	/**
 	 * plan b — if one of them components fails in `load` we backtrack until we find
 	 * the nearest error component.
 	 */
-	b: number[];
+	b: Array<number | undefined>;
 }
 
 export interface SSRPagePart {