ninegrid2 6.750.0 → 6.751.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.
@@ -121169,48 +121169,47 @@ class nxSplitter extends HTMLElement {
121169
121169
 
121170
121170
  #prepareLayout = () => {
121171
121171
  const isHorizontal = this.#mode === "h";
121172
- const splitterSize = isHorizontal ? this.offsetWidth : this.offsetHeight;
121172
+
121173
121173
  const prev = this.previousElementSibling;
121174
121174
  const next = this.nextElementSibling;
121175
121175
  const parent = this.parentElement;
121176
121176
  if (!prev || !next || !parent) return;
121177
121177
 
121178
+ // ⛓ splitter의 실제 크기 고정 기준 (최초 생성 기준)
121179
+ const splitterSize = isHorizontal ? this.offsetWidth : this.offsetHeight;
121180
+
121181
+ // 전체 부모 사이즈 측정
121178
121182
  const parentSize = isHorizontal
121179
121183
  ? parent.getBoundingClientRect().width
121180
121184
  : parent.getBoundingClientRect().height;
121181
121185
 
121182
- // 현재 패널 크기 측정
121186
+ // splitter 제외한 나머지 공간
121187
+ const available = parentSize - splitterSize;
121188
+
121189
+ // 현재 prev/next 실제 크기 기준으로 비율 역산
121183
121190
  const prevSize = isHorizontal ? prev.offsetWidth : prev.offsetHeight;
121184
121191
  const nextSize = isHorizontal ? next.offsetWidth : next.offsetHeight;
121185
121192
  const totalPanelSize = prevSize + nextSize;
121186
121193
 
121187
- // 현재 비율 계산
121188
121194
  const prevRatio = totalPanelSize ? prevSize / totalPanelSize : 0.5;
121189
121195
  const nextRatio = 1 - prevRatio;
121190
121196
 
121191
- // 새로운 available 크기
121192
- const available = parentSize - splitterSize;
121193
-
121197
+ // 비율 기반으로 pixel 크기 다시 계산
121194
121198
  const newPrevSize = available * prevRatio;
121195
121199
  const newNextSize = available * nextRatio;
121196
121200
 
121197
121201
  if (isHorizontal) {
121198
121202
  prev.style.width = `${newPrevSize}px`;
121203
+ next.style.width = `${newNextSize}px`;
121199
121204
  this.style.width = `${splitterSize}px`;
121200
-
121201
- if (this.#isLastSplitter()) {
121202
- next.style.width = `${newNextSize}px`;
121203
- }
121204
121205
  } else {
121205
121206
  prev.style.height = `${newPrevSize}px`;
121207
+ next.style.height = `${newNextSize}px`;
121206
121208
  this.style.height = `${splitterSize}px`;
121207
-
121208
- if (this.#isLastSplitter()) {
121209
- next.style.height = `${newNextSize}px`;
121210
- }
121211
121209
  }
121212
121210
  };
121213
121211
 
121212
+
121214
121213
  }
121215
121214
 
121216
121215
  customElements.define("nx-splitter", nxSplitter);
