@mediusinc/mng-commons 0.17.5 → 0.17.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/components/action/editor/action-editor.component.mjs +4 -1
- package/esm2020/lib/components/tableview/table/column-value/column-value.component.mjs +4 -3
- package/esm2020/lib/descriptors/action.descriptor.mjs +2 -2
- package/esm2020/lib/descriptors/column.descriptor.mjs +8 -1
- package/esm2020/lib/descriptors/types/column.type.mjs +2 -1
- package/esm2020/lib/pipes/getter.pipe.mjs +4 -4
- package/fesm2015/mediusinc-mng-commons.mjs +18 -6
- package/fesm2015/mediusinc-mng-commons.mjs.map +1 -1
- package/fesm2020/mediusinc-mng-commons.mjs +18 -6
- package/fesm2020/mediusinc-mng-commons.mjs.map +1 -1
- package/lib/components/tableview/table/column-value/column-value.component.d.ts +1 -0
- package/lib/descriptors/column.descriptor.d.ts +3 -2
- package/lib/descriptors/types/column.type.d.ts +2 -1
- package/lib/pipes/getter.pipe.d.ts +1 -1
- package/package.json +1 -1
- package/scss/mng-overrides/_theme_datatable.scss +9 -3
- package/version-info.json +5 -5
|
@@ -1038,6 +1038,7 @@ var ColumnTypeEnum;
|
|
|
1038
1038
|
ColumnTypeEnum[ColumnTypeEnum["Date"] = 4] = "Date";
|
|
1039
1039
|
ColumnTypeEnum[ColumnTypeEnum["Enum"] = 5] = "Enum";
|
|
1040
1040
|
ColumnTypeEnum[ColumnTypeEnum["Custom"] = 6] = "Custom";
|
|
1041
|
+
ColumnTypeEnum[ColumnTypeEnum["Html"] = 7] = "Html";
|
|
1041
1042
|
})(ColumnTypeEnum || (ColumnTypeEnum = {}));
|
|
1042
1043
|
|
|
1043
1044
|
var TableviewEditorTypeEnum;
|
|
@@ -1875,7 +1876,7 @@ class ActionEditorDescriptor extends ActionDescriptor {
|
|
|
1875
1876
|
}
|
|
1876
1877
|
class ActionEditorSubmitDescriptor extends ActionDescriptor {
|
|
1877
1878
|
constructor(editorAction, submitType = ActionEditorSubmitTypeEnum.Submit) {
|
|
1878
|
-
super(editorAction.model, submitType === ActionEditorSubmitTypeEnum.Submit ?
|
|
1879
|
+
super(editorAction.model, submitType === ActionEditorSubmitTypeEnum.Submit ? `${editorAction.actionName}.submit` : `${editorAction.actionName}.cancel`);
|
|
1879
1880
|
this._editorAction = editorAction;
|
|
1880
1881
|
this._submitType = submitType;
|
|
1881
1882
|
this._position = ActionPositionEnum.FooterRight;
|
|
@@ -2639,6 +2640,8 @@ class ColumnDescriptor {
|
|
|
2639
2640
|
return this.asEnum(args[0], args[1], args[2]);
|
|
2640
2641
|
case ColumnTypeEnum.Custom:
|
|
2641
2642
|
return this.asCustomComponent(args[0]);
|
|
2643
|
+
case ColumnTypeEnum.Html:
|
|
2644
|
+
return this.asHtml();
|
|
2642
2645
|
case ColumnTypeEnum.String:
|
|
2643
2646
|
default:
|
|
2644
2647
|
return this;
|
|
@@ -2686,6 +2689,10 @@ class ColumnDescriptor {
|
|
|
2686
2689
|
this._customComponentType = customComponentType;
|
|
2687
2690
|
return this;
|
|
2688
2691
|
}
|
|
2692
|
+
asHtml() {
|
|
2693
|
+
this._columnType = ColumnTypeEnum.Html;
|
|
2694
|
+
return this;
|
|
2695
|
+
}
|
|
2689
2696
|
withClassName(className, headerClassName) {
|
|
2690
2697
|
this._className = className ?? '';
|
|
2691
2698
|
this._headerClassName = headerClassName ?? '';
|
|
@@ -2742,6 +2749,7 @@ class ColumnDescriptor {
|
|
|
2742
2749
|
}
|
|
2743
2750
|
case ColumnTypeEnum.String:
|
|
2744
2751
|
case ColumnTypeEnum.Custom:
|
|
2752
|
+
case ColumnTypeEnum.Html:
|
|
2745
2753
|
default:
|
|
2746
2754
|
filterType = FilterTypeEnum.String;
|
|
2747
2755
|
break;
|
|
@@ -6701,9 +6709,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
|
|
|
6701
6709
|
}] });
|
|
6702
6710
|
|
|
6703
6711
|
class MngGetterPipe {
|
|
6704
|
-
transform(
|
|
6705
|
-
if (typeof
|
|
6706
|
-
return
|
|
6712
|
+
transform(item, getterFn, value) {
|
|
6713
|
+
if (typeof getterFn === 'function') {
|
|
6714
|
+
return getterFn(item, value);
|
|
6707
6715
|
}
|
|
6708
6716
|
return value;
|
|
6709
6717
|
}
|
|
@@ -8972,6 +8980,9 @@ class MngActionEditorComponent {
|
|
|
8972
8980
|
this.triggerSubmit();
|
|
8973
8981
|
return of(undefined);
|
|
8974
8982
|
});
|
|
8983
|
+
if (this.action.hasRunConfirmation) {
|
|
8984
|
+
action.withRunConfirmationDescriptor(this.action.runConfirmationDialogDescriptor);
|
|
8985
|
+
}
|
|
8975
8986
|
}
|
|
8976
8987
|
else {
|
|
8977
8988
|
action.withRunFunction(() => {
|
|
@@ -9360,6 +9371,7 @@ class MngTableColumnValueComponent {
|
|
|
9360
9371
|
this.columnTypeDate = ColumnTypeEnum.Date;
|
|
9361
9372
|
this.columnTypeEnum = ColumnTypeEnum.Enum;
|
|
9362
9373
|
this.columnTypeCustom = ColumnTypeEnum.Custom;
|
|
9374
|
+
this.columnTypeHtml = ColumnTypeEnum.Html;
|
|
9363
9375
|
this.styleMaxWidth = null;
|
|
9364
9376
|
this.className = 'nowrap';
|
|
9365
9377
|
this.jsonPath = '$';
|
|
@@ -9391,10 +9403,10 @@ class MngTableColumnValueComponent {
|
|
|
9391
9403
|
}
|
|
9392
9404
|
}
|
|
9393
9405
|
MngTableColumnValueComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableColumnValueComponent, deps: [{ token: i0.ElementRef }, { token: i2$1.MessageService }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
9394
|
-
MngTableColumnValueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: { descriptor: "descriptor", item: "item" }, host: { properties: { "style.max-width.px": "this.styleMaxWidth", "class": "this.className" } }, ngImport: i0, template: "<ng-container [ngSwitch]=\"descriptor.columnType\">\n <ng-container *ngSwitchCase=\"columnTypeString\">\n {{ item | jsonPath: jsonPath | getter: descriptor.getter | template: descriptor.template
|
|
9406
|
+
MngTableColumnValueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: { descriptor: "descriptor", item: "item" }, host: { properties: { "style.max-width.px": "this.styleMaxWidth", "class": "this.className" } }, ngImport: i0, template: "<ng-container [ngSwitch]=\"descriptor.columnType\">\n <ng-container *ngSwitchCase=\"columnTypeString\">\n {{ (descriptor.getter ? (item | getter: descriptor.getter:(item | jsonPath: jsonPath)) : (item | jsonPath: jsonPath)) | template: descriptor.template }}\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeHtml\">\n <span\n [innerHTML]=\"(descriptor.getter ? (item | getter: descriptor.getter:(item | jsonPath: jsonPath)) : (item | jsonPath: jsonPath)) | template: descriptor.template\"></span>\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeNumber\">\n {{ item | jsonPath: jsonPath | number: descriptor.displayFormat:descriptor.locale }}\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeCurrency\">\n {{ item | jsonPath: jsonPath | currency: currency:descriptor.currencyDisplay:descriptor.displayFormat:descriptor.locale }}\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeDate\">\n {{ item | jsonPath: jsonPath | date: descriptor.displayFormat }}\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeBoolean\">\n <ng-container *ngIf=\"descriptor.booleanAsIcon; else booleanText\"></ng-container>\n <i [class]=\"item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo:true\"></i>\n <ng-template #booleanText>\n {{ item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo | translate }}\n </ng-template>\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeEnum\">\n {{ item | jsonPath: jsonPath | enum: descriptor.enumType:descriptor.enumTitlePath:descriptor.enumNameAsValue | translate }}\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeCustom\">\n <ng-container\n [mngComponent]=\"descriptor.customComponentType!\"\n [inputs]=\"{\n value: item | jsonPath: jsonPath,\n item: item,\n descriptor: descriptor\n }\"></ng-container>\n </ng-container>\n</ng-container>\n<div class=\"help-buttons\" *ngIf=\"descriptor.hasCopyToClipboard\">\n <button pButton pRipple type=\"button\" icon=\"pi pi-copy\" class=\"p-button-rounded p-button-info p-button-sm\" (click)=\"copyToClipboard($event)\"></button>\n</div>\n", styles: [":host{display:inline-block;overflow:hidden}:host.nowrap{white-space:nowrap;text-overflow:ellipsis}.help-buttons{display:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}.help-buttons .p-button{height:1.9rem;width:1.9rem;padding:0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "directive", type: i5.Ripple, selector: "[pRipple]" }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs"], outputs: ["instanceCreated"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: JsonPathPipe, name: "jsonPath" }, { kind: "pipe", type: MngEnumPipe, name: "enum" }, { kind: "pipe", type: MngBooleanPipe, name: "boolean" }, { kind: "pipe", type: MngGetterPipe, name: "getter" }, { kind: "pipe", type: MngTemplatePipe, name: "template" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9395
9407
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableColumnValueComponent, decorators: [{
|
|
9396
9408
|
type: Component,
|
|
9397
|
-
args: [{ selector: 'mng-table-column-value', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"descriptor.columnType\">\n <ng-container *ngSwitchCase=\"columnTypeString\">\n {{ item | jsonPath: jsonPath | getter: descriptor.getter | template: descriptor.template
|
|
9409
|
+
args: [{ selector: 'mng-table-column-value', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"descriptor.columnType\">\n <ng-container *ngSwitchCase=\"columnTypeString\">\n {{ (descriptor.getter ? (item | getter: descriptor.getter:(item | jsonPath: jsonPath)) : (item | jsonPath: jsonPath)) | template: descriptor.template }}\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeHtml\">\n <span\n [innerHTML]=\"(descriptor.getter ? (item | getter: descriptor.getter:(item | jsonPath: jsonPath)) : (item | jsonPath: jsonPath)) | template: descriptor.template\"></span>\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeNumber\">\n {{ item | jsonPath: jsonPath | number: descriptor.displayFormat:descriptor.locale }}\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeCurrency\">\n {{ item | jsonPath: jsonPath | currency: currency:descriptor.currencyDisplay:descriptor.displayFormat:descriptor.locale }}\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeDate\">\n {{ item | jsonPath: jsonPath | date: descriptor.displayFormat }}\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeBoolean\">\n <ng-container *ngIf=\"descriptor.booleanAsIcon; else booleanText\"></ng-container>\n <i [class]=\"item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo:true\"></i>\n <ng-template #booleanText>\n {{ item | jsonPath: jsonPath | boolean: descriptor.booleanYes:descriptor.booleanNo | translate }}\n </ng-template>\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeEnum\">\n {{ item | jsonPath: jsonPath | enum: descriptor.enumType:descriptor.enumTitlePath:descriptor.enumNameAsValue | translate }}\n </ng-container>\n <ng-container *ngSwitchCase=\"columnTypeCustom\">\n <ng-container\n [mngComponent]=\"descriptor.customComponentType!\"\n [inputs]=\"{\n value: item | jsonPath: jsonPath,\n item: item,\n descriptor: descriptor\n }\"></ng-container>\n </ng-container>\n</ng-container>\n<div class=\"help-buttons\" *ngIf=\"descriptor.hasCopyToClipboard\">\n <button pButton pRipple type=\"button\" icon=\"pi pi-copy\" class=\"p-button-rounded p-button-info p-button-sm\" (click)=\"copyToClipboard($event)\"></button>\n</div>\n", styles: [":host{display:inline-block;overflow:hidden}:host.nowrap{white-space:nowrap;text-overflow:ellipsis}.help-buttons{display:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}.help-buttons .p-button{height:1.9rem;width:1.9rem;padding:0}\n"] }]
|
|
9398
9410
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i2$1.MessageService }, { type: i2.TranslateService }]; }, propDecorators: { descriptor: [{
|
|
9399
9411
|
type: Input
|
|
9400
9412
|
}], item: [{
|