ninegrid2 6.360.0 → 6.362.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.
Files changed (5) hide show
  1. package/dist/ai/aiMessage.js +31 -8
  2. package/dist/bundle.cjs.js +31 -8
  3. package/dist/bundle.esm.js +31 -8
  4. package/package.json +1 -1
  5. package/src/ai/aiMessage.js +31 -8
package/dist/ai/aiMessage.js CHANGED
@@ -20,10 +20,8 @@ class aiMessage extends HTMLElement
20
20
  </style>
21
21
 
22
22
  <div class="chat-message">
23
- <span title="${this.#message}" class="message">
24
- ${this.#message.replaceAll("\n\n", "<br/>").replaceAll("\n", "<br/>")}
25
- </span>
26
- <span class="more" style="position:relative;"><a href="#">more</a></span>
23
+ <span class="message"></span>
24
+ <span class="more"><a href="#">more</a></span>
27
25
  </div>
28
26
 
29
27
  <div class="chat-menu">
@@ -36,10 +34,24 @@ class aiMessage extends HTMLElement
36
34
  </div>
37
35
  `;
38
36
 
39
- /**
40
37
  requestAnimationFrame(() => {
41
- console.log("requestAnimationFrame")
42
- }); */
38
+ const elMessage = this.shadowRoot.querySelector(".message");
39
+ elMessage.setAttribute("title", this.#message);
40
+ elMessage.innerHTML = this.#message.replaceAll("\n\n", "<br/>").replaceAll("\n", "<br/>");
41
+
42
+ setTimeout(() => {
43
+
44
+ const elMore = this.shadowRoot.querySelector(".more");
45
+
46
+ if (ninegrid.isEllipsis(this.shadowRoot.querySelector(".message"))) {
47
+ elMore.style.display = "flex";
48
+ elMore.style.position = "absolute";
49
+ }
50
+ else {
51
+ elMore.style.display = "none";
52
+ }
53
+ });
54
+ });
43
55
  };
44
56
 
45
57
 
@@ -58,6 +70,15 @@ class aiMessage extends HTMLElement
58
70
  <nine-grid class="ai" display-row-count="${rowCount > 5 ? 5 : rowCount}" show-title-bar="false" show-menu-icon="false" show-status-bar="false" select-type="row" auto-fit-col="true" show-title-bar="true" show-menu-icon="true" show-status-bar="true" enable-fixed-col="true" row-resizable="false" col-movable="true">
59
71
  <table>
60
72
  <caption>Sheet1</caption>
73
+ <colgroup>
74
+ <col background-color="gray"/>
75
+ <col background-color="gray"/>
76
+ <col background-color="red"/>
77
+ <col background-color="red"/>
78
+ <col background-color="red"/>
79
+ <col background-color="gray"/>
80
+ <col background-color="gray"/>
81
+ </colgroup>
61
82
  <thead>
62
83
  <tr>
63
84
  <th>No.</th>
@@ -95,7 +116,9 @@ class aiMessage extends HTMLElement
95
116
  alert(this.#message);
96
117
  });
97
118
 
119
+ /**
98
120
  setTimeout(() => {
121
+
99
122
  const elMore = this.shadowRoot.querySelector(".more");
100
123
 
101
124
  if (ninegrid.isEllipsis(this.shadowRoot.querySelector(".message"))) {
@@ -105,7 +128,7 @@ class aiMessage extends HTMLElement
105
128
  else {
106
129
  elMore.style.display = "none";
107
130
  }
108
- });
131
+ }); */
109
132
 
110
133
  setTimeout(() => {
111
134
  const grd = this.shadowRoot.querySelector("nine-grid");
package/dist/bundle.cjs.js CHANGED
@@ -27326,10 +27326,8 @@ class aiMessage extends HTMLElement
27326
27326
  </style>
27327
27327
 
27328
27328
  <div class="chat-message">
27329
- <span title="${this.#message}" class="message">
27330
- ${this.#message.replaceAll("\n\n", "<br/>").replaceAll("\n", "<br/>")}
27331
- </span>
27332
- <span class="more" style="position:relative;"><a href="#">more</a></span>
27329
+ <span class="message"></span>
27330
+ <span class="more"><a href="#">more</a></span>
27333
27331
  </div>
27334
27332
 
27335
27333
  <div class="chat-menu">
@@ -27342,10 +27340,24 @@ class aiMessage extends HTMLElement
27342
27340
  </div>
27343
27341
  `;
27344
27342
 
27345
- /**
27346
27343
  requestAnimationFrame(() => {
27347
- console.log("requestAnimationFrame")
27348
- }); */
27344
+ const elMessage = this.shadowRoot.querySelector(".message");
27345
+ elMessage.setAttribute("title", this.#message);
27346
+ elMessage.innerHTML = this.#message.replaceAll("\n\n", "<br/>").replaceAll("\n", "<br/>");
27347
+
27348
+ setTimeout(() => {
27349
+
27350
+ const elMore = this.shadowRoot.querySelector(".more");
27351
+
27352
+ if (ninegrid.isEllipsis(this.shadowRoot.querySelector(".message"))) {
27353
+ elMore.style.display = "flex";
27354
+ elMore.style.position = "absolute";
27355
+ }
27356
+ else {
27357
+ elMore.style.display = "none";
27358
+ }
27359
+ });
27360
+ });
27349
27361
  };
