@embedpdf/viewer-chrome 3.0.0-next.15 → 3.0.0-next.16

package/dist/index.cjs

@@ -1,18 +1,21 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_icons = require("./icons-x0Tc05bs.cjs");
-const require_commands = require("./commands-CYt4SFUX.cjs");
+const require_icons = require("./icons-1UfLUZ_y.cjs");
+const require_commands = require("./commands-DL1gjZt7.cjs");
 const require_chrome = require("./chrome.cjs");
-const require_toolbar = require("./toolbar-CJu2wKTU.cjs");
-const require_sheet = require("./sheet-BDsa_Sup.cjs");
+const require_toolbar = require("./toolbar-ddvpsvTb.cjs");
+const require_theme = require("./theme-FR26JI3r.cjs");
+const require_sheet = require("./sheet-DTBFiwde.cjs");
 const require_stamp_store = require("./stamp-store-BHvRs-Do.cjs");
-const require_annotation_fonts = require("./annotation-fonts-Dt0IQXhz.cjs");
-const require_dialog = require("./dialog-t8F13BL_.cjs");
+const require_annotation_fonts = require("./annotation-fonts-dpfVkhnq.cjs");
+const require_dialog = require("./dialog-CngKTnAM.cjs");
 let react = require("react");
 let _embedpdf_react_runtime = require("@embedpdf/react/runtime");
 let _embedpdf_react_stage = require("@embedpdf/react/stage");
 let _embedpdf_react_render = require("@embedpdf/react/render");
 let _embedpdf_react_page_edit = require("@embedpdf/react/page-edit");
 let _embedpdf_react_metadata = require("@embedpdf/react/metadata");
+let _embedpdf_react_outline = require("@embedpdf/react/outline");
+let _embedpdf_react_attachment = require("@embedpdf/react/attachment");
 let _embedpdf_react_interaction = require("@embedpdf/react/interaction");
 let _embedpdf_react_selection = require("@embedpdf/react/selection");
 let _embedpdf_react_annotation = require("@embedpdf/react/annotation");
