ninegrid2 6.257.0 → 6.258.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,31 @@
1
+ :host {
2
+ display: flex;
3
+ justify-content: flex-end;
4
+ padding: 5px;
5
+ max-width: 70%;
6
+ padding: 8px 16px;
7
+ border-radius: 8px;
8
+ font-size: 14px;
9
+ background-color: #fef01b;
10
+ text-align: left;
11
+ color: #333;
12
+ align-self: flex-end;
13
+ position: relative;
14
+ box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.15);
15
+ }
16
+
17
+ :host(nx-ai-my-message) {
18
+ display: flex;
19
+ justify-content: flex-end;
20
+ padding: 5px;
21
+ max-width: 70%;
22
+ padding: 8px 16px;
23
+ border-radius: 8px;
24
+ font-size: 14px;
25
+ background-color: red;
26
+ text-align: left;
27
+ color: #333;
28
+ align-self: flex-end;
29
+ position: relative;
30
+ box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.15);
31
+ }
@@ -77,9 +77,11 @@ class ngMaxPopup extends HTMLElement
77
77
  }
78
78
 
79
79
  popup = () => {
80
- //console.log(this.#owner.data);
81
- this.#grd.data.assign(this.#owner.data.get());
82
- this.shadowRoot.querySelector('dialog').showModal();
80
+ setTimeout(() => {
81
+ /** 생성 즉시 호출시 오류 (this.#grd.data null) */
82
+ this.#grd.data.assign(this.#owner.data.get());
83
+ this.shadowRoot.querySelector('dialog').showModal();
84
+ }, 100);
83
85
  };
84
86
  }
85
87
 
@@ -133,9 +133,9 @@ class ngMenu extends HTMLElement
133
133
  //if (ninegrid.j.querySelectorAll(this.#owner).hasClass("ng-maximize")) {
