@drawnagency/primitives 0.1.112 → 0.1.114

package/dist/{chunk-EPWBPIV6.js → chunk-PZPGJZRG.js}

@@ -1,15 +1,15 @@
 import {
   EditablePlainText
-} from "./chunk-3SZNUCXI.js";
+} from "./chunk-Y5QECJX7.js";
 import {
   usePages
-} from "./chunk-BR4MIPTM.js";
+} from "./chunk-5KSAS4VY.js";
 import {
   Button
-} from "./chunk-WUJ3XNFI.js";
+} from "./chunk-GGYY3JQJ.js";
 import {
   toSectionId
-} from "./chunk-DNY72JZN.js";
+} from "./chunk-VUYCRBJK.js";
 import {
   ensureSanitizer,
   isSanitizerReady,
@@ -22,12 +22,12 @@ import {
   defineSection
 } from "./chunk-FTPETWXE.js";
 
-// src/components/primitives/defineHeadingSection.tsx
+// src/components/primitives/define-heading-section.tsx
 import { z } from "zod";
 
 // src/components/primitives/HeadingSection.tsx
 import { jsx } from "react/jsx-runtime";
-function HeadingSection({ heading, tag, placeholder, className, onChange }) {
+function HeadingSection({ heading, tag, placeholder, className, anchor, onChange }) {
   return /* @__PURE__ */ jsx(
     EditablePlainText,
     {
@@ -37,13 +37,13 @@ function HeadingSection({ heading, tag, placeholder, className, onChange }) {
       }),
       isEditMode: !!onChange,
       placeholder,
-      id: toSectionId(heading),
+      id: anchor ?? toSectionId(heading),
       className: cn("scroll-mt-20", className)
     }
   );
 }
 
-// src/components/primitives/defineHeadingSection.tsx
+// src/components/primitives/define-heading-section.tsx
 import { jsx as jsx2 } from "react/jsx-runtime";
 function defineHeadingSection(config) {
   const heading = z.string().describe(
@@ -69,6 +69,7 @@ function defineHeadingSection(config) {
         heading: content2.content.heading,
         tag: config.tag,
         placeholder: config.placeholder,
+        anchor: content2.navAnchor,
         onChange: onChange ? (heading2) => onChange({ ...content2, content: { ...content2.content, heading: heading2 } }) : void 0
       }
     ),

package/dist/{chunk-P3ZNCHW7.js → chunk-QHMKIODQ.js}

@@ -1,6 +1,6 @@
 import {
   slugifyPageSlug
-} from "./chunk-VLPELTPI.js";
+} from "./chunk-IP2SEBAJ.js";
 
 // src/media/utils.ts
 async function hashFileBuffer(buffer) {
@@ -44,6 +44,17 @@ var EXT_TO_MIME = {
 function mimeToExt(mime) {
   return MIME_TO_EXT[mime] ?? "bin";
 }
+function mediaThumbnailUrl(item) {
+  if (item.mimeType === "image/svg+xml" || item.kind !== "image") {
+    return `/api/media/${item.id}/original.${mimeToExt(item.mimeType)}`;
+  }
+  if (item.variants.length === 0) return null;
+  const smallest = item.variants.reduce((a, b) => a.width < b.width ? a : b);
+  return `/api/media/${item.id}/${smallest.width}.webp`;
+}
+function imageThumbnailUrl(item) {
+  return item?.kind === "image" ? mediaThumbnailUrl(item) : null;
+}
 function displayFilenameExt(mime) {
   const ext = MIME_TO_EXT[mime];
   return ext ? `.${ext}` : "";
@@ -248,11 +259,12 @@ function resolveLogo(logo, manifest, provider) {
     lightUrl: light.src,
     darkUrl,
     invertInDark: logo.invertInDark,
-    showInNav: logo.showInNav
+    showInNav: logo.showInNav,
+    hideTitle: logo.hideTitle
   };
 }
 
-// src/media/videoPoster.ts
+// src/media/video-poster.ts
 function generateVideoPoster(blob, quality) {
   return new Promise((resolve, reject) => {
     const video = document.createElement("video");
@@ -274,7 +286,7 @@ function generateVideoPoster(blob, quality) {
       safeReject(new Error("Video poster generation timed out"));
     }, 1e4);
     video.addEventListener("error", () => {
-      safeReject(new Error("Failed to load video for poster generation"));
+      safeReject(new Error("Couldn't load video for poster generation"));
     }, { once: true });
     video.muted = true;
     video.preload = "auto";
@@ -300,7 +312,7 @@ function generateVideoPoster(blob, quality) {
               settled = true;
               cleanup();
               if (!posterBlob) {
-                reject(new Error("Failed to create poster blob"));
+                reject(new Error("Couldn't create poster blob"));
                 return;
               }
               resolve({ posterBlob, width: w, height: h, duration: video.duration });
@@ -425,6 +437,8 @@ export {
   MIME_TO_EXT,
   EXT_TO_MIME,
   mimeToExt,
+  mediaThumbnailUrl,
+  imageThumbnailUrl,
   displayFilenameExt,
   displayFilename,
   formatFileSize,

package/dist/{chunk-HBULBDGP.js → chunk-S37DZPHW.js}

@@ -1,6 +1,6 @@
 import {
   HexColorSchema
-} from "./chunk-GGXZZ77Z.js";
+} from "./chunk-AASEGXNT.js";
 
 // src/schemas/audience.ts
 import { z } from "zod";

package/dist/{chunk-4I5OO5UB.js → chunk-TEOAKGZA.js}

@@ -772,7 +772,6 @@ export {
   DeckImage,
   DeckImageGrid,
   DeckTextEditProvider,
-  useDeckTextEditor,
   EditableText,
   DeckRichText,
   DeckVideo,

package/dist/chunk-VUYCRBJK.js

@@ -0,0 +1,174 @@
+import {
+  getContainerChildren
+} from "./chunk-L45X7DKX.js";
+import {
+  siteTags
+} from "./chunk-OAGJBCSH.js";
+import {
+  audiencePasses,
+  pagesInNavOrder
+} from "./chunk-IP2SEBAJ.js";
+import {
+  REFERENCE_TYPE
+} from "./chunk-5GFACGSN.js";
+import {
+  getSection
+} from "./chunk-FTPETWXE.js";
+
+// src/lib/references.ts
+function referenceItems(opts) {
+  const { referenceId, content, index, allSections, audiences } = opts;
+  const wanted = new Set(content.sectionIds);
+  const tagIds = new Set(content.tagIds);
+  for (const tag of siteTags(index)) {
+    if (tagIds.has(tag.id)) for (const id of tag.sectionIds) wanted.add(id);
+  }
+  wanted.delete(referenceId);
+  if (wanted.size === 0) return [];
+  const byId = new Map(allSections.map((s) => [s.section.id, s]));
+  const item = (sectionId, page) => {
+    const source = byId.get(sectionId) ?? null;
+    const excluded = !source || !page ? "missing" : source.section.type === REFERENCE_TYPE ? "reference" : page.status !== "live" ? "archived-page" : source.meta.status !== "live" ? "not-live" : null;
+    const hiddenFrom = excluded || !source || !page ? [] : audiences.filter(
+      (a) => !audiencePasses(page.access, a) || !audiencePasses(source.meta.access, a)
+    );
+    return { sectionId, page, source, excluded, hiddenFrom };
+  };
+  const items = [];
+  const placed = /* @__PURE__ */ new Set();
+  for (const page of pagesInNavOrder(index)) {
+    for (const id of page.order) {
+      if (!wanted.has(id)) continue;
+      items.push(item(id, page));
+      placed.add(id);
+    }
+  }
+  for (const id of wanted) if (!placed.has(id)) items.push(item(id, null));
+  return items;
+}
+function resolveReference(opts) {
+  const { audience, ...rest } = opts;
+  return referenceItems({ ...rest, audiences: audience === null ? [] : [audience] }).flatMap(
+    (i) => i.source && !i.excluded && i.hiddenFrom.length === 0 ? [{ ...i.source, referencedBy: opts.referenceId }] : []
+  );
+}
+
+// src/lib/nav.ts
+function toSectionId(text) {
+  const slug = text.normalize("NFKD").replace(/[̀-ͯ]/g, "").toLowerCase().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-").replace(/^-+|-+$/g, "");
+  if (slug) return slug;
+  let hash = 0;
+  for (let i = 0; i < text.length; i++) {
+    hash = (hash << 5) - hash + text.charCodeAt(i) | 0;
+  }
+  return `section-${Math.abs(hash).toString(36)}`;
+}
+function flattenForNav(sections) {
+  const flat = [];
+  const walk = (loaded) => {
+    flat.push(loaded);
+    for (const child of getContainerChildren(loaded.section)) {
+      walk({ section: child, meta: loaded.meta, referencedBy: loaded.referencedBy });
+    }
+  };
+  sections.forEach(walk);
+  return flat;
+}
+var SUMMARY_TYPE = "section_summary";
+function summaryNav(section) {
+  if (section.type !== SUMMARY_TYPE) return null;
+  const options = "options" in section ? section.options : void 0;
+  const label = options?.navLabel?.trim() ?? "";
+  if (!label || options?.nav !== "heading" && options?.nav !== "subheading") return null;
+  return { role: options.nav === "heading" ? "h1" : "h2", label };
+}
+function roleLookup(registry) {
+  return (type) => (registry ? registry.getSection(type) : getSection(type))?.navRole;
+}
+function assignAnchors(flat, lookupRole) {
+  const anchors = new Array(flat.length);
+  const taken = /* @__PURE__ */ new Set();
+  const claim = (i, base) => {
+    let anchor = base;
+    for (let n = 2; taken.has(anchor); n++) anchor = `${base}-${n}`;
+    taken.add(anchor);
+    anchors[i] = anchor;
+  };
+  const headingOf = (section) => {
+    const heading = section.content.heading;
+    return heading && lookupRole(section.type) ? heading : void 0;
+  };
+  flat.forEach(({ section, referencedBy }, i) => {
+    const heading = headingOf(section);
+    if (referencedBy || !heading) return;
+    anchors[i] = toSectionId(heading);
+    taken.add(anchors[i]);
+  });
+  flat.forEach(({ section, referencedBy }, i) => {
+    const entry = summaryNav(section);
+    if (!referencedBy && entry) claim(i, toSectionId(entry.label));
+  });
+  flat.forEach(({ section, referencedBy }, i) => {
+    const text = summaryNav(section)?.label ?? headingOf(section);
+    if (referencedBy && text) claim(i, `${toSectionId(text)}-${toSectionId(referencedBy)}`);
+  });
+  return anchors;
+}
+function buildNavLinks(flat, lookupRole, anchors) {
+  const nav = [];
+  let currentParent = null;
+  let currentChild = null;
+  for (const [i, { section, meta }] of flat.entries()) {
+    let role;
+    let label;
+    let excluded = false;
+    const summary = summaryNav(section);
+    if (summary) {
+      role = summary.role;
+      label = summary.label;
+    } else {
+      const content = section.content;
+      if (!content.heading) continue;
+      role = lookupRole(section.type);
+      label = content.heading;
+      excluded = !!content.excludeFromNav;
+    }
+    const anchor = anchors[i];
+    if (!role || !anchor) continue;
+    if (role === "h1") {
+      if (excluded) {
+        currentParent = null;
+        currentChild = null;
+        continue;
+      }
+      currentParent = { href: `#${anchor}`, label, status: meta.status, children: [] };
+      currentChild = null;
+      nav.push(currentParent);
+    } else if (role === "h2") {
+      if (excluded) {
+        currentChild = null;
+        continue;
+      }
+      if (!currentParent) continue;
+      currentChild = { href: `#${anchor}`, label, status: meta.status, children: [] };
+      currentParent.children.push(currentChild);
+    } else if (role === "h3") {
+      if (excluded) continue;
+      if (!currentChild) continue;
+      currentChild.children.push({ href: `#${anchor}`, label, status: meta.status, children: [] });
+    }
+  }
+  return nav;
+}
+function generateNavLinks(sections, registry) {
+  const flat = flattenForNav(sections);
+  const lookupRole = roleLookup(registry);
+  return buildNavLinks(flat, lookupRole, assignAnchors(flat, lookupRole));
+}
+
+export {
+  referenceItems,
+  resolveReference,
+  toSectionId,
+  generateNavLinks
+};

package/dist/{chunk-4RNF2DRG.js → chunk-XDEPXTBY.js}

@@ -12,7 +12,6 @@ function createEvent(name) {
   };
 }
 var editModeEvent = createEvent("editmodechange");
-var navChangeEvent = createEvent("sitenavchange");
 var darkModeEvent = createEvent("sitedarkmode");
 var siteNameChangeEvent = createEvent("sitenamechange");
 var historySelectEvent = createEvent("history-select");
@@ -26,6 +25,5 @@ var audienceDetailsEvent = createEvent("audiencedetailsopen");
 export {
   createEvent,
   editModeEvent,
-  navChangeEvent,
   darkModeEvent
 };

package/dist/{chunk-3SZNUCXI.js → chunk-Y5QECJX7.js}

@@ -1,17 +1,18 @@
 import {
-  AddIcon,
-  DeleteIcon,
   DragHandle,
-  SettingsIcon,
+  DropEdgeIndicator,
   useMediaLibrary,
   useResolvedMedia
-} from "./chunk-TALRVOGO.js";
+} from "./chunk-5KSAS4VY.js";
+import {
+  computeReorderTarget
+} from "./chunk-DIMDRBFK.js";
 import {
   IconButton
 } from "./chunk-IIDKW7AV.js";
 import {
   rebindImageRef
-} from "./chunk-P3ZNCHW7.js";
+} from "./chunk-QHMKIODQ.js";
 import {
   cn
 } from "./chunk-7EOSDFS3.js";
@@ -152,7 +153,8 @@ function ResolvedMedia({
   height: propHeight,
   className,
   imgClassName,
-  invertFrom
+  invertFrom,
+  backdrop
 }) {
   const resolved = useResolvedMedia(imageId);
   const hasResolved = !!resolved.src;
@@ -178,6 +180,15 @@ function ResolvedMedia({
         )
       }
     ),
+    backdrop && /* @__PURE__ */ jsx(
+      "div",
+      {
+        "aria-hidden": "true",
+        "data-testid": "media-backdrop",
+        className: cn("pointer-events-none absolute inset-0", backdrop.className),
+        style: backdrop.style
+      }
+    ),
     kind === "video" ? /* @__PURE__ */ jsx(
       "video",
       {
@@ -268,6 +279,25 @@ function ImageDropZone({ onImageSelected, className, children }) {
   );
 }
 
+// src/lib/image-background.ts
+var LIGHT_MODE = {
+  none: void 0,
+  light: "bg-surface-light",
+  dark: "bg-surface-dark"
+};
+var DARK_MODE = {
+  none: "dark:bg-transparent",
+  light: "dark:bg-surface-light",
+  dark: "dark:bg-surface-dark"
+};
+function imageBackdrop(bg) {
+  if (!bg) return void 0;
+  if (bg.mode === "custom") return { style: { backgroundColor: bg.color } };
+  const light = LIGHT_MODE[bg.light];
+  if (!light && bg.dark === "none") return void 0;
+  return { className: [light, DARK_MODE[bg.dark]].filter(Boolean).join(" ") };
+}
+
 // src/components/sections/Media/MediaBlock.tsx
 import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 function MediaBlock({ refValue, options, link, isEditMode, onRefChange }) {
@@ -275,6 +305,7 @@ function MediaBlock({ refValue, options, link, isEditMode, onRefChange }) {
   const fit = refValue.objectFit ?? options.objectFit;
   const fitClass = fit === "cover" ? "object-cover" : "object-contain";
   const showBorder = refValue.border ?? options.border;
+  const backdrop = refValue.type === "video" ? void 0 : imageBackdrop(options.background);
   const captionStr = refValue.caption ? Array.isArray(refValue.caption) ? refValue.caption.join("\n") : refValue.caption : "";
   const replace = onRefChange ? (imageId) => onRefChange(rebindImageRef(refValue, imageId)) : void 0;
   const baked = refValue;
@@ -292,7 +323,8 @@ function MediaBlock({ refValue, options, link, isEditMode, onRefChange }) {
       height: bakedHeight,
       className: "h-full w-full",
       imgClassName: fitClass,
-      invertFrom: refValue.invertFrom
+      invertFrom: refValue.invertFrom,
+      backdrop
     }
   );
   let media = isEditMode && replace ? /* @__PURE__ */ jsx3(ImageDropZone, { onImageSelected: replace, className: "h-full w-full", children: resolved }) : resolved;
@@ -333,7 +365,7 @@ function MediaBlock({ refValue, options, link, isEditMode, onRefChange }) {
 
 // src/components/primitives/EditableGrid.tsx
 import { useRef as useRef4, useEffect as useEffect4, useState as useState5, useId } from "react";
-import { ImageIcon as ImageIcon2 } from "lucide-react";
+import { ImageIcon as ImageIcon2, Plus, Trash2, Settings } from "lucide-react";
 
 // src/lib/container-grid.ts
 var MAX_CONTAINER_COLUMNS = 6;
@@ -457,7 +489,7 @@ function useEditableCollection({
   return { wrappedItems, onReorder, onAdd, onInsert, onInsertItem, onRemove };
 }
 
-// src/components/primitives/gridDrop.ts
+// src/components/primitives/grid-drop.ts
 function resolveDropIndex({
   fromIndex,
   targetIndex,
@@ -568,7 +600,7 @@ function EditableGrid({
     /* @__PURE__ */ jsx4(
       IconButton,
       {
-        icon: /* @__PURE__ */ jsx4(AddIcon, { size: 16 }),
+        icon: /* @__PURE__ */ jsx4(Plus, { size: 16 }),
         label: "Add item",
         size: "lg",
         intent: "primary",
@@ -660,12 +692,17 @@ function GridCell({
         isCellDragging && "opacity-50"
       ),
       children: [
-        showLeftEdge && /* @__PURE__ */ jsx4("div", { className: "absolute top-0 bottom-0 left-0 z-10 w-0.5 -translate-x-2 bg-primary" }),
-        showRightEdge && /* @__PURE__ */ jsx4("div", { className: "absolute top-0 right-0 bottom-0 z-10 w-0.5 translate-x-2 bg-primary" }),
+        /* @__PURE__ */ jsx4(
+          DropEdgeIndicator,
+          {
+            edge: showLeftEdge ? "left" : showRightEdge ? "right" : null,
+            style: { transform: showLeftEdge ? "translateX(-0.5rem)" : "translateX(0.5rem)" }
+          }
+        ),
         !isDragging && !isLast && /* @__PURE__ */ jsx4(
           IconButton,
           {
-            icon: /* @__PURE__ */ jsx4(AddIcon, { size: 12 }),
+            icon: /* @__PURE__ */ jsx4(Plus, { size: 12 }),
             label: "Insert item",
             size: "sm",
             intent: "primary",
@@ -696,7 +733,7 @@ function GridCell({
           onSettings && /* @__PURE__ */ jsx4(
             IconButton,
             {
-              icon: /* @__PURE__ */ jsx4(SettingsIcon, { size: 16 }),
+              icon: /* @__PURE__ */ jsx4(Settings, { size: 16 }),
               label: "Item settings",
               onClick: onSettings,
               className: "bg-base/80 shadow-sm"
@@ -705,7 +742,7 @@ function GridCell({
           /* @__PURE__ */ jsx4(
             IconButton,
             {
-              icon: /* @__PURE__ */ jsx4(DeleteIcon, { size: 16 }),
+              icon: /* @__PURE__ */ jsx4(Trash2, { size: 16 }),
               label: "Delete item",
               intent: "destructive",
               onClick: () => onRemove(id),
@@ -719,6 +756,175 @@ function GridCell({
   );
 }
 
+// src/components/primitives/EditableList.tsx
+import { useId as useId2 } from "react";
+import { Trash2 as Trash22 } from "lucide-react";
+
+// src/hooks/useSortableRow.ts
+import { useEffect as useEffect5, useRef as useRef5, useState as useState6 } from "react";
+function useSortableRow({
+  index,
+  dragType,
+  onReorder,
+  enabled = true
+}) {
+  const rowRef = useRef5(null);
+  const handleRef = useRef5(null);
+  const [isDragging, setIsDragging] = useState6(false);
+  const [closestEdge, setClosestEdge] = useState6(null);
+  const onReorderRef = useRef5(onReorder);
+  onReorderRef.current = onReorder;
+  useEffect5(() => {
+    if (!enabled) return;
+    const row = rowRef.current;
+    const handle = handleRef.current;
+    if (!row || !handle) return;
+    let cleanup;
+    let cancelled = false;
+    Promise.all([
+      import("./adapter-HH47ZPGM.js"),
+      import("./closest-edge-EBOXL3YW.js")
+    ]).then(([{ draggable, dropTargetForElements }, { attachClosestEdge, extractClosestEdge }]) => {
+      if (cancelled) return;
+      const cleanupDraggable = draggable({
+        element: row,
+        dragHandle: handle,
+        getInitialData: () => ({ dragType, index }),
+        onGenerateDragPreview: () => {
+          row.style.opacity = "0.4";
+          requestAnimationFrame(() => {
+            row.style.opacity = "";
+          });
+        },
+        onDragStart: () => setIsDragging(true),
+        onDrop: () => setIsDragging(false)
+      });
+      const cleanupDropTarget = dropTargetForElements({
+        element: row,
+        canDrop: ({ source }) => source.data.dragType === dragType,
+        getData: ({ input, element }) => attachClosestEdge({ index }, { input, element, allowedEdges: ["top", "bottom"] }),
+        onDragEnter: ({ self }) => {
+          const edge = extractClosestEdge(self.data);
+          setClosestEdge(edge === "top" || edge === "bottom" ? edge : null);
+        },
+        onDrag: ({ self }) => {
+          const edge = extractClosestEdge(self.data);
+          setClosestEdge(edge === "top" || edge === "bottom" ? edge : null);
+        },
+        onDragLeave: () => setClosestEdge(null),
+        onDrop: ({ source, self }) => {
+          setClosestEdge(null);
+          const fromIndex = source.data.index;
+          const rawEdge = extractClosestEdge(self.data);
+          const edge = rawEdge === "top" || rawEdge === "bottom" ? rawEdge : null;
+          const toIndex = computeReorderTarget(fromIndex, index, edge);
+          if (toIndex !== null) onReorderRef.current(fromIndex, toIndex);
+        }
+      });
+      cleanup = () => {
+        cleanupDraggable();
+        cleanupDropTarget();
+      };
+    });
+    return () => {
+      cancelled = true;
+      cleanup?.();
+    };
+  }, [index, dragType, enabled]);
+  return { rowRef, handleRef, isDragging, closestEdge };
+}
+
+// src/components/primitives/EditableList.tsx
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function EditableList({
+  items,
+  onChange,
+  createItem,
+  isEditMode,
+  renderItem,
+  className
+}) {
+  const { wrappedItems, onReorder, onAdd, onRemove } = useEditableCollection({
+    items,
+    onChange,
+    createItem
+  });
+  const listId = useId2();
+  const dragType = `list-row-${listId}`;
+  if (!isEditMode) {
+    return /* @__PURE__ */ jsx5("div", { className: cn("flex flex-col gap-2", className), children: wrappedItems.map((wrapped, index) => /* @__PURE__ */ jsx5("div", { children: renderItem(wrapped.data, { isEditMode: false, index }) }, wrapped.id)) });
+  }
+  return /* @__PURE__ */ jsxs5("div", { className: cn("flex flex-col gap-2", className), children: [
+    wrappedItems.map((wrapped, index) => /* @__PURE__ */ jsx5(
+      ListRow,
+      {
+        id: wrapped.id,
+        index,
+        dragType,
+        onReorder,
+        onRemove,
+        children: renderItem(wrapped.data, { isEditMode: true, index })
+      },
+      wrapped.id
+    )),
+    /* @__PURE__ */ jsx5(
+      "button",
+      {
+        onClick: onAdd,
+        className: "cursor-pointer rounded border-2 border-dashed border-base-200 px-3 py-2 text-sm text-base-contrast-light hover:border-primary hover:text-primary",
+        children: "Add row"
+      }
+    )
+  ] });
+}
+function ListRow({
+  id,
+  index,
+  dragType,
+  onReorder,
+  onRemove,
+  children
+}) {
+  const { rowRef, handleRef, isDragging, closestEdge } = useSortableRow({
+    index,
+    dragType,
+    onReorder
+  });
+  return /* @__PURE__ */ jsxs5(
+    "div",
+    {
+      ref: rowRef,
+      className: cn("group/row relative flex items-center gap-2", isDragging && "opacity-50"),
+      children: [
+        /* @__PURE__ */ jsx5(DropEdgeIndicator, { edge: closestEdge }),
+        /* @__PURE__ */ jsx5(
+          IconButton,
+          {
+            ref: handleRef,
+            icon: /* @__PURE__ */ jsx5(DragHandle, { size: 14 }),
+            label: "Drag to reorder",
+            size: "sm",
+            className: "shrink-0 cursor-grab opacity-0 group-hover/row:opacity-100 no-hover:opacity-100",
+            tabIndex: -1
+          }
+        ),
+        /* @__PURE__ */ jsx5("div", { className: "min-w-0 flex-1", children }),
+        /* @__PURE__ */ jsx5(
+          IconButton,
+          {
+            icon: /* @__PURE__ */ jsx5(Trash22, { size: 14 }),
+            label: "Delete item",
+            size: "sm",
+            intent: "destructive",
+            onClick: () => onRemove(id),
+            className: "shrink-0 opacity-0 group-hover/row:opacity-100 no-hover:opacity-100"
+          }
+        )
+      ]
+    }
+  );
+}
+
 export {
   EditablePlainText,
   ResolvedMedia,
@@ -730,5 +936,6 @@ export {
   masonryColumnsClass,
   spacerHiddenClass,
   useEditableCollection,
-  EditableGrid
+  EditableGrid,
+  EditableList
 };

package/dist/collab/rebase.d.ts

@@ -80,7 +80,8 @@ export declare function reconcileRemoteIndex(remoteIndex: SiteIndex, localIndex:
  *  never touches, so the peer's nav transfers whole; readers go through
  *  `navEntries()` → `reconcileNav`, which repairs any drift against the
  *  resulting page set. A peer that sends no nav (an older client) leaves ours
- *  intact rather than flattening it. */
+ *  intact rather than flattening it. The `tags` sidecar is lifted the same way,
+ *  for the same reason. */
 export declare function applyRemoteIndexUpdate(rawRemoteIndex: unknown, localIndex: SiteIndex): SiteIndex | null;
 export declare function rebaseContent(args: RebaseArgs): RebaseResult;
 //# sourceMappingURL=rebase.d.ts.map

package/dist/collab/rebase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"rebase.d.ts","sourceRoot":"","sources":["../../src/collab/rebase.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAIxD,MAAM,WAAW,UAAU;IACzB,aAAa,EAAE,aAAa,EAAE,CAAC;IAC/B,UAAU,EAAE,SAAS,CAAC;IACtB,eAAe,EAAE,OAAO,CAAC;IACzB,eAAe,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC7B;;;;;+EAK2E;IAC3E,eAAe,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC7B,iBAAiB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC/B;;;;gFAI4E;IAC5E,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,cAAc,EAAE,aAAa,EAAE,CAAC;IAChC,WAAW,EAAE,SAAS,CAAC;IAKvB,gBAAgB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;CAC/B;AAED,MAAM,WAAW,YAAY;IAC3B,QAAQ,EAAE,aAAa,EAAE,CAAC;IAC1B,KAAK,EAAE,SAAS,CAAC;IAIjB,WAAW,EAAE,MAAM,EAAE,CAAC;CACvB;AAED;;;;;;;;;;qEAUqE;AACrE;;;;;;;;;;;;;;;;;;;;;oEAqBoE;AACpE,wBAAgB,oBAAoB,CAAC,WAAW,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,GAAG,SAAS,CAS7F;AAED;;;;;;;;;;;;;;;;;;wCAkBwC;AACxC,wBAAgB,sBAAsB,CAAC,cAAc,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,GAAG,SAAS,GAAG,IAAI,CAYvG;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,UAAU,GAAG,YAAY,CA6H5D"}
+{"version":3,"file":"rebase.d.ts","sourceRoot":"","sources":["../../src/collab/rebase.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAMxD,MAAM,WAAW,UAAU;IACzB,aAAa,EAAE,aAAa,EAAE,CAAC;IAC/B,UAAU,EAAE,SAAS,CAAC;IACtB,eAAe,EAAE,OAAO,CAAC;IACzB,eAAe,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC7B;;;;;+EAK2E;IAC3E,eAAe,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC7B,iBAAiB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC/B;;;;gFAI4E;IAC5E,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,cAAc,EAAE,aAAa,EAAE,CAAC;IAChC,WAAW,EAAE,SAAS,CAAC;IAKvB,gBAAgB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;CAC/B;AAED,MAAM,WAAW,YAAY;IAC3B,QAAQ,EAAE,aAAa,EAAE,CAAC;IAC1B,KAAK,EAAE,SAAS,CAAC;IAIjB,WAAW,EAAE,MAAM,EAAE,CAAC;CACvB;AAED;;;;;;;;;;qEAUqE;AACrE;;;;;;;;;;;;;;;;;;;;;oEAqBoE;AACpE,wBAAgB,oBAAoB,CAAC,WAAW,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,GAAG,SAAS,CAS7F;AAED;;;;;;;;;;;;;;;;;;;2BAmB2B;AAC3B,wBAAgB,sBAAsB,CAAC,cAAc,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,GAAG,SAAS,GAAG,IAAI,CAqBvG;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,UAAU,GAAG,YAAY,CAyI5D"}