@@ -150,6 +153,7 @@ const en = {
 				note: "Comment",
 				link: "Link",
 				gotoLink: "Go to link",
+				saveFile: "Save file",
 				removeLink: "Remove link",
 				delete: "Delete",
 				group: "Group",
@@ -206,12 +210,44 @@ const en = {
 				"annotations-create": "Adding annotations isn't allowed",
 				"doc-annotate-modify": "Changing annotations isn't allowed",
 				"doc-annotate-read": "Viewing annotations isn't allowed",
+				"doc-attachments-modify": "Adding files isn’t allowed",
 				"doc-download": "Downloading isn't allowed",
 				"doc-forms-modify": "Editing form fields isn't allowed",
+				"doc-outline-modify": "Changing the outline isn’t allowed",
+				"doc-pages-assemble": "Changing pages isn’t allowed",
 				"doc-print": "Printing isn't allowed",
 				"doc-text-copy": "Copying isn't allowed",
 				"doc-text-search": "Searching isn't allowed"
 			},
+			attachment: {
+				add: "Add file",
+				save: "Save",
+				goTo: "Go to page",
+				delete: "Delete",
+				more: "More options"
+			},
+			outline: {
+				add: "Add item",
+				addChild: "Add child item",
+				rename: "Rename",
+				setDestination: "Set destination to current view",
+				properties: "Properties…",
+				delete: "Delete",
+				expandAll: "Expand all",
+				collapseAll: "Collapse all",
+				more: "More options"
+			},
+			pages: {
+				rotateClockwise: "Rotate Page Clockwise",
+				rotateCounterclockwise: "Rotate Page Counter-Clockwise",
+				delete: "Delete Pages",
+				duplicate: "Duplicate Pages",
+				insertBlank: "Insert Blank Page",
+				insertFile: "Insert from File…",
+				extract: "Extract Pages",
+				selectAll: "Select All Pages",
+				more: "Page Options"
+			},
 			turnedOff: "{label} isn't available"
 		},
 		passwordPrompt: {
@@ -264,6 +300,25 @@ const en = {
 			other: "Other"
 		},
 		goToPage: { go: "Go" },
+		print: {
+			title: "Print",
+			pages: "Pages",
+			allPages: "All pages",
+			currentPage: "Current page",
+			range: "Custom",
+			rangeLabel: "Pages to print",
+			rangePlaceholder: "e.g. 1-3, 5",
+			rangeInvalid: "Use page numbers from 1 to {total}, such as 1-3, 5",
+			annotations: "Print annotations",
+			preparing: "Preparing…",
+			preparingPage: "Preparing page {page} of {total}…",
+			ready: "Ready to print.",
+			images: "Pages print as images at {dpi} DPI.",
+			lowResolution: "This document allows only low-resolution printing ({dpi} DPI).",
+			failed: "The printout couldn’t be prepared.",
+			cancel: "Cancel",
+			print: "Print"
+		},
 		panels: {
 			thumbnails: "Thumbnails",
 			outline: "Outline",
@@ -459,6 +514,46 @@ const en = {
 			noRotate: "Stays upright when the page rotates",
 			invisible: "Legacy: hide unknown subtypes"
 		},
+		attachments: {
+			loading: "Loading attachments…",
+			failed: "The attachments couldn’t be read.",
+			empty: "This document has no attached files",
+			drop: "Drop files to attach them",
+			dropHint: "Or drop files here",
+			adding: "Adding…",
+			onPage: "Page {page}",
+			count: "{count} file",
+			countPlural: "{count} files"
+		},
+		outline: {
+			filter: "Filter outline",
+			loading: "Loading outline…",
+			failed: "The outline couldn’t be read.",
+			empty: "This document has no outline",
+			noMatches: "No items match",
+			incomplete: "Part of the outline couldn’t be read.",
+			untitled: "Untitled",
+			properties: {
+				title: "Item properties",
+				name: "Title",
+				color: "Color",
+				noColor: "None",
+				customColor: "Custom color",
+				bold: "Bold",
+				italic: "Italic",
+				open: "Expanded when the document opens",
+				target: "Destination",
+				targetNone: "None",
+				targetView: "Current view",
+				targetNamed: "Page action",
+				targetKept: "Kept as it is",
+				keptNote: "This item runs a script or opens another file. It can’t be changed here.",
+				fit: "Fit",
+				fitKept: "As it is",
+				save: "Save",
+				cancel: "Cancel"
+			}
+		},
 		linkEditor: {
 			toUrl: "Link to a URL",
 			url: "URL",
@@ -621,18 +716,18 @@ const en = {
 */
 /** The viewer's languages besides English, by code. */
 const LOCALE_LOADERS = {
-	de: () => Promise.resolve().then(() => require("./de-Dv6zvbnd.cjs")).then((module) => module.de),
-	fr: () => Promise.resolve().then(() => require("./fr-BBQQn7tJ.cjs")).then((module) => module.fr),
-	es: () => Promise.resolve().then(() => require("./es-BP09DR9w.cjs")).then((module) => module.es),
-	it: () => Promise.resolve().then(() => require("./it-BuP4o0xQ.cjs")).then((module) => module.it),
-	nl: () => Promise.resolve().then(() => require("./nl-D3KZDDiJ.cjs")).then((module) => module.nl),
-	pt: () => Promise.resolve().then(() => require("./pt-C5S-8MC5.cjs")).then((module) => module.pt),
-	pl: () => Promise.resolve().then(() => require("./pl-DSFhAUqx.cjs")).then((module) => module.pl),
-	ja: () => Promise.resolve().then(() => require("./ja-DovEd6ts.cjs")).then((module) => module.ja),
-	"zh-CN": () => Promise.resolve().then(() => require("./zh-cn-3tmMeHqv.cjs")).then((module) => module.zhCN),
-	ko: () => Promise.resolve().then(() => require("./ko-B-qJEol2.cjs")).then((module) => module.ko),
-	ar: () => Promise.resolve().then(() => require("./ar-DnEj5vbP.cjs")).then((module) => module.ar),
-	he: () => Promise.resolve().then(() => require("./he-DRsG7bH7.cjs")).then((module) => module.he)
+	de: () => Promise.resolve().then(() => require("./de-7_MvFWzN.cjs")).then((module) => module.de),
+	fr: () => Promise.resolve().then(() => require("./fr-C856dmQJ.cjs")).then((module) => module.fr),
+	es: () => Promise.resolve().then(() => require("./es-DgYj-1L3.cjs")).then((module) => module.es),
+	it: () => Promise.resolve().then(() => require("./it-Bef-2Yxq.cjs")).then((module) => module.it),
+	nl: () => Promise.resolve().then(() => require("./nl-BjkbaLq3.cjs")).then((module) => module.nl),
+	pt: () => Promise.resolve().then(() => require("./pt-DLcszlzi.cjs")).then((module) => module.pt),
+	pl: () => Promise.resolve().then(() => require("./pl-CKKdVnpZ.cjs")).then((module) => module.pl),
+	ja: () => Promise.resolve().then(() => require("./ja-DNw2zqSD.cjs")).then((module) => module.ja),
+	"zh-CN": () => Promise.resolve().then(() => require("./zh-cn-CZOO3p4H.cjs")).then((module) => module.zhCN),
+	ko: () => Promise.resolve().then(() => require("./ko-YHzeBqP6.cjs")).then((module) => module.ko),
+	ar: () => Promise.resolve().then(() => require("./ar-B132r9bo.cjs")).then((module) => module.ar),
+	he: () => Promise.resolve().then(() => require("./he-BFTeNc4t.cjs")).then((module) => module.he)
 };
 /**
 * The language a `locale` value shows, among `codes`: the browser's languages for `'auto'`,
@@ -770,6 +865,8 @@ const VIEWER_PLUGINS = {
 	signature: _embedpdf_react_signature.SignatureToken,
 	pageEdit: _embedpdf_react_page_edit.PageEditToken,
 	metadata: _embedpdf_react_metadata.MetadataToken,
+	outline: _embedpdf_react_outline.OutlineToken,
+	attachment: _embedpdf_react_attachment.AttachmentToken,
 	actions: _embedpdf_react_actions.ActionsToken,
 	documents: _embedpdf_react_runtime.DocumentsToken,
 	interaction: _embedpdf_react_interaction.InteractionToken,
@@ -959,6 +1056,8 @@ const WITHOUT_SETTINGS = /* @__PURE__ */ new Set([
 	"link",
 	"pageEdit",
 	"metadata",
+	"outline",
+	"attachment",
 	"documents",
 	"shell"
 ]);
@@ -1015,92 +1114,6 @@ function settingsOver(viewerSettings, settings) {
 	return (0, _embedpdf_react_runtime.mergeSettings)(viewerSettings, settings);
 }
 //#endregion
-//#region src/ui/theme.tsx
-/**
-* Light/dark theme — one class, and the CSS variables in styles.css do the
-* rest (both toolbars, sidebars, popovers, and the canvas re-theme from it).
-* The mode follows the embedder's `theme` preference while the viewer runs;
-* `'system'` follows the OS setting, and switches when the user changes it.
-* The class lands on <html> by default; a delivery that must not touch the
-* page (the <embedpdf-viewer> shadow root) passes `target` and the class stays
-* inside its own subtree. The theme's tokens are CSS variables too: a delivery
-* applies {@link themeTokenCss} on the viewer's root.
-*/
-/**
-* The viewer's look, by name: each is the CSS variable `--epdf-<name>`, which the chrome's
-* stylesheet declares with a default for each mode and mixes every other shade from.
-*/
-const THEME_TOKENS = [
-	"accent",
-	"background",
-	"surface",
-	"surface-raised",
-	"text",
-	"text-muted",
-	"border",
-	"hover",
-	"canvas",
-	"radius",
-	"font"
-];
-/** Normalize the shorthand — deliveries use this to read one shape. */
-const themeConfigOf = (theme) => typeof theme === "string" ? { preference: theme } : theme ?? {};
-const isThemeToken = (name) => THEME_TOKENS.includes(name);
-/** The declarations of `tokens` that are tokens with a CSS value; each other entry warns. */
-function tokenDeclarations(tokens) {
-	return Object.entries(tokens).filter(([name, value]) => {
-		if (value === void 0) return false;
-		if (!isThemeToken(name)) {
-			console.warn(`[embedpdf] theme: "${name}" isn't a token, ignored`);
-			return false;
-		}
-		if (typeof value !== "string" || /[{};]/.test(value)) {
-			console.warn(`[embedpdf] theme: ignoring the invalid value of "${name}"`);
-			return false;
-		}
-		return true;
-	}).map(([name, value]) => `--epdf-${name}:var(--embedpdf-host-${name},${value});`).join("");
-}
-/**
-* The CSS that applies a theme's tokens on the viewer's root (`root`, a selector), for a sheet
-* after the chrome's: its tokens win over the defaults in both modes by coming later, and its
-* dark ones win in dark by naming the class too. A value is a default only: the page's own
-* `--epdf-*` variable still wins, read on the host as the chrome's stylesheet does. Empty when
-* the theme sets no token.
-*/
-function themeTokenCss(theme, root) {
-	const { accent, tokens, dark } = themeConfigOf(theme);
-	const both = tokenDeclarations({
-		...accent === void 0 ? null : { accent },
-		...tokens
-	});
-	const darkOnly = dark ? tokenDeclarations(dark) : "";
-	return (both ? `${root}{${both}}` : "") + (darkOnly ? `${root}.dark{${darkOnly}}` : "");
-}
-const ThemeCtx = (0, react.createContext)(null);
-const DARK_QUERY = "(prefers-color-scheme: dark)";
-const systemMode = () => typeof window !== "undefined" && window.matchMedia?.(DARK_QUERY).matches ? "dark" : "light";
-function ThemeProvider({ children, preference = "system", target }) {
-	const [system, setSystem] = (0, react.useState)(systemMode);
-	(0, react.useEffect)(() => {
-		if (preference !== "system" || typeof window === "undefined" || !window.matchMedia) return;
-		const query = window.matchMedia(DARK_QUERY);
-		const follow = () => setSystem(query.matches ? "dark" : "light");
-		follow();
-		query.addEventListener("change", follow);
-		return () => query.removeEventListener("change", follow);
-	}, [preference]);
-	const mode = preference === "system" ? system : preference;
-	(0, react.useLayoutEffect)(() => {
-		(target ?? document.documentElement).classList.toggle("dark", mode === "dark");
-	}, [mode, target]);
-	const value = (0, react.useMemo)(() => ({ mode }), [mode]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ThemeCtx.Provider, {
-		value,
-		children
-	});
-}
-//#endregion
 //#region src/config/panels.ts
 /**
 * The panels a layout brings, as commands. Every panel gets `panel:<id>`, which
@@ -1120,6 +1133,12 @@ const panelSideOf = (panel) => panel.side === "start" ? "start" : "end";
 function panelsOnSide(data, side) {
 	return Object.entries(data.panels ?? {}).filter(([, panel]) => isPanel(panel) && panelSideOf(panel) === side).map(([id]) => id);
 }
+/**
+* Whether a list panel has a job: its list holds entries, or the session may add some (the
+* right, and `adding`, the feature that turns adding off, on). A document without an outline
+* shows no outline button to a session that can't add items; the same for attachments.
+*/
+const hasJob = (commandContext, entries, mayAdd, adding) => entries > 0 || mayAdd && !(commandContext.tryGet(_embedpdf_react_commands.CommandsToken)?.isCategoryDisabled(adding) ?? false);
 /** The search panel's id in the layout. */
 const SEARCH_PANEL = "search";
 /** Searching, which the search panel and Find need: without it every query is refused. */
@@ -1146,11 +1165,17 @@ const BUILT_IN_PANELS = /* @__PURE__ */ new Map([
 	["thumbnails", { categories: ["thumbnails"] }],
 	["outline", {
 		categories: ["outline"],
-		visible: () => false
+		visible: (commandContext) => {
+			const outline = commandContext.tryGet(_embedpdf_react_outline.OutlineToken);
+			return outline != null && hasJob(commandContext, outline.list().length, outline.canEdit(), "outline.editing");
+		}
 	}],
 	["attachments", {
 		categories: ["attachments"],
-		visible: () => false
+		visible: (commandContext) => {
+			const attachment = commandContext.tryGet(_embedpdf_react_attachment.AttachmentToken);
+			return attachment != null && hasJob(commandContext, attachment.list().length, attachment.canAdd(), "attachments.adding");
+		}
 	}],
 	[SEARCH_PANEL, {
 		...SEARCHES,
@@ -1817,7 +1842,7 @@ function StripBar({ view, label }) {
 * groups vanish, null when nothing applies. Mounted in the Stage `overlay`
 * slot. The pixels are the shared <StripBar>.
 */
-const LinkEditorCard = lazyComponent(() => Promise.resolve().then(() => require("./link-editor-CSjqPnj1.cjs")).then((ui) => ui.LinkEditorCard));
+const LinkEditorCard = lazyComponent(() => Promise.resolve().then(() => require("./link-editor-CAS7MZM2.cjs")).then((ui) => ui.LinkEditorCard));
 function AnnotationStrip() {
 	const t = (0, _embedpdf_react_i18n.useT)();
 	const view = (0, _embedpdf_react_toolbar.useStripView)(require_icons.useStripSchema("annotation"));
@@ -2517,6 +2542,551 @@ function PanelRow({ panel, current, onPicked }) {
 	});
 }
 //#endregion
+//#region src/ui/thumbnail-drop.ts
+/** How thick the drop line is drawn, in px. */
+const LINE = 2;
+/** How many thumbnails share the first row on screen: 1 for a single column. */
+function columnsOf(boxes) {
+	const first = boxes[0];
+	if (!first) return 1;
+	return Math.max(1, boxes.filter((box) => Math.abs(box.y - first.y) < 1).length);
+}
+/** How far a point is from a box: 0 inside it. */
+function distance(box, x, y) {
+	const dx = Math.max(box.x - x, 0, x - (box.x + box.width));
+	const dy = Math.max(box.y - y, 0, y - (box.y + box.height));
+	return Math.hypot(dx, dy);
+}
+/**
+* The order of the document's pages once `moving` go to `position`, together in the order they
+* have now: what a reorder answers.
+*/
+function orderAfter(order, moving, position) {
+	const staying = order.filter((page) => !moving.has(page));
+	const anchor = "before" in position ? position.before : position.after;
+	const at = staying.indexOf(anchor) + ("after" in position ? 1 : 0);
+	const moved = order.filter((page) => moving.has(page));
+	return [
+		...staying.slice(0, at),
+		...moved,
+		...staying.slice(at)
+	];
+}
+/**
+* Where pages dropped at `point` land, or `null` when nothing would change: over a page that
+* moves, or in the place the pages already are. `order` is every page of the document in display
+* order; `moving` the pages dragged, empty for files dropped from outside.
+*/
+function thumbDropAt(boxes, point, spacing, order, moving) {
+	let nearest = null;
+	for (const box of boxes) if (!nearest || distance(box, point.x, point.y) < distance(nearest, point.x, point.y)) nearest = box;
+	if (!nearest || moving.has(nearest.page)) return null;
+	const across = columnsOf(boxes) > 1;
+	const before = across ? point.x < nearest.x + nearest.width / 2 : point.y < nearest.y + nearest.height / 2;
+	const position = before ? { before: nearest.page } : { after: nearest.page };
+	if (moving.size > 0) {
+		if (orderAfter(order, moving, position).every((page, i) => page === order[i])) return null;
+	}
+	const half = spacing.gap / 2;
+	return {
+		position,
+		line: across ? {
+			x: (before ? nearest.x - half : nearest.x + nearest.width + half) - LINE / 2,
+			y: nearest.y,
+			width: LINE,
+			height: nearest.height
+		} : {
+			x: nearest.x,
+			y: (before ? nearest.y - half : nearest.y + nearest.height + spacing.band + half) - LINE / 2,
+			width: nearest.width,
+			height: LINE
+		}
+	};
+}
+/**
+* The page a move of one slot puts the selection next to, keys up or down: past the nearest page
+* that isn't selected, on that side. `null` at the start or the end.
+*/
+function slotMove(order, selected, direction) {
+	const indexes = order.flatMap((page, i) => selected.has(page) ? [i] : []);
+	if (indexes.length === 0) return null;
+	if (direction < 0) {
+		for (let i = indexes[0] - 1; i >= 0; i -= 1) if (!selected.has(order[i])) return { before: order[i] };
+		return null;
+	}
+	for (let i = indexes[indexes.length - 1] + 1; i < order.length; i += 1) if (!selected.has(order[i])) return { after: order[i] };
+	return null;
+}
+//#endregion
+//#region src/ui/thumbnail-list.tsx
+/**
+* The thumbnails panel: the same document through the thumbnail Stage lens (a fixed-zoom grid
+* that wraps into as many columns as the panel's width fits; see the viewer's `thumbnails`
+* plugin). A click goes to the page, and the panel follows the main view.
+*
+* A session that may change the pages (`page:insert-blank` shows and is enabled, the outline
+* panel's rule) organizes them here too:
+* - a click selects the page, Ctrl/Cmd+click adds or removes one, Shift+click selects a range;
+* - each page has a menu: its button, a right-click, or a long press;
+* - dragging moves the selection if the page is in it, else that page, with a line where they
+*   land; a pen or a finger holds the page first, so a swipe still scrolls;
+* - PDFs dropped between pages are inserted there, not opened as a tab;
+* - the header has insert, rotate, delete, the selection's menu, and undo and redo;
+* - the list is one tab stop: arrows go through the pages, Shift extends, Space adds or removes,
+*   Alt+arrows move the selection one place, Delete deletes and Ctrl/Cmd+A selects every page.
+*/
+/** How far the pointer moves before a press on a page becomes a drag, in px (the outline's). */
+const DRAG_SLOP_PX = 4;
+/** How long a pen or a finger holds a page before it drags it, or opens its menu, in ms. */
+const HOLD_MS = 450;
+/** Within this many px of the list's top or bottom, a drag scrolls the list. */
+const EDGE_PX = 28;
+/** The lens's spacing when its settings don't say it in px. */
+const DEFAULT_GAP_PX = 16;
+/** The header's commands: insert and rotate, delete, the menu of the rest, then the history. */
+const HEADER_EDITS = [
+	"page:insert-blank",
+	"page:rotate-counterclockwise",
+	"page:rotate-clockwise",
+	"page:delete",
+	"menu:page"
+];
+const HEADER_HISTORY = ["history:undo", "history:redo"];
+/** The thumbnails on screen, as boxes in the lens's viewport. */
+function boxesOf(thumbs) {
+	return thumbs.listVisiblePages().map((page) => ({
+		page: page.ref.objectNumber,
+		x: page.screenX,
+		y: page.screenY,
+		width: page.transform.viewWidth,
+		height: page.transform.viewHeight
+	}));
+}
+const positionOf = (position) => "before" in position ? { before: (0, _embedpdf_react_runtime.toPageRef)(position.before) } : { after: (0, _embedpdf_react_runtime.toPageRef)(position.after) };
+function ThumbnailList() {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const idPrefix = (0, react.useId)();
+	const main = (0, _embedpdf_react_stage.useStage)();
+	const thumbs = (0, _embedpdf_react_stage.useStage)(ThumbsStageToken);
+	const currentPage = (0, _embedpdf_react_stage.useStageState)((state) => state.currentPageIndex);
+	const pages = (0, _embedpdf_react_runtime.usePageList)();
+	const pageEdit = (0, _embedpdf_react_page_edit.usePageEdit)();
+	const selected = (0, _embedpdf_react_page_edit.usePageEditState)((state) => state.selected);
+	const commands = (0, _embedpdf_react_commands.useCommands)();
+	const insertFile = (0, _embedpdf_react_commands.useCommand)("page:insert-file");
+	const insertBlank = (0, _embedpdf_react_commands.useCommand)("page:insert-blank");
+	const editable = insertBlank.visible && insertBlank.enabled;
+	const closeOnPick = require_sheet.useCloseOnPick();
+	const host = (0, react.useRef)(null);
+	const [focusedPage, setFocusedPage] = (0, react.useState)(null);
+	const [anchorPage, setAnchorPage] = (0, react.useState)(null);
+	const [listFocused, setListFocused] = (0, react.useState)(false);
+	const [drag, setDrag] = (0, react.useState)(null);
+	const dragRef = (0, react.useRef)(null);
+	dragRef.current = drag;
+	const [fileDrop, setFileDrop] = (0, react.useState)(null);
+	const holdTimer = (0, react.useRef)(null);
+	const suppressClick = (0, react.useRef)(false);
+	const order = pages.map((page) => page.ref.objectNumber);
+	const indexOf = (page) => page === null ? -1 : order.indexOf(page);
+	const selectedPages = new Set(selected.map((ref) => ref.objectNumber));
+	const focusedIndex = indexOf(focusedPage) >= 0 ? indexOf(focusedPage) : currentPage;
+	(0, react.useEffect)(() => thumbs.reveal(currentPage), [currentPage, thumbs]);
+	const laidOut = (0, _embedpdf_react_stage.useStageState)((state) => state.pageCount, ThumbsStageToken);
+	const lastSelected = selected[selected.length - 1]?.objectNumber ?? null;
+	const lastSelectedIndex = lastSelected === null ? -1 : order.indexOf(lastSelected);
+	(0, react.useEffect)(() => {
+		if (lastSelectedIndex >= 0 && lastSelectedIndex < laidOut) thumbs.reveal(lastSelectedIndex);
+	}, [
+		lastSelectedIndex,
+		laidOut,
+		thumbs
+	]);
+	const spacing = () => {
+		const { gap, pageFrame } = thumbs.getSettings();
+		return {
+			gap: typeof gap === "object" && gap !== null && "px" in gap ? gap.px : DEFAULT_GAP_PX,
+			band: pageFrame.bottom
+		};
+	};
+	/** A pointer's place in the lens's viewport. */
+	const pointOf = (clientX, clientY) => {
+		const box = host.current?.getBoundingClientRect();
+		return box ? {
+			x: clientX - box.left,
+			y: clientY - box.top
+		} : null;
+	};
+	const dropAt = (clientX, clientY, moving) => {
+		const point = pointOf(clientX, clientY);
+		return point ? thumbDropAt(boxesOf(thumbs), point, spacing(), order, moving) : null;
+	};
+	const go = (index) => {
+		main.goToPage(index);
+		closeOnPick();
+	};
+	const select = (refs) => pageEdit.select(refs);
+	const onPageClick = (ref, index, event) => {
+		if (suppressClick.current) {
+			suppressClick.current = false;
+			return;
+		}
+		const page = ref.objectNumber;
+		setFocusedPage(page);
+		if (editable && (event.metaKey || event.ctrlKey)) {
+			select(selectedPages.has(page) ? selected.filter((each) => each.objectNumber !== page) : [...selected, ref]);
+			setAnchorPage(page);
+			return;
+		}
+		if (editable && event.shiftKey && indexOf(anchorPage) >= 0) {
+			const from = indexOf(anchorPage);
+			const [low, high] = from < index ? [from, index] : [index, from];
+			select(pages.slice(low, high + 1).map((each) => each.ref));
+			return;
+		}
+		setAnchorPage(page);
+		if (editable) select([ref]);
+		go(index);
+	};
+	/** A page's menu is about to open: an unselected page becomes the selection. */
+	const onMenu = (ref) => {
+		setFocusedPage(ref.objectNumber);
+		if (!selectedPages.has(ref.objectNumber)) select([ref]);
+	};
+	const openMenuOf = (page) => host.current?.querySelector(`[data-epdf-page-menu="${page}"] button`)?.click();
+	const stopHold = () => {
+		if (holdTimer.current !== null) clearTimeout(holdTimer.current);
+		holdTimer.current = null;
+	};
+	const onPagePointerDown = (ref, event) => {
+		if (!editable || event.button !== 0) return;
+		if (event.target.closest("[data-epdf-page-menu]")) return;
+		const page = ref.objectNumber;
+		const moving = selectedPages.has(page) ? selectedPages : /* @__PURE__ */ new Set([page]);
+		setDrag({
+			pointerId: event.pointerId,
+			startX: event.clientX,
+			startY: event.clientY,
+			page,
+			moving,
+			held: false,
+			active: false,
+			drop: null
+		});
+		if (event.pointerType !== "mouse") holdTimer.current = setTimeout(() => {
+			const current = dragRef.current;
+			if (current && !current.active) setDrag({
+				...current,
+				held: true
+			});
+		}, HOLD_MS);
+	};
+	const dragging = drag?.active === true;
+	const pressed = drag !== null;
+	(0, react.useEffect)(() => {
+		if (!pressed) return void 0;
+		const move = (event) => {
+			const current = dragRef.current;
+			if (!current || event.pointerId !== current.pointerId) return;
+			if (!current.active) {
+				if (Math.hypot(event.clientX - current.startX, event.clientY - current.startY) <= DRAG_SLOP_PX) return;
+				if (event.pointerType !== "mouse" && !current.held) {
+					stopHold();
+					setDrag(null);
+					return;
+				}
+			}
+			const box = host.current?.getBoundingClientRect();
+			if (box && event.clientY < box.top + EDGE_PX) thumbs.scrollBy({ top: -8 });
+			else if (box && event.clientY > box.bottom - EDGE_PX) thumbs.scrollBy({ top: 8 });
+			setDrag({
+				...current,
+				active: true,
+				drop: dropAt(event.clientX, event.clientY, current.moving)
+			});
+		};
+		const end = (event, commit) => {
+			stopHold();
+			const current = dragRef.current;
+			if (!current || event.pointerId !== current.pointerId) return;
+			setDrag(null);
+			if (!current.active) {
+				if (current.held && commit) {
+					suppressClick.current = true;
+					onMenu((0, _embedpdf_react_runtime.toPageRef)(current.page));
+					openMenuOf(current.page);
+				}
+				return;
+			}
+			suppressClick.current = true;
+			setTimeout(() => {
+				suppressClick.current = false;
+			}, 0);
+			if (!commit || !current.drop) return;
+			const moving = pages.filter((page) => current.moving.has(page.ref.objectNumber));
+			pageEdit.reorder(moving.map((page) => page.ref), positionOf(current.drop.position)).catch(() => {});
+		};
+		const up = (event) => end(event, true);
+		const cancel = (event) => end(event, false);
+		window.addEventListener("pointermove", move);
+		window.addEventListener("pointerup", up);
+		window.addEventListener("pointercancel", cancel);
+		return () => {
+			window.removeEventListener("pointermove", move);
+			window.removeEventListener("pointerup", up);
+			window.removeEventListener("pointercancel", cancel);
+		};
+	});
+	(0, react.useEffect)(() => {
+		if (!dragging) return void 0;
+		const prevent = (event) => event.preventDefault();
+		document.addEventListener("touchmove", prevent, { passive: false });
+		return () => document.removeEventListener("touchmove", prevent);
+	}, [dragging]);
+	(0, react.useEffect)(() => stopHold, []);
+	const takesFiles = (event) => editable && insertFile.visible && insertFile.enabled && require_commands.mayCarryPdf(event.dataTransfer);
+	const onDragOver = (event) => {
+		if (!takesFiles(event)) return;
+		event.preventDefault();
+		event.stopPropagation();
+		event.dataTransfer.dropEffect = "copy";
+		setFileDrop(dropAt(event.clientX, event.clientY, /* @__PURE__ */ new Set()));
+	};
+	const onDragLeave = (event) => {
+		if (!takesFiles(event)) return;
+		event.stopPropagation();
+		const next = event.relatedTarget;
+		if (!next || !host.current?.contains(next)) setFileDrop(null);
+	};
+	const onDrop = (event) => {
+		if (!takesFiles(event)) return;
+		event.preventDefault();
+		event.stopPropagation();
+		const drop = dropAt(event.clientX, event.clientY, /* @__PURE__ */ new Set());
+		setFileDrop(null);
+		const files = Array.from(event.dataTransfer.files).filter(require_commands.isPdfFile);
+		if (files.length === 0) return;
+		const args = {
+			files,
+			...drop ? { position: positionOf(drop.position) } : {}
+		};
+		commands.execute("page:insert-file", { args }).catch(() => {});
+	};
+	const focusIndex = (index, extend) => {
+		const page = pages[index];
+		if (!page) return;
+		setFocusedPage(page.ref.objectNumber);
+		thumbs.reveal(index);
+		if (!editable) {
+			main.goToPage(index);
+			return;
+		}
+		if (extend && indexOf(anchorPage) >= 0) {
+			const from = indexOf(anchorPage);
+			const [low, high] = from < index ? [from, index] : [index, from];
+			select(pages.slice(low, high + 1).map((each) => each.ref));
+			return;
+		}
+		setAnchorPage(page.ref.objectNumber);
+		select([page.ref]);
+		main.goToPage(index);
+	};
+	const onKeyDown = (event) => {
+		if (event.target !== event.currentTarget || pages.length === 0) return;
+		setListFocused(true);
+		const columns = columnsOf(boxesOf(thumbs));
+		const step = {
+			ArrowLeft: -1,
+			ArrowRight: 1,
+			ArrowUp: -columns,
+			ArrowDown: columns
+		}[event.key];
+		const mod = event.metaKey || event.ctrlKey;
+		if (step !== void 0 && event.altKey && editable) {
+			event.preventDefault();
+			const position = slotMove(order, selectedPages, step < 0 ? -1 : 1);
+			const moving = pages.filter((page) => selectedPages.has(page.ref.objectNumber));
+			if (position && moving.length > 0) pageEdit.reorder(moving.map((page) => page.ref), positionOf(position)).catch(() => {});
+			return;
+		}
+		if (step !== void 0) {
+			event.preventDefault();
+			focusIndex(Math.max(0, Math.min(pages.length - 1, focusedIndex + step)), event.shiftKey);
+			return;
+		}
+		switch (event.key) {
+			case "Home":
+			case "End":
+				event.preventDefault();
+				focusIndex(event.key === "Home" ? 0 : pages.length - 1, event.shiftKey);
+				return;
+			case "Enter":
+				event.preventDefault();
+				go(focusedIndex);
+				return;
+			case " ": {
+				if (!editable) return;
+				event.preventDefault();
+				const page = pages[focusedIndex];
+				if (!page) return;
+				const number = page.ref.objectNumber;
+				setAnchorPage(number);
+				select(selectedPages.has(number) ? selected.filter((each) => each.objectNumber !== number) : [...selected, page.ref]);
+				return;
+			}
+			case "Delete":
+			case "Backspace":
+				if (!editable) return;
+				event.preventDefault();
+				commands.execute("page:delete").catch(() => {});
+				return;
+			case "a":
+			case "A":
+				if (!mod || !editable) return;
+				event.preventDefault();
+				commands.execute("page:select-all").catch(() => {});
+				return;
+		}
+	};
+	const focusedRef = pages[focusedIndex]?.ref ?? null;
+	const shownDrop = dragging ? drag.drop : fileDrop;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex min-h-0 flex-1 flex-col",
+		children: [editable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PageHeader, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			ref: host,
+			role: "listbox",
+			"aria-label": t("panels.thumbnails"),
+			"aria-multiselectable": editable || void 0,
+			tabIndex: 0,
+			"aria-activedescendant": listFocused && focusedRef ? `${idPrefix}-${focusedRef.objectNumber}` : void 0,
+			onKeyDown,
+			onFocus: (event) => event.target === event.currentTarget && setListFocused(event.currentTarget.matches(":focus-visible")),
+			onBlur: (event) => event.target === event.currentTarget && setListFocused(false),
+			onDragEnter: onDragOver,
+			onDragOver,
+			onDragLeave,
+			onDrop,
+			className: "focus-visible:ring-accent relative flex min-h-0 flex-1 flex-col outline-none focus-visible:ring-2 focus-visible:ring-inset",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_embedpdf_react_stage.Stage, {
+				token: ThumbsStageToken,
+				className: "flex-1",
+				style: { position: "relative" },
+				overlay: shownDrop ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					"aria-hidden": true,
+					className: "bg-accent pointer-events-none absolute rounded-full",
+					style: {
+						left: shownDrop.line.x,
+						top: shownDrop.line.y,
+						width: shownDrop.line.width,
+						height: shownDrop.line.height
+					}
+				}) : null,
+				pageChrome: (page) => {
+					const number = page.ref.objectNumber;
+					const isSelected = editable && selectedPages.has(number);
+					const isCurrent = page.pageIndex === currentPage;
+					const isFocused = listFocused && focusedRef?.objectNumber === number;
+					const isMoving = dragging && drag.moving.has(number);
+					const label = t("thumbnails.page", { params: { page: page.pageIndex + 1 } });
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "group",
+						style: {
+							position: "absolute",
+							inset: 0
+						},
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								type: "button",
+								id: `${idPrefix}-${number}`,
+								role: "option",
+								"aria-selected": editable ? isSelected : isCurrent,
+								"aria-current": isCurrent ? "page" : void 0,
+								"aria-label": label,
+								tabIndex: -1,
+								title: label,
+								onClick: (event) => onPageClick(page.ref, page.pageIndex, event),
+								onPointerDown: (event) => onPagePointerDown(page.ref, event),
+								onContextMenu: (event) => {
+									if (!editable) return;
+									event.preventDefault();
+									onMenu(page.ref);
+									openMenuOf(number);
+								},
+								className: `box-border cursor-pointer touch-manipulation rounded ${isSelected || isCurrent ? "border-accent border-2" : "border-border-subtle border"} ${isCurrent ? "ring-accent-light ring-2" : ""} ${isSelected ? "bg-accent/10" : ""} ${isFocused ? "outline-accent outline outline-2 outline-offset-2" : ""} ${isMoving ? "bg-surface/60" : ""}`,
+								style: {
+									position: "absolute",
+									top: page.frame.top,
+									left: page.frame.left,
+									right: page.frame.right,
+									bottom: page.frame.bottom
+								}
+							}),
+							editable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								"data-epdf-page-menu": number,
+								onClick: (event) => event.stopPropagation(),
+								onPointerDownCapture: () => onMenu(page.ref),
+								className: `bg-elevated absolute rounded shadow-sm ${isSelected || isFocused ? "" : "opacity-0 focus-within:opacity-100 group-hover:opacity-100"}`,
+								style: {
+									top: page.frame.top + 4,
+									right: page.frame.right + 4
+								},
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PageMenuButton, {})
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								style: {
+									position: "absolute",
+									bottom: 0,
+									left: 0,
+									right: 0,
+									height: page.frame.bottom,
+									display: "flex",
+									alignItems: "center",
+									justifyContent: "center",
+									fontSize: 11,
+									color: "var(--epdf-text-muted)",
+									pointerEvents: "none"
+								},
+								children: page.pageIndex + 1
+							})
+						]
+					});
+				},
+				children: () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_embedpdf_react_render.RenderLayer, {})
+			})
+		})]
+	});
+}
+/** A page's menu button: the page commands for the selected pages. */
+function PageMenuButton() {
+	const more = (0, _embedpdf_react_commands.useCommand)("menu:page");
+	if (!more.visible) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_toolbar.CommandButton, {
+		cmd: more,
+		variant: "icon",
+		run: () => void more.run()
+	});
+}
+/** The header over the thumbnails while the pages can be changed: the edits, then the history. */
+function PageHeader() {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "border-border-subtle flex items-center gap-1 border-b p-2",
+		children: [
+			HEADER_EDITS.map((id) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HeaderButton, { id }, id)),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "flex-1" }),
+			HEADER_HISTORY.map((id) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HeaderButton, { id }, id))
+		]
+	});
+}
+function HeaderButton({ id }) {
+	const command = (0, _embedpdf_react_commands.useCommand)(id);
+	if (!command.visible) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_toolbar.CommandButton, {
+		cmd: command,
+		variant: "icon",
+		run: () => void command.run()
+	});
+}
+//#endregion
 //#region src/ui/panels.tsx
 /**
 * The layout's panels, drawn: on each side of the pages, the panel open on
@@ -2532,19 +3102,29 @@ function PanelRow({ panel, current, onPicked }) {
 * A panel whose button no longer shows (its feature turned off, or not
 * allowed) closes.
 */
