@protobase/ui 0.21.11 → 0.21.12

package/dist/app/app.js

@@ -15,11 +15,11 @@ import { isAdmin, userToShell } from "../auth/user-to-shell.js";
 import { useOpenedRecord } from "../data/use-record.js";
 import { humanize } from "../live/naming.js";
 import { ToastProvider } from "../toasts/toast-provider.js";
-import { documentTitle, titleParts, useDocumentTitle } from "./document-title.js";
 import { recordTitle } from "../live/model-helpers.js";
 import { sourceStatusOf } from "../data/with-sources.js";
 import { MetaGate, Notice, useAdminMeta } from "./meta-gate.js";
 import { useAppAddress } from "./use-app-address.js";
+import { documentTitle, titleParts, useDocumentTitle } from "./document-title.js";
 import { ProjectUiContext, useProjectUi } from "./pages/project-ui.js";
 import { PublicFormPage } from "../forms/public-form-page.js";
 import { useFormAddress } from "../forms/use-form-address.js";

package/dist/app/comments/comment-composer.js

@@ -1,8 +1,8 @@
 import { cn } from "../../lib/cn.js";
 import { Button } from "../../primitives/button.js";
 import { useToast } from "../../toasts/toast-provider.js";
-import { Textarea } from "../../primitives/textarea.js";
 import { refusalReason } from "../displays/board-columns.js";
+import { Textarea } from "../../primitives/textarea.js";
 import { menuKeyTarget } from "../../primitives/menu-keys.js";
 import { activeMention, insertMention, mentionedIds } from "./mention-text.js";
 import { useMentionable } from "./use-mentionable.js";

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

@@ -1,9 +1,9 @@
 import { useClient } from "../../data/api-provider.js";
 import { humanize } from "../../live/naming.js";
-import { createBody, createSections, hasDatabaseDefault, initialDraft, isChosen, isRequired } from "./create-values.js";
 import { recordKey } from "../../live/model-helpers.js";
 import { Notice, useAdminMeta, usePermissions } from "../meta-gate.js";
 import { useAppAddress } from "../use-app-address.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";
 import { useFocusFirstInvalid } from "../use-focus-first-invalid.js";

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

@@ -1,6 +1,7 @@
 import { isEditable, toPatchValue } from "../../live/field-values.js";
 import { whenShown } from "../record-mode/record-mode.js";
 import { isRecordCondition } from "@protobase/schema";
+import { layoutItems } from "@protobase/schema/internal";
 //#region src/app/create/create-values.ts
 const isChosen = (value) => typeof value === "object" && value !== null && "key" in value;
 /** Fields the user can set on a new record: not read-only, not the tenant, and not structured data. */
