@kms-ngx-ui/presentational 20.0.1 → 20.0.3

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.
@@ -1,9 +1,9 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Component, Pipe, NgModule, EventEmitter, Output, Input, Directive, HostListener, PLATFORM_ID, DOCUMENT, Inject, Injectable, input, VERSION, forwardRef, ViewChild, HostBinding, output, computed, model, signal, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
2
+ import { Component, Pipe, NgModule, EventEmitter, Output, Input, Directive, HostListener, PLATFORM_ID, DOCUMENT, Inject, Injectable, input, VERSION, forwardRef, inject, Injector, ViewChild, effect, HostBinding, output, computed, model, signal, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
3
3
  import * as i1 from '@angular/common';
4
4
  import { CommonModule, CurrencyPipe, isPlatformBrowser } from '@angular/common';
5
5
  import * as i2 from '@angular/forms';
6
- import { NG_VALUE_ACCESSOR, UntypedFormGroup, UntypedFormControl, NG_VALIDATORS, FormsModule, ReactiveFormsModule } from '@angular/forms';
6
+ import { NG_VALUE_ACCESSOR, NgControl, UntypedFormGroup, UntypedFormControl, NG_VALIDATORS, FormsModule, ReactiveFormsModule } from '@angular/forms';
7
7
  import * as i1$2 from '@angular/material/checkbox';
8
8
  import { MatCheckboxModule } from '@angular/material/checkbox';
9
9
  import * as i1$6 from '@angular/material/radio';
@@ -1329,12 +1329,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
1329
1329
  }] } });
1330
1330
 
