alinea 2.0.0-preview.9 → 2.0.0-rc2

package/dist/dashboard/app/modals/CreateEntry.js

@@ -12,49 +12,57 @@ import "../../../chunks/chunk-CQ52GEHY.js";
 
 // src/dashboard/app/modals/CreateEntry.tsx
 import {
+  Alert,
+  AlertDescription,
   Button,
-  Label,
+  Field,
   Select,
   SelectItem,
+  Text,
   TextField,
-  ToggleButton,
-  ToggleButtonGroup
+  ToggleGroup,
+  ToggleGroupItem,
+  useDialog
 } from "alinea/components";
 import { getType } from "alinea/core/Internal";
 import { Reference } from "alinea/core/Reference";
 import { Schema } from "alinea/core/Schema";
 import { Type, type as createType } from "alinea/core/Type";
-import { createEntryAtom } from "alinea/dashboard/atoms/create";
-import { configAtom } from "alinea/dashboard/atoms/core";
-import { ReactiveNode } from "alinea/dashboard/atoms/ReactiveNode";
-import { policyAtom } from "alinea/dashboard/atoms/user";
-import { useDashboardContext } from "alinea/dashboard/hooks";
+import { createEntryAtom } from "../../atoms/create.js";
+import { configAtom } from "../../atoms/core.js";
+import { ReactiveNode } from "../../atoms/ReactiveNode.js";
+import { policyAtom } from "../../atoms/user.js";
+import { useDashboardContext } from "../../hooks.js";
 import { entry as entryField } from "alinea/field/link";
 import { EntryReference } from "alinea/picker/entry/EntryReference";
 import {
   Suspense,
+  useId,
   useMemo,
   useState
 } from "react";
-import { IcRoundFirstPage, IcRoundLastPage } from "../../icons.js";
-import { NodeEditor } from "../EntryFields.js";
+import {
+  IcBaselineErrorOutline,
+  IcRoundFirstPage,
+  IcRoundLastPage
+} from "../../icons.js";
+import { NodeEditor } from "../NodeEditor.js";
 import {
   DashboardModalContent,
   DashboardModalDialog,
-  DashboardModalFooter,
-  useDashboardModal
+  DashboardModalFooter
 } from "../ui/DashboardModal.js";
 
 // src/dashboard/app/modals/CreateEntry.module.css
 var CreateEntry_default = {
-  "CreateEntry-message": "alinea-CreateEntry-message",
-  "CreateEntryMessage": "alinea-CreateEntry-message",
   "CreateEntry-parentRow": "alinea-CreateEntry-parentRow",
   "CreateEntryParentRow": "alinea-CreateEntry-parentRow",
-  "CreateEntry-insertOrder": "alinea-CreateEntry-insertOrder",
-  "CreateEntryInsertOrder": "alinea-CreateEntry-insertOrder",
   "CreateEntry-parentField": "alinea-CreateEntry-parentField",
-  "CreateEntryParentField": "alinea-CreateEntry-parentField"
+  "CreateEntryParentField": "alinea-CreateEntry-parentField",
+  "CreateEntry-insertOrder-toggle": "alinea-CreateEntry-insertOrder-toggle",
+  "CreateEntryInsertOrderToggle": "alinea-CreateEntry-insertOrder-toggle",
+  "CreateEntry-insertOrder": "alinea-CreateEntry-insertOrder",
+  "CreateEntryInsertOrder": "alinea-CreateEntry-insertOrder"
 };
 
 // src/dashboard/app/modals/CreateEntry.tsx
