canopycms 0.2.0-int.121 → 0.3.0

package/dist/editor/components/EntrySaveButton.js

@@ -0,0 +1,101 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useId, useState } from 'react';
+import { Box, Button, Loader, Tooltip, VisuallyHidden } from '@mantine/core';
+import { useReducedMotion } from '@mantine/hooks';
+import { IconCheck, IconLoader2 } from '@tabler/icons-react';
+import { EDITOR_ACTIONS } from '../copy.js';
+const KEPT_HINT = 'Unsaved changes are kept on this device until you save.';
+const SAVE_ALL_WAIT = 'Wait for Save all to finish.';
+const SAVED_SHOWN_MS = 2000;
+// Below `sm` the status words are visually hidden, so Save keeps its own width beside an icon.
+const LABEL_TEXT_CLASS = 'canopy-save-label-text';
+const LABEL_STYLES = `
+@media (max-width: 47.99em) {
+  .${LABEL_TEXT_CLASS} {
+    position: absolute; width: 1px; height: 1px; overflow: hidden;
+    clip: rect(0 0 0 0); white-space: nowrap;
+  }
+}
+`;
+/**
+ * Every label in one grid cell, only `shown` visible, so the button keeps the widest one's width
+ * and the header never shifts.
+ */
+function SaveLabels({ shown, spinner }) {
+    const labels = {
+        save: EDITOR_ACTIONS.save,
+        saving: (_jsxs(_Fragment, { children: [_jsx(Box, { component: "span", display: "inline-flex", w: 14, children: shown === 'saving' &&
+                        (spinner ? (_jsx(Loader, { size: 14, color: "currentColor" })) : (_jsx(IconLoader2, { size: 14, "aria-hidden": "true" }))) }), _jsx("span", { className: LABEL_TEXT_CLASS, children: "Saving\u2026" })] })),
+        saved: (_jsxs(_Fragment, { children: [_jsx(IconCheck, { size: 14, "aria-hidden": "true" }), _jsx("span", { className: LABEL_TEXT_CLASS, children: "Saved" })] })),
+    };
+    return (_jsx(Box, { component: "span", pos: "relative", style: { display: 'inline-grid' }, children: Object.keys(labels).map((key) => (_jsx(Box, { component: "span", "aria-hidden": key === shown ? undefined : true, style: {
+                gridArea: '1 / 1',
+                display: 'inline-flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                gap: 6,
+                visibility: key === shown ? 'visible' : 'hidden',
+            }, children: labels[key] }, key))) }));
+}
+/**
+ * The open entry's Save, reading "Saving…" then "Saved" as a save lands. While the entry has
+ * unsaved changes, its Tooltip and description say they are kept on this device.
+ */
+export function EntrySaveButton({ onSave, saveBlockedReason, busy, saveAllRunning, saving = false, savedSignal, savedHere = false, entryDirty, draftStorageFailed, }) {
+    const keptHintId = useId();
+    const reducedMotion = useReducedMotion();
+    // Each landed Save shows "Saved" once, as it lands and only on its own entry: one that landed
+    // before mount or while another entry was open shows nothing later.
+    const [seenSignal, setSeenSignal] = useState(savedSignal ?? 0);
+    const [flashing, setFlashing] = useState();
+    // Leaving the saved entry ends its "Saved", so a quick return doesn't show or announce it again.
+    const [wasHere, setWasHere] = useState(savedHere);
+    if (wasHere !== savedHere) {
+        setWasHere(savedHere);
+        if (!savedHere)
+            setFlashing(undefined);
+    }
+    // Save all ends any "Saved", so a run that finishes within its window doesn't bring it back.
+    const [wasRunning, setWasRunning] = useState(saveAllRunning);
+    if (wasRunning !== saveAllRunning) {
+        setWasRunning(saveAllRunning);
+        if (saveAllRunning)
+            setFlashing(undefined);
+    }
+    if (savedSignal !== undefined && savedSignal > seenSignal) {
+        setSeenSignal(savedSignal);
+        setFlashing(savedHere && !saveAllRunning ? savedSignal : undefined);
+    }
+    useEffect(() => {
+        if (flashing === undefined)
+            return;
+        const timer = setTimeout(() => setFlashing(undefined), SAVED_SHOWN_MS);
+        return () => clearTimeout(timer);
+    }, [flashing]);
+    // Blocked, Save stays focusable (`aria-disabled`, not `disabled`), so its reason opens on focus.
+    const saveBlocked = !!saveBlockedReason || busy || saveAllRunning;
+    const label = saving
+        ? 'saving'
+        : flashing !== undefined &&
+            flashing === savedSignal &&
+            savedHere &&
+            !entryDirty &&
+            !saveAllRunning
+            ? 'saved'
+            : 'save';
+    // A "Saving…" or "Saved" label stays readable: disabled styling takes it under 4.5:1.
+    const saveGreyed = saveBlocked && label === 'save';
+    const blockedReason = saveAllRunning ? SAVE_ALL_WAIT : saveBlockedReason;
+    // Why Save is blocked, else where unsaved changes are held; a blocked Save's reason leads.
+    const keptHint = entryDirty && !draftStorageFailed && !blockedReason ? KEPT_HINT : '';
+    const saveTooltip = blockedReason || keptHint;
+    return (_jsxs(_Fragment, { children: [_jsx(VisuallyHidden, { role: "status", children: label === 'saved' ? 'Saved' : '' }), keptHint && (_jsx("span", { hidden: true, id: keptHintId, children: keptHint })), _jsx("style", { children: LABEL_STYLES }), _jsx(Tooltip, { label: saveTooltip, 
+                // Not beside "Saving…" or "Saved", nor while busy, except Save all's wait: its reloads flip `busy`.
+                disabled: !saveTooltip || label !== 'save' || (busy && !saveAllRunning), multiline: true, maw: 280, 
+                // Down, away from the top bar, whose Save all a reason opening upward would cover.
+                position: "bottom-end", children: _jsx(Button, { "data-testid": "save-button", variant: "filled", size: "sm", style: { flexShrink: 0 }, onClick: () => {
+                        if (!saveBlocked)
+                            onSave();
+                    }, "data-disabled": saveGreyed ? true : undefined, "aria-disabled": saveBlocked ? true : undefined, ...(keptHint ? { 'aria-describedby': keptHintId } : {}), children: _jsx(SaveLabels, { shown: label, spinner: !reducedMotion }) }) })] }));
+}

