ninegrid2 6.678.0 → 6.680.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bundle.cjs.js +29 -3
- package/dist/bundle.esm.js +29 -3
- package/dist/nx/nxSplitter.js +29 -3
- package/package.json +1 -1
- package/src/nx/nxSplitter.js +29 -3
package/dist/bundle.cjs.js
CHANGED
|
@@ -121104,21 +121104,47 @@ class nxSplitter extends HTMLElement {
|
|
|
121104
121104
|
|
|
121105
121105
|
const onMove = e => {
|
|
121106
121106
|
const rect = parent.getBoundingClientRect();
|
|
121107
|
+
|
|
121107
121108
|
if (this.#mode === "h") {
|
|
121108
|
-
|
|
121109
|
+
let left = e.clientX - rect.left;
|
|
121110
|
+
left = Math.max(0, Math.min(left, rect.width)); // 0 ~ width 범위 제한
|
|
121109
121111
|
dragBar.style.left = `${left}px`;
|
|
121110
121112
|
} else {
|
|
121111
|
-
|
|
121113
|
+
let top = e.clientY - rect.top;
|
|
121114
|
+
top = Math.max(0, Math.min(top, rect.height)); // 0 ~ height 범위 제한
|
|
121112
121115
|
dragBar.style.top = `${top}px`;
|
|
121113
121116
|
}
|
|
121114
121117
|
};
|
|
121115
121118
|
|
|
121116
|
-
|
|
121119
|
+
|
|
121120
|
+
const onUp = e => {
|
|
121117
121121
|
window.removeEventListener("mousemove", onMove);
|
|
121118
121122
|
window.removeEventListener("mouseup", onUp);
|
|
121119
121123
|
dragBar.remove();
|
|
121124
|
+
|
|
121125
|
+
const parentRect = parent.getBoundingClientRect();
|
|
121126
|
+
|
|
121127
|
+
// 현재 드래그 위치 계산 (부모 기준)
|
|
121128
|
+
const position = (this.#mode === "h")
|
|
121129
|
+
? e.clientX - parentRect.left
|
|
121130
|
+
: e.clientY - parentRect.top;
|
|
121131
|
+
|
|
121132
|
+
// 형제 요소들
|
|
121133
|
+
const prev = this.previousElementSibling;
|
|
121134
|
+
const next = this.nextElementSibling;
|
|
121135
|
+
|
|
121136
|
+
if (!prev || !next) return;
|
|
121137
|
+
|
|
121138
|
+
if (this.#mode === "h") {
|
|
121139
|
+
prev.style.width = `${position}px`;
|
|
121140
|
+
next.style.width = `${parentRect.width - position - this.offsetWidth}px`;
|
|
121141
|
+
} else {
|
|
121142
|
+
prev.style.height = `${position}px`;
|
|
121143
|
+
next.style.height = `${parentRect.height - position - this.offsetHeight}px`;
|
|
121144
|
+
}
|
|
121120
121145
|
};
|
|
121121
121146
|
|
|
121147
|
+
|
|
121122
121148
|
window.addEventListener("mousemove", onMove);
|
|
121123
121149
|
window.addEventListener("mouseup", onUp);
|
|
121124
121150
|
};
|
package/dist/bundle.esm.js
CHANGED
|
@@ -121100,21 +121100,47 @@ class nxSplitter extends HTMLElement {
|
|
|
121100
121100
|
|
|
121101
121101
|
const onMove = e => {
|
|
121102
121102
|
const rect = parent.getBoundingClientRect();
|
|
121103
|
+
|
|
121103
121104
|
if (this.#mode === "h") {
|
|
121104
|
-
|
|
121105
|
+
let left = e.clientX - rect.left;
|
|
121106
|
+
left = Math.max(0, Math.min(left, rect.width)); // 0 ~ width 범위 제한
|
|
121105
121107
|
dragBar.style.left = `${left}px`;
|
|
121106
121108
|
} else {
|
|
121107
|
-
|
|
121109
|
+
let top = e.clientY - rect.top;
|
|
121110
|
+
top = Math.max(0, Math.min(top, rect.height)); // 0 ~ height 범위 제한
|
|
121108
121111
|
dragBar.style.top = `${top}px`;
|
|
121109
121112
|
}
|
|
121110
121113
|
};
|
|
121111
121114
|
|
|
121112
|
-
|
|
121115
|
+
|
|
121116
|
+
const onUp = e => {
|
|
121113
121117
|
window.removeEventListener("mousemove", onMove);
|
|
121114
121118
|
window.removeEventListener("mouseup", onUp);
|
|
121115
121119
|
dragBar.remove();
|
|
121120
|
+
|
|
121121
|
+
const parentRect = parent.getBoundingClientRect();
|
|
121122
|
+
|
|
121123
|
+
// 현재 드래그 위치 계산 (부모 기준)
|
|
121124
|
+
const position = (this.#mode === "h")
|
|
121125
|
+
? e.clientX - parentRect.left
|
|
121126
|
+
: e.clientY - parentRect.top;
|
|
121127
|
+
|
|
121128
|
+
// 형제 요소들
|
|
121129
|
+
const prev = this.previousElementSibling;
|
|
121130
|
+
const next = this.nextElementSibling;
|
|
121131
|
+
|
|
121132
|
+
if (!prev || !next) return;
|
|
121133
|
+
|
|
121134
|
+
if (this.#mode === "h") {
|
|
121135
|
+
prev.style.width = `${position}px`;
|
|
121136
|
+
next.style.width = `${parentRect.width - position - this.offsetWidth}px`;
|
|
121137
|
+
} else {
|
|
121138
|
+
prev.style.height = `${position}px`;
|
|
121139
|
+
next.style.height = `${parentRect.height - position - this.offsetHeight}px`;
|
|
121140
|
+
}
|
|
121116
121141
|
};
|
|
121117
121142
|
|
|
121143
|
+
|
|
121118
121144
|
window.addEventListener("mousemove", onMove);
|
|
121119
121145
|
window.addEventListener("mouseup", onUp);
|
|
121120
121146
|
};
|
package/dist/nx/nxSplitter.js
CHANGED
|
@@ -59,21 +59,47 @@ class nxSplitter extends HTMLElement {
|
|
|
59
59
|
|
|
60
60
|
const onMove = e => {
|
|
61
61
|
const rect = parent.getBoundingClientRect();
|
|
62
|
+
|
|
62
63
|
if (this.#mode === "h") {
|
|
63
|
-
|
|
64
|
+
let left = e.clientX - rect.left;
|
|
65
|
+
left = Math.max(0, Math.min(left, rect.width)); // 0 ~ width 범위 제한
|
|
64
66
|
dragBar.style.left = `${left}px`;
|
|
65
67
|
} else {
|
|
66
|
-
|
|
68
|
+
let top = e.clientY - rect.top;
|
|
69
|
+
top = Math.max(0, Math.min(top, rect.height)); // 0 ~ height 범위 제한
|
|
67
70
|
dragBar.style.top = `${top}px`;
|
|
68
71
|
}
|
|
69
72
|
};
|
|
70
73
|
|
|
71
|
-
|
|
74
|
+
|
|
75
|
+
const onUp = e => {
|
|
72
76
|
window.removeEventListener("mousemove", onMove);
|
|
73
77
|
window.removeEventListener("mouseup", onUp);
|
|
74
78
|
dragBar.remove();
|
|
79
|
+
|
|
80
|
+
const parentRect = parent.getBoundingClientRect();
|
|
81
|
+
|
|
82
|
+
// 현재 드래그 위치 계산 (부모 기준)
|
|
83
|
+
const position = (this.#mode === "h")
|
|
84
|
+
? e.clientX - parentRect.left
|
|
85
|
+
: e.clientY - parentRect.top;
|
|
86
|
+
|
|
87
|
+
// 형제 요소들
|
|
88
|
+
const prev = this.previousElementSibling;
|
|
89
|
+
const next = this.nextElementSibling;
|
|
90
|
+
|
|
91
|
+
if (!prev || !next) return;
|
|
92
|
+
|
|
93
|
+
if (this.#mode === "h") {
|
|
94
|
+
prev.style.width = `${position}px`;
|
|
95
|
+
next.style.width = `${parentRect.width - position - this.offsetWidth}px`;
|
|
96
|
+
} else {
|
|
97
|
+
prev.style.height = `${position}px`;
|
|
98
|
+
next.style.height = `${parentRect.height - position - this.offsetHeight}px`;
|
|
99
|
+
}
|
|
75
100
|
};
|
|
76
101
|
|
|
102
|
+
|
|
77
103
|
window.addEventListener("mousemove", onMove);
|
|
78
104
|
window.addEventListener("mouseup", onUp);
|
|
79
105
|
};
|
package/package.json
CHANGED
package/src/nx/nxSplitter.js
CHANGED
|
@@ -59,21 +59,47 @@ class nxSplitter extends HTMLElement {
|
|
|
59
59
|
|
|
60
60
|
const onMove = e => {
|
|
61
61
|
const rect = parent.getBoundingClientRect();
|
|
62
|
+
|
|
62
63
|
if (this.#mode === "h") {
|
|
63
|
-
|
|
64
|
+
let left = e.clientX - rect.left;
|
|
65
|
+
left = Math.max(0, Math.min(left, rect.width)); // 0 ~ width 범위 제한
|
|
64
66
|
dragBar.style.left = `${left}px`;
|
|
65
67
|
} else {
|
|
66
|
-
|
|
68
|
+
let top = e.clientY - rect.top;
|
|
69
|
+
top = Math.max(0, Math.min(top, rect.height)); // 0 ~ height 범위 제한
|
|
67
70
|
dragBar.style.top = `${top}px`;
|
|
68
71
|
}
|
|
69
72
|
};
|
|
70
73
|
|
|
71
|
-
|
|
74
|
+
|
|
75
|
+
const onUp = e => {
|
|
72
76
|
window.removeEventListener("mousemove", onMove);
|
|
73
77
|
window.removeEventListener("mouseup", onUp);
|
|
74
78
|
dragBar.remove();
|
|
79
|
+
|
|
80
|
+
const parentRect = parent.getBoundingClientRect();
|
|
81
|
+
|
|
82
|
+
// 현재 드래그 위치 계산 (부모 기준)
|
|
83
|
+
const position = (this.#mode === "h")
|
|
84
|
+
? e.clientX - parentRect.left
|
|
85
|
+
: e.clientY - parentRect.top;
|
|
86
|
+
|
|
87
|
+
// 형제 요소들
|
|
88
|
+
const prev = this.previousElementSibling;
|
|
89
|
+
const next = this.nextElementSibling;
|
|
90
|
+
|
|
91
|
+
if (!prev || !next) return;
|
|
92
|
+
|
|
93
|
+
if (this.#mode === "h") {
|
|
94
|
+
prev.style.width = `${position}px`;
|
|
95
|
+
next.style.width = `${parentRect.width - position - this.offsetWidth}px`;
|
|
96
|
+
} else {
|
|
97
|
+
prev.style.height = `${position}px`;
|
|
98
|
+
next.style.height = `${parentRect.height - position - this.offsetHeight}px`;
|
|
99
|
+
}
|
|
75
100
|
};
|
|
76
101
|
|
|
102
|
+
|
|
77
103
|
window.addEventListener("mousemove", onMove);
|
|
78
104
|
window.addEventListener("mouseup", onUp);
|
|
79
105
|
};
|