@embedpdf/viewer-chrome 3.0.0-next.12 → 3.0.0-next.13

package/dist/index.cjs

@@ -36,6 +36,7 @@ let _embedpdf_react_stamp = require("@embedpdf/react/stamp");
 let _embedpdf_react_redaction = require("@embedpdf/react/redaction");
 let _embedpdf_react_actions = require("@embedpdf/react/actions");
 let _embedpdf_react_form = require("@embedpdf/react/form");
+let _embedpdf_react_signature = require("@embedpdf/react/signature");
 let _embedpdf_react_link = require("@embedpdf/react/link");
 let _embedpdf_react_search = require("@embedpdf/react/search");
 let _embedpdf_react_i18n = require("@embedpdf/react/i18n");
@@ -44,8 +45,10 @@ let _embedpdf_react_shell = require("@embedpdf/react/shell");
 let _embedpdf_react_toolbar = require("@embedpdf/react/toolbar");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _embedpdf_react_scrollbar = require("@embedpdf/react/scrollbar");
-let _embedpdf_react_annotation_menu = require("@embedpdf/react/annotation-menu");
 let _embedpdf_default_stamps_library = require("@embedpdf/default-stamps/library");
+let _embedpdf_web = require("@embedpdf/web");
+let _embedpdf_react_annotation_menu = require("@embedpdf/react/annotation-menu");
+let _embedpdf_react_anchored = require("@embedpdf/react/anchored");
 let _embedpdf_react_metadata = require("@embedpdf/react/metadata");
 //#region src/config/stage.ts
 /**
@@ -197,7 +200,8 @@ const en = {
 				checkbox: "Checkbox",
 				radio: "Radio Button",
 				select: "Dropdown",
-				listbox: "List Box"
+				listbox: "List Box",
+				signature: "Signature Field"
 			},
 			redact: {
 				mark: "Mark for Redaction",
@@ -294,6 +298,7 @@ const en = {
 			redactConfirmCollateral: "{count} other annotations will also be removed.",
 			redactApply: "Apply",
 			redactApplying: "Applying…",
+			formatLabel: "Format",
 			redactLabelTitle: "Redaction label",
 			redactLabelPlaceholder: "e.g. REDACTED",
 			redactLabelRepeat: "Repeat label across region",
@@ -312,7 +317,72 @@ const en = {
 			stampsCustomLabel: "Custom stamp",
 			stampsError: "The built-in stamps could not be loaded.",
 			stampsArmError: "That stamp could not be armed.",
-			stampsImportError: "That PDF could not be imported as a stamp library."
+			stampsImportError: "That PDF could not be imported as a stamp library.",
+			quickStampsLabel: "Quick stamps",
+			signaturesTitle: "Signatures",
+			signaturesEmpty: "No signatures yet. Create one to sign with.",
+			signaturesNew: "New signature…",
+			signaturesArmedHint: "Click a signature field to sign it, or anywhere on a page to place the mark.",
+			signaturesTargetHint: "Pick a mark for the selected field.",
+			signaturesInDocument: "In this document",
+			signaturesNone: "This document has no signature fields.",
+			signaturesValidate: "Validate",
+			signaturesValidating: "Validating…",
+			signaturesSigned: "Signed",
+			signaturesUnsigned: "Unsigned",
+			signaturesRename: "Rename",
+			signaturesRemove: "Remove",
+			signaturesExport: "Export as PDF",
+			signaturesAddInitials: "Add initials",
+			signatureLabel: "Signature",
+			initialsLabel: "Initials",
+			makerTitle: "New signature",
+			makerName: "Name",
+			makerNamePlaceholder: "Your name",
+			makerDraw: "Draw",
+			makerType: "Type",
+			makerUpload: "Upload",
+			makerTypePlaceholder: "Type your name",
+			makerFont: "Font",
+			makerUploadHint: "Choose a PNG, JPEG, or one-page PDF",
+			makerClear: "Clear",
+			makerOptional: "(optional)",
+			makerSave: "Save",
+			makerSaving: "Saving…",
+			makerError: "The signature could not be saved.",
+			signTitle: "Sign this field",
+			signReason: "Reason",
+			signLocation: "Location",
+			signKind: "What may change afterwards",
+			signKindApproval: "Approval signature — form filling and more signatures stay valid",
+			signKindCertifyAnnotate: "Certify — allow comments, form filling and signatures",
+			signKindCertifyFill: "Certify — allow form filling and signatures only",
+			signKindCertifyLocked: "Certify — allow no changes",
+			signButton: "Sign",
+			signSigning: "Signing…",
+			signFill: "Place without signing",
+			signError: "The field could not be signed.",
+			inspectTitle: "Signature",
+			inspectSigner: "Signed by",
+			inspectReason: "Reason",
+			inspectLocation: "Location",
+			inspectTime: "Time",
+			inspectIntegrity: "Document",
+			inspectCryptography: "Signature",
+			inspectTrust: "Signer",
+			inspectChanges: "Changes since",
+			inspectDownload: "Download signed version",
+			verdictValid: "Valid",
+			verdictValidUntrusted: "Valid, signer not trusted",
+			verdictInvalid: "Invalid — modified after signing",
+			verdictWillInvalidate: "Valid, invalid once saved",
+			signaturesInvalidating: "This change will invalidate {field} when the document is saved. Undo it to keep the signature.",
+			verdictIndeterminate: "Could not be verified",
+			verdictUnchanged: "None",
+			verdictRestored: "Changed, then restored",
+			inspectLaterRevisions: "Revisions after signing",
+			verdictPermitted: "Permitted",
+			verdictForbidden: "Not permitted"
 		}
 	}
 };
@@ -330,7 +400,9 @@ const en = {
 const ViewerConfigContext = (0, react.createContext)({
 	chrome: require_chrome.defaultChrome,
 	icons: {},
-	stamps: {}
+	stamps: {},
+	signatures: {},
+	annotations: {}
 });
 const ViewerConfigProvider = ViewerConfigContext.Provider;
 function useChromeSchema() {
@@ -348,6 +420,12 @@ function useCustomIcons() {
 function useStampsConfig() {
 	return (0, react.useContext)(ViewerConfigContext).stamps;
 }
+function useSignaturesConfig() {
+	return (0, react.useContext)(ViewerConfigContext).signatures;
+}
+function useAnnotationsConfig() {
+	return (0, react.useContext)(ViewerConfigContext).annotations;
+}
 //#endregion
 //#region src/handle.ts
 function createViewerHandle(kernel) {
@@ -969,6 +1047,166 @@ function ThemeProvider({ children, preference = "system", target }) {
 	});
 }
 //#endregion
+//#region src/config/default-stamps.ts
+/**
+* The viewer's BUILT-IN stamp library: `@embedpdf/default-stamps`, the
+* standard rubber stamps as one Acrobat-compatible PDF per locale.
+*
+* Delivery: the library ships INSIDE whatever ships this viewer. The package
+* exposes each locale as a lazy ES module (`@embedpdf/default-stamps/library`),
+* so it travels through the module graph like any other code — every bundler
+* splits it into a chunk served from the app's own origin, the CDN snippet
+* carries it as a sibling chunk in its folder, and nothing is fetched from a
+* third party. `stamps.defaultLibrary` overrides that:
+*   - `false`          → no built-in library, no request (air-gapped);
+*   - a URL template   → exactly that (`{locale}` slot), for self-hosted copies.
+*
+* Loading is LAZY (first open of the stamps panel, never at boot) and
+* locale-aware: the chrome locale leads, the browser languages break ties
+* for the locales the chrome does not translate itself, and a locale change
+* while a default library is loaded swaps it for the new one. The file names
+* itself (`/Title`, `Id: embedpdf-standard`), so no overrides are passed.
+*/
+/** The built-in library's PieceInfo id — excluded from persistence (it is
+*  loaded again on every first open, in the locale of that moment). */
+const DEFAULT_LIBRARY_ID = "embedpdf-standard";
+/** Which shipped locale to show for the chrome's locale + the browser's. */
+function resolveStampsLocale(chromeLocale) {
+	return (0, _embedpdf_react_i18n.negotiateLocale)(_embedpdf_default_stamps_library.LOCALES, [chromeLocale, ...typeof navigator !== "undefined" ? navigator.languages ?? [] : []]) ?? "en";
+}
+const fetchBytes = async (url) => {
+	const response = await fetch(url);
+	if (!response.ok) throw new Error(`${url}: HTTP ${response.status}`);
+	return new Uint8Array(await response.arrayBuffer());
+};
+/** The library bytes for `locale`: your URL when you gave one, otherwise the
+*  copy that shipped with the viewer. Never anything else. */
+const defaultLibraryBytes = (locale, source) => source ? fetchBytes(source.replace("{locale}", locale)) : (0, _embedpdf_default_stamps_library.loadDefaultLibrary)(locale);
+/** Per workspace: the locale the default library was last brought to, and
+*  the in-flight work — the panel mounts and unmounts with the sidebar, so
+*  this cannot live in component state. */
+const loads = /* @__PURE__ */ new WeakMap();
+/**
+* Bring the built-in library to `locale`. Idempotent per workspace and
+* locale; a locale change swaps the loaded default (remove, then import);
+* a default the user removed in this session stays removed — the locale is
+* recorded, nothing is re-added. An embedder that seeded a library under
+* the same id is left alone.
+*/
+function ensureDefaultLibrary(stamp, locale, source) {
+	if (source === false) return Promise.resolve();
+	const current = loads.get(stamp);
+	if (current?.locale === locale) return current.promise;
+	const run = async () => {
+		await current?.promise.catch(() => void 0);
+		const loaded = stamp.library(DEFAULT_LIBRARY_ID);
+		if (loaded?.locale === locale) return;
+		if (current && !loaded) return;
+		if (loaded) await stamp.removeLibrary(DEFAULT_LIBRARY_ID);
+		await stamp.importLibraryPdf(await defaultLibraryBytes(locale, source));
+	};
+	const promise = run();
+	loads.set(stamp, {
+		locale,
+		promise
+	});
+	return promise;
+}
+//#endregion
+//#region src/ui/stamp-store.tsx
+/**
+* The user's stamp libraries live in the browser (IndexedDB): restored ONCE
+* per workspace, written on every change, for as long as the viewer lives —
+* a signature made while the stamps sidebar is closed is persisted exactly
+* like a stamp imported while it is open. The built-in library is never
+* stored (it is fetched again next time, in the locale of that moment); the
+* panels that need it bring it in lazily through `ensureDefaultLibrary`.
+*
+* Mounted once in the Shell, workspace-scoped (the stamp plugin is).
+*/
+const store = typeof indexedDB === "undefined" ? null : (0, _embedpdf_react_stamp.indexedDbByteStore)("embedpdf-stamps", { storeName: "libraries" });
+const restored = /* @__PURE__ */ new WeakMap();
+/** Bring the stored libraries back — once per workspace, whoever asks first. */
+const restoreStampLibrariesOnce = (stamp) => {
+	let pending = restored.get(stamp);
+	if (!pending) {
+		pending = store ? (0, _embedpdf_react_stamp.restoreStampLibraries)(stamp, store) : Promise.resolve();
+		restored.set(stamp, pending);
+	}
+	return pending;
+};
+function StampLibraryStore() {
+	const stamp = (0, _embedpdf_react_stamp.useStamp)();
+	(0, react.useEffect)(() => {
+		restoreStampLibrariesOnce(stamp);
+		return store ? (0, _embedpdf_react_stamp.persistStampLibraries)(stamp, store, { except: [DEFAULT_LIBRARY_ID] }) : void 0;
+	}, [stamp]);
+	return null;
+}
+//#endregion
+//#region src/ui/quick-stamps.tsx
+/**
+* Quick marks in the toolbar: a row of stamp thumbnails that ARM on click —
+* the checkmark, the cross, whatever the embedder configured
+* (`stamps.toolbar`: asset ids, or one library's assets). The hover ghost and
+* the click placement are the annotation plugin's, exactly as from the
+* sidebar; only the picker moved. Renders nothing until the assets exist.
+* Lives in the workspace toolbar, so it reads the ACTIVE document's tool.
+*/
+function QuickStamps() {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const stamp = (0, _embedpdf_react_stamp.useStamp)();
+	const config = useStampsConfig();
+	const { locale } = (0, _embedpdf_react_i18n.useLocale)();
+	const assets = (0, _embedpdf_react_stamp.useStampAssets)();
+	const documentId = (0, _embedpdf_react_runtime.useDocumentId)();
+	const { armAsset } = (0, _embedpdf_react_stamp.useArmStampAsset)();
+	const activeToolId = (0, _embedpdf_react_runtime.useOptionalSelector)(_embedpdf_react_interaction.InteractionToken, (c) => c.activeToolId(), null);
+	const armedId = (0, _embedpdf_react_runtime.useOptionalSelector)(_embedpdf_react_stamp.StampToken, (c) => documentId ? c.armedAsset(documentId)?.id ?? null : null, null);
+	const ids = Array.isArray(config.toolbar) ? config.toolbar : config.toolbar && "library" in config.toolbar ? stamp.library(config.toolbar.library)?.assetIds ?? [] : [];
+	const wantsDefault = ids.some((id) => id.startsWith(`${DEFAULT_LIBRARY_ID}:`));
+	(0, react.useEffect)(() => {
+		if (!wantsDefault) return;
+		restoreStampLibrariesOnce(stamp).then(() => ensureDefaultLibrary(stamp, resolveStampsLocale(locale), config.defaultLibrary)).catch((err) => console.error("[embedpdf] quick stamps failed:", err));
+	}, [
+		stamp,
+		locale,
+		wantsDefault
+	]);
+	const shown = ids.map((id) => assets.find((a) => a.id === id)).filter((a) => !!a);
+	if (shown.length === 0 || !documentId) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "flex items-center gap-1",
+		role: "group",
+		"aria-label": t("demo.quickStampsLabel"),
+		children: shown.map((asset) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(QuickStampButton, {
+			asset,
+			active: activeToolId === "stamp" && armedId === asset.id,
+			onArm: () => void armAsset(asset.id).catch((e) => console.error("[embedpdf] arm failed", e))
+		}, asset.id))
+	});
+}
+function QuickStampButton({ asset, active, onArm }) {
+	const url = (0, _embedpdf_react_stamp.useStampAssetPreviewUrl)(asset.id);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		type: "button",
+		onClick: onArm,
+		title: asset.label,
+		"aria-label": asset.label,
+		"aria-pressed": active || void 0,
+		className: buttonClass(active, true),
+		children: url ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+			src: url,
+			alt: "",
+			className: "h-5 w-5 object-contain",
+			draggable: false
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "text-xs",
+			children: asset.label
+		})
+	});
+}
+//#endregion
 //#region src/ui/menu.tsx
 /**
 * Menu rendering — a MenuSchema (a tree of command ids) rendered as rows.
@@ -1377,7 +1615,10 @@ function AppToolbar({ bar, className }) {
 			variant,
 			run
 		}),
-		renderCustom: { "zoom-controls": (variant) => variant === "inline" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZoomControls, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZoomButton, {}) },
+		renderCustom: {
+			"zoom-controls": (variant) => variant === "inline" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZoomControls, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZoomButton, {}),
+			"quick-stamps": () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(QuickStamps, {})
+		},
 		renderCollapsed: (view) => view.id === "modes" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CollapsedModes, { view }) : void 0,
 		renderGroupTrigger: (view) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(GroupTrigger, { view }),
 		renderSeparator: () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "bg-border h-6 w-px self-center" }),
@@ -1389,6 +1630,71 @@ function AppToolbar({ bar, className }) {
 	});
 }
 //#endregion
+//#region src/ui/annotation-fonts.tsx
+/**
+* The configured annotation fonts (`annotations.fonts`), loaded once per
+* viewer: fetch the bytes → register them on the viewer's engine under the
+* key (what a free-text `fontFamily` carries and what the engine embeds) →
+* mount the same bytes as a `@font-face` named by that key (what the plugin's
+* `cssFontFamily` emits for a registered font, so the live editor renders the
+* face the appearance stream will bake). The style panel lists a font only
+* once BOTH have happened — an offered key always resolves on write.
+*/
+const LoadedFontsContext = (0, react.createContext)([]);
+function AnnotationFontsProvider({ children }) {
+	const kernel = (0, _embedpdf_react_runtime.useKernel)();
+	const { fonts } = useAnnotationsConfig();
+	const [loaded, setLoaded] = (0, react.useState)([]);
+	(0, react.useEffect)(() => {
+		const engineFonts = kernel.engine.fonts;
+		if (!fonts?.length || !engineFonts) return;
+		let cancelled = false;
+		const unmounts = [];
+		(async () => {
+			for (const font of fonts) try {
+				const response = await fetch(font.url);
+				if (!response.ok) throw new Error(`${font.url}: HTTP ${response.status}`);
+				const bytes = new Uint8Array(await response.arrayBuffer());
+				if (cancelled) return;
+				await engineFonts.register({
+					key: font.key,
+					familyName: font.familyName,
+					weight: font.weight,
+					italic: font.italic,
+					data: bytes
+				});
+				const unmount = await (0, _embedpdf_web.mountWebFont)(font.key, bytes, {
+					weight: font.weight,
+					style: font.italic ? "italic" : "normal"
+				});
+				if (cancelled) {
+					unmount();
+					return;
+				}
+				unmounts.push(unmount);
+				setLoaded((prev) => prev.some((f) => f.key === font.key) ? prev : [...prev, {
+					key: font.key,
+					label: font.label
+				}]);
+			} catch (error) {
+				console.warn(`[embedpdf] annotation font "${font.key}" was not loaded:`, error);
+			}
+		})();
+		return () => {
+			cancelled = true;
+			for (const unmount of unmounts) unmount();
+		};
+	}, [kernel, fonts]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoadedFontsContext.Provider, {
+		value: loaded,
+		children
+	});
+}
+/** The configured fonts that are registered AND mounted, in config order. */
+function useAnnotationFonts() {
+	return (0, react.useContext)(LoadedFontsContext);
+}
+//#endregion
 //#region src/ui/link-editor.tsx
 /**
 * The link editor POPOVER — v2's "add a link" popup, reborn. It rides the
@@ -2374,12 +2680,17 @@ function LineEndingSelect({ side, value, onChange }) {
 	});
 }
 function FontFamilySelect({ value, onChange }) {
+	const configured = useAnnotationFonts();
+	const options = [...FONT_OPTIONS, ...configured.map((f) => ({
+		v: f.key,
+		label: f.label
+	}))];
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DropdownShell, {
 		trigger: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 			className: "text-fg text-sm",
-			children: FONT_OPTIONS.find((o) => o.v === value)?.label ?? value
+			children: options.find((o) => o.v === value)?.label ?? value
 		}),
-		children: (close) => FONT_OPTIONS.map((o) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OptionRow, {
+		children: (close) => options.map((o) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OptionRow, {
 			selected: o.v === value,
 			onClick: () => {
 				onChange(o.v);
@@ -2391,17 +2702,33 @@ function FontFamilySelect({ value, onChange }) {
 }
 function FontSizeCombo({ value, onChange }) {
 	const [open, setOpen] = (0, react.useState)(false);
+	const rootRef = useOutsideClose(open, () => setOpen(false));
+	const [draft, setDraft] = (0, react.useState)(null);
+	const commit = () => {
+		if (draft === null) return;
+		const n = parseInt(draft, 10);
+		setDraft(null);
+		if (Number.isFinite(n) && n > 0 && n !== value) onChange(n);
+	};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		ref: useOutsideClose(open, () => setOpen(false)),
+		ref: rootRef,
 		className: "relative w-full",
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
 				type: "number",
 				min: 1,
-				value,
-				onChange: (e) => {
-					const n = parseInt(e.target.value, 10);
-					if (Number.isFinite(n) && n > 0) onChange(n);
+				value: draft ?? value,
+				onChange: (e) => setDraft(e.target.value),
+				onBlur: commit,
+				onKeyDown: (e) => {
+					if (e.key === "Enter") {
+						e.preventDefault();
+						commit();
+						setOpen(false);
+					} else if (e.key === "Escape") {
+						setDraft(null);
+						setOpen(false);
+					}
 				},
 				onClick: () => setOpen(true),
 				className: "border-border bg-surface text-fg w-full rounded border px-2 py-1.5 pr-7 text-sm"
@@ -2422,6 +2749,7 @@ function FontSizeCombo({ value, onChange }) {
 				children: FONT_SIZES.map((sz) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OptionRow, {
 					selected: sz === value,
 					onClick: () => {
+						setDraft(null);
 						onChange(sz);
 						setOpen(false);
 					},
@@ -2442,15 +2770,45 @@ function BlendModeSelect({ value, onChange }) {
 		}, mode.v))
 	});
 }
-function Toggle({ active, title, onClick, children }) {
+function Toggle({ active, title, onClick, keepFocus, children }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 		type: "button",
 		title,
 		onClick,
+		onMouseDown: keepFocus ? (e) => e.preventDefault() : void 0,
 		className: `flex h-9 w-9 items-center justify-center rounded border transition-colors ${active ? "border-accent bg-accent text-on-accent" : "border-border bg-surface text-fg hover:bg-hover"}`,
 		children
 	});
 }
+const isFormatSpec = (spec) => spec.key === "bold" || spec.key === "italic" || spec.key === "underline";
+/**
+* The format toggles a free-text kind declares, in one row. While the text
+* editor holds a range they read and write that range's runs (the plugin
+* routes `updateSelection`); otherwise the annotation's body. The buttons
+* keep focus in the editor so the range survives the click.
+*/
+function FormatToggles({ specs, values, mixed, onChange }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Field, {
+		label: (0, _embedpdf_react_i18n.useT)()("demo.formatLabel", { fallback: "Format" }),
+		mixed: specs.some((s) => mixed.includes(s.key)),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "flex gap-2",
+			children: specs.map((spec) => {
+				const active = values[spec.key] === true && !mixed.includes(spec.key);
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Toggle, {
+					title: spec.label,
+					active,
+					keepFocus: true,
+					onClick: () => onChange({ [spec.key]: !active }),
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: spec.key,
+						size: 18
+					})
+				}, spec.key);
+			})
+		})
+	});
+}
 function PropControl({ spec, value, mixed, onChange }) {
 	switch (spec.key) {
 		case "color":
@@ -2585,6 +2943,9 @@ function PropControl({ spec, value, mixed, onChange }) {
 				})
 			});
 		}
