@guajiritos/general-autocomplete 0.1.8 → 0.1.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.
Files changed (30) hide show
  1. package/README.md +0 -1
  2. package/esm2022/lib/guachos-general-autocomplete.component.mjs +29 -48
  3. package/esm2022/utils/interfaces/interfaces.mjs +2 -12
  4. package/esm2022/utils/pipes/i18n-field.pipe.mjs +8 -1
  5. package/esm2022/utils/pipes/pipes.module.mjs +10 -62
  6. package/esm2022/utils/pipes/resolve-property-path.pipe.mjs +11 -58
  7. package/esm2022/utils/services/autocomplete.service.mjs +39 -1
  8. package/esm2022/utils/services/utils.service.mjs +5 -28
  9. package/fesm2022/guajiritos-general-autocomplete.mjs +95 -297
  10. package/fesm2022/guajiritos-general-autocomplete.mjs.map +1 -1
  11. package/lib/guachos-general-autocomplete.component.d.ts +5 -16
  12. package/package.json +1 -1
  13. package/utils/interfaces/interfaces.d.ts +0 -17
  14. package/utils/pipes/i18n-field.pipe.d.ts +7 -0
  15. package/utils/pipes/pipes.module.d.ts +3 -10
  16. package/utils/pipes/resolve-property-path.pipe.d.ts +8 -17
  17. package/utils/services/autocomplete.service.d.ts +38 -0
  18. package/utils/services/utils.service.d.ts +4 -16
  19. package/esm2022/utils/pipes/duration.pipe.mjs +0 -18
  20. package/esm2022/utils/pipes/humanize-duration.pipe.mjs +0 -17
  21. package/esm2022/utils/pipes/ida-return.pipe.mjs +0 -23
  22. package/esm2022/utils/pipes/show-roles.pipe.mjs +0 -24
  23. package/esm2022/utils/pipes/show-segments.pipe.mjs +0 -24
  24. package/esm2022/utils/pipes/show-transport-types.pipe.mjs +0 -24
  25. package/utils/pipes/duration.pipe.d.ts +0 -8
  26. package/utils/pipes/humanize-duration.pipe.d.ts +0 -7
  27. package/utils/pipes/ida-return.pipe.d.ts +0 -8
  28. package/utils/pipes/show-roles.pipe.d.ts +0 -8
  29. package/utils/pipes/show-segments.pipe.d.ts +0 -8
  30. package/utils/pipes/show-transport-types.pipe.d.ts +0 -8
@@ -9,8 +9,7 @@ import { MatFormFieldModule } from '@angular/material/form-field';
9
9
  import * as i2 from '@ngx-translate/core';
10
10
  import { TranslateModule } from '@ngx-translate/core';
11
11
  import { Subject, takeUntil, debounceTime } from 'rxjs';
12
- import * as i5 from '@angular/common';
13
- import { CurrencyPipe, UpperCasePipe, NgClass, NgIf, NgForOf, NgStyle, NgTemplateOutlet } from '@angular/common';
12
+ import { NgIf, NgForOf, NgStyle, NgTemplateOutlet, NgClass } from '@angular/common';
14
13
  import * as i6 from '@angular/material/input';
15
14
  import { MatInputModule } from '@angular/material/input';
16
15
  import * as i8 from '@angular/material/button';
@@ -23,19 +22,7 @@ import * as i1 from '@angular/common/http';
23
22
  import { HttpParams } from '@angular/common/http';
24
23
  import { map } from 'rxjs/operators';
25
24
  import merge from 'lodash.merge';
26
- import * as i5$1 from '@angular/material/core';
27
-
28
- var CustomPipes;
29
- (function (CustomPipes) {
30
- CustomPipes["SHOW_SEGMENTS"] = "showSegments";
31
- CustomPipes["DURATION_TIME"] = "durationTime";
32
- CustomPipes["HUMANIZE_DURATION"] = "humanizeDuration";
33
- CustomPipes["SHOW_TRANSPORT_TYPES"] = "showTransportTypes";
34
- CustomPipes["SHOW_ROLES"] = "showRoles";
35
- CustomPipes["IDA_RETURN"] = "idaReturn";
36
- CustomPipes["CURRENCY"] = "currency";
37
- CustomPipes["UPPERCASE"] = "uppercase";
38
- })(CustomPipes || (CustomPipes = {}));
25
+ import * as i5 from '@angular/material/core';
39
26
 
