@coolon/angular-ui-powerups 16.1.0-aplpha.73 → 16.1.0-aplpha.75
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/assets/form.scss +6 -0
- package/esm2022/lib/components/commands/command/command.component.mjs +23 -9
- package/esm2022/lib/components/commands/command-face.mjs +1 -1
- package/esm2022/lib/components/forms/password-input/password-input.component.mjs +40 -3
- package/esm2022/lib/components/forms/string-input/string-input.component.mjs +21 -9
- package/esm2022/lib/components/tables/renderer/default-cell-renderer/default-cell-renderer.component.mjs +3 -3
- package/esm2022/lib/interaction/components/input-activities/string-input-activity.mjs +1 -1
- package/fesm2022/coolon-angular-ui-powerups.mjs +78 -17
- package/fesm2022/coolon-angular-ui-powerups.mjs.map +1 -1
- package/lib/components/commands/command/command.component.d.ts +2 -1
- package/lib/components/commands/command-face.d.ts +5 -7
- package/lib/components/forms/password-input/password-input.component.d.ts +7 -1
- package/lib/components/forms/string-input/string-input.component.d.ts +3 -1
- package/package.json +2 -2
|
@@ -1131,14 +1131,24 @@ class CommandComponent extends PopupAwareComponent {
|
|
|
1131
1131
|
activeFace$;
|
|
1132
1132
|
iconOnly$;
|
|
1133
1133
|
tooltip$;
|
|
1134
|
+
visible$;
|
|
1134
1135
|
constructor(element, parent) {
|
|
1135
1136
|
super(element, parent);
|
|
1136
1137
|
const { chain, switchOn } = Dsl.disposeWith(this);
|
|
1137
|
-
this.faces$ = chain(this.command.busy$)
|
|
1138
|
+
this.faces$ = chain(this.command.busy$)
|
|
1139
|
+
.mapToList(busy => {
|
|
1138
1140
|
return busy ?
|
|
1139
|
-
[this.busyFace$.value, this.face$.value] :
|
|
1140
|
-
[this.face$.value, this.busyFace$.value];
|
|
1141
|
-
}, {
|
|
1141
|
+
[this.busyFace$.value ?? this.command.busyFace$.value, this.face$.value ?? this.command.defaultFace$.value] :
|
|
1142
|
+
[this.face$.value ?? this.command.defaultFace$.value, this.busyFace$.value ?? this.command.busyFace$.value];
|
|
1143
|
+
}, {
|
|
1144
|
+
allowNil: true,
|
|
1145
|
+
dependsOn: [
|
|
1146
|
+
this.face$,
|
|
1147
|
+
this.busyFace$,
|
|
1148
|
+
this.command.defaultFace$,
|
|
1149
|
+
this.command.busyFace$
|
|
1150
|
+
]
|
|
1151
|
+
})
|
|
1142
1152
|
.rejectNil();
|
|
1143
1153
|
this.activeFace$ = this.faces$.first();
|
|
1144
1154
|
this.buttonStyle$ = chain(this.activeFace$).map(f => CommandFace.getStyleOf(f));
|
|
@@ -1147,18 +1157,19 @@ class CommandComponent extends PopupAwareComponent {
|
|
|
1147
1157
|
this.iconOnly$ = this.faces$.select(face => {
|
|
1148
1158
|
return isEmpty(CommandFace.getTextOf(face)) && !isEmpty(CommandFace.getIconOf(face));
|
|
1149
1159
|
}).count().equals(this.faces$.count());
|
|
1160
|
+
this.visible$ = chain(this.command.visible$);
|
|
1161
|
+
}
|
|
1162
|
+
get cssDisplayProperty() {
|
|
1163
|
+
return this.visible$.value ? undefined : 'none';
|
|
1150
1164
|
}
|
|
1151
1165
|
isActive(face) {
|
|
1152
1166
|
return this.activeFace$.query().equals(face);
|
|
1153
1167
|
}
|
|
1154
|
-
getFace() {
|
|
1155
|
-
return this.face;
|
|
1156
|
-
}
|
|
1157
1168
|
requestFocus() {
|
|
1158
1169
|
this.button.focus();
|
|
1159
1170
|
}
|
|
1160
1171
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.9", ngImport: i0, type: CommandComponent, deps: [{ token: i0.ElementRef }, { token: POPUP_CONTAINER, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
1161
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.9", type: CommandComponent, selector: "aup-command", inputs: { command: "command", face$: "face$", face: "face", busyFace$: "busyFace$", busyFace: "busyFace", alignFace: "alignFace" }, host: { properties: { "class": "this.alignFace" } }, viewQueries: [{ propertyName: "button", first: true, predicate: MatButton, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"iconOnly$.value\">\n <button mat-icon-button [pectinCommand]=\"command\" [color]=\"color$.value\" [class.busy]=\"command.busy$.value\"\n [matTooltip]=\"tooltip$.value\">\n <aup-command-face [class]=\"alignFace\" [faces]=\"faces$.value\"></aup-command-face>\n </button>\n</ng-container>\n<ng-container *ngIf=\"!iconOnly$.value\">\n <ng-container [ngSwitch]=\"buttonStyle$.value\">\n <ng-container *ngSwitchCase=\"CommandFace.Style.STROKED\">\n <button mat-stroked-button [pectinCommand]=\"command\" [color]=\"color$.value\" [class.busy]=\"command.busy$.value\"\n [matTooltip]=\"tooltip$.value\">\n <aup-command-face [class]=\"alignFace\" [faces]=\"faces$.value\"></aup-command-face>\n </button>\n </ng-container>\n <ng-container *ngSwitchCase=\"CommandFace.Style.RAISED\">\n <button mat-raised-button [pectinCommand]=\"command\" [color]=\"color$.value\" [class.busy]=\"command.busy$.value\"\n [matTooltip]=\"tooltip$.value\">\n <aup-command-face [class]=\"alignFace\" [faces]=\"faces$.value\"></aup-command-face>\n </button>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <button mat-button [pectinCommand]=\"command\" [color]=\"color$.value\" [class.busy]=\"command.busy$.value\"\n [matTooltip]=\"tooltip$.value\">\n <aup-command-face [class]=\"alignFace\" [faces]=\"faces$.value\"></aup-command-face>\n </button>\n </ng-container>\n </ng-container>\n</ng-container>\n", styles: [":host{display:inline-flex;flex-direction:row;justify-content:stretch}:host.centered button{text-align:center}:host.start button{text-align:start}:host.end button{text-align:end}button{flex:1}\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: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: CommandDirective, selector: "[pectinCommand]", inputs: ["pectinCommand", "commandParameter"] }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: CommandFaceComponent, selector: "aup-command-face", inputs: ["faces", "face", "ignoreIcon", "ignoreText", "includeMissingIconInLayout"] }] });
|
|
1172
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.9", type: CommandComponent, selector: "aup-command", inputs: { command: "command", face$: "face$", face: "face", busyFace$: "busyFace$", busyFace: "busyFace", alignFace: "alignFace" }, host: { properties: { "class": "this.alignFace", "style.display": "this.cssDisplayProperty" } }, viewQueries: [{ propertyName: "button", first: true, predicate: MatButton, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"iconOnly$.value\">\n <button mat-icon-button [pectinCommand]=\"command\" [color]=\"color$.value\" [class.busy]=\"command.busy$.value\"\n [matTooltip]=\"tooltip$.value\">\n <aup-command-face [class]=\"alignFace\" [faces]=\"faces$.value\"></aup-command-face>\n </button>\n</ng-container>\n<ng-container *ngIf=\"!iconOnly$.value\">\n <ng-container [ngSwitch]=\"buttonStyle$.value\">\n <ng-container *ngSwitchCase=\"CommandFace.Style.STROKED\">\n <button mat-stroked-button [pectinCommand]=\"command\" [color]=\"color$.value\" [class.busy]=\"command.busy$.value\"\n [matTooltip]=\"tooltip$.value\">\n <aup-command-face [class]=\"alignFace\" [faces]=\"faces$.value\"></aup-command-face>\n </button>\n </ng-container>\n <ng-container *ngSwitchCase=\"CommandFace.Style.RAISED\">\n <button mat-raised-button [pectinCommand]=\"command\" [color]=\"color$.value\" [class.busy]=\"command.busy$.value\"\n [matTooltip]=\"tooltip$.value\">\n <aup-command-face [class]=\"alignFace\" [faces]=\"faces$.value\"></aup-command-face>\n </button>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <button mat-button [pectinCommand]=\"command\" [color]=\"color$.value\" [class.busy]=\"command.busy$.value\"\n [matTooltip]=\"tooltip$.value\">\n <aup-command-face [class]=\"alignFace\" [faces]=\"faces$.value\"></aup-command-face>\n </button>\n </ng-container>\n </ng-container>\n</ng-container>\n", styles: [":host{display:inline-flex;flex-direction:row;justify-content:stretch}:host.centered button{text-align:center}:host.start button{text-align:start}:host.end button{text-align:end}button{flex:1}\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: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: CommandDirective, selector: "[pectinCommand]", inputs: ["pectinCommand", "commandParameter"] }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: CommandFaceComponent, selector: "aup-command-face", inputs: ["faces", "face", "ignoreIcon", "ignoreText", "includeMissingIconInLayout"] }] });
|
|
1162
1173
|
}
|
|
1163
1174
|
__decorate([
|
|
1164
1175
|
Proxify(),
|
|
@@ -1206,6 +1217,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.9", ngImpor
|
|
|
1206
1217
|
}], button: [{
|
|
1207
1218
|
type: ViewChild,
|
|
1208
1219
|
args: [MatButton]
|
|
1220
|
+
}], cssDisplayProperty: [{
|
|
1221
|
+
type: HostBinding,
|
|
1222
|
+
args: ["style.display"]
|
|
1209
1223
|
}] } });
|
|
1210
1224
|
|
|
1211
1225
|
/**
|
|
@@ -2251,17 +2265,51 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.9", ngImpor
|
|
|
2251
2265
|
|
|
2252
2266
|
class PasswordInputComponent extends AbstractValueInputComponent {
|
|
2253
2267
|
autocomplete;
|
|
2268
|
+
#enableShowPassword$_accessor_storage = proxify((ValueModel));
|
|
2269
|
+
get enableShowPassword$() { return this.#enableShowPassword$_accessor_storage; }
|
|
2270
|
+
set enableShowPassword$(value) { this.#enableShowPassword$_accessor_storage = value; }
|
|
2271
|
+
#enableShowPassword_accessor_storage = false;
|
|
2272
|
+
get enableShowPassword() { return this.#enableShowPassword_accessor_storage; }
|
|
2273
|
+
set enableShowPassword(value) { this.#enableShowPassword_accessor_storage = value; }
|
|
2274
|
+
showPassword$ = new MutableValueModel(false);
|
|
2275
|
+
toggleShowPasswordCommand;
|
|
2254
2276
|
constructor() {
|
|
2255
2277
|
super();
|
|
2278
|
+
const { chain, valueOf } = Dsl.disposeWith(this);
|
|
2279
|
+
const face$ = chain(this.showPassword$).map(show => {
|
|
2280
|
+
return {
|
|
2281
|
+
icon: () => show ? "mat:visibility_off" : "mat:visibility"
|
|
2282
|
+
};
|
|
2283
|
+
});
|
|
2284
|
+
this.toggleShowPasswordCommand = Command.create(() => {
|
|
2285
|
+
this.showPassword$.value = !this.showPassword$.value;
|
|
2286
|
+
})
|
|
2287
|
+
.withFace(face$)
|
|
2288
|
+
.enableWhile(chain.stringValue(this.componentValue$).isNotBlank());
|
|
2289
|
+
}
|
|
2290
|
+
get fieldType() {
|
|
2291
|
+
return this.showPassword$.value ? "text" : "password";
|
|
2256
2292
|
}
|
|
2257
2293
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.9", ngImport: i0, type: PasswordInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2258
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.9", type: PasswordInputComponent, selector: "aup-password-input", inputs: { autocomplete: "autocomplete" }, usesInheritance: true, ngImport: i0, template: "<mat-form-field [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"
|
|
2294
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.9", type: PasswordInputComponent, selector: "aup-password-input", inputs: { autocomplete: "autocomplete", enableShowPassword$: "enableShowPassword$", enableShowPassword: "enableShowPassword" }, usesInheritance: true, ngImport: i0, template: "<mat-form-field [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input [type]=\"fieldType\"\n matInput\n placeholder=\"{{placeholder}}\"\n [attr.autocomplete]=\"autocomplete\"\n [(ngModel)]=\"componentValue$.value\"\n [disabled]=\"!enabled$.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n <span matSuffix *ngIf=\"enableShowPassword$.value\">\n <aup-command [command]=\"toggleShowPasswordCommand\"></aup-command>\n </span>\n</mat-form-field>\n\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$4.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: i2$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.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: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: FocusBindingDirective, selector: "[pectinFocusBinding]", inputs: ["pectinFocusBinding", "focusBindingTarget"] }, { kind: "component", type: CommandComponent, selector: "aup-command", inputs: ["command", "face$", "face", "busyFace$", "busyFace", "alignFace"] }] });
|
|
2259
2295
|
}
|
|
2296
|
+
__decorate([
|
|
2297
|
+
Proxify(),
|
|
2298
|
+
__metadata("design:type", Object)
|
|
2299
|
+
], PasswordInputComponent.prototype, "enableShowPassword$", null);
|
|
2300
|
+
__decorate([
|
|
2301
|
+
StoreInValueModel(),
|
|
2302
|
+
__metadata("design:type", Object)
|
|
2303
|
+
], PasswordInputComponent.prototype, "enableShowPassword", null);
|
|
2260
2304
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.9", ngImport: i0, type: PasswordInputComponent, decorators: [{
|
|
2261
2305
|
type: Component,
|
|
2262
|
-
args: [{ selector: 'aup-password-input', template: "<mat-form-field [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"
|
|
2306
|
+
args: [{ selector: 'aup-password-input', template: "<mat-form-field [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input [type]=\"fieldType\"\n matInput\n placeholder=\"{{placeholder}}\"\n [attr.autocomplete]=\"autocomplete\"\n [(ngModel)]=\"componentValue$.value\"\n [disabled]=\"!enabled$.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n <span matSuffix *ngIf=\"enableShowPassword$.value\">\n <aup-command [command]=\"toggleShowPasswordCommand\"></aup-command>\n </span>\n</mat-form-field>\n\n" }]
|
|
2263
2307
|
}], ctorParameters: function () { return []; }, propDecorators: { autocomplete: [{
|
|
2264
2308
|
type: Input
|
|
2309
|
+
}], enableShowPassword$: [{
|
|
2310
|
+
type: Input
|
|
2311
|
+
}], enableShowPassword: [{
|
|
2312
|
+
type: Input
|
|
2265
2313
|
}] } });
|
|
2266
2314
|
|
|
2267
2315
|
class SearchInputComponent extends AbstractValueInputComponent {
|
|
@@ -2412,17 +2460,24 @@ class StringInputComponent extends AbstractValueInputComponent {
|
|
|
2412
2460
|
get enableClear() { return this.#enableClear_accessor_storage; }
|
|
2413
2461
|
set enableClear(value) { this.#enableClear_accessor_storage = value; }
|
|
2414
2462
|
iconPrefix;
|
|
2463
|
+
#suffixCommand_accessor_storage = proxify(Command);
|
|
2464
|
+
get suffixCommand() { return this.#suffixCommand_accessor_storage; }
|
|
2465
|
+
set suffixCommand(value) { this.#suffixCommand_accessor_storage = value; }
|
|
2415
2466
|
clearCommand;
|
|
2416
2467
|
constructor() {
|
|
2417
2468
|
super();
|
|
2418
2469
|
const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
|
|
2419
2470
|
this.clearCommand = Command.create(() => {
|
|
2420
2471
|
this.componentValue$.value = "";
|
|
2421
|
-
})
|
|
2422
|
-
|
|
2472
|
+
})
|
|
2473
|
+
.withFace({ icon: () => "mat:clear" })
|
|
2474
|
+
.enableWhile(chain.stringValue(this.componentValue$).isNotBlank());
|
|
2475
|
+
}
|
|
2476
|
+
get hasSuffixCommand() {
|
|
2477
|
+
return Proxify.hasTarget(this.suffixCommand);
|
|
2423
2478
|
}
|
|
2424
2479
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.9", ngImport: i0, type: StringInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2425
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.9", type: StringInputComponent, selector: "aup-string-input", inputs: { autocomplete: "autocomplete", enableClear$: "enableClear$", enableClear: "enableClear", iconPrefix: "iconPrefix" }, usesInheritance: true, ngImport: i0, template: "<mat-form-field [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input matInput\n placeholder=\"{{placeholder}}\"\n [attr.autocomplete]=\"autocomplete\"\n [(ngModel)]=\"componentValue$.value\"\n [disabled]=\"!enabled$.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n <aup-icon *ngIf=\"iconPrefix\" matPrefix [icon]=\"iconPrefix\"></aup-icon>\n <
|
|
2480
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.9", type: StringInputComponent, selector: "aup-string-input", inputs: { autocomplete: "autocomplete", enableClear$: "enableClear$", enableClear: "enableClear", iconPrefix: "iconPrefix", suffixCommand: "suffixCommand" }, usesInheritance: true, ngImport: i0, template: "<mat-form-field [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input matInput\n placeholder=\"{{placeholder}}\"\n [attr.autocomplete]=\"autocomplete\"\n [(ngModel)]=\"componentValue$.value\"\n [disabled]=\"!enabled$.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n <aup-icon *ngIf=\"iconPrefix\" matPrefix [icon]=\"iconPrefix\"></aup-icon>\n <span matSuffix>\n <aup-command *ngIf=\"enableClear\" [command]=\"clearCommand\"></aup-command>\n <aup-command *ngIf=\"hasSuffixCommand\" [command]=\"suffixCommand\"></aup-command>\n </span>\n</mat-form-field>\n\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$4.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: i2$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.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: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: FocusBindingDirective, selector: "[pectinFocusBinding]", inputs: ["pectinFocusBinding", "focusBindingTarget"] }, { kind: "component", type: IconComponent, selector: "aup-icon", inputs: ["icon"] }, { kind: "component", type: CommandComponent, selector: "aup-command", inputs: ["command", "face$", "face", "busyFace$", "busyFace", "alignFace"] }] });
|
|
2426
2481
|
}
|
|
2427
2482
|
__decorate([
|
|
2428
2483
|
Proxify(),
|
|
@@ -2432,9 +2487,13 @@ __decorate([
|
|
|
2432
2487
|
StoreInValueModel(),
|
|
2433
2488
|
__metadata("design:type", Object)
|
|
2434
2489
|
], StringInputComponent.prototype, "enableClear", null);
|
|
2490
|
+
__decorate([
|
|
2491
|
+
Proxify(),
|
|
2492
|
+
__metadata("design:type", Command)
|
|
2493
|
+
], StringInputComponent.prototype, "suffixCommand", null);
|
|
2435
2494
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.9", ngImport: i0, type: StringInputComponent, decorators: [{
|
|
2436
2495
|
type: Component,
|
|
2437
|
-
args: [{ selector: 'aup-string-input', template: "<mat-form-field [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input matInput\n placeholder=\"{{placeholder}}\"\n [attr.autocomplete]=\"autocomplete\"\n [(ngModel)]=\"componentValue$.value\"\n [disabled]=\"!enabled$.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n <aup-icon *ngIf=\"iconPrefix\" matPrefix [icon]=\"iconPrefix\"></aup-icon>\n <
|
|
2496
|
+
args: [{ selector: 'aup-string-input', template: "<mat-form-field [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input matInput\n placeholder=\"{{placeholder}}\"\n [attr.autocomplete]=\"autocomplete\"\n [(ngModel)]=\"componentValue$.value\"\n [disabled]=\"!enabled$.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n <aup-icon *ngIf=\"iconPrefix\" matPrefix [icon]=\"iconPrefix\"></aup-icon>\n <span matSuffix>\n <aup-command *ngIf=\"enableClear\" [command]=\"clearCommand\"></aup-command>\n <aup-command *ngIf=\"hasSuffixCommand\" [command]=\"suffixCommand\"></aup-command>\n </span>\n</mat-form-field>\n\n" }]
|
|
2438
2497
|
}], ctorParameters: function () { return []; }, propDecorators: { autocomplete: [{
|
|
2439
2498
|
type: Input
|
|
2440
2499
|
}], enableClear$: [{
|
|
@@ -2443,6 +2502,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.9", ngImpor
|
|
|
2443
2502
|
type: Input
|
|
2444
2503
|
}], iconPrefix: [{
|
|
2445
2504
|
type: Input
|
|
2505
|
+
}], suffixCommand: [{
|
|
2506
|
+
type: Input
|
|
2446
2507
|
}] } });
|
|
2447
2508
|
|
|
2448
2509
|
class TextInputComponent extends AbstractValueInputComponent {
|
|
@@ -3397,11 +3458,11 @@ class DefaultCellRendererComponent {
|
|
|
3397
3458
|
return this._value;
|
|
3398
3459
|
}
|
|
3399
3460
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.9", ngImport: i0, type: DefaultCellRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3400
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.9", type: DefaultCellRendererComponent, selector: "aup-default-cell-renderer", inputs: { value: "value" }, ngImport: i0, template: "<span [innerHTML]=\"value| aupHighlight\"></span>\n", styles: [""], dependencies: [{ kind: "pipe", type: HighlightPipe, name: "aupHighlight" }] });
|
|
3461
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.9", type: DefaultCellRendererComponent, selector: "aup-default-cell-renderer", inputs: { value: "value" }, ngImport: i0, template: "<span [innerHTML]=\"value?.toString()| aupHighlight\"></span>\n", styles: [""], dependencies: [{ kind: "pipe", type: HighlightPipe, name: "aupHighlight" }] });
|
|
3401
3462
|
}
|
|
3402
3463
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.9", ngImport: i0, type: DefaultCellRendererComponent, decorators: [{
|
|
3403
3464
|
type: Component,
|
|
3404
|
-
args: [{ selector: "aup-default-cell-renderer", template: "<span [innerHTML]=\"value| aupHighlight\"></span>\n" }]
|
|
3465
|
+
args: [{ selector: "aup-default-cell-renderer", template: "<span [innerHTML]=\"value?.toString()| aupHighlight\"></span>\n" }]
|
|
3405
3466
|
}], propDecorators: { value: [{
|
|
3406
3467
|
type: Input
|
|
3407
3468
|
}] } });
|
|
@@ -10293,7 +10354,7 @@ class StringInputActivity extends InputActivity {
|
|
|
10293
10354
|
[confirmFace]="confirmFace"
|
|
10294
10355
|
[cancelFace]="cancelFace"
|
|
10295
10356
|
></aup-activity-actions>
|
|
10296
|
-
`, isInline: true, dependencies: [{ kind: "component", type: StringInputComponent, selector: "aup-string-input", inputs: ["autocomplete", "enableClear$", "enableClear", "iconPrefix"] }, { kind: "component", type: ActivityActionsComponent, selector: "aup-activity-actions", inputs: ["confirmCommand", "cancelCommand", "faces", "confirmFace", "cancelFace", "style", "layout", "align"] }] });
|
|
10357
|
+
`, isInline: true, dependencies: [{ kind: "component", type: StringInputComponent, selector: "aup-string-input", inputs: ["autocomplete", "enableClear$", "enableClear", "iconPrefix", "suffixCommand"] }, { kind: "component", type: ActivityActionsComponent, selector: "aup-activity-actions", inputs: ["confirmCommand", "cancelCommand", "faces", "confirmFace", "cancelFace", "style", "layout", "align"] }] });
|
|
10297
10358
|
}
|
|
10298
10359
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.9", ngImport: i0, type: StringInputActivity, decorators: [{
|
|
10299
10360
|
type: Component,
|