@protobase/ui 0.23.9 → 0.23.11

package/dist/app/create/create-page.js

@@ -3,6 +3,7 @@ import { humanize } from "../../live/naming.js";
 import { recordKey } from "../../live/model-helpers.js";
 import { Notice, useAdminMeta, usePermissions } from "../meta-gate.js";
 import { useAppAddress } from "../use-app-address.js";
+import { text } from "./messages.js";
 import { createBody, createSections, hasDatabaseDefault, initialDraft, isChosen, isRequired } from "./create-values.js";
 import { FieldEditor } from "../field-editor.js";
 import { fieldErrors, fieldMessage } from "../field-errors.js";
@@ -50,7 +51,7 @@ const LoadedCreate = ({ resource, values }) => {
 	const queryClient = useQueryClient();
 	const { go } = useAppAddress();
 	const noun = view?.names?.singular ?? humanize(resource);
-	const feedback = useLiveSave(view?.saveFeedback ?? "toast", `New ${noun.toLowerCase()}`);
+	const feedback = useLiveSave(view?.saveFeedback ?? "toast", text("subject", noun));
 	const sections = createSections(model, view);
 	const [draft, setDraft] = useState(() => initialDraft(model, sections, values));
 	const [errors, setErrors] = useState({});
@@ -131,7 +132,7 @@ const LoadedCreate = ({ resource, values }) => {
 					value: isChosen(value) ? value.key : value ?? (field.type === "boolean" ? false : ""),
 					stored: void 0,
 					relationLabel: isChosen(value) ? value.label : void 0,
-					placeholder: hasDatabaseDefault(field) ? "Set by the database" : void 0,
+					placeholder: hasDatabaseDefault(field) ? text("setByDatabase") : void 0,
 					relationPicker: target ? {
 						target,
 						view: meta.views[target.name]

package/dist/app/create/create-record-form.js

@@ -1,17 +1,18 @@
 import { Field } from "../../record-view/field.js";
 import { Section } from "../../record-view/section.js";
+import { text } from "./messages.js";
 import { Form } from "./form.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/app/create/create-record-form.tsx
 /** The presentation of "New <thing>": the view's sections, each field with its editor, and Create or Cancel. */
 const CreateRecordForm = ({ noun, collection, sections, saving, message, onSubmit, onCancel, ref }) => /* @__PURE__ */ jsx(Form, {
 	ref,
-	title: `New ${noun.toLowerCase()}`,
+	title: text("title", noun),
 	eyebrow: collection,
-	submit: `Create ${noun.toLowerCase()}`,
+	submit: text("submit", noun),
 	saving,
 	error: message ? new Error(message) : void 0,
-	errorTitle: "Not created",
+	errorTitle: text("notCreated"),
 	onSubmit,
 	onCancel,
 	children: sections.map((section) => /* @__PURE__ */ jsx(Section, {

package/dist/app/create/create-route.js

@@ -1,8 +1,9 @@
 import { humanize } from "../../live/naming.js";
 import { Notice, useAdminMeta } from "../meta-gate.js";
+import { text } from "./messages.js";
 import { ComposedPage } from "../pages/composed-page.js";
 import { CreatePage } from "./create-page.js";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 //#region src/app/create/create-route.tsx
 /**
 * `/:resource/new`: the view's create page when it names one, which reads the address's `values` itself and may change
@@ -15,13 +16,9 @@ const CreateRoute = ({ resource, values }) => {
 		resource,
 		values
 	}, new URLSearchParams(values).toString());
-	if (!meta.pages[view.create.page]) return /* @__PURE__ */ jsxs(Notice, {
-		title: "Not allowed",
-		children: [
-			"You cannot create ",
-			view.names?.plural.toLowerCase() ?? humanize(resource),
-			"."
-		]
+	if (!meta.pages[view.create.page]) return /* @__PURE__ */ jsx(Notice, {
+		title: text("notAllowed"),
+		children: text("cannotCreate", view.names?.plural.toLowerCase() ?? humanize(resource))
 	});
 	return /* @__PURE__ */ jsx(ComposedPage, { name: view.create.page });
 };

package/dist/app/create/create-values.js

@@ -1,5 +1,6 @@
 import { isEditable, toPatchValue } from "../../live/field-values.js";
 import { whenShown } from "../record-mode/record-mode.js";
+import { text } from "./messages.js";
 import { layoutItems } from "@protobase/schema/internal";
 import { isRecordCondition } from "@protobase/schema";
 //#region src/app/create/create-values.ts
@@ -27,7 +28,7 @@ const createSections = (model, view) => {
 	const rest = creatable.filter((name) => !placed.has(name));
 	if (rest.length === 0) return sections;
 	return [...sections, {
-		title: sections.length === 0 ? "Details" : "Other fields",
+		title: sections.length === 0 ? text("details") : text("otherFields"),
 		fields: rest
 	}];
 };

package/dist/app/create/form.js

@@ -1,15 +1,16 @@
 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/create/form.tsx
 /** The frame of the app's forms: Cancel and the submit button, a failure that belongs to no field, and the sections. */
-const Form = ({ title, eyebrow, submit, saving, disabled, error, errorTitle = "Not saved", onSubmit, onCancel, children, ref }) => {
+const Form = ({ title, eyebrow, submit, saving, disabled, error, errorTitle = text("notSaved"), onSubmit, onCancel, children, ref }) => {
 	const buttons = /* @__PURE__ */ jsxs("div", {
 		className: "flex items-center gap-2",
 		children: [onCancel && /* @__PURE__ */ jsx(Button, {
 			className: "max-sm:min-h-11",
 			onClick: onCancel,
-			children: "Cancel"
+			children: text("cancel")
 		}), /* @__PURE__ */ jsx(Button, {
 			variant: "primary",
 			type: "submit",

package/dist/app/create/messages.js

@@ -0,0 +1,32 @@
+import { defineMessages } from "../../locale/messages.js";
+//#region src/app/create/messages.ts
+const text = defineMessages({
+	en: {
+		title: (noun) => `New ${noun.toLowerCase()}`,
+		subject: (noun) => `New ${noun.toLowerCase()}`,
+		submit: (noun) => `Create ${noun.toLowerCase()}`,
+		notCreated: "Not created",
+		notSaved: "Not saved",
+		cancel: "Cancel",
+		setByDatabase: "Set by the database",
+		details: "Details",
+		otherFields: "Other fields",
+		notAllowed: "Not allowed",
+		cannotCreate: (plural) => `You cannot create ${plural}.`
+	},
+	nl: {
+		title: (noun) => `${noun} toevoegen`,
+		subject: (noun) => noun,
+		submit: (noun) => `${noun} aanmaken`,
+		notCreated: "Niet aangemaakt",
+		notSaved: "Niet bewaard",
+		cancel: "Annuleren",
+		setByDatabase: "Ingevuld door de database",
+		details: "Details",
+		otherFields: "Overige velden",
+		notAllowed: "Niet toegestaan",
+		cannotCreate: (plural) => `Je mag geen ${plural} aanmaken.`
+	}
+});
+//#endregion
+export { text };

package/dist/app/delete/blocked-delete.js

@@ -1,9 +1,10 @@
 import { humanize } from "../../live/naming.js";
+import { text } from "./messages.js";
 import { createWhere, printFilter } from "@protobase/schema";
 //#region src/app/delete/blocked-delete.ts
 const where$1 = createWhere();
 /** What a delete other records still point at says, such as "Orders still point at this company." */
-const blockedDeleteText = ({ blockingPlural, noun }) => `${blockingPlural} still point at this ${noun.toLowerCase()}.`;
+const blockedDeleteText = ({ blockingPlural, noun }) => text("stillPointAt", blockingPlural, noun);
 /**
 * Why the delete was refused, naming the records that point at it by their view's plural, and, when the server names
 * the field pointing at it, a link to their list filtered to those records. `undefined` for a resource the app does not show.
@@ -12,20 +13,20 @@ const blockedDelete = ({ blockedBy, resources, views, noun, key }) => {
 	const { resource, field } = blockedBy;
 	if (!resources[resource]) return void 0;
 	const plural = views[resource]?.names?.plural ?? humanize(resource);
-	const text = blockedDeleteText({
+	const text$1 = blockedDeleteText({
 		blockingPlural: plural,
 		noun
 	});
-	if (!field || key === void 0) return { text };
+	if (!field || key === void 0) return { text: text$1 };
 	const list = {
 		kind: "list",
 		resource,
 		filter: printFilter(where$1.eq(field, key))
 	};
 	return {
-		text,
+		text: text$1,
 		link: {
-			label: `Show ${plural.toLowerCase()}`,
+			label: text("show", plural),
 			to: list
 		}
 	};

package/dist/app/delete/dialogs.js

@@ -1,39 +1,40 @@
 import { Button } from "../../primitives/button.js";
 import { Dialog } from "../../primitives/dialog.js";
+import { text } from "./messages.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/app/delete/dialogs.tsx
 const ConfirmDeleteDialog = ({ title, noun, busy, onConfirm, onCancel }) => /* @__PURE__ */ jsx(Dialog, {
-	title: `Delete ${title}?`,
-	description: `This ${noun.toLowerCase()} will be removed. This cannot be undone.`,
+	title: text("confirmTitle", title),
+	description: text("confirmDescription", noun, title),
 	onClose: onCancel,
 	actions: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Button, {
 		onClick: onCancel,
-		children: "Cancel"
+		children: text("cancel")
 	}), /* @__PURE__ */ jsx(Button, {
 		variant: "primary",
 		className: "bg-danger hover:bg-danger/90",
 		loading: busy,
 		onClick: onConfirm,
-		children: "Delete"
+		children: text("delete")
 	})] })
 });
 const ConflictDialog = ({ title, changes, busy, onReview, onDeleteAnyway, onCancel }) => /* @__PURE__ */ jsx(Dialog, {
-	title: `${title} was changed since you opened it`,
-	description: "Someone saved this record in the meantime. Review what changed before you delete it.",
+	title: text("changedTitle", title),
+	description: text("changedDescription"),
 	onClose: onCancel,
 	actions: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Button, {
 		onClick: onReview,
-		children: "Review changes"
+		children: text("reviewChanges")
 	}), /* @__PURE__ */ jsx(Button, {
 		variant: "primary",
 		className: "bg-danger hover:bg-danger/90",
 		loading: busy,
 		onClick: onDeleteAnyway,
-		children: "Delete anyway"
+		children: text("deleteAnyway")
 	})] }),
 	children: changes.length === 0 ? /* @__PURE__ */ jsx("p", {
 		className: "text-muted-foreground",
-		children: "No visible fields differ; the record was saved again with the same values."
+		children: text("noVisibleChanges")
 	}) : /* @__PURE__ */ jsx("ul", {
 		className: "divide-y rounded-md border",
 		children: changes.map((change) => /* @__PURE__ */ jsxs("li", {
@@ -57,38 +58,38 @@ const ConflictDialog = ({ title, changes, busy, onReview, onDeleteAnyway, onCanc
 });
 const BulkDeleteDialog = (props) => {
 	if (props.stage === "confirm") return /* @__PURE__ */ jsx(Dialog, {
-		title: `Delete ${props.count} ${props.count === 1 ? props.plural.replace(/s$/, "") : props.plural.toLowerCase()}?`,
-		description: "This cannot be undone. Each record is deleted only if it has not changed since the list loaded; anything that changed is reported and kept.",
+		title: text("bulkConfirmTitle", props.count, props.plural),
+		description: text("bulkConfirmDescription"),
 		onClose: props.onCancel,
 		actions: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Button, {
 			onClick: props.onCancel,
-			children: "Cancel"
-		}), /* @__PURE__ */ jsxs(Button, {
+			children: text("cancel")
+		}), /* @__PURE__ */ jsx(Button, {
 			variant: "primary",
 			className: "bg-danger hover:bg-danger/90",
 			onClick: props.onConfirm,
-			children: ["Delete ", props.count]
+			children: text("deleteCount", props.count)
 		})] })
 	});
 	if (props.stage === "running") return /* @__PURE__ */ jsx(Dialog, {
-		title: "Deleting",
-		description: `${props.done} of ${props.total} done`,
+		title: text("deleting"),
+		description: text("progress", props.done, props.total),
 		onClose: () => void 0,
 		actions: /* @__PURE__ */ jsx(Button, {
 			loading: true,
 			disabled: true,
-			children: "Working"
+			children: text("working")
 		})
 	});
 	const deleted = props.total - props.failures.length;
 	return /* @__PURE__ */ jsx(Dialog, {
-		title: props.failures.length === 0 ? `Deleted ${deleted}` : `Deleted ${deleted} of ${props.total}`,
-		description: props.failures.length === 0 ? void 0 : `${props.failures.length} could not be deleted and were kept.`,
+		title: props.failures.length === 0 ? text("deleted", deleted) : text("deletedOf", deleted, props.total),
+		description: props.failures.length === 0 ? void 0 : text("kept", props.failures.length),
 		onClose: props.onClose,
 		actions: /* @__PURE__ */ jsx(Button, {
 			variant: "primary",
 			onClick: props.onClose,
-			children: "Done"
+			children: text("done")
 		}),
 		children: props.failures.length > 0 && /* @__PURE__ */ jsx("ul", {
 			className: "max-h-48 divide-y overflow-y-auto rounded-md border",

package/dist/app/delete/messages.js

@@ -0,0 +1,66 @@
+import { defineMessages } from "../../locale/messages.js";
+//#region src/app/delete/messages.ts
+const text = defineMessages({
+	en: {
+		confirmTitle: (title) => `Delete ${title}?`,
+		confirmDescription: (noun, _title) => `This ${noun.toLowerCase()} will be removed. This cannot be undone.`,
+		cancel: "Cancel",
+		delete: "Delete",
+		changedTitle: (title) => `${title} was changed since you opened it`,
+		changedDescription: "Someone saved this record in the meantime. Review what changed before you delete it.",
+		reviewChanges: "Review changes",
+		deleteAnyway: "Delete anyway",
+		noVisibleChanges: "No visible fields differ; the record was saved again with the same values.",
+		bulkConfirmTitle: (count, plural) => `Delete ${count} ${count === 1 ? plural.replace(/s$/, "") : plural.toLowerCase()}?`,
+		bulkConfirmDescription: "This cannot be undone. Each record is deleted only if it has not changed since the list loaded; anything that changed is reported and kept.",
+		deleteCount: (count) => `Delete ${count}`,
+		deleting: "Deleting",
+		progress: (done, total) => `${done} of ${total} done`,
+		working: "Working",
+		deleted: (count) => `Deleted ${count}`,
+		deletedOf: (count, total) => `Deleted ${count} of ${total}`,
+		kept: (count) => `${count} could not be deleted and were kept.`,
+		done: "Done",
+		deletedToast: (title) => `${title} deleted`,
+		undo: "Undo",
+		restored: (title) => `${title} restored`,
+		alreadyBack: (title) => `${title} is already back`,
+		couldNotRestore: (title) => `Could not restore ${title}`,
+		couldNotDelete: (title) => `Could not delete ${title}`,
+		changedSinceLoaded: "Changed since the list loaded, so it was kept.",
+		stillPointAt: (plural, noun) => `${plural} still point at this ${noun.toLowerCase()}.`,
+		show: (plural) => `Show ${plural.toLowerCase()}`
+	},
+	nl: {
+		confirmTitle: (title) => `${title} verwijderen?`,
+		confirmDescription: (_noun, title) => `${title} wordt verwijderd. Dit kan niet ongedaan worden gemaakt.`,
+		cancel: "Annuleren",
+		delete: "Verwijderen",
+		changedTitle: (title) => `${title} is gewijzigd sinds je het opende`,
+		changedDescription: "Iemand heeft dit record intussen bewaard. Bekijk wat er veranderde voordat je het verwijdert.",
+		reviewChanges: "Wijzigingen bekijken",
+		deleteAnyway: "Toch verwijderen",
+		noVisibleChanges: "Geen zichtbaar veld verschilt; het record is opnieuw bewaard met dezelfde waarden.",
+		bulkConfirmTitle: (count, plural) => count === 1 ? "Eén record verwijderen?" : `${count} ${plural.toLowerCase()} verwijderen?`,
+		bulkConfirmDescription: "Dit kan niet ongedaan worden gemaakt. Elk record wordt alleen verwijderd als het niet is gewijzigd sinds de lijst laadde; wat wel is gewijzigd, wordt gemeld en behouden.",
+		deleteCount: (count) => `${count} verwijderen`,
+		deleting: "Verwijderen",
+		progress: (done, total) => `${done} van ${total} klaar`,
+		working: "Bezig",
+		deleted: (count) => `${count} verwijderd`,
+		deletedOf: (count, total) => `${count} van ${total} verwijderd`,
+		kept: (count) => `${count} kon${count === 1 ? "" : "den"} niet worden verwijderd en ${count === 1 ? "is" : "zijn"} behouden.`,
+		done: "Klaar",
+		deletedToast: (title) => `${title} verwijderd`,
+		undo: "Ongedaan maken",
+		restored: (title) => `${title} teruggezet`,
+		alreadyBack: (title) => `${title} is al terug`,
+		couldNotRestore: (title) => `Kon ${title} niet terugzetten`,
+		couldNotDelete: (title) => `Kon ${title} niet verwijderen`,
+		changedSinceLoaded: "Gewijzigd sinds de lijst laadde, dus behouden.",
+		stillPointAt: (plural, _noun) => `${plural} verwijzen hier nog naar.`,
+		show: (plural) => `${plural} tonen`
+	}
+});
+//#endregion
+export { text };

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

@@ -3,6 +3,7 @@ import { humanize } from "../../live/naming.js";
 import { useToast } from "../../toasts/toast-provider.js";
 import { useAdminMeta } from "../meta-gate.js";
 import { useAppAddress } from "../use-app-address.js";
+import { text } from "./messages.js";
 import { blockedDelete } from "./blocked-delete.js";
 import { BulkDeleteDialog, ConfirmDeleteDialog, ConflictDialog } from "./dialogs.js";
 import { diffRecords } from "./record-diff.js";
@@ -62,22 +63,22 @@ const useDeleteFlow = ({ model, view, onDeleted, onReview, restore }) => {
 		onDeleted?.(target);
 		toast.show({
 			state: "success",
-			title: `${target.title} deleted`,
+			title: text("deletedToast", target.title),
 			...model.softDelete && restore && { action: {
-				label: "Undo",
+				label: text("undo"),
 				onClick: () => {
 					restore(target).then(() => {
 						refresh();
 						toast.show({
 							state: "success",
-							title: `${target.title} restored`
+							title: text("restored", target.title)
 						});
 					}, (error) => {
 						if (!isApiError(error)) throw error;
 						refresh();
 						toast.show({
 							state: error.status === 409 ? "success" : "error",
-							title: error.status === 409 ? `${target.title} is already back` : `Could not restore ${target.title}`,
+							title: error.status === 409 ? text("alreadyBack", target.title) : text("couldNotRestore", target.title),
 							description: error.status === 409 ? void 0 : error.message
 						});
 					});
@@ -102,7 +103,7 @@ const useDeleteFlow = ({ model, view, onDeleted, onReview, restore }) => {
 			const why = blocked(error, target);
 			toast.show({
 				state: "error",
-				title: `Could not delete ${target.title}`,
+				title: text("couldNotDelete", target.title),
 				description: why?.text ?? error.message,
 				...why?.link && { action: {
 					label: why.link.label,
@@ -118,7 +119,7 @@ const useDeleteFlow = ({ model, view, onDeleted, onReview, restore }) => {
 		try {
 			return await remove(target, target.etag) ? {
 				title: target.title,
-				message: "Changed since the list loaded, so it was kept."
+				message: text("changedSinceLoaded")
 			} : void 0;
 		} catch (error) {
 			if (!isApiError(error)) throw error;

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

@@ -1,6 +1,7 @@
 import { cn } from "../../lib/cn.js";
 import { Segmented } from "../../primitives/segmented.js";
 import { humanize } from "../../live/naming.js";
+import { text } from "./messages.js";
 import { displayChoices, sortFields } from "./list-displays.js";
 import { parseSort } from "../list-order.js";
 import { MenuSelect } from "../../primitives/menu-select.js";
@@ -30,13 +31,13 @@ const DisplaySwitch = ({ view, value, onChange, menu = false, choices = displayC
 		icon: choice.icon === void 0 ? void 0 : icons[choice.icon]
 	}));
 	if (menu) return /* @__PURE__ */ jsx(MenuSelect, {
-		label: "Display",
+		label: text("display"),
 		value,
 		onChange,
 		options
 	});
 	return /* @__PURE__ */ jsx(Segmented, {
-		label: "Display",
+		label: text("display"),
 		size: "md",
 		value,
 		onChange,
@@ -51,7 +52,7 @@ const SortMenu = ({ model, view, display, orderBy, onChange, className }) => {
 	const names = fields.includes(current.columnId) ? fields : [current.columnId, ...fields];
 	const label = (name) => view?.fields[name]?.label ?? humanize(name);
 	return /* @__PURE__ */ jsx("select", {
-		"aria-label": "Sort",
+		"aria-label": text("sort"),
 		value: `${current.columnId} ${current.direction}`,
 		onChange: (event) => onChange(event.target.value),
 		className: cn("h-8 rounded-md border border-border-strong bg-background px-2.5 shadow-sm focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20", className),
@@ -60,7 +61,7 @@ const SortMenu = ({ model, view, display, orderBy, onChange, className }) => {
 			children: [
 				label(name),
 				", ",
-				word
+				text(word)
 			]
 		}, `${name} ${direction}`)))
 	});

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

@@ -5,6 +5,7 @@ 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 { encodeKey, tableDisplay } from "@protobase/schema/internal";
 //#region src/app/displays/list-displays.ts
 const displaysOf = (view) => view?.list?.displays ?? [];
@@ -68,7 +69,7 @@ const defaultIcons = {
 };
 const displayChoices = (view) => [{
 	name: tableDisplay,
-	label: "Table",
+	label: text("table"),
 	icon: "table"
 }, ...displaysOf(view).map((display) => ({
 	name: display.name,

package/dist/app/displays/messages.js

@@ -0,0 +1,20 @@
+import { defineMessages } from "../../locale/messages.js";
+//#region src/app/displays/messages.ts
+const text = defineMessages({
+	en: {
+		table: "Table",
+		display: "Display",
+		sort: "Sort",
+		ascending: "ascending",
+		descending: "descending"
+	},
+	nl: {
+		table: "Tabel",
+		display: "Weergave",
+		sort: "Sorteren",
+		ascending: "oplopend",
+		descending: "aflopend"
+	}
+});
+//#endregion
+export { text };

package/dist/app/embedded-list/cut-off-note.js

@@ -1,4 +1,5 @@
 import { formatTag } from "../../locale/active-locale.js";
+import { text } from "./messages.js";
 //#region src/app/embedded-list/cut-off-note.ts
 /**
 * What a list that shows only its first `shown` of `total` records says about the rest, as "The first 10 of 37.";
@@ -6,7 +7,7 @@ import { formatTag } from "../../locale/active-locale.js";
 */
 const cutOffNote = (shown, total, estimated) => {
 	if (shown >= total) return void 0;
-	return `The first ${shown} of ${estimated ? "about " : ""}${total.toLocaleString(formatTag())}.`;
+	return estimated ? text("firstOfAbout", shown, total.toLocaleString(formatTag())) : text("firstOf", shown, total.toLocaleString(formatTag()));
 };
 //#endregion
 export { cutOffNote };

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

@@ -19,6 +19,7 @@ import { CustomDisplay } from "../displays/custom-display.js";
 import { MapDisplay } from "../displays/map-display.js";
 import { DisplaySwitch } from "../displays/display-controls.js";
 import { embeddedColumns } from "./embedded-columns.js";
+import { text } from "./messages.js";
 import { cutOffNote } from "./cut-off-note.js";
 import { embeddedRowTargets } from "./embedded-row-targets.js";
 import { useEmbeddedRows } from "./use-embedded-rows.js";
@@ -94,23 +95,27 @@ const EmbeddedList = ({ model, view, filter, sort, columns, limit, display, empt
 		}),
 		onClick: viewAll?.onOpen,
 		className: "flex items-center gap-1 self-end font-medium text-primary-text hover:underline",
-		children: [viewAll ? viewAll.label : /* @__PURE__ */ jsxs(Fragment$1, { children: ["View all ", /* @__PURE__ */ jsx("span", {
-			className: "sr-only",
-			children: plural.toLowerCase()
-		})] }), /* @__PURE__ */ jsx(ArrowRight, {
+		children: [viewAll ? viewAll.label : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+			text("viewAll"),
+			" ",
+			/* @__PURE__ */ jsx("span", {
+				className: "sr-only",
+				children: plural.toLowerCase()
+			})
+		] }), /* @__PURE__ */ jsx(ArrowRight, {
 			className: "size-3.5",
 			"aria-hidden": true
 		})]
 	});
 	if (rows.isPending) return /* @__PURE__ */ jsx(Loading, {});
 	if (rows.error) return /* @__PURE__ */ jsx(ErrorBanner, {
-		title: "Could not load",
+		title: text("couldNotLoad"),
 		error: rows.error
 	});
 	if (!source || source.total === 0) {
 		const nothing = /* @__PURE__ */ jsx("p", {
 			className: "text-muted-foreground",
-			children: empty ?? "Nothing here yet."
+			children: empty ?? text("nothingYet")
 		});
 		return viewAll && link ? /* @__PURE__ */ jsxs("div", {
 			className: "flex flex-col gap-3",

package/dist/app/embedded-list/embedded-row-targets.js

@@ -1,6 +1,7 @@
 import { humanize } from "../../live/naming.js";
 import { recordKey } from "../../live/model-helpers.js";
 import { rowAllows } from "../permissions.js";
+import { text } from "./messages.js";
 import { relationTarget } from "../related-opens.js";
 //#region src/app/embedded-list/embedded-row-targets.ts
 const singularOf = (model, view) => (view?.names?.singular ?? humanize(model.name)).toLowerCase();
@@ -29,19 +30,19 @@ const embeddedRowTargets = ({ model, view, opens, resources, views, canUpdate })
 	const singular = singularOf(model, view);
 	const actions = (linkTo) => {
 		const openOwn = {
-			label: `Open ${singular}`,
+			label: text("open", singular),
 			link: (row) => linkTo(own(row))
 		};
 		if (!far) return [openOwn];
 		const editable = (row) => canUpdate && rowAllows(row, "update");
 		return [
 			{
-				label: `Open ${singularOf(far, views[far.name])}`,
+				label: text("open", singularOf(far, views[far.name])),
 				available: (row) => other(row) !== void 0,
 				link: (row) => linkTo(other(row))
 			},
 			{
-				label: `Edit ${singular}`,
+				label: text("edit", singular),
 				available: editable,
 				link: (row) => linkTo({
 					kind: "record",

package/dist/app/embedded-list/messages.js

@@ -0,0 +1,24 @@
+import { defineMessages } from "../../locale/messages.js";
+//#region src/app/embedded-list/messages.ts
+const text = defineMessages({
+	en: {
+		firstOf: (shown, total) => `The first ${shown} of ${total}.`,
+		firstOfAbout: (shown, total) => `The first ${shown} of about ${total}.`,
+		open: (singular) => `Open ${singular}`,
+		edit: (singular) => `Edit ${singular}`,
+		viewAll: "View all",
+		couldNotLoad: "Could not load",
+		nothingYet: "Nothing here yet."
+	},
+	nl: {
+		firstOf: (shown, total) => `De eerste ${shown} van ${total}.`,
+		firstOfAbout: (shown, total) => `De eerste ${shown} van ongeveer ${total}.`,
+		open: (singular) => `${singular} openen`,
+		edit: (singular) => `${singular} bewerken`,
+		viewAll: "Alles bekijken",
+		couldNotLoad: "Kon niet laden",
+		nothingYet: "Hier staat nog niets."
+	}
+});
+//#endregion
+export { text };

package/dist/app/error-banner.js

@@ -1,9 +1,10 @@
+import { text } from "./messages.js";
 import { TriangleAlert } from "lucide-react";
 import { isApiError } from "@protobase/client";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/app/error-banner.tsx
 const describe = (error) => {
-	if (!isApiError(error)) return [{ message: error instanceof Error ? error.message : "Something went wrong" }];
+	if (!isApiError(error)) return [{ message: error instanceof Error ? error.message : text("somethingWentWrong") }];
 	const detailed = error.errors.map((entry) => ({
 		message: entry.message,
 		hint: entry.hint