@alfresco/adf-core 8.1.0-16261404664 → 8.1.0-16265121111
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/fesm2022/adf-core.mjs
CHANGED
|
@@ -18677,7 +18677,7 @@ class CardViewSelectItemComponent extends BaseCardView {
|
|
|
18677
18677
|
return this.appConfig.get('content-metadata.selectFilterLimit', CardViewSelectItemComponent.HIDE_FILTER_LIMIT);
|
|
18678
18678
|
}
|
|
18679
18679
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CardViewSelectItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
18680
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: CardViewSelectItemComponent, isStandalone: true, selector: "adf-card-view-selectitem", inputs: { options$: "options$", displayNoneOption: "displayNoneOption", displayEmpty: "displayEmpty" }, host: { classAttribute: "adf-card-view-selectitem" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!property.isEmpty() || isEditable\">\n <div [ngSwitch]=\"templateType\">\n <div *ngSwitchDefault>\n <div *ngIf=\"!isEditable\"\n [attr.data-automation-id]=\"'card-select-label-' + property.key\"\n class=\"adf-property-label adf-property-label-non-editable\"\n >{{ property.label | translate }}\n </div>\n <div class=\"adf-property-field\">\n <div\n *ngIf=\"!isEditable\"\n class=\"adf-property-value adf-property-read-only\"\n [attr.data-automation-id]=\"'select-readonly-value-' + property.key\"\n data-automation-class=\"read-only-value\"\n [title]=\"property.displayValue | async | translate\"\n >\n {{ property.displayValue | async | translate }}\n </div>\n <div *ngIf=\"isEditable\">\n <mat-form-field class=\"adf-property-value\">\n <mat-label\n [attr.data-automation-id]=\"'card-select-label-' + property.key\"\n class=\"adf-property-label adf-property-value-editable\"\n [ngClass]=\"{\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n >{{ property.label | translate }}\n </mat-label>\n <mat-select\n [(value)]=\"value\"\n [ngClass]=\"{ 'adf-property-readonly-value': isReadonlyProperty }\"\n panelClass=\"adf-select-filter\"\n (selectionChange)=\"onChange($event)\"\n data-automation-class=\"select-box\"\n [aria-label]=\"property.label | translate\"\n >\n <adf-select-filter-input *ngIf=\"showInputFilter\" (change)=\"onFilterInputChange($event)\" />\n <mat-option *ngIf=\"displayNoneOption\">{{ 'CORE.CARDVIEW.NONE' | translate }}</mat-option>\n <mat-option *ngFor=\"let option of list$ | async\" [value]=\"option.key\">\n {{ option.label | translate }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n </div>\n <div *ngSwitchCase=\"'autocompleteBased'\">\n <mat-form-field\n class=\"adf-property-field adf-card-selectitem-autocomplete \"\n [ngClass]=\"{ 'adf-property-read-only': !isEditable }\"\n [floatLabel]=\"property.default ? 'always' : null\"\n >\n <mat-label\n *ngIf=\"showProperty || isEditable\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-label-' + property.key\"\n class=\"adf-property-label\"\n [ngClass]=\"{\n 'adf-property-value-editable': isEditable,\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n >\n {{ property.label | translate }}\n </mat-label>\n <input\n matInput\n [matAutocomplete]=\"auto\"\n class=\"adf-property-value\"\n [ngClass]=\"{\n 'adf-property-value-editable': isEditable,\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n title=\"{{ property.label | translate }}\"\n [placeholder]=\"property.default\"\n [attr.aria-label]=\"property.label | translate\"\n [formControl]=\"autocompleteControl\"\n [title]=\"'CORE.METADATA.ACTIONS.COPY_TO_CLIPBOARD' | translate\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-value-' + property.key\"\n />\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onOptionSelected($event)\">\n <mat-option\n *ngFor=\"let option of property.options$ | async\"\n [value]=\"option.key\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-option-' + property.key\"\n >\n {{ option.label }}\n </mat-option>\n </mat-autocomplete>\n </mat-form-field>\n </div>\n </div>\n</ng-container>\n", styles: [".adf-card-view-selectitem .adf-property-value{width:100%}.adf-card-view-selectitem .adf-select-filter-input{background:var(--adf-theme-background-card-color);position:sticky;top:0;left:0;right:0;z-index:1}.adf-card-view-selectitem .adf-property-value-editable{padding-left:0}.adf-card-view-selectitem .adf-property-value-editable .mdc-text-field--no-label .mat-mdc-form-field-infix{padding:0}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-text-field-wrapper{background-color:unset}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select{margin-top:0;border-radius:6px}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select .mat-mdc-select-value{color:var(--adf-metadata-action-button-clear-color)}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select .mat-mdc-select-trigger{padding-left:6px;padding-right:6px}.adf-card-view-selectitem .adf-card-selectitem-autocomplete .adf-property-value-editable{padding-left:10px}.adf-card-view-selectitem .mat-mdc-form-field-subscript-wrapper{display:none}.adf-card-view-selectitem .adf-property-read-only{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;cursor:default;padding:6px 0;border-bottom:1px solid var(--adf-metadata-property-panel-border-color)}.adf-card-view-selectitem .mdc-line-ripple{display:none}.adf-card-view-selectitem .adf-property-readonly-value{color:var(--adf-metadata-property-panel-label-color)}.adf-card-view-selectitem .adf-property-label-non-editable{cursor:default;font-size:10px}.adf-card-view-selectitem .mat-mdc-form-field-infix{padding-left:3%;padding-right:3%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$5.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i3$3.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$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: SelectFilterInputComponent, selector: "adf-select-filter-input", outputs: ["change"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i4$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
18680
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: CardViewSelectItemComponent, isStandalone: true, selector: "adf-card-view-selectitem", inputs: { options$: "options$", displayNoneOption: "displayNoneOption", displayEmpty: "displayEmpty" }, host: { classAttribute: "adf-card-view-selectitem" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!property.isEmpty() || isEditable\">\n <div [ngSwitch]=\"templateType\">\n <div *ngSwitchDefault>\n <div *ngIf=\"!isEditable\"\n [attr.data-automation-id]=\"'card-select-label-' + property.key\"\n class=\"adf-property-label adf-property-label-non-editable\"\n >{{ property.label | translate }}\n </div>\n <div class=\"adf-property-field\">\n <div\n *ngIf=\"!isEditable\"\n class=\"adf-property-value adf-property-read-only\"\n [attr.data-automation-id]=\"'select-readonly-value-' + property.key\"\n data-automation-class=\"read-only-value\"\n [title]=\"property.displayValue | async | translate\"\n >\n {{ property.displayValue | async | translate }}\n </div>\n <div *ngIf=\"isEditable\">\n <mat-form-field class=\"adf-property-value\">\n <mat-label\n [attr.data-automation-id]=\"'card-select-label-' + property.key\"\n class=\"adf-property-label adf-property-value-editable\"\n [ngClass]=\"{\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n >{{ property.label | translate }}\n </mat-label>\n <mat-select\n [(value)]=\"value\"\n [ngClass]=\"{ 'adf-property-readonly-value': isReadonlyProperty }\"\n panelClass=\"adf-select-filter\"\n (selectionChange)=\"onChange($event)\"\n data-automation-class=\"select-box\"\n [aria-label]=\"property.label | translate\"\n >\n <adf-select-filter-input *ngIf=\"showInputFilter\" (change)=\"onFilterInputChange($event)\" />\n <mat-option *ngIf=\"displayNoneOption\">{{ 'CORE.CARDVIEW.NONE' | translate }}</mat-option>\n <mat-option *ngFor=\"let option of list$ | async\" [value]=\"option.key\">\n {{ option.label | translate }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n </div>\n <div *ngSwitchCase=\"'autocompleteBased'\">\n <mat-form-field\n class=\"adf-property-field adf-card-selectitem-autocomplete \"\n [ngClass]=\"{ 'adf-property-read-only': !isEditable }\"\n [floatLabel]=\"property.default ? 'always' : null\"\n >\n <mat-label\n *ngIf=\"showProperty || isEditable\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-label-' + property.key\"\n class=\"adf-property-label\"\n [ngClass]=\"{\n 'adf-property-value-editable': isEditable,\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n >\n {{ property.label | translate }}\n </mat-label>\n <input\n matInput\n [matAutocomplete]=\"auto\"\n class=\"adf-property-value\"\n [ngClass]=\"{\n 'adf-property-value-editable': isEditable,\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n title=\"{{ property.label | translate }}\"\n [placeholder]=\"property.default\"\n [attr.aria-label]=\"property.label | translate\"\n [formControl]=\"autocompleteControl\"\n [title]=\"'CORE.METADATA.ACTIONS.COPY_TO_CLIPBOARD' | translate\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-value-' + property.key\"\n />\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onOptionSelected($event)\">\n <mat-option\n *ngFor=\"let option of property.options$ | async\"\n [value]=\"option.key\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-option-' + property.key\"\n >\n {{ option.label }}\n </mat-option>\n </mat-autocomplete>\n </mat-form-field>\n </div>\n </div>\n</ng-container>\n", styles: [".adf-card-view-selectitem .adf-property-value{width:100%}.adf-card-view-selectitem .adf-select-filter-input{background:var(--adf-theme-background-card-color);position:sticky;top:0;left:0;right:0;z-index:1}.adf-card-view-selectitem .adf-property-value-editable{padding-left:0}.adf-card-view-selectitem .adf-property-value-editable .mdc-text-field--no-label .mat-mdc-form-field-infix{padding:0}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-text-field-wrapper{background-color:unset}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select{margin-top:0;border-radius:6px}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select .mat-mdc-select-value{color:var(--adf-metadata-action-button-clear-color)}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select .mat-mdc-select-trigger{padding-left:6px;padding-right:6px}.adf-card-view-selectitem .adf-card-selectitem-autocomplete .adf-property-value-editable{padding-left:10px}.adf-card-view-selectitem .mat-mdc-form-field-subscript-wrapper{display:none}.adf-card-view-selectitem .adf-property-read-only{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;cursor:default;padding:6px 0;border-bottom:1px solid var(--adf-metadata-property-panel-border-color)}.adf-card-view-selectitem .mdc-line-ripple{display:none}.adf-card-view-selectitem .adf-property-readonly-value{color:var(--adf-metadata-property-panel-label-color)}.adf-card-view-selectitem .adf-property-label-non-editable{cursor:default;font-size:10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$5.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i3$3.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$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: SelectFilterInputComponent, selector: "adf-select-filter-input", outputs: ["change"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i4$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
18681
18681
|
}
|
|
18682
18682
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CardViewSelectItemComponent, decorators: [{
|
|
18683
18683
|
type: Component,
|
|
@@ -18690,7 +18690,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
18690
18690
|
MatAutocompleteModule,
|
|
18691
18691
|
MatInputModule,
|
|
18692
18692
|
ReactiveFormsModule
|
|
18693
|
-
], encapsulation: ViewEncapsulation.None, host: { class: 'adf-card-view-selectitem' }, template: "<ng-container *ngIf=\"!property.isEmpty() || isEditable\">\n <div [ngSwitch]=\"templateType\">\n <div *ngSwitchDefault>\n <div *ngIf=\"!isEditable\"\n [attr.data-automation-id]=\"'card-select-label-' + property.key\"\n class=\"adf-property-label adf-property-label-non-editable\"\n >{{ property.label | translate }}\n </div>\n <div class=\"adf-property-field\">\n <div\n *ngIf=\"!isEditable\"\n class=\"adf-property-value adf-property-read-only\"\n [attr.data-automation-id]=\"'select-readonly-value-' + property.key\"\n data-automation-class=\"read-only-value\"\n [title]=\"property.displayValue | async | translate\"\n >\n {{ property.displayValue | async | translate }}\n </div>\n <div *ngIf=\"isEditable\">\n <mat-form-field class=\"adf-property-value\">\n <mat-label\n [attr.data-automation-id]=\"'card-select-label-' + property.key\"\n class=\"adf-property-label adf-property-value-editable\"\n [ngClass]=\"{\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n >{{ property.label | translate }}\n </mat-label>\n <mat-select\n [(value)]=\"value\"\n [ngClass]=\"{ 'adf-property-readonly-value': isReadonlyProperty }\"\n panelClass=\"adf-select-filter\"\n (selectionChange)=\"onChange($event)\"\n data-automation-class=\"select-box\"\n [aria-label]=\"property.label | translate\"\n >\n <adf-select-filter-input *ngIf=\"showInputFilter\" (change)=\"onFilterInputChange($event)\" />\n <mat-option *ngIf=\"displayNoneOption\">{{ 'CORE.CARDVIEW.NONE' | translate }}</mat-option>\n <mat-option *ngFor=\"let option of list$ | async\" [value]=\"option.key\">\n {{ option.label | translate }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n </div>\n <div *ngSwitchCase=\"'autocompleteBased'\">\n <mat-form-field\n class=\"adf-property-field adf-card-selectitem-autocomplete \"\n [ngClass]=\"{ 'adf-property-read-only': !isEditable }\"\n [floatLabel]=\"property.default ? 'always' : null\"\n >\n <mat-label\n *ngIf=\"showProperty || isEditable\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-label-' + property.key\"\n class=\"adf-property-label\"\n [ngClass]=\"{\n 'adf-property-value-editable': isEditable,\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n >\n {{ property.label | translate }}\n </mat-label>\n <input\n matInput\n [matAutocomplete]=\"auto\"\n class=\"adf-property-value\"\n [ngClass]=\"{\n 'adf-property-value-editable': isEditable,\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n title=\"{{ property.label | translate }}\"\n [placeholder]=\"property.default\"\n [attr.aria-label]=\"property.label | translate\"\n [formControl]=\"autocompleteControl\"\n [title]=\"'CORE.METADATA.ACTIONS.COPY_TO_CLIPBOARD' | translate\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-value-' + property.key\"\n />\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onOptionSelected($event)\">\n <mat-option\n *ngFor=\"let option of property.options$ | async\"\n [value]=\"option.key\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-option-' + property.key\"\n >\n {{ option.label }}\n </mat-option>\n </mat-autocomplete>\n </mat-form-field>\n </div>\n </div>\n</ng-container>\n", styles: [".adf-card-view-selectitem .adf-property-value{width:100%}.adf-card-view-selectitem .adf-select-filter-input{background:var(--adf-theme-background-card-color);position:sticky;top:0;left:0;right:0;z-index:1}.adf-card-view-selectitem .adf-property-value-editable{padding-left:0}.adf-card-view-selectitem .adf-property-value-editable .mdc-text-field--no-label .mat-mdc-form-field-infix{padding:0}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-text-field-wrapper{background-color:unset}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select{margin-top:0;border-radius:6px}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select .mat-mdc-select-value{color:var(--adf-metadata-action-button-clear-color)}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select .mat-mdc-select-trigger{padding-left:6px;padding-right:6px}.adf-card-view-selectitem .adf-card-selectitem-autocomplete .adf-property-value-editable{padding-left:10px}.adf-card-view-selectitem .mat-mdc-form-field-subscript-wrapper{display:none}.adf-card-view-selectitem .adf-property-read-only{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;cursor:default;padding:6px 0;border-bottom:1px solid var(--adf-metadata-property-panel-border-color)}.adf-card-view-selectitem .mdc-line-ripple{display:none}.adf-card-view-selectitem .adf-property-readonly-value{color:var(--adf-metadata-property-panel-label-color)}.adf-card-view-selectitem .adf-property-label-non-editable{cursor:default;font-size:10px}
|
|
18693
|
+
], encapsulation: ViewEncapsulation.None, host: { class: 'adf-card-view-selectitem' }, template: "<ng-container *ngIf=\"!property.isEmpty() || isEditable\">\n <div [ngSwitch]=\"templateType\">\n <div *ngSwitchDefault>\n <div *ngIf=\"!isEditable\"\n [attr.data-automation-id]=\"'card-select-label-' + property.key\"\n class=\"adf-property-label adf-property-label-non-editable\"\n >{{ property.label | translate }}\n </div>\n <div class=\"adf-property-field\">\n <div\n *ngIf=\"!isEditable\"\n class=\"adf-property-value adf-property-read-only\"\n [attr.data-automation-id]=\"'select-readonly-value-' + property.key\"\n data-automation-class=\"read-only-value\"\n [title]=\"property.displayValue | async | translate\"\n >\n {{ property.displayValue | async | translate }}\n </div>\n <div *ngIf=\"isEditable\">\n <mat-form-field class=\"adf-property-value\">\n <mat-label\n [attr.data-automation-id]=\"'card-select-label-' + property.key\"\n class=\"adf-property-label adf-property-value-editable\"\n [ngClass]=\"{\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n >{{ property.label | translate }}\n </mat-label>\n <mat-select\n [(value)]=\"value\"\n [ngClass]=\"{ 'adf-property-readonly-value': isReadonlyProperty }\"\n panelClass=\"adf-select-filter\"\n (selectionChange)=\"onChange($event)\"\n data-automation-class=\"select-box\"\n [aria-label]=\"property.label | translate\"\n >\n <adf-select-filter-input *ngIf=\"showInputFilter\" (change)=\"onFilterInputChange($event)\" />\n <mat-option *ngIf=\"displayNoneOption\">{{ 'CORE.CARDVIEW.NONE' | translate }}</mat-option>\n <mat-option *ngFor=\"let option of list$ | async\" [value]=\"option.key\">\n {{ option.label | translate }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n </div>\n <div *ngSwitchCase=\"'autocompleteBased'\">\n <mat-form-field\n class=\"adf-property-field adf-card-selectitem-autocomplete \"\n [ngClass]=\"{ 'adf-property-read-only': !isEditable }\"\n [floatLabel]=\"property.default ? 'always' : null\"\n >\n <mat-label\n *ngIf=\"showProperty || isEditable\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-label-' + property.key\"\n class=\"adf-property-label\"\n [ngClass]=\"{\n 'adf-property-value-editable': isEditable,\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n >\n {{ property.label | translate }}\n </mat-label>\n <input\n matInput\n [matAutocomplete]=\"auto\"\n class=\"adf-property-value\"\n [ngClass]=\"{\n 'adf-property-value-editable': isEditable,\n 'adf-property-readonly-value': isReadonlyProperty\n }\"\n title=\"{{ property.label | translate }}\"\n [placeholder]=\"property.default\"\n [attr.aria-label]=\"property.label | translate\"\n [formControl]=\"autocompleteControl\"\n [title]=\"'CORE.METADATA.ACTIONS.COPY_TO_CLIPBOARD' | translate\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-value-' + property.key\"\n />\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onOptionSelected($event)\">\n <mat-option\n *ngFor=\"let option of property.options$ | async\"\n [value]=\"option.key\"\n [attr.data-automation-id]=\"'card-autocomplete-based-selectitem-option-' + property.key\"\n >\n {{ option.label }}\n </mat-option>\n </mat-autocomplete>\n </mat-form-field>\n </div>\n </div>\n</ng-container>\n", styles: [".adf-card-view-selectitem .adf-property-value{width:100%}.adf-card-view-selectitem .adf-select-filter-input{background:var(--adf-theme-background-card-color);position:sticky;top:0;left:0;right:0;z-index:1}.adf-card-view-selectitem .adf-property-value-editable{padding-left:0}.adf-card-view-selectitem .adf-property-value-editable .mdc-text-field--no-label .mat-mdc-form-field-infix{padding:0}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-text-field-wrapper{background-color:unset}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select{margin-top:0;border-radius:6px}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select .mat-mdc-select-value{color:var(--adf-metadata-action-button-clear-color)}.adf-card-view-selectitem .adf-property-value-editable .mat-mdc-select .mat-mdc-select-trigger{padding-left:6px;padding-right:6px}.adf-card-view-selectitem .adf-card-selectitem-autocomplete .adf-property-value-editable{padding-left:10px}.adf-card-view-selectitem .mat-mdc-form-field-subscript-wrapper{display:none}.adf-card-view-selectitem .adf-property-read-only{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;cursor:default;padding:6px 0;border-bottom:1px solid var(--adf-metadata-property-panel-border-color)}.adf-card-view-selectitem .mdc-line-ripple{display:none}.adf-card-view-selectitem .adf-property-readonly-value{color:var(--adf-metadata-property-panel-label-color)}.adf-card-view-selectitem .adf-property-label-non-editable{cursor:default;font-size:10px}\n"] }]
|
|
18694
18694
|
}], propDecorators: { options$: [{
|
|
18695
18695
|
type: Input
|
|
18696
18696
|
}], displayNoneOption: [{
|