@tehw0lf/contact-form 0.0.12 → 0.0.13

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.
Files changed (11) hide show
  1. package/README.md +41 -10
  2. package/esm2020/lib/contact-form/contact-form.component.mjs +51 -8
  3. package/esm2020/lib/contact-form.module.mjs +25 -7
  4. package/esm2020/lib/email-api.service.mjs +3 -3
  5. package/fesm2015/tehw0lf-contact-form.mjs +77 -16
  6. package/fesm2015/tehw0lf-contact-form.mjs.map +1 -1
  7. package/fesm2020/tehw0lf-contact-form.mjs +77 -16
  8. package/fesm2020/tehw0lf-contact-form.mjs.map +1 -1
  9. package/lib/contact-form/contact-form.component.d.ts +24 -1
  10. package/lib/contact-form.module.d.ts +4 -2
  11. package/package.json +11 -10
package/README.md CHANGED
@@ -40,8 +40,8 @@ The contact form component takes an apiURL and an email as input. By default, th
40
40
  In your component, set the `emailBackendURL` and `yourEmailAddress` properties. The naming of these variables is arbitrary:
41
41
 
42
42
  ```ts
43
- emailBackendURL = 'https://forwardmethis.com/';
44
- yourEmailAddress = 'my@mail.com'; //this is optional, if your API URL doesn't require an email address parameter
43
+ emailBackendURL; //'https://forwardmethis.com/';
44
+ yourEmailAddress; //'my@mail.com'; //this is optional, if your API URL doesn't require an email address parameter
45
45
  ```
46
46
 
47
47
  This contact form will send a POST request to the API, containing the following data structure:
@@ -58,16 +58,47 @@ You can of course use your own backend with this data structure, as the API-URL
58
58
 
59
59
  ## Theming
60
60
 
61
- The colors of card background, button and text as well as the backdrop filter can be customized with optional input parameters:
61
+ The styles of form background, button, input and text can be customized with optional input parameters:
62
62
 
63
63
  ```ts
64
- backgroundColor; //default: 'rgba(34, 34, 34, 0.75)';
65
- backdropFilter; //default: 'blur(50px)';
66
- buttonColor; //default: '#cc7832';
67
- buttonBackgroundColor; //default: ''
68
- buttonTextColor; //default: '#cc7832';
69
- labelColor; //default: 'lightgray';
70
- textColor; //default: 'lightgray';
64
+ buttonStyle; /* {
65
+ border: 'none',
66
+ 'background-color': '#333333',
67
+ color: '#cc7832'
68
+ }*/
69
+
70
+ formStyle; /* {
71
+ color: '#437da8',
72
+ 'background-color': 'rgba(34, 34, 34, 0.75)',
73
+ 'backdrop-filter': 'blur(50px)',
74
+ 'box-shadow': '0 2px 10px rgba(0, 0, 0, 0.075)'
75
+ }*/
76
+
77
+ inputStyle; /* {
78
+ border: 'none',
79
+ color: '#282b2e',
80
+ 'background-color': '#fff'
81
+ }*/
82
+
83
+ textStyle; //{ color: '#cc7832' };
84
+ ```
85
+
86
+ ## Text
87
+
88
+ You can specify your own texts for the fields and labels, or leave the default English version
89
+
90
+ ```ts
91
+ nameLabel; //'Your Name';
92
+
93
+ emailAddressLabel; //'Your E-Mail Address';
94
+
95
+ messageLabel; //'Your Message';
96
+
97
+ sendText; //'Send';
98
+
99
+ sendSuccessfulText; //'E-Mail successfully sent';
100
+
101
+ sendErrorText; //'Send error';
71
102
  ```
72
103
 
73
104
  ## Development
package/esm2020/lib/contact-form/contact-form.component.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { Component, Input } from '@angular/core';
1
+ import { Component, Input, ViewEncapsulation } from '@angular/core';
2
2
  import { FormBuilder, FormControl, Validators } from '@angular/forms';
3
3
  import { Subject } from 'rxjs';
4
4
  import { takeUntil, tap } from 'rxjs/operators';
@@ -6,11 +6,34 @@ import { EmailApiService } from '../email-api.service';
6
6
  import * as i0 from "@angular/core";
7
7
  import * as i1 from "@angular/forms";
8
8
  import * as i2 from "../email-api.service";
