gnui 1.2.20 → 1.2.21

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 (79) hide show
  1. package/@types/gnui.d.ts +8 -0
  2. package/dist/js/gnui.esm.js +528 -149
  3. package/dist/js/gnui.js +528 -149
  4. package/dist/js/gnui.min.js +6 -6
  5. package/dist/styles/default.css +144 -0
  6. package/dist/styles/gpi.css +144 -0
  7. package/dist/styles/green24.css +145 -1
  8. package/dist/styles/insights.css +144 -0
  9. package/dist/styles/nac.css +144 -0
  10. package/dist/styles/ztnac.css +145 -1
  11. package/package.json +7 -2
  12. package/styleguide/assets/components.js +155 -9
  13. package/styleguide/assets/js/gnui.js +528 -149
  14. package/styleguide/assets/js/gnui.min.js +6 -6
  15. package/styleguide/assets/styles/default.css +144 -0
  16. package/styleguide/assets/styles/gpi.css +144 -0
  17. package/styleguide/assets/styles/green24.css +145 -1
  18. package/styleguide/assets/styles/insights.css +144 -0
  19. package/styleguide/assets/styles/nac.css +144 -0
  20. package/styleguide/assets/styles/ztnac.css +145 -1
  21. package/styleguide/category/COLOR/index.html +1 -1
  22. package/styleguide/category/COMPONENT/Alert(js)/index.html +1 -1
  23. package/styleguide/category/COMPONENT/Bignumber/index.html +1 -1
  24. package/styleguide/category/COMPONENT/Breadcrumb/index.html +1 -1
  25. package/styleguide/category/COMPONENT/Calendar(js)/index.html +1 -1
  26. package/styleguide/category/COMPONENT/Card/index.html +1 -1
  27. package/styleguide/category/COMPONENT/Chart(js)/index.html +1 -1
  28. package/styleguide/category/COMPONENT/Datagrid(js)/index.html +109 -11
  29. package/styleguide/category/COMPONENT/Datalist(js)/index.html +1 -1
  30. package/styleguide/category/COMPONENT/Growl(js)/index.html +1 -1
  31. package/styleguide/category/COMPONENT/JsonView(js)/index.html +1 -1
  32. package/styleguide/category/COMPONENT/Loader(js)/index.html +1 -1
  33. package/styleguide/category/COMPONENT/MenuButton(js)/index.html +1 -1
  34. package/styleguide/category/COMPONENT/Message(js)/index.html +1 -1
  35. package/styleguide/category/COMPONENT/Modal(js)/index.html +31 -1
  36. package/styleguide/category/COMPONENT/Pagination(js)/index.html +1 -1
  37. package/styleguide/category/COMPONENT/Panel/index.html +1 -1
  38. package/styleguide/category/COMPONENT/Progressbar(js)/index.html +1 -1
  39. package/styleguide/category/COMPONENT/Tab(js)/index.html +1 -1
  40. package/styleguide/category/COMPONENT/Tagcloud(js)/index.html +1 -1
  41. package/styleguide/category/COMPONENT/Tooltip(js)/index.html +1 -1
  42. package/styleguide/category/COMPONENT/Tree(js)/index.html +83 -19
  43. package/styleguide/category/CONTROLS/Button(js)/index.html +1 -1
  44. package/styleguide/category/CONTROLS/Checkbox/index.html +1 -1
  45. package/styleguide/category/CONTROLS/Colorpicker(js)/index.html +1 -1
  46. package/styleguide/category/CONTROLS/Datepicker(js)/index.html +1 -1
  47. package/styleguide/category/CONTROLS/Dropdown(js)/index.html +1 -1
  48. package/styleguide/category/CONTROLS/File/index.html +1 -1
  49. package/styleguide/category/CONTROLS/Form/Control/index.html +1 -1
  50. package/styleguide/category/CONTROLS/Form/Field/index.html +53 -1
  51. package/styleguide/category/CONTROLS/Form/Plain/index.html +1 -1
  52. package/styleguide/category/CONTROLS/Input/index.html +1 -1
  53. package/styleguide/category/CONTROLS/MultiText(js)/index.html +32 -1
  54. package/styleguide/category/CONTROLS/Picklist(js)/index.html +1 -1
  55. package/styleguide/category/CONTROLS/Radio/index.html +1 -1
  56. package/styleguide/category/CONTROLS/Select/index.html +1 -1
  57. package/styleguide/category/CONTROLS/SelectButton(js)/index.html +1 -1
  58. package/styleguide/category/CONTROLS/Slider/index.html +1 -1
  59. package/styleguide/category/CONTROLS/SortableList(js)/index.html +1 -1
  60. package/styleguide/category/CONTROLS/Switch(js)/index.html +1 -1
  61. package/styleguide/category/CONTROLS/SyntaxInput(js)/index.html +1 -1
  62. package/styleguide/category/CONTROLS/Textarea/index.html +1 -1
  63. package/styleguide/category/CONTROLS/Time(js)/index.html +1 -1
  64. package/styleguide/category/ELEMENTS/Box/index.html +1 -1
  65. package/styleguide/category/ELEMENTS/Icon/index.html +1 -1
  66. package/styleguide/category/ELEMENTS/Image/index.html +1 -1
  67. package/styleguide/category/ELEMENTS/List/index.html +1 -1
  68. package/styleguide/category/ELEMENTS/Table/index.html +1 -1
  69. package/styleguide/category/ELEMENTS/Tag/index.html +1 -1
  70. package/styleguide/category/ELEMENTS/Title/index.html +1 -1
  71. package/styleguide/category/LAYOUT/Container/index.html +1 -1
  72. package/styleguide/category/LAYOUT/Grid/index.html +1 -1
  73. package/styleguide/category/LAYOUT/Splitter(js)/index.html +1 -1
  74. package/styleguide/category/UTILITY/index.html +9 -2
  75. package/styleguide/category/Utils/index.html +1 -1
  76. package/styleguide/color.html +1 -1
  77. package/styleguide/index.html +1 -1
  78. package/styleguide/tag/javascript/index.html +252 -29
  79. package/styleguide/tag/v.0.1.0/index.html +312 -30