40
27
  const GENERAL_DISPLAY_OPTIONS = {
41
28
  firthLabel: [
@@ -48,10 +35,22 @@ const GENERAL_DISPLAY_OPTIONS = {
48
35
  };
49
36
 
50
37
  class AutocompleteService {
38
+ /**
39
+ * Constructor function for the class.
40
+ *
41
+ * @param {HttpClient} _httpClient - The HttpClient instance to be used by the class.
42
+ */
51
43
  constructor(_httpClient) {
52
44
  this._httpClient = _httpClient;
53
45
  this.httpOptions = {};
54
46
  }
47
+ /**
48
+ * Processes the parameters and returns a Promise that resolves with the filter object.
49
+ *
50
+ * @param {string[] | string | undefined} filters - The filters to process.
51
+ * @param {string} value - The value to process the filters with.
52
+ * @return {Promise<any>} A Promise that resolves with the filter object.
53
+ */
55
54
  processParams(filters, value) {
56
55
  return new Promise((resolve, reject) => {
57
56
  setTimeout(async () => {
@@ -89,6 +88,13 @@ class AutocompleteService {
89
88
  }, 100);
90
89
  });
91
90
  }
91
+ /**
92
+ * Processes the filter string and returns the result.
93
+ *
94
+ * @param {string} filter - The filter string to process.
95
+ * @param {string} value - The value to use in the processing.
96
+ * @return {Promise<any>} - A promise that resolves to the processed result.
97
+ */
92
98
  async processFilterString(filter, value) {
93
99
  let f = {};
94
100
  const arrayFilters = filter?.split('[');
@@ -100,6 +106,13 @@ class AutocompleteService {
100
106
  });
101
107
  return f;
102
108
  }
109
+ /**
110
+ * Creates object filters based on the given array and value.
111
+ *
112
+ * @param {string[]} array - The array of filters.
113
+ * @param {string} value - The value to be filtered.
114
+ * @return {Promise<any>} - A promise that resolves to the filtered object.
115
+ */
103
116
  async createObjectFilters(array, value) {
104
117
  for (let filter of array) {
105
118
  filter = filter?.replace(']', '');
@@ -117,6 +130,18 @@ class AutocompleteService {
117
130
  }
118
131
  }
119
132
  }
133
+ /**
134
+ * Retrieves autocomplete suggestions based on the provided text and other optional parameters.
135
+ *
136
+ * @param {string} url - The URL to send the request to.
137
+ * @param {string} [text] - The text to use for autocomplete suggestions. Defaults to an empty string.
138
+ * @param {string[] | string} [field] - The field(s) to filter the autocomplete suggestions by.
139
+ * @param {RestrictionFilter[]} [restrictions] - The restriction filters to apply to the autocomplete suggestions.
140
+ * @param {string[]} [removeProperties] - The properties to remove from the autocomplete suggestions.
141
+ * @param {string} [order] - The order in which to retrieve the autocomplete suggestions.
142
+ * @param {ApiFormData} [bodyRequest] - The request body for the autocomplete suggestions.
143
+ * @return {Promise<Observable<any>>} - A promise that resolves to an observable containing the autocomplete suggestions.
144
+ */
120
145
  async getAutocompleteByText(url, text, field, restrictions, removeProperties, order, bodyRequest) {
121
146
  let httpParams = new HttpParams().set('offset', '0');
122
147
  httpParams = httpParams.append('limit', '20');
@@ -204,35 +229,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
204
229
 
205
230
  class UtilsService {
206
231
  /**
207
- * Convierte el tiempo pasado por parámetro en horas y minutos
232
+ * Resolves the value of a property in an object by providing a path.
208
233
  *
209
- * @param time - Tiempo
210
- * @returns Devuelve las horas y minutos
234
+ * @param {any} obj - The object to traverse.
235
+ * @param {string[]} path - An array of strings representing the path to the desired property.
236
+ * @return {any} The value of the property at the given path, or null if the path is invalid.
211
237
  */
212
- static getTime(time) {
213
- const hours = parseInt(Number(time) / 3600 + '', 10);
214
- time = Number(time) - (hours * 3600);
215
- const minutes = parseInt(Number(time) / 60 + '', 10);
216
- return { hours, minutes };
217
- }
218
- /**
219
- * Devuelve el tiempo en formato 'hh:mm'
220
- *
221
- * @param time - Tiempo
222
- */
223
- static getTimePretty(time) {
224
- const { hours, minutes } = UtilsService.getTime(time);
225
- return (hours < 10 ? '0' + hours : hours) + ':' + (minutes < 10 ? '0' + minutes : minutes);
226
- }
227
- /**
228
- * Devuelve el tiempo en formato 'hhh : mmm'
229
- *
230
- * @param time - Tiempo
231
- */
232
- static humanizeDuration(time) {
233
- const { hours, minutes } = UtilsService.getTime(time);
234
- return (hours < 10 ? '0' + hours : hours) + 'h : ' + (minutes < 10 ? '0' + minutes : minutes) + 'm';
235
- }
236
238
  static resolvePropertyByPath(obj, path) {
237
239
  return path.reduce((prev, curr) => {
238
240
  return prev ? prev[curr] : null;
@@ -248,36 +250,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
248
250
  }]
249
251
  }] });
250
252
 
251
- class DurationTimePipe {
252
- transform(value) {
253
- return UtilsService.getTimePretty(value);
254
- }
255
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: DurationTimePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
256
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.1", ngImport: i0, type: DurationTimePipe, name: "durationTime" }); }
257
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: DurationTimePipe }); }
258
- }
259
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: DurationTimePipe, decorators: [{
260
- type: Injectable
261
- }, {
262
- type: Pipe,
263
- args: [{ name: 'durationTime' }]
264
- }] });
265
-
266
- class HumanizeDurationPipe {
267
- transform(input) {
268
- return UtilsService.humanizeDuration(input);
269
- }
270
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: HumanizeDurationPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
271
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.1", ngImport: i0, type: HumanizeDurationPipe, name: "humanizeDuration" }); }
272
- }
273
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: HumanizeDurationPipe, decorators: [{
274
- type: Pipe,
275
- args: [{
276
- name: 'humanizeDuration'
277
- }]
278
- }] });
279
-
280
253
  class I18nFieldPipe {
254
+ /**
255
+ * Transforms a value based on the specified language.
256
+ *
257
+ * @param {any} value - The value to be transformed.
258
+ * @param {string} lang - The language to use for transformation.
259
+ * @return {string} The transformed value.
260
+ */
281
261
  transform(value, lang) {
282
262
  if (!value) {
283
263
  return '';
@@ -303,103 +283,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
303
283
  args: [{ name: 'i18nField' }]
304
284
  }] });
