@heyirisai/docx-editor-vue 1.9.0

package/dist/ui.js

@@ -0,0 +1,986 @@
+import { a as e, f as t, i as n, n as r, o as i, r as a, t as o, u as s } from "./KeyboardShortcutsDialog-B0fEvXnH.js";
+import { C as c, D as l, E as u, O as d, S as f, T as ee, _ as te, a as p, b as m, c as h, d as g, f as _, g as v, h as y, i as b, k as x, l as ne, m as re, n as ie, o as ae, p as oe, r as S, s as se, u as ce, v as le, w as ue, x as de, y as fe } from "./usePortalClass-HM-UHRlE.js";
+import { t as C } from "./_plugin-vue_export-helper-B52Kst-M.js";
+import { a as pe, c as me, i as he, n as ge, o as w, r as T, s as E, t as D } from "./TablePropertiesDialog-P_vyKNTn.js";
+import { Fragment as O, Teleport as k, computed as A, createBlock as j, createCommentVNode as M, createElementBlock as N, createElementVNode as P, createTextVNode as F, createVNode as I, defineComponent as L, guardReactiveProps as _e, nextTick as R, normalizeClass as z, normalizeProps as ve, normalizeStyle as B, onBeforeUnmount as V, onMounted as H, openBlock as U, ref as W, renderList as G, renderSlot as K, resolveDynamicComponent as ye, toDisplayString as q, unref as J, watch as be, withCtx as Y, withKeys as X, withModifiers as Z } from "vue";
+import "@heyirisai/docx-editor-core/utils/units";
+import { createDefaultListState as xe } from "@heyirisai/docx-editor-core/utils/listState";
+import { CARD_STYLE_COLLAPSED as Se, CARD_STYLE_EXPANDED as Ce } from "@heyirisai/docx-editor-core/utils/cardStyles";
+//#region src/components/EditorToolbar.vue?vue&type=script&setup=true&lang.ts
+var we = { class: "docx-editor-toolbar" }, Te = { class: "docx-editor-toolbar__title-row" }, Ee = { class: "docx-editor-toolbar__title-left" }, De = { class: "docx-editor-toolbar__title-center" }, Oe = { class: "docx-editor-toolbar__title-right" }, ke = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	inheritAttrs: !1,
+	__name: "EditorToolbar",
+	props: { showMenuBar: {
+		type: Boolean,
+		default: !0
+	} },
+	emits: ["menu-action"],
+	setup(e) {
+		return (t, n) => (U(), N("div", we, [K(t.$slots, "title-bar", {}, () => [P("div", Te, [
+			P("div", Ee, [K(t.$slots, "title-bar-left", {}, void 0, !0)]),
+			P("div", De, [K(t.$slots, "document-name", {}, void 0, !0), e.showMenuBar ? (U(), j(S, {
+				key: 0,
+				onAction: n[0] ||= (e) => t.$emit("menu-action", e)
+			})) : M("", !0)]),
+			P("div", Oe, [K(t.$slots, "title-bar-right", {}, void 0, !0)])
+		])], !0), K(t.$slots, "toolbar", {}, () => [I(c, ve(_e(t.$attrs)), null, 16)], !0)]));
+	}
+}), [["__scopeId", "data-v-f2023632"]]), Ae = {}, je = { class: "docx-title-bar" }, Me = { class: "docx-title-bar__left" }, Ne = { class: "docx-title-bar__center" }, Pe = { class: "docx-title-bar__right" };
+function Fe(e, t) {
+	return U(), N("div", je, [
+		P("div", Me, [K(e.$slots, "left", {}, void 0, !0)]),
+		P("div", Ne, [K(e.$slots, "default", {}, void 0, !0)]),
+		P("div", Pe, [K(e.$slots, "right", {}, void 0, !0)])
+	]);
+}
+var Ie = /* @__PURE__ */ C(Ae, [["render", Fe], ["__scopeId", "data-v-ae11d49f"]]), Le = ["title"], Re = {
+	key: 0,
+	class: "responsive-toolbar__overflow-menu"
+}, ze = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "ResponsiveToolbar",
+	setup(e) {
+		let { t } = s(), n = W(null), r = W(null), i = W(null), a = W(0), o = W(!1), c = null;
+		function l() {
+			let e = n.value, t = r.value;
+			if (!e || !t) return;
+			let i = e.clientWidth - 40, o = Array.from(t.children), s = 0;
+			for (let e of o) e.style.display = "";
+			let c = 0;
+			for (let e of o) c += e.offsetWidth + 2, c > i ? e.style.display = "none" : s++;
+			a.value = o.length - s;
+		}
+		function u(e) {
+			let t = e.target;
+			i.value?.contains(t) || (o.value = !1);
+		}
+		return H(() => {
+			c = new ResizeObserver(() => {
+				R(l);
+			}), n.value && c.observe(n.value), R(l), document.addEventListener("mousedown", u);
+		}), V(() => {
+			c?.disconnect(), document.removeEventListener("mousedown", u);
+		}), (e, s) => (U(), N("div", {
+			class: "responsive-toolbar",
+			ref_key: "containerRef",
+			ref: n
+		}, [P("div", {
+			class: "responsive-toolbar__items",
+			ref_key: "itemsRef",
+			ref: r
+		}, [K(e.$slots, "default", {}, void 0, !0)], 512), a.value > 0 ? (U(), N("div", {
+			key: 0,
+			class: "responsive-toolbar__overflow",
+			ref_key: "overflowRef",
+			ref: i
+		}, [P("button", {
+			class: "responsive-toolbar__overflow-btn",
+			onMousedown: s[0] ||= Z((e) => o.value = !o.value, ["prevent"]),
+			title: J(t)("formattingBar.moreItems", { count: a.value })
+		}, " ⋯ ", 40, Le), o.value ? (U(), N("div", Re, [K(e.$slots, "overflow", {}, void 0, !0)])) : M("", !0)], 512)) : M("", !0)], 512));
+	}
+}), [["__scopeId", "data-v-134de3f0"]]);
+//#endregion
+//#region src/components/ui/fontPickerValue.ts
+function Q(e) {
+	let t = e.trim();
+	if (!t) return "";
+	let n = null, r = "";
+	for (let e of t) {
+		if ((e === "\"" || e === "'") && n === null) {
+			n = e, r += e;
+			continue;
+		}
+		if (e === n) {
+			n = null, r += e;
+			continue;
+		}
+		if (e === "," && n === null) break;
+		r += e;
+	}
+	return r.trim().replace(/^['"]|['"]$/g, "");
+}
+//#endregion
+//#region src/components/ui/FontPicker.vue?vue&type=script&setup=true&lang.ts
+var Be = ["value", "disabled"], Ve = {
+	key: 0,
+	label: "Sans-serif"
+}, He = ["value"], Ue = {
+	key: 1,
+	label: "Serif"
+}, We = ["value"], Ge = {
+	key: 2,
+	label: "Monospace"
+}, Ke = ["value"], qe = {
+	key: 3,
+	label: "Other"
+}, Je = ["value"], Ye = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "FontPicker",
+	props: {
+		value: {},
+		fonts: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		className: {},
+		placeholder: { default: "Font" },
+		showPreview: {
+			type: Boolean,
+			default: !0
+		}
+	},
+	emits: ["change"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = [
+			{
+				name: "Arial",
+				fontFamily: "Arial, Helvetica, sans-serif",
+				category: "sans-serif"
+			},
+			{
+				name: "Calibri",
+				fontFamily: "\"Calibri\", Arial, sans-serif",
+				category: "sans-serif"
+			},
+			{
+				name: "Helvetica",
+				fontFamily: "Helvetica, Arial, sans-serif",
+				category: "sans-serif"
+			},
+			{
+				name: "Verdana",
+				fontFamily: "Verdana, Geneva, sans-serif",
+				category: "sans-serif"
+			},
+			{
+				name: "Open Sans",
+				fontFamily: "\"Open Sans\", sans-serif",
+				category: "sans-serif"
+			},
+			{
+				name: "Roboto",
+				fontFamily: "Roboto, sans-serif",
+				category: "sans-serif"
+			},
+			{
+				name: "Times New Roman",
+				fontFamily: "\"Times New Roman\", Times, serif",
+				category: "serif"
+			},
+			{
+				name: "Georgia",
+				fontFamily: "Georgia, serif",
+				category: "serif"
+			},
+			{
+				name: "Cambria",
+				fontFamily: "Cambria, Georgia, serif",
+				category: "serif"
+			},
+			{
+				name: "Garamond",
+				fontFamily: "Garamond, serif",
+				category: "serif"
+			},
+			{
+				name: "Courier New",
+				fontFamily: "\"Courier New\", monospace",
+				category: "monospace"
+			},
+			{
+				name: "Consolas",
+				fontFamily: "Consolas, monospace",
+				category: "monospace"
+			}
+		], a = A(() => n.fonts ?? i), o = A(() => {
+			let e = {
+				"sans-serif": [],
+				serif: [],
+				monospace: [],
+				other: []
+			};
+			for (let t of a.value) e[t.category ?? "other"].push(t);
+			return e;
+		}), s = A(() => n.value ? a.value.find((e) => e.fontFamily === n.value || e.name.toLowerCase() === n.value.toLowerCase() || Q(e.fontFamily).toLowerCase() === n.value.toLowerCase())?.name ?? n.value : n.placeholder);
+		function c(e) {
+			let t = e.target.value, n = a.value.find((e) => e.name === t);
+			r("change", n ? Q(n.fontFamily) || n.name : t);
+		}
+		return (t, n) => (U(), N("select", {
+			class: z(["docx-font-picker", e.className]),
+			value: s.value,
+			disabled: e.disabled,
+			"aria-label": "Font family",
+			onChange: c
+		}, [
+			o.value["sans-serif"].length ? (U(), N("optgroup", Ve, [(U(!0), N(O, null, G(o.value["sans-serif"], (t) => (U(), N("option", {
+				key: t.name,
+				value: t.name,
+				style: B(e.showPreview ? { fontFamily: t.fontFamily } : void 0)
+			}, q(t.name), 13, He))), 128))])) : M("", !0),
+			o.value.serif.length ? (U(), N("optgroup", Ue, [(U(!0), N(O, null, G(o.value.serif, (t) => (U(), N("option", {
+				key: t.name,
+				value: t.name,
+				style: B(e.showPreview ? { fontFamily: t.fontFamily } : void 0)
+			}, q(t.name), 13, We))), 128))])) : M("", !0),
+			o.value.monospace.length ? (U(), N("optgroup", Ge, [(U(!0), N(O, null, G(o.value.monospace, (t) => (U(), N("option", {
+				key: t.name,
+				value: t.name,
+				style: B(e.showPreview ? { fontFamily: t.fontFamily } : void 0)
+			}, q(t.name), 13, Ke))), 128))])) : M("", !0),
+			o.value.other.length ? (U(), N("optgroup", qe, [(U(!0), N(O, null, G(o.value.other, (t) => (U(), N("option", {
+				key: t.name,
+				value: t.name,
+				style: B(e.showPreview ? { fontFamily: t.fontFamily } : void 0)
+			}, q(t.name), 13, Je))), 128))])) : M("", !0)
+		], 42, Be));
+	}
+}), [["__scopeId", "data-v-30a12967"]]), Xe = { class: "docx-font-size" }, Ze = ["disabled"], Qe = [
+	"value",
+	"disabled",
+	"placeholder"
+], $e = ["disabled"], et = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "FontSizePicker",
+	props: {
+		value: {},
+		sizes: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		minSize: { default: 1 },
+		maxSize: { default: 1638 },
+		placeholder: { default: "11" }
+	},
+	emits: ["change"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = [
+			8,
+			9,
+			10,
+			11,
+			12,
+			14,
+			16,
+			18,
+			20,
+			24,
+			28,
+			36,
+			48,
+			72
+		], a = A(() => n.sizes ?? i), o = A(() => n.value ?? parseInt(n.placeholder, 10) ?? 11), s = A(() => n.value === void 0 ? n.placeholder : String(n.value));
+		function c(e) {
+			return a.value.find((t) => t > e) ?? Math.min(e + 1, n.maxSize);
+		}
+		function l(e) {
+			return [...a.value].reverse().find((t) => t < e) ?? Math.max(e - 1, n.minSize);
+		}
+		function u() {
+			n.disabled || r("change", l(o.value));
+		}
+		function d() {
+			n.disabled || r("change", c(o.value));
+		}
+		function f(e) {
+			let t = parseFloat(e.target.value);
+			!isNaN(t) && t >= n.minSize && t <= n.maxSize && r("change", Math.round(t * 2) / 2);
+		}
+		return (t, n) => (U(), N("div", Xe, [
+			P("button", {
+				type: "button",
+				class: "docx-font-size__btn",
+				disabled: e.disabled || o.value <= e.minSize,
+				title: "Decrease font size",
+				onClick: Z(u, ["prevent"])
+			}, "−", 8, Ze),
+			P("input", {
+				class: "docx-font-size__input",
+				type: "text",
+				value: s.value,
+				disabled: e.disabled,
+				placeholder: e.placeholder,
+				onKeydown: [
+					n[0] ||= X(Z((e) => {
+						u(), e.stopPropagation();
+					}, ["prevent"]), ["up"]),
+					n[1] ||= X(Z((e) => {
+						d(), e.stopPropagation();
+					}, ["prevent"]), ["down"]),
+					n[2] ||= X(Z((e) => f(e), ["prevent"]), ["enter"])
+				],
+				onBlur: n[3] ||= (e) => f(e)
+			}, null, 40, Qe),
+			P("button", {
+				type: "button",
+				class: "docx-font-size__btn",
+				disabled: e.disabled || o.value >= e.maxSize,
+				title: "Increase font size",
+				onClick: Z(d, ["prevent"])
+			}, "+", 8, $e)
+		]));
+	}
+}), [["__scopeId", "data-v-593c3ec6"]]), tt = ["value", "disabled"], nt = ["value"], rt = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "LineSpacingPicker",
+	props: {
+		value: {},
+		options: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		className: {}
+	},
+	emits: ["change"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = [
+			{
+				label: "Single",
+				value: 1,
+				twipsValue: 240
+			},
+			{
+				label: "1.15",
+				value: 1.15,
+				twipsValue: 276
+			},
+			{
+				label: "1.5",
+				value: 1.5,
+				twipsValue: 360
+			},
+			{
+				label: "Double",
+				value: 2,
+				twipsValue: 480
+			}
+		], a = A(() => n.options ?? i), o = A(() => n.value ?? a.value[0].twipsValue);
+		function s(e) {
+			let t = parseInt(e.target.value, 10);
+			isNaN(t) || r("change", t);
+		}
+		return (t, n) => (U(), N("select", {
+			class: z(["docx-line-spacing", e.className]),
+			value: String(o.value),
+			disabled: e.disabled,
+			"aria-label": "Line spacing",
+			onChange: s
+		}, [(U(!0), N(O, null, G(a.value, (e) => (U(), N("option", {
+			key: e.twipsValue,
+			value: String(e.twipsValue)
+		}, q(e.label), 9, nt))), 128))], 42, tt));
+	}
+}), [["__scopeId", "data-v-8cd813f2"]]), it = ["value", "disabled"], at = ["value"], ot = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "StylePicker",
+	props: {
+		value: {},
+		styles: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		className: {}
+	},
+	emits: ["change"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = [
+			{
+				styleId: "Normal",
+				name: "Normal text"
+			},
+			{
+				styleId: "Title",
+				name: "Title"
+			},
+			{
+				styleId: "Subtitle",
+				name: "Subtitle"
+			},
+			{
+				styleId: "Heading1",
+				name: "Heading 1"
+			},
+			{
+				styleId: "Heading2",
+				name: "Heading 2"
+			},
+			{
+				styleId: "Heading3",
+				name: "Heading 3"
+			}
+		], a = A(() => n.styles ?? i);
+		function o(e) {
+			r("change", e.target.value);
+		}
+		return (t, n) => (U(), N("select", {
+			class: z(["docx-style-picker", e.className]),
+			value: e.value ?? "Normal",
+			disabled: e.disabled,
+			"aria-label": "Paragraph style",
+			onChange: o
+		}, [(U(!0), N(O, null, G(a.value, (e) => (U(), N("option", {
+			key: e.styleId,
+			value: e.styleId
+		}, q(e.name), 9, at))), 128))], 42, it));
+	}
+}), [["__scopeId", "data-v-dce7e34a"]]), st = [
+	"disabled",
+	"title",
+	"aria-expanded",
+	"onClick"
+], ct = { class: "docx-align__panel" }, lt = ["title", "onClick"], ut = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "AlignmentButtons",
+	props: {
+		value: { default: "left" },
+		disabled: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["change"],
+	setup(e, { emit: n }) {
+		let r = e, i = n, a = W(!1), o = [
+			{
+				value: "left",
+				label: "Align left",
+				icon: "format_align_left",
+				shortcut: "Ctrl+L"
+			},
+			{
+				value: "center",
+				label: "Center",
+				icon: "format_align_center",
+				shortcut: "Ctrl+E"
+			},
+			{
+				value: "right",
+				label: "Align right",
+				icon: "format_align_right",
+				shortcut: "Ctrl+R"
+			},
+			{
+				value: "both",
+				label: "Justify",
+				icon: "format_align_justify",
+				shortcut: "Ctrl+J"
+			}
+		], s = A(() => o.find((e) => e.value === r.value)?.icon ?? "format_align_left"), c = A(() => o.find((e) => e.value === r.value)?.label ?? "Left");
+		function l(e) {
+			i("change", e), a.value = !1;
+		}
+		return (n, r) => (U(), j(d, {
+			open: a.value,
+			"onUpdate:open": r[0] ||= (e) => a.value = e,
+			onClose: r[1] ||= (e) => a.value = !1
+		}, {
+			trigger: Y(({ toggle: n }) => [P("button", {
+				type: "button",
+				class: z(["docx-align__btn", { "docx-align__btn--open": a.value }]),
+				disabled: e.disabled,
+				title: `Alignment: ${c.value}`,
+				"aria-expanded": a.value,
+				"aria-haspopup": "true",
+				onClick: Z(n, ["prevent"])
+			}, [I(t, {
+				name: s.value,
+				size: 20
+			}, null, 8, ["name"]), I(t, {
+				name: "arrow_drop_down",
+				size: 14
+			})], 10, st)]),
+			panel: Y(() => [P("div", ct, [(U(), N(O, null, G(o, (n) => P("button", {
+				key: n.value,
+				type: "button",
+				class: z(["docx-align__option", { "docx-align__option--active": e.value === n.value }]),
+				title: `${n.label} (${n.shortcut})`,
+				onClick: Z((e) => l(n.value), ["prevent"])
+			}, [I(t, {
+				name: n.icon,
+				size: 20
+			}, null, 8, ["name"])], 10, lt)), 64))])]),
+			_: 1
+		}, 8, ["open"]));
+	}
+}), [["__scopeId", "data-v-412e177a"]]), dt = { class: "docx-list-btns" }, ft = ["disabled"], pt = ["disabled"], mt = ["disabled"], ht = ["disabled"], gt = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "ListButtons",
+	props: {
+		listState: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		showIndentButtons: {
+			type: Boolean,
+			default: !0
+		},
+		canOutdent: {
+			type: Boolean,
+			default: !0
+		}
+	},
+	emits: [
+		"bullet-list",
+		"numbered-list",
+		"indent",
+		"outdent"
+	],
+	setup(e) {
+		return (n, r) => (U(), N("span", dt, [
+			P("button", {
+				type: "button",
+				class: z(["docx-list-btns__btn", { "docx-list-btns__btn--active": e.listState?.isInList && e.listState?.type === "bullet" }]),
+				disabled: e.disabled,
+				title: "Bullet list",
+				onClick: r[0] ||= Z((e) => n.$emit("bullet-list"), ["prevent"])
+			}, [I(t, {
+				name: "format_list_bulleted",
+				size: 20
+			})], 10, ft),
+			P("button", {
+				type: "button",
+				class: z(["docx-list-btns__btn", { "docx-list-btns__btn--active": e.listState?.isInList && e.listState?.type === "numbered" }]),
+				disabled: e.disabled,
+				title: "Numbered list",
+				onClick: r[1] ||= Z((e) => n.$emit("numbered-list"), ["prevent"])
+			}, [I(t, {
+				name: "format_list_numbered",
+				size: 20
+			})], 10, pt),
+			e.showIndentButtons ? (U(), N(O, { key: 0 }, [P("button", {
+				type: "button",
+				class: "docx-list-btns__btn",
+				disabled: e.disabled || !e.canOutdent,
+				title: "Decrease indent",
+				onClick: r[2] ||= Z((e) => n.$emit("outdent"), ["prevent"])
+			}, [I(t, {
+				name: "format_indent_decrease",
+				size: 20
+			})], 8, mt), P("button", {
+				type: "button",
+				class: "docx-list-btns__btn",
+				disabled: e.disabled,
+				title: "Increase indent",
+				onClick: r[3] ||= Z((e) => n.$emit("indent"), ["prevent"])
+			}, [I(t, {
+				name: "format_indent_increase",
+				size: 20
+			})], 8, ht)], 64)) : M("", !0)
+		]));
+	}
+}), [["__scopeId", "data-v-1b9a4dcd"]]), _t = [
+	"value",
+	"disabled",
+	"aria-label"
+], vt = ["value"], yt = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "ZoomControl",
+	props: {
+		value: { default: 1 },
+		levels: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		className: {},
+		compact: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["change"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = [
+			{
+				value: .5,
+				label: "50%"
+			},
+			{
+				value: .75,
+				label: "75%"
+			},
+			{
+				value: 1,
+				label: "100%"
+			},
+			{
+				value: 1.25,
+				label: "125%"
+			},
+			{
+				value: 1.5,
+				label: "150%"
+			},
+			{
+				value: 2,
+				label: "200%"
+			}
+		], a = A(() => n.levels ?? i), o = A(() => {
+			let e = a.value.find((e) => Math.abs(e.value - n.value) < .001);
+			return e ? e.label : `${Math.round(n.value * 100)}%`;
+		});
+		function s(e) {
+			let t = parseFloat(e.target.value);
+			isNaN(t) || r("change", t);
+		}
+		return (t, n) => (U(), N("select", {
+			class: z(["docx-zoom-control", {
+				"docx-zoom-control--compact": e.compact,
+				[e.className ?? ""]: !!e.className
+			}]),
+			value: e.value,
+			disabled: e.disabled,
+			"aria-label": `Zoom: ${o.value}`,
+			onChange: s
+		}, [(U(!0), N(O, null, G(a.value, (e) => (U(), N("option", {
+			key: e.value,
+			value: e.value
+		}, q(e.label), 9, vt))), 128))], 42, _t));
+	}
+}), [["__scopeId", "data-v-734f61aa"]]), bt = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "Tooltip",
+	props: {
+		content: {},
+		side: { default: "bottom" },
+		delayMs: { default: 400 }
+	},
+	setup(e) {
+		let t = ie(), n = e, r = W(!1), i = W({
+			x: 0,
+			y: 0
+		}), a = W(null), o = null;
+		function s() {
+			o = setTimeout(() => {
+				let e = a.value;
+				if (e) {
+					let t = e.getBoundingClientRect();
+					i.value = {
+						x: t.left + t.width / 2,
+						y: n.side === "top" ? t.top - 8 : t.bottom + 8
+					};
+				}
+				r.value = !0;
+			}, n.delayMs);
+		}
+		function c() {
+			o &&= (clearTimeout(o), null), r.value = !1;
+		}
+		V(() => {
+			o && clearTimeout(o);
+		});
+		let l = A(() => ({
+			left: i.value.x + "px",
+			top: i.value.y + "px",
+			transform: n.side === "top" ? "translate(-50%, -100%)" : n.side === "bottom" ? "translate(-50%, 0)" : void 0
+		}));
+		return (n, i) => (U(), N(O, null, [P("span", {
+			ref_key: "triggerRef",
+			ref: a,
+			class: "docx-tooltip__trigger",
+			onMouseenter: s,
+			onMouseleave: c
+		}, [K(n.$slots, "default", {}, void 0, !0)], 544), (U(), j(k, { to: "body" }, [r.value ? (U(), N("div", {
+			key: 0,
+			class: z(["docx-tooltip", J(t)]),
+			style: B(l.value)
+		}, q(e.content), 7)) : M("", !0)]))], 64));
+	}
+}), [["__scopeId", "data-v-f8255ce5"]]), xt = ["aria-label"], St = {
+	key: 0,
+	class: "docx-loading__spinner"
+}, Ct = {
+	key: 1,
+	class: "docx-loading__bar"
+}, wt = {
+	key: 2,
+	class: "docx-loading__message"
+}, Tt = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "LoadingIndicator",
+	props: {
+		isLoading: { type: Boolean },
+		variant: { default: "spinner" },
+		size: { default: "medium" },
+		message: {},
+		overlay: {
+			type: Boolean,
+			default: !1
+		},
+		progress: { default: null }
+	},
+	setup(e) {
+		return (t, n) => e.isLoading ? (U(), N("div", {
+			key: 0,
+			class: z([
+				"docx-loading",
+				`docx-loading--${e.variant}`,
+				`docx-loading--${e.size}`,
+				{ "docx-loading--overlay": e.overlay }
+			]),
+			role: "status",
+			"aria-label": e.message
+		}, [e.variant === "spinner" ? (U(), N("span", St)) : e.variant === "bar" || e.variant === "progress" ? (U(), N("div", Ct, [P("div", {
+			class: "docx-loading__bar-fill",
+			style: B(e.variant === "progress" && e.progress != null ? { width: e.progress + "%" } : void 0)
+		}, null, 4)])) : M("", !0), e.message ? (U(), N("span", wt, q(e.message), 1)) : M("", !0)], 10, xt)) : M("", !0);
+	}
+}), [["__scopeId", "data-v-5ffccb99"]]), Et = ["disabled"], Dt = "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", Ot = /* @__PURE__ */ L({
+	__name: "Button",
+	props: {
+		variant: { default: "default" },
+		size: { default: "default" },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		className: { default: "" }
+	},
+	emits: ["click"],
+	setup(e) {
+		let t = e, n = {
+			default: "bg-primary text-primary-foreground hover:bg-primary/90",
+			destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+			outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+			secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+			ghost: "hover:bg-accent hover:text-accent-foreground",
+			link: "text-primary underline-offset-4 hover:underline"
+		}, r = {
+			default: "h-10 px-4 py-2",
+			sm: "h-9 rounded-md px-3",
+			lg: "h-11 rounded-md px-8",
+			icon: "h-9 w-9",
+			"icon-sm": "h-7 w-7"
+		}, i = A(() => [
+			Dt,
+			n[t.variant],
+			r[t.size],
+			t.className
+		].filter(Boolean).join(" "));
+		return (t, n) => (U(), N("button", {
+			class: z(i.value),
+			disabled: e.disabled,
+			onClick: n[0] ||= (e) => t.$emit("click", e)
+		}, [K(t.$slots, "default")], 10, Et));
+	}
+}), kt = [
+	"disabled",
+	"aria-expanded",
+	"title",
+	"onClick"
+], At = { class: "docx-table-grid__panel" }, jt = { class: "docx-table-grid__label" }, Mt = ["onMouseenter", "onClick"], Nt = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "TableGridPicker",
+	props: {
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		gridRows: { default: 5 },
+		gridColumns: { default: 5 },
+		tooltip: { default: "Insert table" }
+	},
+	emits: ["insert"],
+	setup(e, { emit: n }) {
+		let r = e, i = n, a = W(!1), o = W({
+			rows: 1,
+			cols: 1
+		}), s = A(() => {
+			let e = [];
+			for (let t = 1; t <= r.gridRows; t++) for (let n = 1; n <= r.gridColumns; n++) e.push({
+				r: t,
+				c: n
+			});
+			return e;
+		});
+		function c(e, t) {
+			i("insert", e, t), a.value = !1;
+		}
+		function l() {
+			a.value = !1, o.value = {
+				rows: 1,
+				cols: 1
+			};
+		}
+		return (n, r) => (U(), j(d, {
+			open: a.value,
+			"onUpdate:open": r[0] ||= (e) => a.value = e,
+			onClose: l
+		}, {
+			trigger: Y(({ toggle: n }) => [P("button", {
+				type: "button",
+				class: "docx-table-grid__btn",
+				disabled: e.disabled,
+				"aria-expanded": a.value,
+				"aria-haspopup": "grid",
+				title: e.tooltip,
+				onClick: Z(n, ["prevent"])
+			}, [I(t, {
+				name: "grid_on",
+				size: 20
+			})], 8, kt)]),
+			panel: Y(() => [P("div", At, [P("div", jt, q(o.value.rows) + " × " + q(o.value.cols), 1), P("div", {
+				class: "docx-table-grid__grid",
+				style: B({ gridTemplateColumns: `repeat(${e.gridColumns}, 18px)` })
+			}, [(U(!0), N(O, null, G(s.value, (e) => (U(), N("button", {
+				key: `${e.r}-${e.c}`,
+				class: z(["docx-table-grid__cell", { "docx-table-grid__cell--active": e.r <= o.value.rows && e.c <= o.value.cols }]),
+				onMouseenter: (t) => o.value = {
+					rows: e.r,
+					cols: e.c
+				},
+				onClick: Z((t) => c(e.r, e.c), ["prevent"])
+			}, null, 42, Mt))), 128))], 4)])]),
+			_: 1
+		}, 8, ["open"]));
+	}
+}), [["__scopeId", "data-v-34f6875c"]]), $ = { class: "docx-table-insert" }, Pt = [
+	"disabled",
+	"title",
+	"onClick"
+], Ft = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "TableInsertButtons",
+	props: { disabled: { type: Boolean } },
+	emits: ["action"],
+	setup(e, { emit: n }) {
+		let r = n, i = [
+			{
+				action: "addRowAbove",
+				icon: "keyboard_arrow_up",
+				label: "Insert row above"
+			},
+			{
+				action: "addRowBelow",
+				icon: "keyboard_arrow_down",
+				label: "Insert row below"
+			},
+			{
+				action: "addColumnLeft",
+				icon: "keyboard_arrow_left",
+				label: "Insert column left"
+			},
+			{
+				action: "addColumnRight",
+				icon: "keyboard_arrow_right",
+				label: "Insert column right"
+			}
+		];
+		return (n, a) => (U(), N("span", $, [(U(), N(O, null, G(i, (n) => P("button", {
+			key: n.action,
+			type: "button",
+			class: "docx-table-insert__btn",
+			disabled: e.disabled,
+			title: n.label,
+			onClick: Z((e) => r("action", n.action), ["prevent"])
+		}, [I(t, {
+			name: n.icon,
+			size: 20
+		}, null, 8, ["name"])], 8, Pt)), 64))]));
+	}
+}), [["__scopeId", "data-v-a11c0f43"]]), It = ["disabled", "title"], Lt = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "TableMergeButton",
+	props: {
+		canSplit: { type: Boolean },
+		disabled: { type: Boolean }
+	},
+	emits: ["action"],
+	setup(e, { emit: n }) {
+		let r = n;
+		return (n, i) => (U(), N("button", {
+			type: "button",
+			class: "docx-table-merge",
+			disabled: e.disabled,
+			title: e.canSplit ? "Split cells" : "Merge cells",
+			onClick: i[0] ||= Z((t) => r("action", e.canSplit ? "splitCells" : "mergeCells"), ["prevent"])
+		}, [I(t, {
+			name: e.canSplit ? "call_split" : "call_merge",
+			size: 20
+		}, null, 8, ["name"])], 8, It));
+	}
+}), [["__scopeId", "data-v-467e6c3e"]]), Rt = ["disabled", "title"], zt = {
+	key: 0,
+	class: "print-btn__icon"
+}, Bt = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "PrintButton",
+	props: {
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		label: { default: "Print" },
+		compact: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["print"],
+	setup(e, { emit: t }) {
+		let n = e, r = t;
+		function i() {
+			n.disabled || (r("print"), window.print());
+		}
+		return (t, n) => (U(), N("button", {
+			class: "print-btn",
+			disabled: e.disabled,
+			title: e.label,
+			onMousedown: Z(i, ["prevent"])
+		}, [F(q(e.compact ? "" : e.label) + " ", 1), e.compact ? (U(), N("span", zt, "🖨")) : M("", !0)], 40, Rt));
+	}
+}), [["__scopeId", "data-v-3e413c06"]]), Vt = "\n@media print {\n  body * { visibility: hidden; }\n  .docx-print-pages, .docx-print-pages * { visibility: visible; }\n  .docx-print-pages { position: absolute; left: 0; top: 0; }\n  .docx-print-page {\n    box-shadow: none !important;\n    margin: 0 !important;\n    page-break-after: always;\n    page-break-inside: avoid;\n  }\n  img { max-width: 100%; page-break-inside: avoid; }\n  table, tr { page-break-inside: avoid; }\n  h1, h2, h3, h4, h5, h6 { page-break-after: avoid; }\n  p { orphans: 3; widows: 3; }\n}\n@page { margin: 0; size: auto; }\n", Ht = /* @__PURE__ */ L({
+	__name: "PrintPreview",
+	setup(e) {
+		return (e, t) => (U(), j(ye("style"), null, {
+			default: Y(() => [F(q(Vt))]),
+			_: 1
+		}));
+	}
+}), Ut = ["title"], Wt = {
+	key: 0,
+	class: "unsaved-indicator__dot"
+}, Gt = {
+	key: 1,
+	class: "unsaved-indicator__badge"
+}, Kt = {
+	key: 2,
+	class: "unsaved-indicator__text"
+}, qt = /* @__PURE__ */ C(/* @__PURE__ */ L({
+	__name: "UnsavedIndicator",
+	props: {
+		currentState: {},
+		warnOnUnload: {
+			type: Boolean,
+			default: !0
+		},
+		variant: { default: "dot" },
+		label: { default: "Unsaved changes" },
+		title: { default: "You have unsaved changes" }
+	},
+	setup(e, { expose: t }) {
+		let n = e, r = W(!1), i = W(0), a = null;
+		be(() => n.currentState, (e) => {
+			if (e !== void 0) {
+				if (a === null) {
+					a = e;
+					return;
+				}
+				e !== a && (r.value = !0, i.value++);
+			}
+		});
+		function o() {
+			a = n.currentState ?? null, r.value = !1, i.value = 0;
+		}
+		function s(e) {
+			r.value && n.warnOnUnload && (e.preventDefault(), e.returnValue = "");
+		}
+		return H(() => {
+			window.addEventListener("beforeunload", s);
+		}), V(() => {
+			window.removeEventListener("beforeunload", s);
+		}), t({
+			hasUnsavedChanges: r,
+			changeCount: i,
+			markAsSaved: o
+		}), (t, n) => r.value ? (U(), N("span", {
+			key: 0,
+			class: z(["unsaved-indicator", `unsaved-indicator--${e.variant}`]),
+			title: e.title
+		}, [e.variant === "dot" ? (U(), N("span", Wt)) : e.variant === "badge" ? (U(), N("span", Gt, q(i.value), 1)) : (U(), N("span", Kt, q(e.label), 1))], 10, Ut)) : M("", !0);
+	}
+}), [["__scopeId", "data-v-769d4022"]]), Jt = Se, Yt = Ce;
+//#endregion
+export { g as AddCommentCard, ut as AlignmentButtons, Ot as Button, Jt as CARD_STYLE_COLLAPSED, Yt as CARD_STYLE_EXPANDED, x as ColorPicker, re as CommentCard, ne as CommentMarginMarkers, ae as DocumentName, l as EditingModeDropdown, ke as EditorToolbar, i as FindReplaceDialog, Ye as FontPicker, et as FontSizePicker, E as FootnotePropertiesDialog, h as HorizontalRuler, e as HyperlinkDialog, u as IconGridDropdown, w as ImagePositionDialog, a as ImagePropertiesDialog, ue as ImageTransformDropdown, ee as ImageWrapDropdown, pe as InsertImageDialog, n as InsertSymbolDialog, he as InsertTableDialog, o as KeyboardShortcutsDialog, rt as LineSpacingPicker, gt as ListButtons, Tt as LoadingIndicator, S as MenuBar, p as MenuDropdown, r as PageSetupDialog, T as PasteSpecialDialog, d as Popover, Bt as PrintButton, Ht as PrintPreview, y as ReplyInput, v as ReplyThread, oe as ResolvedCommentMarker, ze as ResponsiveToolbar, ge as SplitCellDialog, ot as StylePicker, m as TableBorderColorPicker, de as TableBorderPicker, fe as TableBorderWidthPicker, f as TableCellFillPicker, b as TableGridInline, Nt as TableGridPicker, Ft as TableInsertButtons, Lt as TableMergeButton, le as TableMoreDropdown, D as TablePropertiesDialog, me as TableStyleGallery, te as TableToolbar, Ie as TitleBar, c as Toolbar, bt as Tooltip, _ as TrackedChangeCard, ce as UnifiedSidebar, qt as UnsavedIndicator, se as VerticalRuler, yt as ZoomControl, xe as createDefaultListState };