134
134
  $('ng-max-popup', this.#owner.shadowRoot).remove();
135
135
  $(this.#owner.shadowRoot).append($('<ng-max-popup></ng-max-popup>'));
136
- setTimeout(() => {
137
- this.#owner.shadowRoot.querySelector("ng-max-popup").popup();
138
- }, 1000);
136
+ //setTimeout(() => {
137
+ this.#owner.shadowRoot.querySelector("ng-max-popup").popup();
138
+ //}, 100);
139
139
 
140
140
  //}
141
141
  break;
package/dist/index.js CHANGED
@@ -100,6 +100,7 @@ import "./etc/nxTopMenu.js";
100
100
  //import "./etc/object-observe.js";
101
101
 
102
102
  import "./ai/aiSettings.js";
103
+ import "./ai/aiMessage.js";
103
104
 
104
105
  if (typeof window !== "undefined") {
105
106
  //window.ninegrid = window.NG = ninegrid;
@@ -19,8 +19,6 @@ export class ninegrid {
19
19
  });
20
20
  }
21
21
 
22
- console.log("shadow" in Element.prototype);
23
-
24
22
  if (!("shadow" in Element.prototype)) {
25
23
  Object.defineProperty(Element.prototype, "shadow", {
26
24
  get: function () {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "ninegrid2",
3
3
  "type": "module",
4
- "version": "6.257.0",
4
+ "version": "6.258.0",
5
5
  "main": "dist/index.js",
6
6
  "exports": {
7
7
  "import": "./dist/index.js",
@@ -0,0 +1,95 @@
1
+ //import ninegrid from "../index.js";
2
+
3
+ class aiMyMessage extends HTMLElement
4
+ {
5
+ constructor() {
6
+ super();
7
+ this.attachShadow({ mode: 'open' });
8
+ }
9
+
10
+ get server() {
11
+ return this.shadowRoot.querySelector('input[name="server"]:checked')?.value;
12
+ };
13
+ set server(v) {
14
+ const elem = this.shadowRoot.querySelector(`input[name="server"][value="${v}"]`);
15
+ if (elem) elem.checked = true;
16
+
17
+ this.shadowRoot.querySelectorAll('input[name="server"]').forEach(el => {
18
+ el.dispatchEvent(new Event("change"));
19
+ });
20
+
21
+ this.dispatchEvent(new CustomEvent(this.EVENT.MODEL_CHANGE, {
22
+ detail: { server: this.server, model: this.model }
23
+ }));
24
+ };
25
+
26
+ get model() {
27
+ return this.shadowRoot.querySelector(`#${this.server}Model`)?.value;
28
+ };
29
+ set model(v) {
30
+ const elem = this.shadowRoot.querySelector(`#${this.server}Model`);
31
+ if (elem) {
32
+ elem.value = v;
33
+ elem.dispatchEvent(new Event("change"));
34
+ }
35
+
36
+ /**
37
+ this.dispatchEvent(new CustomEvent("setting-change", {
38
+ detail: { server: this.server, model: this.model }
39
+ })); */
40
+ };
41
+
42
+
43
+
44
+ connectedCallback() {
45
+
46
+ const msg = this.getAttribute("message");
47
+
48
+ console.log(msg);
49
+
50
+ this.shadowRoot.innerHTML = `
51
+ <style>
52
+ @import "https://cdn.jsdelivr.net/npm/ninegrid2@${ninegrid.version}/dist/css/aiMessage.css";
53
+ ${ninegrid.getCustomPath(this,"ngInputText.css")}
54
+ </style>
55
+
56
+ <div class="line">
57
+ aaa
58
+ </div>
59
+ `;
60
+
61
+ this.#init();
62
+ };
63
+
64
+
65
+
66
+ #init = () => {
67
+
68
+
69
+ return;
70
+
71
+ this.shadowRoot.querySelectorAll('input[name="server"]').forEach((radio) => {
72
+ radio.addEventListener("change", () => {
73
+ const server = this.shadowRoot.querySelector('input[name="server"]:checked').value;
74
+
75
+ ["openai","ollama"].forEach(v => {
76
+ this.shadowRoot.querySelectorAll('.' + v).forEach((elem) => {
77
+ elem.style.display = (server === v) ? "flex" : "none";
78
+ });
79
+ });
80
+ });
81
+ });
82
+
83
+ this.shadowRoot.querySelectorAll('#ollamaModel,#openaiModel,input[name="server"]').forEach(el => {
84
+ //console.log(el);
85
+ el.addEventListener("change", e => {
86
+ //console.log(e);
87
+ this.dispatchEvent(new CustomEvent(this.EVENT.MODEL_CHANGE, {
88
+ detail: { server: this.server, model: this.model }
89
+ }));
90
+ });
91
+ });
92
+ }
93
+ }
94
+
95
+ customElements.define("nx-ai-my-message", aiMyMessage);
@@ -0,0 +1,31 @@
1
+ :host {
2
+ display: flex;
3
+ justify-content: flex-end;
4
+ padding: 5px;
5
+ max-width: 70%;
6
+ padding: 8px 16px;
7
+ border-radius: 8px;
8
+ font-size: 14px;
9
+ background-color: #fef01b;
10
+ text-align: left;
11
+ color: #333;
12
+ align-self: flex-end;
13
+ position: relative;
14
+ box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.15);
15
+ }
16
+
17
+ :host(nx-ai-my-message) {
18
+ display: flex;
19
+ justify-content: flex-end;
20
+ padding: 5px;
21
+ max-width: 70%;
22
+ padding: 8px 16px;
23
+ border-radius: 8px;
24
+ font-size: 14px;
25
+ background-color: red;
26
+ text-align: left;
27
+ color: #333;
28
+ align-self: flex-end;
29
+ position: relative;
30
+ box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.15);
31
+ }
@@ -77,9 +77,11 @@ class ngMaxPopup extends HTMLElement
77
77
  }
78
78
 
79
79
  popup = () => {
80
- //console.log(this.#owner.data);
81
- this.#grd.data.assign(this.#owner.data.get());
82
- this.shadowRoot.querySelector('dialog').showModal();
80
+ setTimeout(() => {
81
+ /** 생성 즉시 호출시 오류 (this.#grd.data null) */
82
+ this.#grd.data.assign(this.#owner.data.get());
83
+ this.shadowRoot.querySelector('dialog').showModal();
84
+ }, 100);
83
85
  };
84
86
  }
85
87
 
package/src/etc/ngMenu.js CHANGED
@@ -133,9 +133,9 @@ class ngMenu extends HTMLElement
133
133
  //if (ninegrid.j.querySelectorAll(this.#owner).hasClass("ng-maximize")) {
134
134
  $('ng-max-popup', this.#owner.shadowRoot).remove();
135
135
  $(this.#owner.shadowRoot).append($('<ng-max-popup></ng-max-popup>'));
136
- setTimeout(() => {
137
- this.#owner.shadowRoot.querySelector("ng-max-popup").popup();
138
- }, 1000);
136
+ //setTimeout(() => {
137
+ this.#owner.shadowRoot.querySelector("ng-max-popup").popup();
138
+ //}, 100);
139
139
 
140
140
  //}
141
141
  break;
package/src/index.js CHANGED
@@ -100,6 +100,7 @@ import "./etc/nxTopMenu.js";
100
100
  //import "./etc/object-observe.js";
101
101
 
102
102
  import "./ai/aiSettings.js";
103
+ import "./ai/aiMessage.js";
103
104
 
104
105
  if (typeof window !== "undefined") {
105
106
  //window.ninegrid = window.NG = ninegrid;
@@ -19,8 +19,6 @@ export class ninegrid {
19
19
  });
20
20
  }
21
21
 
22
- console.log("shadow" in Element.prototype);
23
-
24
22
  if (!("shadow" in Element.prototype)) {
25
23
  Object.defineProperty(Element.prototype, "shadow", {
26
24
  get: function () {