27350
27362
 
27351
27363
 
@@ -27364,6 +27376,15 @@ class aiMessage extends HTMLElement
27364
27376
  <nine-grid class="ai" display-row-count="${rowCount > 5 ? 5 : rowCount}" show-title-bar="false" show-menu-icon="false" show-status-bar="false" select-type="row" auto-fit-col="true" show-title-bar="true" show-menu-icon="true" show-status-bar="true" enable-fixed-col="true" row-resizable="false" col-movable="true">
27365
27377
  <table>
27366
27378
  <caption>Sheet1</caption>
27379
+ <colgroup>
27380
+ <col background-color="gray"/>
27381
+ <col background-color="gray"/>
27382
+ <col background-color="red"/>
27383
+ <col background-color="red"/>
27384
+ <col background-color="red"/>
27385
+ <col background-color="gray"/>
27386
+ <col background-color="gray"/>
27387
+ </colgroup>
27367
27388
  <thead>
27368
27389
  <tr>
27369
27390
  <th>No.</th>
@@ -27401,7 +27422,9 @@ class aiMessage extends HTMLElement
27401
27422
  alert(this.#message);
27402
27423
  });
27403
27424
 
27425
+ /**
27404
27426
  setTimeout(() => {
27427
+
27405
27428
  const elMore = this.shadowRoot.querySelector(".more");
27406
27429
 
27407
27430
  if (ninegrid.isEllipsis(this.shadowRoot.querySelector(".message"))) {
@@ -27411,7 +27434,7 @@ class aiMessage extends HTMLElement
27411
27434
  else {
27412
27435
  elMore.style.display = "none";
27413
27436
  }
27414
- });
27437
+ }); */
27415
27438
 
