@ninebone/table 0.0.54 → 0.0.55
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 +131 -134
- package/dist/nine-table.js.map +1 -1
- package/dist/nine-table.umd.js +5 -7
- package/dist/nine-table.umd.js.map +1 -1
- package/package.json +1 -1
package/dist/nine-table.js
CHANGED
|
@@ -2,72 +2,72 @@ var K = Object.defineProperty;
|
|
|
2
2
|
var D = (i) => {
|
|
3
3
|
throw TypeError(i);
|
|
4
4
|
};
|
|
5
|
-
var G = (i,
|
|
6
|
-
var d = (i,
|
|
7
|
-
var
|
|
8
|
-
var
|
|
5
|
+
var G = (i, t, e) => t in i ? K(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e;
|
|
6
|
+
var d = (i, t) => K(i, "name", { value: t, configurable: !0 });
|
|
7
|
+
var k = (i, t, e) => G(i, typeof t != "symbol" ? t + "" : t, e), F = (i, t, e) => t.has(i) || D("Cannot " + e);
|
|
8
|
+
var b = (i, t, e) => (F(i, t, "read from private field"), e ? e.call(i) : t.get(i)), y = (i, t, e) => t.has(i) ? D("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(i) : t.set(i, e), q = (i, t, e, u) => (F(i, t, "write to private field"), u ? u.call(i, e) : t.set(i, e), e);
|
|
9
9
|
import { trace as J } from "@ninebone/util";
|
|
10
|
-
const
|
|
10
|
+
const I = class I extends J.constructor {
|
|
11
11
|
constructor() {
|
|
12
12
|
super(), this.init("nine-table", "green");
|
|
13
13
|
}
|
|
14
14
|
};
|
|
15
|
-
d(
|
|
16
|
-
let
|
|
17
|
-
const
|
|
18
|
-
var
|
|
19
|
-
const
|
|
15
|
+
d(I, "Trace");
|
|
16
|
+
let $ = I;
|
|
17
|
+
const E = new $();
|
|
18
|
+
var p, A;
|
|
19
|
+
const N = class N extends HTMLElement {
|
|
20
20
|
constructor() {
|
|
21
21
|
super();
|
|
22
|
-
|
|
23
|
-
|
|
22
|
+
y(this, p, null);
|
|
23
|
+
k(this, "init", /* @__PURE__ */ d((e) => {
|
|
24
24
|
if (!e) return;
|
|
25
|
-
const
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
25
|
+
const u = /* @__PURE__ */ d((l) => {
|
|
26
|
+
const s = /* @__PURE__ */ d((n) => {
|
|
27
|
+
if (n.querySelector("colgroup")) return;
|
|
28
|
+
const a = n.querySelector("tbody tr") || n.querySelector("tr"), c = a ? a.querySelectorAll("th, td").length : 1, m = document.createElement("colgroup"), S = Math.max(Math.floor((n.clientWidth || 600) / c), 100);
|
|
29
|
+
for (let v = 0; v < c; v++) {
|
|
30
|
+
const j = document.createElement("col");
|
|
31
|
+
j.setAttribute("width", S), m.appendChild(j);
|
|
32
|
+
}
|
|
33
|
+
n.prepend(m);
|
|
34
|
+
}, "ensureColgroup"), h = /* @__PURE__ */ d((n) => {
|
|
35
|
+
if (n.querySelector("thead")) return;
|
|
36
|
+
const a = document.createElement("thead"), c = n.querySelector("colgroup");
|
|
37
|
+
c ? c.after(a) : n.prepend(a);
|
|
38
|
+
}, "ensureThead");
|
|
39
|
+
return s(l), h(l), l.classList.add("nine-table-element"), l;
|
|
40
|
+
}, "initializeTable"), g = e.cloneNode(!0);
|
|
41
|
+
q(this, p, u(g)), b(this, p).style.display = "table";
|
|
42
|
+
const f = this.querySelector(".ng-container-left"), r = this.querySelector(".ng-container-body"), o = this.querySelector(".ng-container-right");
|
|
43
|
+
if (r) {
|
|
44
|
+
const l = b(this, p).cloneNode(!0);
|
|
45
|
+
l.querySelectorAll('[fixed="left"], [fixed="right"]').forEach((s) => s.remove()), r.innerHTML = "", r.appendChild(l);
|
|
31
46
|
}
|
|
32
|
-
if (
|
|
33
|
-
const
|
|
34
|
-
|
|
35
|
-
|
|
47
|
+
if (f) {
|
|
48
|
+
const l = b(this, p).cloneNode(!0);
|
|
49
|
+
l.querySelectorAll("col, th, td").forEach((h) => {
|
|
50
|
+
h.getAttribute("fixed") !== "left" && h.remove();
|
|
36
51
|
});
|
|
37
|
-
let
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
}),
|
|
52
|
+
let s = 0;
|
|
53
|
+
l.querySelectorAll("col").forEach((h) => {
|
|
54
|
+
s += parseInt(h.getAttribute("width") || 0, 10);
|
|
55
|
+
}), f.innerHTML = "", f.appendChild(l), s > 0 && (f.style.flex = `0 0 ${s}px`, f.style.minWidth = `${s}px`);
|
|
41
56
|
}
|
|
42
|
-
if (
|
|
43
|
-
const
|
|
44
|
-
|
|
45
|
-
|
|
57
|
+
if (o) {
|
|
58
|
+
const l = b(this, p).cloneNode(!0);
|
|
59
|
+
l.querySelectorAll("col, th, td").forEach((h) => {
|
|
60
|
+
h.getAttribute("fixed") !== "right" && h.remove();
|
|
46
61
|
});
|
|
47
|
-
let
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
}),
|
|
62
|
+
let s = 0;
|
|
63
|
+
l.querySelectorAll("col").forEach((h) => {
|
|
64
|
+
s += parseInt(h.getAttribute("width") || 0, 10);
|
|
65
|
+
}), o.innerHTML = "", o.appendChild(l), s > 0 && (o.style.flex = `0 0 ${s}px`, o.style.minWidth = `${s}px`);
|
|
51
66
|
}
|
|
52
|
-
|
|
67
|
+
E.log(`NineTableSheet 3-split initialized with rows: ${this.getRowCount()}`);
|
|
53
68
|
}, "init"));
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
b(this, q, /* @__PURE__ */ d((e) => {
|
|
57
|
-
if (e.querySelector("colgroup")) return;
|
|
58
|
-
const c = e.querySelector("tbody tr") || e.querySelector("tr"), o = c ? c.querySelectorAll("th, td").length : 1, l = document.createElement("colgroup"), s = Math.max(Math.floor((e.clientWidth || 600) / o), 100);
|
|
59
|
-
for (let t = 0; t < o; t++) {
|
|
60
|
-
const r = document.createElement("col");
|
|
61
|
-
r.setAttribute("width", s), l.appendChild(r);
|
|
62
|
-
}
|
|
63
|
-
e.prepend(l);
|
|
64
|
-
}, "#ensureColgroup"));
|
|
65
|
-
b(this, E, /* @__PURE__ */ d((e) => {
|
|
66
|
-
if (e.querySelector("thead")) return;
|
|
67
|
-
const c = document.createElement("thead"), o = e.querySelector("colgroup");
|
|
68
|
-
o ? o.after(c) : e.prepend(c);
|
|
69
|
-
}, "#ensureThead"));
|
|
70
|
-
b(this, A, /* @__PURE__ */ d(() => {
|
|
69
|
+
k(this, "getRowCount", /* @__PURE__ */ d(() => b(this, p) ? b(this, p).querySelectorAll("tbody tr").length : 0, "getRowCount"));
|
|
70
|
+
y(this, A, /* @__PURE__ */ d(() => {
|
|
71
71
|
this.innerHTML = `
|
|
72
72
|
<style>
|
|
73
73
|
nine-table-sheet {
|
|
@@ -91,7 +91,6 @@ const R = class R extends HTMLElement {
|
|
|
91
91
|
}
|
|
92
92
|
|
|
93
93
|
nine-table-sheet .ng-container-left {
|
|
94
|
-
flex-shrink: 0;
|
|
95
94
|
overflow: hidden;
|
|
96
95
|
background: #ffffff;
|
|
97
96
|
border-right: 1px solid #e5e7eb;
|
|
@@ -105,7 +104,6 @@ const R = class R extends HTMLElement {
|
|
|
105
104
|
}
|
|
106
105
|
|
|
107
106
|
nine-table-sheet .ng-container-right {
|
|
108
|
-
flex-shrink: 0;
|
|
109
107
|
overflow: hidden;
|
|
110
108
|
background: #ffffff;
|
|
111
109
|
border-left: 1px solid #e5e7eb;
|
|
@@ -166,90 +164,89 @@ const R = class R extends HTMLElement {
|
|
|
166
164
|
<nine-table-hscrollbar></nine-table-hscrollbar>
|
|
167
165
|
<div class='ng-scroll-edge'></div>
|
|
168
166
|
</div>
|
|
169
|
-
|
|
167
|
+
`;
|
|
170
168
|
}, "#render"));
|
|
171
|
-
v(this, "disconnectedCallback", /* @__PURE__ */ d(() => {
|
|
172
|
-
this.innerHTML = "", S.log("NineTableSheet destroyed.");
|
|
173
|
-
}, "disconnectedCallback"));
|
|
174
169
|
}
|
|
175
170
|
connectedCallback() {
|
|
176
|
-
|
|
171
|
+
b(this, A).call(this);
|
|
172
|
+
}
|
|
173
|
+
disconnectedCallback() {
|
|
174
|
+
this.innerHTML = "", E.log("NineTableSheet destroyed.");
|
|
177
175
|
}
|
|
178
176
|
};
|
|
179
|
-
|
|
180
|
-
let
|
|
181
|
-
customElements.get("nine-table-sheet") || customElements.define("nine-table-sheet",
|
|
182
|
-
var C
|
|
183
|
-
const
|
|
177
|
+
p = new WeakMap(), A = new WeakMap(), d(N, "NineTableSheet");
|
|
178
|
+
let T = N;
|
|
179
|
+
customElements.get("nine-table-sheet") || customElements.define("nine-table-sheet", T);
|
|
180
|
+
var C;
|
|
181
|
+
const R = class R extends HTMLElement {
|
|
184
182
|
constructor() {
|
|
185
183
|
super();
|
|
186
|
-
|
|
184
|
+
y(this, C, /* @__PURE__ */ d(() => {
|
|
187
185
|
const e = this.querySelector(".nine-tab-bar");
|
|
188
|
-
e && (e.addEventListener("click", (
|
|
189
|
-
const
|
|
190
|
-
if (!
|
|
191
|
-
const
|
|
192
|
-
|
|
193
|
-
}),
|
|
186
|
+
e && (e.addEventListener("click", (u) => {
|
|
187
|
+
const g = u.target.closest(".nine-tab-item");
|
|
188
|
+
if (!g) return;
|
|
189
|
+
const f = u.ctrlKey || u.metaKey || u.shiftKey, r = parseInt(g.dataset.index, 10);
|
|
190
|
+
this.switchSheet(r, f);
|
|
191
|
+
}), this.switchSheet(0, !1));
|
|
194
192
|
}, "#init"));
|
|
195
|
-
|
|
196
|
-
const
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
193
|
+
k(this, "switchSheet", /* @__PURE__ */ d((e, u = !1) => {
|
|
194
|
+
const g = /* @__PURE__ */ d(() => {
|
|
195
|
+
const n = this.querySelector("nine-table-sheets-body");
|
|
196
|
+
n.querySelectorAll("nine-splitter").forEach((c) => {
|
|
197
|
+
const m = parseInt(c.dataset.splitIndex, 10), S = n.querySelector(`nine-table-sheet[data-index="${m - 1}"]`), v = n.querySelector(`nine-table-sheet[data-index="${m}"]`);
|
|
198
|
+
S && v && S.classList.contains("active") && v.classList.contains("active") ? c.classList.add("active") : c.classList.remove("active");
|
|
199
|
+
});
|
|
200
|
+
}, "updateSplitters"), f = this.querySelector(".nine-tab-bar"), r = this.querySelector("nine-table-sheets-body"), o = f.querySelectorAll(".nine-tab-item"), l = r.querySelectorAll("nine-table-sheet");
|
|
201
|
+
if (!o[e]) return;
|
|
202
|
+
if (!u)
|
|
203
|
+
o.forEach((n, a) => {
|
|
204
|
+
n.classList.toggle("active", a === e);
|
|
205
|
+
const c = r.querySelector(`nine-table-sheet[data-index="${a}"]`);
|
|
206
|
+
c && (c.style.flex = "");
|
|
207
|
+
}), l.forEach((n, a) => {
|
|
208
|
+
n.classList.toggle("active", a === e);
|
|
205
209
|
});
|
|
206
210
|
else {
|
|
207
|
-
const
|
|
208
|
-
if (
|
|
211
|
+
const n = o[e], a = f.querySelectorAll(".nine-tab-item.active");
|
|
212
|
+
if (n.classList.contains("active") && a.length <= 1)
|
|
209
213
|
return;
|
|
210
|
-
|
|
211
|
-
const
|
|
212
|
-
|
|
214
|
+
n.classList.toggle("active");
|
|
215
|
+
const c = r.querySelector(`nine-table-sheet[data-index="${e}"]`);
|
|
216
|
+
c && (c.classList.toggle("active"), c.classList.contains("active") || (c.style.flex = ""));
|
|
213
217
|
}
|
|
214
|
-
const
|
|
215
|
-
if (
|
|
216
|
-
const
|
|
217
|
-
|
|
218
|
-
(!
|
|
218
|
+
const s = Array.from(r.querySelectorAll("nine-table-sheet.active"));
|
|
219
|
+
if (s.length > 1) {
|
|
220
|
+
const n = 1 / s.length;
|
|
221
|
+
s.forEach((a) => {
|
|
222
|
+
(!a.style.flex || a.style.flex === "1 1 100%") && (a.style.flex = `${n} ${n} 0px`);
|
|
219
223
|
});
|
|
220
224
|
} else
|
|
221
|
-
|
|
222
|
-
|
|
225
|
+
s.forEach((n) => {
|
|
226
|
+
n.style.flex = "1 1 100%";
|
|
223
227
|
});
|
|
224
|
-
|
|
225
|
-
const
|
|
226
|
-
if (
|
|
227
|
-
const
|
|
228
|
-
|
|
228
|
+
g();
|
|
229
|
+
const h = r.querySelector("nine-table-sheet.active");
|
|
230
|
+
if (h && typeof h.getRowCount == "function") {
|
|
231
|
+
const n = this.querySelector("#row-count");
|
|
232
|
+
n && (n.textContent = h.getRowCount().toLocaleString());
|
|
229
233
|
}
|
|
230
|
-
}, "
|
|
231
|
-
b(this, L, /* @__PURE__ */ d(() => {
|
|
232
|
-
const e = this.querySelector("nine-table-sheets-body");
|
|
233
|
-
e.querySelectorAll("nine-splitter").forEach((o) => {
|
|
234
|
-
const l = parseInt(o.dataset.splitIndex, 10), s = e.querySelector(`nine-table-sheet[data-index="${l - 1}"]`), t = e.querySelector(`nine-table-sheet[data-index="${l}"]`);
|
|
235
|
-
s && t && s.classList.contains("active") && t.classList.contains("active") ? o.classList.add("active") : o.classList.remove("active");
|
|
236
|
-
});
|
|
237
|
-
}, "#updateSplitters"));
|
|
234
|
+
}, "switchSheet"));
|
|
238
235
|
}
|
|
239
236
|
connectedCallback() {
|
|
240
|
-
|
|
237
|
+
b(this, C).call(this);
|
|
241
238
|
}
|
|
242
239
|
};
|
|
243
|
-
C = new WeakMap(),
|
|
244
|
-
let
|
|
245
|
-
customElements.get("nine-table-sheets") || customElements.define("nine-table-sheets",
|
|
246
|
-
var
|
|
247
|
-
const
|
|
248
|
-
constructor(
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
const e = Array.from(
|
|
252
|
-
|
|
240
|
+
C = new WeakMap(), d(R, "NineTableSheets");
|
|
241
|
+
let H = R;
|
|
242
|
+
customElements.get("nine-table-sheets") || customElements.define("nine-table-sheets", H);
|
|
243
|
+
var x, L;
|
|
244
|
+
const W = class W {
|
|
245
|
+
constructor(t) {
|
|
246
|
+
y(this, x);
|
|
247
|
+
y(this, L, /* @__PURE__ */ d(() => {
|
|
248
|
+
const e = Array.from(b(this, x).host.children).filter((r) => r.tagName === "TABLE"), u = e.map((r, o) => `<nine-table-sheet class="${o === 0 ? "active" : ""}" data-index="${o}"></nine-table-sheet>`).join(""), g = e.map((r, o) => `<div class="nine-tab-item ${o === 0 ? "active" : ""}" data-index="${o}">Sheet ${o + 1}</div>`).join("");
|
|
249
|
+
b(this, x).innerHTML = `
|
|
253
250
|
<style>
|
|
254
251
|
:host { display: flex; flex-direction: column; position: relative; overflow: hidden; height: 100%; background: #fff; }
|
|
255
252
|
nine-table-header { height: 40px; display: block; flex-shrink: 0; border-bottom: 1px solid #e5e7eb; background: #fff; }
|
|
@@ -330,9 +327,9 @@ const B = class B {
|
|
|
330
327
|
<nine-table-body>
|
|
331
328
|
<nine-table-summary></nine-table-summary>
|
|
332
329
|
<nine-table-sheets>
|
|
333
|
-
<nine-table-sheets-body>${
|
|
330
|
+
<nine-table-sheets-body>${u}</nine-table-sheets-body>
|
|
334
331
|
<nine-table-sheets-footer>
|
|
335
|
-
<div class="nine-tab-bar">${
|
|
332
|
+
<div class="nine-tab-bar">${g}</div>
|
|
336
333
|
<div class="sheets-counter">Total : <span id="row-count">0</span></div>
|
|
337
334
|
</nine-table-sheets-footer>
|
|
338
335
|
</nine-table-sheets>
|
|
@@ -340,33 +337,33 @@ const B = class B {
|
|
|
340
337
|
</nine-table-body>
|
|
341
338
|
<nine-table-footer></nine-table-footer>
|
|
342
339
|
`;
|
|
343
|
-
const
|
|
344
|
-
|
|
345
|
-
e[
|
|
346
|
-
|
|
340
|
+
const f = b(this, x).querySelectorAll("nine-table-sheet");
|
|
341
|
+
f == null || f.forEach((r, o) => {
|
|
342
|
+
e[o] && setTimeout(() => {
|
|
343
|
+
r.init(e[o]);
|
|
347
344
|
});
|
|
348
345
|
});
|
|
349
346
|
}, "#render"));
|
|
350
|
-
|
|
347
|
+
q(this, x, t), b(this, L).call(this);
|
|
351
348
|
}
|
|
352
349
|
};
|
|
353
|
-
|
|
354
|
-
let
|
|
355
|
-
var
|
|
356
|
-
const
|
|
350
|
+
x = new WeakMap(), L = new WeakMap(), d(W, "LayoutManager");
|
|
351
|
+
let M = W;
|
|
352
|
+
var w;
|
|
353
|
+
const B = class B extends HTMLElement {
|
|
357
354
|
constructor() {
|
|
358
355
|
super();
|
|
359
|
-
|
|
356
|
+
y(this, w, !1);
|
|
360
357
|
this.attachShadow({ mode: "open" });
|
|
361
358
|
}
|
|
362
359
|
connectedCallback() {
|
|
363
|
-
|
|
360
|
+
b(this, w) || (this.layoutManager = new M(this.shadowRoot), q(this, w, !0), E.log("NineTable connected."), this.dispatchEvent(new CustomEvent("load", { bubbles: !0, detail: { target: this } })));
|
|
364
361
|
}
|
|
365
362
|
disconnectedCallback() {
|
|
366
|
-
|
|
363
|
+
E.log("NineTable disconnected.");
|
|
367
364
|
}
|
|
368
365
|
};
|
|
369
|
-
|
|
370
|
-
let
|
|
371
|
-
customElements.get("nine-table") || customElements.define("nine-table",
|
|
366
|
+
w = new WeakMap(), d(B, "NineTable");
|
|
367
|
+
let z = B;
|
|
368
|
+
customElements.get("nine-table") || customElements.define("nine-table", z);
|
|
372
369
|
//# sourceMappingURL=nine-table.js.map
|
package/dist/nine-table.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nine-table.js","sources":["../src/external/NoPeer.js","../src/ui/nine-table-sheet.js","../src/ui/nine-table-sheets.js","../src/ui/LayoutManager.js","../src/core/nine-table.js"],"sourcesContent":["import { trace as traceOrigin } from '@ninebone/util';\n\nexport class Trace extends traceOrigin.constructor {\n constructor() {\n super();\n this.init(\"nine-table\", \"green\");\n }\n}\n\nexport const trace = new Trace();","import { trace } from \"@nopeer\";\n\nexport class NineTableSheet extends HTMLElement {\n #tableElement = null;\n\n constructor() {\n super();\n }\n\n connectedCallback() {\n this.#render();\n };\n\n init = (tableEl) => {\n if (!tableEl) return;\n\n const clonedTable = tableEl.cloneNode(true);\n this.#tableElement = this.#initializeTable(clonedTable);\n this.#tableElement.style.display = 'table';\n\n console.log(this.#tableElement);\n\n const leftContainer = this.querySelector('.ng-container-left');\n const bodyContainer = this.querySelector('.ng-container-body');\n const rightContainer = this.querySelector('.ng-container-right');\n\n console.log(bodyContainer);\n\n // 1. 메인 바디 영역 (좌우 고정 컬럼 제외)\n if (bodyContainer) {\n\n const bodyTable = this.#tableElement.cloneNode(true);\n\n console.log(bodyTable);\n\n bodyTable.querySelectorAll('[fixed=\"left\"], [fixed=\"right\"]').forEach(el => el.remove());\n bodyContainer.innerHTML = '';\n bodyContainer.appendChild(bodyTable);\n\n console.log(bodyContainer);\n }\n\n // 2. 좌측 고정 영역 처리\n if (leftContainer) {\n const leftTable = this.#tableElement.cloneNode(true);\n leftTable.querySelectorAll('col, th, td').forEach(el => {\n if (el.getAttribute('fixed') !== 'left') el.remove();\n });\n // tr.remove() 제거하여 데이터 행 구조 유지\n\n let leftWidth = 0;\n leftTable.querySelectorAll('col').forEach(col => {\n leftWidth += parseInt(col.getAttribute('width') || 0, 10);\n });\n\n leftContainer.innerHTML = '';\n leftContainer.appendChild(leftTable);\n\n if (leftWidth > 0) {\n leftContainer.style.width = `${leftWidth}px`;\n leftContainer.style.minWidth = `${leftWidth}px`;\n }\n }\n\n // 3. 우측 고정 영역 처리\n if (rightContainer) {\n const rightTable = this.#tableElement.cloneNode(true);\n rightTable.querySelectorAll('col, th, td').forEach(el => {\n if (el.getAttribute('fixed') !== 'right') el.remove();\n });\n // tr.remove() 제거하여 데이터 행 구조 유지\n\n let rightWidth = 0;\n rightTable.querySelectorAll('col').forEach(col => {\n rightWidth += parseInt(col.getAttribute('width') || 0, 10);\n });\n\n rightContainer.innerHTML = '';\n rightContainer.appendChild(rightTable);\n\n if (rightWidth > 0) {\n rightContainer.style.width = `${rightWidth}px`;\n rightContainer.style.minWidth = `${rightWidth}px`;\n }\n }\n\n trace.log(`NineTableSheet 3-split initialized with rows: ${this.getRowCount()}`);\n };\n\n getRowCount = () => {\n if (!this.#tableElement) return 0;\n return this.#tableElement.querySelectorAll('tbody tr').length;\n };\n\n #initializeTable = (tbl) => {\n this.#ensureColgroup(tbl);\n this.#ensureThead(tbl);\n\n tbl.classList.add('nine-table-element');\n return tbl;\n };\n\n #ensureColgroup = (tbl) => {\n if (tbl.querySelector('colgroup')) return;\n\n const firstRow = tbl.querySelector('tbody tr') || tbl.querySelector('tr');\n const colCount = firstRow ? firstRow.querySelectorAll('th, td').length : 1;\n\n const colgroup = document.createElement('colgroup');\n const defaultWidth = Math.max(Math.floor((tbl.clientWidth || 600) / colCount), 100);\n\n for (let i = 0; i < colCount; i++) {\n const col = document.createElement('col');\n col.setAttribute('width', defaultWidth);\n colgroup.appendChild(col);\n }\n tbl.prepend(colgroup);\n };\n\n #ensureThead = (tbl) => {\n if (tbl.querySelector('thead')) return;\n\n const thead = document.createElement('thead');\n const colgroup = tbl.querySelector('colgroup');\n\n if (colgroup) {\n colgroup.after(thead);\n } else {\n tbl.prepend(thead);\n }\n };\n\n #render = () => {\n this.innerHTML = `\n <style>\n nine-table-sheet {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n position: relative;\n box-sizing: border-box;\n background: #ffffff;\n overflow: hidden;\n }\n \n nine-table-sheet .ng-container-top {\n display: flex;\n flex-direction: row;\n flex: 1;\n width: 100%;\n overflow: hidden;\n position: relative;\n }\n \n nine-table-sheet .ng-container-left {\n flex-shrink: 0;\n overflow: hidden;\n background: #ffffff;\n border-right: 1px solid #e5e7eb;\n }\n \n nine-table-sheet .ng-container-body {\n flex: 1;\n overflow: auto;\n background: #ffffff;\n position: relative;\n }\n \n nine-table-sheet .ng-container-right {\n flex-shrink: 0;\n overflow: hidden;\n background: #ffffff;\n border-left: 1px solid #e5e7eb;\n }\n \n nine-table-sheet .ng-container-bottom {\n display: flex;\n flex-direction: row;\n height: 16px;\n flex-shrink: 0;\n background: #f9fafb;\n border-top: 1px solid #e5e7eb;\n }\n \n nine-table-sheet nine-table-hscrollbar {\n flex: 1;\n overflow: hidden;\n display: block;\n }\n \n nine-table-sheet .ng-scroll-edge {\n width: 16px;\n flex-shrink: 0;\n background: #f3f4f6;\n }\n \n nine-table-sheet table {\n border-collapse: collapse;\n width: 100%;\n table-layout: fixed;\n }\n \n nine-table-sheet th, nine-table-sheet td {\n box-sizing: border-box;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n padding: 6px 8px;\n border: 1px solid #e5e7eb;\n font-size: 12px;\n color: #111827;\n }\n \n nine-table-sheet th {\n background-color: #f9fafb;\n font-weight: 600;\n text-align: left;\n }\n </style>\n \n <div class='ng-container-top'>\n <div class='ng-container-left'></div>\n <div class='ng-container-body'></div>\n <div class='ng-container-right'></div>\n <nine-table-vscrollbar></nine-table-vscrollbar>\n </div>\n <div class='ng-container-bottom'>\n <nine-table-hscrollbar></nine-table-hscrollbar>\n <div class='ng-scroll-edge'></div>\n </div>\n `;\n\n console.log(\"renderer\");\n };\n\n disconnectedCallback = () => {\n this.innerHTML = '';\n trace.log('NineTableSheet destroyed.');\n };\n}\n\nif (!customElements.get('nine-table-sheet')) {\n customElements.define('nine-table-sheet', NineTableSheet);\n}","import './nine-table-sheet.js';\n\nexport class NineTableSheets extends HTMLElement {\n constructor() {\n super();\n }\n\n connectedCallback() {\n this.#init();\n };\n\n #init = () => {\n const tabBar = this.querySelector('.nine-tab-bar');\n if (!tabBar) return;\n\n tabBar.addEventListener('click', (e) => {\n const tabItem = e.target.closest('.nine-tab-item');\n if (!tabItem) return;\n\n const isMultiSelect = e.ctrlKey || e.metaKey || e.shiftKey;\n const index = parseInt(tabItem.dataset.index, 10);\n this.#switchSheet(index, isMultiSelect);\n });\n\n this.#switchSheet(0, false);\n };\n\n #switchSheet = (index, isMultiSelect = false) => {\n const tabBar = this.querySelector('.nine-tab-bar');\n const body = this.querySelector('nine-table-sheets-body');\n const tabItems = tabBar.querySelectorAll('.nine-tab-item');\n const sheetElements = body.querySelectorAll('nine-table-sheet');\n\n if (!tabItems[index]) return;\n\n if (!isMultiSelect) {\n tabItems.forEach((tab, idx) => {\n tab.classList.toggle('active', idx === index);\n const sheet = body.querySelector(`nine-table-sheet[data-index=\"${idx}\"]`);\n if (sheet) sheet.style.flex = '';\n });\n sheetElements.forEach((sheet, idx) => {\n sheet.classList.toggle('active', idx === index);\n });\n } else {\n const clickedTab = tabItems[index];\n const activeTabs = tabBar.querySelectorAll('.nine-tab-item.active');\n\n if (clickedTab.classList.contains('active') && activeTabs.length <= 1) {\n return;\n }\n\n clickedTab.classList.toggle('active');\n const targetSheet = body.querySelector(`nine-table-sheet[data-index=\"${index}\"]`);\n if (targetSheet) {\n targetSheet.classList.toggle('active');\n if (!targetSheet.classList.contains('active')) {\n targetSheet.style.flex = '';\n }\n }\n }\n\n const activeSheets = Array.from(body.querySelectorAll('nine-table-sheet.active'));\n if (activeSheets.length > 1) {\n const initialBasis = (1 / activeSheets.length);\n activeSheets.forEach(sheet => {\n if (!sheet.style.flex || sheet.style.flex === '1 1 100%') {\n sheet.style.flex = `${initialBasis} ${initialBasis} 0px`;\n }\n });\n } else {\n activeSheets.forEach(sheet => {\n sheet.style.flex = '1 1 100%';\n });\n }\n\n this.#updateSplitters();\n\n const activeSheet = body.querySelector(`nine-table-sheet.active`);\n if (activeSheet && typeof activeSheet.getRowCount === 'function') {\n const rowCountEl = this.querySelector('#row-count');\n if (rowCountEl) {\n rowCountEl.textContent = activeSheet.getRowCount().toLocaleString();\n }\n }\n };\n\n #updateSplitters = () => {\n const body = this.querySelector('nine-table-sheets-body');\n const splitters = body.querySelectorAll('nine-splitter');\n splitters.forEach(splitter => {\n const splitIndex = parseInt(splitter.dataset.splitIndex, 10);\n const leftSheet = body.querySelector(`nine-table-sheet[data-index=\"${splitIndex - 1}\"]`);\n const rightSheet = body.querySelector(`nine-table-sheet[data-index=\"${splitIndex}\"]`);\n\n if (leftSheet && rightSheet && leftSheet.classList.contains('active') && rightSheet.classList.contains('active')) {\n splitter.classList.add('active');\n } else {\n splitter.classList.remove('active');\n }\n });\n };\n}\n\nif (!customElements.get('nine-table-sheets')) {\n customElements.define('nine-table-sheets', NineTableSheets);\n}","import './nine-table-sheets.js';\n\nexport class LayoutManager {\n #root;\n\n constructor(shadowRoot) {\n this.#root = shadowRoot;\n this.#render();\n }\n\n #render = () => {\n const rawElements = Array.from(this.#root.host.children);\n const rawTables = rawElements.filter(el => el.tagName === 'TABLE');\n\n const sheetsHtml = rawTables.map((_, idx) => {\n const className = idx === 0 ? 'active' : '';\n return `<nine-table-sheet class=\"${className}\" data-index=\"${idx}\"></nine-table-sheet>`;\n }).join('');\n\n const tabsHtml = rawTables.map((_, idx) => {\n const className = idx === 0 ? 'active' : '';\n return `<div class=\"nine-tab-item ${className}\" data-index=\"${idx}\">Sheet ${idx + 1}</div>`;\n }).join('');\n\n this.#root.innerHTML = `\n <style>\n :host { display: flex; flex-direction: column; position: relative; overflow: hidden; height: 100%; background: #fff; }\n nine-table-header { height: 40px; display: block; flex-shrink: 0; border-bottom: 1px solid #e5e7eb; background: #fff; }\n nine-table-body { display: flex; flex-direction: row; flex: 1; overflow: hidden; position: relative; }\n nine-table-summary { display: none; width: 250px; flex-shrink: 0; border-right: 1px solid #e5e7eb; }\n nine-splitter:not([data-split-index]) { width: 4px; background: #e5e7eb; cursor: col-resize; flex-shrink: 0; }\n nine-table-analysis { display: none; }\n nine-table-footer { display: none; }\n\n nine-table-sheets {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n position: relative;\n background: #fff;\n }\n nine-table-sheets-body {\n flex: 1;\n overflow: auto;\n position: relative;\n display: flex;\n flex-direction: row;\n }\n nine-table-sheet {\n display: none !important;\n height: 100%;\n overflow: auto;\n flex: 1 1 100%;\n }\n nine-table-sheet.active {\n display: block !important;\n }\n nine-table-sheets-footer {\n display: flex;\n height: 32px;\n background: #f3f4f6;\n border-top: 1px solid #e5e7eb;\n align-items: center;\n justify-content: space-between;\n padding: 0 8px;\n flex-shrink: 0;\n }\n nine-table-sheets .nine-tab-bar {\n display: flex;\n align-items: center;\n gap: 2px;\n overflow-x: auto;\n flex: 1;\n height: 100%;\n }\n nine-table-sheets .nine-tab-item {\n padding: 4px 12px;\n cursor: pointer;\n font-size: 12px;\n color: #4b5563;\n background: #e5e7eb;\n border: 1px solid #d1d5db;\n border-top: none;\n border-radius: 0 0 3px 3px;\n user-select: none;\n }\n nine-table-sheets .nine-tab-item.active {\n background: #ffffff;\n color: #111827;\n font-weight: 600;\n border-bottom: 2px solid #2563eb;\n }\n nine-table-sheets .sheets-counter {\n font-size: 12px;\n color: #6b7280;\n padding-left: 12px;\n flex-shrink: 0;\n }\n </style>\n \n <nine-table-header></nine-table-header>\n <nine-table-body>\n <nine-table-summary></nine-table-summary>\n <nine-table-sheets>\n <nine-table-sheets-body>${sheetsHtml}</nine-table-sheets-body>\n <nine-table-sheets-footer>\n <div class=\"nine-tab-bar\">${tabsHtml}</div>\n <div class=\"sheets-counter\">Total : <span id=\"row-count\">0</span></div>\n </nine-table-sheets-footer>\n </nine-table-sheets>\n <nine-table-analysis></nine-table-analysis>\n </nine-table-body>\n <nine-table-footer></nine-table-footer>\n `;\n\n const $sheetElements = this.#root.querySelectorAll('nine-table-sheet');\n\n $sheetElements?.forEach(($el, idx) => {\n if (rawTables[idx]) {\n setTimeout( () => {\n $el.init(rawTables[idx]);\n })\n }\n });\n };\n}","import {trace} from \"@nopeer\";\nimport { LayoutManager } from '../ui/LayoutManager.js';\n\nexport default class NineTable extends HTMLElement {\n #created = false;\n\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n }\n\n connectedCallback() {\n if (this.#created) return;\n\n // shadowRoot 하나만 넘겨서 내부에서 레이아웃 및 테이블 수집 처리\n this.layoutManager = new LayoutManager(this.shadowRoot);\n //this.layoutManager.render();\n\n this.#created = true;\n trace.log('NineTable connected.');\n\n this.dispatchEvent(new CustomEvent('load', { bubbles: true, detail: { target: this } }));\n }\n\n disconnectedCallback() {\n trace.log('NineTable disconnected.');\n }\n}\n\nif (!customElements.get('nine-table')) {\n customElements.define('nine-table', NineTable);\n}"],"names":["_Trace","traceOrigin","__name","Trace","trace","_NineTableSheet","__privateAdd","_tableElement","__publicField","tableEl","clonedTable","__privateSet","__privateGet","_initializeTable","leftContainer","bodyContainer","rightContainer","bodyTable","el","leftTable","leftWidth","col","rightTable","rightWidth","tbl","_ensureColgroup","_ensureThead","firstRow","colCount","colgroup","defaultWidth","i","thead","_render","NineTableSheet","_NineTableSheets","_init","tabBar","e","tabItem","isMultiSelect","index","_switchSheet","body","tabItems","sheetElements","tab","idx","sheet","clickedTab","activeTabs","targetSheet","activeSheets","initialBasis","_updateSplitters","activeSheet","rowCountEl","splitter","splitIndex","leftSheet","rightSheet","NineTableSheets","_LayoutManager","shadowRoot","_root","rawTables","sheetsHtml","_","tabsHtml","$sheetElements","$el","LayoutManager","_NineTable","_created","NineTable"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"nine-table.js","sources":["../src/external/NoPeer.js","../src/ui/nine-table-sheet.js","../src/ui/nine-table-sheets.js","../src/ui/LayoutManager.js","../src/core/nine-table.js"],"sourcesContent":["import { trace as traceOrigin } from '@ninebone/util';\n\nexport class Trace extends traceOrigin.constructor {\n constructor() {\n super();\n this.init(\"nine-table\", \"green\");\n }\n}\n\nexport const trace = new Trace();","import { trace } from \"@nopeer\";\n\nexport class NineTableSheet extends HTMLElement {\n #tableElement = null;\n\n constructor() {\n super();\n }\n\n connectedCallback() {\n this.#render();\n };\n\n init = (tableEl) => {\n if (!tableEl) return;\n\n const initializeTable = (tbl) => {\n\n const ensureColgroup = (tbl) => {\n if (tbl.querySelector('colgroup')) return;\n\n const firstRow = tbl.querySelector('tbody tr') || tbl.querySelector('tr');\n const colCount = firstRow ? firstRow.querySelectorAll('th, td').length : 1;\n\n const colgroup = document.createElement('colgroup');\n const defaultWidth = Math.max(Math.floor((tbl.clientWidth || 600) / colCount), 100);\n\n for (let i = 0; i < colCount; i++) {\n const col = document.createElement('col');\n col.setAttribute('width', defaultWidth);\n colgroup.appendChild(col);\n }\n tbl.prepend(colgroup);\n };\n\n const ensureThead = (tbl) => {\n if (tbl.querySelector('thead')) return;\n\n const thead = document.createElement('thead');\n const colgroup = tbl.querySelector('colgroup');\n\n if (colgroup) {\n colgroup.after(thead);\n } else {\n tbl.prepend(thead);\n }\n };\n\n ensureColgroup(tbl);\n ensureThead(tbl);\n\n tbl.classList.add('nine-table-element');\n return tbl;\n };\n\n const clonedTable = tableEl.cloneNode(true);\n this.#tableElement = initializeTable(clonedTable);\n this.#tableElement.style.display = 'table';\n\n const leftContainer = this.querySelector('.ng-container-left');\n const bodyContainer = this.querySelector('.ng-container-body');\n const rightContainer = this.querySelector('.ng-container-right');\n\n // 1. 메인 바디 영역 (좌우 고정 컬럼 제외)\n if (bodyContainer) {\n const bodyTable = this.#tableElement.cloneNode(true);\n\n bodyTable.querySelectorAll('[fixed=\"left\"], [fixed=\"right\"]').forEach(el => el.remove());\n bodyContainer.innerHTML = '';\n bodyContainer.appendChild(bodyTable);\n }\n\n // 2. 좌측 고정 영역 처리 (flex 기반 너비 설정)\n if (leftContainer) {\n const leftTable = this.#tableElement.cloneNode(true);\n leftTable.querySelectorAll('col, th, td').forEach(el => {\n if (el.getAttribute('fixed') !== 'left') el.remove();\n });\n\n let leftWidth = 0;\n leftTable.querySelectorAll('col').forEach(col => {\n leftWidth += parseInt(col.getAttribute('width') || 0, 10);\n });\n\n leftContainer.innerHTML = '';\n leftContainer.appendChild(leftTable);\n\n if (leftWidth > 0) {\n leftContainer.style.flex = `0 0 ${leftWidth}px`;\n leftContainer.style.minWidth = `${leftWidth}px`;\n }\n }\n\n // 3. 우측 고정 영역 처리 (flex 기반 너비 설정)\n if (rightContainer) {\n const rightTable = this.#tableElement.cloneNode(true);\n rightTable.querySelectorAll('col, th, td').forEach(el => {\n if (el.getAttribute('fixed') !== 'right') el.remove();\n });\n\n let rightWidth = 0;\n rightTable.querySelectorAll('col').forEach(col => {\n rightWidth += parseInt(col.getAttribute('width') || 0, 10);\n });\n\n rightContainer.innerHTML = '';\n rightContainer.appendChild(rightTable);\n\n if (rightWidth > 0) {\n rightContainer.style.flex = `0 0 ${rightWidth}px`;\n rightContainer.style.minWidth = `${rightWidth}px`;\n }\n }\n\n trace.log(`NineTableSheet 3-split initialized with rows: ${this.getRowCount()}`);\n };\n\n getRowCount = () => {\n if (!this.#tableElement) return 0;\n return this.#tableElement.querySelectorAll('tbody tr').length;\n };\n\n #render = () => {\n this.innerHTML = `\n <style>\n nine-table-sheet {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n position: relative;\n box-sizing: border-box;\n background: #ffffff;\n overflow: hidden;\n }\n \n nine-table-sheet .ng-container-top {\n display: flex;\n flex-direction: row;\n flex: 1;\n width: 100%;\n overflow: hidden;\n position: relative;\n }\n \n nine-table-sheet .ng-container-left {\n overflow: hidden;\n background: #ffffff;\n border-right: 1px solid #e5e7eb;\n }\n \n nine-table-sheet .ng-container-body {\n flex: 1;\n overflow: auto;\n background: #ffffff;\n position: relative;\n }\n \n nine-table-sheet .ng-container-right {\n overflow: hidden;\n background: #ffffff;\n border-left: 1px solid #e5e7eb;\n }\n \n nine-table-sheet .ng-container-bottom {\n display: flex;\n flex-direction: row;\n height: 16px;\n flex-shrink: 0;\n background: #f9fafb;\n border-top: 1px solid #e5e7eb;\n }\n \n nine-table-sheet nine-table-hscrollbar {\n flex: 1;\n overflow: hidden;\n display: block;\n }\n \n nine-table-sheet .ng-scroll-edge {\n width: 16px;\n flex-shrink: 0;\n background: #f3f4f6;\n }\n \n nine-table-sheet table {\n border-collapse: collapse;\n width: 100%;\n table-layout: fixed;\n }\n \n nine-table-sheet th, nine-table-sheet td {\n box-sizing: border-box;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n padding: 6px 8px;\n border: 1px solid #e5e7eb;\n font-size: 12px;\n color: #111827;\n }\n \n nine-table-sheet th {\n background-color: #f9fafb;\n font-weight: 600;\n text-align: left;\n }\n </style>\n \n <div class='ng-container-top'>\n <div class='ng-container-left'></div>\n <div class='ng-container-body'></div>\n <div class='ng-container-right'></div>\n <nine-table-vscrollbar></nine-table-vscrollbar>\n </div>\n <div class='ng-container-bottom'>\n <nine-table-hscrollbar></nine-table-hscrollbar>\n <div class='ng-scroll-edge'></div>\n </div>\n `;\n };\n\n disconnectedCallback() {\n this.innerHTML = '';\n trace.log('NineTableSheet destroyed.');\n };\n}\n\nif (!customElements.get('nine-table-sheet')) {\n customElements.define('nine-table-sheet', NineTableSheet);\n}","import './nine-table-sheet.js';\n\nexport class NineTableSheets extends HTMLElement {\n constructor() {\n super();\n }\n\n connectedCallback() {\n this.#init();\n };\n\n #init = () => {\n const tabBar = this.querySelector('.nine-tab-bar');\n if (!tabBar) return;\n\n tabBar.addEventListener('click', (e) => {\n const tabItem = e.target.closest('.nine-tab-item');\n if (!tabItem) return;\n\n const isMultiSelect = e.ctrlKey || e.metaKey || e.shiftKey;\n const index = parseInt(tabItem.dataset.index, 10);\n this.switchSheet(index, isMultiSelect);\n });\n\n this.switchSheet(0, false);\n };\n\n switchSheet = (index, isMultiSelect = false) => {\n\n const updateSplitters = () => {\n const body = this.querySelector('nine-table-sheets-body');\n const splitters = body.querySelectorAll('nine-splitter');\n splitters.forEach(splitter => {\n const splitIndex = parseInt(splitter.dataset.splitIndex, 10);\n const leftSheet = body.querySelector(`nine-table-sheet[data-index=\"${splitIndex - 1}\"]`);\n const rightSheet = body.querySelector(`nine-table-sheet[data-index=\"${splitIndex}\"]`);\n\n if (leftSheet && rightSheet && leftSheet.classList.contains('active') && rightSheet.classList.contains('active')) {\n splitter.classList.add('active');\n } else {\n splitter.classList.remove('active');\n }\n });\n };\n\n const tabBar = this.querySelector('.nine-tab-bar');\n const body = this.querySelector('nine-table-sheets-body');\n const tabItems = tabBar.querySelectorAll('.nine-tab-item');\n const sheetElements = body.querySelectorAll('nine-table-sheet');\n\n if (!tabItems[index]) return;\n\n if (!isMultiSelect) {\n tabItems.forEach((tab, idx) => {\n tab.classList.toggle('active', idx === index);\n const sheet = body.querySelector(`nine-table-sheet[data-index=\"${idx}\"]`);\n if (sheet) sheet.style.flex = '';\n });\n sheetElements.forEach((sheet, idx) => {\n sheet.classList.toggle('active', idx === index);\n });\n } else {\n const clickedTab = tabItems[index];\n const activeTabs = tabBar.querySelectorAll('.nine-tab-item.active');\n\n if (clickedTab.classList.contains('active') && activeTabs.length <= 1) {\n return;\n }\n\n clickedTab.classList.toggle('active');\n const targetSheet = body.querySelector(`nine-table-sheet[data-index=\"${index}\"]`);\n if (targetSheet) {\n targetSheet.classList.toggle('active');\n if (!targetSheet.classList.contains('active')) {\n targetSheet.style.flex = '';\n }\n }\n }\n\n const activeSheets = Array.from(body.querySelectorAll('nine-table-sheet.active'));\n if (activeSheets.length > 1) {\n const initialBasis = (1 / activeSheets.length);\n activeSheets.forEach(sheet => {\n if (!sheet.style.flex || sheet.style.flex === '1 1 100%') {\n sheet.style.flex = `${initialBasis} ${initialBasis} 0px`;\n }\n });\n } else {\n activeSheets.forEach(sheet => {\n sheet.style.flex = '1 1 100%';\n });\n }\n\n updateSplitters();\n\n const activeSheet = body.querySelector(`nine-table-sheet.active`);\n if (activeSheet && typeof activeSheet.getRowCount === 'function') {\n const rowCountEl = this.querySelector('#row-count');\n if (rowCountEl) {\n rowCountEl.textContent = activeSheet.getRowCount().toLocaleString();\n }\n }\n };\n\n\n}\n\nif (!customElements.get('nine-table-sheets')) {\n customElements.define('nine-table-sheets', NineTableSheets);\n}","import './nine-table-sheets.js';\n\nexport class LayoutManager {\n #root;\n\n constructor(shadowRoot) {\n this.#root = shadowRoot;\n this.#render();\n }\n\n #render = () => {\n const rawElements = Array.from(this.#root.host.children);\n const rawTables = rawElements.filter(el => el.tagName === 'TABLE');\n\n const sheetsHtml = rawTables.map((_, idx) => {\n const className = idx === 0 ? 'active' : '';\n return `<nine-table-sheet class=\"${className}\" data-index=\"${idx}\"></nine-table-sheet>`;\n }).join('');\n\n const tabsHtml = rawTables.map((_, idx) => {\n const className = idx === 0 ? 'active' : '';\n return `<div class=\"nine-tab-item ${className}\" data-index=\"${idx}\">Sheet ${idx + 1}</div>`;\n }).join('');\n\n this.#root.innerHTML = `\n <style>\n :host { display: flex; flex-direction: column; position: relative; overflow: hidden; height: 100%; background: #fff; }\n nine-table-header { height: 40px; display: block; flex-shrink: 0; border-bottom: 1px solid #e5e7eb; background: #fff; }\n nine-table-body { display: flex; flex-direction: row; flex: 1; overflow: hidden; position: relative; }\n nine-table-summary { display: none; width: 250px; flex-shrink: 0; border-right: 1px solid #e5e7eb; }\n nine-splitter:not([data-split-index]) { width: 4px; background: #e5e7eb; cursor: col-resize; flex-shrink: 0; }\n nine-table-analysis { display: none; }\n nine-table-footer { display: none; }\n\n nine-table-sheets {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n position: relative;\n background: #fff;\n }\n nine-table-sheets-body {\n flex: 1;\n overflow: auto;\n position: relative;\n display: flex;\n flex-direction: row;\n }\n nine-table-sheet {\n display: none !important;\n height: 100%;\n overflow: auto;\n flex: 1 1 100%;\n }\n nine-table-sheet.active {\n display: block !important;\n }\n nine-table-sheets-footer {\n display: flex;\n height: 32px;\n background: #f3f4f6;\n border-top: 1px solid #e5e7eb;\n align-items: center;\n justify-content: space-between;\n padding: 0 8px;\n flex-shrink: 0;\n }\n nine-table-sheets .nine-tab-bar {\n display: flex;\n align-items: center;\n gap: 2px;\n overflow-x: auto;\n flex: 1;\n height: 100%;\n }\n nine-table-sheets .nine-tab-item {\n padding: 4px 12px;\n cursor: pointer;\n font-size: 12px;\n color: #4b5563;\n background: #e5e7eb;\n border: 1px solid #d1d5db;\n border-top: none;\n border-radius: 0 0 3px 3px;\n user-select: none;\n }\n nine-table-sheets .nine-tab-item.active {\n background: #ffffff;\n color: #111827;\n font-weight: 600;\n border-bottom: 2px solid #2563eb;\n }\n nine-table-sheets .sheets-counter {\n font-size: 12px;\n color: #6b7280;\n padding-left: 12px;\n flex-shrink: 0;\n }\n </style>\n \n <nine-table-header></nine-table-header>\n <nine-table-body>\n <nine-table-summary></nine-table-summary>\n <nine-table-sheets>\n <nine-table-sheets-body>${sheetsHtml}</nine-table-sheets-body>\n <nine-table-sheets-footer>\n <div class=\"nine-tab-bar\">${tabsHtml}</div>\n <div class=\"sheets-counter\">Total : <span id=\"row-count\">0</span></div>\n </nine-table-sheets-footer>\n </nine-table-sheets>\n <nine-table-analysis></nine-table-analysis>\n </nine-table-body>\n <nine-table-footer></nine-table-footer>\n `;\n\n const $sheetElements = this.#root.querySelectorAll('nine-table-sheet');\n\n $sheetElements?.forEach(($el, idx) => {\n if (rawTables[idx]) {\n setTimeout( () => {\n $el.init(rawTables[idx]);\n })\n }\n });\n };\n}","import {trace} from \"@nopeer\";\nimport { LayoutManager } from '../ui/LayoutManager.js';\n\nexport default class NineTable extends HTMLElement {\n #created = false;\n\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n }\n\n connectedCallback() {\n if (this.#created) return;\n\n // shadowRoot 하나만 넘겨서 내부에서 레이아웃 및 테이블 수집 처리\n this.layoutManager = new LayoutManager(this.shadowRoot);\n //this.layoutManager.render();\n\n this.#created = true;\n trace.log('NineTable connected.');\n\n this.dispatchEvent(new CustomEvent('load', { bubbles: true, detail: { target: this } }));\n }\n\n disconnectedCallback() {\n trace.log('NineTable disconnected.');\n }\n}\n\nif (!customElements.get('nine-table')) {\n customElements.define('nine-table', NineTable);\n}"],"names":["_Trace","traceOrigin","__name","Trace","trace","_NineTableSheet","__privateAdd","_tableElement","__publicField","tableEl","initializeTable","tbl","ensureColgroup","firstRow","colCount","colgroup","defaultWidth","i","col","ensureThead","thead","clonedTable","__privateSet","__privateGet","leftContainer","bodyContainer","rightContainer","bodyTable","el","leftTable","leftWidth","rightTable","rightWidth","_render","NineTableSheet","_NineTableSheets","_init","tabBar","e","tabItem","isMultiSelect","index","updateSplitters","body","splitter","splitIndex","leftSheet","rightSheet","tabItems","sheetElements","tab","idx","sheet","clickedTab","activeTabs","targetSheet","activeSheets","initialBasis","activeSheet","rowCountEl","NineTableSheets","_LayoutManager","shadowRoot","_root","rawTables","sheetsHtml","_","tabsHtml","$sheetElements","$el","LayoutManager","_NineTable","_created","NineTable"],"mappings":"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"}
|
package/dist/nine-table.umd.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(function(t,e){typeof exports=="object"&&typeof module<"u"?e(require("@ninebone/util")):typeof define=="function"&&define.amd?define(["@ninebone/util"],e):(t=typeof globalThis<"u"?globalThis:t||self,e(t.NineboneUtil))})(this,function(t){"use strict";var K=Object.defineProperty;var U=t=>{throw TypeError(t)};var F=(t,e,i)=>e in t?K(t,e,{enumerable:!0,configurable:!0,writable:!0,value:i}):t[e]=i;var f=(t,e)=>K(t,"name",{value:e,configurable:!0});var T=(t,e,i)=>F(t,typeof e!="symbol"?e+"":e,i),D=(t,e,i)=>e.has(t)||U("Cannot "+i);var u=(t,e,i)=>(D(t,e,"read from private field"),i?i.call(t):e.get(t)),m=(t,e,i)=>e.has(t)?U("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(t):e.set(t,i),$=(t,e,i,v)=>(D(t,e,"write to private field"),v?v.call(t,i):e.set(t,i),i);var p,E,A,x,C,w;const I=class I extends t.trace.constructor{constructor(){super(),this.init("nine-table","green")}};f(I,"Trace");let e=I;const i=new e,N=class N extends HTMLElement{constructor(){super();m(this,p,null);T(this,"init",f(d=>{if(!d)return;const g=f(l=>{const s=f(n=>{if(n.querySelector("colgroup"))return;const a=n.querySelector("tbody tr")||n.querySelector("tr"),c=a?a.querySelectorAll("th, td").length:1,q=document.createElement("colgroup"),L=Math.max(Math.floor((n.clientWidth||600)/c),100);for(let k=0;k<c;k++){const B=document.createElement("col");B.setAttribute("width",L),q.appendChild(B)}n.prepend(q)},"ensureColgroup"),h=f(n=>{if(n.querySelector("thead"))return;const a=document.createElement("thead"),c=n.querySelector("colgroup");c?c.after(a):n.prepend(a)},"ensureThead");return s(l),h(l),l.classList.add("nine-table-element"),l},"initializeTable"),y=d.cloneNode(!0);$(this,p,g(y)),u(this,p).style.display="table";const b=this.querySelector(".ng-container-left"),r=this.querySelector(".ng-container-body"),o=this.querySelector(".ng-container-right");if(r){const l=u(this,p).cloneNode(!0);l.querySelectorAll('[fixed="left"], [fixed="right"]').forEach(s=>s.remove()),r.innerHTML="",r.appendChild(l)}if(b){const l=u(this,p).cloneNode(!0);l.querySelectorAll("col, th, td").forEach(h=>{h.getAttribute("fixed")!=="left"&&h.remove()});let s=0;l.querySelectorAll("col").forEach(h=>{s+=parseInt(h.getAttribute("width")||0,10)}),b.innerHTML="",b.appendChild(l),s>0&&(b.style.flex=`0 0 ${s}px`,b.style.minWidth=`${s}px`)}if(o){const l=u(this,p).cloneNode(!0);l.querySelectorAll("col, th, td").forEach(h=>{h.getAttribute("fixed")!=="right"&&h.remove()});let s=0;l.querySelectorAll("col").forEach(h=>{s+=parseInt(h.getAttribute("width")||0,10)}),o.innerHTML="",o.appendChild(l),s>0&&(o.style.flex=`0 0 ${s}px`,o.style.minWidth=`${s}px`)}i.log(`NineTableSheet 3-split initialized with rows: ${this.getRowCount()}`)},"init"));T(this,"getRowCount",f(()=>u(this,p)?u(this,p).querySelectorAll("tbody tr").length:0,"getRowCount"));m(this,E,f(()=>{this.innerHTML=`
|
|
2
2
|
<style>
|
|
3
3
|
nine-table-sheet {
|
|
4
4
|
display: flex;
|
|
@@ -21,7 +21,6 @@
|
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
nine-table-sheet .ng-container-left {
|
|
24
|
-
flex-shrink: 0;
|
|
25
24
|
overflow: hidden;
|
|
26
25
|
background: #ffffff;
|
|
27
26
|
border-right: 1px solid #e5e7eb;
|
|
@@ -35,7 +34,6 @@
|
|
|
35
34
|
}
|
|
36
35
|
|
|
37
36
|
nine-table-sheet .ng-container-right {
|
|
38
|
-
flex-shrink: 0;
|
|
39
37
|
overflow: hidden;
|
|
40
38
|
background: #ffffff;
|
|
41
39
|
border-left: 1px solid #e5e7eb;
|
|
@@ -96,7 +94,7 @@
|
|
|
96
94
|
<nine-table-hscrollbar></nine-table-hscrollbar>
|
|
97
95
|
<div class='ng-scroll-edge'></div>
|
|
98
96
|
</div>
|
|
99
|
-
|
|
97
|
+
`},"#render"))}connectedCallback(){u(this,E).call(this)}disconnectedCallback(){this.innerHTML="",i.log("NineTableSheet destroyed.")}};p=new WeakMap,E=new WeakMap,f(N,"NineTableSheet");let v=N;customElements.get("nine-table-sheet")||customElements.define("nine-table-sheet",v);const R=class R extends HTMLElement{constructor(){super();m(this,A,f(()=>{const d=this.querySelector(".nine-tab-bar");d&&(d.addEventListener("click",g=>{const y=g.target.closest(".nine-tab-item");if(!y)return;const b=g.ctrlKey||g.metaKey||g.shiftKey,r=parseInt(y.dataset.index,10);this.switchSheet(r,b)}),this.switchSheet(0,!1))},"#init"));T(this,"switchSheet",f((d,g=!1)=>{const y=f(()=>{const n=this.querySelector("nine-table-sheets-body");n.querySelectorAll("nine-splitter").forEach(c=>{const q=parseInt(c.dataset.splitIndex,10),L=n.querySelector(`nine-table-sheet[data-index="${q-1}"]`),k=n.querySelector(`nine-table-sheet[data-index="${q}"]`);L&&k&&L.classList.contains("active")&&k.classList.contains("active")?c.classList.add("active"):c.classList.remove("active")})},"updateSplitters"),b=this.querySelector(".nine-tab-bar"),r=this.querySelector("nine-table-sheets-body"),o=b.querySelectorAll(".nine-tab-item"),l=r.querySelectorAll("nine-table-sheet");if(!o[d])return;if(!g)o.forEach((n,a)=>{n.classList.toggle("active",a===d);const c=r.querySelector(`nine-table-sheet[data-index="${a}"]`);c&&(c.style.flex="")}),l.forEach((n,a)=>{n.classList.toggle("active",a===d)});else{const n=o[d],a=b.querySelectorAll(".nine-tab-item.active");if(n.classList.contains("active")&&a.length<=1)return;n.classList.toggle("active");const c=r.querySelector(`nine-table-sheet[data-index="${d}"]`);c&&(c.classList.toggle("active"),c.classList.contains("active")||(c.style.flex=""))}const s=Array.from(r.querySelectorAll("nine-table-sheet.active"));if(s.length>1){const n=1/s.length;s.forEach(a=>{(!a.style.flex||a.style.flex==="1 1 100%")&&(a.style.flex=`${n} ${n} 0px`)})}else s.forEach(n=>{n.style.flex="1 1 100%"});y();const h=r.querySelector("nine-table-sheet.active");if(h&&typeof h.getRowCount=="function"){const n=this.querySelector("#row-count");n&&(n.textContent=h.getRowCount().toLocaleString())}},"switchSheet"))}connectedCallback(){u(this,A).call(this)}};A=new WeakMap,f(R,"NineTableSheets");let H=R;customElements.get("nine-table-sheets")||customElements.define("nine-table-sheets",H);const W=class W{constructor(S){m(this,x);m(this,C,f(()=>{const d=Array.from(u(this,x).host.children).filter(r=>r.tagName==="TABLE"),g=d.map((r,o)=>`<nine-table-sheet class="${o===0?"active":""}" data-index="${o}"></nine-table-sheet>`).join(""),y=d.map((r,o)=>`<div class="nine-tab-item ${o===0?"active":""}" data-index="${o}">Sheet ${o+1}</div>`).join("");u(this,x).innerHTML=`
|
|
100
98
|
<style>
|
|
101
99
|
:host { display: flex; flex-direction: column; position: relative; overflow: hidden; height: 100%; background: #fff; }
|
|
102
100
|
nine-table-header { height: 40px; display: block; flex-shrink: 0; border-bottom: 1px solid #e5e7eb; background: #fff; }
|
|
@@ -177,14 +175,14 @@
|
|
|
177
175
|
<nine-table-body>
|
|
178
176
|
<nine-table-summary></nine-table-summary>
|
|
179
177
|
<nine-table-sheets>
|
|
180
|
-
<nine-table-sheets-body>${
|
|
178
|
+
<nine-table-sheets-body>${g}</nine-table-sheets-body>
|
|
181
179
|
<nine-table-sheets-footer>
|
|
182
|
-
<div class="nine-tab-bar">${
|
|
180
|
+
<div class="nine-tab-bar">${y}</div>
|
|
183
181
|
<div class="sheets-counter">Total : <span id="row-count">0</span></div>
|
|
184
182
|
</nine-table-sheets-footer>
|
|
185
183
|
</nine-table-sheets>
|
|
186
184
|
<nine-table-analysis></nine-table-analysis>
|
|
187
185
|
</nine-table-body>
|
|
188
186
|
<nine-table-footer></nine-table-footer>
|
|
189
|
-
`;const
|
|
187
|
+
`;const b=u(this,x).querySelectorAll("nine-table-sheet");b==null||b.forEach((r,o)=>{d[o]&&setTimeout(()=>{r.init(d[o])})})},"#render"));$(this,x,S),u(this,C).call(this)}};x=new WeakMap,C=new WeakMap,f(W,"LayoutManager");let M=W;const j=class j extends HTMLElement{constructor(){super();m(this,w,!1);this.attachShadow({mode:"open"})}connectedCallback(){u(this,w)||(this.layoutManager=new M(this.shadowRoot),$(this,w,!0),i.log("NineTable connected."),this.dispatchEvent(new CustomEvent("load",{bubbles:!0,detail:{target:this}})))}disconnectedCallback(){i.log("NineTable disconnected.")}};w=new WeakMap,f(j,"NineTable");let z=j;customElements.get("nine-table")||customElements.define("nine-table",z)});
|
|
190
188
|
//# sourceMappingURL=nine-table.umd.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nine-table.umd.js","sources":["../src/external/NoPeer.js","../src/ui/nine-table-sheet.js","../src/ui/nine-table-sheets.js","../src/ui/LayoutManager.js","../src/core/nine-table.js"],"sourcesContent":["import { trace as traceOrigin } from '@ninebone/util';\n\nexport class Trace extends traceOrigin.constructor {\n constructor() {\n super();\n this.init(\"nine-table\", \"green\");\n }\n}\n\nexport const trace = new Trace();","import { trace } from \"@nopeer\";\n\nexport class NineTableSheet extends HTMLElement {\n #tableElement = null;\n\n constructor() {\n super();\n }\n\n connectedCallback() {\n this.#render();\n };\n\n init = (tableEl) => {\n if (!tableEl) return;\n\n const clonedTable = tableEl.cloneNode(true);\n this.#tableElement = this.#initializeTable(clonedTable);\n this.#tableElement.style.display = 'table';\n\n console.log(this.#tableElement);\n\n const leftContainer = this.querySelector('.ng-container-left');\n const bodyContainer = this.querySelector('.ng-container-body');\n const rightContainer = this.querySelector('.ng-container-right');\n\n console.log(bodyContainer);\n\n // 1. 메인 바디 영역 (좌우 고정 컬럼 제외)\n if (bodyContainer) {\n\n const bodyTable = this.#tableElement.cloneNode(true);\n\n console.log(bodyTable);\n\n bodyTable.querySelectorAll('[fixed=\"left\"], [fixed=\"right\"]').forEach(el => el.remove());\n bodyContainer.innerHTML = '';\n bodyContainer.appendChild(bodyTable);\n\n console.log(bodyContainer);\n }\n\n // 2. 좌측 고정 영역 처리\n if (leftContainer) {\n const leftTable = this.#tableElement.cloneNode(true);\n leftTable.querySelectorAll('col, th, td').forEach(el => {\n if (el.getAttribute('fixed') !== 'left') el.remove();\n });\n // tr.remove() 제거하여 데이터 행 구조 유지\n\n let leftWidth = 0;\n leftTable.querySelectorAll('col').forEach(col => {\n leftWidth += parseInt(col.getAttribute('width') || 0, 10);\n });\n\n leftContainer.innerHTML = '';\n leftContainer.appendChild(leftTable);\n\n if (leftWidth > 0) {\n leftContainer.style.width = `${leftWidth}px`;\n leftContainer.style.minWidth = `${leftWidth}px`;\n }\n }\n\n // 3. 우측 고정 영역 처리\n if (rightContainer) {\n const rightTable = this.#tableElement.cloneNode(true);\n rightTable.querySelectorAll('col, th, td').forEach(el => {\n if (el.getAttribute('fixed') !== 'right') el.remove();\n });\n // tr.remove() 제거하여 데이터 행 구조 유지\n\n let rightWidth = 0;\n rightTable.querySelectorAll('col').forEach(col => {\n rightWidth += parseInt(col.getAttribute('width') || 0, 10);\n });\n\n rightContainer.innerHTML = '';\n rightContainer.appendChild(rightTable);\n\n if (rightWidth > 0) {\n rightContainer.style.width = `${rightWidth}px`;\n rightContainer.style.minWidth = `${rightWidth}px`;\n }\n }\n\n trace.log(`NineTableSheet 3-split initialized with rows: ${this.getRowCount()}`);\n };\n\n getRowCount = () => {\n if (!this.#tableElement) return 0;\n return this.#tableElement.querySelectorAll('tbody tr').length;\n };\n\n #initializeTable = (tbl) => {\n this.#ensureColgroup(tbl);\n this.#ensureThead(tbl);\n\n tbl.classList.add('nine-table-element');\n return tbl;\n };\n\n #ensureColgroup = (tbl) => {\n if (tbl.querySelector('colgroup')) return;\n\n const firstRow = tbl.querySelector('tbody tr') || tbl.querySelector('tr');\n const colCount = firstRow ? firstRow.querySelectorAll('th, td').length : 1;\n\n const colgroup = document.createElement('colgroup');\n const defaultWidth = Math.max(Math.floor((tbl.clientWidth || 600) / colCount), 100);\n\n for (let i = 0; i < colCount; i++) {\n const col = document.createElement('col');\n col.setAttribute('width', defaultWidth);\n colgroup.appendChild(col);\n }\n tbl.prepend(colgroup);\n };\n\n #ensureThead = (tbl) => {\n if (tbl.querySelector('thead')) return;\n\n const thead = document.createElement('thead');\n const colgroup = tbl.querySelector('colgroup');\n\n if (colgroup) {\n colgroup.after(thead);\n } else {\n tbl.prepend(thead);\n }\n };\n\n #render = () => {\n this.innerHTML = `\n <style>\n nine-table-sheet {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n position: relative;\n box-sizing: border-box;\n background: #ffffff;\n overflow: hidden;\n }\n \n nine-table-sheet .ng-container-top {\n display: flex;\n flex-direction: row;\n flex: 1;\n width: 100%;\n overflow: hidden;\n position: relative;\n }\n \n nine-table-sheet .ng-container-left {\n flex-shrink: 0;\n overflow: hidden;\n background: #ffffff;\n border-right: 1px solid #e5e7eb;\n }\n \n nine-table-sheet .ng-container-body {\n flex: 1;\n overflow: auto;\n background: #ffffff;\n position: relative;\n }\n \n nine-table-sheet .ng-container-right {\n flex-shrink: 0;\n overflow: hidden;\n background: #ffffff;\n border-left: 1px solid #e5e7eb;\n }\n \n nine-table-sheet .ng-container-bottom {\n display: flex;\n flex-direction: row;\n height: 16px;\n flex-shrink: 0;\n background: #f9fafb;\n border-top: 1px solid #e5e7eb;\n }\n \n nine-table-sheet nine-table-hscrollbar {\n flex: 1;\n overflow: hidden;\n display: block;\n }\n \n nine-table-sheet .ng-scroll-edge {\n width: 16px;\n flex-shrink: 0;\n background: #f3f4f6;\n }\n \n nine-table-sheet table {\n border-collapse: collapse;\n width: 100%;\n table-layout: fixed;\n }\n \n nine-table-sheet th, nine-table-sheet td {\n box-sizing: border-box;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n padding: 6px 8px;\n border: 1px solid #e5e7eb;\n font-size: 12px;\n color: #111827;\n }\n \n nine-table-sheet th {\n background-color: #f9fafb;\n font-weight: 600;\n text-align: left;\n }\n </style>\n \n <div class='ng-container-top'>\n <div class='ng-container-left'></div>\n <div class='ng-container-body'></div>\n <div class='ng-container-right'></div>\n <nine-table-vscrollbar></nine-table-vscrollbar>\n </div>\n <div class='ng-container-bottom'>\n <nine-table-hscrollbar></nine-table-hscrollbar>\n <div class='ng-scroll-edge'></div>\n </div>\n `;\n\n console.log(\"renderer\");\n };\n\n disconnectedCallback = () => {\n this.innerHTML = '';\n trace.log('NineTableSheet destroyed.');\n };\n}\n\nif (!customElements.get('nine-table-sheet')) {\n customElements.define('nine-table-sheet', NineTableSheet);\n}","import './nine-table-sheet.js';\n\nexport class NineTableSheets extends HTMLElement {\n constructor() {\n super();\n }\n\n connectedCallback() {\n this.#init();\n };\n\n #init = () => {\n const tabBar = this.querySelector('.nine-tab-bar');\n if (!tabBar) return;\n\n tabBar.addEventListener('click', (e) => {\n const tabItem = e.target.closest('.nine-tab-item');\n if (!tabItem) return;\n\n const isMultiSelect = e.ctrlKey || e.metaKey || e.shiftKey;\n const index = parseInt(tabItem.dataset.index, 10);\n this.#switchSheet(index, isMultiSelect);\n });\n\n this.#switchSheet(0, false);\n };\n\n #switchSheet = (index, isMultiSelect = false) => {\n const tabBar = this.querySelector('.nine-tab-bar');\n const body = this.querySelector('nine-table-sheets-body');\n const tabItems = tabBar.querySelectorAll('.nine-tab-item');\n const sheetElements = body.querySelectorAll('nine-table-sheet');\n\n if (!tabItems[index]) return;\n\n if (!isMultiSelect) {\n tabItems.forEach((tab, idx) => {\n tab.classList.toggle('active', idx === index);\n const sheet = body.querySelector(`nine-table-sheet[data-index=\"${idx}\"]`);\n if (sheet) sheet.style.flex = '';\n });\n sheetElements.forEach((sheet, idx) => {\n sheet.classList.toggle('active', idx === index);\n });\n } else {\n const clickedTab = tabItems[index];\n const activeTabs = tabBar.querySelectorAll('.nine-tab-item.active');\n\n if (clickedTab.classList.contains('active') && activeTabs.length <= 1) {\n return;\n }\n\n clickedTab.classList.toggle('active');\n const targetSheet = body.querySelector(`nine-table-sheet[data-index=\"${index}\"]`);\n if (targetSheet) {\n targetSheet.classList.toggle('active');\n if (!targetSheet.classList.contains('active')) {\n targetSheet.style.flex = '';\n }\n }\n }\n\n const activeSheets = Array.from(body.querySelectorAll('nine-table-sheet.active'));\n if (activeSheets.length > 1) {\n const initialBasis = (1 / activeSheets.length);\n activeSheets.forEach(sheet => {\n if (!sheet.style.flex || sheet.style.flex === '1 1 100%') {\n sheet.style.flex = `${initialBasis} ${initialBasis} 0px`;\n }\n });\n } else {\n activeSheets.forEach(sheet => {\n sheet.style.flex = '1 1 100%';\n });\n }\n\n this.#updateSplitters();\n\n const activeSheet = body.querySelector(`nine-table-sheet.active`);\n if (activeSheet && typeof activeSheet.getRowCount === 'function') {\n const rowCountEl = this.querySelector('#row-count');\n if (rowCountEl) {\n rowCountEl.textContent = activeSheet.getRowCount().toLocaleString();\n }\n }\n };\n\n #updateSplitters = () => {\n const body = this.querySelector('nine-table-sheets-body');\n const splitters = body.querySelectorAll('nine-splitter');\n splitters.forEach(splitter => {\n const splitIndex = parseInt(splitter.dataset.splitIndex, 10);\n const leftSheet = body.querySelector(`nine-table-sheet[data-index=\"${splitIndex - 1}\"]`);\n const rightSheet = body.querySelector(`nine-table-sheet[data-index=\"${splitIndex}\"]`);\n\n if (leftSheet && rightSheet && leftSheet.classList.contains('active') && rightSheet.classList.contains('active')) {\n splitter.classList.add('active');\n } else {\n splitter.classList.remove('active');\n }\n });\n };\n}\n\nif (!customElements.get('nine-table-sheets')) {\n customElements.define('nine-table-sheets', NineTableSheets);\n}","import './nine-table-sheets.js';\n\nexport class LayoutManager {\n #root;\n\n constructor(shadowRoot) {\n this.#root = shadowRoot;\n this.#render();\n }\n\n #render = () => {\n const rawElements = Array.from(this.#root.host.children);\n const rawTables = rawElements.filter(el => el.tagName === 'TABLE');\n\n const sheetsHtml = rawTables.map((_, idx) => {\n const className = idx === 0 ? 'active' : '';\n return `<nine-table-sheet class=\"${className}\" data-index=\"${idx}\"></nine-table-sheet>`;\n }).join('');\n\n const tabsHtml = rawTables.map((_, idx) => {\n const className = idx === 0 ? 'active' : '';\n return `<div class=\"nine-tab-item ${className}\" data-index=\"${idx}\">Sheet ${idx + 1}</div>`;\n }).join('');\n\n this.#root.innerHTML = `\n <style>\n :host { display: flex; flex-direction: column; position: relative; overflow: hidden; height: 100%; background: #fff; }\n nine-table-header { height: 40px; display: block; flex-shrink: 0; border-bottom: 1px solid #e5e7eb; background: #fff; }\n nine-table-body { display: flex; flex-direction: row; flex: 1; overflow: hidden; position: relative; }\n nine-table-summary { display: none; width: 250px; flex-shrink: 0; border-right: 1px solid #e5e7eb; }\n nine-splitter:not([data-split-index]) { width: 4px; background: #e5e7eb; cursor: col-resize; flex-shrink: 0; }\n nine-table-analysis { display: none; }\n nine-table-footer { display: none; }\n\n nine-table-sheets {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n position: relative;\n background: #fff;\n }\n nine-table-sheets-body {\n flex: 1;\n overflow: auto;\n position: relative;\n display: flex;\n flex-direction: row;\n }\n nine-table-sheet {\n display: none !important;\n height: 100%;\n overflow: auto;\n flex: 1 1 100%;\n }\n nine-table-sheet.active {\n display: block !important;\n }\n nine-table-sheets-footer {\n display: flex;\n height: 32px;\n background: #f3f4f6;\n border-top: 1px solid #e5e7eb;\n align-items: center;\n justify-content: space-between;\n padding: 0 8px;\n flex-shrink: 0;\n }\n nine-table-sheets .nine-tab-bar {\n display: flex;\n align-items: center;\n gap: 2px;\n overflow-x: auto;\n flex: 1;\n height: 100%;\n }\n nine-table-sheets .nine-tab-item {\n padding: 4px 12px;\n cursor: pointer;\n font-size: 12px;\n color: #4b5563;\n background: #e5e7eb;\n border: 1px solid #d1d5db;\n border-top: none;\n border-radius: 0 0 3px 3px;\n user-select: none;\n }\n nine-table-sheets .nine-tab-item.active {\n background: #ffffff;\n color: #111827;\n font-weight: 600;\n border-bottom: 2px solid #2563eb;\n }\n nine-table-sheets .sheets-counter {\n font-size: 12px;\n color: #6b7280;\n padding-left: 12px;\n flex-shrink: 0;\n }\n </style>\n \n <nine-table-header></nine-table-header>\n <nine-table-body>\n <nine-table-summary></nine-table-summary>\n <nine-table-sheets>\n <nine-table-sheets-body>${sheetsHtml}</nine-table-sheets-body>\n <nine-table-sheets-footer>\n <div class=\"nine-tab-bar\">${tabsHtml}</div>\n <div class=\"sheets-counter\">Total : <span id=\"row-count\">0</span></div>\n </nine-table-sheets-footer>\n </nine-table-sheets>\n <nine-table-analysis></nine-table-analysis>\n </nine-table-body>\n <nine-table-footer></nine-table-footer>\n `;\n\n const $sheetElements = this.#root.querySelectorAll('nine-table-sheet');\n\n $sheetElements?.forEach(($el, idx) => {\n if (rawTables[idx]) {\n setTimeout( () => {\n $el.init(rawTables[idx]);\n })\n }\n });\n };\n}","import {trace} from \"@nopeer\";\nimport { LayoutManager } from '../ui/LayoutManager.js';\n\nexport default class NineTable extends HTMLElement {\n #created = false;\n\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n }\n\n connectedCallback() {\n if (this.#created) return;\n\n // shadowRoot 하나만 넘겨서 내부에서 레이아웃 및 테이블 수집 처리\n this.layoutManager = new LayoutManager(this.shadowRoot);\n //this.layoutManager.render();\n\n this.#created = true;\n trace.log('NineTable connected.');\n\n this.dispatchEvent(new CustomEvent('load', { bubbles: true, detail: { target: this } }));\n }\n\n disconnectedCallback() {\n trace.log('NineTable disconnected.');\n }\n}\n\nif (!customElements.get('nine-table')) {\n customElements.define('nine-table', NineTable);\n}"],"names":["_Trace","traceOrigin","__name","Trace","trace","_NineTableSheet","__privateAdd","_tableElement","__publicField","tableEl","clonedTable","__privateSet","__privateGet","_initializeTable","leftContainer","bodyContainer","rightContainer","bodyTable","el","leftTable","leftWidth","col","rightTable","rightWidth","tbl","_ensureColgroup","_ensureThead","firstRow","colCount","colgroup","defaultWidth","thead","_render","NineTableSheet","_NineTableSheets","_init","tabBar","e","tabItem","isMultiSelect","index","_switchSheet","body","tabItems","sheetElements","tab","idx","sheet","clickedTab","activeTabs","targetSheet","activeSheets","initialBasis","_updateSplitters","activeSheet","rowCountEl","splitter","splitIndex","leftSheet","rightSheet","NineTableSheets","_LayoutManager","shadowRoot","_root","rawTables","sheetsHtml","_","tabsHtml","$sheetElements","$el","LayoutManager","_NineTable","_created","NineTable"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"nine-table.umd.js","sources":["../src/external/NoPeer.js","../src/ui/nine-table-sheet.js","../src/ui/nine-table-sheets.js","../src/ui/LayoutManager.js","../src/core/nine-table.js"],"sourcesContent":["import { trace as traceOrigin } from '@ninebone/util';\n\nexport class Trace extends traceOrigin.constructor {\n constructor() {\n super();\n this.init(\"nine-table\", \"green\");\n }\n}\n\nexport const trace = new Trace();","import { trace } from \"@nopeer\";\n\nexport class NineTableSheet extends HTMLElement {\n #tableElement = null;\n\n constructor() {\n super();\n }\n\n connectedCallback() {\n this.#render();\n };\n\n init = (tableEl) => {\n if (!tableEl) return;\n\n const initializeTable = (tbl) => {\n\n const ensureColgroup = (tbl) => {\n if (tbl.querySelector('colgroup')) return;\n\n const firstRow = tbl.querySelector('tbody tr') || tbl.querySelector('tr');\n const colCount = firstRow ? firstRow.querySelectorAll('th, td').length : 1;\n\n const colgroup = document.createElement('colgroup');\n const defaultWidth = Math.max(Math.floor((tbl.clientWidth || 600) / colCount), 100);\n\n for (let i = 0; i < colCount; i++) {\n const col = document.createElement('col');\n col.setAttribute('width', defaultWidth);\n colgroup.appendChild(col);\n }\n tbl.prepend(colgroup);\n };\n\n const ensureThead = (tbl) => {\n if (tbl.querySelector('thead')) return;\n\n const thead = document.createElement('thead');\n const colgroup = tbl.querySelector('colgroup');\n\n if (colgroup) {\n colgroup.after(thead);\n } else {\n tbl.prepend(thead);\n }\n };\n\n ensureColgroup(tbl);\n ensureThead(tbl);\n\n tbl.classList.add('nine-table-element');\n return tbl;\n };\n\n const clonedTable = tableEl.cloneNode(true);\n this.#tableElement = initializeTable(clonedTable);\n this.#tableElement.style.display = 'table';\n\n const leftContainer = this.querySelector('.ng-container-left');\n const bodyContainer = this.querySelector('.ng-container-body');\n const rightContainer = this.querySelector('.ng-container-right');\n\n // 1. 메인 바디 영역 (좌우 고정 컬럼 제외)\n if (bodyContainer) {\n const bodyTable = this.#tableElement.cloneNode(true);\n\n bodyTable.querySelectorAll('[fixed=\"left\"], [fixed=\"right\"]').forEach(el => el.remove());\n bodyContainer.innerHTML = '';\n bodyContainer.appendChild(bodyTable);\n }\n\n // 2. 좌측 고정 영역 처리 (flex 기반 너비 설정)\n if (leftContainer) {\n const leftTable = this.#tableElement.cloneNode(true);\n leftTable.querySelectorAll('col, th, td').forEach(el => {\n if (el.getAttribute('fixed') !== 'left') el.remove();\n });\n\n let leftWidth = 0;\n leftTable.querySelectorAll('col').forEach(col => {\n leftWidth += parseInt(col.getAttribute('width') || 0, 10);\n });\n\n leftContainer.innerHTML = '';\n leftContainer.appendChild(leftTable);\n\n if (leftWidth > 0) {\n leftContainer.style.flex = `0 0 ${leftWidth}px`;\n leftContainer.style.minWidth = `${leftWidth}px`;\n }\n }\n\n // 3. 우측 고정 영역 처리 (flex 기반 너비 설정)\n if (rightContainer) {\n const rightTable = this.#tableElement.cloneNode(true);\n rightTable.querySelectorAll('col, th, td').forEach(el => {\n if (el.getAttribute('fixed') !== 'right') el.remove();\n });\n\n let rightWidth = 0;\n rightTable.querySelectorAll('col').forEach(col => {\n rightWidth += parseInt(col.getAttribute('width') || 0, 10);\n });\n\n rightContainer.innerHTML = '';\n rightContainer.appendChild(rightTable);\n\n if (rightWidth > 0) {\n rightContainer.style.flex = `0 0 ${rightWidth}px`;\n rightContainer.style.minWidth = `${rightWidth}px`;\n }\n }\n\n trace.log(`NineTableSheet 3-split initialized with rows: ${this.getRowCount()}`);\n };\n\n getRowCount = () => {\n if (!this.#tableElement) return 0;\n return this.#tableElement.querySelectorAll('tbody tr').length;\n };\n\n #render = () => {\n this.innerHTML = `\n <style>\n nine-table-sheet {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n position: relative;\n box-sizing: border-box;\n background: #ffffff;\n overflow: hidden;\n }\n \n nine-table-sheet .ng-container-top {\n display: flex;\n flex-direction: row;\n flex: 1;\n width: 100%;\n overflow: hidden;\n position: relative;\n }\n \n nine-table-sheet .ng-container-left {\n overflow: hidden;\n background: #ffffff;\n border-right: 1px solid #e5e7eb;\n }\n \n nine-table-sheet .ng-container-body {\n flex: 1;\n overflow: auto;\n background: #ffffff;\n position: relative;\n }\n \n nine-table-sheet .ng-container-right {\n overflow: hidden;\n background: #ffffff;\n border-left: 1px solid #e5e7eb;\n }\n \n nine-table-sheet .ng-container-bottom {\n display: flex;\n flex-direction: row;\n height: 16px;\n flex-shrink: 0;\n background: #f9fafb;\n border-top: 1px solid #e5e7eb;\n }\n \n nine-table-sheet nine-table-hscrollbar {\n flex: 1;\n overflow: hidden;\n display: block;\n }\n \n nine-table-sheet .ng-scroll-edge {\n width: 16px;\n flex-shrink: 0;\n background: #f3f4f6;\n }\n \n nine-table-sheet table {\n border-collapse: collapse;\n width: 100%;\n table-layout: fixed;\n }\n \n nine-table-sheet th, nine-table-sheet td {\n box-sizing: border-box;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n padding: 6px 8px;\n border: 1px solid #e5e7eb;\n font-size: 12px;\n color: #111827;\n }\n \n nine-table-sheet th {\n background-color: #f9fafb;\n font-weight: 600;\n text-align: left;\n }\n </style>\n \n <div class='ng-container-top'>\n <div class='ng-container-left'></div>\n <div class='ng-container-body'></div>\n <div class='ng-container-right'></div>\n <nine-table-vscrollbar></nine-table-vscrollbar>\n </div>\n <div class='ng-container-bottom'>\n <nine-table-hscrollbar></nine-table-hscrollbar>\n <div class='ng-scroll-edge'></div>\n </div>\n `;\n };\n\n disconnectedCallback() {\n this.innerHTML = '';\n trace.log('NineTableSheet destroyed.');\n };\n}\n\nif (!customElements.get('nine-table-sheet')) {\n customElements.define('nine-table-sheet', NineTableSheet);\n}","import './nine-table-sheet.js';\n\nexport class NineTableSheets extends HTMLElement {\n constructor() {\n super();\n }\n\n connectedCallback() {\n this.#init();\n };\n\n #init = () => {\n const tabBar = this.querySelector('.nine-tab-bar');\n if (!tabBar) return;\n\n tabBar.addEventListener('click', (e) => {\n const tabItem = e.target.closest('.nine-tab-item');\n if (!tabItem) return;\n\n const isMultiSelect = e.ctrlKey || e.metaKey || e.shiftKey;\n const index = parseInt(tabItem.dataset.index, 10);\n this.switchSheet(index, isMultiSelect);\n });\n\n this.switchSheet(0, false);\n };\n\n switchSheet = (index, isMultiSelect = false) => {\n\n const updateSplitters = () => {\n const body = this.querySelector('nine-table-sheets-body');\n const splitters = body.querySelectorAll('nine-splitter');\n splitters.forEach(splitter => {\n const splitIndex = parseInt(splitter.dataset.splitIndex, 10);\n const leftSheet = body.querySelector(`nine-table-sheet[data-index=\"${splitIndex - 1}\"]`);\n const rightSheet = body.querySelector(`nine-table-sheet[data-index=\"${splitIndex}\"]`);\n\n if (leftSheet && rightSheet && leftSheet.classList.contains('active') && rightSheet.classList.contains('active')) {\n splitter.classList.add('active');\n } else {\n splitter.classList.remove('active');\n }\n });\n };\n\n const tabBar = this.querySelector('.nine-tab-bar');\n const body = this.querySelector('nine-table-sheets-body');\n const tabItems = tabBar.querySelectorAll('.nine-tab-item');\n const sheetElements = body.querySelectorAll('nine-table-sheet');\n\n if (!tabItems[index]) return;\n\n if (!isMultiSelect) {\n tabItems.forEach((tab, idx) => {\n tab.classList.toggle('active', idx === index);\n const sheet = body.querySelector(`nine-table-sheet[data-index=\"${idx}\"]`);\n if (sheet) sheet.style.flex = '';\n });\n sheetElements.forEach((sheet, idx) => {\n sheet.classList.toggle('active', idx === index);\n });\n } else {\n const clickedTab = tabItems[index];\n const activeTabs = tabBar.querySelectorAll('.nine-tab-item.active');\n\n if (clickedTab.classList.contains('active') && activeTabs.length <= 1) {\n return;\n }\n\n clickedTab.classList.toggle('active');\n const targetSheet = body.querySelector(`nine-table-sheet[data-index=\"${index}\"]`);\n if (targetSheet) {\n targetSheet.classList.toggle('active');\n if (!targetSheet.classList.contains('active')) {\n targetSheet.style.flex = '';\n }\n }\n }\n\n const activeSheets = Array.from(body.querySelectorAll('nine-table-sheet.active'));\n if (activeSheets.length > 1) {\n const initialBasis = (1 / activeSheets.length);\n activeSheets.forEach(sheet => {\n if (!sheet.style.flex || sheet.style.flex === '1 1 100%') {\n sheet.style.flex = `${initialBasis} ${initialBasis} 0px`;\n }\n });\n } else {\n activeSheets.forEach(sheet => {\n sheet.style.flex = '1 1 100%';\n });\n }\n\n updateSplitters();\n\n const activeSheet = body.querySelector(`nine-table-sheet.active`);\n if (activeSheet && typeof activeSheet.getRowCount === 'function') {\n const rowCountEl = this.querySelector('#row-count');\n if (rowCountEl) {\n rowCountEl.textContent = activeSheet.getRowCount().toLocaleString();\n }\n }\n };\n\n\n}\n\nif (!customElements.get('nine-table-sheets')) {\n customElements.define('nine-table-sheets', NineTableSheets);\n}","import './nine-table-sheets.js';\n\nexport class LayoutManager {\n #root;\n\n constructor(shadowRoot) {\n this.#root = shadowRoot;\n this.#render();\n }\n\n #render = () => {\n const rawElements = Array.from(this.#root.host.children);\n const rawTables = rawElements.filter(el => el.tagName === 'TABLE');\n\n const sheetsHtml = rawTables.map((_, idx) => {\n const className = idx === 0 ? 'active' : '';\n return `<nine-table-sheet class=\"${className}\" data-index=\"${idx}\"></nine-table-sheet>`;\n }).join('');\n\n const tabsHtml = rawTables.map((_, idx) => {\n const className = idx === 0 ? 'active' : '';\n return `<div class=\"nine-tab-item ${className}\" data-index=\"${idx}\">Sheet ${idx + 1}</div>`;\n }).join('');\n\n this.#root.innerHTML = `\n <style>\n :host { display: flex; flex-direction: column; position: relative; overflow: hidden; height: 100%; background: #fff; }\n nine-table-header { height: 40px; display: block; flex-shrink: 0; border-bottom: 1px solid #e5e7eb; background: #fff; }\n nine-table-body { display: flex; flex-direction: row; flex: 1; overflow: hidden; position: relative; }\n nine-table-summary { display: none; width: 250px; flex-shrink: 0; border-right: 1px solid #e5e7eb; }\n nine-splitter:not([data-split-index]) { width: 4px; background: #e5e7eb; cursor: col-resize; flex-shrink: 0; }\n nine-table-analysis { display: none; }\n nine-table-footer { display: none; }\n\n nine-table-sheets {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n position: relative;\n background: #fff;\n }\n nine-table-sheets-body {\n flex: 1;\n overflow: auto;\n position: relative;\n display: flex;\n flex-direction: row;\n }\n nine-table-sheet {\n display: none !important;\n height: 100%;\n overflow: auto;\n flex: 1 1 100%;\n }\n nine-table-sheet.active {\n display: block !important;\n }\n nine-table-sheets-footer {\n display: flex;\n height: 32px;\n background: #f3f4f6;\n border-top: 1px solid #e5e7eb;\n align-items: center;\n justify-content: space-between;\n padding: 0 8px;\n flex-shrink: 0;\n }\n nine-table-sheets .nine-tab-bar {\n display: flex;\n align-items: center;\n gap: 2px;\n overflow-x: auto;\n flex: 1;\n height: 100%;\n }\n nine-table-sheets .nine-tab-item {\n padding: 4px 12px;\n cursor: pointer;\n font-size: 12px;\n color: #4b5563;\n background: #e5e7eb;\n border: 1px solid #d1d5db;\n border-top: none;\n border-radius: 0 0 3px 3px;\n user-select: none;\n }\n nine-table-sheets .nine-tab-item.active {\n background: #ffffff;\n color: #111827;\n font-weight: 600;\n border-bottom: 2px solid #2563eb;\n }\n nine-table-sheets .sheets-counter {\n font-size: 12px;\n color: #6b7280;\n padding-left: 12px;\n flex-shrink: 0;\n }\n </style>\n \n <nine-table-header></nine-table-header>\n <nine-table-body>\n <nine-table-summary></nine-table-summary>\n <nine-table-sheets>\n <nine-table-sheets-body>${sheetsHtml}</nine-table-sheets-body>\n <nine-table-sheets-footer>\n <div class=\"nine-tab-bar\">${tabsHtml}</div>\n <div class=\"sheets-counter\">Total : <span id=\"row-count\">0</span></div>\n </nine-table-sheets-footer>\n </nine-table-sheets>\n <nine-table-analysis></nine-table-analysis>\n </nine-table-body>\n <nine-table-footer></nine-table-footer>\n `;\n\n const $sheetElements = this.#root.querySelectorAll('nine-table-sheet');\n\n $sheetElements?.forEach(($el, idx) => {\n if (rawTables[idx]) {\n setTimeout( () => {\n $el.init(rawTables[idx]);\n })\n }\n });\n };\n}","import {trace} from \"@nopeer\";\nimport { LayoutManager } from '../ui/LayoutManager.js';\n\nexport default class NineTable extends HTMLElement {\n #created = false;\n\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n }\n\n connectedCallback() {\n if (this.#created) return;\n\n // shadowRoot 하나만 넘겨서 내부에서 레이아웃 및 테이블 수집 처리\n this.layoutManager = new LayoutManager(this.shadowRoot);\n //this.layoutManager.render();\n\n this.#created = true;\n trace.log('NineTable connected.');\n\n this.dispatchEvent(new CustomEvent('load', { bubbles: true, detail: { target: this } }));\n }\n\n disconnectedCallback() {\n trace.log('NineTable disconnected.');\n }\n}\n\nif (!customElements.get('nine-table')) {\n customElements.define('nine-table', NineTable);\n}"],"names":["_Trace","traceOrigin","__name","Trace","trace","_NineTableSheet","__privateAdd","_tableElement","__publicField","tableEl","initializeTable","tbl","ensureColgroup","firstRow","colCount","colgroup","defaultWidth","i","col","ensureThead","thead","clonedTable","__privateSet","__privateGet","leftContainer","bodyContainer","rightContainer","bodyTable","el","leftTable","leftWidth","rightTable","rightWidth","_render","NineTableSheet","_NineTableSheets","_init","tabBar","e","tabItem","isMultiSelect","index","updateSplitters","body","splitter","splitIndex","leftSheet","rightSheet","tabItems","sheetElements","tab","idx","sheet","clickedTab","activeTabs","targetSheet","activeSheets","initialBasis","activeSheet","rowCountEl","NineTableSheets","_LayoutManager","shadowRoot","_root","rawTables","sheetsHtml","_","tabsHtml","$sheetElements","$el","LayoutManager","_NineTable","_created","NineTable"],"mappings":"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"}
|