-const SearchPanel = lazyComponent(() => Promise.resolve().then(() => require("./search-panel-s9IoiOtv.cjs")).then((ui) => ui.SearchPanel));
-const CommentsPanel = lazyComponent(() => Promise.resolve().then(() => require("./comments-panel-pEcQg4Vs.cjs")).then((ui) => ui.CommentsPanel));
-const MeasurementSection = lazyComponent(() => Promise.resolve().then(() => require("./measurement-CcCsHPOX.cjs")).then((ui) => ui.MeasurementSection));
-const AnnotationStylePanel = lazyComponent(() => Promise.resolve().then(() => require("./annotation-style-Bzvvp8-N.cjs")).then((ui) => ui.AnnotationStylePanel));
-const StampsPanel = lazyComponent(() => Promise.resolve().then(() => require("./stamps-panel-B9NYGayn.cjs")).then((ui) => ui.StampsPanel));
-const SignaturesPanel = lazyComponent(() => Promise.resolve().then(() => require("./signatures-panel-B56PC6d9.cjs")).then((ui) => ui.SignaturesPanel));
-const RedactionPanel = lazyComponent(() => Promise.resolve().then(() => require("./redaction-panel-BmoIl-Ll.cjs")).then((ui) => ui.RedactionPanel));
-const FormDesignPanel = lazyComponent(() => Promise.resolve().then(() => require("./form-design-panel-B5MXTZ96.cjs")).then((ui) => ui.FormDesignPanel));
+const SearchPanel = lazyComponent(() => Promise.resolve().then(() => require("./search-panel-wcbTNG1z.cjs")).then((ui) => ui.SearchPanel));
+const CommentsPanel = lazyComponent(() => Promise.resolve().then(() => require("./comments-panel-BsnWedTh.cjs")).then((ui) => ui.CommentsPanel));
+const MeasurementSection = lazyComponent(() => Promise.resolve().then(() => require("./measurement-Cxv1Ahxx.cjs")).then((ui) => ui.MeasurementSection));
+const AnnotationStylePanel = lazyComponent(() => Promise.resolve().then(() => require("./annotation-style-B3XKAyZ-.cjs")).then((ui) => ui.AnnotationStylePanel));
+const StampsPanel = lazyComponent(() => Promise.resolve().then(() => require("./stamps-panel-Cv9nJBwx.cjs")).then((ui) => ui.StampsPanel));
+const SignaturesPanel = lazyComponent(() => Promise.resolve().then(() => require("./signatures-panel-Ci_LaI1C.cjs")).then((ui) => ui.SignaturesPanel));
+const RedactionPanel = lazyComponent(() => Promise.resolve().then(() => require("./redaction-panel-ZhX0dlMi.cjs")).then((ui) => ui.RedactionPanel));
+const OutlinePanel = lazyComponent(() => Promise.resolve().then(() => require("./outline-panel-BpGtBdj0.cjs")).then((ui) => ui.OutlinePanel));
+const AttachmentsPanel = lazyComponent(() => Promise.resolve().then(() => require("./attachments-panel-Cxln8xos.cjs")).then((ui) => ui.AttachmentsPanel));
+const FormDesignPanel = lazyComponent(() => Promise.resolve().then(() => require("./form-design-panel-D0FdmWXW.cjs")).then((ui) => ui.FormDesignPanel));
 const BUILT_IN_CONTENT = /* @__PURE__ */ new Map([
 	["thumbnails", {
 		draw: () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ThumbnailList, {}),
 		list: true
 	}],
+	["outline", {
+		draw: (documentId) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OutlinePanel, {}, documentId ?? "none"),
+		list: true
+	}],
+	["attachments", {
+		draw: (documentId) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AttachmentsPanel, {}, documentId ?? "none"),
+		list: true
+	}],
 	["search", {
 		draw: (documentId) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SearchPanel, {}, documentId ?? "none"),
 		list: true
@@ -2625,51 +3205,6 @@ function OpenPanel({ id, side, siblings }) {
 		})
 	});
 }