@@ -147,12 +147,16 @@
147
147
  </div>
148
148
  <div class="new-multitext">
149
149
  </div>
150
+ <div class="message-multitext">
151
+ </div>
150
152
  </div>
151
153
 
152
154
  <pre><code class="language-ejs"><span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;</span>div</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>default-multitext<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>
153
155
  <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;/</span>div</span><span class="token punctuation" >></span></span>
154
156
  <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;</span>div</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>new-multitext<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>
155
157
  <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;/</span>div</span><span class="token punctuation" >></span></span>
158
+ <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;</span>div</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>message-multitext<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>
159
+ <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;/</span>div</span><span class="token punctuation" >></span></span>
156
160
  </code></pre>
157
161
  <pre><code>Gn<span class="token punctuation" >.</span><span class="token function" >create</span><span class="token punctuation" >(</span><span class="token string" >'multitext'</span><span class="token punctuation" >,</span> {
158
162
  target<span class="token punctuation" >:</span> <span class="token string" >'.default-multitext'</span>
@@ -168,6 +172,20 @@ Gn<span class="token punctuation" >.</span><span class="token function" >create<
168
172
  }<span class="token punctuation" >,</span>
169
173
  maxlength<span class="token punctuation" >:</span> <span class="token number" >300</span>
170
174
  }<span class="token punctuation" >)</span>
175
+
176
+ Gn<span class="token punctuation" >.</span><span class="token function" >create</span><span class="token punctuation" >(</span><span class="token string" >'multitext'</span><span class="token punctuation" >,</span> {
177
+ target<span class="token punctuation" >:</span> <span class="token string" >'.message-multitext'</span><span class="token punctuation" >,</span>
178
+ lang<span class="token punctuation" >:</span> <span class="token punctuation" >[</span><span class="token string" >'ko'</span><span class="token punctuation" >,</span> <span class="token string" >'en'</span><span class="token punctuation" >]</span><span class="token punctuation" >,</span>
179
+ value<span class="token punctuation" >:</span> {
180
+ ko<span class="token punctuation" >:</span> <span class="token string" >'옵션 문구 예시'</span><span class="token punctuation" >,</span>
181
+ en<span class="token punctuation" >:</span> <span class="token string" >'message example'</span>
182
+ }<span class="token punctuation" >,</span>
183
+ maxlength<span class="token punctuation" >:</span> <span class="token number" >120</span><span class="token punctuation" >,</span>
184
+ useMaxLengthMessage<span class="token punctuation" >:</span> <span class="token boolean" >true</span><span class="token punctuation" >,</span>
185
+ textSets<span class="token punctuation" >:</span> {
186
+ maxLengthMessage<span class="token punctuation" >:</span> <span class="token string" >'{{maxlength}}자 입력 가능합니다.'</span>
187
+ }
188
+ }<span class="token punctuation" >)</span>
171
189
  </code></pre><table class="gn-table is-full is-border">
