iptdevs-design-system 3.1.916 → 3.1.917
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/esm2020/lib/components/atoms/datalist/datalist.component.mjs +13 -7
- package/fesm2015/iptdevs-design-system.mjs +12 -6
- package/fesm2015/iptdevs-design-system.mjs.map +1 -1
- package/fesm2020/iptdevs-design-system.mjs +12 -6
- package/fesm2020/iptdevs-design-system.mjs.map +1 -1
- package/lib/components/atoms/datalist/datalist.component.d.ts +5 -2
- package/package.json +1 -1
|
@@ -8,6 +8,11 @@ export class DatalistComponent {
|
|
|
8
8
|
this.label = '';
|
|
9
9
|
this.isChanged = new EventEmitter();
|
|
10
10
|
this.clicked = false;
|
|
11
|
+
this.uniqueDatalistId = '';
|
|
12
|
+
}
|
|
13
|
+
ngOnInit() {
|
|
14
|
+
// Generar un ID único si no se proporciona datalistId
|
|
15
|
+
this.uniqueDatalistId = this.datalistId || `datalist-${DatalistComponent.idCounter++}-${Date.now()}`;
|
|
11
16
|
}
|
|
12
17
|
optionChanged(event) {
|
|
13
18
|
let selectOption = this.datalistData.find(element => this.label === 'displayName' ? element.displayName === event.target.value : element.name === event.target.value);
|
|
@@ -34,6 +39,7 @@ export class DatalistComponent {
|
|
|
34
39
|
return this.clicked === false ? 'label' : 'labelUp';
|
|
35
40
|
}
|
|
36
41
|
}
|
|
42
|
+
DatalistComponent.idCounter = 0; // Contador estático para generar IDs únicos
|
|
37
43
|
DatalistComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: DatalistComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
38
44
|
DatalistComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: DatalistComponent, selector: "ipt-datalist", inputs: { datalistId: "datalistId", datalistData: "datalistData", placeHolder: "placeHolder", validateText: "validateText", initalData: "initalData", disabledSel: "disabledSel", label: "label" }, outputs: { isChanged: "isChanged" }, ngImport: i0, template: `
|
|
39
45
|
<div class="input-container">
|
|
@@ -42,15 +48,15 @@ DatalistComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", vers
|
|
|
42
48
|
type="text"
|
|
43
49
|
class="input"
|
|
44
50
|
(click)="click($event)"
|
|
45
|
-
[attr.list]="
|
|
51
|
+
[attr.list]="uniqueDatalistId"
|
|
46
52
|
(change)="optionChanged($event)"
|
|
47
53
|
[disabled]="disabledSel"
|
|
48
54
|
[value]="setDataListValue()"
|
|
49
55
|
/>
|
|
50
56
|
|
|
51
|
-
<datalist id="
|
|
57
|
+
<datalist [id]="uniqueDatalistId">
|
|
52
58
|
<option *ngFor="let item of datalistData; index as i" [value]="label === 'displayName' ? item.displayName : item.name">
|
|
53
|
-
{{ label === 'displayName' ? item.displayName : (item.id_card + ' ' + item.name
|
|
59
|
+
{{ label === 'displayName' ? item.displayName : (item.id_card ? item.id_card + ' ' : '') + item.name }}
|
|
54
60
|
</option>
|
|
55
61
|
</datalist>
|
|
56
62
|
</div>
|
|
@@ -64,15 +70,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImpor
|
|
|
64
70
|
type="text"
|
|
65
71
|
class="input"
|
|
66
72
|
(click)="click($event)"
|
|
67
|
-
[attr.list]="
|
|
73
|
+
[attr.list]="uniqueDatalistId"
|
|
68
74
|
(change)="optionChanged($event)"
|
|
69
75
|
[disabled]="disabledSel"
|
|
70
76
|
[value]="setDataListValue()"
|
|
71
77
|
/>
|
|
72
78
|
|
|
73
|
-
<datalist id="
|
|
79
|
+
<datalist [id]="uniqueDatalistId">
|
|
74
80
|
<option *ngFor="let item of datalistData; index as i" [value]="label === 'displayName' ? item.displayName : item.name">
|
|
75
|
-
{{ label === 'displayName' ? item.displayName : (item.id_card + ' ' + item.name
|
|
81
|
+
{{ label === 'displayName' ? item.displayName : (item.id_card ? item.id_card + ' ' : '') + item.name }}
|
|
76
82
|
</option>
|
|
77
83
|
</datalist>
|
|
78
84
|
</div>
|
|
@@ -94,4 +100,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImpor
|
|
|
94
100
|
}], isChanged: [{
|
|
95
101
|
type: Output
|
|
96
102
|
}] } });
|
|
97
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
103
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YWxpc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vZGVzaWduLXN5c3RlbS9zcmMvbGliL2NvbXBvbmVudHMvYXRvbXMvZGF0YWxpc3QvZGF0YWxpc3QuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQVUsTUFBTSxlQUFlLENBQUM7Ozs7QUEyQi9FLE1BQU0sT0FBTyxpQkFBaUI7SUFnQjVCLFlBQVksRUFBZTtRQVZsQixnQkFBVyxHQUFZLEtBQUssQ0FBQztRQUM3QixVQUFLLEdBQVcsRUFBRSxDQUFDO1FBRWxCLGNBQVMsR0FBRyxJQUFJLFlBQVksRUFBVSxDQUFDO1FBRWpELFlBQU8sR0FBWSxLQUFLLENBQUM7UUFDekIscUJBQWdCLEdBQVcsRUFBRSxDQUFDO0lBSUEsQ0FBQztJQUUvQixRQUFRO1FBQ04sc0RBQXNEO1FBQ3RELElBQUksQ0FBQyxnQkFBZ0IsR0FBRyxJQUFJLENBQUMsVUFBVSxJQUFJLFlBQVksaUJBQWlCLENBQUMsU0FBUyxFQUFFLElBQUksSUFBSSxDQUFDLEdBQUcsRUFBRSxFQUFFLENBQUM7SUFDdkcsQ0FBQztJQUVILGFBQWEsQ0FBQyxLQUFVO1FBQ3BCLElBQUksWUFBWSxHQUFHLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxFQUFFLENBQ2xELElBQUksQ0FBQyxLQUFLLEtBQUssYUFBYSxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsV0FBVyxLQUFLLEtBQUssQ0FBQyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsSUFBSSxLQUFLLEtBQUssQ0FBQyxNQUFNLENBQUMsS0FBSyxDQUNoSCxDQUFDO1FBQ0YsSUFBSSxPQUFPLFlBQVksS0FBSyxXQUFXLEVBQUU7WUFDdkMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxDQUFDO1NBQ3hDO2FBQU07WUFDTCxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztTQUMzQjtJQUNILENBQUM7SUFFRCxLQUFLLENBQUMsS0FBaUI7UUFDckIsSUFBSSxDQUFDLE9BQU8sR0FBRyxLQUFLLENBQUMsU0FBUyxDQUFDO0lBQ2pDLENBQUM7SUFFSCxnQkFBZ0I7UUFDWixJQUFJLFlBQVksR0FBRyxJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsRUFBRSxDQUFDLE9BQU8sQ0FBQyxJQUFJLEtBQUssSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDO1FBQ3ZGLElBQUksT0FBTyxZQUFZLEtBQUssV0FBVyxFQUFFO1lBQ3ZDLE9BQU8sSUFBSSxDQUFDLEtBQUssS0FBSyxhQUFhLENBQUMsQ0FBQyxDQUFDLFlBQVksQ0FBQyxXQUFXLENBQUMsQ0FBQyxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUM7U0FDcEY7YUFBTTtZQUNMLE9BQU8sRUFBRSxDQUFDO1NBQ1g7SUFDSCxDQUFDO0lBRUQsSUFBVyxVQUFVO1FBQ25CLE9BQU8sSUFBSSxDQUFDLE9BQU8sS0FBSyxLQUFLLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDO0lBQ3RELENBQUM7O0FBbkNjLDJCQUFTLEdBQUcsQ0FBRSxDQUFBLENBQUMsNENBQTRDOzhHQWQvRCxpQkFBaUI7a0dBQWpCLGlCQUFpQiw2UkF0QmxCOzs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBbUJUOzJGQUdVLGlCQUFpQjtrQkF4QjdCLFNBQVM7K0JBQ0UsY0FBYyxZQUNkOzs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBbUJUO2tHQUlRLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFFSSxTQUFTO3NCQUFsQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRm9ybUJ1aWxkZXIgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2lwdC1kYXRhbGlzdCcsXG4gIHRlbXBsYXRlOiBgXG4gICAgPGRpdiBjbGFzcz1cImlucHV0LWNvbnRhaW5lclwiPlxuICAgICAgPGxhYmVsIFtuZ0NsYXNzXT1cImxhYmVsQ2xhc3NcIj57eyBwbGFjZUhvbGRlciB9fTwvbGFiZWw+XG4gICAgICA8aW5wdXRcbiAgICAgICAgdHlwZT1cInRleHRcIlxuICAgICAgICBjbGFzcz1cImlucHV0XCJcbiAgICAgICAgKGNsaWNrKT1cImNsaWNrKCRldmVudClcIlxuICAgICAgICBbYXR0ci5saXN0XT1cInVuaXF1ZURhdGFsaXN0SWRcIlxuICAgICAgICAoY2hhbmdlKT1cIm9wdGlvbkNoYW5nZWQoJGV2ZW50KVwiXG4gICAgICAgIFtkaXNhYmxlZF09XCJkaXNhYmxlZFNlbFwiXG4gICAgICAgIFt2YWx1ZV09XCJzZXREYXRhTGlzdFZhbHVlKClcIlxuICAgICAgLz5cblxuICAgICAgPGRhdGFsaXN0IFtpZF09XCJ1bmlxdWVEYXRhbGlzdElkXCI+XG4gICAgICAgIDxvcHRpb24gKm5nRm9yPVwibGV0IGl0ZW0gb2YgZGF0YWxpc3REYXRhOyBpbmRleCBhcyBpXCIgW3ZhbHVlXT1cImxhYmVsID09PSAnZGlzcGxheU5hbWUnID8gaXRlbS5kaXNwbGF5TmFtZSA6IGl0ZW0ubmFtZVwiPlxuICAgICAgICAgIHt7IGxhYmVsID09PSAnZGlzcGxheU5hbWUnID8gaXRlbS5kaXNwbGF5TmFtZSA6IChpdGVtLmlkX2NhcmQgPyBpdGVtLmlkX2NhcmQgKyAnICcgOiAnJykgKyBpdGVtLm5hbWUgfX1cbiAgICAgICAgPC9vcHRpb24+XG4gICAgICA8L2RhdGFsaXN0PlxuICAgIDwvZGl2PlxuICBgLFxuICBzdHlsZVVybHM6IFsnLi9kYXRhbGlzdC5jc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgRGF0YWxpc3RDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBASW5wdXQoKSBkYXRhbGlzdElkITogc3RyaW5nO1xuICBASW5wdXQoKSBkYXRhbGlzdERhdGEhOiBhbnlbXTtcbiAgQElucHV0KCkgcGxhY2VIb2xkZXIhOiBzdHJpbmc7XG4gIEBJbnB1dCgpIHZhbGlkYXRlVGV4dCE6IHN0cmluZztcbiAgQElucHV0KCkgaW5pdGFsRGF0YSE6IHN0cmluZztcbiAgQElucHV0KCkgZGlzYWJsZWRTZWw6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgbGFiZWw6IHN0cmluZyA9ICcnO1xuXG4gIEBPdXRwdXQoKSBpc0NoYW5nZWQgPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZz4oKTtcblxuICBjbGlja2VkOiBib29sZWFuID0gZmFsc2U7XG4gIHVuaXF1ZURhdGFsaXN0SWQ6IHN0cmluZyA9ICcnO1xuXG4gIHByaXZhdGUgc3RhdGljIGlkQ291bnRlciA9IDA7IC8vIENvbnRhZG9yIGVzdMOhdGljbyBwYXJhIGdlbmVyYXIgSURzIMO6bmljb3NcblxuICBjb25zdHJ1Y3RvcihmYjogRm9ybUJ1aWxkZXIpIHt9XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgLy8gR2VuZXJhciB1biBJRCDDum5pY28gc2kgbm8gc2UgcHJvcG9yY2lvbmEgZGF0YWxpc3RJZFxuICAgIHRoaXMudW5pcXVlRGF0YWxpc3RJZCA9IHRoaXMuZGF0YWxpc3RJZCB8fCBgZGF0YWxpc3QtJHtEYXRhbGlzdENvbXBvbmVudC5pZENvdW50ZXIrK30tJHtEYXRlLm5vdygpfWA7XG4gIH1cblxub3B0aW9uQ2hhbmdlZChldmVudDogYW55KSB7XG4gICAgbGV0IHNlbGVjdE9wdGlvbiA9IHRoaXMuZGF0YWxpc3REYXRhLmZpbmQoZWxlbWVudCA9PlxuICAgICAgdGhpcy5sYWJlbCA9PT0gJ2Rpc3BsYXlOYW1lJyA/IGVsZW1lbnQuZGlzcGxheU5hbWUgPT09IGV2ZW50LnRhcmdldC52YWx1ZSA6IGVsZW1lbnQubmFtZSA9PT0gZXZlbnQudGFyZ2V0LnZhbHVlXG4gICAgKTtcbiAgICBpZiAodHlwZW9mIHNlbGVjdE9wdGlvbiAhPT0gJ3VuZGVmaW5lZCcpIHtcbiAgICAgIHRoaXMuaXNDaGFuZ2VkLmVtaXQoc2VsZWN0T3B0aW9uLmNvZGUpO1xuICAgIH0gZWxzZSB7XG4gICAgICB0aGlzLmlzQ2hhbmdlZC5lbWl0KCctMScpO1xuICAgIH1cbiAgfVxuXG4gIGNsaWNrKHZhbHVlOiBNb3VzZUV2ZW50KSB7XG4gICAgdGhpcy5jbGlja2VkID0gdmFsdWUuaXNUcnVzdGVkO1xuICB9XG5cbnNldERhdGFMaXN0VmFsdWUoKSB7XG4gICAgbGV0IHNlbGVjdE9wdGlvbiA9IHRoaXMuZGF0YWxpc3REYXRhLmZpbmQoZWxlbWVudCA9PiBlbGVtZW50LmNvZGUgPT09IHRoaXMuaW5pdGFsRGF0YSk7XG4gICAgaWYgKHR5cGVvZiBzZWxlY3RPcHRpb24gIT09ICd1bmRlZmluZWQnKSB7XG4gICAgICByZXR1cm4gdGhpcy5sYWJlbCA9PT0gJ2Rpc3BsYXlOYW1lJyA/IHNlbGVjdE9wdGlvbi5kaXNwbGF5TmFtZSA6IHNlbGVjdE9wdGlvbi5uYW1lO1xuICAgIH0gZWxzZSB7XG4gICAgICByZXR1cm4gJyc7XG4gICAgfVxuICB9XG5cbiAgcHVibGljIGdldCBsYWJlbENsYXNzKCk6IHN0cmluZyB7XG4gICAgcmV0dXJuIHRoaXMuY2xpY2tlZCA9PT0gZmFsc2UgPyAnbGFiZWwnIDogJ2xhYmVsVXAnO1xuICB9XG59Il19
|
|
@@ -211,6 +211,11 @@ class DatalistComponent {
|
|
|
211
211
|
this.label = '';
|
|
212
212
|
this.isChanged = new EventEmitter();
|
|
213
213
|
this.clicked = false;
|
|
214
|
+
this.uniqueDatalistId = '';
|
|
215
|
+
}
|
|
216
|
+
ngOnInit() {
|
|
217
|
+
// Generar un ID único si no se proporciona datalistId
|
|
218
|
+
this.uniqueDatalistId = this.datalistId || `datalist-${DatalistComponent.idCounter++}-${Date.now()}`;
|
|
214
219
|
}
|
|
215
220
|
optionChanged(event) {
|
|
216
221
|
let selectOption = this.datalistData.find(element => this.label === 'displayName' ? element.displayName === event.target.value : element.name === event.target.value);
|
|
@@ -237,6 +242,7 @@ class DatalistComponent {
|
|
|
237
242
|
return this.clicked === false ? 'label' : 'labelUp';
|
|
238
243
|
}
|
|
239
244
|
}
|
|
245
|
+
DatalistComponent.idCounter = 0; // Contador estático para generar IDs únicos
|
|
240
246
|
DatalistComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: DatalistComponent, deps: [{ token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
241
247
|
DatalistComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: DatalistComponent, selector: "ipt-datalist", inputs: { datalistId: "datalistId", datalistData: "datalistData", placeHolder: "placeHolder", validateText: "validateText", initalData: "initalData", disabledSel: "disabledSel", label: "label" }, outputs: { isChanged: "isChanged" }, ngImport: i0, template: `
|
|
242
248
|
<div class="input-container">
|
|
@@ -245,15 +251,15 @@ DatalistComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", vers
|
|
|
245
251
|
type="text"
|
|
246
252
|
class="input"
|
|
247
253
|
(click)="click($event)"
|
|
248
|
-
[attr.list]="
|
|
254
|
+
[attr.list]="uniqueDatalistId"
|
|
249
255
|
(change)="optionChanged($event)"
|
|
250
256
|
[disabled]="disabledSel"
|
|
251
257
|
[value]="setDataListValue()"
|
|
252
258
|
/>
|
|
253
259
|
|
|
254
|
-
<datalist id="
|
|
260
|
+
<datalist [id]="uniqueDatalistId">
|
|
255
261
|
<option *ngFor="let item of datalistData; index as i" [value]="label === 'displayName' ? item.displayName : item.name">
|
|
256
|
-
{{ label === 'displayName' ? item.displayName : (item.id_card + ' ' + item.name
|
|
262
|
+
{{ label === 'displayName' ? item.displayName : (item.id_card ? item.id_card + ' ' : '') + item.name }}
|
|
257
263
|
</option>
|
|
258
264
|
</datalist>
|
|
259
265
|
</div>
|
|
@@ -267,15 +273,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImpor
|
|
|
267
273
|
type="text"
|
|
268
274
|
class="input"
|
|
269
275
|
(click)="click($event)"
|
|
270
|
-
[attr.list]="
|
|
276
|
+
[attr.list]="uniqueDatalistId"
|
|
271
277
|
(change)="optionChanged($event)"
|
|
272
278
|
[disabled]="disabledSel"
|
|
273
279
|
[value]="setDataListValue()"
|
|
274
280
|
/>
|
|
275
281
|
|
|
276
|
-
<datalist id="
|
|
282
|
+
<datalist [id]="uniqueDatalistId">
|
|
277
283
|
<option *ngFor="let item of datalistData; index as i" [value]="label === 'displayName' ? item.displayName : item.name">
|
|
278
|
-
{{ label === 'displayName' ? item.displayName : (item.id_card + ' ' + item.name
|
|
284
|
+
{{ label === 'displayName' ? item.displayName : (item.id_card ? item.id_card + ' ' : '') + item.name }}
|
|
279
285
|
</option>
|
|
280
286
|
</datalist>
|
|
281
287
|
</div>
|