@@ -121165,48 +121165,47 @@ class nxSplitter extends HTMLElement {
121165
121165
 
121166
121166
  #prepareLayout = () => {
121167
121167
  const isHorizontal = this.#mode === "h";
121168
- const splitterSize = isHorizontal ? this.offsetWidth : this.offsetHeight;
121168
+
121169
121169
  const prev = this.previousElementSibling;
121170
121170
  const next = this.nextElementSibling;
121171
121171
  const parent = this.parentElement;
121172
121172
  if (!prev || !next || !parent) return;
121173
121173
 
121174
+ // ⛓ splitter의 실제 크기 고정 기준 (최초 생성 기준)
121175
+ const splitterSize = isHorizontal ? this.offsetWidth : this.offsetHeight;
121176
+
121177
+ // 전체 부모 사이즈 측정
121174
121178
  const parentSize = isHorizontal
121175
121179
  ? parent.getBoundingClientRect().width
121176
121180
  : parent.getBoundingClientRect().height;
121177
121181
 
121178
- // 현재 패널 크기 측정
121182
+ // splitter 제외한 나머지 공간
121183
+ const available = parentSize - splitterSize;
121184
+
121185
+ // 현재 prev/next 실제 크기 기준으로 비율 역산
121179
121186
  const prevSize = isHorizontal ? prev.offsetWidth : prev.offsetHeight;
121180
121187
  const nextSize = isHorizontal ? next.offsetWidth : next.offsetHeight;
121181
121188
  const totalPanelSize = prevSize + nextSize;
121182
121189
 
121183
- // 현재 비율 계산
121184
121190
  const prevRatio = totalPanelSize ? prevSize / totalPanelSize : 0.5;
121185
121191
  const nextRatio = 1 - prevRatio;
121186
121192
 
121187
- // 새로운 available 크기
121188
- const available = parentSize - splitterSize;
121189
-
121193
+ // 비율 기반으로 pixel 크기 다시 계산
121190
121194
  const newPrevSize = available * prevRatio;
121191
121195
  const newNextSize = available * nextRatio;
121192
121196
 
121193
121197
  if (isHorizontal) {
121194
121198
  prev.style.width = `${newPrevSize}px`;
121199
+ next.style.width = `${newNextSize}px`;
121195
121200
  this.style.width = `${splitterSize}px`;
121196
-
121197
- if (this.#isLastSplitter()) {
121198
- next.style.width = `${newNextSize}px`;
121199
- }
121200
121201
  } else {
121201
121202
  prev.style.height = `${newPrevSize}px`;
121203
+ next.style.height = `${newNextSize}px`;
121202
121204
  this.style.height = `${splitterSize}px`;
121203
-
121204
- if (this.#isLastSplitter()) {
121205
- next.style.height = `${newNextSize}px`;
121206
- }
121207
121205
  }
121208
121206
  };
121209
121207
 
121208
+
121210
121209
  }
121211
121210
 
121212
121211
  customElements.define("nx-splitter", nxSplitter);
@@ -181,48 +181,47 @@ class nxSplitter extends HTMLElement {
181
181
 
182
182
  #prepareLayout = () => {
183
183
  const isHorizontal = this.#mode === "h";
184
- const splitterSize = isHorizontal ? this.offsetWidth : this.offsetHeight;
184
+
185
185
  const prev = this.previousElementSibling;
186
186
  const next = this.nextElementSibling;
187
187
  const parent = this.parentElement;
188
188
  if (!prev || !next || !parent) return;
189
189
 
190
+ // ⛓ splitter의 실제 크기 고정 기준 (최초 생성 기준)
191
+ const splitterSize = isHorizontal ? this.offsetWidth : this.offsetHeight;
192
+
193
+ // 전체 부모 사이즈 측정
190
194
  const parentSize = isHorizontal
191
195
  ? parent.getBoundingClientRect().width
192
196
  : parent.getBoundingClientRect().height;
193
197
 
194
- // 현재 패널 크기 측정
198
+ // splitter 제외한 나머지 공간
199
+ const available = parentSize - splitterSize;
200
+
201
+ // 현재 prev/next 실제 크기 기준으로 비율 역산
195
202
  const prevSize = isHorizontal ? prev.offsetWidth : prev.offsetHeight;
196
203
  const nextSize = isHorizontal ? next.offsetWidth : next.offsetHeight;
197
204
  const totalPanelSize = prevSize + nextSize;
198
205
 
199
- // 현재 비율 계산
200
206
  const prevRatio = totalPanelSize ? prevSize / totalPanelSize : 0.5;
201
207
  const nextRatio = 1 - prevRatio;
202
208
 
203
- // 새로운 available 크기
204
- const available = parentSize - splitterSize;
205
-
209
+ // 비율 기반으로 pixel 크기 다시 계산
206
210
  const newPrevSize = available * prevRatio;
207
211
  const newNextSize = available * nextRatio;
208
212
 
209
213
  if (isHorizontal) {
210
214
  prev.style.width = `${newPrevSize}px`;
215
+ next.style.width = `${newNextSize}px`;
211
216
  this.style.width = `${splitterSize}px`;
212
-
213
- if (this.#isLastSplitter()) {
214
- next.style.width = `${newNextSize}px`;
215
- }
216
217
  } else {
217
218
  prev.style.height = `${newPrevSize}px`;
219
+ next.style.height = `${newNextSize}px`;
218
220
  this.style.height = `${splitterSize}px`;
219
-
220
- if (this.#isLastSplitter()) {
221
- next.style.height = `${newNextSize}px`;
222
- }
223
221
  }
224
222
  };
