@libs-ui/components-badge 0.2.356-8 → 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
CHANGED
|
@@ -4,120 +4,217 @@
|
|
|
4
4
|
|
|
5
5
|
## Giới thiệu
|
|
6
6
|
|
|
7
|
-
`LibsUiComponentsBadgeComponent` là một standalone
|
|
7
|
+
`LibsUiComponentsBadgeComponent` là một Angular standalone component dùng để hiển thị số lượng dạng badge (ví dụ: tin nhắn chưa đọc, thông báo mới, số items trong giỏ hàng). Component hỗ trợ 5 chế độ định dạng số khác nhau, tích hợp sẵn popover tooltip, và sử dụng Angular Signals với `ChangeDetectionStrategy.OnPush` để đảm bảo hiệu năng cao.
|
|
8
8
|
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
- ✅
|
|
12
|
-
- ✅
|
|
13
|
-
- ✅
|
|
9
|
+
## Tính năng
|
|
10
|
+
|
|
11
|
+
- ✅ 5 chế độ hiển thị số: `x`, `0x`, `x+`, `+x`, `k`
|
|
12
|
+
- ✅ Rút gọn số lớn tự động (1K, 1.5K, 1M, 1.5M) với mode `k`
|
|
13
|
+
- ✅ Hiển thị dạng "99+" khi vượt giới hạn với mode `x+`
|
|
14
|
+
- ✅ Trạng thái active thay đổi màu sắc badge
|
|
15
|
+
- ✅ Tích hợp Popover tooltip khi hover
|
|
16
|
+
- ✅ Bỏ margin-left mặc định với `ignoreMarginDefault`
|
|
17
|
+
- ✅ Class CSS tùy chỉnh qua `classCircle`
|
|
14
18
|
- ✅ OnPush Change Detection cho hiệu năng cao
|
|
15
|
-
- ✅
|
|
19
|
+
- ✅ Angular Signals — reactive state với `computed()`
|
|
20
|
+
- ✅ Standalone Component, không cần NgModule
|
|
21
|
+
|
|
22
|
+
## Khi nào sử dụng
|
|
23
|
+
|
|
24
|
+
- Hiển thị số lượng tin nhắn chưa đọc, thông báo mới trên icon/tab
|
|
25
|
+
- Đếm số items trong giỏ hàng hoặc danh sách chọn
|
|
26
|
+
- Hiển thị số liệu thống kê dạng compact (1K, 1.5M) trong bảng hoặc card
|
|
27
|
+
- Đánh dấu trạng thái active/inactive cho một mục trong sidebar/menu
|
|
28
|
+
- Hiển thị số thứ tự hoặc đếm bước có padding số 0 (01, 02...)
|
|
16
29
|
|
|
17
30
|
## Cài đặt
|
|
18
31
|
|
|
19
32
|
```bash
|
|
20
|
-
# npm
|
|
21
33
|
npm install @libs-ui/components-badge
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
## Import
|
|
22
37
|
|
|
23
|
-
|
|
24
|
-
|
|
38
|
+
```typescript
|
|
39
|
+
import { LibsUiComponentsBadgeComponent } from '@libs-ui/components-badge';
|
|
40
|
+
import { TYPE_BADGE_MODE } from '@libs-ui/components-badge';
|
|
41
|
+
import { IBadge } from '@libs-ui/components-badge';
|
|
25
42
|
```
|
|
26
43
|
|
|
27
|
-
##
|
|
44
|
+
## Ví dụ sử dụng
|
|
28
45
|
|
|
29
|
-
###
|
|
46
|
+
### Basic — hiển thị số đơn giản
|
|
30
47
|
|
|
31
48
|
```typescript
|
|
32
49
|
import { Component } from '@angular/core';
|
|
33
|
-
import { LibsUiComponentsBadgeComponent
|
|
50
|
+
import { LibsUiComponentsBadgeComponent } from '@libs-ui/components-badge';
|
|
34
51
|
|
|
35
52
|
@Component({
|
|
36
|
-
selector: 'app-example',
|
|
53
|
+
selector: 'app-basic-example',
|
|
37
54
|
standalone: true,
|
|
38
55
|
imports: [LibsUiComponentsBadgeComponent],
|
|
39
56
|
template: `
|
|
40
57
|
<div class="flex items-center gap-2">
|
|
41
58
|
<span>Tin nhắn</span>
|
|
42
|
-
<libs_ui-components-badge
|
|
43
|
-
[count]="messageCount"
|
|
44
|
-
[mode]="'0x'"
|
|
45
|
-
[active]="hasUnread"
|
|
46
|
-
/>
|
|
59
|
+
<libs_ui-components-badge [count]="5" />
|
|
47
60
|
</div>
|
|
48
|
-
|
|
61
|
+
`,
|
|
49
62
|
})
|
|
50
|
-
export class
|
|
51
|
-
messageCount = 5;
|
|
52
|
-
hasUnread = true;
|
|
53
|
-
}
|
|
63
|
+
export class BasicExampleComponent {}
|
|
54
64
|
```
|
|
55
65
|
|
|
56
|
-
###
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
<!--
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
<!--
|
|
66
|
+
### Mode 0x — padding số 0 cho count < 10
|
|
67
|
+
|
|
68
|
+
```typescript
|
|
69
|
+
import { Component, signal } from '@angular/core';
|
|
70
|
+
import { LibsUiComponentsBadgeComponent } from '@libs-ui/components-badge';
|
|
71
|
+
|
|
72
|
+
@Component({
|
|
73
|
+
selector: 'app-mode-example',
|
|
74
|
+
standalone: true,
|
|
75
|
+
imports: [LibsUiComponentsBadgeComponent],
|
|
76
|
+
template: `
|
|
77
|
+
<!-- Mode 'x': Số thường, không padding -->
|
|
78
|
+
<libs_ui-components-badge [count]="5" mode="x" />
|
|
79
|
+
<!-- Output: 5 -->
|
|
80
|
+
|
|
81
|
+
<!-- Mode '0x': Padding số 0 nếu < 10 -->
|
|
82
|
+
<libs_ui-components-badge [count]="5" mode="0x" />
|
|
83
|
+
<!-- Output: 05 -->
|
|
84
|
+
|
|
85
|
+
<!-- Mode 'x+': Hiển thị maxCount+ khi vượt giới hạn -->
|
|
86
|
+
<libs_ui-components-badge [count]="150" mode="x+" [maxCount]="99" />
|
|
87
|
+
<!-- Output: 99+ -->
|
|
88
|
+
|
|
89
|
+
<!-- Mode '+x': Thêm dấu + phía trước -->
|
|
90
|
+
<libs_ui-components-badge [count]="5" mode="+x" />
|
|
91
|
+
<!-- Output: +05 -->
|
|
92
|
+
|
|
93
|
+
<!-- Mode 'k': Rút gọn hàng nghìn/triệu -->
|
|
94
|
+
<libs_ui-components-badge [count]="1500" mode="k" />
|
|
95
|
+
<!-- Output: 1.5K -->
|
|
96
|
+
`,
|
|
97
|
+
})
|
|
98
|
+
export class ModeExampleComponent {}
|
|
76
99
|
```
|
|
77
100
|
|
|
78
|
-
###
|
|
101
|
+
### Active state — đổi màu badge
|
|
79
102
|
|
|
80
|
-
```
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
<!-- Output: 1,5K -->
|
|
103
|
+
```typescript
|
|
104
|
+
import { Component, signal } from '@angular/core';
|
|
105
|
+
import { LibsUiComponentsBadgeComponent } from '@libs-ui/components-badge';
|
|
84
106
|
|
|
85
|
-
|
|
86
|
-
|
|
107
|
+
@Component({
|
|
108
|
+
selector: 'app-active-example',
|
|
109
|
+
standalone: true,
|
|
110
|
+
imports: [LibsUiComponentsBadgeComponent],
|
|
111
|
+
template: `
|
|
112
|
+
<!-- Badge bình thường (nền xám) -->
|
|
113
|
+
<libs_ui-components-badge [count]="5" />
|
|
114
|
+
|
|
115
|
+
<!-- Badge active (nền xanh) -->
|
|
116
|
+
<libs_ui-components-badge [count]="5" [active]="true" />
|
|
117
|
+
|
|
118
|
+
<!-- Kết hợp với signal -->
|
|
119
|
+
<libs_ui-components-badge [count]="unreadCount()" [active]="hasUnread()" />
|
|
120
|
+
`,
|
|
121
|
+
})
|
|
122
|
+
export class ActiveExampleComponent {
|
|
123
|
+
protected readonly unreadCount = signal(3);
|
|
124
|
+
protected readonly hasUnread = signal(true);
|
|
125
|
+
}
|
|
87
126
|
```
|
|
88
127
|
|
|
89
|
-
###
|
|
128
|
+
### Nâng cao — dùng trong notification icon
|
|
90
129
|
|
|
91
|
-
```
|
|
92
|
-
|
|
93
|
-
|
|
130
|
+
```typescript
|
|
131
|
+
import { Component, signal } from '@angular/core';
|
|
132
|
+
import { LibsUiComponentsBadgeComponent } from '@libs-ui/components-badge';
|
|
94
133
|
|
|
95
|
-
|
|
96
|
-
|
|
134
|
+
@Component({
|
|
135
|
+
selector: 'app-notification-example',
|
|
136
|
+
standalone: true,
|
|
137
|
+
imports: [LibsUiComponentsBadgeComponent],
|
|
138
|
+
template: `
|
|
139
|
+
<!-- Badge trong icon thông báo, bỏ margin mặc định -->
|
|
140
|
+
<button class="relative p-2" (click)="handlerOpenNotifications($event)">
|
|
141
|
+
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
|
|
142
|
+
<path d="M12 22c1.1 0 2-.9 2-2h-4c0 1.1.9 2 2 2zm6-6v-5c0-3.07-1.64-5.64-4.5-6.32V4c0-.83-.67-1.5-1.5-1.5s-1.5.67-1.5 1.5v.68C7.63 5.36 6 7.92 6 11v5l-2 2v1h16v-1l-2-2z"/>
|
|
143
|
+
</svg>
|
|
144
|
+
<libs_ui-components-badge
|
|
145
|
+
[count]="notificationCount()"
|
|
146
|
+
mode="x+"
|
|
147
|
+
[maxCount]="99"
|
|
148
|
+
[active]="true"
|
|
149
|
+
[ignoreMarginDefault]="true"
|
|
150
|
+
/>
|
|
151
|
+
</button>
|
|
152
|
+
|
|
153
|
+
<!-- Badge rút gọn cho bảng thống kê -->
|
|
154
|
+
<div class="flex items-center gap-2">
|
|
155
|
+
<span class="libs-ui-font-h6r">Lượt xem</span>
|
|
156
|
+
<libs_ui-components-badge [count]="viewCount()" mode="k" />
|
|
157
|
+
</div>
|
|
158
|
+
`,
|
|
159
|
+
})
|
|
160
|
+
export class NotificationExampleComponent {
|
|
161
|
+
protected readonly notificationCount = signal(5);
|
|
162
|
+
protected readonly viewCount = signal(12500);
|
|
163
|
+
|
|
164
|
+
protected handlerOpenNotifications(event: Event): void {
|
|
165
|
+
event.stopPropagation();
|
|
166
|
+
// handle open notifications
|
|
167
|
+
}
|
|
168
|
+
}
|
|
97
169
|
```
|
|
98
170
|
|
|
99
|
-
##
|
|
171
|
+
## @Input()
|
|
172
|
+
|
|
173
|
+
| Input | Type | Default | Mô tả | Ví dụ |
|
|
174
|
+
|---|---|---|---|---|
|
|
175
|
+
| `[count]` | `number` | `0` | Số lượng hiển thị trên badge. Nhận `null` được transform về `0`. | `[count]="unreadCount()"` |
|
|
176
|
+
| `[mode]` | `TYPE_BADGE_MODE` | `undefined` | Chế độ định dạng số. Xem bảng mode bên dưới để biết chi tiết từng giá trị. | `mode="0x"` |
|
|
177
|
+
| `[maxCount]` | `number` | `Number.MAX_SAFE_INTEGER` | Giới hạn tối đa — khi `count > maxCount` và `mode='x+'` thì hiển thị `"maxCount+"`. | `[maxCount]="99"` |
|
|
178
|
+
| `[active]` | `boolean` | `false` | Trạng thái active — đổi màu badge sang màu xanh (primary). | `[active]="hasUnread()"` |
|
|
179
|
+
| `[classCircle]` | `string` | `'libs-ui-font-h6r'` | Class CSS tùy chỉnh cho phần tử badge. Dùng để override typography. | `classCircle="libs-ui-font-h5r"` |
|
|
180
|
+
| `[ignoreMarginDefault]` | `boolean` | `false` | Bỏ `margin-left: 8px` mặc định của badge. Dùng khi cần định vị badge tùy ý (ví dụ: absolute). | `[ignoreMarginDefault]="true"` |
|
|
181
|
+
| `[popoverConfig]` | `IPopoverOverlay` | `undefined` | Cấu hình popover tooltip khi hover vào badge. Nếu không truyền, tooltip mặc định hiển thị giá trị `countDisplay`. | `[popoverConfig]="tooltipConfig"` |
|
|
182
|
+
| `[ignoreStopPropagationEvent]` | `boolean` | `true` | Bỏ qua `stopPropagation` khi click vào badge. Mặc định `true` — sự kiện click sẽ lan lên component cha. | `[ignoreStopPropagationEvent]="false"` |
|
|
183
|
+
|
|
184
|
+
## Bảng chế độ hiển thị (TYPE_BADGE_MODE)
|
|
100
185
|
|
|
101
|
-
|
|
186
|
+
| Mode | count = 0 | count = 5 | count = 9 | count = 15 | count = 100 | count > maxCount |
|
|
187
|
+
|---|---|---|---|---|---|---|
|
|
188
|
+
| `undefined` (default) | 00 | 05 | 09 | 15 | 100 | — |
|
|
189
|
+
| `'x'` | 0 | 5 | 9 | 15 | 100 | — |
|
|
190
|
+
| `'0x'` | 00 | 05 | 09 | 15 | 100 | — |
|
|
191
|
+
| `'x+'` | 00 | 05 | 09 | 15 | 100 | `99+` |
|
|
192
|
+
| `'+x'` | +00 | +05 | +09 | +15 | +100 | — |
|
|
193
|
+
| `'k'` | — | — | — | — | — | 1K, 1.5K, 1M |
|
|
102
194
|
|
|
103
|
-
|
|
104
|
-
|-----|------|----------|-------|
|
|
105
|
-
| `count` | `number` | `0` | Số lượng hiển thị trên badge |
|
|
106
|
-
| `mode` | `TYPE_BADGE_MODE` | `undefined` | Chế độ định dạng: 'x', '0x', 'x+', '+x', 'k' |
|
|
107
|
-
| `maxCount` | `number` | `MAX_SAFE_INTEGER` | Giới hạn tối đa, vượt qua sẽ hiển thị "maxCount+" (với mode 'x+') |
|
|
108
|
-
| `active` | `boolean` | `false` | Trạng thái active, thay đổi màu sắc badge |
|
|
109
|
-
| `classCircle` | `string` | `'libs-ui-font-h6r'` | Class CSS tùy chỉnh cho badge |
|
|
110
|
-
| `ignoreMarginDefault` | `boolean` | `false` | Bỏ margin-left mặc định (8px) |
|
|
111
|
-
| `popoverConfig` | `IPopoverOverlay` | `undefined` | Cấu hình cho popover tooltip |
|
|
112
|
-
| `ignoreStopPropagationEvent` | `boolean` | `true` | Bỏ qua stopPropagation khi click |
|
|
195
|
+
> **Lưu ý mode `k`:** Chỉ rút gọn khi `count > 999`. Dưới 1000 thì hiển thị như số thường.
|
|
113
196
|
|
|
114
|
-
|
|
197
|
+
## Types & Interfaces
|
|
115
198
|
|
|
116
199
|
```typescript
|
|
117
|
-
|
|
200
|
+
import { TYPE_BADGE_MODE } from '@libs-ui/components-badge';
|
|
201
|
+
import { IBadge } from '@libs-ui/components-badge';
|
|
202
|
+
```
|
|
203
|
+
|
|
204
|
+
```typescript
|
|
205
|
+
/**
|
|
206
|
+
* Các chế độ hiển thị số trên Badge
|
|
207
|
+
* - 'x' : Số thường (0, 5, 15, 100)
|
|
208
|
+
* - '0x' : Padding số 0 nếu < 10 (00, 05, 15, 100)
|
|
209
|
+
* - 'x+' : Hiển thị "maxCount+" khi vượt giới hạn (99+, 999+)
|
|
210
|
+
* - '+x' : Thêm dấu + phía trước (+00, +05, +15)
|
|
211
|
+
* - 'k' : Rút gọn hàng nghìn/triệu (1K, 1.5K, 1M, 1.5M)
|
|
212
|
+
*/
|
|
118
213
|
type TYPE_BADGE_MODE = 'x' | 'x+' | '+x' | 'k' | '0x';
|
|
119
214
|
|
|
120
|
-
|
|
215
|
+
/**
|
|
216
|
+
* Interface cấu hình cho Badge — dùng khi cần type cho object config
|
|
217
|
+
*/
|
|
121
218
|
interface IBadge {
|
|
122
219
|
mode?: TYPE_BADGE_MODE;
|
|
123
220
|
count?: number;
|
|
@@ -126,82 +223,84 @@ interface IBadge {
|
|
|
126
223
|
}
|
|
127
224
|
```
|
|
128
225
|
|
|
129
|
-
###
|
|
226
|
+
### Ví dụ dùng IBadge để truyền config
|
|
227
|
+
|
|
228
|
+
```typescript
|
|
229
|
+
import { Component } from '@angular/core';
|
|
230
|
+
import { LibsUiComponentsBadgeComponent, IBadge } from '@libs-ui/components-badge';
|
|
130
231
|
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
232
|
+
@Component({
|
|
233
|
+
selector: 'app-config-example',
|
|
234
|
+
standalone: true,
|
|
235
|
+
imports: [LibsUiComponentsBadgeComponent],
|
|
236
|
+
template: `
|
|
237
|
+
<libs_ui-components-badge
|
|
238
|
+
[count]="badgeConfig.count ?? 0"
|
|
239
|
+
[mode]="badgeConfig.mode"
|
|
240
|
+
[maxCount]="badgeConfig.maxCount"
|
|
241
|
+
[classCircle]="badgeConfig.classCircle ?? 'libs-ui-font-h6r'"
|
|
242
|
+
/>
|
|
243
|
+
`,
|
|
244
|
+
})
|
|
245
|
+
export class ConfigExampleComponent {
|
|
246
|
+
readonly badgeConfig: IBadge = {
|
|
247
|
+
mode: 'x+',
|
|
248
|
+
count: 150,
|
|
249
|
+
maxCount: 99,
|
|
250
|
+
classCircle: 'libs-ui-font-h6r',
|
|
251
|
+
};
|
|
252
|
+
}
|
|
253
|
+
```
|
|
138
254
|
|
|
139
255
|
## Styling
|
|
140
256
|
|
|
141
|
-
Badge có 2 trạng thái CSS:
|
|
257
|
+
Badge có 2 trạng thái CSS được định nghĩa sẵn:
|
|
142
258
|
|
|
143
259
|
```scss
|
|
144
|
-
//
|
|
260
|
+
// Trạng thái bình thường — nền xám, chữ xám
|
|
145
261
|
.libs-ui-badge {
|
|
146
|
-
|
|
262
|
+
width: fit-content;
|
|
263
|
+
height: 20px;
|
|
264
|
+
border-radius: 12px;
|
|
265
|
+
display: flex;
|
|
266
|
+
align-items: center;
|
|
267
|
+
justify-content: center;
|
|
147
268
|
color: #6a7383;
|
|
269
|
+
background: #e6e7ea;
|
|
270
|
+
margin-left: 8px;
|
|
271
|
+
padding: 2px 6px;
|
|
148
272
|
}
|
|
149
273
|
|
|
150
|
-
//
|
|
274
|
+
// Trạng thái active — nền xanh nhạt, chữ xanh primary
|
|
151
275
|
.libs-ui-badge-active {
|
|
152
|
-
background: var(--libs-ui-color-light-3, #f4f8ff);
|
|
153
276
|
color: var(--libs-ui-color-default, #226ff5);
|
|
277
|
+
background: var(--libs-ui-color-light-3, #f4f8ff);
|
|
154
278
|
}
|
|
155
279
|
```
|
|
156
280
|
|
|
157
|
-
|
|
281
|
+
Override màu qua CSS variables:
|
|
158
282
|
|
|
159
283
|
```css
|
|
160
284
|
:root {
|
|
161
|
-
--libs-ui-color-default: #
|
|
162
|
-
--libs-ui-color-light-3: #
|
|
285
|
+
--libs-ui-color-default: #226ff5; /* Màu chữ active */
|
|
286
|
+
--libs-ui-color-light-3: #f4f8ff; /* Màu nền active */
|
|
163
287
|
}
|
|
164
288
|
```
|
|
165
289
|
|
|
166
|
-
##
|
|
290
|
+
## Lưu ý quan trọng
|
|
167
291
|
|
|
168
|
-
|
|
169
|
-
- **Angular Signals** - Reactive state với `computed()`
|
|
170
|
-
- **TailwindCSS** - Utility classes
|
|
171
|
-
- **OnPush** - Change Detection Strategy
|
|
292
|
+
⚠️ **margin-left mặc định**: Badge mặc định có `margin-left: 8px`. Khi đặt badge ở vị trí tuyệt đối (absolute positioning), truyền `[ignoreMarginDefault]="true"` để loại bỏ margin này.
|
|
172
293
|
|
|
173
|
-
|
|
294
|
+
⚠️ **mode `k` chỉ rút gọn khi count > 999**: Với `count <= 999` và `mode="k"`, badge hiển thị số thường. Nếu muốn luôn có padding số 0 với số nhỏ, dùng kết hợp mode `0x`.
|
|
174
295
|
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
```bash
|
|
178
|
-
# Chạy demo app
|
|
179
|
-
npx nx serve core-ui
|
|
180
|
-
```
|
|
296
|
+
⚠️ **maxCount chỉ có tác dụng với mode `x+`**: Truyền `[maxCount]` mà không đặt `mode="x+"` sẽ không có hiệu lực.
|
|
181
297
|
|
|
182
|
-
**
|
|
298
|
+
⚠️ **Selector dùng dấu gạch dưới**: Selector của component là `libs_ui-components-badge` (có `_` giữa `libs_ui`). Đây là quy chuẩn của dự án — không dùng `libs-ui-components-badge` sẽ không render được.
|
|
183
299
|
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
- 🎮 **Interactive Demo**: Điều chỉnh count, maxCount bằng slider
|
|
187
|
-
- 📊 **Mode Comparison Table**: So sánh tất cả modes với nhiều giá trị count
|
|
188
|
-
- 🔄 **Active State Toggle**: Bật/tắt trạng thái active
|
|
189
|
-
- 📋 **API Reference**: Bảng tham chiếu đầy đủ các inputs và types
|
|
190
|
-
|
|
191
|
-
## Unit Tests
|
|
300
|
+
## Demo
|
|
192
301
|
|
|
193
302
|
```bash
|
|
194
|
-
|
|
195
|
-
npx nx test badge
|
|
196
|
-
|
|
197
|
-
# Chạy tests với coverage
|
|
198
|
-
npx nx test badge --coverage
|
|
199
|
-
|
|
200
|
-
# Watch mode
|
|
201
|
-
npx nx test badge --watch
|
|
303
|
+
npx nx serve core-ui
|
|
202
304
|
```
|
|
203
305
|
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
MIT
|
|
207
|
-
|
|
306
|
+
Truy cập: http://localhost:4500/components/badge
|
|
@@ -139,10 +139,10 @@ export class LibsUiComponentsBadgeComponent {
|
|
|
139
139
|
return this.mode() === '+x' ? `+${countFormat}` : `${countFormat}`;
|
|
140
140
|
}
|
|
141
141
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
142
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: LibsUiComponentsBadgeComponent, isStandalone: true, selector: "libs_ui-components-badge", inputs: { popoverConfig: { classPropertyName: "popoverConfig", publicName: "popoverConfig", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, maxCount: { classPropertyName: "maxCount", publicName: "maxCount", isSignal: true, isRequired: false, transformFunction: null }, ignoreMarginDefault: { classPropertyName: "ignoreMarginDefault", publicName: "ignoreMarginDefault", isSignal: true, isRequired: false, transformFunction: null }, classCircle: { classPropertyName: "classCircle", publicName: "classCircle", isSignal: true, isRequired: false, transformFunction: null }, ignoreStopPropagationEvent: { classPropertyName: "ignoreStopPropagationEvent", publicName: "ignoreStopPropagationEvent", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<span\n class=\"libs-ui-badge {{ classCircle() }}\"\n [class.libs-ui-badge-active]=\"active()\"\n [class
|
|
142
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: LibsUiComponentsBadgeComponent, isStandalone: true, selector: "libs_ui-components-badge", inputs: { popoverConfig: { classPropertyName: "popoverConfig", publicName: "popoverConfig", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, maxCount: { classPropertyName: "maxCount", publicName: "maxCount", isSignal: true, isRequired: false, transformFunction: null }, ignoreMarginDefault: { classPropertyName: "ignoreMarginDefault", publicName: "ignoreMarginDefault", isSignal: true, isRequired: false, transformFunction: null }, classCircle: { classPropertyName: "classCircle", publicName: "classCircle", isSignal: true, isRequired: false, transformFunction: null }, ignoreStopPropagationEvent: { classPropertyName: "ignoreStopPropagationEvent", publicName: "ignoreStopPropagationEvent", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<span\n class=\"libs-ui-badge {{ classCircle() }}\"\n [class.libs-ui-badge-active]=\"active()\"\n [class.!ml-0]=\"ignoreMarginDefault()\"\n LibsUiComponentsPopoverDirective\n [type]=\"popoverConfig() ? 'other' : 'text'\"\n [config]=\"popoverConfig() ?? { content: countDisplay() }\"\n [ignoreStopPropagationEvent]=\"ignoreStopPropagationEvent()\">\n {{ countDisplay() }}\n</span>\n", styles: [".libs-ui-badge{width:fit-content;height:20px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#6a7383;background:#e6e7ea;margin-left:8px;padding:2px 6px}.libs-ui-badge-active{color:var(--libs-ui-color-default, #226ff5);background:var(--libs-ui-color-light-3, #f4f8ff)}\n"], dependencies: [{ kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
143
143
|
}
|
|
144
144
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsBadgeComponent, decorators: [{
|
|
145
145
|
type: Component,
|
|
146
|
-
args: [{ selector: 'libs_ui-components-badge', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [LibsUiComponentsPopoverComponent], template: "<span\n class=\"libs-ui-badge {{ classCircle() }}\"\n [class.libs-ui-badge-active]=\"active()\"\n [class
|
|
146
|
+
args: [{ selector: 'libs_ui-components-badge', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [LibsUiComponentsPopoverComponent], template: "<span\n class=\"libs-ui-badge {{ classCircle() }}\"\n [class.libs-ui-badge-active]=\"active()\"\n [class.!ml-0]=\"ignoreMarginDefault()\"\n LibsUiComponentsPopoverDirective\n [type]=\"popoverConfig() ? 'other' : 'text'\"\n [config]=\"popoverConfig() ?? { content: countDisplay() }\"\n [ignoreStopPropagationEvent]=\"ignoreStopPropagationEvent()\">\n {{ countDisplay() }}\n</span>\n", styles: [".libs-ui-badge{width:fit-content;height:20px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#6a7383;background:#e6e7ea;margin-left:8px;padding:2px 6px}.libs-ui-badge-active{color:var(--libs-ui-color-default, #226ff5);background:var(--libs-ui-color-light-3, #f4f8ff)}\n"] }]
|
|
147
147
|
}] });
|
|
148
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2JhZGdlL3NyYy9iYWRnZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvYmFkZ2Uvc3JjL2JhZGdlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNwRixPQUFPLEVBQW1CLGdDQUFnQyxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDaEcsT0FBTyxFQUFFLHdCQUF3QixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7O0FBRzFEOzs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW9CRztBQVVILE1BQU0sT0FBTyw4QkFBOEI7SUFDekMsNENBQTRDO0lBQzVDLHNCQUFzQjtJQUN0Qiw0Q0FBNEM7SUFFNUM7OztPQUdHO0lBQ08sWUFBWSxHQUFHLFFBQVEsQ0FBQyxJQUFJLENBQUMsb0JBQW9CLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7SUFFeEUsNENBQTRDO0lBQzVDLFNBQVM7SUFDVCw0Q0FBNEM7SUFFNUM7OztPQUdHO0lBQ00sYUFBYSxHQUFHLEtBQUssRUFBbUIsQ0FBQztJQUVsRDs7O09BR0c7SUFDTSxNQUFNLEdBQUcsS0FBSyxFQUFXLENBQUM7SUFFbkM7OztPQUdHO0lBQ00sS0FBSyxHQUFHLEtBQUssQ0FBaUIsQ0FBQyxFQUFFLEVBQUUsU0FBUyxFQUFFLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxLQUFLLElBQUksQ0FBQyxFQUFFLENBQUMsQ0FBQztJQUVoRjs7Ozs7Ozs7T0FRRztJQUNNLElBQUksR0FBRyxLQUFLLEVBQW1CLENBQUM7SUFFekM7OztPQUdHO0lBQ00sUUFBUSxHQUFHLEtBQUssQ0FBaUIs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QUFFLElBQUksQ0FBQyxDQUFDO1FBQ2pFLE9BQU8sSUFBSSxDQUFDLElBQUksRUFBRSxLQUFLLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxXQUFXLEVBQUUsQ0FBQyxDQUFDLENBQUMsR0FBRyxXQUFXLEVBQUUsQ0FBQztJQUNyRSxDQUFDO3dHQXBJVSw4QkFBOEI7NEZBQTlCLDhCQUE4Qiw0ckNDbkMzQyxzWUFVQSx1V0R1QlksZ0NBQWdDOzs0RkFFL0IsOEJBQThCO2tCQVQxQyxTQUFTOytCQUVFLDBCQUEwQixjQUd4QixJQUFJLG1CQUNDLHVCQUF1QixDQUFDLE1BQU0sV0FDdEMsQ0FBQyxnQ0FBZ0MsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGNvbXB1dGVkLCBpbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSVBvcG92ZXJPdmVybGF5LCBMaWJzVWlDb21wb25lbnRzUG9wb3ZlckNvbXBvbmVudCB9IGZyb20gJ0BsaWJzLXVpL2NvbXBvbmVudHMtcG9wb3Zlcic7XG5pbXBvcnQgeyB2aWV3RGF0YU51bWJlckJ5TGFuZ3VhZ2UgfSBmcm9tICdAbGlicy11aS91dGlscyc7XG5pbXBvcnQgeyBUWVBFX0JBREdFX01PREUgfSBmcm9tICcuL2ludGVyZmFjZXMvbW9kZS50eXBlJztcblxuLyoqXG4gKiBCYWRnZSBDb21wb25lbnQgLSBIaeG7g24gdGjhu4sgc+G7kSBsxrDhu6NuZy/EkeG6v20gduG7m2kgbmhp4buBdSBjaOG6vyDEkeG7mSDEkeG7i25oIGThuqFuZ1xuICpcbiAqIEBkZXNjcmlwdGlvblxuICogQ29tcG9uZW50IGTDuW5nIMSR4buDIGhp4buDbiB0aOG7iyBz4buRIGzGsOG7o25nIChub3RpZmljYXRpb25zLCBtZXNzYWdlcywgY2FydCBpdGVtcy4uLilcbiAqIHbhu5tpIG5oaeG7gXUgY2jhur8gxJHhu5kgZm9ybWF0IGtow6FjIG5oYXU6IHPhu5EgdGjGsOG7nW5nLCBjw7Mgc+G7kSAwIMSR4bqxbmcgdHLGsOG7m2MsIHLDunQgZ+G7jW4gSy9NLC4uLlxuICpcbiAqIEBleGFtcGxlXG4gKiBgYGBodG1sXG4gKiA8IS0tIEJhc2ljIC0tPlxuICogPGxpYnNfdWktY29tcG9uZW50cy1iYWRnZSBbY291bnRdPVwiNVwiIC8+XG4gKlxuICogPCEtLSBW4bubaSBtb2RlIC0tPlxuICogPGxpYnNfdWktY29tcG9uZW50cy1iYWRnZSBbY291bnRdPVwiNVwiIG1vZGU9XCIweFwiIC8+XG4gKlxuICogPCEtLSBW4bubaSBtYXhDb3VudCAtLT5cbiAqIDxsaWJzX3VpLWNvbXBvbmVudHMtYmFkZ2UgW2NvdW50XT1cIjE1MFwiIG1vZGU9XCJ4K1wiIFttYXhDb3VudF09XCI5OVwiIC8+XG4gKiBgYGBcbiAqXG4gKiBAcHVibGljQXBpXG4gKi9cbkBDb21wb25lbnQoe1xuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQGFuZ3VsYXItZXNsaW50L2NvbXBvbmVudC1zZWxlY3RvclxuICBzZWxlY3RvcjogJ2xpYnNfdWktY29tcG9uZW50cy1iYWRnZScsXG4gIHRlbXBsYXRlVXJsOiAnLi9iYWRnZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2JhZGdlLmNvbXBvbmVudC5zY3NzJ10sXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBpbXBvcnRzOiBbTGlic1VpQ29tcG9uZW50c1BvcG92ZXJDb21wb25lbnRdLFxufSlcbmV4cG9ydCBjbGFzcyBMaWJzVWlDb21wb25lbnRzQmFkZ2VDb21wb25lbnQge1xuICAvLyA9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuICAvLyBDT01QVVRFRCBQUk9QRVJUSUVTXG4gIC8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG5cbiAgLyoqXG4gICAqIEdpw6EgdHLhu4sgaGnhu4NuIHRo4buLIMSRw6MgxJHGsOG7o2MgZm9ybWF0IHRoZW8gbW9kZVxuICAgKiBAaW50ZXJuYWxcbiAgICovXG4gIHByb3RlY3RlZCBjb3VudERpc3BsYXkgPSBjb21wdXRlZCh0aGlzLmNvdW50RGlzcGxheUNvbXB1dGVkLmJpbmQodGhpcykpO1xuXG4gIC8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG4gIC8vIElOUFVUU1xuICAvLyA9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuXG4gIC8qKlxuICAgKiBD4bqldSBow6xuaCBwb3BvdmVyIHRvb2x0aXAga2hpIGhvdmVyXG4gICAqIEBkZWZhdWx0IHVuZGVmaW5lZFxuICAgKi9cbiAgcmVhZG9ubHkgcG9wb3ZlckNvbmZpZyA9IGlucHV0PElQb3BvdmVyT3ZlcmxheT4oKTtcblxuICAvKipcbiAgICogVHLhuqFuZyB0aMOhaSBhY3RpdmUgLSB0aGF5IMSR4buVaSBtw6B1IHPhuq9jIGJhZGdlXG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqL1xuICByZWFkb25seSBhY3RpdmUgPSBpbnB1dDxib29sZWFuPigpO1xuXG4gIC8qKlxuICAgKiBT4buRIGzGsOG7o25nIGhp4buDbiB0aOG7iyB0csOqbiBiYWRnZVxuICAgKiBAZGVmYXVsdCAwXG4gICAqL1xuICByZWFkb25seSBjb3VudCA9IGlucHV0PG51bWJlciwgbnVtYmVyPigwLCB7IHRyYW5zZm9ybTogKHZhbHVlKSA9PiB2YWx1ZSA/PyAwIH0pO1xuXG4gIC8qKlxuICAgKiBDaOG6vyDEkeG7mSBoaeG7g24gdGjhu4sgc+G7kVxuICAgKiAtIGAneCdgOiBT4buRIHRoxrDhu51uZyAoMSwgNSwgMTUsIDEwMClcbiAgICogLSBgJzB4J2A6IEPDsyBz4buRIDAgxJHhurFuZyB0csaw4bubYyBu4bq/dSA8IDEwICgwMSwgMDUpXG4gICAqIC0gYCd4KydgOiBIaeG7g24gdGjhu4sgXCJtYXhDb3VudCtcIiBraGkgdsaw4bujdCBnaeG7m2kgaOG6oW4gKDk5KylcbiAgICogLSBgJyt4J2A6IFRow6ptIGThuqV1ICsgcGjDrWEgdHLGsOG7m2MgKCswMSwgKzA1KVxuICAgKiAtIGAnaydgOiBSw7p0IGfhu41uIGjDoG5nIG5naMOsbi90cmnhu4d1ICgxSywgMS41TSlcbiAgICogQGRlZmF1bHQgdW5kZWZpbmVkIC0gQ8OhYyBnacOhIHRy4buLIDwgMTAgc+G6vSBjw7Mgc+G7kSAwIOG7nyDEkeG6p3VcbiAgICovXG4gIHJlYWRvbmx5IG1vZGUgPSBpbnB1dDxUWVBFX0JBREdFX01PREU+KCk7XG5cbiAgLyoqXG4gICAqIEdp4bubaSBo4bqhbiB04buRaSDEkWEgLSBLaGkgY291bnQgPiBtYXhDb3VudCBz4bq9IGhp4buDbiB0aOG7iyBcIm1heENvdW50K1wiICh24bubaSBtb2RlICd4KycpXG4gICAqIEBkZWZhdWx0IE51bWJlci5NQVhfU0FGRV9JTlRFR0VSXG4gICAqL1xuICByZWFkb25seSBtYXhDb3VudCA9IGlucHV0PG51bWJlciwgbnVtYmVyPihOdW1iZXIuTUFYX1NBRkVfSU5URUdFUiwge1xuICAgIHRyYW5zZm9ybTogKHZhbHVlKSA9PiB2YWx1ZSA/PyBOdW1iZXIuTUFYX1NBRkVfSU5URUdFUixcbiAgfSk7XG5cbiAgLyoqXG4gICAqIELhu48gbWFyZ2luLWxlZnQgbeG6t2MgxJHhu4tuaCBj4bunYSBiYWRnZVxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgcmVhZG9ubHkgaWdub3JlTWFyZ2luRGVmYXVsdCA9IGlucHV0PGJvb2xlYW4+KCk7XG5cbiAgLyoqXG4gICAqIENsYXNzIENTUyB0w7l5IGNo4buJbmggY2hvIGJhZGdlIGNpcmNsZVxuICAgKiBAZGVmYXVsdCAnbGlicy11aS1mb250LWg2cidcbiAgICovXG4gIHJlYWRvbmx5IGNsYXNzQ2lyY2xlID0gaW5wdXQ8c3RyaW5nLCBzdHJpbmc+KCdsaWJzLXVpLWZvbnQtaDZyJywge1xuICAgIHRyYW5zZm9ybTogKHZhbHVlKSA9PiB2YWx1ZSA/PyAnbGlicy11aS1mb250LWg2cicsXG4gIH0pO1xuXG4gIC8qKlxuICAgKiBC4buPIHF1YSBzdG9wUHJvcGFnYXRpb24ga2hpIGNsaWNrIHbDoG8gYmFkZ2VcbiAgICogQGRlZmF1bHQgdHJ1ZVxuICAgKi9cbiAgcmVhZG9ubHkgaWdub3JlU3RvcFByb3BhZ2F0aW9uRXZlbnQgPSBpbnB1dDxib29sZWFuLCBib29sZWFuPih0cnVlLCB7XG4gICAgdHJhbnNmb3JtOiAodmFsdWUpID0+IHZhbHVlID8/IHRydWUsXG4gIH0pO1xuXG4gIC8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG4gIC8vIFBSSVZBVEUgTUVUSE9EU1xuICAvLyA9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuXG4gIC8qKlxuICAgKiBUw61uaCB0b8OhbiBnacOhIHRy4buLIGhp4buDbiB0aOG7iyBk4buxYSB0csOqbiBjb3VudCB2w6AgbW9kZVxuICAgKiBAcmV0dXJucyBDaHXhu5dpIMSRw6MgZm9ybWF0IHRoZW8gbW9kZVxuICAgKiBAaW50ZXJuYWxcbiAgICovXG4gIHByaXZhdGUgY291bnREaXNwbGF5Q29tcHV0ZWQoKTogc3RyaW5nIHtcbiAgICAvLyBNb2RlICdrJzogUsO6dCBn4buNbiBow6BuZyBuZ2jDrG4vdHJp4buHdVxuICAgIGlmICh0aGlzLm1vZGUoKSA9PT0gJ2snICYmIHRoaXMuY291bnQoKSA+IDk5OSkge1xuICAgICAgY29uc3QgY291bnQgPSB0aGlzLmNvdW50KCkgLyAxMDAwO1xuXG4gICAgICBpZiAoY291bnQgPiAxMDAwKSB7XG4gICAgICAgIHJldHVybiBgJHt2aWV3RGF0YU51bWJlckJ5TGFuZ3VhZ2UoY291bnQgLyAxMDAwLCB0cnVlLCAxLCBmYWxzZSwgdHJ1ZSl9TWA7XG4gICAgICB9XG5cbiAgICAgIHJldHVybiBgJHt2aWV3RGF0YU51bWJlckJ5TGFuZ3VhZ2UoY291bnQsIHRydWUsIDEsIGZhbHNlLCB0cnVlKX1LYDtcbiAgICB9XG5cbiAgICAvLyBNb2RlICd4Kyc6IEhp4buDbiB0aOG7iyBtYXhDb3VudCsga2hpIHbGsOG7o3QgZ2nhu5tpIGjhuqFuXG4gICAgaWYgKHRoaXMubW9kZSgpID09PSAneCsnICYmIHRoaXMuY291bnQoKSA+IHRoaXMubWF4Q291bnQoKSkge1xuICAgICAgY29uc3QgY291bnRGb3JtYXQgPSB2aWV3RGF0YU51bWJlckJ5TGFuZ3VhZ2UodGhpcy5tYXhDb3VudCgpLCB0cnVlKTtcbiAgICAgIHJldHVybiBgJHtjb3VudEZvcm1hdH0rYDtcbiAgICB9XG5cbiAgICAvLyBY4butIGzDvSBjb3VudCA9IDBcbiAgICBpZiAoIXRoaXMuY291bnQoKSkge1xuICAgICAgc3dpdGNoICh0aGlzLm1vZGUoKSkge1xuICAgICAgICBjYXNlICcreCc6XG4gICAgICAgICAgcmV0dXJuICcrMDAnO1xuICAgICAgICBjYXNlICd4Kyc6XG4gICAgICAgICAgcmV0dXJuICcwMCc7XG4gICAgICAgIGNhc2UgJ3gnOlxuICAgICAgICAgIHJldHVybiAnMCc7XG4gICAgICAgIGNhc2UgJzB4JzpcbiAgICAgICAgICByZXR1cm4gJzAwJztcbiAgICAgIH1cbiAgICB9XG5cbiAgICAvLyBY4butIGzDvSBjb3VudCA8IDEwXG4gICAgaWYgKHRoaXMuY291bnQoKSA8IDEwKSB7XG4gICAgICBzd2l0Y2ggKHRoaXMubW9kZSgpKSB7XG4gICAgICAgIGNhc2UgJyt4JzpcbiAgICAgICAgICByZXR1cm4gYCswJHt0aGlzLmNvdW50KCl9YDtcbiAgICAgICAgY2FzZSAneCsnOlxuICAgICAgICAgIHJldHVybiBgMCR7dGhpcy5jb3VudCgpfWA7XG4gICAgICAgIGNhc2UgJ3gnOlxuICAgICAgICAgIHJldHVybiBgJHt0aGlzLmNvdW50KCl9YDtcbiAgICAgICAgY2FzZSAnMHgnOlxuICAgICAgICAgIHJldHVybiBgMCR7dGhpcy5jb3VudCgpfWA7XG4gICAgICB9XG4gICAgfVxuXG4gICAgLy8gTeG6t2MgxJHhu4tuaDogRm9ybWF0IHPhu5EgdsOgIHRow6ptICsgbuG6v3UgbW9kZSAnK3gnXG4gICAgY29uc3QgY291bnRGb3JtYXQgPSB2aWV3RGF0YU51bWJlckJ5TGFuZ3VhZ2UodGhpcy5jb3VudCgpLCB0cnVlKTtcbiAgICByZXR1cm4gdGhpcy5tb2RlKCkgPT09ICcreCcgPyBgKyR7Y291bnRGb3JtYXR9YCA6IGAke2NvdW50Rm9ybWF0fWA7XG4gIH1cbn1cbiIsIjxzcGFuXG4gIGNsYXNzPVwibGlicy11aS1iYWRnZSB7eyBjbGFzc0NpcmNsZSgpIH19XCJcbiAgW2NsYXNzLmxpYnMtdWktYmFkZ2UtYWN0aXZlXT1cImFjdGl2ZSgpXCJcbiAgW2NsYXNzLm1sLTBdPVwiaWdub3JlTWFyZ2luRGVmYXVsdCgpXCJcbiAgTGlic1VpQ29tcG9uZW50c1BvcG92ZXJEaXJlY3RpdmVcbiAgW3R5cGVdPVwicG9wb3ZlckNvbmZpZygpID8gJ290aGVyJyA6ICd0ZXh0J1wiXG4gIFtjb25maWddPVwicG9wb3ZlckNvbmZpZygpID8/IHsgY29udGVudDogY291bnREaXNwbGF5KCkgfVwiXG4gIFtpZ25vcmVTdG9wUHJvcGFnYXRpb25FdmVudF09XCJpZ25vcmVTdG9wUHJvcGFnYXRpb25FdmVudCgpXCI+XG4gIHt7IGNvdW50RGlzcGxheSgpIH19XG48L3NwYW4+XG4iXX0=
|
|
148
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2JhZGdlL3NyYy9iYWRnZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvYmFkZ2Uvc3JjL2JhZGdlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNwRixPQUFPLEVBQW1CLGdDQUFnQyxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDaEcsT0FBTyxFQUFFLHdCQUF3QixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7O0FBRzFEOzs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW9CRztBQVVILE1BQU0sT0FBTyw4QkFBOEI7SUFDekMsNENBQTRDO0lBQzVDLHNCQUFzQjtJQUN0Qiw0Q0FBNEM7SUFFNUM7OztPQUdHO0lBQ08sWUFBWSxHQUFHLFFBQVEsQ0FBQyxJQUFJLENBQUMsb0JBQW9CLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7SUFFeEUsNENBQTRDO0lBQzVDLFNBQVM7SUFDVCw0Q0FBNEM7SUFFNUM7OztPQUdHO0lBQ00sYUFBYSxHQUFHLEtBQUssRUFBbUIsQ0FBQztJQUVsRDs7O09BR0c7SUFDTSxNQUFNLEdBQUcsS0FBSyxFQUFXLENBQUM7SUFFbkM7OztPQUdHO0lBQ00sS0FBSyxHQUFHLEtBQUssQ0FBaUIsQ0FBQyxFQUFFLEVBQUUsU0FBUyxFQUFFLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxLQUFLLElBQUksQ0FBQyxFQUFFLENBQUMsQ0FBQztJQUVoRjs7Ozs7Ozs7T0FRRztJQUNNLElBQUksR0FBRyxLQUFLLEVBQW1CLENBQUM7SUFFekM7OztPQUdHO0lBQ00sUUFBUSxHQUFHLEtBQUssQ0FBaUIs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QUFFLElBQUksQ0FBQyxDQUFDO1FBQ2pFLE9BQU8sSUFBSSxDQUFDLElBQUksRUFBRSxLQUFLLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxXQUFXLEVBQUUsQ0FBQyxDQUFDLENBQUMsR0FBRyxXQUFXLEVBQUUsQ0FBQztJQUNyRSxDQUFDO3dHQXBJVSw4QkFBOEI7NEZBQTlCLDhCQUE4Qiw0ckNDbkMzQyx1WUFVQSx1V0R1QlksZ0NBQWdDOzs0RkFFL0IsOEJBQThCO2tCQVQxQyxTQUFTOytCQUVFLDBCQUEwQixjQUd4QixJQUFJLG1CQUNDLHVCQUF1QixDQUFDLE1BQU0sV0FDdEMsQ0FBQyxnQ0FBZ0MsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGNvbXB1dGVkLCBpbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSVBvcG92ZXJPdmVybGF5LCBMaWJzVWlDb21wb25lbnRzUG9wb3ZlckNvbXBvbmVudCB9IGZyb20gJ0BsaWJzLXVpL2NvbXBvbmVudHMtcG9wb3Zlcic7XG5pbXBvcnQgeyB2aWV3RGF0YU51bWJlckJ5TGFuZ3VhZ2UgfSBmcm9tICdAbGlicy11aS91dGlscyc7XG5pbXBvcnQgeyBUWVBFX0JBREdFX01PREUgfSBmcm9tICcuL2ludGVyZmFjZXMvbW9kZS50eXBlJztcblxuLyoqXG4gKiBCYWRnZSBDb21wb25lbnQgLSBIaeG7g24gdGjhu4sgc+G7kSBsxrDhu6NuZy/EkeG6v20gduG7m2kgbmhp4buBdSBjaOG6vyDEkeG7mSDEkeG7i25oIGThuqFuZ1xuICpcbiAqIEBkZXNjcmlwdGlvblxuICogQ29tcG9uZW50IGTDuW5nIMSR4buDIGhp4buDbiB0aOG7iyBz4buRIGzGsOG7o25nIChub3RpZmljYXRpb25zLCBtZXNzYWdlcywgY2FydCBpdGVtcy4uLilcbiAqIHbhu5tpIG5oaeG7gXUgY2jhur8gxJHhu5kgZm9ybWF0IGtow6FjIG5oYXU6IHPhu5EgdGjGsOG7nW5nLCBjw7Mgc+G7kSAwIMSR4bqxbmcgdHLGsOG7m2MsIHLDunQgZ+G7jW4gSy9NLC4uLlxuICpcbiAqIEBleGFtcGxlXG4gKiBgYGBodG1sXG4gKiA8IS0tIEJhc2ljIC0tPlxuICogPGxpYnNfdWktY29tcG9uZW50cy1iYWRnZSBbY291bnRdPVwiNVwiIC8+XG4gKlxuICogPCEtLSBW4bubaSBtb2RlIC0tPlxuICogPGxpYnNfdWktY29tcG9uZW50cy1iYWRnZSBbY291bnRdPVwiNVwiIG1vZGU9XCIweFwiIC8+XG4gKlxuICogPCEtLSBW4bubaSBtYXhDb3VudCAtLT5cbiAqIDxsaWJzX3VpLWNvbXBvbmVudHMtYmFkZ2UgW2NvdW50XT1cIjE1MFwiIG1vZGU9XCJ4K1wiIFttYXhDb3VudF09XCI5OVwiIC8+XG4gKiBgYGBcbiAqXG4gKiBAcHVibGljQXBpXG4gKi9cbkBDb21wb25lbnQoe1xuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQGFuZ3VsYXItZXNsaW50L2NvbXBvbmVudC1zZWxlY3RvclxuICBzZWxlY3RvcjogJ2xpYnNfdWktY29tcG9uZW50cy1iYWRnZScsXG4gIHRlbXBsYXRlVXJsOiAnLi9iYWRnZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2JhZGdlLmNvbXBvbmVudC5zY3NzJ10sXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBpbXBvcnRzOiBbTGlic1VpQ29tcG9uZW50c1BvcG92ZXJDb21wb25lbnRdLFxufSlcbmV4cG9ydCBjbGFzcyBMaWJzVWlDb21wb25lbnRzQmFkZ2VDb21wb25lbnQge1xuICAvLyA9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuICAvLyBDT01QVVRFRCBQUk9QRVJUSUVTXG4gIC8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG5cbiAgLyoqXG4gICAqIEdpw6EgdHLhu4sgaGnhu4NuIHRo4buLIMSRw6MgxJHGsOG7o2MgZm9ybWF0IHRoZW8gbW9kZVxuICAgKiBAaW50ZXJuYWxcbiAgICovXG4gIHByb3RlY3RlZCBjb3VudERpc3BsYXkgPSBjb21wdXRlZCh0aGlzLmNvdW50RGlzcGxheUNvbXB1dGVkLmJpbmQodGhpcykpO1xuXG4gIC8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG4gIC8vIElOUFVUU1xuICAvLyA9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuXG4gIC8qKlxuICAgKiBD4bqldSBow6xuaCBwb3BvdmVyIHRvb2x0aXAga2hpIGhvdmVyXG4gICAqIEBkZWZhdWx0IHVuZGVmaW5lZFxuICAgKi9cbiAgcmVhZG9ubHkgcG9wb3ZlckNvbmZpZyA9IGlucHV0PElQb3BvdmVyT3ZlcmxheT4oKTtcblxuICAvKipcbiAgICogVHLhuqFuZyB0aMOhaSBhY3RpdmUgLSB0aGF5IMSR4buVaSBtw6B1IHPhuq9jIGJhZGdlXG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqL1xuICByZWFkb25seSBhY3RpdmUgPSBpbnB1dDxib29sZWFuPigpO1xuXG4gIC8qKlxuICAgKiBT4buRIGzGsOG7o25nIGhp4buDbiB0aOG7iyB0csOqbiBiYWRnZVxuICAgKiBAZGVmYXVsdCAwXG4gICAqL1xuICByZWFkb25seSBjb3VudCA9IGlucHV0PG51bWJlciwgbnVtYmVyPigwLCB7IHRyYW5zZm9ybTogKHZhbHVlKSA9PiB2YWx1ZSA/PyAwIH0pO1xuXG4gIC8qKlxuICAgKiBDaOG6vyDEkeG7mSBoaeG7g24gdGjhu4sgc+G7kVxuICAgKiAtIGAneCdgOiBT4buRIHRoxrDhu51uZyAoMSwgNSwgMTUsIDEwMClcbiAgICogLSBgJzB4J2A6IEPDsyBz4buRIDAgxJHhurFuZyB0csaw4bubYyBu4bq/dSA8IDEwICgwMSwgMDUpXG4gICAqIC0gYCd4KydgOiBIaeG7g24gdGjhu4sgXCJtYXhDb3VudCtcIiBraGkgdsaw4bujdCBnaeG7m2kgaOG6oW4gKDk5KylcbiAgICogLSBgJyt4J2A6IFRow6ptIGThuqV1ICsgcGjDrWEgdHLGsOG7m2MgKCswMSwgKzA1KVxuICAgKiAtIGAnaydgOiBSw7p0IGfhu41uIGjDoG5nIG5naMOsbi90cmnhu4d1ICgxSywgMS41TSlcbiAgICogQGRlZmF1bHQgdW5kZWZpbmVkIC0gQ8OhYyBnacOhIHRy4buLIDwgMTAgc+G6vSBjw7Mgc+G7kSAwIOG7nyDEkeG6p3VcbiAgICovXG4gIHJlYWRvbmx5IG1vZGUgPSBpbnB1dDxUWVBFX0JBREdFX01PREU+KCk7XG5cbiAgLyoqXG4gICAqIEdp4bubaSBo4bqhbiB04buRaSDEkWEgLSBLaGkgY291bnQgPiBtYXhDb3VudCBz4bq9IGhp4buDbiB0aOG7iyBcIm1heENvdW50K1wiICh24bubaSBtb2RlICd4KycpXG4gICAqIEBkZWZhdWx0IE51bWJlci5NQVhfU0FGRV9JTlRFR0VSXG4gICAqL1xuICByZWFkb25seSBtYXhDb3VudCA9IGlucHV0PG51bWJlciwgbnVtYmVyPihOdW1iZXIuTUFYX1NBRkVfSU5URUdFUiwge1xuICAgIHRyYW5zZm9ybTogKHZhbHVlKSA9PiB2YWx1ZSA/PyBOdW1iZXIuTUFYX1NBRkVfSU5URUdFUixcbiAgfSk7XG5cbiAgLyoqXG4gICAqIELhu48gbWFyZ2luLWxlZnQgbeG6t2MgxJHhu4tuaCBj4bunYSBiYWRnZVxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgcmVhZG9ubHkgaWdub3JlTWFyZ2luRGVmYXVsdCA9IGlucHV0PGJvb2xlYW4+KCk7XG5cbiAgLyoqXG4gICAqIENsYXNzIENTUyB0w7l5IGNo4buJbmggY2hvIGJhZGdlIGNpcmNsZVxuICAgKiBAZGVmYXVsdCAnbGlicy11aS1mb250LWg2cidcbiAgICovXG4gIHJlYWRvbmx5IGNsYXNzQ2lyY2xlID0gaW5wdXQ8c3RyaW5nLCBzdHJpbmc+KCdsaWJzLXVpLWZvbnQtaDZyJywge1xuICAgIHRyYW5zZm9ybTogKHZhbHVlKSA9PiB2YWx1ZSA/PyAnbGlicy11aS1mb250LWg2cicsXG4gIH0pO1xuXG4gIC8qKlxuICAgKiBC4buPIHF1YSBzdG9wUHJvcGFnYXRpb24ga2hpIGNsaWNrIHbDoG8gYmFkZ2VcbiAgICogQGRlZmF1bHQgdHJ1ZVxuICAgKi9cbiAgcmVhZG9ubHkgaWdub3JlU3RvcFByb3BhZ2F0aW9uRXZlbnQgPSBpbnB1dDxib29sZWFuLCBib29sZWFuPih0cnVlLCB7XG4gICAgdHJhbnNmb3JtOiAodmFsdWUpID0+IHZhbHVlID8/IHRydWUsXG4gIH0pO1xuXG4gIC8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG4gIC8vIFBSSVZBVEUgTUVUSE9EU1xuICAvLyA9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuXG4gIC8qKlxuICAgKiBUw61uaCB0b8OhbiBnacOhIHRy4buLIGhp4buDbiB0aOG7iyBk4buxYSB0csOqbiBjb3VudCB2w6AgbW9kZVxuICAgKiBAcmV0dXJucyBDaHXhu5dpIMSRw6MgZm9ybWF0IHRoZW8gbW9kZVxuICAgKiBAaW50ZXJuYWxcbiAgICovXG4gIHByaXZhdGUgY291bnREaXNwbGF5Q29tcHV0ZWQoKTogc3RyaW5nIHtcbiAgICAvLyBNb2RlICdrJzogUsO6dCBn4buNbiBow6BuZyBuZ2jDrG4vdHJp4buHdVxuICAgIGlmICh0aGlzLm1vZGUoKSA9PT0gJ2snICYmIHRoaXMuY291bnQoKSA+IDk5OSkge1xuICAgICAgY29uc3QgY291bnQgPSB0aGlzLmNvdW50KCkgLyAxMDAwO1xuXG4gICAgICBpZiAoY291bnQgPiAxMDAwKSB7XG4gICAgICAgIHJldHVybiBgJHt2aWV3RGF0YU51bWJlckJ5TGFuZ3VhZ2UoY291bnQgLyAxMDAwLCB0cnVlLCAxLCBmYWxzZSwgdHJ1ZSl9TWA7XG4gICAgICB9XG5cbiAgICAgIHJldHVybiBgJHt2aWV3RGF0YU51bWJlckJ5TGFuZ3VhZ2UoY291bnQsIHRydWUsIDEsIGZhbHNlLCB0cnVlKX1LYDtcbiAgICB9XG5cbiAgICAvLyBNb2RlICd4Kyc6IEhp4buDbiB0aOG7iyBtYXhDb3VudCsga2hpIHbGsOG7o3QgZ2nhu5tpIGjhuqFuXG4gICAgaWYgKHRoaXMubW9kZSgpID09PSAneCsnICYmIHRoaXMuY291bnQoKSA+IHRoaXMubWF4Q291bnQoKSkge1xuICAgICAgY29uc3QgY291bnRGb3JtYXQgPSB2aWV3RGF0YU51bWJlckJ5TGFuZ3VhZ2UodGhpcy5tYXhDb3VudCgpLCB0cnVlKTtcbiAgICAgIHJldHVybiBgJHtjb3VudEZvcm1hdH0rYDtcbiAgICB9XG5cbiAgICAvLyBY4butIGzDvSBjb3VudCA9IDBcbiAgICBpZiAoIXRoaXMuY291bnQoKSkge1xuICAgICAgc3dpdGNoICh0aGlzLm1vZGUoKSkge1xuICAgICAgICBjYXNlICcreCc6XG4gICAgICAgICAgcmV0dXJuICcrMDAnO1xuICAgICAgICBjYXNlICd4Kyc6XG4gICAgICAgICAgcmV0dXJuICcwMCc7XG4gICAgICAgIGNhc2UgJ3gnOlxuICAgICAgICAgIHJldHVybiAnMCc7XG4gICAgICAgIGNhc2UgJzB4JzpcbiAgICAgICAgICByZXR1cm4gJzAwJztcbiAgICAgIH1cbiAgICB9XG5cbiAgICAvLyBY4butIGzDvSBjb3VudCA8IDEwXG4gICAgaWYgKHRoaXMuY291bnQoKSA8IDEwKSB7XG4gICAgICBzd2l0Y2ggKHRoaXMubW9kZSgpKSB7XG4gICAgICAgIGNhc2UgJyt4JzpcbiAgICAgICAgICByZXR1cm4gYCswJHt0aGlzLmNvdW50KCl9YDtcbiAgICAgICAgY2FzZSAneCsnOlxuICAgICAgICAgIHJldHVybiBgMCR7dGhpcy5jb3VudCgpfWA7XG4gICAgICAgIGNhc2UgJ3gnOlxuICAgICAgICAgIHJldHVybiBgJHt0aGlzLmNvdW50KCl9YDtcbiAgICAgICAgY2FzZSAnMHgnOlxuICAgICAgICAgIHJldHVybiBgMCR7dGhpcy5jb3VudCgpfWA7XG4gICAgICB9XG4gICAgfVxuXG4gICAgLy8gTeG6t2MgxJHhu4tuaDogRm9ybWF0IHPhu5EgdsOgIHRow6ptICsgbuG6v3UgbW9kZSAnK3gnXG4gICAgY29uc3QgY291bnRGb3JtYXQgPSB2aWV3RGF0YU51bWJlckJ5TGFuZ3VhZ2UodGhpcy5jb3VudCgpLCB0cnVlKTtcbiAgICByZXR1cm4gdGhpcy5tb2RlKCkgPT09ICcreCcgPyBgKyR7Y291bnRGb3JtYXR9YCA6IGAke2NvdW50Rm9ybWF0fWA7XG4gIH1cbn1cbiIsIjxzcGFuXG4gIGNsYXNzPVwibGlicy11aS1iYWRnZSB7eyBjbGFzc0NpcmNsZSgpIH19XCJcbiAgW2NsYXNzLmxpYnMtdWktYmFkZ2UtYWN0aXZlXT1cImFjdGl2ZSgpXCJcbiAgW2NsYXNzLiFtbC0wXT1cImlnbm9yZU1hcmdpbkRlZmF1bHQoKVwiXG4gIExpYnNVaUNvbXBvbmVudHNQb3BvdmVyRGlyZWN0aXZlXG4gIFt0eXBlXT1cInBvcG92ZXJDb25maWcoKSA/ICdvdGhlcicgOiAndGV4dCdcIlxuICBbY29uZmlnXT1cInBvcG92ZXJDb25maWcoKSA/PyB7IGNvbnRlbnQ6IGNvdW50RGlzcGxheSgpIH1cIlxuICBbaWdub3JlU3RvcFByb3BhZ2F0aW9uRXZlbnRdPVwiaWdub3JlU3RvcFByb3BhZ2F0aW9uRXZlbnQoKVwiPlxuICB7eyBjb3VudERpc3BsYXkoKSB9fVxuPC9zcGFuPlxuIl19
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { computed, input,
|
|
2
|
+
import { computed, input, Component, ChangeDetectionStrategy } from '@angular/core';
|
|
3
3
|
import { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';
|
|
4
4
|
import { viewDataNumberByLanguage } from '@libs-ui/utils';
|
|
5
5
|
|
|
@@ -140,11 +140,11 @@ class LibsUiComponentsBadgeComponent {
|
|
|
140
140
|
return this.mode() === '+x' ? `+${countFormat}` : `${countFormat}`;
|
|
141
141
|
}
|
|
142
142
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
143
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: LibsUiComponentsBadgeComponent, isStandalone: true, selector: "libs_ui-components-badge", inputs: { popoverConfig: { classPropertyName: "popoverConfig", publicName: "popoverConfig", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, maxCount: { classPropertyName: "maxCount", publicName: "maxCount", isSignal: true, isRequired: false, transformFunction: null }, ignoreMarginDefault: { classPropertyName: "ignoreMarginDefault", publicName: "ignoreMarginDefault", isSignal: true, isRequired: false, transformFunction: null }, classCircle: { classPropertyName: "classCircle", publicName: "classCircle", isSignal: true, isRequired: false, transformFunction: null }, ignoreStopPropagationEvent: { classPropertyName: "ignoreStopPropagationEvent", publicName: "ignoreStopPropagationEvent", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<span\n class=\"libs-ui-badge {{ classCircle() }}\"\n [class.libs-ui-badge-active]=\"active()\"\n [class
|
|
143
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: LibsUiComponentsBadgeComponent, isStandalone: true, selector: "libs_ui-components-badge", inputs: { popoverConfig: { classPropertyName: "popoverConfig", publicName: "popoverConfig", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, maxCount: { classPropertyName: "maxCount", publicName: "maxCount", isSignal: true, isRequired: false, transformFunction: null }, ignoreMarginDefault: { classPropertyName: "ignoreMarginDefault", publicName: "ignoreMarginDefault", isSignal: true, isRequired: false, transformFunction: null }, classCircle: { classPropertyName: "classCircle", publicName: "classCircle", isSignal: true, isRequired: false, transformFunction: null }, ignoreStopPropagationEvent: { classPropertyName: "ignoreStopPropagationEvent", publicName: "ignoreStopPropagationEvent", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<span\n class=\"libs-ui-badge {{ classCircle() }}\"\n [class.libs-ui-badge-active]=\"active()\"\n [class.!ml-0]=\"ignoreMarginDefault()\"\n LibsUiComponentsPopoverDirective\n [type]=\"popoverConfig() ? 'other' : 'text'\"\n [config]=\"popoverConfig() ?? { content: countDisplay() }\"\n [ignoreStopPropagationEvent]=\"ignoreStopPropagationEvent()\">\n {{ countDisplay() }}\n</span>\n", styles: [".libs-ui-badge{width:fit-content;height:20px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#6a7383;background:#e6e7ea;margin-left:8px;padding:2px 6px}.libs-ui-badge-active{color:var(--libs-ui-color-default, #226ff5);background:var(--libs-ui-color-light-3, #f4f8ff)}\n"], dependencies: [{ kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
144
144
|
}
|
|
145
145
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsBadgeComponent, decorators: [{
|
|
146
146
|
type: Component,
|
|
147
|
-
args: [{ selector: 'libs_ui-components-badge', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [LibsUiComponentsPopoverComponent], template: "<span\n class=\"libs-ui-badge {{ classCircle() }}\"\n [class.libs-ui-badge-active]=\"active()\"\n [class
|
|
147
|
+
args: [{ selector: 'libs_ui-components-badge', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [LibsUiComponentsPopoverComponent], template: "<span\n class=\"libs-ui-badge {{ classCircle() }}\"\n [class.libs-ui-badge-active]=\"active()\"\n [class.!ml-0]=\"ignoreMarginDefault()\"\n LibsUiComponentsPopoverDirective\n [type]=\"popoverConfig() ? 'other' : 'text'\"\n [config]=\"popoverConfig() ?? { content: countDisplay() }\"\n [ignoreStopPropagationEvent]=\"ignoreStopPropagationEvent()\">\n {{ countDisplay() }}\n</span>\n", styles: [".libs-ui-badge{width:fit-content;height:20px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#6a7383;background:#e6e7ea;margin-left:8px;padding:2px 6px}.libs-ui-badge-active{color:var(--libs-ui-color-default, #226ff5);background:var(--libs-ui-color-light-3, #f4f8ff)}\n"] }]
|
|
148
148
|
}] });
|
|
149
149
|
|
|
150
150
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"libs-ui-components-badge.mjs","sources":["../../../../../libs-ui/components/badge/src/badge.component.ts","../../../../../libs-ui/components/badge/src/badge.component.html","../../../../../libs-ui/components/badge/src/libs-ui-components-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\nimport { IPopoverOverlay, LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';\nimport { viewDataNumberByLanguage } from '@libs-ui/utils';\nimport { TYPE_BADGE_MODE } from './interfaces/mode.type';\n\n/**\n * Badge Component - Hiển thị số lượng/đếm với nhiều chế độ định dạng\n *\n * @description\n * Component dùng để hiển thị số lượng (notifications, messages, cart items...)\n * với nhiều chế độ format khác nhau: số thường, có số 0 đằng trước, rút gọn K/M,...\n *\n * @example\n * ```html\n * <!-- Basic -->\n * <libs_ui-components-badge [count]=\"5\" />\n *\n * <!-- Với mode -->\n * <libs_ui-components-badge [count]=\"5\" mode=\"0x\" />\n *\n * <!-- Với maxCount -->\n * <libs_ui-components-badge [count]=\"150\" mode=\"x+\" [maxCount]=\"99\" />\n * ```\n *\n * @publicApi\n */\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'libs_ui-components-badge',\n templateUrl: './badge.component.html',\n styleUrls: ['./badge.component.scss'],\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [LibsUiComponentsPopoverComponent],\n})\nexport class LibsUiComponentsBadgeComponent {\n // =========================================\n // COMPUTED PROPERTIES\n // =========================================\n\n /**\n * Giá trị hiển thị đã được format theo mode\n * @internal\n */\n protected countDisplay = computed(this.countDisplayComputed.bind(this));\n\n // =========================================\n // INPUTS\n // =========================================\n\n /**\n * Cấu hình popover tooltip khi hover\n * @default undefined\n */\n readonly popoverConfig = input<IPopoverOverlay>();\n\n /**\n * Trạng thái active - thay đổi màu sắc badge\n * @default false\n */\n readonly active = input<boolean>();\n\n /**\n * Số lượng hiển thị trên badge\n * @default 0\n */\n readonly count = input<number, number>(0, { transform: (value) => value ?? 0 });\n\n /**\n * Chế độ hiển thị số\n * - `'x'`: Số thường (1, 5, 15, 100)\n * - `'0x'`: Có số 0 đằng trước nếu < 10 (01, 05)\n * - `'x+'`: Hiển thị \"maxCount+\" khi vượt giới hạn (99+)\n * - `'+x'`: Thêm dấu + phía trước (+01, +05)\n * - `'k'`: Rút gọn hàng nghìn/triệu (1K, 1.5M)\n * @default undefined - Các giá trị < 10 sẽ có số 0 ở đầu\n */\n readonly mode = input<TYPE_BADGE_MODE>();\n\n /**\n * Giới hạn tối đa - Khi count > maxCount sẽ hiển thị \"maxCount+\" (với mode 'x+')\n * @default Number.MAX_SAFE_INTEGER\n */\n readonly maxCount = input<number, number>(Number.MAX_SAFE_INTEGER, {\n transform: (value) => value ?? Number.MAX_SAFE_INTEGER,\n });\n\n /**\n * Bỏ margin-left mặc định của badge\n * @default false\n */\n readonly ignoreMarginDefault = input<boolean>();\n\n /**\n * Class CSS tùy chỉnh cho badge circle\n * @default 'libs-ui-font-h6r'\n */\n readonly classCircle = input<string, string>('libs-ui-font-h6r', {\n transform: (value) => value ?? 'libs-ui-font-h6r',\n });\n\n /**\n * Bỏ qua stopPropagation khi click vào badge\n * @default true\n */\n readonly ignoreStopPropagationEvent = input<boolean, boolean>(true, {\n transform: (value) => value ?? true,\n });\n\n // =========================================\n // PRIVATE METHODS\n // =========================================\n\n /**\n * Tính toán giá trị hiển thị dựa trên count và mode\n * @returns Chuỗi đã format theo mode\n * @internal\n */\n private countDisplayComputed(): string {\n // Mode 'k': Rút gọn hàng nghìn/triệu\n if (this.mode() === 'k' && this.count() > 999) {\n const count = this.count() / 1000;\n\n if (count > 1000) {\n return `${viewDataNumberByLanguage(count / 1000, true, 1, false, true)}M`;\n }\n\n return `${viewDataNumberByLanguage(count, true, 1, false, true)}K`;\n }\n\n // Mode 'x+': Hiển thị maxCount+ khi vượt giới hạn\n if (this.mode() === 'x+' && this.count() > this.maxCount()) {\n const countFormat = viewDataNumberByLanguage(this.maxCount(), true);\n return `${countFormat}+`;\n }\n\n // Xử lý count = 0\n if (!this.count()) {\n switch (this.mode()) {\n case '+x':\n return '+00';\n case 'x+':\n return '00';\n case 'x':\n return '0';\n case '0x':\n return '00';\n }\n }\n\n // Xử lý count < 10\n if (this.count() < 10) {\n switch (this.mode()) {\n case '+x':\n return `+0${this.count()}`;\n case 'x+':\n return `0${this.count()}`;\n case 'x':\n return `${this.count()}`;\n case '0x':\n return `0${this.count()}`;\n }\n }\n\n // Mặc định: Format số và thêm + nếu mode '+x'\n const countFormat = viewDataNumberByLanguage(this.count(), true);\n return this.mode() === '+x' ? `+${countFormat}` : `${countFormat}`;\n }\n}\n","<span\n class=\"libs-ui-badge {{ classCircle() }}\"\n [class.libs-ui-badge-active]=\"active()\"\n [class
|
|
1
|
+
{"version":3,"file":"libs-ui-components-badge.mjs","sources":["../../../../../libs-ui/components/badge/src/badge.component.ts","../../../../../libs-ui/components/badge/src/badge.component.html","../../../../../libs-ui/components/badge/src/libs-ui-components-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\nimport { IPopoverOverlay, LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';\nimport { viewDataNumberByLanguage } from '@libs-ui/utils';\nimport { TYPE_BADGE_MODE } from './interfaces/mode.type';\n\n/**\n * Badge Component - Hiển thị số lượng/đếm với nhiều chế độ định dạng\n *\n * @description\n * Component dùng để hiển thị số lượng (notifications, messages, cart items...)\n * với nhiều chế độ format khác nhau: số thường, có số 0 đằng trước, rút gọn K/M,...\n *\n * @example\n * ```html\n * <!-- Basic -->\n * <libs_ui-components-badge [count]=\"5\" />\n *\n * <!-- Với mode -->\n * <libs_ui-components-badge [count]=\"5\" mode=\"0x\" />\n *\n * <!-- Với maxCount -->\n * <libs_ui-components-badge [count]=\"150\" mode=\"x+\" [maxCount]=\"99\" />\n * ```\n *\n * @publicApi\n */\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'libs_ui-components-badge',\n templateUrl: './badge.component.html',\n styleUrls: ['./badge.component.scss'],\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [LibsUiComponentsPopoverComponent],\n})\nexport class LibsUiComponentsBadgeComponent {\n // =========================================\n // COMPUTED PROPERTIES\n // =========================================\n\n /**\n * Giá trị hiển thị đã được format theo mode\n * @internal\n */\n protected countDisplay = computed(this.countDisplayComputed.bind(this));\n\n // =========================================\n // INPUTS\n // =========================================\n\n /**\n * Cấu hình popover tooltip khi hover\n * @default undefined\n */\n readonly popoverConfig = input<IPopoverOverlay>();\n\n /**\n * Trạng thái active - thay đổi màu sắc badge\n * @default false\n */\n readonly active = input<boolean>();\n\n /**\n * Số lượng hiển thị trên badge\n * @default 0\n */\n readonly count = input<number, number>(0, { transform: (value) => value ?? 0 });\n\n /**\n * Chế độ hiển thị số\n * - `'x'`: Số thường (1, 5, 15, 100)\n * - `'0x'`: Có số 0 đằng trước nếu < 10 (01, 05)\n * - `'x+'`: Hiển thị \"maxCount+\" khi vượt giới hạn (99+)\n * - `'+x'`: Thêm dấu + phía trước (+01, +05)\n * - `'k'`: Rút gọn hàng nghìn/triệu (1K, 1.5M)\n * @default undefined - Các giá trị < 10 sẽ có số 0 ở đầu\n */\n readonly mode = input<TYPE_BADGE_MODE>();\n\n /**\n * Giới hạn tối đa - Khi count > maxCount sẽ hiển thị \"maxCount+\" (với mode 'x+')\n * @default Number.MAX_SAFE_INTEGER\n */\n readonly maxCount = input<number, number>(Number.MAX_SAFE_INTEGER, {\n transform: (value) => value ?? Number.MAX_SAFE_INTEGER,\n });\n\n /**\n * Bỏ margin-left mặc định của badge\n * @default false\n */\n readonly ignoreMarginDefault = input<boolean>();\n\n /**\n * Class CSS tùy chỉnh cho badge circle\n * @default 'libs-ui-font-h6r'\n */\n readonly classCircle = input<string, string>('libs-ui-font-h6r', {\n transform: (value) => value ?? 'libs-ui-font-h6r',\n });\n\n /**\n * Bỏ qua stopPropagation khi click vào badge\n * @default true\n */\n readonly ignoreStopPropagationEvent = input<boolean, boolean>(true, {\n transform: (value) => value ?? true,\n });\n\n // =========================================\n // PRIVATE METHODS\n // =========================================\n\n /**\n * Tính toán giá trị hiển thị dựa trên count và mode\n * @returns Chuỗi đã format theo mode\n * @internal\n */\n private countDisplayComputed(): string {\n // Mode 'k': Rút gọn hàng nghìn/triệu\n if (this.mode() === 'k' && this.count() > 999) {\n const count = this.count() / 1000;\n\n if (count > 1000) {\n return `${viewDataNumberByLanguage(count / 1000, true, 1, false, true)}M`;\n }\n\n return `${viewDataNumberByLanguage(count, true, 1, false, true)}K`;\n }\n\n // Mode 'x+': Hiển thị maxCount+ khi vượt giới hạn\n if (this.mode() === 'x+' && this.count() > this.maxCount()) {\n const countFormat = viewDataNumberByLanguage(this.maxCount(), true);\n return `${countFormat}+`;\n }\n\n // Xử lý count = 0\n if (!this.count()) {\n switch (this.mode()) {\n case '+x':\n return '+00';\n case 'x+':\n return '00';\n case 'x':\n return '0';\n case '0x':\n return '00';\n }\n }\n\n // Xử lý count < 10\n if (this.count() < 10) {\n switch (this.mode()) {\n case '+x':\n return `+0${this.count()}`;\n case 'x+':\n return `0${this.count()}`;\n case 'x':\n return `${this.count()}`;\n case '0x':\n return `0${this.count()}`;\n }\n }\n\n // Mặc định: Format số và thêm + nếu mode '+x'\n const countFormat = viewDataNumberByLanguage(this.count(), true);\n return this.mode() === '+x' ? `+${countFormat}` : `${countFormat}`;\n }\n}\n","<span\n class=\"libs-ui-badge {{ classCircle() }}\"\n [class.libs-ui-badge-active]=\"active()\"\n [class.!ml-0]=\"ignoreMarginDefault()\"\n LibsUiComponentsPopoverDirective\n [type]=\"popoverConfig() ? 'other' : 'text'\"\n [config]=\"popoverConfig() ?? { content: countDisplay() }\"\n [ignoreStopPropagationEvent]=\"ignoreStopPropagationEvent()\">\n {{ countDisplay() }}\n</span>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@libs-ui/components-badge",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.357-0",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@angular/core": ">=18.0.0",
|
|
6
|
-
"@libs-ui/components-popover": "0.2.
|
|
7
|
-
"@libs-ui/utils": "0.2.
|
|
8
|
-
"rxjs": "~7.8.0"
|
|
6
|
+
"@libs-ui/components-popover": "0.2.357-0",
|
|
7
|
+
"@libs-ui/utils": "0.2.357-0"
|
|
9
8
|
},
|
|
10
9
|
"sideEffects": false,
|
|
11
10
|
"module": "fesm2022/libs-ui-components-badge.mjs",
|