305
285
 
306
- class IdaReturnPipe {
307
- transform(value) {
308
- if (value === CustomPipes.IDA_RETURN) {
309
- return 'Ida y Vuelta';
310
- }
311
- else {
312
- return 'solo Ida';
313
- }
314
- }
315
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: IdaReturnPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
316
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.1", ngImport: i0, type: IdaReturnPipe, name: "idaReturn" }); }
317
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: IdaReturnPipe }); }
318
- }
319
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: IdaReturnPipe, decorators: [{
320
- type: Injectable
321
- }, {
322
- type: Pipe,
323
- args: [{ name: 'idaReturn' }]
324
- }] });
325
-
326
- class ShowRolesPipe {
327
- transform(value) {
328
- let result = '';
329
- if (value?.length) {
330
- value.forEach(item => {
331
- result += item?.Rol?.name + ', ';
332
- });
333
- result = result.substring(0, result?.length - 2);
334
- }
335
- return result;
336
- }
337
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ShowRolesPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
338
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.1", ngImport: i0, type: ShowRolesPipe, name: "showSegments" }); }
339
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ShowRolesPipe }); }
340
- }
341
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ShowRolesPipe, decorators: [{
342
- type: Injectable
343
- }, {
344
- type: Pipe,
345
- args: [{ name: 'showSegments' }]
346
- }] });
347
-
348
- class ShowSegmentsPipe {
349
- transform(value) {
350
- let result = '';
351
- if (value?.length) {
352
- value.forEach(item => {
353
- result += item?.Segment?.PlaceOrigin?.alpha3 + '-' + item?.Segment?.PlaceDestination?.alpha3 + ', ';
354
- });
355
- result = result.substring(0, result?.length - 2);
356
- }
357
- return result;
358
- }
359
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ShowSegmentsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
360
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.1", ngImport: i0, type: ShowSegmentsPipe, name: "showSegments" }); }
361
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ShowSegmentsPipe }); }
362
- }
363
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ShowSegmentsPipe, decorators: [{
364
- type: Injectable
365
- }, {
366
- type: Pipe,
367
- args: [{ name: 'showSegments' }]
368
- }] });
369
-
370
- class ShowTransportTypesPipe {
371
- transform(value) {
372
- let result = '';
373
- if (value?.length) {
374
- value.forEach(item => {
375
- result += item?.TransportType?.name['es'] + ', ';
376
- });
377
- result = result.substring(0, result?.length - 2);
378
- }
379
- return result;
380
- }
381
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ShowTransportTypesPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
382
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.1", ngImport: i0, type: ShowTransportTypesPipe, name: "showTransportTypes" }); }
383
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ShowTransportTypesPipe }); }
384
- }
385
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ShowTransportTypesPipe, decorators: [{
386
- type: Injectable
387
- }, {
388
- type: Pipe,
389
- args: [{ name: 'showTransportTypes' }]
390
- }] });
391
-
392
286
  class ResolvePropertyPath {
393
- constructor(_showSegmentPipe, _showRolesPipe, _showTransportTypesPipe, _idaReturnPipe, _currencyPipe, _humanizeDurationPipe, _upperCasePipe, _durationPipe) {
394
- this._showSegmentPipe = _showSegmentPipe;
395
- this._showRolesPipe = _showRolesPipe;
396
- this._showTransportTypesPipe = _showTransportTypesPipe;
397
- this._idaReturnPipe = _idaReturnPipe;
398
- this._currencyPipe = _currencyPipe;
399
- this._humanizeDurationPipe = _humanizeDurationPipe;
400
- this._upperCasePipe = _upperCasePipe;
401
- this._durationPipe = _durationPipe;
402
- }
287
+ /**
288
+ * Transforms the given object based on the provided path and returns the transformed string.
289
+ *
290
+ * @param {any} obj - The object to be transformed.
291
+ * @param {DisplayOptionItem[]} path - The array of display option items used for transformation.
292
+ * @return {string} The transformed string.
293
+ */
403
294
  transform(obj, path) {
404
295
  let result = '';
405
296
  path?.forEach((item) => {
@@ -408,118 +299,44 @@ class ResolvePropertyPath {
408
299
  }
409
300
  else {
410
301
  if (item?.path) {
411
- let value = UtilsService.resolvePropertyByPath(obj, item.path);
412
- switch (item?.customPipe) {
413
- case CustomPipes.SHOW_SEGMENTS:
414
- value = this._showSegmentPipe.transform(value);
415
- break;
416
- case CustomPipes.DURATION_TIME:
417
- value = this._durationPipe.transform(value);
418
- break;
419
- case CustomPipes.HUMANIZE_DURATION:
420
- value = this._humanizeDurationPipe.transform(value);
421
- break;
422
- case CustomPipes.SHOW_TRANSPORT_TYPES:
423
- value = this._showTransportTypesPipe.transform(value);
424
- break;
425
- case CustomPipes.SHOW_ROLES:
426
- value = this._showRolesPipe.transform(value);
427
- break;
428
- case CustomPipes.IDA_RETURN:
429
- value = this._idaReturnPipe.transform(value);
430
- break;
431
- case CustomPipes.CURRENCY:
432
- value = this._currencyPipe.transform(value);
433
- break;
434
- case CustomPipes.UPPERCASE:
435
- value = this._upperCasePipe.transform(value);
436
- break;
437
- default:
438
- break;
439
- }
440
- result += value;
302
+ result += UtilsService.resolvePropertyByPath(obj, item.path);
441
303
  }
442
304
  }
443
305
  });
444
306
  return result;
445
307
  }
446
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ResolvePropertyPath, deps: [{ token: ShowSegmentsPipe }, { token: ShowRolesPipe }, { token: ShowTransportTypesPipe }, { token: IdaReturnPipe }, { token: i5.CurrencyPipe }, { token: HumanizeDurationPipe }, { token: i5.UpperCasePipe }, { token: DurationTimePipe }], target: i0.ɵɵFactoryTarget.Pipe }); }
308
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ResolvePropertyPath, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
447
309
  static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.1", ngImport: i0, type: ResolvePropertyPath, name: "resolvePropertyPath" }); }
