ninegrid2 6.1077.0 → 6.1079.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.
Files changed (5) hide show
  1. package/dist/bundle.cjs.js +19 -5
  2. package/dist/bundle.esm.js +19 -5
  3. package/dist/nx/nxSplitter.js +19 -5
  4. package/package.json +1 -1
  5. package/src/nx/nxSplitter.js +19 -5
package/dist/bundle.cjs.js CHANGED
@@ -121477,25 +121477,39 @@ class nxSplitter extends HTMLElement {
121477
121477
  }
121478
121478
  };
121479
121479
 
121480
- const onUp = () => {
121480
+ const onUp = (e) => {
121481
121481
  window.removeEventListener("mousemove", onMove);
121482
121482
  window.removeEventListener("mouseup", onUp);
121483
121483
  dragBar.remove();
121484
121484
 
121485
121485
  const allChildren = Array.from(parent.children);
121486
121486
  const allPanels = allChildren.filter(el => el.tagName.toLowerCase() !== 'nx-splitter');
121487
+ allChildren.filter(el => el.tagName.toLowerCase() === 'nx-splitter');
121487
121488
 
121488
121489
  const finalDragBarPos = isHorizontal ? parseFloat(dragBar.style.left) : parseFloat(dragBar.style.top);
121489
- const dragOffset = finalDragBarPos - initialSplitterPosInParent;
121490
+ const initialSplitterPos = isHorizontal ? this.getBoundingClientRect().left - parent.getBoundingClientRect().left : this.getBoundingClientRect().top - parent.getBoundingClientRect().top;
121490
121491
 
121491
- const prevSize = (isHorizontal ? prev.getBoundingClientRect().width : prev.getBoundingClientRect().height) - clickOffset;
121492
+ // ⭐⭐ dragOffset을 패널의 크기 범위 내로 제한 ⭐⭐
121493
+ let dragOffset = finalDragBarPos - initialSplitterPos;
121494
+
121495
+ const prevSize = isHorizontal ? prev.getBoundingClientRect().width : prev.getBoundingClientRect().height;
121492
121496
  const nextSize = isHorizontal ? next.getBoundingClientRect().width : next.getBoundingClientRect().height;
121493
121497
 
121498
+ // 최소 크기 제한 (0px)
121499
+ const minSize = 0;
121500
+
121501
+ // prev 패널이 최소 크기보다 작아지지 않도록 dragOffset 제한
121502
+ if (prevSize + dragOffset < minSize) {
121503
+ dragOffset = minSize - prevSize;
121504
+ }
121505
+ // next 패널이 최소 크기보다 작아지지 않도록 dragOffset 제한
121506
+ if (nextSize - dragOffset < minSize) {
121507
+ dragOffset = nextSize - minSize;
121508
+ }
121509
+
121494
121510
  const newPrevSize = prevSize + dragOffset;
121495
121511
  const newNextSize = nextSize - dragOffset;
121496
121512
 
121497
- console.log(prevSize, nextSize, newPrevSize, newNextSize);
121498
-
121499
121513
  const initialSizes = allPanels.map(panel => isHorizontal ? panel.getBoundingClientRect().width : panel.getBoundingClientRect().height);
121500
121514
 
121501
121515
  const totalSplitterSize = allChildren.reduce((sum, child) => {
package/dist/bundle.esm.js CHANGED
@@ -121473,25 +121473,39 @@ class nxSplitter extends HTMLElement {
121473
121473
  }
121474
121474
  };
121475
121475
 
121476
- const onUp = () => {
121476
+ const onUp = (e) => {
121477
121477
  window.removeEventListener("mousemove", onMove);
121478
121478
  window.removeEventListener("mouseup", onUp);
121479
121479
  dragBar.remove();
121480
121480
 
121481
121481
  const allChildren = Array.from(parent.children);
121482
121482
  const allPanels = allChildren.filter(el => el.tagName.toLowerCase() !== 'nx-splitter');
121483
+ allChildren.filter(el => el.tagName.toLowerCase() === 'nx-splitter');
121483
121484
 
121484
121485
  const finalDragBarPos = isHorizontal ? parseFloat(dragBar.style.left) : parseFloat(dragBar.style.top);
121485
- const dragOffset = finalDragBarPos - initialSplitterPosInParent;
121486
+ const initialSplitterPos = isHorizontal ? this.getBoundingClientRect().left - parent.getBoundingClientRect().left : this.getBoundingClientRect().top - parent.getBoundingClientRect().top;
121486
121487
 
121487
- const prevSize = (isHorizontal ? prev.getBoundingClientRect().width : prev.getBoundingClientRect().height) - clickOffset;
121488
+ // ⭐⭐ dragOffset을 패널의 크기 범위 내로 제한 ⭐⭐
121489
+ let dragOffset = finalDragBarPos - initialSplitterPos;
121490
+
121491
+ const prevSize = isHorizontal ? prev.getBoundingClientRect().width : prev.getBoundingClientRect().height;
121488
121492
  const nextSize = isHorizontal ? next.getBoundingClientRect().width : next.getBoundingClientRect().height;
121489
121493
 
121494
+ // 최소 크기 제한 (0px)
121495
+ const minSize = 0;
121496
+
121497
+ // prev 패널이 최소 크기보다 작아지지 않도록 dragOffset 제한
121498
+ if (prevSize + dragOffset < minSize) {
121499
+ dragOffset = minSize - prevSize;
121500
+ }
121501
+ // next 패널이 최소 크기보다 작아지지 않도록 dragOffset 제한
121502
+ if (nextSize - dragOffset < minSize) {
121503
+ dragOffset = nextSize - minSize;
121504
+ }
121505
+
121490
121506
  const newPrevSize = prevSize + dragOffset;
121491
121507
  const newNextSize = nextSize - dragOffset;
121492
121508
 
121493
- console.log(prevSize, nextSize, newPrevSize, newNextSize);
121494
-
121495
121509
  const initialSizes = allPanels.map(panel => isHorizontal ? panel.getBoundingClientRect().width : panel.getBoundingClientRect().height);
121496
121510
 
121497
121511
  const totalSplitterSize = allChildren.reduce((sum, child) => {
package/dist/nx/nxSplitter.js CHANGED
@@ -110,25 +110,39 @@ class nxSplitter extends HTMLElement {
110
110
  }
111
111
  };
112
112
 
113
- const onUp = () => {
113
+ const onUp = (e) => {
114
114
  window.removeEventListener("mousemove", onMove);
115
115
  window.removeEventListener("mouseup", onUp);
116
116
  dragBar.remove();
117
117
 
118
118
  const allChildren = Array.from(parent.children);
119
119
  const allPanels = allChildren.filter(el => el.tagName.toLowerCase() !== 'nx-splitter');
120
+ const allSplitters = allChildren.filter(el => el.tagName.toLowerCase() === 'nx-splitter');
120
121
 
121
122
  const finalDragBarPos = isHorizontal ? parseFloat(dragBar.style.left) : parseFloat(dragBar.style.top);
122
- const dragOffset = finalDragBarPos - initialSplitterPosInParent;
123
+ const initialSplitterPos = isHorizontal ? this.getBoundingClientRect().left - parent.getBoundingClientRect().left : this.getBoundingClientRect().top - parent.getBoundingClientRect().top;
123
124
 
124
- const prevSize = (isHorizontal ? prev.getBoundingClientRect().width : prev.getBoundingClientRect().height) - clickOffset;
125
+ // ⭐⭐ dragOffset을 패널의 크기 범위 내로 제한 ⭐⭐
126
+ let dragOffset = finalDragBarPos - initialSplitterPos;
127
+
128
+ const prevSize = isHorizontal ? prev.getBoundingClientRect().width : prev.getBoundingClientRect().height;
125
129
  const nextSize = isHorizontal ? next.getBoundingClientRect().width : next.getBoundingClientRect().height;
126
130
 
131
+ // 최소 크기 제한 (0px)
132
+ const minSize = 0;
133
+
134
+ // prev 패널이 최소 크기보다 작아지지 않도록 dragOffset 제한
135
+ if (prevSize + dragOffset < minSize) {
136
+ dragOffset = minSize - prevSize;
137
+ }
138
+ // next 패널이 최소 크기보다 작아지지 않도록 dragOffset 제한
139
+ if (nextSize - dragOffset < minSize) {
140
+ dragOffset = nextSize - minSize;
141
+ }
142
+
127
143
  const newPrevSize = prevSize + dragOffset;
128
144
  const newNextSize = nextSize - dragOffset;
129
145
 
130
- console.log(prevSize, nextSize, newPrevSize, newNextSize);
131
-
132
146
  const initialSizes = allPanels.map(panel => isHorizontal ? panel.getBoundingClientRect().width : panel.getBoundingClientRect().height);
133
147
 
134
148
  const totalSplitterSize = allChildren.reduce((sum, child) => {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "ninegrid2",
3
3
  "type": "module",
4
- "version": "6.1077.0",
4
+ "version": "6.1079.0",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
7
7
  "exports": {
package/src/nx/nxSplitter.js CHANGED
@@ -110,25 +110,39 @@ class nxSplitter extends HTMLElement {
110
110
  }
111
111
  };
112
112
 
113
- const onUp = () => {
113
+ const onUp = (e) => {
114
114
  window.removeEventListener("mousemove", onMove);
115
115
  window.removeEventListener("mouseup", onUp);
116
116
  dragBar.remove();
117
117
 
118
118
  const allChildren = Array.from(parent.children);
119
119
  const allPanels = allChildren.filter(el => el.tagName.toLowerCase() !== 'nx-splitter');
120
+ const allSplitters = allChildren.filter(el => el.tagName.toLowerCase() === 'nx-splitter');
120
121
 
121
122
  const finalDragBarPos = isHorizontal ? parseFloat(dragBar.style.left) : parseFloat(dragBar.style.top);
122
- const dragOffset = finalDragBarPos - initialSplitterPosInParent;
123
+ const initialSplitterPos = isHorizontal ? this.getBoundingClientRect().left - parent.getBoundingClientRect().left : this.getBoundingClientRect().top - parent.getBoundingClientRect().top;
123
124
 
124
- const prevSize = (isHorizontal ? prev.getBoundingClientRect().width : prev.getBoundingClientRect().height) - clickOffset;
125
+ // ⭐⭐ dragOffset을 패널의 크기 범위 내로 제한 ⭐⭐
126
+ let dragOffset = finalDragBarPos - initialSplitterPos;
127
+
128
+ const prevSize = isHorizontal ? prev.getBoundingClientRect().width : prev.getBoundingClientRect().height;
125
129
  const nextSize = isHorizontal ? next.getBoundingClientRect().width : next.getBoundingClientRect().height;
126
130
 
131
+ // 최소 크기 제한 (0px)
132
+ const minSize = 0;
133
+
134
+ // prev 패널이 최소 크기보다 작아지지 않도록 dragOffset 제한
135
+ if (prevSize + dragOffset < minSize) {
136
+ dragOffset = minSize - prevSize;
137
+ }
138
+ // next 패널이 최소 크기보다 작아지지 않도록 dragOffset 제한
139
+ if (nextSize - dragOffset < minSize) {
140
+ dragOffset = nextSize - minSize;
141
+ }
142
+
127
143
  const newPrevSize = prevSize + dragOffset;
128
144
  const newNextSize = nextSize - dragOffset;
129
145
 
130
- console.log(prevSize, nextSize, newPrevSize, newNextSize);
131
-
132
146
  const initialSizes = allPanels.map(panel => isHorizontal ? panel.getBoundingClientRect().width : panel.getBoundingClientRect().height);
133
147
 
134
148
  const totalSplitterSize = allChildren.reduce((sum, child) => {