+		case "bold":
+		case "italic":
+		case "underline": return null;
 		case "blendMode": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Field, {
 			label: spec.label,
 			mixed,
@@ -2632,7 +2993,12 @@ function AnnotationStylePanel() {
 				className: "text-fg-muted mb-4 text-[11px] font-semibold uppercase tracking-wide",
 				children: hasSel ? `${selected.length} selected` : `${activeToolId} defaults`
 			}),
-			specs.map((spec) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PropControl, {
+			specs.map((spec) => spec.key === "bold" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormatToggles, {
+				specs: specs.filter((s) => isFormatSpec(s)),
+				values,
+				mixed: hasSel ? sel.mixed : [],
+				onChange: write
+			}, "format") : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PropControl, {
 				spec,
 				value: values[spec.key],
 				mixed: hasSel && sel.mixed.includes(spec.key),
@@ -3503,72 +3869,6 @@ function SearchPanel() {
 	});
 }
 //#endregion
-//#region src/config/default-stamps.ts
-/**
-* The viewer's BUILT-IN stamp library: `@embedpdf/default-stamps`, the
-* standard rubber stamps as one Acrobat-compatible PDF per locale.
-*
-* Delivery: the library ships INSIDE whatever ships this viewer. The package
-* exposes each locale as a lazy ES module (`@embedpdf/default-stamps/library`),
-* so it travels through the module graph like any other code — every bundler
-* splits it into a chunk served from the app's own origin, the CDN snippet
-* carries it as a sibling chunk in its folder, and nothing is fetched from a
-* third party. `stamps.defaultLibrary` overrides that:
-*   - `false`          → no built-in library, no request (air-gapped);
-*   - a URL template   → exactly that (`{locale}` slot), for self-hosted copies.
-*
-* Loading is LAZY (first open of the stamps panel, never at boot) and
-* locale-aware: the chrome locale leads, the browser languages break ties
-* for the locales the chrome does not translate itself, and a locale change
-* while a default library is loaded swaps it for the new one. The file names
-* itself (`/Title`, `Id: embedpdf-standard`), so no overrides are passed.
-*/
-/** The built-in library's PieceInfo id — excluded from persistence (it is
-*  loaded again on every first open, in the locale of that moment). */
-const DEFAULT_LIBRARY_ID = "embedpdf-standard";
-/** Which shipped locale to show for the chrome's locale + the browser's. */
-function resolveStampsLocale(chromeLocale) {
-	return (0, _embedpdf_react_i18n.negotiateLocale)(_embedpdf_default_stamps_library.LOCALES, [chromeLocale, ...typeof navigator !== "undefined" ? navigator.languages ?? [] : []]) ?? "en";
-}
-const fetchBytes = async (url) => {
-	const response = await fetch(url);
-	if (!response.ok) throw new Error(`${url}: HTTP ${response.status}`);
-	return new Uint8Array(await response.arrayBuffer());
-};
-/** The library bytes for `locale`: your URL when you gave one, otherwise the
-*  copy that shipped with the viewer. Never anything else. */
-const defaultLibraryBytes = (locale, source) => source ? fetchBytes(source.replace("{locale}", locale)) : (0, _embedpdf_default_stamps_library.loadDefaultLibrary)(locale);
-/** Per workspace: the locale the default library was last brought to, and
-*  the in-flight work — the panel mounts and unmounts with the sidebar, so
-*  this cannot live in component state. */
-const loads = /* @__PURE__ */ new WeakMap();
-/**
-* Bring the built-in library to `locale`. Idempotent per workspace and
-* locale; a locale change swaps the loaded default (remove, then import);
-* a default the user removed in this session stays removed — the locale is
-* recorded, nothing is re-added. An embedder that seeded a library under
-* the same id is left alone.
-*/
-function ensureDefaultLibrary(stamp, locale, source) {
-	if (source === false) return Promise.resolve();
-	const current = loads.get(stamp);
-	if (current?.locale === locale) return current.promise;
-	const run = async () => {
-		await current?.promise.catch(() => void 0);
-		const loaded = stamp.library(DEFAULT_LIBRARY_ID);
-		if (loaded?.locale === locale) return;
-		if (current && !loaded) return;
-		if (loaded) await stamp.removeLibrary(DEFAULT_LIBRARY_ID);
-		await stamp.importLibraryPdf(await defaultLibraryBytes(locale, source));
-	};
-	const promise = run();
-	loads.set(stamp, {
-		locale,
-		promise
-	});
-	return promise;
-}
-//#endregion
 //#region src/ui/stamps-panel.tsx
 /**
 * The stamps sidebar (right panel) — v2's rubber-stamp sidebar on v3 parts.
@@ -3591,30 +3891,15 @@ function ensureDefaultLibrary(stamp, locale, source) {
 * through the surface's open props.
 */
 const ALL = "all";
-/** The user's libraries live in the browser (IndexedDB): restored on first
-*  open, written on every change. The built-in set is never stored — it is
-*  fetched again next time, in the locale of that moment. */
-const store = typeof indexedDB === "undefined" ? null : (0, _embedpdf_react_stamp.indexedDbByteStore)("embedpdf-stamps", { storeName: "libraries" });
-/** Restore runs ONCE per workspace — the panel mounts and unmounts with the
-*  sidebar, so the guard cannot live in component state. */
-const restored = /* @__PURE__ */ new WeakMap();
-const restoreOnce = (stamp) => {
-	let pending = restored.get(stamp);
-	if (!pending) {
-		pending = store ? (0, _embedpdf_react_stamp.restoreStampLibraries)(stamp, store) : Promise.resolve();
-		restored.set(stamp, pending);
-	}
-	return pending;
-};
 function StampsPanel() {
 	const t = (0, _embedpdf_react_i18n.useT)();
 	const stamp = (0, _embedpdf_react_stamp.useStamp)();
-	const libraries = (0, _embedpdf_react_stamp.useStampLibraries)();
+	const { defaultLibrary, sidebar } = useStampsConfig();
+	const libraries = (0, _embedpdf_react_stamp.useStampLibraries)({ kind: sidebar ?? ["stamps"] });
 	const assets = (0, _embedpdf_react_stamp.useStampAssets)();
 	const { armAsset } = (0, _embedpdf_react_stamp.useArmStampAsset)();
 	const { activeToolId } = (0, _embedpdf_react_interaction.useTool)();
 	const { locale } = (0, _embedpdf_react_i18n.useLocale)();
-	const { defaultLibrary } = useStampsConfig();
 	const surface = (0, _embedpdf_react_shell.useSurface)("stamps");
 	const fileRef = (0, react.useRef)(null);
 	const [armedId, setArmedId] = (0, react.useState)(null);
@@ -3628,7 +3913,7 @@ function StampsPanel() {
 	(0, react.useEffect)(() => {
 		let live = true;
 		setBusy("loading");
-		restoreOnce(stamp).then(() => ensureDefaultLibrary(stamp, resolveStampsLocale(locale), defaultLibrary)).catch((err) => {
+		restoreStampLibrariesOnce(stamp).then(() => ensureDefaultLibrary(stamp, resolveStampsLocale(locale), defaultLibrary)).catch((err) => {
 			console.error("[embedpdf] default stamps failed:", err);
 			if (live) setError(t("demo.stampsError"));
 		}).finally(() => live && setBusy(null));
@@ -3636,7 +3921,6 @@ function StampsPanel() {
 			live = false;
 		};
 	}, [stamp, locale]);
-	(0, react.useEffect)(() => store ? (0, _embedpdf_react_stamp.persistStampLibraries)(stamp, store, { except: [DEFAULT_LIBRARY_ID] }) : void 0, [stamp]);
 	(0, react.useEffect)(() => {
 		if (activeToolId !== "stamp") setArmedId(null);
 	}, [activeToolId]);
@@ -3807,38 +4091,325 @@ function StampAssetCell({ asset, armed, onArm }) {
 	});
 }
 //#endregion
-//#region src/ui/panels.tsx
+//#region src/ui/signatures-panel.tsx
 /**
-* The static chrome around the toolbars: the left/right sidebars (shell
-* surfaces) and the bottom page-controls overlay. Deliberately minimal —
-* chrome-parity scope. Panels read their open state from plugin-shell; the
-* app owns their DOM.
+* The signatures sidebar (right panel) — Preview's signature sheet on v3
+* parts. One row per PERSON: a stamp library of kind `signatures` holding a
+* full signature and, optionally, initials. Nothing is stored beyond the
+* file; rename/export/delete are the library verbs.
 *
-* There is no built-in header: branding, a locale picker and a theme switch
-* are the EMBEDDER's chrome, not the viewer's. The frame keeps a `header`
-* socket for a slotted one (see Shell).
+*   pick a mark → with a TARGET field ("sign here" was clicked, or a
+*   signature widget selected) the mark goes into that field by the
+*   plugin's mode; otherwise it ARMS — hover a page for the ghost, click a
+*   signature field to sign it, click anywhere else to drop it as a stamp.
+*
+* Below the people: the signature fields of THIS document, signed or not,
+* with their verdicts — click an unsigned one to target it, a signed one to
+* inspect it.
 */
-function LeftSidebar() {
+const fieldLabel = (field) => field.kind === "fqn" ? field.name : `#${field.fieldObjectNumber}`;
+function SignaturesPanel() {
 	const t = (0, _embedpdf_react_i18n.useT)();
-	const sidebar = (0, _embedpdf_react_shell.useSurface)("sidebar");
-	if (!sidebar.isOpen) return null;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("aside", {
-		className: "border-border-subtle bg-surface flex w-60 shrink-0 flex-col border-r",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-			className: "border-border-subtle flex items-center gap-1 border-b p-2",
-			children: [
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: "bg-accent-light text-accent rounded-md px-2 py-1 text-xs font-medium",
-					children: t("demo.thumbnails")
-				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: "text-fg-muted rounded-md px-2 py-1 text-xs font-medium",
-					children: t("demo.outline")
-				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "flex-1" }),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-					type: "button",
-					onClick: sidebar.close,
+	const stamp = (0, _embedpdf_react_stamp.useStamp)();
+	const signature = (0, _embedpdf_react_signature.useSignature)();
+	const config = useSignaturesConfig();
+	const rows = (0, _embedpdf_react_signature.useSignerRows)();
+	const { target, busy } = (0, _embedpdf_react_signature.useSignatureTarget)();
+	const { armAsset } = (0, _embedpdf_react_stamp.useArmStampAsset)();
+	const { activeToolId } = (0, _embedpdf_react_interaction.useTool)();
+	const maker = (0, _embedpdf_react_shell.useSurface)("signature-maker");
+	const [armedId, setArmedId] = (0, react.useState)(null);
+	const [error, setError] = (0, react.useState)(null);
+	const [invalidating, setInvalidating] = (0, react.useState)(null);
+	(0, _embedpdf_react_signature.useSignatureEvent)((event) => {
+		if (event.type === "invalidating") setInvalidating(signature.signatureOf(event.field)?.fieldName ?? fieldLabel(event.field));
+		else if (event.type === "validated" && !event.verdicts.some((v) => v.summary === "invalid" && v.modifications.basis === "working-copy")) setInvalidating(null);
+	});
+	(0, react.useEffect)(() => {
+		restoreStampLibrariesOnce(stamp);
+	}, [stamp]);
+	(0, react.useEffect)(() => {
+		if (activeToolId !== "stamp") setArmedId(null);
+	}, [activeToolId]);
+	const pick = (asset) => {
+		setError(null);
+		if (target) {
+			signature.placeMark({ assetId: asset.id }, { field: target }).catch((err) => {
+				console.error("[embedpdf] placing the mark failed:", err);
+				setError(t("demo.signError"));
+			});
+			return;
+		}
+		setArmedId(asset.id);
+		armAsset(asset.id).catch((err) => {
+			console.error("[embedpdf] arm mark failed:", err);
+			setArmedId(null);
+			setError(t("demo.stampsArmError"));
+		});
+	};
+	const canAddPerson = (config.libraries ?? "many") === "many" || rows.length === 0;
+	const wantsInitials = (config.kinds ?? ["signature", "initials"]).includes("initials");
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex min-h-0 flex-1 flex-col",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "min-h-0 flex-1 overflow-y-auto p-3",
+				children: [rows.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex flex-col items-center gap-3 px-4 py-8 text-center",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: "signature",
+						size: 32,
+						className: "text-fg-muted"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: "text-fg-muted text-sm",
+						children: t("demo.signaturesEmpty")
+					})]
+				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", {
+					className: "flex flex-col gap-3",
+					children: rows.map((row) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SignerRowView, {
+						row,
+						armedId,
+						wantsInitials,
+						onPick: pick,
+						onAddInitials: () => maker.open({
+							exclusive: "modal",
+							props: { libraryId: row.libraryId }
+						})
+					}, row.libraryId))
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DocumentSignatures, {})]
+			}),
+			invalidating && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "border-border-subtle shrink-0 border-t px-3 py-2 text-xs text-amber-700",
+				children: t("demo.signaturesInvalidating", { params: { field: invalidating } })
+			}),
+			(error || target || armedId) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: `border-border-subtle shrink-0 border-t px-3 py-2 text-xs ${error ? "text-red-600" : "text-fg-muted"}`,
+				children: error ?? (target ? busy ? t("demo.signSigning") : t("demo.signaturesTargetHint") : t("demo.signaturesArmedHint"))
+			}),
+			canAddPerson ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "border-border-subtle shrink-0 border-t p-3",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					onClick: () => maker.open({ exclusive: "modal" }),
+					className: "border-border text-fg hover:bg-hover flex w-full items-center justify-center gap-2 rounded-md border px-3 py-1.5 text-sm",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: "plus",
+						size: 16
+					}), t("demo.signaturesNew")]
+				})
+			}) : null
+		]
+	});
+}
+function SignerRowView({ row, armedId, wantsInitials, onPick, onAddInitials }) {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const stamp = (0, _embedpdf_react_stamp.useStamp)();
+	const [renaming, setRenaming] = (0, react.useState)(null);
+	const exportPdf = () => {
+		const bytes = stamp.exportLibrary(row.libraryId);
+		if (!bytes) return;
+		const blob = new Blob([bytes], { type: "application/pdf" });
+		const url = URL.createObjectURL(blob);
+		const a = document.createElement("a");
+		a.href = url;
+		a.download = `${row.name || "signature"}.pdf`;
+		a.click();
+		URL.revokeObjectURL(url);
+	};
+	const commitRename = () => {
+		const name = renaming?.trim();
+		setRenaming(null);
+		if (name && name !== row.name) stamp.updateLibrary(row.libraryId, { name });
+	};
+	const iconButton = "text-fg-muted hover:text-fg grid h-6 w-6 shrink-0 place-items-center rounded";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
+		className: "border-border-subtle rounded-md border p-2",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-center gap-1",
+			children: [
+				renaming !== null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+					autoFocus: true,
+					value: renaming,
+					onChange: (e) => setRenaming(e.target.value),
+					onBlur: commitRename,
+					onKeyDown: (e) => {
+						if (e.key === "Enter") commitRename();
+						if (e.key === "Escape") setRenaming(null);
+					},
+					className: "border-border bg-surface text-fg min-w-0 flex-1 rounded border px-1.5 py-0.5 text-sm"
+				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "text-fg min-w-0 flex-1 truncate text-sm font-medium",
+					children: row.name
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					onClick: () => setRenaming(row.name),
+					title: t("demo.signaturesRename"),
+					className: iconButton,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: "pencilMarker",
+						size: 13
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					onClick: exportPdf,
+					title: t("demo.signaturesExport"),
+					className: iconButton,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: "download",
+						size: 13
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					onClick: () => void stamp.removeLibrary(row.libraryId),
+					title: t("demo.signaturesRemove"),
+					className: iconButton,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: "trash",
+						size: 13
+					})
+				})
+			]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "mt-2 grid grid-cols-[2fr_1fr] gap-2",
+			children: [row.signatures.map((asset) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MarkThumb, {
+				asset,
+				label: t("demo.signatureLabel"),
+				armed: armedId === asset.id,
+				onPick: () => onPick(asset)
+			}, asset.id)), wantsInitials ? row.initials ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MarkThumb, {
+				asset: row.initials,
+				label: t("demo.initialsLabel"),
+				armed: armedId === row.initials.id,
+				onPick: () => onPick(row.initials)
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				onClick: onAddInitials,
+				title: t("demo.signaturesAddInitials"),
+				className: "border-border-subtle text-fg-muted hover:bg-hover flex h-16 items-center justify-center rounded-md border border-dashed text-xs",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+					name: "plus",
+					size: 14
+				})
+			}) : null]
+		})]
+	});
+}
+function MarkThumb({ asset, label, armed, onPick }) {
+	const url = (0, _embedpdf_react_stamp.useStampAssetPreviewUrl)(asset.id);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		type: "button",
+		onClick: onPick,
+		title: label,
+		"aria-pressed": armed,
+		className: `flex h-16 items-center justify-center rounded-md border p-1 ${armed ? "border-accent bg-accent-light ring-accent ring-2" : "border-border-subtle hover:border-border hover:bg-hover"}`,
+		children: url ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+			src: url,
+			alt: label,
+			className: "max-h-full max-w-full object-contain"
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "text-fg-muted text-xs",
+			children: label
+		})
+	});
+}
+/** The signature fields of this document, with their state. */
+function DocumentSignatures() {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const signature = (0, _embedpdf_react_signature.useSignature)();
+	const snapshot = (0, _embedpdf_react_signature.useSignatureSnapshot)();
+	const verdicts = (0, _embedpdf_react_signature.useSignatureVerdicts)();
+	const { target } = (0, _embedpdf_react_signature.useSignatureTarget)();
+	const [validating, setValidating] = (0, react.useState)(false);
+	const fields = snapshot?.signatures ?? [];
+	const verdictOf = (dto) => verdicts?.find((v) => v.signature.index === dto.index) ?? null;
+	const verdictLabel = (v) => !v ? t("demo.signaturesSigned") : v.summary === "valid" ? t("demo.verdictValid") : v.summary === "valid-untrusted" ? t("demo.verdictValidUntrusted") : v.summary === "indeterminate" ? t("demo.verdictIndeterminate") : v.modifications.basis === "working-copy" ? t("demo.verdictWillInvalidate") : t("demo.verdictInvalid");
+	const verdictTone = (v) => !v || v.summary === "indeterminate" ? "text-fg-muted" : v.summary === "invalid" ? v.modifications.basis === "working-copy" ? "text-amber-600" : "text-red-600" : v.summary === "valid-untrusted" ? "text-amber-600" : "text-green-600";
+	const isTarget = (dto) => !!target && (target.kind === "fqn" ? target.name === dto.fieldName : target.fieldObjectNumber === (dto.field.kind === "objectNumber" ? dto.field.fieldObjectNumber : -1));
+	const validate = () => {
+		setValidating(true);
+		signature.validate().finally(() => setValidating(false));
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "mt-4",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-center justify-between",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-fg-muted text-xs font-semibold uppercase tracking-wide",
+				children: t("demo.signaturesInDocument")
+			}), fields.some((f) => f.signed) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				disabled: validating,
+				onClick: validate,
+				className: "text-accent text-xs hover:underline disabled:opacity-60",
+				children: validating ? t("demo.signaturesValidating") : t("demo.signaturesValidate")
+			}) : null]
+		}), fields.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+			className: "text-fg-muted mt-1 text-xs",
+			children: t("demo.signaturesNone")
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", {
+			className: "mt-1 flex flex-col gap-1",
+			children: fields.map((dto) => {
+				const verdict = verdictOf(dto);
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					onClick: () => dto.signed ? signature.inspect(dto.field) : signature.setTarget(dto.field),
+					className: `hover:bg-hover flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-sm ${isTarget(dto) ? "bg-accent-light" : ""}`,
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+							name: dto.signed ? "check" : "signature",
+							size: 14,
+							className: dto.signed ? "text-green-600" : "text-fg-muted"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "text-fg min-w-0 flex-1 truncate",
+							children: dto.fieldName
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: `shrink-0 text-right text-xs ${dto.signed ? verdictTone(verdict) : "text-fg-muted"}`,
+							children: dto.signed ? verdictLabel(verdict) : t("demo.signaturesUnsigned")
+						})
+					]
+				}) }, dto.index);
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/ui/panels.tsx
+/**
+* The static chrome around the toolbars: the left/right sidebars (shell
+* surfaces) and the bottom page-controls overlay. Deliberately minimal —
+* chrome-parity scope. Panels read their open state from plugin-shell; the
+* app owns their DOM.
+*
+* There is no built-in header: branding, a locale picker and a theme switch
+* are the EMBEDDER's chrome, not the viewer's. The frame keeps a `header`
+* socket for a slotted one (see Shell).
+*/
+function LeftSidebar() {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const sidebar = (0, _embedpdf_react_shell.useSurface)("sidebar");
+	if (!sidebar.isOpen) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("aside", {
+		className: "border-border-subtle bg-surface flex w-60 shrink-0 flex-col border-r",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "border-border-subtle flex items-center gap-1 border-b p-2",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "bg-accent-light text-accent rounded-md px-2 py-1 text-xs font-medium",
+					children: t("demo.thumbnails")
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "text-fg-muted rounded-md px-2 py-1 text-xs font-medium",
+					children: t("demo.outline")
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "flex-1" }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					onClick: sidebar.close,
 					className: "text-fg-muted hover:bg-hover grid h-7 w-7 place-items-center rounded-md",
 					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
 						name: "x",
@@ -3901,10 +4472,11 @@ function RightSidebar() {
 	const style = (0, _embedpdf_react_shell.useSurface)("annotation-style");
 	const redaction = (0, _embedpdf_react_shell.useSurface)("redaction");
 	const stamps = (0, _embedpdf_react_shell.useSurface)("stamps");
-	const active = search.isOpen ? "search" : comment.isOpen ? "comment" : style.isOpen ? "style" : redaction.isOpen ? "redaction" : stamps.isOpen ? "stamps" : null;
+	const signatures = (0, _embedpdf_react_shell.useSurface)("signatures");
+	const active = search.isOpen ? "search" : comment.isOpen ? "comment" : style.isOpen ? "style" : redaction.isOpen ? "redaction" : stamps.isOpen ? "stamps" : signatures.isOpen ? "signatures" : null;
 	if (!active) return null;
-	const titleKey = active === "search" ? "demo.searchTitle" : active === "comment" ? "demo.commentsTitle" : active === "redaction" ? "demo.redactionTitle" : active === "stamps" ? "demo.stampsTitle" : "demo.styleTitle";
-	const close = active === "search" ? search.close : active === "comment" ? comment.close : active === "redaction" ? redaction.close : active === "stamps" ? stamps.close : style.close;
+	const titleKey = active === "search" ? "demo.searchTitle" : active === "comment" ? "demo.commentsTitle" : active === "redaction" ? "demo.redactionTitle" : active === "stamps" ? "demo.stampsTitle" : active === "signatures" ? "demo.signaturesTitle" : "demo.styleTitle";
+	const close = active === "search" ? search.close : active === "comment" ? comment.close : active === "redaction" ? redaction.close : active === "stamps" ? stamps.close : active === "signatures" ? signatures.close : style.close;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("aside", {
 		className: "border-border-subtle bg-surface flex w-72 shrink-0 flex-col border-l",
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -3921,7 +4493,7 @@ function RightSidebar() {
 					size: 16
 				})
 			})]
-		}), active === "style" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AnnotationStylePanel, {}) : active === "search" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SearchPanel, {}, documentId ?? "none") : active === "redaction" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RedactionPanel, {}) : active === "stamps" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StampsPanel, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CommentsPanel, {}, documentId ?? "none")]
+		}), active === "style" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AnnotationStylePanel, {}) : active === "search" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SearchPanel, {}, documentId ?? "none") : active === "redaction" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RedactionPanel, {}) : active === "stamps" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StampsPanel, {}) : active === "signatures" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SignaturesPanel, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CommentsPanel, {}, documentId ?? "none")]
 	});
 }
 function PageControls() {
@@ -4012,6 +4584,684 @@ function RedactConfirmModal() {
 	});
 }
 //#endregion
