@firestitch/app-message 12.3.1 → 12.5.1

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.
@@ -1,10 +1,10 @@
1
1
  import * as i0 from '@angular/core';
2
2
  import { Component, Inject, InjectionToken, ChangeDetectionStrategy, ViewChild, NgModule, Input, Injectable, Pipe } from '@angular/core';
3
- import * as i15 from '@angular/common';
3
+ import * as i16 from '@angular/common';
4
4
  import { CommonModule } from '@angular/common';
5
5
  import { RouterModule } from '@angular/router';
6
6
  import { FlexLayoutModule } from '@angular/flex-layout';
7
- import * as i11 from '@angular/material/button';
7
+ import * as i3 from '@angular/material/button';
8
8
  import { MatButtonModule } from '@angular/material/button';
9
9
  import * as i8 from '@angular/material/core';
10
10
  import { MatOptionModule } from '@angular/material/core';
@@ -12,14 +12,14 @@ import * as i1 from '@angular/material/dialog';
12
12
  import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
13
13
  import * as i6 from '@angular/material/form-field';
14
14
  import { MatFormFieldModule } from '@angular/material/form-field';
15
- import * as i17 from '@angular/material/input';
15
+ import * as i18 from '@angular/material/input';
16
16
  import { MatInputModule } from '@angular/material/input';
17
17
  import * as i7 from '@angular/material/select';
18
18
  import { MatSelectModule } from '@angular/material/select';
19
19
  import * as i5 from '@angular/material/tabs';
20
20
  import { MatTabsModule } from '@angular/material/tabs';
21
21
  import { MatCheckboxModule } from '@angular/material/checkbox';
22
- import * as i3 from '@angular/material/tooltip';
22
+ import * as i3$1 from '@angular/material/tooltip';
23
23
  import { MatTooltipModule } from '@angular/material/tooltip';
24
24
  import * as i6$1 from '@firestitch/label';
25
25
  import { FsLabelModule } from '@firestitch/label';
@@ -27,14 +27,16 @@ import * as i4 from '@firestitch/dialog';
27
27
  import { FsDialogModule } from '@firestitch/dialog';
28
28
  import * as i2$2 from '@firestitch/list';
29
29
  import { FsListComponent, FsListModule } from '@firestitch/list';
30
- import * as i12 from '@firestitch/skeleton';
30
+ import * as i13 from '@firestitch/skeleton';
31
31
  import { FsSkeletonModule } from '@firestitch/skeleton';
32
- import * as i13 from '@angular/forms';
32
+ import * as i14 from '@angular/forms';
33
33
  import { FormsModule } from '@angular/forms';
34
- import * as i14 from '@firestitch/form';
34
+ import * as i15 from '@firestitch/form';
35
35
  import { FsFormModule } from '@firestitch/form';
36
36
  import * as i9 from '@firestitch/text-editor';
37
37
  import { FsTextEditorModule } from '@firestitch/text-editor';
38
+ import * as i10 from '@firestitch/html-editor';
39
+ import { FsHtmlEditorModule, FsHtmlRendererModule } from '@firestitch/html-editor';
38
40
  import { tap, switchMap, map, takeUntil } from 'rxjs/operators';
39
41
  import { of, Subject } from 'rxjs';
40
42
  import { ItemType } from '@firestitch/filter';
@@ -43,10 +45,10 @@ import * as i1$1 from '@firestitch/prompt';
43
45
  import { FsPromptInputModule } from '@firestitch/prompt';
44
46
  import * as i2 from '@firestitch/iframe';
45
47
  import { FsIFrameModule } from '@firestitch/iframe';
46
- import * as i16 from '@angular/flex-layout/flex';
48
+ import * as i17 from '@angular/flex-layout/flex';
47
49
  import * as i1$2 from '@angular/material/icon';
48
50
  import { MatIconModule } from '@angular/material/icon';
49
- import * as i10 from '@firestitch/date';
51
+ import * as i10$1 from '@firestitch/date';
50
52
  import { FsDateModule } from '@firestitch/date';
51
53
  import { SelectionActionType } from '@firestitch/selection';
52
54
  import anchorme from 'anchorme';
@@ -74,7 +76,7 @@ class PreviewComponent {
74
76
  }
75
77
  }
