@anthusai/papyrus 5.41.3 → 5.41.4

package/app/globals.css

@@ -10171,26 +10171,8 @@ img {
 }
 
 
-.papyrus-console-mobile-trigger { display: none; }
 @media (max-width: 900px) {
   .edition-progress__button--console { display: none; }
-  .papyrus-console-mobile-trigger {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    position: fixed;
-    right: 16px;
-    bottom: calc(76px + env(safe-area-inset-bottom));
-    z-index: 1200;
-    min-width: 64px;
-    min-height: 44px;
-    padding: 8px 16px;
-    background: rgb(var(--paper-rgb));
-    color: var(--ink);
-    border: 1px solid currentColor;
-    font: 600 14px Arial, sans-serif;
-  }
-  .papyrus-console-mobile-trigger:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
   .papyrus-console--open {
     --papyrus-console-width: 100vw;
     background: rgb(var(--paper-rgb));
@@ -10200,6 +10182,20 @@ img {
   }
 }
 
+.papyrus-console__access {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 16px;
+  padding: 24px 18px;
+  overflow-y: auto;
+  color: var(--ink);
+  font-size: 0.95rem;
+  line-height: 1.5;
+}
+.papyrus-console__access strong { font-size: 1.15rem; }
+.papyrus-console__access button { min-height: 44px; padding: 10px 14px; font: inherit; text-transform: none; letter-spacing: normal; }
+
 @media (max-width: 900px) {
   .papyrus-console__header button { min-width: 44px; min-height: 44px; }
 }

package/components/newsroom-mobile-navigation.tsx

@@ -0,0 +1,23 @@
+"use client";
+
+import type { ReactNode } from "react";
+import Link from "next/link";
+import { BookOpen, ClipboardList, House, MessageCircle, MessagesSquare } from "lucide-react";
+
+const ICONS = { overview: House, articles: ClipboardList, references: BookOpen, messages: MessagesSquare };
+
+export function NewsroomMobileNavigation({ items, activeTab, chat, more }: {
+  items: readonly { key: string; label: string; description: string; href: string }[];
+  activeTab: string;
+  chat?: { open: boolean; onOpen: () => void };
+  more: ReactNode;
+}) {
+  return <nav className="organizer-bottom-nav" aria-label="Primary newsroom navigation"><ul>
+    {items.map(item => {
+      if (item.key === "messages" && chat) return <li key="chat"><button className="organizer-chat" type="button" aria-label="Open private chat" aria-expanded={chat.open} aria-controls="papyrus-console-panel" onClick={chat.onOpen}><MessageCircle size={18} aria-hidden="true" /><span>Chat</span></button></li>;
+      const Icon = ICONS[item.key as keyof typeof ICONS];
+      return <li key={item.key}><Link href={item.href} title={item.description} aria-label={item.label} aria-current={activeTab === item.key ? "page" : undefined}><Icon size={18} aria-hidden="true" /><span>{item.label}</span></Link></li>;
+    })}
+    <li>{more}</li>
+  </ul></nav>;
+}

package/components/newsroom-ops-shell.tsx

@@ -8,7 +8,7 @@ import { cn } from "../lib/utils";
 import { useEffect, useId, useState, type ReactNode } from "react";
 import Link from "next/link";
 import { usePathname, useRouter, useSearchParams } from "next/navigation";
-import { BookOpen, ClipboardList, House, Menu, Search, MessagesSquare, PanelLeftClose, PanelLeftOpen, Settings, UserRound, LogIn, LogOut } from "lucide-react";
+import { Menu, Search, PanelLeftClose, PanelLeftOpen, Settings, UserRound, LogIn, LogOut } from "lucide-react";
 import { ORGANIZER_NAV_GROUPS, ORGANIZER_PRIMARY_NAV, ORGANIZER_SETTINGS_DESTINATION } from "../lib/newsroom-organizer-nav";
 import { browserPathToInternalNewsroomPath } from "../lib/newsroom-base-path";
 import { getNewsroomNavHref } from "../lib/newsroom-nav";
@@ -20,6 +20,8 @@ import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetDescription, SheetTr
 import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuItem, DropdownMenuSeparator } from "./ui/dropdown-menu";
 import "./newsroom-organizer.css";
 import { NewsroomThemeFonts, useNewsroomThemeAttributes } from "./newsroom-theme";
