ninegrid2 6.745.0 → 6.747.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.
@@ -121180,25 +121180,32 @@ class nxSplitter extends HTMLElement {
121180
121180
  const parentRect = parent.getBoundingClientRect();
121181
121181
  const totalSize = isHorizontal ? parentRect.width : parentRect.height;
121182
121182
 
121183
- // splitter 자체 포함한 전체 영역에서 prev/next 비율 계산
121183
+ // 현재 prev/next 크기로 비율 역산
121184
+ const prevSize = isHorizontal ? prev.offsetWidth : prev.offsetHeight;
121185
+ const nextSize = isHorizontal ? next.offsetWidth : next.offsetHeight;
121186
+
121187
+ const totalPanelSize = prevSize + nextSize;
121188
+
121189
+ // ➤ 현재 비율 계산
121190
+ const prevRatio = totalPanelSize > 0 ? prevSize / totalPanelSize : 0.5;
121191
+ const nextRatio = 1 - prevRatio;
121184
121192
  const splitterRatio = splitterSize / totalSize;
121185
- const eachRatio = (1 - splitterRatio) / 2;
121186
121193
 
121187
- if (isHorizontal) {
121188
- prev.style.width = `${eachRatio * 100}%`;
121194
+ const availableRatio = 1 - splitterRatio;
121189
121195
 
121190
- if (this.#isLastSplitter()) {
121191
- next.style.width = `${eachRatio * 100}%`;
121192
- }
121196
+ // 비율 기반 스타일 적용
121197
+ if (isHorizontal) {
121198
+ prev.style.width = `${availableRatio * prevRatio * 100}%`;
121199
+ next.style.width = `${availableRatio * nextRatio * 100}%`;
121200
+ this.style.width = `${splitterRatio * 100}%`;
121193
121201
  } else {
121194
- prev.style.height = `${eachRatio * 100}%`;
121195
-
121196
- if (this.#isLastSplitter()) {
121197
- next.style.height = `${eachRatio * 100}%`;
121198
- }
121202
+ prev.style.height = `${availableRatio * prevRatio * 100}%`;
121203
+ next.style.height = `${availableRatio * nextRatio * 100}%`;
121204
+ this.style.height = `${splitterRatio * 100}%`;
121199
121205
  }
121200
121206
  };
121201
121207
 
121208
+
121202
121209
  }
121203
121210
 
121204
121211
  customElements.define("nx-splitter", nxSplitter);
@@ -121176,25 +121176,32 @@ class nxSplitter extends HTMLElement {
121176
121176
  const parentRect = parent.getBoundingClientRect();
121177
121177
  const totalSize = isHorizontal ? parentRect.width : parentRect.height;
121178
121178
 
121179
- // splitter 자체 포함한 전체 영역에서 prev/next 비율 계산
121179
+ // 현재 prev/next 크기로 비율 역산
121180
+ const prevSize = isHorizontal ? prev.offsetWidth : prev.offsetHeight;
121181
+ const nextSize = isHorizontal ? next.offsetWidth : next.offsetHeight;
121182
+
121183
+ const totalPanelSize = prevSize + nextSize;
121184
+
121185
+ // ➤ 현재 비율 계산
121186
+ const prevRatio = totalPanelSize > 0 ? prevSize / totalPanelSize : 0.5;
121187
+ const nextRatio = 1 - prevRatio;
121180
121188
  const splitterRatio = splitterSize / totalSize;
121181
- const eachRatio = (1 - splitterRatio) / 2;
121182
121189
 
121183
- if (isHorizontal) {
121184
- prev.style.width = `${eachRatio * 100}%`;
121190
+ const availableRatio = 1 - splitterRatio;
121185
121191
 
121186
- if (this.#isLastSplitter()) {
121187
- next.style.width = `${eachRatio * 100}%`;
121188
- }
121192
+ // 비율 기반 스타일 적용
121193
+ if (isHorizontal) {
121194
+ prev.style.width = `${availableRatio * prevRatio * 100}%`;
121195
+ next.style.width = `${availableRatio * nextRatio * 100}%`;
121196
+ this.style.width = `${splitterRatio * 100}%`;
121189
121197
  } else {
121190
- prev.style.height = `${eachRatio * 100}%`;
121191
-
121192
- if (this.#isLastSplitter()) {
121193
- next.style.height = `${eachRatio * 100}%`;
121194
- }
121198
+ prev.style.height = `${availableRatio * prevRatio * 100}%`;
121199
+ next.style.height = `${availableRatio * nextRatio * 100}%`;
121200
+ this.style.height = `${splitterRatio * 100}%`;
121195
121201
  }
121196
121202
  };
121197
121203
 
121204
+
121198
121205
  }
