@protobase/ui 0.63.3 → 0.63.4

package/dist/app/use-record-editor.js

@@ -15,7 +15,7 @@ const without = (source, name) => Object.fromEntries(Object.entries(source).filt
 /**
 * Draft state for one record. Saving sends only the changed fields with the ETag that was read;
 * a 412 refetches the record and marks the fields both sides changed so the user can pick a side.
-* When the lines were reordered too, Save sends the record and the new order as one batch: all or nothing.
+* When the lines changed too, Save sends the record and the lines' writes as one batch: all or nothing.
 */
 const useRecordEditor = ({ model, stored, recordKey, mode, subject, draftKey, lines }) => {
 	const client = useClient();
@@ -38,7 +38,7 @@ const useRecordEditor = ({ model, stored, recordKey, mode, subject, draftKey, li
 	useEffect(() => {
 		if (!draftKey) return;
 		const kept = Object.fromEntries(Object.entries(draft).filter(([name]) => !model.fields[name]?.sensitive));
-		const keep = Object.keys(kept).length > 0 || Boolean(lines?.dirty);
+		const keep = Object.keys(kept).length > 0 || Boolean(lines?.order);
 		writeDraft(localStorage, draftKey, keep ? {
 			etag: stored.etag,
 			fields: kept,
@@ -48,7 +48,6 @@ const useRecordEditor = ({ model, stored, recordKey, mode, subject, draftKey, li
 		draftKey,
 		model,
 		draft,
-		lines?.dirty,
 		lines?.order,
 		stored.etag
 	]);
@@ -93,14 +92,15 @@ const useRecordEditor = ({ model, stored, recordKey, mode, subject, draftKey, li
 			throw error;
 		}
 	};
-	const saveBatch = async (linesOps) => {
-		const ops = [...fieldsDirty ? [{
+	const saveBatch = async (linesPlan) => {
+		const recordOps = fieldsDirty ? [{
 			op: "update",
 			resource: model.name,
 			key: recordKey,
 			data: patchOf(),
 			etag: stored.etag
-		}] : [], ...linesOps];
+		}] : [];
+		const ops = [...recordOps, ...linesPlan.ops];
 		try {
 			await client.batchWrite(ops);
 		} catch (error) {
@@ -108,7 +108,12 @@ const useRecordEditor = ({ model, stored, recordKey, mode, subject, draftKey, li
 				await adoptLatest();
 				await queryClient.invalidateQueries({ queryKey: ["list"] });
 				setLinesConflict(true);
-			} else if (isApiError(error)) reject(error);
+			} else if (isApiError(error)) {
+				const lineOp = error.operation === void 0 ? -1 : error.operation - recordOps.length;
+				const row = linesPlan.rows[lineOp];
+				if (lineOp < 0) reject(error);
+				else if (row) lines?.reject(row, error);
+			}
 			throw isApiError(error) ? nameFailingOperation(error, ops) : error;
 		}
 		await Promise.all([
@@ -120,8 +125,8 @@ const useRecordEditor = ({ model, stored, recordKey, mode, subject, draftKey, li
 		lines?.reset();
 	};
 	const save = () => feedback.run(async () => {
-		const linesOps = lines?.op() ?? [];
-		if (linesOps.length > 0) await saveBatch(linesOps);
+		const linesPlan = lines?.plan();
+		if (linesPlan && linesPlan.ops.length > 0) await saveBatch(linesPlan);
 		else await saveRecordOnly();
 		setDraft({});
 		setConflicts({});
@@ -146,7 +151,7 @@ const useRecordEditor = ({ model, stored, recordKey, mode, subject, draftKey, li
 		/** The changes on screen were brought back from this browser. */
 		restored: showRestored && dirty,
 		dismissRestored: () => setShowRestored(false),
-		/** Someone changed the lines while the new order was being made. */
+		/** Someone changed the lines while they were being edited here. */
 		linesConflict,
 		saving: feedback.phase === "saving",
 		phase: feedback.phase,

package/dist/app/use-record-lines.js

@@ -0,0 +1,47 @@
+import { useAdminMeta } from "./meta-gate.js";
+import { listColumnNames } from "../live/columns-from-model.js";
+import { keyValue } from "./create/create-values.js";
+import { listLabels } from "../live/relation-labels.js";
+import { useLines } from "./use-lines.js";
+import { useLinesDraft } from "./use-lines-draft.js";
+import { useMemo } from "react";
+//#region src/app/use-record-lines.ts
+/** A resource that holds numbered lines of this one: it points at the parent and has `position` and `quantity`. */
+const findLinesResource = (resources, parent) => Object.values(resources).find((candidate) => candidate.name !== parent.name && candidate.fields.position && candidate.fields.quantity && Object.values(candidate.fields).some((field) => field.type === "relation" && field.relation?.resource === parent.name));
+/**
+* The lines' columns: the list columns of their view, or its first fields, without what the editor fills in itself:
+* the key, the tenant, the relation to the record and the position, which is the order of the rows.
+*/
+const lineColumnNames = (lines, view, link) => listColumnNames(lines, view).filter((name) => {
+	const field = lines.fields[name];
+	return field && !field.writeOnly && name !== link && name !== "position" && name !== lines.tenant && !lines.primaryKey.includes(name);
+});
+/** The record's lines when it has a lines resource: the resource, its columns, the lines as stored and the changes made to them. */
+const useRecordLines = (parent, parentKey) => {
+	const { resources, views } = useAdminMeta();
+	const model = useMemo(() => findLinesResource(resources, parent), [resources, parent]);
+	const link = model && Object.values(model.fields).find((field) => field.type === "relation" && field.relation?.resource === parent.name);
+	const columns = model && link ? lineColumnNames(model, views[model.name], link.name) : [];
+	const data = useLines(model, link, parentKey, model ? listLabels(resources, views, model, columns) : void 0);
+	const target = useMemo(() => model && link ? {
+		model,
+		position: "position",
+		link: {
+			field: link.name,
+			value: keyValue(parent, parentKey)
+		}
+	} : void 0, [
+		model,
+		link,
+		parent,
+		parentKey
+	]);
+	return {
+		model,
+		columns,
+		data,
+		draft: useLinesDraft(target, data.items)
+	};
+};
+//#endregion
+export { findLinesResource, lineColumnNames, useRecordLines };

package/dist/data/use-list.d.ts

@@ -6,6 +6,8 @@ export type UseListParams = {
   orderBy?: string;
   pageSize?: number;
   fields?: string[];
+  /** Names the records relations point at, as `client.list`'s `labels`: `{ product_id: 'name' }`. */
+  labels?: Record<string, string>;
   /** Start at this page token instead of the first page, for example one from `useAnchors`. */
   startToken?: string;
   enabled?: boolean;
@@ -14,9 +16,13 @@ export type UseListParams = {
 };
 type Row = Record<string, unknown>;
 /** Infinite pages of a resource, following `next_page_token`. */
-export declare const useList: (resource: string, { filter, orderBy, pageSize, fields, startToken, enabled, refetchInterval }?: UseListParams) => {
+export declare const useList: (resource: string, { filter, orderBy, pageSize, fields, labels, startToken, enabled, refetchInterval }?: UseListParams) => {
   items: Row[];
   totalEstimate: number | undefined;
+  /** Per relation asked for in `labels`, the names of the records it points at, from every page loaded. */
+  labels: {
+    [k: string]: Record<string, string>;
+  };
   data: InfiniteData<ListPage<Row>, unknown>;
   error: Error;
   isError: true;
@@ -53,6 +59,10 @@ export declare const useList: (resource: string, { filter, orderBy, pageSize, fi
 } | {
   items: Row[];
   totalEstimate: number | undefined;
+  /** Per relation asked for in `labels`, the names of the records it points at, from every page loaded. */
+  labels: {
+    [k: string]: Record<string, string>;
+  };
   data: InfiniteData<ListPage<Row>, unknown>;
   error: null;
   isError: false;
@@ -89,6 +99,10 @@ export declare const useList: (resource: string, { filter, orderBy, pageSize, fi
 } | {
   items: Row[];
   totalEstimate: number | undefined;
+  /** Per relation asked for in `labels`, the names of the records it points at, from every page loaded. */
+  labels: {
+    [k: string]: Record<string, string>;
+  };
   data: undefined;
   error: Error;
   isError: true;
@@ -125,6 +139,10 @@ export declare const useList: (resource: string, { filter, orderBy, pageSize, fi
 } | {
   items: Row[];
   totalEstimate: number | undefined;
+  /** Per relation asked for in `labels`, the names of the records it points at, from every page loaded. */
+  labels: {
+    [k: string]: Record<string, string>;
+  };
   data: undefined;
   error: null;
   isError: false;
@@ -161,6 +179,10 @@ export declare const useList: (resource: string, { filter, orderBy, pageSize, fi
 } | {
   items: Row[];
   totalEstimate: number | undefined;
+  /** Per relation asked for in `labels`, the names of the records it points at, from every page loaded. */
+  labels: {
+    [k: string]: Record<string, string>;
+  };
   data: undefined;
   error: null;
   isError: false;
@@ -197,6 +219,10 @@ export declare const useList: (resource: string, { filter, orderBy, pageSize, fi
 } | {
   items: Row[];
   totalEstimate: number | undefined;
+  /** Per relation asked for in `labels`, the names of the records it points at, from every page loaded. */
+  labels: {
+    [k: string]: Record<string, string>;
+  };
   data: InfiniteData<ListPage<Row>, unknown>;
   isError: false;
   error: null;

package/dist/data/use-list.js

@@ -4,11 +4,15 @@ import { filterText } from "@protobase/client";
 import { useInfiniteQuery } from "@tanstack/react-query";
 //#region src/data/use-list.ts
 /** Infinite pages of a resource, following `next_page_token`. */
-const useList = (resource, { filter, orderBy, pageSize = 50, fields, startToken = "", enabled = true, refetchInterval } = {}) => {
+const useList = (resource, { filter, orderBy, pageSize = 50, fields, labels, startToken = "", enabled = true, refetchInterval } = {}) => {
 	const client = useClient();
 	const text = filterText(filter) ?? "";
 	const query = useInfiniteQuery({
-		queryKey: [...keys.list(resource, text, orderBy ?? "", pageSize, startToken), fields?.join(",") ?? ""],
+		queryKey: [
+			...keys.list(resource, text, orderBy ?? "", pageSize, startToken),
+			fields?.join(",") ?? "",
+			...labels ? [labels] : []
+		],
 		enabled,
 		refetchInterval,
 		initialPageParam: startToken,
@@ -17,6 +21,7 @@ const useList = (resource, { filter, orderBy, pageSize = 50, fields, startToken
 			orderBy,
 			pageSize,
 			fields,
+			labels,
 			pageToken: pageParam
 		}),
 		getNextPageParam: (last) => last.nextPageToken || void 0
@@ -25,7 +30,9 @@ const useList = (resource, { filter, orderBy, pageSize = 50, fields, startToken
 	return {
 		...query,
 		items: pages.flatMap((page) => page.items),
-		totalEstimate: pages[0]?.totalSizeEstimate
+		totalEstimate: pages[0]?.totalSizeEstimate,
+		/** Per relation asked for in `labels`, the names of the records it points at, from every page loaded. */
+		labels: Object.fromEntries(Object.keys(labels ?? {}).map((name) => [name, Object.assign({}, ...pages.map((page) => page.labels?.[name] ?? {}))]))
 	};
 };
 //#endregion

package/dist/data-grid/cell-text.js

@@ -1,7 +1,7 @@
-import { userById } from "../mocks/users.js";
 import { formatMoney } from "../format/money.js";
 import { formatInt, formatPercent, formatSigned } from "../format/number.js";
 import { formatDate, formatDateTime, formatRelativeTime } from "../format/date.js";
+import { userById } from "../mocks/users.js";
 import { fileShown } from "../live/file-values.js";
 import { text } from "./messages.js";
 import { enumLabel } from "@protobase/schema";

package/dist/data-grid/cells.js

@@ -1,7 +1,7 @@
 import { cn } from "../lib/cn.js";
-import { userById } from "../mocks/users.js";
 import { viewerZone, zoneLabel } from "../format/zone.js";
 import { formatDateTime } from "../format/date.js";
+import { userById } from "../mocks/users.js";
 import { Avatar } from "../primitives/avatar.js";
 import { Badge } from "../primitives/badge.js";
 import { fileShown, shownImage } from "../live/file-values.js";

package/dist/inline-child-table/columns.js

@@ -1,4 +1,9 @@
 //#region src/inline-child-table/columns.ts
-const lineGrid = "grid grid-cols-[28px_minmax(0,1fr)_88px_112px_112px_32px] items-center gap-2 pointer-coarse:grid-cols-[44px_minmax(0,1fr)_88px_112px_112px_44px]";
+const track = (column) => column.width ?? "minmax(8rem,1fr)";
+/** The columns' tracks, between the drag handle and the menu that `lineGrid` places around them. */
+const lineGridStyle = (columns) => ({ "--line-columns": columns.map(track).join(" ") });
+/** The narrowest the table gets before it scrolls sideways: each column's least width, and the handle and menu. */
+const lineTableMinWidth = (columns) => `${columns.reduce((sum, column) => sum + (column.width?.endsWith("px") ? parseInt(column.width) / 16 : 8), 6)}rem`;
+const lineGrid = "grid grid-cols-[28px_var(--line-columns)_32px] items-center gap-2 pointer-coarse:grid-cols-[44px_var(--line-columns)_44px]";
 //#endregion
-export { lineGrid };
+export { lineGrid, lineGridStyle, lineTableMinWidth };

package/dist/inline-child-table/inline-child-table.js

@@ -1,18 +1,20 @@
+import { cn } from "../lib/cn.js";
 import { Button } from "../primitives/button.js";
-import { productAt } from "../mocks/products.js";
-import { lineGrid } from "./columns.js";
+import { lineGrid, lineGridStyle } from "./columns.js";
 import { text } from "./messages.js";
 import { LineRow } from "./line-row.js";
 import { reorder } from "./reorder.js";
-import { TotalsFooter } from "./totals-footer.js";
 import { Plus } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { DndContext, KeyboardSensor, MouseSensor, TouchSensor, closestCenter, useSensor, useSensors } from "@dnd-kit/core";
 import { SortableContext, sortableKeyboardCoordinates, verticalListSortingStrategy } from "@dnd-kit/sortable";
 //#region src/inline-child-table/inline-child-table.tsx
 const headerCell = "px-2 text-[11px] font-medium uppercase tracking-wide text-muted-foreground";
-const announcementsFor = (lines) => {
-	const name = (id) => lines.find((line) => line.id === id)?.description ?? text("line");
+const announcementsFor = (lines, lineName) => {
+	const name = (id) => {
+		const line = lines.find((each) => each.id === id);
+		return line ? lineName(line) : text("line");
+	};
 	const place = (id) => lines.findIndex((line) => line.id === id) + 1;
 	return {
 		onDragStart: ({ active }) => text("pickedUp", name(active.id), place(active.id), lines.length),
@@ -21,15 +23,16 @@ const announcementsFor = (lines) => {
 		onDragCancel: ({ active }) => text("cancelled", name(active.id), place(active.id))
 	};
 };
-const InlineChildTable = ({ lines, onChange, onReorder, vatRate = .21, readOnly, reorderable = !readOnly }) => {
+/** The lines of a record as rows of the given columns, put in order by dragging or from each row's menu. */
+const InlineChildTable = ({ lines, columns, lineName, onReorder, reorderable = Boolean(onReorder), onAdd, onRemove, removable = () => true, lineError, footer }) => {
 	const sensors = useSensors(useSensor(MouseSensor, { activationConstraint: { distance: 4 } }), useSensor(TouchSensor, { activationConstraint: {
 		delay: 250,
 		tolerance: 5
 	} }), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }));
 	const move = (from, to) => {
 		const line = lines[from];
-		if (!line || to < 0 || to >= lines.length || from === to) return;
-		(onReorder ?? ((next) => onChange(next)))(reorder(lines, from, to), {
+		if (!line || !onReorder || to < 0 || to >= lines.length || from === to) return;
+		onReorder(reorder(lines, from, to), {
 			id: line.id,
 			from,
 			to
@@ -39,48 +42,31 @@ const InlineChildTable = ({ lines, onChange, onReorder, vatRate = .21, readOnly,
 		if (!over || active.id === over.id) return;
 		move(lines.findIndex((line) => line.id === active.id), lines.findIndex((line) => line.id === over.id));
 	};
-	const addLine = () => {
-		const product = productAt(lines.length * 3 + 1);
-		onChange([...lines, {
-			id: `new-${lines.length}-${product.id}`,
-			productId: product.id,
-			description: product.name,
-			quantity: 1,
-			unitPriceCents: product.priceCents
-		}]);
-	};
 	return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("div", {
 		className: "overflow-hidden rounded-lg border border-border bg-background",
+		style: lineGridStyle(columns),
 		children: [
 			/* @__PURE__ */ jsxs("div", {
 				className: `${lineGrid} border-b border-border bg-surface px-2 py-2`,
 				children: [
 					/* @__PURE__ */ jsx("span", {}),
-					/* @__PURE__ */ jsx("span", {
-						className: headerCell,
-						children: text("item")
-					}),
-					/* @__PURE__ */ jsx("span", {
-						className: `${headerCell} text-right`,
-						children: text("qty")
-					}),
-					/* @__PURE__ */ jsx("span", {
-						className: `${headerCell} text-right`,
-						children: text("unitPrice")
-					}),
-					/* @__PURE__ */ jsx("span", {
-						className: `${headerCell} text-right`,
-						children: text("lineTotal")
-					}),
+					columns.map((column) => /* @__PURE__ */ jsx("span", {
+						className: cn(headerCell, column.align === "right" && "text-right"),
+						children: column.label
+					}, column.key)),
 					/* @__PURE__ */ jsx("span", {})
 				]
 			}),
+			lines.length === 0 && /* @__PURE__ */ jsx("p", {
+				className: "px-4 py-3 text-muted-foreground",
+				children: text("noLines")
+			}),
 			/* @__PURE__ */ jsx(DndContext, {
 				sensors,
 				collisionDetection: closestCenter,
 				onDragEnd,
 				accessibility: {
-					announcements: announcementsFor(lines),
+					announcements: announcementsFor(lines, lineName),
 					screenReaderInstructions: { draggable: text("instructions") }
 				},
 				children: /* @__PURE__ */ jsx(SortableContext, {
@@ -88,33 +74,28 @@ const InlineChildTable = ({ lines, onChange, onReorder, vatRate = .21, readOnly,
 					strategy: verticalListSortingStrategy,
 					children: lines.map((line, index) => /* @__PURE__ */ jsx(LineRow, {
 						line,
+						name: lineName(line),
+						columns,
 						position: index,
 						count: lines.length,
 						reorderable,
-						editable: !readOnly,
-						onChange: (patch) => onChange(lines.map((item) => item.id === line.id ? {
-							...item,
-							...patch
-						} : item)),
-						onRemove: () => onChange(lines.filter((item) => item.id !== line.id)),
-						onMove: (to) => move(index, to)
+						onRemove: onRemove && removable(line) ? () => onRemove(line) : void 0,
+						onMove: (to) => move(index, to),
+						error: lineError?.(line)
 					}, line.id))
 				})
 			}),
-			!readOnly && /* @__PURE__ */ jsx("div", {
+			onAdd && /* @__PURE__ */ jsx("div", {
 				className: "border-t border-border bg-surface px-2 py-1.5",
 				children: /* @__PURE__ */ jsxs(Button, {
 					variant: "ghost",
 					size: "sm",
-					onClick: addLine,
+					onClick: onAdd,
 					children: [/* @__PURE__ */ jsx(Plus, { className: "size-3.5" }), text("addLine")]
 				})
 			})
 		]
-	}), /* @__PURE__ */ jsx(TotalsFooter, {
-		lines,
-		vatRate
-	})] });
+	}), footer] });
 };
 //#endregion
 export { InlineChildTable };

package/dist/inline-child-table/line-row.js

@@ -1,16 +1,12 @@
 import { cn } from "../lib/cn.js";
-import { lineTotalCents } from "../mocks/invoices.js";
 import { lineGrid } from "./columns.js";
-import { formatMoney } from "../format/money.js";
 import { LineMenu } from "./line-menu.js";
-import { NumberCell } from "./number-cell.js";
 import { text } from "./messages.js";
 import { GripVertical } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useSortable } from "@dnd-kit/sortable";
 //#region src/inline-child-table/line-row.tsx
-const parseEuros = (typed) => Math.round(Number(typed.replace(",", ".").replace(/[^0-9.]/g, "")) * 100);
-const LineRow = ({ line, position, count, reorderable, editable, onChange, onRemove, onMove }) => {
+const LineRow = ({ line, name, columns, position, count, reorderable, onRemove, onMove, error }) => {
 	const { attributes, listeners, setNodeRef, setActivatorNodeRef, transform, transition, isDragging } = useSortable({
 		id: line.id,
 		disabled: !reorderable
@@ -23,7 +19,7 @@ const LineRow = ({ line, position, count, reorderable, editable, onChange, onRem
 		label: text("moveDown"),
 		disabled: position === count - 1,
 		onSelect: () => onMove(position + 1)
-	}] : [], ...editable ? [{
+	}] : [], ...onRemove ? [{
 		label: text("removeLine"),
 		destructive: true,
 		onSelect: onRemove
@@ -31,60 +27,36 @@ const LineRow = ({ line, position, count, reorderable, editable, onChange, onRem
 	return /* @__PURE__ */ jsxs("div", {
 		ref: setNodeRef,
 		"data-line-id": line.id,
+		"aria-invalid": error ? true : void 0,
 		style: {
 			transform: transform ? `translate3d(0, ${transform.y}px, 0)` : void 0,
 			transition
 		},
-		className: cn("group relative border-b border-border bg-background px-2 py-1 last:border-b-0 hover:bg-surface", lineGrid, isDragging && "z-10 bg-surface opacity-80 shadow-pop"),
+		className: cn("group relative border-b border-border bg-background px-2 py-1 last:border-b-0 hover:bg-surface", lineGrid, isDragging && "z-10 bg-surface opacity-80 shadow-pop", error && "bg-danger-soft"),
 		children: [
 			reorderable ? /* @__PURE__ */ jsx("button", {
 				ref: setActivatorNodeRef,
 				type: "button",
-				"aria-label": text("dragToReorder", line.description),
+				"aria-label": text("dragToReorder", name),
 				...attributes,
 				...listeners,
 				style: { touchAction: "none" },
 				className: "flex size-7 cursor-grab items-center justify-center rounded text-faint-foreground opacity-60 hover:bg-muted hover:opacity-100 focus-visible:opacity-100 active:cursor-grabbing pointer-coarse:size-11",
 				children: /* @__PURE__ */ jsx(GripVertical, { className: "size-4" })
 			}) : /* @__PURE__ */ jsx("span", {}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "min-w-0",
-				children: [/* @__PURE__ */ jsx("p", {
-					className: "truncate text-foreground",
-					children: line.description
-				}), /* @__PURE__ */ jsx("p", {
-					className: "font-mono text-[11px] text-faint-foreground",
-					children: line.productId
-				})]
-			}),
-			editable ? /* @__PURE__ */ jsx(NumberCell, {
-				label: text("quantity"),
-				value: line.quantity,
-				format: String,
-				parse: (typed) => Math.round(Number(typed)),
-				onCommit: (quantity) => onChange({ quantity })
-			}) : /* @__PURE__ */ jsx("span", {
-				className: "px-2 text-right tabular-nums",
-				children: line.quantity
-			}),
-			editable ? /* @__PURE__ */ jsx(NumberCell, {
-				label: text("unitPrice"),
-				value: line.unitPriceCents,
-				format: (cents) => (cents / 100).toFixed(2),
-				parse: parseEuros,
-				onCommit: (unitPriceCents) => onChange({ unitPriceCents })
-			}) : /* @__PURE__ */ jsx("span", {
-				className: "px-2 text-right tabular-nums",
-				children: (line.unitPriceCents / 100).toFixed(2)
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "px-2 text-right font-medium tabular-nums text-foreground",
-				children: formatMoney(lineTotalCents(line))
-			}),
+			columns.map((column) => /* @__PURE__ */ jsx("div", {
+				className: cn("min-w-0", column.align === "right" && "text-right"),
+				children: column.cell(line)
+			}, column.key)),
 			menu.length > 0 ? /* @__PURE__ */ jsx(LineMenu, {
-				label: text("actionsFor", line.description),
+				label: text("actionsFor", name),
 				items: menu
-			}) : /* @__PURE__ */ jsx("span", {})
+			}) : /* @__PURE__ */ jsx("span", {}),
+			error && /* @__PURE__ */ jsx("p", {
+				role: "alert",
+				className: "col-span-full px-2 pb-1 text-xs text-danger-text",
+				children: error
+			})
 		]
 	});
 };

package/dist/inline-child-table/messages.js

@@ -15,6 +15,7 @@ const text = defineMessages({
 		unitPrice: "Unit price",
 		lineTotal: "Line total",
 		addLine: "Add line",
+		noLines: "No lines yet.",
 		moveUp: "Move up",
 		moveDown: "Move down",
 		removeLine: "Remove line",
@@ -38,6 +39,7 @@ const text = defineMessages({
 		unitPrice: "Stukprijs",
 		lineTotal: "Regeltotaal",
 		addLine: "Regel toevoegen",
+		noLines: "Nog geen regels.",
 		moveUp: "Omhoog",
 		moveDown: "Omlaag",
 		removeLine: "Regel verwijderen",

package/dist/package.js

@@ -1,5 +1,5 @@
 //#region package.json
-var version = "0.63.3";
+var version = "0.63.4";
 var protobase = { "pluginApi": 1 };
 //#endregion
 export { protobase, version };