@drawnagency/primitives 0.1.84 → 0.1.87

package/dist/media/index.js

@@ -12,11 +12,12 @@ import {
   hashFileBuffer,
   mimeToExt,
   rebindImageRef,
+  resolveLogo,
   resolveManifestReferences,
   resolveMedia,
   sanitizeMediaName,
   setMediaProvider
-} from "../chunk-YKOLOZB2.js";
+} from "../chunk-DRCPDOW3.js";
 import "../chunk-YBVK254P.js";
 import {
   ImageManifestSchema,
@@ -24,7 +25,7 @@ import {
   MediaFolderSchema,
   MediaItemSchema,
   VariantSchema
-} from "../chunk-E3MTIMOG.js";
+} from "../chunk-XPUBUR64.js";
 import "../chunk-FM4M4Q2W.js";
 import "../chunk-JSBRDJBE.js";
 export {
@@ -46,6 +47,7 @@ export {
   hashFileBuffer,
   mimeToExt,
   rebindImageRef,
+  resolveLogo,
   resolveManifestReferences,
   resolveMedia,
   sanitizeMediaName,

package/dist/media/resolve.d.ts

@@ -26,4 +26,29 @@ export declare const BAKED_MEDIA_KEYS: readonly ["src", "srcset", "alt", "width"
 export declare function rebindImageRef<T extends {
     imageId?: string;
 }>(ref: T, imageId: string): T;
+export interface ResolvedLogo {
+    lightUrl: string;
+    darkUrl: string | null;
+    invertInDark: boolean;
+    showInNav: boolean;
+}
+/**
+ * Resolves a SiteConfig["logo"] entry into concrete URLs. Returns null when
+ * there is no logo configured, when the light variant's imageId can't be
+ * resolved against the manifest, or when the light variant resolves to a
+ * video (an `<img>` can't render mp4/webm) — callers should fall back to
+ * rendering the site name as text rather than a broken image. Still-image and
+ * animated (gif) picks are both fine — only a video pick is rejected, since
+ * both those tags resolve to `tag: "img"`.
+ */
+export declare function resolveLogo(logo: {
+    light: {
+        imageId: string;
+    };
+    dark: {
+        imageId: string;
+    } | null;
+    invertInDark: boolean;
+    showInNav: boolean;
+} | null, manifest: MediaManifest, provider: MediaProvider): ResolvedLogo | null;
 //# sourceMappingURL=resolve.d.ts.map

package/dist/media/resolve.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"resolve.d.ts","sourceRoot":"","sources":["../../src/media/resolve.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAEhD,wBAAgB,YAAY,CAC1B,IAAI,EAAE;IAAE,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,MAAM,CAAA;CAAE,EACxC,QAAQ,EAAE,aAAa,EACvB,KAAK,EAAE,MAAM,EAAE,EACf,QAAQ,EAAE,aAAa,GACtB,aAAa,GAAG,IAAI,CAKtB;AAED;;;;;;GAMG;AACH,wBAAgB,yBAAyB,CACvC,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,aAAa,EACvB,KAAK,EAAE,MAAM,EAAE,EACf,QAAQ,EAAE,aAAa,GACtB,OAAO,CA0CT;AAED;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,gEAAiE,CAAC;AAE/F;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,CAAC,SAAS;IAAE,OAAO,CAAC,EAAE,MAAM,CAAA;CAAE,EAAE,GAAG,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,GAAG,CAAC,CAIzF"}
+{"version":3,"file":"resolve.d.ts","sourceRoot":"","sources":["../../src/media/resolve.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAEhD,wBAAgB,YAAY,CAC1B,IAAI,EAAE;IAAE,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,MAAM,CAAA;CAAE,EACxC,QAAQ,EAAE,aAAa,EACvB,KAAK,EAAE,MAAM,EAAE,EACf,QAAQ,EAAE,aAAa,GACtB,aAAa,GAAG,IAAI,CAKtB;AAED;;;;;;GAMG;AACH,wBAAgB,yBAAyB,CACvC,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,aAAa,EACvB,KAAK,EAAE,MAAM,EAAE,EACf,QAAQ,EAAE,aAAa,GACtB,OAAO,CA0CT;AAED;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,gEAAiE,CAAC;AAE/F;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,CAAC,SAAS;IAAE,OAAO,CAAC,EAAE,MAAM,CAAA;CAAE,EAAE,GAAG,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,GAAG,CAAC,CAIzF;AAED,MAAM,WAAW,YAAY;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;GAQG;AACH,wBAAgB,WAAW,CACzB,IAAI,EAAE;IAAE,KAAK,EAAE;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAAC,IAAI,EAAE;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAAC,YAAY,EAAE,OAAO,CAAC;IAAC,SAAS,EAAE,OAAO,CAAA;CAAE,GAAG,IAAI,EACxH,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,aAAa,GACtB,YAAY,GAAG,IAAI,CAYrB"}

package/dist/schemas/index.js

@@ -3,7 +3,7 @@ import {
   AudienceNameSchema,
   MediaGridOptionsSchema,
   slugifyAudienceName
-} from "../chunk-EP3LVOXZ.js";
+} from "../chunk-WA3HFN54.js";
 import {
   AudienceSchema,
   RoleSchema,
@@ -40,7 +40,7 @@ import {
   TextLineSchema,
   VariantSchema,
   normalizeSiteIndex
-} from "../chunk-E3MTIMOG.js";
+} from "../chunk-XPUBUR64.js";
 import "../chunk-VKAGMEKE.js";
 import "../chunk-FM4M4Q2W.js";
 import "../chunk-NSCT3AMV.js";

package/dist/schemas/site-config.d.ts

@@ -456,6 +456,16 @@ export declare const SiteConfigSchema: z.ZodObject<{
     uppercaseNavHeadings: z.ZodDefault<z.ZodBoolean>;
     googleFontsUrl: z.ZodDefault<z.ZodNullable<z.ZodString>>;
     favicon: z.ZodDefault<z.ZodNullable<z.ZodString>>;
+    logo: z.ZodDefault<z.ZodNullable<z.ZodObject<{
+        light: z.ZodObject<{
+            imageId: z.ZodString;
+        }, z.core.$strip>;
+        dark: z.ZodDefault<z.ZodNullable<z.ZodObject<{
+            imageId: z.ZodString;
+        }, z.core.$strip>>>;
+        invertInDark: z.ZodDefault<z.ZodBoolean>;
+        showInNav: z.ZodDefault<z.ZodBoolean>;
+    }, z.core.$strip>>>;
     media: z.ZodDefault<z.ZodObject<{
         sizes: z.ZodDefault<z.ZodArray<z.ZodNumber>>;
         maxFileSize: z.ZodDefault<z.ZodNumber>;

package/dist/schemas/site-config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"site-config.d.ts","sourceRoot":"","sources":["../../src/schemas/site-config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAaxB,eAAO,MAAM,iBAAiB;;;;;;;;;iBAI5B,CAAC;AAEH,MAAM,MAAM,WAAW,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAQ5D,eAAO,MAAM,cAAc,8EAA+E,CAAC;AAW3G,eAAO,MAAM,gBAAgB;;;EAA+B,CAAC;AAE7D,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAUrB,CAAC;AAEH,MAAM,MAAM,IAAI,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,UAAU,CAAC,CAAC;AA0C9C,QAAA,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA6CtB,CAAC;AAEL,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kBAAyE,CAAC;AAElG,MAAM,MAAM,SAAS,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,oBAAoB,CAAC,CAAC;AAE7D,oFAAoF;AACpF,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,OAAO,GAAG,SAAS,CAE1D;AAMD,eAAO,MAAM,iBAAiB;;;;;iBAM5B,CAAC;AACH,MAAM,MAAM,WAAW,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAE5D,eAAO,MAAM,mBAAmB;;;;;;;;;;;iBAwB5B,CAAC;AACL,MAAM,MAAM,aAAa,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAEhE,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA4B3B,CAAC;AAEH,MAAM,MAAM,UAAU,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,gBAAgB,CAAC,CAAC"}
+{"version":3,"file":"site-config.d.ts","sourceRoot":"","sources":["../../src/schemas/site-config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAaxB,eAAO,MAAM,iBAAiB;;;;;;;;;iBAI5B,CAAC;AAEH,MAAM,MAAM,WAAW,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAQ5D,eAAO,MAAM,cAAc,8EAA+E,CAAC;AAW3G,eAAO,MAAM,gBAAgB;;;EAA+B,CAAC;AAE7D,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAUrB,CAAC;AAEH,MAAM,MAAM,IAAI,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,UAAU,CAAC,CAAC;AA0C9C,QAAA,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA6CtB,CAAC;AAEL,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kBAAyE,CAAC;AAElG,MAAM,MAAM,SAAS,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,oBAAoB,CAAC,CAAC;AAE7D,oFAAoF;AACpF,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,OAAO,GAAG,SAAS,CAE1D;AAMD,eAAO,MAAM,iBAAiB;;;;;iBAM5B,CAAC;AACH,MAAM,MAAM,WAAW,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAE5D,eAAO,MAAM,mBAAmB;;;;;;;;;;;iBAwB5B,CAAC;AACL,MAAM,MAAM,aAAa,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAEhE,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAyC3B,CAAC;AAEH,MAAM,MAAM,UAAU,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,gBAAgB,CAAC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@drawnagency/primitives",
-  "version": "0.1.84",
+  "version": "0.1.87",
   "type": "module",
   "exports": {
     "./package.json": "./package.json",

package/src/collab/rebase.ts

@@ -46,6 +46,39 @@ export interface RebaseResult {
  *  structure in both branches), and the result partitions: every section in
  *  `sections` is reachable from `index`; a dirty section deleted remotely is
  *  kept, re-linked into the index, and reported in `conflictIds`. */
+/** Fold a peer's live (pre-save) index broadcast under our current index — the
+ *  live-collab `onRemoteIndexUpdate` path, applied ONLY when we hold no unsaved
+ *  structural work (so our index equals the last-saved branch: every id in it is
+ *  a real, branch-backed section).
+ *
+ *  Keep every peer entry whose id our current index already knows; withhold the
+ *  rest, which is one of:
+ *    (a) the peer's unsaved ADD — its section file is not on the branch yet, so
+ *        letting it into our index would poison our next save with a dangling
+ *        ref the server rejects (its live appearance is deferred to the peer's
+ *        save event, which arrives via the saved-event sync); or
+ *    (b) a section WE deleted unsaved — absent from our index; our deletion
+ *        stands until save-time arbitration.
+ *
+ *  The keep-set is our INDEX's section ids, NOT the section bodies we managed to
+ *  load. A live, branch-backed section whose body was skipped by the client
+ *  loader (schema/registry miss, missing file, depth trip) is still in our index
+ *  and MUST survive — otherwise our next save posts an index missing it and the
+ *  server rejects with "section … not found in site index" (or the write drops
+ *  the live section). Taking the whole `localIndex` here, rather than a
+ *  caller-computed id set, is deliberate: it makes passing the loaded-bodies set
+ *  (the original bug) unrepresentable. Neither input is mutated. */
+export function reconcileRemoteIndex(remoteIndex: SiteIndex, localIndex: SiteIndex): SiteIndex {
+  const knownIds = new Set(Object.keys(localIndex.sections));
+  return {
+    ...remoteIndex,
+    pages: remoteIndex.pages.map((p) => ({ ...p, order: p.order.filter((id) => knownIds.has(id)) })),
+    sections: Object.fromEntries(
+      Object.entries(remoteIndex.sections).filter(([id]) => knownIds.has(id)),
+    ),
+  };
+}
+
 export function rebaseContent(args: RebaseArgs): RebaseResult {
   const localById = new Map(args.localSections.map((s) => [s.section.id, s]));
   const remoteIds = new Set(args.remoteSections.map((s) => s.section.id));

package/src/components/editor/ChildBlockWrapper.tsx

@@ -53,7 +53,7 @@ export const ChildBlockWrapper = forwardRef<HTMLDivElement, ChildBlockWrapperPro
       <div
         ref={ref}
         className={cn(
-          "group/childblock relative h-full rounded-sm",
+          "group/childblock relative h-full rounded-inner",
           isDragging && "opacity-50",
           "hover:outline hover:outline-2 hover:outline-primary/30",
         )}

package/src/components/editor/PagesModal.tsx

@@ -1,5 +1,5 @@
 import { useState, useEffect } from "react";
-import { Check } from "lucide-react";
+import { Check, ChevronDown, Home } from "lucide-react";
 import type { SiteIndex, Page } from "../../schemas/site-config";
 import type { Audience } from "../../auth/types";
 // Sanctioned outside->inside import: document/ is a sealed subtree, but the
@@ -8,7 +8,7 @@ import type { Audience } from "../../auth/types";
 import type { DocumentOptions } from "../../document/engine/settings";
 import { Button } from "../shared/Button";
 import { Input } from "../shared/Input";
-import { Checkbox } from "../shared/Checkbox";
+import { Toggle } from "../shared/Toggle";
 import { AudienceIndicator } from "./AudienceIndicator";
 import { DragHandle } from "./DragHandle";
 import { useSortableRow } from "../../hooks/useSortableRow";
@@ -208,30 +208,35 @@ function PageRow({
       className={cn("relative rounded-md border border-base-200", isDragging && "opacity-50")}
     >
       <DropEdgeIndicator edge={closestEdge} />
-      <div className="flex items-center gap-2 px-3 py-2">
+      <div className="flex items-stretch gap-2 pl-3">
         {draggable && (
-          <div className="shrink-0 [&_[role=tooltip]]:hidden">
+          <div className="flex shrink-0 items-center py-2 [&_[role=tooltip]]:hidden">
             <DragHandle ref={handleRef} />
           </div>
         )}
-        <div className="min-w-0 flex-1">
-          <div className="flex items-center gap-2">
-            <span className={cn("truncate text-sm font-medium text-base-contrast", !page.title && "italic text-base-contrast/60")}>
-              {pageDisplayTitle(page.title)}
-            </span>
-            {page.isHome && <span className="rounded bg-primary px-1.5 py-0.5 text-xs font-medium text-primary-contrast">Home page</span>}
-            {!page.showInNav && <span className="rounded bg-base-100 px-1.5 py-0.5 text-xs font-medium text-base-contrast">Hidden</span>}
-            {page.status === "archived" && <span className="rounded bg-base-100 px-1.5 py-0.5 text-xs font-medium text-base-contrast">Archived</span>}
-          </div>
-          <div className="text-xs text-base-contrast/70">{page.isHome ? "/" : `/${page.slug}`}</div>
-        </div>
         <button
           type="button"
           aria-label={`Edit settings for ${pageDisplayTitle(page.title)}`}
+          aria-expanded={expanded}
           onClick={handleHeaderClick}
-          className="cursor-pointer rounded px-2 py-1 text-sm text-base-contrast/70 hover:text-primary"
+          className="flex min-w-0 flex-1 cursor-pointer items-center gap-2 rounded py-2 pr-3 pl-4 text-left hover:bg-base-accent"
         >
-          {expanded ? "Done" : "Edit"}
+          <div className="min-w-0 flex-1">
+            <div className="flex items-center gap-2">
+              <span className={cn("truncate text-sm font-medium text-base-contrast", !page.title && "italic text-base-contrast/60")}>
+                {pageDisplayTitle(page.title)}
+              </span>
+              {page.isHome && <Home size={14} aria-label="Home page" className="shrink-0 text-base-contrast/60" />}
+              {!page.showInNav && <span className="rounded bg-base-100 px-1.5 py-0.5 text-xs font-medium text-base-contrast">Hidden</span>}
+              {page.status === "archived" && <span className="rounded bg-base-100 px-1.5 py-0.5 text-xs font-medium text-base-contrast">Archived</span>}
+            </div>
+            <div className="text-xs text-base-contrast/70">{page.isHome ? "/" : `/${page.slug}`}</div>
+          </div>
+          <ChevronDown
+            size={16}
+            aria-hidden="true"
+            className={cn("shrink-0 text-base-contrast/50 transition-transform", expanded && "rotate-180")}
+          />
         </button>
       </div>
 
@@ -254,7 +259,7 @@ function PageRow({
               onChange={handleSlugChange}
             />
           )}
-          <div className="flex items-start justify-between gap-4">
+          <div className="flex flex-col gap-3">
             <div>
               <label className="mb-1 block text-sm text-base-contrast">Audience</label>
               <AudienceIndicator access={page.access} audiences={audiences} onChange={onSetAudience} />
@@ -264,20 +269,23 @@ function PageRow({
                 </p>
               )}
             </div>
-            <Checkbox
-              label="Hide from Menu"
-              align="center"
-              checked={!page.showInNav}
-              onChange={(hidden) => onSetFields({ showInNav: !hidden })}
-              className="shrink-0"
-            />
+            <div className="flex flex-col divide-y divide-base-200 rounded-inner border border-base-200">
+              <div className="flex items-center justify-between gap-4 px-3 py-2.5">
+                <div className="min-w-0">
+                  <div className="text-sm text-base-contrast">Show in menu</div>
+                  <div className="text-xs text-base-contrast/70">List this page in the site navigation.</div>
+                </div>
+                <Toggle label="Show in menu" checked={page.showInNav} onChange={(v) => onSetFields({ showInNav: v })} />
+              </div>
+              <div className="flex items-center justify-between gap-4 px-3 py-2.5">
+                <div className="min-w-0">
+                  <div className="text-sm text-base-contrast">Document mode</div>
+                  <div className="text-xs text-base-contrast/70">Adds a presentation view of this page.</div>
+                </div>
+                <Toggle label="Document mode" checked={page.document?.enabled ?? false} onChange={(enabled) => onSetDocument({ enabled })} />
+              </div>
+            </div>
           </div>
-          <Checkbox
-            label="Document mode"
-            description="Adds a presentation view of this page."
-            checked={page.document?.enabled ?? false}
-            onChange={(enabled) => onSetDocument({ enabled })}
-          />
           <div className="flex items-center gap-2">
             <Button
               variant="secondary"

package/src/components/editor/SectionWrapper.tsx

@@ -246,12 +246,12 @@ export function SectionWrapper({
         "relative",
         isDragging && "opacity-50",
         isLocked && "opacity-60",
-        isActive && "outline outline-2 outline-primary/50 rounded-sm",
+        isActive && "outline outline-2 outline-primary/50 rounded-outer",
         !isActive &&
           showAllChrome &&
-          "outline outline-2 outline-primary/20 rounded-sm",
+          "outline outline-2 outline-primary/20 rounded-outer",
         !alwaysShow &&
-          "group-hover:outline group-hover:outline-2 group-hover:outline-primary/20 group-hover:rounded-sm",
+          "group-hover:outline group-hover:outline-2 group-hover:outline-primary/20 group-hover:rounded-outer",
       )}
       data-section-id={sectionId}
       data-section-type={sectionType}

package/src/components/shared/Navigation.tsx

@@ -14,12 +14,13 @@ interface Props {
   siteName: string;
   darkMode: "light" | "dark" | "optional";
   lastUpdated: string | null;
+  logo?: { lightUrl: string; darkUrl: string | null; invertInDark: boolean } | null;
   // Optional same-island handler (tests). In production the editor nav is a
   // separate island from EditorShell, so a click dispatches pageSelectEvent.
   onPageSelect?: (pageId: string) => void;
 }
 
-export default function Navigation({ siteNav: initialNav, siteName, darkMode, lastUpdated, onPageSelect }: Props) {
+export default function Navigation({ siteNav: initialNav, siteName, darkMode, lastUpdated, logo, onPageSelect }: Props) {
   const [isOpen, setIsOpen] = useState(false);
   const [isEditMode, setIsEditMode] = useState(false);
   const [currentDarkMode, setCurrentDarkMode] = useState(darkMode);
@@ -135,6 +136,19 @@ export default function Navigation({ siteNav: initialNav, siteName, darkMode, la
     </ul>
   );
 
+  const logoMark = logo ? (
+    <>
+      <img
+        src={logo.lightUrl}
+        alt={currentSiteName}
+        className={logo.darkUrl ? "block h-8 w-auto object-contain dark:hidden" : logo.invertInDark ? "h-8 w-auto object-contain dark:invert" : "h-8 w-auto object-contain"}
+      />
+      {logo.darkUrl && (
+        <img src={logo.darkUrl} alt={currentSiteName} className="hidden h-8 w-auto object-contain dark:block" />
+      )}
+    </>
+  ) : null;
+
   const handlePageClick = useCallback((id: string) => {
     if (onPageSelect) onPageSelect(id);
     else pageSelectEvent.dispatch(id);
@@ -193,7 +207,10 @@ export default function Navigation({ siteNav: initialNav, siteName, darkMode, la
     <>
       <header className="fixed top-0 left-0 right-0 z-50 bg-base lg:hidden">
         <div className="mx-auto max-w-screen-xl flex h-16 items-center justify-between px-4">
-          <span className="text-lg font-bold text-primary">{currentSiteName}</span>
+          <div className="flex flex-col items-start gap-1">
+            {logoMark}
+            <span className="text-lg font-bold text-primary">{currentSiteName}</span>
+          </div>
           <button onClick={() => setIsOpen(!isOpen)} className="cursor-pointer p-2 text-base-contrast" aria-label="Toggle navigation">
             <svg className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
               {isOpen
@@ -209,6 +226,7 @@ export default function Navigation({ siteNav: initialNav, siteName, darkMode, la
       <nav className={cn("fixed top-0 left-0 lg:left-auto z-40 h-full w-64 flex flex-col overflow-y-auto border-r border-base-200 bg-base pt-16 transition-transform lg:translate-x-0 nav-sidebar",
         isOpen ? "translate-x-0" : "-translate-x-full")}>
         <div className="hidden px-4 py-4 lg:block">
+          {logoMark}
           <span className="text-lg font-bold text-primary">{currentSiteName}</span>
         </div>
 

package/src/components/shared/Tabs.tsx

@@ -60,7 +60,7 @@ export function Tabs({ tabs, defaultTabId, activeTabId, onTabChange, fullBleedTa
       {/* px-px: the root's overflow-hidden would clip the 1px focus ring of
           inputs that span the full panel width (rings are box-shadows drawn
           outside the border box) — give them 1px to paint into. */}
-      <div role="tabpanel" className={cn("px-px", fullBleedTabBar && "pt-4")}>{activeTab?.content}</div>
+      <div role="tabpanel" className={cn("flex min-h-0 flex-1 flex-col px-px", fullBleedTabBar && "pt-4")}>{activeTab?.content}</div>
     </div>
   );
 }

package/src/components/shell/EditorShell.tsx

@@ -23,7 +23,6 @@ import type { BlockMove } from "../../lib/block-move";
 import { EditorModalProvider, useEditorModal } from "./EditorModalContext";
 import { EditorModal } from "./EditorModal";
 import { SiteSettingsModal } from "./SiteSettingsModal";
-import { ChatbotConfigModal } from "./ChatbotConfigModal";
 import ChatWidget from "../chat/ChatWidget";
 import { MediaLibraryModal } from "./MediaLibraryModal";
 import { MediaLibraryContext } from "./MediaLibraryContext";
@@ -69,7 +68,7 @@ import {
   deleteSectionRows,
   preserveEdit,
 } from "../../lib/dexie";
-import { rebaseContent } from "../../collab/rebase";
+import { rebaseContent, reconcileRemoteIndex } from "../../collab/rebase";
 import { deriveRecoveryInputs, applyConflictChoices } from "../../collab/recovery";
 import { getCollabProvider } from "../../collab/provider-registry";
 import type { CollabBootstrap, CollabPeer, CollabStatus, SavedMessage, TakeoverMessage } from "../../collab/types";
@@ -100,7 +99,7 @@ import { IconButton } from "../shared/IconButton";
 import { SegmentedControl } from "../shared/SegmentedControl";
 import { computeDisplaySections } from "./view-branch";
 import { SettingsIcon } from "../shared/icons";
-import { ImageIcon, ListOrderedIcon, FilesIcon, MessageCircleIcon, X } from "lucide-react";
+import { ImageIcon, ListOrderedIcon, FilesIcon, JoystickIcon, X } from "lucide-react";
 import { ErrorBoundary } from "../shared/ErrorBoundary";
 import { HistoryToolbar } from "./HistoryToolbar";
 import { RestoreModal } from "./RestoreModal";
@@ -201,7 +200,6 @@ export default function EditorShell({
   const [showRestoreModal, setShowRestoreModal] = useState(false);
   const [showOrderingModal, setShowOrderingModal] = useState(false);
   const [showPagesModal, setShowPagesModal] = useState(false);
-  const [showChatbotConfig, setShowChatbotConfig] = useState(false);
   const [showDocumentEditor, setShowDocumentEditor] = useState(false);
   const [isRestoring, setIsRestoring] = useState(false);
   const [rejectedUploads, setRejectedUploads] = useState<{ name: string; reason: "size" | "type" }[]>([]);
@@ -365,6 +363,10 @@ export default function EditorShell({
     markSectionDirty: persistence.markSectionDirty,
     onUploadError: (message) => setUploadErrorMessage(message),
     onUploadNotice: setUploadNotice,
+    onSiteConfigChange: (updater) => {
+      if (!siteConfig) return;
+      handleSiteConfigChange(updater(siteConfig));
+    },
   });
 
   const buildStatus = useBuildStatus();
@@ -634,22 +636,16 @@ export default function EditorShell({
       if (persistence.hasUnsavedIndex()) return;
       const parsed = IndexSchema.safeParse(msg.index);
       if (!parsed.success) return;
-      // PRUNE ids we hold no content for before applying. An id in the peer's
-      // index with no counterpart in our local sections state is either (a) the
-      // peer's unsaved ADD — its section file is not on the branch yet, so
-      // letting it into siteIndexRef would poison OUR next save with a dangling
-      // index ref the server rejects (live new-section appearance is deliberately
-      // deferred to the peer's save, which arrives via the saved-event sync); or
-      // (b) a section WE deleted unsaved — our deletion stands until save-time
-      // arbitration.
-      const localIds = new Set(sectionsRef.current.map((s) => s.section.id));
-      const pruned: SiteIndex = {
-        ...parsed.data,
-        pages: parsed.data.pages.map((p) => ({ ...p, order: p.order.filter((id) => localIds.has(id)) })),
-        sections: Object.fromEntries(
-          Object.entries(parsed.data.sections).filter(([id]) => localIds.has(id)),
-        ),
-      };
+      // Withhold ids our current index doesn't know before applying the peer's:
+      // (a) the peer's unsaved ADD — its file isn't on the branch yet, so letting
+      // it into siteIndexRef would poison OUR next save with a dangling index ref
+      // the server rejects (its live appearance is deferred to the peer's save,
+      // via the saved-event sync); or (b) a section WE deleted unsaved — our
+      // deletion stands until save-time arbitration. Keyed on our INDEX, not the
+      // loaded section bodies: a live section whose body the loader skipped
+      // (schema/registry miss, depth trip) is still indexed and must survive —
+      // guaranteed because we only reach here with no unsaved index work.
+      const pruned = reconcileRemoteIndex(parsed.data, siteIndexRef.current);
       setSiteIndex(pruned);
       siteIndexRef.current = pruned;
     },
@@ -1445,7 +1441,6 @@ export default function EditorShell({
             onRestoreClick={() => setShowRestoreModal(true)}
             onOrderingClick={() => setShowOrderingModal(true)}
             onPagesClick={() => setShowPagesModal(true)}
-            onChatbotClick={() => setShowChatbotConfig(true)}
             collabPeers={collab.peers}
             collabSelfId={collabBootstrap?.userId ?? null}
             collabStatus={collab.status}
@@ -1577,19 +1572,11 @@ export default function EditorShell({
             siteConfig={siteConfig!}
             onSiteConfigChange={handleSiteConfigChange}
             onAudiencesChange={setAudiences}
+            audiences={audiences}
+            chatbotPlatformEnabled={chatbotPlatformEnabled}
             capabilities={capabilities}
             currentUser={currentUser}
           />
-          {siteConfig && (
-            <ChatbotConfigModal
-              isOpen={showChatbotConfig}
-              onClose={() => setShowChatbotConfig(false)}
-              siteConfig={siteConfig}
-              onSiteConfigChange={handleSiteConfigChange}
-              audiences={audiences}
-              platformEnabled={chatbotPlatformEnabled}
-            />
-          )}
           <EditorModal
             isOpen={pendingDeleteSectionId !== null}
             onClose={() => setPendingDeleteSectionId(null)}
@@ -2280,7 +2267,6 @@ function EditorToolbar({
   onRestoreClick,
   onOrderingClick,
   onPagesClick,
-  onChatbotClick,
   collabPeers,
   collabSelfId,
   collabStatus,
@@ -2303,7 +2289,6 @@ function EditorToolbar({
   onRestoreClick: () => void;
   onOrderingClick: () => void;
   onPagesClick: () => void;
-  onChatbotClick: () => void;
   collabPeers: CollabPeer[];
   collabSelfId: string | null;
   collabStatus: CollabStatus;
@@ -2377,42 +2362,11 @@ function EditorToolbar({
             </div>
             <div className="flex items-center justify-end gap-2">
               <ProcessingIndicator items={processingItems} />
-              <IconButton
-                icon={<ListOrderedIcon size={16} />}
-                label="Reorder sections"
-                size="md"
-                onClick={onOrderingClick}
-                className="border border-base-200 bg-base-accent"
-              />
-              <IconButton
-                icon={<ImageIcon size={16} />}
-                label="Media library"
-                size="md"
-                onClick={onMediaClick}
-                className="border border-base-200 bg-base-accent"
-              />
-              <IconButton
-                icon={<FilesIcon size={16} />}
-                label="Pages"
-                size="md"
-                onClick={onPagesClick}
-                className="border border-base-200 bg-base-accent"
-              />
-              <IconButton
-                icon={<MessageCircleIcon size={16} />}
-                label="Chatbot"
-                size="md"
-                onClick={onChatbotClick}
-                className="border border-base-200 bg-base-accent"
-              />
-              <IconButton
-                icon={<SettingsIcon size={16} />}
-                label="Site settings"
-                size="md"
-                onClick={onSettingsClick}
-                className="border border-base-200 bg-base-accent"
-              />
+              <IconButton icon={<ImageIcon size={16} />} label="Media library" size="md" onClick={onMediaClick} className="border border-base-200 bg-base-accent" />
+              <IconButton icon={<ListOrderedIcon size={16} />} label="Reorder sections" size="md" onClick={onOrderingClick} className="border border-base-200 bg-base-accent" />
+              <IconButton icon={<FilesIcon size={16} />} label="Pages" size="md" onClick={onPagesClick} className="border border-base-200 bg-base-accent" />
               <ShowAllChromeToggle />
+              <IconButton icon={<SettingsIcon size={16} />} label="Site settings" size="md" onClick={onSettingsClick} className="border border-base-200 bg-base-accent" />
             </div>
           </div>
         </div>
@@ -2457,14 +2411,13 @@ function ShowAllChromeToggle() {
   const { showAllChrome, toggleShowAllChrome } = useEditorContext();
 
   return (
-    <Button
-      variant="secondary"
-      size="sm"
+    <IconButton
+      icon={<JoystickIcon size={16} />}
+      label="Toggle editor chrome visibility"
+      size="md"
       onClick={toggleShowAllChrome}
-      className="bg-base-accent"
-      aria-label="Toggle editor chrome visibility"
-    >
-      {showAllChrome ? "Hide Controls" : "Show Controls"}
-    </Button>
+      aria-pressed={showAllChrome}
+      className="border border-base-200 bg-base-accent"
+    />
   );
 }