@kms-ngx-ui/presentational 18.5.2 → 18.5.4
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/esm2022/assets/icons.json +1 -1
- package/esm2022/lib/ui/button/button.component.mjs +4 -3
- package/esm2022/lib/ui/enum-radiogroup/enum-radiogroup.component.mjs +3 -3
- package/esm2022/lib/ui/file-input/file-input.component.mjs +3 -3
- package/esm2022/lib/ui/icon/icon.component.mjs +3 -3
- package/esm2022/lib/ui/password/password.component.mjs +5 -4
- package/esm2022/lib/ui/radiobutton/radiobutton.component.mjs +3 -3
- package/esm2022/lib/ui/salutation-dropdown/salutation-dropdown.component.mjs +4 -4
- package/esm2022/lib/ui/salutation-radiogroup/salutation-radiogroup.component.mjs +3 -3
- package/esm2022/lib/ui/time-input/time-input.component.mjs +8 -4
- package/esm2022/lib/ui/yes-no-radiogroup/yes-no-radiogroup.component.mjs +3 -3
- package/fesm2022/kms-ngx-ui-presentational.mjs +28 -22
- package/fesm2022/kms-ngx-ui-presentational.mjs.map +1 -1
- package/lib/ui/button/button.component.d.ts +2 -1
- package/lib/ui/password/password.component.d.ts +1 -1
- package/lib/ui/salutation-dropdown/salutation-dropdown.component.d.ts +1 -1
- package/lib/ui/time-input/time-input.component.d.ts +1 -0
- package/package.json +1 -1
- package/src/assets/icons.json +1 -1
- package/src/assets/sprite.svg +1 -1
- package/src/lib/ui/button/button.component.scss +7 -0
|
@@ -636,11 +636,11 @@ class IconComponent {
|
|
|
636
636
|
this.Version = VERSION.full;
|
|
637
637
|
}
|
|
638
638
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: IconComponent, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
639
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: IconComponent, selector: "kms-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconClass: { classPropertyName: "iconClass", publicName: "iconClass", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, dontUseSprite: { classPropertyName: "dontUseSprite", publicName: "dontUseSprite", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ng-container *ngIf=\"icon() !== 'none' && dontUseSprite() === false\">\n <span\n class=\"icon\"\n [ngClass]=\"iconClass()\"\n [ngStyle]=\"{\n color: 'var(' + color() + ')'\n }\"\n [style.width.px]=\"size()\"\n [style.height.px]=\"size()\"\n >\n <svg [style.width.px]=\"size()\" [style.height.px]=\"size()\">\n <use\n [attr.xlink:href]=\"\n 'assets/sprite.svg?Version=' + Version + '#' + icon()\n \"\n ></use>\n </svg>\n </span>\n</ng-container>\n<ng-container *ngIf=\"icon() !== 'none' && dontUseSprite() === true\">\n <object\n [data]=\"\n sanitizer.bypassSecurityTrustResourceUrl('assets/icons/' + icon() + '')\n \"\n type=\"image/svg+xml\"\n class=\"icon\"\n [ngClass]=\"iconClass()\"\n
|
|
639
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: IconComponent, selector: "kms-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconClass: { classPropertyName: "iconClass", publicName: "iconClass", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, dontUseSprite: { classPropertyName: "dontUseSprite", publicName: "dontUseSprite", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ng-container *ngIf=\"icon() !== 'none' && dontUseSprite() === false\">\n <span\n class=\"icon\"\n [ngClass]=\"iconClass()\"\n [ngStyle]=\"{\n color: 'var(' + color() + ')'\n }\"\n [style.width.px]=\"size()\"\n [style.height.px]=\"size()\"\n >\n <svg [style.width.px]=\"size()\" [style.height.px]=\"size()\">\n <use\n [attr.xlink:href]=\"\n 'assets/sprite.svg?Version=' + Version + '#' + icon()\n \"\n ></use>\n </svg>\n </span>\n</ng-container>\n<ng-container *ngIf=\"icon() !== 'none' && dontUseSprite() === true\">\n <object\n [data]=\"\n sanitizer.bypassSecurityTrustResourceUrl('assets/icons/' + icon() + '')\n \"\n type=\"image/svg+xml\"\n class=\"icon\"\n [ngClass]=\"iconClass()\"\n ></object>\n</ng-container>\n", styles: [":root{--kms-primary: #162f43;--kms-primary-50: #0f2334;--kms-primary-100: #162f43;--kms-primary-200: #26415e;--kms-primary-300: #375e79;--kms-primary-400: #4b7a94;--kms-primary-500: #5f97af;--kms-primary-600: #7cb3ca;--kms-primary-700: #9acfe5;--kms-primary-800: #b8ebff;--kms-primary-900: #d6f7ff;--kms-secondary: #48acd1;--kms-tertiary: #43403e;--kms-tertiary-50: #1e1d1c;--kms-tertiary-100: #43403e;--kms-tertiary-200: #54524f;--kms-tertiary-300: #6c6a67;--kms-tertiary-400: #97938f;--kms-tertiary-500: #c2beb9;--kms-tertiary-600: #e3e1df;--kms-tertiary-700: #eeedec;--kms-tertiary-800: #f4f3f2;--kms-tertiary-900: #ffffff;--kms-success: #39b948;--kms-alert: #e5c936;--kms-error: #c3293b;--kms-disabled: #a6a6a6;--kms-background: #fafafa;--kms-white: #ffffff;--kms-black: #000000;--kms-border-grey: #101423;--kms-green: #008000;--kms-light-green: #00c800;--kms-font-green: #27ae60}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
640
640
|
}
|
|
641
641
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: IconComponent, decorators: [{
|
|
642
642
|
type: Component,
|
|
643
|
-
args: [{ selector: 'kms-icon', template: "<ng-container *ngIf=\"icon() !== 'none' && dontUseSprite() === false\">\n <span\n class=\"icon\"\n [ngClass]=\"iconClass()\"\n [ngStyle]=\"{\n color: 'var(' + color() + ')'\n }\"\n [style.width.px]=\"size()\"\n [style.height.px]=\"size()\"\n >\n <svg [style.width.px]=\"size()\" [style.height.px]=\"size()\">\n <use\n [attr.xlink:href]=\"\n 'assets/sprite.svg?Version=' + Version + '#' + icon()\n \"\n ></use>\n </svg>\n </span>\n</ng-container>\n<ng-container *ngIf=\"icon() !== 'none' && dontUseSprite() === true\">\n <object\n [data]=\"\n sanitizer.bypassSecurityTrustResourceUrl('assets/icons/' + icon() + '')\n \"\n type=\"image/svg+xml\"\n class=\"icon\"\n [ngClass]=\"iconClass()\"\n
|
|
643
|
+
args: [{ selector: 'kms-icon', template: "<ng-container *ngIf=\"icon() !== 'none' && dontUseSprite() === false\">\n <span\n class=\"icon\"\n [ngClass]=\"iconClass()\"\n [ngStyle]=\"{\n color: 'var(' + color() + ')'\n }\"\n [style.width.px]=\"size()\"\n [style.height.px]=\"size()\"\n >\n <svg [style.width.px]=\"size()\" [style.height.px]=\"size()\">\n <use\n [attr.xlink:href]=\"\n 'assets/sprite.svg?Version=' + Version + '#' + icon()\n \"\n ></use>\n </svg>\n </span>\n</ng-container>\n<ng-container *ngIf=\"icon() !== 'none' && dontUseSprite() === true\">\n <object\n [data]=\"\n sanitizer.bypassSecurityTrustResourceUrl('assets/icons/' + icon() + '')\n \"\n type=\"image/svg+xml\"\n class=\"icon\"\n [ngClass]=\"iconClass()\"\n ></object>\n</ng-container>\n", styles: [":root{--kms-primary: #162f43;--kms-primary-50: #0f2334;--kms-primary-100: #162f43;--kms-primary-200: #26415e;--kms-primary-300: #375e79;--kms-primary-400: #4b7a94;--kms-primary-500: #5f97af;--kms-primary-600: #7cb3ca;--kms-primary-700: #9acfe5;--kms-primary-800: #b8ebff;--kms-primary-900: #d6f7ff;--kms-secondary: #48acd1;--kms-tertiary: #43403e;--kms-tertiary-50: #1e1d1c;--kms-tertiary-100: #43403e;--kms-tertiary-200: #54524f;--kms-tertiary-300: #6c6a67;--kms-tertiary-400: #97938f;--kms-tertiary-500: #c2beb9;--kms-tertiary-600: #e3e1df;--kms-tertiary-700: #eeedec;--kms-tertiary-800: #f4f3f2;--kms-tertiary-900: #ffffff;--kms-success: #39b948;--kms-alert: #e5c936;--kms-error: #c3293b;--kms-disabled: #a6a6a6;--kms-background: #fafafa;--kms-white: #ffffff;--kms-black: #000000;--kms-border-grey: #101423;--kms-green: #008000;--kms-light-green: #00c800;--kms-font-green: #27ae60}\n"] }]
|
|
644
644
|
}], ctorParameters: () => [{ type: i1$3.DomSanitizer }] });
|
|
645
645
|
|
|
646
646
|
class TooltipIconComponent {
|
|
@@ -758,7 +758,7 @@ class EnumRadiogroupComponent extends FormControlParentComponent {
|
|
|
758
758
|
useExisting: forwardRef(() => EnumRadiogroupComponent),
|
|
759
759
|
multi: true,
|
|
760
760
|
},
|
|
761
|
-
], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n
|
|
761
|
+
], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n <div>{{ header }}</div>\n <mat-radio-group formControlName=\"enumData\" [disabled]=\"disabled\" #child>\n <mat-radio-button\n [value]=\"choice\"\n [checked]=\"value === choice\"\n *ngFor=\"let choice of optionValues\"\n >{{ translationPrefix + '.' + choice | translate }}</mat-radio-button\n >\n </mat-radio-group>\n</form>\n", dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i2$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }] }); }
|
|
762
762
|
}
|
|
763
763
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EnumRadiogroupComponent, decorators: [{
|
|
764
764
|
type: Component,
|
|
@@ -768,7 +768,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
768
768
|
useExisting: forwardRef(() => EnumRadiogroupComponent),
|
|
769
769
|
multi: true,
|
|
770
770
|
},
|
|
771
|
-
], template: "<form [formGroup]=\"form\">\n
|
|
771
|
+
], template: "<form [formGroup]=\"form\">\n <div>{{ header }}</div>\n <mat-radio-group formControlName=\"enumData\" [disabled]=\"disabled\" #child>\n <mat-radio-button\n [value]=\"choice\"\n [checked]=\"value === choice\"\n *ngFor=\"let choice of optionValues\"\n >{{ translationPrefix + '.' + choice | translate }}</mat-radio-button\n >\n </mat-radio-group>\n</form>\n" }]
|
|
772
772
|
}], ctorParameters: () => [{ type: i1$1.UntypedFormBuilder }, { type: i0.Renderer2 }], propDecorators: { header: [{
|
|
773
773
|
type: Input
|
|
774
774
|
}], optionsEnum: [{
|
|
@@ -978,7 +978,7 @@ class FileInputComponent {
|
|
|
978
978
|
useExisting: forwardRef(() => FileInputComponent),
|
|
979
979
|
multi: true,
|
|
980
980
|
},
|
|
981
|
-
], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<form [formGroup]=\"form\" (change)=\"newImageLoading=true\" class=\"fileInput\"
|
|
981
|
+
], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<form [formGroup]=\"form\" (change)=\"newImageLoading = true\" class=\"fileInput\">\n <div *ngIf=\"form.value.Filename && previewImage\">\n <div *ngIf=\"newImageLoading\">\n {{ 'file-input.loading' | translate }}\n </div>\n <div *ngIf=\"!newImageLoading\">\n <div class=\"\">\n <div class=\"\">\n <img\n *ngIf=\"\n form.value.ImageLink &&\n form.value.ImageLink !== '' &&\n !(form.value.ImageAsDataURL && form.value.ImageAsDataURL !== '')\n \"\n [src]=\"form.value.ImageAsDataURL\"\n [src]=\"form.value.ImageLink\"\n style=\"height: 40px; width: fit-content\"\n />\n <img\n *ngIf=\"\n form.value.ImageAsDataURL && form.value.ImageAsDataURL !== ''\n \"\n [src]=\"form.value.ImageAsDataURL\"\n style=\"height: 40px; width: fit-content\"\n />\n </div>\n <div class=\"\">{{ form.value.Filename }}</div>\n <div class=\"\">\n <div (click)=\"removeFromList()\" *ngIf=\"allowRemove\">\n <kms-icon\n icon=\"trash\"\n [size]=\"IconSizePx.XS\"\n iconClass=\"color-black\"\n ></kms-icon>\n {{ 'file-input.remove' }}\n </div>\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"!previewImage\">\n <div class=\"\">{{ form.value.Filename }}</div>\n </div>\n\n <button\n (click)=\"selectImageOverlay()\"\n class=\"button-primary-font-color\"\n mat-stroked-button\n >\n <span>{{ label }}</span>\n </button>\n <input\n type=\"file\"\n [accept]=\"acceptedFileMimetypes\"\n style=\"display: none\"\n #fileInput\n (click)=\"clearInputValue($event)\"\n (change)=\"selectImage($event)\"\n />\n\n <input type=\"hidden\" formControlName=\"ImageIdent\" />\n <input type=\"hidden\" formControlName=\"ImageLink\" />\n <input type=\"hidden\" formControlName=\"Filename\" />\n <input type=\"hidden\" formControlName=\"ImageAsDataURL\" />\n <input type=\"hidden\" formControlName=\"Text\" />\n</form>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: IconComponent, selector: "kms-icon", inputs: ["icon", "iconClass", "size", "dontUseSprite", "color"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }] }); }
|
|
982
982
|
}
|
|
983
983
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FileInputComponent, decorators: [{
|
|
984
984
|
type: Component,
|
|
@@ -993,7 +993,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
993
993
|
useExisting: forwardRef(() => FileInputComponent),
|
|
994
994
|
multi: true,
|
|
995
995
|
},
|
|
996
|
-
], template: "<form [formGroup]=\"form\" (change)=\"newImageLoading=true\" class=\"fileInput\"
|
|
996
|
+
], template: "<form [formGroup]=\"form\" (change)=\"newImageLoading = true\" class=\"fileInput\">\n <div *ngIf=\"form.value.Filename && previewImage\">\n <div *ngIf=\"newImageLoading\">\n {{ 'file-input.loading' | translate }}\n </div>\n <div *ngIf=\"!newImageLoading\">\n <div class=\"\">\n <div class=\"\">\n <img\n *ngIf=\"\n form.value.ImageLink &&\n form.value.ImageLink !== '' &&\n !(form.value.ImageAsDataURL && form.value.ImageAsDataURL !== '')\n \"\n [src]=\"form.value.ImageAsDataURL\"\n [src]=\"form.value.ImageLink\"\n style=\"height: 40px; width: fit-content\"\n />\n <img\n *ngIf=\"\n form.value.ImageAsDataURL && form.value.ImageAsDataURL !== ''\n \"\n [src]=\"form.value.ImageAsDataURL\"\n style=\"height: 40px; width: fit-content\"\n />\n </div>\n <div class=\"\">{{ form.value.Filename }}</div>\n <div class=\"\">\n <div (click)=\"removeFromList()\" *ngIf=\"allowRemove\">\n <kms-icon\n icon=\"trash\"\n [size]=\"IconSizePx.XS\"\n iconClass=\"color-black\"\n ></kms-icon>\n {{ 'file-input.remove' }}\n </div>\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"!previewImage\">\n <div class=\"\">{{ form.value.Filename }}</div>\n </div>\n\n <button\n (click)=\"selectImageOverlay()\"\n class=\"button-primary-font-color\"\n mat-stroked-button\n >\n <span>{{ label }}</span>\n </button>\n <input\n type=\"file\"\n [accept]=\"acceptedFileMimetypes\"\n style=\"display: none\"\n #fileInput\n (click)=\"clearInputValue($event)\"\n (change)=\"selectImage($event)\"\n />\n\n <input type=\"hidden\" formControlName=\"ImageIdent\" />\n <input type=\"hidden\" formControlName=\"ImageLink\" />\n <input type=\"hidden\" formControlName=\"Filename\" />\n <input type=\"hidden\" formControlName=\"ImageAsDataURL\" />\n <input type=\"hidden\" formControlName=\"Text\" />\n</form>\n" }]
|
|
997
997
|
}], ctorParameters: () => [{ type: i1$1.UntypedFormBuilder }, { type: i0.ApplicationRef }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { fileInput: [{
|
|
998
998
|
type: ViewChild,
|
|
999
999
|
args: ['fileInput']
|
|
@@ -1399,7 +1399,7 @@ class RadioButtonComponent {
|
|
|
1399
1399
|
useExisting: forwardRef(() => RadioButtonComponent),
|
|
1400
1400
|
multi: true,
|
|
1401
1401
|
},
|
|
1402
|
-
], ngImport: i0, template: "<mat-radio-button\n [disabled]=\"disabled\"\n [checked]=\"checked\"\n [ngClass]=\"size\"\n [color]=\"color\"\n [value]=\"value\"\n (change)=\"onChange.emit(
|
|
1402
|
+
], ngImport: i0, template: "<mat-radio-button\n [disabled]=\"disabled\"\n [checked]=\"checked\"\n [ngClass]=\"size\"\n [color]=\"color\"\n [value]=\"value\"\n (change)=\"onChange.emit()\"\n ngDefaultControl\n>\n {{ label }}\n</mat-radio-button>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i1$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]" }] }); }
|
|
1403
1403
|
}
|
|
1404
1404
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RadioButtonComponent, decorators: [{
|
|
1405
1405
|
type: Component,
|
|
@@ -1409,7 +1409,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1409
1409
|
useExisting: forwardRef(() => RadioButtonComponent),
|
|
1410
1410
|
multi: true,
|
|
1411
1411
|
},
|
|
1412
|
-
], template: "<mat-radio-button\n [disabled]=\"disabled\"\n [checked]=\"checked\"\n [ngClass]=\"size\"\n [color]=\"color\"\n [value]=\"value\"\n (change)=\"onChange.emit(
|
|
1412
|
+
], template: "<mat-radio-button\n [disabled]=\"disabled\"\n [checked]=\"checked\"\n [ngClass]=\"size\"\n [color]=\"color\"\n [value]=\"value\"\n (change)=\"onChange.emit()\"\n ngDefaultControl\n>\n {{ label }}\n</mat-radio-button>\n" }]
|
|
1413
1413
|
}], propDecorators: { label: [{
|
|
1414
1414
|
type: Input
|
|
1415
1415
|
}], checked: [{
|
|
@@ -1463,7 +1463,7 @@ class SalutationDropdownComponent extends FormControlParentComponent {
|
|
|
1463
1463
|
useExisting: forwardRef(() => SalutationDropdownComponent),
|
|
1464
1464
|
multi: true,
|
|
1465
1465
|
},
|
|
1466
|
-
], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"row\">\n
|
|
1466
|
+
], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"row\">\n <mat-form-field class=\"col\">\n <mat-select\n disableOptionCentering\n formControlName=\"salut\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n #child\n >\n <mat-option [value]=\"SalutationEnum.NOT_SPECIFIED\">{{\n 'general.salutation.' + Object.keys(SalutationEnum)[0]?.toLowerCase()\n | translate\n }}</mat-option>\n <mat-option [value]=\"SalutationEnum.MALE\">{{\n 'general.salutation.' + Object.keys(SalutationEnum)[1]?.toLowerCase()\n | translate\n }}</mat-option>\n <mat-option [value]=\"SalutationEnum.FEMALE\">{{\n 'general.salutation.' + Object.keys(SalutationEnum)[2]?.toLowerCase()\n | translate\n }}</mat-option>\n </mat-select>\n </mat-form-field>\n</form>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i3$1.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"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }] }); }
|
|
1467
1467
|
}
|
|
1468
1468
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SalutationDropdownComponent, decorators: [{
|
|
1469
1469
|
type: Component,
|
|
@@ -1473,7 +1473,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1473
1473
|
useExisting: forwardRef(() => SalutationDropdownComponent),
|
|
1474
1474
|
multi: true,
|
|
1475
1475
|
},
|
|
1476
|
-
], template: "<form [formGroup]=\"form\" class=\"row\">\n
|
|
1476
|
+
], template: "<form [formGroup]=\"form\" class=\"row\">\n <mat-form-field class=\"col\">\n <mat-select\n disableOptionCentering\n formControlName=\"salut\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n #child\n >\n <mat-option [value]=\"SalutationEnum.NOT_SPECIFIED\">{{\n 'general.salutation.' + Object.keys(SalutationEnum)[0]?.toLowerCase()\n | translate\n }}</mat-option>\n <mat-option [value]=\"SalutationEnum.MALE\">{{\n 'general.salutation.' + Object.keys(SalutationEnum)[1]?.toLowerCase()\n | translate\n }}</mat-option>\n <mat-option [value]=\"SalutationEnum.FEMALE\">{{\n 'general.salutation.' + Object.keys(SalutationEnum)[2]?.toLowerCase()\n | translate\n }}</mat-option>\n </mat-select>\n </mat-form-field>\n</form>\n" }]
|
|
1477
1477
|
}], ctorParameters: () => [{ type: i1$1.UntypedFormBuilder }, { type: i0.Renderer2 }], propDecorators: { placeholder: [{
|
|
1478
1478
|
type: Input
|
|
1479
1479
|
}] } });
|
|
@@ -1563,6 +1563,9 @@ class TimeInputComponent {
|
|
|
1563
1563
|
}
|
|
1564
1564
|
return timeSeries;
|
|
1565
1565
|
}
|
|
1566
|
+
inputValueChanged(event) {
|
|
1567
|
+
this.valueChanged(event.target.value);
|
|
1568
|
+
}
|
|
1566
1569
|
valueChanged(value) {
|
|
1567
1570
|
this._value.set(value);
|
|
1568
1571
|
this.onChange(value);
|
|
@@ -1577,7 +1580,8 @@ class TimeInputComponent {
|
|
|
1577
1580
|
validate({ value }) {
|
|
1578
1581
|
// validate time format HH:mm and 24 hours and 59 minutes
|
|
1579
1582
|
const timeRegex = /^(?:[01]\d|2[0-3]):(?:[0-5]\d)$/;
|
|
1580
|
-
if (this.allowEmpty &&
|
|
1583
|
+
if (this.allowEmpty &&
|
|
1584
|
+
(value === undefined || value === null || value === ''))
|
|
1581
1585
|
return null;
|
|
1582
1586
|
if (timeRegex.test(value))
|
|
1583
1587
|
return null;
|
|
@@ -1598,7 +1602,7 @@ class TimeInputComponent {
|
|
|
1598
1602
|
useExisting: TimeInputComponent,
|
|
1599
1603
|
multi: true,
|
|
1600
1604
|
},
|
|
1601
|
-
], usesOnChanges: true, ngImport: i0, template: "<mat-form-field class=\"kms-time-input\">\n <mat-label>{{ label }}</mat-label>\n <input\n type=\"text\"\n aria-label=\"time\"\n matInput\n kmsTime\n [matAutocomplete]=\"auto\"\n [value]=\"_value()\"\n (input)=\"
|
|
1605
|
+
], usesOnChanges: true, ngImport: i0, template: "<mat-form-field class=\"kms-time-input\">\n <mat-label>{{ label }}</mat-label>\n <input\n type=\"text\"\n aria-label=\"time\"\n matInput\n kmsTime\n [matAutocomplete]=\"auto\"\n [value]=\"_value()\"\n (input)=\"inputValueChanged($event)\"\n />\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n (optionSelected)=\"valueChanged($event.option.value)\"\n (closed)=\"autocompleteClosed()\"\n >\n <mat-option *ngFor=\"let option of filteredOptions()\" [value]=\"option\">\n {{ option }}\n </mat-option>\n </mat-autocomplete>\n <kms-icon\n class=\"kms-time-input__suffix\"\n matSuffix\n icon=\"clock\"\n [size]=\"IconSizePx.XS\"\n ></kms-icon>\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i4.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$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: TimeDirective, selector: "[kmsTime]" }, { kind: "component", type: i6.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: i6.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: IconComponent, selector: "kms-icon", inputs: ["icon", "iconClass", "size", "dontUseSprite", "color"] }] }); }
|
|
1602
1606
|
}
|
|
1603
1607
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TimeInputComponent, decorators: [{
|
|
1604
1608
|
type: Component,
|
|
@@ -1613,7 +1617,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1613
1617
|
useExisting: TimeInputComponent,
|
|
1614
1618
|
multi: true,
|
|
1615
1619
|
},
|
|
1616
|
-
], template: "<mat-form-field class=\"kms-time-input\">\n <mat-label>{{ label }}</mat-label>\n <input\n type=\"text\"\n aria-label=\"time\"\n matInput\n kmsTime\n [matAutocomplete]=\"auto\"\n [value]=\"_value()\"\n (input)=\"
|
|
1620
|
+
], template: "<mat-form-field class=\"kms-time-input\">\n <mat-label>{{ label }}</mat-label>\n <input\n type=\"text\"\n aria-label=\"time\"\n matInput\n kmsTime\n [matAutocomplete]=\"auto\"\n [value]=\"_value()\"\n (input)=\"inputValueChanged($event)\"\n />\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n (optionSelected)=\"valueChanged($event.option.value)\"\n (closed)=\"autocompleteClosed()\"\n >\n <mat-option *ngFor=\"let option of filteredOptions()\" [value]=\"option\">\n {{ option }}\n </mat-option>\n </mat-autocomplete>\n <kms-icon\n class=\"kms-time-input__suffix\"\n matSuffix\n icon=\"clock\"\n [size]=\"IconSizePx.XS\"\n ></kms-icon>\n</mat-form-field>\n" }]
|
|
1617
1621
|
}], propDecorators: { label: [{
|
|
1618
1622
|
type: Input
|
|
1619
1623
|
}], value: [{
|
|
@@ -1677,7 +1681,7 @@ class YesNoRadiogroupComponent {
|
|
|
1677
1681
|
useExisting: forwardRef(() => YesNoRadiogroupComponent),
|
|
1678
1682
|
multi: true,
|
|
1679
1683
|
},
|
|
1680
|
-
], viewQueries: [{ propertyName: "child", first: true, predicate: ["child"], descendants: true }], ngImport: i0, template: "<form [formGroup]=\"form\">\n
|
|
1684
|
+
], viewQueries: [{ propertyName: "child", first: true, predicate: ["child"], descendants: true }], ngImport: i0, template: "<form [formGroup]=\"form\">\n <div>{{ header }}</div>\n <mat-radio-group formControlName=\"yesno\" [disabled]=\"disabled\" #child>\n <mat-radio-button [value]=\"true\" [checked]=\"internalValue === true\">\n {{ textYes }}</mat-radio-button\n >\n <mat-radio-button [value]=\"false\" [checked]=\"internalValue === false\">\n {{ textNo }}</mat-radio-button\n >\n </mat-radio-group>\n</form>\n", dependencies: [{ kind: "directive", type: i2$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i2$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
|
|
1681
1685
|
}
|
|
1682
1686
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: YesNoRadiogroupComponent, decorators: [{
|
|
1683
1687
|
type: Component,
|
|
@@ -1687,7 +1691,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1687
1691
|
useExisting: forwardRef(() => YesNoRadiogroupComponent),
|
|
1688
1692
|
multi: true,
|
|
1689
1693
|
},
|
|
1690
|
-
], template: "<form [formGroup]=\"form\">\n
|
|
1694
|
+
], template: "<form [formGroup]=\"form\">\n <div>{{ header }}</div>\n <mat-radio-group formControlName=\"yesno\" [disabled]=\"disabled\" #child>\n <mat-radio-button [value]=\"true\" [checked]=\"internalValue === true\">\n {{ textYes }}</mat-radio-button\n >\n <mat-radio-button [value]=\"false\" [checked]=\"internalValue === false\">\n {{ textNo }}</mat-radio-button\n >\n </mat-radio-group>\n</form>\n" }]
|
|
1691
1695
|
}], ctorParameters: () => [{ type: i1$1.UntypedFormBuilder }, { type: i0.Renderer2 }], propDecorators: { header: [{
|
|
1692
1696
|
type: Input
|
|
1693
1697
|
}], disabled: [{
|
|
@@ -2345,6 +2349,7 @@ class ButtonComponent {
|
|
|
2345
2349
|
this.icon = input();
|
|
2346
2350
|
this.disabled = input(false);
|
|
2347
2351
|
this.buttonClick = output();
|
|
2352
|
+
this.rounded = input(false);
|
|
2348
2353
|
this.StylingTheme = StylingTheme;
|
|
2349
2354
|
this.IconSize = IconSizePx;
|
|
2350
2355
|
this.ButtonAppearance = ButtonAppearance;
|
|
@@ -2363,11 +2368,11 @@ class ButtonComponent {
|
|
|
2363
2368
|
});
|
|
2364
2369
|
}
|
|
2365
2370
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2366
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ButtonComponent, selector: "kms-button", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: "@if (appearance() == ButtonAppearance.BASIC) {\n<button\n mat-button\n [color]=\"color()\"\n class=\"kms-button\"\n [ngClass]=\"{\n 'kms-button--loading': loading(),\n 'kms-button--basic-primary': color() === StylingTheme.PRIMARY,\n 'kms-button--basic-accent': color() === StylingTheme.SECONDARY,\n 'kms-button--basic-warn': color() === StylingTheme.WARN,\n }\"\n [disabled]=\"disabled() || loading()\"\n (click)=\"buttonClick.emit($event)\"\n [type]=\"type()\"\n (keyup)=\"\n ($event.key === 'Enter' || $event.key === 'Space') &&\n buttonClick.emit($event)\n \"\n>\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"
|
|
2371
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ButtonComponent, selector: "kms-button", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: "<!-- Basic -->\n@if (appearance() == ButtonAppearance.BASIC) {\n<button\n mat-button\n [color]=\"color()\"\n class=\"kms-button\"\n [ngClass]=\"{\n 'kms-button--loading': loading(),\n 'kms-button--basic-primary': color() === StylingTheme.PRIMARY,\n 'kms-button--basic-accent': color() === StylingTheme.SECONDARY,\n 'kms-button--basic-warn': color() === StylingTheme.WARN,\n 'kms-button--rounded': rounded()\n }\"\n [disabled]=\"disabled() || loading()\"\n (click)=\"buttonClick.emit($event)\"\n [type]=\"type()\"\n (keyup)=\"\n ($event.key === 'Enter' || $event.key === 'Space') &&\n buttonClick.emit($event)\n \"\n>\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\n</button>\n}\n\n<!-- Flat -->\n@else if (appearance() == ButtonAppearance.FLAT) {\n<button\n mat-flat-button\n [color]=\"color()\"\n class=\"kms-button\"\n [ngClass]=\"{\n 'kms-button--loading': loading(),\n 'kms-button--flat-primary': color() === StylingTheme.PRIMARY,\n 'kms-button--flat-accent': color() === StylingTheme.SECONDARY,\n 'kms-button--flat-warn': color() === StylingTheme.WARN,\n 'kms-button--rounded': rounded()\n }\"\n [disabled]=\"disabled() || loading()\"\n (click)=\"buttonClick.emit($event)\"\n [type]=\"type()\"\n (keyup)=\"\n ($event.key === 'Enter' || $event.key === 'Space') &&\n buttonClick.emit($event)\n \"\n>\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\n</button>\n}\n\n<!-- Raised -->\n@else if (appearance() == ButtonAppearance.RAISED) {\n<button\n mat-raised-button\n [color]=\"color()\"\n class=\"kms-button\"\n [ngClass]=\"{\n 'kms-button--loading': loading(),\n 'kms-button--raised-primary': color() === StylingTheme.PRIMARY,\n 'kms-button--raised-accent': color() === StylingTheme.SECONDARY,\n 'kms-button--raised-warn': color() === StylingTheme.WARN,\n 'kms-button--rounded': rounded()\n }\"\n [disabled]=\"disabled() || loading()\"\n (click)=\"buttonClick.emit($event)\"\n [type]=\"type()\"\n (keyup)=\"\n ($event.key === 'Enter' || $event.key === 'Space') &&\n buttonClick.emit($event)\n \"\n>\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\n</button>\n}\n\n<ng-template #buttonTemplate>\n @if (loading()) {\n <mat-spinner class=\"kms-button__spinner\" diameter=\"22\"></mat-spinner>\n } @if (icon()) {\n <kms-icon\n class=\"kms-button__icon\"\n [color]=\"iconColor()\"\n [size]=\"IconSize.XXS\"\n [icon]=\"icon()\"\n ></kms-icon>\n }\n {{ label() }}\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: IconComponent, selector: "kms-icon", inputs: ["icon", "iconClass", "size", "dontUseSprite", "color"] }] }); }
|
|
2367
2372
|
}
|
|
2368
2373
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
2369
2374
|
type: Component,
|
|
2370
|
-
args: [{ selector: 'kms-button', template: "@if (appearance() == ButtonAppearance.BASIC) {\n<button\n mat-button\n [color]=\"color()\"\n class=\"kms-button\"\n [ngClass]=\"{\n 'kms-button--loading': loading(),\n 'kms-button--basic-primary': color() === StylingTheme.PRIMARY,\n 'kms-button--basic-accent': color() === StylingTheme.SECONDARY,\n 'kms-button--basic-warn': color() === StylingTheme.WARN,\n }\"\n [disabled]=\"disabled() || loading()\"\n (click)=\"buttonClick.emit($event)\"\n [type]=\"type()\"\n (keyup)=\"\n ($event.key === 'Enter' || $event.key === 'Space') &&\n buttonClick.emit($event)\n \"\n>\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"
|
|
2375
|
+
args: [{ selector: 'kms-button', template: "<!-- Basic -->\n@if (appearance() == ButtonAppearance.BASIC) {\n<button\n mat-button\n [color]=\"color()\"\n class=\"kms-button\"\n [ngClass]=\"{\n 'kms-button--loading': loading(),\n 'kms-button--basic-primary': color() === StylingTheme.PRIMARY,\n 'kms-button--basic-accent': color() === StylingTheme.SECONDARY,\n 'kms-button--basic-warn': color() === StylingTheme.WARN,\n 'kms-button--rounded': rounded()\n }\"\n [disabled]=\"disabled() || loading()\"\n (click)=\"buttonClick.emit($event)\"\n [type]=\"type()\"\n (keyup)=\"\n ($event.key === 'Enter' || $event.key === 'Space') &&\n buttonClick.emit($event)\n \"\n>\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\n</button>\n}\n\n<!-- Flat -->\n@else if (appearance() == ButtonAppearance.FLAT) {\n<button\n mat-flat-button\n [color]=\"color()\"\n class=\"kms-button\"\n [ngClass]=\"{\n 'kms-button--loading': loading(),\n 'kms-button--flat-primary': color() === StylingTheme.PRIMARY,\n 'kms-button--flat-accent': color() === StylingTheme.SECONDARY,\n 'kms-button--flat-warn': color() === StylingTheme.WARN,\n 'kms-button--rounded': rounded()\n }\"\n [disabled]=\"disabled() || loading()\"\n (click)=\"buttonClick.emit($event)\"\n [type]=\"type()\"\n (keyup)=\"\n ($event.key === 'Enter' || $event.key === 'Space') &&\n buttonClick.emit($event)\n \"\n>\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\n</button>\n}\n\n<!-- Raised -->\n@else if (appearance() == ButtonAppearance.RAISED) {\n<button\n mat-raised-button\n [color]=\"color()\"\n class=\"kms-button\"\n [ngClass]=\"{\n 'kms-button--loading': loading(),\n 'kms-button--raised-primary': color() === StylingTheme.PRIMARY,\n 'kms-button--raised-accent': color() === StylingTheme.SECONDARY,\n 'kms-button--raised-warn': color() === StylingTheme.WARN,\n 'kms-button--rounded': rounded()\n }\"\n [disabled]=\"disabled() || loading()\"\n (click)=\"buttonClick.emit($event)\"\n [type]=\"type()\"\n (keyup)=\"\n ($event.key === 'Enter' || $event.key === 'Space') &&\n buttonClick.emit($event)\n \"\n>\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\n</button>\n}\n\n<ng-template #buttonTemplate>\n @if (loading()) {\n <mat-spinner class=\"kms-button__spinner\" diameter=\"22\"></mat-spinner>\n } @if (icon()) {\n <kms-icon\n class=\"kms-button__icon\"\n [color]=\"iconColor()\"\n [size]=\"IconSize.XXS\"\n [icon]=\"icon()\"\n ></kms-icon>\n }\n {{ label() }}\n</ng-template>\n" }]
|
|
2371
2376
|
}] });
|
|
2372
2377
|
|
|
2373
2378
|
class CardComponent {
|
|
@@ -2858,7 +2863,8 @@ class PasswordComponent {
|
|
|
2858
2863
|
this.submit.emit();
|
|
2859
2864
|
}
|
|
2860
2865
|
}
|
|
2861
|
-
valueChanged(
|
|
2866
|
+
valueChanged(event) {
|
|
2867
|
+
const { value } = event.target;
|
|
2862
2868
|
this.onChange(value);
|
|
2863
2869
|
this.value.set(value);
|
|
2864
2870
|
this.change.emit(value);
|
|
@@ -2896,7 +2902,7 @@ class PasswordComponent {
|
|
|
2896
2902
|
useExisting: forwardRef(() => PasswordComponent),
|
|
2897
2903
|
multi: true,
|
|
2898
2904
|
},
|
|
2899
|
-
], ngImport: i0, template: "<mat-form-field class=\"kms-password__form-field\">\n <mat-label>{{ label() }}</mat-label>\n <input\n [type]=\"showPassword() ? 'text' : 'password'\"\n matInput\n (input)=\"valueChanged($event
|
|
2905
|
+
], ngImport: i0, template: "<mat-form-field class=\"kms-password__form-field\">\n <mat-label>{{ label() }}</mat-label>\n <input\n [type]=\"showPassword() ? 'text' : 'password'\"\n matInput\n (input)=\"valueChanged($event)\"\n [disabled]=\"disabled()\"\n (keypress)=\"keypress($event)\"\n #password=\"matInput\"\n />\n @if (showPassword()) {\n <kms-icon\n class=\"kms-time-input__suffix\"\n matSuffix\n icon=\"ic_eye\"\n [size]=\"IconSizePx.XS\"\n (click)=\"showPassword.set(false)\"\n (mousedown)=\"eyeIconIsBeingPressed.set(true)\"\n (mouseup)=\"eyeIconIsBeingPressed.set(false)\"\n ></kms-icon>\n } @else {\n <kms-icon\n class=\"kms-time-input__suffix\"\n matSuffix\n icon=\"ic_eye_active\"\n [size]=\"IconSizePx.XS\"\n (click)=\"showPassword.set(true)\"\n (mousedown)=\"eyeIconIsBeingPressed.set(true)\"\n (mouseup)=\"eyeIconIsBeingPressed.set(false)\"\n ></kms-icon>\n }\n</mat-form-field>\n\n@if ((eyeIconIsBeingPressed() || password.focused) && withStrength()) {\n<mat-card appearance=\"outlined\">\n <mat-card-content class=\"kms-password__card\">\n <mat-list role=\"list\">\n @for (validation of validations(); track validation) {\n <mat-list-item role=\"listitem\">\n <div class=\"kms-password__strength-item\">\n @if(validation.isValid()) {\n <kms-icon\n [size]=\"IconSizePx.XS\"\n icon=\"ic_check\"\n iconClass=\"color-success\"\n ></kms-icon>\n }@else {\n <kms-icon\n [size]=\"IconSizePx.XS\"\n icon=\"ic_abbrechen\"\n iconClass=\"color-warn\"\n ></kms-icon>\n } {{ validation.text() }}\n </div></mat-list-item\n >\n }\n </mat-list>\n </mat-card-content>\n</mat-card>\n}\n", dependencies: [{ kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i4.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: i3$3.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i3$3.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "component", type: i4$2.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$2.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: IconComponent, selector: "kms-icon", inputs: ["icon", "iconClass", "size", "dontUseSprite", "color"] }] }); }
|
|
2900
2906
|
}
|
|
2901
2907
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PasswordComponent, decorators: [{
|
|
2902
2908
|
type: Component,
|
|
@@ -2911,7 +2917,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2911
2917
|
useExisting: forwardRef(() => PasswordComponent),
|
|
2912
2918
|
multi: true,
|
|
2913
2919
|
},
|
|
2914
|
-
], template: "<mat-form-field class=\"kms-password__form-field\">\n <mat-label>{{ label() }}</mat-label>\n <input\n [type]=\"showPassword() ? 'text' : 'password'\"\n matInput\n (input)=\"valueChanged($event
|
|
2920
|
+
], template: "<mat-form-field class=\"kms-password__form-field\">\n <mat-label>{{ label() }}</mat-label>\n <input\n [type]=\"showPassword() ? 'text' : 'password'\"\n matInput\n (input)=\"valueChanged($event)\"\n [disabled]=\"disabled()\"\n (keypress)=\"keypress($event)\"\n #password=\"matInput\"\n />\n @if (showPassword()) {\n <kms-icon\n class=\"kms-time-input__suffix\"\n matSuffix\n icon=\"ic_eye\"\n [size]=\"IconSizePx.XS\"\n (click)=\"showPassword.set(false)\"\n (mousedown)=\"eyeIconIsBeingPressed.set(true)\"\n (mouseup)=\"eyeIconIsBeingPressed.set(false)\"\n ></kms-icon>\n } @else {\n <kms-icon\n class=\"kms-time-input__suffix\"\n matSuffix\n icon=\"ic_eye_active\"\n [size]=\"IconSizePx.XS\"\n (click)=\"showPassword.set(true)\"\n (mousedown)=\"eyeIconIsBeingPressed.set(true)\"\n (mouseup)=\"eyeIconIsBeingPressed.set(false)\"\n ></kms-icon>\n }\n</mat-form-field>\n\n@if ((eyeIconIsBeingPressed() || password.focused) && withStrength()) {\n<mat-card appearance=\"outlined\">\n <mat-card-content class=\"kms-password__card\">\n <mat-list role=\"list\">\n @for (validation of validations(); track validation) {\n <mat-list-item role=\"listitem\">\n <div class=\"kms-password__strength-item\">\n @if(validation.isValid()) {\n <kms-icon\n [size]=\"IconSizePx.XS\"\n icon=\"ic_check\"\n iconClass=\"color-success\"\n ></kms-icon>\n }@else {\n <kms-icon\n [size]=\"IconSizePx.XS\"\n icon=\"ic_abbrechen\"\n iconClass=\"color-warn\"\n ></kms-icon>\n } {{ validation.text() }}\n </div></mat-list-item\n >\n }\n </mat-list>\n </mat-card-content>\n</mat-card>\n}\n" }]
|
|
2915
2921
|
}], propDecorators: { change: [{
|
|
2916
2922
|
type: Output
|
|
2917
2923
|
}], submit: [{
|
|
@@ -3042,7 +3048,7 @@ class SalutationRadiogroupComponent extends FormControlParentComponent {
|
|
|
3042
3048
|
useExisting: forwardRef(() => SalutationRadiogroupComponent),
|
|
3043
3049
|
multi: true,
|
|
3044
3050
|
},
|
|
3045
|
-
], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\"
|
|
3051
|
+
], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n <mat-radio-group formControlName=\"salut\" [disabled]=\"disabled\" #radioGroup>\n <mat-radio-button\n color=\"primary\"\n [value]=\"SalutationEnum.NOT_SPECIFIED\"\n [checked]=\"value === SalutationEnum.NOT_SPECIFIED\"\n >\n {{\n 'general.salutation.' + Object.keys(SalutationEnum)[0]?.toLowerCase()\n | translate\n }}\n </mat-radio-button>\n <mat-radio-button\n color=\"primary\"\n [value]=\"SalutationEnum.MALE\"\n [checked]=\"value === SalutationEnum.MALE\"\n >\n {{\n 'general.salutation.' + Object.keys(SalutationEnum)[1]?.toLowerCase()\n | translate\n }}\n </mat-radio-button>\n <mat-radio-button\n color=\"primary\"\n [value]=\"SalutationEnum.FEMALE\"\n [checked]=\"value === SalutationEnum.FEMALE\"\n >\n {{\n 'general.salutation.' + Object.keys(SalutationEnum)[2]?.toLowerCase()\n | translate\n }}\n </mat-radio-button>\n </mat-radio-group>\n</form>\n", dependencies: [{ kind: "directive", type: i2$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i2$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }] }); }
|
|
3046
3052
|
}
|
|
3047
3053
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SalutationRadiogroupComponent, decorators: [{
|
|
3048
3054
|
type: Component,
|
|
@@ -3052,7 +3058,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
3052
3058
|
useExisting: forwardRef(() => SalutationRadiogroupComponent),
|
|
3053
3059
|
multi: true,
|
|
3054
3060
|
},
|
|
3055
|
-
], template: "<form [formGroup]=\"form\"
|
|
3061
|
+
], template: "<form [formGroup]=\"form\">\n <mat-radio-group formControlName=\"salut\" [disabled]=\"disabled\" #radioGroup>\n <mat-radio-button\n color=\"primary\"\n [value]=\"SalutationEnum.NOT_SPECIFIED\"\n [checked]=\"value === SalutationEnum.NOT_SPECIFIED\"\n >\n {{\n 'general.salutation.' + Object.keys(SalutationEnum)[0]?.toLowerCase()\n | translate\n }}\n </mat-radio-button>\n <mat-radio-button\n color=\"primary\"\n [value]=\"SalutationEnum.MALE\"\n [checked]=\"value === SalutationEnum.MALE\"\n >\n {{\n 'general.salutation.' + Object.keys(SalutationEnum)[1]?.toLowerCase()\n | translate\n }}\n </mat-radio-button>\n <mat-radio-button\n color=\"primary\"\n [value]=\"SalutationEnum.FEMALE\"\n [checked]=\"value === SalutationEnum.FEMALE\"\n >\n {{\n 'general.salutation.' + Object.keys(SalutationEnum)[2]?.toLowerCase()\n | translate\n }}\n </mat-radio-button>\n </mat-radio-group>\n</form>\n" }]
|
|
3056
3062
|
}], ctorParameters: () => [{ type: i1$1.UntypedFormBuilder }, { type: i0.Renderer2 }] });
|
|
3057
3063
|
|
|
3058
3064
|
/**
|