@protobase/ui 0.19.4 → 0.19.5

package/dist/app/import/use-import-flow.js

@@ -0,0 +1,225 @@
+import { useResourceClients } from "../../data/api-provider.js";
+import { autoMapping, importableFields, matchFields } from "./mapping.js";
+import { checkImport, readHead, runImport } from "./run-import.js";
+import { localeFormats } from "./locale-formats.js";
+import { createLookups } from "./lookups.js";
+import { workerSheetSource } from "./sheet-source.js";
+import { useMemo, useRef, useState } from "react";
+import { useQueryClient } from "@tanstack/react-query";
+//#region src/app/import/use-import-flow.ts
+const emptyProgress = {
+	created: 0,
+	updated: 0,
+	skipped: 0,
+	failed: 0,
+	notWritten: []
+};
+/** The state of an import, from choosing the file to its summary, and the moves between its steps. */
+const useImportFlow = ({ model, resources, views, sourceFor = workerSheetSource }) => {
+	const clientFor = useResourceClients();
+	const queryClient = useQueryClient();
+	const view = views[model.name];
+	const fields = useMemo(() => importableFields(model, resources), [model, resources]);
+	const [step, setStep] = useState({
+		kind: "file",
+		reading: false
+	});
+	const [error, setError] = useState();
+	const [file, setFile] = useState();
+	const [sheet, setSheet] = useState();
+	const [head, setHead] = useState();
+	const [mode, setMode] = useState("create");
+	const [columns, setColumns] = useState([]);
+	const [match, setMatch] = useState();
+	const [options, setOptions] = useState(() => localeFormats());
+	const cancelled = useRef(false);
+	const checking = useRef(void 0);
+	const fail = (next) => (cause) => {
+		setError(cause);
+		setStep(next);
+	};
+	/** Reads the chosen file's sheet names; a CSV, or a workbook of one sheet, goes on to its columns. */
+	const choose = (chosen) => {
+		setError(void 0);
+		setStep({
+			kind: "file",
+			reading: true
+		});
+		const source = sourceFor(chosen);
+		source.sheets().then((sheets) => {
+			setFile({
+				file: chosen,
+				source,
+				sheets
+			});
+			setSheet(sheets[0]);
+			if (sheets.length <= 1) return open(source, sheets[0]);
+			setStep({
+				kind: "file",
+				reading: false
+			});
+		}).catch(fail({
+			kind: "file",
+			reading: false
+		}));
+	};
+	const open = async (source, name) => {
+		setStep({
+			kind: "file",
+			reading: true
+		});
+		const read = await readHead(source, name);
+		setHead(read);
+		setColumns(autoMapping(read.headers, fields, view));
+		const key = matchFields(model)[0];
+		const keyColumn = key ? autoMapping(read.headers, [key], view)[0] : void 0;
+		setMatch(key && keyColumn ? {
+			field: key.name,
+			column: keyColumn.column
+		} : void 0);
+		setStep({ kind: "map" });
+	};
+	const openSheet = () => {
+		if (!file) return;
+		setError(void 0);
+		open(file.source, sheet).catch(fail({
+			kind: "file",
+			reading: false
+		}));
+	};
+	/** Maps the column to the field, or skips it without one; a field fills one column, so another that had it is skipped. */
+	const mapColumn = (column, field) => setColumns((current) => {
+		const others = current.filter((entry) => entry.column !== column && entry.field !== field);
+		return field ? [...others, {
+			column,
+			field
+		}].sort((a, b) => a.column - b.column) : others;
+	});
+	/** The field of the related record a relation column is found by. */
+	const matchColumnBy = (column, matchBy) => setColumns((current) => current.map((entry) => entry.column === column ? {
+		...entry,
+		matchBy
+	} : entry));
+	const plan = () => ({
+		mode,
+		columns,
+		match: mode === "create" ? void 0 : match,
+		options
+	});
+	const context = () => ({
+		model,
+		resources,
+		views,
+		lookups: createLookups(clientFor)
+	});
+	/** Reads the whole file and prepares each row as the import would, writing nothing. */
+	const check = () => {
+		if (!file) return;
+		setError(void 0);
+		const controller = new AbortController();
+		checking.current = controller;
+		setStep({
+			kind: "checking",
+			rows: 0
+		});
+		checkImport(file.source, sheet, plan(), context(), (rows) => setStep({
+			kind: "checking",
+			rows
+		}), controller.signal).then((result) => {
+			if (!controller.signal.aborted) setStep({
+				kind: "checked",
+				check: result
+			});
+		}).catch((cause) => {
+			if (!controller.signal.aborted) fail({ kind: "map" })(cause);
+		});
+	};
+	const back = () => {
+		checking.current?.abort();
+		setError(void 0);
+		setStep({ kind: "map" });
+	};
+	/** Writes the rows in batches; Cancel stops it between two. */
+	const start = (total) => {
+		if (!file) return;
+		setError(void 0);
+		cancelled.current = false;
+		setStep({
+			kind: "importing",
+			progress: emptyProgress,
+			total,
+			cancelling: false
+		});
+		let latest = emptyProgress;
+		const refresh = () => {
+			for (const prefix of [
+				"page",
+				"list",
+				"first-page",
+				"map",
+				"facets",
+				"series"
+			]) queryClient.invalidateQueries({ queryKey: [prefix, model.name] });
+		};
+		runImport(file.source, sheet, plan(), context(), {
+			client: clientFor(model.name),
+			onProgress: (progress) => {
+				latest = progress;
+				setStep({
+					kind: "importing",
+					progress,
+					total,
+					cancelling: cancelled.current
+				});
+			},
+			cancelled: () => cancelled.current
+		}).then((result) => setStep({
+			kind: "done",
+			result
+		})).catch((cause) => setStep({
+			kind: "done",
+			result: {
+				...latest,
+				cancelled: false
+			},
+			stopped: cause
+		})).finally(refresh);
+	};
+	const cancel = () => {
+		cancelled.current = true;
+		setStep((current) => current.kind === "importing" ? {
+			...current,
+			cancelling: true
+		} : current);
+	};
+	/** Stops a check that is still reading, when the dialog closes. */
+	const stop = () => checking.current?.abort();
+	return {
+		step,
+		error,
+		file: file?.file,
+		sheets: file?.sheets ?? [],
+		sheet,
+		setSheet,
+		head,
+		fields,
+		mode,
+		setMode,
+		columns,
+		mapColumn,
+		matchColumnBy,
+		match,
+		setMatch,
+		options,
+		setOptions,
+		choose,
+		openSheet,
+		check,
+		back,
+		start,
+		cancel,
+		stop
+	};
+};
+//#endregion
+export { useImportFlow };

