@elytracms/studio 0.0.37 → 0.0.39

package/dist/components/cms/detail-editor.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Link, STUDIO_PROJECT_ROUTE, studioPath, useNavigate } from '@elytracms/studio/router';
-import { Check, CircleAlert, CircleCheck, ExternalLink, Eye, EyeOff, GitCompareArrows, History, Languages, Link2, Loader2, Lock, MoreHorizontal, Tag, Trash2, X, } from 'lucide-react';
+import { Check, CircleAlert, CircleCheck, ExternalLink, Eye, EyeOff, GitCompareArrows, History, Loader2, Lock, MoreHorizontal, RotateCcw, Save, Tag, Trash2, X, } from 'lucide-react';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { FIELD_WIDTH_SPANS, SIDEBAR_FIELD_GROUP, clearHiddenValues, documentKey, groupOrder, groupSectionOf, hasAliases, hiddenGroupNames, isBlocksField, isFieldHidden, isFieldLocalized, isSingleton, resolveDocumentForLocale, resolveDocumentTitle, resolveField, sidebarFields, tabDescriptorOf, tabOrder, titleFieldOf, staticFieldHidden, urlForDocument, } from '@elytracms/core/cms-core';
 import { blockRootsOf } from '@elytracms/core/project-graph';
@@ -8,12 +8,16 @@ import { Badge, Button, Dialog, DialogContent, DialogDescription, DialogFooter,
 import { getStudioRegistry } from '@elytracms/studio/lib/registry';
 import { collectEmbedRefs, resolveReuseCapability } from '../builder/reuse';
 import { cn } from '@elytracms/studio/lib/utils';
+import { useOperationCache } from '@elytracms/studio/lib/query';
 import { localizedLabel, translate } from '@elytracms/studio/lib/i18n';
-import { LocaleSwitcher, displayedFieldFallback, hasLocaleVariant, localeChipLabel, setStudioLocale, } from '@elytracms/studio/lib/locale';
+import { LocaleSwitcher, activeLocaleValues, displayedFieldFallback, fieldConnection, fillFieldFromBase, resetFieldToBase, setFieldValue, setStudioLocale, } from '@elytracms/studio/lib/locale';
 import { parseDocumentFieldPath } from '@elytracms/studio/lib/references';
-import { FallbackChip, fallbackTitle } from './cell';
+import { FallbackChip } from './cell';
+import { FieldConnectionControl } from './field-connection';
 import { FieldControl } from './field-control';
-import { CompositionFieldEditor } from '../builder/composition-field-editor';
+// EC-322: the lazy-wrapped page builder — the heavy canvas subtree code-splits out
+// of the detail-view critical path and downloads only when a `blocks` field opens.
+import { CompositionFieldEditor } from '../builder/composition-field-editor-lazy';
 import { fieldLabel } from './cms-store';
 import { useCmsCollectionViewSource } from '../collection-view/cms-collection-view-source';
 import { CollectionViewProvider, useCollectionView } from '../collection-view/collection-view-context';
@@ -25,14 +29,16 @@ import { ReferencesPanel } from '../references/references-panel';
 import { InspectorSidebar } from '../inspector/inspector-sidebar';
 import { DocumentEditorProvider } from './document-editor-context';
 import { VersionsPane } from './versions-pane';
-import { VersionCompare } from './version-compare';
+// EC-322: the lazy-wrapped compare view — its diff UI code-splits off the detail-view
+// critical path and loads only when the Compare tab opens.
+import { VersionCompare } from './version-compare-lazy';
+import { useDocumentVersionsQuery } from './use-document-versions';
+import { discardDraftStatus } from './discard-draft';
 import { IssuesPane } from './issues-pane';
 import { DetailsPane } from './details-pane';
 import { useSetBreadcrumb } from '../breadcrumb-context';
 import { resolveDeploymentFrontendUrl, resolveDeploymentRoutes } from '@elytracms/studio/lib/workspace';
 import { usePublishedDocuments } from '@elytracms/studio/lib/cms/published-documents';
-/** The conventional slug field name (mirrors `url-for-document`'s `SLUG_FIELD`). */
-const SLUG_FIELD = 'slug';
 export function DetailEditor({ projectId, collectionId, documentId, focusPath, }) {
     // AD-19: the edit shell is a portable surface over a CollectionViewSource, just
     // like the list. `DetailEditor` is the CMS entry point — it builds the CMS source
@@ -144,7 +150,59 @@ function EditorBody({ projectId, collection, doc, focusPath, }) {
     const viewReadOnly = perspective === 'published';
     const viewDoc = viewReadOnly && publishedSnapshot.status === 'ready' ? publishedSnapshot.doc : draft;
     const publishedPending = viewReadOnly && publishedSnapshot.status !== 'ready';
-    const dirty = JSON.stringify(draft) !== JSON.stringify(doc);
+    // EC-316 — "Discard changes": revert the draft to exactly the published
+    // content. Only meaningful for a publishing + versioned rail AND a published
+    // document, so the history query is gated off otherwise (never a wasted
+    // fetch on e.g. the users rail or a never-published draft).
+    const canDiscard = canPublish && canVersions;
+    const { versionsQuery: discardVersionsQuery, versionKey: discardVersionKey } = useDocumentVersionsQuery(ref, {
+        enabled: canDiscard && published,
+    });
+    const discardCache = useOperationCache();
+    const [discardConfirm, setDiscardConfirm] = useState(false);
+    const [discardBusy, setDiscardBusy] = useState(false);
+    const discardView = discardVersionsQuery.data ?? null;
+    const publishedVersionNumber = discardView?.publishedVersion;
+    const publishedSnapshotForDiscard = publishedVersionNumber !== undefined
+        ? discardView?.versions.find((v) => v.version === publishedVersionNumber)?.snapshot
+        : undefined;
+    // One pure decision (tested in discard-draft.test.ts): hidden / disabled-
+    // with-reason / ready. Its semantic equality is the SAME comparator the
+    // Versions pane's publish gate uses, so the two never contradict (EC-298).
+    const discardStatus = discardDraftStatus({
+        canDiscard,
+        published,
+        viewReadOnly,
+        publishedSnapshot: publishedSnapshotForDiscard,
+        collection,
+        draft,
+    });
+    const discardDisabledReason = discardStatus === 'view-read-only'
+        ? translate('cms.editor.switchToDraftToDiscard')
+        : discardStatus === 'up-to-date'
+            ? translate('cms.editor.discardDraftUpToDateHint')
+            : discardStatus === 'loading'
+                ? translate('common.loading')
+                : undefined;
+    // Reuses the EC-298 restore machinery (the same op the Compare view's
+    // "Restore version" button calls) — never a parallel write path: reverting
+    // the draft IS restoring the published version's snapshot, whole-document.
+    async function handleDiscardDraft() {
+        if (publishedVersionNumber === undefined)
+            return;
+        setDiscardBusy(true);
+        try {
+            const restored = await source.versioning?.restore(ref, publishedVersionNumber, { kind: 'all' });
+            if (restored)
+                replaceDraft(restored);
+            await discardCache.invalidate(discardVersionKey);
+        }
+        finally {
+            setDiscardBusy(false);
+            setDiscardConfirm(false);
+        }
+    }
+    const dirty = useMemo(() => JSON.stringify(draft) !== JSON.stringify(doc), [draft, doc]);
     const schemaIssues = useMemo(() => source.validate(draft), [source, draft]);
     // EC-300/AD-16: composition embeds (hard references) whose target isn't published
     // would render empty on the live site. Surface them as errors in the Issues panel,
@@ -327,29 +385,18 @@ function EditorBody({ projectId, collection, doc, focusPath, }) {
         }
         return viewDoc.values[field.name];
     }
+    // EC-176/EC-318: the present/absent-key write is single-sourced in `setFieldValue`
+    // — a localized field writes `localized[locale]`, clearing (value === undefined)
+    // DELETES the key (reconnecting to base). `fill from base` / `reset to base` below
+    // reuse the same foundation, so typing, filling, and resetting can never diverge.
     function setValue(field, value) {
-        setDraft((d) => {
-            if (isFieldLocalized(collection, field.name)) {
-                const perLocale = { ...(d.localized?.[locale] ?? {}) };
-                if (value === undefined)
-                    delete perLocale[field.name];
-                else
-                    perLocale[field.name] = value;
-                return { ...d, localized: { ...d.localized, [locale]: perLocale } };
-            }
-            const values = { ...d.values };
-            if (value === undefined)
-                delete values[field.name];
-            else
-                values[field.name] = value;
-            return { ...d, values };
-        });
+        setDraft((d) => setFieldValue(collection, d, field.name, locale, value));
     }
     // EC-273: conditional-visibility context — the draft's values for the active
     // locale, against which a field's `hidden(values)` predicate is evaluated. A
     // hidden field's row is omitted (and it is not validated). Recomputed as the
     // draft changes, so a field shows/hides live as the editor types.
-    const conditionValues = { ...draft.values, ...(draft.localized?.[locale] ?? {}) };
+    const conditionValues = activeLocaleValues(draft, locale);
     const isHidden = (field) => isFieldHidden(field, { values: conditionValues });
     // Visible = not content-hidden AND not principal-hidden (EC-240 access === 'hidden').
     const isFieldShown = (field) => !isHidden(field) && accessOf(field) !== 'hidden';
@@ -375,28 +422,32 @@ function EditorBody({ projectId, collection, doc, focusPath, }) {
         const fieldLevelReadOnly = access === 'read';
         const fieldReadOnly = viewReadOnly || fieldLevelReadOnly;
         const localized = isFieldLocalized(collection, field.name);
-        // Fallback visibility (EC-176): the control DISPLAYS the fallback value, and
-        // this marker says so on the exact field.
-        const fallback = localized
-            ? displayedFieldFallback(collection, viewDoc, field.name, locale, source.localeConfig)
+        // EC-318 — connected fields: the per-locale connection state of a localized
+        // field (connected/diverged + fill-from-base), DERIVED from the draft, never
+        // stored. Null for a non-localized field or the base-locale view. Suppressed
+        // while the row is read-only (Published view or a field-level `read` grant) —
+        // there is nothing to connect or diverge there.
+        const connection = localized
+            ? fieldConnection(collection, draft, field.name, locale, source.localeConfig)
             : null;
-        // The variant was created in this editing session (the saved document doesn't
-        // have it yet): editing a fallback-shown value is an explicit translation act.
-        // Moot (and hidden) while viewing the read-only published snapshot.
-        const newlyTranslated = !viewReadOnly &&
-            localized &&
-            hasLocaleVariant(draft, field.name, locale) &&
-            !hasLocaleVariant(doc, field.name, locale);
-        return (_jsxs(Field, { className: cn('rounded-md transition-shadow', highlightedField === field.name && 'bg-primary/5 p-2 ring-2 ring-primary/70'), label: _jsxs(Row, { gap: "2", children: [_jsx("span", { children: fieldLabel(field) }), field.validation?.required ? _jsx("span", { className: "text-destructive", children: "*" }) : null, localized ? _jsx(Badge, { variant: "outline", children: locale }) : null, fallback ? (_jsx(Badge, { variant: "warning", title: fallbackTitle(fallback), "data-testid": `field-fallback-${field.name}`, children: translate('cms.editor.fieldShowingFallback', {
-                            locale: localeChipLabel(fallback.sourceLocale),
-                        }) })) : null, newlyTranslated ? (_jsxs(Badge, { variant: "success", "data-testid": `field-translated-${field.name}`, children: [_jsx(Languages, { className: "size-3" }), ' ', translate('cms.editor.fieldTranslatedTo', { locale: localeChipLabel(locale) })] })) : null, fieldLevelReadOnly ? (_jsxs(Badge, { variant: "outline", children: [_jsx(Lock, { className: "size-3" }), " ", translate('cms.editor.readOnlyBadge')] })) : null, _jsx(Spacer, {})] }), htmlFor: `f-${field.name}`, hint: fallback ? (translate('cms.editor.fieldFallbackHint', {
-                source: localeChipLabel(fallback.sourceLocale),
-                locale: localeChipLabel(locale),
-            })) : (localizedLabel(field.form?.description) || undefined), error: fieldReadOnly ? undefined : errorsByField.get(field.name), children: [_jsx(FieldControl, { id: `f-${field.name}`, field: field, value: getValue(field), onChange: (v) => setValue(field, v), readOnly: fieldReadOnly }), field.name === SLUG_FIELD && routableCollection ? _jsx(PathPreview, { url: draftUrl }) : null] }, field.name));
+        return (_jsx(Field, { className: cn('rounded-md transition-shadow', highlightedField === field.name && 'bg-primary/5 p-2 ring-2 ring-primary/70'), label: _jsxs(Row, { gap: "2", children: [_jsx("span", { children: fieldLabel(field) }), field.validation?.required ? _jsx("span", { className: "text-destructive", children: "*" }) : null, localized ? _jsx(Badge, { variant: "outline", children: locale }) : null, fieldLevelReadOnly ? (_jsxs(Badge, { variant: "outline", children: [_jsx(Lock, { className: "size-3" }), " ", translate('cms.editor.readOnlyBadge')] })) : null, _jsx(Spacer, {}), connection && !fieldReadOnly ? (_jsx(FieldConnectionControl, { connection: connection, fieldName: field.name, locale: locale, onFillFromBase: () => setDraft((d) => fillFieldFromBase(collection, d, field.name, locale, source.localeConfig)), onResetToBase: () => setDraft((d) => resetFieldToBase(collection, d, field.name, locale)) })) : null] }), htmlFor: `f-${field.name}`, hint: localizedLabel(field.form?.description) || undefined, error: fieldReadOnly ? undefined : errorsByField.get(field.name), children: _jsx(FieldControl, { id: `f-${field.name}`, field: field, value: getValue(field), onChange: (v) => setValue(field, v), readOnly: fieldReadOnly }) }, field.name));
     }
     function save() {
         source.save(draft);
     }
+    // EC-316: "Save & close" — the SAME save path as everywhere else in this
+    // header (autosave's debounce, the explicit-save rail's Save button, and the
+    // unmount flush all call this exact `save()`), immediately, then navigate
+    // back to the rail's own list route. Rail-owned (`listPath`, AD-19) so this
+    // never hard-codes the CMS route; falls back to the project index for the
+    // rare rail with no list surface at all (mirrors the delete flow below).
+    function saveAndClose() {
+        save();
+        void navigate({
+            to: STUDIO_PROJECT_ROUTE,
+            params: { projectId, _splat: source.listPath ?? studioPath.index() },
+        });
+    }
     // EC-224: a version restore swaps the working draft for an older snapshot; the
     // open editor adopts it so the form/canvas re-render from the restored content
     // (the operation already persisted it, so it lands clean/non-dirty).
@@ -571,12 +622,10 @@ function EditorBody({ projectId, collection, doc, focusPath, }) {
             localeConfig: source.localeConfig,
         }, collection, published, { siblings: [...publishedDocs.byId.values()], locale });
     }, [publishedDocs, collection, doc.id, locale, source.localeConfig]);