172
190
  <thead>
173
191
  <th colspan="2">name</th>
@@ -218,6 +236,19 @@ Gn<span class="token punctuation" >.</span><span class="token function" >create<
218
236
  <td>524288</td>
219
237
  <td>최대 입력 글자길이</td>
220
238
  </tr>
239
+ <tr>
240
+ <td>textSets</td>
241
+ <td>maxLengthMessage</td>
242
+ <td>string</td>
243
+ <td>&#39;{{maxlength}}자 입력 가능합니다.&#39;</td>
244
+ <td><code>maxlength</code> 및 <code>useMaxLengthMessage=true</code>일 때 적용되는 남은 입력 가능 글자 안내 문구</td>
245
+ </tr>
246
+ <tr>
247
+ <td colspan="2">useMaxLengthMessage</td>
248
+ <td>boolean</td>
249
+ <td>false</td>
250
+ <td>true인 경우에만 <code>textSets.maxLengthMessage</code> 안내 문구 모드 활성화 (기본 카운터는 유지)</td>
251
+ </tr>
221
252
  <tr>
222
253
  <td colspan="2">onChange(value)</td>
223
254
  <td>function</td>
@@ -265,7 +296,7 @@ Gn<span class="token punctuation" >.</span><span class="token function" >create<
265
296
  </div>
266
297
 
267
298
 
268
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
299
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
269
300
  </div>
270
301
  </div>
271
302
  </div>
@@ -794,7 +794,7 @@
794
794
  </div>
795
795
 
796
796
 
797
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
797
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
798
798
  </div>
799
799
  </div>
800
800
  </div>
@@ -189,7 +189,7 @@
189
189
  </div>
190
190
 
191
191
 
192
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
192
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
193
193
  </div>
194
194
  </div>
195
195
  </div>
@@ -448,7 +448,7 @@
448
448
  </div>
449
449
 
450
450
 
451
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
451
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
452
452
  </div>
453
453
  </div>
454
454
  </div>
@@ -283,7 +283,7 @@
283
283
  </div>
284
284
 
285
285
 
286
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
286
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
287
287
  </div>
288
288
  </div>
289
289
  </div>
@@ -181,7 +181,7 @@
181
181
  </div>
182
182
 
183
183
 
184
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
184
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
185
185
  </div>
186
186
  </div>
187
187
  </div>
@@ -478,7 +478,7 @@
478
478
  </div>
479
479
 
480
480
 
481
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
481
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
482
482
  </div>
483
483
  </div>
484
484
  </div>
@@ -337,7 +337,7 @@
337
337
  </div>
338
338
 
339
339
 
340
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
340
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
341
341
  </div>
342
342
  </div>
343
343
  </div>
@@ -472,7 +472,7 @@
472
472
  </div>
473
473
 
474
474
 
475
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
475
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
476
476
  </div>
477
477
  </div>
478
478
  </div>
@@ -177,7 +177,7 @@
177
177
  </div>
178
178
 
179
179
 
180
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
180
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
181
181
  </div>
182
182
  </div>
183
183
  </div>
@@ -255,7 +255,7 @@
255
255
  </div>
256
256
 
257
257
 
258
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
258
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
259
259
  </div>
260
260
  </div>
261
261
  </div>
@@ -162,7 +162,7 @@
162
162
  </div>
163
163
 
164
164
 
165
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
165
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
166
166
  </div>
167
167
  </div>
168
168
  </div>
@@ -350,7 +350,7 @@
350
350
  </div>
351
351
 
352
352
 
353
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
353
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
354
354
  </div>
355
355
  </div>
356
356
  </div>
@@ -201,7 +201,7 @@
201
201
  </div>
202
202
 
203
203
 
204
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
204
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
205
205
  </div>
206
206
  </div>
207
207
  </div>
@@ -384,7 +384,7 @@
384
384
  </div>
385
385
 
386
386
 
387
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
387
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
388
388
  </div>
389
389
  </div>
390
390
  </div>
@@ -471,7 +471,7 @@
471
471
  </div>
