@jay-framework/aiditor 0.21.0 → 0.22.0

package/dist/index.client.js

@@ -9657,10 +9657,7 @@ function initAddPageBriefFillPanel(deps) {
     } catch (err) {
       if (runId !== activeRuns[t]) return;
       if (err instanceof Error && err.name === "AbortError") return;
-      setTargetGenError(
-        t,
-        err instanceof Error ? err.message : String(err)
-      );
+      setTargetGenError(t, err instanceof Error ? err.message : String(err));
     } finally {
       abortHandles[t] = null;
       if (runId === activeRuns[t]) {
@@ -9883,6 +9880,31 @@ function suggestMissingRouteSegments(route, segmentNames) {
   if (trimmed === "/") return `/${suffix}`;
   return `${trimmed}/${suffix}`;
 }
+function isGifPath(src) {
+  return /\.gif($|\?)/i.test(src.trim());
+}
+function normalizeAddMenuPresentation(item) {
+  if (item.presentation) return item.presentation;
+  const thumbnail = item.thumbnail?.trim();
+  if (!thumbnail) return void 0;
+  if (isGifPath(thumbnail)) {
+    return { type: "gif", src: thumbnail };
+  }
+  return { type: "image", src: thumbnail };
+}
+const BLOCKED_TAGS = /<\s*(script|iframe|object|embed)\b[^>]*>[\s\S]*?<\/\s*\1\s*>|<\s*(script|iframe|object|embed)\b[^>]*\/?>/gi;
+const EVENT_HANDLER_ATTR = /\s+on[a-z]+\s*=\s*("[^"]*"|'[^']*'|[^\s>]+)/gi;
+const JAVASCRIPT_URL = /\b(href|src|xlink:href)\s*=\s*("|')\s*javascript:/gi;
+function sanitizeAddMenuHtmlFragment(html) {
+  let result = html;
+  result = result.replace(BLOCKED_TAGS, "");
+  BLOCKED_TAGS.lastIndex = 0;
+  result = result.replace(EVENT_HANDLER_ATTR, "");
+  EVENT_HANDLER_ATTR.lastIndex = 0;
+  result = result.replace(JAVASCRIPT_URL, "");
+  JAVASCRIPT_URL.lastIndex = 0;
+  return result.trim();
+}
 const PUBLIC_THUMBNAIL_PREFIX = "/aiditor-add-menu-thumbnails/";
 function resolveAddMenuThumbnailUrl(thumbnail) {
   const raw = thumbnail?.trim();
@@ -9891,31 +9913,84 @@ function resolveAddMenuThumbnailUrl(thumbnail) {
   const withoutPrefix = raw.startsWith("thumbnails/") ? raw.slice("thumbnails/".length) : raw;
   return `${PUBLIC_THUMBNAIL_PREFIX}${withoutPrefix}`;
 }
-function isAddMenuThumbnailAnimated(thumbnail, url) {
-  const target = url ?? thumbnail ?? "";
-  if (/\.gif($|\?)/i.test(target)) return true;
-  if (/-motion\.(svg|gif)($|\?)/i.test(target)) return true;
-  return false;
+function addMenuPresentationFields(item) {
+  const empty = {
+    showImage: false,
+    showGif: false,
+    showHtmlFragment: false,
+    imageUrl: "",
+    gifUrl: "",
+    posterUrl: "",
+    previewHtml: ""
+  };
+  const presentation = normalizeAddMenuPresentation(item);
+  if (!presentation) return empty;
+  switch (presentation.type) {
+    case "image": {
+      const imageUrl = resolveAddMenuThumbnailUrl(presentation.src) ?? "";
+      return {
+        ...empty,
+        showImage: imageUrl.length > 0,
+        imageUrl
+      };
+    }
+    case "gif": {
+      const gifUrl = resolveAddMenuThumbnailUrl(presentation.src) ?? "";
+      const posterUrl = resolveAddMenuThumbnailUrl(presentation.poster) ?? "";
+      return {
+        ...empty,
+        showGif: gifUrl.length > 0,
+        gifUrl,
+        posterUrl
+      };
+    }
+    case "html-fragment": {
+      const previewHtml = sanitizeAddMenuHtmlFragment(presentation.html);
+      return {
+        ...empty,
+        showHtmlFragment: previewHtml.length > 0,
+        previewHtml
+      };
+    }
+    default:
+      return empty;
+  }
 }
-const PREVIEW_CARD_CLASS = "add-menu-picker-component-card add-menu-picker-component-card--preview";
-const INFO_CARD_CLASS = "add-menu-picker-component-card add-menu-picker-component-card--info";
-function addMenuThumbnailPresentation(thumbnail) {
-  const thumbnailUrl = resolveAddMenuThumbnailUrl(thumbnail);
-  if (thumbnailUrl) {
+function addMenuPresentationFallbackThumb(item) {
+  const presentation = normalizeAddMenuPresentation(item);
+  if (!presentation) {
+    return { showThumbnail: false, showInfoIcon: true, thumbnailUrl: "" };
+  }
+  if (presentation.type === "image") {
+    const thumbnailUrl = resolveAddMenuThumbnailUrl(presentation.src) ?? "";
+    return {
+      showThumbnail: thumbnailUrl.length > 0,
+      showInfoIcon: thumbnailUrl.length === 0,
+      thumbnailUrl
+    };
+  }
+  if (presentation.type === "gif") {
+    const posterUrl = resolveAddMenuThumbnailUrl(presentation.poster) ?? "";
     return {
-      thumbnailUrl,
-      showThumbnail: true,
-      showInfoIcon: false,
-      cardCssClass: PREVIEW_CARD_CLASS,
-      isAnimatedThumbnail: isAddMenuThumbnailAnimated(thumbnail, thumbnailUrl)
+      showThumbnail: posterUrl.length > 0,
+      showInfoIcon: posterUrl.length === 0,
+      thumbnailUrl: posterUrl
     };
   }
+  return { showThumbnail: false, showInfoIcon: true, thumbnailUrl: "" };
+}
+function browseRowHasPreview(row) {
+  return row.showImage || row.showGifAutoplay === true || row.showGifPoster === true || row.showHtmlFragment;
+}
+function applyReducedMotionToBrowseRow(row, prefersReducedMotion) {
+  const showGifAutoplay = row.showGif && !prefersReducedMotion;
+  const showGifPoster = row.showGif && prefersReducedMotion && row.posterUrl.length > 0;
+  const showGifReducedInfoIcon = row.showGif && prefersReducedMotion && row.posterUrl.length === 0;
   return {
-    thumbnailUrl: void 0,
-    showThumbnail: false,
-    showInfoIcon: true,
-    cardCssClass: INFO_CARD_CLASS,
-    isAnimatedThumbnail: false
+    ...row,
+    showGifAutoplay,
+    showGifPoster,
+    showGifReducedInfoIcon
   };
 }
 function addMenuChipTooltip(title, subtitle) {
@@ -9925,13 +10000,115 @@ function addMenuChipTooltip(title, subtitle) {
   return `${label} — ${meta}`;
 }
 function addMenuChipVisualFields(item) {
-  const visual = addMenuThumbnailPresentation(item?.thumbnail);
+  const visual = addMenuPresentationFallbackThumb(item ?? {});
   return {
     showThumbnail: visual.showThumbnail,
     showInfoIcon: visual.showInfoIcon,
-    thumbnailUrl: visual.thumbnailUrl ?? ""
+    thumbnailUrl: visual.thumbnailUrl
   };
 }
+const ADD_MENU_FOLDER_NAV_ROOT = "__root__";
+const ADD_MENU_FOLDER_BREADCRUMB_ROOT_LABEL = "All";
+const FOLDER_NAV_SEP = "";
+const ADD_MENU_FOLDER_BREADCRUMB_MAX = 8;
+function normalizeItemFolderPath(item) {
+  if (!item.folderPath || item.folderPath.length === 0) return [];
+  return item.folderPath.map((segment) => segment.trim()).filter(Boolean);
+}
+function folderPathsEqual(a2, b) {
+  if (a2.length !== b.length) return false;
+  return a2.every((segment, index) => segment === b[index]);
+}
+function folderPathStartsWith(path, prefix) {
+  if (prefix.length > path.length) return false;
+  return prefix.every((segment, index) => path[index] === segment);
+}
+function folderNavKey(path) {
+  if (path.length === 0) return ADD_MENU_FOLDER_NAV_ROOT;
+  return path.join(FOLDER_NAV_SEP);
+}
+function parseFolderNavKey(navKey) {
+  if (!navKey || navKey === ADD_MENU_FOLDER_NAV_ROOT) return [];
+  return navKey.split(FOLDER_NAV_SEP);
+}
+function folderNodesAtPath(items, parentPath2) {
+  const childMap = /* @__PURE__ */ new Map();
+  for (const item of items) {
+    const itemPath = normalizeItemFolderPath(item);
+    if (!folderPathStartsWith(itemPath, parentPath2)) continue;
+    const relative = itemPath.slice(parentPath2.length);
+    if (relative.length === 0) continue;
+    const segment = relative[0];
+    const childPath = [...parentPath2, segment];
+    const childKey = folderNavKey(childPath);
+    let entry = childMap.get(childKey);
+    if (!entry) {
+      entry = { segment, path: childPath, direct: 0, total: 0 };
+      childMap.set(childKey, entry);
+    }
+    entry.total++;
+    if (relative.length === 1) entry.direct++;
+  }
+  return [...childMap.values()].sort((a2, b) => a2.segment.localeCompare(b.segment)).map(({ segment, path, direct, total }) => ({
+    segment,
+    path,
+    directItemCount: direct,
+    totalItemCount: total
+  }));
+}
+function leafItemsAtPath(items, path) {
+  return items.filter(
+    (item) => folderPathsEqual(normalizeItemFolderPath(item), path)
+  );
+}
+function folderRowsFromItems(items, parentPath2) {
+  return folderNodesAtPath(items, parentPath2).map((node) => ({
+    rowKey: folderNavKey(node.path),
+    navKey: folderNavKey(node.path),
+    segment: node.segment,
+    label: node.segment,
+    itemCountLabel: String(node.totalItemCount),
+    totalItemCount: node.totalItemCount
+  }));
+}
+function breadcrumbSegmentsForPath(path) {
+  if (path.length === 0) return [];
+  const displayPath = path.length > ADD_MENU_FOLDER_BREADCRUMB_MAX ? [
+    "...",
+    ...path.slice(path.length - (ADD_MENU_FOLDER_BREADCRUMB_MAX - 1))
+  ] : [...path];
+  const startIndex = path.length > ADD_MENU_FOLDER_BREADCRUMB_MAX ? path.length - (ADD_MENU_FOLDER_BREADCRUMB_MAX - 1) : 0;
+  const folderSegments = displayPath.map((label, index) => {
+    const isEllipsis = label === "...";
+    const pathPrefix = isEllipsis ? path.slice(0, startIndex) : path.slice(0, startIndex + index + 1);
+    const isLast = index === displayPath.length - 1;
+    return {
+      segmentKey: `${folderNavKey(pathPrefix)}:${index}`,
+      navKey: folderNavKey(pathPrefix),
+      label,
+      isLast
+    };
+  });
+  return [
+    {
+      segmentKey: `${ADD_MENU_FOLDER_NAV_ROOT}:root`,
+      navKey: ADD_MENU_FOLDER_NAV_ROOT,
+      label: ADD_MENU_FOLDER_BREADCRUMB_ROOT_LABEL,
+      isLast: false
+    },
+    ...folderSegments
+  ];
+}
+function addMenuSearchDisplayTitle(item) {
+  const folderPath = normalizeItemFolderPath(item);
+  if (folderPath.length === 0) return item.title;
+  return `${folderPath.join(" / ")} / ${item.title}`;
+}
+function folderPathMatchesSearch(item, queryLower) {
+  return normalizeItemFolderPath(item).some(
+    (segment) => segment.toLowerCase().includes(queryLower)
+  );
+}
 function addMenuInteractionMode(item) {
   return item.interaction?.mode ?? "reference";
 }
@@ -9948,6 +10125,139 @@ function appendAssetMentionToStagePrompt(stagePrompt, insertTitle) {
 function isStagePlaceItem(item) {
   return addMenuInteractionMode(item) === "stage-place";
 }
+function normalizeAddMenuBrowseSize(item) {
+  return item.browse?.size ?? "medium";
+}
+const ROW_SLOT_CAPACITY = 8;
+function slotsForSize(size) {
+  if (size === "large") return 8;
+  if (size === "medium") return 4;
+  return 1;
+}
+function slotsFreeInRow(row) {
+  return ROW_SLOT_CAPACITY - row.slotsUsed;
+}
+function trailingFourItemsAreSmall(row, sizes) {
+  const { itemIndices } = row;
+  if (itemIndices.length < 4) return false;
+  for (let offset = 0; offset < 4; offset++) {
+    const itemIndex = itemIndices[itemIndices.length - 4 + offset];
+    if (sizes[itemIndex] !== "small") return false;
+  }
+  return true;
+}
+function fillRow(row, sizes, startIndex) {
+  let itemIndex = startIndex;
+  while (itemIndex < sizes.length) {
+    if (trailingFourItemsAreSmall(row, sizes)) {
+      const peekRow = { itemIndices: [], slotsUsed: 0 };
+      fillRow(peekRow, sizes, itemIndex);
+      if (peekRow.slotsUsed === ROW_SLOT_CAPACITY) {
+        break;
+      }
+    }
+    const itemSlotCount = slotsForSize(sizes[itemIndex]);
+    if (itemSlotCount > slotsFreeInRow(row)) {
+      break;
+    }
+    row.itemIndices.push(itemIndex);
+    row.slotsUsed += itemSlotCount;
+    itemIndex++;
+  }
+  return itemIndex;
+}
+function packRows(sizes) {
+  const rows = [];
+  let itemIndex = 0;
+  while (itemIndex < sizes.length) {
+    const row = { itemIndices: [], slotsUsed: 0 };
+    itemIndex = fillRow(row, sizes, itemIndex);
+    if (row.itemIndices.length > 0) {
+      rows.push(row);
+    }
+  }
+  return rows;
+}
+function rowToMediumSlots(itemIndices, sizes) {
+  const slots = [];
+  let position2 = 0;
+  while (position2 < itemIndices.length) {
+    const catalogIndex = itemIndices[position2];
+    const size = sizes[catalogIndex];
+    if (size === "medium") {
+      slots.push({ kind: "medium", index: catalogIndex });
+      position2++;
+      continue;
+    }
+    if (size === "large") {
+      slots.push({ kind: "large", index: catalogIndex });
+      position2++;
+      continue;
+    }
+    const smallIndices = [];
+    while (position2 < itemIndices.length) {
+      const smallCatalogIndex = itemIndices[position2];
+      if (sizes[smallCatalogIndex] !== "small") break;
+      smallIndices.push(smallCatalogIndex);
+      position2++;
+    }
+    slots.push({ kind: "small-quad", indices: smallIndices });
+  }
+  return slots;
+}
+function isThreeSlotLayout(slots) {
+  return slots.length === 3 && slots[0]?.kind === "small-quad" && slots[1]?.kind === "medium" && slots[2]?.kind === "small-quad";
+}
+function rowToBand(row, sizes) {
+  const { itemIndices } = row;
+  if (itemIndices.length === 1 && sizes[itemIndices[0]] === "large") {
+    return {
+      kind: "medium-band",
+      slots: [{ kind: "large", index: itemIndices[0] }]
+    };
+  }
+  if (itemIndices.every((catalogIndex) => sizes[catalogIndex] === "small")) {
+    return { kind: "small-strip", indices: [...itemIndices] };
+  }
+  const slots = rowToMediumSlots(itemIndices, sizes);
+  return {
+    kind: "medium-band",
+    slots,
+    threeSlotLayout: isThreeSlotLayout(slots)
+  };
+}
+function packSizes(sizes) {
+  return packRows(sizes).map((row) => rowToBand(row, sizes));
+}
+function toLayoutBand(band, bandIndex) {
+  const bandKey = `band:${bandIndex}`;
+  if (band.kind === "small-strip") {
+    return {
+      bandKey,
+      kind: "small-strip",
+      itemIndices: band.indices
+    };
+  }
+  const slots = band.slots.map((slot, slotIndex) => {
+    const slotKey = `${bandKey}:slot:${slotIndex}`;
+    if (slot.kind === "medium") {
+      return { slotKey, kind: "medium", itemIndex: slot.index };
+    }
+    if (slot.kind === "large") {
+      return { slotKey, kind: "large", itemIndex: slot.index };
+    }
+    return { slotKey, kind: "small-quad", itemIndices: slot.indices };
+  });
+  return {
+    bandKey,
+    kind: "medium-band",
+    slots,
+    threeSlotLayout: band.threeSlotLayout
+  };
+}
+function packAddMenuBrowseLayout(sizes) {
+  return packSizes(sizes).map(toLayoutBand);
+}
 function groupAddMenuItems(items) {
   const byCategory = /* @__PURE__ */ new Map();
   for (const item of items) {
@@ -9969,7 +10279,7 @@ function groupAddMenuItems(items) {
       return sa.localeCompare(sb);
     }).map(([subCategory, subItems]) => ({
       subCategory,
-      items: subItems.sort((a2, b) => a2.title.localeCompare(b.title))
+      items: subItems
     }))
   }));
 }
@@ -9981,6 +10291,8 @@ const SUB_CATEGORY_SORT_ORDER = [
   "Animation"
 ];
 const PICKABLE_CARD_CLASS = "add-menu-picker-component-card";
+const PREVIEW_CARD_CLASS = "add-menu-picker-component-card add-menu-picker-component-card--preview";
+const INFO_CARD_CLASS = "add-menu-picker-component-card add-menu-picker-component-card--info";
 const STAGE_PLACE_CARD_CLASS = "add-menu-picker-component-card--stage-place";
 function stagePlaceCardClass(cardClass, isStagePlace) {
   return isStagePlace ? `${cardClass} ${STAGE_PLACE_CARD_CLASS}` : cardClass;
@@ -9991,26 +10303,71 @@ function thumbCssClass(isAnimated, isSelected) {
   if (isSelected) parts.push("add-menu-picker-component-thumb--selected");
   return parts.join(" ");
 }
-function toPickableRow(item) {
-  const visual = addMenuThumbnailPresentation(item.thumbnail);
+function emptyBrowseRowFields() {
+  return {
+    showImage: false,
+    showGif: false,
+    showHtmlFragment: false,
+    imageUrl: "",
+    gifUrl: "",
+    posterUrl: "",
+    previewHtml: "",
+    showGifAutoplay: false,
+    showGifPoster: false,
+    showGifReducedInfoIcon: false,
+    showThumbnail: false,
+    showInfoIcon: false,
+    thumbnailUrl: "",
+    isAnimatedThumbnail: false,
+    thumbCssClass: ""
+  };
+}
+function cardClassForBrowseVisual(row) {
+  if (browseRowHasPreview(row)) return PREVIEW_CARD_CLASS;
+  if (row.showInfoIcon || row.showGifReducedInfoIcon) return INFO_CARD_CLASS;
+  return PICKABLE_CARD_CLASS;
+}
+function sizeCssModifier(size) {
+  return `add-menu-picker-component-card--size-${size}`;
+}
+function cardClassWithBrowseSize(baseCardClass, browseSize) {
+  return `${baseCardClass} ${sizeCssModifier(browseSize)}`;
+}
+function toPickableRow(item, prefersReducedMotion = false, labelOverride) {
+  const browseSize = normalizeAddMenuBrowseSize(item);
+  const presentation = applyReducedMotionToBrowseRow(
+    addMenuPresentationFields(item),
+    prefersReducedMotion
+  );
   const stagePlace = isStagePlaceItem(item);
-  const baseCardClass = visual.showThumbnail ? visual.cardCssClass : PICKABLE_CARD_CLASS;
+  const showThumbnail = presentation.showImage;
+  const thumbnailUrl = presentation.imageUrl;
+  const showInfoIcon = !browseRowHasPreview(presentation) && !presentation.showGifReducedInfoIcon && !presentation.showGif;
+  const baseCardClass = cardClassForBrowseVisual({
+    ...presentation,
+    showInfoIcon: showInfoIcon || presentation.showGifReducedInfoIcon
+  });
   return {
     rowKey: item.id,
     isSectionHeader: false,
-    label: item.title,
+    label: labelOverride ?? item.title,
     itemId: item.id,
     isPickable: true,
     showPickable: true,
     showBrowseOnly: false,
     isItemSelected: false,
-    cardCssClass: stagePlaceCardClass(baseCardClass, stagePlace),
-    showThumbnail: visual.showThumbnail,
-    showInfoIcon: visual.showInfoIcon,
-    thumbnailUrl: visual.thumbnailUrl ?? "",
-    isAnimatedThumbnail: visual.isAnimatedThumbnail,
-    thumbCssClass: thumbCssClass(visual.isAnimatedThumbnail, false),
-    isStagePlace: stagePlace
+    cardCssClass: cardClassWithBrowseSize(
+      stagePlaceCardClass(baseCardClass, stagePlace),
+      browseSize
+    ),
+    ...presentation,
+    showThumbnail,
+    showInfoIcon: showInfoIcon || presentation.showGifReducedInfoIcon,
+    thumbnailUrl,
+    isAnimatedThumbnail: presentation.showGif || presentation.showGifAutoplay,
+    thumbCssClass: thumbCssClass(presentation.showGif, false),
+    isStagePlace: stagePlace,
+    browseSize
   };
 }
 function sectionHeaderRow(subCategory) {
@@ -10024,12 +10381,9 @@ function sectionHeaderRow(subCategory) {
     showBrowseOnly: false,
     isItemSelected: false,
     cardCssClass: "",
-    showThumbnail: false,
-    showInfoIcon: false,
-    thumbnailUrl: "",
-    isAnimatedThumbnail: false,
-    thumbCssClass: "",
-    isStagePlace: false
+    ...emptyBrowseRowFields(),
+    isStagePlace: false,
+    browseSize: "medium"
   };
 }
 function formatSelectionCountSuffix(count) {
@@ -10043,40 +10397,198 @@ function countSelectedItems(items, selectedIds) {
   }
   return count;
 }
-function applySelectionToBrowseRows(rows, selectedIds) {
+function sectionHeaderBlock(subCategory) {
+  const header = sectionHeaderRow(subCategory);
+  return {
+    blockKey: header.rowKey,
+    kind: "section-header",
+    showSectionHeader: true,
+    showBand: false,
+    sectionLabel: header.label,
+    bandKind: "",
+    bandCssClass: "",
+    showSmallStrip: false,
+    showMediumBand: false,
+    stripCells: [],
+    bandSlots: []
+  };
+}
+function slotViewStateFromRow(slot, row) {
+  return {
+    ...row,
+    slotKey: slot.slotKey,
+    slotKind: slot.kind,
+    slotCssClass: slot.kind === "large" ? "add-menu-browse-slot add-menu-browse-slot--large" : "add-menu-browse-slot",
+    showMediumSlot: slot.kind === "medium",
+    showLargeSlot: slot.kind === "large",
+    showSmallQuad: false,
+    quadRows: []
+  };
+}
+function quadSlotViewState(slot, quadRows) {
+  const placeholder = quadRows[0] ?? emptyPickableRow();
+  return {
+    ...placeholder,
+    rowKey: slot.slotKey,
+    itemId: "",
+    label: "",
+    isPickable: false,
+    showPickable: false,
+    cardCssClass: "",
+    slotKey: slot.slotKey,
+    slotKind: "small-quad",
+    slotCssClass: "add-menu-browse-slot",
+    showMediumSlot: false,
+    showLargeSlot: false,
+    showSmallQuad: true,
+    quadRows
+  };
+}
+function withSequentialBandKey(band, bandSequence) {
+  const bandKey = `band:${bandSequence}`;
+  if (band.kind === "small-strip") {
+    return { ...band, bandKey };
+  }
+  return {
+    ...band,
+    bandKey,
+    slots: band.slots.map((slot, slotIndex) => ({
+      ...slot,
+      slotKey: `${bandKey}:slot:${slotIndex}`
+    }))
+  };
+}
+function bandBlockFromLayout(band, rows) {
+  if (band.kind === "small-strip") {
+    const stripCells = band.itemIndices.map((index) => rows[index]);
+    return {
+      blockKey: band.bandKey,
+      kind: "band",
+      showSectionHeader: false,
+      showBand: true,
+      sectionLabel: "",
+      bandKind: "small-strip",
+      bandCssClass: "add-menu-browse-band add-menu-browse-band--small-strip",
+      showSmallStrip: true,
+      showMediumBand: false,
+      stripCells,
+      bandSlots: []
+    };
+  }
+  const bandSlots = band.slots.map((slot) => {
+    if (slot.kind === "medium") {
+      return slotViewStateFromRow(slot, rows[slot.itemIndex]);
+    }
+    if (slot.kind === "large") {
+      return slotViewStateFromRow(slot, rows[slot.itemIndex]);
+    }
+    return quadSlotViewState(
+      slot,
+      slot.itemIndices.map((index) => rows[index])
+    );
+  });
+  const threeSlotLayout = band.kind === "medium-band" && band.threeSlotLayout === true;
+  return {
+    blockKey: band.bandKey,
+    kind: "band",
+    showSectionHeader: false,
+    showBand: true,
+    sectionLabel: "",
+    bandKind: "medium-band",
+    bandCssClass: threeSlotLayout ? "add-menu-browse-band add-menu-browse-band--medium-band add-menu-browse-band--slots-3" : "add-menu-browse-band add-menu-browse-band--medium-band",
+    showSmallStrip: false,
+    showMediumBand: true,
+    stripCells: [],
+    bandSlots
+  };
+}
+function emptyPickableRow() {
+  return {
+    rowKey: "",
+    isSectionHeader: false,
+    label: "",
+    itemId: "",
+    isPickable: false,
+    showPickable: false,
+    showBrowseOnly: false,
+    isItemSelected: false,
+    cardCssClass: "",
+    ...emptyBrowseRowFields(),
+    isStagePlace: false,
+    browseSize: "small"
+  };
+}
+function pickableRowsInBlock(block) {
+  if (block.showSectionHeader) return [];
+  if (block.showSmallStrip) return block.stripCells;
+  const rows = [];
+  for (const slot of block.bandSlots) {
+    if (slot.showMediumSlot || slot.showLargeSlot) rows.push(slot);
+    if (slot.showSmallQuad) rows.push(...slot.quadRows);
+  }
+  return rows;
+}
+function mapBrowseBlockRows(block, mapRow) {
+  if (block.showSectionHeader) return block;
+  if (block.showSmallStrip) {
+    return { ...block, stripCells: block.stripCells.map(mapRow) };
+  }
+  return {
+    ...block,
+    bandSlots: block.bandSlots.map((slot) => {
+      if (slot.showSmallQuad) {
+        return { ...slot, quadRows: slot.quadRows.map(mapRow) };
+      }
+      return { ...slot, ...mapRow(slot) };
+    })
+  };
+}
+function applySelectionToBrowseBlocks(blocks, selectedIds) {
   const sectionSelectedCounts = /* @__PURE__ */ new Map();
+  for (const block of blocks) {
+    if (!block.showSectionHeader) continue;
+    sectionSelectedCounts.set(block.blockKey, 0);
+  }
   let currentSectionKey = "";
-  for (const row of rows) {
-    if (row.isSectionHeader) {
-      currentSectionKey = row.rowKey;
-      sectionSelectedCounts.set(currentSectionKey, 0);
+  for (const block of blocks) {
+    if (block.showSectionHeader) {
+      currentSectionKey = block.blockKey;
       continue;
     }
-    if (row.isPickable && selectedIds.has(row.itemId) && currentSectionKey) {
-      sectionSelectedCounts.set(
-        currentSectionKey,
-        (sectionSelectedCounts.get(currentSectionKey) ?? 0) + 1
-      );
+    for (const row of pickableRowsInBlock(block)) {
+      if (selectedIds.has(row.itemId) && currentSectionKey) {
+        sectionSelectedCounts.set(
+          currentSectionKey,
+          (sectionSelectedCounts.get(currentSectionKey) ?? 0) + 1
+        );
+      }
     }
   }
-  return rows.map((row) => {
-    if (row.isSectionHeader) {
-      const selectedCount = sectionSelectedCounts.get(row.rowKey) ?? 0;
+  return blocks.map((block) => {
+    if (block.showSectionHeader) {
+      const selectedCount = sectionSelectedCounts.get(block.blockKey) ?? 0;
       return {
-        ...row,
-        label: row.label + formatSelectionCountSuffix(selectedCount)
+        ...block,
+        sectionLabel: (block.sectionLabel.split(" · ")[0] ?? block.sectionLabel) + formatSelectionCountSuffix(selectedCount)
       };
     }
-    if (!row.isPickable) return row;
-    const isItemSelected = selectedIds.has(row.itemId);
-    const baseCardClass = row.showThumbnail ? "add-menu-picker-component-card add-menu-picker-component-card--preview" : row.showInfoIcon ? "add-menu-picker-component-card add-menu-picker-component-card--info" : PICKABLE_CARD_CLASS;
-    const cardClass = stagePlaceCardClass(baseCardClass, row.isStagePlace);
-    return {
-      ...row,
-      isItemSelected,
-      cardCssClass: isItemSelected ? `${cardClass} add-menu-picker-component-card--selected` : cardClass,
-      thumbCssClass: thumbCssClass(row.isAnimatedThumbnail, isItemSelected)
-    };
+    return mapBrowseBlockRows(block, (row) => {
+      if (!row.isPickable) return row;
+      const isItemSelected = selectedIds.has(row.itemId);
+      const cardClass = stagePlaceCardClass(
+        cardClassForBrowseVisual(row),
+        row.isStagePlace
+      );
+      return {
+        ...row,
+        isItemSelected,
+        cardCssClass: isItemSelected ? `${cardClassWithBrowseSize(cardClass, row.browseSize)} add-menu-picker-component-card--selected` : cardClassWithBrowseSize(cardClass, row.browseSize),
+        thumbCssClass: thumbCssClass(
+          row.showGif || row.showGifAutoplay,
+          isItemSelected
+        )
+      };
+    });
   });
 }
 function applySelectionToLeftNavRows(rows, items, selectedIds) {
@@ -10172,6 +10684,7 @@ function subCategoryFilterRows(subs, selectedSubCategory, options = {}) {
   );
   const populated = sorted.filter((sub) => sub.items.length > 0);
   if (populated.length === 0) return [];
+  if (populated.length <= 1) return [];
   const allCount = populated.reduce(
     (sum, sub) => sum + subCategoryItemCount(sub),
     0
@@ -10239,7 +10752,58 @@ function leftNavRowsForBrowse(tree, selectedCategory) {
     };
   });
 }
-function browseRowsFromSubCategories(subs, selectedSubCategory) {
+function pickableItemsForCategorySubCategory(group, selectedSubCategory) {
+  if (isAllSubCategoryFilter(selectedSubCategory)) {
+    return group.subCategories.flatMap((sub2) => sub2.items).filter(isPickableAddMenuItem);
+  }
+  const sub = group.subCategories.find(
+    (entry) => (entry.subCategory ?? "") === (selectedSubCategory ?? "")
+  );
+  return (sub?.items ?? []).filter(isPickableAddMenuItem);
+}
+function browseBlocksFromLeafItems(leafItems, selectedSubCategory, prefersReducedMotion, useSearchLabels) {
+  const bySubCategory = /* @__PURE__ */ new Map();
+  for (const item of leafItems) {
+    const key = item.subCategory ?? null;
+    const list = bySubCategory.get(key) ?? [];
+    list.push(item);
+    bySubCategory.set(key, list);
+  }
+  const subs = [...bySubCategory.entries()].map(([subCategory, items]) => ({
+    subCategory,
+    items
+  }));
+  return browseBlocksFromSubCategories(
+    subs,
+    selectedSubCategory,
+    prefersReducedMotion,
+    useSearchLabels
+  );
+}
+function browseViewForBrowse(tree, selectedCategory, selectedSubCategory = null, prefersReducedMotion = false, selectedFolderPath = []) {
+  const group = categoryGroupForTree(tree, selectedCategory);
+  if (!group) {
+    return { folderRows: [], breadcrumbSegments: [], blocks: [] };
+  }
+  const scopedItems = pickableItemsForCategorySubCategory(
+    group,
+    selectedSubCategory
+  );
+  const folderRows = folderRowsFromItems(scopedItems, selectedFolderPath);
+  const leafItems = leafItemsAtPath(scopedItems, selectedFolderPath);
+  const blocks = browseBlocksFromLeafItems(
+    leafItems,
+    selectedSubCategory,
+    prefersReducedMotion,
+    false
+  );
+  return {
+    folderRows,
+    breadcrumbSegments: breadcrumbSegmentsForPath(selectedFolderPath),
+    blocks
+  };
+}
+function browseBlocksFromSubCategories(subs, selectedSubCategory, prefersReducedMotion = false, useSearchLabels = false) {
   const sorted = [...subs].sort(
     (a2, b) => compareSubCategoryNames(a2.subCategory, b.subCategory)
   );
@@ -10251,27 +10815,42 @@ function browseRowsFromSubCategories(subs, selectedSubCategory) {
     (sub) => sub.items.filter(isPickableAddMenuItem).length > 0
   );
   const showSectionHeaders = filterAll && populated.length > 1;
-  const rows = [];
+  const blocks = [];
+  let bandSequence = 0;
   for (const sub of populated) {
     const pickable = sub.items.filter(isPickableAddMenuItem);
     if (pickable.length === 0) continue;
     if (showSectionHeaders) {
-      rows.push(sectionHeaderRow(sub.subCategory));
+      blocks.push(sectionHeaderBlock(sub.subCategory));
     }
-    for (const item of pickable) {
-      rows.push(toPickableRow(item));
+    const rows = pickable.map(
+      (item) => toPickableRow(
+        item,
+        prefersReducedMotion,
+        useSearchLabels ? addMenuSearchDisplayTitle(item) : void 0
+      )
+    );
+    const sizes = pickable.map((item) => normalizeAddMenuBrowseSize(item));
+    const bands = packAddMenuBrowseLayout(sizes);
+    for (const band of bands) {
+      blocks.push(
+        bandBlockFromLayout(withSequentialBandKey(band, bandSequence++), rows)
+      );
     }
   }
-  return rows;
-}
-function browseRowsForBrowse(tree, selectedCategory, selectedSubCategory = null) {
-  const group = categoryGroupForTree(tree, selectedCategory);
-  if (!group) return [];
-  return browseRowsFromSubCategories(group.subCategories, selectedSubCategory);
+  return blocks;
 }
 function browseTitleForSelection(tree, selectedCategory) {
   const group = categoryGroupForTree(tree, selectedCategory);
-  return group?.category ?? selectedCategory;
+  if (!group) return selectedCategory;
+  const populated = group.subCategories.filter((sub) => sub.items.length > 0);
+  if (populated.length === 1) {
+    const onlyBucket = populated[0];
+    if (onlyBucket.subCategory != null && onlyBucket.subCategory !== "") {
+      return onlyBucket.subCategory;
+    }
+  }
+  return group.category;
 }
 function inferBrowseCategoryFromItems(itemIds, itemById) {
   for (let i = itemIds.length - 1; i >= 0; i--) {
@@ -10283,7 +10862,7 @@ function inferBrowseCategoryFromItems(itemIds, itemById) {
 function matchesAddMenuSearch(item, query) {
   const q = query.trim().toLowerCase();
   if (!q) return false;
-  return item.title.toLowerCase().includes(q) || item.category.toLowerCase().includes(q) || (item.subCategory ?? "").toLowerCase().includes(q) || item.id.toLowerCase().includes(q) || pluginNameForItem(item).toLowerCase().includes(q);
+  return item.title.toLowerCase().includes(q) || item.category.toLowerCase().includes(q) || (item.subCategory ?? "").toLowerCase().includes(q) || folderPathMatchesSearch(item, q) || item.id.toLowerCase().includes(q) || pluginNameForItem(item).toLowerCase().includes(q);
 }
 function searchAddMenuItems(items, query) {
   const q = query.trim();
@@ -10298,9 +10877,6 @@ function groupSearchItemsBySubCategory(items) {
     list.push(item);
     map2.set(key, list);
   }
-  for (const list of map2.values()) {
-    list.sort((a2, b) => a2.title.localeCompare(b.title));
-  }
   return map2;
 }
 function searchSubCategoryFilterRows(items, selectedSubCategory) {
@@ -10314,40 +10890,93 @@ function searchSubCategoryFilterRows(items, selectedSubCategory) {
     showCounts: true
   });
 }
-function searchBrowseRows(items, selectedSubCategory) {
+function searchBrowseBlocks(items, selectedSubCategory, prefersReducedMotion = false) {
   if (items.length === 0) return [];
   const grouped = groupSearchItemsBySubCategory(items);
   const subs = [...grouped.entries()].map(([subCategory, subItems]) => ({
     subCategory: subCategory === "" ? null : subCategory,
     items: subItems
   }));
-  return browseRowsFromSubCategories(subs, selectedSubCategory);
+  return browseBlocksFromSubCategories(
+    subs,
+    selectedSubCategory,
+    prefersReducedMotion,
+    true
+  );
+}
+function countBrowsableEntries(folderRows, blocks) {
+  return folderRows.length + countPickableBrowseBlocks(blocks);
+}
+function paginateBrowseView(folderRows, blocks, visibleLimit) {
+  if (visibleLimit <= 0) {
+    return { folderRows: [], blocks: [] };
+  }
+  const visibleFolders = folderRows.slice(0, visibleLimit);
+  const remaining = visibleLimit - visibleFolders.length;
+  return {
+    folderRows: visibleFolders,
+    blocks: paginateBrowseBlocks(blocks, remaining)
+  };
 }
-function countPickableBrowseRows(rows) {
+function countPickableBrowseBlocks(blocks) {
   let count = 0;
-  for (const row of rows) {
-    if (row.isPickable) count++;
+  for (const block of blocks) {
+    count += pickableRowsInBlock(block).length;
   }
   return count;
 }
-function paginateBrowseRows(rows, visiblePickableLimit) {
+function truncateBrowseBlock(block, limit) {
+  if (block.showSectionHeader || limit <= 0) return null;
+  if (block.showSmallStrip) {
+    const stripCells = block.stripCells.slice(0, limit);
+    if (stripCells.length === 0) return null;
+    return { ...block, stripCells };
+  }
+  if (!block.showMediumBand) return null;
+  let remaining = limit;
+  const bandSlots = [];
+  for (const slot of block.bandSlots) {
+    if (remaining <= 0) break;
+    if (slot.showSmallQuad) {
+      const quadRows = slot.quadRows.slice(0, remaining);
+      if (quadRows.length === 0) break;
+      remaining -= quadRows.length;
+      bandSlots.push({ ...slot, quadRows });
+      continue;
+    }
+    if (slot.showMediumSlot || slot.showLargeSlot) {
+      bandSlots.push(slot);
+      remaining -= 1;
+    }
+  }
+  if (bandSlots.length === 0) return null;
+  return { ...block, bandSlots };
+}
+function paginateBrowseBlocks(blocks, visiblePickableLimit) {
   if (visiblePickableLimit <= 0) return [];
   const result = [];
   let pickableCount = 0;
   let pendingHeader = null;
-  for (const row of rows) {
-    if (row.isSectionHeader) {
-      pendingHeader = row;
+  for (const block of blocks) {
+    if (block.showSectionHeader) {
+      pendingHeader = block;
       continue;
     }
-    if (!row.isPickable) continue;
-    if (pickableCount >= visiblePickableLimit) break;
+    const rows = pickableRowsInBlock(block);
+    if (rows.length === 0) continue;
+    const remaining = visiblePickableLimit - pickableCount;
+    if (remaining <= 0) break;
+    const blockToAdd = rows.length > remaining ? truncateBrowseBlock(block, remaining) : block;
+    if (!blockToAdd) break;
+    const added = pickableRowsInBlock(blockToAdd).length;
+    if (added === 0) break;
     if (pendingHeader) {
       result.push(pendingHeader);
       pendingHeader = null;
     }
-    result.push(row);
-    pickableCount++;
+    result.push(blockToAdd);
+    pickableCount += added;
+    if (pickableCount >= visiblePickableLimit) break;
   }
   return result;
 }
@@ -10808,13 +11437,15 @@ function initAddPageComposer(deps) {
   const addPageContentTabClass = createMemo(() => {
     const parts = ["add-page-tab"];
     if (showAddPageContentTab()) parts.push("add-page-tab--active");
-    if (briefFillPanel.contentGenerating()) parts.push("add-page-tab--generating");
+    if (briefFillPanel.contentGenerating())
+      parts.push("add-page-tab--generating");
     return parts.join(" ");
   });
   const addPageDesignTabClass = createMemo(() => {
     const parts = ["add-page-tab"];
     if (showAddPageDesignTab()) parts.push("add-page-tab--active");
-    if (briefFillPanel.designGenerating()) parts.push("add-page-tab--generating");
+    if (briefFillPanel.designGenerating())
+      parts.push("add-page-tab--generating");
     return parts.join(" ");
   });
   function trackTextareaSelection(el) {
@@ -11607,10 +12238,7 @@ function isMarkerImageAttachment(file) {
   return file.type.startsWith("image/") || file.type === "";
 }
 function insertAttachmentReferenceAtCursor(textarea, currentValue, text, selection) {
-  const start = Math.max(
-    0,
-    Math.min(selection.start, currentValue.length)
-  );
+  const start = Math.max(0, Math.min(selection.start, currentValue.length));
   const end = Math.max(start, Math.min(selection.end, currentValue.length));
   const before = currentValue.slice(0, start);
   const after = currentValue.slice(end);
@@ -11637,7 +12265,7 @@ function insertTitleForAsset(asset, assets) {
   return count >= 2 ? `${asset.title}|${asset.id}` : asset.title;
 }
 function assetMentionOptionFromItem(item, pageAssets) {
-  const visual = addMenuThumbnailPresentation(item.thumbnail);
+  const visual = addMenuPresentationFallbackThumb(item);
   const existing = pageAssets.find(
     (asset) => asset.itemId === item.id || asset.id === item.id
   );
@@ -11654,167 +12282,170 @@ function assetMentionOptionFromItem(item, pageAssets) {
     showInfoIcon: visual.showInfoIcon
   };
 }
-function itemsForPlugin(items, pluginName) {
-  return items.filter((item) => pluginNameForItem(item) === pluginName);
-}
-function itemsForCategory(items, pluginName, category) {
-  return itemsForPlugin(items, pluginName).filter(
-    (item) => item.category === category
+function itemsInSubCategory(items, category, subCategory) {
+  const group = catalogTreeForItems(items).find((g) => g.category === category);
+  const sub = group?.subCategories.find(
+    (entry) => (entry.subCategory ?? null) === subCategory
   );
+  return sub?.items ?? [];
 }
-function itemsForSubCategory(items, pluginName, category, subCategory) {
-  return itemsForCategory(items, pluginName, category).filter(
-    (item) => (item.subCategory ?? null) === subCategory
-  );
+function categoryRows(items) {
+  return catalogTreeForItems(items).map((group) => {
+    const itemCount = group.subCategories.reduce(
+      (sum, sub) => sum + sub.items.length,
+      0
+    );
+    return {
+      kind: "nav",
+      rowKey: `category:${group.category}`,
+      label: group.category,
+      itemCount,
+      nextPath: { category: group.category }
+    };
+  });
 }
-function pluginRows(items) {
-  const map2 = /* @__PURE__ */ new Map();
-  for (const item of items) {
-    const pluginName = pluginNameForItem(item);
-    const existing = map2.get(pluginName);
-    if (existing) {
-      existing.count++;
-    } else {
-      map2.set(pluginName, {
-        packageName: item.packageName ?? pluginName,
-        count: 1
-      });
-    }
-  }
-  return [...map2.entries()].sort(([a2], [b]) => a2.localeCompare(b)).map(([pluginName, { packageName, count }]) => ({
+function subCategoryRows(items, category) {
+  const group = catalogTreeForItems(items).find((g) => g.category === category);
+  if (!group) return [];
+  return [...group.subCategories].sort((a2, b) => compareSubCategoryNames(a2.subCategory, b.subCategory)).map((sub) => ({
     kind: "nav",
-    rowKey: `plugin:${pluginName}`,
-    label: pluginName,
-    subtitle: packageName,
-    itemCount: count,
-    nextPath: { pluginName }
+    rowKey: `sub:${category}:${sub.subCategory ?? ""}`,
+    label: sub.subCategory ?? "General",
+    subtitle: category,
+    itemCount: sub.items.length,
+    nextPath: { category, subCategory: sub.subCategory }
   }));
 }
-function categoryRows(items, pluginName) {
-  const map2 = /* @__PURE__ */ new Map();
-  for (const item of itemsForPlugin(items, pluginName)) {
-    map2.set(item.category, (map2.get(item.category) ?? 0) + 1);
-  }
-  return [...map2.entries()].sort(([a2], [b]) => a2.localeCompare(b)).map(([category, count]) => ({
-    kind: "nav",
-    rowKey: `category:${pluginName}:${category}`,
-    label: category,
-    subtitle: pluginName,
-    itemCount: count,
-    nextPath: { pluginName, category }
-  }));
+function leafRows(items, pageAssets, useSearchLabels = false) {
+  return items.map((item) => {
+    const option = assetMentionOptionFromItem(item, pageAssets);
+    return {
+      kind: "leaf",
+      rowKey: item.id,
+      option: useSearchLabels ? { ...option, title: addMenuSearchDisplayTitle(item) } : option,
+      item
+    };
+  });
 }
-function subCategoryRows(items, pluginName, category) {
-  const map2 = /* @__PURE__ */ new Map();
-  for (const item of itemsForCategory(items, pluginName, category)) {
-    const key = item.subCategory ?? null;
-    map2.set(key, (map2.get(key) ?? 0) + 1);
-  }
-  return [...map2.entries()].sort(([a2], [b]) => compareSubCategoryNames(a2, b)).map(([subCategory, count]) => ({
+function hasChildFolders(items, folderPath) {
+  return folderRowsFromItems(items, folderPath).length > 0;
+}
+function folderNavRows(folders, basePath) {
+  return folders.map((folder) => ({
     kind: "nav",
-    rowKey: `sub:${pluginName}:${category}:${subCategory ?? ""}`,
-    label: subCategory ?? "General",
-    subtitle: category,
-    itemCount: count,
-    nextPath: { pluginName, category, subCategory }
+    rowKey: `folder:${folder.rowKey}`,
+    label: folder.label,
+    itemCount: folder.totalItemCount,
+    nextPath: {
+      ...basePath,
+      folderPath: parseFolderNavKey(folder.navKey)
+    }
   }));
 }
-function leafRows(items, pageAssets) {
-  return [...items].sort((a2, b) => a2.title.localeCompare(b.title)).map((item) => ({
-    kind: "leaf",
-    rowKey: item.id,
-    option: assetMentionOptionFromItem(item, pageAssets),
-    item
-  }));
+function folderAndLeafRows(scopedItems, folderPath, path, pageAssets) {
+  const folders = folderRowsFromItems(scopedItems, folderPath);
+  const leaves = leafItemsAtPath(scopedItems, folderPath);
+  return [
+    backRow(backLabelForPath(path)),
+    ...folderNavRows(folders, path),
+    ...leafRows(leaves, pageAssets)
+  ];
 }
 function backRow(label) {
   return { kind: "back", rowKey: "__back__", label };
 }
+function pathWithoutFolderPath(path) {
+  const { folderPath: _folderPath, ...rest } = path;
+  return rest;
+}
 function parentPath(path) {
+  const folderPath = path.folderPath ?? [];
+  if (folderPath.length > 0) {
+    const parentFolderPath = folderPath.slice(0, -1);
+    const base = pathWithoutFolderPath(path);
+    return parentFolderPath.length > 0 ? { ...base, folderPath: parentFolderPath } : base;
+  }
   if (path.subCategory !== void 0) {
-    return { pluginName: path.pluginName, category: path.category };
+    return { category: path.category };
   }
   if (path.category) {
-    return { pluginName: path.pluginName };
-  }
-  if (path.pluginName) {
     return {};
   }
   return {};
 }
 function mentionHeaderTitle(path) {
-  if (path.subCategory !== void 0 && path.category && path.pluginName) {
-    const sub = path.subCategory ?? "General";
-    return `${path.pluginName} › ${path.category} › ${sub}`;
+  const folderPath = path.folderPath ?? [];
+  if (folderPath.length > 0 && path.category) {
+    const folderTrail = folderPath.join(" › ");
+    if (path.subCategory !== void 0) {
+      const sub = path.subCategory ?? "General";
+      return `${path.category} › ${sub} › ${folderTrail}`;
+    }
+    return `${path.category} › ${folderTrail}`;
   }
-  if (path.category && path.pluginName) {
-    return `${path.pluginName} › ${path.category}`;
+  if (path.subCategory !== void 0 && path.category) {
+    const sub = path.subCategory ?? "General";
+    return `${path.category} › ${sub}`;
   }
-  if (path.pluginName) {
-    return path.pluginName;
+  if (path.category) {
+    return path.category;
   }
-  return "Plugins";
+  return "Categories";
 }
 function backLabelForPath(path) {
-  if (path.subCategory !== void 0 && path.category && path.pluginName) {
-    return `${path.pluginName} › ${path.category}`;
+  const folderPath = path.folderPath ?? [];
+  if (folderPath.length > 0) {
+    if (folderPath.length === 1) {
+      if (path.subCategory !== void 0 && path.category) {
+        return path.subCategory ?? "General";
+      }
+      return path.category ?? "Categories";
+    }
+    return folderPath[folderPath.length - 2];
   }
-  if (path.category && path.pluginName) {
-    return path.pluginName;
+  if (path.subCategory !== void 0 && path.category) {
+    return path.category;
   }
-  if (path.pluginName) {
-    return "Plugins";
+  if (path.category) {
+    return "Categories";
   }
   return "";
 }
 function buildMentionRows(items, path, query, pageAssets) {
   const q = query.trim();
   if (q) {
-    return leafRows(searchAddMenuItems(items, q), pageAssets);
+    return leafRows(searchAddMenuItems(items, q), pageAssets, true);
   }
   const rows = [];
-  if (path.pluginName && path.category && path.subCategory !== void 0) {
-    if (path.pluginName || path.category) {
-      rows.push(backRow(backLabelForPath(path)));
-    }
-    return [
-      ...rows,
-      ...leafRows(
-        itemsForSubCategory(
-          items,
-          path.pluginName,
-          path.category,
-          path.subCategory
-        ),
-        pageAssets
-      )
-    ];
+  if (path.category && path.subCategory !== void 0) {
+    const scopedItems = itemsInSubCategory(
+      items,
+      path.category,
+      path.subCategory
+    );
+    return folderAndLeafRows(
+      scopedItems,
+      path.folderPath ?? [],
+      path,
+      pageAssets
+    );
   }
-  if (path.pluginName && path.category) {
+  if (path.category) {
     rows.push(backRow(backLabelForPath(path)));
-    const subs = subCategoryRows(items, path.pluginName, path.category);
+    const subs = subCategoryRows(items, path.category);
     if (subs.length === 1 && subs[0]?.kind === "nav") {
       const only = subs[0];
-      return [
-        ...rows,
-        ...leafRows(
-          itemsForSubCategory(
-            items,
-            path.pluginName,
-            path.category,
-            only.nextPath.subCategory ?? null
-          ),
-          pageAssets
-        )
-      ];
+      const subCategory = only.nextPath.subCategory ?? null;
+      const scopedItems = itemsInSubCategory(items, path.category, subCategory);
+      const folderPath = path.folderPath ?? [];
+      if (hasChildFolders(scopedItems, folderPath) || folderPath.length > 0) {
+        return folderAndLeafRows(scopedItems, folderPath, path, pageAssets);
+      }
+      return [...rows, ...leafRows(scopedItems, pageAssets)];
     }
     return [...rows, ...subs];
   }
-  if (path.pluginName) {
-    rows.push(backRow(backLabelForPath(path)));
-    return [...rows, ...categoryRows(items, path.pluginName)];
-  }
-  return pluginRows(items);
+  return categoryRows(items);
 }
 const MENTION_QUERY_RE = /^[\w\-./()+:\u0590-\u05FF\u0600-\u06FF]+$/u;
 function isAssetMentionTrigger(value, atIndex) {
@@ -11957,7 +12588,7 @@ function initAssetMentionAutocomplete(deps) {
   function canHeaderGoBack() {
     if (panelSearchOpen) return true;
     if (isSearchMode()) return false;
-    return !!(navPath.pluginName || navPath.category);
+    return !!navPath.category;
   }
   function refreshRows() {
     rows = buildMentionRows(
@@ -12157,7 +12788,10 @@ function initAssetMentionAutocomplete(deps) {
     const row = listRows()[index];
     if (!row) return;
     if (row.kind === "nav") {
-      navPath = row.nextPath;
+      const next = row.nextPath;
+      const categoryChanged = next.category !== void 0 && next.category !== navPath.category;
+      const subCategoryChanged = next.subCategory !== void 0 && next.subCategory !== navPath.subCategory;
+      navPath = categoryChanged || subCategoryChanged ? { ...next, folderPath: void 0 } : next;
       selectIndex(0);
       refreshRows();
       syncHeader();
@@ -12950,12 +13584,58 @@ function initVisualAddMenuController(deps) {
     }
   };
 }
+const BROWSE_SCROLL_LOAD_MORE_THRESHOLD_PX = 120;
+function resetBrowseContentScroll(browseContentRef) {
+  browseContentRef?.exec$?.((element) => {
+    element.scrollTop = 0;
+  });
+}
+function isBrowseScrollNearBottom(element, thresholdPx = BROWSE_SCROLL_LOAD_MORE_THRESHOLD_PX) {
+  return element.scrollTop + element.clientHeight >= element.scrollHeight - thresholdPx;
+}
+function bindAddMenuBrowseContentScrollLoadMore(options) {
+  let detach;
+  createEffect(() => {
+    if (!options.isActive()) {
+      detach?.();
+      detach = void 0;
+      return;
+    }
+    options.contentRevision();
+    queueMicrotask(() => {
+      options.browseContentRef?.exec$?.((element) => {
+        detach?.();
+        const maybeLoadMore = () => {
+          if (!options.hasMore()) return;
+          if (!isBrowseScrollNearBottom(element)) return;
+          options.loadMore();
+        };
+        const onScroll = () => maybeLoadMore();
+        element.addEventListener("scroll", onScroll, { passive: true });
+        const resizeObserver = new ResizeObserver(() => maybeLoadMore());
+        resizeObserver.observe(element);
+        maybeLoadMore();
+        detach = () => {
+          element.removeEventListener("scroll", onScroll);
+          resizeObserver.disconnect();
+        };
+      });
+    });
+    return () => {
+      detach?.();
+      detach = void 0;
+    };
+  });
+}
 const ADD_MENU_PICKER_DISMISS_WARNING = "Your selections will not be added. Close anyway?";
 function initAddMenuPickerModal(deps) {
   const [open, setOpen] = createSignal(false);
   const [target, setTarget] = createSignal(null);
   const [selectedCategory, setSelectedCategory] = createSignal("");
   const [selectedSubCategory, setSelectedSubCategory] = createSignal(null);
+  const [selectedFolderPath, setSelectedFolderPath] = createSignal(
+    []
+  );
   const [searchQuery, setSearchQuery] = createSignal("");
   const [catalogItems, setCatalogItems] = createSignal([]);
   const [catalogLoading, setCatalogLoading] = createSignal(false);
@@ -13007,19 +13687,54 @@ function initAddMenuPickerModal(deps) {
       );
     }
   );
-  const addMenuPickerFullBrowseRows = createMemo(() => {
-    const base = isSearchMode() ? searchBrowseRows(searchMatches(), selectedSubCategory()) : browseRowsForBrowse(
+  const addMenuPickerFullBrowseView = createMemo(() => {
+    const reducedMotion = deps.prefersReducedMotion?.() ?? false;
+    if (isSearchMode()) {
+      return {
+        folderRows: [],
+        breadcrumbSegments: [],
+        blocks: searchBrowseBlocks(
+          searchMatches(),
+          selectedSubCategory(),
+          reducedMotion
+        )
+      };
+    }
+    return browseViewForBrowse(
       catalogTree(),
       selectedCategory(),
-      selectedSubCategory()
+      selectedSubCategory(),
+      reducedMotion,
+      selectedFolderPath()
+    );
+  });
+  createMemo(
+    () => addMenuPickerFullBrowseView().blocks
+  );
+  const addMenuPickerBrowseFolderRows = createMemo(
+    () => addMenuPickerFullBrowseView().folderRows
+  );
+  const addMenuPickerBrowseBreadcrumbSegments = createMemo(
+    () => addMenuPickerFullBrowseView().breadcrumbSegments
+  );
+  const addMenuPickerBrowsePickableTotal = createMemo(() => {
+    const view = addMenuPickerFullBrowseView();
+    return countBrowsableEntries(view.folderRows, view.blocks);
+  });
+  const addMenuPickerPaginatedBrowseView = createMemo(() => {
+    const view = addMenuPickerFullBrowseView();
+    const paginated = paginateBrowseView(
+      view.folderRows,
+      applySelectionToBrowseBlocks(view.blocks, selectedItemIdSet()),
+      visibleBrowseLimit()
     );
-    return applySelectionToBrowseRows(base, selectedItemIdSet());
+    return paginated;
   });
-  const addMenuPickerBrowsePickableTotal = createMemo(
-    () => countPickableBrowseRows(addMenuPickerFullBrowseRows())
+  const addMenuPickerBrowseBlocks = createMemo(
+    () => addMenuPickerPaginatedBrowseView().blocks
   );
-  const addMenuPickerBrowseRows = createMemo(
-    () => paginateBrowseRows(addMenuPickerFullBrowseRows(), visibleBrowseLimit())
+  const addMenuPickerVisibleFolderRows = createMemo(
+    () => addMenuPickerPaginatedBrowseView().folderRows
   );
   const showAddMenuPickerModal = open;
   const showAddMenuPickerDismissConfirm = showDismissConfirm;
@@ -13045,8 +13760,9 @@ function initAddMenuPickerModal(deps) {
   const showAddMenuPickerSearchSummary = showAddMenuPickerSearchMode;
   const showAddMenuPickerSubCategoryFilters = createMemo(() => {
     if (!showAddMenuPickerBrowse()) return false;
+    if (addMenuPickerSubCategoryFilterRows().length === 0) return false;
     if (isSearchMode()) return searchMatches().length > 0;
-    return selectedCategory() !== "" && addMenuPickerSubCategoryFilterRows().length > 0;
+    return selectedCategory() !== "";
   });
   const showAddMenuPickerComponents = createMemo(() => {
     if (!showAddMenuPickerBrowse()) return false;
@@ -13062,14 +13778,26 @@ function initAddMenuPickerModal(deps) {
       addMenuPickerBrowsePickableTotal()
     )
   );
-  const showAddMenuPickerNoComponents = createMemo(() => {
-    if (!showAddMenuPickerBrowse()) return false;
-    if (isSearchMode()) return searchMatches().length === 0;
-    return showAddMenuPickerComponents() && addMenuPickerBrowsePickableTotal() === 0;
+  const showAddMenuPickerBreadcrumb = createMemo(
+    () => showAddMenuPickerBrowseLayout() && addMenuPickerBrowseBreadcrumbSegments().length > 0
+  );
+  const showAddMenuPickerFolderGrid = createMemo(
+    () => showAddMenuPickerComponents() && !isSearchMode() && addMenuPickerVisibleFolderRows().length > 0
+  );
+  const showAddMenuPickerEmptyFolder = createMemo(() => {
+    if (!showAddMenuPickerBrowse() || isSearchMode()) return false;
+    if (!showAddMenuPickerComponents()) return false;
+    const view = addMenuPickerFullBrowseView();
+    return view.folderRows.length === 0 && countBrowsableEntries([], view.blocks) === 0 && selectedFolderPath().length > 0;
   });
   const showAddMenuPickerNoSearchResults = createMemo(
     () => showAddMenuPickerSearchMode() && searchMatches().length === 0
   );
+  const showAddMenuPickerNoComponents = createMemo(() => {
+    if (!showAddMenuPickerBrowse()) return false;
+    if (isSearchMode()) return searchMatches().length === 0;
+    return showAddMenuPickerComponents() && addMenuPickerBrowsePickableTotal() === 0 && !showAddMenuPickerEmptyFolder();
+  });
   const addMenuPickerOverlayClass = createMemo(
     () => target()?.surface === "add-page" ? "add-menu-picker-overlay add-menu-picker-overlay--full" : "add-menu-picker-overlay"
   );
@@ -13182,9 +13910,17 @@ function initAddMenuPickerModal(deps) {
     const first = defaultCategoryForTree(tree);
     if (first) setSelectedCategory(first);
   }
+  function resetFolderPath() {
+    setSelectedFolderPath([]);
+  }
   function resetBrowsePagination() {
     setVisibleBrowseLimit(ADD_MENU_BROWSE_PAGE_SIZE);
   }
+  function resetBrowseContentScrollPosition(refs) {
+    queueMicrotask(() => {
+      resetBrowseContentScroll(refs?.addMenuPickerBrowseContent);
+    });
+  }
   function loadMoreBrowseItems() {
     setVisibleBrowseLimit(
       (prev) => Math.min(
@@ -13195,6 +13931,7 @@ function initAddMenuPickerModal(deps) {
   }
   function resetSubCategoryFilter() {
     setSelectedSubCategory(null);
+    resetFolderPath();
   }
   async function refreshCatalog() {
     setCatalogLoading(true);
@@ -13218,6 +13955,7 @@ function initAddMenuPickerModal(deps) {
     setTarget(nextTarget);
     setSelectedCategory(options?.initialCategory ?? "");
     setSelectedSubCategory(options?.initialSubCategory ?? null);
+    setSelectedFolderPath(options?.initialFolderPath ?? []);
     setSearchQuery("");
     setSelectedItemIds([]);
     setShowDismissConfirm(false);
@@ -13246,17 +13984,20 @@ function initAddMenuPickerModal(deps) {
     const currentTarget = target();
     const browseCategory = selectedCategory();
     const browseSubCategory = selectedSubCategory();
+    const browseFolderPath = selectedFolderPath();
     setOpen(false);
     setTarget(null);
     setSelectedCategory("");
     setSelectedSubCategory(null);
+    setSelectedFolderPath([]);
     setSearchQuery("");
     setSelectedItemIds([]);
     setShowDismissConfirm(false);
     deps.onDismiss?.({
       target: currentTarget,
       category: browseCategory,
-      subCategory: browseSubCategory
+      subCategory: browseSubCategory,
+      folderPath: browseFolderPath
     });
     const trigger = lastTrigger;
     lastTrigger = null;
@@ -13264,20 +14005,26 @@ function initAddMenuPickerModal(deps) {
       queueMicrotask(() => trigger.focus());
     }
   }
-  function exitSearchMode() {
+  function exitSearchMode(refs) {
     setSearchQuery("");
     resetSubCategoryFilter();
     resetBrowsePagination();
+    resetBrowseContentScrollPosition(refs);
   }
-  function handleLeftNav(navKey) {
+  function handleLeftNav(navKey, refs) {
     setSelectedCategory(navKey);
-    resetSubCategoryFilter();
-    resetBrowsePagination();
-    exitSearchMode();
+    exitSearchMode(refs);
   }
-  function handleSubCategoryFilter(navKey) {
+  function handleSubCategoryFilter(navKey, refs) {
     setSelectedSubCategory(navKey === "" ? null : navKey);
+    resetFolderPath();
+    resetBrowsePagination();
+    resetBrowseContentScrollPosition(refs);
+  }
+  function handleFolderNav(navKey, refs) {
+    setSelectedFolderPath(parseFolderNavKey(navKey));
     resetBrowsePagination();
+    resetBrowseContentScrollPosition(refs);
   }
   function scrollSubCategoryFilters(direction2, fromEl) {
     const root = fromEl.closest(".add-menu-picker-browse");
@@ -13312,6 +14059,16 @@ function initAddMenuPickerModal(deps) {
   }
   function bindAddMenuPickerRefs(refs) {
     bindSubCategoryScrollMonitoring(refs.addMenuPickerSubCategoryFilters);
+    bindAddMenuBrowseContentScrollLoadMore({
+      browseContentRef: refs.addMenuPickerBrowseContent,
+      isActive: () => showAddMenuPickerComponents(),
+      hasMore: () => showAddMenuPickerLoadMore(),
+      loadMore: loadMoreBrowseItems,
+      contentRevision: () => {
+        addMenuPickerBrowseBlocks();
+        visibleBrowseLimit();
+      }
+    });
     refs.addMenuPickerCloseBtn?.onclick(() => requestDismiss());
     refs.addMenuPickerBackBtn?.onclick(() => requestDismiss());
     refs.addMenuPickerSearchInput?.oninput(
@@ -13320,6 +14077,7 @@ function initAddMenuPickerModal(deps) {
         setSearchQuery(value);
         resetSubCategoryFilter();
         resetBrowsePagination();
+        resetBrowseContentScrollPosition(refs);
       }
     );
     refs.addMenuPickerOverlay?.onclick(
@@ -13345,11 +14103,11 @@ function initAddMenuPickerModal(deps) {
     const handleDialogClick = ({ event }) => {
       const targetEl = event.target;
       if (targetEl.closest("[data-add-menu-picker-search-back]")) {
-        exitSearchMode();
+        exitSearchMode(refs);
         return;
       }
       if (targetEl.closest("[data-add-menu-picker-search-clear]")) {
-        exitSearchMode();
+        exitSearchMode(refs);
         const input = targetEl.closest(".add-menu-picker-search-row")?.querySelector(".add-menu-picker-search-input");
         if (input) input.focus();
         return;
@@ -13369,14 +14127,28 @@ function initAddMenuPickerModal(deps) {
         "[data-add-menu-picker-left-nav]"
       );
       if (navBtn?.dataset.navKey !== void 0) {
-        handleLeftNav(navBtn.dataset.navKey);
+        handleLeftNav(navBtn.dataset.navKey, refs);
         return;
       }
       const subBtn = targetEl.closest(
         "[data-add-menu-picker-subcategory-filter]"
       );
       if (subBtn?.dataset.navKey !== void 0) {
-        handleSubCategoryFilter(subBtn.dataset.navKey);
+        handleSubCategoryFilter(subBtn.dataset.navKey, refs);
+        return;
+      }
+      const folderBtn = targetEl.closest(
+        "[data-add-menu-picker-folder-nav]"
+      );
+      if (folderBtn?.dataset.navKey !== void 0) {
+        handleFolderNav(folderBtn.dataset.navKey, refs);
+        return;
+      }
+      const breadcrumbBtn = targetEl.closest(
+        "[data-add-menu-picker-breadcrumb]"
+      );
+      if (breadcrumbBtn?.dataset.navKey !== void 0) {
+        handleFolderNav(breadcrumbBtn.dataset.navKey, refs);
         return;
       }
       if (targetEl.closest("[data-add-menu-picker-done]")) {
@@ -13442,7 +14214,12 @@ function initAddMenuPickerModal(deps) {
     addMenuPickerBrowseLayoutClass,
     addMenuPickerLeftNavRows,
     addMenuPickerSubCategoryFilterRows,
-    addMenuPickerBrowseRows,
+    addMenuPickerBrowseBlocks,
+    addMenuPickerBrowseFolderRows,
+    addMenuPickerBrowseBreadcrumbSegments,
+    showAddMenuPickerBreadcrumb,
+    showAddMenuPickerFolderGrid,
+    showAddMenuPickerEmptyFolder,
     bindAddMenuPickerRefs,
     handleDocumentKeydown,
     isOpen: open
@@ -13457,6 +14234,14 @@ function clampFloatingPanelPosition(left, top, panelWidth, panelHeight) {
     top: Math.min(Math.max(8, top), maxTop)
   };
 }
+function hasPersistedPanelPosition(storageKey) {
+  if (typeof localStorage === "undefined") return false;
+  try {
+    return localStorage.getItem(storageKey) !== null;
+  } catch {
+    return false;
+  }
+}
 function readPersistedPanelPosition(storageKey, defaults) {
   if (typeof localStorage === "undefined") return defaults;
   try {
@@ -13482,7 +14267,7 @@ const DOCK_POS_STORAGE_PREFIX = "aiditor:add-dock-pos:";
 const DOCK_PANEL_WIDTH = 624;
 const DOCK_PANEL_HEIGHT = 680;
 const DOCK_DEFAULT_LEFT = 16;
-const DOCK_DEFAULT_TOP = 148;
+const DOCK_DEFAULT_TOP = 16;
 function dockPosStorageKey(projectDir) {
   return `${DOCK_POS_STORAGE_PREFIX}${projectDir}`;
 }
@@ -13492,12 +14277,16 @@ function initAddMenuDockPanel(deps) {
   const [panelTop, setPanelTop] = createSignal(DOCK_DEFAULT_TOP);
   const [selectedCategory, setSelectedCategory] = createSignal("");
   const [selectedSubCategory, setSelectedSubCategory] = createSignal(null);
+  const [selectedFolderPath, setSelectedFolderPath] = createSignal(
+    []
+  );
   const [searchQuery, setSearchQuery] = createSignal("");
   const [catalogItems, setCatalogItems] = createSignal([]);
   const [catalogLoading, setCatalogLoading] = createSignal(false);
   const [visibleBrowseLimit, setVisibleBrowseLimit] = createSignal(
     ADD_MENU_BROWSE_PAGE_SIZE
   );
+  let browseContentRef;
   const catalogTree = createMemo(() => catalogTreeForItems(catalogItems()));
   const isSearchMode = createMemo(() => searchQuery().trim().length > 0);
   const searchMatches = createMemo(
@@ -13522,19 +14311,44 @@ function initAddMenuDockPanel(deps) {
       /* @__PURE__ */ new Set()
     );
   });
-  const dockFullBrowseRows = createMemo(() => {
-    const base = isSearchMode() ? searchBrowseRows(searchMatches(), selectedSubCategory()) : browseRowsForBrowse(
+  const dockFullBrowseView = createMemo(() => {
+    const reducedMotion = deps.prefersReducedMotion?.() ?? false;
+    if (isSearchMode()) {
+      return {
+        folderRows: [],
+        breadcrumbSegments: [],
+        blocks: searchBrowseBlocks(
+          searchMatches(),
+          selectedSubCategory(),
+          reducedMotion
+        )
+      };
+    }
+    return browseViewForBrowse(
       catalogTree(),
       selectedCategory(),
-      selectedSubCategory()
+      selectedSubCategory(),
+      reducedMotion,
+      selectedFolderPath()
     );
-    return applySelectionToBrowseRows(base, /* @__PURE__ */ new Set());
   });
-  const dockBrowsePickableTotal = createMemo(
-    () => countPickableBrowseRows(dockFullBrowseRows())
+  const dockBrowsePickableTotal = createMemo(() => {
+    const view = dockFullBrowseView();
+    return countBrowsableEntries(view.folderRows, view.blocks);
+  });
+  const dockPaginatedBrowseView = createMemo(
+    () => paginateBrowseView(
+      dockFullBrowseView().folderRows,
+      applySelectionToBrowseBlocks(dockFullBrowseView().blocks, /* @__PURE__ */ new Set()),
+      visibleBrowseLimit()
+    )
+  );
+  const dockBrowseBlocks = createMemo(() => dockPaginatedBrowseView().blocks);
+  const dockBrowseFolderRows = createMemo(
+    () => dockPaginatedBrowseView().folderRows
   );
-  const dockBrowseRows = createMemo(
-    () => paginateBrowseRows(dockFullBrowseRows(), visibleBrowseLimit())
+  const dockBrowseBreadcrumbSegments = createMemo(
+    () => dockFullBrowseView().breadcrumbSegments
   );
   const showAddMenuDock = open;
   const showAddMenuDockLoading = createMemo(() => open() && catalogLoading());
@@ -13552,8 +14366,9 @@ function initAddMenuDockPanel(deps) {
   );
   const showAddMenuDockSubCategoryFilters = createMemo(() => {
     if (!showAddMenuDockBrowse()) return false;
+    if (dockSubCategoryFilterRows().length === 0) return false;
     if (isSearchMode()) return searchMatches().length > 0;
-    return selectedCategory() !== "" && dockSubCategoryFilterRows().length > 0;
+    return selectedCategory() !== "";
   });
   const showAddMenuDockComponents = createMemo(() => {
     if (!showAddMenuDockBrowse()) return false;
@@ -13563,10 +14378,22 @@ function initAddMenuDockPanel(deps) {
   const showAddMenuDockLoadMore = createMemo(
     () => showAddMenuDockComponents() && visibleBrowseLimit() < dockBrowsePickableTotal()
   );
+  const showAddMenuDockBreadcrumb = createMemo(
+    () => showAddMenuDockBrowseLayout() && dockBrowseBreadcrumbSegments().length > 0
+  );
+  const showAddMenuDockFolderGrid = createMemo(
+    () => showAddMenuDockComponents() && !isSearchMode() && dockBrowseFolderRows().length > 0
+  );
+  const showAddMenuDockEmptyFolder = createMemo(() => {
+    if (!showAddMenuDockBrowse() || isSearchMode()) return false;
+    if (!showAddMenuDockComponents()) return false;
+    const view = dockFullBrowseView();
+    return view.folderRows.length === 0 && countBrowsableEntries([], view.blocks) === 0 && selectedFolderPath().length > 0;
+  });
   const showAddMenuDockNoComponents = createMemo(() => {
     if (!showAddMenuDockBrowse()) return false;
     if (isSearchMode()) return searchMatches().length === 0;
-    return showAddMenuDockComponents() && dockBrowsePickableTotal() === 0;
+    return showAddMenuDockComponents() && dockBrowsePickableTotal() === 0 && !showAddMenuDockEmptyFolder();
   });
   const showAddMenuDockNoSearchResults = createMemo(
     () => showAddMenuDockSearchMode() && searchMatches().length === 0
@@ -13609,16 +14436,20 @@ function initAddMenuDockPanel(deps) {
       setCatalogLoading(false);
     }
   }
+  function defaultPanelPosition() {
+    const anchor = deps.getAnchorRect?.();
+    if (anchor) {
+      return { left: anchor.left, top: anchor.top };
+    }
+    return { left: DOCK_DEFAULT_LEFT, top: DOCK_DEFAULT_TOP };
+  }
   function restorePanelPosition() {
     const pd = deps.projectDir();
-    if (!pd) return;
-    const stored = readPersistedPanelPosition(dockPosStorageKey(pd), {
-      left: DOCK_DEFAULT_LEFT,
-      top: DOCK_DEFAULT_TOP
-    });
+    const defaults = defaultPanelPosition();
+    const position2 = pd && hasPersistedPanelPosition(dockPosStorageKey(pd)) ? readPersistedPanelPosition(dockPosStorageKey(pd), defaults) : defaults;
     const clamped = clampFloatingPanelPosition(
-      stored.left,
-      stored.top,
+      position2.left,
+      position2.top,
       DOCK_PANEL_WIDTH,
       DOCK_PANEL_HEIGHT
     );
@@ -13635,6 +14466,7 @@ function initAddMenuDockPanel(deps) {
     setOpen(false);
     setSearchQuery("");
     setSelectedSubCategory(null);
+    setSelectedFolderPath([]);
     setVisibleBrowseLimit(ADD_MENU_BROWSE_PAGE_SIZE);
   }
   function toggleDock() {
@@ -13646,25 +14478,51 @@ function initAddMenuDockPanel(deps) {
     if (!item || !isPickableAddMenuItem(item)) return;
     await deps.onPickItem(item);
   }
+  function loadMoreBrowseItems() {
+    setVisibleBrowseLimit(
+      (prev) => Math.min(prev + ADD_MENU_BROWSE_PAGE_SIZE, dockBrowsePickableTotal())
+    );
+  }
+  function resetDockBrowseScroll() {
+    queueMicrotask(() => {
+      resetBrowseContentScroll(browseContentRef);
+    });
+  }
   function bindAddMenuDockRefs(refs) {
+    browseContentRef = refs.addMenuDockBrowseContent;
     refs.addMenuDockCloseBtn?.onclick(() => closeDock());
     refs.addMenuDockBackdrop?.onclick(() => closeDock());
     refs.addMenuDockSearchInput?.oninput(
       ({ event }) => {
         setSearchQuery(event.target.value);
         setSelectedSubCategory(null);
+        setSelectedFolderPath([]);
         setVisibleBrowseLimit(ADD_MENU_BROWSE_PAGE_SIZE);
+        resetDockBrowseScroll();
       }
     );
+    bindAddMenuBrowseContentScrollLoadMore({
+      browseContentRef: refs.addMenuDockBrowseContent,
+      isActive: () => showAddMenuDockComponents(),
+      hasMore: () => showAddMenuDockLoadMore(),
+      loadMore: loadMoreBrowseItems,
+      contentRevision: () => {
+        dockBrowseBlocks();
+        visibleBrowseLimit();
+      }
+    });
   }
   function handleDockBrowseClick(targetEl) {
     if (targetEl.closest("[data-add-menu-dock-search-back]")) {
       setSearchQuery("");
       setSelectedSubCategory(null);
+      setSelectedFolderPath([]);
+      resetDockBrowseScroll();
       return true;
     }
     if (targetEl.closest("[data-add-menu-dock-search-clear]")) {
       setSearchQuery("");
+      resetDockBrowseScroll();
       return true;
     }
     const navBtn = targetEl.closest(
@@ -13673,7 +14531,9 @@ function initAddMenuDockPanel(deps) {
     if (navBtn?.dataset.navKey !== void 0) {
       setSelectedCategory(navBtn.dataset.navKey);
       setSelectedSubCategory(null);
+      setSelectedFolderPath([]);
       setVisibleBrowseLimit(ADD_MENU_BROWSE_PAGE_SIZE);
+      resetDockBrowseScroll();
       return true;
     }
     const subBtn = targetEl.closest(
@@ -13682,13 +14542,31 @@ function initAddMenuDockPanel(deps) {
     if (subBtn) {
       const key = subBtn.dataset.navKey ?? "";
       setSelectedSubCategory(key === "" ? null : key);
+      setSelectedFolderPath([]);
       setVisibleBrowseLimit(ADD_MENU_BROWSE_PAGE_SIZE);
+      resetDockBrowseScroll();
+      return true;
+    }
+    const folderBtn = targetEl.closest(
+      "[data-add-menu-dock-folder-nav]"
+    );
+    if (folderBtn?.dataset.navKey !== void 0) {
+      setSelectedFolderPath(parseFolderNavKey(folderBtn.dataset.navKey));
+      setVisibleBrowseLimit(ADD_MENU_BROWSE_PAGE_SIZE);
+      resetDockBrowseScroll();
+      return true;
+    }
+    const breadcrumbBtn = targetEl.closest(
+      "[data-add-menu-dock-breadcrumb]"
+    );
+    if (breadcrumbBtn?.dataset.navKey !== void 0) {
+      setSelectedFolderPath(parseFolderNavKey(breadcrumbBtn.dataset.navKey));
+      setVisibleBrowseLimit(ADD_MENU_BROWSE_PAGE_SIZE);
+      resetDockBrowseScroll();
       return true;
     }
     if (targetEl.closest("[data-add-menu-dock-load-more]")) {
-      setVisibleBrowseLimit(
-        (prev) => Math.min(prev + ADD_MENU_BROWSE_PAGE_SIZE, dockBrowsePickableTotal())
-      );
+      loadMoreBrowseItems();
       return true;
     }
     const card = targetEl.closest(
@@ -13726,7 +14604,12 @@ function initAddMenuDockPanel(deps) {
     addMenuDockSearchSummary,
     dockLeftNavRows,
     dockSubCategoryFilterRows,
-    dockBrowseRows,
+    dockBrowseBlocks,
+    dockBrowseFolderRows,
+    dockBrowseBreadcrumbSegments,
+    showAddMenuDockBreadcrumb,
+    showAddMenuDockFolderGrid,
+    showAddMenuDockEmptyFolder,
     addMenuDockSearchQuery: searchQuery,
     openDock,
     closeDock,
@@ -19624,7 +20507,18 @@ function aiditorConstructor(_props, refs) {
   const openAddMenuPicker = (target, trigger, options) => {
     addMenuPicker.openModal(target, trigger, options);
   };
+  const [prefersReducedMotion, setPrefersReducedMotion] = createSignal(typeof window !== "undefined" && window.matchMedia("(prefers-reduced-motion: reduce)").matches);
+  createEffect(() => {
+    if (typeof window === "undefined")
+      return;
+    const media = window.matchMedia("(prefers-reduced-motion: reduce)");
+    const onChange = () => setPrefersReducedMotion(media.matches);
+    onChange();
+    media.addEventListener("change", onChange);
+    return () => media.removeEventListener("change", onChange);
+  });
   const addMenuPicker = initAddMenuPickerModal({
+    prefersReducedMotion,
     onDone: async (items, target) => {
       if (target.surface === "add-page") {
         for (const item of items) {
@@ -19704,6 +20598,14 @@ function aiditorConstructor(_props, refs) {
   });
   addMenuDock = initAddMenuDockPanel({
     projectDir: () => projectDir(),
+    prefersReducedMotion,
+    getAnchorRect: () => {
+      let rect = null;
+      tryJayRefExec2(refs.harmonyStageAddBtn, (el) => {
+        rect = el.getBoundingClientRect();
+      });
+      return rect;
+    },
     onBeforeOpen: () => pageInfoPanel.closePageInfoPanel(),
     onPickItem: async (item) => {
       if (isStagePlaceItem(item)) {
@@ -23706,7 +24608,12 @@ function aiditorConstructor(_props, refs) {
       addMenuPickerBrowseLayoutClass: addMenuPicker.addMenuPickerBrowseLayoutClass,
       addMenuPickerLeftNavRows: addMenuPicker.addMenuPickerLeftNavRows,
       addMenuPickerSubCategoryFilterRows: addMenuPicker.addMenuPickerSubCategoryFilterRows,
-      addMenuPickerBrowseRows: addMenuPicker.addMenuPickerBrowseRows,
+      addMenuPickerBrowseBlocks: addMenuPicker.addMenuPickerBrowseBlocks,
+      addMenuPickerBrowseFolderRows: addMenuPicker.addMenuPickerBrowseFolderRows,
+      addMenuPickerBrowseBreadcrumbSegments: addMenuPicker.addMenuPickerBrowseBreadcrumbSegments,
+      showAddMenuPickerBreadcrumb: addMenuPicker.showAddMenuPickerBreadcrumb,
+      showAddMenuPickerFolderGrid: addMenuPicker.showAddMenuPickerFolderGrid,
+      showAddMenuPickerEmptyFolder: addMenuPicker.showAddMenuPickerEmptyFolder,
       showPageInfoPanel: showPageInfoPanelVisible,
       pageInfoPanelLeft: pageInfoPanel.panelLeft,
       pageInfoPanelTop: pageInfoPanel.panelTop,
@@ -23772,7 +24679,12 @@ function aiditorConstructor(_props, refs) {
       addMenuDockSearchSummary: addMenuDock.addMenuDockSearchSummary,
       addMenuDockLeftNavRows: addMenuDock.dockLeftNavRows,
       addMenuDockSubCategoryFilterRows: addMenuDock.dockSubCategoryFilterRows,
-      addMenuDockBrowseRows: addMenuDock.dockBrowseRows,
+      addMenuDockBrowseBlocks: addMenuDock.dockBrowseBlocks,
+      addMenuDockBrowseFolderRows: addMenuDock.dockBrowseFolderRows,
+      addMenuDockBrowseBreadcrumbSegments: addMenuDock.dockBrowseBreadcrumbSegments,
+      showAddMenuDockBreadcrumb: addMenuDock.showAddMenuDockBreadcrumb,
+      showAddMenuDockFolderGrid: addMenuDock.showAddMenuDockFolderGrid,
+      showAddMenuDockEmptyFolder: addMenuDock.showAddMenuDockEmptyFolder,
       addMenuDockSearchQuery: addMenuDock.addMenuDockSearchQuery,
       showToastMessage,
       toastMessage,