@monimesl/dot-simulator 0.1.0-alpha.2 → 0.1.0-alpha.4

package/dist/node/index.js

@@ -1,8 +1,11 @@
 import { createRequire } from "node:module";
-import { HostError, NavigationStack, REACT_HOST_PATH, isReactCompatible, isVersionAtLeast, majorVersion, newestReactOfMajor } from "@monimesl/dot-core";
-import { readFile, readdir, stat } from "node:fs/promises";
-import { createServer } from "node:http";
-import { dirname, extname, join, resolve, sep } from "node:path";
+import { HostError, NavigationStack, REACT_HOST_PATH, allowsHost, dotFilePathProblem, isReactCompatible, isVersionAtLeast, majorVersion, newestReactOfMajor } from "@monimesl/dot-core";
+import { appendFile, cp, lstat, mkdir, mkdtemp, open, readFile, readdir, realpath, rename, rm, stat, writeFile } from "node:fs/promises";
+import { tmpdir } from "node:os";
+import { STATUS_CODES, createServer } from "node:http";
+import { basename, dirname, extname, join, resolve, sep } from "node:path";
+import { TextDecoder } from "node:util";
+import { randomBytes } from "node:crypto";
 //#region src/compatibility.ts
 var IncompatibleDotError = class extends Error {
 	name = "IncompatibleDotError";
@@ -138,7 +141,7 @@ var PermissionGate = class {
 };
 //#endregion
 //#region src/host.ts
-function startHost({ logic, ui, manifest, dashVersion, minRuntimeVersion, systemContext, handlers = {}, askPermission, observe }) {
+function startHost({ logic, ui, manifest, dashVersion, minRuntimeVersion, systemContext, handlers = {}, askPermission, observe, restorePages = [], onBarsChange }) {
 	checkCompatibility(manifest, {
 		dashVersion,
 		minRuntimeVersion
@@ -158,6 +161,18 @@ function startHost({ logic, ui, manifest, dashVersion, minRuntimeVersion, system
 		ui.post(message);
 		logic.post(message);
 	};
+	const barsByInstance = /* @__PURE__ */ new Map();
+	const showBars = () => {
+		const top = stack.top;
+		const bars = top && barsByInstance.get(top.instanceId);
+		onBarsChange?.({
+			title: bars?.navigationBar.title ?? manifest.name,
+			navigationBarHidden: bars?.navigationBar.hidden ?? false,
+			navigationBarColor: bars?.navigationBar.backgroundColor,
+			navigationBarTextColor: bars?.navigationBar.textColor,
+			tabBarHidden: bars?.tabBar.hidden ?? false
+		}, stack.pages);
+	};
 	const syncStack = () => {
 		const message = {
 			type: "syncStack",
@@ -167,6 +182,9 @@ function startHost({ logic, ui, manifest, dashVersion, minRuntimeVersion, system
 			}
 		};
 		broadcast(message);
+		const open = new Set(stack.pages.map((entry) => entry.instanceId));
+		for (const instanceId of barsByInstance.keys()) if (!open.has(instanceId)) barsByInstance.delete(instanceId);
+		showBars();
 	};
 	const syncSystemContext = () => {
 		broadcast({
@@ -182,13 +200,40 @@ function startHost({ logic, ui, manifest, dashVersion, minRuntimeVersion, system
 		if (stack.top !== previousTop) calls.dismissUI();
 		return true;
 	};
+	const openFirstPages = () => {
+		const [first, ...rest] = restorePages.filter((entry) => manifest.pages.includes(entry.page));
+		if (!first) {
+			navigate({
+				action: "reset",
+				page: manifest.entry,
+				options: {}
+			});
+			return;
+		}
+		stack.apply({
+			action: "reset",
+			page: first.page,
+			options: first.options
+		});
+		for (const entry of rest) stack.apply({
+			action: "push",
+			page: entry.page,
+			options: entry.options
+		});
+		syncStack();
+	};
 	const navigateFromPage = ({ from, ...navigation }) => {
 		if (from === stack.top?.instanceId) navigate(navigation);
 	};
 	const hostMessageHandlers = /* @__PURE__ */ new Map([
 		["navigate", (payload) => navigateFromPage(payload)],
 		["hostCall", (payload) => calls.run(payload)],
-		["hostCancel", (payload) => calls.cancel(payload.id)]
+		["hostCancel", (payload) => calls.cancel(payload.id)],
+		["pageBars", (payload) => {
+			const { instanceId, ...bars } = payload;
+			barsByInstance.set(instanceId, bars);
+			showBars();
+		}]
 	]);
 	const stopService = logic.listen((raw) => {
 		const message = raw;
@@ -207,14 +252,13 @@ function startHost({ logic, ui, manifest, dashVersion, minRuntimeVersion, system
 		logic.post(message);
 		if (message.type === "connect") {
 			syncSystemContext();
-			navigate({
-				action: "reset",
-				page: manifest.entry,
-				options: {}
-			});
+			openFirstPages();
 		}
 	});
 	return {
+		get pages() {
+			return stack.pages;
+		},
 		back: () => navigate({
 			action: "back",
 			delta: 1
@@ -241,6 +285,8 @@ const SIMULATOR_VERSIONS = {
 //#region src/paths.ts
 const CLIENT_PATH = "/__dot/";
 const EVENTS_PATH = `${CLIENT_PATH}events`;
+const HTTP_PATH = `${CLIENT_PATH}network/http/`;
+const FILE_PATH = `${CLIENT_PATH}file/`;
 const WEBVIEW_URL = `/dot/ui/index.html`;
 //#endregion
 //#region src/page.ts
@@ -274,7 +320,14 @@ function simulatorPage(appName) {
             <span class="island"></span>
             <span class="indicators">${STATUS_ICONS}</span>
           </div>
+          <nav class="navigation-bar">
+            <button id="navigation-back" type="button" aria-label="Back" hidden>${BACK_ICON}</button>
+            <span id="navigation-title">${escapeHtml(appName)}</span>
+          </nav>
           <iframe id="screen" title="${escapeHtml(appName)}"></iframe>
+          <nav class="tab-bar" aria-label="Dash's tabs">
+            <span>Home</span><span class="current">Dots</span><span>Me</span>
+          </nav>
           <span class="home-indicator"></span>
         </div>
       </section>
@@ -291,6 +344,7 @@ function simulatorPage(appName) {
 </html>
 `;
 }
+const BACK_ICON = `<svg width="12" height="20" viewBox="0 0 12 20" aria-hidden="true"><path d="M10 2 2 10l8 8" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg>`;
 const STATUS_ICONS = `<svg class="torch" width="10" height="14" viewBox="0 0 10 14" aria-label="Torch on"><path d="M0 0h10v3L7.5 6v7a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1V6L0 3Z" fill="#ffd60a"/></svg><svg width="18" height="12" viewBox="0 0 18 12" fill="currentColor" aria-hidden="true"><rect x="0" y="8" width="3" height="4" rx="1"/><rect x="5" y="5.5" width="3" height="6.5" rx="1"/><rect x="10" y="3" width="3" height="9" rx="1"/><rect x="15" y="0" width="3" height="12" rx="1"/></svg><svg width="16" height="12" viewBox="0 0 16 12" fill="currentColor" aria-hidden="true"><path d="M8 2.2c2.3 0 4.4.9 6 2.4l1.2-1.3A10.4 10.4 0 0 0 8 .4 10.4 10.4 0 0 0 .8 3.3L2 4.6a8.6 8.6 0 0 1 6-2.4Zm0 3.6c1.3 0 2.5.5 3.5 1.3l1.2-1.3A6.9 6.9 0 0 0 8 4a6.9 6.9 0 0 0-4.7 1.8l1.2 1.3A5.1 5.1 0 0 1 8 5.8Zm0 3.6c-.5 0-1 .2-1.3.5L8 11.4l1.3-1.5c-.3-.3-.8-.5-1.3-.5Z"/></svg><svg width="27" height="13" viewBox="0 0 27 13" aria-hidden="true"><rect x="0.5" y="0.5" width="23" height="12" rx="3.5" fill="none" stroke="currentColor" opacity="0.4"/><rect x="2" y="2" width="20" height="9" rx="2" fill="currentColor"/><path d="M25 4.5v4c.8-.3 1.3-1.1 1.3-2s-.5-1.7-1.3-2Z" fill="currentColor" opacity="0.4"/></svg>`;
 const STYLES = `
   :root {
@@ -329,7 +383,16 @@ const STYLES = `
   .dialog-actions.stacked button + button { border-left: 0; border-top: 1px solid var(--dialog-line); }
   .dialog-actions .cancel { font-weight: 600; }
   .dialog-actions .destructive { color: #ff3b30; }
-  .status-bar { flex: none; position: relative; height: 54px; display: flex; align-items: center; justify-content: space-between; padding: 0 30px 0 50px; color: var(--screen-text); font: 600 17px/1 system-ui, sans-serif; }
+  /* Stand-ins for Dash's own bars, which the dot's pages may set. */
+  .phone { --bar: var(--screen); --bar-text: var(--screen-text); }
+  .navigation-bar { flex: none; position: relative; height: 44px; display: flex; align-items: center; justify-content: center; padding: 0 48px; background: var(--bar); color: var(--bar-text); font: 600 17px/1 system-ui, sans-serif; }
+  #navigation-title { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
+  #navigation-back { position: absolute; left: 8px; top: 0; bottom: 0; padding: 0 10px; border: 0; background: none; color: inherit; }
+  .tab-bar { flex: none; display: flex; justify-content: space-around; padding: 10px 0 30px; border-top: 1px solid rgb(128 128 128 / 0.3); background: var(--screen); color: var(--screen-text); opacity: 0.9; font: 500 11px/1 system-ui, sans-serif; }
+  .tab-bar .current { font-weight: 700; }
+  .navigation-bar[hidden], .tab-bar[hidden] { display: none; }
+  .phone:has(.navigation-bar[hidden]) .status-bar { background: var(--screen); color: var(--screen-text); }
+  .status-bar { flex: none; position: relative; height: 54px; display: flex; align-items: center; justify-content: space-between; padding: 0 30px 0 50px; background: var(--bar); color: var(--bar-text); font: 600 17px/1 system-ui, sans-serif; }
   .island { position: absolute; top: 11px; left: 50%; width: 125px; height: 37px; margin-left: -62.5px; border-radius: 19px; background: #000; }
   .indicators { display: flex; align-items: center; gap: 6px; }
   #screen { flex: 1; display: block; width: 100%; border: 0; background: var(--screen); }
@@ -351,6 +414,571 @@ const STYLES = `
   @media (max-width: 900px) { main { flex-direction: column; } aside { width: auto; height: 40vh; border-left: 0; border-top: 1px solid var(--border); } }
 `;
 //#endregion
+//#region src/bytes.ts
+const MEGABYTE = 1048576;
+function megabytes(bytes) {
+	return String(Math.ceil(bytes * 10 / MEGABYTE) / 10);
+}
+//#endregion
+//#region src/content-types.ts
+const CONTENT_TYPES = {
+	".png": "image/png",
+	".jpg": "image/jpeg",
+	".jpeg": "image/jpeg",
+	".gif": "image/gif",
+	".webp": "image/webp",
+	".svg": "image/svg+xml",
+	".pdf": "application/pdf",
+	".json": "application/json",
+	".txt": "text/plain",
+	".csv": "text/csv",
+	".html": "text/html",
+	".zip": "application/zip"
+};
+function contentTypeFor(name) {
+	return CONTENT_TYPES[extname(name).toLowerCase()] ?? "application/octet-stream";
+}
+//#endregion
+//#region src/network.ts
+const MAX_RESPONSE_BYTES = 5 * MEGABYTE;
+const MAX_DOWNLOAD_BYTES = 100 * MEGABYTE;
+const METHODS = [
+	"GET",
+	"POST",
+	"PUT",
+	"PATCH",
+	"DELETE",
+	"HEAD",
+	"OPTIONS"
+];
+const UPLOAD_METHODS = [
+	"POST",
+	"PUT",
+	"PATCH"
+];
+const BODILESS_METHODS = ["GET", "HEAD"];
+const REDIRECT_STATUSES = [
+	301,
+	302,
+	303,
+	307,
+	308
+];
+const HOST_HEADERS = [
+	"content-type",
+	"content-length",
+	"transfer-encoding",
+	"host",
+	"connection",
+	"upgrade"
+];
+const CONTENT_TYPE = /^[\w.+-]+\/[\w.+*-]+\s*(;.*)?$/;
+async function sendHttpRequest(request, hosts, signal) {
+	return exchange(textRequest(request), hosts, signal, async (response) => result(response, await readBody(response)));
+}
+async function downloadHttpFile(request, hosts, files, signal) {
+	return exchange(textRequest(request), hosts, signal, async (response) => {
+		if (!response.ok) return {
+			...result(response, await readBody(response)),
+			ok: false
+		};
+		const file = await save$1(response, request.name, files);
+		const { status, statusText, headers } = result(response, "");
+		return {
+			status,
+			statusText,
+			headers,
+			ok: true,
+			file
+		};
+	});
+}
+async function uploadHttpFiles(request, hosts, files, signal) {
+	if (request.files.length === 0) throw invalid("An upload needs at least one file; send text with http.request");
+	const parts = request.files.map((upload) => {
+		if (!upload.field.trim()) throw invalid("Each file needs a field name");
+		const file = files.requireFile(upload.file);
+		return {
+			field: upload.field,
+			file,
+			name: upload.name ? safeFileName(upload.name) : file.name
+		};
+	});
+	const makeForm = async () => {
+		const form = new FormData();
+		for (const [name, value] of Object.entries(request.fields ?? {})) form.append(name, value);
+		for (const part of parts) {
+			const contents = await readFile(part.file.path);
+			form.append(part.field, new File([contents], part.name, { type: part.file.contentType }));
+		}
+		return form;
+	};
+	return exchange({
+		method: parseMethod(request.method ?? "POST", UPLOAD_METHODS),
+		headers: checkedHeaders(request.headers ?? {}),
+		url: parseUrl(request.url),
+		body: {
+			kind: "form",
+			form: makeForm
+		}
+	}, hosts, signal, async (response) => result(response, await readBody(response)));
+}
+async function exchange(request, hosts, signal, read) {
+	let outgoing = request;
+	for (let redirects = 0; redirects <= 10; redirects++) {
+		if (!allowsHost(hosts, outgoing.url.hostname)) throw new HostError("denied", `"${outgoing.url.hostname}" is not in dot.json's network.hosts. List every host the dot sends requests to there.`);
+		const response = await send$1(outgoing, signal);
+		const location = response.headers.get("location");
+		if (!REDIRECT_STATUSES.includes(response.status) || location === null) return read(response);
+		await response.body?.cancel();
+		outgoing = redirected(outgoing, location, response.status);
+	}
+	throw new HostError("failed", `"${request.url.href}" redirected more than 10 times`);
+}
+function textRequest(request) {
+	const method = parseMethod(request.method ?? "GET", METHODS);
+	const { contentType = "text/plain; charset=utf-8", others } = takeContentType(request.headers ?? {});
+	if (!CONTENT_TYPE.test(contentType)) throw invalid(`"${contentType}" is not a Content-Type`);
+	const headers = checkedHeaders(others);
+	let body;
+	if (request.body !== void 0) {
+		if (BODILESS_METHODS.includes(method)) throw invalid(`A ${method} request can't have a body`);
+		body = {
+			kind: "text",
+			text: request.body,
+			contentType
+		};
+	}
+	return {
+		url: parseUrl(request.url),
+		method,
+		headers,
+		body
+	};
+}
+function checkedHeaders(values) {
+	for (const name of Object.keys(values)) if (HOST_HEADERS.includes(name.toLowerCase())) throw invalid(`"${name}" is set by the host`);
+	return new Headers(values);
+}
+function takeContentType(values) {
+	let contentType;
+	const others = {};
+	for (const [name, value] of Object.entries(values)) if (name.toLowerCase() === "content-type") contentType = value;
+	else others[name] = value;
+	return {
+		contentType,
+		others
+	};
+}
+async function send$1(request, signal) {
+	const headers = new Headers(request.headers);
+	let body = null;
+	if (request.body?.kind === "text") {
+		body = request.body.text;
+		headers.set("content-type", request.body.contentType);
+	} else if (request.body?.kind === "form") body = await request.body.form();
+	try {
+		return await fetch(request.url, {
+			method: request.method,
+			headers,
+			body,
+			redirect: "manual",
+			signal
+		});
+	} catch (error) {
+		if (signal.aborted) throw error;
+		const cause = error.cause?.message;
+		throw new HostError("failed", `Could not reach ${request.url.hostname}: ${cause ?? error.message}`);
+	}
+}
+function redirected(request, location, status) {
+	const url = URL.parse(location, request.url.href);
+	if (!url || url.protocol !== "http:" && url.protocol !== "https:") throw new HostError("failed", `${request.url.hostname} redirected to "${location}", which is not an http(s) URL`);
+	const becomesGet = status === 303 && request.method !== "HEAD" || (status === 301 || status === 302) && request.method === "POST";
+	const headers = new Headers(request.headers);
+	if (url.origin !== request.url.origin) headers.delete("authorization");
+	return {
+		url,
+		method: becomesGet ? "GET" : request.method,
+		headers,
+		body: becomesGet ? void 0 : request.body
+	};
+}
+function result(response, body) {
+	return {
+		status: response.status,
+		statusText: response.statusText || (STATUS_CODES[response.status] ?? ""),
+		ok: response.ok,
+		headers: Object.fromEntries(response.headers),
+		body
+	};
+}
+async function readBody(response) {
+	const chunks = [];
+	await readChunks(response, MAX_RESPONSE_BYTES, (chunk) => {
+		chunks.push(chunk);
+		return Promise.resolve();
+	});
+	const charset = /charset=([^;\s]+)/i.exec(response.headers.get("content-type") ?? "")?.[1];
+	return decoderFor(charset).decode(Buffer.concat(chunks));
+}
+async function save$1(response, requestedName, files) {
+	const { id, path } = await files.newPath();
+	const handle = await open(path, "w");
+	try {
+		await readChunks(response, MAX_DOWNLOAD_BYTES, async (chunk) => {
+			await handle.write(chunk);
+		});
+	} catch (error) {
+		await handle.close();
+		await rm(path, { force: true });
+		throw error;
+	}
+	await handle.close();
+	const name = requestedName ? safeFileName(requestedName) : fileName(response);
+	return files.add(id, path, name, contentType(response, name));
+}
+async function readChunks(response, limit, take) {
+	if (Number(response.headers.get("content-length") ?? 0) > limit) {
+		await response.body?.cancel();
+		throw tooLarge(limit);
+	}
+	if (!response.body) return;
+	const reader = response.body.getReader();
+	let length = 0;
+	while (true) {
+		const { done, value } = await reader.read();
+		if (done) return;
+		length += value.length;
+		if (length > limit) {
+			await reader.cancel();
+			throw tooLarge(limit);
+		}
+		await take(value);
+	}
+}
+function fileName(response) {
+	const disposition = response.headers.get("content-disposition") ?? "";
+	const encoded = /filename\*\s*=\s*[^']*''([^;]+)/i.exec(disposition)?.[1];
+	const plain = /filename\s*=\s*"?([^";]+)"?/i.exec(disposition)?.[1];
+	const segment = new URL(response.url).pathname.split("/").at(-1);
+	return [
+		encoded && safeDecode(encoded),
+		plain,
+		segment && safeDecode(segment)
+	].map((name) => safeFileName(name ?? "")).find(Boolean) ?? "download";
+}
+function safeFileName(name) {
+	return (name.split(/[/\\]/).at(-1) ?? "").trim().slice(0, 255);
+}
+function safeDecode(text) {
+	try {
+		return decodeURIComponent(text);
+	} catch {
+		return text;
+	}
+}
+function contentType(response, name) {
+	const declared = response.headers.get("content-type")?.split(";")[0]?.trim();
+	if (declared && declared !== "application/octet-stream") return declared;
+	return contentTypeFor(name);
+}
+function decoderFor(charset) {
+	try {
+		return new TextDecoder(charset ?? "utf-8");
+	} catch {
+		return new TextDecoder("utf-8");
+	}
+}
+function parseUrl(text) {
+	const url = /^https?:\/\//i.test(text) ? URL.parse(text) : null;
+	if (!url?.hostname) throw invalid(`"${text}" is not an http:// or https:// URL`);
+	return url;
+}
+function parseMethod(name, methods) {
+	const method = name.toUpperCase();
+	if (!methods.includes(method)) throw invalid(`"${name}" is not an HTTP method here: use ${methods.join(", ")}`);
+	return method;
+}
+function invalid(message) {
+	return new HostError("invalid", message);
+}
+function tooLarge(limit) {
+	return new HostError("failed", `The response is larger than ${megabytes(limit)} MB`);
+}
+//#endregion
+//#region src/files.ts
+const DEFAULT_QUOTA = 100 * MEGABYTE;
+const MAX_READ_BYTES = 5 * MEGABYTE;
+var DotStorage = class {
+	#root;
+	quota;
+	constructor(root, quota = DEFAULT_QUOTA) {
+		this.#root = root;
+		this.quota = quota;
+	}
+	async resolve(path, { allowRoot = false } = {}) {
+		const problem = dotFilePathProblem(path, { allowRoot });
+		if (problem) throw new HostError("invalid", problem);
+		const resolved = path === "" ? this.#root : join(this.#root, path);
+		await this.#checkInside(resolved);
+		return resolved;
+	}
+	async usage() {
+		return sizeOf(this.#root);
+	}
+	async clear() {
+		await rm(this.#root, {
+			recursive: true,
+			force: true
+		});
+	}
+	async ensureRoot() {
+		await mkdir(this.#root, { recursive: true });
+	}
+	async #checkInside(path) {
+		const realRoot = await realpath(this.#root).catch(() => null);
+		if (realRoot === null) return;
+		let existing = path;
+		while (!await exists(existing)) existing = dirname(existing);
+		const real = await realpath(existing);
+		if (real !== realRoot && !real.startsWith(`${realRoot}/`)) throw new HostError("denied", "That path leads outside the dot's storage");
+	}
+};
+async function runFileCall(operation, params, storage, temporaryFiles) {
+	switch (operation) {
+		case "read": return read(params, storage);
+		case "write": return write(params, storage);
+		case "stat": {
+			const { path } = params;
+			return entry(path, await storage.resolve(path, { allowRoot: true }));
+		}
+		case "list": return list(params, storage);
+		case "createFolder": return createFolder(params.path, storage);
+		case "move": return transfer(params, storage, false);
+		case "copy": return transfer(params, storage, true);
+		case "remove": return remove(params, storage);
+		case "save": return save(params, storage, temporaryFiles);
+		case "open": return open$1(params.path, storage, temporaryFiles);
+		case "usage": return {
+			used: await storage.usage(),
+			quota: storage.quota
+		};
+		default: throw new HostError("unsupported", `This host has no "dash.file.${operation}"`);
+	}
+}
+async function read({ path, as }, storage) {
+	const encoding = parseEncoding(as);
+	const file = await storage.resolve(path);
+	const info = await statOrNull(file);
+	if (!info) throw failed(`There is no file at "${path}"`);
+	if (info.isDirectory()) throw failed(`"${path}" is a folder`);
+	if (info.size > MAX_READ_BYTES) throw failed(`"${path}" is larger than ${megabytes(MAX_READ_BYTES)} MB, too large to read at once`);
+	const bytes = await readFile(file);
+	return encoding === "base64" ? bytes.toString("base64") : bytes.toString("utf8");
+}
+async function write({ path, data, as, append = false }, storage) {
+	const encoding = parseEncoding(as);
+	const file = await storage.resolve(path);
+	const existing = await statOrNull(file);
+	if (existing?.isDirectory()) throw failed(`"${path}" is a folder`);
+	if (encoding === "base64" && !/^[A-Za-z0-9+/]*={0,2}$/.test(data)) throw new HostError("invalid", "The data isn't base64");
+	const bytes = Buffer.from(data, encoding === "base64" ? "base64" : "utf8");
+	const replacedBytes = append ? 0 : existing?.size ?? 0;
+	await checkQuota(storage, bytes.length - replacedBytes);
+	await createParent(storage, file, path);
+	if (append) await appendFile(file, bytes);
+	else await writeFile(file, bytes);
+	return written(path, file);
+}
+async function list({ path, recursive = false }, storage) {
+	const folder = await storage.resolve(path, { allowRoot: true });
+	const info = await statOrNull(folder);
+	if (!info) {
+		if (path === "") return [];
+		throw failed(`There is no folder at "${path}"`);
+	}
+	if (!info.isDirectory()) throw failed(`"${path}" is a file`);
+	const entries = [];
+	await collect(path, folder, recursive, entries);
+	return entries.sort((first, second) => first.path < second.path ? -1 : 1);
+}
+async function createFolder(path, storage) {
+	const folder = await storage.resolve(path);
+	if ((await statOrNull(folder))?.isFile()) throw failed(`"${path}" is a file`);
+	await createParent(storage, folder, path);
+	await mkdir(folder, { recursive: true });
+	return written(path, folder);
+}
+async function transfer({ from, to, overwrite = false }, storage, keepSource) {
+	const source = await storage.resolve(from);
+	const target = await storage.resolve(to);
+	if (!await exists(source)) throw failed(`There is nothing at "${from}"`);
+	if (to === from || to.startsWith(`${from}/`)) throw new HostError("invalid", `"${to}" is inside "${from}"`);
+	await makeRoom(storage, target, to, overwrite, keepSource ? await sizeOf(source) : 0);
+	if (keepSource) await cp(source, target, { recursive: true });
+	else await rename(source, target);
+	return written(to, target);
+}
+async function remove({ path, recursive = false }, storage) {
+	const target = await storage.resolve(path);
+	const info = await statOrNull(target);
+	if (!info) return;
+	if (info.isDirectory() && !recursive && (await readdir(target)).length > 0) throw failed(`"${path}" is a folder with files in it: pass { recursive: true } to remove them too`);
+	await rm(target, {
+		recursive: true,
+		force: true
+	});
+}
+async function save({ file: id, path, overwrite = false }, storage, temporaryFiles) {
+	const file = temporaryFiles.requireFile(id);
+	const target = await storage.resolve(path);
+	await makeRoom(storage, target, path, overwrite, file.size);
+	await cp(file.path, target);
+	return written(path, target);
+}
+async function open$1(path, storage, temporaryFiles) {
+	const file = await storage.resolve(path);
+	if (!(await statOrNull(file))?.isFile()) throw failed(`There is no file at "${path}"`);
+	const name = basename(path);
+	return temporaryFiles.reference(file, name, contentTypeFor(name));
+}
+async function collect(folderPath, folder, recursive, entries) {
+	for (const name of await readdir(folder)) {
+		const path = folderPath === "" ? name : `${folderPath}/${name}`;
+		const child = join(folder, name);
+		const found = await entry(path, child);
+		if (!found) continue;
+		entries.push(found);
+		if (recursive && found.kind === "folder") await collect(path, child, true, entries);
+	}
+}
+async function entry(path, file) {
+	const info = await statOrNull(file);
+	if (!info) return null;
+	const name = path === "" ? "" : basename(path);
+	const modifiedAt = Math.round(info.mtimeMs);
+	if (info.isDirectory()) return {
+		name,
+		path,
+		kind: "folder",
+		size: 0,
+		modifiedAt
+	};
+	return {
+		name,
+		path,
+		kind: "file",
+		size: info.size,
+		contentType: contentTypeFor(name),
+		modifiedAt
+	};
+}
+async function written(path, file) {
+	const found = await entry(path, file);
+	if (!found) throw failed(`"${path}" was removed while it was written`);
+	return found;
+}
+async function makeRoom(storage, target, path, overwrite, addedBytes) {
+	if (await exists(target) && !overwrite) throw failed(`"${path}" already exists: pass { overwrite: true } to replace it`);
+	await checkQuota(storage, addedBytes - await sizeOf(target));
+	await rm(target, {
+		recursive: true,
+		force: true
+	});
+	await createParent(storage, target, path);
+}
+async function createParent(storage, file, path) {
+	await storage.ensureRoot();
+	const parent = dirname(file);
+	if ((await statOrNull(parent))?.isFile()) throw failed(`A folder in "${path}" is a file`);
+	await mkdir(parent, { recursive: true });
+}
+async function checkQuota(storage, addedBytes) {
+	if (addedBytes <= 0) return;
+	const used = await storage.usage();
+	if (used + addedBytes > storage.quota) throw failed(`The dot's storage is full: it uses ${megabytes(used)} of ${megabytes(storage.quota)} MB, and this needs ${megabytes(addedBytes)} MB more`);
+}
+async function sizeOf(path) {
+	const info = await lstat(path).catch(() => null);
+	if (!info) return 0;
+	if (!info.isDirectory()) return info.size;
+	let total = 0;
+	for (const name of await readdir(path)) total += await sizeOf(join(path, name));
+	return total;
+}
+async function exists(path) {
+	return await lstat(path).catch(() => null) !== null;
+}
+async function statOrNull(path) {
+	return stat(path).catch(() => null);
+}
+function parseEncoding(name) {
+	if (name === void 0 || name === "text" || name === "base64") return name ?? "text";
+	throw new HostError("invalid", `"${String(name)}" is not an encoding: use "text" or "base64"`);
+}
+function failed(message) {
+	return new HostError("failed", message);
+}
+//#endregion
+//#region src/temporary-files.ts
+const TEMPORARY_FILES_PATH = "/__dot/files/";
+var TemporaryFiles = class {
+	#directory;
+	#files = /* @__PURE__ */ new Map();
+	constructor(directory) {
+		this.#directory = directory;
+	}
+	file(id) {
+		return this.#files.get(id);
+	}
+	requireFile(id) {
+		const file = this.#files.get(id);
+		if (!file) throw new HostError("invalid", `"${id}" is not a file this dot has`);
+		return file;
+	}
+	async clear() {
+		this.#files.clear();
+		await rm(this.#directory, {
+			recursive: true,
+			force: true
+		});
+	}
+	async newPath() {
+		await mkdir(this.#directory, { recursive: true });
+		const id = newId();
+		return {
+			id,
+			path: join(this.#directory, id)
+		};
+	}
+	async reference(path, name, contentType) {
+		return this.add(newId(), path, name, contentType);
+	}
+	async add(id, path, name, contentType) {
+		const { size } = await stat(path);
+		const url = `${TEMPORARY_FILES_PATH}${id}`;
+		this.#files.set(id, {
+			id,
+			name,
+			size,
+			contentType,
+			url,
+			path
+		});
+		return {
+			id,
+			name,
+			size,
+			contentType,
+			url
+		};
+	}
+};
+function newId() {
+	return `f_${randomBytes(12).toString("base64url")}`;
+}
+//#endregion
 //#region src/server.ts
 const DEFAULT_PORT = 3680;
 const PORT_ATTEMPTS = 5;
@@ -368,8 +996,10 @@ const MIME_TYPES = {
 	".webp": "image/webp",
 	".woff2": "font/woff2"
 };
-async function startSimulator({ dotDir, reactHostDir, name = "Dot", port = DEFAULT_PORT, host = "localhost", clientDir = defaultClientDir() }) {
+async function startSimulator({ dotDir, reactHostDir, name = "Dot", port = DEFAULT_PORT, host = "localhost", clientDir = defaultClientDir(), storageDir }) {
 	const clients = /* @__PURE__ */ new Set();
+	const files = new TemporaryFiles(await mkdtemp(join(tmpdir(), "dot-simulator-files-")));
+	const storage = new DotStorage(storageDir ?? await mkdtemp(join(tmpdir(), "dot-simulator-storage-")));
 	let buildError = null;
 	const broadcast = (event, data = "") => {
 		for (const client of clients) client.write(serverEvent(event, data));
@@ -396,6 +1026,19 @@ async function startSimulator({ dotDir, reactHostDir, name = "Dot", port = DEFAU
 			request.on("close", () => clients.delete(response));
 			return;
 		}
+		if (pathname.startsWith(HTTP_PATH) && request.method === "POST") {
+			relayHttpCall(request, response, pathname.slice(HTTP_PATH.length), dotDir, files);
+			return;
+		}
+		if (pathname.startsWith(FILE_PATH) && request.method === "POST") {
+			const operation = pathname.slice(FILE_PATH.length);
+			answer(request, response, (params) => runFileCall(operation, params, storage, files));
+			return;
+		}
+		if (pathname.startsWith("/__dot/files/")) {
+			serveTemporaryFile(response, files, pathname.slice(13));
+			return;
+		}
 		if (pathname.startsWith(REACT_HOST_PATH) && reactHostDir !== void 0) {
 			serveReact(response, reactHostDir, pathname.slice(REACT_HOST_PATH.length));
 			return;
@@ -416,18 +1059,63 @@ async function startSimulator({ dotDir, reactHostDir, name = "Dot", port = DEFAU
 		url: `http://${host}:${server.address().port}/`,
 		reload: () => {
 			buildError = null;
+			files.clear();
 			broadcast("reload");
 		},
+		hotReload: () => {
+			buildError = null;
+			broadcast("hot-reload");
+		},
 		error: (message) => {
 			buildError = message;
 			broadcast("build-error", message);
 		},
 		close: () => new Promise((resolvePromise) => {
 			for (const client of clients) client.end();
-			server.close(() => resolvePromise());
+			server.close(() => void files.clear().then(() => resolvePromise()));
 		})
 	};
 }
+function relayHttpCall(request, response, call, dotDir, files) {
+	return answer(request, response, async (params, signal) => {
+		const hosts = await networkHosts(dotDir);
+		if (call === "download") return downloadHttpFile(params, hosts, files, signal);
+		if (call === "upload") return uploadHttpFiles(params, hosts, files, signal);
+		return sendHttpRequest(params, hosts, signal);
+	});
+}
+async function answer(request, response, run) {
+	const controller = new AbortController();
+	response.on("close", () => controller.abort());
+	let reply;
+	try {
+		const chunks = [];
+		for await (const chunk of request) chunks.push(chunk);
+		reply = { result: await run(JSON.parse(Buffer.concat(chunks).toString("utf8")), controller.signal) ?? null };
+	} catch (error) {
+		if (controller.signal.aborted) return;
+		reply = { error: {
+			code: error instanceof HostError ? error.code : "failed",
+			message: error.message
+		} };
+	}
+	send(response, 200, JSON.stringify(reply), ".json");
+}
+async function serveTemporaryFile(response, files, id) {
+	const file = files.file(id);
+	if (!file) {
+		send(response, 404, "Not found");
+		return;
+	}
+	response.writeHead(200, {
+		"Content-Type": file.contentType,
+		"Cache-Control": "no-store"
+	});
+	response.end(await readFile(file.path));
+}
+async function networkHosts(dotDir) {
+	return JSON.parse(await readFile(join(dotDir, "manifest.json"), "utf8")).network?.hosts ?? [];
+}
 function serverEvent(event, data) {
 	return `event: ${event}\n${data.split("\n").map((line) => `data: ${line}`).join("\n")}\n\n`;
 }