472
472
 
473
473
 
474
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
474
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
475
475
  </div>
476
476
  </div>
477
477
  </div>
@@ -243,7 +243,7 @@
243
243
  </div>
244
244
 
245
245
 
246
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
246
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
247
247
  </div>
248
248
  </div>
249
249
  </div>
@@ -174,7 +174,7 @@
174
174
  </div>
175
175
 
176
176
 
177
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
177
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
178
178
  </div>
179
179
  </div>
180
180
  </div>
@@ -223,7 +223,7 @@
223
223
  </div>
224
224
 
225
225
 
226
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
226
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
227
227
  </div>
228
228
  </div>
229
229
  </div>
@@ -388,7 +388,7 @@
388
388
  </div>
389
389
 
390
390
 
391
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
391
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
392
392
  </div>
393
393
  </div>
394
394
  </div>
@@ -267,7 +267,7 @@
267
267
  </div>
268
268
 
269
269
 
270
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
270
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
271
271
  </div>
272
272
  </div>
273
273
  </div>
@@ -243,7 +243,7 @@
243
243
  </code></pre>
244
244
  <h2 id="text-">Text 변환</h2>
245
245
  <ul>
246
- <li>is-capitalize, is-lowercase, is-uppercase, is-italic, is-underline, is-strike</li>
246
+ <li>is-capitalize, is-lowercase, is-uppercase, is-italic, is-underline, is-strike, is-text-link</li>
247
247
  <li>한글 description 사용 시 size6 이하 사용하지 않는다.</li>
248
248
  </ul>
249
249
  <div class="aigis-preview">
@@ -265,6 +265,9 @@
265
265
  <div class="gn-box is-strike">
266
266
  <h4 class="gn-title is-size4">strike</h4> Ad non deserunt veniam consectetur enim.
267
267
  </div>
268
+ <div class="gn-box is-text-link">
269
+ <h4 class="gn-title is-size4">text link</h4> Link style text (hover: underline + pointer)
270
+ </div>
268
271
  <div class="gn-box">
269
272
  <h4 class="gn-title is-size4">Text Sizes</h4>
270
273
  <p class="has-text-size1">size1 : Fugiat cillum reprehenderit ullamco esse non cillum.</p>
@@ -302,6 +305,10 @@
302
305
  <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;</span>h4</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>gn-title is-size4<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>strike<span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;/</span>h4</span><span class="token punctuation" >></span></span>
303
306
  Ad non deserunt veniam consectetur enim.
304
307
  <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;/</span>div</span><span class="token punctuation" >></span></span>
308
+ <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;</span>div</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>gn-box is-text-link<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>
309
+ <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;</span>h4</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>gn-title is-size4<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>text link<span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;/</span>h4</span><span class="token punctuation" >></span></span>
310
+ Link style text (hover: underline + pointer)
311
+ <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;/</span>div</span><span class="token punctuation" >></span></span>
305
312
  <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;</span>div</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>gn-box<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>
306
313
  <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;</span>h4</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>gn-title is-size4<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>Text Sizes<span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;/</span>h4</span><span class="token punctuation" >></span></span>
307
314
  <span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;</span>p</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>has-text-size1<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>size1 : Fugiat cillum reprehenderit ullamco esse non cillum.<span class="token tag" ><span class="token tag" ><span class="token punctuation" >&lt;/</span>p</span><span class="token punctuation" >></span></span>
@@ -463,7 +470,7 @@
463
470
  </div>
464
471
 
465
472
 
466
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
473
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
467
474
  </div>
468
475
  </div>
469
476
  </div>
@@ -329,7 +329,7 @@ GN<span class="token punctuation" >.</span>util<span class="token punctuation" >
329
329
  </div>
330
330
 
331
331
 
332
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
332
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
333
333
  </div>
334
334
  </div>
335
335
  </div>
@@ -161,7 +161,7 @@
161
161
  </div>
162
162
  </div>
163
163
 
164
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
164
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
165
165
  </div>
166
166
  </div>
167
167
  </div>
@@ -161,7 +161,7 @@
161
161
  </div>
162
162
  </div>
163
163
 
164
- <footer class="aigis-footer">Last update at 2026/02/04 13:16</footer>
164
+ <footer class="aigis-footer">Last update at 2026/04/23 04:53</footer>
165
165
  </div>
166
166
  </div>
167
167
  </div>