canopycms 0.2.0 → 0.3.1

package/dist/editor/components/EditorHeader.js

@@ -1,61 +1,118 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Tooltip } from '@mantine/core';
-import { clientOperatingStrategy } from '../../operating-mode/client.js';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useRef } from 'react';
+import { Box, Button, Group, Menu, Text, Tooltip, VisuallyHidden, em, getBreakpointValue, useMantineTheme, } from '@mantine/core';
+import { useMediaQuery, useMergedRef } from '@mantine/hooks';
+import { IconChevronDown, IconLock } from '@tabler/icons-react';
 import { isAdmin, isLockedOutOfBranch, isReviewer } from '../../authorization/helpers.js';
-import { branchBarStatusPresentation } from '../branch-status.js';
+import { branchBarStatus, describeBranchLock } from '../branch-lock.js';
 import { EDITOR_ACTIONS } from '../copy.js';
 import { SYSTEM_USER_ID } from '../../system-users.js';
 import { TopBar } from '../shell/TopBar.js';
-import { describeBranchLock } from './BranchLockBanner.js';
 import { BranchPill } from './BranchPill.js';
-import { EntryBreadcrumb } from './EntryBreadcrumb.js';
-import { SaveSplitButton } from './SaveSplitButton.js';
+import { ReasonedMenuItem } from './ReasonedMenuItem.js';
+import { UnsavedMark } from './UnsavedMark.js';
+import { DraftStorageWarning, HIDDEN_STYLE, SaveAllButton } from './SaveAllButton.js';
+import { useFocusHandOff, useMenuItemFocusReturn } from '../utils/focus-return.js';
 /**
- * The top bar's contents: the breadcrumb with the entry menu and "Read-only" chip, then the branch
- * pill, Submit or Withdraw, and Save with Save all.
+ * The branch bar: the pill, the branch's status and its unsaved count, then the draft-storage
+ * warning, Save all, the way forward and Submit or Withdraw. The open entry's own controls are in
+ * `EntryHeader`.
  */
