@hankchen/canvas-editor-vue 0.1.4 → 0.3.0

package/dist/shared/completion.d.ts

@@ -11,6 +11,22 @@ export interface CompletionItem {
     title?: string;
     /** 类型徽标数据（未声明为 undefined） */
     type?: string;
+    /**
+     * 插入后光标从插入文本末端回退的码元数（expression-type-methods 工单 12）：
+     * date() 调用插入 = 2（光标落引号内 format 参数占位）、函数名候选 = 1（落括号
+     * 内）；缺省 0（落插入末尾）
+     */
+    cursorBack?: number;
+    /**
+     * 接受时从光标锚位回退替换的长度（工单 12；缺省 = partial 长度）：桶候选携带
+     * 整段 expr 长度——调用插入重写「前缀 + 部分段」全量
+     */
+    replaceLen?: number;
+    /**
+     * 前缀过滤键（工单 12；缺省 = segment）：桶候选 = 字段键名——与同键路径候选
+     * 一起按 partial 过滤（segment 是整段调用文本，直接过滤永不匹配）
+     */
+    filterKey?: string;
 }
 /**
  * 候选源一次求值结果（工单 02 partial/candidates 契约 + 工单 10 open 信号扩展）：
@@ -37,13 +53,17 @@ export interface CompletionResult {
 export type CompletionSource = (expr: string) => CompletionResult | null;
 /** PHP trim() 默认字符集——内核 expressionScan 导出（单一事实源，勿按值复刻） */
 /**
- * 接受手术：把片段表达式末尾的 partial 换成候选 segment（工单 02 钉定的替换
- * 面——非整段重插、不包 `{{}}` 外壳）。part 是扫描产物（start/end 为码元索引，
- * end 独占），expr 物理终点 = 片段内容区终点回退 PHP trim 尾空白，partial 恒
- * 为其后缀；值与浮层状态漂移（partial 对不上）时拒绝手术返回 null，由调用方
- * 安全收口。
+ * 接受手术（工单 12 起光标锚定）：把**光标锚位前**的替换域换成候选段（工单 02
+ * 钉定的替换面——非整段重插、不包 `{{}}` 外壳）。part 是扫描产物（start/end 为
+ * 码元索引，end 独占），cursor 是刷新时的光标锚位（片段内容区内）；替换域 =
+ * [锚位 - 尾随空白 - replaceLen, 锚位 - 尾随空白)，replaceLen 缺省 = partial
+ * 长度（路径面与旧行为全等——尾随输入位锚定）、桶候选携带整段 expr 长度（调用
+ * 插入重写前缀+部分段，工单 12）。默认替换保留漂移检验（锚位文本须等于 partial，
+ * 对不上拒绝手术返回 null 由调用方安全收口）；replaceLen 面由锚位边界把守
+ * （expr 全量来自同一次刷新，漂移即越界拒绝）。返回光标 = 插入末端回退
+ * cursorBack（format 参数占位/括号内落点）。
  */
