@protobase/ui 0.19.5 → 0.19.7

package/dist/app/export/xlsx.js

@@ -0,0 +1,91 @@
+import { Zip, ZipDeflate } from "fflate";
+//#region src/app/export/xlsx.ts
+/** The most data rows a sheet holds: Excel's 1,048,576 rows, less the header. */
+const xlsxMaxRows = 1048575;
+const maxCellText = 32767;
+const invalidXml = /[\u0000-\u0008\u000b\u000c\u000e-\u001f￾￿]/g;
+const escapeXml = (text) => text.replace(invalidXml, "").replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll("\"", "&quot;");
+/** A column's letters: 0 is A, 25 is Z, 26 is AA. */
+const columnLetters = (index) => {
+	const letter = String.fromCharCode(65 + index % 26);
+	return index < 26 ? letter : columnLetters(Math.floor(index / 26) - 1) + letter;
+};
+const textCell = (ref, text, style = "") => `<c r="${ref}"${style} t="inlineStr"><is><t xml:space="preserve">${escapeXml(text.slice(0, maxCellText))}</t></is></c>`;
+const xml = "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"yes\"?>\n";
+const mainNs = "http://schemas.openxmlformats.org/spreadsheetml/2006/main";
+const relNs = "http://schemas.openxmlformats.org/officeDocument/2006/relationships";
+const packageRelNs = "http://schemas.openxmlformats.org/package/2006/relationships";
+const contentTypes = `${xml}<Types xmlns="http://schemas.openxmlformats.org/package/2006/content-types"><Default Extension="rels" ContentType="application/vnd.openxmlformats-package.relationships+xml"/><Default Extension="xml" ContentType="application/xml"/><Override PartName="/xl/workbook.xml" ContentType="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet.main+xml"/><Override PartName="/xl/worksheets/sheet1.xml" ContentType="application/vnd.openxmlformats-officedocument.spreadsheetml.worksheet+xml"/><Override PartName="/xl/styles.xml" ContentType="application/vnd.openxmlformats-officedocument.spreadsheetml.styles+xml"/></Types>`;
+const rootRels = `${xml}<Relationships xmlns="${packageRelNs}"><Relationship Id="rId1" Type="${relNs}/officeDocument" Target="xl/workbook.xml"/></Relationships>`;
+const workbookRels = `${xml}<Relationships xmlns="${packageRelNs}"><Relationship Id="rId1" Type="${relNs}/worksheet" Target="worksheets/sheet1.xml"/><Relationship Id="rId2" Type="${relNs}/styles" Target="styles.xml"/></Relationships>`;
+const sheetName = (name) => name.replace(/[:\\/?*[\]]/g, " ").slice(0, 31).trim() || "Sheet1";
+const workbook = (name) => `${xml}<workbook xmlns="${mainNs}" xmlns:r="${relNs}"><sheets><sheet name="${escapeXml(sheetName(name))}" sheetId="1" r:id="rId1"/></sheets></workbook>`;
+const styles = (formats) => {
+	const numFmts = formats.map((code, index) => `<numFmt numFmtId="${164 + index}" formatCode="${escapeXml(code)}"/>`).join("");
+	const xfs = formats.map((_, index) => `<xf numFmtId="${164 + index}" fontId="0" fillId="0" borderId="0" xfId="0" applyNumberFormat="1"/>`).join("");
+	return `${xml}<styleSheet xmlns="${mainNs}">${formats.length > 0 ? `<numFmts count="${formats.length}">${numFmts}</numFmts>` : ""}<fonts count="2"><font><sz val="11"/><name val="Calibri"/></font><font><b/><sz val="11"/><name val="Calibri"/></font></fonts><fills count="2"><fill><patternFill patternType="none"/></fill><fill><patternFill patternType="gray125"/></fill></fills><borders count="1"><border><left/><right/><top/><bottom/><diagonal/></border></borders><cellStyleXfs count="1"><xf numFmtId="0" fontId="0" fillId="0" borderId="0"/></cellStyleXfs><cellXfs count="${2 + formats.length}"><xf numFmtId="0" fontId="0" fillId="0" borderId="0" xfId="0"/><xf numFmtId="0" fontId="1" fillId="0" borderId="0" xfId="0" applyFont="1"/>${xfs}</cellXfs><cellStyles count="1"><cellStyle name="Normal" xfId="0" builtinId="0"/></cellStyles></styleSheet>`;
+};
+const encoder = new TextEncoder();
+/**
+* Writes a one-sheet .xlsx file as it goes, handing each compressed piece to `onChunk`: a bold, frozen header row, then
+* `rows` as often as they come, and `finish` once. Text is written inline in its cell rather than in a table of shared
+* strings, so the writer holds no more than the rows it is given.
+*/
+const createXlsxWriter = (sheet, onChunk) => {
+	const zip = new Zip((error, chunk, final) => {
+		if (error) throw error;
+		onChunk(chunk, final);
+	});
+	const add = (path, text) => {
+		const file = new ZipDeflate(path, { level: 6 });
+		zip.add(file);
+		file.push(encoder.encode(text), true);
+	};
+	add("[Content_Types].xml", contentTypes);
+	add("_rels/.rels", rootRels);
+	add("xl/workbook.xml", workbook(sheet.name));
+	add("xl/_rels/workbook.xml.rels", workbookRels);
+	const worksheet = new ZipDeflate("xl/worksheets/sheet1.xml", { level: 6 });
+	zip.add(worksheet);
+	const cols = sheet.widths.map((width, index) => `<col min="${index + 1}" max="${index + 1}" width="${width}" customWidth="1"/>`).join("");
+	const frozen = "<sheetViews><sheetView workbookViewId=\"0\"><pane ySplit=\"1\" topLeftCell=\"A2\" activePane=\"bottomLeft\" state=\"frozen\"/></sheetView></sheetViews>";
+	const header = `<row r="1">${sheet.headers.map((text, index) => textCell(`${columnLetters(index)}1`, text, " s=\"1\"")).join("")}</row>`;
+	worksheet.push(encoder.encode(`${xml}<worksheet xmlns="${mainNs}">${frozen}${cols ? `<cols>${cols}</cols>` : ""}<sheetData>${header}`));
+	const letters = sheet.headers.map((_, index) => columnLetters(index));
+	const formats = [];
+	const styleOf = (format) => {
+		const index = formats.indexOf(format);
+		if (index >= 0) return index + 2;
+		formats.push(format);
+		return formats.length + 1;
+	};
+	const cellXml = (cell, ref) => {
+		switch (cell.kind) {
+			case "empty": return "";
+			case "text": return textCell(ref, cell.value);
+			case "boolean": return `<c r="${ref}" t="b"><v>${cell.value ? 1 : 0}</v></c>`;
+			case "number": return `<c r="${ref}"${cell.format ? ` s="${styleOf(cell.format)}"` : ""}><v>${cell.value}</v></c>`;
+		}
+	};
+	let rowNumber = 1;
+	const rows = (cells) => {
+		let text = "";
+		for (const row of cells) {
+			rowNumber += 1;
+			if (rowNumber > 1048576) throw new Error(`A sheet holds at most ${xlsxMaxRows} rows`);
+			text += `<row r="${rowNumber}">${row.map((cell, index) => cellXml(cell, `${letters[index]}${rowNumber}`)).join("")}</row>`;
+		}
+		worksheet.push(encoder.encode(text));
+	};
+	const finish = () => {
+		worksheet.push(encoder.encode("</sheetData></worksheet>"), true);
+		add("xl/styles.xml", styles(formats));
+		zip.end();
+	};
+	return {
+		rows,
+		finish
+	};
+};
+//#endregion
+export { columnLetters, createXlsxWriter, xlsxMaxRows };

