@hankchen/canvas-editor-vue 0.3.0 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/dist/canvas/CanvasSurface.d.ts +28 -1
  2. package/dist/canvas/{ContentTypePill.d.ts → EditOverlayToolbar.d.ts} +19 -0
  3. package/dist/canvas/TextEditingOverlay.d.ts +31 -3
  4. package/dist/canvas/index.d.ts +1 -1
  5. package/dist/canvas/useTextEditing.d.ts +30 -8
  6. package/dist/{canvas-ZMyaouKe.js → canvas-CX1RdlFC.js} +816 -437
  7. package/dist/canvas.js +2 -2
  8. package/dist/index.js +15 -14
  9. package/dist/layer-panel/LayerPanel.d.ts +1 -27
  10. package/dist/layer-panel/TemplateTableForm.d.ts +38 -0
  11. package/dist/layer-panel/addMenu.d.ts +20 -8
  12. package/dist/layer-panel/index.d.ts +6 -3
  13. package/dist/{layer-panel-CEyB57XM.js → layer-panel-kOceTf8H.js} +329 -243
  14. package/dist/layer-panel.js +2 -2
  15. package/dist/panel-theme.css +24 -0
  16. package/dist/{completionAnchor-Da8VhzMQ.js → popupPosition-Ck5Gsvjy.js} +163 -107
  17. package/dist/property-panel/PropertyField.d.ts +6 -0
  18. package/dist/property-panel/fieldSchema.d.ts +7 -1
  19. package/dist/property-panel/fields/ImageSrcField.d.ts +5 -1
  20. package/dist/property-panel/fields/ResourceValueField.d.ts +19 -0
  21. package/dist/property-panel/fields/TextareaField.d.ts +1 -0
  22. package/dist/property-panel/fields/ValueTypeSegmented.d.ts +3 -1
  23. package/dist/property-panel/index.d.ts +5 -3
  24. package/dist/property-panel/usePropertyPanel.d.ts +16 -4
  25. package/dist/{property-panel-DmSf_GPu.js → property-panel-B32ZBQdf.js} +472 -376
  26. package/dist/property-panel.js +3 -2
  27. package/dist/resourceTemplate-cdcQtp9a.js +246 -0
  28. package/dist/shared/ExpressionPathPicker.d.ts +25 -0
  29. package/dist/shared/completion.d.ts +14 -10
  30. package/dist/shared/expressionContext.d.ts +2 -2
  31. package/dist/shared/index.d.ts +14 -1
  32. package/dist/shared/mergeKey.d.ts +2 -0
  33. package/dist/shared/pathPickerModel.d.ts +11 -0
  34. package/dist/shared/popupPosition.d.ts +41 -0
  35. package/dist/shared/resourceTemplate.d.ts +7 -0
  36. package/dist/shared/useExpressionCompletion.d.ts +0 -7
  37. package/dist/shared/useExpressionDiagnostics.d.ts +15 -0
  38. package/dist/shared.js +10 -9
  39. package/dist/style.css +1 -1
  40. package/dist/uploadFile-D1RY-ji0.js +516 -0
  41. package/dist/usePathCompletion-Do17CQ6l.js +220 -0
  42. package/package.json +2 -2
  43. package/dist/uploadFile-DXAEX9kG.js +0 -455
  44. package/dist/usePathCompletion-C52F4phW.js +0 -229
  45. /package/dist/{property-panel → shared}/fontPicker.d.ts +0 -0
