@ninebone/table 0.0.399 β 0.0.400
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/nine-table.js +30 -30
- package/dist/nine-table.js.map +1 -1
- package/dist/nine-table.umd.js +5 -5
- package/dist/nine-table.umd.js.map +1 -1
- package/package.json +1 -1
package/dist/nine-table.js
CHANGED
|
@@ -22,7 +22,7 @@ const re = class re extends Se.constructor {
|
|
|
22
22
|
};
|
|
23
23
|
a(re, "Trace");
|
|
24
24
|
let jt = re;
|
|
25
|
-
const
|
|
25
|
+
const C = new jt();
|
|
26
26
|
var _, O, p, V, Y, X, St, U, Et;
|
|
27
27
|
const le = class le extends HTMLElement {
|
|
28
28
|
constructor() {
|
|
@@ -59,7 +59,7 @@ const le = class le extends HTMLElement {
|
|
|
59
59
|
let y = 0;
|
|
60
60
|
b > 0 && (y = parseInt(u / b * (h - f), 10)), y < 0 && (y = 0);
|
|
61
61
|
const m = h - f;
|
|
62
|
-
y > m && (y = m), r.style.left = `${y}px`,
|
|
62
|
+
y > m && (y = m), r.style.left = `${y}px`, C.log(y), t(this, p).left.disabled = y === 0, t(this, p).right.disabled = y >= m - 1;
|
|
63
63
|
}, "refresh"));
|
|
64
64
|
c(this, U, /* @__PURE__ */ a((e) => {
|
|
65
65
|
if (!t(this, p)) return !1;
|
|
@@ -217,20 +217,20 @@ const ae = class ae extends HTMLElement {
|
|
|
217
217
|
v(this, "refresh", /* @__PURE__ */ a(() => {
|
|
218
218
|
if (!t(this, z) || !t(this, S) || t(this, D)) return;
|
|
219
219
|
const e = t(this, S).container, s = t(this, S).track, n = t(this, S).thumb, r = e.clientHeight, l = (t(this, z).data.get() || []).length, d = t(this, Q).getRowHeight(), h = l * d;
|
|
220
|
-
if (
|
|
220
|
+
if (C.log(h, r), h <= r) {
|
|
221
221
|
n.style.display = "none", t(this, S).top.disabled = !0, t(this, S).bottom.disabled = !0;
|
|
222
222
|
return;
|
|
223
223
|
} else
|
|
224
224
|
n.style.display = "block";
|
|
225
225
|
const f = s.clientHeight;
|
|
226
|
-
if (
|
|
226
|
+
if (C.log(s, f, this, this.clientHeight), f <= 0) return;
|
|
227
227
|
const u = Math.max(Math.min(f * (r / h), f), 20);
|
|
228
228
|
n.style.height = `${u}px`;
|
|
229
229
|
const b = e.scrollTop, y = Math.max(h - r, 1);
|
|
230
230
|
let m = 0;
|
|
231
231
|
y > 0 && (m = b / y * (f - u));
|
|
232
232
|
const R = f - u;
|
|
233
|
-
m < 0 && (m = 0), m > R && (m = R), n.style.top = `${m}px`,
|
|
233
|
+
m < 0 && (m = 0), m > R && (m = R), n.style.top = `${m}px`, C.log(m), t(this, S).top.disabled = b <= 0, t(this, S).bottom.disabled = b >= y - 1;
|
|
234
234
|
}, "refresh"));
|
|
235
235
|
c(this, Rt, /* @__PURE__ */ a(() => {
|
|
236
236
|
const e = t(this, S).container, s = /* @__PURE__ */ a(() => {
|
|
@@ -428,7 +428,7 @@ At = new WeakMap(), tt = new WeakMap(), a(M, "TableCompiler"), c(M, At, /* @__PU
|
|
|
428
428
|
});
|
|
429
429
|
}, "#resetColIndex"));
|
|
430
430
|
let Gt = M;
|
|
431
|
-
var I, w, W, T, B, F, N, et, Tt, qt, kt, ft, ut, Lt,
|
|
431
|
+
var I, w, W, T, B, F, N, et, Tt, qt, kt, ft, ut, Lt, Ht, gt, Ct, it, bt;
|
|
432
432
|
const ce = class ce {
|
|
433
433
|
constructor(i) {
|
|
434
434
|
c(this, I);
|
|
@@ -506,7 +506,7 @@ const ce = class ce {
|
|
|
506
506
|
c(this, ft, /* @__PURE__ */ a(() => {
|
|
507
507
|
if (!t(this, w).querySelector(".ng-container-body")) return;
|
|
508
508
|
const s = (t(this, I).data.get() || []).length, n = t(this, T) || 24, r = s * n;
|
|
509
|
-
|
|
509
|
+
C.log(`[VirtualHeight] totalCount: ${s}, rowHeight: ${n}, totalVirtualHeight: ${r}`), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((o) => {
|
|
510
510
|
const l = t(this, w).querySelector(o), d = l == null ? void 0 : l.querySelector("table");
|
|
511
511
|
d && (d.style.height = `${r}px`);
|
|
512
512
|
});
|
|
@@ -514,7 +514,7 @@ const ce = class ce {
|
|
|
514
514
|
c(this, ut, /* @__PURE__ */ a(() => {
|
|
515
515
|
if ((t(this, I).data.get() || []).length, t(this, F) > 0 && t(this, T) > 0) {
|
|
516
516
|
const e = Math.ceil(t(this, F) / t(this, T));
|
|
517
|
-
g(this, N, e + t(this, Tt)),
|
|
517
|
+
g(this, N, e + t(this, Tt)), C.log("visibleRows:", e, "cachedRowCount:", t(this, N));
|
|
518
518
|
}
|
|
519
519
|
}, "#updateRowCount"));
|
|
520
520
|
c(this, Lt, /* @__PURE__ */ a(() => {
|
|
@@ -531,7 +531,7 @@ const ce = class ce {
|
|
|
531
531
|
y > 0 && (n[u] && (n[u].style.height = `${y}px`), r[u] && (r[u].style.height = `${y}px`), o[u] && (o[u].style.height = `${y}px`));
|
|
532
532
|
}
|
|
533
533
|
}, "#syncRowHeights"));
|
|
534
|
-
c(this,
|
|
534
|
+
c(this, Ht, /* @__PURE__ */ a(() => {
|
|
535
535
|
!t(this, w) || !(t(this, w) instanceof HTMLElement) || (g(this, B, new ResizeObserver((i) => {
|
|
536
536
|
for (const e of i) {
|
|
537
537
|
const s = e.target;
|
|
@@ -553,7 +553,7 @@ const ce = class ce {
|
|
|
553
553
|
e && e.querySelector("tbody.bindable-tbody") && t(this, qt).call(this, e, i);
|
|
554
554
|
}), t(this, Lt).call(this);
|
|
555
555
|
}, "#renderAllContainers"));
|
|
556
|
-
c(this,
|
|
556
|
+
c(this, Ct, /* @__PURE__ */ a((i) => {
|
|
557
557
|
[".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((e) => {
|
|
558
558
|
var h;
|
|
559
559
|
const s = t(this, w).querySelector(e);
|
|
@@ -577,7 +577,7 @@ const ce = class ce {
|
|
|
577
577
|
const e = t(this, T);
|
|
578
578
|
if (!e || e <= 0) return;
|
|
579
579
|
const n = (t(this, I).data.get() || []).length, r = Math.max(0, Math.floor(i / e)), o = ((d = t(this, W).get(".ng-container-body")) == null ? void 0 : d.length) || 1, l = r + t(this, N);
|
|
580
|
-
|
|
580
|
+
C.log(`[Scroll] scrollTop: ${i}, startIndex: ${r}, cachedRowCount: ${t(this, N)}, targetDataIndex range: ${r} ~ ${l} (Total: ${n})`), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((h) => {
|
|
581
581
|
const f = t(this, w).querySelector(h);
|
|
582
582
|
if (!f) return;
|
|
583
583
|
const u = f.querySelector("tbody.bindable-tbody");
|
|
@@ -592,7 +592,7 @@ const ce = class ce {
|
|
|
592
592
|
y.style.display = "", t(this, bt).call(this, y, J, R);
|
|
593
593
|
});
|
|
594
594
|
}), t(this, et) || (g(this, et, !0), setTimeout(() => {
|
|
595
|
-
t(this,
|
|
595
|
+
t(this, Ct).call(this, r), g(this, et, !1);
|
|
596
596
|
}, 0));
|
|
597
597
|
}, "#handleScroll"));
|
|
598
598
|
c(this, bt, /* @__PURE__ */ a((i, e, s) => {
|
|
@@ -604,7 +604,7 @@ const ce = class ce {
|
|
|
604
604
|
v(this, "destroy", /* @__PURE__ */ a(() => {
|
|
605
605
|
t(this, B) && (t(this, B).disconnect(), g(this, B, null));
|
|
606
606
|
}, "destroy"));
|
|
607
|
-
g(this, I, i.getRootNode().host), g(this, w, i), t(this,
|
|
607
|
+
g(this, I, i.getRootNode().host), g(this, w, i), t(this, Ht).call(this);
|
|
608
608
|
}
|
|
609
609
|
getRowHeight() {
|
|
610
610
|
return t(this, T);
|
|
@@ -614,7 +614,7 @@ const ce = class ce {
|
|
|
614
614
|
return ((e = t(this, W).get(i)) == null ? void 0 : e.length) || 1;
|
|
615
615
|
}
|
|
616
616
|
};
|
|
617
|
-
I = new WeakMap(), w = new WeakMap(), W = new WeakMap(), T = new WeakMap(), B = new WeakMap(), F = new WeakMap(), N = new WeakMap(), et = new WeakMap(), Tt = new WeakMap(), qt = new WeakMap(), kt = new WeakMap(), ft = new WeakMap(), ut = new WeakMap(), Lt = new WeakMap(),
|
|
617
|
+
I = new WeakMap(), w = new WeakMap(), W = new WeakMap(), T = new WeakMap(), B = new WeakMap(), F = new WeakMap(), N = new WeakMap(), et = new WeakMap(), Tt = new WeakMap(), qt = new WeakMap(), kt = new WeakMap(), ft = new WeakMap(), ut = new WeakMap(), Lt = new WeakMap(), Ht = new WeakMap(), gt = new WeakMap(), Ct = new WeakMap(), it = new WeakMap(), bt = new WeakMap(), a(ce, "RowManager");
|
|
618
618
|
let Jt = ce;
|
|
619
619
|
var Mt, st, j, _t, $t, It, Wt, Ot;
|
|
620
620
|
const ct = class ct extends HTMLElement {
|
|
@@ -847,7 +847,7 @@ const ct = class ct extends HTMLElement {
|
|
|
847
847
|
t(this, Wt).call(this);
|
|
848
848
|
}
|
|
849
849
|
disconnectedCallback() {
|
|
850
|
-
this.innerHTML = "",
|
|
850
|
+
this.innerHTML = "", C.log("NineTableSheet destroyed.");
|
|
851
851
|
}
|
|
852
852
|
};
|
|
853
853
|
Mt = new WeakMap(), st = new WeakMap(), j = new WeakMap(), _t = new WeakMap(), $t = new WeakMap(), It = new WeakMap(), Wt = new WeakMap(), Ot = new WeakMap(), a(ct, "NineTableSheet"), v(ct, "SCROLLBAR_SIZE", 16);
|
|
@@ -1048,7 +1048,7 @@ const fe = class fe {
|
|
|
1048
1048
|
mt = new WeakMap(), nt = new WeakMap(), a(fe, "ngRow");
|
|
1049
1049
|
let ee = fe;
|
|
1050
1050
|
var k, E, L, ot, Nt, P, Pt, K, xt, Vt, Yt, rt;
|
|
1051
|
-
const
|
|
1051
|
+
const H = class H {
|
|
1052
1052
|
constructor(i, e) {
|
|
1053
1053
|
c(this, k);
|
|
1054
1054
|
c(this, E);
|
|
@@ -1088,13 +1088,13 @@ const C = class C {
|
|
|
1088
1088
|
this.clear(), this.add(i, !1), t(this, K).call(this);
|
|
1089
1089
|
}, "set"));
|
|
1090
1090
|
c(this, xt, /* @__PURE__ */ a(() => ({
|
|
1091
|
-
rowState:
|
|
1091
|
+
rowState: H.ROW_STATE.EMPTY,
|
|
1092
1092
|
deleted: !1,
|
|
1093
1093
|
filtered: !1,
|
|
1094
1094
|
height: t(this, P).slice(),
|
|
1095
1095
|
o: {},
|
|
1096
1096
|
c: {},
|
|
1097
|
-
_: [0, 0, 0, 0,
|
|
1097
|
+
_: [0, 0, 0, 0, H.ROW_STATE.EMPTY, !1, !1, !0, !1, !0, !0, !1, t(this, P).slice(), -1, {}, {}]
|
|
1098
1098
|
}), "#getDefaultMeta"));
|
|
1099
1099
|
v(this, "reset", /* @__PURE__ */ a(() => {
|
|
1100
1100
|
g(this, L, []), g(this, ot, []), t(this, K).call(this);
|
|
@@ -1115,7 +1115,7 @@ const C = class C {
|
|
|
1115
1115
|
}), s;
|
|
1116
1116
|
}, "#json2Array"));
|
|
1117
1117
|
c(this, Yt, /* @__PURE__ */ a((i) => (Array.isArray(i) || (i = [i]), i.forEach((e) => {
|
|
1118
|
-
e.__ng = t(this, xt).call(this), e.__ng.rowid = this.nextId, e.__ng.rowState =
|
|
1118
|
+
e.__ng = t(this, xt).call(this), e.__ng.rowid = this.nextId, e.__ng.rowState = H.ROW_STATE.INSERT, e.__ng._[0] = e.__ng.rowid;
|
|
1119
1119
|
}), i), "#defaultInsert"));
|
|
1120
1120
|
v(this, "add", /* @__PURE__ */ a((i, e = !0) => {
|
|
1121
1121
|
i === void 0 && (i = {});
|
|
@@ -1124,7 +1124,7 @@ const C = class C {
|
|
|
1124
1124
|
const n = this.count() - 1;
|
|
1125
1125
|
return e || s.forEach((r, o) => {
|
|
1126
1126
|
const l = t(this, E).rawRecords[n - o];
|
|
1127
|
-
l && (l.__ng.rowState =
|
|
1127
|
+
l && (l.__ng.rowState = H.ROW_STATE.EMPTY);
|
|
1128
1128
|
}), t(this, K).call(this), n;
|
|
1129
1129
|
}, "add"));
|
|
1130
1130
|
v(this, "delete", /* @__PURE__ */ a((i) => {
|
|
@@ -1132,8 +1132,8 @@ const C = class C {
|
|
|
1132
1132
|
Array.isArray(i) ? e = i : typeof i > "u" ? e = [t(this, E).host.row.at] : e = [parseInt(i, 10)], e.sort((s, n) => n - s).forEach((s) => {
|
|
1133
1133
|
if (t(this, L)[s]) {
|
|
1134
1134
|
const n = t(this, L)[s].__ng.rowid;
|
|
1135
|
-
t(this, L)[s].__ng.rowState ===
|
|
1136
|
-
r.__ng.rowid === n && (r.__ng.deleted = !0, r.__ng.rowState =
|
|
1135
|
+
t(this, L)[s].__ng.rowState === H.ROW_STATE.INSERT ? t(this, E).rawRecords = t(this, E).rawRecords.filter((r) => r.__ng.rowid !== n) : t(this, E).rawRecords.forEach((r) => {
|
|
1136
|
+
r.__ng.rowid === n && (r.__ng.deleted = !0, r.__ng.rowState = H.ROW_STATE.DELETE);
|
|
1137
1137
|
});
|
|
1138
1138
|
}
|
|
1139
1139
|
}), this.resetRecords(), t(this, K).call(this);
|
|
@@ -1146,7 +1146,7 @@ const C = class C {
|
|
|
1146
1146
|
const o = this.getValidData()[i];
|
|
1147
1147
|
if (!o) return;
|
|
1148
1148
|
const l = o.v[r];
|
|
1149
|
-
l !== s && o.__ng.rowState !==
|
|
1149
|
+
l !== s && o.__ng.rowState !== H.ROW_STATE.INSERT && (o.__ng.o.hasOwnProperty(e) || (o.__ng.o[e] = l), o.__ng.rowState = H.ROW_STATE.UPDATE), o.v[r] = s;
|
|
1150
1150
|
}, "setValue"));
|
|
1151
1151
|
v(this, "resetRecords", /* @__PURE__ */ a(() => {
|
|
1152
1152
|
g(this, ot, t(this, E).rawRecords.filter((i) => !i.__ng.deleted)), g(this, L, t(this, E).rawRecords.filter((i) => !i.__ng.deleted && !i.__ng.filtered)), t(this, E).rawRecords.forEach((i, e) => {
|
|
@@ -1186,15 +1186,15 @@ const C = class C {
|
|
|
1186
1186
|
return this.length;
|
|
1187
1187
|
}
|
|
1188
1188
|
};
|
|
1189
|
-
k = new WeakMap(), E = new WeakMap(), L = new WeakMap(), ot = new WeakMap(), Nt = new WeakMap(), P = new WeakMap(), Pt = new WeakMap(), K = new WeakMap(), xt = new WeakMap(), Vt = new WeakMap(), Yt = new WeakMap(), rt = new WeakMap(), a(
|
|
1190
|
-
v(
|
|
1189
|
+
k = new WeakMap(), E = new WeakMap(), L = new WeakMap(), ot = new WeakMap(), Nt = new WeakMap(), P = new WeakMap(), Pt = new WeakMap(), K = new WeakMap(), xt = new WeakMap(), Vt = new WeakMap(), Yt = new WeakMap(), rt = new WeakMap(), a(H, "ngData"), // π― ν μν μ μ μμλ₯Ό ν΄λμ€ λ΄λΆλ‘ λ΄μ¬ν
|
|
1190
|
+
v(H, "ROW_STATE", {
|
|
1191
1191
|
EMPTY: "EMPTY",
|
|
1192
1192
|
NORMAL: "NORMAL",
|
|
1193
1193
|
INSERT: "INSERT",
|
|
1194
1194
|
UPDATE: "UPDATE",
|
|
1195
1195
|
DELETE: "DELETE"
|
|
1196
1196
|
});
|
|
1197
|
-
let ie =
|
|
1197
|
+
let ie = H;
|
|
1198
1198
|
var Z;
|
|
1199
1199
|
const ue = class ue {
|
|
1200
1200
|
constructor(i) {
|
|
@@ -1236,11 +1236,11 @@ const ge = class ge {
|
|
|
1236
1236
|
}), g(this, A, Array.from(i, ([e, s]) => ({ name: e, type: s }))), g(this, A, t(this, A).filter((e) => e.name !== "" && e.name !== "__ng")), t(this, A).sort((e, s) => e.name.length < s.name.length ? 1 : -1);
|
|
1237
1237
|
}, "#adjust"));
|
|
1238
1238
|
c(this, Xt, /* @__PURE__ */ a(() => {
|
|
1239
|
-
g(this, A, []),
|
|
1239
|
+
g(this, A, []), C.log(t(this, lt).querySelectorAll("table"));
|
|
1240
1240
|
const i = Array.from(t(this, lt).querySelectorAll("table"));
|
|
1241
1241
|
if (!(!i || i.length === 0)) {
|
|
1242
1242
|
for (const e of i)
|
|
1243
|
-
|
|
1243
|
+
C.log(e), $("[data-bind]", e).each((s, n) => {
|
|
1244
1244
|
const r = n.dataset.bind, o = n.getAttribute("data-type") || "string";
|
|
1245
1245
|
r && t(this, A).push({ name: r, type: o });
|
|
1246
1246
|
}), ["data-expr", "background-color", "color", "tooltip", "visible", "readonly", "enable-button", "enable-check", "class-expr", "icon-color", "icon-src"].forEach((s) => {
|
|
@@ -1299,7 +1299,7 @@ const be = class be extends HTMLElement {
|
|
|
1299
1299
|
c(this, G);
|
|
1300
1300
|
c(this, Ut);
|
|
1301
1301
|
c(this, Ft, /* @__PURE__ */ a(() => {
|
|
1302
|
-
this.fields = new ne(this), g(this, Ut, new te(this)),
|
|
1302
|
+
this.fields = new ne(this), g(this, Ut, new te(this)), C.log("NineTable connected."), this.dispatchEvent(new CustomEvent("load", { bubbles: !0, detail: { target: this } }));
|
|
1303
1303
|
}, "#init"));
|
|
1304
1304
|
this.attachShadow({ mode: "open" }), g(this, G, new se(this));
|
|
1305
1305
|
}
|
|
@@ -1307,7 +1307,7 @@ const be = class be extends HTMLElement {
|
|
|
1307
1307
|
t(this, Ft).call(this);
|
|
1308
1308
|
}
|
|
1309
1309
|
disconnectedCallback() {
|
|
1310
|
-
|
|
1310
|
+
C.log("NineTable disconnected.");
|
|
1311
1311
|
}
|
|
1312
1312
|
// π― μΈλΆμμ grid.data.set(...) ννλ‘ μ κ·Όν μ μλλ‘ λ°μ΄ν° λ§€λμ μ€ν
|
|
1313
1313
|
get data() {
|