448
310
  }
449
311
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: ResolvePropertyPath, decorators: [{
450
312
  type: Pipe,
451
313
  args: [{ name: 'resolvePropertyPath' }]
452
- }], ctorParameters: function () { return [{ type: ShowSegmentsPipe }, { type: ShowRolesPipe }, { type: ShowTransportTypesPipe }, { type: IdaReturnPipe }, { type: i5.CurrencyPipe }, { type: HumanizeDurationPipe }, { type: i5.UpperCasePipe }, { type: DurationTimePipe }]; } });
314
+ }] });
453
315
 
454
316
  class PipesModule {
455
317
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: PipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
456
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.1", ngImport: i0, type: PipesModule, declarations: [DurationTimePipe,
457
- HumanizeDurationPipe,
458
- I18nFieldPipe,
459
- IdaReturnPipe,
460
- ResolvePropertyPath,
461
- ShowRolesPipe,
462
- ShowSegmentsPipe,
463
- ShowTransportTypesPipe], imports: [CurrencyPipe,
464
- UpperCasePipe], exports: [DurationTimePipe,
465
- HumanizeDurationPipe,
466
- I18nFieldPipe,
467
- IdaReturnPipe,
468
- ResolvePropertyPath,
469
- ShowRolesPipe,
470
- ShowSegmentsPipe,
471
- ShowTransportTypesPipe] }); }
318
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.1", ngImport: i0, type: PipesModule, declarations: [I18nFieldPipe,
319
+ ResolvePropertyPath], exports: [I18nFieldPipe,
320
+ ResolvePropertyPath] }); }
472
321
  static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: PipesModule, providers: [
473
- DurationTimePipe,
474
- HumanizeDurationPipe,
475
322
  I18nFieldPipe,
476
- IdaReturnPipe,
477
- ResolvePropertyPath,
478
- ShowRolesPipe,
479
- ShowSegmentsPipe,
480
- ShowTransportTypesPipe,
481
- CurrencyPipe,
482
- UpperCasePipe
323
+ ResolvePropertyPath
483
324
  ] }); }
484
325
  }
485
326
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: PipesModule, decorators: [{
486
327
  type: NgModule,
487
328
  args: [{
488
329
  declarations: [
489
- DurationTimePipe,
490
- HumanizeDurationPipe,
491
330
  I18nFieldPipe,
492
- IdaReturnPipe,
493
- ResolvePropertyPath,
494
- ShowRolesPipe,
495
- ShowSegmentsPipe,
496
- ShowTransportTypesPipe,
497
- ],
498
- imports: [
499
- CurrencyPipe,
500
- UpperCasePipe
331
+ ResolvePropertyPath
501
332
  ],
502
333
  exports: [
503
- DurationTimePipe,
504
- HumanizeDurationPipe,
505
334
  I18nFieldPipe,
506
- IdaReturnPipe,
507
- ResolvePropertyPath,
508
- ShowRolesPipe,
509
- ShowSegmentsPipe,
510
- ShowTransportTypesPipe
335
+ ResolvePropertyPath
511
336
  ],
512
337
  providers: [
513
- DurationTimePipe,
514
- HumanizeDurationPipe,
515
338
  I18nFieldPipe,
516
- IdaReturnPipe,
517
- ResolvePropertyPath,
518
- ShowRolesPipe,
519
- ShowSegmentsPipe,
520
- ShowTransportTypesPipe,
521
- CurrencyPipe,
522
- UpperCasePipe
339
+ ResolvePropertyPath
523
340
  ]
524
341
  }]
525
342
  }] });
