ninegrid2 6.662.0 → 6.664.0

package/dist/bundle.cjs.js

@@ -120131,7 +120131,7 @@ class nxSideMenu extends HTMLElement
 					el.classList.add("active");
 				}
 			}
-		}, 1000);
+		}, 300);
 
 	};
 	
@@ -121045,6 +121045,52 @@ Array.prototype.nineBinarySearch = function(target)
 	return -1;
 };
 
+class nxSplitter extends HTMLElement {
+	#mode;
+
+	constructor() {
+		super();
+		this.attachShadow({ mode: "open" });
+	}
+
+	connectedCallback() {
+		this.#init();
+	}
+
+	#detectMode(el) {
+		const prev = el.previousElementSibling;
+		const next = el.nextElementSibling;
+
+		const prevRect = prev?.getBoundingClientRect();
+		const nextRect = next?.getBoundingClientRect();
+
+		this.#mode = (!prevRect || !nextRect) || (Math.abs(prevRect.top - nextRect.top) < 5) ? "h" : "v";
+	}
+
+	#init = () => {
+		this.#detectMode(this);
+
+		const contents = this.innerHTML.trim();
+		const gripClass = `grip-${this.#mode}`;
+		const gripTmpl = (contents === "") ? `<div class="${gripClass}"></div>`: `<div class="${gripClass}"></div>${contents}<div class="${gripClass}"></div>`;
+
+		this.innerHTML = ""; // 기존 내부 HTML 제거
+		const htmlTmpl = document.createElement("template");
+		htmlTmpl.innerHTML = `
+			<style>
+				@import "https://cdn.jsdelivr.net/npm/ninegrid@${ninegrid.version}/dist/css/nxSplitter.css";
+				${ninegrid.getCustomPath(this,"nxSplitter.css")}
+			</style>
+            
+            ${gripTmpl}
+        `;
+
+		this.shadowRoot.appendChild(htmlTmpl.content.cloneNode(true));
+	}
+}
+
+customElements.define("nx-splitter", nxSplitter);
+
 class aiSettings extends HTMLElement
 {
 	constructor() {

package/dist/bundle.esm.js

@@ -120127,7 +120127,7 @@ class nxSideMenu extends HTMLElement
 					el.classList.add("active");
 				}
 			}
-		}, 1000);
+		}, 300);
 
 	};
 	
@@ -121041,6 +121041,52 @@ Array.prototype.nineBinarySearch = function(target)
 	return -1;
 };
 
+class nxSplitter extends HTMLElement {
+	#mode;
+
+	constructor() {
+		super();
+		this.attachShadow({ mode: "open" });
+	}
+
+	connectedCallback() {
+		this.#init();
+	}
+
+	#detectMode(el) {
+		const prev = el.previousElementSibling;
+		const next = el.nextElementSibling;
+
+		const prevRect = prev?.getBoundingClientRect();
+		const nextRect = next?.getBoundingClientRect();
+
+		this.#mode = (!prevRect || !nextRect) || (Math.abs(prevRect.top - nextRect.top) < 5) ? "h" : "v";
+	}
+
+	#init = () => {
+		this.#detectMode(this);
+
+		const contents = this.innerHTML.trim();
+		const gripClass = `grip-${this.#mode}`;
+		const gripTmpl = (contents === "") ? `<div class="${gripClass}"></div>`: `<div class="${gripClass}"></div>${contents}<div class="${gripClass}"></div>`;
+
+		this.innerHTML = ""; // 기존 내부 HTML 제거
+		const htmlTmpl = document.createElement("template");
+		htmlTmpl.innerHTML = `
+			<style>
+				@import "https://cdn.jsdelivr.net/npm/ninegrid@${ninegrid.version}/dist/css/nxSplitter.css";
+				${ninegrid.getCustomPath(this,"nxSplitter.css")}
+			</style>
+            
+            ${gripTmpl}
+        `;
+
+		this.shadowRoot.appendChild(htmlTmpl.content.cloneNode(true));
+	}
+}
+
+customElements.define("nx-splitter", nxSplitter);
+
 class aiSettings extends HTMLElement
 {
 	constructor() {

package/dist/etc/nxSideMenu.js

@@ -27,7 +27,7 @@ class nxSideMenu extends HTMLElement
 					el.classList.add("active");
 				}
 			}
-		}, 1000);
+		}, 300);
 
 	};
 	