-export function EditorHeader({ currentEntry, branchName, operatingMode, busy, breadcrumbSegments, editedFiles, modifiedCount, onCollectionOpen, navigatorToggleRef, branchToggleRef, onFileReload, onFileDiscardDraft, onEntryRename, onEntryDelete, onEntrySelect, onBranchReloadData, onBranchDiscardDrafts, onBranchManagerOpen, onSave, onSaveAll, saveAllProgress, saving = false, savedSignal, savedHere = false, entryListFailed = false, onSubmit, onWithdraw, hasUnsavedChanges, entryHasDraft = hasUnsavedChanges, draftStorageFailed = false, entryReadOnly = false, entryUnavailable = false, branchStatus, userContext, branchCreatedBy, branchAccess, branchIsProtected = false, branchReadOnly = false, branchWriteBlocked = false, branchLoading = false, }) {
-    // Shared by Save and Save all; set exactly when BranchLockBanner renders.
-    const branchLockReason = describeBranchLock({ branchStatus, branchReadOnly, branchWriteBlocked });
-    const entryLockReason = entryReadOnly
-        ? "You don't have edit access to this entry. Ask a CanopyCMS admin to grant it."
-        : undefined;
-    // The Tooltip hides it while the editor is busy.
-    const saveBlockedReason = branchLockReason ??
-        (!branchName
-            ? 'Open a branch first.'
-            : !currentEntry
-                ? 'Open an entry to save it.'
-                : (entryLockReason ?? (!hasUnsavedChanges ? 'No changes to save.' : '')));
-    const presentation = branchBarStatusPresentation(branchStatus, branchIsProtected);
-    const status = !branchLoading &&
-        clientOperatingStrategy(operatingMode ?? 'prod').supportsStatusBadge() &&
-        presentation
-        ? {
-            label: presentation.label,
-            value: branchIsProtected ? 'protected' : String(branchStatus),
-            testId: `header-status-badge-${branchIsProtected ? 'protected' : branchStatus}`,
-        }
-        : undefined;
-    return (_jsx(TopBar, { leading: _jsx(EntryBreadcrumb, { segments: breadcrumbSegments, entryLabel: currentEntry ? (currentEntry.label ?? currentEntry.slug) : undefined, entryDirty: hasUnsavedChanges, 
-            // BranchLockBanner already says why a locked branch is read-only, so the chip carries
-            // only the entry's own reason, even beside the banner: "Withdraw it" would not unlock it.
-            readOnlyReason: branchLoading ? undefined : currentEntry || branchName ? entryLockReason : undefined, onCollection: onCollectionOpen, onRefresh: onFileReload, onDiscard: onFileDiscardDraft, 
-            // A path rule's refusal hides them, as the content tree hides that entry's "…" menu.
-            onRename: entryReadOnly ? undefined : onEntryRename, 
-            // An entry with a page has a preview `src`; one without changes only its slug.
-            entryNoPage: !!currentEntry && !currentEntry.previewSrc, onDelete: entryReadOnly ? undefined : onEntryDelete, refreshBlockedReason: branchName ? undefined : 'Open a branch first.', discardBlockedReason: entryHasDraft ? undefined : 'This entry has no unsaved changes.', changeBlockedReason: branchLockReason ??
-                (entryUnavailable
-                    ? "This entry's content type isn't known to this editor version yet. Reload in a few minutes."
-                    : undefined), entryMenuRef: navigatorToggleRef }), trailing: _jsxs(_Fragment, { children: [_jsx(BranchPill, { branchName: branchName, loading: busy, status: status, unsavedCount: modifiedCount, unsavedEntries: editedFiles, onSwitchBranch: onBranchManagerOpen, onRefreshBranch: onBranchReloadData, onDiscardAll: onBranchDiscardDrafts, onEntrySelect: onEntrySelect, pillRef: branchToggleRef }), _jsx(WorkflowButton, { branchName: branchName, busy: busy, branchStatus: branchStatus, userContext: userContext, branchCreatedBy: branchCreatedBy, branchAccess: branchAccess, branchIsProtected: branchIsProtected, onSubmit: onSubmit, onWithdraw: onWithdraw, savingAll: !!saveAllProgress }), _jsx(SaveSplitButton, { onSave: onSave, saveBlockedReason: saveBlockedReason, busy: busy, onSaveAll: onSaveAll, unsavedCount: modifiedCount, saveAllBlockedReason: branchLockReason ??
+export function EditorHeader({ branchName, busy, modifiedCount, onShowUnsaved, branchToggleRef, onBranchReloadData, onBranchDiscardDrafts, onBranchManagerOpen, onNewBranch = onBranchManagerOpen, onSaveAll, saveAllProgress, singleSaving = false, entryListFailed = false, onSubmit, onWithdraw, draftStorageFailed = false, branchStatus, userContext, branchCreatedBy, branchAccess, branchIsProtected = false, branchServerProtected, branchReadOnly = false, branchWriteBlocked = false, branchLoading = false, branchPending = false, branchMissing = false, }) {
+    const lock = { branchStatus, branchReadOnly, branchWriteBlocked, branchPending, branchMissing };
+    const branchLockReason = describeBranchLock(lock);
+    const status = branchBarStatus({ ...lock, isProtected: branchServerProtected });
+    const theme = useMantineTheme();
+    // Mantine's own below-`md` query, the one `visibleFrom="md"` hides under.
+    const belowMd = `(max-width: ${em(getBreakpointValue('md', theme.breakpoints) - 0.1)})`;
+    const narrow = useMediaQuery(belowMd, false, { getInitialValueInEffect: false }) === true;
+    const editable = !!branchName && !branchLoading && !branchLockReason;
+    const workflow = workflowAction({
+        branchName,
+        busy,
+        branchStatus,
+        userContext,
+        branchCreatedBy,
+        branchAccess,
+        branchIsProtected,
+        savingAll: !!saveAllProgress,
+    });
+    // Below `md` one split button holds the bar's actions: Save all on an editable branch, else the
+    // row's way forward, with the workflow action in its caret. Withdraw leads only for a user who
+    // may withdraw; anyone else gets Switch branch…, the blocked Withdraw and its reason in the
+    // caret. A protected branch keeps New branch… either way. Wide, a Withdraw the user can't take
+    // shows blocked, with no Switch branch… beside it: that stays in the pill's menu.
+    const split = narrow && editable;
+    const workflowLeads = status.action === 'workflow' && !!workflow?.permitted;
+    const barAction = status.action === 'workflow'
+        ? narrow && !workflowLeads
+            ? 'switchBranch'
+            : undefined
+        : status.action;
+    // Controls come and go as a submit or withdraw changes the lock, and focus follows them.
+    const [[wayRef, saveAllRef, workflowRef], focusTarget] = useFocusHandOff(3);
+    const workflowControl = {
+        onSubmit,
+        onWithdraw,
+        controlRef: workflowRef,
+        // A withdraw that leaves no workflow action returns focus to the way forward, else Save all.
+        returnFocusTo: () => focusTarget(2),
+    };
+    const caretOnWay = narrow && !!barAction && !!workflow;
+    return (_jsx(TopBar, { leading: _jsxs(Group, { gap: "xs", wrap: "wrap", align: "center", style: { rowGap: 4 }, children: [_jsx(BranchPill, { branchName: branchName, loading: busy, unsavedCount: modifiedCount, onSwitchBranch: onBranchManagerOpen, onRefreshBranch: onBranchReloadData, onDiscardAll: onBranchDiscardDrafts, pillRef: branchToggleRef }), _jsx(BranchStatusLabel, { status: branchName ? status : { value: 'none', readOnly: false }, reason: branchLockReason }), modifiedCount > 0 && (_jsx(Tooltip, { label: unsavedTooltip(branchName ? status : undefined, modifiedCount, !!workflow?.permitted), events: TOOLTIP_EVENTS, multiline: true, maw: 320, children: _jsx(Button, { variant: "subtle", color: "gray", size: "compact-sm", style: { flexShrink: 0 }, leftSection: _jsx(UnsavedMark, { "aria-hidden": "true" }), onClick: onShowUnsaved, "data-testid": "branch-unsaved-count", children: `${modifiedCount} unsaved` }) }))] }), trailing: _jsxs(_Fragment, { children: [_jsx(DraftStorageWarning, { shown: draftStorageFailed && modifiedCount > 0 }), (!narrow || editable) && (_jsx(SaveAllButton
+                // Its reserved width follows this branch's counts, not the session's largest.
+                , { onSaveAll: onSaveAll, unsavedCount: modifiedCount, blockedReason: branchLockReason ??
                         (!branchName
                             ? 'Open a branch first.'
                             : entryListFailed && modifiedCount > 0
                                 ? 'The list of entries couldn\'t be loaded, so these changes can\'t be saved yet. Choose "Refresh branch" in the branch menu to try again.'
-                                : undefined), saveAllProgress: saveAllProgress, saving: saving, savedSignal: savedSignal, savedHere: savedHere, entryDirty: hasUnsavedChanges, draftStorageFailed: draftStorageFailed })] }) }));
+                                : undefined), saveAllProgress: saveAllProgress, singleSaving: singleSaving, busy: busy, buttonRef: saveAllRef, caret: split && workflow ? (_jsx(WorkflowCaret, { ...workflowControl, action: workflow })) : undefined }, branchName)), barAction && (_jsx(BranchWayButton, { action: barAction, buttonRef: wayRef, onClick: barAction === 'newBranch'
+                        ? onNewBranch
+                        : barAction === 'refreshBranch'
+                            ? onBranchReloadData
+                            : onBranchManagerOpen, caret: caretOnWay && workflow ? (_jsx(WorkflowCaret, { ...workflowControl, action: workflow })) : undefined })), !split && !caretOnWay && workflow && (_jsx(WorkflowButton, { ...workflowControl, action: workflow }))] }) }));
 }