@@ -535,7 +352,6 @@ class GuajiritosGeneralAutocomplete {
535
352
  this.selectedElement = signal(null);
536
353
  this._url = signal(null);
537
354
  this.restrictionsFilters = signal([]);
538
- this.validators = signal([]);
539
355
  this.disabledButton = signal(false);
540
356
  this.loading = signal(false);
541
357
  this.required = signal(false);
@@ -550,6 +366,7 @@ class GuajiritosGeneralAutocomplete {
550
366
  this.showLabel = true;
551
367
  this.appearance = 'outline';
552
368
  this.color = 'accent';
369
+ this.subscriptSizing = 'dynamic';
553
370
  this.placeholder = 'Seleccione un elemento';
554
371
  this.field = ['name'];
555
372
  this.filterString = 'filter[$and][name][$like]';
@@ -606,7 +423,7 @@ class GuajiritosGeneralAutocomplete {
606
423
  this.SelectElement.emit(null);
607
424
  this.filteredOptions.set([]);
608
425
  this.propagateChange(null);
609
- },
426
+ }
610
427
  });
611
428
  }
612
429
  }
@@ -658,24 +475,8 @@ class GuajiritosGeneralAutocomplete {
658
475
  this.inputText?.nativeElement?.focus();
659
476
  }, 500);
660
477
  });
661
- },
662
- });
663
- }
664
- }
665
- /**
666
- * Set custom validators for autocomplete
667
- *
668
- * @param validators - A list of customs validators
669
- */
670
- set customValidators(validators) {
671
- if (validators?.length) {
672
- validators.forEach((validator) => {
673
- this.component.addValidators(validator.validator);
478
+ }
674
479
  });
675
- this.validators.set(validators);
676
- }
677
- else {
678
- this.validators.set([]);
679
480
  }
680
481
  }
