ninegrid2 6.152.0 → 6.154.0

package/dist/bundle.cjs.js

@@ -10709,10 +10709,20 @@ var $$1 = /*@__PURE__*/getDefaultExportFromCjs(jqueryExports);
 class ninegrid {
 
 
-    constructor() {
-        console.log(`welcome nine-grid@${ninegrid.version}`, window.location.hostname);
+	constructor() {
+		console.log(`welcome nine-grid@${ninegrid.version}`, window.location.hostname);
+		//console.log(i18next);
+	}
 
-       //console.log(i18next);
+	static extendElementPrototype() {
+        if (!("isHidden" in Element.prototype)) { // ✅ 이미 존재하는 경우 중복 정의 방지
+            Object.defineProperty(Element.prototype, "isHidden", {
+                get: function () {
+                    const style = window.getComputedStyle(this);
+                    return style.display === "none" || style.visibility === "hidden" || style.opacity === "0";
+                }
+            });
+        }
     }
 
 	static LOG = {
@@ -17900,9 +17910,31 @@ class ngFiltering
 	
 	on = (v) => {
 		
-		this.#on();
-		
-		//if (v) this.#init(v);
+		this.#isFiltering = true;
+		const lastRowIndex = this.#getLastRowIndex();
+
+		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
+			const rowIndex = td.closest("tr")?.sectionRowIndex;
+			if (rowIndex !== undefined && rowIndex + td.rowSpan - 1 === lastRowIndex) {
+				const options = Array.from(this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`))
+					.map(el => el.dataset.bind ? { colnm: el.dataset.bind, data: [] } : null)
+					.filter(Boolean); // ✅ `null` 제거
+
+				if (options.length > 0) {
+					const filterButton = document.createElement("ng-filter-button");
+					td.appendChild(filterButton);
+					filterButton.filterOptions = options;
+				}
+			}
+		});
+	};
+
+	off = () => {
+		this.#isFiltering = false;
+
+		this.#owner.body.querySelectorAll(".ng-table ng-filter-button").forEach((el) => {
+			el.remove(); // ✅ 요소 삭제
+		});
 	};
 	
 	set = (oFilter) => {
@@ -18016,58 +18048,10 @@ class ngFiltering
 
 		return index;
 	};
-	
-	#on = () => {
-		this.#isFiltering = true;
-		const lastRowIndex = this.#getLastRowIndex();
 
-		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
-			const rowIndex = td.closest("tr")?.sectionRowIndex;
-			if (rowIndex !== undefined && rowIndex + td.rowSpan - 1 === lastRowIndex) {
-				const options = Array.from(this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`))
-					.map(el => el.dataset.bind ? { colnm: el.dataset.bind, data: [] } : null)
-					.filter(Boolean); // ✅ `null` 제거
-console.log(options);
-				if (options.length > 0) {
-					const filterButton = document.createElement("ng-filter-button");
-					td.appendChild(filterButton);
-					filterButton.filterOptions = options;
-				}
-			}
-		});
-	};
-
-	#on1 = () => {
-		this.#isFiltering = true;
-
-		const lastRowIndex = this.#getLastRowIndex();
-
-		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
-			if (td.closest("tr").sectionRowIndex + td.rowSpan - 1 === lastRowIndex) {
-				//let colnms = [];
-				const options = [];
-				this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`).forEach((el) => {
-					if (el.dataset.bind) {
-						options.push({
-							colnm: el.dataset.bind,
-							data: [],
-						});
-					}
-				});
 
-				if (options.length > 0) {
-					const filterButton = document.createElement("ng-filter-button"); // ✅ `ng-filter-button` 생성
-					td.appendChild(filterButton);
-					filterButton.filterOptions = options; // ✅ 속성 설정
-				}
-			}
-		});
-	};
 
-	off = () => {
-		this.#isFiltering = false;
-		$(".ng-table ng-filter-button", this.#owner.body).remove();
-	};
+	
 	
 	#init = (option) => {
 	
@@ -18172,25 +18156,15 @@ class ngFilterButton extends HTMLElement
 		e.preventDefault();
 		e.stopPropagation();
 		
-		var panel = this.#owner.shadowRoot.querySelector('ng-filter-panel');
+		const panel = this.#owner.shadowRoot.querySelector('ng-filter-panel');
 		
-		if (this.#owner.shadowRoot.querySelectorAll('ng-filter-panel').length > 1) throw "too many ng-filter-panel";
-		if (!panel) throw 'ng-filter-panel is null';
+		console.log(panel.isHidden);
 
-		var cell = e.target.closest("th,td");
-		
-		var l = $(e.target).offset().left - $(this.#owner).offset().left;// - $(panel).width() + $(e.target).width() + 1;
-		if (l < 0) l = 0;
-		if (l + $(panel).width() > $(this.#owner).width()) l = $(this.#owner).width() - $(panel).width() - 5;
-		
-		
+		panel.style.display = panel.isHidden ? 'flex' : 'none';
 
-		var t = $(cell).offset().top + $(cell).height()- $(this.#owner).offset().top;//$(e.target).offset().top + $(e.target).height() + 2;
 		
-		//$(panel).offset({left: l, top: t});
-		$(panel).css({left: l, top: t});
 
-		panel.refresh(this.#owner, this);
+		return;
 	};
 }
 
@@ -24381,11 +24355,16 @@ class ninegridContainer extends HTMLElement
 		//ninegrid.setCssPath("/css/nine-grid");
 
 		//console.log("ninegrid constructor()");
+
 		
+
 		super();
 		
 		this.attachShadow({ mode: 'open' });
 		
+
+		ninegrid.extendElementPrototype();
+		
 		this.#layouts = [];
 
 		/**

package/dist/bundle.esm.js

@@ -10707,10 +10707,20 @@ var $$1 = /*@__PURE__*/getDefaultExportFromCjs(jqueryExports);
 class ninegrid {
 
 
-    constructor() {
-        console.log(`welcome nine-grid@${ninegrid.version}`, window.location.hostname);
+	constructor() {
+		console.log(`welcome nine-grid@${ninegrid.version}`, window.location.hostname);
+		//console.log(i18next);
+	}
 
-       //console.log(i18next);
+	static extendElementPrototype() {
+        if (!("isHidden" in Element.prototype)) { // ✅ 이미 존재하는 경우 중복 정의 방지
+            Object.defineProperty(Element.prototype, "isHidden", {
+                get: function () {
+                    const style = window.getComputedStyle(this);
+                    return style.display === "none" || style.visibility === "hidden" || style.opacity === "0";
+                }
+            });
+        }
     }
 
 	static LOG = {
@@ -17898,9 +17908,31 @@ class ngFiltering
 	
 	on = (v) => {
 		
-		this.#on();
-		
-		//if (v) this.#init(v);
+		this.#isFiltering = true;
+		const lastRowIndex = this.#getLastRowIndex();
+
+		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
+			const rowIndex = td.closest("tr")?.sectionRowIndex;
+			if (rowIndex !== undefined && rowIndex + td.rowSpan - 1 === lastRowIndex) {
+				const options = Array.from(this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`))
+					.map(el => el.dataset.bind ? { colnm: el.dataset.bind, data: [] } : null)
+					.filter(Boolean); // ✅ `null` 제거
+
+				if (options.length > 0) {
+					const filterButton = document.createElement("ng-filter-button");
+					td.appendChild(filterButton);
+					filterButton.filterOptions = options;
+				}
+			}
+		});
+	};
+
+	off = () => {
+		this.#isFiltering = false;
+
+		this.#owner.body.querySelectorAll(".ng-table ng-filter-button").forEach((el) => {
+			el.remove(); // ✅ 요소 삭제
+		});
 	};
 	
 	set = (oFilter) => {
@@ -18014,58 +18046,10 @@ class ngFiltering
 
 		return index;
 	};