@@ -13,7 +14,7 @@ const isCreatable = (model, field) => field.name !== model.tenant && !field.read
 const createSections = (model, view) => {
 	const creatable = Object.values(model.fields).filter((field) => isCreatable(model, field)).map((field) => field.name);
 	const placed = /* @__PURE__ */ new Set();
-	const sections = (view?.layout ?? []).flatMap((item) => {
+	const sections = layoutItems(view?.layout ?? []).flatMap((item) => {
 		if (item.kind !== "section" || isRecordCondition(item.when) || !whenShown(item.when, true)) return [];
 		const fields = item.fields.filter((name) => creatable.includes(name) && !placed.has(name) && whenShown(view?.fields[name]?.when, true));
 		fields.forEach((name) => placed.add(name));

package/dist/app/current-address.d.ts

@@ -21,6 +21,7 @@ export type CurrentAddress = ListAddress | {
   resource: string;
   key: string;
   edit?: true;
+  open?: readonly string[];
 } | {
   kind: 'create';
   resource: string;

package/dist/app/current-address.js

@@ -32,7 +32,8 @@ const currentAddress = (read, defaults) => {
 		kind: "record",
 		resource: read.resource,
 		key: encodeKey(read.key),
-		...read.edit && { edit: true }
+		...read.edit && { edit: true },
+		...read.open && { open: read.open }
 	};
 	if (read?.kind !== "list") return read;
 	return {

package/dist/app/displays/board-column.js

@@ -2,8 +2,8 @@ import { cn } from "../../lib/cn.js";
 import { Skeleton } from "../../primitives/skeleton.js";
 import { Button } from "../../primitives/button.js";
 import { humanize } from "../../live/naming.js";
-import { ErrorBanner } from "../error-banner.js";
 import { boardCard } from "./board-columns.js";
+import { ErrorBanner } from "../error-banner.js";
 import { rowAllows } from "../permissions.js";
 import { ValueBadge } from "../value-badge.js";
 import { RecordCard } from "./record-card.js";

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

@@ -2,9 +2,9 @@ import { cn } from "../../lib/cn.js";
 import { Skeleton } from "../../primitives/skeleton.js";
 import { dayIn, viewerZone } from "../../format/zone.js";
 import { formatDate, formatWeekday } from "../../format/date.js";
-import { ErrorBanner } from "../error-banner.js";
 import { usePermissions } from "../meta-gate.js";
 import { AppLink } from "../use-app-address.js";
+import { ErrorBanner } from "../error-banner.js";
 import { can, rowAllows } from "../permissions.js";
 import { collision } from "./board-dnd.js";
 import { byDay, calendarView, gridDays, rangeOf } from "./calendar-range.js";

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

@@ -1,7 +1,7 @@
 import { Skeleton } from "../../primitives/skeleton.js";
 import { humanize } from "../../live/naming.js";
-import { ErrorBanner } from "../error-banner.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";

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

@@ -2,9 +2,9 @@ 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 { ErrorBanner } from "../error-banner.js";
 import { mapCards } from "./list-displays.js";
 import { useAdminMeta } from "../meta-gate.js";
+import { ErrorBanner } from "../error-banner.js";
 import { useDebounced } from "../../lib/use-debounced.js";
 import { RecordCard } from "./record-card.js";
 import { boundsAround, worldArea } from "../map/map-area.js";

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

@@ -1,12 +1,12 @@
 import { useIsDesktop, useIsXs } from "../../lib/use-media-query.js";
 import { Skeleton } from "../../primitives/skeleton.js";
 import { humanize } from "../../live/naming.js";
-import { ErrorBanner } from "../error-banner.js";
 import { listColumnNames } from "../../live/columns-from-model.js";
 import { displayRow, loadedFields, shownDisplay } from "../displays/list-displays.js";
 import { defaultOrderBy, parseSort, sortToOrderBy } from "../list-order.js";
 import { useAdminMeta, usePermissions } from "../meta-gate.js";
 import { AppLink, useAppAddress } from "../use-app-address.js";
+import { ErrorBanner } from "../error-banner.js";
 import { useProjectUi } from "../pages/project-ui.js";
 import { can } from "../permissions.js";
 import { DataGrid } from "../../data-grid/data-grid.js";

package/dist/app/field-editor.js

@@ -3,13 +3,13 @@ import { useFieldControl } from "../primitives/field-control.js";
 import { Input } from "../primitives/input.js";
 import { buttonClass } from "../primitives/button.js";
 import { humanize } from "../live/naming.js";
-import { fromDraft, isEditable, toFieldDraft } from "../live/field-values.js";
-import { Switch } from "../primitives/switch.js";
-import { Textarea } from "../primitives/textarea.js";
 import { isMarkdown } from "../markdown/markdown-hint.js";
 import { contactFormat, contactInputProps } from "../live/contact-links.js";
 import { displayValue, valueTitle } from "../live/display-value.js";
 import { AppLink } from "./use-app-address.js";
+import { fromDraft, isEditable, toFieldDraft } from "../live/field-values.js";
+import { Switch } from "../primitives/switch.js";
+import { Textarea } from "../primitives/textarea.js";
 import { RelationPicker } from "./relation-picker.js";
 import { SensitiveField } from "./sensitive-field.js";
 import { FileField } from "./file-field.js";

package/dist/app/gallery/detail-fields.js

@@ -1,4 +1,5 @@
 import { whenShown } from "../record-mode/record-mode.js";
+import { layoutItems } from "@protobase/schema/internal";
 //#region src/app/gallery/detail-fields.ts
 /**
 * The fields of a photo's details: those its record page shows in its sections, or without a layout every field but its
@@ -6,7 +7,7 @@ import { whenShown } from "../record-mode/record-mode.js";
 * field pointing at the gallery's record.
 */
 const detailFields = (model, view, omit) => {
-	const sections = (view?.layout ?? []).flatMap((item) => item.kind === "section" && whenShown(item.when, false) ? item.fields : []);
+	const sections = layoutItems(view?.layout ?? []).flatMap((item) => item.kind === "section" && whenShown(item.when, false) ? item.fields : []);
 	return (sections.length > 0 ? [...new Set(sections)] : Object.keys(model.fields).filter((name) => name !== model.tenant && !model.primaryKey.includes(name))).filter((name) => model.fields[name] && !model.fields[name].sensitive && !omit.includes(name) && whenShown(view?.fields[name]?.when, false));
 };
 //#endregion

package/dist/app/gallery/gallery-section.js

@@ -3,8 +3,8 @@ import { Skeleton } from "../../primitives/skeleton.js";
 import { humanize } from "../../live/naming.js";
 import { Section } from "../../record-view/section.js";
 import { shownImage } from "../../live/file-values.js";
-import { ErrorBanner } from "../error-banner.js";
 import { useAdminMeta, usePermissions } from "../meta-gate.js";
+import { ErrorBanner } from "../error-banner.js";
 import { FileImage } from "../../live/file-image.js";
 import { galleryTiles } from "./gallery-layout.js";
 import { Lightbox } from "./lightbox.js";

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

@@ -1,9 +1,9 @@
 import { Skeleton } from "../../primitives/skeleton.js";
 import { useRecord } from "../../data/use-record.js";
 import { humanize } from "../../live/naming.js";
+import { AppLink } from "../use-app-address.js";
 import { SpecTable } from "../../record-view/spec-table.js";
 import { ErrorBanner } from "../error-banner.js";
-import { AppLink } from "../use-app-address.js";
 import { fieldAccess } from "../permissions.js";
 import { FieldValue } from "../pages/field-value.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/app/group-open.js

@@ -0,0 +1,7 @@
+//#region src/app/group-open.ts
+/** The open groups after the person opens or closes `title`. */
+const toggledOpen = (open = [], title) => open.includes(title) ? open.filter((name) => name !== title) : [...open, title];
+/** Whether a group shows its items: always unless `collapsed`, else when the address names it or one of its sections holds a field that needs the person's attention. */
+const groupOpen = (group, open = [], needsAttention) => !group.collapsed || open.includes(group.title) || group.items.some((item) => item.kind === "section" && item.fields.some(needsAttention));
+//#endregion
+export { groupOpen, toggledOpen };

package/dist/app/hand-order/hand-sorted-list.js

@@ -1,10 +1,10 @@
 import { Skeleton } from "../../primitives/skeleton.js";
 import { humanize } from "../../live/naming.js";
-import { ErrorBanner } from "../error-banner.js";
 import { recordKey, recordTitle } from "../../live/model-helpers.js";
 import { loadedFields } from "../displays/list-displays.js";
 import { useAdminMeta } from "../meta-gate.js";
 import { useAppAddress } from "../use-app-address.js";
+import { ErrorBanner } from "../error-banner.js";
 import { useProjectUi } from "../pages/project-ui.js";
 import { DataGrid } from "../../data-grid/data-grid.js";
 import { embeddedColumns } from "../embedded-list/embedded-columns.js";

package/dist/app/incoming-relations.js

@@ -1,5 +1,6 @@
 import { humanize } from "../live/naming.js";
 import { createWhere, printFilter } from "@protobase/schema";
+import { layoutItems } from "@protobase/schema/internal";
 //#region src/app/incoming-relations.ts
 const where$1 = createWhere();
 /**
@@ -10,7 +11,7 @@ const where$1 = createWhere();
 */
 const incomingRelations = (model, resources, views, layout, lines) => {
 	if (model.primaryKey.length !== 1) return [];
-	const listed = new Set(layout.flatMap((item) => item.kind === "related" && !item.through ? [`${item.resource}.${item.field}`] : []));
+	const listed = new Set(layoutItems(layout).flatMap((item) => item.kind === "related" && !item.through ? [`${item.resource}.${item.field}`] : []));
 	const found = Object.values(resources).flatMap((source) => Object.values(source.fields).filter((field) => field.type === "relation" && field.relation?.resource === model.name && field.relation.columns.length === 1 && field.filterable).filter((field) => field.name !== source.tenant && source.name !== lines?.name && !listed.has(`${source.name}.${field.name}`)).map((field) => ({
 		source,
 		field: field.name

package/dist/app/list-page.js

@@ -4,7 +4,6 @@ import { PageHeader } from "../app-shell/page-header.js";
 import { useAuth } from "../auth/auth-provider.js";
 import { Button, buttonClass } from "../primitives/button.js";
 import { humanize } from "../live/naming.js";
-import { ErrorBanner } from "./error-banner.js";
 import { recordKey, recordTitleField } from "../live/model-helpers.js";
 import { columnsFromModel, listColumnNames } from "../live/columns-from-model.js";
 import { displayRow, listDisplayChoices, loadedFields, shownListDisplay } from "./displays/list-displays.js";
@@ -12,6 +11,7 @@ import { parseSort, sortToOrderBy } from "./list-order.js";
 import { listedResource } from "./current-address.js";
 import { Notice, useAdminMeta, usePermissions } from "./meta-gate.js";
 import { AppLink, useAppAddress } from "./use-app-address.js";
+import { ErrorBanner } from "./error-banner.js";
 import { useProjectUi } from "./pages/project-ui.js";
 import { Sheet } from "../primitives/sheet.js";
 import { can, rowAllows } from "./permissions.js";

package/dist/app/pages/action-inputs/action-inputs-dialog.js

@@ -1,8 +1,8 @@
 import { Button } from "../../../primitives/button.js";
 import { Field } from "../../../record-view/field.js";
+import { useAdminMeta } from "../../meta-gate.js";
 import { isChosen } from "../../create/create-values.js";
 import { ErrorBanner } from "../../error-banner.js";
-import { useAdminMeta } from "../../meta-gate.js";
 import { useProjectUi } from "../project-ui.js";
 import { FieldEditor } from "../../field-editor.js";
 import { ResponsiveDialog } from "../../../primitives/responsive-dialog.js";

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

@@ -1,6 +1,6 @@
 import { Skeleton } from "../../../primitives/skeleton.js";
-import { ErrorBanner } from "../../error-banner.js";
 import { useAdminMeta } from "../../meta-gate.js";
+import { ErrorBanner } from "../../error-banner.js";
 import { RecordScope } from "../record-scope.js";
 import { scopeOf, useListPage } from "../use-layout-data.js";
 import { propsOf } from "./block-props.js";

package/dist/app/pages/blocks/modal-form.js

@@ -4,10 +4,10 @@ import { useClient } from "../../../data/api-provider.js";
 import { humanize } from "../../../live/naming.js";
 import { useToast } from "../../../toasts/toast-provider.js";
 import { Field } from "../../../record-view/field.js";
+import { useAdminMeta, usePermissions } from "../../meta-gate.js";
 import { differs, toDraft, toPatchValue } from "../../../live/field-values.js";
 import { createBody, isChosen } from "../../create/create-values.js";
 import { ErrorBanner } from "../../error-banner.js";
-import { useAdminMeta, usePermissions } from "../../meta-gate.js";
 import { FieldEditor } from "../../field-editor.js";
 import { fieldErrors, fieldMessage } from "../../field-errors.js";
 import { useFocusFirstInvalid } from "../../use-focus-first-invalid.js";

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

@@ -1,6 +1,6 @@
 import { Skeleton } from "../../../primitives/skeleton.js";
-import { ErrorBanner } from "../../error-banner.js";
 import { useAdminMeta } from "../../meta-gate.js";
+import { ErrorBanner } from "../../error-banner.js";
 import { RecordScope } from "../record-scope.js";
 import { useFirstRecord } from "../use-layout-data.js";
 import { propsOf } from "./block-props.js";

package/dist/app/pages/record-actions.js

@@ -1,8 +1,8 @@
 import { useTopBarSlot } from "../../app-shell/top-bar-slot.js";
 import "../../app-shell/top-bar.js";
 import { ActionRail } from "../../record-view/action-rail.js";
-import { ActionMenu } from "../../record-view/action-menu.js";
 import { AppLink, useAppAddress } from "../use-app-address.js";
+import { ActionMenu } from "../../record-view/action-menu.js";
 import { ActionPrompt, asksFirst } from "./action-prompt.js";
 import { useActionRunner } from "./use-run-action.js";
 import { actionIcon } from "../action-icon.js";

package/dist/app/record-mode/shown-layout.js

@@ -1,17 +1,24 @@
 import { whenShown } from "./record-mode.js";
 import { isRecordCondition } from "@protobase/schema";
 //#region src/app/record-mode/shown-layout.ts
-/** The items with a record condition in `when`, whose conditions the page evaluates. */
-const conditionalItems = (items) => items.filter((item) => isRecordCondition(item.when));
+/** The items with a record condition in `when`, those inside groups too, whose conditions the page evaluates: a group before its items. */
+const conditionalItems = (items) => items.flatMap((item) => item.kind === "group" ? [item, ...item.items] : [item]).filter((item) => isRecordCondition(item.when));
 /**
 * The items that show: those with a record condition only when it holds (`held`, one answer per conditional item in
-* order, `undefined` while loading) and the page is no preview; the others by the form or read view.
+* the order `conditionalItems` lists them, `undefined` while loading) and the page is no preview; the others by the
+* form or read view. A group keeps the items inside it that show, and goes when it or all of them do not.
 */
 const shownLayout = (items, held, editing, preview) => {
 	let next = 0;
-	return items.filter((item) => {
-		if (!isRecordCondition(item.when)) return whenShown(item.when, editing);
-		return !preview && held[next++] === true;
+	const shown = (item) => isRecordCondition(item.when) ? !preview && held[next++] === true : whenShown(item.when, editing);
+	return items.flatMap((item) => {
+		if (item.kind !== "group") return shown(item) ? [item] : [];
+		const groupShown = shown(item);
+		const inner = item.items.filter(shown);
+		return groupShown && inner.length > 0 ? [{
+			...item,
+			items: inner
+		}] : [];
 	});
 };
 //#endregion

package/dist/app/record-page.js

@@ -13,12 +13,6 @@ import { Field } from "../record-view/field.js";
 import { Section } from "../record-view/section.js";
 import { MetadataCard } from "../record-view/record-sidebar.js";
 import { RecordHeader } from "../record-view/record-header.js";
-import { SpecTable } from "../record-view/spec-table.js";
-import { KeyFacts } from "../record-view/key-facts.js";
-import { fromDraft, isRequiredOnEdit } from "../live/field-values.js";
-import { fieldHelp, helpShown, recordShown, whenShown } from "./record-mode/record-mode.js";
-import { isChosen, keyValue } from "./create/create-values.js";
-import { ErrorBanner } from "./error-banner.js";
 import { isMarkdown } from "../markdown/markdown-hint.js";
 import { recordTitle } from "../live/model-helpers.js";
 import { contactFormat } from "../live/contact-links.js";
@@ -27,6 +21,13 @@ import { displayValue, valueTitle } from "../live/display-value.js";
 import { filledFields } from "./filled-fields.js";
 import { Notice, useAdminMeta, usePermissions } from "./meta-gate.js";
 import { AppLink, useAppAddress } from "./use-app-address.js";
+import { GroupSection } from "../record-view/group-section.js";
+import { SpecTable } from "../record-view/spec-table.js";
+import { KeyFacts } from "../record-view/key-facts.js";
+import { fromDraft, isRequiredOnEdit } from "../live/field-values.js";
+import { fieldHelp, helpShown, recordShown, whenShown } from "./record-mode/record-mode.js";
+import { isChosen, keyValue } from "./create/create-values.js";
+import { ErrorBanner } from "./error-banner.js";
 import { useProjectUi } from "./pages/project-ui.js";
 import { shownWidget } from "./field-types/shown-widget.js";
 import { WidgetPart } from "./field-types/widget-part.js";
@@ -45,6 +46,7 @@ import { auditField } from "../live/audit-fields.js";
 import { CustomSection } from "./custom-section.js";
 import { MapSection } from "./map/map-section.js";
 import { RecordActions } from "./pages/record-actions.js";
+import { groupOpen, toggledOpen } from "./group-open.js";
 import { RecordLines, findLinesResource } from "./record-lines.js";
 import { draftStorageKey } from "./draft-storage.js";
 import { useLines } from "./use-lines.js";
@@ -150,15 +152,17 @@ const LoadedRecord = ({ model, recordKey, stored, preview }) => {
 	const { shown, offersEdit, editing } = recordShown(view?.recordMode, canUpdate, address?.kind === "record" && address.edit === true);
 	useNavigationGuard(editor.dirty && shown === "form");
 	usePauseFocusRefresh(editor.dirty);
-	const readAddress = {
+	const openGroups = address?.kind === "record" ? address.open : void 0;
+	const atEdit = address?.kind === "record" && address.edit === true;
+	const recordAt = (open = [], edit = false) => ({
 		kind: "record",
 		resource: model.name,
-		key: recordKey
-	};
-	const editAddress = {
-		...readAddress,
-		edit: true
-	};
+		key: recordKey,
+		...edit && { edit },
+		...open.length > 0 && { open }
+	});
+	const readAddress = recordAt(openGroups);
+	const editAddress = recordAt(openGroups, true);
 	const leavesForm = shown === "form" && view?.recordMode !== void 0 && view.recordMode !== "edit";
 	const canDelete = can(permissions, "delete") && stored.permissions?.delete !== false;
 	const remove = useDeleteFlow({
@@ -344,6 +348,69 @@ const LoadedRecord = ({ model, recordKey, stored, preview }) => {
 			children: "Unsaved changes"
 		})
 	] });
+	const mainItem = (item, index) => {
+		if (item.kind === "group") {
+			const children = item.items.flatMap(mainItem);
+			if (children.length === 0) return [];
+			const open = groupOpen(item, openGroups, (name) => editing && (editor.errors[name] !== void 0 || editor.conflicts[name] !== void 0));
+			const toggle = item.collapsed ? recordAt(toggledOpen(openGroups, item.title), atEdit) : void 0;
+			return [/* @__PURE__ */ jsx(GroupSection, {
+				title: item.title,
+				open,
+				toggle,
+				children
+			}, `group:${item.title}`)];
+		}
+		if (item.kind === "related") return [/* @__PURE__ */ jsx(RelatedSection, {
+			item,
+			recordKey,
+			owner: model.name
+		}, `related:${item.title}`)];
+		if (preview && (item.kind === "custom" || item.kind === "map" || item.kind === "gallery")) return [];
+		if (item.kind === "custom") return item.sidebar ? [] : [/* @__PURE__ */ jsx(CustomSection, {
+			item,
+			scope
+		}, `custom:${index}`)];
+		if (item.kind === "map") return item.sidebar ? [] : [/* @__PURE__ */ jsx(MapSection, {
+			item,
+			record: stored.record
+		}, `map:${index}`)];
+		if (item.kind === "gallery") return [/* @__PURE__ */ jsx(GallerySection, {
+			item,
+			record: stored.record,
+			recordKey
+		}, `gallery:${index}`)];
+		if (item.kind === "history") return [/* @__PURE__ */ jsx(HistorySection, {
+			item,
+			model,
+			view,
+			recordKey,
+			etag: stored.etag
+		}, `history:${index}`)];
+		if (item.kind === "comments") return [/* @__PURE__ */ jsx(CommentsSection, {
+			item,
+			resource: model.name,
+			recordKey,
+			canWrite: auth.kind !== "visitor"
+		}, `comments:${index}`)];
+		if (item.kind !== "section") return [];
+		const visibleFields = item.fields.filter((name) => model.fields[name] && visible(name));
+		const facts = shown === "read" && item.presentation === "facts";
+		const fields = facts ? filledFields(stored.record, visibleFields) : visibleFields;
+		if (fields.length === 0) return [];
+		return [/* @__PURE__ */ jsx(Section, {
+			title: item.title,
+			help: helpShown(item.helpWhen, view, editing) ? item.help : void 0,
+			children: facts ? /* @__PURE__ */ jsx(KeyFacts, { facts: fields.map((name) => ({
+				label: readRow(name).label,
+				value: readRow(name).value,
+				icon: namedIcon(hint(name)?.icon)
+			})) }) : shown === "read" ? /* @__PURE__ */ jsx(SpecTable, { rows: fields.map(readRow) }) : /* @__PURE__ */ jsx("div", {
+				className: "grid grid-cols-1 gap-x-6 gap-y-5 sm:grid-cols-2",
+				children: fields.map(fieldView)
+			})
+		}, item.title)];
+	};
 	return /* @__PURE__ */ jsxs("div", {
 		ref: fieldsRef,
 		className: "flex flex-1 flex-col",
@@ -412,57 +479,7 @@ const LoadedRecord = ({ model, recordKey, stored, preview }) => {
 							className: "grid grid-cols-1 gap-8 md:grid-cols-[minmax(0,1fr)_300px] md:gap-12",
 							children: [/* @__PURE__ */ jsxs("main", {
 								className: "divide-y divide-border",
-								children: [layout.flatMap((item, index) => {
-									if (item.kind === "related") return [/* @__PURE__ */ jsx(RelatedSection, {
-										item,
-										recordKey,
-										owner: model.name
-									}, `related:${item.title}`)];
-									if (preview && (item.kind === "custom" || item.kind === "map" || item.kind === "gallery")) return [];
-									if (item.kind === "custom") return item.sidebar ? [] : [/* @__PURE__ */ jsx(CustomSection, {
-										item,
-										scope
-									}, `custom:${index}`)];
-									if (item.kind === "map") return item.sidebar ? [] : [/* @__PURE__ */ jsx(MapSection, {
-										item,
-										record: stored.record
-									}, `map:${index}`)];
-									if (item.kind === "gallery") return [/* @__PURE__ */ jsx(GallerySection, {
-										item,
-										record: stored.record,
-										recordKey
-									}, `gallery:${index}`)];
-									if (item.kind === "history") return [/* @__PURE__ */ jsx(HistorySection, {
-										item,
-										model,
-										view,
-										recordKey,
-										etag: stored.etag
-									}, `history:${index}`)];
-									if (item.kind === "comments") return [/* @__PURE__ */ jsx(CommentsSection, {
-										item,
-										resource: model.name,
-										recordKey,
-										canWrite: auth.kind !== "visitor"
-									}, `comments:${index}`)];
-									if (item.kind !== "section") return [];
-									const visibleFields = item.fields.filter((name) => model.fields[name] && visible(name));
-									const facts = shown === "read" && item.presentation === "facts";
-									const fields = facts ? filledFields(stored.record, visibleFields) : visibleFields;
-									if (fields.length === 0) return [];
-									return [/* @__PURE__ */ jsx(Section, {
-										title: item.title,
-										help: helpShown(item.helpWhen, view, editing) ? item.help : void 0,
-										children: facts ? /* @__PURE__ */ jsx(KeyFacts, { facts: fields.map((name) => ({
-											label: readRow(name).label,
-											value: readRow(name).value,
-											icon: namedIcon(hint(name)?.icon)
-										})) }) : shown === "read" ? /* @__PURE__ */ jsx(SpecTable, { rows: fields.map(readRow) }) : /* @__PURE__ */ jsx("div", {
-											className: "grid grid-cols-1 gap-x-6 gap-y-5 sm:grid-cols-2",
-											children: fields.map(fieldView)
-										})
-									}, item.title)];
-								}), linesModel && !preview && /* @__PURE__ */ jsx(RecordLines, {
+								children: [layout.flatMap(mainItem), linesModel && !preview && /* @__PURE__ */ jsx(RecordLines, {
 									lines: linesModel,
 									draft: linesDraft,
 									vatRate: Number(stored.record.vatRate ?? 21) / 100,

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

@@ -1,11 +1,11 @@
 import { useIsXs } from "../../lib/use-media-query.js";
 import { Skeleton } from "../../primitives/skeleton.js";
 import { humanize } from "../../live/naming.js";
-import { ErrorBanner } from "../error-banner.js";
 import { displaysOf, loadedFields } from "../displays/list-displays.js";
 import { defaultOrderBy } from "../list-order.js";
 import { useAdminMeta } from "../meta-gate.js";
 import { AppLink } from "../use-app-address.js";
+import { ErrorBanner } from "../error-banner.js";
 import { useLiveRows } from "../../live/use-live-rows.js";
 import { viewAllAddress } from "../embedded-list/embedded-display.js";
 import { FilterChipList } from "../searches/filter-chip-list.js";

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

@@ -1,8 +1,8 @@
 import { Skeleton } from "../../primitives/skeleton.js";
 import { humanize } from "../../live/naming.js";
-import { ErrorBanner } from "../error-banner.js";
 import { listedResource } from "../current-address.js";
 import { useAdminMeta } from "../meta-gate.js";
+import { ErrorBanner } from "../error-banner.js";
 import { savedScope } from "../saved/saved-records.js";
 import { useSavedRecords } from "../saved/use-saved-records.js";
 import { RecordRowBody } from "./record-row-body.js";

package/dist/app/related-section.js

@@ -2,9 +2,9 @@ import { Skeleton } from "../primitives/skeleton.js";
 import { keys } from "../data/query-keys.js";
 import { useClient } from "../data/api-provider.js";
 import { Section } from "../record-view/section.js";
-import { ErrorBanner } from "./error-banner.js";
 import { listColumnNames } from "../live/columns-from-model.js";
 import { useAdminMeta, usePermissions } from "./meta-gate.js";
+import { ErrorBanner } from "./error-banner.js";
 import { countQuery } from "./pages/use-layout-data.js";
 import { searchAll } from "../live/search-all.js";
 import { relatedOpens } from "./related-opens.js";

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

@@ -1,9 +1,9 @@
 import { Skeleton } from "../../primitives/skeleton.js";
 import { humanize } from "../../live/naming.js";
-import { ErrorBanner } from "../error-banner.js";
 import { recordKey } from "../../live/model-helpers.js";
 import { useAdminMeta } from "../meta-gate.js";
 import { AppLink } from "../use-app-address.js";
+import { ErrorBanner } from "../error-banner.js";
 import { InlineFilterChips } from "./filter-chip-list.js";
 import { RecordRowBody } from "../record-row/record-row-body.js";
 import { useSavedSearches } from "./use-saved-searches.js";

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

@@ -1,10 +1,10 @@
 import { Skeleton } from "../../primitives/skeleton.js";
 import { PageHeader } from "../../app-shell/page-header.js";
 import { humanize } from "../../live/naming.js";
-import { ErrorBanner } from "../error-banner.js";
 import { recordKey } from "../../live/model-helpers.js";
 import { Notice, useAdminMeta, usePermissions } from "../meta-gate.js";
 import { AppLink } from "../use-app-address.js";
+import { ErrorBanner } from "../error-banner.js";
 import { can } from "../permissions.js";
 import { useSavedSearches } from "./use-saved-searches.js";
 import { useDeleteFlow } from "../delete/use-delete-flow.js";

package/dist/app/sensitive-field.js

@@ -2,9 +2,9 @@ import { cn } from "../lib/cn.js";
 import { Input } from "../primitives/input.js";
 import { Button } from "../primitives/button.js";
 import { humanize } from "../live/naming.js";
+import { displayValue } from "../live/display-value.js";
 import { toDraft } from "../live/field-values.js";
 import { ErrorBanner } from "./error-banner.js";
-import { displayValue } from "../live/display-value.js";
 import { useState } from "react";
 import { Eye, EyeOff } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/app/use-app-address.d.ts

@@ -21,6 +21,7 @@ export declare const useAppAddress: () => {
 /** A link to an address in the app: an ordinary anchor that the router follows without reloading the page. */
 export declare const AppLink: ({ to, ...rest }: AnchorHTMLAttributes<HTMLAnchorElement> & {
   to: AppAddress;
+  replace?: boolean;
 }) => import("react").JSX.Element;
 //#endregion
 export type { CurrentAddress, ListAddress, ListChange };

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

@@ -1,7 +1,7 @@
 import { keys } from "../data/query-keys.js";
 import { useClient } from "../data/api-provider.js";
-import { differs, toDraft, toPatchValue } from "../live/field-values.js";
 import { displayValue } from "../live/display-value.js";
+import { differs, toDraft, toPatchValue } from "../live/field-values.js";
 import { fieldErrors } from "./field-errors.js";
 import { useLiveSave } from "./use-live-save.js";
 import { readDraft, writeDraft } from "./draft-storage.js";