@porscheinformatik/clr-addons 19.0.7 → 19.1.0
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/clr-addons.mjs +37 -8
- package/fesm2022/clr-addons.mjs.map +1 -1
- package/numericfield/numeric-field.d.ts +6 -0
- package/package.json +1 -1
- package/readonly/readonly.directive.d.ts +7 -0
- package/styles/clr-addons-phs.css +5 -2
- package/styles/clr-addons-phs.css.map +1 -1
- package/styles/clr-addons-phs.min.css +1 -1
- package/styles/clr-addons-phs.min.css.map +1 -1
package/fesm2022/clr-addons.mjs
CHANGED
|
@@ -2450,6 +2450,9 @@ class ClrNumericField {
|
|
|
2450
2450
|
this.handleInputChanged();
|
|
2451
2451
|
}
|
|
2452
2452
|
}
|
|
2453
|
+
/**
|
|
2454
|
+
* @deprecated Use {@link clrInputSuffix} or {@link clrInputPrefix} from Clarity instead.
|
|
2455
|
+
*/
|
|
2453
2456
|
set unit(value) {
|
|
2454
2457
|
if (value != this._unit) {
|
|
2455
2458
|
this._unit = value;
|
|
@@ -2481,6 +2484,9 @@ class ClrNumericField {
|
|
|
2481
2484
|
this.autofillDecimals = false;
|
|
2482
2485
|
this.decimalSeparator = ',';
|
|
2483
2486
|
this.groupingSeparator = '.';
|
|
2487
|
+
/**
|
|
2488
|
+
* @deprecated Use {@link clrInputSuffix} or {@link clrInputPrefix} from Clarity instead.
|
|
2489
|
+
*/
|
|
2484
2490
|
this.unitPosition = 'right';
|
|
2485
2491
|
this.numericValueChanged = new EventEmitter();
|
|
2486
2492
|
this.displayValue = '';
|
|
@@ -11354,11 +11360,11 @@ class ClrEnumFilterComponent {
|
|
|
11354
11360
|
return value ? { value: value, displayValue: value } : { value: '', displayValue: this.emptyValue };
|
|
11355
11361
|
}
|
|
11356
11362
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: ClrEnumFilterComponent, deps: [{ token: i2.ClrDatagridFilter }, { token: i2.ClrDatagrid }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11357
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: ClrEnumFilterComponent, isStandalone: false, selector: "clr-enum-filter", inputs: { property: ["clrProperty", "property"], setEmptyValuesTranslation: ["clrEmptyValuesTranslation", "setEmptyValuesTranslation"], value: ["clrFilterValues", "value"], clrPossibleValues: "clrPossibleValues" }, outputs: { clrFilterValuesChange: "clrFilterValuesChange" }, ngImport: i0, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilters()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<clr-checkbox-container class=\"filter-selection\">\n <clr-checkbox-wrapper *ngFor=\"let possibleValue of possibleValues\">\n <input\n type=\"checkbox\"\n clrCheckbox\n value=\"{{ possibleValue.displayValue ?? possibleValue }}\"\n name=\"possibleValue\"\n [ngModel]=\"containsFilterValue(filteredValues, possibleValue)\"\n (ngModelChange)=\"onChange(possibleValue, $event)\"\n />\n <label>{{ possibleValue.displayValue ?? possibleValue }}</label>\n </clr-checkbox-wrapper>\n</clr-checkbox-container>\n", styles: [".filter-selection{margin-top
|
|
11363
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: ClrEnumFilterComponent, isStandalone: false, selector: "clr-enum-filter", inputs: { property: ["clrProperty", "property"], setEmptyValuesTranslation: ["clrEmptyValuesTranslation", "setEmptyValuesTranslation"], value: ["clrFilterValues", "value"], clrPossibleValues: "clrPossibleValues" }, outputs: { clrFilterValuesChange: "clrFilterValuesChange" }, ngImport: i0, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilters()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<clr-checkbox-container class=\"filter-selection\">\n <clr-checkbox-wrapper *ngFor=\"let possibleValue of possibleValues\">\n <input\n type=\"checkbox\"\n clrCheckbox\n value=\"{{ possibleValue.displayValue ?? possibleValue }}\"\n name=\"possibleValue\"\n [ngModel]=\"containsFilterValue(filteredValues, possibleValue)\"\n (ngModelChange)=\"onChange(possibleValue, $event)\"\n />\n <label>{{ possibleValue.displayValue ?? possibleValue }}</label>\n </clr-checkbox-wrapper>\n</clr-checkbox-container>\n", styles: [".filter-selection{margin-top:.5rem}.btn-trash{position:absolute;top:10px;right:40px;padding:0}\n"], dependencies: [{ kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i2.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i2.ClrCheckboxContainer, selector: "clr-checkbox-container,clr-toggle-container", inputs: ["clrInline"] }, { kind: "component", type: i2.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
11358
11364
|
}
|
|
11359
11365
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: ClrEnumFilterComponent, decorators: [{
|
|
11360
11366
|
type: Component,
|
|
11361
|
-
args: [{ selector: 'clr-enum-filter', standalone: false, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilters()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<clr-checkbox-container class=\"filter-selection\">\n <clr-checkbox-wrapper *ngFor=\"let possibleValue of possibleValues\">\n <input\n type=\"checkbox\"\n clrCheckbox\n value=\"{{ possibleValue.displayValue ?? possibleValue }}\"\n name=\"possibleValue\"\n [ngModel]=\"containsFilterValue(filteredValues, possibleValue)\"\n (ngModelChange)=\"onChange(possibleValue, $event)\"\n />\n <label>{{ possibleValue.displayValue ?? possibleValue }}</label>\n </clr-checkbox-wrapper>\n</clr-checkbox-container>\n", styles: [".filter-selection{margin-top
|
|
11367
|
+
args: [{ selector: 'clr-enum-filter', standalone: false, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilters()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<clr-checkbox-container class=\"filter-selection\">\n <clr-checkbox-wrapper *ngFor=\"let possibleValue of possibleValues\">\n <input\n type=\"checkbox\"\n clrCheckbox\n value=\"{{ possibleValue.displayValue ?? possibleValue }}\"\n name=\"possibleValue\"\n [ngModel]=\"containsFilterValue(filteredValues, possibleValue)\"\n (ngModelChange)=\"onChange(possibleValue, $event)\"\n />\n <label>{{ possibleValue.displayValue ?? possibleValue }}</label>\n </clr-checkbox-wrapper>\n</clr-checkbox-container>\n", styles: [".filter-selection{margin-top:.5rem}.btn-trash{position:absolute;top:10px;right:40px;padding:0}\n"] }]
|
|
11362
11368
|
}], ctorParameters: () => [{ type: i2.ClrDatagridFilter }, { type: i2.ClrDatagrid }], propDecorators: { property: [{
|
|
11363
11369
|
type: Input,
|
|
11364
11370
|
args: ['clrProperty']
|
|
@@ -11598,11 +11604,11 @@ class ClrDateFilterComponent {
|
|
|
11598
11604
|
}
|
|
11599
11605
|
}
|
|
11600
11606
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: ClrDateFilterComponent, deps: [{ token: i2.ClrCommonStringsService }, { token: i2.ClrPopoverEventsService }, { token: i2.ClrDatagridFilter }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11601
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: ClrDateFilterComponent, isStandalone: false, selector: "clr-date-filter", inputs: { timeActive: "timeActive", dateValidationError: "dateValidationError", property: ["clrProperty", "property"], maxPlaceholder: ["clrFilterMaxPlaceholder", "maxPlaceholder"], minPlaceholder: ["clrFilterMinPlaceholder", "minPlaceholder"], value: ["clrFilterValue", "value"] }, outputs: { filterValueChange: "clrFilterValueChange" }, ngImport: i0, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilter()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<ng-container *ngIf=\"!timeActive\">\n <clr-date-container>\n <input\n #input_from\n type=\"date\"\n name=\"from\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"from\"\n [placeholder]=\"minPlaceholderValue\"\n [attr.aria-label]=\"minPlaceholderValue\"\n />\n </clr-date-container>\n <clr-date-container>\n <input\n type=\"date\"\n name=\"to\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"to\"\n [placeholder]=\"maxPlaceholderValue\"\n [attr.aria-label]=\"maxPlaceholderValue\"\n />\n </clr-date-container>\n</ng-container>\n<ng-container *ngIf=\"timeActive\">\n <clr-date-time-container>\n <clr-date-container class=\"time-filter-active\">\n <input\n #input_from\n type=\"date\"\n name=\"from\"\n class=\"datagrid-date-filter-input time-filter-active-input\"\n [(clrDate)]=\"from\"\n [placeholder]=\"minPlaceholderValue\"\n [attr.aria-label]=\"minPlaceholderValue\"\n />\n </clr-date-container>\n <input clrTime type=\"time\" class=\"time-filter-input\" step=\"60\" [(ngModel)]=\"fromTime\" />\n </clr-date-time-container>\n <clr-date-time-container>\n <clr-date-container class=\"time-filter-active\">\n <input\n type=\"date\"\n name=\"to\"\n class=\"datagrid-date-filter-input time-filter-active-input\"\n [(clrDate)]=\"to\"\n [placeholder]=\"maxPlaceholderValue\"\n [attr.aria-label]=\"maxPlaceholderValue\"\n />\n </clr-date-container>\n <input clrTime type=\"time\" class=\"time-filter-input\" step=\"60\" [(ngModel)]=\"toTime\" />\n </clr-date-time-container>\n <clr-control-error *ngIf=\"valError\"\n >{{ dateValidationError || 'Date \"from\" must be before date \"to\"!' }}\n </clr-control-error>\n</ng-container>\n", styles: [".btn-trash{position:absolute;top:
|
|
11607
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: ClrDateFilterComponent, isStandalone: false, selector: "clr-date-filter", inputs: { timeActive: "timeActive", dateValidationError: "dateValidationError", property: ["clrProperty", "property"], maxPlaceholder: ["clrFilterMaxPlaceholder", "maxPlaceholder"], minPlaceholder: ["clrFilterMinPlaceholder", "minPlaceholder"], value: ["clrFilterValue", "value"] }, outputs: { filterValueChange: "clrFilterValueChange" }, ngImport: i0, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilter()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<ng-container *ngIf=\"!timeActive\">\n <clr-date-container class=\"filter-selection\">\n <input\n #input_from\n type=\"date\"\n name=\"from\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"from\"\n [placeholder]=\"minPlaceholderValue\"\n [attr.aria-label]=\"minPlaceholderValue\"\n />\n </clr-date-container>\n <clr-date-container class=\"filter-selection\">\n <input\n type=\"date\"\n name=\"to\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"to\"\n [placeholder]=\"maxPlaceholderValue\"\n [attr.aria-label]=\"maxPlaceholderValue\"\n />\n </clr-date-container>\n</ng-container>\n<ng-container *ngIf=\"timeActive\">\n <clr-date-time-container class=\"filter-selection\">\n <clr-date-container class=\"time-filter-active\">\n <input\n #input_from\n type=\"date\"\n name=\"from\"\n class=\"datagrid-date-filter-input time-filter-active-input\"\n [(clrDate)]=\"from\"\n [placeholder]=\"minPlaceholderValue\"\n [attr.aria-label]=\"minPlaceholderValue\"\n />\n </clr-date-container>\n <input clrTime type=\"time\" class=\"time-filter-input\" step=\"60\" [(ngModel)]=\"fromTime\" />\n </clr-date-time-container>\n <clr-date-time-container>\n <clr-date-container class=\"time-filter-active\">\n <input\n type=\"date\"\n name=\"to\"\n class=\"datagrid-date-filter-input time-filter-active-input\"\n [(clrDate)]=\"to\"\n [placeholder]=\"maxPlaceholderValue\"\n [attr.aria-label]=\"maxPlaceholderValue\"\n />\n </clr-date-container>\n <input clrTime type=\"time\" class=\"time-filter-input\" step=\"60\" [(ngModel)]=\"toTime\" />\n </clr-date-time-container>\n <clr-control-error *ngIf=\"valError\"\n >{{ dateValidationError || 'Date \"from\" must be before date \"to\"!' }}\n </clr-control-error>\n</ng-container>\n", styles: [".btn-trash{position:absolute;top:10px;right:40px;padding:0}.time-filter-active{width:12rem;margin-top:.5rem}.time-filter-active-input,.time-filter-input{width:4.5rem!important}.filter-selection{margin-top:.5rem}\n"], dependencies: [{ kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: i2.ClrControlError, selector: "clr-control-error" }, { kind: "component", type: i2.ClrDateContainer, selector: "clr-date-container, clr-date-range-container", inputs: ["showActionButtons", "clrPosition", "rangeOptions", "min", "max"] }, { kind: "directive", type: i2.ClrDateInput, selector: "[clrDate]", inputs: ["clrDate", "min", "max"], outputs: ["clrDateChange"] }, { kind: "directive", type: i2.ClrDateInputValidator, selector: "[clrDate], [clrStartDate], [clrEndDate]" }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ClrDateTimeContainer, selector: "clr-date-time-container" }, { kind: "directive", type: ClrTimeInput, selector: "[clrTime]" }] }); }
|
|
11602
11608
|
}
|
|
11603
11609
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: ClrDateFilterComponent, decorators: [{
|
|
11604
11610
|
type: Component,
|
|
11605
|
-
args: [{ selector: 'clr-date-filter', standalone: false, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilter()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<ng-container *ngIf=\"!timeActive\">\n <clr-date-container>\n <input\n #input_from\n type=\"date\"\n name=\"from\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"from\"\n [placeholder]=\"minPlaceholderValue\"\n [attr.aria-label]=\"minPlaceholderValue\"\n />\n </clr-date-container>\n <clr-date-container>\n <input\n type=\"date\"\n name=\"to\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"to\"\n [placeholder]=\"maxPlaceholderValue\"\n [attr.aria-label]=\"maxPlaceholderValue\"\n />\n </clr-date-container>\n</ng-container>\n<ng-container *ngIf=\"timeActive\">\n <clr-date-time-container>\n <clr-date-container class=\"time-filter-active\">\n <input\n #input_from\n type=\"date\"\n name=\"from\"\n class=\"datagrid-date-filter-input time-filter-active-input\"\n [(clrDate)]=\"from\"\n [placeholder]=\"minPlaceholderValue\"\n [attr.aria-label]=\"minPlaceholderValue\"\n />\n </clr-date-container>\n <input clrTime type=\"time\" class=\"time-filter-input\" step=\"60\" [(ngModel)]=\"fromTime\" />\n </clr-date-time-container>\n <clr-date-time-container>\n <clr-date-container class=\"time-filter-active\">\n <input\n type=\"date\"\n name=\"to\"\n class=\"datagrid-date-filter-input time-filter-active-input\"\n [(clrDate)]=\"to\"\n [placeholder]=\"maxPlaceholderValue\"\n [attr.aria-label]=\"maxPlaceholderValue\"\n />\n </clr-date-container>\n <input clrTime type=\"time\" class=\"time-filter-input\" step=\"60\" [(ngModel)]=\"toTime\" />\n </clr-date-time-container>\n <clr-control-error *ngIf=\"valError\"\n >{{ dateValidationError || 'Date \"from\" must be before date \"to\"!' }}\n </clr-control-error>\n</ng-container>\n", styles: [".btn-trash{position:absolute;top:
|
|
11611
|
+
args: [{ selector: 'clr-date-filter', standalone: false, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilter()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<ng-container *ngIf=\"!timeActive\">\n <clr-date-container class=\"filter-selection\">\n <input\n #input_from\n type=\"date\"\n name=\"from\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"from\"\n [placeholder]=\"minPlaceholderValue\"\n [attr.aria-label]=\"minPlaceholderValue\"\n />\n </clr-date-container>\n <clr-date-container class=\"filter-selection\">\n <input\n type=\"date\"\n name=\"to\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"to\"\n [placeholder]=\"maxPlaceholderValue\"\n [attr.aria-label]=\"maxPlaceholderValue\"\n />\n </clr-date-container>\n</ng-container>\n<ng-container *ngIf=\"timeActive\">\n <clr-date-time-container class=\"filter-selection\">\n <clr-date-container class=\"time-filter-active\">\n <input\n #input_from\n type=\"date\"\n name=\"from\"\n class=\"datagrid-date-filter-input time-filter-active-input\"\n [(clrDate)]=\"from\"\n [placeholder]=\"minPlaceholderValue\"\n [attr.aria-label]=\"minPlaceholderValue\"\n />\n </clr-date-container>\n <input clrTime type=\"time\" class=\"time-filter-input\" step=\"60\" [(ngModel)]=\"fromTime\" />\n </clr-date-time-container>\n <clr-date-time-container>\n <clr-date-container class=\"time-filter-active\">\n <input\n type=\"date\"\n name=\"to\"\n class=\"datagrid-date-filter-input time-filter-active-input\"\n [(clrDate)]=\"to\"\n [placeholder]=\"maxPlaceholderValue\"\n [attr.aria-label]=\"maxPlaceholderValue\"\n />\n </clr-date-container>\n <input clrTime type=\"time\" class=\"time-filter-input\" step=\"60\" [(ngModel)]=\"toTime\" />\n </clr-date-time-container>\n <clr-control-error *ngIf=\"valError\"\n >{{ dateValidationError || 'Date \"from\" must be before date \"to\"!' }}\n </clr-control-error>\n</ng-container>\n", styles: [".btn-trash{position:absolute;top:10px;right:40px;padding:0}.time-filter-active{width:12rem;margin-top:.5rem}.time-filter-active-input,.time-filter-input{width:4.5rem!important}.filter-selection{margin-top:.5rem}\n"] }]
|
|
11606
11612
|
}], ctorParameters: () => [{ type: i2.ClrCommonStringsService }, { type: i2.ClrPopoverEventsService }, { type: i2.ClrDatagridFilter }], propDecorators: { timeActive: [{
|
|
11607
11613
|
type: Input
|
|
11608
11614
|
}], dateValidationError: [{
|
|
@@ -13867,9 +13873,15 @@ class ClrReadonlyDirective {
|
|
|
13867
13873
|
this.elementRef = elementRef;
|
|
13868
13874
|
this.renderer = renderer;
|
|
13869
13875
|
this.injector = injector;
|
|
13876
|
+
/**
|
|
13877
|
+
* @deprecated Use {@link clrInputSuffix} or {@link clrInputPrefix} from Clarity instead.
|
|
13878
|
+
*/
|
|
13870
13879
|
this.unitPosition = 'right';
|
|
13871
13880
|
this.property = null;
|
|
13872
13881
|
this.clrReadOnly = true;
|
|
13882
|
+
/**
|
|
13883
|
+
* @deprecated Use {@link clrInputSuffix} or {@link clrInputPrefix} from Clarity instead.
|
|
13884
|
+
*/
|
|
13873
13885
|
this.unit = '';
|
|
13874
13886
|
this.decimalPlaces = 2;
|
|
13875
13887
|
this.roundValue = false;
|
|
@@ -13938,19 +13950,24 @@ class ClrReadonlyDirective {
|
|
|
13938
13950
|
if (controlValue == null || controlValue === '') {
|
|
13939
13951
|
return '';
|
|
13940
13952
|
}
|
|
13953
|
+
let formattedValue = controlValue ?? '';
|
|
13941
13954
|
if (controlType === 'numeric') {
|
|
13942
|
-
|
|
13955
|
+
formattedValue = this.formatNumericValue(controlValue);
|
|
13943
13956
|
}
|
|
13944
13957
|
else if (this.property) {
|
|
13945
|
-
|
|
13958
|
+
formattedValue = this.formatValueForObjectValue(controlValue);
|
|
13946
13959
|
}
|
|
13947
13960
|
else if (controlType === 'select') {
|
|
13948
|
-
|
|
13961
|
+
formattedValue = this.formatListValue(controlValue);
|
|
13949
13962
|
}
|
|
13950
|
-
|
|
13963
|
+
formattedValue = this.addTextPrefixSuffixToValue(formattedValue);
|
|
13964
|
+
return formattedValue;
|
|
13951
13965
|
}
|
|
13952
13966
|
formatNumericValue(controlValue) {
|
|
13953
13967
|
const result = formatNumber(controlValue + '', true, this.decimalSeparator, this.groupingSeparator, this.decimalPlaces, this.autofillDecimals);
|
|
13968
|
+
if (this.unit == null || this.unit === '') {
|
|
13969
|
+
return result;
|
|
13970
|
+
}
|
|
13954
13971
|
return this.unitPosition === 'left' ? `${this.unit} ${result}` : `${result} ${this.unit}`;
|
|
13955
13972
|
}
|
|
13956
13973
|
formatValueForObjectValue(controlValue) {
|
|
@@ -13971,6 +13988,18 @@ class ClrReadonlyDirective {
|
|
|
13971
13988
|
return '';
|
|
13972
13989
|
}
|
|
13973
13990
|
}
|
|
13991
|
+
addTextPrefixSuffixToValue(formattedValue) {
|
|
13992
|
+
const parentElement = this.elementRef.nativeElement.parentElement;
|
|
13993
|
+
const prefixElement = parentElement.querySelector('[clrInputPrefix]');
|
|
13994
|
+
const suffixElement = parentElement.querySelector('[clrInputSuffix]');
|
|
13995
|
+
if (prefixElement?.textContent) {
|
|
13996
|
+
formattedValue = `${prefixElement.textContent} ${formattedValue}`;
|
|
13997
|
+
}
|
|
13998
|
+
if (suffixElement?.textContent) {
|
|
13999
|
+
formattedValue = `${formattedValue} ${suffixElement.textContent}`;
|
|
14000
|
+
}
|
|
14001
|
+
return formattedValue;
|
|
14002
|
+
}
|
|
13974
14003
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: ClrReadonlyDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
13975
14004
|
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.5", type: ClrReadonlyDirective, isStandalone: false, selector: "[clrReadonly]", inputs: { unitPosition: ["clrUnitPosition", "unitPosition"], property: ["clrReadOnlyProperty", "property"], clrReadOnly: ["clrReadonly", "clrReadOnly"], unit: ["clrUnit", "unit"], decimalPlaces: ["clrDecimalPlaces", "decimalPlaces"], roundValue: ["clrRoundDisplayValue", "roundValue"], autofillDecimals: ["clrAutofillDecimals", "autofillDecimals"], decimalSeparator: ["clrDecimalSep", "decimalSeparator"], groupingSeparator: ["clrGroupingSep", "groupingSeparator"] }, usesOnChanges: true, ngImport: i0 }); }
|
|
13976
14005
|
}
|