9
- import * as i3 from "@angular/common";
9
+ import * as i3 from "@angular/material/form-field";
10
+ import * as i4 from "@angular/common";
11
+ import * as i5 from "@angular/material/input";
10
12
  export class ContactFormComponent {
11
13
  constructor(builder, emailService) {
12
14
  this.builder = builder;
13
15
  this.emailService = emailService;
16
+ this.buttonStyle = {
17
+ 'background-color': '#333333',
18
+ border: 'none',
19
+ color: '#cc7832'
20
+ };
21
+ this.formStyle = {
22
+ color: '#437da8',
23
+ 'background-color': 'rgba(34, 34, 34, 0.75)',
24
+ 'backdrop-filter': 'blur(50px)',
25
+ 'box-shadow': '0 2px 10px rgba(0, 0, 0, 0.075)'
26
+ };
27
+ this.inputStyle = {
28
+ color: '#282b2e'
29
+ };
30
+ this.textStyle = { color: '#cc7832' };
31
+ this.nameLabel = 'Your Name';
32
+ this.emailAddressLabel = 'Your E-Mail Address';
33
+ this.messageLabel = 'Your Message';
34
+ this.sendText = 'Send';
35
+ this.sendSuccessfulText = 'E-Mail successfully sent';
36
+ this.sendErrorText = 'Send error';
14
37
  this.apiURL = 'https://forwardmethis.com/';
15
38
  this.email = '';
16
39
  this.emailSent = new Subject();
@@ -41,14 +64,34 @@ export class ContactFormComponent {
41
64
  .subscribe();
42
65
  }
43
66
  }
44
- ContactFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormComponent, deps: [{ token: i1.FormBuilder }, { token: i2.EmailApiService }], target: i0.ɵɵFactoryTarget.Component });
45
- ContactFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: ContactFormComponent, selector: "contact-form", inputs: { apiURL: "apiURL", email: "email" }, ngImport: i0, template: "<form\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n>\n <div class=\"form-group\">\n <label for=\"name\">Ihr Name</label>\n <input\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n placeholder=\"Name\"\n formControlName=\"name\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"email\">Ihre E-Mail Adresse</label>\n <input\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n placeholder=\"ihre@mail.de\"\n formControlName=\"email\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"message\">Ihre Nachricht</label>\n <textarea class=\"form-control\" formControlName=\"message\" name=\"message\">\n </textarea>\n </div>\n <button class=\"form-button\" type=\"submit\" [disabled]=\"!formGroup.valid\">\n Senden\n </button>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === true\">\n E-Mail erfolgreich versendet!\n </div>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === false\">\n Fehler: E-Mail konnte nicht versendet werden\n </div>\n</form>\n", styles: [".contact-form{background-color:#fff;max-width:500px;margin:auto;padding:40px;box-shadow:0 2px 10px #00000013;box-sizing:border-box}.form-button{display:block;border:1px solid #ced4da;border-radius:.25rem;width:96%;padding:.375rem .75rem}.form-control{display:block;width:90%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#282b2e;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;border-radius:.25rem;margin-top:.5rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-group{margin-bottom:1rem}.form-status{margin-top:2rem}textarea{overflow:auto;resize:vertical}\n"], directives: [{ type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3.AsyncPipe } });
46
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormComponent, decorators: [{
67
+ ContactFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormComponent, deps: [{ token: i1.FormBuilder }, { token: i2.EmailApiService }], target: i0.ɵɵFactoryTarget.Component });
68
+ ContactFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.1", type: ContactFormComponent, selector: "contact-form", inputs: { buttonStyle: "buttonStyle", formStyle: "formStyle", inputStyle: "inputStyle", textStyle: "textStyle", nameLabel: "nameLabel", emailAddressLabel: "emailAddressLabel", messageLabel: "messageLabel", sendText: "sendText", sendSuccessfulText: "sendSuccessfulText", sendErrorText: "sendErrorText", apiURL: "apiURL", email: "email" }, ngImport: i0, template: "<form\n [ngStyle]=\"formStyle\"\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n fxLayout=\"column\"\n fxFlex\n>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"name\">{{ nameLabel }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"email\">{{\n emailAddressLabel\n }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n formControlName=\"email\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"message\">\n {{ messageLabel }}\n </mat-label>\n <textarea\n [ngStyle]=\"inputStyle\"\n matInput\n formControlName=\"message\"\n name=\"message\"\n >\n </textarea>\n </mat-form-field>\n <button\n [ngStyle]=\"buttonStyle\"\n class=\"form-button\"\n type=\"submit\"\n [disabled]=\"!formGroup.valid\"\n >\n {{ sendText }}\n </button>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === true\"\n >\n {{ sendSuccessfulText }}\n </div>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === false\"\n >\n {{ sendErrorText }}\n </div>\n</form>\n", styles: [".contact-form{max-width:500px;margin:auto;padding:40px;box-sizing:border-box}.form-button{margin-top:3rem;display:block;border-radius:.25rem;width:98%;padding:.375rem .75rem}.form-status{margin-top:2rem}textarea{color:inherit!important;background:none!important;overflow:auto;resize:vertical}.mat-form-field-appearance-outline .mat-form-field-infix{border:0;padding:1em 0 .5em}.mat-form-field-appearance-outline .mat-form-field-wrapper{padding-bottom:.25em}.mat-form-field-label{transition:none!important}.mat-form-field-should-float .mat-form-field-label-wrapper{top:-.1em;padding-top:.1em}.mat-form-field-should-float .mat-form-field-label{transition:none!important}.form-field{align-self:center;width:98%}.form-field:last-of-type{margin-top:1rem}\n"], components: [{ type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.MatLabel, selector: "mat-label" }, { type: i5.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"] }, { type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i4.AsyncPipe }, encapsulation: i0.ViewEncapsulation.None });
69
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormComponent, decorators: [{
47
70
  type: Component,
48
- args: [{ selector: 'contact-form', template: "<form\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n>\n <div class=\"form-group\">\n <label for=\"name\">Ihr Name</label>\n <input\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n placeholder=\"Name\"\n formControlName=\"name\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"email\">Ihre E-Mail Adresse</label>\n <input\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n placeholder=\"ihre@mail.de\"\n formControlName=\"email\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"message\">Ihre Nachricht</label>\n <textarea class=\"form-control\" formControlName=\"message\" name=\"message\">\n </textarea>\n </div>\n <button class=\"form-button\" type=\"submit\" [disabled]=\"!formGroup.valid\">\n Senden\n </button>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === true\">\n E-Mail erfolgreich versendet!\n </div>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === false\">\n Fehler: E-Mail konnte nicht versendet werden\n </div>\n</form>\n", styles: [".contact-form{background-color:#fff;max-width:500px;margin:auto;padding:40px;box-shadow:0 2px 10px #00000013;box-sizing:border-box}.form-button{display:block;border:1px solid #ced4da;border-radius:.25rem;width:96%;padding:.375rem .75rem}.form-control{display:block;width:90%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#282b2e;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;border-radius:.25rem;margin-top:.5rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-group{margin-bottom:1rem}.form-status{margin-top:2rem}textarea{overflow:auto;resize:vertical}\n"] }]
49
- }], ctorParameters: function () { return [{ type: i1.FormBuilder }, { type: i2.EmailApiService }]; }, propDecorators: { apiURL: [{
71
+ args: [{ selector: 'contact-form', encapsulation: ViewEncapsulation.None, template: "<form\n [ngStyle]=\"formStyle\"\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n fxLayout=\"column\"\n fxFlex\n>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"name\">{{ nameLabel }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"email\">{{\n emailAddressLabel\n }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n formControlName=\"email\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"message\">\n {{ messageLabel }}\n </mat-label>\n <textarea\n [ngStyle]=\"inputStyle\"\n matInput\n formControlName=\"message\"\n name=\"message\"\n >\n </textarea>\n </mat-form-field>\n <button\n [ngStyle]=\"buttonStyle\"\n class=\"form-button\"\n type=\"submit\"\n [disabled]=\"!formGroup.valid\"\n >\n {{ sendText }}\n </button>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === true\"\n >\n {{ sendSuccessfulText }}\n </div>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === false\"\n >\n {{ sendErrorText }}\n </div>\n</form>\n", styles: [".contact-form{max-width:500px;margin:auto;padding:40px;box-sizing:border-box}.form-button{margin-top:3rem;display:block;border-radius:.25rem;width:98%;padding:.375rem .75rem}.form-status{margin-top:2rem}textarea{color:inherit!important;background:none!important;overflow:auto;resize:vertical}.mat-form-field-appearance-outline .mat-form-field-infix{border:0;padding:1em 0 .5em}.mat-form-field-appearance-outline .mat-form-field-wrapper{padding-bottom:.25em}.mat-form-field-label{transition:none!important}.mat-form-field-should-float .mat-form-field-label-wrapper{top:-.1em;padding-top:.1em}.mat-form-field-should-float .mat-form-field-label{transition:none!important}.form-field{align-self:center;width:98%}.form-field:last-of-type{margin-top:1rem}\n"] }]
72
+ }], ctorParameters: function () { return [{ type: i1.FormBuilder }, { type: i2.EmailApiService }]; }, propDecorators: { buttonStyle: [{
73
+ type: Input
74
+ }], formStyle: [{
75
+ type: Input
76
+ }], inputStyle: [{
77
+ type: Input
78
+ }], textStyle: [{
79
+ type: Input
80
+ }], nameLabel: [{
81
+ type: Input
82
+ }], emailAddressLabel: [{
83
+ type: Input
84
+ }], messageLabel: [{
85
+ type: Input
86
+ }], sendText: [{
87
+ type: Input
88
+ }], sendSuccessfulText: [{
89
+ type: Input
90
+ }], sendErrorText: [{
91
+ type: Input
92
+ }], apiURL: [{
50
93
  type: Input
51
94
  }], email: [{
52
95
  type: Input
53
96
  }] } });
54
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGFjdC1mb3JtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29udGFjdC1mb3JtL3NyYy9saWIvY29udGFjdC1mb3JtL2NvbnRhY3QtZm9ybS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbnRhY3QtZm9ybS9zcmMvbGliL2NvbnRhY3QtZm9ybS9jb250YWN0LWZvcm0uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQWEsTUFBTSxlQUFlLENBQUM7QUFDNUQsT0FBTyxFQUFFLFdBQVcsRUFBRSxXQUFXLEVBQWEsVUFBVSxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDakYsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUMvQixPQUFPLEVBQUUsU0FBUyxFQUFFLEdBQUcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBRWhELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7Ozs7QUFRdkQsTUFBTSxPQUFPLG9CQUFvQjtJQVUvQixZQUNVLE9BQW9CLEVBQ3BCLFlBQTZCO1FBRDdCLFlBQU8sR0FBUCxPQUFPLENBQWE7UUFDcEIsaUJBQVksR0FBWixZQUFZLENBQWlCO1FBWDlCLFdBQU0sR0FBRyw0QkFBNEIsQ0FBQztRQUN0QyxVQUFLLEdBQUcsRUFBRSxDQUFDO1FBR3BCLGNBQVMsR0FBNEIsSUFBSSxPQUFPLEVBQUUsQ0FBQztRQUNuRCxlQUFVLEdBQUcsSUFBSSxDQUFDLFNBQVMsQ0FBQyxZQUFZLEVBQUUsQ0FBQztRQUVuQyxpQkFBWSxHQUFrQixJQUFJLE9BQU8sRUFBRSxDQUFDO1FBTWxELElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQzFCLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUM7WUFDbEMsSUFBSSxFQUFFLElBQUksV0FBVyxDQUFDLEVBQUUsRUFBRSxDQUFDLFVBQVUsQ0FBQyxRQUFRLENBQUMsQ0FBQztZQUNoRCxLQUFLLEVBQUUsSUFBSSxXQUFXLENBQUMsRUFBRSxFQUFFLENBQUMsVUFBVSxDQUFDLFFBQVEsRUFBRSxVQUFVLENBQUMsS0FBSyxDQUFDLENBQUM7WUFDbkUsT0FBTyxFQUFFLElBQUksV0FBVyxDQUFDLEVBQUUsRUFBRSxDQUFDLFVBQVUsQ0FBQyxRQUFRLENBQUMsQ0FBQztTQUNwRCxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQsV0FBVztRQUNULElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxFQUFFLENBQUM7UUFDekIsSUFBSSxDQUFDLFlBQVksQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUMvQixDQUFDO0lBRUQsY0FBYyxDQUFDLFFBQW1CO1FBQ2hDLElBQUksQ0FBQyxZQUFZO2FBQ2QsU0FBUyxDQUFDLEdBQUcsSUFBSSxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUMsS0FBSyxFQUFFLEVBQUUsUUFBUSxDQUFDLEtBQUssQ0FBQzthQUN4RCxJQUFJLENBQ0gsR0FBRyxDQUFDLENBQUMsUUFBZ0IsRUFBRSxFQUFFO1lBQ3ZCLElBQUksUUFBUSxLQUFLLElBQUksRUFBRTtnQkFDckIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7YUFDM0I7aUJBQU07Z0JBQ0wsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7YUFDNUI7UUFDSCxDQUFDLENBQUMsRUFDRixTQUFTLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQyxDQUM3QjthQUNBLFNBQVMsRUFBRSxDQUFDO0lBQ2pCLENBQUM7O2lIQXpDVSxvQkFBb0I7cUdBQXBCLG9CQUFvQixrR0NiakMsc29DQXdDQTsyRkQzQmEsb0JBQW9CO2tCQU5oQyxTQUFTOytCQUVFLGNBQWM7Z0lBS2YsTUFBTTtzQkFBZCxLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE9uRGVzdHJveSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRm9ybUJ1aWxkZXIsIEZvcm1Db250cm9sLCBGb3JtR3JvdXAsIFZhbGlkYXRvcnMgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBTdWJqZWN0IH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyB0YWtlVW50aWwsIHRhcCB9IGZyb20gJ3J4anMvb3BlcmF0b3JzJztcblxuaW1wb3J0IHsgRW1haWxBcGlTZXJ2aWNlIH0gZnJvbSAnLi4vZW1haWwtYXBpLnNlcnZpY2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEBhbmd1bGFyLWVzbGludC9jb21wb25lbnQtc2VsZWN0b3JcbiAgc2VsZWN0b3I6ICdjb250YWN0LWZvcm0nLFxuICB0ZW1wbGF0ZVVybDogJy4vY29udGFjdC1mb3JtLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vY29udGFjdC1mb3JtLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgQ29udGFjdEZvcm1Db21wb25lbnQgaW1wbGVtZW50cyBPbkRlc3Ryb3kge1xuICBASW5wdXQoKSBhcGlVUkwgPSAnaHR0cHM6Ly9mb3J3YXJkbWV0aGlzLmNvbS8nO1xuICBASW5wdXQoKSBlbWFpbCA9ICcnO1xuXG4gIGZvcm1Hcm91cDogRm9ybUdyb3VwO1xuICBlbWFpbFNlbnQ6IFN1YmplY3Q8Ym9vbGVhbiB8IG51bGw+ID0gbmV3IFN1YmplY3QoKTtcbiAgZW1haWxTZW50JCA9IHRoaXMuZW1haWxTZW50LmFzT2JzZXJ2YWJsZSgpO1xuXG4gIHByaXZhdGUgdW5zdWJzY3JpYmUkOiBTdWJqZWN0PHZvaWQ+ID0gbmV3IFN1YmplY3QoKTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIGJ1aWxkZXI6IEZvcm1CdWlsZGVyLFxuICAgIHByaXZhdGUgZW1haWxTZXJ2aWNlOiBFbWFpbEFwaVNlcnZpY2VcbiAgKSB7XG4gICAgdGhpcy5lbWFpbFNlbnQubmV4dChudWxsKTtcbiAgICB0aGlzLmZvcm1Hcm91cCA9IHRoaXMuYnVpbGRlci5ncm91cCh7XG4gICAgICBuYW1lOiBuZXcgRm9ybUNvbnRyb2woJycsIFtWYWxpZGF0b3JzLnJlcXVpcmVkXSksXG4gICAgICBlbWFpbDogbmV3IEZvcm1Db250cm9sKCcnLCBbVmFsaWRhdG9ycy5yZXF1aXJlZCwgVmFsaWRhdG9ycy5lbWFpbF0pLFxuICAgICAgbWVzc2FnZTogbmV3IEZvcm1Db250cm9sKCcnLCBbVmFsaWRhdG9ycy5yZXF1aXJlZF0pXG4gICAgfSk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICB0aGlzLnVuc3Vic2NyaWJlJC5uZXh0KCk7XG4gICAgdGhpcy51bnN1YnNjcmliZSQuY29tcGxldGUoKTtcbiAgfVxuXG4gIHN1Ym1pdEZvcm1EYXRhKGZvcm1EYXRhOiBGb3JtR3JvdXApIHtcbiAgICB0aGlzLmVtYWlsU2VydmljZVxuICAgICAgLnNlbmRFbWFpbChgJHt0aGlzLmFwaVVSTH0ke3RoaXMuZW1haWx9YCwgZm9ybURhdGEudmFsdWUpXG4gICAgICAucGlwZShcbiAgICAgICAgdGFwKChyZXNwb25zZTogc3RyaW5nKSA9PiB7XG4gICAgICAgICAgaWYgKHJlc3BvbnNlID09PSAnT0snKSB7XG4gICAgICAgICAgICB0aGlzLmVtYWlsU2VudC5uZXh0KHRydWUpO1xuICAgICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgICB0aGlzLmVtYWlsU2VudC5uZXh0KGZhbHNlKTtcbiAgICAgICAgICB9XG4gICAgICAgIH0pLFxuICAgICAgICB0YWtlVW50aWwodGhpcy51bnN1YnNjcmliZSQpXG4gICAgICApXG4gICAgICAuc3Vic2NyaWJlKCk7XG4gIH1cbn1cbiIsIjxmb3JtXG4gIGNsYXNzPVwiY29udGFjdC1mb3JtXCJcbiAgW2Zvcm1Hcm91cF09XCJmb3JtR3JvdXBcIlxuICAobmdTdWJtaXQpPVwic3VibWl0Rm9ybURhdGEoZm9ybUdyb3VwKVwiXG4+XG4gIDxkaXYgY2xhc3M9XCJmb3JtLWdyb3VwXCI+XG4gICAgPGxhYmVsIGZvcj1cIm5hbWVcIj5JaHIgTmFtZTwvbGFiZWw+XG4gICAgPGlucHV0XG4gICAgICBjbGFzcz1cImZvcm0tY29udHJvbFwiXG4gICAgICB0eXBlPVwidGV4dFwiXG4gICAgICBuYW1lPVwibmFtZVwiXG4gICAgICBwbGFjZWhvbGRlcj1cIk5hbWVcIlxuICAgICAgZm9ybUNvbnRyb2xOYW1lPVwibmFtZVwiXG4gICAgLz5cbiAgPC9kaXY+XG4gIDxkaXYgY2xhc3M9XCJmb3JtLWdyb3VwXCI+XG4gICAgPGxhYmVsIGZvcj1cImVtYWlsXCI+SWhyZSBFLU1haWwgQWRyZXNzZTwvbGFiZWw+XG4gICAgPGlucHV0XG4gICAgICBjbGFzcz1cImZvcm0tY29udHJvbFwiXG4gICAgICB0eXBlPVwiZW1haWxcIlxuICAgICAgbmFtZT1cImVtYWlsXCJcbiAgICAgIHBsYWNlaG9sZGVyPVwiaWhyZUBtYWlsLmRlXCJcbiAgICAgIGZvcm1Db250cm9sTmFtZT1cImVtYWlsXCJcbiAgICAvPlxuICA8L2Rpdj5cbiAgPGRpdiBjbGFzcz1cImZvcm0tZ3JvdXBcIj5cbiAgICA8bGFiZWwgZm9yPVwibWVzc2FnZVwiPklocmUgTmFjaHJpY2h0PC9sYWJlbD5cbiAgICA8dGV4dGFyZWEgY2xhc3M9XCJmb3JtLWNvbnRyb2xcIiBmb3JtQ29udHJvbE5hbWU9XCJtZXNzYWdlXCIgbmFtZT1cIm1lc3NhZ2VcIj5cbiAgICA8L3RleHRhcmVhPlxuICA8L2Rpdj5cbiAgPGJ1dHRvbiBjbGFzcz1cImZvcm0tYnV0dG9uXCIgdHlwZT1cInN1Ym1pdFwiIFtkaXNhYmxlZF09XCIhZm9ybUdyb3VwLnZhbGlkXCI+XG4gICAgU2VuZGVuXG4gIDwvYnV0dG9uPlxuICA8ZGl2IGNsYXNzPVwiZm9ybS1zdGF0dXNcIiAqbmdJZj1cIihlbWFpbFNlbnQkIHwgYXN5bmMpID09PSB0cnVlXCI+XG4gICAgRS1NYWlsIGVyZm9sZ3JlaWNoIHZlcnNlbmRldCFcbiAgPC9kaXY+XG4gIDxkaXYgY2xhc3M9XCJmb3JtLXN0YXR1c1wiICpuZ0lmPVwiKGVtYWlsU2VudCQgfCBhc3luYykgPT09IGZhbHNlXCI+XG4gICAgRmVobGVyOiBFLU1haWwga29ubnRlIG5pY2h0IHZlcnNlbmRldCB3ZXJkZW5cbiAgPC9kaXY+XG48L2Zvcm0+XG4iXX0=
97
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGFjdC1mb3JtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29udGFjdC1mb3JtL3NyYy9saWIvY29udGFjdC1mb3JtL2NvbnRhY3QtZm9ybS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbnRhY3QtZm9ybS9zcmMvbGliL2NvbnRhY3QtZm9ybS9jb250YWN0LWZvcm0uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQWEsaUJBQWlCLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDL0UsT0FBTyxFQUFFLFdBQVcsRUFBRSxXQUFXLEVBQWEsVUFBVSxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDakYsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUMvQixPQUFPLEVBQUUsU0FBUyxFQUFFLEdBQUcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBRWhELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7Ozs7OztBQVN2RCxNQUFNLE9BQU8sb0JBQW9CO0lBeUMvQixZQUNVLE9BQW9CLEVBQ3BCLFlBQTZCO1FBRDdCLFlBQU8sR0FBUCxPQUFPLENBQWE7UUFDcEIsaUJBQVksR0FBWixZQUFZLENBQWlCO1FBMUM5QixnQkFBVyxHQUFHO1lBQ3JCLGtCQUFrQixFQUFFLFNBQVM7WUFDN0IsTUFBTSxFQUFFLE1BQU07WUFDZCxLQUFLLEVBQUUsU0FBUztTQUNqQixDQUFDO1FBRU8sY0FBUyxHQUFHO1lBQ25CLEtBQUssRUFBRSxTQUFTO1lBQ2hCLGtCQUFrQixFQUFFLHdCQUF3QjtZQUM1QyxpQkFBaUIsRUFBRSxZQUFZO1lBQy9CLFlBQVksRUFBRSxpQ0FBaUM7U0FDaEQsQ0FBQztRQUVPLGVBQVUsR0FBRztZQUNwQixLQUFLLEVBQUUsU0FBUztTQUNqQixDQUFDO1FBRU8sY0FBUyxHQUFHLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBRSxDQUFDO1FBRWpDLGNBQVMsR0FBRyxXQUFXLENBQUM7UUFFeEIsc0JBQWlCLEdBQUcscUJBQXFCLENBQUM7UUFFMUMsaUJBQVksR0FBRyxjQUFjLENBQUM7UUFFOUIsYUFBUSxHQUFHLE1BQU0sQ0FBQztRQUVsQix1QkFBa0IsR0FBRywwQkFBMEIsQ0FBQztRQUVoRCxrQkFBYSxHQUFHLFlBQVksQ0FBQztRQUU3QixXQUFNLEdBQUcsNEJBQTRCLENBQUM7UUFDdEMsVUFBSyxHQUFHLEVBQUUsQ0FBQztRQUdwQixjQUFTLEdBQTRCLElBQUksT0FBTyxFQUFFLENBQUM7UUFDbkQsZUFBVSxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsWUFBWSxFQUFFLENBQUM7UUFFbkMsaUJBQVksR0FBa0IsSUFBSSxPQUFPLEVBQUUsQ0FBQztRQU1sRCxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUMxQixJQUFJLENBQUMsU0FBUyxHQUFHLElBQUksQ0FBQyxPQUFPLENBQUMsS0FBSyxDQUFDO1lBQ2xDLElBQUksRUFBRSxJQUFJLFdBQVcsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxVQUFVLENBQUMsUUFBUSxDQUFDLENBQUM7WUFDaEQsS0FBSyxFQUFFLElBQUksV0FBVyxDQUFDLEVBQUUsRUFBRSxDQUFDLFVBQVUsQ0FBQyxRQUFRLEVBQUUsVUFBVSxDQUFDLEtBQUssQ0FBQyxDQUFDO1lBQ25FLE9BQU8sRUFBRSxJQUFJLFdBQVcsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxVQUFVLENBQUMsUUFBUSxDQUFDLENBQUM7U0FDcEQsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksRUFBRSxDQUFDO1FBQ3pCLElBQUksQ0FBQyxZQUFZLENBQUMsUUFBUSxFQUFFLENBQUM7SUFDL0IsQ0FBQztJQUVELGNBQWMsQ0FBQyxRQUFtQjtRQUNoQyxJQUFJLENBQUMsWUFBWTthQUNkLFNBQVMsQ0FBQyxHQUFHLElBQUksQ0FBQyxNQUFNLEdBQUcsSUFBSSxDQUFDLEtBQUssRUFBRSxFQUFFLFFBQVEsQ0FBQyxLQUFLLENBQUM7YUFDeEQsSUFBSSxDQUNILEdBQUcsQ0FBQyxDQUFDLFFBQWdCLEVBQUUsRUFBRTtZQUN2QixJQUFJLFFBQVEsS0FBSyxJQUFJLEVBQUU7Z0JBQ3JCLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO2FBQzNCO2lCQUFNO2dCQUNMLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO2FBQzVCO1FBQ0gsQ0FBQyxDQUFDLEVBQ0YsU0FBUyxDQUFDLElBQUksQ0FBQyxZQUFZLENBQUMsQ0FDN0I7YUFDQSxTQUFTLEVBQUUsQ0FBQztJQUNqQixDQUFDOztpSEF4RVUsb0JBQW9CO3FHQUFwQixvQkFBb0Isc1lDZGpDLG9xREFtRUE7MkZEckRhLG9CQUFvQjtrQkFQaEMsU0FBUzsrQkFFRSxjQUFjLGlCQUVULGlCQUFpQixDQUFDLElBQUk7Z0lBSTVCLFdBQVc7c0JBQW5CLEtBQUs7Z0JBTUcsU0FBUztzQkFBakIsS0FBSztnQkFPRyxVQUFVO3NCQUFsQixLQUFLO2dCQUlHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBRUcsU0FBUztzQkFBakIsS0FBSztnQkFFRyxpQkFBaUI7c0JBQXpCLEtBQUs7Z0JBRUcsWUFBWTtzQkFBcEIsS0FBSztnQkFFRyxRQUFRO3NCQUFoQixLQUFLO2dCQUVHLGtCQUFrQjtzQkFBMUIsS0FBSztnQkFFRyxhQUFhO3NCQUFyQixLQUFLO2dCQUVHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkRlc3Ryb3ksIFZpZXdFbmNhcHN1bGF0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGb3JtQnVpbGRlciwgRm9ybUNvbnRyb2wsIEZvcm1Hcm91cCwgVmFsaWRhdG9ycyB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7IFN1YmplY3QgfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IHRha2VVbnRpbCwgdGFwIH0gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xuXG5pbXBvcnQgeyBFbWFpbEFwaVNlcnZpY2UgfSBmcm9tICcuLi9lbWFpbC1hcGkuc2VydmljZSc7XG5cbkBDb21wb25lbnQoe1xuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQGFuZ3VsYXItZXNsaW50L2NvbXBvbmVudC1zZWxlY3RvclxuICBzZWxlY3RvcjogJ2NvbnRhY3QtZm9ybScsXG4gIHRlbXBsYXRlVXJsOiAnLi9jb250YWN0LWZvcm0uY29tcG9uZW50Lmh0bWwnLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBzdHlsZVVybHM6IFsnLi9jb250YWN0LWZvcm0uY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBDb250YWN0Rm9ybUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uRGVzdHJveSB7XG4gIEBJbnB1dCgpIGJ1dHRvblN0eWxlID0ge1xuICAgICdiYWNrZ3JvdW5kLWNvbG9yJzogJyMzMzMzMzMnLFxuICAgIGJvcmRlcjogJ25vbmUnLFxuICAgIGNvbG9yOiAnI2NjNzgzMidcbiAgfTtcblxuICBASW5wdXQoKSBmb3JtU3R5bGUgPSB7XG4gICAgY29sb3I6ICcjNDM3ZGE4JyxcbiAgICAnYmFja2dyb3VuZC1jb2xvcic6ICdyZ2JhKDM0LCAzNCwgMzQsIDAuNzUpJyxcbiAgICAnYmFja2Ryb3AtZmlsdGVyJzogJ2JsdXIoNTBweCknLFxuICAgICdib3gtc2hhZG93JzogJzAgMnB4IDEwcHggcmdiYSgwLCAwLCAwLCAwLjA3NSknXG4gIH07XG5cbiAgQElucHV0KCkgaW5wdXRTdHlsZSA9IHtcbiAgICBjb2xvcjogJyMyODJiMmUnXG4gIH07XG5cbiAgQElucHV0KCkgdGV4dFN0eWxlID0geyBjb2xvcjogJyNjYzc4MzInIH07XG5cbiAgQElucHV0KCkgbmFtZUxhYmVsID0gJ1lvdXIgTmFtZSc7XG5cbiAgQElucHV0KCkgZW1haWxBZGRyZXNzTGFiZWwgPSAnWW91ciBFLU1haWwgQWRkcmVzcyc7XG5cbiAgQElucHV0KCkgbWVzc2FnZUxhYmVsID0gJ1lvdXIgTWVzc2FnZSc7XG5cbiAgQElucHV0KCkgc2VuZFRleHQgPSAnU2VuZCc7XG5cbiAgQElucHV0KCkgc2VuZFN1Y2Nlc3NmdWxUZXh0ID0gJ0UtTWFpbCBzdWNjZXNzZnVsbHkgc2VudCc7XG5cbiAgQElucHV0KCkgc2VuZEVycm9yVGV4dCA9ICdTZW5kIGVycm9yJztcblxuICBASW5wdXQoKSBhcGlVUkwgPSAnaHR0cHM6Ly9mb3J3YXJkbWV0aGlzLmNvbS8nO1xuICBASW5wdXQoKSBlbWFpbCA9ICcnO1xuXG4gIGZvcm1Hcm91cDogRm9ybUdyb3VwO1xuICBlbWFpbFNlbnQ6IFN1YmplY3Q8Ym9vbGVhbiB8IG51bGw+ID0gbmV3IFN1YmplY3QoKTtcbiAgZW1haWxTZW50JCA9IHRoaXMuZW1haWxTZW50LmFzT2JzZXJ2YWJsZSgpO1xuXG4gIHByaXZhdGUgdW5zdWJzY3JpYmUkOiBTdWJqZWN0PHZvaWQ+ID0gbmV3IFN1YmplY3QoKTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIGJ1aWxkZXI6IEZvcm1CdWlsZGVyLFxuICAgIHByaXZhdGUgZW1haWxTZXJ2aWNlOiBFbWFpbEFwaVNlcnZpY2VcbiAgKSB7XG4gICAgdGhpcy5lbWFpbFNlbnQubmV4dChudWxsKTtcbiAgICB0aGlzLmZvcm1Hcm91cCA9IHRoaXMuYnVpbGRlci5ncm91cCh7XG4gICAgICBuYW1lOiBuZXcgRm9ybUNvbnRyb2woJycsIFtWYWxpZGF0b3JzLnJlcXVpcmVkXSksXG4gICAgICBlbWFpbDogbmV3IEZvcm1Db250cm9sKCcnLCBbVmFsaWRhdG9ycy5yZXF1aXJlZCwgVmFsaWRhdG9ycy5lbWFpbF0pLFxuICAgICAgbWVzc2FnZTogbmV3IEZvcm1Db250cm9sKCcnLCBbVmFsaWRhdG9ycy5yZXF1aXJlZF0pXG4gICAgfSk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICB0aGlzLnVuc3Vic2NyaWJlJC5uZXh0KCk7XG4gICAgdGhpcy51bnN1YnNjcmliZSQuY29tcGxldGUoKTtcbiAgfVxuXG4gIHN1Ym1pdEZvcm1EYXRhKGZvcm1EYXRhOiBGb3JtR3JvdXApIHtcbiAgICB0aGlzLmVtYWlsU2VydmljZVxuICAgICAgLnNlbmRFbWFpbChgJHt0aGlzLmFwaVVSTH0ke3RoaXMuZW1haWx9YCwgZm9ybURhdGEudmFsdWUpXG4gICAgICAucGlwZShcbiAgICAgICAgdGFwKChyZXNwb25zZTogc3RyaW5nKSA9PiB7XG4gICAgICAgICAgaWYgKHJlc3BvbnNlID09PSAnT0snKSB7XG4gICAgICAgICAgICB0aGlzLmVtYWlsU2VudC5uZXh0KHRydWUpO1xuICAgICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgICB0aGlzLmVtYWlsU2VudC5uZXh0KGZhbHNlKTtcbiAgICAgICAgICB9XG4gICAgICAgIH0pLFxuICAgICAgICB0YWtlVW50aWwodGhpcy51bnN1YnNjcmliZSQpXG4gICAgICApXG4gICAgICAuc3Vic2NyaWJlKCk7XG4gIH1cbn1cbiIsIjxmb3JtXG4gIFtuZ1N0eWxlXT1cImZvcm1TdHlsZVwiXG4gIGNsYXNzPVwiY29udGFjdC1mb3JtXCJcbiAgW2Zvcm1Hcm91cF09XCJmb3JtR3JvdXBcIlxuICAobmdTdWJtaXQpPVwic3VibWl0Rm9ybURhdGEoZm9ybUdyb3VwKVwiXG4gIGZ4TGF5b3V0PVwiY29sdW1uXCJcbiAgZnhGbGV4XG4+XG4gIDxtYXQtZm9ybS1maWVsZCBjbGFzcz1cImZvcm0tZmllbGRcIiBhcHBlYXJhbmNlPVwib3V0bGluZVwiIGZ4RmxleD5cbiAgICA8bWF0LWxhYmVsIFtuZ1N0eWxlXT1cInRleHRTdHlsZVwiIGZvcj1cIm5hbWVcIj57eyBuYW1lTGFiZWwgfX08L21hdC1sYWJlbD5cbiAgICA8aW5wdXRcbiAgICAgIFtuZ1N0eWxlXT1cInRleHRTdHlsZVwiXG4gICAgICBtYXRJbnB1dFxuICAgICAgY2xhc3M9XCJmb3JtLWNvbnRyb2xcIlxuICAgICAgdHlwZT1cInRleHRcIlxuICAgICAgbmFtZT1cIm5hbWVcIlxuICAgICAgZm9ybUNvbnRyb2xOYW1lPVwibmFtZVwiXG4gICAgLz5cbiAgPC9tYXQtZm9ybS1maWVsZD5cbiAgPG1hdC1mb3JtLWZpZWxkIGNsYXNzPVwiZm9ybS1maWVsZFwiIGFwcGVhcmFuY2U9XCJvdXRsaW5lXCIgZnhGbGV4PlxuICAgIDxtYXQtbGFiZWwgW25nU3R5bGVdPVwidGV4dFN0eWxlXCIgZm9yPVwiZW1haWxcIj57e1xuICAgICAgZW1haWxBZGRyZXNzTGFiZWxcbiAgICB9fTwvbWF0LWxhYmVsPlxuICAgIDxpbnB1dFxuICAgICAgW25nU3R5bGVdPVwidGV4dFN0eWxlXCJcbiAgICAgIG1hdElucHV0XG4gICAgICBjbGFzcz1cImZvcm0tY29udHJvbFwiXG4gICAgICB0eXBlPVwiZW1haWxcIlxuICAgICAgbmFtZT1cImVtYWlsXCJcbiAgICAgIGZvcm1Db250cm9sTmFtZT1cImVtYWlsXCJcbiAgICAvPlxuICA8L21hdC1mb3JtLWZpZWxkPlxuICA8bWF0LWZvcm0tZmllbGQgY2xhc3M9XCJmb3JtLWZpZWxkXCIgYXBwZWFyYW5jZT1cIm91dGxpbmVcIiBmeEZsZXg+XG4gICAgPG1hdC1sYWJlbCBbbmdTdHlsZV09XCJ0ZXh0U3R5bGVcIiBmb3I9XCJtZXNzYWdlXCI+XG4gICAgICB7eyBtZXNzYWdlTGFiZWwgfX1cbiAgICA8L21hdC1sYWJlbD5cbiAgICA8dGV4dGFyZWFcbiAgICAgIFtuZ1N0eWxlXT1cImlucHV0U3R5bGVcIlxuICAgICAgbWF0SW5wdXRcbiAgICAgIGZvcm1Db250cm9sTmFtZT1cIm1lc3NhZ2VcIlxuICAgICAgbmFtZT1cIm1lc3NhZ2VcIlxuICAgID5cbiAgICA8L3RleHRhcmVhPlxuICA8L21hdC1mb3JtLWZpZWxkPlxuICA8YnV0dG9uXG4gICAgW25nU3R5bGVdPVwiYnV0dG9uU3R5bGVcIlxuICAgIGNsYXNzPVwiZm9ybS1idXR0b25cIlxuICAgIHR5cGU9XCJzdWJtaXRcIlxuICAgIFtkaXNhYmxlZF09XCIhZm9ybUdyb3VwLnZhbGlkXCJcbiAgPlxuICAgIHt7IHNlbmRUZXh0IH19XG4gIDwvYnV0dG9uPlxuICA8ZGl2XG4gICAgW25nU3R5bGVdPVwidGV4dFN0eWxlXCJcbiAgICBjbGFzcz1cImZvcm0tc3RhdHVzXCJcbiAgICAqbmdJZj1cIihlbWFpbFNlbnQkIHwgYXN5bmMpID09PSB0cnVlXCJcbiAgPlxuICAgIHt7IHNlbmRTdWNjZXNzZnVsVGV4dCB9fVxuICA8L2Rpdj5cbiAgPGRpdlxuICAgIFtuZ1N0eWxlXT1cInRleHRTdHlsZVwiXG4gICAgY2xhc3M9XCJmb3JtLXN0YXR1c1wiXG4gICAgKm5nSWY9XCIoZW1haWxTZW50JCB8IGFzeW5jKSA9PT0gZmFsc2VcIlxuICA+XG4gICAge3sgc2VuZEVycm9yVGV4dCB9fVxuICA8L2Rpdj5cbjwvZm9ybT5cbiJdfQ==
package/esm2020/lib/contact-form.module.mjs CHANGED
@@ -2,21 +2,39 @@ import { CommonModule } from '@angular/common';
2
2
  import { HttpClientModule } from '@angular/common/http';
3
3
  import { NgModule } from '@angular/core';
4
4
  import { ReactiveFormsModule } from '@angular/forms';
5
+ import { MatInputModule } from '@angular/material/input';
6
+ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
5
7
  import { ContactFormComponent } from './contact-form/contact-form.component';
6
8
  import { EmailApiService } from './email-api.service';
7
9
  import * as i0 from "@angular/core";
8
10
  export class ContactFormModule {
9
11
  }
10
- ContactFormModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
11
- ContactFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, declarations: [ContactFormComponent], imports: [CommonModule, HttpClientModule, ReactiveFormsModule], exports: [ContactFormComponent] });
12
- ContactFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, providers: [EmailApiService], imports: [[CommonModule, HttpClientModule, ReactiveFormsModule]] });
13
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, decorators: [{
12
+ ContactFormModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
13
+ ContactFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, declarations: [ContactFormComponent], imports: [CommonModule,
14
+ HttpClientModule,
15
+ BrowserAnimationsModule,
16
+ ReactiveFormsModule,
17
+ MatInputModule], exports: [ContactFormComponent] });
18
+ ContactFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, providers: [EmailApiService], imports: [[
19
+ CommonModule,
20
+ HttpClientModule,
21
+ BrowserAnimationsModule,
22
+ ReactiveFormsModule,
23
+ MatInputModule
24
+ ]] });
25
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, decorators: [{
14
26
  type: NgModule,
15
27
  args: [{
16
- imports: [CommonModule, HttpClientModule, ReactiveFormsModule],
28
+ imports: [
29
+ CommonModule,
30
+ HttpClientModule,
31
+ BrowserAnimationsModule,
32
+ ReactiveFormsModule,
33
+ MatInputModule
34
+ ],
17
35
  declarations: [ContactFormComponent],
18
36
  exports: [ContactFormComponent],
19
- providers: [EmailApiService],
37
+ providers: [EmailApiService]
20
38
  }]
21
39
  }] });