-	
-	#on = () => {
-		this.#isFiltering = true;
-		const lastRowIndex = this.#getLastRowIndex();
 
-		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
-			const rowIndex = td.closest("tr")?.sectionRowIndex;
-			if (rowIndex !== undefined && rowIndex + td.rowSpan - 1 === lastRowIndex) {
-				const options = Array.from(this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`))
-					.map(el => el.dataset.bind ? { colnm: el.dataset.bind, data: [] } : null)
-					.filter(Boolean); // ✅ `null` 제거
-console.log(options);
-				if (options.length > 0) {
-					const filterButton = document.createElement("ng-filter-button");
-					td.appendChild(filterButton);
-					filterButton.filterOptions = options;
-				}
-			}
-		});
-	};
-
-	#on1 = () => {
-		this.#isFiltering = true;
-
-		const lastRowIndex = this.#getLastRowIndex();
-
-		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
-			if (td.closest("tr").sectionRowIndex + td.rowSpan - 1 === lastRowIndex) {
-				//let colnms = [];
-				const options = [];
-				this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`).forEach((el) => {
-					if (el.dataset.bind) {
-						options.push({
-							colnm: el.dataset.bind,
-							data: [],
-						});
-					}
-				});
 
-				if (options.length > 0) {
-					const filterButton = document.createElement("ng-filter-button"); // ✅ `ng-filter-button` 생성
-					td.appendChild(filterButton);
-					filterButton.filterOptions = options; // ✅ 속성 설정
-				}
-			}
-		});
-	};
 