+//#region src/ui/sign-dialog.tsx
+/**
+* The sign dialog (`signature-sign` modal surface): a mark met a field and
+* the mode is `ask` — or a "sign here" flow wants the facts first. Shows
+* the mark as it will sit in the field, takes reason and location, offers
+* a certification when the config allows it, and either SEALS the field
+* (`signField`) or only draws the mark into it (`fillField`).
+*/
+function SignDialog() {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const surface = (0, _embedpdf_react_shell.useSurface)("signature-sign");
+	const signature = (0, _embedpdf_react_signature.useSignature)();
+	const [reason, setReason] = (0, react.useState)("");
+	const [location, setLocation] = (0, react.useState)("");
+	const [signKind, setSignKind] = (0, react.useState)("approval");
+	const [busy, setBusy] = (0, react.useState)(null);
+	const [error, setError] = (0, react.useState)(null);
+	const field = surface.props?.field;
+	const mark = surface.props?.mark;
+	const preview = (0, _embedpdf_react_stamp.useStampAssetPreviewUrl)(mark && "assetId" in mark ? mark.assetId : null);
+	if (!surface.isOpen || !field || !mark) return null;
+	const attribution = {
+		...reason.trim() ? { reason: reason.trim() } : {},
+		...location.trim() ? { location: location.trim() } : {}
+	};
+	const run = async (kind) => {
+		setBusy(kind);
+		setError(null);
+		try {
+			if (kind === "sign") await signature.signField({
+				field,
+				mark,
+				attribution,
+				...signKind !== "approval" && signature.canCertify() ? { certify: { permission: Number(signKind.slice(-1)) } } : {}
+			});
+			else await signature.fillField(field, mark);
+			surface.close();
+		} catch (err) {
+			setError(err instanceof Error ? err.message : String(err));
+		} finally {
+			setBusy(null);
+		}
+	};
+	const input = "border-border bg-surface text-fg w-full rounded border px-2 py-1.5 text-sm";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "fixed inset-0 z-50 grid place-items-center bg-black/40",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "border-border bg-surface w-96 rounded-lg border p-4 shadow-xl",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+					className: "text-fg text-base font-semibold",
+					children: t("demo.signTitle")
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "border-border-subtle mt-3 flex h-24 items-center justify-center rounded-md border p-2",
+					children: preview ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+						src: preview,
+						alt: "",
+						className: "max-h-full max-w-full object-contain"
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-fg-muted text-sm",
+						children: t("demo.signatureLabel")
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+					className: "text-fg-muted mt-3 block text-xs",
+					children: [t("demo.signReason"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+						value: reason,
+						onChange: (e) => setReason(e.target.value),
+						className: input
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+					className: "text-fg-muted mt-2 block text-xs",
+					children: [t("demo.signLocation"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+						value: location,
+						onChange: (e) => setLocation(e.target.value),
+						className: input
+					})]
+				}),
+				signature.canCertify() ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+					className: "text-fg-muted mt-3 block text-xs",
+					children: [t("demo.signKind"), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("select", {
+						value: signKind,
+						onChange: (e) => setSignKind(e.target.value),
+						className: input,
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+								value: "approval",
+								children: t("demo.signKindApproval")
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+								value: "certify-3",
+								children: t("demo.signKindCertifyAnnotate")
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+								value: "certify-2",
+								children: t("demo.signKindCertifyFill")
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+								value: "certify-1",
+								children: t("demo.signKindCertifyLocked")
+							})
+						]
+					})]
+				}) : null,
+				error ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: "mt-2 text-sm text-red-600",
+					children: error
+				}) : null,
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "mt-4 flex justify-end gap-2",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							type: "button",
+							disabled: busy != null,
+							onClick: surface.close,
+							className: "border-border text-fg hover:bg-hover rounded-md border px-3 py-1.5 text-sm",
+							children: t("demo.cancel")
+						}),
+						signature.canFill() ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							type: "button",
+							disabled: busy != null,
+							onClick: () => void run("fill"),
+							className: "border-border text-fg hover:bg-hover rounded-md border px-3 py-1.5 text-sm disabled:opacity-60",
+							children: t("demo.signFill")
+						}) : null,
+						signature.canSign() ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							type: "button",
+							disabled: busy != null,
+							onClick: () => void run("sign"),
+							className: "bg-accent text-on-accent rounded-md px-3 py-1.5 text-sm disabled:opacity-60",
+							children: busy === "sign" ? t("demo.signSigning") : t("demo.signButton")
+						}) : null
+					]
+				})
+			]
+		})
+	});
+}
+//#endregion
+//#region src/ui/signature-bridge.tsx
+/**
+* The signature plugin's UI intents → shell surfaces. The plugin owns the
+* act and says WHAT happened; the chrome decides WHAT OPENS:
+*
+*   target  (a "sign here" click)      → the signatures panel, right side
+*   ask     (mode 'ask' met a field)   → the sign dialog (modal)
+*   inspect (a signed field clicked)   → the validation popover
+*
+* Mounted once per document view; renders nothing.
+*/
+function SignatureBridge() {
+	const shell = (0, _embedpdf_react_shell.useShell)();
+	(0, _embedpdf_react_signature.useSignatureEvent)((event) => {
+		switch (event.type) {
+			case "target":
+				if (event.field) shell.open("signatures", { exclusive: "right" });
+				return;
+			case "ask":
+				shell.open("signature-sign", {
+					exclusive: "modal",
+					props: {
+						field: event.field,
+						mark: event.mark
+					}
+				});
+				return;
+			case "inspect":
+				shell.open("signature-inspector", { props: { field: event.field } });
+				return;
+			case "invalidating":
+				shell.open("signatures", { exclusive: "right" });
+				return;
+			default: return;
+		}
+	});
+	return null;
+}
+//#endregion
+//#region src/ui/signature-inspector.tsx
+/**
+* The validation popover (`signature-inspector` surface): what a signed
+* field's signature says and whether it holds — the four independent facts
+* (integrity, cryptography, trust, changes since) and the signer's claims,
+* anchored at the widget when its box is known, plus the signed revision as
+* a download (the exact bytes the signature covers). Mounted in the Stage
+* overlay so `<Anchored>` can project onto the page.
+*/
+const verdictKey = (v) => !v ? "demo.verdictIndeterminate" : v.summary === "valid" ? "demo.verdictValid" : v.summary === "valid-untrusted" ? "demo.verdictValidUntrusted" : v.summary === "invalid" ? v.modifications.basis === "working-copy" ? "demo.verdictWillInvalidate" : "demo.verdictInvalid" : "demo.verdictIndeterminate";
+/** A PDF date string (`D:YYYYMMDDHHmmSSZ` or with a zone offset) as a locale date; the raw text when it is not one. */
+const pdfDate = (raw) => {
+	const m = /^D:(\d{4})(\d{2})?(\d{2})?(\d{2})?(\d{2})?(\d{2})?(Z|[+-]\d{2}'?\d{2}'?)?/.exec(raw);
+	if (!m) return raw;
+	const [, y, mo = "01", d = "01", h = "00", mi = "00", s = "00", zone] = m;
+	const offset = !zone || zone === "Z" ? "Z" : `${zone[0]}${zone.slice(1, 3)}:${zone.slice(3).replace(/'/g, "") || "00"}`;
+	const date = /* @__PURE__ */ new Date(`${y}-${mo}-${d}T${h}:${mi}:${s}${offset}`);
+	return Number.isNaN(date.getTime()) ? raw : date.toLocaleString();
+};
+const tone = (summary) => summary === "valid" ? "text-green-600" : summary === "invalid" ? "text-red-600" : summary === "valid-untrusted" ? "text-amber-600" : "text-fg-muted";
+function SignatureInspector() {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const surface = (0, _embedpdf_react_shell.useSurface)("signature-inspector");
+	const signature = (0, _embedpdf_react_signature.useSignature)();
+	const snapshot = (0, _embedpdf_react_signature.useSignatureSnapshot)();
+	const verdicts = (0, _embedpdf_react_signature.useSignatureVerdicts)();
+	const [validating, setValidating] = (0, react.useState)(false);
+	const field = surface.props?.field;
+	const dto = field ? signature.signatureOf(field) : null;
+	const verdict = field ? signature.verdictOf(field) : null;
+	const widget = dto?.widget ?? null;
+	const box = (0, _embedpdf_react_runtime.useSelector)(_embedpdf_react_form.FormToken, (c) => widget && widget.annotObjectNumber > 0 ? c.fillItem(widget.annotObjectNumber)?.box ?? null : null);
+	(0, react.useEffect)(() => {
+		if (!surface.isOpen || !dto?.signed || verdicts) return;
+		setValidating(true);
+		signature.validate().finally(() => setValidating(false));
+	}, [surface.isOpen, dto?.index]);
+	if (!surface.isOpen || !field || !dto || !snapshot) return null;
+	const revalidate = () => {
+		setValidating(true);
+		signature.validate().finally(() => setValidating(false));
+	};
+	const summary = verdict?.summary ?? null;
+	const modifications = verdict?.modifications.verdict ?? null;
+	const row = (label, value, className = "text-fg") => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex items-baseline justify-between gap-3 text-xs",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "text-fg-muted",
+			children: label
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: `text-right ${className}`,
+			children: value
+		})]
+	});
+	const card = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "border-border bg-elevated w-72 rounded-lg border p-3 text-sm shadow-xl",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "text-fg font-semibold",
+					children: t("demo.inspectTitle")
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					onClick: surface.close,
+					className: "text-fg-muted hover:bg-hover grid h-6 w-6 place-items-center rounded",
+					"aria-label": t("demo.cancel"),
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: "x",
+						size: 14
+					})
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: `mt-1 text-sm font-medium ${tone(summary)}`,
+				children: validating ? t("demo.signaturesValidating") : t(verdictKey(verdict))
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "mt-2 flex flex-col gap-1",
+				children: [
+					row(t("demo.inspectSigner"), dto.signer.name ?? "—"),
+					dto.signer.reason ? row(t("demo.inspectReason"), dto.signer.reason) : null,
+					dto.signer.location ? row(t("demo.inspectLocation"), dto.signer.location) : null,
+					dto.signer.claimedTime ? row(t("demo.inspectTime"), pdfDate(dto.signer.claimedTime)) : null
+				]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "border-border-subtle mt-2 flex flex-col gap-1 border-t pt-2",
+				children: [
+					row(t("demo.inspectIntegrity"), verdict?.integrity ?? "—", tone(verdict?.integrity === "valid" ? "valid" : verdict?.integrity === "invalid" ? "invalid" : null)),
+					row(t("demo.inspectCryptography"), verdict?.cryptography ?? "—"),
+					row(t("demo.inspectTrust"), verdict?.trust ?? "—"),
+					row(t("demo.inspectChanges"), modifications === "unchanged" ? verdict?.modifications.undone ? t("demo.verdictRestored") : t("demo.verdictUnchanged") : modifications === "permitted" ? t("demo.verdictPermitted") : modifications === "forbidden" ? t("demo.verdictForbidden") : "—", modifications === "forbidden" ? "text-red-600" : "text-fg"),
+					verdict?.modifications.laterRevisions ? row(t("demo.inspectLaterRevisions"), String(verdict.modifications.laterRevisions)) : null
+				]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "mt-3 flex justify-end gap-2",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					disabled: validating,
+					onClick: revalidate,
+					className: "border-border text-fg hover:bg-hover rounded-md border px-2 py-1 text-xs disabled:opacity-60",
+					children: t("demo.signaturesValidate")
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DownloadRevision, { field })]
+			})
+		]
+	});
+	if (widget && widget.pageObjectNumber > 0 && box) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_embedpdf_react_anchored.Anchored, {
+		anchor: {
+			pon: widget.pageObjectNumber,
+			bounds: box
+		},
+		placement: "bottom",
+		gap: 8,
+		children: card
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "absolute right-4 top-4 z-40",
+		children: card
+	});
+}
+/** The signed revision — the exact bytes the signature covers — as a file. */
+function DownloadRevision({ field }) {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const signature = (0, _embedpdf_react_signature.useSignature)();
+	const dto = signature.signatureOf(field);
+	const [busy, setBusy] = (0, react.useState)(false);
+	if (!dto || dto.revisionIndex === null) return null;
+	const revisionIndex = dto.revisionIndex;
+	const run = async () => {
+		setBusy(true);
+		try {
+			const bytes = await signature.revisionBytes(revisionIndex);
+			const blob = new Blob([bytes], { type: "application/pdf" });
+			const url = URL.createObjectURL(blob);
+			const a = document.createElement("a");
+			a.href = url;
+			a.download = `${dto.fieldName}-signed.pdf`;
+			a.click();
+			URL.revokeObjectURL(url);
+		} catch (err) {
+			console.error("[embedpdf] signed revision download failed:", err);
+		} finally {
+			setBusy(false);
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		type: "button",
+		disabled: busy,
+		onClick: () => void run(),
+		className: "border-border text-fg hover:bg-hover rounded-md border px-2 py-1 text-xs disabled:opacity-60",
+		children: t("demo.inspectDownload")
+	});
+}
+//#endregion
+//#region src/ui/signature-maker.tsx
+/**
+* The mark maker (`signature-maker` modal surface): a person's signature and
+* initials, drawn, typed, or uploaded, saved as ONE library of kind
+* `signatures` — the file IS the person (Preview's model). Chrome code over
+* the stamp plugin's generic calls: `createLibrary` + `addAsset({ mark })`;
+* rename/export/delete are the library verbs. Opened on an existing library
+* (`props.libraryId`) it only adds the missing initials.
+*/
+const PAD = {
+	width: 360,
+	height: 120
+};
+const BUILTIN_FONTS = [{
+	key: "helvetica-oblique",
+	label: "Helvetica"
+}, {
+	key: "times-italic",
+	label: "Times"
+}];
+/** One pad: draw / type / upload, producing a `MarkSource` or null. */
+function MarkPad({ value, onChange, fonts, registerFont }) {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const [tab, setTab] = (0, react.useState)("draw");
+	const [strokes, setStrokes] = (0, react.useState)([]);
+	const [text, setText] = (0, react.useState)("");
+	const [font, setFont] = (0, react.useState)(fonts[0]?.key ?? "helvetica-oblique");
+	const [fileName, setFileName] = (0, react.useState)(null);
+	const canvas = (0, react.useRef)(null);
+	const drawing = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		const el = canvas.current;
+		if (!el) return;
+		const dpr = window.devicePixelRatio || 1;
+		el.width = PAD.width * dpr;
+		el.height = PAD.height * dpr;
+		const ctx = el.getContext("2d");
+		if (!ctx) return;
+		ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
+		ctx.clearRect(0, 0, PAD.width, PAD.height);
+		ctx.lineCap = "round";
+		ctx.lineJoin = "round";
+		ctx.lineWidth = 2.5;
+		ctx.strokeStyle = getComputedStyle(el).color || "#000";
+		for (const stroke of strokes) {
+			ctx.beginPath();
+			stroke.forEach((p, i) => i === 0 ? ctx.moveTo(p.x, p.y) : ctx.lineTo(p.x, p.y));
+			ctx.stroke();
+		}
+	}, [strokes, tab]);
+	const point = (e) => {
+		const r = e.currentTarget.getBoundingClientRect();
+		return {
+			x: e.clientX - r.left,
+			y: e.clientY - r.top
+		};
+	};
+	const commitStrokes = (next) => {
+		setStrokes(next);
+		onChange(next.length ? {
+			kind: "ink",
+			strokes: next,
+			color: "#000000",
+			strokeWidth: 2.5
+		} : null);
+	};
+	const commitText = async (next, key) => {
+		setText(next);
+		setFont(key);
+		if (!next.trim()) {
+			onChange(null);
+			return;
+		}
+		await registerFont(key);
+		onChange({
+			kind: "text",
+			text: next.trim(),
+			fontFamily: key,
+			color: "#000000",
+			fontSize: 36
+		});
+	};
+	const pickFile = (file) => {
+		setFileName(file.name);
+		onChange(file.type === "application/pdf" ? {
+			kind: "pdf",
+			source: file,
+			pageIndex: 0
+		} : {
+			kind: "image",
+			source: file
+		});
+	};
+	const tabClass = (id) => `rounded px-2 py-1 text-xs font-medium ${tab === id ? "bg-accent text-on-accent" : "text-fg-muted hover:bg-hover"}`;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col gap-2",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-center gap-1",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: tabClass("draw"),
+					onClick: () => setTab("draw"),
+					children: t("demo.makerDraw")
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: tabClass("type"),
+					onClick: () => setTab("type"),
+					children: t("demo.makerType")
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: tabClass("upload"),
+					onClick: () => setTab("upload"),
+					children: t("demo.makerUpload")
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "flex-1" }),
+				value ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					onClick: () => {
+						commitStrokes([]);
+						setText("");
+						setFileName(null);
+						onChange(null);
+					},
+					className: "text-fg-muted hover:text-fg text-xs",
+					children: t("demo.makerClear")
+				}) : null
+			]
+		}), tab === "draw" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("canvas", {
+			ref: canvas,
+			style: {
+				width: PAD.width,
+				height: PAD.height,
+				touchAction: "none"
+			},
+			className: "border-border-subtle bg-surface text-fg rounded-md border",
+			onPointerDown: (e) => {
+				e.currentTarget.setPointerCapture(e.pointerId);
+				drawing.current = [point(e)];
+				setStrokes((s) => [...s, drawing.current]);
+			},
+			onPointerMove: (e) => {
+				if (!drawing.current) return;
+				drawing.current.push(point(e));
+				setStrokes((s) => [...s.slice(0, -1), [...drawing.current]]);
+			},
+			onPointerUp: () => {
+				if (!drawing.current) return;
+				const done = drawing.current;
+				drawing.current = null;
+				setStrokes((s) => {
+					const next = [...s.slice(0, -1), done];
+					commitStrokes(next);
+					return next;
+				});
+			}
+		}) : tab === "type" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex flex-col gap-2",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				value: text,
+				placeholder: t("demo.makerTypePlaceholder"),
+				onChange: (e) => void commitText(e.target.value, font),
+				className: "border-border bg-surface text-fg w-full rounded border px-2 py-1.5 text-sm"
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+				className: "text-fg-muted flex items-center gap-2 text-xs",
+				children: [t("demo.makerFont"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
+					value: font,
+					onChange: (e) => void commitText(text, e.target.value),
+					className: "border-border bg-surface text-fg rounded border px-2 py-1 text-xs",
+					children: fonts.map((f) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+						value: f.key,
+						children: f.label
+					}, f.key))
+				})]
+			})]
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+			className: "border-border-subtle text-fg-muted hover:bg-hover flex h-24 cursor-pointer items-center justify-center rounded-md border border-dashed text-sm",
+			children: [fileName ?? t("demo.makerUploadHint"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				type: "file",
+				accept: "image/png,image/jpeg,application/pdf",
+				className: "hidden",
+				onChange: (e) => {
+					const file = e.currentTarget.files?.[0];
+					e.currentTarget.value = "";
+					if (file) pickFile(file);
+				}
+			})]
+		})]
+	});
+}
+function SignatureMakerModal() {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const surface = (0, _embedpdf_react_shell.useSurface)("signature-maker");
+	const stamp = (0, _embedpdf_react_stamp.useStamp)();
+	const kernel = (0, _embedpdf_react_runtime.useKernel)();
+	const config = useSignaturesConfig();
+	const [name, setName] = (0, react.useState)("");
+	const [signatureMark, setSignatureMark] = (0, react.useState)(null);
+	const [initialsMark, setInitialsMark] = (0, react.useState)(null);
+	const [busy, setBusy] = (0, react.useState)(false);
+	const [error, setError] = (0, react.useState)(null);
+	const existingId = surface.props?.libraryId;
+	const existing = existingId ? stamp.library(existingId) : null;
+	const wantsInitials = (config.kinds ?? ["signature", "initials"]).includes("initials");
+	const fonts = [...(config.fonts ?? []).map((f) => ({
+		key: f.key,
+		label: f.label
+	})), ...BUILTIN_FONTS];
+	const registered = (0, react.useRef)(/* @__PURE__ */ new Set());
+	const registerFont = async (key) => {
+		const spec = config.fonts?.find((f) => f.key === key);
+		if (!spec || registered.current.has(key) || !kernel.engine.fonts) return;
+		const response = await fetch(spec.url);
+		if (!response.ok) throw new Error(`${spec.url}: HTTP ${response.status}`);
+		await kernel.engine.fonts.register({
+			key,
+			data: new Uint8Array(await response.arrayBuffer())
+		});
+		registered.current.add(key);
+	};
+	if (!surface.isOpen) return null;
+	const canSave = existing ? initialsMark != null : name.trim().length > 0 && signatureMark != null;
+	const save = async () => {
+		setBusy(true);
+		setError(null);
+		try {
+			if (existing) await stamp.addAsset({
+				libraryId: existing.id,
+				name: _embedpdf_react_signature.INITIALS_MARK_NAME,
+				label: t("demo.initialsLabel"),
+				mark: initialsMark
+			});
+			else {
+				const libraryId = await stamp.createLibrary(name.trim(), { kind: _embedpdf_react_signature.SIGNATURES_LIBRARY_KIND });
+				await stamp.addAsset({
+					libraryId,
+					name: _embedpdf_react_signature.SIGNATURE_MARK_NAME,
+					label: t("demo.signatureLabel"),
+					mark: signatureMark
+				});
+				if (initialsMark) await stamp.addAsset({
+					libraryId,
+					name: _embedpdf_react_signature.INITIALS_MARK_NAME,
+					label: t("demo.initialsLabel"),
+					mark: initialsMark
+				});
+			}
+			setName("");
+			setSignatureMark(null);
+			setInitialsMark(null);
+			surface.close();
+		} catch (err) {
+			console.error("[embedpdf] saving the signature failed:", err);
+			setError(t("demo.makerError"));
+		} finally {
+			setBusy(false);
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "fixed inset-0 z-50 grid place-items-center bg-black/40",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "border-border bg-surface w-[26rem] rounded-lg border p-4 shadow-xl",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex items-center justify-between",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+						className: "text-fg text-base font-semibold",
+						children: existing ? t("demo.signaturesAddInitials") : t("demo.makerTitle")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: surface.close,
+						className: "text-fg-muted hover:bg-hover grid h-7 w-7 place-items-center rounded-md",
+						"aria-label": t("demo.cancel"),
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+							name: "x",
+							size: 16
+						})
+					})]
+				}),
+				existing ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+					className: "text-fg-muted mt-3 block text-xs",
+					children: [t("demo.makerName"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+						value: name,
+						placeholder: t("demo.makerNamePlaceholder"),
+						onChange: (e) => setName(e.target.value),
+						className: "border-border bg-surface text-fg mt-1 w-full rounded border px-2 py-1.5 text-sm"
+					})]
+				}),
+				existing ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "mt-3",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: "text-fg mb-1 text-xs font-semibold uppercase tracking-wide",
+						children: t("demo.signatureLabel")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MarkPad, {
+						value: signatureMark,
+						onChange: setSignatureMark,
+						fonts,
+						registerFont
+					})]
+				}),
+				wantsInitials ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "mt-3",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+						className: "text-fg mb-1 text-xs font-semibold uppercase tracking-wide",
+						children: [t("demo.initialsLabel"), existing ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "text-fg-muted ml-1 font-normal normal-case tracking-normal",
+							children: t("demo.makerOptional")
+						})]
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MarkPad, {
+						value: initialsMark,
+						onChange: setInitialsMark,
+						fonts,
+						registerFont
+					})]
+				}) : null,
+				error ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: "mt-2 text-sm text-red-600",
+					children: error
+				}) : null,
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "mt-4 flex justify-end gap-2",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						disabled: busy,
+						onClick: surface.close,
+						className: "border-border text-fg hover:bg-hover rounded-md border px-3 py-1.5 text-sm",
+						children: t("demo.cancel")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						disabled: busy || !canSave,
+						onClick: () => void save(),
+						className: "bg-accent text-on-accent rounded-md px-3 py-1.5 text-sm disabled:opacity-60",
+						children: busy ? t("demo.makerSaving") : t("demo.makerSave")
+					})]
+				})
+			]
+		})
+	});
+}
+//#endregion
 //#region src/ui/document-boot.tsx
 /**
 * Boot-state panes for the document area — what renders INSTEAD of the Stage
@@ -4253,9 +5503,10 @@ function Shell() {
 			className: "w-full"
 		})
 	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AnnotationFontsProvider, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "bg-app text-fg flex h-full flex-col",
 		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StampLibraryStore, {}),
 			(frame.header ?? true) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("slot", { name: "header" }),
 			(frame.tabs ?? "always") !== "never" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("slot", {
 				name: "tabs",
@@ -4275,6 +5526,7 @@ function Shell() {
 								overlay: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
 									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(AnnotationStrip, {}),
 									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SelectionStrip, {}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SignatureInspector, {}),
 									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_embedpdf_react_selection.SelectionHandles, {}),
 									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_embedpdf_react_scrollbar.Scrollbar, { axis: "y" }),
 									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_embedpdf_react_scrollbar.Scrollbar, { axis: "x" })
@@ -4293,12 +5545,15 @@ function Shell() {
 						]
 					}),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RightSidebar, {}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RedactConfirmModal, {})
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RedactConfirmModal, {}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SignatureBridge, {}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SignDialog, {}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SignatureMakerModal, {})
 				] })
 			}),
 			toolbarEdge === "bottom" && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModeBand, { edge: "bottom" }), toolbarBand] })
 		]
-	});
+	}) });
 }
 //#endregion
 //#region src/viewer.tsx
@@ -4321,7 +5576,7 @@ function Shell() {
 * changing these props on a mounted viewer does not rebuild the workspace.
 */
 /** Lazy built-in packs — a strings override for one of these wraps its loader. */