22
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGFjdC1mb3JtLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvY29udGFjdC1mb3JtL3NyYy9saWIvY29udGFjdC1mb3JtLm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDeEQsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUVyRCxPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSx1Q0FBdUMsQ0FBQztBQUM3RSxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0scUJBQXFCLENBQUM7O0FBUXRELE1BQU0sT0FBTyxpQkFBaUI7OzhHQUFqQixpQkFBaUI7K0dBQWpCLGlCQUFpQixpQkFKYixvQkFBb0IsYUFEekIsWUFBWSxFQUFFLGdCQUFnQixFQUFFLG1CQUFtQixhQUVuRCxvQkFBb0I7K0dBR25CLGlCQUFpQixhQUZqQixDQUFDLGVBQWUsQ0FBQyxZQUhuQixDQUFDLFlBQVksRUFBRSxnQkFBZ0IsRUFBRSxtQkFBbUIsQ0FBQzsyRkFLbkQsaUJBQWlCO2tCQU43QixRQUFRO21CQUFDO29CQUNSLE9BQU8sRUFBRSxDQUFDLFlBQVksRUFBRSxnQkFBZ0IsRUFBRSxtQkFBbUIsQ0FBQztvQkFDOUQsWUFBWSxFQUFFLENBQUMsb0JBQW9CLENBQUM7b0JBQ3BDLE9BQU8sRUFBRSxDQUFDLG9CQUFvQixDQUFDO29CQUMvQixTQUFTLEVBQUUsQ0FBQyxlQUFlLENBQUM7aUJBQzdCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IEh0dHBDbGllbnRNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24vaHR0cCc7XG5pbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgUmVhY3RpdmVGb3Jtc01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcblxuaW1wb3J0IHsgQ29udGFjdEZvcm1Db21wb25lbnQgfSBmcm9tICcuL2NvbnRhY3QtZm9ybS9jb250YWN0LWZvcm0uY29tcG9uZW50JztcbmltcG9ydCB7IEVtYWlsQXBpU2VydmljZSB9IGZyb20gJy4vZW1haWwtYXBpLnNlcnZpY2UnO1xuXG5ATmdNb2R1bGUoe1xuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBIdHRwQ2xpZW50TW9kdWxlLCBSZWFjdGl2ZUZvcm1zTW9kdWxlXSxcbiAgZGVjbGFyYXRpb25zOiBbQ29udGFjdEZvcm1Db21wb25lbnRdLFxuICBleHBvcnRzOiBbQ29udGFjdEZvcm1Db21wb25lbnRdLFxuICBwcm92aWRlcnM6IFtFbWFpbEFwaVNlcnZpY2VdLFxufSlcbmV4cG9ydCBjbGFzcyBDb250YWN0Rm9ybU1vZHVsZSB7fVxuIl19
40
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGFjdC1mb3JtLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvY29udGFjdC1mb3JtL3NyYy9saWIvY29udGFjdC1mb3JtLm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDeEQsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUNyRCxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFDekQsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFFL0UsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDN0UsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHFCQUFxQixDQUFDOztBQWN0RCxNQUFNLE9BQU8saUJBQWlCOzs4R0FBakIsaUJBQWlCOytHQUFqQixpQkFBaUIsaUJBSmIsb0JBQW9CLGFBTmpDLFlBQVk7UUFDWixnQkFBZ0I7UUFDaEIsdUJBQXVCO1FBQ3ZCLG1CQUFtQjtRQUNuQixjQUFjLGFBR04sb0JBQW9COytHQUduQixpQkFBaUIsYUFGakIsQ0FBQyxlQUFlLENBQUMsWUFUbkI7WUFDUCxZQUFZO1lBQ1osZ0JBQWdCO1lBQ2hCLHVCQUF1QjtZQUN2QixtQkFBbUI7WUFDbkIsY0FBYztTQUNmOzJGQUtVLGlCQUFpQjtrQkFaN0IsUUFBUTttQkFBQztvQkFDUixPQUFPLEVBQUU7d0JBQ1AsWUFBWTt3QkFDWixnQkFBZ0I7d0JBQ2hCLHVCQUF1Qjt3QkFDdkIsbUJBQW1CO3dCQUNuQixjQUFjO3FCQUNmO29CQUNELFlBQVksRUFBRSxDQUFDLG9CQUFvQixDQUFDO29CQUNwQyxPQUFPLEVBQUUsQ0FBQyxvQkFBb0IsQ0FBQztvQkFDL0IsU0FBUyxFQUFFLENBQUMsZUFBZSxDQUFDO2lCQUM3QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBIdHRwQ2xpZW50TW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uL2h0dHAnO1xuaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFJlYWN0aXZlRm9ybXNNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBNYXRJbnB1dE1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2lucHV0JztcbmltcG9ydCB7IEJyb3dzZXJBbmltYXRpb25zTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvcGxhdGZvcm0tYnJvd3Nlci9hbmltYXRpb25zJztcblxuaW1wb3J0IHsgQ29udGFjdEZvcm1Db21wb25lbnQgfSBmcm9tICcuL2NvbnRhY3QtZm9ybS9jb250YWN0LWZvcm0uY29tcG9uZW50JztcbmltcG9ydCB7IEVtYWlsQXBpU2VydmljZSB9IGZyb20gJy4vZW1haWwtYXBpLnNlcnZpY2UnO1xuXG5ATmdNb2R1bGUoe1xuICBpbXBvcnRzOiBbXG4gICAgQ29tbW9uTW9kdWxlLFxuICAgIEh0dHBDbGllbnRNb2R1bGUsXG4gICAgQnJvd3NlckFuaW1hdGlvbnNNb2R1bGUsXG4gICAgUmVhY3RpdmVGb3Jtc01vZHVsZSxcbiAgICBNYXRJbnB1dE1vZHVsZVxuICBdLFxuICBkZWNsYXJhdGlvbnM6IFtDb250YWN0Rm9ybUNvbXBvbmVudF0sXG4gIGV4cG9ydHM6IFtDb250YWN0Rm9ybUNvbXBvbmVudF0sXG4gIHByb3ZpZGVyczogW0VtYWlsQXBpU2VydmljZV1cbn0pXG5leHBvcnQgY2xhc3MgQ29udGFjdEZvcm1Nb2R1bGUge31cbiJdfQ==
package/esm2020/lib/email-api.service.mjs CHANGED
@@ -21,9 +21,9 @@ export class EmailApiService {
21
21
  }));