-    // EC-246d: the DRAFT path — derived from the current edit (slug + parent chain),
-    // not the published pool — so the slug field shows the URL forming live, before
-    // the first publish. Read-only: the slug is the single editable source, the path
-    // is always derived (never a second stored field). `undefined` until a slug
-    // resolves a route (a fresh hierarchy page with no slug has no path yet).
-    const draftUrl = useMemo(() => urlForDocument({ routes: resolveDeploymentRoutes(), localeConfig: source.localeConfig }, collection, viewDoc, { siblings: source.documents(), locale }), [collection, viewDoc, locale, source]);
+    // EC-246d/EC-315: the DRAFT composed path moved INTO the slug control itself
+    // (`SlugField`), which derives + decomposes it from the same routes; the editor no
+    // longer computes a separate `draftUrl`. `liveUrl` (published) still gates the
+    // header's "View live" button — the sole open-live, so draft never links out.
     // EC-240: hide the tab bar when there is nothing to navigate — a single content
     // tab with no References/Compare (the users rail). When framework tabs ARE
     // present we KEEP the content tab(s) so there is always a way back to the form;
@@ -620,18 +669,11 @@ function EditorBody({ projectId, collection, doc, focusPath, }) {
                                             ? translate(errorCount === 1
                                                 ? 'cms.editor.fixIssuesToPublish.one'
                                                 : 'cms.editor.fixIssuesToPublish.other', { count: errorCount })
-                                            : undefined, children: publishState === 'pending' ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "animate-spin" }), " ", translate('cms.editor.publishing')] })) : publishState === 'success' ? (_jsxs(_Fragment, { children: [_jsx(CircleCheck, {}), " ", translate('cms.editor.publishedState')] })) : (_jsxs(_Fragment, { children: [_jsx(Eye, {}), " ", translate('cms.editor.publish')] })) })) : null, explicitSave ? (_jsxs(Button, { size: "sm", onClick: save, disabled: !dirty, "data-testid": "doc-save", children: [_jsx(Check, {}), " ", translate('common.save')] })) : null, published || !singleton ? (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", size: "icon-sm", "aria-label": translate('cms.editor.moreActions'), children: _jsx(MoreHorizontal, {}) }) }), _jsxs(DropdownMenuContent, { align: "end", children: [published ? (_jsxs(DropdownMenuItem, { onClick: () => setConfirmAction('unpublish'), children: [_jsx(EyeOff, {}), " ", translate('cms.editor.unpublish')] })) : null, singleton ? null : (_jsxs(DropdownMenuItem, { "data-testid": "doc-delete", className: "text-destructive", onClick: () => setConfirmAction('delete'), children: [_jsx(Trash2, {}), " ", translate('common.delete')] }))] })] })) : null] }), showLensRow ? (_jsxs(Row, { gap: "3", className: "mt-3", wrap: true, children: [_jsxs(Row, { gap: "1", align: "center", children: [showContentTabs ? tabs.map((tab) => renderContentTab(tab)) : null, showReferences ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "mx-1 h-4 w-px bg-border", "aria-hidden": true }), renderContentTab(REFERENCES_TAB)] })) : null, compare ? (_jsxs("span", { className: cn('inline-flex items-center gap-1 rounded-md px-2.5 py-1 text-xs font-medium transition-colors', activeTab === COMPARE_TAB
+                                            : undefined, children: publishState === 'pending' ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "animate-spin" }), " ", translate('cms.editor.publishing')] })) : publishState === 'success' ? (_jsxs(_Fragment, { children: [_jsx(CircleCheck, {}), " ", translate('cms.editor.publishedState')] })) : (_jsxs(_Fragment, { children: [_jsx(Eye, {}), " ", translate('cms.editor.publish')] })) })) : null, explicitSave ? (_jsxs(Button, { size: "sm", onClick: save, disabled: !dirty, "data-testid": "doc-save", children: [_jsx(Check, {}), " ", translate('common.save')] })) : null, !singleton && source.listPath !== undefined ? (_jsxs(Button, { variant: "outline", size: "sm", onClick: saveAndClose, "data-testid": "doc-save-and-close", children: [_jsx(Save, {}), " ", translate('cms.editor.saveAndClose')] })) : null, published || !singleton ? (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", size: "icon-sm", "aria-label": translate('cms.editor.moreActions'), children: _jsx(MoreHorizontal, {}) }) }), _jsxs(DropdownMenuContent, { align: "end", children: [discardStatus !== 'hidden' ? (_jsxs(DropdownMenuItem, { "data-testid": "doc-discard-draft", disabled: discardStatus !== 'ready', title: discardDisabledReason, onClick: () => setDiscardConfirm(true), children: [_jsx(RotateCcw, {}), " ", translate('cms.editor.discardDraft')] })) : null, published ? (_jsxs(DropdownMenuItem, { onClick: () => setConfirmAction('unpublish'), children: [_jsx(EyeOff, {}), " ", translate('cms.editor.unpublish')] })) : null, singleton ? null : (_jsxs(DropdownMenuItem, { "data-testid": "doc-delete", className: "text-destructive", onClick: () => setConfirmAction('delete'), children: [_jsx(Trash2, {}), " ", translate('common.delete')] }))] })] })) : null] }), showLensRow ? (_jsxs(Row, { gap: "3", className: "mt-3", wrap: true, children: [_jsxs(Row, { gap: "1", align: "center", children: [showContentTabs ? tabs.map((tab) => renderContentTab(tab)) : null, showReferences ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "mx-1 h-4 w-px bg-border", "aria-hidden": true }), renderContentTab(REFERENCES_TAB)] })) : null, compare ? (_jsxs("span", { className: cn('inline-flex items-center gap-1 rounded-md px-2.5 py-1 text-xs font-medium transition-colors', activeTab === COMPARE_TAB
                                                 ? 'bg-accent text-accent-foreground'
                                                 : 'text-muted-foreground hover:bg-muted'), children: [_jsxs("button", { type: "button", onClick: () => setActiveTab(COMPARE_TAB), "aria-pressed": activeTab === COMPARE_TAB, className: "inline-flex items-center gap-1", children: [_jsx(GitCompareArrows, { className: "size-3", "aria-hidden": true }), " ", translate('cms.version.compare')] }), _jsx("button", { type: "button", onClick: exitCompare, "aria-label": translate('cms.version.closeCompare'), className: "ml-0.5 rounded p-0.5 hover:bg-background/40", children: _jsx(X, { className: "size-3" }) })] })) : null] }), _jsx(Spacer, {}), canLocales ? _jsx(LocaleSwitcher, {}) : null, canPublish ? (_jsxs(Row, { gap: "px", className: "rounded-md bg-muted/60 p-0.5", children: [_jsx(PerspectiveButton, { label: translate('cms.editor.draftState'), active: perspective === 'draft', onClick: () => setPerspective('draft') }), _jsx(PerspectiveButton, { label: translate('cms.editor.publishedState'), active: perspective === 'published', accent: "info", disabled: !published, title: published ? undefined : translate('cms.editor.publishToViewPublished'), onClick: () => setPerspective('published') })] })) : null] })) : null] }), viewReadOnly ? (_jsxs(Row, { gap: "2", className: "shrink-0 border-b border-info/30 bg-info/10 px-4 py-1.5 text-info sm:px-6", "data-testid": "published-view-banner", children: [_jsx(Lock, { className: "size-3.5 shrink-0", "aria-hidden": true }), _jsx(Text, { size: "xs", className: "text-info", children: translate('cms.editor.publishedReadOnlyBanner') }), _jsx(Spacer, {}), _jsx("button", { type: "button", onClick: () => setPerspective('draft'), className: "text-xs font-medium underline-offset-2 hover:underline", children: translate('cms.editor.switchToDraft') })] })) : null, publishedPending ? (_jsx("div", { className: "grid min-h-0 flex-1 place-items-center p-8", children: _jsx(Text, { size: "sm", tone: "muted", children: publishedSnapshot.status === 'loading'
                             ? translate('cms.editor.loadingPublishedVersion')
-                            : translate('cms.editor.noPublishedVersion') }) })) : activeTab === COMPARE_TAB && compare ? (
-                // EC-298: the version compare view takes over the main area, with the
-                // shared inspector (Versions pane) staying on as the navigator — an
-                // in-app surface, not a modal, so arbitrary versions can be browsed.
-                _jsxs("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: [_jsx("div", { className: "min-h-0 flex-1 overflow-auto", children: _jsx(VersionCompare, {}) }), _jsx(InspectorSidebar, { panes: trailingPanes, activeId: inspectorPaneId, onActiveChange: setInspectorPaneId, className: "w-[320px] shrink-0 border-l border-border" })] })) : canvasField ? (_jsx("div", { className: "min-h-0 flex-1 overflow-hidden", children: _jsx(CompositionFieldEditor, { field: canvasField, value: getValue(canvasField), onChange: (v) => setValue(canvasField, v), readOnly: viewReadOnly || source.isFieldReadOnly(canvasField), trailingPanes: trailingPanes }, `${canvasField.name}:${restoreNonce}:${perspective}`) })) : activeTab === REFERENCES_TAB ? (
-                // EC-269: mounted only while this tab is active → reference data loads on
-                // demand and is torn down on leave (no fetching during normal editing).
-                _jsx("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: _jsx("div", { className: "min-h-0 flex-1 overflow-auto p-4 sm:p-6", children: _jsx("div", { className: "mx-auto w-full max-w-2xl", children: _jsx(ReferencesPanel, { projectId: projectId, source: { type: 'document', id: documentKey(ref) }, target: { type: 'document', id: documentKey(ref) } }) }) }) })) : (_jsxs("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: [_jsx("div", { className: "min-h-0 flex-1 overflow-auto p-4 sm:p-6", children: _jsx("div", { className: "mx-auto w-full max-w-2xl", children: _jsx(Stack, { gap: "6", children: groups.map((group) => {
+                            : translate('cms.editor.noPublishedVersion') }) })) : activeTab === COMPARE_TAB && compare ? (_jsxs("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: [_jsx("div", { className: "min-h-0 flex-1 overflow-auto", children: _jsx(VersionCompare, {}) }), _jsx(InspectorSidebar, { panes: trailingPanes, activeId: inspectorPaneId, onActiveChange: setInspectorPaneId, className: "w-[320px] shrink-0 border-l border-border" })] })) : canvasField ? (_jsx("div", { className: "min-h-0 flex-1 overflow-hidden", children: _jsx(CompositionFieldEditor, { field: canvasField, value: getValue(canvasField), onChange: (v) => setValue(canvasField, v), readOnly: viewReadOnly || source.isFieldReadOnly(canvasField), trailingPanes: trailingPanes }, `${canvasField.name}:${restoreNonce}:${perspective}`) })) : activeTab === REFERENCES_TAB ? (_jsx("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: _jsx("div", { className: "min-h-0 flex-1 overflow-auto p-4 sm:p-6", children: _jsx("div", { className: "mx-auto w-full max-w-2xl", children: _jsx(ReferencesPanel, { projectId: projectId, source: { type: 'document', id: documentKey(ref) }, target: { type: 'document', id: documentKey(ref) } }) }) }) })) : (_jsxs("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: [_jsx("div", { className: "min-h-0 flex-1 overflow-auto p-4 sm:p-6", children: _jsx("div", { className: "mx-auto w-full max-w-2xl", children: _jsx(Stack, { gap: "6", children: groups.map((group) => {
                                         // EC-306: a conditionally/statically hidden group section is skipped
                                         // entirely (its fields are also exempt from validation).
                                         if (hiddenGroups.has(group.name))
@@ -656,7 +698,8 @@ function EditorBody({ projectId, collection, doc, focusPath, }) {
                     }, description: translate('cms.editor.unsavedChangesGuard') })) : null, confirmAction !== null ? (_jsx(ReferenceConfirmDialog, { projectId: projectId, action: confirmAction, targets: confirmTargets, open: true, onOpenChange: (open) => {
                         if (!open)
                             setConfirmAction(null);
-                    }, onConfirm: handleConfirmedAction })) : null, _jsx(Dialog, { open: publishConfirm, onOpenChange: (open) => { if (!open)
+                    }, onConfirm: handleConfirmedAction })) : null, _jsx(Dialog, { open: discardConfirm, onOpenChange: (open) => { if (!open)
+                        setDiscardConfirm(false); }, children: _jsxs(DialogContent, { children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: translate('cms.editor.discardDraftTitle') }), _jsx(DialogDescription, { children: translate('cms.editor.discardDraftDescription') })] }), _jsxs(DialogFooter, { className: "mt-4", children: [_jsx(Button, { variant: "ghost", size: "sm", onClick: () => setDiscardConfirm(false), disabled: discardBusy, children: translate('common.cancel') }), _jsx(Button, { variant: "destructive", size: "sm", "data-testid": "discard-draft-confirm", disabled: discardBusy, onClick: () => void handleDiscardDraft(), children: discardBusy ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "animate-spin" }), " ", translate('cms.editor.discardingDraft')] })) : (_jsxs(_Fragment, { children: [_jsx(RotateCcw, {}), " ", translate('cms.editor.discardDraftConfirm')] })) })] })] }) }), _jsx(Dialog, { open: publishConfirm, onOpenChange: (open) => { if (!open)
                         setPublishConfirm(false); }, children: _jsxs(DialogContent, { children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: translate('cms.editor.publishUnpublishedRefsTitle') }), _jsx(DialogDescription, { children: translate('cms.editor.publishUnpublishedRefsDescription') })] }), _jsxs(Stack, { gap: "1", children: [referenceIssues.map((issue, i) => (_jsxs(Text, { size: "xs", tone: "muted", children: ["\u2022 ", issue.message] }, `${issue.meta?.id ?? i}`))), schemaIssues.length > 0 ? (_jsx(Text, { size: "xs", tone: "muted", className: "mt-1", children: translate(schemaIssues.length === 1
                                             ? 'cms.editor.publishAlsoHasIssues.one'
                                             : 'cms.editor.publishAlsoHasIssues.other', { count: schemaIssues.length }) })) : null] }), _jsxs(DialogFooter, { className: "mt-4", children: [_jsx(Button, { variant: "ghost", size: "sm", onClick: () => setPublishConfirm(false), children: translate('common.cancel') }), _jsx(Button, { size: "sm", "data-testid": "publish-anyway", onClick: () => {
@@ -720,16 +763,6 @@ function PerspectiveButton({ label, active, accent, disabled, title, onClick, })
                 : 'bg-background text-foreground shadow-sm'
             : 'text-muted-foreground hover:text-foreground'), children: label }));
 }
-/**
- * EC-246d: the slug's derived route path, shown read-only directly under the slug
- * input. The slug is the single editable source; the path is composed by the route
- * resolver (`urlForDocument`) from slug + parent chain and never stored. Draft-aware,
- * so it updates as the editor types. Until a slug resolves a route (a fresh
- * hierarchy page), a hint explains where the URL comes from.
- */
-function PathPreview({ url }) {
-    return (_jsxs(Row, { gap: "1", className: "text-xs text-muted-foreground", "data-testid": "slug-path-preview", children: [_jsx(Link2, { className: "size-3 shrink-0", "aria-hidden": true }), url ? (_jsxs(Text, { as: "span", size: "xs", tone: "muted", className: "min-w-0 truncate", title: url.path, children: ["Served at ", _jsx("span", { className: "font-medium text-foreground/80", children: url.path })] })) : (_jsx(Text, { as: "span", size: "xs", tone: "muted", children: translate('cms.editor.slugUrlHint') }))] }));
-}
 /** The implicit fieldset that holds fields with no declared `form.group` (localized via `cms.editor.defaultGroup`). */
 const DEFAULT_FIELD_GROUP = 'fields';
 function groupFields(fields, collection) {