@hankchen/canvas-editor-vue 0.1.2 → 0.1.3
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.
- package/dist/{canvas-CSdXMg6S.js → canvas-DP-pVLyA.js} +580 -531
- package/dist/canvas.js +1 -1
- package/dist/createLucideIcon-SCvtEGVf.js +96 -0
- package/dist/dist-DGtNmLwo.js +341 -0
- package/dist/index.js +8 -8
- package/dist/{layer-panel-BM-nX_OX.js → layer-panel-CXIkRodC.js} +229 -112
- package/dist/layer-panel.js +1 -1
- package/dist/{property-panel-Cw6T9dAQ.js → property-panel-CigAECN_.js} +406 -353
- package/dist/property-panel.js +1 -1
- package/package.json +1 -1
- package/dist/dist-B6-i-hhY.js +0 -184
|
@@ -1,10 +1,127 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { i as
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import { n as
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
1
|
+
import { t as e } from "./createLucideIcon-SCvtEGVf.js";
|
|
2
|
+
import { i as t, r as n, t as r } from "./layerPath-uy2ywyld.js";
|
|
3
|
+
import { i, o as a, r as o } from "./completionAnchor-CDR5YZhu.js";
|
|
4
|
+
import { o as s, r as c, s as l, t as ee } from "./useTransientFeedback-Cnp6aNB7.js";
|
|
5
|
+
import { n as te, t as ne } from "./usePathCompletion-uJ5c_gQ0.js";
|
|
6
|
+
import { n as re, t as ie } from "./useDataSourceSchema-DStVoY8Z.js";
|
|
7
|
+
import { Fragment as u, computed as d, createBlock as ae, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createVNode as h, defineComponent as g, nextTick as oe, normalizeClass as _, normalizeStyle as se, onScopeDispose as v, openBlock as y, ref as b, renderList as ce, shallowRef as x, toDisplayString as S, unref as C, vModelText as w, watch as le, withCtx as T, withDirectives as E, withKeys as D, withModifiers as O } from "vue";
|
|
8
|
+
var ue = e({
|
|
9
|
+
name: "eye-off",
|
|
10
|
+
size: 24,
|
|
11
|
+
node: [
|
|
12
|
+
["path", {
|
|
13
|
+
d: "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49",
|
|
14
|
+
key: "ct8e1f"
|
|
15
|
+
}],
|
|
16
|
+
["path", {
|
|
17
|
+
d: "M14.084 14.158a3 3 0 0 1-4.242-4.242",
|
|
18
|
+
key: "151rxh"
|
|
19
|
+
}],
|
|
20
|
+
["path", {
|
|
21
|
+
d: "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143",
|
|
22
|
+
key: "13bj9a"
|
|
23
|
+
}],
|
|
24
|
+
["path", {
|
|
25
|
+
d: "m2 2 20 20",
|
|
26
|
+
key: "1ooewy"
|
|
27
|
+
}]
|
|
28
|
+
]
|
|
29
|
+
}), de = e({
|
|
30
|
+
name: "eye",
|
|
31
|
+
size: 24,
|
|
32
|
+
node: [["path", {
|
|
33
|
+
d: "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0",
|
|
34
|
+
key: "1nclc0"
|
|
35
|
+
}], ["circle", {
|
|
36
|
+
cx: "12",
|
|
37
|
+
cy: "12",
|
|
38
|
+
r: "3",
|
|
39
|
+
key: "1v7zrd"
|
|
40
|
+
}]]
|
|
41
|
+
}), fe = e({
|
|
42
|
+
name: "grip-vertical",
|
|
43
|
+
size: 24,
|
|
44
|
+
node: [
|
|
45
|
+
["circle", {
|
|
46
|
+
cx: "9",
|
|
47
|
+
cy: "12",
|
|
48
|
+
r: "1",
|
|
49
|
+
key: "1vctgf"
|
|
50
|
+
}],
|
|
51
|
+
["circle", {
|
|
52
|
+
cx: "9",
|
|
53
|
+
cy: "5",
|
|
54
|
+
r: "1",
|
|
55
|
+
key: "hp0tcf"
|
|
56
|
+
}],
|
|
57
|
+
["circle", {
|
|
58
|
+
cx: "9",
|
|
59
|
+
cy: "19",
|
|
60
|
+
r: "1",
|
|
61
|
+
key: "fkjjf6"
|
|
62
|
+
}],
|
|
63
|
+
["circle", {
|
|
64
|
+
cx: "15",
|
|
65
|
+
cy: "12",
|
|
66
|
+
r: "1",
|
|
67
|
+
key: "1tmaij"
|
|
68
|
+
}],
|
|
69
|
+
["circle", {
|
|
70
|
+
cx: "15",
|
|
71
|
+
cy: "5",
|
|
72
|
+
r: "1",
|
|
73
|
+
key: "19l28e"
|
|
74
|
+
}],
|
|
75
|
+
["circle", {
|
|
76
|
+
cx: "15",
|
|
77
|
+
cy: "19",
|
|
78
|
+
r: "1",
|
|
79
|
+
key: "f4zoj3"
|
|
80
|
+
}]
|
|
81
|
+
]
|
|
82
|
+
}), pe = e({
|
|
83
|
+
name: "lock-open",
|
|
84
|
+
size: 24,
|
|
85
|
+
node: [["rect", {
|
|
86
|
+
width: "18",
|
|
87
|
+
height: "11",
|
|
88
|
+
x: "3",
|
|
89
|
+
y: "11",
|
|
90
|
+
rx: "2",
|
|
91
|
+
ry: "2",
|
|
92
|
+
key: "1w4ew1"
|
|
93
|
+
}], ["path", {
|
|
94
|
+
d: "M7 11V7a5 5 0 0 1 9.9-1",
|
|
95
|
+
key: "1mm8w8"
|
|
96
|
+
}]],
|
|
97
|
+
aliases: ["unlock"]
|
|
98
|
+
}), me = e({
|
|
99
|
+
name: "lock",
|
|
100
|
+
size: 24,
|
|
101
|
+
node: [["rect", {
|
|
102
|
+
width: "18",
|
|
103
|
+
height: "11",
|
|
104
|
+
x: "3",
|
|
105
|
+
y: "11",
|
|
106
|
+
rx: "2",
|
|
107
|
+
ry: "2",
|
|
108
|
+
key: "1w4ew1"
|
|
109
|
+
}], ["path", {
|
|
110
|
+
d: "M7 11V7a5 5 0 0 1 10 0v4",
|
|
111
|
+
key: "fwvmzm"
|
|
112
|
+
}]]
|
|
113
|
+
}), he = e({
|
|
114
|
+
name: "pencil",
|
|
115
|
+
size: 24,
|
|
116
|
+
node: [["path", {
|
|
117
|
+
d: "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z",
|
|
118
|
+
key: "1a8usu"
|
|
119
|
+
}], ["path", {
|
|
120
|
+
d: "m15 5 4 4",
|
|
121
|
+
key: "1mk7zo"
|
|
122
|
+
}]]
|
|
123
|
+
});
|
|
124
|
+
//#endregion
|
|
8
125
|
//#region ../canvas-editor/src/editing/layerPanel.ts
|
|
9
126
|
function k(e) {
|
|
10
127
|
switch (e.type) {
|
|
@@ -44,10 +161,10 @@ var j = "{{…}}";
|
|
|
44
161
|
function M(e) {
|
|
45
162
|
let t = A(e);
|
|
46
163
|
if (t === null) return "";
|
|
47
|
-
let n =
|
|
164
|
+
let n = a(t).parts.flatMap((e) => e.kind === "fragment" && e.expr !== "" ? [e.expr] : []);
|
|
48
165
|
return n.length === 0 ? j : n.map((e) => `{{${e}}}`).join(" ");
|
|
49
166
|
}
|
|
50
|
-
function N(e, t,
|
|
167
|
+
function N(e, t, n, i) {
|
|
51
168
|
let a = [];
|
|
52
169
|
for (let { key: n, layers: r } of k(e)) for (let e = 0; e < r.length; e += 1) {
|
|
53
170
|
let o = n === "rows" ? "row" : n === "cells" ? "cell" : n === "template" ? "templateRow" : "content", s = n === "content" ? [...t, "content"] : n === "template" ? [...t, "template"] : [
|
|
@@ -60,10 +177,10 @@ function N(e, t, r, i) {
|
|
|
60
177
|
return {
|
|
61
178
|
type: e.type,
|
|
62
179
|
path: t,
|
|
63
|
-
role:
|
|
180
|
+
role: n,
|
|
64
181
|
name: e.name,
|
|
65
182
|
visible: e.visible,
|
|
66
|
-
locked:
|
|
183
|
+
locked: r(t, i),
|
|
67
184
|
expressionPrefix: M(e),
|
|
68
185
|
...e.type === "TableLayer" ? { templated: e.template !== null } : null,
|
|
69
186
|
children: a
|
|
@@ -125,17 +242,17 @@ function R(e, t) {
|
|
|
125
242
|
}
|
|
126
243
|
//#endregion
|
|
127
244
|
//#region src/layer-panel/LayerPanel.vue?vue&type=script&setup=true&lang.ts
|
|
128
|
-
var
|
|
245
|
+
var ge = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rounded-xl border border-cn-line bg-cn-bg text-cn-fg shadow-[0_16px_40px_-12px_rgba(2,6,23,0.55)]" }, _e = { class: "sticky top-0 z-10 flex items-center justify-between border-b border-cn-line bg-cn-bg-elevated/95 px-3.5 py-2.5" }, ve = { class: "flex items-center gap-1" }, ye = [
|
|
129
246
|
"aria-expanded",
|
|
130
247
|
"onClick",
|
|
131
248
|
"onKeydown"
|
|
132
|
-
],
|
|
249
|
+
], be = ["onKeydown"], xe = {
|
|
133
250
|
key: 0,
|
|
134
251
|
class: "px-2 pb-1 text-[11px] text-cn-danger"
|
|
135
|
-
},
|
|
252
|
+
}, Se = { class: "flex gap-1 p-1" }, Ce = ["onClick"], we = ["onClick"], Te = {
|
|
136
253
|
key: 0,
|
|
137
254
|
class: "mx-3.5 my-4 rounded-lg border border-dashed border-cn-line px-3 py-6 text-center text-[11px] leading-5 text-cn-muted"
|
|
138
|
-
},
|
|
255
|
+
}, Ee = [
|
|
139
256
|
"data-key",
|
|
140
257
|
"draggable",
|
|
141
258
|
"onClick",
|
|
@@ -143,36 +260,36 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
143
260
|
"onDragstart",
|
|
144
261
|
"onDragover",
|
|
145
262
|
"onDrop"
|
|
146
|
-
],
|
|
263
|
+
], De = ["onDragstart"], Oe = ["title"], ke = ["onDblclick"], Ae = [
|
|
147
264
|
"title",
|
|
148
265
|
"aria-pressed",
|
|
149
266
|
"onClick"
|
|
150
|
-
],
|
|
267
|
+
], je = [
|
|
151
268
|
"title",
|
|
152
269
|
"aria-pressed",
|
|
153
270
|
"onClick"
|
|
154
|
-
],
|
|
271
|
+
], Me = ["onClick"], Ne = [
|
|
155
272
|
"disabled",
|
|
156
273
|
"title",
|
|
157
274
|
"onClick"
|
|
158
|
-
],
|
|
275
|
+
], Pe = ["onClick"], Fe = ["onClick"], Ie = [
|
|
159
276
|
"disabled",
|
|
160
277
|
"title",
|
|
161
278
|
"onClick"
|
|
162
279
|
], z = /* @__PURE__ */ g({
|
|
163
280
|
__name: "LayerPanel",
|
|
164
281
|
props: { editor: {} },
|
|
165
|
-
setup(
|
|
166
|
-
let
|
|
167
|
-
function
|
|
168
|
-
|
|
282
|
+
setup(e) {
|
|
283
|
+
let r = e, a = `解锁图层(${l("toggleLayerLock", s())})`, g = `图层已锁定(${l("toggleLayerLock", s())} 解锁后可删除)`, v = L(r.editor), x = b(!1), k = b(""), A = b(!1);
|
|
284
|
+
function j() {
|
|
285
|
+
x.value = !1, k.value = "", A.value = !1;
|
|
169
286
|
}
|
|
170
|
-
let
|
|
287
|
+
let M = d(() => x.value ? [] : F.map((e) => e.kind === "layer" ? {
|
|
171
288
|
label: e.label,
|
|
172
289
|
title: e.title,
|
|
173
290
|
dataAttrs: { "data-add-layer": e.type },
|
|
174
291
|
run: () => {
|
|
175
|
-
|
|
292
|
+
r.editor.armLayerCreate(e.type), ee().show(c);
|
|
176
293
|
}
|
|
177
294
|
} : {
|
|
178
295
|
label: e.label,
|
|
@@ -180,33 +297,33 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
180
297
|
dataAttrs: { "data-add-layer": "template-table" },
|
|
181
298
|
keepsOpen: !0,
|
|
182
299
|
run: () => {
|
|
183
|
-
|
|
300
|
+
x.value = !0;
|
|
184
301
|
}
|
|
185
302
|
}));
|
|
186
|
-
function
|
|
187
|
-
let t =
|
|
303
|
+
function N(e) {
|
|
304
|
+
let t = k.value.trim();
|
|
188
305
|
if (t === "") {
|
|
189
|
-
|
|
306
|
+
A.value = !0;
|
|
190
307
|
return;
|
|
191
308
|
}
|
|
192
|
-
|
|
309
|
+
r.editor.addTemplateTable(t), j(), e();
|
|
193
310
|
}
|
|
194
|
-
function
|
|
195
|
-
|
|
311
|
+
function P(e) {
|
|
312
|
+
j(), e();
|
|
196
313
|
}
|
|
197
|
-
function
|
|
198
|
-
|
|
314
|
+
function I() {
|
|
315
|
+
j();
|
|
199
316
|
}
|
|
200
|
-
let
|
|
317
|
+
let z = ie(r.editor), Le = d(() => te(z.value)), B = b(null), V = b(null), { popup: H, accept: Re } = ne({
|
|
201
318
|
target: B,
|
|
202
|
-
enabled: () =>
|
|
319
|
+
enabled: () => x.value,
|
|
203
320
|
resolve: (e) => Le.value?.(e) ?? null,
|
|
204
321
|
popupEl: d(() => V.value?.rootEl ?? null)
|
|
205
322
|
});
|
|
206
323
|
function ze(e, t) {
|
|
207
324
|
if (e.key === "Enter") {
|
|
208
325
|
if (H.open && H.items.length > 0) return;
|
|
209
|
-
e.preventDefault(),
|
|
326
|
+
e.preventDefault(), N(t);
|
|
210
327
|
return;
|
|
211
328
|
}
|
|
212
329
|
e.key === "Escape" && H.open && e.stopPropagation();
|
|
@@ -221,55 +338,55 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
221
338
|
}
|
|
222
339
|
}
|
|
223
340
|
let U = d(() => {
|
|
224
|
-
let e = [],
|
|
341
|
+
let e = [], t = /* @__PURE__ */ new Map();
|
|
225
342
|
function r(i, a, o, s) {
|
|
226
343
|
let c = i.role === "row" ? i.path.slice(0, -2) : i.role === "templateRow" ? i.path.slice(0, -1) : s, l = 0;
|
|
227
|
-
i.role === "root" && (l = (
|
|
344
|
+
i.role === "root" && (l = (t.get(i.type) ?? 0) + 1, t.set(i.type, l)), e.push({
|
|
228
345
|
key: i.path.join("."),
|
|
229
346
|
node: i,
|
|
230
347
|
indentLevel: a,
|
|
231
348
|
label: Be(i, l),
|
|
232
349
|
indexInGroup: o,
|
|
233
350
|
tablePath: c,
|
|
234
|
-
inTemplate:
|
|
351
|
+
inTemplate: n(i.path),
|
|
235
352
|
draggable: i.role === "root" || i.role === "row" || i.role === "cell"
|
|
236
353
|
}), i.children.forEach((e, t) => r(e, a + 1, t, c));
|
|
237
354
|
}
|
|
238
|
-
return
|
|
355
|
+
return v.outline.value.forEach((e, t) => r(e, 0, t, null)), e;
|
|
239
356
|
}), Ve = d(() => U.value.length > 0);
|
|
240
357
|
function He(e) {
|
|
241
|
-
|
|
358
|
+
r.editor.setSelection(e.node.path);
|
|
242
359
|
}
|
|
243
360
|
function W(e) {
|
|
244
|
-
|
|
361
|
+
r.editor.setHovered(e === null ? null : e.node.path);
|
|
245
362
|
}
|
|
246
363
|
function Ue(e) {
|
|
247
|
-
|
|
364
|
+
r.editor.addTableRow(e.node.path);
|
|
248
365
|
}
|
|
249
366
|
function We(e) {
|
|
250
|
-
|
|
367
|
+
r.editor.addTableCell(e.node.path);
|
|
251
368
|
}
|
|
252
369
|
function Ge(e) {
|
|
253
|
-
|
|
370
|
+
r.editor.addTemplateCell(e.node.path.slice(0, -1));
|
|
254
371
|
}
|
|
255
372
|
function Ke(e) {
|
|
256
|
-
|
|
373
|
+
r.editor.deleteLayer(e.node.path);
|
|
257
374
|
}
|
|
258
375
|
function qe(e) {
|
|
259
|
-
|
|
376
|
+
r.editor.toggleLayerVisibility(e.node.path);
|
|
260
377
|
}
|
|
261
378
|
function Je(e) {
|
|
262
|
-
|
|
379
|
+
r.editor.toggleLayerLock(e.node.path);
|
|
263
380
|
}
|
|
264
381
|
let G = b(null), K = b(null);
|
|
265
|
-
function q(
|
|
382
|
+
function q(e) {
|
|
266
383
|
let r = G.value;
|
|
267
384
|
if (!r) return !1;
|
|
268
|
-
if (r.kind === "root") return
|
|
269
|
-
if (r.kind === "row") return
|
|
270
|
-
if (
|
|
271
|
-
let i =
|
|
272
|
-
return i ===
|
|
385
|
+
if (r.kind === "root") return e.node.role === "root";
|
|
386
|
+
if (r.kind === "row") return e.node.role === "row";
|
|
387
|
+
if (e.node.role !== "cell") return !1;
|
|
388
|
+
let i = n(r.cellPath);
|
|
389
|
+
return i === e.inTemplate ? !i || t(r.cellPath.slice(0, -2), e.node.path.slice(0, -2)) : !1;
|
|
273
390
|
}
|
|
274
391
|
function J(e) {
|
|
275
392
|
return e.node.role === "root";
|
|
@@ -305,56 +422,56 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
305
422
|
}
|
|
306
423
|
function Qe(e, t) {
|
|
307
424
|
if (!q(e)) return;
|
|
308
|
-
let n = K.value,
|
|
309
|
-
if (!
|
|
425
|
+
let n = K.value, i = G.value;
|
|
426
|
+
if (!i || !n || n.key !== e.key) return;
|
|
310
427
|
t.preventDefault();
|
|
311
428
|
let a = n.edge === "before" ? e.indexInGroup : e.indexInGroup + 1;
|
|
312
|
-
|
|
429
|
+
i.kind === "root" ? r.editor.moveRootLayer(i.from, a) : i.kind === "row" ? e.tablePath !== null && e.tablePath.join(".") === i.tablePath.join(".") ? r.editor.moveTableRow(i.tablePath, i.from, a) : r.editor.moveTableRowToTable(i.rowPath, e.tablePath, a) : r.editor.moveTableCellToRow(i.cellPath, e.node.path.slice(0, -2), a), G.value = null, K.value = null;
|
|
313
430
|
}
|
|
314
431
|
function $e() {
|
|
315
432
|
G.value = null, K.value = null;
|
|
316
433
|
}
|
|
317
|
-
function X(
|
|
318
|
-
return
|
|
434
|
+
function X(e) {
|
|
435
|
+
return t(v.selection.value, e.node.path);
|
|
319
436
|
}
|
|
320
|
-
function et(
|
|
321
|
-
return
|
|
437
|
+
function et(e) {
|
|
438
|
+
return t(v.hovered.value, e.node.path);
|
|
322
439
|
}
|
|
323
440
|
let Z = b(""), Q = null, $ = null;
|
|
324
441
|
function tt(e) {
|
|
325
442
|
$ = e instanceof HTMLInputElement ? e : null;
|
|
326
443
|
}
|
|
327
|
-
function nt(
|
|
328
|
-
return
|
|
444
|
+
function nt(e) {
|
|
445
|
+
return t(v.renaming.value, e.node.path);
|
|
329
446
|
}
|
|
330
447
|
function rt(e) {
|
|
331
|
-
J(e) &&
|
|
448
|
+
J(e) && r.editor.beginRename(e.node.path);
|
|
332
449
|
}
|
|
333
450
|
function it() {
|
|
334
451
|
let e = Z.value.trim();
|
|
335
452
|
if (Q !== null && e === Q.trim()) {
|
|
336
|
-
|
|
453
|
+
r.editor.cancelRename();
|
|
337
454
|
return;
|
|
338
455
|
}
|
|
339
|
-
|
|
456
|
+
r.editor.commitRename(e);
|
|
340
457
|
}
|
|
341
458
|
function at() {
|
|
342
|
-
|
|
459
|
+
r.editor.cancelRename();
|
|
343
460
|
}
|
|
344
|
-
return
|
|
345
|
-
if (
|
|
461
|
+
return le(v.renaming, async (e) => {
|
|
462
|
+
if (e === null) {
|
|
346
463
|
Q = null;
|
|
347
464
|
return;
|
|
348
465
|
}
|
|
349
|
-
let n = U.value.find((n) =>
|
|
350
|
-
Z.value = n?.label ?? "", Q = Z.value, await
|
|
466
|
+
let n = U.value.find((n) => t(n.node.path, e));
|
|
467
|
+
Z.value = n?.label ?? "", Q = Z.value, await oe();
|
|
351
468
|
let r = $;
|
|
352
469
|
r && (r.focus({ preventScroll: !0 }), r.select());
|
|
353
|
-
}), (e, t) => (y(), p("aside",
|
|
354
|
-
m("header",
|
|
470
|
+
}), (e, t) => (y(), p("aside", ge, [
|
|
471
|
+
m("header", _e, [t[9] ||= m("span", { class: "text-[12px] font-medium tracking-wide text-cn-fg/90" }, "图层", -1), m("div", ve, [h(re, {
|
|
355
472
|
label: "新增图层",
|
|
356
|
-
items:
|
|
357
|
-
onClosed:
|
|
473
|
+
items: M.value,
|
|
474
|
+
onClosed: I
|
|
358
475
|
}, {
|
|
359
476
|
trigger: T(({ open: e, toggle: t, triggerRef: n, onKeydown: r }) => [m("button", {
|
|
360
477
|
ref: n,
|
|
@@ -366,44 +483,44 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
366
483
|
class: "flex size-6 items-center justify-center rounded border border-cn-field-line bg-cn-field text-[13px] leading-none text-cn-fg/80 hover:border-cn-accent/40 hover:text-cn-accent",
|
|
367
484
|
onClick: t,
|
|
368
485
|
onKeydown: r
|
|
369
|
-
}, " + ", 40,
|
|
370
|
-
body: T(({ closeMenu: e }) => [
|
|
486
|
+
}, " + ", 40, ye)]),
|
|
487
|
+
body: T(({ closeMenu: e }) => [x.value ? (y(), p(u, { key: 0 }, [
|
|
371
488
|
t[8] ||= m("p", { class: "px-2 pt-1 text-[11px] leading-4 text-cn-muted" }, "模板行按数据行路径展开成表", -1),
|
|
372
489
|
E(m("input", {
|
|
373
490
|
ref_key: "rowsPathInputEl",
|
|
374
491
|
ref: B,
|
|
375
|
-
"onUpdate:modelValue": t[0] ||= (e) =>
|
|
492
|
+
"onUpdate:modelValue": t[0] ||= (e) => k.value = e,
|
|
376
493
|
"data-template-rows-path": "",
|
|
377
494
|
type: "text",
|
|
378
495
|
placeholder: "如 order.items",
|
|
379
|
-
class: _(["mx-1 my-1 w-[calc(100%-8px)] rounded border bg-cn-field px-2 py-1 text-[12px] text-cn-fg outline-none focus:border-cn-accent/60",
|
|
496
|
+
class: _(["mx-1 my-1 w-[calc(100%-8px)] rounded border bg-cn-field px-2 py-1 text-[12px] text-cn-fg outline-none focus:border-cn-accent/60", A.value ? "border-cn-danger" : "border-cn-field-line"]),
|
|
380
497
|
onKeydown: (t) => ze(t, e)
|
|
381
|
-
}, null, 42,
|
|
382
|
-
|
|
383
|
-
m("div",
|
|
498
|
+
}, null, 42, be), [[w, k.value]]),
|
|
499
|
+
A.value ? (y(), p("p", xe, "rowsPath 必填")) : f("", !0),
|
|
500
|
+
m("div", Se, [m("button", {
|
|
384
501
|
type: "button",
|
|
385
502
|
"data-template-confirm": "",
|
|
386
503
|
class: "flex-1 rounded bg-cn-accent/20 px-2 py-1 text-[12px] text-cn-accent hover:bg-cn-accent/30",
|
|
387
|
-
onClick: (t) =>
|
|
388
|
-
}, " 创建 ", 8,
|
|
504
|
+
onClick: (t) => N(e)
|
|
505
|
+
}, " 创建 ", 8, Ce), m("button", {
|
|
389
506
|
type: "button",
|
|
390
507
|
class: "flex-1 rounded px-2 py-1 text-[12px] text-cn-muted hover:text-cn-fg",
|
|
391
|
-
onClick: (t) =>
|
|
392
|
-
}, " 取消 ", 8,
|
|
508
|
+
onClick: (t) => P(e)
|
|
509
|
+
}, " 取消 ", 8, we)])
|
|
393
510
|
], 64)) : f("", !0)]),
|
|
394
511
|
_: 1
|
|
395
|
-
}, 8, ["items"]),
|
|
512
|
+
}, 8, ["items"]), x.value ? (y(), ae(o, {
|
|
396
513
|
key: 0,
|
|
397
514
|
ref_key: "pathPopupRef",
|
|
398
515
|
ref: V,
|
|
399
516
|
state: C(H),
|
|
400
517
|
onSelect: C(Re)
|
|
401
518
|
}, null, 8, ["state", "onSelect"])) : f("", !0)])]),
|
|
402
|
-
Ve.value ? f("", !0) : (y(), p("p",
|
|
519
|
+
Ve.value ? f("", !0) : (y(), p("p", Te, " 画布还没有图层,用上方按钮新增 ")),
|
|
403
520
|
m("ul", {
|
|
404
521
|
class: "cn-layers__tree flex flex-col gap-0.5 px-1.5 py-1",
|
|
405
522
|
onDragend: $e
|
|
406
|
-
}, [(y(!0), p(u, null,
|
|
523
|
+
}, [(y(!0), p(u, null, ce(U.value, (e) => (y(), p("li", {
|
|
407
524
|
key: e.key,
|
|
408
525
|
"data-key": e.key,
|
|
409
526
|
draggable: Xe(e),
|
|
@@ -416,7 +533,7 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
416
533
|
"cn-layers__row--drop-before": K.value?.key === e.key && K.value?.edge === "before",
|
|
417
534
|
"cn-layers__row--drop-after": K.value?.key === e.key && K.value?.edge === "after"
|
|
418
535
|
}]),
|
|
419
|
-
style:
|
|
536
|
+
style: se({ paddingLeft: `${4 + e.indentLevel * 14}px` }),
|
|
420
537
|
onClick: (t) => He(e),
|
|
421
538
|
onMouseenter: (t) => W(e),
|
|
422
539
|
onMouseleave: t[7] ||= (e) => W(null),
|
|
@@ -431,16 +548,16 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
431
548
|
title: "拖动排序",
|
|
432
549
|
class: "cn-layers__handle shrink-0",
|
|
433
550
|
onDragstart: (t) => Y(e, t)
|
|
434
|
-
}, [h(
|
|
435
|
-
icon: C(
|
|
551
|
+
}, [h(i, {
|
|
552
|
+
icon: C(fe),
|
|
436
553
|
size: 12,
|
|
437
554
|
"stroke-width": 2.5
|
|
438
|
-
}, null, 8, ["icon"])], 40,
|
|
555
|
+
}, null, 8, ["icon"])], 40, De)) : f("", !0),
|
|
439
556
|
e.node.expressionPrefix === "" ? f("", !0) : (y(), p("span", {
|
|
440
557
|
key: 1,
|
|
441
558
|
class: "cn-layers__prefix",
|
|
442
559
|
title: e.node.expressionPrefix
|
|
443
|
-
}, S(e.node.expressionPrefix), 9,
|
|
560
|
+
}, S(e.node.expressionPrefix), 9, Oe)),
|
|
444
561
|
nt(e) ? E((y(), p("input", {
|
|
445
562
|
key: 2,
|
|
446
563
|
ref_for: !0,
|
|
@@ -457,7 +574,7 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
457
574
|
key: 3,
|
|
458
575
|
class: "cn-layers__label min-w-0 flex-1 truncate font-mono text-[11px] leading-4",
|
|
459
576
|
onDblclick: (t) => rt(e)
|
|
460
|
-
}, S(e.label), 41,
|
|
577
|
+
}, S(e.label), 41, ke)),
|
|
461
578
|
J(e) ? (y(), p("button", {
|
|
462
579
|
key: 4,
|
|
463
580
|
type: "button",
|
|
@@ -466,24 +583,24 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
466
583
|
title: e.node.visible ? "隐藏图层(最终输出不含该层)" : "显示图层",
|
|
467
584
|
"aria-pressed": !e.node.visible,
|
|
468
585
|
onClick: O((t) => qe(e), ["stop"])
|
|
469
|
-
}, [h(
|
|
470
|
-
icon: e.node.visible ? C(
|
|
586
|
+
}, [h(i, {
|
|
587
|
+
icon: e.node.visible ? C(de) : C(ue),
|
|
471
588
|
size: 11,
|
|
472
589
|
"stroke-width": 2
|
|
473
|
-
}, null, 8, ["icon"])], 10,
|
|
590
|
+
}, null, 8, ["icon"])], 10, Ae)) : f("", !0),
|
|
474
591
|
J(e) ? (y(), p("button", {
|
|
475
592
|
key: 5,
|
|
476
593
|
type: "button",
|
|
477
594
|
"data-lock": "",
|
|
478
595
|
class: _(["cn-layers__lock size-5 shrink-0 items-center justify-center rounded text-cn-muted hover:bg-cn-accent/15 hover:text-cn-accent", e.node.locked ? "flex" : "hidden group-hover:flex"]),
|
|
479
|
-
title: e.node.locked ?
|
|
596
|
+
title: e.node.locked ? a : "锁定图层(画布不可点选/拖动/删除,渲染照常)",
|
|
480
597
|
"aria-pressed": e.node.locked,
|
|
481
598
|
onClick: O((t) => Je(e), ["stop"])
|
|
482
|
-
}, [h(
|
|
483
|
-
icon: e.node.locked ? C(
|
|
599
|
+
}, [h(i, {
|
|
600
|
+
icon: e.node.locked ? C(me) : C(pe),
|
|
484
601
|
size: 11,
|
|
485
602
|
"stroke-width": 2
|
|
486
|
-
}, null, 8, ["icon"])], 10,
|
|
603
|
+
}, null, 8, ["icon"])], 10, je)) : f("", !0),
|
|
487
604
|
J(e) ? (y(), p("button", {
|
|
488
605
|
key: 6,
|
|
489
606
|
type: "button",
|
|
@@ -491,11 +608,11 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
491
608
|
class: "cn-layers__delete hidden size-5 shrink-0 items-center justify-center rounded text-cn-muted hover:bg-cn-accent/15 hover:text-cn-accent group-hover:flex",
|
|
492
609
|
title: "重命名(双击名称或 F2)",
|
|
493
610
|
onClick: O((t) => rt(e), ["stop"])
|
|
494
|
-
}, [h(
|
|
495
|
-
icon: C(
|
|
611
|
+
}, [h(i, {
|
|
612
|
+
icon: C(he),
|
|
496
613
|
size: 11,
|
|
497
614
|
"stroke-width": 2
|
|
498
|
-
}, null, 8, ["icon"])], 8,
|
|
615
|
+
}, null, 8, ["icon"])], 8, Me)) : f("", !0),
|
|
499
616
|
e.node.role === "root" && e.node.type === "TableLayer" ? (y(), p("button", {
|
|
500
617
|
key: 7,
|
|
501
618
|
type: "button",
|
|
@@ -504,7 +621,7 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
504
621
|
disabled: e.node.templated === !0,
|
|
505
622
|
title: e.node.templated === !0 ? "模板态不可加行——行由数据展开" : "加行(缺省行 + 缺省格与文本,行宽=表宽)",
|
|
506
623
|
onClick: O((t) => Ue(e), ["stop"])
|
|
507
|
-
}, " +行 ", 8,
|
|
624
|
+
}, " +行 ", 8, Ne)) : f("", !0),
|
|
508
625
|
e.node.role === "row" ? (y(), p("button", {
|
|
509
626
|
key: 8,
|
|
510
627
|
type: "button",
|
|
@@ -512,7 +629,7 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
512
629
|
class: "cn-layers__delete hidden size-5 shrink-0 items-center justify-center rounded text-[10px] leading-none text-cn-muted hover:bg-cn-accent/15 hover:text-cn-accent group-hover:flex",
|
|
513
630
|
title: "加格(缺省格 + 文本内容,行高取最高格)",
|
|
514
631
|
onClick: O((t) => We(e), ["stop"])
|
|
515
|
-
}, " +格 ", 8,
|
|
632
|
+
}, " +格 ", 8, Pe)) : f("", !0),
|
|
516
633
|
e.node.role === "templateRow" ? (y(), p("button", {
|
|
517
634
|
key: 9,
|
|
518
635
|
type: "button",
|
|
@@ -520,15 +637,15 @@ var he = { class: "cn-props flex w-[232px] shrink-0 flex-col overflow-y-auto rou
|
|
|
520
637
|
class: "cn-layers__delete hidden size-5 shrink-0 items-center justify-center rounded text-[10px] leading-none text-cn-muted hover:bg-cn-accent/15 hover:text-cn-accent group-hover:flex",
|
|
521
638
|
title: "加格(缺省格 + 文本内容,零高度耦合——行高由数据展开定稿)",
|
|
522
639
|
onClick: O((t) => Ge(e), ["stop"])
|
|
523
|
-
}, " +格 ", 8,
|
|
640
|
+
}, " +格 ", 8, Fe)) : f("", !0),
|
|
524
641
|
m("button", {
|
|
525
642
|
type: "button",
|
|
526
643
|
class: "cn-layers__delete hidden size-5 shrink-0 items-center justify-center rounded text-[10px] leading-none text-cn-muted hover:bg-cn-danger/15 hover:text-cn-danger group-hover:flex disabled:cursor-not-allowed disabled:text-cn-muted/50 disabled:hover:bg-transparent disabled:hover:text-cn-muted/50",
|
|
527
644
|
disabled: e.node.role === "templateRow" || e.node.locked,
|
|
528
|
-
title: e.node.role === "templateRow" ? "行模板由表持有——转换回普通表请用 V2 转换入口" : e.node.locked ?
|
|
645
|
+
title: e.node.role === "templateRow" ? "行模板由表持有——转换回普通表请用 V2 转换入口" : e.node.locked ? g : "删除(含子层)",
|
|
529
646
|
onClick: O((t) => Ke(e), ["stop"])
|
|
530
|
-
}, " ✕ ", 8,
|
|
531
|
-
], 46,
|
|
647
|
+
}, " ✕ ", 8, Ie)
|
|
648
|
+
], 46, Ee))), 128))], 32)
|
|
532
649
|
]));
|
|
533
650
|
}
|
|
534
651
|
});
|
package/dist/layer-panel.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as e, i as t, n, r, t as i } from "./layer-panel-
|
|
1
|
+
import { a as e, i as t, n, r, t as i } from "./layer-panel-CXIkRodC.js";
|
|
2
2
|
export { t as ADD_LAYER_MENU, e as ADD_MENU, i as LayerPanel, n as isUpperHalf, r as useLayerPanel };
|