package/dist/app/import/xlsx-reader.js

@@ -0,0 +1,43 @@
+import { createRowScanner, dateStyles, parseRow, sharedStrings, workbookSheets } from "./xlsx-xml.js";
+import { zipEntries, zipText, zipTextChunks } from "./zip-reader.js";
+//#region src/app/import/xlsx-reader.ts
+const part = (entries, name) => {
+	const entry = entries.get(name);
+	if (!entry) throw new Error(`The file is not an Excel workbook (.xlsx): it has no ${name}`);
+	return entry;
+};
+/**
+* An .xlsx workbook: the names of its sheets, and each sheet's rows read as its XML streams in. The shared strings and
+* the styles are read whole, since cells point into them; the sheets are not.
+*/
+const openWorkbook = async (blob) => {
+	const entries = await zipEntries(blob);
+	const { sheets, date1904 } = workbookSheets(await zipText(blob, part(entries, "xl/workbook.xml")), await zipText(blob, part(entries, "xl/_rels/workbook.xml.rels")));
+	let context;
+	const sheetContext = async () => {
+		context = {
+			strings: entries.has("xl/sharedStrings.xml") ? sharedStrings(await zipText(blob, entries.get("xl/sharedStrings.xml"))) : [],
+			dates: entries.has("xl/styles.xml") ? dateStyles(await zipText(blob, entries.get("xl/styles.xml"))) : /* @__PURE__ */ new Set(),
+			date1904
+		};
+		return context;
+	};
+	async function* rows(name) {
+		const sheet = sheets.find((candidate) => candidate.name === name);
+		if (!sheet) throw new Error(`The workbook has no sheet called ${name}`);
+		const shared = context ?? await sheetContext();
+		const scan = createRowScanner();
+		let line = 0;
+		for await (const text of zipTextChunks(blob, part(entries, sheet.path))) for (const xml of scan(text)) {
+			const row = parseRow(xml, shared, line);
+			line = row.line;
+			yield row;
+		}
+	}
+	return {
+		sheets: sheets.map((sheet) => sheet.name),
+		rows
+	};
+};
+//#endregion
+export { openWorkbook };

