@hankchen/canvas-editor-vue 0.6.0 → 0.7.0

package/dist/uploadFile-mXJVPEzm.js

@@ -0,0 +1,653 @@
+import { a as e, r as t } from "./layerPath-uy2ywyld.js";
+import { _ as n, d as r, f as i, g as a, h as o, i as s, m as c, p as l, v as u, y as d } from "./ExpressionPathPicker-DchGsK70.js";
+import { Fragment as f, Teleport as p, computed as m, createBlock as h, createCommentVNode as g, createElementBlock as _, createElementVNode as v, defineComponent as y, inject as b, nextTick as x, normalizeClass as S, normalizeStyle as C, onMounted as w, onScopeDispose as T, openBlock as E, reactive as ee, ref as D, renderList as O, shallowRef as k, toDisplayString as A, toValue as j, watch as M, withModifiers as N } from "vue";
+//#region ../canvas-editor/src/shared/expressionDiagnostics.ts
+function P(e) {
+	let t = [];
+	for (let n of l(e).parts) n.kind === "fragment" && n.diagnostic !== null && t.push(n.diagnostic);
+	return t;
+}
+//#endregion
+//#region ../canvas-editor/src/shared/expressionFunctions.ts
+var F = [
+	{
+		name: "date",
+		signature: "date(path[, format])",
+		summary: "日期格式化（moment 风格 token，预设 date/datetime）"
+	},
+	{
+		name: "number",
+		signature: "number(path[, n])",
+		summary: "千分位分组"
+	},
+	{
+		name: "fixed",
+		signature: "fixed(path[, n])",
+		summary: "定点补零（缺省 2 位）"
+	},
+	{
+		name: "percent",
+		signature: "percent(path[, n])",
+		summary: "百分比（乘 100）"
+	}
+], I = F.filter((e) => e.name !== "date"), L = [
+	{
+		segment: "date",
+		description: "预设 → YYYY-MM-DD"
+	},
+	{
+		segment: "datetime",
+		description: "预设 → YYYY-MM-DD HH:mm:ss"
+	},
+	{
+		segment: "YYYY年MM月DD日",
+		description: "中文模板（写即所得）"
+	}
+];
+//#endregion
+//#region ../canvas-editor/src/shared/expressionCandidates.ts
+function R(e) {
+	return e.kind === "row" ? "row" : e.kind === "root" ? "$root" : e.name;
+}
+function z(e) {
+	let t = {};
+	return e.description !== void 0 && (t.description = e.description), e.title !== void 0 && (t.title = e.title), e.type !== void 0 && (t.type = e.type), t;
+}
+function te(e, t) {
+	return {
+		path: t === "" ? e.key : `${t}.${e.key}`,
+		segment: e.key,
+		kind: "path",
+		...z(e.node)
+	};
+}
+function ne(e, t, n) {
+	let r = [];
+	if (e.node.format === "date" || e.node.format === "date-time") r.push({
+		path: `date(${t}, '')`,
+		segment: `date(${t}, '')`,
+		cursorBack: 2,
+		replaceLen: n,
+		filterKey: e.key,
+		kind: "function",
+		description: "日期格式化",
+		type: "函数"
+	});
+	else if (e.node.type === "number") for (let i of I) r.push({
+		path: `${i.name}(${t})`,
+		segment: `${i.name}(${t})`,
+		replaceLen: n,
+		filterKey: e.key,
+		kind: "function",
+		description: i.summary,
+		type: "函数"
+	});
+	return r;
+}
+function B(e, t, n, r) {
+	let i = te(e, t);
+	return r ? [i, ...ne(e, i.path, n)] : [i];
+}
+function re() {
+	return F.map((e) => ({
+		path: e.signature,
+		segment: `${e.name}()`,
+		cursorBack: 1,
+		kind: "function",
+		description: e.summary,
+		type: "函数"
+	}));
+}
+function ie() {
+	return L.map((e) => ({
+		path: e.segment,
+		segment: e.segment,
+		description: e.description,
+		type: "格式"
+	}));
+}
+function V(e, t, n, r, i) {
+	let a = u(e).entries.flatMap((e) => B(e, "", r, i));
+	return a.push({
+		path: "$root",
+		segment: "$root",
+		kind: "path"
+	}), t === "row" && (a.push(n ? {
+		path: "row",
+		segment: "row",
+		kind: "path",
+		...z(n)
+	} : {
+		path: "row",
+		segment: "row",
+		kind: "path"
+	}), a.push({
+		path: "$index",
+		segment: "$index",
+		kind: "path"
+	})), a;
+}
+function ae(e, t) {
+	let n = c(t.expr);
+	if (n === null) return {
+		ok: !0,
+		prefix: "",
+		partial: "",
+		candidates: []
+	};
+	if (n.stringSlot && n.index >= 1 && n.name === "date") return {
+		ok: !0,
+		prefix: "",
+		partial: n.text,
+		candidates: ie()
+	};
+	if (n.index === 0 && !o(n.text)) {
+		let r = H(e, t, n.text, !1);
+		return r.ok ? r : {
+			ok: !0,
+			prefix: "",
+			partial: "",
+			candidates: []
+		};
+	}
+	return {
+		ok: !0,
+		prefix: "",
+		partial: "",
+		candidates: []
+	};
+}
+function H(e, t, n, r) {
+	if (e === null) return {
+		ok: !0,
+		prefix: "",
+		partial: "",
+		candidates: []
+	};
+	let i = n.endsWith("."), o = i ? n.slice(0, -1) : n;
+	if (o === "") return n === "" ? {
+		ok: !0,
+		prefix: "",
+		partial: "",
+		candidates: V(e, t.context, t.rowSchema, n.length, !1)
+	} : {
+		ok: !1,
+		reason: "expression_syntax_error"
+	};
+	let s = a(o);
+	if (!s.ok) return {
+		ok: !1,
+		reason: "expression_syntax_error"
+	};
+	let { head: c, rest: l } = s, f, p;
+	i ? (f = [R(c), ...l], p = "") : l.length > 0 ? (f = [R(c), ...l.slice(0, -1)], p = l[l.length - 1]) : (f = [], p = R(c));
+	let m = r && p !== "";
+	if (f.length === 0) {
+		let i = V(e, t.context, t.rowSchema, n.length, m), a = r && n !== "" ? re() : [];
+		return {
+			ok: !0,
+			prefix: "",
+			partial: p,
+			candidates: [...i, ...a]
+		};
+	}
+	let h, g;
+	if (c.kind === "row") {
+		if (t.context !== "row") return {
+			ok: !0,
+			prefix: f.join("."),
+			partial: p,
+			candidates: []
+		};
+		h = t.rowSchema ?? null, g = f.slice(1);
+	} else if (c.kind === "root") h = e, g = f.slice(1);
+	else if (c.name === "$index") return {
+		ok: !0,
+		prefix: f.join("."),
+		partial: p,
+		candidates: []
+	};
+	else h = e, g = f;
+	let _ = h === null ? null : d(h, g), v = f.join(".");
+	if (_ === null) return {
+		ok: !0,
+		prefix: v,
+		partial: p,
+		candidates: []
+	};
+	let y = u(_);
+	return {
+		ok: !0,
+		prefix: v,
+		partial: p,
+		candidates: y.entries.flatMap((e) => B(e, v, n.length, m))
+	};
+}
+function oe(e, t) {
+	return e === null ? {
+		ok: !0,
+		prefix: "",
+		partial: "",
+		candidates: []
+	} : o(t.expr) ? ae(e, t) : H(e, t, t.expr, !0);
+}
+//#endregion
+//#region src/shared/ExpressionCompletionPopup.vue?vue&type=script&setup=true&lang.ts
+var se = {
+	role: "listbox",
+	"aria-label": "表达式路径候选"
+}, U = [
+	"aria-selected",
+	"title",
+	"onClick"
+], W = { class: "cn-completion__segment font-mono text-cn-fg" }, G = {
+	key: 0,
+	class: "shrink-0 rounded-sm bg-cn-field px-1 py-0.5 text-[9px] leading-none text-cn-muted"
+}, ce = {
+	key: 1,
+	class: "truncate text-[10px] leading-none text-cn-muted"
+}, le = /* @__PURE__ */ y({
+	__name: "ExpressionCompletionPopup",
+	props: { state: {} },
+	emits: ["select"],
+	setup(e, { expose: t, emit: n }) {
+		let r = e, i = n, a = D(null);
+		return t({ rootEl: a }), M(() => r.state.activeIndex, async () => {
+			await x(), a.value?.querySelector(".cn-completion__option--active")?.scrollIntoView?.({ block: "nearest" });
+		}), (t, n) => (E(), h(p, { to: "body" }, [e.state.open ? (E(), _("div", {
+			key: 0,
+			ref_key: "rootRef",
+			ref: a,
+			class: "cn-props cn-completion fixed z-50 max-h-[200px] min-w-[140px] max-w-[280px] overflow-y-auto rounded-md border border-cn-field-line py-1 text-[11px] leading-none",
+			style: C({
+				top: `${e.state.top}px`,
+				left: `${e.state.left}px`
+			}),
+			onMousedown: n[0] ||= N(() => {}, ["prevent", "stop"]),
+			onPointerdown: n[1] ||= N(() => {}, ["stop"])
+		}, [v("div", se, [(E(!0), _(f, null, O(e.state.items, (t, n) => (E(), _("button", {
+			key: `${n}:${t.segment}`,
+			type: "button",
+			role: "option",
+			class: S(["cn-completion__option flex w-full items-center gap-1.5 px-2 py-1.5 text-left", n === e.state.activeIndex ? "cn-completion__option--active" : ""]),
+			"aria-selected": n === e.state.activeIndex,
+			title: t.path ?? t.segment,
+			onClick: (e) => i("select", n)
+		}, [
+			v("span", W, A(t.segment), 1),
+			t.type ? (E(), _("span", G, A(t.type), 1)) : g("", !0),
+			t.description ?? t.title ? (E(), _("span", ce, A(t.description ?? t.title), 1)) : g("", !0)
+		], 10, U))), 128))])], 36)) : g("", !0)]));
+	}
+});
+//#endregion
+//#region src/shared/expressionContext.ts
+function ue(t, r, i) {
+	let a = null;
+	for (let o = 0; o < r.length; o += 1) {
+		if (r[o] !== "template") continue;
+		let s = e(t, r.slice(0, o));
+		if (s === null || s.type !== "TableLayer" || (a = n(a ?? i, s.rowsPath), a === null)) return null;
+	}
+	return a;
+}
+function de(e) {
+	return e[e.length - 1] === "content" && t(e);
+}
+function fe(e, t, n) {
+	return e === null || t === null || n === null || !de(n) ? {
+		kind: "root",
+		rowSchema: null
+	} : {
+		kind: "row",
+		rowSchema: ue(t, n, e)
+	};
+}
+function pe(e, t) {
+	return e === null ? null : (n) => {
+		let r = oe(e, {
+			context: t.kind,
+			expr: n,
+			rowSchema: t.rowSchema
+		});
+		return r.ok ? {
+			partial: r.partial,
+			candidates: r.candidates
+		} : null;
+	};
+}
+//#endregion
+//#region src/shared/completion.ts
+function K(e, t, n, r, i) {
+	let a = t.start + 2, o = t.kind === "open" ? t.end : t.end - 2, s = Math.min(n, o), c = 0;
+	for (; s - c > a && " 	\n\r\0\v".includes(e[s - 1 - c]);) c += 1;
+	let l = s - c, u = l - (i.replaceLen ?? r.length);
+	if (u < a || i.replaceLen === void 0 && e.slice(u, l) !== r) return null;
+	let d = i.cursorBack ?? 0;
+	return d > i.segment.length ? null : {
+		value: e.slice(0, u) + i.segment + e.slice(l),
+		cursor: u + i.segment.length - d
+	};
+}
+//#endregion
+//#region src/shared/completionAnchor.ts
+function q(e, t) {
+	return parseFloat(e.getPropertyValue(t)) || 0;
+}
+function J(e, t, n) {
+	for (let r of n) {
+		let n = e.getPropertyValue(r);
+		n && t.setProperty(r, n);
+	}
+}
+var Y = [
+	"font-family",
+	"font-size",
+	"font-weight",
+	"font-style",
+	"font-stretch",
+	"letter-spacing",
+	"word-spacing",
+	"line-height",
+	"text-transform",
+	"text-indent",
+	"tab-size"
+];
+function me(e) {
+	return q(e, "line-height") || q(e, "font-size") * 1.4;
+}
+function X(e) {
+	let t = document.createElement("div"), n = t.style;
+	return n.position = "fixed", n.top = "0", n.left = "0", n.visibility = "hidden", e(t, n), document.body.appendChild(t), t;
+}
+function he(e, t) {
+	let n = e.selectionStart ?? e.value.length, r = e.getBoundingClientRect(), i = getComputedStyle(e), a = q(i, "padding-left"), o = q(i, "padding-top"), s = null, c = X((t, r) => {
+		r.whiteSpace = i.whiteSpace || "pre-wrap", r.boxSizing = "content-box", r.width = `${Math.max(0, e.clientWidth - a - q(i, "padding-right"))}px`, J(i, r, [
+			"padding-left",
+			"padding-right",
+			"padding-top",
+			"padding-bottom",
+			"word-break",
+			"overflow-wrap"
+		]), J(i, r, Y), s = document.createElement("span"), s.textContent = "​", t.append(document.createTextNode(e.value.slice(0, n)), s);
+	});
+	try {
+		let n = r.left + q(i, "border-left-width") + a + s.offsetLeft * t - e.scrollLeft, c = r.top + q(i, "border-top-width") + o + s.offsetTop * t - e.scrollTop;
+		return {
+			left: n,
+			top: c,
+			bottom: c + me(i) * t
+		};
+	} finally {
+		c.remove();
+	}
+}
+function ge(e, t) {
+	let n = e.selectionStart ?? e.value.length, r = e.getBoundingClientRect(), i = getComputedStyle(e), a = X((t, r) => {
+		r.display = "inline-block", r.whiteSpace = "pre", J(i, r, Y), t.textContent = e.value.slice(0, n);
+	});
+	try {
+		let n = a.getBoundingClientRect().width || a.offsetWidth;
+		return {
+			left: r.left + q(i, "border-left-width") + q(i, "padding-left") + n * t - e.scrollLeft,
+			top: r.top + q(i, "border-top-width"),
+			bottom: r.bottom - q(i, "border-bottom-width")
+		};
+	} finally {
+		a.remove();
+	}
+}
+function Z(e, t = 1) {
+	return e instanceof HTMLTextAreaElement ? he(e, t) : ge(e, t);
+}
+//#endregion
+//#region src/shared/useExpressionCompletion.ts
+var _e = [
+	"ArrowLeft",
+	"ArrowRight",
+	"Home",
+	"End",
+	"PageUp",
+	"PageDown"
+];
+function ve(e) {
+	let t = ee({
+		open: !1,
+		items: [],
+		activeIndex: 0,
+		top: 0,
+		left: 0
+	}), n = null, a = !1, o = null;
+	function c() {
+		t.open = !1, t.items = [], t.activeIndex = 0, o = null;
+	}
+	function u() {
+		if (!t.open || !n) return;
+		let r = Z(n, j(e.scale ?? 1)), i = e.popupEl ? j(e.popupEl) : null, a = s({
+			anchor: r,
+			popupWidth: i?.offsetWidth ?? 0,
+			popupHeight: i?.offsetHeight ?? 0,
+			viewportWidth: window.innerWidth,
+			viewportHeight: window.innerHeight
+		});
+		t.top = a.top, t.left = a.left;
+	}
+	function d(a, s = !1) {
+		if (!j(e.enabled)) {
+			c();
+			return;
+		}
+		let d = n;
+		if (!d) {
+			c();
+			return;
+		}
+		let f = d.value, p = d.selectionStart ?? f.length, m = r(l(f), p);
+		if (!m) {
+			c();
+			return;
+		}
+		let h = m.kind === "open" ? m.end : m.end - 2, g = e.resolve(i(f.slice(m.start + 2, Math.min(p, h))));
+		if (!g) {
+			c();
+			return;
+		}
+		let _ = s ? g.candidates : g.candidates.filter((e) => (e.filterKey ?? e.segment).startsWith(g.partial));
+		if (_.length === 0) {
+			c();
+			return;
+		}
+		o = {
+			fragment: m,
+			partial: g.partial,
+			cursor: p
+		}, (t.open || a) && (t.items = _, t.activeIndex = 0, t.open = !0, u(), x(u));
+	}
+	function f(e) {
+		let r = n;
+		if (!t.open || a || !r || !o) return;
+		let i = t.items[e ?? t.activeIndex];
+		if (!i) return;
+		let s = K(r.value, o.fragment, o.cursor, o.partial, i);
+		if (!s) {
+			c();
+			return;
+		}
+		r.value = s.value, r.setSelectionRange(s.cursor, s.cursor), r.dispatchEvent(new Event("input", { bubbles: !0 })), r.dispatchEvent(new Event("change", { bubbles: !0 })), c();
+	}
+	function p() {
+		return j(e.pairing ?? e.enabled);
+	}
+	function m(e) {
+		let t = e.selectionStart;
+		return t === null || t !== e.selectionEnd ? null : t;
+	}
+	let h = !1;
+	function g(e) {
+		if (h || !p()) return;
+		let t = n;
+		if (!t) return;
+		let r = e.inputType;
+		if (r !== void 0 && r !== "" && r !== "insertText") return;
+		let i = m(t);
+		if (i === null || i < 2) return;
+		let a = t.value;
+		a.startsWith("{{", i - 2) && (a.includes("}}", i) || (h = !0, t.value = `${a.slice(0, i)}}}${a.slice(i)}`, t.setSelectionRange(i, i), t.dispatchEvent(new Event("input", { bubbles: !0 })), h = !1));
+	}
+	function _(e) {
+		if (!p()) return !1;
+		let t = n;
+		if (!t) return !1;
+		let r = m(t);
+		if (r === null || r < 2) return !1;
+		let i = t.value;
+		return !i.startsWith("{{", r - 2) || !i.startsWith("}}", r) ? !1 : (e.preventDefault(), h = !0, t.value = i.slice(0, r - 2) + i.slice(r + 2), t.setSelectionRange(r - 2, r - 2), t.dispatchEvent(new Event("input", { bubbles: !0 })), h = !1, !0);
+	}
+	function v(e) {
+		if (!p()) return !1;
+		let t = n;
+		if (!t) return !1;
+		let r = m(t);
+		return r === null || t.value[r] !== "}" ? !1 : (e.preventDefault(), t.setSelectionRange(r + 1, r + 1), d(!1), !0);
+	}
+	function y(e) {
+		a || e.isComposing || (g(e), d(!0));
+	}
+	function b() {
+		a = !0;
+	}
+	function S() {
+		a = !1, d(!0);
+	}
+	function C(e) {
+		return a || e.isComposing || e.keyCode === 229;
+	}
+	function E(e) {
+		if (!C(e)) {
+			if (e.key === " " && (e.ctrlKey || e.metaKey)) {
+				e.preventDefault(), d(!0, !0);
+				return;
+			}
+			if (!(e.key === "Backspace" && _(e)) && !(e.key === "}" && v(e)) && t.open) {
+				if (e.key === "ArrowDown" || e.key === "ArrowUp") {
+					e.preventDefault();
+					let n = t.items.length;
+					n > 0 && (t.activeIndex = (t.activeIndex + (e.key === "ArrowDown" ? 1 : n - 1)) % n);
+					return;
+				}
+				if (e.key === "Enter" || e.key === "Tab") {
+					e.preventDefault(), f();
+					return;
+				}
+				e.key === "Escape" && (e.preventDefault(), c());
+			}
+		}
+	}
+	function D(e) {
+		t.open && !C(e) && _e.includes(e.key) && d(!1);
+	}
+	function O() {
+		a || d(!1);
+	}
+	function k() {
+		c();
+	}
+	function A(e) {
+		t.open && e.target !== n && c();
+	}
+	function N() {
+		u();
+	}
+	let P = [
+		["input", y],
+		["keydown", E],
+		["keyup", D],
+		["click", O],
+		["blur", k],
+		["compositionstart", b],
+		["compositionend", S]
+	];
+	function F(e) {
+		for (let [t, n] of P) e.addEventListener(t, n);
+	}
+	function I(e) {
+		for (let [t, n] of P) e.removeEventListener(t, n);
+	}
+	function L(e) {
+		n !== e && (n && I(n), n = e, e && F(e));
+	}
+	return w(() => L(e.target.value)), M(e.target, (e) => L(e)), M(() => j(e.enabled), (e) => {
+		e || c();
+	}), document.addEventListener("mousedown", A), window.addEventListener("scroll", N, !0), window.addEventListener("resize", N), T(() => {
+		n && I(n), document.removeEventListener("mousedown", A), window.removeEventListener("scroll", N, !0), window.removeEventListener("resize", N);
+	}), {
+		popup: t,
+		accept: f
+	};
+}
+//#endregion
+//#region src/shared/useExpressionDiagnostics.ts
+var ye = {
+	empty_fragment: "空的表达式片段",
+	invalid_path: "非法路径",
+	missing_open_paren: "缺少左括号 (",
+	unbalanced_paren: "括号不平衡（缺少右括号）",
+	unterminated_string: "字符串字面量未闭合",
+	empty_arg_slot: "存在空的参数位",
+	bad_arg_syntax: "调用实参语法错误",
+	trailing_after_call: "调用后有多余内容",
+	first_arg_not_path: "首参必须为路径",
+	invalid_path_arg: "路径实参不合法",
+	resource_not_single_ref: "资源内容必须是单个字段路径，不支持拼接文字",
+	resource_function_call: "资源内容不支持函数调用"
+};
+function be(e) {
+	let t = e[0];
+	if (t === void 0) return "";
+	let n = ye[t.kind], r = e.length;
+	return r > 1 ? `${r} 处表达式语法错误：${n}` : `表达式语法错误：${n}`;
+}
+var xe = "绑定数据源后可选择字段";
+function Q(e) {
+	return e ? "资源内容需为单个字段引用，点击右侧按钮选择数据字段" : "当前内容不是字段引用，绑定数据源后可选择字段";
+}
+function Se(e) {
+	let t = k(""), n = null;
+	function r() {
+		n !== null && (t.value = n.value);
+	}
+	function i(e) {
+		e.isComposing || r();
+	}
+	function a(e) {
+		n !== e && (n !== null && (n.removeEventListener("input", i), n.removeEventListener("compositionend", r)), n = e, e !== null && (e.addEventListener("input", i), e.addEventListener("compositionend", r)), r());
+	}
+	return w(() => a(e.target.value)), M(e.target, (e) => a(e)), M(() => j(e.enabled), (e) => {
+		e || (t.value = "");
+	}), T(() => a(null), !0), {
+		diagnostics: m(() => j(e.enabled) ? P(t.value) : []),
+		refresh: r
+	};
+}
+//#endregion
+//#region src/shared/fontPicker.ts
+var $ = Symbol("canvas-font-picker");
+function Ce() {
+	return b($, null);
+}
+//#endregion
+//#region src/shared/mergeKey.ts
+function we(e, t) {
+	return `sel:${e.join(".")}:${t.join(".")}`;
+}
+//#endregion
+//#region src/shared/uploadFile.ts
+async function Te(e) {
+	return {
+		name: e.name,
+		mime: e.type,
+		bytes: new Uint8Array(await e.arrayBuffer())
+	};
+}
+//#endregion
+export { xe as a, Se as c, K as d, pe as f, P as h, Ce as i, ve as l, le as m, we as n, be as o, fe as p, $ as r, Q as s, Te as t, Z as u };