superdoc 2.18.1-next.5 → 2.19.0-next.1

package/dist/chunks/{create-super-doc-ui-C3HDE1IE.es.js → create-super-doc-ui-BFJ9Y0YV.cjs}

@@ -1,3 +1,5 @@
+const require__plugin_vue_export_helper = require("./_plugin-vue_export-helper-SDR04tiH.cjs");
+let vue = require("vue");
 //#region src/internal/diagnostics/interaction-history.ts
 var recorders = /* @__PURE__ */ new WeakMap();
 var nextSession = 0;
@@ -534,6 +536,1311 @@ function shallowEqual(a, b) {
 	return true;
 }
 //#endregion
+//#region src/internal/toolbar/image-upload.js
+/**
+* Interactive image acquisition for the built-in toolbar (SD-3567).
+*
+* The toolbar image button routes through the shared controller command
+* `image` → `create.image`, which requires a base64 PNG/JPEG data-URI `src`.
+* This module owns the browser file picker and the File → data-URI
+* conversion; the toolbar dispatches the resulting payload through the
+* normal controller command path.
+*/
+/** Accept filter for the picker: PNG and JPEG only (V1 parity; OOXML-native formats). */
+var IMAGE_PICKER_ACCEPT = ".png,.jpg,.jpeg,image/png,image/jpeg";
+var SUPPORTED_IMAGE_MIME_TYPES = /* @__PURE__ */ new Set([
+	"image/png",
+	"image/jpeg",
+	"image/jpg"
+]);
+var SUPPORTED_IMAGE_EXTENSIONS = /\.(png|jpe?g)$/i;
+/**
+* Whether a picked/dropped file is an insertable image (PNG/JPEG). Falls back
+* to the file extension when the browser reports no MIME type.
+* @param {File | null | undefined} file
+* @returns {boolean}
+*/
+function isSupportedImageFile(file) {
+	if (!file) return false;
+	const type = typeof file.type === "string" ? file.type.toLowerCase() : "";
+	if (type) return SUPPORTED_IMAGE_MIME_TYPES.has(type);
+	return SUPPORTED_IMAGE_EXTENSIONS.test(String(file.name ?? ""));
+}
+/**
+* Read a File/Blob into a base64 data URI.
+*
+* Some browsers/OSes deliver picked files with an empty `type`; the picker
+* accepts those by extension, but `readAsDataURL` would then produce an
+* `application/octet-stream` data URI that `create.image` rejects. Rewrite
+* the media type from the filename so extension-accepted files still insert.
+* @param {Blob & { name?: string }} file
+* @returns {Promise<string>}
+*/
+function fileToDataUri(file) {
+	return new Promise((resolve, reject) => {
+		const reader = new FileReader();
+		reader.onload = () => resolve(normalizeImageDataUri(String(reader.result), file));
+		reader.onerror = () => reject(reader.error ?? /* @__PURE__ */ new Error("image-read-failed"));
+		reader.readAsDataURL(file);
+	});
+}
+/**
+* Ensure a data URI read from a supported file carries a PNG/JPEG media type.
+* Leaves URIs already typed as a supported image (or uninferable ones) alone.
+* @param {string} dataUri
+* @param {(Blob & { name?: string }) | null | undefined} file
+* @returns {string}
+*/
+function normalizeImageDataUri(dataUri, file) {
+	const match = /^data:([^;,]*);base64,/.exec(dataUri);
+	if (!match) return dataUri;
+	const mime = match[1].toLowerCase();
+	if (SUPPORTED_IMAGE_MIME_TYPES.has(mime)) return dataUri;
+	const name = String(file?.name ?? "");
+	const inferred = /\.jpe?g$/i.test(name) ? "image/jpeg" : /\.png$/i.test(name) ? "image/png" : null;
+	if (!inferred) return dataUri;
+	return `data:${inferred};base64,${dataUri.slice(match[0].length)}`;
+}
+/**
+* Resolve the `create.image` src for a picked file. Uses the consumer's
+* `handleImageUpload` callback when configured (V1 contract:
+* `(file: File) => Promise<string>`). A returned non-data URL is fetched and
+* embedded, because `create.image` requires an embedded base64 data URI.
+* @param {File} file
+* @param {((file: File) => Promise<string>) | null | undefined} handleImageUpload
+* @returns {Promise<string>}
+*/
+async function resolveImageSrc(file, handleImageUpload) {
+	if (typeof handleImageUpload === "function") {
+		const result = await handleImageUpload(file);
+		if (typeof result !== "string" || result.trim() === "") throw new Error("handleImageUpload returned an empty result");
+		if (result.startsWith("data:")) return result;
+		return embedRemoteImage(result, file);
+	}
+	return fileToDataUri(file);
+}
+/**
+* Fetch a remote image URL and embed it as a data URI. Object-store /
+* presigned URLs often respond `application/octet-stream`, so keep a filename
+* hint (URL path, falling back to the originally picked file) for the media
+* type normalization in `fileToDataUri`.
+* @param {string} url
+* @param {File | null | undefined} pickedFile
+* @returns {Promise<string>}
+*/
+async function embedRemoteImage(url, pickedFile) {
+	const response = await fetch(url);
+	if (!response.ok) throw new Error(`image fetch failed: ${response.status}`);
+	const blob = await response.blob();
+	const name = (/\.(?:png|jpe?g)(?:$|[?#])/i.test(url) ? url.split(/[?#]/)[0] : "") || pickedFile?.name || "";
+	return fileToDataUri(name ? Object.assign(blob, { name }) : blob);
+}
+/**
+* Hidden `<input type=file>` picker bound to one toolbar instance. The input
+* stays attached (hidden) so automation and tests can drive it; `destroy()`
+* removes it. Picking a file calls `onPick(file)`; an unsupported type or a
+* failed pick routes through `onError(error)`.
+*
+* @param {{
+*   ownerDocument?: Document,
+*   onPick?: (file: File) => unknown,
+*   onError?: (error: Error) => void,
+* }} options
+* @returns {{ input: HTMLInputElement, open: () => void, destroy: () => void }}
+*/
+function createImageFilePicker({ ownerDocument = document, onPick, onError } = {}) {
+	const input = ownerDocument.createElement("input");
+	input.type = "file";
+	input.accept = IMAGE_PICKER_ACCEPT;
+	input.hidden = true;
+	input.tabIndex = -1;
+	input.setAttribute("data-superdoc-image-picker", "true");
+	input.setAttribute("aria-hidden", "true");
+	input.addEventListener("change", () => {
+		const file = input.files && input.files[0];
+		input.value = "";
+		if (!file) return;
+		if (!isSupportedImageFile(file)) {
+			onError?.(/* @__PURE__ */ new Error(`unsupported image type: ${file.type || file.name}`));
+			return;
+		}
+		try {
+			const result = onPick?.(file);
+			if (result && typeof result.then === "function") result.catch((error) => onError?.(error));
+		} catch (error) {
+			onError?.(error);
+		}
+	});
+	ownerDocument.body?.appendChild(input);
+	return {
+		input,
+		open() {
+			input.click();
+		},
+		destroy() {
+			input.remove();
+		}
+	};
+}
+//#endregion
+//#region src/components/surfaces/WatermarkSurface.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "sd-watermark__body" };
+var _hoisted_2 = { class: "sd-watermark__settings" };
+var _hoisted_3 = ["disabled"];
+var _hoisted_4 = { class: "sd-watermark__field" };
+var _hoisted_5 = ["value"];
+var _hoisted_6 = ["value"];
+var _hoisted_7 = { class: "sd-watermark__field" };
+var _hoisted_8 = ["value"];
+var _hoisted_9 = ["disabled"];
+var _hoisted_10 = { class: "sd-watermark__selection-list" };
+var _hoisted_11 = [
+	"value",
+	"checked",
+	"onChange"
+];
+var _hoisted_12 = ["disabled"];
+var _hoisted_13 = {
+	key: 0,
+	class: "sd-watermark__notice"
+};
+var _hoisted_14 = {
+	key: 1,
+	class: "sd-watermark__notice"
+};
+var _hoisted_15 = ["disabled"];
+var _hoisted_16 = { class: "sd-watermark__types" };
+var _hoisted_17 = [
+	"name",
+	"value",
+	"checked",
+	"onChange"
+];
+var _hoisted_18 = { class: "sd-watermark__field" };
+var _hoisted_19 = ["value"];
+var _hoisted_20 = {
+	class: "sd-watermark__presets",
+	"aria-label": "Text presets"
+};
+var _hoisted_21 = ["onClick"];
+var _hoisted_22 = { class: "sd-watermark__font-row" };
+var _hoisted_23 = { class: "sd-watermark__field" };
+var _hoisted_24 = ["value"];
+var _hoisted_25 = ["value"];
+var _hoisted_26 = { class: "sd-watermark__field sd-watermark__size" };
+var _hoisted_27 = ["list", "value"];
+var _hoisted_28 = ["id"];
+var _hoisted_29 = ["value"];
+var _hoisted_30 = { class: "sd-watermark__styles" };
+var _hoisted_31 = ["aria-pressed"];
+var _hoisted_32 = ["aria-pressed"];
+var _hoisted_33 = { class: "sd-watermark__field sd-watermark__font-color" };
+var _hoisted_34 = { class: "sd-watermark__color" };
+var _hoisted_35 = ["value"];
+var _hoisted_36 = ["value"];
+var _hoisted_37 = { class: "sd-watermark__picture" };
+var _hoisted_38 = ["src"];
+var _hoisted_39 = ["accept"];
+var _hoisted_40 = { class: "sd-watermark__field" };
+var _hoisted_41 = ["value"];
+var _hoisted_42 = {
+	key: 0,
+	value: "custom",
+	disabled: ""
+};
+var _hoisted_43 = ["value"];
+var _hoisted_44 = { class: "sd-watermark__check" };
+var _hoisted_45 = ["checked"];
+var _hoisted_46 = { class: "sd-watermark__check" };
+var _hoisted_47 = ["checked"];
+var _hoisted_48 = {
+	key: 2,
+	class: "sd-watermark__field sd-watermark__transparency"
+};
+var _hoisted_49 = ["for"];
+var _hoisted_50 = { class: "sd-watermark__range" };
+var _hoisted_51 = ["id", "value"];
+var _hoisted_52 = ["value"];
+var _hoisted_53 = {
+	key: 3,
+	class: "sd-watermark__orientation"
+};
+var _hoisted_54 = [
+	"name",
+	"value",
+	"checked",
+	"onChange"
+];
+var _hoisted_55 = {
+	key: 4,
+	class: "sd-watermark__notice"
+};
+var _hoisted_56 = {
+	key: 5,
+	class: "sd-watermark__notice"
+};
+var _hoisted_57 = ["aria-busy"];
+var _hoisted_58 = { class: "sd-watermark__page" };
+var _hoisted_59 = [
+	"src",
+	"width",
+	"height"
+];
+var _hoisted_60 = { key: 1 };
+var _hoisted_61 = { class: "sd-watermark__impact" };
+var _hoisted_62 = {
+	key: 0,
+	class: "sd-watermark__impact-details"
+};
+var _hoisted_63 = {
+	key: 0,
+	class: "sd-watermark__error",
+	role: "alert"
+};
+var _hoisted_64 = ["disabled"];
+var _hoisted_65 = { class: "sd-watermark__footer sd-dialog-footer" };
+var _hoisted_66 = {
+	role: "status",
+	"aria-live": "polite"
+};
+var _hoisted_67 = { class: "sd-watermark__actions" };
+var _hoisted_68 = ["disabled"];
+var WatermarkSurface_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "WatermarkSurface",
+	props: {
+		model: {},
+		surfaceId: { default: "" },
+		mode: {},
+		request: {},
+		resolve: {},
+		close: {
+			type: Function,
+			default: () => {}
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const snapshot = (0, vue.shallowRef)(props.model.getSnapshot());
+		const fileInput = (0, vue.ref)(null);
+		const filePending = (0, vue.ref)(false);
+		const localError = (0, vue.ref)("");
+		let fileGeneration = 0;
+		let unsubscribe;
+		const presets = [
+			"DRAFT",
+			"CONFIDENTIAL",
+			"DO NOT COPY"
+		];
+		const types = [
+			{
+				value: "none",
+				label: "No watermark"
+			},
+			{
+				value: "text",
+				label: "Text"
+			},
+			{
+				value: "picture",
+				label: "Picture"
+			}
+		];
+		const busy = (0, vue.computed)(() => snapshot.value.phase === "loading" || snapshot.value.phase === "applying");
+		const editable = (0, vue.computed)(() => !busy.value && !snapshot.value.readonlyReason);
+		const canApply = (0, vue.computed)(() => snapshot.value.canApply && !busy.value && !filePending.value && !snapshot.value.stale);
+		const error = (0, vue.computed)(() => localError.value || snapshot.value.error);
+		const status = (0, vue.computed)(() => {
+			if (filePending.value) return "Preparing picture…";
+			if (snapshot.value.phase === "loading") return "Loading watermarks…";
+			if (snapshot.value.phase === "applying") return "Applying changes; closing will not cancel them.";
+			if (snapshot.value.phase === "previewing") return "Updating preview…";
+			return snapshot.value.dirty ? "Changes apply when you choose Apply" : "No changes";
+		});
+		const fontOptions = (0, vue.computed)(() => {
+			const { fonts, draft } = snapshot.value;
+			return fonts.some((font) => font.value === draft.fontFamily) ? fonts : [{
+				value: draft.fontFamily,
+				label: draft.fontFamily
+			}, ...fonts];
+		});
+		function cancelPreparation() {
+			fileGeneration += 1;
+			filePending.value = false;
+		}
+		function patch(patch) {
+			if (!editable.value) return;
+			localError.value = "";
+			props.model.patchDraft(patch);
+		}
+		function changeScope(event, field) {
+			const value = event.target.value;
+			cancelPreparation();
+			props.model.setScope(field === "section" ? value || null : snapshot.value.sectionId, field === "variant" ? value : snapshot.value.variant);
+		}
+		function selectWatermark(id, event) {
+			cancelPreparation();
+			const selected = new Set(snapshot.value.selectedIds);
+			if (event.target.checked) selected.add(id);
+			else selected.delete(id);
+			props.model.selectWatermarks([...selected]);
+		}
+		async function choosePicture(event) {
+			const input = event.target;
+			const file = input.files?.[0];
+			input.value = "";
+			if (!file || !editable.value) return;
+			cancelPreparation();
+			localError.value = "";
+			if (!isSupportedImageFile(file)) {
+				localError.value = "Choose a PNG or JPEG picture.";
+				return;
+			}
+			const generation = fileGeneration;
+			filePending.value = true;
+			try {
+				const src = await fileToDataUri(file);
+				if (generation !== fileGeneration) return;
+				patch({
+					src,
+					pictureName: file.name,
+					kind: "picture"
+				});
+			} catch {
+				if (generation === fileGeneration) localError.value = "The picture could not be read. Choose it again.";
+			} finally {
+				if (generation === fileGeneration) filePending.value = false;
+			}
+		}
+		async function apply() {
+			if (!canApply.value) return;
+			try {
+				await props.model.apply();
+			} catch {
+				localError.value = "The watermark could not be applied. Try again.";
+			}
+		}
+		async function reload() {
+			cancelPreparation();
+			localError.value = "";
+			try {
+				await props.model.reload();
+			} catch {
+				localError.value = "Watermarks could not be loaded. Try again.";
+			}
+		}
+		function close() {
+			cancelPreparation();
+			props.close("user-cancelled");
+		}
+		(0, vue.watch)([
+			() => snapshot.value.draft.kind,
+			() => snapshot.value.sectionId,
+			() => snapshot.value.variant,
+			() => snapshot.value.selectedIds.join("\0")
+		], cancelPreparation);
+		(0, vue.onMounted)(() => {
+			unsubscribe = props.model.subscribe((value) => {
+				snapshot.value = value;
+			});
+			snapshot.value = props.model.getSnapshot();
+		});
+		(0, vue.onBeforeUnmount)(() => {
+			cancelPreparation();
+			unsubscribe?.();
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("form", {
+				class: "sd-watermark sd-dialog-content",
+				onSubmit: (0, vue.withModifiers)(apply, ["prevent"])
+			}, [
+				(0, vue.createElementVNode)("header", { class: "sd-watermark__header sd-dialog-header" }, [_cache[17] || (_cache[17] = (0, vue.createElementVNode)("h2", null, "Watermark", -1)), (0, vue.createElementVNode)("button", {
+					type: "button",
+					class: "sd-dialog-close",
+					"aria-label": "Close watermark dialog",
+					onClick: close
+				}, [..._cache[16] || (_cache[16] = [(0, vue.createElementVNode)("svg", {
+					width: "16",
+					height: "16",
+					viewBox: "0 0 16 16",
+					"aria-hidden": "true"
+				}, [(0, vue.createElementVNode)("path", {
+					d: "m4 4 8 8m0-8-8 8",
+					fill: "none",
+					stroke: "currentColor",
+					"stroke-width": "1.5",
+					"stroke-linecap": "round"
+				})], -1)])])]),
+				(0, vue.createElementVNode)("div", _hoisted_1, [(0, vue.createElementVNode)("div", _hoisted_2, [
+					(0, vue.createElementVNode)("fieldset", {
+						class: "sd-watermark__scope",
+						disabled: busy.value
+					}, [
+						_cache[22] || (_cache[22] = (0, vue.createElementVNode)("legend", { class: "sd-watermark__sr-only" }, "Watermark scope", -1)),
+						(0, vue.createElementVNode)("label", _hoisted_4, [_cache[19] || (_cache[19] = (0, vue.createElementVNode)("span", null, "Apply to", -1)), (0, vue.createElementVNode)("select", {
+							"aria-label": "Apply to",
+							value: snapshot.value.sectionId ?? "",
+							onChange: _cache[0] || (_cache[0] = ($event) => changeScope($event, "section"))
+						}, [_cache[18] || (_cache[18] = (0, vue.createElementVNode)("option", { value: "" }, "Entire document", -1)), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(snapshot.value.sections, (section) => {
+							return (0, vue.openBlock)(), (0, vue.createElementBlock)("option", {
+								key: section.id,
+								value: section.id
+							}, (0, vue.toDisplayString)(section.label), 9, _hoisted_6);
+						}), 128))], 40, _hoisted_5)]),
+						(0, vue.createElementVNode)("label", _hoisted_7, [_cache[21] || (_cache[21] = (0, vue.createElementVNode)("span", null, "Page type", -1)), (0, vue.createElementVNode)("select", {
+							"aria-label": "Page type",
+							value: snapshot.value.variant,
+							onChange: _cache[1] || (_cache[1] = ($event) => changeScope($event, "variant"))
+						}, [..._cache[20] || (_cache[20] = [
+							(0, vue.createElementVNode)("option", { value: "all" }, "All applicable", -1),
+							(0, vue.createElementVNode)("option", { value: "default" }, "Default", -1),
+							(0, vue.createElementVNode)("option", { value: "first" }, "First", -1),
+							(0, vue.createElementVNode)("option", { value: "even" }, "Even", -1)
+						])], 40, _hoisted_8)])
+					], 8, _hoisted_3),
+					snapshot.value.items.length > 1 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("fieldset", {
+						key: 0,
+						class: "sd-watermark__selection",
+						disabled: busy.value
+					}, [
+						_cache[23] || (_cache[23] = (0, vue.createElementVNode)("legend", null, "Watermarks to edit", -1)),
+						(0, vue.createElementVNode)("div", _hoisted_10, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(snapshot.value.items, (item) => {
+							return (0, vue.openBlock)(), (0, vue.createElementBlock)("label", {
+								key: item.id,
+								class: "sd-watermark__check"
+							}, [(0, vue.createElementVNode)("input", {
+								type: "checkbox",
+								value: item.id,
+								checked: snapshot.value.selectedIds.includes(item.id),
+								onChange: ($event) => selectWatermark(item.id, $event)
+							}, null, 40, _hoisted_11), (0, vue.createElementVNode)("span", null, [(0, vue.createTextVNode)((0, vue.toDisplayString)(item.label), 1), (0, vue.createElementVNode)("small", null, (0, vue.toDisplayString)(item.locations), 1)])]);
+						}), 128))]),
+						(0, vue.createElementVNode)("button", {
+							type: "button",
+							disabled: !editable.value,
+							onClick: _cache[2] || (_cache[2] = ($event) => __props.model.selectWatermarks([]))
+						}, "Add watermark", 8, _hoisted_12),
+						snapshot.value.selectedIds.length > 1 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("p", _hoisted_13, " Applying uses the settings below for all " + (0, vue.toDisplayString)(snapshot.value.selectedIds.length) + " selected copies. ", 1)) : (0, vue.createCommentVNode)("", true)
+					], 8, _hoisted_9)) : (0, vue.createCommentVNode)("", true),
+					snapshot.value.readonlyReason ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("p", _hoisted_14, (0, vue.toDisplayString)(snapshot.value.readonlyReason), 1)) : (0, vue.createCommentVNode)("", true),
+					(0, vue.createElementVNode)("fieldset", {
+						class: (0, vue.normalizeClass)(["sd-watermark__draft", { "sd-watermark__draft--text": snapshot.value.draft.kind === "text" }]),
+						disabled: !editable.value
+					}, [
+						_cache[40] || (_cache[40] = (0, vue.createElementVNode)("legend", { class: "sd-watermark__sr-only" }, "Watermark settings", -1)),
+						(0, vue.createElementVNode)("fieldset", _hoisted_16, [_cache[24] || (_cache[24] = (0, vue.createElementVNode)("legend", { class: "sd-watermark__sr-only" }, "Watermark type", -1)), ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(types, (type) => {
+							return (0, vue.createElementVNode)("label", {
+								key: type.value,
+								class: (0, vue.normalizeClass)({ "is-selected": snapshot.value.draft.kind === type.value })
+							}, [(0, vue.createElementVNode)("input", {
+								type: "radio",
+								name: `watermark-type-${__props.surfaceId}`,
+								value: type.value,
+								checked: snapshot.value.draft.kind === type.value,
+								onChange: ($event) => patch({ kind: type.value })
+							}, null, 40, _hoisted_17), (0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(type.value === "none" && snapshot.value.items.length > 1 && snapshot.value.selectedIds.length ? "Remove selected" : type.label), 1)], 2);
+						}), 64))]),
+						snapshot.value.draft.kind === "text" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [
+							(0, vue.createElementVNode)("label", _hoisted_18, [_cache[25] || (_cache[25] = (0, vue.createElementVNode)("span", null, "Text", -1)), (0, vue.createElementVNode)("input", {
+								"aria-label": "Watermark text",
+								type: "text",
+								value: snapshot.value.draft.text,
+								onInput: _cache[3] || (_cache[3] = ($event) => patch({ text: $event.target.value }))
+							}, null, 40, _hoisted_19)]),
+							(0, vue.createElementVNode)("div", _hoisted_20, [((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(presets, (preset) => {
+								return (0, vue.createElementVNode)("button", {
+									key: preset,
+									type: "button",
+									onClick: ($event) => patch({ text: preset })
+								}, (0, vue.toDisplayString)(preset), 9, _hoisted_21);
+							}), 64))]),
+							(0, vue.createElementVNode)("div", _hoisted_22, [
+								(0, vue.createElementVNode)("label", _hoisted_23, [_cache[26] || (_cache[26] = (0, vue.createElementVNode)("span", null, "Font", -1)), (0, vue.createElementVNode)("select", {
+									"aria-label": "Font",
+									value: snapshot.value.draft.fontFamily,
+									onChange: _cache[4] || (_cache[4] = ($event) => patch({ fontFamily: $event.target.value }))
+								}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(fontOptions.value, (font) => {
+									return (0, vue.openBlock)(), (0, vue.createElementBlock)("option", {
+										key: font.value,
+										value: font.value
+									}, (0, vue.toDisplayString)(font.label), 9, _hoisted_25);
+								}), 128))], 40, _hoisted_24)]),
+								(0, vue.createElementVNode)("label", _hoisted_26, [
+									_cache[28] || (_cache[28] = (0, vue.createElementVNode)("span", null, "Size (pt)", -1)),
+									(0, vue.createElementVNode)("input", {
+										"aria-label": "Font size",
+										list: `watermark-sizes-${__props.surfaceId}`,
+										value: snapshot.value.draft.fontSize === "auto" ? "Auto" : snapshot.value.draft.fontSize,
+										onChange: _cache[5] || (_cache[5] = ($event) => patch({ fontSize: $event.target.value.toLowerCase() === "auto" ? "auto" : Number($event.target.value) }))
+									}, null, 40, _hoisted_27),
+									(0, vue.createElementVNode)("datalist", { id: `watermark-sizes-${__props.surfaceId}` }, [_cache[27] || (_cache[27] = (0, vue.createElementVNode)("option", { value: "Auto" }, null, -1)), ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)([
+										24,
+										36,
+										48,
+										72,
+										96
+									], (size) => {
+										return (0, vue.createElementVNode)("option", {
+											key: size,
+											value: size
+										}, null, 8, _hoisted_29);
+									}), 64))], 8, _hoisted_28)
+								]),
+								(0, vue.createElementVNode)("div", _hoisted_30, [(0, vue.createElementVNode)("button", {
+									type: "button",
+									"aria-label": "Bold",
+									"aria-pressed": snapshot.value.draft.bold,
+									onClick: _cache[6] || (_cache[6] = ($event) => patch({ bold: !snapshot.value.draft.bold }))
+								}, [..._cache[29] || (_cache[29] = [(0, vue.createElementVNode)("b", null, "B", -1)])], 8, _hoisted_31), (0, vue.createElementVNode)("button", {
+									type: "button",
+									"aria-label": "Italic",
+									"aria-pressed": snapshot.value.draft.italic,
+									onClick: _cache[7] || (_cache[7] = ($event) => patch({ italic: !snapshot.value.draft.italic }))
+								}, [..._cache[30] || (_cache[30] = [(0, vue.createElementVNode)("i", null, "I", -1)])], 8, _hoisted_32)])
+							]),
+							(0, vue.createElementVNode)("label", _hoisted_33, [_cache[31] || (_cache[31] = (0, vue.createElementVNode)("span", null, "Font color", -1)), (0, vue.createElementVNode)("span", _hoisted_34, [(0, vue.createElementVNode)("input", {
+								type: "color",
+								"aria-label": "Choose font color",
+								value: snapshot.value.draft.color,
+								onInput: _cache[8] || (_cache[8] = ($event) => patch({ color: $event.target.value }))
+							}, null, 40, _hoisted_35), (0, vue.createElementVNode)("input", {
+								type: "text",
+								"aria-label": "Font color",
+								value: snapshot.value.draft.color,
+								spellcheck: "false",
+								onInput: _cache[9] || (_cache[9] = ($event) => patch({ color: $event.target.value }))
+							}, null, 40, _hoisted_36)])])
+						], 64)) : (0, vue.createCommentVNode)("", true),
+						snapshot.value.draft.kind === "picture" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [
+							(0, vue.createElementVNode)("div", _hoisted_37, [
+								snapshot.value.draft.src ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("img", {
+									key: 0,
+									src: snapshot.value.draft.src,
+									alt: "Selected picture"
+								}, null, 8, _hoisted_38)) : (0, vue.createCommentVNode)("", true),
+								(0, vue.createElementVNode)("div", null, [(0, vue.createElementVNode)("strong", null, (0, vue.toDisplayString)(snapshot.value.draft.pictureName || "No picture selected"), 1), _cache[32] || (_cache[32] = (0, vue.createElementVNode)("small", null, "PNG or JPEG", -1))]),
+								(0, vue.createElementVNode)("button", {
+									type: "button",
+									onClick: _cache[10] || (_cache[10] = ($event) => fileInput.value?.click())
+								}, (0, vue.toDisplayString)(snapshot.value.draft.pictureName ? "Replace picture" : "Choose picture"), 1),
+								(0, vue.createElementVNode)("input", {
+									ref_key: "fileInput",
+									ref: fileInput,
+									type: "file",
+									accept: (0, vue.unref)(IMAGE_PICKER_ACCEPT),
+									"aria-label": "Choose watermark picture",
+									hidden: "",
+									onChange: choosePicture
+								}, null, 40, _hoisted_39)
+							]),
+							(0, vue.createElementVNode)("label", _hoisted_40, [_cache[34] || (_cache[34] = (0, vue.createElementVNode)("span", null, "Scale", -1)), (0, vue.createElementVNode)("select", {
+								"aria-label": "Picture scale",
+								value: snapshot.value.draft.customSize ? "custom" : snapshot.value.draft.scalePercent,
+								onChange: _cache[11] || (_cache[11] = ($event) => patch({ scalePercent: $event.target.value === "auto" ? "auto" : Number($event.target.value) }))
+							}, [
+								snapshot.value.draft.customSize ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("option", _hoisted_42, "Custom size retained")) : (0, vue.createCommentVNode)("", true),
+								_cache[33] || (_cache[33] = (0, vue.createElementVNode)("option", { value: "auto" }, "Auto", -1)),
+								((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)([
+									50,
+									100,
+									150,
+									200,
+									500
+								], (scale) => {
+									return (0, vue.createElementVNode)("option", {
+										key: scale,
+										value: scale
+									}, (0, vue.toDisplayString)(scale) + "%", 9, _hoisted_43);
+								}), 64))
+							], 40, _hoisted_41)]),
+							(0, vue.createElementVNode)("label", _hoisted_44, [(0, vue.createElementVNode)("input", {
+								type: "checkbox",
+								checked: snapshot.value.draft.lockAspectRatio,
+								onChange: _cache[12] || (_cache[12] = ($event) => patch({ lockAspectRatio: $event.target.checked }))
+							}, null, 40, _hoisted_45), _cache[35] || (_cache[35] = (0, vue.createElementVNode)("span", null, "Preserve aspect ratio", -1))]),
+							(0, vue.createElementVNode)("label", _hoisted_46, [(0, vue.createElementVNode)("input", {
+								type: "checkbox",
+								checked: snapshot.value.draft.washout,
+								onChange: _cache[13] || (_cache[13] = ($event) => patch({ washout: $event.target.checked }))
+							}, null, 40, _hoisted_47), _cache[36] || (_cache[36] = (0, vue.createElementVNode)("span", null, [(0, vue.createTextVNode)("Washout"), (0, vue.createElementVNode)("small", null, "Lighten the picture's colors.")], -1))])
+						], 64)) : (0, vue.createCommentVNode)("", true),
+						snapshot.value.draft.kind !== "none" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_48, [
+							(0, vue.createElementVNode)("label", { for: `watermark-transparency-${__props.surfaceId}` }, "Transparency", 8, _hoisted_49),
+							(0, vue.createElementVNode)("div", _hoisted_50, [(0, vue.createElementVNode)("input", {
+								id: `watermark-transparency-${__props.surfaceId}`,
+								type: "range",
+								min: "0",
+								max: "100",
+								step: "1",
+								"aria-label": "Transparency",
+								value: snapshot.value.draft.transparency,
+								onInput: _cache[14] || (_cache[14] = ($event) => patch({ transparency: Number($event.target.value) }))
+							}, null, 40, _hoisted_51), (0, vue.createElementVNode)("label", null, [(0, vue.createElementVNode)("input", {
+								type: "number",
+								min: "0",
+								max: "100",
+								step: "any",
+								"aria-label": "Transparency percentage",
+								value: snapshot.value.draft.transparency,
+								onInput: _cache[15] || (_cache[15] = ($event) => patch({ transparency: Number($event.target.value) }))
+							}, null, 40, _hoisted_52), _cache[37] || (_cache[37] = (0, vue.createElementVNode)("span", null, "%", -1))])]),
+							_cache[38] || (_cache[38] = (0, vue.createElementVNode)("small", null, "0% opaque, 100% transparent", -1))
+						])) : (0, vue.createCommentVNode)("", true),
+						snapshot.value.draft.kind !== "none" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("fieldset", _hoisted_53, [_cache[39] || (_cache[39] = (0, vue.createElementVNode)("legend", null, "Orientation", -1)), ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(["horizontal", "diagonal"], (orientation) => {
+							return (0, vue.createElementVNode)("label", { key: orientation }, [(0, vue.createElementVNode)("input", {
+								type: "radio",
+								name: `watermark-orientation-${__props.surfaceId}`,
+								value: orientation,
+								checked: !snapshot.value.draft.customOrientation && snapshot.value.draft.orientation === orientation,
+								onChange: ($event) => patch({ orientation })
+							}, null, 40, _hoisted_54), (0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(orientation === "horizontal" ? "Horizontal" : "Diagonal"), 1)]);
+						}), 64))])) : (0, vue.createCommentVNode)("", true),
+						snapshot.value.draft.customPlacement ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("p", _hoisted_55, "Custom placement retained.")) : (0, vue.createCommentVNode)("", true),
+						snapshot.value.draft.kind === "none" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("p", _hoisted_56, (0, vue.toDisplayString)(snapshot.value.selectedIds.length ? "The selected watermark will be removed when you apply." : "Choose Text or Picture to add a watermark."), 1)) : (0, vue.createCommentVNode)("", true)
+					], 10, _hoisted_15)
+				]), (0, vue.createElementVNode)("aside", {
+					class: "sd-watermark__preview",
+					"aria-label": "Watermark preview",
+					"aria-busy": snapshot.value.phase === "previewing"
+				}, [
+					_cache[41] || (_cache[41] = (0, vue.createElementVNode)("h3", null, "Preview", -1)),
+					(0, vue.createElementVNode)("div", _hoisted_58, [snapshot.value.preview ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("img", {
+						key: 0,
+						src: snapshot.value.preview.url,
+						width: snapshot.value.preview.width,
+						height: snapshot.value.preview.height,
+						alt: "Watermark on a sample page"
+					}, null, 8, _hoisted_59)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("p", _hoisted_60, (0, vue.toDisplayString)(snapshot.value.phase === "loading" || snapshot.value.phase === "previewing" ? "Preparing preview…" : snapshot.value.draft.kind === "none" ? "No watermark in this preview" : "Preview unavailable"), 1))]),
+					_cache[42] || (_cache[42] = (0, vue.createElementVNode)("p", { class: "sd-watermark__caption" }, "Preview at the selected page size", -1)),
+					(0, vue.createElementVNode)("p", _hoisted_61, (0, vue.toDisplayString)(snapshot.value.impact), 1),
+					snapshot.value.impactDetails?.length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("details", _hoisted_62, [(0, vue.createElementVNode)("summary", null, "View " + (0, vue.toDisplayString)(snapshot.value.impactDetails.length) + " affected locations", 1), (0, vue.createElementVNode)("ul", null, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(snapshot.value.impactDetails, (location) => {
+						return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", { key: location }, (0, vue.toDisplayString)(location), 1);
+					}), 128))])])) : (0, vue.createCommentVNode)("", true)
+				], 8, _hoisted_57)]),
+				error.value || snapshot.value.stale ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_63, [(0, vue.createElementVNode)("p", null, (0, vue.toDisplayString)(error.value || "The document changed. Review the latest state before applying."), 1), snapshot.value.stale || snapshot.value.error ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
+					key: 0,
+					type: "button",
+					disabled: busy.value,
+					onClick: reload
+				}, " Review latest state ", 8, _hoisted_64)) : (0, vue.createCommentVNode)("", true)])) : (0, vue.createCommentVNode)("", true),
+				(0, vue.createElementVNode)("footer", _hoisted_65, [(0, vue.createElementVNode)("p", _hoisted_66, (0, vue.toDisplayString)(status.value), 1), (0, vue.createElementVNode)("div", _hoisted_67, [(0, vue.createElementVNode)("button", {
+					type: "button",
+					class: "sd-dialog-secondary",
+					onClick: close
+				}, "Cancel"), (0, vue.createElementVNode)("button", {
+					type: "submit",
+					class: "sd-watermark__apply sd-dialog-primary",
+					disabled: !canApply.value
+				}, (0, vue.toDisplayString)(snapshot.value.phase === "applying" ? "Applying…" : snapshot.value.draft.kind === "none" ? snapshot.value.items.length > 1 ? "Remove selected watermark" : "Remove watermark" : "Apply watermark"), 9, _hoisted_68)])])
+			], 32);
+		};
+	}
+});
+//#endregion
+//#region src/components/surfaces/WatermarkSurface.vue
+var WatermarkSurface_default = /* @__PURE__ */ require__plugin_vue_export_helper._plugin_vue_export_helper_default(WatermarkSurface_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-df56c82c"]]);
+//#endregion
+//#region src/components/surfaces/watermark-surface-runtime.js
+/**
+* Keeps Vue rendering and post-dismissal announcements outside the public type graph.
+* @param {(() => HTMLElement | null) | undefined} getContainer
+*/
+function createWatermarkSurfaceRuntime(getContainer) {
+	/** @type {HTMLDivElement | null} */
+	let status = null;
+	let disposed = false;
+	return {
+		component: WatermarkSurface_default,
+		captureFocusReturn() {
+			const document = getContainer?.()?.ownerDocument;
+			const opener = document?.activeElement;
+			const item = opener?.closest("[data-sd-part=\"toolbar-item\"]") ?? opener?.querySelector("[data-sd-part=\"toolbar-item\"]");
+			const container = (item?.closest("[data-sd-part=\"toolbar\"]"))?.parentElement;
+			const isWatermarkEntry = item?.querySelector("[data-item=\"btn-watermark\"], [data-item=\"btn-overflow\"]");
+			/** @param {() => boolean} isCurrent */
+			return async (isCurrent) => {
+				await (0, vue.nextTick)();
+				if (disposed || !isCurrent() || !isWatermarkEntry || opener?.isConnected || !container?.isConnected) return;
+				if (document?.activeElement !== document?.body) return;
+				const currentToolbar = container.querySelector("[data-sd-part=\"toolbar\"]");
+				for (const name of ["watermark", "overflow"]) {
+					const target = currentToolbar?.querySelector(`[data-item="btn-${name}"]`)?.closest("[data-sd-part=\"toolbar-item\"]");
+					if (target instanceof HTMLElement && target.getClientRects().length && target.getAttribute("aria-disabled") !== "true") {
+						target.focus({ preventScroll: true });
+						return;
+					}
+				}
+			};
+		},
+		mount() {
+			const container = getContainer?.();
+			if (disposed || status || !container?.ownerDocument) return;
+			status = container.ownerDocument.createElement("div");
+			status.setAttribute("role", "status");
+			status.setAttribute("aria-live", "polite");
+			status.setAttribute("aria-atomic", "true");
+			Object.assign(status.style, {
+				position: "absolute",
+				width: "1px",
+				height: "1px",
+				overflow: "hidden",
+				clipPath: "inset(50%)",
+				whiteSpace: "nowrap"
+			});
+			container.appendChild(status);
+		},
+		/** @param {string} message */
+		announce(message) {
+			if (!disposed && status) status.textContent = message;
+		},
+		destroy() {
+			disposed = true;
+			status?.remove();
+			status = null;
+		}
+	};
+}
+//#endregion
+//#region src/public/ui/watermark-draft.ts
+function placementState(placement) {
+	const customOrientation = placement?.rotationDegrees != null && ![0, 315].includes(placement.rotationDegrees);
+	return {
+		customOrientation,
+		customPlacement: Boolean(customOrientation || placement?.behindText === false || placement?.horizontal && (placement.horizontal.alignment !== "center" || placement.horizontal.offsetPt) || placement?.vertical && (placement.vertical.alignment !== "center" || placement.vertical.offsetPt))
+	};
+}
+function createWatermarkDraft(item) {
+	const value = item?.watermark;
+	const placement = value?.placement ? structuredClone(value.placement) : void 0;
+	const picture = value?.kind === "picture" ? value : void 0;
+	const text = value?.kind === "text" ? value : void 0;
+	const rotation = placement?.rotationDegrees ?? (picture ? 0 : text?.orientation === "horizontal" ? 0 : 315);
+	return {
+		kind: value?.kind ?? "none",
+		geometryKind: value?.kind ?? null,
+		text: text?.text ?? "DRAFT",
+		fontFamily: text?.fontFamily ?? "Calibri",
+		fontSize: text?.fontSizePt ?? "auto",
+		bold: text?.bold ?? false,
+		italic: text?.italic ?? false,
+		color: text?.color ?? "#C0C0C0",
+		transparency: (1 - (value?.opacity ?? .5)) * 100,
+		orientation: rotation === 0 ? "horizontal" : "diagonal",
+		scalePercent: picture?.scalePercent ?? "auto",
+		washout: picture?.washout ?? true,
+		lockAspectRatio: picture?.lockAspectRatio ?? true,
+		pictureName: picture ? "Image in this document" : "",
+		sourceWatermarkId: picture ? item?.watermarkId : void 0,
+		widthPt: picture?.widthPt,
+		heightPt: picture?.heightPt,
+		placement,
+		...placementState(placement),
+		customSize: Boolean(picture && (placement?.widthPt != null || picture.widthPt != null))
+	};
+}
+function patchWatermarkDraft(draft, patch) {
+	const next = {
+		...draft,
+		...patch
+	};
+	if (patch.kind && patch.kind !== "none") {
+		if (patch.kind !== draft.geometryKind) {
+			next.placement = void 0;
+			next.widthPt = void 0;
+			next.heightPt = void 0;
+			next.customSize = false;
+			next.orientation = patch.kind === "picture" ? "horizontal" : "diagonal";
+		}
+		next.geometryKind = patch.kind;
+	}
+	if (patch.orientation !== void 0) next.placement = {
+		...next.placement,
+		rotationDegrees: patch.orientation === "diagonal" ? 315 : 0
+	};
+	if (patch.scalePercent !== void 0 || patch.src !== void 0) {
+		const { widthPt: _width, heightPt: _height, ...placement } = next.placement ?? {};
+		next.placement = Object.keys(placement).length ? placement : void 0;
+		next.widthPt = void 0;
+		next.heightPt = void 0;
+		next.customSize = false;
+	}
+	return {
+		...next,
+		...placementState(next.placement)
+	};
+}
+function getWatermarkDraftError(draft) {
+	if (draft.kind === "none") return null;
+	if (!Number.isFinite(draft.transparency) || draft.transparency < 0 || draft.transparency > 100) return "Transparency must be between 0 and 100%.";
+	if (draft.kind === "picture") return draft.src || draft.sourceWatermarkId ? null : "Choose a picture.";
+	if (!draft.text.trim()) return "Enter watermark text.";
+	if (draft.fontSize !== "auto" && (!Number.isFinite(draft.fontSize) || draft.fontSize <= 0)) return "Enter a positive font size or choose Auto.";
+	if (!/^#[\da-f]{6}$/i.test(draft.color)) return "Enter a six-digit hex color.";
+	if (!draft.fontFamily.trim()) return "Choose a font.";
+	return null;
+}
+function toWatermarkInput(draft) {
+	const shared = {
+		opacity: 1 - draft.transparency / 100,
+		...draft.placement ? { placement: draft.placement } : {}
+	};
+	if (draft.kind === "text") return {
+		kind: "text",
+		text: draft.text,
+		fontFamily: draft.fontFamily,
+		fontSizePt: draft.fontSize,
+		bold: draft.bold,
+		italic: draft.italic,
+		color: draft.color,
+		orientation: draft.orientation,
+		...shared
+	};
+	if (draft.kind !== "picture") throw new Error("A removal has no watermark input.");
+	return {
+		kind: "picture",
+		...draft.src ? { src: draft.src } : { source: {
+			kind: "existing",
+			watermarkId: draft.sourceWatermarkId
+		} },
+		scalePercent: draft.scalePercent,
+		washout: draft.washout,
+		lockAspectRatio: draft.lockAspectRatio,
+		...draft.widthPt != null ? { widthPt: draft.widthPt } : {},
+		...draft.heightPt != null ? { heightPt: draft.heightPt } : {},
+		...shared
+	};
+}
+//#endregion
+//#region src/public/ui/watermark-controller.ts
+var PAGE_TYPES = {
+	default: "Default pages",
+	first: "First page",
+	even: "Even pages"
+};
+var STALE_MESSAGE = "The document changed while this dialog was open. Review the latest watermark before applying.";
+function scopeSlots(sections, sectionId, variant) {
+	return sections.filter((section) => sectionId == null || section.address.sectionId === sectionId).flatMap((section) => {
+		return (variant === "all" ? [
+			"default",
+			...section.titlePage ? ["first"] : [],
+			...section.oddEvenHeadersFooters ? ["even"] : []
+		] : [variant]).map((variant) => ({
+			kind: "headerFooterSlot",
+			section: section.address,
+			headerFooterKind: "header",
+			variant
+		}));
+	});
+}
+function slotKey(slot) {
+	return `${slot.section.sectionId}:${slot.variant}`;
+}
+function failureMessage(error) {
+	return error instanceof Error ? error.message : "The watermark could not be updated. Try again.";
+}
+function createWatermarkController(options) {
+	const surface = createWatermarkSurfaceRuntime(options.getContainer);
+	const workflowOptions = {
+		...options,
+		announce: (message) => {
+			surface.announce(message);
+			options.announce?.(message);
+		}
+	};
+	let active = null;
+	let destroyed = false;
+	let openGeneration = 0;
+	function close() {
+		const previous = active;
+		active = null;
+		previous?.dispose();
+		previous?.handle.close();
+	}
+	function open() {
+		if (destroyed) return {
+			ok: false,
+			reason: "not-ready"
+		};
+		const editor = options.getEditor();
+		if (!editor) return {
+			ok: false,
+			reason: "not-ready"
+		};
+		if (!editor.doc?.watermarks?.list || !editor.doc.sections?.list) return {
+			ok: false,
+			reason: "document-api-unavailable"
+		};
+		if (!options.openSurface || !editor.doc.watermarks.apply || !editor.host?.watermarkPreview) return {
+			ok: false,
+			reason: "operation-unavailable"
+		};
+		const generation = ++openGeneration;
+		const restoreFocus = surface.captureFocusReturn();
+		close();
+		surface.mount();
+		const workflow = createDialogWorkflow(editor, workflowOptions, () => {
+			if (active?.handle === handle) close();
+		});
+		let handle;
+		try {
+			handle = options.openSurface({
+				mode: "dialog",
+				ariaLabel: "Watermark",
+				component: surface.component,
+				props: { model: workflow.model },
+				dialog: { maxWidth: 700 }
+			});
+		} catch {
+			workflow.dispose();
+			return {
+				ok: false,
+				reason: "operation-unavailable"
+			};
+		}
+		active = {
+			handle,
+			dispose: workflow.dispose
+		};
+		handle.result.then((outcome) => {
+			workflow.dispose();
+			if (active?.handle === handle) active = null;
+			if (outcome.status === "closed" || outcome.status === "submitted") restoreFocus(() => !destroyed && generation === openGeneration && active === null);
+		});
+		workflow.model.reload();
+		return { ok: true };
+	}
+	return {
+		open,
+		close,
+		destroy() {
+			destroyed = true;
+			close();
+			surface.destroy();
+		}
+	};
+}
+function createDialogWorkflow(editor, options, onSuccess) {
+	const listeners = /* @__PURE__ */ new Set();
+	let alive = true;
+	let generation = 0;
+	let timer;
+	let catalog = [];
+	let sections = [];
+	let revision = "";
+	let originalDraft = JSON.stringify(createWatermarkDraft());
+	let preparedInput = null;
+	let snapshot = {
+		phase: "loading",
+		draft: createWatermarkDraft(),
+		sections: [],
+		sectionId: null,
+		variant: "all",
+		items: [],
+		selectedIds: [],
+		fonts: [...options.getFonts()],
+		dirty: false,
+		canApply: false,
+		error: null,
+		stale: false,
+		readonlyReason: null,
+		impact: "",
+		impactDetails: [],
+		preview: null
+	};
+	const current = (token) => alive && token === generation && options.getEditor() === editor;
+	const editable = () => options.getMode() === "editing";
+	function publish(patch) {
+		if (!alive) return;
+		snapshot = {
+			...snapshot,
+			...patch
+		};
+		for (const listener of listeners) listener(snapshot);
+	}
+	function invalidate() {
+		clearTimeout(timer);
+		preparedInput = null;
+		return ++generation;
+	}
+	function location(slot) {
+		const section = sections.find((item) => item.address.sectionId === slot.section.sectionId);
+		const inactive = slot.variant === "first" ? !section?.titlePage : slot.variant === "even" ? !section?.oddEvenHeadersFooters : false;
+		return `Section ${(section?.index ?? 0) + 1}, ${PAGE_TYPES[slot.variant].toLowerCase()}${inactive ? " (inactive)" : ""}`;
+	}
+	function scopedItems() {
+		if (snapshot.sectionId == null && snapshot.variant === "all") return catalog;
+		const keys = new Set(scopeSlots(sections, snapshot.sectionId, snapshot.variant).map(slotKey));
+		return catalog.filter((item) => item.effectiveIn.some((slot) => keys.has(slotKey(slot))));
+	}
+	function publishCatalog() {
+		publish({ items: scopedItems().map((item) => ({
+			id: item.watermarkId,
+			label: item.watermark.kind === "text" ? item.watermark.text : "Picture watermark",
+			locations: item.effectiveIn.map(location).join("; ")
+		})) });
+	}
+	function buildInput() {
+		const target = snapshot.sectionId == null && snapshot.variant === "all" ? { kind: "document" } : {
+			kind: "headerFooterSlots",
+			slots: scopeSlots(sections, snapshot.sectionId, snapshot.variant)
+		};
+		if (snapshot.draft.kind === "none") return {
+			target,
+			action: "remove",
+			watermarkIds: snapshot.selectedIds
+		};
+		const watermark = toWatermarkInput(snapshot.draft);
+		if (snapshot.selectedIds.length) return {
+			target,
+			action: "replace",
+			watermarkIds: snapshot.selectedIds,
+			watermark
+		};
+		if ("source" in watermark) throw new Error("Select the existing picture watermark in this scope, or choose a new picture.");
+		return {
+			target,
+			action: "insert",
+			watermark
+		};
+	}
+	function rejectReceipt(result) {
+		if (result.success) return false;
+		const stale = result.failure?.code === "REVISION_MISMATCH";
+		publish({
+			stale,
+			phase: "editing",
+			canApply: false,
+			error: stale ? STALE_MESSAGE : result.failure?.message ?? "The watermark could not be updated."
+		});
+		return true;
+	}
+	async function prepare(token) {
+		try {
+			const error = getWatermarkDraftError(snapshot.draft);
+			if (error) {
+				publish({
+					phase: "editing",
+					error,
+					canApply: false,
+					preview: null
+				});
+				return;
+			}
+			const input = snapshot.draft.kind === "none" && !snapshot.selectedIds.length ? null : buildInput();
+			const preview = snapshot.draft.kind === "none" ? null : await editor.host.watermarkPreview({
+				watermark: toWatermarkInput(snapshot.draft),
+				sectionId: snapshot.sectionId ?? sections[0]?.address.sectionId,
+				expectedRevision: revision
+			});
+			if (!current(token)) return;
+			if (!input || !snapshot.dirty || !editable()) {
+				publish({
+					phase: "editing",
+					preview,
+					canApply: false,
+					error: null
+				});
+				return;
+			}
+			const receipt = await editor.doc.watermarks.apply(input, {
+				expectedRevision: revision,
+				dryRun: true
+			});
+			if (!current(token)) return;
+			if (!receipt.success) {
+				rejectReceipt(receipt);
+				return;
+			}
+			preparedInput = input;
+			const affected = receipt.affectedSlots.map(location);
+			publish({
+				phase: "editing",
+				preview,
+				error: null,
+				canApply: affected.length > 0 && !snapshot.stale && editable(),
+				impact: affected.length ? `Changes: ${affected.length > 3 ? `${affected.length} page locations` : affected.join("; ")}. Other locations stay as they are.` : "No matching watermark will change.",
+				impactDetails: affected.length > 3 ? affected : []
+			});
+		} catch (error) {
+			if (current(token)) publish({
+				phase: "editing",
+				error: failureMessage(error),
+				canApply: false,
+				preview: null
+			});
+		}
+	}
+	function schedulePreview() {
+		const token = invalidate();
+		publish({
+			phase: "previewing",
+			canApply: false,
+			error: null,
+			impact: "",
+			impactDetails: [],
+			preview: null
+		});
+		timer = setTimeout(() => {
+			prepare(token);
+		}, 120);
+	}
+	const model = {
+		getSnapshot: () => snapshot,
+		subscribe(listener) {
+			listeners.add(listener);
+			listener(snapshot);
+			return () => {
+				listeners.delete(listener);
+			};
+		},
+		async reload() {
+			const token = invalidate();
+			publish({
+				phase: "loading",
+				canApply: false,
+				stale: false,
+				error: null,
+				impactDetails: [],
+				preview: null
+			});
+			try {
+				const [marks, sectionList] = await Promise.all([editor.doc.watermarks.list(), editor.doc.sections.list()]);
+				if (!current(token)) return;
+				if (marks.items.length !== marks.total || sectionList.items.length !== sectionList.total) throw new Error("The complete watermark scope could not be loaded.");
+				if (sectionList.evaluatedRevision && sectionList.evaluatedRevision !== marks.evaluatedRevision) throw new Error(STALE_MESSAGE);
+				catalog = marks.items;
+				sections = sectionList.items;
+				revision = marks.evaluatedRevision;
+				const available = scopedItems();
+				const selected = available.length === 1 ? available[0] : void 0;
+				const draft = createWatermarkDraft(selected);
+				originalDraft = JSON.stringify(draft);
+				publish({
+					draft,
+					dirty: false,
+					selectedIds: selected ? [selected.watermarkId] : [],
+					sections: sections.map((item) => ({
+						id: item.address.sectionId,
+						label: `Section ${item.index + 1}`
+					})),
+					readonlyReason: editable() ? null : options.getMode() === "suggesting" ? "Watermarks cannot be changed in Suggesting mode." : "This document is read-only.",
+					impact: available.length > 1 ? "Select the watermark copies you want to edit, or add a new watermark." : ""
+				});
+				publishCatalog();
+				await prepare(token);
+			} catch (error) {
+				if (current(token)) publish({
+					phase: "editing",
+					error: failureMessage(error),
+					canApply: false
+				});
+			}
+		},
+		patchDraft(patch) {
+			if (!alive || snapshot.phase === "loading" || snapshot.phase === "applying" || !editable()) return;
+			const draft = patchWatermarkDraft(snapshot.draft, patch);
+			publish({
+				draft,
+				dirty: JSON.stringify(draft) !== originalDraft
+			});
+			schedulePreview();
+		},
+		setScope(sectionId, variant) {
+			if (!alive || snapshot.phase === "loading" || snapshot.phase === "applying") return;
+			if (sectionId != null && !sections.some((item) => item.address.sectionId === sectionId)) return;
+			publish({
+				sectionId,
+				variant
+			});
+			publishCatalog();
+			const available = scopedItems();
+			const visible = new Set(available.map((item) => item.watermarkId));
+			let selectedIds = snapshot.selectedIds.filter((id) => visible.has(id));
+			if (snapshot.dirty && snapshot.draft.kind === "none" && !selectedIds.length && available.length === 1) selectedIds = [available[0].watermarkId];
+			publish({ selectedIds });
+			if (!snapshot.dirty) model.selectWatermarks(available.length === 1 ? [available[0].watermarkId] : []);
+			else schedulePreview();
+		},
+		selectWatermarks(ids) {
+			if (!alive || snapshot.phase === "loading" || snapshot.phase === "applying") return;
+			const available = scopedItems();
+			const selectedIds = [...new Set(ids)].filter((id) => available.some((item) => item.watermarkId === id));
+			const draft = createWatermarkDraft(available.find((item) => item.watermarkId === selectedIds[0]));
+			originalDraft = JSON.stringify(draft);
+			publish({
+				selectedIds,
+				draft,
+				dirty: false
+			});
+			schedulePreview();
+		},
+		async apply() {
+			if (!alive || !snapshot.canApply || !preparedInput || !editable() || options.getEditor() !== editor) return;
+			const input = preparedInput;
+			const token = invalidate();
+			publish({
+				phase: "applying",
+				canApply: false,
+				error: null
+			});
+			options.announce?.("Applying watermark changes. Closing the dialog will not cancel them.");
+			try {
+				const receipt = await editor.doc.watermarks.apply(input, { expectedRevision: revision });
+				if (!current(token)) {
+					options.announce?.(receipt.success ? "Watermark updated." : "The watermark could not be updated.");
+					return;
+				}
+				if (rejectReceipt(receipt)) return;
+				options.announce?.(input.action === "remove" ? "Watermark removed." : "Watermark updated.");
+				onSuccess();
+			} catch (error) {
+				if (current(token)) publish({
+					phase: "editing",
+					error: failureMessage(error),
+					canApply: false
+				});
+				else options.announce?.(failureMessage(error));
+			}
+		}
+	};
+	const stopEvents = editor.host?.events?.subscribe((event) => {
+		if (!alive || snapshot.phase === "applying") return;
+		if (event.type === "collaboration:document-replaced") {
+			invalidate();
+			publish({
+				phase: "editing",
+				stale: true,
+				canApply: false,
+				error: STALE_MESSAGE
+			});
+			return;
+		}
+		if (![
+			"document:mutated",
+			"mutation:committed",
+			"collaboration:remote-changed"
+		].includes(event.type)) return;
+		invalidate();
+		if (snapshot.dirty) publish({
+			phase: "editing",
+			stale: true,
+			canApply: false,
+			error: STALE_MESSAGE
+		});
+		else timer = setTimeout(() => {
+			model.reload();
+		}, 120);
+	});
+	return {
+		model,
+		dispose() {
+			alive = false;
+			invalidate();
+			stopEvents?.();
+			listeners.clear();
+		}
+	};
+}
+//#endregion
 //#region src/public/ui/format-painter-helpers.js
 /**
 * Maps SDRunProps field names to InlineRunPatch field names.
@@ -11563,6 +12870,15 @@ function createSuperDocUI(options) {
 		getQuickGallery: () => stylesSub.get().quickGallery,
 		getActiveParagraphStyle: () => computeActiveParagraphStyle(state.selection, getStyleCatalog().cache).style
 	};
+	const watermark = createWatermarkController({
+		getEditor,
+		getMode: readDocumentMode,
+		getFonts: () => fonts.getFamilyOptions(),
+		getContainer: () => superdoc.element ?? null,
+		openSurface: typeof superdoc.openSurface === "function" ? (request) => superdoc.openSurface(request) : null
+	});
+	documentResetHooks.push(watermark.close);
+	documentModeChangeHooks.push(watermark.close);
 	const createScope = () => {
 		const scopeUnsubs = [];
 		return {
@@ -11584,6 +12900,7 @@ function createSuperDocUI(options) {
 	};
 	const destroy = () => {
 		if (disposed) return;
+		watermark.destroy();
 		clearContentControlHighlight();
 		disposed = true;
 		releaseSharedUiTrackedChangesCatalog(uiTrackedChangesCatalogHost, uiTrackedChangesCatalogState);
@@ -11666,6 +12983,7 @@ function createSuperDocUI(options) {
 		tables,
 		search,
 		contextMenu,
+		watermark,
 		styles,
 		formatPainter: {
 			setPointerSelecting(flag) {
@@ -11878,4 +13196,81 @@ function commandIsActive(descriptor, selection) {
 	return descriptor.activeMark ? selection.activeMarks.includes(descriptor.activeMark) : false;
 }
 //#endregion
-export { applyV2CommentInvalidationFromMutation as a, DOM_CLASS_NAMES as c, recordInteraction as d, BUILT_IN_COMMAND_IDS as i, closeInteractionHistory as l, executeFirstPartyCommandAsync as n, getV2TrackedChangeMutationImpact as o, registerFirstPartyCommandMutation as r, shallowEqual as s, createSuperDocUI as t, createInteractionHistory as u };
+Object.defineProperty(exports, "BUILT_IN_COMMAND_IDS", {
+	enumerable: true,
+	get: function() {
+		return BUILT_IN_COMMAND_IDS;
+	}
+});
+Object.defineProperty(exports, "DOM_CLASS_NAMES", {
+	enumerable: true,
+	get: function() {
+		return DOM_CLASS_NAMES;
+	}
+});
+Object.defineProperty(exports, "applyV2CommentInvalidationFromMutation", {
+	enumerable: true,
+	get: function() {
+		return applyV2CommentInvalidationFromMutation;
+	}
+});
+Object.defineProperty(exports, "closeInteractionHistory", {
+	enumerable: true,
+	get: function() {
+		return closeInteractionHistory;
+	}
+});
+Object.defineProperty(exports, "createImageFilePicker", {
+	enumerable: true,
+	get: function() {
+		return createImageFilePicker;
+	}
+});
+Object.defineProperty(exports, "createInteractionHistory", {
+	enumerable: true,
+	get: function() {
+		return createInteractionHistory;
+	}
+});
+Object.defineProperty(exports, "createSuperDocUI", {
+	enumerable: true,
+	get: function() {
+		return createSuperDocUI;
+	}
+});
+Object.defineProperty(exports, "executeFirstPartyCommandAsync", {
+	enumerable: true,
+	get: function() {
+		return executeFirstPartyCommandAsync;
+	}
+});
+Object.defineProperty(exports, "getV2TrackedChangeMutationImpact", {
+	enumerable: true,
+	get: function() {
+		return getV2TrackedChangeMutationImpact;
+	}
+});
+Object.defineProperty(exports, "recordInteraction", {
+	enumerable: true,
+	get: function() {
+		return recordInteraction;
+	}
+});
+Object.defineProperty(exports, "registerFirstPartyCommandMutation", {
+	enumerable: true,
+	get: function() {
+		return registerFirstPartyCommandMutation;
+	}
+});
+Object.defineProperty(exports, "resolveImageSrc", {
+	enumerable: true,
+	get: function() {
+		return resolveImageSrc;
+	}
+});
+Object.defineProperty(exports, "shallowEqual", {
+	enumerable: true,
+	get: function() {
+		return shallowEqual;
+	}
+});