@libs-ui/components-inputs-add 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 +30 -11
- package/package.json +8 -8
package/README.md
CHANGED
|
@@ -128,7 +128,7 @@ import {
|
|
|
128
128
|
[(items)]="urlItems"
|
|
129
129
|
[placeholder]="'https://example.com'"
|
|
130
130
|
[labelConfig]="{ labelLeft: 'Danh sách URL', required: true }"
|
|
131
|
-
[validRequired]="{ message: 'URL là bắt buộc' }"
|
|
131
|
+
[validRequired]="{ isRequired: true, message: 'URL là bắt buộc' }"
|
|
132
132
|
[validDuplicate]="{ message: 'URL đã tồn tại trong danh sách' }"
|
|
133
133
|
(outFunctionsControl)="handlerFunctionsControl($event)"
|
|
134
134
|
(outValueChange)="handlerValueChange($event)"
|
|
@@ -216,7 +216,7 @@ import { LibsUiComponentsInputsAddComponent, IInputAdd } from '@libs-ui/componen
|
|
|
216
216
|
classIconLeft: 'libs-ui-icon-add text-[10px] mr-[8px]'
|
|
217
217
|
}"
|
|
218
218
|
[labelConfig]="{ labelLeft: 'Tags', description: 'Ít nhất một tag là bắt buộc' }"
|
|
219
|
-
[validRequired]="{ message: 'Cần ít nhất một tag' }"
|
|
219
|
+
[validRequired]="{ isRequired: true, message: 'Cần ít nhất một tag' }"
|
|
220
220
|
/>
|
|
221
221
|
`,
|
|
222
222
|
})
|
|
@@ -225,6 +225,33 @@ export class TagListComponent {
|
|
|
225
225
|
}
|
|
226
226
|
```
|
|
227
227
|
|
|
228
|
+
### Danh sách mật khẩu (password input)
|
|
229
|
+
|
|
230
|
+
```typescript
|
|
231
|
+
import { Component, signal } from '@angular/core';
|
|
232
|
+
import { LibsUiComponentsInputsAddComponent, IInputAdd } from '@libs-ui/components-inputs-add';
|
|
233
|
+
|
|
234
|
+
@Component({
|
|
235
|
+
selector: 'app-password-list',
|
|
236
|
+
standalone: true,
|
|
237
|
+
imports: [LibsUiComponentsInputsAddComponent],
|
|
238
|
+
template: `
|
|
239
|
+
<libs_ui-components-inputs-add
|
|
240
|
+
[fieldNameBind]="'pass'"
|
|
241
|
+
[(items)]="passwordItems"
|
|
242
|
+
[typeInput]="'password'"
|
|
243
|
+
[placeholder]="'Nhập mật khẩu'"
|
|
244
|
+
[labelConfig]="{ labelLeft: 'Mật khẩu bảo mật', required: true }"
|
|
245
|
+
[validRequired]="{ isRequired: true, message: 'Mật khẩu là bắt buộc' }"
|
|
246
|
+
[validMinLength]="{ length: 6, message: 'Mật khẩu phải có ít nhất 6 ký tự' }"
|
|
247
|
+
/>
|
|
248
|
+
`,
|
|
249
|
+
})
|
|
250
|
+
export class PasswordListComponent {
|
|
251
|
+
passwordItems = signal<Array<IInputAdd>>([{ pass: '' }]);
|
|
252
|
+
}
|
|
253
|
+
```
|
|
254
|
+
|
|
228
255
|
## @Input()
|
|
229
256
|
|
|
230
257
|
| Input | Type | Default | Mô tả | Ví dụ |
|
|
@@ -297,7 +324,7 @@ export class TagListComponent {
|
|
|
297
324
|
| `[validMinLength]` | `IValidLength` | `undefined` | Validate độ dài tối thiểu | `[validMinLength]="{ length: 3, message: 'Tối thiểu 3 ký tự' }"` |
|
|
298
325
|
| `[validMinValue]` | `IMessageTranslate` | `undefined` | Validate và thông báo khi nhỏ hơn giá trị số tối thiểu | `[validMinValue]="{ message: 'Phải >= 0' }"` |
|
|
299
326
|
| `[validPattern]` | `Array<IValidPattern>` | `undefined` | Validate theo danh sách regex pattern | `[validPattern]="[{ pattern: /^[a-z]+$/, message: 'Chỉ chữ thường' }]"` |
|
|
300
|
-
| `[validRequired]` | `IValidRequired` | `undefined` | Validate bắt buộc nhập | `[validRequired]="{ message: 'Trường này bắt buộc' }"` |
|
|
327
|
+
| `[validRequired]` | `IValidRequired` | `undefined` | Validate bắt buộc nhập | `[validRequired]="{ isRequired: true, message: 'Trường này bắt buộc' }"` |
|
|
301
328
|
| `[valuePatternShowError]` | `boolean` | `false` | Hiển thị lỗi pattern (khi pattern trả về false) | `[valuePatternShowError]="true"` |
|
|
302
329
|
| `[valueUpDownNumber]` | `number` | `undefined` | Bước nhảy tăng/giảm khi nhấn mũi tên trên số | `[valueUpDownNumber]="5"` |
|
|
303
330
|
|
|
@@ -415,11 +442,3 @@ interface ITemplateRightLeftItem {
|
|
|
415
442
|
⚠️ **minItems và remove**: Nút remove sẽ bị ẩn tự động khi số lượng items hiện tại bằng giá trị `minItems`. Mặc định `minItems = 1` nên luôn giữ ít nhất 1 item.
|
|
416
443
|
|
|
417
444
|
⚠️ **Per-item config**: Mỗi `IInputAdd` item có thể override nhiều thuộc tính như `placeholder`, `maxLength`, `disable`, `readonly`, `ignoreRemove`, `unitsLeft/Right` riêng — ưu tiên hơn config toàn cục.
|
|
418
|
-
|
|
419
|
-
## Demo
|
|
420
|
-
|
|
421
|
-
```bash
|
|
422
|
-
npx nx serve core-ui
|
|
423
|
-
```
|
|
424
|
-
|
|
425
|
-
Truy cập: `http://localhost:4500/inputs/add`
|
package/package.json
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@libs-ui/components-inputs-add",
|
|
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/components-buttons-button": "0.2.357-
|
|
8
|
-
"@libs-ui/components-inputs-valid": "0.2.357-
|
|
9
|
-
"@libs-ui/components-label": "0.2.357-
|
|
10
|
-
"@libs-ui/components-switch": "0.2.357-
|
|
11
|
-
"@libs-ui/interfaces-types": "0.2.357-
|
|
12
|
-
"@libs-ui/utils": "0.2.357-
|
|
7
|
+
"@libs-ui/components-buttons-button": "0.2.357-9",
|
|
8
|
+
"@libs-ui/components-inputs-valid": "0.2.357-9",
|
|
9
|
+
"@libs-ui/components-label": "0.2.357-9",
|
|
10
|
+
"@libs-ui/components-switch": "0.2.357-9",
|
|
11
|
+
"@libs-ui/interfaces-types": "0.2.357-9",
|
|
12
|
+
"@libs-ui/utils": "0.2.357-9",
|
|
13
13
|
"@ngx-translate/core": "^15.0.0",
|
|
14
|
-
"@libs-ui/components-inputs-input": "0.2.357-
|
|
14
|
+
"@libs-ui/components-inputs-input": "0.2.357-9"
|
|
15
15
|
},
|
|
16
16
|
"sideEffects": false,
|
|
17
17
|
"module": "fesm2022/libs-ui-components-inputs-add.mjs",
|