@ninebone/table 0.1.31 → 0.1.33

package/dist/nine-table.js

@@ -3961,7 +3961,7 @@ const Qo = class Qo {
       }).join(""), o = nine.cssPath ? `@import "${nine.cssPath}/layout.css";` : "";
       t(this, et).shadowRoot.innerHTML = `
             <style>
-                @import "https://cdn.jsdelivr.net/npm/@ninebone/table@0.1.31/dist/css/layout.css";
+                @import "https://cdn.jsdelivr.net/npm/@ninebone/table@0.1.33/dist/css/layout.css";
                 ${o}
             </style>
             

package/dist/nine-table.umd.js

@@ -882,7 +882,7 @@ nine-table-sheet tr.ng-sticky-header td {
             <div class="ng-col-mover-indi"></div>
         `,v.log("3333*****************"),g(this,Je,{mainBody:this.querySelector(".ng-sheet-body .ng-container-body"),hscrollbar:this.querySelector("nine-table-hscrollbar"),vscrollbar:this.querySelector("nine-table-vscrollbar"),content:this.querySelector(".ng-sheet-body .ng-sheet-body-content"),scrollHolder:this.querySelector(".ng-sheet-body .ng-virtual-height-holder")}),v.log("444*****************")},"#render"));d(this,qn,h(()=>{v.log("**********************","#syncHeaderAndFooterHeights");const e=this.querySelector(".ng-container-left table"),s=this.querySelector(".ng-container-body table"),i=this.querySelector(".ng-container-right table"),n=Array.from(e.querySelectorAll("thead tr:not(.col-indicator-rowgroup)")),o=Array.from(s.querySelectorAll("thead tr:not(.col-indicator-rowgroup)")),l=Array.from(i.querySelectorAll("thead tr:not(.col-indicator-rowgroup)"));t(this,Ri).call(this,n,o,l);const a=Array.from(e.querySelectorAll("tfoot tr")),c=Array.from(s.querySelectorAll("tfoot tr")),u=Array.from(i.querySelectorAll("tfoot tr"));t(this,Ri).call(this,a,c,u)},"#syncHeaderAndFooterHeights"));d(this,Ri,h((e,s,i)=>{var o,l,a;const n=Math.max(e.length,s.length,i.length);for(let c=0;c<n;c++){const u=[((o=e[c])==null?void 0:o.getBoundingClientRect().height)||0,((l=s[c])==null?void 0:l.getBoundingClientRect().height)||0,((a=i[c])==null?void 0:a.getBoundingClientRect().height)||0],p=Math.max(...u);p>0&&(e[c]&&(e[c].style.height=`${p}px`),s[c]&&(s[c].style.height=`${p}px`),i[c]&&(i[c].style.height=`${p}px`))}},"#applyMaxHeights"));d(this,Mn,h(()=>{const e=this.querySelector(".ng-sheet-body");if(!e)return;let s=null;e.addEventListener("mouseover",i=>{const n=i.target.closest("tr");if(!n||!n.dataset.row&&n.dataset.row!=="0")return;const o=n.dataset.row;s!==o&&(s=o,e.querySelectorAll(`tr[data-row="${o}"]`).forEach(l=>{l.classList.add("hover")}))}),e.addEventListener("mouseout",i=>{const n=i.target.closest("tr");if(!n)return;const o=i.relatedTarget;n.contains(o)||(e.querySelectorAll("tr.hover").forEach(l=>{l.classList.remove("hover")}),s=null)})},"#initRowHoverEvent"));v.log("11111"),g(this,Ot,new Hr(this)),v.log("222"),g(this,ae,this.getRootNode().host),v.log("333")}connectedCallback(){t(this,Tn).call(this)}get index(){return t(this,wi)}get colResizer(){return t(this,Ee)}get filtering(){return t(this,Ei)}get grouping(){return t(this,ws)}get colMover(){return t(this,xs)}get colFix(){return t(this,Ai)}get rowManager(){return t(this,Ot)}get selection(){return t(this,vi)}get navigation(){return t(this,Si)}get templateLength(){return t(this,qt).tbody.tr.length||0}get elements(){return t(this,Je)}get isAutoFitCol(){var i,n;const e=this.getAttribute("auto-fit-col")==="true"||((i=t(this,ae))==null?void 0:i.getAttribute("auto-fit-col"))==="true",s=((n=t(this,qt).table)==null?void 0:n.getAttribute("auto-fit-col"))==="true";return e||s}get sourceTable(){return t(this,qt).table}get source(){return t(this,qt)}recompileAndRefresh(){var e;t(this,qt).table&&(fe.recompile(t(this,qt).table),["left","right","body"].forEach(s=>{["header","body","footer"].forEach(i=>{const n=this.querySelector(`.ng-sheet-${i} .ng-container-${s}`);n&&n.querySelectorAll("table").forEach(o=>o.remove())})}),t(this,Li).call(this),t(this,Qe).call(this),t(this,Ot).initialize(),this.isAutoFitCol?this.autoFit(!0):(e=this.querySelector("nine-table-hscrollbar"))==null||e.refresh(),requestAnimationFrame(()=>{var s;t(this,Qe).call(this),(s=t(this,Ot))==null||s.refresh()}))}refreshLayout(){!this.classList.contains("active")||!t(this,qt).table||requestAnimationFrame(()=>{var e,s,i;t(this,Qe).call(this),this.isAutoFitCol?this.autoFit(!0):(e=this.querySelector("nine-table-hscrollbar"))==null||e.refresh(),t(this,Rn).call(this),(s=t(this,Ee))==null||s.refreshLayout(),(i=t(this,Ot))==null||i.refresh()})}get view(){var e;return!t(this,Ze)&&((e=t(this,ae))!=null&&e.data)&&g(this,Ze,new Pi(this)),t(this,Ze)}disconnectedCallback(){var e,s;(e=t(this,Ee))==null||e.destroy(),(s=t(this,xs))==null||s.destroy(),this.innerHTML=""}};wi=new WeakMap,ae=new WeakMap,Ot=new WeakMap,vi=new WeakMap,Si=new WeakMap,Ee=new WeakMap,xs=new WeakMap,Ai=new WeakMap,En=new WeakMap,Ei=new WeakMap,ws=new WeakMap,Ze=new WeakMap,qt=new WeakMap,Je=new WeakMap,Ln=new WeakSet,Yl=h(function(){return t(this,ae).hasAttribute("simple")||t(this,ae).getAttribute("theme")==="simple"},"#isSimple"),Rn=new WeakMap,Cn=new WeakMap,Qe=new WeakMap,Li=new WeakMap,kn=new WeakMap,Tn=new WeakMap,In=new WeakMap,qn=new WeakMap,Ri=new WeakMap,Mn=new WeakMap,h(Ci,"NineTableSheet"),E(Ci,"SCROLLBAR_SIZE",16);let Xi=Ci;customElements.get("nine-table-sheet")||customElements.define("nine-table-sheet",Xi);const Do=class Do{constructor(r){d(this,it);d(this,Hn,h(()=>{t(this,Nn).call(this),new ResizeObserver(r=>{for(let e of r)t(this,it).getAttribute("auto-height")==="true"&&t(this,ki).call(this)}).observe(t(this,it))},"#init"));d(this,ki,h(()=>{const r=Array.from(t(this,it).shadowRoot.querySelectorAll("nine-table-sheet.active"));if(r.length===0)return;const e=parseInt(t(this,it).getAttribute("max-display-row"),10)||10,s=Math.max(...r.map(u=>u.getRowHeight())),i=t(this,it).shadowRoot.querySelector("nine-table-toolbar"),n=t(this,it).shadowRoot.querySelector("nine-table-sheets-footer"),o=i?i.getBoundingClientRect().height:0,l=n?n.getBoundingClientRect().height:0,a=Xi.SCROLLBAR_SIZE,c=e*s+o+l+a;t(this,it).style.height=`${c}px`},"#applyAutoHeight"));d(this,Nn,h(()=>{const e=Array.from(t(this,it).children).filter(l=>l.tagName.toUpperCase()==="TABLE"),s=t(this,it).getAttribute("auto-height")==="true",i=e.length,n=e.map((l,a)=>{const c=a===0?"active":"",u=l.id||`sheet${a+1}`,p=`<nine-table-sheet class="${c}" data-index="${a}" data-sheet-id="${u}" id="${u}"></nine-table-sheet>`,f=a<i-1?`<nine-splitter class="h" data-split-index="${a}"></nine-splitter>`:"";return p+f}).join(""),o=nine.cssPath?`@import "${nine.cssPath}/layout.css";`:"";t(this,it).shadowRoot.innerHTML=`
             <style>
-                @import "https://cdn.jsdelivr.net/npm/@ninebone/table@0.1.31/dist/css/layout.css";
+                @import "https://cdn.jsdelivr.net/npm/@ninebone/table@0.1.33/dist/css/layout.css";
                 ${o}
             </style>
             

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ninebone/table",
-  "version": "0.1.31",
+  "version": "0.1.33",
   "description": "Grid component for real-time collaboration (Vanilla JS based)",
   "type": "module",
   "main": "./dist/nine-table.umd.js",

package/dist/css/_common.css

@@ -1,11 +0,0 @@
-*,
-*::before,
-*::after {
-	box-sizing: border-box;
-}
-
-:root {
-	--font-size: 12px;
-	--font-family: "Noto Sans KR", sans-serif;
-	--color: #333;
-}

package/dist/css/ai.css

@@ -1,609 +0,0 @@
-@keyframes collapse {
-	0% { width: 320px; transform: translateX(0); }
-	100% { width: 0px; transform: translateX(100%); }
-}
-
-@keyframes expand {
-	0% { width: 0px; transform: translateX(100%); }
-	100% { width: 320px; transform: translateX(0); }
-}
-
-@keyframes slideFade {
-	0% { transform: translateY(-20px); opacity: 0; }
-	100% { transform: translateY(0); opacity: 1; }
-}
-
-@keyframes zoomIn {
-	0% { transform: scale(0.9); opacity: 0; }
-	100% { transform: scale(1); opacity: 1; }
-}
-@keyframes zoomOut {
-	0% { transform: scale(1); opacity: 1; }
-	100% { transform: scale(0.9); opacity: 0; }
-}
-
-@keyframes slideLeft {
-	0% { transform: translateX(100%); opacity: 0; }
-	100% { transform: translateX(0); opacity: 1; }
-}
-
-@keyframes slideRight {
-	from { transform: translateX(0); opacity: 1;  }
-	to { transform: translateX(100%); opacity: 0; }
-}
-
-:host(nx-ai-container) {
-	position: absolute;
-	right: 0;
-	top: 0;
-	bottom: 0;
-	width: 320px;
-	background: #f9f9f9;
-	z-index: 999;
-	opacity: 0.99;
-	animation: expand 0.1s ease-in-out forwards;
-	border-left: 1px solid #eee;
-	box-shadow: 0 0 8px 4px rgba(0, 0, 0, 0.3); /* ✅ 퍼지는 그림자 */
-
-	.expand-icon {
-		display: none;
-	}
-
-	.wrapper {
-		height: 100%;
-		display: flex;
-		overflow: hidden;
-	}
-
-	.menu {
-		z-index: 10;
-		width: 32px;
-		background: #ccc;
-		display: flex;
-		flex-direction: column;
-	}
-
-	.collapse-icon {
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		width: 100%;
-		height: 32px;
-		cursor: pointer;
-		background-repeat: no-repeat;
-		background-position: center;
-		background-size: auto;
-		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16"><path d="M6 8a.5.5 0 0 0 .5.5h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 0 0-.708.708L12.293 7.5H6.5A.5.5 0 0 0 6 8m-2.5 7a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5"/></svg>');
-	}
-
-	.menu-filter {
-		background-repeat: no-repeat;
-		background-position: center;
-		background-size: auto;
-		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16"><path d="M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5z"/></svg>');
-	}
-
-	.menu-general {
-		background-repeat: no-repeat;
-		background-position: center;
-		background-size: auto;
-		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16"><path d="M8 15c4.418 0 8-3.134 8-7s-3.582-7-8-7-8 3.134-8 7c0 1.76.743 3.37 1.97 4.6-.097 1.016-.417 2.13-.771 2.966-.079.186.074.394.273.362 2.256-.37 3.597-.938 4.18-1.234A9 9 0 0 0 8 15"/></svg>');
-	}
-
-	.menu-db {
-		background-repeat: no-repeat;
-		background-position: center;
-		background-size: auto;
-		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16"><path d="M8 15c4.418 0 8-3.134 8-7s-3.582-7-8-7-8 3.134-8 7c0 1.76.743 3.37 1.97 4.6-.097 1.016-.417 2.13-.771 2.966-.079.186.074.394.273.362 2.256-.37 3.597-.938 4.18-1.234A9 9 0 0 0 8 15"/></svg>');
-	}
-
-	.menu-setting {
-		background-repeat: no-repeat;
-		background-position: center;
-		background-size: auto;
-		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16"><path d="M9.405 1.05c-.413-1.4-2.397-1.4-2.81 0l-.1.34a1.464 1.464 0 0 1-2.105.872l-.31-.17c-1.283-.698-2.686.705-1.987 1.987l.169.311c.446.82.023 1.841-.872 2.105l-.34.1c-1.4.413-1.4 2.397 0 2.81l.34.1a1.464 1.464 0 0 1 .872 2.105l-.17.31c-.698 1.283.705 2.686 1.987 1.987l.311-.169a1.464 1.464 0 0 1 2.105.872l.1.34c.413 1.4 2.397 1.4 2.81 0l.1-.34a1.464 1.464 0 0 1 2.105-.872l.31.17c1.283.698 2.686-.705 1.987-1.987l-.169-.311a1.464 1.464 0 0 1 .872-2.105l.34-.1c1.4-.413 1.4-2.397 0-2.81l-.34-.1a1.464 1.464 0 0 1-.872-2.105l.17-.31c.698-1.283-.705-2.686-1.987-1.987l-.311.169a1.464 1.464 0 0 1-2.105-.872zM8 10.93a2.929 2.929 0 1 1 0-5.86 2.929 2.929 0 0 1 0 5.858z"/></svg>');
-	}
-
-	.menu-icon {
-		display: flex;
-		/* align-content: space-between; */
-		justify-content: center;
-		align-items: center;
-		height: 32px;
-	}
-	.menu-icon.active {
-		--border-right: 4px solid #999;
-		background-color: #c0c0c0;
-		--filter: brightness(170%);
-	}
-
-	.settings {
-		display: none;
-		position: absolute;
-		background: #fff;
-		left: 0;
-		right: 30px;
-		top: 0;
-		bottom: 0;
-		justify-content: center;
-		align-items: center;
-		opacity: 0;
-		transform: translateX(100%);
-		transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
-	}
-
-	.settings.expand {
-		display: flex;
-		animation: slideLeft 0.3s ease-out forwards;
-	}
-
-	.container {
-		height: 100%;
-		display: flex;
-		--background: white;
-		width: 100%;
-		flex-direction: column;
-
-		.head {
-			width: 100%;
-			height: 64px;
-			background: #f0f0f0;
-			--border: 1px solid #ccc;
-			display: flex;
-			align-items: center;
-			justify-content: flex-start;
-			padding-left: 16px;
-
-			.logo {
-				position: relative;
-				width: 70px;
-				height: 18px;
-				background-repeat: no-repeat;
-				background-position: center;
-				background-size: auto;
-				background-image: url('data:image/svg+xml;utf8,<svg version="1.1" id="fin" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 140 35" style="enable-background:new 0 0 140 35;" xml:space="preserve"><g><g fill="darkgray"><path d="M131.73,34.14l-80.24,0c-3.91,0-7.1-3.18-7.11-7.1l2.52,0c0,2.53,2.06,4.58,4.59,4.58l80.24,0 c2.53,0,4.59-2.06,4.59-4.59v-8.26c0-2.53-2.06-4.59-4.59-4.59l-29.75,0v-2.52l29.75,0c3.92,0,7.11,3.19,7.11,7.11v8.26 C138.84,30.95,135.65,34.14,131.73,34.14z"/> </g> <g fill="dodgerblue"> <path d="M11.96,0.86L11.96,0.86H8.73h0l0,0L1.16,21.02h3.6l1.93-5.4H14l1.93,5.4h3.6L11.96,0.86L11.96,0.86z M12.84,12.38H7.85l2.5-6.99L12.84,12.38z"/> <path d="M24.28,7.88V5.54h-3.24v15.48h3.24v-8.28c0-0.01,0.01-0.02,0.01-0.02c0-0.05-0.01-0.1-0.01-0.16 c0-2.29,1.74-4.14,3.88-4.14c0.54,0,1.05,0.12,1.52,0.33c0-0.95,0-1.9,0-2.85c-0.43-0.26-1.07-0.54-1.86-0.54 C26.27,5.36,25.13,6.14,24.28,7.88z"/> <path d="M37.6,18.5c-0.83,0-1.33-0.63-1.42-1.44h-0.02V8.42h2.88V5.54h-2.88V1.22L32.92,2.3v3.24H30.4v2.88h2.52v9.18 c0,1.51,0.89,2.82,2.18,3.42c0.49,0.23,1.03,0.36,1.6,0.36c1.06,0,2.01-0.44,2.7-1.14v-2.82h-0.02 C38.52,18.31,38.16,18.5,37.6,18.5z"/> <path d="M53.8,24.26c-1.32-0.44-2.88-3.6-2.88-3.6l-0.5-1.17l6.22-13.95h-3.73l-4.23,9.89l-4.19-9.8h-3.73l6.18,13.86 l1.74,3.89l0.07,0.16h0.01c0.08,0.16,0.15,0.31,0.23,0.45c1.02,1.77,3.37,4.54,7.69,2.92V23.6C55.96,24.26,54.82,24.6,53.8,24.26z "/> <path d="M67.66,6.69c-1.09-0.89-2.41-1.42-3.82-1.42c-3.8,0-6.88,3.77-6.88,8.41c0,4.64,3.08,8.41,6.88,8.41 c1.41,0,2.72-0.52,3.82-1.41c-0.03,1.51-0.8,2.93-2.11,3.68c-0.87,0.5-1.86,0.79-2.92,0.79c-1.98,0-3.74-0.64-4.86-2.19v3.47 c1.39,1.22,3.22,1.97,5.22,1.97c1.75,0,3.37-0.57,4.68-1.53c1.96-1.44,3.24-3.77,3.24-6.39V5.54h-3.24V6.69z M67.66,14.09v0.88 c-0.5,2.11-1.96,3.65-3.69,3.65c-2.14,0-3.87-2.34-3.87-5.22s1.73-5.22,3.87-5.22c1.73,0,3.19,1.53,3.69,3.65V14.09z"/> <path d="M83.32,6.26c-1.51-0.96-3.21-0.91-3.78-0.9c-0.4,0.01-1.6,0.06-2.7,0.54c-2.29,1-3.96,3.24-4.13,7.49 c0,0.05,0,0.1,0,0.16c0,4.52,3.3,8.19,7.38,8.19c1.95,0,3.72-0.84,5.04-2.21v-3.28c-1.35,1.6-3.27,2.61-5.4,2.61 c-0.18,0-0.36-0.01-0.54-0.02c-1.87-0.48-3.24-1.99-3.24-3.78c0-0.12,0.01-0.24,0.02-0.36c0.01-0.11,0.03-0.23,0.05-0.34 c0,0,0,0,0,0h8.85h1.03h0.31v-2.07c0-0.27-0.02-0.54-0.05-0.81C86.13,11.09,85.91,7.9,83.32,6.26z M82.76,11.48h-0.44h-3.74h-2.42 c0.33-1.26,1.41-3.42,3.48-3.29C82.6,8.19,82.77,11.35,82.76,11.48z"/> <path d="M100.25,9.87c0,0,0-0.01,0-0.01c-0.08-0.41-0.18-0.8-0.28-1.17c-0.54-1.77-1.65-2.62-2.78-3.01 c-1.69-0.58-3.42-0.11-3.42-0.11l0,0c-1.23,0.2-2.16,0.98-2.88,2.46v-2.5h-3.24v15.84h3.24v-8.48c0-0.01,0.01-0.02,0.01-0.02 c0-0.05-0.01-0.1-0.01-0.16c0-2.29,1.74-4.14,3.88-4.14l0.02,0c1.01,0,1.9,0.68,2.16,1.66c0.16,0.6,0.22,1.23,0.24,1.72v0.79 c0,0.04,0,0.06,0,0.06l0,0v8.57h3.24v-8.3v-1.32C100.42,11.13,100.37,10.49,100.25,9.87z"/> </g> <g fill="darkgray"> <path d="M109.24,22.46c-1.12-0.84-1.61-0.89-2.16-1.44c-0.12-0.12-0.2-0.4-0.11-0.64c0.19-0.54,1.29-0.75,2.09-0.51 c0.35,0.1,0.66,0.26,0.91,0.44v-1.19c-0.23-0.18-0.73-0.53-1.44-0.62c-0.26-0.03-1.04-0.13-1.8,0.36 c-0.19,0.12-0.7,0.49-0.95,1.17c-0.08,0.21-0.21,0.56-0.13,0.99c0.1,0.49,0.43,0.81,0.72,1.08c0.39,0.36,0.8,0.57,1.08,0.72 c0.21,0.12,0.8,0.43,1.08,0.72c0.23,0.23,0.4,0.41,0.42,0.69c0,0.05,0.02,0.26-0.09,0.44c-0.36,0.58-1.65,0.34-1.78,0.32 c-0.65-0.13-1.12-0.46-1.42-0.73l-0.02,0.01v1.52c0.39,0.24,1.16,0.65,2.16,0.64c0.37-0.01,0.9-0.02,1.44-0.36 c0.12-0.08,0.45-0.3,0.72-0.72c0.12-0.19,0.36-0.56,0.36-1.08c0-0.52-0.23-0.88-0.36-1.08C109.83,22.97,109.65,22.76,109.24,22.46 z"/> <path d="M113.68,20.66c-0.51,0-0.99,0.19-1.38,0.52v-0.52h-1.08v7.92h1.08v-2.77c0.39,0.33,0.87,0.52,1.38,0.52 c1.32,0,2.4-1.27,2.4-2.83S115.01,20.66,113.68,20.66z M113.64,25.15c-0.7,0-1.27-0.7-1.34-1.58v-0.35 c0.07-0.89,0.64-1.58,1.34-1.58c0.75,0,1.35,0.79,1.35,1.76C114.99,24.37,114.38,25.15,113.64,25.15z"/> <path d="M119.22,20.56c0,0-1.34-0.26-2.27,0.56v1.32c0,0,2.23-1.9,2.67,0.07c-1.8-0.31-2.67,0.81-2.67,0.81 c-1.29,1.57,0.09,2.55,0.09,2.55c0.96,0.74,2.15,0.1,2.6-0.2l0,0.44h1.17v-3.72C120.81,22.38,120.92,20.83,119.22,20.56z M118.73,25.15c-1.31,0.17-1.09-0.78-1.09-0.78c0.19-0.97,1.5-0.89,1.99-0.83l0,0.91C119.3,25.08,118.73,25.15,118.73,25.15z"/> <path d="M123.81,20.66c-1.48,0-2.33,1.25-2.33,2.79s0.84,2.79,2.33,2.79c0.54,0,1.04-0.17,1.46-0.45l0.07-0.05l0-1.11 c-0.3,0.32-0.72,0.53-1.18,0.53c-0.91,0-1.65-0.77-1.65-1.71c0-0.94,0.74-1.71,1.65-1.71c0.47,0,0.89,0.21,1.19,0.53l0-1.11 c-0.14-0.1-0.28-0.18-0.43-0.26C124.58,20.75,124.2,20.66,123.81,20.66z"/> <path d="M130.53,22.77c-0.01-0.13-0.08-1.24-0.98-1.8c-0.52-0.33-1.11-0.31-1.31-0.31c-0.14,0-0.55,0.02-0.93,0.19 c-0.79,0.34-1.37,1.12-1.43,2.59c0,0.02,0,0.04,0,0.05c0,1.56,1.14,2.83,2.55,2.83c0.67,0,1.28-0.29,1.74-0.76v-1.13 c-0.47,0.55-1.13,0.9-1.86,0.9c-0.06,0-0.13,0-0.19-0.01c-0.65-0.16-1.12-0.69-1.12-1.31c0-0.04,0-0.08,0.01-0.12 c0-0.04,0.01-0.08,0.02-0.12c0,0,0,0,0,0h3.06h0.36h0.11v-0.72C130.55,22.96,130.54,22.87,130.53,22.77z M129.21,22.77h-1.29 h-0.84c0.12-0.44,0.49-1.18,1.2-1.14c1.03,0,1.08,1.09,1.08,1.14H129.21z"/> </g> </g> </svg>');
-			}
-		}
-
-		.foot {
-			margin-bottom: 32px;
-			width: 100%;
-			height: 200px;
-			--background: #f0f0f0;
-			display: flex;
-			textarea {
-				width: 100%;
-				height: 100%;
-				margin: 4px;
-				outline: none;
-				border: 1px solid #ccc;
-				border-radius: 8px;
-				resize: none;
-				padding: 8px;
-			}
-		}
-	}
-}
-
-:host(nx-ai-container.collapse) {
-	width: 0px;
-	animation: collapse 0.1s ease-in-out forwards;
-	box-shadow: unset;
-
-	.expand-icon {
-		position: absolute;
-		width: 48px;
-		height: 40px;
-		bottom: 32px;
-		left: -48px;
-		background: white;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		border-top-left-radius: 18px;
-		border-bottom-left-radius: 18px;
-		cursor: pointer;
-		box-shadow: 0 0 8px 4px rgba(0, 0, 0, 0.3); /* ✅ 퍼지는 그림자 */
-		background-repeat: no-repeat;
-		background-position: center;
-		background-size: auto;
-		background-image: url('data:image/svg+xml;utf8,<svg width="32" height="32" fill="green" xmlns="http://www.w3.org/2000/svg" strokeWidth="1.5" viewBox="-0.17090198558635983 0.482230148717937 41.14235318283891 40.0339509076386"><text x="-9999" y="-9999">ChatGPT</text><path d="M37.532 16.87a9.963 9.963 0 0 0-.856-8.184 10.078 10.078 0 0 0-10.855-4.835A9.964 9.964 0 0 0 18.306.5a10.079 10.079 0 0 0-9.614 6.977 9.967 9.967 0 0 0-6.664 4.834 10.08 10.08 0 0 0 1.24 11.817 9.965 9.965 0 0 0 .856 8.185 10.079 10.079 0 0 0 10.855 4.835 9.965 9.965 0 0 0 7.516 3.35 10.078 10.078 0 0 0 9.617-6.981 9.967 9.967 0 0 0 6.663-4.834 10.079 10.079 0 0 0-1.243-11.813zM22.498 37.886a7.474 7.474 0 0 1-4.799-1.735c.061-.033.168-.091.237-.134l7.964-4.6a1.294 1.294 0 0 0 .655-1.134V19.054l3.366 1.944a.12.12 0 0 1 .066.092v9.299a7.505 7.505 0 0 1-7.49 7.496zM6.392 31.006a7.471 7.471 0 0 1-.894-5.023c.06.036.162.099.237.141l7.964 4.6a1.297 1.297 0 0 0 1.308 0l9.724-5.614v3.888a.12.12 0 0 1-.048.103l-8.051 4.649a7.504 7.504 0 0 1-10.24-2.744zM4.297 13.62A7.469 7.469 0 0 1 8.2 10.333c0 .068-.004.19-.004.274v9.201a1.294 1.294 0 0 0 .654 1.132l9.723 5.614-3.366 1.944a.12.12 0 0 1-.114.01L7.04 23.856a7.504 7.504 0 0 1-2.743-10.237zm27.658 6.437l-9.724-5.615 3.367-1.943a.121.121 0 0 1 .113-.01l8.052 4.648a7.498 7.498 0 0 1-1.158 13.528v-9.476a1.293 1.293 0 0 0-.65-1.132zm3.35-5.043c-.059-.037-.162-.099-.236-.141l-7.965-4.6a1.298 1.298 0 0 0-1.308 0l-9.723 5.614v-3.888a.12.12 0 0 1 .048-.103l8.05-4.645a7.497 7.497 0 0 1 11.135 7.763zm-21.063 6.929l-3.367-1.944a.12.12 0 0 1-.065-.092v-9.299a7.497 7.497 0 0 1 12.293-5.756 6.94 6.94 0 0 0-.236.134l-7.965 4.6a1.294 1.294 0 0 0-.654 1.132l-.006 11.225zm1.829-3.943l4.33-2.501 4.332 2.5v5l-4.331 2.5-4.331-2.5V18z"/></svg>');
-	}
-}
-
-
-:host(nx-ai-message) {
-	display: flex;
-	justify-content: flex-start;
-	padding: 5px;
-	flex-direction: column;
-
-	.chat-message {
-		max-width: 70%;
-		border-radius: 8px;
-		font-size: 14px;
-		background-color: #fff;
-		color: black;
-		align-self: flex-start;
-		text-align: left;
-		position: relative;
-		box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.15);
-		text-overflow: ellipsis;
-		padding: 8px 16px;
-		display: flex;
-		align-items: center;
-
-		div.message {
-			display: -webkit-box;
-			-webkit-line-clamp: 3;
-			-webkit-box-orient: vertical;
-			overflow: hidden;
-			padding: 0;
-			flex-grow: 1;
-			/* 줄바꿈 강제 적용 */
-			/**word-wrap: break-word;*/ /* 긴 단어를 줄바꿈 */
-			overflow-wrap: anywhere; /* 텍스트 길이에 따라 자동 줄바꿈 */
-			white-space: normal; /* 공백 처리 */
-		}
-
-		span.more {
-			right: 4px;
-			bottom: 0px;
-			font-size: 9px;
-			font-weight: 700;
-
-			a {
-				position: relative;
-				color: green;
-				text-decoration: none;
-			}
-
-			a::after {
-				content: "";
-				position: absolute;
-				left: 0;
-				bottom: -2px;
-				width: 100%;
-				height: 2px;
-				background-color: green;
-				transform: scaleX(0);
-				transition: transform 0.3s ease-in-out;
-			}
-
-			a:hover::after {
-				transform: scaleX(1);
-			}
-		}
-	}
-
-	.grid {
-		margin-top: 8px;
-	}
-
-	.chat-menu {
-		display: flex;
-		justify-content: space-between; /* 좌우 정렬 */
-		align-items: center; /* 세로 중앙 정렬 */
-		width: 100%;
-		margin-top: 2px;
-
-		.left-menu{
-			display: flex;
-			gap: 4px;
-
-			.filter.disabled, .database.disabled {
-				pointer-events: none;
-				color: #ccc;
-			}
-
-			.filter, .database, .excel, .maximize {
-				margin-left: 0;
-				cursor: pointer;
-				color: #999;
-				width: 16px;
-				height: 16px;
-				background-repeat: no-repeat;
-				background-position: center;
-				background-size: auto;
-			}
-
-			.filter svg {
-				color: #999;
-			}
-
-			.filter:hover, .database:hover, .excel:hover, .maximize:hover {
-				color: green;
-			}
-
-			.filter {
-				background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="gray" viewBox="0 0 16 16"><path d="M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5zm1 .5v1.308l4.372 4.858A.5.5 0 0 1 7 8.5v5.306l2-.666V8.5a.5.5 0 0 1 .128-.334L13.5 3.308V2z"/></svg>');
-			}
-			.database {
-				background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="gray" viewBox="0 0 16 16"><path d="M4.318 2.687C5.234 2.271 6.536 2 8 2s2.766.27 3.682.687C12.644 3.125 13 3.627 13 4c0 .374-.356.875-1.318 1.313C10.766 5.729 9.464 6 8 6s-2.766-.27-3.682-.687C3.356 4.875 3 4.373 3 4c0-.374.356-.875 1.318-1.313M13 5.698V7c0 .374-.356.875-1.318 1.313C10.766 8.729 9.464 9 8 9s-2.766-.27-3.682-.687C3.356 7.875 3 7.373 3 7V5.698c.271.202.58.378.904.525C4.978 6.711 6.427 7 8 7s3.022-.289 4.096-.777A5 5 0 0 0 13 5.698M14 4c0-1.007-.875-1.755-1.904-2.223C11.022 1.289 9.573 1 8 1s-3.022.289-4.096.777C2.875 2.245 2 2.993 2 4v9c0 1.007.875 1.755 1.904 2.223C4.978 15.71 6.427 16 8 16s3.022-.289 4.096-.777C13.125 14.755 14 14.007 14 13zm-1 4.698V10c0 .374-.356.875-1.318 1.313C10.766 11.729 9.464 12 8 12s-2.766-.27-3.682-.687C3.356 10.875 3 10.373 3 10V8.698c.271.202.58.378.904.525C4.978 9.71 6.427 10 8 10s3.022-.289 4.096-.777A5 5 0 0 0 13 8.698m0 3V13c0 .374-.356.875-1.318 1.313C10.766 14.729 9.464 15 8 15s-2.766-.27-3.682-.687C3.356 13.875 3 13.373 3 13v-1.302c.271.202.58.378.904.525C4.978 12.71 6.427 13 8 13s3.022-.289 4.096-.777c.324-.147.633-.323.904-.525"/></svg>');
-			}
-			.excel {
-				background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="gray" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M14 4.5V14a2 2 0 0 1-2 2h-1v-1h1a1 1 0 0 0 1-1V4.5h-2A1.5 1.5 0 0 1 9.5 3V1H4a1 1 0 0 0-1 1v9H2V2a2 2 0 0 1 2-2h5.5zM6.472 15.29a1.2 1.2 0 0 1-.111-.449h.765a.58.58 0 0 0 .254.384q.106.073.25.114.143.041.319.041.246 0 .413-.07a.56.56 0 0 0 .255-.193.5.5 0 0 0 .085-.29.39.39 0 0 0-.153-.326q-.152-.12-.462-.193l-.619-.143a1.7 1.7 0 0 1-.539-.214 1 1 0 0 1-.351-.367 1.1 1.1 0 0 1-.123-.524q0-.366.19-.639.19-.272.527-.422.338-.15.777-.149.457 0 .78.152.324.153.5.41.18.255.2.566h-.75a.56.56 0 0 0-.12-.258.6.6 0 0 0-.247-.181.9.9 0 0 0-.369-.068q-.325 0-.513.152a.47.47 0 0 0-.184.384q0 .18.143.3a1 1 0 0 0 .405.175l.62.143q.326.075.566.211a1 1 0 0 1 .375.358q.135.222.135.56 0 .37-.188.656a1.2 1.2 0 0 1-.539.439q-.351.158-.858.158-.381 0-.665-.09a1.4 1.4 0 0 1-.478-.252 1.1 1.1 0 0 1-.29-.375m-2.945-3.358h-.893L1.81 13.37h-.036l-.832-1.438h-.93l1.227 1.983L0 15.931h.861l.853-1.415h.035l.85 1.415h.908L2.253 13.94zm2.727 3.325H4.557v-3.325h-.79v4h2.487z"/></svg>');
-			}
-			.maximize {
-				background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="gray" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M5.828 10.172a.5.5 0 0 0-.707 0l-4.096 4.096V11.5a.5.5 0 0 0-1 0v3.975a.5.5 0 0 0 .5.5H4.5a.5.5 0 0 0 0-1H1.732l4.096-4.096a.5.5 0 0 0 0-.707m4.344 0a.5.5 0 0 1 .707 0l4.096 4.096V11.5a.5.5 0 1 1 1 0v3.975a.5.5 0 0 1-.5.5H11.5a.5.5 0 0 1 0-1h2.768l-4.096-4.096a.5.5 0 0 1 0-.707m0-4.344a.5.5 0 0 0 .707 0l4.096-4.096V4.5a.5.5 0 1 0 1 0V.525a.5.5 0 0 0-.5-.5H11.5a.5.5 0 0 0 0 1h2.768l-4.096 4.096a.5.5 0 0 0 0 .707m-4.344 0a.5.5 0 0 1-.707 0L1.025 1.732V4.5a.5.5 0 0 1-1 0V.525a.5.5 0 0 1 .5-.5H4.5a.5.5 0 0 1 0 1H1.732l4.096 4.096a.5.5 0 0 1 0 .707"/></svg>');
-			}
-		}
-	}
-}
-
-
-:host(nx-ai-ing-message) {
-	display: flex;
-	justify-content: flex-start;
-	padding: 0;
-
-	.chat-message {
-		padding: 0px 8px;
-		color: #999;
-		align-self: flex-start;
-		text-align: left;
-		position: relative;
-		font-size: 32px;
-		font-weight: bold;
-	}
-}
-
-
-:host(nx-ai-my-message) {
-	display: flex;
-	justify-content: flex-end;
-	padding: 5px;
-
-	.chat-message {
-		max-width: 70%;
-		padding: 8px 16px;
-		border-radius: 8px;
-		font-size: 14px;
-		background-color: #fef01b;
-		text-align: left;
-		color: #333;
-		align-self: flex-end;
-		position: relative;
-		box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.15);
-	}
-}
-
-:host(nx-ai-progress-message) {
-	display: flex;
-	justify-content: flex-start;
-	padding: 5px;
-	flex-direction: column;
-
-	.chat-message.progress-message {
-		max-width: 80%;
-		border-radius: 8px;
-		font-size: 14px;
-		background-color: #fff;
-		color: black;
-		align-self: flex-start;
-		text-align: left;
-		position: relative;
-		box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.15);
-		padding: 8px 16px; /* 버블 자체의 패딩 */
-	}
-
-	.progress-list {
-		list-style: none;
-		padding: 0;
-		margin: 0;
-		--font-size: 12px;
-	}
-
-	.progress-item {
-		display: flex;
-		align-items: center; /* 번호, 텍스트, 점을 세로 중앙 정렬 */
-		margin-bottom: 5px;
-		color: #999; /* 기본 텍스트 색상 */
-		font-size: 1em; /* 부모 폰트 사이즈(14px)를 따르도록 */
-		line-height: 1.4; /* 가독성을 위해 줄 간격 추가 */
-	}
-
-	.progress-item:last-child {
-		margin-bottom: 0;
-	}
-
-	/* 번호 스타일 */
-	.progress-item .step-number {
-		--font-weight: bold;
-		margin-right: 5px; /* 번호와 텍스트 사이 간격 */
-		color: #999; /* 번호 색상 */
-	}
-
-	/* 텍스트 내용 */
-	.progress-item .text {
-		--flex-grow: 1; /* 텍스트가 공간을 채우도록 */
-		white-space: nowrap; /* 텍스트가 줄바꿈되지 않도록 */
-	}
-
-	/* 진행 중 점 애니메이션 */
-	.progress-item .animated-dots {
-		width: 20px; /* 점 공간 확보 */
-		text-align: left; /* 점이 왼쪽에서 시작되도록 */
-		font-weight: bold;
-	}
-
-	/* completed 상태 */
-	.progress-item.completed {
-		color: #333; /* 완료된 텍스트 색상 */
-		--font-weight: bold; /* 완료 시 굵게 */
-	}
-	.progress-item.completed .animated-dots::after {
-		content: '✓'; /* 체크마크 */
-		margin-left: 5px; /* 체크마크와 텍스트 사이 간격 */
-		color: #28a745;
-		font-size: 1.0em; /* 체크마크 크기 */
-		font-weight: bold;
-	}
-
-	.progress-item.completed .step-number {
-		color: #333; /* 번호 색상 */
-	}
-
-	/* pending 상태에만 애니메이션 점 표시 */
-	.progress-item.pending .animated-dots {
-		/* JS로 내용이 채워지므로 별도의 CSS 애니메이션은 필요 없음 */
-	}
-}
-
-
-:host(nx-ai-chat) {
-	width: 100%;
-	height: 100%;
-	overflow: scroll;
-}
-
-
-
-:host(nx-ai-settings) {
-	z-index: 9;
-	display: flex;
-	flex-direction: column;
-	justify-content: flex-start;
-	align-items: flex-start;
-	position: absolute;
-	background: #fff;
-	left: 0;
-	right: 30px;
-	top: 48px;
-	bottom: 0;
-	--opacity: 0;
-	padding-left: 16px;
-	padding-right: 16px;
-	gap: 0;
-	--transform: translateX(100%);
-	--transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
-	transition: transform 0.3s ease-out;
-
-	.line {
-		font-size: 12px;
-		display: flex;
-	}
-
-	.line:first-of-type {
-		--margin-top: 32px;
-	}
-
-	.subject {
-		font-weight: 700;
-		height: 24px;
-		margin-top: 32px;
-	}
-
-	.contents {
-		--margin-left: 16px;
-		width: 100%;
-		gap: 32px;
-	}
-
-	.analyze {
-		font-weight: 400;
-		input[type="number"]::-webkit-inner-spin-button,
-		input[type="number"]::-webkit-outer-spin-button {
-			-webkit-appearance: none;
-			margin: 0;
-		}
-		input[type="number"] {
-			width: 32px;
-			text-align: center;
-			margin-left: 4px;
-			margin-right: 4px;
-		}
-		input[type="checkbox"] {
-			margin-left: 0;
-		}
-	}
-
-	label {
-		display: flex;
-		align-items: center;
-
-		input {
-			margin-bottom: 2px;
-		}
-	}
-
-	input[type="text"], input[type="number"] {
-		outline: none;
-		border-radius: 4px;
-		width: 100%;
-		height: 26px;
-		border: 1px solid #b1b2c8;
-		padding: 0 4px;
-		--margin-top: 8px;
-		color: #666;
-	}
-
-	select {
-		outline: none;
-		border-radius: 4px;
-		width: 100%;
-		height: 26px;
-		border: 1px solid #b1b2c8;
-		padding: 0 4px;
-		--margin-top: 8px;
-		color: #666;
-	}
-}
-
-:host(nx-ai-settings.expand) {
-	animation: slideLeft 0.3s ease-out forwards;
-}
-:host(nx-ai-settings:not(.expand)) {
-	animation: slideRight 0.3s ease-out forwards;
-}
-
-
-:host(ide-ai-loading-tips) {
-	/* ... (기존 스타일 유지) ... */
-
-	.chat-message.loading-tips-message {
-		/* ... (기존 스타일 유지) ... */
-		padding-bottom: 8px; /* 이미지 공간을 위해 하단 패딩 조정 */
-	}
-
-	.tip-content {
-		/* ... (기존 스타일 유지) ... */
-	}
-
-	.tip-label {
-		/* ... (기존 스타일 유지) ... */
-	}
-
-	.current-tip {
-		/* ... (기존 스타일 유지) ... */
-		margin-bottom: 10px; /* 팁 텍스트와 이미지 사이 간격 */
-	}
-
-	.tip-image-container {
-		width: 100%; /* 컨테이너 너비 */
-		max-height: 150px; /* 이미지 컨테이너 최대 높이 설정 (조정 가능) */
-		overflow: hidden; /* 이미지가 컨테이너를 벗어나지 않도록 */
-		display: flex; /* 이미지를 중앙 정렬하기 위해 flex 사용 */
-		justify-content: center; /* 가로 중앙 정렬 */
-		align-items: center; /* 세로 중앙 정렬 */
-		background-color: #f0f0f0; /* 이미지 배경색 (선택 사항) */
-		border-radius: 4px;
-		margin-top: 5px; /* 팁 텍스트와 이미지 컨테이너 사이 간격 */
-		display: none; /* 초기에는 숨김, JS에서 활성화 */
-	}
-
-	.tip-image {
-		max-width: 100%; /* 컨테이너 너비에 맞춤 */
-		max-height: 100%; /* 컨테이너 높이에 맞춤 */
-		object-fit: contain; /* 이미지가 잘리지 않고 비율 유지 */
-		border-radius: 4px; /* 이미지 모서리 둥글게 */
-		display: none; /* 초기에는 숨김, JS에서 활성화 */
-	}
-
-	/* 로딩 스피너 애니메이션 */
-	@keyframes spin {
-		0% { transform: rotate(0deg); }
-		100% { transform: rotate(360deg); }
-	}
-}
-

package/dist/css/aiMessage.css

@@ -1,18 +0,0 @@
-:host {
-	display: flex;
-	padding: 5px;
-	max-width: 70%;
-	padding: 8px 16px;
-	border-radius: 8px;
-	font-size: 14px;
-	text-align: left;
-	color: #333;
-	align-self: flex-end;
-	position: relative;
-	box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.15);
-}
-
-:host(nx-ai-my-message) {
-	justify-content: flex-end;
-	background-color: #fef01b;
-}