package/dist/editor/components/NoEditPermissionNotice.d.ts

@@ -5,7 +5,7 @@ export interface NoEditPermissionNoticeProps {
 /**
  * Explains why an entry cannot be edited and whom to ask. An entry's `canEdit` is false only
  * when a path rule (or `defaultPathAccess`) denies edit, so that is the reason it gives. A locked
- * or protected branch instead shows its banner in the header over a read-only form, the rule
+ * or protected branch instead says so in the branch bar's status over a read-only form, the rule
  * `contentReadOnly` in `Editor.tsx` holds.
  */
 export declare function NoEditPermissionNotice({ entryLabel }: NoEditPermissionNoticeProps): import("react/jsx-runtime").JSX.Element;

package/dist/editor/components/NoEditPermissionNotice.js

@@ -3,7 +3,7 @@ import { Text } from '@mantine/core';
 /**
  * Explains why an entry cannot be edited and whom to ask. An entry's `canEdit` is false only
  * when a path rule (or `defaultPathAccess`) denies edit, so that is the reason it gives. A locked
- * or protected branch instead shows its banner in the header over a read-only form, the rule
+ * or protected branch instead says so in the branch bar's status over a read-only form, the rule
  * `contentReadOnly` in `Editor.tsx` holds.
  */
 export function NoEditPermissionNotice({ entryLabel }) {

package/dist/editor/components/RetryToastMessage.d.ts

@@ -4,6 +4,8 @@ export interface RetryToastMessageProps {
     onRetry: () => void;
     /** The button's label, when the way forward is not a plain retry. */
     actionLabel?: string;
+    /** A developer diagnostic, shown only once "Details" is opened. */
+    details?: string;
 }
 /** The body of an error toast whose failure the user can try again from the toast. */
-export declare function RetryToastMessage({ message, onRetry, actionLabel, }: RetryToastMessageProps): import("react/jsx-runtime").JSX.Element;
+export declare function RetryToastMessage({ message, onRetry, actionLabel, details, }: RetryToastMessageProps): import("react/jsx-runtime").JSX.Element;

package/dist/editor/components/RetryToastMessage.js

@@ -1,6 +1,10 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Group, Text } from '@mantine/core';
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useId, useState } from 'react';
+import { Anchor, Button, Code, Group, Stack, Text } from '@mantine/core';
 /** The body of an error toast whose failure the user can try again from the toast. */