+import { NewsroomMobileNavigation } from "./newsroom-mobile-navigation";
+import { usePapyrusConsole } from "./papyrus-console-shell";
 
 export type NewsroomNavCount = {
   count: number | null;
@@ -55,8 +57,6 @@ function OrganizerSearch({ demo }: { demo: boolean }) {
   </form>;
 }
 
-const ICONS = { overview: House, articles: ClipboardList, references: BookOpen, messages: MessagesSquare };
-
 /** Navigation is a presentation layer; existing route and server authorization still own access. */
 function Navigation({ activePath, demo, admin, surface, onNavigate }: { activePath: string; demo: boolean; admin: boolean; surface: string; onNavigate?: () => void }) {
   const id = useId();
@@ -105,6 +105,7 @@ function Account({ placement }: { placement: "sidebar" | "header" }) {
 }
 
 export function NewsroomOpsShell({ activeTab, appTitle, backHref = "/", backLabel, children, demo = false, headerActions, pageTitle, showNavigation = true }: NewsroomOpsShellProps) {
+  const consoleState = usePapyrusConsole();
   const pathname = usePathname();
   const themeAttributes = useNewsroomThemeAttributes();
   const session = useOptionalNewsDeskClient();
@@ -166,16 +167,13 @@ export function NewsroomOpsShell({ activeTab, appTitle, backHref = "/", backLabe
       </header>
       <main className="organizer-main">{demo && <p className="organizer-demo-notice">Demo workspace · synthetic examples</p>}{children}</main>
     </div>
-    {showNavigation && <nav className="organizer-bottom-nav" aria-label="Primary newsroom navigation"><ul>
-      {ORGANIZER_PRIMARY_NAV.map(item => { const Icon = ICONS[item.key as keyof typeof ICONS]; return <li key={item.key}><Link
-        href={getNewsroomNavHref(item.path, demo)} title={item.description} aria-label={item.label} aria-current={activeTab === item.key ? "page" : undefined}>
-        <Icon size={18} aria-hidden="true" /><span>{item.label}</span></Link></li>; })}
-      <li><Sheet open={menuOpen} onOpenChange={setMenuOpen}><SheetTrigger className="organizer-more" aria-label="More"><Menu size={18} aria-hidden="true" /><span>More</span></SheetTrigger>
+    {showNavigation && <NewsroomMobileNavigation activeTab={activeTab} items={ORGANIZER_PRIMARY_NAV.map(item => ({ ...item, href: getNewsroomNavHref(item.path, demo) }))}
+      chat={consoleState?.shouldOfferConsole ? { open: consoleState.open, onOpen: consoleState.openConsole } : undefined}
+      more={<Sheet open={menuOpen} onOpenChange={setMenuOpen}><SheetTrigger className="organizer-more" aria-label="More"><Menu size={18} aria-hidden="true" /><span>More</span></SheetTrigger>
         <SheetContent side="bottom" className="organizer-menu" {...themeAttributes}><SheetHeader><SheetTitle>Newsroom</SheetTitle><SheetDescription>Workspaces and administration</SheetDescription></SheetHeader>
           <Navigation activePath={activePath} demo={demo} admin={admin} surface="menu" onNavigate={() => setMenuOpen(false)} />
         </SheetContent>
-      </Sheet></li>
-    </ul></nav>}
+      </Sheet>} />}
   </div>;
 }
 

package/components/newsroom-organizer.css

@@ -33,6 +33,7 @@ body:has(.newsroom-organizer)>[data-staging-banner]{flex-shrink:0}
 .organizer-account-popup{min-width:250px;max-width:calc(100vw - 32px);border:1px solid var(--org-line);padding:6px;border-radius:4px}
 .organizer-account-popup [role=menuitem]{min-height:40px;font-size:12px}.organizer-account-popup .reader-auth{display:contents}.organizer-account-popup .reader-auth__error{display:block;white-space:normal;font-size:11px;padding:8px}
 .organizer-bottom-nav{display:none}
+.organizer-bottom-nav button{appearance:none;border:0;background:transparent;color:inherit}
 .organizer-main:has(.organizer-native-board){display:flex;overflow:hidden}
 .organizer-native-board{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;gap:8px}
 .organizer-board-view-toggle{display:flex;gap:4px;flex-shrink:0}

package/components/papyrus-console-frame.tsx

@@ -2,11 +2,10 @@
 
 import { useEffect, useRef, useState, type ReactNode } from "react";
 
-export function PapyrusConsoleFrame({ available, open, reserveSpace, onOpen, onClose, page, children }: {
+export function PapyrusConsoleFrame({ available, open, reserveSpace, onClose, page, children }: {
   available: boolean;
   open: boolean;
   reserveSpace: boolean;
-  onOpen: () => void;
   onClose: () => void;
   page: ReactNode;
   children: ReactNode;
@@ -45,14 +44,13 @@ export function PapyrusConsoleFrame({ available, open, reserveSpace, onOpen, onC
       cancelAnimationFrame(frame);
       requestAnimationFrame(() => {
         if (previous instanceof HTMLElement && previous !== document.body && previous.isConnected && !previous.closest("[inert]")) previous.focus();
-        else Array.from(document.querySelectorAll<HTMLElement>(".papyrus-console-mobile-trigger, .edition-progress__button--console, .papyrus-console__header button")).find(element => element.getClientRects().length > 0)?.focus();
+        else Array.from(document.querySelectorAll<HTMLElement>(".organizer-chat, .edition-progress__button--console, .papyrus-console__header button")).find(element => element.getClientRects().length > 0)?.focus();
       });
     };
   }, [modal]);
 
   return <>
     <div className={reserveSpace ? "papyrus-console-page papyrus-console-page--open" : "papyrus-console-page"} inert={modal || undefined}>{page}</div>
-    {available && !open ? <button className="papyrus-console-mobile-trigger" type="button" aria-label="Open private chat" aria-expanded={false} aria-controls="papyrus-console-panel" onClick={onOpen}>Chat</button> : null}
     {available ? <aside ref={panel} id="papyrus-console-panel" className={open ? "papyrus-console papyrus-console--open" : "papyrus-console"} aria-label="Papyrus console" role={modal ? "dialog" : undefined} aria-modal={modal || undefined}
       style={modal && viewport ? { top: viewport.top, height: viewport.height, bottom: "auto" } : undefined}
       onKeyDown={event => {

package/components/papyrus-console-shell.tsx

@@ -36,6 +36,7 @@ import {
 } from "./reader-settings";
 import { PapyrusConsoleConversation, type ConsoleConversationMessage } from "./papyrus-console-conversation";
 import { PapyrusConsoleFrame } from "./papyrus-console-frame";
+import { useConsoleVisibility } from "./use-console-visibility";
 import { PapyrusPrivateChatPanel } from "./papyrus-private-chat-panel";
 import { ModelSelector } from "./ai-elements/model-selector";
 import { Suggestion, Suggestions } from "./ai-elements/suggestion";
@@ -150,12 +151,12 @@ const PapyrusConsoleContext = createContext<PapyrusConsoleContextValue | null>(n
 export function PapyrusConsoleShell({ children, privateChatEnabled = false }: PapyrusConsoleShellProps) {
   const pathname = usePathname();
   const [session, setSession] = useState<ReaderSessionSnapshot | null>(null);
-  const [open, setOpen] = useState(false);
   const [openingReferenceChat, setOpeningReferenceChat] = useState(false);
   const internalPathname = browserPathToInternalNewsroomPath(pathname);
   const isNewsroomPath = internalPathname === "/newsroom" || internalPathname.startsWith("/newsroom/");
   const canUseConsole = Boolean(session?.hasSession && session.groups.some((group) => group === "editor" || group === "admin"));
   const shouldOfferConsole = isNewsroomPath && canUseConsole;
+  const { open, openConsole, closeConsole, toggleOpen } = useConsoleVisibility({ available: shouldOfferConsole });
 
   useEffect(() => {
     let active = true;
@@ -166,37 +167,11 @@ export function PapyrusConsoleShell({ children, privateChatEnabled = false }: Pa
       .catch(() => {
         if (active) setSession({ auth: { status: "signedOut", label: "Signed out" }, groups: [], hasSession: false });
       });
-    try {
-      setOpen(window.localStorage.getItem("papyrus:console-open") === "true");
-    } catch {
-      setOpen(false);
-    }
     return () => {
       active = false;
     };
   }, []);
 
-  const toggleOpen = useCallback(() => {
-    setOpen((current) => {
-      const next = !current;
-      try {
-        window.localStorage.setItem("papyrus:console-open", String(next));
-      } catch {
-        // Ignore storage failures.
-      }
-      return next;
-    });
-  }, []);
-
-  const openConsole = useCallback(() => {
-    setOpen(true);
-    try {
-      window.localStorage.setItem("papyrus:console-open", "true");
-    } catch {
-      // Ignore storage failures.
-    }
-  }, []);
-
   const startReferenceChat = useCallback(async (target: NewsroomKnowledgeQueryTarget) => {
     if (!canUseConsole) {
       throw new Error("Chat is only available to editor/admin sessions.");
@@ -359,13 +334,13 @@ export function PapyrusConsoleShell({ children, privateChatEnabled = false }: Pa
 
   return (
     <PapyrusConsoleContext.Provider value={consoleContext}>
-      <PapyrusConsoleFrame available={shouldOfferConsole} open={open} reserveSpace={canUseConsole && open} onClose={toggleOpen} onOpen={openConsole} page={children}>
+      <PapyrusConsoleFrame available={shouldOfferConsole} open={open} reserveSpace={canUseConsole && open} onClose={closeConsole} page={children}>
         {open ? (
           canUseConsole
             ? privateChatEnabled
-              ? <PapyrusPrivateChatPanel onClose={toggleOpen} />
-              : <ConsolePanel actorEmail={session?.auth.status === "signedIn" ? (session.auth.email ?? null) : null} actorLabel={session?.auth.label ?? "Papyrus editor"} onClose={toggleOpen} />
-            : <ConsoleAccessPanel onClose={toggleOpen} session={session} />
+                ? <PapyrusPrivateChatPanel onClose={closeConsole} />
+                : <ConsolePanel actorEmail={session?.auth.status === "signedIn" ? (session.auth.email ?? null) : null} actorLabel={session?.auth.label ?? "Papyrus editor"} onClose={closeConsole} />
+            : <ConsoleAccessPanel onClose={closeConsole} session={session} />
         ) : null}
       </PapyrusConsoleFrame>
     </PapyrusConsoleContext.Provider>

package/components/papyrus-private-chat-panel.tsx

@@ -175,21 +175,26 @@ export function PapyrusPrivateChatPanel({ onClose }: { onClose: () => void }) {
       <button className="papyrus-console__close" onClick={onClose} type="button" aria-label="Close console">×</button>
     </header>
     {channel ? <p className="papyrus-console__empty" role="status">Private conversation for your selected Account.</p> : null}
-    {!channel && !loading ? <div className="papyrus-console__empty" role="alert">
+    {!channel && !loading ? <div className="papyrus-console__access" role="alert">
       {error === "chat_identity_connection_required" ? <>
         <strong>Connect your publishing account</strong>
         {connectionNotice ? <span>{connectionNotice}</span> : null}
         <span>Continue with the same Google account you use in the newsroom, then choose the Account for this private conversation.</span>
         <button className="papyrus-console__new-session" disabled={connecting} onClick={() => void connect()} type="button">{connecting ? "Connecting…" : "Connect publishing account"}</button>
       </> : accountState?.status === "signedIn" ? <>
-        <strong>Choose your publishing Account</strong>
-        {accountState.publishingAccounts.length === 0 ? <span>This identity has no publishing Account for this site. Ask the Account owner to confirm your existing access.</span> : accountState.publishingAccounts.map(account => <button className="papyrus-console__new-session" disabled={connecting} key={account.accountId} onClick={() => void chooseAccount(account.accountId)} type="button">{account.name ?? account.accountId}</button>)}
+        <strong>{accountState.publishingAccounts.length === 0 ? "Chat access is unavailable" : "Choose your publishing Account"}</strong>
+        {accountState.publishingAccounts.length === 0 ? <>
+          <span>None of your Accounts is enabled for this publication. Publication setup must be resolved before you can chat.</span>
+          <span>You can return to the newsroom while this is resolved. Check again after access has been corrected.</span>
+          <button className="papyrus-console__new-session" onClick={() => void openConversation()} type="button">Check again</button>
+        </> : accountState.publishingAccounts.map(account => <button className="papyrus-console__new-session" disabled={connecting} key={account.accountId} onClick={() => void chooseAccount(account.accountId)} type="button">{account.name ?? account.accountId}</button>)}
         {error !== "publishing_account_required" ? <span>{error}</span> : null}
       </> : <>
         <strong>Private chat could not be opened.</strong>
-        <span>{error === "sign_in_required" ? "Your newsroom session has expired. Sign in from the account menu, then retry." : error}</span>
+        <span>{error === "sign_in_required" ? "Your newsroom session has expired. Return to the newsroom and sign in from the account menu, then retry." : error === "chat_account_access_denied" ? "Your access to this conversation has changed. Retry to check your current access." : error === "publishing_account_required" ? "Publishing Account access could not be checked. Retry when your connection is available." : error}</span>
         <button className="papyrus-console__new-session" onClick={() => void openConversation()} type="button">Retry</button>
       </>}
+      <button className="papyrus-console__new-session" onClick={onClose} type="button">Back to newsroom</button>
     </div> : <PapyrusConsoleConversation
       messages={conversationMessages}
       isSending={sending || loading || !channel}

package/components/use-console-visibility.ts

@@ -0,0 +1,47 @@
+"use client";
+
+import { useCallback, useEffect, useRef, useState } from "react";
+
+export function useConsoleVisibility({ available, persist = true }: { available: boolean; persist?: boolean }) {
+  const [open, setOpen] = useState(false);
+  const visible = useRef(false);
+  const entry = useRef<string | null>(null);
+  const setVisible = useCallback((next: boolean) => {
+    visible.current = next;
+    setOpen(next);
+    if (persist) try { localStorage.setItem("papyrus:console-open", String(next)); } catch { /* Optional preference. */ }
+  }, [persist]);
+  const openConsole = useCallback(() => {
+    if (!available || visible.current) return;
+    const existing = history.state?.papyrusMobileChat;
+    if (typeof existing === "string") entry.current = existing;
+    else if (matchMedia("(max-width: 900px)").matches) {
+      entry.current = crypto.randomUUID();
+      history.pushState({ ...history.state, papyrusMobileChat: entry.current }, "", location.href);
+    }
+    setVisible(true);
+  }, [available, setVisible]);
+  const closeConsole = useCallback(() => {
+    if (entry.current && history.state?.papyrusMobileChat === entry.current) history.back();
+    else setVisible(false);
+  }, [setVisible]);
+  const toggleOpen = useCallback(() => {
+    if (visible.current) closeConsole();
+    else openConsole();
+  }, [closeConsole, openConsole]);
+  useEffect(() => {
+    if (!available) {
+      visible.current = false;
+      setOpen(false);
+      return;
+    }
+    const pop = (event: PopStateEvent) => {
+      if (entry.current) setVisible(event.state?.papyrusMobileChat === entry.current);
+    };
+    window.addEventListener("popstate", pop);
+    if (typeof history.state?.papyrusMobileChat === "string") openConsole();
+    else if (persist) try { if (localStorage.getItem("papyrus:console-open") === "true") openConsole(); } catch { /* Optional preference. */ }
+    return () => window.removeEventListener("popstate", pop);
+  }, [available, openConsole, persist, setVisible]);
+  return { open, openConsole, closeConsole, toggleOpen };
+}

package/package.json

@@ -106,6 +106,7 @@
     "./components/newsroom-client-shell": "./components/newsroom-client-shell.tsx",
     "./components/newsroom-curation-bootstrap": "./components/newsroom-curation-bootstrap.tsx",
     "./components/newsroom-curation-provider": "./components/newsroom-curation-provider.tsx",
+    "./components/newsroom-mobile-navigation": "./components/newsroom-mobile-navigation.tsx",
     "./components/newsroom-ops-overview": "./components/newsroom-ops-overview.tsx",
     "./components/newsroom-ops-shell": "./components/newsroom-ops-shell.tsx",
     "./components/newsroom-overview-skeleton": "./components/newsroom-overview-skeleton.tsx",
@@ -168,6 +169,7 @@
     "./components/ui/tooltip": "./components/ui/tooltip.tsx",
     "./components/use-blog-header-obstacles": "./components/use-blog-header-obstacles.ts",
     "./components/use-brand-fonts-ready": "./components/use-brand-fonts-ready.ts",
+    "./components/use-console-visibility": "./components/use-console-visibility.ts",
     "./components/use-editorial-checks": "./components/use-editorial-checks.ts",
     "./components/use-near-viewport": "./components/use-near-viewport.ts",
     "./components/use-paged-content-item-versions": "./components/use-paged-content-item-versions.ts",
@@ -459,7 +461,7 @@
       "optional": true
     }
   },
-  "version": "5.41.3",
+  "version": "5.41.4",
   "dependencies": {
     "@aws-amplify/adapter-nextjs": "^1.7.3",
     "@aws-crypto/sha256-js": "5.2.0",

package/routes.manifest.json

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

package/src/with-papyrus.mjs

@@ -50,7 +50,7 @@ export function staticGenerationSettings() {
   };
 }
 
-export const DEFAULT_TRANSPILE_PACKAGES = ["@anthusai/papyrus", "cyclotron", "chatticus"];
+export const DEFAULT_TRANSPILE_PACKAGES = ["@anthusai/papyrus", "cyclotron", "chatticus", "lucide-react"];
 
 export function mergeTranspilePackages(existing = []) {
   return [...new Set([...existing, ...DEFAULT_TRANSPILE_PACKAGES])];