22
22
  }
23
23
  }
24
- EmailApiService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: EmailApiService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
25
- EmailApiService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: EmailApiService, providedIn: 'root' });
26
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: EmailApiService, decorators: [{
24
+ EmailApiService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: EmailApiService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
25
+ EmailApiService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: EmailApiService, providedIn: 'root' });
26
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: EmailApiService, decorators: [{
27
27
  type: Injectable,
28
28
  args: [{
29
29
  providedIn: 'root'
package/fesm2015/tehw0lf-contact-form.mjs CHANGED
@@ -1,13 +1,17 @@
1
- import * as i3 from '@angular/common';
1
+ import * as i4 from '@angular/common';
2
2
  import { CommonModule } from '@angular/common';
3
3
  import * as i1 from '@angular/common/http';
4
4
  import { HttpHeaders, HttpClientModule } from '@angular/common/http';
5
5
  import * as i0 from '@angular/core';
6
- import { Injectable, Component, Input, NgModule } from '@angular/core';
6
+ import { Injectable, Component, ViewEncapsulation, Input, NgModule } from '@angular/core';
7
7
  import * as i1$1 from '@angular/forms';
8
8
  import { FormControl, Validators, ReactiveFormsModule } from '@angular/forms';
9
+ import * as i5 from '@angular/material/input';
10
+ import { MatInputModule } from '@angular/material/input';
11
+ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
9
12
  import { of, Subject } from 'rxjs';
10
13
  import { map, catchError, tap, takeUntil } from 'rxjs/operators';
14
+ import * as i3 from '@angular/material/form-field';
11
15
 
12
16
  class EmailApiService {
13
17
  constructor(http) {
@@ -26,9 +30,9 @@ class EmailApiService {
26
30
  }));
27
31
  }
28
32
  }
29
- EmailApiService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: EmailApiService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
30
- EmailApiService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: EmailApiService, providedIn: 'root' });
31
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: EmailApiService, decorators: [{
33
+ EmailApiService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: EmailApiService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
34
+ EmailApiService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: EmailApiService, providedIn: 'root' });
35
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: EmailApiService, decorators: [{
32
36
  type: Injectable,
33
37
  args: [{
34
38
  providedIn: 'root'
@@ -39,6 +43,27 @@ class ContactFormComponent {
39
43
  constructor(builder, emailService) {
40
44
  this.builder = builder;
41
45
  this.emailService = emailService;
46
+ this.buttonStyle = {
47
+ 'background-color': '#333333',
48
+ border: 'none',
49
+ color: '#cc7832'
50
+ };
51
+ this.formStyle = {
52
+ color: '#437da8',
53
+ 'background-color': 'rgba(34, 34, 34, 0.75)',
54
+ 'backdrop-filter': 'blur(50px)',
55
+ 'box-shadow': '0 2px 10px rgba(0, 0, 0, 0.075)'
56
+ };
57
+ this.inputStyle = {
58
+ color: '#282b2e'
59
+ };
60
+ this.textStyle = { color: '#cc7832' };
61
+ this.nameLabel = 'Your Name';
62
+ this.emailAddressLabel = 'Your E-Mail Address';
63
+ this.messageLabel = 'Your Message';
64
+ this.sendText = 'Send';
65
+ this.sendSuccessfulText = 'E-Mail successfully sent';
66
+ this.sendErrorText = 'Send error';
42
67
  this.apiURL = 'https://forwardmethis.com/';
43
68
  this.email = '';
44
69
  this.emailSent = new Subject();
@@ -69,12 +94,32 @@ class ContactFormComponent {
69
94
  .subscribe();
70
95
  }
71
96
  }
72
- ContactFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormComponent, deps: [{ token: i1$1.FormBuilder }, { token: EmailApiService }], target: i0.ɵɵFactoryTarget.Component });
73
- ContactFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: ContactFormComponent, selector: "contact-form", inputs: { apiURL: "apiURL", email: "email" }, ngImport: i0, template: "<form\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n>\n <div class=\"form-group\">\n <label for=\"name\">Ihr Name</label>\n <input\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n placeholder=\"Name\"\n formControlName=\"name\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"email\">Ihre E-Mail Adresse</label>\n <input\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n placeholder=\"ihre@mail.de\"\n formControlName=\"email\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"message\">Ihre Nachricht</label>\n <textarea class=\"form-control\" formControlName=\"message\" name=\"message\">\n </textarea>\n </div>\n <button class=\"form-button\" type=\"submit\" [disabled]=\"!formGroup.valid\">\n Senden\n </button>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === true\">\n E-Mail erfolgreich versendet!\n </div>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === false\">\n Fehler: E-Mail konnte nicht versendet werden\n </div>\n</form>\n", styles: [".contact-form{background-color:#fff;max-width:500px;margin:auto;padding:40px;box-shadow:0 2px 10px #00000013;box-sizing:border-box}.form-button{display:block;border:1px solid #ced4da;border-radius:.25rem;width:96%;padding:.375rem .75rem}.form-control{display:block;width:90%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#282b2e;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;border-radius:.25rem;margin-top:.5rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-group{margin-bottom:1rem}.form-status{margin-top:2rem}textarea{overflow:auto;resize:vertical}\n"], directives: [{ type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { 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]" }, { type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3.AsyncPipe } });
74
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormComponent, decorators: [{
97
+ ContactFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormComponent, deps: [{ token: i1$1.FormBuilder }, { token: EmailApiService }], target: i0.ɵɵFactoryTarget.Component });
98
+ ContactFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.1", type: ContactFormComponent, selector: "contact-form", inputs: { buttonStyle: "buttonStyle", formStyle: "formStyle", inputStyle: "inputStyle", textStyle: "textStyle", nameLabel: "nameLabel", emailAddressLabel: "emailAddressLabel", messageLabel: "messageLabel", sendText: "sendText", sendSuccessfulText: "sendSuccessfulText", sendErrorText: "sendErrorText", apiURL: "apiURL", email: "email" }, ngImport: i0, template: "<form\n [ngStyle]=\"formStyle\"\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n fxLayout=\"column\"\n fxFlex\n>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"name\">{{ nameLabel }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"email\">{{\n emailAddressLabel\n }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n formControlName=\"email\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"message\">\n {{ messageLabel }}\n </mat-label>\n <textarea\n [ngStyle]=\"inputStyle\"\n matInput\n formControlName=\"message\"\n name=\"message\"\n >\n </textarea>\n </mat-form-field>\n <button\n [ngStyle]=\"buttonStyle\"\n class=\"form-button\"\n type=\"submit\"\n [disabled]=\"!formGroup.valid\"\n >\n {{ sendText }}\n </button>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === true\"\n >\n {{ sendSuccessfulText }}\n </div>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === false\"\n >\n {{ sendErrorText }}\n </div>\n</form>\n", styles: [".contact-form{max-width:500px;margin:auto;padding:40px;box-sizing:border-box}.form-button{margin-top:3rem;display:block;border-radius:.25rem;width:98%;padding:.375rem .75rem}.form-status{margin-top:2rem}textarea{color:inherit!important;background:none!important;overflow:auto;resize:vertical}.mat-form-field-appearance-outline .mat-form-field-infix{border:0;padding:1em 0 .5em}.mat-form-field-appearance-outline .mat-form-field-wrapper{padding-bottom:.25em}.mat-form-field-label{transition:none!important}.mat-form-field-should-float .mat-form-field-label-wrapper{top:-.1em;padding-top:.1em}.mat-form-field-should-float .mat-form-field-label{transition:none!important}.form-field{align-self:center;width:98%}.form-field:last-of-type{margin-top:1rem}\n"], components: [{ type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.MatLabel, selector: "mat-label" }, { type: i5.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"] }, { 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]" }, { type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i4.AsyncPipe }, encapsulation: i0.ViewEncapsulation.None });
99
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormComponent, decorators: [{
75
100
  type: Component,
76
- args: [{ selector: 'contact-form', template: "<form\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n>\n <div class=\"form-group\">\n <label for=\"name\">Ihr Name</label>\n <input\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n placeholder=\"Name\"\n formControlName=\"name\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"email\">Ihre E-Mail Adresse</label>\n <input\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n placeholder=\"ihre@mail.de\"\n formControlName=\"email\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"message\">Ihre Nachricht</label>\n <textarea class=\"form-control\" formControlName=\"message\" name=\"message\">\n </textarea>\n </div>\n <button class=\"form-button\" type=\"submit\" [disabled]=\"!formGroup.valid\">\n Senden\n </button>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === true\">\n E-Mail erfolgreich versendet!\n </div>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === false\">\n Fehler: E-Mail konnte nicht versendet werden\n </div>\n</form>\n", styles: [".contact-form{background-color:#fff;max-width:500px;margin:auto;padding:40px;box-shadow:0 2px 10px #00000013;box-sizing:border-box}.form-button{display:block;border:1px solid #ced4da;border-radius:.25rem;width:96%;padding:.375rem .75rem}.form-control{display:block;width:90%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#282b2e;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;border-radius:.25rem;margin-top:.5rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-group{margin-bottom:1rem}.form-status{margin-top:2rem}textarea{overflow:auto;resize:vertical}\n"] }]
77
- }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: EmailApiService }]; }, propDecorators: { apiURL: [{
101
+ args: [{ selector: 'contact-form', encapsulation: ViewEncapsulation.None, template: "<form\n [ngStyle]=\"formStyle\"\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n fxLayout=\"column\"\n fxFlex\n>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"name\">{{ nameLabel }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"email\">{{\n emailAddressLabel\n }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n formControlName=\"email\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"message\">\n {{ messageLabel }}\n </mat-label>\n <textarea\n [ngStyle]=\"inputStyle\"\n matInput\n formControlName=\"message\"\n name=\"message\"\n >\n </textarea>\n </mat-form-field>\n <button\n [ngStyle]=\"buttonStyle\"\n class=\"form-button\"\n type=\"submit\"\n [disabled]=\"!formGroup.valid\"\n >\n {{ sendText }}\n </button>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === true\"\n >\n {{ sendSuccessfulText }}\n </div>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === false\"\n >\n {{ sendErrorText }}\n </div>\n</form>\n", styles: [".contact-form{max-width:500px;margin:auto;padding:40px;box-sizing:border-box}.form-button{margin-top:3rem;display:block;border-radius:.25rem;width:98%;padding:.375rem .75rem}.form-status{margin-top:2rem}textarea{color:inherit!important;background:none!important;overflow:auto;resize:vertical}.mat-form-field-appearance-outline .mat-form-field-infix{border:0;padding:1em 0 .5em}.mat-form-field-appearance-outline .mat-form-field-wrapper{padding-bottom:.25em}.mat-form-field-label{transition:none!important}.mat-form-field-should-float .mat-form-field-label-wrapper{top:-.1em;padding-top:.1em}.mat-form-field-should-float .mat-form-field-label{transition:none!important}.form-field{align-self:center;width:98%}.form-field:last-of-type{margin-top:1rem}\n"] }]
102
+ }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: EmailApiService }]; }, propDecorators: { buttonStyle: [{
103
+ type: Input
104
+ }], formStyle: [{
105
+ type: Input
106
+ }], inputStyle: [{
107
+ type: Input
108
+ }], textStyle: [{
109
+ type: Input
110
+ }], nameLabel: [{
111
+ type: Input
112
+ }], emailAddressLabel: [{
113
+ type: Input
114
+ }], messageLabel: [{
115
+ type: Input
116
+ }], sendText: [{
117
+ type: Input
118
+ }], sendSuccessfulText: [{
119
+ type: Input
120
+ }], sendErrorText: [{
121
+ type: Input
122
+ }], apiURL: [{
78
123
  type: Input
79
124
  }], email: [{
80
125
  type: Input
@@ -82,16 +127,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
82
127
 
83
128
  class ContactFormModule {
84
129
  }
85
- ContactFormModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
86
- ContactFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, declarations: [ContactFormComponent], imports: [CommonModule, HttpClientModule, ReactiveFormsModule], exports: [ContactFormComponent] });
87
- ContactFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, providers: [EmailApiService], imports: [[CommonModule, HttpClientModule, ReactiveFormsModule]] });
88
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, decorators: [{
130
+ ContactFormModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
131
+ ContactFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, declarations: [ContactFormComponent], imports: [CommonModule,
132
+ HttpClientModule,
133
+ BrowserAnimationsModule,
134
+ ReactiveFormsModule,
135
+ MatInputModule], exports: [ContactFormComponent] });
136
+ ContactFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, providers: [EmailApiService], imports: [[
137
+ CommonModule,
138
+ HttpClientModule,
139
+ BrowserAnimationsModule,
140
+ ReactiveFormsModule,
141
+ MatInputModule
142
+ ]] });
143
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, decorators: [{
89
144
  type: NgModule,
90
145
  args: [{
91
- imports: [CommonModule, HttpClientModule, ReactiveFormsModule],
146
+ imports: [
147
+ CommonModule,
148
+ HttpClientModule,
149
+ BrowserAnimationsModule,
150
+ ReactiveFormsModule,
151
+ MatInputModule
152
+ ],
92
153
  declarations: [ContactFormComponent],
93
154
  exports: [ContactFormComponent],
94
- providers: [EmailApiService],
155
+ providers: [EmailApiService]
95
156
  }]
96
157
  }] });
