@anthusai/papyrus 1.5.0 → 1.6.0

package/amplify/functions/shared/python-bundle.js

@@ -126,9 +126,9 @@ function bundleFromPip(outputDir, options) {
 }
 export function bundleFromCheckout(outputDir, options) {
     fs.copyFileSync(path.join(packageRoot, "amplify/functions", options.functionDir, "handler.py"), path.join(outputDir, "handler.py"));
-    for (const module of options.modules) {
-        fs.mkdirSync(path.join(outputDir, module), { recursive: true });
-        fs.cpSync(path.join(packageRoot, "src", module), path.join(outputDir, module), { recursive: true });
+    for (const moduleName of options.modules) {
+        fs.mkdirSync(path.join(outputDir, moduleName), { recursive: true });
+        fs.cpSync(path.join(packageRoot, "src", moduleName), path.join(outputDir, moduleName), { recursive: true });
     }
     options.checkoutExtras?.(outputDir);
     copySiteFiles(outputDir, options.siteFiles);

package/amplify/functions/shared/python-bundle.ts

@@ -164,9 +164,9 @@ export function bundleFromCheckout(outputDir: string, options: PythonBundleOptio
     path.join(packageRoot, "amplify/functions", options.functionDir, "handler.py"),
     path.join(outputDir, "handler.py"),
   );
-  for (const module of options.modules) {
-    fs.mkdirSync(path.join(outputDir, module), { recursive: true });
-    fs.cpSync(path.join(packageRoot, "src", module), path.join(outputDir, module), { recursive: true });
+  for (const moduleName of options.modules) {
+    fs.mkdirSync(path.join(outputDir, moduleName), { recursive: true });
+    fs.cpSync(path.join(packageRoot, "src", moduleName), path.join(outputDir, moduleName), { recursive: true });
   }
   options.checkoutExtras?.(outputDir);
   copySiteFiles(outputDir, options.siteFiles);

package/components/news-desk-taxonomy-client.ts

@@ -41,7 +41,7 @@ import type {
   UserDirectoryEntry,
 } from "../lib/category-repository";
 import { relationTypeKey } from "../lib/semantic-graph";
-import { contentItemStageKeys, type ContentItemVersionRecord } from "../lib/content-item-lifecycle";
+import { legacyStageKeysToLoad, type ContentItemVersionRecord } from "../lib/content-item-lifecycle";
 import { getContentItemStageDefinitions } from "../lib/site-brand";
 import { DOCTRINE_DEFINITIONS, getCategoryDoctrineDefinitions, type DoctrineCategory } from "../lib/doctrine";
 import { configureAmplifyClient } from "./amplify-client-provider";
@@ -2172,31 +2172,45 @@ const CONTENT_ITEMS_BY_STAGE_QUERY = `
   }
 `;
 
-export async function loadNewsroomContentItemVersions(): Promise<ContentItemVersionRecord[]> {
-  if (isLocalPreviewEnabled()) return createLocalPreviewContentItemVersions();
+export const CONTENT_ITEM_COLUMN_PAGE_LIMIT = 25;
+
+export type ContentItemStagePage = {
+  versions: ContentItemVersionRecord[];
+  nextToken: string | null;
+};
+
+/** One newest-updated-first page of the content items in one stage, so a board column can load as it is scrolled. */
+export async function loadNewsroomContentItemStagePage(
+  stage: string,
+  nextToken: string | null = null,
+  limit: number = CONTENT_ITEM_COLUMN_PAGE_LIMIT,
+): Promise<ContentItemStagePage> {
+  if (isLocalPreviewEnabled()) {
+    const versionsInStage = createLocalPreviewContentItemVersions().filter(version => version.stage === stage);
+    const offset = nextToken ? Number(nextToken) : 0;
+    const followingOffset = offset + limit;
+    return {
+      versions: versionsInStage.slice(offset, followingOffset),
+      nextToken: followingOffset < versionsInStage.length ? String(followingOffset) : null,
+    };
+  }
   configureAmplifyClient();
   const client = generateClient<Schema>() as unknown as {
     graphql: (options: Record<string, unknown>) => Promise<GraphQLConnectionResponse<ContentItemVersionRecord>>;
   };
   const field = "listItemsByStageAndUpdatedAt";
-  const versionsPerStage = await Promise.all(contentItemStageKeys(getContentItemStageDefinitions()).map(async (stage) => {
-    const versions: ContentItemVersionRecord[] = [];
-    let nextToken: string | null = null;
-    do {
-      const response: GraphQLConnectionResponse<ContentItemVersionRecord> = await client.graphql({
-        query: CONTENT_ITEMS_BY_STAGE_QUERY,
-        variables: { stage, sortDirection: "DESC", limit: NEWSROOM_PAGE_LIMIT, nextToken },
-        authMode: USER_POOL_AUTH_MODE,
-      });
-      assertNoGraphQLErrors(response.errors);
-      const connection = response.data?.[field];
-      if (!connection) throw new Error(`Missing GraphQL connection payload for ${field}.`);
-      versions.push(...((connection.items ?? []).filter(Boolean) as ContentItemVersionRecord[]));
-      nextToken = connection.nextToken ?? null;
-    } while (nextToken);
-    return versions;
-  }));
-  return versionsPerStage.flat();
+  const response: GraphQLConnectionResponse<ContentItemVersionRecord> = await client.graphql({
+    query: CONTENT_ITEMS_BY_STAGE_QUERY,
+    variables: { stage, sortDirection: "DESC", limit, nextToken },
+    authMode: USER_POOL_AUTH_MODE,
+  });
+  assertNoGraphQLErrors(response.errors);
+  const connection = response.data?.[field];
+  if (!connection) throw new Error(`Missing GraphQL connection payload for ${field}.`);
+  return {
+    versions: (connection.items ?? []).filter(Boolean) as ContentItemVersionRecord[],
+    nextToken: connection.nextToken ?? null,
+  };
 }
 
 const PUBLISHED_ITEMS_QUERY = `

package/components/newsroom-board-view.tsx

@@ -2,7 +2,7 @@
 
 import { useEffect, useMemo, useRef, useState } from "react";
 import Link from "next/link";
-import { IssueCollection, IssueDetailPanel } from "@kanbus/ui";
+import { IssueCollection, IssueDetailPanel, useBoardColumnState } from "@kanbus/ui";
 import "@kanbus/ui/styles/kanban.css";
 import "./newsroom-newsprint-board.css";
 import { PlusIcon } from "lucide-react";
@@ -20,9 +20,11 @@ import {
   type NativeBoardIssue,
 } from "../lib/newsroom-board";
 import type { AssignmentRecord } from "../lib/category-repository";
-import { getContentItemName, SITE_BRAND } from "../lib/site-brand";
+import { getContentItemName, getContentItemStageDefinitions, SITE_BRAND } from "../lib/site-brand";
 import { getNewsroomNavHref } from "../lib/newsroom-nav";
-import { loadNewsroomAssignmentPage, loadNewsroomContentItemVersions, loadNewsroomPublishedContentItemVersions } from "./news-desk-taxonomy-client";
+import { loadNewsroomAssignmentPage, loadNewsroomPublishedContentItemVersions } from "./news-desk-taxonomy-client";
+import { usePagedContentItemVersions } from "./use-paged-content-item-versions";
+import type { ContentItemVersionRecord } from "../lib/content-item-lifecycle";
 import { useOptionalNewsDeskClient } from "./news-desk-client-provider";
 import { NewsDeskAccessGate } from "./newsroom-access-gate";
 import { NewsroomOpsShell, NewsroomOpsStatusBanner } from "./newsroom-ops-shell";
@@ -31,6 +33,7 @@ import { readLocalReaderSettings, subscribeReaderSettingsChanges } from "./reade
 
 const STATIC_MOTION = { mode: "static" } as const;
 const BOARD_REFRESH_INTERVAL_MILLISECONDS = 30_000;
+const COLUMN_LOAD_MORE_DISTANCE_PIXELS = 240;
 
 async function loadEveryNewsroomAssignment() {
   const assignments: AssignmentRecord[] = [];
@@ -51,35 +54,44 @@ export function NewsroomBoardView({ subject }: { subject: NewsroomBoardSubject }
   const allowed = canReadNewsroomBoard(session?.shell.phase);
   const theme = useResolvedPapyrusTheme();
   const [lowMotion, setLowMotion] = useState(false);
-  const [issues, setIssues] = useState<NativeBoardIssue[]>([]);
+  const [assignmentBoardIssues, setAssignmentBoardIssues] = useState<NativeBoardIssue[]>([]);
+  const [publishedVersions, setPublishedVersions] = useState<ContentItemVersionRecord[]>([]);
+  const [assignments, setAssignments] = useState<AssignmentRecord[]>([]);
   const [view, setView] = useState<"board" | "list">("board");
   const [selected, setSelected] = useState<string | null>(null);
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
+  const [supportingRecordsLoading, setSupportingRecordsLoading] = useState(false);
+  const [supportingRecordsError, setSupportingRecordsError] = useState<string | null>(null);
   const generation = useRef(0);
+  const boardBodyRef = useRef<HTMLDivElement | null>(null);
+  const boardType = subject === "contentItem" ? contentItemBoardType() : ASSIGNMENT_BOARD_TYPE;
+  const columnStateConfig = useMemo(() => subject === "contentItem" ? contentItemBoardConfig([]) : assignmentBoardConfig(assignmentBoardIssues), [assignmentBoardIssues, subject]);
+  const columnState = useBoardColumnState({ config: columnStateConfig, storageKey: `papyrus.cms.columns.v1.${SITE_BRAND.id}.${subject}` });
+  const openedCollapsedUntilOpenedStages = useMemo(() => subject !== "contentItem" ? [] : getContentItemStageDefinitions()
+    .filter(definition => definition.collapsedUntilOpened && !columnState.collapsedColumns.has(`${boardType}/${definition.key}`))
+    .map(definition => definition.key), [boardType, columnState.collapsedColumns, subject]);
+  const pagedContentItems = usePagedContentItemVersions({ enabled: allowed && subject === "contentItem", openedCollapsedUntilOpenedStages });
   useEffect(() => {
     setLowMotion(readLocalReaderSettings().motion === "low");
     return subscribeReaderSettingsChanges(settings => setLowMotion(settings.motion === "low"));
   }, []);
   useEffect(() => {
     const request = ++generation.current;
-    setIssues([]); setSelected(null); setError(null);
-    if (!allowed) { setLoading(false); return; }
-    const loadIssues = () => subject === "contentItem"
-      ? Promise.all([
-        Promise.all([loadNewsroomContentItemVersions(), loadNewsroomPublishedContentItemVersions()]).then(([workingVersions, publishedVersions]) => [...workingVersions, ...publishedVersions]),
-        loadEveryNewsroomAssignment(),
-      ]).then(([contentItemVersions, assignments]) => projectContentItemBoard({ contentItemVersions, assignments }))
-      : loadEveryNewsroomAssignment().then(projectAssignmentBoard);
+    setAssignmentBoardIssues([]); setPublishedVersions([]); setAssignments([]); setSelected(null); setSupportingRecordsError(null);
+    if (!allowed) { setSupportingRecordsLoading(false); return; }
+    const loadSupportingRecords = () => subject === "contentItem"
+      ? Promise.all([loadNewsroomPublishedContentItemVersions(), loadEveryNewsroomAssignment()]).then(([published, everyAssignment]) => {
+        if (generation.current === request) { setPublishedVersions(published); setAssignments(everyAssignment); }
+      })
+      : loadEveryNewsroomAssignment().then(everyAssignment => {
+        if (generation.current === request) setAssignmentBoardIssues(projectAssignmentBoard(everyAssignment));
+      });
     const refresh = (initial: boolean) => {
-      if (initial) setLoading(true);
-      loadIssues().then(loadedIssues => {
-        if (generation.current !== request) return;
-        setIssues(loadedIssues);
-        setError(null);
+      if (initial) setSupportingRecordsLoading(true);
+      loadSupportingRecords().then(() => {
+        if (generation.current === request) setSupportingRecordsError(null);
       }).catch((reason: unknown) => {
-        if (generation.current === request && initial) setError(reason instanceof Error ? reason.message : "Could not load newsroom records.");
-      }).finally(() => { if (generation.current === request && initial) setLoading(false); });
+        if (generation.current === request && initial) setSupportingRecordsError(reason instanceof Error ? reason.message : "Could not load newsroom records.");
+      }).finally(() => { if (generation.current === request && initial) setSupportingRecordsLoading(false); });
     };
     refresh(true);
     const refreshWhenVisible = () => { if (document.visibilityState === "visible") refresh(false); };
@@ -87,8 +99,26 @@ export function NewsroomBoardView({ subject }: { subject: NewsroomBoardSubject }
     document.addEventListener("visibilitychange", refreshWhenVisible);
     return () => { generation.current = request + 1; window.clearInterval(interval); document.removeEventListener("visibilitychange", refreshWhenVisible); };
   }, [allowed, subject]);
+  const issues = useMemo(() => subject === "contentItem"
+    ? projectContentItemBoard({ contentItemVersions: [...pagedContentItems.versions, ...publishedVersions], assignments })
+    : assignmentBoardIssues, [assignmentBoardIssues, assignments, pagedContentItems.versions, publishedVersions, subject]);
+  const loading = supportingRecordsLoading || (subject === "contentItem" && pagedContentItems.loading);
+  const error = supportingRecordsError ?? (subject === "contentItem" ? pagedContentItems.error : null);
   const config = useMemo(() => subject === "contentItem" ? contentItemBoardConfig(issues) : assignmentBoardConfig(issues), [issues, subject]);
-  const boardType = subject === "contentItem" ? contentItemBoardType() : ASSIGNMENT_BOARD_TYPE;
+  const columnStageFromElement = (element: Element | null) => element?.closest("[data-column-key]")?.getAttribute("data-column-key")?.slice(boardType.length + 1) ?? null;
+  const loadMoreWhenColumnIsNearItsEnd = (columnScroll: HTMLElement) => {
+    const distanceToEnd = columnScroll.scrollHeight - columnScroll.scrollTop - columnScroll.clientHeight;
+    const stage = columnStageFromElement(columnScroll);
+    if (stage && distanceToEnd < COLUMN_LOAD_MORE_DISTANCE_PIXELS) pagedContentItems.loadMoreForStage(stage);
+  };
+  const handleBoardScroll = (event: React.UIEvent<HTMLDivElement>) => {
+    const target = event.target as HTMLElement;
+    if (subject === "contentItem" && target.classList?.contains("kb-column-scroll")) loadMoreWhenColumnIsNearItsEnd(target);
+  };
+  useEffect(() => {
+    if (subject !== "contentItem") return;
+    boardBodyRef.current?.querySelectorAll<HTMLElement>(".kb-column-scroll").forEach(loadMoreWhenColumnIsNearItsEnd);
+  });
   const pageTitle = subject === "contentItem" ? getContentItemName().plural : "Assignments";
   const issue = issues.find(item => item.id === selected);
   if (!allowed) return <NewsDeskAccessGate shell={session?.shell ?? null} />;
@@ -105,10 +135,10 @@ export function NewsroomBoardView({ subject }: { subject: NewsroomBoardSubject }
     <div className="organizer-native-board papyrus-newsprint-board" data-color-mode={theme}>
       {error && <NewsroomOpsStatusBanner tone="error">{error}</NewsroomOpsStatusBanner>}
       <p role="status" className="organizer-board-note">{loading ? "Loading records…" : `${issues.length} records loaded.`}</p>
-      <div className="organizer-board-body" data-detail-open={Boolean(issue)}>
+      <div className="organizer-board-body" data-detail-open={Boolean(issue)} ref={boardBodyRef} onScrollCapture={handleBoardScroll}>
         <IssueCollection issues={issues} config={config} query={{ type: boardType }} view={view}
           motion={lowMotion ? STATIC_MOTION : undefined}
-          columnStateKey={`papyrus.cms.columns.v1.${SITE_BRAND.id}.${subject}`} initialScroll="start"
+          collapsedColumns={columnState.collapsedColumns} onToggleCollapse={columnState.toggleColumn} initialScroll="start"
           selectedIssueId={selected} detailOpen={Boolean(issue)} onSelectIssue={item => setSelected(item.id)} ariaLabel={pageTitle}
           emptyMessage={loading ? "Loading records…" : error ? "Records could not be loaded." : "No records in this selection."} />
         {issue && <IssueDetailPanel issue={issue} onClose={() => setSelected(null)} fields={[{ label: "CMS record ID", value: issue.nativeId }, { label: "Status", value: issue.nativeStatus }]}>

package/components/use-paged-content-item-versions.ts

@@ -0,0 +1,151 @@
+"use client";
+
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import {
+  canonicalContentItemStage,
+  legacyStageKeysToLoad,
+  type ContentItemVersionRecord,
+} from "../lib/content-item-lifecycle";
+import { getContentItemStageDefinitions } from "../lib/site-brand";
+import { loadNewsroomContentItemStagePage } from "./news-desk-taxonomy-client";
+
+const REFRESH_INTERVAL_MILLISECONDS = 30_000;
+
+type StageBucket = {
+  versions: ContentItemVersionRecord[];
+  nextToken: string | null;
+  pagesLoaded: number;
+};
+
+export type PagedContentItemVersions = {
+  versions: ContentItemVersionRecord[];
+  loading: boolean;
+  error: string | null;
+  stageHasMore: (canonicalStage: string) => boolean;
+  loadMoreForStage: (canonicalStage: string) => void;
+};
+
+function mergeFreshFirstPage(existing: StageBucket | undefined, fresh: StageBucket): StageBucket {
+  if (!existing || existing.pagesLoaded <= 1) return fresh;
+  const freshIds = new Set(fresh.versions.map(version => version.id));
+  return {
+    versions: [...fresh.versions, ...existing.versions.filter(version => !freshIds.has(version.id))],
+    nextToken: existing.nextToken,
+    pagesLoaded: existing.pagesLoaded,
+  };
+}
+
+/**
+ * Newest-updated content items per stage, one page per stage to start, more pages on demand.
+ * The periodic refresh re-fetches only first pages and keeps whatever later pages were already loaded.
+ */
+export function usePagedContentItemVersions(options: {
+  enabled: boolean;
+  openedCollapsedUntilOpenedStages: readonly string[];
+}): PagedContentItemVersions {
+  const { enabled, openedCollapsedUntilOpenedStages } = options;
+  const [buckets, setBuckets] = useState<Record<string, StageBucket>>({});
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const bucketsRef = useRef(buckets);
+  const stageKeysBeingExtendedRef = useRef(new Set<string>());
+  const generationRef = useRef(0);
+
+  const openedStagesSignature = openedCollapsedUntilOpenedStages.join(",");
+  const stageKeysToLoad = useMemo(() => {
+    const stageDefinitions = getContentItemStageDefinitions();
+    return [
+      ...stageDefinitions
+        .filter(definition => !definition.collapsedUntilOpened || openedStagesSignature.split(",").includes(definition.key))
+        .map(definition => definition.key),
+      ...legacyStageKeysToLoad(stageDefinitions),
+    ];
+  }, [openedStagesSignature]);
+  const stageKeysToLoadRef = useRef(stageKeysToLoad);
+  stageKeysToLoadRef.current = stageKeysToLoad;
+
+  const storeBuckets = useCallback((update: (previous: Record<string, StageBucket>) => Record<string, StageBucket>) => {
+    const next = update(bucketsRef.current);
+    bucketsRef.current = next;
+    setBuckets(next);
+  }, []);
+
+  const refreshFirstPages = useCallback(async (request: number, isInitial: boolean, stageKeys: readonly string[]) => {
+    if (isInitial) setLoading(true);
+    try {
+      const freshBuckets = await Promise.all(stageKeys.map(async stageKey => {
+        const page = await loadNewsroomContentItemStagePage(stageKey);
+        return [stageKey, { versions: page.versions, nextToken: page.nextToken, pagesLoaded: 1 }] as const;
+      }));
+      if (generationRef.current !== request) return;
+      storeBuckets(previous => {
+        const next = { ...previous };
+        for (const [stageKey, fresh] of freshBuckets) next[stageKey] = mergeFreshFirstPage(previous[stageKey], fresh);
+        return next;
+      });
+      setError(null);
+    } catch (reason: unknown) {
+      if (generationRef.current === request && isInitial) setError(reason instanceof Error ? reason.message : "Could not load newsroom records.");
+    } finally {
+      if (generationRef.current === request && isInitial) setLoading(false);
+    }
+  }, [storeBuckets]);
+
+  useEffect(() => {
+    const request = ++generationRef.current;
+    bucketsRef.current = {};
+    setBuckets({});
+    setError(null);
+    if (!enabled) { setLoading(false); return; }
+    void refreshFirstPages(request, true, stageKeysToLoadRef.current);
+    const refreshWhenVisible = () => {
+      if (document.visibilityState === "visible") void refreshFirstPages(request, false, stageKeysToLoadRef.current);
+    };
+    const interval = window.setInterval(refreshWhenVisible, REFRESH_INTERVAL_MILLISECONDS);
+    document.addEventListener("visibilitychange", refreshWhenVisible);
+    return () => {
+      generationRef.current = request + 1;
+      window.clearInterval(interval);
+      document.removeEventListener("visibilitychange", refreshWhenVisible);
+    };
+  }, [enabled, refreshFirstPages]);
+
+  useEffect(() => {
+    if (!enabled) return;
+    const stageKeysNotLoadedYet = stageKeysToLoad.filter(stageKey => !(stageKey in bucketsRef.current));
+    if (stageKeysNotLoadedYet.length) void refreshFirstPages(generationRef.current, false, stageKeysNotLoadedYet);
+  }, [enabled, refreshFirstPages, stageKeysToLoad]);
+
+  const stageKeysInCanonicalStage = useCallback((canonicalStage: string) => Object.keys(bucketsRef.current)
+    .filter(stageKey => canonicalContentItemStage(stageKey, getContentItemStageDefinitions()) === canonicalStage), []);
+
+  const loadMoreForStage = useCallback((canonicalStage: string) => {
+    const request = generationRef.current;
+    for (const stageKey of stageKeysInCanonicalStage(canonicalStage)) {
+      const bucket = bucketsRef.current[stageKey];
+      if (!bucket?.nextToken || stageKeysBeingExtendedRef.current.has(stageKey)) continue;
+      stageKeysBeingExtendedRef.current.add(stageKey);
+      loadNewsroomContentItemStagePage(stageKey, bucket.nextToken).then(page => {
+        if (generationRef.current !== request) return;
+        storeBuckets(previous => {
+          const current = previous[stageKey] ?? bucket;
+          const knownIds = new Set(current.versions.map(version => version.id));
+          return {
+            ...previous,
+            [stageKey]: {
+              versions: [...current.versions, ...page.versions.filter(version => !knownIds.has(version.id))],
+              nextToken: page.nextToken,
+              pagesLoaded: current.pagesLoaded + 1,
+            },
+          };
+        });
+      }).catch(() => undefined).finally(() => { stageKeysBeingExtendedRef.current.delete(stageKey); });
+    }
+  }, [stageKeysInCanonicalStage, storeBuckets]);
+
+  const stageHasMore = useCallback((canonicalStage: string) => stageKeysInCanonicalStage(canonicalStage)
+    .some(stageKey => Boolean(bucketsRef.current[stageKey]?.nextToken)), [stageKeysInCanonicalStage]);
+
+  const versions = useMemo(() => Object.values(buckets).flatMap(bucket => bucket.versions), [buckets]);
+  return { versions, loading, error, stageHasMore, loadMoreForStage };
+}

package/lib/blog-feature-solver.ts

@@ -12,7 +12,7 @@ import {
 } from "./blog-rhythm";
 import { layoutAllTextLines, layoutTextLines, prepareWithSegments, type TextLine, type TextObstacle } from "./pretext-layout";
 
-export type FeaturedLayoutMode = "obstacle" | "float" | "stacked";
+export type FeaturedLayoutMode = "float" | "stacked";
 
 export type SolvedFeaturedItem = {
   mode: FeaturedLayoutMode;
@@ -92,19 +92,6 @@ export function solveFeaturedItem(input: SolveFeaturedItemInput): SolvedFeatured
   });
   const aspectRatio = getImageAspectRatio(input.imageAsset);
 
-  if (mode === "obstacle") {
-    return solveObstacleFeaturedItem({
-      prepared,
-      containerWidth: input.containerWidth,
-      viewportWidth: input.viewportWidth,
-      rhythm,
-      textStyle: input.textStyle,
-      aspectRatio,
-      gap,
-      imageAsset: input.imageAsset,
-    });
-  }
-
   if (mode === "float") {
     return solveFloatFeaturedItem({
       prepared,
@@ -151,96 +138,6 @@ type PreparedSolveInput = {
   imageAsset: ArticleImageAsset;
 };
 
-function solveObstacleFeaturedItem(input: PreparedSolveInput): SolvedFeaturedItem {
-  const maxImageWidth = getFloatImageWidth(input);
-  let best: {
-    score: number;
-    textLines: TextLine[];
-    imageHeight: number;
-    imageWidth: number;
-    captionHeight: number;
-    mediaHeight: number;
-    copyWidth: number;
-    textFrameHeight: number;
-    hasMore: boolean;
-  } | null = null;
-
-  for (const imageWidth of getObstacleImageWidths(maxImageWidth, input.rhythm)) {
-    const copyWidth = Math.max(
-      getFloatCopyMinimum(input.viewportWidth, input.rhythm),
-      input.containerWidth - imageWidth - input.gap,
-    );
-    const imageHeight = snapImageHeight(imageWidth / input.aspectRatio, input.rhythm, input.imageAsset.layout);
-    const captionHeight = getFeatureCaptionHeight(input.imageAsset, imageWidth, input.rhythm);
-    const mediaHeight = imageHeight + captionHeight;
-    const obstacle: TextObstacle = {
-      x: Math.max(0, copyWidth - imageWidth),
-      y: 0,
-      width: imageWidth,
-      height: mediaHeight,
-    };
-
-    let candidateHeight = mediaHeight;
-    let result = layoutTextLines({
-      prepared: input.prepared,
-      cursor: { segmentIndex: 0, graphemeIndex: 0 },
-      maxHeight: candidateHeight,
-      maxWidth: copyWidth,
-      lineHeight: input.textStyle.lineHeight,
-      linePaintHeight: input.textStyle.linePaintHeight,
-      fontSize: input.textStyle.fontSize,
-      fontFamily: input.textStyle.fontFamily,
-      obstacles: [obstacle],
-    });
-
-    const textBottom = getMeasuredTextHeight(result.lines);
-    if (textBottom > 0 && textBottom < candidateHeight) {
-      candidateHeight = reserveRhythmRows(textBottom, input.rhythm);
-      obstacle.height = candidateHeight;
-      result = layoutTextLines({
-        prepared: input.prepared,
-        cursor: { segmentIndex: 0, graphemeIndex: 0 },
-        maxHeight: candidateHeight,
-        maxWidth: copyWidth,
-        lineHeight: input.textStyle.lineHeight,
-        linePaintHeight: input.textStyle.linePaintHeight,
-        fontSize: input.textStyle.fontSize,
-        fontFamily: input.textStyle.fontFamily,
-        obstacles: [obstacle],
-      });
-    }
-
-    const whitespace = Math.max(0, candidateHeight - getMeasuredTextHeight(result.lines));
-    const score = 50_000 - whitespace * 1.4 - Math.abs(candidateHeight - mediaHeight) * 0.35 - Math.abs(maxImageWidth - imageWidth) * 0.2;
-    const candidate = {
-      score,
-      textLines: result.lines,
-      imageHeight: Math.min(imageHeight, candidateHeight),
-      imageWidth,
-      captionHeight,
-      mediaHeight: candidateHeight,
-      copyWidth,
-      textFrameHeight: reserveRhythmRows(getMeasuredTextHeight(result.lines), input.rhythm),
-      hasMore: result.hasMore,
-    };
-    if (!best || candidate.score > best.score) best = candidate;
-  }
-
-  const fallbackImageHeight = input.rhythm.rowHeight * 6;
-  return {
-    mode: "obstacle",
-    textLines: best?.textLines ?? [],
-    imageHeight: best?.imageHeight ?? fallbackImageHeight,
-    imageWidth: best?.imageWidth ?? maxImageWidth,
-    captionHeight: best?.captionHeight ?? 0,
-    mediaHeight: best?.mediaHeight ?? fallbackImageHeight,
-    copyWidth: best?.copyWidth ?? input.containerWidth,
-    textFrameHeight: best?.textFrameHeight ?? 0,
-    hasMore: best?.hasMore ?? false,
-    gap: input.gap,
-  };
-}
-
 function solveFloatFeaturedItem(input: PreparedSolveInput): SolvedFeaturedItem {
   const geometry = computeFloatGeometry({
     containerWidth: input.containerWidth,
@@ -417,11 +314,6 @@ function getFloatCopyMinimum(viewportWidth: number, rhythm: VerticalRhythm): num
   return rhythmLengthRows(viewportWidth <= 600 ? FLOAT_COPY_MIN_PHONE_ROWS : FLOAT_COPY_MIN_DESKTOP_ROWS, rhythm);
 }
 
-function getObstacleImageWidths(maximum: number, rhythm: VerticalRhythm): number[] {
-  const candidateRows = [0, 1, 2].map((offset) => Math.max(rhythm.rowHeight * 5, maximum - (offset * rhythm.rowHeight)));
-  return Array.from(new Set(candidateRows));
-}
-
 function snapImageHeight(
   naturalHeight: number,
   rhythm: VerticalRhythm,

package/lib/content-item-lifecycle.ts

@@ -7,24 +7,51 @@
 export type ContentItemStageDefinition = {
   key: string;
   label: string;
+  /** Closed or rarely visited stage: its board column starts collapsed and its cards load only when it is opened. */
+  collapsedUntilOpened?: boolean;
 };
 
+export const PUBLISHED_STAGE_KEY = "published";
+
+/** Stage keys written before the story stages were simplified, read as the stage that replaced them. */
+export const LEGACY_CONTENT_ITEM_STAGE_ALIASES: Readonly<Record<string, string>> = {
+  research: "reporting",
+  report: "reporting",
+  editor_select: "reporting",
+};
+
+/** Stages for work that has not become a story yet; they appear on the assignments board only. */
+export const ASSIGNMENT_PHASE_STAGE_KEYS: readonly string[] = ["idea", "assignment"];
+
 export const DEFAULT_CONTENT_ITEM_STAGE_DEFINITIONS: readonly ContentItemStageDefinition[] = [
-  { key: "idea", label: "Idea" },
-  { key: "assignment", label: "Assignment" },
-  { key: "research", label: "Research" },
-  { key: "report", label: "Report" },
-  { key: "editor_select", label: "Editor select" },
+  { key: "reporting", label: "Reporting" },
   { key: "copywriting", label: "Copywriting" },
   { key: "illustration", label: "Illustration" },
   { key: "typesetting", label: "Typesetting" },
   { key: "published", label: "Published" },
+  { key: "held", label: "Held" },
+  { key: "spiked", label: "Spiked", collapsedUntilOpened: true },
 ];
 
 export function contentItemStageKeys(stageDefinitions: readonly ContentItemStageDefinition[]): string[] {
   return stageDefinitions.map(definition => definition.key);
 }
 
+export function canonicalContentItemStage(
+  stage: string,
+  stageDefinitions: readonly ContentItemStageDefinition[] = DEFAULT_CONTENT_ITEM_STAGE_DEFINITIONS,
+): string {
+  const isDefined = stageDefinitions.some(definition => definition.key === stage);
+  return isDefined ? stage : LEGACY_CONTENT_ITEM_STAGE_ALIASES[stage] ?? stage;
+}
+
+export function legacyStageKeysToLoad(stageDefinitions: readonly ContentItemStageDefinition[]): string[] {
+  const definedKeys = contentItemStageKeys(stageDefinitions);
+  return Object.entries(LEGACY_CONTENT_ITEM_STAGE_ALIASES)
+    .filter(([legacyKey, replacementKey]) => !definedKeys.includes(legacyKey) && definedKeys.includes(replacementKey))
+    .map(([legacyKey]) => legacyKey);
+}
+
 export function contentItemStageLabel(
   stage: string,
   stageDefinitions: readonly ContentItemStageDefinition[] = DEFAULT_CONTENT_ITEM_STAGE_DEFINITIONS,

package/lib/local-preview-seed.ts

@@ -6,15 +6,13 @@ const SEED_TIMESTAMP_BASE = Date.parse("2026-10-01T12:00:00.000Z");
 const ONE_HOUR_IN_MILLISECONDS = 60 * 60 * 1000;
 
 const SEED_CONTENT_ITEM_HEADLINES_BY_POSITION: readonly (readonly string[])[] = [
-  ["Readers ask what the newsroom should chase next", "A tip from the field: harbor dredging schedule"],
-  ["City council budget vote draws a crowd", "Interview request: regional transit director"],
-  ["Mapping every permit filed since January", "What the county audit left out"],
   ["Three sources confirm the zoning reversal", "Reporting packet: school board redistricting"],
-  ["Editor shortlist: the week's lead candidates", "Editor shortlist: the weekend long read"],
   ["Draft in progress: the last ferry crossing", "Draft in progress: neighborhood bakery profile"],
   ["Illustration brief: flooded streets, aerial view", "Illustration brief: the market at dawn"],
   ["Layout pass: front page lead and rail", "Layout pass: the Saturday supplement"],
   ["Published: harbor safety review", "Published: the lighthouse keepers' archive"],
+  ["Held for the winter issue: the lighthouse keepers' archive", "Evergreen: how the harbor dredging works"],
+  ["Spiked: the unconfirmed council rumor", "Spiked: the recycled press release"],
 ];
 
 function isoTimestampHoursBeforeBase(hours: number): string {

package/lib/newsroom-board.ts

@@ -1,6 +1,9 @@
 import type { KanbanConfig, KanbanIssue } from "@kanbus/ui";
 import type { AssignmentRecord } from "./category-repository";
 import {
+  ASSIGNMENT_PHASE_STAGE_KEYS,
+  PUBLISHED_STAGE_KEY,
+  canonicalContentItemStage,
   contentItemStageKeys,
   contentItemStageLabel,
   latestVersionPerContentItem,
@@ -42,8 +45,12 @@ export function projectContentItemBoard(records: {
     }
   }
   const contentItemType = contentItemBoardType();
-  return latestVersionPerContentItem(records.contentItemVersions).map(version => {
-    const stage = version.stage ?? "idea";
+  const stageDefinitions = getContentItemStageDefinitions();
+  const stageKeys = contentItemStageKeys(stageDefinitions);
+  const contentItemVersionsOnBoard = latestVersionPerContentItem(records.contentItemVersions)
+    .map(version => ({ version, stage: canonicalContentItemStage(version.stage ?? "idea", stageDefinitions) }))
+    .filter(({ stage }) => stageKeys.includes(stage) || !ASSIGNMENT_PHASE_STAGE_KEYS.includes(stage));
+  return contentItemVersionsOnBoard.map(({ version, stage }) => {
     const workCount = assignmentCountByContentItem.get(version.lineageId) ?? 0;
     return {
       id: `contentItem:${version.lineageId}`, nativeId: version.lineageId, kind: "contentItem" as const, type: contentItemType,
@@ -70,9 +77,10 @@ export function contentItemColumnOrder(
   stagesPresentOnBoard: readonly string[],
   stageKeys: readonly string[] = contentItemStageKeys(getContentItemStageDefinitions()),
 ): string[] {
-  const lastStage = stageKeys[stageKeys.length - 1];
   const unrecognizedStages = [...new Set(stagesPresentOnBoard)].filter(stage => !stageKeys.includes(stage));
-  return [...stageKeys.filter(stage => stage !== lastStage), ...unrecognizedStages, lastStage];
+  const stageBeforeWhichUnrecognizedStagesSit = stageKeys.includes(PUBLISHED_STAGE_KEY) ? PUBLISHED_STAGE_KEY : stageKeys[stageKeys.length - 1];
+  const insertionIndex = stageKeys.indexOf(stageBeforeWhichUnrecognizedStagesSit);
+  return [...stageKeys.slice(0, insertionIndex), ...unrecognizedStages, ...stageKeys.slice(insertionIndex)];
 }
 
 export function assignmentColumnOrder(statusesPresentOnBoard: readonly string[]): string[] {
@@ -81,7 +89,7 @@ export function assignmentColumnOrder(statusesPresentOnBoard: readonly string[])
   return [...ASSIGNMENT_STATUSES_BEFORE_OTHERS, ...otherStatuses, ...ASSIGNMENT_STATUSES_AFTER_OTHERS];
 }
 
-function boardConfigForType(type: string, columns: readonly { key: string; name: string }[]): KanbanConfig {
+function boardConfigForType(type: string, columns: readonly { key: string; name: string; collapsed?: boolean }[]): KanbanConfig {
   const statuses = columns.map(column => ({ ...column, category: "native" }));
   return {
     hierarchy: [], types: [type], statuses,
@@ -90,11 +98,15 @@ function boardConfigForType(type: string, columns: readonly { key: string; name:
   };
 }
 
-/** Content items read left to right through the lifecycle with the final stage last. */
+/** Content items read left to right through the lifecycle; stages marked collapsed-until-opened start collapsed. */
 export function contentItemBoardConfig(issues: readonly NativeBoardIssue[]): KanbanConfig {
   const contentItemType = contentItemBoardType();
   return boardConfigForType(contentItemType, contentItemColumnOrder(issues.map(issue => issue.nativeStatus))
-    .map(stage => ({ key: `${contentItemType}/${stage}`, name: contentItemStageLabel(stage, getContentItemStageDefinitions()) })));
+    .map(stage => ({
+      key: `${contentItemType}/${stage}`,
+      name: contentItemStageLabel(stage, getContentItemStageDefinitions()),
+      collapsed: getContentItemStageDefinitions().some(definition => definition.key === stage && definition.collapsedUntilOpened),
+    })));
 }
 
 export function assignmentBoardConfig(issues: readonly NativeBoardIssue[]): KanbanConfig {

package/package.json

@@ -135,6 +135,7 @@
     "./components/use-blog-header-obstacles": "./components/use-blog-header-obstacles.ts",
     "./components/use-brand-fonts-ready": "./components/use-brand-fonts-ready.ts",
     "./components/use-near-viewport": "./components/use-near-viewport.ts",
+    "./components/use-paged-content-item-versions": "./components/use-paged-content-item-versions.ts",
     "./components/use-resolved-papyrus-theme": "./components/use-resolved-papyrus-theme.ts",
     "./components/use-rhythm-overlay": "./components/use-rhythm-overlay.ts",
     "./lib/amplify-outputs-guard": "./lib/amplify-outputs-guard.ts",
@@ -350,7 +351,7 @@
       "optional": true
     }
   },
-  "version": "1.5.0",
+  "version": "1.6.0",
   "dependencies": {
     "@aws-amplify/adapter-nextjs": "^1.7.3",
     "@aws-crypto/sha256-js": "5.2.0",
@@ -376,7 +377,9 @@
     "clsx": "^2.1.1",
     "cmdk": "^1.1.1",
     "cyclotron": "https://github.com/AnthusAI/Cyclotron/releases/download/ui-v0.2.2/cyclotron-0.2.2.tgz",
+    "d3": "^7.9.0",
     "esbuild": "^0.28.2",
+    "framer-motion": "^14.3.0",
     "gray-matter": "^4.0.3",
     "gsap": "^3.15.0",
     "lucide-react": "^1.16.0",
@@ -385,6 +388,7 @@
     "shadcn": "^4.8.0",
     "tailwind-merge": "^3.6.0",
     "tailwindcss": "^4.3.0",
+    "three": "^0.186.1",
     "tsx": "^4.23.15",
     "tw-animate-css": "^1.4.0",
     "use-stick-to-bottom": "^1.1.4",

package/renderers/pretext/rhythm-article-page.tsx

@@ -13,6 +13,7 @@ import { PresentationFooter } from "../../components/presentation-footer";
 import { PresentationHeader } from "../../components/presentation-header";
 import { useBlogHeaderObstacles } from "../../components/use-blog-header-obstacles";
 import { useRhythmOverlay } from "../../components/use-rhythm-overlay";
+import { useMeasuredWidth } from "./presentation-shared";
 import { BLOG_RHYTHM, getFeaturedLayoutStyle, getRhythmShellStyle } from "./rhythm-shell-style";
 
 const BlogPageBackground = SITE_BRAND.components?.BlogPageBackground ?? GenericBlogPageBackground;
@@ -135,24 +136,6 @@ export function RhythmArticlePage({
   );
 }
 
-function useMeasuredWidth(ref: RefObject<HTMLElement | null>): number {
-  const [width, setWidth] = useState(0);
-  useEffect(() => {
-    const node = ref.current;
-    if (!node) return;
-    const update = () => setWidth(Math.max(1, Math.floor(node.getBoundingClientRect().width)));
-    update();
-    const observer = new ResizeObserver(update);
-    observer.observe(node);
-    window.addEventListener("resize", update);
-    return () => {
-      observer.disconnect();
-      window.removeEventListener("resize", update);
-    };
-  }, [ref]);
-  return width;
-}
-
 function useViewportWidth(): number {
   const [width, setWidth] = useState(0);
   useEffect(() => {

package/routes.manifest.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.5.0",
+  "version": "1.6.0",
   "routes": [
     {
       "file": "app/%5F_preview/[[...path]]/route.ts",