ninegrid2 6.641.0 → 6.643.0

package/dist/bundle.cjs.js

@@ -193072,6 +193072,97 @@ class aiContainer extends HTMLElement
 
 customElements.define("nx-ai-container", aiContainer);
 
+class ideAssi extends HTMLElement
+{
+	#ing = false;
+
+	constructor() {
+		super();
+		this.attachShadow({ mode: 'open' });
+	}
+	
+	connectedCallback() {
+
+		const textareaText = "나에게 무엇이든 물어봐...";
+		
+		this.shadowRoot.innerHTML = `
+			<style>
+				@import "https://cdn.jsdelivr.net/npm/ninegrid@${ninegrid.version}/dist/css/ideAssi.css";
+				${ninegrid.getCustomPath(this,"ideAssi.css")}
+			</style>
+
+			<div class="wrapper">
+				<div class="container">
+					<div class="head">
+						<div class="logo"></div>
+					</div>
+					<nx-ai-chat></nx-ai-chat>
+					<div class="foot">
+						<textarea name="ask" id="q" name="q" rows="4" placeholder="${textareaText}"></textarea>
+					</div>
+				</div>
+				<div class="menu">
+					<div class="collapse-icon"></div>
+					<div class="menu-icon menu-filter active"></div>
+					<div class="menu-icon menu-general"></div>
+					<div class="menu-icon menu-setting"></div>
+				</div>
+			</div>
+
+			<div class="expand-icon"></div>
+		`;
+
+		requestAnimationFrame(() => {
+			this.#init();
+		});
+	};
+
+
+	#init = (info) => {
+		
+		this.shadowRoot.querySelector("textarea").addEventListener("keydown", this.#keydownHandler);
+
+		this.shadowRoot.querySelector(".expand-icon").addEventListener("click", this.#toggleCollapseHandler);
+		this.shadowRoot.querySelector(".collapse-icon").addEventListener("click", this.#toggleCollapseHandler);
+
+		//this.shadowRoot.querySelectorAll(".menu-icon").forEach(el => el.addEventListener("click", this.#menuClickHandler));
+	};
+
+	#keydownHandler = async (e) => {
+		if (e.key !== "Enter") return;
+
+		e.preventDefault();
+
+		const question = e.target.value.trim();
+		if (!question) return;
+
+		if (this.#ing) return;
+		this.#ing = true;
+
+		/**
+		 * setTimeout 없으면, 맥에서 한글 잔상이 남음
+		 * setTimeout 내에서 e.target이 nx-ai-container가 된다.
+		 */
+		setTimeout(() => {
+			this.shadowRoot.querySelector("textarea").value = "";
+		});
+
+		const elAiChat = this.shadowRoot.querySelector("nx-ai-chat");
+
+		elAiChat.add("me", question);
+		elAiChat.add("ing", question);
+
+
+		this.#ing = false;
+	}
+
+	#toggleCollapseHandler = () => {
+		this.classList.toggle("collapse");
+	};
+}
+
+customElements.define("nx-ide-assi", ideAssi);
+
 //import $ from "https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js";
 
 

package/dist/bundle.esm.js

@@ -193068,6 +193068,97 @@ class aiContainer extends HTMLElement
 
 customElements.define("nx-ai-container", aiContainer);
 
+class ideAssi extends HTMLElement
+{
+	#ing = false;
+
+	constructor() {
+		super();
+		this.attachShadow({ mode: 'open' });
+	}
+	
+	connectedCallback() {
+
+		const textareaText = "나에게 무엇이든 물어봐...";
+		
+		this.shadowRoot.innerHTML = `
+			<style>
+				@import "https://cdn.jsdelivr.net/npm/ninegrid@${ninegrid.version}/dist/css/ideAssi.css";
+				${ninegrid.getCustomPath(this,"ideAssi.css")}
+			</style>
+
+			<div class="wrapper">
+				<div class="container">
+					<div class="head">
+						<div class="logo"></div>
+					</div>
+					<nx-ai-chat></nx-ai-chat>
+					<div class="foot">
+						<textarea name="ask" id="q" name="q" rows="4" placeholder="${textareaText}"></textarea>
+					</div>
+				</div>
+				<div class="menu">
+					<div class="collapse-icon"></div>
+					<div class="menu-icon menu-filter active"></div>
+					<div class="menu-icon menu-general"></div>
+					<div class="menu-icon menu-setting"></div>
+				</div>
+			</div>
+
+			<div class="expand-icon"></div>
+		`;
+
+		requestAnimationFrame(() => {
+			this.#init();
+		});
+	};
+
+
+	#init = (info) => {
+		
+		this.shadowRoot.querySelector("textarea").addEventListener("keydown", this.#keydownHandler);
+
+		this.shadowRoot.querySelector(".expand-icon").addEventListener("click", this.#toggleCollapseHandler);
+		this.shadowRoot.querySelector(".collapse-icon").addEventListener("click", this.#toggleCollapseHandler);
+
+		//this.shadowRoot.querySelectorAll(".menu-icon").forEach(el => el.addEventListener("click", this.#menuClickHandler));
+	};
+
+	#keydownHandler = async (e) => {
+		if (e.key !== "Enter") return;
+
+		e.preventDefault();
+
+		const question = e.target.value.trim();
+		if (!question) return;
+
+		if (this.#ing) return;
+		this.#ing = true;
+
+		/**
+		 * setTimeout 없으면, 맥에서 한글 잔상이 남음
+		 * setTimeout 내에서 e.target이 nx-ai-container가 된다.
+		 */
+		setTimeout(() => {
+			this.shadowRoot.querySelector("textarea").value = "";
+		});
+
+		const elAiChat = this.shadowRoot.querySelector("nx-ai-chat");
+
+		elAiChat.add("me", question);
+		elAiChat.add("ing", question);
+
+
+		this.#ing = false;
+	}
+
+	#toggleCollapseHandler = () => {
+		this.classList.toggle("collapse");
+	};
+}
+
+customElements.define("nx-ide-assi", ideAssi);
+
 //import $ from "https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js";
 
 

package/dist/ide-assi/ideAssi.js

@@ -0,0 +1,107 @@
+import ninegrid from "../index.js";
+import { ChatGoogleGenerativeAI } from "@langchain/google-genai";
+import { Ollama } from "@langchain/ollama";
+import { ChatOpenAI } from '@langchain/openai';
+import { HumanMessage, SystemMessage } from '@langchain/core/messages';
+import { OllamaEmbeddings } from "@langchain/ollama";
+import { QdrantClient } from "@qdrant/js-client-rest";
+import { StringOutputParser } from "@langchain/core/output_parsers"
+import { PromptTemplate} from "@langchain/core/prompts"
+
+class ideAssi extends HTMLElement
+{
+	#ing = false;
+
+	constructor() {
+		super();
+		this.attachShadow({ mode: 'open' });
+	}
+	
+	connectedCallback() {
+
+		const textareaText = "나에게 무엇이든 물어봐...";
+		
+		this.shadowRoot.innerHTML = `
+			<style>
+				@import "https://cdn.jsdelivr.net/npm/ninegrid@${ninegrid.version}/dist/css/ideAssi.css";
+				${ninegrid.getCustomPath(this,"ideAssi.css")}
+			</style>
+
+			<div class="wrapper">
+				<div class="container">
+					<div class="head">
+						<div class="logo"></div>
+					</div>
+					<nx-ai-chat></nx-ai-chat>
+					<div class="foot">
+						<textarea name="ask" id="q" name="q" rows="4" placeholder="${textareaText}"></textarea>
+					</div>
+				</div>
+				<div class="menu">
+					<div class="collapse-icon"></div>
+					<div class="menu-icon menu-filter active"></div>
+					<div class="menu-icon menu-general"></div>
+					<div class="menu-icon menu-setting"></div>
+				</div>
+			</div>
+
+			<div class="expand-icon"></div>
+		`;
+
+		requestAnimationFrame(() => {
+			this.#init();
+		});
+	};
+
+
+	#init = (info) => {
+		
+		this.shadowRoot.querySelector("textarea").addEventListener("keydown", this.#keydownHandler);
+
+		this.shadowRoot.querySelector(".expand-icon").addEventListener("click", this.#toggleCollapseHandler);
+		this.shadowRoot.querySelector(".collapse-icon").addEventListener("click", this.#toggleCollapseHandler);
+
+		//this.shadowRoot.querySelectorAll(".menu-icon").forEach(el => el.addEventListener("click", this.#menuClickHandler));
+	};
+
+	#keydownHandler = async (e) => {
+		if (e.key !== "Enter") return;
+
+		e.preventDefault();
+
+		const question = e.target.value.trim();
+		if (!question) return;
+
+		if (this.#ing) return;
+		this.#ing = true;
+
+		/**
+		 * setTimeout 없으면, 맥에서 한글 잔상이 남음
+		 * setTimeout 내에서 e.target이 nx-ai-container가 된다.
+		 */
+		setTimeout(() => {
+			this.shadowRoot.querySelector("textarea").value = "";
+		});
+
+		const elAiChat = this.shadowRoot.querySelector("nx-ai-chat");
+
+		elAiChat.add("me", question);
+		elAiChat.add("ing", question);
+
+		try {
+			//
+		} catch (error) {
+			console.error(error);
+			//elAiChat.add("ai", error);
+		}
+
+
+		this.#ing = false;
+	}
+
+	#toggleCollapseHandler = () => {
+		this.classList.toggle("collapse");
+	};
+}
+
+customElements.define("nx-ide-assi", ideAssi);

package/dist/index.js

@@ -106,6 +106,9 @@ import "./ai/aiSettings.js";
 import "./ai/aiMessage.js";
 import "./ai/aiContainer.js";
 
+
+import "./ide-assi/ideAssi.js";
+
 if (typeof window !== "undefined") {
 	//window.ninegrid = window.NG = ninegrid;
 }

package/package.json

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

package/src/ide-assi/ideAssi.js

@@ -0,0 +1,107 @@
+import ninegrid from "../index.js";
+import { ChatGoogleGenerativeAI } from "@langchain/google-genai";
+import { Ollama } from "@langchain/ollama";
+import { ChatOpenAI } from '@langchain/openai';
+import { HumanMessage, SystemMessage } from '@langchain/core/messages';
+import { OllamaEmbeddings } from "@langchain/ollama";
+import { QdrantClient } from "@qdrant/js-client-rest";
+import { StringOutputParser } from "@langchain/core/output_parsers"
+import { PromptTemplate} from "@langchain/core/prompts"
+
+class ideAssi extends HTMLElement
+{
+	#ing = false;
+
+	constructor() {
+		super();
+		this.attachShadow({ mode: 'open' });
+	}
+	
+	connectedCallback() {
+
+		const textareaText = "나에게 무엇이든 물어봐...";
+		
+		this.shadowRoot.innerHTML = `
+			<style>
+				@import "https://cdn.jsdelivr.net/npm/ninegrid@${ninegrid.version}/dist/css/ideAssi.css";
+				${ninegrid.getCustomPath(this,"ideAssi.css")}
+			</style>
+
+			<div class="wrapper">
+				<div class="container">
+					<div class="head">
+						<div class="logo"></div>
+					</div>
+					<nx-ai-chat></nx-ai-chat>
+					<div class="foot">
+						<textarea name="ask" id="q" name="q" rows="4" placeholder="${textareaText}"></textarea>
+					</div>
+				</div>
+				<div class="menu">
+					<div class="collapse-icon"></div>
+					<div class="menu-icon menu-filter active"></div>
+					<div class="menu-icon menu-general"></div>
+					<div class="menu-icon menu-setting"></div>
+				</div>
+			</div>
+
+			<div class="expand-icon"></div>
+		`;
+
+		requestAnimationFrame(() => {
+			this.#init();
+		});
+	};
+
+
+	#init = (info) => {
+		
+		this.shadowRoot.querySelector("textarea").addEventListener("keydown", this.#keydownHandler);
+
+		this.shadowRoot.querySelector(".expand-icon").addEventListener("click", this.#toggleCollapseHandler);
+		this.shadowRoot.querySelector(".collapse-icon").addEventListener("click", this.#toggleCollapseHandler);
+
+		//this.shadowRoot.querySelectorAll(".menu-icon").forEach(el => el.addEventListener("click", this.#menuClickHandler));
+	};
+
+	#keydownHandler = async (e) => {
+		if (e.key !== "Enter") return;
+
+		e.preventDefault();
+
+		const question = e.target.value.trim();
+		if (!question) return;
+
+		if (this.#ing) return;
+		this.#ing = true;
+
+		/**
+		 * setTimeout 없으면, 맥에서 한글 잔상이 남음
+		 * setTimeout 내에서 e.target이 nx-ai-container가 된다.
+		 */
+		setTimeout(() => {
+			this.shadowRoot.querySelector("textarea").value = "";
+		});
+
+		const elAiChat = this.shadowRoot.querySelector("nx-ai-chat");
+
+		elAiChat.add("me", question);
+		elAiChat.add("ing", question);
+
+		try {
+			//
+		} catch (error) {
+			console.error(error);
+			//elAiChat.add("ai", error);
+		}
+
+
+		this.#ing = false;
+	}
+
+	#toggleCollapseHandler = () => {
+		this.classList.toggle("collapse");
+	};
+}
+
+customElements.define("nx-ide-assi", ideAssi);

package/src/index.js

@@ -106,6 +106,9 @@ import "./ai/aiSettings.js";
 import "./ai/aiMessage.js";
 import "./ai/aiContainer.js";
 
+
+import "./ide-assi/ideAssi.js";
+
 if (typeof window !== "undefined") {
 	//window.ninegrid = window.NG = ninegrid;
 }