27416
27439
  setTimeout(() => {
27417
27440
  const grd = this.shadowRoot.querySelector("nine-grid");
package/dist/bundle.esm.js CHANGED
@@ -27324,10 +27324,8 @@ class aiMessage extends HTMLElement
27324
27324
  </style>
27325
27325
 
27326
27326
  <div class="chat-message">
27327
- <span title="${this.#message}" class="message">
27328
- ${this.#message.replaceAll("\n\n", "<br/>").replaceAll("\n", "<br/>")}
27329
- </span>
27330
- <span class="more" style="position:relative;"><a href="#">more</a></span>
27327
+ <span class="message"></span>
27328
+ <span class="more"><a href="#">more</a></span>
27331
27329
  </div>
27332
27330
 
27333
27331
  <div class="chat-menu">
@@ -27340,10 +27338,24 @@ class aiMessage extends HTMLElement
27340
27338
  </div>
27341
27339
  `;
27342
27340
 
27343
- /**
27344
27341
  requestAnimationFrame(() => {
27345
- console.log("requestAnimationFrame")
27346
- }); */
27342
+ const elMessage = this.shadowRoot.querySelector(".message");
27343
+ elMessage.setAttribute("title", this.#message);
27344
+ elMessage.innerHTML = this.#message.replaceAll("\n\n", "<br/>").replaceAll("\n", "<br/>");
27345
+
27346
+ setTimeout(() => {
27347
+
27348
+ const elMore = this.shadowRoot.querySelector(".more");
27349
+
27350
+ if (ninegrid.isEllipsis(this.shadowRoot.querySelector(".message"))) {
27351
+ elMore.style.display = "flex";
27352
+ elMore.style.position = "absolute";
27353
+ }
27354
+ else {
27355
+ elMore.style.display = "none";
27356
+ }
27357
+ });
27358
+ });
27347
27359
  };
27348
27360
 
27349
27361
 
@@ -27362,6 +27374,15 @@ class aiMessage extends HTMLElement
27362
27374
  <nine-grid class="ai" display-row-count="${rowCount > 5 ? 5 : rowCount}" show-title-bar="false" show-menu-icon="false" show-status-bar="false" select-type="row" auto-fit-col="true" show-title-bar="true" show-menu-icon="true" show-status-bar="true" enable-fixed-col="true" row-resizable="false" col-movable="true">
27363
27375
  <table>
27364
27376
  <caption>Sheet1</caption>
27377
+ <colgroup>
27378
+ <col background-color="gray"/>
27379
+ <col background-color="gray"/>
27380
+ <col background-color="red"/>
27381
+ <col background-color="red"/>
27382
+ <col background-color="red"/>
27383
+ <col background-color="gray"/>
27384
+ <col background-color="gray"/>
27385
+ </colgroup>
27365
27386
  <thead>
27366
27387
  <tr>
27367
27388
  <th>No.</th>
@@ -27399,7 +27420,9 @@ class aiMessage extends HTMLElement
27399
27420
  alert(this.#message);
27400
27421
  });
27401
27422
 
27423
+ /**
27402
27424
  setTimeout(() => {
27425
+
27403
27426
  const elMore = this.shadowRoot.querySelector(".more");
27404
27427
 
27405
27428
  if (ninegrid.isEllipsis(this.shadowRoot.querySelector(".message"))) {
@@ -27409,7 +27432,7 @@ class aiMessage extends HTMLElement
27409
27432
  else {
27410
27433
  elMore.style.display = "none";
27411
27434
  }
27412
- });
27435
+ }); */
27413
27436
 
27414
27437
  setTimeout(() => {
27415
27438
  const grd = this.shadowRoot.querySelector("nine-grid");
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "ninegrid2",
3
3
  "type": "module",
4
- "version": "6.360.0",
4
+ "version": "6.362.0",
5
5
  "main": "dist/index.js",
6
6
  "exports": {
7
7
  "import": "./dist/index.js",
package/src/ai/aiMessage.js CHANGED
@@ -20,10 +20,8 @@ class aiMessage extends HTMLElement
20
20
  </style>
21
21
 
22
22
  <div class="chat-message">
23
- <span title="${this.#message}" class="message">
24
- ${this.#message.replaceAll("\n\n", "<br/>").replaceAll("\n", "<br/>")}
25
- </span>
26
- <span class="more" style="position:relative;"><a href="#">more</a></span>
23
+ <span class="message"></span>
24
+ <span class="more"><a href="#">more</a></span>
27
25
  </div>
28
26
 
29
27
  <div class="chat-menu">
@@ -36,10 +34,24 @@ class aiMessage extends HTMLElement
36
34
  </div>
37
35
  `;
38
36
 
39
- /**
40
37
  requestAnimationFrame(() => {
41
- console.log("requestAnimationFrame")
42
- }); */
38
+ const elMessage = this.shadowRoot.querySelector(".message");
39
+ elMessage.setAttribute("title", this.#message);
40
+ elMessage.innerHTML = this.#message.replaceAll("\n\n", "<br/>").replaceAll("\n", "<br/>");
41
+
42
+ setTimeout(() => {
43
+
44
+ const elMore = this.shadowRoot.querySelector(".more");
45
+
46
+ if (ninegrid.isEllipsis(this.shadowRoot.querySelector(".message"))) {
47
+ elMore.style.display = "flex";
48
+ elMore.style.position = "absolute";
49
+ }
50
+ else {
51
+ elMore.style.display = "none";
52
+ }
53
+ });
54
+ });
43
55
  };
44
56
 
45
57
 
@@ -58,6 +70,15 @@ class aiMessage extends HTMLElement
58
70
  <nine-grid class="ai" display-row-count="${rowCount > 5 ? 5 : rowCount}" show-title-bar="false" show-menu-icon="false" show-status-bar="false" select-type="row" auto-fit-col="true" show-title-bar="true" show-menu-icon="true" show-status-bar="true" enable-fixed-col="true" row-resizable="false" col-movable="true">
59
71
  <table>
60
72
  <caption>Sheet1</caption>
73
+ <colgroup>
74
+ <col background-color="gray"/>
75
+ <col background-color="gray"/>
76
+ <col background-color="red"/>
77
+ <col background-color="red"/>
78
+ <col background-color="red"/>
79
+ <col background-color="gray"/>
80
+ <col background-color="gray"/>
81
+ </colgroup>
61
82
  <thead>
62
83
  <tr>
63
84
  <th>No.</th>
@@ -95,7 +116,9 @@ class aiMessage extends HTMLElement
95
116
  alert(this.#message);
96
117
  });
97
118
 
119
+ /**
98
120
  setTimeout(() => {
121
+
99
122
  const elMore = this.shadowRoot.querySelector(".more");
100
123
 
101
124
  if (ninegrid.isEllipsis(this.shadowRoot.querySelector(".message"))) {
@@ -105,7 +128,7 @@ class aiMessage extends HTMLElement
105
128
  else {
106
129
  elMore.style.display = "none";
107
130
  }
108
- });
131
+ }); */
109
132
 
110
133
  setTimeout(() => {
111
134
  const grd = this.shadowRoot.querySelector("nine-grid");