ninegrid2 6.684.0 → 6.686.0

package/dist/bundle.cjs.js

@@ -121182,7 +121182,47 @@ class nxSplitter extends HTMLElement {
 			console.log(el);
 			el.addEventListener("mousedown", e => this.#startDrag(e));
 		});
-	}
+
+		this.#prepareLayout();
+	};
+
+	#prepareLayout = () => {
+		const isLastSplitter = () => {
+			const parent = this.parentElement;
+			if (!parent) return false;
+
+			const allSplitters = [...parent.querySelectorAll("nx-splitter")];
+			return allSplitters.at(-1) === this;
+		};
+
+
+		const splitterSize = this.#mode === "h" ? this.offsetWidth : this.offsetHeight;
+		const prev = this.previousElementSibling;
+		const next = this.nextElementSibling;
+		const parent = this.parentElement;
+
+		if (!prev || !next || !parent) return;
+
+		const parentRect = parent.getBoundingClientRect();
+		const total = this.#mode === "h" ? parentRect.width : parentRect.height;
+		const available = total - splitterSize;
+		const eachSize = available / 2;
+
+		if (this.#mode === "h") {
+			prev.style.width = `${eachSize}px`;
+
+			// ✔ 정확하게 마지막 splitter일 때만 next 조정
+			if (isLastSplitter()) {
+				next.style.width = `${eachSize}px`;
+			}
+		} else {
+			prev.style.height = `${eachSize}px`;
+
+			if (isLastSplitter()) {
+				next.style.height = `${eachSize}px`;
+			}
+		}
+	};
 }
 
 customElements.define("nx-splitter", nxSplitter);

package/dist/bundle.esm.js

@@ -121178,7 +121178,47 @@ class nxSplitter extends HTMLElement {
 			console.log(el);
 			el.addEventListener("mousedown", e => this.#startDrag(e));
 		});
-	}
+
+		this.#prepareLayout();
+	};
+
+	#prepareLayout = () => {
+		const isLastSplitter = () => {
+			const parent = this.parentElement;
+			if (!parent) return false;
+
+			const allSplitters = [...parent.querySelectorAll("nx-splitter")];
+			return allSplitters.at(-1) === this;
+		};
+
+
+		const splitterSize = this.#mode === "h" ? this.offsetWidth : this.offsetHeight;
+		const prev = this.previousElementSibling;
+		const next = this.nextElementSibling;
+		const parent = this.parentElement;
+
+		if (!prev || !next || !parent) return;
+
+		const parentRect = parent.getBoundingClientRect();
+		const total = this.#mode === "h" ? parentRect.width : parentRect.height;
+		const available = total - splitterSize;
+		const eachSize = available / 2;
+
+		if (this.#mode === "h") {
+			prev.style.width = `${eachSize}px`;
+
+			// ✔ 정확하게 마지막 splitter일 때만 next 조정
+			if (isLastSplitter()) {
+				next.style.width = `${eachSize}px`;
+			}
+		} else {
+			prev.style.height = `${eachSize}px`;
+
+			if (isLastSplitter()) {
+				next.style.height = `${eachSize}px`;
+			}
+		}
+	};
 }
 
 customElements.define("nx-splitter", nxSplitter);

package/dist/nx/nxSplitter.js

@@ -137,7 +137,47 @@ class nxSplitter extends HTMLElement {
 			console.log(el);
 			el.addEventListener("mousedown", e => this.#startDrag(e));
 		});
-	}
+
+		this.#prepareLayout();
+	};
+
+	#prepareLayout = () => {
+		const isLastSplitter = () => {
+			const parent = this.parentElement;
+			if (!parent) return false;
+
+			const allSplitters = [...parent.querySelectorAll("nx-splitter")];
+			return allSplitters.at(-1) === this;
+		};
+
+
+		const splitterSize = this.#mode === "h" ? this.offsetWidth : this.offsetHeight;
+		const prev = this.previousElementSibling;
+		const next = this.nextElementSibling;
+		const parent = this.parentElement;
+
+		if (!prev || !next || !parent) return;
+
+		const parentRect = parent.getBoundingClientRect();
+		const total = this.#mode === "h" ? parentRect.width : parentRect.height;
+		const available = total - splitterSize;
+		const eachSize = available / 2;
+
+		if (this.#mode === "h") {
+			prev.style.width = `${eachSize}px`;
+
+			// ✔ 정확하게 마지막 splitter일 때만 next 조정
+			if (isLastSplitter()) {
+				next.style.width = `${eachSize}px`;
+			}
+		} else {
+			prev.style.height = `${eachSize}px`;
+
+			if (isLastSplitter()) {
+				next.style.height = `${eachSize}px`;
+			}
+		}
+	};
 }
 
 customElements.define("nx-splitter", nxSplitter);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ninegrid2",
   "type": "module",
-  "version": "6.684.0",
+  "version": "6.686.0",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {

package/src/nx/nxSplitter.js

@@ -137,7 +137,47 @@ class nxSplitter extends HTMLElement {
 			console.log(el);
 			el.addEventListener("mousedown", e => this.#startDrag(e));
 		});
-	}
+
+		this.#prepareLayout();
+	};
+
+	#prepareLayout = () => {
+		const isLastSplitter = () => {
+			const parent = this.parentElement;
+			if (!parent) return false;
+
+			const allSplitters = [...parent.querySelectorAll("nx-splitter")];
+			return allSplitters.at(-1) === this;
+		};
+
+
+		const splitterSize = this.#mode === "h" ? this.offsetWidth : this.offsetHeight;
+		const prev = this.previousElementSibling;
+		const next = this.nextElementSibling;
+		const parent = this.parentElement;
+
+		if (!prev || !next || !parent) return;
+
+		const parentRect = parent.getBoundingClientRect();
+		const total = this.#mode === "h" ? parentRect.width : parentRect.height;
+		const available = total - splitterSize;
+		const eachSize = available / 2;
+
+		if (this.#mode === "h") {
+			prev.style.width = `${eachSize}px`;
+
+			// ✔ 정확하게 마지막 splitter일 때만 next 조정
+			if (isLastSplitter()) {
+				next.style.width = `${eachSize}px`;
+			}
+		} else {
+			prev.style.height = `${eachSize}px`;
+
+			if (isLastSplitter()) {
+				next.style.height = `${eachSize}px`;
+			}
+		}
+	};
 }
 
 customElements.define("nx-splitter", nxSplitter);