@@ -0,0 +1,516 @@
1
+ import { a as e, r as t } from "./layerPath-uy2ywyld.js";
2
+ import { a as n, c as r, d as i, f as a, g as o, h as s, i as c, l, m as u, p as d, r as f, u as p } from "./popupPosition-Ck5Gsvjy.js";
3
+ import { computed as m, inject as h, nextTick as g, onMounted as _, onScopeDispose as v, reactive as y, shallowRef as b, toValue as x, watch as S } from "vue";
4
+ //#region ../canvas-editor/src/shared/expressionDiagnostics.ts
5
+ function C(e) {
6
+ let t = [];
7
+ for (let n of p(e).parts) n.kind === "fragment" && n.diagnostic !== null && t.push(n.diagnostic);
8
+ return t;
9
+ }
10
+ //#endregion
11
+ //#region ../canvas-editor/src/shared/expressionFunctions.ts
12
+ var w = [
13
+ {
14
+ name: "date",
15
+ signature: "date(path[, format])",
16
+ summary: "日期格式化(moment 风格 token,预设 date/datetime)"
17
+ },
18
+ {
19
+ name: "number",
20
+ signature: "number(path[, n])",
21
+ summary: "千分位分组"
22
+ },
23
+ {
24
+ name: "fixed",
25
+ signature: "fixed(path[, n])",
26
+ summary: "定点补零(缺省 2 位)"
27
+ },
28
+ {
29
+ name: "percent",
30
+ signature: "percent(path[, n])",
31
+ summary: "百分比(乘 100)"
32
+ }
33
+ ], T = w.filter((e) => e.name !== "date"), E = [
34
+ {
35
+ segment: "date",
36
+ description: "预设 → YYYY-MM-DD"
37
+ },
38
+ {
39
+ segment: "datetime",
40
+ description: "预设 → YYYY-MM-DD HH:mm:ss"
41
+ },
42
+ {
43
+ segment: "YYYY年MM月DD日",
44
+ description: "中文模板(写即所得)"
45
+ }
46
+ ];
47
+ //#endregion
48
+ //#region ../canvas-editor/src/shared/expressionCandidates.ts
49
+ function D(e) {
50
+ return e.kind === "row" ? "row" : e.kind === "root" ? "$root" : e.name;
51
+ }
52
+ function O(e) {
53
+ let t = {};
54
+ 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;
55
+ }
56
+ function k(e, t) {
57
+ return {
58
+ path: t === "" ? e.key : `${t}.${e.key}`,
59
+ segment: e.key,
60
+ kind: "path",
61
+ ...O(e.node)
62
+ };
63
+ }
64
+ function A(e, t, n) {
65
+ let r = [];
66
+ if (e.node.format === "date" || e.node.format === "date-time") r.push({
67
+ path: `date(${t}, '')`,
68
+ segment: `date(${t}, '')`,
69
+ cursorBack: 2,
70
+ replaceLen: n,
71
+ filterKey: e.key,
72
+ kind: "function",
73
+ description: "日期格式化",
74
+ type: "函数"
75
+ });
76
+ else if (e.node.type === "number") for (let i of T) r.push({
77
+ path: `${i.name}(${t})`,
78
+ segment: `${i.name}(${t})`,
79
+ replaceLen: n,
80
+ filterKey: e.key,
81
+ kind: "function",
82
+ description: i.summary,
83
+ type: "函数"
84
+ });
85
+ return r;
86
+ }
87
+ function j(e, t, n, r) {
88
+ let i = k(e, t);
89
+ return r ? [i, ...A(e, i.path, n)] : [i];
90
+ }
91
+ function M() {
92
+ return w.map((e) => ({
93
+ path: e.signature,
94
+ segment: `${e.name}()`,
95
+ cursorBack: 1,
96
+ kind: "function",
97
+ description: e.summary,
98
+ type: "函数"
99
+ }));
100
+ }
101
+ function N() {
102
+ return E.map((e) => ({
103
+ path: e.segment,
104
+ segment: e.segment,
105
+ description: e.description,
106
+ type: "格式"
107
+ }));
108
+ }
109
+ function P(e, t, n, r, i) {
110
+ let a = s(e).entries.flatMap((e) => j(e, "", r, i));
111
+ return a.push({
112
+ path: "$root",
113
+ segment: "$root",
114
+ kind: "path"
115
+ }), t === "row" && (a.push(n ? {
116
+ path: "row",
117
+ segment: "row",
118
+ kind: "path",
119
+ ...O(n)
120
+ } : {
121
+ path: "row",
122
+ segment: "row",
123
+ kind: "path"
124
+ }), a.push({
125
+ path: "$index",
126
+ segment: "$index",
127
+ kind: "path"
128
+ })), a;
129
+ }
130
+ function F(e, t) {
131
+ let n = i(t.expr);
132
+ if (n === null) return {
133
+ ok: !0,
134
+ prefix: "",
135
+ partial: "",
136
+ candidates: []
137
+ };
138
+ if (n.stringSlot && n.index >= 1 && n.name === "date") return {
139
+ ok: !0,
140
+ prefix: "",
141
+ partial: n.text,
142
+ candidates: N()
143
+ };
144
+ if (n.index === 0 && !a(n.text)) {
145
+ let r = I(e, t, n.text, !1);
146
+ return r.ok ? r : {
147
+ ok: !0,
148
+ prefix: "",
149
+ partial: "",
150
+ candidates: []
151
+ };
152
+ }
153
+ return {
154
+ ok: !0,
155
+ prefix: "",
156
+ partial: "",
157
+ candidates: []
158
+ };
159
+ }
160
+ function I(e, t, n, r) {
161
+ if (e === null) return {
162
+ ok: !0,
163
+ prefix: "",
164
+ partial: "",
165
+ candidates: []
166
+ };
167
+ let i = n.endsWith("."), a = i ? n.slice(0, -1) : n;
168
+ if (a === "") return n === "" ? {
169
+ ok: !0,
170
+ prefix: "",
171
+ partial: "",
172
+ candidates: P(e, t.context, t.rowSchema, n.length, !1)
173
+ } : {
174
+ ok: !1,
175
+ reason: "expression_syntax_error"
176
+ };
177
+ let c = d(a);
178
+ if (!c.ok) return {
179
+ ok: !1,
180
+ reason: "expression_syntax_error"
181
+ };
182
+ let { head: l, rest: u } = c, f, p;
183
+ i ? (f = [D(l), ...u], p = "") : u.length > 0 ? (f = [D(l), ...u.slice(0, -1)], p = u[u.length - 1]) : (f = [], p = D(l));
184
+ let m = r && p !== "";
185
+ if (f.length === 0) {
186
+ let i = P(e, t.context, t.rowSchema, n.length, m), a = r && n !== "" ? M() : [];
187
+ return {
188
+ ok: !0,
189
+ prefix: "",
190
+ partial: p,
191
+ candidates: [...i, ...a]
192
+ };
193
+ }
194
+ let h, g;
195
+ if (l.kind === "row") {
196
+ if (t.context !== "row") return {
197
+ ok: !0,
198
+ prefix: f.join("."),
199
+ partial: p,
200
+ candidates: []
201
+ };
202
+ h = t.rowSchema ?? null, g = f.slice(1);
203
+ } else if (l.kind === "root") h = e, g = f.slice(1);
204
+ else if (l.name === "$index") return {
205
+ ok: !0,
206
+ prefix: f.join("."),
207
+ partial: p,
208
+ candidates: []
209
+ };
210
+ else h = e, g = f;
211
+ let _ = h === null ? null : o(h, g), v = f.join(".");
212
+ if (_ === null) return {
213
+ ok: !0,
214
+ prefix: v,
215
+ partial: p,
216
+ candidates: []
217
+ };
218
+ let y = s(_);
219
+ return {
220
+ ok: !0,
221
+ prefix: v,
222
+ partial: p,
223
+ candidates: y.entries.flatMap((e) => j(e, v, n.length, m))
224
+ };
225
+ }
226
+ function L(e, t) {
227
+ return e === null ? {
228
+ ok: !0,
229
+ prefix: "",
230
+ partial: "",
231
+ candidates: []
232
+ } : a(t.expr) ? F(e, t) : I(e, t, t.expr, !0);
233
+ }
234
+ //#endregion
235
+ //#region src/shared/expressionContext.ts
236
+ function R(t, n, r) {
237
+ let i = null;
238
+ for (let a = 0; a < n.length; a += 1) {
239
+ if (n[a] !== "template") continue;
240
+ let o = e(t, n.slice(0, a));
241
+ if (o === null || o.type !== "TableLayer" || (i = u(i ?? r, o.rowsPath), i === null)) return null;
242
+ }
243
+ return i;
244
+ }
245
+ function z(e) {
246
+ return e[e.length - 1] === "content" && t(e);
247
+ }
248
+ function B(e, t, n) {
249
+ return e === null || t === null || n === null || !z(n) ? {
250
+ kind: "root",
251
+ rowSchema: null
252
+ } : {
253
+ kind: "row",
254
+ rowSchema: R(t, n, e)
255
+ };
256
+ }
257
+ function V(e, t) {
258
+ return e === null ? null : (n) => {
259
+ let r = L(e, {
260
+ context: t.kind,
261
+ expr: n,
262
+ rowSchema: t.rowSchema
263
+ });
264
+ return r.ok ? {
265
+ partial: r.partial,
266
+ candidates: r.candidates
267
+ } : null;
268
+ };
269
+ }
270
+ //#endregion
271
+ //#region src/shared/useExpressionCompletion.ts
272
+ var H = [
273
+ "ArrowLeft",
274
+ "ArrowRight",
275
+ "Home",
276
+ "End",
277
+ "PageUp",
278
+ "PageDown"
279
+ ];
280
+ function U(e) {
281
+ let t = y({
282
+ open: !1,
283
+ items: [],
284
+ activeIndex: 0,
285
+ top: 0,
286
+ left: 0
287
+ }), i = null, a = !1, o = null;
288
+ function s() {
289
+ t.open = !1, t.items = [], t.activeIndex = 0, o = null;
290
+ }
291
+ function u() {
292
+ if (!t.open || !i) return;
293
+ let n = c(i, x(e.scale ?? 1)), r = e.popupEl ? x(e.popupEl) : null, a = f({
294
+ anchor: n,
295
+ popupWidth: r?.offsetWidth ?? 0,
296
+ popupHeight: r?.offsetHeight ?? 0,
297
+ viewportWidth: window.innerWidth,
298
+ viewportHeight: window.innerHeight
299
+ });
300
+ t.top = a.top, t.left = a.left;
301
+ }
302
+ function d(n, a = !1) {
303
+ if (!x(e.enabled)) {
304
+ s();
305
+ return;
306
+ }
307
+ let c = i;
308
+ if (!c) {
309
+ s();
310
+ return;
311
+ }
312
+ let d = c.value, f = c.selectionStart ?? d.length, m = r(p(d), f);
313
+ if (!m) {
314
+ s();
315
+ return;
316
+ }
317
+ let h = m.kind === "open" ? m.end : m.end - 2, _ = e.resolve(l(d.slice(m.start + 2, Math.min(f, h))));
318
+ if (!_) {
319
+ s();
320
+ return;
321
+ }
322
+ let v = a ? _.candidates : _.candidates.filter((e) => (e.filterKey ?? e.segment).startsWith(_.partial));
323
+ if (v.length === 0) {
324
+ s();
325
+ return;
326
+ }
327
+ o = {
328
+ fragment: m,
329
+ partial: _.partial,
330
+ cursor: f
331
+ }, (t.open || n) && (t.items = v, t.activeIndex = 0, t.open = !0, u(), g(u));
332
+ }
333
+ function m(e) {
334
+ let r = i;
335
+ if (!t.open || a || !r || !o) return;
336
+ let c = t.items[e ?? t.activeIndex];
337
+ if (!c) return;
338
+ let l = n(r.value, o.fragment, o.cursor, o.partial, c);
339
+ if (!l) {
340
+ s();
341
+ return;
342
+ }
343
+ r.value = l.value, r.setSelectionRange(l.cursor, l.cursor), r.dispatchEvent(new Event("input", { bubbles: !0 })), r.dispatchEvent(new Event("change", { bubbles: !0 })), s();
344
+ }
345
+ function h() {
346
+ return x(e.pairing ?? e.enabled);
347
+ }
348
+ function b(e) {
349
+ let t = e.selectionStart;
350
+ return t === null || t !== e.selectionEnd ? null : t;
351
+ }
352
+ let C = !1;
353
+ function w(e) {
354
+ if (C || !h()) return;
355
+ let t = i;
356
+ if (!t) return;
357
+ let n = e.inputType;
358
+ if (n !== void 0 && n !== "" && n !== "insertText") return;
359
+ let r = b(t);
360
+ if (r === null || r < 2) return;
361
+ let a = t.value;
362
+ a.startsWith("{{", r - 2) && (a.includes("}}", r) || (C = !0, t.value = `${a.slice(0, r)}}}${a.slice(r)}`, t.setSelectionRange(r, r), t.dispatchEvent(new Event("input", { bubbles: !0 })), C = !1));
363
+ }
364
+ function T(e) {
365
+ if (!h()) return !1;
366
+ let t = i;
367
+ if (!t) return !1;
368
+ let n = b(t);
369
+ if (n === null || n < 2) return !1;
370
+ let r = t.value;
371
+ return !r.startsWith("{{", n - 2) || !r.startsWith("}}", n) ? !1 : (e.preventDefault(), C = !0, t.value = r.slice(0, n - 2) + r.slice(n + 2), t.setSelectionRange(n - 2, n - 2), t.dispatchEvent(new Event("input", { bubbles: !0 })), C = !1, !0);
372
+ }
373
+ function E(e) {
374
+ if (!h()) return !1;
375
+ let t = i;
376
+ if (!t) return !1;
377
+ let n = b(t);
378
+ return n === null || t.value[n] !== "}" ? !1 : (e.preventDefault(), t.setSelectionRange(n + 1, n + 1), d(!1), !0);
379
+ }
380
+ function D(e) {
381
+ a || e.isComposing || (w(e), d(!0));
382
+ }
383
+ function O() {
384
+ a = !0;
385
+ }
386
+ function k() {
387
+ a = !1, d(!0);
388
+ }
389
+ function A(e) {
390
+ return a || e.isComposing || e.keyCode === 229;
391
+ }
392
+ function j(e) {
393
+ if (!A(e)) {
394
+ if (e.key === " " && (e.ctrlKey || e.metaKey)) {
395
+ e.preventDefault(), d(!0, !0);
396
+ return;
397
+ }
398
+ if (!(e.key === "Backspace" && T(e)) && !(e.key === "}" && E(e)) && t.open) {
399
+ if (e.key === "ArrowDown" || e.key === "ArrowUp") {
400
+ e.preventDefault();
401
+ let n = t.items.length;
402
+ n > 0 && (t.activeIndex = (t.activeIndex + (e.key === "ArrowDown" ? 1 : n - 1)) % n);
403
+ return;
404
+ }
405
+ if (e.key === "Enter" || e.key === "Tab") {
406
+ e.preventDefault(), m();
407
+ return;
408
+ }
409
+ e.key === "Escape" && (e.preventDefault(), s());
410
+ }
411
+ }
412
+ }
413
+ function M(e) {
414
+ t.open && !A(e) && H.includes(e.key) && d(!1);
415
+ }
416
+ function N() {
417
+ a || d(!1);
418
+ }
419
+ function P() {
420
+ s();
421
+ }
422
+ function F(e) {
423
+ t.open && e.target !== i && s();
424
+ }
425
+ function I() {
426
+ u();
427
+ }
428
+ let L = [
429
+ ["input", D],
430
+ ["keydown", j],
431
+ ["keyup", M],
432
+ ["click", N],
433
+ ["blur", P],
434
+ ["compositionstart", O],
435
+ ["compositionend", k]
436
+ ];
437
+ function R(e) {
438
+ for (let [t, n] of L) e.addEventListener(t, n);
439
+ }
440
+ function z(e) {
441
+ for (let [t, n] of L) e.removeEventListener(t, n);
442
+ }
443
+ function B(e) {
444
+ i !== e && (i && z(i), i = e, e && R(e));
445
+ }
446
+ return _(() => B(e.target.value)), S(e.target, (e) => B(e)), S(() => x(e.enabled), (e) => {
447
+ e || s();
448
+ }), document.addEventListener("mousedown", F), window.addEventListener("scroll", I, !0), window.addEventListener("resize", I), v(() => {
449
+ i && z(i), document.removeEventListener("mousedown", F), window.removeEventListener("scroll", I, !0), window.removeEventListener("resize", I);
450
+ }), {
451
+ popup: t,
452
+ accept: m
453
+ };
454
+ }
455
+ //#endregion
456
+ //#region src/shared/useExpressionDiagnostics.ts
457
+ var W = {
458
+ empty_fragment: "空的表达式片段",
459
+ invalid_path: "非法路径",
460
+ missing_open_paren: "缺少左括号 (",
461
+ unbalanced_paren: "括号不平衡(缺少右括号)",
462
+ unterminated_string: "字符串字面量未闭合",
463
+ empty_arg_slot: "存在空的参数位",
464
+ bad_arg_syntax: "调用实参语法错误",
465
+ trailing_after_call: "调用后有多余内容",
466
+ first_arg_not_path: "首参必须为路径",
467
+ invalid_path_arg: "路径实参不合法",
468
+ resource_not_single_ref: "资源内容必须是单个字段路径,不支持拼接文字",
469
+ resource_function_call: "资源内容不支持函数调用"
470
+ };
471
+ function G(e) {
472
+ let t = e[0];
473
+ if (t === void 0) return "";
474
+ let n = W[t.kind], r = e.length;
475
+ return r > 1 ? `${r} 处表达式语法错误:${n}` : `表达式语法错误:${n}`;
476
+ }
477
+ function K(e) {
478
+ let t = b(""), n = null;
479
+ function r() {
480
+ n !== null && (t.value = n.value);
481
+ }
482
+ function i(e) {
483
+ e.isComposing || r();
484
+ }
485
+ function a(e) {
486
+ 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());
487
+ }
488
+ return _(() => a(e.target.value)), S(e.target, (e) => a(e)), S(() => x(e.enabled), (e) => {
489
+ e || (t.value = "");
490
+ }), v(() => a(null), !0), {
491
+ diagnostics: m(() => x(e.enabled) ? C(t.value) : []),
492
+ refresh: r
493
+ };
494
+ }
495
+ //#endregion
496
+ //#region src/shared/fontPicker.ts
497
+ var q = Symbol("canvas-font-picker");
498
+ function J() {
499
+ return h(q, null);
500
+ }
501
+ //#endregion
502
+ //#region src/shared/mergeKey.ts
503
+ function Y(e, t) {
504
+ return `sel:${e.join(".")}:${t.join(".")}`;
505
+ }
506
+ //#endregion
507
+ //#region src/shared/uploadFile.ts
508
+ async function X(e) {
509
+ return {
510
+ name: e.name,
511
+ mime: e.type,
512
+ bytes: new Uint8Array(await e.arrayBuffer())
513
+ };
514
+ }
515
+ //#endregion
516
+ export { G as a, V as c, J as i, B as l, Y as n, K as o, q as r, U as s, X as t, C as u };