xiaodao-painter 0.1.11 → 0.1.13

package/dist/types/components/painter/Painter.vue.d.ts

@@ -14,7 +14,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
 }>, {
     height: string | number;
     width: string | number;
-    theme: "light" | "dark";
+    theme: "dark" | "light";
     locale: string;
     modelValue: PainterData;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/xiaodao-painter.es.js

@@ -1,5 +1,5 @@
 import { Fragment as e, Teleport as t, computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createStaticVNode as s, createVNode as c, defineComponent as l, inject as u, mergeProps as d, nextTick as f, normalizeClass as p, normalizeStyle as m, onMounted as h, onUnmounted as g, openBlock as _, provide as v, reactive as y, ref as b, renderList as x, resolveDynamicComponent as S, toDisplayString as C, unref as w, vModelText as ee, vShow as T, watch as E, withDirectives as D, withKeys as te, withModifiers as O } from "vue";
-//#region src/components/painter/utils/i18n.ts
+// src/components/painter/utils/i18n.ts
 var ne = {
 	"zh-CN": {
 		"tool.select": "选择",
@@ -79,8 +79,7 @@ var ne = {
 function re(e, t) {
 	return ne[e]?.[t] ?? t;
 }
-//#endregion
-//#region src/components/painter/composables/useI18n.ts
+// src/components/painter/composables/useI18n.ts
 var k = Symbol("wb-locale");
 function A(e) {
 	v(k, e);
@@ -99,8 +98,7 @@ function M(e) {
 function ae() {
 	return u(j, null);
 }
-//#endregion
-//#region src/components/painter/types/index.ts
+// src/components/painter/types/index.ts
 var oe = 800, se = 600, ce = 3, le = 16, ue = 8, N = 0;
 function P() {
 	let e = globalThis.crypto;
@@ -118,8 +116,7 @@ function P() {
 	let n = Array.from(t, (e) => e.toString(16).padStart(2, "0")).join("");
 	return `${n.slice(0, 8)}-${n.slice(8, 12)}-${n.slice(12, 16)}-${n.slice(16, 20)}-${n.slice(20)}`;
 }
-//#endregion
-//#region src/components/painter/stores/canvas.ts
+// src/components/painter/stores/canvas.ts
 var F = b([]), I = b(/* @__PURE__ */ new Set()), L = b("#000000"), de = b("transparent"), R = b("foreground"), z = b(!1), B = b(3), V = b("transparent"), H = b("light"), U = b(0), W = b("#000000"), fe = b(null), G = b(null), K = b(800), q = b(600), J = b(0), Y = b(0), X = b(1), Z = b(!1), Q = null, pe = n(() => `0 0 ${K.value} ${q.value}`), me = n(() => `translate(${J.value}px, ${Y.value}px) scale(${X.value})`);
 function he(e, t) {
 	J.value = e, Y.value = t;
@@ -453,8 +450,7 @@ var ct = y({
 function lt() {
 	return ct;
 }
-//#endregion
-//#region src/components/painter/stores/tools.ts
+// src/components/painter/stores/tools.ts
 var ut = b("select");
 function dt(e) {
 	if (ut.value === "select" && e !== "select") {
@@ -474,8 +470,7 @@ var pt = y({
 function mt() {
 	return pt;
 }
-//#endregion
-//#region src/components/painter/Toolbar.vue?vue&type=script&setup=true&lang.ts
+// src/components/painter/Toolbar.vue?vue&type=script&setup=true&lang.ts
 var ht = { class: "toolbar" }, gt = ["disabled"], _t = { class: "tool-group" }, vt = ["title", "onClick"], yt = {
 	key: 0,
 	class: "tool-icon",
@@ -964,8 +959,7 @@ var ht = { class: "toolbar" }, gt = ["disabled"], _t = { class: "tool-group" },
 	for (let [e, r] of t) n[e] = r;
 	return n;
 }, rn = /*#__PURE__*/ nn(tn, [["__scopeId", "data-v-9532ade7"]]);
-//#endregion
-//#region src/components/painter/utils/geometry.ts
+// src/components/painter/utils/geometry.ts
 function an(e, t, n, r, i = !1, a = .382) {
 	let o = i ? -1 : 1, s = [];
 	for (let i = 0; i < 5; i++) {
@@ -1080,8 +1074,7 @@ function dn(e, t) {
 		default: return !1;
 	}
 }
-//#endregion
-//#region src/components/painter/composables/useDrawing.ts
+// src/components/painter/composables/useDrawing.ts
 function fn(e) {
 	let t = lt(), r = mt(), i = b(!1), a = b({
 		x: 0,
@@ -1192,19 +1185,14 @@ function fn(e) {
 	}
 	function M(n, c, l) {
 		let u = A(n, c);
-		if (t.editingTextId && r.activeTool !== "text" && E(), r.activeTool === "pan") {
-			v.value = !0, y.value = n, x.value = c, S.value = t.panX, C.value = t.panY, window.addEventListener("mousemove", D), window.addEventListener("mouseup", te), window.addEventListener("touchmove", ce, { passive: !1 }), window.addEventListener("touchend", le);
-			return;
-		}
-		if (r.activeTool === "zoom" && l) {
+		if (t.editingTextId && r.activeTool !== "text" && E(), r.activeTool === "pan") v.value = !0, y.value = n, x.value = c, S.value = t.panX, C.value = t.panY, window.addEventListener("mousemove", D), window.addEventListener("mouseup", te), window.addEventListener("touchmove", ce, { passive: !1 }), window.addEventListener("touchend", le);
+		else if (r.activeTool === "zoom" && l) {
 			let r = l.button === 2 ? .8 : 1.25, i = e.value;
 			if (i) {
 				let e = i.getBoundingClientRect();
 				t.zoomAt(n - e.left, c - e.top, r);
 			}
-			return;
-		}
-		if (r.activeTool === "text") {
+		} else if (r.activeTool === "text") {
 			let e = t.editingTextId;
 			if (e) {
 				let n = t.strokes.find((t) => t.id === e);
@@ -1217,9 +1205,7 @@ function fn(e) {
 				}
 			}
 			w.value = !0, a.value = u;
-			return;
-		}
-		if (a.value = u, o.value = u, i.value = !0, r.activeTool === "pencil" && (s.value = [u]), r.activeTool === "select") {
+		} else if (a.value = u, o.value = u, i.value = !0, r.activeTool === "pencil" && (s.value = [u]), r.activeTool === "select") {
 			let e = [...t.strokes].reverse().find((e) => dn(u, e));
 			if (e && t.isSelected(e.id)) {
 				t.pushUndo(), d.value = !0, f.value.clear();
@@ -1254,25 +1240,27 @@ function fn(e) {
 			let e = [...t.strokes].reverse().find((e) => dn(c, e));
 			t.hoveredTextId = e && e.type === "text" ? e.id : null;
 		} else i.value || (t.hoveredTextId = null);
-		if (i.value && (o.value = c, r.activeTool === "pencil" && s.value.push(c), r.activeTool === "select")) if (d.value) {
-			let e = c.x - a.value.x, n = c.y - a.value.y;
-			for (let r of t.selectedStrokes) {
-				let i = f.value.get(r.id);
-				i && t.updateStroke(r.id, {
-					x: i.x + e,
-					y: i.y + n,
-					points: i.points.map((t) => ({
-						x: t.x + e,
-						y: t.y + n
-					}))
-				});
-			}
-		} else t.selectionBox = {
-			x: Math.min(a.value.x, c.x),
-			y: Math.min(a.value.y, c.y),
-			width: Math.abs(c.x - a.value.x),
-			height: Math.abs(c.y - a.value.y)
-		};
+		if (i.value && (o.value = c, r.activeTool === "pencil" && s.value.push(c), r.activeTool === "select")) {
+			if (d.value) {
+				let e = c.x - a.value.x, n = c.y - a.value.y;
+				for (let r of t.selectedStrokes) {
+					let i = f.value.get(r.id);
+					i && t.updateStroke(r.id, {
+						x: i.x + e,
+						y: i.y + n,
+						points: i.points.map((t) => ({
+							x: t.x + e,
+							y: t.y + n
+						}))
+					});
+				}
+			} else t.selectionBox = {
+				x: Math.min(a.value.x, c.x),
+				y: Math.min(a.value.y, c.y),
+				width: Math.abs(c.x - a.value.x),
+				height: Math.abs(c.y - a.value.y)
+			};
+		}
 	}
 	function ce(e) {
 		if (!v.value || e.touches.length !== 1) return;
@@ -1356,7 +1344,7 @@ function fn(e) {
 	}
 	function I(e) {
 		let n = t.strokes.find((t) => t.id === e);
-		n && ((!n.text || !n.text.trim()) && (t.strokes = t.strokes.filter((t) => t.id !== e), t.undoStack.length > 0 && t.undoStack.pop()), t.editingTextId = null, r.activeTool === "text" && r.setTool("select"));
+		n && (n.text && n.text.trim() || (t.strokes = t.strokes.filter((t) => t.id !== e), t.undoStack.length > 0 && t.undoStack.pop()), t.editingTextId = null, r.activeTool === "text" && r.setTool("select"));
 	}
 	function L(e) {
 		t.pushUndo(), t.editingTextId = e;
@@ -1505,76 +1493,69 @@ function fn(e) {
 				};
 			}
 			t.updateStroke(m.value, c);
-			return;
-		}
-		if (l.value) {
-			c = O(i.type, a, s, r.x, r.y), t.updateStroke(m.value, c);
-			return;
-		}
-		if (B(h.value)) {
-			let { x: e, y: t, width: n, height: a } = i;
-			switch (h.value) {
-				case "n": {
-					let i = t + a;
-					c = {
-						x: e,
-						y: Math.min(r.y, i),
-						width: n,
-						height: Math.abs(r.y - i)
-					};
-					break;
-				}
-				case "s":
-					c = {
+		} else if (l.value) c = O(i.type, a, s, r.x, r.y), t.updateStroke(m.value, c);
+		else {
+			if (B(h.value)) {
+				let { x: e, y: t, width: n, height: a } = i;
+				switch (h.value) {
+					case "n": {
+						let i = t + a;
+						c = {
+							x: e,
+							y: Math.min(r.y, i),
+							width: n,
+							height: Math.abs(r.y - i)
+						};
+						break;
+					}
+					case "s":
+						c = {
+							x: e,
+							y: t,
+							width: n,
+							height: Math.abs(r.y - t)
+						};
+						break;
+					case "e":
+						c = {
+							x: e,
+							y: t,
+							width: Math.abs(r.x - e),
+							height: a
+						};
+						break;
+					case "w": {
+						let i = e + n;
+						c = {
+							x: Math.min(r.x, i),
+							y: t,
+							width: Math.abs(r.x - i),
+							height: a
+						};
+						break;
+					}
+					default: c = {
 						x: e,
 						y: t,
 						width: n,
-						height: Math.abs(r.y - t)
-					};
-					break;
-				case "e":
-					c = {
-						x: e,
-						y: t,
-						width: Math.abs(r.x - e),
-						height: a
-					};
-					break;
-				case "w": {
-					let i = e + n;
-					c = {
-						x: Math.min(r.x, i),
-						y: t,
-						width: Math.abs(r.x - i),
 						height: a
 					};
-					break;
 				}
-				default: c = {
-					x: e,
-					y: t,
-					width: n,
-					height: a
-				};
+			} else {
+				let e = z({
+					x: i.x,
+					y: i.y,
+					w: i.width,
+					h: i.height
+				}, h.value);
+				c = O(i.type, e.x, e.y, r.x, r.y);
 			}
-		} else {
-			let e = z({
-				x: i.x,
-				y: i.y,
-				w: i.width,
-				h: i.height
-			}, h.value);
-			c = O(i.type, e.x, e.y, r.x, r.y);
-		}
-		if (_.value?.type === "text") {
-			c.width < 1 && (c.width = 1), t.updateStroke(m.value, {
+			_.value?.type === "text" ? (c.width < 1 && (c.width = 1), t.updateStroke(m.value, {
 				x: c.x,
 				width: c.width,
 				textAutoWidth: !1
-			});
-			return;
+			})) : t.updateStroke(m.value, c);
 		}
-		t.updateStroke(m.value, c);
 	}
 	function fe() {
 		K();
@@ -1625,8 +1606,7 @@ function fn(e) {
 		setTextContentGetter: T
 	};
 }
-//#endregion
-//#region src/components/painter/utils/svg.ts
+// src/components/painter/utils/svg.ts
 function pn(e) {
 	if (e.length === 0) return "";
 	if (e.length === 1) return `M ${e[0].x} ${e[0].y}`;
@@ -1719,8 +1699,7 @@ function mn(e) {
 		};
 	}
 }
-//#endregion
-//#region src/components/painter/StrokeRenderer.vue
+// src/components/painter/StrokeRenderer.vue
 var hn = /*#__PURE__*/ nn(/* @__PURE__ */ l({
 	__name: "StrokeRenderer",
 	props: {
@@ -1922,11 +1901,13 @@ var hn = /*#__PURE__*/ nn(/* @__PURE__ */ l({
 			return e.length === 1 && e[0].type === "text" ? e[0] : null;
 		});
 		function L(e) {
-			if (c.editingTextId) if (e.key === "Enter" && !e.shiftKey) {
-				e.preventDefault(), e.stopPropagation();
-				let t = P.value.get(c.editingTextId), n = t ? t.innerText : "";
-				ae(c.editingTextId, n), f(() => {});
-			} else e.key === "Escape" && (e.preventDefault(), e.stopPropagation(), oe(c.editingTextId));
+			if (c.editingTextId) {
+				if (e.key === "Enter" && !e.shiftKey) {
+					e.preventDefault(), e.stopPropagation();
+					let t = P.value.get(c.editingTextId), n = t ? t.innerText : "";
+					ae(c.editingTextId, n), f(() => {});
+				} else e.key === "Escape" && (e.preventDefault(), e.stopPropagation(), oe(c.editingTextId));
+			}
 		}
 		E(() => c.editingTextId, (e) => {
 			e && f(() => {
@@ -2544,5 +2525,4 @@ var hn = /*#__PURE__*/ nn(/* @__PURE__ */ l({
 		], 6));
 	}
 }), [["__scopeId", "data-v-18ed1ca7"]]);
-//#endregion
 export { se as DEFAULT_CANVAS_HEIGHT, oe as DEFAULT_CANVAS_WIDTH, le as DEFAULT_FONT_SIZE, ue as HIT_THRESHOLD, nr as Painter, nr as default, ce as STROKE_WIDTH };

package/dist/xiaodao-painter.umd.js

@@ -1 +1 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("vue")):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.XiaodaoPainter={},e.Vue))})(this,function(e,t){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var n={"zh-CN":{"tool.select":`选择`,"tool.pencil":`铅笔`,"tool.line":`直线`,"tool.circle":`圆形`,"tool.rect":`矩形`,"tool.triangle":`三角形`,"tool.star":`五角星`,"tool.pan":`移动画布`,"tool.zoom":`缩放`,"tool.text":`文本框`,"color.foreground":`前景色（描边）`,"color.background":`背景色（填充）`,"color.textColor":`文本颜色`,"palette.stroke":`描边颜色`,"palette.fill":`填充颜色`,"palette.custom":`自定义颜色`,"toolbar.undo":`撤销`,"toolbar.redo":`重做`,"toolbar.bringToFront":`上移图层`,"toolbar.sendToBack":`下移图层`,"toolbar.delete":`删除`,"zoom.label":`缩放：{percent}%`,"zoom.zoomIn":`放大`,"zoom.zoomOut":`缩小`,"canvasSize.title":`画布设置`,"canvasSize.width":`宽度`,"canvasSize.height":`高度`,"canvasSize.confirm":`确定`,"canvasSize.cancel":`取消`,"canvasSize.background":`背景`,"canvasSize.transparent":`透明`,"canvasSize.solidColor":`纯色`,"textAlign.left":`左对齐`,"textAlign.center":`居中`,"textAlign.right":`右对齐`},"en-US":{"tool.select":`Select`,"tool.pencil":`Pencil`,"tool.line":`Line`,"tool.circle":`Circle`,"tool.rect":`Rectangle`,"tool.triangle":`Triangle`,"tool.star":`Star`,"tool.pan":`Pan Canvas`,"tool.zoom":`Zoom`,"tool.text":`Text`,"color.foreground":`Stroke Color`,"color.background":`Fill Color`,"color.textColor":`Text Color`,"palette.stroke":`Stroke Color`,"palette.fill":`Fill Color`,"palette.custom":`Custom Color`,"toolbar.undo":`Undo`,"toolbar.redo":`Redo`,"toolbar.bringToFront":`Bring to Front`,"toolbar.sendToBack":`Send to Back`,"toolbar.delete":`Delete`,"zoom.label":`Zoom: {percent}%`,"zoom.zoomIn":`Zoom In`,"zoom.zoomOut":`Zoom Out`,"canvasSize.title":`Canvas Settings`,"canvasSize.width":`Width`,"canvasSize.height":`Height`,"canvasSize.confirm":`OK`,"canvasSize.cancel":`Cancel`,"canvasSize.background":`Background`,"canvasSize.transparent":`Transparent`,"canvasSize.solidColor":`Solid Color`,"textAlign.left":`Align Left`,"textAlign.center":`Align Center`,"textAlign.right":`Align Right`}};function r(e,t){return n[e]?.[t]??t}var i=Symbol(`wb-locale`);function a(e){(0,t.provide)(i,e)}function o(){let e=(0,t.inject)(i,`zh-CN`);return{locale:e,t:t=>r(e,t)}}var s=Symbol(`wb-root-el`);function c(e){(0,t.provide)(s,e)}function l(){return(0,t.inject)(s,null)}var u=800,d=600,f=3,p=16,m=8,h=0;function g(){let e=globalThis.crypto;if(e&&typeof e.randomUUID==`function`)return e.randomUUID();let t=new Uint8Array(16);if(e&&typeof e.getRandomValues==`function`)e.getRandomValues(t);else{let e=Date.now(),n=h++;for(let r=0;r<t.length;r++){let i=Math.floor(e/2**(r%6*8))%256,a=Math.floor(n/2**(r%4*8))%256;t[r]=Math.floor(Math.random()*256)^i^a}}t[6]=t[6]&15|64,t[8]=t[8]&63|128;let n=Array.from(t,e=>e.toString(16).padStart(2,`0`)).join(``);return`${n.slice(0,8)}-${n.slice(8,12)}-${n.slice(12,16)}-${n.slice(16,20)}-${n.slice(20)}`}var _=(0,t.ref)([]),v=(0,t.ref)(new Set),y=(0,t.ref)(`#000000`),b=(0,t.ref)(`transparent`),x=(0,t.ref)(`foreground`),S=(0,t.ref)(!1),C=(0,t.ref)(3),w=(0,t.ref)(`transparent`),T=(0,t.ref)(`light`),E=(0,t.ref)(0),D=(0,t.ref)(`#000000`),O=(0,t.ref)(null),k=(0,t.ref)(null),A=(0,t.ref)(800),j=(0,t.ref)(600),M=(0,t.ref)(0),N=(0,t.ref)(0),P=(0,t.ref)(1),F=(0,t.ref)(!1),I=null,L=(0,t.computed)(()=>`0 0 ${A.value} ${j.value}`),R=(0,t.computed)(()=>`translate(${M.value}px, ${N.value}px) scale(${P.value})`);function z(e,t){M.value=e,N.value=t}function B(e,t){A.value=e,j.value=t,E.value++}var V=[.1,.25,.33,.5,.67,.75,1,1.25,1.5,2,3,4,5,6,8,10];function H(e,t,n){let r=P.value,i=n>1,a=null;for(let e of V)if(i){if(e>r+.001){a=e;break}}else e<r-.001&&(a=e);if(a===null)return;let o=(e-M.value)/r,s=(t-N.value)/r;M.value=e-o*a,N.value=t-s*a,P.value=a,F.value=!0,I&&clearTimeout(I),I=setTimeout(()=>{F.value=!1},1500)}function ee(e,t,n){let r=V[0],i=V[V.length-1];n=Math.max(r,Math.min(i,n));let a=P.value,o=(e-M.value)/a,s=(t-N.value)/a;M.value=e-o*n,N.value=t-s*n,P.value=n,F.value=!0,I&&clearTimeout(I),I=setTimeout(()=>{F.value=!1},1500)}function te(){return Math.round(P.value*100)}var U=(0,t.ref)([]),W=(0,t.ref)([]),G=(0,t.ref)(!1),K=(0,t.ref)(null);function q(e){C.value=e}function ne(e){w.value=e,E.value++}function re(){S.value=!S.value}function ie(){S.value=!1}var J=(0,t.computed)(()=>_.value.filter(e=>v.value.has(e.id))),ae=(0,t.computed)(()=>{let e=J.value.filter(e=>e.type!==`text`);if(e.length===0)return null;let t=e[0].strokeColor;return e.every(e=>e.strokeColor===t)?t:null}),oe=(0,t.computed)(()=>{let e=J.value.filter(e=>e.type!==`line`&&e.type!==`pencil`&&e.type!==`text`);if(e.length===0)return null;let t=e[0].fillColor;return e.every(e=>e.fillColor===t)?t:null}),se=(0,t.computed)(()=>{let e=J.value.filter(e=>e.type===`text`);if(e.length===0)return null;let t=e[0].textColor??y.value;return e.every(e=>(e.textColor??y.value)===t)?t:null}),ce=(0,t.computed)(()=>{let e=J.value;return e.length===1?e[0]:null}),le=(0,t.computed)(()=>ce.value?.id??null);function ue(e){return v.value.has(e)}function de(e){v.value=e?new Set([e]):new Set}function fe(e){v.value=new Set(e)}function pe(){v.value=new Set}function me(e){X(),_.value.push(e)}function he(e,t){let n=_.value.findIndex(t=>t.id===e);if(n===-1)return;let r={...t};r.x!==void 0&&(r.x=Math.round(r.x)),r.y!==void 0&&(r.y=Math.round(r.y)),r.width!==void 0&&(r.width=Math.round(r.width)),r.height!==void 0&&(r.height=Math.round(r.height)),r.points&&=r.points.map(e=>({x:Math.round(e.x),y:Math.round(e.y)})),_.value[n]={..._.value[n],...r}}function ge(){let e=v.value;e.size!==0&&(X(),_.value=_.value.filter(t=>!e.has(t.id)),v.value=new Set)}var _e=(0,t.computed)(()=>U.value.length>0),ve=(0,t.computed)(()=>W.value.length>0),Y=(0,t.ref)([]);function ye(){v.value.size!==0&&(Y.value=J.value.map(e=>Se(e)),ge())}function be(){v.value.size!==0&&(Y.value=J.value.map(e=>Se(e)))}function xe(){if(Y.value.length===0)return;X(),pe();let e=[];for(let t of Y.value){let n={...Se(t),id:Me(),x:t.x+20,y:t.y+20,points:t.points.map(e=>({x:e.x+20,y:e.y+20}))};_.value.push(n),e.push(n.id)}fe(e)}function Se(e){return{...e,points:e.points.map(e=>({...e}))}}function X(){U.value.push(_.value.map(e=>({...e,points:e.points.map(e=>({...e}))}))),W.value=[]}function Ce(){U.value.length!==0&&(W.value.push(_.value.map(e=>({...e,points:e.points.map(e=>({...e}))}))),_.value=U.value.pop(),v.value=new Set)}function we(){W.value.length!==0&&(U.value.push(_.value.map(e=>({...e,points:e.points.map(e=>({...e}))}))),_.value=W.value.pop(),v.value=new Set)}function Te(){let e=v.value;if(e.size===0)return;X();let t=_.value.map((t,n)=>e.has(t.id)?n:-1).filter(e=>e>=0).sort((e,t)=>t-e);for(let e of t)e<_.value.length-1&&([_.value[e],_.value[e+1]]=[_.value[e+1],_.value[e]])}function Ee(){let e=v.value;if(e.size===0)return;X();let t=_.value.map((t,n)=>e.has(t.id)?n:-1).filter(e=>e>=0).sort((e,t)=>e-t);for(let e of t)e>0&&([_.value[e],_.value[e-1]]=[_.value[e-1],_.value[e]])}var De=!1;function Oe(e){if(De)return;De=!0,_.value=Array.isArray(e)?e.map(e=>({...e,points:e.points.map(e=>({...e}))})):[];let t=new Set(_.value.map(e=>e.id));v.value=new Set([...v.value].filter(e=>t.has(e))),setTimeout(()=>{De=!1},0)}function ke(e){let{x:t,y:n,width:r,height:i,type:a}=e;return a===`line`||a===`triangle`||a===`star`?{x:r>=0?t:t+r,y:i>=0?n:n+i,width:Math.abs(r),height:Math.abs(i)}:{x:t,y:n,width:r,height:i}}function Ae(e){x.value=e}function je(e){if(v.value.size>0){X();for(let t of v.value){let n=_.value.find(e=>e.id===t);if(x.value===`foreground`){if(e===`transparent`||n?.type===`text`)continue;he(t,{strokeColor:e})}else if(x.value===`textColor`){if(e===`transparent`)return;he(t,{textColor:e})}else{if(n?.type===`text`)continue;he(t,{fillColor:e})}}E.value++}else if(x.value===`foreground`){if(e===`transparent`)return;y.value=e}else if(x.value===`textColor`){if(e===`transparent`)return;D.value=e}else b.value=e}function Me(){return g()}function Ne(e,t,n,r,i,a){return{id:Me(),type:e,x:Math.round(t),y:Math.round(n),width:Math.round(r),height:Math.round(i),points:a.map(e=>({x:Math.round(e.x),y:Math.round(e.y)})),strokeColor:y.value,fillColor:e===`pencil`||e===`line`?`none`:b.value,strokeWidth:C.value,...e===`text`?{text:``,fontSize:16,textAlign:`left`,textColor:y.value,textAutoWidth:!0,fillColor:`transparent`,strokeColor:`transparent`,width:0,height:0}:{}}}function Pe(){_.value=[],v.value=new Set,y.value=`#000000`,b.value=`transparent`,x.value=`foreground`,S.value=!1,C.value=3,w.value=`transparent`,T.value=`light`,E.value=0,D.value=`#000000`,O.value=null,k.value=null,A.value=800,j.value=600,M.value=0,N.value=0,P.value=1,F.value=!1,I&&=(clearTimeout(I),null),U.value=[],W.value=[],G.value=!1,K.value=null,Y.value=[]}var Fe=(0,t.reactive)({strokes:_,selectedStrokeIds:v,selectedStrokeId:le,selectedStroke:ce,selectedStrokes:J,selectedStrokeColor:ae,selectedFillColor:oe,selectedTextColor:se,foregroundColor:y,backgroundColor:b,activeColorSlot:x,showColorPalette:S,isSelecting:G,selectionBox:K,toggleColorPalette:re,hideColorPalette:ie,addStroke:me,updateStroke:he,selectStroke:de,selectStrokes:fe,clearSelection:pe,isSelected:ue,deleteSelectedStrokes:ge,setColorSlot:Ae,setColor:je,buildStroke:Ne,strokeWidth:C,setStrokeWidth:q,canvasBackgroundColor:w,setCanvasBackgroundColor:ne,canUndo:_e,canRedo:ve,undoStack:U,pushUndo:X,undo:Ce,redo:we,moveSelectedUp:Te,moveSelectedDown:Ee,syncFromParent:Oe,getStrokeDisplayBounds:ke,clipboard:Y,cutSelectedStrokes:ye,copySelectedStrokes:be,pasteStrokes:xe,canvasWidth:A,canvasHeight:j,panX:M,panY:N,zoomLevel:P,showZoomIndicator:F,viewBox:L,canvasTransform:R,setPan:z,setCanvasSize:B,zoomAt:H,continuousZoomAt:ee,getZoomPercent:te,dataVersion:E,theme:T,textColor:D,editingTextId:O,hoveredTextId:k,reset:Pe});function Z(){return Fe}var Ie=(0,t.ref)(`select`);function Le(e){if(Ie.value===`select`&&e!==`select`){let e=Z();e.selectedStrokeIds.size>0&&e.clearSelection()}Ie.value=e}function Re(){Ie.value=`select`}var ze=(0,t.reactive)({activeTool:Ie,setTool:Le,reset:Re});function Be(){return ze}var Ve={class:`toolbar`},He=[`disabled`],Ue={class:`tool-group`},We=[`title`,`onClick`],Ge={key:0,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.6`,"stroke-linecap":`round`,"stroke-linejoin":`round`},Ke={key:1,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`},qe={key:2,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`,"stroke-linejoin":`round`},Je={key:3,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`},Ye={key:4,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`},Xe={key:5,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linejoin":`round`},Ze={key:6,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linejoin":`round`},Qe={key:7,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linejoin":`round`},$e={key:8,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`,"stroke-linejoin":`round`},et={class:`tool-group nav-group`},tt=[`title`],nt=[`disabled`],rt={class:`canvas-size-wrapper`},it=[`title`],at={class:`popover-title`},ot={class:`popover-field`},st={class:`popover-label`},ct={class:`popover-field`},lt={class:`popover-label`},ut={class:`popover-field`},dt={class:`popover-label`},ft={class:`bg-color-row`},pt=[`title`],mt=[`value`],ht=[`title`],gt={class:`popover-actions`},_t={class:`color-section`},vt=[`title`],yt={class:`color-swatch text-color-swatch`},bt={key:0,class:`mixed-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},xt=[`title`],St={key:0,class:`mixed-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},Ct=[`title`],wt={key:0,class:`mixed-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},Tt={key:1,class:`mixed-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},Et=42,Dt=(0,t.defineComponent)({__name:`Toolbar`,setup(e){let n=Be(),r=Z(),{t:i}=o(),a=l(),s=(0,t.ref)(null),c=(0,t.ref)(!1),u=(0,t.ref)(!1);function d(){let e=s.value;e&&(c.value=e.scrollTop>0,u.value=e.scrollTop+e.clientHeight<e.scrollHeight-1)}function f(){let e=s.value;e&&e.scrollBy({top:-42,behavior:`smooth`})}function p(){let e=s.value;e&&e.scrollBy({top:Et,behavior:`smooth`})}let m=null;(0,t.onMounted)(()=>{m=new ResizeObserver(()=>d()),s.value&&m.observe(s.value),d()}),(0,t.onUnmounted)(()=>{m?.disconnect()});let h=[`select`,`pan`,`pencil`,`line`,`circle`,`rect`,`triangle`,`star`,`text`],g=(0,t.computed)(()=>r.selectedStrokeIds.size>0),_=(0,t.ref)(!1),v=(0,t.ref)({width:r.canvasWidth,height:r.canvasHeight}),y=(0,t.ref)(r.canvasBackgroundColor);function b(){v.value={width:r.canvasWidth,height:r.canvasHeight},y.value=r.canvasBackgroundColor,_.value=!0}let x=(0,t.ref)(null);function S(){x.value?.click()}function C(e){let t=e.target;y.value=t.value}function w(){y.value=`transparent`}function T(){let e=Math.max(1,Math.round(v.value.width)),t=Math.max(1,Math.round(v.value.height));r.setCanvasSize(e,t),r.setCanvasBackgroundColor(y.value),_.value=!1}function E(){_.value=!1}let D=(0,t.computed)(()=>{if(!a?.value)return{};let e=a.value.getBoundingClientRect();return{left:e.left+52+12+`px`,bottom:window.innerHeight-e.bottom+80+`px`,position:`fixed`}});function O(e){e.target.classList.contains(`canvas-size-backdrop`)&&(_.value=!1)}function k(e){e.key===`Escape`&&(_.value=!1)}let A=(0,t.computed)(()=>g.value&&r.selectedStrokeColor!==null?r.selectedStrokeColor:r.foregroundColor),j=(0,t.computed)(()=>!F.value&&g.value&&r.selectedStrokeColor===null),M=(0,t.computed)(()=>g.value&&r.selectedFillColor!==null?r.selectedFillColor:r.backgroundColor),N=(0,t.computed)(()=>!F.value&&g.value&&r.selectedFillColor===null),P=(0,t.computed)(()=>r.selectedStrokes.some(e=>e.type===`text`)),F=(0,t.computed)(()=>g.value&&r.selectedStrokes.every(e=>e.type===`text`)),I=(0,t.computed)(()=>F.value),L=(0,t.computed)(()=>F.value),R=(0,t.computed)(()=>g.value&&r.selectedTextColor!==null?r.selectedTextColor:r.textColor),z=(0,t.computed)(()=>P.value&&r.selectedTextColor===null);function B(){r.setColorSlot(`textColor`),r.toggleColorPalette()}function V(){I.value||(r.setColorSlot(`foreground`),r.toggleColorPalette())}function H(){L.value||(r.setColorSlot(`background`),r.toggleColorPalette())}return(e,a)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,Ve,[c.value||u.value?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,class:`scroll-btn scroll-up`,disabled:!c.value,onClick:f},[...a[3]||=[(0,t.createElementVNode)(`svg`,{class:`scroll-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`polyline`,{points:`18 15 12 9 6 15`})],-1)]],8,He)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,{ref_key:`toolsScrollRef`,ref:s,class:`tools-scroll`,onScroll:d},[(0,t.createElementVNode)(`div`,Ue,[((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(h,e=>(0,t.createElementVNode)(`button`,{key:e,class:(0,t.normalizeClass)([`tool-btn`,{active:(0,t.unref)(n).activeTool===e}]),title:(0,t.unref)(i)(`tool.${e}`),onClick:r=>(0,t.unref)(n).setTool(e)},[e===`select`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Ge,[...a[4]||=[(0,t.createElementVNode)(`path`,{d:`M4.5 3.5l5.5 15 2.5-6 6-2.5z`},null,-1)]])):e===`pan`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Ke,[...a[5]||=[(0,t.createStaticVNode)(`<line x1="12" y1="4" x2="12" y2="20" data-v-9532ade7></line><line x1="4" y1="12" x2="20" y2="12" data-v-9532ade7></line><polygon points="12,4 9,8 15,8" fill="currentColor" stroke="none" data-v-9532ade7></polygon><polygon points="12,20 9,16 15,16" fill="currentColor" stroke="none" data-v-9532ade7></polygon><polygon points="4,12 8,9 8,15" fill="currentColor" stroke="none" data-v-9532ade7></polygon><polygon points="20,12 16,9 16,15" fill="currentColor" stroke="none" data-v-9532ade7></polygon>`,6)]])):e===`pencil`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,qe,[...a[6]||=[(0,t.createElementVNode)(`path`,{d:`M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z`},null,-1),(0,t.createElementVNode)(`path`,{d:`m15 5 4 4`},null,-1)]])):e===`line`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Je,[...a[7]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`19`,x2:`19`,y2:`5`},null,-1)]])):e===`circle`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Ye,[...a[8]||=[(0,t.createElementVNode)(`circle`,{cx:`12`,cy:`12`,r:`9`},null,-1)]])):e===`rect`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Xe,[...a[9]||=[(0,t.createElementVNode)(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`},null,-1)]])):e===`triangle`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Ze,[...a[10]||=[(0,t.createElementVNode)(`polygon`,{points:`12,3 22,21 2,21`},null,-1)]])):e===`star`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Qe,[...a[11]||=[(0,t.createElementVNode)(`polygon`,{points:`12,2 15.09,8.26 22,9.27 17,14.14 18.18,21.02 12,17.77 5.82,21.02 7,14.14 2,9.27 8.91,8.26`},null,-1)]])):e===`text`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,$e,[...a[12]||=[(0,t.createElementVNode)(`polyline`,{points:`4 7 4 4 20 4 20 7`},null,-1),(0,t.createElementVNode)(`line`,{x1:`9`,y1:`20`,x2:`15`,y2:`20`},null,-1),(0,t.createElementVNode)(`line`,{x1:`12`,y1:`4`,x2:`12`,y2:`20`},null,-1)]])):(0,t.createCommentVNode)(``,!0)],10,We)),64))]),(0,t.createElementVNode)(`div`,et,[(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`tool-btn`,{active:(0,t.unref)(n).activeTool===`zoom`}]),title:(0,t.unref)(i)(`tool.zoom`),onClick:a[0]||=e=>(0,t.unref)(n).setTool(`zoom`)},[...a[13]||=[(0,t.createStaticVNode)(`<svg class="tool-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" data-v-9532ade7><circle cx="11" cy="11" r="8" data-v-9532ade7></circle><line x1="21" y1="21" x2="16.65" y2="16.65" data-v-9532ade7></line><line x1="11" y1="8" x2="11" y2="14" data-v-9532ade7></line><line x1="8" y1="11" x2="14" y2="11" data-v-9532ade7></line></svg>`,1)]],10,tt)])],544),c.value||u.value?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:1,class:`scroll-btn scroll-down`,disabled:!u.value,onClick:p},[...a[14]||=[(0,t.createElementVNode)(`svg`,{class:`scroll-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`polyline`,{points:`6 9 12 15 18 9`})],-1)]],8,nt)):(0,t.createCommentVNode)(``,!0),a[24]||=(0,t.createElementVNode)(`div`,{class:`spacer`},null,-1),(0,t.createElementVNode)(`div`,rt,[(0,t.createElementVNode)(`button`,{class:`tool-btn`,title:(0,t.unref)(i)(`canvasSize.title`),onClick:b},[...a[15]||=[(0,t.createElementVNode)(`svg`,{class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`rect`,{x:`2`,y:`2`,width:`20`,height:`14`,rx:`1.5`}),(0,t.createElementVNode)(`line`,{x1:`7`,y1:`16`,x2:`5`,y2:`22`}),(0,t.createElementVNode)(`line`,{x1:`17`,y1:`16`,x2:`19`,y2:`22`})],-1)]],8,it),((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:`body`},[_.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`canvas-size-backdrop`,onMousedown:O},[(0,t.createElementVNode)(`div`,{class:`canvas-size-popover`,style:(0,t.normalizeStyle)(D.value),onKeydown:k},[(0,t.createElementVNode)(`div`,at,(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.title`)),1),(0,t.createElementVNode)(`div`,ot,[(0,t.createElementVNode)(`label`,st,(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.width`)),1),(0,t.withDirectives)((0,t.createElementVNode)(`input`,{ref:`widthInput`,"onUpdate:modelValue":a[1]||=e=>v.value.width=e,type:`number`,min:`1`,class:`popover-input`,onKeydown:(0,t.withKeys)(T,[`enter`])},null,544),[[t.vModelText,v.value.width,void 0,{number:!0}]]),a[16]||=(0,t.createElementVNode)(`span`,{class:`popover-unit`},`px`,-1)]),(0,t.createElementVNode)(`div`,ct,[(0,t.createElementVNode)(`label`,lt,(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.height`)),1),(0,t.withDirectives)((0,t.createElementVNode)(`input`,{"onUpdate:modelValue":a[2]||=e=>v.value.height=e,type:`number`,min:`1`,class:`popover-input`,onKeydown:(0,t.withKeys)(T,[`enter`])},null,544),[[t.vModelText,v.value.height,void 0,{number:!0}]]),a[17]||=(0,t.createElementVNode)(`span`,{class:`popover-unit`},`px`,-1)]),(0,t.createElementVNode)(`div`,ut,[(0,t.createElementVNode)(`label`,dt,(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.background`)),1),(0,t.createElementVNode)(`div`,ft,[(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`bg-radio-btn`,{active:y.value!==`transparent`}]),title:(0,t.unref)(i)(`canvasSize.solidColor`),onClick:S},[(0,t.createElementVNode)(`span`,{class:`bg-color-fill`,style:(0,t.normalizeStyle)({background:y.value===`transparent`?`#ffffff`:y.value})},null,4),(0,t.createElementVNode)(`input`,{ref_key:`hiddenColorInput`,ref:x,type:`color`,class:`hidden-color-input`,value:y.value===`transparent`?`#ffffff`:y.value,onChange:C},null,40,mt)],10,pt),(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`bg-radio-btn`,`bg-radio-btn--transparent`,{active:y.value===`transparent`}]),title:(0,t.unref)(i)(`canvasSize.transparent`),onClick:w},[...a[18]||=[(0,t.createElementVNode)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`5`,x2:`19`,y2:`19`})],-1)]],10,ht)])]),(0,t.createElementVNode)(`div`,gt,[(0,t.createElementVNode)(`button`,{class:`popover-btn cancel`,onClick:E},(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.cancel`)),1),(0,t.createElementVNode)(`button`,{class:`popover-btn confirm`,onClick:T},(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.confirm`)),1)])],36)],32)):(0,t.createCommentVNode)(``,!0)]))]),(0,t.createElementVNode)(`div`,_t,[P.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)([`color-indicator`,{active:(0,t.unref)(r).showColorPalette&&(0,t.unref)(r).activeColorSlot===`textColor`}]),title:(0,t.unref)(i)(`color.textColor`),onClick:B},[(0,t.createElementVNode)(`div`,yt,[((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,{class:`text-color-icon`,style:(0,t.normalizeStyle)({color:z.value?`var(--wb-text-secondary)`:R.value}),viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[...a[19]||=[(0,t.createElementVNode)(`polyline`,{points:`4 7 4 4 20 4 20 7`},null,-1),(0,t.createElementVNode)(`line`,{x1:`9`,y1:`20`,x2:`15`,y2:`20`},null,-1),(0,t.createElementVNode)(`line`,{x1:`12`,y1:`4`,x2:`12`,y2:`20`},null,-1)]],4)),z.value?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,bt,[...a[20]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`},null,-1),(0,t.createElementVNode)(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`},null,-1)]])):(0,t.createCommentVNode)(``,!0)])],10,vt)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`color-indicator`,{active:(0,t.unref)(r).showColorPalette&&(0,t.unref)(r).activeColorSlot===`foreground`,disabled:I.value}]),title:(0,t.unref)(i)(`color.foreground`),onClick:V},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`color-swatch fg`,{mixed:j.value}]),style:(0,t.normalizeStyle)({background:j.value?`none`:A.value})},[j.value?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,St,[...a[21]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`},null,-1),(0,t.createElementVNode)(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`},null,-1)]])):(0,t.createCommentVNode)(``,!0)],6)],10,xt),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`color-indicator`,{active:(0,t.unref)(r).showColorPalette&&(0,t.unref)(r).activeColorSlot===`background`,disabled:L.value}]),title:(0,t.unref)(i)(`color.background`),onClick:H},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`color-swatch bg`,{mixed:N.value,transparent:!N.value&&M.value===`transparent`}]),style:(0,t.normalizeStyle)({background:N.value||M.value===`transparent`?`none`:M.value})},[N.value?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,wt,[...a[22]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`},null,-1),(0,t.createElementVNode)(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`},null,-1)]])):M.value===`transparent`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Tt,[...a[23]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`5`,x2:`19`,y2:`19`},null,-1)]])):(0,t.createCommentVNode)(``,!0)],6)],10,Ct)])]))}}),Q=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},Ot=Q(Dt,[[`__scopeId`,`data-v-9532ade7`]]);function kt(e,t,n,r,i=!1,a=.382){let o=i?-1:1,s=[];for(let i=0;i<5;i++){let c=Math.PI/2*-1+Math.PI*2*i/5,l=c+Math.PI/5;s.push({x:e+n*Math.cos(c),y:t-o*r*Math.sin(c)}),s.push({x:e+n*a*Math.cos(l),y:t-o*r*a*Math.sin(l)})}return s}function At(e,t,n,r){let i=n>=0?e:e+n,a=r>=0?t:t+r,o=Math.abs(n),s=Math.abs(r);return r>=0?[{x:i+o/2,y:a},{x:i+o,y:a+s},{x:i,y:a+s}]:[{x:i+o/2,y:a+s},{x:i,y:a},{x:i+o,y:a}]}function jt(e,t,n){let r=n.x-t.x,i=n.y-t.y,a=r*r+i*i;if(a===0)return Math.hypot(e.x-t.x,e.y-t.y);let o=((e.x-t.x)*r+(e.y-t.y)*i)/a;return o=Math.max(0,Math.min(1,o)),Math.hypot(e.x-(t.x+o*r),e.y-(t.y+o*i))}function Mt(e,t){let n=!1;for(let r=0,i=t.length-1;r<t.length;i=r++){let a=t[r].x,o=t[r].y,s=t[i].x,c=t[i].y;o>e.y!=c>e.y&&e.x<(s-a)*(e.y-o)/(c-o)+a&&(n=!n)}return n}function Nt(e,t,n,r,i){if(r<=0||i<=0)return!1;let a=(e.x-t)/r,o=(e.y-n)/i;return a*a+o*o<=1}function Pt(e){if(e.length===0)return{x:0,y:0,width:0,height:0};let t=1/0,n=1/0,r=-1/0,i=-1/0;for(let a of e)a.x<t&&(t=a.x),a.y<n&&(n=a.y),a.x>r&&(r=a.x),a.y>i&&(i=a.y);return{x:t,y:n,width:r-t,height:i-n}}function Ft(e,t){let{x:n,y:r,width:i,height:a,type:o,points:s,fillColor:c}=t,l=c!==`none`&&c!==`transparent`;switch(o){case`pencil`:if(s.length<2)return!1;for(let t=0;t<s.length-1;t++)if(jt(e,s[t],s[t+1])<8)return!0;return!1;case`line`:return jt(e,{x:n,y:r},{x:n+i,y:r+a})<8;case`circle`:{let t=n+i/2,o=r+a/2,s=Math.abs(i)/2,c=Math.abs(a)/2;return l&&Nt(e,t,o,s,c)?!0:Nt(e,t,o,s+8,c+8)&&!Nt(e,t,o,s-8,c-8)}case`rect`:{if(l&&e.x>=n&&e.x<=n+i&&e.y>=r&&e.y<=r+a)return!0;let t=e.x>=n-8&&e.x<=n+i+8&&e.y>=r-8&&e.y<=r+a+8,o=e.x>=n+8&&e.x<=n+i-8&&e.y>=r+8&&e.y<=r+a-8;return t&&!o}case`triangle`:{let t=At(n,r,i,a);return l&&Mt(e,t)?!0:Mt(e,t)}case`star`:{let t=kt(n+i/2,r+a/2,Math.abs(i)/2,Math.abs(a)/2,a>=0);return l&&Mt(e,t)?!0:Mt(e,t)}case`text`:return e.x>=n-8&&e.x<=n+Math.max(i,32)+8&&e.y>=r-8&&e.y<=r+Math.max(a,16)+8;default:return!1}}function It(e){let n=Z(),r=Be(),i=(0,t.ref)(!1),a=(0,t.ref)({x:0,y:0}),o=(0,t.ref)({x:0,y:0}),s=(0,t.ref)([]),c=(0,t.ref)(!1),l=(0,t.ref)(!1),u=(0,t.ref)(!1),d=(0,t.ref)(!1),f=(0,t.ref)(new Map),p=(0,t.ref)(!1),m=(0,t.ref)(null),h=(0,t.ref)(``),g=(0,t.ref)(``),_=(0,t.ref)(null),v=(0,t.ref)(!1),y=(0,t.ref)(0),b=(0,t.ref)(0),x=(0,t.ref)(0),S=(0,t.ref)(0),C=(0,t.ref)(!1),w=null;function T(e){w=e}function E(){let e=n.editingTextId;if(!e||!n.strokes.find(t=>t.id===e))return;let t=w?.()??null;t!==null&&(t.trim()?n.updateStroke(e,{text:t}):(n.strokes=n.strokes.filter(t=>t.id!==e),n.undoStack.length>0&&n.undoStack.pop()),n.editingTextId=null)}function D(e){if(!v.value)return;let t=e.clientX-y.value,r=e.clientY-b.value;n.setPan(x.value+t,S.value+r)}function O(){v.value&&(v.value=!1,window.removeEventListener(`mousemove`,D),window.removeEventListener(`mouseup`,O),window.removeEventListener(`touchmove`,B),window.removeEventListener(`touchend`,V))}function k(e,t,n,r,i){let a=r-t,o=i-n,s=e===`circle`||e===`rect`||e===`triangle`||e===`star`;if(e===`line`&&u.value){let e=Math.round(Math.atan2(o,a)/(Math.PI/4))*(Math.PI/4),t=Math.hypot(a,o);a=Math.cos(e)*t,o=Math.sin(e)*t}if(s){if(c.value){let e=Math.max(Math.abs(a),Math.abs(o));a=a>=0?e:-e,o=o>=0?e:-e}if(l.value){let e=A(t,n,t+a,n+o),r=e.width,i=e.height;return{x:t-r,y:n-i,width:r*2,height:i*2}}}return e===`line`||e===`triangle`||e===`star`?{x:t,y:n,width:a,height:o}:A(t,n,t+a,n+o)}function A(e,t,n,r){return{x:Math.min(e,n),y:Math.min(t,r),width:Math.abs(n-e),height:Math.abs(r-t)}}let j=(0,t.computed)(()=>{if(!i.value)return null;let e=r.activeTool;if(e===`select`||e===`pan`||e===`zoom`||e===`text`)return null;let{x:t,y:c}=a.value,{x:l,y:u}=o.value;return e===`pencil`?{id:`__preview__`,type:`pencil`,...Pt(s.value),points:[...s.value],strokeColor:n.foregroundColor,fillColor:`none`,strokeWidth:n.strokeWidth}:{id:`__preview__`,type:e,...k(e,t,c,l,u),points:[],strokeColor:n.foregroundColor,fillColor:e===`line`?`none`:n.backgroundColor,strokeWidth:n.strokeWidth}});function M(e){return N(e.clientX,e.clientY)}function N(t,r){let i=e.value;if(!i)return{x:0,y:0};let a=i.getBoundingClientRect();return{x:(t-a.left)/n.zoomLevel,y:(r-a.top)/n.zoomLevel}}function P(e){I(e.clientX,e.clientY,e.type===`mousedown`?e:void 0)}function F(e){if(e.touches.length!==1)return;e.preventDefault();let t=e.touches[0];I(t.clientX,t.clientY)}function I(t,c,l){let u=N(t,c);if(n.editingTextId&&r.activeTool!==`text`&&E(),r.activeTool===`pan`){v.value=!0,y.value=t,b.value=c,x.value=n.panX,S.value=n.panY,window.addEventListener(`mousemove`,D),window.addEventListener(`mouseup`,O),window.addEventListener(`touchmove`,B,{passive:!1}),window.addEventListener(`touchend`,V);return}if(r.activeTool===`zoom`&&l){let r=l.button===2?.8:1.25,i=e.value;if(i){let e=i.getBoundingClientRect();n.zoomAt(t-e.left,c-e.top,r)}return}if(r.activeTool===`text`){let e=n.editingTextId;if(e){let t=n.strokes.find(t=>t.id===e);if(t&&Ft(u,t))return}else{let e=[...n.strokes].reverse().find(e=>Ft(u,e));if(e&&e.type===`text`){n.hoveredTextId=null,E(),n.pushUndo(),n.editingTextId=e.id;return}}C.value=!0,a.value=u;return}if(a.value=u,o.value=u,i.value=!0,r.activeTool===`pencil`&&(s.value=[u]),r.activeTool===`select`){let e=[...n.strokes].reverse().find(e=>Ft(u,e));if(e&&n.isSelected(e.id)){n.pushUndo(),d.value=!0,f.value.clear();for(let e of n.selectedStrokes)f.value.set(e.id,{x:e.x,y:e.y,width:e.width,height:e.height,points:e.points.map(e=>({...e}))});n.isSelecting=!1,n.selectionBox=null}else d.value=!1,n.isSelecting=!0,n.selectionBox={x:u.x,y:u.y,width:0,height:0}}}function L(e){z(e.clientX,e.clientY)}function R(e){if(e.touches.length!==1)return;e.preventDefault();let t=e.touches[0];z(t.clientX,t.clientY)}function z(e,t){let c=N(e,t);if(r.activeTool===`text`&&!i.value&&!n.editingTextId){let e=[...n.strokes].reverse().find(e=>Ft(c,e));n.hoveredTextId=e&&e.type===`text`?e.id:null}else i.value||(n.hoveredTextId=null);if(i.value&&(o.value=c,r.activeTool===`pencil`&&s.value.push(c),r.activeTool===`select`))if(d.value){let e=c.x-a.value.x,t=c.y-a.value.y;for(let r of n.selectedStrokes){let i=f.value.get(r.id);i&&n.updateStroke(r.id,{x:i.x+e,y:i.y+t,points:i.points.map(n=>({x:n.x+e,y:n.y+t}))})}}else n.selectionBox={x:Math.min(a.value.x,c.x),y:Math.min(a.value.y,c.y),width:Math.abs(c.x-a.value.x),height:Math.abs(c.y-a.value.y)}}function B(e){if(!v.value||e.touches.length!==1)return;e.preventDefault();let t=e.touches[0],r=t.clientX-y.value,i=t.clientY-b.value;n.setPan(x.value+r,S.value+i)}function V(){v.value&&(v.value=!1,window.removeEventListener(`mousemove`,D),window.removeEventListener(`mouseup`,O),window.removeEventListener(`touchmove`,B),window.removeEventListener(`touchend`,V))}function H(e){te(e.clientX,e.clientY)}function ee(e){let t=e.changedTouches[0];t&&te(t.clientX,t.clientY)}function te(e,t){if(r.activeTool===`zoom`)return;if(r.activeTool===`text`){if(C.value){C.value=!1,E();let e=n.buildStroke(`text`,a.value.x,a.value.y,0,0,[]);n.addStroke(e),n.editingTextId=e.id}return}if(!i.value)return;i.value=!1;let o=N(e,t),c=o.x-a.value.x,l=o.y-a.value.y,u=Math.hypot(c,l);if(r.activeTool===`select`){if(d.value)d.value=!1,f.value.clear(),n.dataVersion++;else{if(n.isSelecting=!1,u<3){let e=[...n.strokes].reverse().find(e=>Ft(o,e));n.selectStroke(e?.id??null)}else{let e=n.selectionBox,t=[];for(let r of[...n.strokes].reverse()){let i=n.getStrokeDisplayBounds(r);i.x>=e.x&&i.x+i.width<=e.x+e.width&&i.y>=e.y&&i.y+i.height<=e.y+e.height&&t.push(r.id)}n.selectStrokes(t)}n.selectionBox=null}return}if(u<3){n.clearSelection();return}let p=r.activeTool,{x:m,y:h}=a.value;if(p===`pencil`){if(s.value.length<2){n.clearSelection();return}let e=s.value.map(e=>({x:Math.round(e.x),y:Math.round(e.y)})),t=Pt(e);if(t.width<3&&t.height<3){n.clearSelection();return}let i=n.buildStroke(`pencil`,t.x,t.y,t.width,t.height,e);n.addStroke(i),r.setTool(`select`);return}let g=o.x-m,_=o.y-h;if(Math.abs(g)<3&&Math.abs(_)<3){n.clearSelection();return}let v=k(p,m,h,o.x,o.y),y=n.buildStroke(p,v.x,v.y,v.width,v.height,[]);n.addStroke(y),r.setTool(`select`)}function U(e,t){n.strokes.find(t=>t.id===e)&&(t.trim()?n.updateStroke(e,{text:t}):(n.strokes=n.strokes.filter(t=>t.id!==e),n.undoStack.length>0&&n.undoStack.pop()),n.editingTextId=null,r.activeTool===`text`&&r.setTool(`select`))}function W(e){let t=n.strokes.find(t=>t.id===e);t&&((!t.text||!t.text.trim())&&(n.strokes=n.strokes.filter(t=>t.id!==e),n.undoStack.length>0&&n.undoStack.pop()),n.editingTextId=null,r.activeTool===`text`&&r.setTool(`select`))}function G(e){n.pushUndo(),n.editingTextId=e}function K(e){let t=e.ctrlKey||e.metaKey;c.value=t,l.value=e.shiftKey,u.value=e.shiftKey}function q(){c.value=!1,l.value=!1,u.value=!1}function ne(e,t){let{x:n,y:r,w:i,h:a}=e;switch(t){case`nw`:return{x:n+i,y:r+a};case`n`:return{x:n+i/2,y:r+a};case`ne`:return{x:n,y:r+a};case`e`:return{x:n,y:r+a/2};case`se`:return{x:n,y:r};case`s`:return{x:n+i/2,y:r};case`sw`:return{x:n+i,y:r};case`w`:return{x:n+i,y:r+a/2};case`line-start`:return{x:n+i,y:r+a};case`line-end`:return{x:n,y:r};default:return{x:n+i,y:r+a}}}function re(e){return e===`n`||e===`s`||e===`e`||e===`w`}function ie(e,t,r,i){let s=n.strokes.find(t=>t.id===e);if(!s)return;n.pushUndo();let c=ue(s);_.value={x:c.x,y:c.y,width:c.width,height:c.height,type:s.type},m.value=e,h.value=t,g.value=r,p.value=!0;let l,u;if(`touches`in i){let e=i.touches[0]||i.changedTouches[0];l=e.clientX,u=e.clientY,i.preventDefault()}else l=i.clientX,u=i.clientY;let d=N(l,u);a.value=d,o.value=d,window.addEventListener(`mousemove`,J),window.addEventListener(`mouseup`,se),window.addEventListener(`touchmove`,ae,{passive:!1}),window.addEventListener(`touchend`,ce)}function J(e){oe(e.clientX,e.clientY)}function ae(e){if(e.touches.length!==1)return;e.preventDefault();let t=e.touches[0];oe(t.clientX,t.clientY)}function oe(e,t){if(!p.value||!_.value||!m.value)return;let r=N(e,t);o.value=r;let i=_.value,a=i.x+i.width/2,s=i.y+i.height/2,c;if(l.value&&re(h.value)){let{x:e,y:t,width:o,height:l}=i;switch(h.value){case`n`:{let t=Math.abs(r.y-s);c={x:e,y:s-t,width:o,height:t*2};break}case`s`:{let t=Math.abs(r.y-s);c={x:e,y:s-t,width:o,height:t*2};break}case`e`:{let e=Math.abs(r.x-a);c={x:a-e,y:t,width:e*2,height:l};break}case`w`:{let e=Math.abs(r.x-a);c={x:a-e,y:t,width:e*2,height:l};break}default:c={x:e,y:t,width:o,height:l}}n.updateStroke(m.value,c);return}if(l.value){c=k(i.type,a,s,r.x,r.y),n.updateStroke(m.value,c);return}if(re(h.value)){let{x:e,y:t,width:n,height:a}=i;switch(h.value){case`n`:{let i=t+a;c={x:e,y:Math.min(r.y,i),width:n,height:Math.abs(r.y-i)};break}case`s`:c={x:e,y:t,width:n,height:Math.abs(r.y-t)};break;case`e`:c={x:e,y:t,width:Math.abs(r.x-e),height:a};break;case`w`:{let i=e+n;c={x:Math.min(r.x,i),y:t,width:Math.abs(r.x-i),height:a};break}default:c={x:e,y:t,width:n,height:a}}}else{let e=ne({x:i.x,y:i.y,w:i.width,h:i.height},h.value);c=k(i.type,e.x,e.y,r.x,r.y)}if(_.value?.type===`text`){c.width<1&&(c.width=1),n.updateStroke(m.value,{x:c.x,width:c.width,textAutoWidth:!1});return}n.updateStroke(m.value,c)}function se(){le()}function ce(e){e.touches.length===0&&le()}function le(){p.value=!1,m.value=null,h.value=``,g.value=``,_.value=null,n.dataVersion++,window.removeEventListener(`mousemove`,J),window.removeEventListener(`mouseup`,se),window.removeEventListener(`touchmove`,ae),window.removeEventListener(`touchend`,ce)}function ue(e){let{type:t}=e;if(t===`line`||t===`triangle`||t===`star`){let{x:t,y:n,width:r,height:i}=e;return{x:r>=0?t:t+r,y:i>=0?n:n+i,width:Math.abs(r),height:Math.abs(i)}}return{x:e.x,y:e.y,width:e.width,height:e.height}}return{isDrawing:i,previewStroke:j,onMouseDown:P,onMouseMove:L,onMouseUp:H,onTouchStart:F,onTouchMove:R,onTouchEnd:ee,getSVGPoint:M,updateModifiers:K,clearModifiers:q,isResizing:p,resizeCursor:g,startResize:ie,commitTextEdit:U,cancelTextEdit:W,startEditText:G,saveCurrentTextEdit:E,setTextContentGetter:T}}function Lt(e){if(e.length===0)return``;if(e.length===1)return`M ${e[0].x} ${e[0].y}`;if(e.length===2)return`M ${e[0].x} ${e[0].y} L ${e[1].x} ${e[1].y}`;let t=`M ${e[0].x} ${e[0].y}`;for(let n=1;n<e.length-1;n++){let r=(e[n].x+e[n+1].x)/2,i=(e[n].y+e[n+1].y)/2;t+=` Q ${e[n].x} ${e[n].y} ${r} ${i}`}return t+=` L ${e[e.length-1].x} ${e[e.length-1].y}`,t}function Rt(e){let{type:t,x:n,y:r,width:i,height:a,points:o,strokeColor:s,fillColor:c,strokeWidth:l}=e,u={stroke:s,fill:c,"stroke-width":l,"stroke-linecap":`round`,"stroke-linejoin":`round`};switch(t){case`pencil`:return{tag:`path`,attrs:{...u,fill:`none`,d:Lt(o)}};case`line`:return{tag:`line`,attrs:{...u,fill:`none`,x1:n,y1:r,x2:n+i,y2:r+a}};case`circle`:{let e=n+i/2,t=r+a/2,o=Math.abs(i)/2,s=Math.abs(a)/2;return{tag:`ellipse`,attrs:{...u,cx:e,cy:t,rx:o,ry:s}}}case`rect`:return{tag:`rect`,attrs:{...u,x:i>=0?n:n+i,y:a>=0?r:r+a,width:Math.abs(i),height:Math.abs(a)}};case`triangle`:{let e=At(n,r,i,a).map(e=>`${e.x},${e.y}`).join(` `);return{tag:`polygon`,attrs:{...u,points:e}}}case`star`:{let e=kt(n+i/2,r+a/2,Math.abs(i)/2,Math.abs(a)/2,a>=0).map(e=>`${e.x},${e.y}`).join(` `);return{tag:`polygon`,attrs:{...u,points:e}}}case`text`:return{tag:`g`,attrs:{}};default:return{tag:`g`,attrs:{}}}}var zt=Q((0,t.defineComponent)({__name:`StrokeRenderer`,props:{stroke:{},isSelected:{type:Boolean}},setup(e){return(n,r)=>((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)((0,t.unref)(Rt)(e.stroke).tag),(0,t.mergeProps)((0,t.unref)(Rt)(e.stroke).attrs,{class:{selected:e.isSelected},"data-stroke-id":e.stroke.id}),null,16,[`class`,`data-stroke-id`]))}}),[[`__scopeId`,`data-v-d3706fa4`]]),Bt={key:0},Vt=[`x`,`y`,`width`,`height`],Ht=[`x`,`y`,`onMousedown`,`onTouchstart`],Ut=[`x`,`y`,`onMousedown`,`onTouchstart`],Wt=6,$=8,Gt=(0,t.defineComponent)({__name:`SelectionOverlay`,props:{stroke:{},startResize:{type:Function}},setup(e){let n=e,r=Z(),i=(0,t.computed)(()=>{let e=r.getStrokeDisplayBounds(n.stroke);return{x:e.x-Wt,y:e.y-Wt,w:e.width+12,h:e.height+12}}),a=(0,t.computed)(()=>n.stroke.type===`line`),o=(0,t.computed)(()=>{let e=n.stroke;return[{name:`line-start`,cx:e.x,cy:e.y,cursor:`move`},{name:`line-end`,cx:e.x+e.width,cy:e.y+e.height,cursor:`move`}]}),s=(0,t.computed)(()=>n.stroke.type===`text`),c=(0,t.computed)(()=>{let e=i.value,t=[{name:`nw`,cx:e.x,cy:e.y,cursor:`nwse-resize`},{name:`n`,cx:e.x+e.w/2,cy:e.y,cursor:`ns-resize`},{name:`ne`,cx:e.x+e.w,cy:e.y,cursor:`nesw-resize`},{name:`e`,cx:e.x+e.w,cy:e.y+e.h/2,cursor:`ew-resize`},{name:`se`,cx:e.x+e.w,cy:e.y+e.h,cursor:`nwse-resize`},{name:`s`,cx:e.x+e.w/2,cy:e.y+e.h,cursor:`ns-resize`},{name:`sw`,cx:e.x,cy:e.y+e.h,cursor:`nesw-resize`},{name:`w`,cx:e.x,cy:e.y+e.h/2,cursor:`ew-resize`}];return s.value?t.filter(e=>e.name!==`n`&&e.name!==`s`):t});function l(e,t,r){r.preventDefault(),r.stopPropagation(),n.startResize(n.stroke.id,e,t,r)}return(n,r)=>e.stroke?((0,t.openBlock)(),(0,t.createElementBlock)(`g`,Bt,[(0,t.createElementVNode)(`rect`,{x:i.value.x,y:i.value.y,width:i.value.w,height:i.value.h,fill:`none`,stroke:`#6366f1`,"stroke-width":`2`,"stroke-dasharray":`6 4`,rx:`4`},null,8,Vt),((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(o.value,e=>(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:e.name,x:e.cx-$/2,y:e.cy-$/2,width:$,height:$,fill:`white`,stroke:`#6366f1`,"stroke-width":`1.5`,rx:`1`,style:(0,t.normalizeStyle)({cursor:e.cursor}),onMousedown:(0,t.withModifiers)(t=>l(e.name,e.cursor,t),[`stop`,`prevent`]),onTouchstart:(0,t.withModifiers)(t=>l(e.name,e.cursor,t),[`stop`,`prevent`])},null,44,Ht)),[[t.vShow,a.value]])),128)),((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(c.value,e=>(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:e.name,x:e.cx-$/2,y:e.cy-$/2,width:$,height:$,fill:`white`,stroke:`#6366f1`,"stroke-width":`1.5`,rx:`1`,style:(0,t.normalizeStyle)({cursor:e.cursor}),onMousedown:(0,t.withModifiers)(t=>l(e.name,e.cursor,t),[`stop`,`prevent`]),onTouchstart:(0,t.withModifiers)(t=>l(e.name,e.cursor,t),[`stop`,`prevent`])},null,44,Ut)),[[t.vShow,!a.value]])),128))])):(0,t.createCommentVNode)(``,!0)}}),Kt=[`viewBox`],qt=[`width`,`height`,`fill`],Jt=[`width`,`height`,`fill`],Yt=[`width`,`height`,`stroke`],Xt={class:`strokes-layer`},Zt=[`x`,`y`,`width`],Qt=[`contenteditable`,`onDblclick`],$t=[`x`,`y`,`width`,`height`],en=[`x`,`y`,`width`,`height`],tn=[`disabled`,`title`],nn=[`disabled`,`title`],rn=[`title`],an=[`title`],on=[`title`],sn=[`title`],cn={class:`zoom-percent`},ln=[`title`],un={class:`font-size-value`},dn=[`title`],fn=[`title`],pn=[`title`],mn=Q((0,t.defineComponent)({__name:`Whiteboard`,setup(e){let n=Z(),r=Be(),{t:i}=o(),a=(0,t.ref)(null),{isDrawing:s,previewStroke:c,onMouseDown:l,onMouseMove:u,onMouseUp:d,onTouchStart:f,onTouchMove:p,onTouchEnd:m,updateModifiers:h,clearModifiers:g,isResizing:_,resizeCursor:v,startResize:y,commitTextEdit:b,cancelTextEdit:x,startEditText:S,saveCurrentTextEdit:C,setTextContentGetter:w}=It(a);w(()=>{let e=n.editingTextId;if(!e)return null;let t=D.value.get(e);return t?t.innerText:null}),(0,t.watch)(()=>r.activeTool,e=>{e!==`text`&&C()});let T=(0,t.computed)(()=>_.value?v.value:r.activeTool===`pan`?`grab`:r.activeTool===`zoom`?`zoom-in`:r.activeTool===`text`?n.hoveredTextId?`pointer`:`text`:r.activeTool===`select`?`default`:`crosshair`),E=(0,t.computed)(()=>r.activeTool===`zoom`),D=(0,t.ref)(new Map),O=(0,t.computed)(()=>{let e=n.hoveredTextId;if(!e)return null;let t=n.strokes.find(t=>t.id===e);return t?n.getStrokeDisplayBounds(t):null}),k=(0,t.computed)(()=>{let e=n.selectedStrokes;return e.length===1&&e[0].type===`text`?e[0]:null});function A(e){if(n.editingTextId)if(e.key===`Enter`&&!e.shiftKey){e.preventDefault(),e.stopPropagation();let r=D.value.get(n.editingTextId),i=r?r.innerText:``;b(n.editingTextId,i),(0,t.nextTick)(()=>{})}else e.key===`Escape`&&(e.preventDefault(),e.stopPropagation(),x(n.editingTextId))}(0,t.watch)(()=>n.editingTextId,e=>{e&&(0,t.nextTick)(()=>{let t=D.value.get(e);if(t){t.focus();let e=document.createRange();e.selectNodeContents(t),e.collapse(!1);let n=window.getSelection();n?.removeAllRanges(),n?.addRange(e)}})});function j(e){(r.activeTool===`text`||r.activeTool===`select`)&&S(e)}function M(){n.hoveredTextId=null}function N(){let e=a.value?.parentElement;e&&n.zoomAt(e.clientWidth/2,e.clientHeight/2,1.1)}function P(){let e=a.value?.parentElement;e&&n.zoomAt(e.clientWidth/2,e.clientHeight/2,.9)}function F(e){let t=e.ctrlKey||e.metaKey;n.editingTextId||((s.value||_.value)&&h(e),e.key===`Delete`||e.key===`Backspace`?n.deleteSelectedStrokes():e.key===`Escape`?n.clearSelection():t&&e.key===`z`&&!e.shiftKey?(e.preventDefault(),n.undo()):t&&(e.key===`y`||e.shiftKey&&e.key===`z`)?(e.preventDefault(),n.redo()):t&&e.key===`x`?(e.preventDefault(),n.cutSelectedStrokes()):t&&e.key===`c`?(e.preventDefault(),n.copySelectedStrokes()):t&&e.key===`v`&&(e.preventDefault(),n.pasteStrokes()))}function I(e){(s.value||_.value)&&h(e)}function L(){g()}let R=(0,t.ref)(0),z=(0,t.ref)(1),B=(0,t.ref)(0),V=(0,t.ref)(0);function H(e){let t=e[0].clientX-e[1].clientX,n=e[0].clientY-e[1].clientY;return Math.hypot(t,n)}function ee(e){r.activeTool===`zoom`&&e.touches.length===2&&(R.value=H(e.touches),z.value=n.zoomLevel,B.value=(e.touches[0].clientX+e.touches[1].clientX)/2,V.value=(e.touches[0].clientY+e.touches[1].clientY)/2)}function te(e){if(r.activeTool===`zoom`&&e.touches.length===2&&R.value>0){let t=H(e.touches)/R.value,r=z.value*t,i=a.value;if(i){let e=i.getBoundingClientRect();n.continuousZoomAt(B.value-e.left,V.value-e.top,r)}}}function U(e){r.activeTool===`zoom`&&e.touches.length<2&&(R.value=0)}let W=null;function G(){let e=a.value?.parentElement;if(!e)return;let t=n.canvasWidth*n.zoomLevel,r=n.canvasHeight*n.zoomLevel,i=e.clientWidth,o=e.clientHeight;i>0&&o>0&&n.setPan((i-t)/2,(o-r)/2)}function K(e){let t=k.value;if(!t)return;let r=t.fontSize??16,i=Math.max(8,Math.min(200,r+e));n.pushUndo(),n.updateStroke(t.id,{fontSize:i}),n.dataVersion++}function q(e){let t=k.value;t&&(n.pushUndo(),n.updateStroke(t.id,{textAlign:e}),n.dataVersion++)}function ne(e){return n=>{n?(D.value.set(e,n),(0,t.nextTick)(()=>re(e,n))):D.value.delete(e)}}function re(e,t){let r=n.strokes.find(t=>t.id===e);if(!r)return;let i=Math.max(t.scrollWidth/n.zoomLevel,r.fontSize??16),a=Math.max(t.scrollHeight/n.zoomLevel,r.fontSize??16);if(r.textAutoWidth){if(Math.abs(r.width-i)<.5&&Math.abs(r.height-a)<.5)return;n.updateStroke(e,{width:i,height:a})}else{let t=Math.max(r.width,i);if(Math.abs(r.width-t)<.5&&Math.abs(r.height-a)<.5)return;n.updateStroke(e,{width:t,height:a})}}return(0,t.onMounted)(()=>{window.addEventListener(`keydown`,F),window.addEventListener(`keydown`,A),window.addEventListener(`keyup`,I),window.addEventListener(`blur`,L),G(),W=new ResizeObserver(()=>G());let e=a.value?.parentElement;e&&W.observe(e)}),(0,t.onUnmounted)(()=>{window.removeEventListener(`keydown`,F),window.removeEventListener(`keydown`,A),window.removeEventListener(`keyup`,I),window.removeEventListener(`blur`,L),W?.disconnect()}),(e,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`whiteboard`,onContextmenu:r[23]||=(0,t.withModifiers)(()=>{},[`prevent`]),onMousedown:r[24]||=(...e)=>(0,t.unref)(l)&&(0,t.unref)(l)(...e),onMousemove:r[25]||=(...e)=>(0,t.unref)(u)&&(0,t.unref)(u)(...e),onMouseup:r[26]||=(...e)=>(0,t.unref)(d)&&(0,t.unref)(d)(...e),onTouchstart:r[27]||=(0,t.withModifiers)(e=>{(0,t.unref)(f)(e),ee(e)},[`prevent`]),onTouchmove:r[28]||=(0,t.withModifiers)(e=>{(0,t.unref)(p)(e),te(e)},[`prevent`]),onTouchend:r[29]||=e=>{(0,t.unref)(m)(e),U(e)}},[(0,t.createElementVNode)(`div`,{ref_key:`wrapperRef`,ref:a,class:`canvas-wrapper`,style:(0,t.normalizeStyle)({width:(0,t.unref)(n).canvasWidth+`px`,height:(0,t.unref)(n).canvasHeight+`px`,transform:(0,t.unref)(n).canvasTransform,transformOrigin:`0 0`})},[((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,{class:`canvas`,viewBox:(0,t.unref)(n).viewBox,width:`100%`,height:`100%`,style:(0,t.normalizeStyle)({cursor:T.value}),onMouseleave:M},[r[30]||=(0,t.createStaticVNode)(`<defs data-v-975e0b8b><pattern id="grid-light" width="16" height="16" patternUnits="userSpaceOnUse" data-v-975e0b8b><rect width="16" height="16" fill="#ffffff" data-v-975e0b8b></rect><rect width="8" height="8" fill="#f0f0f0" data-v-975e0b8b></rect><rect x="8" y="8" width="8" height="8" fill="#f0f0f0" data-v-975e0b8b></rect></pattern><pattern id="grid-dark" width="16" height="16" patternUnits="userSpaceOnUse" data-v-975e0b8b><rect width="16" height="16" fill="#1e1e30" data-v-975e0b8b></rect><rect width="8" height="8" fill="#2a2a3e" data-v-975e0b8b></rect><rect x="8" y="8" width="8" height="8" fill="#2a2a3e" data-v-975e0b8b></rect></pattern></defs>`,1),(0,t.unref)(n).canvasBackgroundColor===`transparent`?((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:0,x:`0`,y:`0`,width:(0,t.unref)(n).canvasWidth,height:(0,t.unref)(n).canvasHeight,fill:(0,t.unref)(n).theme===`dark`?`url(#grid-dark)`:`url(#grid-light)`},null,8,qt)):((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:1,x:`0`,y:`0`,width:(0,t.unref)(n).canvasWidth,height:(0,t.unref)(n).canvasHeight,fill:(0,t.unref)(n).canvasBackgroundColor},null,8,Jt)),(0,t.createElementVNode)(`rect`,{x:`0`,y:`0`,width:(0,t.unref)(n).canvasWidth,height:(0,t.unref)(n).canvasHeight,fill:`none`,stroke:(0,t.unref)(n).theme===`dark`?`#4a4a5a`:`#c0c0c0`,"stroke-width":`2`},null,8,Yt),(0,t.createElementVNode)(`g`,Xt,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)((0,t.unref)(n).strokes,e=>((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:e.id},[e.type===`text`?((0,t.openBlock)(),(0,t.createElementBlock)(`foreignObject`,{key:0,x:e.x,y:e.y,width:e.textAutoWidth?1:e.width||1,height:1,style:{overflow:`visible`,pointerEvents:`none`}},[(0,t.createElementVNode)(`div`,{ref_for:!0,ref:ne(e.id),xmlns:`http://www.w3.org/1999/xhtml`,contenteditable:(0,t.unref)(n).editingTextId===e.id,style:(0,t.normalizeStyle)({fontSize:(e.fontSize??16)+`px`,color:e.textColor??e.strokeColor,textAlign:e.textAlign??`left`,whiteSpace:e.textAutoWidth?`nowrap`:`pre-wrap`,wordBreak:e.textAutoWidth?`normal`:`break-word`,padding:`2px 4px`,minHeight:(e.fontSize??16)+`px`,outline:(0,t.unref)(n).editingTextId===e.id?`2px solid #6366f1`:`none`,cursor:(0,t.unref)(n).editingTextId===e.id?`text`:`default`,userSelect:(0,t.unref)(n).editingTextId===e.id?`text`:`none`,pointerEvents:(0,t.unref)(n).editingTextId===e.id?`auto`:`none`,background:(0,t.unref)(n).editingTextId===e.id?`rgba(255,255,255,0.9)`:`transparent`,borderRadius:`2px`,display:`inline-block`,maxWidth:e.textAutoWidth?`none`:`100%`}),onDblclick:(0,t.withModifiers)(t=>j(e.id),[`stop`])},(0,t.toDisplayString)(e.text||``),45,Qt)],8,Zt)):((0,t.openBlock)(),(0,t.createBlock)(zt,{key:1,stroke:e,"is-selected":(0,t.unref)(n).isSelected(e.id)},null,8,[`stroke`,`is-selected`]))],64))),128))]),(0,t.unref)(c)?((0,t.openBlock)(),(0,t.createBlock)(zt,{key:2,stroke:(0,t.unref)(c),"is-selected":!1},null,8,[`stroke`])):(0,t.createCommentVNode)(``,!0),((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)((0,t.unref)(n).selectedStrokes,e=>((0,t.openBlock)(),(0,t.createBlock)(Gt,{key:`sel-`+e.id,stroke:e,"start-resize":(0,t.unref)(y)},null,8,[`stroke`,`start-resize`]))),128)),(0,t.unref)(n).isSelecting&&(0,t.unref)(n).selectionBox?((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:3,x:(0,t.unref)(n).selectionBox.x,y:(0,t.unref)(n).selectionBox.y,width:(0,t.unref)(n).selectionBox.width,height:(0,t.unref)(n).selectionBox.height,fill:`rgba(99, 102, 241, 0.08)`,stroke:`#6366f1`,"stroke-width":`1`,"stroke-dasharray":`6 4`},null,8,$t)):(0,t.createCommentVNode)(``,!0),O.value?((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:4,x:O.value.x-4,y:O.value.y-4,width:O.value.width+8,height:O.value.height+8,fill:`none`,stroke:`#6366f1`,"stroke-width":`1`,"stroke-dasharray":`4 3`,"pointer-events":`none`},null,8,en)):(0,t.createCommentVNode)(``,!0)],44,Kt))],4),(0,t.createElementVNode)(`div`,{class:`canvas-toolbar`,onMousedown:r[5]||=(0,t.withModifiers)(()=>{},[`stop`]),onMouseup:r[6]||=(0,t.withModifiers)(()=>{},[`stop`]),onClick:r[7]||=(0,t.withModifiers)(()=>{},[`stop`]),onTouchstart:r[8]||=(0,t.withModifiers)(()=>{},[`stop`]),onTouchmove:r[9]||=(0,t.withModifiers)(()=>{},[`stop`]),onTouchend:r[10]||=(0,t.withModifiers)(()=>{},[`stop`])},[(0,t.createElementVNode)(`button`,{class:`canvas-tb-btn`,disabled:!(0,t.unref)(n).canUndo,title:(0,t.unref)(i)(`toolbar.undo`),onClick:r[0]||=e=>(0,t.unref)(n).undo()},[...r[31]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`path`,{d:`M3 10h10a5 5 0 0 1 0 10H9`}),(0,t.createElementVNode)(`polyline`,{points:`7 6 3 10 7 14`})],-1)]],8,tn),(0,t.createElementVNode)(`button`,{class:`canvas-tb-btn`,disabled:!(0,t.unref)(n).canRedo,title:(0,t.unref)(i)(`toolbar.redo`),onClick:r[1]||=e=>(0,t.unref)(n).redo()},[...r[32]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`path`,{d:`M21 10H11a5 5 0 0 0 0 10h4`}),(0,t.createElementVNode)(`polyline`,{points:`17 6 21 10 17 14`})],-1)]],8,nn),(0,t.unref)(n).selectedStrokeIds.size>0?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,class:`canvas-tb-btn`,title:(0,t.unref)(i)(`toolbar.bringToFront`),onClick:r[2]||=e=>(0,t.unref)(n).moveSelectedUp()},[...r[33]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`path`,{d:`m18 15-6-6-6 6`})],-1)]],8,rn)):(0,t.createCommentVNode)(``,!0),(0,t.unref)(n).selectedStrokeIds.size>0?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:1,class:`canvas-tb-btn`,title:(0,t.unref)(i)(`toolbar.sendToBack`),onClick:r[3]||=e=>(0,t.unref)(n).moveSelectedDown()},[...r[34]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`path`,{d:`m6 9 6 6 6-6`})],-1)]],8,an)):(0,t.createCommentVNode)(``,!0),(0,t.unref)(n).selectedStrokeIds.size>0?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:2,class:`canvas-tb-btn canvas-tb-btn--danger`,title:(0,t.unref)(i)(`toolbar.delete`),onClick:r[4]||=e=>(0,t.unref)(n).deleteSelectedStrokes()},[...r[35]||=[(0,t.createStaticVNode)(`<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" data-v-975e0b8b><polyline points="3 6 5 6 21 6" data-v-975e0b8b></polyline><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6" data-v-975e0b8b></path><path d="M10 11v6" data-v-975e0b8b></path><path d="M14 11v6" data-v-975e0b8b></path><path d="M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2" data-v-975e0b8b></path></svg>`,1)]],8,on)):(0,t.createCommentVNode)(``,!0)],32),E.value||(0,t.unref)(n).showZoomIndicator?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`zoom-control`,onTouchstart:r[11]||=(0,t.withModifiers)(()=>{},[`stop`,`prevent`])},[E.value?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,class:`zoom-btn`,title:(0,t.unref)(i)(`zoom.zoomOut`),onMousedown:(0,t.withModifiers)(P,[`stop`,`prevent`]),onTouchstart:(0,t.withModifiers)(P,[`stop`,`prevent`])},[...r[36]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`})],-1)]],40,sn)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`span`,cn,(0,t.toDisplayString)((0,t.unref)(n).getZoomPercent())+`%`,1),E.value?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:1,class:`zoom-btn`,title:(0,t.unref)(i)(`zoom.zoomIn`),onMousedown:(0,t.withModifiers)(N,[`stop`,`prevent`]),onTouchstart:(0,t.withModifiers)(N,[`stop`,`prevent`])},[...r[37]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`}),(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`})],-1)]],40,ln)):(0,t.createCommentVNode)(``,!0)],32)):(0,t.createCommentVNode)(``,!0),k.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:1,class:`text-format-control`,onTouchstart:r[22]||=(0,t.withModifiers)(()=>{},[`stop`,`prevent`])},[(0,t.createElementVNode)(`button`,{class:`font-size-btn`,onMousedown:r[12]||=(0,t.withModifiers)(e=>K(-1),[`stop`,`prevent`]),onTouchstart:r[13]||=(0,t.withModifiers)(e=>K(-1),[`stop`,`prevent`])},[...r[38]||=[(0,t.createElementVNode)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`})],-1)]],32),(0,t.createElementVNode)(`span`,un,(0,t.toDisplayString)(k.value.fontSize??(0,t.unref)(16)),1),(0,t.createElementVNode)(`button`,{class:`font-size-btn`,onMousedown:r[14]||=(0,t.withModifiers)(e=>K(1),[`stop`,`prevent`]),onTouchstart:r[15]||=(0,t.withModifiers)(e=>K(1),[`stop`,`prevent`])},[...r[39]||=[(0,t.createElementVNode)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`}),(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`})],-1)]],32),r[43]||=(0,t.createElementVNode)(`div`,{class:`text-align-separator`},null,-1),(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`text-align-btn`,{active:k.value.textAlign===`left`||!k.value.textAlign}]),title:(0,t.unref)(i)(`textAlign.left`),onMousedown:r[16]||=(0,t.withModifiers)(e=>q(`left`),[`stop`,`prevent`]),onTouchstart:r[17]||=(0,t.withModifiers)(e=>q(`left`),[`stop`,`prevent`])},[...r[40]||=[(0,t.createStaticVNode)(`<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" data-v-975e0b8b><line x1="3" y1="6" x2="21" y2="6" data-v-975e0b8b></line><line x1="3" y1="10" x2="17" y2="10" data-v-975e0b8b></line><line x1="3" y1="14" x2="21" y2="14" data-v-975e0b8b></line><line x1="3" y1="18" x2="15" y2="18" data-v-975e0b8b></line></svg>`,1)]],42,dn),(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`text-align-btn`,{active:k.value.textAlign===`center`}]),title:(0,t.unref)(i)(`textAlign.center`),onMousedown:r[18]||=(0,t.withModifiers)(e=>q(`center`),[`stop`,`prevent`]),onTouchstart:r[19]||=(0,t.withModifiers)(e=>q(`center`),[`stop`,`prevent`])},[...r[41]||=[(0,t.createStaticVNode)(`<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" data-v-975e0b8b><line x1="3" y1="6" x2="21" y2="6" data-v-975e0b8b></line><line x1="5" y1="10" x2="19" y2="10" data-v-975e0b8b></line><line x1="3" y1="14" x2="21" y2="14" data-v-975e0b8b></line><line x1="7" y1="18" x2="17" y2="18" data-v-975e0b8b></line></svg>`,1)]],42,fn),(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`text-align-btn`,{active:k.value.textAlign===`right`}]),title:(0,t.unref)(i)(`textAlign.right`),onMousedown:r[20]||=(0,t.withModifiers)(e=>q(`right`),[`stop`,`prevent`]),onTouchstart:r[21]||=(0,t.withModifiers)(e=>q(`right`),[`stop`,`prevent`])},[...r[42]||=[(0,t.createStaticVNode)(`<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" data-v-975e0b8b><line x1="3" y1="6" x2="21" y2="6" data-v-975e0b8b></line><line x1="7" y1="10" x2="21" y2="10" data-v-975e0b8b></line><line x1="3" y1="14" x2="21" y2="14" data-v-975e0b8b></line><line x1="9" y1="18" x2="21" y2="18" data-v-975e0b8b></line></svg>`,1)]],42,pn)],32)):(0,t.createCommentVNode)(``,!0)],32))}}),[[`__scopeId`,`data-v-975e0b8b`]]),hn={class:`palette-header`},gn={class:`palette-title`},_n={class:`current-color`},vn={key:0,width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},yn={class:`preset-grid`},bn=[`title`,`onClick`],xn={key:0,class:`transparent-row`},Sn={class:`palette-footer`},Cn={class:`custom-color`},wn=[`value`],Tn={class:`custom-label`},En=Q((0,t.defineComponent)({__name:`ColorPalette`,setup(e){let n=Z(),{t:r}=o(),i=l(),a=(0,t.computed)(()=>{if(!i?.value)return{};let e=i.value.getBoundingClientRect();return{left:e.left+60+`px`,bottom:window.innerHeight-e.bottom+9+`px`,position:`fixed`}}),s=[`#000000`,`#ffffff`,`#6b7280`,`#d1d5db`,`#dc2626`,`#ef4444`,`#f97316`,`#f59e0b`,`#16a34a`,`#22c55e`,`#0891b2`,`#06b6d4`,`#2563eb`,`#3b82f6`,`#7c3aed`,`#8b5cf6`,`#db2777`,`#ec4899`,`#a16207`,`#84cc16`,`#0d9488`,`#6366f1`,`#d946ef`,`#f43f5e`];function c(e){let t=e.target;n.setColor(t.value)}function u(e){n.setColor(e),n.hideColorPalette()}function d(){n.setColor(`transparent`),n.hideColorPalette()}return(e,i)=>((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:`body`},[(0,t.unref)(n).showColorPalette?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`overlay`,onClick:i[1]||=(...e)=>(0,t.unref)(n).hideColorPalette&&(0,t.unref)(n).hideColorPalette(...e)},[(0,t.createElementVNode)(`div`,{class:`color-palette`,style:(0,t.normalizeStyle)(a.value),onClick:i[0]||=(0,t.withModifiers)(()=>{},[`stop`])},[(0,t.createElementVNode)(`div`,hn,[(0,t.createElementVNode)(`span`,gn,(0,t.toDisplayString)((0,t.unref)(n).activeColorSlot===`textColor`?(0,t.unref)(r)(`color.textColor`):(0,t.unref)(n).activeColorSlot===`foreground`?(0,t.unref)(r)(`palette.stroke`):(0,t.unref)(r)(`palette.fill`)),1),(0,t.createElementVNode)(`div`,_n,[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`current-swatch`,{fill:(0,t.unref)(n).activeColorSlot===`background`,"current-transparent":(0,t.unref)(n).activeColorSlot===`background`&&(0,t.unref)(n).backgroundColor===`transparent`}]),style:(0,t.normalizeStyle)({background:(0,t.unref)(n).activeColorSlot===`textColor`?(0,t.unref)(n).textColor:(0,t.unref)(n).activeColorSlot===`foreground`?(0,t.unref)(n).foregroundColor:(0,t.unref)(n).backgroundColor===`transparent`?`none`:(0,t.unref)(n).backgroundColor})},[(0,t.unref)(n).activeColorSlot===`background`&&(0,t.unref)(n).backgroundColor===`transparent`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,vn,[...i[2]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`5`,x2:`19`,y2:`19`},null,-1)]])):(0,t.createCommentVNode)(``,!0)],6)])]),(0,t.createElementVNode)(`div`,yn,[((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(s,e=>(0,t.createElementVNode)(`button`,{key:e,class:`color-swatch`,style:(0,t.normalizeStyle)({background:e}),title:e,onClick:t=>u(e)},null,12,bn)),64))]),(0,t.unref)(n).activeColorSlot===`background`?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,xn,[(0,t.createElementVNode)(`button`,{class:`color-swatch transparent-swatch`,title:`透明（无填充）`,onClick:d},[...i[3]||=[(0,t.createElementVNode)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`#d00`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`5`,x2:`19`,y2:`19`})],-1)]])])):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,Sn,[(0,t.createElementVNode)(`div`,Cn,[(0,t.createElementVNode)(`input`,{type:`color`,value:(0,t.unref)(n).activeColorSlot===`textColor`?(0,t.unref)(n).textColor:(0,t.unref)(n).activeColorSlot===`foreground`?(0,t.unref)(n).foregroundColor:(0,t.unref)(n).backgroundColor===`transparent`?`#ffffff`:(0,t.unref)(n).backgroundColor,class:`color-picker`,onChange:c},null,40,wn),(0,t.createElementVNode)(`span`,Tn,(0,t.toDisplayString)((0,t.unref)(r)(`palette.custom`)),1)])])],4)])):(0,t.createCommentVNode)(``,!0)]))}}),[[`__scopeId`,`data-v-a8b8bc9c`]]),Dn=Q((0,t.defineComponent)({__name:`Painter`,props:{theme:{default:`light`},locale:{default:`zh-CN`},modelValue:{default:()=>({strokes:[],canvasWidth:800,canvasHeight:600})},width:{default:`100%`},height:{default:`100%`}},emits:[`update:modelValue`],setup(e,{emit:n}){let r=e,i=n,o=(0,t.computed)(()=>r.locale===`en-US`?`en-US`:`zh-CN`),s=(0,t.computed)(()=>{let e=e=>typeof e==`number`?`${e}px`:e;return{width:e(r.width),height:e(r.height)}});a(o.value);let l=(0,t.ref)(null);c(l);let u=Z(),d=Be();u.reset(),d.reset();let f=!1;function p(e){return e.map(e=>({...e,points:e.points.map(e=>({...e}))}))}(0,t.watch)(()=>r.theme,(e,t)=>{u.theme=e||`light`,e===`dark`&&u.foregroundColor===`#000000`?u.foregroundColor=`#ffffff`:e===`light`&&t===`dark`&&u.foregroundColor===`#ffffff`&&(u.foregroundColor=`#000000`)},{immediate:!0});let m=(0,t.computed)(()=>`wb-theme-${r.theme}`);u.setCanvasSize(r.modelValue.canvasWidth??800,r.modelValue.canvasHeight??600),r.modelValue.canvasBackgroundColor!=null&&u.setCanvasBackgroundColor(r.modelValue.canvasBackgroundColor),(0,t.watch)(()=>r.modelValue.canvasWidth,e=>{e!=null&&u.setCanvasSize(e,u.canvasHeight)}),(0,t.watch)(()=>r.modelValue.canvasHeight,e=>{e!=null&&u.setCanvasSize(u.canvasWidth,e)}),(0,t.watch)(()=>r.modelValue.strokes,e=>{f||u.syncFromParent(e)},{immediate:!0,deep:!0});function h(){f=!0,i(`update:modelValue`,{strokes:p(u.strokes),canvasWidth:u.canvasWidth,canvasHeight:u.canvasHeight,canvasBackgroundColor:u.canvasBackgroundColor}),setTimeout(()=>{f=!1},0)}return(0,t.watch)(()=>`${u.strokes.length}|${u.canvasWidth}|${u.canvasHeight}|${u.canvasBackgroundColor}|${u.dataVersion}`,()=>{h()}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{ref_key:`rootEl`,ref:l,class:(0,t.normalizeClass)([`wb-root`,m.value]),style:(0,t.normalizeStyle)(s.value)},[(0,t.createVNode)(Ot),(0,t.createVNode)(mn),(0,t.createVNode)(En)],6))}}),[[`__scopeId`,`data-v-18ed1ca7`]]);e.DEFAULT_CANVAS_HEIGHT=d,e.DEFAULT_CANVAS_WIDTH=u,e.DEFAULT_FONT_SIZE=p,e.HIT_THRESHOLD=m,e.Painter=Dn,e.default=Dn,e.STROKE_WIDTH=f});
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("vue")):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.XiaodaoPainter={},e.Vue))})(this,function(e,t){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var n={"zh-CN":{"tool.select":`选择`,"tool.pencil":`铅笔`,"tool.line":`直线`,"tool.circle":`圆形`,"tool.rect":`矩形`,"tool.triangle":`三角形`,"tool.star":`五角星`,"tool.pan":`移动画布`,"tool.zoom":`缩放`,"tool.text":`文本框`,"color.foreground":`前景色（描边）`,"color.background":`背景色（填充）`,"color.textColor":`文本颜色`,"palette.stroke":`描边颜色`,"palette.fill":`填充颜色`,"palette.custom":`自定义颜色`,"toolbar.undo":`撤销`,"toolbar.redo":`重做`,"toolbar.bringToFront":`上移图层`,"toolbar.sendToBack":`下移图层`,"toolbar.delete":`删除`,"zoom.label":`缩放：{percent}%`,"zoom.zoomIn":`放大`,"zoom.zoomOut":`缩小`,"canvasSize.title":`画布设置`,"canvasSize.width":`宽度`,"canvasSize.height":`高度`,"canvasSize.confirm":`确定`,"canvasSize.cancel":`取消`,"canvasSize.background":`背景`,"canvasSize.transparent":`透明`,"canvasSize.solidColor":`纯色`,"textAlign.left":`左对齐`,"textAlign.center":`居中`,"textAlign.right":`右对齐`},"en-US":{"tool.select":`Select`,"tool.pencil":`Pencil`,"tool.line":`Line`,"tool.circle":`Circle`,"tool.rect":`Rectangle`,"tool.triangle":`Triangle`,"tool.star":`Star`,"tool.pan":`Pan Canvas`,"tool.zoom":`Zoom`,"tool.text":`Text`,"color.foreground":`Stroke Color`,"color.background":`Fill Color`,"color.textColor":`Text Color`,"palette.stroke":`Stroke Color`,"palette.fill":`Fill Color`,"palette.custom":`Custom Color`,"toolbar.undo":`Undo`,"toolbar.redo":`Redo`,"toolbar.bringToFront":`Bring to Front`,"toolbar.sendToBack":`Send to Back`,"toolbar.delete":`Delete`,"zoom.label":`Zoom: {percent}%`,"zoom.zoomIn":`Zoom In`,"zoom.zoomOut":`Zoom Out`,"canvasSize.title":`Canvas Settings`,"canvasSize.width":`Width`,"canvasSize.height":`Height`,"canvasSize.confirm":`OK`,"canvasSize.cancel":`Cancel`,"canvasSize.background":`Background`,"canvasSize.transparent":`Transparent`,"canvasSize.solidColor":`Solid Color`,"textAlign.left":`Align Left`,"textAlign.center":`Align Center`,"textAlign.right":`Align Right`}};function r(e,t){return n[e]?.[t]??t}var i=Symbol(`wb-locale`);function a(e){(0,t.provide)(i,e)}function o(){let e=(0,t.inject)(i,`zh-CN`);return{locale:e,t:t=>r(e,t)}}var s=Symbol(`wb-root-el`);function c(e){(0,t.provide)(s,e)}function l(){return(0,t.inject)(s,null)}var u=800,d=600,f=3,p=16,m=8,h=0;function g(){let e=globalThis.crypto;if(e&&typeof e.randomUUID==`function`)return e.randomUUID();let t=new Uint8Array(16);if(e&&typeof e.getRandomValues==`function`)e.getRandomValues(t);else{let e=Date.now(),n=h++;for(let r=0;r<t.length;r++){let i=Math.floor(e/2**(r%6*8))%256,a=Math.floor(n/2**(r%4*8))%256;t[r]=Math.floor(Math.random()*256)^i^a}}t[6]=t[6]&15|64,t[8]=t[8]&63|128;let n=Array.from(t,e=>e.toString(16).padStart(2,`0`)).join(``);return`${n.slice(0,8)}-${n.slice(8,12)}-${n.slice(12,16)}-${n.slice(16,20)}-${n.slice(20)}`}var _=(0,t.ref)([]),v=(0,t.ref)(new Set),y=(0,t.ref)(`#000000`),b=(0,t.ref)(`transparent`),x=(0,t.ref)(`foreground`),S=(0,t.ref)(!1),C=(0,t.ref)(3),w=(0,t.ref)(`transparent`),T=(0,t.ref)(`light`),E=(0,t.ref)(0),D=(0,t.ref)(`#000000`),O=(0,t.ref)(null),k=(0,t.ref)(null),A=(0,t.ref)(800),j=(0,t.ref)(600),M=(0,t.ref)(0),N=(0,t.ref)(0),P=(0,t.ref)(1),F=(0,t.ref)(!1),I=null,L=(0,t.computed)(()=>`0 0 ${A.value} ${j.value}`),R=(0,t.computed)(()=>`translate(${M.value}px, ${N.value}px) scale(${P.value})`);function z(e,t){M.value=e,N.value=t}function B(e,t){A.value=e,j.value=t,E.value++}var V=[.1,.25,.33,.5,.67,.75,1,1.25,1.5,2,3,4,5,6,8,10];function H(e,t,n){let r=P.value,i=n>1,a=null;for(let e of V)if(i){if(e>r+.001){a=e;break}}else e<r-.001&&(a=e);if(a===null)return;let o=(e-M.value)/r,s=(t-N.value)/r;M.value=e-o*a,N.value=t-s*a,P.value=a,F.value=!0,I&&clearTimeout(I),I=setTimeout(()=>{F.value=!1},1500)}function ee(e,t,n){let r=V[0],i=V[V.length-1];n=Math.max(r,Math.min(i,n));let a=P.value,o=(e-M.value)/a,s=(t-N.value)/a;M.value=e-o*n,N.value=t-s*n,P.value=n,F.value=!0,I&&clearTimeout(I),I=setTimeout(()=>{F.value=!1},1500)}function te(){return Math.round(P.value*100)}var U=(0,t.ref)([]),W=(0,t.ref)([]),G=(0,t.ref)(!1),K=(0,t.ref)(null);function q(e){C.value=e}function ne(e){w.value=e,E.value++}function re(){S.value=!S.value}function ie(){S.value=!1}var J=(0,t.computed)(()=>_.value.filter(e=>v.value.has(e.id))),ae=(0,t.computed)(()=>{let e=J.value.filter(e=>e.type!==`text`);if(e.length===0)return null;let t=e[0].strokeColor;return e.every(e=>e.strokeColor===t)?t:null}),oe=(0,t.computed)(()=>{let e=J.value.filter(e=>e.type!==`line`&&e.type!==`pencil`&&e.type!==`text`);if(e.length===0)return null;let t=e[0].fillColor;return e.every(e=>e.fillColor===t)?t:null}),se=(0,t.computed)(()=>{let e=J.value.filter(e=>e.type===`text`);if(e.length===0)return null;let t=e[0].textColor??y.value;return e.every(e=>(e.textColor??y.value)===t)?t:null}),ce=(0,t.computed)(()=>{let e=J.value;return e.length===1?e[0]:null}),le=(0,t.computed)(()=>ce.value?.id??null);function ue(e){return v.value.has(e)}function de(e){v.value=e?new Set([e]):new Set}function fe(e){v.value=new Set(e)}function pe(){v.value=new Set}function me(e){X(),_.value.push(e)}function he(e,t){let n=_.value.findIndex(t=>t.id===e);if(n===-1)return;let r={...t};r.x!==void 0&&(r.x=Math.round(r.x)),r.y!==void 0&&(r.y=Math.round(r.y)),r.width!==void 0&&(r.width=Math.round(r.width)),r.height!==void 0&&(r.height=Math.round(r.height)),r.points&&=r.points.map(e=>({x:Math.round(e.x),y:Math.round(e.y)})),_.value[n]={..._.value[n],...r}}function ge(){let e=v.value;e.size!==0&&(X(),_.value=_.value.filter(t=>!e.has(t.id)),v.value=new Set)}var _e=(0,t.computed)(()=>U.value.length>0),ve=(0,t.computed)(()=>W.value.length>0),Y=(0,t.ref)([]);function ye(){v.value.size!==0&&(Y.value=J.value.map(e=>Se(e)),ge())}function be(){v.value.size!==0&&(Y.value=J.value.map(e=>Se(e)))}function xe(){if(Y.value.length===0)return;X(),pe();let e=[];for(let t of Y.value){let n={...Se(t),id:Me(),x:t.x+20,y:t.y+20,points:t.points.map(e=>({x:e.x+20,y:e.y+20}))};_.value.push(n),e.push(n.id)}fe(e)}function Se(e){return{...e,points:e.points.map(e=>({...e}))}}function X(){U.value.push(_.value.map(e=>({...e,points:e.points.map(e=>({...e}))}))),W.value=[]}function Ce(){U.value.length!==0&&(W.value.push(_.value.map(e=>({...e,points:e.points.map(e=>({...e}))}))),_.value=U.value.pop(),v.value=new Set)}function we(){W.value.length!==0&&(U.value.push(_.value.map(e=>({...e,points:e.points.map(e=>({...e}))}))),_.value=W.value.pop(),v.value=new Set)}function Te(){let e=v.value;if(e.size===0)return;X();let t=_.value.map((t,n)=>e.has(t.id)?n:-1).filter(e=>e>=0).sort((e,t)=>t-e);for(let e of t)e<_.value.length-1&&([_.value[e],_.value[e+1]]=[_.value[e+1],_.value[e]])}function Ee(){let e=v.value;if(e.size===0)return;X();let t=_.value.map((t,n)=>e.has(t.id)?n:-1).filter(e=>e>=0).sort((e,t)=>e-t);for(let e of t)e>0&&([_.value[e],_.value[e-1]]=[_.value[e-1],_.value[e]])}var De=!1;function Oe(e){if(De)return;De=!0,_.value=Array.isArray(e)?e.map(e=>({...e,points:e.points.map(e=>({...e}))})):[];let t=new Set(_.value.map(e=>e.id));v.value=new Set([...v.value].filter(e=>t.has(e))),setTimeout(()=>{De=!1},0)}function ke(e){let{x:t,y:n,width:r,height:i,type:a}=e;return a===`line`||a===`triangle`||a===`star`?{x:r>=0?t:t+r,y:i>=0?n:n+i,width:Math.abs(r),height:Math.abs(i)}:{x:t,y:n,width:r,height:i}}function Ae(e){x.value=e}function je(e){if(v.value.size>0){X();for(let t of v.value){let n=_.value.find(e=>e.id===t);if(x.value===`foreground`){if(e===`transparent`||n?.type===`text`)continue;he(t,{strokeColor:e})}else if(x.value===`textColor`){if(e===`transparent`)return;he(t,{textColor:e})}else{if(n?.type===`text`)continue;he(t,{fillColor:e})}}E.value++}else if(x.value===`foreground`){if(e===`transparent`)return;y.value=e}else if(x.value===`textColor`){if(e===`transparent`)return;D.value=e}else b.value=e}function Me(){return g()}function Ne(e,t,n,r,i,a){return{id:Me(),type:e,x:Math.round(t),y:Math.round(n),width:Math.round(r),height:Math.round(i),points:a.map(e=>({x:Math.round(e.x),y:Math.round(e.y)})),strokeColor:y.value,fillColor:e===`pencil`||e===`line`?`none`:b.value,strokeWidth:C.value,...e===`text`?{text:``,fontSize:16,textAlign:`left`,textColor:y.value,textAutoWidth:!0,fillColor:`transparent`,strokeColor:`transparent`,width:0,height:0}:{}}}function Pe(){_.value=[],v.value=new Set,y.value=`#000000`,b.value=`transparent`,x.value=`foreground`,S.value=!1,C.value=3,w.value=`transparent`,T.value=`light`,E.value=0,D.value=`#000000`,O.value=null,k.value=null,A.value=800,j.value=600,M.value=0,N.value=0,P.value=1,F.value=!1,I&&=(clearTimeout(I),null),U.value=[],W.value=[],G.value=!1,K.value=null,Y.value=[]}var Fe=(0,t.reactive)({strokes:_,selectedStrokeIds:v,selectedStrokeId:le,selectedStroke:ce,selectedStrokes:J,selectedStrokeColor:ae,selectedFillColor:oe,selectedTextColor:se,foregroundColor:y,backgroundColor:b,activeColorSlot:x,showColorPalette:S,isSelecting:G,selectionBox:K,toggleColorPalette:re,hideColorPalette:ie,addStroke:me,updateStroke:he,selectStroke:de,selectStrokes:fe,clearSelection:pe,isSelected:ue,deleteSelectedStrokes:ge,setColorSlot:Ae,setColor:je,buildStroke:Ne,strokeWidth:C,setStrokeWidth:q,canvasBackgroundColor:w,setCanvasBackgroundColor:ne,canUndo:_e,canRedo:ve,undoStack:U,pushUndo:X,undo:Ce,redo:we,moveSelectedUp:Te,moveSelectedDown:Ee,syncFromParent:Oe,getStrokeDisplayBounds:ke,clipboard:Y,cutSelectedStrokes:ye,copySelectedStrokes:be,pasteStrokes:xe,canvasWidth:A,canvasHeight:j,panX:M,panY:N,zoomLevel:P,showZoomIndicator:F,viewBox:L,canvasTransform:R,setPan:z,setCanvasSize:B,zoomAt:H,continuousZoomAt:ee,getZoomPercent:te,dataVersion:E,theme:T,textColor:D,editingTextId:O,hoveredTextId:k,reset:Pe});function Z(){return Fe}var Ie=(0,t.ref)(`select`);function Le(e){if(Ie.value===`select`&&e!==`select`){let e=Z();e.selectedStrokeIds.size>0&&e.clearSelection()}Ie.value=e}function Re(){Ie.value=`select`}var ze=(0,t.reactive)({activeTool:Ie,setTool:Le,reset:Re});function Be(){return ze}var Ve={class:`toolbar`},He=[`disabled`],Ue={class:`tool-group`},We=[`title`,`onClick`],Ge={key:0,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.6`,"stroke-linecap":`round`,"stroke-linejoin":`round`},Ke={key:1,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`},qe={key:2,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`,"stroke-linejoin":`round`},Je={key:3,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`},Ye={key:4,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`},Xe={key:5,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linejoin":`round`},Ze={key:6,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linejoin":`round`},Qe={key:7,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linejoin":`round`},$e={key:8,class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`,"stroke-linejoin":`round`},et={class:`tool-group nav-group`},tt=[`title`],nt=[`disabled`],rt={class:`canvas-size-wrapper`},it=[`title`],at={class:`popover-title`},ot={class:`popover-field`},st={class:`popover-label`},ct={class:`popover-field`},lt={class:`popover-label`},ut={class:`popover-field`},dt={class:`popover-label`},ft={class:`bg-color-row`},pt=[`title`],mt=[`value`],ht=[`title`],gt={class:`popover-actions`},_t={class:`color-section`},vt=[`title`],yt={class:`color-swatch text-color-swatch`},bt={key:0,class:`mixed-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},xt=[`title`],St={key:0,class:`mixed-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},Ct=[`title`],wt={key:0,class:`mixed-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},Tt={key:1,class:`mixed-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},Et=42,Dt=(0,t.defineComponent)({__name:`Toolbar`,setup(e){let n=Be(),r=Z(),{t:i}=o(),a=l(),s=(0,t.ref)(null),c=(0,t.ref)(!1),u=(0,t.ref)(!1);function d(){let e=s.value;e&&(c.value=e.scrollTop>0,u.value=e.scrollTop+e.clientHeight<e.scrollHeight-1)}function f(){let e=s.value;e&&e.scrollBy({top:-42,behavior:`smooth`})}function p(){let e=s.value;e&&e.scrollBy({top:Et,behavior:`smooth`})}let m=null;(0,t.onMounted)(()=>{m=new ResizeObserver(()=>d()),s.value&&m.observe(s.value),d()}),(0,t.onUnmounted)(()=>{m?.disconnect()});let h=[`select`,`pan`,`pencil`,`line`,`circle`,`rect`,`triangle`,`star`,`text`],g=(0,t.computed)(()=>r.selectedStrokeIds.size>0),_=(0,t.ref)(!1),v=(0,t.ref)({width:r.canvasWidth,height:r.canvasHeight}),y=(0,t.ref)(r.canvasBackgroundColor);function b(){v.value={width:r.canvasWidth,height:r.canvasHeight},y.value=r.canvasBackgroundColor,_.value=!0}let x=(0,t.ref)(null);function S(){x.value?.click()}function C(e){let t=e.target;y.value=t.value}function w(){y.value=`transparent`}function T(){let e=Math.max(1,Math.round(v.value.width)),t=Math.max(1,Math.round(v.value.height));r.setCanvasSize(e,t),r.setCanvasBackgroundColor(y.value),_.value=!1}function E(){_.value=!1}let D=(0,t.computed)(()=>{if(!a?.value)return{};let e=a.value.getBoundingClientRect();return{left:e.left+52+12+`px`,bottom:window.innerHeight-e.bottom+80+`px`,position:`fixed`}});function O(e){e.target.classList.contains(`canvas-size-backdrop`)&&(_.value=!1)}function k(e){e.key===`Escape`&&(_.value=!1)}let A=(0,t.computed)(()=>g.value&&r.selectedStrokeColor!==null?r.selectedStrokeColor:r.foregroundColor),j=(0,t.computed)(()=>!F.value&&g.value&&r.selectedStrokeColor===null),M=(0,t.computed)(()=>g.value&&r.selectedFillColor!==null?r.selectedFillColor:r.backgroundColor),N=(0,t.computed)(()=>!F.value&&g.value&&r.selectedFillColor===null),P=(0,t.computed)(()=>r.selectedStrokes.some(e=>e.type===`text`)),F=(0,t.computed)(()=>g.value&&r.selectedStrokes.every(e=>e.type===`text`)),I=(0,t.computed)(()=>F.value),L=(0,t.computed)(()=>F.value),R=(0,t.computed)(()=>g.value&&r.selectedTextColor!==null?r.selectedTextColor:r.textColor),z=(0,t.computed)(()=>P.value&&r.selectedTextColor===null);function B(){r.setColorSlot(`textColor`),r.toggleColorPalette()}function V(){I.value||(r.setColorSlot(`foreground`),r.toggleColorPalette())}function H(){L.value||(r.setColorSlot(`background`),r.toggleColorPalette())}return(e,a)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,Ve,[c.value||u.value?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,class:`scroll-btn scroll-up`,disabled:!c.value,onClick:f},[...a[3]||=[(0,t.createElementVNode)(`svg`,{class:`scroll-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`polyline`,{points:`18 15 12 9 6 15`})],-1)]],8,He)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,{ref_key:`toolsScrollRef`,ref:s,class:`tools-scroll`,onScroll:d},[(0,t.createElementVNode)(`div`,Ue,[((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(h,e=>(0,t.createElementVNode)(`button`,{key:e,class:(0,t.normalizeClass)([`tool-btn`,{active:(0,t.unref)(n).activeTool===e}]),title:(0,t.unref)(i)(`tool.${e}`),onClick:r=>(0,t.unref)(n).setTool(e)},[e===`select`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Ge,[...a[4]||=[(0,t.createElementVNode)(`path`,{d:`M4.5 3.5l5.5 15 2.5-6 6-2.5z`},null,-1)]])):e===`pan`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Ke,[...a[5]||=[(0,t.createStaticVNode)(`<line x1="12" y1="4" x2="12" y2="20" data-v-9532ade7></line><line x1="4" y1="12" x2="20" y2="12" data-v-9532ade7></line><polygon points="12,4 9,8 15,8" fill="currentColor" stroke="none" data-v-9532ade7></polygon><polygon points="12,20 9,16 15,16" fill="currentColor" stroke="none" data-v-9532ade7></polygon><polygon points="4,12 8,9 8,15" fill="currentColor" stroke="none" data-v-9532ade7></polygon><polygon points="20,12 16,9 16,15" fill="currentColor" stroke="none" data-v-9532ade7></polygon>`,6)]])):e===`pencil`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,qe,[...a[6]||=[(0,t.createElementVNode)(`path`,{d:`M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z`},null,-1),(0,t.createElementVNode)(`path`,{d:`m15 5 4 4`},null,-1)]])):e===`line`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Je,[...a[7]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`19`,x2:`19`,y2:`5`},null,-1)]])):e===`circle`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Ye,[...a[8]||=[(0,t.createElementVNode)(`circle`,{cx:`12`,cy:`12`,r:`9`},null,-1)]])):e===`rect`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Xe,[...a[9]||=[(0,t.createElementVNode)(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`},null,-1)]])):e===`triangle`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Ze,[...a[10]||=[(0,t.createElementVNode)(`polygon`,{points:`12,3 22,21 2,21`},null,-1)]])):e===`star`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Qe,[...a[11]||=[(0,t.createElementVNode)(`polygon`,{points:`12,2 15.09,8.26 22,9.27 17,14.14 18.18,21.02 12,17.77 5.82,21.02 7,14.14 2,9.27 8.91,8.26`},null,-1)]])):e===`text`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,$e,[...a[12]||=[(0,t.createElementVNode)(`polyline`,{points:`4 7 4 4 20 4 20 7`},null,-1),(0,t.createElementVNode)(`line`,{x1:`9`,y1:`20`,x2:`15`,y2:`20`},null,-1),(0,t.createElementVNode)(`line`,{x1:`12`,y1:`4`,x2:`12`,y2:`20`},null,-1)]])):(0,t.createCommentVNode)(``,!0)],10,We)),64))]),(0,t.createElementVNode)(`div`,et,[(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`tool-btn`,{active:(0,t.unref)(n).activeTool===`zoom`}]),title:(0,t.unref)(i)(`tool.zoom`),onClick:a[0]||=e=>(0,t.unref)(n).setTool(`zoom`)},[...a[13]||=[(0,t.createStaticVNode)(`<svg class="tool-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" data-v-9532ade7><circle cx="11" cy="11" r="8" data-v-9532ade7></circle><line x1="21" y1="21" x2="16.65" y2="16.65" data-v-9532ade7></line><line x1="11" y1="8" x2="11" y2="14" data-v-9532ade7></line><line x1="8" y1="11" x2="14" y2="11" data-v-9532ade7></line></svg>`,1)]],10,tt)])],544),c.value||u.value?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:1,class:`scroll-btn scroll-down`,disabled:!u.value,onClick:p},[...a[14]||=[(0,t.createElementVNode)(`svg`,{class:`scroll-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`polyline`,{points:`6 9 12 15 18 9`})],-1)]],8,nt)):(0,t.createCommentVNode)(``,!0),a[24]||=(0,t.createElementVNode)(`div`,{class:`spacer`},null,-1),(0,t.createElementVNode)(`div`,rt,[(0,t.createElementVNode)(`button`,{class:`tool-btn`,title:(0,t.unref)(i)(`canvasSize.title`),onClick:b},[...a[15]||=[(0,t.createElementVNode)(`svg`,{class:`tool-icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`rect`,{x:`2`,y:`2`,width:`20`,height:`14`,rx:`1.5`}),(0,t.createElementVNode)(`line`,{x1:`7`,y1:`16`,x2:`5`,y2:`22`}),(0,t.createElementVNode)(`line`,{x1:`17`,y1:`16`,x2:`19`,y2:`22`})],-1)]],8,it),((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:`body`},[_.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`canvas-size-backdrop`,onMousedown:O},[(0,t.createElementVNode)(`div`,{class:`canvas-size-popover`,style:(0,t.normalizeStyle)(D.value),onKeydown:k},[(0,t.createElementVNode)(`div`,at,(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.title`)),1),(0,t.createElementVNode)(`div`,ot,[(0,t.createElementVNode)(`label`,st,(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.width`)),1),(0,t.withDirectives)((0,t.createElementVNode)(`input`,{ref:`widthInput`,"onUpdate:modelValue":a[1]||=e=>v.value.width=e,type:`number`,min:`1`,class:`popover-input`,onKeydown:(0,t.withKeys)(T,[`enter`])},null,544),[[t.vModelText,v.value.width,void 0,{number:!0}]]),a[16]||=(0,t.createElementVNode)(`span`,{class:`popover-unit`},`px`,-1)]),(0,t.createElementVNode)(`div`,ct,[(0,t.createElementVNode)(`label`,lt,(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.height`)),1),(0,t.withDirectives)((0,t.createElementVNode)(`input`,{"onUpdate:modelValue":a[2]||=e=>v.value.height=e,type:`number`,min:`1`,class:`popover-input`,onKeydown:(0,t.withKeys)(T,[`enter`])},null,544),[[t.vModelText,v.value.height,void 0,{number:!0}]]),a[17]||=(0,t.createElementVNode)(`span`,{class:`popover-unit`},`px`,-1)]),(0,t.createElementVNode)(`div`,ut,[(0,t.createElementVNode)(`label`,dt,(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.background`)),1),(0,t.createElementVNode)(`div`,ft,[(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`bg-radio-btn`,{active:y.value!==`transparent`}]),title:(0,t.unref)(i)(`canvasSize.solidColor`),onClick:S},[(0,t.createElementVNode)(`span`,{class:`bg-color-fill`,style:(0,t.normalizeStyle)({background:y.value===`transparent`?`#ffffff`:y.value})},null,4),(0,t.createElementVNode)(`input`,{ref_key:`hiddenColorInput`,ref:x,type:`color`,class:`hidden-color-input`,value:y.value===`transparent`?`#ffffff`:y.value,onChange:C},null,40,mt)],10,pt),(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`bg-radio-btn`,`bg-radio-btn--transparent`,{active:y.value===`transparent`}]),title:(0,t.unref)(i)(`canvasSize.transparent`),onClick:w},[...a[18]||=[(0,t.createElementVNode)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`5`,x2:`19`,y2:`19`})],-1)]],10,ht)])]),(0,t.createElementVNode)(`div`,gt,[(0,t.createElementVNode)(`button`,{class:`popover-btn cancel`,onClick:E},(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.cancel`)),1),(0,t.createElementVNode)(`button`,{class:`popover-btn confirm`,onClick:T},(0,t.toDisplayString)((0,t.unref)(i)(`canvasSize.confirm`)),1)])],36)],32)):(0,t.createCommentVNode)(``,!0)]))]),(0,t.createElementVNode)(`div`,_t,[P.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)([`color-indicator`,{active:(0,t.unref)(r).showColorPalette&&(0,t.unref)(r).activeColorSlot===`textColor`}]),title:(0,t.unref)(i)(`color.textColor`),onClick:B},[(0,t.createElementVNode)(`div`,yt,[((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,{class:`text-color-icon`,style:(0,t.normalizeStyle)({color:z.value?`var(--wb-text-secondary)`:R.value}),viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.8`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[...a[19]||=[(0,t.createElementVNode)(`polyline`,{points:`4 7 4 4 20 4 20 7`},null,-1),(0,t.createElementVNode)(`line`,{x1:`9`,y1:`20`,x2:`15`,y2:`20`},null,-1),(0,t.createElementVNode)(`line`,{x1:`12`,y1:`4`,x2:`12`,y2:`20`},null,-1)]],4)),z.value?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,bt,[...a[20]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`},null,-1),(0,t.createElementVNode)(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`},null,-1)]])):(0,t.createCommentVNode)(``,!0)])],10,vt)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`color-indicator`,{active:(0,t.unref)(r).showColorPalette&&(0,t.unref)(r).activeColorSlot===`foreground`,disabled:I.value}]),title:(0,t.unref)(i)(`color.foreground`),onClick:V},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`color-swatch fg`,{mixed:j.value}]),style:(0,t.normalizeStyle)({background:j.value?`none`:A.value})},[j.value?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,St,[...a[21]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`},null,-1),(0,t.createElementVNode)(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`},null,-1)]])):(0,t.createCommentVNode)(``,!0)],6)],10,xt),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`color-indicator`,{active:(0,t.unref)(r).showColorPalette&&(0,t.unref)(r).activeColorSlot===`background`,disabled:L.value}]),title:(0,t.unref)(i)(`color.background`),onClick:H},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`color-swatch bg`,{mixed:N.value,transparent:!N.value&&M.value===`transparent`}]),style:(0,t.normalizeStyle)({background:N.value||M.value===`transparent`?`none`:M.value})},[N.value?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,wt,[...a[22]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`},null,-1),(0,t.createElementVNode)(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`},null,-1)]])):M.value===`transparent`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Tt,[...a[23]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`5`,x2:`19`,y2:`19`},null,-1)]])):(0,t.createCommentVNode)(``,!0)],6)],10,Ct)])]))}}),Q=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},Ot=Q(Dt,[[`__scopeId`,`data-v-9532ade7`]]);function kt(e,t,n,r,i=!1,a=.382){let o=i?-1:1,s=[];for(let i=0;i<5;i++){let c=Math.PI/2*-1+Math.PI*2*i/5,l=c+Math.PI/5;s.push({x:e+n*Math.cos(c),y:t-o*r*Math.sin(c)}),s.push({x:e+n*a*Math.cos(l),y:t-o*r*a*Math.sin(l)})}return s}function At(e,t,n,r){let i=n>=0?e:e+n,a=r>=0?t:t+r,o=Math.abs(n),s=Math.abs(r);return r>=0?[{x:i+o/2,y:a},{x:i+o,y:a+s},{x:i,y:a+s}]:[{x:i+o/2,y:a+s},{x:i,y:a},{x:i+o,y:a}]}function jt(e,t,n){let r=n.x-t.x,i=n.y-t.y,a=r*r+i*i;if(a===0)return Math.hypot(e.x-t.x,e.y-t.y);let o=((e.x-t.x)*r+(e.y-t.y)*i)/a;return o=Math.max(0,Math.min(1,o)),Math.hypot(e.x-(t.x+o*r),e.y-(t.y+o*i))}function Mt(e,t){let n=!1;for(let r=0,i=t.length-1;r<t.length;i=r++){let a=t[r].x,o=t[r].y,s=t[i].x,c=t[i].y;o>e.y!=c>e.y&&e.x<(s-a)*(e.y-o)/(c-o)+a&&(n=!n)}return n}function Nt(e,t,n,r,i){if(r<=0||i<=0)return!1;let a=(e.x-t)/r,o=(e.y-n)/i;return a*a+o*o<=1}function Pt(e){if(e.length===0)return{x:0,y:0,width:0,height:0};let t=1/0,n=1/0,r=-1/0,i=-1/0;for(let a of e)a.x<t&&(t=a.x),a.y<n&&(n=a.y),a.x>r&&(r=a.x),a.y>i&&(i=a.y);return{x:t,y:n,width:r-t,height:i-n}}function Ft(e,t){let{x:n,y:r,width:i,height:a,type:o,points:s,fillColor:c}=t,l=c!==`none`&&c!==`transparent`;switch(o){case`pencil`:if(s.length<2)return!1;for(let t=0;t<s.length-1;t++)if(jt(e,s[t],s[t+1])<8)return!0;return!1;case`line`:return jt(e,{x:n,y:r},{x:n+i,y:r+a})<8;case`circle`:{let t=n+i/2,o=r+a/2,s=Math.abs(i)/2,c=Math.abs(a)/2;return l&&Nt(e,t,o,s,c)?!0:Nt(e,t,o,s+8,c+8)&&!Nt(e,t,o,s-8,c-8)}case`rect`:{if(l&&e.x>=n&&e.x<=n+i&&e.y>=r&&e.y<=r+a)return!0;let t=e.x>=n-8&&e.x<=n+i+8&&e.y>=r-8&&e.y<=r+a+8,o=e.x>=n+8&&e.x<=n+i-8&&e.y>=r+8&&e.y<=r+a-8;return t&&!o}case`triangle`:{let t=At(n,r,i,a);return l&&Mt(e,t)?!0:Mt(e,t)}case`star`:{let t=kt(n+i/2,r+a/2,Math.abs(i)/2,Math.abs(a)/2,a>=0);return l&&Mt(e,t)?!0:Mt(e,t)}case`text`:return e.x>=n-8&&e.x<=n+Math.max(i,32)+8&&e.y>=r-8&&e.y<=r+Math.max(a,16)+8;default:return!1}}function It(e){let n=Z(),r=Be(),i=(0,t.ref)(!1),a=(0,t.ref)({x:0,y:0}),o=(0,t.ref)({x:0,y:0}),s=(0,t.ref)([]),c=(0,t.ref)(!1),l=(0,t.ref)(!1),u=(0,t.ref)(!1),d=(0,t.ref)(!1),f=(0,t.ref)(new Map),p=(0,t.ref)(!1),m=(0,t.ref)(null),h=(0,t.ref)(``),g=(0,t.ref)(``),_=(0,t.ref)(null),v=(0,t.ref)(!1),y=(0,t.ref)(0),b=(0,t.ref)(0),x=(0,t.ref)(0),S=(0,t.ref)(0),C=(0,t.ref)(!1),w=null;function T(e){w=e}function E(){let e=n.editingTextId;if(!e||!n.strokes.find(t=>t.id===e))return;let t=w?.()??null;t!==null&&(t.trim()?n.updateStroke(e,{text:t}):(n.strokes=n.strokes.filter(t=>t.id!==e),n.undoStack.length>0&&n.undoStack.pop()),n.editingTextId=null)}function D(e){if(!v.value)return;let t=e.clientX-y.value,r=e.clientY-b.value;n.setPan(x.value+t,S.value+r)}function O(){v.value&&(v.value=!1,window.removeEventListener(`mousemove`,D),window.removeEventListener(`mouseup`,O),window.removeEventListener(`touchmove`,B),window.removeEventListener(`touchend`,V))}function k(e,t,n,r,i){let a=r-t,o=i-n,s=e===`circle`||e===`rect`||e===`triangle`||e===`star`;if(e===`line`&&u.value){let e=Math.round(Math.atan2(o,a)/(Math.PI/4))*(Math.PI/4),t=Math.hypot(a,o);a=Math.cos(e)*t,o=Math.sin(e)*t}if(s){if(c.value){let e=Math.max(Math.abs(a),Math.abs(o));a=a>=0?e:-e,o=o>=0?e:-e}if(l.value){let e=A(t,n,t+a,n+o),r=e.width,i=e.height;return{x:t-r,y:n-i,width:r*2,height:i*2}}}return e===`line`||e===`triangle`||e===`star`?{x:t,y:n,width:a,height:o}:A(t,n,t+a,n+o)}function A(e,t,n,r){return{x:Math.min(e,n),y:Math.min(t,r),width:Math.abs(n-e),height:Math.abs(r-t)}}let j=(0,t.computed)(()=>{if(!i.value)return null;let e=r.activeTool;if(e===`select`||e===`pan`||e===`zoom`||e===`text`)return null;let{x:t,y:c}=a.value,{x:l,y:u}=o.value;return e===`pencil`?{id:`__preview__`,type:`pencil`,...Pt(s.value),points:[...s.value],strokeColor:n.foregroundColor,fillColor:`none`,strokeWidth:n.strokeWidth}:{id:`__preview__`,type:e,...k(e,t,c,l,u),points:[],strokeColor:n.foregroundColor,fillColor:e===`line`?`none`:n.backgroundColor,strokeWidth:n.strokeWidth}});function M(e){return N(e.clientX,e.clientY)}function N(t,r){let i=e.value;if(!i)return{x:0,y:0};let a=i.getBoundingClientRect();return{x:(t-a.left)/n.zoomLevel,y:(r-a.top)/n.zoomLevel}}function P(e){I(e.clientX,e.clientY,e.type===`mousedown`?e:void 0)}function F(e){if(e.touches.length!==1)return;e.preventDefault();let t=e.touches[0];I(t.clientX,t.clientY)}function I(t,c,l){let u=N(t,c);if(n.editingTextId&&r.activeTool!==`text`&&E(),r.activeTool===`pan`)v.value=!0,y.value=t,b.value=c,x.value=n.panX,S.value=n.panY,window.addEventListener(`mousemove`,D),window.addEventListener(`mouseup`,O),window.addEventListener(`touchmove`,B,{passive:!1}),window.addEventListener(`touchend`,V);else if(r.activeTool===`zoom`&&l){let r=l.button===2?.8:1.25,i=e.value;if(i){let e=i.getBoundingClientRect();n.zoomAt(t-e.left,c-e.top,r)}}else if(r.activeTool===`text`){let e=n.editingTextId;if(e){let t=n.strokes.find(t=>t.id===e);if(t&&Ft(u,t))return}else{let e=[...n.strokes].reverse().find(e=>Ft(u,e));if(e&&e.type===`text`){n.hoveredTextId=null,E(),n.pushUndo(),n.editingTextId=e.id;return}}C.value=!0,a.value=u}else if(a.value=u,o.value=u,i.value=!0,r.activeTool===`pencil`&&(s.value=[u]),r.activeTool===`select`){let e=[...n.strokes].reverse().find(e=>Ft(u,e));if(e&&n.isSelected(e.id)){n.pushUndo(),d.value=!0,f.value.clear();for(let e of n.selectedStrokes)f.value.set(e.id,{x:e.x,y:e.y,width:e.width,height:e.height,points:e.points.map(e=>({...e}))});n.isSelecting=!1,n.selectionBox=null}else d.value=!1,n.isSelecting=!0,n.selectionBox={x:u.x,y:u.y,width:0,height:0}}}function L(e){z(e.clientX,e.clientY)}function R(e){if(e.touches.length!==1)return;e.preventDefault();let t=e.touches[0];z(t.clientX,t.clientY)}function z(e,t){let c=N(e,t);if(r.activeTool===`text`&&!i.value&&!n.editingTextId){let e=[...n.strokes].reverse().find(e=>Ft(c,e));n.hoveredTextId=e&&e.type===`text`?e.id:null}else i.value||(n.hoveredTextId=null);if(i.value&&(o.value=c,r.activeTool===`pencil`&&s.value.push(c),r.activeTool===`select`)){if(d.value){let e=c.x-a.value.x,t=c.y-a.value.y;for(let r of n.selectedStrokes){let i=f.value.get(r.id);i&&n.updateStroke(r.id,{x:i.x+e,y:i.y+t,points:i.points.map(n=>({x:n.x+e,y:n.y+t}))})}}else n.selectionBox={x:Math.min(a.value.x,c.x),y:Math.min(a.value.y,c.y),width:Math.abs(c.x-a.value.x),height:Math.abs(c.y-a.value.y)}}}function B(e){if(!v.value||e.touches.length!==1)return;e.preventDefault();let t=e.touches[0],r=t.clientX-y.value,i=t.clientY-b.value;n.setPan(x.value+r,S.value+i)}function V(){v.value&&(v.value=!1,window.removeEventListener(`mousemove`,D),window.removeEventListener(`mouseup`,O),window.removeEventListener(`touchmove`,B),window.removeEventListener(`touchend`,V))}function H(e){te(e.clientX,e.clientY)}function ee(e){let t=e.changedTouches[0];t&&te(t.clientX,t.clientY)}function te(e,t){if(r.activeTool===`zoom`)return;if(r.activeTool===`text`){if(C.value){C.value=!1,E();let e=n.buildStroke(`text`,a.value.x,a.value.y,0,0,[]);n.addStroke(e),n.editingTextId=e.id}return}if(!i.value)return;i.value=!1;let o=N(e,t),c=o.x-a.value.x,l=o.y-a.value.y,u=Math.hypot(c,l);if(r.activeTool===`select`){if(d.value)d.value=!1,f.value.clear(),n.dataVersion++;else{if(n.isSelecting=!1,u<3){let e=[...n.strokes].reverse().find(e=>Ft(o,e));n.selectStroke(e?.id??null)}else{let e=n.selectionBox,t=[];for(let r of[...n.strokes].reverse()){let i=n.getStrokeDisplayBounds(r);i.x>=e.x&&i.x+i.width<=e.x+e.width&&i.y>=e.y&&i.y+i.height<=e.y+e.height&&t.push(r.id)}n.selectStrokes(t)}n.selectionBox=null}return}if(u<3){n.clearSelection();return}let p=r.activeTool,{x:m,y:h}=a.value;if(p===`pencil`){if(s.value.length<2){n.clearSelection();return}let e=s.value.map(e=>({x:Math.round(e.x),y:Math.round(e.y)})),t=Pt(e);if(t.width<3&&t.height<3){n.clearSelection();return}let i=n.buildStroke(`pencil`,t.x,t.y,t.width,t.height,e);n.addStroke(i),r.setTool(`select`);return}let g=o.x-m,_=o.y-h;if(Math.abs(g)<3&&Math.abs(_)<3){n.clearSelection();return}let v=k(p,m,h,o.x,o.y),y=n.buildStroke(p,v.x,v.y,v.width,v.height,[]);n.addStroke(y),r.setTool(`select`)}function U(e,t){n.strokes.find(t=>t.id===e)&&(t.trim()?n.updateStroke(e,{text:t}):(n.strokes=n.strokes.filter(t=>t.id!==e),n.undoStack.length>0&&n.undoStack.pop()),n.editingTextId=null,r.activeTool===`text`&&r.setTool(`select`))}function W(e){let t=n.strokes.find(t=>t.id===e);t&&(t.text&&t.text.trim()||(n.strokes=n.strokes.filter(t=>t.id!==e),n.undoStack.length>0&&n.undoStack.pop()),n.editingTextId=null,r.activeTool===`text`&&r.setTool(`select`))}function G(e){n.pushUndo(),n.editingTextId=e}function K(e){let t=e.ctrlKey||e.metaKey;c.value=t,l.value=e.shiftKey,u.value=e.shiftKey}function q(){c.value=!1,l.value=!1,u.value=!1}function ne(e,t){let{x:n,y:r,w:i,h:a}=e;switch(t){case`nw`:return{x:n+i,y:r+a};case`n`:return{x:n+i/2,y:r+a};case`ne`:return{x:n,y:r+a};case`e`:return{x:n,y:r+a/2};case`se`:return{x:n,y:r};case`s`:return{x:n+i/2,y:r};case`sw`:return{x:n+i,y:r};case`w`:return{x:n+i,y:r+a/2};case`line-start`:return{x:n+i,y:r+a};case`line-end`:return{x:n,y:r};default:return{x:n+i,y:r+a}}}function re(e){return e===`n`||e===`s`||e===`e`||e===`w`}function ie(e,t,r,i){let s=n.strokes.find(t=>t.id===e);if(!s)return;n.pushUndo();let c=ue(s);_.value={x:c.x,y:c.y,width:c.width,height:c.height,type:s.type},m.value=e,h.value=t,g.value=r,p.value=!0;let l,u;if(`touches`in i){let e=i.touches[0]||i.changedTouches[0];l=e.clientX,u=e.clientY,i.preventDefault()}else l=i.clientX,u=i.clientY;let d=N(l,u);a.value=d,o.value=d,window.addEventListener(`mousemove`,J),window.addEventListener(`mouseup`,se),window.addEventListener(`touchmove`,ae,{passive:!1}),window.addEventListener(`touchend`,ce)}function J(e){oe(e.clientX,e.clientY)}function ae(e){if(e.touches.length!==1)return;e.preventDefault();let t=e.touches[0];oe(t.clientX,t.clientY)}function oe(e,t){if(!p.value||!_.value||!m.value)return;let r=N(e,t);o.value=r;let i=_.value,a=i.x+i.width/2,s=i.y+i.height/2,c;if(l.value&&re(h.value)){let{x:e,y:t,width:o,height:l}=i;switch(h.value){case`n`:{let t=Math.abs(r.y-s);c={x:e,y:s-t,width:o,height:t*2};break}case`s`:{let t=Math.abs(r.y-s);c={x:e,y:s-t,width:o,height:t*2};break}case`e`:{let e=Math.abs(r.x-a);c={x:a-e,y:t,width:e*2,height:l};break}case`w`:{let e=Math.abs(r.x-a);c={x:a-e,y:t,width:e*2,height:l};break}default:c={x:e,y:t,width:o,height:l}}n.updateStroke(m.value,c)}else if(l.value)c=k(i.type,a,s,r.x,r.y),n.updateStroke(m.value,c);else{if(re(h.value)){let{x:e,y:t,width:n,height:a}=i;switch(h.value){case`n`:{let i=t+a;c={x:e,y:Math.min(r.y,i),width:n,height:Math.abs(r.y-i)};break}case`s`:c={x:e,y:t,width:n,height:Math.abs(r.y-t)};break;case`e`:c={x:e,y:t,width:Math.abs(r.x-e),height:a};break;case`w`:{let i=e+n;c={x:Math.min(r.x,i),y:t,width:Math.abs(r.x-i),height:a};break}default:c={x:e,y:t,width:n,height:a}}}else{let e=ne({x:i.x,y:i.y,w:i.width,h:i.height},h.value);c=k(i.type,e.x,e.y,r.x,r.y)}_.value?.type===`text`?(c.width<1&&(c.width=1),n.updateStroke(m.value,{x:c.x,width:c.width,textAutoWidth:!1})):n.updateStroke(m.value,c)}}function se(){le()}function ce(e){e.touches.length===0&&le()}function le(){p.value=!1,m.value=null,h.value=``,g.value=``,_.value=null,n.dataVersion++,window.removeEventListener(`mousemove`,J),window.removeEventListener(`mouseup`,se),window.removeEventListener(`touchmove`,ae),window.removeEventListener(`touchend`,ce)}function ue(e){let{type:t}=e;if(t===`line`||t===`triangle`||t===`star`){let{x:t,y:n,width:r,height:i}=e;return{x:r>=0?t:t+r,y:i>=0?n:n+i,width:Math.abs(r),height:Math.abs(i)}}return{x:e.x,y:e.y,width:e.width,height:e.height}}return{isDrawing:i,previewStroke:j,onMouseDown:P,onMouseMove:L,onMouseUp:H,onTouchStart:F,onTouchMove:R,onTouchEnd:ee,getSVGPoint:M,updateModifiers:K,clearModifiers:q,isResizing:p,resizeCursor:g,startResize:ie,commitTextEdit:U,cancelTextEdit:W,startEditText:G,saveCurrentTextEdit:E,setTextContentGetter:T}}function Lt(e){if(e.length===0)return``;if(e.length===1)return`M ${e[0].x} ${e[0].y}`;if(e.length===2)return`M ${e[0].x} ${e[0].y} L ${e[1].x} ${e[1].y}`;let t=`M ${e[0].x} ${e[0].y}`;for(let n=1;n<e.length-1;n++){let r=(e[n].x+e[n+1].x)/2,i=(e[n].y+e[n+1].y)/2;t+=` Q ${e[n].x} ${e[n].y} ${r} ${i}`}return t+=` L ${e[e.length-1].x} ${e[e.length-1].y}`,t}function Rt(e){let{type:t,x:n,y:r,width:i,height:a,points:o,strokeColor:s,fillColor:c,strokeWidth:l}=e,u={stroke:s,fill:c,"stroke-width":l,"stroke-linecap":`round`,"stroke-linejoin":`round`};switch(t){case`pencil`:return{tag:`path`,attrs:{...u,fill:`none`,d:Lt(o)}};case`line`:return{tag:`line`,attrs:{...u,fill:`none`,x1:n,y1:r,x2:n+i,y2:r+a}};case`circle`:{let e=n+i/2,t=r+a/2,o=Math.abs(i)/2,s=Math.abs(a)/2;return{tag:`ellipse`,attrs:{...u,cx:e,cy:t,rx:o,ry:s}}}case`rect`:return{tag:`rect`,attrs:{...u,x:i>=0?n:n+i,y:a>=0?r:r+a,width:Math.abs(i),height:Math.abs(a)}};case`triangle`:{let e=At(n,r,i,a).map(e=>`${e.x},${e.y}`).join(` `);return{tag:`polygon`,attrs:{...u,points:e}}}case`star`:{let e=kt(n+i/2,r+a/2,Math.abs(i)/2,Math.abs(a)/2,a>=0).map(e=>`${e.x},${e.y}`).join(` `);return{tag:`polygon`,attrs:{...u,points:e}}}case`text`:return{tag:`g`,attrs:{}};default:return{tag:`g`,attrs:{}}}}var zt=Q((0,t.defineComponent)({__name:`StrokeRenderer`,props:{stroke:{},isSelected:{type:Boolean}},setup(e){return(n,r)=>((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)((0,t.unref)(Rt)(e.stroke).tag),(0,t.mergeProps)((0,t.unref)(Rt)(e.stroke).attrs,{class:{selected:e.isSelected},"data-stroke-id":e.stroke.id}),null,16,[`class`,`data-stroke-id`]))}}),[[`__scopeId`,`data-v-d3706fa4`]]),Bt={key:0},Vt=[`x`,`y`,`width`,`height`],Ht=[`x`,`y`,`onMousedown`,`onTouchstart`],Ut=[`x`,`y`,`onMousedown`,`onTouchstart`],Wt=6,$=8,Gt=(0,t.defineComponent)({__name:`SelectionOverlay`,props:{stroke:{},startResize:{type:Function}},setup(e){let n=e,r=Z(),i=(0,t.computed)(()=>{let e=r.getStrokeDisplayBounds(n.stroke);return{x:e.x-Wt,y:e.y-Wt,w:e.width+12,h:e.height+12}}),a=(0,t.computed)(()=>n.stroke.type===`line`),o=(0,t.computed)(()=>{let e=n.stroke;return[{name:`line-start`,cx:e.x,cy:e.y,cursor:`move`},{name:`line-end`,cx:e.x+e.width,cy:e.y+e.height,cursor:`move`}]}),s=(0,t.computed)(()=>n.stroke.type===`text`),c=(0,t.computed)(()=>{let e=i.value,t=[{name:`nw`,cx:e.x,cy:e.y,cursor:`nwse-resize`},{name:`n`,cx:e.x+e.w/2,cy:e.y,cursor:`ns-resize`},{name:`ne`,cx:e.x+e.w,cy:e.y,cursor:`nesw-resize`},{name:`e`,cx:e.x+e.w,cy:e.y+e.h/2,cursor:`ew-resize`},{name:`se`,cx:e.x+e.w,cy:e.y+e.h,cursor:`nwse-resize`},{name:`s`,cx:e.x+e.w/2,cy:e.y+e.h,cursor:`ns-resize`},{name:`sw`,cx:e.x,cy:e.y+e.h,cursor:`nesw-resize`},{name:`w`,cx:e.x,cy:e.y+e.h/2,cursor:`ew-resize`}];return s.value?t.filter(e=>e.name!==`n`&&e.name!==`s`):t});function l(e,t,r){r.preventDefault(),r.stopPropagation(),n.startResize(n.stroke.id,e,t,r)}return(n,r)=>e.stroke?((0,t.openBlock)(),(0,t.createElementBlock)(`g`,Bt,[(0,t.createElementVNode)(`rect`,{x:i.value.x,y:i.value.y,width:i.value.w,height:i.value.h,fill:`none`,stroke:`#6366f1`,"stroke-width":`2`,"stroke-dasharray":`6 4`,rx:`4`},null,8,Vt),((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(o.value,e=>(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:e.name,x:e.cx-$/2,y:e.cy-$/2,width:$,height:$,fill:`white`,stroke:`#6366f1`,"stroke-width":`1.5`,rx:`1`,style:(0,t.normalizeStyle)({cursor:e.cursor}),onMousedown:(0,t.withModifiers)(t=>l(e.name,e.cursor,t),[`stop`,`prevent`]),onTouchstart:(0,t.withModifiers)(t=>l(e.name,e.cursor,t),[`stop`,`prevent`])},null,44,Ht)),[[t.vShow,a.value]])),128)),((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(c.value,e=>(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:e.name,x:e.cx-$/2,y:e.cy-$/2,width:$,height:$,fill:`white`,stroke:`#6366f1`,"stroke-width":`1.5`,rx:`1`,style:(0,t.normalizeStyle)({cursor:e.cursor}),onMousedown:(0,t.withModifiers)(t=>l(e.name,e.cursor,t),[`stop`,`prevent`]),onTouchstart:(0,t.withModifiers)(t=>l(e.name,e.cursor,t),[`stop`,`prevent`])},null,44,Ut)),[[t.vShow,!a.value]])),128))])):(0,t.createCommentVNode)(``,!0)}}),Kt=[`viewBox`],qt=[`width`,`height`,`fill`],Jt=[`width`,`height`,`fill`],Yt=[`width`,`height`,`stroke`],Xt={class:`strokes-layer`},Zt=[`x`,`y`,`width`],Qt=[`contenteditable`,`onDblclick`],$t=[`x`,`y`,`width`,`height`],en=[`x`,`y`,`width`,`height`],tn=[`disabled`,`title`],nn=[`disabled`,`title`],rn=[`title`],an=[`title`],on=[`title`],sn=[`title`],cn={class:`zoom-percent`},ln=[`title`],un={class:`font-size-value`},dn=[`title`],fn=[`title`],pn=[`title`],mn=Q((0,t.defineComponent)({__name:`Whiteboard`,setup(e){let n=Z(),r=Be(),{t:i}=o(),a=(0,t.ref)(null),{isDrawing:s,previewStroke:c,onMouseDown:l,onMouseMove:u,onMouseUp:d,onTouchStart:f,onTouchMove:p,onTouchEnd:m,updateModifiers:h,clearModifiers:g,isResizing:_,resizeCursor:v,startResize:y,commitTextEdit:b,cancelTextEdit:x,startEditText:S,saveCurrentTextEdit:C,setTextContentGetter:w}=It(a);w(()=>{let e=n.editingTextId;if(!e)return null;let t=D.value.get(e);return t?t.innerText:null}),(0,t.watch)(()=>r.activeTool,e=>{e!==`text`&&C()});let T=(0,t.computed)(()=>_.value?v.value:r.activeTool===`pan`?`grab`:r.activeTool===`zoom`?`zoom-in`:r.activeTool===`text`?n.hoveredTextId?`pointer`:`text`:r.activeTool===`select`?`default`:`crosshair`),E=(0,t.computed)(()=>r.activeTool===`zoom`),D=(0,t.ref)(new Map),O=(0,t.computed)(()=>{let e=n.hoveredTextId;if(!e)return null;let t=n.strokes.find(t=>t.id===e);return t?n.getStrokeDisplayBounds(t):null}),k=(0,t.computed)(()=>{let e=n.selectedStrokes;return e.length===1&&e[0].type===`text`?e[0]:null});function A(e){if(n.editingTextId){if(e.key===`Enter`&&!e.shiftKey){e.preventDefault(),e.stopPropagation();let r=D.value.get(n.editingTextId),i=r?r.innerText:``;b(n.editingTextId,i),(0,t.nextTick)(()=>{})}else e.key===`Escape`&&(e.preventDefault(),e.stopPropagation(),x(n.editingTextId))}}(0,t.watch)(()=>n.editingTextId,e=>{e&&(0,t.nextTick)(()=>{let t=D.value.get(e);if(t){t.focus();let e=document.createRange();e.selectNodeContents(t),e.collapse(!1);let n=window.getSelection();n?.removeAllRanges(),n?.addRange(e)}})});function j(e){(r.activeTool===`text`||r.activeTool===`select`)&&S(e)}function M(){n.hoveredTextId=null}function N(){let e=a.value?.parentElement;e&&n.zoomAt(e.clientWidth/2,e.clientHeight/2,1.1)}function P(){let e=a.value?.parentElement;e&&n.zoomAt(e.clientWidth/2,e.clientHeight/2,.9)}function F(e){let t=e.ctrlKey||e.metaKey;n.editingTextId||((s.value||_.value)&&h(e),e.key===`Delete`||e.key===`Backspace`?n.deleteSelectedStrokes():e.key===`Escape`?n.clearSelection():t&&e.key===`z`&&!e.shiftKey?(e.preventDefault(),n.undo()):t&&(e.key===`y`||e.shiftKey&&e.key===`z`)?(e.preventDefault(),n.redo()):t&&e.key===`x`?(e.preventDefault(),n.cutSelectedStrokes()):t&&e.key===`c`?(e.preventDefault(),n.copySelectedStrokes()):t&&e.key===`v`&&(e.preventDefault(),n.pasteStrokes()))}function I(e){(s.value||_.value)&&h(e)}function L(){g()}let R=(0,t.ref)(0),z=(0,t.ref)(1),B=(0,t.ref)(0),V=(0,t.ref)(0);function H(e){let t=e[0].clientX-e[1].clientX,n=e[0].clientY-e[1].clientY;return Math.hypot(t,n)}function ee(e){r.activeTool===`zoom`&&e.touches.length===2&&(R.value=H(e.touches),z.value=n.zoomLevel,B.value=(e.touches[0].clientX+e.touches[1].clientX)/2,V.value=(e.touches[0].clientY+e.touches[1].clientY)/2)}function te(e){if(r.activeTool===`zoom`&&e.touches.length===2&&R.value>0){let t=H(e.touches)/R.value,r=z.value*t,i=a.value;if(i){let e=i.getBoundingClientRect();n.continuousZoomAt(B.value-e.left,V.value-e.top,r)}}}function U(e){r.activeTool===`zoom`&&e.touches.length<2&&(R.value=0)}let W=null;function G(){let e=a.value?.parentElement;if(!e)return;let t=n.canvasWidth*n.zoomLevel,r=n.canvasHeight*n.zoomLevel,i=e.clientWidth,o=e.clientHeight;i>0&&o>0&&n.setPan((i-t)/2,(o-r)/2)}function K(e){let t=k.value;if(!t)return;let r=t.fontSize??16,i=Math.max(8,Math.min(200,r+e));n.pushUndo(),n.updateStroke(t.id,{fontSize:i}),n.dataVersion++}function q(e){let t=k.value;t&&(n.pushUndo(),n.updateStroke(t.id,{textAlign:e}),n.dataVersion++)}function ne(e){return n=>{n?(D.value.set(e,n),(0,t.nextTick)(()=>re(e,n))):D.value.delete(e)}}function re(e,t){let r=n.strokes.find(t=>t.id===e);if(!r)return;let i=Math.max(t.scrollWidth/n.zoomLevel,r.fontSize??16),a=Math.max(t.scrollHeight/n.zoomLevel,r.fontSize??16);if(r.textAutoWidth){if(Math.abs(r.width-i)<.5&&Math.abs(r.height-a)<.5)return;n.updateStroke(e,{width:i,height:a})}else{let t=Math.max(r.width,i);if(Math.abs(r.width-t)<.5&&Math.abs(r.height-a)<.5)return;n.updateStroke(e,{width:t,height:a})}}return(0,t.onMounted)(()=>{window.addEventListener(`keydown`,F),window.addEventListener(`keydown`,A),window.addEventListener(`keyup`,I),window.addEventListener(`blur`,L),G(),W=new ResizeObserver(()=>G());let e=a.value?.parentElement;e&&W.observe(e)}),(0,t.onUnmounted)(()=>{window.removeEventListener(`keydown`,F),window.removeEventListener(`keydown`,A),window.removeEventListener(`keyup`,I),window.removeEventListener(`blur`,L),W?.disconnect()}),(e,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`whiteboard`,onContextmenu:r[23]||=(0,t.withModifiers)(()=>{},[`prevent`]),onMousedown:r[24]||=(...e)=>(0,t.unref)(l)&&(0,t.unref)(l)(...e),onMousemove:r[25]||=(...e)=>(0,t.unref)(u)&&(0,t.unref)(u)(...e),onMouseup:r[26]||=(...e)=>(0,t.unref)(d)&&(0,t.unref)(d)(...e),onTouchstart:r[27]||=(0,t.withModifiers)(e=>{(0,t.unref)(f)(e),ee(e)},[`prevent`]),onTouchmove:r[28]||=(0,t.withModifiers)(e=>{(0,t.unref)(p)(e),te(e)},[`prevent`]),onTouchend:r[29]||=e=>{(0,t.unref)(m)(e),U(e)}},[(0,t.createElementVNode)(`div`,{ref_key:`wrapperRef`,ref:a,class:`canvas-wrapper`,style:(0,t.normalizeStyle)({width:(0,t.unref)(n).canvasWidth+`px`,height:(0,t.unref)(n).canvasHeight+`px`,transform:(0,t.unref)(n).canvasTransform,transformOrigin:`0 0`})},[((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,{class:`canvas`,viewBox:(0,t.unref)(n).viewBox,width:`100%`,height:`100%`,style:(0,t.normalizeStyle)({cursor:T.value}),onMouseleave:M},[r[30]||=(0,t.createStaticVNode)(`<defs data-v-975e0b8b><pattern id="grid-light" width="16" height="16" patternUnits="userSpaceOnUse" data-v-975e0b8b><rect width="16" height="16" fill="#ffffff" data-v-975e0b8b></rect><rect width="8" height="8" fill="#f0f0f0" data-v-975e0b8b></rect><rect x="8" y="8" width="8" height="8" fill="#f0f0f0" data-v-975e0b8b></rect></pattern><pattern id="grid-dark" width="16" height="16" patternUnits="userSpaceOnUse" data-v-975e0b8b><rect width="16" height="16" fill="#1e1e30" data-v-975e0b8b></rect><rect width="8" height="8" fill="#2a2a3e" data-v-975e0b8b></rect><rect x="8" y="8" width="8" height="8" fill="#2a2a3e" data-v-975e0b8b></rect></pattern></defs>`,1),(0,t.unref)(n).canvasBackgroundColor===`transparent`?((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:0,x:`0`,y:`0`,width:(0,t.unref)(n).canvasWidth,height:(0,t.unref)(n).canvasHeight,fill:(0,t.unref)(n).theme===`dark`?`url(#grid-dark)`:`url(#grid-light)`},null,8,qt)):((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:1,x:`0`,y:`0`,width:(0,t.unref)(n).canvasWidth,height:(0,t.unref)(n).canvasHeight,fill:(0,t.unref)(n).canvasBackgroundColor},null,8,Jt)),(0,t.createElementVNode)(`rect`,{x:`0`,y:`0`,width:(0,t.unref)(n).canvasWidth,height:(0,t.unref)(n).canvasHeight,fill:`none`,stroke:(0,t.unref)(n).theme===`dark`?`#4a4a5a`:`#c0c0c0`,"stroke-width":`2`},null,8,Yt),(0,t.createElementVNode)(`g`,Xt,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)((0,t.unref)(n).strokes,e=>((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:e.id},[e.type===`text`?((0,t.openBlock)(),(0,t.createElementBlock)(`foreignObject`,{key:0,x:e.x,y:e.y,width:e.textAutoWidth?1:e.width||1,height:1,style:{overflow:`visible`,pointerEvents:`none`}},[(0,t.createElementVNode)(`div`,{ref_for:!0,ref:ne(e.id),xmlns:`http://www.w3.org/1999/xhtml`,contenteditable:(0,t.unref)(n).editingTextId===e.id,style:(0,t.normalizeStyle)({fontSize:(e.fontSize??16)+`px`,color:e.textColor??e.strokeColor,textAlign:e.textAlign??`left`,whiteSpace:e.textAutoWidth?`nowrap`:`pre-wrap`,wordBreak:e.textAutoWidth?`normal`:`break-word`,padding:`2px 4px`,minHeight:(e.fontSize??16)+`px`,outline:(0,t.unref)(n).editingTextId===e.id?`2px solid #6366f1`:`none`,cursor:(0,t.unref)(n).editingTextId===e.id?`text`:`default`,userSelect:(0,t.unref)(n).editingTextId===e.id?`text`:`none`,pointerEvents:(0,t.unref)(n).editingTextId===e.id?`auto`:`none`,background:(0,t.unref)(n).editingTextId===e.id?`rgba(255,255,255,0.9)`:`transparent`,borderRadius:`2px`,display:`inline-block`,maxWidth:e.textAutoWidth?`none`:`100%`}),onDblclick:(0,t.withModifiers)(t=>j(e.id),[`stop`])},(0,t.toDisplayString)(e.text||``),45,Qt)],8,Zt)):((0,t.openBlock)(),(0,t.createBlock)(zt,{key:1,stroke:e,"is-selected":(0,t.unref)(n).isSelected(e.id)},null,8,[`stroke`,`is-selected`]))],64))),128))]),(0,t.unref)(c)?((0,t.openBlock)(),(0,t.createBlock)(zt,{key:2,stroke:(0,t.unref)(c),"is-selected":!1},null,8,[`stroke`])):(0,t.createCommentVNode)(``,!0),((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)((0,t.unref)(n).selectedStrokes,e=>((0,t.openBlock)(),(0,t.createBlock)(Gt,{key:`sel-`+e.id,stroke:e,"start-resize":(0,t.unref)(y)},null,8,[`stroke`,`start-resize`]))),128)),(0,t.unref)(n).isSelecting&&(0,t.unref)(n).selectionBox?((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:3,x:(0,t.unref)(n).selectionBox.x,y:(0,t.unref)(n).selectionBox.y,width:(0,t.unref)(n).selectionBox.width,height:(0,t.unref)(n).selectionBox.height,fill:`rgba(99, 102, 241, 0.08)`,stroke:`#6366f1`,"stroke-width":`1`,"stroke-dasharray":`6 4`},null,8,$t)):(0,t.createCommentVNode)(``,!0),O.value?((0,t.openBlock)(),(0,t.createElementBlock)(`rect`,{key:4,x:O.value.x-4,y:O.value.y-4,width:O.value.width+8,height:O.value.height+8,fill:`none`,stroke:`#6366f1`,"stroke-width":`1`,"stroke-dasharray":`4 3`,"pointer-events":`none`},null,8,en)):(0,t.createCommentVNode)(``,!0)],44,Kt))],4),(0,t.createElementVNode)(`div`,{class:`canvas-toolbar`,onMousedown:r[5]||=(0,t.withModifiers)(()=>{},[`stop`]),onMouseup:r[6]||=(0,t.withModifiers)(()=>{},[`stop`]),onClick:r[7]||=(0,t.withModifiers)(()=>{},[`stop`]),onTouchstart:r[8]||=(0,t.withModifiers)(()=>{},[`stop`]),onTouchmove:r[9]||=(0,t.withModifiers)(()=>{},[`stop`]),onTouchend:r[10]||=(0,t.withModifiers)(()=>{},[`stop`])},[(0,t.createElementVNode)(`button`,{class:`canvas-tb-btn`,disabled:!(0,t.unref)(n).canUndo,title:(0,t.unref)(i)(`toolbar.undo`),onClick:r[0]||=e=>(0,t.unref)(n).undo()},[...r[31]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`path`,{d:`M3 10h10a5 5 0 0 1 0 10H9`}),(0,t.createElementVNode)(`polyline`,{points:`7 6 3 10 7 14`})],-1)]],8,tn),(0,t.createElementVNode)(`button`,{class:`canvas-tb-btn`,disabled:!(0,t.unref)(n).canRedo,title:(0,t.unref)(i)(`toolbar.redo`),onClick:r[1]||=e=>(0,t.unref)(n).redo()},[...r[32]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`path`,{d:`M21 10H11a5 5 0 0 0 0 10h4`}),(0,t.createElementVNode)(`polyline`,{points:`17 6 21 10 17 14`})],-1)]],8,nn),(0,t.unref)(n).selectedStrokeIds.size>0?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,class:`canvas-tb-btn`,title:(0,t.unref)(i)(`toolbar.bringToFront`),onClick:r[2]||=e=>(0,t.unref)(n).moveSelectedUp()},[...r[33]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`path`,{d:`m18 15-6-6-6 6`})],-1)]],8,rn)):(0,t.createCommentVNode)(``,!0),(0,t.unref)(n).selectedStrokeIds.size>0?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:1,class:`canvas-tb-btn`,title:(0,t.unref)(i)(`toolbar.sendToBack`),onClick:r[3]||=e=>(0,t.unref)(n).moveSelectedDown()},[...r[34]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[(0,t.createElementVNode)(`path`,{d:`m6 9 6 6 6-6`})],-1)]],8,an)):(0,t.createCommentVNode)(``,!0),(0,t.unref)(n).selectedStrokeIds.size>0?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:2,class:`canvas-tb-btn canvas-tb-btn--danger`,title:(0,t.unref)(i)(`toolbar.delete`),onClick:r[4]||=e=>(0,t.unref)(n).deleteSelectedStrokes()},[...r[35]||=[(0,t.createStaticVNode)(`<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" data-v-975e0b8b><polyline points="3 6 5 6 21 6" data-v-975e0b8b></polyline><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6" data-v-975e0b8b></path><path d="M10 11v6" data-v-975e0b8b></path><path d="M14 11v6" data-v-975e0b8b></path><path d="M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2" data-v-975e0b8b></path></svg>`,1)]],8,on)):(0,t.createCommentVNode)(``,!0)],32),E.value||(0,t.unref)(n).showZoomIndicator?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`zoom-control`,onTouchstart:r[11]||=(0,t.withModifiers)(()=>{},[`stop`,`prevent`])},[E.value?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,class:`zoom-btn`,title:(0,t.unref)(i)(`zoom.zoomOut`),onMousedown:(0,t.withModifiers)(P,[`stop`,`prevent`]),onTouchstart:(0,t.withModifiers)(P,[`stop`,`prevent`])},[...r[36]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`})],-1)]],40,sn)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`span`,cn,(0,t.toDisplayString)((0,t.unref)(n).getZoomPercent())+`%`,1),E.value?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:1,class:`zoom-btn`,title:(0,t.unref)(i)(`zoom.zoomIn`),onMousedown:(0,t.withModifiers)(N,[`stop`,`prevent`]),onTouchstart:(0,t.withModifiers)(N,[`stop`,`prevent`])},[...r[37]||=[(0,t.createElementVNode)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`}),(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`})],-1)]],40,ln)):(0,t.createCommentVNode)(``,!0)],32)):(0,t.createCommentVNode)(``,!0),k.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:1,class:`text-format-control`,onTouchstart:r[22]||=(0,t.withModifiers)(()=>{},[`stop`,`prevent`])},[(0,t.createElementVNode)(`button`,{class:`font-size-btn`,onMousedown:r[12]||=(0,t.withModifiers)(e=>K(-1),[`stop`,`prevent`]),onTouchstart:r[13]||=(0,t.withModifiers)(e=>K(-1),[`stop`,`prevent`])},[...r[38]||=[(0,t.createElementVNode)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`})],-1)]],32),(0,t.createElementVNode)(`span`,un,(0,t.toDisplayString)(k.value.fontSize??(0,t.unref)(16)),1),(0,t.createElementVNode)(`button`,{class:`font-size-btn`,onMousedown:r[14]||=(0,t.withModifiers)(e=>K(1),[`stop`,`prevent`]),onTouchstart:r[15]||=(0,t.withModifiers)(e=>K(1),[`stop`,`prevent`])},[...r[39]||=[(0,t.createElementVNode)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`}),(0,t.createElementVNode)(`line`,{x1:`5`,y1:`12`,x2:`19`,y2:`12`})],-1)]],32),r[43]||=(0,t.createElementVNode)(`div`,{class:`text-align-separator`},null,-1),(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`text-align-btn`,{active:k.value.textAlign===`left`||!k.value.textAlign}]),title:(0,t.unref)(i)(`textAlign.left`),onMousedown:r[16]||=(0,t.withModifiers)(e=>q(`left`),[`stop`,`prevent`]),onTouchstart:r[17]||=(0,t.withModifiers)(e=>q(`left`),[`stop`,`prevent`])},[...r[40]||=[(0,t.createStaticVNode)(`<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" data-v-975e0b8b><line x1="3" y1="6" x2="21" y2="6" data-v-975e0b8b></line><line x1="3" y1="10" x2="17" y2="10" data-v-975e0b8b></line><line x1="3" y1="14" x2="21" y2="14" data-v-975e0b8b></line><line x1="3" y1="18" x2="15" y2="18" data-v-975e0b8b></line></svg>`,1)]],42,dn),(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`text-align-btn`,{active:k.value.textAlign===`center`}]),title:(0,t.unref)(i)(`textAlign.center`),onMousedown:r[18]||=(0,t.withModifiers)(e=>q(`center`),[`stop`,`prevent`]),onTouchstart:r[19]||=(0,t.withModifiers)(e=>q(`center`),[`stop`,`prevent`])},[...r[41]||=[(0,t.createStaticVNode)(`<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" data-v-975e0b8b><line x1="3" y1="6" x2="21" y2="6" data-v-975e0b8b></line><line x1="5" y1="10" x2="19" y2="10" data-v-975e0b8b></line><line x1="3" y1="14" x2="21" y2="14" data-v-975e0b8b></line><line x1="7" y1="18" x2="17" y2="18" data-v-975e0b8b></line></svg>`,1)]],42,fn),(0,t.createElementVNode)(`button`,{class:(0,t.normalizeClass)([`text-align-btn`,{active:k.value.textAlign===`right`}]),title:(0,t.unref)(i)(`textAlign.right`),onMousedown:r[20]||=(0,t.withModifiers)(e=>q(`right`),[`stop`,`prevent`]),onTouchstart:r[21]||=(0,t.withModifiers)(e=>q(`right`),[`stop`,`prevent`])},[...r[42]||=[(0,t.createStaticVNode)(`<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" data-v-975e0b8b><line x1="3" y1="6" x2="21" y2="6" data-v-975e0b8b></line><line x1="7" y1="10" x2="21" y2="10" data-v-975e0b8b></line><line x1="3" y1="14" x2="21" y2="14" data-v-975e0b8b></line><line x1="9" y1="18" x2="21" y2="18" data-v-975e0b8b></line></svg>`,1)]],42,pn)],32)):(0,t.createCommentVNode)(``,!0)],32))}}),[[`__scopeId`,`data-v-975e0b8b`]]),hn={class:`palette-header`},gn={class:`palette-title`},_n={class:`current-color`},vn={key:0,width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},yn={class:`preset-grid`},bn=[`title`,`onClick`],xn={key:0,class:`transparent-row`},Sn={class:`palette-footer`},Cn={class:`custom-color`},wn=[`value`],Tn={class:`custom-label`},En=Q((0,t.defineComponent)({__name:`ColorPalette`,setup(e){let n=Z(),{t:r}=o(),i=l(),a=(0,t.computed)(()=>{if(!i?.value)return{};let e=i.value.getBoundingClientRect();return{left:e.left+60+`px`,bottom:window.innerHeight-e.bottom+9+`px`,position:`fixed`}}),s=[`#000000`,`#ffffff`,`#6b7280`,`#d1d5db`,`#dc2626`,`#ef4444`,`#f97316`,`#f59e0b`,`#16a34a`,`#22c55e`,`#0891b2`,`#06b6d4`,`#2563eb`,`#3b82f6`,`#7c3aed`,`#8b5cf6`,`#db2777`,`#ec4899`,`#a16207`,`#84cc16`,`#0d9488`,`#6366f1`,`#d946ef`,`#f43f5e`];function c(e){let t=e.target;n.setColor(t.value)}function u(e){n.setColor(e),n.hideColorPalette()}function d(){n.setColor(`transparent`),n.hideColorPalette()}return(e,i)=>((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:`body`},[(0,t.unref)(n).showColorPalette?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`overlay`,onClick:i[1]||=(...e)=>(0,t.unref)(n).hideColorPalette&&(0,t.unref)(n).hideColorPalette(...e)},[(0,t.createElementVNode)(`div`,{class:`color-palette`,style:(0,t.normalizeStyle)(a.value),onClick:i[0]||=(0,t.withModifiers)(()=>{},[`stop`])},[(0,t.createElementVNode)(`div`,hn,[(0,t.createElementVNode)(`span`,gn,(0,t.toDisplayString)((0,t.unref)(n).activeColorSlot===`textColor`?(0,t.unref)(r)(`color.textColor`):(0,t.unref)(n).activeColorSlot===`foreground`?(0,t.unref)(r)(`palette.stroke`):(0,t.unref)(r)(`palette.fill`)),1),(0,t.createElementVNode)(`div`,_n,[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`current-swatch`,{fill:(0,t.unref)(n).activeColorSlot===`background`,"current-transparent":(0,t.unref)(n).activeColorSlot===`background`&&(0,t.unref)(n).backgroundColor===`transparent`}]),style:(0,t.normalizeStyle)({background:(0,t.unref)(n).activeColorSlot===`textColor`?(0,t.unref)(n).textColor:(0,t.unref)(n).activeColorSlot===`foreground`?(0,t.unref)(n).foregroundColor:(0,t.unref)(n).backgroundColor===`transparent`?`none`:(0,t.unref)(n).backgroundColor})},[(0,t.unref)(n).activeColorSlot===`background`&&(0,t.unref)(n).backgroundColor===`transparent`?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,vn,[...i[2]||=[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`5`,x2:`19`,y2:`19`},null,-1)]])):(0,t.createCommentVNode)(``,!0)],6)])]),(0,t.createElementVNode)(`div`,yn,[((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(s,e=>(0,t.createElementVNode)(`button`,{key:e,class:`color-swatch`,style:(0,t.normalizeStyle)({background:e}),title:e,onClick:t=>u(e)},null,12,bn)),64))]),(0,t.unref)(n).activeColorSlot===`background`?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,xn,[(0,t.createElementVNode)(`button`,{class:`color-swatch transparent-swatch`,title:`透明（无填充）`,onClick:d},[...i[3]||=[(0,t.createElementVNode)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`#d00`,"stroke-width":`2`,"stroke-linecap":`round`},[(0,t.createElementVNode)(`line`,{x1:`5`,y1:`5`,x2:`19`,y2:`19`})],-1)]])])):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,Sn,[(0,t.createElementVNode)(`div`,Cn,[(0,t.createElementVNode)(`input`,{type:`color`,value:(0,t.unref)(n).activeColorSlot===`textColor`?(0,t.unref)(n).textColor:(0,t.unref)(n).activeColorSlot===`foreground`?(0,t.unref)(n).foregroundColor:(0,t.unref)(n).backgroundColor===`transparent`?`#ffffff`:(0,t.unref)(n).backgroundColor,class:`color-picker`,onChange:c},null,40,wn),(0,t.createElementVNode)(`span`,Tn,(0,t.toDisplayString)((0,t.unref)(r)(`palette.custom`)),1)])])],4)])):(0,t.createCommentVNode)(``,!0)]))}}),[[`__scopeId`,`data-v-a8b8bc9c`]]),Dn=Q((0,t.defineComponent)({__name:`Painter`,props:{theme:{default:`light`},locale:{default:`zh-CN`},modelValue:{default:()=>({strokes:[],canvasWidth:800,canvasHeight:600})},width:{default:`100%`},height:{default:`100%`}},emits:[`update:modelValue`],setup(e,{emit:n}){let r=e,i=n,o=(0,t.computed)(()=>r.locale===`en-US`?`en-US`:`zh-CN`),s=(0,t.computed)(()=>{let e=e=>typeof e==`number`?`${e}px`:e;return{width:e(r.width),height:e(r.height)}});a(o.value);let l=(0,t.ref)(null);c(l);let u=Z(),d=Be();u.reset(),d.reset();let f=!1;function p(e){return e.map(e=>({...e,points:e.points.map(e=>({...e}))}))}(0,t.watch)(()=>r.theme,(e,t)=>{u.theme=e||`light`,e===`dark`&&u.foregroundColor===`#000000`?u.foregroundColor=`#ffffff`:e===`light`&&t===`dark`&&u.foregroundColor===`#ffffff`&&(u.foregroundColor=`#000000`)},{immediate:!0});let m=(0,t.computed)(()=>`wb-theme-${r.theme}`);u.setCanvasSize(r.modelValue.canvasWidth??800,r.modelValue.canvasHeight??600),r.modelValue.canvasBackgroundColor!=null&&u.setCanvasBackgroundColor(r.modelValue.canvasBackgroundColor),(0,t.watch)(()=>r.modelValue.canvasWidth,e=>{e!=null&&u.setCanvasSize(e,u.canvasHeight)}),(0,t.watch)(()=>r.modelValue.canvasHeight,e=>{e!=null&&u.setCanvasSize(u.canvasWidth,e)}),(0,t.watch)(()=>r.modelValue.strokes,e=>{f||u.syncFromParent(e)},{immediate:!0,deep:!0});function h(){f=!0,i(`update:modelValue`,{strokes:p(u.strokes),canvasWidth:u.canvasWidth,canvasHeight:u.canvasHeight,canvasBackgroundColor:u.canvasBackgroundColor}),setTimeout(()=>{f=!1},0)}return(0,t.watch)(()=>`${u.strokes.length}|${u.canvasWidth}|${u.canvasHeight}|${u.canvasBackgroundColor}|${u.dataVersion}`,()=>{h()}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{ref_key:`rootEl`,ref:l,class:(0,t.normalizeClass)([`wb-root`,m.value]),style:(0,t.normalizeStyle)(s.value)},[(0,t.createVNode)(Ot),(0,t.createVNode)(mn),(0,t.createVNode)(En)],6))}}),[[`__scopeId`,`data-v-18ed1ca7`]]);e.DEFAULT_CANVAS_HEIGHT=d,e.DEFAULT_CANVAS_WIDTH=u,e.DEFAULT_FONT_SIZE=p,e.HIT_THRESHOLD=m,e.Painter=Dn,e.default=Dn,e.STROKE_WIDTH=f});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xiaodao-painter",
-  "version": "0.1.11",
+  "version": "0.1.13",
   "description": "A Vue 3 component for drawing on the canvas",
   "type": "module",
   "license": "MIT",
@@ -60,8 +60,8 @@
     "globals": "^17.11.0",
     "typescript": "~6.0.2",
     "typescript-eslint": "^8.67.0",
-    "vite": "^8.2.0",
-    "vue": "^3.5.40",
+    "vite": "^8.2.4",
+    "vue": "^3.5.42",
     "vue-eslint-parser": "^10.4.1",
     "vue-tsc": "^3.3.8"
   },
@@ -72,5 +72,13 @@
   "repository": {
     "type": "git",
     "url": "git+https://github.com/xiaodaozhi/xiaodao-painter.git"
+  },
+  "overrides": {
+    "minimatch@>=7.0.0 <11.0.1": "^11.0.1"
+  },
+  "pnpm": {
+    "overrides": {
+      "minimatch@>=7.0.0 <11.0.1": "^11.0.1"
+    }
   }
 }