@stll/folio-react 0.5.0 → 0.7.0

package/dist/dialogs-DsHnfN0g.js

@@ -0,0 +1,1272 @@
+import { r as useFolioUI } from "./folio-ui-C-85DSuK.js";
+import { a as DIALOG_LABEL_CLASS, c as DIALOG_SECONDARY_BUTTON_CLASS, i as DIALOG_INPUT_CLASS, l as DIALOG_TITLE_CLASS, n as DIALOG_BODY_CLASS, o as DIALOG_POPUP_CLASS, r as DIALOG_FOOTER_CLASS, s as DIALOG_PRIMARY_BUTTON_CLASS, t as DIALOG_BACKDROP_CLASS, u as useCloseOnDialogOpenChange } from "./dialogChrome-BoGYPgeu.js";
+import { c } from "react-compiler-runtime";
+import { useEffect, useId, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/dialogs/HyperlinkDialog.tsx
+function HyperlinkDialog({ isOpen, onClose, onSubmit, onRemove, currentData, selectedText, bookmarks = [] }) {
+	const { Root: Dialog, Portal: DialogPortal, Backdrop: DialogBackdrop, Popup: DialogPopup, Title: DialogTitle, Close: DialogClose } = useFolioUI().Dialog;
+	const handleOpenChange = useCloseOnDialogOpenChange(onClose);
+	const id = useId();
+	const [targetType, setTargetType] = useState("url");
+	const [url, setUrl] = useState("");
+	const [bookmark, setBookmark] = useState("");
+	const [displayText, setDisplayText] = useState("");
+	const [tooltip, setTooltip] = useState("");
+	const [touched, setTouched] = useState(false);
+	useEffect(() => {
+		if (!isOpen) {
+			setTouched(false);
+			return;
+		}
+		const href = currentData?.href ?? "";
+		if (href.startsWith("#")) {
+			setTargetType("bookmark");
+			setBookmark(href.slice(1));
+			setUrl("");
+		} else {
+			setTargetType("url");
+			setUrl(href);
+			setBookmark("");
+		}
+		setDisplayText(currentData?.displayText ?? selectedText ?? "");
+		setTooltip(currentData?.tooltip ?? "");
+	}, [
+		isOpen,
+		currentData,
+		selectedText
+	]);
+	const urlError = targetType === "url" ? getUrlError(url) : "";
+	const canSubmit = targetType === "bookmark" ? bookmark.trim().length > 0 : url.trim().length > 0 && urlError.length === 0;
+	const isEditing = Boolean(currentData?.href);
+	const fieldIds = {
+		targetType: `${id}-hyperlink-target-type`,
+		url: `${id}-hyperlink-url`,
+		bookmark: `${id}-hyperlink-bookmark`,
+		displayText: `${id}-hyperlink-display-text`,
+		tooltip: `${id}-hyperlink-tooltip`
+	};
+	const handleSubmit = () => {
+		setTouched(true);
+		if (!canSubmit) return;
+		const href_0 = targetType === "bookmark" ? `#${bookmark.trim()}` : normalizeUrl(url);
+		onSubmit({
+			href: href_0,
+			displayText: displayText.trim() || href_0,
+			...tooltip.trim() ? { tooltip: tooltip.trim() } : {}
+		});
+		onClose();
+	};
+	const handleRemove = () => {
+		onRemove?.();
+		onClose();
+	};
+	return /* @__PURE__ */ jsx(Dialog, {
+		open: isOpen,
+		onOpenChange: handleOpenChange,
+		children: /* @__PURE__ */ jsxs(DialogPortal, { children: [/* @__PURE__ */ jsx(DialogBackdrop, { className: DIALOG_BACKDROP_CLASS }), /* @__PURE__ */ jsxs(DialogPopup, {
+			className: DIALOG_POPUP_CLASS,
+			children: [
+				/* @__PURE__ */ jsx(DialogTitle, {
+					className: DIALOG_TITLE_CLASS,
+					children: isEditing ? "Edit Hyperlink" : "Insert Hyperlink"
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: DIALOG_BODY_CLASS,
+					children: [
+						(bookmarks.length > 0 || targetType === "bookmark") && /* @__PURE__ */ jsxs("label", {
+							className: "flex flex-col gap-1",
+							htmlFor: fieldIds.targetType,
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "text-muted-foreground text-[13px]",
+								children: "Link to"
+							}), /* @__PURE__ */ jsxs("select", {
+								className: "border-input bg-background text-foreground rounded border px-2 py-1.5 text-[13px] outline-none",
+								id: fieldIds.targetType,
+								onChange: (e) => setTargetType(toTargetType(e.target.value)),
+								value: targetType,
+								children: [/* @__PURE__ */ jsx("option", {
+									value: "url",
+									children: "Web address"
+								}), /* @__PURE__ */ jsx("option", {
+									value: "bookmark",
+									children: "Bookmark"
+								})]
+							})]
+						}),
+						targetType === "url" && /* @__PURE__ */ jsxs("label", {
+							className: "flex flex-col gap-1",
+							htmlFor: fieldIds.url,
+							children: [
+								/* @__PURE__ */ jsx("span", {
+									className: "text-muted-foreground text-[13px]",
+									children: "Address"
+								}),
+								/* @__PURE__ */ jsx("input", {
+									"aria-invalid": touched && urlError.length > 0,
+									className: "border-input bg-background text-foreground rounded border px-2 py-1.5 text-[13px] outline-none",
+									id: fieldIds.url,
+									onBlur: () => setTouched(true),
+									onChange: (e_0) => setUrl(e_0.target.value),
+									placeholder: "https://example.com",
+									value: url
+								}),
+								touched && urlError.length > 0 && /* @__PURE__ */ jsx("span", {
+									className: "text-destructive text-xs",
+									children: urlError
+								})
+							]
+						}),
+						targetType === "bookmark" && /* @__PURE__ */ jsxs("label", {
+							className: "flex flex-col gap-1",
+							htmlFor: fieldIds.bookmark,
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "text-muted-foreground text-[13px]",
+								children: "Bookmark"
+							}), /* @__PURE__ */ jsxs("select", {
+								className: "border-input bg-background text-foreground rounded border px-2 py-1.5 text-[13px] outline-none",
+								id: fieldIds.bookmark,
+								onChange: (e_1) => setBookmark(e_1.target.value),
+								value: bookmark,
+								children: [/* @__PURE__ */ jsx("option", {
+									value: "",
+									children: "Select a bookmark"
+								}), bookmarks.map((option) => /* @__PURE__ */ jsx("option", {
+									value: option.name,
+									children: option.label ?? option.name
+								}, option.name))]
+							})]
+						}),
+						/* @__PURE__ */ jsxs("label", {
+							className: "flex flex-col gap-1",
+							htmlFor: fieldIds.displayText,
+							children: [/* @__PURE__ */ jsx("span", {
+								className: DIALOG_LABEL_CLASS,
+								children: "Text to display"
+							}), /* @__PURE__ */ jsx("input", {
+								className: DIALOG_INPUT_CLASS,
+								id: fieldIds.displayText,
+								onChange: (e_2) => setDisplayText(e_2.target.value),
+								value: displayText
+							})]
+						}),
+						/* @__PURE__ */ jsxs("label", {
+							className: "flex flex-col gap-1",
+							htmlFor: fieldIds.tooltip,
+							children: [/* @__PURE__ */ jsx("span", {
+								className: DIALOG_LABEL_CLASS,
+								children: "Screen tip"
+							}), /* @__PURE__ */ jsx("input", {
+								className: DIALOG_INPUT_CLASS,
+								id: fieldIds.tooltip,
+								onChange: (e_3) => setTooltip(e_3.target.value),
+								value: tooltip
+							})]
+						})
+					]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: DIALOG_FOOTER_CLASS,
+					children: [
+						isEditing && onRemove && /* @__PURE__ */ jsx("button", {
+							className: "text-destructive me-auto rounded px-4 py-1.5 text-[13px]",
+							onClick: handleRemove,
+							type: "button",
+							children: "Remove"
+						}),
+						/* @__PURE__ */ jsx(DialogClose, {
+							className: DIALOG_SECONDARY_BUTTON_CLASS,
+							children: "Cancel"
+						}),
+						/* @__PURE__ */ jsx("button", {
+							className: DIALOG_PRIMARY_BUTTON_CLASS,
+							disabled: !canSubmit,
+							onClick: handleSubmit,
+							type: "button",
+							children: isEditing ? "Update" : "Insert"
+						})
+					]
+				})
+			]
+		})] })
+	});
+}
+function toTargetType(value) {
+	return value === "bookmark" ? "bookmark" : "url";
+}
+function getUrlError(value) {
+	const trimmed = value.trim();
+	if (!trimmed) return "Enter an address.";
+	if (/^(mailto:|tel:)/iu.test(trimmed)) return trimmed.replace(/^(mailto:|tel:)/iu, "").length > 0 ? "" : "Enter an address.";
+	if (/^ftp:\/\//iu.test(trimmed)) return trimmed.length > 6 ? "" : "Enter an address.";
+	try {
+		const parsed = new URL(/^https?:\/\//iu.test(trimmed) ? trimmed : `https://${trimmed}`);
+		return parsed.protocol === "http:" || parsed.protocol === "https:" ? "" : "Use a web address.";
+	} catch {
+		return "Enter a valid address.";
+	}
+}
+function normalizeUrl(value) {
+	const trimmed = value.trim();
+	if (/^(https?:\/\/|mailto:|tel:|ftp:\/\/)/iu.test(trimmed)) return trimmed;
+	return `https://${trimmed}`;
+}
+//#endregion
+//#region src/components/dialogs/InsertImageDialog.tsx
+function InsertImageDialog({ isOpen, onClose, onInsert, accept = "image/png,image/jpeg,image/gif,image/webp" }) {
+	const { Root: Dialog, Portal: DialogPortal, Backdrop: DialogBackdrop, Popup: DialogPopup, Title: DialogTitle, Close: DialogClose } = useFolioUI().Dialog;
+	const handleOpenChange = useCloseOnDialogOpenChange(onClose);
+	const id = useId();
+	const [file, setFile] = useState(null);
+	const [alt, setAlt] = useState("");
+	const [width, setWidth] = useState("");
+	const [height, setHeight] = useState("");
+	useEffect(() => {
+		if (!isOpen) return;
+		setFile(null);
+		setAlt("");
+		setWidth("");
+		setHeight("");
+	}, [isOpen]);
+	const fieldIds = {
+		file: `${id}-insert-image-file`,
+		alt: `${id}-insert-image-alt`,
+		width: `${id}-insert-image-width`,
+		height: `${id}-insert-image-height`
+	};
+	const handleInsert = () => {
+		if (!file) return;
+		const parsedWidth = toPositiveNumber(width);
+		const parsedHeight = toPositiveNumber(height);
+		onInsert({
+			file,
+			...alt.trim() ? { alt: alt.trim() } : {},
+			...parsedWidth ? { width: parsedWidth } : {},
+			...parsedHeight ? { height: parsedHeight } : {}
+		});
+		onClose();
+	};
+	return /* @__PURE__ */ jsx(Dialog, {
+		open: isOpen,
+		onOpenChange: handleOpenChange,
+		children: /* @__PURE__ */ jsxs(DialogPortal, { children: [/* @__PURE__ */ jsx(DialogBackdrop, { className: DIALOG_BACKDROP_CLASS }), /* @__PURE__ */ jsxs(DialogPopup, {
+			className: DIALOG_POPUP_CLASS,
+			children: [
+				/* @__PURE__ */ jsx(DialogTitle, {
+					className: DIALOG_TITLE_CLASS,
+					children: "Insert Image"
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: DIALOG_BODY_CLASS,
+					children: [
+						/* @__PURE__ */ jsxs("label", {
+							className: "flex flex-col gap-1",
+							htmlFor: fieldIds.file,
+							children: [/* @__PURE__ */ jsx("span", {
+								className: DIALOG_LABEL_CLASS,
+								children: "Image file"
+							}), /* @__PURE__ */ jsx("input", {
+								accept,
+								className: DIALOG_INPUT_CLASS,
+								id: fieldIds.file,
+								onChange: (e) => setFile(e.target.files?.[0] ?? null),
+								type: "file"
+							})]
+						}),
+						/* @__PURE__ */ jsxs("label", {
+							className: "flex flex-col gap-1",
+							htmlFor: fieldIds.alt,
+							children: [/* @__PURE__ */ jsx("span", {
+								className: DIALOG_LABEL_CLASS,
+								children: "Alt text"
+							}), /* @__PURE__ */ jsx("input", {
+								className: DIALOG_INPUT_CLASS,
+								id: fieldIds.alt,
+								onChange: (e_0) => setAlt(e_0.target.value),
+								placeholder: file?.name ?? "",
+								value: alt
+							})]
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "grid grid-cols-2 gap-3",
+							children: [/* @__PURE__ */ jsxs("label", {
+								className: "flex flex-col gap-1",
+								htmlFor: fieldIds.width,
+								children: [/* @__PURE__ */ jsx("span", {
+									className: DIALOG_LABEL_CLASS,
+									children: "Width"
+								}), /* @__PURE__ */ jsx("input", {
+									className: DIALOG_INPUT_CLASS,
+									id: fieldIds.width,
+									min: 1,
+									onChange: (e_1) => setWidth(e_1.target.value),
+									placeholder: "Auto",
+									type: "number",
+									value: width
+								})]
+							}), /* @__PURE__ */ jsxs("label", {
+								className: "flex flex-col gap-1",
+								htmlFor: fieldIds.height,
+								children: [/* @__PURE__ */ jsx("span", {
+									className: DIALOG_LABEL_CLASS,
+									children: "Height"
+								}), /* @__PURE__ */ jsx("input", {
+									className: DIALOG_INPUT_CLASS,
+									id: fieldIds.height,
+									min: 1,
+									onChange: (e_2) => setHeight(e_2.target.value),
+									placeholder: "Auto",
+									type: "number",
+									value: height
+								})]
+							})]
+						})
+					]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: DIALOG_FOOTER_CLASS,
+					children: [/* @__PURE__ */ jsx(DialogClose, {
+						className: DIALOG_SECONDARY_BUTTON_CLASS,
+						children: "Cancel"
+					}), /* @__PURE__ */ jsx("button", {
+						className: DIALOG_PRIMARY_BUTTON_CLASS,
+						disabled: !file,
+						onClick: handleInsert,
+						type: "button",
+						children: "Insert"
+					})]
+				})
+			]
+		})] })
+	});
+}
+function toPositiveNumber(value) {
+	const parsed = Number(value);
+	return Number.isFinite(parsed) && parsed > 0 ? parsed : void 0;
+}
+//#endregion
+//#region src/components/dialogs/InsertTableDialog.tsx
+const GRID_ROWS = 8;
+const GRID_COLUMNS = 10;
+const MIN_ROWS = 1;
+const MAX_ROWS = 100;
+const MIN_COLUMNS = 1;
+const MAX_COLUMNS = 20;
+const DEFAULT_STYLE_OPTIONS = [
+	{
+		id: "TableGrid",
+		name: "Table Grid"
+	},
+	{
+		id: "TableNormal",
+		name: "Normal Table"
+	},
+	{
+		id: "TableGridLight",
+		name: "Grid Table Light"
+	}
+];
+function InsertTableDialog({ isOpen, onClose, onInsert, defaultRows = 3, defaultColumns = 3, styleOptions = DEFAULT_STYLE_OPTIONS }) {
+	const { Root: Dialog, Portal: DialogPortal, Backdrop: DialogBackdrop, Popup: DialogPopup, Title: DialogTitle, Close: DialogClose } = useFolioUI().Dialog;
+	const handleOpenChange = useCloseOnDialogOpenChange(onClose);
+	const id = useId();
+	const [rows, setRows] = useState(defaultRows);
+	const [columns, setColumns] = useState(defaultColumns);
+	const [hoverRows, setHoverRows] = useState(0);
+	const [hoverColumns, setHoverColumns] = useState(0);
+	const [autofit, setAutofit] = useState(false);
+	const [styleId, setStyleId] = useState("");
+	useEffect(() => {
+		if (!isOpen) return;
+		setRows(defaultRows);
+		setColumns(defaultColumns);
+		setHoverRows(0);
+		setHoverColumns(0);
+		setAutofit(false);
+		setStyleId("");
+	}, [
+		isOpen,
+		defaultRows,
+		defaultColumns
+	]);
+	const normalizedRows = clampInteger$1(rows, MIN_ROWS, MAX_ROWS);
+	const normalizedColumns = clampInteger$1(columns, MIN_COLUMNS, MAX_COLUMNS);
+	const canInsert = Number.isFinite(rows) && Number.isFinite(columns);
+	const fieldIds = {
+		rows: `${id}-insert-table-rows`,
+		columns: `${id}-insert-table-columns`,
+		autofit: `${id}-insert-table-autofit`,
+		style: `${id}-insert-table-style`
+	};
+	const handleInsert = () => {
+		if (!canInsert) return;
+		onInsert({
+			rows: normalizedRows,
+			columns: normalizedColumns,
+			autofit,
+			...styleId ? { styleId } : {}
+		});
+		onClose();
+	};
+	return /* @__PURE__ */ jsx(Dialog, {
+		open: isOpen,
+		onOpenChange: handleOpenChange,
+		children: /* @__PURE__ */ jsxs(DialogPortal, { children: [/* @__PURE__ */ jsx(DialogBackdrop, { className: DIALOG_BACKDROP_CLASS }), /* @__PURE__ */ jsxs(DialogPopup, {
+			className: DIALOG_POPUP_CLASS,
+			children: [
+				/* @__PURE__ */ jsx(DialogTitle, {
+					className: DIALOG_TITLE_CLASS,
+					children: "Insert Table"
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: DIALOG_BODY_CLASS,
+					children: [
+						/* @__PURE__ */ jsx("div", {
+							className: "grid w-max grid-cols-10 gap-1",
+							onMouseLeave: () => {
+								setHoverRows(0);
+								setHoverColumns(0);
+							},
+							children: Array.from({ length: GRID_ROWS }).map((_, rowIndex) => Array.from({ length: GRID_COLUMNS }).map((__, columnIndex) => {
+								const row = rowIndex + 1;
+								const column = columnIndex + 1;
+								const active = row <= hoverRows && column <= hoverColumns;
+								return /* @__PURE__ */ jsx("button", {
+									"aria-label": `${row} by ${column} table`,
+									className: `h-5 w-5 rounded-sm border ${active ? "border-primary bg-primary/20" : "border-input bg-background"}`,
+									onClick: () => {
+										setRows(row);
+										setColumns(column);
+									},
+									onMouseEnter: () => {
+										setHoverRows(row);
+										setHoverColumns(column);
+									},
+									type: "button"
+								}, `${row}-${column}`);
+							}))
+						}),
+						/* @__PURE__ */ jsx("div", {
+							className: "text-muted-foreground text-xs",
+							children: hoverRows > 0 ? `${hoverColumns} columns x ${hoverRows} rows` : `${normalizedColumns} columns x ${normalizedRows} rows`
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "grid grid-cols-2 gap-3",
+							children: [/* @__PURE__ */ jsxs("label", {
+								className: "flex flex-col gap-1",
+								htmlFor: fieldIds.rows,
+								children: [/* @__PURE__ */ jsx("span", {
+									className: DIALOG_LABEL_CLASS,
+									children: "Rows"
+								}), /* @__PURE__ */ jsx("input", {
+									className: DIALOG_INPUT_CLASS,
+									id: fieldIds.rows,
+									max: MAX_ROWS,
+									min: MIN_ROWS,
+									onChange: (e) => setRows(Number(e.target.value) || MIN_ROWS),
+									type: "number",
+									value: rows
+								})]
+							}), /* @__PURE__ */ jsxs("label", {
+								className: "flex flex-col gap-1",
+								htmlFor: fieldIds.columns,
+								children: [/* @__PURE__ */ jsx("span", {
+									className: DIALOG_LABEL_CLASS,
+									children: "Columns"
+								}), /* @__PURE__ */ jsx("input", {
+									className: DIALOG_INPUT_CLASS,
+									id: fieldIds.columns,
+									max: MAX_COLUMNS,
+									min: MIN_COLUMNS,
+									onChange: (e_0) => setColumns(Number(e_0.target.value) || MIN_COLUMNS),
+									type: "number",
+									value: columns
+								})]
+							})]
+						}),
+						/* @__PURE__ */ jsxs("label", {
+							className: "flex items-center gap-2",
+							htmlFor: fieldIds.autofit,
+							children: [/* @__PURE__ */ jsx("input", {
+								checked: autofit,
+								id: fieldIds.autofit,
+								onChange: (e_1) => setAutofit(e_1.target.checked),
+								type: "checkbox"
+							}), /* @__PURE__ */ jsx("span", {
+								className: DIALOG_LABEL_CLASS,
+								children: "Autofit to contents"
+							})]
+						}),
+						styleOptions.length > 0 && /* @__PURE__ */ jsxs("label", {
+							className: "flex flex-col gap-1",
+							htmlFor: fieldIds.style,
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "text-muted-foreground text-[13px]",
+								children: "Style"
+							}), /* @__PURE__ */ jsxs("select", {
+								className: "border-input bg-background text-foreground rounded border px-2 py-1.5 text-[13px] outline-none",
+								id: fieldIds.style,
+								onChange: (e_2) => setStyleId(e_2.target.value),
+								value: styleId,
+								children: [/* @__PURE__ */ jsx("option", {
+									value: "",
+									children: "Plain table"
+								}), styleOptions.map((style) => /* @__PURE__ */ jsx("option", {
+									value: style.id,
+									children: style.name
+								}, style.id))]
+							})]
+						})
+					]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: DIALOG_FOOTER_CLASS,
+					children: [/* @__PURE__ */ jsx(DialogClose, {
+						className: DIALOG_SECONDARY_BUTTON_CLASS,
+						children: "Cancel"
+					}), /* @__PURE__ */ jsx("button", {
+						className: DIALOG_PRIMARY_BUTTON_CLASS,
+						disabled: !canInsert,
+						onClick: handleInsert,
+						type: "button",
+						children: "Insert"
+					})]
+				})
+			]
+		})] })
+	});
+}
+function clampInteger$1(value, min, max) {
+	return Math.min(max, Math.max(min, Math.trunc(value)));
+}
+//#endregion
+//#region src/components/dialogs/PasteSpecialDialog.tsx
+const PASTE_MODES = [
+	{
+		value: "keepFormatting",
+		label: "Keep source formatting",
+		description: "Preserve styles, links, and inline formatting from the clipboard."
+	},
+	{
+		value: "mergeFormatting",
+		label: "Merge formatting",
+		description: "Keep useful inline formatting while matching the destination paragraph."
+	},
+	{
+		value: "plainText",
+		label: "Unformatted text",
+		description: "Paste text only and use the destination formatting."
+	}
+];
+function PasteSpecialDialog({ isOpen, onClose, onPaste, defaultMode = "plainText" }) {
+	const { Root: Dialog, Portal: DialogPortal, Backdrop: DialogBackdrop, Popup: DialogPopup, Title: DialogTitle, Close: DialogClose } = useFolioUI().Dialog;
+	const handleOpenChange = useCloseOnDialogOpenChange(onClose);
+	const id = useId();
+	const [mode, setMode] = useState(defaultMode);
+	useEffect(() => {
+		if (isOpen) setMode(defaultMode);
+	}, [isOpen, defaultMode]);
+	const handlePaste = () => {
+		onPaste(mode);
+		onClose();
+	};
+	return /* @__PURE__ */ jsx(Dialog, {
+		open: isOpen,
+		onOpenChange: handleOpenChange,
+		children: /* @__PURE__ */ jsxs(DialogPortal, { children: [/* @__PURE__ */ jsx(DialogBackdrop, { className: DIALOG_BACKDROP_CLASS }), /* @__PURE__ */ jsxs(DialogPopup, {
+			className: DIALOG_POPUP_CLASS,
+			children: [
+				/* @__PURE__ */ jsx(DialogTitle, {
+					className: DIALOG_TITLE_CLASS,
+					children: "Paste Special"
+				}),
+				/* @__PURE__ */ jsx("div", {
+					className: DIALOG_BODY_CLASS,
+					children: /* @__PURE__ */ jsxs("fieldset", {
+						className: "flex flex-col gap-3",
+						children: [/* @__PURE__ */ jsx("legend", {
+							className: DIALOG_LABEL_CLASS,
+							children: "Paste mode"
+						}), PASTE_MODES.map((option) => {
+							const optionId = `${id}-paste-special-${option.value}`;
+							return /* @__PURE__ */ jsxs("label", {
+								className: "flex items-start gap-3",
+								htmlFor: optionId,
+								children: [/* @__PURE__ */ jsx("input", {
+									checked: mode === option.value,
+									id: optionId,
+									onChange: () => setMode(option.value),
+									type: "radio"
+								}), /* @__PURE__ */ jsxs("span", {
+									className: "flex flex-col gap-1",
+									children: [/* @__PURE__ */ jsx("span", {
+										className: "text-foreground text-[13px] font-medium",
+										children: option.label
+									}), /* @__PURE__ */ jsx("span", {
+										className: "text-muted-foreground text-xs",
+										children: option.description
+									})]
+								})]
+							}, option.value);
+						})]
+					})
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: DIALOG_FOOTER_CLASS,
+					children: [/* @__PURE__ */ jsx(DialogClose, {
+						className: DIALOG_SECONDARY_BUTTON_CLASS,
+						children: "Cancel"
+					}), /* @__PURE__ */ jsx("button", {
+						className: DIALOG_PRIMARY_BUTTON_CLASS,
+						onClick: handlePaste,
+						type: "button",
+						children: "Paste"
+					})]
+				})
+			]
+		})] })
+	});
+}
+//#endregion
+//#region src/components/dialogs/SplitCellDialog.tsx
+const MIN_PARTS = 1;
+const MAX_PARTS = 63;
+function SplitCellDialog({ isOpen, onClose, onSplit, defaultRows = 1, defaultColumns = 2 }) {
+	const { Root: Dialog, Portal: DialogPortal, Backdrop: DialogBackdrop, Popup: DialogPopup, Title: DialogTitle, Close: DialogClose } = useFolioUI().Dialog;
+	const handleOpenChange = useCloseOnDialogOpenChange(onClose);
+	const id = useId();
+	const [rows, setRows] = useState(defaultRows);
+	const [columns, setColumns] = useState(defaultColumns);
+	const [mergeBeforeSplit, setMergeBeforeSplit] = useState(false);
+	useEffect(() => {
+		if (!isOpen) return;
+		setRows(defaultRows);
+		setColumns(defaultColumns);
+		setMergeBeforeSplit(false);
+	}, [
+		isOpen,
+		defaultRows,
+		defaultColumns
+	]);
+	const normalizedRows = clampInteger(rows);
+	const normalizedColumns = clampInteger(columns);
+	const canSplit = normalizedRows > 1 || normalizedColumns > 1;
+	const fieldIds = {
+		rows: `${id}-split-cell-rows`,
+		columns: `${id}-split-cell-columns`,
+		mergeBeforeSplit: `${id}-split-cell-merge-before-split`
+	};
+	const handleSplit = () => {
+		if (!canSplit) return;
+		onSplit({
+			rows: normalizedRows,
+			columns: normalizedColumns,
+			mergeBeforeSplit
+		});
+		onClose();
+	};
+	return /* @__PURE__ */ jsx(Dialog, {
+		open: isOpen,
+		onOpenChange: handleOpenChange,
+		children: /* @__PURE__ */ jsxs(DialogPortal, { children: [/* @__PURE__ */ jsx(DialogBackdrop, { className: DIALOG_BACKDROP_CLASS }), /* @__PURE__ */ jsxs(DialogPopup, {
+			className: DIALOG_POPUP_CLASS,
+			children: [
+				/* @__PURE__ */ jsx(DialogTitle, {
+					className: DIALOG_TITLE_CLASS,
+					children: "Split Cell"
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: DIALOG_BODY_CLASS,
+					children: [/* @__PURE__ */ jsxs("div", {
+						className: "grid grid-cols-2 gap-3",
+						children: [/* @__PURE__ */ jsxs("label", {
+							className: "flex flex-col gap-1",
+							htmlFor: fieldIds.columns,
+							children: [/* @__PURE__ */ jsx("span", {
+								className: DIALOG_LABEL_CLASS,
+								children: "Columns"
+							}), /* @__PURE__ */ jsx("input", {
+								className: DIALOG_INPUT_CLASS,
+								id: fieldIds.columns,
+								max: MAX_PARTS,
+								min: MIN_PARTS,
+								onChange: (e) => setColumns(Number(e.target.value) || MIN_PARTS),
+								type: "number",
+								value: columns
+							})]
+						}), /* @__PURE__ */ jsxs("label", {
+							className: "flex flex-col gap-1",
+							htmlFor: fieldIds.rows,
+							children: [/* @__PURE__ */ jsx("span", {
+								className: DIALOG_LABEL_CLASS,
+								children: "Rows"
+							}), /* @__PURE__ */ jsx("input", {
+								className: DIALOG_INPUT_CLASS,
+								id: fieldIds.rows,
+								max: MAX_PARTS,
+								min: MIN_PARTS,
+								onChange: (e_0) => setRows(Number(e_0.target.value) || MIN_PARTS),
+								type: "number",
+								value: rows
+							})]
+						})]
+					}), /* @__PURE__ */ jsxs("label", {
+						className: "flex items-center gap-2",
+						htmlFor: fieldIds.mergeBeforeSplit,
+						children: [/* @__PURE__ */ jsx("input", {
+							checked: mergeBeforeSplit,
+							id: fieldIds.mergeBeforeSplit,
+							onChange: (e_1) => setMergeBeforeSplit(e_1.target.checked),
+							type: "checkbox"
+						}), /* @__PURE__ */ jsx("span", {
+							className: DIALOG_LABEL_CLASS,
+							children: "Merge selected cells before splitting"
+						})]
+					})]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: DIALOG_FOOTER_CLASS,
+					children: [/* @__PURE__ */ jsx(DialogClose, {
+						className: DIALOG_SECONDARY_BUTTON_CLASS,
+						children: "Cancel"
+					}), /* @__PURE__ */ jsx("button", {
+						className: DIALOG_PRIMARY_BUTTON_CLASS,
+						disabled: !canSplit,
+						onClick: handleSplit,
+						type: "button",
+						children: "Split"
+					})]
+				})
+			]
+		})] })
+	});
+}
+function clampInteger(value) {
+	return Math.min(MAX_PARTS, Math.max(MIN_PARTS, Math.trunc(value)));
+}
+//#endregion
+//#region src/components/dialogs/WatermarkDialog.tsx
+const DEFAULT_TEXT_COLOR = "#C0C0C0";
+function WatermarkDialog(t0) {
+	const $ = c(100);
+	const { isOpen, onClose, onApply, currentWatermark } = t0;
+	const { Root: Dialog, Portal: DialogPortal, Backdrop: DialogBackdrop, Popup: DialogPopup, Title: DialogTitle, Close: DialogClose } = useFolioUI().Dialog;
+	const handleOpenChange = useCloseOnDialogOpenChange(onClose);
+	const id = useId();
+	const [mode, setMode] = useState("text");
+	const [text, setText] = useState("CONFIDENTIAL");
+	const [font, setFont] = useState("Calibri");
+	const [color, setColor] = useState(DEFAULT_TEXT_COLOR);
+	const [diagonal, setDiagonal] = useState(true);
+	const [opacityPercent, setOpacityPercent] = useState(50);
+	const [imageRId, setImageRId] = useState("");
+	const [imageTarget, setImageTarget] = useState("");
+	const [imageTargetExternal, setImageTargetExternal] = useState(false);
+	const [scalePercent, setScalePercent] = useState(100);
+	const [washout, setWashout] = useState(true);
+	let t1;
+	let t2;
+	if ($[0] !== currentWatermark || $[1] !== isOpen) {
+		t1 = () => {
+			if (!isOpen) return;
+			if (!currentWatermark) {
+				setMode("text");
+				setText("CONFIDENTIAL");
+				setFont("Calibri");
+				setColor(DEFAULT_TEXT_COLOR);
+				setDiagonal(true);
+				setOpacityPercent(50);
+				setImageRId("");
+				setImageTarget("");
+				setImageTargetExternal(false);
+				setScalePercent(100);
+				setWashout(true);
+				return;
+			}
+			setMode(currentWatermark.kind);
+			if (currentWatermark.kind === "text") {
+				setText(currentWatermark.text);
+				setFont(currentWatermark.font ?? "Calibri");
+				setColor(toColorInputValue(currentWatermark.color));
+				setDiagonal(currentWatermark.diagonal ?? true);
+				setOpacityPercent(Math.round((currentWatermark.opacity ?? .5) * 100));
+				return;
+			}
+			setImageRId(currentWatermark.imageRId);
+			setImageTarget(currentWatermark.imageTarget ?? "");
+			setImageTargetExternal(currentWatermark.imageTargetExternal ?? false);
+			setScalePercent(Math.round((currentWatermark.scale ?? 1) * 100));
+			setWashout(currentWatermark.washout ?? true);
+		};
+		t2 = [isOpen, currentWatermark];
+		$[0] = currentWatermark;
+		$[1] = isOpen;
+		$[2] = t1;
+		$[3] = t2;
+	} else {
+		t1 = $[2];
+		t2 = $[3];
+	}
+	useEffect(t1, t2);
+	const t3 = `${id}-watermark-mode`;
+	const t4 = `${id}-watermark-text`;
+	const t5 = `${id}-watermark-font`;
+	const t6 = `${id}-watermark-color`;
+	const t7 = `${id}-watermark-diagonal`;
+	const t8 = `${id}-watermark-opacity`;
+	const t9 = `${id}-watermark-image-rid`;
+	const t10 = `${id}-watermark-image-target`;
+	const t11 = `${id}-watermark-image-external`;
+	const t12 = `${id}-watermark-scale`;
+	const t13 = `${id}-watermark-washout`;
+	let t14;
+	if ($[4] !== t10 || $[5] !== t11 || $[6] !== t12 || $[7] !== t13 || $[8] !== t3 || $[9] !== t4 || $[10] !== t5 || $[11] !== t6 || $[12] !== t7 || $[13] !== t8 || $[14] !== t9) {
+		t14 = {
+			mode: t3,
+			text: t4,
+			font: t5,
+			color: t6,
+			diagonal: t7,
+			opacity: t8,
+			imageRId: t9,
+			imageTarget: t10,
+			imageTargetExternal: t11,
+			scale: t12,
+			washout: t13
+		};
+		$[4] = t10;
+		$[5] = t11;
+		$[6] = t12;
+		$[7] = t13;
+		$[8] = t3;
+		$[9] = t4;
+		$[10] = t5;
+		$[11] = t6;
+		$[12] = t7;
+		$[13] = t8;
+		$[14] = t9;
+		$[15] = t14;
+	} else t14 = $[15];
+	const fieldIds = t14;
+	let t15;
+	if ($[16] !== imageRId || $[17] !== mode || $[18] !== text) {
+		t15 = mode === "none" || mode === "text" && text.trim().length > 0 || mode === "picture" && imageRId.trim().length > 0;
+		$[16] = imageRId;
+		$[17] = mode;
+		$[18] = text;
+		$[19] = t15;
+	} else t15 = $[19];
+	const canApply = t15;
+	let t16;
+	if ($[20] !== canApply || $[21] !== color || $[22] !== diagonal || $[23] !== font || $[24] !== imageRId || $[25] !== imageTarget || $[26] !== imageTargetExternal || $[27] !== mode || $[28] !== onApply || $[29] !== onClose || $[30] !== opacityPercent || $[31] !== scalePercent || $[32] !== text || $[33] !== washout) {
+		t16 = () => {
+			if (!canApply) return;
+			if (mode === "none") {
+				onApply(void 0);
+				onClose();
+				return;
+			}
+			if (mode === "text") {
+				onApply({
+					kind: "text",
+					text: text.trim(),
+					...font.trim() ? { font: font.trim() } : {},
+					color: stripHash(color),
+					diagonal,
+					opacity: clampPercent(opacityPercent) / 100
+				});
+				onClose();
+				return;
+			}
+			onApply({
+				kind: "picture",
+				imageRId: imageRId.trim(),
+				...imageTarget.trim() ? { imageTarget: imageTarget.trim() } : {},
+				...imageTarget.trim() ? { imageTargetExternal } : {},
+				scale: clampScalePercent(scalePercent) / 100,
+				washout
+			});
+			onClose();
+		};
+		$[20] = canApply;
+		$[21] = color;
+		$[22] = diagonal;
+		$[23] = font;
+		$[24] = imageRId;
+		$[25] = imageTarget;
+		$[26] = imageTargetExternal;
+		$[27] = mode;
+		$[28] = onApply;
+		$[29] = onClose;
+		$[30] = opacityPercent;
+		$[31] = scalePercent;
+		$[32] = text;
+		$[33] = washout;
+		$[34] = t16;
+	} else t16 = $[34];
+	const handleApply = t16;
+	let t17;
+	if ($[35] !== DialogBackdrop) {
+		t17 = /* @__PURE__ */ jsx(DialogBackdrop, { className: DIALOG_BACKDROP_CLASS });
+		$[35] = DialogBackdrop;
+		$[36] = t17;
+	} else t17 = $[36];
+	let t18;
+	if ($[37] !== DialogTitle) {
+		t18 = /* @__PURE__ */ jsx(DialogTitle, {
+			className: DIALOG_TITLE_CLASS,
+			children: "Watermark"
+		});
+		$[37] = DialogTitle;
+		$[38] = t18;
+	} else t18 = $[38];
+	let t19;
+	if ($[39] === Symbol.for("react.memo_cache_sentinel")) {
+		t19 = /* @__PURE__ */ jsx("span", {
+			className: DIALOG_LABEL_CLASS,
+			children: "Type"
+		});
+		$[39] = t19;
+	} else t19 = $[39];
+	let t20;
+	if ($[40] === Symbol.for("react.memo_cache_sentinel")) {
+		t20 = (e) => setMode(toWatermarkMode(e.target.value));
+		$[40] = t20;
+	} else t20 = $[40];
+	let t21;
+	let t22;
+	let t23;
+	if ($[41] === Symbol.for("react.memo_cache_sentinel")) {
+		t21 = /* @__PURE__ */ jsx("option", {
+			value: "text",
+			children: "Text watermark"
+		});
+		t22 = /* @__PURE__ */ jsx("option", {
+			value: "picture",
+			children: "Picture watermark"
+		});
+		t23 = /* @__PURE__ */ jsx("option", {
+			value: "none",
+			children: "No watermark"
+		});
+		$[41] = t21;
+		$[42] = t22;
+		$[43] = t23;
+	} else {
+		t21 = $[41];
+		t22 = $[42];
+		t23 = $[43];
+	}
+	let t24;
+	if ($[44] !== fieldIds.mode || $[45] !== mode) {
+		t24 = /* @__PURE__ */ jsxs("select", {
+			className: DIALOG_INPUT_CLASS,
+			id: fieldIds.mode,
+			onChange: t20,
+			value: mode,
+			children: [
+				t21,
+				t22,
+				t23
+			]
+		});
+		$[44] = fieldIds.mode;
+		$[45] = mode;
+		$[46] = t24;
+	} else t24 = $[46];
+	let t25;
+	if ($[47] !== fieldIds.mode || $[48] !== t24) {
+		t25 = /* @__PURE__ */ jsxs("label", {
+			className: "flex flex-col gap-1",
+			htmlFor: fieldIds.mode,
+			children: [t19, t24]
+		});
+		$[47] = fieldIds.mode;
+		$[48] = t24;
+		$[49] = t25;
+	} else t25 = $[49];
+	let t26;
+	if ($[50] !== color || $[51] !== diagonal || $[52] !== fieldIds.color || $[53] !== fieldIds.diagonal || $[54] !== fieldIds.font || $[55] !== fieldIds.opacity || $[56] !== fieldIds.text || $[57] !== font || $[58] !== mode || $[59] !== opacityPercent || $[60] !== text) {
+		t26 = mode === "text" && /* @__PURE__ */ jsxs("div", {
+			className: "grid grid-cols-2 gap-3",
+			children: [
+				/* @__PURE__ */ jsxs("label", {
+					className: "col-span-2 flex flex-col gap-1",
+					htmlFor: fieldIds.text,
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-muted-foreground text-[13px]",
+						children: "Text"
+					}), /* @__PURE__ */ jsx("input", {
+						className: "border-input bg-background text-foreground rounded border px-2 py-1.5 text-[13px] outline-none",
+						id: fieldIds.text,
+						onChange: (e_0) => setText(e_0.target.value),
+						value: text
+					})]
+				}),
+				/* @__PURE__ */ jsxs("label", {
+					className: "flex flex-col gap-1",
+					htmlFor: fieldIds.font,
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-muted-foreground text-[13px]",
+						children: "Font"
+					}), /* @__PURE__ */ jsx("input", {
+						className: "border-input bg-background text-foreground rounded border px-2 py-1.5 text-[13px] outline-none",
+						id: fieldIds.font,
+						onChange: (e_1) => setFont(e_1.target.value),
+						value: font
+					})]
+				}),
+				/* @__PURE__ */ jsxs("label", {
+					className: "flex flex-col gap-1",
+					htmlFor: fieldIds.color,
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-muted-foreground text-[13px]",
+						children: "Color"
+					}), /* @__PURE__ */ jsx("input", {
+						className: `border-input bg-background text-foreground rounded border px-2 py-1.5 text-[13px] outline-none h-[34px]`,
+						id: fieldIds.color,
+						onChange: (e_2) => setColor(e_2.target.value),
+						type: "color",
+						value: color
+					})]
+				}),
+				/* @__PURE__ */ jsxs("label", {
+					className: "flex flex-col gap-1",
+					htmlFor: fieldIds.opacity,
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-muted-foreground text-[13px]",
+						children: "Opacity"
+					}), /* @__PURE__ */ jsx("input", {
+						className: "border-input bg-background text-foreground rounded border px-2 py-1.5 text-[13px] outline-none",
+						id: fieldIds.opacity,
+						max: 100,
+						min: 0,
+						onChange: (e_3) => setOpacityPercent(Number(e_3.target.value) || 0),
+						type: "number",
+						value: opacityPercent
+					})]
+				}),
+				/* @__PURE__ */ jsxs("label", {
+					className: "flex items-center gap-2 pt-6",
+					htmlFor: fieldIds.diagonal,
+					children: [/* @__PURE__ */ jsx("input", {
+						checked: diagonal,
+						id: fieldIds.diagonal,
+						onChange: (e_4) => setDiagonal(e_4.target.checked),
+						type: "checkbox"
+					}), /* @__PURE__ */ jsx("span", {
+						className: "text-muted-foreground text-[13px]",
+						children: "Diagonal"
+					})]
+				})
+			]
+		});
+		$[50] = color;
+		$[51] = diagonal;
+		$[52] = fieldIds.color;
+		$[53] = fieldIds.diagonal;
+		$[54] = fieldIds.font;
+		$[55] = fieldIds.opacity;
+		$[56] = fieldIds.text;
+		$[57] = font;
+		$[58] = mode;
+		$[59] = opacityPercent;
+		$[60] = text;
+		$[61] = t26;
+	} else t26 = $[61];
+	let t27;
+	if ($[62] !== fieldIds.imageRId || $[63] !== fieldIds.imageTarget || $[64] !== fieldIds.imageTargetExternal || $[65] !== fieldIds.scale || $[66] !== fieldIds.washout || $[67] !== imageRId || $[68] !== imageTarget || $[69] !== imageTargetExternal || $[70] !== mode || $[71] !== scalePercent || $[72] !== washout) {
+		t27 = mode === "picture" && /* @__PURE__ */ jsxs("div", {
+			className: "grid grid-cols-2 gap-3",
+			children: [
+				/* @__PURE__ */ jsxs("label", {
+					className: "col-span-2 flex flex-col gap-1",
+					htmlFor: fieldIds.imageRId,
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-muted-foreground text-[13px]",
+						children: "Header image relationship id"
+					}), /* @__PURE__ */ jsx("input", {
+						className: "border-input bg-background text-foreground rounded border px-2 py-1.5 text-[13px] outline-none",
+						id: fieldIds.imageRId,
+						onChange: (e_5) => setImageRId(e_5.target.value),
+						placeholder: "rId12",
+						value: imageRId
+					})]
+				}),
+				/* @__PURE__ */ jsxs("label", {
+					className: "col-span-2 flex flex-col gap-1",
+					htmlFor: fieldIds.imageTarget,
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-muted-foreground text-[13px]",
+						children: "Image target"
+					}), /* @__PURE__ */ jsx("input", {
+						className: "border-input bg-background text-foreground rounded border px-2 py-1.5 text-[13px] outline-none",
+						id: fieldIds.imageTarget,
+						onChange: (e_6) => setImageTarget(e_6.target.value),
+						placeholder: "word/media/image1.png",
+						value: imageTarget
+					})]
+				}),
+				/* @__PURE__ */ jsxs("label", {
+					className: "flex flex-col gap-1",
+					htmlFor: fieldIds.scale,
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-muted-foreground text-[13px]",
+						children: "Scale"
+					}), /* @__PURE__ */ jsx("input", {
+						className: "border-input bg-background text-foreground rounded border px-2 py-1.5 text-[13px] outline-none",
+						id: fieldIds.scale,
+						max: 300,
+						min: 1,
+						onChange: (e_7) => setScalePercent(Number(e_7.target.value) || 1),
+						type: "number",
+						value: scalePercent
+					})]
+				}),
+				/* @__PURE__ */ jsxs("label", {
+					className: "flex items-center gap-2 pt-6",
+					htmlFor: fieldIds.washout,
+					children: [/* @__PURE__ */ jsx("input", {
+						checked: washout,
+						id: fieldIds.washout,
+						onChange: (e_8) => setWashout(e_8.target.checked),
+						type: "checkbox"
+					}), /* @__PURE__ */ jsx("span", {
+						className: "text-muted-foreground text-[13px]",
+						children: "Washout"
+					})]
+				}),
+				/* @__PURE__ */ jsxs("label", {
+					className: "col-span-2 flex items-center gap-2",
+					htmlFor: fieldIds.imageTargetExternal,
+					children: [/* @__PURE__ */ jsx("input", {
+						checked: imageTargetExternal,
+						id: fieldIds.imageTargetExternal,
+						onChange: (e_9) => setImageTargetExternal(e_9.target.checked),
+						type: "checkbox"
+					}), /* @__PURE__ */ jsx("span", {
+						className: "text-muted-foreground text-[13px]",
+						children: "Target is an external URL"
+					})]
+				})
+			]
+		});
+		$[62] = fieldIds.imageRId;
+		$[63] = fieldIds.imageTarget;
+		$[64] = fieldIds.imageTargetExternal;
+		$[65] = fieldIds.scale;
+		$[66] = fieldIds.washout;
+		$[67] = imageRId;
+		$[68] = imageTarget;
+		$[69] = imageTargetExternal;
+		$[70] = mode;
+		$[71] = scalePercent;
+		$[72] = washout;
+		$[73] = t27;
+	} else t27 = $[73];
+	let t28;
+	if ($[74] !== t25 || $[75] !== t26 || $[76] !== t27) {
+		t28 = /* @__PURE__ */ jsxs("div", {
+			className: DIALOG_BODY_CLASS,
+			children: [
+				t25,
+				t26,
+				t27
+			]
+		});
+		$[74] = t25;
+		$[75] = t26;
+		$[76] = t27;
+		$[77] = t28;
+	} else t28 = $[77];
+	let t29;
+	if ($[78] !== DialogClose) {
+		t29 = /* @__PURE__ */ jsx(DialogClose, {
+			className: DIALOG_SECONDARY_BUTTON_CLASS,
+			children: "Cancel"
+		});
+		$[78] = DialogClose;
+		$[79] = t29;
+	} else t29 = $[79];
+	const t30 = !canApply;
+	let t31;
+	if ($[80] !== handleApply || $[81] !== t30) {
+		t31 = /* @__PURE__ */ jsx("button", {
+			className: DIALOG_PRIMARY_BUTTON_CLASS,
+			disabled: t30,
+			onClick: handleApply,
+			type: "button",
+			children: "Apply"
+		});
+		$[80] = handleApply;
+		$[81] = t30;
+		$[82] = t31;
+	} else t31 = $[82];
+	let t32;
+	if ($[83] !== t29 || $[84] !== t31) {
+		t32 = /* @__PURE__ */ jsxs("div", {
+			className: DIALOG_FOOTER_CLASS,
+			children: [t29, t31]
+		});
+		$[83] = t29;
+		$[84] = t31;
+		$[85] = t32;
+	} else t32 = $[85];
+	let t33;
+	if ($[86] !== DialogPopup || $[87] !== t18 || $[88] !== t28 || $[89] !== t32) {
+		t33 = /* @__PURE__ */ jsxs(DialogPopup, {
+			className: DIALOG_POPUP_CLASS,
+			children: [
+				t18,
+				t28,
+				t32
+			]
+		});
+		$[86] = DialogPopup;
+		$[87] = t18;
+		$[88] = t28;
+		$[89] = t32;
+		$[90] = t33;
+	} else t33 = $[90];
+	let t34;
+	if ($[91] !== DialogPortal || $[92] !== t17 || $[93] !== t33) {
+		t34 = /* @__PURE__ */ jsxs(DialogPortal, { children: [t17, t33] });
+		$[91] = DialogPortal;
+		$[92] = t17;
+		$[93] = t33;
+		$[94] = t34;
+	} else t34 = $[94];
+	let t35;
+	if ($[95] !== Dialog || $[96] !== handleOpenChange || $[97] !== isOpen || $[98] !== t34) {
+		t35 = /* @__PURE__ */ jsx(Dialog, {
+			open: isOpen,
+			onOpenChange: handleOpenChange,
+			children: t34
+		});
+		$[95] = Dialog;
+		$[96] = handleOpenChange;
+		$[97] = isOpen;
+		$[98] = t34;
+		$[99] = t35;
+	} else t35 = $[99];
+	return t35;
+}
+function toWatermarkMode(value) {
+	if (value === "none" || value === "picture" || value === "text") return value;
+	return "text";
+}
+function clampPercent(value) {
+	return Math.min(100, Math.max(0, value));
+}
+function clampScalePercent(value) {
+	return Math.min(300, Math.max(1, value));
+}
+function stripHash(value) {
+	return value.startsWith("#") ? value.slice(1) : value;
+}
+function toColorInputValue(value) {
+	if (!value || value === "auto") return DEFAULT_TEXT_COLOR;
+	return value.startsWith("#") ? value : `#${value}`;
+}
+//#endregion
+export { InsertImageDialog as a, InsertTableDialog as i, SplitCellDialog as n, HyperlinkDialog as o, PasteSpecialDialog as r, WatermarkDialog as t };