@sveltejs/kit 1.0.0-next.403 → 1.0.0-next.407

package/src/core/sync/utils.js

@@ -0,0 +1,97 @@
+import fs from 'fs';
+import path from 'path';
+import { mkdirp } from '../../utils/filesystem.js';
+
+/** @type {Map<string, string>} */
+const previous_contents = new Map();
+
+/**
+ * @param {string} file
+ * @param {string} code
+ */
+export function write_if_changed(file, code) {
+	if (code !== previous_contents.get(file)) {
+		write(file, code);
+	}
+}
+
+/**
+ * @param {string} file
+ * @param {string} code
+ */
+export function write(file, code) {
+	previous_contents.set(file, code);
+	mkdirp(path.dirname(file));
+	fs.writeFileSync(file, code);
+}
+
+/**
+ * @param {(file: string) => boolean} should_remove
+ */
+export function remove_from_previous(should_remove) {
+	for (const key of previous_contents.keys()) {
+		if (should_remove(key)) {
+			previous_contents.delete(key);
+		}
+	}
+}
+
+/** @param {string} str */
+export function trim(str) {
+	const indentation = /** @type {RegExpExecArray} */ (/\n?(\s*)/.exec(str))[1];
+	const pattern = new RegExp(`^${indentation}`, 'gm');
+	return str.replace(pattern, '').trim();
+}
+
+export const reserved = new Set([
+	'do',
+	'if',
+	'in',
+	'for',
+	'let',
+	'new',
+	'try',
+	'var',
+	'case',
+	'else',
+	'enum',
+	'eval',
+	'null',
+	'this',
+	'true',
+	'void',
+	'with',
+	'await',
+	'break',
+	'catch',
+	'class',
+	'const',
+	'false',
+	'super',
+	'throw',
+	'while',
+	'yield',
+	'delete',
+	'export',
+	'import',
+	'public',
+	'return',
+	'static',
+	'switch',
+	'typeof',
+	'default',
+	'extends',
+	'finally',
+	'package',
+	'private',
+	'continue',
+	'debugger',
+	'function',
+	'arguments',
+	'interface',
+	'protected',
+	'implements',
+	'instanceof'
+]);
+
+export const valid_identifier = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/;

package/src/core/sync/write_ambient.js

@@ -0,0 +1,87 @@
+import path from 'path';
+import colors from 'kleur';
+import { get_env } from '../../vite/utils.js';
+import { write_if_changed, reserved, valid_identifier } from './utils.js';
+
+const autogen_comment = '// this file is generated — do not edit it\n';
+const types_reference = '/// <reference types="@sveltejs/kit" />\n\n';
+
+/**
+ * Writes ambient declarations including types reference to @sveltejs/kit,
+ * and the existing environment variables in process.env to
+ * $env/static/private and $env/static/public
+ * @param {import('types').ValidatedKitConfig} config
+ * @param {string} mode The Vite mode
+ */
+export function write_ambient(config, mode) {
+	const env = get_env(mode, config.env.publicPrefix);
+
+	// TODO when testing src, `$app` points at `src/runtime/app`... will
+	// probably need to fiddle with aliases
+	write_if_changed(
+		path.join(config.outDir, 'runtime/env/static/public.js'),
+		create_env_module('$env/static/public', env.public)
+	);
+
+	write_if_changed(
+		path.join(config.outDir, 'runtime/env/static/private.js'),
+		create_env_module('$env/static/private', env.private)
+	);
+
+	write_if_changed(
+		path.join(config.outDir, 'ambient.d.ts'),
+		autogen_comment +
+			types_reference +
+			create_env_types('$env/static/public', env.public) +
+			'\n\n' +
+			create_env_types('$env/static/private', env.private)
+	);
+}
+
+/**
+ * @param {string} id
+ * @param {Record<string, string>} env
+ * @returns {string}
+ */
+function create_env_module(id, env) {
+	/** @type {string[]} */
+	const declarations = [];
+
+	for (const key in env) {
+		const warning = !valid_identifier.test(key)
+			? 'not a valid identifier'
+			: reserved.has(key)
+			? 'a reserved word'
+			: null;
+
+		if (warning) {
+			console.error(
+				colors
+					.bold()
+					.yellow(`Omitting environment variable "${key}" from ${id} as it is ${warning}`)
+			);
+			continue;
+		}
+
+		const comment = `/** @type {import('${id}').${key}} */`;
+		const declaration = `export const ${key} = ${JSON.stringify(env[key])};`;
+
+		declarations.push(`${comment}\n${declaration}`);
+	}
+
+	return autogen_comment + declarations.join('\n\n');
+}
+
+/**
+ * @param {string} id
+ * @param {Record<string, string>} env
+ * @returns {string}
+ */
+function create_env_types(id, env) {
+	const declarations = Object.keys(env)
+		.filter((k) => valid_identifier.test(k))
+		.map((k) => `\texport const ${k}: string;`)
+		.join('\n');
+
+	return `declare module '${id}' {\n${declarations}\n}`;
+}