package/dist/app/import/xlsx-xml.js

@@ -0,0 +1,169 @@
+//#region src/app/import/xlsx-xml.ts
+const entities = {
+	amp: "&",
+	lt: "<",
+	gt: ">",
+	quot: "\"",
+	apos: "'"
+};
+/** The text with XML's entities and character references replaced by what they stand for. */
+const decodeXml = (text) => text.replace(/&(#x[0-9a-f]+|#\d+|amp|lt|gt|quot|apos);/gi, (whole, name) => {
+	if (name[0] !== "#") return entities[name.toLowerCase()] ?? whole;
+	return String.fromCodePoint(name[1] === "x" || name[1] === "X" ? parseInt(name.slice(2), 16) : Number(name.slice(1)));
+});
+/** An element's attributes, by name without their namespace prefix. */
+const attributes = (text) => {
+	const found = {};
+	for (const match of text.matchAll(/([\w:.-]+)\s*=\s*(?:"([^"]*)"|'([^']*)')/g)) {
+		const name = match[1].slice(match[1].indexOf(":") + 1);
+		found[name] = decodeXml(match[2] ?? match[3] ?? "");
+	}
+	return found;
+};
+const runsText = (xml) => xml.replace(/<rPh\b[\s\S]*?<\/rPh>/g, "").match(/<t\b[^>]*>[\s\S]*?<\/t>/g)?.map((run) => decodeXml(run.replace(/^<t\b[^>]*>|<\/t>$/g, ""))).join("") ?? "";
+/** The workbook's shared strings (xl/sharedStrings.xml), which text cells point at by index. */
+const sharedStrings = (xml) => [...xml.matchAll(/<si\b[^>]*?(?:\/>|>([\s\S]*?)<\/si>)/g)].map((match) => runsText(match[1] ?? ""));
+/**
+* The workbook's sheets in order, each with the path of its part in the archive, from xl/workbook.xml and its
+* relationships (xl/_rels/workbook.xml.rels); `date1904` when its dates count from 1904, as old Mac workbooks do.
+*/
+const workbookSheets = (workbookXml, relsXml) => {
+	const targets = new Map([...relsXml.matchAll(/<Relationship\b([^>]*)>/g)].map((match) => {
+		const { Id, Target } = attributes(match[1]);
+		return [Id, Target.startsWith("/") ? Target.slice(1) : `xl/${Target}`];
+	}));
+	const sheets = [...workbookXml.matchAll(/<sheet\b([^>]*)>/g)].map((match) => {
+		const { name, id } = attributes(match[1]);
+		const path = targets.get(id);
+		if (!name || !path) throw new Error("The workbook names a sheet it does not hold");
+		return {
+			name,
+			path
+		};
+	});
+	const pr = /<workbookPr\b([^>]*)>/.exec(workbookXml);
+	return {
+		sheets,
+		date1904: pr ? ["1", "true"].includes(attributes(pr[1]).date1904 ?? "") : false
+	};
+};
+const builtInDates = /* @__PURE__ */ new Set([
+	14,
+	15,
+	16,
+	17,
+	18,
+	19,
+	20,
+	21,
+	22,
+	27,
+	28,
+	29,
+	30,
+	31,
+	32,
+	33,
+	34,
+	35,
+	36,
+	45,
+	46,
+	47,
+	50,
+	51,
+	52,
+	53,
+	54,
+	55,
+	56,
+	57,
+	58
+]);
+/** Whether a number format shows a date or time: it has d, m, y, h or s outside quoted text, colours and escapes. */
+const isDateFormat = (code) => /[dmyhs]/i.test(code.replace(/"[^"]*"|\[[^\]]*\]|\\.|_.|\*./g, ""));
+/** The indexes of the cell styles (xl/styles.xml's cellXfs) whose number format is a date or time. */
+const dateStyles = (xml) => {
+	const custom = new Map([...xml.matchAll(/<numFmt\b([^>]*)>/g)].map((match) => {
+		const { numFmtId, formatCode } = attributes(match[1]);
+		return [Number(numFmtId), formatCode ?? ""];
+	}));
+	const cellXfs = /<cellXfs\b[^>]*>([\s\S]*?)<\/cellXfs>/.exec(xml)?.[1] ?? "";
+	const styles = /* @__PURE__ */ new Set();
+	[...cellXfs.matchAll(/<xf\b([^>]*)>/g)].forEach((match, index) => {
+		const id = Number(attributes(match[1]).numFmtId ?? 0);
+		if (builtInDates.has(id) || custom.has(id) && isDateFormat(custom.get(id))) styles.add(index);
+	});
+	return styles;
+};
+const pad = (value) => String(value).padStart(2, "0");
+/**
+* A date cell's wall-clock time from its serial number, the days since the workbook's epoch: a date when it has no time
+* of day (`2026-03-01`), else to the second (`2026-03-01T14:30:00`). Excel's 1900 calendar counts a 29 February 1900
+* that never was, so serials before it are a day ahead.
+*/
+const serialDate = (serial, date1904 = false) => {
+	const days = date1904 ? serial + 1462 : serial < 60 ? serial + 1 : serial;
+	const at = new Date(Date.UTC(1899, 11, 30) + Math.round(days * 86400) * 1e3);
+	const date = `${at.getUTCFullYear()}-${pad(at.getUTCMonth() + 1)}-${pad(at.getUTCDate())}`;
+	return at.getUTCHours() * 3600 + at.getUTCMinutes() * 60 + at.getUTCSeconds() === 0 ? date : `${date}T${pad(at.getUTCHours())}:${pad(at.getUTCMinutes())}:${pad(at.getUTCSeconds())}`;
+};
+/** The 0-based column of a cell reference: `A1` is 0, `AB7` is 27. */
+const columnIndex = (ref) => {
+	let index = 0;
+	for (const char of ref.toUpperCase()) {
+		const code = char.charCodeAt(0);
+		if (code < 65 || code > 90) break;
+		index = index * 26 + (code - 64);
+	}
+	return index - 1;
+};
+const cellValue = (attrs, body, context) => {
+	const type = attrs.t ?? "n";
+	if (type === "inlineStr") return runsText(body);
+	const raw = /<v\b[^>]*>([\s\S]*?)<\/v>/.exec(body)?.[1];
+	if (raw === void 0) return null;
+	const value = decodeXml(raw);
+	if (type === "s") return context.strings[Number(value)] ?? null;
+	if (type === "b") return value === "1";
+	if (type === "str" || type === "e") return value;
+	if (type === "d") return { date: value.replace(/Z$/, "") };
+	const number = Number(value);
+	return context.dates.has(Number(attrs.s ?? 0)) ? { date: serialDate(number, context.date1904) } : number;
+};
+/** One `<row>` element as a row of cells, each at its column; a row without a number follows `previous`. */
+const parseRow = (xml, context, previous) => {
+	const open = /^<row\b([^>]*)>/.exec(xml);
+	const line = Number(attributes(open?.[1] ?? "").r ?? previous + 1);
+	const cells = [];
+	for (const match of xml.matchAll(/<c\b([^>]*?)(?:\/>|>([\s\S]*?)<\/c>)/g)) {
+		const attrs = attributes(match[1]);
+		const column = attrs.r ? columnIndex(attrs.r) : cells.length;
+		while (cells.length < column) cells.push(null);
+		cells[column] = cellValue(attrs, match[2] ?? "", context);
+	}
+	return {
+		line,
+		cells
+	};
+};
+/**
+* A scanner fed a sheet's XML a chunk at a time, which returns the `<row>` elements each chunk completes, so a large
+* sheet is read without holding its text whole.
+*/
+const createRowScanner = () => {
+	let buffer = "";
+	return (chunk) => {
+		buffer += chunk;
+		const rows = [];
+		let end = 0;
+		for (const match of buffer.matchAll(/<row\b[^>]*?(?:\/>|>[\s\S]*?<\/row>)/g)) {
+			rows.push(match[0]);
+			end = match.index + match[0].length;
+		}
+		buffer = buffer.slice(end);
+		return rows;
+	};
+};
+//#endregion
+export { attributes, columnIndex, createRowScanner, dateStyles, decodeXml, isDateFormat, parseRow, serialDate, sharedStrings, workbookSheets };

package/dist/app/import/zip-reader.js

@@ -0,0 +1,72 @@
+//#region src/app/import/zip-reader.ts
+const endSignature = 101010256;
+const entrySignature = 33639248;
+const localSignature = 67324752;
+const endSearch = 65557;
+const bytesOf = async (blob, start, end) => new DataView(await blob.slice(start, end).arrayBuffer());
+const notZip = () => /* @__PURE__ */ new Error("The file is not an Excel workbook (.xlsx): it is no ZIP archive");
+const endRecordAt = (view) => {
+	for (let at = view.byteLength - 22; at >= 0; at--) if (view.getUint32(at, true) === endSignature) return at;
+	return -1;
+};
+/** The archive's entries by name, from its central directory. A ZIP64 archive (over 4 GB) is refused. */
+const zipEntries = async (blob) => {
+	const tailStart = Math.max(0, blob.size - endSearch);
+	const tail = await bytesOf(blob, tailStart, blob.size);
+	const end = endRecordAt(tail);
+	if (end < 0) throw notZip();
+	const count = tail.getUint16(end + 10, true);
+	const size = tail.getUint32(end + 12, true);
+	const start = tail.getUint32(end + 16, true);
+	if (count === 65535 || size === 4294967295 || start === 4294967295) throw new Error("The workbook is too large to read: it is a ZIP64 archive");
+	const directory = await bytesOf(blob, start, start + size);
+	const decoder = new TextDecoder();
+	const entries = /* @__PURE__ */ new Map();
+	let at = 0;
+	for (let index = 0; index < count; index++) {
+		if (directory.getUint32(at, true) !== entrySignature) throw notZip();
+		const nameLength = directory.getUint16(at + 28, true);
+		const extraLength = directory.getUint16(at + 30, true);
+		const commentLength = directory.getUint16(at + 32, true);
+		const name = decoder.decode(new Uint8Array(directory.buffer, directory.byteOffset + at + 46, nameLength));
+		entries.set(name, {
+			name,
+			method: directory.getUint16(at + 10, true),
+			size: directory.getUint32(at + 20, true),
+			offset: directory.getUint32(at + 42, true)
+		});
+		at += 46 + nameLength + extraLength + commentLength;
+	}
+	return entries;
+};
+/** The entry's content as a stream of bytes: stored as it is, or inflated (deflate). */
+const zipEntryStream = async (blob, entry) => {
+	const local = await bytesOf(blob, entry.offset, entry.offset + 30);
+	if (local.getUint32(0, true) !== localSignature) throw notZip();
+	const dataStart = entry.offset + 30 + local.getUint16(26, true) + local.getUint16(28, true);
+	const raw = blob.slice(dataStart, dataStart + entry.size).stream();
+	if (entry.method === 0) return raw;
+	if (entry.method === 8) return raw.pipeThrough(new DecompressionStream("deflate-raw"));
+	throw new Error(`The workbook's part ${entry.name} is compressed in a way that cannot be read (method ${entry.method})`);
+};
+/** The entry's content as text, decoded as UTF-8 a chunk at a time. */
+async function* zipTextChunks(blob, entry) {
+	const reader = (await zipEntryStream(blob, entry)).pipeThrough(new TextDecoderStream()).getReader();
+	try {
+		for (;;) {
+			const { done, value } = await reader.read();
+			if (done) return;
+			yield value;
+		}
+	} finally {
+		await reader.cancel();
+	}
+}
+/** The entry's whole content as text, for the small parts of a workbook. */
+const zipText = async (blob, entry) => {
+	const parts = [];
+	for await (const text of zipTextChunks(blob, entry)) parts.push(text);
+	return parts.join("");
+};
+//#endregion
+export { zipEntries, zipEntryStream, zipText, zipTextChunks };

package/dist/app/list-page.js

@@ -28,6 +28,7 @@ import { useLiveRows } from "../live/use-live-rows.js";
 import { Sheet } from "../primitives/sheet.js";
 import { useDeleteFlow } from "./delete/use-delete-flow.js";
 import { useRestore } from "./delete/use-restore.js";
+import { ImportButton } from "./import/import-button.js";
 import { SignInPrompt } from "../auth/sign-in-prompt.js";
 import { ListCards } from "./displays/list-cards.js";
 import { MapDisplay } from "./displays/map-display.js";
@@ -270,6 +271,7 @@ const LoadedList = ({ model, address, scope, heading }) => {
 		filter: filterText,
 		chips: filterChips(model, view, filterText, facetNames(config))
 	});
