@vtable-guild/vtable-guild 2.6.3 → 2.7.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.
- package/css/presets/antdv.css +2 -0
- package/css/presets/element-plus.css +2 -0
- package/css/style.css +25 -3
- package/css/tailwind3-utilities.css +21 -3
- package/css/tailwind3.css +4 -0
- package/css/tailwind4.css +4 -0
- package/dist/core/src/components/VirtualList/VirtualList.d.ts.map +1 -1
- package/dist/core/src/components/VirtualList/VirtualList.mjs +97 -91
- package/dist/css/presets/antdv.css +2 -0
- package/dist/css/presets/element-plus.css +2 -0
- package/dist/css/style.css +25 -3
- package/dist/css/tailwind3-utilities.css +21 -3
- package/dist/css/tailwind3.css +4 -0
- package/dist/css/tailwind4.css +4 -0
- package/dist/index.full.mjs +4051 -3623
- package/dist/index.mjs +22 -19
- package/dist/table/src/components/ExpandedRowTr.d.ts +90 -0
- package/dist/table/src/components/ExpandedRowTr.d.ts.map +1 -0
- package/dist/table/src/components/ExpandedRowTr.mjs +61 -0
- package/dist/table/src/components/Table.d.ts +23 -3
- package/dist/table/src/components/Table.d.ts.map +1 -1
- package/dist/table/src/components/Table.mjs +421 -365
- package/dist/table/src/components/TableBody.d.ts.map +1 -1
- package/dist/table/src/components/TableBody.mjs +67 -58
- package/dist/table/src/components/VTable.vue.d.ts +4 -3
- package/dist/table/src/components/VTable.vue.d.ts.map +1 -1
- package/dist/table/src/components/VTable.vue.mjs +43 -37
- package/dist/table/src/components/VirtualTableBody.d.ts.map +1 -1
- package/dist/table/src/components/VirtualTableBody.mjs +151 -140
- package/dist/table/src/composables/index.d.ts +3 -0
- package/dist/table/src/composables/index.d.ts.map +1 -1
- package/dist/table/src/composables/useAutoHeight.d.ts +32 -0
- package/dist/table/src/composables/useAutoHeight.d.ts.map +1 -0
- package/dist/table/src/composables/useAutoHeight.mjs +66 -0
- package/dist/table/src/composables/useAutoHeight.test.d.ts +2 -0
- package/dist/table/src/composables/useAutoHeight.test.d.ts.map +1 -0
- package/dist/table/src/composables/useColumnDisplay.d.ts +26 -0
- package/dist/table/src/composables/useColumnDisplay.d.ts.map +1 -0
- package/dist/table/src/composables/useColumnDisplay.mjs +46 -0
- package/dist/table/src/composables/useColumnDisplay.test.d.ts +2 -0
- package/dist/table/src/composables/useColumnDisplay.test.d.ts.map +1 -0
- package/dist/table/src/composables/useColumnMetrics.d.ts.map +1 -1
- package/dist/table/src/composables/useColumnMetrics.mjs +49 -49
- package/dist/table/src/composables/useColumnMetrics.test.d.ts +2 -0
- package/dist/table/src/composables/useColumnMetrics.test.d.ts.map +1 -0
- package/dist/table/src/composables/useColumnWindow.mjs +16 -16
- package/dist/table/src/composables/useResize.d.ts.map +1 -1
- package/dist/table/src/composables/useResize.mjs +37 -31
- package/dist/table/src/composables/useRowDragSort.d.ts +79 -0
- package/dist/table/src/composables/useRowDragSort.d.ts.map +1 -0
- package/dist/table/src/composables/useRowDragSort.mjs +146 -0
- package/dist/table/src/composables/useRowDragSort.test.d.ts +2 -0
- package/dist/table/src/composables/useRowDragSort.test.d.ts.map +1 -0
- package/dist/table/src/composables/useScroll.d.ts +8 -0
- package/dist/table/src/composables/useScroll.d.ts.map +1 -1
- package/dist/table/src/composables/useScroll.mjs +37 -37
- package/dist/table/src/composables/useVirtual.d.ts +35 -0
- package/dist/table/src/composables/useVirtual.d.ts.map +1 -1
- package/dist/table/src/composables/useVirtual.mjs +44 -16
- package/dist/table/src/context.d.ts +14 -0
- package/dist/table/src/context.d.ts.map +1 -1
- package/dist/table/src/index.d.ts +14 -4
- package/dist/table/src/index.d.ts.map +1 -1
- package/dist/table/src/types/column.d.ts +6 -0
- package/dist/table/src/types/column.d.ts.map +1 -1
- package/dist/table/src/types/index.d.ts +1 -1
- package/dist/table/src/types/index.d.ts.map +1 -1
- package/dist/table/src/types/table.d.ts +32 -9
- package/dist/table/src/types/table.d.ts.map +1 -1
- package/dist/table/src/utils/rowKey.d.ts +8 -0
- package/dist/table/src/utils/rowKey.d.ts.map +1 -0
- package/dist/table/src/utils/rowKey.mjs +6 -0
- package/dist/theme/src/presets/antdv/table.d.ts +6 -1
- package/dist/theme/src/presets/antdv/table.d.ts.map +1 -1
- package/dist/theme/src/presets/antdv/table.mjs +14 -1
- package/dist/theme/src/presets/element-plus/table.d.ts +6 -1
- package/dist/theme/src/presets/element-plus/table.d.ts.map +1 -1
- package/dist/theme/src/presets/element-plus/table.mjs +8 -1
- package/package.json +1 -1
|
@@ -1,71 +1,71 @@
|
|
|
1
|
-
import { shallowRef as
|
|
2
|
-
import { getColumnKey as
|
|
3
|
-
const
|
|
4
|
-
function
|
|
5
|
-
if (e === null ||
|
|
6
|
-
if (e.widths.length !==
|
|
7
|
-
for (let
|
|
8
|
-
if (Math.abs(e.widths[
|
|
1
|
+
import { shallowRef as g, watch as y, onMounted as N, onBeforeUnmount as A } from "vue";
|
|
2
|
+
import { getColumnKey as F } from "./useColumns.mjs";
|
|
3
|
+
const O = 0.5;
|
|
4
|
+
function q(e, t) {
|
|
5
|
+
if (e === null || t === null) return e === t;
|
|
6
|
+
if (e.widths.length !== t.widths.length) return !1;
|
|
7
|
+
for (let r = 0; r < e.widths.length; r += 1)
|
|
8
|
+
if (Math.abs(e.widths[r] - t.widths[r]) > O) return !1;
|
|
9
9
|
return !0;
|
|
10
10
|
}
|
|
11
|
-
function C(e,
|
|
12
|
-
return
|
|
11
|
+
function C(e, t) {
|
|
12
|
+
return F(e) ?? t;
|
|
13
13
|
}
|
|
14
|
-
function E(e,
|
|
15
|
-
const
|
|
16
|
-
let
|
|
14
|
+
function E(e, t) {
|
|
15
|
+
const r = [];
|
|
16
|
+
let n = 0;
|
|
17
17
|
for (let l = 0; l < e.length; l += 1) {
|
|
18
|
-
const
|
|
19
|
-
if (!Number.isFinite(
|
|
20
|
-
|
|
18
|
+
const s = t[String(C(e[l], l))] ?? e[l].width, f = typeof s == "number" ? s : Number.NaN;
|
|
19
|
+
if (!Number.isFinite(f) || f <= 0) return null;
|
|
20
|
+
r.push(f), n += f;
|
|
21
21
|
}
|
|
22
|
-
return
|
|
22
|
+
return n > 0 ? { widths: r, total: n } : null;
|
|
23
23
|
}
|
|
24
24
|
function M(e) {
|
|
25
|
-
const
|
|
26
|
-
let
|
|
25
|
+
const t = g(null);
|
|
26
|
+
let r = 0, n = null, l = null, s = null;
|
|
27
27
|
function f() {
|
|
28
|
-
const u = e.columns(),
|
|
29
|
-
if (
|
|
28
|
+
const u = e.columns(), i = u.length;
|
|
29
|
+
if (i === 0) return null;
|
|
30
30
|
if (!e.hasHeader())
|
|
31
31
|
return E(u, e.columnWidths);
|
|
32
32
|
const w = e.headerEl();
|
|
33
33
|
if (!w) return null;
|
|
34
|
-
const
|
|
35
|
-
if (
|
|
36
|
-
const d = new Array(
|
|
37
|
-
for (const
|
|
38
|
-
const o = Number(
|
|
39
|
-
if (!Number.isInteger(o) || o < 0 || o >=
|
|
40
|
-
d[o] =
|
|
34
|
+
const v = w.querySelectorAll("th[data-vtg-leaf-col]");
|
|
35
|
+
if (v.length !== i) return null;
|
|
36
|
+
const d = new Array(i).fill(-1);
|
|
37
|
+
for (const c of v) {
|
|
38
|
+
const o = Number(c.dataset.vtgLeafCol);
|
|
39
|
+
if (!Number.isInteger(o) || o < 0 || o >= i) return null;
|
|
40
|
+
d[o] = c.getBoundingClientRect().width;
|
|
41
41
|
}
|
|
42
42
|
let h = 0;
|
|
43
|
-
for (const
|
|
44
|
-
if (
|
|
45
|
-
h +=
|
|
43
|
+
for (const c of d) {
|
|
44
|
+
if (c < 0) return null;
|
|
45
|
+
h += c;
|
|
46
46
|
}
|
|
47
47
|
return h > 0 ? { widths: d, total: h } : null;
|
|
48
48
|
}
|
|
49
|
-
function
|
|
50
|
-
if (
|
|
51
|
-
|
|
49
|
+
function m() {
|
|
50
|
+
if (r = 0, !e.enabled()) {
|
|
51
|
+
t.value = null;
|
|
52
52
|
return;
|
|
53
53
|
}
|
|
54
54
|
const u = f();
|
|
55
|
-
|
|
55
|
+
q(t.value, u) || (t.value = u);
|
|
56
56
|
}
|
|
57
|
-
function
|
|
57
|
+
function a() {
|
|
58
58
|
if (typeof requestAnimationFrame > "u") {
|
|
59
|
-
|
|
59
|
+
m();
|
|
60
60
|
return;
|
|
61
61
|
}
|
|
62
|
-
|
|
62
|
+
r || (r = requestAnimationFrame(m));
|
|
63
63
|
}
|
|
64
|
-
function
|
|
65
|
-
const u = e.enabled() && e.hasHeader() ? e.headerEl() : null;
|
|
66
|
-
u
|
|
64
|
+
function b() {
|
|
65
|
+
const u = e.enabled() && e.hasHeader() ? e.headerEl() : null, i = u?.querySelector("table") ?? null;
|
|
66
|
+
u === l && i === s || (n && l && n.unobserve(l), n && s && n.unobserve(s), l = u, s = i, u && (!n && typeof ResizeObserver < "u" && (n = new ResizeObserver(a)), n?.observe(u), i && n?.observe(i)));
|
|
67
67
|
}
|
|
68
|
-
return
|
|
68
|
+
return y(
|
|
69
69
|
[
|
|
70
70
|
() => e.enabled(),
|
|
71
71
|
() => e.hasHeader(),
|
|
@@ -74,14 +74,14 @@ function M(e) {
|
|
|
74
74
|
() => ({ ...e.columnWidths })
|
|
75
75
|
],
|
|
76
76
|
() => {
|
|
77
|
-
|
|
77
|
+
b(), a();
|
|
78
78
|
},
|
|
79
|
-
{ deep: !1 }
|
|
80
|
-
),
|
|
81
|
-
|
|
82
|
-
}),
|
|
83
|
-
|
|
84
|
-
}), { metrics:
|
|
79
|
+
{ deep: !1, flush: "post" }
|
|
80
|
+
), N(() => {
|
|
81
|
+
b(), a();
|
|
82
|
+
}), A(() => {
|
|
83
|
+
r && cancelAnimationFrame(r), n?.disconnect(), n = null, l = null, s = null;
|
|
84
|
+
}), { metrics: t, remeasure: a };
|
|
85
85
|
}
|
|
86
86
|
export {
|
|
87
87
|
M as useColumnMetrics
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useColumnMetrics.test.d.ts","sourceRoot":"","sources":["../../../../../table/src/composables/useColumnMetrics.test.ts"],"names":[],"mappings":""}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { computed as l } from "vue";
|
|
2
|
-
import { PrefixSums as
|
|
2
|
+
import { PrefixSums as p } from "../../../core/src/components/VirtualList/utils/PrefixSums.mjs";
|
|
3
3
|
const S = 2;
|
|
4
4
|
function w(r) {
|
|
5
5
|
const t = r.length;
|
|
@@ -17,34 +17,34 @@ function w(r) {
|
|
|
17
17
|
}
|
|
18
18
|
return { leftFixedCount: n, rightFixedStart: i, contiguous: e };
|
|
19
19
|
}
|
|
20
|
-
function
|
|
21
|
-
const { prefix: t, columnCount: n, leftFixedCount: i, rightFixedStart: e, offsetX: f, viewportWidth: s, overscan: d } = r,
|
|
22
|
-
if (
|
|
23
|
-
return { start:
|
|
20
|
+
function m(r) {
|
|
21
|
+
const { prefix: t, columnCount: n, leftFixedCount: i, rightFixedStart: e, offsetX: f, viewportWidth: s, overscan: d } = r, a = i, c = e - 1;
|
|
22
|
+
if (a > c)
|
|
23
|
+
return { start: a, end: a - 1, leftSpacer: 0, rightSpacer: 0 };
|
|
24
24
|
const h = t.offsetOf(i), x = t.total - t.offsetOf(e), g = f + h, v = f + s - x;
|
|
25
|
-
let
|
|
26
|
-
return o >= n && (o = n - 1), o += d,
|
|
27
|
-
start:
|
|
25
|
+
let u = t.findIndex(g) - d, o = t.findIndex(v);
|
|
26
|
+
return o >= n && (o = n - 1), o += d, u = Math.min(Math.max(u, a), c), o = Math.min(Math.max(o, a), c), o < u && (o = u), {
|
|
27
|
+
start: u,
|
|
28
28
|
end: o,
|
|
29
|
-
leftSpacer: t.offsetOf(
|
|
29
|
+
leftSpacer: t.offsetOf(u) - t.offsetOf(a),
|
|
30
30
|
rightSpacer: t.offsetOf(e) - t.offsetOf(o + 1)
|
|
31
31
|
};
|
|
32
32
|
}
|
|
33
33
|
function O(r) {
|
|
34
|
-
const t = new
|
|
34
|
+
const t = new p(), n = l(() => {
|
|
35
35
|
const e = r.widths();
|
|
36
|
-
return !e || e.length === 0 ? null : (t.markAllDirty(), t.sync(e.length, (f) => e[f], 0), e.length);
|
|
36
|
+
return !e || e.length === 0 ? null : (t.markAllDirty(), t.sync(e.length, (f) => e[f], 0), { count: e.length, prefix: t });
|
|
37
37
|
}), i = l(() => {
|
|
38
38
|
const e = n.value;
|
|
39
|
-
return e
|
|
40
|
-
prefix:
|
|
41
|
-
columnCount: e,
|
|
39
|
+
return e ? m({
|
|
40
|
+
prefix: e.prefix,
|
|
41
|
+
columnCount: e.count,
|
|
42
42
|
leftFixedCount: r.leftFixedCount(),
|
|
43
43
|
rightFixedStart: r.rightFixedStart(),
|
|
44
44
|
offsetX: r.offsetX(),
|
|
45
45
|
viewportWidth: r.viewportWidth(),
|
|
46
46
|
overscan: r.overscan?.() ?? S
|
|
47
|
-
});
|
|
47
|
+
}) : null;
|
|
48
48
|
});
|
|
49
49
|
return {
|
|
50
50
|
active: l(() => i.value !== null),
|
|
@@ -56,7 +56,7 @@ function O(r) {
|
|
|
56
56
|
}
|
|
57
57
|
export {
|
|
58
58
|
S as DEFAULT_COLUMN_OVERSCAN,
|
|
59
|
-
|
|
59
|
+
m as computeColumnWindow,
|
|
60
60
|
w as resolveFixedColumnRanges,
|
|
61
61
|
O as useColumnWindow
|
|
62
62
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useResize.d.ts","sourceRoot":"","sources":["../../../../../table/src/composables/useResize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkC,KAAK,GAAG,EAAE,MAAM,KAAK,CAAA;AAC9D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAG1C,MAAM,WAAW,eAAe;IAC9B,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACpC,WAAW,EAAE,CACX,MAAM,EAAE,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,EAC3C,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE,YAAY,KAChB,IAAI,CAAA;IACT,UAAU,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;CACzB;
|
|
1
|
+
{"version":3,"file":"useResize.d.ts","sourceRoot":"","sources":["../../../../../table/src/composables/useResize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkC,KAAK,GAAG,EAAE,MAAM,KAAK,CAAA;AAC9D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAG1C,MAAM,WAAW,eAAe;IAC9B,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACpC,WAAW,EAAE,CACX,MAAM,EAAE,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,EAC3C,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE,YAAY,KAChB,IAAI,CAAA;IACT,UAAU,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;CACzB;AAUD,wBAAgB,SAAS,CAAC,OAAO,EAAE;IACjC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACtF,GAAG,eAAe,CA0ElB"}
|
|
@@ -1,42 +1,48 @@
|
|
|
1
|
-
import { reactive as
|
|
1
|
+
import { reactive as y, ref as g, onBeforeUnmount as W } from "vue";
|
|
2
2
|
import { getColumnKey as b } from "./useColumns.mjs";
|
|
3
|
-
function
|
|
4
|
-
const
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
3
|
+
function w(c) {
|
|
4
|
+
const n = c.currentTarget;
|
|
5
|
+
if (!(n instanceof Element)) return;
|
|
6
|
+
const t = n.closest("th")?.getBoundingClientRect().width;
|
|
7
|
+
return t !== void 0 && Number.isFinite(t) && t > 0 ? t : void 0;
|
|
8
|
+
}
|
|
9
|
+
function E(c) {
|
|
10
|
+
const n = y({}), t = g(!1);
|
|
11
|
+
let o = null, u = "", m = 0, d = 0;
|
|
12
|
+
function f(i) {
|
|
13
|
+
if (!o) return;
|
|
14
|
+
const r = i.clientX - m;
|
|
15
|
+
let e = d + r;
|
|
16
|
+
const l = o.minWidth ?? 50, s = o.maxWidth;
|
|
17
|
+
e = Math.max(l, e), s !== void 0 && (e = Math.min(s, e)), n[u] = e;
|
|
12
18
|
}
|
|
13
|
-
function
|
|
14
|
-
if (!
|
|
15
|
-
const
|
|
16
|
-
|
|
19
|
+
function v(i) {
|
|
20
|
+
if (!o) return;
|
|
21
|
+
const r = o, e = n[u];
|
|
22
|
+
h(), c.onResizeColumn?.(r, e);
|
|
17
23
|
}
|
|
18
|
-
function
|
|
19
|
-
document.removeEventListener("pointermove",
|
|
24
|
+
function h() {
|
|
25
|
+
document.removeEventListener("pointermove", f), document.removeEventListener("pointerup", v), document.body.style.cursor = "", document.body.style.userSelect = "", t.value = !1, o = null;
|
|
20
26
|
}
|
|
21
|
-
function
|
|
22
|
-
e.preventDefault(), e.stopPropagation(),
|
|
23
|
-
const l = b(
|
|
24
|
-
|
|
25
|
-
const
|
|
26
|
-
if (
|
|
27
|
-
|
|
27
|
+
function p(i, r, e) {
|
|
28
|
+
e.preventDefault(), e.stopPropagation(), o = i;
|
|
29
|
+
const l = b(i) ?? String(r);
|
|
30
|
+
u = String(l), m = e.clientX;
|
|
31
|
+
const s = n[u];
|
|
32
|
+
if (s !== void 0)
|
|
33
|
+
d = s;
|
|
28
34
|
else {
|
|
29
|
-
const
|
|
30
|
-
|
|
35
|
+
const a = i.width;
|
|
36
|
+
d = typeof a == "number" && Number.isFinite(a) ? a : w(e) ?? 100;
|
|
31
37
|
}
|
|
32
|
-
|
|
38
|
+
t.value = !0, document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", document.addEventListener("pointermove", f), document.addEventListener("pointerup", v);
|
|
33
39
|
}
|
|
34
|
-
return W(
|
|
35
|
-
columnWidths:
|
|
36
|
-
startResize:
|
|
37
|
-
isResizing:
|
|
40
|
+
return W(h), {
|
|
41
|
+
columnWidths: n,
|
|
42
|
+
startResize: p,
|
|
43
|
+
isResizing: t
|
|
38
44
|
};
|
|
39
45
|
}
|
|
40
46
|
export {
|
|
41
|
-
|
|
47
|
+
E as useResize
|
|
42
48
|
};
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import { Ref } from 'vue';
|
|
2
|
+
import { Key, RowDragSortInfo } from '../types';
|
|
3
|
+
/** 拖拽放置位置:目标行的前 / 后 */
|
|
4
|
+
export type DropPosition = 'before' | 'after';
|
|
5
|
+
export interface RowDragDropTarget {
|
|
6
|
+
key: Key;
|
|
7
|
+
position: DropPosition;
|
|
8
|
+
}
|
|
9
|
+
/** 行拖拽状态对应的 class(trDragging / trDropAbove / trDropBelow) */
|
|
10
|
+
export declare function resolveRowDragClass(rowDrag: {
|
|
11
|
+
draggingKey: Ref<Key | null>;
|
|
12
|
+
dropTarget: Ref<RowDragDropTarget | null>;
|
|
13
|
+
} | undefined, key: Key, slots: {
|
|
14
|
+
trDragging: () => string;
|
|
15
|
+
trDropAbove: () => string;
|
|
16
|
+
trDropBelow: () => string;
|
|
17
|
+
} | undefined): string;
|
|
18
|
+
export interface UseRowDragSortOptions<TRecord extends Record<string, unknown>> {
|
|
19
|
+
/** 是否启用行拖拽(对应 rowDraggable prop) */
|
|
20
|
+
enabled: () => boolean;
|
|
21
|
+
/** 行 key 解析器(与表格 getRowKey 同源) */
|
|
22
|
+
getRowKey: (record: TRecord, index: number) => Key;
|
|
23
|
+
/** 数据源(拖放后在它上面搬移,重排结果交给外部更新) */
|
|
24
|
+
dataSource: () => TRecord[];
|
|
25
|
+
/** 树形数据子节点字段名;缺省 'children' */
|
|
26
|
+
childrenColumnName?: () => string | undefined;
|
|
27
|
+
/** 拖放完成且顺序有变化时回调 */
|
|
28
|
+
onDrop?: (newData: TRecord[], info: RowDragSortInfo) => void;
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* 在树结构中按 key 定位节点:返回包含它的数组从根起的下标路径([] 表示顶层)、
|
|
32
|
+
* 在该数组中的下标与节点引用。找不到返回 null。
|
|
33
|
+
*/
|
|
34
|
+
export interface TreeLocation<TRecord> {
|
|
35
|
+
listPath: number[];
|
|
36
|
+
index: number;
|
|
37
|
+
node: TRecord;
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* 树感知的节点搬移:把 draggedKey 节点搬到 targetKey 节点的前 / 后,
|
|
41
|
+
* 即插入到目标节点的**同级位置**——目标在顶层就回到顶层,目标是某父的子节点
|
|
42
|
+
* 就变成该父的子节点(跨父移动)。节点自身携带整棵子树;平铺数据自然退化为
|
|
43
|
+
* 普通的前后插入。
|
|
44
|
+
*
|
|
45
|
+
* 返回 null 表示不需要更新:找不到节点、拖到自己 / 自己的子树里、或插回原位。
|
|
46
|
+
* 纯函数不修改入参;仅拖拽路径上的 children 数组与父节点对象被克隆,其余节点
|
|
47
|
+
* 保持原引用,选择 / 展开等按 record 引用或 key 记录的状态因此不受影响。
|
|
48
|
+
*/
|
|
49
|
+
export declare function moveTreeNode<TRecord extends Record<string, unknown>>(records: readonly TRecord[], getKey: (record: TRecord, index: number) => Key, draggedKey: Key, targetKey: Key, position: DropPosition, childrenColumnName?: string): TRecord[] | null;
|
|
50
|
+
/** 拖拽行绑到 <tr> 上的 props。禁用时 draggable 为 false、事件仅透传用户 handler。 */
|
|
51
|
+
export interface RowDragBindings {
|
|
52
|
+
draggable: boolean;
|
|
53
|
+
onDragstart: (event: DragEvent) => void;
|
|
54
|
+
onDragover: (event: DragEvent) => void;
|
|
55
|
+
onDragleave: (event: DragEvent) => void;
|
|
56
|
+
onDrop: (event: DragEvent) => void;
|
|
57
|
+
onDragend: (event: DragEvent) => void;
|
|
58
|
+
}
|
|
59
|
+
/**
|
|
60
|
+
* 行拖拽排序(原生 HTML5 拖放)。
|
|
61
|
+
*
|
|
62
|
+
* 仅负责交互状态与拖放结果计算:drop 时在 dataSource 上搬移行并通过
|
|
63
|
+
* onDrop 交给外部更新(受控模式,与 dataSource 为 prop 的数据流一致)。
|
|
64
|
+
* 拖拽态 class(trDragging / trDropAbove / trDropBelow)由行组件根据
|
|
65
|
+
* draggingKey / dropTarget 拼进 rowClass。
|
|
66
|
+
*/
|
|
67
|
+
export declare function useRowDragSort<TRecord extends Record<string, unknown>>(options: UseRowDragSortOptions<TRecord>): {
|
|
68
|
+
draggingKey: Ref<Key | null, Key | null>;
|
|
69
|
+
dropTarget: Ref<{
|
|
70
|
+
key: Key;
|
|
71
|
+
position: DropPosition;
|
|
72
|
+
} | null, RowDragDropTarget | {
|
|
73
|
+
key: Key;
|
|
74
|
+
position: DropPosition;
|
|
75
|
+
} | null>;
|
|
76
|
+
isDragging: import('vue').ComputedRef<boolean>;
|
|
77
|
+
getBindings: (record: TRecord, index: number, userProps?: Record<string, unknown>) => RowDragBindings;
|
|
78
|
+
};
|
|
79
|
+
//# sourceMappingURL=useRowDragSort.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useRowDragSort.d.ts","sourceRoot":"","sources":["../../../../../table/src/composables/useRowDragSort.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,GAAG,EAAE,MAAM,KAAK,CAAA;AAC7C,OAAO,KAAK,EAAE,GAAG,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAEpD,uBAAuB;AACvB,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,OAAO,CAAA;AAE7C,MAAM,WAAW,iBAAiB;IAChC,GAAG,EAAE,GAAG,CAAA;IACR,QAAQ,EAAE,YAAY,CAAA;CACvB;AAED,6DAA6D;AAC7D,wBAAgB,mBAAmB,CACjC,OAAO,EACH;IACE,WAAW,EAAE,GAAG,CAAC,GAAG,GAAG,IAAI,CAAC,CAAA;IAC5B,UAAU,EAAE,GAAG,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAA;CAC1C,GACD,SAAS,EACb,GAAG,EAAE,GAAG,EACR,KAAK,EACD;IAAE,UAAU,EAAE,MAAM,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,MAAM,CAAA;CAAE,GAClF,SAAS,GACZ,MAAM,CAMR;AAED,MAAM,WAAW,qBAAqB,CAAC,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC5E,oCAAoC;IACpC,OAAO,EAAE,MAAM,OAAO,CAAA;IACtB,kCAAkC;IAClC,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,CAAA;IAClD,gCAAgC;IAChC,UAAU,EAAE,MAAM,OAAO,EAAE,CAAA;IAC3B,+BAA+B;IAC/B,kBAAkB,CAAC,EAAE,MAAM,MAAM,GAAG,SAAS,CAAA;IAC7C,oBAAoB;IACpB,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,eAAe,KAAK,IAAI,CAAA;CAC7D;AAED;;;GAGG;AACH,MAAM,WAAW,YAAY,CAAC,OAAO;IACnC,QAAQ,EAAE,MAAM,EAAE,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,OAAO,CAAA;CACd;AA0FD;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAAC,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAClE,OAAO,EAAE,SAAS,OAAO,EAAE,EAC3B,MAAM,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,EAC/C,UAAU,EAAE,GAAG,EACf,SAAS,EAAE,GAAG,EACd,QAAQ,EAAE,YAAY,EACtB,kBAAkB,GAAE,MAAmB,GACtC,OAAO,EAAE,GAAG,IAAI,CAuClB;AAED,iEAAiE;AACjE,MAAM,WAAW,eAAe;IAC9B,SAAS,EAAE,OAAO,CAAA;IAClB,WAAW,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAA;IACvC,UAAU,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAA;IACtC,WAAW,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAA;IACvC,MAAM,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAA;IAClC,SAAS,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAA;CACtC;AAED;;;;;;;GAOG;AACH,wBAAgB,cAAc,CAAC,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACpE,OAAO,EAAE,qBAAqB,CAAC,OAAO,CAAC;;;aApNlC,GAAG;kBACE,YAAY;;aADjB,GAAG;kBACE,YAAY;;;0BAqTZ,OAAO,SACR,MAAM,cACD,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAClC,eAAe;EAwCnB"}
|
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
import { ref as A, computed as R } from "vue";
|
|
2
|
+
function E(r, n, e) {
|
|
3
|
+
if (!r || !e) return "";
|
|
4
|
+
if (r.draggingKey.value === n) return e.trDragging();
|
|
5
|
+
const l = r.dropTarget.value;
|
|
6
|
+
return !l || l.key !== n ? "" : l.position === "before" ? e.trDropAbove() : e.trDropBelow();
|
|
7
|
+
}
|
|
8
|
+
function w(r, n, e, l) {
|
|
9
|
+
const i = (u, a) => {
|
|
10
|
+
for (let o = 0; o < u.length; o += 1) {
|
|
11
|
+
if (e(u[o], o) === n)
|
|
12
|
+
return { listPath: a, index: o, node: u[o] };
|
|
13
|
+
const d = u[o][l];
|
|
14
|
+
if (Array.isArray(d)) {
|
|
15
|
+
const h = i(d, [...a, o]);
|
|
16
|
+
if (h) return h;
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
return null;
|
|
20
|
+
};
|
|
21
|
+
return i(r, []);
|
|
22
|
+
}
|
|
23
|
+
function T(r, n, e, l) {
|
|
24
|
+
const i = r[l];
|
|
25
|
+
return Array.isArray(i) ? i.some(
|
|
26
|
+
(u, a) => e(u, a) === n || T(u, n, e, l)
|
|
27
|
+
) : !1;
|
|
28
|
+
}
|
|
29
|
+
function k(r, n, e) {
|
|
30
|
+
const l = [], i = (u) => {
|
|
31
|
+
u.forEach((a, o) => {
|
|
32
|
+
l.push(n(a, o));
|
|
33
|
+
const d = a[e];
|
|
34
|
+
Array.isArray(d) && i(d);
|
|
35
|
+
});
|
|
36
|
+
};
|
|
37
|
+
return i(r), l;
|
|
38
|
+
}
|
|
39
|
+
function b(r, n, e, l) {
|
|
40
|
+
if (n.length === 0) return l([...r]);
|
|
41
|
+
const [i, ...u] = n, a = [...r], o = a[i], d = o[e];
|
|
42
|
+
return Array.isArray(d) && (a[i] = {
|
|
43
|
+
...o,
|
|
44
|
+
[e]: b(
|
|
45
|
+
d,
|
|
46
|
+
u,
|
|
47
|
+
e,
|
|
48
|
+
l
|
|
49
|
+
)
|
|
50
|
+
}), a;
|
|
51
|
+
}
|
|
52
|
+
function x(r, n, e, l, i, u = "children") {
|
|
53
|
+
if (e === l) return null;
|
|
54
|
+
const a = w(r, e, n, u), o = w(r, l, n, u);
|
|
55
|
+
if (!a || !o || T(a.node, l, n, u) || a.listPath.length === o.listPath.length && a.listPath.every((f, t) => f === o.listPath[t]) && (i === "after" && o.index === a.index - 1 || i === "before" && o.index === a.index + 1))
|
|
56
|
+
return null;
|
|
57
|
+
const h = b(
|
|
58
|
+
r,
|
|
59
|
+
a.listPath,
|
|
60
|
+
u,
|
|
61
|
+
(f) => f.filter((t, v) => v !== a.index)
|
|
62
|
+
), s = w(h, l, n, u);
|
|
63
|
+
return s ? b(h, s.listPath, u, (f) => {
|
|
64
|
+
const t = [...f];
|
|
65
|
+
return t.splice(s.index + (i === "after" ? 1 : 0), 0, a.node), t;
|
|
66
|
+
}) : null;
|
|
67
|
+
}
|
|
68
|
+
function S(r) {
|
|
69
|
+
const n = A(null), e = A(null), l = R(() => n.value !== null);
|
|
70
|
+
function i(s, f, t) {
|
|
71
|
+
r.enabled() && (n.value = r.getRowKey(s, f), t.dataTransfer && (t.dataTransfer.setData("text/plain", String(n.value)), t.dataTransfer.effectAllowed = "move"));
|
|
72
|
+
}
|
|
73
|
+
function u(s, f, t) {
|
|
74
|
+
if (n.value === null) return;
|
|
75
|
+
t.preventDefault(), t.dataTransfer && (t.dataTransfer.dropEffect = "move");
|
|
76
|
+
const v = r.getRowKey(s, f);
|
|
77
|
+
if (v === n.value) {
|
|
78
|
+
e.value = null;
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
const g = t.currentTarget?.getBoundingClientRect(), c = g && t.clientY >= g.top + g.height / 2 ? "after" : "before", y = e.value;
|
|
82
|
+
(!y || y.key !== v || y.position !== c) && (e.value = { key: v, position: c });
|
|
83
|
+
}
|
|
84
|
+
function a(s, f) {
|
|
85
|
+
if (n.value === null) return;
|
|
86
|
+
const t = r.getRowKey(s, f);
|
|
87
|
+
e.value?.key === t && (e.value = null);
|
|
88
|
+
}
|
|
89
|
+
function o(s) {
|
|
90
|
+
if (n.value === null) return;
|
|
91
|
+
s.preventDefault();
|
|
92
|
+
const f = n.value, t = e.value;
|
|
93
|
+
if (n.value = null, e.value = null, !t) return;
|
|
94
|
+
const v = r.childrenColumnName?.() || "children", D = r.dataSource(), g = x(
|
|
95
|
+
D,
|
|
96
|
+
r.getRowKey,
|
|
97
|
+
f,
|
|
98
|
+
t.key,
|
|
99
|
+
t.position,
|
|
100
|
+
v
|
|
101
|
+
);
|
|
102
|
+
g && r.onDrop?.(g, {
|
|
103
|
+
draggedKey: f,
|
|
104
|
+
targetKey: t.key,
|
|
105
|
+
orderedKeys: k(g, r.getRowKey, v)
|
|
106
|
+
});
|
|
107
|
+
}
|
|
108
|
+
function d() {
|
|
109
|
+
n.value = null, e.value = null;
|
|
110
|
+
}
|
|
111
|
+
function h(s, f, t) {
|
|
112
|
+
const D = r.enabled() && t?.draggable !== !1, g = (c, y) => {
|
|
113
|
+
const p = t?.[c];
|
|
114
|
+
typeof p == "function" && p(y);
|
|
115
|
+
};
|
|
116
|
+
return {
|
|
117
|
+
draggable: D,
|
|
118
|
+
onDragstart: (c) => {
|
|
119
|
+
D && i(s, f, c), g("onDragstart", c);
|
|
120
|
+
},
|
|
121
|
+
onDragover: (c) => {
|
|
122
|
+
D && u(s, f, c), g("onDragover", c);
|
|
123
|
+
},
|
|
124
|
+
onDragleave: (c) => {
|
|
125
|
+
D && a(s, f), g("onDragleave", c);
|
|
126
|
+
},
|
|
127
|
+
onDrop: (c) => {
|
|
128
|
+
D && o(c), g("onDrop", c);
|
|
129
|
+
},
|
|
130
|
+
onDragend: (c) => {
|
|
131
|
+
D && d(), g("onDragend", c);
|
|
132
|
+
}
|
|
133
|
+
};
|
|
134
|
+
}
|
|
135
|
+
return {
|
|
136
|
+
draggingKey: n,
|
|
137
|
+
dropTarget: e,
|
|
138
|
+
isDragging: l,
|
|
139
|
+
getBindings: h
|
|
140
|
+
};
|
|
141
|
+
}
|
|
142
|
+
export {
|
|
143
|
+
x as moveTreeNode,
|
|
144
|
+
E as resolveRowDragClass,
|
|
145
|
+
S as useRowDragSort
|
|
146
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useRowDragSort.test.d.ts","sourceRoot":"","sources":["../../../../../table/src/composables/useRowDragSort.test.ts"],"names":[],"mappings":""}
|
|
@@ -2,6 +2,13 @@ import { ComputedRef, Ref } from 'vue';
|
|
|
2
2
|
import { ColumnType, Key } from '../types';
|
|
3
3
|
export interface ScrollConfig {
|
|
4
4
|
x?: number | string;
|
|
5
|
+
/**
|
|
6
|
+
* 纵向滚动高度(启用固定表头)。
|
|
7
|
+
*
|
|
8
|
+
* 数字表示固定视口;`'auto'` 表示自动适应父容器高度(组件内部扣减表头 /
|
|
9
|
+
* 固定 summary,需父容器有确定高度)。虚拟模式下仅兼容正数 px 字符串,
|
|
10
|
+
* 其余字符串 dev 告警并回落 400px 视口;非虚拟模式下按 CSS max-height 原样生效。
|
|
11
|
+
*/
|
|
5
12
|
y?: number | string;
|
|
6
13
|
}
|
|
7
14
|
export interface FixedOffset {
|
|
@@ -28,5 +35,6 @@ export interface UseScrollReturn {
|
|
|
28
35
|
}
|
|
29
36
|
export declare function useScroll(options: {
|
|
30
37
|
displayColumns: () => ColumnType<Record<string, unknown>>[];
|
|
38
|
+
columnWidths?: Record<string, number>;
|
|
31
39
|
}): UseScrollReturn;
|
|
32
40
|
//# sourceMappingURL=useScroll.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useScroll.d.ts","sourceRoot":"","sources":["../../../../../table/src/composables/useScroll.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkC,KAAK,WAAW,EAAE,KAAK,GAAG,EAAE,MAAM,KAAK,CAAA;AAChF,OAAO,KAAK,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAO/C,MAAM,WAAW,YAAY;IAC3B,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACnB,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACpB;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;CACvB;AAED,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC7B,KAAK,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;CAC5B;AAED,MAAM,WAAW,eAAe;IAC9B,aAAa,EAAE,GAAG,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IACtC,WAAW,EAAE,GAAG,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IACpC,WAAW,EAAE,eAAe,CAAA;IAC5B,gBAAgB,EAAE,CAAC,CAAC,EAAE;QAAE,SAAS,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IACxE,YAAY,EAAE,WAAW,CAAC,GAAG,CAAC,GAAG,EAAE,WAAW,CAAC,CAAC,CAAA;IAChD,iBAAiB,EAAE,MAAM,IAAI,CAAA;IAC7B,oBAAoB,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,aAAa,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC3E;AAED,wBAAgB,SAAS,CAAC,OAAO,EAAE;IACjC,cAAc,EAAE,MAAM,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,EAAE,CAAA;
|
|
1
|
+
{"version":3,"file":"useScroll.d.ts","sourceRoot":"","sources":["../../../../../table/src/composables/useScroll.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkC,KAAK,WAAW,EAAE,KAAK,GAAG,EAAE,MAAM,KAAK,CAAA;AAChF,OAAO,KAAK,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAO/C,MAAM,WAAW,YAAY;IAC3B,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACnB;;;;;;OAMG;IACH,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACpB;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;CACvB;AAED,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC7B,KAAK,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;CAC5B;AAED,MAAM,WAAW,eAAe;IAC9B,aAAa,EAAE,GAAG,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IACtC,WAAW,EAAE,GAAG,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IACpC,WAAW,EAAE,eAAe,CAAA;IAC5B,gBAAgB,EAAE,CAAC,CAAC,EAAE;QAAE,SAAS,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IACxE,YAAY,EAAE,WAAW,CAAC,GAAG,CAAC,GAAG,EAAE,WAAW,CAAC,CAAC,CAAA;IAChD,iBAAiB,EAAE,MAAM,IAAI,CAAA;IAC7B,oBAAoB,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,aAAa,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC3E;AAED,wBAAgB,SAAS,CAAC,OAAO,EAAE;IACjC,cAAc,EAAE,MAAM,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,EAAE,CAAA;IAC3D,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CACtC,GAAG,eAAe,CAgHlB"}
|