@libs-ui/icons 0.2.356-9 → 0.2.357-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.
- package/README.md +356 -2
- package/ai/ai.component.d.ts +7 -0
- package/ai-interaction/ai-interaction.component.d.ts +7 -0
- package/esm2022/ai/ai.component.mjs +13 -0
- package/esm2022/ai-interaction/ai-interaction.component.mjs +13 -0
- package/esm2022/get-icon.pipe.mjs +13 -1
- package/esm2022/index.mjs +11 -5
- package/esm2022/reload/reload.component.mjs +14 -0
- package/esm2022/send-solid/send-solid.component.mjs +14 -0
- package/esm2022/sparkles-ai-solid/sparkles-ai-solid.component.mjs +14 -0
- package/esm2022/stop-solid/stop-solid.component.mjs +14 -0
- package/fesm2022/libs-ui-icons.mjs +175 -69
- package/fesm2022/libs-ui-icons.mjs.map +1 -1
- package/index.d.ts +10 -4
- package/package.json +1 -1
- package/reload/reload.component.d.ts +8 -0
- package/send-solid/send-solid.component.d.ts +8 -0
- package/sparkles-ai-solid/sparkles-ai-solid.component.d.ts +8 -0
- package/stop-solid/stop-solid.component.d.ts +8 -0
package/README.md
CHANGED
|
@@ -1,3 +1,357 @@
|
|
|
1
|
-
# libs-ui
|
|
1
|
+
# @libs-ui/icons
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
> Bộ SVG icon components và pipe lazy-load dùng trong hệ sinh thái libs-ui.
|
|
4
|
+
|
|
5
|
+
## Giới thiệu
|
|
6
|
+
|
|
7
|
+
`@libs-ui/icons` cung cấp tập hợp các SVG icon được đóng gói thành Angular Standalone Component, hỗ trợ tùy biến kích thước và màu sắc thông qua Signal API. Thư viện còn bao gồm pipe `LibsUiIconsGetIconComponentPipe` để lazy-load icon component theo key string, phù hợp cho các trường hợp render icon động tại runtime mà không cần import tĩnh từng component.
|
|
8
|
+
|
|
9
|
+
## Tính năng
|
|
10
|
+
|
|
11
|
+
- ✅ 13 icon component SVG sẵn dùng (file types, AI, trạng thái rỗng, reload, v.v.)
|
|
12
|
+
- ✅ Tùy biến `size` và `color` thông qua Signal `input()`
|
|
13
|
+
- ✅ Hỗ trợ trạng thái `active` với màu riêng (`colorActive`)
|
|
14
|
+
- ✅ Pipe lazy-load icon theo key string — không import tĩnh toàn bộ bundle
|
|
15
|
+
- ✅ Mọi component đều Standalone + `ChangeDetectionStrategy.OnPush`
|
|
16
|
+
- ✅ Abstract base class `LibsUiIconsComponentAbstract` để mở rộng icon mới nhất quán
|
|
17
|
+
|
|
18
|
+
## Khi nào sử dụng
|
|
19
|
+
|
|
20
|
+
- Hiển thị icon định dạng file (PDF, Word, Excel, PPTX, JSON, XML) trong danh sách tài liệu hoặc upload preview
|
|
21
|
+
- Hiển thị trạng thái rỗng (`no-data`, `no-result`) trong bảng dữ liệu hoặc màn hình list
|
|
22
|
+
- Sử dụng icon AI (`ai`, `ai-interaction`, `sparkles-ai-solid`) trong các tính năng trí tuệ nhân tạo
|
|
23
|
+
- Render icon động theo key từ API/config mà không biết trước loại icon khi build
|
|
24
|
+
- Tích hợp icon `reload`, `send-solid`, `stop-solid` vào các nút hành động
|
|
25
|
+
|
|
26
|
+
## Cài đặt
|
|
27
|
+
|
|
28
|
+
```bash
|
|
29
|
+
npm install @libs-ui/icons
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
## Import
|
|
33
|
+
|
|
34
|
+
```typescript
|
|
35
|
+
// Import từng icon component cụ thể
|
|
36
|
+
import { LibsUiIconsAiComponent } from '@libs-ui/icons';
|
|
37
|
+
import { LibsUiIconsPdfComponent } from '@libs-ui/icons';
|
|
38
|
+
import { LibsUiIconsNoDataComponent } from '@libs-ui/icons';
|
|
39
|
+
import { LibsUiIconsReloadComponent } from '@libs-ui/icons';
|
|
40
|
+
import { LibsUiIconsSendSolidComponent } from '@libs-ui/icons';
|
|
41
|
+
import { LibsUiIconsStopSolidComponent } from '@libs-ui/icons';
|
|
42
|
+
import { LibsUiIconsSparklesAiSolidComponent } from '@libs-ui/icons';
|
|
43
|
+
import { LibsUiIconsAiInteractionComponent } from '@libs-ui/icons';
|
|
44
|
+
import { LibsUiIconsNoResultComponent } from '@libs-ui/icons';
|
|
45
|
+
import { LibsUiIconsWordComponent } from '@libs-ui/icons';
|
|
46
|
+
import { LibsUiIconsXlsxComponent } from '@libs-ui/icons';
|
|
47
|
+
import { LibsUiIconsPptxComponent } from '@libs-ui/icons';
|
|
48
|
+
import { LibsIconsJsonComponent } from '@libs-ui/icons';
|
|
49
|
+
import { LibsUiIconsXmlComponent } from '@libs-ui/icons';
|
|
50
|
+
import { LibsIconsImageDefaultComponent } from '@libs-ui/icons';
|
|
51
|
+
|
|
52
|
+
// Import pipe lazy-load
|
|
53
|
+
import { LibsUiIconsGetIconComponentPipe } from '@libs-ui/icons';
|
|
54
|
+
|
|
55
|
+
// Import abstract base class (khi tạo icon mới)
|
|
56
|
+
import { LibsUiIconsComponentAbstract } from '@libs-ui/icons';
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
## Ví dụ sử dụng
|
|
60
|
+
|
|
61
|
+
### Ví dụ 1 — Icon cơ bản với size và color tùy chỉnh
|
|
62
|
+
|
|
63
|
+
```typescript
|
|
64
|
+
import { Component } from '@angular/core';
|
|
65
|
+
import { ChangeDetectionStrategy } from '@angular/core';
|
|
66
|
+
import { LibsUiIconsPdfComponent } from '@libs-ui/icons';
|
|
67
|
+
import { LibsUiIconsWordComponent } from '@libs-ui/icons';
|
|
68
|
+
import { LibsUiIconsXlsxComponent } from '@libs-ui/icons';
|
|
69
|
+
|
|
70
|
+
@Component({
|
|
71
|
+
selector: 'app-file-icon-demo',
|
|
72
|
+
standalone: true,
|
|
73
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
74
|
+
imports: [LibsUiIconsPdfComponent, LibsUiIconsWordComponent, LibsUiIconsXlsxComponent],
|
|
75
|
+
template: `
|
|
76
|
+
<!-- PDF icon — size 24, màu mặc định -->
|
|
77
|
+
<libs_ui-icons-pdf [size]="24" />
|
|
78
|
+
|
|
79
|
+
<!-- Word icon — size 32 (mặc định) -->
|
|
80
|
+
<libs_ui-icons-word />
|
|
81
|
+
|
|
82
|
+
<!-- Excel icon — size 40, màu tùy chỉnh -->
|
|
83
|
+
<libs_ui-icons-xlsx [size]="40" [color]="'#217346'" />
|
|
84
|
+
`,
|
|
85
|
+
})
|
|
86
|
+
export class FileIconDemoComponent {}
|
|
87
|
+
```
|
|
88
|
+
|
|
89
|
+
### Ví dụ 2 — Icon trạng thái rỗng
|
|
90
|
+
|
|
91
|
+
```typescript
|
|
92
|
+
import { Component } from '@angular/core';
|
|
93
|
+
import { ChangeDetectionStrategy } from '@angular/core';
|
|
94
|
+
import { LibsUiIconsNoDataComponent } from '@libs-ui/icons';
|
|
95
|
+
import { LibsUiIconsNoResultComponent } from '@libs-ui/icons';
|
|
96
|
+
|
|
97
|
+
@Component({
|
|
98
|
+
selector: 'app-empty-state-demo',
|
|
99
|
+
standalone: true,
|
|
100
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
101
|
+
imports: [LibsUiIconsNoDataComponent, LibsUiIconsNoResultComponent],
|
|
102
|
+
template: `
|
|
103
|
+
<!-- Khi không có dữ liệu nào -->
|
|
104
|
+
<div class="flex flex-col items-center gap-2">
|
|
105
|
+
<libs_ui-icons-no_data [size]="65" />
|
|
106
|
+
<span class="libs-ui-font-h5r">Chưa có dữ liệu</span>
|
|
107
|
+
</div>
|
|
108
|
+
|
|
109
|
+
<!-- Khi tìm kiếm không có kết quả -->
|
|
110
|
+
<div class="flex flex-col items-center gap-2">
|
|
111
|
+
<libs_ui-icons-no_result [size]="65" />
|
|
112
|
+
<span class="libs-ui-font-h5r">Không tìm thấy kết quả</span>
|
|
113
|
+
</div>
|
|
114
|
+
`,
|
|
115
|
+
})
|
|
116
|
+
export class EmptyStateDemoComponent {}
|
|
117
|
+
```
|
|
118
|
+
|
|
119
|
+
### Ví dụ 3 — Icon AI với trạng thái active
|
|
120
|
+
|
|
121
|
+
```typescript
|
|
122
|
+
import { Component, signal } from '@angular/core';
|
|
123
|
+
import { ChangeDetectionStrategy } from '@angular/core';
|
|
124
|
+
import { LibsUiIconsAiComponent } from '@libs-ui/icons';
|
|
125
|
+
import { LibsUiIconsSparklesAiSolidComponent } from '@libs-ui/icons';
|
|
126
|
+
import { LibsUiIconsSendSolidComponent } from '@libs-ui/icons';
|
|
127
|
+
import { LibsUiIconsStopSolidComponent } from '@libs-ui/icons';
|
|
128
|
+
|
|
129
|
+
@Component({
|
|
130
|
+
selector: 'app-ai-icon-demo',
|
|
131
|
+
standalone: true,
|
|
132
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
133
|
+
imports: [
|
|
134
|
+
LibsUiIconsAiComponent,
|
|
135
|
+
LibsUiIconsSparklesAiSolidComponent,
|
|
136
|
+
LibsUiIconsSendSolidComponent,
|
|
137
|
+
LibsUiIconsStopSolidComponent,
|
|
138
|
+
],
|
|
139
|
+
template: `
|
|
140
|
+
<!-- AI icon gradient — size 32 (mặc định) -->
|
|
141
|
+
<libs_ui-icons-ai [size]="32" />
|
|
142
|
+
|
|
143
|
+
<!-- Sparkles AI solid — màu xanh mặc định #226FF5 -->
|
|
144
|
+
<libs_ui-icons-sparkles_ai_solid [size]="24" />
|
|
145
|
+
|
|
146
|
+
<!-- Send solid — active state đổi màu -->
|
|
147
|
+
<libs_ui-icons-send_solid
|
|
148
|
+
[size]="24"
|
|
149
|
+
[color]="'#226FF5'"
|
|
150
|
+
[colorActive]="'#0050CC'"
|
|
151
|
+
[active]="isActive()" />
|
|
152
|
+
|
|
153
|
+
<!-- Stop solid — dừng stream AI -->
|
|
154
|
+
<libs_ui-icons-stop_solid [size]="24" [color]="'#226FF5'" />
|
|
155
|
+
`,
|
|
156
|
+
})
|
|
157
|
+
export class AiIconDemoComponent {
|
|
158
|
+
protected isActive = signal(false);
|
|
159
|
+
}
|
|
160
|
+
```
|
|
161
|
+
|
|
162
|
+
### Ví dụ 4 — Lazy-load icon bằng pipe (render động)
|
|
163
|
+
|
|
164
|
+
```typescript
|
|
165
|
+
import { Component, signal } from '@angular/core';
|
|
166
|
+
import { AsyncPipe, NgComponentOutlet } from '@angular/common';
|
|
167
|
+
import { ChangeDetectionStrategy } from '@angular/core';
|
|
168
|
+
import { LibsUiIconsGetIconComponentPipe } from '@libs-ui/icons';
|
|
169
|
+
|
|
170
|
+
@Component({
|
|
171
|
+
selector: 'app-dynamic-icon-demo',
|
|
172
|
+
standalone: true,
|
|
173
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
174
|
+
imports: [AsyncPipe, NgComponentOutlet, LibsUiIconsGetIconComponentPipe],
|
|
175
|
+
template: `
|
|
176
|
+
<!-- Lazy-load icon theo key động -->
|
|
177
|
+
@for (file of files(); track file.id) {
|
|
178
|
+
<ng-container
|
|
179
|
+
*ngComponentOutlet="file.type | LibsUiIconsGetIconComponentPipe | async" />
|
|
180
|
+
}
|
|
181
|
+
`,
|
|
182
|
+
})
|
|
183
|
+
export class DynamicIconDemoComponent {
|
|
184
|
+
protected files = signal([
|
|
185
|
+
{ id: '1', name: 'report.pdf', type: 'pdf' },
|
|
186
|
+
{ id: '2', name: 'data.xlsx', type: 'xlsx' },
|
|
187
|
+
{ id: '3', name: 'doc.docx', type: 'word' },
|
|
188
|
+
{ id: '4', name: 'data.json', type: 'json' },
|
|
189
|
+
]);
|
|
190
|
+
}
|
|
191
|
+
```
|
|
192
|
+
|
|
193
|
+
### Ví dụ 5 — Icon reload và ai-interaction
|
|
194
|
+
|
|
195
|
+
```typescript
|
|
196
|
+
import { Component } from '@angular/core';
|
|
197
|
+
import { ChangeDetectionStrategy } from '@angular/core';
|
|
198
|
+
import { LibsUiIconsReloadComponent } from '@libs-ui/icons';
|
|
199
|
+
import { LibsUiIconsAiInteractionComponent } from '@libs-ui/icons';
|
|
200
|
+
|
|
201
|
+
@Component({
|
|
202
|
+
selector: 'app-action-icon-demo',
|
|
203
|
+
standalone: true,
|
|
204
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
205
|
+
imports: [LibsUiIconsReloadComponent, LibsUiIconsAiInteractionComponent],
|
|
206
|
+
template: `
|
|
207
|
+
<!-- Reload icon — màu xám mặc định #6A7383 -->
|
|
208
|
+
<button (click)="handlerReload($event)" class="p-2 hover:bg-gray-100 rounded">
|
|
209
|
+
<libs_ui-icons-reload [size]="20" />
|
|
210
|
+
</button>
|
|
211
|
+
|
|
212
|
+
<!-- AI Interaction icon — size 32 mặc định -->
|
|
213
|
+
<libs_ui-icons-ai-interaction [size]="28" />
|
|
214
|
+
`,
|
|
215
|
+
})
|
|
216
|
+
export class ActionIconDemoComponent {
|
|
217
|
+
protected handlerReload(event: Event): void {
|
|
218
|
+
event.stopPropagation();
|
|
219
|
+
// xử lý reload
|
|
220
|
+
}
|
|
221
|
+
}
|
|
222
|
+
```
|
|
223
|
+
|
|
224
|
+
## @Input() — Shared (tất cả icon components)
|
|
225
|
+
|
|
226
|
+
Tất cả icon component đều kế thừa `LibsUiIconsComponentAbstract` và có chung các input sau:
|
|
227
|
+
|
|
228
|
+
| Input | Type | Default | Mô tả | Ví dụ |
|
|
229
|
+
|---|---|---|---|---|
|
|
230
|
+
| `size` | `number` | `16` (xem bảng riêng) | Kích thước icon theo px (áp dụng cho cả width và height của SVG) | `[size]="24"` |
|
|
231
|
+
| `color` | `string` | `'#e6e7ea'` (xem bảng riêng) | Màu fill mặc định của icon khi không active | `[color]="'#333333'"` |
|
|
232
|
+
| `colorActive` | `string` | `'#ffffff'` | Màu fill của icon khi `active` là `true` | `[colorActive]="'#0050CC'"` |
|
|
233
|
+
| `active` | `boolean` | `undefined` | Khi `true`, icon hiển thị với màu `colorActive` thay vì `color` | `[active]="isSelected()"` |
|
|
234
|
+
|
|
235
|
+
### Default size và color theo từng component
|
|
236
|
+
|
|
237
|
+
| Component | Selector | Default size | Default color |
|
|
238
|
+
|---|---|---|---|
|
|
239
|
+
| `LibsUiIconsAiComponent` | `libs_ui-icons-ai` | `32` | `#e6e7ea` (gradient SVG) |
|
|
240
|
+
| `LibsUiIconsAiInteractionComponent` | `libs_ui-icons-ai-interaction` | `32` | `#e6e7ea` |
|
|
241
|
+
| `LibsIconsImageDefaultComponent` | `libs_ui-icons-image_default` | `64` | `#e6e7ea` |
|
|
242
|
+
| `LibsIconsJsonComponent` | `libs_ui-icons-json` | `32` | `#e6e7ea` |
|
|
243
|
+
| `LibsUiIconsNoDataComponent` | `libs_ui-icons-no_data` | `65` | `#e6e7ea` |
|
|
244
|
+
| `LibsUiIconsNoResultComponent` | `libs_ui-icons-no_result` | `65` | `#e6e7ea` |
|
|
245
|
+
| `LibsUiIconsPdfComponent` | `libs_ui-icons-pdf` | `32` | `#e6e7ea` |
|
|
246
|
+
| `LibsUiIconsPptxComponent` | `libs_ui-icons-pptx` | `32` | `#e6e7ea` |
|
|
247
|
+
| `LibsUiIconsReloadComponent` | `libs_ui-icons-reload` | `32` | `#6A7383` |
|
|
248
|
+
| `LibsUiIconsSendSolidComponent` | `libs_ui-icons-send_solid` | `32` | `#226FF5` |
|
|
249
|
+
| `LibsUiIconsSparklesAiSolidComponent` | `libs_ui-icons-sparkles_ai_solid` | `32` | `#226FF5` |
|
|
250
|
+
| `LibsUiIconsStopSolidComponent` | `libs_ui-icons-stop_solid` | `32` | `#226FF5` |
|
|
251
|
+
| `LibsUiIconsWordComponent` | `libs_ui-icons-word` | `32` | `#e6e7ea` |
|
|
252
|
+
| `LibsUiIconsXlsxComponent` | `libs_ui-icons-xlsx` | `32` | `#e6e7ea` |
|
|
253
|
+
| `LibsUiIconsXmlComponent` | `libs_ui-icons-xml` | `32` | `#e6e7ea` |
|
|
254
|
+
|
|
255
|
+
## Pipe — LibsUiIconsGetIconComponentPipe
|
|
256
|
+
|
|
257
|
+
Pipe async lazy-load icon component theo key string. Trả về `Promise<Type<any> | null>`, dùng kết hợp với `AsyncPipe` và `NgComponentOutlet`.
|
|
258
|
+
|
|
259
|
+
| Tham số | Type | Bắt buộc | Mô tả | Ví dụ |
|
|
260
|
+
|---|---|---|---|---|
|
|
261
|
+
| `key` | `string \| undefined` | Không | Key định danh icon. Xem bảng key hợp lệ bên dưới | `'pdf'` |
|
|
262
|
+
|
|
263
|
+
### Key hợp lệ
|
|
264
|
+
|
|
265
|
+
| Key | Component được lazy-load |
|
|
266
|
+
|---|---|
|
|
267
|
+
| `'no-data'` | `LibsUiIconsNoDataComponent` |
|
|
268
|
+
| `'no-result'` | `LibsUiIconsNoResultComponent` |
|
|
269
|
+
| `'json'` | `LibsIconsJsonComponent` |
|
|
270
|
+
| `'pdf'` | `LibsUiIconsPdfComponent` |
|
|
271
|
+
| `'pptx'` | `LibsUiIconsPptxComponent` |
|
|
272
|
+
| `'word'` | `LibsUiIconsWordComponent` |
|
|
273
|
+
| `'xlsx'` | `LibsUiIconsXlsxComponent` |
|
|
274
|
+
| `'xml'` | `LibsUiIconsXmlComponent` |
|
|
275
|
+
| `'image-default'` | `LibsIconsImageDefaultComponent` |
|
|
276
|
+
| `'ai'` | `LibsUiIconsAiComponent` |
|
|
277
|
+
| `'ai-interaction'` | `LibsUiIconsAiInteractionComponent` |
|
|
278
|
+
| `'reload'` | `LibsUiIconsReloadComponent` |
|
|
279
|
+
| `'send-solid'` | `LibsUiIconsSendSolidComponent` |
|
|
280
|
+
| `'sparkles-ai-solid'` | `LibsUiIconsSparklesAiSolidComponent` |
|
|
281
|
+
| `'stop-solid'` | `LibsUiIconsStopSolidComponent` |
|
|
282
|
+
| Bất kỳ key khác | `null` (không render) |
|
|
283
|
+
|
|
284
|
+
### Sử dụng pipe trong template
|
|
285
|
+
|
|
286
|
+
```html
|
|
287
|
+
<!-- Kết hợp async pipe + NgComponentOutlet -->
|
|
288
|
+
<ng-container
|
|
289
|
+
*ngComponentOutlet="'pdf' | LibsUiIconsGetIconComponentPipe | async" />
|
|
290
|
+
```
|
|
291
|
+
|
|
292
|
+
### Sử dụng pipe trong TypeScript (standalone)
|
|
293
|
+
|
|
294
|
+
```typescript
|
|
295
|
+
import { LibsUiIconsGetIconComponentPipe } from '@libs-ui/icons';
|
|
296
|
+
|
|
297
|
+
const pipe = new LibsUiIconsGetIconComponentPipe();
|
|
298
|
+
const component = await pipe.transform('pdf');
|
|
299
|
+
// component = LibsUiIconsPdfComponent class (có thể dùng với dynamic component)
|
|
300
|
+
|
|
301
|
+
const nullResult = await pipe.transform('unknown-key');
|
|
302
|
+
// nullResult = null
|
|
303
|
+
```
|
|
304
|
+
|
|
305
|
+
## Abstract Base Class — LibsUiIconsComponentAbstract
|
|
306
|
+
|
|
307
|
+
Dùng khi tạo icon component mới trong dự án, kế thừa để có sẵn các input `size`, `color`, `colorActive`, `active` và computed `colorBind`.
|
|
308
|
+
|
|
309
|
+
```typescript
|
|
310
|
+
import { ChangeDetectionStrategy, Component, input } from '@angular/core';
|
|
311
|
+
import { LibsUiIconsComponentAbstract } from '@libs-ui/icons';
|
|
312
|
+
|
|
313
|
+
@Component({
|
|
314
|
+
selector: 'app-custom-icon',
|
|
315
|
+
standalone: true,
|
|
316
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
317
|
+
template: `
|
|
318
|
+
<svg [attr.width]="size()" [attr.height]="size()" viewBox="0 0 24 24" fill="none">
|
|
319
|
+
<circle cx="12" cy="12" r="10" [attr.fill]="colorBind()" />
|
|
320
|
+
</svg>
|
|
321
|
+
`,
|
|
322
|
+
})
|
|
323
|
+
export class CustomIconComponent extends LibsUiIconsComponentAbstract {
|
|
324
|
+
// Override default size nếu cần
|
|
325
|
+
override readonly size = input<number, number | undefined>(24, { transform: (value) => value ?? 24 });
|
|
326
|
+
}
|
|
327
|
+
```
|
|
328
|
+
|
|
329
|
+
### API của LibsUiIconsComponentAbstract
|
|
330
|
+
|
|
331
|
+
| Thành phần | Loại | Mô tả |
|
|
332
|
+
|---|---|---|
|
|
333
|
+
| `size` | `input<number>` (default: `16`) | Kích thước px |
|
|
334
|
+
| `color` | `input<string>` (default: `'#e6e7ea'`) | Màu mặc định |
|
|
335
|
+
| `colorActive` | `input<string>` (default: `'#ffffff'`) | Màu khi active |
|
|
336
|
+
| `active` | `input<boolean>` | Trạng thái active |
|
|
337
|
+
| `colorBind` | `computed` (protected) | Trả về `colorActive()` khi `active()` là `true`, ngược lại trả về `color()` |
|
|
338
|
+
|
|
339
|
+
## Lưu ý quan trọng
|
|
340
|
+
|
|
341
|
+
⚠️ **Selector dùng dấu gạch dưới (`_`) cho dấu gạch ngang trong tên folder**: Các selector như `libs_ui-icons-no_data`, `libs_ui-icons-send_solid` dùng `_` để thay thế `-` trong tên folder theo quy ước selector của libs-ui. Cần viết đúng selector khi dùng trong template.
|
|
342
|
+
|
|
343
|
+
⚠️ **Pipe là async**: `LibsUiIconsGetIconComponentPipe` trả về `Promise`, bắt buộc kết hợp với `| async` trong template và import `AsyncPipe` vào `imports[]` của component.
|
|
344
|
+
|
|
345
|
+
⚠️ **Icon AI (`libs_ui-icons-ai`) dùng SVG gradient**: Màu của icon AI được định nghĩa trực tiếp trong SVG path qua `linearGradient`, input `color` không ảnh hưởng đến màu gradient này.
|
|
346
|
+
|
|
347
|
+
⚠️ **`colorActive` default là `'#ffffff'`**: Trong abstract base, giá trị mặc định của `colorActive` khi không truyền vào là `'#ffffff'` (trắng). Một số component override giá trị này (ví dụ: `reload` dùng `#6A7383`, `send-solid` dùng `#226FF5`). Kiểm tra bảng default ở trên trước khi dùng.
|
|
348
|
+
|
|
349
|
+
⚠️ **Không có @Output()**: Tất cả icon component chỉ là SVG display thuần, không emit event. Nếu cần xử lý click, bọc bên ngoài bằng `<button>` hoặc element có `(click)` handler.
|
|
350
|
+
|
|
351
|
+
## Demo
|
|
352
|
+
|
|
353
|
+
```bash
|
|
354
|
+
npx nx serve core-ui
|
|
355
|
+
```
|
|
356
|
+
|
|
357
|
+
Truy cập: http://localhost:4500/icons
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { LibsUiIconsComponentAbstract } from '../icons.component.abstract';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare class LibsUiIconsAiComponent extends LibsUiIconsComponentAbstract {
|
|
4
|
+
readonly size: import("@angular/core").InputSignalWithTransform<number, number | undefined>;
|
|
5
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<LibsUiIconsAiComponent, never>;
|
|
6
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<LibsUiIconsAiComponent, "libs_ui-icons-ai", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { LibsUiIconsComponentAbstract } from '../icons.component.abstract';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare class LibsUiIconsAiInteractionComponent extends LibsUiIconsComponentAbstract {
|
|
4
|
+
readonly size: import("@angular/core").InputSignalWithTransform<number, number | undefined>;
|
|
5
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<LibsUiIconsAiInteractionComponent, never>;
|
|
6
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<LibsUiIconsAiInteractionComponent, "libs_ui-icons-ai-interaction", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
7
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ChangeDetectionStrategy, Component, input } from '@angular/core';
|
|
2
|
+
import { LibsUiIconsComponentAbstract } from '../icons.component.abstract';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
export class LibsUiIconsAiComponent extends LibsUiIconsComponentAbstract {
|
|
5
|
+
size = input(32, { transform: (value) => value ?? 32 });
|
|
6
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiIconsAiComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
7
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: LibsUiIconsAiComponent, isStandalone: true, selector: "libs_ui-icons-ai", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<svg\n class=\"mo-libs-common-components-icons\"\n [attr.width]=\"size()\"\n [attr.height]=\"size()\"\n viewBox=\"0 0 17 17\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M13.6813 0.811329C13.8362 0.340304 13.9136 0.104792 14.0296 0.0412278C14.13 -0.0137426 14.2514 -0.0137426 14.3517 0.0412278C14.4678 0.104792 14.5452 0.340305 14.7001 0.81133L14.9356 1.52729C14.9666 1.62158 14.9821 1.66873 15.0088 1.70784C15.0324 1.74248 15.0623 1.77238 15.0969 1.796C15.136 1.82266 15.1832 1.83816 15.2775 1.86918L15.9934 2.10464C16.4645 2.25955 16.7 2.33701 16.7635 2.45302C16.8185 2.55336 16.8185 2.67479 16.7635 2.77512C16.7 2.89114 16.4645 2.9686 15.9934 3.12351L15.2775 3.35897C15.1832 3.38999 15.136 3.40549 15.0969 3.43215C15.0623 3.45577 15.0324 3.48567 15.0088 3.52031C14.9821 3.55942 14.9666 3.60657 14.9356 3.70086L14.7001 4.41682C14.5452 4.88784 14.4678 5.12336 14.3517 5.18692C14.2514 5.24189 14.13 5.24189 14.0296 5.18692C13.9136 5.12336 13.8362 4.88784 13.6813 4.41682L13.4458 3.70086C13.4148 3.60657 13.3993 3.55942 13.3726 3.52031C13.349 3.48567 13.3191 3.45577 13.2845 3.43215C13.2453 3.40549 13.1982 3.38999 13.1039 3.35897L12.3879 3.12351C11.9169 2.9686 11.6814 2.89114 11.6178 2.77512C11.5629 2.67479 11.5629 2.55336 11.6178 2.45302C11.6814 2.33701 11.9169 2.25955 12.3879 2.10464L13.1039 1.86918C13.1982 1.83816 13.2453 1.82266 13.2845 1.796C13.3191 1.77238 13.349 1.74248 13.3726 1.70784C13.3993 1.66873 13.4148 1.62158 13.4458 1.52729L13.6813 0.811329Z\"\n fill=\"url(#paint0_linear_177_17587)\" />\n <path\n d=\"M7.68891 2.01915C7.31913 1.81655 6.87156 1.81655 6.50178 2.01915C6.22748 2.16943 6.0622 2.47879 5.92692 2.79825C5.78399 3.13577 5.63074 3.60177 5.43663 4.19198L4.82515 6.05127C4.73857 6.31453 4.71502 6.37513 4.68315 6.42188C4.64874 6.47236 4.60517 6.51594 4.55469 6.55035C4.50794 6.58221 4.44733 6.60576 4.18408 6.69234L2.32491 7.30379C1.73467 7.4979 1.26859 7.65119 0.931057 7.79412C0.611599 7.9294 0.302234 8.09468 0.151949 8.36897C-0.0506497 8.73875 -0.0506497 9.18633 0.151949 9.55611C0.302234 9.8304 0.611599 9.99569 0.931057 10.131C1.26859 10.2739 1.73462 10.4272 2.32487 10.6213L4.18408 11.2327C4.44733 11.3193 4.50794 11.3429 4.55469 11.3747C4.60517 11.4091 4.64874 11.4527 4.68315 11.5032C4.71502 11.5499 4.73857 11.6106 4.82515 11.8738L5.43659 13.733C5.63071 14.3232 5.78398 14.7893 5.92692 15.1268C6.0622 15.4463 6.22748 15.7557 6.50178 15.9059C6.87156 16.1085 7.31913 16.1085 7.68891 15.9059C7.96321 15.7557 8.12849 15.4463 8.26377 15.1268C8.40669 14.7893 8.55995 14.3233 8.75405 13.7331L9.36554 11.8738C9.45212 11.6106 9.47567 11.5499 9.50754 11.5032C9.54195 11.4527 9.58552 11.4091 9.636 11.3747C9.68275 11.3429 9.74336 11.3193 10.0066 11.2327L11.8658 10.6213C12.456 10.4272 12.9221 10.2739 13.2596 10.131C13.5791 9.99569 13.8885 9.8304 14.0387 9.55611C14.2413 9.18633 14.2413 8.73875 14.0387 8.36897C13.8885 8.09468 13.5791 7.9294 13.2596 7.79412C12.9221 7.65119 12.4561 7.49793 11.8659 7.30383L10.0066 6.69234C9.74336 6.60576 9.68275 6.58221 9.636 6.55035C9.58552 6.51594 9.54195 6.47236 9.50754 6.42188C9.47567 6.37513 9.45212 6.31453 9.36554 6.05127L8.7541 4.19211C8.55998 3.60186 8.4067 3.13579 8.26377 2.79825C8.12849 2.4788 7.96321 2.16943 7.68891 2.01915Z\"\n fill=\"url(#paint1_linear_177_17587)\" />\n <path\n d=\"M14.0757 12.7264C13.9928 12.7718 13.9375 12.94 13.8268 13.2765L13.6586 13.7879C13.6365 13.8552 13.6254 13.8889 13.6063 13.9168C13.5895 13.9416 13.5681 13.9629 13.5434 13.9798C13.5154 13.9988 13.4818 14.0099 13.4144 14.0321L12.903 14.2002C12.5666 14.3109 12.3983 14.3662 12.3529 14.4491C12.3137 14.5208 12.3137 14.6075 12.3529 14.6792C12.3983 14.762 12.5666 14.8174 12.903 14.928L13.4144 15.0962C13.4818 15.1184 13.5154 15.1294 13.5434 15.1485C13.5681 15.1653 13.5895 15.1867 13.6063 15.2114C13.6254 15.2394 13.6365 15.2731 13.6586 15.3404L13.8268 15.8518C13.9375 16.1883 13.9928 16.3565 14.0757 16.4019C14.1473 16.4411 14.2341 16.4411 14.3057 16.4019C14.3886 16.3565 14.4439 16.1883 14.5546 15.8518L14.7228 15.3404C14.7449 15.2731 14.756 15.2394 14.775 15.2114C14.7919 15.1867 14.8133 15.1653 14.838 15.1485C14.8659 15.1294 14.8996 15.1184 14.967 15.0962L15.4784 14.928C15.8148 14.8174 15.983 14.762 16.0284 14.6792C16.0677 14.6075 16.0677 14.5208 16.0284 14.4491C15.983 14.3662 15.8148 14.3109 15.4784 14.2002L14.967 14.0321C14.8996 14.0099 14.8659 13.9988 14.838 13.9798C14.8133 13.9629 14.7919 13.9416 14.775 13.9168C14.756 13.8889 14.7449 13.8552 14.7228 13.7879L14.5546 13.2765C14.4439 12.94 14.3886 12.7718 14.3057 12.7264C14.2341 12.6871 14.1473 12.6871 14.0757 12.7264Z\"\n fill=\"url(#paint2_linear_177_17587)\" />\n <defs>\n <linearGradient\n id=\"paint0_linear_177_17587\"\n x1=\"0.609375\"\n y1=\"16.2158\"\n x2=\"16.6094\"\n y2=\"0.215821\"\n gradientUnits=\"userSpaceOnUse\">\n <stop stop-color=\"#0575FC\" />\n <stop\n offset=\"0.3\"\n stop-color=\"#A034C1\" />\n <stop\n offset=\"0.5\"\n stop-color=\"#D844B3\" />\n <stop\n offset=\"0.697115\"\n stop-color=\"#E8569A\" />\n <stop\n offset=\"1\"\n stop-color=\"#FE8E3E\" />\n </linearGradient>\n <linearGradient\n id=\"paint1_linear_177_17587\"\n x1=\"0.609375\"\n y1=\"16.2158\"\n x2=\"16.6094\"\n y2=\"0.215821\"\n gradientUnits=\"userSpaceOnUse\">\n <stop stop-color=\"#0575FC\" />\n <stop\n offset=\"0.3\"\n stop-color=\"#A034C1\" />\n <stop\n offset=\"0.5\"\n stop-color=\"#D844B3\" />\n <stop\n offset=\"0.697115\"\n stop-color=\"#E8569A\" />\n <stop\n offset=\"1\"\n stop-color=\"#FE8E3E\" />\n </linearGradient>\n <linearGradient\n id=\"paint2_linear_177_17587\"\n x1=\"0.609375\"\n y1=\"16.2158\"\n x2=\"16.6094\"\n y2=\"0.215821\"\n gradientUnits=\"userSpaceOnUse\">\n <stop stop-color=\"#0575FC\" />\n <stop\n offset=\"0.3\"\n stop-color=\"#A034C1\" />\n <stop\n offset=\"0.5\"\n stop-color=\"#D844B3\" />\n <stop\n offset=\"0.697115\"\n stop-color=\"#E8569A\" />\n <stop\n offset=\"1\"\n stop-color=\"#FE8E3E\" />\n </linearGradient>\n </defs>\n</svg>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8
|
+
}
|
|
9
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiIconsAiComponent, decorators: [{
|
|
10
|
+
type: Component,
|
|
11
|
+
args: [{ selector: 'libs_ui-icons-ai', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg\n class=\"mo-libs-common-components-icons\"\n [attr.width]=\"size()\"\n [attr.height]=\"size()\"\n viewBox=\"0 0 17 17\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M13.6813 0.811329C13.8362 0.340304 13.9136 0.104792 14.0296 0.0412278C14.13 -0.0137426 14.2514 -0.0137426 14.3517 0.0412278C14.4678 0.104792 14.5452 0.340305 14.7001 0.81133L14.9356 1.52729C14.9666 1.62158 14.9821 1.66873 15.0088 1.70784C15.0324 1.74248 15.0623 1.77238 15.0969 1.796C15.136 1.82266 15.1832 1.83816 15.2775 1.86918L15.9934 2.10464C16.4645 2.25955 16.7 2.33701 16.7635 2.45302C16.8185 2.55336 16.8185 2.67479 16.7635 2.77512C16.7 2.89114 16.4645 2.9686 15.9934 3.12351L15.2775 3.35897C15.1832 3.38999 15.136 3.40549 15.0969 3.43215C15.0623 3.45577 15.0324 3.48567 15.0088 3.52031C14.9821 3.55942 14.9666 3.60657 14.9356 3.70086L14.7001 4.41682C14.5452 4.88784 14.4678 5.12336 14.3517 5.18692C14.2514 5.24189 14.13 5.24189 14.0296 5.18692C13.9136 5.12336 13.8362 4.88784 13.6813 4.41682L13.4458 3.70086C13.4148 3.60657 13.3993 3.55942 13.3726 3.52031C13.349 3.48567 13.3191 3.45577 13.2845 3.43215C13.2453 3.40549 13.1982 3.38999 13.1039 3.35897L12.3879 3.12351C11.9169 2.9686 11.6814 2.89114 11.6178 2.77512C11.5629 2.67479 11.5629 2.55336 11.6178 2.45302C11.6814 2.33701 11.9169 2.25955 12.3879 2.10464L13.1039 1.86918C13.1982 1.83816 13.2453 1.82266 13.2845 1.796C13.3191 1.77238 13.349 1.74248 13.3726 1.70784C13.3993 1.66873 13.4148 1.62158 13.4458 1.52729L13.6813 0.811329Z\"\n fill=\"url(#paint0_linear_177_17587)\" />\n <path\n d=\"M7.68891 2.01915C7.31913 1.81655 6.87156 1.81655 6.50178 2.01915C6.22748 2.16943 6.0622 2.47879 5.92692 2.79825C5.78399 3.13577 5.63074 3.60177 5.43663 4.19198L4.82515 6.05127C4.73857 6.31453 4.71502 6.37513 4.68315 6.42188C4.64874 6.47236 4.60517 6.51594 4.55469 6.55035C4.50794 6.58221 4.44733 6.60576 4.18408 6.69234L2.32491 7.30379C1.73467 7.4979 1.26859 7.65119 0.931057 7.79412C0.611599 7.9294 0.302234 8.09468 0.151949 8.36897C-0.0506497 8.73875 -0.0506497 9.18633 0.151949 9.55611C0.302234 9.8304 0.611599 9.99569 0.931057 10.131C1.26859 10.2739 1.73462 10.4272 2.32487 10.6213L4.18408 11.2327C4.44733 11.3193 4.50794 11.3429 4.55469 11.3747C4.60517 11.4091 4.64874 11.4527 4.68315 11.5032C4.71502 11.5499 4.73857 11.6106 4.82515 11.8738L5.43659 13.733C5.63071 14.3232 5.78398 14.7893 5.92692 15.1268C6.0622 15.4463 6.22748 15.7557 6.50178 15.9059C6.87156 16.1085 7.31913 16.1085 7.68891 15.9059C7.96321 15.7557 8.12849 15.4463 8.26377 15.1268C8.40669 14.7893 8.55995 14.3233 8.75405 13.7331L9.36554 11.8738C9.45212 11.6106 9.47567 11.5499 9.50754 11.5032C9.54195 11.4527 9.58552 11.4091 9.636 11.3747C9.68275 11.3429 9.74336 11.3193 10.0066 11.2327L11.8658 10.6213C12.456 10.4272 12.9221 10.2739 13.2596 10.131C13.5791 9.99569 13.8885 9.8304 14.0387 9.55611C14.2413 9.18633 14.2413 8.73875 14.0387 8.36897C13.8885 8.09468 13.5791 7.9294 13.2596 7.79412C12.9221 7.65119 12.4561 7.49793 11.8659 7.30383L10.0066 6.69234C9.74336 6.60576 9.68275 6.58221 9.636 6.55035C9.58552 6.51594 9.54195 6.47236 9.50754 6.42188C9.47567 6.37513 9.45212 6.31453 9.36554 6.05127L8.7541 4.19211C8.55998 3.60186 8.4067 3.13579 8.26377 2.79825C8.12849 2.4788 7.96321 2.16943 7.68891 2.01915Z\"\n fill=\"url(#paint1_linear_177_17587)\" />\n <path\n d=\"M14.0757 12.7264C13.9928 12.7718 13.9375 12.94 13.8268 13.2765L13.6586 13.7879C13.6365 13.8552 13.6254 13.8889 13.6063 13.9168C13.5895 13.9416 13.5681 13.9629 13.5434 13.9798C13.5154 13.9988 13.4818 14.0099 13.4144 14.0321L12.903 14.2002C12.5666 14.3109 12.3983 14.3662 12.3529 14.4491C12.3137 14.5208 12.3137 14.6075 12.3529 14.6792C12.3983 14.762 12.5666 14.8174 12.903 14.928L13.4144 15.0962C13.4818 15.1184 13.5154 15.1294 13.5434 15.1485C13.5681 15.1653 13.5895 15.1867 13.6063 15.2114C13.6254 15.2394 13.6365 15.2731 13.6586 15.3404L13.8268 15.8518C13.9375 16.1883 13.9928 16.3565 14.0757 16.4019C14.1473 16.4411 14.2341 16.4411 14.3057 16.4019C14.3886 16.3565 14.4439 16.1883 14.5546 15.8518L14.7228 15.3404C14.7449 15.2731 14.756 15.2394 14.775 15.2114C14.7919 15.1867 14.8133 15.1653 14.838 15.1485C14.8659 15.1294 14.8996 15.1184 14.967 15.0962L15.4784 14.928C15.8148 14.8174 15.983 14.762 16.0284 14.6792C16.0677 14.6075 16.0677 14.5208 16.0284 14.4491C15.983 14.3662 15.8148 14.3109 15.4784 14.2002L14.967 14.0321C14.8996 14.0099 14.8659 13.9988 14.838 13.9798C14.8133 13.9629 14.7919 13.9416 14.775 13.9168C14.756 13.8889 14.7449 13.8552 14.7228 13.7879L14.5546 13.2765C14.4439 12.94 14.3886 12.7718 14.3057 12.7264C14.2341 12.6871 14.1473 12.6871 14.0757 12.7264Z\"\n fill=\"url(#paint2_linear_177_17587)\" />\n <defs>\n <linearGradient\n id=\"paint0_linear_177_17587\"\n x1=\"0.609375\"\n y1=\"16.2158\"\n x2=\"16.6094\"\n y2=\"0.215821\"\n gradientUnits=\"userSpaceOnUse\">\n <stop stop-color=\"#0575FC\" />\n <stop\n offset=\"0.3\"\n stop-color=\"#A034C1\" />\n <stop\n offset=\"0.5\"\n stop-color=\"#D844B3\" />\n <stop\n offset=\"0.697115\"\n stop-color=\"#E8569A\" />\n <stop\n offset=\"1\"\n stop-color=\"#FE8E3E\" />\n </linearGradient>\n <linearGradient\n id=\"paint1_linear_177_17587\"\n x1=\"0.609375\"\n y1=\"16.2158\"\n x2=\"16.6094\"\n y2=\"0.215821\"\n gradientUnits=\"userSpaceOnUse\">\n <stop stop-color=\"#0575FC\" />\n <stop\n offset=\"0.3\"\n stop-color=\"#A034C1\" />\n <stop\n offset=\"0.5\"\n stop-color=\"#D844B3\" />\n <stop\n offset=\"0.697115\"\n stop-color=\"#E8569A\" />\n <stop\n offset=\"1\"\n stop-color=\"#FE8E3E\" />\n </linearGradient>\n <linearGradient\n id=\"paint2_linear_177_17587\"\n x1=\"0.609375\"\n y1=\"16.2158\"\n x2=\"16.6094\"\n y2=\"0.215821\"\n gradientUnits=\"userSpaceOnUse\">\n <stop stop-color=\"#0575FC\" />\n <stop\n offset=\"0.3\"\n stop-color=\"#A034C1\" />\n <stop\n offset=\"0.5\"\n stop-color=\"#D844B3\" />\n <stop\n offset=\"0.697115\"\n stop-color=\"#E8569A\" />\n <stop\n offset=\"1\"\n stop-color=\"#FE8E3E\" />\n </linearGradient>\n </defs>\n</svg>\n" }]
|
|
12
|
+
}] });
|
|
13
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWkuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vbGlicy11aS9pY29ucy9zcmMvYWkvYWkuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vbGlicy11aS9pY29ucy9zcmMvYWkvYWkuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUUsT0FBTyxFQUFFLDRCQUE0QixFQUFFLE1BQU0sNkJBQTZCLENBQUM7O0FBUzNFLE1BQU0sT0FBTyxzQkFBdUIsU0FBUSw0QkFBNEI7SUFDcEQsSUFBSSxHQUFHLEtBQUssQ0FBNkIsRUFBRSxFQUFFLEVBQUUsU0FBUyxFQUFFLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxLQUFLLElBQUksRUFBRSxFQUFFLENBQUMsQ0FBQzt3R0FEM0Ysc0JBQXNCOzRGQUF0QixzQkFBc0Isb09DVm5DLDRwTUFrRkE7OzRGRHhFYSxzQkFBc0I7a0JBUGxDLFNBQVM7K0JBRUUsa0JBQWtCLGNBRWhCLElBQUksbUJBQ0MsdUJBQXVCLENBQUMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGlucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBMaWJzVWlJY29uc0NvbXBvbmVudEFic3RyYWN0IH0gZnJvbSAnLi4vaWNvbnMuY29tcG9uZW50LmFic3RyYWN0JztcblxuQENvbXBvbmVudCh7XG4gIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAYW5ndWxhci1lc2xpbnQvY29tcG9uZW50LXNlbGVjdG9yXG4gIHNlbGVjdG9yOiAnbGlic191aS1pY29ucy1haScsXG4gIHRlbXBsYXRlVXJsOiAnLi9haS5jb21wb25lbnQuaHRtbCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBMaWJzVWlJY29uc0FpQ29tcG9uZW50IGV4dGVuZHMgTGlic1VpSWNvbnNDb21wb25lbnRBYnN0cmFjdCB7XG4gIG92ZXJyaWRlIHJlYWRvbmx5IHNpemUgPSBpbnB1dDxudW1iZXIsIG51bWJlciB8IHVuZGVmaW5lZD4oMzIsIHsgdHJhbnNmb3JtOiAodmFsdWUpID0+IHZhbHVlID8/IDMyIH0pO1xufVxuIiwiPHN2Z1xuICBjbGFzcz1cIm1vLWxpYnMtY29tbW9uLWNvbXBvbmVudHMtaWNvbnNcIlxuICBbYXR0ci53aWR0aF09XCJzaXplKClcIlxuICBbYXR0ci5oZWlnaHRdPVwic2l6ZSgpXCJcbiAgdmlld0JveD1cIjAgMCAxNyAxN1wiXG4gIGZpbGw9XCJub25lXCJcbiAgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICA8cGF0aFxuICAgIGQ9XCJNMTMuNjgxMyAwLjgxMTMyOUMxMy44MzYyIDAuMzQwMzA0IDEzLjkxMzYgMC4xMDQ3OTIgMTQuMDI5NiAwLjA0MTIyNzhDMTQuMTMgLTAuMDEzNzQyNiAxNC4yNTE0IC0wLjAxMzc0MjYgMTQuMzUxNyAwLjA0MTIyNzhDMTQuNDY3OCAwLjEwNDc5MiAxNC41NDUyIDAuMzQwMzA1IDE0LjcwMDEgMC44MTEzM0wxNC45MzU2IDEuNTI3MjlDMTQuOTY2NiAxLjYyMTU4IDE0Ljk4MjEgMS42Njg3MyAxNS4wMDg4IDEuNzA3ODRDMTUuMDMyNCAxLjc0MjQ4IDE1LjA2MjMgMS43NzIzOCAxNS4wOTY5IDEuNzk2QzE1LjEzNiAxLjgyMjY2IDE1LjE4MzIgMS44MzgxNiAxNS4yNzc1IDEuODY5MThMMTUuOTkzNCAyLjEwNDY0QzE2LjQ2NDUgMi4yNTk1NSAxNi43IDIuMzM3MDEgMTYuNzYzNSAyLjQ1MzAyQzE2LjgxODUgMi41NTMzNiAxNi44MTg1IDIuNjc0NzkgMTYuNzYzNSAyLjc3NTEyQzE2LjcgMi44OTExNCAxNi40NjQ1IDIuOTY4NiAxNS45OTM0IDMuMTIzNTFMMTUuMjc3NSAzLjM1ODk3QzE1LjE4MzIgMy4zODk5OSAxNS4xMzYgMy40MDU0OSAxNS4wOTY5IDMuNDMyMTVDMTUuMDYyMyAzLjQ1NTc3IDE1LjAzMjQgMy40ODU2NyAxNS4wMDg4IDMuNTIwMzFDMTQuOTgyMSAzLjU1OTQyIDE0Ljk2NjYgMy42MDY1NyAxNC45MzU2IDMuNzAwODZMMTQuNzAwMSA0LjQxNjgyQzE0LjU0NTIgNC44ODc4NCAxNC40Njc4IDUuMTIzMzYgMTQuMzUxNyA1LjE4NjkyQzE0LjI1MTQgNS4yNDE4OSAxNC4xMyA1LjI0MTg5IDE0LjAyOTYgNS4xODY5MkMxMy45MTM2IDUuMTIzMzYgMTMuODM2MiA0Ljg4Nzg0IDEzLjY4MTMgNC40MTY4MkwxMy40NDU4IDMuNzAwODZDMTMuNDE0OCAzLjYwNjU3IDEzLjM5OTMgMy41NTk0MiAxMy4zNzI2IDMuNTIwMzFDMTMuMzQ5IDMuNDg1NjcgMTMuMzE5MSAzLjQ1NTc3IDEzLjI4NDUgMy40MzIxNUMxMy4yNDUzIDMuNDA1NDkgMTMuMTk4MiAzLjM4OTk5IDEzLjEwMzkgMy4zNTg5N0wxMi4zODc5IDMuMTIzNTFDMTEuOTE2OSAyLjk2ODYgMTEuNjgxNCAyLjg5MTE0IDExLjYxNzggMi43NzUxMkMxMS41NjI5IDIuNjc0NzkgMTEuNTYyOSAyLjU1MzM2IDExLjYxNzggMi40NTMwMkMxMS42ODE0IDIuMzM3MDEgMTEuOTE2OSAyLjI1OTU1IDEyLjM4NzkgMi4xMDQ2NEwxMy4xMDM5IDEuODY5MThDMTMuMTk4MiAxLjgzODE2IDEzLjI0NTMgMS44MjI2NiAxMy4yODQ1IDEuNzk2QzEzLjMxOTEgMS43NzIzOCAxMy4zNDkgMS43NDI0OCAxMy4zNzI2IDEuNzA3ODRDMTMuMzk5MyAxLjY2ODczIDEzLjQxNDggMS42MjE1OCAxMy40NDU4IDEuNTI3MjlMMTMuNjgxMyAwLjgxMTMyOVpcIlxuICAgIGZpbGw9XCJ1cmwoI3BhaW50MF9saW5lYXJfMTc3XzE3NTg3KVwiIC8+XG4gIDxwYXRoXG4gICAgZD1cIk03LjY4ODkxIDIuMDE5MTVDNy4zMTkxMyAxLjgxNjU1IDYuODcxNTYgMS44MTY1NSA2LjUwMTc4IDIuMDE5MTVDNi4yMjc0OCAyLjE2OTQzIDYuMDYyMiAyLjQ3ODc5IDUuOTI2OTIgMi43OTgyNUM1Ljc4Mzk5IDMuMTM1NzcgNS42MzA3NCAzLjYwMTc3IDUuNDM2NjMgNC4xOTE5OEw0LjgyNTE1IDYuMDUxMjdDNC43Mzg1NyA2LjMxNDUzIDQuNzE1MDIgNi4zNzUxMyA0LjY4MzE1IDYuNDIxODhDNC42NDg3NCA2LjQ3MjM2IDQuNjA1MTcgNi41MTU5NCA0LjU1NDY5IDYuNTUwMzVDNC41MDc5NCA2LjU4MjIxIDQuNDQ3MzMgNi42MDU3NiA0LjE4NDA4IDYuNjkyMzRMMi4zMjQ5MSA3LjMwMzc5QzEuNzM0NjcgNy40OTc5IDEuMjY4NTkgNy42NTExOSAwLjkzMTA1NyA3Ljc5NDEyQzAuNjExNTk5IDcuOTI5NCAwLjMwMjIzNCA4LjA5NDY4IDAuMTUxOTQ5IDguMzY4OTdDLTAuMDUwNjQ5NyA4LjczODc1IC0wLjA1MDY0OTcgOS4xODYzMyAwLjE1MTk0OSA5LjU1NjExQzAuMzAyMjM0IDkuODMwNCAwLjYxMTU5OSA5Ljk5NTY5IDAuOTMxMDU3IDEwLjEzMUMxLjI2ODU5IDEwLjI3MzkgMS43MzQ2MiAxMC40MjcyIDIuMzI0ODcgMTAuNjIxM0w0LjE4NDA4IDExLjIzMjdDNC40NDczMyAxMS4zMTkzIDQuNTA3OTQgMTEuMzQyOSA0LjU1NDY5IDExLjM3NDdDNC42MDUxNyAxMS40MDkxIDQuNjQ4NzQgMTEuNDUyNyA0LjY4MzE1IDExLjUwMzJDNC43MTUwMiAxMS41NDk5IDQuNzM4NTcgMTEuNjEwNiA0LjgyNTE1IDExLjg3MzhMNS40MzY1OSAxMy43MzNDNS42MzA3MSAxNC4zMjMyIDUuNzgzOTggMTQuNzg5MyA1LjkyNjkyIDE1LjEyNjhDNi4wNjIyIDE1LjQ0NjMgNi4yMjc0OCAxNS43NTU3IDYuNTAxNzggMTUuOTA1OUM2Ljg3MTU2IDE2LjEwODUgNy4zMTkxMyAxNi4xMDg1IDcuNjg4OTEgMTUuOTA1OUM3Ljk2MzIxIDE1Ljc1NTcgOC4xMjg0OSAxNS40NDYzIDguMjYzNzcgMTUuMTI2OEM4LjQwNjY5IDE0Ljc4OTMgOC41NTk5NSAxNC4zMjMzIDguNzU0MDUgMTMuNzMzMUw5LjM2NTU0IDExLjg3MzhDOS40NTIxMiAxMS42MTA2IDkuNDc1NjcgMTEuNTQ5OSA5LjUwNzU0IDExLjUwMzJDOS41NDE5NSAxMS40NTI3IDkuNTg1NTIgMTEuNDA5MSA5LjYzNiAxMS4zNzQ3QzkuNjgyNzUgMTEuMzQyOSA5Ljc0MzM2IDExLjMxOTMgMTAuMDA2NiAxMS4yMzI3TDExLjg2NTggMTAuNjIxM0MxMi40NTYgMTAuNDI3MiAxMi45MjIxIDEwLjI3MzkgMTMuMjU5NiAxMC4xMzFDMTMuNTc5MSA5Ljk5NTY5IDEzLjg4ODUgOS44MzA0IDE0LjAzODcgOS41NTYxMUMxNC4yNDEzIDkuMTg2MzMgMTQuMjQxMyA4LjczODc1IDE0LjAzODcgOC4zNjg5N0MxMy44ODg1IDguMDk0NjggMTMuNTc5MSA3LjkyOTQgMTMuMjU5NiA3Ljc5NDEyQzEyLjkyMjEgNy42NTExOSAxMi40NTYxIDcuNDk3OTMgMTEuODY1OSA3LjMwMzgzTDEwLjAwNjYgNi42OTIzNEM5Ljc0MzM2IDYuNjA1NzYgOS42ODI3NSA2LjU4MjIxIDkuNjM2IDYuNTUwMzVDOS41ODU1MiA2LjUxNTk0IDkuNTQxOTUgNi40NzIzNiA5LjUwNzU0IDYuNDIxODhDOS40NzU2NyA2LjM3NTEzIDkuNDUyMTIgNi4zMTQ1MyA5LjM2NTU0IDYuMDUxMjdMOC43NTQxIDQuMTkyMTFDOC41NTk5OCAzLjYwMTg2IDguNDA2NyAzLjEzNTc5IDguMjYzNzcgMi43OTgyNUM4LjEyODQ5IDIuNDc4OCA3Ljk2MzIxIDIuMTY5NDMgNy42ODg5MSAyLjAxOTE1WlwiXG4gICAgZmlsbD1cInVybCgjcGFpbnQxX2xpbmVhcl8xNzdfMTc1ODcpXCIgLz5cbiAgPHBhdGhcbiAgICBkPVwiTTE0LjA3NTcgMTIuNzI2NEMxMy45OTI4IDEyLjc3MTggMTMuOTM3NSAxMi45NCAxMy44MjY4IDEzLjI3NjVMMTMuNjU4NiAxMy43ODc5QzEzLjYzNjUgMTMuODU1MiAxMy42MjU0IDEzLjg4ODkgMTMuNjA2MyAxMy45MTY4QzEzLjU4OTUgMTMuOTQxNiAxMy41NjgxIDEzLjk2MjkgMTMuNTQzNCAxMy45Nzk4QzEzLjUxNTQgMTMuOTk4OCAxMy40ODE4IDE0LjAwOTkgMTMuNDE0NCAxNC4wMzIxTDEyLjkwMyAxNC4yMDAyQzEyLjU2NjYgMTQuMzEwOSAxMi4zOTgzIDE0LjM2NjIgMTIuMzUyOSAxNC40NDkxQzEyLjMxMzcgMTQuNTIwOCAxMi4zMTM3IDE0LjYwNzUgMTIuMzUyOSAxNC42NzkyQzEyLjM5ODMgMTQuNzYyIDEyLjU2NjYgMTQuODE3NCAxMi45MDMgMTQuOTI4TDEzLjQxNDQgMTUuMDk2MkMxMy40ODE4IDE1LjExODQgMTMuNTE1NCAxNS4xMjk0IDEzLjU0MzQgMTUuMTQ4NUMxMy41NjgxIDE1LjE2NTMgMTMuNTg5NSAxNS4xODY3IDEzLjYwNjMgMTUuMjExNEMxMy42MjU0IDE1LjIzOTQgMTMuNjM2NSAxNS4yNzMxIDEzLjY1ODYgMTUuMzQwNEwxMy44MjY4IDE1Ljg1MThDMTMuOTM3NSAxNi4xODgzIDEzLjk5MjggMTYuMzU2NSAxNC4wNzU3IDE2LjQwMTlDMTQuMTQ3MyAxNi40NDExIDE0LjIzNDEgMTYuNDQxMSAxNC4zMDU3IDE2LjQwMTlDMTQuMzg4NiAxNi4zNTY1IDE0LjQ0MzkgMTYuMTg4MyAxNC41NTQ2IDE1Ljg1MThMMTQuNzIyOCAxNS4zNDA0QzE0Ljc0NDkgMTUuMjczMSAxNC43NTYgMTUuMjM5NCAxNC43NzUgMTUuMjExNEMxNC43OTE5IDE1LjE4NjcgMTQuODEzMyAxNS4xNjUzIDE0LjgzOCAxNS4xNDg1QzE0Ljg2NTkgMTUuMTI5NCAxNC44OTk2IDE1LjExODQgMTQuOTY3IDE1LjA5NjJMMTUuNDc4NCAxNC45MjhDMTUuODE0OCAxNC44MTc0IDE1Ljk4MyAxNC43NjIgMTYuMDI4NCAxNC42NzkyQzE2LjA2NzcgMTQuNjA3NSAxNi4wNjc3IDE0LjUyMDggMTYuMDI4NCAxNC40NDkxQzE1Ljk4MyAxNC4zNjYyIDE1LjgxNDggMTQuMzEwOSAxNS40Nzg0IDE0LjIwMDJMMTQuOTY3IDE0LjAzMjFDMTQuODk5NiAxNC4wMDk5IDE0Ljg2NTkgMTMuOTk4OCAxNC44MzggMTMuOTc5OEMxNC44MTMzIDEzLjk2MjkgMTQuNzkxOSAxMy45NDE2IDE0Ljc3NSAxMy45MTY4QzE0Ljc1NiAxMy44ODg5IDE0Ljc0NDkgMTMuODU1MiAxNC43MjI4IDEzLjc4NzlMMTQuNTU0NiAxMy4yNzY1QzE0LjQ0MzkgMTIuOTQgMTQuMzg4NiAxMi43NzE4IDE0LjMwNTcgMTIuNzI2NEMxNC4yMzQxIDEyLjY4NzEgMTQuMTQ3MyAxMi42ODcxIDE0LjA3NTcgMTIuNzI2NFpcIlxuICAgIGZpbGw9XCJ1cmwoI3BhaW50Ml9saW5lYXJfMTc3XzE3NTg3KVwiIC8+XG4gIDxkZWZzPlxuICAgIDxsaW5lYXJHcmFkaWVudFxuICAgICAgaWQ9XCJwYWludDBfbGluZWFyXzE3N18xNzU4N1wiXG4gICAgICB4MT1cIjAuNjA5Mzc1XCJcbiAgICAgIHkxPVwiMTYuMjE1OFwiXG4gICAgICB4Mj1cIjE2LjYwOTRcIlxuICAgICAgeTI9XCIwLjIxNTgyMVwiXG4gICAgICBncmFkaWVudFVuaXRzPVwidXNlclNwYWNlT25Vc2VcIj5cbiAgICAgIDxzdG9wIHN0b3AtY29sb3I9XCIjMDU3NUZDXCIgLz5cbiAgICAgIDxzdG9wXG4gICAgICAgIG9mZnNldD1cIjAuM1wiXG4gICAgICAgIHN0b3AtY29sb3I9XCIjQTAzNEMxXCIgLz5cbiAgICAgIDxzdG9wXG4gICAgICAgIG9mZnNldD1cIjAuNVwiXG4gICAgICAgIHN0b3AtY29sb3I9XCIjRDg0NEIzXCIgLz5cbiAgICAgIDxzdG9wXG4gICAgICAgIG9mZnNldD1cIjAuNjk3MTE1XCJcbiAgICAgICAgc3RvcC1jb2xvcj1cIiNFODU2OUFcIiAvPlxuICAgICAgPHN0b3BcbiAgICAgICAgb2Zmc2V0PVwiMVwiXG4gICAgICAgIHN0b3AtY29sb3I9XCIjRkU4RTNFXCIgLz5cbiAgICA8L2xpbmVhckdyYWRpZW50PlxuICAgIDxsaW5lYXJHcmFkaWVudFxuICAgICAgaWQ9XCJwYWludDFfbGluZWFyXzE3N18xNzU4N1wiXG4gICAgICB4MT1cIjAuNjA5Mzc1XCJcbiAgICAgIHkxPVwiMTYuMjE1OFwiXG4gICAgICB4Mj1cIjE2LjYwOTRcIlxuICAgICAgeTI9XCIwLjIxNTgyMVwiXG4gICAgICBncmFkaWVudFVuaXRzPVwidXNlclNwYWNlT25Vc2VcIj5cbiAgICAgIDxzdG9wIHN0b3AtY29sb3I9XCIjMDU3NUZDXCIgLz5cbiAgICAgIDxzdG9wXG4gICAgICAgIG9mZnNldD1cIjAuM1wiXG4gICAgICAgIHN0b3AtY29sb3I9XCIjQTAzNEMxXCIgLz5cbiAgICAgIDxzdG9wXG4gICAgICAgIG9mZnNldD1cIjAuNVwiXG4gICAgICAgIHN0b3AtY29sb3I9XCIjRDg0NEIzXCIgLz5cbiAgICAgIDxzdG9wXG4gICAgICAgIG9mZnNldD1cIjAuNjk3MTE1XCJcbiAgICAgICAgc3RvcC1jb2xvcj1cIiNFODU2OUFcIiAvPlxuICAgICAgPHN0b3BcbiAgICAgICAgb2Zmc2V0PVwiMVwiXG4gICAgICAgIHN0b3AtY29sb3I9XCIjRkU4RTNFXCIgLz5cbiAgICA8L2xpbmVhckdyYWRpZW50PlxuICAgIDxsaW5lYXJHcmFkaWVudFxuICAgICAgaWQ9XCJwYWludDJfbGluZWFyXzE3N18xNzU4N1wiXG4gICAgICB4MT1cIjAuNjA5Mzc1XCJcbiAgICAgIHkxPVwiMTYuMjE1OFwiXG4gICAgICB4Mj1cIjE2LjYwOTRcIlxuICAgICAgeTI9XCIwLjIxNTgyMVwiXG4gICAgICBncmFkaWVudFVuaXRzPVwidXNlclNwYWNlT25Vc2VcIj5cbiAgICAgIDxzdG9wIHN0b3AtY29sb3I9XCIjMDU3NUZDXCIgLz5cbiAgICAgIDxzdG9wXG4gICAgICAgIG9mZnNldD1cIjAuM1wiXG4gICAgICAgIHN0b3AtY29sb3I9XCIjQTAzNEMxXCIgLz5cbiAgICAgIDxzdG9wXG4gICAgICAgIG9mZnNldD1cIjAuNVwiXG4gICAgICAgIHN0b3AtY29sb3I9XCIjRDg0NEIzXCIgLz5cbiAgICAgIDxzdG9wXG4gICAgICAgIG9mZnNldD1cIjAuNjk3MTE1XCJcbiAgICAgICAgc3RvcC1jb2xvcj1cIiNFODU2OUFcIiAvPlxuICAgICAgPHN0b3BcbiAgICAgICAgb2Zmc2V0PVwiMVwiXG4gICAgICAgIHN0b3AtY29sb3I9XCIjRkU4RTNFXCIgLz5cbiAgICA8L2xpbmVhckdyYWRpZW50PlxuICA8L2RlZnM+XG48L3N2Zz5cbiJdfQ==
|