@ninebone/table 0.0.632 β 0.0.633
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 +33 -31
- package/dist/nine-table.js.map +1 -1
- package/dist/nine-table.umd.js +6 -6
- 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 He = class He extends Ke.constructor {
|
|
|
22
22
|
};
|
|
23
23
|
c(He, "Trace");
|
|
24
24
|
let oe = He;
|
|
25
|
-
const
|
|
25
|
+
const H = new oe();
|
|
26
26
|
var B, j, w, X, K, Z, It, G, _t;
|
|
27
27
|
const Me = class Me extends HTMLElement {
|
|
28
28
|
constructor() {
|
|
@@ -230,7 +230,7 @@ const $e = class $e extends HTMLElement {
|
|
|
230
230
|
m < 0 && (m = 0), m > x && (m = x), r.style.top = `${m}px`, t(this, T).top.disabled = b <= 0, t(this, T).bottom.disabled = b >= g - 1;
|
|
231
231
|
}, "refresh"));
|
|
232
232
|
d(this, Nt, /* @__PURE__ */ c(() => {
|
|
233
|
-
|
|
233
|
+
H.log("nine-table-vscrollbar.#init");
|
|
234
234
|
const e = t(this, T).container, s = /* @__PURE__ */ c(() => {
|
|
235
235
|
const n = (t(this, F).data.get() || []).length, o = t(this, at).getRowHeight();
|
|
236
236
|
return n * o;
|
|
@@ -371,12 +371,12 @@ const Ie = class Ie {
|
|
|
371
371
|
d(this, Wt, 3);
|
|
372
372
|
A(this, "refresh", /* @__PURE__ */ c(() => {
|
|
373
373
|
var e;
|
|
374
|
-
|
|
374
|
+
H.log("rowManager.refresh");
|
|
375
375
|
const i = t(this, S).querySelector(".ng-container-body .ng-part-body");
|
|
376
376
|
i && (t(this, St).call(this), t(this, lt).call(this, i.scrollTop), (e = t(this, S).querySelector("nine-table-vscrollbar")) == null || e.refresh());
|
|
377
377
|
}, "refresh"));
|
|
378
378
|
A(this, "initialize", /* @__PURE__ */ c(() => {
|
|
379
|
-
|
|
379
|
+
H.log("rowManager.initialize"), y(this, Q, {
|
|
380
380
|
scrollTables: t(this, S).querySelectorAll(".ng-part-body table"),
|
|
381
381
|
firstTr: t(this, S).querySelector(".ng-container-body .ng-part-body tbody.bindable-tbody tr:not(.nodata)")
|
|
382
382
|
}), y(this, _, null), t(this, D).clear(), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((o) => {
|
|
@@ -407,7 +407,7 @@ const Ie = class Ie {
|
|
|
407
407
|
}
|
|
408
408
|
}, "initialize"));
|
|
409
409
|
d(this, Ot, /* @__PURE__ */ c((i, e) => {
|
|
410
|
-
|
|
410
|
+
H.log("rowManager.#renderRows");
|
|
411
411
|
const s = t(this, D).get(e);
|
|
412
412
|
if (!s || s.length === 0) return;
|
|
413
413
|
const r = i.querySelector(".ng-part-body tbody.bindable-tbody");
|
|
@@ -421,13 +421,13 @@ const Ie = class Ie {
|
|
|
421
421
|
n ? n.before(o) : r.appendChild(o), e === ".ng-container-body" && (t(this, Q).firstTr = r.querySelector("tr:not(.nodata)"));
|
|
422
422
|
}, "#renderRows"));
|
|
423
423
|
d(this, zt, /* @__PURE__ */ c((i) => {
|
|
424
|
-
if (
|
|
424
|
+
if (H.log("rowManager.#measureAndCacheHeight"), t(this, _) !== null && t(this, _) > 0)
|
|
425
425
|
return t(this, _);
|
|
426
|
-
|
|
426
|
+
H.log("#measureAndCacheHeight");
|
|
427
427
|
const e = t(this, D).get(".ng-container-body");
|
|
428
428
|
if (!e || e.length === 0) throw new Error("invalid dom");
|
|
429
429
|
const s = i.querySelector("tbody.bindable-tbody");
|
|
430
|
-
if (
|
|
430
|
+
if (H.log(s), !s) throw new Error("invalid dom");
|
|
431
431
|
s.querySelectorAll("tr:not(.nodata)").forEach((b) => b.remove());
|
|
432
432
|
const r = s.querySelector("tr.nodata"), n = document.createDocumentFragment();
|
|
433
433
|
e.forEach((b) => {
|
|
@@ -448,9 +448,9 @@ const Ie = class Ie {
|
|
|
448
448
|
return y(this, _, f), t(this, Et).call(this), t(this, _);
|
|
449
449
|
}, "#measureAndCacheHeight"));
|
|
450
450
|
d(this, St, /* @__PURE__ */ c(() => {
|
|
451
|
-
|
|
451
|
+
H.log("rowManager.#updateVirtualScrollHeight");
|
|
452
452
|
const e = (t(this, P).data.get() || []).length, s = t(this, _), r = e * s;
|
|
453
|
-
|
|
453
|
+
H.log("π [VirtualHeight]", { totalCount: e, rowHeight: s, totalVirtualHeight: r }), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((n) => {
|
|
454
454
|
const o = t(this, S).querySelector(n);
|
|
455
455
|
if (!o) return;
|
|
456
456
|
const a = o.querySelector(".ng-part-body .ng-virtual-spacer");
|
|
@@ -507,7 +507,7 @@ const Ie = class Ie {
|
|
|
507
507
|
})), t(this, V).observe(t(this, S)));
|
|
508
508
|
}, "#initResizeObserver"));
|
|
509
509
|
d(this, At, /* @__PURE__ */ c(() => {
|
|
510
|
-
|
|
510
|
+
H.log("rowManager.#renderAllContainers"), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((i) => {
|
|
511
511
|
const e = t(this, S).querySelector(i);
|
|
512
512
|
e && e.querySelector(".ng-part-body tbody.bindable-tbody") && t(this, Ot).call(this, e, i);
|
|
513
513
|
}), t(this, Pt).call(this), t(this, Bt).call(this);
|
|
@@ -537,7 +537,9 @@ const Ie = class Ie {
|
|
|
537
537
|
if (!e || e <= 0) return;
|
|
538
538
|
const s = t(this, P).data.length;
|
|
539
539
|
if (s === 0) return;
|
|
540
|
-
const r = ((f = t(this, D).get(".ng-container-body")) == null ? void 0 : f.length) || 1, n = Math.max(0, s - 1), o = Math.min(n, Math.max(0, Math.floor(i / e))), a = Math.floor(o * e)
|
|
540
|
+
const r = ((f = t(this, D).get(".ng-container-body")) == null ? void 0 : f.length) || 1, n = Math.max(0, s - 1), o = Math.min(n, Math.max(0, Math.floor(i / e))), a = Math.floor(o * e);
|
|
541
|
+
H.log(`π [Scroll Inspect] scrollTop: ${i}, rowHeight: ${e}, startIndex: ${o}, offsetY: ${a}`);
|
|
542
|
+
const h = t(this, Q).firstTr, l = h && h.dataset.row !== void 0 ? parseInt(h.dataset.row, 10) : -1;
|
|
541
543
|
(u = t(this, Q)) == null || u.scrollTables.forEach((b) => {
|
|
542
544
|
b.style.transform = `translate3d(0, ${a}px, 0)`;
|
|
543
545
|
}), l !== o && [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((b) => {
|
|
@@ -579,7 +581,7 @@ const Ie = class Ie {
|
|
|
579
581
|
}, "#bindRowData"));
|
|
580
582
|
d(this, Pt, /* @__PURE__ */ c(() => {
|
|
581
583
|
var h, l, f;
|
|
582
|
-
|
|
584
|
+
H.log("rowManager.#syncHeaderHeights");
|
|
583
585
|
const i = t(this, S).querySelector(".ng-container-left .ng-part-header table"), e = t(this, S).querySelector(".ng-container-body .ng-part-header table"), s = t(this, S).querySelector(".ng-container-right .ng-part-header table");
|
|
584
586
|
if (!e) return;
|
|
585
587
|
const r = i ? Array.from(i.querySelectorAll("tr")) : [], n = Array.from(e.querySelectorAll("tr")), o = s ? Array.from(s.querySelectorAll("tr")) : [], a = Math.max(r.length, n.length, o.length);
|
|
@@ -949,7 +951,7 @@ const pt = class pt extends HTMLElement {
|
|
|
949
951
|
t(this, Ut).call(this);
|
|
950
952
|
}
|
|
951
953
|
disconnectedCallback() {
|
|
952
|
-
this.innerHTML = "",
|
|
954
|
+
this.innerHTML = "", H.log("NineTableSheet destroyed.");
|
|
953
955
|
}
|
|
954
956
|
};
|
|
955
957
|
Ft = new WeakMap(), et = new WeakMap(), st = new WeakMap(), Vt = new WeakMap(), Yt = new WeakMap(), ct = new WeakMap(), Ut = new WeakMap(), Xt = new WeakMap(), c(pt, "NineTableSheet"), A(pt, "SCROLLBAR_SIZE", 16);
|
|
@@ -1006,29 +1008,29 @@ const _e = class _e extends HTMLElement {
|
|
|
1006
1008
|
Kt = new WeakMap(), Rt = new WeakMap(), c(_e, "NineTableSheets");
|
|
1007
1009
|
let de = _e;
|
|
1008
1010
|
customElements.get("nine-table-sheets") || customElements.define("nine-table-sheets", de);
|
|
1009
|
-
var
|
|
1011
|
+
var M, Zt, Tt, Gt;
|
|
1010
1012
|
const Ne = class Ne {
|
|
1011
1013
|
constructor(i) {
|
|
1012
|
-
d(this,
|
|
1014
|
+
d(this, M);
|
|
1013
1015
|
d(this, Zt, /* @__PURE__ */ c(() => {
|
|
1014
1016
|
t(this, Gt).call(this), new ResizeObserver((i) => {
|
|
1015
1017
|
for (let e of i)
|
|
1016
|
-
t(this,
|
|
1017
|
-
}).observe(t(this,
|
|
1018
|
+
t(this, M).getAttribute("auto-height") === "true" && t(this, Tt).call(this);
|
|
1019
|
+
}).observe(t(this, M));
|
|
1018
1020
|
}, "#init"));
|
|
1019
1021
|
d(this, Tt, /* @__PURE__ */ c(() => {
|
|
1020
1022
|
var h, l;
|
|
1021
|
-
const i = Array.from(t(this,
|
|
1023
|
+
const i = Array.from(t(this, M).shadowRoot.querySelectorAll("nine-table-sheet.active"));
|
|
1022
1024
|
if (i.length === 0) return;
|
|
1023
|
-
const e = parseInt(t(this,
|
|
1024
|
-
t(this,
|
|
1025
|
+
const e = parseInt(t(this, M).getAttribute("max-display-row"), 10) || 10, s = Math.max(...i.map((f) => f.getRowHeight())), r = (h = t(this, M).shadowRoot.querySelector("nine-table-header")) == null ? void 0 : h.getBoundingClientRect().height, n = (l = t(this, M).shadowRoot.querySelector("nine-table-sheets-footer")) == null ? void 0 : l.getBoundingClientRect().height, o = $t.SCROLLBAR_SIZE, a = e * s + r + n + o;
|
|
1026
|
+
t(this, M).style.height = `${a}px`;
|
|
1025
1027
|
}, "#applyAutoHeight"));
|
|
1026
1028
|
d(this, Gt, /* @__PURE__ */ c(() => {
|
|
1027
|
-
const e = Array.from(t(this,
|
|
1029
|
+
const e = Array.from(t(this, M).children).filter((h) => h.tagName === "TABLE"), s = t(this, M).getAttribute("auto-height") === "true", r = e.length, n = e.map((h, l) => {
|
|
1028
1030
|
const u = `<nine-table-sheet class="${l === 0 ? "active" : ""}" data-index="${l}"></nine-table-sheet>`, b = l < r - 1 ? `<nine-splitter class="h" data-split-index="${l}"></nine-splitter>` : "";
|
|
1029
1031
|
return u + b;
|
|
1030
1032
|
}).join(""), o = e.map((h, l) => `<div class="nine-tab-item ${l === 0 ? "active" : ""}" data-index="${l}">Sheet ${l + 1}</div>`).join("");
|
|
1031
|
-
t(this,
|
|
1033
|
+
t(this, M).shadowRoot.innerHTML = `
|
|
1032
1034
|
<style>
|
|
1033
1035
|
:host {
|
|
1034
1036
|
display: flex;
|
|
@@ -1148,18 +1150,18 @@ const Ne = class Ne {
|
|
|
1148
1150
|
<nine-table-analysis></nine-table-analysis>
|
|
1149
1151
|
</nine-table-body>
|
|
1150
1152
|
<nine-table-footer></nine-table-footer>
|
|
1151
|
-
`, t(this,
|
|
1152
|
-
const a = t(this,
|
|
1153
|
+
`, t(this, M).shadowRoot.querySelector("nine-table-sheets").classList.add("nodata");
|
|
1154
|
+
const a = t(this, M).shadowRoot.querySelectorAll("nine-table-sheet");
|
|
1153
1155
|
a == null || a.forEach((h, l) => {
|
|
1154
1156
|
e[l] && setTimeout(() => {
|
|
1155
1157
|
h.generate(e[l]), s && t(this, Tt).call(this);
|
|
1156
1158
|
});
|
|
1157
1159
|
});
|
|
1158
1160
|
}, "#render"));
|
|
1159
|
-
y(this,
|
|
1161
|
+
y(this, M, i), t(this, Zt).call(this);
|
|
1160
1162
|
}
|
|
1161
1163
|
};
|
|
1162
|
-
|
|
1164
|
+
M = new WeakMap(), Zt = new WeakMap(), Tt = new WeakMap(), Gt = new WeakMap(), c(Ne, "LayoutManager");
|
|
1163
1165
|
let fe = Ne;
|
|
1164
1166
|
var kt, ht;
|
|
1165
1167
|
const We = class We {
|
|
@@ -1372,11 +1374,11 @@ const ze = class ze {
|
|
|
1372
1374
|
}), y(this, L, Array.from(i, ([e, s]) => ({ name: e, type: s }))), y(this, L, t(this, L).filter((e) => e.name !== "" && e.name !== "__ng")), t(this, L).sort((e, s) => e.name.length < s.name.length ? 1 : -1);
|
|
1373
1375
|
}, "#adjust"));
|
|
1374
1376
|
d(this, se, /* @__PURE__ */ c(() => {
|
|
1375
|
-
y(this, L, []),
|
|
1377
|
+
y(this, L, []), H.log(t(this, ut).querySelectorAll("table"));
|
|
1376
1378
|
const i = Array.from(t(this, ut).querySelectorAll("table"));
|
|
1377
1379
|
if (!(!i || i.length === 0)) {
|
|
1378
1380
|
for (const e of i)
|
|
1379
|
-
|
|
1381
|
+
H.log(e), $("[data-bind]", e).each((s, r) => {
|
|
1380
1382
|
const n = r.dataset.bind, o = r.getAttribute("data-type") || "string";
|
|
1381
1383
|
n && t(this, L).push({ name: n, type: o });
|
|
1382
1384
|
}), ["data-expr", "background-color", "color", "tooltip", "visible", "readonly", "enable-button", "enable-check", "class-expr", "icon-color", "icon-src"].forEach((s) => {
|
|
@@ -1435,7 +1437,7 @@ const Be = class Be extends HTMLElement {
|
|
|
1435
1437
|
d(this, nt);
|
|
1436
1438
|
d(this, ie);
|
|
1437
1439
|
d(this, re, /* @__PURE__ */ c(() => {
|
|
1438
|
-
this.fields = new ye(this), y(this, ie, new fe(this)),
|
|
1440
|
+
this.fields = new ye(this), y(this, ie, new fe(this)), H.log("NineTable connected."), this.dispatchEvent(new CustomEvent("load", { bubbles: !0, detail: { target: this } }));
|
|
1439
1441
|
}, "#init"));
|
|
1440
1442
|
this.attachShadow({ mode: "open" }), y(this, nt, new be(this));
|
|
1441
1443
|
}
|
|
@@ -1443,7 +1445,7 @@ const Be = class Be extends HTMLElement {
|
|
|
1443
1445
|
t(this, re).call(this);
|
|
1444
1446
|
}
|
|
1445
1447
|
disconnectedCallback() {
|
|
1446
|
-
|
|
1448
|
+
H.log("NineTable disconnected.");
|
|
1447
1449
|
}
|
|
1448
1450
|
// π― μΈλΆμμ grid.data.set(...) ννλ‘ μ κ·Όν μ μλλ‘ λ°μ΄ν° λ§€λμ μ€ν
|
|
1449
1451
|
get data() {
|