package/dist/index.js

@@ -101,6 +101,8 @@ import "./etc/nxTopMenu.js";
 import "./utils/ngFiltering.js";
 import "./utils/ngPrototype.js";
 
+import "./nx/nxSplitter.js";
+
 
 import "./ai/aiSettings.js";
 import "./ai/aiMessage.js";

package/dist/nx/nxSplitter.js

@@ -0,0 +1,47 @@
+import ninegrid from "../index.js";
+
+class nxSplitter extends HTMLElement {
+	#mode;
+
+	constructor() {
+		super();
+		this.attachShadow({ mode: "open" });
+	}
+
+	connectedCallback() {
+		this.#init();
+	}
+
+	#detectMode(el) {
+		const prev = el.previousElementSibling;
+		const next = el.nextElementSibling;
+
+		const prevRect = prev?.getBoundingClientRect();
+		const nextRect = next?.getBoundingClientRect();
+
+		this.#mode = (!prevRect || !nextRect) || (Math.abs(prevRect.top - nextRect.top) < 5) ? "h" : "v";
+	}
+
+	#init = () => {
+		this.#detectMode(this);
+
+		const contents = this.innerHTML.trim();
+		const gripClass = `grip-${this.#mode}`;
+		const gripTmpl = (contents === "") ? `<div class="${gripClass}"></div>`: `<div class="${gripClass}"></div>${contents}<div class="${gripClass}"></div>`;
+
+		this.innerHTML = ""; // 기존 내부 HTML 제거
+		const htmlTmpl = document.createElement("template");
+		htmlTmpl.innerHTML = `
+			<style>
+				@import "https://cdn.jsdelivr.net/npm/ninegrid@${ninegrid.version}/dist/css/nxSplitter.css";
+				${ninegrid.getCustomPath(this,"nxSplitter.css")}
+			</style>
+            
+            ${gripTmpl}
+        `;
+
+		this.shadowRoot.appendChild(htmlTmpl.content.cloneNode(true));
+	}
+}
+
+customElements.define("nx-splitter", nxSplitter);

package/package.json

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

package/src/etc/nxSideMenu.js

@@ -27,7 +27,7 @@ class nxSideMenu extends HTMLElement
 					el.classList.add("active");
 				}
 			}
-		}, 1000);
+		}, 300);
 
 	};
 	

package/src/index.js

@@ -101,6 +101,8 @@ import "./etc/nxTopMenu.js";
 import "./utils/ngFiltering.js";
 import "./utils/ngPrototype.js";
 
+import "./nx/nxSplitter.js";
+
 
 import "./ai/aiSettings.js";
 import "./ai/aiMessage.js";

package/src/nx/nxSplitter.js

@@ -0,0 +1,47 @@
+import ninegrid from "../index.js";
+
+class nxSplitter extends HTMLElement {
+	#mode;
+
+	constructor() {
+		super();
+		this.attachShadow({ mode: "open" });
+	}
+
+	connectedCallback() {
+		this.#init();
+	}
+
+	#detectMode(el) {
+		const prev = el.previousElementSibling;
+		const next = el.nextElementSibling;
+
+		const prevRect = prev?.getBoundingClientRect();
+		const nextRect = next?.getBoundingClientRect();
+
+		this.#mode = (!prevRect || !nextRect) || (Math.abs(prevRect.top - nextRect.top) < 5) ? "h" : "v";
+	}
+
+	#init = () => {
+		this.#detectMode(this);
+
+		const contents = this.innerHTML.trim();
+		const gripClass = `grip-${this.#mode}`;
+		const gripTmpl = (contents === "") ? `<div class="${gripClass}"></div>`: `<div class="${gripClass}"></div>${contents}<div class="${gripClass}"></div>`;
+
+		this.innerHTML = ""; // 기존 내부 HTML 제거
+		const htmlTmpl = document.createElement("template");
+		htmlTmpl.innerHTML = `
+			<style>
+				@import "https://cdn.jsdelivr.net/npm/ninegrid@${ninegrid.version}/dist/css/nxSplitter.css";
+				${ninegrid.getCustomPath(this,"nxSplitter.css")}
+			</style>
+            
+            ${gripTmpl}
+        `;
+
+		this.shadowRoot.appendChild(htmlTmpl.content.cloneNode(true));
+	}
+}
+
+customElements.define("nx-splitter", nxSplitter);