97
158
 
package/fesm2015/tehw0lf-contact-form.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tehw0lf-contact-form.mjs","sources":["../../../../libs/contact-form/src/lib/email-api.service.ts","../../../../libs/contact-form/src/lib/contact-form/contact-form.component.ts","../../../../libs/contact-form/src/lib/contact-form/contact-form.component.html","../../../../libs/contact-form/src/lib/contact-form.module.ts","../../../../libs/contact-form/src/tehw0lf-contact-form.ts"],"sourcesContent":["import { HttpClient, HttpHeaders } from '@angular/common/http';\nimport { Injectable } from '@angular/core';\nimport { Observable, of } from 'rxjs';\nimport { catchError, map } from 'rxjs/operators';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class EmailApiService {\n httpOptions = {\n headers: new HttpHeaders({\n 'Content-Type': 'application/json'\n })\n };\n constructor(private http: HttpClient) {}\n\n sendEmail(apiURL: string, data: any): Observable<any> {\n return this.http.post(apiURL, JSON.stringify(data), this.httpOptions).pipe(\n map((response: any) => {\n return response;\n }),\n catchError((error: any) => {\n return of(error.statusText);\n })\n );\n }\n}\n","import { Component, Input, OnDestroy } from '@angular/core';\nimport { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';\nimport { Subject } from 'rxjs';\nimport { takeUntil, tap } from 'rxjs/operators';\n\nimport { EmailApiService } from '../email-api.service';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'contact-form',\n templateUrl: './contact-form.component.html',\n styleUrls: ['./contact-form.component.scss']\n})\nexport class ContactFormComponent implements OnDestroy {\n @Input() apiURL = 'https://forwardmethis.com/';\n @Input() email = '';\n\n formGroup: FormGroup;\n emailSent: Subject<boolean | null> = new Subject();\n emailSent$ = this.emailSent.asObservable();\n\n private unsubscribe$: Subject<void> = new Subject();\n\n constructor(\n private builder: FormBuilder,\n private emailService: EmailApiService\n ) {\n this.emailSent.next(null);\n this.formGroup = this.builder.group({\n name: new FormControl('', [Validators.required]),\n email: new FormControl('', [Validators.required, Validators.email]),\n message: new FormControl('', [Validators.required])\n });\n }\n\n ngOnDestroy(): void {\n this.unsubscribe$.next();\n this.unsubscribe$.complete();\n }\n\n submitFormData(formData: FormGroup) {\n this.emailService\n .sendEmail(`${this.apiURL}${this.email}`, formData.value)\n .pipe(\n tap((response: string) => {\n if (response === 'OK') {\n this.emailSent.next(true);\n } else {\n this.emailSent.next(false);\n }\n }),\n takeUntil(this.unsubscribe$)\n )\n .subscribe();\n }\n}\n","<form\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n>\n <div class=\"form-group\">\n <label for=\"name\">Ihr Name</label>\n <input\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n placeholder=\"Name\"\n formControlName=\"name\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"email\">Ihre E-Mail Adresse</label>\n <input\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n placeholder=\"ihre@mail.de\"\n formControlName=\"email\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"message\">Ihre Nachricht</label>\n <textarea class=\"form-control\" formControlName=\"message\" name=\"message\">\n </textarea>\n </div>\n <button class=\"form-button\" type=\"submit\" [disabled]=\"!formGroup.valid\">\n Senden\n </button>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === true\">\n E-Mail erfolgreich versendet!\n </div>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === false\">\n Fehler: E-Mail konnte nicht versendet werden\n </div>\n</form>\n","import { CommonModule } from '@angular/common';\nimport { HttpClientModule } from '@angular/common/http';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { ContactFormComponent } from './contact-form/contact-form.component';\nimport { EmailApiService } from './email-api.service';\n\n@NgModule({\n imports: [CommonModule, HttpClientModule, ReactiveFormsModule],\n declarations: [ContactFormComponent],\n exports: [ContactFormComponent],\n providers: [EmailApiService],\n})\nexport class ContactFormModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"tehw0lf-contact-form.mjs","sources":["../../../../libs/contact-form/src/lib/email-api.service.ts","../../../../libs/contact-form/src/lib/contact-form/contact-form.component.ts","../../../../libs/contact-form/src/lib/contact-form/contact-form.component.html","../../../../libs/contact-form/src/lib/contact-form.module.ts","../../../../libs/contact-form/src/tehw0lf-contact-form.ts"],"sourcesContent":["import { HttpClient, HttpHeaders } from '@angular/common/http';\nimport { Injectable } from '@angular/core';\nimport { Observable, of } from 'rxjs';\nimport { catchError, map } from 'rxjs/operators';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class EmailApiService {\n httpOptions = {\n headers: new HttpHeaders({\n 'Content-Type': 'application/json'\n })\n };\n constructor(private http: HttpClient) {}\n\n sendEmail(apiURL: string, data: any): Observable<any> {\n return this.http.post(apiURL, JSON.stringify(data), this.httpOptions).pipe(\n map((response: any) => {\n return response;\n }),\n catchError((error: any) => {\n return of(error.statusText);\n })\n );\n }\n}\n","import { Component, Input, OnDestroy, ViewEncapsulation } from '@angular/core';\nimport { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';\nimport { Subject } from 'rxjs';\nimport { takeUntil, tap } from 'rxjs/operators';\n\nimport { EmailApiService } from '../email-api.service';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'contact-form',\n templateUrl: './contact-form.component.html',\n encapsulation: ViewEncapsulation.None,\n styleUrls: ['./contact-form.component.scss']\n})\nexport class ContactFormComponent implements OnDestroy {\n @Input() buttonStyle = {\n 'background-color': '#333333',\n border: 'none',\n color: '#cc7832'\n };\n\n @Input() formStyle = {\n color: '#437da8',\n 'background-color': 'rgba(34, 34, 34, 0.75)',\n 'backdrop-filter': 'blur(50px)',\n 'box-shadow': '0 2px 10px rgba(0, 0, 0, 0.075)'\n };\n\n @Input() inputStyle = {\n color: '#282b2e'\n };\n\n @Input() textStyle = { color: '#cc7832' };\n\n @Input() nameLabel = 'Your Name';\n\n @Input() emailAddressLabel = 'Your E-Mail Address';\n\n @Input() messageLabel = 'Your Message';\n\n @Input() sendText = 'Send';\n\n @Input() sendSuccessfulText = 'E-Mail successfully sent';\n\n @Input() sendErrorText = 'Send error';\n\n @Input() apiURL = 'https://forwardmethis.com/';\n @Input() email = '';\n\n formGroup: FormGroup;\n emailSent: Subject<boolean | null> = new Subject();\n emailSent$ = this.emailSent.asObservable();\n\n private unsubscribe$: Subject<void> = new Subject();\n\n constructor(\n private builder: FormBuilder,\n private emailService: EmailApiService\n ) {\n this.emailSent.next(null);\n this.formGroup = this.builder.group({\n name: new FormControl('', [Validators.required]),\n email: new FormControl('', [Validators.required, Validators.email]),\n message: new FormControl('', [Validators.required])\n });\n }\n\n ngOnDestroy(): void {\n this.unsubscribe$.next();\n this.unsubscribe$.complete();\n }\n\n submitFormData(formData: FormGroup) {\n this.emailService\n .sendEmail(`${this.apiURL}${this.email}`, formData.value)\n .pipe(\n tap((response: string) => {\n if (response === 'OK') {\n this.emailSent.next(true);\n } else {\n this.emailSent.next(false);\n }\n }),\n takeUntil(this.unsubscribe$)\n )\n .subscribe();\n }\n}\n","<form\n [ngStyle]=\"formStyle\"\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n fxLayout=\"column\"\n fxFlex\n>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"name\">{{ nameLabel }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"email\">{{\n emailAddressLabel\n }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n formControlName=\"email\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"message\">\n {{ messageLabel }}\n </mat-label>\n <textarea\n [ngStyle]=\"inputStyle\"\n matInput\n formControlName=\"message\"\n name=\"message\"\n >\n </textarea>\n </mat-form-field>\n <button\n [ngStyle]=\"buttonStyle\"\n class=\"form-button\"\n type=\"submit\"\n [disabled]=\"!formGroup.valid\"\n >\n {{ sendText }}\n </button>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === true\"\n >\n {{ sendSuccessfulText }}\n </div>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === false\"\n >\n {{ sendErrorText }}\n </div>\n</form>\n","import { CommonModule } from '@angular/common';\nimport { HttpClientModule } from '@angular/common/http';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { MatInputModule } from '@angular/material/input';\nimport { BrowserAnimationsModule } from '@angular/platform-browser/animations';\n\nimport { ContactFormComponent } from './contact-form/contact-form.component';\nimport { EmailApiService } from './email-api.service';\n\n@NgModule({\n imports: [\n CommonModule,\n HttpClientModule,\n BrowserAnimationsModule,\n ReactiveFormsModule,\n MatInputModule\n ],\n declarations: [ContactFormComponent],\n exports: [ContactFormComponent],\n providers: [EmailApiService]\n})\nexport class ContactFormModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
package/fesm2020/tehw0lf-contact-form.mjs CHANGED
@@ -1,13 +1,17 @@
1
- import * as i3 from '@angular/common';
1
+ import * as i4 from '@angular/common';
2
2
  import { CommonModule } from '@angular/common';
3
3
  import * as i1 from '@angular/common/http';
4
4
  import { HttpHeaders, HttpClientModule } from '@angular/common/http';
5
5
  import * as i0 from '@angular/core';
6
- import { Injectable, Component, Input, NgModule } from '@angular/core';
6
+ import { Injectable, Component, ViewEncapsulation, Input, NgModule } from '@angular/core';
7
7
  import * as i1$1 from '@angular/forms';
8
8
  import { FormControl, Validators, ReactiveFormsModule } from '@angular/forms';
9
+ import * as i5 from '@angular/material/input';
10
+ import { MatInputModule } from '@angular/material/input';
11
+ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
9
12
  import { of, Subject } from 'rxjs';
10
13
  import { map, catchError, tap, takeUntil } from 'rxjs/operators';
14
+ import * as i3 from '@angular/material/form-field';
11
15
 
12
16
  class EmailApiService {
13
17
  constructor(http) {
@@ -26,9 +30,9 @@ class EmailApiService {
26
30
  }));
27
31
  }