package/src/core/sync/write_client_manifest.js

@@ -0,0 +1,82 @@
+import { relative } from 'path';
+import { s } from '../../utils/misc.js';
+import { trim, write_if_changed } from './utils.js';
+
+/**
+ * Writes the client manifest to disk. The manifest is used to power the router. It contains the
+ * list of routes and corresponding Svelte components (i.e. pages and layouts).
+ * @param {import('types').ManifestData} manifest_data
+ * @param {string} output
+ */
+export function write_client_manifest(manifest_data, output) {
+	/** @type {Map<import('types').PageNode, number>} */
+	const node_indexes = new Map();
+
+	/**
+	 * Creates a module that exports a `CSRPageNode`
+	 * @param {import('types').PageNode} node
+	 */
+	function generate_node(node) {
+		const declarations = [];
+
+		if (node.shared) {
+			declarations.push(
+				`import * as shared from ${s(relative(`${output}/nodes`, node.shared))};`,
+				`export { shared };`
+			);
+		}
+
+		if (node.component) {
+			declarations.push(
+				`export { default as component } from ${s(relative(`${output}/nodes`, node.component))};`
+			);
+		}
+
+		if (node.server) {
+			declarations.push(`export const server = true;`);
+		}
+
+		return declarations.join('\n');
+	}
+
+	const nodes = manifest_data.nodes
+		.map((node, i) => {
+			node_indexes.set(node, i);
+			write_if_changed(`${output}/nodes/${i}.js`, generate_node(node));
+			return `() => import('./nodes/${i}')`;
+		})
+		.join(',\n\t');
+
+	const dictionary = `{
+		${manifest_data.routes
+			.map((route) => {
+				if (route.type === 'page') {
+					const errors = route.errors.map((node) => (node ? node_indexes.get(node) : '')).join(',');
+					const layouts = route.layouts
+						.map((node) => (node ? node_indexes.get(node) : ''))
+						.join(',');
+					const leaf = route.leaf ? node_indexes.get(route.leaf) : '';
+
+					const uses_server_data = [...route.layouts, route.leaf].some((node) => node?.server);
+					const suffix = uses_server_data ? ', 1' : '';
+
+					return `${s(route.id)}: [[${errors}], [${layouts}], ${leaf}${suffix}]`;
+				}
+			})
+			.filter(Boolean)
+			.join(',\n\t\t')}
+	}`.replace(/^\t/gm, '');
+
+	write_if_changed(
+		`${output}/client-manifest.js`,
+		trim(`
+			export { matchers } from './client-matchers.js';
+
+			export const nodes = [
+				${nodes}
+			];
+
+			export const dictionary = ${dictionary};
+		`)
+	);
+}

package/src/core/sync/write_matchers.js

@@ -0,0 +1,25 @@
+import path from 'path';
+import { s } from '../../utils/misc.js';
+import { write_if_changed } from './utils.js';
+
+/**
+ * @param {import('types').ManifestData} manifest_data
+ * @param {string} output
+ */
+export function write_matchers(manifest_data, output) {
+	const imports = [];
+	const matchers = [];
+
+	for (const key in manifest_data.matchers) {
+		const src = manifest_data.matchers[key];
+
+		imports.push(`import { match as ${key} } from ${s(path.relative(output, src))};`);
+		matchers.push(key);
+	}
+
+	const module = imports.length
+		? `${imports.join('\n')}\n\nexport const matchers = { ${matchers.join(', ')} };`
+		: 'export const matchers = {};';
+
+	write_if_changed(`${output}/client-matchers.js`, module);
+}

package/src/core/sync/write_root.js