-export function RetryToastMessage({ message, onRetry, actionLabel = 'Retry', }) {
-    return (_jsxs(Group, { justify: "space-between", align: "center", gap: "sm", wrap: "nowrap", children: [_jsx(Text, { size: "sm", miw: 0, children: message }), _jsx(Button, { size: "compact-sm", variant: "subtle", onClick: onRetry, children: actionLabel })] }));
+export function RetryToastMessage({ message, onRetry, actionLabel = 'Retry', details, }) {
+    const [detailsOpen, setDetailsOpen] = useState(false);
+    const detailsId = useId();
+    return (_jsxs(Stack, { gap: 4, children: [_jsxs(Group, { justify: "space-between", align: "center", gap: "sm", wrap: "nowrap", children: [_jsx(Text, { size: "sm", miw: 0, children: message }), _jsx(Button, { size: "compact-sm", variant: "subtle", onClick: onRetry, children: actionLabel })] }), details && (_jsxs(_Fragment, { children: [_jsx(Anchor, { component: "button", type: "button", size: "xs", style: { alignSelf: 'flex-start' }, "aria-expanded": detailsOpen, "aria-controls": detailsOpen ? detailsId : undefined, onClick: () => setDetailsOpen((open) => !open), children: "Details" }), detailsOpen && (_jsx(Code, { id: detailsId, block: true, style: { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }, children: details }))] }))] }));
 }

package/dist/editor/components/SaveAllButton.d.ts

@@ -0,0 +1,25 @@
+import React, { type ReactNode, type Ref } from 'react';
+import type { SaveAllProgress } from '../hooks/save-all.js';
+export interface SaveAllButtonProps {
+    onSaveAll: () => void;
+    /** Entries on the branch with unsaved changes; the branch bar shows the count. */
+    unsavedCount: number;
+    /** Why Save all can't act now, other than its own run, a save in flight or nothing unsaved. */
+    blockedReason?: string;
+    /** Set while Save all runs. */
+    saveAllProgress: SaveAllProgress | null;
+    /** A single Save is in flight, on any entry; Save all can't start beside it. */
+    singleSaving: boolean;
+    /** The editor is loading or saving. */
+    busy: boolean;
+    /** A caret menu joined to the button, making it a split button. */
+    caret?: ReactNode;
+    buttonRef?: Ref<HTMLButtonElement>;
+}
+/** Saves every unsaved entry on the branch; the result is a toast (`SaveAllResult`). */
+export declare function SaveAllButton({ onSaveAll, unsavedCount, blockedReason, saveAllProgress, singleSaving, busy, caret, buttonRef, }: SaveAllButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare const HIDDEN_STYLE: React.CSSProperties;
+/** Unsaved changes live only in this tab. Icon-only below `lg`, its text then its Tooltip. */
+export declare function DraftStorageWarning({ shown }: {
+    shown: boolean;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/editor/components/SaveAllButton.js

@@ -0,0 +1,81 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Box, Button, Loader, Text, Tooltip, VisuallyHidden } from '@mantine/core';
+import { useReducedMotion } from '@mantine/hooks';
+import { IconAlertTriangle, IconLoader2 } from '@tabler/icons-react';
+import { EDITOR_ACTIONS } from '../copy.js';
+/**
+ * Every label in one grid cell, only `shown` visible, so the button keeps the widest one's width
+ * and the top bar doesn't shift as the count or progress changes.
+ */
+function SaveAllLabels({ shown, labels }) {
+    return (_jsx(Box, { component: "span", style: { display: 'inline-grid', fontVariantNumeric: 'tabular-nums' }, children: labels.map((label, index) => (_jsx(Box, { component: "span", "aria-hidden": index === shown ? undefined : true, style: {
+                gridArea: '1 / 1',
+                display: 'inline-flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                gap: 6,
+                visibility: index === shown ? 'visible' : 'hidden',
+            }, children: label }, index))) }));
+}
+/** Saves every unsaved entry on the branch; the result is a toast (`SaveAllResult`). */
+export function SaveAllButton({ onSaveAll, unsavedCount, blockedReason, saveAllProgress, singleSaving, busy, caret, buttonRef, }) {
+    const reducedMotion = useReducedMotion();
+    // A running Save all shows only its progress: a lock arriving mid-run would grey it.
+    const reason = saveAllProgress
+        ? undefined
+        : (blockedReason ??
+            (singleSaving
+                ? 'Wait for the save to finish.'
+                : unsavedCount === 0
+                    ? 'No entry on this branch has unsaved changes.'
+                    : busy
+                        ? 'Wait for the current save or load to finish.'
+                        : undefined));
+    // Blocked, it stays focusable (`aria-disabled`, not `disabled`), so its reason opens on focus.
+    const blocked = !!reason || !!saveAllProgress;
+    // The branch's largest count yet sizes the progress, so the width grows only as a digit is added.
+    const count = Math.max(unsavedCount, saveAllProgress?.total ?? 0, 1);
+    const [widest, setWidest] = useState(count);
+    if (count > widest)
+        setWidest(count);
+    const progress = (done, total) => (_jsxs(_Fragment, { children: [_jsx(Box, { component: "span", display: "inline-flex", w: 14, children: saveAllProgress &&
+                    (reducedMotion ? (_jsx(IconLoader2, { size: 14, "aria-hidden": "true" })) : (_jsx(Loader, { size: 14, color: "currentColor" }))) }), `${Math.min(done + 1, total)} of ${total}…`] }));
+    // Progress reads "2 of 3…" beside the spinner.
+    const labels = [
+        EDITOR_ACTIONS.saveAll,
+        saveAllProgress ? progress(saveAllProgress.done, saveAllProgress.total) : progress(0, 1),
+        progress(widest, widest),
+    ];
+    return (_jsxs(_Fragment, { children: [_jsx(VisuallyHidden, { role: "status", children: saveAllProgress
+                    ? `Saving ${saveAllProgress.total} ${saveAllProgress.total === 1 ? 'entry' : 'entries'}…`
+                    : '' }), _jsxs(Button.Group, { style: { flexShrink: 0 }, renderRoot: (props) => (_jsx("div", { ...props, role: caret ? 'group' : undefined, "aria-label": caret ? 'Save all and branch actions' : undefined })), children: [_jsx(Tooltip, { label: reason, disabled: !reason, multiline: true, maw: 300, 
+                        // Beside its button, in the bar's free middle, so it covers neither the entry's Save
+                        // below nor a stacked row of the bar; below when the left edge has no room for it.
+                        position: "left", middlewares: { flip: { fallbackPlacements: ['bottom-end'] }, shift: true }, children: _jsx(Button, { ref: buttonRef, "data-testid": "save-all-button", 
+                            // The open entry's Save is the editor's one filled primary.
+                            variant: "light", size: "sm", style: { flexShrink: 0 }, onClick: () => {
+                                if (!blocked)
+                                    onSaveAll();
+                            }, "data-disabled": reason ? true : undefined, "aria-disabled": blocked ? true : undefined, "aria-label": saveAllProgress
+                                ? `Saving ${Math.min(saveAllProgress.done + 1, saveAllProgress.total)} of ${saveAllProgress.total}…`
+                                : undefined, children: _jsx(SaveAllLabels, { shown: saveAllProgress ? 1 : 0, labels: labels }) }) }), caret] })] }));
+}
+const STORAGE_FAILED_TEXT = 'Unsaved · not kept on this device';
+const STORAGE_FAILED_HINT = "Save before you leave or reload, or they'll be lost.";
+// Visually hidden, as Mantine's VisuallyHidden, for a region that must stay mounted.
+export const HIDDEN_STYLE = {
+    position: 'absolute',
+    width: 1,
+    height: 1,
+    overflow: 'hidden',
+    clip: 'rect(0 0 0 0)',
+    whiteSpace: 'nowrap',
+};
+/** Unsaved changes live only in this tab. Icon-only below `lg`, its text then its Tooltip. */
+export function DraftStorageWarning({ shown }) {
+    return (
+    // Always mounted so the warning is announced; visible, at a fixed width, only when shown.
+    _jsx(Box, { role: "status", ta: "right", w: { base: 20, lg: 112 }, style: shown ? { flexShrink: 0 } : HIDDEN_STYLE, children: shown && (_jsx(Tooltip, { label: `${STORAGE_FAILED_TEXT}. ${STORAGE_FAILED_HINT}`, multiline: true, w: 260, children: _jsxs(Text, { size: "xs", lh: 1.2, c: "var(--canopy-danger-text)", "data-testid": "unsaved-indicator", children: [_jsx(Box, { component: "span", visibleFrom: "lg", children: STORAGE_FAILED_TEXT }), _jsx(Box, { component: "span", hiddenFrom: "lg", display: "inline-flex", "aria-hidden": "true", children: _jsx(IconAlertTriangle, { size: 18 }) }), _jsx(VisuallyHidden, { component: "span", hiddenFrom: "lg", children: STORAGE_FAILED_TEXT }), _jsxs(VisuallyHidden, { component: "span", children: [". ", STORAGE_FAILED_HINT] })] }) })) }));
+}

package/dist/editor/components/UnsavedMark.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { type ElementProps } from '@mantine/core';
 /**
- * The editor's one "unsaved" mark, a dot, in the breadcrumb, the branch pill and the content tree.
+ * The editor's one "unsaved" mark, a dot.
  * `--canopy-unsaved-mark` is the brand colour at 3:1 on the shell's surfaces in either scheme.
  * The caller says whether it is named (`role="img"` and a label) or decoration (`aria-hidden`).
  * It forwards its ref, so a Tooltip can wrap it.

package/dist/editor/components/UnsavedMark.js

@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { Box } from '@mantine/core';
 /**
- * The editor's one "unsaved" mark, a dot, in the breadcrumb, the branch pill and the content tree.
+ * The editor's one "unsaved" mark, a dot.
  * `--canopy-unsaved-mark` is the brand colour at 3:1 on the shell's surfaces in either scheme.
  * The caller says whether it is named (`role="img"` and a label) or decoration (`aria-hidden`).
  * It forwards its ref, so a Tooltip can wrap it.

package/dist/editor/components/index.d.ts

@@ -1,3 +1,3 @@
-export * from './BranchLockBanner.js';
 export * from './EditorHeader.js';
 export * from './EditorRail.js';
+export * from './EntryHeader.js';

package/dist/editor/components/index.js

@@ -1,3 +1,3 @@
-export * from './BranchLockBanner.js';
 export * from './EditorHeader.js';
 export * from './EditorRail.js';
+export * from './EntryHeader.js';

package/dist/editor/copy.d.ts

@@ -16,7 +16,6 @@ export declare const EDITOR_ACTIONS: {
     readonly restore: "Restore";
     readonly clear: "Clear";
     readonly undoClear: "Undo clear";
-    readonly openEntry: "Open entry";
     readonly changeUrl: "Change URL";
     readonly changeSlug: "Change slug";
 };

package/dist/editor/copy.js

@@ -16,7 +16,6 @@ export const EDITOR_ACTIONS = {
     restore: 'Restore',
     clear: 'Clear',
     undoClear: 'Undo clear',
-    openEntry: 'Open entry',
     changeUrl: 'Change URL',
     changeSlug: 'Change slug',
 };

package/dist/editor/editor-utils.d.ts

@@ -76,8 +76,8 @@ export declare const buildCollectionLabels: (collections?: EditorCollection[]) =
  */
 export declare const entryTypeLabel: (collections: EditorCollection[] | undefined, entry: Pick<EditorEntry, "collectionPath" | "entryType">) => string | undefined;
 /**
- * The type shown under an entry's label, in the content tree and quick open: `entryTypeLabel`,
- * except for a singleton, whose label already is its type's (`singletonLabel`).
+ * The type shown under an entry's label in the content tree: `entryTypeLabel`, except for a
+ * singleton, whose label already is its type's (`singletonLabel`). @internal Exported for tests.
  */
 export declare const entryTypeLine: (collections: EditorCollection[] | undefined, entry: Pick<EditorEntry, "collectionPath" | "entryType">) => string | undefined;
 /**

package/dist/editor/editor-utils.js

@@ -222,8 +222,8 @@ export const entryTypeLabel = (collections, entry) => {
     return findEntryType(collections, entry)?.label ?? humanizeName(entry.entryType);
 };
 /**
- * The type shown under an entry's label, in the content tree and quick open: `entryTypeLabel`,
- * except for a singleton, whose label already is its type's (`singletonLabel`).
+ * The type shown under an entry's label in the content tree: `entryTypeLabel`, except for a
+ * singleton, whose label already is its type's (`singletonLabel`). @internal Exported for tests.
  */
 export const entryTypeLine = (collections, entry) => {
     const type = findEntryType(collections, entry);

package/dist/editor/entry-search.d.ts

@@ -1,22 +1,16 @@
-/** Entry search shared by the navigator filter and the quick-open palette. */
-export interface SearchableEntry {
+/** Entry search and the detail line shared by the content tree's rows. */
+/** Case-insensitive substring match over label, title and slug; an empty query matches everything. */
+export declare function matchesEntryQuery(entry: {
     label: string;
     /** The entry's title, when its label is something else (a singleton's type label). */
     title?: string;
     slug?: string;
-    collectionPath?: string;
-    collectionName?: string;
-}
-/** Case-insensitive substring match over label, title and slug; an empty query matches everything. */
-export declare function matchesEntryQuery(entry: Pick<SearchableEntry, 'label' | 'title' | 'slug'>, query: string): boolean;
-export declare function filterEntries<T extends SearchableEntry>(entries: readonly T[], query: string): T[];
-export interface EntryGroup<T> {
-    heading: string;
-    entries: T[];
-}
+}, query: string): boolean;
 /**
- * Groups entries by collection, in first-seen order, each under its display heading:
- * `labelFor(collectionPath)`, else the collection name or path, else `Root`. Two collections
- * that share a heading stay separate groups.
+ * An entry's detail line, "type · route", with whichever of the two it has: a singleton's label
+ * already names its type, and an entry with no page has no route.
  */
-export declare function groupEntriesByCollection<T extends SearchableEntry>(entries: readonly T[], labelFor?: (collectionPath: string) => string | undefined): EntryGroup<T>[];
+export declare const entryDetailLine: ({ typeLabel, route, }: {
+    typeLabel?: string;
+    route?: string;
+}) => string;

package/dist/editor/entry-search.js

@@ -1,4 +1,4 @@
-/** Entry search shared by the navigator filter and the quick-open palette. */
+/** Entry search and the detail line shared by the content tree's rows. */
 /** Case-insensitive substring match over label, title and slug; an empty query matches everything. */
 export function matchesEntryQuery(entry, query) {
     const needle = query.trim().toLowerCase();
@@ -6,28 +6,8 @@ export function matchesEntryQuery(entry, query) {
         return true;
     return [entry.label, entry.title, entry.slug].some((text) => text?.toLowerCase().includes(needle));
 }
-export function filterEntries(entries, query) {
-    return entries.filter((entry) => matchesEntryQuery(entry, query));
-}
 /**
- * Groups entries by collection, in first-seen order, each under its display heading:
- * `labelFor(collectionPath)`, else the collection name or path, else `Root`. Two collections
- * that share a heading stay separate groups.
+ * An entry's detail line, "type · route", with whichever of the two it has: a singleton's label
+ * already names its type, and an entry with no page has no route.
  */
-export function groupEntriesByCollection(entries, labelFor) {
-    const groups = new Map();
-    for (const entry of entries) {
-        const key = entry.collectionPath ?? entry.collectionName ?? '';
-        const group = groups.get(key);
-        if (group) {
-            group.entries.push(entry);
-            continue;
-        }
-        const heading = (entry.collectionPath ? labelFor?.(entry.collectionPath) : undefined) ??
-            entry.collectionName ??
-            entry.collectionPath ??
-            'Root';
-        groups.set(key, { heading, entries: [entry] });
-    }
-    return [...groups.values()];
-}
+export const entryDetailLine = ({ typeLabel, route, }) => [typeLabel, route].filter(Boolean).join(' · ');

package/dist/editor/hooks/editor-history.d.ts

@@ -0,0 +1,7 @@
+/** Shows `url`, pushed, or replaced keeping the entry's other state; never rewrites the URL shown. */
+export declare function writeEditorUrl(url: string, push: boolean): void;
+/** Stamps the history entry the editor opened on, keeping Next.js's keys: the URL is unchanged. */
+export declare function markEditorHistoryStart(): void;
+/** On `popstate`: entries moved, undefined if an end is not this run's, null for an undo's. */
+export declare function recordHistoryMove(): number | undefined | null;
+export declare function undoHistoryMove(moved: number): void;

package/dist/editor/hooks/editor-history.js

@@ -0,0 +1,80 @@
+/** Session-history writes stamped with their position, so a refused Back can be undone. */
+const STAMP_KEY = 'canopyHistory';
+// Next.js's router keys: its patched history methods copy `__NA` and the tree back and record the
+// URL, but do neither for state already holding `__NA` or `_N` (app-router.js, next 15.5).
+const ROUTER_KEYS = ['__NA', '__PRIVATE_NEXTJS_INTERNALS_TREE', '_N'];
+// A run restarts wherever the position is lost, so positions from two runs are never compared.
+let run = '';
+let position;
+let undoTarget;
+const newRun = () => {
+    run = Math.random().toString(36).slice(2);
+    position = undefined;
+};
+const currentState = () => {
+    const state = window.history.state;
+    return state !== null && typeof state === 'object' ? { ...state } : {};
+};
+const stampIn = (state) => {
+    const value = state[STAMP_KEY];
+    if (value === null || typeof value !== 'object')
+        return undefined;
+    const [stampRun, at] = [Reflect.get(value, 'run'), Reflect.get(value, 'position')];
+    return typeof stampRun === 'string' && typeof at === 'number'
+        ? { run: stampRun, position: at }
+        : undefined;
+};
+const samePage = (a, b) => {
+    const [x, y] = [new URL(a, window.location.href), new URL(b, window.location.href)];
+    const query = (u) => new URLSearchParams(u.search).toString();
+    return (x.origin === y.origin && x.pathname === y.pathname && query(x) === query(y) && x.hash === y.hash);
+};
+/** Shows `url`, pushed, or replaced keeping the entry's other state; never rewrites the URL shown. */
+export function writeEditorUrl(url, push) {
+    if (samePage(url, window.location.href))
+        return;
+    if (!run)
+        newRun();
+    const at = (position ?? 0) + (push ? 1 : 0);
+    const kept = push ? {} : currentState();
+    for (const key of ROUTER_KEYS)
+        delete kept[key];
+    const method = push ? window.history.pushState : window.history.replaceState;
+    method.call(window.history, { ...kept, [STAMP_KEY]: { run, position: at } }, '', url);
+    position = at;
+}
+/** Stamps the history entry the editor opened on, keeping Next.js's keys: the URL is unchanged. */
+export function markEditorHistoryStart() {
+    const state = currentState();
+    const stamp = stampIn(state);
+    if (stamp) {
+        run = stamp.run;
+        position = stamp.position;
+        return;
+    }
+    newRun();
+    position = 0;
+    window.history.replaceState({ ...state, [STAMP_KEY]: { run, position } }, '', window.location.href);
+}
+/** On `popstate`: entries moved, undefined if an end is not this run's, null for an undo's. */
+export function recordHistoryMove() {
+    const arrived = stampIn(currentState());
+    const undone = undoTarget !== undefined &&
+        arrived?.run === undoTarget.run &&
+        arrived.position === undoTarget.position;
+    undoTarget = undefined;
+    const moved = arrived?.run === run && position !== undefined ? arrived.position - position : undefined;
+    if (arrived) {
+        run = arrived.run;
+        position = arrived.position;
+    }
+    else
+        newRun();
+    return undone ? null : moved;
+}
+export function undoHistoryMove(moved) {
+    if (position === undefined)
+        return;
+    undoTarget = { run, position: position - moved };
+    window.history.go(-moved);
+}

package/dist/editor/hooks/useBranchActions.js

@@ -5,6 +5,7 @@ import { notifications } from '@mantine/notifications';
 import { Text } from '@mantine/core';
 import { useApiClient } from '../context/index.js';
 import { requestBranchCreate } from './create-branch-request.js';
+import { writeEditorUrl } from './editor-history.js';
 const MAX_LISTED_LABELS = 5;
 /** 'Unsaved changes in: "A", "B".' */
 export const describeUnsaved = ({ labels }) => {
@@ -25,10 +26,11 @@ export function useBranchActions(options) {
     const [confirmOpen, setConfirmOpen] = useState(false);
     const performBranchSwitch = (next) => {
         options.setBranchName(next);
+        // Its own history entry; a Back onto another branch already shows this URL, so writes nothing.
         if (typeof window !== 'undefined') {
             const url = new URL(window.location.href);
             url.searchParams.set('branch', next);
-            window.history.replaceState({}, '', url.toString());
+            writeEditorUrl(url.toString(), true);
         }
         options.onBranchSwitch?.(next);
     };

package/dist/editor/hooks/useBranchManager.d.ts

@@ -55,7 +55,7 @@ interface BranchSummary {
     /**
      * Server-computed: content writes are rejected, because the branch is the
      * read-only base branch OR its status is past 'editing'. `readOnly` still
-     * says WHICH, for banner copy.
+     * says WHICH, for the status copy.
      */
     writeBlocked: boolean;
     /**
@@ -90,10 +90,14 @@ export interface UseBranchManagerReturn {
     currentBranch: BranchListItem | undefined;
     /** The listing failed and nothing earlier stands in for it. */
     branchesLoadFailed: boolean;
+    /** A listing has arrived, so a branch missing from it is not still loading. */
+    branchesLoaded: boolean;
     /** Shows a branch the server just created before any listing includes it. */
     addCreatedBranch: (branch: BranchListItem) => void;
-    handleSubmit: (branchName: string) => Promise<void>;
-    handleWithdraw: (branchName: string) => Promise<void>;
+    /** Confirms first; the dialog returns focus to `returnFocusTo()` when given, else its opener. */
+    handleSubmit: (branchName: string, returnFocusTo?: () => HTMLElement | null) => Promise<void>;
+    /** Confirms first; the dialog returns focus to `returnFocusTo()` when given, else its opener. */
+    handleWithdraw: (branchName: string, returnFocusTo?: () => HTMLElement | null) => Promise<void>;
     handleRequestChanges: (branchName: string) => Promise<void>;
     handleDelete: (branchName: string) => Promise<void>;
     handleReloadBranchData: () => Promise<void>;