28
32
  }
29
- EmailApiService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: EmailApiService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
30
- EmailApiService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: EmailApiService, providedIn: 'root' });
31
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: EmailApiService, decorators: [{
33
+ EmailApiService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: EmailApiService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
34
+ EmailApiService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: EmailApiService, providedIn: 'root' });
35
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: EmailApiService, decorators: [{
32
36
  type: Injectable,
33
37
  args: [{
34
38
  providedIn: 'root'
@@ -39,6 +43,27 @@ class ContactFormComponent {
39
43
  constructor(builder, emailService) {
40
44
  this.builder = builder;
41
45
  this.emailService = emailService;
46
+ this.buttonStyle = {
47
+ 'background-color': '#333333',
48
+ border: 'none',
49
+ color: '#cc7832'
50
+ };
51
+ this.formStyle = {
52
+ color: '#437da8',
53
+ 'background-color': 'rgba(34, 34, 34, 0.75)',
54
+ 'backdrop-filter': 'blur(50px)',
55
+ 'box-shadow': '0 2px 10px rgba(0, 0, 0, 0.075)'
56
+ };
57
+ this.inputStyle = {
58
+ color: '#282b2e'
59
+ };
60
+ this.textStyle = { color: '#cc7832' };
61
+ this.nameLabel = 'Your Name';
62
+ this.emailAddressLabel = 'Your E-Mail Address';
63
+ this.messageLabel = 'Your Message';
64
+ this.sendText = 'Send';
65
+ this.sendSuccessfulText = 'E-Mail successfully sent';
66
+ this.sendErrorText = 'Send error';
42
67
  this.apiURL = 'https://forwardmethis.com/';
43
68
  this.email = '';
44
69
  this.emailSent = new Subject();
@@ -69,12 +94,32 @@ class ContactFormComponent {
69
94
  .subscribe();
70
95
  }
71
96
  }
72
- ContactFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormComponent, deps: [{ token: i1$1.FormBuilder }, { token: EmailApiService }], target: i0.ɵɵFactoryTarget.Component });
73
- ContactFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: ContactFormComponent, selector: "contact-form", inputs: { apiURL: "apiURL", email: "email" }, ngImport: i0, template: "<form\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n>\n <div class=\"form-group\">\n <label for=\"name\">Ihr Name</label>\n <input\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n placeholder=\"Name\"\n formControlName=\"name\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"email\">Ihre E-Mail Adresse</label>\n <input\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n placeholder=\"ihre@mail.de\"\n formControlName=\"email\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"message\">Ihre Nachricht</label>\n <textarea class=\"form-control\" formControlName=\"message\" name=\"message\">\n </textarea>\n </div>\n <button class=\"form-button\" type=\"submit\" [disabled]=\"!formGroup.valid\">\n Senden\n </button>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === true\">\n E-Mail erfolgreich versendet!\n </div>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === false\">\n Fehler: E-Mail konnte nicht versendet werden\n </div>\n</form>\n", styles: [".contact-form{background-color:#fff;max-width:500px;margin:auto;padding:40px;box-shadow:0 2px 10px #00000013;box-sizing:border-box}.form-button{display:block;border:1px solid #ced4da;border-radius:.25rem;width:96%;padding:.375rem .75rem}.form-control{display:block;width:90%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#282b2e;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;border-radius:.25rem;margin-top:.5rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-group{margin-bottom:1rem}.form-status{margin-top:2rem}textarea{overflow:auto;resize:vertical}\n"], directives: [{ type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { 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]" }, { type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3.AsyncPipe } });
74
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormComponent, decorators: [{
97
+ ContactFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormComponent, deps: [{ token: i1$1.FormBuilder }, { token: EmailApiService }], target: i0.ɵɵFactoryTarget.Component });
98
+ ContactFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.1", type: ContactFormComponent, selector: "contact-form", inputs: { buttonStyle: "buttonStyle", formStyle: "formStyle", inputStyle: "inputStyle", textStyle: "textStyle", nameLabel: "nameLabel", emailAddressLabel: "emailAddressLabel", messageLabel: "messageLabel", sendText: "sendText", sendSuccessfulText: "sendSuccessfulText", sendErrorText: "sendErrorText", apiURL: "apiURL", email: "email" }, ngImport: i0, template: "<form\n [ngStyle]=\"formStyle\"\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n fxLayout=\"column\"\n fxFlex\n>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"name\">{{ nameLabel }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"email\">{{\n emailAddressLabel\n }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n formControlName=\"email\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"message\">\n {{ messageLabel }}\n </mat-label>\n <textarea\n [ngStyle]=\"inputStyle\"\n matInput\n formControlName=\"message\"\n name=\"message\"\n >\n </textarea>\n </mat-form-field>\n <button\n [ngStyle]=\"buttonStyle\"\n class=\"form-button\"\n type=\"submit\"\n [disabled]=\"!formGroup.valid\"\n >\n {{ sendText }}\n </button>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === true\"\n >\n {{ sendSuccessfulText }}\n </div>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === false\"\n >\n {{ sendErrorText }}\n </div>\n</form>\n", styles: [".contact-form{max-width:500px;margin:auto;padding:40px;box-sizing:border-box}.form-button{margin-top:3rem;display:block;border-radius:.25rem;width:98%;padding:.375rem .75rem}.form-status{margin-top:2rem}textarea{color:inherit!important;background:none!important;overflow:auto;resize:vertical}.mat-form-field-appearance-outline .mat-form-field-infix{border:0;padding:1em 0 .5em}.mat-form-field-appearance-outline .mat-form-field-wrapper{padding-bottom:.25em}.mat-form-field-label{transition:none!important}.mat-form-field-should-float .mat-form-field-label-wrapper{top:-.1em;padding-top:.1em}.mat-form-field-should-float .mat-form-field-label{transition:none!important}.form-field{align-self:center;width:98%}.form-field:last-of-type{margin-top:1rem}\n"], components: [{ type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.MatLabel, selector: "mat-label" }, { type: i5.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"] }, { 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]" }, { type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i4.AsyncPipe }, encapsulation: i0.ViewEncapsulation.None });
99
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormComponent, decorators: [{
75
100
  type: Component,
76
- args: [{ selector: 'contact-form', template: "<form\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n>\n <div class=\"form-group\">\n <label for=\"name\">Ihr Name</label>\n <input\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n placeholder=\"Name\"\n formControlName=\"name\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"email\">Ihre E-Mail Adresse</label>\n <input\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n placeholder=\"ihre@mail.de\"\n formControlName=\"email\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"message\">Ihre Nachricht</label>\n <textarea class=\"form-control\" formControlName=\"message\" name=\"message\">\n </textarea>\n </div>\n <button class=\"form-button\" type=\"submit\" [disabled]=\"!formGroup.valid\">\n Senden\n </button>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === true\">\n E-Mail erfolgreich versendet!\n </div>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === false\">\n Fehler: E-Mail konnte nicht versendet werden\n </div>\n</form>\n", styles: [".contact-form{background-color:#fff;max-width:500px;margin:auto;padding:40px;box-shadow:0 2px 10px #00000013;box-sizing:border-box}.form-button{display:block;border:1px solid #ced4da;border-radius:.25rem;width:96%;padding:.375rem .75rem}.form-control{display:block;width:90%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#282b2e;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;border-radius:.25rem;margin-top:.5rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-group{margin-bottom:1rem}.form-status{margin-top:2rem}textarea{overflow:auto;resize:vertical}\n"] }]
77
- }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: EmailApiService }]; }, propDecorators: { apiURL: [{
101
+ args: [{ selector: 'contact-form', encapsulation: ViewEncapsulation.None, template: "<form\n [ngStyle]=\"formStyle\"\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n fxLayout=\"column\"\n fxFlex\n>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"name\">{{ nameLabel }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"email\">{{\n emailAddressLabel\n }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n formControlName=\"email\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"message\">\n {{ messageLabel }}\n </mat-label>\n <textarea\n [ngStyle]=\"inputStyle\"\n matInput\n formControlName=\"message\"\n name=\"message\"\n >\n </textarea>\n </mat-form-field>\n <button\n [ngStyle]=\"buttonStyle\"\n class=\"form-button\"\n type=\"submit\"\n [disabled]=\"!formGroup.valid\"\n >\n {{ sendText }}\n </button>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === true\"\n >\n {{ sendSuccessfulText }}\n </div>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === false\"\n >\n {{ sendErrorText }}\n </div>\n</form>\n", styles: [".contact-form{max-width:500px;margin:auto;padding:40px;box-sizing:border-box}.form-button{margin-top:3rem;display:block;border-radius:.25rem;width:98%;padding:.375rem .75rem}.form-status{margin-top:2rem}textarea{color:inherit!important;background:none!important;overflow:auto;resize:vertical}.mat-form-field-appearance-outline .mat-form-field-infix{border:0;padding:1em 0 .5em}.mat-form-field-appearance-outline .mat-form-field-wrapper{padding-bottom:.25em}.mat-form-field-label{transition:none!important}.mat-form-field-should-float .mat-form-field-label-wrapper{top:-.1em;padding-top:.1em}.mat-form-field-should-float .mat-form-field-label{transition:none!important}.form-field{align-self:center;width:98%}.form-field:last-of-type{margin-top:1rem}\n"] }]
102
+ }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: EmailApiService }]; }, propDecorators: { buttonStyle: [{
103
+ type: Input
104
+ }], formStyle: [{
105
+ type: Input
106
+ }], inputStyle: [{
107
+ type: Input
108
+ }], textStyle: [{
109
+ type: Input
110
+ }], nameLabel: [{
111
+ type: Input
112
+ }], emailAddressLabel: [{
113
+ type: Input
114
+ }], messageLabel: [{
115
+ type: Input
116
+ }], sendText: [{
117
+ type: Input
118
+ }], sendSuccessfulText: [{
119
+ type: Input
120
+ }], sendErrorText: [{
121
+ type: Input
122
+ }], apiURL: [{
78
123
  type: Input
79
124
  }], email: [{
80
125
  type: Input
@@ -82,16 +127,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
82
127
 
83
128
  class ContactFormModule {
84
129
  }
85
- ContactFormModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
86
- ContactFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, declarations: [ContactFormComponent], imports: [CommonModule, HttpClientModule, ReactiveFormsModule], exports: [ContactFormComponent] });
87
- ContactFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, providers: [EmailApiService], imports: [[CommonModule, HttpClientModule, ReactiveFormsModule]] });
88
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ContactFormModule, decorators: [{
130
+ ContactFormModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
131
+ ContactFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, declarations: [ContactFormComponent], imports: [CommonModule,
132
+ HttpClientModule,
133
+ BrowserAnimationsModule,
134
+ ReactiveFormsModule,
135
+ MatInputModule], exports: [ContactFormComponent] });
136
+ ContactFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, providers: [EmailApiService], imports: [[
137
+ CommonModule,
138
+ HttpClientModule,
139
+ BrowserAnimationsModule,
140
+ ReactiveFormsModule,
141
+ MatInputModule
142
+ ]] });
143
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.1", ngImport: i0, type: ContactFormModule, decorators: [{
89
144
  type: NgModule,