-function ThumbnailList() {
-	const t = (0, _embedpdf_react_i18n.useT)();
-	const main = (0, _embedpdf_react_stage.useStage)();
-	const thumbs = (0, _embedpdf_react_stage.useStage)(ThumbsStageToken);
-	const currentPage = (0, _embedpdf_react_stage.useStageState)((state) => state.currentPageIndex);
-	const closeOnPick = require_sheet.useCloseOnPick();
-	(0, react.useEffect)(() => thumbs.reveal(currentPage), [currentPage, thumbs]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_embedpdf_react_stage.Stage, {
-		token: ThumbsStageToken,
-		className: "flex-1",
-		style: { position: "relative" },
-		pageChrome: (page) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-			type: "button",
-			onClick: () => {
-				main.goToPage(page.pageIndex);
-				closeOnPick();
-			},
-			title: t("thumbnails.page", { params: { page: page.pageIndex + 1 } }),
-			className: `box-border cursor-pointer rounded ${page.pageIndex === currentPage ? "border-accent ring-accent-light border-2 ring-2" : "border-border-subtle border"}`,
-			style: {
-				position: "absolute",
-				top: page.frame.top,
-				left: page.frame.left,
-				right: page.frame.right,
-				bottom: page.frame.bottom
-			}
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			style: {
-				position: "absolute",
-				bottom: 0,
-				left: 0,
-				right: 0,
-				height: page.frame.bottom,
-				display: "flex",
-				alignItems: "center",
-				justifyContent: "center",
-				fontSize: 11,
-				color: "var(--epdf-text-muted)",
-				pointerEvents: "none"
-			},
-			children: page.pageIndex + 1
-		})] }),
-		children: () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_embedpdf_react_render.RenderLayer, {})
-	});
-}
 //#endregion
 //#region src/ui/placed-components.tsx
 /**
@@ -2992,7 +3527,8 @@ const GROUPS = [
 			"selection",
 			"annotation",
 			"redaction",
-			"measurement"
+			"measurement",
+			"outline"
 		]
 	}
 ];
@@ -3082,6 +3618,18 @@ function ShortcutsList({ onClose }) {
 	});
 }
 //#endregion
+//#region src/ui/sidebar-reads.tsx
+/**
+* Once a document shows: read its outline and its attachments, so their panels' buttons know
+* whether the panels have a job (`config/panels.ts`). Reading a plugin's state is what reads it;
+* a viewer without the plugin reads nothing. Mounted once per document view; renders nothing.
+*/
+function SidebarReads() {
+	(0, _embedpdf_react_outline.useOutlineState)((state) => state.status);
+	(0, _embedpdf_react_attachment.useAttachmentState)((state) => state.status);
+	return null;
+}
+//#endregion
 //#region src/ui/signature-bridge.tsx
 /**
 * The signature plugin's UI intents → shell surfaces. The plugin owns the
@@ -3409,11 +3957,15 @@ const useCalibrating = () => (0, _embedpdf_react_measurement.useMeasurementState
 const useSignDialogOpen = () => (0, _embedpdf_react_shell.useSurface)("signature-sign").isOpen;
 const useSignatureMakerOpen = () => (0, _embedpdf_react_shell.useSurface)("signature-maker").isOpen;
 const useSignatureInspectorOpen = () => (0, _embedpdf_react_shell.useSurface)("signature-inspector").isOpen;
-const RedactConfirmModal = lazyComponent(() => Promise.resolve().then(() => require("./redact-confirm-CX_SY2ZN.cjs")).then((ui) => ui.RedactConfirmModal), { shownWhile: useRedactConfirmOpen });
-const CalibrationDialog = lazyComponent(() => Promise.resolve().then(() => require("./measurement-CcCsHPOX.cjs")).then((ui) => ui.CalibrationDialog), { shownWhile: useCalibrating });
-const SignDialog = lazyComponent(() => Promise.resolve().then(() => require("./sign-dialog-CgnR7akj.cjs")).then((ui) => ui.SignDialog), { shownWhile: useSignDialogOpen });
-const SignatureMakerModal = lazyComponent(() => Promise.resolve().then(() => require("./signature-maker-BoYa8vgA.cjs")).then((ui) => ui.SignatureMakerModal), { shownWhile: useSignatureMakerOpen });
-const SignatureInspector = lazyComponent(() => Promise.resolve().then(() => require("./signature-inspector-DyO313Qf.cjs")).then((ui) => ui.SignatureInspector), { shownWhile: useSignatureInspectorOpen });
+const usePrintDialogOpen = () => (0, _embedpdf_react_shell.useSurface)("print").isOpen;
+const RedactConfirmModal = lazyComponent(() => Promise.resolve().then(() => require("./redact-confirm-C6EiK8yN.cjs")).then((ui) => ui.RedactConfirmModal), { shownWhile: useRedactConfirmOpen });
+const CalibrationDialog = lazyComponent(() => Promise.resolve().then(() => require("./measurement-Cxv1Ahxx.cjs")).then((ui) => ui.CalibrationDialog), { shownWhile: useCalibrating });
+const SignDialog = lazyComponent(() => Promise.resolve().then(() => require("./sign-dialog-D5WGx-Yn.cjs")).then((ui) => ui.SignDialog), { shownWhile: useSignDialogOpen });
+const SignatureMakerModal = lazyComponent(() => Promise.resolve().then(() => require("./signature-maker-D_YfBXLn.cjs")).then((ui) => ui.SignatureMakerModal), { shownWhile: useSignatureMakerOpen });
+const SignatureInspector = lazyComponent(() => Promise.resolve().then(() => require("./signature-inspector-Bz6TAfZM.cjs")).then((ui) => ui.SignatureInspector), { shownWhile: useSignatureInspectorOpen });
+const PrintDialog = lazyComponent(() => Promise.resolve().then(() => require("./print-dialog-BqIrHCBh.cjs")).then((ui) => ui.PrintDialog), { shownWhile: usePrintDialogOpen });
+const useOutlinePropertiesOpen = () => (0, _embedpdf_react_shell.useSurface)(require_commands.OUTLINE_PROPERTIES_DIALOG).isOpen;
+const OutlinePropertiesDialog = lazyComponent(() => Promise.resolve().then(() => require("./outline-properties-DT3FIxCw.cjs")).then((ui) => ui.OutlinePropertiesDialog), { shownWhile: useOutlinePropertiesOpen });
 /** The document tabs, as the layout says: always, while more than one document is open, or never. */
 function DocumentTabs() {
 	const visibility = (0, _embedpdf_core_ui.tabsOf)(require_icons.useResolvedLayout().data);
@@ -3538,8 +4090,11 @@ function Shell({ components }) {
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RedactConfirmModal, {}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CalibrationDialog, {}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(GoToPageDialog, {}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PrintDialog, {}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(OutlinePropertiesDialog, {}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ShortcutsSheet, {}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SignatureBridge, {}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SidebarReads, {}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FeaturePrefetch, {}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SignDialog, {}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SignatureMakerModal, {})
@@ -3717,6 +4272,8 @@ function FullViewer({ engine, initialDocuments, fallback, commands, icons, strin
 		(0, _embedpdf_react_render.renderPlugin)(settings.render),
 		(0, _embedpdf_react_page_edit.pageEditPlugin)(),
 		(0, _embedpdf_react_metadata.metadataPlugin)(),
+		(0, _embedpdf_react_outline.outlinePlugin)(),
+		(0, _embedpdf_react_attachment.attachmentPlugin)(),
 		(0, _embedpdf_react_interaction.interactionPlugin)(settings.interaction),
 		(0, _embedpdf_react_interaction.feedbackPlugin)({ provider: _embedpdf_react_interaction.vibrationFeedback }),
 		(0, _embedpdf_react_selection.selectionPlugin)(settings.selection),
@@ -3787,8 +4344,8 @@ function FullViewer({ engine, initialDocuments, fallback, commands, icons, strin
 		...resolved.plugins.own.map(({ plugin }) => plugin)
 	]);
 	const config = resolved;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ThemeProvider, {
-		preference: themeConfigOf(theme).preference,
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_theme.ThemeProvider, {
+		preference: require_theme.themeConfigOf(theme).preference,
 		target: themeTarget,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_embedpdf_react_runtime.Viewer, {
 			engine,
@@ -3839,6 +4396,12 @@ Object.defineProperty(exports, "AnnotationToken", {
 		return _embedpdf_react_annotation.AnnotationToken;
 	}
 });
+Object.defineProperty(exports, "AttachmentToken", {
+	enumerable: true,
+	get: function() {
+		return _embedpdf_react_attachment.AttachmentToken;
+	}
+});
 Object.defineProperty(exports, "CommandsToken", {
 	enumerable: true,
 	get: function() {
@@ -3888,6 +4451,12 @@ Object.defineProperty(exports, "MetadataToken", {
 		return _embedpdf_react_metadata.MetadataToken;
 	}
 });
+Object.defineProperty(exports, "OutlineToken", {
+	enumerable: true,
+	get: function() {
+		return _embedpdf_react_outline.OutlineToken;
+	}
+});
 Object.defineProperty(exports, "PageEditToken", {
 	enumerable: true,
 	get: function() {
@@ -3942,7 +4511,7 @@ Object.defineProperty(exports, "StampToken", {
 		return _embedpdf_react_stamp.StampToken;
 	}
 });
-exports.THEME_TOKENS = THEME_TOKENS;
+exports.THEME_TOKENS = require_theme.THEME_TOKENS;
 exports.TOOLBAR_ITEM_CONTEXT_ATTRIBUTES = require_toolbar.TOOLBAR_ITEM_CONTEXT_ATTRIBUTES;
 exports.VIEWER_PLUGINS = VIEWER_PLUGINS;
 Object.defineProperty(exports, "createLayout", {
@@ -3986,8 +4555,8 @@ Object.defineProperty(exports, "remoteSigner", {
 		return _embedpdf_react_signature.remoteSigner;
 	}
 });
-exports.themeConfigOf = themeConfigOf;
-exports.themeTokenCss = themeTokenCss;
+exports.themeConfigOf = require_theme.themeConfigOf;
+exports.themeTokenCss = require_theme.themeTokenCss;
 Object.defineProperty(exports, "webCryptoSigner", {
 	enumerable: true,
 	get: function() {