+	const importButton = !scope && /* @__PURE__ */ jsx(ImportButton, { model });
 	const displaySwitch = (menu) => /* @__PURE__ */ jsx(DisplaySwitch, {
 		view,
 		value: display?.name ?? tableDisplay,
@@ -349,8 +351,13 @@ const LoadedList = ({ model, address, scope, heading }) => {
 				actions: desktop ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
 					displaySwitch(false),
 					saveSearch,
+					importButton,
 					createButton
-				] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [saveSearch, createButton] })
+				] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+					saveSearch,
+					importButton,
+					createButton
+				] })
 			}),
 			!parsed.ok && /* @__PURE__ */ jsx(ErrorBanner, {
 				title: "The filter in the address could not be read",

package/dist/app/named-icon.js

@@ -1,4 +1,4 @@
-import { Bed, Bell, Bookmark, ExternalLink, FileText, Heart, RulerDimensionLine, Send, Wallet } from "lucide-react";
+import { Bath, Bed, Bell, Bookmark, Calendar, DoorOpen, ExternalLink, FileText, Heart, House, KeyRound, LandPlot, Leaf, RulerDimensionLine, Send, Tag, Wallet } from "lucide-react";
 //#region src/app/named-icon.ts
 /** The icons an action's, a field's or a sign-in prompt's `icon` may name. */
 const byName = {
@@ -7,6 +7,14 @@ const byName = {
 	send: Send,
 	ruler: RulerDimensionLine,
 	bed: Bed,
+	bath: Bath,
+	house: House,
+	"door-open": DoorOpen,
+	"land-plot": LandPlot,
+	leaf: Leaf,
+	tag: Tag,
+	key: KeyRound,
+	calendar: Calendar,
 	heart: Heart,
 	bell: Bell,
 	bookmark: Bookmark,

package/dist/app/record-page.js

@@ -10,6 +10,7 @@ import { recordTitle } from "../live/model-helpers.js";
 import { humanize } from "../live/naming.js";
 import { useProjectUi } from "./pages/project-ui.js";
 import { displayValue } from "../live/display-value.js";
+import { filledFields } from "./filled-fields.js";
 import { Notice, useAdminMeta, usePermissions } from "./meta-gate.js";
 import { AppLink, useAppAddress } from "./use-app-address.js";
 import { ErrorBanner } from "./error-banner.js";
@@ -22,9 +23,11 @@ import { Section } from "../record-view/section.js";
 import { MetadataCard, RelatedRecords, SidebarCard } from "../record-view/record-sidebar.js";
 import { RecordHeader } from "../record-view/record-header.js";
 import { SpecTable } from "../record-view/spec-table.js";
+import { KeyFacts } from "../record-view/key-facts.js";
 import { toneFor } from "../live/columns-from-model.js";
 import { useDeleteFlow } from "./delete/use-delete-flow.js";
 import { useRestore } from "./delete/use-restore.js";
+import { namedIcon } from "./named-icon.js";
 import { ValueBadge } from "./value-badge.js";
 import { FieldValue } from "./pages/field-value.js";
 import { auditField } from "../live/audit-fields.js";
@@ -375,12 +378,18 @@ const LoadedRecord = ({ model, recordKey, stored }) => {
 										recordKey
 									}, `gallery:${index}`)];
 									if (item.kind !== "section") return [];
-									const fields = item.fields.filter((name) => model.fields[name] && visible(name));
+									const visibleFields = item.fields.filter((name) => model.fields[name] && visible(name));
+									const facts = shown === "read" && item.presentation === "facts";
+									const fields = facts ? filledFields(stored.record, visibleFields) : visibleFields;
 									if (fields.length === 0) return [];
 									return [/* @__PURE__ */ jsx(Section, {
 										title: item.title,
 										help: helpShown(item.helpWhen, view, editing) ? item.help : void 0,
-										children: shown === "read" ? /* @__PURE__ */ jsx(SpecTable, { rows: fields.map(readRow) }) : /* @__PURE__ */ jsx("div", {
+										children: facts ? /* @__PURE__ */ jsx(KeyFacts, { facts: fields.map((name) => ({
+											label: readRow(name).label,
+											value: readRow(name).value,
+											icon: namedIcon(hint(name)?.icon)
+										})) }) : shown === "read" ? /* @__PURE__ */ jsx(SpecTable, { rows: fields.map(readRow) }) : /* @__PURE__ */ jsx("div", {
 											className: "grid grid-cols-1 gap-x-6 gap-y-5 sm:grid-cols-2",
 											children: fields.map(fieldView)
 										})

package/dist/auth/sign-in-prompt.js

@@ -2,8 +2,8 @@ import { RouteLink } from "../primitives/route-link.js";
 import { useAuth } from "./auth-provider.js";
 import { Button, buttonClass } from "../primitives/button.js";
 import { useSignInAddress } from "./use-sign-in-address.js";
-import { namedIcon } from "../app/named-icon.js";
 import { ResponsiveDialog } from "../primitives/responsive-dialog.js";
+import { namedIcon } from "../app/named-icon.js";
 import { useId } from "react";
 import { Check, LogIn } from "lucide-react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";

package/dist/data/api-provider.js

@@ -1,5 +1,5 @@
 import { keys } from "./query-keys.js";
-import { createContext, useContext, useMemo, useRef, useState } from "react";
+import { createContext, useCallback, useContext, useMemo, useRef, useState } from "react";
 import { createClient } from "@protobase/client";
 import { jsx } from "react/jsx-runtime";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
@@ -21,6 +21,12 @@ const useResourceClient = (resource) => {
 	const own = useClient();
 	return useContext(ResourceClientContext)?.(resource) ?? own;
 };
+/** `useResourceClient` for any resource: the client of the API that serves each, for code that reaches several. */
+const useResourceClients = () => {
+	const own = useClient();
+	const resourceClient = useContext(ResourceClientContext);
+	return useCallback((resource) => resourceClient?.(resource) ?? own, [own, resourceClient]);
+};
 /** The client of a source's API, one per URL, with the signed-in user's token; for `MetaGate`. */
 const useSourceClients = () => {
 	const clientOf = useContext(SourceClientsContext);
@@ -104,4 +110,4 @@ const ApiProvider = ({ baseUrl, client: given, sources, fetch, queryClient: give
 	});
 };
 //#endregion
-export { ApiProvider, ClientProvider, useClient, useResourceClient, useSourceClients };
+export { ApiProvider, ClientProvider, useClient, useResourceClient, useResourceClients, useSourceClients };

package/dist/lib/save-file.js

@@ -0,0 +1,12 @@
+//#region src/lib/save-file.ts
+/** Hands the browser a file to save under `name`, made from `text`. */
+const saveFile = (text, name, type = "text/plain") => {
+	const url = URL.createObjectURL(new Blob([text], { type }));
+	Object.assign(document.createElement("a"), {
+		href: url,
+		download: name
+	}).click();
+	URL.revokeObjectURL(url);
+};
+//#endregion
+export { saveFile };