@libs-ui/components-list 0.2.357-8 → 0.2.357-9
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 +4 -13
- package/package.json +26 -26
package/README.md
CHANGED
|
@@ -107,7 +107,6 @@ export class YourComponent {
|
|
|
107
107
|
});
|
|
108
108
|
|
|
109
109
|
protected handlerSelectKey(event?: IListDataEmitKey) {
|
|
110
|
-
event?.event?.stopPropagation?.();
|
|
111
110
|
this.keySelected.set(event?.key as string);
|
|
112
111
|
}
|
|
113
112
|
|
|
@@ -500,15 +499,15 @@ export class YourComponent {
|
|
|
500
499
|
|
|
501
500
|
| Output | Type | Mô tả | Handler TS | Binding HTML |
|
|
502
501
|
|---|---|---|---|---|
|
|
503
|
-
| `(outChangeView)` | `Array<any>` | Phát ra mảng item đang hiển thị sau mỗi lần danh sách thay đổi (load xong, filter, search). | `handlerChangeView(items: any[]): void {
|
|
504
|
-
| `(outChangStageFlagMousePopover)` | `IFlagMouse` | Phát ra trạng thái hover chuột vào/ra khỏi popover trong danh sách. | `handlerFlagMousePopover(flag: IFlagMouse): void {
|
|
505
|
-
| `(outClickButtonOther)` | `IButton` | Phát ra khi người dùng click vào một trong các nút bổ sung (`buttonsOther`). | `handlerClickButtonOther(btn: IButton): void {
|
|
502
|
+
| `(outChangeView)` | `Array<any>` | Phát ra mảng item đang hiển thị sau mỗi lần danh sách thay đổi (load xong, filter, search). | `handlerChangeView(items: any[]): void { this.visibleItems.set(items); }` | `(outChangeView)="handlerChangeView($event)"` |
|
|
503
|
+
| `(outChangStageFlagMousePopover)` | `IFlagMouse` | Phát ra trạng thái hover chuột vào/ra khỏi popover trong danh sách. | `handlerFlagMousePopover(flag: IFlagMouse): void { this.hoverFlag.set(flag); }` | `(outChangStageFlagMousePopover)="handlerFlagMousePopover($event)"` |
|
|
504
|
+
| `(outClickButtonOther)` | `IButton` | Phát ra khi người dùng click vào một trong các nút bổ sung (`buttonsOther`). | `handlerClickButtonOther(btn: IButton): void { this.handleAction(btn); }` | `(outClickButtonOther)="handlerClickButtonOther($event)"` |
|
|
506
505
|
| `(outFieldKey)` | `string \| undefined` | Phát ra tên trường `fieldKey` đang sử dụng trong template hiện tại. | `handlerFieldKey(key: string \| undefined): void { ... }` | `(outFieldKey)="handlerFieldKey($event)"` |
|
|
507
506
|
| `(outFunctionsControl)` | `IListFunctionControlEvent` | Phát ra object chứa các method điều khiển component từ bên ngoài. Nên lưu lại để gọi sau. | `handlerFunctionsControl(event: IListFunctionControlEvent): void { this.listControl = event; }` | `(outFunctionsControl)="handlerFunctionsControl($event)"` |
|
|
508
507
|
| `(outKeySearch)` | `string` | Phát ra keyword mỗi khi người dùng thay đổi nội dung ô tìm kiếm. | `handlerKeySearch(keyword: string): void { this.keyword.set(keyword); }` | `(outKeySearch)="handlerKeySearch($event)"` |
|
|
509
508
|
| `(outLoadItemsComplete)` | `{ items: Array<any>; paging?: IPaging }` | Phát ra sau khi HTTP request tải dữ liệu hoàn tất. | `handlerLoadComplete(event: { items: any[]; paging?: IPaging }): void { this.total.set(event.paging?.total ?? 0); }` | `(outLoadItemsComplete)="handlerLoadComplete($event)"` |
|
|
510
509
|
| `(outLoading)` | `boolean` | Phát ra trạng thái loading: `true` khi đang tải, `false` khi xong. | `handlerLoading(loading: boolean): void { this.isLoading.set(loading); }` | `(outLoading)="handlerLoading($event)"` |
|
|
511
|
-
| `(outSelectKey)` | `IListDataEmitKey \| undefined` | Phát ra khi người dùng chọn 1 item (single select, type `text`/`radio`). `undefined` khi bỏ chọn. | `handlerSelectKey(event?: IListDataEmitKey): void {
|
|
510
|
+
| `(outSelectKey)` | `IListDataEmitKey \| undefined` | Phát ra khi người dùng chọn 1 item (single select, type `text`/`radio`). `undefined` khi bỏ chọn. | `handlerSelectKey(event?: IListDataEmitKey): void { this.selected.set(event?.key as string); }` | `(outSelectKey)="handlerSelectKey($event)"` |
|
|
512
511
|
| `(outSelectMultiKey)` | `IListDataEmitMultiKey \| undefined` | Phát ra khi người dùng chọn/bỏ chọn item (multi select, type `checkbox`/`group`). | `handlerSelectMultiKey(event?: IListDataEmitMultiKey): void { this.selectedIds.set(event?.keys as string[]); }` | `(outSelectMultiKey)="handlerSelectMultiKey($event)"` |
|
|
513
512
|
| `(outUnSelectMultiKey)` | `Array<unknown>` | Phát ra mảng keys bị bỏ chọn trong multi select. | `handlerUnSelectMultiKey(keys: unknown[]): void { ... }` | `(outUnSelectMultiKey)="handlerUnSelectMultiKey($event)"` |
|
|
514
513
|
|
|
@@ -727,11 +726,3 @@ interface IDataUpdateToStore {
|
|
|
727
726
|
⚠️ **outFunctionsControl**: Luôn lưu lại `IListFunctionControlEvent` khi nhận từ `(outFunctionsControl)` để dùng sau. Chỉ gọi các method sau khi component đã mount (ngOnInit xong).
|
|
728
727
|
|
|
729
728
|
⚠️ **dropdownTabKeyActive và refresh**: Thay đổi giá trị `dropdownTabKeyActive` sẽ tự động trigger `refresh()` bên trong component. Sử dụng cơ chế này khi cần reload danh sách khi đổi tab trong dropdown.
|
|
730
|
-
|
|
731
|
-
## Demo
|
|
732
|
-
|
|
733
|
-
```bash
|
|
734
|
-
npx nx serve core-ui
|
|
735
|
-
```
|
|
736
|
-
|
|
737
|
-
Truy cập: http://localhost:4500/components/list
|
package/package.json
CHANGED
|
@@ -1,37 +1,37 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@libs-ui/components-list",
|
|
3
|
-
"version": "0.2.357-
|
|
3
|
+
"version": "0.2.357-9",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@angular/common": ">=18.0.0",
|
|
6
6
|
"@angular/core": ">=18.0.0",
|
|
7
|
-
"@libs-ui/utils": "0.2.357-
|
|
8
|
-
"@libs-ui/components-avatar": "0.2.357-
|
|
9
|
-
"@libs-ui/components-badge": "0.2.357-
|
|
10
|
-
"@libs-ui/components-buttons-button": "0.2.357-
|
|
11
|
-
"@libs-ui/components-buttons-sort": "0.2.357-
|
|
12
|
-
"@libs-ui/components-checkbox-group": "0.2.357-
|
|
13
|
-
"@libs-ui/components-label": "0.2.357-
|
|
14
|
-
"@libs-ui/components-popover": "0.2.357-
|
|
15
|
-
"@libs-ui/services-http-request": "0.2.357-
|
|
7
|
+
"@libs-ui/utils": "0.2.357-9",
|
|
8
|
+
"@libs-ui/components-avatar": "0.2.357-9",
|
|
9
|
+
"@libs-ui/components-badge": "0.2.357-9",
|
|
10
|
+
"@libs-ui/components-buttons-button": "0.2.357-9",
|
|
11
|
+
"@libs-ui/components-buttons-sort": "0.2.357-9",
|
|
12
|
+
"@libs-ui/components-checkbox-group": "0.2.357-9",
|
|
13
|
+
"@libs-ui/components-label": "0.2.357-9",
|
|
14
|
+
"@libs-ui/components-popover": "0.2.357-9",
|
|
15
|
+
"@libs-ui/services-http-request": "0.2.357-9",
|
|
16
16
|
"rxjs": "~7.8.0",
|
|
17
|
-
"@libs-ui/interfaces-types": "0.2.357-
|
|
18
|
-
"@libs-ui/components-inputs-input": "0.2.357-
|
|
19
|
-
"@libs-ui/components-inputs-search": "0.2.357-
|
|
20
|
-
"@libs-ui/components-inputs-valid": "0.2.357-
|
|
21
|
-
"@libs-ui/services-dynamic-component": "0.2.357-
|
|
17
|
+
"@libs-ui/interfaces-types": "0.2.357-9",
|
|
18
|
+
"@libs-ui/components-inputs-input": "0.2.357-9",
|
|
19
|
+
"@libs-ui/components-inputs-search": "0.2.357-9",
|
|
20
|
+
"@libs-ui/components-inputs-valid": "0.2.357-9",
|
|
21
|
+
"@libs-ui/services-dynamic-component": "0.2.357-9",
|
|
22
22
|
"@ngx-translate/core": "^15.0.0",
|
|
23
23
|
"@iharbeck/ngx-virtual-scroller": "15.2.0",
|
|
24
|
-
"@libs-ui/components-checkbox-single": "0.2.357-
|
|
25
|
-
"@libs-ui/components-scroll-overlay": "0.2.357-
|
|
26
|
-
"@libs-ui/components-spinner": "0.2.357-
|
|
27
|
-
"@libs-ui/icons": "0.2.357-
|
|
28
|
-
"@libs-ui/pipes-call-function-in-template": "0.2.357-
|
|
29
|
-
"@libs-ui/pipes-convert-object-to-signal": "0.2.357-
|
|
30
|
-
"@libs-ui/components-radio-single": "0.2.357-
|
|
31
|
-
"@libs-ui/components-switch": "0.2.357-
|
|
32
|
-
"@libs-ui/components-component-outlet": "0.2.357-
|
|
33
|
-
"@libs-ui/pipes-convert-signal-to-object": "0.2.357-
|
|
34
|
-
"@libs-ui/pipes-get-value-of-object": "0.2.357-
|
|
24
|
+
"@libs-ui/components-checkbox-single": "0.2.357-9",
|
|
25
|
+
"@libs-ui/components-scroll-overlay": "0.2.357-9",
|
|
26
|
+
"@libs-ui/components-spinner": "0.2.357-9",
|
|
27
|
+
"@libs-ui/icons": "0.2.357-9",
|
|
28
|
+
"@libs-ui/pipes-call-function-in-template": "0.2.357-9",
|
|
29
|
+
"@libs-ui/pipes-convert-object-to-signal": "0.2.357-9",
|
|
30
|
+
"@libs-ui/components-radio-single": "0.2.357-9",
|
|
31
|
+
"@libs-ui/components-switch": "0.2.357-9",
|
|
32
|
+
"@libs-ui/components-component-outlet": "0.2.357-9",
|
|
33
|
+
"@libs-ui/pipes-convert-signal-to-object": "0.2.357-9",
|
|
34
|
+
"@libs-ui/pipes-get-value-of-object": "0.2.357-9"
|
|
35
35
|
},
|
|
36
36
|
"sideEffects": false,
|
|
37
37
|
"module": "fesm2022/libs-ui-components-list.mjs",
|