121199
121206
 
121200
121207
  customElements.define("nx-splitter", nxSplitter);
@@ -192,25 +192,32 @@ class nxSplitter extends HTMLElement {
192
192
  const parentRect = parent.getBoundingClientRect();
193
193
  const totalSize = isHorizontal ? parentRect.width : parentRect.height;
194
194
 
195
- // splitter 자체 포함한 전체 영역에서 prev/next 비율 계산
195
+ // 현재 prev/next 크기로 비율 역산
196
+ const prevSize = isHorizontal ? prev.offsetWidth : prev.offsetHeight;
197
+ const nextSize = isHorizontal ? next.offsetWidth : next.offsetHeight;
198
+
199
+ const totalPanelSize = prevSize + nextSize;
200
+
201
+ // ➤ 현재 비율 계산
202
+ const prevRatio = totalPanelSize > 0 ? prevSize / totalPanelSize : 0.5;
203
+ const nextRatio = 1 - prevRatio;
196
204
  const splitterRatio = splitterSize / totalSize;
197
- const eachRatio = (1 - splitterRatio) / 2;
198
205
 
199
- if (isHorizontal) {
200
- prev.style.width = `${eachRatio * 100}%`;
206
+ const availableRatio = 1 - splitterRatio;
201
207
 
202
- if (this.#isLastSplitter()) {
203
- next.style.width = `${eachRatio * 100}%`;
204
- }
208
+ // 비율 기반 스타일 적용
209
+ if (isHorizontal) {
210
+ prev.style.width = `${availableRatio * prevRatio * 100}%`;
211
+ next.style.width = `${availableRatio * nextRatio * 100}%`;
212
+ this.style.width = `${splitterRatio * 100}%`;
205
213
  } else {
206
- prev.style.height = `${eachRatio * 100}%`;
207
-
208
- if (this.#isLastSplitter()) {
209
- next.style.height = `${eachRatio * 100}%`;
210
- }
214
+ prev.style.height = `${availableRatio * prevRatio * 100}%`;
215
+ next.style.height = `${availableRatio * nextRatio * 100}%`;
216
+ this.style.height = `${splitterRatio * 100}%`;
211
217
  }
212
218
  };
213
219
 
220
+
214
221
  }
215
222
 
216
223
  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.745.0",
4
+ "version": "6.747.0",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
7
7
  "exports": {
@@ -192,25 +192,32 @@ class nxSplitter extends HTMLElement {
192
192
  const parentRect = parent.getBoundingClientRect();
193
193
  const totalSize = isHorizontal ? parentRect.width : parentRect.height;
194
194
 
195
- // splitter 자체 포함한 전체 영역에서 prev/next 비율 계산
195
+ // 현재 prev/next 크기로 비율 역산
196
+ const prevSize = isHorizontal ? prev.offsetWidth : prev.offsetHeight;
197
+ const nextSize = isHorizontal ? next.offsetWidth : next.offsetHeight;
198
+
199
+ const totalPanelSize = prevSize + nextSize;
200
+
201
+ // ➤ 현재 비율 계산
202
+ const prevRatio = totalPanelSize > 0 ? prevSize / totalPanelSize : 0.5;
203
+ const nextRatio = 1 - prevRatio;
196
204
  const splitterRatio = splitterSize / totalSize;
197
- const eachRatio = (1 - splitterRatio) / 2;
198
205
 
199
- if (isHorizontal) {
200
- prev.style.width = `${eachRatio * 100}%`;
206
+ const availableRatio = 1 - splitterRatio;
201
207
 
202
- if (this.#isLastSplitter()) {
203
- next.style.width = `${eachRatio * 100}%`;
204
- }
208
+ // 비율 기반 스타일 적용
209
+ if (isHorizontal) {
210
+ prev.style.width = `${availableRatio * prevRatio * 100}%`;
211
+ next.style.width = `${availableRatio * nextRatio * 100}%`;
212
+ this.style.width = `${splitterRatio * 100}%`;
205
213
  } else {
206
- prev.style.height = `${eachRatio * 100}%`;
207
-
208
- if (this.#isLastSplitter()) {
209
- next.style.height = `${eachRatio * 100}%`;
210
- }
214
+ prev.style.height = `${availableRatio * prevRatio * 100}%`;
215
+ next.style.height = `${availableRatio * nextRatio * 100}%`;
216
+ this.style.height = `${splitterRatio * 100}%`;
211
217
  }
212
218
  };
213
219
 
220
+
214
221
  }
215
222
 
216
223
  customElements.define("nx-splitter", nxSplitter);