@protobase/ui 0.25.1 → 0.25.3

package/dist/app/displays/custom-display.js

@@ -1,9 +1,11 @@
+import { slotted } from "../../locale/slotted.js";
 import { Problem } from "../pages/problem.js";
 import { CustomBoundary } from "../pages/custom-boundary.js";
+import { text } from "./messages.js";
 import { useProjectUi } from "../pages/project-ui.js";
 import { ListDisplayProvider } from "./display-context.js";
 import { unmarkFieldRefs } from "@protobase/schema/internal";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 //#region src/app/displays/custom-display.tsx
 /**
 * A display the project draws: the component registered under its name gets the display's props, field references
@@ -12,11 +14,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 const CustomDisplay = ({ display, list }) => {
 	const { components } = useProjectUi();
 	const Component = components?.[display.component];
-	if (!Component) return /* @__PURE__ */ jsxs(Problem, { children: [
-		"No component is registered as ",
-		display.component,
-		". Export it from protobase.ui.tsx, or load the plugin that provides it."
-	] });
+	if (!Component) return /* @__PURE__ */ jsx(Problem, { children: slotted(text("noComponent"), display.component) });
 	return /* @__PURE__ */ jsx(ListDisplayProvider, {
 		value: list,
 		children: /* @__PURE__ */ jsx("div", {

package/dist/app/displays/display-frame.js

@@ -1,5 +1,6 @@
 import { formatTag } from "../../locale/active-locale.js";
 import { Button } from "../../primitives/button.js";
+import { text } from "./messages.js";
 import { ErrorBanner } from "../error-banner.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/app/displays/display-frame.tsx
@@ -7,7 +8,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 const DisplayState = ({ list, empty, loading, children }) => /* @__PURE__ */ jsx("div", {
 	className: "min-h-0 flex-1 overflow-y-auto",
 	children: list.loading ? loading : list.error ? /* @__PURE__ */ jsx(ErrorBanner, {
-		title: "Could not load rows",
+		title: text("couldNotLoadRows"),
 		error: list.error
 	}) : list.rows.length === 0 ? /* @__PURE__ */ jsx("p", {
 		className: "py-8 text-center text-muted-foreground",
@@ -24,7 +25,7 @@ const DisplayFooter = ({ list }) => /* @__PURE__ */ jsxs("div", {
 	] }), list.more && /* @__PURE__ */ jsx(Button, {
 		size: "sm",
 		onClick: list.loadMore,
-		children: "Show more"
+		children: text("showMore")
 	})]
 });
 //#endregion

package/dist/app/displays/list-cards.js

@@ -1,10 +1,11 @@
 import { Skeleton } from "../../primitives/skeleton.js";
 import { humanize } from "../../live/naming.js";
+import { text } from "./messages.js";
 import { displayRow } from "./list-displays.js";
 import { ErrorBanner } from "../error-banner.js";
 import { RecordCard } from "./record-card.js";
 import { VirtualCards } from "./virtual-cards.js";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 //#region src/app/displays/list-cards.tsx
 const grid = "grid grid-cols-[repeat(auto-fill,minmax(15rem,1fr))] gap-3";
 const pictureHeight = (width) => width * .75;
@@ -21,16 +22,12 @@ const ListCards = ({ model, view, display, list, empty }) => {
 		children: Array.from({ length: 6 }, (_, index) => /* @__PURE__ */ jsx(Skeleton, { className: "h-24" }, index))
 	});
 	if (list.error) return /* @__PURE__ */ jsx(ErrorBanner, {
-		title: "Could not load rows",
+		title: text("couldNotLoadRows"),
 		error: list.error
 	});
-	if (!list.source || list.source.total === 0) return empty ?? /* @__PURE__ */ jsxs("p", {
+	if (!list.source || list.source.total === 0) return empty ?? /* @__PURE__ */ jsx("p", {
 		className: "py-8 text-center text-muted-foreground",
-		children: [
-			"No ",
-			plural.toLowerCase(),
-			" match."
-		]
+		children: text("noneMatch", plural.toLowerCase())
 	});
 	return /* @__PURE__ */ jsx(VirtualCards, {
 		source: list.source,

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

@@ -4,8 +4,8 @@ import { listColumnNames } from "../../live/columns-from-model.js";
 import { displayValue } from "../../live/display-value.js";
 import { photosKey } from "../../live/row-photos.js";
 import { filledFields } from "../filled-fields.js";
-import { boardCard } from "./board-columns.js";
 import { text } from "./messages.js";
+import { boardCard } from "./board-columns.js";
 import { encodeKey, tableDisplay } from "@protobase/schema/internal";
 //#region src/app/displays/list-displays.ts
 const displaysOf = (view) => view?.list?.displays ?? [];
@@ -36,7 +36,7 @@ const phoneRows = (model, view) => {
 	return {
 		kind: "cards",
 		name: rowsDisplay,
-		label: "List",
+		label: text("list"),
 		icon: "list",
 		title,
 		...badge !== void 0 && { badge },
@@ -81,7 +81,7 @@ const listDisplayChoices = (model, view, xs) => {
 	const choices = displayChoices(view);
 	return xs && phoneRows(model, view) ? [...choices, {
 		name: rowsDisplay,
-		label: "List",
+		label: text("list"),
 		icon: "list"
 	}] : choices;
 };

package/dist/app/displays/map-display.js

@@ -1,8 +1,9 @@
-import { cn } from "../../lib/cn.js";
 import { formatTag } from "../../locale/active-locale.js";
+import { cn } from "../../lib/cn.js";
 import { Button } from "../../primitives/button.js";
 import { Problem } from "../pages/problem.js";
 import { humanize } from "../../live/naming.js";
+import { text } from "./messages.js";
 import { mapCards } from "./list-displays.js";
 import { useAdminMeta } from "../meta-gate.js";
 import { ErrorBanner } from "../error-banner.js";
@@ -54,15 +55,15 @@ const MapDisplay = ({ model, view, display, filter, orderBy, fields, at, onMove,
 	const approximate = new Set(points.filter((point) => point.approximate).map((point) => point.key));
 	const markerLabel = (keys) => {
 		const near = keys.filter((key) => approximate.has(key)).length;
-		if (keys.length === 1) return near === 1 ? `Show the ${singular}, at an approximate position` : `Show the ${singular}`;
-		if (near === 0) return `Show ${keys.length} ${plural}`;
-		return near === keys.length ? `Show ${keys.length} ${plural}, at approximate positions` : `Show ${keys.length} ${plural}, ${near} at approximate positions`;
+		if (keys.length === 1) return near === 1 ? text("showOneApproximate", singular) : text("showOne", singular);
+		if (near === 0) return text("showMany", keys.length, plural);
+		return near === keys.length ? text("showManyApproximate", keys.length, plural) : text("showManySomeApproximate", keys.length, plural, near);
 	};
-	const bucketLabel = (count) => `Zoom in on ${count.toLocaleString(formatTag())} ${count === 1 ? singular : plural}`;
+	const bucketLabel = (count) => text("zoomIn", count.toLocaleString(formatTag()), count === 1 ? singular : plural);
 	const overlay = useRef(null);
 	const [covered, setCovered] = useState(0);
 	useLayoutEffect(() => setCovered(overlay.current?.offsetHeight ?? 0), [row?.key]);
-	if (!style) return /* @__PURE__ */ jsx(Problem, { children: "The map display needs a map style: set PROTOBASE_MAP_STYLE_URL." });
+	if (!style) return /* @__PURE__ */ jsx(Problem, { children: text("needsStyle") });
 	const empty = loaded?.total === 0;
 	return /* @__PURE__ */ jsxs("div", {
 		className: cn("flex h-full min-h-[36rem] flex-1 flex-col sm:min-h-[28rem]", flush && "max-md:-mx-5 max-md:-mb-4 max-md:min-h-0"),
@@ -97,7 +98,7 @@ const MapDisplay = ({ model, view, display, filter, orderBy, fields, at, onMove,
 				records.error && /* @__PURE__ */ jsx("div", {
 					className: "absolute inset-x-3 top-3 z-10",
 					children: /* @__PURE__ */ jsx(ErrorBanner, {
-						title: "Could not load rows",
+						title: text("couldNotLoadRows"),
 						error: records.error
 					})
 				}),
@@ -106,10 +107,10 @@ const MapDisplay = ({ model, view, display, filter, orderBy, fields, at, onMove,
 					children: /* @__PURE__ */ jsxs("p", {
 						className: "pointer-events-auto flex items-center gap-3 rounded-full border border-border bg-background px-4 py-1.5 text-muted-foreground shadow",
 						role: "status",
-						children: [fitting ? `No ${plural} match.` : `No ${plural} in this part of the map.`, !fitting && /* @__PURE__ */ jsx(Button, {
+						children: [fitting ? text("noneMatch", plural) : text("noneHere", plural), !fitting && /* @__PURE__ */ jsx(Button, {
 							size: "sm",
 							onClick: () => setFitting(true),
-							children: "Show all"
+							children: text("showAll")
 						})]
 					})
 				}),
@@ -119,7 +120,7 @@ const MapDisplay = ({ model, view, display, filter, orderBy, fields, at, onMove,
 					children: /* @__PURE__ */ jsxs("div", {
 						className: "pointer-events-auto flex w-full max-w-[16rem] flex-col gap-2 sm:max-w-xs",
 						role: "group",
-						"aria-label": `Chosen ${singular}`,
+						"aria-label": text("chosen", singular),
 						children: [/* @__PURE__ */ jsxs("div", {
 							className: "flex items-center justify-end gap-1.5",
 							children: [
@@ -128,12 +129,12 @@ const MapDisplay = ({ model, view, display, filter, orderBy, fields, at, onMove,
 									children: [/* @__PURE__ */ jsx(CircleDashed, {
 										className: "size-3.5",
 										"aria-hidden": true
-									}), "Approximate position"]
+									}), text("approximatePosition")]
 								}),
 								selection.keys.length > 1 && /* @__PURE__ */ jsxs(Fragment$1, { children: [
 									/* @__PURE__ */ jsx("button", {
 										type: "button",
-										"aria-label": "Previous",
+										"aria-label": text("previous"),
 										className: arrow,
 										onClick: () => setChosen(stepSelection(selection, -1)),
 										children: /* @__PURE__ */ jsx(ChevronLeft, {
@@ -152,7 +153,7 @@ const MapDisplay = ({ model, view, display, filter, orderBy, fields, at, onMove,
 									}),
 									/* @__PURE__ */ jsx("button", {
 										type: "button",
-										"aria-label": "Next",
+										"aria-label": text("next"),
 										className: arrow,
 										onClick: () => setChosen(stepSelection(selection, 1)),
 										children: /* @__PURE__ */ jsx(ChevronRight, {
@@ -163,7 +164,7 @@ const MapDisplay = ({ model, view, display, filter, orderBy, fields, at, onMove,
 								] }),
 								/* @__PURE__ */ jsx("button", {
 									type: "button",
-									"aria-label": "Close",
+									"aria-label": text("close"),
 									className: arrow,
 									onClick: () => setChosen(void 0),
 									children: /* @__PURE__ */ jsx(X, {

package/dist/app/displays/messages.js

@@ -11,7 +11,62 @@ const text = defineMessages({
 		orderChanged: "Order changed",
 		stayedIn: (column) => `Saved, still in ${column}`,
 		undo: "Undo",
-		couldNotUndo: "Could not undo"
+		couldNotUndo: "Could not undo",
+		couldNotLoadRows: "Could not load rows",
+		noPlural: (plural) => `No ${plural}`,
+		noValue: (label) => `No ${label.toLowerCase()}`,
+		somethingWrong: "Something went wrong",
+		showMore: "Show more",
+		noDrop: "No board drop is registered as {}. Give it in boardDrops in protobase.ui.tsx, or load the plugin that provides it.",
+		noComponent: "No component is registered as {}. Export it from protobase.ui.tsx, or load the plugin that provides it.",
+		pickedUp: (title) => `Picked up ${title}.`,
+		isOver: (title, over) => `${title} is over ${over}.`,
+		putBack: (title) => `${title} was put back.`,
+		wasMovedTo: (title, to) => `${title} was moved to ${to}.`,
+		cancelled: (title) => `Moving ${title} was cancelled.`,
+		startsOn: (title, day) => `${title} starts on ${day}.`,
+		noColumn: "no column",
+		noDay: "no day",
+		placeOf: (column, place, count) => `${column}, place ${place} of ${count}`,
+		place: (column, place) => `${column}, place ${place}`,
+		boardAcross: "To move a card to another column, press Space, move it with the left and right arrow keys, and press Space again to drop it there. Escape puts it back.",
+		boardAnywhere: "To move a card, press Space, move it with the up and down arrow keys within its column and the left and right arrow keys to another column, and press Space again to drop it there. Escape puts it back.",
+		boardWithin: "To move a card, press Space, move it with the up and down arrow keys within its column, and press Space again to drop it there. Escape puts it back.",
+		calendarInstructions: "To move an event to another day, press Space, move it a day with the left and right arrow keys or a week with the up and down arrow keys, and press Space again to drop it there. Escape puts it back.",
+		timelineInstructions: "To move a bar to other days, press Space, move it a day with the left and right arrow keys, and press Space again to drop it there. Escape puts it back.",
+		week: "Week",
+		month: "Month",
+		quarter: "Quarter",
+		calendarScale: "Calendar scale",
+		timelineScale: "Timeline scale",
+		previousPeriod: (unit) => `Previous ${unit}`,
+		nextPeriod: (unit) => `Next ${unit}`,
+		today: "Today",
+		capped: (limit, unit) => `Showing the first ${limit} records of this ${unit}. Narrow the filter to see the rest.`,
+		nothingIn: (unit) => `Nothing in this ${unit}.`,
+		photoOf: (index, count) => `Photo ${index} of ${count}`,
+		noneMatch: (plural) => `No ${plural} match.`,
+		list: "List",
+		showOneApproximate: (singular) => `Show the ${singular}, at an approximate position`,
+		showOne: (singular) => `Show the ${singular}`,
+		showMany: (count, plural) => `Show ${count} ${plural}`,
+		showManyApproximate: (count, plural) => `Show ${count} ${plural}, at approximate positions`,
+		showManySomeApproximate: (count, plural, near) => `Show ${count} ${plural}, ${near} at approximate positions`,
+		zoomIn: (count, noun) => `Zoom in on ${count} ${noun}`,
+		needsStyle: "The map display needs a map style: set PROTOBASE_MAP_STYLE_URL.",
+		noneHere: (plural) => `No ${plural} in this part of the map.`,
+		showAll: "Show all",
+		chosen: (singular) => `Chosen ${singular}`,
+		approximatePosition: "Approximate position",
+		previous: "Previous",
+		next: "Next",
+		close: "Close",
+		features: "Features",
+		couldNotReorder: "Could not change the order",
+		couldNotMoveTo: (to) => `Could not move it to ${to}`,
+		moreHidden: (count) => `+${count} more`,
+		previousPhoto: "Previous photo",
+		nextPhoto: "Next photo"
 	},
 	nl: {
 		table: "Tabel",
@@ -23,7 +78,78 @@ const text = defineMessages({
 		orderChanged: "Volgorde gewijzigd",
 		stayedIn: (column) => `Opgeslagen, nog in ${column}`,
 		undo: "Ongedaan maken",
-		couldNotUndo: "Kon niet ongedaan maken"
+		couldNotUndo: "Kon niet ongedaan maken",
+		couldNotLoadRows: "Kon de rijen niet laden",
+		noPlural: (plural) => `Geen ${plural}`,
+		noValue: (label) => `Geen ${label.toLowerCase()}`,
+		somethingWrong: "Er ging iets mis",
+		showMore: "Meer tonen",
+		noDrop: "Er is geen bordactie geregistreerd als {}. Geef die in boardDrops in protobase.ui.tsx, of laad de plug-in die haar levert.",
+		noComponent: "Er is geen component geregistreerd als {}. Exporteer die uit protobase.ui.tsx, of laad de plug-in die haar levert.",
+		pickedUp: (title) => `${title} opgepakt.`,
+		isOver: (title, over) => `${title} is boven ${over}.`,
+		putBack: (title) => `${title} is teruggezet.`,
+		wasMovedTo: (title, to) => `${title} is verplaatst naar ${to}.`,
+		cancelled: (title) => `Verplaatsen van ${title} is geannuleerd.`,
+		startsOn: (title, day) => `${title} begint op ${day}.`,
+		noColumn: "geen kolom",
+		noDay: "geen dag",
+		placeOf: (column, place, count) => `${column}, plaats ${place} van ${count}`,
+		place: (column, place) => `${column}, plaats ${place}`,
+		boardAcross: "Druk op Spatie om een kaart naar een andere kolom te verplaatsen, verplaats haar met de pijltjestoetsen links en rechts, en druk nogmaals op Spatie om haar daar neer te zetten. Escape zet haar terug.",
+		boardAnywhere: "Druk op Spatie om een kaart te verplaatsen, verplaats haar met de pijltjestoetsen omhoog en omlaag binnen haar kolom en met links en rechts naar een andere kolom, en druk nogmaals op Spatie om haar daar neer te zetten. Escape zet haar terug.",
+		boardWithin: "Druk op Spatie om een kaart te verplaatsen, verplaats haar met de pijltjestoetsen omhoog en omlaag binnen haar kolom, en druk nogmaals op Spatie om haar daar neer te zetten. Escape zet haar terug.",
+		calendarInstructions: "Druk op Spatie om een gebeurtenis naar een andere dag te verplaatsen, verplaats haar een dag met de pijltjestoetsen links en rechts of een week met omhoog en omlaag, en druk nogmaals op Spatie om haar daar neer te zetten. Escape zet haar terug.",
+		timelineInstructions: "Druk op Spatie om een balk naar andere dagen te verplaatsen, verplaats hem een dag met de pijltjestoetsen links en rechts, en druk nogmaals op Spatie om hem daar neer te zetten. Escape zet hem terug.",
+		week: "Week",
+		month: "Maand",
+		quarter: "Kwartaal",
+		calendarScale: "Schaal van de kalender",
+		timelineScale: "Schaal van de tijdlijn",
+		previousPeriod: (unit) => ({
+			week: "Vorige week",
+			month: "Vorige maand",
+			quarter: "Vorig kwartaal"
+		})[unit],
+		nextPeriod: (unit) => ({
+			week: "Volgende week",
+			month: "Volgende maand",
+			quarter: "Volgend kwartaal"
+		})[unit],
+		today: "Vandaag",
+		capped: (limit, unit) => `De eerste ${limit} records van ${{
+			week: "deze week",
+			month: "deze maand",
+			quarter: "dit kwartaal"
+		}[unit]} worden getoond. Verfijn het filter om de rest te zien.`,
+		nothingIn: (unit) => `Niets in ${{
+			week: "deze week",
+			month: "deze maand",
+			quarter: "dit kwartaal"
+		}[unit]}.`,
+		photoOf: (index, count) => `Foto ${index} van ${count}`,
+		noneMatch: (plural) => `Geen ${plural} gevonden.`,
+		list: "Lijst",
+		showOneApproximate: (singular) => `${singular} tonen, op een geschatte plek`,
+		showOne: (singular) => `${singular} tonen`,
+		showMany: (count, plural) => `${count} ${plural} tonen`,
+		showManyApproximate: (count, plural) => `${count} ${plural} tonen, op geschatte plekken`,
+		showManySomeApproximate: (count, plural, near) => `${count} ${plural} tonen, ${near} op geschatte plekken`,
+		zoomIn: (count, noun) => `Inzoomen op ${count} ${noun}`,
+		needsStyle: "De kaartweergave heeft een kaartstijl nodig: stel PROTOBASE_MAP_STYLE_URL in.",
+		noneHere: (plural) => `Geen ${plural} in dit deel van de kaart.`,
+		showAll: "Alles tonen",
+		chosen: (singular) => `Gekozen ${singular}`,
+		approximatePosition: "Geschatte plek",
+		previous: "Vorige",
+		next: "Volgende",
+		close: "Sluiten",
+		features: "Kenmerken",
+		couldNotReorder: "Kon de volgorde niet wijzigen",
+		couldNotMoveTo: (to) => `Kon het niet naar ${to} verplaatsen`,
+		moreHidden: (count) => `+${count} meer`,
+		previousPhoto: "Vorige foto",
+		nextPhoto: "Volgende foto"
 	}
 });
 //#endregion

package/dist/app/displays/period-controls.js

@@ -1,5 +1,6 @@
 import { segmentedClass } from "../../primitives/segmented.js";
 import { buttonClass } from "../../primitives/button.js";
+import { text } from "./messages.js";
 import { AppLink } from "../use-app-address.js";
 import { Fragment } from "react";
 import { ChevronLeft, ChevronRight } from "lucide-react";
@@ -38,9 +39,9 @@ const PeriodControls = ({ heading, unit, previous, today, next, scales, scalesLa
 			children: [/* @__PURE__ */ jsxs("div", {
 				className: "flex items-center gap-1",
 				children: [
-					control(previous, square, `Previous ${unit}`, /* @__PURE__ */ jsx(ChevronLeft, { className: "size-3.5" })),
-					control(today, square, "Today", "Today"),
-					control(next, square, `Next ${unit}`, /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5" }))
+					control(previous, square, text("previousPeriod", unit), /* @__PURE__ */ jsx(ChevronLeft, { className: "size-3.5" })),
+					control(today, square, text("today"), text("today")),
+					control(next, square, text("nextPeriod", unit), /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5" }))
 				]
 			}), /* @__PURE__ */ jsx("span", {
 				role: "group",

package/dist/app/displays/record-card.js

@@ -5,6 +5,7 @@ import { markdownExcerpt } from "../../markdown/markdown-excerpt.js";
 import { isMarkdown } from "../../markdown/markdown-hint.js";
 import { recordKey } from "../../live/model-helpers.js";
 import { displayValue } from "../../live/display-value.js";
+import { text } from "./messages.js";
 import { amountParts, cardFields, filledAmount, filledMeta } from "./list-displays.js";
 import { AppLink } from "../use-app-address.js";
 import { useProjectUi } from "../pages/project-ui.js";
@@ -41,7 +42,7 @@ const MetaValue = ({ icon, children }) => {
 const RecordCard = ({ model, view, display, row, swipe = true, mark }) => {
 	const { image, title, subtitle, amount, badge, meta, footer, flags } = cardFields(model, view, display);
 	const label = (name) => view?.fields[name]?.label ?? humanize(name);
-	const text = (name) => {
+	const text$1 = (name) => {
 		const field = model.fields[name];
 		if (!field) return "";
 		const value = row.record[name];
@@ -59,8 +60,8 @@ const RecordCard = ({ model, view, display, row, swipe = true, mark }) => {
 			part: "display",
 			field,
 			value: row.record[name],
-			fallback: text(name)
-		}) : text(name);
+			fallback: text$1(name)
+		}) : text$1(name);
 	};
 	const subtitleValue = (name) => {
 		const field = model.fields[name];
@@ -79,7 +80,7 @@ const RecordCard = ({ model, view, display, row, swipe = true, mark }) => {
 		return /* @__PURE__ */ jsx(ValueBadge, {
 			value,
 			hints,
-			children: text(name)
+			children: text$1(name)
 		});
 	};
 	const amountValue = (name) => {
@@ -114,7 +115,7 @@ const RecordCard = ({ model, view, display, row, swipe = true, mark }) => {
 			}), badge !== void 0 && status !== null && status !== void 0 && /* @__PURE__ */ jsx(ValueBadge, {
 				value: status,
 				hints: view?.fields[badge],
-				children: text(badge)
+				children: text$1(badge)
 			})]
 		}),
 		subtitle !== void 0 && /* @__PURE__ */ jsx("span", {
@@ -140,7 +141,7 @@ const RecordCard = ({ model, view, display, row, swipe = true, mark }) => {
 		}),
 		raised.length > 0 && /* @__PURE__ */ jsx("ul", {
 			className: "flex flex-wrap gap-1",
-			"aria-label": "Features",
+			"aria-label": text("features"),
 			children: raised.map((name) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Badge, {
 				dot: false,
 				children: label(name)

package/dist/app/displays/timeline-display.js

@@ -2,6 +2,7 @@ import { Skeleton } from "../../primitives/skeleton.js";
 import { dayIn, viewerZone } from "../../format/zone.js";
 import { formatDate } from "../../format/date.js";
 import { humanize } from "../../live/naming.js";
+import { text } from "./messages.js";
 import { usePermissions } from "../meta-gate.js";
 import { ErrorBanner } from "../error-banner.js";
 import { can, rowAllows } from "../permissions.js";
@@ -17,18 +18,18 @@ import { useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { DndContext, DragOverlay, KeyboardSensor, MouseSensor, TouchSensor, useSensor, useSensors } from "@dnd-kit/core";
 //#region src/app/displays/timeline-display.tsx
-const scales = [
+const scales = () => [
 	{
 		scale: "week",
-		label: "Week"
+		label: text("week")
 	},
 	{
 		scale: "month",
-		label: "Month"
+		label: text("month")
 	},
 	{
 		scale: "quarter",
-		label: "Quarter"
+		label: text("quarter")
 	}
 ];
 /**
@@ -90,11 +91,11 @@ const TimelineDisplay = ({ model, view, display, fields, filter, at, linkTo, now
 	const title = (picked) => eventTitle(model, view, display, picked.row);
 	const startText = (picked) => formatDate(Date.parse(`${addDays(picked.day, shift.current)}T00:00:00Z`));
 	const announcements = {
-		onDragStart: ({ active: picked }) => `Picked up ${title(picked.data.current)}.`,
-		onDragMove: ({ active: picked }) => `${title(picked.data.current)} starts on ${startText(picked.data.current)}.`,
+		onDragStart: ({ active: picked }) => text("pickedUp", title(picked.data.current)),
+		onDragMove: ({ active: picked }) => text("startsOn", title(picked.data.current), startText(picked.data.current)),
 		onDragOver: () => void 0,
-		onDragEnd: ({ active: picked }) => shift.current === 0 ? `${title(picked.data.current)} was put back.` : `${title(picked.data.current)} was moved to ${startText(picked.data.current)}.`,
-		onDragCancel: ({ active: picked }) => `Moving ${title(picked.data.current)} was cancelled.`
+		onDragEnd: ({ active: picked }) => shift.current === 0 ? text("putBack", title(picked.data.current)) : text("wasMovedTo", title(picked.data.current), startText(picked.data.current)),
+		onDragCancel: ({ active: picked }) => text("cancelled", title(picked.data.current))
 	};
 	const release = () => {
 		setActive(void 0);
@@ -127,28 +128,22 @@ const TimelineDisplay = ({ model, view, display, fields, filter, at, linkTo, now
 					day: today
 				}, now),
 				next: stepTimeline(shown, 1),
-				scales: scales.map(({ scale, label }) => ({
+				scales: scales().map(({ scale, label }) => ({
 					view: scaledTimeline(shown, scale, now),
 					label,
 					current: shown.scale === scale
 				})),
-				scalesLabel: "Timeline scale",
+				scalesLabel: text("timelineScale"),
 				linkTo,
 				onView: setLocal
 			}),
 			list.error && /* @__PURE__ */ jsx(ErrorBanner, {
-				title: "Could not load rows",
+				title: text("couldNotLoadRows"),
 				error: list.error
 			}),
-			list.capped && /* @__PURE__ */ jsxs("p", {
+			list.capped && /* @__PURE__ */ jsx("p", {
 				className: "text-xs text-muted-foreground",
-				children: [
-					"Showing the first ",
-					500,
-					" records of this ",
-					shown.scale,
-					". Narrow the filter to see the rest."
-				]
+				children: text("capped", 500, shown.scale)
 			}),
 			/* @__PURE__ */ jsxs(DndContext, {
 				sensors,
@@ -159,7 +154,7 @@ const TimelineDisplay = ({ model, view, display, fields, filter, at, linkTo, now
 				onDragCancel: release,
 				accessibility: {
 					announcements,
-					screenReaderInstructions: { draggable: "To move a bar to other days, press Space, move it a day with the left and right arrow keys, and press Space again to drop it there. Escape puts it back." }
+					screenReaderInstructions: { draggable: text("timelineInstructions") }
 				},
 				children: [/* @__PURE__ */ jsxs("div", {
 					className: "overflow-hidden rounded-lg border border-border",
@@ -181,13 +176,9 @@ const TimelineDisplay = ({ model, view, display, fields, filter, at, linkTo, now
 								className: "relative flex flex-col gap-2 p-2",
 								children: [/* @__PURE__ */ jsx(Skeleton, { className: "h-4" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-4" })]
 							}),
-							empty && /* @__PURE__ */ jsxs("p", {
+							empty && /* @__PURE__ */ jsx("p", {
 								className: "relative px-2 py-3 text-xs text-muted-foreground",
-								children: [
-									"Nothing in this ",
-									shown.scale,
-									"."
-								]
+								children: text("nothingIn", shown.scale)
 							}),
 							!list.loading && lanes.map((lane) => /* @__PURE__ */ jsxs("section", {
 								"aria-label": lane.label,

package/dist/app/displays/timeline-range.js

@@ -2,6 +2,7 @@ import { dayIn, viewerZone } from "../../format/zone.js";
 import { formatDayRange, formatMonth, formatMonthName, formatMonthRange, formatWeekday } from "../../format/date.js";
 import { humanize } from "../../live/naming.js";
 import { displayValue } from "../../live/display-value.js";
+import { text } from "./messages.js";
 import { addDays, monday, monthOf, recordDays } from "./calendar-range.js";
 //#region src/app/displays/timeline-range.ts
 const dayMs = 864e5;
@@ -114,7 +115,7 @@ const timelineLanes = (rows, model, view, display) => {
 		const value = row.record[group];
 		const empty = value === null || value === void 0 || value === "";
 		const key = empty ? noValue : `value:${String(value)}`;
-		const label = empty ? `No ${(hints?.label ?? humanize(group)).toLowerCase()}` : row.labels[group] ?? displayValue(field, value, hints);
+		const label = empty ? text("noValue", hints?.label ?? humanize(group)) : row.labels[group] ?? displayValue(field, value, hints);
 		const known = lanes.get(key) ?? {
 			value: empty ? void 0 : value,
 			lane: {

package/dist/app/displays/use-board-move.js

@@ -1,8 +1,8 @@
 import { useClient } from "../../data/api-provider.js";
 import { useToast } from "../../toasts/toast-provider.js";
 import { recordKey } from "../../live/model-helpers.js";
-import { refusalReason } from "./board-columns.js";
 import { text } from "./messages.js";
+import { refusalReason } from "./board-columns.js";
 import { useRefreshResource } from "../pages/use-layout-data.js";
 import { dropWrite } from "./board-drop.js";
 import { boardWrites, placeOps } from "./board-place.js";
@@ -115,7 +115,7 @@ const useBoardMove = ({ model, by, rank, drop, labelOf }) => {
 		},
 		onError: (error, { row, to }) => {
 			settle(row.key);
-			const title = (row.record[by] ?? null) === to.value ? "Could not change the order" : `Could not move it to ${to.label}`;
+			const title = (row.record[by] ?? null) === to.value ? text("couldNotReorder") : text("couldNotMoveTo", to.label);
 			toast.show({
 				state: "error",
 				title,

package/dist/app/displays/use-calendar-move.js

@@ -2,6 +2,7 @@ import { formatDate } from "../../format/date.js";
 import { useClient } from "../../data/api-provider.js";
 import { useToast } from "../../toasts/toast-provider.js";
 import { recordKey } from "../../live/model-helpers.js";
+import { text } from "./messages.js";
 import { refusalReason } from "./board-columns.js";
 import { useRefreshResource } from "../pages/use-layout-data.js";
 import { movedPatch } from "./calendar-range.js";
@@ -44,7 +45,7 @@ const useCalendarMove = (model, display) => {
 			settle(row.key);
 			toast.show({
 				state: "error",
-				title: `Could not move it to ${formatDate(Date.parse(`${to}T00:00:00Z`))}`,
+				title: text("couldNotMoveTo", formatDate(Date.parse(`${to}T00:00:00Z`))),
 				description: refusalReason(error)
 			});
 		},

package/dist/app/document-title.js

@@ -1,3 +1,4 @@
+import { text } from "./create/messages.js";
 import { useEffect } from "react";
 //#region src/app/document-title.ts
 /** What a tab names, most specific first: the record and its list, the new record and its list, the list, or the page. */
@@ -7,7 +8,7 @@ const titleParts = ({ address, page, accountPage, resourceLabel, singular, recor
 	if (!address || address.kind === "page") return [];
 	const list = resourceLabel ? [resourceLabel] : [];
 	if (address.kind === "list") return list;
-	if (address.kind === "create") return [...singular ? [`New ${singular.toLowerCase()}`] : [], ...list];
+	if (address.kind === "create") return [...singular ? [text("title", singular)] : [], ...list];
 	const record = recordTitle ?? (recordLoading ? void 0 : address.key);
 	return [...record ? [record] : [], ...list];
 };

package/dist/app/export/builder-port.js

@@ -1,3 +1,4 @@
+import { text } from "./messages.js";
 import { createExportBuilder } from "./builder.js";
 //#region src/app/export/builder-port.ts
 const joined = (chunks) => {
@@ -36,7 +37,7 @@ const createWorkerPort = () => {
 	worker.onmessage = (event) => waiting.shift()?.resolve(event.data.bytes);
 	worker.onerror = (event) => {
 		event.preventDefault();
-		const error = /* @__PURE__ */ new Error(`The export could not be built: ${event.message}`);
+		const error = new Error(text("couldNotBuild", event.message));
 		for (const entry of waiting.splice(0)) entry.reject(error);
 	};
 	return {