@@ -0,0 +1,88 @@
+import { trim, write_if_changed } from './utils.js';
+
+/**
+ * @param {import('types').ManifestData} manifest_data
+ * @param {string} output
+ */
+export function write_root(manifest_data, output) {
+	// TODO remove default layout altogether
+
+	const max_depth = Math.max(
+		...manifest_data.routes.map((route) =>
+			route.type === 'page' ? route.layouts.filter(Boolean).length + 1 : 0
+		),
+		1
+	);
+
+	const levels = [];
+	for (let i = 0; i <= max_depth; i += 1) {
+		levels.push(i);
+	}
+
+	let l = max_depth;
+
+	let pyramid = `<svelte:component this={components[${l}]} data={data_${l}}/>`;
+
+	while (l--) {
+		pyramid = `
+			{#if components[${l + 1}]}
+				<svelte:component this={components[${l}]} data={data_${l}}>
+					${pyramid.replace(/\n/g, '\n\t\t\t\t\t')}
+				</svelte:component>
+			{:else}
+				<svelte:component this={components[${l}]} data={data_${l}} {errors} />
+			{/if}
+		`
+			.replace(/^\t\t\t/gm, '')
+			.trim();
+	}
+
+	write_if_changed(
+		`${output}/root.svelte`,
+		trim(`
+			<!-- This file is generated by @sveltejs/kit — do not edit it! -->
+			<script>
+				import { setContext, afterUpdate, onMount } from 'svelte';
+
+				// stores
+				export let stores;
+				export let page;
+
+				export let components;
+				${levels.map((l) => `export let data_${l} = null;`).join('\n\t\t\t\t')}
+				export let errors;
+
+				setContext('__svelte__', stores);
+
+				$: stores.page.set(page);
+				afterUpdate(stores.page.notify);
+
+				let mounted = false;
+				let navigated = false;
+				let title = null;
+
+				onMount(() => {
+					const unsubscribe = stores.page.subscribe(() => {
+						if (mounted) {
+							navigated = true;
+							title = document.title || 'untitled page';
+						}
+					});
+
+					mounted = true;
+					return unsubscribe;
+				});
+			</script>
+
+			${pyramid.replace(/\n/g, '\n\t\t\t')}
+
+			{#if mounted}
+				<div id="svelte-announcer" aria-live="assertive" aria-atomic="true" style="position: absolute; left: 0; top: 0; clip: rect(0 0 0 0); clip-path: inset(50%); overflow: hidden; white-space: nowrap; width: 1px; height: 1px">
+					{#if navigated}
+						{title}
+					{/if}
+				</div>
+			{/if}
+		`)
+	);
+}

package/{dist/chunks → src/core/sync}/write_tsconfig.js

