@protobase/ui 0.46.3 → 0.46.5

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

@@ -1,46 +1,32 @@
-import { Button } from "../../../primitives/button.js";
-import { Dialog } from "../../../primitives/dialog.js";
-import { useNavigationGuard } from "../../router.js";
 import { useClient } from "../../../data/api-provider.js";
 import { useAdminMeta, usePermissions } from "../../meta-gate.js";
-import { text } from "../messages.js";
-import { humanize } from "../../../live/naming.js";
+import { Button } from "../../../primitives/button.js";
+import { Dialog } from "../../../primitives/dialog.js";
 import { useToast } from "../../../toasts/toast-provider.js";
 import { Field } from "../../../record-view/field.js";
-import { differs, toDraft, toPatchValue } from "../../../live/field-values.js";
+import { humanize } from "../../../live/naming.js";
+import { useNavigationGuard } from "../../router.js";
 import { createBody, isChosen } from "../../create/create-values.js";
 import { ErrorBanner } from "../../error-banner.js";
+import { text } from "../messages.js";
 import { FieldEditor } from "../../field-editor.js";
-import { fieldErrors, fieldMessage } from "../../field-errors.js";
-import { useFocusFirstInvalid } from "../../use-focus-first-invalid.js";
 import { useLayoutRecord } from "../record-scope.js";
 import { can } from "../../permissions.js";
 import { useFirstRecord, useRefreshResource } from "../use-layout-data.js";
 import { propsOf } from "./block-props.js";
