@ninebone/table 0.0.130 β 0.0.132
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 +181 -172
- package/dist/nine-table.js.map +1 -1
- package/dist/nine-table.umd.js +4 -4
- package/dist/nine-table.umd.js.map +1 -1
- package/package.json +1 -1
package/dist/nine-table.js
CHANGED
|
@@ -2,11 +2,11 @@ var _e = Object.defineProperty;
|
|
|
2
2
|
var Me = (w) => {
|
|
3
3
|
throw TypeError(w);
|
|
4
4
|
};
|
|
5
|
-
var
|
|
5
|
+
var He = (w, i, t) => i in w ? _e(w, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : w[i] = t;
|
|
6
6
|
var c = (w, i) => _e(w, "name", { value: i, configurable: !0 });
|
|
7
|
-
var v = (w, i, t) =>
|
|
8
|
-
var e = (w, i, t) => (Ie(w, i, "read from private field"), t ? t.call(w) : i.get(w)),
|
|
9
|
-
var
|
|
7
|
+
var v = (w, i, t) => He(w, typeof i != "symbol" ? i + "" : i, t), Ie = (w, i, t) => i.has(w) || Me("Cannot " + t);
|
|
8
|
+
var e = (w, i, t) => (Ie(w, i, "read from private field"), t ? t.call(w) : i.get(w)), f = (w, i, t) => i.has(w) ? Me("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(w) : i.set(w, t), p = (w, i, t, s) => (Ie(w, i, "write to private field"), s ? s.call(w, t) : i.set(w, t), t);
|
|
9
|
+
var $e = (w, i, t, s) => ({
|
|
10
10
|
set _(n) {
|
|
11
11
|
p(w, i, n, t);
|
|
12
12
|
},
|
|
@@ -15,37 +15,37 @@ var He = (w, i, t, s) => ({
|
|
|
15
15
|
}
|
|
16
16
|
});
|
|
17
17
|
import { trace as We } from "@ninebone/util";
|
|
18
|
-
const
|
|
18
|
+
const Ee = class Ee extends We.constructor {
|
|
19
19
|
constructor() {
|
|
20
20
|
super(), this.init("nine-table", "green");
|
|
21
21
|
}
|
|
22
22
|
};
|
|
23
|
-
c(
|
|
24
|
-
let ue =
|
|
23
|
+
c(Ee, "Trace");
|
|
24
|
+
let ue = Ee;
|
|
25
25
|
const j = new ue();
|
|
26
|
-
var
|
|
27
|
-
const
|
|
26
|
+
var _, O, y, B, D, N, ee, P, te;
|
|
27
|
+
const Re = class Re extends HTMLElement {
|
|
28
28
|
constructor() {
|
|
29
29
|
super();
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
if (!e(this,
|
|
38
|
-
const t = e(this,
|
|
39
|
-
t && (p(this,
|
|
30
|
+
f(this, _);
|
|
31
|
+
f(this, O, !1);
|
|
32
|
+
f(this, y);
|
|
33
|
+
f(this, B);
|
|
34
|
+
f(this, D);
|
|
35
|
+
f(this, N);
|
|
36
|
+
f(this, ee, /* @__PURE__ */ c(() => {
|
|
37
|
+
if (!e(this, _)) return;
|
|
38
|
+
const t = e(this, _).querySelector(".ng-container-body");
|
|
39
|
+
t && (p(this, N, new ResizeObserver(() => {
|
|
40
40
|
this.refresh();
|
|
41
|
-
})), e(this,
|
|
41
|
+
})), e(this, N).observe(t));
|
|
42
42
|
}, "#observeResize"));
|
|
43
43
|
v(this, "refresh", /* @__PURE__ */ c(() => {
|
|
44
|
-
if (!e(this,
|
|
44
|
+
if (!e(this, _) || !e(this, y) || e(this, O)) return;
|
|
45
45
|
const t = e(this, y).container, s = t.querySelector("table");
|
|
46
46
|
if (!s) return;
|
|
47
|
-
const n = e(this, y).track, o = e(this, y).thumb, r = e(this,
|
|
48
|
-
if (l !== 0 &&
|
|
47
|
+
const n = e(this, y).track, o = e(this, y).thumb, r = e(this, _).querySelector(".ng-container-bottom"), l = t.clientWidth, u = s.scrollWidth;
|
|
48
|
+
if (l !== 0 && u > l)
|
|
49
49
|
r && (r.style.display = "flex");
|
|
50
50
|
else {
|
|
51
51
|
r && (r.style.display = "none");
|
|
@@ -53,7 +53,7 @@ const Ee = class Ee extends HTMLElement {
|
|
|
53
53
|
}
|
|
54
54
|
const a = n.clientWidth;
|
|
55
55
|
if (a <= 0) return;
|
|
56
|
-
const b = Math.max(Math.min(a * (l /
|
|
56
|
+
const b = Math.max(Math.min(a * (l / u), a), 20);
|
|
57
57
|
o.style.width = `${b}px`;
|
|
58
58
|
let h = 0;
|
|
59
59
|
const g = s.style.transform;
|
|
@@ -62,36 +62,36 @@ const Ee = class Ee extends HTMLElement {
|
|
|
62
62
|
x && x[1] && (h = parseFloat(x[1]));
|
|
63
63
|
} else
|
|
64
64
|
h = parseInt(s.style.left || 0, 10);
|
|
65
|
-
let d = parseInt(Math.abs(h) * a /
|
|
65
|
+
let d = parseInt(Math.abs(h) * a / u, 10);
|
|
66
66
|
d < 0 && (d = 0);
|
|
67
67
|
const S = a - b;
|
|
68
68
|
d > S && (d = S), o.style.left = `${d}px`, e(this, y).left.disabled = d === 0, e(this, y).right.disabled = d >= S - 1;
|
|
69
69
|
}, "refresh"));
|
|
70
|
-
|
|
70
|
+
f(this, P, /* @__PURE__ */ c((t) => {
|
|
71
71
|
if (!e(this, y)) return !1;
|
|
72
72
|
const s = e(this, y).container, n = s.querySelector("table");
|
|
73
73
|
if (!n) return !1;
|
|
74
74
|
const o = e(this, y).track.getBoundingClientRect(), r = e(this, y).thumb.clientWidth;
|
|
75
75
|
let l = t;
|
|
76
76
|
l < 0 && (l = 0);
|
|
77
|
-
const
|
|
78
|
-
l >
|
|
77
|
+
const u = o.width - r;
|
|
78
|
+
l > u && (l = u), l = parseInt(l, 10), e(this, y).thumb.style.left = `${l}px`, e(this, y).left.disabled = l === 0, e(this, y).right.disabled = l >= u - 1;
|
|
79
79
|
const a = s.clientWidth, b = n.scrollWidth;
|
|
80
|
-
let h =
|
|
81
|
-
return -h > b - a && (h = -(b - a)), -h + 5 > b - a && (h = -(b - a)), a >= b && (h = 0), n.style.transform = `translateX(${h}px)`, l > 0 && l <
|
|
80
|
+
let h = u > 0 ? -l * (b - a) / u : 0;
|
|
81
|
+
return -h > b - a && (h = -(b - a)), -h + 5 > b - a && (h = -(b - a)), a >= b && (h = 0), n.style.transform = `translateX(${h}px)`, l > 0 && l < u - 1;
|
|
82
82
|
}, "#thumbMoveTo"));
|
|
83
|
-
|
|
83
|
+
f(this, te, /* @__PURE__ */ c(() => {
|
|
84
84
|
const t = /* @__PURE__ */ c((n) => {
|
|
85
|
-
clearInterval(e(this,
|
|
85
|
+
clearInterval(e(this, B)), clearInterval(e(this, D));
|
|
86
86
|
const o = parseInt(e(this, y).thumb.style.left || 0, 10);
|
|
87
|
-
e(this,
|
|
88
|
-
clearInterval(e(this,
|
|
87
|
+
e(this, P).call(this, o + n), p(this, B, setInterval(() => {
|
|
88
|
+
clearInterval(e(this, B)), p(this, D, setInterval(() => {
|
|
89
89
|
const r = parseInt(e(this, y).thumb.style.left || 0, 10);
|
|
90
|
-
e(this,
|
|
90
|
+
e(this, P).call(this, r + n) || clearInterval(e(this, D));
|
|
91
91
|
}, 50));
|
|
92
92
|
}, 500));
|
|
93
93
|
}, "delayScroll"), s = /* @__PURE__ */ c(() => {
|
|
94
|
-
clearInterval(e(this,
|
|
94
|
+
clearInterval(e(this, B)), clearInterval(e(this, D));
|
|
95
95
|
}, "clearTimer");
|
|
96
96
|
["mouseup", "mouseleave", "touchend"].forEach((n) => {
|
|
97
97
|
e(this, y).left.addEventListener(n, s), e(this, y).right.addEventListener(n, s), e(this, y).track.addEventListener(n, s);
|
|
@@ -103,23 +103,23 @@ const Ee = class Ee extends HTMLElement {
|
|
|
103
103
|
if (n.button !== 0) return;
|
|
104
104
|
n.preventDefault();
|
|
105
105
|
const o = e(this, y).track.getBoundingClientRect(), r = e(this, y).thumb.clientWidth;
|
|
106
|
-
e(this,
|
|
106
|
+
e(this, P).call(this, n.clientX - o.left - r / 2);
|
|
107
107
|
}), e(this, y).thumb.addEventListener("mousedown", (n) => {
|
|
108
108
|
if (n.button !== 0) return;
|
|
109
|
-
n.stopPropagation(), n.preventDefault(), p(this,
|
|
109
|
+
n.stopPropagation(), n.preventDefault(), p(this, O, !0), this.shiftX = n.clientX - e(this, y).thumb.getBoundingClientRect().left;
|
|
110
110
|
const o = /* @__PURE__ */ c((l) => {
|
|
111
|
-
if (!e(this,
|
|
112
|
-
const
|
|
113
|
-
e(this,
|
|
111
|
+
if (!e(this, O)) return;
|
|
112
|
+
const u = e(this, y).track.getBoundingClientRect();
|
|
113
|
+
e(this, P).call(this, l.clientX - u.left - this.shiftX);
|
|
114
114
|
}, "onMouseMove"), r = /* @__PURE__ */ c(() => {
|
|
115
|
-
p(this,
|
|
115
|
+
p(this, O, !1), s(), document.removeEventListener("mousemove", o), document.removeEventListener("mouseup", r), this.refresh();
|
|
116
116
|
}, "onMouseUp");
|
|
117
117
|
document.addEventListener("mousemove", o), document.addEventListener("mouseup", r);
|
|
118
118
|
});
|
|
119
119
|
}, "#init"));
|
|
120
120
|
}
|
|
121
121
|
connectedCallback() {
|
|
122
|
-
if (p(this,
|
|
122
|
+
if (p(this, _, this.closest("nine-table-sheet") || this.getRootNode().host), !e(this, _)) return;
|
|
123
123
|
this.innerHTML = `
|
|
124
124
|
<style>
|
|
125
125
|
nine-table-hscrollbar {
|
|
@@ -184,7 +184,7 @@ const Ee = class Ee extends HTMLElement {
|
|
|
184
184
|
<button class='ng-scroll-right' disabled><div class='ng-scroll-icon'></div></button>
|
|
185
185
|
`;
|
|
186
186
|
const t = /* @__PURE__ */ c(() => {
|
|
187
|
-
const s = e(this,
|
|
187
|
+
const s = e(this, _).querySelector(".ng-container-body");
|
|
188
188
|
if (!s) {
|
|
189
189
|
setTimeout(t, 10);
|
|
190
190
|
return;
|
|
@@ -200,26 +200,26 @@ const Ee = class Ee extends HTMLElement {
|
|
|
200
200
|
t();
|
|
201
201
|
}
|
|
202
202
|
disconnectedCallback() {
|
|
203
|
-
e(this,
|
|
203
|
+
e(this, N) && e(this, N).disconnect();
|
|
204
204
|
}
|
|
205
205
|
};
|
|
206
|
-
|
|
207
|
-
let be =
|
|
206
|
+
_ = new WeakMap(), O = new WeakMap(), y = new WeakMap(), B = new WeakMap(), D = new WeakMap(), N = new WeakMap(), ee = new WeakMap(), P = new WeakMap(), te = new WeakMap(), c(Re, "NineTableHScrollBar");
|
|
207
|
+
let be = Re;
|
|
208
208
|
customElements.get("nine-table-hscrollbar") || customElements.define("nine-table-hscrollbar", be);
|
|
209
|
-
var
|
|
209
|
+
var X, M, q, $, I, H, ie;
|
|
210
210
|
const Te = class Te {
|
|
211
211
|
constructor(i) {
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
212
|
+
f(this, X);
|
|
213
|
+
f(this, M, []);
|
|
214
|
+
f(this, q, null);
|
|
215
|
+
f(this, $, null);
|
|
216
|
+
f(this, I, 0);
|
|
217
|
+
f(this, H, 0);
|
|
218
218
|
/**
|
|
219
219
|
* π― λ·°ν¬νΈ ν¬κΈ° λ³ν μμ μ λμ΄ κ³μ° λ° νμν ν κ°μ μ°μ Β·μΊμ±μ μκ²°
|
|
220
220
|
*/
|
|
221
|
-
|
|
222
|
-
!e(this,
|
|
221
|
+
f(this, ie, /* @__PURE__ */ c(() => {
|
|
222
|
+
!e(this, X) || !(e(this, X) instanceof HTMLElement) || (p(this, $, new ResizeObserver((i) => {
|
|
223
223
|
for (const t of i) {
|
|
224
224
|
const s = t.target;
|
|
225
225
|
if (!s.classList.contains("active"))
|
|
@@ -228,93 +228,102 @@ const Te = class Te {
|
|
|
228
228
|
if (n > 0) {
|
|
229
229
|
const o = s.clientHeight || s.getBoundingClientRect().height || n;
|
|
230
230
|
let r = 0;
|
|
231
|
-
const l = s.querySelector(".ng-container-body") || s,
|
|
232
|
-
|
|
231
|
+
const l = s.querySelector(".ng-container-body") || s, u = l.querySelector("thead"), a = l.querySelector("tfoot");
|
|
232
|
+
u && (r += u.offsetHeight || u.getBoundingClientRect().height), a && (r += a.offsetHeight || a.getBoundingClientRect().height);
|
|
233
233
|
const b = Math.max(o - r, 100);
|
|
234
|
-
if (e(this,
|
|
235
|
-
const h = Math.ceil(e(this,
|
|
236
|
-
p(this,
|
|
234
|
+
if (e(this, I) !== b && (p(this, I, b), e(this, q) !== null)) {
|
|
235
|
+
const h = Math.ceil(e(this, I) / e(this, q));
|
|
236
|
+
p(this, H, h + 20), j.log(`[RowManager] Resized. Height: ${e(this, I)}px | Target Rows: ${e(this, H)}`), [".ng-container-body", ".ng-container-left", ".ng-container-right"].forEach((g) => {
|
|
237
237
|
const d = s.querySelector(g);
|
|
238
238
|
d && d.querySelector("tbody") && this.renderRows(d);
|
|
239
239
|
});
|
|
240
240
|
}
|
|
241
241
|
}
|
|
242
242
|
}
|
|
243
|
-
})), e(this, $).observe(e(this,
|
|
243
|
+
})), e(this, $).observe(e(this, X)));
|
|
244
244
|
}, "#initResizeObserver"));
|
|
245
245
|
v(this, "initTemplate", /* @__PURE__ */ c((i) => {
|
|
246
246
|
const t = i.querySelector("tbody.bindable") || i.querySelector("tbody");
|
|
247
247
|
if (!t) return;
|
|
248
248
|
const s = Array.from(t.querySelectorAll("tr")).filter((n) => !n.classList.contains("nodata"));
|
|
249
|
-
p(this,
|
|
249
|
+
p(this, M, s.map((n) => n.cloneNode(!0))), p(this, q, null), console.log(`[RowManager] Template initialized with ${e(this, M).length} row(s).`);
|
|
250
250
|
}, "initTemplate"));
|
|
251
251
|
v(this, "measureAndCacheHeight", /* @__PURE__ */ c((i) => {
|
|
252
252
|
if (e(this, q) !== null)
|
|
253
253
|
return e(this, q);
|
|
254
|
-
if (e(this,
|
|
254
|
+
if (e(this, M).length === 0)
|
|
255
255
|
throw new Error("[RowManager] Template TRs are empty.");
|
|
256
256
|
const t = i.querySelector("tbody.bindable") || i.querySelector("tbody");
|
|
257
257
|
if (!t) return 24;
|
|
258
258
|
t.querySelectorAll("tr:not(.nodata)").forEach((l) => l.remove());
|
|
259
259
|
const s = t.querySelector("tr.nodata"), n = document.createDocumentFragment();
|
|
260
|
-
e(this,
|
|
260
|
+
e(this, M).forEach((l) => {
|
|
261
261
|
n.appendChild(l.cloneNode(!0));
|
|
262
262
|
}), s ? s.before(n) : t.appendChild(n);
|
|
263
263
|
let o = 0;
|
|
264
|
-
if (t.querySelectorAll("tr:not(.nodata)").forEach((l,
|
|
264
|
+
if (t.querySelectorAll("tr:not(.nodata)").forEach((l, u) => {
|
|
265
265
|
const a = l.offsetHeight;
|
|
266
266
|
if (a === 0)
|
|
267
|
-
throw new Error(`[RowManager] Rendered TR[${
|
|
267
|
+
throw new Error(`[RowManager] Rendered TR[${u}] height is 0. Check CSS styles.`);
|
|
268
268
|
o += a;
|
|
269
|
-
}), p(this, q, o), e(this,
|
|
270
|
-
const l = Math.ceil(e(this,
|
|
271
|
-
p(this,
|
|
269
|
+
}), p(this, q, o), e(this, I) > 0) {
|
|
270
|
+
const l = Math.ceil(e(this, I) / e(this, q));
|
|
271
|
+
p(this, H, l + 20);
|
|
272
272
|
}
|
|
273
|
-
return console.log(`[RowManager] Template Height Cached: ${e(this, q)}px | RowCount: ${e(this,
|
|
273
|
+
return console.log(`[RowManager] Template Height Cached: ${e(this, q)}px | RowCount: ${e(this, H)}`), e(this, q);
|
|
274
274
|
}, "measureAndCacheHeight"));
|
|
275
275
|
/**
|
|
276
276
|
* π― μΊμλ ν κ°μ λ°ν (μμ λλ§ μ΅μνμ λ°©μ΄ μ°μ°)
|
|
277
277
|
*/
|
|
278
|
-
|
|
278
|
+
/**
|
|
279
|
+
calculateRequiredRowCount = (container) => {
|
|
280
|
+
if (this.#cachedRowCount > 0) {
|
|
281
|
+
return this.#cachedRowCount;
|
|
282
|
+
}
|
|
283
|
+
|
|
284
|
+
this.measureAndCacheHeight(container);
|
|
285
|
+
return this.#cachedRowCount || 40;
|
|
286
|
+
};
|
|
287
|
+
*/
|
|
279
288
|
/**
|
|
280
289
|
* π― μΊμλ ν κ°μλ₯Ό κ³§λ°λ‘ κ°μ Έμμ TR λΌλ μ£Όμ
(μ€λ³΅ κ³μ° μ κ±°)
|
|
281
290
|
*/
|
|
282
|
-
v(this, "renderRows", /* @__PURE__ */ c((i
|
|
283
|
-
if (e(this,
|
|
284
|
-
const
|
|
285
|
-
if (!
|
|
286
|
-
|
|
287
|
-
const
|
|
288
|
-
for (let
|
|
289
|
-
e(this,
|
|
290
|
-
|
|
291
|
+
v(this, "renderRows", /* @__PURE__ */ c((i) => {
|
|
292
|
+
if (e(this, M).length === 0) return;
|
|
293
|
+
const t = i.querySelector("tbody.bindable") || i.querySelector("tbody");
|
|
294
|
+
if (!t) return;
|
|
295
|
+
t.querySelectorAll("tr:not(.nodata)").forEach((r) => r.remove());
|
|
296
|
+
const s = t.querySelector("tr.nodata"), n = document.createDocumentFragment(), o = e(this, H);
|
|
297
|
+
for (let r = 0; r < o; r++)
|
|
298
|
+
e(this, M).forEach((l) => {
|
|
299
|
+
n.appendChild(l.cloneNode(!0));
|
|
291
300
|
});
|
|
292
|
-
|
|
301
|
+
s ? s.before(n) : t.appendChild(n), console.log(`[RowManager] Rendered ${o} sets into DOM.`);
|
|
293
302
|
}, "renderRows"));
|
|
294
303
|
v(this, "destroy", /* @__PURE__ */ c(() => {
|
|
295
304
|
e(this, $) && (e(this, $).disconnect(), p(this, $, null));
|
|
296
305
|
}, "destroy"));
|
|
297
|
-
p(this,
|
|
306
|
+
p(this, X, i), e(this, ie).call(this);
|
|
298
307
|
}
|
|
299
308
|
get templateLength() {
|
|
300
|
-
return e(this,
|
|
309
|
+
return e(this, M).length || 1;
|
|
301
310
|
}
|
|
302
311
|
};
|
|
303
|
-
|
|
312
|
+
X = new WeakMap(), M = new WeakMap(), q = new WeakMap(), $ = new WeakMap(), I = new WeakMap(), H = new WeakMap(), ie = new WeakMap(), c(Te, "RowManager");
|
|
304
313
|
let ge = Te;
|
|
305
|
-
var
|
|
314
|
+
var A, F, se;
|
|
306
315
|
const Z = class Z extends HTMLElement {
|
|
307
316
|
constructor() {
|
|
308
317
|
super();
|
|
309
|
-
|
|
310
|
-
|
|
318
|
+
f(this, A, null);
|
|
319
|
+
f(this, F);
|
|
311
320
|
v(this, "init", /* @__PURE__ */ c((t) => {
|
|
312
321
|
if (!t) return;
|
|
313
322
|
const s = /* @__PURE__ */ c((a) => {
|
|
314
323
|
const b = /* @__PURE__ */ c((g) => {
|
|
315
324
|
if (g.querySelector("colgroup")) return;
|
|
316
325
|
const d = g.querySelector("tbody tr") || g.querySelector("tr"), S = d ? d.querySelectorAll("th, td").length : 1, x = document.createElement("colgroup"), k = Math.max(Math.floor((g.clientWidth || 600) / S), 100);
|
|
317
|
-
for (let
|
|
326
|
+
for (let R = 0; R < S; R++) {
|
|
318
327
|
const fe = document.createElement("col");
|
|
319
328
|
fe.setAttribute("width", k), x.appendChild(fe);
|
|
320
329
|
}
|
|
@@ -326,40 +335,40 @@ const Z = class Z extends HTMLElement {
|
|
|
326
335
|
}, "ensureThead");
|
|
327
336
|
return b(a), h(a), a.classList.add("nine-table-element"), a;
|
|
328
337
|
}, "initializeTable"), n = t.cloneNode(!0);
|
|
329
|
-
p(this,
|
|
330
|
-
const o = this.querySelector(".ng-container-left"), r = this.querySelector(".ng-container-body"), l = this.querySelector(".ng-container-right"),
|
|
338
|
+
p(this, A, s(n)), e(this, A).style.display = "table", e(this, F).initTemplate(e(this, A));
|
|
339
|
+
const o = this.querySelector(".ng-container-left"), r = this.querySelector(".ng-container-body"), l = this.querySelector(".ng-container-right"), u = /* @__PURE__ */ c((a, b, h = !1) => {
|
|
331
340
|
const g = a.cloneNode(!0), d = Array.from(g.querySelectorAll("colgroup col")), S = [];
|
|
332
341
|
return d.forEach((x, k) => {
|
|
333
|
-
const
|
|
334
|
-
(h ? !
|
|
342
|
+
const R = x.getAttribute("fixed");
|
|
343
|
+
(h ? !R || R === "" : R === b) || S.push(k);
|
|
335
344
|
}), S.reverse().forEach((x) => {
|
|
336
345
|
d[x] && d[x].remove(), g.querySelectorAll("tr").forEach((k) => {
|
|
337
|
-
const
|
|
338
|
-
|
|
346
|
+
const R = k.querySelectorAll("th, td");
|
|
347
|
+
R[x] && R[x].remove();
|
|
339
348
|
});
|
|
340
349
|
}), g;
|
|
341
350
|
}, "filterTableByFixed");
|
|
342
351
|
if (r) {
|
|
343
|
-
const a =
|
|
344
|
-
r.innerHTML = "", r.appendChild(a), e(this,
|
|
352
|
+
const a = u(e(this, A), null, !0);
|
|
353
|
+
r.innerHTML = "", r.appendChild(a), e(this, F).measureAndCacheHeight(r);
|
|
345
354
|
}
|
|
346
355
|
if (o) {
|
|
347
|
-
const a =
|
|
356
|
+
const a = u(e(this, A), "left", !1);
|
|
348
357
|
let b = 0;
|
|
349
358
|
a.querySelectorAll("col").forEach((g) => {
|
|
350
359
|
const d = parseInt(g.getAttribute("width"), 10);
|
|
351
360
|
isNaN(d) || (b += d);
|
|
352
|
-
}), o.innerHTML = "", o.appendChild(a)
|
|
361
|
+
}), o.innerHTML = "", o.appendChild(a);
|
|
353
362
|
const h = b > 0 ? b : 0;
|
|
354
363
|
o.style.flex = `0 0 ${h}px`, o.style.width = `${h}px`;
|
|
355
364
|
}
|
|
356
365
|
if (l) {
|
|
357
|
-
const a =
|
|
366
|
+
const a = u(e(this, A), "right", !1);
|
|
358
367
|
let b = 0;
|
|
359
368
|
a.querySelectorAll("col").forEach((g) => {
|
|
360
369
|
const d = parseInt(g.getAttribute("width"), 10);
|
|
361
370
|
isNaN(d) || (b += d);
|
|
362
|
-
}), l.innerHTML = "", l.appendChild(a)
|
|
371
|
+
}), l.innerHTML = "", l.appendChild(a);
|
|
363
372
|
const h = b > 0 ? b : 0;
|
|
364
373
|
l.style.flex = `0 0 ${h}px`, l.style.width = `${h}px`;
|
|
365
374
|
}
|
|
@@ -375,7 +384,7 @@ const Z = class Z extends HTMLElement {
|
|
|
375
384
|
a && typeof a.refresh == "function" && a.refresh();
|
|
376
385
|
}, 0), j.log(`NineTableSheet 3-split initialized with rows: ${this.getRowCount()}`);
|
|
377
386
|
}, "init"));
|
|
378
|
-
v(this, "getRowCount", /* @__PURE__ */ c(() => e(this,
|
|
387
|
+
v(this, "getRowCount", /* @__PURE__ */ c(() => e(this, A) ? e(this, A).querySelectorAll("tbody tr").length : 0, "getRowCount"));
|
|
379
388
|
v(this, "scrollToX", /* @__PURE__ */ c((t) => {
|
|
380
389
|
const s = this.querySelector(".ng-container-body");
|
|
381
390
|
s && (s.scrollLeft = t);
|
|
@@ -384,7 +393,7 @@ const Z = class Z extends HTMLElement {
|
|
|
384
393
|
const s = this.querySelector(".ng-container-body");
|
|
385
394
|
s && (s.scrollTop = t);
|
|
386
395
|
}, "scrollToY"));
|
|
387
|
-
|
|
396
|
+
f(this, se, /* @__PURE__ */ c(() => {
|
|
388
397
|
const t = Z.SCROLLBAR_SIZE;
|
|
389
398
|
this.innerHTML = `
|
|
390
399
|
<style>
|
|
@@ -501,7 +510,7 @@ const Z = class Z extends HTMLElement {
|
|
|
501
510
|
</div>
|
|
502
511
|
`;
|
|
503
512
|
}, "#render"));
|
|
504
|
-
p(this,
|
|
513
|
+
p(this, F, new ge(this));
|
|
505
514
|
}
|
|
506
515
|
connectedCallback() {
|
|
507
516
|
e(this, se).call(this);
|
|
@@ -510,14 +519,14 @@ const Z = class Z extends HTMLElement {
|
|
|
510
519
|
this.innerHTML = "", j.log("NineTableSheet destroyed.");
|
|
511
520
|
}
|
|
512
521
|
};
|
|
513
|
-
|
|
522
|
+
A = new WeakMap(), F = new WeakMap(), se = new WeakMap(), c(Z, "NineTableSheet"), v(Z, "SCROLLBAR_SIZE", 16);
|
|
514
523
|
let pe = Z;
|
|
515
524
|
customElements.get("nine-table-sheet") || customElements.define("nine-table-sheet", pe);
|
|
516
525
|
var ne;
|
|
517
526
|
const qe = class qe extends HTMLElement {
|
|
518
527
|
constructor() {
|
|
519
528
|
super();
|
|
520
|
-
|
|
529
|
+
f(this, ne, /* @__PURE__ */ c(() => {
|
|
521
530
|
const t = this.querySelector(".nine-tab-bar");
|
|
522
531
|
t && (t.addEventListener("click", (s) => {
|
|
523
532
|
const n = s.target.closest(".nine-tab-item");
|
|
@@ -533,14 +542,14 @@ const qe = class qe extends HTMLElement {
|
|
|
533
542
|
const S = parseInt(d.dataset.splitIndex, 10), x = h.querySelector(`nine-table-sheet[data-index="${S - 1}"]`), k = h.querySelector(`nine-table-sheet[data-index="${S}"]`);
|
|
534
543
|
x && k && x.classList.contains("active") && k.classList.contains("active") ? d.classList.add("active") : d.classList.remove("active");
|
|
535
544
|
});
|
|
536
|
-
}, "updateSplitters"), o = this.querySelector(".nine-tab-bar"), r = this.querySelector("nine-table-sheets-body"), l = o.querySelectorAll(".nine-tab-item"),
|
|
545
|
+
}, "updateSplitters"), o = this.querySelector(".nine-tab-bar"), r = this.querySelector("nine-table-sheets-body"), l = o.querySelectorAll(".nine-tab-item"), u = r.querySelectorAll("nine-table-sheet");
|
|
537
546
|
if (!l[t]) return;
|
|
538
547
|
if (!s)
|
|
539
548
|
l.forEach((h, g) => {
|
|
540
549
|
h.classList.toggle("active", g === t);
|
|
541
550
|
const d = r.querySelector(`nine-table-sheet[data-index="${g}"]`);
|
|
542
551
|
d && (d.style.flex = "");
|
|
543
|
-
}),
|
|
552
|
+
}), u.forEach((h, g) => {
|
|
544
553
|
h.classList.toggle("active", g === t);
|
|
545
554
|
});
|
|
546
555
|
else {
|
|
@@ -576,30 +585,30 @@ const qe = class qe extends HTMLElement {
|
|
|
576
585
|
ne = new WeakMap(), c(qe, "NineTableSheets");
|
|
577
586
|
let ye = qe;
|
|
578
587
|
customElements.get("nine-table-sheets") || customElements.define("nine-table-sheets", ye);
|
|
579
|
-
var
|
|
588
|
+
var L, G, re, J, oe;
|
|
580
589
|
const Ce = class Ce {
|
|
581
590
|
constructor(i) {
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
const i = e(this,
|
|
591
|
+
f(this, L);
|
|
592
|
+
f(this, G, null);
|
|
593
|
+
f(this, re, /* @__PURE__ */ c(() => {
|
|
594
|
+
const i = e(this, L).host;
|
|
586
595
|
i && (p(this, G, new ResizeObserver((t) => {
|
|
587
596
|
for (let s of t)
|
|
588
597
|
i.getAttribute("auto-height") === "true" && e(this, J).call(this, i);
|
|
589
598
|
})), e(this, G).observe(i));
|
|
590
599
|
}, "#observeResize"));
|
|
591
|
-
|
|
592
|
-
var k,
|
|
600
|
+
f(this, J, /* @__PURE__ */ c((i) => {
|
|
601
|
+
var k, R;
|
|
593
602
|
const t = (k = i.shadowRoot) == null ? void 0 : k.querySelector("nine-table-sheet.active");
|
|
594
603
|
if (!t) return;
|
|
595
|
-
const s = ((
|
|
604
|
+
const s = ((R = t.getRowCount) == null ? void 0 : R.call(t)) || 0, n = parseInt(i.getAttribute("max-display-row"), 10) || 10, o = Math.min(s, n), r = t.querySelector("tbody tr") || t.querySelector("tr"), l = r ? r.getBoundingClientRect().height : 32, u = e(this, L).querySelector("nine-table-header"), a = e(this, L).querySelector("nine-table-sheets-footer"), b = u ? u.getBoundingClientRect().height : 40, h = a ? a.getBoundingClientRect().height : 32, d = b + h + 16, S = o * l + d;
|
|
596
605
|
i.style.height = `${S}px`, i.style.maxHeight = `${n * l + d}px`;
|
|
597
|
-
const x = e(this,
|
|
606
|
+
const x = e(this, L).querySelector("nine-table-sheets-body");
|
|
598
607
|
x && (x.style.overflowY = s > n ? "auto" : "hidden");
|
|
599
608
|
}, "#applyAutoHeight"));
|
|
600
|
-
|
|
601
|
-
const i = e(this,
|
|
602
|
-
e(this,
|
|
609
|
+
f(this, oe, /* @__PURE__ */ c(() => {
|
|
610
|
+
const i = e(this, L).host, s = Array.from(i.children).filter((u) => u.tagName === "TABLE"), n = i.getAttribute("auto-height") === "true", o = s.map((u, a) => `<nine-table-sheet class="${a === 0 ? "active" : ""}" data-index="${a}"></nine-table-sheet>`).join(""), r = s.map((u, a) => `<div class="nine-tab-item ${a === 0 ? "active" : ""}" data-index="${a}">Sheet ${a + 1}</div>`).join("");
|
|
611
|
+
e(this, L).innerHTML = `
|
|
603
612
|
<style>
|
|
604
613
|
:host {
|
|
605
614
|
display: flex;
|
|
@@ -697,71 +706,71 @@ const Ce = class Ce {
|
|
|
697
706
|
</nine-table-body>
|
|
698
707
|
<nine-table-footer></nine-table-footer>
|
|
699
708
|
`;
|
|
700
|
-
const l = e(this,
|
|
701
|
-
l == null || l.forEach((
|
|
709
|
+
const l = e(this, L).querySelectorAll("nine-table-sheet");
|
|
710
|
+
l == null || l.forEach((u, a) => {
|
|
702
711
|
s[a] && setTimeout(() => {
|
|
703
|
-
|
|
712
|
+
u.init(s[a]), n && e(this, J).call(this, i);
|
|
704
713
|
});
|
|
705
714
|
});
|
|
706
715
|
}, "#render"));
|
|
707
|
-
p(this,
|
|
716
|
+
p(this, L, i), e(this, oe).call(this), e(this, re).call(this);
|
|
708
717
|
}
|
|
709
718
|
};
|
|
710
|
-
|
|
719
|
+
L = new WeakMap(), G = new WeakMap(), re = new WeakMap(), J = new WeakMap(), oe = new WeakMap(), c(Ce, "LayoutManager");
|
|
711
720
|
let we = Ce;
|
|
712
|
-
var
|
|
721
|
+
var W, V;
|
|
713
722
|
const ke = class ke {
|
|
714
723
|
constructor(i) {
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
v(this, "count", /* @__PURE__ */ c(() => e(this,
|
|
718
|
-
p(this,
|
|
724
|
+
f(this, W);
|
|
725
|
+
f(this, V, -1);
|
|
726
|
+
v(this, "count", /* @__PURE__ */ c(() => e(this, W).rawRecords.length, "count"));
|
|
727
|
+
p(this, W, i);
|
|
719
728
|
}
|
|
720
729
|
get at() {
|
|
721
|
-
return e(this,
|
|
730
|
+
return e(this, V);
|
|
722
731
|
}
|
|
723
732
|
set at(i) {
|
|
724
733
|
var s, n;
|
|
725
|
-
p(this,
|
|
726
|
-
const t = ((n = (s = e(this,
|
|
727
|
-
t && !t.querySelector(`tbody.bindable tr[data-row="${e(this,
|
|
734
|
+
p(this, V, parseInt(i, 10));
|
|
735
|
+
const t = ((n = (s = e(this, W).owner).querySelector) == null ? void 0 : n.call(s, ".ng-container-body")) || e(this, W).owner.body;
|
|
736
|
+
t && !t.querySelector(`tbody.bindable tr[data-row="${e(this, V)}"]`) && setTimeout(() => {
|
|
728
737
|
var o, r;
|
|
729
|
-
(r = (o = e(this,
|
|
738
|
+
(r = (o = e(this, W).owner).scrollTo_V1) == null || r.call(o, e(this, V));
|
|
730
739
|
});
|
|
731
740
|
}
|
|
732
741
|
};
|
|
733
|
-
|
|
742
|
+
W = new WeakMap(), V = new WeakMap(), c(ke, "ngRow");
|
|
734
743
|
let me = ke;
|
|
735
|
-
var
|
|
744
|
+
var E, m, C, U, le, z, ae, Q, ce, he, K;
|
|
736
745
|
const T = class T {
|
|
737
746
|
constructor(i, t) {
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
p(this,
|
|
746
|
-
const i = e(this,
|
|
747
|
+
f(this, E);
|
|
748
|
+
f(this, m);
|
|
749
|
+
f(this, C, []);
|
|
750
|
+
f(this, U, []);
|
|
751
|
+
f(this, le, 0);
|
|
752
|
+
f(this, z, []);
|
|
753
|
+
f(this, ae, /* @__PURE__ */ c(() => {
|
|
754
|
+
p(this, z, []);
|
|
755
|
+
const i = e(this, E).template || [];
|
|
747
756
|
Array.from(i).forEach((t) => {
|
|
748
757
|
var s;
|
|
749
|
-
e(this,
|
|
758
|
+
e(this, z).push(((s = t.getBoundingClientRect) == null ? void 0 : s.call(t).height) || 24);
|
|
750
759
|
}), (e(this, m).rawRecords || []).forEach((t) => {
|
|
751
|
-
t.__ng || (t.__ng = e(this, Q).call(this)), t.__ng.height = e(this,
|
|
760
|
+
t.__ng || (t.__ng = e(this, Q).call(this)), t.__ng.height = e(this, z).slice();
|
|
752
761
|
});
|
|
753
762
|
}, "#initialize"));
|
|
754
763
|
v(this, "set", /* @__PURE__ */ c((i) => {
|
|
755
764
|
this.clear(), this.add(i, !1);
|
|
756
765
|
}, "set"));
|
|
757
|
-
|
|
766
|
+
f(this, Q, /* @__PURE__ */ c(() => ({
|
|
758
767
|
rowState: T.ROW_STATE.EMPTY,
|
|
759
768
|
deleted: !1,
|
|
760
769
|
filtered: !1,
|
|
761
|
-
height: e(this,
|
|
770
|
+
height: e(this, z).slice(),
|
|
762
771
|
o: {},
|
|
763
772
|
c: {},
|
|
764
|
-
_: [0, 0, 0, 0, T.ROW_STATE.EMPTY, !1, !1, !0, !1, !0, !0, !1, e(this,
|
|
773
|
+
_: [0, 0, 0, 0, T.ROW_STATE.EMPTY, !1, !1, !0, !1, !0, !0, !1, e(this, z).slice(), -1, {}, {}]
|
|
765
774
|
}), "#getDefaultMeta"));
|
|
766
775
|
v(this, "reset", /* @__PURE__ */ c(() => {
|
|
767
776
|
p(this, C, []), p(this, U, []);
|
|
@@ -770,10 +779,10 @@ const T = class T {
|
|
|
770
779
|
var i;
|
|
771
780
|
e(this, m).rawRecords = [], p(this, C, []), p(this, U, []), (i = e(this, m).viewRecords) != null && i.reset && e(this, m).viewRecords.reset();
|
|
772
781
|
}, "clear"));
|
|
773
|
-
|
|
782
|
+
f(this, ce, /* @__PURE__ */ c((i) => {
|
|
774
783
|
var n;
|
|
775
784
|
Array.isArray(i) || (i = [i]);
|
|
776
|
-
const t = typeof ((n = e(this,
|
|
785
|
+
const t = typeof ((n = e(this, E).fields) == null ? void 0 : n.get) == "function" ? e(this, E).fields.get() : Object.keys(i[0] || {}), s = [];
|
|
777
786
|
return i.forEach((o) => {
|
|
778
787
|
const r = { v: [] };
|
|
779
788
|
t.forEach((l) => {
|
|
@@ -781,7 +790,7 @@ const T = class T {
|
|
|
781
790
|
}), s.push(r);
|
|
782
791
|
}), s;
|
|
783
792
|
}, "#json2Array"));
|
|
784
|
-
|
|
793
|
+
f(this, he, /* @__PURE__ */ c((i) => (Array.isArray(i) || (i = [i]), i.forEach((t) => {
|
|
785
794
|
t.__ng = e(this, Q).call(this), t.__ng.rowid = this.nextId, t.__ng.rowState = T.ROW_STATE.INSERT, t.__ng._[0] = t.__ng.rowid;
|
|
786
795
|
}), i), "#defaultInsert"));
|
|
787
796
|
v(this, "add", /* @__PURE__ */ c((i, t = !0) => {
|
|
@@ -791,8 +800,8 @@ const T = class T {
|
|
|
791
800
|
e(this, m).rawRecords = e(this, m).rawRecords.concat(e(this, he).call(this, s)), this.resetRecords();
|
|
792
801
|
const n = this.count() - 1;
|
|
793
802
|
return t || s.forEach((r, l) => {
|
|
794
|
-
const
|
|
795
|
-
|
|
803
|
+
const u = e(this, m).rawRecords[n - l];
|
|
804
|
+
u && (u.__ng.rowState = T.ROW_STATE.EMPTY);
|
|
796
805
|
}), (o = e(this, m).viewRecords) != null && o.reset && e(this, m).viewRecords.reset(), n;
|
|
797
806
|
}, "add"));
|
|
798
807
|
v(this, "delete", /* @__PURE__ */ c((i) => {
|
|
@@ -808,9 +817,9 @@ const T = class T {
|
|
|
808
817
|
}), this.resetRecords(), (s = e(this, m).viewRecords) != null && s.reset && e(this, m).viewRecords.reset();
|
|
809
818
|
}, "delete"));
|
|
810
819
|
v(this, "setValue", /* @__PURE__ */ c((i, t, s) => {
|
|
811
|
-
var
|
|
820
|
+
var u;
|
|
812
821
|
i = parseInt(i, 10);
|
|
813
|
-
const o = (typeof ((
|
|
822
|
+
const o = (typeof ((u = e(this, E).fields) == null ? void 0 : u.get) == "function" ? e(this, E).fields.get() : []).indexOf(t);
|
|
814
823
|
if (o < 0) return;
|
|
815
824
|
const r = this.getValidData()[i];
|
|
816
825
|
if (!r) return;
|
|
@@ -825,10 +834,10 @@ const T = class T {
|
|
|
825
834
|
});
|
|
826
835
|
}, "resetRecords"));
|
|
827
836
|
v(this, "getValidData", /* @__PURE__ */ c(() => (e(this, C).length === 0 && e(this, m).rawRecords.length > 0 && this.resetRecords(), e(this, C)), "getValidData"));
|
|
828
|
-
|
|
837
|
+
f(this, K, /* @__PURE__ */ c((i) => {
|
|
829
838
|
var s;
|
|
830
839
|
if (!i) return i;
|
|
831
|
-
const t = typeof ((s = e(this,
|
|
840
|
+
const t = typeof ((s = e(this, E).fields) == null ? void 0 : s.get) == "function" ? e(this, E).fields.get() : [];
|
|
832
841
|
return Array.isArray(i) ? i.filter((n) => !n.__ng.deleted).map((n) => {
|
|
833
842
|
const o = {};
|
|
834
843
|
return t.forEach((r, l) => {
|
|
@@ -843,14 +852,14 @@ const T = class T {
|
|
|
843
852
|
if (!s || s.length <= 0) return;
|
|
844
853
|
if (i == null) return e(this, K).call(this, s);
|
|
845
854
|
if (i < 0 || i >= s.length) return null;
|
|
846
|
-
const n = typeof ((o = e(this,
|
|
855
|
+
const n = typeof ((o = e(this, E).fields) == null ? void 0 : o.get) == "function" ? e(this, E).fields.get() : [];
|
|
847
856
|
if (t != null) {
|
|
848
857
|
const r = n.indexOf(t);
|
|
849
858
|
return r >= 0 ? s[i].v[r] : null;
|
|
850
859
|
}
|
|
851
860
|
return e(this, K).call(this, s[i]);
|
|
852
861
|
}, "get"));
|
|
853
|
-
p(this,
|
|
862
|
+
p(this, E, i), p(this, m, t), e(this, ae).call(this);
|
|
854
863
|
}
|
|
855
864
|
get source() {
|
|
856
865
|
return e(this, K).call(this, e(this, m).rawRecords);
|
|
@@ -859,10 +868,10 @@ const T = class T {
|
|
|
859
868
|
this.clear(), this.add(i, !1);
|
|
860
869
|
}
|
|
861
870
|
get nextId() {
|
|
862
|
-
return
|
|
871
|
+
return ++$e(this, le)._;
|
|
863
872
|
}
|
|
864
873
|
};
|
|
865
|
-
|
|
874
|
+
E = new WeakMap(), m = new WeakMap(), C = new WeakMap(), U = new WeakMap(), le = new WeakMap(), z = new WeakMap(), ae = new WeakMap(), Q = new WeakMap(), ce = new WeakMap(), he = new WeakMap(), K = new WeakMap(), c(T, "ngData"), // π― ν μν μ μ μμλ₯Ό ν΄λμ€ λ΄λΆλ‘ λ΄μ¬ν
|
|
866
875
|
v(T, "ROW_STATE", {
|
|
867
876
|
EMPTY: "EMPTY",
|
|
868
877
|
NORMAL: "NORMAL",
|
|
@@ -892,14 +901,14 @@ const Ae = class Ae {
|
|
|
892
901
|
};
|
|
893
902
|
c(Ae, "ngDataManager");
|
|
894
903
|
let xe = Ae;
|
|
895
|
-
var
|
|
904
|
+
var Y, de;
|
|
896
905
|
const Le = class Le extends HTMLElement {
|
|
897
906
|
constructor() {
|
|
898
907
|
super();
|
|
899
908
|
//#created = false;
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
this.attachShadow({ mode: "open" }), p(this,
|
|
909
|
+
f(this, Y);
|
|
910
|
+
f(this, de);
|
|
911
|
+
this.attachShadow({ mode: "open" }), p(this, Y, new xe(this));
|
|
903
912
|
}
|
|
904
913
|
connectedCallback() {
|
|
905
914
|
p(this, de, new we(this.shadowRoot)), j.log("NineTable connected."), this.dispatchEvent(new CustomEvent("load", { bubbles: !0, detail: { target: this } }));
|
|
@@ -909,18 +918,18 @@ const Le = class Le extends HTMLElement {
|
|
|
909
918
|
}
|
|
910
919
|
// π― μΈλΆμμ grid.data.set(...) ννλ‘ μ κ·Όν μ μλλ‘ λ°μ΄ν° λ§€λμ μ€ν
|
|
911
920
|
get data() {
|
|
912
|
-
return e(this,
|
|
921
|
+
return e(this, Y).data;
|
|
913
922
|
}
|
|
914
923
|
// π― ν(row) κ΄λ ¨ μ μ΄ μ κ·Όμ μ€ν
|
|
915
924
|
get row() {
|
|
916
|
-
return e(this,
|
|
925
|
+
return e(this, Y).row;
|
|
917
926
|
}
|
|
918
927
|
// π― μ 체 λ°μ΄ν° λ§€λμ μ κ·Ό νμν κ²½μ°
|
|
919
928
|
get dataManager() {
|
|
920
|
-
return e(this,
|
|
929
|
+
return e(this, Y);
|
|
921
930
|
}
|
|
922
931
|
};
|
|
923
|
-
|
|
932
|
+
Y = new WeakMap(), de = new WeakMap(), c(Le, "NineTable");
|
|
924
933
|
let Se = Le;
|
|
925
934
|
customElements.get("nine-table") || customElements.define("nine-table", Se);
|
|
926
935
|
//# sourceMappingURL=nine-table.js.map
|