-const BUILTIN_LOADERS = { es: () => Promise.resolve().then(() => require("./es-BRYSk4rY.cjs")).then((m) => m.es) };
+const BUILTIN_LOADERS = { es: () => Promise.resolve().then(() => require("./es-DYwzfxyt.cjs")).then((m) => m.es) };
 const isDict = (v) => typeof v === "object" && v !== null;
 /**
 * Deep-merge `over` into `base` (immutably), expanding dotted keys —
@@ -4365,7 +5620,7 @@ function Booting() {
 		})
 	});
 }
-function FullViewer({ engine, initialDocuments, fallback, commands, icons, strings, locale = "auto", disabledCategories, chrome, stamps, theme, themeTarget, onViewer }) {
+function FullViewer({ engine, initialDocuments, fallback, commands, icons, strings, locale = "auto", disabledCategories, chrome, stamps, signatures, annotations, theme, themeTarget, onViewer }) {
 	const [resolved] = (0, react.useState)(() => {
 		const byId = new Map(require_commands.defaultCommands.map((c) => [c.id, c]));
 		for (const c of commands ?? []) byId.set(c.id, c);
@@ -4397,6 +5652,8 @@ function FullViewer({ engine, initialDocuments, fallback, commands, icons, strin
 			chrome: resolvedChrome,
 			icons: icons ?? {},
 			stamps: stamps ?? {},
+			signatures: signatures ?? {},
+			annotations: annotations ?? {},
 			i18n: {
 				locales,
 				loaders,
@@ -4462,6 +5719,12 @@ function FullViewer({ engine, initialDocuments, fallback, commands, icons, strin
 			}
 		} }),
 		(0, _embedpdf_react_form.formPlugin)(),
+		(0, _embedpdf_react_signature.signaturePlugin)({
+			mode: resolved.signatures.mode,
+			signer: resolved.signatures.signer,
+			trust: resolved.signatures.trust,
+			allowCertify: resolved.signatures.allowCertify
+		}),
 		(0, _embedpdf_react_link.linkPlugin)(),
 		(0, _embedpdf_react_redaction.redactionPlugin)(),
 		(0, _embedpdf_react_search.searchPlugin)(),
@@ -4562,6 +5825,12 @@ Object.defineProperty(exports, "ShellToken", {
 		return _embedpdf_react_shell.ShellToken;
 	}
 });
+Object.defineProperty(exports, "SignatureToken", {
+	enumerable: true,
+	get: function() {
+		return _embedpdf_react_signature.SignatureToken;
+	}
+});
 Object.defineProperty(exports, "StageToken", {
 	enumerable: true,
 	get: function() {
@@ -4586,6 +5855,12 @@ Object.defineProperty(exports, "chromeHelpers", {
 		return _embedpdf_react_toolbar.chromeHelpers;
 	}
 });
+Object.defineProperty(exports, "createTestSigner", {
+	enumerable: true,
+	get: function() {
+		return _embedpdf_react_signature.createTestSigner;
+	}
+});
 exports.createViewerHandle = createViewerHandle;
 Object.defineProperty(exports, "custom", {
 	enumerable: true,
@@ -4608,12 +5883,36 @@ Object.defineProperty(exports, "group", {
 		return _embedpdf_react_toolbar.group;
 	}
 });
+Object.defineProperty(exports, "indexedDbKeyStore", {
+	enumerable: true,
+	get: function() {
+		return _embedpdf_react_signature.indexedDbKeyStore;
+	}
+});
 Object.defineProperty(exports, "item", {
 	enumerable: true,
 	get: function() {
 		return _embedpdf_react_toolbar.item;
 	}
 });
+Object.defineProperty(exports, "memoryKeyStore", {
+	enumerable: true,
+	get: function() {
+		return _embedpdf_react_signature.memoryKeyStore;
+	}
+});
+Object.defineProperty(exports, "personalSigner", {
+	enumerable: true,
+	get: function() {
+		return _embedpdf_react_signature.personalSigner;
+	}
+});
+Object.defineProperty(exports, "remoteSigner", {
+	enumerable: true,
+	get: function() {
+		return _embedpdf_react_signature.remoteSigner;
+	}
+});
 Object.defineProperty(exports, "removeItems", {
 	enumerable: true,
 	get: function() {
@@ -4633,5 +5932,11 @@ Object.defineProperty(exports, "validateChrome", {
 		return _embedpdf_react_toolbar.validateChrome;
 	}
 });
+Object.defineProperty(exports, "webCryptoSigner", {
+	enumerable: true,
+	get: function() {
+		return _embedpdf_react_signature.webCryptoSigner;
+	}
+});
 
 //# sourceMappingURL=index.cjs.map