+import { fieldErrors, fieldMessage } from "../../field-errors.js";
+import { useFocusFirstInvalid } from "../../use-focus-first-invalid.js";
+import { editBody, startingDraft } from "./form-draft.js";
 import { useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/app/pages/blocks/modal-form.tsx
-/** The literal defaults of new records, or the record's values when editing; relations as `{ key, label }` once chosen. */
-const startingDraft = (model, fields, record) => Object.fromEntries(fields.map((name) => {
-	const field = model.fields[name];
-	if (field.type === "file") return [name, record?.record[name] ?? null];
-	if (record) return [name, field.type === "boolean" ? Boolean(record.record[name]) : toDraft(record.record[name])];
-	const fallback = field.default && "value" in field.default ? field.default.value : void 0;
-	return [name, field.type === "boolean" ? Boolean(fallback) : toDraft(fallback)];
-}));
-/** Changed fields only; a chosen relation sends its key. */
-const editBody = (model, draft, record) => Object.fromEntries(Object.entries(draft).flatMap(([name, value]) => {
-	const field = model.fields[name];
-	if (isChosen(value)) return value.key === toDraft(record.record[name]) ? [] : [[name, field.type === "integer" ? Number(value.key) : value.key]];
-	return differs(field, value, record.record[name]) ? [[name, toPatchValue(field, value)]] : [];
-}));
 const ModalFormDialog = ({ model, record, mode, label, title, fields, values, onClose }) => {
 	const { resources, views } = useAdminMeta();
 	const client = useClient();
 	const toast = useToast();
 	const refresh = useRefreshResource();
 	const view = views[model.name];
-	const [draft, setDraft] = useState(() => startingDraft(model, fields, record));
+	const [draft, setDraft] = useState(() => startingDraft(model, fields, record?.record));
 	const [errors, setErrors] = useState({});
 	const [rejections, setRejections] = useState(0);
 	const formRef = useFocusFirstInvalid(rejections);
@@ -54,7 +40,7 @@ const ModalFormDialog = ({ model, record, mode, label, title, fields, values, on
 		await (mode === "create" ? client.create(model.name, {
 			...createBody(model, resources, draft),
 			...values
-		}) : client.update(model.name, record.key, editBody(model, draft, record), record.etag ?? "*")).then(async () => {
+		}) : client.update(model.name, record.key, editBody(model, draft, record.record), record.etag ?? "*")).then(async () => {
 			await refresh(model.name);
 			toast.show({
 				state: "success",

package/dist/app/pages/blocks/page-block.js

@@ -1,5 +1,5 @@
-import { PageHeader } from "../../../app-shell/page-header.js";
 import { propsOf } from "./block-props.js";
+import { PageHeader } from "../../../app-shell/page-header.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/app/pages/blocks/page-block.tsx
 const PageBlock = ({ node, children, slots }) => {

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

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

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

@@ -0,0 +1,179 @@
+import { useClient } from "../../../data/api-provider.js";
+import { useAdminMeta, usePermissions } from "../../meta-gate.js";
+import { Button } from "../../../primitives/button.js";
+import { Skeleton } from "../../../primitives/skeleton.js";
+import { useToast } from "../../../toasts/toast-provider.js";
+import { Field } from "../../../record-view/field.js";
+import { humanize } from "../../../live/naming.js";
+import { differs } from "../../../live/field-values.js";
+import { createBody } from "../../create/create-values.js";
+import { ErrorBanner } from "../../error-banner.js";
+import { text } from "../messages.js";
+import { FieldEditor } from "../../field-editor.js";
+import { can } from "../../permissions.js";
+import { scopeOf, useFirstRecord, useRefreshResource } from "../use-layout-data.js";
+import { propsOf } from "./block-props.js";
+import { CardFrame } from "./card-frame.js";
+import { fieldErrors, fieldMessage } from "../../field-errors.js";
+import { editBody, startingDraft } from "./form-draft.js";
+import { useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/app/pages/blocks/settings.tsx
+/** A switch or a choice saves as soon as it changes; what is typed waits for Save. */
+const savesAtOnce = (field) => field.type === "boolean" || field.type === "enum";
+const SettingsForm = ({ model, fields, title, description, stored: loaded }) => {
+	const { resources, views } = useAdminMeta();
+	const permissions = usePermissions(model.name);
+	const client = useClient();
+	const toast = useToast();
+	const refresh = useRefreshResource();
+	const view = views[model.name];
+	const [stored, setStored] = useState(loaded);
+	const [draft, setDraft] = useState(() => startingDraft(model, fields, loaded?.record));
+	const [errors, setErrors] = useState({});
+	const [failure, setFailure] = useState();
+	const [saving, setSaving] = useState(false);
+	const queue = useRef(Promise.resolve());
+	const latest = useRef(loaded);
+	const defaults = startingDraft(model, fields, void 0);
+	const writable = stored ? can(permissions, "update") && stored.permissions?.update !== false : can(permissions, "create");
+	const typed = fields.filter((name) => !savesAtOnce(model.fields[name]));
+	const unsaved = typed.some((name) => stored ? differs(model.fields[name], draft[name], stored.record[name]) : draft[name] !== defaults[name]);
+	const write = async (changes) => {
+		const current = latest.current;
+		if (current) {
+			const saved = await client.update(model.name, current.key, editBody(model, changes, current.record), current.etag ?? "*");
+			return {
+				...scopeOf(model, saved.record),
+				etag: saved.etag,
+				permissions: saved.permissions ?? current.permissions
+			};
+		}
+		const created = await client.create(model.name, createBody(model, resources, {
+			...defaults,
+			...changes
+		}));
+		return {
+			...scopeOf(model, created.record),
+			etag: created.etag
+		};
+	};
+	const save = (changes) => {
+		const run = queue.current.then(async () => {
+			setSaving(true);
+			setFailure(void 0);
+			await write(changes).then(async (record) => {
+				latest.current = record;
+				setStored(record);
+				setErrors((current) => Object.fromEntries(Object.entries(current).filter(([name]) => !Object.hasOwn(changes, name))));
+				await refresh(model.name);
+				toast.show({
+					state: "success",
+					title: text("saved", title ?? text("settings"))
+				});
+			}, (error) => {
+				setErrors((current) => ({
+					...current,
+					...fieldErrors(error)
+				}));
+				setFailure(error);
+			});
+			setSaving(false);
+		});
+		queue.current = run;
+	};
+	const change = (name, next) => {
+		setDraft((current) => ({
+			...current,
+			[name]: next
+		}));
+		if (savesAtOnce(model.fields[name])) save({ [name]: next });
+	};
+	return /* @__PURE__ */ jsx(CardFrame, {
+		title,
+		description,
+		className: "h-full",
+		children: /* @__PURE__ */ jsxs("form", {
+			className: "flex flex-col gap-4",
+			onSubmit: (event) => {
+				event.preventDefault();
+				if (unsaved) save(Object.fromEntries(typed.map((name) => [name, draft[name]])));
+			},
+			children: [
+				failure !== void 0 && Object.keys(errors).length === 0 && /* @__PURE__ */ jsx(ErrorBanner, {
+					title: text("notSaved"),
+					error: failure
+				}),
+				fields.map((name) => {
+					const field = model.fields[name];
+					const label = view?.fields[name]?.label ?? humanize(name);
+					const problem = errors[name];
+					return /* @__PURE__ */ jsx(Field, {
+						name,
+						label,
+						help: view?.fields[name]?.help,
+						error: problem && fieldMessage(field, label, problem),
+						children: /* @__PURE__ */ jsx(FieldEditor, {
+							field,
+							hints: view?.fields[name],
+							value: draft[name],
+							stored: stored?.record[name] ?? defaults[name],
+							invalid: Boolean(problem),
+							locked: !writable || field.readOnly,
+							resource: model.name,
+							onChange: (next) => change(name, next)
+						})
+					}, name);
+				}),
+				writable && unsaved && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Button, {
+					type: "submit",
+					variant: "primary",
+					size: "sm",
+					loading: saving,
+					children: text("save")
+				}) })
+			]
+		})
+	});
+};
+const LoadedSettings = (props) => {
+	const record = useFirstRecord(props.model, {});
+	if (record.isPending) return /* @__PURE__ */ jsx(CardFrame, {
+		title: props.title,
+		description: props.description,
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col gap-2",
+			children: [/* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-1/2" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-1/3" })]
+		})
+	});
+	if (record.error) return /* @__PURE__ */ jsx(CardFrame, {
+		title: props.title,
+		description: props.description,
+		children: /* @__PURE__ */ jsx(ErrorBanner, {
+			title: text("couldNotLoad"),
+			error: record.error
+		})
+	});
+	return /* @__PURE__ */ jsx(SettingsForm, {
+		...props,
+		stored: record.data ?? void 0
+	});
+};
+/**
+* The signed-in person's own record of a resource as settings: each field as a control, a switch or a choice saving as
+* it changes and typed values with Save, the defaults shown until the first save creates the record. The server keeps
+* every caller to their own record, so the list holds at most theirs.
+*/
+const SettingsBlock = ({ node }) => {
+	const { resource, fields = [], ...rest } = propsOf(node);
+	const model = useAdminMeta().resources[resource];
+	if (!model) return null;
+	return /* @__PURE__ */ jsx(LoadedSettings, {
+		...rest,
+		model,
+		fields: fields.filter((name) => Object.hasOwn(model.fields, name)),
+		stored: void 0
+	});
+};
+//#endregion
+export { SettingsBlock, savesAtOnce };

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

@@ -1,8 +1,8 @@
 import { formatTag } from "../../../locale/active-locale.js";
-import { Skeleton } from "../../../primitives/skeleton.js";
 import { useAdminMeta } from "../../meta-gate.js";
-import { text } from "../messages.js";
+import { Skeleton } from "../../../primitives/skeleton.js";
 import { AppLink } from "../../use-app-address.js";
+import { text } from "../messages.js";
 import { useLayoutRecord } from "../record-scope.js";
 import { useCount } from "../use-layout-data.js";
 import { propsOf } from "./block-props.js";

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

@@ -0,0 +1,59 @@
+import { cn } from "../../../lib/cn.js";
+import { shownPageTab, tabsOf, usePageTabsRoute } from "../page-tabs.js";
+import { Link, useRouter } from "../../router.js";
+import { Problem } from "../problem.js";
+import { text } from "../messages.js";
+import { Fragment } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/app/pages/blocks/tabs.tsx
+/**
+* The page's tabs, each a link to its own address, and the shown tab alone (its children are the tabs, one each, in
+* order), so the others load nothing. On a phone they are a select. A name the page has no tab for, such as one the
+* user may not see, says so under the tabs.
+*/
+const TabsBlock = ({ node, children }) => {
+	const { tab: named, pathOf } = usePageTabsRoute();
+	const { navigate } = useRouter();
+	const tabs = tabsOf(node);
+	const shown = shownPageTab(tabs, named);
+	const path = (name) => pathOf(name === tabs[0]?.name ? void 0 : name);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col gap-6",
+		children: [
+			/* @__PURE__ */ jsxs("select", {
+				"aria-label": text("tabs"),
+				value: shown?.name ?? "",
+				onChange: (event) => navigate(path(event.target.value)),
+				className: "h-9 rounded-md border border-border-strong bg-background px-2 font-medium md:hidden",
+				children: [!shown && /* @__PURE__ */ jsx("option", {
+					value: "",
+					disabled: true
+				}), tabs.map((tab) => /* @__PURE__ */ jsx("option", {
+					value: tab.name,
+					children: tab.label
+				}, tab.name))]
+			}),
+			/* @__PURE__ */ jsx("nav", {
+				"aria-label": text("tabs"),
+				className: "hidden border-b md:block",
+				children: /* @__PURE__ */ jsx("ul", {
+					className: "flex gap-1",
+					children: tabs.map((tab) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Link, {
+						to: path(tab.name),
+						"aria-current": tab === shown ? "page" : void 0,
+						className: cn("-mb-px inline-flex h-9 items-center whitespace-nowrap border-b-2 px-3 font-medium transition-colors", tab === shown ? "border-foreground text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"),
+						children: tab.label
+					}) }, tab.name))
+				})
+			}),
+			shown ? /* @__PURE__ */ jsx(Fragment, { children: children[tabs.indexOf(shown)] }, shown.name) : /* @__PURE__ */ jsx(Problem, { children: text("noTab", named ?? "") })
+		]
+	});
+};
+/** One tab's elements, stacked as on the page. */
+const TabBlock = ({ children }) => /* @__PURE__ */ jsx("div", {
+	className: "flex flex-col gap-6",
+	children
+});
+//#endregion
+export { TabBlock, TabsBlock };

package/dist/app/pages/composed-page.js

@@ -1,17 +1,30 @@
 import { Notice, useAdminMeta } from "../meta-gate.js";
+import { PageTabsProvider } from "./page-tabs.js";
 import { slotted } from "../../locale/slotted.js";
 import { text } from "./messages.js";
 import { RenderNode } from "./render-node.js";
 import { jsx } from "react/jsx-runtime";
+import { appPath } from "@protobase/schema";
 //#region src/app/pages/composed-page.tsx
-/** `/<page>`: the page's tree as `/meta` gave it to this user. */
-const ComposedPage = ({ name }) => {
+/** `/<page>`, and `/<page>/<tab>` for one of its tabs: the page's tree as `/meta` gave it to this user. */
+const ComposedPage = ({ name, tab }) => {
 	const page = useAdminMeta().pages[name];
 	if (!page) return /* @__PURE__ */ jsx(Notice, {
 		title: text("notFound"),
 		children: slotted(text("noPage"), name)
 	});
-	return /* @__PURE__ */ jsx(RenderNode, { node: page.tree });
+	const pathOf = (shown) => appPath({
+		kind: "page",
+		page: name,
+		...shown && { tab: shown }
+	});
+	return /* @__PURE__ */ jsx(PageTabsProvider, {
+		route: {
+			...tab && { tab },
+			pathOf
+		},
+		children: /* @__PURE__ */ jsx(RenderNode, { node: page.tree })
+	});
 };
 //#endregion
 export { ComposedPage };

package/dist/app/pages/custom-boundary.js

@@ -1,6 +1,6 @@
-import { slotted } from "../../locale/slotted.js";
 import { reportRenderError } from "../error-reporting.js";
 import { Problem } from "./problem.js";
+import { slotted } from "../../locale/slotted.js";
 import { text } from "./messages.js";
 import { Component } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/app/pages/field-value.js

@@ -1,6 +1,6 @@
-import { cn } from "../../lib/cn.js";
 import { keys } from "../../data/query-keys.js";
 import { useClient } from "../../data/api-provider.js";
+import { cn } from "../../lib/cn.js";
 import { useAdminMeta } from "../meta-gate.js";
 import { fileShown, shownImage } from "../../live/file-values.js";
 import { isMarkdown } from "../../markdown/markdown-hint.js";

package/dist/app/pages/messages.js

@@ -4,6 +4,8 @@ const text = defineMessages({
 	en: {
 		notFound: "Not found",
 		noPage: "There is no page called {}.",
+		tabs: "Tabs",
+		noTab: (name) => `This page has no tab called ${name}.`,
 		cancel: "Cancel",
 		couldNotDraw: "{} could not be drawn.",
 		noComponent: "No component is registered as {}. Export it from protobase.ui.tsx, or load the plugin that provides it.",
@@ -29,6 +31,7 @@ const text = defineMessages({
 		create: "Create",
 		save: "Save",
 		notSaved: "Not saved",
+		settings: "Settings",
 		couldNotCount: "Could not count",
 		required: "Required",
 		wholeNumber: "A whole number",
@@ -39,6 +42,8 @@ const text = defineMessages({
 	nl: {
 		notFound: "Niet gevonden",
 		noPage: "Er is geen pagina met de naam {}.",
+		tabs: "Tabbladen",
+		noTab: (name) => `Deze pagina heeft geen tabblad met de naam ${name}.`,
 		cancel: "Annuleren",
 		couldNotDraw: "{} kon niet worden getekend.",
 		noComponent: "Er is geen component geregistreerd als {}. Exporteer die uit protobase.ui.tsx, of laad de plug-in die haar levert.",
@@ -64,6 +69,7 @@ const text = defineMessages({
 		create: "Maken",
 		save: "Bewaren",
 		notSaved: "Niet bewaard",
+		settings: "Instellingen",
 		couldNotCount: "Kon niet tellen",
 		required: "Verplicht",
 		wholeNumber: "Een geheel getal",

package/dist/app/pages/page-tabs.js

@@ -0,0 +1,27 @@
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/app/pages/page-tabs.tsx
+const PageTabsContext = createContext(null);
+const PageTabsProvider = ({ route, children }) => /* @__PURE__ */ jsx(PageTabsContext.Provider, {
+	value: route,
+	children
+});
+const usePageTabsRoute = () => {
+	const route = useContext(PageTabsContext);
+	if (!route) throw new Error("Tabs render inside a page that gives them their addresses: a composed page");
+	return route;
+};
+/** The tabs of a `Tabs` element, as the server sent them to this user. */
+const tabsOf = (tabs) => tabs.children.filter((child) => typeof child !== "string").map((node) => ({
+	node,
+	...node.props
+}));
+/** The tabs of a page's tree: those of its `Tabs`, which sits directly in its `Page`; none without one. */
+const pageTabs = (tree) => {
+	const tabs = tree.children.find((child) => typeof child !== "string" && !child.custom && child.type === "Tabs");
+	return tabs ? tabsOf(tabs) : [];
+};
+/** The tab shown: the one `named`, else the first when none is named; none for a name the page has no tab for. */
+const shownPageTab = (tabs, named) => named === void 0 ? tabs[0] : tabs.find((tab) => tab.name === named);
+//#endregion
+export { PageTabsProvider, pageTabs, shownPageTab, tabsOf, usePageTabsRoute };

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

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

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

@@ -1,8 +1,8 @@
-import { slotted } from "../../locale/slotted.js";
+import { useProjectUi } from "./project-ui.js";
 import { Problem } from "./problem.js";
+import { slotted } from "../../locale/slotted.js";
 import { text } from "./messages.js";
 import { CustomBoundary } from "./custom-boundary.js";
-import { useProjectUi } from "./project-ui.js";
 import { ActionBlock } from "./blocks/action.js";
 import { CardBlock } from "./blocks/card.js";
 import { CardRowBlock } from "./blocks/card-row.js";
@@ -16,10 +16,19 @@ import { ProgressBlock } from "./blocks/progress.js";
 import { RecordCardBlock } from "./blocks/record-card.js";
 import { RecordCardsBlock } from "./blocks/record-cards.js";
 import { RecordRowBlock } from "./blocks/record-row.js";
+import { SettingsBlock } from "./blocks/settings.js";
 import { ShowBlock } from "./blocks/show.js";
 import { StatBlock } from "./blocks/stat.js";
 import { TableBlock } from "./blocks/table.js";
+import { TabBlock, TabsBlock } from "./blocks/tabs.js";
 import { UsersBlock } from "../../users/users-block.js";
+import { ConnectedAccountsBlock } from "../../account/blocks/connected-accounts-block.js";
+import { ConnectedAppsBlock } from "../../account/blocks/connected-apps-block.js";
+import { DevicesBlock } from "../../account/blocks/devices-block.js";
+import { PasskeysBlock } from "../../account/blocks/passkeys-block.js";
+import { PasswordBlock } from "../../account/blocks/password-block.js";
+import { ProfileBlock } from "../../account/blocks/profile-block.js";
+import { TwoFactorBlock } from "../../account/blocks/two-factor-block.js";
 import { Fragment } from "react";
 import { unmarkFieldRefs } from "@protobase/schema/internal";
 import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
@@ -42,7 +51,17 @@ const blocks = {
 	Action: ActionBlock,
 	Show: ShowBlock,
 	Link: LinkBlock,
-	Users: UsersBlock
+	Settings: SettingsBlock,
+	Tabs: TabsBlock,
+	Tab: TabBlock,
+	Users: UsersBlock,
+	Profile: ProfileBlock,
+	Password: PasswordBlock,
+	Passkeys: PasskeysBlock,
+	TwoFactor: TwoFactorBlock,
+	ConnectedAccounts: ConnectedAccountsBlock,
+	Devices: DevicesBlock,
+	ConnectedApps: ConnectedAppsBlock
 };
 const isInline = (child) => typeof child === "string" || !child.custom && child.type === "Link";
 /** Text and links run together as one paragraph, like a sentence with a link in it; other elements stand alone. */

package/dist/app/pages/use-run-action.js

@@ -1,9 +1,9 @@
 import { useClient, useResourceClient } from "../../data/api-provider.js";
 import { useAdminMeta, usePermissions } from "../meta-gate.js";
-import { text } from "./messages.js";
 import { useToast } from "../../toasts/toast-provider.js";
 import { useAppAddress } from "../use-app-address.js";
 import { useProjectUi } from "./project-ui.js";
+import { text } from "./messages.js";
 import { can } from "../permissions.js";
 import { actionApplies } from "./action-when.js";
 import { actionFor, linkTarget, openLink } from "./action-href.js";

package/dist/app/project-logo.js

@@ -1,6 +1,6 @@
-import { Logo } from "../app-shell/logo.js";
-import { CustomBoundary } from "./pages/custom-boundary.js";
 import { useProjectUi } from "./pages/project-ui.js";
+import { CustomBoundary } from "./pages/custom-boundary.js";
+import { Logo } from "../app-shell/logo.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/app/project-logo.tsx
 /** The project's `shell.logo` at the top of the sidebar, or Protobase's while it has none or when it throws. */

package/dist/app/record-chart/record-chart-section.js

@@ -1,9 +1,9 @@
-import { Skeleton } from "../../primitives/skeleton.js";
-import { Segmented } from "../../primitives/segmented.js";
-import { viewerZone } from "../../format/zone.js";
 import { useAdminMeta } from "../meta-gate.js";
-import { humanize } from "../../live/naming.js";
+import { viewerZone } from "../../format/zone.js";
+import { Skeleton } from "../../primitives/skeleton.js";
 import { Section } from "../../record-view/section.js";
+import { humanize } from "../../live/naming.js";
+import { Segmented } from "../../primitives/segmented.js";
 import { useAggregates } from "../../data/use-aggregates.js";
 import { PeriodChart } from "../charts/period-chart.js";
 import { chartPoints, rangeBuckets } from "./chart-points.js";

package/dist/app/record-page.js

@@ -1,21 +1,17 @@
-import { cn } from "../lib/cn.js";
-import { Skeleton } from "../primitives/skeleton.js";
-import { inApp } from "../app-shell/breadcrumb.js";
 import { useAuth } from "../auth/auth-provider.js";
-import { Button, buttonClass } from "../primitives/button.js";
-import { namedIcon } from "./named-icon.js";
-import { text } from "./messages.js";
-import { useNavigationGuard } from "./router.js";
 import { usePauseFocusRefresh } from "../data/focus-refresh.js";
 import { keys } from "../data/query-keys.js";
 import { useClient } from "../data/api-provider.js";
+import { cn } from "../lib/cn.js";
 import { Notice, useAdminMeta, usePermissions } from "./meta-gate.js";
-import { useOpenedRecord } from "../data/use-record.js";
-import { humanize } from "../live/naming.js";
+import { Button, buttonClass } from "../primitives/button.js";
+import { Skeleton } from "../primitives/skeleton.js";
+import { inApp } from "../app-shell/breadcrumb.js";
 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 { humanize } from "../live/naming.js";
 import { markdownExcerpt } from "../markdown/markdown-excerpt.js";
 import { isMarkdown } from "../markdown/markdown-hint.js";
 import { recordTitle } from "../live/model-helpers.js";
@@ -23,6 +19,8 @@ import { contactFormat } from "../live/contact-links.js";
 import { toneFor } from "../live/columns-from-model.js";
 import { displayValue, valueTitle } from "../live/display-value.js";
 import { filledFields } from "./filled-fields.js";
+import { text } from "./messages.js";
+import { useNavigationGuard } from "./router.js";
 import { AppLink, useAppAddress } from "./use-app-address.js";
 import { GroupSection } from "../record-view/group-section.js";
 import { RecordTabs } from "../record-view/record-tabs.js";
@@ -37,11 +35,13 @@ import { shownWidget } from "./field-types/shown-widget.js";
 import { WidgetPart } from "./field-types/widget-part.js";
 import { ContactLink } from "../live/contact-link.js";
 import { FieldEditor } from "./field-editor.js";
-import { fieldMessage } from "./field-errors.js";
-import { useFocusFirstInvalid } from "./use-focus-first-invalid.js";
 import { can, fieldAccess } from "./permissions.js";
 import { ValueBadge } from "./value-badge.js";
 import { FieldValue } from "./pages/field-value.js";
+import { fieldMessage } from "./field-errors.js";
+import { useFocusFirstInvalid } from "./use-focus-first-invalid.js";
+import { namedIcon } from "./named-icon.js";
+import { useOpenedRecord } from "../data/use-record.js";
 import { text as text$1 } from "./record-messages.js";
 import { useDeleteFlow } from "./delete/use-delete-flow.js";
 import { useRestore } from "./delete/use-restore.js";
@@ -69,8 +69,8 @@ import { Fragment, useEffect, useMemo } from "react";
 import { Check } from "lucide-react";
 import { isApiError } from "@protobase/client";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { enumLabel } from "@protobase/schema";
 import { useQueryClient } from "@tanstack/react-query";
+import { enumLabel } from "@protobase/schema";
 //#region src/app/record-page.tsx
 const hidden = (model, name) => name === model.tenant || model.primaryKey.includes(name);
 /**

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

@@ -1,7 +1,7 @@
 import { formatTag } from "../../locale/active-locale.js";
+import { useAdminMeta } from "../meta-gate.js";
 import { useIsXs } from "../../lib/use-media-query.js";
 import { Skeleton } from "../../primitives/skeleton.js";
-import { useAdminMeta } from "../meta-gate.js";
 import { humanize } from "../../live/naming.js";
 import { displaysOf, loadedFields } from "../displays/list-displays.js";
 import { defaultOrderBy } from "../list-order.js";

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

@@ -1,5 +1,5 @@
-import { Skeleton } from "../../primitives/skeleton.js";
 import { useAdminMeta } from "../meta-gate.js";
+import { Skeleton } from "../../primitives/skeleton.js";
 import { humanize } from "../../live/naming.js";
 import { listedResource } from "../current-address.js";
 import { ErrorBanner } from "../error-banner.js";

package/dist/app/related-cards/related-card.js

@@ -1,5 +1,5 @@
-import { Skeleton } from "../../primitives/skeleton.js";
 import { useAdminMeta } from "../meta-gate.js";
+import { Skeleton } from "../../primitives/skeleton.js";
 import { recordKey, recordTitle } from "../../live/model-helpers.js";
 import { AppLink } from "../use-app-address.js";
 import { RecordScope } from "../pages/record-scope.js";

package/dist/app/related-dots/related-dots-columns.js

@@ -1,5 +1,5 @@
-import { humanize } from "../../live/naming.js";
 import { headerWidth } from "../../data-grid/content-widths.js";
+import { humanize } from "../../live/naming.js";
 import { listColumnNames } from "../../live/columns-from-model.js";
 import { RelatedDots } from "./related-dots.js";
 import { RecordCard } from "../displays/record-card.js";