76
78
  PreviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PreviewComponent, deps: [{ token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
77
- PreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: PreviewComponent, selector: "ng-component", ngImport: i0, template: "<fs-dialog>\n <div mat-dialog-title>Preview</div>\n <mat-dialog-content>\n <fs-iframe\n [html]=\"html\"\n [styles]=\"styles\">\n </fs-iframe>\n </mat-dialog-content>\n <mat-dialog-actions>\n <button mat-button [mat-dialog-close]=\"null\" color=\"primary\" type=\"button\">Done</button>\n </mat-dialog-actions>\n</fs-dialog>\n", styles: [""], components: [{ type: i4.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i2.FsIFrameComponent, selector: "fs-iframe", inputs: ["html", "styles"] }, { type: i11.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }] });
79
+ PreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: PreviewComponent, selector: "ng-component", ngImport: i0, template: "<fs-dialog>\n <div mat-dialog-title>Preview</div>\n <mat-dialog-content>\n <fs-iframe\n [html]=\"html\"\n [styles]=\"styles\">\n </fs-iframe>\n </mat-dialog-content>\n <mat-dialog-actions>\n <button mat-button [mat-dialog-close]=\"null\" color=\"primary\" type=\"button\">Done</button>\n </mat-dialog-actions>\n</fs-dialog>\n", styles: [""], components: [{ type: i4.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i2.FsIFrameComponent, selector: "fs-iframe", inputs: ["html", "styles"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }] });
78
80
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PreviewComponent, decorators: [{
79
81
  type: Component,
80
82
  args: [{
@@ -181,7 +183,7 @@ class MessageComponent {
181
183
  }
182
184
  }
183
185
  MessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MessageComponent, deps: [{ token: FS_APP_MESSAGE_CONFIG }, { token: MAT_DIALOG_DATA }, { token: i1$1.FsPrompt }, { token: i2$1.FsMessage }, { token: i1.MatDialog }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
184
- MessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: MessageComponent, selector: "ng-component", ngImport: i0, template: "<form\n fsForm\n [submit]=\"save\"\n #form=\"ngForm\"\n *fsSkeleton=\"message\"\n [confirmTabs]=\"false\">\n <fs-dialog *ngIf=\"message\">\n <div mat-dialog-title>Edit Message</div>\n <mat-dialog-content>\n\n <mat-tab-group (selectedTabChange)=\"tabChange($event)\">\n <mat-tab label=\"General\">\n <ng-template matTabContent>\n <div fxLayout=\"column\">\n <mat-form-field>\n <input\n matInput\n placeholder=\"Name\"\n [(ngModel)]=\"message.name\"\n name=\"Name\"\n required>\n </mat-form-field>\n <mat-form-field>\n <input\n matInput\n placeholder=\"Description\"\n [(ngModel)]=\"message.description\"\n name=\"description\">\n </mat-form-field>\n\n <div\n fxLayout=\"row\"\n fxLayoutGap=\"10px\"\n fxLayout.xs=\"column\"\n fxLayout.sm=\"column\">\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"From Email\"\n [(ngModel)]=\"message.emailMessage.fromEmail\"\n name=\"from_email\">\n </mat-form-field>\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"From Name\"\n [(ngModel)]=\"message.emailMessage.fromName\"\n name=\"from_name\">\n </mat-form-field>\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"Reply To\"\n [(ngModel)]=\"message.emailMessage.replyTo\"\n name=\"reply_to\">\n </mat-form-field>\n </div>\n\n <div\n fxLayout=\"row\"\n fxLayoutGap=\"10px\"\n fxLayout.xs=\"column\"\n fxLayout.sm=\"column\">\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"To\"\n [(ngModel)]=\"message.emailMessage.toRecipients\"\n name=\"to\">\n </mat-form-field>\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"CC\"\n [(ngModel)]=\"message.emailMessage.ccRecipients\"\n name=\"cc\">\n </mat-form-field>\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"BCC\"\n [(ngModel)]=\"message.emailMessage.bccRecipients\"\n name=\"bcc\">\n </mat-form-field>\n </div>\n </div>\n </ng-template>\n </mat-tab>\n <mat-tab label=\"Email Message\" *ngIf=\"message.emailMessage\">\n <ng-template matTabContent>\n <div fxLayout=\"column\">\n <div fxLayout=\"row\" fxLayoutGap=\"10px\">\n <mat-form-field>\n <mat-select\n required\n placeholder=\"Customize Message\"\n [(ngModel)]=\"message.emailMessage.customize\"\n name=\"customizeEmail\">\n <mat-option [value]=\"true\">Yes</mat-option>\n <mat-option [value]=\"false\">No</mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-select\n required\n placeholder=\"Format\"\n [(ngModel)]=\"message.emailMessage.format\"\n name=\"format\">\n <mat-option *ngFor=\"let item of emailMessageFormats\" [value]=\"item.value\">\n {{item.name}}\n </mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-select\n placeholder=\"Template\"\n [(ngModel)]=\"message.emailMessage.messageTemplateId\"\n name=\"template\">\n <mat-option [value]=\"null\">None</mat-option>\n <mat-option *ngFor=\"let item of messageTemplates\" [value]=\"item.id\">\n {{item.name}}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <ng-container *ngIf=\"message.emailMessage.customize\">\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"Subject\"\n [(ngModel)]=\"message.emailMessage.subject\"\n name=\"name\"\n required>\n </mat-form-field>\n\n <div [@.disabled]=\"true\">\n <mat-tab-group [dynamicHeight]=\"false\">\n <mat-tab label=\"Content\">\n <ng-template matTabContent>\n <fs-text-editor\n *ngIf=\"message.emailMessage.format===emailMessageFormat.HTML\"\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\"\n [config]=\"{ language: 'html '}\">\n </fs-text-editor>\n\n <fs-editor-rich-text\n *ngIf=\"message.emailMessage.format===emailMessageFormat.RichText\"\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\">\n </fs-editor-rich-text>\n\n <fs-text-editor\n *ngIf=\"message.emailMessage.format===emailMessageFormat.Text\"\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"emailMessageBody\"\n [config]=\"{ language: 'text' }\">\n </fs-text-editor>\n </ng-template>\n </mat-tab>\n <mat-tab\n *ngIf=\"message.emailMessage.format===emailMessageFormat.HTML\"\n label=\"Styles\">\n <ng-template matTabContent>\n <fs-text-editor\n [(ngModel)]=\"message.emailMessage.styles\"\n name=\"styles\"\n [config]=\"{ language: 'scss' }\">\n </fs-text-editor>\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </div>\n\n </ng-container>\n\n <ng-container *ngIf=\"!message.emailMessage.customize\">\n <fs-label-field>\n <fs-label>Subject</fs-label>\n {{message.defaultEmailSubject}}\n </fs-label-field>\n <div>\n <fs-label-field>\n <fs-label>Content</fs-label>\n <div\n class=\"email-body-html-default\"\n *ngIf=\"message.emailMessage.format===emailMessageFormat.HTML\">\n {{message.defaultEmailBody}}\n </div>\n <div\n *ngIf=\"message.emailMessage.format===emailMessageFormat.RichText\"\n fsEditorRenderer\n name=\"defaultEmailBody\"\n [ngModel]=\"message.defaultEmailBody\">\n </div>\n <div\n class=\"email-body-text-default\"\n *ngIf=\"message.emailMessage.format===emailMessageFormat.Text\">\n {{message.defaultEmailBody}}\n </div>\n </fs-label-field>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </mat-tab>\n\n <mat-tab label=\"SMS Message\" *ngIf=\"message.smsMessage\">\n <ng-template matTabContent>\n <mat-form-field>\n <mat-select\n required\n placeholder=\"Customize Message\"\n [(ngModel)]=\"message.smsMessage.customize\"\n name=\"customizeSms\">\n <mat-option [value]=\"true\">Yes</mat-option>\n <mat-option [value]=\"false\">No</mat-option>\n </mat-select>\n </mat-form-field>\n <div\n *ngIf=\"message.smsMessage.customize\"\n [@.disabled]=\"true\">\n <mat-tab-group [dynamicHeight]=\"false\">\n <mat-tab label=\"Content\">\n <ng-template matTabContent>\n <fs-text-editor\n [(ngModel)]=\"message.smsMessage.message\"\n name=\"smsMessageMessage\"\n [config]=\"{ language: 'text '}\">\n </fs-text-editor>\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </div>\n <fs-label-field *ngIf=\"!message.smsMessage.customize\">\n <fs-label>Message</fs-label>\n {{message.defaultSmsMessage}}\n </fs-label-field>\n </ng-template>\n </mat-tab>\n\n <mat-tab label=\"Variables\" *ngIf=\"message.variables\">\n <ng-template matTabContent>\n <div *ngFor=\"let variable of message.variables\" class=\"variable\">\n {{variable.name}}\n </div>\n </ng-template>\n </mat-tab>\n\n <mat-tab label=\"Defaults\">\n <ng-template matTabContent>\n <ng-container *ngIf=\"message.emailMessage\">\n <h2 *ngIf=\"message.emailMessage && message.smsMessage\">Email</h2>\n <fs-label-field>\n <fs-label>Subject</fs-label>\n <div class=\"content\">{{message.defaultEmailSubject}}</div>\n </fs-label-field>\n <fs-label-field>\n <fs-label>Content</fs-label>\n <div class=\"content\">{{message.defaultEmailBody}}</div>\n </fs-label-field>\n </ng-container>\n <ng-container *ngIf=\"message.smsMessage\">\n <h2 *ngIf=\"message.emailMessage && message.smsMessage\">SMS</h2>\n <fs-label-field>\n <fs-label>Content</fs-label>\n <div class=\"content\">{{message.defaultSmsMessage}}</div>\n </fs-label-field>\n </ng-container>\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n\n </mat-dialog-content>\n <mat-dialog-actions>\n <button mat-button color=\"primary\">Save</button>\n <button\n *ngIf=\"tab==='email' && message.emailMessage.format===emailMessageFormat.HTML\"\n mat-button\n type=\"button\"\n (click)=\"openPreview()\"\n type=\"button\">\n Preview\n </button>\n <button\n *ngIf=\"tab==='email'\"\n mat-button\n type=\"button\"\n (click)=\"sendTest('email')\"\n type=\"button\">\n Send Test Email\n </button>\n <button\n *ngIf=\"tab==='sms'\"\n mat-button\n type=\"button\"\n (click)=\"sendTest('sms')\"\n type=\"button\">\n Send Test SMS\n </button>\n <button mat-button [mat-dialog-close]=\"null\" type=\"button\">Cancel</button>\n </mat-dialog-actions>\n </fs-dialog>\n</form>\n", styles: ["fs-label-field .content{white-space:pre-wrap}:host ::ng-deep .mat-tab-body-content,:host ::ng-deep .mat-tab-body{overflow:visible}:host ::ng-deep .sms-message{width:100%}:host ::ng-deep .email-body-text-default,:host ::ng-deep .email-body-html-default{white-space:pre-line}.email-body-text{width:100%}.variable{margin-bottom:4px}\n"], components: [{ type: i4.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i5.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { type: i5.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby"], exportAs: ["matTab"] }, { type: i6.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i7.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i9.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["init", "blur"] }, { type: i6$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i6$1.FsLabelComponent, selector: "fs-label" }, { type: i11.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i12.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i13.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i13.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i13.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i14.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "confirmTabs", "dirtySubmitButton", "submit", "successDelay", "errorDelay", "tabGroup"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"] }, { type: i15.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i5.MatTabContent, selector: "[matTabContent]" }, { type: i16.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i17.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { type: i13.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: i13.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i13.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i13.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i14.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { type: i16.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i16.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i15.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
186
+ MessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: MessageComponent, selector: "ng-component", ngImport: i0, template: "<form\n fsForm\n [submit]=\"save\"\n #form=\"ngForm\"\n *fsSkeleton=\"message\"\n [confirmTabs]=\"false\">\n <fs-dialog *ngIf=\"message\">\n <div mat-dialog-title>Edit Message</div>\n <mat-dialog-content>\n\n <mat-tab-group (selectedTabChange)=\"tabChange($event)\">\n <mat-tab label=\"General\">\n <ng-template matTabContent>\n <div fxLayout=\"column\">\n <mat-form-field>\n <input\n matInput\n placeholder=\"Name\"\n [(ngModel)]=\"message.name\"\n name=\"Name\"\n required>\n </mat-form-field>\n <mat-form-field>\n <input\n matInput\n placeholder=\"Description\"\n [(ngModel)]=\"message.description\"\n name=\"description\">\n </mat-form-field>\n\n <div\n fxLayout=\"row\"\n fxLayoutGap=\"10px\"\n fxLayout.xs=\"column\"\n fxLayout.sm=\"column\">\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"From Email\"\n [(ngModel)]=\"message.emailMessage.fromEmail\"\n name=\"from_email\">\n </mat-form-field>\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"From Name\"\n [(ngModel)]=\"message.emailMessage.fromName\"\n name=\"from_name\">\n </mat-form-field>\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"Reply To\"\n [(ngModel)]=\"message.emailMessage.replyTo\"\n name=\"reply_to\">\n </mat-form-field>\n </div>\n\n <div\n fxLayout=\"row\"\n fxLayoutGap=\"10px\"\n fxLayout.xs=\"column\"\n fxLayout.sm=\"column\">\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"To\"\n [(ngModel)]=\"message.emailMessage.toRecipients\"\n name=\"to\">\n </mat-form-field>\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"CC\"\n [(ngModel)]=\"message.emailMessage.ccRecipients\"\n name=\"cc\">\n </mat-form-field>\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"BCC\"\n [(ngModel)]=\"message.emailMessage.bccRecipients\"\n name=\"bcc\">\n </mat-form-field>\n </div>\n </div>\n </ng-template>\n </mat-tab>\n <mat-tab label=\"Email Message\" *ngIf=\"message.emailMessage\">\n <ng-template matTabContent>\n <div fxLayout=\"column\">\n <div fxLayout=\"row\" fxLayoutGap=\"10px\">\n <mat-form-field>\n <mat-select\n required\n placeholder=\"Customize Message\"\n [(ngModel)]=\"message.emailMessage.customize\"\n name=\"customizeEmail\">\n <mat-option [value]=\"true\">Yes</mat-option>\n <mat-option [value]=\"false\">No</mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-select\n required\n placeholder=\"Format\"\n [(ngModel)]=\"message.emailMessage.format\"\n name=\"format\">\n <mat-option *ngFor=\"let item of emailMessageFormats\" [value]=\"item.value\">\n {{item.name}}\n </mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-select\n placeholder=\"Template\"\n [(ngModel)]=\"message.emailMessage.messageTemplateId\"\n name=\"template\">\n <mat-option [value]=\"null\">None</mat-option>\n <mat-option *ngFor=\"let item of messageTemplates\" [value]=\"item.id\">\n {{item.name}}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <ng-container *ngIf=\"message.emailMessage.customize\">\n <mat-form-field fxFlex>\n <input\n matInput\n placeholder=\"Subject\"\n [(ngModel)]=\"message.emailMessage.subject\"\n name=\"name\"\n required>\n </mat-form-field>\n\n <div [@.disabled]=\"true\">\n <mat-tab-group [dynamicHeight]=\"false\">\n <mat-tab label=\"Content\">\n <ng-template matTabContent>\n <fs-text-editor\n *ngIf=\"message.emailMessage.format===emailMessageFormat.HTML\"\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\"\n [config]=\"{ language: 'html '}\">\n </fs-text-editor>\n\n <fs-html-editor\n *ngIf=\"message.emailMessage.format===emailMessageFormat.RichText\"\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\">\n </fs-html-editor>\n\n <fs-text-editor\n *ngIf=\"message.emailMessage.format===emailMessageFormat.Text\"\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"emailMessageBody\"\n [config]=\"{ language: 'text' }\">\n </fs-text-editor>\n </ng-template>\n </mat-tab>\n <mat-tab\n *ngIf=\"message.emailMessage.format===emailMessageFormat.HTML || message.emailMessage.format===emailMessageFormat.RichText\"\n label=\"Styles\">\n <ng-template matTabContent>\n <fs-text-editor\n [(ngModel)]=\"message.emailMessage.styles\"\n name=\"styles\"\n [config]=\"{ language: 'scss' }\">\n </fs-text-editor>\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </div>\n\n </ng-container>\n\n <ng-container *ngIf=\"!message.emailMessage.customize\">\n <fs-label-field>\n <fs-label>Subject</fs-label>\n {{message.defaultEmailSubject}}\n </fs-label-field>\n <div>\n <fs-label-field>\n <fs-label>Content</fs-label>\n <div\n class=\"email-body-html-default\"\n *ngIf=\"message.emailMessage.format===emailMessageFormat.HTML\">\n {{message.defaultEmailBody}}\n </div>\n <fs-html-renderer\n *ngIf=\"message.emailMessage.format===emailMessageFormat.RichText\"\n [html]=\"message.defaultEmailBody\">\n </fs-html-renderer>\n <div\n class=\"email-body-text-default\"\n *ngIf=\"message.emailMessage.format===emailMessageFormat.Text\">\n {{message.defaultEmailBody}}\n </div>\n </fs-label-field>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </mat-tab>\n\n <mat-tab label=\"SMS Message\" *ngIf=\"message.smsMessage\">\n <ng-template matTabContent>\n <mat-form-field>\n <mat-select\n required\n placeholder=\"Customize Message\"\n [(ngModel)]=\"message.smsMessage.customize\"\n name=\"customizeSms\">\n <mat-option [value]=\"true\">Yes</mat-option>\n <mat-option [value]=\"false\">No</mat-option>\n </mat-select>\n </mat-form-field>\n <div\n *ngIf=\"message.smsMessage.customize\"\n [@.disabled]=\"true\">\n <mat-tab-group [dynamicHeight]=\"false\">\n <mat-tab label=\"Content\">\n <ng-template matTabContent>\n <fs-text-editor\n [(ngModel)]=\"message.smsMessage.message\"\n name=\"smsMessageMessage\"\n [config]=\"{ language: 'text '}\">\n </fs-text-editor>\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </div>\n <fs-label-field *ngIf=\"!message.smsMessage.customize\">\n <fs-label>Message</fs-label>\n {{message.defaultSmsMessage}}\n </fs-label-field>\n </ng-template>\n </mat-tab>\n\n <mat-tab label=\"Variables\" *ngIf=\"message.variables\">\n <ng-template matTabContent>\n <div *ngFor=\"let variable of message.variables\" class=\"variable\">\n {{variable.name}}\n </div>\n </ng-template>\n </mat-tab>\n\n <mat-tab label=\"Defaults\">\n <ng-template matTabContent>\n <ng-container *ngIf=\"message.emailMessage\">\n <h2 *ngIf=\"message.emailMessage && message.smsMessage\">Email</h2>\n <fs-label-field>\n <fs-label>Subject</fs-label>\n <div class=\"content\">{{message.defaultEmailSubject}}</div>\n </fs-label-field>\n <fs-label-field>\n <fs-label>Content</fs-label>\n <div class=\"content\">{{message.defaultEmailBody}}</div>\n </fs-label-field>\n </ng-container>\n <ng-container *ngIf=\"message.smsMessage\">\n <h2 *ngIf=\"message.emailMessage && message.smsMessage\">SMS</h2>\n <fs-label-field>\n <fs-label>Content</fs-label>\n <div class=\"content\">{{message.defaultSmsMessage}}</div>\n </fs-label-field>\n </ng-container>\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n\n </mat-dialog-content>\n <mat-dialog-actions>\n <button mat-button color=\"primary\">Save</button>\n <button\n *ngIf=\"tab==='email' && message.emailMessage.format===emailMessageFormat.HTML\"\n mat-button\n type=\"button\"\n (click)=\"openPreview()\"\n type=\"button\">\n Preview\n </button>\n <button\n *ngIf=\"tab==='email'\"\n mat-button\n type=\"button\"\n (click)=\"sendTest('email')\"\n type=\"button\">\n Send Test Email\n </button>\n <button\n *ngIf=\"tab==='sms'\"\n mat-button\n type=\"button\"\n (click)=\"sendTest('sms')\"\n type=\"button\">\n Send Test SMS\n </button>\n <button mat-button [mat-dialog-close]=\"null\" type=\"button\">Cancel</button>\n </mat-dialog-actions>\n </fs-dialog>\n</form>\n", styles: ["fs-label-field .content{white-space:pre-wrap}:host ::ng-deep .mat-tab-body-content,:host ::ng-deep .mat-tab-body{overflow:visible}:host ::ng-deep .sms-message{width:100%}:host ::ng-deep .email-body-text-default,:host ::ng-deep .email-body-html-default{white-space:pre-line}.email-body-text{width:100%}.variable{margin-bottom:4px}\n"], components: [{ type: i4.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i5.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { type: i5.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby"], exportAs: ["matTab"] }, { type: i6.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i7.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i9.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["init", "blur"] }, { type: i10.FsHtmlEditorComponent, selector: "fs-html-editor", inputs: ["config"] }, { type: i6$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i6$1.FsLabelComponent, selector: "fs-label" }, { type: i10.FsHtmlRendererComponent, selector: "fs-html-renderer", inputs: ["html"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i13.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i15.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "confirmTabs", "dirtySubmitButton", "submit", "successDelay", "errorDelay", "tabGroup"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"] }, { type: i16.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i5.MatTabContent, selector: "[matTabContent]" }, { type: i17.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i18.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { type: i14.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: i14.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i14.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i15.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { type: i17.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i17.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i16.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
185
187
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MessageComponent, decorators: [{
186
188
  type: Component,
187
189
  args: [{
@@ -251,7 +253,7 @@ class MessagesComponent {
251
253
  }
252
254
  }
253
255
  MessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MessagesComponent, deps: [{ token: FS_APP_MESSAGE_CONFIG }, { token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
254
- MessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: MessagesComponent, selector: "fs-app-messages", viewQueries: [{ propertyName: "list", first: true, predicate: FsListComponent, descendants: true, static: true }], ngImport: i0, template: "<fs-list [config]=\"config\">\n <fs-list-column title=\"Name\" name=\"name\" sortable=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"open(row)\">{{row.name}}</a>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Email Format\">\n <ng-template fs-list-cell let-row=\"row\">\n {{emailMessageFormats[row.emailMessage.format]}}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Email Message Template\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.emailMessage.messageTemplate?.name || 'None'}}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Customized Message\">\n <ng-template fs-list-cell let-row=\"row\">\n <ng-container *ngIf=\"row.emailMessage?.customize || row.smsMessage?.customize; else noCustomize\">\n <ng-container *ngIf=\"row.emailMessage?.customize\">\n {{row.emailMessage.customize ? 'Email' : ''}}\n </ng-container> \n <ng-container *ngIf=\"row.smsMessage?.customize\">\n {{row.smsMessage.customize ? 'SMS' : ''}}\n </ng-container> \n </ng-container>\n <ng-template #noCustomize>\n None\n </ng-template>\n </ng-template>\n </fs-list-column>\n</fs-list>\n", components: [{ type: i2$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }], directives: [{ type: i2$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i15.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
256
+ MessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: MessagesComponent, selector: "fs-app-messages", viewQueries: [{ propertyName: "list", first: true, predicate: FsListComponent, descendants: true, static: true }], ngImport: i0, template: "<fs-list [config]=\"config\">\n <fs-list-column title=\"Name\" name=\"name\" sortable=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"open(row)\">{{row.name}}</a>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Email Format\">\n <ng-template fs-list-cell let-row=\"row\">\n {{emailMessageFormats[row.emailMessage.format]}}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Email Message Template\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.emailMessage.messageTemplate?.name || 'None'}}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Customized Message\">\n <ng-template fs-list-cell let-row=\"row\">\n <ng-container *ngIf=\"row.emailMessage?.customize || row.smsMessage?.customize; else noCustomize\">\n <ng-container *ngIf=\"row.emailMessage?.customize\">\n {{row.emailMessage.customize ? 'Email' : ''}}\n </ng-container> \n <ng-container *ngIf=\"row.smsMessage?.customize\">\n {{row.smsMessage.customize ? 'SMS' : ''}}\n </ng-container> \n </ng-container>\n <ng-template #noCustomize>\n None\n </ng-template>\n </ng-template>\n </fs-list-column>\n</fs-list>\n", components: [{ type: i2$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }], directives: [{ type: i2$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i16.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
255
257
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MessagesComponent, decorators: [{
256
258
  type: Component,
257
259
  args: [{
@@ -320,7 +322,8 @@ FsAppMessagesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", ver
320
322
  FsSkeletonModule,
321
323
  FsFormModule,
322
324
  FsTextEditorModule,
323
- // FsEditorRichTextModule,
325
+ FsHtmlEditorModule,
326
+ FsHtmlRendererModule,
324
327
  FsAppMessagePreviewModule], exports: [MessagesComponent,
325
328
  MessageComponent] });
326
329
  FsAppMessagesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsAppMessagesModule, imports: [[
@@ -343,7 +346,8 @@ FsAppMessagesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", ver
343
346
  FsSkeletonModule,
344
347
  FsFormModule,
345
348
  FsTextEditorModule,
346
- // FsEditorRichTextModule,
349
+ FsHtmlEditorModule,
350
+ FsHtmlRendererModule,
347
351
  FsAppMessagePreviewModule,
348
352
  ]] });
349
353
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsAppMessagesModule, decorators: [{
@@ -369,7 +373,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
369
373
  FsSkeletonModule,
370
374
  FsFormModule,
371
375
  FsTextEditorModule,
372
- // FsEditorRichTextModule,
376
+ FsHtmlEditorModule,
377
+ FsHtmlRendererModule,
373
378
  FsAppMessagePreviewModule,
374
379
  ],
375
380
  declarations: [
@@ -439,7 +444,7 @@ class RecipientComponent {
439
444
  }
440
445
  }
441
446
  RecipientComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecipientComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
442
- RecipientComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: RecipientComponent, selector: "app-recipient", inputs: { name: "name", state: "state" }, ngImport: i0, template: "<span class=\"recipient\">\n <span class=\"name\">{{name}}</span>\n <mat-icon *ngIf=\"icon\" [class]=\"'state-' + state\" [matTooltip]=\"icon.tooltip\">{{icon.name}}</mat-icon>\n</span>", styles: ["mat-icon{font-size:14px;width:14px;height:14px;line-height:normal;margin-left:2px}mat-icon.state-S{color:#5fa099}mat-icon.state-E{color:#fbbc04}mat-icon.state-F{color:#d8524e}.recipient{display:inline-flex;align-items:center}\n"], components: [{ type: i1$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i15.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
447
+ RecipientComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: RecipientComponent, selector: "app-recipient", inputs: { name: "name", state: "state" }, ngImport: i0, template: "<span class=\"recipient\">\n <span class=\"name\">{{name}}</span>\n <mat-icon *ngIf=\"icon\" [class]=\"'state-' + state\" [matTooltip]=\"icon.tooltip\">{{icon.name}}</mat-icon>\n</span>", styles: ["mat-icon{font-size:14px;width:14px;height:14px;line-height:normal;margin-left:2px}mat-icon.state-S{color:#5fa099}mat-icon.state-E{color:#fbbc04}mat-icon.state-F{color:#d8524e}.recipient{display:inline-flex;align-items:center}\n"], components: [{ type: i1$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i16.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
443
448
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecipientComponent, decorators: [{
444
449
  type: Component,
445
450
  args: [{
@@ -614,7 +619,7 @@ class QueueComponent {
614
619
  }
615
620
  }
616
621
  QueueComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: QueueComponent, deps: [{ token: FS_APP_MESSAGE_CONFIG }, { token: i2$1.FsMessage }, { token: i1$1.FsPrompt }, { token: i1.MatDialog }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
617
- QueueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: QueueComponent, selector: "ng-component", viewQueries: [{ propertyName: "logList", first: true, predicate: ["logList"], descendants: true }], ngImport: i0, template: "<fs-dialog *fsSkeleton=\"messageQueue\">\n <div mat-dialog-title>Message Queue</div>\n <mat-dialog-content>\n <mat-tab-group>\n <mat-tab label=\"Overview\">\n <ng-template matTabContent>\n <div fxLayout=\"row wrap\" fxLayoutGap=\"25px\">\n <ng-container *ngIf=\"messageQueue.emailMessageQueue\">\n <fs-label-field>\n <fs-label>\n To Recipients\n </fs-label>\n <app-recipient \n *ngFor=\"let recipient of messageQueue.emailMessageQueue.toRecipients\"\n [state]=\"messageQueueRecipients[recipient]\"\n [name]=\"recipient\">\n </app-recipient>\n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.emailMessageQueue.ccRecipients.length\">\n <fs-label>\n CC\n </fs-label>\n <app-recipient \n *ngFor=\"let recipient of messageQueue.emailMessageQueue.ccRecipients\"\n [state]=\"messageQueueRecipients[recipient]\"\n [name]=\"recipient\">\n </app-recipient> \n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.emailMessageQueue.bccRecipients.length\">\n <fs-label>\n BCC\n </fs-label>\n <app-recipient \n *ngFor=\"let recipient of messageQueue.emailMessageQueue.bccRecipients\"\n [state]=\"messageQueueRecipients[recipient]\"\n [name]=\"recipient\">\n </app-recipient> \n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.emailMessageQueue.fromName || messageQueue.emailMessageQueue.fromEmail\">\n <fs-label>\n From\n </fs-label>\n <ng-container *ngIf=\"messageQueue.emailMessageQueue.fromName === messageQueue.emailMessageQueue.fromEmail; else fromEmailName\">\n {{messageQueue.emailMessageQueue.fromName}}\n </ng-container>\n\n <ng-template #fromEmailName>\n {{messageQueue.emailMessageQueue.fromName}}\n <ng-container *ngIf=\"messageQueue.emailMessageQueue.fromEmail\">\n ({{messageQueue.emailMessageQueue.fromEmail}})\n </ng-container>\n </ng-template>\n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.emailMessageQueue.replyEmail && messageQueue.emailMessageQueue.replyEmail.length\">\n <fs-label>\n Reply To\n </fs-label>\n {{messageQueue.emailMessageQueue.replyEmail.join(', ')}}\n </fs-label-field>\n </ng-container>\n\n <ng-container *ngIf=\"messageQueue.smsMessageQueue\">\n <fs-label-field>\n <fs-label>\n To Number\n </fs-label>\n <app-recipient \n [state]=\"messageQueue.state\"\n [name]=\"messageQueue.smsMessageQueue.toNumber\">\n </app-recipient> \n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.smsMessageQueue.fromNumber\">\n <fs-label>\n From Number\n </fs-label>\n {{messageQueue.smsMessageQueue.fromNumber}}\n </fs-label-field>\n </ng-container>\n \n <fs-label-field>\n <fs-label>\n Date\n </fs-label>\n {{messageQueue.scheduledDate | fsDateFormat: 'full-date-time'}}\n </fs-label-field>\n\n <fs-label-field>\n <fs-label>\n Status\n </fs-label>\n {{messageQueueStates[messageQueue.state]}}\n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.message\">\n <fs-label>\n Message Type\n </fs-label>\n <a\n (click)=\"openMessage(messageQueue.message)\"\n *ngIf=\"loadMessage; else elseMessage\">\n {{messageQueue.message.name}}\n </a>\n <ng-template #elseMessage>\n {{messageQueue.message.name}}\n </ng-template>\n </fs-label-field>\n </div>\n\n <ng-container *ngIf=\"messageQueue.emailMessageQueue\">\n <fs-label-field class=\"subject\">\n <fs-label>\n Subject\n </fs-label>\n {{messageQueue.emailMessageQueue.subject}}\n </fs-label-field>\n\n <fs-label-field class=\"body\">\n <fs-label>\n Body\n </fs-label>\n <div\n *ngIf=\"messageQueue.emailMessageQueue.format===emailMessageQueueFormat.Text\"\n class=\"format-text\"\n [innerHTML]=\"messageQueue.emailMessageQueue.body\">\n </div>\n <fs-iframe\n *ngIf=\"messageQueue.emailMessageQueue.format===emailMessageQueueFormat.HTML || messageQueue.emailMessageQueue.format===emailMessageQueueFormat.RichText\"\n [html]=\"messageQueue.emailMessageQueue.body\">\n </fs-iframe>\n </fs-label-field>\n </ng-container>\n\n <ng-container *ngIf=\"messageQueue.smsMessageQueue\">\n <fs-label-field>\n <fs-label>\n Message\n </fs-label>\n <div\n class=\"format-text\"\n [innerHTML]=\"messageQueue.smsMessageQueue.body\">\n </div>\n </fs-label-field>\n </ng-container>\n\n </ng-template>\n </mat-tab>\n <mat-tab label=\"Logs\">\n <ng-template matTabContent>\n <fs-list [config]=\"logConfig\" #logList>\n <fs-list-column title=\"Message\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.message}}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Date\">\n <ng-template fs-list-cell let-row=\"row\">\n <fs-date-ago [date]=\"row.createdDate\"></fs-date-ago>\n </ng-template>\n </fs-list-column>\n </fs-list>\n </ng-template>\n </mat-tab>\n <mat-tab label=\"Attachments\">\n <ng-template matTabContent>\n <fs-list [config]=\"attachmentConfig\">\n <fs-list-column title=\"File Name\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.filename}}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"File Size\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.prettyFilesize}}\n </ng-template>\n </fs-list-column>\n </fs-list>\n </ng-template>\n </mat-tab>\n <mat-tab label=\"Events\">\n <ng-template matTabContent>\n <fs-list [config]=\"eventConfig\">\n <fs-list-column title=\"Recipient\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.messageQueueRecipient.recipient}}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Event\">\n <ng-template fs-list-cell let-row=\"row\">\n {{MessageQueueEventTypes[row.type]}}\n <div class=\"small\" *ngIf=\"row.type === MessageQueueEventType.Click\">\n <a [href]=\"row.meta?.url\" target=\"_blank\">{{row.meta?.url}}</a>\n </div>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Date\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.createDate | fsDateFormat: 'date-time-yearless'}}\n </ng-template>\n </fs-list-column>\n </fs-list>\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </mat-dialog-content>\n <mat-dialog-actions>\n <button\n mat-button\n [mat-dialog-close]=\"null\"\n color=\"primary\">\n Done\n </button>\n <button\n mat-button\n *ngIf=\"resendMessageQueue\"\n type=\"button\"\n (click)=\"resend()\"\n type=\"button\">\n Resend\n </button>\n <button\n mat-button\n *ngIf=\"forwardMessageQueue\"\n type=\"button\"\n (click)=\"forward()\"\n type=\"button\">\n Forward\n </button>\n </mat-dialog-actions>\n</fs-dialog>\n", styles: [".subject,.body{display:block;margin-top:15px}.body .format-text{white-space:pre-wrap}.body .body-frame{border:0}.body ::ng-deep .field-label{margin-bottom:10px}app-recipient{display:block}[hidden]{display:none!important}\n"], components: [{ type: i4.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i5.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { type: i5.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby"], exportAs: ["matTab"] }, { type: i6$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i6$1.FsLabelComponent, selector: "fs-label" }, { type: RecipientComponent, selector: "app-recipient", inputs: ["name", "state"] }, { type: i2.FsIFrameComponent, selector: "fs-iframe", inputs: ["html", "styles"] }, { type: i2$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i10.FsDateAgoComponent, selector: "fs-date-ago", inputs: ["date", "showTime", "format", "showTooltip", "tooltipDateFormat"] }, { type: i11.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i12.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i5.MatTabContent, selector: "[matTabContent]" }, { type: i16.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i16.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i15.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i15.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "fsDateFormat": i10.FsDateFormatPipe } });
622
+ QueueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: QueueComponent, selector: "ng-component", viewQueries: [{ propertyName: "logList", first: true, predicate: ["logList"], descendants: true }], ngImport: i0, template: "<fs-dialog *fsSkeleton=\"messageQueue\">\n <div mat-dialog-title>Message Queue</div>\n <mat-dialog-content>\n <mat-tab-group>\n <mat-tab label=\"Overview\">\n <ng-template matTabContent>\n <div fxLayout=\"row wrap\" fxLayoutGap=\"25px\">\n <ng-container *ngIf=\"messageQueue.emailMessageQueue\">\n <fs-label-field>\n <fs-label>\n To Recipients\n </fs-label>\n <app-recipient \n *ngFor=\"let recipient of messageQueue.emailMessageQueue.toRecipients\"\n [state]=\"messageQueueRecipients[recipient]\"\n [name]=\"recipient\">\n </app-recipient>\n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.emailMessageQueue.ccRecipients.length\">\n <fs-label>\n CC\n </fs-label>\n <app-recipient \n *ngFor=\"let recipient of messageQueue.emailMessageQueue.ccRecipients\"\n [state]=\"messageQueueRecipients[recipient]\"\n [name]=\"recipient\">\n </app-recipient> \n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.emailMessageQueue.bccRecipients.length\">\n <fs-label>\n BCC\n </fs-label>\n <app-recipient \n *ngFor=\"let recipient of messageQueue.emailMessageQueue.bccRecipients\"\n [state]=\"messageQueueRecipients[recipient]\"\n [name]=\"recipient\">\n </app-recipient> \n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.emailMessageQueue.fromName || messageQueue.emailMessageQueue.fromEmail\">\n <fs-label>\n From\n </fs-label>\n <ng-container *ngIf=\"messageQueue.emailMessageQueue.fromName === messageQueue.emailMessageQueue.fromEmail; else fromEmailName\">\n {{messageQueue.emailMessageQueue.fromName}}\n </ng-container>\n\n <ng-template #fromEmailName>\n {{messageQueue.emailMessageQueue.fromName}}\n <ng-container *ngIf=\"messageQueue.emailMessageQueue.fromEmail\">\n ({{messageQueue.emailMessageQueue.fromEmail}})\n </ng-container>\n </ng-template>\n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.emailMessageQueue.replyEmail && messageQueue.emailMessageQueue.replyEmail.length\">\n <fs-label>\n Reply To\n </fs-label>\n {{messageQueue.emailMessageQueue.replyEmail.join(', ')}}\n </fs-label-field>\n </ng-container>\n\n <ng-container *ngIf=\"messageQueue.smsMessageQueue\">\n <fs-label-field>\n <fs-label>\n To Number\n </fs-label>\n <app-recipient \n [state]=\"messageQueue.state\"\n [name]=\"messageQueue.smsMessageQueue.toNumber\">\n </app-recipient> \n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.smsMessageQueue.fromNumber\">\n <fs-label>\n From Number\n </fs-label>\n {{messageQueue.smsMessageQueue.fromNumber}}\n </fs-label-field>\n </ng-container>\n \n <fs-label-field>\n <fs-label>\n Date\n </fs-label>\n {{messageQueue.scheduledDate | fsDateFormat: 'full-date-time'}}\n </fs-label-field>\n\n <fs-label-field>\n <fs-label>\n Status\n </fs-label>\n {{messageQueueStates[messageQueue.state]}}\n </fs-label-field>\n\n <fs-label-field *ngIf=\"messageQueue.message\">\n <fs-label>\n Message Type\n </fs-label>\n <a\n (click)=\"openMessage(messageQueue.message)\"\n *ngIf=\"loadMessage; else elseMessage\">\n {{messageQueue.message.name}}\n </a>\n <ng-template #elseMessage>\n {{messageQueue.message.name}}\n </ng-template>\n </fs-label-field>\n </div>\n\n <ng-container *ngIf=\"messageQueue.emailMessageQueue\">\n <fs-label-field class=\"subject\">\n <fs-label>\n Subject\n </fs-label>\n {{messageQueue.emailMessageQueue.subject}}\n </fs-label-field>\n\n <fs-label-field class=\"body\">\n <fs-label>\n Body\n </fs-label>\n <div\n *ngIf=\"messageQueue.emailMessageQueue.format===emailMessageQueueFormat.Text\"\n class=\"format-text\"\n [innerHTML]=\"messageQueue.emailMessageQueue.body\">\n </div>\n <fs-iframe\n *ngIf=\"messageQueue.emailMessageQueue.format===emailMessageQueueFormat.HTML || messageQueue.emailMessageQueue.format===emailMessageQueueFormat.RichText\"\n [html]=\"messageQueue.emailMessageQueue.body\">\n </fs-iframe>\n </fs-label-field>\n </ng-container>\n\n <ng-container *ngIf=\"messageQueue.smsMessageQueue\">\n <fs-label-field>\n <fs-label>\n Message\n </fs-label>\n <div\n class=\"format-text\"\n [innerHTML]=\"messageQueue.smsMessageQueue.body\">\n </div>\n </fs-label-field>\n </ng-container>\n\n </ng-template>\n </mat-tab>\n <mat-tab label=\"Logs\">\n <ng-template matTabContent>\n <fs-list [config]=\"logConfig\" #logList>\n <fs-list-column title=\"Message\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.message}}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Date\">\n <ng-template fs-list-cell let-row=\"row\">\n <fs-date-ago [date]=\"row.createdDate\"></fs-date-ago>\n </ng-template>\n </fs-list-column>\n </fs-list>\n </ng-template>\n </mat-tab>\n <mat-tab label=\"Attachments\">\n <ng-template matTabContent>\n <fs-list [config]=\"attachmentConfig\">\n <fs-list-column title=\"File Name\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.filename}}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"File Size\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.prettyFilesize}}\n </ng-template>\n </fs-list-column>\n </fs-list>\n </ng-template>\n </mat-tab>\n <mat-tab label=\"Events\">\n <ng-template matTabContent>\n <fs-list [config]=\"eventConfig\">\n <fs-list-column title=\"Recipient\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.messageQueueRecipient.recipient}}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Event\">\n <ng-template fs-list-cell let-row=\"row\">\n {{MessageQueueEventTypes[row.type]}}\n <div class=\"small\" *ngIf=\"row.type === MessageQueueEventType.Click\">\n <a [href]=\"row.meta?.url\" target=\"_blank\">{{row.meta?.url}}</a>\n </div>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Date\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.createDate | fsDateFormat: 'date-time-yearless'}}\n </ng-template>\n </fs-list-column>\n </fs-list>\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </mat-dialog-content>\n <mat-dialog-actions>\n <button\n mat-button\n [mat-dialog-close]=\"null\"\n color=\"primary\">\n Done\n </button>\n <button\n mat-button\n *ngIf=\"resendMessageQueue\"\n type=\"button\"\n (click)=\"resend()\"\n type=\"button\">\n Resend\n </button>\n <button\n mat-button\n *ngIf=\"forwardMessageQueue\"\n type=\"button\"\n (click)=\"forward()\"\n type=\"button\">\n Forward\n </button>\n </mat-dialog-actions>\n</fs-dialog>\n", styles: [".subject,.body{display:block;margin-top:15px}.body .format-text{white-space:pre-wrap}.body .body-frame{border:0}.body ::ng-deep .field-label{margin-bottom:10px}app-recipient{display:block}[hidden]{display:none!important}\n"], components: [{ type: i4.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i5.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { type: i5.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby"], exportAs: ["matTab"] }, { type: i6$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i6$1.FsLabelComponent, selector: "fs-label" }, { type: RecipientComponent, selector: "app-recipient", inputs: ["name", "state"] }, { type: i2.FsIFrameComponent, selector: "fs-iframe", inputs: ["html", "styles"] }, { type: i2$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i10$1.FsDateAgoComponent, selector: "fs-date-ago", inputs: ["date", "showTime", "format", "showTooltip", "tooltipDateFormat"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i13.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i5.MatTabContent, selector: "[matTabContent]" }, { type: i17.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i17.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i16.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i16.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "fsDateFormat": i10$1.FsDateFormatPipe } });
618
623
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: QueueComponent, decorators: [{
619
624
  type: Component,
620
625
  args: [{
@@ -780,7 +785,7 @@ class QueuesComponent {
780
785
  }
781
786
  }
782
787
  QueuesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: QueuesComponent, deps: [{ token: FS_APP_MESSAGE_CONFIG }, { token: i1.MatDialog }, { token: FsMessageQueueService }], target: i0.ɵɵFactoryTarget.Component });
783
- QueuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: QueuesComponent, selector: "fs-app-message-queues", inputs: { query: "query" }, viewQueries: [{ propertyName: "list", first: true, predicate: FsListComponent, descendants: true, static: true }], ngImport: i0, template: "<fs-list [config]=\"config\" #list>\n <fs-list-column title=\"Message\" name=\"subject\" sortable=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <ng-container *ngIf=\"row.emailMessageQueue\">\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\n <a (click)=\"open(row)\">{{row.emailMessageQueue.subject|truncate:100}}</a>\n <mat-icon *ngIf=\"row.messageQueueAttachmentCount\" [matTooltip]=\"row.messageQueueAttachmentCount + ' Attachment(s)'\">attach_file</mat-icon>\n </div>\n </ng-container>\n <ng-container *ngIf=\"row.smsMessageQueue\">\n <a (click)=\"open(row)\">{{row.smsMessageQueue.body|truncate:100}}</a>\n </ng-container>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Recipients\" class=\"col-recipients\">\n <ng-template fs-list-cell let-row=\"row\">\n <ng-container *ngIf=\"row.emailMessageQueue\">\n <ng-container *ngIf=\"row.emailMessageQueue.toRecipients.length; else unspecified\">\n <div class=\"small\" *ngFor=\"let recipient of row.emailMessageQueue.toRecipients\">\n <app-recipient \n [state]=\"row.messageQueueRecipients[recipient] || row.state\"\n [name]=\"recipient\">\n </app-recipient>\n </div>\n </ng-container>\n <div class=\"small\" *ngFor=\"let recipient of row.emailMessageQueue.ccRecipients\">\n <app-recipient \n [state]=\"row.messageQueueRecipients[recipient] || row.state\"\n [name]=\"recipient\">\n </app-recipient>\n </div>\n <div class=\"small\" *ngFor=\"let recipient of row.emailMessageQueue.bccRecipients\">\n <app-recipient \n [state]=\"row.messageQueueRecipients[recipient] || row.state\"\n [name]=\"recipient\">\n </app-recipient>\n </div>\n </ng-container>\n <ng-container *ngIf=\"row.smsMessageQueue\">\n <ng-container *ngIf=\"row.smsMessageQueue.toNumber; else unspecified\">\n <app-recipient \n class=\"small\"\n [state]=\"row.state\"\n [name]=\"row.smsMessageQueue.toNumber\">\n </app-recipient>\n </ng-container>\n </ng-container>\n </ng-template>\n </fs-list-column> \n <fs-list-column title=\"Status\" class=\"col-state\">\n <ng-template fs-list-cell let-row=\"row\">\n <span [class]=\"'state-' + row.state\">{{messageQueueStates[row.state]}}</span>\n </ng-template>\n </fs-list-column> \n <fs-list-column title=\"Date\" name=\"created_date\" sortable=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n {{ row.createdDate | fsDateFormat: 'date-time-yeardiff' }}\n </ng-template>\n </fs-list-column>\n</fs-list>\n\n<ng-template #unspecified>\n <app-recipient \n class=\"small\"\n [state]=\"MessageQueueState.Failed\"\n name=\"Unspecified\">\n </app-recipient>\n</ng-template>", styles: [":host ::ng-deep .col-recipients small+small:before{content:\", \"}:host ::ng-deep .col-state .state-F,:host ::ng-deep .col-state .state-P{color:#d8524e}\n"], components: [{ type: i2$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i1$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: RecipientComponent, selector: "app-recipient", inputs: ["name", "state"] }], directives: [{ type: i2$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i15.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i16.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i16.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i15.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "truncate": TruncatePipe, "fsDateFormat": i10.FsDateFormatPipe } });
788
+ QueuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: QueuesComponent, selector: "fs-app-message-queues", inputs: { query: "query" }, viewQueries: [{ propertyName: "list", first: true, predicate: FsListComponent, descendants: true, static: true }], ngImport: i0, template: "<fs-list [config]=\"config\" #list>\n <fs-list-column title=\"Message\" name=\"subject\" sortable=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <ng-container *ngIf=\"row.emailMessageQueue\">\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\n <a (click)=\"open(row)\">{{row.emailMessageQueue.subject|truncate:100}}</a>\n <mat-icon *ngIf=\"row.messageQueueAttachmentCount\" [matTooltip]=\"row.messageQueueAttachmentCount + ' Attachment(s)'\">attach_file</mat-icon>\n </div>\n </ng-container>\n <ng-container *ngIf=\"row.smsMessageQueue\">\n <a (click)=\"open(row)\">{{row.smsMessageQueue.body|truncate:100}}</a>\n </ng-container>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Recipients\" class=\"col-recipients\">\n <ng-template fs-list-cell let-row=\"row\">\n <ng-container *ngIf=\"row.emailMessageQueue\">\n <ng-container *ngIf=\"row.emailMessageQueue.toRecipients.length; else unspecified\">\n <div class=\"small\" *ngFor=\"let recipient of row.emailMessageQueue.toRecipients\">\n <app-recipient \n [state]=\"row.messageQueueRecipients[recipient] || row.state\"\n [name]=\"recipient\">\n </app-recipient>\n </div>\n </ng-container>\n <div class=\"small\" *ngFor=\"let recipient of row.emailMessageQueue.ccRecipients\">\n <app-recipient \n [state]=\"row.messageQueueRecipients[recipient] || row.state\"\n [name]=\"recipient\">\n </app-recipient>\n </div>\n <div class=\"small\" *ngFor=\"let recipient of row.emailMessageQueue.bccRecipients\">\n <app-recipient \n [state]=\"row.messageQueueRecipients[recipient] || row.state\"\n [name]=\"recipient\">\n </app-recipient>\n </div>\n </ng-container>\n <ng-container *ngIf=\"row.smsMessageQueue\">\n <ng-container *ngIf=\"row.smsMessageQueue.toNumber; else unspecified\">\n <app-recipient \n class=\"small\"\n [state]=\"row.state\"\n [name]=\"row.smsMessageQueue.toNumber\">\n </app-recipient>\n </ng-container>\n </ng-container>\n </ng-template>\n </fs-list-column> \n <fs-list-column title=\"Status\" class=\"col-state\">\n <ng-template fs-list-cell let-row=\"row\">\n <span [class]=\"'state-' + row.state\">{{messageQueueStates[row.state]}}</span>\n </ng-template>\n </fs-list-column> \n <fs-list-column title=\"Date\" name=\"created_date\" sortable=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n {{ row.createdDate | fsDateFormat: 'date-time-yeardiff' }}\n </ng-template>\n </fs-list-column>\n</fs-list>\n\n<ng-template #unspecified>\n <app-recipient \n class=\"small\"\n [state]=\"MessageQueueState.Failed\"\n name=\"Unspecified\">\n </app-recipient>\n</ng-template>", styles: [":host ::ng-deep .col-recipients small+small:before{content:\", \"}:host ::ng-deep .col-state .state-F,:host ::ng-deep .col-state .state-P{color:#d8524e}\n"], components: [{ type: i2$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i1$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: RecipientComponent, selector: "app-recipient", inputs: ["name", "state"] }], directives: [{ type: i2$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i16.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i17.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i17.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i16.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "truncate": TruncatePipe, "fsDateFormat": i10$1.FsDateFormatPipe } });
784
789
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: QueuesComponent, decorators: [{
785
790
  type: Component,
786
791
  args: [{
@@ -958,7 +963,7 @@ class TemplateComponent {
958
963
  }
959
964
  }
960
965
  TemplateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TemplateComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: FS_APP_MESSAGE_CONFIG }, { token: i1.MatDialogRef }, { token: i2$1.FsMessage }, { token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
961
- TemplateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TemplateComponent, selector: "ng-component", ngImport: i0, template: "<form\n fsForm\n [submit]=\"save\"\n #form=\"ngForm\"\n *fsSkeleton=\"messageTemplate\"\n [confirmTabs]=\"false\">\n <fs-dialog *ngIf=\"messageTemplate\">\n <div mat-dialog-title>Message Template</div>\n <mat-dialog-content>\n <mat-form-field class=\"name\">\n <input\n matInput\n placeholder=\"Name\"\n [(ngModel)]=\"messageTemplate.name\"\n name=\"name\"\n >\n </mat-form-field>\n <div [@.disabled]=\"true\">\n <mat-tab-group\n mat-align-tabs=\"start\"\n [dynamicHeight]=\"false\">\n <mat-tab label=\"Content\">\n <ng-template matTabContent>\n <div class=\"content\">\n <fs-label-field>\n <fs-text-editor\n [(ngModel)]=\"messageTemplate.content\"\n name=\"body\"\n [config]=\"htmlEditorconfig\">\n </fs-text-editor>\n <fs-label-message>\n &#123;$content&#125; will be replaced with the message content.\n </fs-label-message>\n </fs-label-field>\n </div>\n </ng-template>\n </mat-tab>\n <mat-tab label=\"Styles\">\n <ng-template matTabContent>\n <div class=\"styles\">\n <fs-text-editor\n [(ngModel)]=\"messageTemplate.styles\"\n name=\"styles\"\n [config]=\"cssEditorconfig\">\n </fs-text-editor>\n </div>\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </div>\n </mat-dialog-content>\n <mat-dialog-actions>\n <button mat-button color=\"primary\" name=\"close\">Save</button>\n <button mat-button name=\"save-close\">Save & Close</button>\n <button mat-button (click)=\"openPreview()\" type=\"button\">Preview</button>\n <button mat-button [mat-dialog-close]=\"null\" type=\"button\">Cancel</button>\n </mat-dialog-actions>\n </fs-dialog>\n</form>\n", styles: [".name{width:100%}:host ::ng-deep .mat-tab-body-content,:host ::ng-deep .mat-tab-body{overflow:visible}\n"], components: [{ type: i4.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i6.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i5.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { type: i5.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby"], exportAs: ["matTab"] }, { type: i6$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i9.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["init", "blur"] }, { type: i6$1.FsLabelMessageComponent, selector: "fs-label-message" }, { type: i11.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i12.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i13.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i13.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i13.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i14.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "confirmTabs", "dirtySubmitButton", "submit", "successDelay", "errorDelay", "tabGroup"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"] }, { type: i15.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i17.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { type: i13.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: i13.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i13.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5.MatTabContent, selector: "[matTabContent]" }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }] });
966
+ TemplateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TemplateComponent, selector: "ng-component", ngImport: i0, template: "<form\n fsForm\n [submit]=\"save\"\n #form=\"ngForm\"\n *fsSkeleton=\"messageTemplate\"\n [confirmTabs]=\"false\">\n <fs-dialog *ngIf=\"messageTemplate\">\n <div mat-dialog-title>Message Template</div>\n <mat-dialog-content>\n <mat-form-field class=\"name\">\n <input\n matInput\n placeholder=\"Name\"\n [(ngModel)]=\"messageTemplate.name\"\n name=\"name\"\n >\n </mat-form-field>\n <div [@.disabled]=\"true\">\n <mat-tab-group\n mat-align-tabs=\"start\"\n [dynamicHeight]=\"false\">\n <mat-tab label=\"Content\">\n <ng-template matTabContent>\n <div class=\"content\">\n <fs-label-field>\n <fs-text-editor\n [(ngModel)]=\"messageTemplate.content\"\n name=\"body\"\n [config]=\"htmlEditorconfig\">\n </fs-text-editor>\n <fs-label-message>\n &#123;$content&#125; will be replaced with the message content.\n </fs-label-message>\n </fs-label-field>\n </div>\n </ng-template>\n </mat-tab>\n <mat-tab label=\"Styles\">\n <ng-template matTabContent>\n <div class=\"styles\">\n <fs-text-editor\n [(ngModel)]=\"messageTemplate.styles\"\n name=\"styles\"\n [config]=\"cssEditorconfig\">\n </fs-text-editor>\n </div>\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </div>\n </mat-dialog-content>\n <mat-dialog-actions>\n <button mat-button color=\"primary\" name=\"close\">Save</button>\n <button mat-button name=\"save-close\">Save & Close</button>\n <button mat-button (click)=\"openPreview()\" type=\"button\">Preview</button>\n <button mat-button [mat-dialog-close]=\"null\" type=\"button\">Cancel</button>\n </mat-dialog-actions>\n </fs-dialog>\n</form>\n", styles: [".name{width:100%}:host ::ng-deep .mat-tab-body-content,:host ::ng-deep .mat-tab-body{overflow:visible}\n"], components: [{ type: i4.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i6.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i5.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { type: i5.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby"], exportAs: ["matTab"] }, { type: i6$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i9.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["init", "blur"] }, { type: i6$1.FsLabelMessageComponent, selector: "fs-label-message" }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i13.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i15.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "confirmTabs", "dirtySubmitButton", "submit", "successDelay", "errorDelay", "tabGroup"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"] }, { type: i16.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i18.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { type: i14.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: i14.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5.MatTabContent, selector: "[matTabContent]" }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }] });
962
967
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TemplateComponent, decorators: [{
963
968
  type: Component,
964
969
  args: [{
@@ -1171,7 +1176,7 @@ class WebhooksComponent {
1171
1176
  }
1172
1177
  }
1173
1178
  WebhooksComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: WebhooksComponent, deps: [{ token: FS_APP_MESSAGE_CONFIG }, { token: i2$1.FsMessage }], target: i0.ɵɵFactoryTarget.Component });
1174
- WebhooksComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: WebhooksComponent, selector: "fs-app-message-webhooks", viewQueries: [{ propertyName: "list", first: true, predicate: FsListComponent, descendants: true }], ngImport: i0, template: "<fs-list [config]=\"listConfig\">\r\n <fs-list-column title=\"URL\">\r\n <ng-template fs-list-cell let-row=\"row\">\r\n {{row.url}}\r\n </ng-template>\r\n </fs-list-column>\r\n <fs-list-column title=\"Created\">\r\n <ng-template fs-list-cell let-row=\"row\">\r\n {{row.createDate | fsDate}}\r\n </ng-template>\r\n </fs-list-column>\r\n</fs-list>", components: [{ type: i2$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }], directives: [{ type: i2$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }], pipes: { "fsDate": i10.FsDatePipe } });
1179
+ WebhooksComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: WebhooksComponent, selector: "fs-app-message-webhooks", viewQueries: [{ propertyName: "list", first: true, predicate: FsListComponent, descendants: true }], ngImport: i0, template: "<fs-list [config]=\"listConfig\">\r\n <fs-list-column title=\"URL\">\r\n <ng-template fs-list-cell let-row=\"row\">\r\n {{row.url}}\r\n </ng-template>\r\n </fs-list-column>\r\n <fs-list-column title=\"Created\">\r\n <ng-template fs-list-cell let-row=\"row\">\r\n {{row.createDate | fsDate}}\r\n </ng-template>\r\n </fs-list-column>\r\n</fs-list>", components: [{ type: i2$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }], directives: [{ type: i2$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }], pipes: { "fsDate": i10$1.FsDatePipe } });
1175
1180
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: WebhooksComponent, decorators: [{
1176
1181
  type: Component,
1177
1182
  args: [{