package/dist/app/field-editor.js

@@ -50,7 +50,7 @@ const BuiltInEditor = ({ field, hints, value, stored, relationLabel, relationTo,
 		})
 	});
 	if (field.type === "boolean" && locked) return /* @__PURE__ */ jsx("div", {
-		className: "py-1.5 text-[13px] text-muted-foreground",
+		className: "py-1.5 text-muted-foreground",
 		children: displayValue(field, stored, hints)
 	});
 	if (field.type === "boolean") return /* @__PURE__ */ jsx(Switch, {
@@ -61,7 +61,7 @@ const BuiltInEditor = ({ field, hints, value, stored, relationLabel, relationTo,
 	if (field.type === "relation") {
 		const label = relationLabel ?? String(stored ?? "—");
 		return /* @__PURE__ */ jsx("div", {
-			className: "py-1.5 text-[13px]",
+			className: "py-1.5",
 			children: relationTo ? /* @__PURE__ */ jsx(AppLink, {
 				to: relationTo,
 				className: "font-medium text-primary-text hover:underline",
@@ -71,13 +71,13 @@ const BuiltInEditor = ({ field, hints, value, stored, relationLabel, relationTo,
 	}
 	const multiline = Boolean(hints?.multiline) && field.type === "text";
 	if (!isEditable(field) || locked) return /* @__PURE__ */ jsx("div", {
-		className: cn("py-1.5 text-[13px] tabular-nums", field.type === "decimal" || field.type === "integer" ? "font-medium" : "text-muted-foreground", multiline && "whitespace-pre-line break-words"),
+		className: cn("py-1.5 tabular-nums", field.type === "decimal" || field.type === "integer" ? "font-medium" : "text-muted-foreground", multiline && "whitespace-pre-line break-words"),
 		children: displayValue(field, stored, hints)
 	});
 	if (field.type === "enum") return /* @__PURE__ */ jsxs("select", {
 		value: String(value),
 		onChange: (event) => onChange(event.target.value),
-		className: "h-8 w-full rounded-md border border-border-strong bg-background px-2 text-[13px] shadow-sm focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20",
+		className: "h-8 w-full rounded-md border border-border-strong bg-background px-2 shadow-sm focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20",
 		children: [value === "" && /* @__PURE__ */ jsx("option", {
 			value: "",
 			children: "Choose..."
@@ -94,14 +94,8 @@ const BuiltInEditor = ({ field, hints, value, stored, relationLabel, relationTo,
 	});
 	return /* @__PURE__ */ jsx(Input, {
 		invalid,
-		leading: hints?.prefix ? /* @__PURE__ */ jsx("span", {
-			className: "text-[13px]",
-			children: hints.prefix
-		}) : void 0,
-		trailing: hints?.suffix ? /* @__PURE__ */ jsx("span", {
-			className: "text-[13px]",
-			children: hints.suffix.trim()
-		}) : void 0,
+		leading: hints?.prefix ? /* @__PURE__ */ jsx("span", { children: hints.prefix }) : void 0,
+		trailing: hints?.suffix ? /* @__PURE__ */ jsx("span", { children: hints.suffix.trim() }) : void 0,
 		placeholder,
 		className: cn(numeric.has(field.type) && "text-right tabular-nums"),
 		value: String(value),

package/dist/app/file-field.js

@@ -27,11 +27,11 @@ const Thumbnail = ({ value }) => {
 const FileSummary = ({ value }) => {
 	const shown = fileShown(value);
 	if (!shown) return /* @__PURE__ */ jsx("div", {
-		className: "py-1.5 text-[13px] text-muted-foreground",
+		className: "py-1.5 text-muted-foreground",
 		children: "—"
 	});
 	if ("missing" in shown) return /* @__PURE__ */ jsx("div", {
-		className: "py-1.5 text-[13px] text-danger-text",
+		className: "py-1.5 text-danger-text",
 		children: "The file is missing from storage"
 	});
 	const url = "url" in shown ? shown.url : void 0;
@@ -39,7 +39,7 @@ const FileSummary = ({ value }) => {
 	return /* @__PURE__ */ jsxs("div", {
 		className: "flex min-w-0 items-center gap-3 py-1",
 		children: [/* @__PURE__ */ jsx(Thumbnail, { value }), /* @__PURE__ */ jsxs("div", {
-			className: "min-w-0 text-[13px]",
+			className: "min-w-0",
 			children: [url && !url.startsWith("blob:") ? /* @__PURE__ */ jsx("a", {
 				href: url,
 				target: "_blank",
@@ -158,7 +158,7 @@ const FileField = ({ field, hints, resource, value, locked, invalid, onChange })
 			},
 			onDragLeave: () => setDragging(false),
 			onDrop: drop,
-			className: cn("flex items-center gap-3 rounded-md border border-dashed px-3 py-2.5 text-[13px] text-muted-foreground", dragging ? "border-primary bg-primary/5" : invalid ? "border-danger" : "border-border-strong"),
+			className: cn("flex items-center gap-3 rounded-md border border-dashed px-3 py-2.5 text-muted-foreground", dragging ? "border-primary bg-primary/5" : invalid ? "border-danger" : "border-border-strong"),
 			children: [
 				/* @__PURE__ */ jsx(Upload, { className: "size-4 shrink-0" }),
 				/* @__PURE__ */ jsx("span", {

package/dist/app/gallery/lightbox.js

@@ -77,7 +77,7 @@ const Lightbox = ({ title, photos, index, onIndex, onClose, details, detailsTitl
 				children: [/* @__PURE__ */ jsxs("div", {
 					className: "flex shrink-0 items-center justify-between gap-2 p-3",
 					children: [/* @__PURE__ */ jsx("span", {
-						className: "rounded-full bg-background/85 px-3 py-1 text-[13px] font-medium tabular-nums text-foreground",
+						className: "rounded-full bg-background/85 px-3 py-1 font-medium tabular-nums text-foreground",
 						"aria-live": "polite",
 						children: `${index + 1} / ${count}`
 					}), /* @__PURE__ */ jsxs("div", {
@@ -141,7 +141,7 @@ const Lightbox = ({ title, photos, index, onIndex, onClose, details, detailsTitl
 				"aria-label": detailsTitle,
 				className: "min-h-dvh w-[360px] shrink-0 border-l border-border bg-background p-5 text-foreground",
 				children: [/* @__PURE__ */ jsx("h2", {
-					className: "mb-3 text-[15px] font-semibold",
+					className: "mb-3 text-[16px] font-semibold",
 					children: detailsTitle
 				}), shownDetails]
 			}),

package/dist/app/gallery/photo-details.js

@@ -34,7 +34,7 @@ const PhotoDetails = ({ model, view, photoKey, fields }) => {
 			resource: model.name,
 			key: photoKey
 		},
-		className: "mt-3 inline-block text-[13px] font-medium text-primary-text hover:underline",
+		className: "mt-3 inline-block font-medium text-primary-text hover:underline",
 		children: `Open ${singular}`
 	})] });
 };

package/dist/app/import/import-check-step.js

@@ -37,7 +37,7 @@ const ProblemList = ({ rows }) => /* @__PURE__ */ jsxs("ul", {
 	})]
 });
 const ImportChecking = ({ rows }) => /* @__PURE__ */ jsxs("p", {
-	className: "flex items-center gap-2 text-[13px] text-muted-foreground",
+	className: "flex items-center gap-2 text-muted-foreground",
 	role: "status",
 	children: [
 		/* @__PURE__ */ jsx(Spinner, { className: "size-3.5" }),
@@ -54,7 +54,7 @@ const ImportCheckStep = ({ check, model, resources, views, columns, headers, fil
 	const view = views[model.name];
 	const shown = columns.map((column) => model.fields[column.field]);
 	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col gap-4 text-[13px]",
+		className: "flex flex-col gap-4",
 		children: [
 			/* @__PURE__ */ jsx(ImportCounts, {
 				label: "Check",

package/dist/app/import/import-file-step.js

@@ -8,7 +8,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 const ImportFileStep = ({ file, sheets, sheet, reading, onChoose, onSheet }) => {
 	const id = useId();
 	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col gap-4 text-[13px]",
+		className: "flex flex-col gap-4",
 		children: [
 			/* @__PURE__ */ jsxs("div", {
 				className: "flex flex-col gap-1.5",
@@ -27,7 +27,7 @@ const ImportFileStep = ({ file, sheets, sheet, reading, onChoose, onSheet }) =>
 							const chosen = event.target.files?.[0];
 							if (chosen) onChoose(chosen);
 						},
-						className: "text-[13px] file:mr-3 file:h-8 file:rounded-md file:border file:border-border-strong file:bg-background file:px-3 file:font-medium file:text-foreground max-sm:file:min-h-11"
+						className: "file:mr-3 file:h-8 file:rounded-md file:border file:border-border-strong file:bg-background file:px-3 file:font-medium file:text-foreground max-sm:file:min-h-11"
 					}),
 					/* @__PURE__ */ jsx("p", {
 						className: "text-xs text-muted-foreground",

package/dist/app/import/import-mapping-step.js

@@ -48,7 +48,7 @@ const ImportMappingStep = ({ flow, model, resources, views, canUpdate }) => {
 	}));
 	const keys = matchFields(model);
 	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col gap-5 text-[13px]",
+		className: "flex flex-col gap-5",
 		children: [
 			canUpdate && /* @__PURE__ */ jsxs("div", {
 				className: "flex flex-col gap-1.5",

package/dist/app/import/import-result-step.js

@@ -10,7 +10,7 @@ const count = (value) => value.toLocaleString("en-IE");
 const ImportProgressStep = ({ progress, total, cancelling }) => {
 	const done = progress.created + progress.updated + progress.failed;
 	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col gap-2 text-[13px]",
+		className: "flex flex-col gap-2",
 		children: [/* @__PURE__ */ jsxs("div", {
 			className: "flex items-baseline justify-between gap-2 text-xs",
 			children: [/* @__PURE__ */ jsx("span", {
@@ -40,7 +40,7 @@ const ImportProgressStep = ({ progress, total, cancelling }) => {
 };
 /** What the import did: created, updated, skipped and failed rows, and the rows it did not write with the reasons, to download. */
 const ImportSummary = ({ result, stopped, headers, fileName }) => /* @__PURE__ */ jsxs("div", {
-	className: "flex flex-col gap-4 text-[13px]",
+	className: "flex flex-col gap-4",
 	children: [
 		stopped !== void 0 && /* @__PURE__ */ jsx(ErrorBanner, {
 			title: "The import stopped. The rows counted below were saved.",

package/dist/app/import/import-select.js

@@ -10,7 +10,7 @@ const ImportSelect = ({ label, name, value, options, onChange, help, className }
 		children: [
 			/* @__PURE__ */ jsx("label", {
 				htmlFor: id,
-				className: "text-[13px] font-medium",
+				className: "font-medium",
 				children: label
 			}),
 			/* @__PURE__ */ jsx("select", {
@@ -18,7 +18,7 @@ const ImportSelect = ({ label, name, value, options, onChange, help, className }
 				"aria-label": name,
 				value,
 				onChange: (event) => onChange(event.target.value),
-				className: "h-8 w-full min-w-0 rounded-md border border-border-strong bg-background px-2 text-[13px] shadow-sm focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 max-sm:min-h-11",
+				className: "h-8 w-full min-w-0 rounded-md border border-border-strong bg-background px-2 shadow-sm focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 max-sm:min-h-11",
 				children: options.map((option) => /* @__PURE__ */ jsx("option", {
 					value: option.value,
 					children: option.label

package/dist/app/list-page.js

@@ -29,6 +29,8 @@ 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 { exportOffered, exportsSelection } from "./export/export-options.js";
+import { useExportFlow } from "./export/use-export-flow.js";
 import { SignInPrompt } from "../auth/sign-in-prompt.js";
 import { ListCards } from "./displays/list-cards.js";
 import { MapDisplay } from "./displays/map-display.js";
@@ -44,7 +46,7 @@ import { facetNames, filterChips } from "./searches/saved-search.js";
 import { SaveSearchButton } from "./searches/save-search-button.js";
 import { SavedSearches } from "./searches/saved-searches.js";
 import { useMemo, useState } from "react";
-import { Plus, SlidersHorizontal } from "lucide-react";
+import { Download, Plus, SlidersHorizontal } from "lucide-react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { createWhere } from "@protobase/schema";
 import { tableDisplay } from "@protobase/schema/internal";
@@ -272,6 +274,23 @@ const LoadedList = ({ model, address, scope, heading }) => {
 		chips: filterChips(model, view, filterText, facetNames(config))
 	});
 	const importButton = !scope && /* @__PURE__ */ jsx(ImportButton, { model });
+	const exportFlow = useExportFlow({
+		model,
+		view,
+		resources: meta.resources,
+		views: meta.views,
+		plural,
+		filter: loadFilter,
+		orderBy
+	});
+	const exportButton = exportOffered(view) && /* @__PURE__ */ jsxs(Button, {
+		onClick: () => exportFlow.open(),
+		...!desktop && {
+			"aria-label": "Export",
+			title: "Export"
+		},
+		children: [/* @__PURE__ */ jsx(Download, { className: "size-3.5" }), desktop && "Export"]
+	});
 	const displaySwitch = (menu) => /* @__PURE__ */ jsx(DisplaySwitch, {
 		view,
 		value: display?.name ?? tableDisplay,
@@ -300,11 +319,14 @@ const LoadedList = ({ model, address, scope, heading }) => {
 			available: (row) => rowAllows(row, "delete"),
 			onSelect: (row) => void remove.start(target(row))
 		}] : []],
-		bulkActions: can(permissions, "delete") ? [{
+		bulkActions: [...exportOffered(view) && exportsSelection(model) ? [{
+			label: (count) => `Export ${count}`,
+			onRun: (rows) => exportFlow.open(rows)
+		}] : [], ...can(permissions, "delete") ? [{
 			label: (count) => `Delete ${count}`,
 			destructive: true,
 			onRun: (rows) => remove.startBulk(rows.map(target))
-		}] : [],
+		}] : []],
 		rowNumbers: false,
 		pinKey: auth.kind === "signed-in" ? pinnedStorageKey(auth.user.id, resource) : void 0,
 		scroll: "parent",
@@ -344,6 +366,7 @@ const LoadedList = ({ model, address, scope, heading }) => {
 		className: "flex min-h-0 flex-1 flex-col gap-3 px-5 py-4",
 		children: [
 			remove.dialogs,
+			exportFlow.dialogs,
 			/* @__PURE__ */ jsx(PageHeader, {
 				title: heading?.title ?? plural,
 				subtitle: heading ? heading.subtitle : view?.help,
@@ -352,10 +375,12 @@ const LoadedList = ({ model, address, scope, heading }) => {
 					displaySwitch(false),
 					saveSearch,
 					importButton,
+					exportButton,
 					createButton
 				] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
 					saveSearch,
 					importButton,
+					exportButton,
 					createButton
 				] })
 			}),

package/dist/app/meta-gate.js

@@ -19,10 +19,10 @@ const Notice = ({ title, children }) => /* @__PURE__ */ jsx("div", {
 	children: /* @__PURE__ */ jsxs("div", {
 		className: "max-w-md text-center",
 		children: [/* @__PURE__ */ jsx("h1", {
-			className: "text-[15px] font-semibold",
+			className: "text-[16px] font-semibold",
 			children: title
 		}), /* @__PURE__ */ jsx("p", {
-			className: "mt-1 text-[13px] text-muted-foreground",
+			className: "mt-1 text-muted-foreground",
 			children
 		})]
 	})
@@ -69,7 +69,7 @@ const WithSources = ({ meta, children }) => {
 const MetaGate = ({ children }) => {
 	const meta = useMeta();
 	if (meta.isPending) return /* @__PURE__ */ jsxs("div", {
-		className: "flex h-full min-h-48 items-center justify-center gap-2 text-[13px] text-muted-foreground",
+		className: "flex h-full min-h-48 items-center justify-center gap-2 text-muted-foreground",
 		children: [/* @__PURE__ */ jsx(Spinner, {}), " Loading"]
 	});
 	if (meta.error) return /* @__PURE__ */ jsx(Notice, {

package/dist/app/pages/blocks/card-frame.js

@@ -10,10 +10,10 @@ const CardFrame = ({ title, description, actions, className, bodyClassName, chil
 		children: [/* @__PURE__ */ jsxs("div", {
 			className: "min-w-0",
 			children: [title && /* @__PURE__ */ jsx("h2", {
-				className: "text-[15px] font-semibold tracking-tight",
+				className: "text-[16px] font-semibold tracking-tight",
 				children: title
 			}), description && /* @__PURE__ */ jsx("p", {
-				className: "mt-0.5 text-[13px] text-muted-foreground",
+				className: "mt-0.5 text-muted-foreground",
 				children: description
 			})]
 		}), actions && /* @__PURE__ */ jsx("div", {
@@ -21,13 +21,13 @@ const CardFrame = ({ title, description, actions, className, bodyClassName, chil
 			children: actions
 		})]
 	}), /* @__PURE__ */ jsx("div", {
-		className: cn("min-w-0 flex-1 p-4 text-[13px]", bodyClassName),
+		className: cn("min-w-0 flex-1 p-4", bodyClassName),
 		children
 	})]
 });
 /** A short line in place of content: nothing to show, or not loaded yet. */
 const Quiet = ({ children }) => /* @__PURE__ */ jsx("p", {
-	className: "text-[13px] text-muted-foreground",
+	className: "text-muted-foreground",
 	children
 });
 //#endregion

package/dist/app/pages/blocks/field.js

@@ -25,10 +25,7 @@ const FieldBlock = ({ node }) => {
 		value: value.value,
 		format
 	});
-	if (label === false) return /* @__PURE__ */ jsx("div", {
-		className: "text-[13px]",
-		children: shown
-	});
+	if (label === false) return /* @__PURE__ */ jsx("div", { children: shown });
 	const text = label ?? fieldLabel(name, value.state === "ready" ? views[value.model.name]?.fields[value.field.name]?.label : void 0);
 	return /* @__PURE__ */ jsxs("div", {
 		className: "min-w-0",
@@ -36,7 +33,7 @@ const FieldBlock = ({ node }) => {
 			className: "text-xs text-muted-foreground",
 			children: text
 		}), /* @__PURE__ */ jsx("div", {
-			className: "mt-0.5 truncate text-[13px]",
+			className: "mt-0.5 truncate",
 			children: shown
 		})]
 	});

package/dist/app/pages/blocks/stat.js

@@ -14,7 +14,7 @@ const Count = ({ model, filter }) => {
 	const count = useCount(model, filter);
 	if (count.isPending) return /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-16" });
 	if (count.error) return /* @__PURE__ */ jsx("span", {
-		className: "text-[13px] text-danger-text",
+		className: "text-danger-text",
 		children: "Could not count"
 	});
 	return /* @__PURE__ */ jsx(AppLink, {
@@ -54,7 +54,7 @@ const StatBlock = ({ node }) => {
 		bodyClassName: "flex flex-col",
 		children: [
 			/* @__PURE__ */ jsx("p", {
-				className: "text-[13px] text-muted-foreground break-words",
+				className: "text-muted-foreground break-words",
 				children: label
 			}),
 			/* @__PURE__ */ jsxs("div", {

package/dist/app/pages/problem.js

@@ -3,7 +3,7 @@ import { jsx } from "react/jsx-runtime";
 /** A warning in place of something the app cannot draw, such as a component no one registered. */
 const Problem = ({ children }) => /* @__PURE__ */ jsx("div", {
 	role: "alert",
-	className: "rounded-lg border border-dashed border-warning bg-warning-soft p-3 text-[13px] text-warning-text",
+	className: "rounded-lg border border-dashed border-warning bg-warning-soft p-3 text-warning-text",
 	children
 });
 //#endregion

package/dist/app/pages/render-node.js

@@ -49,7 +49,7 @@ const renderChildren = (children) => {
 		const [first] = run;
 		if (!isInline(first)) return /* @__PURE__ */ jsx(RenderNode, { node: first }, index);
 		return /* @__PURE__ */ jsx("p", {
-			className: "text-[13px] leading-relaxed",
+			className: "leading-6",
 			children: run.map((child, position) => typeof child === "string" ? /* @__PURE__ */ jsx(Fragment, { children: child }, position) : /* @__PURE__ */ jsx(RenderNode, { node: child }, position))
 		}, index);
 	});

package/dist/app/record-page.js

@@ -323,7 +323,7 @@ const LoadedRecord = ({ model, recordKey, stored }) => {
 							})
 						}),
 						shown !== "form" && offersEdit && editor.dirty && /* @__PURE__ */ jsxs("div", {
-							className: "mt-4 flex items-center justify-between gap-3 rounded-lg border bg-surface px-3 py-2 text-[13px]",
+							className: "mt-4 flex items-center justify-between gap-3 rounded-lg border bg-surface px-3 py-2",
 							role: "status",
 							children: [/* @__PURE__ */ jsx("span", { children: "You have unsaved changes to this record." }), /* @__PURE__ */ jsxs("span", {
 								className: "flex gap-2",
@@ -339,7 +339,7 @@ const LoadedRecord = ({ model, recordKey, stored }) => {
 							})]
 						}),
 						shown === "form" && editor.restored && /* @__PURE__ */ jsxs("div", {
-							className: "mt-4 flex items-center justify-between gap-3 rounded-lg border bg-surface px-3 py-2 text-[13px]",
+							className: "mt-4 flex items-center justify-between gap-3 rounded-lg border bg-surface px-3 py-2",
 							role: "status",
 							children: [/* @__PURE__ */ jsx("span", { children: "Your unsaved changes were restored." }), /* @__PURE__ */ jsxs("span", {
 								className: "flex gap-2",

package/dist/app/record-row/record-row-body.js

@@ -68,7 +68,7 @@ const RecordRowBody = ({ model, view, filter, sort = "", display: named, limit,
 			showChips && chips.length > 0 || total !== void 0 || note ? /* @__PURE__ */ jsxs("div", {
 				className: "flex flex-wrap items-center justify-between gap-2",
 				children: [showChips && chips.length > 0 ? /* @__PURE__ */ jsx(FilterChipList, { chips }) : /* @__PURE__ */ jsx("span", {}), /* @__PURE__ */ jsxs("p", {
-					className: "flex flex-wrap gap-x-3 text-[13px] text-muted-foreground",
+					className: "flex flex-wrap gap-x-3 text-muted-foreground",
 					children: [note && /* @__PURE__ */ jsx("span", { children: note }), total !== void 0 && /* @__PURE__ */ jsx("span", {
 						className: "tabular-nums",
 						children: `${total.toLocaleString("en-GB")} ${total === 1 ? singular : plural.toLowerCase()}`
@@ -79,7 +79,7 @@ const RecordRowBody = ({ model, view, filter, sort = "", display: named, limit,
 				title: "Could not load",
 				error: rows.error
 			}) : !source || source.total === 0 ? /* @__PURE__ */ jsx("p", {
-				className: "text-[13px] text-muted-foreground",
+				className: "text-muted-foreground",
 				children: empty ?? `No ${plural.toLowerCase()} match.`
 			}) : /* @__PURE__ */ jsx(RecordRow, {
 				model,
@@ -98,7 +98,7 @@ const RecordRowBody = ({ model, view, filter, sort = "", display: named, limit,
 					resource: list
 				}),
 				onClick: viewAll?.onOpen,
-				className: "flex items-center gap-1 self-end text-[13px] font-medium text-primary-text hover:underline",
+				className: "flex items-center gap-1 self-end font-medium text-primary-text hover:underline",
 				children: [viewAll?.label ?? /* @__PURE__ */ jsxs(Fragment$1, { children: ["View all ", /* @__PURE__ */ jsx("span", {
 					className: "sr-only",
 					children: plural.toLowerCase()

package/dist/app/record-row/saved-record-row.js

@@ -25,7 +25,7 @@ const SavedRecordRow = ({ model, view, empty, ...props }) => {
 	if (!saved.data) return /* @__PURE__ */ jsx(Skeleton, { className: "h-24" });
 	const scope = savedScope(listed.model, saved.data);
 	if (!scope) return /* @__PURE__ */ jsx("p", {
-		className: "text-[13px] text-muted-foreground",
+		className: "text-muted-foreground",
 		children: empty ?? `No ${plural} yet.`
 	});
 	return /* @__PURE__ */ jsx(RecordRowBody, {

package/dist/app/related-section.js

@@ -62,7 +62,7 @@ const Loading = () => /* @__PURE__ */ jsx("div", {
 	children: Array.from({ length: 3 }, (_, index) => /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-full" }, index))
 });
 const Empty = ({ text }) => /* @__PURE__ */ jsx("p", {
-	className: "text-[13px] text-muted-foreground",
+	className: "text-muted-foreground",
 	children: text ?? "Nothing here yet."
 });
 /**

package/dist/app/relation-picker.js

@@ -38,7 +38,7 @@ const RelationPicker = ({ target, view, value, label, invalid, onChange }) => {
 			onChange: (event) => setText(event.target.value)
 		}), open && /* @__PURE__ */ jsxs("ul", {
 			role: "listbox",
-			className: "absolute z-30 mt-1 max-h-60 w-full overflow-y-auto rounded-md border bg-background py-1 text-[13px] shadow-pop",
+			className: "absolute z-30 mt-1 max-h-60 w-full overflow-y-auto rounded-md border bg-background py-1 shadow-pop",
 			children: [
 				options.data?.items.map((item) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("button", {
 					type: "button",

package/dist/app/runtime/runtime-update.js

@@ -7,7 +7,7 @@ import { ArrowUpCircle } from "lucide-react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/app/runtime/runtime-update.tsx
 const Row = ({ label, value }) => /* @__PURE__ */ jsxs("div", {
-	className: "flex justify-between gap-4 py-1 text-[13px]",
+	className: "flex justify-between gap-4 py-1",
 	children: [/* @__PURE__ */ jsx("span", {
 		className: "text-muted-foreground",
 		children: label
@@ -60,11 +60,11 @@ const RuntimeUpdate = ({ client }) => {
 			}),
 			error !== void 0 && /* @__PURE__ */ jsx("p", {
 				role: "alert",
-				className: "mt-3 text-[13px] text-danger-text",
+				className: "mt-3 text-danger-text",
 				children: updateErrorText(error)
 			}),
 			checkError !== void 0 && /* @__PURE__ */ jsx("p", {
-				className: "mt-3 text-[13px] text-muted-foreground",
+				className: "mt-3 text-muted-foreground",
 				children: "The status could not be checked again; this is the last one read."
 			})
 		]

package/dist/app/saved/saved-list.js

@@ -30,7 +30,7 @@ const SavedList = ({ model, view, target, children }) => {
 	}));
 	const scope = savedScope(target, saved.data);
 	if (!scope) return frame(/* @__PURE__ */ jsxs("p", {
-		className: "py-8 text-center text-[13px] text-muted-foreground",
+		className: "py-8 text-center text-muted-foreground",
 		children: [
 			"No ",
 			plural.toLowerCase(),

package/dist/app/searches/saved-search-rows.js

@@ -25,7 +25,7 @@ const SearchRowItem = ({ model, view, target, targetView, row }) => {
 		"aria-label": title,
 		className: "flex flex-col gap-3 py-4 first:pt-0 last:pb-0",
 		children: [/* @__PURE__ */ jsx("h3", {
-			className: "text-[14px] font-semibold",
+			className: "text-[15px] font-semibold",
 			children: /* @__PURE__ */ jsx(AppLink, {
 				to: {
 					kind: "record",
@@ -55,7 +55,7 @@ const SavedSearchRows = ({ model, view, empty }) => {
 	});
 	if (!saved.data) return /* @__PURE__ */ jsx(Skeleton, { className: "h-40" });
 	if (saved.data.length === 0) return /* @__PURE__ */ jsx("p", {
-		className: "text-[13px] text-muted-foreground",
+		className: "text-muted-foreground",
 		children: empty ?? `No ${plural} yet.`
 	});
 	return /* @__PURE__ */ jsx("div", {

package/dist/app/searches/saved-search-section.js

@@ -53,7 +53,7 @@ const SavedSearchSection = ({ model, view, of, target, targetView, row, recordKe
 				children: [/* @__PURE__ */ jsx("div", {
 					className: "flex min-w-0 flex-col gap-2",
 					children: /* @__PURE__ */ jsx("h2", {
-						className: "text-[15px] font-semibold",
+						className: "text-[16px] font-semibold",
 						children: /* @__PURE__ */ jsx(AppLink, {
 							to: {
 								kind: "record",

package/dist/app/searches/saved-searches.js

@@ -58,7 +58,7 @@ const SavedSearches = ({ model, view }) => {
 	if (saved.data.length === 0) {
 		const searched = (targetView?.names?.plural ?? humanize(target.name)).toLowerCase();
 		return frame(/* @__PURE__ */ jsxs("p", {
-			className: "py-8 text-center text-[13px] text-muted-foreground",
+			className: "py-8 text-center text-muted-foreground",
 			children: [
 				"No ",
 				plural.toLowerCase(),