681
482
  /**
@@ -704,7 +505,7 @@ class GuajiritosGeneralAutocomplete {
704
505
  this.firstCall.set(false);
705
506
  }
706
507
  this.wasSelected.set(false);
707
- },
508
+ }
708
509
  });
709
510
  }
710
511
  /**
@@ -720,7 +521,7 @@ class GuajiritosGeneralAutocomplete {
720
521
  next: (result) => {
721
522
  this.filteredOptions.set(result?.payload?.data ?? result?.data);
722
523
  this.loading.set(false);
723
- },
524
+ }
724
525
  });
725
526
  });
726
527
  }
@@ -806,20 +607,17 @@ class GuajiritosGeneralAutocomplete {
806
607
  this.getAutocompleteByTextHandler(this.getAutocompleteSearchText());
807
608
  }
808
609
  }
809
- /**
810
- * Acción al seleccionar un elemento
811
- *
812
- * @param item - Elemento seleccionado
813
- */
814
- onSelectElement(item) {
815
- this.wasSelected.set(true);
816
- this.selectedElement.set(item);
817
- this.SelectElement.emit(item);
818
- if (this.valueId) {
819
- this.propagateChange(typeof item === 'object' ? item?.id : item);
820
- }
821
- else {
822
- this.propagateChange(item);
610
+ optionSelected($event) {
611
+ if ($event?.option?.value) {
612
+ this.wasSelected.set(true);
613
+ this.selectedElement.set($event.option.value);
614
+ this.SelectElement.emit($event.option.value);
615
+ if (this.valueId) {
616
+ this.propagateChange(typeof $event.option.value === 'object' ? $event.option.value?.id : $event.option.value);
617
+ }
618
+ else {
619
+ this.propagateChange($event.option.value);
620
+ }
823
621
  }
824
622
  }
825
623
  ngOnDestroy() {
@@ -827,13 +625,13 @@ class GuajiritosGeneralAutocomplete {
827
625
  this.unsubscribeAll$.complete();
828
626
  }
829
627
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: GuajiritosGeneralAutocomplete, deps: [{ token: AutocompleteService }, { token: i0.NgZone }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
830
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.1", type: GuajiritosGeneralAutocomplete, isStandalone: true, selector: "guajiritos-general-autocomplete", inputs: { floatLabel: "floatLabel", bodyRequest: "bodyRequest", debounceTimeValue: "debounceTimeValue", detailsTemplate: "detailsTemplate", label: "label", showLabel: "showLabel", appearance: "appearance", color: "color", placeholder: "placeholder", field: "field", filterString: "filterString", displayOptions: "displayOptions", withoutPaddingBottom: "withoutPaddingBottom", valueId: "valueId", showSuffix: "showSuffix", order: "order", suffixIcon: "suffixIcon", removeProperties: "removeProperties", url: "url", clearData: "clearData", initialValue: "initialValue", restrictions: "restrictions", isRequired: "isRequired", doFocus: "doFocus", customValidators: "customValidators" }, outputs: { SelectElement: "SelectElement" }, providers: [
628
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.1", type: GuajiritosGeneralAutocomplete, isStandalone: true, selector: "guajiritos-general-autocomplete", inputs: { floatLabel: "floatLabel", bodyRequest: "bodyRequest", debounceTimeValue: "debounceTimeValue", detailsTemplate: "detailsTemplate", label: "label", showLabel: "showLabel", appearance: "appearance", color: "color", subscriptSizing: "subscriptSizing", placeholder: "placeholder", field: "field", filterString: "filterString", displayOptions: "displayOptions", withoutPaddingBottom: "withoutPaddingBottom", valueId: "valueId", showSuffix: "showSuffix", order: "order", suffixIcon: "suffixIcon", removeProperties: "removeProperties", url: "url", clearData: "clearData", initialValue: "initialValue", restrictions: "restrictions", isRequired: "isRequired", doFocus: "doFocus" }, outputs: { SelectElement: "SelectElement" }, providers: [
831
629
  {
832
630
  provide: NG_VALUE_ACCESSOR,
833
631
  useExisting: forwardRef(() => GuajiritosGeneralAutocomplete),
834
- multi: true,
835
- },
836
- ], viewQueries: [{ propertyName: "inputText", first: true, predicate: ["inputText"], descendants: true, static: true }], ngImport: i0, template: "<mat-form-field [floatLabel]=\"floatLabel\" [ngClass]=\"{'without-padding-bottom': withoutPaddingBottom}\" class=\"w-100\"\r\n [appearance]=\"appearance\" [color]=\"color\">\r\n\r\n <mat-label *ngIf=\"showLabel\">{{label | translate}}</mat-label>\r\n <mat-icon matSuffix *ngIf=\"showSuffix\">{{suffixIcon ?? \"search\"}}</mat-icon>\r\n <input #inputText #trigger=\"matAutocompleteTrigger\" (focus)=\"onFocus()\" [formControl]=\"component\"\r\n [matAutocomplete]=\"autocomplete\" [placeholder]=\"placeholder | translate\" aria-label=\"autocomplete\"\r\n autocomplete=\"off\" matInput type=\"text\" [required]=\"required()\">\r\n <button (click)=\"clear(trigger)\" *ngIf=\"!loading() && component?.value\" [disabled]=\"disabledButton()\"\r\n aria-label=\"Clear\" mat-icon-button matSuffix>\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n <button *ngIf=\"loading()\" aria-label=\"search\" mat-icon-button matSuffix>\r\n <mat-spinner [value]=\"90\" color=\"accent\" diameter=\"25\"></mat-spinner>\r\n </button>\r\n <mat-autocomplete #autocomplete=\"matAutocomplete\" [displayWith]=\"displayFn\">\r\n <mat-option *ngFor=\"let option of filteredOptions()\" [value]=\"option\" (onSelectionChange)=\"onSelectElement(option)\">\r\n\r\n <ng-container *ngIf=\"!displayOptions && !detailsTemplate\">\r\n {{ option?.name | i18nField: translateService.currentLang }}\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!detailsTemplate\">\r\n <div class=\"display-options\">\r\n <span [ngStyle]=\"{'line-height': displayOptions?.secondLabel ? '16px' : ''}\">\r\n {{option | resolvePropertyPath:displayOptions.firthLabel | i18nField: translateService.currentLang}}\r\n </span>\r\n <span *ngIf=\"displayOptions?.secondLabel\" class=\"mat-caption\">\r\n {{option | resolvePropertyPath: displayOptions.secondLabel | i18nField: translateService.currentLang}}\r\n </span>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"detailsTemplate\">\r\n <ng-container *ngTemplateOutlet=\"detailsTemplate;context:{$implicit: option }\"></ng-container>\r\n </ng-container>\r\n </mat-option>\r\n </mat-autocomplete>\r\n\r\n <mat-error *ngIf=\"component.hasError('required')\">\r\n {{'Este campo es requerido.' | translate}}\r\n </mat-error>\r\n\r\n <mat-error *ngIf=\"component.hasError('invalidSelection')\">\r\n {{'Debe seleccionar un elemento.' | translate}}\r\n </mat-error>\r\n\r\n <ng-container *ngFor=\"let validator of validators()\">\r\n <mat-error *ngIf=\"component.hasError(validator.key)\">\r\n {{validator.message | translate}}\r\n </mat-error>\r\n </ng-container>\r\n</mat-form-field>\r\n", styles: [".w-100{width:100%}.display-options{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i4.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i5$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i4.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i7.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i10.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: PipesModule }, { kind: "pipe", type: I18nFieldPipe, name: "i18nField" }, { kind: "pipe", type: ResolvePropertyPath, name: "resolvePropertyPath" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
632
+ multi: true
633
+ }
634
+ ], viewQueries: [{ propertyName: "inputText", first: true, predicate: ["inputText"], descendants: true, static: true }], ngImport: i0, template: "<mat-form-field [floatLabel]=\"floatLabel\" class=\"w-100\" [appearance]=\"appearance\" [color]=\"color\"\r\n [subscriptSizing]=\"subscriptSizing\">\r\n\r\n <mat-label *ngIf=\"showLabel\">{{ label | translate }}</mat-label>\r\n <mat-icon matSuffix *ngIf=\"showSuffix\">{{ suffixIcon ?? \"search\" }}</mat-icon>\r\n <input #inputText #trigger=\"matAutocompleteTrigger\" (focus)=\"onFocus()\" [formControl]=\"component\"\r\n [matAutocomplete]=\"autocomplete\" [placeholder]=\"placeholder | translate\" aria-label=\"autocomplete\"\r\n autocomplete=\"off\" matInput type=\"text\" [required]=\"required()\">\r\n <button (click)=\"clear(trigger)\" *ngIf=\"!loading() && component?.value\" [disabled]=\"disabledButton()\"\r\n aria-label=\"Clear\" mat-icon-button matSuffix>\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n <button *ngIf=\"loading()\" aria-label=\"search\" mat-icon-button matSuffix>\r\n <mat-spinner [value]=\"90\" color=\"accent\" diameter=\"25\"></mat-spinner>\r\n </button>\r\n <mat-autocomplete #autocomplete=\"matAutocomplete\" [displayWith]=\"displayFn\" requireSelection\r\n (optionSelected)=\"optionSelected($event)\">\r\n <mat-option *ngFor=\"let option of filteredOptions()\" [value]=\"option\">\r\n\r\n <ng-container *ngIf=\"!displayOptions && !detailsTemplate\">\r\n {{ option?.name | i18nField: translateService.currentLang }}\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!detailsTemplate\">\r\n <div class=\"display-options\">\r\n <span [ngStyle]=\"{'line-height': displayOptions?.secondLabel ? '16px' : ''}\">\r\n {{ option | resolvePropertyPath:displayOptions.firthLabel | i18nField: translateService.currentLang }}\r\n </span>\r\n <span *ngIf=\"displayOptions?.secondLabel\" class=\"mat-caption\">\r\n {{ option | resolvePropertyPath: displayOptions.secondLabel | i18nField: translateService.currentLang }}\r\n </span>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"detailsTemplate\">\r\n <ng-container *ngTemplateOutlet=\"detailsTemplate;context:{$implicit: option }\"></ng-container>\r\n </ng-container>\r\n </mat-option>\r\n </mat-autocomplete>\r\n\r\n <mat-error *ngIf=\"component.invalid\">\r\n {{ 'Este campo es requerido.' | translate }}\r\n </mat-error>\r\n</mat-form-field>\r\n", styles: [".w-100{width:100%}.display-options{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i4.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i4.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i7.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i10.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: PipesModule }, { kind: "pipe", type: I18nFieldPipe, name: "i18nField" }, { kind: "pipe", type: ResolvePropertyPath, name: "resolvePropertyPath" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
837
635
  }
838
636
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: GuajiritosGeneralAutocomplete, decorators: [{
839
637
  type: Component,
@@ -851,14 +649,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
851
649
  NgForOf,
852
650
  NgStyle,
853
651
  PipesModule,
854
- NgTemplateOutlet,
652
+ NgTemplateOutlet
855
653
  ], providers: [
856
654
  {
857
655
  provide: NG_VALUE_ACCESSOR,
858
656
  useExisting: forwardRef(() => GuajiritosGeneralAutocomplete),
859
- multi: true,
860
- },
861
- ], template: "<mat-form-field [floatLabel]=\"floatLabel\" [ngClass]=\"{'without-padding-bottom': withoutPaddingBottom}\" class=\"w-100\"\r\n [appearance]=\"appearance\" [color]=\"color\">\r\n\r\n <mat-label *ngIf=\"showLabel\">{{label | translate}}</mat-label>\r\n <mat-icon matSuffix *ngIf=\"showSuffix\">{{suffixIcon ?? \"search\"}}</mat-icon>\r\n <input #inputText #trigger=\"matAutocompleteTrigger\" (focus)=\"onFocus()\" [formControl]=\"component\"\r\n [matAutocomplete]=\"autocomplete\" [placeholder]=\"placeholder | translate\" aria-label=\"autocomplete\"\r\n autocomplete=\"off\" matInput type=\"text\" [required]=\"required()\">\r\n <button (click)=\"clear(trigger)\" *ngIf=\"!loading() && component?.value\" [disabled]=\"disabledButton()\"\r\n aria-label=\"Clear\" mat-icon-button matSuffix>\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n <button *ngIf=\"loading()\" aria-label=\"search\" mat-icon-button matSuffix>\r\n <mat-spinner [value]=\"90\" color=\"accent\" diameter=\"25\"></mat-spinner>\r\n </button>\r\n <mat-autocomplete #autocomplete=\"matAutocomplete\" [displayWith]=\"displayFn\">\r\n <mat-option *ngFor=\"let option of filteredOptions()\" [value]=\"option\" (onSelectionChange)=\"onSelectElement(option)\">\r\n\r\n <ng-container *ngIf=\"!displayOptions && !detailsTemplate\">\r\n {{ option?.name | i18nField: translateService.currentLang }}\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!detailsTemplate\">\r\n <div class=\"display-options\">\r\n <span [ngStyle]=\"{'line-height': displayOptions?.secondLabel ? '16px' : ''}\">\r\n {{option | resolvePropertyPath:displayOptions.firthLabel | i18nField: translateService.currentLang}}\r\n </span>\r\n <span *ngIf=\"displayOptions?.secondLabel\" class=\"mat-caption\">\r\n {{option | resolvePropertyPath: displayOptions.secondLabel | i18nField: translateService.currentLang}}\r\n </span>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"detailsTemplate\">\r\n <ng-container *ngTemplateOutlet=\"detailsTemplate;context:{$implicit: option }\"></ng-container>\r\n </ng-container>\r\n </mat-option>\r\n </mat-autocomplete>\r\n\r\n <mat-error *ngIf=\"component.hasError('required')\">\r\n {{'Este campo es requerido.' | translate}}\r\n </mat-error>\r\n\r\n <mat-error *ngIf=\"component.hasError('invalidSelection')\">\r\n {{'Debe seleccionar un elemento.' | translate}}\r\n </mat-error>\r\n\r\n <ng-container *ngFor=\"let validator of validators()\">\r\n <mat-error *ngIf=\"component.hasError(validator.key)\">\r\n {{validator.message | translate}}\r\n </mat-error>\r\n </ng-container>\r\n</mat-form-field>\r\n", styles: [".w-100{width:100%}.display-options{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}\n"] }]
657
+ multi: true
658
+ }
659
+ ], template: "<mat-form-field [floatLabel]=\"floatLabel\" class=\"w-100\" [appearance]=\"appearance\" [color]=\"color\"\r\n [subscriptSizing]=\"subscriptSizing\">\r\n\r\n <mat-label *ngIf=\"showLabel\">{{ label | translate }}</mat-label>\r\n <mat-icon matSuffix *ngIf=\"showSuffix\">{{ suffixIcon ?? \"search\" }}</mat-icon>\r\n <input #inputText #trigger=\"matAutocompleteTrigger\" (focus)=\"onFocus()\" [formControl]=\"component\"\r\n [matAutocomplete]=\"autocomplete\" [placeholder]=\"placeholder | translate\" aria-label=\"autocomplete\"\r\n autocomplete=\"off\" matInput type=\"text\" [required]=\"required()\">\r\n <button (click)=\"clear(trigger)\" *ngIf=\"!loading() && component?.value\" [disabled]=\"disabledButton()\"\r\n aria-label=\"Clear\" mat-icon-button matSuffix>\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n <button *ngIf=\"loading()\" aria-label=\"search\" mat-icon-button matSuffix>\r\n <mat-spinner [value]=\"90\" color=\"accent\" diameter=\"25\"></mat-spinner>\r\n </button>\r\n <mat-autocomplete #autocomplete=\"matAutocomplete\" [displayWith]=\"displayFn\" requireSelection\r\n (optionSelected)=\"optionSelected($event)\">\r\n <mat-option *ngFor=\"let option of filteredOptions()\" [value]=\"option\">\r\n\r\n <ng-container *ngIf=\"!displayOptions && !detailsTemplate\">\r\n {{ option?.name | i18nField: translateService.currentLang }}\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!detailsTemplate\">\r\n <div class=\"display-options\">\r\n <span [ngStyle]=\"{'line-height': displayOptions?.secondLabel ? '16px' : ''}\">\r\n {{ option | resolvePropertyPath:displayOptions.firthLabel | i18nField: translateService.currentLang }}\r\n </span>\r\n <span *ngIf=\"displayOptions?.secondLabel\" class=\"mat-caption\">\r\n {{ option | resolvePropertyPath: displayOptions.secondLabel | i18nField: translateService.currentLang }}\r\n </span>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"detailsTemplate\">\r\n <ng-container *ngTemplateOutlet=\"detailsTemplate;context:{$implicit: option }\"></ng-container>\r\n </ng-container>\r\n </mat-option>\r\n </mat-autocomplete>\r\n\r\n <mat-error *ngIf=\"component.invalid\">\r\n {{ 'Este campo es requerido.' | translate }}\r\n </mat-error>\r\n</mat-form-field>\r\n", styles: [".w-100{width:100%}.display-options{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}\n"] }]
862
660
  }], ctorParameters: function () { return [{ type: AutocompleteService }, { type: i0.NgZone }, { type: i2.TranslateService }]; }, propDecorators: { inputText: [{
863
661
  type: ViewChild,
864
662
  args: ['inputText', { static: true }]
@@ -878,6 +676,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
878
676
  type: Input
879
677
  }], color: [{
880
678
  type: Input
679
+ }], subscriptSizing: [{
680
+ type: Input
881
681
  }], placeholder: [{
882
682
  type: Input
883
683
  }], field: [{
@@ -912,8 +712,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
912
712
  type: Input
913
713
  }], doFocus: [{
914
714
  type: Input
915
- }], customValidators: [{
916
- type: Input
917
715
  }] } });
918
716
 
919
717
  /*
@@ -924,5 +722,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
924
722
  * Generated bundle index. Do not edit.
925
723
  */
926
724
 
927
- export { CustomPipes, GENERAL_DISPLAY_OPTIONS, GuajiritosGeneralAutocomplete };
725
+ export { GENERAL_DISPLAY_OPTIONS, GuajiritosGeneralAutocomplete };
928
726
  //# sourceMappingURL=guajiritos-general-autocomplete.mjs.map