-/** Submit for review, or Withdraw from review once submitted or approved. */
-function WorkflowButton({ branchName, busy, branchStatus, userContext, branchCreatedBy, branchAccess, branchIsProtected, onSubmit, onWithdraw, savingAll, }) {
+const TOOLTIP_EVENTS = { hover: true, focus: true, touch: false };
+/**
+ * On a locked branch, what would let its drafts be saved. A new branch starts without them, so a
+ * branch never editable again leaves only discarding, as `ReadOnlyDraftNotice` says.
+ */
+function unsavedTooltip(status, count, mayWithdraw) {
+    if (!status?.readOnly)
+        return 'Show unsaved entries in the content panel';
+    const edits = `${count} unsaved ${count === 1 ? 'edit' : 'edits'} in this browser.`;
+    if (status.action === 'workflow' && mayWithdraw)
+        return `${edits} Withdraw to save them.`;
+    if (status.value === 'unavailable')
+        return `${edits} Use "Refresh branch" to load its details.`;
+    if (status.value === 'not-available')
+        return `${edits} They can't be saved unless this branch is available to you.`;
+    if (status.value === 'protected' || status.value === 'archived')
+        return `${edits} This branch won't become editable, so they can only be discarded.`;
+    return `${edits} They can be saved once the branch is editable again.`;
+}
+/** The branch's state beside the pill, heard in words with its reason, but not while it loads. */
+function BranchStatusLabel({ status, reason }) {
+    const spoken = status.label && status.value !== 'loading'
+        ? [status.label.replace(' · ', ', '), reason].filter(Boolean).join('. ')
+        : '';
+    return (
+    // Always mounted, so a lock that arrives is announced.
+    _jsxs(Box, { role: "status", style: status.label ? { flexShrink: 0 } : HIDDEN_STYLE, children: [status.label && (_jsxs(Group, { gap: 4, wrap: "nowrap", "aria-hidden": "true", "data-testid": "branch-status", "data-status": status.value, children: [status.readOnly && _jsx(IconLock, { size: 14 }), _jsx(Text, { span: true, size: "sm", children: status.label })] })), _jsx(VisuallyHidden, { children: spoken })] }));
+}
+const WAY_LABEL = {
+    newBranch: `${EDITOR_ACTIONS.newBranch}…`,
+    switchBranch: `${EDITOR_ACTIONS.switchBranch}…`,
+    refreshBranch: 'Refresh branch',
+};
+/** The way forward from a locked branch: New branch…, Switch branch… or Refresh branch. */
+function BranchWayButton({ action, onClick, caret, buttonRef, }) {
+    return (
+    // Grouped even alone, as Save all is, so a caret coming or going never remounts the button.
+    _jsxs(Button.Group, { style: { flexShrink: 0 }, renderRoot: (props) => (_jsx("div", { ...props, role: caret ? 'group' : undefined, "aria-label": caret ? 'Branch controls' : undefined })), children: [_jsx(Button, { ref: buttonRef, variant: "light", size: "sm", onClick: () => onClick(), "data-testid": `${action.replace('Branch', '')}-branch-button`, children: WAY_LABEL[action] }), caret] }));
+}
+/** Submit for review, or Withdraw from review once submitted or approved; null when neither shows. */
+function workflowAction({ branchName, busy, branchStatus, userContext, branchCreatedBy, branchAccess, branchIsProtected, savingAll, }) {
     const isSubmitted = branchStatus === 'submitted';
     const isEditing = branchStatus === 'editing';
     // 'approved' withdraws too -- it is that status's only
@@ -89,31 +146,54 @@ function WorkflowButton({ branchName, busy, branchStatus, userContext, branchCre
     // sent people to an admin to fix a non-permissions problem.
     const statusHasAction = isEditing || isWithdrawable;
     const canPerformAction = userHasPermission && statusHasAction;
-    // Blocked, it stays focusable (`aria-disabled`), so its reason opens on focus.
-    // `busy` alone can't hold it: an entry load clears that shared flag mid-run.
-    const actionBlocked = !branchName || busy || savingAll || !canPerformAction;
-    const waitReason = savingAll ? 'Wait for Save all to finish.' : undefined;
-    return (_jsx(Tooltip, { label: 
-        // No branch data (`branchStatus === undefined`) must not be
-        // interpolated raw into this label. Guarded explicitly here rather
-        // than left to the early return above, which hides this button
-        // today only as a side effect of `branchIsProtected`'s `?? true`
-        // default -- not a guarantee this arm stays unreachable.
-        waitReason ??
-            (branchStatus === undefined
-                ? 'Branch details could not be loaded. Use "Switch branch…" to retry.'
-                : !statusHasAction
-                    ? `This branch is ${branchStatus}, so it can't be submitted for review or withdrawn from review.`
-                    : !userHasPermission
-                        ? 'You do not have permission to submit this branch for review or withdraw it from review. Ask an admin for access.'
-                        : ''), disabled: canPerformAction && !waitReason, multiline: true, maw: 320, children: _jsx(Button, { size: "sm", 
-            // Save is the top bar's one filled primary; the rest take their colour's light variant.
-            variant: "light", color: isWithdrawable ? 'orange' : undefined, style: { flexShrink: 0 }, onClick: () => {
-                if (actionBlocked)
+    return {
+        kind: isWithdrawable ? 'withdraw' : 'submit',
+        // `busy` alone can't hold it: an entry load clears that shared flag mid-run.
+        blocked: !branchName || busy || savingAll || !canPerformAction,
+        permitted: canPerformAction,
+        reason: savingAll
+            ? 'Wait for Save all to finish.'
+            : // No branch data (`branchStatus === undefined`) must not be
+                // interpolated raw into this label. Guarded explicitly here rather
+                // than left to the early return above, which hides the action
+                // today only as a side effect of `branchIsProtected`'s `?? true`
+                // default -- not a guarantee this arm stays unreachable.
+                branchStatus === undefined
+                    ? 'Branch details could not be loaded. Use "Refresh branch" to try again.'
+                    : !statusHasAction
+                        ? `This branch is ${branchStatus}, so it can't be submitted for review or withdrawn from review.`
+                        : !userHasPermission
+                            ? 'You do not have permission to submit this branch for review or withdraw it from review. Ask an admin for access.'
+                            : '',
+    };
+}
+function WorkflowButton({ action, onSubmit, onWithdraw, controlRef, returnFocusTo, }) {
+    const withdraw = action.kind === 'withdraw';
+    return (_jsx(Tooltip, { label: action.reason, disabled: !action.reason, multiline: true, maw: 320, children: _jsx(Button, { ref: controlRef, size: "sm", 
+            // The entry's Save is the one filled primary; the rest take their colour's light variant.
+            variant: "light", color: withdraw ? 'orange' : undefined, style: { flexShrink: 0 }, onClick: () => {
+                if (action.blocked)
                     return;
-                if (isWithdrawable)
-                    onWithdraw();
+                if (withdraw)
+                    onWithdraw(returnFocusTo);
                 else
-                    onSubmit();
-            }, "data-disabled": actionBlocked ? true : undefined, "aria-disabled": actionBlocked ? true : undefined, "data-testid": isWithdrawable ? 'withdraw-button' : 'submit-button', children: isWithdrawable ? EDITOR_ACTIONS.withdrawFromReview : EDITOR_ACTIONS.submitForReview }) }));
+                    onSubmit(returnFocusTo);
+            }, "data-disabled": action.blocked ? true : undefined, "aria-disabled": action.blocked ? true : undefined, "data-testid": withdraw ? 'withdraw-button' : 'submit-button', children: withdraw ? EDITOR_ACTIONS.withdrawFromReview : EDITOR_ACTIONS.submitForReview }) }));
+}
+/** Save all's caret below `md`, holding the workflow action. */
+function WorkflowCaret({ action, onSubmit, onWithdraw, controlRef, returnFocusTo, }) {
+    const caret = useRef(null);
+    const caretRef = useMergedRef(caret, controlRef);
+    const menuFocus = useMenuItemFocusReturn(caret);
+    const withdraw = action.kind === 'withdraw';
+    return (
+    // Bounded, so a blocked item's reason wraps on a phone rather than run off the screen.
+    _jsxs(Menu, { withinPortal: true, shadow: "sm", position: "bottom-end", width: 280, ...menuFocus.menu, children: [_jsx(Tooltip, { label: "Branch actions", events: { hover: true, focus: true, touch: false }, children: _jsx(Menu.Target, { children: _jsx(Button, { ref: caretRef, variant: "light", size: "sm", px: 8, "aria-label": "Branch actions", "data-testid": "branch-actions-button", style: { borderInlineStart: '1px solid var(--canopy-input-border)' }, children: _jsx(IconChevronDown, { size: 14, "aria-hidden": "true" }) }) }) }), _jsx(Menu.Dropdown, { ...menuFocus.dropdown, children: _jsx(ReasonedMenuItem, { "data-testid": withdraw ? 'withdraw-menu-item' : 'submit-menu-item', blockedReason: action.blocked
+                        ? action.reason || 'Wait for the current save or load to finish.'
+                        : undefined, onClick: () => {
+                        if (withdraw)
+                            onWithdraw(returnFocusTo);
+                        else
+                            onSubmit(returnFocusTo);
+                    }, children: withdraw ? EDITOR_ACTIONS.withdrawFromReview : EDITOR_ACTIONS.submitForReview }) })] }));
 }

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

@@ -7,13 +7,13 @@ export interface EditorRailProps {
     onContentToggle: () => void;
     /** The Content button, which takes focus when the open entry it was reached from is gone. */
     contentToggleRef?: Ref<HTMLButtonElement>;
-    onQuickOpen: () => void;
-    /** The quick open shortcut as the platform writes it, such as "⌘P". */
-    quickOpenShortcut: string;
-    /** The same shortcut for `aria-keyshortcuts`, such as "Meta+P". */
-    quickOpenKeys: string;
-    branchesOpen: boolean;
-    onBranchesOpen: () => void;
+    /** The shortcut that opens the panel at its search field: "⌘P", and "Meta+P" for `aria-keyshortcuts`. */
+    contentShortcut: {
+        label: string;
+        keys: string;
+    };
+    /** Entries with unsaved changes: the Content button marks them while its panel is closed. */
+    unsavedCount: number;
     /** Without it, the Comments button is not offered (no branch, or a mode without comments). */
     onCommentsOpen?: () => void;
     commentsOpen: boolean;
@@ -45,4 +45,4 @@ export declare function SettingsMenu({ items, toggleRef, }: {
     toggleRef?: Ref<HTMLButtonElement>;
 }): import("react/jsx-runtime").JSX.Element | null;
 /** The editor's activity rail: what `ActivityRail` lays out, wired to the editor's surfaces. */
-export declare function EditorRail({ contentPanelOpen, contentPanelId, onContentToggle, contentToggleRef, onQuickOpen, quickOpenShortcut, quickOpenKeys, branchesOpen, onBranchesOpen, onCommentsOpen, commentsOpen, unresolvedCommentCount, mediaLibraryOpen, onMediaLibraryOpen, mediaButtonRef, layout, onLayoutChange, layoutBlocked, onPermissionManagerOpen, onGroupManagerOpen, onSystemHealthOpen, settingsToggleRef, AccountComponent, onAccountClick, onLogoutClick, }: EditorRailProps): import("react/jsx-runtime").JSX.Element;
+export declare function EditorRail({ contentPanelOpen, contentPanelId, onContentToggle, contentToggleRef, contentShortcut, unsavedCount, onCommentsOpen, commentsOpen, unresolvedCommentCount, mediaLibraryOpen, onMediaLibraryOpen, mediaButtonRef, layout, onLayoutChange, layoutBlocked, onPermissionManagerOpen, onGroupManagerOpen, onSystemHealthOpen, settingsToggleRef, AccountComponent, onAccountClick, onLogoutClick, }: EditorRailProps): import("react/jsx-runtime").JSX.Element;

package/dist/editor/components/EditorRail.js

@@ -3,11 +3,11 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useRef, useState } from 'react';
 import { ActionIcon, Menu, Stack, Tooltip, VisuallyHidden } from '@mantine/core';
 import { useMergedRef } from '@mantine/hooks';
-import { IconActivity, IconExternalLink, IconFiles, IconGitBranch, IconInfoCircle, IconLayoutColumns, IconLayoutRows, IconLogout, IconMessageCircle, IconPhoto, IconSearch, IconSettings, IconUserCircle, } from '@tabler/icons-react';
-import { ActivityRail, RailButton } from '../shell/ActivityRail.js';
+import { IconActivity, IconExternalLink, IconFiles, IconInfoCircle, IconLayoutColumns, IconLayoutRows, IconLogout, IconMessageCircle, IconPhoto, IconSettings, IconUserCircle, } from '@tabler/icons-react';
+import { ActivityRail, RailButton, RailDivider } from '../shell/ActivityRail.js';
 import { useMenuItemFocusReturn } from '../utils/focus-return.js';
+import { UnsavedMark } from './UnsavedMark.js';
 import { CANOPYCMS_VERSION } from '../../version.js';
-import { EDITOR_ACTIONS } from '../copy.js';
 const ABOUT_URL = 'https://github.com/safeinsights/canopycms';
 /**
  * @internal Exported for tests. The Settings button and its menu of `items`; with none, no
@@ -41,7 +41,7 @@ function LayoutButton({ layout, onChange, blocked = false, }) {
                 } }), _jsx(VisuallyHidden, { role: "status", "data-testid": "rail-layout-status", children: switchedTo })] }));
 }
 /** The editor's activity rail: what `ActivityRail` lays out, wired to the editor's surfaces. */
-export function EditorRail({ contentPanelOpen, contentPanelId, onContentToggle, contentToggleRef, onQuickOpen, quickOpenShortcut, quickOpenKeys, branchesOpen, onBranchesOpen, onCommentsOpen, commentsOpen, unresolvedCommentCount, mediaLibraryOpen, onMediaLibraryOpen, mediaButtonRef, layout, onLayoutChange, layoutBlocked, onPermissionManagerOpen, onGroupManagerOpen, onSystemHealthOpen, settingsToggleRef, AccountComponent, onAccountClick, onLogoutClick, }) {
+export function EditorRail({ contentPanelOpen, contentPanelId, onContentToggle, contentToggleRef, contentShortcut, unsavedCount, onCommentsOpen, commentsOpen, unresolvedCommentCount, mediaLibraryOpen, onMediaLibraryOpen, mediaButtonRef, layout, onLayoutChange, layoutBlocked, onPermissionManagerOpen, onGroupManagerOpen, onSystemHealthOpen, settingsToggleRef, AccountComponent, onAccountClick, onLogoutClick, }) {
     const adminItems = [
         onPermissionManagerOpen && (_jsx(Menu.Item, { "data-testid": "settings-menu-permissions", onClick: onPermissionManagerOpen, children: "Manage permissions" }, "permissions")),
         onGroupManagerOpen && (_jsx(Menu.Item, { "data-testid": "settings-menu-groups", onClick: onGroupManagerOpen, children: "Manage groups" }, "groups")),
@@ -59,6 +59,8 @@ export function EditorRail({ contentPanelOpen, contentPanelId, onContentToggle,
         _jsx(Menu.Label, { "data-testid": "settings-menu-version", children: `CanopyCMS ${CANOPYCMS_VERSION}` }, "version"),
         _jsxs(Menu.Item, { component: "a", href: ABOUT_URL, target: "_blank", rel: "noopener noreferrer", "data-testid": "settings-menu-about", leftSection: _jsx(IconInfoCircle, { size: 14 }), rightSection: _jsx(IconExternalLink, { size: 14, "aria-hidden": true }), children: ["About CanopyCMS", _jsx(VisuallyHidden, { component: "span", children: " (opens in a new tab)" })] }, "about"),
     ];
+    const unsaved = !contentPanelOpen && unsavedCount > 0;
+    const contentLabel = unsaved ? `Content, ${unsavedCount} unsaved` : 'Content';
     const commentsLabel = unresolvedCommentCount > 0 ? `Comments, ${unresolvedCommentCount} unresolved` : 'Comments';
-    return (_jsx(ActivityRail, { top: _jsxs(_Fragment, { children: [_jsx(RailButton, { railId: "content", label: "Content", icon: _jsx(IconFiles, { size: 20 }), active: contentPanelOpen, "aria-expanded": contentPanelOpen, "aria-controls": contentPanelOpen ? contentPanelId : undefined, "data-testid": "content-panel-toggle", ref: contentToggleRef, onClick: onContentToggle }), _jsx(RailButton, { railId: "search", label: EDITOR_ACTIONS.openEntry, shortcut: quickOpenShortcut, "aria-keyshortcuts": quickOpenKeys, icon: _jsx(IconSearch, { size: 20 }), "aria-haspopup": "dialog", "data-testid": "rail-search-button", onClick: onQuickOpen }), _jsx(RailButton, { railId: "branches", label: "Branches", icon: _jsx(IconGitBranch, { size: 20 }), active: branchesOpen, "aria-haspopup": "dialog", "data-testid": "rail-branches-button", onClick: onBranchesOpen }), onCommentsOpen && (_jsx(RailButton, { railId: "comments", label: commentsLabel, icon: _jsx(IconMessageCircle, { size: 20 }), active: commentsOpen, count: unresolvedCommentCount, countTestId: "comments-unresolved-count", "aria-haspopup": "dialog", "data-testid": "comments-button", onClick: onCommentsOpen })), _jsx(RailButton, { railId: "media", label: "Media library", icon: _jsx(IconPhoto, { size: 20 }), active: mediaLibraryOpen, "aria-haspopup": "dialog", "data-testid": "media-library-button", ref: mediaButtonRef, onClick: onMediaLibraryOpen })] }), bottom: _jsxs(_Fragment, { children: [_jsx(LayoutButton, { layout: layout, onChange: onLayoutChange, blocked: layoutBlocked }), _jsx(SettingsMenu, { items: settingsItems, toggleRef: settingsToggleRef })] }), account: AccountComponent ? (_jsx(AccountComponent, {})) : onAccountClick || onLogoutClick ? (_jsxs(Stack, { gap: 6, align: "center", children: [onAccountClick && (_jsx(Tooltip, { label: "Account", position: "right", children: _jsx(ActionIcon, { variant: "subtle", color: "gray", size: "lg", radius: "md", "aria-label": "Account", onClick: onAccountClick, children: _jsx(IconUserCircle, { size: 20 }) }) })), onLogoutClick && (_jsx(Tooltip, { label: "Sign out", position: "right", children: _jsx(ActionIcon, { variant: "subtle", color: "gray", size: "lg", radius: "md", "aria-label": "Sign out", onClick: onLogoutClick, children: _jsx(IconLogout, { size: 20 }) }) }))] })) : undefined }));
+    return (_jsx(ActivityRail, { top: _jsxs(_Fragment, { children: [_jsx(RailButton, { railId: "content", label: contentLabel, corner: unsaved ? _jsx(UnsavedMark, { "aria-hidden": true, "data-testid": "rail-unsaved-mark" }) : undefined, icon: _jsx(IconFiles, { size: 20 }), active: contentPanelOpen, "aria-expanded": contentPanelOpen, "aria-controls": contentPanelOpen ? contentPanelId : undefined, shortcut: contentShortcut.label, "aria-keyshortcuts": contentShortcut.keys, "data-testid": "content-panel-toggle", ref: contentToggleRef, onClick: onContentToggle }), onCommentsOpen && (_jsx(RailButton, { railId: "comments", label: commentsLabel, icon: _jsx(IconMessageCircle, { size: 20 }), active: commentsOpen, count: unresolvedCommentCount, countTestId: "comments-unresolved-count", "aria-haspopup": "dialog", "data-testid": "comments-button", onClick: onCommentsOpen })), _jsx(RailButton, { railId: "media", label: "Media library", icon: _jsx(IconPhoto, { size: 20 }), active: mediaLibraryOpen, "aria-haspopup": "dialog", "data-testid": "media-library-button", ref: mediaButtonRef, onClick: onMediaLibraryOpen }), _jsx(RailDivider, {}), _jsx(LayoutButton, { layout: layout, onChange: onLayoutChange, blocked: layoutBlocked })] }), bottom: _jsx(SettingsMenu, { items: settingsItems, toggleRef: settingsToggleRef }), account: AccountComponent ? (_jsx(AccountComponent, {})) : onAccountClick || onLogoutClick ? (_jsxs(Stack, { gap: 6, align: "center", children: [onAccountClick && (_jsx(Tooltip, { label: "Account", position: "right", children: _jsx(ActionIcon, { variant: "subtle", color: "gray", size: "lg", radius: "md", "aria-label": "Account", onClick: onAccountClick, children: _jsx(IconUserCircle, { size: 20 }) }) })), onLogoutClick && (_jsx(Tooltip, { label: "Sign out", position: "right", children: _jsx(ActionIcon, { variant: "subtle", color: "gray", size: "lg", radius: "md", "aria-label": "Sign out", onClick: onLogoutClick, children: _jsx(IconLogout, { size: 20 }) }) }))] })) : undefined }));
 }

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

@@ -5,11 +5,15 @@ export interface EntryBreadcrumbProps {
     segments: BreadcrumbSegment[];
     /** The open entry's label; undefined when no entry is open. */
     entryLabel: string | undefined;
+    /** No entry yet because the branch or its entries are still loading: a placeholder crumb shows. */
+    entryLoading?: boolean;
     /** The open entry has unsaved changes. */
     entryDirty: boolean;
     /** Why the open entry is read-only; set, the "Read-only" chip shows. */
     readOnlyReason?: string;
     onCollection: (collectionPath: string) => void;
+    /** Offers "Show in content panel", which brings the entry's row into view and focuses it. */
+    onReveal?: () => void;
     onRefresh: () => void;
     onDiscard: () => void;
     /** With `onDelete`, offers "Change URL…" and "Delete entry"; absent where a path rule refuses them. */
@@ -29,4 +33,4 @@ export interface EntryBreadcrumbProps {
  * the entry's own crumb is current and opens the entry menu. Crumbs shrink and truncate before the
  * entry's own does.
  */
-export declare function EntryBreadcrumb({ segments, entryLabel, entryDirty, readOnlyReason, onCollection, onRefresh, onDiscard, onRename, entryNoPage, onDelete, refreshBlockedReason, discardBlockedReason, changeBlockedReason, entryMenuRef, }: EntryBreadcrumbProps): import("react/jsx-runtime").JSX.Element;
+export declare function EntryBreadcrumb({ segments, entryLabel, entryLoading, entryDirty, readOnlyReason, onCollection, onReveal, onRefresh, onDiscard, onRename, entryNoPage, onDelete, refreshBlockedReason, discardBlockedReason, changeBlockedReason, entryMenuRef, }: EntryBreadcrumbProps): import("react/jsx-runtime").JSX.Element;

package/dist/editor/components/EntryBreadcrumb.js

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from 'react';
-import { Badge, Box, Button, Group, Menu, Text, Tooltip, VisuallyHidden } from '@mantine/core';
+import { Badge, Box, Button, Group, Menu, Skeleton, Text, Tooltip, VisuallyHidden, } from '@mantine/core';
 import { useMergedRef } from '@mantine/hooks';
 import { IconChevronDown, IconChevronRight, IconLock } from '@tabler/icons-react';
 import { EDITOR_ACTIONS } from '../copy.js';
@@ -40,7 +40,7 @@ const separator = (_jsx(IconChevronRight, { size: 14, "aria-hidden": "true", sty
  * the entry's own crumb is current and opens the entry menu. Crumbs shrink and truncate before the
  * entry's own does.
  */
-export function EntryBreadcrumb({ segments, entryLabel, entryDirty, readOnlyReason, onCollection, onRefresh, onDiscard, onRename, entryNoPage = false, onDelete, refreshBlockedReason, discardBlockedReason, changeBlockedReason, entryMenuRef, }) {
+export function EntryBreadcrumb({ segments, entryLabel, entryLoading = false, entryDirty, readOnlyReason, onCollection, onReveal, onRefresh, onDiscard, onRename, entryNoPage = false, onDelete, refreshBlockedReason, discardBlockedReason, changeBlockedReason, entryMenuRef, }) {
     const trigger = useRef(null);
     const triggerRef = useMergedRef(trigger, entryMenuRef);
     const menuFocus = useMenuItemFocusReturn(trigger);
@@ -49,5 +49,5 @@ export function EntryBreadcrumb({ segments, entryLabel, entryDirty, readOnlyReas
                 // Clips crumbs that overflow, padded by the focus ring's reach so the ring is not clipped.
                 style: { flex: '0 1 auto', overflow: 'hidden', padding: 4, margin: -4 }, children: _jsxs(Group, { component: "ol", gap: 2, wrap: "nowrap", miw: 0, style: { listStyle: 'none', margin: 0, padding: 0 }, children: [segments.map((segment, index) => (_jsxs(Group, { component: "li", gap: 2, wrap: "nowrap", miw: 0, 
                             // Collections give up their width long before the entry's own crumb does.
-                            style: { flex: '0 100 auto' }, children: [index > 0 && separator, segment.folder ? (_jsx(Text, { size: "sm", c: "dimmed", px: 4, miw: 0, truncate: "end", children: segment.label })) : (_jsx(CollectionCrumb, { label: segment.label, onClick: () => onCollection(segment.collectionPath) }))] }, `${segment.label}-${index}`))), _jsxs(Group, { component: "li", gap: 2, wrap: "nowrap", miw: 64, style: { flex: '0 1 auto' }, children: [segments.length > 0 && separator, entryLabel === undefined ? (_jsx(Text, { size: "sm", c: "dimmed", px: 4, "data-testid": "file-dropdown-button", children: "No entry open" })) : (_jsxs(Menu, { withinPortal: true, shadow: "sm", position: "bottom-start", ...menuFocus.menu, children: [_jsx(CrumbTooltip, { label: entryLabel, truncated: entryTruncated, children: _jsx(Menu.Target, { children: _jsxs(Button, { ref: triggerRef, variant: "subtle", color: "gray", size: "compact-sm", fw: 600, miw: 0, maw: "100%", "aria-current": "page", rightSection: _jsx(IconChevronDown, { size: 14, "aria-hidden": "true" }), "data-testid": "file-dropdown-button", styles: { label: { minWidth: 0, gap: 6 } }, children: [crumbText(entryLabel, entryLabelRef), entryDirty && (_jsxs(_Fragment, { children: [_jsx(UnsavedMark, { "aria-hidden": "true", "data-testid": "entry-unsaved-dot" }), _jsx(VisuallyHidden, { component: "span", children: ", unsaved changes" })] }))] }) }) }), _jsxs(Menu.Dropdown, { ...menuFocus.dropdown, children: [_jsx(ReasonedMenuItem, { onClick: onRefresh, blockedReason: refreshBlockedReason, "data-testid": "refresh-entry-menu-item", children: EDITOR_ACTIONS.refreshFromServer }), _jsx(ReasonedMenuItem, { "data-testid": "discard-file-draft-menu-item", onClick: onDiscard, blockedReason: discardBlockedReason, children: "Discard changes" }), onRename && onDelete && (_jsxs(_Fragment, { children: [_jsx(Menu.Divider, {}), _jsxs(ReasonedMenuItem, { onClick: onRename, blockedReason: changeBlockedReason, "data-testid": "entry-menu-rename", children: [entryNoPage ? EDITOR_ACTIONS.changeSlug : EDITOR_ACTIONS.changeUrl, "\u2026"] }), _jsx(DestructiveMenuItem, { onClick: onDelete, blockedReason: changeBlockedReason, "data-testid": "entry-menu-delete", children: "Delete entry" })] }))] })] }))] })] }) }), readOnlyReason && (_jsx(Tooltip, { label: readOnlyReason, multiline: true, maw: 300, children: _jsxs(Badge, { variant: "light", color: "gray", radius: "sm", leftSection: _jsx(IconLock, { size: 12, "aria-hidden": "true" }), style: { flexShrink: 0, textTransform: 'none' }, "data-testid": "read-only-chip", children: ["Read-only", _jsxs(VisuallyHidden, { component: "span", children: [". ", readOnlyReason] })] }) }))] }));
+                            style: { flex: '0 100 auto' }, children: [index > 0 && separator, segment.folder ? (_jsx(Text, { size: "sm", c: "dimmed", px: 4, miw: 0, truncate: "end", children: segment.label })) : (_jsx(CollectionCrumb, { label: segment.label, onClick: () => onCollection(segment.collectionPath) }))] }, `${segment.label}-${index}`))), _jsxs(Group, { component: "li", gap: 2, wrap: "nowrap", miw: 64, style: { flex: '0 1 auto' }, children: [segments.length > 0 && separator, entryLabel === undefined && entryLoading ? (_jsx(Skeleton, { height: 16, width: 120, mx: 4, "data-testid": "entry-crumb-loading", children: _jsx(VisuallyHidden, { children: "Loading\u2026" }) })) : entryLabel === undefined ? (_jsx(Text, { size: "sm", c: "dimmed", px: 4, "data-testid": "file-dropdown-button", children: "No entry open" })) : (_jsxs(Menu, { withinPortal: true, shadow: "sm", position: "bottom-start", ...menuFocus.menu, children: [_jsx(CrumbTooltip, { label: entryLabel, truncated: entryTruncated, children: _jsx(Menu.Target, { children: _jsxs(Button, { ref: triggerRef, variant: "subtle", color: "gray", size: "compact-sm", fw: 600, miw: 0, maw: "100%", "aria-current": "page", rightSection: _jsx(IconChevronDown, { size: 14, "aria-hidden": "true" }), "data-testid": "file-dropdown-button", styles: { label: { minWidth: 0, gap: 6 } }, children: [crumbText(entryLabel, entryLabelRef), entryDirty && (_jsxs(_Fragment, { children: [_jsx(UnsavedMark, { "aria-hidden": "true", "data-testid": "entry-unsaved-dot" }), _jsx(VisuallyHidden, { component: "span", children: ", unsaved changes" })] }))] }) }) }), _jsxs(Menu.Dropdown, { ...menuFocus.dropdown, children: [onReveal && (_jsxs(_Fragment, { children: [_jsx(Menu.Item, { onClick: onReveal, "data-testid": "entry-menu-reveal", children: "Show in content panel" }), _jsx(Menu.Divider, {})] })), _jsx(ReasonedMenuItem, { onClick: onRefresh, blockedReason: refreshBlockedReason, "data-testid": "refresh-entry-menu-item", children: EDITOR_ACTIONS.refreshFromServer }), _jsx(ReasonedMenuItem, { "data-testid": "discard-file-draft-menu-item", onClick: onDiscard, blockedReason: discardBlockedReason, children: "Discard changes" }), onRename && onDelete && (_jsxs(_Fragment, { children: [_jsx(Menu.Divider, {}), _jsxs(ReasonedMenuItem, { onClick: onRename, blockedReason: changeBlockedReason, "data-testid": "entry-menu-rename", children: [entryNoPage ? EDITOR_ACTIONS.changeSlug : EDITOR_ACTIONS.changeUrl, "\u2026"] }), _jsx(DestructiveMenuItem, { onClick: onDelete, blockedReason: changeBlockedReason, "data-testid": "entry-menu-delete", children: "Delete entry" })] }))] })] }))] })] }) }), readOnlyReason && (_jsx(Tooltip, { label: readOnlyReason, multiline: true, maw: 300, children: _jsxs(Badge, { variant: "light", color: "gray", radius: "sm", leftSection: _jsx(IconLock, { size: 12, "aria-hidden": "true" }), style: { flexShrink: 0, textTransform: 'none' }, "data-testid": "read-only-chip", children: ["Read-only", _jsxs(VisuallyHidden, { component: "span", children: [". ", readOnlyReason] })] }) }))] }));
 }

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