90
145
  args: [{
91
- imports: [CommonModule, HttpClientModule, ReactiveFormsModule],
146
+ imports: [
147
+ CommonModule,
148
+ HttpClientModule,
149
+ BrowserAnimationsModule,
150
+ ReactiveFormsModule,
151
+ MatInputModule
152
+ ],
92
153
  declarations: [ContactFormComponent],
93
154
  exports: [ContactFormComponent],
94
- providers: [EmailApiService],
155
+ providers: [EmailApiService]
95
156
  }]
96
157
  }] });
97
158
 
package/fesm2020/tehw0lf-contact-form.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tehw0lf-contact-form.mjs","sources":["../../../../libs/contact-form/src/lib/email-api.service.ts","../../../../libs/contact-form/src/lib/contact-form/contact-form.component.ts","../../../../libs/contact-form/src/lib/contact-form/contact-form.component.html","../../../../libs/contact-form/src/lib/contact-form.module.ts","../../../../libs/contact-form/src/tehw0lf-contact-form.ts"],"sourcesContent":["import { HttpClient, HttpHeaders } from '@angular/common/http';\nimport { Injectable } from '@angular/core';\nimport { Observable, of } from 'rxjs';\nimport { catchError, map } from 'rxjs/operators';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class EmailApiService {\n httpOptions = {\n headers: new HttpHeaders({\n 'Content-Type': 'application/json'\n })\n };\n constructor(private http: HttpClient) {}\n\n sendEmail(apiURL: string, data: any): Observable<any> {\n return this.http.post(apiURL, JSON.stringify(data), this.httpOptions).pipe(\n map((response: any) => {\n return response;\n }),\n catchError((error: any) => {\n return of(error.statusText);\n })\n );\n }\n}\n","import { Component, Input, OnDestroy } from '@angular/core';\nimport { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';\nimport { Subject } from 'rxjs';\nimport { takeUntil, tap } from 'rxjs/operators';\n\nimport { EmailApiService } from '../email-api.service';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'contact-form',\n templateUrl: './contact-form.component.html',\n styleUrls: ['./contact-form.component.scss']\n})\nexport class ContactFormComponent implements OnDestroy {\n @Input() apiURL = 'https://forwardmethis.com/';\n @Input() email = '';\n\n formGroup: FormGroup;\n emailSent: Subject<boolean | null> = new Subject();\n emailSent$ = this.emailSent.asObservable();\n\n private unsubscribe$: Subject<void> = new Subject();\n\n constructor(\n private builder: FormBuilder,\n private emailService: EmailApiService\n ) {\n this.emailSent.next(null);\n this.formGroup = this.builder.group({\n name: new FormControl('', [Validators.required]),\n email: new FormControl('', [Validators.required, Validators.email]),\n message: new FormControl('', [Validators.required])\n });\n }\n\n ngOnDestroy(): void {\n this.unsubscribe$.next();\n this.unsubscribe$.complete();\n }\n\n submitFormData(formData: FormGroup) {\n this.emailService\n .sendEmail(`${this.apiURL}${this.email}`, formData.value)\n .pipe(\n tap((response: string) => {\n if (response === 'OK') {\n this.emailSent.next(true);\n } else {\n this.emailSent.next(false);\n }\n }),\n takeUntil(this.unsubscribe$)\n )\n .subscribe();\n }\n}\n","<form\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n>\n <div class=\"form-group\">\n <label for=\"name\">Ihr Name</label>\n <input\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n placeholder=\"Name\"\n formControlName=\"name\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"email\">Ihre E-Mail Adresse</label>\n <input\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n placeholder=\"ihre@mail.de\"\n formControlName=\"email\"\n />\n </div>\n <div class=\"form-group\">\n <label for=\"message\">Ihre Nachricht</label>\n <textarea class=\"form-control\" formControlName=\"message\" name=\"message\">\n </textarea>\n </div>\n <button class=\"form-button\" type=\"submit\" [disabled]=\"!formGroup.valid\">\n Senden\n </button>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === true\">\n E-Mail erfolgreich versendet!\n </div>\n <div class=\"form-status\" *ngIf=\"(emailSent$ | async) === false\">\n Fehler: E-Mail konnte nicht versendet werden\n </div>\n</form>\n","import { CommonModule } from '@angular/common';\nimport { HttpClientModule } from '@angular/common/http';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { ContactFormComponent } from './contact-form/contact-form.component';\nimport { EmailApiService } from './email-api.service';\n\n@NgModule({\n imports: [CommonModule, HttpClientModule, ReactiveFormsModule],\n declarations: [ContactFormComponent],\n exports: [ContactFormComponent],\n providers: [EmailApiService],\n})\nexport class ContactFormModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"tehw0lf-contact-form.mjs","sources":["../../../../libs/contact-form/src/lib/email-api.service.ts","../../../../libs/contact-form/src/lib/contact-form/contact-form.component.ts","../../../../libs/contact-form/src/lib/contact-form/contact-form.component.html","../../../../libs/contact-form/src/lib/contact-form.module.ts","../../../../libs/contact-form/src/tehw0lf-contact-form.ts"],"sourcesContent":["import { HttpClient, HttpHeaders } from '@angular/common/http';\nimport { Injectable } from '@angular/core';\nimport { Observable, of } from 'rxjs';\nimport { catchError, map } from 'rxjs/operators';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class EmailApiService {\n httpOptions = {\n headers: new HttpHeaders({\n 'Content-Type': 'application/json'\n })\n };\n constructor(private http: HttpClient) {}\n\n sendEmail(apiURL: string, data: any): Observable<any> {\n return this.http.post(apiURL, JSON.stringify(data), this.httpOptions).pipe(\n map((response: any) => {\n return response;\n }),\n catchError((error: any) => {\n return of(error.statusText);\n })\n );\n }\n}\n","import { Component, Input, OnDestroy, ViewEncapsulation } from '@angular/core';\nimport { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';\nimport { Subject } from 'rxjs';\nimport { takeUntil, tap } from 'rxjs/operators';\n\nimport { EmailApiService } from '../email-api.service';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'contact-form',\n templateUrl: './contact-form.component.html',\n encapsulation: ViewEncapsulation.None,\n styleUrls: ['./contact-form.component.scss']\n})\nexport class ContactFormComponent implements OnDestroy {\n @Input() buttonStyle = {\n 'background-color': '#333333',\n border: 'none',\n color: '#cc7832'\n };\n\n @Input() formStyle = {\n color: '#437da8',\n 'background-color': 'rgba(34, 34, 34, 0.75)',\n 'backdrop-filter': 'blur(50px)',\n 'box-shadow': '0 2px 10px rgba(0, 0, 0, 0.075)'\n };\n\n @Input() inputStyle = {\n color: '#282b2e'\n };\n\n @Input() textStyle = { color: '#cc7832' };\n\n @Input() nameLabel = 'Your Name';\n\n @Input() emailAddressLabel = 'Your E-Mail Address';\n\n @Input() messageLabel = 'Your Message';\n\n @Input() sendText = 'Send';\n\n @Input() sendSuccessfulText = 'E-Mail successfully sent';\n\n @Input() sendErrorText = 'Send error';\n\n @Input() apiURL = 'https://forwardmethis.com/';\n @Input() email = '';\n\n formGroup: FormGroup;\n emailSent: Subject<boolean | null> = new Subject();\n emailSent$ = this.emailSent.asObservable();\n\n private unsubscribe$: Subject<void> = new Subject();\n\n constructor(\n private builder: FormBuilder,\n private emailService: EmailApiService\n ) {\n this.emailSent.next(null);\n this.formGroup = this.builder.group({\n name: new FormControl('', [Validators.required]),\n email: new FormControl('', [Validators.required, Validators.email]),\n message: new FormControl('', [Validators.required])\n });\n }\n\n ngOnDestroy(): void {\n this.unsubscribe$.next();\n this.unsubscribe$.complete();\n }\n\n submitFormData(formData: FormGroup) {\n this.emailService\n .sendEmail(`${this.apiURL}${this.email}`, formData.value)\n .pipe(\n tap((response: string) => {\n if (response === 'OK') {\n this.emailSent.next(true);\n } else {\n this.emailSent.next(false);\n }\n }),\n takeUntil(this.unsubscribe$)\n )\n .subscribe();\n }\n}\n","<form\n [ngStyle]=\"formStyle\"\n class=\"contact-form\"\n [formGroup]=\"formGroup\"\n (ngSubmit)=\"submitFormData(formGroup)\"\n fxLayout=\"column\"\n fxFlex\n>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"name\">{{ nameLabel }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"email\">{{\n emailAddressLabel\n }}</mat-label>\n <input\n [ngStyle]=\"textStyle\"\n matInput\n class=\"form-control\"\n type=\"email\"\n name=\"email\"\n formControlName=\"email\"\n />\n </mat-form-field>\n <mat-form-field class=\"form-field\" appearance=\"outline\" fxFlex>\n <mat-label [ngStyle]=\"textStyle\" for=\"message\">\n {{ messageLabel }}\n </mat-label>\n <textarea\n [ngStyle]=\"inputStyle\"\n matInput\n formControlName=\"message\"\n name=\"message\"\n >\n </textarea>\n </mat-form-field>\n <button\n [ngStyle]=\"buttonStyle\"\n class=\"form-button\"\n type=\"submit\"\n [disabled]=\"!formGroup.valid\"\n >\n {{ sendText }}\n </button>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === true\"\n >\n {{ sendSuccessfulText }}\n </div>\n <div\n [ngStyle]=\"textStyle\"\n class=\"form-status\"\n *ngIf=\"(emailSent$ | async) === false\"\n >\n {{ sendErrorText }}\n </div>\n</form>\n","import { CommonModule } from '@angular/common';\nimport { HttpClientModule } from '@angular/common/http';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { MatInputModule } from '@angular/material/input';\nimport { BrowserAnimationsModule } from '@angular/platform-browser/animations';\n\nimport { ContactFormComponent } from './contact-form/contact-form.component';\nimport { EmailApiService } from './email-api.service';\n\n@NgModule({\n imports: [\n CommonModule,\n HttpClientModule,\n BrowserAnimationsModule,\n ReactiveFormsModule,\n MatInputModule\n ],\n declarations: [ContactFormComponent],\n exports: [ContactFormComponent],\n providers: [EmailApiService]\n})\nexport class ContactFormModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
package/lib/contact-form/contact-form.component.d.ts CHANGED
@@ -6,6 +6,29 @@ import * as i0 from "@angular/core";
6
6
  export declare class ContactFormComponent implements OnDestroy {
7
7
  private builder;
8
8
  private emailService;
9
+ buttonStyle: {
10
+ 'background-color': string;
11
+ border: string;
12
+ color: string;
13
+ };
14
+ formStyle: {
15
+ color: string;
16
+ 'background-color': string;
17
+ 'backdrop-filter': string;
18
+ 'box-shadow': string;
19
+ };
20
+ inputStyle: {
21
+ color: string;
22
+ };
23
+ textStyle: {
24
+ color: string;
25
+ };
26
+ nameLabel: string;
27
+ emailAddressLabel: string;
28
+ messageLabel: string;
29
+ sendText: string;
30
+ sendSuccessfulText: string;
31
+ sendErrorText: string;
9
32
  apiURL: string;
10
33
  email: string;
11
34
  formGroup: FormGroup;
@@ -16,5 +39,5 @@ export declare class ContactFormComponent implements OnDestroy {
16
39
  ngOnDestroy(): void;
17
40
  submitFormData(formData: FormGroup): void;
18
41
  static ɵfac: i0.ɵɵFactoryDeclaration<ContactFormComponent, never>;
19
- static ɵcmp: i0.ɵɵComponentDeclaration<ContactFormComponent, "contact-form", never, { "apiURL": "apiURL"; "email": "email"; }, {}, never, never>;
42
+ static ɵcmp: i0.ɵɵComponentDeclaration<ContactFormComponent, "contact-form", never, { "buttonStyle": "buttonStyle"; "formStyle": "formStyle"; "inputStyle": "inputStyle"; "textStyle": "textStyle"; "nameLabel": "nameLabel"; "emailAddressLabel": "emailAddressLabel"; "messageLabel": "messageLabel"; "sendText": "sendText"; "sendSuccessfulText": "sendSuccessfulText"; "sendErrorText": "sendErrorText"; "apiURL": "apiURL"; "email": "email"; }, {}, never, never>;
20
43
  }
package/lib/contact-form.module.d.ts CHANGED
@@ -2,9 +2,11 @@ import * as i0 from "@angular/core";
2
2
  import * as i1 from "./contact-form/contact-form.component";
3
3
  import * as i2 from "@angular/common";
4
4
  import * as i3 from "@angular/common/http";
5
- import * as i4 from "@angular/forms";
5
+ import * as i4 from "@angular/platform-browser/animations";
6
+ import * as i5 from "@angular/forms";
7
+ import * as i6 from "@angular/material/input";
6
8
  export declare class ContactFormModule {
7
9
  static ɵfac: i0.ɵɵFactoryDeclaration<ContactFormModule, never>;
8
- static ɵmod: i0.ɵɵNgModuleDeclaration<ContactFormModule, [typeof i1.ContactFormComponent], [typeof i2.CommonModule, typeof i3.HttpClientModule, typeof i4.ReactiveFormsModule], [typeof i1.ContactFormComponent]>;
10
+ static ɵmod: i0.ɵɵNgModuleDeclaration<ContactFormModule, [typeof i1.ContactFormComponent], [typeof i2.CommonModule, typeof i3.HttpClientModule, typeof i4.BrowserAnimationsModule, typeof i5.ReactiveFormsModule, typeof i6.MatInputModule], [typeof i1.ContactFormComponent]>;
9
11
  static ɵinj: i0.ɵɵInjectorDeclaration<ContactFormModule>;
10
12
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tehw0lf/contact-form",
3
- "version": "0.0.12",
3
+ "version": "0.0.13",
4
4
  "license": "MIT",
5
5
  "homepage": "https://github.com/tehw0lf/tehwol.fi.git",
6
6
  "repository": {
@@ -8,15 +8,16 @@
8
8
  "url": "https://github.com/tehw0lf/tehwol.fi.git"
9
9
  },
10
10
  "peerDependencies": {
11
- "@angular/animations": "^13.1.0",
12
- "@angular/cdk": "^13.1.0",
13
- "@angular/common": "^13.1.0",
14
- "@angular/core": "^13.1.0",
15
- "@angular/flex-layout": "^13.0.0-beta.36",
16
- "@angular/forms": "^13.1.0",
17
- "@angular/material": "^13.1.0",
18
- "rxjs": "~7.4.0",
19
- "@angular/platform-browser-dynamic": "13.1.0"
11
+ "@angular/animations": "^13.2.1",
12
+ "@angular/cdk": "^13.2.1",
13
+ "@angular/common": "^13.2.1",
14
+ "@angular/core": "^13.2.1",
15
+ "@angular/flex-layout": "^13.0.0-beta.38",
16
+ "@angular/forms": "^13.2.1",
17
+ "@angular/material": "^13.2.1",
18
+ "@angular/platform-browser": "13.2.1",
19
+ "rxjs": "~7.5.2",
20
+ "@angular/platform-browser-dynamic": "13.2.1"
20
21
  },
21
22
  "dependencies": {
22
23
  "tslib": "^2.2.0"