-	off = () => {
-		this.#isFiltering = false;
-		$(".ng-table ng-filter-button", this.#owner.body).remove();
-	};
+	
 	
 	#init = (option) => {
 	
@@ -18170,25 +18154,15 @@ class ngFilterButton extends HTMLElement
 		e.preventDefault();
 		e.stopPropagation();
 		
-		var panel = this.#owner.shadowRoot.querySelector('ng-filter-panel');
+		const panel = this.#owner.shadowRoot.querySelector('ng-filter-panel');
 		
-		if (this.#owner.shadowRoot.querySelectorAll('ng-filter-panel').length > 1) throw "too many ng-filter-panel";
-		if (!panel) throw 'ng-filter-panel is null';
+		console.log(panel.isHidden);
 
-		var cell = e.target.closest("th,td");
-		
-		var l = $(e.target).offset().left - $(this.#owner).offset().left;// - $(panel).width() + $(e.target).width() + 1;
-		if (l < 0) l = 0;
-		if (l + $(panel).width() > $(this.#owner).width()) l = $(this.#owner).width() - $(panel).width() - 5;
-		
-		
+		panel.style.display = panel.isHidden ? 'flex' : 'none';
 
-		var t = $(cell).offset().top + $(cell).height()- $(this.#owner).offset().top;//$(e.target).offset().top + $(e.target).height() + 2;
 		
-		//$(panel).offset({left: l, top: t});
-		$(panel).css({left: l, top: t});
 
-		panel.refresh(this.#owner, this);
+		return;
 	};
 }
 
@@ -24379,11 +24353,16 @@ class ninegridContainer extends HTMLElement
 		//ninegrid.setCssPath("/css/nine-grid");
 
 		//console.log("ninegrid constructor()");
+
 		
+
 		super();
 		
 		this.attachShadow({ mode: 'open' });
 		
+
+		ninegrid.extendElementPrototype();
+		
 		this.#layouts = [];
 
 		/**

package/dist/etc/ngFiltering.js

@@ -35,9 +35,31 @@ export class ngFiltering
 	
 	on = (v) => {
 		
-		this.#on();
-		
-		//if (v) this.#init(v);
+		this.#isFiltering = true;
+		const lastRowIndex = this.#getLastRowIndex();
+
+		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
+			const rowIndex = td.closest("tr")?.sectionRowIndex;
+			if (rowIndex !== undefined && rowIndex + td.rowSpan - 1 === lastRowIndex) {
+				const options = Array.from(this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`))
+					.map(el => el.dataset.bind ? { colnm: el.dataset.bind, data: [] } : null)
+					.filter(Boolean); // ✅ `null` 제거
+
+				if (options.length > 0) {
+					const filterButton = document.createElement("ng-filter-button");
+					td.appendChild(filterButton);
+					filterButton.filterOptions = options;
+				}
+			}
+		});
+	};
+
+	off = () => {
+		this.#isFiltering = false;
+
+		this.#owner.body.querySelectorAll(".ng-table ng-filter-button").forEach((el) => {
+			el.remove(); // ✅ 요소 삭제
+		});
 	};
 	
 	set = (oFilter) => {
@@ -151,58 +173,10 @@ export class ngFiltering
 
 		return index;
 	};
-	
-	#on = () => {
-		this.#isFiltering = true;
-		const lastRowIndex = this.#getLastRowIndex();
-
-		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
-			const rowIndex = td.closest("tr")?.sectionRowIndex;
-			if (rowIndex !== undefined && rowIndex + td.rowSpan - 1 === lastRowIndex) {
-				const options = Array.from(this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`))
-					.map(el => el.dataset.bind ? { colnm: el.dataset.bind, data: [] } : null)
-					.filter(Boolean); // ✅ `null` 제거
-console.log(options);
-				if (options.length > 0) {
-					const filterButton = document.createElement("ng-filter-button");
-					td.appendChild(filterButton);
-					filterButton.filterOptions = options;
-				}
-			}
-		});
-	};
 
-	#on1 = () => {
-		this.#isFiltering = true;
-
-		const lastRowIndex = this.#getLastRowIndex();
 
-		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
-			if (td.closest("tr").sectionRowIndex + td.rowSpan - 1 === lastRowIndex) {
-				//let colnms = [];
-				const options = [];
-				this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`).forEach((el) => {
-					if (el.dataset.bind) {
-						options.push({
-							colnm: el.dataset.bind,
-							data: [],
-						});
-					}
-				});
 
-				if (options.length > 0) {
-					const filterButton = document.createElement("ng-filter-button"); // ✅ `ng-filter-button` 생성
-					td.appendChild(filterButton);
-					filterButton.filterOptions = options; // ✅ 속성 설정
-				}
-			}
-		});
-	};
-
-	off = () => {
-		this.#isFiltering = false;
-		$(".ng-table ng-filter-button", this.#owner.body).remove();
-	};
+	
 	
 	#init = (option) => {
 	
@@ -307,10 +281,20 @@ class ngFilterButton extends HTMLElement
 		e.preventDefault();
 		e.stopPropagation();
 		
-		var panel = this.#owner.shadowRoot.querySelector('ng-filter-panel');
+		const panel = this.#owner.shadowRoot.querySelector('ng-filter-panel');
+		
+		console.log(panel.isHidden)
+
+		panel.style.display = panel.isHidden ? 'flex' : 'none';
+
 		
+
+		return;
+
+		/**
 		if (this.#owner.shadowRoot.querySelectorAll('ng-filter-panel').length > 1) throw "too many ng-filter-panel";
 		if (!panel) throw 'ng-filter-panel is null';
+		 */
 
 		var cell = e.target.closest("th,td");
 		

package/dist/etc/ninegridContainer.js

@@ -33,11 +33,16 @@ class ninegridContainer extends HTMLElement
 		//ninegrid.setCssPath("/css/nine-grid");
 
 		//console.log("ninegrid constructor()");
+
 		
+
 		super();
 		
 		this.attachShadow({ mode: 'open' });
 		
+
+		ninegrid.extendElementPrototype();
+		
 		this.#layouts = [];
 
 		/**

package/dist/utils/ninegrid.js

@@ -3,10 +3,20 @@
 export class ninegrid {
 
 
-    constructor() {
-        console.log(`welcome nine-grid@${ninegrid.version}`, window.location.hostname);
+	constructor() {
+		console.log(`welcome nine-grid@${ninegrid.version}`, window.location.hostname);
+		//console.log(i18next);
+	}
 
-       //console.log(i18next);
+	static extendElementPrototype() {
+        if (!("isHidden" in Element.prototype)) { // ✅ 이미 존재하는 경우 중복 정의 방지
+            Object.defineProperty(Element.prototype, "isHidden", {
+                get: function () {
+                    const style = window.getComputedStyle(this);
+                    return style.display === "none" || style.visibility === "hidden" || style.opacity === "0";
+                }
+            });
+        }
     }
 
 	static LOG = {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ninegrid2",
   "type": "module",
-  "version": "6.152.0",
+  "version": "6.154.0",
   "main": "dist/index.js",
   "exports": {
     "import": "./dist/index.js",

package/src/etc/ngFiltering.js

@@ -35,9 +35,31 @@ export class ngFiltering
 	
 	on = (v) => {
 		
-		this.#on();
-		
-		//if (v) this.#init(v);
+		this.#isFiltering = true;
+		const lastRowIndex = this.#getLastRowIndex();
+
+		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
+			const rowIndex = td.closest("tr")?.sectionRowIndex;
+			if (rowIndex !== undefined && rowIndex + td.rowSpan - 1 === lastRowIndex) {
+				const options = Array.from(this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`))
+					.map(el => el.dataset.bind ? { colnm: el.dataset.bind, data: [] } : null)
+					.filter(Boolean); // ✅ `null` 제거
+
+				if (options.length > 0) {
+					const filterButton = document.createElement("ng-filter-button");
+					td.appendChild(filterButton);
+					filterButton.filterOptions = options;
+				}
+			}
+		});
+	};
+
+	off = () => {
+		this.#isFiltering = false;
+
+		this.#owner.body.querySelectorAll(".ng-table ng-filter-button").forEach((el) => {
+			el.remove(); // ✅ 요소 삭제
+		});
 	};
 	
 	set = (oFilter) => {
@@ -151,58 +173,10 @@ export class ngFiltering
 
 		return index;
 	};
-	
-	#on = () => {
-		this.#isFiltering = true;
-		const lastRowIndex = this.#getLastRowIndex();
-
-		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
-			const rowIndex = td.closest("tr")?.sectionRowIndex;
-			if (rowIndex !== undefined && rowIndex + td.rowSpan - 1 === lastRowIndex) {
-				const options = Array.from(this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`))
-					.map(el => el.dataset.bind ? { colnm: el.dataset.bind, data: [] } : null)
-					.filter(Boolean); // ✅ `null` 제거
-console.log(options);
-				if (options.length > 0) {
-					const filterButton = document.createElement("ng-filter-button");
-					td.appendChild(filterButton);
-					filterButton.filterOptions = options;
-				}
-			}
-		});
-	};
 
-	#on1 = () => {
-		this.#isFiltering = true;
-
-		const lastRowIndex = this.#getLastRowIndex();
 
-		this.#owner.body.querySelectorAll(".ng-table thead th, .ng-table thead td").forEach((td) => {
-			if (td.closest("tr").sectionRowIndex + td.rowSpan - 1 === lastRowIndex) {
-				//let colnms = [];
-				const options = [];
-				this.#owner.activeTmpl.querySelectorAll(`[data-col="${td.dataset.col}"]`).forEach((el) => {
-					if (el.dataset.bind) {
-						options.push({
-							colnm: el.dataset.bind,
-							data: [],
-						});
-					}
-				});
 
-				if (options.length > 0) {
-					const filterButton = document.createElement("ng-filter-button"); // ✅ `ng-filter-button` 생성
-					td.appendChild(filterButton);
-					filterButton.filterOptions = options; // ✅ 속성 설정
-				}
-			}
-		});
-	};
-
-	off = () => {
-		this.#isFiltering = false;
-		$(".ng-table ng-filter-button", this.#owner.body).remove();
-	};
+	
 	
 	#init = (option) => {
 	
@@ -307,10 +281,20 @@ class ngFilterButton extends HTMLElement
 		e.preventDefault();
 		e.stopPropagation();
 		
-		var panel = this.#owner.shadowRoot.querySelector('ng-filter-panel');
+		const panel = this.#owner.shadowRoot.querySelector('ng-filter-panel');
+		
+		console.log(panel.isHidden)
+
+		panel.style.display = panel.isHidden ? 'flex' : 'none';
+
 		
+
+		return;
+
+		/**
 		if (this.#owner.shadowRoot.querySelectorAll('ng-filter-panel').length > 1) throw "too many ng-filter-panel";
 		if (!panel) throw 'ng-filter-panel is null';
+		 */
 
 		var cell = e.target.closest("th,td");
 		

package/src/etc/ninegridContainer.js

@@ -33,11 +33,16 @@ class ninegridContainer extends HTMLElement
 		//ninegrid.setCssPath("/css/nine-grid");
 
 		//console.log("ninegrid constructor()");
+
 		
+
 		super();
 		
 		this.attachShadow({ mode: 'open' });
 		
+
+		ninegrid.extendElementPrototype();
+		
 		this.#layouts = [];
 
 		/**

package/src/utils/ninegrid.js

@@ -3,10 +3,20 @@
 export class ninegrid {
 
 
-    constructor() {
-        console.log(`welcome nine-grid@${ninegrid.version}`, window.location.hostname);
+	constructor() {
+		console.log(`welcome nine-grid@${ninegrid.version}`, window.location.hostname);
+		//console.log(i18next);
+	}
 
-       //console.log(i18next);
+	static extendElementPrototype() {
+        if (!("isHidden" in Element.prototype)) { // ✅ 이미 존재하는 경우 중복 정의 방지
+            Object.defineProperty(Element.prototype, "isHidden", {
+                get: function () {
+                    const style = window.getComputedStyle(this);
+                    return style.display === "none" || style.visibility === "hidden" || style.opacity === "0";
+                }
+            });
+        }
     }
 
 	static LOG = {