-export declare function applyCompletion(value: string, part: ExpressionScanFragment | ExpressionScanOpen, partial: string, segment: string): {
+export declare function applyCompletion(value: string, part: ExpressionScanFragment | ExpressionScanOpen, cursor: number, partial: string, item: Pick<CompletionItem, 'segment' | 'replaceLen' | 'cursorBack'>): {
     value: string;
     cursor: number;
 } | null;

package/dist/shared.js

@@ -1,7 +1,7 @@
-import { i as e, n as t, r as n, t as r } from "./completionAnchor-CDR5YZhu.js";
+import { i as e, n as t, r as n, t as r } from "./completionAnchor-Da8VhzMQ.js";
 import { c as i, i as a, n as o, s, t as c } from "./useTransientFeedback-CTjmMmFF.js";
-import { i as l, n as u, r as d, t as f } from "./uploadFile-BOfv8aLG.js";
-import { n as p, t as m } from "./usePathCompletion-uJ5c_gQ0.js";
+import { i as l, n as u, r as d, t as f } from "./uploadFile-DXAEX9kG.js";
+import { n as p, t as m } from "./usePathCompletion-C52F4phW.js";
 import { n as h, t as g } from "./useViewport-D9Ipevzs.js";
 import { n as _, r as v, t as y } from "./useDataSourceSchema-CGbldbUj.js";
 import { t as b } from "./useShortcutsHelp-CsyarO2P.js";

package/dist/uploadFile-DXAEX9kG.js

@@ -0,0 +1,455 @@
+import { a as e, r as t } from "./layerPath-uy2ywyld.js";
+import { a as n, c as r, d as i, f as a, l as o, n as s, o as c, p as l, s as u, t as d, u as f } from "./completionAnchor-Da8VhzMQ.js";
+import { nextTick as p, onMounted as m, onScopeDispose as h, reactive as g, toValue as _, watch as v } from "vue";
+//#region ../canvas-editor/src/shared/expressionFunctions.ts
+var y = [
+	{
+		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）"
+	}
+], b = y.filter((e) => e.name !== "date"), x = [
+	{
+		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 S(e) {
+	return e.kind === "row" ? "row" : e.kind === "root" ? "$root" : e.name;
+}
+function C(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 w(e, t) {
+	return {
+		path: t === "" ? e.key : `${t}.${e.key}`,
+		segment: e.key,
+		...C(e.node)
+	};
+}
+function T(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,
+		description: "日期格式化",
+		type: "函数"
+	});
+	else if (e.node.type === "number") for (let i of b) r.push({
+		path: `${i.name}(${t})`,
+		segment: `${i.name}(${t})`,
+		replaceLen: n,
+		filterKey: e.key,
+		description: i.summary,
+		type: "函数"
+	});
+	return r;
+}
+function E(e, t, n, r) {
+	let i = w(e, t);
+	return r ? [i, ...T(e, i.path, n)] : [i];
+}
+function D() {
+	return y.map((e) => ({
+		path: e.signature,
+		segment: `${e.name}()`,
+		cursorBack: 1,
+		description: e.summary,
+		type: "函数"
+	}));
+}
+function O() {
+	return x.map((e) => ({
+		path: e.segment,
+		segment: e.segment,
+		description: e.description,
+		type: "格式"
+	}));
+}
+function k(e, t, n, r, i) {
+	let o = a(e), s = o.entries.flatMap((e) => E(e, "", r, i));
+	return s.push({
+		path: "$root",
+		segment: "$root"
+	}), t === "row" && (s.push(n ? {
+		path: "row",
+		segment: "row",
+		...C(n)
+	} : {
+		path: "row",
+		segment: "row"
+	}), s.push({
+		path: "$index",
+		segment: "$index"
+	})), o.open === !0 ? {
+		candidates: s,
+		open: !0
+	} : { candidates: s };
+}
+function A(e, t) {
+	let n = r(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: O()
+	};
+	if (n.index === 0 && !o(n.text)) {
+		let r = j(e, t, n.text, !1);
+		return r.ok ? r : {
+			ok: !0,
+			prefix: "",
+			partial: "",
+			candidates: []
+		};
+	}
+	return {
+		ok: !0,
+		prefix: "",
+		partial: "",
+		candidates: []
+	};
+}
+function j(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: "",
+		...k(e, t.context, t.rowSchema, n.length, !1)
+	} : {
+		ok: !1,
+		reason: "expression_syntax_error"
+	};
+	let s = f(o);
+	if (!s.ok) return {
+		ok: !1,
+		reason: "expression_syntax_error"
+	};
+	let { head: c, rest: u } = s, d, p;
+	i ? (d = [S(c), ...u], p = "") : u.length > 0 ? (d = [S(c), ...u.slice(0, -1)], p = u[u.length - 1]) : (d = [], p = S(c));
+	let m = r && p !== "";
+	if (d.length === 0) {
+		let i = k(e, t.context, t.rowSchema, n.length, m), a = r && n !== "" ? D() : [];
+		return {
+			ok: !0,
+			prefix: "",
+			partial: p,
+			candidates: [...i.candidates, ...a],
+			...i.open === !0 ? { open: !0 } : {}
+		};
+	}
+	let h, g;
+	if (c.kind === "row") {
+		if (t.context !== "row") return {
+			ok: !0,
+			prefix: d.join("."),
+			partial: p,
+			candidates: []
+		};
+		h = t.rowSchema ?? null, g = d.slice(1);
+	} else if (c.kind === "root") h = e, g = d.slice(1);
+	else if (c.name === "$index") return {
+		ok: !0,
+		prefix: d.join("."),
+		partial: p,
+		candidates: []
+	};
+	else h = e, g = d;
+	let _ = h === null ? null : l(h, g), v = d.join(".");
+	if (_ === null) return {
+		ok: !0,
+		prefix: v,
+		partial: p,
+		candidates: []
+	};
+	let y = a(_);
+	return {
+		ok: !0,
+		prefix: v,
+		partial: p,
+		candidates: y.entries.flatMap((e) => E(e, v, n.length, m)),
+		...y.open === !0 ? { open: !0 } : {}
+	};
+}
+function M(e, t) {
+	return e === null ? {
+		ok: !0,
+		prefix: "",
+		partial: "",
+		candidates: []
+	} : o(t.expr) ? A(e, t) : j(e, t, t.expr, !0);
+}
+//#endregion
+//#region src/shared/expressionContext.ts
+function N(t, n, r) {
+	let a = null;
+	for (let o = 0; o < n.length; o += 1) {
+		if (n[o] !== "template") continue;
+		let s = e(t, n.slice(0, o));
+		if (s === null || s.type !== "TableLayer" || (a = i(a ?? r, s.rowsPath), a === null)) return null;
+	}
+	return a;
+}
+function P(e) {
+	return e[e.length - 1] === "content" && t(e);
+}
+function F(e, t, n) {
+	return e === null || t === null || n === null || !P(n) ? {
+		kind: "root",
+		rowSchema: null
+	} : {
+		kind: "row",
+		rowSchema: N(t, n, e)
+	};
+}
+function I(e, t) {
+	return e === null ? null : (n) => {
+		let r = M(e, {
+			context: t.kind,
+			expr: n,
+			rowSchema: t.rowSchema
+		});
+		return r.ok ? {
+			partial: r.partial,
+			candidates: r.candidates,
+			...r.open === !0 ? { open: !0 } : {}
+		} : null;
+	};
+}
+//#endregion
+//#region src/shared/useExpressionCompletion.ts
+var L = 4, R = [
+	"ArrowLeft",
+	"ArrowRight",
+	"Home",
+	"End",
+	"PageUp",
+	"PageDown"
+];
+function z(e) {
+	let t = g({
+		open: !1,
+		items: [],
+		activeIndex: 0,
+		top: 0,
+		left: 0,
+		openMapping: !1
+	}), r = null, i = !1, a = null;
+	function o() {
+		t.open = !1, t.items = [], t.activeIndex = 0, t.openMapping = !1, a = null;
+	}
+	function l() {
+		if (!t.open || !r) return;
+		let n = d(r, _(e.scale ?? 1));
+		t.top = n.bottom + L, t.left = f(n.left);
+	}
+	function f(t) {
+		let n = (e.popupEl ? _(e.popupEl) : null)?.offsetWidth ?? 0;
+		return n <= 0 ? t : Math.max(0, Math.min(t, window.innerWidth - 4 - n));
+	}
+	function y(i, s = !1) {
+		if (!_(e.enabled)) {
+			o();
+			return;
+		}
+		let d = r;
+		if (!d) {
+			o();
+			return;
+		}
+		let f = d.value, m = d.selectionStart ?? f.length, h = n(u(f), m);
+		if (!h) {
+			o();
+			return;
+		}
+		let g = h.kind === "open" ? h.end : h.end - 2, v = e.resolve(c(f.slice(h.start + 2, Math.min(m, g))));
+		if (!v) {
+			o();
+			return;
+		}
+		let y = s ? v.candidates : v.candidates.filter((e) => (e.filterKey ?? e.segment).startsWith(v.partial));
+		if (y.length === 0 && v.open !== !0) {
+			o();
+			return;
+		}
+		a = {
+			fragment: h,
+			partial: v.partial,
+			cursor: m
+		}, (t.open || i) && (t.items = y, t.activeIndex = 0, t.openMapping = v.open === !0, t.open = !0, l(), p(l));
+	}
+	function b(e) {
+		let n = r;
+		if (!t.open || i || !n || !a) return;
+		let c = t.items[e ?? t.activeIndex];
+		if (!c) return;
+		let l = s(n.value, a.fragment, a.cursor, a.partial, c);
+		if (!l) {
+			o();
+			return;
+		}
+		n.value = l.value, n.setSelectionRange(l.cursor, l.cursor), n.dispatchEvent(new Event("input", { bubbles: !0 })), n.dispatchEvent(new Event("change", { bubbles: !0 })), o();
+	}
+	function x() {
+		return _(e.pairing ?? e.enabled);
+	}
+	function S(e) {
+		let t = e.selectionStart;
+		return t === null || t !== e.selectionEnd ? null : t;
+	}
+	let C = !1;
+	function w(e) {
+		if (C || !x()) return;
+		let t = r;
+		if (!t) return;
+		let n = e.inputType;
+		if (n !== void 0 && n !== "" && n !== "insertText") return;
+		let i = S(t);
+		if (i === null || i < 2) return;
+		let a = t.value;
+		a.startsWith("{{", i - 2) && (a.includes("}}", i) || (C = !0, t.value = `${a.slice(0, i)}}}${a.slice(i)}`, t.setSelectionRange(i, i), t.dispatchEvent(new Event("input", { bubbles: !0 })), C = !1));
+	}
+	function T(e) {
+		if (!x()) return !1;
+		let t = r;
+		if (!t) return !1;
+		let n = S(t);
+		if (n === null || n < 2) return !1;
+		let i = t.value;
+		return !i.startsWith("{{", n - 2) || !i.startsWith("}}", n) ? !1 : (e.preventDefault(), C = !0, t.value = i.slice(0, n - 2) + i.slice(n + 2), t.setSelectionRange(n - 2, n - 2), t.dispatchEvent(new Event("input", { bubbles: !0 })), C = !1, !0);
+	}
+	function E(e) {
+		if (!x()) return !1;
+		let t = r;
+		if (!t) return !1;
+		let n = S(t);
+		return n === null || t.value[n] !== "}" ? !1 : (e.preventDefault(), t.setSelectionRange(n + 1, n + 1), y(!1), !0);
+	}
+	function D(e) {
+		i || e.isComposing || (w(e), y(!0));
+	}
+	function O() {
+		i = !0;
+	}
+	function k() {
+		i = !1, y(!0);
+	}
+	function A(e) {
+		return i || e.isComposing || e.keyCode === 229;
+	}
+	function j(e) {
+		if (!A(e)) {
+			if (e.key === " " && (e.ctrlKey || e.metaKey)) {
+				e.preventDefault(), y(!0, !0);
+				return;
+			}
+			if (!(e.key === "Backspace" && T(e)) && !(e.key === "}" && E(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(), b();
+					return;
+				}
+				e.key === "Escape" && (e.preventDefault(), o());
+			}
+		}
+	}
+	function M(e) {
+		t.open && !A(e) && R.includes(e.key) && y(!1);
+	}
+	function N() {
+		i || y(!1);
+	}
+	function P() {
+		o();
+	}
+	function F(e) {
+		t.open && e.target !== r && o();
+	}
+	function I() {
+		l();
+	}
+	let z = [
+		["input", D],
+		["keydown", j],
+		["keyup", M],
+		["click", N],
+		["blur", P],
+		["compositionstart", O],
+		["compositionend", k]
+	];
+	function B(e) {
+		for (let [t, n] of z) e.addEventListener(t, n);
+	}
+	function V(e) {
+		for (let [t, n] of z) e.removeEventListener(t, n);
+	}
+	function H(e) {
+		r !== e && (r && V(r), r = e, e && B(e));
+	}
+	return m(() => H(e.target.value)), v(e.target, (e) => H(e)), v(() => _(e.enabled), (e) => {
+		e || o();
+	}), document.addEventListener("mousedown", F), window.addEventListener("scroll", I, !0), window.addEventListener("resize", I), h(() => {
+		r && V(r), document.removeEventListener("mousedown", F), window.removeEventListener("scroll", I, !0), window.removeEventListener("resize", I);
+	}), {
+		popup: t,
+		accept: b
+	};
+}
+//#endregion
+//#region src/shared/uploadFile.ts
+async function B(e) {
+	return {
+		name: e.name,
+		mime: e.type,
+		bytes: new Uint8Array(await e.arrayBuffer())
+	};
+}
+//#endregion
+export { F as i, z as n, I as r, B as t };

package/dist/{usePathCompletion-uJ5c_gQ0.js → usePathCompletion-C52F4phW.js}

@@ -1,5 +1,5 @@
 import { a as e } from "./layerPath-uy2ywyld.js";
-import { c as t, n, t as r, u as i } from "./completionAnchor-CDR5YZhu.js";
+import { d as t, n, p as r, t as i } from "./completionAnchor-Da8VhzMQ.js";
 import { nextTick as a, onMounted as o, onScopeDispose as s, reactive as c, toValue as l, watch as u } from "vue";
 //#region ../canvas-editor/src/shared/rowsPathCandidates.ts
 function d(e) {
@@ -25,17 +25,17 @@ function m(e, t) {
 }
 function h(e, t) {
 	if (e === null) return null;
-	let n = t.split("."), r = t.endsWith(".") ? "" : n[n.length - 1], a = n.slice(0, -1), o = e;
+	let n = t.split("."), i = t.endsWith(".") ? "" : n[n.length - 1], a = n.slice(0, -1), o = e;
 	for (let e of a) {
 		if (d(o)) return null;
-		let t = i(o, [e]);
+		let t = r(o, [e]);
 		if (t === null) return null;
 		o = t;
 	}
 	if (d(o) || f(o)) return null;
 	let s = m(o, a.join("."));
 	return {
-		partial: r,
+		partial: i,
 		candidates: s.candidates,
 		...s.open === !0 ? { open: !0 } : {}
 	};
@@ -94,31 +94,31 @@ function S(e) {
 		top: 0,
 		left: 0,
 		openMapping: !1
-	}), i = null, d = !1, f = "";
+	}), r = null, d = !1, f = "";
 	function p() {
 		t.open = !1, t.items = [], t.activeIndex = 0, t.openMapping = !1, f = "";
 	}
 	function m() {
-		if (!t.open || !i) return;
-		let e = r(i);
+		if (!t.open || !r) return;
+		let e = i(r);
 		t.top = e.bottom + v, t.left = h(e.left);
 	}
 	function h(t) {
 		let n = (e.popupEl ? l(e.popupEl) : null)?.offsetWidth ?? 0;
 		return n <= 0 ? t : Math.max(0, Math.min(t, window.innerWidth - y - n));
 	}
-	function g(n, r = !1) {
+	function g(n, i = !1) {
 		if (!l(e.enabled)) {
 			p();
 			return;
 		}
-		let o = i;
+		let o = r;
 		if (!o) {
 			p();
 			return;
 		}
 		let s = o.value.slice(0, o.selectionStart ?? o.value.length);
-		if (s === "" && !r) {
+		if (s === "" && !i) {
 			p();
 			return;
 		}
@@ -127,7 +127,7 @@ function S(e) {
 			p();
 			return;
 		}
-		let u = r ? c.candidates : c.candidates.filter((e) => e.segment.startsWith(c.partial));
+		let u = i ? c.candidates : c.candidates.filter((e) => e.segment.startsWith(c.partial));
 		if (u.length === 0 && c.open !== !0) {
 			p();
 			return;
@@ -135,16 +135,16 @@ function S(e) {
 		f = c.partial, (t.open || n) && (t.items = u, t.activeIndex = 0, t.openMapping = c.open === !0, t.open = !0, m(), a(m));
 	}
 	function _(e) {
-		let r = i;
-		if (!t.open || d || !r) return;
+		let i = r;
+		if (!t.open || d || !i) return;
 		let a = t.items[e ?? t.activeIndex];
 		if (!a) return;
-		let o = r.value.slice(0, r.selectionStart ?? r.value.length), s = n(r.value, x(o), f, a.segment);
+		let o = i.value.slice(0, i.selectionStart ?? i.value.length), s = n(i.value, x(o), o.length, f, a);
 		if (!s) {
 			p();
 			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 })), p();
+		i.value = s.value, i.setSelectionRange(s.cursor, s.cursor), i.dispatchEvent(new Event("input", { bubbles: !0 })), i.dispatchEvent(new Event("change", { bubbles: !0 })), p();
 	}
 	function S(e) {
 		d || e.isComposing || g(!0);
@@ -193,7 +193,7 @@ function S(e) {
 		p();
 	}
 	function A(e) {
-		t.open && e.target !== i && p();
+		t.open && e.target !== r && p();
 	}
 	function j() {
 		m();
@@ -214,12 +214,12 @@ function S(e) {
 		for (let [t, n] of M) e.removeEventListener(t, n);
 	}
 	function F(e) {
-		i !== e && (i && P(i), i = e, e && N(e));
+		r !== e && (r && P(r), r = e, e && N(e));
 	}
 	return o(() => F(e.target.value)), u(e.target, (e) => F(e)), u(() => l(e.enabled), (e) => {
 		e || p();
 	}), document.addEventListener("mousedown", A), window.addEventListener("scroll", j, !0), window.addEventListener("resize", j), s(() => {
-		i && P(i), document.removeEventListener("mousedown", A), window.removeEventListener("scroll", j, !0), window.removeEventListener("resize", j);
+		r && P(r), document.removeEventListener("mousedown", A), window.removeEventListener("scroll", j, !0), window.removeEventListener("resize", j);
 	}), {
 		popup: t,
 		accept: _

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hankchen/canvas-editor-vue",
-  "version": "0.1.4",
+  "version": "0.3.0",
   "license": "MIT",
   "description": "Vue 3 薄绑定：响应式桥、composables、画布表面组件、textarea 文本编辑 overlay、schema 驱动属性面板注册表",
   "type": "module",
@@ -58,7 +58,7 @@
   },
   "dependencies": {
     "@lucide/vue": "^1.48.0",
-    "@hankchen/canvas-editor": "0.1.1"
+    "@hankchen/canvas-editor": "0.4.0"
   },
   "peerDependencies": {
     "vue": "^3.5.0"