@@ -89,17 +97,10 @@ function createLinkEditor(key, field, initialValue) {
   };
 }
 function CreateEntryLoading() {
-  return /* @__PURE__ */ jsx(
-    DashboardModalDialog,
-    {
-      "aria-label": "Create entry",
-      variant: "explorer",
-      isLoading: true
-    }
-  );
+  return /* @__PURE__ */ jsx(DashboardModalDialog, { variant: "explorer", isLoading: true });
 }
 function CreateEntryForm() {
-  const modal = useDashboardModal();
+  const modal = useDialog();
   const { page, root } = useDashboardContext();
   const createEntry = useSetAtom(createEntryAtom);
   const config = useAtomValueRaw(configAtom).schema;
@@ -117,6 +118,8 @@ function CreateEntryForm() {
   const [selectedTypeOverride, setSelectedType] = useState(null);
   const [insertOrder, setInsertOrder] = useState("last");
   const [isCreating, setIsCreating] = useState(false);
+  const [error, setError] = useState();
+  const formId = useId();
   const containerTypes = useMemo(
     () => Object.entries(config).filter(([, type]) => Type.isContainer(type) && !Type.isHidden(type)).map(([name]) => name),
     [config]
@@ -174,6 +177,7 @@ function CreateEntryForm() {
     const nextTitle = title.trim();
     if (isCreating || !selectedType || !nextTitle) return;
     setIsCreating(true);
+    setError(void 0);
     try {
       await createEntry({
         workspace: root.workspace,
@@ -186,94 +190,82 @@ function CreateEntryForm() {
         insertOrder: showInsertOrder ? insertOrder : void 0
       });
       modal.close();
+    } catch (cause) {
+      setError(cause instanceof Error ? cause.message : String(cause));
     } finally {
       setIsCreating(false);
     }
   }
   const canCreate = Boolean(selectedType && title.trim());
-  return /* @__PURE__ */ jsxs(
-    DashboardModalDialog,
-    {
-      "aria-label": "Create entry",
-      variant: "explorer",
-      label: "Create entry",
-      children: [
-        /* @__PURE__ */ jsx("form", { onSubmit, id: "submit", children: /* @__PURE__ */ jsxs(DashboardModalContent, { children: [
-          /* @__PURE__ */ jsx(
-            TextField,
-            {
-              autoFocus: true,
-              value: title,
-              onChange: setTitle,
-              label: "Title",
-              isRequired: true
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            Select,
-            {
-              label: "Type",
-              selectedKey: selectedType,
-              onSelectionChange: (key) => {
-                setSelectedType(key ? String(key) : null);
-              },
-              isRequired: true,
-              children: typeOptions.map((option) => /* @__PURE__ */ jsx(SelectItem, { id: option.id, children: option.label }, option.id))
-            }
-          ),
-          typeOptions.length === 0 && /* @__PURE__ */ jsx("p", { className: styles.CreateEntry.message(), children: "No entry types are available at this location." }),
-          /* @__PURE__ */ jsxs("div", { className: styles.CreateEntry.parentRow(), children: [
-            /* @__PURE__ */ jsx("div", { className: styles.CreateEntry.parentField(), children: /* @__PURE__ */ jsx(NodeEditor, { node: parent.node, type: parent.type }) }),
-            showInsertOrder && /* @__PURE__ */ jsx(
-              Label,
+  return /* @__PURE__ */ jsxs(DashboardModalDialog, { variant: "explorer", label: "Create entry", children: [
+    /* @__PURE__ */ jsx("form", { onSubmit, id: formId, children: /* @__PURE__ */ jsxs(DashboardModalContent, { children: [
+      /* @__PURE__ */ jsx(
+        TextField,
+        {
+          autoFocus: true,
+          value: title,
+          onValueChange: setTitle,
+          label: "Title",
+          required: true
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Select,
+        {
+          label: "Type",
+          value: selectedType,
+          onValueChange: setSelectedType,
+          required: true,
+          children: typeOptions.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.id, children: option.label }, option.id))
+        }
+      ),
+      typeOptions.length === 0 && /* @__PURE__ */ jsx(Text, { as: "p", color: "muted", children: "No entry types are available at this location." }),
+      /* @__PURE__ */ jsxs("div", { className: styles.CreateEntry.parentRow(), children: [
+        /* @__PURE__ */ jsx("div", { className: styles.CreateEntry.parentField(), children: /* @__PURE__ */ jsx(NodeEditor, { node: parent.node, type: parent.type }) }),
+        showInsertOrder && /* @__PURE__ */ jsx(
+          Field,
+          {
+            label: "Insert",
+            className: styles.CreateEntry.insertOrder(),
+            children: /* @__PURE__ */ jsxs(
+              ToggleGroup,
               {
-                label: "Insert",
-                className: styles.CreateEntry.insertOrder(),
-                children: /* @__PURE__ */ jsxs(
-                  ToggleButtonGroup,
-                  {
-                    "aria-label": "Insert",
-                    selectionMode: "single",
-                    disallowEmptySelection: true,
-                    selectedKeys: [insertOrder],
-                    onSelectionChange: (key) => {
-                      if (key.has("first")) setInsertOrder("first");
-                      else if (key.has("last")) setInsertOrder("last");
-                    },
-                    children: [
-                      /* @__PURE__ */ jsxs(ToggleButton, { id: "first", children: [
-                        /* @__PURE__ */ jsx(IcRoundFirstPage, { "data-slot": "icon" }),
-                        " First"
-                      ] }),
-                      /* @__PURE__ */ jsxs(ToggleButton, { id: "last", children: [
-                        /* @__PURE__ */ jsx(IcRoundLastPage, { "data-slot": "icon" }),
-                        " Last"
-                      ] })
-                    ]
-                  }
-                )
+                type: "single",
+                variant: "outline",
+                "aria-label": "Insert",
+                className: styles.CreateEntry.insertOrder.toggle(),
+                value: insertOrder,
+                onValueChange: (value) => {
+                  if (value === "first" || value === "last")
+                    setInsertOrder(value);
+                },
+                children: [
+                  /* @__PURE__ */ jsx(ToggleGroupItem, { value: "first", icon: IcRoundFirstPage, children: "First" }),
+                  /* @__PURE__ */ jsx(ToggleGroupItem, { value: "last", icon: IcRoundLastPage, children: "Last" })
+                ]
               }
             )
-          ] }),
-          /* @__PURE__ */ jsx(NodeEditor, { node: copyFrom.node, type: copyFrom.type })
-        ] }) }),
-        /* @__PURE__ */ jsxs(DashboardModalFooter, { children: [
-          /* @__PURE__ */ jsx(Button, { type: "button", appearance: "outline", onPress: modal.close, children: "Cancel" }),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              type: "submit",
-              form: "submit",
-              intent: "primary",
-              isDisabled: !canCreate,
-              isPending: isCreating,
-              children: "Create entry"
-            }
-          )
-        ] })
-      ]
-    }
-  );
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(NodeEditor, { node: copyFrom.node, type: copyFrom.type }),
+      error && /* @__PURE__ */ jsx(Alert, { variant: "destructive", icon: IcBaselineErrorOutline, children: /* @__PURE__ */ jsx(AlertDescription, { children: error }) })
+    ] }) }),
+    /* @__PURE__ */ jsxs(DashboardModalFooter, { children: [
+      /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", onClick: modal.close, children: "Cancel" }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "submit",
+          form: formId,
+          color: "primary",
+          disabled: !canCreate,
+          loading: isCreating,
+          children: "Create entry"
+        }
+      )
+    ] })
+  ] });
 }
 function CreateEntry() {
   return /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx(CreateEntryLoading, {}), children: /* @__PURE__ */ jsx(CreateEntryForm, {}) });

package/dist/dashboard/app/pages/EntryPage.d.ts

@@ -1,5 +1,6 @@
 import { Page } from 'alinea/dashboard/atoms/nav';
-export declare const entryPage: (page: Page, get: import("jotai").Getter) => import("react").ReactNode | Promise<import("react").ReactNode>;
+import { type ReactNode } from 'react';
+export declare const entryPage: (page: Page, get: import("jotai").Getter) => ReactNode | Promise<ReactNode>;
 export interface NotFoundPanelProps {
     title: string;
     message: string;

package/dist/dashboard/app/pages/EntryPage.js

@@ -10,12 +10,27 @@ import {
 import "../../../chunks/chunk-CQ52GEHY.js";
 
 // src/dashboard/app/pages/EntryPage.tsx
-import { Button, Icon, Surface, Tooltip } from "alinea/components";
-import { MediaFile, MediaLibrary } from "alinea/core/media/MediaTypes";
+import {
+  Button,
+  Code,
+  Empty,
+  EmptyContent,
+  EmptyDescription,
+  EmptyHeader,
+  EmptyMedia,
+  EmptyTitle,
+  Icon,
+  Page as PageLayout,
+  PageContent,
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger
+} from "alinea/components";
+import { isFileType, isMediaLibrary } from "alinea/core/media/MediaTypes";
 import { assert } from "alinea/core/util/Assert";
 import { typeAtoms } from "alinea/dashboard/atoms/config";
 import { configAtom } from "alinea/dashboard/atoms/core";
-import { entrySidebarOpenAtom } from "alinea/dashboard/atoms/dashboard";
+import { entrySidebarOpen } from "alinea/dashboard/atoms/dashboard";
 import {
   entryAtoms,
   MissingEntryError
@@ -39,7 +54,9 @@ import {
 } from "../../icons.js";
 import { FileEditor } from "./../editor/FileEditor.js";
 import { CreateEntryButton } from "./../DashboardLayout.js";
-import { EntryFields, NodeEditor } from "./../EntryFields.js";
+import { EntryFields } from "./../EntryFields.js";
+import { NodeEditor } from "./../NodeEditor.js";
+import { entryForm } from "../EntryForm.js";
 import { EntryHeader } from "./../EntryHeader.js";
 import { entryDirtyActions } from "./../EntryHeaderActions.js";
 import {
@@ -49,43 +66,42 @@ import {
 import { EntryTranslationBanner } from "./../EntryTranslationBanner.js";
 import { Explorer } from "./../Explorer.js";
 import { SidebarLayout } from "../SidebarLayout.js";
+import {
+  BlockSheetProvider,
+  BlockSheetSlot,
+  useBlockSheetOpen
+} from "../BlockSheet.js";
 import {
   DashboardModal,
   DashboardModalContent,
   DashboardModalDialog,
   DashboardModalFooter
 } from "./../ui/DashboardModal.js";
-import { Rail, RailBody, RailContent } from "./../ui/Rail.js";
 
 // src/dashboard/app/pages/EntryPage.module.css
 var EntryPage_default = {
-  "MissingEntry-icon": "alinea-MissingEntry-icon",
-  "MissingEntryIcon": "alinea-MissingEntry-icon",
+  "EntryOverview-mobileActions": "alinea-EntryOverview-mobileActions",
+  "EntryOverviewMobileActions": "alinea-EntryOverview-mobileActions",
+  "EntryEditorLayout-sidebar": "alinea-EntryEditorLayout-sidebar",
+  "EntryEditorLayoutSidebar": "alinea-EntryEditorLayout-sidebar",
+  "EntryEditor-banner": "alinea-EntryEditor-banner",
+  "EntryEditorBanner": "alinea-EntryEditor-banner",
   "MissingEntry": "alinea-MissingEntry",
-  "EntryEditor-body": "alinea-EntryEditor-body",
-  "EntryEditorBody": "alinea-EntryEditor-body",
   "EntryEditorContent-navigationActions": "alinea-EntryEditorContent-navigationActions",
   "EntryEditorContentNavigationActions": "alinea-EntryEditorContent-navigationActions",
+  "MissingEntry-media": "alinea-MissingEntry-media",
+  "MissingEntryMedia": "alinea-MissingEntry-media",
   "EntryEditor-fields": "alinea-EntryEditor-fields",
   "EntryEditorFields": "alinea-EntryEditor-fields",
-  "EntryEditor-header": "alinea-EntryEditor-header",
-  "EntryEditorHeader": "alinea-EntryEditor-header",
-  "MissingEntry-card": "alinea-MissingEntry-card",
-  "MissingEntryCard": "alinea-MissingEntry-card",
-  "EntryEditor-banner": "alinea-EntryEditor-banner",
-  "EntryEditorBanner": "alinea-EntryEditor-banner",
-  "MissingEntry-title": "alinea-MissingEntry-title",
-  "MissingEntryTitle": "alinea-MissingEntry-title",
-  "MissingEntry-id": "alinea-MissingEntry-id",
-  "MissingEntryId": "alinea-MissingEntry-id",
-  "EntryEditor-title": "alinea-EntryEditor-title",
-  "EntryEditorTitle": "alinea-EntryEditor-title",
-  "MissingEntry-message": "alinea-MissingEntry-message",
-  "MissingEntryMessage": "alinea-MissingEntry-message",
+  "EntryEditor-viewBanner": "alinea-EntryEditor-viewBanner",
+  "EntryEditorViewBanner": "alinea-EntryEditor-viewBanner",
   "EntryEditor-toolbar": "alinea-EntryEditor-toolbar",
   "EntryEditorToolbar": "alinea-EntryEditor-toolbar",
-  "EntryOverview-mobileActions": "alinea-EntryOverview-mobileActions",
-  "EntryOverviewMobileActions": "alinea-EntryOverview-mobileActions"
+  "EntryEditor-body": "alinea-EntryEditor-body",
+  "EntryEditorBody": "alinea-EntryEditor-body",
+  "EntryEditor-view": "alinea-EntryEditor-view",
+  "EntryEditorView": "alinea-EntryEditor-view",
+  "EntryEditor": "alinea-EntryEditor"
 };
 
 // src/dashboard/app/pages/EntryPage.tsx
@@ -115,10 +131,10 @@ var entryPage = page(async (page2, get) => {
     }
     const selectedNode = await get(localeData.selectedNode);
     const richTextImages = await get(localeData.richTextImages);
-    const parentNeedsTranslation = type.customView ? false : await get(localeData.parentNeedsTranslation);
+    const parentNeedsTranslation = await get(localeData.parentNeedsTranslation);
     const sourceLocale = get(localeData.translationSourceLocale);
     const copyTranslationSource = get(localeData.copyTranslationSource);
-    const isSidebarOpen = get(entrySidebarOpenAtom);
+    const isSidebarOpen = get(entrySidebarOpen(Boolean(get(entry.preview))));
     const sidebar = await entrySidebar(get, entry, localeData, isSidebarOpen);
     return /* @__PURE__ */ jsx(
       EntryEditorContent,
@@ -169,17 +185,18 @@ function NotFoundPanel({
   actionLabel,
   onAction
 }) {
-  return /* @__PURE__ */ jsx(Rail, { main: true, children: /* @__PURE__ */ jsx(RailBody, { className: styles.MissingEntry(), children: /* @__PURE__ */ jsxs(Surface, { className: styles.MissingEntry.card(), children: [
-    /* @__PURE__ */ jsx("div", { className: styles.MissingEntry.icon(), children: /* @__PURE__ */ jsx(Icon, { icon: IcBaselineErrorOutline }) }),
-    /* @__PURE__ */ jsx("h1", { className: styles.MissingEntry.title(), children: title }),
-    /* @__PURE__ */ jsx("p", { className: styles.MissingEntry.message(), children: message }),
-    /* @__PURE__ */ jsxs("p", { className: styles.MissingEntry.message(), children: [
-      requestedLabel,
-      ":",
-      " ",
-      /* @__PURE__ */ jsx("code", { className: styles.MissingEntry.id(), children: requestedValue })
+  return /* @__PURE__ */ jsx(PageLayout, { children: /* @__PURE__ */ jsx(PageContent, { className: styles.MissingEntry(), children: /* @__PURE__ */ jsxs(Empty, { variant: "card", children: [
+    /* @__PURE__ */ jsxs(EmptyHeader, { children: [
+      /* @__PURE__ */ jsx(EmptyMedia, { variant: "icon", className: styles.MissingEntry.media(), children: /* @__PURE__ */ jsx(Icon, { icon: IcBaselineErrorOutline }) }),
+      /* @__PURE__ */ jsx(EmptyTitle, { as: "h1", children: title }),
+      /* @__PURE__ */ jsx(EmptyDescription, { children: message }),
+      /* @__PURE__ */ jsxs(EmptyDescription, { children: [
+        requestedLabel,
+        ": ",
+        /* @__PURE__ */ jsx(Code, { children: requestedValue })
+      ] })
     ] }),
-    onAction && actionLabel && /* @__PURE__ */ jsx(Button, { onPress: onAction, children: actionLabel })
+    onAction && actionLabel && /* @__PURE__ */ jsx(EmptyContent, { children: /* @__PURE__ */ jsx(Button, { onClick: onAction, children: actionLabel }) })
   ] }) }) });
 }
 function EntryViewToggle({ entry, page: page2 }) {
@@ -190,22 +207,25 @@ function EntryViewToggle({ entry, page: page2 }) {
   const label = nextView === "overview" ? "Show overview" : "Edit entry";
   const tooltip = nextView === "overview" ? "Overview view" : "Edit view";
   const ViewIcon = nextView === "overview" ? IcOutlineViewList : IcRoundEdit;
-  return /* @__PURE__ */ jsx(Tooltip, { delay: 300, tooltip, children: /* @__PURE__ */ jsx(
-    Button,
-    {
-      "aria-label": label,
-      appearance: "plain",
-      icon: ViewIcon,
-      size: "icon",
-      onPress: () => setRoute({
-        workspace: page2.workspace,
-        root: page2.root,
-        entry: page2.entry,
-        locale: page2.locale ?? void 0,
-        view: nextView
-      })
-    }
-  ) });
+  return /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 300, children: [
+    /* @__PURE__ */ jsx(
+      TooltipTrigger,
+      {
+        "aria-label": label,
+        variant: "ghost",
+        icon: ViewIcon,
+        size: "icon",
+        onClick: () => setRoute({
+          workspace: page2.workspace,
+          root: page2.root,
+          entry: page2.entry,
+          locale: page2.locale ?? void 0,
+          view: nextView
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(TooltipContent, { children: tooltip })
+  ] });
 }
 function EntryOverview({
   entry,
@@ -217,7 +237,7 @@ function EntryOverview({
   const setRoute = useSetAtom(routeAtom);
   const policy = useAtomValueRaw(policyAtom);
   const parentId = selectedEntry.parentId;
-  return /* @__PURE__ */ jsx(Rail, { main: true, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(PageLayout, { children: /* @__PURE__ */ jsx(
     Explorer,
     {
       controls: /* @__PURE__ */ jsx("div", { className: styles.EntryOverview.mobileActions(), children: /* @__PURE__ */ jsx(CreateEntryButton, { root, toolbar: true }) }),
@@ -270,14 +290,17 @@ function EntryEditorContent({
   const setSourceLocale = useSetAtom(localeData.translationSourceLocale);
   const saveDraft = useSetAtom(localeData.saveDraft);
   const publishEdits = useSetAtom(localeData.publishEdits);
+  const hasErrors = useAtomValueRaw(localeData.hasErrors(node));
   const reset = useSetAtom(node.reset);
   const [routeBlock, setRouteBlock] = useAtom(routeBlockAtom);
   const setRouteGuard = useSetAtom(routeGuardAtom);
-  const setSidebarOpen = useSetAtom(entrySidebarOpenAtom);
+  const setSidebarOpen = useSetAtom(
+    entrySidebarOpen(Boolean(useAtomValueRaw(entry.preview)))
+  );
   const editorBodyRef = useRef(null);
-  const isMediaFile = type.type === MediaFile;
-  const isMediaLibrary = type.type === MediaLibrary;
-  const isMedia = isMediaFile || isMediaLibrary;
+  const isMediaFile = isFileType(type.type);
+  const isFolder = isMediaLibrary(type.type);
+  const isMedia = isMediaFile || isFolder;
   const activeVersion = Array.from(versions.values()).find(
     (version) => version.active
   );
@@ -309,22 +332,31 @@ function EntryEditorContent({
   useLayoutEffect(() => {
     if (editorBodyRef.current) editorBodyRef.current.scrollTop = 0;
   }, [entry.id]);
-  let editorBody = /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(RailBody, { ref: editorBodyRef, className: styles.EntryEditor.body(), children: /* @__PURE__ */ jsxs(RailContent, { className: styles.EntryEditor.fields(), children: [
-    isUntranslated && /* @__PURE__ */ jsx("div", { className: styles.EntryEditor.banner(), children: /* @__PURE__ */ jsx(
-      EntryTranslationBanner,
-      {
-        copyFromSource: copyTranslationSource,
-        parentNeedsTranslation,
-        sourceLocale,
-        sourceLocales,
-        onCopyFromSourceChange: setCopyTranslationSource,
-        onSourceLocaleChange: setSourceLocale
-      }
-    ) }),
-    /* @__PURE__ */ jsx(NodeEditor, { node, type: type.type, children: /* @__PURE__ */ jsx(EntryFields, {}) })
-  ] }) }) });
+  const translationBanner = isUntranslated && /* @__PURE__ */ jsx(
+    EntryTranslationBanner,
+    {
+      copyFromSource: copyTranslationSource,
+      parentNeedsTranslation,
+      sourceLocale,
+      sourceLocales,
+      onCopyFromSourceChange: setCopyTranslationSource,
+      onSourceLocaleChange: setSourceLocale
+    }
+  );
+  let editorBody = /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
+    PageContent,
+    {
+      ref: editorBodyRef,
+      contained: true,
+      className: styles.EntryEditor.body(),
+      children: /* @__PURE__ */ jsxs("div", { className: styles.EntryEditor.fields(), children: [
+        translationBanner && /* @__PURE__ */ jsx("div", { className: styles.EntryEditor.banner(), children: translationBanner }),
+        /* @__PURE__ */ jsx(NodeEditor, { node, type: entryForm(type.type), children: /* @__PURE__ */ jsx(EntryFields, {}) })
+      ] })
+    }
+  ) });
   if (isMediaFile) {
-    editorBody = /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(RailBody, { ref: editorBodyRef, className: styles.EntryEditor.body(), children: /* @__PURE__ */ jsx(NodeEditor, { node, type: type.type, children: /* @__PURE__ */ jsx(
+    editorBody = /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(PageContent, { ref: editorBodyRef, className: styles.EntryEditor.body(), children: /* @__PURE__ */ jsx(NodeEditor, { node, type: type.type, children: /* @__PURE__ */ jsx(
       FileEditor,
       {
         parentPaths,
@@ -333,18 +365,12 @@ function EntryEditorContent({
     ) }) }) });
   }
   if (View) {
-    return /* @__PURE__ */ jsx(
-      EntryScope,
-      {
-        entry,
-        localeData,
-        richTextImages,
-        selectedEntry,
-        children: /* @__PURE__ */ jsx(View, { type: type.type })
-      }
-    );
+    editorBody = /* @__PURE__ */ jsxs(Fragment, { children: [
+      translationBanner && /* @__PURE__ */ jsx("div", { className: styles.EntryEditor.viewBanner(), children: translationBanner }),
+      /* @__PURE__ */ jsx(PageContent, { ref: editorBodyRef, className: styles.EntryEditor.view(), children: /* @__PURE__ */ jsx(NodeEditor, { node, type: entryForm(type.type), children: /* @__PURE__ */ jsx(View, { type: type.type }) }) })
+    ] });
   }
-  const mainEditor = /* @__PURE__ */ jsxs(Rail, { main: true, children: [
+  const mainEditor = /* @__PURE__ */ jsxs(PageLayout, { className: styles.EntryEditor(), children: [
     /* @__PURE__ */ jsx(
       EntryHeader,
       {
@@ -365,27 +391,30 @@ function EntryEditorContent({
     /* @__PURE__ */ jsx(
       DashboardModal,
       {
-        isOpen: Boolean(routeBlock),
+        open: Boolean(routeBlock),
         onOpenChange: (open) => !open && setRouteBlock(null),
         children: routeBlock && /* @__PURE__ */ jsxs(DashboardModalDialog, { label: "Confirm navigation", children: [
-          /* @__PURE__ */ jsx(DashboardModalContent, { children: "This entry has unsaved changes" }),
+          /* @__PURE__ */ jsxs(DashboardModalContent, { children: [
+            "This entry has unsaved changes",
+            dirtyActions.publish && hasErrors ? ", and some fields are invalid" : ""
+          ] }),
           /* @__PURE__ */ jsxs(DashboardModalFooter, { children: [
-            /* @__PURE__ */ jsx(Button, { onPress: discardAndConfirm, appearance: "plain", children: "Discard my changes" }),
+            /* @__PURE__ */ jsx(Button, { onClick: discardAndConfirm, variant: "ghost", children: "Discard my changes" }),
             /* @__PURE__ */ jsxs("div", { className: styles.EntryEditorContent.navigationActions(), children: [
               dirtyActions.publish && /* @__PURE__ */ jsx(
                 Button,
                 {
-                  onPress: publishAndConfirm,
-                  intent: canSaveDraft ? "secondary" : "primary",
+                  onClick: publishAndConfirm,
+                  color: canSaveDraft ? "secondary" : "primary",
                   icon: IcRoundCheck,
-                  children: "Publish"
+                  children: hasErrors ? "Publish anyway" : "Publish"
                 }
               ),
               dirtyActions.saveDraft && /* @__PURE__ */ jsx(
                 Button,
                 {
-                  onPress: saveDraftAndConfirm,
-                  intent: "primary",
+                  onClick: saveDraftAndConfirm,
+                  color: "primary",
                   icon: IcRoundSave,
                   children: "Save as draft"
                 }
@@ -402,19 +431,32 @@ function EntryEditorContent({
         localeData,
         richTextImages,
         selectedEntry,
-        children: /* @__PURE__ */ jsx(
-          SidebarLayout,
+        children: /* @__PURE__ */ jsx(BlockSheetProvider, { children: /* @__PURE__ */ jsx(
+          EntryEditorLayout,
           {
-            side: "right",
-            visible: Boolean(sidebar && isSidebarOpen),
             sidebar: sidebar && isSidebarOpen && /* @__PURE__ */ jsx(EntrySidebar, { ...sidebar, onOpenChange: setSidebarOpen }),
             children: mainEditor
           }
-        )
+        ) })
       }
     )
   ] });
 }
+function EntryEditorLayout({ sidebar, children }) {
+  const sheetOpen = useBlockSheetOpen();
+  return /* @__PURE__ */ jsx(
+    SidebarLayout,
+    {
+      side: "right",
+      visible: Boolean(sidebar) || sheetOpen,
+      sidebar: /* @__PURE__ */ jsxs("div", { className: styles.EntryEditorLayout.sidebar(), children: [
+        sidebar,
+        /* @__PURE__ */ jsx(BlockSheetSlot, {})
+      ] }),
+      children
+    }
+  );
+}
 export {
   NotFoundPanel,
   entryPage