@@ -1,98 +1,16 @@
-import fs__default from 'fs';
-import path__default from 'path';
-import { $ } from './index.js';
-import { m as mkdirp, p as posixify } from './filesystem.js';
-
-/** @type {Map<string, string>} */
-const previous_contents = new Map();
-
-/**
- * @param {string} file
- * @param {string} code
- */
-function write_if_changed(file, code) {
-	if (code !== previous_contents.get(file)) {
-		write(file, code);
-	}
-}
-
-/**
- * @param {string} file
- * @param {string} code
- */
-function write(file, code) {
-	previous_contents.set(file, code);
-	mkdirp(path__default.dirname(file));
-	fs__default.writeFileSync(file, code);
-}
-
-/** @param {string} str */
-function trim(str) {
-	const indentation = /** @type {RegExpExecArray} */ (/\n?(\s*)/.exec(str))[1];
-	const pattern = new RegExp(`^${indentation}`, 'gm');
-	return str.replace(pattern, '').trim();
-}
-
-const reserved = new Set([
-	'do',
-	'if',
-	'in',
-	'for',
-	'let',
-	'new',
-	'try',
-	'var',
-	'case',
-	'else',
-	'enum',
-	'eval',
-	'null',
-	'this',
-	'true',
-	'void',
-	'with',
-	'await',
-	'break',
-	'catch',
-	'class',
-	'const',
-	'false',
-	'super',
-	'throw',
-	'while',
-	'yield',
-	'delete',
-	'export',
-	'import',
-	'public',
-	'return',
-	'static',
-	'switch',
-	'typeof',
-	'default',
-	'extends',
-	'finally',
-	'package',
-	'private',
-	'continue',
-	'debugger',
-	'function',
-	'arguments',
-	'interface',
-	'protected',
-	'implements',
-	'instanceof'
-]);
-
-const valid_identifier = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/;
+import fs from 'fs';
+import path from 'path';
+import colors from 'kleur';
+import { posixify } from '../../utils/filesystem.js';
+import { write_if_changed } from './utils.js';
 
 /**
  * @param {string} cwd
  * @param {string} file
  */
 function maybe_file(cwd, file) {
-	const resolved = path__default.resolve(cwd, file);
-	if (fs__default.existsSync(resolved)) {
+	const resolved = path.resolve(cwd, file);
+	if (fs.existsSync(resolved)) {
 		return resolved;
 	}
 }
@@ -101,7 +19,7 @@ function maybe_file(cwd, file) {
  * @param {string} file
  */
 function project_relative(file) {
-	return posixify(path__default.relative('.', file));
+	return posixify(path.relative('.', file));
 }
 
 /**
@@ -119,18 +37,18 @@ function remove_trailing_slashstar(file) {
  * Writes the tsconfig that the user's tsconfig inherits from.
  * @param {import('types').ValidatedKitConfig} config
  */
-function write_tsconfig(config, cwd = process.cwd()) {
-	const out = path__default.join(config.outDir, 'tsconfig.json');
+export function write_tsconfig(config, cwd = process.cwd()) {
+	const out = path.join(config.outDir, 'tsconfig.json');
 	const user_file = maybe_file(cwd, 'tsconfig.json') || maybe_file(cwd, 'jsconfig.json');
 
 	if (user_file) validate(config, cwd, out, user_file);
 
 	/** @param {string} file */
-	const config_relative = (file) => posixify(path__default.relative(config.outDir, file));
+	const config_relative = (file) => posixify(path.relative(config.outDir, file));
 
 	const include = ['ambient.d.ts'];
 	for (const dir of [config.files.routes, config.files.lib]) {
-		const relative = project_relative(path__default.dirname(dir));
+		const relative = project_relative(path.dirname(dir));
 		include.push(config_relative(`${relative}/**/*.js`));
 		include.push(config_relative(`${relative}/**/*.ts`));
 		include.push(config_relative(`${relative}/**/*.svelte`));
@@ -180,44 +98,44 @@ function write_tsconfig(config, cwd = process.cwd()) {
  */
 function validate(config, cwd, out, user_file) {
 	// we have to eval the file, since it's not parseable as JSON (contains comments)
-	const user_tsconfig_json = fs__default.readFileSync(user_file, 'utf-8');
+	const user_tsconfig_json = fs.readFileSync(user_file, 'utf-8');
 	const user_tsconfig = (0, eval)(`(${user_tsconfig_json})`);
 
 	// we need to check that the user's tsconfig extends the framework config
 	const extend = user_tsconfig.extends;
-	const extends_framework_config = extend && path__default.resolve(cwd, extend) === out;
+	const extends_framework_config = extend && path.resolve(cwd, extend) === out;
 
-	const kind = path__default.basename(user_file);
+	const kind = path.basename(user_file);
 
 	if (extends_framework_config) {
 		const { paths: user_paths } = user_tsconfig.compilerOptions || {};
 
-		if (user_paths && fs__default.existsSync(config.files.lib)) {
+		if (user_paths && fs.existsSync(config.files.lib)) {
 			/** @type {string[]} */
 			const lib = user_paths['$lib'] || [];
 			/** @type {string[]} */
 			const lib_ = user_paths['$lib/*'] || [];
 
 			const missing_lib_paths =
-				!lib.some((relative) => path__default.resolve(cwd, relative) === config.files.lib) ||
-				!lib_.some((relative) => path__default.resolve(cwd, relative) === path__default.join(config.files.lib, '/*'));
+				!lib.some((relative) => path.resolve(cwd, relative) === config.files.lib) ||
+				!lib_.some((relative) => path.resolve(cwd, relative) === path.join(config.files.lib, '/*'));
 
 			if (missing_lib_paths) {
 				console.warn(
-					$
+					colors
 						.bold()
 						.yellow(`Your compilerOptions.paths in ${kind} should include the following:`)
 				);
-				const relative = posixify(path__default.relative('.', config.files.lib));
+				const relative = posixify(path.relative('.', config.files.lib));
 				console.warn(`{\n  "$lib":["${relative}"],\n  "$lib/*":["${relative}/*"]\n}`);
 			}
 		}
 	} else {
-		let relative = posixify(path__default.relative('.', out));
+		let relative = posixify(path.relative('.', out));
 		if (!relative.startsWith('./')) relative = './' + relative;
 
 		console.warn(
-			$.bold().yellow(`Your ${kind} should extend the configuration generated by SvelteKit:`)
+			colors.bold().yellow(`Your ${kind} should extend the configuration generated by SvelteKit:`)
 		);
 		console.warn(`{\n  "extends": "${relative}"\n}`);
 	}
@@ -234,11 +152,11 @@ const value_regex = /^(.*?)((\/\*)|(\.\w+))?$/;
  *
  * @param {import('types').ValidatedKitConfig} config
  */
-function get_tsconfig_paths(config) {
+export function get_tsconfig_paths(config) {
 	const alias = {
 		...config.alias
 	};
-	if (fs__default.existsSync(project_relative(config.files.lib))) {
+	if (fs.existsSync(project_relative(config.files.lib))) {
 		alias['$lib'] = project_relative(config.files.lib);
 	}
 
@@ -269,5 +187,3 @@ function get_tsconfig_paths(config) {
 
 	return paths;
 }
-
-export { write as a, write_tsconfig as b, reserved as r, trim as t, valid_identifier as v, write_if_changed as w };