225
223
 
224
+
226
225
  }
227
226
 
228
227
  customElements.define("nx-splitter", nxSplitter);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "ninegrid2",
3
3
  "type": "module",
4
- "version": "6.750.0",
4
+ "version": "6.751.0",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
7
7
  "exports": {
@@ -181,48 +181,47 @@ class nxSplitter extends HTMLElement {
181
181
 
182
182
  #prepareLayout = () => {
183
183
  const isHorizontal = this.#mode === "h";
184
- const splitterSize = isHorizontal ? this.offsetWidth : this.offsetHeight;
184
+
185
185
  const prev = this.previousElementSibling;
186
186
  const next = this.nextElementSibling;
187
187
  const parent = this.parentElement;
188
188
  if (!prev || !next || !parent) return;
189
189
 
190
+ // ⛓ splitter의 실제 크기 고정 기준 (최초 생성 기준)
191
+ const splitterSize = isHorizontal ? this.offsetWidth : this.offsetHeight;
192
+
193
+ // 전체 부모 사이즈 측정
190
194
  const parentSize = isHorizontal
191
195
  ? parent.getBoundingClientRect().width
192
196
  : parent.getBoundingClientRect().height;
193
197
 
194
- // 현재 패널 크기 측정
198
+ // splitter 제외한 나머지 공간
199
+ const available = parentSize - splitterSize;
200
+
201
+ // 현재 prev/next 실제 크기 기준으로 비율 역산
195
202
  const prevSize = isHorizontal ? prev.offsetWidth : prev.offsetHeight;
196
203
  const nextSize = isHorizontal ? next.offsetWidth : next.offsetHeight;
197
204
  const totalPanelSize = prevSize + nextSize;
198
205
 
199
- // 현재 비율 계산
200
206
  const prevRatio = totalPanelSize ? prevSize / totalPanelSize : 0.5;
201
207
  const nextRatio = 1 - prevRatio;
202
208
 
203
- // 새로운 available 크기
204
- const available = parentSize - splitterSize;
205
-
209
+ // 비율 기반으로 pixel 크기 다시 계산
206
210
  const newPrevSize = available * prevRatio;
207
211
  const newNextSize = available * nextRatio;
208
212
 
209
213
  if (isHorizontal) {
210
214
  prev.style.width = `${newPrevSize}px`;
215
+ next.style.width = `${newNextSize}px`;
211
216
  this.style.width = `${splitterSize}px`;
212
-
213
- if (this.#isLastSplitter()) {
214
- next.style.width = `${newNextSize}px`;
215
- }
216
217
  } else {
217
218
  prev.style.height = `${newPrevSize}px`;
219
+ next.style.height = `${newNextSize}px`;
218
220
  this.style.height = `${splitterSize}px`;
219
-
220
- if (this.#isLastSplitter()) {
221
- next.style.height = `${newNextSize}px`;
222
- }
223
221
  }
224
222
  };
225
223
 
224
+
226
225
  }
227
226
 
228
227
  customElements.define("nx-splitter", nxSplitter);