@@ -0,0 +1,60 @@
+import { type Ref } from 'react';
+import type { BranchStatus } from '../../types.js';
+import type { EditorEntry } from '../Editor.js';
+import type { BreadcrumbSegment } from '../editor-utils.js';
+export interface EntryHeaderProps {
+    currentEntry: EditorEntry | undefined;
+    /** No entry yet because the branch or its entries are still loading. */
+    entryLoading?: boolean;
+    branchName: string;
+    /** Whether operations are currently in progress. */
+    busy: boolean;
+    /** The crumbs before the open entry's own. */
+    breadcrumbSegments: BreadcrumbSegment[];
+    /** Opens the content panel on a collection. */
+    onCollectionOpen: (collectionPath: string) => void;
+    /** Opens the content panel on the open entry's row. */
+    onEntryReveal?: () => void;
+    /** The entry menu's trigger. */
+    navigatorToggleRef?: Ref<HTMLButtonElement>;
+    /** Replaces the open entry with the server's copy. */
+    onFileReload: () => void;
+    onFileDiscardDraft: () => void;
+    /** Opens the open entry's "Change URL" dialog. */
+    onEntryRename: () => void;
+    /** Asks to delete the open entry. */
+    onEntryDelete: () => void;
+    onSave: () => void;
+    /** Save all is running. */
+    saveAllRunning: boolean;
+    /** A Save of the open entry is in flight. */
+    saving?: boolean;
+    /** Rises each time a single Save lands, whichever entry it saved. */
+    savedSignal?: number;
+    /** The last Save that landed saved the open entry. */
+    savedHere?: boolean;
+    /** The open entry has unsaved changes it could save. */
+    hasUnsavedChanges: boolean;
+    /** The open entry has a draft, savable or not (a read-only branch's still discards). */
+    entryHasDraft?: boolean;
+    /** Writing drafts to localStorage failed, so they live only in this tab. */
+    draftStorageFailed?: boolean;
+    /** The open entry can't be edited by this user (a path rule). */
+    entryReadOnly?: boolean;
+    /** The open entry's type has no schema in the running code. */
+    entryUnavailable?: boolean;
+    /** Current branch status (undefined if unknown). */
+    branchStatus: BranchStatus | undefined;
+    /** Whether the current branch is read-only (protected base branch in prod); disables Save. */
+    branchReadOnly?: boolean;
+    /** Server-computed: content writes are rejected on this branch; see `branchLockState`. */
+    branchWriteBlocked?: boolean;
+    /** No branch details yet: the fail-closed lock defaults are guesses the chip doesn't name. */
+    branchLoading?: boolean;
+    /** The branch list is still being fetched, so Save waits rather than naming a failure. */
+    branchPending?: boolean;
+    /** The branch list answered without this branch. */
+    branchMissing?: boolean;
+}
+/** The open entry's breadcrumb, menu, unsaved dot and "Read-only" chip, then Save, over the panes. */
+export declare function EntryHeader({ currentEntry, entryLoading, branchName, busy, breadcrumbSegments, onCollectionOpen, onEntryReveal, navigatorToggleRef, onFileReload, onFileDiscardDraft, onEntryRename, onEntryDelete, onSave, saveAllRunning, saving, savedSignal, savedHere, hasUnsavedChanges, entryHasDraft, draftStorageFailed, entryReadOnly, entryUnavailable, branchStatus, branchReadOnly, branchWriteBlocked, branchLoading, branchPending, branchMissing, }: EntryHeaderProps): import("react/jsx-runtime").JSX.Element;