1331
1331
  class FormControlParentComponent extends FormParentComponent {
1332
+ get ngControl() {
1333
+ if (this._ngControl === undefined) {
1334
+ this._ngControl = this.injector.get(NgControl, null);
1335
+ }
1336
+ return this._ngControl;
1337
+ }
1332
1338
  constructor(renderer) {
1333
1339
  super();
1334
1340
  this.renderer = renderer;
1335
1341
  this.defaultDataOverride = ''; // when we have NO form around, get default via input to set it manually
1336
1342
  this.onSelectItemEmitter = new EventEmitter();
1337
1343
  this.internalValue = '';
1344
+ this.injector = inject(Injector);
1345
+ this._ngControl = undefined;
1338
1346
  // eslint-disable-next-line @typescript-eslint/no-empty-function
1339
1347
  this.onChange = () => { };
1340
1348
  // eslint-disable-next-line @typescript-eslint/no-empty-function
@@ -1345,6 +1353,11 @@ class FormControlParentComponent extends FormParentComponent {
1345
1353
  ngOnInit() {
1346
1354
  super.ngOnInit();
1347
1355
  }
1356
+ ngDoCheck() {
1357
+ if (this.ngControl?.control?.touched) {
1358
+ this.form?.markAllAsTouched();
1359
+ }
1360
+ }
1348
1361
  change(value) {
1349
1362
  this.onChange(value);
1350
1363
  this.onTouched();
@@ -1413,29 +1426,42 @@ class DropdownFromDataComponent extends FormControlParentComponent {
1413
1426
  constructor(renderer) {
1414
1427
  super(renderer);
1415
1428
  this.renderer = renderer;
1429
+ // structured data as a enum set. Can be used in combination with 'optionsPlainArray' to set diferent values by index
1430
+ this.optionsEnum = input(...(ngDevMode ? [undefined, { debugName: "optionsEnum" }] : []));
1431
+ // structured data as a simple array of elements
1432
+ this.optionsPlainArray = input(...(ngDevMode ? [undefined, { debugName: "optionsPlainArray" }] : []));
1433
+ // structured data as an array of objects used in combination with the input 'mapKey' and 'mapValue'
1434
+ this.optionsObjArray = input(...(ngDevMode ? [undefined, { debugName: "optionsObjArray" }] : []));
1435
+ // key identifier of the obj. If mapValue doesnt exist, mapKey is also the value
1436
+ this.mapKey = input(...(ngDevMode ? [undefined, { debugName: "mapKey" }] : []));
1437
+ // value identifier of the obj
1438
+ this.mapValue = input(...(ngDevMode ? [undefined, { debugName: "mapValue" }] : []));
1416
1439
  // options for the dropdown have a null value at the beginning of the array
1417
- this.hasNullOption = false;
1418
- this.placeholder = '';
1419
- this.label = '';
1420
- this.required = false;
1421
- this.useEnumIndexAsValue = false;
1440
+ this.hasNullOption = input(false, ...(ngDevMode ? [{ debugName: "hasNullOption" }] : []));
1441
+ // preselected keys of the dropdown
1442
+ this.preselectedKeys = input(...(ngDevMode ? [undefined, { debugName: "preselectedKeys" }] : []));
1443
+ // translation object for the label and placeholder
1444
+ this.translation = input(...(ngDevMode ? [undefined, { debugName: "translation" }] : []));
1445
+ this.placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
1446
+ this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
1447
+ this.required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
1448
+ this.useEnumIndexAsValue = input(false, ...(ngDevMode ? [{ debugName: "useEnumIndexAsValue" }] : []));
1422
1449
  // multiple selection
1423
- this.multiple = false;
1424
- this.disableOptions = false;
1450
+ this.multiple = input(false, ...(ngDevMode ? [{ debugName: "multiple" }] : []));
1451
+ this.selectAllText = input(...(ngDevMode ? [undefined, { debugName: "selectAllText" }] : []));
1452
+ this.disableOptions = input(false, ...(ngDevMode ? [{ debugName: "disableOptions" }] : []));
1453
+ this.errorMessage = input('', ...(ngDevMode ? [{ debugName: "errorMessage" }] : []));
1425
1454
  this.keys = [];
1426
1455
  this.values = [];
1427
- this.Object = Object;
1428
- }
1429
- /**
1430
- * Hook used to sync changes on set Label and Type
1431
- * @param changes
1432
- */
1433
- ngOnChanges(changes) {
1434
- if (changes.optionsPlainArray) {
1435
- this.values = this.optionsPlainArray;
1436
- this.keys = this.optionsPlainArray;
1437
- }
1438
- this.setKeyValues();
1456
+ // Effect to react to input changes (replaces ngOnChanges)
1457
+ effect(() => {
1458
+ const plainArray = this.optionsPlainArray();
1459
+ if (plainArray) {
1460
+ this.values = plainArray;
1461
+ this.keys = plainArray;
1462
+ }
1463
+ this.setKeyValues();
1464
+ });
1439
1465
  }
1440
1466
  ngOnInit() {
1441
1467
  this.form = new UntypedFormGroup({
@@ -1446,9 +1472,10 @@ class DropdownFromDataComponent extends FormControlParentComponent {
1446
1472
  this.internalValue = value.dropdownData;
1447
1473
  this.onChange(value.dropdownData);
1448
1474
  });
1449
- if (this.preselectedKeys)
1475
+ const preselected = this.preselectedKeys();
1476
+ if (preselected)
1450
1477
  this.form.patchValue({
1451
- dropdownData: this.preselectedKeys,
1478
+ dropdownData: preselected,
1452
1479
  });
1453
1480
  super.ngOnInit();
1454
1481
  }
@@ -1457,20 +1484,27 @@ class DropdownFromDataComponent extends FormControlParentComponent {
1457
1484
  * @param value
1458
1485
  */
1459
1486
  setKeyValues() {
1460
- if (this.optionsObjArray && this.mapKey && this.mapValue) {
1461
- this.keys = this.optionsObjArray.map((obj) => obj[`${this.mapKey}`]);
1462
- this.values = this.optionsObjArray.map((obj) => obj[`${this.mapValue}`]);
1463
- }
1464
- else if (this.optionsObjArray && this.mapKey) {
1465
- this.keys = this.optionsObjArray.map((obj) => obj[`${this.mapKey}`]);
1466
- this.values = this.optionsObjArray.map((obj) => obj[`${this.mapKey}`]);
1467
- }
1468
- if (this.optionsEnum) {
1469
- const enumObj = this.optionsEnum;
1487
+ const optionsObjArrayValue = this.optionsObjArray();
1488
+ const mapKeyValue = this.mapKey();
1489
+ const mapValueValue = this.mapValue();
1490
+ const optionsEnumValue = this.optionsEnum();
1491
+ const optionsPlainArrayValue = this.optionsPlainArray();
1492
+ const useEnumIndexAsValueValue = this.useEnumIndexAsValue();
1493
+ const hasNullOptionValue = this.hasNullOption();
1494
+ if (optionsObjArrayValue && mapKeyValue && mapValueValue) {
1495
+ this.keys = optionsObjArrayValue.map((obj) => obj[`${mapKeyValue}`]);
1496
+ this.values = optionsObjArrayValue.map((obj) => obj[`${mapValueValue}`]);
1497
+ }
1498
+ else if (optionsObjArrayValue && mapKeyValue) {
1499
+ this.keys = optionsObjArrayValue.map((obj) => obj[`${mapKeyValue}`]);
1500
+ this.values = optionsObjArrayValue.map((obj) => obj[`${mapKeyValue}`]);
1501
+ }
1502
+ if (optionsEnumValue) {
1503
+ const enumObj = optionsEnumValue;
1470
1504
  // Get enum keys (excluding reverse mappings for numeric enums)
1471
1505
  this.keys = Object.keys(enumObj).filter((k) => isNaN(Number(k)));
1472
- if (this.optionsPlainArray) {
1473
- this.values = this.optionsPlainArray;
1506
+ if (optionsPlainArrayValue) {
1507
+ this.values = optionsPlainArrayValue;
1474
1508
  }
1475
1509
  else {
1476
1510
  const values = this.keys.map((k) => enumObj[k]);
@@ -1481,7 +1515,7 @@ class DropdownFromDataComponent extends FormControlParentComponent {
1481
1515
  break;
1482
1516
  }
1483
1517
  }
1484
- if (keyValueEnum || this.useEnumIndexAsValue) {
1518
+ if (keyValueEnum || useEnumIndexAsValueValue) {
1485
1519
  this.values = values;
1486
1520
  }
1487
1521
  else {
@@ -1489,7 +1523,7 @@ class DropdownFromDataComponent extends FormControlParentComponent {
1489
1523
  }
1490
1524
  }
1491
1525
  }
1492
- if (this.hasNullOption === true) {
1526
+ if (hasNullOptionValue === true) {
1493
1527
  this.keys.unshift(null);
1494
1528
  this.values.unshift(null);
1495
1529
  }
@@ -1499,17 +1533,18 @@ class DropdownFromDataComponent extends FormControlParentComponent {
1499
1533
  * @param key
1500
1534
  */
1501
1535
  setDisplayKey(key) {
1502
- if (this.translation) {
1503
- if (this.translation.isPrefix) {
1504
- return this.translation.service?.instant?.(this.translation.path + '.' + key);
1536
+ const translationValue = this.translation();
1537
+ if (translationValue) {
1538
+ if (translationValue.isPrefix) {
1539
+ return translationValue.service?.instant?.(translationValue.path + '.' + key);
1505
1540
  }
1506
- else if (this.translation.useKeyAsValue) {
1507
- return this.translation.service?.instant?.(this.translation.path, {
1541
+ else if (translationValue.useKeyAsValue) {
1542
+ return translationValue.service?.instant?.(translationValue.path, {
1508
1543
  key: key,
1509
1544
  });
1510
1545
  }
1511
1546
  else {
1512
- return this.translation.service?.instant?.(this.translation.path);
1547
+ return translationValue.service?.instant?.(translationValue.path);
1513
1548
  }
1514
1549
  }
1515
1550
  return key;
@@ -1548,13 +1583,13 @@ class DropdownFromDataComponent extends FormControlParentComponent {
1548
1583
  }
1549
1584
  }
1550
1585
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DropdownFromDataComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
1551
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DropdownFromDataComponent, isStandalone: false, selector: "kms-dropdown-from-data", inputs: { optionsEnum: "optionsEnum", optionsPlainArray: "optionsPlainArray", optionsObjArray: "optionsObjArray", mapKey: "mapKey", mapValue: "mapValue", hasNullOption: "hasNullOption", preselectedKeys: "preselectedKeys", translation: "translation", placeholder: "placeholder", label: "label", required: "required", useEnumIndexAsValue: "useEnumIndexAsValue", multiple: "multiple", selectAllText: "selectAllText", disableOptions: "disableOptions" }, providers: [
1586
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DropdownFromDataComponent, isStandalone: false, selector: "kms-dropdown-from-data", inputs: { optionsEnum: { classPropertyName: "optionsEnum", publicName: "optionsEnum", isSignal: true, isRequired: false, transformFunction: null }, optionsPlainArray: { classPropertyName: "optionsPlainArray", publicName: "optionsPlainArray", isSignal: true, isRequired: false, transformFunction: null }, optionsObjArray: { classPropertyName: "optionsObjArray", publicName: "optionsObjArray", isSignal: true, isRequired: false, transformFunction: null }, mapKey: { classPropertyName: "mapKey", publicName: "mapKey", isSignal: true, isRequired: false, transformFunction: null }, mapValue: { classPropertyName: "mapValue", publicName: "mapValue", isSignal: true, isRequired: false, transformFunction: null }, hasNullOption: { classPropertyName: "hasNullOption", publicName: "hasNullOption", isSignal: true, isRequired: false, transformFunction: null }, preselectedKeys: { classPropertyName: "preselectedKeys", publicName: "preselectedKeys", isSignal: true, isRequired: false, transformFunction: null }, translation: { classPropertyName: "translation", publicName: "translation", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, useEnumIndexAsValue: { classPropertyName: "useEnumIndexAsValue", publicName: "useEnumIndexAsValue", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, selectAllText: { classPropertyName: "selectAllText", publicName: "selectAllText", isSignal: true, isRequired: false, transformFunction: null }, disableOptions: { classPropertyName: "disableOptions", publicName: "disableOptions", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
1552
1587
  {
1553
1588
  provide: NG_VALUE_ACCESSOR,
1554
1589
  useExisting: forwardRef(() => DropdownFromDataComponent),
1555
1590
  multi: true,
1556
1591
  },
1557
- ], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n <mat-form-field\n [attr.required]=\"required\"\n [floatLabel]=\"placeholder ? 'always' : 'auto'\"\n >\n <mat-label>{{ label }}</mat-label>\n <mat-select\n [placeholder]=\"placeholder\"\n disableOptionCentering\n (selectionChange)=\"valueChanged($event?.value)\"\n [value]=\"value\"\n #child\n [disabled]=\"disabled\"\n [multiple]=\"multiple\"\n >\n @if (selectAllText && !disableOptions) {\n <mat-checkbox\n color=\"accent\"\n class=\"dropdown-from-data__checkbox\"\n [indeterminate]=\"isCheckboxIndeterminate()\"\n [checked]=\"allElementsChecked()\"\n (click)=\"$event.stopPropagation()\"\n (change)=\"toggleAllSelection($event)\"\n >\n {{ selectAllText }}\n </mat-checkbox>\n }\n @for (key of keys; track key; let i = $index) {\n <mat-option\n [value]=\"values[i]\"\n [disabled]=\"disableOptions\"\n >\n {{ setDisplayKey(key) || '\u2014' }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n</form>\n", dependencies: [{ kind: "component", type: i1$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i1$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$3.MatLabel, selector: "mat-label" }, { kind: "component", type: i3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }] }); }
1592
+ ], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n <mat-form-field\n [attr.required]=\"required()\"\n [floatLabel]=\"placeholder() ? 'always' : 'auto'\"\n >\n <mat-label>{{ label() }}</mat-label>\n <mat-select\n [placeholder]=\"placeholder()\"\n disableOptionCentering\n (selectionChange)=\"valueChanged($event?.value)\"\n [value]=\"value\"\n #child\n [disabled]=\"disabled\"\n [multiple]=\"multiple()\"\n [required]=\"required()\"\n formControlName=\"dropdownData\"\n >\n @if (selectAllText() && multiple() && !disableOptions()) {\n <mat-checkbox\n color=\"accent\"\n class=\"dropdown-from-data__checkbox\"\n [indeterminate]=\"isCheckboxIndeterminate()\"\n [checked]=\"allElementsChecked()\"\n (click)=\"$event.stopPropagation()\"\n (change)=\"toggleAllSelection($event)\"\n >\n {{ selectAllText() }}\n </mat-checkbox>\n } @for (key of keys; track key; let i = $index) {\n <mat-option [value]=\"values[i]\" [disabled]=\"disableOptions()\">\n {{ setDisplayKey(key) || '\u2014' }}\n </mat-option>\n }\n </mat-select>\n @if (errorMessage()) {\n <mat-error>{{ errorMessage() }}</mat-error>\n }\n </mat-form-field>\n</form>\n", dependencies: [{ kind: "component", type: i1$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i1$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }] }); }
1558
1593
  }
1559
1594
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DropdownFromDataComponent, decorators: [{
1560
1595
  type: Component,
@@ -1564,38 +1599,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
1564
1599
  useExisting: forwardRef(() => DropdownFromDataComponent),
1565
1600
  multi: true,
1566
1601
  },
1567
- ], standalone: false, template: "<form [formGroup]=\"form\">\n <mat-form-field\n [attr.required]=\"required\"\n [floatLabel]=\"placeholder ? 'always' : 'auto'\"\n >\n <mat-label>{{ label }}</mat-label>\n <mat-select\n [placeholder]=\"placeholder\"\n disableOptionCentering\n (selectionChange)=\"valueChanged($event?.value)\"\n [value]=\"value\"\n #child\n [disabled]=\"disabled\"\n [multiple]=\"multiple\"\n >\n @if (selectAllText && !disableOptions) {\n <mat-checkbox\n color=\"accent\"\n class=\"dropdown-from-data__checkbox\"\n [indeterminate]=\"isCheckboxIndeterminate()\"\n [checked]=\"allElementsChecked()\"\n (click)=\"$event.stopPropagation()\"\n (change)=\"toggleAllSelection($event)\"\n >\n {{ selectAllText }}\n </mat-checkbox>\n }\n @for (key of keys; track key; let i = $index) {\n <mat-option\n [value]=\"values[i]\"\n [disabled]=\"disableOptions\"\n >\n {{ setDisplayKey(key) || '\u2014' }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n</form>\n" }]
1568
- }], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { optionsEnum: [{
1569
- type: Input
1570
- }], optionsPlainArray: [{
1571
- type: Input
1572
- }], optionsObjArray: [{
1573
- type: Input
1574
- }], mapKey: [{
1575
- type: Input
1576
- }], mapValue: [{
1577
- type: Input
1578
- }], hasNullOption: [{
1579
- type: Input
1580
- }], preselectedKeys: [{
1581
- type: Input
1582
- }], translation: [{
1583
- type: Input
1584
- }], placeholder: [{
1585
- type: Input
1586
- }], label: [{
1587
- type: Input
1588
- }], required: [{
1589
- type: Input
1590
- }], useEnumIndexAsValue: [{
1591
- type: Input
1592
- }], multiple: [{
1593
- type: Input
1594
- }], selectAllText: [{
1595
- type: Input
1596
- }], disableOptions: [{
1597
- type: Input
1598
- }] } });
1602
+ ], standalone: false, template: "<form [formGroup]=\"form\">\n <mat-form-field\n [attr.required]=\"required()\"\n [floatLabel]=\"placeholder() ? 'always' : 'auto'\"\n >\n <mat-label>{{ label() }}</mat-label>\n <mat-select\n [placeholder]=\"placeholder()\"\n disableOptionCentering\n (selectionChange)=\"valueChanged($event?.value)\"\n [value]=\"value\"\n #child\n [disabled]=\"disabled\"\n [multiple]=\"multiple()\"\n [required]=\"required()\"\n formControlName=\"dropdownData\"\n >\n @if (selectAllText() && multiple() && !disableOptions()) {\n <mat-checkbox\n color=\"accent\"\n class=\"dropdown-from-data__checkbox\"\n [indeterminate]=\"isCheckboxIndeterminate()\"\n [checked]=\"allElementsChecked()\"\n (click)=\"$event.stopPropagation()\"\n (change)=\"toggleAllSelection($event)\"\n >\n {{ selectAllText() }}\n </mat-checkbox>\n } @for (key of keys; track key; let i = $index) {\n <mat-option [value]=\"values[i]\" [disabled]=\"disableOptions()\">\n {{ setDisplayKey(key) || '\u2014' }}\n </mat-option>\n }\n </mat-select>\n @if (errorMessage()) {\n <mat-error>{{ errorMessage() }}</mat-error>\n }\n </mat-form-field>\n</form>\n" }]
1603
+ }], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { optionsEnum: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionsEnum", required: false }] }], optionsPlainArray: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionsPlainArray", required: false }] }], optionsObjArray: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionsObjArray", required: false }] }], mapKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "mapKey", required: false }] }], mapValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "mapValue", required: false }] }], hasNullOption: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasNullOption", required: false }] }], preselectedKeys: [{ type: i0.Input, args: [{ isSignal: true, alias: "preselectedKeys", required: false }] }], translation: [{ type: i0.Input, args: [{ isSignal: true, alias: "translation", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], useEnumIndexAsValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "useEnumIndexAsValue", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], selectAllText: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectAllText", required: false }] }], disableOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableOptions", required: false }] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }] } });
1599
1604
 
1600
1605
  class LoaderComponent {
1601
1606
  constructor() {