package/dist/editor/components/EntryHeader.js

@@ -0,0 +1,45 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Group } from '@mantine/core';
+import { SHELL_REGION_BORDER } from '../shell/EditorShell.js';
+import { describeBranchLock } from '../branch-lock.js';
+import { EntryBreadcrumb } from './EntryBreadcrumb.js';
+import { EntrySaveButton } from './EntrySaveButton.js';
+const ENTRY_HEADER_HEIGHT = 48;
+/** The open entry's breadcrumb, menu, unsaved dot and "Read-only" chip, then Save, over the panes. */
+export function EntryHeader({ currentEntry, entryLoading = false, branchName, busy, breadcrumbSegments, onCollectionOpen, onEntryReveal, navigatorToggleRef, onFileReload, onFileDiscardDraft, onEntryRename, onEntryDelete, onSave, saveAllRunning, saving = false, savedSignal, savedHere = false, hasUnsavedChanges, entryHasDraft = hasUnsavedChanges, draftStorageFailed = false, entryReadOnly = false, entryUnavailable = false, branchStatus, branchReadOnly = false, branchWriteBlocked = false, branchLoading = false, branchPending = false, branchMissing = false, }) {
+    const branchLockReason = describeBranchLock({
+        branchStatus,
+        branchReadOnly,
+        branchWriteBlocked,
+        branchPending,
+        branchMissing,
+    });
+    const entryLockReason = entryReadOnly
+        ? "You don't have edit access to this entry. Ask a CanopyCMS admin to grant it."
+        : undefined;
+    // The Tooltip hides it while the editor is busy.
+    const saveBlockedReason = branchLockReason ??
+        (!branchName
+            ? 'Open a branch first.'
+            : !currentEntry
+                ? 'Open an entry to save it.'
+                : (entryLockReason ?? (!hasUnsavedChanges ? 'No changes to save.' : '')));
+    return (_jsxs(Group, { component: "section", "aria-label": "Entry", "data-testid": "entry-header", gap: "xs", wrap: "nowrap", justify: "space-between", px: "sm", py: 6, mih: ENTRY_HEADER_HEIGHT, style: {
+            flexShrink: 0,
+            borderBottom: SHELL_REGION_BORDER,
+            background: 'var(--mantine-color-body)',
+        }, children: [_jsx(Box, { miw: 0, style: { flex: '1 1 0%' }, children: _jsx(EntryBreadcrumb, { segments: breadcrumbSegments, entryLabel: currentEntry ? (currentEntry.label ?? currentEntry.slug) : undefined, entryLoading: entryLoading, entryDirty: hasUnsavedChanges, 
+                    // The branch bar's status already says a locked branch is read-only, so the chip carries
+                    // only the entry's own reason: "Withdraw it" would not unlock the entry.
+                    readOnlyReason: branchLoading ? undefined : currentEntry || branchName ? entryLockReason : undefined, onCollection: onCollectionOpen, onReveal: onEntryReveal, onRefresh: onFileReload, onDiscard: onFileDiscardDraft, 
+                    // A path rule's refusal hides them, as the content tree hides that entry's "…" menu.
+                    onRename: entryReadOnly ? undefined : onEntryRename, 
+                    // An entry with a page has a preview `src`; one without changes only its slug.
+                    entryNoPage: !!currentEntry && !currentEntry.previewSrc, onDelete: entryReadOnly ? undefined : onEntryDelete, refreshBlockedReason: branchName ? undefined : 'Open a branch first.', discardBlockedReason: entryHasDraft ? undefined : 'This entry has no unsaved changes.', changeBlockedReason: branchLockReason ??
+                        (entryUnavailable
+                            ? "This entry's content type isn't known to this editor version yet. Reload in a few minutes."
+                            : undefined), entryMenuRef: navigatorToggleRef }) }), _jsx(EntrySaveButton, { onSave: onSave, saveBlockedReason: saveBlockedReason, 
+                // Loading, "Open an entry to save it." would claim an empty state too soon.
+                busy: busy || entryLoading, saveAllRunning: saveAllRunning, saving: saving, savedSignal: savedSignal, savedHere: savedHere, entryDirty: hasUnsavedChanges, draftStorageFailed: draftStorageFailed })] }));
+}

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

@@ -0,0 +1,24 @@
+export interface EntrySaveButtonProps {
+    onSave: () => void;
+    /** Why Save can't act now; empty when it can. */
+    saveBlockedReason: string;
+    /** The editor is loading or saving: Save waits without a reason. */
+    busy: boolean;
+    /** Save all is running, so Save waits for it, and says so. */
+    saveAllRunning: boolean;
+    /** A Save of the open entry is in flight. */
+    saving?: boolean;
+    /** Rises each time a single Save lands, whichever entry it saved. */
+    savedSignal?: number;
+    /** The last Save that landed saved the open entry. */
+    savedHere?: boolean;
+    /** The open entry has unsaved changes. */
+    entryDirty: boolean;
+    /** Writing drafts to localStorage failed, so they live only in this tab. */
+    draftStorageFailed: boolean;
+}
+/**
+ * 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 declare function EntrySaveButton({ onSave, saveBlockedReason, busy, saveAllRunning, saving, savedSignal, savedHere, entryDirty, draftStorageFailed, }: EntrySaveButtonProps): import("react/jsx-runtime").JSX.Element;